From e3ec718f6e6f9794dcd90651a64021f62655b0c0 Mon Sep 17 00:00:00 2001
From: Manish Dahamiwal <mdhamiwal@gmail.com>
Date: Wed, 24 May 2017 13:40:58 +0530
Subject: [PATCH 0001/1641] Spinner: [a11y] support for status announcements
 (#1680)

* Spinner: accessibility improvement

* change log

* minor typos

* typed ariaLive

* addressing comments

* using ms-u-screenReaderOnly
---
 ...spinner-accessiblity_2017-05-02-18-52.json | 10 ++++++++
 .../src/components/Spinner/Spinner.Props.ts   | 16 +++++++++++--
 .../src/components/Spinner/Spinner.scss       |  6 ++++-
 .../src/components/Spinner/Spinner.tsx        | 24 +++++++++++++------
 .../examples/Spinner.Basic.Example.tsx        |  2 +-
 5 files changed, 47 insertions(+), 11 deletions(-)
 create mode 100644 common/changes/spinner-accessiblity_2017-05-02-18-52.json

diff --git a/common/changes/spinner-accessiblity_2017-05-02-18-52.json b/common/changes/spinner-accessiblity_2017-05-02-18-52.json
new file mode 100644
index 0000000000000..e89b96422c15a
--- /dev/null
+++ b/common/changes/spinner-accessiblity_2017-05-02-18-52.json
@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Spinner: support for status announcement",
+      "type": "minor"
+    }
+  ],
+  "email": "manishda@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.Props.ts b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.Props.ts
index ff5c92084049f..998e7a387f247 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.Props.ts
@@ -25,14 +25,26 @@ export interface ISpinnerProps extends React.Props<Spinner> {
   size?: SpinnerSize;
 
   /**
-  * The label to show next to the Spinner.
-  */
+   * The label to show next to the Spinner. Label updates will be announced to the screen readers.
+   * Use ariaLive to control politeness level.
+   */
   label?: string;
 
   /**
    * Additional CSS class(es) to apply to the Spinner.
    */
   className?: string;
+
+  /**
+   * Politeness setting for label update announcement.
+   * @default polite
+   */
+  ariaLive?: 'assertive' | 'polite' | 'off';
+
+  /**
+   * Alternative status label for screen reader
+   */
+  ariaLabel?: string;
 }
 
 export enum SpinnerSize {
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss
index f92a3ebaf347c..b4d0105284352 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss
+++ b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss
@@ -48,11 +48,15 @@ $borderSize: 1.5px;
       height: 28px;
     }
   }
-  > .label {
+  .label {
       color: $ms-color-themePrimary;
       margin-top: 10px;
       text-align: center;
   }
+
+  .screenReaderOnly {
+    @include ms-u-screenReaderOnly;
+  }
 }
 
 @media screen and (-ms-high-contrast: active) {
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx
index 87c807ecb671a..04633f55b5cc5 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx
+++ b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx
@@ -1,16 +1,18 @@
 import * as React from 'react';
-import { BaseComponent, css } from '../../Utilities';
+import { BaseComponent, css, DelayedRender } from '../../Utilities';
 import { ISpinnerProps, SpinnerType, SpinnerSize } from './Spinner.Props';
 import * as stylesImport from './Spinner.scss';
 const styles: any = stylesImport;
 
 export class Spinner extends BaseComponent<ISpinnerProps, any> {
   public static defaultProps: ISpinnerProps = {
-    size: SpinnerSize.medium
+    size: SpinnerSize.medium,
+    ariaLive: 'polite'
   };
 
   public render() {
-    let { type, size, label, className } = this.props; // TODO remove deprecated type property at >= 2.0.0
+    let { type, size, label, className, ariaLive, ariaLabel } = this.props; // TODO remove deprecated type property at >= 2.0.0
+    const statusMessage = ariaLabel || label;
 
     return (
       <div className={ css('ms-Spinner', styles.root, className) }>
@@ -25,10 +27,18 @@ export class Spinner extends BaseComponent<ISpinnerProps, any> {
           })
         }>
         </div>
-        { label && (
-          <div className={ css('ms-Spinner-label', styles.label) }>{ label }</div>
-        ) }
-      </div >
+        {
+          label && <div className={ css('ms-Spinner-label', styles.label) }>{ label }</div>
+        }
+        {
+          statusMessage &&
+          <div role='status' aria-live={ this.props.ariaLive }>
+            <DelayedRender>
+              <div className={ styles.screenReaderOnly }>{ statusMessage }</div>
+            </DelayedRender>
+          </div>
+        }
+      </div>
     );
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/examples/Spinner.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Spinner/examples/Spinner.Basic.Example.tsx
index 2acfb446a0f6c..48c586c10194f 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/examples/Spinner.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Spinner/examples/Spinner.Basic.Example.tsx
@@ -26,7 +26,7 @@ export class SpinnerBasicExample extends React.Component<any, any> {
         <Spinner label='I am definitely loading...' />
 
         <Label>Large Spinner With Label</Label>
-        <Spinner size={ SpinnerSize.large } label='Seriously, still loading...' />
+        <Spinner size={ SpinnerSize.large } label='Seriously, still loading...' ariaLive='assertive' />
       </div>
     );
   }

From 2c49eca4b9842b22dbbda47817edd571206fd2a9 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 24 May 2017 12:47:09 -0700
Subject: [PATCH 0002/1641] Search box onblur (#1854)

* Fixed searchbox on blur not working

* Change file

* remove unused imports
---
 .../search-box-onblur_2017-05-24-16-13.json   | 10 +++++++++
 .../src/components/SearchBox/SearchBox.tsx    | 21 ++++++++-----------
 2 files changed, 19 insertions(+), 12 deletions(-)
 create mode 100644 common/changes/search-box-onblur_2017-05-24-16-13.json

diff --git a/common/changes/search-box-onblur_2017-05-24-16-13.json b/common/changes/search-box-onblur_2017-05-24-16-13.json
new file mode 100644
index 0000000000000..467e99375bbfb
--- /dev/null
+++ b/common/changes/search-box-onblur_2017-05-24-16-13.json
@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SearchBox: Fixed onBlur not removing focus",
+      "type": "patch"
+    }
+  ],
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
index 2f43af1f0be95..09411429afda1 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
@@ -5,8 +5,6 @@ import {
   autobind,
   css,
   getId,
-  elementContains,
-  getDocument,
   KeyCodes
 } from '../../Utilities';
 
@@ -113,7 +111,7 @@ export class SearchBox extends BaseComponent<ISearchBoxProps, ISearchBoxState> {
       hasFocus: true
     });
 
-    this._events.on(getDocument().body, 'focus', this._handleDocumentFocus, true);
+    this._events.on(this._rootElement, 'blur', this._onBlur, true);
   }
 
   @autobind
@@ -139,6 +137,14 @@ export class SearchBox extends BaseComponent<ISearchBoxProps, ISearchBoxState> {
     ev.stopPropagation();
   }
 
+  @autobind
+  private _onBlur(ev: React.ChangeEvent<HTMLInputElement>) {
+    this._events.off(this._rootElement, 'blur');
+    this.setState({
+      hasFocus: false
+    });
+  }
+
   @autobind
   private _onInputChange(ev: React.ChangeEvent<HTMLInputElement>) {
     const value = this._inputElement.value;
@@ -151,15 +157,6 @@ export class SearchBox extends BaseComponent<ISearchBoxProps, ISearchBoxState> {
     this._callOnChange(value);
   }
 
-  private _handleDocumentFocus(ev: FocusEvent) {
-    if (!elementContains(this._rootElement, ev.target as HTMLElement)) {
-      this._events.off(getDocument().body, 'focus');
-      this.setState({
-        hasFocus: false
-      });
-    }
-  }
-
   private _callOnChange(newValue: string): void {
     let { onChange, onChanged } = this.props;
 

From 352ed68433ce19f2bfd99a4512fc2e98984d7d16 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Wed, 24 May 2017 14:38:25 -0700
Subject: [PATCH 0003/1641] Prevent infinite render loops for Resize Group
 (#1857)

* Add a test that causes recreates the bug with resize group that is causing a stack overflow

* Remove unused variable

* Don't call reducedata again when it returns undefined, stop measuring. Add tests.

* Check the value of the wrapper state

* Update comment

* Rename mocks to spies for clarity

* Rush change

* Update example app to return undefined
---
 ...ze-group-reduce-stop_2017-05-24-20-22.json | 10 ++
 .../ResizeGroup/ResizeGroup.Props.ts          |  4 +-
 .../ResizeGroup/ResizeGroup.test.tsx          | 93 ++++++++++++++-----
 .../components/ResizeGroup/ResizeGroup.tsx    | 22 +++--
 .../ResizeGroup.OverflowSet.Example.tsx       |  6 +-
 5 files changed, 103 insertions(+), 32 deletions(-)
 create mode 100644 common/changes/resize-group-reduce-stop_2017-05-24-20-22.json

diff --git a/common/changes/resize-group-reduce-stop_2017-05-24-20-22.json b/common/changes/resize-group-reduce-stop_2017-05-24-20-22.json
new file mode 100644
index 0000000000000..e512403df9a35
--- /dev/null
+++ b/common/changes/resize-group-reduce-stop_2017-05-24-20-22.json
@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixes bug where ResizeGroup gets stuck in an infinite render loop when subsequent calls to onReduceData does nothing.",
+      "type": "patch"
+    }
+  ],
+  "email": "chrisgo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts
index adecf404766e6..24d1738dde2a7 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts
@@ -24,7 +24,9 @@ export interface IResizeGroupProps extends React.HTMLProps<ResizeGroup | HTMLEle
   onRenderData: (data: any) => JSX.Element;
 
   /**
-   * Function to be performed on the data in order to make it fit into the given space
+   * Function to be performed on the data in order to make it fit into the given space.
+   * If there are no more scaling steps to apply, it should return undefined to prevent
+   * an infinite render loop.
   */
   onReduceData: (prevData: any) => any;
 }
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
index 136ea296fe9ec..8a6e65b994b23 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
-import { shallow, mount } from 'enzyme';
+import { shallow, mount, ReactWrapper } from 'enzyme';
 import { expect } from 'chai';
 import { ResizeGroup, IResizeGroupState } from './ResizeGroup';
 import * as sinon from 'sinon';
@@ -18,16 +18,26 @@ function onReduceScalingData(data: ITestScalingData): ITestScalingData {
   };
 }
 
-function getWrapperWithMocks(data: ITestScalingData = { scalingIndex: 5 }, onReduceData?: (data: ITestScalingData) => ITestScalingData) {
-  const onReduceDataMock = sinon.spy(onReduceData);
-  const onRenderDataMock = sinon.spy();
+function getWrapperWithMocks(data: ITestScalingData = { scalingIndex: 5 },
+  onReduceData: (data: ITestScalingData) => ITestScalingData = onReduceScalingData) {
+  const onReduceDataSpy = sinon.spy(onReduceData);
+  const onRenderDataSpy = sinon.spy();
 
   let wrapper = mount<ResizeGroup, IResizeGroupState>(<ResizeGroup
     data={ data }
-    onReduceData={ onReduceDataMock }
-    onRenderData={ onRenderDataMock }
+    onReduceData={ onReduceDataSpy }
+    onRenderData={ onRenderDataSpy }
   />);
 
+  return {
+    wrapper,
+    onReduceDataSpy,
+    onRenderDataSpy,
+    ...getMeasurementMocks(wrapper)
+  };
+}
+
+function getMeasurementMocks(wrapper: ReactWrapper<ResizeGroup, IResizeGroupState>) {
   let rootGetClientRectMock = sinon.stub();
   let measuredGetClientRectMock = sinon.stub();
   rootGetClientRectMock.returns({ width: 0 });
@@ -46,9 +56,6 @@ function getWrapperWithMocks(data: ITestScalingData = { scalingIndex: 5 }, onRed
   });
 
   return {
-    wrapper,
-    onReduceDataMock,
-    onRenderDataMock,
     rootGetClientRectMock,
     measuredGetClientRectMock
   };
@@ -101,22 +108,22 @@ describe('ResizeGroup', () => {
   });
 
   it('will call onReduceData when contents do not fit', () => {
-    let { wrapper, onReduceDataMock, rootGetClientRectMock, measuredGetClientRectMock } = getWrapperWithMocks();
+    let { wrapper, onReduceDataSpy, rootGetClientRectMock, measuredGetClientRectMock } = getWrapperWithMocks();
 
-    onReduceDataMock.reset();
+    onReduceDataSpy.reset();
     rootGetClientRectMock.returns({ width: 50 });
     measuredGetClientRectMock.onFirstCall().returns({ width: 75 });
     measuredGetClientRectMock.onSecondCall().returns({ width: 40 });
 
     wrapper.setState({ shouldMeasure: true });
 
-    expect(onReduceDataMock.callCount).to.equal(1);
+    expect(onReduceDataSpy.callCount).to.equal(1);
   });
 
   it('will measure after a window resize', () => {
-    let { onReduceDataMock, rootGetClientRectMock, measuredGetClientRectMock } = getWrapperWithMocks();
+    let { onReduceDataSpy, rootGetClientRectMock, measuredGetClientRectMock } = getWrapperWithMocks();
 
-    onReduceDataMock.reset();
+    onReduceDataSpy.reset();
     rootGetClientRectMock.reset();
     measuredGetClientRectMock.reset();
     rootGetClientRectMock.returns({ width: 200 });
@@ -128,18 +135,18 @@ describe('ResizeGroup', () => {
     expect(measuredGetClientRectMock.callCount).to.equal(1);
 
     // Don't call onReduceData since everything fits
-    expect(onReduceDataMock.callCount).to.equal(0);
+    expect(onReduceDataSpy.callCount).to.equal(0);
   });
 
   it('will continue to shrink until everything fits', () => {
     let data = { scalingIndex: 7 };
 
     let { wrapper,
-      onReduceDataMock,
+      onReduceDataSpy,
       rootGetClientRectMock,
       measuredGetClientRectMock } = getWrapperWithMocks(data, onReduceScalingData);
 
-    onReduceDataMock.reset();
+    onReduceDataSpy.reset();
     measuredGetClientRectMock.reset();
     rootGetClientRectMock.reset();
     rootGetClientRectMock.returns({ width: 50 });
@@ -149,9 +156,9 @@ describe('ResizeGroup', () => {
 
     wrapper.setState({ shouldMeasure: true });
 
-    expect(onReduceDataMock.callCount).to.equal(2);
-    expect(onReduceDataMock.getCall(0).args[0]).to.deep.equal(data);
-    expect(onReduceDataMock.getCall(1).args[0]).to.deep.equal({ scalingIndex: 6 });
+    expect(onReduceDataSpy.callCount).to.equal(2);
+    expect(onReduceDataSpy.getCall(0).args[0]).to.deep.equal(data);
+    expect(onReduceDataSpy.getCall(1).args[0]).to.deep.equal({ scalingIndex: 6 });
     expect(wrapper.state()).to.deep.equal({
       measuredData: data,
       renderedData: { scalingIndex: 5 },
@@ -177,14 +184,14 @@ describe('ResizeGroup', () => {
 
   it('starts from the beginning when resizing', () => {
     let data = { scalingIndex: 10 };
-    let { wrapper, onRenderDataMock } = getWrapperWithMocks(data);
+    let { wrapper, onRenderDataSpy } = getWrapperWithMocks(data);
 
     wrapper.setState({
       renderedData: { scalingIndex: 5 },
       shouldMeasure: false
     });
 
-    onRenderDataMock.reset();
+    onRenderDataSpy.reset();
     wrapper.setState({
       shouldMeasure: true
     });
@@ -193,12 +200,50 @@ describe('ResizeGroup', () => {
     // but the important thing here is that the last onRender data
     // starts from the beginning to make sure we are making maximal
     // use of the screen real estate.
-    expect(onRenderDataMock.callCount).to.equal(3);
-    expect(onRenderDataMock.getCall(2).args[0]).to.deep.equal(data);
+    expect(onRenderDataSpy.callCount).to.equal(3);
+    expect(onRenderDataSpy.getCall(2).args[0]).to.deep.equal(data);
     expect(wrapper.state()).to.deep.equal({
       renderedData: data,
       measuredData: data,
       shouldMeasure: false
     });
   });
+
+  it('does not call onReduceData again when it returns undefined', () => {
+    let mockData = { data: 'foo' };
+    let onReduceDataStub = sinon.stub();
+    onReduceDataStub.returns({});
+    const onRenderDataMock = sinon.spy();
+
+    let wrapper = mount<ResizeGroup, IResizeGroupState>(<ResizeGroup
+      data={ mockData }
+      onReduceData={ onReduceDataStub }
+      onRenderData={ onRenderDataMock }
+    />);
+
+    let { rootGetClientRectMock, measuredGetClientRectMock } = getMeasurementMocks(wrapper);
+
+    rootGetClientRectMock.returns({ width: 50 });
+    measuredGetClientRectMock.returns({ width: 75 });
+
+    let onRenderSpy = setRenderSpy(wrapper);
+    // This test will always return that the measured contents don't fit in the root
+    // The first onReduceData call returns some data, the second returns undefined.
+    // There should not be additional calls to onReduceData after undefined is returned.
+    onReduceDataStub.reset();
+    onReduceDataStub.onFirstCall().returns(mockData);
+    onReduceDataStub.onSecondCall().returns(undefined);
+
+    wrapper.setState({
+      shouldMeasure: true
+    });
+
+    // We'll render 3 times after attaching the render spy.
+    // 1. Initial render from setting shouldMeasure
+    // 2. Second render after reducing the data
+    // 3. Third render to remove the measuring div after onReduce returns undefined
+    expect(onRenderSpy.callCount).to.equal(3);
+    expect(onReduceDataStub.callCount).to.equal(2);
+    expect(wrapper.state().shouldMeasure).to.equal(false);
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index 199bf4193893c..64ca40b6d8e33 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -58,7 +58,7 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
   }
 
   public render() {
-    const { onRenderData, onReduceData, data } = this.props;
+    const { onRenderData, data } = this.props;
     const { shouldMeasure, renderedData, measuredData } = this.state;
 
     if (Object.keys(data).length === 0) {
@@ -94,11 +94,21 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
       const container = this._root.getBoundingClientRect();
       const measured = this._measured.getBoundingClientRect();
       if ((measured.width > container.width)) {
-        this.setState((prevState, props) => {
-          return {
-            measuredData: onReduceData(prevState.measuredData),
-          };
-        });
+        let nextMeasuredData = onReduceData(this.state.measuredData);
+
+        // We don't want to get stuck in an infinite render loop when there are no more
+        // scaling steps, so implementations of onReduceData should return undefined when
+        // there are no more scaling states to apply.
+        if (nextMeasuredData !== undefined) {
+          this.setState({
+            measuredData: nextMeasuredData,
+          });
+        } else {
+          this.setState({
+            shouldMeasure: false
+          });
+        }
+
       } else {
         this.setState((prevState, props) => {
           return {
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
index ff6beca609a0d..abfbd6927443f 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
@@ -24,6 +24,10 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<any, any> {
         <ResizeGroup
           data={ data }
           onReduceData={ (currentdata) => {
+            if (currentdata.primary.length === 0) {
+              return undefined;
+            }
+
             let overflow = currentdata.overflow.concat(currentdata.primary.slice(-1));
             let primary = currentdata.primary.slice(0, -1);
             return { primary, overflow };
@@ -55,5 +59,5 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<any, any> {
         />
       </div>
     );
-  };
+  }
 }
\ No newline at end of file

From 7f0384f5070942f876f50d19dd3ac11c7bc14664 Mon Sep 17 00:00:00 2001
From: SayaliS <sayalis@microsoft.com>
Date: Wed, 24 May 2017 14:53:53 -0700
Subject: [PATCH 0004/1641] Add useTargetWidth as a prop to context menu
 component. (#1842)

* update

* update

* update

* address comments

* update

* address comments

* update
---
 ...lis-contextMenuWidth_2017-05-23-23-07.json | 30 +++++++++++++++++++
 .../ContextualMenu/ContextualMenu.Props.ts    |  8 ++++-
 .../ContextualMenu/ContextualMenu.tsx         | 15 +++++++++-
 3 files changed, 51 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/sayalis-contextMenuWidth_2017-05-23-23-07.json

diff --git a/common/changes/sayalis-contextMenuWidth_2017-05-23-23-07.json b/common/changes/sayalis-contextMenuWidth_2017-05-23-23-07.json
new file mode 100644
index 0000000000000..f30152118723e
--- /dev/null
+++ b/common/changes/sayalis-contextMenuWidth_2017-05-23-23-07.json
@@ -0,0 +1,30 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextMenu: added `useTargetWidth` property to match the width of the anchor element when true the context menu will apply target element's width to it",
+      "type": "minor"
+    },
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    },
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    },
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    },
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "email": "sayalis@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
index edfa0520e0f35..5b2d961b8da4a 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
@@ -59,7 +59,13 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu> {
   beakWidth?: number;
 
   /**
-   * The bounding rectangle for which  the contextual menu can appear in.
+   * If true the context menu will render as the same width as the target element
+   * @default false
+   */
+  useTargetWidth?: boolean;
+
+  /**
+   * The bounding rectangle for which the contextual menu can appear in.
    */
   bounds?: IRectangle;
 
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 90f32226f844f..f6ab74fe0d3bd 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -181,6 +181,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       arrowDirection,
       target,
       bounds,
+      useTargetWidth,
       directionalHintFixed,
       shouldFocusOnMount,
       calloutProps } = this.props;
@@ -189,6 +190,18 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     let hasCheckmarks = !!(items && items.some(item => !!item.canCheck));
     const submenuProps = this.state.expandedMenuItemKey ? this._getSubmenuProps() : null;
 
+    /**
+     * When useTargetWidth is true, get the width of the target element and apply it for the context menu container
+     */
+    let contextMenuStyle;
+    let targetAsHtmlElement = this._target as HTMLElement;
+    if (useTargetWidth && targetAsHtmlElement && targetAsHtmlElement.offsetWidth) {
+        let contextMenuWidth = targetAsHtmlElement.offsetWidth;
+        contextMenuStyle = {
+            width: contextMenuWidth
+        };
+    }
+
     // The menu should only return if items were provided, if no items were provided then it should not appear.
     if (items && items.length > 0) {
       return (
@@ -209,7 +222,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
           onDismiss={ this.props.onDismiss }
           bounds={ bounds }
           directionalHintFixed={ directionalHintFixed }>
-          <div ref={ (host: HTMLDivElement) => this._host = host } id={ id } className={ css('ms-ContextualMenu-container', className) }>
+          <div style={contextMenuStyle} ref={ (host: HTMLDivElement) => this._host = host } id={ id } className={ css('ms-ContextualMenu-container', className) }>
             { (items && items.length) ? (
               <FocusZone
                 className={ css('ms-ContextualMenu is-open', styles.root) }

From 6e3128dc62ea0bda625896939405d1fbc4d2d640 Mon Sep 17 00:00:00 2001
From: Manish Dahamiwal <mdhamiwal@gmail.com>
Date: Thu, 25 May 2017 05:18:29 +0530
Subject: [PATCH 0005/1641] DatePicker: Accessibility fixes (#1821)

* fixing accessibility issues in Datepicker

* change log

* resolving cr comments

* Resolving CR comments

* removing comment

* applying application role on calendar

* using role button for calendar days
---
 .../calendar-a11y_2017-05-18-18-52.json       | 10 +++++++
 .../src/components/Calendar/Calendar.tsx      | 27 ++++++++++---------
 .../src/components/Calendar/CalendarDay.tsx   | 12 ++++-----
 .../src/components/Calendar/CalendarMonth.tsx | 26 +++++++++---------
 .../src/components/Callout/Callout.Props.ts   |  5 ++++
 .../src/components/Callout/CalloutContent.tsx |  2 ++
 .../components/DatePicker/DatePicker.Props.ts |  6 +++++
 .../src/components/DatePicker/DatePicker.tsx  | 15 +++++++----
 .../src/components/Popup/Popup.Props.ts       |  5 ++++
 .../src/components/Popup/Popup.tsx            |  3 ++-
 .../src/components/SearchBox/SearchBox.scss   |  2 +-
 11 files changed, 75 insertions(+), 38 deletions(-)
 create mode 100644 common/changes/calendar-a11y_2017-05-18-18-52.json

diff --git a/common/changes/calendar-a11y_2017-05-18-18-52.json b/common/changes/calendar-a11y_2017-05-18-18-52.json
new file mode 100644
index 0000000000000..bb9ed312eaf01
--- /dev/null
+++ b/common/changes/calendar-a11y_2017-05-18-18-52.json
@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DatePicker: Fix for accessibility issues",
+      "type": "minor"
+    }
+  ],
+  "email": "manishda@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index 7d53c164b74bd..898e8b7a1e5a5 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -85,7 +85,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     let { selectedDate, navigatedDate } = this.state;
 
     return (
-      <div className={ css(rootClass, styles.root) } ref='root'>
+      <div className={ css(rootClass, styles.root) } ref='root' role='application'>
         <div className={ css(
           'ms-DatePicker-picker ms-DatePicker-picker--opened ms-DatePicker-picker--focused',
           styles.picker,
@@ -114,13 +114,16 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   strings={ strings }
                   onNavigateDate={ this._onNavigateDate } /> }
 
-                { showGoToToday && <span
-                  className={ css('ms-DatePicker-goToday js-goToday', styles.goToday) }
-                  onClick={ this._onGotoToday }
-                  onKeyDown={ this._onGotoTodayKeyDown }
-                  tabIndex={ 0 }>
-                  { strings.goToToday }
-                </span> }
+                { showGoToToday &&
+                  <span
+                    role='button'
+                    className={ css('ms-DatePicker-goToday js-goToday', styles.goToday) }
+                    onClick={ this._onGotoToday }
+                    onKeyDown={ this._onGotoTodayKeyDown }
+                    tabIndex={ 0 }>
+                    { strings.goToToday }
+                  </span>
+                }
               </div>
             </div>
           </div>
@@ -159,17 +162,17 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     if (onSelectDate) {
       onSelectDate(date, selectedDateRangeArray);
     }
-  };
+  }
 
   @autobind
   private _onGotoToday() {
     this._navigateDay(this.props.today);
     this._focusOnUpdate = true;
-  };
+  }
 
   @autobind
   private _onGotoTodayKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
-    if (ev.which === KeyCodes.enter) {
+    if (ev.which === KeyCodes.enter || ev.which === KeyCodes.space) {
       ev.preventDefault();
       this._onGotoToday();
     } else if (ev.which === KeyCodes.tab && !ev.shiftKey) {
@@ -179,7 +182,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
         this.props.onDismiss();
       }
     }
-  };
+  }
 
   @autobind
   private _onDatePickerPopupKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index 68f2970e04293..eca2361c89cdb 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -123,7 +123,6 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
         <FocusZone>
           <table
             className={ css('ms-DatePicker-table', styles.table) }
-            role='grid'
             aria-readonly='true'
             aria-multiselectable='false'
             aria-labelledby={ monthAndYearId }
@@ -137,7 +136,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
                     scope='col'
                     key={ index }
                     title={ strings.days[(index + firstDayOfWeek) % DAYS_IN_WEEK] }
-                  >
+                    aria-label={ strings.days[(index + firstDayOfWeek) % DAYS_IN_WEEK] }>
                     { strings.shortDays[(index + firstDayOfWeek) % DAYS_IN_WEEK] }
                   </th>) }
               </tr>
@@ -146,7 +145,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
               { weeks.map((week, weekIndex) =>
                 <tr key={ weekIndex }>
                   { week.map((day, dayIndex) =>
-                    <td role='presentation' key={ day.key }>
+                    <td key={ day.key }>
                       <div
                         className={ css(
                           'ms-DatePicker-day',
@@ -157,17 +156,18 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
                             ['ms-DatePicker-day--today ' + styles.dayIsToday]: day.isToday,
                             ['ms-DatePicker-day--highlighted ' + styles.dayIsHighlighted]: day.isSelected
                           }) }
-                        role='gridcell'
+                        role='button'
                         onClick={ day.onSelected }
                         onKeyDown={ (ev: React.KeyboardEvent<HTMLElement>) =>
                           this._navigateMonthEdge(ev, day.originalDate, weekIndex, dayIndex) }
                         aria-selected={ day.isSelected }
-                        aria-label={ day.originalDate.toLocaleDateString ? day.originalDate.toLocaleDateString() : day.originalDate.getDate() }
+                        aria-label={ day.originalDate.toLocaleString ?
+                          day.originalDate.toLocaleString([], { day: 'numeric', month: 'long', year: 'numeric' }) : day.originalDate.getDate() }
                         id={ compareDates(navigatedDate, day.originalDate) ? activeDescendantId : null }
                         data-is-focusable={ true }
                         ref={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : null }
                         key={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : null } >
-                        { day.date }
+                        <span aria-hidden='true'>{ day.date }</span>
                       </div>
                     </td>
                   ) }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
index 5f49b27f6f46d..9c79628d0c632 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
@@ -68,18 +68,18 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
         </div>
         <FocusZone>
           <div className={ css('ms-DatePicker-optionGrid', styles.optionGrid) }>
-            { strings.shortMonths.map((month, index) => {
-              return (
-                <span
-                  className={ css('ms-DatePicker-monthOption', styles.monthOption) }
-                  key={ index }
-                  onClick={ this._selectMonthCallbacks[index] }
-                  aria-label={ setMonth(navigatedDate, index).toLocaleString([], { month: 'long', year: 'numeric' }) }
-                  data-is-focusable={ true }
-                >
-                  { month }
-                </span>);
-            }) }
+            { strings.shortMonths.map((month, index) =>
+              <span
+                role='button'
+                className={ css('ms-DatePicker-monthOption', styles.monthOption) }
+                key={ index }
+                onClick={ this._selectMonthCallbacks[index] }
+                aria-label={ setMonth(navigatedDate, index).toLocaleString([], { month: 'long', year: 'numeric' }) }
+                data-is-focusable={ true }
+              >
+                { month }
+              </span>
+            ) }
           </div>
         </FocusZone>
       </div>
@@ -87,7 +87,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
   }
 
   private _onKeyDown(callback: () => void, ev: React.KeyboardEvent<HTMLElement>) {
-    if (ev.which === KeyCodes.enter) {
+    if (ev.which === KeyCodes.enter || ev.which === KeyCodes.space) {
       callback();
     }
   }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts b/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
index db99634ca0d65..e670a4c9d2fd9 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
@@ -95,6 +95,11 @@ export interface ICalloutProps extends React.Props<Callout | CalloutContent> {
    */
   role?: string;
 
+  /**
+   * Accessible label text for callout.
+   */
+  ariaLabel?: string;
+
   /**
    *  Defines the element id referencing the element containing label text for callout.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index 91dffc87d289a..eb7c3878ffc9e 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -94,6 +94,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
     }
     let {
       role,
+      ariaLabel,
       ariaDescribedBy,
       ariaLabelledBy,
       className,
@@ -149,6 +150,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
             (<div className={ css('ms-Callout-beakCurtain', styles.beakCurtain) } />) }
           <Popup
             role={ role }
+            ariaLabel={ ariaLabel }
             ariaDescribedBy={ ariaDescribedBy }
             ariaLabelledBy={ ariaLabelledBy }
             className={ css('ms-Callout-main', styles.main) }
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
index 8e5ec335a7ff2..45304d78c9ad3 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
@@ -40,6 +40,12 @@ export interface IDatePickerProps extends React.Props<DatePicker> {
    */
   ariaLabel?: string;
 
+  /**
+   * Aria label for date picker popup for screen reader users.
+   * @defaultvalue Calendar
+   */
+  pickerAriaLabel?: string;
+
   /**
    * Whether the month picker is shown beside the day picker or hidden.
    * @defaultvalue true
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 293965d1ad6c1..caf42139df205 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -109,7 +109,8 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     isRequired: false,
     isMonthPickerVisible: true,
     strings: DEFAULT_STRINGS,
-    borderless: false
+    borderless: false,
+    pickerAriaLabel: 'Calender',
   };
 
   public refs: {
@@ -168,6 +169,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
       isRequired,
       disabled,
       ariaLabel,
+      pickerAriaLabel,
       placeholder,
       allowTextInput,
       borderless
@@ -181,6 +183,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
             className={ styles.textField }
             ariaLabel={ ariaLabel }
             aria-haspopup='true'
+            aria-expanded={ isDatePickerShown }
             required={ isRequired }
             disabled={ disabled }
             onKeyDown={ this._onTextFieldKeyDown }
@@ -203,6 +206,8 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
         </div>
         { isDatePickerShown && (
           <Callout
+            role='dialog'
+            ariaLabel={ pickerAriaLabel }
             isBeakVisible={ false }
             className={ css('ms-DatePicker-callout') }
             gapSpace={ 0 }
@@ -241,7 +246,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     if (onSelectDate) {
       onSelectDate(date);
     }
-  };
+  }
 
   @autobind
   private _onCalloutPositioned() {
@@ -261,12 +266,12 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
         this._preventFocusOpeningPicker = false;
       }
     }
-  };
+  }
 
   @autobind
   private _onTextFieldBlur(ev: React.FocusEvent<HTMLElement>) {
     this._validateTextInput();
-  };
+  }
 
   @autobind
   private _onTextFieldChanged(newValue: string) {
@@ -308,7 +313,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
       default:
         break;
     }
-  };
+  }
 
   @autobind
   private _onTextFieldClick(ev: React.MouseEvent<HTMLElement>) {
diff --git a/packages/office-ui-fabric-react/src/components/Popup/Popup.Props.ts b/packages/office-ui-fabric-react/src/components/Popup/Popup.Props.ts
index 171e2f735c034..816795bbd2c43 100644
--- a/packages/office-ui-fabric-react/src/components/Popup/Popup.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Popup/Popup.Props.ts
@@ -19,6 +19,11 @@ export interface IPopupProps extends React.HTMLProps<Popup> {
    */
   role?: string;
 
+  /**
+   * Accessible label text for the popup.
+   */
+  ariaLabel?: string;
+
   /**
    *  Defines the element id referencing the element containing label text for popup.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
index 70487c07f3204..9c254b82df0c0 100644
--- a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
+++ b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
@@ -55,7 +55,7 @@ export class Popup extends BaseComponent<IPopupProps, {}> {
   }
 
   public render() {
-    let { role, className, ariaLabelledBy, ariaDescribedBy } = this.props;
+    let { role, className, ariaLabel, ariaLabelledBy, ariaDescribedBy } = this.props;
 
     return (
       <div
@@ -63,6 +63,7 @@ export class Popup extends BaseComponent<IPopupProps, {}> {
         { ...getNativeProps(this.props, divProperties) }
         className={ className }
         role={ role }
+        aria-label={ ariaLabel }
         aria-labelledby={ ariaLabelledBy }
         aria-describedby={ ariaDescribedBy }
         onKeyDown={ this._onKeyDown }>
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
index 918fefb1b3466..143bd048de552 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
@@ -55,7 +55,7 @@
   font-size: inherit;
   color: $ms-color-black;
   background-color: transparent;
-  flex: 1 1 0;
+  flex: 1 1 0px;
   overflow: hidden;
   text-overflow: ellipsis;
   // This padding forces the text placement to round up.

From ac3ba5b560ad07506f02acadaea0b67cafc3e4a1 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 24 May 2017 23:52:09 +0000
Subject: [PATCH 0006/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...cegroup-field-render_2017-05-22-21-22.json | 10 ----
 ...ze-group-reduce-stop_2017-05-24-20-22.json | 10 ----
 .../resize-group-tests_2017-05-23-18-22.json  | 30 -----------
 ...ickyp-dropdownTitles_2017-05-23-03-10.json | 10 ----
 ...lis-contextMenuWidth_2017-05-23-23-07.json | 30 -----------
 .../search-box-onblur_2017-05-24-16-13.json   | 10 ----
 ...spinner-accessiblity_2017-05-02-18-52.json | 10 ----
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  4 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 51 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 18 ++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 packages/utilities/CHANGELOG.json             | 14 +++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  2 +-
 19 files changed, 99 insertions(+), 121 deletions(-)
 delete mode 100644 common/changes/choicegroup-field-render_2017-05-22-21-22.json
 delete mode 100644 common/changes/resize-group-reduce-stop_2017-05-24-20-22.json
 delete mode 100644 common/changes/resize-group-tests_2017-05-23-18-22.json
 delete mode 100644 common/changes/rickyp-dropdownTitles_2017-05-23-03-10.json
 delete mode 100644 common/changes/sayalis-contextMenuWidth_2017-05-23-23-07.json
 delete mode 100644 common/changes/search-box-onblur_2017-05-24-16-13.json
 delete mode 100644 common/changes/spinner-accessiblity_2017-05-02-18-52.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 4109e49ee9262..44baae774f87f 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -52,7 +52,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=5.1.0 <6.0.0",
-    "office-ui-fabric-react": ">=2.32.0 <3.0.0",
+    "office-ui-fabric-react": ">=2.33.0 <3.0.0",
     "@uifabric/utilities": ">=1.10.0 <2.0.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 256f724e844a8..0ba025a1edb7b 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -25,7 +25,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=2.32.0 <3.0.0",
+    "office-ui-fabric-react": ">=2.33.0 <3.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index e7846b6dede84..2460ed3e3b2d4 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -29,6 +29,6 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=2.32.0 <3.0.0"
+    "office-ui-fabric-react": ">=2.33.0 <3.0.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 3a1b06d07891e..a51fa1df58a71 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -25,7 +25,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=5.1.0 <6.0.0",
-    "office-ui-fabric-react": ">=2.32.0 <3.0.0",
+    "office-ui-fabric-react": ">=2.33.0 <3.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2"
diff --git a/common/changes/choicegroup-field-render_2017-05-22-21-22.json b/common/changes/choicegroup-field-render_2017-05-22-21-22.json
deleted file mode 100644
index 72675d84cbef6..0000000000000
--- a/common/changes/choicegroup-field-render_2017-05-22-21-22.json
+++ /dev/null
@@ -1,10 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ChoiceGroup: Support custom option labels",
-      "type": "minor"
-    }
-  ],
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/resize-group-reduce-stop_2017-05-24-20-22.json b/common/changes/resize-group-reduce-stop_2017-05-24-20-22.json
deleted file mode 100644
index e512403df9a35..0000000000000
--- a/common/changes/resize-group-reduce-stop_2017-05-24-20-22.json
+++ /dev/null
@@ -1,10 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixes bug where ResizeGroup gets stuck in an infinite render loop when subsequent calls to onReduceData does nothing.",
-      "type": "patch"
-    }
-  ],
-  "email": "chrisgo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/resize-group-tests_2017-05-23-18-22.json b/common/changes/resize-group-tests_2017-05-23-18-22.json
deleted file mode 100644
index 6373739452e8e..0000000000000
--- a/common/changes/resize-group-tests_2017-05-23-18-22.json
+++ /dev/null
@@ -1,30 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "Add unit tests to ResizeGroup",
-      "packageName": "office-ui-fabric-react",
-      "type": "patch"
-    },
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Add utlities for unit tests that need to override or spy on React lifecycle methods",
-      "type": "patch"
-    },
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    },
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    },
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "email": "chrisgo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/rickyp-dropdownTitles_2017-05-23-03-10.json b/common/changes/rickyp-dropdownTitles_2017-05-23-03-10.json
deleted file mode 100644
index 3d7b013c72dfa..0000000000000
--- a/common/changes/rickyp-dropdownTitles_2017-05-23-03-10.json
+++ /dev/null
@@ -1,10 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: Added title attribute for individual options.",
-      "type": "patch"
-    }
-  ],
-  "email": "rickyp@microsoft.com"
-}
diff --git a/common/changes/sayalis-contextMenuWidth_2017-05-23-23-07.json b/common/changes/sayalis-contextMenuWidth_2017-05-23-23-07.json
deleted file mode 100644
index f30152118723e..0000000000000
--- a/common/changes/sayalis-contextMenuWidth_2017-05-23-23-07.json
+++ /dev/null
@@ -1,30 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextMenu: added `useTargetWidth` property to match the width of the anchor element when true the context menu will apply target element's width to it",
-      "type": "minor"
-    },
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    },
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    },
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    },
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "email": "sayalis@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/search-box-onblur_2017-05-24-16-13.json b/common/changes/search-box-onblur_2017-05-24-16-13.json
deleted file mode 100644
index 467e99375bbfb..0000000000000
--- a/common/changes/search-box-onblur_2017-05-24-16-13.json
+++ /dev/null
@@ -1,10 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SearchBox: Fixed onBlur not removing focus",
-      "type": "patch"
-    }
-  ],
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/spinner-accessiblity_2017-05-02-18-52.json b/common/changes/spinner-accessiblity_2017-05-02-18-52.json
deleted file mode 100644
index e89b96422c15a..0000000000000
--- a/common/changes/spinner-accessiblity_2017-05-02-18-52.json
+++ /dev/null
@@ -1,10 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Spinner: support for status announcement",
-      "type": "minor"
-    }
-  ],
-  "email": "manishda@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index f1f9811410ede..53c0a246b13f6 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -40,7 +40,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/utilities": "1.10.0",
+    "@uifabric/utilities": "1.10.1",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=5.0.0 <6.0.0",
     "office-ui-fabric-react": ">=2.11.0-0 <3.0.0-0"
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 0172eb4cf8c72..14641f0252990 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -22,7 +22,7 @@
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
     "@uifabric/example-app-base": "1.3.13",
-    "@uifabric/utilities": "1.10.0",
+    "@uifabric/utilities": "1.10.1",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -30,7 +30,7 @@
     "mocha": "^3.2.0",
     "mocha-loader": "^1.1.1",
     "node-sass": "^4.5.0",
-    "office-ui-fabric-react": ">=2.32.0 <3.0.0",
+    "office-ui-fabric-react": ">=2.33.0 <3.0.0",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
     "postcss-loader": "^1.3.3",
     "react": "^15.4.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 092c3f72156f6..6245e06cb2b7a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,57 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "2.33.0",
+      "tag": "office-ui-fabric-react_v2.33.0",
+      "date": "Wed, 24 May 2017 23:52:09 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "14426398ce6c2241ba0ee27b869283d1f7cd02b5",
+            "comment": "ChoiceGroup: Support custom option labels"
+          },
+          {
+            "author": "SayaliS <sayalis@microsoft.com>",
+            "commit": "7f0384f5070942f876f50d19dd3ac11c7bc14664",
+            "comment": "ContextMenu: added `useTargetWidth` property to match the width of the anchor element when true the context menu will apply target element's width to it"
+          },
+          {
+            "author": "Manish Dahamiwal <mdhamiwal@gmail.com>",
+            "commit": "e3ec718f6e6f9794dcd90651a64021f62655b0c0",
+            "comment": "Spinner: support for status announcement"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "352ed68433ce19f2bfd99a4512fc2e98984d7d16",
+            "comment": "Fixes bug where ResizeGroup gets stuck in an infinite render loop when subsequent calls to onReduceData does nothing."
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "1020ec60dd7d0461fc945a2b2a87c6cbb0e07db9",
+            "comment": "Add unit tests to ResizeGroup"
+          },
+          {
+            "author": "Ricky Patel <rickyp@microsoft.com>",
+            "commit": "ebc3d673685896357b556bddcd352b607e929a78",
+            "comment": "Dropdown: Added title attribute for individual options."
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "2c49eca4b9842b22dbbda47817edd571206fd2a9",
+            "comment": "SearchBox: Fixed onBlur not removing focus"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=1.10.0 <2.0.0` to `>=1.10.0 <2.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "2.32.0",
       "tag": "office-ui-fabric-react_v2.32.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 61901cb6dc781..fda419798d1f6 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,22 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 23 May 2017 10:16:04 GMT and should not be manually modified.
+This log was last generated on Wed, 24 May 2017 23:52:09 GMT and should not be manually modified.
+
+## 2.33.0
+Wed, 24 May 2017 23:52:09 GMT
+
+### Minor changes
+
+- ChoiceGroup: Support custom option labels
+- ContextMenu: added `useTargetWidth` property to match the width of the anchor element when true the context menu will apply target element's width to it
+- Spinner: support for status announcement
+
+### Patches
+
+- Fixes bug where ResizeGroup gets stuck in an infinite render loop when subsequent calls to onReduceData does nothing.
+- Add unit tests to ResizeGroup
+- Dropdown: Added title attribute for individual options.
+- SearchBox: Fixed onBlur not removing focus
 
 ## 2.32.0
 Tue, 23 May 2017 10:16:04 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index ee06e037d86ec..1c124895f59e5 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "2.32.0",
+  "version": "2.33.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index f3a376139d574..e47549b41ee02 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "1.10.1",
+      "tag": "@uifabric/utilities_v1.10.1",
+      "date": "Wed, 24 May 2017 23:52:09 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "1020ec60dd7d0461fc945a2b2a87c6cbb0e07db9",
+            "comment": "Add utlities for unit tests that need to override or spy on React lifecycle methods"
+          }
+        ]
+      }
+    },
     {
       "version": "1.10.0",
       "tag": "@uifabric/utilities_v1.10.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 1ca8fc8fffca2..b163ae25bad18 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Tue, 23 May 2017 10:16:04 GMT and should not be manually modified.
+This log was last generated on Wed, 24 May 2017 23:52:09 GMT and should not be manually modified.
+
+## 1.10.1
+Wed, 24 May 2017 23:52:09 GMT
+
+### Patches
+
+- Add utlities for unit tests that need to override or spy on React lifecycle methods
 
 ## 1.10.0
 Tue, 23 May 2017 10:16:04 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 455f2eb8e243a..e1f051df2063f 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "1.10.0",
+  "version": "1.10.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 272be626dfe813ffea34de30abd79d1d887d0854 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 24 May 2017 17:04:40 -0700
Subject: [PATCH 0007/1641] typings updates. (#1861)

---
 apps/test-bundle-button/package.json          |  5 +-
 apps/todo-app/package.json                    |  4 +-
 common/npm-shrinkwrap.json                    | 84 +++++++++----------
 .../rush-example-app-base/package.json        |  4 +-
 .../rush-example-component/package.json       |  4 +-
 .../rush-office-ui-fabric-react/package.json  |  4 +-
 common/temp_modules/rush-styling/package.json |  4 +-
 .../rush-test-bundle-button/package.json      |  5 +-
 .../temp_modules/rush-todo-app/package.json   |  4 +-
 .../temp_modules/rush-utilities/package.json  |  4 +-
 packages/example-app-base/package.json        |  4 +-
 packages/example-component/package.json       |  4 +-
 packages/office-ui-fabric-react/package.json  |  4 +-
 .../src/components/pickers/BasePicker.tsx     |  2 +-
 packages/styling/package.json                 |  4 +-
 packages/utilities/package.json               |  4 +-
 packages/utilities/src/BaseComponent.test.tsx |  4 +-
 17 files changed, 75 insertions(+), 73 deletions(-)

diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 2460ed3e3b2d4..2588c02bd350c 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -16,8 +16,9 @@
   },
   "devDependencies": {
     "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
-    "@types/react": "^15.0.16",
-    "@types/react-dom": "^0.14.23",
+    "@types/react": "^15.0.25",
+    "@types/react-addons-test-utils": "^0.14.18",
+    "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
     "source-map-loader": "^0.2.1",
     "ts-loader": "^2.0.1",
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index a51fa1df58a71..209a1c44cce89 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -14,8 +14,8 @@
     "@types/enzyme": "^2.7.5",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "^2.2.39",
-    "@types/react": "^15.0.16",
-    "@types/react-addons-test-utils": "^0.14.17",
+    "@types/react": "^15.0.25",
+    "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
     "react-addons-test-utils": "^15.4.2"
diff --git a/common/npm-shrinkwrap.json b/common/npm-shrinkwrap.json
index 44e340f78cbe7..3806fc22904b6 100644
--- a/common/npm-shrinkwrap.json
+++ b/common/npm-shrinkwrap.json
@@ -8,9 +8,9 @@
       "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.0.6.tgz"
     },
     "@microsoft/gulp-core-build": {
-      "version": "2.5.1",
+      "version": "2.5.3",
       "from": "@microsoft/gulp-core-build@>=2.5.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.5.1.tgz",
+      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.5.3.tgz",
       "dependencies": {
         "@types/chai": {
           "version": "3.4.34",
@@ -838,13 +838,13 @@
       "resolved": "https://registry.npmjs.org/@types/q/-/q-0.0.32.tgz"
     },
     "@types/react": {
-      "version": "15.0.24",
-      "from": "@types/react@>=15.0.16 <16.0.0",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.24.tgz"
+      "version": "15.0.25",
+      "from": "@types/react@>=15.0.25 <16.0.0",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.25.tgz"
     },
     "@types/react-addons-test-utils": {
       "version": "0.14.18",
-      "from": "@types/react-addons-test-utils@>=0.14.17 <0.15.0",
+      "from": "@types/react-addons-test-utils@>=0.14.18 <0.15.0",
       "resolved": "https://registry.npmjs.org/@types/react-addons-test-utils/-/react-addons-test-utils-0.14.18.tgz"
     },
     "@types/react-dom": {
@@ -963,9 +963,9 @@
       "resolved": "https://registry.npmjs.org/acorn-dynamic-import/-/acorn-dynamic-import-2.0.2.tgz",
       "dependencies": {
         "acorn": {
-          "version": "4.0.11",
+          "version": "4.0.13",
           "from": "acorn@>=4.0.3 <5.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.11.tgz"
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz"
         }
       }
     },
@@ -2337,15 +2337,20 @@
       "from": "detect-file@>=0.1.0 <0.2.0",
       "resolved": "https://registry.npmjs.org/detect-file/-/detect-file-0.1.0.tgz"
     },
+    "detect-node": {
+      "version": "2.0.3",
+      "from": "detect-node@>=2.0.3 <3.0.0",
+      "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.0.3.tgz"
+    },
     "detective": {
       "version": "4.5.0",
       "from": "detective@>=4.3.1 <5.0.0",
       "resolved": "https://registry.npmjs.org/detective/-/detective-4.5.0.tgz",
       "dependencies": {
         "acorn": {
-          "version": "4.0.11",
+          "version": "4.0.13",
           "from": "acorn@>=4.0.3 <5.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.11.tgz"
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz"
         }
       }
     },
@@ -5661,7 +5666,7 @@
     },
     "nan": {
       "version": "2.6.2",
-      "from": "nan@>=2.3.2 <3.0.0",
+      "from": "nan@>=2.3.0 <3.0.0",
       "resolved": "https://registry.npmjs.org/nan/-/nan-2.6.2.tgz"
     },
     "native-promise-only": {
@@ -6981,13 +6986,13 @@
     },
     "rush-example-app-base": {
       "version": "0.0.0",
-      "from": "temp_modules\\rush-example-app-base",
-      "resolved": "file:temp_modules\\rush-example-app-base"
+      "from": "temp_modules/rush-example-app-base",
+      "resolved": "file:temp_modules/rush-example-app-base"
     },
     "rush-example-component": {
       "version": "0.0.0",
-      "from": "temp_modules\\rush-example-component",
-      "resolved": "file:temp_modules\\rush-example-component",
+      "from": "temp_modules/rush-example-component",
+      "resolved": "file:temp_modules/rush-example-component",
       "dependencies": {
         "acorn": {
           "version": "5.0.3",
@@ -7110,13 +7115,13 @@
     },
     "rush-fabric-website": {
       "version": "0.0.0",
-      "from": "temp_modules\\rush-fabric-website",
-      "resolved": "file:temp_modules\\rush-fabric-website"
+      "from": "temp_modules/rush-fabric-website",
+      "resolved": "file:temp_modules/rush-fabric-website"
     },
     "rush-office-ui-fabric-react": {
       "version": "0.0.0",
-      "from": "temp_modules\\rush-office-ui-fabric-react",
-      "resolved": "file:temp_modules\\rush-office-ui-fabric-react",
+      "from": "temp_modules/rush-office-ui-fabric-react",
+      "resolved": "file:temp_modules/rush-office-ui-fabric-react",
       "dependencies": {
         "acorn": {
           "version": "5.0.3",
@@ -7279,8 +7284,8 @@
     },
     "rush-office-ui-fabric-react-tslint": {
       "version": "0.0.0",
-      "from": "temp_modules\\rush-office-ui-fabric-react-tslint",
-      "resolved": "file:temp_modules\\rush-office-ui-fabric-react-tslint",
+      "from": "temp_modules/rush-office-ui-fabric-react-tslint",
+      "resolved": "file:temp_modules/rush-office-ui-fabric-react-tslint",
       "dependencies": {
         "@microsoft/api-extractor": {
           "version": "1.1.19",
@@ -7306,8 +7311,8 @@
     },
     "rush-ssr-tests": {
       "version": "0.0.0",
-      "from": "temp_modules\\rush-ssr-tests",
-      "resolved": "file:temp_modules\\rush-ssr-tests",
+      "from": "temp_modules/rush-ssr-tests",
+      "resolved": "file:temp_modules/rush-ssr-tests",
       "dependencies": {
         "acorn": {
           "version": "5.0.3",
@@ -7420,8 +7425,8 @@
     },
     "rush-styling": {
       "version": "0.0.0",
-      "from": "temp_modules\\rush-styling",
-      "resolved": "file:temp_modules\\rush-styling",
+      "from": "temp_modules/rush-styling",
+      "resolved": "file:temp_modules/rush-styling",
       "dependencies": {
         "acorn": {
           "version": "5.0.3",
@@ -7534,25 +7539,18 @@
     },
     "rush-test-bundle-button": {
       "version": "0.0.0",
-      "from": "temp_modules\\rush-test-bundle-button",
-      "resolved": "file:temp_modules\\rush-test-bundle-button",
-      "dependencies": {
-        "@types/react-dom": {
-          "version": "0.14.23",
-          "from": "@types/react-dom@>=0.14.23 <0.15.0",
-          "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-0.14.23.tgz"
-        }
-      }
+      "from": "temp_modules/rush-test-bundle-button",
+      "resolved": "file:temp_modules/rush-test-bundle-button"
     },
     "rush-todo-app": {
       "version": "0.0.0",
-      "from": "temp_modules\\rush-todo-app",
-      "resolved": "file:temp_modules\\rush-todo-app"
+      "from": "temp_modules/rush-todo-app",
+      "resolved": "file:temp_modules/rush-todo-app"
     },
     "rush-utilities": {
       "version": "0.0.0",
-      "from": "temp_modules\\rush-utilities",
-      "resolved": "file:temp_modules\\rush-utilities",
+      "from": "temp_modules/rush-utilities",
+      "resolved": "file:temp_modules/rush-utilities",
       "dependencies": {
         "diff": {
           "version": "3.2.0",
@@ -8035,9 +8033,9 @@
       }
     },
     "spdy-transport": {
-      "version": "2.0.19",
+      "version": "2.0.20",
       "from": "spdy-transport@>=2.0.18 <3.0.0",
-      "resolved": "https://registry.npmjs.org/spdy-transport/-/spdy-transport-2.0.19.tgz",
+      "resolved": "https://registry.npmjs.org/spdy-transport/-/spdy-transport-2.0.20.tgz",
       "dependencies": {
         "debug": {
           "version": "2.6.8",
@@ -8967,9 +8965,9 @@
       "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.2.1.tgz",
       "dependencies": {
         "acorn": {
-          "version": "4.0.11",
+          "version": "4.0.13",
           "from": "acorn@>=4.0.4 <5.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.11.tgz"
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz"
         },
         "async": {
           "version": "2.4.1",
@@ -9548,4 +9546,4 @@
       "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-3.17.0.tgz"
     }
   }
-}
+}
\ No newline at end of file
diff --git a/common/temp_modules/rush-example-app-base/package.json b/common/temp_modules/rush-example-app-base/package.json
index 4de6307a2a61c..9ef1253d50895 100644
--- a/common/temp_modules/rush-example-app-base/package.json
+++ b/common/temp_modules/rush-example-app-base/package.json
@@ -8,8 +8,8 @@
     "@types/enzyme": "^2.7.5",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "^2.2.39",
-    "@types/react": "^15.0.16",
-    "@types/react-addons-test-utils": "^0.14.17",
+    "@types/react": "^15.0.25",
+    "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
     "enzyme": "^2.7.0",
diff --git a/common/temp_modules/rush-example-component/package.json b/common/temp_modules/rush-example-component/package.json
index 19869311d1ea3..bb0a839a62de0 100644
--- a/common/temp_modules/rush-example-component/package.json
+++ b/common/temp_modules/rush-example-component/package.json
@@ -9,8 +9,8 @@
     "@types/enzyme": "^2.7.5",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "^2.2.39",
-    "@types/react": "^15.0.16",
-    "@types/react-addons-test-utils": "^0.14.17",
+    "@types/react": "^15.0.25",
+    "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
     "autoprefixer": "^6.7.6",
diff --git a/common/temp_modules/rush-office-ui-fabric-react/package.json b/common/temp_modules/rush-office-ui-fabric-react/package.json
index c866a4331b5be..ec9e889766177 100644
--- a/common/temp_modules/rush-office-ui-fabric-react/package.json
+++ b/common/temp_modules/rush-office-ui-fabric-react/package.json
@@ -9,8 +9,8 @@
     "@types/enzyme": "^2.7.5",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "^2.2.39",
-    "@types/react": "^15.0.16",
-    "@types/react-addons-test-utils": "^0.14.17",
+    "@types/react": "^15.0.25",
+    "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "^2.1.3",
diff --git a/common/temp_modules/rush-styling/package.json b/common/temp_modules/rush-styling/package.json
index b16a180eb529f..98c4f4f1bb333 100644
--- a/common/temp_modules/rush-styling/package.json
+++ b/common/temp_modules/rush-styling/package.json
@@ -9,8 +9,8 @@
     "@types/chai": "^3.4.35",
     "@types/enzyme": "^2.7.5",
     "@types/mocha": "^2.2.39",
-    "@types/react": "^15.0.16",
-    "@types/react-addons-test-utils": "^0.14.17",
+    "@types/react": "^15.0.25",
+    "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
     "@uifabric/example-app-base": ">=1.3.12 <2.0.0",
diff --git a/common/temp_modules/rush-test-bundle-button/package.json b/common/temp_modules/rush-test-bundle-button/package.json
index 130c4e159491a..f050db2007bdf 100644
--- a/common/temp_modules/rush-test-bundle-button/package.json
+++ b/common/temp_modules/rush-test-bundle-button/package.json
@@ -4,8 +4,9 @@
   "private": true,
   "dependencies": {
     "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
-    "@types/react": "^15.0.16",
-    "@types/react-dom": "^0.14.23",
+    "@types/react": "^15.0.25",
+    "@types/react-addons-test-utils": "^0.14.18",
+    "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
     "source-map-loader": "^0.2.1",
     "ts-loader": "^2.0.1",
diff --git a/common/temp_modules/rush-todo-app/package.json b/common/temp_modules/rush-todo-app/package.json
index 2a40884c4866c..094ca87f26399 100644
--- a/common/temp_modules/rush-todo-app/package.json
+++ b/common/temp_modules/rush-todo-app/package.json
@@ -8,8 +8,8 @@
     "@types/enzyme": "^2.7.5",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "^2.2.39",
-    "@types/react": "^15.0.16",
-    "@types/react-addons-test-utils": "^0.14.17",
+    "@types/react": "^15.0.25",
+    "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
     "react-addons-test-utils": "^15.4.2",
diff --git a/common/temp_modules/rush-utilities/package.json b/common/temp_modules/rush-utilities/package.json
index 4ceed5eb05d12..ab90684968691 100644
--- a/common/temp_modules/rush-utilities/package.json
+++ b/common/temp_modules/rush-utilities/package.json
@@ -8,8 +8,8 @@
     "@types/enzyme": "^2.7.5",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "^2.2.39",
-    "@types/react": "^15.0.16",
-    "@types/react-addons-test-utils": "^0.14.17",
+    "@types/react": "^15.0.25",
+    "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/sinon": "^2.1.3",
     "@types/webpack-env": "^1.13.0",
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 53c0a246b13f6..e4162c59e7de1 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -20,8 +20,8 @@
     "@types/enzyme": "^2.7.5",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "^2.2.39",
-    "@types/react": "^15.0.16",
-    "@types/react-addons-test-utils": "^0.14.17",
+    "@types/react": "^15.0.25",
+    "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
     "enzyme": "^2.7.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 14641f0252990..e6e85cc0bf842 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -17,8 +17,8 @@
     "@types/enzyme": "^2.7.5",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "^2.2.39",
-    "@types/react": "^15.0.16",
-    "@types/react-addons-test-utils": "^0.14.17",
+    "@types/react": "^15.0.25",
+    "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
     "@uifabric/example-app-base": "1.3.13",
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 1c124895f59e5..1b92cd3eb4d70 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -22,8 +22,8 @@
     "@types/enzyme": "^2.7.5",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "^2.2.39",
-    "@types/react": "^15.0.16",
-    "@types/react-addons-test-utils": "^0.14.17",
+    "@types/react": "^15.0.25",
+    "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "^2.1.3",
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index fdbc1784e4677..0ba922a01f667 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -59,7 +59,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     return this.state.items;
   }
 
-  public componentWillUpdate(newProps: IBasePickerProps<T>, newState: IBasePickerState) {
+  public componentWillUpdate(newProps: P, newState: IBasePickerState) {
     if (newState.items && newState.items !== this.state.items) {
       this.selection.setItems(newState.items);
     }
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 49c465860a3f4..e3c38afc43bfb 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -16,8 +16,8 @@
     "@types/chai": "^3.4.35",
     "@types/enzyme": "^2.7.5",
     "@types/mocha": "^2.2.39",
-    "@types/react": "^15.0.16",
-    "@types/react-addons-test-utils": "^0.14.17",
+    "@types/react": "^15.0.25",
+    "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
     "@uifabric/example-app-base": ">=1.3.12 <2.0.0",
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index e1f051df2063f..19e10ee08aceb 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -21,8 +21,8 @@
     "@types/enzyme": "^2.7.5",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "^2.2.39",
-    "@types/react": "^15.0.16",
-    "@types/react-addons-test-utils": "^0.14.17",
+    "@types/react": "^15.0.25",
+    "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/sinon": "^2.1.3",
     "@types/webpack-env": "^1.13.0",
diff --git a/packages/utilities/src/BaseComponent.test.tsx b/packages/utilities/src/BaseComponent.test.tsx
index 7d7c1613aa974..a2f13026430c2 100644
--- a/packages/utilities/src/BaseComponent.test.tsx
+++ b/packages/utilities/src/BaseComponent.test.tsx
@@ -19,8 +19,10 @@ class TestComponent extends BaseComponent<{}, {}> {
     this._createNullRef();
   }
 
-  public shouldComponentUpdate(): void {
+  public shouldComponentUpdate(nextProps?: {}, nextState?: {}): boolean {
     this._createNullRef();
+
+    return true;
   }
 
   public componentWillUpdate(): void {

From 711ff29129624405d7cdd3b4d336d354d8e6751e Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 25 May 2017 03:22:10 -0700
Subject: [PATCH 0008/1641] Applying package updates.

---
 apps/fabric-website/package.json                   |  2 +-
 apps/ssr-tests/package.json                        |  2 +-
 apps/test-bundle-button/package.json               |  2 +-
 apps/todo-app/package.json                         |  2 +-
 common/changes/calendar-a11y_2017-05-18-18-52.json | 10 ----------
 packages/example-component/package.json            |  2 +-
 packages/office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md       |  9 ++++++++-
 packages/office-ui-fabric-react/package.json       |  2 +-
 9 files changed, 28 insertions(+), 17 deletions(-)
 delete mode 100644 common/changes/calendar-a11y_2017-05-18-18-52.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 44baae774f87f..ad6350d2441ab 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -52,7 +52,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=5.1.0 <6.0.0",
-    "office-ui-fabric-react": ">=2.33.0 <3.0.0",
+    "office-ui-fabric-react": ">=2.34.0 <3.0.0",
     "@uifabric/utilities": ">=1.10.0 <2.0.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 0ba025a1edb7b..8b730d3e9f05f 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -25,7 +25,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=2.33.0 <3.0.0",
+    "office-ui-fabric-react": ">=2.34.0 <3.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 2588c02bd350c..b89203fdf9363 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -30,6 +30,6 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=2.33.0 <3.0.0"
+    "office-ui-fabric-react": ">=2.34.0 <3.0.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 209a1c44cce89..ca3164e66e95c 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -25,7 +25,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=5.1.0 <6.0.0",
-    "office-ui-fabric-react": ">=2.33.0 <3.0.0",
+    "office-ui-fabric-react": ">=2.34.0 <3.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2"
diff --git a/common/changes/calendar-a11y_2017-05-18-18-52.json b/common/changes/calendar-a11y_2017-05-18-18-52.json
deleted file mode 100644
index bb9ed312eaf01..0000000000000
--- a/common/changes/calendar-a11y_2017-05-18-18-52.json
+++ /dev/null
@@ -1,10 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DatePicker: Fix for accessibility issues",
-      "type": "minor"
-    }
-  ],
-  "email": "manishda@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index e6e85cc0bf842..f01e1ba69c6aa 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -30,7 +30,7 @@
     "mocha": "^3.2.0",
     "mocha-loader": "^1.1.1",
     "node-sass": "^4.5.0",
-    "office-ui-fabric-react": ">=2.33.0 <3.0.0",
+    "office-ui-fabric-react": ">=2.34.0 <3.0.0",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
     "postcss-loader": "^1.3.3",
     "react": "^15.4.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 6245e06cb2b7a..7e8f9ab1dcef5 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "2.34.0",
+      "tag": "office-ui-fabric-react_v2.34.0",
+      "date": "Thu, 25 May 2017 10:22:10 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Manish Dahamiwal <mdhamiwal@gmail.com>",
+            "commit": "6e3128dc62ea0bda625896939405d1fbc4d2d640",
+            "comment": "DatePicker: Fix for accessibility issues"
+          }
+        ]
+      }
+    },
     {
       "version": "2.33.0",
       "tag": "office-ui-fabric-react_v2.33.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index fda419798d1f6..1ec34f44cd4af 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 24 May 2017 23:52:09 GMT and should not be manually modified.
+This log was last generated on Thu, 25 May 2017 10:22:10 GMT and should not be manually modified.
+
+## 2.34.0
+Thu, 25 May 2017 10:22:10 GMT
+
+### Minor changes
+
+- DatePicker: Fix for accessibility issues
 
 ## 2.33.0
 Wed, 24 May 2017 23:52:09 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 1b92cd3eb4d70..7bdcf6d55a383 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "2.33.0",
+  "version": "2.34.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 01ecef38e4999f165c0c558a6eef996604777a53 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Thu, 25 May 2017 10:15:32 -0700
Subject: [PATCH 0009/1641] Updated pull request template to use npm run change
 (#1860)

* Updated pull request template to use npm run change

* Update PULL_REQUEST_TEMPLATE.md
---
 .github/PULL_REQUEST_TEMPLATE.md | 18 +-----------------
 1 file changed, 1 insertion(+), 17 deletions(-)

diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md
index 88fb78faa62ce..de4a9e97d8393 100644
--- a/.github/PULL_REQUEST_TEMPLATE.md
+++ b/.github/PULL_REQUEST_TEMPLATE.md
@@ -1,7 +1,7 @@
 #### Pull request checklist
 
 - [ ] Addresses an existing issue: Fixes #0000
-- [ ] Include a change request file if publishing <!-- see notes below -->
+- [ ] Include a change request file using `$ npm run change`
 - [ ] New feature, bugfix, or enhancement
   - [ ] Includes tests
 - [ ] Documentation update
@@ -13,19 +13,3 @@
 #### Focus areas to test
 
 (optional)
-
-<!--
-For change request files, you need to use the `rush` tool. You can globally install it:
-
-```
-npm i -g @microsoft/rush
-```
-
-To generate a file, you simply run:
-
-```
-rush change
-```
-
-This will ask you questions about your change and create a json file under the `common/changes` folder. The comments you include in the file will show up in the public changelog notes, so please follow the existing conventions. Commit this file and include it in your PR.
--->

From f3b5400c99c8c441ba776f9d4cf62367a51ec961 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Thu, 25 May 2017 10:18:14 -0700
Subject: [PATCH 0010/1641] Update PULL_REQUEST_TEMPLATE.md

---
 .github/PULL_REQUEST_TEMPLATE.md | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md
index de4a9e97d8393..96596ef25f373 100644
--- a/.github/PULL_REQUEST_TEMPLATE.md
+++ b/.github/PULL_REQUEST_TEMPLATE.md
@@ -2,9 +2,6 @@
 
 - [ ] Addresses an existing issue: Fixes #0000
 - [ ] Include a change request file using `$ npm run change`
-- [ ] New feature, bugfix, or enhancement
-  - [ ] Includes tests
-- [ ] Documentation update
 
 #### Description of changes
 

From a564ac9adcc0b2fdbcdf00ac97b797e81ab4ebbe Mon Sep 17 00:00:00 2001
From: Kristian Halle <khalle@microsoft.com>
Date: Thu, 25 May 2017 20:43:34 +0200
Subject: [PATCH 0011/1641] Update to logic for calculating initials (#1853)

* Update to logic for calculating initials

* Adding rush change file
---
 .../fix-initials_2017-05-24-20-35.json        | 15 ++++
 .../src/components/Persona/Persona.test.tsx   |  2 +-
 packages/utilities/src/initials.test.ts       | 55 ++++++++++++--
 packages/utilities/src/initials.ts            | 73 +++++--------------
 4 files changed, 81 insertions(+), 64 deletions(-)
 create mode 100644 common/changes/fix-initials_2017-05-24-20-35.json

diff --git a/common/changes/fix-initials_2017-05-24-20-35.json b/common/changes/fix-initials_2017-05-24-20-35.json
new file mode 100644
index 0000000000000..cac5a0f34f48a
--- /dev/null
+++ b/common/changes/fix-initials_2017-05-24-20-35.json
@@ -0,0 +1,15 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Persona: Updated test to match new logic for calculating initials.",
+      "type": "patch"
+    },
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Utilities: Fixed incorrect calculation of initials. Properly remove unwanted ASCII characters, and do not calculate initials for Arabic and CJK based languages. ",
+      "type": "patch"
+    }
+  ],
+  "email": "khalle@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
index 2ace343e5f64a..2328edc3783da 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
@@ -51,7 +51,7 @@ describe('Persona', () => {
       wrapper = shallow(<Persona primaryText='David (The man) Goff' />);
       result = wrapper.find('.' + styles.initials);
       expect(result).to.have.length(1);
-      expect(result.text()).to.equal('D');
+      expect(result.text()).to.equal('DG');
     });
 
     it('calculates an expected initials in RTL if one was not specified', () => {
diff --git a/packages/utilities/src/initials.test.ts b/packages/utilities/src/initials.test.ts
index a5661ff8d8aab..462004f6a2c91 100644
--- a/packages/utilities/src/initials.test.ts
+++ b/packages/utilities/src/initials.test.ts
@@ -16,6 +16,14 @@ describe('getInitials', () => {
     expect(result).to.equal('KL');
   });
 
+  it('calculates an expected initials in LTR for non-ASCII characters', () => {
+    let result = getInitials('Írissa Þórðardóttir', false);
+    expect(result).to.equal('ÍÞ');
+
+    result = getInitials('Øyvind Åsen', false);
+    expect(result).to.equal('ØÅ');
+  });
+
   it('calculates an expected initials in LTR with a hypen', () => {
     let result = getInitials('David Zearing-Goff', false);
     expect(result).to.equal('DZ');
@@ -28,7 +36,12 @@ describe('getInitials', () => {
 
   it('calculates an expected initials in LTR with parentheses', () => {
     let result = getInitials('David (The man) Goff', false);
-    expect(result).to.equal('D');
+    expect(result).to.equal('DG');
+  });
+
+  it('calculates an expected initials in LTR with multiple parentheses, extra spaces, and unwanted characters', () => {
+    let result = getInitials(' !@#$%^&*()=+ (Alpha) David   (The man) `~<>,./?[]{}|\   Goff   (Gamma)    ', false);
+    expect(result).to.equal('DG');
   });
 
   it('calculates an expected initials in RTL if one was not specified', () => {
@@ -36,30 +49,56 @@ describe('getInitials', () => {
     expect(result).to.equal('LK');
   });
 
+  it('calculates an expected initials in LTR for names with multiple components', () => {
+    let result = getInitials('A', false);
+    expect(result).to.equal('A');
+
+    result = getInitials('A B', false);
+    expect(result).to.equal('AB');
+
+    result = getInitials('A B C', false);
+    expect(result).to.equal('AC');
+
+    result = getInitials('A B C D', false);
+    expect(result).to.equal('A');
+  });
+
   it('calculates an expected initials for Arabic names', () => {
     let result = getInitials('خسرو رحیمی', true);
-    expect(result).to.equal('ی');
+    expect(result).to.equal('');
   });
 
   it('calculates an expected initials for Chinese names', () => {
     let result = getInitials('桂英', false);
-    expect(result).to.equal('英');
+    expect(result).to.equal('');
 
     result = getInitials('佳', false);
-    expect(result).to.equal('佳');
+    expect(result).to.equal('');
 
     result = getInitials('宋智洋', false);
-    expect(result).to.equal('智洋');
+    expect(result).to.equal('');
   });
 
   it('calculates an expected initials for Korean names', () => {
     let result = getInitials('강현', false);
-    expect(result).to.equal('현');
+    expect(result).to.equal('');
 
     result = getInitials('최종래', false);
-    expect(result).to.equal('종래');
+    expect(result).to.equal('');
 
     result = getInitials('남궁 성종', false);
-    expect(result).to.equal('성종');
+    expect(result).to.equal('');
+  });
+
+  it('calculates an expected initials for Japanese names', () => {
+    let result = getInitials('松田', false);
+    expect(result).to.equal('');
+
+    result = getInitials('海野', false);
+    expect(result).to.equal('');
+
+    result = getInitials('かり', false);
+    expect(result).to.equal('');
   });
+
 });
diff --git a/packages/utilities/src/initials.ts b/packages/utilities/src/initials.ts
index 8f874ff8257c4..43f2d08283272 100644
--- a/packages/utilities/src/initials.ts
+++ b/packages/utilities/src/initials.ts
@@ -1,51 +1,24 @@
-/** Regex to detect words within paraenthesis in a string where gi implies global and case-insensitive. */
-const CHARS_WITHIN_PARENTHESIS_REGEX: RegExp = new RegExp('\\(([^)]*)\\)', 'gi');
-
 /**
- *  Matches any non-word characters with respect to the Unicode codepoints; generated by
- * https://mothereff.in/regexpu for regex /\W /u where u stands for Unicode support (ES6 feature).
- * More info here: http://stackoverflow.com/questions/280712/javascript-unicode-regexes.
- * gi implies global and case-insensitive.
+ * Regular expression matching characters to ignore when calculating the initials.
+ * The first part matches characters within parenthesis, including the parenthesis.
+ * The second part matches special ASCII characters except space, plus some unicode special characters.
  */
-/* tslint:disable:max-line-length */
-const UNICODE_ALPHANUMERIC_CHARS_REGEX =
-  new RegExp(
-    '(?:[\0-/:-@\[-\^`\{-\uD7FF\uE000-\uFFFF]|[\uD800-\uDBFF][\uDC00-\uDFFF]|[\uD800-\uDBFF](?![\uDC00-\uDFFF])|(?:[^\uD800-\uDBFF]|^)[\uDC00-\uDFFF]) ',
-    'gi');
-/* tslint:enable:max-line-length */
-
-/** Regex to detect multiple spaces in a string where gi implies global and case-insensitive. */
-const MULTIPLE_WHITESPACES_REGEX_TOKEN: RegExp = new RegExp('\\s+', 'gi');
-
-/** Regex to detect Arabic text. */
-const ARABIC_LANGUAGE_REGEX = new RegExp('[\u0621-\u064A\u0660-\u0669]');
+const UNWANTED_CHARS_REGEX: RegExp = /\([^)]*\)|[\0-\u001F\!-/:-@\[-`\{-\u00BF\u0250-\u036F\uD800-\uFFFF]/g;
 
-/** Regex to detect Korean text. */
-const KOREAN_LANGUAGE_REGEX = new RegExp('[\u1100-\u11FF|\u3130-\u318F|\uA960-\uA97F|\uAC00-\uD7AF|\uD7B0-\uD7FF]');
+/** Regular expression matching one or more spaces. */
+const MULTIPLE_WHITESPACES_REGEX: RegExp = /\s+/g;
 
-/** Regex to detect Chinese text. */
+/**
+ * Regular expression matching languages for which we currently don't support initials.
+ * Arabic:   Arabic, Arabic Supplement, Arabic Extended-A.
+ * Korean:   Hangul Jamo, Hangul Compatibility Jamo, Hangul Jamo Extended-A, Hangul Syllables, Hangul Jamo Extended-B.
+ * Japanese: Hiragana, Katakana.
+ * CJK:      CJK Unified Ideographs Extension A, CJK Unified Ideographs, CJK Compatibility Ideographs, CJK Unified Ideographs Extension B
+ */
 /* tslint:disable:max-line-length */
-const CHINESE_LANGUAGE_REGEX = new RegExp('[\u4E00-\u9FCC\u3400-\u4DB5\uFA0E\uFA0F\uFA11\uFA13\uFA14\uFA1F\uFA21\uFA23\uFA24\uFA27-\uFA29]|[\ud840-\ud868][\udc00-\udfff]|\ud869[\udc00-\uded6\udf00-\udfff]|[\ud86a-\ud86c][\udc00-\udfff]|\ud86d[\udc00-\udf34\udf40-\udfff]|\ud86e[\udc00-\udc1d]');
+const UNSUPPORTED_TEXT_REGEX: RegExp = /[\u0600-\u06FF\u0750-\u077F\u08A0-\u08FF\u1100-\u11FF\u3130-\u318F\uA960-\uA97F\uAC00-\uD7AF\uD7B0-\uD7FF\u3040-\u309F\u30A0-\u30FF\u3400-\u4DBF\u4E00-\u9FFF\uF900-\uFAFF]|[\uD840-\uD869][\uDC00-\uDED6]/;
 /* tslint:enable:max-line-length */
 
-function getInitialsArabic(displayName: string, isRtl: boolean): string {
-  const name = displayName.replace(/\s/, '');
-
-  return isRtl ? name[name.length - 1] : name[0];
-}
-
-function getInitialsAsian(displayName: string, isRtl: boolean): string {
-  const name = displayName.replace(/\s/, '');
-
-  // For short names, only display a single character of the family name
-  if (name.length <= 2) {
-    return isRtl ? name[0] : name[name.length - 1];
-  }
-
-  // For long names, display the two most significant characters of the family name
-  return isRtl ? name.substr(0, 2) : name.substr(name.length - 2, name.length);
-}
-
 function getInitialsLatin(displayName: string, isRtl: boolean): string {
   let initials = '';
 
@@ -69,14 +42,8 @@ function getInitialsLatin(displayName: string, isRtl: boolean): string {
 }
 
 function cleanupDisplayName(displayName: string): string {
-  // Do not consider the suffixes within parenthesis while computing the initials.
-  displayName = displayName.replace(CHARS_WITHIN_PARENTHESIS_REGEX, '');
-
-  // Ignore non-word characters
-  displayName = displayName.replace(UNICODE_ALPHANUMERIC_CHARS_REGEX, '');
-
-  // Make whitespace consistent
-  displayName = displayName.replace(MULTIPLE_WHITESPACES_REGEX_TOKEN, ' ');
+  displayName = displayName.replace(UNWANTED_CHARS_REGEX, '');
+  displayName = displayName.replace(MULTIPLE_WHITESPACES_REGEX, ' ');
   displayName = displayName.trim();
 
   return displayName;
@@ -90,12 +57,8 @@ export function getInitials(displayName: string, isRtl: boolean): string {
 
   displayName = cleanupDisplayName(displayName);
 
-  if (ARABIC_LANGUAGE_REGEX.test(displayName)) {
-    return getInitialsArabic(displayName, isRtl);
-  }
-
-  if (KOREAN_LANGUAGE_REGEX.test(displayName) || CHINESE_LANGUAGE_REGEX.test(displayName)) {
-    return getInitialsAsian(displayName, isRtl);
+  if (UNSUPPORTED_TEXT_REGEX.test(displayName)) {
+    return '';
   }
 
   return getInitialsLatin(displayName, isRtl);

From 558e0661028df1c0dbf5430a460a1ac866187396 Mon Sep 17 00:00:00 2001
From: Meetu Agarwal <meetu.agarwal18@gmail.com>
Date: Fri, 26 May 2017 02:04:35 +0530
Subject: [PATCH 0012/1641] Adding className prop to datepicker .  (#1852)

* Update DatePicker.Props.ts

adding prop to datepicker

* Update DatePicker.tsx

added classname to datepicker div

* Update DatePicker.tsx

adding classname in this.props

* Update DatePicker.Props.ts

good comment
---
 .../src/components/DatePicker/DatePicker.Props.ts            | 5 +++++
 .../src/components/DatePicker/DatePicker.tsx                 | 5 +++--
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
index 45304d78c9ad3..f8e618eccc512 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
@@ -102,6 +102,11 @@ export interface IDatePickerProps extends React.Props<DatePicker> {
    * @defaultvalue false
    */
   borderless?: boolean;
+  
+  /**
+   * Optional Classname for datepicker root element .
+   */
+  className?: string;
 }
 
 export interface IDatePickerStrings {
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index caf42139df205..d020decf3fb94 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -172,12 +172,13 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
       pickerAriaLabel,
       placeholder,
       allowTextInput,
-      borderless
+      borderless,
+      className
     } = this.props;
     const { isDatePickerShown, formattedDate, selectedDate, errorMessage } = this.state;
 
     return (
-      <div className={ css('ms-DatePicker', styles.root) } ref='root'>
+      <div className={ css('ms-DatePicker', styles.root, className) } ref='root'>
         <div ref={ (c): HTMLElement => this._datepicker = c }>
           <TextField
             className={ styles.textField }

From b8f035edde96da0435d72c8fa4623e65f93d96c3 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 25 May 2017 23:11:03 -0700
Subject: [PATCH 0013/1641] ResizeGroup: Debounce window resize events to
 improve performance (#1864)

* Debounce window resize events to improve performance

* Rush change

* Update resizegroup-debounce_2017-05-25-17-42.json

* Make the debounce happen on the leading edge so that the unit tests pass.
---
 .../changes/resizegroup-debounce_2017-05-25-17-42.json | 10 ++++++++++
 .../src/components/ResizeGroup/ResizeGroup.tsx         |  4 +++-
 2 files changed, 13 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/resizegroup-debounce_2017-05-25-17-42.json

diff --git a/common/changes/resizegroup-debounce_2017-05-25-17-42.json b/common/changes/resizegroup-debounce_2017-05-25-17-42.json
new file mode 100644
index 0000000000000..bf64641e6ba46
--- /dev/null
+++ b/common/changes/resizegroup-debounce_2017-05-25-17-42.json
@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ResizeGroup: Debounce window resize events to improve performance",
+      "type": "patch"
+    }
+  ],
+  "email": "chrisgo@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index 64ca40b6d8e33..832097067988e 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -6,6 +6,8 @@ import {
 import { IResizeGroupProps } from './ResizeGroup.Props';
 import styles = require('./ResizeGroup.scss');
 
+const RESIZE_DELAY = 16;
+
 export interface IResizeGroupState {
 
   /**
@@ -54,7 +56,7 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
 
   public componentDidMount() {
     this._measureItems();
-    this._events.on(window, 'resize', this._onResize);
+    this._events.on(window, 'resize', this._async.debounce(this._onResize, RESIZE_DELAY, { leading: true }));
   }
 
   public render() {

From 3cb72a1706282aa11843b7f2e42b64bdf88001d2 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 26 May 2017 10:21:04 +0000
Subject: [PATCH 0014/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 18 +++++++++++++
 apps/fabric-website/CHANGELOG.md              |  7 ++++-
 apps/fabric-website/package.json              |  8 +++---
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../fix-initials_2017-05-24-20-35.json        | 15 -----------
 ...resizegroup-debounce_2017-05-25-17-42.json | 10 -------
 packages/example-app-base/CHANGELOG.json      | 12 +++++++++
 packages/example-app-base/CHANGELOG.md        |  7 ++++-
 packages/example-app-base/package.json        |  4 +--
 packages/example-component/package.json       |  8 +++---
 .../office-ui-fabric-react/CHANGELOG.json     | 27 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 ++++++-
 packages/office-ui-fabric-react/package.json  |  6 ++---
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 ++++++++++
 packages/utilities/CHANGELOG.md               |  9 ++++++-
 packages/utilities/package.json               |  2 +-
 19 files changed, 118 insertions(+), 47 deletions(-)
 delete mode 100644 common/changes/fix-initials_2017-05-24-20-35.json
 delete mode 100644 common/changes/resizegroup-debounce_2017-05-25-17-42.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index ac3998a25d25e..7203eac8d15cb 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,24 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.5.26",
+      "tag": "@uifabric/fabric-website_v4.5.26",
+      "date": "Fri, 26 May 2017 10:21:03 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `1.3.13` to `1.3.14`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=2.34.0 <3.0.0` to `>=2.34.1 <3.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=1.10.0 <2.0.0` to `>=1.10.2 <2.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.5.25",
       "tag": "@uifabric/fabric-website_v4.5.25",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 8dba09bcbe253..04283b609bd93 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Tue, 23 May 2017 10:16:04 GMT and should not be manually modified.
+This log was last generated on Fri, 26 May 2017 10:21:03 GMT and should not be manually modified.
+
+## 4.5.26
+Fri, 26 May 2017 10:21:03 GMT
+
+*Changes not tracked*
 
 ## 4.5.25
 Tue, 23 May 2017 10:16:04 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index ad6350d2441ab..f8bfe1ae4b26d 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.5.25",
+  "version": "4.5.26",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,12 +47,12 @@
     "webpack-bundle-analyzer": "^2.2.1"
   },
   "dependencies": {
-    "@uifabric/example-app-base": "1.3.13",
+    "@uifabric/example-app-base": "1.3.14",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=5.1.0 <6.0.0",
-    "office-ui-fabric-react": ">=2.34.0 <3.0.0",
-    "@uifabric/utilities": ">=1.10.0 <2.0.0"
+    "office-ui-fabric-react": ">=2.34.1 <3.0.0",
+    "@uifabric/utilities": ">=1.10.2 <2.0.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 8b730d3e9f05f..fefaeca58c698 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -25,7 +25,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=2.34.0 <3.0.0",
+    "office-ui-fabric-react": ">=2.34.1 <3.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index b89203fdf9363..24eeed947e7c6 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -30,6 +30,6 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=2.34.0 <3.0.0"
+    "office-ui-fabric-react": ">=2.34.1 <3.0.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index ca3164e66e95c..33ce286f303ab 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -25,7 +25,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=5.1.0 <6.0.0",
-    "office-ui-fabric-react": ">=2.34.0 <3.0.0",
+    "office-ui-fabric-react": ">=2.34.1 <3.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2"
diff --git a/common/changes/fix-initials_2017-05-24-20-35.json b/common/changes/fix-initials_2017-05-24-20-35.json
deleted file mode 100644
index cac5a0f34f48a..0000000000000
--- a/common/changes/fix-initials_2017-05-24-20-35.json
+++ /dev/null
@@ -1,15 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Persona: Updated test to match new logic for calculating initials.",
-      "type": "patch"
-    },
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Utilities: Fixed incorrect calculation of initials. Properly remove unwanted ASCII characters, and do not calculate initials for Arabic and CJK based languages. ",
-      "type": "patch"
-    }
-  ],
-  "email": "khalle@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/resizegroup-debounce_2017-05-25-17-42.json b/common/changes/resizegroup-debounce_2017-05-25-17-42.json
deleted file mode 100644
index bf64641e6ba46..0000000000000
--- a/common/changes/resizegroup-debounce_2017-05-25-17-42.json
+++ /dev/null
@@ -1,10 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ResizeGroup: Debounce window resize events to improve performance",
-      "type": "patch"
-    }
-  ],
-  "email": "chrisgo@microsoft.com"
-}
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index f5d7ee69cf4b8..8dcce9744f517 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,18 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "1.3.14",
+      "tag": "@uifabric/example-app-base_v1.3.14",
+      "date": "Fri, 26 May 2017 10:21:03 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `1.10.1` to `1.10.2`"
+          }
+        ]
+      }
+    },
     {
       "version": "1.3.13",
       "tag": "@uifabric/example-app-base_v1.3.13",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index 72387348ae199..43a046f210e40 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Tue, 23 May 2017 10:16:04 GMT and should not be manually modified.
+This log was last generated on Fri, 26 May 2017 10:21:03 GMT and should not be manually modified.
+
+## 1.3.14
+Fri, 26 May 2017 10:21:03 GMT
+
+*Changes not tracked*
 
 ## 1.3.13
 Tue, 23 May 2017 10:16:04 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index e4162c59e7de1..2dc0c6e31df53 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "1.3.13",
+  "version": "1.3.14",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -40,7 +40,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/utilities": "1.10.1",
+    "@uifabric/utilities": "1.10.2",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=5.0.0 <6.0.0",
     "office-ui-fabric-react": ">=2.11.0-0 <3.0.0-0"
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index f01e1ba69c6aa..a64079112483d 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-component",
-  "version": "1.0.24",
+  "version": "1.0.25",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -21,8 +21,8 @@
     "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "1.3.13",
-    "@uifabric/utilities": "1.10.1",
+    "@uifabric/example-app-base": "1.3.14",
+    "@uifabric/utilities": "1.10.2",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -30,7 +30,7 @@
     "mocha": "^3.2.0",
     "mocha-loader": "^1.1.1",
     "node-sass": "^4.5.0",
-    "office-ui-fabric-react": ">=2.34.0 <3.0.0",
+    "office-ui-fabric-react": ">=2.34.1 <3.0.0",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
     "postcss-loader": "^1.3.3",
     "react": "^15.4.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 7e8f9ab1dcef5..8a65119424dbf 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,33 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "2.34.1",
+      "tag": "office-ui-fabric-react_v2.34.1",
+      "date": "Fri, 26 May 2017 10:21:03 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Kristian Halle <khalle@microsoft.com>",
+            "commit": "a564ac9adcc0b2fdbcdf00ac97b797e81ab4ebbe",
+            "comment": "Persona: Updated test to match new logic for calculating initials."
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "b8f035edde96da0435d72c8fa4623e65f93d96c3",
+            "comment": "ResizeGroup: Debounce window resize events to improve performance"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=1.10.0 <2.0.0` to `>=1.10.2 <2.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `1.3.13` to `1.3.14`"
+          }
+        ]
+      }
+    },
     {
       "version": "2.34.0",
       "tag": "office-ui-fabric-react_v2.34.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 1ec34f44cd4af..004b42d206413 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 25 May 2017 10:22:10 GMT and should not be manually modified.
+This log was last generated on Fri, 26 May 2017 10:21:03 GMT and should not be manually modified.
+
+## 2.34.1
+Fri, 26 May 2017 10:21:03 GMT
+
+### Patches
+
+- Persona: Updated test to match new logic for calculating initials.
+- ResizeGroup: Debounce window resize events to improve performance
 
 ## 2.34.0
 Thu, 25 May 2017 10:22:10 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 7bdcf6d55a383..efaf3d4b80cf9 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "2.34.0",
+  "version": "2.34.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -28,7 +28,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "^2.1.3",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "1.3.13",
+    "@uifabric/example-app-base": "1.3.14",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -69,7 +69,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=1.10.0 <2.0.0"
+    "@uifabric/utilities": ">=1.10.2 <2.0.0"
   },
   "peerDependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/packages/styling/package.json b/packages/styling/package.json
index e3c38afc43bfb..bbbaa5cd1da58 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -44,7 +44,7 @@
     "webpack-split-by-path": "2.0.0"
   },
   "dependencies": {
-    "@uifabric/utilities": ">=1.10.0 <2.0.0",
+    "@uifabric/utilities": ">=1.10.2 <2.0.0",
     "glamor": "^2.20.24",
     "rtl-css-js": "^1.1.0"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index e47549b41ee02..8c438499544e0 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "1.10.2",
+      "tag": "@uifabric/utilities_v1.10.2",
+      "date": "Fri, 26 May 2017 10:21:03 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Kristian Halle <khalle@microsoft.com>",
+            "commit": "a564ac9adcc0b2fdbcdf00ac97b797e81ab4ebbe",
+            "comment": "Utilities: Fixed incorrect calculation of initials. Properly remove unwanted ASCII characters, and do not calculate initials for Arabic and CJK based languages. "
+          }
+        ]
+      }
+    },
     {
       "version": "1.10.1",
       "tag": "@uifabric/utilities_v1.10.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index b163ae25bad18..282a2e8dd333b 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Wed, 24 May 2017 23:52:09 GMT and should not be manually modified.
+This log was last generated on Fri, 26 May 2017 10:21:03 GMT and should not be manually modified.
+
+## 1.10.2
+Fri, 26 May 2017 10:21:03 GMT
+
+### Patches
+
+- Utilities: Fixed incorrect calculation of initials. Properly remove unwanted ASCII characters, and do not calculate initials for Arabic and CJK based languages. 
 
 ## 1.10.1
 Wed, 24 May 2017 23:52:09 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 19e10ee08aceb..83cd6a8f7396c 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "1.10.1",
+  "version": "1.10.2",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From e6b653bc329e80ebc5e046055e4cb00553a465ae Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pablo=20N=C3=BA=C3=B1ez?= <pablonete@gmail.com>
Date: Fri, 26 May 2017 18:34:29 +0200
Subject: [PATCH 0015/1641] ContextualMenu: Prevent li to be actionable, move
 role down to button/anchor. (#1868)

* Use presentation in li and move menuitem role down to the button.

* Change description

* Move role and labels to ul.
In order to match aria spec example and to prevent native ul role to interfere.

* Fixed aria-labelledby spelling.
---
 ...enu-rolePresentation_2017-05-26-08-29.json | 30 +++++++++++++++++++
 .../ContextualMenu/ContextualMenu.tsx         | 20 +++++++------
 2 files changed, 41 insertions(+), 9 deletions(-)
 create mode 100644 common/changes/contextualMenu-rolePresentation_2017-05-26-08-29.json

diff --git a/common/changes/contextualMenu-rolePresentation_2017-05-26-08-29.json b/common/changes/contextualMenu-rolePresentation_2017-05-26-08-29.json
new file mode 100644
index 0000000000000..bd291d76ffb46
--- /dev/null
+++ b/common/changes/contextualMenu-rolePresentation_2017-05-26-08-29.json
@@ -0,0 +1,30 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: prevent Narrator to announce items twice.",
+      "type": "patch"
+    },
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    },
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    },
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    },
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "email": "v-panu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index f6ab74fe0d3bd..db7522f9dfc40 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -196,10 +196,10 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     let contextMenuStyle;
     let targetAsHtmlElement = this._target as HTMLElement;
     if (useTargetWidth && targetAsHtmlElement && targetAsHtmlElement.offsetWidth) {
-        let contextMenuWidth = targetAsHtmlElement.offsetWidth;
-        contextMenuStyle = {
-            width: contextMenuWidth
-        };
+      let contextMenuWidth = targetAsHtmlElement.offsetWidth;
+      contextMenuStyle = {
+        width: contextMenuWidth
+      };
     }
 
     // The menu should only return if items were provided, if no items were provided then it should not appear.
@@ -222,18 +222,18 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
           onDismiss={ this.props.onDismiss }
           bounds={ bounds }
           directionalHintFixed={ directionalHintFixed }>
-          <div style={contextMenuStyle} ref={ (host: HTMLDivElement) => this._host = host } id={ id } className={ css('ms-ContextualMenu-container', className) }>
+          <div style={ contextMenuStyle } ref={ (host: HTMLDivElement) => this._host = host } id={ id } className={ css('ms-ContextualMenu-container', className) }>
             { (items && items.length) ? (
               <FocusZone
                 className={ css('ms-ContextualMenu is-open', styles.root) }
                 direction={ arrowDirection }
-                ariaLabelledBy={ labelElementId }
                 ref={ (focusZone) => this._focusZone = focusZone }
-                role='menu'
-                aria-label={ ariaLabel }
                 isCircularNavigation={ true }
               >
                 <ul
+                  role='menu'
+                  aria-label={ ariaLabel }
+                  aria-labelledby={ labelElementId }
                   className={ css('ms-ContextualMenu-list is-open', styles.list) }
                   onKeyDown={ this._onKeyDown }>
                   { items.map((item, index) => (
@@ -278,7 +278,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
   private _renderListItem(content: React.ReactNode, key: string | number, className?: string, title?: string) {
     return <li
-      role='menuitem'
+      role='presentation'
       title={ title }
       key={ key }
       className={ css('ms-ContextualMenu-item', styles.item, className) }>
@@ -323,6 +323,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
             'ms-ContextualMenu-link',
             styles.link,
             (item.isDisabled || item.disabled) && 'is-disabled') }
+          role='menuitem'
           style={ item.style }
           onClick={ this._onAnchorClick.bind(this, item) }>
           { this._renderMenuItemChildren(item, index, hasCheckmarks, hasIcons) }
@@ -359,6 +360,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       'aria-label': ariaLabel,
       'aria-haspopup': hasSubmenuItems(item) ? true : null,
       'aria-owns': item.key === expandedMenuItemKey ? subMenuId : null,
+      role: 'menuitem',
       style: item.style,
     };
 

From 8132b9cbb2e14f026f387316327a4fb31a4b4284 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Sat, 27 May 2017 01:47:19 +0000
Subject: [PATCH 0016/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...enu-rolePresentation_2017-05-26-08-29.json | 30 -------------------
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 14 +++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 +++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 9 files changed, 28 insertions(+), 37 deletions(-)
 delete mode 100644 common/changes/contextualMenu-rolePresentation_2017-05-26-08-29.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index f8bfe1ae4b26d..ae9537b5e350b 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -52,7 +52,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=5.1.0 <6.0.0",
-    "office-ui-fabric-react": ">=2.34.1 <3.0.0",
+    "office-ui-fabric-react": ">=2.34.2 <3.0.0",
     "@uifabric/utilities": ">=1.10.2 <2.0.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index fefaeca58c698..15b74e322819c 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -25,7 +25,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=2.34.1 <3.0.0",
+    "office-ui-fabric-react": ">=2.34.2 <3.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 24eeed947e7c6..fc731a94de519 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -30,6 +30,6 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=2.34.1 <3.0.0"
+    "office-ui-fabric-react": ">=2.34.2 <3.0.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 33ce286f303ab..4ecec96f13072 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -25,7 +25,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=5.1.0 <6.0.0",
-    "office-ui-fabric-react": ">=2.34.1 <3.0.0",
+    "office-ui-fabric-react": ">=2.34.2 <3.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2"
diff --git a/common/changes/contextualMenu-rolePresentation_2017-05-26-08-29.json b/common/changes/contextualMenu-rolePresentation_2017-05-26-08-29.json
deleted file mode 100644
index bd291d76ffb46..0000000000000
--- a/common/changes/contextualMenu-rolePresentation_2017-05-26-08-29.json
+++ /dev/null
@@ -1,30 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: prevent Narrator to announce items twice.",
-      "type": "patch"
-    },
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    },
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    },
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    },
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "email": "v-panu@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index a64079112483d..d4a022c8a2b22 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -30,7 +30,7 @@
     "mocha": "^3.2.0",
     "mocha-loader": "^1.1.1",
     "node-sass": "^4.5.0",
-    "office-ui-fabric-react": ">=2.34.1 <3.0.0",
+    "office-ui-fabric-react": ">=2.34.2 <3.0.0",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
     "postcss-loader": "^1.3.3",
     "react": "^15.4.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 8a65119424dbf..19ba6585ba376 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "2.34.2",
+      "tag": "office-ui-fabric-react_v2.34.2",
+      "date": "Sat, 27 May 2017 01:47:19 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Pablo Núñez <pablonete@gmail.com>",
+            "commit": "e6b653bc329e80ebc5e046055e4cb00553a465ae",
+            "comment": "ContextualMenu: prevent Narrator to announce items twice."
+          }
+        ]
+      }
+    },
     {
       "version": "2.34.1",
       "tag": "office-ui-fabric-react_v2.34.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 004b42d206413..a86fdc7d48eec 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 26 May 2017 10:21:03 GMT and should not be manually modified.
+This log was last generated on Sat, 27 May 2017 01:47:19 GMT and should not be manually modified.
+
+## 2.34.2
+Sat, 27 May 2017 01:47:19 GMT
+
+### Patches
+
+- ContextualMenu: prevent Narrator to announce items twice.
 
 ## 2.34.1
 Fri, 26 May 2017 10:21:03 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index efaf3d4b80cf9..c4a4de81be473 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "2.34.1",
+  "version": "2.34.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From f812b804e890fd7762e0c09226fb28f9e5036717 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Sat, 27 May 2017 08:21:45 -0700
Subject: [PATCH 0017/1641] ResizeGroup: Reduce the number of renders when
 shrinking the window (#1875)

* Don't rerender when everything already fits in a resize group.

* Add comments

* More accurate typing of _lastKnownRootWidth

* update grammer, add new test

* Rush change

* Update resizegroup-optimize-shrink_2017-05-26-21-04.json
---
 ...roup-optimize-shrink_2017-05-26-21-04.json | 10 +++
 .../ResizeGroup/ResizeGroup.test.tsx          | 78 +++++++++++++++++--
 .../components/ResizeGroup/ResizeGroup.tsx    | 25 +++++-
 3 files changed, 103 insertions(+), 10 deletions(-)
 create mode 100644 common/changes/resizegroup-optimize-shrink_2017-05-26-21-04.json

diff --git a/common/changes/resizegroup-optimize-shrink_2017-05-26-21-04.json b/common/changes/resizegroup-optimize-shrink_2017-05-26-21-04.json
new file mode 100644
index 0000000000000..3be096ea38bc2
--- /dev/null
+++ b/common/changes/resizegroup-optimize-shrink_2017-05-26-21-04.json
@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ResizeGroup: Reduce the number of render calls when reducing the width.",
+      "type": "patch"
+    }
+  ],
+  "email": "chrisgo@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
index 8a6e65b994b23..f1747af1d86be 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
@@ -89,7 +89,7 @@ describe('ResizeGroup', () => {
     expect(onRenderData.called).to.equal(false);
   });
 
-  it('will remeasure if props are updated', () => {
+  it('remeasures if props are updated', () => {
     const onReduceData = sinon.spy();
     const onRenderData = sinon.spy();
 
@@ -107,7 +107,7 @@ describe('ResizeGroup', () => {
     expect(onRenderData.callCount).to.equal(4);
   });
 
-  it('will call onReduceData when contents do not fit', () => {
+  it('calls onReduceData when contents do not fit', () => {
     let { wrapper, onReduceDataSpy, rootGetClientRectMock, measuredGetClientRectMock } = getWrapperWithMocks();
 
     onReduceDataSpy.reset();
@@ -120,25 +120,89 @@ describe('ResizeGroup', () => {
     expect(onReduceDataSpy.callCount).to.equal(1);
   });
 
-  it('will measure after a window resize', () => {
-    let { onReduceDataSpy, rootGetClientRectMock, measuredGetClientRectMock } = getWrapperWithMocks();
+  it('measures after a window resize that grows the container', () => {
+    let { onReduceDataSpy, rootGetClientRectMock, measuredGetClientRectMock, wrapper } = getWrapperWithMocks();
+
+    // Initial render with measurements
+    rootGetClientRectMock.returns({ width: 200 });
+    measuredGetClientRectMock.returns({ width: 100 });
+    wrapper.setState({ shouldMeasure: true });
 
     onReduceDataSpy.reset();
     rootGetClientRectMock.reset();
     measuredGetClientRectMock.reset();
+
+    rootGetClientRectMock.returns({ width: 250 });
+    measuredGetClientRectMock.returns({ width: 100 });
+
+    let renderSpy = setRenderSpy(wrapper);
+    window.dispatchEvent(new Event('resize'));
+
+    expect(rootGetClientRectMock.callCount).to.equal(2);
+    expect(measuredGetClientRectMock.callCount).to.equal(1);
+
+    // Don't call onReduceData because everything fits.
+    expect(onReduceDataSpy.callCount).to.equal(0);
+    expect(renderSpy.callCount).to.equal(2);
+  });
+
+  it('does not render after a window resize that shrinks the container and everything still fits', () => {
+    let { onReduceDataSpy, rootGetClientRectMock, measuredGetClientRectMock, wrapper } = getWrapperWithMocks();
+
+    // Initial render with measurements
     rootGetClientRectMock.returns({ width: 200 });
     measuredGetClientRectMock.returns({ width: 100 });
+    wrapper.setState({ shouldMeasure: true });
+
+    onReduceDataSpy.reset();
+    rootGetClientRectMock.reset();
+    measuredGetClientRectMock.reset();
+
+    rootGetClientRectMock.returns({ width: 150 });
+    measuredGetClientRectMock.returns({ width: 100 });
 
+    let renderSpy = setRenderSpy(wrapper);
     window.dispatchEvent(new Event('resize'));
 
     expect(rootGetClientRectMock.callCount).to.equal(1);
-    expect(measuredGetClientRectMock.callCount).to.equal(1);
+    expect(measuredGetClientRectMock.callCount).to.equal(0);
 
-    // Don't call onReduceData since everything fits
+    // Don't call onReduceData or render because everything already fits.
     expect(onReduceDataSpy.callCount).to.equal(0);
+    expect(renderSpy.callCount).to.equal(0);
+  });
+
+  it('does render after a window resize that shrinks the container and things do not fit', () => {
+    let { onReduceDataSpy, rootGetClientRectMock, measuredGetClientRectMock, wrapper } = getWrapperWithMocks();
+
+    // Initial render with measurements
+    rootGetClientRectMock.returns({ width: 200 });
+    measuredGetClientRectMock.returns({ width: 100 });
+    wrapper.setState({ shouldMeasure: true });
+
+    onReduceDataSpy.reset();
+    rootGetClientRectMock.reset();
+    measuredGetClientRectMock.reset();
+
+    // Simulate a resize where the contents don't fit after a resize, but they fit
+    // after calling onReduceData once.
+    rootGetClientRectMock.returns({ width: 50 });
+    measuredGetClientRectMock.onFirstCall().returns({ width: 100 });
+    measuredGetClientRectMock.onSecondCall().returns({ width: 40 });
+
+    let renderSpy = setRenderSpy(wrapper);
+    window.dispatchEvent(new Event('resize'));
+
+    expect(onReduceDataSpy.callCount).to.equal(1);
+
+    // Renders:
+    // 1. Measures the contents and determines it does not fit
+    // 2. Measures reduced contents and determines it does fit
+    // 3. Removes the measured div and updates the rendered view
+    expect(renderSpy.callCount).to.equal(3);
   });
 
-  it('will continue to shrink until everything fits', () => {
+  it('continues to shrink until everything fits', () => {
     let data = { scalingIndex: 7 };
 
     let { wrapper,
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index 832097067988e..335e69670109a 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -34,6 +34,8 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
 
   private _root: HTMLElement;
   private _measured: HTMLElement;
+  private _lastKnownRootWidth: number | undefined = undefined;
+  private _lastKnownMeasuredWidth: number | undefined = undefined;
 
   constructor(props: IResizeGroupProps) {
     super(props);
@@ -59,6 +61,11 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
     this._events.on(window, 'resize', this._async.debounce(this._onResize, RESIZE_DELAY, { leading: true }));
   }
 
+  public componentWillUnmount() {
+    this._lastKnownRootWidth = undefined;
+    this._lastKnownMeasuredWidth = undefined;
+  }
+
   public render() {
     const { onRenderData, data } = this.props;
     const { shouldMeasure, renderedData, measuredData } = this.state;
@@ -85,6 +92,18 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
   }
 
   private _onResize() {
+    // If we have some cached measurements, let's see if we can skip rendering
+    if (this._root && this._lastKnownRootWidth && this._lastKnownMeasuredWidth) {
+      let containerWidth = this._root.getBoundingClientRect().width;
+
+      // If the container didn't grow and the component still fits, don't trigger a remeasure.
+      // If the container grew, we want to trigger a remeasure since we might be able to fit more content.
+      if (containerWidth <= this._lastKnownRootWidth && this._lastKnownMeasuredWidth <= containerWidth) {
+        this._lastKnownRootWidth = containerWidth;
+        return;
+      }
+    }
+
     this.setState({ shouldMeasure: true });
   }
 
@@ -93,9 +112,9 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
     const { shouldMeasure } = this.state;
 
     if (shouldMeasure && Object.keys(data).length !== 0 && this._root && this._measured) {
-      const container = this._root.getBoundingClientRect();
-      const measured = this._measured.getBoundingClientRect();
-      if ((measured.width > container.width)) {
+      const containerWidth = this._lastKnownRootWidth = this._root.getBoundingClientRect().width;
+      const measuredWidth = this._lastKnownMeasuredWidth = this._measured.getBoundingClientRect().width;
+      if ((measuredWidth > containerWidth)) {
         let nextMeasuredData = onReduceData(this.state.measuredData);
 
         // We don't want to get stuck in an infinite render loop when there are no more

From 63b34daf51bc7185585c29c81bc34abd1ae64edb Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Sat, 27 May 2017 08:53:44 -0700
Subject: [PATCH 0018/1641] List: improved measure logic and fix nested list
 scroll problem" (#1866)

* improved list rendering speed and fixed nested list jumping problem

* adding change file

* Update listimprovements_2017-05-25-23-31.json
---
 .../listimprovements_2017-05-25-23-31.json    | 10 +++++
 .../src/components/List/List.tsx              | 41 ++++++++++++++++---
 2 files changed, 45 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/listimprovements_2017-05-25-23-31.json

diff --git a/common/changes/listimprovements_2017-05-25-23-31.json b/common/changes/listimprovements_2017-05-25-23-31.json
new file mode 100644
index 0000000000000..422a94faa0a90
--- /dev/null
+++ b/common/changes/listimprovements_2017-05-25-23-31.json
@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "List: improved measure logic and fix nested list scroll problem",
+      "type": "patch"
+    }
+  ],
+  "email": "joschect@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index 44f6d673c8d59..47d3c03775d0c 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -104,6 +104,8 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   private _requiredWindowsBehind: number;
 
   private _measureVersion: number;
+  private _scrollHeight: number;
+  private _scrollTop: number;
 
   constructor(props: IListProps) {
     super(props);
@@ -148,6 +150,16 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     this._scrollingToIndex = -1;
   }
 
+  /**
+   * Scroll to the given index. By default will bring the page the specified item is on into the view. If a callback
+   * to measure the height of an individual item is specified, will only scroll to bring the specific item into view.
+   *
+   * Note: with items of variable height and no passed in `getPageHeight` method, the list might jump after scrolling
+   * when windows before/ahead are being rendered, and the estimated height is replaced using actual elements.
+   *
+   * @param index Index of item to scroll to
+   * @param measureItem Optional callback to measure the height of an individual item
+   */
   public scrollToIndex(index: number, measureItem?: (itemIndex: number) => number): void {
     const { startIndex } = this.props;
     const renderCount = this._getRenderCount();
@@ -472,10 +484,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       let page = newPages[i];
 
       if (page.items) {
-        // Only evaluate page height if the page contains less items than total.
-        if (page.items.length < renderCount) {
-          heightChanged = this._measurePage(page) || heightChanged;
-        }
+        heightChanged = this._measurePage(page) || heightChanged;
 
         if (!renderedIndexes[page.startIndex]) {
           this._onPageAdded(page);
@@ -506,7 +515,10 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     // console.log('   * measure attempt', page.startIndex, cachedHeight);
 
     if (pageElement && (!cachedHeight || cachedHeight.measureVersion !== this._measureVersion)) {
-      let newClientRect = _measurePageRect(pageElement);
+      let newClientRect = {
+        width: pageElement.clientWidth,
+        height: pageElement.clientHeight
+      };
 
       if (newClientRect.height || newClientRect.width) {
         hasChangedHeight = page.height !== newClientRect.height;
@@ -690,16 +702,33 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     const { pages } = this.state;
     const renderCount = this._getRenderCount(props);
     let surfaceRect = this._surfaceRect;
+    let scrollHeight = this._scrollElement && this._scrollElement.scrollHeight;
+    let scrollTop = this._scrollElement ? this._scrollElement.scrollTop : 0;
 
     // WARNING: EXPENSIVE CALL! We need to know the surface top relative to the window.
+    // This needs to be called to recalculate when new pages should be loaded.
+    // We check to see how far we've scrolled and if it's further than a third of a page we run it again.
     if (
       forceUpdate ||
       !pages ||
       !this._surfaceRect ||
-      (pages.length > 0 && pages[0].items && pages[0].items.length < renderCount)) {
+      !scrollHeight ||
+      scrollHeight !== this._scrollHeight ||
+      Math.abs(this._scrollTop - scrollTop) > this._estimatedPageHeight / 3) {
       surfaceRect = this._surfaceRect = _measureSurfaceRect(this.refs.surface);
+      this._scrollTop = scrollTop;
     }
 
+    // If the scroll height has changed, something in the container likely resized and
+    // we should redo the page heights incase their content resized.
+    if (forceUpdate ||
+      !scrollHeight ||
+      scrollHeight !== this._scrollHeight) {
+      this._measureVersion++;
+    }
+
+    this._scrollHeight = scrollHeight;
+
     // If the surface is above the container top or below the container bottom, or if this is not the first
     // render return empty rect.
     // The first time the list gets rendered we need to calculate the rectangle. The width of the list is

From 8424c7680a618013d5cb4d320e7f6ed798cb317b Mon Sep 17 00:00:00 2001
From: Aaron Zhou <aaronyzhou88@gmail.com>
Date: Sat, 27 May 2017 09:03:48 -0700
Subject: [PATCH 0019/1641] GroupedList: Fix bug where selection would not work
 when keyboarding off a header (#1818)

* Start fixes for details list with groups arrow selection

* Clean up code

* More cleanup

* Revert behavior to pass test

* Add changes json

* don't remove selection when moving to non selectable element
---
 ...upedDetailsListSelectionFixes_2017-05-18-14-34.json | 10 ++++++++++
 .../src/utilities/selection/SelectionZone.tsx          |  6 +++---
 2 files changed, 13 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/groupedDetailsListSelectionFixes_2017-05-18-14-34.json

diff --git a/common/changes/groupedDetailsListSelectionFixes_2017-05-18-14-34.json b/common/changes/groupedDetailsListSelectionFixes_2017-05-18-14-34.json
new file mode 100644
index 0000000000000..1b8a656c1aef5
--- /dev/null
+++ b/common/changes/groupedDetailsListSelectionFixes_2017-05-18-14-34.json
@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SelectionZone: Update behavior to fix using up/down arrows to navigate between groups in a GroupedList.",
+      "type": "patch"
+    }
+  ],
+  "email": "aazhou@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
index ded477edfedde..88060758bbe63 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
@@ -337,10 +337,10 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
 
         target = getParent(target);
       }
-
-      // A key was pressed while an item in this zone was focused.
-      this._shouldHandleFocus = true;
     }
+
+    // A key was pressed while an item in this zone was focused.
+    this._shouldHandleFocus = true;
   }
 
   private _onToggleAllClick(ev: React.MouseEvent<HTMLElement>) {

From cfffab19f72102f075b55422bbf3448f840deb9e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pablo=20N=C3=BA=C3=B1ez?= <pablonete@gmail.com>
Date: Sat, 27 May 2017 18:05:20 +0200
Subject: [PATCH 0020/1641] DetailsList: initialFocusedIndex was not considered
 on already mounted rows (#1833)

* Considering initialFocusedIndex on mounted rows.
Otherwise, when items changed, row was already loaded so new index to focus was ignored.

* Added change description

* Fix double quote.
---
 ...edIndexOnMountedRows_2017-05-23-06-30.json | 30 ++++++++++++
 .../components/DetailsList/DetailsList.tsx    | 21 ++++++--
 .../DetailsList/DetailsListPage.tsx           |  6 +++
 .../DetailsList.NavigatingFocus.Example.tsx   | 48 +++++++++++++++++++
 4 files changed, 100 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/detailsList-initialFocusedIndexOnMountedRows_2017-05-23-06-30.json
 create mode 100644 packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx

diff --git a/common/changes/detailsList-initialFocusedIndexOnMountedRows_2017-05-23-06-30.json b/common/changes/detailsList-initialFocusedIndexOnMountedRows_2017-05-23-06-30.json
new file mode 100644
index 0000000000000..aa68bc39d3d8c
--- /dev/null
+++ b/common/changes/detailsList-initialFocusedIndexOnMountedRows_2017-05-23-06-30.json
@@ -0,0 +1,30 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: initialFocusedIndex is considered on already mounted rows ",
+      "type": "patch"
+    },
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    },
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    },
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    },
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "email": "v-panu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 11025d2a1ea56..e7ca609f418a1 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -124,6 +124,13 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   }
 
   public componentDidUpdate(prevProps: any, prevState: any) {
+    if (this._initialFocusedIndex !== undefined) {
+      const row = this._activeRows[this._initialFocusedIndex];
+      if (row) {
+        this._setFocusToRowIfPending(row);
+      }
+    }
+
     if (this.props.onDidUpdate) {
       this.props.onDidUpdate(this);
     }
@@ -421,7 +428,15 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
 
     this._activeRows[index] = row; // this is used for column auto resize
 
-    // Set focus to the row if it should receive focus.
+    this._setFocusToRowIfPending(row);
+
+    if (onRowDidMount) {
+      onRowDidMount(row.props.item, index);
+    }
+  }
+
+  private _setFocusToRowIfPending(row: DetailsRow) {
+    let index = row.props.itemIndex;
     if (this._initialFocusedIndex !== undefined && index === this._initialFocusedIndex) {
       if (this.refs.selectionZone) {
         this.refs.selectionZone.ignoreNextFocus();
@@ -430,10 +445,6 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
 
       delete this._initialFocusedIndex;
     }
-
-    if (onRowDidMount) {
-      onRowDidMount(row.props.item, index);
-    }
   }
 
   private _onRowWillUnmount(row: DetailsRow) {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
index df1b947eeb639..6b555ce321c1d 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
@@ -27,6 +27,9 @@ const DetailsListGroupedExampleCode = require('!raw-loader!office-ui-fabric-reac
 import { DetailsListDragDropExample } from './examples/DetailsList.DragDrop.Example';
 const DetailsListDragDropExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx') as string;
 
+import { DetailsListNavigatingFocusExample } from './examples/DetailsList.NavigatingFocus.Example';
+const DetailsListNavigatingFocusExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx') as string;
+
 export class DetailsListPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
     return (
@@ -56,6 +59,9 @@ export class DetailsListPage extends React.Component<IComponentDemoPageProps, {}
             <ExampleCard title='Drag and Drop DetailsList with 10 items' isOptIn={ true } code={ DetailsListDragDropExampleCode }>
               <DetailsListDragDropExample />
             </ExampleCard>
+            <ExampleCard title='Navigating to new content preserving keyboard focus with initialFocusedIndex' isOptIn={ true } code={ DetailsListNavigatingFocusExampleCode }>
+              <DetailsListNavigatingFocusExample />
+            </ExampleCard>
           </div>
         }
         propertiesTables={
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
new file mode 100644
index 0000000000000..c957939dbac75
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
@@ -0,0 +1,48 @@
+import * as React from 'react';
+import { DetailsList, IColumn } from 'office-ui-fabric-react/lib/DetailsList';
+import { Link } from 'office-ui-fabric-react/lib/Link';
+import './DetailsListExample.scss';
+
+export class DetailsListNavigatingFocusExample extends React.Component<any, any> {
+  public state = {
+    items: generateItems(''),
+    initialFocusedIndex: undefined,
+  };
+
+  private _columns = [
+    {
+      name: 'File path',
+      onRender: item =>
+        <Link
+          key={ item }
+          onClick={ () => this.navigate(item) }>
+          { item }
+        </Link>,
+    } as IColumn,
+    {
+      name: 'Size',
+      onRender: item => '4 KB',
+    } as IColumn
+  ];
+
+  public render() {
+    return (
+      <DetailsList
+        items={ this.state.items }
+        columns={ this._columns }
+        initialFocusedIndex={ this.state.initialFocusedIndex }
+      />
+    );
+  }
+
+  private navigate(name: string) {
+    this.setState({
+      items: generateItems(name + '/'),
+      initialFocusedIndex: 0,
+    });
+  }
+}
+
+function generateItems(parent: string) {
+  return Array.prototype.map.call('abcdefghi', name => parent + name);
+}

From da0f88a8690c867e2bbcf19c533ba57487acc4ed Mon Sep 17 00:00:00 2001
From: Mike Wheaton <miwhea@microsoft.com>
Date: Sat, 27 May 2017 09:40:33 -0700
Subject: [PATCH 0021/1641] Update to Fabric Core 7 (#1587)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* The file that imports all of the variables and mixins is now named References

* Remove the “u-“ utility prefix

* Remove ms-baseFont from components, as this is now inherited from the ms-Fabric wrapper

* Update names of responsive variables (swap min/max and size)

* Add “ms” prefix to all mixin calls

* Update animation variable names

* The input-placeholder mixin has been removed, but we can use ::placeholder and the build will add in vendor prefixes as necessary

* Remove anything that sets font-family, as this is now inherited from ms-Fabric. A mixin in Fabric Core ensures that button and input elements inherit the font family

* Update to use Fabric Core 6.0

* Update fabric-website to use Fabric Core 6.0

* Add change file

* Update path to localhost bundle

* Update todo-app to use Fabric Core 6.0.0

* Add a simple component demo to verify that only the necessary styles are being included

* Update icon list for Fabric Core 6.0.0

* Removing ‘fsevents’ in attempt to fix build issue

* Change the type to ‘major’

* Merge ‘master’ into ‘miwhea/fabric-core-6’

* Add change file

* Remove old Button.scss file that is no longer in use

* Remove outdated change file

* Add a base font size back to the example pages

* Fix focus border mixin

* Update gitignore to ignore Gulp cache and NPM debug files

* Remove ‘fsevents’ from npm-shrinkwrap.json so that it builds

* Remove old files left over from merge

* Update build to copy subfolders for CSS and SCSS to dist

* Update all “ms-u-“ classes to “ms-“ in the TSX files, which were missed in the previous updates.

* Update to Fabric Core 7

* Remove ms-font-m class from Fabric and App, as the default size is now set by the ms-Fabric class

* Update to latest icons in Core 7

* Update comment

* Add change file

* Remove extra change file

* Cleaned the NPM cache

* Removing ‘fsevents’ from npm-shrinkwrap

* Update package.json
---
 .gitignore                                    |   6 +
 apps/component-demo/gulpfile.js               |  41 ++++
 apps/component-demo/index.html                |  20 ++
 apps/component-demo/package.json              |  33 +++
 apps/component-demo/src/index.tsx             |  24 +++
 apps/component-demo/tsconfig.json             |  23 ++
 apps/component-demo/tsd.json                  |  15 ++
 apps/component-demo/webpack.config.js         |  59 +++++
 apps/fabric-website/package.json              |   2 +-
 .../src/components/App/App.scss               |  30 +--
 .../ColorTable/ColorTable.module.scss         |   2 +-
 .../components/DONavigation/DONavigation.tsx  |  22 +-
 .../DONavigation/DONavigationLink.scss        |   2 +-
 .../components/DOSearchBox/DOSearchBox.scss   |   2 +-
 .../src/components/Footer/Footer.scss         |  20 +-
 .../src/components/Header/Header.scss         |   4 +-
 .../components/IconGrid/IconGrid.module.scss  |   2 +-
 .../src/components/Nav/Nav.module.scss        |  10 +-
 .../PageHeader/PageHeader.module.scss         |  24 +--
 .../src/components/Table/Table.module.scss    |  10 +-
 apps/fabric-website/src/data/animations.json  |  54 ++---
 .../src/data/layout-visibility.json           |  30 +--
 apps/fabric-website/src/data/utilities.json   |  21 +-
 .../src/pages/BlogPage/BlogItem.scss          |   2 +-
 .../src/pages/BlogPage/BlogPage.module.scss   |   2 +-
 .../GetStartedPage.diagram.module.scss        |  18 +-
 .../GetStarted/GetStartedPage.module.scss     |  14 +-
 .../src/pages/GetStarted/GetStartedPage.tsx   |   6 +-
 .../src/pages/HomePage/HomePage.module.scss   |  20 +-
 .../src/pages/Interstitials/AngularJSPage.tsx |  10 +-
 .../src/pages/Interstitials/FabricIOSPage.tsx |   8 +-
 .../src/pages/Interstitials/FabricJSPage.tsx  |  10 +-
 .../src/pages/Overviews/Overviews.module.scss |   8 +-
 .../ResourcesPage/ResourcesPage.module.scss   |   6 +-
 .../src/pages/ResourcesPage/ResourcesPage.tsx |   8 +-
 .../Styles/AnimationsPage/AnimationsPage.scss |  28 +--
 .../Styles/AnimationsPage/AnimationsPage.tsx  |   2 +-
 .../BrandIconsPage/BrandIconsPage.module.scss |   4 +-
 .../Styles/BrandIconsPage/BrandIconsPage.tsx  |  16 +-
 .../Styles/ColorsPage/ColorsPage.module.scss  |   2 +-
 .../pages/Styles/ColorsPage/ColorsPage.tsx    |   6 +-
 .../pages/Styles/LayoutPage/LayoutPage.tsx    |  88 ++++----
 .../LocalizationPage.module.scss              |   2 +-
 apps/fabric-website/src/styles/_mixins.scss   |  14 +-
 .../fabric-website/src/styles/_overrides.scss |   4 +-
 .../src/styles/_typography.scss               |   1 -
 .../fabric-website/src/styles/_variables.scss |   2 +-
 apps/todo-app/index.html                      |   2 +-
 apps/todo-app/package.json                    |   2 +-
 apps/todo-app/src/components/Todo.module.scss |   6 +-
 apps/todo-app/src/components/TodoItem.tsx     |   6 +-
 apps/todo-app/src/types/IDataProvider.ts      |   1 +
 .../changes/beta-core-6_2017-04-24-19-30.json |  15 ++
 common/npm-shrinkwrap.json                    |  71 ++++---
 .../rush-example-app-base/package.json        |   4 +-
 .../rush-example-component/package.json       |   6 +-
 .../rush-fabric-website/package.json          |   8 +-
 .../rush-office-ui-fabric-react/package.json  |   6 +-
 .../temp_modules/rush-ssr-tests/package.json  |   2 +-
 common/temp_modules/rush-styling/package.json |   2 +-
 .../rush-test-bundle-button/package.json      |   2 +-
 .../temp_modules/rush-todo-app/package.json   |   4 +-
 packages/example-app-base/package.json        |   2 +-
 .../example-app-base/src/common/_common.scss  |   2 +-
 .../src/components/App/App.scss               |  10 +-
 .../src/components/App/App.tsx                |   2 +-
 .../ComponentPage/ComponentPage.scss          |  12 +-
 .../components/ExampleCard/ExampleCard.scss   |   8 +-
 .../src/components/Header/Header.scss         |   4 +-
 packages/office-ui-fabric-react/gulpfile.js   |   4 +-
 packages/office-ui-fabric-react/package.json  |   4 +-
 .../src/common/_common.scss                   |   2 +-
 .../src/components/Breadcrumb/Breadcrumb.scss |   5 +-
 .../src/components/Button/BaseButton.scss     |   2 +-
 .../src/components/Calendar/Calendar.scss     |  25 ++-
 .../src/components/Calendar/Calendar.tsx      |   2 +-
 .../src/components/Callout/Callout.scss       |   3 +-
 .../src/components/Callout/CalloutContent.tsx |   2 +-
 .../src/components/Check/Check.scss           |   2 +-
 .../src/components/Checkbox/Checkbox.scss     |   1 -
 .../components/ChoiceGroup/ChoiceGroup.scss   |  31 ++-
 .../src/components/CommandBar/CommandBar.scss |   7 +-
 .../src/components/DatePicker/DatePicker.scss |   4 +-
 .../components/DetailsList/DetailsHeader.scss |   2 +-
 .../src/components/DetailsList/DetailsRow.tsx |   2 +-
 .../src/components/Dialog/Dialog.scss         |  12 +-
 .../components/DocumentCard/DocumentCard.scss |  14 +-
 .../src/components/Dropdown/Dropdown.scss     |   8 +-
 .../src/components/Fabric/Fabric.tsx          |   2 +-
 .../src/components/Facepile/Facepile.scss     |   2 +-
 .../components/GroupedList/GroupFooter.scss   |   1 -
 .../components/GroupedList/GroupHeader.scss   |  10 +-
 .../components/GroupedList/GroupedList.scss   |   3 +-
 .../src/components/Icon/IconName.ts           | 201 +++++++++++++++++-
 .../src/components/Image/Image.scss           |   2 +-
 .../src/components/Image/Image.tsx            |   2 +-
 .../src/components/Label/Label.scss           |   2 +-
 .../Layer/examples/Layer.Basic.Example.tsx    |   2 +-
 .../Layer/examples/Layer.Hosted.Example.tsx   |   2 +-
 .../src/components/Link/Link.scss             |   1 -
 .../List/examples/List.Mail.Example.scss      |  10 +-
 .../List/examples/List.Scrolling.Example.scss |   4 +-
 .../src/components/MessageBar/MessageBar.scss |   3 +-
 .../src/components/Modal/Modal.scss           |  12 +-
 .../src/components/Nav/Nav.scss               |  14 +-
 .../src/components/Nav/Nav.tsx                |   4 +-
 .../src/components/Panel/Panel.scss           |  56 ++---
 .../src/components/Panel/Panel.tsx            |  12 +-
 .../src/components/Persona/Persona.scss       |  35 ++-
 .../src/components/Pivot/Pivot.scss           |  11 +-
 .../ProgressIndicator/ProgressIndicator.scss  |   1 -
 .../src/components/Rating/Rating.scss         |   2 +-
 .../src/components/SearchBox/SearchBox.scss   |  12 +-
 .../src/components/Slider/Slider.scss         |   4 +-
 .../src/components/Spinner/Spinner.scss       |   2 +-
 .../TeachingBubble/TeachingBubble.scss        |   4 +-
 .../src/components/TextField/TextField.scss   |  32 +--
 .../src/components/TextField/TextField.tsx    |   2 +-
 .../src/components/Theme/ThemePage.scss       |   2 +-
 .../src/components/Toggle/Toggle.scss         |  10 +-
 .../src/components/Tooltip/Tooltip.scss       |   2 +-
 .../src/components/Tooltip/Tooltip.tsx        |   2 +-
 .../pickers/Suggestions/Suggestions.scss      |   8 +-
 .../src/demo/GettingStartedPage.scss          |   2 +-
 rush.json                                     |   2 +-
 125 files changed, 961 insertions(+), 563 deletions(-)
 create mode 100644 apps/component-demo/gulpfile.js
 create mode 100644 apps/component-demo/index.html
 create mode 100644 apps/component-demo/package.json
 create mode 100644 apps/component-demo/src/index.tsx
 create mode 100644 apps/component-demo/tsconfig.json
 create mode 100644 apps/component-demo/tsd.json
 create mode 100644 apps/component-demo/webpack.config.js
 create mode 100644 common/changes/beta-core-6_2017-04-24-19-30.json

diff --git a/.gitignore b/.gitignore
index e4b4a333dfaa8..288c84d1f2972 100644
--- a/.gitignore
+++ b/.gitignore
@@ -112,3 +112,9 @@ common/npmx-recycler
 common/rush-link.json
 common/last-install.*
 common/rush-recycler
+
+# Gulp cache
+gulp-cache
+
+# NPM debug logs
+npm-debug.log.*
diff --git a/apps/component-demo/gulpfile.js b/apps/component-demo/gulpfile.js
new file mode 100644
index 0000000000000..c2007dcf9e087
--- /dev/null
+++ b/apps/component-demo/gulpfile.js
@@ -0,0 +1,41 @@
+'use strict';
+
+let build = require('@microsoft/web-library-build');
+let serial = build.serial;
+
+build.tslint.isEnabled = () => false;
+build.karma.isEnabled = () => false;
+
+/* Configure TypeScript 2.0. */
+build.typescript.setConfig({ typescript: require('typescript') });
+
+// Set up a "rushBuild" subTask that will spawn rush build
+let fs = require('fs');
+let spawn = require('child_process').spawn;
+let rawStdout = new fs.SyncWriteStream(1, { autoClose: false });
+
+let rushBuild = build.subTask('rushbuild', (gulp, options, done) => {
+  let child = spawn(
+    'rush',
+    ['build', '--to', 'component-demo']
+  );
+
+  child.stdout.on('data', data => rawStdout.write(data));
+  child.on('close', done);
+});
+
+const sourceMatch = [
+  'src/**/*.{ts,tsx,scss,js,txt,html}',
+  '!src/**/*.scss.ts'
+];
+
+build.task('serve', serial(
+  build.serve,
+  build.watch(sourceMatch, serial(
+    rushBuild,
+    build.reload
+  ))));
+
+build.initialize(require('gulp'));
+
+
diff --git a/apps/component-demo/index.html b/apps/component-demo/index.html
new file mode 100644
index 0000000000000..65d95ddc6ccb1
--- /dev/null
+++ b/apps/component-demo/index.html
@@ -0,0 +1,20 @@
+<!doctype html>
+<html dir="ltr">
+
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+
+  <title>Fabric React Component</title>
+
+  <link rel="stylesheet" type="text/css" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/6.0.0/css/fabric.min.css">
+  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.2.0/react.min.js"></script>
+  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.2.0/react-dom.min.js"></script>
+</head>
+
+<body>
+  <script type="text/javascript" src="dist/component-demo.js"></script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/apps/component-demo/package.json b/apps/component-demo/package.json
new file mode 100644
index 0000000000000..3e40879e6a34d
--- /dev/null
+++ b/apps/component-demo/package.json
@@ -0,0 +1,33 @@
+{
+  "name": "component-demo",
+  "description": "Simple demo of a Fabric React component.",
+  "version": "1.0.1",
+  "scripts": {
+    "build": "gulp",
+    "clean": "gulp clean",
+    "start": "gulp serve",
+    "test": "gulp test"
+  },
+  "devDependencies": {
+    "@microsoft/web-library-build": "3.0.0"
+  },
+  "dependencies": {
+    "@microsoft/load-themed-styles": ">=1.2.2 <2.0.0",
+    "@types/chai": "^3.4.35",
+    "@types/es6-promise": "^0.0.32",
+    "@types/immutability-helper": "^2.0.15",
+    "@types/mocha": "^2.2.32",
+    "@types/node": "^6.0.45",
+    "@types/react": "^15.0.16",
+    "@types/react-addons-test-utils": "^0.14.17",
+    "@types/react-dom": "^0.14.23",
+    "@types/webpack-env": "^1.13.0",
+    "es6-promise": ">=3.2.1 <4.0.0",
+    "immutability-helper": "^2.0.0",
+    "office-ui-fabric-core": "7.0.0",
+    "office-ui-fabric-react": ">=1.5.5 <2.0.0",
+    "react": ">=15.3.2 <16.0.0",
+    "react-dom": ">=15.3.2 <16.0.0",
+    "typescript": "^2.0.6"
+  }
+}
\ No newline at end of file
diff --git a/apps/component-demo/src/index.tsx b/apps/component-demo/src/index.tsx
new file mode 100644
index 0000000000000..c09ed6f9d014f
--- /dev/null
+++ b/apps/component-demo/src/index.tsx
@@ -0,0 +1,24 @@
+import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+
+import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
+import { TextField } from 'office-ui-fabric-react/lib/components/TextField';
+
+let _rootDiv: HTMLElement;
+
+function start(): void {
+  if (!_rootDiv) {
+    _rootDiv = document.createElement('div');
+    document.body.appendChild(_rootDiv);
+  }
+
+  ReactDOM.render(
+    <Fabric>
+      <h1>Component Demo</h1>
+      <TextField label='Default TextField' />
+    </Fabric>,
+    _rootDiv);
+}
+
+// Start the application.
+start();
diff --git a/apps/component-demo/tsconfig.json b/apps/component-demo/tsconfig.json
new file mode 100644
index 0000000000000..f287ad2753ab5
--- /dev/null
+++ b/apps/component-demo/tsconfig.json
@@ -0,0 +1,23 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "module": "commonjs",
+    "jsx": "react",
+    "declaration": true,
+    "sourceMap": true,
+    "experimentalDecorators": true,
+    "noEmitOnError": true,
+    "moduleResolution": "node",
+    "types": [
+      "chai",
+      "mocha",
+      "webpack-env"
+    ]
+  },
+  "exclude": [
+    "node_modules",
+    "dist",
+    "lib",
+    "lib-amd"
+  ]
+}
\ No newline at end of file
diff --git a/apps/component-demo/tsd.json b/apps/component-demo/tsd.json
new file mode 100644
index 0000000000000..a912a39c8c9c9
--- /dev/null
+++ b/apps/component-demo/tsd.json
@@ -0,0 +1,15 @@
+{
+  "version": "v4",
+  "repo": "borisyankov/DefinitelyTyped",
+  "ref": "master",
+  "path": "typings",
+  "bundle": "typings/tsd.d.ts",
+  "installed": {
+    "react/react-dom.d.ts": {
+      "commit": "33585c55fbb7cd3cfc59d18a3b87f4ae6012eaff"
+    },
+    "react/react.d.ts": {
+      "commit": "33585c55fbb7cd3cfc59d18a3b87f4ae6012eaff"
+    }
+  }
+}
diff --git a/apps/component-demo/webpack.config.js b/apps/component-demo/webpack.config.js
new file mode 100644
index 0000000000000..3fb1f0a32ca1a
--- /dev/null
+++ b/apps/component-demo/webpack.config.js
@@ -0,0 +1,59 @@
+'use strict';
+
+/** Note: this require may need to be fixed to point to the build that exports the gulp-core-build-webpack instance. */
+let webpackTaskResources = require('@microsoft/web-library-build').webpack.resources;
+let webpack = webpackTaskResources.webpack;
+
+let path = require('path');
+let isProduction = process.argv.indexOf('--production') > -1;
+let packageJSON = require('./package.json');
+
+let webpackConfig = {
+  context: path.join(__dirname, 'lib/'),
+
+  entry: {
+    [packageJSON.name]: './index.js'
+  },
+
+  output: {
+    libraryTarget: 'umd',
+    path: path.join(__dirname, '/dist'),
+    filename: `[name]${isProduction ? '.min' : ''}.js`
+  },
+
+  devtool: 'source-map',
+
+  devServer: {
+    stats: 'none'
+  },
+
+  externals: [
+    {
+      'react': 'React'
+
+    },
+    {
+      'react-dom': 'ReactDOM'
+    }
+  ],
+
+  module: {
+    loaders: [
+    ]
+  },
+
+  plugins: [
+    //  new WebpackNotifierPlugin()
+  ]
+};
+
+if (isProduction) {
+  webpackConfig.plugins.push(new webpack.optimize.UglifyJsPlugin({
+    minimize: true,
+    compress: {
+      warnings: false
+    }
+  }));
+}
+
+module.exports = webpackConfig;
\ No newline at end of file
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index ae9537b5e350b..bd8706aef01ef 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -51,7 +51,7 @@
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
-    "office-ui-fabric-core": ">=5.1.0 <6.0.0",
+    "office-ui-fabric-core": ">=7.0.0 <8.0.0",
     "office-ui-fabric-react": ">=2.34.2 <3.0.0",
     "@uifabric/utilities": ">=1.10.2 <2.0.0"
   }
diff --git a/apps/fabric-website/src/components/App/App.scss b/apps/fabric-website/src/components/App/App.scss
index c50357077e9a6..90f73c7314f9e 100644
--- a/apps/fabric-website/src/components/App/App.scss
+++ b/apps/fabric-website/src/components/App/App.scss
@@ -33,7 +33,7 @@
       font-weight: $ms-font-weight-regular;
       height: $App-mobileNavBarHeight;
       line-height: $App-mobileNavBarHeight;
-      @include margin-right(12px);
+      @include ms-margin-right(12px);
       padding: 0;
 
       &:focus {
@@ -52,12 +52,12 @@
   .App-nav {
     -webkit-overflow-scrolling: touch; // Improves scrolling performance
     bottom: 0;
-    @include left(-$Nav-width);
+    @include ms-left(-$Nav-width);
     overflow-y: auto;
     position: fixed;
     top: $Header-height + $App-mobileNavBarHeight;
-    transition: $ms-duration2 $ms-ease1;
-    @include transition-property(left);
+    transition: $ms-animation-duration-2 $ms-animation-ease-1;
+    @include ms-transition-property(left);
     width: $Nav-width;
   }
 
@@ -69,7 +69,7 @@
     margin-top: $App-mobileNavBarHeight; // Move it down below the mobile nav bar
     overflow: hidden;
     position: relative;
-    transition: all $ms-duration2 $ms-ease1;
+    transition: all $ms-animation-duration-2 $ms-animation-ease-1;
 
     @include high-contrast {
       border-right: 1px solid $ms-color-white;
@@ -91,7 +91,7 @@
   }
 
   // When the nav is open (smaller screens only) push the content over and prevent app from scrolling
-  @media screen and (max-width: $ms-screen-lg-max) {
+  @media screen and (max-width: $ms-screen-max-lg) {
     .App.is-navOpen {
       bottom: 0;
       left: 0;
@@ -101,7 +101,7 @@
       top: 0;
 
       .App-mobileNavBar {
-        @include padding-left(36px); // Align to menu items
+        @include ms-padding-left(36px); // Align to menu items
       }
 
       .App-mobileNavOverlay {
@@ -109,25 +109,25 @@
         bottom: 0;
         display: block;
         position: absolute;
-        @include left($Nav-width);
-        @include right(0);
+        @include ms-left($Nav-width);
+        @include ms-right(0);
         top: 0;
         z-index: 1;
       }
 
       .App-nav {
-        @include left(0);
+        @include ms-left(0);
       }
 
       .App-content {
-        @include left($Nav-width);
+        @include ms-left($Nav-width);
         opacity: 0.5; // Dim the content
       }
     }
   }
 
   // Show the nav at all times, to the left of the content
-  @media screen and (min-width: $ms-screen-xl-min) {
+  @media screen and (min-width: $ms-screen-min-xl) {
     .App-wrapper {
       flex-direction: row;
     }
@@ -137,7 +137,7 @@
     }
 
     .App-nav {
-      @include left(auto);
+      @include ms-left(auto);
       top: auto; // Mobile nav bar is no longer there
       position: relative;
       overflow-y: visible
@@ -152,11 +152,11 @@
     // Reset values for the nav and content if opened on larger screens
     .App.is-navOpen {
       .App-nav {
-        @include left(auto);
+        @include ms-left(auto);
       }
 
       .App-content {
-        @include left(auto);
+        @include ms-left(auto);
       }
     }
   }
diff --git a/apps/fabric-website/src/components/ColorTable/ColorTable.module.scss b/apps/fabric-website/src/components/ColorTable/ColorTable.module.scss
index b382bdf136f99..a158967924844 100644
--- a/apps/fabric-website/src/components/ColorTable/ColorTable.module.scss
+++ b/apps/fabric-website/src/components/ColorTable/ColorTable.module.scss
@@ -13,5 +13,5 @@
 }
 
 .screenReaderOnly {
-  @include ms-u-screenReaderOnly;
+  @include ms-screenReaderOnly;
 }
\ No newline at end of file
diff --git a/apps/fabric-website/src/components/DONavigation/DONavigation.tsx b/apps/fabric-website/src/components/DONavigation/DONavigation.tsx
index 22586eb24a010..e56da4d563c1d 100644
--- a/apps/fabric-website/src/components/DONavigation/DONavigation.tsx
+++ b/apps/fabric-website/src/components/DONavigation/DONavigation.tsx
@@ -17,8 +17,8 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
   private LINKS_CLASS = '.od-Navigation-link';
   private LINKS_CONTAINER_CLASS = '.od-Header-navigationContainer';
   private LINKS_BANNER_CLASS = '.od-Header-banner';
-  private LINKS_CONTAINER_ANIM_IN_CLASS = 'ms-u-slideDownIn10';
-  private LINKS_CONTAINER_ANIM_OUT_CLASS = 'ms-u-slideUpOut10';
+  private LINKS_CONTAINER_ANIM_IN_CLASS = 'ms-slideDownIn10';
+  private LINKS_CONTAINER_ANIM_OUT_CLASS = 'ms-slideUpOut10';
   private CONTAINER_CLASS = '.od-Navigation-linkContainer';
   private SUBMENU_CLASS = '.od-Navigation-subMenu';
   private HAMBURGER_MENU_CLASS = '.od-Header-hamburgerButton';
@@ -94,13 +94,13 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
               <div className='od-Navigation-subMenuItems'>
                 <div className='ms-Grid'>
                   <div className='ms-Grid-row'>
-                    <div className='ms-Grid-col ms-u-xl3 ms-u-sm12 od-Navigation-menuFirstColumn'>
+                    <div className='ms-Grid-col ms-u-xl3 ms-sm12 od-Navigation-menuFirstColumn'>
                       { this._getLinks(links.exploreLinks.firstMenuColumn) }
                     </div>
-                    <div className='ms-Grid-col ms-u-xl3 ms-u-sm12  od-Navigation-menuSecondColumn'>
+                    <div className='ms-Grid-col ms-xl3 ms-sm12  od-Navigation-menuSecondColumn'>
                       { this._getLinks(links.exploreLinks.secondMenuColumn) }
                     </div>
-                    <div className='ms-Grid-col ms-u-xl3 ms-u-sm12  od-Navigation-menuThirdColumn'>
+                    <div className='ms-Grid-col ms-xl3 ms-sm12  od-Navigation-menuThirdColumn'>
                       { this._getLinks(links.exploreLinks.thirdMenuColumn) }
                       <div className='od-Navigation-subMenuOverflowColor'></div>
                     </div>
@@ -224,21 +224,21 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
 
   // Removes Office Dev Navigation
   private _removeNavigation() {
-    this.navcontainerel.classList.remove('ms-u-slideDownIn20');
-    this.navcontainerel.classList.add('ms-u-slideUpOut20');
+    this.navcontainerel.classList.remove('ms-slideDownIn20');
+    this.navcontainerel.classList.add('ms-slideUpOut20');
     this.navcontainerel.classList.remove('docs-showNavigation');
   }
 
   private _addNavigationBack() {
-    this.navcontainerel.classList.remove('ms-u-slideUpOut20');
+    this.navcontainerel.classList.remove('ms-slideUpOut20');
     this.navcontainerel.classList.remove('docs-hideNavigation');
   }
 
   private _addNavigation() {
-    if (!this.navcontainerel.classList.contains('ms-u-slideDownIn20')) {
+    if (!this.navcontainerel.classList.contains('ms-slideDownIn20')) {
       this.navcontainerel.classList.add('docs-showNavigation');
-      this.navcontainerel.classList.remove('ms-u-slideUpOut20');
-      this.navcontainerel.classList.add('ms-u-slideDownIn20');
+      this.navcontainerel.classList.remove('ms-slideUpOut20');
+      this.navcontainerel.classList.add('ms-slideDownIn20');
     }
   }
 
diff --git a/apps/fabric-website/src/components/DONavigation/DONavigationLink.scss b/apps/fabric-website/src/components/DONavigation/DONavigationLink.scss
index 91e57332cbdbd..a076b881aa13d 100644
--- a/apps/fabric-website/src/components/DONavigation/DONavigationLink.scss
+++ b/apps/fabric-website/src/components/DONavigation/DONavigationLink.scss
@@ -41,7 +41,7 @@
 
     .ms-Icon {
       color: $ms-color-white;
-      @include margin-left(6px);
+      @include ms-margin-left(6px);
       transition: transform 0.4s;
       margin-top: 1px;
       line-height: 40px;
diff --git a/apps/fabric-website/src/components/DOSearchBox/DOSearchBox.scss b/apps/fabric-website/src/components/DOSearchBox/DOSearchBox.scss
index c2a57d3c8ca4c..d8fd1488884e5 100644
--- a/apps/fabric-website/src/components/DOSearchBox/DOSearchBox.scss
+++ b/apps/fabric-website/src/components/DOSearchBox/DOSearchBox.scss
@@ -42,7 +42,7 @@
     border: 0;
     color: transparent;
     position: absolute;
-    @include right(0);
+    @include ms-right(0);
     top: 0;
     height: $od-Header-searchHeight - 4px;
     width: $od-Header-searchHeight;
diff --git a/apps/fabric-website/src/components/Footer/Footer.scss b/apps/fabric-website/src/components/Footer/Footer.scss
index 71157c867d2d8..d4d080aaec1d7 100644
--- a/apps/fabric-website/src/components/Footer/Footer.scss
+++ b/apps/fabric-website/src/components/Footer/Footer.scss
@@ -5,7 +5,6 @@
   .od-OfficeFooter {
     background: $ms-color-black;
     color: $ms-color-white;
-    font-family: $ms-font-system-base;
     font-weight: $ms-font-weight-regular;
     font-size: $ms-font-size-m;
     padding: 32px 20px;
@@ -13,8 +12,8 @@
 
     ul, li {
       list-style: none;
-      @include margin-left(0);
-      @include padding-left(0);
+      @include ms-margin-left(0);
+      @include ms-padding-left(0);
     }
   }
 
@@ -36,7 +35,6 @@
   }
 
   .od-OfficeFooter-heading {
-    font-family: $ms-font-system-base;
     font-weight: $ms-font-weight-semibold;
     font-size: $ms-font-size-l;
     white-space: nowrap;
@@ -68,15 +66,15 @@
 
   .od-OfficeFooter-microsoft {
     margin-bottom: 8px;
-    @include margin-left(8px);
-    @include text-align(right);
+    @include ms-margin-left(8px);
+    @include ms-text-align(right);
 
     img {
       margin-bottom: 12px;
     }
   }
 
-  @media (min-width: $ms-screen-md-min) {
+  @media (min-width: $ms-screen-min-md) {
 
     .od-OfficeFooter-primary {
       flex-direction: row;
@@ -85,7 +83,7 @@
 
     .od-OfficeFooter-linkList {
       margin-bottom: 0;
-      @include padding-right(40px);
+      @include ms-padding-right(40px);
     }
 
     .od-OfficeFooter-list--secondary {
@@ -96,18 +94,18 @@
       flex-direction: row;
 
       li {
-        @include margin-left(20px);
+        @include ms-margin-left(20px);
       }
     }
   }
 
-  @media (min-width: $ms-screen-lg-min) {
+  @media (min-width: $ms-screen-min-lg) {
     .od-OfficeFooter-primary {
       justify-content: flex-start;
     }
 
     .od-OfficeFooter-linkList {
-      @include margin-right(120px);
+      @include ms-margin-right(120px);
     }
   }
 }
diff --git a/apps/fabric-website/src/components/Header/Header.scss b/apps/fabric-website/src/components/Header/Header.scss
index 08b049634bf0b..db1ca99552df4 100644
--- a/apps/fabric-website/src/components/Header/Header.scss
+++ b/apps/fabric-website/src/components/Header/Header.scss
@@ -40,7 +40,7 @@
 
   @media (min-width: $od-Header-bannerWidth) {
     .od-Header-logo {
-      @include padding-left(8px);
+      @include ms-padding-left(8px);
     }
   }
 
@@ -52,7 +52,7 @@
     height: $od-Header-searchHeight;
     display: none;
 
-    @media screen and (min-width: $ms-screen-xxl-min) {
+    @media screen and (min-width: $ms-screen-min-xxl) {
       display: block;
     }
   }
diff --git a/apps/fabric-website/src/components/IconGrid/IconGrid.module.scss b/apps/fabric-website/src/components/IconGrid/IconGrid.module.scss
index 274eba3c1d299..c03dd2b53a08d 100644
--- a/apps/fabric-website/src/components/IconGrid/IconGrid.module.scss
+++ b/apps/fabric-website/src/components/IconGrid/IconGrid.module.scss
@@ -20,7 +20,7 @@
       color: $ms-color-neutralPrimary;
       font-size: $ms-font-size-xs;
       opacity: 0;
-      transition: opacity $ms-duration2 $ms-ease1;
+      transition: opacity $ms-animation-duration-2 $ms-animation-ease-1;
     }
 
     &:hover {
diff --git a/apps/fabric-website/src/components/Nav/Nav.module.scss b/apps/fabric-website/src/components/Nav/Nav.module.scss
index 9ea99a6b090d7..69123ef5f80d9 100644
--- a/apps/fabric-website/src/components/Nav/Nav.module.scss
+++ b/apps/fabric-website/src/components/Nav/Nav.module.scss
@@ -4,9 +4,9 @@ $nav-group-header-height: 40px;
 
 .nav {
   padding-top: 20px;
-  @include padding-right(12px);
+  @include ms-padding-right(12px);
   padding-bottom: 60px;
-  @include padding-left(36px);
+  @include ms-padding-left(36px);
 }
 
 .link {
@@ -37,7 +37,7 @@ $nav-group-header-height: 40px;
       background: $ms-color-neutralTertiary;
       position: absolute;
       top: 3px;
-      @include left(-16px);
+      @include ms-left(-16px);
     }
 
     &.fabricPage::before {
@@ -47,7 +47,7 @@ $nav-group-header-height: 40px;
     &.getStartedPage::before {
       background-color: $color-getStarted-medium;
     }
-    
+
     &.stylesPage::before {
       background-color: $color-styles-medium;
     }
@@ -95,7 +95,7 @@ $nav-group-header-height: 40px;
 
 // Second-level links
 .isSubMenu {
-  @include margin-left(8px);
+  @include ms-margin-left(8px);
 
   .link {
     a {
diff --git a/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss b/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss
index 14a5d3ff43afc..34f23034572d4 100644
--- a/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss
+++ b/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss
@@ -15,7 +15,7 @@
   @include high-contrast {
     border-bottom: 1px solid $ms-color-white;
   }
-  
+
   @include high-contrast-black-on-white  {
     border-bottom: 1px solid $ms-color-black;
   }
@@ -29,20 +29,20 @@
   font-weight: $ms-font-weight-light;
   line-height: 1;
   padding: 40px 0;
-  transition: font-size $ms-duration1 $ms-ease1;
+  transition: font-size $ms-animation-duration-1 $ms-animation-ease-1;
 }
 
 .pageNav {
   display: none;
 }
 
-@media screen and (max-width: $ms-screen-md-max) {
+@media screen and (max-width: $ms-screen-max-md) {
   .pageHeader {
     margin-bottom: -2px;
   }
 }
 
-@media screen and (min-width: $ms-screen-lg-min) {
+@media screen and (min-width: $ms-screen-min-lg) {
   .pageHeader {
     height: $PageHeader-fullHeight;
 
@@ -57,14 +57,14 @@
         height: $PageHeader-attachedTitleHeight + $PageHeader-navHeight;
 
         @include high-contrast {
-          @include border-right(1px, solid, $ms-color-white);
+          @include ms-border-right(1px, solid, $ms-color-white);
         }
-        
+
         @include high-contrast-black-on-white  {
-          @include border-right(1px, solid, $ms-color-black);
+          @include ms-border-right(1px, solid, $ms-color-black);
         }
       }
-      
+
       .pageTitle {
         font-size: $font-size-big;
         font-weight: $ms-font-weight-regular;
@@ -75,7 +75,7 @@
 
   .content {
     height: $PageHeader-titleHeight + $PageHeader-navHeight;
-    transition: box-shadow $ms-duration2 $ms-ease1;
+    transition: box-shadow $ms-animation-duration-2 $ms-animation-ease-1;
     position: relative;
   }
 
@@ -83,7 +83,7 @@
     font-size: $font-size-huge;
     padding-top: 94px;
   }
-  
+
   .pageNav {
     display: block;
     height: $PageHeader-navHeight;
@@ -101,7 +101,7 @@
         font-weight: $ms-font-weight-semilight;
         height: $PageHeader-navHeight;
         line-height: $PageHeader-navHeight;
-        @include margin-right(28px);
+        @include ms-margin-right(28px);
         text-decoration: none;
         text-align: center;
 
@@ -125,7 +125,7 @@
   }
 }
 
-@media screen and (min-width: $ms-screen-xl-min) {
+@media screen and (min-width: $ms-screen-min-xl) {
   // The mobile nav is no longer present, so the attached page header is higher up
   .pageHeader.isAttached {
     .content {
diff --git a/apps/fabric-website/src/components/Table/Table.module.scss b/apps/fabric-website/src/components/Table/Table.module.scss
index d411cc299968c..84efa2eb71fca 100644
--- a/apps/fabric-website/src/components/Table/Table.module.scss
+++ b/apps/fabric-website/src/components/Table/Table.module.scss
@@ -15,7 +15,7 @@
     th {
       font-weight: $ms-font-weight-semibold;
       color: $ms-color-neutralSecondary;
-      @include text-align(left);
+      @include ms-text-align(left);
     }
   }
 
@@ -26,13 +26,13 @@
       line-height:  normal;
 
       &.animCell {
-        width: 260px; 
+        width: 260px;
       }
-      
+
       &:first-child {
         width: 1%;
         white-space: nowrap;
-        @include padding-right(20px);
+        @include ms-padding-right(20px);
       }
     }
   }
@@ -57,7 +57,7 @@
       td:first-child {
         color: $ms-color-neutralSecondary;
         padding: 8px auto 8px 8px;
-        @include padding-right(35px);
+        @include ms-padding-right(35px);
       }
     }
   }
diff --git a/apps/fabric-website/src/data/animations.json b/apps/fabric-website/src/data/animations.json
index 0494a84e1807f..8c73c3548cee3 100644
--- a/apps/fabric-website/src/data/animations.json
+++ b/apps/fabric-website/src/data/animations.json
@@ -12,7 +12,7 @@
         "value": "Slide right 10px and fade in"
       },
       {
-        "value": "ms-u-slideRightIn10"
+        "value": "slideRightIn10"
       },
       {
         "value": "cubic-bezier(0.1, 0.9, 0.2, 1)"
@@ -26,7 +26,7 @@
         "value": "Slide right 20px and fade in"
       },
       {
-        "value": "ms-u-slideRightIn20"
+        "value": "slideRightIn20"
       },
       {
         "value": "cubic-bezier(0.1, 0.9, 0.2, 1)"
@@ -40,7 +40,7 @@
         "value": "Slide right 40px and fade in"
       },
       {
-        "value": "ms-u-slideRightIn40"
+        "value": "slideRightIn40"
       },
       {
         "value": "cubic-bezier(0.1, 0.9, 0.2, 1)"
@@ -54,7 +54,7 @@
         "value": "Slide left 10px and fade in"
       },
       {
-        "value": "ms-u-slideLeftIn10"
+        "value": "slideLeftIn10"
       },
       {
         "value": "cubic-bezier(0.1, 0.9, 0.2, 1)"
@@ -68,7 +68,7 @@
         "value": "Slide left 20px and fade in"
       },
       {
-        "value": "ms-u-slideLeftIn20"
+        "value": "slideLeftIn20"
       },
       {
         "value": "cubic-bezier(0.1, 0.9, 0.2, 1)"
@@ -82,7 +82,7 @@
         "value": "Slide right 40px and fade in"
       },
       {
-        "value": "ms-u-slideLeftIn40"
+        "value": "slideLeftIn40"
       },
       {
         "value": "cubic-bezier(0.1, 0.9, 0.2, 1)"
@@ -96,7 +96,7 @@
         "value": "Slide up 20px and fade in"
       },
       {
-        "value": "ms-u-slideUpIn20"
+        "value": "slideUpIn20"
       },
       {
         "value": "cubic-bezier(0.1, 0.9, 0.2, 1)"
@@ -110,7 +110,7 @@
         "value": "Slide right 10 and fade in"
       },
       {
-        "value": "ms-u-slideUpIn10"
+        "value": "slideUpIn10"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -124,7 +124,7 @@
         "value": "Slide down 20px and fade in"
       },
       {
-        "value": "ms-u-slideDownIn20"
+        "value": "slideDownIn20"
       },
       {
         "value": "cubic-bezier(0.1, 0.9, 0.2, 1)"
@@ -138,7 +138,7 @@
         "value": "Slide down 10px and fade in"
       },
       {
-        "value": "ms-u-slideDownIn10"
+        "value": "slideDownIn10"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -152,7 +152,7 @@
         "value": "Slide right 40px and fade out"
       },
       {
-        "value": "ms-u-slideRightOut40"
+        "value": "slideRightOut40"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -166,7 +166,7 @@
         "value": "Slide left 40px and fade out"
       },
       {
-        "value": "ms-u-slideLeftOut40"
+        "value": "slideLeftOut40"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -180,7 +180,7 @@
         "value": "Slide up 20px and fade out"
       },
       {
-        "value": "ms-u-slideUpOut10"
+        "value": "slideUpOut10"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -194,7 +194,7 @@
         "value": "Slide up 10px and fade out"
       },
       {
-        "value": "ms-u-slideUpOut10"
+        "value": "slideUpOut10"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -208,7 +208,7 @@
         "value": "Slide down 20px and fade out"
       },
       {
-        "value": "ms-u-slideDownOut20"
+        "value": "slideDownOut20"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -222,7 +222,7 @@
         "value": "Slide down 10px and fade out"
       },
       {
-        "value": "ms-u-slideDownOut10"
+        "value": "slideDownOut10"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -236,7 +236,7 @@
         "value": "Scale up to 100% and fade in"
       },
       {
-        "value": "ms-u-scaleUpIn100"
+        "value": "scaleUpIn100"
       },
       {
         "value": "cubic-bezier(0.1, 0.9, 0.2, 1)"
@@ -250,7 +250,7 @@
         "value": "Slide down to 100% and fade in"
       },
       {
-        "value": "ms-u-scaleDownIn100"
+        "value": "scaleDownIn100"
       },
       {
         "value": "cubic-bezier(0.1, 0.9, 0.2, 1)"
@@ -264,7 +264,7 @@
         "value": "Scale up to 103% and fade out"
       },
       {
-        "value": "ms-u-scaleUpOut103"
+        "value": "scaleUpOut103"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -278,7 +278,7 @@
         "value": "Slide right 98% and fade out"
       },
       {
-        "value": "ms-u-scaleDownOut98"
+        "value": "scaleDownOut98"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -292,7 +292,7 @@
         "value": "Fade in"
       },
       {
-        "value": "ms-u-fadeIn100"
+        "value": "fadeIn100"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -306,7 +306,7 @@
         "value": "Fade in"
       },
       {
-        "value": "ms-u-fadeIn200"
+        "value": "fadeIn200"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -320,7 +320,7 @@
         "value": "Fade in"
       },
       {
-        "value": "ms-u-fadeIn400"
+        "value": "fadeIn400"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -334,7 +334,7 @@
         "value": "Fade in"
       },
       {
-        "value": "ms-u-fadeIn500"
+        "value": "fadeIn500"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -348,7 +348,7 @@
         "value": "Fade out"
       },
       {
-        "value": "ms-u-fadeOut100"
+        "value": "fadeOut100"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -362,7 +362,7 @@
         "value": "Fade out"
       },
       {
-        "value": "ms-u-fadeOut200"
+        "value": "fadeOut200"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -376,7 +376,7 @@
         "value": "Fade out"
       },
       {
-        "value": "ms-u-fadeOut400"
+        "value": "fadeOut400"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
diff --git a/apps/fabric-website/src/data/layout-visibility.json b/apps/fabric-website/src/data/layout-visibility.json
index b2757dd27ab98..824cb641236e5 100644
--- a/apps/fabric-website/src/data/layout-visibility.json
+++ b/apps/fabric-website/src/data/layout-visibility.json
@@ -11,7 +11,7 @@
   "data": [
     [
       {
-        "value": "ms-u-hiddenSm"
+        "value": "hiddenSm"
       },
       {
         "value": ""
@@ -39,7 +39,7 @@
     ],
     [
       {
-        "value": "ms-u-hiddenMd"
+        "value": "hiddenMd"
       },
       {
         "value": "",
@@ -67,7 +67,7 @@
     ],
     [
       {
-        "value": "ms-u-hiddenMdDown"
+        "value": "hiddenMdDown"
       },
       {
         "value": ""
@@ -94,7 +94,7 @@
     ],
     [
       {
-        "value": "ms-u-hiddenMdUp"
+        "value": "hiddenMdUp"
       },
       {
         "value": "",
@@ -118,7 +118,7 @@
     ],
     [
       {
-        "value": "ms-u-hiddenLg"
+        "value": "hiddenLg"
       },
       {
         "value": "",
@@ -146,7 +146,7 @@
     ],
     [
       {
-        "value": "ms-u-hiddenLgDown"
+        "value": "hiddenLgDown"
       },
       {
         "value": ""
@@ -172,7 +172,7 @@
     ],
     [
       {
-        "value": "ms-u-hiddenLgUp"
+        "value": "hiddenLgUp"
       },
       {
         "value": "",
@@ -197,7 +197,7 @@
     ],
     [
       {
-        "value": "ms-u-hiddenXl"
+        "value": "hiddenXl"
       },
       {
         "value": "",
@@ -225,7 +225,7 @@
     ],
     [
       {
-        "value": "ms-u-hiddenXlDown"
+        "value": "hiddenXlDown"
       },
       {
         "value": ""
@@ -250,7 +250,7 @@
     ],
     [
       {
-        "value": "ms-u-hiddenXlUp"
+        "value": "hiddenXlUp"
       },
       {
         "value": "",
@@ -276,7 +276,7 @@
     ],
     [
       {
-        "value": "ms-u-hiddenXxl"
+        "value": "hiddenXxl"
       },
       {
         "value": "",
@@ -304,7 +304,7 @@
     ],
     [
       {
-        "value": "ms-u-hiddenXxlDown"
+        "value": "hiddenXxlDown"
       },
       {
         "value": ""
@@ -328,7 +328,7 @@
     ],
     [
       {
-        "value": "ms-u-hiddenXxlUp"
+        "value": "hiddenXxlUp"
       },
       {
         "value": "",
@@ -355,7 +355,7 @@
     ],
     [
       {
-        "value": "ms-u-hiddenXxxl"
+        "value": "hiddenXxxl"
       },
       {
         "value": "",
@@ -382,4 +382,4 @@
       }
     ]
   ]
-}
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/data/utilities.json b/apps/fabric-website/src/data/utilities.json
index baa3ba71cbe35..f1d82b922dedc 100644
--- a/apps/fabric-website/src/data/utilities.json
+++ b/apps/fabric-website/src/data/utilities.json
@@ -6,7 +6,7 @@
   "data": [
     [
       {
-        "value": "ms-u-screenReaderOnly"
+        "value": "screenReaderOnly"
       },
       {
         "value": "Visually Hides content while still keeping it accessible for screen readers."
@@ -14,7 +14,7 @@
     ],
     [
       {
-        "value": "ms-u-borderBox"
+        "value": "borderBox"
       },
       {
         "value": "Set the value of 'box-sizing' to 'border-box', so that the element's padding and border are included in its width."
@@ -22,52 +22,47 @@
     ],
     [
       {
-        "value": "ms-u-clearfix"
+        "value": "clearfix"
       },
       {
         "value": "Prevents the container of a floated element from collapsing."
       }
     ],
-    
     [
       {
-        "value": "ms-u-textAlignLeft"
+        "value": "textAlignLeft"
       },
       {
         "value": "Sets the value of 'text-align' to 'left'."
       }
     ],
-    
     [
       {
-        "value": "ms-u-textAlignCenter"
+        "value": "textAlignCenter"
       },
       {
         "value": "Sets the value of 'text-align' to 'center'."
       }
     ],
-    
     [
       {
-        "value": "ms-u-textAlignRight"
+        "value": "textAlignRight"
       },
       {
         "value": "Sets the value of 'text-align' to 'right'."
       }
     ],
-    
     [
       {
-        "value": "ms-u-borderBase"
+        "value": "borderBase"
       },
       {
         "value": "Applies a solid, 1px wide border to the element. A border color class can then be used to set a color for the border."
       }
     ],
-    
     [
       {
-        "value": "ms-u-normalize"
+        "value": "normalize"
       },
       {
         "value": "Sets a variety of baseline styles for the element. This helper applies 'border-box' box sizing, removes any margins and padding, and removes box shadow."
diff --git a/apps/fabric-website/src/pages/BlogPage/BlogItem.scss b/apps/fabric-website/src/pages/BlogPage/BlogItem.scss
index 504f4ff22d5ec..2c7de8ab80375 100644
--- a/apps/fabric-website/src/pages/BlogPage/BlogItem.scss
+++ b/apps/fabric-website/src/pages/BlogPage/BlogItem.scss
@@ -74,7 +74,7 @@ $BlogItem-dateColumnWidth: 120px;
     font-size: $ms-font-size-m;
   }
 
-  @media screen and (min-width: $ms-screen-lg-min) {
+  @media screen and (min-width: $ms-screen-min-lg) {
     // Place date to left instead of on top
     .BlogItem-contentColumn {
       padding-left: $BlogItem-dateColumnWidth;
diff --git a/apps/fabric-website/src/pages/BlogPage/BlogPage.module.scss b/apps/fabric-website/src/pages/BlogPage/BlogPage.module.scss
index f3f65e572e893..7962de473ed48 100644
--- a/apps/fabric-website/src/pages/BlogPage/BlogPage.module.scss
+++ b/apps/fabric-website/src/pages/BlogPage/BlogPage.module.scss
@@ -11,7 +11,7 @@
   min-height: 80px; // Enough height to fit angle
 }
 
-@media screen and (min-width: $ms-screen-lg-min) {
+@media screen and (min-width: $ms-screen-min-lg) {
   .angle {
     margin-top: 0; // Move back down to ensure room for in-page nav
     min-height: 120px;
diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.diagram.module.scss b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.diagram.module.scss
index 4963066fd715e..1495957e1c383 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.diagram.module.scss
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.diagram.module.scss
@@ -9,7 +9,7 @@
   display: flex;
   flex-direction: column;
 
-  @media screen and (min-width: $ms-screen-xl-min) {
+  @media screen and (min-width: $ms-screen-min-xl) {
     flex-direction: row; // Horizontal layout on extra large screens
   }
 
@@ -17,7 +17,7 @@
   a:visited {
     color: $ms-color-white;
     border-bottom: 1px solid rgba(255,255,255,0.5);
-    transition: border-color $ms-duration2 $ms-ease1;
+    transition: border-color $ms-animation-duration-2 $ms-animation-ease-1;
   }
 
   a:hover {
@@ -33,7 +33,7 @@
   display: flex;
   flex-direction: column;
 
-  @media screen and (min-width: $ms-screen-md-min) and (max-width: $ms-screen-lg-max) {
+  @media screen and (min-width: $ms-screen-min-md) and (max-width: $ms-screen-max-lg) {
     flex-direction: row;
   }
 
@@ -41,11 +41,11 @@
     align-self: center;
     max-width: 200px;
 
-    @media screen and (min-width: $ms-screen-xl-min) {
+    @media screen and (min-width: $ms-screen-min-xl) {
       margin-bottom: 20px;
     }
 
-    @media screen and (min-width: $ms-screen-md-min) and (max-width: $ms-screen-lg-max) {
+    @media screen and (min-width: $ms-screen-min-md) and (max-width: $ms-screen-max-lg) {
       margin-right: 28px;
     }
   }
@@ -71,7 +71,7 @@
   text-align: center;
   width: 40px;
 
-  @media screen and (min-width: $ms-screen-xl-min) {
+  @media screen and (min-width: $ms-screen-min-xl) {
     margin: 0 20px 0 4px; // Give it some space in the horizontal layout
   }
 }
@@ -85,7 +85,7 @@
   width: 100%;
 
   // Horizontal layout on large screens
-  @media screen and (min-width: $ms-screen-lg-min) {
+  @media screen and (min-width: $ms-screen-min-lg) {
     flex-direction: row;
     margin-top: 40px;
   }
@@ -112,7 +112,7 @@
   }
 
   // Horizontal layout
-  @media screen and (min-width: $ms-screen-lg-min) {
+  @media screen and (min-width: $ms-screen-min-lg) {
     flex-direction: column;
     margin: 0 0 0 16px;
 
@@ -143,7 +143,7 @@
   flex-shrink: 0;
   padding: 20px;
 
-  @media screen and (min-width: $ms-screen-lg-min) {
+  @media screen and (min-width: $ms-screen-min-lg) {
     width: 100%;
   }
 }
diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
index 7d760b27667e1..c86a773b6d335 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
@@ -23,7 +23,7 @@
   }
 }
 
-@media screen and (min-width: $ms-screen-lg-min) {
+@media screen and (min-width: $ms-screen-min-lg) {
   .designSection,
   .structureSection,
   .instructionsSection {
@@ -76,13 +76,13 @@
   }
 }
 
-@media screen and (max-width: $ms-screen-md-max) {
+@media screen and (max-width: $ms-screen-max-md) {
   .designSection .feature {
     float: none;
   }
 }
 
-@media screen and (min-width: $ms-screen-lg-min) {
+@media screen and (min-width: $ms-screen-min-lg) {
   img {
     margin-bottom: 20px;
   }
@@ -120,7 +120,7 @@
   counter-reset: li; // Start a counter of list items
   max-width: 50em;
   margin: 60px auto;
-  @include margin-right(0);
+  @include ms-margin-right(0);
 
   li {
     list-style: none; // Remove the usual numbers
@@ -150,14 +150,14 @@
   }
 }
 
-@media screen and (min-width: $ms-screen-lg-min) {
+@media screen and (min-width: $ms-screen-min-lg) {
   .steps {
     li {
-      @include padding-left(56px);
+      @include ms-padding-left(56px);
       padding-top: 0;
 
       &::before {
-        @include left(0);
+        @include ms-left(0);
       }
     }
   }
diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
index a5dd95727dbf3..b5e5d1dfd5ba8 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
@@ -40,17 +40,17 @@ export class GetStartedPage extends React.Component<any, any> {
           <h2>Use our design language in your own experience</h2>
           <div className='ms-Grid ms-Grid--wide'>
             <div className='ms-Grid-row'>
-              <div className={ css('ms-Grid-col ms-u-lg4', styles.feature) }>
+              <div className={ css('ms-Grid-col ms-lg4', styles.feature) }>
                 <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/get-started-styles.svg' } alt='Illustration of Typography and color swatches.' />
                 <div className={ styles.title }>Styles</div>
                 <div className={ styles.description }>Fabric gives you access to Segoe, Microsoft&rsquo;s official typeface, along with the color palette, type ramp, icons, and responsive grid for Office 365.</div>
               </div>
-              <div className={ css('ms-Grid-col ms-u-lg4', styles.feature) }>
+              <div className={ css('ms-Grid-col ms-lg4', styles.feature) }>
                 <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/get-started-icons.svg' } alt='Illustration of Icons' />
                 <div className={ styles.title }>Icons</div>
                 <div className={ styles.description }>Fabric includes Office&rsquo;s official product icons. Fabric also provides a suite of product and document symbols, so you can use the same metaphors we use.</div>
               </div>
-              <div className={ css('ms-Grid-col ms-u-lg4', styles.feature) }>
+              <div className={ css('ms-Grid-col ms-lg4', styles.feature) }>
                 <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/get-started-components.svg' } alt='Illustration of Components' />
                 <div className={ styles.title }>Components</div>
                 <div className={ styles.description }>Components are the building blocks of your UI. Fabric has a variety of components, including navigation, commands, containers, and content.</div>
diff --git a/apps/fabric-website/src/pages/HomePage/HomePage.module.scss b/apps/fabric-website/src/pages/HomePage/HomePage.module.scss
index bfc967540864e..99f5004900ac6 100644
--- a/apps/fabric-website/src/pages/HomePage/HomePage.module.scss
+++ b/apps/fabric-website/src/pages/HomePage/HomePage.module.scss
@@ -73,7 +73,7 @@
   margin-top: 16px;
 }
 
-@media screen and (min-width: $ms-screen-lg-min) {
+@media screen and (min-width: $ms-screen-min-lg) {
   .hero {
     padding-bottom: 120px;
   }
@@ -83,7 +83,7 @@
   }
 }
 
-@media screen and (min-width: $ms-screen-xl-min) {
+@media screen and (min-width: $ms-screen-min-xl) {
   .hero {
     padding-top: 140px;
   }
@@ -115,7 +115,7 @@
   a {
     color: $color-home-lighter;
     font-size: $ms-font-size-m;
-    transition: color $ms-duration2 $ms-ease1;
+    transition: color $ms-animation-duration-2 $ms-animation-ease-1;
 
     &:hover {
       color: $ms-color-white;
@@ -146,7 +146,7 @@
   text-align: center;
 }
 
-@media screen and (min-width: $ms-screen-lg-min) {
+@media screen and (min-width: $ms-screen-min-lg) {
   .flavors {
     flex-direction: row;
     padding-bottom: 72px;
@@ -211,7 +211,7 @@
 
   a, a:visited {
     color: $color-home-medium;
-    transition: color $ms-duration2 $ms-ease1;
+    transition: color $ms-animation-duration-2 $ms-animation-ease-1;
   }
 
   a:hover, a:active {
@@ -227,7 +227,7 @@
   background-color: $ms-color-neutralLight;
 }
 
-@media screen and (min-width: $ms-screen-lg-min) {
+@media screen and (min-width: $ms-screen-min-lg) {
   .product {
     flex-direction: row;
     padding-bottom: 60px;
@@ -250,7 +250,7 @@
   }
 }
 
-@media screen and (min-width: $ms-screen-xl-min) {
+@media screen and (min-width: $ms-screen-min-xl) {
   .productImage {
     width: 50%;
   }
@@ -303,7 +303,7 @@
       color: $ms-color-neutralLight;
       display: block;
       font-size: $ms-font-size-l;
-      transition: color $ms-duration2 $ms-ease1;
+      transition: color $ms-animation-duration-2 $ms-animation-ease-1;
     }
 
     &:hover {
@@ -326,7 +326,7 @@
   }
 }
 
-@media screen and (min-width: $ms-screen-lg-min) {
+@media screen and (min-width: $ms-screen-min-lg) {
   .featureList {
     flex-direction: row;
     flex-wrap: wrap;
@@ -337,7 +337,7 @@
   }
 }
 
-@media screen and (min-width: $ms-screen-xl-min) {
+@media screen and (min-width: $ms-screen-min-xl) {
   .featureList li {
     width: 23%; // @todo: Same here, better to use pixels that snap to grid
   }
diff --git a/apps/fabric-website/src/pages/Interstitials/AngularJSPage.tsx b/apps/fabric-website/src/pages/Interstitials/AngularJSPage.tsx
index 9ff7fdbd82683..678f664ca1129 100644
--- a/apps/fabric-website/src/pages/Interstitials/AngularJSPage.tsx
+++ b/apps/fabric-website/src/pages/Interstitials/AngularJSPage.tsx
@@ -16,11 +16,11 @@ export class AngularJSPage extends React.Component<any, any> {
         <div className={ styles.overview }>
           <div className='ms-Grid ms-Grid--wide'>
             <div className='ms-Grid-row'>
-              <div className='ms-Grid-col ms-u-sm12 ms-u-lg8'>
+              <div className='ms-Grid-col ms-sm12 ms-lg8'>
                 <p className={ styles.overviewText }>Using Angular to build out your experience? The ngOfficeUIFabric project makes it easy to use Fabric in Angular-based apps.</p>
                 <p className={ styles.overviewText }>ngOfficeUIFabric is a community effort to build components for Angular-based apps. Watch the Channel 9 video, <a href='https://channel9.msdn.com/Shows/Office-Dev-Show/Office-Dev-Show-Episode-25-Angular-Directives-for-Office-UI-Fabric'>Angular Directives for Office UI Fabric</a>, to learn more about the project.</p>
               </div>
-              <div className={ css('ms-Grid-col ms-u-sm12 ms-u-lg4', styles.overviewImageWrapper) }>
+              <div className={ css('ms-Grid-col ms-sm12 ms-lg4', styles.overviewImageWrapper) }>
                 <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/logo-angular-black.svg' } width='200' height='200' />
               </div>
             </div>
@@ -30,15 +30,15 @@ export class AngularJSPage extends React.Component<any, any> {
         <div className={ styles.features }>
           <div className='ms-Grid ms-Grid--wide'>
             <div className='ms-Grid-row'>
-              <div className='ms-Grid-col ms-u-sm12 ms-u-lg4'>
+              <div className='ms-Grid-col ms-sm12 ms-lg4'>
                 <span className={ styles.featureHeadline }>Efficient and easy to use</span>
                 <p>ngOfficeUIFabric includes Angular elements that not only implement Fabric controls like tables, input controls, and lists, but also add functionality.</p>
               </div>
-              <div className='ms-Grid-col ms-u-sm12 ms-u-lg4'>
+              <div className='ms-Grid-col ms-sm12 ms-lg4'>
                 <span className={ styles.featureHeadline }>Community-driven</span>
                 <p>This project is built by developers to help developers who want to use Angular and blend in with Office. Your contributions are welcome!</p>
               </div>
-              <div className='ms-Grid-col ms-u-sm12 ms-u-lg4'>
+              <div className='ms-Grid-col ms-sm12 ms-lg4'>
                 <span className={ styles.featureHeadline }>Based on Fabric</span>
                 <p>This project uses Fabric styles for its components. Because Fabric is open source, you can create a version that uses your favorite framework too.</p>
               </div>
diff --git a/apps/fabric-website/src/pages/Interstitials/FabricIOSPage.tsx b/apps/fabric-website/src/pages/Interstitials/FabricIOSPage.tsx
index c5de4b6426b7b..0d9ee3015c473 100644
--- a/apps/fabric-website/src/pages/Interstitials/FabricIOSPage.tsx
+++ b/apps/fabric-website/src/pages/Interstitials/FabricIOSPage.tsx
@@ -15,7 +15,7 @@ export class FabricIOSPage extends React.Component<any, any> {
         <div className={ styles.overview }>
           <div className='ms-Grid ms-Grid--wide'>
             <div className='ms-Grid-row'>
-              <div className='ms-Grid-col ms-u-sm12 ms-u-lg8'>
+              <div className='ms-Grid-col ms-sm12 ms-lg8'>
                 <p className={ styles.overviewText }>Use Fabric styling and components written in native Swift to integrate your iOS experience with Office.</p>
                 <p className={ styles.overviewText }>Fabric iOS includes core design elements along with components that are used in iOS Office products like the <a href='https://itunes.apple.com/us/app/microsoft-sharepoint/id1091505266'>SharePoint iOS app</a>.</p>
               </div>
@@ -26,15 +26,15 @@ export class FabricIOSPage extends React.Component<any, any> {
         <div className={ styles.features }>
           <div className='ms-Grid ms-Grid--wide'>
             <div className='ms-Grid-row'>
-              <div className='ms-Grid-col ms-u-sm12 ms-u-lg4'>
+              <div className='ms-Grid-col ms-sm12 ms-lg4'>
                 <span className={ styles.featureHeadline }>Includes core Fabric styles</span>
                 <p>Fabric iOS includes core styles such as colors, the official Office iOS type ramp, and guidance for adding your own icons.</p>
               </div>
-              <div className='ms-Grid-col ms-u-sm12 ms-u-lg4'>
+              <div className='ms-Grid-col ms-sm12 ms-lg4'>
                 <span className={ styles.featureHeadline }>Adds unique components</span>
                 <p>Fabric iOS includes native customizations to buttons, labels, and text fields along with unique components like InitialsView and LogoView.</p>
               </div>
-              <div className='ms-Grid-col ms-u-sm12 ms-u-lg4'>
+              <div className='ms-Grid-col ms-sm12 ms-lg4'>
                 <span className={ styles.featureHeadline }>Open source</span>
                 <p>Fabric iOS is open source so you can file issues, submit bug fixes, or add new functionality. We welcome your contributions!</p>
               </div>
diff --git a/apps/fabric-website/src/pages/Interstitials/FabricJSPage.tsx b/apps/fabric-website/src/pages/Interstitials/FabricJSPage.tsx
index 788a69f20044c..c46e45ddacf0f 100644
--- a/apps/fabric-website/src/pages/Interstitials/FabricJSPage.tsx
+++ b/apps/fabric-website/src/pages/Interstitials/FabricJSPage.tsx
@@ -16,11 +16,11 @@ export class FabricJSPage extends React.Component<any, any> {
         <div className={ styles.overview }>
           <div className='ms-Grid ms-Grid--wide'>
             <div className='ms-Grid-row'>
-              <div className='ms-Grid-col ms-u-sm12 ms-u-lg8'>
+              <div className='ms-Grid-col ms-sm12 ms-lg8'>
                 <p className={ styles.overviewText }>Fabric JS provides a set of basic components that show the visual language of Office.</p>
                 <p className={ styles.overviewText }>This open source project includes components that don&rsquo;t require a framework. You can use them to create simple experiences or extend them with the framework of your choice.</p>
               </div>
-              <div className={ css('ms-Grid-col ms-u-sm12 ms-u-lg4', styles.overviewImageWrapper) }>
+              <div className={ css('ms-Grid-col ms-sm12 ms-lg4', styles.overviewImageWrapper) }>
                 <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/logo-js-black.svg' } width='200' height='200' />
               </div>
             </div>
@@ -30,15 +30,15 @@ export class FabricJSPage extends React.Component<any, any> {
         <div className={ styles.features }>
           <div className='ms-Grid ms-Grid--wide'>
             <div className='ms-Grid-row'>
-              <div className='ms-Grid-col ms-u-sm12 ms-u-lg4'>
+              <div className='ms-Grid-col ms-sm12 ms-lg4'>
                 <span className={ styles.featureHeadline }>Focused on styling</span>
                 <p>Fabric JS shows the basic visuals of the core Fabric building blocks. The components are simple and lightweight.</p>
               </div>
-              <div className='ms-Grid-col ms-u-sm12 ms-u-lg4'>
+              <div className='ms-Grid-col ms-sm12 ms-lg4'>
                 <span className={ styles.featureHeadline }>Framework-independent</span>
                 <p>Use Fabric JS components directly in simple experiences or as the foundation for controls that you implement in a different framework.</p>
               </div>
-              <div className='ms-Grid-col ms-u-sm12 ms-u-lg4'>
+              <div className='ms-Grid-col ms-sm12 ms-lg4'>
                 <span className={ styles.featureHeadline }>Open source</span>
                 <p>Fabric JS is open source so you can file issues, submit bug fixes, or add new functionality. We welcome your contributions!</p>
               </div>
diff --git a/apps/fabric-website/src/pages/Overviews/Overviews.module.scss b/apps/fabric-website/src/pages/Overviews/Overviews.module.scss
index 2063e374562f5..96a99c02201ac 100644
--- a/apps/fabric-website/src/pages/Overviews/Overviews.module.scss
+++ b/apps/fabric-website/src/pages/Overviews/Overviews.module.scss
@@ -9,7 +9,7 @@
 
   a, a:visited {
     color: $ms-color-white;
-    transition: color $ms-duration2 $ms-ease1;
+    transition: color $ms-animation-duration-2 $ms-animation-ease-1;
   }
 
   img {
@@ -72,7 +72,7 @@
   width: 50%;
 }
 
-@media screen and (min-width: $ms-screen-lg-min) {
+@media screen and (min-width: $ms-screen-min-lg) {
   .features {
     flex-direction: row;
 
@@ -83,7 +83,7 @@
   }
 }
 
-@media screen and (min-width: $ms-screen-xl-min) {
+@media screen and (min-width: $ms-screen-min-xl) {
   .header p,
   .features {
     max-width: 53%;
@@ -98,7 +98,7 @@
     position: absolute;
     top: -40px;
     height: 340px;
-    @include right(120px);
+    @include ms-right(120px);
     z-index: 500;
   }
 }
diff --git a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss
index 68cb09a031b98..8926bafd8f1da 100644
--- a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss
+++ b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss
@@ -80,7 +80,7 @@
       bottom: 0;
       content: '';
       height: 6px;
-      @include left(0);
+      @include ms-left(0);
       position: absolute;
       width: 80%;
     }
@@ -92,7 +92,7 @@
   }
 }
 
-@media screen and (min-width: $ms-screen-lg-min) {
+@media screen and (min-width: $ms-screen-min-lg) {
   .angle {
     margin-top: 0; // Move back down to ensure room for in-page nav
     min-height: 120px;
@@ -107,7 +107,7 @@
   }
 }
 
-@media screen and (min-width: $ms-screen-lg-min) {
+@media screen and (min-width: $ms-screen-min-lg) {
   .reachOut {
     margin-bottom: 80px;
   }
diff --git a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
index 1fd018ea1247a..73d7b228b3d8f 100644
--- a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
+++ b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
@@ -32,7 +32,7 @@ export class ResourcesPage extends React.Component<any, any> {
         <div id='reach-out' className={ styles.reachOut }>
           <div className='ms-Grid ms-Grid--wide'>
             <div className='ms-Grid-row'>
-              <div className={ css('ms-Grid-col ms-u-sm-12 ms-u-lg6', styles.channel) }>
+              <div className={ css('ms-Grid-col ms-sm-12 ms-lg6', styles.channel) }>
                 <div className={ styles.imageWrapper }>
                   <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/logo-github.svg' } width='128' height='128' alt='Github logo' />
                 </div>
@@ -40,7 +40,7 @@ export class ResourcesPage extends React.Component<any, any> {
                 <span className={ styles.description }>We&rsquo;re on GitHub, so you can file issues and contribute to the projects.</span>
                 <a href='https://github.com/OfficeDev?query=office-ui-fabric'>See projects</a>
               </div>
-              <div className={ css('ms-Grid-col ms-u-sm-12 ms-u-lg6', styles.channel) }>
+              <div className={ css('ms-Grid-col ms-sm-12 ms-lg6', styles.channel) }>
                 <div className={ styles.imageWrapper }>
                   <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/logo-twitter.svg' } width='128' height='128' alt='Twitter logo' />
                 </div>
@@ -55,10 +55,10 @@ export class ResourcesPage extends React.Component<any, any> {
         <div id='learn-more' className={ styles.related }>
           <div className='ms-Grid ms-Grid--wide'>
             <div className='ms-Grid-row'>
-              <div className='ms-Grid-col ms-u-sm12 ms-u-lg4'>
+              <div className='ms-Grid-col ms-sm12 ms-lg4'>
                 <h2>Learn more with tutorials and resources</h2>
               </div>
-              <div className='ms-Grid-col ms-u-sm12 ms-u-lg8'>
+              <div className='ms-Grid-col ms-sm12 ms-lg8'>
                 <p>Use the tutorials and additional resources on this page to learn how to get Fabric running in your projects.</p>
 
                 <h3>Tutorials</h3>
diff --git a/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.scss b/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.scss
index aeb70283aec73..70b16cc7eb804 100644
--- a/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.scss
+++ b/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.scss
@@ -44,9 +44,9 @@
   }
 
   .docs_animationsTable_body { // override for demo purposes
-    .ms-u-slideRightOut40, .ms-u-slideLeftOut40, .ms-u-slideUpOut20, .ms-u-slideUpOut10,
-    .ms-u-slideDownOut20, .ms-u-slideDownOut10, .ms-u-scaleUpOut103, .ms-u-scaleDownOut98,
-    .ms-u-fadeOut100, .ms-u-fadeOut200, .ms-u-fadeOut400, .ms-u-fadeOut500 {
+    .slideRightOut40, .slideLeftOut40, .slideUpOut20, .slideUpOut10,
+    .slideDownOut20, .slideDownOut10, .scaleUpOut103, .scaleDownOut98,
+    .fadeOut100, .fadeOut200, .fadeOut400, .fadeOut500 {
       -webkit-animation-play-state: paused;
       animation-play-state: paused;
 
@@ -57,24 +57,24 @@
       }
     }
 
-    .ms-u-slideRightOut40, .ms-u-slideLeftOut40, .ms-u-slideLeftIn10, .ms-u-slideLeftIn20, .ms-u-slideLeftIn40 {
+    .slideRightOut40, .slideLeftOut40, .slideLeftIn10, .slideLeftIn20, .slideLeftIn40 {
         .animationExample_panel {
             right: 0;
         }
     }
-    .ms-u-slideLeftOut40 {
+    .slideLeftOut40 {
         .animationExample_panel {
             left: 0;
         }
     }
-    .ms-u-slideUpOut20, .ms-u-slideUpOut10, .ms-u-slideDownOut20, .ms-u-slideDownOut10 {
+    .slideUpOut20, .slideUpOut10, .slideDownOut20, .slideDownOut10 {
         .animationExample_panel {
             width: 100%;
             height: 30px;
             top: 0;
         }
     }
-    .ms-u-slideUpOut10, .ms-u-slideDownOut10 {
+    .slideUpOut10, .slideDownOut10 {
         .animationExample_panel {
             width: 60px;
             top: 10px;
@@ -82,15 +82,15 @@
             height: 20px;
         }
     }
-    .ms-u-slideDownOut10, .ms-u-slideDownOut20 {
+    .slideDownOut10, .slideDownOut20 {
         .animationExample_panel {
             top: 60px;
         }
     }
-    .ms-u-scaleUpIn100,
-    .ms-u-scaleDownIn100,
-    .ms-u-scaleUpOut103,
-    .ms-u-scaleDownOut98 {
+    .scaleUpIn100,
+    .scaleDownIn100,
+    .scaleUpOut103,
+    .scaleDownOut98 {
         overflow: visible;
         .animationExample_panel {
             height: 100%;
@@ -174,7 +174,7 @@
         }
     }
 
-    .ms-u-fadeIn100, .ms-u-fadeIn200, .ms-u-fadeIn400, .ms-u-fadeIn500 {
+    .fadeIn100, .fadeIn200, .fadeIn400, .fadeIn500 {
         .animationExample_panel {
             height: 100%;
             width: 100%;
@@ -182,7 +182,7 @@
         }
     }
 
-    .ms-u-fadeOut100, .ms-u-fadeOut200, .ms-u-fadeOut400, .ms-u-fadeOut500 {
+    .fadeOut100, .fadeOut200, .fadeOut400, .fadeOut500 {
         .animationExample_panel {
             height: 100%;
             width: 100%;
diff --git a/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.tsx b/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.tsx
index 5054984f299cb..29a2e7432e33c 100644
--- a/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.tsx
@@ -39,7 +39,7 @@ export class AnimationsPage extends React.Component<any, any> {
         <h2 id='implementation'>Implementation</h2>
         <CodeBlock language='html' isLightTheme={ true }>
           {
-            `<div class="ms-u-slideRightIn10">This content will slide in.</div>`
+            `<div class="ms-slideRightIn10">This content will slide in.</div>`
           }
         </CodeBlock>
 
diff --git a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss
index 853548a1818e4..7bee21dff5a2a 100644
--- a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss
+++ b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss
@@ -48,7 +48,7 @@
   }
 }
 
-@media screen and (min-width: $ms-screen-lg-min) {
+@media screen and (min-width: $ms-screen-min-lg) {
   .iconList {
     li {
       width: 50%;
@@ -56,7 +56,7 @@
   }
 }
 
-@media screen and (min-width: $ms-screen-xl-min) {
+@media screen and (min-width: $ms-screen-min-xl) {
   .iconList {
     li {
       width: 33%;
diff --git a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
index b6ef69adeb34c..a4395dfc5e5e7 100644
--- a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
@@ -57,10 +57,10 @@ export class BrandIconsPage extends React.Component<any, any> {
         <h3>Product icons</h3>
         <div className='ms-Grid ms-Grid--wide'>
           <div className='ms-Grid-row'>
-            <div className='ms-Grid-col ms-u-sm12 ms-u-lg6'>
+            <div className='ms-Grid-col ms-sm12 ms-lg6'>
               <p>Use product icons to help your users transition between Microsoft products. Product icons represent an app or brand. Do not use a product icon to create a new document of that type. For example, do not create a Word document from a Word product icon.</p>
             </div>
-            <div className='ms-Grid-col ms-u-sm12 ms-u-lg6'>
+            <div className='ms-Grid-col ms-sm12 ms-lg6'>
               <ul className={ styles.exampleIcons }>
                 <li>
                   <img src='https://static2.sharepointonline.com/files/fabric/assets/brand-icons/product/svg/word_48x1.svg' width='100' height='100' alt='Word logo' />
@@ -79,10 +79,10 @@ export class BrandIconsPage extends React.Component<any, any> {
         <h3>Document icons</h3>
         <div className='ms-Grid ms-Grid--wide'>
           <div className='ms-Grid-row'>
-            <div className='ms-Grid-col ms-u-sm12 ms-u-lg6'>
+            <div className='ms-Grid-col ms-sm12 ms-lg6'>
               <p>Use document icons to indicate to users that they are creating a new document of that type. Make sure that a document of the type that the icon represents loads when the user selects the icon. Document icons should always represent Microsoft Office documents. For example, do not use a Word .docx icon to open a .txt file.</p>
             </div>
-            <div className='ms-Grid-col ms-u-sm12 ms-u-lg6'>
+            <div className='ms-Grid-col ms-sm12 ms-lg6'>
               <ul className={ styles.exampleIcons }>
                 <li>
                   <img src='https://static2.sharepointonline.com/files/fabric/assets/brand-icons/document/svg/docx_48x1.svg' width='100' height='100' alt='Docx documents SVG' />
@@ -101,13 +101,13 @@ export class BrandIconsPage extends React.Component<any, any> {
         <h2 id='formats-and-sizes'>Formats and sizes</h2>
         <div className='ms-Grid ms-Grid--wide'>
           <div className='ms-Grid-row'>
-            <div className='ms-Grid-col ms-u-sm12 ms-u-lg6'>
+            <div className='ms-Grid-col ms-sm12 ms-lg6'>
               <p>Multicolor product and document icons look best at 16x16, 48x48, and 96x96 px sizes in the UI of Microsoft products. Fabric provides these icons in both SVG and PNG formats. SVGs are more versatile but are not supported by all browsers. PNGs are supported by most browsers, but require many sizes to remain visually crisp.</p>
               <p>PNGs come in 16x16, 32x32, 48x48, and 96x96 pixel sizes. Where possible, use the default sizes to prevent artifacts and split pixels. Otherwise, use a size that is close to one of the default sizes.</p>
               <p>Because SVGs are vectors, you can resize them more easily. They come in two sizes: 16x16 and 48x48 px. Use the size that most closely maps to what you need for your experience for the best quality.</p>
               <p>Monochrome product icons that are included in the icon font are subject to the branding guidelines, but you can reference them just like other icons noted in the <a href='#/styles/icons'>icons section</a>.</p>
             </div>
-            <div className='ms-Grid-col ms-u-sm12 ms-u-lg6'>
+            <div className='ms-Grid-col ms-sm12 ms-lg6'>
               <ul className={ styles.exampleIcons }>
                 <li>
                   <img src='https://static2.sharepointonline.com/files/fabric/assets/brand-icons/product/png/outlook_16x1.png' width='16' height='16' alt='Outlook 16x1 PNG product icon' />
@@ -139,10 +139,10 @@ export class BrandIconsPage extends React.Component<any, any> {
         <h2 id='resolutions'>Resolutions</h2>
         <div className='ms-Grid ms-Grid--wide'>
           <div className='ms-Grid-row'>
-            <div className='ms-Grid-col ms-u-sm12 ms-u-lg6'>
+            <div className='ms-Grid-col ms-sm12 ms-lg6'>
               <p>Fabric provides multicolor icons of each type and size at different resolutions to accommodate pixel densities and scaling factors across mobile, laptop, and desktop screens. Choose the right resolution for your viewport to avoid icons that appear blurry. The resolution guidance doesn&rsquo;t apply to the monochrome font icons.</p>
             </div>
-            <div className='ms-Grid-col ms-u-sm12 ms-u-lg6'>
+            <div className='ms-Grid-col ms-sm12 ms-lg6'>
               <Table content={ svgResolutionData } />
               <Table content={ pngResolutionData } />
             </div>
diff --git a/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.module.scss b/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.module.scss
index f8b242e44111d..4b84067e5a52e 100644
--- a/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.module.scss
+++ b/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.module.scss
@@ -1,7 +1,7 @@
 @import '../../../styles/variables';
 
 // XL and up
-@media screen and (min-width: $ms-screen-xl-min) {
+@media screen and (min-width: $ms-screen-min-xl) {
   .accentGroup {
     min-height: 320px; // Set a minimum height to prevent groups from wrapping poorly (they are floated)
   }
diff --git a/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx b/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
index fbdcbb17d3c4e..8cd67a1e6c89e 100644
--- a/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
@@ -48,11 +48,11 @@ export class ColorsPage extends React.Component<any, any> {
 
         <div className='ms-Grid ms-Grid--wide'>
           <div className='ms-Grid-row'>
-            <div className='ms-Grid-col ms-u-sm12 ms-u-xl6'>
+            <div className='ms-Grid-col ms-sm12 ms-xl6'>
               <h3>Theme colors</h3>
               <ColorTable content={ themeColorsData } />
             </div>
-            <div className='ms-Grid-col ms-u-sm12 ms-u-xl6'>
+            <div className='ms-Grid-col ms-sm12 ms-xl6'>
               <h3>Neutral colors</h3>
               <ColorTable content={ neutralColorsData } />
             </div>
@@ -63,7 +63,7 @@ export class ColorsPage extends React.Component<any, any> {
         <div className='ms-Grid ms-Grid--wide'>
           <div className='ms-Grid-row'>
             { accentColorsData.map((group, groupIndex) => (
-              <div className='ms-Grid-col ms-u-sm12 ms-u-xl4 ms-u-xxl3'
+              <div className='ms-Grid-col ms-sm12 ms-xl4 ms-xxl3'
                 key={ groupIndex }>
                 <div className={ styles.accentGroup }>
                   <h4>{ group.name }</h4>
diff --git a/apps/fabric-website/src/pages/Styles/LayoutPage/LayoutPage.tsx b/apps/fabric-website/src/pages/Styles/LayoutPage/LayoutPage.tsx
index 44c3547e8db04..ca6a76c3cc89f 100644
--- a/apps/fabric-website/src/pages/Styles/LayoutPage/LayoutPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/LayoutPage/LayoutPage.tsx
@@ -40,98 +40,98 @@ export class LayoutPage extends React.Component<any, any> {
 
         <div className='ms-Grid' aria-label='Example fabric grid where every row has a different number of columns.'>
           <div className='ms-Grid-row' aria-label='Example of 12 equal columns using the grid'>
-            <div className={ 'ms-Grid-col ms-u-sm1 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm1 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>1</div>
             </div>
-            <div className={ 'ms-Grid-col ms-u-sm1 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm1 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>1</div>
             </div>
-            <div className={ 'ms-Grid-col ms-u-sm1 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm1 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>1</div>
             </div>
-            <div className={ 'ms-Grid-col ms-u-sm1 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm1 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>1</div>
             </div>
-            <div className={ 'ms-Grid-col ms-u-sm1 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm1 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>1</div>
             </div>
-            <div className={ 'ms-Grid-col ms-u-sm1 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm1 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>1</div>
             </div>
-            <div className={ 'ms-Grid-col ms-u-sm1 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm1 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>1</div>
             </div>
-            <div className={ 'ms-Grid-col ms-u-sm1 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm1 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>1</div>
             </div>
-            <div className={ 'ms-Grid-col ms-u-sm1 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm1 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>1</div>
             </div>
-            <div className={ 'ms-Grid-col ms-u-sm1 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm1 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>1</div>
             </div>
-            <div className={ 'ms-Grid-col ms-u-sm1 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm1 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>1</div>
             </div>
-            <div className={ 'ms-Grid-col ms-u-sm1 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm1 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>1</div>
             </div>
           </div>
           <div className='ms-Grid-row' aria-label='Example of 6 equal columns using the grid'>
-            <div className={ 'ms-Grid-col ms-u-sm2 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm2 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>2</div>
             </div>
-            <div className={ 'ms-Grid-col ms-u-sm2 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm2 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>2</div>
             </div>
-            <div className={ 'ms-Grid-col ms-u-sm2 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm2 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>2</div>
             </div>
-            <div className={ 'ms-Grid-col ms-u-sm2 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm2 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>2</div>
             </div>
-            <div className={ 'ms-Grid-col ms-u-sm2 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm2 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>2</div>
             </div>
-            <div className={ 'ms-Grid-col ms-u-sm2 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm2 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>2</div>
             </div>
           </div>
           <div className='ms-Grid-row' aria-label='Example of 4 equal columns using the grid'>
-            <div className={ 'ms-Grid-col ms-u-sm3 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm3 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>3</div>
             </div>
-            <div className={ 'ms-Grid-col ms-u-sm3 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm3 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>3</div>
             </div>
-            <div className={ 'ms-Grid-col ms-u-sm3 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm3 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>3</div>
             </div>
-            <div className={ 'ms-Grid-col ms-u-sm3 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm3 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>3</div>
             </div>
           </div>
           <div className='ms-Grid-row' aria-label='Example of 3 equal columns using the grid'>
-            <div className={ 'ms-Grid-col ms-u-sm4 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm4 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>4</div>
             </div>
-            <div className={ 'ms-Grid-col ms-u-sm4 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm4 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>4</div>
             </div>
-            <div className={ 'ms-Grid-col ms-u-sm4 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm4 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>4</div>
             </div>
           </div>
           <div className='ms-Grid-row' aria-label='Example of 2 equal columns using the grid'>
-            <div className={ 'ms-Grid-col ms-u-sm6 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm6 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>6</div>
             </div>
-            <div className={ 'ms-Grid-col ms-u-sm6 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm6 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>6</div>
             </div>
           </div>
           <div className='ms-Grid-row' aria-label='Example of 1 equal column using the grid'>
-            <div className={ 'ms-Grid-col ms-u-sm12 ' + styles.demoBlockCol }>
+            <div className={ 'ms-Grid-col ms-sm12 ' + styles.demoBlockCol }>
               <div className={ styles.demoBlock }>12</div>
             </div>
           </div>
@@ -139,24 +139,24 @@ export class LayoutPage extends React.Component<any, any> {
 
         <div className={ pageStyles.u_maxTextWidth }>
           <h3>How to use</h3>
-          <p>A grid (ms-Grid) can contain multiple rows (ms-Grid-row), each of which has one or more columns (ms-Grid-col). Utility classes (ms-u-sm6) specify how large each column should be on small, medium, and large devices. The columns in a row should add up to 12 for each device size.</p>
+          <p>A grid (ms-Grid) can contain multiple rows (ms-Grid-row), each of which has one or more columns (ms-Grid-col). Utility classes (ms-sm6) specify how large each column should be on small, medium, and large devices. The columns in a row should add up to 12 for each device size.</p>
         </div>
         <CodeBlock language='html' isLightTheme={ true }>
           {
             `<div class="ms-Grid">
   <div class="ms-Grid-row">
-    <div class="ms-Grid-col ms-u-sm6 ms-u-md4 ms-u-lg2">A</div>
-    <div class="ms-Grid-col ms-u-sm6 ms-u-md8 ms-u-lg10">B</div>
+    <div class="ms-Grid-col ms-sm6 ms-md4 ms-lg2">A</div>
+    <div class="ms-Grid-col ms-sm6 ms-md8 ms-lg10">B</div>
   </div>
 </div>`
           }
         </CodeBlock>
         <div className='ms-Grid'>
           <div className='ms-Grid-row'>
-            <div className='ms-Grid-col ms-u-sm6 ms-u-md4 ms-u-lg2'>
+            <div className='ms-Grid-col ms-sm6 ms-md4 ms-lg2'>
               <div className={ styles.demoBlock }>A</div>
             </div>
-            <div className='ms-Grid-col ms-u-sm6 ms-u-md8 ms-u-lg10'>
+            <div className='ms-Grid-col ms-sm6 ms-md8 ms-lg10'>
               <div className={ styles.demoBlock }>B</div>
             </div>
           </div>
@@ -164,17 +164,17 @@ export class LayoutPage extends React.Component<any, any> {
 
         <div className={ pageStyles.u_maxTextWidth }>
           <h4>Inheritance</h4>
-          <p>Because Fabric is mobile-first, any layout defined for small screens is automatically inherited by medium and large screens. The small size utilities (ms-u-sm6) are required. If you want to change the layout on larger screens, you can apply the other utility classes.</p>
+          <p>Because Fabric is mobile-first, any layout defined for small screens is automatically inherited by medium and large screens. The small size utilities (ms-sm6) are required. If you want to change the layout on larger screens, you can apply the other utility classes.</p>
           <p>Try this out! On a large screen, the example block will be smaller. Try shrinking your browser window to see how the example block will take up the entire width of the screen.</p>
         </div>
         <CodeBlock language='html' isLightTheme={ true }>
           {
-            `<div class="ms-Grid-col ms-u-sm12 ms-u-lg4">Example</div>`
+            `<div class="ms-Grid-col ms-sm12 ms-lg4">Example</div>`
           }
         </CodeBlock>
         <div className='ms-Grid'>
           <div className='ms-Grid-row'>
-            <div className='ms-Grid-col ms-u-sm12 ms-u-lg4'>
+            <div className='ms-Grid-col ms-sm12 ms-lg4'>
               <div className={ styles.demoBlock }>Example</div>
             </div>
           </div>
@@ -186,16 +186,16 @@ export class LayoutPage extends React.Component<any, any> {
         </div>
         <CodeBlock language='html' isLightTheme={ true }>
           {
-            `<div class="ms-Grid-col ms-u-sm4 ms-u-smPush8">First in code</div>
-<div class="ms-Grid-col ms-u-sm8 ms-u-smPull4">Second in code</div>`
+            `<div class="ms-Grid-col ms-sm4 ms-smPush8">First in code</div>
+<div class="ms-Grid-col ms-sm8 ms-smPull4">Second in code</div>`
           }
         </CodeBlock>
         <div className='ms-Grid'>
           <div className='ms-Grid-row'>
-            <div className='ms-Grid-col ms-u-sm4 ms-u-smPush8'>
+            <div className='ms-Grid-col ms-sm4 ms-smPush8'>
               <div className={ styles.demoBlock }>First in code</div>
             </div>
-            <div className='ms-Grid-col ms-u-sm8 ms-u-smPull4'>
+            <div className='ms-Grid-col ms-sm8 ms-smPull4'>
               <div className={ styles.demoBlock }>Second in code</div>
             </div>
           </div>
@@ -209,16 +209,16 @@ export class LayoutPage extends React.Component<any, any> {
 
         <CodeBlock language='html' isLightTheme={ true }>
           {
-            `<div class="ms-Grid-col ms-u-sm12 ms-u-hiddenXxlUp">Visible on smaller screens</div>
-<div class="ms-Grid-col ms-u-sm12 ms-u-hiddenXlDown">Visible on larger screens</div>`
+            `<div class="ms-Grid-col ms-sm12 ms-hiddenXxlUp">Visible on smaller screens</div>
+<div class="ms-Grid-col ms-sm12 ms-hiddenXlDown">Visible on larger screens</div>`
           }
         </CodeBlock>
         <div className='ms-Grid'>
           <div className='ms-Grid-row'>
-            <div className='ms-Grid-col ms-u-sm12 ms-u-hiddenXxlUp'>
+            <div className='ms-Grid-col ms-sm12 ms-hiddenXxlUp'>
               <div className={ styles.demoBlock }>Visible on smaller screens</div>
             </div>
-            <div className='ms-Grid-col ms-u-sm12 ms-u-hiddenXlDown'>
+            <div className='ms-Grid-col ms-sm12 ms-hiddenXlDown'>
               <div className={ styles.demoBlock }>Visible on larger screens</div>
             </div>
           </div>
diff --git a/apps/fabric-website/src/pages/Styles/LocalizationPage/LocalizationPage.module.scss b/apps/fabric-website/src/pages/Styles/LocalizationPage/LocalizationPage.module.scss
index 5e9af53f9855b..74623a0928815 100644
--- a/apps/fabric-website/src/pages/Styles/LocalizationPage/LocalizationPage.module.scss
+++ b/apps/fabric-website/src/pages/Styles/LocalizationPage/LocalizationPage.module.scss
@@ -25,7 +25,7 @@
     color: $ms-color-neutralPrimary;
     font-size: $ms-font-size-xs;
     opacity: 0;
-    transition: opacity $ms-duration2 $ms-ease1;
+    transition: opacity $ms-animation-duration-2 $ms-animation-ease-1;
   }
 
   &:hover {
diff --git a/apps/fabric-website/src/styles/_mixins.scss b/apps/fabric-website/src/styles/_mixins.scss
index 95a2a5adf8596..5e8c524abede9 100644
--- a/apps/fabric-website/src/styles/_mixins.scss
+++ b/apps/fabric-website/src/styles/_mixins.scss
@@ -2,11 +2,11 @@
 @mixin contentPadding($paddingTop:0px, $paddingBottom:$contentPaddingBottom) {
   padding: $paddingTop $contentPadding-sm $paddingBottom $contentPadding-sm;
 
-  @media screen and (min-width: $ms-screen-lg-min) {
+  @media screen and (min-width: $ms-screen-min-lg) {
     padding: $paddingTop $contentPadding-lg $paddingBottom $contentPadding-lg;
   }
 
-  @media screen and (min-width: $ms-screen-xl-min) {
+  @media screen and (min-width: $ms-screen-min-xl) {
     padding: $paddingTop $contentPadding-xl $paddingBottom $contentPadding-xl;
   }
 }
@@ -16,12 +16,12 @@
   margin-left: -$contentPadding-sm;
   margin-right: -$contentPadding-sm;
 
-  @media screen and (min-width: $ms-screen-lg-min) {
+  @media screen and (min-width: $ms-screen-min-lg) {
     margin-left: -$contentPadding-lg;
     margin-right: -$contentPadding-lg;
   }
 
-  @media screen and (min-width: $ms-screen-xl-min) {
+  @media screen and (min-width: $ms-screen-min-xl) {
     margin-left: -$contentPadding-xl;
     margin-right: -$contentPadding-xl;
   }
@@ -47,7 +47,7 @@
     right: -10px;
 
     // Use http://pressbin.com/tools/urlencode_urldecode/ and encodeURIComponent() to base64-encode the SVGs
-    
+
     // SVG: <svg xmlns="http://www.w3.org/2000/svg" viewBox="5 0 395 42"><polygon fill="#COLOR" points="400 50 400 0 0 42 0 50"/></svg>
     $colorBelowValue: str-slice('#{$colorBelow}', 2);
     $bottomAngle: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%225%200%20395%2042%22%3E%3Cpolygon%20fill%3D%22%23#{$colorBelowValue}%22%20points%3D%22400%2050%20400%200%200%2042%200%2050%22%2F%3E%3C%2Fsvg%3E");
@@ -67,7 +67,7 @@
       background-position: center bottom;
     }
 
-    @media screen and (min-width: $ms-screen-lg-min) {
+    @media screen and (min-width: $ms-screen-min-lg) {
       height: 140px; // Make room for wider angle
     }
   }
@@ -100,7 +100,7 @@
   color: $foregroundColor;
   letter-spacing: 0.03em;
   padding: 8px 20px 10px 20px;
-  transition: all $ms-duration2 $ms-ease1;
+  transition: all $ms-animation-duration-2 $ms-animation-ease-1;
 
   &:hover {
     background-color: $foregroundColor;
diff --git a/apps/fabric-website/src/styles/_overrides.scss b/apps/fabric-website/src/styles/_overrides.scss
index ccc9bfd7da018..ff2caa9f60f68 100644
--- a/apps/fabric-website/src/styles/_overrides.scss
+++ b/apps/fabric-website/src/styles/_overrides.scss
@@ -8,7 +8,7 @@
 
   // Modifier to increase the Grid's gutters depending on screen size
   .ms-Grid--wide {
-    @media screen and (min-width: $ms-screen-lg-min) {
+    @media screen and (min-width: $ms-screen-min-lg) {
       margin: 0 (-$contentPadding-lg / 2);
       padding: 0 ($contentPadding-lg / 2);
 
@@ -21,7 +21,7 @@
       }
     }
 
-    @media screen and (min-width: $ms-screen-xl-min) {
+    @media screen and (min-width: $ms-screen-min-xl) {
       margin: 0 (-$contentPadding-xl / 2);
       padding: 0 ($contentPadding-xl / 2);
 
diff --git a/apps/fabric-website/src/styles/_typography.scss b/apps/fabric-website/src/styles/_typography.scss
index e525122955eda..a13a653687c4b 100644
--- a/apps/fabric-website/src/styles/_typography.scss
+++ b/apps/fabric-website/src/styles/_typography.scss
@@ -2,7 +2,6 @@
 :global {
   body {
     color: $ms-color-neutralPrimary;
-    font-family: $ms-font-family-base;
     font-size: $ms-font-size-m;
     line-height: 1.5;
   }
diff --git a/apps/fabric-website/src/styles/_variables.scss b/apps/fabric-website/src/styles/_variables.scss
index 426b0e3b7be89..4011ba96bf501 100644
--- a/apps/fabric-website/src/styles/_variables.scss
+++ b/apps/fabric-website/src/styles/_variables.scss
@@ -1,5 +1,5 @@
 // Import the Fabric variables and mixins
-@import '../../node_modules/office-ui-fabric-core/src/sass/_Fabric.Common';
+@import '../../node_modules/office-ui-fabric-core/src/sass/References';
 
 // Colors (all taken from the MDL2 palette)
 $color-home-darker: #004e8c;
diff --git a/apps/todo-app/index.html b/apps/todo-app/index.html
index 6428845e08308..8a7d857094fad 100644
--- a/apps/todo-app/index.html
+++ b/apps/todo-app/index.html
@@ -8,7 +8,7 @@
 
   <title>Test Page</title>
 
-  <link rel="stylesheet" type="text/css" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/5.0.1/css/fabric.min.css">
+  <link rel="stylesheet" type="text/css" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/6.0.0/css/fabric.min.css">
   <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.2.0/react.min.js"></script>
   <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.2.0/react-dom.min.js"></script>
 </head>
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 4ecec96f13072..c927e3454aec9 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -24,7 +24,7 @@
     "@microsoft/load-themed-styles": ">=1.2.2 <2.0.0",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-core": ">=5.1.0 <6.0.0",
+    "office-ui-fabric-core": ">=7.0.0 <8.0.0",
     "office-ui-fabric-react": ">=2.34.2 <3.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
diff --git a/apps/todo-app/src/components/Todo.module.scss b/apps/todo-app/src/components/Todo.module.scss
index 948f6ffac6751..96ca35198a3cc 100644
--- a/apps/todo-app/src/components/Todo.module.scss
+++ b/apps/todo-app/src/components/Todo.module.scss
@@ -1,4 +1,4 @@
-@import "~/office-ui-fabric-core/dist/sass/Fabric.Common";
+@import "~/office-ui-fabric-core/dist/sass/References";
 
 .todo {
   padding: 28px 40px 60px 40px;
@@ -28,7 +28,7 @@
     }
     .addButton {
       display: table-cell;
-      @include margin-left(16px);
+      @include ms-margin-left(16px);
       white-space: nowrap;
     }
   }
@@ -49,7 +49,7 @@
           top: 50%;
           transform: translateY(-50%);
           right: 0px;
-          @include margin-right(16px);
+          @include ms-margin-right(16px);
 
           &:hover, &:focus {
             color: $ms-color-themePrimary;
diff --git a/apps/todo-app/src/components/TodoItem.tsx b/apps/todo-app/src/components/TodoItem.tsx
index 19c1fa072f6cc..2fa2f1565e1ef 100644
--- a/apps/todo-app/src/components/TodoItem.tsx
+++ b/apps/todo-app/src/components/TodoItem.tsx
@@ -40,7 +40,7 @@ export default class TodoItem extends React.Component<ITodoItemProps, {}> {
       styles.todoItem,
       this.props.item.isComplete === true ? styles.isCompleted : '',
       'ms-Grid',
-      'ms-u-slideDownIn20'
+      'ms-slideDownIn20'
     );
 
     return (
@@ -80,11 +80,11 @@ export default class TodoItem extends React.Component<ITodoItemProps, {}> {
   }
 
   private _onCheckboxChange(ev: React.FormEvent<HTMLElement>, isChecked: boolean): void {
-    this._handleWithAnimation(this.props.onToggleComplete, 'ms-u-slideUpOut20');
+    this._handleWithAnimation(this.props.onToggleComplete, 'ms-slideUpOut20');
   }
 
   private _onDelete(event: React.MouseEvent<HTMLButtonElement>): void {
-    this._handleWithAnimation(this.props.onDeleteItem, 'ms-u-slideUpOut20');
+    this._handleWithAnimation(this.props.onDeleteItem, 'ms-slideUpOut20');
   }
 
   private _handleWithAnimation(callback: (task: ITodoItem) => void, animationClass: string): void {
diff --git a/apps/todo-app/src/types/IDataProvider.ts b/apps/todo-app/src/types/IDataProvider.ts
index 2a832944bd91d..66f25f232a127 100644
--- a/apps/todo-app/src/types/IDataProvider.ts
+++ b/apps/todo-app/src/types/IDataProvider.ts
@@ -1,4 +1,5 @@
 import { ITodoItem } from './index';
+import { Promise } from 'es6-promise';
 
 /**
  * The data provider interface implemented by MockTodoDataProvider and TodoDataProvider.
diff --git a/common/changes/beta-core-6_2017-04-24-19-30.json b/common/changes/beta-core-6_2017-04-24-19-30.json
new file mode 100644
index 0000000000000..bda762b60a0ce
--- /dev/null
+++ b/common/changes/beta-core-6_2017-04-24-19-30.json
@@ -0,0 +1,15 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Updated dependency to Fabric Core 7",
+      "type": "major"
+    },
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Updated dependency to Fabric Core 7",
+      "type": "patch"
+    }
+  ],
+  "email": "miwhea@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/npm-shrinkwrap.json b/common/npm-shrinkwrap.json
index 3806fc22904b6..192ff8b736f34 100644
--- a/common/npm-shrinkwrap.json
+++ b/common/npm-shrinkwrap.json
@@ -933,14 +933,21 @@
       "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.31.tgz"
     },
     "@uifabric/example-app-base": {
-      "version": "1.3.13",
+      "version": "1.3.14",
       "from": "@uifabric/example-app-base@>=1.3.12 <2.0.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-1.3.13.tgz"
+      "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-1.3.14.tgz",
+      "dependencies": {
+        "office-ui-fabric-core": {
+          "version": "5.1.0",
+          "from": "office-ui-fabric-core@>=5.0.0 <6.0.0",
+          "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-5.1.0.tgz"
+        }
+      }
     },
     "@uifabric/utilities": {
-      "version": "1.10.0",
-      "from": "@uifabric/utilities@>=1.10.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-1.10.0.tgz"
+      "version": "1.10.2",
+      "from": "@uifabric/utilities@>=1.10.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-1.10.2.tgz"
     },
     "abbrev": {
       "version": "1.0.9",
@@ -1597,9 +1604,9 @@
       "resolved": "https://registry.npmjs.org/caniuse-api/-/caniuse-api-1.6.1.tgz"
     },
     "caniuse-db": {
-      "version": "1.0.30000670",
+      "version": "1.0.30000672",
       "from": "caniuse-db@>=1.0.30000488 <2.0.0",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000670.tgz"
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000672.tgz"
     },
     "capture-stack-trace": {
       "version": "1.0.0",
@@ -2099,9 +2106,9 @@
       "resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz"
     },
     "css-loader": {
-      "version": "0.28.2",
+      "version": "0.28.3",
       "from": "css-loader@>=0.28.0 <0.29.0",
-      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.2.tgz",
+      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.3.tgz",
       "dependencies": {
         "loader-utils": {
           "version": "1.1.0",
@@ -2477,9 +2484,9 @@
       "resolved": "https://registry.npmjs.org/ejs/-/ejs-2.5.6.tgz"
     },
     "electron-to-chromium": {
-      "version": "1.3.11",
+      "version": "1.3.12",
       "from": "electron-to-chromium@>=1.2.7 <2.0.0",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.11.tgz"
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.12.tgz"
     },
     "elliptic": {
       "version": "6.4.0",
@@ -3916,9 +3923,9 @@
       }
     },
     "gulp-typescript": {
-      "version": "3.1.6",
+      "version": "3.1.7",
       "from": "gulp-typescript@>=3.1.6 <3.2.0",
-      "resolved": "https://registry.npmjs.org/gulp-typescript/-/gulp-typescript-3.1.6.tgz",
+      "resolved": "https://registry.npmjs.org/gulp-typescript/-/gulp-typescript-3.1.7.tgz",
       "dependencies": {
         "glob": {
           "version": "5.0.15",
@@ -4173,9 +4180,9 @@
       }
     },
     "html-minifier": {
-      "version": "3.5.1",
+      "version": "3.5.2",
       "from": "html-minifier@>=3.0.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/html-minifier/-/html-minifier-3.5.1.tgz",
+      "resolved": "https://registry.npmjs.org/html-minifier/-/html-minifier-3.5.2.tgz",
       "dependencies": {
         "source-map": {
           "version": "0.5.6",
@@ -5889,14 +5896,14 @@
       "resolved": "https://registry.npmjs.org/obuf/-/obuf-1.1.1.tgz"
     },
     "office-ui-fabric-core": {
-      "version": "5.1.0",
-      "from": "office-ui-fabric-core@>=5.0.0 <6.0.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-5.1.0.tgz"
+      "version": "7.0.0",
+      "from": "office-ui-fabric-core@7.0.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-7.0.0.tgz"
     },
     "office-ui-fabric-react": {
-      "version": "2.32.0",
+      "version": "2.34.1",
       "from": "office-ui-fabric-react@>=2.11.0-0 <3.0.0-0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-2.32.0.tgz"
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-2.34.1.tgz"
     },
     "on-finished": {
       "version": "2.3.0",
@@ -7097,9 +7104,9 @@
           "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz"
         },
         "webpack": {
-          "version": "2.6.0",
+          "version": "2.6.1",
           "from": "webpack@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.0.tgz"
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz"
         },
         "yargs": {
           "version": "6.6.0",
@@ -7209,9 +7216,9 @@
           "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.2.1.tgz"
         },
         "sinon": {
-          "version": "2.3.1",
+          "version": "2.3.2",
           "from": "sinon@>=2.1.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/sinon/-/sinon-2.3.1.tgz"
+          "resolved": "https://registry.npmjs.org/sinon/-/sinon-2.3.2.tgz"
         },
         "source-map": {
           "version": "0.5.6",
@@ -7266,9 +7273,9 @@
           "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz"
         },
         "webpack": {
-          "version": "2.6.0",
+          "version": "2.6.1",
           "from": "webpack@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.0.tgz"
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz"
         },
         "yargs": {
           "version": "6.6.0",
@@ -7407,9 +7414,9 @@
           "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz"
         },
         "webpack": {
-          "version": "2.6.0",
+          "version": "2.6.1",
           "from": "webpack@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.0.tgz"
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz"
         },
         "yargs": {
           "version": "6.6.0",
@@ -7521,9 +7528,9 @@
           "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz"
         },
         "webpack": {
-          "version": "2.6.0",
+          "version": "2.6.1",
           "from": "webpack@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.0.tgz"
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz"
         },
         "yargs": {
           "version": "6.6.0",
@@ -7583,9 +7590,9 @@
           "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.2.1.tgz"
         },
         "sinon": {
-          "version": "2.3.1",
+          "version": "2.3.2",
           "from": "sinon@>=2.1.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/sinon/-/sinon-2.3.1.tgz"
+          "resolved": "https://registry.npmjs.org/sinon/-/sinon-2.3.2.tgz"
         },
         "type-detect": {
           "version": "4.0.3",
diff --git a/common/temp_modules/rush-example-app-base/package.json b/common/temp_modules/rush-example-app-base/package.json
index 9ef1253d50895..508f8438fb84f 100644
--- a/common/temp_modules/rush-example-app-base/package.json
+++ b/common/temp_modules/rush-example-app-base/package.json
@@ -22,11 +22,11 @@
     "source-map-loader": "0.2.1",
     "typescript": "2.2.2",
     "highlight.js": "^9.9.0",
-    "office-ui-fabric-core": ">=5.0.0 <6.0.0",
+    "office-ui-fabric-core": "7.0.0",
     "office-ui-fabric-react": ">=2.11.0-0 <3.0.0-0"
   },
   "rushDependencies": {
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
-    "@uifabric/utilities": "1.10.0"
+    "@uifabric/utilities": "1.10.2"
   }
 }
diff --git a/common/temp_modules/rush-example-component/package.json b/common/temp_modules/rush-example-component/package.json
index bb0a839a62de0..5f7de152afd39 100644
--- a/common/temp_modules/rush-example-component/package.json
+++ b/common/temp_modules/rush-example-component/package.json
@@ -33,9 +33,9 @@
     "webpack-notifier": "^1.5.0"
   },
   "rushDependencies": {
-    "@uifabric/example-app-base": "1.3.13",
-    "@uifabric/utilities": "1.10.0",
-    "office-ui-fabric-react": ">=2.32.0 <3.0.0",
+    "@uifabric/example-app-base": "1.3.14",
+    "@uifabric/utilities": "1.10.2",
+    "office-ui-fabric-react": ">=2.34.1 <3.0.0",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0"
   }
 }
diff --git a/common/temp_modules/rush-fabric-website/package.json b/common/temp_modules/rush-fabric-website/package.json
index 63eae95c7e6af..4a4f1f5aee394 100644
--- a/common/temp_modules/rush-fabric-website/package.json
+++ b/common/temp_modules/rush-fabric-website/package.json
@@ -35,12 +35,12 @@
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
-    "office-ui-fabric-core": ">=5.1.0 <6.0.0"
+    "office-ui-fabric-core": "7.0.0"
   },
   "rushDependencies": {
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
-    "@uifabric/example-app-base": "1.3.13",
-    "office-ui-fabric-react": ">=2.32.0 <3.0.0",
-    "@uifabric/utilities": ">=1.10.0 <2.0.0"
+    "@uifabric/example-app-base": "1.3.14",
+    "office-ui-fabric-react": ">=2.34.1 <3.0.0",
+    "@uifabric/utilities": ">=1.10.2 <2.0.0"
   }
 }
diff --git a/common/temp_modules/rush-office-ui-fabric-react/package.json b/common/temp_modules/rush-office-ui-fabric-react/package.json
index ec9e889766177..7fa2daac23045 100644
--- a/common/temp_modules/rush-office-ui-fabric-react/package.json
+++ b/common/temp_modules/rush-office-ui-fabric-react/package.json
@@ -31,7 +31,7 @@
     "mocha": "^3.2.0",
     "mocha-loader": "^1.1.1",
     "node-sass": "^4.5.0",
-    "office-ui-fabric-core": ">=5.0.0 <6.0.0",
+    "office-ui-fabric-core": "7.0.0",
     "postcss-loader": "^1.3.3",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
@@ -53,8 +53,8 @@
     "webpack-split-by-path": "2.0.0"
   },
   "rushDependencies": {
-    "@uifabric/example-app-base": "1.3.13",
+    "@uifabric/example-app-base": "1.3.14",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
-    "@uifabric/utilities": ">=1.10.0 <2.0.0"
+    "@uifabric/utilities": ">=1.10.2 <2.0.0"
   }
 }
diff --git a/common/temp_modules/rush-ssr-tests/package.json b/common/temp_modules/rush-ssr-tests/package.json
index 74e4a0f90a1cb..aa14b2714e94a 100644
--- a/common/temp_modules/rush-ssr-tests/package.json
+++ b/common/temp_modules/rush-ssr-tests/package.json
@@ -19,6 +19,6 @@
     "es6-promise": "^4.1.0"
   },
   "rushDependencies": {
-    "office-ui-fabric-react": ">=2.32.0 <3.0.0"
+    "office-ui-fabric-react": ">=2.34.1 <3.0.0"
   }
 }
diff --git a/common/temp_modules/rush-styling/package.json b/common/temp_modules/rush-styling/package.json
index 98c4f4f1bb333..5a50eba8d2bad 100644
--- a/common/temp_modules/rush-styling/package.json
+++ b/common/temp_modules/rush-styling/package.json
@@ -39,6 +39,6 @@
   },
   "rushDependencies": {
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
-    "@uifabric/utilities": ">=1.10.0 <2.0.0"
+    "@uifabric/utilities": ">=1.10.2 <2.0.0"
   }
 }
diff --git a/common/temp_modules/rush-test-bundle-button/package.json b/common/temp_modules/rush-test-bundle-button/package.json
index f050db2007bdf..ae242b167d82d 100644
--- a/common/temp_modules/rush-test-bundle-button/package.json
+++ b/common/temp_modules/rush-test-bundle-button/package.json
@@ -18,6 +18,6 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "rushDependencies": {
-    "office-ui-fabric-react": ">=2.32.0 <3.0.0"
+    "office-ui-fabric-react": ">=2.34.1 <3.0.0"
   }
 }
diff --git a/common/temp_modules/rush-todo-app/package.json b/common/temp_modules/rush-todo-app/package.json
index 094ca87f26399..3946248b2bbb9 100644
--- a/common/temp_modules/rush-todo-app/package.json
+++ b/common/temp_modules/rush-todo-app/package.json
@@ -16,12 +16,12 @@
     "@microsoft/load-themed-styles": ">=1.2.2 <2.0.0",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-core": ">=5.1.0 <6.0.0",
+    "office-ui-fabric-core": "7.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2"
   },
   "rushDependencies": {
-    "office-ui-fabric-react": ">=2.32.0 <3.0.0"
+    "office-ui-fabric-react": ">=2.34.1 <3.0.0"
   }
 }
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 2dc0c6e31df53..787d35d52e57f 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -42,7 +42,7 @@
   "dependencies": {
     "@uifabric/utilities": "1.10.2",
     "highlight.js": "^9.9.0",
-    "office-ui-fabric-core": ">=5.0.0 <6.0.0",
+    "office-ui-fabric-core": "7.0.0",
     "office-ui-fabric-react": ">=2.11.0-0 <3.0.0-0"
   }
 }
\ No newline at end of file
diff --git a/packages/example-app-base/src/common/_common.scss b/packages/example-app-base/src/common/_common.scss
index a047d898ca167..a135ab74ac2e3 100644
--- a/packages/example-app-base/src/common/_common.scss
+++ b/packages/example-app-base/src/common/_common.scss
@@ -1,4 +1,4 @@
-@import '~office-ui-fabric-core/dist/sass/Fabric.Common';
+@import '~office-ui-fabric-core/dist/sass/References';
 @import './i18n';
 @import './themeOverrides';
 @import './focusBorder';
diff --git a/packages/example-app-base/src/components/App/App.scss b/packages/example-app-base/src/components/App/App.scss
index fc31edfbb4f98..c4e5fec4422e5 100644
--- a/packages/example-app-base/src/components/App/App.scss
+++ b/packages/example-app-base/src/components/App/App.scss
@@ -21,7 +21,7 @@
 
   .ms-App-nav {
     position: absolute;
-    @include left(0);
+    @include ms-left(0);
     width: 300px;
     top: 50px;
     bottom: 0;
@@ -35,8 +35,8 @@
 
   .ms-App-content {
     position: absolute;
-    @include left(300px);
-    @include right(0);
+    @include ms-left(300px);
+    @include ms-right(0);
     top: 50px;
     bottom: 0;
     overflow-x: auto;
@@ -52,7 +52,7 @@
   .ms-App--small .ms-App-content,
   .ms-App--medium .ms-App-content,
   .ms-App--large .ms-App-content {
-    @include left(0);
+    @include ms-left(0);
     padding: 5px;
   }
 
@@ -83,7 +83,7 @@
     vertical-align: middle;
     transform: translateY(-50%);
     position: absolute;
-    @include right(20px);
+    @include ms-right(20px);
     top: 50%;
     padding: 2px 6px;
     border-radius: 2px;
diff --git a/packages/example-app-base/src/components/App/App.tsx b/packages/example-app-base/src/components/App/App.tsx
index 7ba947d486e28..91bab92df3602 100644
--- a/packages/example-app-base/src/components/App/App.tsx
+++ b/packages/example-app-base/src/components/App/App.tsx
@@ -94,7 +94,7 @@ export class App extends React.Component<IAppProps, any> {
 
         { (responsiveMode <= ResponsiveMode.large) ? (
           <Panel
-            className='ms-App-navPanel ms-font-m'
+            className='ms-App-navPanel'
             isOpen={ isMenuVisible }
             isLightDismiss={ true }
             type={ PanelType.smallFixedNear }
diff --git a/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss b/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss
index 7a05af92a2fab..bb53b303bdb96 100644
--- a/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss
+++ b/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss
@@ -49,7 +49,7 @@ $dontColor: #A61E22;
     flex-direction: column;
     justify-content: space-between;
 
-    @media(min-width: $ms-screen-xl-min) {
+    @media(min-width: $ms-screen-min-xl) {
       flex-direction: row;
     }
   }
@@ -67,7 +67,7 @@ $dontColor: #A61E22;
     }
 
     ul {
-      @include padding-left(18px);
+      @include ms-padding-left(18px);
     }
 
     li {
@@ -107,7 +107,7 @@ $dontColor: #A61E22;
 
   .ComponentPage-navLink {
     display: inline-block;
-    @include margin-right(40px);
+    @include ms-margin-right(40px);
   }
 
   .ComponentPage-navLink .ms-Link {
@@ -147,7 +147,7 @@ $dontColor: #A61E22;
     }
 
     ul {
-      @include padding-left(18px);
+      @include ms-padding-left(18px);
     }
 
     li {
@@ -156,7 +156,7 @@ $dontColor: #A61E22;
     }
 
     &:first-child {
-      @include margin-right(120px);
+      @include ms-margin-right(120px);
     }
   }
 
@@ -164,7 +164,7 @@ $dontColor: #A61E22;
     background-color: #e74856;
   }
 
-  @media screen and (min-width: $ms-screen-lg-min) {
+  @media screen and (min-width: $ms-screen-min-lg) {
     .ComponentPage-doSection {
       margin-bottom: -10px; // Trim last list item
       width: calc(50% - 60px);
diff --git a/packages/example-app-base/src/components/ExampleCard/ExampleCard.scss b/packages/example-app-base/src/components/ExampleCard/ExampleCard.scss
index 0b8a621a8c980..287b5b4e4fd27 100644
--- a/packages/example-app-base/src/components/ExampleCard/ExampleCard.scss
+++ b/packages/example-app-base/src/components/ExampleCard/ExampleCard.scss
@@ -23,7 +23,7 @@
     @include float(right);
 
     .ms-Button.ExampleCard-codeButton {
-      @include margin-right(0);
+      @include ms-margin-right(0);
       background: none;
       border: 1px solid $ms-color-neutralTertiary;
       border-bottom: 0;
@@ -32,7 +32,7 @@
       line-height: 1;
       padding: 4px 12px;
       min-width: 100px;
-      transition: border $ms-duration3 $ms-ease1;
+      transition: border $ms-animation-duration-3 $ms-animation-ease-1;
 
       .ms-Button-label {
         color: $ms-color-neutralDark;
@@ -73,7 +73,7 @@
       margin: 0;
       max-height: 0;
       overflow: auto;
-      transition: all $ms-duration3 $ms-ease1;
+      transition: all $ms-animation-duration-3 $ms-animation-ease-1;
     }
 
     code {
@@ -105,7 +105,7 @@
   .ExampleCard-dos {
     width: calc(50% - 50px);
     display: inline-block;
-    @include margin-right(50px);
+    @include ms-margin-right(50px);
 
     h4 {
       @include ms-font-l;
diff --git a/packages/example-app-base/src/components/Header/Header.scss b/packages/example-app-base/src/components/Header/Header.scss
index 3abe9d817610e..188d142840485 100644
--- a/packages/example-app-base/src/components/Header/Header.scss
+++ b/packages/example-app-base/src/components/Header/Header.scss
@@ -13,7 +13,7 @@ $Header-fabricWebsiteHeaderColor: #272630;
     user-select: none;
   }
 
-  @media (max-width: $ms-screen-lg-max) {
+  @media (max-width: $ms-screen-max-lg) {
     .Header {
       padding: 0;
     }
@@ -66,7 +66,7 @@ $Header-fabricWebsiteHeaderColor: #272630;
     }
   }
 
-  @media (max-width: $ms-screen-lg-max) {
+  @media (max-width: $ms-screen-max-lg) {
     .Header-button {
       margin: 0;
 
diff --git a/packages/office-ui-fabric-react/gulpfile.js b/packages/office-ui-fabric-react/gulpfile.js
index 1f58d20b0c127..2940e5088f08b 100644
--- a/packages/office-ui-fabric-react/gulpfile.js
+++ b/packages/office-ui-fabric-react/gulpfile.js
@@ -74,10 +74,10 @@ build.postCopy.setConfig({
   shouldFlatten: false,
   copyTo: {
     [path.join(distFolder, 'sass')]: [
-      'node_modules/office-ui-fabric-core/dist/sass/*.*'
+      'node_modules/office-ui-fabric-core/dist/sass/**/*.*'
     ],
     [path.join(distFolder, 'css')]: [
-      'node_modules/office-ui-fabric-core/dist/css/*.*'
+      'node_modules/office-ui-fabric-core/dist/css/**/*.*'
     ]
   }
 });
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index c4a4de81be473..943d4679a91c3 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -45,7 +45,7 @@
     "mocha": "^3.2.0",
     "mocha-loader": "^1.1.1",
     "node-sass": "^4.5.0",
-    "office-ui-fabric-core": ">=5.0.0 <6.0.0",
+    "office-ui-fabric-core": ">=7.0.0 <8.0.0",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
     "postcss-loader": "^1.3.3",
     "raw-loader": "^0.5.1",
@@ -75,4 +75,4 @@
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/common/_common.scss b/packages/office-ui-fabric-react/src/common/_common.scss
index a047d898ca167..a135ab74ac2e3 100644
--- a/packages/office-ui-fabric-react/src/common/_common.scss
+++ b/packages/office-ui-fabric-react/src/common/_common.scss
@@ -1,4 +1,4 @@
-@import '~office-ui-fabric-core/dist/sass/Fabric.Common';
+@import '~office-ui-fabric-core/dist/sass/References';
 @import './i18n';
 @import './themeOverrides';
 @import './focusBorder';
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss
index f0a5039f19f4b..7faf7819e54a1 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss
@@ -15,7 +15,6 @@ $Breadcrumb-itemMaxWidth-sm: 116px;
 $Breadcrumb-chevron-sm: 8px;
 
 .root {
-  @include ms-baseFont;
   margin: 23px 0 1px;
 }
 
@@ -110,7 +109,7 @@ $Breadcrumb-chevron-sm: 8px;
   outline: transparent;
 }
 
-@media screen and (max-width: $ms-screen-md-max) {
+@media screen and (max-width: $ms-screen-max-md) {
   // margin: 11px 0 1px;
 
   .listItem .itemLink {
@@ -129,7 +128,7 @@ $Breadcrumb-chevron-sm: 8px;
   }
 }
 
-@media screen and (max-width: $ms-screen-sm-max) {
+@media screen and (max-width: $ms-screen-max-sm) {
   .listItem .itemLink {
     font-size: $ms-font-size-m;
     max-width: $Breadcrumb-itemMaxWidth-sm;
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.scss b/packages/office-ui-fabric-react/src/components/Button/BaseButton.scss
index 1c74b3f885c78..d57ee78483446 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.scss
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.scss
@@ -13,5 +13,5 @@
 }
 
 .screenReaderOnly {
-  @include ms-u-screenReaderOnly;
+  @include ms-screenReaderOnly;
 }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
index af3195264ccc2..14f710630ef7d 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
@@ -10,7 +10,7 @@ $Calendar-day:40px;
 $Calendar-dayPicker-margin: 10px;
 
 .root {
-  @include ms-u-normalize;
+  @include ms-normalize;
   margin-bottom: 17px;
 }
 
@@ -25,7 +25,7 @@ $Calendar-dayPicker-margin: 10px;
 // The holder is the only "scrollable" top-level container element.
 .holder {
   -webkit-overflow-scrolling: touch;
-  @include ms-u-borderBox;
+  @include ms-borderBox;
   background: $ms-color-white;
   min-width: 300px;
   display: none;
@@ -34,8 +34,7 @@ $Calendar-dayPicker-margin: 10px;
 
 // When the picker opens, reveal the content.
 .picker.pickerIsOpened .holder {
-  @include ms-u-slideDownIn10;
-  @include ms-u-borderBox;
+  @include ms-borderBox;
   display: block;
 }
 
@@ -184,14 +183,14 @@ $Calendar-dayPicker-margin: 10px;
 .monthComponents {
   position: absolute;
   top: 9px;
-  @include right(9px);
-  @include left(9px);
+  @include ms-right(9px);
+  @include ms-left(9px);
 }
 
 .yearComponents,
 .decadeComponents {
   position: absolute;
-  @include right(10px);
+  @include ms-right(10px);
   top: -2px;
 }
 
@@ -224,7 +223,7 @@ $Calendar-dayPicker-margin: 10px;
 // button is necessary to toggle the month view.
 .headerToggleView {
   height: $Calendar-day;
-  @include left(0px);
+  @include ms-left(0px);
   position: absolute;
   top: 0px;
   width: 140px;
@@ -300,7 +299,7 @@ $Calendar-dayPicker-margin: 10px;
   line-height: 30px;
   padding: 0 10px;
   position: absolute !important;
-  @include right(3px);
+  @include ms-right(3px);
 
   &:hover {
     outline: 1px solid transparent;
@@ -397,7 +396,7 @@ $Calendar-dayPicker-margin: 10px;
     }
     // Contains the calendar view for picking a day.
     .dayPicker {
-      @include ms-u-borderBox;
+      @include ms-borderBox;
       @include border-right(1px, solid, $ms-color-neutralLight);
       width: 220px;
       min-height: ( $Calendar-day * 8 ) - $Calendar-dayPicker-margin;
@@ -415,7 +414,7 @@ $Calendar-dayPicker-margin: 10px;
     .monthPicker,
     .yearPicker {
       top: 9px;
-      @include left(238px);
+      @include ms-left(238px);
       position: absolute;
     }
     // Size and position of the month and year labels.
@@ -458,12 +457,12 @@ $Calendar-dayPicker-margin: 10px;
     }
     // Position the "Go to today" button below the month picker.
     .goToday {
-      @include ms-u-borderBox;
+      @include ms-borderBox;
       font-size: 12px;
       height: $Calendar-day;
       line-height: $Calendar-day;
       padding: 0 10px;
-      @include right(3px);
+      @include ms-right(3px);
       @include text-align(right);
       top: 199px;
     }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index 898e8b7a1e5a5..824932fcc6bca 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -93,7 +93,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
           styles.pickerIsFocused,
           isMonthPickerVisible && ('is-monthPickerVisible ' + styles.pickerIsMonthPickerVisible)
         ) } >
-          <div className={ css('ms-DatePicker-holder', styles.holder) } onKeyDown={ this._onDatePickerPopupKeyDown }>
+          <div className={ css('ms-DatePicker-holder ms-slideDownIn10', styles.holder) } onKeyDown={ this._onDatePickerPopupKeyDown }>
             <div className={ css('ms-DatePicker-frame', styles.frame) }>
               <div className={ css('ms-DatePicker-wrap', styles.wrap) }>
                 <CalendarDay
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
index ad1cba8cd3c96..6c1efa75ecaea 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
@@ -22,8 +22,7 @@ $Callout-smallbeak-slant-width: 16px;
 }
 
 .root {
-  @include ms-baseFont;
-  @include drop-shadow(0,0, 5px, 0px);
+  @include ms-drop-shadow(0,0, 5px, 0px);
   position: absolute;
   border: 1px solid $ms-color-neutralLight;
   box-sizing: border-box;
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index eb7c3878ffc9e..c6d7fdbf3da55 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -122,7 +122,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       backgroundColor: backgroundColor,
     };
 
-    let directionalClassName = positions && positions.directionalClassName ? `ms-u-${positions.directionalClassName}` : '';
+    let directionalClassName = positions && positions.directionalClassName ? `ms-${positions.directionalClassName}` : '';
 
     let contentMaxHeight: number = this._getMaxHeight();
     let beakVisible: boolean = isBeakVisible && (!!targetElement || !!target);
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.scss b/packages/office-ui-fabric-react/src/components/Check/Check.scss
index 87472a3633a3c..267f6c9fa53b1 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.scss
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.scss
@@ -15,7 +15,7 @@ $checkBoxHeight: 24px;
   height: $checkBoxHeight;
   vertical-align: top;
   position: relative;
-  @include user-select(none);
+  @include ms-user-select(none);
 
   &.rootIsChecked {
     .background {
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.scss b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.scss
index e83a7397a2b01..c02ce06b859db 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.scss
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.scss
@@ -35,7 +35,6 @@ $ms-checkbox-highContrast-iconBoxSize: 16px;
 .root {
   box-sizing: border-box;
   color: $ms-color-neutralPrimary;
-  font-family: $ms-font-family-base;
   font-size: $ms-font-size-m;
   font-weight: $ms-font-weight-regular;
   min-height: 36px;
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
index 15361c74eac12..ecf5a710c3152 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
@@ -38,7 +38,6 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
 //
 
 .root {
-  @include ms-baseFont;
   margin-bottom: 4px;
 }
 
@@ -47,18 +46,17 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
   align-items: center;
   box-sizing: border-box;
   color: $radioButton-text-color;
-  font-family: $ms-font-family-base;
   font-size: $ms-font-size-m;
   font-weight: $ms-font-weight-regular;
   min-height: 26px;
   border: none;
   position: relative;
   margin-top: 8px;
-  @include padding-left(8px);
+  @include ms-padding-left(8px);
 
   :global(.ms-Label) {
     font-size: $ms-font-size-m;
-    @include padding(0, 0, 0, 26px);
+    @include ms-padding(0, 0, 0, 26px);
     display: inline-block;
   }
 }
@@ -95,8 +93,8 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
   height: 0;
   border-radius: 50%;
   position: absolute;
-  @include left($ms-choiceField-field-size / 2);
-  @include right(0);
+  @include ms-left($ms-choiceField-field-size / 2);
+  @include ms-right(0);
   transition-property: top, left, right, width, height;
   transition-duration: $ms-choiceField-transition-duration-inner;
   transition-timing-function: $ms-choiceField-transition-timing;
@@ -148,7 +146,7 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
     &::after { // the dot
       background-color: $radioButton-dot-color;
       top: 4px;
-      @include left(5px);
+      @include ms-left(5px);
       width: 10px;
       height: 10px;
 
@@ -213,13 +211,10 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
 
 .choiceFieldIsImage, .choiceFieldIsIcon {
   $fieldPadding: 4px;
-
   display: inline-flex;
-
   font-size: 0;
-
-  @include margin(0, 4px, 4px, 0);
-  @include padding-left(0px);
+  @include ms-margin(0, 4px, 4px, 0);
+  @include ms-padding-left(0px);
   @include ms-bgColor-neutralLighter;
 
   .fieldIsImage, .fieldIsIcon {
@@ -271,14 +266,12 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
 
     .labelWrapper {
       $lineHeight: 16px;
-
       display: inline-block;
       position: relative;
       margin: 4px 0 0 0;
       height: $lineHeight * 2;
       line-height: $lineHeight;
       overflow-y: hidden;
-
       @include ms-font-m;
 
       :global(.ms-Label) {
@@ -288,15 +281,15 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
 
     &::before {
       top: $radioButtonSpacing;
-      @include right($radioButtonSpacing);
-      @include left(auto); // To reset the value of 'left' to its default value, so that 'right' works
+      @include ms-right($radioButtonSpacing);
+      @include ms-left(auto); // To reset the value of 'left' to its default value, so that 'right' works
       opacity: 0;
     }
 
     &::after {
       top: $radioButtonSpacing + ($radioButtonInnerSize * 2);
-      @include right($radioButtonSpacing + ($radioButtonInnerSize * 2));
-      @include left(auto); // To reset the value of 'left' to its default value, so that 'right' works
+      @include ms-right($radioButtonSpacing + ($radioButtonInnerSize * 2));
+      @include ms-left(auto); // To reset the value of 'left' to its default value, so that 'right' works
     }
 
     &:not(.fieldIsDisabled) {
@@ -319,7 +312,7 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
 
         &::after {
           top: $radioButtonSpacing + $radioButtonInnerSize;
-          @include right($radioButtonSpacing + $radioButtonInnerSize);
+          @include ms-right($radioButtonSpacing + $radioButtonInnerSize);
         }
 
         &:hover,
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss
index e56900563229a..ff4e5b8c8d04f 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss
@@ -60,7 +60,7 @@ $SearchBox-sidePadding: 8px; // padding in input on left and right sides without
 
 .sideCommands {
   position: absolute;
-  @include right(0px);
+  @include ms-right(0px);
   @include text-align(right);
   @include padding-right(20px);
 }
@@ -281,14 +281,14 @@ $SearchBox-sidePadding: 8px; // padding in input on left and right sides without
 .searchIconSearchWrapper,
 .searchIconArrowWrapper {
   top: 0;
-  @include padding-left(17px);
+  @include ms-padding-left(17px);
   @include padding-right(8px);
 }
 
 .searchIconClearWrapper {
   display: none;
   top: 1px;
-  @include right(0px);
+  @include ms-right(0px);
   z-index: $ms-zIndex-front;
 }
 
@@ -308,7 +308,6 @@ $SearchBox-sidePadding: 8px; // padding in input on left and right sides without
 
 .searchInput,
 .searchInput::-webkit-input-placeholder {
-  @include ms-baseFont;
   font-size: $ms-font-size-m;
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss
index a6b6cebd04ec7..f336ba04fec8e 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss
@@ -12,11 +12,11 @@
   line-height: 20px;
   pointer-events: none;
   position: absolute;
-  @include right(9px);
+  @include ms-right(9px);
 }
 
 .root {
-  @include ms-u-normalize;
+  @include ms-normalize;
   margin-bottom: 17px;
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
index c8857b5a7cf02..8dc4ae5d20444 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
@@ -134,7 +134,7 @@ $resizerColor: $ms-color-neutralTertiaryAlt;
 
 .cell .filterChevron {
   color: $dropdownChevronForegroundColor;
-  @include padding-left(4px);
+  @include ms-padding-left(4px);
   vertical-align: middle;
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index 71fd64fac7b6d..a8ad69859e9f3 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -188,7 +188,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
         ref='root'
         role='row'
         aria-label={ ariaLabel }
-        className={ css('ms-DetailsRow ms-u-fadeIn400', styles.root, droppingClassName, {
+        className={ css('ms-DetailsRow ms-fadeIn400', styles.root, droppingClassName, {
           ['is-contentUnselectable ' + styles.rootIsContentUnselectable]: isContentUnselectable,
           ['is-selected ' + styles.rootIsSelected]: isSelected,
           ['is-check-visible ' + styles.rootIsCheckVisible]: checkboxVisibility === CheckboxVisibility.always
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.scss b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.scss
index ea233f35973ce..6af7f90936b34 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.scss
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.scss
@@ -45,7 +45,7 @@ $Dialog-default-max-width: 340px;
   margin: 0;
   @include ms-font-xl;
   color: $ms-color-neutralPrimary;
-  @include padding(20px, 36px, 20px, 28px);
+  @include ms-padding(20px, 36px, 20px, 28px);
 }
 
 .topButton {
@@ -54,8 +54,8 @@ $Dialog-default-max-width: 340px;
   flex-wrap: nowrap;
   position: absolute;
   top: 0;
-  @include right(0);
-  @include padding(12px, 12px, 0, 0);
+  @include ms-right(0);
+  @include ms-padding(12px, 12px, 0, 0);
   > * {
     flex: 0 0 auto;
   }
@@ -100,8 +100,8 @@ $Dialog-default-max-width: 340px;
 // Negative margin to needed to compensate for symmetric
 // padding between action elements.
 .actionsRight {
-  @include text-align(right);
-  @include margin-right(-4px);
+  @include ms-text-align(right);
+  @include ms-margin-right(-4px);
   font-size: 0;
 
   // Reset spacing for first button
@@ -150,7 +150,7 @@ $Dialog-default-max-width: 340px;
   }
 }
 
-@media (min-width: $ms-screen-md-min) {
+@media (min-width: $ms-screen-min-md) {
   // Allow wider dialog on larger screens
   .main {
     width: auto;
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.scss b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.scss
index d777eb3270114..f76099f814a85 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.scss
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.scss
@@ -88,7 +88,7 @@ $ms-DocumentCardActions-verticalPadding: 4px;
 
 .action {
   @include float(left);
-  @include margin-right(4px);
+  @include ms-margin-right(4px);
   color: $ms-color-neutralSecondary;
   cursor: pointer;
 
@@ -111,7 +111,7 @@ $ms-DocumentCardActions-verticalPadding: 4px;
   line-height: $ms-DocumentCardActions-actionSize;
 
   :global(.ms-Icon) {
-    @include margin-right(4px);
+    @include ms-margin-right(4px);
     font-size: $ms-icon-size-m;
     vertical-align: top;
   }
@@ -135,7 +135,7 @@ $ms-DocumentCardActivity-personaTextGutter: 8px;
   }
 
   .activityDetails {
-    @include left($ms-DocumentCardActivity-horizontalPadding + ($ms-DocumentCardActivity-imageSize * 1.5) + $ms-DocumentCardActivity-personaTextGutter);
+    @include ms-left($ms-DocumentCardActivity-horizontalPadding + ($ms-DocumentCardActivity-imageSize * 1.5) + $ms-DocumentCardActivity-personaTextGutter);
   }
 }
 
@@ -165,7 +165,7 @@ $ms-DocumentCardActivity-personaTextGutter: 8px;
 }
 
 .activityDetails {
-  @include left($ms-DocumentCardActivity-horizontalPadding + $ms-DocumentCardActivity-imageSize + $ms-DocumentCardActivity-personaTextGutter);
+  @include ms-left($ms-DocumentCardActivity-horizontalPadding + $ms-DocumentCardActivity-imageSize + $ms-DocumentCardActivity-personaTextGutter);
   height: $ms-DocumentCardActivity-imageSize;
   position: absolute;
   top: $ms-DocumentCardActivity-verticalPadding;
@@ -221,7 +221,7 @@ $ms-DocumentCardActivity-personaTextGutter: 8px;
 }
 
 .icon {
-  @include left(10px);
+  @include ms-left(10px);
   bottom: 10px;
   position: absolute;
 }
@@ -236,7 +236,7 @@ $ms-DocumentCardActivity-personaTextGutter: 8px;
     line-height: 16px; // Vertically center the text
     margin-bottom: 8px;
     overflow: hidden;
-    @include padding-left(24px); // Make room for icon
+    @include ms-padding-left(24px); // Make room for icon
     position: relative;
     text-overflow: ellipsis;
     white-space: nowrap;
@@ -254,7 +254,7 @@ $ms-DocumentCardActivity-personaTextGutter: 8px;
 }
 
 .fileListIcon {
-  @include left(0);
+  @include ms-left(0);
   position: absolute;
   top: 0;
 }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
index af71ac7072846..8b0c1dd5cc9c8 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
@@ -34,7 +34,7 @@ $DropDown-item-height: 36px;
 }
 
 .root {
-  @include ms-u-normalize;
+  @include ms-normalize;
   @include ms-font-m;
   color: $ms-color-neutralPrimary;
 
@@ -138,7 +138,7 @@ $DropDown-item-height: 36px;
   font-size: $ms-icon-size-s;
   position: absolute;
   top: 1px; // border
-  @include right(12px);
+  @include ms-right(12px);
   pointer-events: none;
   height: $DropDown-height;
   line-height: $DropDown-height - 2px; // height minus the border
@@ -146,7 +146,7 @@ $DropDown-item-height: 36px;
 
 // Style the new, replacement component
 .title {
-  @include ms-u-normalize;
+  @include ms-normalize;
   background: $ms-color-white;
   border: 1px solid $ms-color-neutralTertiaryAlt;
   cursor: pointer;
@@ -169,7 +169,7 @@ $DropDown-item-height: 36px;
 .panel {
     // Force drop shadow even under medium breakpoint
     :global(.ms-Panel-main) {
-      @include drop-shadow(-30px, 0px, 30px, -30px, .2);
+      @include ms-drop-shadow(-30px, 0px, 30px, -30px, .2);
     }
     // Remove padding as items have their own padding and bg
     :global(.ms-Panel-contentInner) {
diff --git a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
index e76d103fbb764..da54043ad17e9 100644
--- a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
+++ b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
@@ -51,7 +51,7 @@ export class Fabric extends BaseComponent<React.HTMLProps<HTMLDivElement>, IFabr
 
   public render() {
     const { isFocusVisible } = this.state;
-    const rootClass = css('ms-Fabric ms-font-m', this.props.className, {
+    const rootClass = css('ms-Fabric', this.props.className, {
       'is-focusVisible': isFocusVisible
     });
 
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.scss b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.scss
index 12949dd79e9dd..15ae30f0143fb 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.scss
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.scss
@@ -85,5 +85,5 @@ button.descriptiveOverflowButton {
 }
 
 .screenReaderOnly {
-  @include ms-u-screenReaderOnly;
+  @include ms-screenReaderOnly;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.scss b/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.scss
index d211d77d17ff3..6167d9c92733a 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.scss
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.scss
@@ -6,7 +6,6 @@
   cursor: pointer;
 
   :global(.ms-Link) {
-    @include ms-baseFont;
     font-size: $ms-font-size-s;
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss
index acac50b8f5c03..b5c5c5bc00c46 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss
@@ -79,7 +79,7 @@ $groupHeader-ease-in-back: cubic-bezier(0.600, -0.280, 0.735, 0.045);
   opacity: 0;
   padding: 0px 16px;
   vertical-align: middle;
-  transition: visibility $ms-duration3, opacity $ms-duration3;
+  transition: visibility $ms-animation-duration-3, opacity $ms-animation-duration-3;
 
   &.loadingIsVisible {
     visibility: visible;
@@ -91,10 +91,10 @@ $groupHeader-ease-in-back: cubic-bezier(0.600, -0.280, 0.735, 0.045);
   display: inline-block;
   position: relative;
   top: -16px;
-  @include left(-26px);
+  @include ms-left(-26px);
   font-size: $ms-icon-size-l;
   color: $ms-color-neutralSecondaryAlt;
-  transition: transform $ms-duration2 $groupHeader-ease-in-back, opacity $ms-duration4 $groupHeader-ease-out-sine;
+  transition: transform $ms-animation-duration-2 $groupHeader-ease-in-back, opacity $ms-animation-duration-4 $groupHeader-ease-out-sine;
   opacity: 0;
   transform: rotate(0.2deg) scale(0.65); // rotation prevents jittery motion in IE
   transform-origin: 10px 10px;
@@ -107,8 +107,8 @@ $groupHeader-ease-in-back: cubic-bezier(0.600, -0.280, 0.735, 0.045);
 :global(.ms-GroupedList-group.is-dropping) {
 
   > .root .dropIcon {
-      transition: transform $ms-duration4 $groupHeader-ease-out-circ, opacity $ms-duration1 $groupHeader-ease-out-sine;
-      transition-delay: $ms-duration3;
+      transition: transform $ms-animation-duration-4 $groupHeader-ease-out-circ, opacity $ms-animation-duration-1 $groupHeader-ease-out-sine;
+      transition-delay: $ms-animation-duration-3;
       opacity: 1;
       transform: rotate(0.2deg) scale(1); // rotation prevents jittery motion in IE
     }
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.scss b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.scss
index bf3c85c7458d4..a5e20cbbede1b 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.scss
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.scss
@@ -7,13 +7,12 @@ $groupList-ease-in-out-sine: cubic-bezier(0.445, 0.050, 0.550, 0.950);
   font-size: $ms-font-size-s;
 
   BUTTON {
-    font-family: inherit;
     background-color: transparent;
   }
 }
 
 .group {
-  transition: background-color $ms-duration2 $groupList-ease-in-out-sine;
+  transition: background-color $ms-animation-duration-2 $groupList-ease-in-out-sine;
 }
 
 .groupIsDropping {
diff --git a/packages/office-ui-fabric-react/src/components/Icon/IconName.ts b/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
index 7e3af1c075511..51f9ef149c5c2 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
@@ -1,9 +1,16 @@
 // Please keep alphabetized
 export type IconName =
+  // These icons are not in the font.
+  'CustomIcon' |
+  'None' |
+
+  // Icons from the Fabric MDL2 set.
   'AADLogo' |
   'Accept' |
   'AccessLogo' |
+  'AccessLogoFill' |
   'Accounts' |
+  'ActivityFeed' |
   'Add' |
   'AddEvent' |
   'AddFavorite' |
@@ -29,14 +36,17 @@ export type IconName =
   'AlarmClock' |
   'Album' |
   'AlbumRemove' |
-  'AlchemyLogo' |
   'AlignCenter' |
   'AlignLeft' |
   'AlignRight' |
+  'AnalyticsLogo' |
+  'AnalyticsQuery' |
+  'AnalyticsReport' |
   'AndroidLogo' |
   'Annotation' |
-  'AppForOfficeLogo' |
   'AppIconDefault' |
+  'Archive' |
+  'AreaChart' |
   'Arrivals' |
   'ArrowDownRight8' |
   'ArrowDownRightMirrored8' |
@@ -44,13 +54,16 @@ export type IconName =
   'ArrowUpRightMirrored8' |
   'Articles' |
   'Ascending' |
+  'AssessmentGroup' |
   'AssetLibrary' |
+  'Assign' |
   'Asterisk' |
   'ATPLogo' |
   'Attach' |
   'AustralianRules' |
   'AutoEnhanceOff' |
   'AutoEnhanceOn' |
+  'AutoFillTemplate' |
   'AutoRacing' |
   'AwayStatus' |
   'AzureLogo' |
@@ -60,6 +73,7 @@ export type IconName =
   'Balloons' |
   'BarChart4' |
   'BarChartHorizontal' |
+  'BarChartVertical' |
   'Baseball' |
   'BidiLtr' |
   'BidiRtl' |
@@ -68,21 +82,37 @@ export type IconName =
   'Blocked' |
   'Blocked2' |
   'BlowingSnow' |
+  'Blur' |
   'Boards' |
   'Bold' |
   'BookingsLogo' |
   'Bookmarks' |
   'BookmarksMirrored' |
   'BoxLogo' |
+  'BranchCommit' |
+  'BranchCompare' |
   'BranchFork' |
+  'BranchFork2' |
+  'BranchLocked' |
+  'BranchMerge' |
+  'BranchPullRequest' |
+  'BranchSearch' |
+  'BranchShelveset' |
   'Breadcrumb' |
   'Brightness' |
   'Broom' |
+  'BucketColor' |
+  'BucketColorFill' |
   'BufferTimeAfter' |
   'BufferTimeBefore' |
   'BufferTimeBoth' |
+  'Build' |
+  'BuildIssue' |
+  'BuildQueue' |
+  'BuildQueueNew' |
   'BulletedList' |
   'BulletedListMirrored' |
+  'BusinessHoursSign' |
   'BusSolid' |
   'Cafe' |
   'Cake' |
@@ -98,6 +128,7 @@ export type IconName =
   'CaloriesAdd' |
   'Camera' |
   'Cancel' |
+  'CannedChat' |
   'Car' |
   'CaretBottomLeftSolid8' |
   'CaretBottomRightSolid8' |
@@ -107,10 +138,16 @@ export type IconName =
   'CaretHollowMirrored' |
   'CaretLeft8' |
   'CaretLeftSolid8' |
+  'CaretRight' |
   'CaretRight8' |
   'CaretRightSolid8' |
   'CaretSolid' |
+  'CaretSolid16' |
+  'CaretSolidDown' |
+  'CaretSolidLeft' |
   'CaretSolidMirrored' |
+  'CaretSolidRight' |
+  'CaretSolidUp' |
   'CaretTopLeftSolid8' |
   'CaretTopRightSolid8' |
   'CaretUp8' |
@@ -123,6 +160,7 @@ export type IconName =
   'ChatInviteFriend' |
   'Checkbox' |
   'CheckboxComposite' |
+  'CheckboxCompositeReversed' |
   'CheckboxIndeterminate' |
   'CheckList' |
   'CheckMark' |
@@ -146,16 +184,18 @@ export type IconName =
   'CircleHalfFull' |
   'CirclePlus' |
   'CircleRing' |
-  'ClassNotebookLogo' |
+  'ClassNotebookLogoInverse' |
   'ClassroomLogo' |
   'Clear' |
   'ClearFilter' |
   'ClearFormatting' |
   'ClearNight' |
   'Clock' |
+  'CloneToDesktop' |
   'ClosedCaption' |
   'ClosePane' |
   'ClosePaneMirrored' |
+  'Cloud' |
   'CloudAdd' |
   'CloudDownload' |
   'CloudUpload' |
@@ -164,12 +204,19 @@ export type IconName =
   'Cocktails' |
   'Code' |
   'Coffee' |
-  'CollabsDBLogo' |
+  'CollapseContent' |
+  'CollapseContentSingle' |
   'CollapseMenu' |
   'CollegeFootball' |
   'CollegeHoops' |
   'Color' |
+  'ColumnLeftTwoThirds' |
+  'ColumnOptions' |
+  'ColumnRightTwoThirds' |
   'Combine' |
+  'Comment' |
+  'CommentUrgent' |
+  'Communications' |
   'CompassNW' |
   'Completed' |
   'CompletedSolid' |
@@ -180,11 +227,14 @@ export type IconName =
   'Copy' |
   'Cotton' |
   'Cricket' |
+  'CRMReport' |
   'CSS' |
-  'CustomIcon' |
   'CustomList' |
   'CustomListMirrored' |
+  'Cut' |
   'Cycling' |
+  'DataBarsFill' |
+  'Database' |
   'DataConnectionLibrary' |
   'DateTime' |
   'DateTime2' |
@@ -194,6 +244,9 @@ export type IconName =
   'DelveAnalytics' |
   'DelveAnalyticsLogo' |
   'DelveLogo' |
+  'DelveLogoFill' |
+  'DelveLogoInverse' |
+  'Deploy' |
   'Descending' |
   'Design' |
   'DeveloperTools' |
@@ -202,13 +255,15 @@ export type IconName =
   'Dialpad' |
   'Dictionary' |
   'DietPlanNotebook' |
+  'DiffInline' |
+  'DiffSideBySide' |
   'DisableUpdates' |
   'Dislike' |
   'DockLeft' |
   'DockLeftMirrored' |
   'DockRight' |
   'DocLibrary' |
-  'DocsLogo' |
+  'DocsLogoInverse' |
   'Document' |
   'Documentation' |
   'DocumentReply' |
@@ -226,6 +281,7 @@ export type IconName =
   'DoubleChevronRight12' |
   'DoubleChevronUp' |
   'DoubleChevronUp12' |
+  'DoubleColumn' |
   'Down' |
   'Download' |
   'DRM' |
@@ -258,8 +314,16 @@ export type IconName =
   'EventInfo' |
   'ExcelDocument' |
   'ExcelLogo' |
+  'ExcelLogoFill' |
+  'ExcelLogoInverse' |
   'ExchangeLogo' |
+  'ExchangeLogoFill' |
+  'ExchangeLogoInverse' |
   'ExpandMenu' |
+  'ExploreContent' |
+  'ExploreContentSingle' |
+  'Export' |
+  'ExportMirrored' |
   'FabricAssetLibrary' |
   'FabricDataConnectionLibrary' |
   'FabricDocLibrary' |
@@ -280,22 +344,32 @@ export type IconName =
   'FacebookLogo' |
   'Family' |
   'FangBody' |
+  'FastForward' |
+  'Favicon' |
   'FavoriteList' |
   'FavoriteStar' |
   'FavoriteStarFill' |
   'Fax' |
   'Ferry' |
   'FerrySolid' |
+  'FileBug' |
+  'FileCode' |
+  'FileComment' |
+  'FileImage' |
+  'FileSymlink' |
   'Filter' |
   'Filters' |
   'Financial' |
   'Fingerprint' |
+  'FiveTileGrid' |
   'Flag' |
+  'FlameSolid' |
   'FlickDown' |
   'FlickLeft' |
   'FlickRight' |
   'FlickUp' |
   'Flow' |
+  'FocalPoint' |
   'Fog' |
   'Folder' |
   'FolderFill' |
@@ -314,9 +388,11 @@ export type IconName =
   'Freezing' |
   'Frigid' |
   'FullCircleMask' |
+  'FullHistory' |
   'FullScreen' |
   'Generate' |
   'Giftbox' |
+  'GiftboxOpen' |
   'GiftCard' |
   'Glasses' |
   'Glimmer' |
@@ -326,6 +402,7 @@ export type IconName =
   'Golf' |
   'GoogleDriveLogo' |
   'GotoToday' |
+  'GripperBarVertical' |
   'GripperTool' |
   'Group' |
   'GroupedAscending' |
@@ -334,6 +411,7 @@ export type IconName =
   'HailDay' |
   'HailNight' |
   'Handwriting' |
+  'HardDriveGroup' |
   'Header1' |
   'Header2' |
   'Header3' |
@@ -346,18 +424,26 @@ export type IconName =
   'HelpMirrored' |
   'Hide' |
   'Hide2' |
+  'Highlight' |
+  'HighlightMappedShapes' |
   'History' |
   'Home' |
   'HomeSolid' |
   'Hospital' |
   'Hotel' |
+  'IconSetsFlag' |
+  'IconSetsFlagFill' |
+  'ImageDiff' |
+  'ImagePixel' |
   'Important' |
   'InboxCheck' |
   'IncidentTriangle' |
   'IncreaseIndentLegacy' |
   'Info' |
   'Info2' |
+  'InfoSolid' |
   'InsertTextBox' |
+  'InstallToDrive' |
   'InternetSharing' |
   'iOSAppStoreLogo' |
   'IssueTracking' |
@@ -376,6 +462,7 @@ export type IconName =
   'Lightbulb' |
   'LightningBolt' |
   'Like' |
+  'LineChart' |
   'Link' |
   'List' |
   'ListMirrored' |
@@ -384,6 +471,8 @@ export type IconName =
   'LocationDot' |
   'LocationFill' |
   'Lock' |
+  'LockSolid' |
+  'LogRemove' |
   'LowerBrightness' |
   'LyncLogo' |
   'Mail' |
@@ -406,6 +495,7 @@ export type IconName =
   'Megaphone' |
   'Memo' |
   'Merge' |
+  'MergeDuplicate' |
   'Message' |
   'MessageFill' |
   'Microphone' |
@@ -418,40 +508,52 @@ export type IconName =
   'Move' |
   'MoveToFolder' |
   'MSNLogo' |
+  'MSNVideos' |
   'MultiSelect' |
   'MultiSelectMirrored' |
   'MusicInCollection' |
   'MusicInCollectionFill' |
   'MusicNote' |
   'Nav2DMapView' |
+  'NetworkTower' |
+  'NewAnalyticsQuery' |
   'NewFolder' |
   'News' |
-  'None' |
+  'Next' |
   'NoteForward' |
   'NotePinned' |
   'NoteReply' |
   'NumberedList' |
   'NumberField' |
+  'OfficeAddinsLogo' |
   'OfficeAssistantLogo' |
   'OfficeFormLogo' |
   'OfficeLogo' |
   'OfficeStoreLogo' |
   'OfficeVideoLogo' |
+  'OfficeVideoLogoFill' |
+  'OfficeVideoLogoInverse' |
   'OfflineOneDriveParachute' |
   'OfflineOneDriveParachuteDisabled' |
   'OneDrive' |
   'OneDriveAdd' |
-  'OneNoteEduLogo' |
+  'OneNoteEduLogoInverse' |
   'OneNoteLogo' |
+  'OneNoteLogoFill' |
+  'OneNoteLogoInverse' |
   'OpenFile' |
   'OpenFolderHorizontal' |
   'OpenInNewWindow' |
   'OpenPane' |
   'OpenPaneMirrored' |
+  'OpenSource' |
   'Org' |
   'OutlookLogo' |
+  'OutlookLogoFill' |
+  'OutlookLogoInverse' |
   'OutOfOffice' |
   'Package' |
+  'Packages' |
   'Page' |
   'PageAdd' |
   'PageCheckedin' |
@@ -460,10 +562,12 @@ export type IconName =
   'PageRight' |
   'PageSolid' |
   'PanoIndicator' |
+  'Parameter' |
   'ParatureLogo' |
   'PartlyCloudyDay' |
   'PartlyCloudyNight' |
   'PartyLeader' |
+  'Paste' |
   'Pause' |
   'PaymentCard' |
   'PC1' |
@@ -476,6 +580,7 @@ export type IconName =
   'PeoplePause' |
   'PeopleRepeat' |
   'Permissions' |
+  'Personalize' |
   'Phone' |
   'Photo2' |
   'Photo2Add' |
@@ -484,13 +589,19 @@ export type IconName =
   'Picture' |
   'PictureLibrary' |
   'PieDouble' |
+  'PieSingle' |
   'Pill' |
   'Pin' |
   'Pinned' |
   'PinnedFill' |
-  'Planner' |
+  'PivotChart' |
+  'PlannerLogo' |
   'Play' |
   'PlayerSettings' |
+  'Plug' |
+  'PlugConnected' |
+  'PlugDisconnected' |
+  'PlugSolid' |
   'POI' |
   'PostUpdate' |
   'PowerApps' |
@@ -499,40 +610,53 @@ export type IconName =
   'PowerBILogo' |
   'PowerPointDocument' |
   'PowerPointLogo' |
+  'PowerPointLogoFill' |
+  'PowerPointLogoInverse' |
   'Precipitation' |
   'PresenceChickletVideo' |
   'Preview' |
   'PreviewLink' |
+  'Previous' |
   'Print' |
   'PrintfaxPrinterFile' |
+  'Processing' |
+  'ProcessMetaTask' |
   'Product' |
   'ProFootball' |
+  'ProgressRingDots' |
   'ProHockey' |
-  'ProjectLogo' |
+  'ProjectLogoInverse' |
   'ProtectedDocument' |
+  'ProtectRestrict' |
   'PublicCalendar' |
   'PublicContactCard' |
   'PublicEmail' |
   'PublicFolder' |
+  'PublisherLogo' |
+  'PublisherLogoFill' |
   'Puzzle' |
   'Questionnaire' |
   'QuestionnaireMirrored' |
   'QuickNote' |
+  'RadioBtnOff' |
   'RadioBtnOn' |
   'RadioBullet' |
   'Rain' |
   'RainShowersDay' |
   'RainShowersNight' |
   'RainSnow' |
+  'RawSource' |
   'Read' |
   'ReadingMode' |
   'ReceiptCheck' |
   'ReceiptForward' |
   'ReceiptReply' |
   'Recent' |
+  'Record2' |
   'RecurringEvent' |
   'RecurringTask' |
   'RecycleBin' |
+  'Redeploy' |
   'RedEye' |
   'Redo' |
   'Refresh' |
@@ -555,27 +679,40 @@ export type IconName =
   'ReportLibraryMirrored' |
   'ReturnToSession' |
   'RevToggleKey' |
+  'Rewind' |
   'Ribbon' |
   'RightDoubleQuote' |
   'Ringer' |
+  'Robot' |
   'Room' |
   'Rotate' |
+  'RowsChild' |
+  'RowsGroup' |
   'Rugby' |
   'Running' |
   'Sad' |
   'Save' |
+  'SaveAll' |
   'SaveAs' |
+  'ScheduleEventAction' |
+  'Script' |
+  'ScrollUpDown' |
   'Search' |
   'Section' |
   'Sections' |
   'SecurityGroup' |
   'Send' |
   'SendMirrored' |
+  'Server' |
+  'ServerEnviroment' |
+  'ServerProcesses' |
   'SetAction' |
   'Settings' |
   'Share' |
   'ShareiOS' |
   'SharepointLogo' |
+  'SharepointLogoFill' |
+  'SharepointLogoInverse' |
   'Shield' |
   'Shop' |
   'ShoppingCart' |
@@ -583,17 +720,20 @@ export type IconName =
   'ShowResultsMirrored' |
   'SidePanel' |
   'SingleBookmark' |
+  'SingleColumn' |
   'SIPMove' |
   'SkypeCheck' |
   'SkypeCircleCheck' |
   'SkypeCircleClock' |
   'SkypeCircleMinus' |
   'SkypeClock' |
+  'SkypeForBusinessLogoFill' |
   'SkypeLogo' |
   'SkypeMessage' |
   'SkypeMinus' |
   'SliderThumb' |
   'Snow' |
+  'Snowflake' |
   'SnowShowerDay' |
   'SnowShowerNight' |
   'Soccer' |
@@ -606,15 +746,26 @@ export type IconName =
   'SpeedHigh' |
   'Split' |
   'Squalls' |
+  'StackedBarChart' |
+  'StackedLineChart' |
   'StackIndicator' |
   'Starburst' |
   'StatusErrorFull' |
   'StatusTriangle' |
+  'Step' |
+  'StepInsert' |
+  'StepShared' |
+  'StepSharedAdd' |
+  'StepSharedInsert' |
   'StockDown' |
   'StockUp' |
+  'Stop' |
+  'StopSolid' |
   'Stopwatch' |
   'StoreLogo' |
   'StoreLogoMed' |
+  'Storyboard' |
+  'Streaming' |
   'Strikethrough' |
   'Subscribe' |
   'Subscript' |
@@ -623,7 +774,7 @@ export type IconName =
   'Sunny' |
   'SunQuestionMark' |
   'Superscript' |
-  'SwayLogo' |
+  'SwayLogoInverse' |
   'Switch' |
   'SwitcherStartEnd' |
   'Sync' |
@@ -637,10 +788,16 @@ export type IconName =
   'Tag' |
   'TaskManager' |
   'TaskManagerMirrored' |
+  'TeamsLogo' |
+  'TeamsLogoFill' |
+  'TeamsLogoInverse' |
   'Teamwork' |
   'TemporaryUser' |
   'Tennis' |
   'TextBox' |
+  'TextCallout' |
+  'TextCalloutFill' |
+  'TextDocument' |
   'TextField' |
   'ThumbnailView' |
   'ThumbnailViewMirrored' |
@@ -661,11 +818,15 @@ export type IconName =
   'TriangleDown12' |
   'TriangleLeft12' |
   'TriangleRight12' |
+  'TriangleSolid' |
   'TriangleSolidDown12' |
   'TriangleSolidLeft12' |
   'TriangleSolidRight12' |
   'TriangleSolidUp12' |
   'TriangleUp12' |
+  'TriggerAuto' |
+  'TriggerUser' |
+  'TripleColumn' |
   'Trophy' |
   'TurnRight' |
   'TVMonitor' |
@@ -673,19 +834,32 @@ export type IconName =
   'Underline' |
   'Undo' |
   'Unfavorite' |
+  'Unknown' |
   'UnknownCall' |
   'Unlock' |
+  'UnlockSolid' |
   'Unpin' |
   'Unsubscribe' |
   'UnsyncFolder' |
   'Up' |
   'Upload' |
+  'Variable' |
+  'VariableGroup' |
+  'VennDiagram' |
   'Video' |
   'VideoSolid' |
   'View' |
   'ViewAll' |
   'ViewAll2' |
+  'ViewDashboard' |
+  'ViewList' |
+  'ViewListGroup' |
+  'ViewListTree' |
+  'VisioDiagram' |
+  'VisioDocument' |
   'VisioLogo' |
+  'VisioLogoFill' |
+  'VisioLogoInverse' |
   'VoicemailForward' |
   'VoicemailReply' |
   'Volume0' |
@@ -697,13 +871,18 @@ export type IconName =
   'Warning' |
   'Website' |
   'Weights' |
+  'WifiEthernet' |
   'WindDirection' |
   'WindowsLogo' |
   'WipePhone' |
   'WordDocument' |
   'WordLogo' |
+  'WordLogoFill' |
+  'WordLogoInverse' |
   'Work' |
   'WorkFlow' |
+  'WorkItem' |
+  'WorkItemBug' |
   'WorldClock' |
   'YammerLogo' |
   'Zoom' |
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.scss b/packages/office-ui-fabric-react/src/components/Image/Image.scss
index 618f8ded9e085..12d4f2fd0e159 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.scss
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.scss
@@ -23,7 +23,7 @@
 .imageIsContain,
 .imageIsCover {
   position: relative;
-  @include left(50%);
+  @include ms-left(50%);
   top: 50%;
   // transform-translateX mixin is not used here because a transateY is also required.
   @include LTR {
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.tsx
index ecfe0d8f811c4..e30a3ee81f31a 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.tsx
@@ -111,7 +111,7 @@ export class Image extends BaseComponent<IImageProps, IImageState> {
                 'is-fadeIn': shouldFadeIn,
                 'is-notLoaded': !loaded,
                 ['is-loaded ' + styles.imageIsLoaded]: loaded,
-                'ms-u-fadeIn400': loaded && shouldFadeIn,
+                'ms-fadeIn400': loaded && shouldFadeIn,
                 'is-error': loadState === ImageLoadState.error,
                 ['ms-Image-image--scaleWidth ' + styles.imageIsScaleWidth]: (imageFit === undefined && !!width && !height),
                 ['ms-Image-image--scaleHeight ' + styles.imageIsScaleHeight]: (imageFit === undefined && !width && !!height),
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.scss b/packages/office-ui-fabric-react/src/components/Label/Label.scss
index 81fe55506c90d..1439a0861f9b9 100644
--- a/packages/office-ui-fabric-react/src/components/Label/Label.scss
+++ b/packages/office-ui-fabric-react/src/components/Label/Label.scss
@@ -11,7 +11,7 @@
 
 .root {
   @include ms-font-m;
-  @include ms-u-normalize;
+  @include ms-normalize;
   color: $ms-color-neutralPrimary;
   box-sizing: border-box;
   display: block;
diff --git a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
index 1a62c599de48b..d8c3ce7cbff7b 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
@@ -26,7 +26,7 @@ export class LayerContentExample extends BaseComponent<any, any> {
 
   public render() {
     return (
-      <div className='LayerExample-content ms-u-scaleUpIn100'>
+      <div className='LayerExample-content ms-scaleUpIn100'>
         <div className='LayerExample-textContent'>{ this.context.message }</div>
         <div>{ this.state.time }</div>
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
index ca09ce99cd651..4f91460d67023 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
@@ -16,7 +16,7 @@ export class LayerHostedExample extends React.Component<any, any> {
   public render() {
     let { showLayer, showHost} = this.state;
     let content = (
-      <div className='LayerExample-content ms-u-scaleUpIn100'>
+      <div className='LayerExample-content ms-scaleUpIn100'>
         This is example layer content.
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.scss b/packages/office-ui-fabric-react/src/components/Link/Link.scss
index e90fea8dbb54d..cb666cb3acfe3 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.scss
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.scss
@@ -2,7 +2,6 @@
 
 // Element: ms-Link root component
 .root {
-  @include ms-baseFont;
   color: $ms-color-themePrimary;
   margin: 0;
   overflow: inherit;
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Mail.Example.scss b/packages/office-ui-fabric-react/src/components/List/examples/List.Mail.Example.scss
index 9648f41a236f6..ddbcd8597be12 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Mail.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Mail.Example.scss
@@ -10,8 +10,8 @@
 :global {
   .ms-ListItem {
     @include ms-font-m;
-    @include ms-u-normalize;
-    @include ms-u-clearfix;
+    @include ms-normalize;
+    @include ms-clearfix;
     padding: 9px 28px 3px;
     position: relative;
     display: block;
@@ -20,7 +20,7 @@
   .ms-ListItem-primaryText,
   .ms-ListItem-secondaryText,
   .ms-ListItem-tertiaryText {
-    @include noWrap;
+    @include ms-no-wrap;
     display: block;
   }
 
@@ -206,7 +206,7 @@
 
     // Primary text, typically the name.
     .ms-ListItem-primaryText {
-      @include noWrap;
+      @include ms-no-wrap;
       font-size: $ms-font-size-m;
       padding-top: 15px;
       padding-right: 0;
@@ -215,7 +215,7 @@
 
     // Secondary text, typically the modified date or some other metadata.
     .ms-ListItem-secondaryText {
-      @include noWrap;
+      @include ms-no-wrap;
       @include ms-font-xs;
       padding-top: 6px;
     }
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.scss b/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.scss
index f66737e696574..feb0ffc9c2666 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.scss
@@ -10,8 +10,8 @@
     &-itemCell {
       .ms-ListScrollingExample-itemContent {
         @include ms-font-m;
-        @include ms-u-normalize;
-        @include ms-u-clearfix;
+        @include ms-normalize;
+        @include ms-clearfix;
         position: relative;
         display: block;
 
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
index 8427f7cb83c77..761e5b316d3cc 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
@@ -8,7 +8,6 @@
 // MessageBar Styles
 
 .root {
-  @include ms-baseFont;
   @include ms-bgColor-info;
   color: $ms-color-infoText;
   width: 100%;
@@ -162,7 +161,7 @@
   min-width: 0;
 }
 .dismissalOneline .dismissal {
-  @include margin-right(-8px);
+  @include ms-margin-right(-8px);
 }
 
 // Add space between adjacent MessageBars.
diff --git a/packages/office-ui-fabric-react/src/components/Modal/Modal.scss b/packages/office-ui-fabric-react/src/components/Modal/Modal.scss
index bf34ab1f0a30c..6dea7dd629d85 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/Modal.scss
+++ b/packages/office-ui-fabric-react/src/components/Modal/Modal.scss
@@ -7,10 +7,9 @@
 // --------------------------------------------------
 // Modal styles
 
-:export { duration: $ms-duration2 }
+:export { duration: $ms-animation-duration-2 }
 
 .root {
-  @include ms-baseFont;
   background-color: transparent;
   position: fixed;
   height: 100%;
@@ -20,10 +19,11 @@
   justify-content: center;
   opacity: 0;
   pointer-events: none;
-  transition: opacity $ms-duration2;
+  transition: opacity $ms-animation-duration-2;
+
   :global(.ms-Button.ms-Button--compound) {
     display: block;
-    @include margin-left(0);
+    @include ms-margin-left(0);
   }
 
   :global(.ms-Overlay) {
@@ -40,11 +40,11 @@
 
 // The actual dialog element
 .main {
-  @include drop-shadow();
+  @include ms-drop-shadow();
   background-color: $ms-color-white;
   box-sizing: border-box;
   position: relative;
-  @include text-align(left);
+  @include ms-text-align(left);
   outline: 3px solid transparent;
   max-height: 100%;
   overflow-y: auto;
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.scss b/packages/office-ui-fabric-react/src/components/Nav/Nav.scss
index ef74d6ede94fc..c4b2b3ed8facc 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.scss
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.scss
@@ -41,7 +41,7 @@ $linkRightPadding: 20px;
 }
 
 .iconLink {
-  @include margin-right(4px);
+  @include ms-margin-right(4px);
 }
 
 .chevronButton {
@@ -84,7 +84,7 @@ $linkRightPadding: 20px;
 
 .chevronIcon {
   position: absolute;
-  @include left(8px);
+  @include ms-left(8px);
   height: $navnode-height;
   line-height: $navnode-height;
   font-size: 12px;
@@ -109,7 +109,7 @@ $linkRightPadding: 20px;
     height: $navnode-height - 2;
     position: absolute;
     top: 1px;
-    @include left(1px);
+    @include ms-left(1px);
     z-index: 1;
     padding: 0;
     margin: 0;
@@ -153,9 +153,9 @@ $linkRightPadding: 20px;
         content: '';
         position: absolute;
         top: 0;
-        @include right(0);
+        @include ms-right(0);
         bottom: 0;
-        @include left(0);
+        @include ms-left(0);
       }
     }
   }
@@ -187,13 +187,13 @@ $linkRightPadding: 20px;
 }
 
 .root .link {
-  @include padding-left($noExpandButtonLinkLeftPadding);
+  @include ms-padding-left($noExpandButtonLinkLeftPadding);
   :global(.ms-Button-label) {
     @include ms-font-m;
     color: $ms-color-themePrimary;
   }
 
   &.linkIsOnExpanded {
-  @include padding-left($hasExpandButtonLinkLeftPadding);
+  @include ms-padding-left($hasExpandButtonLinkLeftPadding);
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
index 06a20e097e3e8..d469d5b689165 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
@@ -74,7 +74,7 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
       <FocusZone direction={ FocusZoneDirection.vertical }>
         <nav role='navigation'
           className={ css('ms-Nav', styles.root, className, {
-            'is-onTop ms-u-slideRightIn40': isOnTop,
+            'is-onTop ms-slideRightIn40': isOnTop,
             [styles.rootIsOnTop]: isOnTop
           }) }>
           { groupElements }
@@ -197,7 +197,7 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
             { group.name }
           </button> : null)
         }
-        <div className={ css('ms-Nav-groupContent', 'ms-u-slideDownIn20', styles.groupContent) }>
+        <div className={ css('ms-Nav-groupContent', 'ms-slideDownIn20', styles.groupContent) }>
           { this._renderLinks(group.links, 0 /* nestingLevel */) }
         </div>
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.scss b/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
index 9877e89e46aa6..be2b8e78df341 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
@@ -42,7 +42,7 @@ $CommandBarHeight: 44px;
     pointer-events: none;
     opacity: 1;
     cursor: pointer;
-    transition: opacity $ms-duration3 $ms-ease1;
+    transition: opacity $ms-animation-duration-3 $ms-animation-ease-1;
   }
 }
 
@@ -51,7 +51,7 @@ $CommandBarHeight: 44px;
   background-color: $ms-color-white;
 
   position: absolute;
-  @include right(0);
+  @include ms-right(0);
   width: 100%;
   bottom: 0;
   top: 0;
@@ -63,13 +63,13 @@ $CommandBarHeight: 44px;
   -webkit-overflow-scrolling: touch;
 
   // Medium screens and up - (anchored right, fixed width)
-  @media (min-width: $ms-screen-md-min) {
+  @media (min-width: $ms-screen-min-md) {
     border-left: 1px solid $ms-color-neutralLight;
     border-right: 1px solid $ms-color-neutralLight;
     pointer-events: auto;
     width: $Panel-width-sm;
-    @include drop-shadow(-30px, 0px, 30px, -30px, .2);
-    @include left(auto);
+    @include ms-drop-shadow(-30px, 0px, 30px, -30px, .2);
+    @include ms-left(auto);
   }
 }
 
@@ -79,7 +79,7 @@ $CommandBarHeight: 44px;
   .main {
     width: $Panel-width-xs;
 
-    @media (min-width: $ms-screen-md-min) {
+    @media (min-width: $ms-screen-min-md) {
       width: $Panel-width-sm;
     }
   }
@@ -89,10 +89,10 @@ $CommandBarHeight: 44px;
 //
 .root.rootIsSmallLeft {
   .main {
-    @include right(auto);
-    @include left(0);
+    @include ms-right(auto);
+    @include ms-left(0);
     width: $Panel-width-xs;
-    @include drop-shadow(30px, 0px, 30px, -30px, .2);
+    @include ms-drop-shadow(30px, 0px, 30px, -30px, .2);
   }
 }
 
@@ -112,8 +112,8 @@ $CommandBarHeight: 44px;
 .root.rootIsXLarge,
 .root.rootIsCustom {
   .main {
-    @media (min-width: $ms-screen-lg-min) {
-      @include left($Panel-margin-md);
+    @media (min-width: $ms-screen-min-lg) {
+      @include ms-left($Panel-margin-md);
       width: auto;
     }
   }
@@ -123,8 +123,8 @@ $CommandBarHeight: 44px;
 //
 .root.rootIsMedium {
   .main {
-    @media (min-width: $ms-screen-xl-min) {
-      @include left(auto);
+    @media (min-width: $ms-screen-min-xl) {
+      @include ms-left(auto);
       width: $Panel-width-md;
     }
   }
@@ -134,8 +134,8 @@ $CommandBarHeight: 44px;
 //
 .root.rootIsLarge {
   .main {
-    @media (min-width: $ms-screen-xxl-min) {
-      @include left($Panel-margin-lg);
+    @media (min-width: $ms-screen-min-xxl) {
+      @include ms-left($Panel-margin-lg);
     }
   }
 }
@@ -144,8 +144,8 @@ $CommandBarHeight: 44px;
 //
 .root.rootIsLarge.rootIsFixed {
   .main {
-    @media (min-width: $ms-screen-xxl-min) {
-      @include left(auto);
+    @media (min-width: $ms-screen-min-xxl) {
+      @include ms-left(auto);
       width: $Panel-width-lg;
     }
   }
@@ -155,8 +155,8 @@ $CommandBarHeight: 44px;
 //
 .root.rootIsXLarge {
   .main {
-    @media (min-width: $ms-screen-xxl-min) {
-      @include left($Panel-margin-xl);
+    @media (min-width: $ms-screen-min-xxl) {
+      @include ms-left($Panel-margin-xl);
     }
   }
 }
@@ -165,8 +165,8 @@ $CommandBarHeight: 44px;
 //
 .root.rootIsCustom {
   .main {
-    @media (min-width: $ms-screen-xl-min) {
-      @include left(auto);
+    @media (min-width: $ms-screen-min-xl) {
+      @include ms-left(auto);
     }
   }
 }
@@ -195,9 +195,11 @@ $CommandBarHeight: 44px;
 
 // The button in the top right (x)
 .closeButton {
-  @include button-reset();
+  background: none;
+  border: 0;
+  cursor: pointer;
   position: absolute;
-  @include right(4px);
+  @include ms-right(4px);
   top: 0;
   height: $CommandBarHeight;
   width: $CommandBarHeight;
@@ -235,12 +237,12 @@ $CommandBarHeight: 44px;
   padding-left: 16px;
   padding-right: 16px;
 
-  @media (min-width: $ms-screen-lg-min) {
+  @media (min-width: $ms-screen-min-lg) {
     padding-left: 32px;
     padding-right: 32px;
   }
 
-  @media (min-width: $ms-screen-xxl-min) {
+  @media (min-width: $ms-screen-min-xxl) {
     padding-left: 40px;
     padding-right: 40px;
   }
@@ -250,7 +252,7 @@ $CommandBarHeight: 44px;
   margin: 14px 0;
   // Ensure that title doesn't shrink if screen is too small
   flex-grow: 0;
-  @media (min-width: $ms-screen-xl-min) {
+  @media (min-width: $ms-screen-min-xl) {
     margin-top: 30px;
   }
 }
@@ -264,7 +266,7 @@ $CommandBarHeight: 44px;
   // Ensure that footer doesn't shrink if screen is too small
   flex-grow: 0;
   border-top: 1px solid transparent;
-  transition: border $ms-duration3 $ms-ease2;
+  transition: border $ms-animation-duration-3 $ms-animation-ease-2;
 }
 
 .footerInner {
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
index a4c1ecef200e3..133956d6ad2a0 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
@@ -27,12 +27,12 @@ export interface IPanelState {
 }
 
 // Animation class constants.
-const FADE_IN_200 = 'ms-u-fadeIn200';
-const FADE_OUT_200 = 'ms-u-fadeOut200';
-const SLIDE_LEFT_IN_40 = 'ms-u-slideLeftIn40';
-const SLIDE_LEFT_OUT_40 = 'ms-u-slideLeftOut40';
-const SLIDE_RIGHT_IN_40 = 'ms-u-slideRightIn40';
-const SLIDE_RIGHT_OUT_40 = 'ms-u-slideRightOut40';
+const FADE_IN_200 = 'ms-fadeIn200';
+const FADE_OUT_200 = 'ms-fadeOut200';
+const SLIDE_LEFT_IN_40 = 'ms-slideLeftIn40';
+const SLIDE_LEFT_OUT_40 = 'ms-slideLeftOut40';
+const SLIDE_RIGHT_IN_40 = 'ms-slideRightIn40';
+const SLIDE_RIGHT_OUT_40 = 'ms-slideRightOut40';
 
 export class Panel extends BaseComponent<IPanelProps, IPanelState> {
 
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
index b99ad0502f40a..e6de4e1e5e617 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
@@ -63,8 +63,7 @@ $ms-Persona-presenceSizeLg: 20px;
 $ms-Persona-presenceSizeXl: 28px;
 
 .root {
-  @include ms-baseFont;
-  @include ms-u-normalize;
+  @include ms-normalize;
   color: $ms-color-neutralPrimary;
   font-size: $ms-font-size-m;
   font-weight: $ms-font-weight-regular;
@@ -169,10 +168,10 @@ $ms-Persona-presenceSizeXl: 28px;
 }
 
 .image {
-  @include margin-right(10px);
+  @include ms-margin-right(10px);
   position: absolute;
   top: 0;
-  @include left(0);
+  @include ms-left(0);
   width: 100%;
   height: 100%;
   border-radius: 50%;
@@ -190,7 +189,7 @@ $ms-Persona-presenceSizeXl: 28px;
   width: $ms-Persona-presenceSizeMd;
   border-radius: 50%;
   top: auto;
-  @include left(34px);
+  @include ms-left(34px);
   bottom: -1px;
   border: 2px solid $ms-color-white;
   text-align: center;
@@ -239,7 +238,7 @@ $ms-Persona-presenceSizeXl: 28px;
 .tertiaryText,
 .optionalText,
 .textContent {
-  @include noWrap();
+  @include ms-no-wrap();
 }
 
 .primaryText {
@@ -285,9 +284,9 @@ $ms-Persona-presenceSizeXl: 28px;
   }
 
   .presence {
-    @include right(auto);
+    @include ms-right(auto);
     top: 10px;
-    @include left(0);
+    @include ms-left(0);
     border: 0;
 
     @media screen and (-ms-high-contrast: active) {
@@ -301,7 +300,7 @@ $ms-Persona-presenceSizeXl: 28px;
   }
 
   .details {
-    @include padding-left(20px);
+    @include ms-padding-left(20px);
   }
 
   .primaryText {
@@ -359,7 +358,7 @@ $ms-Persona-presenceSizeXl: 28px;
     height: $ms-Persona-presenceSizeXxs;
     width: $ms-Persona-presenceSizeXxs;
     border: 4px solid #ffffff;
-    @include left(16px);
+    @include ms-left(16px);
   }
 
   .presenceIcon {
@@ -407,7 +406,7 @@ $ms-Persona-presenceSizeXl: 28px;
     height: $ms-Persona-presenceSizeXxs;
     width: $ms-Persona-presenceSizeXxs;
     border: 4px solid #ffffff;
-    @include left(16px);
+    @include ms-left(16px);
   }
 
   .presenceIcon {
@@ -452,7 +451,7 @@ $ms-Persona-presenceSizeXl: 28px;
   }
 
   .presence {
-    @include left(19px);
+    @include ms-left(19px);
   }
 
   .primaryText {
@@ -492,7 +491,7 @@ $ms-Persona-presenceSizeXl: 28px;
   }
 
   .presence {
-    @include left(27px);
+    @include ms-left(27px);
   }
 
   .primaryText {
@@ -532,7 +531,7 @@ $ms-Persona-presenceSizeXl: 28px;
   }
 
   .presence {
-    @include left(49px);
+    @include ms-left(49px);
     height: $ms-Persona-presenceSizeLg;
     width: $ms-Persona-presenceSizeLg;
     border-width: 3px;
@@ -582,7 +581,7 @@ $ms-Persona-presenceSizeXl: 28px;
   .presence {
     height: $ms-Persona-presenceSizeXl;
     width: $ms-Persona-presenceSizeXl;
-    @include left(71px);
+    @include ms-left(71px);
     border-width: 4px;
   }
 
@@ -679,7 +678,7 @@ $ms-Persona-presenceSizeXl: 28px;
 
   .presenceIcon {
     position: relative;
-    @include left(1px);
+    @include ms-left(1px);
   }
 }
 
@@ -696,7 +695,7 @@ $ms-Persona-presenceSizeXl: 28px;
       height: 100%;
       position: absolute;
       top: 0;
-      @include left(0);
+      @include ms-left(0);
       box-shadow: 0 0 0 2px $ms-color-presence-busy-average inset;
       border-radius: 50%;
     }
@@ -709,7 +708,7 @@ $ms-Persona-presenceSizeXl: 28px;
       transform: rotate(-45deg);
       position: absolute;
       top: 5px;
-      @include left(0);
+      @include ms-left(0);
     }
 
 
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.scss b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.scss
index f1383af466278..3a2e67a687b62 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.scss
+++ b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.scss
@@ -8,8 +8,7 @@
 // Pivot and tab styles
 
 .root {
-  @include ms-baseFont;
-  @include ms-u-normalize;
+  @include ms-normalize;
   font-size: $ms-font-size-m;
   font-weight: $ms-font-weight-regular;
   position: relative;
@@ -32,7 +31,7 @@
   font-size: $ms-font-size-m;
   font-weight: $ms-font-weight-regular;
   line-height: 40px;
-  @include margin-right(8px);
+  @include ms-margin-right(8px);
   padding: 0 8px;
   text-align: center;
   position: relative;
@@ -56,7 +55,7 @@
     left: 8px;
     position: absolute;
     right: 8px;
-    transition: background-color $ms-duration2 $ms-ease2;
+    transition: background-color $ms-animation-duration-2 $ms-animation-ease-2;
   }
 
   // Make room for the heavier text of the selected state
@@ -165,7 +164,7 @@
 .root.rootIsTabs {
   .link {
     @include focus-border();
-    @include margin-right(0px);
+    @include ms-margin-right(0px);
     height: 40px;
     line-height: 40px;
     background-color: $ms-color-neutralLighter;
@@ -231,7 +230,7 @@
 
 // @TODO: Confirm that this component is not responsive.
 //
-// @media (min-width: $ms-screen-lg-min) {
+// @media (min-width: $ms-screen-min-lg) {
 //   .link {
 //     font-size: $ms-font-size-m;
 //   }
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
index c1ce8b8b58ec5..7295c88314a6e 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
@@ -13,7 +13,6 @@ $ProgressIndicatorButtonsWidth: 218px;
 $ProgressIndicatorTextHeight: 18px;
 
 .root {
-  @include ms-baseFont;
   font-weight: $ms-font-weight-regular;
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.scss b/packages/office-ui-fabric-react/src/components/Rating/Rating.scss
index 31e721f56d346..2c220e06ace4c 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.scss
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.scss
@@ -74,7 +74,7 @@ $Rating-largeIconSize: 20px;
 }
 
 .labelText {
-  @include ms-u-screenReaderOnly();
+  @include ms-screenReaderOnly();
 }
 
 // Highlight focused star
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
index 143bd048de552..c4e6782dfda27 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
@@ -9,7 +9,7 @@
 
 .root {
   @include ms-font-m;
-  @include ms-u-normalize;
+  @include ms-normalize;
   color: $ms-color-neutralPrimary;
   display: flex;
   flex-direction: row;
@@ -36,18 +36,18 @@
   font-size: 16px;
   width: 32px;
   text-align: center;
-  transition: width $ms-duration1;
+  transition: width $ms-animation-duration-1;
   color: $ms-color-themePrimary;
 }
 
 .icon {
   opacity: 1;
-  transition: opacity $ms-duration1 0s;
+  transition: opacity $ms-animation-duration-1 0s;
 }
 
 // Input Field
 .field {
-  @include ms-u-normalize;
+  @include ms-normalize;
   border: none;
   outline: none;
   font-weight: inherit;
@@ -95,11 +95,11 @@
 
   .iconContainer {
     width: 4px;
-    transition: width $ms-duration1;
+    transition: width $ms-animation-duration-1;
   }
   .icon {
     opacity: 0;
-    opacity: 0 0s $ms-duration1;
+    opacity: 0 0s $ms-animation-duration-1;
    }
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.scss b/packages/office-ui-fabric-react/src/components/Slider/Slider.scss
index 42a41842ba0f4..d01a99107ecc5 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.scss
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.scss
@@ -47,12 +47,12 @@
 
 .showTransitions {
   .thumb {
-    transition: left $ms-duration3 $ms-ease1;
+    transition: left $ms-animation-duration-3 $ms-animation-ease-1;
   }
 
   .activeSection,
   .inactiveSection {
-    transition: width $ms-duration3 $ms-ease1;
+    transition: width $ms-animation-duration-3 $ms-animation-ease-1;
   }
 }
 .slideBox {
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss
index b4d0105284352..fa7a26b274288 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss
+++ b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss
@@ -55,7 +55,7 @@ $borderSize: 1.5px;
   }
 
   .screenReaderOnly {
-    @include ms-u-screenReaderOnly;
+    @include ms-screenReaderOnly;
   }
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.scss b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.scss
index 60c86dfd5c084..02aaea2427a95 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.scss
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.scss
@@ -31,7 +31,7 @@
 
   .headerIsSmall & {
     @include ms-font-m;
-    @include margin-right(10px);
+    @include ms-margin-right(10px);
     font-weight: $ms-font-weight-semibold;
   }
 }
@@ -49,7 +49,7 @@
 
 .root .closeButton {
   position: absolute;
-  @include right(0);
+  @include ms-right(0);
   top: 0;
   color: $ms-color-white;
   font-size: $ms-icon-size-s;
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index 6a6bf2af39ad8..57e0e8d4c396a 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -29,14 +29,13 @@ $field-error-color: $errorTextColor;
 
 // the box containing the label and input field
 .root {
-  @include ms-baseFont;
-  @include ms-u-normalize;
+  @include ms-normalize;
   margin-bottom: 8px;
   position: relative; /* Needed to position icon */
 }
 
 .screenReaderOnly {
-  @include ms-u-screenReaderOnly;
+  @include ms-screenReaderOnly;
 }
 
 //= State: default
@@ -100,13 +99,12 @@ $field-error-color: $errorTextColor;
 }
 
 .field {
-  @include ms-u-normalize;
-  @include ms-baseFont;
+  @include ms-normalize;
   font-size: $ms-font-size-m;
   border-radius: 0;
   border: none;
   color: $field-text-color;
-  @include padding(0, 12px, 0, 12px);
+  @include ms-padding(0, 12px, 0, 12px);
   width: 100%;
   text-overflow: ellipsis;
   outline: 0;
@@ -116,7 +114,7 @@ $field-error-color: $errorTextColor;
       outline: 0;
     }
   &.hasIcon {
-    @include padding-right(24px);
+    @include ms-padding-right(24px);
   }
 
   &[disabled] {
@@ -127,7 +125,7 @@ $field-error-color: $errorTextColor;
   }
 
   .field {
-      @include input-placeholder {
+    &::placeholder {
       color: $field-placeholder-disabled-color;
     }
   }
@@ -189,8 +187,8 @@ $field-error-color: $errorTextColor;
 
   :global(.ms-Label) {
     font-size: $ms-font-size-m;
-    @include margin-right(8px);
-    @include padding-left(12px);
+    @include ms-margin-right(8px);
+    @include ms-padding-left(12px);
     line-height: 22px; // 32px minus 5px padding top/bottom
     height: 32px;
   }
@@ -198,7 +196,7 @@ $field-error-color: $errorTextColor;
   .fieldGroup {
     flex: 1 1 0;
     border: 0;
-    @include text-align(left);
+    @include ms-text-align(left);
   }
 
   &.rootIsDisabled {
@@ -236,14 +234,16 @@ $field-error-color: $errorTextColor;
     height: auto;
     display: flex;
   }
+
   .field {
     line-height: 17px;
     flex-grow: 1;
     padding-top: 6px;
     overflow: auto;
     width: 100%;
+
     &.hasIcon {
-      @include padding-right(40px);
+      @include ms-padding-right(40px);
     }
   }
 }
@@ -252,7 +252,7 @@ $field-error-color: $errorTextColor;
 .errorMessage {
   @include ms-font-s;
   color: $field-error-color;
-  @include resetMargins;
+  margin: 0;
   padding-top: 5px;
 }
 
@@ -265,8 +265,8 @@ $field-error-color: $errorTextColor;
 .root.rootIsUnderlined {
 
   :global(.ms-Label) {
-    @include padding-left(12px);
-    @include padding-right(0);
+    @include ms-padding-left(12px);
+    @include ms-padding-right(0);
   }
 
   .field {
@@ -277,7 +277,7 @@ $field-error-color: $errorTextColor;
 .root.rootIsMultiline {
 
   .icon {
-    @include padding-right(24px);
+    @include ms-padding-right(24px);
     padding-bottom: 8px;
     align-items: flex-end;
   }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index 9b9384635becc..59c8c059c8265 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -166,7 +166,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
               <div aria-live='assertive'>
                 <DelayedRender>
                   <p
-                    className={ css('ms-TextField-errorMessage ms-u-slideDownIn20', styles.errorMessage) }
+                    className={ css('ms-TextField-errorMessage ms-slideDownIn20', styles.errorMessage) }
                     data-automation-id='error-message'>
                     <i className={ css('ms-Icon ms-Icon--Error', styles.errorIcon) } aria-hidden='true'></i>
                     { errorMessage }
diff --git a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.scss b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.scss
index f20f2963b07e3..423e239624586 100644
--- a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.scss
+++ b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.scss
@@ -23,7 +23,7 @@
     width: 36px;
     height: 36px;
     vertical-align: middle;
-    @include margin-right(5px);
+    @include ms-margin-right(5px);
     border: 1px solid rgba(127, 127, 127, .5);
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.scss b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.scss
index 2042cc108b6a5..83cacd8166764 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.scss
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.scss
@@ -41,9 +41,7 @@ $toggle-focusBorder-color: $focusBorderColor;
 
 // Toggle
 .root {
-  @include ms-baseFont;
-  @include ms-u-normalize;
-
+  @include ms-normalize;
   position: relative;
   display: block;
   margin-bottom: 8px;
@@ -86,7 +84,7 @@ $toggle-focusBorder-color: $focusBorderColor;
 
     .thumb {
       background: $toggle-thumb-on-color;
-      @include left(28px);
+      @include ms-left(28px);
       @include highContrast-bgColor($ms-color-black, $ms-color-white);
     }
 
@@ -135,7 +133,7 @@ $toggle-focusBorder-color: $focusBorderColor;
 
     .thumb {
       background: $toggle-thumb-on-disabled-color;
-      @include left(28px);
+      @include ms-left(28px);
       @include highContrast-bgColor($ms-color-black, $ms-color-white);
     }
   }
@@ -186,7 +184,7 @@ $toggle-focusBorder-color: $focusBorderColor;
   height: 10px;
   border-radius: 10px;
   top: 4px;
-  @include left(4px);
+  @include ms-left(4px);
   transition: all 0.1s ease;
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.scss b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.scss
index 2fc5607ef5aa4..8c05c27381e7f 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.scss
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.scss
@@ -26,4 +26,4 @@
 
 .subText {
   margin: 0;
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
index d98c08dfd2279..9ebd980709d09 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
@@ -41,7 +41,7 @@ export class Tooltip extends BaseComponent<ITooltipProps, any> {
 
     return (
       <Callout
-        className={ css('ms-Tooltip ms-u-fadeIn200', styles.root, {
+        className={ css('ms-Tooltip ms-fadeIn200', styles.root, {
           [styles.hasMediumDelay]: delay === TooltipDelay.medium
         }) }
         targetElement={ targetElement }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
index a9cf990ea024b..2c12965ff89f3 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
@@ -7,8 +7,8 @@
 .suggestionsItem {
   width: 100%;
   height: auto;
-  
-  @include text-align(left);
+
+  @include ms-text-align(left);
   padding: 4px 20px 6px;
 
   display: block;
@@ -28,7 +28,9 @@
 }
 
 .searchMoreButton {
-  @include button-reset();
+  background: none;
+  border: 0;
+  cursor: pointer;
   height: auto;
   text-align: center;
   margin: 0;
diff --git a/packages/office-ui-fabric-react/src/demo/GettingStartedPage.scss b/packages/office-ui-fabric-react/src/demo/GettingStartedPage.scss
index d72c9e0a829fa..61cd171c17c19 100644
--- a/packages/office-ui-fabric-react/src/demo/GettingStartedPage.scss
+++ b/packages/office-ui-fabric-react/src/demo/GettingStartedPage.scss
@@ -34,7 +34,7 @@
     }
   }
 
-  @media (max-width: $ms-screen-lg-max) {
+  @media (max-width: $ms-screen-max-lg) {
     .ms-GettingStartedPage-banner {
       margin: -20px 0;
       margin-bottom: 20px;
diff --git a/rush.json b/rush.json
index 3f4f3cedb5a51..0b6c291e956d5 100644
--- a/rush.json
+++ b/rush.json
@@ -64,4 +64,4 @@
       "shouldPublish": false
     }
   ]
-}
+}
\ No newline at end of file

From 83b0787a17884867a2ad336d3dad9e713da8f04e Mon Sep 17 00:00:00 2001
From: Ryo Miyake <ryo.studiom@gmail.com>
Date: Sun, 28 May 2017 02:56:31 +0900
Subject: [PATCH 0022/1641] introduce prop-types instead of React.PropTypes
 (#1771)

---
 .../introduce-prop-types_2017-05-23-04-28.json    | 15 +++++++++++++++
 common/package.json                               |  3 ++-
 .../rush-office-ui-fabric-react/package.json      |  4 +++-
 common/temp_modules/rush-utilities/package.json   |  4 +++-
 packages/office-ui-fabric-react/package.json      |  8 +++++---
 .../src/common/ConnectedHost.tsx                  |  3 ++-
 .../src/common/StoreHost.tsx                      |  5 +++--
 .../src/components/Layer/Layer.test.tsx           |  5 +++--
 .../Layer/examples/Layer.Basic.Example.tsx        |  5 +++--
 packages/utilities/package.json                   |  9 ++++++---
 packages/utilities/src/Customizer.tsx             |  3 ++-
 packages/utilities/src/customizable.tsx           |  3 ++-
 12 files changed, 49 insertions(+), 18 deletions(-)
 create mode 100644 common/changes/introduce-prop-types_2017-05-23-04-28.json

diff --git a/common/changes/introduce-prop-types_2017-05-23-04-28.json b/common/changes/introduce-prop-types_2017-05-23-04-28.json
new file mode 100644
index 0000000000000..72e8e70b89d06
--- /dev/null
+++ b/common/changes/introduce-prop-types_2017-05-23-04-28.json
@@ -0,0 +1,15 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Introduce prop-types instead of React.PropTypes",
+      "type": "patch"
+    },
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Introduce prop-types instead of React.PropTypes",
+      "type": "patch"
+    }
+  ],
+  "email": "ryo.studiom@gmail.com"
+}
\ No newline at end of file
diff --git a/common/package.json b/common/package.json
index 9f2d7fee0a56e..f43f85da4f329 100644
--- a/common/package.json
+++ b/common/package.json
@@ -1,5 +1,6 @@
 {
   "dependencies": {
+    "prop-types": "15.5.10",
     "react": "15.4.2",
     "react-addons-test-utils": "15.4.2",
     "react-dom": "15.4.2",
@@ -22,4 +23,4 @@
   "name": "rush-common",
   "private": true,
   "version": "0.0.0"
-}
+}
\ No newline at end of file
diff --git a/common/temp_modules/rush-office-ui-fabric-react/package.json b/common/temp_modules/rush-office-ui-fabric-react/package.json
index 7fa2daac23045..3501d626b8ae1 100644
--- a/common/temp_modules/rush-office-ui-fabric-react/package.json
+++ b/common/temp_modules/rush-office-ui-fabric-react/package.json
@@ -9,6 +9,7 @@
     "@types/enzyme": "^2.7.5",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "^2.2.39",
+    "@types/prop-types": "^15.5.1",
     "@types/react": "^15.0.25",
     "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
@@ -33,6 +34,7 @@
     "node-sass": "^4.5.0",
     "office-ui-fabric-core": "7.0.0",
     "postcss-loader": "^1.3.3",
+    "prop-types": "^15.5.10",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
@@ -57,4 +59,4 @@
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
     "@uifabric/utilities": ">=1.10.2 <2.0.0"
   }
-}
+}
\ No newline at end of file
diff --git a/common/temp_modules/rush-utilities/package.json b/common/temp_modules/rush-utilities/package.json
index ab90684968691..1ad18fe20a439 100644
--- a/common/temp_modules/rush-utilities/package.json
+++ b/common/temp_modules/rush-utilities/package.json
@@ -8,6 +8,7 @@
     "@types/enzyme": "^2.7.5",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "^2.2.39",
+    "@types/prop-types": "^15.5.1",
     "@types/react": "^15.0.25",
     "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
@@ -18,6 +19,7 @@
     "es6-weak-map": "^2.0.2",
     "gulp": "~3.9.1",
     "mocha": "~3.3.0",
+    "prop-types": "^15.5.10",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
     "react-dom": "^15.4.2",
@@ -28,4 +30,4 @@
   "rushDependencies": {
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0"
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 943d4679a91c3..1532b44cf06db 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -22,6 +22,7 @@
     "@types/enzyme": "^2.7.5",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "^2.2.39",
+    "@types/prop-types": "^15.5.1",
     "@types/react": "^15.0.25",
     "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
@@ -69,10 +70,11 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=1.10.2 <2.0.0"
+    "@uifabric/utilities": ">=1.10.2 <2.0.0",
+    "prop-types": "^15.5.10"
   },
   "peerDependencies": {
-    "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
+    "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
+    "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   }
 }
diff --git a/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx b/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx
index c21fad37df819..38df9704d75e9 100644
--- a/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx
+++ b/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import * as PropTypes from 'prop-types';
 import { ISubscribable } from './ISubscribable';
 import { BaseComponent, autobind, assign, shallowCompare } from '../Utilities';
 import { IStoreKey } from './storeKey';
@@ -20,7 +21,7 @@ export interface IConnectedHostState {
 
 export class ConnectedHost extends BaseComponent<IConnectedHostProps, IConnectedHostState> {
   public static contextTypes = {
-    stores: React.PropTypes.object
+    stores: PropTypes.object
   };
 
   public context: {
diff --git a/packages/office-ui-fabric-react/src/common/StoreHost.tsx b/packages/office-ui-fabric-react/src/common/StoreHost.tsx
index 75cd19994f96e..89c6993788d36 100644
--- a/packages/office-ui-fabric-react/src/common/StoreHost.tsx
+++ b/packages/office-ui-fabric-react/src/common/StoreHost.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import * as PropTypes from 'prop-types';
 import { StoreSet } from './StoreSet';
 import { BaseComponent } from '../Utilities';
 
@@ -12,11 +13,11 @@ export interface IStoreHostContext {
 
 export class StoreHost extends BaseComponent<IStoreHostProps, {}> {
   public static contextTypes = {
-    stores: React.PropTypes.object
+    stores: PropTypes.object
   };
 
   public static childContextTypes = {
-    stores: React.PropTypes.object
+    stores: PropTypes.object
   };
 
   public context: IStoreHostContext;
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.test.tsx b/packages/office-ui-fabric-react/src/components/Layer/Layer.test.tsx
index a1e4bc1aad681..9a85b3ea0d8b4 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/Layer.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.test.tsx
@@ -1,6 +1,7 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
+import * as PropTypes from 'prop-types';
 /* tslint:enable:no-unused-variable */
 
 import { Layer } from './Layer';
@@ -14,7 +15,7 @@ describe('Layer', () => {
 
     class Child extends React.Component<{}, {}> {
       public static contextTypes = {
-        foo: React.PropTypes.string.isRequired
+        foo: PropTypes.string.isRequired
       };
 
       public context: any;
@@ -28,7 +29,7 @@ describe('Layer', () => {
 
     class Parent extends React.Component<{}, {}> {
       public static childContextTypes = {
-        foo: React.PropTypes.string
+        foo: PropTypes.string
       };
 
       public getChildContext() {
diff --git a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
index d8c3ce7cbff7b..f03e579fced5d 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react'; // tslint:disable-line:no-unused-variable
+import * as PropTypes from 'prop-types';
 import './Layer.Example.scss';
 import { BaseComponent } from 'office-ui-fabric-react/lib/Utilities';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
@@ -6,7 +7,7 @@ import { Layer } from 'office-ui-fabric-react/lib/Layer';
 
 export class LayerContentExample extends BaseComponent<any, any> {
   public static contextTypes = {
-    message: React.PropTypes.string
+    message: PropTypes.string
   };
 
   public context: {
@@ -37,7 +38,7 @@ export class LayerContentExample extends BaseComponent<any, any> {
 export class LayerBasicExample extends BaseComponent<any, any> {
 
   public static childContextTypes = {
-    message: React.PropTypes.string
+    message: PropTypes.string
   };
 
   constructor() {
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 83cd6a8f7396c..e317acfe0c71f 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -21,6 +21,7 @@
     "@types/enzyme": "^2.7.5",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "^2.2.39",
+    "@types/prop-types": "^15.5.1",
     "@types/react": "^15.0.25",
     "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
@@ -39,9 +40,11 @@
     "source-map-loader": "^0.2.1",
     "typescript": "2.2.2"
   },
-  "dependencies": {},
+  "dependencies": {
+    "prop-types": "^15.5.10"
+  },
   "peerDependencies": {
-    "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
+    "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
+    "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   }
 }
\ No newline at end of file
diff --git a/packages/utilities/src/Customizer.tsx b/packages/utilities/src/Customizer.tsx
index 1be7821954990..fad3696d1bd60 100644
--- a/packages/utilities/src/Customizer.tsx
+++ b/packages/utilities/src/Customizer.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import * as PropTypes from 'prop-types';
 import { BaseComponent } from './BaseComponent';
 import { assign } from './object';
 
@@ -26,7 +27,7 @@ export interface ICustomizerState {
  */
 export class Customizer extends BaseComponent<ICustomizerProps, ICustomizerState> {
   public static contextTypes = {
-    injectedProps: React.PropTypes.object
+    injectedProps: PropTypes.object
   };
 
   public static childContextTypes = Customizer.contextTypes;
diff --git a/packages/utilities/src/customizable.tsx b/packages/utilities/src/customizable.tsx
index d207069a0b9db..3042fb97181aa 100644
--- a/packages/utilities/src/customizable.tsx
+++ b/packages/utilities/src/customizable.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import * as PropTypes from 'prop-types';
 
 export function customizable<P>(componentName?: string) {
   return function customizableFactory<P, S>(
@@ -6,7 +7,7 @@ export function customizable<P>(componentName?: string) {
   ): any {
     return class ComponentWithInjectedProps extends React.Component<P, {}> {
       public static contextTypes = {
-        injectedProps: React.PropTypes.object
+        injectedProps: PropTypes.object
       };
 
       public render() {

From 0da35575b72dc45c538b57c58fec1c95398c39b2 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 27 May 2017 10:57:23 -0700
Subject: [PATCH 0023/1641] Fixing core dependencies to be ranges.

---
 apps/component-demo/package.json       | 2 +-
 packages/example-app-base/package.json | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/apps/component-demo/package.json b/apps/component-demo/package.json
index 3e40879e6a34d..17255bf8df20e 100644
--- a/apps/component-demo/package.json
+++ b/apps/component-demo/package.json
@@ -24,7 +24,7 @@
     "@types/webpack-env": "^1.13.0",
     "es6-promise": ">=3.2.1 <4.0.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-core": "7.0.0",
+    "office-ui-fabric-core": ">=7.0.0 <8.0.0",
     "office-ui-fabric-react": ">=1.5.5 <2.0.0",
     "react": ">=15.3.2 <16.0.0",
     "react-dom": ">=15.3.2 <16.0.0",
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 787d35d52e57f..15ff05d903e38 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -42,7 +42,7 @@
   "dependencies": {
     "@uifabric/utilities": "1.10.2",
     "highlight.js": "^9.9.0",
-    "office-ui-fabric-core": "7.0.0",
+    "office-ui-fabric-core": ">=7.0.0 <8.0.0",
     "office-ui-fabric-react": ">=2.11.0-0 <3.0.0-0"
   }
 }
\ No newline at end of file

From b9b7b945b6debfec93823bc3b6849307108552a4 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 27 May 2017 11:21:18 -0700
Subject: [PATCH 0024/1641] rush updates. (#1876)

---
 common/npm-shrinkwrap.json                    | 25 +++++++++++--------
 common/package.json                           |  3 +--
 .../rush-example-app-base/package.json        |  2 +-
 .../rush-example-component/package.json       |  2 +-
 .../rush-fabric-website/package.json          |  4 +--
 .../rush-office-ui-fabric-react/package.json  |  8 +++---
 .../temp_modules/rush-ssr-tests/package.json  |  2 +-
 .../rush-test-bundle-button/package.json      |  2 +-
 .../temp_modules/rush-todo-app/package.json   |  4 +--
 .../temp_modules/rush-utilities/package.json  |  6 ++---
 10 files changed, 31 insertions(+), 27 deletions(-)

diff --git a/common/npm-shrinkwrap.json b/common/npm-shrinkwrap.json
index 192ff8b736f34..dd849126206fd 100644
--- a/common/npm-shrinkwrap.json
+++ b/common/npm-shrinkwrap.json
@@ -832,6 +832,11 @@
       "from": "@types/orchestrator@0.0.30",
       "resolved": "https://registry.npmjs.org/@types/orchestrator/-/orchestrator-0.0.30.tgz"
     },
+    "@types/prop-types": {
+      "version": "15.5.1",
+      "from": "@types/prop-types@>=15.5.1 <16.0.0",
+      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.5.1.tgz"
+    },
     "@types/q": {
       "version": "0.0.32",
       "from": "@types/q@0.0.32",
@@ -1604,9 +1609,9 @@
       "resolved": "https://registry.npmjs.org/caniuse-api/-/caniuse-api-1.6.1.tgz"
     },
     "caniuse-db": {
-      "version": "1.0.30000672",
+      "version": "1.0.30000673",
       "from": "caniuse-db@>=1.0.30000488 <2.0.0",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000672.tgz"
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000673.tgz"
     },
     "capture-stack-trace": {
       "version": "1.0.0",
@@ -2484,9 +2489,9 @@
       "resolved": "https://registry.npmjs.org/ejs/-/ejs-2.5.6.tgz"
     },
     "electron-to-chromium": {
-      "version": "1.3.12",
+      "version": "1.3.13",
       "from": "electron-to-chromium@>=1.2.7 <2.0.0",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.12.tgz"
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.13.tgz"
     },
     "elliptic": {
       "version": "6.4.0",
@@ -4190,9 +4195,9 @@
           "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
         },
         "uglify-js": {
-          "version": "3.0.11",
+          "version": "3.0.12",
           "from": "uglify-js@>=3.0.0 <3.1.0",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.11.tgz"
+          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.12.tgz"
         }
       }
     },
@@ -5897,13 +5902,13 @@
     },
     "office-ui-fabric-core": {
       "version": "7.0.0",
-      "from": "office-ui-fabric-core@7.0.0",
+      "from": "office-ui-fabric-core@>=7.0.0 <8.0.0",
       "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-7.0.0.tgz"
     },
     "office-ui-fabric-react": {
-      "version": "2.34.1",
+      "version": "2.34.2",
       "from": "office-ui-fabric-react@>=2.11.0-0 <3.0.0-0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-2.34.1.tgz"
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-2.34.2.tgz"
     },
     "on-finished": {
       "version": "2.3.0",
@@ -6613,7 +6618,7 @@
     },
     "prop-types": {
       "version": "15.5.10",
-      "from": "prop-types@>=15.5.8 <16.0.0",
+      "from": "prop-types@>=15.5.10 <16.0.0",
       "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.5.10.tgz"
     },
     "proxy-addr": {
diff --git a/common/package.json b/common/package.json
index f43f85da4f329..9f2d7fee0a56e 100644
--- a/common/package.json
+++ b/common/package.json
@@ -1,6 +1,5 @@
 {
   "dependencies": {
-    "prop-types": "15.5.10",
     "react": "15.4.2",
     "react-addons-test-utils": "15.4.2",
     "react-dom": "15.4.2",
@@ -23,4 +22,4 @@
   "name": "rush-common",
   "private": true,
   "version": "0.0.0"
-}
\ No newline at end of file
+}
diff --git a/common/temp_modules/rush-example-app-base/package.json b/common/temp_modules/rush-example-app-base/package.json
index 508f8438fb84f..020410702077f 100644
--- a/common/temp_modules/rush-example-app-base/package.json
+++ b/common/temp_modules/rush-example-app-base/package.json
@@ -22,7 +22,7 @@
     "source-map-loader": "0.2.1",
     "typescript": "2.2.2",
     "highlight.js": "^9.9.0",
-    "office-ui-fabric-core": "7.0.0",
+    "office-ui-fabric-core": ">=7.0.0 <8.0.0",
     "office-ui-fabric-react": ">=2.11.0-0 <3.0.0-0"
   },
   "rushDependencies": {
diff --git a/common/temp_modules/rush-example-component/package.json b/common/temp_modules/rush-example-component/package.json
index 5f7de152afd39..df5661cab0558 100644
--- a/common/temp_modules/rush-example-component/package.json
+++ b/common/temp_modules/rush-example-component/package.json
@@ -35,7 +35,7 @@
   "rushDependencies": {
     "@uifabric/example-app-base": "1.3.14",
     "@uifabric/utilities": "1.10.2",
-    "office-ui-fabric-react": ">=2.34.1 <3.0.0",
+    "office-ui-fabric-react": ">=2.34.2 <3.0.0",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0"
   }
 }
diff --git a/common/temp_modules/rush-fabric-website/package.json b/common/temp_modules/rush-fabric-website/package.json
index 4a4f1f5aee394..9aabe7ffffdf4 100644
--- a/common/temp_modules/rush-fabric-website/package.json
+++ b/common/temp_modules/rush-fabric-website/package.json
@@ -35,12 +35,12 @@
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
-    "office-ui-fabric-core": "7.0.0"
+    "office-ui-fabric-core": ">=7.0.0 <8.0.0"
   },
   "rushDependencies": {
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
     "@uifabric/example-app-base": "1.3.14",
-    "office-ui-fabric-react": ">=2.34.1 <3.0.0",
+    "office-ui-fabric-react": ">=2.34.2 <3.0.0",
     "@uifabric/utilities": ">=1.10.2 <2.0.0"
   }
 }
diff --git a/common/temp_modules/rush-office-ui-fabric-react/package.json b/common/temp_modules/rush-office-ui-fabric-react/package.json
index 3501d626b8ae1..ee183ae700c51 100644
--- a/common/temp_modules/rush-office-ui-fabric-react/package.json
+++ b/common/temp_modules/rush-office-ui-fabric-react/package.json
@@ -32,9 +32,8 @@
     "mocha": "^3.2.0",
     "mocha-loader": "^1.1.1",
     "node-sass": "^4.5.0",
-    "office-ui-fabric-core": "7.0.0",
+    "office-ui-fabric-core": ">=7.0.0 <8.0.0",
     "postcss-loader": "^1.3.3",
-    "prop-types": "^15.5.10",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
@@ -52,11 +51,12 @@
     "webpack-bundle-analyzer": "^2.2.1",
     "webpack-dev-server": "^2.4.1",
     "webpack-notifier": "^1.5.0",
-    "webpack-split-by-path": "2.0.0"
+    "webpack-split-by-path": "2.0.0",
+    "prop-types": "^15.5.10"
   },
   "rushDependencies": {
     "@uifabric/example-app-base": "1.3.14",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
     "@uifabric/utilities": ">=1.10.2 <2.0.0"
   }
-}
\ No newline at end of file
+}
diff --git a/common/temp_modules/rush-ssr-tests/package.json b/common/temp_modules/rush-ssr-tests/package.json
index aa14b2714e94a..9b77cec31fe22 100644
--- a/common/temp_modules/rush-ssr-tests/package.json
+++ b/common/temp_modules/rush-ssr-tests/package.json
@@ -19,6 +19,6 @@
     "es6-promise": "^4.1.0"
   },
   "rushDependencies": {
-    "office-ui-fabric-react": ">=2.34.1 <3.0.0"
+    "office-ui-fabric-react": ">=2.34.2 <3.0.0"
   }
 }
diff --git a/common/temp_modules/rush-test-bundle-button/package.json b/common/temp_modules/rush-test-bundle-button/package.json
index ae242b167d82d..f2fe2a1a22446 100644
--- a/common/temp_modules/rush-test-bundle-button/package.json
+++ b/common/temp_modules/rush-test-bundle-button/package.json
@@ -18,6 +18,6 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "rushDependencies": {
-    "office-ui-fabric-react": ">=2.34.1 <3.0.0"
+    "office-ui-fabric-react": ">=2.34.2 <3.0.0"
   }
 }
diff --git a/common/temp_modules/rush-todo-app/package.json b/common/temp_modules/rush-todo-app/package.json
index 3946248b2bbb9..048872a6fe38d 100644
--- a/common/temp_modules/rush-todo-app/package.json
+++ b/common/temp_modules/rush-todo-app/package.json
@@ -16,12 +16,12 @@
     "@microsoft/load-themed-styles": ">=1.2.2 <2.0.0",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-core": "7.0.0",
+    "office-ui-fabric-core": ">=7.0.0 <8.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2"
   },
   "rushDependencies": {
-    "office-ui-fabric-react": ">=2.34.1 <3.0.0"
+    "office-ui-fabric-react": ">=2.34.2 <3.0.0"
   }
 }
diff --git a/common/temp_modules/rush-utilities/package.json b/common/temp_modules/rush-utilities/package.json
index 1ad18fe20a439..97baec2bcf12a 100644
--- a/common/temp_modules/rush-utilities/package.json
+++ b/common/temp_modules/rush-utilities/package.json
@@ -19,15 +19,15 @@
     "es6-weak-map": "^2.0.2",
     "gulp": "~3.9.1",
     "mocha": "~3.3.0",
-    "prop-types": "^15.5.10",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
     "react-dom": "^15.4.2",
     "sinon": "^2.1.0",
     "source-map-loader": "^0.2.1",
-    "typescript": "2.2.2"
+    "typescript": "2.2.2",
+    "prop-types": "^15.5.10"
   },
   "rushDependencies": {
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0"
   }
-}
\ No newline at end of file
+}

From 9575d01e8d5b55e6ee0de787d66c21031e49acaa Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 27 May 2017 11:22:17 -0700
Subject: [PATCH 0025/1641] Updating lint package to work around rush bug.

---
 packages/office-ui-fabric-react-tslint/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react-tslint/package.json b/packages/office-ui-fabric-react-tslint/package.json
index 0a87b57ad565e..95f4c7929fd95 100644
--- a/packages/office-ui-fabric-react-tslint/package.json
+++ b/packages/office-ui-fabric-react-tslint/package.json
@@ -5,7 +5,7 @@
   "main": "tslint.json",
   "scripts": {
     "clean": "",
-    "build": ""
+    "build": "node -v"
   },
   "devDependencies": {
     "@microsoft/gulp-core-build-typescript": "^2.4.4"

From 052d7dfe81f52bff4eb262999e0993821bb19556 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 27 May 2017 15:41:45 -0700
Subject: [PATCH 0026/1641] Rush 3.0 update (#1877)

* initial changes.

* Updating branch

* Upgrading typescript to 2.3.3

* fsevents
---
 .gitignore                                    |     9 +-
 apps/component-demo/package.json              |     2 +-
 apps/ssr-tests/package.json                   |     7 +-
 apps/test-bundle-button/package.json          |     4 +-
 common/{ => config/rush}/npm-shrinkwrap.json  | 13292 ++++++++--------
 .../rush/pinned-versions.json}                |     6 +-
 common/package.json                           |    25 -
 .../rush-example-app-base/package.json        |    32 -
 .../rush-example-component/package.json       |    41 -
 .../rush-fabric-website/package.json          |    46 -
 .../package.json                              |     8 -
 .../rush-office-ui-fabric-react/package.json  |    62 -
 .../temp_modules/rush-ssr-tests/package.json  |    24 -
 common/temp_modules/rush-styling/package.json |    44 -
 .../rush-test-bundle-button/package.json      |    23 -
 .../temp_modules/rush-todo-app/package.json   |    27 -
 .../temp_modules/rush-utilities/package.json  |    33 -
 package.json                                  |     2 +-
 packages/office-ui-fabric-react/package.json  |     6 +-
 packages/styling/package.json                 |     2 +-
 packages/utilities/package.json               |     4 +-
 rush.json                                     |     3 +-
 22 files changed, 6871 insertions(+), 6831 deletions(-)
 rename common/{ => config/rush}/npm-shrinkwrap.json (88%)
 rename common/{pinnedVersions.json => config/rush/pinned-versions.json} (52%)
 delete mode 100644 common/package.json
 delete mode 100644 common/temp_modules/rush-example-app-base/package.json
 delete mode 100644 common/temp_modules/rush-example-component/package.json
 delete mode 100644 common/temp_modules/rush-fabric-website/package.json
 delete mode 100644 common/temp_modules/rush-office-ui-fabric-react-tslint/package.json
 delete mode 100644 common/temp_modules/rush-office-ui-fabric-react/package.json
 delete mode 100644 common/temp_modules/rush-ssr-tests/package.json
 delete mode 100644 common/temp_modules/rush-styling/package.json
 delete mode 100644 common/temp_modules/rush-test-bundle-button/package.json
 delete mode 100644 common/temp_modules/rush-todo-app/package.json
 delete mode 100644 common/temp_modules/rush-utilities/package.json

diff --git a/.gitignore b/.gitignore
index 288c84d1f2972..f44f968874ef5 100644
--- a/.gitignore
+++ b/.gitignore
@@ -104,14 +104,7 @@ package-deps.json
 **/office-ui-fabric-react/visualtests/results/*.png
 **/office-ui-fabric-react/failures/*.png
 
-common/npm-local
-common/npmx-link.json
-common/last-install.*
-common/npmx-recycler
-
-common/rush-link.json
-common/last-install.*
-common/rush-recycler
+common/temp
 
 # Gulp cache
 gulp-cache
diff --git a/apps/component-demo/package.json b/apps/component-demo/package.json
index 17255bf8df20e..c13f39c558a9f 100644
--- a/apps/component-demo/package.json
+++ b/apps/component-demo/package.json
@@ -28,6 +28,6 @@
     "office-ui-fabric-react": ">=1.5.5 <2.0.0",
     "react": ">=15.3.2 <16.0.0",
     "react-dom": ">=15.3.2 <16.0.0",
-    "typescript": "^2.0.6"
+    "typescript": "2.3.3"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 15b74e322819c..a1cd82ae4d375 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -11,10 +11,9 @@
   "scripts": {
     "_webpack": "node ./node_modules/webpack/bin/webpack --config webpack.config.js",
     "_mocha": "node ./node_modules/mocha/bin/_mocha dist/ssr-tests.js",
-    "build": "npm run _webpack",
-    "test": "npm run _webpack && npm run _mocha",
-    "clean": "",
-    "start": ""
+    "_test": "npm run _webpack && npm run _mocha",
+    "build": "npm run _test",
+    "clean": ""
   },
   "license": "MIT",
   "devDependencies": {
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index fc731a94de519..a4483c2621f0b 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -10,7 +10,8 @@
   },
   "license": "MIT",
   "scripts": {
-    "build": "node node_modules/webpack/bin/webpack --config webpack.config.js && echo Done",
+    "_bundle": "node node_modules/webpack/bin/webpack --config webpack.config.js && echo Done",
+    "build": "npm run _bundle",
     "clean": "",
     "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.serve.config.js --open"
   },
@@ -20,6 +21,7 @@
     "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
+    "@types/prop-types": "^15.5.1",
     "source-map-loader": "^0.2.1",
     "ts-loader": "^2.0.1",
     "typescript": "^2.2.2",
diff --git a/common/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
similarity index 88%
rename from common/npm-shrinkwrap.json
rename to common/config/rush/npm-shrinkwrap.json
index dd849126206fd..e4278eac58f8b 100644
--- a/common/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -3,13 +3,13 @@
   "version": "0.0.0",
   "dependencies": {
     "@microsoft/api-extractor": {
-      "version": "2.0.6",
-      "from": "@microsoft/api-extractor@>=2.0.5 <3.0.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.0.6.tgz"
+      "version": "1.1.19",
+      "from": "@microsoft/api-extractor@>=1.1.19 <2.0.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-1.1.19.tgz"
     },
     "@microsoft/gulp-core-build": {
       "version": "2.5.3",
-      "from": "@microsoft/gulp-core-build@>=2.5.0 <3.0.0",
+      "from": "@microsoft/gulp-core-build@>=2.4.2 <3.0.0",
       "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.5.3.tgz",
       "dependencies": {
         "@types/chai": {
@@ -22,16 +22,16 @@
           "from": "@types/mocha@2.2.38",
           "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz"
         },
-        "lodash.merge": {
-          "version": "4.3.5",
-          "from": "lodash.merge@>=4.3.2 <4.4.0",
-          "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.3.5.tgz"
+        "rimraf": {
+          "version": "2.5.4",
+          "from": "rimraf@>=2.5.4 <2.6.0",
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz"
         }
       }
     },
     "@microsoft/gulp-core-build-karma": {
       "version": "2.2.2",
-      "from": "@microsoft/gulp-core-build-karma@>=2.2.1 <3.0.0",
+      "from": "@microsoft/gulp-core-build-karma@>=2.1.2 <3.0.0",
       "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-karma/-/gulp-core-build-karma-2.2.2.tgz",
       "dependencies": {
         "camelcase": {
@@ -44,60 +44,64 @@
           "from": "cliui@>=2.1.0 <3.0.0",
           "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz"
         },
-        "commander": {
-          "version": "2.3.0",
-          "from": "commander@2.3.0",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-2.3.0.tgz"
-        },
-        "debug": {
-          "version": "2.2.0",
-          "from": "debug@2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
-        },
-        "escape-string-regexp": {
-          "version": "1.0.2",
-          "from": "escape-string-regexp@1.0.2",
-          "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.2.tgz"
-        },
-        "glob": {
-          "version": "3.2.11",
-          "from": "glob@3.2.11",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-3.2.11.tgz"
-        },
         "interpret": {
           "version": "0.6.6",
           "from": "interpret@>=0.6.4 <0.7.0",
           "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz"
         },
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+        },
+        "karma-sinon-chai": {
+          "version": "1.2.4",
+          "from": "karma-sinon-chai@>=1.2.0 <1.3.0",
+          "resolved": "https://registry.npmjs.org/karma-sinon-chai/-/karma-sinon-chai-1.2.4.tgz",
+          "dependencies": {
+            "lolex": {
+              "version": "1.6.0",
+              "from": "lolex@>=1.5.0 <2.0.0",
+              "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz"
+            }
+          }
+        },
         "memory-fs": {
           "version": "0.3.0",
           "from": "memory-fs@>=0.3.0 <0.4.0",
           "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz"
         },
-        "minimatch": {
-          "version": "0.3.0",
-          "from": "minimatch@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.3.0.tgz"
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
-        "mocha": {
-          "version": "2.5.3",
-          "from": "mocha@>=2.5.3 <2.6.0",
-          "resolved": "https://registry.npmjs.org/mocha/-/mocha-2.5.3.tgz"
+        "sinon": {
+          "version": "1.17.7",
+          "from": "sinon@>=1.17.3 <1.18.0",
+          "resolved": "https://registry.npmjs.org/sinon/-/sinon-1.17.7.tgz",
+          "dependencies": {
+            "lolex": {
+              "version": "1.3.2",
+              "from": "lolex@1.3.2",
+              "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.3.2.tgz"
+            }
+          }
         },
-        "ms": {
-          "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+        "sinon-chai": {
+          "version": "2.8.0",
+          "from": "sinon-chai@>=2.8.0 <2.9.0",
+          "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.8.0.tgz"
         },
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.1 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
+        "string_decoder": {
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         },
         "supports-color": {
-          "version": "1.2.0",
-          "from": "supports-color@1.2.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-1.2.0.tgz"
+          "version": "3.2.3",
+          "from": "supports-color@>=3.1.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
         },
         "uglify-js": {
           "version": "2.7.5",
@@ -114,14 +118,7 @@
         "webpack": {
           "version": "1.13.3",
           "from": "webpack@>=1.13.0 <1.14.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz",
-          "dependencies": {
-            "supports-color": {
-              "version": "3.2.3",
-              "from": "supports-color@>=3.1.0 <4.0.0",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
-            }
-          }
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz"
         },
         "window-size": {
           "version": "0.1.0",
@@ -141,52 +138,37 @@
       }
     },
     "@microsoft/gulp-core-build-sass": {
-      "version": "3.1.2",
-      "from": "@microsoft/gulp-core-build-sass@>=3.1.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.1.2.tgz"
+      "version": "2.0.8",
+      "from": "@microsoft/gulp-core-build-sass@>=2.0.3 <3.0.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-2.0.8.tgz",
+      "dependencies": {
+        "autoprefixer": {
+          "version": "6.3.7",
+          "from": "autoprefixer@6.3.7",
+          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz"
+        }
+      }
     },
     "@microsoft/gulp-core-build-serve": {
       "version": "2.1.3",
-      "from": "@microsoft/gulp-core-build-serve@>=2.1.2 <3.0.0",
+      "from": "@microsoft/gulp-core-build-serve@>=2.0.3 <3.0.0",
       "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-serve/-/gulp-core-build-serve-2.1.3.tgz"
     },
     "@microsoft/gulp-core-build-typescript": {
-      "version": "3.1.1",
-      "from": "@microsoft/gulp-core-build-typescript@>=3.1.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.1.1.tgz",
+      "version": "2.4.4",
+      "from": "@microsoft/gulp-core-build-typescript@>=2.4.4 <3.0.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-2.4.4.tgz",
       "dependencies": {
-        "diff": {
-          "version": "3.2.0",
-          "from": "diff@>=3.0.1 <4.0.0",
-          "resolved": "https://registry.npmjs.org/diff/-/diff-3.2.0.tgz"
-        },
-        "findup-sync": {
-          "version": "0.3.0",
-          "from": "findup-sync@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.3.0.tgz",
-          "dependencies": {
-            "glob": {
-              "version": "5.0.15",
-              "from": "glob@>=5.0.0 <5.1.0",
-              "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
-            }
-          }
-        },
-        "lodash": {
-          "version": "4.15.0",
-          "from": "lodash@>=4.15.0 <4.16.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.15.0.tgz"
-        },
-        "tslint": {
-          "version": "4.5.1",
-          "from": "tslint@>=4.5.1 <4.6.0",
-          "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.5.1.tgz"
+        "typescript": {
+          "version": "2.1.6",
+          "from": "typescript@>=2.1.4 <2.2.0",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.1.6.tgz"
         }
       }
     },
     "@microsoft/gulp-core-build-webpack": {
       "version": "1.1.6",
-      "from": "@microsoft/gulp-core-build-webpack@>=1.1.5 <2.0.0",
+      "from": "@microsoft/gulp-core-build-webpack@>=1.1.2 <2.0.0",
       "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-webpack/-/gulp-core-build-webpack-1.1.6.tgz",
       "dependencies": {
         "camelcase": {
@@ -204,15 +186,25 @@
           "from": "interpret@>=0.6.4 <0.7.0",
           "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz"
         },
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+        },
         "memory-fs": {
           "version": "0.3.0",
           "from": "memory-fs@>=0.3.0 <0.4.0",
           "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz"
         },
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.1 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+        },
+        "string_decoder": {
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         },
         "supports-color": {
           "version": "3.2.3",
@@ -300,6 +292,11 @@
           "from": "@types/mocha@2.2.38",
           "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz"
         },
+        "rimraf": {
+          "version": "2.5.4",
+          "from": "rimraf@>=2.5.2 <2.6.0",
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz"
+        },
         "semver": {
           "version": "5.2.0",
           "from": "semver@>=5.2.0 <5.3.0",
@@ -312,23 +309,6 @@
       "from": "@microsoft/sp-build-common@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/@microsoft/sp-build-common/-/sp-build-common-1.0.0.tgz",
       "dependencies": {
-        "@microsoft/api-extractor": {
-          "version": "1.1.19",
-          "from": "@microsoft/api-extractor@>=1.1.19 <2.0.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-1.1.19.tgz",
-          "dependencies": {
-            "@types/z-schema": {
-              "version": "3.16.31",
-              "from": "@types/z-schema@3.16.31",
-              "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.31.tgz"
-            }
-          }
-        },
-        "@microsoft/gulp-core-build-typescript": {
-          "version": "2.4.4",
-          "from": "@microsoft/gulp-core-build-typescript@>=2.2.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-2.4.4.tgz"
-        },
         "@types/yargs": {
           "version": "0.0.35",
           "from": "@types/yargs@0.0.35",
@@ -338,16 +318,6 @@
           "version": "3.16.20-alpha",
           "from": "@types/z-schema@3.16.20-alpha",
           "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.20-alpha.tgz"
-        },
-        "lodash": {
-          "version": "4.15.0",
-          "from": "lodash@>=4.15.0 <4.16.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.15.0.tgz"
-        },
-        "typescript": {
-          "version": "2.1.6",
-          "from": "typescript@>=2.1.4 <2.2.0",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.1.6.tgz"
         }
       }
     },
@@ -361,11 +331,6 @@
           "from": "@microsoft/load-themed-styles@>=1.2.2 <1.3.0",
           "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.2.2.tgz"
         },
-        "async": {
-          "version": "0.9.2",
-          "from": "async@>=0.9.0 <0.10.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
-        },
         "camelcase": {
           "version": "1.2.1",
           "from": "camelcase@>=1.0.2 <2.0.0",
@@ -416,15 +381,10 @@
           "from": "interpret@>=0.6.4 <0.7.0",
           "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz"
         },
-        "lodash": {
-          "version": "4.15.0",
-          "from": "lodash@>=4.15.0 <4.16.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.15.0.tgz"
-        },
-        "lodash.camelcase": {
-          "version": "3.0.1",
-          "from": "lodash.camelcase@>=3.0.1 <4.0.0",
-          "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-3.0.1.tgz"
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "memory-fs": {
           "version": "0.3.0",
@@ -441,16 +401,31 @@
           "from": "ms@0.7.1",
           "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
         },
+        "node-uuid": {
+          "version": "1.4.8",
+          "from": "node-uuid@>=1.4.7 <1.5.0",
+          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz"
+        },
         "range-parser": {
           "version": "1.0.3",
           "from": "range-parser@>=1.0.3 <1.1.0",
           "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.0.3.tgz"
         },
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+        },
         "resolve": {
           "version": "1.1.7",
           "from": "resolve@>=1.1.7 <1.2.0",
           "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz"
         },
+        "rimraf": {
+          "version": "2.5.4",
+          "from": "rimraf@>=2.5.2 <2.6.0",
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz"
+        },
         "send": {
           "version": "0.13.2",
           "from": "send@0.13.2",
@@ -461,21 +436,16 @@
           "from": "serve-static@>=1.10.2 <1.11.0",
           "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.10.3.tgz"
         },
-        "source-map": {
-          "version": "0.1.43",
-          "from": "source-map@>=0.1.33 <0.2.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
-        },
-        "source-map-loader": {
-          "version": "0.1.6",
-          "from": "source-map-loader@>=0.1.5 <0.2.0",
-          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.1.6.tgz"
-        },
         "statuses": {
           "version": "1.2.1",
           "from": "statuses@>=1.2.1 <1.3.0",
           "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.2.1.tgz"
         },
+        "string_decoder": {
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+        },
         "supports-color": {
           "version": "3.2.3",
           "from": "supports-color@>=3.1.0 <4.0.0",
@@ -490,25 +460,13 @@
               "version": "0.2.10",
               "from": "async@>=0.2.6 <0.3.0",
               "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz"
-            },
-            "source-map": {
-              "version": "0.5.6",
-              "from": "source-map@>=0.5.1 <0.6.0",
-              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
             }
           }
         },
         "webpack": {
           "version": "1.13.3",
           "from": "webpack@>=1.13.0 <1.14.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz",
-          "dependencies": {
-            "async": {
-              "version": "1.5.2",
-              "from": "async@^1.3.0",
-              "resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz"
-            }
-          }
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz"
         },
         "window-size": {
           "version": "0.1.0",
@@ -532,92 +490,10 @@
       "from": "@microsoft/sp-build-web@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/@microsoft/sp-build-web/-/sp-build-web-1.0.1.tgz",
       "dependencies": {
-        "@microsoft/api-extractor": {
-          "version": "1.1.19",
-          "from": "@microsoft/api-extractor@>=1.1.19 <2.0.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-1.1.19.tgz"
-        },
-        "@microsoft/gulp-core-build-sass": {
-          "version": "2.0.8",
-          "from": "@microsoft/gulp-core-build-sass@>=2.0.3 <3.0.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-2.0.8.tgz"
-        },
-        "@microsoft/gulp-core-build-typescript": {
-          "version": "2.4.4",
-          "from": "@microsoft/gulp-core-build-typescript@>=2.2.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-2.4.4.tgz",
-          "dependencies": {
-            "lodash": {
-              "version": "4.15.0",
-              "from": "lodash@>=4.15.0 <4.16.0",
-              "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.15.0.tgz"
-            }
-          }
-        },
         "@types/yargs": {
           "version": "0.0.35",
           "from": "@types/yargs@0.0.35",
           "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.35.tgz"
-        },
-        "clean-css": {
-          "version": "3.4.26",
-          "from": "clean-css@>=3.4.20 <4.0.0",
-          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-3.4.26.tgz"
-        },
-        "commander": {
-          "version": "2.8.1",
-          "from": "commander@>=2.8.0 <2.9.0",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-2.8.1.tgz"
-        },
-        "gaze": {
-          "version": "1.1.2",
-          "from": "gaze@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz"
-        },
-        "globule": {
-          "version": "1.1.0",
-          "from": "globule@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/globule/-/globule-1.1.0.tgz"
-        },
-        "gulp-clean-css": {
-          "version": "2.0.13",
-          "from": "gulp-clean-css@>=2.0.11 <2.1.0",
-          "resolved": "https://registry.npmjs.org/gulp-clean-css/-/gulp-clean-css-2.0.13.tgz"
-        },
-        "gulp-postcss": {
-          "version": "6.1.1",
-          "from": "gulp-postcss@>=6.1.1 <6.2.0",
-          "resolved": "https://registry.npmjs.org/gulp-postcss/-/gulp-postcss-6.1.1.tgz"
-        },
-        "gulp-sass": {
-          "version": "2.3.2",
-          "from": "gulp-sass@>=2.3.2 <2.4.0",
-          "resolved": "https://registry.npmjs.org/gulp-sass/-/gulp-sass-2.3.2.tgz"
-        },
-        "lodash": {
-          "version": "4.16.6",
-          "from": "lodash@>=4.16.4 <4.17.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.16.6.tgz"
-        },
-        "node-sass": {
-          "version": "3.13.1",
-          "from": "node-sass@>=3.4.2 <4.0.0",
-          "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-3.13.1.tgz"
-        },
-        "postcss-modules": {
-          "version": "0.5.2",
-          "from": "postcss-modules@>=0.5.0 <0.6.0",
-          "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.5.2.tgz"
-        },
-        "source-map": {
-          "version": "0.4.4",
-          "from": "source-map@>=0.4.0 <0.5.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz"
-        },
-        "typescript": {
-          "version": "2.1.6",
-          "from": "typescript@>=2.1.4 <2.2.0",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.1.6.tgz"
         }
       }
     },
@@ -653,29 +529,7 @@
     "@microsoft/sp-tslint-rules": {
       "version": "1.0.0",
       "from": "@microsoft/sp-tslint-rules@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/sp-tslint-rules/-/sp-tslint-rules-1.0.0.tgz",
-      "dependencies": {
-        "@microsoft/api-extractor": {
-          "version": "1.1.19",
-          "from": "@microsoft/api-extractor@>=1.1.19 <2.0.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-1.1.19.tgz"
-        },
-        "@microsoft/gulp-core-build-typescript": {
-          "version": "2.4.4",
-          "from": "@microsoft/gulp-core-build-typescript@>=2.2.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-2.4.4.tgz"
-        },
-        "lodash": {
-          "version": "4.15.0",
-          "from": "lodash@>=4.15.0 <4.16.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.15.0.tgz"
-        },
-        "typescript": {
-          "version": "2.1.6",
-          "from": "typescript@>=2.1.4 <2.2.0",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.1.6.tgz"
-        }
-      }
+      "resolved": "https://registry.npmjs.org/@microsoft/sp-tslint-rules/-/sp-tslint-rules-1.0.0.tgz"
     },
     "@microsoft/stream-collator": {
       "version": "1.0.2",
@@ -685,6926 +539,7524 @@
     "@microsoft/web-library-build": {
       "version": "3.0.2",
       "from": "@microsoft/web-library-build@>=3.0.0-0 <4.0.0-0",
-      "resolved": "https://registry.npmjs.org/@microsoft/web-library-build/-/web-library-build-3.0.2.tgz"
-    },
-    "@types/assertion-error": {
-      "version": "1.0.30",
-      "from": "@types/assertion-error@1.0.30",
-      "resolved": "https://registry.npmjs.org/@types/assertion-error/-/assertion-error-1.0.30.tgz"
-    },
-    "@types/bluebird": {
-      "version": "3.5.4",
-      "from": "@types/bluebird@*",
-      "resolved": "https://registry.npmjs.org/@types/bluebird/-/bluebird-3.5.4.tgz"
-    },
-    "@types/chai": {
-      "version": "3.5.2",
-      "from": "@types/chai@>=3.4.35 <4.0.0",
-      "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.5.2.tgz"
-    },
-    "@types/chalk": {
-      "version": "0.4.31",
-      "from": "@types/chalk@0.4.31",
-      "resolved": "https://registry.npmjs.org/@types/chalk/-/chalk-0.4.31.tgz"
-    },
-    "@types/cheerio": {
-      "version": "0.22.1",
-      "from": "@types/cheerio@*",
-      "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.1.tgz"
-    },
-    "@types/colors": {
-      "version": "1.1.1",
-      "from": "@types/colors@1.1.1",
-      "resolved": "https://registry.npmjs.org/@types/colors/-/colors-1.1.1.tgz"
-    },
-    "@types/enzyme": {
-      "version": "2.8.0",
-      "from": "@types/enzyme@>=2.7.5 <3.0.0",
-      "resolved": "https://registry.npmjs.org/@types/enzyme/-/enzyme-2.8.0.tgz"
-    },
-    "@types/es6-collections": {
-      "version": "0.5.29",
-      "from": "@types/es6-collections@0.5.29",
-      "resolved": "https://registry.npmjs.org/@types/es6-collections/-/es6-collections-0.5.29.tgz"
-    },
-    "@types/es6-promise": {
-      "version": "0.0.32",
-      "from": "@types/es6-promise@>=0.0.32 <0.0.33",
-      "resolved": "https://registry.npmjs.org/@types/es6-promise/-/es6-promise-0.0.32.tgz"
-    },
-    "@types/express": {
-      "version": "4.0.35",
-      "from": "@types/express@*",
-      "resolved": "https://registry.npmjs.org/@types/express/-/express-4.0.35.tgz"
-    },
-    "@types/express-serve-static-core": {
-      "version": "4.0.45",
-      "from": "@types/express-serve-static-core@*",
-      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.0.45.tgz"
-    },
-    "@types/finalhandler": {
-      "version": "0.0.31",
-      "from": "@types/finalhandler@0.0.31",
-      "resolved": "https://registry.npmjs.org/@types/finalhandler/-/finalhandler-0.0.31.tgz"
-    },
-    "@types/fs-extra": {
-      "version": "0.0.37",
-      "from": "@types/fs-extra@0.0.37",
-      "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.37.tgz"
-    },
-    "@types/glob": {
-      "version": "5.0.30",
-      "from": "@types/glob@5.0.30",
-      "resolved": "https://registry.npmjs.org/@types/glob/-/glob-5.0.30.tgz"
-    },
-    "@types/gulp": {
-      "version": "3.8.32",
-      "from": "@types/gulp@3.8.32",
-      "resolved": "https://registry.npmjs.org/@types/gulp/-/gulp-3.8.32.tgz"
-    },
-    "@types/gulp-replace": {
-      "version": "0.0.29",
-      "from": "@types/gulp-replace@0.0.29",
-      "resolved": "https://registry.npmjs.org/@types/gulp-replace/-/gulp-replace-0.0.29.tgz"
-    },
-    "@types/gulp-util": {
-      "version": "3.0.30",
-      "from": "@types/gulp-util@3.0.30",
-      "resolved": "https://registry.npmjs.org/@types/gulp-util/-/gulp-util-3.0.30.tgz"
-    },
-    "@types/karma": {
-      "version": "0.13.33",
-      "from": "@types/karma@0.13.33",
-      "resolved": "https://registry.npmjs.org/@types/karma/-/karma-0.13.33.tgz"
-    },
-    "@types/lodash": {
-      "version": "4.14.52",
-      "from": "@types/lodash@4.14.52",
-      "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.52.tgz"
-    },
-    "@types/log4js": {
-      "version": "0.0.32",
-      "from": "@types/log4js@*",
-      "resolved": "https://registry.npmjs.org/@types/log4js/-/log4js-0.0.32.tgz"
-    },
-    "@types/merge2": {
-      "version": "0.3.29",
-      "from": "@types/merge2@0.3.29",
-      "resolved": "https://registry.npmjs.org/@types/merge2/-/merge2-0.3.29.tgz"
-    },
-    "@types/mime": {
-      "version": "0.0.29",
-      "from": "@types/mime@*",
-      "resolved": "https://registry.npmjs.org/@types/mime/-/mime-0.0.29.tgz"
-    },
-    "@types/minimatch": {
-      "version": "2.0.29",
-      "from": "@types/minimatch@*",
-      "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-2.0.29.tgz"
-    },
-    "@types/mkdirp": {
-      "version": "0.3.29",
-      "from": "@types/mkdirp@0.3.29",
-      "resolved": "https://registry.npmjs.org/@types/mkdirp/-/mkdirp-0.3.29.tgz"
-    },
-    "@types/mocha": {
-      "version": "2.2.41",
-      "from": "@types/mocha@>=2.2.39 <3.0.0",
-      "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.41.tgz"
-    },
-    "@types/node": {
-      "version": "6.0.62",
-      "from": "@types/node@6.0.62",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.62.tgz"
-    },
-    "@types/node-notifier": {
-      "version": "0.0.28",
-      "from": "@types/node-notifier@0.0.28",
-      "resolved": "https://registry.npmjs.org/@types/node-notifier/-/node-notifier-0.0.28.tgz"
-    },
-    "@types/node-uuid": {
-      "version": "0.0.28",
-      "from": "@types/node-uuid@0.0.28",
-      "resolved": "https://registry.npmjs.org/@types/node-uuid/-/node-uuid-0.0.28.tgz"
-    },
-    "@types/orchestrator": {
-      "version": "0.0.30",
-      "from": "@types/orchestrator@0.0.30",
-      "resolved": "https://registry.npmjs.org/@types/orchestrator/-/orchestrator-0.0.30.tgz"
-    },
-    "@types/prop-types": {
-      "version": "15.5.1",
-      "from": "@types/prop-types@>=15.5.1 <16.0.0",
-      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.5.1.tgz"
-    },
-    "@types/q": {
-      "version": "0.0.32",
-      "from": "@types/q@0.0.32",
-      "resolved": "https://registry.npmjs.org/@types/q/-/q-0.0.32.tgz"
-    },
-    "@types/react": {
-      "version": "15.0.25",
-      "from": "@types/react@>=15.0.25 <16.0.0",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.25.tgz"
-    },
-    "@types/react-addons-test-utils": {
-      "version": "0.14.18",
-      "from": "@types/react-addons-test-utils@>=0.14.18 <0.15.0",
-      "resolved": "https://registry.npmjs.org/@types/react-addons-test-utils/-/react-addons-test-utils-0.14.18.tgz"
-    },
-    "@types/react-dom": {
-      "version": "15.5.0",
-      "from": "@types/react-dom@>=15.5.0 <16.0.0",
-      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-15.5.0.tgz"
-    },
-    "@types/resemblejs": {
-      "version": "1.3.28",
-      "from": "@types/resemblejs@>=1.3.28 <1.4.0",
-      "resolved": "https://registry.npmjs.org/@types/resemblejs/-/resemblejs-1.3.28.tgz"
-    },
-    "@types/resolve": {
-      "version": "0.0.4",
-      "from": "@types/resolve@0.0.4",
-      "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-0.0.4.tgz"
-    },
-    "@types/rimraf": {
-      "version": "0.0.28",
-      "from": "@types/rimraf@0.0.28",
-      "resolved": "https://registry.npmjs.org/@types/rimraf/-/rimraf-0.0.28.tgz"
-    },
-    "@types/semver": {
-      "version": "5.3.31",
-      "from": "@types/semver@5.3.31",
-      "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.31.tgz"
-    },
-    "@types/serve-static": {
-      "version": "1.7.31",
-      "from": "@types/serve-static@1.7.31",
-      "resolved": "https://registry.npmjs.org/@types/serve-static/-/serve-static-1.7.31.tgz"
-    },
-    "@types/sinon": {
-      "version": "2.2.2",
-      "from": "@types/sinon@>=2.1.3 <3.0.0",
-      "resolved": "https://registry.npmjs.org/@types/sinon/-/sinon-2.2.2.tgz"
-    },
-    "@types/source-map": {
-      "version": "0.5.0",
-      "from": "@types/source-map@*",
-      "resolved": "https://registry.npmjs.org/@types/source-map/-/source-map-0.5.0.tgz"
-    },
-    "@types/through2": {
-      "version": "2.0.32",
-      "from": "@types/through2@2.0.32",
-      "resolved": "https://registry.npmjs.org/@types/through2/-/through2-2.0.32.tgz"
-    },
-    "@types/uglify-js": {
-      "version": "2.6.28",
-      "from": "@types/uglify-js@*",
-      "resolved": "https://registry.npmjs.org/@types/uglify-js/-/uglify-js-2.6.28.tgz"
-    },
-    "@types/vinyl": {
-      "version": "1.2.30",
-      "from": "@types/vinyl@1.2.30",
-      "resolved": "https://registry.npmjs.org/@types/vinyl/-/vinyl-1.2.30.tgz"
-    },
-    "@types/webpack": {
-      "version": "1.12.36",
-      "from": "@types/webpack@1.12.36",
-      "resolved": "https://registry.npmjs.org/@types/webpack/-/webpack-1.12.36.tgz"
-    },
-    "@types/webpack-env": {
-      "version": "1.13.0",
-      "from": "@types/webpack-env@>=1.13.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/@types/webpack-env/-/webpack-env-1.13.0.tgz"
-    },
-    "@types/webpack-stream": {
-      "version": "3.2.5",
-      "from": "@types/webpack-stream@3.2.5",
-      "resolved": "https://registry.npmjs.org/@types/webpack-stream/-/webpack-stream-3.2.5.tgz"
-    },
-    "@types/whatwg-fetch": {
-      "version": "0.0.30",
-      "from": "@types/whatwg-fetch@0.0.30",
-      "resolved": "https://registry.npmjs.org/@types/whatwg-fetch/-/whatwg-fetch-0.0.30.tgz"
-    },
-    "@types/yargs": {
-      "version": "0.0.34",
-      "from": "@types/yargs@0.0.34",
-      "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.34.tgz"
+      "resolved": "https://registry.npmjs.org/@microsoft/web-library-build/-/web-library-build-3.0.2.tgz",
+      "dependencies": {
+        "@microsoft/api-extractor": {
+          "version": "2.0.6",
+          "from": "@microsoft/api-extractor@>=2.0.5 <3.0.0",
+          "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.0.6.tgz"
+        },
+        "@microsoft/gulp-core-build-sass": {
+          "version": "3.1.2",
+          "from": "@microsoft/gulp-core-build-sass@>=3.1.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.1.2.tgz"
+        },
+        "@microsoft/gulp-core-build-typescript": {
+          "version": "3.1.1",
+          "from": "@microsoft/gulp-core-build-typescript@>=3.1.1 <4.0.0",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.1.1.tgz"
+        },
+        "ansi-align": {
+          "version": "2.0.0",
+          "from": "ansi-align@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-2.0.0.tgz"
+        },
+        "autoprefixer": {
+          "version": "6.3.7",
+          "from": "autoprefixer@6.3.7",
+          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz"
+        },
+        "boxen": {
+          "version": "1.1.0",
+          "from": "boxen@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/boxen/-/boxen-1.1.0.tgz"
+        },
+        "camelcase": {
+          "version": "4.1.0",
+          "from": "camelcase@>=4.0.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz"
+        },
+        "clean-css": {
+          "version": "4.1.3",
+          "from": "clean-css@>=4.0.9 <5.0.0",
+          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.3.tgz"
+        },
+        "configstore": {
+          "version": "3.1.0",
+          "from": "configstore@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.0.tgz"
+        },
+        "dot-prop": {
+          "version": "4.1.1",
+          "from": "dot-prop@>=4.1.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-4.1.1.tgz"
+        },
+        "findup-sync": {
+          "version": "0.3.0",
+          "from": "findup-sync@>=0.3.0 <0.4.0",
+          "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.3.0.tgz",
+          "dependencies": {
+            "glob": {
+              "version": "5.0.15",
+              "from": "glob@>=5.0.0 <5.1.0",
+              "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
+            }
+          }
+        },
+        "got": {
+          "version": "6.7.1",
+          "from": "got@>=6.7.1 <7.0.0",
+          "resolved": "https://registry.npmjs.org/got/-/got-6.7.1.tgz"
+        },
+        "gulp-clean-css": {
+          "version": "3.0.4",
+          "from": "gulp-clean-css@>=3.0.4 <3.1.0",
+          "resolved": "https://registry.npmjs.org/gulp-clean-css/-/gulp-clean-css-3.0.4.tgz"
+        },
+        "gulp-postcss": {
+          "version": "6.3.0",
+          "from": "gulp-postcss@>=6.3.0 <6.4.0",
+          "resolved": "https://registry.npmjs.org/gulp-postcss/-/gulp-postcss-6.3.0.tgz"
+        },
+        "gulp-sass": {
+          "version": "3.1.0",
+          "from": "gulp-sass@>=3.1.0 <3.2.0",
+          "resolved": "https://registry.npmjs.org/gulp-sass/-/gulp-sass-3.1.0.tgz"
+        },
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "from": "is-fullwidth-code-point@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz"
+        },
+        "latest-version": {
+          "version": "3.1.0",
+          "from": "latest-version@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-3.1.0.tgz"
+        },
+        "lazy-req": {
+          "version": "2.0.0",
+          "from": "lazy-req@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/lazy-req/-/lazy-req-2.0.0.tgz"
+        },
+        "package-json": {
+          "version": "4.0.1",
+          "from": "package-json@>=4.0.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/package-json/-/package-json-4.0.1.tgz"
+        },
+        "postcss-modules": {
+          "version": "0.6.4",
+          "from": "postcss-modules@>=0.6.4 <0.7.0",
+          "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.6.4.tgz"
+        },
+        "string-width": {
+          "version": "2.0.0",
+          "from": "string-width@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.0.0.tgz"
+        },
+        "timed-out": {
+          "version": "4.0.1",
+          "from": "timed-out@>=4.0.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-4.0.1.tgz"
+        },
+        "tslint": {
+          "version": "4.5.1",
+          "from": "tslint@>=4.5.1 <4.6.0",
+          "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.5.1.tgz"
+        },
+        "typescript": {
+          "version": "2.2.2",
+          "from": "typescript@>=2.2.2 <2.3.0",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
+        },
+        "unzip-response": {
+          "version": "2.0.1",
+          "from": "unzip-response@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-2.0.1.tgz"
+        },
+        "update-notifier": {
+          "version": "2.1.0",
+          "from": "update-notifier@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-2.1.0.tgz"
+        },
+        "write-file-atomic": {
+          "version": "2.1.0",
+          "from": "write-file-atomic@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.1.0.tgz"
+        },
+        "xdg-basedir": {
+          "version": "3.0.0",
+          "from": "xdg-basedir@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-3.0.0.tgz"
+        }
+      }
     },
-    "@types/z-schema": {
-      "version": "3.16.31",
-      "from": "@types/z-schema@3.16.31",
-      "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.31.tgz"
+    "@rush-temp/example-app-base": {
+      "version": "0.0.0",
+      "from": "projects/example-app-base",
+      "resolved": "file:projects/example-app-base",
+      "dependencies": {
+        "async": {
+          "version": "0.9.2",
+          "from": "async@>=0.9.0 <0.10.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+        },
+        "debug": {
+          "version": "2.6.0",
+          "from": "debug@2.6.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
+        },
+        "es6-promise": {
+          "version": "4.1.0",
+          "from": "es6-promise@4.1.0",
+          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.0.tgz"
+        },
+        "glob": {
+          "version": "7.1.1",
+          "from": "glob@7.1.1",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
+        },
+        "mocha": {
+          "version": "3.3.0",
+          "from": "mocha@>=3.3.0 <3.4.0",
+          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz"
+        },
+        "ms": {
+          "version": "0.7.2",
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+        },
+        "source-map": {
+          "version": "0.1.43",
+          "from": "source-map@>=0.1.33 <0.2.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "from": "source-map-loader@0.2.1",
+          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
+        },
+        "supports-color": {
+          "version": "3.1.2",
+          "from": "supports-color@3.1.2",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
+        },
+        "typescript": {
+          "version": "2.2.2",
+          "from": "typescript@2.2.2",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
+        }
+      }
     },
-    "@uifabric/example-app-base": {
-      "version": "1.3.14",
-      "from": "@uifabric/example-app-base@>=1.3.12 <2.0.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-1.3.14.tgz",
+    "@rush-temp/example-component": {
+      "version": "0.0.0",
+      "from": "projects/example-component",
+      "resolved": "file:projects/example-component",
       "dependencies": {
-        "office-ui-fabric-core": {
-          "version": "5.1.0",
-          "from": "office-ui-fabric-core@>=5.0.0 <6.0.0",
-          "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-5.1.0.tgz"
+        "acorn": {
+          "version": "5.0.3",
+          "from": "acorn@>=5.0.0 <6.0.0",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
+        },
+        "async": {
+          "version": "2.4.1",
+          "from": "async@>=2.1.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+        },
+        "camelcase": {
+          "version": "3.0.0",
+          "from": "camelcase@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
+        },
+        "constants-browserify": {
+          "version": "1.0.0",
+          "from": "constants-browserify@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
+        },
+        "crypto-browserify": {
+          "version": "3.11.0",
+          "from": "crypto-browserify@>=3.11.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
+        },
+        "debug": {
+          "version": "2.6.0",
+          "from": "debug@2.6.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
+        },
+        "enhanced-resolve": {
+          "version": "3.1.0",
+          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
+        },
+        "glob": {
+          "version": "7.1.1",
+          "from": "glob@7.1.1",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
+        },
+        "https-browserify": {
+          "version": "0.0.1",
+          "from": "https-browserify@0.0.1",
+          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+        },
+        "mocha": {
+          "version": "3.4.2",
+          "from": "mocha@>=3.2.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.4.2.tgz"
+        },
+        "ms": {
+          "version": "0.7.2",
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+        },
+        "node-libs-browser": {
+          "version": "2.0.0",
+          "from": "node-libs-browser@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
+        },
+        "os-browserify": {
+          "version": "0.2.1",
+          "from": "os-browserify@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.5 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "dependencies": {
+            "string_decoder": {
+              "version": "1.0.1",
+              "from": "string_decoder@>=1.0.0 <1.1.0",
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+            }
+          }
+        },
+        "stream-browserify": {
+          "version": "2.0.1",
+          "from": "stream-browserify@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
+        },
+        "supports-color": {
+          "version": "3.1.2",
+          "from": "supports-color@3.1.2",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
+        },
+        "tapable": {
+          "version": "0.2.6",
+          "from": "tapable@>=0.2.5 <0.3.0",
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
+        },
+        "timers-browserify": {
+          "version": "2.0.2",
+          "from": "timers-browserify@>=2.0.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
+        },
+        "typescript": {
+          "version": "2.2.2",
+          "from": "typescript@2.2.2",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
+        },
+        "url": {
+          "version": "0.11.0",
+          "from": "url@>=0.11.0 <0.12.0",
+          "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
+          "dependencies": {
+            "punycode": {
+              "version": "1.3.2",
+              "from": "punycode@1.3.2",
+              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
+            }
+          }
+        },
+        "watchpack": {
+          "version": "1.3.1",
+          "from": "watchpack@>=1.3.1 <2.0.0",
+          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz"
+        },
+        "webpack": {
+          "version": "2.6.1",
+          "from": "webpack@>=2.4.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz"
+        },
+        "yargs": {
+          "version": "6.6.0",
+          "from": "yargs@>=6.0.0 <7.0.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
+        },
+        "yargs-parser": {
+          "version": "4.2.1",
+          "from": "yargs-parser@>=4.2.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
         }
       }
     },
-    "@uifabric/utilities": {
-      "version": "1.10.2",
-      "from": "@uifabric/utilities@>=1.10.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-1.10.2.tgz"
-    },
-    "abbrev": {
-      "version": "1.0.9",
-      "from": "abbrev@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.0.9.tgz"
-    },
-    "accepts": {
-      "version": "1.3.3",
-      "from": "accepts@1.3.3",
-      "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.3.tgz"
-    },
-    "acorn": {
-      "version": "3.3.0",
-      "from": "acorn@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-3.3.0.tgz"
-    },
-    "acorn-dynamic-import": {
-      "version": "2.0.2",
-      "from": "acorn-dynamic-import@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/acorn-dynamic-import/-/acorn-dynamic-import-2.0.2.tgz",
+    "@rush-temp/fabric-website": {
+      "version": "0.0.0",
+      "from": "projects/fabric-website",
+      "resolved": "file:projects/fabric-website",
       "dependencies": {
-        "acorn": {
-          "version": "4.0.13",
-          "from": "acorn@>=4.0.3 <5.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz"
+        "async": {
+          "version": "0.9.2",
+          "from": "async@>=0.9.0 <0.10.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+        },
+        "debug": {
+          "version": "2.6.0",
+          "from": "debug@2.6.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
+        },
+        "es6-promise": {
+          "version": "4.1.0",
+          "from": "es6-promise@4.1.0",
+          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.0.tgz"
+        },
+        "glob": {
+          "version": "7.1.1",
+          "from": "glob@7.1.1",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
+        },
+        "mocha": {
+          "version": "3.3.0",
+          "from": "mocha@>=3.3.0 <3.4.0",
+          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz"
+        },
+        "ms": {
+          "version": "0.7.2",
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+        },
+        "source-map": {
+          "version": "0.1.43",
+          "from": "source-map@>=0.1.33 <0.2.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "from": "source-map-loader@0.2.1",
+          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
+        },
+        "supports-color": {
+          "version": "3.1.2",
+          "from": "supports-color@3.1.2",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
+        },
+        "typescript": {
+          "version": "2.2.2",
+          "from": "typescript@2.2.2",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
         }
       }
     },
-    "after": {
-      "version": "0.8.2",
-      "from": "after@0.8.2",
-      "resolved": "https://registry.npmjs.org/after/-/after-0.8.2.tgz"
-    },
-    "ajv": {
-      "version": "4.11.8",
-      "from": "ajv@>=4.9.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz"
-    },
-    "ajv-keywords": {
-      "version": "1.5.1",
-      "from": "ajv-keywords@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-1.5.1.tgz"
-    },
-    "align-text": {
-      "version": "0.1.4",
-      "from": "align-text@>=0.1.3 <0.2.0",
-      "resolved": "https://registry.npmjs.org/align-text/-/align-text-0.1.4.tgz"
-    },
-    "alphanum-sort": {
-      "version": "1.0.2",
-      "from": "alphanum-sort@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/alphanum-sort/-/alphanum-sort-1.0.2.tgz"
-    },
-    "amdefine": {
-      "version": "1.0.1",
-      "from": "amdefine@>=0.0.4",
-      "resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz"
-    },
-    "ansi-align": {
-      "version": "2.0.0",
-      "from": "ansi-align@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-2.0.0.tgz",
+    "@rush-temp/office-ui-fabric-react": {
+      "version": "0.0.0",
+      "from": "projects/office-ui-fabric-react",
+      "resolved": "file:projects/office-ui-fabric-react",
       "dependencies": {
-        "is-fullwidth-code-point": {
+        "acorn": {
+          "version": "5.0.3",
+          "from": "acorn@>=5.0.0 <6.0.0",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
+        },
+        "async": {
+          "version": "0.9.2",
+          "from": "async@>=0.9.0 <0.10.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+        },
+        "camelcase": {
+          "version": "3.0.0",
+          "from": "camelcase@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
+        },
+        "constants-browserify": {
+          "version": "1.0.0",
+          "from": "constants-browserify@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
+        },
+        "crypto-browserify": {
+          "version": "3.11.0",
+          "from": "crypto-browserify@>=3.11.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
+        },
+        "debug": {
+          "version": "2.6.0",
+          "from": "debug@2.6.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
+        },
+        "enhanced-resolve": {
+          "version": "3.1.0",
+          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
+        },
+        "es6-promise": {
+          "version": "4.1.0",
+          "from": "es6-promise@4.1.0",
+          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.0.tgz"
+        },
+        "glob": {
+          "version": "7.1.1",
+          "from": "glob@7.1.1",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
+        },
+        "https-browserify": {
+          "version": "0.0.1",
+          "from": "https-browserify@0.0.1",
+          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+        },
+        "mocha": {
+          "version": "3.4.2",
+          "from": "mocha@>=3.2.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.4.2.tgz"
+        },
+        "ms": {
+          "version": "0.7.2",
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+        },
+        "node-libs-browser": {
           "version": "2.0.0",
-          "from": "is-fullwidth-code-point@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz"
+          "from": "node-libs-browser@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
+        },
+        "os-browserify": {
+          "version": "0.2.1",
+          "from": "os-browserify@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.5 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "dependencies": {
+            "string_decoder": {
+              "version": "1.0.1",
+              "from": "string_decoder@>=1.0.0 <1.1.0",
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+            }
+          }
+        },
+        "source-map": {
+          "version": "0.1.43",
+          "from": "source-map@>=0.1.33 <0.2.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
         },
-        "string-width": {
-          "version": "2.0.0",
-          "from": "string-width@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.0.0.tgz"
+        "source-map-loader": {
+          "version": "0.2.1",
+          "from": "source-map-loader@0.2.1",
+          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
+        },
+        "stream-browserify": {
+          "version": "2.0.1",
+          "from": "stream-browserify@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
+        },
+        "supports-color": {
+          "version": "3.1.2",
+          "from": "supports-color@3.1.2",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
+        },
+        "tapable": {
+          "version": "0.2.6",
+          "from": "tapable@>=0.2.5 <0.3.0",
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
+        },
+        "timers-browserify": {
+          "version": "2.0.2",
+          "from": "timers-browserify@>=2.0.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
+        },
+        "typescript": {
+          "version": "2.2.2",
+          "from": "typescript@2.2.2",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
+        },
+        "url": {
+          "version": "0.11.0",
+          "from": "url@>=0.11.0 <0.12.0",
+          "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
+          "dependencies": {
+            "punycode": {
+              "version": "1.3.2",
+              "from": "punycode@1.3.2",
+              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
+            }
+          }
+        },
+        "watchpack": {
+          "version": "1.3.1",
+          "from": "watchpack@>=1.3.1 <2.0.0",
+          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz",
+          "dependencies": {
+            "async": {
+              "version": "2.4.1",
+              "from": "async@>=2.1.2 <3.0.0",
+              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+            }
+          }
+        },
+        "webpack": {
+          "version": "2.6.1",
+          "from": "webpack@>=2.4.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz",
+          "dependencies": {
+            "async": {
+              "version": "2.4.1",
+              "from": "async@>=2.1.2 <3.0.0",
+              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+            },
+            "source-map": {
+              "version": "0.5.6",
+              "from": "source-map@^0.5.3",
+              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
+            }
+          }
+        },
+        "yargs": {
+          "version": "6.6.0",
+          "from": "yargs@>=6.0.0 <7.0.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
+        },
+        "yargs-parser": {
+          "version": "4.2.1",
+          "from": "yargs-parser@>=4.2.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
         }
       }
     },
-    "ansi-escapes": {
-      "version": "1.4.0",
-      "from": "ansi-escapes@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz"
-    },
-    "ansi-html": {
-      "version": "0.0.7",
-      "from": "ansi-html@0.0.7",
-      "resolved": "https://registry.npmjs.org/ansi-html/-/ansi-html-0.0.7.tgz"
-    },
-    "ansi-regex": {
-      "version": "2.1.1",
-      "from": "ansi-regex@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz"
-    },
-    "ansi-styles": {
-      "version": "2.2.1",
-      "from": "ansi-styles@>=2.2.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz"
-    },
-    "ansicolors": {
-      "version": "0.2.1",
-      "from": "ansicolors@>=0.2.1 <0.3.0",
-      "resolved": "https://registry.npmjs.org/ansicolors/-/ansicolors-0.2.1.tgz"
-    },
-    "anymatch": {
-      "version": "1.3.0",
-      "from": "anymatch@>=1.3.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-1.3.0.tgz"
-    },
-    "aproba": {
-      "version": "1.1.1",
-      "from": "aproba@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.1.1.tgz"
-    },
-    "archy": {
-      "version": "1.0.0",
-      "from": "archy@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/archy/-/archy-1.0.0.tgz"
-    },
-    "are-we-there-yet": {
-      "version": "1.1.4",
-      "from": "are-we-there-yet@>=1.1.2 <1.2.0",
-      "resolved": "https://registry.npmjs.org/are-we-there-yet/-/are-we-there-yet-1.1.4.tgz"
-    },
-    "argparse": {
-      "version": "1.0.9",
-      "from": "argparse@>=1.0.7 <2.0.0",
-      "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.9.tgz"
-    },
-    "arr-diff": {
-      "version": "2.0.0",
-      "from": "arr-diff@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz"
-    },
-    "arr-flatten": {
-      "version": "1.0.3",
-      "from": "arr-flatten@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.0.3.tgz"
-    },
-    "array-differ": {
-      "version": "1.0.0",
-      "from": "array-differ@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/array-differ/-/array-differ-1.0.0.tgz"
-    },
-    "array-find-index": {
-      "version": "1.0.2",
-      "from": "array-find-index@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/array-find-index/-/array-find-index-1.0.2.tgz"
-    },
-    "array-flatten": {
-      "version": "1.1.1",
-      "from": "array-flatten@1.1.1",
-      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz"
-    },
-    "array-slice": {
-      "version": "0.2.3",
-      "from": "array-slice@>=0.2.3 <0.3.0",
-      "resolved": "https://registry.npmjs.org/array-slice/-/array-slice-0.2.3.tgz"
-    },
-    "array-union": {
-      "version": "1.0.2",
-      "from": "array-union@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz"
-    },
-    "array-uniq": {
-      "version": "1.0.3",
-      "from": "array-uniq@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz"
-    },
-    "array-unique": {
-      "version": "0.2.1",
-      "from": "array-unique@>=0.2.1 <0.3.0",
-      "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz"
-    },
-    "arraybuffer.slice": {
-      "version": "0.0.6",
-      "from": "arraybuffer.slice@0.0.6",
-      "resolved": "https://registry.npmjs.org/arraybuffer.slice/-/arraybuffer.slice-0.0.6.tgz"
-    },
-    "arrify": {
-      "version": "1.0.1",
-      "from": "arrify@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz"
-    },
-    "asap": {
-      "version": "2.0.5",
-      "from": "asap@>=2.0.3 <2.1.0",
-      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.5.tgz"
-    },
-    "asn1": {
-      "version": "0.2.3",
-      "from": "asn1@>=0.2.3 <0.3.0",
-      "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.3.tgz"
-    },
-    "asn1.js": {
-      "version": "4.9.1",
-      "from": "asn1.js@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-4.9.1.tgz"
-    },
-    "assert": {
-      "version": "1.4.1",
-      "from": "assert@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/assert/-/assert-1.4.1.tgz"
-    },
-    "assert-plus": {
-      "version": "0.2.0",
-      "from": "assert-plus@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-0.2.0.tgz"
-    },
-    "assertion-error": {
-      "version": "1.0.2",
-      "from": "assertion-error@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-1.0.2.tgz"
-    },
-    "ast-types": {
-      "version": "0.9.6",
-      "from": "ast-types@0.9.6",
-      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.9.6.tgz"
-    },
-    "async": {
-      "version": "1.5.2",
-      "from": "async@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz"
-    },
-    "async-each": {
-      "version": "1.0.1",
-      "from": "async-each@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/async-each/-/async-each-1.0.1.tgz"
-    },
-    "async-foreach": {
-      "version": "0.1.3",
-      "from": "async-foreach@>=0.1.3 <0.2.0",
-      "resolved": "https://registry.npmjs.org/async-foreach/-/async-foreach-0.1.3.tgz"
-    },
-    "asynckit": {
-      "version": "0.4.0",
-      "from": "asynckit@>=0.4.0 <0.5.0",
-      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz"
-    },
-    "autoprefixer": {
-      "version": "6.3.7",
-      "from": "autoprefixer@6.3.7",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz"
-    },
-    "aws-sign2": {
-      "version": "0.6.0",
-      "from": "aws-sign2@>=0.6.0 <0.7.0",
-      "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz"
-    },
-    "aws4": {
-      "version": "1.6.0",
-      "from": "aws4@>=1.2.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.6.0.tgz"
+    "@rush-temp/office-ui-fabric-react-tslint": {
+      "version": "0.0.0",
+      "from": "projects/office-ui-fabric-react-tslint",
+      "resolved": "file:projects/office-ui-fabric-react-tslint"
     },
-    "azure-storage": {
-      "version": "0.10.0",
-      "from": "azure-storage@>=0.10.0 <0.11.0",
-      "resolved": "https://registry.npmjs.org/azure-storage/-/azure-storage-0.10.0.tgz",
+    "@rush-temp/ssr-tests": {
+      "version": "0.0.0",
+      "from": "projects/ssr-tests",
+      "resolved": "file:projects/ssr-tests",
       "dependencies": {
+        "acorn": {
+          "version": "5.0.3",
+          "from": "acorn@>=5.0.0 <6.0.0",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
+        },
         "async": {
           "version": "2.4.1",
-          "from": "async@>=2.0.1 <3.0.0",
+          "from": "async@>=2.1.2 <3.0.0",
           "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
         },
-        "caseless": {
-          "version": "0.11.0",
-          "from": "caseless@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz"
+        "camelcase": {
+          "version": "3.0.0",
+          "from": "camelcase@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
+        },
+        "constants-browserify": {
+          "version": "1.0.0",
+          "from": "constants-browserify@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
         },
-        "extend": {
-          "version": "1.2.1",
-          "from": "extend@>=1.2.1 <1.3.0",
-          "resolved": "https://registry.npmjs.org/extend/-/extend-1.2.1.tgz"
+        "crypto-browserify": {
+          "version": "3.11.0",
+          "from": "crypto-browserify@>=3.11.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
         },
-        "form-data": {
-          "version": "1.0.1",
-          "from": "form-data@>=1.0.0-rc3 <1.1.0",
-          "resolved": "https://registry.npmjs.org/form-data/-/form-data-1.0.1.tgz"
+        "debug": {
+          "version": "2.6.0",
+          "from": "debug@2.6.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
         },
-        "har-validator": {
-          "version": "2.0.6",
-          "from": "har-validator@>=2.0.6 <2.1.0",
-          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz"
+        "enhanced-resolve": {
+          "version": "3.1.0",
+          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
         },
-        "qs": {
-          "version": "6.0.4",
-          "from": "qs@>=6.0.2 <6.1.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-6.0.4.tgz"
+        "es6-promise": {
+          "version": "4.1.0",
+          "from": "es6-promise@>=4.1.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.0.tgz"
         },
-        "readable-stream": {
-          "version": "2.0.6",
-          "from": "readable-stream@>=2.0.0 <2.1.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz"
+        "glob": {
+          "version": "7.1.1",
+          "from": "glob@7.1.1",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
         },
-        "request": {
-          "version": "2.69.0",
-          "from": "request@>=2.69.0 <2.70.0",
-          "resolved": "https://registry.npmjs.org/request/-/request-2.69.0.tgz",
+        "https-browserify": {
+          "version": "0.0.1",
+          "from": "https-browserify@0.0.1",
+          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+        },
+        "mocha": {
+          "version": "3.3.0",
+          "from": "mocha@>=3.3.0 <3.4.0",
+          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz"
+        },
+        "ms": {
+          "version": "0.7.2",
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+        },
+        "node-libs-browser": {
+          "version": "2.0.0",
+          "from": "node-libs-browser@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
+        },
+        "os-browserify": {
+          "version": "0.2.1",
+          "from": "os-browserify@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.5 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
           "dependencies": {
-            "extend": {
-              "version": "3.0.1",
-              "from": "extend@~3.0.0",
-              "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz"
+            "string_decoder": {
+              "version": "1.0.1",
+              "from": "string_decoder@>=1.0.0 <1.1.0",
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
             }
           }
         },
-        "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.0 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
+        "stream-browserify": {
+          "version": "2.0.1",
+          "from": "stream-browserify@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
         },
-        "tough-cookie": {
-          "version": "2.2.2",
-          "from": "tough-cookie@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.2.2.tgz"
+        "supports-color": {
+          "version": "3.1.2",
+          "from": "supports-color@3.1.2",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
         },
-        "tunnel-agent": {
-          "version": "0.4.3",
-          "from": "tunnel-agent@>=0.4.1 <0.5.0",
-          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz"
+        "tapable": {
+          "version": "0.2.6",
+          "from": "tapable@>=0.2.5 <0.3.0",
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
         },
-        "validator": {
-          "version": "3.22.2",
-          "from": "validator@>=3.22.2 <3.23.0",
-          "resolved": "https://registry.npmjs.org/validator/-/validator-3.22.2.tgz"
-        }
-      }
-    },
-    "babel-code-frame": {
-      "version": "6.22.0",
-      "from": "babel-code-frame@>=6.20.0 <7.0.0",
-      "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.22.0.tgz"
-    },
-    "babel-runtime": {
-      "version": "6.23.0",
-      "from": "babel-runtime@>=6.18.0 <7.0.0",
-      "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.23.0.tgz",
-      "dependencies": {
-        "core-js": {
-          "version": "2.4.1",
-          "from": "core-js@>=2.4.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.4.1.tgz"
-        }
-      }
-    },
-    "backo2": {
-      "version": "1.0.2",
-      "from": "backo2@1.0.2",
-      "resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz"
-    },
-    "balanced-match": {
-      "version": "0.4.2",
-      "from": "balanced-match@>=0.4.1 <0.5.0",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-0.4.2.tgz"
-    },
-    "base62": {
-      "version": "1.2.0",
-      "from": "base62@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/base62/-/base62-1.2.0.tgz"
-    },
-    "Base64": {
-      "version": "0.2.1",
-      "from": "Base64@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/Base64/-/Base64-0.2.1.tgz"
-    },
-    "base64-arraybuffer": {
-      "version": "0.1.5",
-      "from": "base64-arraybuffer@0.1.5",
-      "resolved": "https://registry.npmjs.org/base64-arraybuffer/-/base64-arraybuffer-0.1.5.tgz"
-    },
-    "base64-js": {
-      "version": "1.2.0",
-      "from": "base64-js@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.2.0.tgz"
-    },
-    "base64-url": {
-      "version": "1.2.1",
-      "from": "base64-url@1.2.1",
-      "resolved": "https://registry.npmjs.org/base64-url/-/base64-url-1.2.1.tgz"
-    },
-    "base64id": {
-      "version": "1.0.0",
-      "from": "base64id@1.0.0",
-      "resolved": "https://registry.npmjs.org/base64id/-/base64id-1.0.0.tgz"
-    },
-    "basic-auth": {
-      "version": "1.0.4",
-      "from": "basic-auth@>=1.0.3 <1.1.0",
-      "resolved": "https://registry.npmjs.org/basic-auth/-/basic-auth-1.0.4.tgz"
-    },
-    "basic-auth-connect": {
-      "version": "1.0.0",
-      "from": "basic-auth-connect@1.0.0",
-      "resolved": "https://registry.npmjs.org/basic-auth-connect/-/basic-auth-connect-1.0.0.tgz"
-    },
-    "batch": {
-      "version": "0.5.3",
-      "from": "batch@>=0.5.3 <0.6.0",
-      "resolved": "https://registry.npmjs.org/batch/-/batch-0.5.3.tgz"
-    },
-    "bcrypt-pbkdf": {
-      "version": "1.0.1",
-      "from": "bcrypt-pbkdf@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/bcrypt-pbkdf/-/bcrypt-pbkdf-1.0.1.tgz",
-      "optional": true
-    },
-    "beeper": {
-      "version": "1.1.1",
-      "from": "beeper@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/beeper/-/beeper-1.1.1.tgz"
-    },
-    "better-assert": {
-      "version": "1.0.2",
-      "from": "better-assert@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/better-assert/-/better-assert-1.0.2.tgz"
-    },
-    "big.js": {
-      "version": "3.1.3",
-      "from": "big.js@>=3.1.3 <4.0.0",
-      "resolved": "https://registry.npmjs.org/big.js/-/big.js-3.1.3.tgz"
-    },
-    "binary-extensions": {
-      "version": "1.8.0",
-      "from": "binary-extensions@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.8.0.tgz"
-    },
-    "binaryextensions": {
-      "version": "1.0.1",
-      "from": "binaryextensions@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/binaryextensions/-/binaryextensions-1.0.1.tgz"
-    },
-    "bindings": {
-      "version": "1.2.1",
-      "from": "bindings@>=1.2.1 <1.3.0",
-      "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.2.1.tgz"
-    },
-    "bl": {
-      "version": "1.0.3",
-      "from": "bl@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/bl/-/bl-1.0.3.tgz",
-      "dependencies": {
-        "readable-stream": {
-          "version": "2.0.6",
-          "from": "readable-stream@>=2.0.5 <2.1.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz"
+        "timers-browserify": {
+          "version": "2.0.2",
+          "from": "timers-browserify@>=2.0.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
         },
-        "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.0 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
-        }
-      }
-    },
-    "blob": {
-      "version": "0.0.4",
-      "from": "blob@0.0.4",
-      "resolved": "https://registry.npmjs.org/blob/-/blob-0.0.4.tgz"
-    },
-    "block-stream": {
-      "version": "0.0.9",
-      "from": "block-stream@*",
-      "resolved": "https://registry.npmjs.org/block-stream/-/block-stream-0.0.9.tgz"
-    },
-    "bluebird": {
-      "version": "2.11.0",
-      "from": "bluebird@>=2.9.27 <3.0.0",
-      "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-2.11.0.tgz"
-    },
-    "bn.js": {
-      "version": "4.11.6",
-      "from": "bn.js@>=4.1.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.6.tgz"
-    },
-    "body-parser": {
-      "version": "1.17.2",
-      "from": "body-parser@>=1.12.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.17.2.tgz",
-      "dependencies": {
-        "iconv-lite": {
-          "version": "0.4.15",
-          "from": "iconv-lite@0.4.15",
-          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.15.tgz"
+        "url": {
+          "version": "0.11.0",
+          "from": "url@>=0.11.0 <0.12.0",
+          "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
+          "dependencies": {
+            "punycode": {
+              "version": "1.3.2",
+              "from": "punycode@1.3.2",
+              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
+            }
+          }
+        },
+        "watchpack": {
+          "version": "1.3.1",
+          "from": "watchpack@>=1.3.1 <2.0.0",
+          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz"
+        },
+        "webpack": {
+          "version": "2.6.1",
+          "from": "webpack@>=2.4.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz"
+        },
+        "yargs": {
+          "version": "6.6.0",
+          "from": "yargs@>=6.0.0 <7.0.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
+        },
+        "yargs-parser": {
+          "version": "4.2.1",
+          "from": "yargs-parser@>=4.2.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
         }
       }
     },
-    "boolbase": {
-      "version": "1.0.0",
-      "from": "boolbase@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz"
-    },
-    "boom": {
-      "version": "2.10.1",
-      "from": "boom@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz"
-    },
-    "boxen": {
-      "version": "1.1.0",
-      "from": "boxen@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/boxen/-/boxen-1.1.0.tgz",
+    "@rush-temp/styling": {
+      "version": "0.0.0",
+      "from": "projects/styling",
+      "resolved": "file:projects/styling",
       "dependencies": {
+        "acorn": {
+          "version": "5.0.3",
+          "from": "acorn@>=5.0.0 <6.0.0",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
+        },
+        "async": {
+          "version": "0.9.2",
+          "from": "async@>=0.9.0 <0.10.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+        },
         "camelcase": {
+          "version": "3.0.0",
+          "from": "camelcase@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
+        },
+        "constants-browserify": {
+          "version": "1.0.0",
+          "from": "constants-browserify@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
+        },
+        "crypto-browserify": {
+          "version": "3.11.0",
+          "from": "crypto-browserify@>=3.11.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
+        },
+        "debug": {
+          "version": "2.6.0",
+          "from": "debug@2.6.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
+        },
+        "enhanced-resolve": {
+          "version": "3.1.0",
+          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
+        },
+        "es6-promise": {
           "version": "4.1.0",
-          "from": "camelcase@>=4.0.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz"
+          "from": "es6-promise@4.1.0",
+          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.0.tgz"
         },
-        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "from": "is-fullwidth-code-point@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz"
+        "glob": {
+          "version": "7.1.1",
+          "from": "glob@7.1.1",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
         },
-        "string-width": {
-          "version": "2.0.0",
-          "from": "string-width@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.0.0.tgz"
-        }
-      }
-    },
-    "brace-expansion": {
-      "version": "1.1.7",
-      "from": "brace-expansion@>=1.1.7 <2.0.0",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.7.tgz"
-    },
-    "braces": {
-      "version": "1.8.5",
-      "from": "braces@>=1.8.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz"
-    },
-    "brorand": {
-      "version": "1.1.0",
-      "from": "brorand@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/brorand/-/brorand-1.1.0.tgz"
-    },
-    "browser-stdout": {
-      "version": "1.3.0",
-      "from": "browser-stdout@1.3.0",
-      "resolved": "https://registry.npmjs.org/browser-stdout/-/browser-stdout-1.3.0.tgz"
-    },
-    "browserify-aes": {
-      "version": "1.0.6",
-      "from": "browserify-aes@>=1.0.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.6.tgz"
-    },
-    "browserify-cipher": {
-      "version": "1.0.0",
-      "from": "browserify-cipher@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/browserify-cipher/-/browserify-cipher-1.0.0.tgz"
-    },
-    "browserify-des": {
-      "version": "1.0.0",
-      "from": "browserify-des@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/browserify-des/-/browserify-des-1.0.0.tgz"
-    },
-    "browserify-mime": {
-      "version": "1.2.9",
-      "from": "browserify-mime@>=1.2.9 <1.3.0",
-      "resolved": "https://registry.npmjs.org/browserify-mime/-/browserify-mime-1.2.9.tgz"
-    },
-    "browserify-rsa": {
-      "version": "4.0.1",
-      "from": "browserify-rsa@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz"
-    },
-    "browserify-sign": {
-      "version": "4.0.4",
-      "from": "browserify-sign@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/browserify-sign/-/browserify-sign-4.0.4.tgz"
-    },
-    "browserify-zlib": {
-      "version": "0.1.4",
-      "from": "browserify-zlib@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/browserify-zlib/-/browserify-zlib-0.1.4.tgz"
-    },
-    "browserslist": {
-      "version": "1.3.6",
-      "from": "browserslist@>=1.3.4 <1.4.0",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.3.6.tgz"
-    },
-    "buffer": {
-      "version": "4.9.1",
-      "from": "buffer@>=4.9.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/buffer/-/buffer-4.9.1.tgz"
-    },
-    "buffer-shims": {
-      "version": "1.0.0",
-      "from": "buffer-shims@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/buffer-shims/-/buffer-shims-1.0.0.tgz"
-    },
-    "buffer-xor": {
-      "version": "1.0.3",
-      "from": "buffer-xor@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/buffer-xor/-/buffer-xor-1.0.3.tgz"
-    },
-    "bufferstreams": {
-      "version": "1.0.1",
-      "from": "bufferstreams@1.0.1",
-      "resolved": "https://registry.npmjs.org/bufferstreams/-/bufferstreams-1.0.1.tgz",
-      "dependencies": {
-        "isarray": {
+        "https-browserify": {
           "version": "0.0.1",
-          "from": "isarray@0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
+          "from": "https-browserify@0.0.1",
+          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+        },
+        "mocha": {
+          "version": "3.4.2",
+          "from": "mocha@>=3.2.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.4.2.tgz"
+        },
+        "ms": {
+          "version": "0.7.2",
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+        },
+        "node-libs-browser": {
+          "version": "2.0.0",
+          "from": "node-libs-browser@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
+        },
+        "os-browserify": {
+          "version": "0.2.1",
+          "from": "os-browserify@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.5 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "dependencies": {
+            "string_decoder": {
+              "version": "1.0.1",
+              "from": "string_decoder@>=1.0.0 <1.1.0",
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+            }
+          }
+        },
+        "source-map": {
+          "version": "0.1.43",
+          "from": "source-map@>=0.1.33 <0.2.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "from": "source-map-loader@>=0.2.1 <0.3.0",
+          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
+        },
+        "stream-browserify": {
+          "version": "2.0.1",
+          "from": "stream-browserify@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
+        },
+        "supports-color": {
+          "version": "3.1.2",
+          "from": "supports-color@3.1.2",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
+        },
+        "tapable": {
+          "version": "0.2.6",
+          "from": "tapable@>=0.2.5 <0.3.0",
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
+        },
+        "timers-browserify": {
+          "version": "2.0.2",
+          "from": "timers-browserify@>=2.0.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
+        },
+        "typescript": {
+          "version": "2.2.2",
+          "from": "typescript@2.2.2",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
+        },
+        "url": {
+          "version": "0.11.0",
+          "from": "url@>=0.11.0 <0.12.0",
+          "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
+          "dependencies": {
+            "punycode": {
+              "version": "1.3.2",
+              "from": "punycode@1.3.2",
+              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
+            }
+          }
+        },
+        "watchpack": {
+          "version": "1.3.1",
+          "from": "watchpack@>=1.3.1 <2.0.0",
+          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz",
+          "dependencies": {
+            "async": {
+              "version": "2.4.1",
+              "from": "async@>=2.1.2 <3.0.0",
+              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+            }
+          }
+        },
+        "webpack": {
+          "version": "2.6.1",
+          "from": "webpack@>=2.4.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz",
+          "dependencies": {
+            "async": {
+              "version": "2.4.1",
+              "from": "async@>=2.1.2 <3.0.0",
+              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+            },
+            "source-map": {
+              "version": "0.5.6",
+              "from": "source-map@^0.5.3",
+              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
+            }
+          }
         },
-        "readable-stream": {
-          "version": "1.1.14",
-          "from": "readable-stream@>=1.0.33 <2.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz"
+        "yargs": {
+          "version": "6.6.0",
+          "from": "yargs@>=6.0.0 <7.0.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
         },
-        "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.0 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
+        "yargs-parser": {
+          "version": "4.2.1",
+          "from": "yargs-parser@>=4.2.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
         }
       }
     },
-    "builtin-modules": {
-      "version": "1.1.1",
-      "from": "builtin-modules@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz"
-    },
-    "builtin-status-codes": {
-      "version": "3.0.0",
-      "from": "builtin-status-codes@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz"
-    },
-    "bytes": {
-      "version": "2.4.0",
-      "from": "bytes@2.4.0",
-      "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz"
-    },
-    "cache-swap": {
-      "version": "0.3.0",
-      "from": "cache-swap@>=0.3.0 <0.4.0",
-      "resolved": "https://registry.npmjs.org/cache-swap/-/cache-swap-0.3.0.tgz"
-    },
-    "callsite": {
-      "version": "1.0.0",
-      "from": "callsite@1.0.0",
-      "resolved": "https://registry.npmjs.org/callsite/-/callsite-1.0.0.tgz"
-    },
-    "camel-case": {
-      "version": "3.0.0",
-      "from": "camel-case@>=3.0.0 <3.1.0",
-      "resolved": "https://registry.npmjs.org/camel-case/-/camel-case-3.0.0.tgz"
-    },
-    "camelcase": {
-      "version": "2.1.1",
-      "from": "camelcase@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz"
-    },
-    "camelcase-keys": {
-      "version": "2.1.0",
-      "from": "camelcase-keys@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/camelcase-keys/-/camelcase-keys-2.1.0.tgz"
-    },
-    "caniuse-api": {
-      "version": "1.6.1",
-      "from": "caniuse-api@>=1.5.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/caniuse-api/-/caniuse-api-1.6.1.tgz"
-    },
-    "caniuse-db": {
-      "version": "1.0.30000673",
-      "from": "caniuse-db@>=1.0.30000488 <2.0.0",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000673.tgz"
-    },
-    "capture-stack-trace": {
-      "version": "1.0.0",
-      "from": "capture-stack-trace@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/capture-stack-trace/-/capture-stack-trace-1.0.0.tgz"
-    },
-    "cardinal": {
-      "version": "1.0.0",
-      "from": "cardinal@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/cardinal/-/cardinal-1.0.0.tgz"
-    },
-    "caseless": {
-      "version": "0.12.0",
-      "from": "caseless@>=0.12.0 <0.13.0",
-      "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz"
-    },
-    "casperjs": {
-      "version": "1.1.3",
-      "from": "casperjs@1.1.3",
-      "resolved": "https://registry.npmjs.org/casperjs/-/casperjs-1.1.3.tgz"
-    },
-    "center-align": {
-      "version": "0.1.3",
-      "from": "center-align@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/center-align/-/center-align-0.1.3.tgz"
-    },
-    "chai": {
-      "version": "3.5.0",
-      "from": "chai@>=3.5.0 <3.6.0",
-      "resolved": "https://registry.npmjs.org/chai/-/chai-3.5.0.tgz"
-    },
-    "chalk": {
-      "version": "1.1.3",
-      "from": "chalk@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz"
-    },
-    "charenc": {
-      "version": "0.0.2",
-      "from": "charenc@>=0.0.1 <0.1.0",
-      "resolved": "https://registry.npmjs.org/charenc/-/charenc-0.0.2.tgz"
-    },
-    "cheerio": {
-      "version": "0.22.0",
-      "from": "cheerio@>=0.22.0 <0.23.0",
-      "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-0.22.0.tgz"
-    },
-    "chokidar": {
-      "version": "1.7.0",
-      "from": "chokidar@>=1.4.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-1.7.0.tgz"
-    },
-    "cipher-base": {
-      "version": "1.0.3",
-      "from": "cipher-base@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/cipher-base/-/cipher-base-1.0.3.tgz"
-    },
-    "clap": {
-      "version": "1.1.3",
-      "from": "clap@>=1.0.9 <2.0.0",
-      "resolved": "https://registry.npmjs.org/clap/-/clap-1.1.3.tgz"
-    },
-    "clean-css": {
-      "version": "4.1.3",
-      "from": "clean-css@>=4.0.9 <5.0.0",
-      "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.3.tgz",
+    "@rush-temp/test-bundle-button": {
+      "version": "0.0.0",
+      "from": "projects/test-bundle-button",
+      "resolved": "file:projects/test-bundle-button",
       "dependencies": {
+        "async": {
+          "version": "0.9.2",
+          "from": "async@>=0.9.0 <0.10.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+        },
         "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.0 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
-        }
-      }
-    },
-    "cli-boxes": {
-      "version": "1.0.0",
-      "from": "cli-boxes@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/cli-boxes/-/cli-boxes-1.0.0.tgz"
-    },
-    "cli-cursor": {
-      "version": "1.0.2",
-      "from": "cli-cursor@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-1.0.2.tgz"
-    },
-    "cli-table": {
-      "version": "0.3.1",
-      "from": "cli-table@>=0.3.1 <0.4.0",
-      "resolved": "https://registry.npmjs.org/cli-table/-/cli-table-0.3.1.tgz",
-      "dependencies": {
-        "colors": {
-          "version": "1.0.3",
-          "from": "colors@1.0.3",
-          "resolved": "https://registry.npmjs.org/colors/-/colors-1.0.3.tgz"
-        }
-      }
-    },
-    "cli-usage": {
-      "version": "0.1.4",
-      "from": "cli-usage@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/cli-usage/-/cli-usage-0.1.4.tgz"
-    },
-    "cli-width": {
-      "version": "1.1.1",
-      "from": "cli-width@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-1.1.1.tgz"
-    },
-    "cliui": {
-      "version": "3.2.0",
-      "from": "cliui@>=3.2.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz"
-    },
-    "clone": {
-      "version": "1.0.2",
-      "from": "clone@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.2.tgz"
-    },
-    "clone-buffer": {
-      "version": "1.0.0",
-      "from": "clone-buffer@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/clone-buffer/-/clone-buffer-1.0.0.tgz"
-    },
-    "clone-deep": {
-      "version": "0.2.4",
-      "from": "clone-deep@>=0.2.4 <0.3.0",
-      "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-0.2.4.tgz"
-    },
-    "clone-stats": {
-      "version": "0.0.1",
-      "from": "clone-stats@>=0.0.1 <0.0.2",
-      "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-0.0.1.tgz"
-    },
-    "cloneable-readable": {
-      "version": "1.0.0",
-      "from": "cloneable-readable@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/cloneable-readable/-/cloneable-readable-1.0.0.tgz"
-    },
-    "co": {
-      "version": "4.6.0",
-      "from": "co@>=4.6.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz"
-    },
-    "coa": {
-      "version": "1.0.2",
-      "from": "coa@>=1.0.1 <1.1.0",
-      "resolved": "https://registry.npmjs.org/coa/-/coa-1.0.2.tgz"
-    },
-    "code-point-at": {
-      "version": "1.1.0",
-      "from": "code-point-at@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz"
-    },
-    "color": {
-      "version": "0.11.4",
-      "from": "color@>=0.11.0 <0.12.0",
-      "resolved": "https://registry.npmjs.org/color/-/color-0.11.4.tgz"
-    },
-    "color-convert": {
-      "version": "1.9.0",
-      "from": "color-convert@>=1.3.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.0.tgz"
-    },
-    "color-functions": {
-      "version": "1.1.0",
-      "from": "color-functions@1.1.0",
-      "resolved": "https://registry.npmjs.org/color-functions/-/color-functions-1.1.0.tgz"
-    },
-    "color-name": {
-      "version": "1.1.2",
-      "from": "color-name@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.2.tgz"
-    },
-    "color-string": {
-      "version": "0.3.0",
-      "from": "color-string@>=0.3.0 <0.4.0",
-      "resolved": "https://registry.npmjs.org/color-string/-/color-string-0.3.0.tgz"
-    },
-    "colormin": {
-      "version": "1.1.2",
-      "from": "colormin@>=1.0.5 <2.0.0",
-      "resolved": "https://registry.npmjs.org/colormin/-/colormin-1.1.2.tgz"
-    },
-    "colors": {
-      "version": "1.1.2",
-      "from": "colors@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/colors/-/colors-1.1.2.tgz"
-    },
-    "combined-stream": {
-      "version": "1.0.5",
-      "from": "combined-stream@>=1.0.5 <1.1.0",
-      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz"
-    },
-    "commander": {
-      "version": "2.9.0",
-      "from": "commander@>=2.7.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz"
+          "version": "0.1.43",
+          "from": "source-map@>=0.1.33 <0.2.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "from": "source-map-loader@>=0.2.1 <0.3.0",
+          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
+        }
+      }
     },
-    "commoner": {
-      "version": "0.10.8",
-      "from": "commoner@>=0.10.1 <0.11.0",
-      "resolved": "https://registry.npmjs.org/commoner/-/commoner-0.10.8.tgz",
+    "@rush-temp/todo-app": {
+      "version": "0.0.0",
+      "from": "projects/todo-app",
+      "resolved": "file:projects/todo-app",
       "dependencies": {
-        "glob": {
-          "version": "5.0.15",
-          "from": "glob@>=5.0.15 <6.0.0",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
+        "es6-promise": {
+          "version": "4.1.0",
+          "from": "es6-promise@>=4.1.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.0.tgz"
+        },
+        "typescript": {
+          "version": "2.2.2",
+          "from": "typescript@2.2.2",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
         }
       }
     },
-    "component-bind": {
-      "version": "1.0.0",
-      "from": "component-bind@1.0.0",
-      "resolved": "https://registry.npmjs.org/component-bind/-/component-bind-1.0.0.tgz"
-    },
-    "component-emitter": {
-      "version": "1.1.2",
-      "from": "component-emitter@1.1.2",
-      "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.1.2.tgz"
-    },
-    "component-inherit": {
-      "version": "0.0.3",
-      "from": "component-inherit@0.0.3",
-      "resolved": "https://registry.npmjs.org/component-inherit/-/component-inherit-0.0.3.tgz"
-    },
-    "compressible": {
-      "version": "2.0.10",
-      "from": "compressible@>=2.0.5 <2.1.0",
-      "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.10.tgz"
-    },
-    "compression": {
-      "version": "1.5.2",
-      "from": "compression@>=1.5.2 <1.6.0",
-      "resolved": "https://registry.npmjs.org/compression/-/compression-1.5.2.tgz",
+    "@rush-temp/utilities": {
+      "version": "0.0.0",
+      "from": "projects/utilities",
+      "resolved": "file:projects/utilities",
       "dependencies": {
-        "accepts": {
-          "version": "1.2.13",
-          "from": "accepts@>=1.2.12 <1.3.0",
-          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.2.13.tgz"
-        },
-        "bytes": {
-          "version": "2.1.0",
-          "from": "bytes@2.1.0",
-          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.1.0.tgz"
+        "async": {
+          "version": "0.9.2",
+          "from": "async@>=0.9.0 <0.10.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
         },
         "debug": {
-          "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "version": "2.6.0",
+          "from": "debug@2.6.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
+        },
+        "es6-promise": {
+          "version": "4.1.0",
+          "from": "es6-promise@4.1.0",
+          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.0.tgz"
+        },
+        "glob": {
+          "version": "7.1.1",
+          "from": "glob@7.1.1",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
+        },
+        "mocha": {
+          "version": "3.3.0",
+          "from": "mocha@>=3.3.0 <3.4.0",
+          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz"
         },
         "ms": {
-          "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "version": "0.7.2",
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
         },
-        "negotiator": {
-          "version": "0.5.3",
-          "from": "negotiator@0.5.3",
-          "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.5.3.tgz"
+        "source-map": {
+          "version": "0.1.43",
+          "from": "source-map@>=0.1.33 <0.2.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
         },
-        "vary": {
-          "version": "1.0.1",
-          "from": "vary@>=1.0.1 <1.1.0",
-          "resolved": "https://registry.npmjs.org/vary/-/vary-1.0.1.tgz"
+        "source-map-loader": {
+          "version": "0.2.1",
+          "from": "source-map-loader@>=0.2.1 <0.3.0",
+          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
+        },
+        "supports-color": {
+          "version": "3.1.2",
+          "from": "supports-color@3.1.2",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
+        },
+        "typescript": {
+          "version": "2.2.2",
+          "from": "typescript@2.2.2",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
         }
       }
     },
-    "concat-map": {
-      "version": "0.0.1",
-      "from": "concat-map@0.0.1",
-      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz"
+    "@types/assertion-error": {
+      "version": "1.0.30",
+      "from": "@types/assertion-error@1.0.30",
+      "resolved": "https://registry.npmjs.org/@types/assertion-error/-/assertion-error-1.0.30.tgz"
     },
-    "concat-stream": {
-      "version": "1.5.0",
-      "from": "concat-stream@1.5.0",
-      "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.5.0.tgz",
-      "dependencies": {
-        "readable-stream": {
-          "version": "2.0.6",
-          "from": "readable-stream@>=2.0.0 <2.1.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz"
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.0 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
-        }
-      }
+    "@types/bluebird": {
+      "version": "3.5.4",
+      "from": "@types/bluebird@*",
+      "resolved": "https://registry.npmjs.org/@types/bluebird/-/bluebird-3.5.4.tgz"
     },
-    "configstore": {
-      "version": "3.1.0",
-      "from": "configstore@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.0.tgz"
+    "@types/chai": {
+      "version": "3.5.2",
+      "from": "@types/chai@>=3.4.35 <4.0.0",
+      "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.5.2.tgz"
     },
-    "connect": {
-      "version": "3.6.2",
-      "from": "connect@>=3.3.5 <4.0.0",
-      "resolved": "https://registry.npmjs.org/connect/-/connect-3.6.2.tgz"
+    "@types/chalk": {
+      "version": "0.4.31",
+      "from": "@types/chalk@0.4.31",
+      "resolved": "https://registry.npmjs.org/@types/chalk/-/chalk-0.4.31.tgz"
     },
-    "connect-history-api-fallback": {
-      "version": "1.3.0",
-      "from": "connect-history-api-fallback@>=1.3.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.3.0.tgz"
+    "@types/cheerio": {
+      "version": "0.22.1",
+      "from": "@types/cheerio@*",
+      "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.1.tgz"
     },
-    "connect-livereload": {
-      "version": "0.5.4",
-      "from": "connect-livereload@>=0.5.4 <0.6.0",
-      "resolved": "https://registry.npmjs.org/connect-livereload/-/connect-livereload-0.5.4.tgz"
+    "@types/colors": {
+      "version": "1.1.1",
+      "from": "@types/colors@1.1.1",
+      "resolved": "https://registry.npmjs.org/@types/colors/-/colors-1.1.1.tgz"
     },
-    "connect-timeout": {
-      "version": "1.6.2",
-      "from": "connect-timeout@>=1.6.2 <1.7.0",
-      "resolved": "https://registry.npmjs.org/connect-timeout/-/connect-timeout-1.6.2.tgz",
-      "dependencies": {
-        "debug": {
-          "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
-        },
-        "http-errors": {
-          "version": "1.3.1",
-          "from": "http-errors@>=1.3.1 <1.4.0",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
-        },
-        "ms": {
-          "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
-        }
-      }
+    "@types/enzyme": {
+      "version": "2.8.0",
+      "from": "@types/enzyme@>=2.7.5 <3.0.0",
+      "resolved": "https://registry.npmjs.org/@types/enzyme/-/enzyme-2.8.0.tgz"
     },
-    "console-browserify": {
-      "version": "1.1.0",
-      "from": "console-browserify@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.1.0.tgz"
+    "@types/es6-collections": {
+      "version": "0.5.29",
+      "from": "@types/es6-collections@0.5.29",
+      "resolved": "https://registry.npmjs.org/@types/es6-collections/-/es6-collections-0.5.29.tgz"
     },
-    "console-control-strings": {
-      "version": "1.1.0",
-      "from": "console-control-strings@>=1.1.0 <1.2.0",
-      "resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz"
+    "@types/es6-promise": {
+      "version": "0.0.32",
+      "from": "@types/es6-promise@>=0.0.32 <0.0.33",
+      "resolved": "https://registry.npmjs.org/@types/es6-promise/-/es6-promise-0.0.32.tgz"
     },
-    "constants-browserify": {
-      "version": "0.0.1",
-      "from": "constants-browserify@0.0.1",
-      "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-0.0.1.tgz"
+    "@types/express": {
+      "version": "4.0.35",
+      "from": "@types/express@*",
+      "resolved": "https://registry.npmjs.org/@types/express/-/express-4.0.35.tgz"
+    },
+    "@types/express-serve-static-core": {
+      "version": "4.0.45",
+      "from": "@types/express-serve-static-core@*",
+      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.0.45.tgz"
+    },
+    "@types/finalhandler": {
+      "version": "0.0.31",
+      "from": "@types/finalhandler@0.0.31",
+      "resolved": "https://registry.npmjs.org/@types/finalhandler/-/finalhandler-0.0.31.tgz"
+    },
+    "@types/fs-extra": {
+      "version": "0.0.37",
+      "from": "@types/fs-extra@0.0.37",
+      "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.37.tgz"
+    },
+    "@types/glob": {
+      "version": "5.0.30",
+      "from": "@types/glob@5.0.30",
+      "resolved": "https://registry.npmjs.org/@types/glob/-/glob-5.0.30.tgz"
+    },
+    "@types/gulp": {
+      "version": "3.8.32",
+      "from": "@types/gulp@3.8.32",
+      "resolved": "https://registry.npmjs.org/@types/gulp/-/gulp-3.8.32.tgz"
+    },
+    "@types/gulp-replace": {
+      "version": "0.0.29",
+      "from": "@types/gulp-replace@0.0.29",
+      "resolved": "https://registry.npmjs.org/@types/gulp-replace/-/gulp-replace-0.0.29.tgz"
+    },
+    "@types/gulp-util": {
+      "version": "3.0.30",
+      "from": "@types/gulp-util@3.0.30",
+      "resolved": "https://registry.npmjs.org/@types/gulp-util/-/gulp-util-3.0.30.tgz"
+    },
+    "@types/karma": {
+      "version": "0.13.33",
+      "from": "@types/karma@0.13.33",
+      "resolved": "https://registry.npmjs.org/@types/karma/-/karma-0.13.33.tgz"
+    },
+    "@types/lodash": {
+      "version": "4.14.52",
+      "from": "@types/lodash@4.14.52",
+      "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.52.tgz"
+    },
+    "@types/log4js": {
+      "version": "0.0.32",
+      "from": "@types/log4js@*",
+      "resolved": "https://registry.npmjs.org/@types/log4js/-/log4js-0.0.32.tgz"
     },
-    "content-disposition": {
-      "version": "0.5.2",
-      "from": "content-disposition@0.5.2",
-      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.2.tgz"
+    "@types/merge2": {
+      "version": "0.3.29",
+      "from": "@types/merge2@0.3.29",
+      "resolved": "https://registry.npmjs.org/@types/merge2/-/merge2-0.3.29.tgz"
     },
-    "content-type": {
-      "version": "1.0.2",
-      "from": "content-type@>=1.0.2 <1.1.0",
-      "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.2.tgz"
+    "@types/mime": {
+      "version": "0.0.29",
+      "from": "@types/mime@*",
+      "resolved": "https://registry.npmjs.org/@types/mime/-/mime-0.0.29.tgz"
     },
-    "convert-source-map": {
-      "version": "1.5.0",
-      "from": "convert-source-map@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.5.0.tgz"
+    "@types/minimatch": {
+      "version": "2.0.29",
+      "from": "@types/minimatch@*",
+      "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-2.0.29.tgz"
     },
-    "cookie": {
-      "version": "0.3.1",
-      "from": "cookie@0.3.1",
-      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.3.1.tgz"
+    "@types/mkdirp": {
+      "version": "0.3.29",
+      "from": "@types/mkdirp@0.3.29",
+      "resolved": "https://registry.npmjs.org/@types/mkdirp/-/mkdirp-0.3.29.tgz"
     },
-    "cookie-parser": {
-      "version": "1.3.5",
-      "from": "cookie-parser@>=1.3.5 <1.4.0",
-      "resolved": "https://registry.npmjs.org/cookie-parser/-/cookie-parser-1.3.5.tgz",
-      "dependencies": {
-        "cookie": {
-          "version": "0.1.3",
-          "from": "cookie@0.1.3",
-          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz"
-        }
-      }
+    "@types/mocha": {
+      "version": "2.2.41",
+      "from": "@types/mocha@>=2.2.39 <3.0.0",
+      "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.41.tgz"
     },
-    "cookie-signature": {
-      "version": "1.0.6",
-      "from": "cookie-signature@1.0.6",
-      "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz"
+    "@types/node": {
+      "version": "6.0.62",
+      "from": "@types/node@6.0.62",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.62.tgz"
     },
-    "core-js": {
-      "version": "1.2.7",
-      "from": "core-js@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
+    "@types/node-notifier": {
+      "version": "0.0.28",
+      "from": "@types/node-notifier@0.0.28",
+      "resolved": "https://registry.npmjs.org/@types/node-notifier/-/node-notifier-0.0.28.tgz"
     },
-    "core-util-is": {
-      "version": "1.0.2",
-      "from": "core-util-is@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz"
+    "@types/node-uuid": {
+      "version": "0.0.28",
+      "from": "@types/node-uuid@0.0.28",
+      "resolved": "https://registry.npmjs.org/@types/node-uuid/-/node-uuid-0.0.28.tgz"
     },
-    "cosmiconfig": {
-      "version": "2.1.3",
-      "from": "cosmiconfig@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-2.1.3.tgz"
+    "@types/orchestrator": {
+      "version": "0.0.30",
+      "from": "@types/orchestrator@0.0.30",
+      "resolved": "https://registry.npmjs.org/@types/orchestrator/-/orchestrator-0.0.30.tgz"
     },
-    "crc": {
-      "version": "3.3.0",
-      "from": "crc@3.3.0",
-      "resolved": "https://registry.npmjs.org/crc/-/crc-3.3.0.tgz"
+    "@types/prop-types": {
+      "version": "15.5.1",
+      "from": "@types/prop-types@>=15.5.1 <16.0.0",
+      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.5.1.tgz"
     },
-    "create-ecdh": {
-      "version": "4.0.0",
-      "from": "create-ecdh@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.0.tgz"
+    "@types/q": {
+      "version": "0.0.32",
+      "from": "@types/q@0.0.32",
+      "resolved": "https://registry.npmjs.org/@types/q/-/q-0.0.32.tgz"
     },
-    "create-error-class": {
-      "version": "3.0.2",
-      "from": "create-error-class@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/create-error-class/-/create-error-class-3.0.2.tgz"
+    "@types/react": {
+      "version": "15.0.25",
+      "from": "@types/react@>=15.0.25 <16.0.0",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.25.tgz"
     },
-    "create-hash": {
-      "version": "1.1.3",
-      "from": "create-hash@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/create-hash/-/create-hash-1.1.3.tgz",
-      "dependencies": {
-        "ripemd160": {
-          "version": "2.0.1",
-          "from": "ripemd160@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz"
-        },
-        "sha.js": {
-          "version": "2.4.8",
-          "from": "sha.js@>=2.4.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz"
-        }
-      }
+    "@types/react-addons-test-utils": {
+      "version": "0.14.18",
+      "from": "@types/react-addons-test-utils@>=0.14.18 <0.15.0",
+      "resolved": "https://registry.npmjs.org/@types/react-addons-test-utils/-/react-addons-test-utils-0.14.18.tgz"
     },
-    "create-hmac": {
-      "version": "1.1.6",
-      "from": "create-hmac@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/create-hmac/-/create-hmac-1.1.6.tgz",
-      "dependencies": {
-        "ripemd160": {
-          "version": "2.0.1",
-          "from": "ripemd160@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz"
-        },
-        "sha.js": {
-          "version": "2.4.8",
-          "from": "sha.js@>=2.4.8 <3.0.0",
-          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz"
-        }
-      }
+    "@types/react-dom": {
+      "version": "15.5.0",
+      "from": "@types/react-dom@>=15.5.0 <16.0.0",
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-15.5.0.tgz"
     },
-    "cross-spawn": {
-      "version": "3.0.1",
-      "from": "cross-spawn@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-3.0.1.tgz",
-      "dependencies": {
-        "lru-cache": {
-          "version": "4.0.2",
-          "from": "lru-cache@>=4.0.1 <5.0.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.0.2.tgz"
-        }
-      }
+    "@types/resemblejs": {
+      "version": "1.3.28",
+      "from": "@types/resemblejs@>=1.3.28 <1.4.0",
+      "resolved": "https://registry.npmjs.org/@types/resemblejs/-/resemblejs-1.3.28.tgz"
     },
-    "cross-spawn-async": {
-      "version": "2.2.5",
-      "from": "cross-spawn-async@>=2.1.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/cross-spawn-async/-/cross-spawn-async-2.2.5.tgz",
-      "dependencies": {
-        "lru-cache": {
-          "version": "4.0.2",
-          "from": "lru-cache@>=4.0.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.0.2.tgz"
-        }
-      }
+    "@types/resolve": {
+      "version": "0.0.4",
+      "from": "@types/resolve@0.0.4",
+      "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-0.0.4.tgz"
     },
-    "crypt": {
-      "version": "0.0.2",
-      "from": "crypt@>=0.0.1 <0.1.0",
-      "resolved": "https://registry.npmjs.org/crypt/-/crypt-0.0.2.tgz"
+    "@types/rimraf": {
+      "version": "0.0.28",
+      "from": "@types/rimraf@0.0.28",
+      "resolved": "https://registry.npmjs.org/@types/rimraf/-/rimraf-0.0.28.tgz"
     },
-    "cryptiles": {
-      "version": "2.0.5",
-      "from": "cryptiles@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz"
+    "@types/semver": {
+      "version": "5.3.31",
+      "from": "@types/semver@5.3.31",
+      "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.31.tgz"
     },
-    "crypto-browserify": {
-      "version": "3.2.8",
-      "from": "crypto-browserify@>=3.2.6 <3.3.0",
-      "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.2.8.tgz"
+    "@types/serve-static": {
+      "version": "1.7.31",
+      "from": "@types/serve-static@1.7.31",
+      "resolved": "https://registry.npmjs.org/@types/serve-static/-/serve-static-1.7.31.tgz"
     },
-    "crypto-random-string": {
-      "version": "1.0.0",
-      "from": "crypto-random-string@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-1.0.0.tgz"
+    "@types/sinon": {
+      "version": "2.2.2",
+      "from": "@types/sinon@>=2.2.2 <3.0.0",
+      "resolved": "https://registry.npmjs.org/@types/sinon/-/sinon-2.2.2.tgz"
     },
-    "csrf": {
-      "version": "3.0.6",
-      "from": "csrf@>=3.0.0 <3.1.0",
-      "resolved": "https://registry.npmjs.org/csrf/-/csrf-3.0.6.tgz"
+    "@types/source-map": {
+      "version": "0.5.0",
+      "from": "@types/source-map@*",
+      "resolved": "https://registry.npmjs.org/@types/source-map/-/source-map-0.5.0.tgz"
     },
-    "css-color-names": {
-      "version": "0.0.4",
-      "from": "css-color-names@0.0.4",
-      "resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz"
+    "@types/through2": {
+      "version": "2.0.32",
+      "from": "@types/through2@2.0.32",
+      "resolved": "https://registry.npmjs.org/@types/through2/-/through2-2.0.32.tgz"
     },
-    "css-loader": {
-      "version": "0.28.3",
-      "from": "css-loader@>=0.28.0 <0.29.0",
-      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.3.tgz",
-      "dependencies": {
-        "loader-utils": {
-          "version": "1.1.0",
-          "from": "loader-utils@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
-        }
-      }
+    "@types/uglify-js": {
+      "version": "2.6.28",
+      "from": "@types/uglify-js@*",
+      "resolved": "https://registry.npmjs.org/@types/uglify-js/-/uglify-js-2.6.28.tgz"
     },
-    "css-modules-loader-core": {
-      "version": "1.1.0",
-      "from": "css-modules-loader-core@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/css-modules-loader-core/-/css-modules-loader-core-1.1.0.tgz",
-      "dependencies": {
-        "postcss": {
-          "version": "6.0.1",
-          "from": "postcss@6.0.1",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
-        },
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.6 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "from": "supports-color@>=3.2.3 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
-        }
-      }
+    "@types/vinyl": {
+      "version": "1.2.30",
+      "from": "@types/vinyl@1.2.30",
+      "resolved": "https://registry.npmjs.org/@types/vinyl/-/vinyl-1.2.30.tgz"
+    },
+    "@types/webpack": {
+      "version": "1.12.36",
+      "from": "@types/webpack@1.12.36",
+      "resolved": "https://registry.npmjs.org/@types/webpack/-/webpack-1.12.36.tgz"
     },
-    "css-select": {
-      "version": "1.2.0",
-      "from": "css-select@>=1.2.0 <1.3.0",
-      "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz"
+    "@types/webpack-env": {
+      "version": "1.13.0",
+      "from": "@types/webpack-env@>=1.13.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/@types/webpack-env/-/webpack-env-1.13.0.tgz"
     },
-    "css-selector-tokenizer": {
-      "version": "0.7.0",
-      "from": "css-selector-tokenizer@>=0.7.0 <0.8.0",
-      "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.7.0.tgz"
+    "@types/webpack-stream": {
+      "version": "3.2.5",
+      "from": "@types/webpack-stream@3.2.5",
+      "resolved": "https://registry.npmjs.org/@types/webpack-stream/-/webpack-stream-3.2.5.tgz"
     },
-    "css-what": {
-      "version": "2.1.0",
-      "from": "css-what@>=2.1.0 <2.2.0",
-      "resolved": "https://registry.npmjs.org/css-what/-/css-what-2.1.0.tgz"
+    "@types/whatwg-fetch": {
+      "version": "0.0.30",
+      "from": "@types/whatwg-fetch@0.0.30",
+      "resolved": "https://registry.npmjs.org/@types/whatwg-fetch/-/whatwg-fetch-0.0.30.tgz"
     },
-    "cssesc": {
-      "version": "0.1.0",
-      "from": "cssesc@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-0.1.0.tgz"
+    "@types/yargs": {
+      "version": "0.0.34",
+      "from": "@types/yargs@0.0.34",
+      "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.34.tgz"
     },
-    "cssnano": {
-      "version": "3.10.0",
-      "from": "cssnano@>=2.6.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/cssnano/-/cssnano-3.10.0.tgz"
+    "@types/z-schema": {
+      "version": "3.16.31",
+      "from": "@types/z-schema@3.16.31",
+      "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.31.tgz"
     },
-    "csso": {
-      "version": "2.3.2",
-      "from": "csso@>=2.3.1 <2.4.0",
-      "resolved": "https://registry.npmjs.org/csso/-/csso-2.3.2.tgz",
+    "@uifabric/example-app-base": {
+      "version": "1.3.14",
+      "from": "@uifabric/example-app-base@>=1.3.12 <2.0.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-1.3.14.tgz",
       "dependencies": {
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.3 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
+        "office-ui-fabric-core": {
+          "version": "5.1.0",
+          "from": "office-ui-fabric-core@>=5.0.0 <6.0.0",
+          "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-5.1.0.tgz"
         }
       }
     },
-    "csurf": {
-      "version": "1.8.3",
-      "from": "csurf@>=1.8.3 <1.9.0",
-      "resolved": "https://registry.npmjs.org/csurf/-/csurf-1.8.3.tgz",
+    "@uifabric/utilities": {
+      "version": "1.10.2",
+      "from": "@uifabric/utilities@>=1.10.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-1.10.2.tgz"
+    },
+    "abbrev": {
+      "version": "1.0.9",
+      "from": "abbrev@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.0.9.tgz"
+    },
+    "accepts": {
+      "version": "1.3.3",
+      "from": "accepts@1.3.3",
+      "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.3.tgz"
+    },
+    "acorn": {
+      "version": "3.3.0",
+      "from": "acorn@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-3.3.0.tgz"
+    },
+    "acorn-dynamic-import": {
+      "version": "2.0.2",
+      "from": "acorn-dynamic-import@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/acorn-dynamic-import/-/acorn-dynamic-import-2.0.2.tgz",
       "dependencies": {
-        "cookie": {
-          "version": "0.1.3",
-          "from": "cookie@0.1.3",
-          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz"
-        },
-        "http-errors": {
-          "version": "1.3.1",
-          "from": "http-errors@>=1.3.1 <1.4.0",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
+        "acorn": {
+          "version": "4.0.13",
+          "from": "acorn@>=4.0.3 <5.0.0",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz"
         }
       }
     },
-    "currently-unhandled": {
-      "version": "0.4.1",
-      "from": "currently-unhandled@>=0.4.1 <0.5.0",
-      "resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz"
+    "after": {
+      "version": "0.8.2",
+      "from": "after@0.8.2",
+      "resolved": "https://registry.npmjs.org/after/-/after-0.8.2.tgz"
     },
-    "custom-event": {
+    "ajv": {
+      "version": "4.11.8",
+      "from": "ajv@>=4.9.1 <5.0.0",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz"
+    },
+    "ajv-keywords": {
+      "version": "1.5.1",
+      "from": "ajv-keywords@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-1.5.1.tgz"
+    },
+    "align-text": {
+      "version": "0.1.4",
+      "from": "align-text@>=0.1.3 <0.2.0",
+      "resolved": "https://registry.npmjs.org/align-text/-/align-text-0.1.4.tgz"
+    },
+    "alphanum-sort": {
+      "version": "1.0.2",
+      "from": "alphanum-sort@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/alphanum-sort/-/alphanum-sort-1.0.2.tgz"
+    },
+    "amdefine": {
       "version": "1.0.1",
-      "from": "custom-event@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/custom-event/-/custom-event-1.0.1.tgz"
+      "from": "amdefine@>=0.0.4",
+      "resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz"
     },
-    "cyclist": {
-      "version": "0.2.2",
-      "from": "cyclist@>=0.2.2 <0.3.0",
-      "resolved": "https://registry.npmjs.org/cyclist/-/cyclist-0.2.2.tgz"
+    "ansi-align": {
+      "version": "1.1.0",
+      "from": "ansi-align@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-1.1.0.tgz"
     },
-    "d": {
-      "version": "1.0.0",
-      "from": "d@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/d/-/d-1.0.0.tgz"
+    "ansi-escapes": {
+      "version": "1.4.0",
+      "from": "ansi-escapes@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz"
     },
-    "d3": {
-      "version": "3.5.17",
-      "from": "d3@>=3.5.6 <4.0.0",
-      "resolved": "https://registry.npmjs.org/d3/-/d3-3.5.17.tgz"
+    "ansi-html": {
+      "version": "0.0.7",
+      "from": "ansi-html@0.0.7",
+      "resolved": "https://registry.npmjs.org/ansi-html/-/ansi-html-0.0.7.tgz"
     },
-    "dashdash": {
-      "version": "1.14.1",
-      "from": "dashdash@>=1.12.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/dashdash/-/dashdash-1.14.1.tgz",
-      "dependencies": {
-        "assert-plus": {
-          "version": "1.0.0",
-          "from": "assert-plus@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz"
-        }
-      }
+    "ansi-regex": {
+      "version": "2.1.1",
+      "from": "ansi-regex@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz"
     },
-    "date-now": {
-      "version": "0.1.4",
-      "from": "date-now@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/date-now/-/date-now-0.1.4.tgz"
+    "ansi-styles": {
+      "version": "2.2.1",
+      "from": "ansi-styles@>=2.2.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz"
     },
-    "dateformat": {
-      "version": "2.0.0",
-      "from": "dateformat@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-2.0.0.tgz"
+    "ansicolors": {
+      "version": "0.2.1",
+      "from": "ansicolors@>=0.2.1 <0.3.0",
+      "resolved": "https://registry.npmjs.org/ansicolors/-/ansicolors-0.2.1.tgz"
     },
-    "deasync": {
-      "version": "0.1.9",
-      "from": "deasync@>=0.1.7 <0.2.0",
-      "resolved": "https://registry.npmjs.org/deasync/-/deasync-0.1.9.tgz"
+    "anymatch": {
+      "version": "1.3.0",
+      "from": "anymatch@>=1.3.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-1.3.0.tgz"
     },
-    "debug": {
-      "version": "2.6.7",
-      "from": "debug@2.6.7",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.7.tgz"
+    "aproba": {
+      "version": "1.1.1",
+      "from": "aproba@>=1.0.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.1.1.tgz"
     },
-    "decamelize": {
-      "version": "1.2.0",
-      "from": "decamelize@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz"
+    "archy": {
+      "version": "1.0.0",
+      "from": "archy@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/archy/-/archy-1.0.0.tgz"
     },
-    "decomment": {
-      "version": "0.8.7",
-      "from": "decomment@>=0.8.2 <0.9.0",
-      "resolved": "https://registry.npmjs.org/decomment/-/decomment-0.8.7.tgz",
+    "are-we-there-yet": {
+      "version": "1.1.4",
+      "from": "are-we-there-yet@>=1.1.2 <1.2.0",
+      "resolved": "https://registry.npmjs.org/are-we-there-yet/-/are-we-there-yet-1.1.4.tgz",
       "dependencies": {
-        "esprima": {
-          "version": "3.1.3",
-          "from": "esprima@>=3.1.0 <3.2.0",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz"
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.6 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+        },
+        "string_decoder": {
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
-    "deep-eql": {
-      "version": "0.1.3",
-      "from": "deep-eql@>=0.1.3 <0.2.0",
-      "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-0.1.3.tgz",
+    "argparse": {
+      "version": "1.0.9",
+      "from": "argparse@>=1.0.7 <2.0.0",
+      "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.9.tgz",
       "dependencies": {
-        "type-detect": {
-          "version": "0.1.1",
-          "from": "type-detect@0.1.1",
-          "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-0.1.1.tgz"
+        "sprintf-js": {
+          "version": "1.0.3",
+          "from": "sprintf-js@>=1.0.2 <1.1.0",
+          "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz"
         }
       }
     },
-    "deep-extend": {
-      "version": "0.4.2",
-      "from": "deep-extend@>=0.4.0 <0.5.0",
-      "resolved": "https://registry.npmjs.org/deep-extend/-/deep-extend-0.4.2.tgz"
+    "arr-diff": {
+      "version": "2.0.0",
+      "from": "arr-diff@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz"
+    },
+    "arr-flatten": {
+      "version": "1.0.3",
+      "from": "arr-flatten@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.0.3.tgz"
+    },
+    "array-differ": {
+      "version": "1.0.0",
+      "from": "array-differ@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/array-differ/-/array-differ-1.0.0.tgz"
+    },
+    "array-find-index": {
+      "version": "1.0.2",
+      "from": "array-find-index@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/array-find-index/-/array-find-index-1.0.2.tgz"
+    },
+    "array-flatten": {
+      "version": "1.1.1",
+      "from": "array-flatten@1.1.1",
+      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz"
+    },
+    "array-slice": {
+      "version": "0.2.3",
+      "from": "array-slice@>=0.2.3 <0.3.0",
+      "resolved": "https://registry.npmjs.org/array-slice/-/array-slice-0.2.3.tgz"
     },
-    "deep-is": {
-      "version": "0.1.3",
-      "from": "deep-is@>=0.1.3 <0.2.0",
-      "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz"
+    "array-union": {
+      "version": "1.0.2",
+      "from": "array-union@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz"
     },
-    "defaults": {
+    "array-uniq": {
       "version": "1.0.3",
-      "from": "defaults@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.3.tgz"
+      "from": "array-uniq@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz"
     },
-    "define-properties": {
-      "version": "1.1.2",
-      "from": "define-properties@>=1.1.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.1.2.tgz"
+    "array-unique": {
+      "version": "0.2.1",
+      "from": "array-unique@>=0.2.1 <0.3.0",
+      "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz"
     },
-    "defined": {
-      "version": "1.0.0",
-      "from": "defined@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/defined/-/defined-1.0.0.tgz"
+    "arraybuffer.slice": {
+      "version": "0.0.6",
+      "from": "arraybuffer.slice@0.0.6",
+      "resolved": "https://registry.npmjs.org/arraybuffer.slice/-/arraybuffer.slice-0.0.6.tgz"
     },
-    "del": {
-      "version": "2.2.2",
-      "from": "del@>=2.2.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/del/-/del-2.2.2.tgz"
+    "arrify": {
+      "version": "1.0.1",
+      "from": "arrify@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz"
     },
-    "delayed-stream": {
-      "version": "1.0.0",
-      "from": "delayed-stream@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz"
+    "asap": {
+      "version": "2.0.5",
+      "from": "asap@>=2.0.3 <2.1.0",
+      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.5.tgz"
     },
-    "delegates": {
-      "version": "1.0.0",
-      "from": "delegates@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz"
+    "asn1": {
+      "version": "0.2.3",
+      "from": "asn1@>=0.2.3 <0.3.0",
+      "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.3.tgz"
     },
-    "depd": {
-      "version": "1.1.0",
-      "from": "depd@>=1.1.0 <1.2.0",
-      "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.0.tgz"
+    "asn1.js": {
+      "version": "4.9.1",
+      "from": "asn1.js@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-4.9.1.tgz"
     },
-    "deprecated": {
-      "version": "0.0.1",
-      "from": "deprecated@>=0.0.1 <0.0.2",
-      "resolved": "https://registry.npmjs.org/deprecated/-/deprecated-0.0.1.tgz"
+    "assert": {
+      "version": "1.4.1",
+      "from": "assert@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/assert/-/assert-1.4.1.tgz"
     },
-    "des.js": {
-      "version": "1.0.0",
-      "from": "des.js@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/des.js/-/des.js-1.0.0.tgz"
+    "assert-plus": {
+      "version": "0.2.0",
+      "from": "assert-plus@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-0.2.0.tgz"
     },
-    "destroy": {
-      "version": "1.0.4",
-      "from": "destroy@>=1.0.4 <1.1.0",
-      "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.0.4.tgz"
+    "assertion-error": {
+      "version": "1.0.2",
+      "from": "assertion-error@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-1.0.2.tgz"
     },
-    "detect-file": {
-      "version": "0.1.0",
-      "from": "detect-file@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/detect-file/-/detect-file-0.1.0.tgz"
+    "ast-types": {
+      "version": "0.9.6",
+      "from": "ast-types@0.9.6",
+      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.9.6.tgz"
     },
-    "detect-node": {
-      "version": "2.0.3",
-      "from": "detect-node@>=2.0.3 <3.0.0",
-      "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.0.3.tgz"
+    "async": {
+      "version": "1.5.2",
+      "from": "async@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz"
     },
-    "detective": {
-      "version": "4.5.0",
-      "from": "detective@>=4.3.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/detective/-/detective-4.5.0.tgz",
+    "async-each": {
+      "version": "1.0.1",
+      "from": "async-each@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/async-each/-/async-each-1.0.1.tgz"
+    },
+    "async-foreach": {
+      "version": "0.1.3",
+      "from": "async-foreach@>=0.1.3 <0.2.0",
+      "resolved": "https://registry.npmjs.org/async-foreach/-/async-foreach-0.1.3.tgz"
+    },
+    "asynckit": {
+      "version": "0.4.0",
+      "from": "asynckit@>=0.4.0 <0.5.0",
+      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz"
+    },
+    "autoprefixer": {
+      "version": "6.7.7",
+      "from": "autoprefixer@>=6.7.6 <7.0.0",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.7.7.tgz",
       "dependencies": {
-        "acorn": {
-          "version": "4.0.13",
-          "from": "acorn@>=4.0.3 <5.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz"
+        "browserslist": {
+          "version": "1.7.7",
+          "from": "browserslist@>=1.7.6 <2.0.0",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz"
         }
       }
     },
-    "di": {
-      "version": "0.0.1",
-      "from": "di@>=0.0.1 <0.0.2",
-      "resolved": "https://registry.npmjs.org/di/-/di-0.0.1.tgz"
-    },
-    "diff": {
-      "version": "1.4.0",
-      "from": "diff@1.4.0",
-      "resolved": "https://registry.npmjs.org/diff/-/diff-1.4.0.tgz"
-    },
-    "diffie-hellman": {
-      "version": "5.0.2",
-      "from": "diffie-hellman@>=5.0.0 <6.0.0",
-      "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.2.tgz"
+    "aws-sign2": {
+      "version": "0.6.0",
+      "from": "aws-sign2@>=0.6.0 <0.7.0",
+      "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz"
     },
-    "dom-serialize": {
-      "version": "2.2.1",
-      "from": "dom-serialize@>=2.2.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/dom-serialize/-/dom-serialize-2.2.1.tgz"
+    "aws4": {
+      "version": "1.6.0",
+      "from": "aws4@>=1.2.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.6.0.tgz"
     },
-    "dom-serializer": {
-      "version": "0.1.0",
-      "from": "dom-serializer@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.1.0.tgz",
+    "azure-storage": {
+      "version": "0.10.0",
+      "from": "azure-storage@>=0.10.0 <0.11.0",
+      "resolved": "https://registry.npmjs.org/azure-storage/-/azure-storage-0.10.0.tgz",
       "dependencies": {
-        "domelementtype": {
-          "version": "1.1.3",
-          "from": "domelementtype@>=1.1.1 <1.2.0",
-          "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.1.3.tgz"
+        "async": {
+          "version": "2.4.1",
+          "from": "async@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+        },
+        "caseless": {
+          "version": "0.11.0",
+          "from": "caseless@>=0.11.0 <0.12.0",
+          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz"
+        },
+        "extend": {
+          "version": "1.2.1",
+          "from": "extend@>=1.2.1 <1.3.0",
+          "resolved": "https://registry.npmjs.org/extend/-/extend-1.2.1.tgz"
+        },
+        "form-data": {
+          "version": "1.0.1",
+          "from": "form-data@>=1.0.0-rc3 <1.1.0",
+          "resolved": "https://registry.npmjs.org/form-data/-/form-data-1.0.1.tgz"
+        },
+        "har-validator": {
+          "version": "2.0.6",
+          "from": "har-validator@>=2.0.6 <2.1.0",
+          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz"
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+        },
+        "node-uuid": {
+          "version": "1.4.8",
+          "from": "node-uuid@~1.4.0",
+          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz"
+        },
+        "qs": {
+          "version": "6.0.4",
+          "from": "qs@>=6.0.2 <6.1.0",
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.0.4.tgz"
+        },
+        "readable-stream": {
+          "version": "2.0.6",
+          "from": "readable-stream@>=2.0.0 <2.1.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz"
+        },
+        "request": {
+          "version": "2.69.0",
+          "from": "request@>=2.69.0 <2.70.0",
+          "resolved": "https://registry.npmjs.org/request/-/request-2.69.0.tgz",
+          "dependencies": {
+            "extend": {
+              "version": "3.0.1",
+              "from": "extend@~3.0.0",
+              "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz"
+            }
+          }
+        },
+        "tough-cookie": {
+          "version": "2.2.2",
+          "from": "tough-cookie@>=2.2.0 <2.3.0",
+          "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.2.2.tgz"
+        },
+        "tunnel-agent": {
+          "version": "0.4.3",
+          "from": "tunnel-agent@>=0.4.1 <0.5.0",
+          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz"
+        },
+        "validator": {
+          "version": "3.22.2",
+          "from": "validator@>=3.22.2 <3.23.0",
+          "resolved": "https://registry.npmjs.org/validator/-/validator-3.22.2.tgz"
         }
       }
     },
-    "domain-browser": {
-      "version": "1.1.7",
-      "from": "domain-browser@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.1.7.tgz"
+    "babel-code-frame": {
+      "version": "6.22.0",
+      "from": "babel-code-frame@>=6.11.0 <7.0.0",
+      "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.22.0.tgz"
+    },
+    "babel-runtime": {
+      "version": "6.23.0",
+      "from": "babel-runtime@>=6.18.0 <7.0.0",
+      "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.23.0.tgz"
+    },
+    "backo2": {
+      "version": "1.0.2",
+      "from": "backo2@1.0.2",
+      "resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz"
+    },
+    "balanced-match": {
+      "version": "0.4.2",
+      "from": "balanced-match@>=0.4.1 <0.5.0",
+      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-0.4.2.tgz"
+    },
+    "base62": {
+      "version": "1.2.0",
+      "from": "base62@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/base62/-/base62-1.2.0.tgz"
     },
-    "domelementtype": {
-      "version": "1.3.0",
-      "from": "domelementtype@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.3.0.tgz"
+    "Base64": {
+      "version": "0.2.1",
+      "from": "Base64@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/Base64/-/Base64-0.2.1.tgz"
     },
-    "domhandler": {
-      "version": "2.4.1",
-      "from": "domhandler@>=2.3.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.4.1.tgz"
+    "base64-arraybuffer": {
+      "version": "0.1.5",
+      "from": "base64-arraybuffer@0.1.5",
+      "resolved": "https://registry.npmjs.org/base64-arraybuffer/-/base64-arraybuffer-0.1.5.tgz"
     },
-    "domutils": {
-      "version": "1.5.1",
-      "from": "domutils@1.5.1",
-      "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.5.1.tgz"
+    "base64-js": {
+      "version": "1.2.0",
+      "from": "base64-js@>=1.0.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.2.0.tgz"
     },
-    "dot-prop": {
-      "version": "4.1.1",
-      "from": "dot-prop@>=4.1.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-4.1.1.tgz"
+    "base64-url": {
+      "version": "1.2.1",
+      "from": "base64-url@1.2.1",
+      "resolved": "https://registry.npmjs.org/base64-url/-/base64-url-1.2.1.tgz"
     },
-    "duplexer": {
-      "version": "0.1.1",
-      "from": "duplexer@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz"
+    "base64id": {
+      "version": "1.0.0",
+      "from": "base64id@1.0.0",
+      "resolved": "https://registry.npmjs.org/base64id/-/base64id-1.0.0.tgz"
     },
-    "duplexer2": {
-      "version": "0.0.2",
-      "from": "duplexer2@0.0.2",
-      "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.0.2.tgz",
-      "dependencies": {
-        "isarray": {
-          "version": "0.0.1",
-          "from": "isarray@0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
-        },
-        "readable-stream": {
-          "version": "1.1.14",
-          "from": "readable-stream@>=1.1.9 <1.2.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz"
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.0 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
-        }
-      }
+    "basic-auth": {
+      "version": "1.0.4",
+      "from": "basic-auth@>=1.0.3 <1.1.0",
+      "resolved": "https://registry.npmjs.org/basic-auth/-/basic-auth-1.0.4.tgz"
     },
-    "duplexer3": {
-      "version": "0.1.4",
-      "from": "duplexer3@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/duplexer3/-/duplexer3-0.1.4.tgz"
+    "basic-auth-connect": {
+      "version": "1.0.0",
+      "from": "basic-auth-connect@1.0.0",
+      "resolved": "https://registry.npmjs.org/basic-auth-connect/-/basic-auth-connect-1.0.0.tgz"
     },
-    "duplexify": {
-      "version": "3.5.0",
-      "from": "duplexify@>=3.5.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-3.5.0.tgz",
-      "dependencies": {
-        "end-of-stream": {
-          "version": "1.0.0",
-          "from": "end-of-stream@1.0.0",
-          "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.0.0.tgz"
-        },
-        "once": {
-          "version": "1.3.3",
-          "from": "once@>=1.3.0 <1.4.0",
-          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz"
-        }
-      }
+    "batch": {
+      "version": "0.5.3",
+      "from": "batch@>=0.5.3 <0.6.0",
+      "resolved": "https://registry.npmjs.org/batch/-/batch-0.5.3.tgz"
     },
-    "ecc-jsbn": {
-      "version": "0.1.1",
-      "from": "ecc-jsbn@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.1.tgz",
+    "bcrypt-pbkdf": {
+      "version": "1.0.1",
+      "from": "bcrypt-pbkdf@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/bcrypt-pbkdf/-/bcrypt-pbkdf-1.0.1.tgz",
       "optional": true
     },
-    "ee-first": {
+    "beeper": {
       "version": "1.1.1",
-      "from": "ee-first@1.1.1",
-      "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz"
-    },
-    "ejs": {
-      "version": "2.5.6",
-      "from": "ejs@>=2.5.6 <3.0.0",
-      "resolved": "https://registry.npmjs.org/ejs/-/ejs-2.5.6.tgz"
+      "from": "beeper@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/beeper/-/beeper-1.1.1.tgz"
     },
-    "electron-to-chromium": {
-      "version": "1.3.13",
-      "from": "electron-to-chromium@>=1.2.7 <2.0.0",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.13.tgz"
+    "better-assert": {
+      "version": "1.0.2",
+      "from": "better-assert@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/better-assert/-/better-assert-1.0.2.tgz"
     },
-    "elliptic": {
-      "version": "6.4.0",
-      "from": "elliptic@>=6.0.0 <7.0.0",
-      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.4.0.tgz"
+    "big.js": {
+      "version": "3.1.3",
+      "from": "big.js@>=3.1.3 <4.0.0",
+      "resolved": "https://registry.npmjs.org/big.js/-/big.js-3.1.3.tgz"
     },
-    "emojis-list": {
-      "version": "2.1.0",
-      "from": "emojis-list@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-2.1.0.tgz"
+    "binary-extensions": {
+      "version": "1.8.0",
+      "from": "binary-extensions@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.8.0.tgz"
     },
-    "encodeurl": {
+    "binaryextensions": {
       "version": "1.0.1",
-      "from": "encodeurl@>=1.0.1 <1.1.0",
-      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.1.tgz"
-    },
-    "encoding": {
-      "version": "0.1.12",
-      "from": "encoding@>=0.1.11 <0.2.0",
-      "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.12.tgz"
+      "from": "binaryextensions@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/binaryextensions/-/binaryextensions-1.0.1.tgz"
     },
-    "end-of-stream": {
-      "version": "1.1.0",
-      "from": "end-of-stream@>=1.1.0 <1.2.0",
-      "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.1.0.tgz",
-      "dependencies": {
-        "once": {
-          "version": "1.3.3",
-          "from": "once@>=1.3.0 <1.4.0",
-          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz"
-        }
-      }
+    "bindings": {
+      "version": "1.2.1",
+      "from": "bindings@>=1.2.1 <1.3.0",
+      "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.2.1.tgz"
     },
-    "engine.io": {
-      "version": "1.8.4",
-      "from": "engine.io@>=1.8.4 <1.9.0",
-      "resolved": "https://registry.npmjs.org/engine.io/-/engine.io-1.8.4.tgz",
+    "bl": {
+      "version": "1.0.3",
+      "from": "bl@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/bl/-/bl-1.0.3.tgz",
       "dependencies": {
-        "debug": {
-          "version": "2.3.3",
-          "from": "debug@2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz"
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
-        "ms": {
-          "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+        "readable-stream": {
+          "version": "2.0.6",
+          "from": "readable-stream@>=2.0.5 <2.1.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz"
         }
       }
     },
-    "engine.io-client": {
-      "version": "1.8.4",
-      "from": "engine.io-client@>=1.8.4 <1.9.0",
-      "resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-1.8.4.tgz",
-      "dependencies": {
-        "component-emitter": {
-          "version": "1.2.1",
-          "from": "component-emitter@1.2.1",
-          "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz"
-        },
-        "debug": {
-          "version": "2.3.3",
-          "from": "debug@2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz"
-        },
-        "ms": {
-          "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
-        },
-        "ws": {
-          "version": "1.1.2",
-          "from": "ws@1.1.2",
-          "resolved": "https://registry.npmjs.org/ws/-/ws-1.1.2.tgz"
-        }
-      }
+    "blob": {
+      "version": "0.0.4",
+      "from": "blob@0.0.4",
+      "resolved": "https://registry.npmjs.org/blob/-/blob-0.0.4.tgz"
     },
-    "engine.io-parser": {
-      "version": "1.3.2",
-      "from": "engine.io-parser@1.3.2",
-      "resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-1.3.2.tgz"
+    "block-stream": {
+      "version": "0.0.9",
+      "from": "block-stream@*",
+      "resolved": "https://registry.npmjs.org/block-stream/-/block-stream-0.0.9.tgz"
     },
-    "enhanced-resolve": {
-      "version": "0.9.1",
-      "from": "enhanced-resolve@>=0.9.0 <0.10.0",
-      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-0.9.1.tgz",
-      "dependencies": {
-        "memory-fs": {
-          "version": "0.2.0",
-          "from": "memory-fs@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.2.0.tgz"
-        }
-      }
+    "bluebird": {
+      "version": "3.5.0",
+      "from": "bluebird@>=3.0.5 <4.0.0",
+      "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.5.0.tgz"
     },
-    "ent": {
-      "version": "2.2.0",
-      "from": "ent@>=2.2.0 <2.3.0",
-      "resolved": "https://registry.npmjs.org/ent/-/ent-2.2.0.tgz"
+    "bn.js": {
+      "version": "4.11.6",
+      "from": "bn.js@>=4.1.1 <5.0.0",
+      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.6.tgz"
+    },
+    "body-parser": {
+      "version": "1.17.2",
+      "from": "body-parser@>=1.12.4 <2.0.0",
+      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.17.2.tgz"
+    },
+    "boolbase": {
+      "version": "1.0.0",
+      "from": "boolbase@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz"
+    },
+    "boom": {
+      "version": "2.10.1",
+      "from": "boom@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz"
     },
-    "entities": {
-      "version": "1.1.1",
-      "from": "entities@>=1.1.1 <1.2.0",
-      "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.1.tgz"
+    "boxen": {
+      "version": "0.6.0",
+      "from": "boxen@>=0.6.0 <0.7.0",
+      "resolved": "https://registry.npmjs.org/boxen/-/boxen-0.6.0.tgz"
     },
-    "envify": {
-      "version": "3.4.1",
-      "from": "envify@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/envify/-/envify-3.4.1.tgz"
+    "brace-expansion": {
+      "version": "1.1.7",
+      "from": "brace-expansion@>=1.1.7 <2.0.0",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.7.tgz"
     },
-    "enzyme": {
-      "version": "2.7.0",
-      "from": "enzyme@2.7.0",
-      "resolved": "https://registry.npmjs.org/enzyme/-/enzyme-2.7.0.tgz"
+    "braces": {
+      "version": "1.8.5",
+      "from": "braces@>=1.8.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz"
     },
-    "errno": {
-      "version": "0.1.4",
-      "from": "errno@>=0.1.3 <0.2.0",
-      "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.4.tgz"
+    "brorand": {
+      "version": "1.1.0",
+      "from": "brorand@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/brorand/-/brorand-1.1.0.tgz"
     },
-    "error-ex": {
-      "version": "1.3.1",
-      "from": "error-ex@>=1.2.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.1.tgz"
+    "browser-stdout": {
+      "version": "1.3.0",
+      "from": "browser-stdout@1.3.0",
+      "resolved": "https://registry.npmjs.org/browser-stdout/-/browser-stdout-1.3.0.tgz"
     },
-    "errorhandler": {
-      "version": "1.4.3",
-      "from": "errorhandler@>=1.4.2 <1.5.0",
-      "resolved": "https://registry.npmjs.org/errorhandler/-/errorhandler-1.4.3.tgz"
+    "browserify-aes": {
+      "version": "0.4.0",
+      "from": "browserify-aes@0.4.0",
+      "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-0.4.0.tgz"
     },
-    "es-abstract": {
-      "version": "1.7.0",
-      "from": "es-abstract@>=1.6.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.7.0.tgz"
+    "browserify-cipher": {
+      "version": "1.0.0",
+      "from": "browserify-cipher@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/browserify-cipher/-/browserify-cipher-1.0.0.tgz",
+      "dependencies": {
+        "browserify-aes": {
+          "version": "1.0.6",
+          "from": "browserify-aes@>=1.0.4 <2.0.0",
+          "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.6.tgz"
+        }
+      }
     },
-    "es-to-primitive": {
-      "version": "1.1.1",
-      "from": "es-to-primitive@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.1.1.tgz"
+    "browserify-des": {
+      "version": "1.0.0",
+      "from": "browserify-des@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/browserify-des/-/browserify-des-1.0.0.tgz"
     },
-    "es5-ext": {
-      "version": "0.10.21",
-      "from": "es5-ext@>=0.10.14 <0.11.0",
-      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.21.tgz"
+    "browserify-mime": {
+      "version": "1.2.9",
+      "from": "browserify-mime@>=1.2.9 <1.3.0",
+      "resolved": "https://registry.npmjs.org/browserify-mime/-/browserify-mime-1.2.9.tgz"
     },
-    "es6-collections": {
-      "version": "0.5.6",
-      "from": "es6-collections@0.5.6",
-      "resolved": "https://registry.npmjs.org/es6-collections/-/es6-collections-0.5.6.tgz"
+    "browserify-rsa": {
+      "version": "4.0.1",
+      "from": "browserify-rsa@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz"
     },
-    "es6-iterator": {
-      "version": "2.0.1",
-      "from": "es6-iterator@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.1.tgz"
+    "browserify-sign": {
+      "version": "4.0.4",
+      "from": "browserify-sign@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/browserify-sign/-/browserify-sign-4.0.4.tgz"
     },
-    "es6-promise": {
-      "version": "4.1.0",
-      "from": "es6-promise@4.1.0",
-      "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.0.tgz"
+    "browserify-zlib": {
+      "version": "0.1.4",
+      "from": "browserify-zlib@>=0.1.4 <0.2.0",
+      "resolved": "https://registry.npmjs.org/browserify-zlib/-/browserify-zlib-0.1.4.tgz"
     },
-    "es6-symbol": {
-      "version": "3.1.1",
-      "from": "es6-symbol@>=3.1.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.1.tgz"
+    "browserslist": {
+      "version": "1.3.6",
+      "from": "browserslist@>=1.3.4 <1.4.0",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.3.6.tgz"
     },
-    "es6-templates": {
-      "version": "0.2.3",
-      "from": "es6-templates@>=0.2.2 <0.3.0",
-      "resolved": "https://registry.npmjs.org/es6-templates/-/es6-templates-0.2.3.tgz"
+    "buffer": {
+      "version": "4.9.1",
+      "from": "buffer@>=4.9.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/buffer/-/buffer-4.9.1.tgz",
+      "dependencies": {
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+        }
+      }
     },
-    "es6-weak-map": {
-      "version": "2.0.2",
-      "from": "es6-weak-map@>=2.0.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/es6-weak-map/-/es6-weak-map-2.0.2.tgz"
+    "buffer-shims": {
+      "version": "1.0.0",
+      "from": "buffer-shims@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/buffer-shims/-/buffer-shims-1.0.0.tgz"
     },
-    "escape-html": {
+    "buffer-xor": {
       "version": "1.0.3",
-      "from": "escape-html@>=1.0.3 <1.1.0",
-      "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz"
+      "from": "buffer-xor@>=1.0.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/buffer-xor/-/buffer-xor-1.0.3.tgz"
     },
-    "escape-string-regexp": {
-      "version": "1.0.5",
-      "from": "escape-string-regexp@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz"
+    "bufferstreams": {
+      "version": "1.0.1",
+      "from": "bufferstreams@1.0.1",
+      "resolved": "https://registry.npmjs.org/bufferstreams/-/bufferstreams-1.0.1.tgz"
     },
-    "escodegen": {
-      "version": "1.8.1",
-      "from": "escodegen@>=1.8.0 <1.9.0",
-      "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-1.8.1.tgz"
+    "builtin-modules": {
+      "version": "1.1.1",
+      "from": "builtin-modules@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz"
     },
-    "esprima": {
-      "version": "2.7.3",
-      "from": "esprima@>=2.7.0 <2.8.0",
-      "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz"
+    "builtin-status-codes": {
+      "version": "3.0.0",
+      "from": "builtin-status-codes@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz"
     },
-    "estraverse": {
-      "version": "1.9.3",
-      "from": "estraverse@>=1.9.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-1.9.3.tgz"
+    "bytes": {
+      "version": "2.4.0",
+      "from": "bytes@2.4.0",
+      "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz"
     },
-    "esutils": {
-      "version": "2.0.2",
-      "from": "esutils@>=2.0.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.2.tgz"
+    "cache-swap": {
+      "version": "0.3.0",
+      "from": "cache-swap@>=0.3.0 <0.4.0",
+      "resolved": "https://registry.npmjs.org/cache-swap/-/cache-swap-0.3.0.tgz"
     },
-    "etag": {
-      "version": "1.7.0",
-      "from": "etag@>=1.7.0 <1.8.0",
-      "resolved": "https://registry.npmjs.org/etag/-/etag-1.7.0.tgz"
+    "callsite": {
+      "version": "1.0.0",
+      "from": "callsite@1.0.0",
+      "resolved": "https://registry.npmjs.org/callsite/-/callsite-1.0.0.tgz"
     },
-    "event-stream": {
-      "version": "3.0.20",
-      "from": "event-stream@>=3.0.20 <3.1.0",
-      "resolved": "https://registry.npmjs.org/event-stream/-/event-stream-3.0.20.tgz"
+    "camel-case": {
+      "version": "3.0.0",
+      "from": "camel-case@>=3.0.0 <3.1.0",
+      "resolved": "https://registry.npmjs.org/camel-case/-/camel-case-3.0.0.tgz"
     },
-    "eventemitter3": {
-      "version": "1.2.0",
-      "from": "eventemitter3@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-1.2.0.tgz"
+    "camelcase": {
+      "version": "2.1.1",
+      "from": "camelcase@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz"
     },
-    "events": {
-      "version": "1.1.1",
-      "from": "events@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/events/-/events-1.1.1.tgz"
+    "camelcase-keys": {
+      "version": "2.1.0",
+      "from": "camelcase-keys@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/camelcase-keys/-/camelcase-keys-2.1.0.tgz"
     },
-    "eventsource": {
-      "version": "0.1.6",
-      "from": "eventsource@0.1.6",
-      "resolved": "https://registry.npmjs.org/eventsource/-/eventsource-0.1.6.tgz"
+    "caniuse-api": {
+      "version": "1.6.1",
+      "from": "caniuse-api@>=1.5.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/caniuse-api/-/caniuse-api-1.6.1.tgz"
     },
-    "evp_bytestokey": {
-      "version": "1.0.0",
-      "from": "evp_bytestokey@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/evp_bytestokey/-/evp_bytestokey-1.0.0.tgz"
+    "caniuse-db": {
+      "version": "1.0.30000673",
+      "from": "caniuse-db@>=1.0.30000488 <2.0.0",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000673.tgz"
     },
-    "execa": {
-      "version": "0.4.0",
-      "from": "execa@>=0.4.0 <0.5.0",
-      "resolved": "https://registry.npmjs.org/execa/-/execa-0.4.0.tgz"
+    "capture-stack-trace": {
+      "version": "1.0.0",
+      "from": "capture-stack-trace@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/capture-stack-trace/-/capture-stack-trace-1.0.0.tgz"
     },
-    "exit-hook": {
-      "version": "1.1.1",
-      "from": "exit-hook@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/exit-hook/-/exit-hook-1.1.1.tgz"
+    "cardinal": {
+      "version": "1.0.0",
+      "from": "cardinal@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/cardinal/-/cardinal-1.0.0.tgz"
     },
-    "expand-braces": {
-      "version": "0.1.2",
-      "from": "expand-braces@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/expand-braces/-/expand-braces-0.1.2.tgz",
-      "dependencies": {
-        "braces": {
-          "version": "0.1.5",
-          "from": "braces@>=0.1.2 <0.2.0",
-          "resolved": "https://registry.npmjs.org/braces/-/braces-0.1.5.tgz"
-        },
-        "expand-range": {
-          "version": "0.1.1",
-          "from": "expand-range@>=0.1.0 <0.2.0",
-          "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-0.1.1.tgz"
-        },
-        "is-number": {
-          "version": "0.1.1",
-          "from": "is-number@>=0.1.1 <0.2.0",
-          "resolved": "https://registry.npmjs.org/is-number/-/is-number-0.1.1.tgz"
-        },
-        "repeat-string": {
-          "version": "0.2.2",
-          "from": "repeat-string@>=0.2.2 <0.3.0",
-          "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-0.2.2.tgz"
-        }
-      }
+    "caseless": {
+      "version": "0.12.0",
+      "from": "caseless@>=0.12.0 <0.13.0",
+      "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz"
     },
-    "expand-brackets": {
-      "version": "0.1.5",
-      "from": "expand-brackets@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz"
+    "casperjs": {
+      "version": "1.1.3",
+      "from": "casperjs@1.1.3",
+      "resolved": "https://registry.npmjs.org/casperjs/-/casperjs-1.1.3.tgz"
     },
-    "expand-range": {
-      "version": "1.8.2",
-      "from": "expand-range@>=1.8.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz"
+    "center-align": {
+      "version": "0.1.3",
+      "from": "center-align@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/center-align/-/center-align-0.1.3.tgz"
     },
-    "expand-tilde": {
-      "version": "1.2.2",
-      "from": "expand-tilde@>=1.2.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-1.2.2.tgz"
+    "chai": {
+      "version": "3.5.0",
+      "from": "chai@>=3.5.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/chai/-/chai-3.5.0.tgz"
     },
-    "express": {
-      "version": "4.14.1",
-      "from": "express@>=4.14.0 <4.15.0",
-      "resolved": "https://registry.npmjs.org/express/-/express-4.14.1.tgz",
-      "dependencies": {
-        "debug": {
-          "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
-        },
-        "finalhandler": {
-          "version": "0.5.1",
-          "from": "finalhandler@0.5.1",
-          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.5.1.tgz"
-        },
-        "ms": {
-          "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
-        },
-        "qs": {
-          "version": "6.2.0",
-          "from": "qs@6.2.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-6.2.0.tgz"
-        }
-      }
+    "chalk": {
+      "version": "1.1.3",
+      "from": "chalk@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz"
     },
-    "express-session": {
-      "version": "1.11.3",
-      "from": "express-session@>=1.11.3 <1.12.0",
-      "resolved": "https://registry.npmjs.org/express-session/-/express-session-1.11.3.tgz",
+    "charenc": {
+      "version": "0.0.2",
+      "from": "charenc@>=0.0.1 <0.1.0",
+      "resolved": "https://registry.npmjs.org/charenc/-/charenc-0.0.2.tgz"
+    },
+    "cheerio": {
+      "version": "0.22.0",
+      "from": "cheerio@>=0.22.0 <0.23.0",
+      "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-0.22.0.tgz",
       "dependencies": {
-        "cookie": {
-          "version": "0.1.3",
-          "from": "cookie@0.1.3",
-          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz"
-        },
-        "debug": {
-          "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
-        },
-        "depd": {
-          "version": "1.0.1",
-          "from": "depd@>=1.0.1 <1.1.0",
-          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz"
-        },
-        "ms": {
-          "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+        "lodash.defaults": {
+          "version": "4.2.0",
+          "from": "lodash.defaults@>=4.0.1 <5.0.0",
+          "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-4.2.0.tgz"
         },
-        "uid-safe": {
-          "version": "2.0.0",
-          "from": "uid-safe@>=2.0.0 <2.1.0",
-          "resolved": "https://registry.npmjs.org/uid-safe/-/uid-safe-2.0.0.tgz"
+        "lodash.merge": {
+          "version": "4.6.0",
+          "from": "lodash.merge@>=4.4.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.0.tgz"
         }
       }
     },
-    "extend": {
-      "version": "3.0.1",
-      "from": "extend@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz"
+    "chokidar": {
+      "version": "1.7.0",
+      "from": "chokidar@>=1.4.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-1.7.0.tgz"
     },
-    "extend-shallow": {
-      "version": "2.0.1",
-      "from": "extend-shallow@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz"
+    "cipher-base": {
+      "version": "1.0.3",
+      "from": "cipher-base@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/cipher-base/-/cipher-base-1.0.3.tgz"
     },
-    "extglob": {
-      "version": "0.3.2",
-      "from": "extglob@>=0.3.1 <0.4.0",
-      "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz"
+    "clap": {
+      "version": "1.1.3",
+      "from": "clap@>=1.0.9 <2.0.0",
+      "resolved": "https://registry.npmjs.org/clap/-/clap-1.1.3.tgz"
     },
-    "extract-zip": {
-      "version": "1.5.0",
-      "from": "extract-zip@>=1.5.0 <1.6.0",
-      "resolved": "https://registry.npmjs.org/extract-zip/-/extract-zip-1.5.0.tgz",
+    "clean-css": {
+      "version": "3.4.26",
+      "from": "clean-css@>=3.4.20 <4.0.0",
+      "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-3.4.26.tgz",
       "dependencies": {
-        "debug": {
-          "version": "0.7.4",
-          "from": "debug@0.7.4",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-0.7.4.tgz"
-        },
-        "minimist": {
-          "version": "0.0.8",
-          "from": "minimist@0.0.8",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz"
+        "commander": {
+          "version": "2.8.1",
+          "from": "commander@>=2.8.0 <2.9.0",
+          "resolved": "https://registry.npmjs.org/commander/-/commander-2.8.1.tgz"
         },
-        "mkdirp": {
-          "version": "0.5.0",
-          "from": "mkdirp@0.5.0",
-          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.0.tgz"
+        "source-map": {
+          "version": "0.4.4",
+          "from": "source-map@>=0.4.0 <0.5.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz"
         }
       }
     },
-    "extsprintf": {
+    "cli-boxes": {
+      "version": "1.0.0",
+      "from": "cli-boxes@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/cli-boxes/-/cli-boxes-1.0.0.tgz"
+    },
+    "cli-cursor": {
       "version": "1.0.2",
-      "from": "extsprintf@1.0.2",
-      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.0.2.tgz"
+      "from": "cli-cursor@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-1.0.2.tgz"
     },
-    "fancy-log": {
-      "version": "1.3.0",
-      "from": "fancy-log@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/fancy-log/-/fancy-log-1.3.0.tgz"
+    "cli-table": {
+      "version": "0.3.1",
+      "from": "cli-table@>=0.3.1 <0.4.0",
+      "resolved": "https://registry.npmjs.org/cli-table/-/cli-table-0.3.1.tgz",
+      "dependencies": {
+        "colors": {
+          "version": "1.0.3",
+          "from": "colors@1.0.3",
+          "resolved": "https://registry.npmjs.org/colors/-/colors-1.0.3.tgz"
+        }
+      }
     },
-    "fast-levenshtein": {
-      "version": "2.0.6",
-      "from": "fast-levenshtein@>=2.0.4 <2.1.0",
-      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz"
+    "cli-usage": {
+      "version": "0.1.4",
+      "from": "cli-usage@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/cli-usage/-/cli-usage-0.1.4.tgz"
     },
-    "fastparse": {
+    "cli-width": {
       "version": "1.1.1",
-      "from": "fastparse@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.1.tgz"
-    },
-    "faye-websocket": {
-      "version": "0.10.0",
-      "from": "faye-websocket@>=0.10.0 <0.11.0",
-      "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz"
-    },
-    "fbjs": {
-      "version": "0.8.12",
-      "from": "fbjs@>=0.8.4 <0.9.0",
-      "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz"
-    },
-    "fd-slicer": {
-      "version": "1.0.1",
-      "from": "fd-slicer@>=1.0.1 <1.1.0",
-      "resolved": "https://registry.npmjs.org/fd-slicer/-/fd-slicer-1.0.1.tgz"
-    },
-    "figures": {
-      "version": "1.7.0",
-      "from": "figures@>=1.3.5 <2.0.0",
-      "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz"
-    },
-    "file-loader": {
-      "version": "0.8.5",
-      "from": "file-loader@>=0.8.5 <0.9.0",
-      "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.8.5.tgz"
-    },
-    "filename-regex": {
-      "version": "2.0.1",
-      "from": "filename-regex@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz"
-    },
-    "filesize": {
-      "version": "3.5.10",
-      "from": "filesize@>=3.5.9 <4.0.0",
-      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.5.10.tgz"
-    },
-    "fill-range": {
-      "version": "2.2.3",
-      "from": "fill-range@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz"
-    },
-    "filled-array": {
-      "version": "1.1.0",
-      "from": "filled-array@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/filled-array/-/filled-array-1.1.0.tgz"
-    },
-    "finalhandler": {
-      "version": "1.0.3",
-      "from": "finalhandler@1.0.3",
-      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.3.tgz"
-    },
-    "find-index": {
-      "version": "0.1.1",
-      "from": "find-index@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz"
-    },
-    "find-up": {
-      "version": "1.1.2",
-      "from": "find-up@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz"
+      "from": "cli-width@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-1.1.1.tgz"
     },
-    "findup-sync": {
-      "version": "0.4.3",
-      "from": "findup-sync@>=0.4.2 <0.5.0",
-      "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.4.3.tgz"
+    "cliui": {
+      "version": "3.2.0",
+      "from": "cliui@>=3.2.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz"
     },
-    "fined": {
+    "clone": {
       "version": "1.0.2",
-      "from": "fined@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/fined/-/fined-1.0.2.tgz"
+      "from": "clone@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.2.tgz"
     },
-    "first-chunk-stream": {
+    "clone-buffer": {
       "version": "1.0.0",
-      "from": "first-chunk-stream@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/first-chunk-stream/-/first-chunk-stream-1.0.0.tgz"
+      "from": "clone-buffer@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/clone-buffer/-/clone-buffer-1.0.0.tgz"
     },
-    "flagged-respawn": {
-      "version": "0.3.2",
-      "from": "flagged-respawn@>=0.3.2 <0.4.0",
-      "resolved": "https://registry.npmjs.org/flagged-respawn/-/flagged-respawn-0.3.2.tgz"
+    "clone-deep": {
+      "version": "0.2.4",
+      "from": "clone-deep@>=0.2.4 <0.3.0",
+      "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-0.2.4.tgz"
     },
-    "flatten": {
-      "version": "1.0.2",
-      "from": "flatten@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz"
+    "clone-stats": {
+      "version": "0.0.1",
+      "from": "clone-stats@>=0.0.1 <0.0.2",
+      "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-0.0.1.tgz"
     },
-    "for-in": {
-      "version": "1.0.2",
-      "from": "for-in@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz"
+    "cloneable-readable": {
+      "version": "1.0.0",
+      "from": "cloneable-readable@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/cloneable-readable/-/cloneable-readable-1.0.0.tgz"
     },
-    "for-own": {
-      "version": "0.1.5",
-      "from": "for-own@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz"
+    "co": {
+      "version": "4.6.0",
+      "from": "co@>=4.6.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz"
     },
-    "foreach": {
-      "version": "2.0.5",
-      "from": "foreach@>=2.0.5 <3.0.0",
-      "resolved": "https://registry.npmjs.org/foreach/-/foreach-2.0.5.tgz"
+    "coa": {
+      "version": "1.0.2",
+      "from": "coa@>=1.0.1 <1.1.0",
+      "resolved": "https://registry.npmjs.org/coa/-/coa-1.0.2.tgz"
     },
-    "forever-agent": {
-      "version": "0.6.1",
-      "from": "forever-agent@>=0.6.1 <0.7.0",
-      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz"
+    "code-point-at": {
+      "version": "1.1.0",
+      "from": "code-point-at@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz"
     },
-    "fork-stream": {
-      "version": "0.0.4",
-      "from": "fork-stream@>=0.0.4 <0.0.5",
-      "resolved": "https://registry.npmjs.org/fork-stream/-/fork-stream-0.0.4.tgz"
+    "color": {
+      "version": "0.11.4",
+      "from": "color@>=0.11.0 <0.12.0",
+      "resolved": "https://registry.npmjs.org/color/-/color-0.11.4.tgz"
     },
-    "form-data": {
-      "version": "2.1.4",
-      "from": "form-data@>=2.1.1 <2.2.0",
-      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz"
+    "color-convert": {
+      "version": "1.9.0",
+      "from": "color-convert@>=1.3.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.0.tgz"
     },
-    "formatio": {
-      "version": "1.1.1",
-      "from": "formatio@1.1.1",
-      "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.1.1.tgz"
+    "color-functions": {
+      "version": "1.1.0",
+      "from": "color-functions@1.1.0",
+      "resolved": "https://registry.npmjs.org/color-functions/-/color-functions-1.1.0.tgz"
     },
-    "forwarded": {
-      "version": "0.1.0",
-      "from": "forwarded@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.0.tgz"
+    "color-name": {
+      "version": "1.1.2",
+      "from": "color-name@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.2.tgz"
     },
-    "fresh": {
+    "color-string": {
       "version": "0.3.0",
-      "from": "fresh@0.3.0",
-      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.3.0.tgz"
-    },
-    "from": {
-      "version": "0.1.7",
-      "from": "from@>=0.0.0 <1.0.0",
-      "resolved": "https://registry.npmjs.org/from/-/from-0.1.7.tgz"
+      "from": "color-string@>=0.3.0 <0.4.0",
+      "resolved": "https://registry.npmjs.org/color-string/-/color-string-0.3.0.tgz"
     },
-    "fs-exists-sync": {
-      "version": "0.1.0",
-      "from": "fs-exists-sync@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/fs-exists-sync/-/fs-exists-sync-0.1.0.tgz"
+    "colormin": {
+      "version": "1.1.2",
+      "from": "colormin@>=1.0.5 <2.0.0",
+      "resolved": "https://registry.npmjs.org/colormin/-/colormin-1.1.2.tgz"
     },
-    "fs-extra": {
-      "version": "0.26.7",
-      "from": "fs-extra@>=0.26.7 <0.27.0",
-      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz"
+    "colors": {
+      "version": "1.1.2",
+      "from": "colors@>=1.1.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/colors/-/colors-1.1.2.tgz"
     },
-    "fs.realpath": {
-      "version": "1.0.0",
-      "from": "fs.realpath@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz"
+    "combined-stream": {
+      "version": "1.0.5",
+      "from": "combined-stream@>=1.0.5 <1.1.0",
+      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz"
     },
-    "fstream": {
-      "version": "1.0.11",
-      "from": "fstream@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz"
+    "commander": {
+      "version": "2.9.0",
+      "from": "commander@>=2.7.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz"
     },
-    "ftp": {
-      "version": "0.3.10",
-      "from": "ftp@>=0.3.8 <0.4.0",
-      "resolved": "https://registry.npmjs.org/ftp/-/ftp-0.3.10.tgz",
+    "commoner": {
+      "version": "0.10.8",
+      "from": "commoner@>=0.10.1 <0.11.0",
+      "resolved": "https://registry.npmjs.org/commoner/-/commoner-0.10.8.tgz",
       "dependencies": {
-        "isarray": {
-          "version": "0.0.1",
-          "from": "isarray@0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
-        },
-        "readable-stream": {
-          "version": "1.1.14",
-          "from": "readable-stream@>=1.1.0 <1.2.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz"
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.0 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
+        "glob": {
+          "version": "5.0.15",
+          "from": "glob@>=5.0.15 <6.0.0",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
         }
       }
     },
-    "function-bind": {
-      "version": "1.1.0",
-      "from": "function-bind@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.0.tgz"
-    },
-    "function.prototype.name": {
+    "component-bind": {
       "version": "1.0.0",
-      "from": "function.prototype.name@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.0.0.tgz"
-    },
-    "gauge": {
-      "version": "2.7.4",
-      "from": "gauge@>=2.7.3 <2.8.0",
-      "resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz"
-    },
-    "gaze": {
-      "version": "0.5.2",
-      "from": "gaze@>=0.5.1 <0.6.0",
-      "resolved": "https://registry.npmjs.org/gaze/-/gaze-0.5.2.tgz"
-    },
-    "generate-function": {
-      "version": "2.0.0",
-      "from": "generate-function@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/generate-function/-/generate-function-2.0.0.tgz"
-    },
-    "generate-object-property": {
-      "version": "1.2.0",
-      "from": "generate-object-property@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/generate-object-property/-/generate-object-property-1.2.0.tgz"
+      "from": "component-bind@1.0.0",
+      "resolved": "https://registry.npmjs.org/component-bind/-/component-bind-1.0.0.tgz"
     },
-    "generic-names": {
-      "version": "1.0.2",
-      "from": "generic-names@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/generic-names/-/generic-names-1.0.2.tgz"
+    "component-emitter": {
+      "version": "1.1.2",
+      "from": "component-emitter@1.1.2",
+      "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.1.2.tgz"
     },
-    "get-caller-file": {
-      "version": "1.0.2",
-      "from": "get-caller-file@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz"
+    "component-inherit": {
+      "version": "0.0.3",
+      "from": "component-inherit@0.0.3",
+      "resolved": "https://registry.npmjs.org/component-inherit/-/component-inherit-0.0.3.tgz"
     },
-    "get-own-enumerable-property-symbols": {
-      "version": "1.0.1",
-      "from": "get-own-enumerable-property-symbols@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/get-own-enumerable-property-symbols/-/get-own-enumerable-property-symbols-1.0.1.tgz"
+    "compressible": {
+      "version": "2.0.10",
+      "from": "compressible@>=2.0.5 <2.1.0",
+      "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.10.tgz"
     },
-    "get-stdin": {
-      "version": "4.0.1",
-      "from": "get-stdin@>=4.0.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz"
+    "compression": {
+      "version": "1.5.2",
+      "from": "compression@>=1.5.2 <1.6.0",
+      "resolved": "https://registry.npmjs.org/compression/-/compression-1.5.2.tgz",
+      "dependencies": {
+        "accepts": {
+          "version": "1.2.13",
+          "from": "accepts@>=1.2.12 <1.3.0",
+          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.2.13.tgz"
+        },
+        "bytes": {
+          "version": "2.1.0",
+          "from": "bytes@2.1.0",
+          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.1.0.tgz"
+        },
+        "debug": {
+          "version": "2.2.0",
+          "from": "debug@>=2.2.0 <2.3.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+        },
+        "ms": {
+          "version": "0.7.1",
+          "from": "ms@0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+        },
+        "negotiator": {
+          "version": "0.5.3",
+          "from": "negotiator@0.5.3",
+          "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.5.3.tgz"
+        },
+        "vary": {
+          "version": "1.0.1",
+          "from": "vary@>=1.0.1 <1.1.0",
+          "resolved": "https://registry.npmjs.org/vary/-/vary-1.0.1.tgz"
+        }
+      }
     },
-    "get-stream": {
-      "version": "3.0.0",
-      "from": "get-stream@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz"
+    "concat-map": {
+      "version": "0.0.1",
+      "from": "concat-map@0.0.1",
+      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz"
     },
-    "getpass": {
-      "version": "0.1.7",
-      "from": "getpass@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
+    "concat-stream": {
+      "version": "1.5.0",
+      "from": "concat-stream@1.5.0",
+      "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.5.0.tgz",
       "dependencies": {
-        "assert-plus": {
+        "isarray": {
           "version": "1.0.0",
-          "from": "assert-plus@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz"
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+        },
+        "readable-stream": {
+          "version": "2.0.6",
+          "from": "readable-stream@>=2.0.0 <2.1.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz"
         }
       }
     },
-    "git-rev": {
-      "version": "0.2.1",
-      "from": "git-rev@0.2.1",
-      "resolved": "https://registry.npmjs.org/git-rev/-/git-rev-0.2.1.tgz"
-    },
-    "glamor": {
-      "version": "2.20.25",
-      "from": "glamor@>=2.20.24 <3.0.0",
-      "resolved": "https://registry.npmjs.org/glamor/-/glamor-2.20.25.tgz"
-    },
-    "glob": {
-      "version": "7.1.2",
-      "from": "glob@>=7.0.3 <8.0.0",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz"
+    "configstore": {
+      "version": "2.1.0",
+      "from": "configstore@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/configstore/-/configstore-2.1.0.tgz",
+      "dependencies": {
+        "uuid": {
+          "version": "2.0.3",
+          "from": "uuid@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz"
+        }
+      }
     },
-    "glob-base": {
-      "version": "0.3.0",
-      "from": "glob-base@>=0.3.0 <0.4.0",
-      "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz"
+    "connect": {
+      "version": "3.6.2",
+      "from": "connect@>=3.3.5 <4.0.0",
+      "resolved": "https://registry.npmjs.org/connect/-/connect-3.6.2.tgz"
     },
-    "glob-escape": {
-      "version": "0.0.2",
-      "from": "glob-escape@>=0.0.1 <0.1.0",
-      "resolved": "https://registry.npmjs.org/glob-escape/-/glob-escape-0.0.2.tgz"
+    "connect-history-api-fallback": {
+      "version": "1.3.0",
+      "from": "connect-history-api-fallback@>=1.3.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.3.0.tgz"
     },
-    "glob-parent": {
-      "version": "2.0.0",
-      "from": "glob-parent@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz"
+    "connect-livereload": {
+      "version": "0.5.4",
+      "from": "connect-livereload@>=0.5.4 <0.6.0",
+      "resolved": "https://registry.npmjs.org/connect-livereload/-/connect-livereload-0.5.4.tgz"
     },
-    "glob-stream": {
-      "version": "3.1.18",
-      "from": "glob-stream@>=3.1.5 <4.0.0",
-      "resolved": "https://registry.npmjs.org/glob-stream/-/glob-stream-3.1.18.tgz",
+    "connect-timeout": {
+      "version": "1.6.2",
+      "from": "connect-timeout@>=1.6.2 <1.7.0",
+      "resolved": "https://registry.npmjs.org/connect-timeout/-/connect-timeout-1.6.2.tgz",
       "dependencies": {
-        "glob": {
-          "version": "4.5.3",
-          "from": "glob@>=4.3.1 <5.0.0",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-4.5.3.tgz"
-        },
-        "isarray": {
-          "version": "0.0.1",
-          "from": "isarray@0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
-        },
-        "minimatch": {
-          "version": "2.0.10",
-          "from": "minimatch@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-2.0.10.tgz"
-        },
-        "readable-stream": {
-          "version": "1.0.34",
-          "from": "readable-stream@>=1.0.33-1 <1.1.0-0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
+        "debug": {
+          "version": "2.2.0",
+          "from": "debug@>=2.2.0 <2.3.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
         },
-        "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.0 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
+        "http-errors": {
+          "version": "1.3.1",
+          "from": "http-errors@>=1.3.1 <1.4.0",
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
         },
-        "through2": {
-          "version": "0.6.5",
-          "from": "through2@>=0.6.1 <0.7.0",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz"
+        "ms": {
+          "version": "0.7.1",
+          "from": "ms@0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
         }
       }
     },
-    "glob-watcher": {
-      "version": "0.0.6",
-      "from": "glob-watcher@>=0.0.6 <0.0.7",
-      "resolved": "https://registry.npmjs.org/glob-watcher/-/glob-watcher-0.0.6.tgz"
+    "console-browserify": {
+      "version": "1.1.0",
+      "from": "console-browserify@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.1.0.tgz"
     },
-    "glob2base": {
-      "version": "0.0.12",
-      "from": "glob2base@>=0.0.12 <0.0.13",
-      "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz"
+    "console-control-strings": {
+      "version": "1.1.0",
+      "from": "console-control-strings@>=1.1.0 <1.2.0",
+      "resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz"
     },
-    "global-modules": {
-      "version": "0.2.3",
-      "from": "global-modules@>=0.2.3 <0.3.0",
-      "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-0.2.3.tgz"
+    "constants-browserify": {
+      "version": "0.0.1",
+      "from": "constants-browserify@0.0.1",
+      "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-0.0.1.tgz"
     },
-    "global-prefix": {
-      "version": "0.1.5",
-      "from": "global-prefix@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-0.1.5.tgz"
+    "content-disposition": {
+      "version": "0.5.2",
+      "from": "content-disposition@0.5.2",
+      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.2.tgz"
     },
-    "globby": {
-      "version": "5.0.0",
-      "from": "globby@>=5.0.0 <5.1.0",
-      "resolved": "https://registry.npmjs.org/globby/-/globby-5.0.0.tgz"
+    "content-type": {
+      "version": "1.0.2",
+      "from": "content-type@>=1.0.2 <1.1.0",
+      "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.2.tgz"
     },
-    "globule": {
-      "version": "0.1.0",
-      "from": "globule@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/globule/-/globule-0.1.0.tgz",
+    "convert-source-map": {
+      "version": "1.5.0",
+      "from": "convert-source-map@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.5.0.tgz"
+    },
+    "cookie": {
+      "version": "0.3.1",
+      "from": "cookie@0.3.1",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.3.1.tgz"
+    },
+    "cookie-parser": {
+      "version": "1.3.5",
+      "from": "cookie-parser@>=1.3.5 <1.4.0",
+      "resolved": "https://registry.npmjs.org/cookie-parser/-/cookie-parser-1.3.5.tgz",
       "dependencies": {
-        "glob": {
-          "version": "3.1.21",
-          "from": "glob@>=3.1.21 <3.2.0",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-3.1.21.tgz"
-        },
-        "graceful-fs": {
-          "version": "1.2.3",
-          "from": "graceful-fs@>=1.2.0 <1.3.0",
-          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-1.2.3.tgz"
-        },
-        "inherits": {
-          "version": "1.0.2",
-          "from": "inherits@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/inherits/-/inherits-1.0.2.tgz"
-        },
-        "lodash": {
-          "version": "1.0.2",
-          "from": "lodash@>=1.0.1 <1.1.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-1.0.2.tgz"
-        },
-        "minimatch": {
-          "version": "0.2.14",
-          "from": "minimatch@>=0.2.11 <0.3.0",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.2.14.tgz"
+        "cookie": {
+          "version": "0.1.3",
+          "from": "cookie@0.1.3",
+          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz"
         }
       }
     },
-    "glogg": {
-      "version": "1.0.0",
-      "from": "glogg@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/glogg/-/glogg-1.0.0.tgz"
+    "cookie-signature": {
+      "version": "1.0.6",
+      "from": "cookie-signature@1.0.6",
+      "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz"
     },
-    "got": {
-      "version": "6.7.1",
-      "from": "got@>=6.7.1 <7.0.0",
-      "resolved": "https://registry.npmjs.org/got/-/got-6.7.1.tgz"
+    "core-js": {
+      "version": "2.4.1",
+      "from": "core-js@>=2.1.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.4.1.tgz"
     },
-    "graceful-fs": {
-      "version": "4.1.11",
-      "from": "graceful-fs@>=4.1.2 <5.0.0",
-      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz"
+    "core-util-is": {
+      "version": "1.0.2",
+      "from": "core-util-is@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz"
     },
-    "graceful-readlink": {
-      "version": "1.0.1",
-      "from": "graceful-readlink@>=1.0.0",
-      "resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz"
+    "cosmiconfig": {
+      "version": "2.1.3",
+      "from": "cosmiconfig@>=2.1.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-2.1.3.tgz"
     },
-    "growl": {
-      "version": "1.9.2",
-      "from": "growl@1.9.2",
-      "resolved": "https://registry.npmjs.org/growl/-/growl-1.9.2.tgz"
+    "crc": {
+      "version": "3.3.0",
+      "from": "crc@3.3.0",
+      "resolved": "https://registry.npmjs.org/crc/-/crc-3.3.0.tgz"
     },
-    "growly": {
-      "version": "1.3.0",
-      "from": "growly@>=1.3.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz"
+    "create-ecdh": {
+      "version": "4.0.0",
+      "from": "create-ecdh@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.0.tgz"
     },
-    "gulp": {
-      "version": "3.9.1",
-      "from": "gulp@>=3.9.1 <3.10.0",
-      "resolved": "https://registry.npmjs.org/gulp/-/gulp-3.9.1.tgz",
+    "create-error-class": {
+      "version": "3.0.2",
+      "from": "create-error-class@>=3.0.1 <4.0.0",
+      "resolved": "https://registry.npmjs.org/create-error-class/-/create-error-class-3.0.2.tgz"
+    },
+    "create-hash": {
+      "version": "1.1.3",
+      "from": "create-hash@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/create-hash/-/create-hash-1.1.3.tgz",
+      "dependencies": {
+        "ripemd160": {
+          "version": "2.0.1",
+          "from": "ripemd160@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz"
+        },
+        "sha.js": {
+          "version": "2.4.8",
+          "from": "sha.js@>=2.4.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz"
+        }
+      }
+    },
+    "create-hmac": {
+      "version": "1.1.6",
+      "from": "create-hmac@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/create-hmac/-/create-hmac-1.1.6.tgz",
+      "dependencies": {
+        "ripemd160": {
+          "version": "2.0.1",
+          "from": "ripemd160@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz"
+        },
+        "sha.js": {
+          "version": "2.4.8",
+          "from": "sha.js@>=2.4.8 <3.0.0",
+          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz"
+        }
+      }
+    },
+    "cross-spawn": {
+      "version": "3.0.1",
+      "from": "cross-spawn@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-3.0.1.tgz",
       "dependencies": {
-        "semver": {
-          "version": "4.3.6",
-          "from": "semver@>=4.1.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz"
+        "lru-cache": {
+          "version": "4.0.2",
+          "from": "lru-cache@>=4.0.1 <5.0.0",
+          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.0.2.tgz"
         }
       }
     },
-    "gulp-cache": {
-      "version": "0.4.6",
-      "from": "gulp-cache@>=0.4.5 <0.5.0",
-      "resolved": "https://registry.npmjs.org/gulp-cache/-/gulp-cache-0.4.6.tgz",
+    "cross-spawn-async": {
+      "version": "2.2.5",
+      "from": "cross-spawn-async@>=2.1.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/cross-spawn-async/-/cross-spawn-async-2.2.5.tgz",
       "dependencies": {
-        "bluebird": {
-          "version": "3.5.0",
-          "from": "bluebird@>=3.0.5 <4.0.0",
-          "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.5.0.tgz"
-        },
-        "vinyl": {
-          "version": "1.2.0",
-          "from": "vinyl@>=1.1.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz"
+        "lru-cache": {
+          "version": "4.0.2",
+          "from": "lru-cache@>=4.0.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.0.2.tgz"
         }
       }
     },
-    "gulp-changed": {
-      "version": "1.3.2",
-      "from": "gulp-changed@>=1.3.2 <1.4.0",
-      "resolved": "https://registry.npmjs.org/gulp-changed/-/gulp-changed-1.3.2.tgz"
+    "crypt": {
+      "version": "0.0.2",
+      "from": "crypt@>=0.0.1 <0.1.0",
+      "resolved": "https://registry.npmjs.org/crypt/-/crypt-0.0.2.tgz"
     },
-    "gulp-clean-css": {
-      "version": "3.0.4",
-      "from": "gulp-clean-css@>=3.0.4 <3.1.0",
-      "resolved": "https://registry.npmjs.org/gulp-clean-css/-/gulp-clean-css-3.0.4.tgz"
+    "cryptiles": {
+      "version": "2.0.5",
+      "from": "cryptiles@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz"
     },
-    "gulp-clip-empty-files": {
-      "version": "0.1.2",
-      "from": "gulp-clip-empty-files@>=0.1.2 <0.2.0",
-      "resolved": "https://registry.npmjs.org/gulp-clip-empty-files/-/gulp-clip-empty-files-0.1.2.tgz"
+    "crypto-browserify": {
+      "version": "3.2.8",
+      "from": "crypto-browserify@>=3.2.6 <3.3.0",
+      "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.2.8.tgz"
     },
-    "gulp-clone": {
+    "crypto-random-string": {
       "version": "1.0.0",
-      "from": "gulp-clone@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/gulp-clone/-/gulp-clone-1.0.0.tgz",
+      "from": "crypto-random-string@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-1.0.0.tgz"
+    },
+    "csrf": {
+      "version": "3.0.6",
+      "from": "csrf@>=3.0.0 <3.1.0",
+      "resolved": "https://registry.npmjs.org/csrf/-/csrf-3.0.6.tgz"
+    },
+    "css-color-names": {
+      "version": "0.0.4",
+      "from": "css-color-names@0.0.4",
+      "resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz"
+    },
+    "css-loader": {
+      "version": "0.28.3",
+      "from": "css-loader@>=0.28.0 <0.29.0",
+      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.3.tgz",
       "dependencies": {
-        "ansi-regex": {
-          "version": "0.2.1",
-          "from": "ansi-regex@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-0.2.1.tgz"
-        },
-        "ansi-styles": {
+        "loader-utils": {
           "version": "1.1.0",
-          "from": "ansi-styles@>=1.1.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-1.1.0.tgz"
-        },
-        "chalk": {
-          "version": "0.5.1",
-          "from": "chalk@>=0.5.0 <0.6.0",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-0.5.1.tgz"
-        },
-        "dateformat": {
-          "version": "1.0.12",
-          "from": "dateformat@>=1.0.7-1.2.3 <2.0.0",
-          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz"
-        },
-        "gulp-util": {
-          "version": "2.2.20",
-          "from": "gulp-util@>=2.2.14 <2.3.0",
-          "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-2.2.20.tgz",
-          "dependencies": {
-            "through2": {
-              "version": "0.5.1",
-              "from": "through2@>=0.5.0 <0.6.0",
-              "resolved": "https://registry.npmjs.org/through2/-/through2-0.5.1.tgz"
-            }
-          }
-        },
-        "has-ansi": {
-          "version": "0.1.0",
-          "from": "has-ansi@>=0.1.0 <0.2.0",
-          "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-0.1.0.tgz"
-        },
-        "isarray": {
-          "version": "0.0.1",
-          "from": "isarray@0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
-        },
-        "lodash._reinterpolate": {
-          "version": "2.4.1",
-          "from": "lodash._reinterpolate@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-2.4.1.tgz"
-        },
-        "lodash.defaults": {
-          "version": "2.4.1",
-          "from": "lodash.defaults@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-2.4.1.tgz"
-        },
-        "lodash.escape": {
-          "version": "2.4.1",
-          "from": "lodash.escape@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-2.4.1.tgz"
-        },
-        "lodash.keys": {
-          "version": "2.4.1",
-          "from": "lodash.keys@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
-        },
-        "lodash.template": {
-          "version": "2.4.1",
-          "from": "lodash.template@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-2.4.1.tgz"
-        },
-        "lodash.templatesettings": {
-          "version": "2.4.1",
-          "from": "lodash.templatesettings@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-2.4.1.tgz"
-        },
-        "minimist": {
-          "version": "0.2.0",
-          "from": "minimist@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.0.tgz"
-        },
-        "object-keys": {
-          "version": "0.4.0",
-          "from": "object-keys@>=0.4.0 <0.5.0",
-          "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-0.4.0.tgz"
-        },
-        "readable-stream": {
-          "version": "1.0.34",
-          "from": "readable-stream@>=1.0.17 <1.1.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.0 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
-        },
-        "strip-ansi": {
-          "version": "0.3.0",
-          "from": "strip-ansi@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-0.3.0.tgz"
-        },
-        "supports-color": {
-          "version": "0.2.0",
-          "from": "supports-color@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-0.2.0.tgz"
-        },
-        "through2": {
-          "version": "0.4.2",
-          "from": "through2@>=0.4.1 <0.5.0",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.4.2.tgz",
-          "dependencies": {
-            "xtend": {
-              "version": "2.1.2",
-              "from": "xtend@>=2.1.1 <2.2.0",
-              "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz"
-            }
-          }
-        },
-        "vinyl": {
-          "version": "0.2.3",
-          "from": "vinyl@>=0.2.1 <0.3.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.2.3.tgz"
+          "from": "loader-utils@>=1.0.2 <2.0.0",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
         },
-        "xtend": {
-          "version": "3.0.0",
-          "from": "xtend@>=3.0.0 <3.1.0",
-          "resolved": "https://registry.npmjs.org/xtend/-/xtend-3.0.0.tgz"
+        "lodash.camelcase": {
+          "version": "4.3.0",
+          "from": "lodash.camelcase@>=4.3.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz"
         }
       }
     },
-    "gulp-connect": {
-      "version": "5.0.0",
-      "from": "gulp-connect@>=5.0.0 <5.1.0",
-      "resolved": "https://registry.npmjs.org/gulp-connect/-/gulp-connect-5.0.0.tgz",
+    "css-modules-loader-core": {
+      "version": "1.1.0",
+      "from": "css-modules-loader-core@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/css-modules-loader-core/-/css-modules-loader-core-1.1.0.tgz",
       "dependencies": {
-        "body-parser": {
-          "version": "1.13.3",
-          "from": "body-parser@>=1.13.3 <1.14.0",
-          "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.13.3.tgz"
-        },
-        "bytes": {
-          "version": "2.1.0",
-          "from": "bytes@2.1.0",
-          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.1.0.tgz"
-        },
-        "connect": {
-          "version": "2.30.2",
-          "from": "connect@>=2.30.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/connect/-/connect-2.30.2.tgz"
+        "postcss": {
+          "version": "6.0.1",
+          "from": "postcss@6.0.1",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
         },
+        "supports-color": {
+          "version": "3.2.3",
+          "from": "supports-color@>=3.2.3 <4.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+        }
+      }
+    },
+    "css-select": {
+      "version": "1.2.0",
+      "from": "css-select@>=1.2.0 <1.3.0",
+      "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz"
+    },
+    "css-selector-tokenizer": {
+      "version": "0.7.0",
+      "from": "css-selector-tokenizer@>=0.7.0 <0.8.0",
+      "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.7.0.tgz"
+    },
+    "css-what": {
+      "version": "2.1.0",
+      "from": "css-what@>=2.1.0 <2.2.0",
+      "resolved": "https://registry.npmjs.org/css-what/-/css-what-2.1.0.tgz"
+    },
+    "cssesc": {
+      "version": "0.1.0",
+      "from": "cssesc@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-0.1.0.tgz"
+    },
+    "cssnano": {
+      "version": "3.10.0",
+      "from": "cssnano@>=2.6.1 <4.0.0",
+      "resolved": "https://registry.npmjs.org/cssnano/-/cssnano-3.10.0.tgz"
+    },
+    "csso": {
+      "version": "2.3.2",
+      "from": "csso@>=2.3.1 <2.4.0",
+      "resolved": "https://registry.npmjs.org/csso/-/csso-2.3.2.tgz"
+    },
+    "csurf": {
+      "version": "1.8.3",
+      "from": "csurf@>=1.8.3 <1.9.0",
+      "resolved": "https://registry.npmjs.org/csurf/-/csurf-1.8.3.tgz",
+      "dependencies": {
         "cookie": {
           "version": "0.1.3",
           "from": "cookie@0.1.3",
           "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz"
         },
-        "debug": {
-          "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
-        },
-        "depd": {
-          "version": "1.0.1",
-          "from": "depd@>=1.0.1 <1.1.0",
-          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz"
-        },
-        "escape-html": {
-          "version": "1.0.2",
-          "from": "escape-html@1.0.2",
-          "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.2.tgz"
-        },
-        "event-stream": {
-          "version": "3.3.4",
-          "from": "event-stream@>=3.3.2 <4.0.0",
-          "resolved": "https://registry.npmjs.org/event-stream/-/event-stream-3.3.4.tgz"
-        },
-        "finalhandler": {
-          "version": "0.4.0",
-          "from": "finalhandler@0.4.0",
-          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.4.0.tgz"
-        },
         "http-errors": {
           "version": "1.3.1",
           "from": "http-errors@>=1.3.1 <1.4.0",
           "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
-        },
-        "iconv-lite": {
-          "version": "0.4.11",
-          "from": "iconv-lite@0.4.11",
-          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.11.tgz"
-        },
-        "map-stream": {
-          "version": "0.1.0",
-          "from": "map-stream@>=0.1.0 <0.2.0",
-          "resolved": "https://registry.npmjs.org/map-stream/-/map-stream-0.1.0.tgz"
-        },
-        "mime": {
-          "version": "1.3.4",
-          "from": "mime@1.3.4",
-          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz"
-        },
-        "ms": {
-          "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
-        },
-        "qs": {
-          "version": "4.0.0",
-          "from": "qs@4.0.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-4.0.0.tgz"
-        },
-        "range-parser": {
-          "version": "1.0.3",
-          "from": "range-parser@>=1.0.3 <1.1.0",
-          "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.0.3.tgz"
-        },
-        "raw-body": {
-          "version": "2.1.7",
-          "from": "raw-body@>=2.1.2 <2.2.0",
-          "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.1.7.tgz",
-          "dependencies": {
-            "bytes": {
-              "version": "2.4.0",
-              "from": "bytes@2.4.0",
-              "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz"
-            },
-            "iconv-lite": {
-              "version": "0.4.13",
-              "from": "iconv-lite@0.4.13",
-              "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.13.tgz"
-            }
-          }
-        },
-        "send": {
-          "version": "0.13.2",
-          "from": "send@0.13.2",
-          "resolved": "https://registry.npmjs.org/send/-/send-0.13.2.tgz",
-          "dependencies": {
-            "depd": {
-              "version": "1.1.0",
-              "from": "depd@~1.1.0",
-              "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.0.tgz"
-            },
-            "escape-html": {
-              "version": "1.0.3",
-              "from": "escape-html@~1.0.3",
-              "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz"
-            },
-            "statuses": {
-              "version": "1.2.1",
-              "from": "statuses@>=1.2.1 <1.3.0",
-              "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.2.1.tgz"
-            }
-          }
-        },
-        "serve-static": {
-          "version": "1.10.3",
-          "from": "serve-static@>=1.10.0 <1.11.0",
-          "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.10.3.tgz",
-          "dependencies": {
-            "escape-html": {
-              "version": "1.0.3",
-              "from": "escape-html@~1.0.3",
-              "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz"
-            }
-          }
-        },
-        "split": {
-          "version": "0.3.3",
-          "from": "split@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/split/-/split-0.3.3.tgz"
         }
       }
     },
-    "gulp-debug": {
-      "version": "3.1.0",
-      "from": "gulp-debug@3.1.0",
-      "resolved": "https://registry.npmjs.org/gulp-debug/-/gulp-debug-3.1.0.tgz"
+    "currently-unhandled": {
+      "version": "0.4.1",
+      "from": "currently-unhandled@>=0.4.1 <0.5.0",
+      "resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz"
+    },
+    "custom-event": {
+      "version": "1.0.1",
+      "from": "custom-event@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/custom-event/-/custom-event-1.0.1.tgz"
+    },
+    "cyclist": {
+      "version": "0.2.2",
+      "from": "cyclist@>=0.2.2 <0.3.0",
+      "resolved": "https://registry.npmjs.org/cyclist/-/cyclist-0.2.2.tgz"
+    },
+    "d": {
+      "version": "1.0.0",
+      "from": "d@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/d/-/d-1.0.0.tgz"
+    },
+    "d3": {
+      "version": "3.5.17",
+      "from": "d3@>=3.5.6 <4.0.0",
+      "resolved": "https://registry.npmjs.org/d3/-/d3-3.5.17.tgz"
+    },
+    "dashdash": {
+      "version": "1.14.1",
+      "from": "dashdash@>=1.12.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/dashdash/-/dashdash-1.14.1.tgz",
+      "dependencies": {
+        "assert-plus": {
+          "version": "1.0.0",
+          "from": "assert-plus@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz"
+        }
+      }
+    },
+    "date-now": {
+      "version": "0.1.4",
+      "from": "date-now@>=0.1.4 <0.2.0",
+      "resolved": "https://registry.npmjs.org/date-now/-/date-now-0.1.4.tgz"
+    },
+    "dateformat": {
+      "version": "2.0.0",
+      "from": "dateformat@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-2.0.0.tgz"
+    },
+    "deasync": {
+      "version": "0.1.9",
+      "from": "deasync@>=0.1.7 <0.2.0",
+      "resolved": "https://registry.npmjs.org/deasync/-/deasync-0.1.9.tgz"
+    },
+    "debug": {
+      "version": "2.6.7",
+      "from": "debug@2.6.7",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.7.tgz"
+    },
+    "decamelize": {
+      "version": "1.2.0",
+      "from": "decamelize@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz"
+    },
+    "decomment": {
+      "version": "0.8.7",
+      "from": "decomment@>=0.8.2 <0.9.0",
+      "resolved": "https://registry.npmjs.org/decomment/-/decomment-0.8.7.tgz"
+    },
+    "deep-eql": {
+      "version": "0.1.3",
+      "from": "deep-eql@>=0.1.3 <0.2.0",
+      "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-0.1.3.tgz",
+      "dependencies": {
+        "type-detect": {
+          "version": "0.1.1",
+          "from": "type-detect@0.1.1",
+          "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-0.1.1.tgz"
+        }
+      }
+    },
+    "deep-extend": {
+      "version": "0.4.2",
+      "from": "deep-extend@>=0.4.0 <0.5.0",
+      "resolved": "https://registry.npmjs.org/deep-extend/-/deep-extend-0.4.2.tgz"
+    },
+    "deep-is": {
+      "version": "0.1.3",
+      "from": "deep-is@>=0.1.3 <0.2.0",
+      "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz"
+    },
+    "defaults": {
+      "version": "1.0.3",
+      "from": "defaults@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.3.tgz"
+    },
+    "define-properties": {
+      "version": "1.1.2",
+      "from": "define-properties@>=1.1.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.1.2.tgz",
+      "dependencies": {
+        "object-keys": {
+          "version": "1.0.11",
+          "from": "object-keys@>=1.0.8 <2.0.0",
+          "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.0.11.tgz"
+        }
+      }
+    },
+    "defined": {
+      "version": "1.0.0",
+      "from": "defined@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/defined/-/defined-1.0.0.tgz"
+    },
+    "del": {
+      "version": "2.2.2",
+      "from": "del@>=2.2.2 <3.0.0",
+      "resolved": "https://registry.npmjs.org/del/-/del-2.2.2.tgz"
+    },
+    "delayed-stream": {
+      "version": "1.0.0",
+      "from": "delayed-stream@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz"
+    },
+    "delegates": {
+      "version": "1.0.0",
+      "from": "delegates@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz"
+    },
+    "depd": {
+      "version": "1.1.0",
+      "from": "depd@>=1.1.0 <1.2.0",
+      "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.0.tgz"
+    },
+    "deprecated": {
+      "version": "0.0.1",
+      "from": "deprecated@>=0.0.1 <0.0.2",
+      "resolved": "https://registry.npmjs.org/deprecated/-/deprecated-0.0.1.tgz"
+    },
+    "des.js": {
+      "version": "1.0.0",
+      "from": "des.js@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/des.js/-/des.js-1.0.0.tgz"
+    },
+    "destroy": {
+      "version": "1.0.4",
+      "from": "destroy@>=1.0.4 <1.1.0",
+      "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.0.4.tgz"
+    },
+    "detect-file": {
+      "version": "0.1.0",
+      "from": "detect-file@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/detect-file/-/detect-file-0.1.0.tgz"
+    },
+    "detect-node": {
+      "version": "2.0.3",
+      "from": "detect-node@>=2.0.3 <3.0.0",
+      "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.0.3.tgz"
+    },
+    "detective": {
+      "version": "4.5.0",
+      "from": "detective@>=4.3.1 <5.0.0",
+      "resolved": "https://registry.npmjs.org/detective/-/detective-4.5.0.tgz",
+      "dependencies": {
+        "acorn": {
+          "version": "4.0.13",
+          "from": "acorn@>=4.0.3 <5.0.0",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz"
+        }
+      }
+    },
+    "di": {
+      "version": "0.0.1",
+      "from": "di@>=0.0.1 <0.0.2",
+      "resolved": "https://registry.npmjs.org/di/-/di-0.0.1.tgz"
     },
-    "gulp-decomment": {
-      "version": "0.1.3",
-      "from": "gulp-decomment@>=0.1.3 <0.2.0",
-      "resolved": "https://registry.npmjs.org/gulp-decomment/-/gulp-decomment-0.1.3.tgz"
+    "diff": {
+      "version": "3.2.0",
+      "from": "diff@>=3.0.1 <4.0.0",
+      "resolved": "https://registry.npmjs.org/diff/-/diff-3.2.0.tgz"
     },
-    "gulp-flatten": {
-      "version": "0.2.0",
-      "from": "gulp-flatten@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/gulp-flatten/-/gulp-flatten-0.2.0.tgz"
+    "diffie-hellman": {
+      "version": "5.0.2",
+      "from": "diffie-hellman@>=5.0.0 <6.0.0",
+      "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.2.tgz"
     },
-    "gulp-if": {
-      "version": "2.0.2",
-      "from": "gulp-if@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/gulp-if/-/gulp-if-2.0.2.tgz"
+    "dom-serialize": {
+      "version": "2.2.1",
+      "from": "dom-serialize@>=2.2.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/dom-serialize/-/dom-serialize-2.2.1.tgz"
     },
-    "gulp-karma": {
-      "version": "0.0.5",
-      "from": "gulp-karma@>=0.0.5 <0.1.0",
-      "resolved": "https://registry.npmjs.org/gulp-karma/-/gulp-karma-0.0.5.tgz",
+    "dom-serializer": {
+      "version": "0.1.0",
+      "from": "dom-serializer@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.1.0.tgz",
       "dependencies": {
-        "ansi-regex": {
-          "version": "0.2.1",
-          "from": "ansi-regex@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-0.2.1.tgz"
-        },
-        "ansi-styles": {
-          "version": "1.1.0",
-          "from": "ansi-styles@>=1.1.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-1.1.0.tgz"
-        },
-        "chalk": {
-          "version": "0.5.1",
-          "from": "chalk@>=0.5.0 <0.6.0",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-0.5.1.tgz"
-        },
-        "dateformat": {
-          "version": "1.0.12",
-          "from": "dateformat@>=1.0.7-1.2.3 <2.0.0",
-          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz"
-        },
-        "gulp-util": {
-          "version": "2.2.20",
-          "from": "gulp-util@>=2.2.14 <2.3.0",
-          "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-2.2.20.tgz"
-        },
-        "has-ansi": {
-          "version": "0.1.0",
-          "from": "has-ansi@>=0.1.0 <0.2.0",
-          "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-0.1.0.tgz"
-        },
-        "isarray": {
-          "version": "0.0.1",
-          "from": "isarray@0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
-        },
-        "lodash._reinterpolate": {
-          "version": "2.4.1",
-          "from": "lodash._reinterpolate@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-2.4.1.tgz"
-        },
-        "lodash.defaults": {
-          "version": "2.4.1",
-          "from": "lodash.defaults@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-2.4.1.tgz"
-        },
-        "lodash.escape": {
-          "version": "2.4.1",
-          "from": "lodash.escape@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-2.4.1.tgz"
-        },
-        "lodash.keys": {
-          "version": "2.4.1",
-          "from": "lodash.keys@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
-        },
-        "lodash.template": {
-          "version": "2.4.1",
-          "from": "lodash.template@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-2.4.1.tgz"
-        },
-        "lodash.templatesettings": {
-          "version": "2.4.1",
-          "from": "lodash.templatesettings@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-2.4.1.tgz"
-        },
-        "minimist": {
-          "version": "0.2.0",
-          "from": "minimist@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.0.tgz"
-        },
-        "object-keys": {
-          "version": "0.4.0",
-          "from": "object-keys@>=0.4.0 <0.5.0",
-          "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-0.4.0.tgz"
-        },
-        "readable-stream": {
-          "version": "1.0.34",
-          "from": "readable-stream@>=1.0.17 <1.1.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.0 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
-        },
-        "strip-ansi": {
-          "version": "0.3.0",
-          "from": "strip-ansi@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-0.3.0.tgz"
-        },
-        "supports-color": {
-          "version": "0.2.0",
-          "from": "supports-color@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-0.2.0.tgz"
-        },
-        "through2": {
-          "version": "0.5.1",
-          "from": "through2@>=0.5.0 <0.6.0",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.5.1.tgz",
-          "dependencies": {
-            "xtend": {
-              "version": "3.0.0",
-              "from": "xtend@>=3.0.0 <3.1.0",
-              "resolved": "https://registry.npmjs.org/xtend/-/xtend-3.0.0.tgz"
-            }
-          }
-        },
-        "vinyl": {
-          "version": "0.2.3",
-          "from": "vinyl@>=0.2.1 <0.3.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.2.3.tgz"
-        },
-        "xtend": {
-          "version": "2.1.2",
-          "from": "xtend@>=2.1.1 <2.2.0",
-          "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz"
+        "domelementtype": {
+          "version": "1.1.3",
+          "from": "domelementtype@>=1.1.1 <1.2.0",
+          "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.1.3.tgz"
         }
       }
     },
-    "gulp-match": {
-      "version": "1.0.3",
-      "from": "gulp-match@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/gulp-match/-/gulp-match-1.0.3.tgz"
+    "domain-browser": {
+      "version": "1.1.7",
+      "from": "domain-browser@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.1.7.tgz"
     },
-    "gulp-open": {
-      "version": "2.0.0",
-      "from": "gulp-open@>=2.0.0 <2.1.0",
-      "resolved": "https://registry.npmjs.org/gulp-open/-/gulp-open-2.0.0.tgz"
+    "domelementtype": {
+      "version": "1.3.0",
+      "from": "domelementtype@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.3.0.tgz"
     },
-    "gulp-phantomcss": {
-      "version": "0.3.0",
-      "from": "gulp-phantomcss@>=0.3.0 <0.4.0",
-      "resolved": "https://registry.npmjs.org/gulp-phantomcss/-/gulp-phantomcss-0.3.0.tgz",
-      "dependencies": {
-        "async": {
-          "version": "2.4.1",
-          "from": "async@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
-          "dependencies": {
-            "lodash": {
-              "version": "4.17.4",
-              "from": "lodash@^4.14.0",
-              "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz"
-            }
-          }
-        },
-        "caseless": {
-          "version": "0.11.0",
-          "from": "caseless@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz"
-        },
-        "dateformat": {
-          "version": "1.0.12",
-          "from": "dateformat@>=1.0.11 <2.0.0",
-          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz"
-        },
-        "form-data": {
-          "version": "1.0.1",
-          "from": "form-data@>=1.0.0-rc3 <1.1.0",
-          "resolved": "https://registry.npmjs.org/form-data/-/form-data-1.0.1.tgz"
-        },
-        "gulp-util": {
-          "version": "3.0.7",
-          "from": "gulp-util@3.0.7",
-          "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.7.tgz"
-        },
-        "har-validator": {
-          "version": "2.0.6",
-          "from": "har-validator@>=2.0.2 <2.1.0",
-          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz"
-        },
-        "lodash": {
-          "version": "3.10.1",
-          "from": "lodash@3.10.1",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz"
-        },
-        "object-assign": {
-          "version": "3.0.0",
-          "from": "object-assign@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz"
-        },
-        "phantomjs-prebuilt": {
-          "version": "2.1.7",
-          "from": "phantomjs-prebuilt@2.1.7",
-          "resolved": "https://registry.npmjs.org/phantomjs-prebuilt/-/phantomjs-prebuilt-2.1.7.tgz"
+    "domhandler": {
+      "version": "2.4.1",
+      "from": "domhandler@>=2.3.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.4.1.tgz"
+    },
+    "domutils": {
+      "version": "1.5.1",
+      "from": "domutils@1.5.1",
+      "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.5.1.tgz"
+    },
+    "dot-prop": {
+      "version": "3.0.0",
+      "from": "dot-prop@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-3.0.0.tgz"
+    },
+    "duplexer": {
+      "version": "0.1.1",
+      "from": "duplexer@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz"
+    },
+    "duplexer2": {
+      "version": "0.0.2",
+      "from": "duplexer2@0.0.2",
+      "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.0.2.tgz"
+    },
+    "duplexer3": {
+      "version": "0.1.4",
+      "from": "duplexer3@>=0.1.4 <0.2.0",
+      "resolved": "https://registry.npmjs.org/duplexer3/-/duplexer3-0.1.4.tgz"
+    },
+    "duplexify": {
+      "version": "3.5.0",
+      "from": "duplexify@>=3.5.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-3.5.0.tgz",
+      "dependencies": {
+        "end-of-stream": {
+          "version": "1.0.0",
+          "from": "end-of-stream@1.0.0",
+          "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.0.0.tgz"
         },
-        "qs": {
-          "version": "5.2.1",
-          "from": "qs@>=5.2.0 <5.3.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-5.2.1.tgz"
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
-        "request": {
-          "version": "2.67.0",
-          "from": "request@>=2.67.0 <2.68.0",
-          "resolved": "https://registry.npmjs.org/request/-/request-2.67.0.tgz"
+        "once": {
+          "version": "1.3.3",
+          "from": "once@>=1.3.0 <1.4.0",
+          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz"
         },
-        "tough-cookie": {
-          "version": "2.2.2",
-          "from": "tough-cookie@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.2.2.tgz"
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
-        "tunnel-agent": {
-          "version": "0.4.3",
-          "from": "tunnel-agent@>=0.4.1 <0.5.0",
-          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz"
+        "string_decoder": {
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
-    "gulp-plumber": {
-      "version": "1.1.0",
-      "from": "gulp-plumber@>=1.1.0 <1.2.0",
-      "resolved": "https://registry.npmjs.org/gulp-plumber/-/gulp-plumber-1.1.0.tgz"
+    "ecc-jsbn": {
+      "version": "0.1.1",
+      "from": "ecc-jsbn@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.1.tgz",
+      "optional": true
     },
-    "gulp-postcss": {
-      "version": "6.3.0",
-      "from": "gulp-postcss@>=6.3.0 <6.4.0",
-      "resolved": "https://registry.npmjs.org/gulp-postcss/-/gulp-postcss-6.3.0.tgz"
+    "ee-first": {
+      "version": "1.1.1",
+      "from": "ee-first@1.1.1",
+      "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz"
     },
-    "gulp-prompt": {
-      "version": "0.2.0",
-      "from": "gulp-prompt@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/gulp-prompt/-/gulp-prompt-0.2.0.tgz"
+    "ejs": {
+      "version": "2.5.6",
+      "from": "ejs@>=2.5.6 <3.0.0",
+      "resolved": "https://registry.npmjs.org/ejs/-/ejs-2.5.6.tgz"
     },
-    "gulp-replace": {
-      "version": "0.5.4",
-      "from": "gulp-replace@>=0.5.4 <0.6.0",
-      "resolved": "https://registry.npmjs.org/gulp-replace/-/gulp-replace-0.5.4.tgz"
+    "electron-to-chromium": {
+      "version": "1.3.13",
+      "from": "electron-to-chromium@>=1.2.7 <2.0.0",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.13.tgz"
     },
-    "gulp-sass": {
-      "version": "3.1.0",
-      "from": "gulp-sass@>=3.1.0 <3.2.0",
-      "resolved": "https://registry.npmjs.org/gulp-sass/-/gulp-sass-3.1.0.tgz"
+    "elliptic": {
+      "version": "6.4.0",
+      "from": "elliptic@>=6.0.0 <7.0.0",
+      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.4.0.tgz"
     },
-    "gulp-sourcemaps": {
-      "version": "1.6.0",
-      "from": "gulp-sourcemaps@>=1.6.0 <1.7.0",
-      "resolved": "https://registry.npmjs.org/gulp-sourcemaps/-/gulp-sourcemaps-1.6.0.tgz",
+    "emojis-list": {
+      "version": "2.1.0",
+      "from": "emojis-list@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-2.1.0.tgz"
+    },
+    "encodeurl": {
+      "version": "1.0.1",
+      "from": "encodeurl@>=1.0.1 <1.1.0",
+      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.1.tgz"
+    },
+    "encoding": {
+      "version": "0.1.12",
+      "from": "encoding@>=0.1.11 <0.2.0",
+      "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.12.tgz"
+    },
+    "end-of-stream": {
+      "version": "1.1.0",
+      "from": "end-of-stream@>=1.1.0 <1.2.0",
+      "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.1.0.tgz",
       "dependencies": {
-        "strip-bom": {
-          "version": "2.0.0",
-          "from": "strip-bom@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz"
-        },
-        "vinyl": {
-          "version": "1.2.0",
-          "from": "vinyl@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz"
+        "once": {
+          "version": "1.3.3",
+          "from": "once@>=1.3.0 <1.4.0",
+          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz"
         }
       }
     },
-    "gulp-texttojs": {
-      "version": "1.0.3",
-      "from": "gulp-texttojs@>=1.0.3 <1.1.0",
-      "resolved": "https://registry.npmjs.org/gulp-texttojs/-/gulp-texttojs-1.0.3.tgz",
+    "engine.io": {
+      "version": "1.8.4",
+      "from": "engine.io@>=1.8.4 <1.9.0",
+      "resolved": "https://registry.npmjs.org/engine.io/-/engine.io-1.8.4.tgz",
       "dependencies": {
-        "isarray": {
-          "version": "0.0.1",
-          "from": "isarray@0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
-        },
-        "lodash": {
-          "version": "2.4.2",
-          "from": "lodash@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-2.4.2.tgz"
-        },
-        "object-keys": {
-          "version": "0.4.0",
-          "from": "object-keys@>=0.4.0 <0.5.0",
-          "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-0.4.0.tgz"
-        },
-        "readable-stream": {
-          "version": "1.0.34",
-          "from": "readable-stream@>=1.0.17 <1.1.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.0 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
-        },
-        "through2": {
-          "version": "0.4.2",
-          "from": "through2@>=0.4.2 <0.5.0",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.4.2.tgz"
+        "debug": {
+          "version": "2.3.3",
+          "from": "debug@2.3.3",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz"
         },
-        "xtend": {
-          "version": "2.1.2",
-          "from": "xtend@>=2.1.1 <2.2.0",
-          "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz"
+        "ms": {
+          "version": "0.7.2",
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
         }
       }
     },
-    "gulp-typescript": {
-      "version": "3.1.7",
-      "from": "gulp-typescript@>=3.1.6 <3.2.0",
-      "resolved": "https://registry.npmjs.org/gulp-typescript/-/gulp-typescript-3.1.7.tgz",
+    "engine.io-client": {
+      "version": "1.8.4",
+      "from": "engine.io-client@>=1.8.4 <1.9.0",
+      "resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-1.8.4.tgz",
       "dependencies": {
-        "glob": {
-          "version": "5.0.15",
-          "from": "glob@>=5.0.3 <6.0.0",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
-        },
-        "glob-parent": {
-          "version": "3.1.0",
-          "from": "glob-parent@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-3.1.0.tgz"
-        },
-        "glob-stream": {
-          "version": "5.3.5",
-          "from": "glob-stream@>=5.3.2 <6.0.0",
-          "resolved": "https://registry.npmjs.org/glob-stream/-/glob-stream-5.3.5.tgz",
-          "dependencies": {
-            "readable-stream": {
-              "version": "1.0.34",
-              "from": "readable-stream@>=1.0.33-1 <1.1.0-0",
-              "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
-            },
-            "through2": {
-              "version": "0.6.5",
-              "from": "through2@>=0.6.0 <0.7.0",
-              "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz"
-            }
-          }
-        },
-        "is-extglob": {
-          "version": "2.1.1",
-          "from": "is-extglob@>=2.1.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz"
-        },
-        "is-glob": {
-          "version": "3.1.0",
-          "from": "is-glob@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz"
-        },
-        "isarray": {
-          "version": "0.0.1",
-          "from": "isarray@0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
-        },
-        "ordered-read-streams": {
-          "version": "0.3.0",
-          "from": "ordered-read-streams@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.3.0.tgz"
-        },
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.3 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.0 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
-        },
-        "strip-bom": {
-          "version": "2.0.0",
-          "from": "strip-bom@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz"
+        "component-emitter": {
+          "version": "1.2.1",
+          "from": "component-emitter@1.2.1",
+          "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz"
         },
-        "unique-stream": {
-          "version": "2.2.1",
-          "from": "unique-stream@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-2.2.1.tgz"
+        "debug": {
+          "version": "2.3.3",
+          "from": "debug@2.3.3",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz"
         },
-        "vinyl": {
-          "version": "1.2.0",
-          "from": "vinyl@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz"
+        "ms": {
+          "version": "0.7.2",
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
         },
-        "vinyl-fs": {
-          "version": "2.4.4",
-          "from": "vinyl-fs@>=2.4.3 <2.5.0",
-          "resolved": "https://registry.npmjs.org/vinyl-fs/-/vinyl-fs-2.4.4.tgz"
+        "ws": {
+          "version": "1.1.2",
+          "from": "ws@1.1.2",
+          "resolved": "https://registry.npmjs.org/ws/-/ws-1.1.2.tgz"
+        }
+      }
+    },
+    "engine.io-parser": {
+      "version": "1.3.2",
+      "from": "engine.io-parser@1.3.2",
+      "resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-1.3.2.tgz"
+    },
+    "enhanced-resolve": {
+      "version": "0.9.1",
+      "from": "enhanced-resolve@>=0.9.0 <0.10.0",
+      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-0.9.1.tgz",
+      "dependencies": {
+        "memory-fs": {
+          "version": "0.2.0",
+          "from": "memory-fs@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.2.0.tgz"
         }
       }
     },
-    "gulp-util": {
-      "version": "3.0.8",
-      "from": "gulp-util@>=3.0.7 <3.1.0",
-      "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.8.tgz",
+    "ent": {
+      "version": "2.2.0",
+      "from": "ent@>=2.2.0 <2.3.0",
+      "resolved": "https://registry.npmjs.org/ent/-/ent-2.2.0.tgz"
+    },
+    "entities": {
+      "version": "1.1.1",
+      "from": "entities@>=1.1.1 <1.2.0",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.1.tgz"
+    },
+    "envify": {
+      "version": "3.4.1",
+      "from": "envify@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/envify/-/envify-3.4.1.tgz"
+    },
+    "enzyme": {
+      "version": "2.7.0",
+      "from": "enzyme@2.7.0",
+      "resolved": "https://registry.npmjs.org/enzyme/-/enzyme-2.7.0.tgz",
       "dependencies": {
-        "object-assign": {
-          "version": "3.0.0",
-          "from": "object-assign@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz"
+        "lodash": {
+          "version": "4.17.4",
+          "from": "lodash@>=4.17.2 <5.0.0",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz"
+        },
+        "uuid": {
+          "version": "2.0.3",
+          "from": "uuid@>=2.0.3 <3.0.0",
+          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz"
         }
       }
     },
-    "gulplog": {
-      "version": "1.0.0",
-      "from": "gulplog@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/gulplog/-/gulplog-1.0.0.tgz"
+    "errno": {
+      "version": "0.1.4",
+      "from": "errno@>=0.1.3 <0.2.0",
+      "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.4.tgz"
     },
-    "gutil": {
-      "version": "1.6.4",
-      "from": "gutil@1.6.4",
-      "resolved": "https://registry.npmjs.org/gutil/-/gutil-1.6.4.tgz"
+    "error-ex": {
+      "version": "1.3.1",
+      "from": "error-ex@>=1.2.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.1.tgz"
     },
-    "gzip-size": {
-      "version": "3.0.0",
-      "from": "gzip-size@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-3.0.0.tgz"
+    "errorhandler": {
+      "version": "1.4.3",
+      "from": "errorhandler@>=1.4.2 <1.5.0",
+      "resolved": "https://registry.npmjs.org/errorhandler/-/errorhandler-1.4.3.tgz"
     },
-    "handle-thing": {
-      "version": "1.2.5",
-      "from": "handle-thing@>=1.2.5 <2.0.0",
-      "resolved": "https://registry.npmjs.org/handle-thing/-/handle-thing-1.2.5.tgz"
+    "es-abstract": {
+      "version": "1.7.0",
+      "from": "es-abstract@>=1.6.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.7.0.tgz"
     },
-    "handlebars": {
-      "version": "4.0.10",
-      "from": "handlebars@>=4.0.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.0.10.tgz",
+    "es-to-primitive": {
+      "version": "1.1.1",
+      "from": "es-to-primitive@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.1.1.tgz"
+    },
+    "es5-ext": {
+      "version": "0.10.21",
+      "from": "es5-ext@>=0.10.14 <0.11.0",
+      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.21.tgz"
+    },
+    "es6-collections": {
+      "version": "0.5.6",
+      "from": "es6-collections@0.5.6",
+      "resolved": "https://registry.npmjs.org/es6-collections/-/es6-collections-0.5.6.tgz"
+    },
+    "es6-iterator": {
+      "version": "2.0.1",
+      "from": "es6-iterator@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.1.tgz"
+    },
+    "es6-promise": {
+      "version": "4.0.5",
+      "from": "es6-promise@>=4.0.3 <4.1.0",
+      "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.0.5.tgz"
+    },
+    "es6-symbol": {
+      "version": "3.1.1",
+      "from": "es6-symbol@>=3.1.1 <4.0.0",
+      "resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.1.tgz"
+    },
+    "es6-templates": {
+      "version": "0.2.3",
+      "from": "es6-templates@>=0.2.2 <0.3.0",
+      "resolved": "https://registry.npmjs.org/es6-templates/-/es6-templates-0.2.3.tgz"
+    },
+    "es6-weak-map": {
+      "version": "2.0.2",
+      "from": "es6-weak-map@>=2.0.2 <3.0.0",
+      "resolved": "https://registry.npmjs.org/es6-weak-map/-/es6-weak-map-2.0.2.tgz"
+    },
+    "escape-html": {
+      "version": "1.0.3",
+      "from": "escape-html@>=1.0.3 <1.1.0",
+      "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz"
+    },
+    "escape-string-regexp": {
+      "version": "1.0.5",
+      "from": "escape-string-regexp@>=1.0.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz"
+    },
+    "escodegen": {
+      "version": "1.8.1",
+      "from": "escodegen@>=1.8.0 <1.9.0",
+      "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-1.8.1.tgz",
       "dependencies": {
+        "esprima": {
+          "version": "2.7.3",
+          "from": "esprima@>=2.7.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz"
+        },
         "source-map": {
-          "version": "0.4.4",
-          "from": "source-map@>=0.4.4 <0.5.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz"
+          "version": "0.2.0",
+          "from": "source-map@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.2.0.tgz",
+          "optional": true
         }
       }
     },
-    "har-schema": {
-      "version": "1.0.5",
-      "from": "har-schema@>=1.0.5 <2.0.0",
-      "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-1.0.5.tgz"
+    "esprima": {
+      "version": "3.1.3",
+      "from": "esprima@>=3.1.0 <3.2.0",
+      "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz"
     },
-    "har-validator": {
-      "version": "4.2.1",
-      "from": "har-validator@>=4.2.1 <4.3.0",
-      "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz"
+    "estraverse": {
+      "version": "1.9.3",
+      "from": "estraverse@>=1.9.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-1.9.3.tgz"
     },
-    "has": {
-      "version": "1.0.1",
-      "from": "has@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/has/-/has-1.0.1.tgz"
+    "esutils": {
+      "version": "2.0.2",
+      "from": "esutils@>=2.0.2 <3.0.0",
+      "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.2.tgz"
     },
-    "has-ansi": {
-      "version": "2.0.0",
-      "from": "has-ansi@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz"
+    "etag": {
+      "version": "1.7.0",
+      "from": "etag@>=1.7.0 <1.8.0",
+      "resolved": "https://registry.npmjs.org/etag/-/etag-1.7.0.tgz"
+    },
+    "event-stream": {
+      "version": "3.0.20",
+      "from": "event-stream@>=3.0.20 <3.1.0",
+      "resolved": "https://registry.npmjs.org/event-stream/-/event-stream-3.0.20.tgz"
+    },
+    "eventemitter3": {
+      "version": "1.2.0",
+      "from": "eventemitter3@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-1.2.0.tgz"
+    },
+    "events": {
+      "version": "1.1.1",
+      "from": "events@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/events/-/events-1.1.1.tgz"
+    },
+    "eventsource": {
+      "version": "0.1.6",
+      "from": "eventsource@0.1.6",
+      "resolved": "https://registry.npmjs.org/eventsource/-/eventsource-0.1.6.tgz"
+    },
+    "evp_bytestokey": {
+      "version": "1.0.0",
+      "from": "evp_bytestokey@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/evp_bytestokey/-/evp_bytestokey-1.0.0.tgz"
+    },
+    "execa": {
+      "version": "0.4.0",
+      "from": "execa@>=0.4.0 <0.5.0",
+      "resolved": "https://registry.npmjs.org/execa/-/execa-0.4.0.tgz"
+    },
+    "exit-hook": {
+      "version": "1.1.1",
+      "from": "exit-hook@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/exit-hook/-/exit-hook-1.1.1.tgz"
+    },
+    "expand-braces": {
+      "version": "0.1.2",
+      "from": "expand-braces@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/expand-braces/-/expand-braces-0.1.2.tgz",
+      "dependencies": {
+        "braces": {
+          "version": "0.1.5",
+          "from": "braces@>=0.1.2 <0.2.0",
+          "resolved": "https://registry.npmjs.org/braces/-/braces-0.1.5.tgz"
+        },
+        "expand-range": {
+          "version": "0.1.1",
+          "from": "expand-range@>=0.1.0 <0.2.0",
+          "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-0.1.1.tgz"
+        },
+        "is-number": {
+          "version": "0.1.1",
+          "from": "is-number@>=0.1.1 <0.2.0",
+          "resolved": "https://registry.npmjs.org/is-number/-/is-number-0.1.1.tgz"
+        },
+        "repeat-string": {
+          "version": "0.2.2",
+          "from": "repeat-string@>=0.2.2 <0.3.0",
+          "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-0.2.2.tgz"
+        }
+      }
+    },
+    "expand-brackets": {
+      "version": "0.1.5",
+      "from": "expand-brackets@>=0.1.4 <0.2.0",
+      "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz"
+    },
+    "expand-range": {
+      "version": "1.8.2",
+      "from": "expand-range@>=1.8.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz"
+    },
+    "expand-tilde": {
+      "version": "1.2.2",
+      "from": "expand-tilde@>=1.2.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-1.2.2.tgz"
+    },
+    "express": {
+      "version": "4.14.1",
+      "from": "express@>=4.14.0 <4.15.0",
+      "resolved": "https://registry.npmjs.org/express/-/express-4.14.1.tgz",
+      "dependencies": {
+        "debug": {
+          "version": "2.2.0",
+          "from": "debug@>=2.2.0 <2.3.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+        },
+        "finalhandler": {
+          "version": "0.5.1",
+          "from": "finalhandler@0.5.1",
+          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.5.1.tgz"
+        },
+        "ms": {
+          "version": "0.7.1",
+          "from": "ms@0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+        },
+        "qs": {
+          "version": "6.2.0",
+          "from": "qs@6.2.0",
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.2.0.tgz"
+        }
+      }
     },
-    "has-binary": {
-      "version": "0.1.7",
-      "from": "has-binary@0.1.7",
-      "resolved": "https://registry.npmjs.org/has-binary/-/has-binary-0.1.7.tgz",
+    "express-session": {
+      "version": "1.11.3",
+      "from": "express-session@>=1.11.3 <1.12.0",
+      "resolved": "https://registry.npmjs.org/express-session/-/express-session-1.11.3.tgz",
       "dependencies": {
-        "isarray": {
-          "version": "0.0.1",
-          "from": "isarray@0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
+        "cookie": {
+          "version": "0.1.3",
+          "from": "cookie@0.1.3",
+          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz"
+        },
+        "debug": {
+          "version": "2.2.0",
+          "from": "debug@>=2.2.0 <2.3.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+        },
+        "depd": {
+          "version": "1.0.1",
+          "from": "depd@>=1.0.1 <1.1.0",
+          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz"
+        },
+        "ms": {
+          "version": "0.7.1",
+          "from": "ms@0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+        },
+        "uid-safe": {
+          "version": "2.0.0",
+          "from": "uid-safe@>=2.0.0 <2.1.0",
+          "resolved": "https://registry.npmjs.org/uid-safe/-/uid-safe-2.0.0.tgz"
         }
       }
     },
-    "has-cors": {
-      "version": "1.1.0",
-      "from": "has-cors@1.1.0",
-      "resolved": "https://registry.npmjs.org/has-cors/-/has-cors-1.1.0.tgz"
-    },
-    "has-flag": {
-      "version": "1.0.0",
-      "from": "has-flag@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz"
-    },
-    "has-gulplog": {
-      "version": "0.1.0",
-      "from": "has-gulplog@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/has-gulplog/-/has-gulplog-0.1.0.tgz"
+    "extend": {
+      "version": "3.0.1",
+      "from": "extend@>=3.0.0 <3.1.0",
+      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz"
     },
-    "has-unicode": {
+    "extend-shallow": {
       "version": "2.0.1",
-      "from": "has-unicode@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz"
-    },
-    "hash-base": {
-      "version": "2.0.2",
-      "from": "hash-base@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/hash-base/-/hash-base-2.0.2.tgz"
-    },
-    "hash.js": {
-      "version": "1.0.3",
-      "from": "hash.js@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/hash.js/-/hash.js-1.0.3.tgz"
-    },
-    "hasha": {
-      "version": "2.2.0",
-      "from": "hasha@>=2.2.0 <2.3.0",
-      "resolved": "https://registry.npmjs.org/hasha/-/hasha-2.2.0.tgz"
-    },
-    "hawk": {
-      "version": "3.1.3",
-      "from": "hawk@>=3.1.3 <3.2.0",
-      "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz"
-    },
-    "he": {
-      "version": "1.1.1",
-      "from": "he@>=1.1.0 <1.2.0",
-      "resolved": "https://registry.npmjs.org/he/-/he-1.1.1.tgz"
-    },
-    "highlight.js": {
-      "version": "9.11.0",
-      "from": "highlight.js@>=9.9.0 <10.0.0",
-      "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-9.11.0.tgz"
+      "from": "extend-shallow@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz"
     },
-    "hmac-drbg": {
-      "version": "1.0.1",
-      "from": "hmac-drbg@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz"
+    "extglob": {
+      "version": "0.3.2",
+      "from": "extglob@>=0.3.1 <0.4.0",
+      "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz"
     },
-    "hoek": {
-      "version": "2.16.3",
-      "from": "hoek@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz"
+    "extract-zip": {
+      "version": "1.5.0",
+      "from": "extract-zip@>=1.5.0 <1.6.0",
+      "resolved": "https://registry.npmjs.org/extract-zip/-/extract-zip-1.5.0.tgz",
+      "dependencies": {
+        "debug": {
+          "version": "0.7.4",
+          "from": "debug@0.7.4",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-0.7.4.tgz"
+        },
+        "minimist": {
+          "version": "0.0.8",
+          "from": "minimist@0.0.8",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz"
+        },
+        "mkdirp": {
+          "version": "0.5.0",
+          "from": "mkdirp@0.5.0",
+          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.0.tgz"
+        }
+      }
     },
-    "homedir-polyfill": {
-      "version": "1.0.1",
-      "from": "homedir-polyfill@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.1.tgz"
+    "extsprintf": {
+      "version": "1.0.2",
+      "from": "extsprintf@1.0.2",
+      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.0.2.tgz"
     },
-    "hosted-git-info": {
-      "version": "2.4.2",
-      "from": "hosted-git-info@>=2.1.4 <3.0.0",
-      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.4.2.tgz"
+    "fancy-log": {
+      "version": "1.3.0",
+      "from": "fancy-log@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/fancy-log/-/fancy-log-1.3.0.tgz"
     },
-    "hpack.js": {
-      "version": "2.1.6",
-      "from": "hpack.js@>=2.1.6 <3.0.0",
-      "resolved": "https://registry.npmjs.org/hpack.js/-/hpack.js-2.1.6.tgz"
+    "fast-levenshtein": {
+      "version": "2.0.6",
+      "from": "fast-levenshtein@>=2.0.4 <2.1.0",
+      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz"
     },
-    "html-comment-regex": {
+    "fastparse": {
       "version": "1.1.1",
-      "from": "html-comment-regex@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/html-comment-regex/-/html-comment-regex-1.1.1.tgz"
-    },
-    "html-entities": {
-      "version": "1.2.1",
-      "from": "html-entities@>=1.2.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-1.2.1.tgz"
+      "from": "fastparse@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.1.tgz"
     },
-    "html-loader": {
-      "version": "0.4.5",
-      "from": "html-loader@>=0.4.3 <0.5.0",
-      "resolved": "https://registry.npmjs.org/html-loader/-/html-loader-0.4.5.tgz",
-      "dependencies": {
-        "loader-utils": {
-          "version": "1.1.0",
-          "from": "loader-utils@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
-        }
-      }
+    "faye-websocket": {
+      "version": "0.10.0",
+      "from": "faye-websocket@>=0.10.0 <0.11.0",
+      "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz"
     },
-    "html-minifier": {
-      "version": "3.5.2",
-      "from": "html-minifier@>=3.0.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/html-minifier/-/html-minifier-3.5.2.tgz",
+    "fbjs": {
+      "version": "0.6.1",
+      "from": "fbjs@>=0.6.1 <0.7.0",
+      "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.6.1.tgz",
       "dependencies": {
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.1 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
-        },
-        "uglify-js": {
-          "version": "3.0.12",
-          "from": "uglify-js@>=3.0.0 <3.1.0",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.12.tgz"
+        "core-js": {
+          "version": "1.2.7",
+          "from": "core-js@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
         }
       }
     },
-    "htmlparser2": {
-      "version": "3.9.2",
-      "from": "htmlparser2@>=3.9.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.9.2.tgz"
+    "fd-slicer": {
+      "version": "1.0.1",
+      "from": "fd-slicer@>=1.0.1 <1.1.0",
+      "resolved": "https://registry.npmjs.org/fd-slicer/-/fd-slicer-1.0.1.tgz"
     },
-    "http-browserify": {
+    "figures": {
       "version": "1.7.0",
-      "from": "http-browserify@>=1.3.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/http-browserify/-/http-browserify-1.7.0.tgz"
+      "from": "figures@>=1.3.5 <2.0.0",
+      "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz"
     },
-    "http-deceiver": {
-      "version": "1.2.7",
-      "from": "http-deceiver@>=1.2.7 <2.0.0",
-      "resolved": "https://registry.npmjs.org/http-deceiver/-/http-deceiver-1.2.7.tgz"
+    "file-loader": {
+      "version": "0.8.5",
+      "from": "file-loader@>=0.8.5 <0.9.0",
+      "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.8.5.tgz"
     },
-    "http-errors": {
-      "version": "1.6.1",
-      "from": "http-errors@>=1.6.1 <1.7.0",
-      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.1.tgz"
+    "filename-regex": {
+      "version": "2.0.1",
+      "from": "filename-regex@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz"
     },
-    "http-proxy": {
-      "version": "1.16.2",
-      "from": "http-proxy@>=1.13.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.16.2.tgz"
+    "filesize": {
+      "version": "3.5.10",
+      "from": "filesize@>=3.5.9 <4.0.0",
+      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.5.10.tgz"
     },
-    "http-proxy-middleware": {
-      "version": "0.17.4",
-      "from": "http-proxy-middleware@>=0.17.4 <0.18.0",
-      "resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-0.17.4.tgz",
-      "dependencies": {
-        "is-extglob": {
-          "version": "2.1.1",
-          "from": "is-extglob@>=2.1.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz"
-        },
-        "is-glob": {
-          "version": "3.1.0",
-          "from": "is-glob@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz"
-        }
-      }
+    "fill-range": {
+      "version": "2.2.3",
+      "from": "fill-range@>=2.1.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz"
+    },
+    "filled-array": {
+      "version": "1.1.0",
+      "from": "filled-array@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/filled-array/-/filled-array-1.1.0.tgz"
+    },
+    "finalhandler": {
+      "version": "1.0.3",
+      "from": "finalhandler@1.0.3",
+      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.3.tgz"
+    },
+    "find-index": {
+      "version": "0.1.1",
+      "from": "find-index@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz"
     },
-    "http-signature": {
-      "version": "1.1.1",
-      "from": "http-signature@>=1.1.0 <1.2.0",
-      "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz"
+    "find-up": {
+      "version": "1.1.2",
+      "from": "find-up@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz"
     },
-    "https-browserify": {
-      "version": "0.0.0",
-      "from": "https-browserify@0.0.0",
-      "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.0.tgz"
+    "findup-sync": {
+      "version": "0.4.3",
+      "from": "findup-sync@>=0.4.2 <0.5.0",
+      "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.4.3.tgz"
     },
-    "iconv-lite": {
-      "version": "0.4.17",
-      "from": "iconv-lite@>=0.4.13 <0.5.0",
-      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.17.tgz"
+    "fined": {
+      "version": "1.0.2",
+      "from": "fined@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/fined/-/fined-1.0.2.tgz"
     },
-    "icss-replace-symbols": {
-      "version": "1.1.0",
-      "from": "icss-replace-symbols@1.1.0",
-      "resolved": "https://registry.npmjs.org/icss-replace-symbols/-/icss-replace-symbols-1.1.0.tgz"
+    "first-chunk-stream": {
+      "version": "1.0.0",
+      "from": "first-chunk-stream@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/first-chunk-stream/-/first-chunk-stream-1.0.0.tgz"
     },
-    "ieee754": {
-      "version": "1.1.8",
-      "from": "ieee754@>=1.1.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.8.tgz"
+    "flagged-respawn": {
+      "version": "0.3.2",
+      "from": "flagged-respawn@>=0.3.2 <0.4.0",
+      "resolved": "https://registry.npmjs.org/flagged-respawn/-/flagged-respawn-0.3.2.tgz"
     },
-    "immutability-helper": {
-      "version": "2.2.2",
-      "from": "immutability-helper@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.2.2.tgz"
+    "flatten": {
+      "version": "1.0.2",
+      "from": "flatten@>=1.0.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz"
     },
-    "imurmurhash": {
-      "version": "0.1.4",
-      "from": "imurmurhash@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz"
+    "for-in": {
+      "version": "1.0.2",
+      "from": "for-in@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz"
     },
-    "in-publish": {
-      "version": "2.0.0",
-      "from": "in-publish@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/in-publish/-/in-publish-2.0.0.tgz"
+    "for-own": {
+      "version": "0.1.5",
+      "from": "for-own@>=0.1.4 <0.2.0",
+      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz"
     },
-    "indent-string": {
-      "version": "2.1.0",
-      "from": "indent-string@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-2.1.0.tgz"
+    "foreach": {
+      "version": "2.0.5",
+      "from": "foreach@>=2.0.5 <3.0.0",
+      "resolved": "https://registry.npmjs.org/foreach/-/foreach-2.0.5.tgz"
     },
-    "indexes-of": {
-      "version": "1.0.1",
-      "from": "indexes-of@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/indexes-of/-/indexes-of-1.0.1.tgz"
+    "forever-agent": {
+      "version": "0.6.1",
+      "from": "forever-agent@>=0.6.1 <0.7.0",
+      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz"
     },
-    "indexof": {
-      "version": "0.0.1",
-      "from": "indexof@0.0.1",
-      "resolved": "https://registry.npmjs.org/indexof/-/indexof-0.0.1.tgz"
+    "fork-stream": {
+      "version": "0.0.4",
+      "from": "fork-stream@>=0.0.4 <0.0.5",
+      "resolved": "https://registry.npmjs.org/fork-stream/-/fork-stream-0.0.4.tgz"
     },
-    "inflight": {
-      "version": "1.0.6",
-      "from": "inflight@>=1.0.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz"
+    "form-data": {
+      "version": "2.1.4",
+      "from": "form-data@>=2.1.1 <2.2.0",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz"
     },
-    "inherits": {
-      "version": "2.0.3",
-      "from": "inherits@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz"
+    "formatio": {
+      "version": "1.1.1",
+      "from": "formatio@1.1.1",
+      "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.1.1.tgz"
     },
-    "ini": {
-      "version": "1.3.4",
-      "from": "ini@>=1.3.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.4.tgz"
+    "forwarded": {
+      "version": "0.1.0",
+      "from": "forwarded@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.0.tgz"
     },
-    "inpath": {
-      "version": "1.0.2",
-      "from": "inpath@>=1.0.2 <1.1.0",
-      "resolved": "https://registry.npmjs.org/inpath/-/inpath-1.0.2.tgz"
+    "fresh": {
+      "version": "0.3.0",
+      "from": "fresh@0.3.0",
+      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.3.0.tgz"
     },
-    "inquirer": {
-      "version": "0.10.1",
-      "from": "inquirer@>=0.10.0 <0.11.0",
-      "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-0.10.1.tgz",
-      "dependencies": {
-        "lodash": {
-          "version": "3.10.1",
-          "from": "lodash@>=3.3.1 <4.0.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz"
-        }
-      }
+    "from": {
+      "version": "0.1.7",
+      "from": "from@>=0.0.0 <1.0.0",
+      "resolved": "https://registry.npmjs.org/from/-/from-0.1.7.tgz"
     },
-    "interpret": {
-      "version": "1.0.3",
-      "from": "interpret@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.0.3.tgz"
+    "fs-exists-sync": {
+      "version": "0.1.0",
+      "from": "fs-exists-sync@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/fs-exists-sync/-/fs-exists-sync-0.1.0.tgz"
     },
-    "invariant": {
-      "version": "2.2.2",
-      "from": "invariant@>=2.2.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.2.tgz"
+    "fs-extra": {
+      "version": "0.26.7",
+      "from": "fs-extra@>=0.26.7 <0.27.0",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz"
     },
-    "invert-kv": {
+    "fs.realpath": {
       "version": "1.0.0",
-      "from": "invert-kv@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/invert-kv/-/invert-kv-1.0.0.tgz"
+      "from": "fs.realpath@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz"
     },
-    "ipaddr.js": {
-      "version": "1.3.0",
-      "from": "ipaddr.js@1.3.0",
-      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.3.0.tgz"
+    "fstream": {
+      "version": "1.0.11",
+      "from": "fstream@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz"
     },
-    "irregular-plurals": {
-      "version": "1.2.0",
-      "from": "irregular-plurals@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/irregular-plurals/-/irregular-plurals-1.2.0.tgz"
+    "ftp": {
+      "version": "0.3.10",
+      "from": "ftp@>=0.3.8 <0.4.0",
+      "resolved": "https://registry.npmjs.org/ftp/-/ftp-0.3.10.tgz"
     },
-    "is": {
-      "version": "3.2.1",
-      "from": "is@>=3.1.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/is/-/is-3.2.1.tgz"
+    "function-bind": {
+      "version": "1.1.0",
+      "from": "function-bind@>=1.0.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.0.tgz"
     },
-    "is-absolute": {
-      "version": "0.2.6",
-      "from": "is-absolute@>=0.2.3 <0.3.0",
-      "resolved": "https://registry.npmjs.org/is-absolute/-/is-absolute-0.2.6.tgz"
+    "function.prototype.name": {
+      "version": "1.0.0",
+      "from": "function.prototype.name@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.0.0.tgz"
     },
-    "is-absolute-url": {
-      "version": "2.1.0",
-      "from": "is-absolute-url@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/is-absolute-url/-/is-absolute-url-2.1.0.tgz"
+    "gauge": {
+      "version": "2.7.4",
+      "from": "gauge@>=2.7.3 <2.8.0",
+      "resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz"
     },
-    "is-arrayish": {
-      "version": "0.2.1",
-      "from": "is-arrayish@>=0.2.1 <0.3.0",
-      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz"
+    "gaze": {
+      "version": "0.5.2",
+      "from": "gaze@>=0.5.1 <0.6.0",
+      "resolved": "https://registry.npmjs.org/gaze/-/gaze-0.5.2.tgz"
     },
-    "is-binary-path": {
-      "version": "1.0.1",
-      "from": "is-binary-path@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-1.0.1.tgz"
+    "generate-function": {
+      "version": "2.0.0",
+      "from": "generate-function@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/generate-function/-/generate-function-2.0.0.tgz"
     },
-    "is-buffer": {
-      "version": "1.1.5",
-      "from": "is-buffer@>=1.1.5 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.5.tgz"
+    "generate-object-property": {
+      "version": "1.2.0",
+      "from": "generate-object-property@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/generate-object-property/-/generate-object-property-1.2.0.tgz"
     },
-    "is-builtin-module": {
-      "version": "1.0.0",
-      "from": "is-builtin-module@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-1.0.0.tgz"
+    "generic-names": {
+      "version": "1.0.2",
+      "from": "generic-names@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/generic-names/-/generic-names-1.0.2.tgz"
     },
-    "is-callable": {
-      "version": "1.1.3",
-      "from": "is-callable@>=1.1.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.1.3.tgz"
+    "get-caller-file": {
+      "version": "1.0.2",
+      "from": "get-caller-file@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz"
     },
-    "is-date-object": {
+    "get-own-enumerable-property-symbols": {
       "version": "1.0.1",
-      "from": "is-date-object@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.1.tgz"
-    },
-    "is-directory": {
-      "version": "0.3.1",
-      "from": "is-directory@>=0.3.1 <0.4.0",
-      "resolved": "https://registry.npmjs.org/is-directory/-/is-directory-0.3.1.tgz"
+      "from": "get-own-enumerable-property-symbols@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/get-own-enumerable-property-symbols/-/get-own-enumerable-property-symbols-1.0.1.tgz"
     },
-    "is-dotfile": {
-      "version": "1.0.2",
-      "from": "is-dotfile@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-dotfile/-/is-dotfile-1.0.2.tgz"
+    "get-stdin": {
+      "version": "4.0.1",
+      "from": "get-stdin@>=4.0.1 <5.0.0",
+      "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz"
     },
-    "is-equal-shallow": {
-      "version": "0.1.3",
-      "from": "is-equal-shallow@>=0.1.3 <0.2.0",
-      "resolved": "https://registry.npmjs.org/is-equal-shallow/-/is-equal-shallow-0.1.3.tgz"
+    "get-stream": {
+      "version": "3.0.0",
+      "from": "get-stream@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz"
     },
-    "is-extendable": {
-      "version": "0.1.1",
-      "from": "is-extendable@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz"
+    "getpass": {
+      "version": "0.1.7",
+      "from": "getpass@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
+      "dependencies": {
+        "assert-plus": {
+          "version": "1.0.0",
+          "from": "assert-plus@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz"
+        }
+      }
     },
-    "is-extglob": {
-      "version": "1.0.0",
-      "from": "is-extglob@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz"
+    "git-rev": {
+      "version": "0.2.1",
+      "from": "git-rev@0.2.1",
+      "resolved": "https://registry.npmjs.org/git-rev/-/git-rev-0.2.1.tgz"
     },
-    "is-finite": {
-      "version": "1.0.2",
-      "from": "is-finite@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-finite/-/is-finite-1.0.2.tgz"
+    "glamor": {
+      "version": "2.20.25",
+      "from": "glamor@>=2.20.24 <3.0.0",
+      "resolved": "https://registry.npmjs.org/glamor/-/glamor-2.20.25.tgz",
+      "dependencies": {
+        "core-js": {
+          "version": "1.2.7",
+          "from": "core-js@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
+        },
+        "fbjs": {
+          "version": "0.8.12",
+          "from": "fbjs@>=0.8.8 <0.9.0",
+          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz"
+        }
+      }
     },
-    "is-fullwidth-code-point": {
-      "version": "1.0.0",
-      "from": "is-fullwidth-code-point@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz"
+    "glob": {
+      "version": "7.1.2",
+      "from": "glob@>=7.0.5 <8.0.0",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz"
     },
-    "is-glob": {
-      "version": "2.0.1",
-      "from": "is-glob@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz"
+    "glob-base": {
+      "version": "0.3.0",
+      "from": "glob-base@>=0.3.0 <0.4.0",
+      "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz"
     },
-    "is-my-json-valid": {
-      "version": "2.16.0",
-      "from": "is-my-json-valid@>=2.12.4 <3.0.0",
-      "resolved": "https://registry.npmjs.org/is-my-json-valid/-/is-my-json-valid-2.16.0.tgz"
+    "glob-escape": {
+      "version": "0.0.2",
+      "from": "glob-escape@>=0.0.1 <0.1.0",
+      "resolved": "https://registry.npmjs.org/glob-escape/-/glob-escape-0.0.2.tgz"
     },
-    "is-npm": {
-      "version": "1.0.0",
-      "from": "is-npm@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-npm/-/is-npm-1.0.0.tgz"
+    "glob-parent": {
+      "version": "2.0.0",
+      "from": "glob-parent@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz"
     },
-    "is-number": {
-      "version": "2.1.0",
-      "from": "is-number@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz"
+    "glob-stream": {
+      "version": "3.1.18",
+      "from": "glob-stream@>=3.1.5 <4.0.0",
+      "resolved": "https://registry.npmjs.org/glob-stream/-/glob-stream-3.1.18.tgz",
+      "dependencies": {
+        "glob": {
+          "version": "4.5.3",
+          "from": "glob@>=4.3.1 <5.0.0",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-4.5.3.tgz"
+        },
+        "minimatch": {
+          "version": "2.0.10",
+          "from": "minimatch@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-2.0.10.tgz"
+        },
+        "readable-stream": {
+          "version": "1.0.34",
+          "from": "readable-stream@>=1.0.33-1 <1.1.0-0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
+        },
+        "through2": {
+          "version": "0.6.5",
+          "from": "through2@>=0.6.1 <0.7.0",
+          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz"
+        }
+      }
     },
-    "is-obj": {
-      "version": "1.0.1",
-      "from": "is-obj@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-1.0.1.tgz"
+    "glob-watcher": {
+      "version": "0.0.6",
+      "from": "glob-watcher@>=0.0.6 <0.0.7",
+      "resolved": "https://registry.npmjs.org/glob-watcher/-/glob-watcher-0.0.6.tgz"
     },
-    "is-path-cwd": {
-      "version": "1.0.0",
-      "from": "is-path-cwd@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-1.0.0.tgz"
+    "glob2base": {
+      "version": "0.0.12",
+      "from": "glob2base@>=0.0.12 <0.0.13",
+      "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz"
     },
-    "is-path-in-cwd": {
-      "version": "1.0.0",
-      "from": "is-path-in-cwd@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-1.0.0.tgz"
+    "global-modules": {
+      "version": "0.2.3",
+      "from": "global-modules@>=0.2.3 <0.3.0",
+      "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-0.2.3.tgz"
     },
-    "is-path-inside": {
-      "version": "1.0.0",
-      "from": "is-path-inside@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-1.0.0.tgz"
+    "global-prefix": {
+      "version": "0.1.5",
+      "from": "global-prefix@>=0.1.4 <0.2.0",
+      "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-0.1.5.tgz"
     },
-    "is-plain-obj": {
-      "version": "1.1.0",
-      "from": "is-plain-obj@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-1.1.0.tgz"
+    "globby": {
+      "version": "5.0.0",
+      "from": "globby@>=5.0.0 <5.1.0",
+      "resolved": "https://registry.npmjs.org/globby/-/globby-5.0.0.tgz"
     },
-    "is-plain-object": {
-      "version": "2.0.1",
-      "from": "is-plain-object@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.1.tgz",
+    "globule": {
+      "version": "0.1.0",
+      "from": "globule@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/globule/-/globule-0.1.0.tgz",
       "dependencies": {
-        "isobject": {
+        "glob": {
+          "version": "3.1.21",
+          "from": "glob@>=3.1.21 <3.2.0",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-3.1.21.tgz"
+        },
+        "graceful-fs": {
+          "version": "1.2.3",
+          "from": "graceful-fs@>=1.2.0 <1.3.0",
+          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-1.2.3.tgz"
+        },
+        "inherits": {
+          "version": "1.0.2",
+          "from": "inherits@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/inherits/-/inherits-1.0.2.tgz"
+        },
+        "lodash": {
           "version": "1.0.2",
-          "from": "isobject@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/isobject/-/isobject-1.0.2.tgz"
+          "from": "lodash@>=1.0.1 <1.1.0",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-1.0.2.tgz"
+        },
+        "minimatch": {
+          "version": "0.2.14",
+          "from": "minimatch@>=0.2.11 <0.3.0",
+          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.2.14.tgz"
         }
       }
     },
-    "is-posix-bracket": {
-      "version": "0.1.1",
-      "from": "is-posix-bracket@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz"
-    },
-    "is-primitive": {
-      "version": "2.0.0",
-      "from": "is-primitive@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/is-primitive/-/is-primitive-2.0.0.tgz"
-    },
-    "is-property": {
-      "version": "1.0.2",
-      "from": "is-property@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-property/-/is-property-1.0.2.tgz"
-    },
-    "is-redirect": {
+    "glogg": {
       "version": "1.0.0",
-      "from": "is-redirect@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-redirect/-/is-redirect-1.0.0.tgz"
+      "from": "glogg@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/glogg/-/glogg-1.0.0.tgz"
     },
-    "is-regex": {
-      "version": "1.0.4",
-      "from": "is-regex@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.0.4.tgz"
+    "got": {
+      "version": "5.7.1",
+      "from": "got@>=5.0.0 <6.0.0",
+      "resolved": "https://registry.npmjs.org/got/-/got-5.7.1.tgz",
+      "dependencies": {
+        "duplexer2": {
+          "version": "0.1.4",
+          "from": "duplexer2@>=0.1.4 <0.2.0",
+          "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.1.4.tgz"
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.5 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+        },
+        "string_decoder": {
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+        }
+      }
     },
-    "is-regexp": {
-      "version": "1.0.0",
-      "from": "is-regexp@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-regexp/-/is-regexp-1.0.0.tgz"
+    "graceful-fs": {
+      "version": "4.1.11",
+      "from": "graceful-fs@>=4.1.2 <5.0.0",
+      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz"
     },
-    "is-relative": {
-      "version": "0.2.1",
-      "from": "is-relative@>=0.2.1 <0.3.0",
-      "resolved": "https://registry.npmjs.org/is-relative/-/is-relative-0.2.1.tgz"
+    "graceful-readlink": {
+      "version": "1.0.1",
+      "from": "graceful-readlink@>=1.0.0",
+      "resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz"
     },
-    "is-retry-allowed": {
-      "version": "1.1.0",
-      "from": "is-retry-allowed@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-retry-allowed/-/is-retry-allowed-1.1.0.tgz"
+    "growl": {
+      "version": "1.9.2",
+      "from": "growl@1.9.2",
+      "resolved": "https://registry.npmjs.org/growl/-/growl-1.9.2.tgz"
     },
-    "is-stream": {
-      "version": "1.1.0",
-      "from": "is-stream@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz"
+    "growly": {
+      "version": "1.3.0",
+      "from": "growly@>=1.3.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz"
+    },
+    "gulp": {
+      "version": "3.9.1",
+      "from": "gulp@>=3.9.1 <3.10.0",
+      "resolved": "https://registry.npmjs.org/gulp/-/gulp-3.9.1.tgz",
+      "dependencies": {
+        "semver": {
+          "version": "4.3.6",
+          "from": "semver@>=4.1.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz"
+        }
+      }
     },
-    "is-subset": {
-      "version": "0.1.1",
-      "from": "is-subset@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/is-subset/-/is-subset-0.1.1.tgz"
+    "gulp-cache": {
+      "version": "0.4.6",
+      "from": "gulp-cache@>=0.4.5 <0.5.0",
+      "resolved": "https://registry.npmjs.org/gulp-cache/-/gulp-cache-0.4.6.tgz",
+      "dependencies": {
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.4 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+        },
+        "string_decoder": {
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+        },
+        "vinyl": {
+          "version": "1.2.0",
+          "from": "vinyl@>=1.1.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz"
+        }
+      }
     },
-    "is-svg": {
-      "version": "2.1.0",
-      "from": "is-svg@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/is-svg/-/is-svg-2.1.0.tgz"
+    "gulp-changed": {
+      "version": "1.3.2",
+      "from": "gulp-changed@>=1.3.2 <1.4.0",
+      "resolved": "https://registry.npmjs.org/gulp-changed/-/gulp-changed-1.3.2.tgz"
     },
-    "is-symbol": {
-      "version": "1.0.1",
-      "from": "is-symbol@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.0.1.tgz"
+    "gulp-clean-css": {
+      "version": "2.0.13",
+      "from": "gulp-clean-css@>=2.0.11 <2.1.0",
+      "resolved": "https://registry.npmjs.org/gulp-clean-css/-/gulp-clean-css-2.0.13.tgz",
+      "dependencies": {
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.1.5 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+        },
+        "string_decoder": {
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+        }
+      }
     },
-    "is-typedarray": {
+    "gulp-clip-empty-files": {
+      "version": "0.1.2",
+      "from": "gulp-clip-empty-files@>=0.1.2 <0.2.0",
+      "resolved": "https://registry.npmjs.org/gulp-clip-empty-files/-/gulp-clip-empty-files-0.1.2.tgz"
+    },
+    "gulp-clone": {
       "version": "1.0.0",
-      "from": "is-typedarray@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz"
+      "from": "gulp-clone@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/gulp-clone/-/gulp-clone-1.0.0.tgz",
+      "dependencies": {
+        "ansi-regex": {
+          "version": "0.2.1",
+          "from": "ansi-regex@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-0.2.1.tgz"
+        },
+        "ansi-styles": {
+          "version": "1.1.0",
+          "from": "ansi-styles@>=1.1.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-1.1.0.tgz"
+        },
+        "chalk": {
+          "version": "0.5.1",
+          "from": "chalk@>=0.5.0 <0.6.0",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-0.5.1.tgz"
+        },
+        "dateformat": {
+          "version": "1.0.12",
+          "from": "dateformat@>=1.0.7-1.2.3 <2.0.0",
+          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz"
+        },
+        "gulp-util": {
+          "version": "2.2.20",
+          "from": "gulp-util@>=2.2.14 <2.3.0",
+          "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-2.2.20.tgz",
+          "dependencies": {
+            "through2": {
+              "version": "0.5.1",
+              "from": "through2@>=0.5.0 <0.6.0",
+              "resolved": "https://registry.npmjs.org/through2/-/through2-0.5.1.tgz"
+            }
+          }
+        },
+        "has-ansi": {
+          "version": "0.1.0",
+          "from": "has-ansi@>=0.1.0 <0.2.0",
+          "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-0.1.0.tgz"
+        },
+        "lodash._reinterpolate": {
+          "version": "2.4.1",
+          "from": "lodash._reinterpolate@>=2.4.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-2.4.1.tgz"
+        },
+        "lodash.escape": {
+          "version": "2.4.1",
+          "from": "lodash.escape@>=2.4.1 <2.5.0",
+          "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-2.4.1.tgz"
+        },
+        "lodash.keys": {
+          "version": "2.4.1",
+          "from": "lodash.keys@>=2.4.1 <2.5.0",
+          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
+        },
+        "lodash.template": {
+          "version": "2.4.1",
+          "from": "lodash.template@>=2.4.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-2.4.1.tgz"
+        },
+        "lodash.templatesettings": {
+          "version": "2.4.1",
+          "from": "lodash.templatesettings@>=2.4.1 <2.5.0",
+          "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-2.4.1.tgz"
+        },
+        "minimist": {
+          "version": "0.2.0",
+          "from": "minimist@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.0.tgz"
+        },
+        "readable-stream": {
+          "version": "1.0.34",
+          "from": "readable-stream@>=1.0.17 <1.1.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
+        },
+        "strip-ansi": {
+          "version": "0.3.0",
+          "from": "strip-ansi@>=0.3.0 <0.4.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-0.3.0.tgz"
+        },
+        "supports-color": {
+          "version": "0.2.0",
+          "from": "supports-color@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-0.2.0.tgz"
+        },
+        "through2": {
+          "version": "0.4.2",
+          "from": "through2@>=0.4.1 <0.5.0",
+          "resolved": "https://registry.npmjs.org/through2/-/through2-0.4.2.tgz",
+          "dependencies": {
+            "xtend": {
+              "version": "2.1.2",
+              "from": "xtend@>=2.1.1 <2.2.0",
+              "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz"
+            }
+          }
+        },
+        "vinyl": {
+          "version": "0.2.3",
+          "from": "vinyl@>=0.2.1 <0.3.0",
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.2.3.tgz"
+        },
+        "xtend": {
+          "version": "3.0.0",
+          "from": "xtend@>=3.0.0 <3.1.0",
+          "resolved": "https://registry.npmjs.org/xtend/-/xtend-3.0.0.tgz"
+        }
+      }
     },
-    "is-unc-path": {
-      "version": "0.1.2",
-      "from": "is-unc-path@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/is-unc-path/-/is-unc-path-0.1.2.tgz"
+    "gulp-connect": {
+      "version": "5.0.0",
+      "from": "gulp-connect@>=5.0.0 <5.1.0",
+      "resolved": "https://registry.npmjs.org/gulp-connect/-/gulp-connect-5.0.0.tgz",
+      "dependencies": {
+        "body-parser": {
+          "version": "1.13.3",
+          "from": "body-parser@>=1.13.3 <1.14.0",
+          "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.13.3.tgz"
+        },
+        "bytes": {
+          "version": "2.1.0",
+          "from": "bytes@2.1.0",
+          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.1.0.tgz"
+        },
+        "connect": {
+          "version": "2.30.2",
+          "from": "connect@>=2.30.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/connect/-/connect-2.30.2.tgz"
+        },
+        "cookie": {
+          "version": "0.1.3",
+          "from": "cookie@0.1.3",
+          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz"
+        },
+        "debug": {
+          "version": "2.2.0",
+          "from": "debug@>=2.2.0 <2.3.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+        },
+        "depd": {
+          "version": "1.0.1",
+          "from": "depd@>=1.0.1 <1.1.0",
+          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz"
+        },
+        "escape-html": {
+          "version": "1.0.2",
+          "from": "escape-html@1.0.2",
+          "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.2.tgz"
+        },
+        "event-stream": {
+          "version": "3.3.4",
+          "from": "event-stream@>=3.3.2 <4.0.0",
+          "resolved": "https://registry.npmjs.org/event-stream/-/event-stream-3.3.4.tgz"
+        },
+        "finalhandler": {
+          "version": "0.4.0",
+          "from": "finalhandler@0.4.0",
+          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.4.0.tgz"
+        },
+        "http-errors": {
+          "version": "1.3.1",
+          "from": "http-errors@>=1.3.1 <1.4.0",
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
+        },
+        "iconv-lite": {
+          "version": "0.4.11",
+          "from": "iconv-lite@0.4.11",
+          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.11.tgz"
+        },
+        "map-stream": {
+          "version": "0.1.0",
+          "from": "map-stream@>=0.1.0 <0.2.0",
+          "resolved": "https://registry.npmjs.org/map-stream/-/map-stream-0.1.0.tgz"
+        },
+        "mime": {
+          "version": "1.3.4",
+          "from": "mime@1.3.4",
+          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz"
+        },
+        "ms": {
+          "version": "0.7.1",
+          "from": "ms@0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+        },
+        "qs": {
+          "version": "4.0.0",
+          "from": "qs@4.0.0",
+          "resolved": "https://registry.npmjs.org/qs/-/qs-4.0.0.tgz"
+        },
+        "range-parser": {
+          "version": "1.0.3",
+          "from": "range-parser@>=1.0.3 <1.1.0",
+          "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.0.3.tgz"
+        },
+        "raw-body": {
+          "version": "2.1.7",
+          "from": "raw-body@>=2.1.2 <2.2.0",
+          "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.1.7.tgz",
+          "dependencies": {
+            "bytes": {
+              "version": "2.4.0",
+              "from": "bytes@2.4.0",
+              "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz"
+            },
+            "iconv-lite": {
+              "version": "0.4.13",
+              "from": "iconv-lite@0.4.13",
+              "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.13.tgz"
+            }
+          }
+        },
+        "send": {
+          "version": "0.13.2",
+          "from": "send@0.13.2",
+          "resolved": "https://registry.npmjs.org/send/-/send-0.13.2.tgz",
+          "dependencies": {
+            "depd": {
+              "version": "1.1.0",
+              "from": "depd@~1.1.0",
+              "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.0.tgz"
+            },
+            "escape-html": {
+              "version": "1.0.3",
+              "from": "escape-html@~1.0.3",
+              "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz"
+            },
+            "statuses": {
+              "version": "1.2.1",
+              "from": "statuses@>=1.2.1 <1.3.0",
+              "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.2.1.tgz"
+            }
+          }
+        },
+        "serve-static": {
+          "version": "1.10.3",
+          "from": "serve-static@>=1.10.0 <1.11.0",
+          "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.10.3.tgz",
+          "dependencies": {
+            "escape-html": {
+              "version": "1.0.3",
+              "from": "escape-html@~1.0.3",
+              "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz"
+            }
+          }
+        },
+        "split": {
+          "version": "0.3.3",
+          "from": "split@>=0.3.0 <0.4.0",
+          "resolved": "https://registry.npmjs.org/split/-/split-0.3.3.tgz"
+        }
+      }
     },
-    "is-utf8": {
-      "version": "0.2.1",
-      "from": "is-utf8@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz"
+    "gulp-debug": {
+      "version": "3.1.0",
+      "from": "gulp-debug@3.1.0",
+      "resolved": "https://registry.npmjs.org/gulp-debug/-/gulp-debug-3.1.0.tgz"
     },
-    "is-valid-glob": {
-      "version": "0.3.0",
-      "from": "is-valid-glob@>=0.3.0 <0.4.0",
-      "resolved": "https://registry.npmjs.org/is-valid-glob/-/is-valid-glob-0.3.0.tgz"
+    "gulp-decomment": {
+      "version": "0.1.3",
+      "from": "gulp-decomment@>=0.1.3 <0.2.0",
+      "resolved": "https://registry.npmjs.org/gulp-decomment/-/gulp-decomment-0.1.3.tgz"
     },
-    "is-windows": {
+    "gulp-flatten": {
       "version": "0.2.0",
-      "from": "is-windows@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-0.2.0.tgz"
-    },
-    "isarray": {
-      "version": "1.0.0",
-      "from": "isarray@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
-    },
-    "isbinaryfile": {
-      "version": "3.0.2",
-      "from": "isbinaryfile@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/isbinaryfile/-/isbinaryfile-3.0.2.tgz"
+      "from": "gulp-flatten@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/gulp-flatten/-/gulp-flatten-0.2.0.tgz"
     },
-    "isexe": {
-      "version": "2.0.0",
-      "from": "isexe@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz"
+    "gulp-if": {
+      "version": "2.0.2",
+      "from": "gulp-if@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/gulp-if/-/gulp-if-2.0.2.tgz"
     },
-    "isobject": {
-      "version": "2.1.0",
-      "from": "isobject@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz"
+    "gulp-karma": {
+      "version": "0.0.5",
+      "from": "gulp-karma@>=0.0.5 <0.1.0",
+      "resolved": "https://registry.npmjs.org/gulp-karma/-/gulp-karma-0.0.5.tgz",
+      "dependencies": {
+        "ansi-regex": {
+          "version": "0.2.1",
+          "from": "ansi-regex@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-0.2.1.tgz"
+        },
+        "ansi-styles": {
+          "version": "1.1.0",
+          "from": "ansi-styles@>=1.1.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-1.1.0.tgz"
+        },
+        "chalk": {
+          "version": "0.5.1",
+          "from": "chalk@>=0.5.0 <0.6.0",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-0.5.1.tgz"
+        },
+        "dateformat": {
+          "version": "1.0.12",
+          "from": "dateformat@>=1.0.7-1.2.3 <2.0.0",
+          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz"
+        },
+        "gulp-util": {
+          "version": "2.2.20",
+          "from": "gulp-util@>=2.2.14 <2.3.0",
+          "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-2.2.20.tgz"
+        },
+        "has-ansi": {
+          "version": "0.1.0",
+          "from": "has-ansi@>=0.1.0 <0.2.0",
+          "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-0.1.0.tgz"
+        },
+        "lodash._reinterpolate": {
+          "version": "2.4.1",
+          "from": "lodash._reinterpolate@>=2.4.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-2.4.1.tgz"
+        },
+        "lodash.escape": {
+          "version": "2.4.1",
+          "from": "lodash.escape@>=2.4.1 <2.5.0",
+          "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-2.4.1.tgz"
+        },
+        "lodash.keys": {
+          "version": "2.4.1",
+          "from": "lodash.keys@>=2.4.1 <2.5.0",
+          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
+        },
+        "lodash.template": {
+          "version": "2.4.1",
+          "from": "lodash.template@>=2.4.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-2.4.1.tgz"
+        },
+        "lodash.templatesettings": {
+          "version": "2.4.1",
+          "from": "lodash.templatesettings@>=2.4.1 <2.5.0",
+          "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-2.4.1.tgz"
+        },
+        "minimist": {
+          "version": "0.2.0",
+          "from": "minimist@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.0.tgz"
+        },
+        "readable-stream": {
+          "version": "1.0.34",
+          "from": "readable-stream@>=1.0.17 <1.1.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
+        },
+        "strip-ansi": {
+          "version": "0.3.0",
+          "from": "strip-ansi@>=0.3.0 <0.4.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-0.3.0.tgz"
+        },
+        "supports-color": {
+          "version": "0.2.0",
+          "from": "supports-color@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-0.2.0.tgz"
+        },
+        "through2": {
+          "version": "0.5.1",
+          "from": "through2@>=0.5.0 <0.6.0",
+          "resolved": "https://registry.npmjs.org/through2/-/through2-0.5.1.tgz",
+          "dependencies": {
+            "xtend": {
+              "version": "3.0.0",
+              "from": "xtend@>=3.0.0 <3.1.0",
+              "resolved": "https://registry.npmjs.org/xtend/-/xtend-3.0.0.tgz"
+            }
+          }
+        },
+        "vinyl": {
+          "version": "0.2.3",
+          "from": "vinyl@>=0.2.1 <0.3.0",
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.2.3.tgz"
+        },
+        "xtend": {
+          "version": "2.1.2",
+          "from": "xtend@>=2.1.1 <2.2.0",
+          "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz"
+        }
+      }
     },
-    "isomorphic-fetch": {
-      "version": "2.2.1",
-      "from": "isomorphic-fetch@>=2.1.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz"
+    "gulp-match": {
+      "version": "1.0.3",
+      "from": "gulp-match@>=1.0.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/gulp-match/-/gulp-match-1.0.3.tgz"
     },
-    "isstream": {
-      "version": "0.1.2",
-      "from": "isstream@>=0.1.2 <0.2.0",
-      "resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz"
+    "gulp-open": {
+      "version": "2.0.0",
+      "from": "gulp-open@>=2.0.0 <2.1.0",
+      "resolved": "https://registry.npmjs.org/gulp-open/-/gulp-open-2.0.0.tgz"
     },
-    "istanbul": {
-      "version": "0.4.5",
-      "from": "istanbul@>=0.0.0 <1.0.0",
-      "resolved": "https://registry.npmjs.org/istanbul/-/istanbul-0.4.5.tgz",
+    "gulp-phantomcss": {
+      "version": "0.3.0",
+      "from": "gulp-phantomcss@>=0.3.0 <0.4.0",
+      "resolved": "https://registry.npmjs.org/gulp-phantomcss/-/gulp-phantomcss-0.3.0.tgz",
       "dependencies": {
-        "glob": {
-          "version": "5.0.15",
-          "from": "glob@>=5.0.15 <6.0.0",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
+        "async": {
+          "version": "2.4.1",
+          "from": "async@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
+          "dependencies": {
+            "lodash": {
+              "version": "4.17.4",
+              "from": "lodash@>=4.14.0 <5.0.0",
+              "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz"
+            }
+          }
+        },
+        "caseless": {
+          "version": "0.11.0",
+          "from": "caseless@>=0.11.0 <0.12.0",
+          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz"
+        },
+        "dateformat": {
+          "version": "1.0.12",
+          "from": "dateformat@>=1.0.11 <2.0.0",
+          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz"
+        },
+        "form-data": {
+          "version": "1.0.1",
+          "from": "form-data@>=1.0.0-rc3 <1.1.0",
+          "resolved": "https://registry.npmjs.org/form-data/-/form-data-1.0.1.tgz"
+        },
+        "gulp-util": {
+          "version": "3.0.7",
+          "from": "gulp-util@3.0.7",
+          "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.7.tgz"
+        },
+        "har-validator": {
+          "version": "2.0.6",
+          "from": "har-validator@>=2.0.2 <2.1.0",
+          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz"
         },
-        "resolve": {
-          "version": "1.1.7",
-          "from": "resolve@>=1.1.0 <1.2.0",
-          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz"
+        "lodash": {
+          "version": "3.10.1",
+          "from": "lodash@3.10.1",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz"
         },
-        "supports-color": {
-          "version": "3.2.3",
-          "from": "supports-color@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+        "node-uuid": {
+          "version": "1.4.8",
+          "from": "node-uuid@~1.4.7",
+          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz"
         },
-        "wordwrap": {
-          "version": "1.0.0",
-          "from": "wordwrap@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz"
-        }
-      }
-    },
-    "istanbul-instrumenter-loader": {
-      "version": "0.2.0",
-      "from": "istanbul-instrumenter-loader@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/istanbul-instrumenter-loader/-/istanbul-instrumenter-loader-0.2.0.tgz"
-    },
-    "istextorbinary": {
-      "version": "1.0.2",
-      "from": "istextorbinary@1.0.2",
-      "resolved": "https://registry.npmjs.org/istextorbinary/-/istextorbinary-1.0.2.tgz"
-    },
-    "jade": {
-      "version": "0.26.3",
-      "from": "jade@0.26.3",
-      "resolved": "https://registry.npmjs.org/jade/-/jade-0.26.3.tgz",
-      "dependencies": {
-        "commander": {
-          "version": "0.6.1",
-          "from": "commander@0.6.1",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-0.6.1.tgz"
+        "object-assign": {
+          "version": "3.0.0",
+          "from": "object-assign@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz"
         },
-        "mkdirp": {
-          "version": "0.3.0",
-          "from": "mkdirp@0.3.0",
-          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.3.0.tgz"
+        "phantomjs-prebuilt": {
+          "version": "2.1.7",
+          "from": "phantomjs-prebuilt@2.1.7",
+          "resolved": "https://registry.npmjs.org/phantomjs-prebuilt/-/phantomjs-prebuilt-2.1.7.tgz"
+        },
+        "qs": {
+          "version": "5.2.1",
+          "from": "qs@>=5.2.0 <5.3.0",
+          "resolved": "https://registry.npmjs.org/qs/-/qs-5.2.1.tgz"
+        },
+        "request": {
+          "version": "2.67.0",
+          "from": "request@>=2.67.0 <2.68.0",
+          "resolved": "https://registry.npmjs.org/request/-/request-2.67.0.tgz"
+        },
+        "tough-cookie": {
+          "version": "2.2.2",
+          "from": "tough-cookie@>=2.2.0 <2.3.0",
+          "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.2.2.tgz"
+        },
+        "tunnel-agent": {
+          "version": "0.4.3",
+          "from": "tunnel-agent@>=0.4.1 <0.5.0",
+          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz"
         }
       }
     },
-    "jju": {
-      "version": "1.3.0",
-      "from": "jju@>=1.3.0 <1.4.0",
-      "resolved": "https://registry.npmjs.org/jju/-/jju-1.3.0.tgz"
-    },
-    "jodid25519": {
-      "version": "1.0.2",
-      "from": "jodid25519@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/jodid25519/-/jodid25519-1.0.2.tgz",
-      "optional": true
-    },
-    "js-base64": {
-      "version": "2.1.9",
-      "from": "js-base64@>=2.1.9 <3.0.0",
-      "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.1.9.tgz"
-    },
-    "js-tokens": {
-      "version": "3.0.1",
-      "from": "js-tokens@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.1.tgz"
-    },
-    "js-yaml": {
-      "version": "3.8.4",
-      "from": "js-yaml@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.8.4.tgz",
-      "dependencies": {
-        "esprima": {
-          "version": "3.1.3",
-          "from": "esprima@>=3.1.1 <4.0.0",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz"
-        }
-      }
+    "gulp-plumber": {
+      "version": "1.1.0",
+      "from": "gulp-plumber@>=1.1.0 <1.2.0",
+      "resolved": "https://registry.npmjs.org/gulp-plumber/-/gulp-plumber-1.1.0.tgz"
     },
-    "jsbn": {
-      "version": "0.1.1",
-      "from": "jsbn@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-0.1.1.tgz",
-      "optional": true
+    "gulp-postcss": {
+      "version": "6.1.1",
+      "from": "gulp-postcss@>=6.1.1 <6.2.0",
+      "resolved": "https://registry.npmjs.org/gulp-postcss/-/gulp-postcss-6.1.1.tgz"
     },
-    "jsesc": {
-      "version": "0.5.0",
-      "from": "jsesc@>=0.5.0 <0.6.0",
-      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz"
+    "gulp-prompt": {
+      "version": "0.2.0",
+      "from": "gulp-prompt@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/gulp-prompt/-/gulp-prompt-0.2.0.tgz"
     },
-    "json-loader": {
+    "gulp-replace": {
       "version": "0.5.4",
-      "from": "json-loader@>=0.5.4 <0.6.0",
-      "resolved": "https://registry.npmjs.org/json-loader/-/json-loader-0.5.4.tgz"
-    },
-    "json-schema": {
-      "version": "0.2.3",
-      "from": "json-schema@0.2.3",
-      "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz"
-    },
-    "json-stable-stringify": {
-      "version": "1.0.1",
-      "from": "json-stable-stringify@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz"
-    },
-    "json-stringify-safe": {
-      "version": "5.0.1",
-      "from": "json-stringify-safe@>=5.0.1 <5.1.0",
-      "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz"
-    },
-    "json3": {
-      "version": "3.3.2",
-      "from": "json3@3.3.2",
-      "resolved": "https://registry.npmjs.org/json3/-/json3-3.3.2.tgz"
-    },
-    "json5": {
-      "version": "0.5.1",
-      "from": "json5@>=0.5.0 <0.6.0",
-      "resolved": "https://registry.npmjs.org/json5/-/json5-0.5.1.tgz"
-    },
-    "jsonfile": {
-      "version": "2.4.0",
-      "from": "jsonfile@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz"
-    },
-    "jsonify": {
-      "version": "0.0.0",
-      "from": "jsonify@>=0.0.0 <0.1.0",
-      "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz"
-    },
-    "jsonpointer": {
-      "version": "4.0.1",
-      "from": "jsonpointer@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/jsonpointer/-/jsonpointer-4.0.1.tgz"
-    },
-    "jsprim": {
-      "version": "1.4.0",
-      "from": "jsprim@>=1.2.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.0.tgz",
+      "from": "gulp-replace@>=0.5.4 <0.6.0",
+      "resolved": "https://registry.npmjs.org/gulp-replace/-/gulp-replace-0.5.4.tgz",
       "dependencies": {
-        "assert-plus": {
+        "isarray": {
           "version": "1.0.0",
-          "from": "assert-plus@1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz"
-        }
-      }
-    },
-    "jstransform": {
-      "version": "11.0.3",
-      "from": "jstransform@>=11.0.3 <12.0.0",
-      "resolved": "https://registry.npmjs.org/jstransform/-/jstransform-11.0.3.tgz",
-      "dependencies": {
-        "esprima-fb": {
-          "version": "15001.1.0-dev-harmony-fb",
-          "from": "esprima-fb@>=15001.1.0-dev-harmony-fb <15002.0.0",
-          "resolved": "https://registry.npmjs.org/esprima-fb/-/esprima-fb-15001.1.0-dev-harmony-fb.tgz"
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
-        "object-assign": {
-          "version": "2.1.1",
-          "from": "object-assign@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-2.1.1.tgz"
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
-        "source-map": {
-          "version": "0.4.4",
-          "from": "source-map@>=0.4.2 <0.5.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz"
+        "string_decoder": {
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
-    "jszip": {
-      "version": "2.5.0",
-      "from": "jszip@2.5.0",
-      "resolved": "https://registry.npmjs.org/jszip/-/jszip-2.5.0.tgz"
-    },
-    "karma": {
-      "version": "0.13.22",
-      "from": "karma@>=0.13.9 <0.14.0",
-      "resolved": "https://registry.npmjs.org/karma/-/karma-0.13.22.tgz",
+    "gulp-sass": {
+      "version": "2.3.2",
+      "from": "gulp-sass@>=2.3.2 <2.4.0",
+      "resolved": "https://registry.npmjs.org/gulp-sass/-/gulp-sass-2.3.2.tgz",
       "dependencies": {
-        "core-js": {
-          "version": "2.4.1",
-          "from": "core-js@>=2.1.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.4.1.tgz"
+        "gaze": {
+          "version": "1.1.2",
+          "from": "gaze@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz"
         },
-        "lodash": {
-          "version": "3.10.1",
-          "from": "lodash@>=3.8.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz"
+        "globule": {
+          "version": "1.1.0",
+          "from": "globule@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/globule/-/globule-1.1.0.tgz"
         },
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.3 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
-        }
-      }
-    },
-    "karma-coverage": {
-      "version": "0.5.5",
-      "from": "karma-coverage@>=0.5.5 <0.6.0",
-      "resolved": "https://registry.npmjs.org/karma-coverage/-/karma-coverage-0.5.5.tgz",
-      "dependencies": {
-        "dateformat": {
-          "version": "1.0.12",
-          "from": "dateformat@>=1.0.6 <2.0.0",
-          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz"
+        "lodash": {
+          "version": "4.16.6",
+          "from": "lodash@>=4.16.4 <4.17.0",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.16.6.tgz"
         },
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.1 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
-        }
-      }
-    },
-    "karma-mocha": {
-      "version": "0.2.2",
-      "from": "karma-mocha@>=0.2.2 <0.3.0",
-      "resolved": "https://registry.npmjs.org/karma-mocha/-/karma-mocha-0.2.2.tgz"
-    },
-    "karma-mocha-clean-reporter": {
-      "version": "0.0.1",
-      "from": "karma-mocha-clean-reporter@>=0.0.1 <0.1.0",
-      "resolved": "https://registry.npmjs.org/karma-mocha-clean-reporter/-/karma-mocha-clean-reporter-0.0.1.tgz"
-    },
-    "karma-phantomjs-launcher": {
-      "version": "1.0.4",
-      "from": "karma-phantomjs-launcher@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/karma-phantomjs-launcher/-/karma-phantomjs-launcher-1.0.4.tgz"
+        "node-sass": {
+          "version": "3.13.1",
+          "from": "node-sass@>=3.4.2 <4.0.0",
+          "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-3.13.1.tgz"
+        }
+      }
     },
-    "karma-sinon-chai": {
-      "version": "1.2.4",
-      "from": "karma-sinon-chai@>=1.2.0 <1.3.0",
-      "resolved": "https://registry.npmjs.org/karma-sinon-chai/-/karma-sinon-chai-1.2.4.tgz",
+    "gulp-sourcemaps": {
+      "version": "1.6.0",
+      "from": "gulp-sourcemaps@>=1.6.0 <1.7.0",
+      "resolved": "https://registry.npmjs.org/gulp-sourcemaps/-/gulp-sourcemaps-1.6.0.tgz",
       "dependencies": {
-        "lolex": {
-          "version": "1.6.0",
-          "from": "lolex@>=1.5.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz"
+        "strip-bom": {
+          "version": "2.0.0",
+          "from": "strip-bom@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz"
+        },
+        "vinyl": {
+          "version": "1.2.0",
+          "from": "vinyl@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz"
         }
       }
     },
-    "karma-webpack": {
-      "version": "2.0.3",
-      "from": "karma-webpack@>=2.0.1 <2.1.0",
-      "resolved": "https://registry.npmjs.org/karma-webpack/-/karma-webpack-2.0.3.tgz",
+    "gulp-texttojs": {
+      "version": "1.0.3",
+      "from": "gulp-texttojs@>=1.0.3 <1.1.0",
+      "resolved": "https://registry.npmjs.org/gulp-texttojs/-/gulp-texttojs-1.0.3.tgz",
       "dependencies": {
-        "async": {
-          "version": "0.9.2",
-          "from": "async@>=0.9.0 <0.10.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
-        },
         "lodash": {
-          "version": "3.10.1",
-          "from": "lodash@>=3.8.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz"
+          "version": "2.4.2",
+          "from": "lodash@>=2.4.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-2.4.2.tgz"
         },
-        "source-map": {
-          "version": "0.1.43",
-          "from": "source-map@>=0.1.41 <0.2.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
+        "readable-stream": {
+          "version": "1.0.34",
+          "from": "readable-stream@>=1.0.17 <1.1.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
+        },
+        "through2": {
+          "version": "0.4.2",
+          "from": "through2@>=0.4.2 <0.5.0",
+          "resolved": "https://registry.npmjs.org/through2/-/through2-0.4.2.tgz"
+        },
+        "xtend": {
+          "version": "2.1.2",
+          "from": "xtend@>=2.1.1 <2.2.0",
+          "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz"
         }
       }
     },
-    "kew": {
-      "version": "0.7.0",
-      "from": "kew@>=0.7.0 <0.8.0",
-      "resolved": "https://registry.npmjs.org/kew/-/kew-0.7.0.tgz"
-    },
-    "kind-of": {
-      "version": "3.2.2",
-      "from": "kind-of@>=3.0.2 <4.0.0",
-      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz"
-    },
-    "klaw": {
-      "version": "1.3.1",
-      "from": "klaw@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/klaw/-/klaw-1.3.1.tgz"
-    },
-    "latest-version": {
-      "version": "3.1.0",
-      "from": "latest-version@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-3.1.0.tgz"
-    },
-    "lazy-cache": {
-      "version": "1.0.4",
-      "from": "lazy-cache@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-1.0.4.tgz"
-    },
-    "lazy-req": {
-      "version": "2.0.0",
-      "from": "lazy-req@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/lazy-req/-/lazy-req-2.0.0.tgz"
-    },
-    "lazystream": {
-      "version": "1.0.0",
-      "from": "lazystream@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/lazystream/-/lazystream-1.0.0.tgz"
-    },
-    "lcid": {
-      "version": "1.0.0",
-      "from": "lcid@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/lcid/-/lcid-1.0.0.tgz"
-    },
-    "levn": {
-      "version": "0.3.0",
-      "from": "levn@>=0.3.0 <0.4.0",
-      "resolved": "https://registry.npmjs.org/levn/-/levn-0.3.0.tgz"
-    },
-    "liftoff": {
-      "version": "2.3.0",
-      "from": "liftoff@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/liftoff/-/liftoff-2.3.0.tgz"
-    },
-    "livereload-js": {
-      "version": "2.2.2",
-      "from": "livereload-js@>=2.2.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/livereload-js/-/livereload-js-2.2.2.tgz"
-    },
-    "load-json-file": {
-      "version": "1.1.0",
-      "from": "load-json-file@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
+    "gulp-typescript": {
+      "version": "3.1.7",
+      "from": "gulp-typescript@>=3.1.3 <3.2.0",
+      "resolved": "https://registry.npmjs.org/gulp-typescript/-/gulp-typescript-3.1.7.tgz",
       "dependencies": {
+        "glob": {
+          "version": "5.0.15",
+          "from": "glob@>=5.0.3 <6.0.0",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
+        },
+        "glob-parent": {
+          "version": "3.1.0",
+          "from": "glob-parent@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-3.1.0.tgz"
+        },
+        "glob-stream": {
+          "version": "5.3.5",
+          "from": "glob-stream@>=5.3.2 <6.0.0",
+          "resolved": "https://registry.npmjs.org/glob-stream/-/glob-stream-5.3.5.tgz",
+          "dependencies": {
+            "isarray": {
+              "version": "0.0.1",
+              "from": "isarray@0.0.1",
+              "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
+            },
+            "readable-stream": {
+              "version": "1.0.34",
+              "from": "readable-stream@>=1.0.33-1 <1.1.0-0",
+              "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
+            },
+            "string_decoder": {
+              "version": "0.10.31",
+              "from": "string_decoder@~0.10.x",
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
+            },
+            "through2": {
+              "version": "0.6.5",
+              "from": "through2@>=0.6.0 <0.7.0",
+              "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz"
+            }
+          }
+        },
+        "is-extglob": {
+          "version": "2.1.1",
+          "from": "is-extglob@>=2.1.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz"
+        },
+        "is-glob": {
+          "version": "3.1.0",
+          "from": "is-glob@>=3.1.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz"
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+        },
+        "ordered-read-streams": {
+          "version": "0.3.0",
+          "from": "ordered-read-streams@>=0.3.0 <0.4.0",
+          "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.3.0.tgz"
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.4 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+        },
+        "string_decoder": {
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+        },
         "strip-bom": {
           "version": "2.0.0",
           "from": "strip-bom@>=2.0.0 <3.0.0",
           "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz"
+        },
+        "unique-stream": {
+          "version": "2.2.1",
+          "from": "unique-stream@>=2.0.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-2.2.1.tgz"
+        },
+        "vinyl": {
+          "version": "1.2.0",
+          "from": "vinyl@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz"
+        },
+        "vinyl-fs": {
+          "version": "2.4.4",
+          "from": "vinyl-fs@>=2.4.3 <2.5.0",
+          "resolved": "https://registry.npmjs.org/vinyl-fs/-/vinyl-fs-2.4.4.tgz"
         }
       }
     },
-    "load-themed-styles": {
-      "version": "1.2.0",
-      "from": "load-themed-styles@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/load-themed-styles/-/load-themed-styles-1.2.0.tgz"
-    },
-    "load-themed-styles-loader": {
-      "version": "0.0.3",
-      "from": "load-themed-styles-loader@>=0.0.3 <0.0.4",
-      "resolved": "https://registry.npmjs.org/load-themed-styles-loader/-/load-themed-styles-loader-0.0.3.tgz"
-    },
-    "loader-runner": {
-      "version": "2.3.0",
-      "from": "loader-runner@>=2.3.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/loader-runner/-/loader-runner-2.3.0.tgz"
+    "gulp-util": {
+      "version": "3.0.8",
+      "from": "gulp-util@3.0.8",
+      "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.8.tgz",
+      "dependencies": {
+        "object-assign": {
+          "version": "3.0.0",
+          "from": "object-assign@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz"
+        }
+      }
     },
-    "loader-utils": {
-      "version": "0.2.17",
-      "from": "loader-utils@>=0.0.0 <1.0.0",
-      "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz"
+    "gulplog": {
+      "version": "1.0.0",
+      "from": "gulplog@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/gulplog/-/gulplog-1.0.0.tgz"
     },
-    "lodash": {
-      "version": "4.17.4",
-      "from": "lodash@>=4.17.2 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz"
+    "gutil": {
+      "version": "1.6.4",
+      "from": "gutil@1.6.4",
+      "resolved": "https://registry.npmjs.org/gutil/-/gutil-1.6.4.tgz"
     },
-    "lodash._arraycopy": {
+    "gzip-size": {
       "version": "3.0.0",
-      "from": "lodash._arraycopy@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._arraycopy/-/lodash._arraycopy-3.0.0.tgz"
+      "from": "gzip-size@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-3.0.0.tgz"
     },
-    "lodash._arrayeach": {
-      "version": "3.0.0",
-      "from": "lodash._arrayeach@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._arrayeach/-/lodash._arrayeach-3.0.0.tgz"
+    "handle-thing": {
+      "version": "1.2.5",
+      "from": "handle-thing@>=1.2.5 <2.0.0",
+      "resolved": "https://registry.npmjs.org/handle-thing/-/handle-thing-1.2.5.tgz"
     },
-    "lodash._baseassign": {
-      "version": "3.2.0",
-      "from": "lodash._baseassign@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._baseassign/-/lodash._baseassign-3.2.0.tgz"
+    "handlebars": {
+      "version": "4.0.10",
+      "from": "handlebars@>=4.0.1 <5.0.0",
+      "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.0.10.tgz",
+      "dependencies": {
+        "source-map": {
+          "version": "0.4.4",
+          "from": "source-map@>=0.4.4 <0.5.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz"
+        }
+      }
     },
-    "lodash._baseclone": {
-      "version": "4.5.7",
-      "from": "lodash._baseclone@>=4.5.0 <4.6.0",
-      "resolved": "https://registry.npmjs.org/lodash._baseclone/-/lodash._baseclone-4.5.7.tgz"
+    "har-schema": {
+      "version": "1.0.5",
+      "from": "har-schema@>=1.0.5 <2.0.0",
+      "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-1.0.5.tgz"
     },
-    "lodash._basecopy": {
-      "version": "3.0.1",
-      "from": "lodash._basecopy@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz"
+    "har-validator": {
+      "version": "4.2.1",
+      "from": "har-validator@>=4.2.1 <4.3.0",
+      "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz"
     },
-    "lodash._basecreate": {
-      "version": "3.0.3",
-      "from": "lodash._basecreate@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._basecreate/-/lodash._basecreate-3.0.3.tgz"
+    "has": {
+      "version": "1.0.1",
+      "from": "has@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/has/-/has-1.0.1.tgz"
     },
-    "lodash._basefor": {
-      "version": "3.0.3",
-      "from": "lodash._basefor@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._basefor/-/lodash._basefor-3.0.3.tgz"
+    "has-ansi": {
+      "version": "2.0.0",
+      "from": "has-ansi@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz"
     },
-    "lodash._basetostring": {
-      "version": "3.0.1",
-      "from": "lodash._basetostring@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._basetostring/-/lodash._basetostring-3.0.1.tgz"
+    "has-binary": {
+      "version": "0.1.7",
+      "from": "has-binary@0.1.7",
+      "resolved": "https://registry.npmjs.org/has-binary/-/has-binary-0.1.7.tgz"
     },
-    "lodash._basevalues": {
-      "version": "3.0.0",
-      "from": "lodash._basevalues@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._basevalues/-/lodash._basevalues-3.0.0.tgz"
+    "has-cors": {
+      "version": "1.1.0",
+      "from": "has-cors@1.1.0",
+      "resolved": "https://registry.npmjs.org/has-cors/-/has-cors-1.1.0.tgz"
     },
-    "lodash._bindcallback": {
-      "version": "3.0.1",
-      "from": "lodash._bindcallback@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._bindcallback/-/lodash._bindcallback-3.0.1.tgz"
+    "has-flag": {
+      "version": "1.0.0",
+      "from": "has-flag@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz"
     },
-    "lodash._createcompounder": {
-      "version": "3.0.0",
-      "from": "lodash._createcompounder@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._createcompounder/-/lodash._createcompounder-3.0.0.tgz"
+    "has-gulplog": {
+      "version": "0.1.0",
+      "from": "has-gulplog@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/has-gulplog/-/has-gulplog-0.1.0.tgz"
     },
-    "lodash._escapehtmlchar": {
-      "version": "2.4.1",
-      "from": "lodash._escapehtmlchar@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash._escapehtmlchar/-/lodash._escapehtmlchar-2.4.1.tgz"
+    "has-unicode": {
+      "version": "2.0.1",
+      "from": "has-unicode@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz"
     },
-    "lodash._escapestringchar": {
-      "version": "2.4.1",
-      "from": "lodash._escapestringchar@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash._escapestringchar/-/lodash._escapestringchar-2.4.1.tgz"
+    "hash-base": {
+      "version": "2.0.2",
+      "from": "hash-base@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/hash-base/-/hash-base-2.0.2.tgz"
     },
-    "lodash._getnative": {
-      "version": "3.9.1",
-      "from": "lodash._getnative@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._getnative/-/lodash._getnative-3.9.1.tgz"
+    "hash.js": {
+      "version": "1.0.3",
+      "from": "hash.js@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/hash.js/-/hash.js-1.0.3.tgz"
     },
-    "lodash._htmlescapes": {
-      "version": "2.4.1",
-      "from": "lodash._htmlescapes@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash._htmlescapes/-/lodash._htmlescapes-2.4.1.tgz"
+    "hasha": {
+      "version": "2.2.0",
+      "from": "hasha@>=2.2.0 <2.3.0",
+      "resolved": "https://registry.npmjs.org/hasha/-/hasha-2.2.0.tgz"
     },
-    "lodash._isiterateecall": {
-      "version": "3.0.9",
-      "from": "lodash._isiterateecall@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._isiterateecall/-/lodash._isiterateecall-3.0.9.tgz"
+    "hawk": {
+      "version": "3.1.3",
+      "from": "hawk@>=3.1.3 <3.2.0",
+      "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz"
     },
-    "lodash._isnative": {
-      "version": "2.4.1",
-      "from": "lodash._isnative@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash._isnative/-/lodash._isnative-2.4.1.tgz"
+    "he": {
+      "version": "1.1.1",
+      "from": "he@>=1.1.0 <1.2.0",
+      "resolved": "https://registry.npmjs.org/he/-/he-1.1.1.tgz"
     },
-    "lodash._objecttypes": {
-      "version": "2.4.1",
-      "from": "lodash._objecttypes@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash._objecttypes/-/lodash._objecttypes-2.4.1.tgz"
+    "highlight.js": {
+      "version": "9.11.0",
+      "from": "highlight.js@>=9.9.0 <10.0.0",
+      "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-9.11.0.tgz"
     },
-    "lodash._reescape": {
-      "version": "3.0.0",
-      "from": "lodash._reescape@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reescape/-/lodash._reescape-3.0.0.tgz"
+    "hmac-drbg": {
+      "version": "1.0.1",
+      "from": "hmac-drbg@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz"
     },
-    "lodash._reevaluate": {
-      "version": "3.0.0",
-      "from": "lodash._reevaluate@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reevaluate/-/lodash._reevaluate-3.0.0.tgz"
+    "hoek": {
+      "version": "2.16.3",
+      "from": "hoek@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz"
     },
-    "lodash._reinterpolate": {
-      "version": "3.0.0",
-      "from": "lodash._reinterpolate@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz"
+    "homedir-polyfill": {
+      "version": "1.0.1",
+      "from": "homedir-polyfill@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.1.tgz"
     },
-    "lodash._reunescapedhtml": {
-      "version": "2.4.1",
-      "from": "lodash._reunescapedhtml@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash._reunescapedhtml/-/lodash._reunescapedhtml-2.4.1.tgz",
+    "hosted-git-info": {
+      "version": "2.4.2",
+      "from": "hosted-git-info@>=2.1.4 <3.0.0",
+      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.4.2.tgz"
+    },
+    "hpack.js": {
+      "version": "2.1.6",
+      "from": "hpack.js@>=2.1.6 <3.0.0",
+      "resolved": "https://registry.npmjs.org/hpack.js/-/hpack.js-2.1.6.tgz",
       "dependencies": {
-        "lodash.keys": {
-          "version": "2.4.1",
-          "from": "lodash.keys@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+        },
+        "string_decoder": {
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
-    "lodash._root": {
-      "version": "3.0.1",
-      "from": "lodash._root@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._root/-/lodash._root-3.0.1.tgz"
-    },
-    "lodash._shimkeys": {
-      "version": "2.4.1",
-      "from": "lodash._shimkeys@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash._shimkeys/-/lodash._shimkeys-2.4.1.tgz"
-    },
-    "lodash._stack": {
-      "version": "4.1.3",
-      "from": "lodash._stack@>=4.1.0 <4.2.0",
-      "resolved": "https://registry.npmjs.org/lodash._stack/-/lodash._stack-4.1.3.tgz"
-    },
-    "lodash.assign": {
-      "version": "4.2.0",
-      "from": "lodash.assign@>=4.0.3 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.assign/-/lodash.assign-4.2.0.tgz"
-    },
-    "lodash.assignin": {
-      "version": "4.2.0",
-      "from": "lodash.assignin@>=4.0.9 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.assignin/-/lodash.assignin-4.2.0.tgz"
+    "html-comment-regex": {
+      "version": "1.1.1",
+      "from": "html-comment-regex@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/html-comment-regex/-/html-comment-regex-1.1.1.tgz"
     },
-    "lodash.assignwith": {
-      "version": "4.2.0",
-      "from": "lodash.assignwith@>=4.0.7 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.assignwith/-/lodash.assignwith-4.2.0.tgz"
+    "html-entities": {
+      "version": "1.2.1",
+      "from": "html-entities@>=1.2.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-1.2.1.tgz"
     },
-    "lodash.bind": {
-      "version": "4.2.1",
-      "from": "lodash.bind@>=4.1.4 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.bind/-/lodash.bind-4.2.1.tgz"
+    "html-loader": {
+      "version": "0.4.5",
+      "from": "html-loader@>=0.4.3 <0.5.0",
+      "resolved": "https://registry.npmjs.org/html-loader/-/html-loader-0.4.5.tgz",
+      "dependencies": {
+        "loader-utils": {
+          "version": "1.1.0",
+          "from": "loader-utils@>=1.0.2 <2.0.0",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
+        }
+      }
     },
-    "lodash.camelcase": {
-      "version": "4.3.0",
-      "from": "lodash.camelcase@>=4.3.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz"
+    "html-minifier": {
+      "version": "3.5.2",
+      "from": "html-minifier@>=3.0.1 <4.0.0",
+      "resolved": "https://registry.npmjs.org/html-minifier/-/html-minifier-3.5.2.tgz",
+      "dependencies": {
+        "clean-css": {
+          "version": "4.1.3",
+          "from": "clean-css@>=4.1.0 <4.2.0",
+          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.3.tgz"
+        },
+        "uglify-js": {
+          "version": "3.0.12",
+          "from": "uglify-js@>=3.0.0 <3.1.0",
+          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.12.tgz"
+        }
+      }
     },
-    "lodash.clone": {
-      "version": "4.5.0",
-      "from": "lodash.clone@>=4.3.2 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.clone/-/lodash.clone-4.5.0.tgz"
+    "htmlparser2": {
+      "version": "3.9.2",
+      "from": "htmlparser2@>=3.9.1 <4.0.0",
+      "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.9.2.tgz",
+      "dependencies": {
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+        },
+        "string_decoder": {
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+        }
+      }
     },
-    "lodash.clonedeep": {
-      "version": "4.5.0",
-      "from": "lodash.clonedeep@>=4.3.2 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz"
+    "http-browserify": {
+      "version": "1.7.0",
+      "from": "http-browserify@>=1.3.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/http-browserify/-/http-browserify-1.7.0.tgz"
     },
-    "lodash.create": {
-      "version": "3.1.1",
-      "from": "lodash.create@3.1.1",
-      "resolved": "https://registry.npmjs.org/lodash.create/-/lodash.create-3.1.1.tgz"
+    "http-deceiver": {
+      "version": "1.2.7",
+      "from": "http-deceiver@>=1.2.7 <2.0.0",
+      "resolved": "https://registry.npmjs.org/http-deceiver/-/http-deceiver-1.2.7.tgz"
     },
-    "lodash.deburr": {
-      "version": "3.2.0",
-      "from": "lodash.deburr@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.deburr/-/lodash.deburr-3.2.0.tgz"
+    "http-errors": {
+      "version": "1.6.1",
+      "from": "http-errors@>=1.6.1 <1.7.0",
+      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.1.tgz"
     },
-    "lodash.defaults": {
-      "version": "4.2.0",
-      "from": "lodash.defaults@>=4.0.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-4.2.0.tgz"
+    "http-proxy": {
+      "version": "1.16.2",
+      "from": "http-proxy@>=1.13.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.16.2.tgz"
     },
-    "lodash.escape": {
-      "version": "3.2.0",
-      "from": "lodash.escape@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-3.2.0.tgz"
+    "http-proxy-middleware": {
+      "version": "0.17.4",
+      "from": "http-proxy-middleware@>=0.17.4 <0.18.0",
+      "resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-0.17.4.tgz",
+      "dependencies": {
+        "is-extglob": {
+          "version": "2.1.1",
+          "from": "is-extglob@>=2.1.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz"
+        },
+        "is-glob": {
+          "version": "3.1.0",
+          "from": "is-glob@>=3.1.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz"
+        },
+        "lodash": {
+          "version": "4.17.4",
+          "from": "lodash@>=4.17.2 <5.0.0",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz"
+        }
+      }
     },
-    "lodash.filter": {
-      "version": "4.6.0",
-      "from": "lodash.filter@>=4.4.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.filter/-/lodash.filter-4.6.0.tgz"
+    "http-signature": {
+      "version": "1.1.1",
+      "from": "http-signature@>=1.1.0 <1.2.0",
+      "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz"
     },
-    "lodash.flatten": {
-      "version": "4.4.0",
-      "from": "lodash.flatten@>=4.2.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.flatten/-/lodash.flatten-4.4.0.tgz"
+    "https-browserify": {
+      "version": "0.0.0",
+      "from": "https-browserify@0.0.0",
+      "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.0.tgz"
     },
-    "lodash.foreach": {
-      "version": "4.5.0",
-      "from": "lodash.foreach@>=4.3.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.foreach/-/lodash.foreach-4.5.0.tgz"
+    "iconv-lite": {
+      "version": "0.4.15",
+      "from": "iconv-lite@0.4.15",
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.15.tgz"
     },
-    "lodash.get": {
-      "version": "4.4.2",
-      "from": "lodash.get@>=4.1.2 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz"
+    "icss-replace-symbols": {
+      "version": "1.1.0",
+      "from": "icss-replace-symbols@1.1.0",
+      "resolved": "https://registry.npmjs.org/icss-replace-symbols/-/icss-replace-symbols-1.1.0.tgz"
     },
-    "lodash.isarguments": {
-      "version": "3.1.0",
-      "from": "lodash.isarguments@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz"
+    "ieee754": {
+      "version": "1.1.8",
+      "from": "ieee754@>=1.1.4 <2.0.0",
+      "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.8.tgz"
     },
-    "lodash.isarray": {
-      "version": "3.0.4",
-      "from": "lodash.isarray@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz"
+    "immutability-helper": {
+      "version": "2.2.2",
+      "from": "immutability-helper@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.2.2.tgz"
     },
-    "lodash.isempty": {
-      "version": "4.4.0",
-      "from": "lodash.isempty@>=4.2.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.isempty/-/lodash.isempty-4.4.0.tgz"
+    "imurmurhash": {
+      "version": "0.1.4",
+      "from": "imurmurhash@>=0.1.4 <0.2.0",
+      "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz"
     },
-    "lodash.isequal": {
-      "version": "4.5.0",
-      "from": "lodash.isequal@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz"
+    "in-publish": {
+      "version": "2.0.0",
+      "from": "in-publish@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/in-publish/-/in-publish-2.0.0.tgz"
     },
-    "lodash.isobject": {
-      "version": "2.4.1",
-      "from": "lodash.isobject@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash.isobject/-/lodash.isobject-2.4.1.tgz"
+    "indent-string": {
+      "version": "2.1.0",
+      "from": "indent-string@>=2.1.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-2.1.0.tgz"
     },
-    "lodash.isplainobject": {
-      "version": "4.0.6",
-      "from": "lodash.isplainobject@>=4.0.4 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz"
+    "indexes-of": {
+      "version": "1.0.1",
+      "from": "indexes-of@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/indexes-of/-/indexes-of-1.0.1.tgz"
     },
-    "lodash.isstring": {
-      "version": "4.0.1",
-      "from": "lodash.isstring@>=4.0.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.isstring/-/lodash.isstring-4.0.1.tgz"
+    "indexof": {
+      "version": "0.0.1",
+      "from": "indexof@0.0.1",
+      "resolved": "https://registry.npmjs.org/indexof/-/indexof-0.0.1.tgz"
     },
-    "lodash.keys": {
-      "version": "3.1.2",
-      "from": "lodash.keys@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz"
+    "inflight": {
+      "version": "1.0.6",
+      "from": "inflight@>=1.0.4 <2.0.0",
+      "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz"
     },
-    "lodash.keysin": {
-      "version": "4.2.0",
-      "from": "lodash.keysin@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.keysin/-/lodash.keysin-4.2.0.tgz"
+    "inherits": {
+      "version": "2.0.3",
+      "from": "inherits@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz"
     },
-    "lodash.map": {
-      "version": "4.6.0",
-      "from": "lodash.map@>=4.4.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.map/-/lodash.map-4.6.0.tgz"
+    "ini": {
+      "version": "1.3.4",
+      "from": "ini@>=1.3.4 <2.0.0",
+      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.4.tgz"
     },
-    "lodash.mapvalues": {
-      "version": "4.6.0",
-      "from": "lodash.mapvalues@>=4.4.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.mapvalues/-/lodash.mapvalues-4.6.0.tgz"
+    "inpath": {
+      "version": "1.0.2",
+      "from": "inpath@>=1.0.2 <1.1.0",
+      "resolved": "https://registry.npmjs.org/inpath/-/inpath-1.0.2.tgz"
     },
-    "lodash.memoize": {
-      "version": "4.1.2",
-      "from": "lodash.memoize@>=4.1.2 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz"
+    "inquirer": {
+      "version": "0.10.1",
+      "from": "inquirer@>=0.10.0 <0.11.0",
+      "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-0.10.1.tgz",
+      "dependencies": {
+        "lodash": {
+          "version": "3.10.1",
+          "from": "lodash@>=3.3.1 <4.0.0",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz"
+        }
+      }
     },
-    "lodash.merge": {
-      "version": "4.6.0",
-      "from": "lodash.merge@>=4.4.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.0.tgz"
+    "interpret": {
+      "version": "1.0.3",
+      "from": "interpret@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.0.3.tgz"
     },
-    "lodash.mergewith": {
-      "version": "4.6.0",
-      "from": "lodash.mergewith@>=4.6.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.mergewith/-/lodash.mergewith-4.6.0.tgz"
+    "invariant": {
+      "version": "2.2.2",
+      "from": "invariant@>=2.2.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.2.tgz"
     },
-    "lodash.pick": {
-      "version": "4.4.0",
-      "from": "lodash.pick@>=4.2.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz"
+    "invert-kv": {
+      "version": "1.0.0",
+      "from": "invert-kv@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/invert-kv/-/invert-kv-1.0.0.tgz"
     },
-    "lodash.reduce": {
-      "version": "4.6.0",
-      "from": "lodash.reduce@>=4.4.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.reduce/-/lodash.reduce-4.6.0.tgz"
+    "ipaddr.js": {
+      "version": "1.3.0",
+      "from": "ipaddr.js@1.3.0",
+      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.3.0.tgz"
     },
-    "lodash.reject": {
-      "version": "4.6.0",
-      "from": "lodash.reject@>=4.4.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.reject/-/lodash.reject-4.6.0.tgz"
+    "irregular-plurals": {
+      "version": "1.2.0",
+      "from": "irregular-plurals@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/irregular-plurals/-/irregular-plurals-1.2.0.tgz"
     },
-    "lodash.rest": {
-      "version": "4.0.5",
-      "from": "lodash.rest@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.rest/-/lodash.rest-4.0.5.tgz"
+    "is": {
+      "version": "3.2.1",
+      "from": "is@>=3.1.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/is/-/is-3.2.1.tgz"
     },
-    "lodash.restparam": {
-      "version": "3.6.1",
-      "from": "lodash.restparam@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.restparam/-/lodash.restparam-3.6.1.tgz"
+    "is-absolute": {
+      "version": "0.2.6",
+      "from": "is-absolute@>=0.2.3 <0.3.0",
+      "resolved": "https://registry.npmjs.org/is-absolute/-/is-absolute-0.2.6.tgz"
     },
-    "lodash.some": {
-      "version": "4.6.0",
-      "from": "lodash.some@>=4.4.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.some/-/lodash.some-4.6.0.tgz"
+    "is-absolute-url": {
+      "version": "2.1.0",
+      "from": "is-absolute-url@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/is-absolute-url/-/is-absolute-url-2.1.0.tgz"
     },
-    "lodash.tail": {
-      "version": "4.1.1",
-      "from": "lodash.tail@>=4.1.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.tail/-/lodash.tail-4.1.1.tgz"
+    "is-arrayish": {
+      "version": "0.2.1",
+      "from": "is-arrayish@>=0.2.1 <0.3.0",
+      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz"
     },
-    "lodash.template": {
-      "version": "3.6.2",
-      "from": "lodash.template@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-3.6.2.tgz"
+    "is-binary-path": {
+      "version": "1.0.1",
+      "from": "is-binary-path@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-1.0.1.tgz"
     },
-    "lodash.templatesettings": {
-      "version": "3.1.1",
-      "from": "lodash.templatesettings@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-3.1.1.tgz"
+    "is-buffer": {
+      "version": "1.1.5",
+      "from": "is-buffer@>=1.1.5 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.5.tgz"
+    },
+    "is-builtin-module": {
+      "version": "1.0.0",
+      "from": "is-builtin-module@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-1.0.0.tgz"
     },
-    "lodash.uniq": {
-      "version": "4.5.0",
-      "from": "lodash.uniq@>=4.5.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz"
+    "is-callable": {
+      "version": "1.1.3",
+      "from": "is-callable@>=1.1.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.1.3.tgz"
     },
-    "lodash.values": {
-      "version": "2.4.1",
-      "from": "lodash.values@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash.values/-/lodash.values-2.4.1.tgz",
-      "dependencies": {
-        "lodash.keys": {
-          "version": "2.4.1",
-          "from": "lodash.keys@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
-        }
-      }
+    "is-date-object": {
+      "version": "1.0.1",
+      "from": "is-date-object@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.1.tgz"
     },
-    "lodash.words": {
-      "version": "3.2.0",
-      "from": "lodash.words@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.words/-/lodash.words-3.2.0.tgz"
+    "is-directory": {
+      "version": "0.3.1",
+      "from": "is-directory@>=0.3.1 <0.4.0",
+      "resolved": "https://registry.npmjs.org/is-directory/-/is-directory-0.3.1.tgz"
     },
-    "log-symbols": {
+    "is-dotfile": {
       "version": "1.0.2",
-      "from": "log-symbols@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-1.0.2.tgz"
+      "from": "is-dotfile@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-dotfile/-/is-dotfile-1.0.2.tgz"
     },
-    "log4js": {
-      "version": "0.6.38",
-      "from": "log4js@>=0.6.31 <0.7.0",
-      "resolved": "https://registry.npmjs.org/log4js/-/log4js-0.6.38.tgz",
-      "dependencies": {
-        "isarray": {
-          "version": "0.0.1",
-          "from": "isarray@0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
-        },
-        "readable-stream": {
-          "version": "1.0.34",
-          "from": "readable-stream@>=1.0.2 <1.1.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
-        },
-        "semver": {
-          "version": "4.3.6",
-          "from": "semver@>=4.3.3 <4.4.0",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz"
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.0 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
-        }
-      }
+    "is-equal-shallow": {
+      "version": "0.1.3",
+      "from": "is-equal-shallow@>=0.1.3 <0.2.0",
+      "resolved": "https://registry.npmjs.org/is-equal-shallow/-/is-equal-shallow-0.1.3.tgz"
     },
-    "lolex": {
-      "version": "1.4.0",
-      "from": "lolex@>=1.4.0 <1.5.0",
-      "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.4.0.tgz"
+    "is-extendable": {
+      "version": "0.1.1",
+      "from": "is-extendable@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz"
     },
-    "longest": {
-      "version": "1.0.1",
-      "from": "longest@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/longest/-/longest-1.0.1.tgz"
+    "is-extglob": {
+      "version": "1.0.0",
+      "from": "is-extglob@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz"
     },
-    "loose-envify": {
-      "version": "1.3.1",
-      "from": "loose-envify@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.3.1.tgz"
+    "is-finite": {
+      "version": "1.0.2",
+      "from": "is-finite@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-finite/-/is-finite-1.0.2.tgz"
     },
-    "loud-rejection": {
-      "version": "1.6.0",
-      "from": "loud-rejection@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/loud-rejection/-/loud-rejection-1.6.0.tgz"
+    "is-fullwidth-code-point": {
+      "version": "1.0.0",
+      "from": "is-fullwidth-code-point@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz"
     },
-    "lower-case": {
-      "version": "1.1.4",
-      "from": "lower-case@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-1.1.4.tgz"
+    "is-glob": {
+      "version": "2.0.1",
+      "from": "is-glob@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz"
     },
-    "lowercase-keys": {
+    "is-my-json-valid": {
+      "version": "2.16.0",
+      "from": "is-my-json-valid@>=2.12.4 <3.0.0",
+      "resolved": "https://registry.npmjs.org/is-my-json-valid/-/is-my-json-valid-2.16.0.tgz"
+    },
+    "is-npm": {
       "version": "1.0.0",
-      "from": "lowercase-keys@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.0.tgz"
+      "from": "is-npm@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-npm/-/is-npm-1.0.0.tgz"
     },
-    "lru-cache": {
-      "version": "2.7.3",
-      "from": "lru-cache@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.7.3.tgz"
+    "is-number": {
+      "version": "2.1.0",
+      "from": "is-number@>=2.1.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz"
     },
-    "macaddress": {
-      "version": "0.2.8",
-      "from": "macaddress@>=0.2.8 <0.3.0",
-      "resolved": "https://registry.npmjs.org/macaddress/-/macaddress-0.2.8.tgz"
+    "is-obj": {
+      "version": "1.0.1",
+      "from": "is-obj@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-1.0.1.tgz"
     },
-    "make-dir": {
+    "is-path-cwd": {
       "version": "1.0.0",
-      "from": "make-dir@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-1.0.0.tgz"
+      "from": "is-path-cwd@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-1.0.0.tgz"
     },
-    "map-cache": {
-      "version": "0.2.2",
-      "from": "map-cache@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz"
+    "is-path-in-cwd": {
+      "version": "1.0.0",
+      "from": "is-path-in-cwd@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-1.0.0.tgz"
     },
-    "map-obj": {
-      "version": "1.0.1",
-      "from": "map-obj@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/map-obj/-/map-obj-1.0.1.tgz"
+    "is-path-inside": {
+      "version": "1.0.0",
+      "from": "is-path-inside@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-1.0.0.tgz"
     },
-    "map-stream": {
-      "version": "0.0.7",
-      "from": "map-stream@>=0.0.3 <0.1.0",
-      "resolved": "https://registry.npmjs.org/map-stream/-/map-stream-0.0.7.tgz"
+    "is-plain-obj": {
+      "version": "1.1.0",
+      "from": "is-plain-obj@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-1.1.0.tgz"
     },
-    "marked": {
-      "version": "0.3.6",
-      "from": "marked@>=0.3.6 <0.4.0",
-      "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.6.tgz"
+    "is-plain-object": {
+      "version": "2.0.2",
+      "from": "is-plain-object@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.2.tgz",
+      "dependencies": {
+        "isobject": {
+          "version": "3.0.0",
+          "from": "isobject@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.0.tgz"
+        }
+      }
     },
-    "marked-terminal": {
-      "version": "1.7.0",
-      "from": "marked-terminal@>=1.6.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/marked-terminal/-/marked-terminal-1.7.0.tgz"
+    "is-posix-bracket": {
+      "version": "0.1.1",
+      "from": "is-posix-bracket@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz"
     },
-    "math-expression-evaluator": {
-      "version": "1.2.17",
-      "from": "math-expression-evaluator@>=1.2.14 <2.0.0",
-      "resolved": "https://registry.npmjs.org/math-expression-evaluator/-/math-expression-evaluator-1.2.17.tgz"
+    "is-primitive": {
+      "version": "2.0.0",
+      "from": "is-primitive@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/is-primitive/-/is-primitive-2.0.0.tgz"
     },
-    "md5": {
-      "version": "2.2.1",
-      "from": "md5@>=2.2.1 <2.3.0",
-      "resolved": "https://registry.npmjs.org/md5/-/md5-2.2.1.tgz"
+    "is-property": {
+      "version": "1.0.2",
+      "from": "is-property@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-property/-/is-property-1.0.2.tgz"
     },
-    "media-typer": {
-      "version": "0.3.0",
-      "from": "media-typer@0.3.0",
-      "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz"
+    "is-redirect": {
+      "version": "1.0.0",
+      "from": "is-redirect@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-redirect/-/is-redirect-1.0.0.tgz"
     },
-    "memory-fs": {
-      "version": "0.4.1",
-      "from": "memory-fs@>=0.4.1 <0.5.0",
-      "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.4.1.tgz"
+    "is-regex": {
+      "version": "1.0.4",
+      "from": "is-regex@>=1.0.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.0.4.tgz"
     },
-    "meow": {
-      "version": "3.7.0",
-      "from": "meow@>=3.3.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/meow/-/meow-3.7.0.tgz"
+    "is-regexp": {
+      "version": "1.0.0",
+      "from": "is-regexp@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-regexp/-/is-regexp-1.0.0.tgz"
     },
-    "merge-descriptors": {
-      "version": "1.0.1",
-      "from": "merge-descriptors@1.0.1",
-      "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.1.tgz"
+    "is-relative": {
+      "version": "0.2.1",
+      "from": "is-relative@>=0.2.1 <0.3.0",
+      "resolved": "https://registry.npmjs.org/is-relative/-/is-relative-0.2.1.tgz"
     },
-    "merge-stream": {
-      "version": "1.0.1",
-      "from": "merge-stream@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-1.0.1.tgz"
+    "is-retry-allowed": {
+      "version": "1.1.0",
+      "from": "is-retry-allowed@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-retry-allowed/-/is-retry-allowed-1.1.0.tgz"
     },
-    "merge2": {
-      "version": "1.0.3",
-      "from": "merge2@>=1.0.2 <1.1.0",
-      "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.0.3.tgz"
+    "is-stream": {
+      "version": "1.1.0",
+      "from": "is-stream@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz"
     },
-    "method-override": {
-      "version": "2.3.9",
-      "from": "method-override@>=2.3.5 <2.4.0",
-      "resolved": "https://registry.npmjs.org/method-override/-/method-override-2.3.9.tgz",
-      "dependencies": {
-        "debug": {
-          "version": "2.6.8",
-          "from": "debug@2.6.8",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz"
-        }
-      }
+    "is-subset": {
+      "version": "0.1.1",
+      "from": "is-subset@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/is-subset/-/is-subset-0.1.1.tgz"
     },
-    "methods": {
-      "version": "1.1.2",
-      "from": "methods@>=1.1.2 <1.2.0",
-      "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz"
+    "is-svg": {
+      "version": "2.1.0",
+      "from": "is-svg@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/is-svg/-/is-svg-2.1.0.tgz"
     },
-    "micromatch": {
-      "version": "2.3.11",
-      "from": "micromatch@>=2.3.7 <3.0.0",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz"
+    "is-symbol": {
+      "version": "1.0.1",
+      "from": "is-symbol@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.0.1.tgz"
     },
-    "miller-rabin": {
-      "version": "4.0.0",
-      "from": "miller-rabin@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/miller-rabin/-/miller-rabin-4.0.0.tgz"
+    "is-typedarray": {
+      "version": "1.0.0",
+      "from": "is-typedarray@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz"
     },
-    "mime": {
-      "version": "1.3.6",
-      "from": "mime@>=1.3.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.6.tgz"
+    "is-unc-path": {
+      "version": "0.1.2",
+      "from": "is-unc-path@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/is-unc-path/-/is-unc-path-0.1.2.tgz"
     },
-    "mime-db": {
-      "version": "1.27.0",
-      "from": "mime-db@>=1.27.0 <1.28.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.27.0.tgz"
+    "is-utf8": {
+      "version": "0.2.1",
+      "from": "is-utf8@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz"
     },
-    "mime-types": {
-      "version": "2.1.15",
-      "from": "mime-types@>=2.1.7 <2.2.0",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.15.tgz"
+    "is-valid-glob": {
+      "version": "0.3.0",
+      "from": "is-valid-glob@>=0.3.0 <0.4.0",
+      "resolved": "https://registry.npmjs.org/is-valid-glob/-/is-valid-glob-0.3.0.tgz"
     },
-    "minimalistic-assert": {
-      "version": "1.0.0",
-      "from": "minimalistic-assert@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.0.tgz"
+    "is-windows": {
+      "version": "0.2.0",
+      "from": "is-windows@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-0.2.0.tgz"
     },
-    "minimalistic-crypto-utils": {
-      "version": "1.0.1",
-      "from": "minimalistic-crypto-utils@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/minimalistic-crypto-utils/-/minimalistic-crypto-utils-1.0.1.tgz"
+    "isarray": {
+      "version": "0.0.1",
+      "from": "isarray@0.0.1",
+      "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
     },
-    "minimatch": {
-      "version": "3.0.4",
-      "from": "minimatch@>=3.0.4 <4.0.0",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz"
+    "isbinaryfile": {
+      "version": "3.0.2",
+      "from": "isbinaryfile@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/isbinaryfile/-/isbinaryfile-3.0.2.tgz"
     },
-    "minimist": {
-      "version": "1.2.0",
-      "from": "minimist@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz"
+    "isexe": {
+      "version": "2.0.0",
+      "from": "isexe@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz"
     },
-    "mixin-object": {
-      "version": "2.0.1",
-      "from": "mixin-object@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/mixin-object/-/mixin-object-2.0.1.tgz",
+    "isobject": {
+      "version": "2.1.0",
+      "from": "isobject@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
       "dependencies": {
-        "for-in": {
-          "version": "0.1.8",
-          "from": "for-in@>=0.1.3 <0.2.0",
-          "resolved": "https://registry.npmjs.org/for-in/-/for-in-0.1.8.tgz"
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@1.0.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         }
       }
     },
-    "mkdirp": {
-      "version": "0.5.1",
-      "from": "mkdirp@>=0.5.0 <0.6.0",
-      "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
+    "isomorphic-fetch": {
+      "version": "2.2.1",
+      "from": "isomorphic-fetch@>=2.1.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz",
       "dependencies": {
-        "minimist": {
-          "version": "0.0.8",
-          "from": "minimist@0.0.8",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz"
+        "whatwg-fetch": {
+          "version": "2.0.3",
+          "from": "whatwg-fetch@>=0.10.0",
+          "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-2.0.3.tgz"
         }
       }
     },
-    "mocha": {
-      "version": "3.3.0",
-      "from": "mocha@>=3.3.0 <3.4.0",
-      "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz",
+    "isstream": {
+      "version": "0.1.2",
+      "from": "isstream@>=0.1.2 <0.2.0",
+      "resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz"
+    },
+    "istanbul": {
+      "version": "0.4.5",
+      "from": "istanbul@>=0.0.0 <1.0.0",
+      "resolved": "https://registry.npmjs.org/istanbul/-/istanbul-0.4.5.tgz",
       "dependencies": {
-        "debug": {
-          "version": "2.6.0",
-          "from": "debug@2.6.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
-        },
-        "diff": {
-          "version": "3.2.0",
-          "from": "diff@3.2.0",
-          "resolved": "https://registry.npmjs.org/diff/-/diff-3.2.0.tgz"
+        "esprima": {
+          "version": "2.7.3",
+          "from": "esprima@>=2.7.0 <2.8.0",
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz"
         },
         "glob": {
-          "version": "7.1.1",
-          "from": "glob@7.1.1",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
+          "version": "5.0.15",
+          "from": "glob@>=5.0.15 <6.0.0",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
         },
-        "ms": {
-          "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+        "resolve": {
+          "version": "1.1.7",
+          "from": "resolve@>=1.1.0 <1.2.0",
+          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz"
         },
         "supports-color": {
-          "version": "3.1.2",
-          "from": "supports-color@3.1.2",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
+          "version": "3.2.3",
+          "from": "supports-color@>=3.1.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+        },
+        "wordwrap": {
+          "version": "1.0.0",
+          "from": "wordwrap@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz"
         }
       }
     },
-    "mocha-clean": {
-      "version": "0.4.0",
-      "from": "mocha-clean@>=0.4.0 <0.5.0",
-      "resolved": "https://registry.npmjs.org/mocha-clean/-/mocha-clean-0.4.0.tgz"
+    "istanbul-instrumenter-loader": {
+      "version": "0.2.0",
+      "from": "istanbul-instrumenter-loader@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/istanbul-instrumenter-loader/-/istanbul-instrumenter-loader-0.2.0.tgz"
+    },
+    "istextorbinary": {
+      "version": "1.0.2",
+      "from": "istextorbinary@1.0.2",
+      "resolved": "https://registry.npmjs.org/istextorbinary/-/istextorbinary-1.0.2.tgz"
+    },
+    "jade": {
+      "version": "0.26.3",
+      "from": "jade@0.26.3",
+      "resolved": "https://registry.npmjs.org/jade/-/jade-0.26.3.tgz",
+      "dependencies": {
+        "commander": {
+          "version": "0.6.1",
+          "from": "commander@0.6.1",
+          "resolved": "https://registry.npmjs.org/commander/-/commander-0.6.1.tgz"
+        },
+        "mkdirp": {
+          "version": "0.3.0",
+          "from": "mkdirp@0.3.0",
+          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.3.0.tgz"
+        }
+      }
+    },
+    "jju": {
+      "version": "1.3.0",
+      "from": "jju@>=1.3.0 <1.4.0",
+      "resolved": "https://registry.npmjs.org/jju/-/jju-1.3.0.tgz"
+    },
+    "jodid25519": {
+      "version": "1.0.2",
+      "from": "jodid25519@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/jodid25519/-/jodid25519-1.0.2.tgz",
+      "optional": true
+    },
+    "js-base64": {
+      "version": "2.1.9",
+      "from": "js-base64@>=2.1.9 <3.0.0",
+      "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.1.9.tgz"
+    },
+    "js-tokens": {
+      "version": "3.0.1",
+      "from": "js-tokens@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.1.tgz"
+    },
+    "js-yaml": {
+      "version": "3.8.4",
+      "from": "js-yaml@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.8.4.tgz"
+    },
+    "jsbn": {
+      "version": "0.1.1",
+      "from": "jsbn@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-0.1.1.tgz",
+      "optional": true
+    },
+    "jsesc": {
+      "version": "0.5.0",
+      "from": "jsesc@>=0.5.0 <0.6.0",
+      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz"
+    },
+    "json-loader": {
+      "version": "0.5.4",
+      "from": "json-loader@>=0.5.4 <0.6.0",
+      "resolved": "https://registry.npmjs.org/json-loader/-/json-loader-0.5.4.tgz"
+    },
+    "json-schema": {
+      "version": "0.2.3",
+      "from": "json-schema@0.2.3",
+      "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz"
+    },
+    "json-stable-stringify": {
+      "version": "1.0.1",
+      "from": "json-stable-stringify@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz"
+    },
+    "json-stringify-safe": {
+      "version": "5.0.1",
+      "from": "json-stringify-safe@>=5.0.1 <5.1.0",
+      "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz"
+    },
+    "json3": {
+      "version": "3.3.2",
+      "from": "json3@3.3.2",
+      "resolved": "https://registry.npmjs.org/json3/-/json3-3.3.2.tgz"
+    },
+    "json5": {
+      "version": "0.5.1",
+      "from": "json5@>=0.5.0 <0.6.0",
+      "resolved": "https://registry.npmjs.org/json5/-/json5-0.5.1.tgz"
+    },
+    "jsonfile": {
+      "version": "2.4.0",
+      "from": "jsonfile@>=2.1.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz"
+    },
+    "jsonify": {
+      "version": "0.0.0",
+      "from": "jsonify@>=0.0.0 <0.1.0",
+      "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz"
+    },
+    "jsonpointer": {
+      "version": "4.0.1",
+      "from": "jsonpointer@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/jsonpointer/-/jsonpointer-4.0.1.tgz"
     },
-    "mocha-loader": {
-      "version": "1.1.1",
-      "from": "mocha-loader@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/mocha-loader/-/mocha-loader-1.1.1.tgz",
+    "jsprim": {
+      "version": "1.4.0",
+      "from": "jsprim@>=1.2.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.0.tgz",
       "dependencies": {
-        "css-loader": {
-          "version": "0.23.1",
-          "from": "css-loader@>=0.23.1 <0.24.0",
-          "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.23.1.tgz",
-          "dependencies": {
-            "loader-utils": {
-              "version": "0.2.17",
-              "from": "loader-utils@~0.2.2",
-              "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz"
-            }
-          }
-        },
-        "css-selector-tokenizer": {
-          "version": "0.5.4",
-          "from": "css-selector-tokenizer@>=0.5.1 <0.6.0",
-          "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.5.4.tgz"
-        },
-        "loader-utils": {
-          "version": "1.1.0",
-          "from": "loader-utils@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
-        },
-        "lodash.camelcase": {
-          "version": "3.0.1",
-          "from": "lodash.camelcase@>=3.0.1 <4.0.0",
-          "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-3.0.1.tgz"
-        },
-        "style-loader": {
-          "version": "0.13.2",
-          "from": "style-loader@>=0.13.1 <0.14.0",
-          "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.13.2.tgz"
+        "assert-plus": {
+          "version": "1.0.0",
+          "from": "assert-plus@1.0.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz"
         }
       }
     },
-    "morgan": {
-      "version": "1.6.1",
-      "from": "morgan@>=1.6.1 <1.7.0",
-      "resolved": "https://registry.npmjs.org/morgan/-/morgan-1.6.1.tgz",
+    "jstransform": {
+      "version": "11.0.3",
+      "from": "jstransform@>=11.0.3 <12.0.0",
+      "resolved": "https://registry.npmjs.org/jstransform/-/jstransform-11.0.3.tgz",
       "dependencies": {
-        "debug": {
-          "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+        "esprima-fb": {
+          "version": "15001.1.0-dev-harmony-fb",
+          "from": "esprima-fb@>=15001.1.0-dev-harmony-fb <15002.0.0",
+          "resolved": "https://registry.npmjs.org/esprima-fb/-/esprima-fb-15001.1.0-dev-harmony-fb.tgz"
         },
-        "depd": {
-          "version": "1.0.1",
-          "from": "depd@>=1.0.1 <1.1.0",
-          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz"
+        "object-assign": {
+          "version": "2.1.1",
+          "from": "object-assign@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-2.1.1.tgz"
         },
-        "ms": {
-          "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+        "source-map": {
+          "version": "0.4.4",
+          "from": "source-map@>=0.4.2 <0.5.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz"
         }
       }
     },
-    "ms": {
-      "version": "2.0.0",
-      "from": "ms@2.0.0",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz"
+    "jszip": {
+      "version": "2.5.0",
+      "from": "jszip@2.5.0",
+      "resolved": "https://registry.npmjs.org/jszip/-/jszip-2.5.0.tgz"
     },
-    "multiparty": {
-      "version": "3.3.2",
-      "from": "multiparty@3.3.2",
-      "resolved": "https://registry.npmjs.org/multiparty/-/multiparty-3.3.2.tgz",
+    "karma": {
+      "version": "0.13.22",
+      "from": "karma@>=0.13.9 <0.14.0",
+      "resolved": "https://registry.npmjs.org/karma/-/karma-0.13.22.tgz",
       "dependencies": {
-        "isarray": {
-          "version": "0.0.1",
-          "from": "isarray@0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
-        },
-        "readable-stream": {
-          "version": "1.1.14",
-          "from": "readable-stream@>=1.1.9 <1.2.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz"
+        "bluebird": {
+          "version": "2.11.0",
+          "from": "bluebird@>=2.9.27 <3.0.0",
+          "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-2.11.0.tgz"
         },
-        "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.0 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
+        "lodash": {
+          "version": "3.10.1",
+          "from": "lodash@>=3.8.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz"
         }
       }
     },
-    "multipipe": {
-      "version": "0.1.2",
-      "from": "multipipe@>=0.1.2 <0.2.0",
-      "resolved": "https://registry.npmjs.org/multipipe/-/multipipe-0.1.2.tgz"
+    "karma-coverage": {
+      "version": "0.5.5",
+      "from": "karma-coverage@>=0.5.5 <0.6.0",
+      "resolved": "https://registry.npmjs.org/karma-coverage/-/karma-coverage-0.5.5.tgz",
+      "dependencies": {
+        "dateformat": {
+          "version": "1.0.12",
+          "from": "dateformat@>=1.0.6 <2.0.0",
+          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz"
+        }
+      }
     },
-    "mute-stream": {
-      "version": "0.0.7",
-      "from": "mute-stream@>=0.0.4 <0.1.0",
-      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.7.tgz"
+    "karma-mocha": {
+      "version": "0.2.2",
+      "from": "karma-mocha@>=0.2.2 <0.3.0",
+      "resolved": "https://registry.npmjs.org/karma-mocha/-/karma-mocha-0.2.2.tgz"
     },
-    "nan": {
-      "version": "2.6.2",
-      "from": "nan@>=2.3.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/nan/-/nan-2.6.2.tgz"
+    "karma-mocha-clean-reporter": {
+      "version": "0.0.1",
+      "from": "karma-mocha-clean-reporter@>=0.0.1 <0.1.0",
+      "resolved": "https://registry.npmjs.org/karma-mocha-clean-reporter/-/karma-mocha-clean-reporter-0.0.1.tgz"
     },
-    "native-promise-only": {
-      "version": "0.8.1",
-      "from": "native-promise-only@>=0.8.1 <0.9.0",
-      "resolved": "https://registry.npmjs.org/native-promise-only/-/native-promise-only-0.8.1.tgz"
+    "karma-phantomjs-launcher": {
+      "version": "1.0.4",
+      "from": "karma-phantomjs-launcher@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/karma-phantomjs-launcher/-/karma-phantomjs-launcher-1.0.4.tgz"
     },
-    "natives": {
-      "version": "1.1.0",
-      "from": "natives@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/natives/-/natives-1.1.0.tgz"
+    "karma-sinon-chai": {
+      "version": "1.3.1",
+      "from": "karma-sinon-chai@1.3.1",
+      "resolved": "https://registry.npmjs.org/karma-sinon-chai/-/karma-sinon-chai-1.3.1.tgz",
+      "dependencies": {
+        "lolex": {
+          "version": "1.6.0",
+          "from": "lolex@>=1.6.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz"
+        }
+      }
     },
-    "ncname": {
-      "version": "1.0.0",
-      "from": "ncname@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/ncname/-/ncname-1.0.0.tgz"
+    "karma-webpack": {
+      "version": "2.0.3",
+      "from": "karma-webpack@>=2.0.1 <2.1.0",
+      "resolved": "https://registry.npmjs.org/karma-webpack/-/karma-webpack-2.0.3.tgz",
+      "dependencies": {
+        "async": {
+          "version": "0.9.2",
+          "from": "async@>=0.9.0 <0.10.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+        },
+        "lodash": {
+          "version": "3.10.1",
+          "from": "lodash@>=3.8.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz"
+        },
+        "source-map": {
+          "version": "0.1.43",
+          "from": "source-map@>=0.1.41 <0.2.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
+        }
+      }
     },
-    "negotiator": {
-      "version": "0.6.1",
-      "from": "negotiator@0.6.1",
-      "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.1.tgz"
+    "kew": {
+      "version": "0.7.0",
+      "from": "kew@>=0.7.0 <0.8.0",
+      "resolved": "https://registry.npmjs.org/kew/-/kew-0.7.0.tgz"
     },
-    "no-case": {
-      "version": "2.3.1",
-      "from": "no-case@>=2.2.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/no-case/-/no-case-2.3.1.tgz"
+    "kind-of": {
+      "version": "3.2.2",
+      "from": "kind-of@>=3.0.2 <4.0.0",
+      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz"
     },
-    "node-emoji": {
-      "version": "1.5.1",
-      "from": "node-emoji@>=1.4.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/node-emoji/-/node-emoji-1.5.1.tgz"
+    "klaw": {
+      "version": "1.3.1",
+      "from": "klaw@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/klaw/-/klaw-1.3.1.tgz"
     },
-    "node-fetch": {
-      "version": "1.7.0",
-      "from": "node-fetch@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.0.tgz"
+    "latest-version": {
+      "version": "2.0.0",
+      "from": "latest-version@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-2.0.0.tgz"
     },
-    "node-forge": {
-      "version": "0.7.1",
-      "from": "node-forge@>=0.7.1 <0.8.0",
-      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.7.1.tgz"
+    "lazy-cache": {
+      "version": "1.0.4",
+      "from": "lazy-cache@>=1.0.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-1.0.4.tgz"
     },
-    "node-gyp": {
-      "version": "3.6.1",
-      "from": "node-gyp@>=3.3.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-3.6.1.tgz"
+    "lazy-req": {
+      "version": "1.1.0",
+      "from": "lazy-req@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/lazy-req/-/lazy-req-1.1.0.tgz"
     },
-    "node-libs-browser": {
-      "version": "0.6.0",
-      "from": "node-libs-browser@>=0.6.0 <0.7.0",
-      "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-0.6.0.tgz",
+    "lazystream": {
+      "version": "1.0.0",
+      "from": "lazystream@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/lazystream/-/lazystream-1.0.0.tgz",
       "dependencies": {
         "isarray": {
-          "version": "0.0.1",
-          "from": "isarray@0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
-          "version": "1.1.14",
-          "from": "readable-stream@>=1.1.13 <2.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz"
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.5 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.25 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
-    "node-notifier": {
-      "version": "5.0.2",
-      "from": "node-notifier@>=5.0.2 <5.1.0",
-      "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-5.0.2.tgz"
+    "lcid": {
+      "version": "1.0.0",
+      "from": "lcid@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/lcid/-/lcid-1.0.0.tgz"
     },
-    "node-sass": {
-      "version": "4.5.3",
-      "from": "node-sass@>=4.2.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.5.3.tgz",
+    "levn": {
+      "version": "0.3.0",
+      "from": "levn@>=0.3.0 <0.4.0",
+      "resolved": "https://registry.npmjs.org/levn/-/levn-0.3.0.tgz"
+    },
+    "liftoff": {
+      "version": "2.3.0",
+      "from": "liftoff@>=2.1.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/liftoff/-/liftoff-2.3.0.tgz"
+    },
+    "livereload-js": {
+      "version": "2.2.2",
+      "from": "livereload-js@>=2.2.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/livereload-js/-/livereload-js-2.2.2.tgz"
+    },
+    "load-json-file": {
+      "version": "1.1.0",
+      "from": "load-json-file@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
       "dependencies": {
-        "gaze": {
-          "version": "1.1.2",
-          "from": "gaze@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz"
-        },
-        "globule": {
-          "version": "1.1.0",
-          "from": "globule@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/globule/-/globule-1.1.0.tgz"
-        },
-        "lodash": {
-          "version": "4.16.6",
-          "from": "lodash@>=4.16.4 <4.17.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.16.6.tgz"
+        "strip-bom": {
+          "version": "2.0.0",
+          "from": "strip-bom@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz"
         }
       }
     },
-    "node-status-codes": {
-      "version": "1.0.0",
-      "from": "node-status-codes@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/node-status-codes/-/node-status-codes-1.0.0.tgz"
+    "load-themed-styles": {
+      "version": "1.2.0",
+      "from": "load-themed-styles@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/load-themed-styles/-/load-themed-styles-1.2.0.tgz"
     },
-    "node-uuid": {
-      "version": "1.4.8",
-      "from": "node-uuid@>=1.4.7 <1.5.0",
-      "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz"
+    "load-themed-styles-loader": {
+      "version": "0.0.3",
+      "from": "load-themed-styles-loader@>=0.0.3 <0.0.4",
+      "resolved": "https://registry.npmjs.org/load-themed-styles-loader/-/load-themed-styles-loader-0.0.3.tgz"
     },
-    "node-zip": {
-      "version": "1.1.1",
-      "from": "node-zip@>=1.1.1 <1.2.0",
-      "resolved": "https://registry.npmjs.org/node-zip/-/node-zip-1.1.1.tgz"
+    "loader-runner": {
+      "version": "2.3.0",
+      "from": "loader-runner@>=2.3.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/loader-runner/-/loader-runner-2.3.0.tgz"
     },
-    "node.extend": {
-      "version": "1.1.6",
-      "from": "node.extend@>=1.0.10 <2.0.0",
-      "resolved": "https://registry.npmjs.org/node.extend/-/node.extend-1.1.6.tgz"
+    "loader-utils": {
+      "version": "0.2.17",
+      "from": "loader-utils@>=0.0.0 <1.0.0",
+      "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz"
     },
-    "nopt": {
-      "version": "3.0.6",
-      "from": "nopt@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/nopt/-/nopt-3.0.6.tgz"
+    "lodash": {
+      "version": "4.15.0",
+      "from": "lodash@>=4.15.0 <4.16.0",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.15.0.tgz"
     },
-    "normalize-package-data": {
-      "version": "2.3.8",
-      "from": "normalize-package-data@>=2.3.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.3.8.tgz"
+    "lodash._arraycopy": {
+      "version": "3.0.0",
+      "from": "lodash._arraycopy@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._arraycopy/-/lodash._arraycopy-3.0.0.tgz"
     },
-    "normalize-path": {
-      "version": "2.1.1",
-      "from": "normalize-path@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-2.1.1.tgz"
+    "lodash._arrayeach": {
+      "version": "3.0.0",
+      "from": "lodash._arrayeach@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._arrayeach/-/lodash._arrayeach-3.0.0.tgz"
     },
-    "normalize-range": {
-      "version": "0.1.2",
-      "from": "normalize-range@>=0.1.2 <0.2.0",
-      "resolved": "https://registry.npmjs.org/normalize-range/-/normalize-range-0.1.2.tgz"
+    "lodash._baseassign": {
+      "version": "3.2.0",
+      "from": "lodash._baseassign@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._baseassign/-/lodash._baseassign-3.2.0.tgz"
     },
-    "normalize-url": {
-      "version": "1.9.1",
-      "from": "normalize-url@>=1.4.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/normalize-url/-/normalize-url-1.9.1.tgz"
+    "lodash._baseclone": {
+      "version": "4.5.7",
+      "from": "lodash._baseclone@>=4.5.0 <4.6.0",
+      "resolved": "https://registry.npmjs.org/lodash._baseclone/-/lodash._baseclone-4.5.7.tgz"
     },
-    "npm-run-path": {
-      "version": "1.0.0",
-      "from": "npm-run-path@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-1.0.0.tgz"
+    "lodash._basecopy": {
+      "version": "3.0.1",
+      "from": "lodash._basecopy@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz"
     },
-    "npmlog": {
-      "version": "4.1.0",
-      "from": "npmlog@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.0.tgz"
+    "lodash._basecreate": {
+      "version": "3.0.3",
+      "from": "lodash._basecreate@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._basecreate/-/lodash._basecreate-3.0.3.tgz"
     },
-    "nth-check": {
-      "version": "1.0.1",
-      "from": "nth-check@>=1.0.1 <1.1.0",
-      "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-1.0.1.tgz"
+    "lodash._basefor": {
+      "version": "3.0.3",
+      "from": "lodash._basefor@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._basefor/-/lodash._basefor-3.0.3.tgz"
     },
-    "num2fraction": {
-      "version": "1.2.2",
-      "from": "num2fraction@>=1.2.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/num2fraction/-/num2fraction-1.2.2.tgz"
+    "lodash._basetostring": {
+      "version": "3.0.1",
+      "from": "lodash._basetostring@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._basetostring/-/lodash._basetostring-3.0.1.tgz"
     },
-    "number-is-nan": {
-      "version": "1.0.1",
-      "from": "number-is-nan@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz"
+    "lodash._basevalues": {
+      "version": "3.0.0",
+      "from": "lodash._basevalues@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._basevalues/-/lodash._basevalues-3.0.0.tgz"
     },
-    "oauth-sign": {
-      "version": "0.8.2",
-      "from": "oauth-sign@>=0.8.1 <0.9.0",
-      "resolved": "https://registry.npmjs.org/oauth-sign/-/oauth-sign-0.8.2.tgz"
+    "lodash._bindcallback": {
+      "version": "3.0.1",
+      "from": "lodash._bindcallback@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._bindcallback/-/lodash._bindcallback-3.0.1.tgz"
     },
-    "object-assign": {
-      "version": "4.1.1",
-      "from": "object-assign@>=4.1.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz"
+    "lodash._createcompounder": {
+      "version": "3.0.0",
+      "from": "lodash._createcompounder@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._createcompounder/-/lodash._createcompounder-3.0.0.tgz"
     },
-    "object-component": {
-      "version": "0.0.3",
-      "from": "object-component@0.0.3",
-      "resolved": "https://registry.npmjs.org/object-component/-/object-component-0.0.3.tgz"
+    "lodash._escapehtmlchar": {
+      "version": "2.4.1",
+      "from": "lodash._escapehtmlchar@>=2.4.1 <2.5.0",
+      "resolved": "https://registry.npmjs.org/lodash._escapehtmlchar/-/lodash._escapehtmlchar-2.4.1.tgz"
     },
-    "object-is": {
-      "version": "1.0.1",
-      "from": "object-is@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.0.1.tgz"
+    "lodash._escapestringchar": {
+      "version": "2.4.1",
+      "from": "lodash._escapestringchar@>=2.4.1 <2.5.0",
+      "resolved": "https://registry.npmjs.org/lodash._escapestringchar/-/lodash._escapestringchar-2.4.1.tgz"
     },
-    "object-keys": {
-      "version": "1.0.11",
-      "from": "object-keys@>=1.0.8 <2.0.0",
-      "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.0.11.tgz"
+    "lodash._getnative": {
+      "version": "3.9.1",
+      "from": "lodash._getnative@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._getnative/-/lodash._getnative-3.9.1.tgz"
     },
-    "object.assign": {
-      "version": "4.0.4",
-      "from": "object.assign@>=4.0.4 <5.0.0",
-      "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.0.4.tgz"
+    "lodash._htmlescapes": {
+      "version": "2.4.1",
+      "from": "lodash._htmlescapes@>=2.4.1 <2.5.0",
+      "resolved": "https://registry.npmjs.org/lodash._htmlescapes/-/lodash._htmlescapes-2.4.1.tgz"
     },
-    "object.entries": {
-      "version": "1.0.4",
-      "from": "object.entries@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/object.entries/-/object.entries-1.0.4.tgz"
+    "lodash._isiterateecall": {
+      "version": "3.0.9",
+      "from": "lodash._isiterateecall@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._isiterateecall/-/lodash._isiterateecall-3.0.9.tgz"
     },
-    "object.omit": {
-      "version": "2.0.1",
-      "from": "object.omit@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/object.omit/-/object.omit-2.0.1.tgz"
+    "lodash._isnative": {
+      "version": "2.4.1",
+      "from": "lodash._isnative@>=2.4.1 <2.5.0",
+      "resolved": "https://registry.npmjs.org/lodash._isnative/-/lodash._isnative-2.4.1.tgz"
     },
-    "object.pick": {
-      "version": "1.2.0",
-      "from": "object.pick@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/object.pick/-/object.pick-1.2.0.tgz"
+    "lodash._objecttypes": {
+      "version": "2.4.1",
+      "from": "lodash._objecttypes@>=2.4.1 <2.5.0",
+      "resolved": "https://registry.npmjs.org/lodash._objecttypes/-/lodash._objecttypes-2.4.1.tgz"
     },
-    "object.values": {
-      "version": "1.0.4",
-      "from": "object.values@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.0.4.tgz"
+    "lodash._reescape": {
+      "version": "3.0.0",
+      "from": "lodash._reescape@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._reescape/-/lodash._reescape-3.0.0.tgz"
     },
-    "obuf": {
-      "version": "1.1.1",
-      "from": "obuf@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/obuf/-/obuf-1.1.1.tgz"
+    "lodash._reevaluate": {
+      "version": "3.0.0",
+      "from": "lodash._reevaluate@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._reevaluate/-/lodash._reevaluate-3.0.0.tgz"
     },
-    "office-ui-fabric-core": {
-      "version": "7.0.0",
-      "from": "office-ui-fabric-core@>=7.0.0 <8.0.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-7.0.0.tgz"
+    "lodash._reinterpolate": {
+      "version": "3.0.0",
+      "from": "lodash._reinterpolate@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz"
     },
-    "office-ui-fabric-react": {
-      "version": "2.34.2",
-      "from": "office-ui-fabric-react@>=2.11.0-0 <3.0.0-0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-2.34.2.tgz"
+    "lodash._reunescapedhtml": {
+      "version": "2.4.1",
+      "from": "lodash._reunescapedhtml@>=2.4.1 <2.5.0",
+      "resolved": "https://registry.npmjs.org/lodash._reunescapedhtml/-/lodash._reunescapedhtml-2.4.1.tgz",
+      "dependencies": {
+        "lodash.keys": {
+          "version": "2.4.1",
+          "from": "lodash.keys@>=2.4.1 <2.5.0",
+          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
+        }
+      }
+    },
+    "lodash._root": {
+      "version": "3.0.1",
+      "from": "lodash._root@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._root/-/lodash._root-3.0.1.tgz"
+    },
+    "lodash._shimkeys": {
+      "version": "2.4.1",
+      "from": "lodash._shimkeys@>=2.4.1 <2.5.0",
+      "resolved": "https://registry.npmjs.org/lodash._shimkeys/-/lodash._shimkeys-2.4.1.tgz"
+    },
+    "lodash._stack": {
+      "version": "4.1.3",
+      "from": "lodash._stack@>=4.1.0 <4.2.0",
+      "resolved": "https://registry.npmjs.org/lodash._stack/-/lodash._stack-4.1.3.tgz"
+    },
+    "lodash.assign": {
+      "version": "4.2.0",
+      "from": "lodash.assign@>=4.0.3 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.assign/-/lodash.assign-4.2.0.tgz"
+    },
+    "lodash.assignin": {
+      "version": "4.2.0",
+      "from": "lodash.assignin@>=4.0.9 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.assignin/-/lodash.assignin-4.2.0.tgz"
     },
-    "on-finished": {
-      "version": "2.3.0",
-      "from": "on-finished@>=2.3.0 <2.4.0",
-      "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz"
+    "lodash.assignwith": {
+      "version": "4.2.0",
+      "from": "lodash.assignwith@>=4.0.7 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.assignwith/-/lodash.assignwith-4.2.0.tgz"
     },
-    "on-headers": {
-      "version": "1.0.1",
-      "from": "on-headers@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/on-headers/-/on-headers-1.0.1.tgz"
+    "lodash.bind": {
+      "version": "4.2.1",
+      "from": "lodash.bind@>=4.1.4 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.bind/-/lodash.bind-4.2.1.tgz"
     },
-    "once": {
-      "version": "1.4.0",
-      "from": "once@>=1.3.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz"
+    "lodash.camelcase": {
+      "version": "3.0.1",
+      "from": "lodash.camelcase@>=3.0.1 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-3.0.1.tgz"
     },
-    "onetime": {
-      "version": "1.1.0",
-      "from": "onetime@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/onetime/-/onetime-1.1.0.tgz"
+    "lodash.clone": {
+      "version": "4.5.0",
+      "from": "lodash.clone@>=4.3.2 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.clone/-/lodash.clone-4.5.0.tgz"
     },
-    "open": {
-      "version": "0.0.5",
-      "from": "open@0.0.5",
-      "resolved": "https://registry.npmjs.org/open/-/open-0.0.5.tgz"
+    "lodash.clonedeep": {
+      "version": "4.5.0",
+      "from": "lodash.clonedeep@>=4.3.2 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz"
     },
-    "opener": {
-      "version": "1.4.3",
-      "from": "opener@>=1.4.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/opener/-/opener-1.4.3.tgz"
+    "lodash.create": {
+      "version": "3.1.1",
+      "from": "lodash.create@3.1.1",
+      "resolved": "https://registry.npmjs.org/lodash.create/-/lodash.create-3.1.1.tgz"
     },
-    "opn": {
-      "version": "4.0.2",
-      "from": "opn@4.0.2",
-      "resolved": "https://registry.npmjs.org/opn/-/opn-4.0.2.tgz"
+    "lodash.deburr": {
+      "version": "3.2.0",
+      "from": "lodash.deburr@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.deburr/-/lodash.deburr-3.2.0.tgz"
     },
-    "optimist": {
-      "version": "0.6.1",
-      "from": "optimist@>=0.6.0 <0.7.0",
-      "resolved": "https://registry.npmjs.org/optimist/-/optimist-0.6.1.tgz",
+    "lodash.defaults": {
+      "version": "2.4.1",
+      "from": "lodash.defaults@>=2.4.1 <2.5.0",
+      "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-2.4.1.tgz",
       "dependencies": {
-        "minimist": {
-          "version": "0.0.10",
-          "from": "minimist@>=0.0.1 <0.1.0",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.10.tgz"
+        "lodash.keys": {
+          "version": "2.4.1",
+          "from": "lodash.keys@>=2.4.1 <2.5.0",
+          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
         }
       }
     },
-    "optionator": {
-      "version": "0.8.2",
-      "from": "optionator@>=0.8.1 <0.9.0",
-      "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.8.2.tgz",
-      "dependencies": {
-        "wordwrap": {
-          "version": "1.0.0",
-          "from": "wordwrap@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz"
-        }
-      }
+    "lodash.escape": {
+      "version": "3.2.0",
+      "from": "lodash.escape@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-3.2.0.tgz"
     },
-    "options": {
-      "version": "0.0.6",
-      "from": "options@>=0.0.5",
-      "resolved": "https://registry.npmjs.org/options/-/options-0.0.6.tgz"
+    "lodash.filter": {
+      "version": "4.6.0",
+      "from": "lodash.filter@>=4.4.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.filter/-/lodash.filter-4.6.0.tgz"
     },
-    "orchestrator": {
-      "version": "0.3.8",
-      "from": "orchestrator@>=0.3.0 <0.4.0",
-      "resolved": "https://registry.npmjs.org/orchestrator/-/orchestrator-0.3.8.tgz",
-      "dependencies": {
-        "end-of-stream": {
-          "version": "0.1.5",
-          "from": "end-of-stream@>=0.1.5 <0.2.0",
-          "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-0.1.5.tgz"
-        },
-        "once": {
-          "version": "1.3.3",
-          "from": "once@>=1.3.0 <1.4.0",
-          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz"
-        }
-      }
+    "lodash.flatten": {
+      "version": "4.4.0",
+      "from": "lodash.flatten@>=4.2.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.flatten/-/lodash.flatten-4.4.0.tgz"
     },
-    "ordered-read-streams": {
-      "version": "0.1.0",
-      "from": "ordered-read-streams@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.1.0.tgz"
+    "lodash.foreach": {
+      "version": "4.5.0",
+      "from": "lodash.foreach@>=4.3.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.foreach/-/lodash.foreach-4.5.0.tgz"
     },
-    "original": {
-      "version": "1.0.0",
-      "from": "original@>=0.0.5",
-      "resolved": "https://registry.npmjs.org/original/-/original-1.0.0.tgz",
-      "dependencies": {
-        "url-parse": {
-          "version": "1.0.5",
-          "from": "url-parse@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.0.5.tgz"
-        }
-      }
+    "lodash.get": {
+      "version": "4.4.2",
+      "from": "lodash.get@>=4.1.2 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz"
     },
-    "os-browserify": {
-      "version": "0.1.2",
-      "from": "os-browserify@>=0.1.2 <0.2.0",
-      "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.1.2.tgz"
+    "lodash.isarguments": {
+      "version": "3.1.0",
+      "from": "lodash.isarguments@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz"
     },
-    "os-homedir": {
-      "version": "1.0.2",
-      "from": "os-homedir@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz"
+    "lodash.isarray": {
+      "version": "3.0.4",
+      "from": "lodash.isarray@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz"
     },
-    "os-locale": {
-      "version": "1.4.0",
-      "from": "os-locale@>=1.4.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz"
+    "lodash.isempty": {
+      "version": "4.4.0",
+      "from": "lodash.isempty@>=4.2.1 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.isempty/-/lodash.isempty-4.4.0.tgz"
     },
-    "os-tmpdir": {
-      "version": "1.0.2",
-      "from": "os-tmpdir@>=1.0.1 <1.1.0",
-      "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz"
+    "lodash.isequal": {
+      "version": "4.5.0",
+      "from": "lodash.isequal@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz"
     },
-    "osenv": {
-      "version": "0.1.4",
-      "from": "osenv@>=0.0.0 <1.0.0",
-      "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.4.tgz"
+    "lodash.isobject": {
+      "version": "2.4.1",
+      "from": "lodash.isobject@>=2.4.1 <2.5.0",
+      "resolved": "https://registry.npmjs.org/lodash.isobject/-/lodash.isobject-2.4.1.tgz"
     },
-    "package-json": {
+    "lodash.isplainobject": {
+      "version": "4.0.6",
+      "from": "lodash.isplainobject@>=4.0.4 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz"
+    },
+    "lodash.isstring": {
       "version": "4.0.1",
-      "from": "package-json@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/package-json/-/package-json-4.0.1.tgz"
+      "from": "lodash.isstring@>=4.0.1 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.isstring/-/lodash.isstring-4.0.1.tgz"
     },
-    "pako": {
-      "version": "0.2.9",
-      "from": "pako@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/pako/-/pako-0.2.9.tgz"
+    "lodash.keys": {
+      "version": "3.1.2",
+      "from": "lodash.keys@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz"
     },
-    "parallel-transform": {
-      "version": "1.1.0",
-      "from": "parallel-transform@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/parallel-transform/-/parallel-transform-1.1.0.tgz"
+    "lodash.keysin": {
+      "version": "4.2.0",
+      "from": "lodash.keysin@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.keysin/-/lodash.keysin-4.2.0.tgz"
     },
-    "param-case": {
-      "version": "2.1.1",
-      "from": "param-case@>=2.1.0 <2.2.0",
-      "resolved": "https://registry.npmjs.org/param-case/-/param-case-2.1.1.tgz"
+    "lodash.map": {
+      "version": "4.6.0",
+      "from": "lodash.map@>=4.4.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.map/-/lodash.map-4.6.0.tgz"
     },
-    "parse-asn1": {
-      "version": "5.1.0",
-      "from": "parse-asn1@>=5.0.0 <6.0.0",
-      "resolved": "https://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.0.tgz"
+    "lodash.mapvalues": {
+      "version": "4.6.0",
+      "from": "lodash.mapvalues@>=4.4.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.mapvalues/-/lodash.mapvalues-4.6.0.tgz"
     },
-    "parse-filepath": {
-      "version": "1.0.1",
-      "from": "parse-filepath@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/parse-filepath/-/parse-filepath-1.0.1.tgz"
+    "lodash.memoize": {
+      "version": "4.1.2",
+      "from": "lodash.memoize@>=4.1.2 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz"
     },
-    "parse-glob": {
-      "version": "3.0.4",
-      "from": "parse-glob@>=3.0.4 <4.0.0",
-      "resolved": "https://registry.npmjs.org/parse-glob/-/parse-glob-3.0.4.tgz"
+    "lodash.merge": {
+      "version": "4.3.5",
+      "from": "lodash.merge@>=4.3.2 <4.4.0",
+      "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.3.5.tgz"
     },
-    "parse-json": {
-      "version": "2.2.0",
-      "from": "parse-json@>=2.2.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz"
+    "lodash.mergewith": {
+      "version": "4.6.0",
+      "from": "lodash.mergewith@>=4.6.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.mergewith/-/lodash.mergewith-4.6.0.tgz"
     },
-    "parse-passwd": {
-      "version": "1.0.0",
-      "from": "parse-passwd@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/parse-passwd/-/parse-passwd-1.0.0.tgz"
+    "lodash.pick": {
+      "version": "4.4.0",
+      "from": "lodash.pick@>=4.2.1 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz"
+    },
+    "lodash.reduce": {
+      "version": "4.6.0",
+      "from": "lodash.reduce@>=4.4.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.reduce/-/lodash.reduce-4.6.0.tgz"
+    },
+    "lodash.reject": {
+      "version": "4.6.0",
+      "from": "lodash.reject@>=4.4.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.reject/-/lodash.reject-4.6.0.tgz"
+    },
+    "lodash.rest": {
+      "version": "4.0.5",
+      "from": "lodash.rest@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.rest/-/lodash.rest-4.0.5.tgz"
     },
-    "parsejson": {
-      "version": "0.0.3",
-      "from": "parsejson@0.0.3",
-      "resolved": "https://registry.npmjs.org/parsejson/-/parsejson-0.0.3.tgz"
+    "lodash.restparam": {
+      "version": "3.6.1",
+      "from": "lodash.restparam@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.restparam/-/lodash.restparam-3.6.1.tgz"
     },
-    "parseqs": {
-      "version": "0.0.5",
-      "from": "parseqs@0.0.5",
-      "resolved": "https://registry.npmjs.org/parseqs/-/parseqs-0.0.5.tgz"
+    "lodash.some": {
+      "version": "4.6.0",
+      "from": "lodash.some@>=4.2.2 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.some/-/lodash.some-4.6.0.tgz"
     },
-    "parseuri": {
-      "version": "0.0.5",
-      "from": "parseuri@0.0.5",
-      "resolved": "https://registry.npmjs.org/parseuri/-/parseuri-0.0.5.tgz"
+    "lodash.tail": {
+      "version": "4.1.1",
+      "from": "lodash.tail@>=4.1.1 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.tail/-/lodash.tail-4.1.1.tgz"
     },
-    "parseurl": {
-      "version": "1.3.1",
-      "from": "parseurl@>=1.3.1 <1.4.0",
-      "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.1.tgz"
+    "lodash.template": {
+      "version": "3.6.2",
+      "from": "lodash.template@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-3.6.2.tgz"
     },
-    "path-browserify": {
-      "version": "0.0.0",
-      "from": "path-browserify@0.0.0",
-      "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-0.0.0.tgz"
+    "lodash.templatesettings": {
+      "version": "3.1.1",
+      "from": "lodash.templatesettings@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-3.1.1.tgz"
     },
-    "path-dirname": {
-      "version": "1.0.2",
-      "from": "path-dirname@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/path-dirname/-/path-dirname-1.0.2.tgz"
+    "lodash.uniq": {
+      "version": "4.5.0",
+      "from": "lodash.uniq@>=4.5.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz"
     },
-    "path-exists": {
-      "version": "2.1.0",
-      "from": "path-exists@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz"
+    "lodash.values": {
+      "version": "2.4.1",
+      "from": "lodash.values@>=2.4.1 <2.5.0",
+      "resolved": "https://registry.npmjs.org/lodash.values/-/lodash.values-2.4.1.tgz",
+      "dependencies": {
+        "lodash.keys": {
+          "version": "2.4.1",
+          "from": "lodash.keys@>=2.4.1 <2.5.0",
+          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
+        }
+      }
     },
-    "path-is-absolute": {
-      "version": "1.0.1",
-      "from": "path-is-absolute@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz"
+    "lodash.words": {
+      "version": "3.2.0",
+      "from": "lodash.words@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.words/-/lodash.words-3.2.0.tgz"
     },
-    "path-is-inside": {
+    "log-symbols": {
       "version": "1.0.2",
-      "from": "path-is-inside@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/path-is-inside/-/path-is-inside-1.0.2.tgz"
+      "from": "log-symbols@>=1.0.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-1.0.2.tgz"
     },
-    "path-key": {
-      "version": "1.0.0",
-      "from": "path-key@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/path-key/-/path-key-1.0.0.tgz"
+    "log4js": {
+      "version": "0.6.38",
+      "from": "log4js@>=0.6.31 <0.7.0",
+      "resolved": "https://registry.npmjs.org/log4js/-/log4js-0.6.38.tgz",
+      "dependencies": {
+        "readable-stream": {
+          "version": "1.0.34",
+          "from": "readable-stream@>=1.0.2 <1.1.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
+        },
+        "semver": {
+          "version": "4.3.6",
+          "from": "semver@>=4.3.3 <4.4.0",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz"
+        }
+      }
     },
-    "path-parse": {
-      "version": "1.0.5",
-      "from": "path-parse@>=1.0.5 <2.0.0",
-      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.5.tgz"
+    "lolex": {
+      "version": "1.4.0",
+      "from": "lolex@>=1.4.0 <1.5.0",
+      "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.4.0.tgz"
     },
-    "path-root": {
-      "version": "0.1.1",
-      "from": "path-root@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/path-root/-/path-root-0.1.1.tgz"
+    "longest": {
+      "version": "1.0.1",
+      "from": "longest@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/longest/-/longest-1.0.1.tgz"
     },
-    "path-root-regex": {
-      "version": "0.1.2",
-      "from": "path-root-regex@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/path-root-regex/-/path-root-regex-0.1.2.tgz"
+    "loose-envify": {
+      "version": "1.3.1",
+      "from": "loose-envify@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.3.1.tgz"
     },
-    "path-to-regexp": {
-      "version": "0.1.7",
-      "from": "path-to-regexp@0.1.7",
-      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz"
+    "loud-rejection": {
+      "version": "1.6.0",
+      "from": "loud-rejection@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/loud-rejection/-/loud-rejection-1.6.0.tgz"
     },
-    "path-type": {
-      "version": "1.1.0",
-      "from": "path-type@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz"
+    "lower-case": {
+      "version": "1.1.4",
+      "from": "lower-case@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-1.1.4.tgz"
     },
-    "pause": {
-      "version": "0.1.0",
-      "from": "pause@0.1.0",
-      "resolved": "https://registry.npmjs.org/pause/-/pause-0.1.0.tgz"
+    "lowercase-keys": {
+      "version": "1.0.0",
+      "from": "lowercase-keys@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.0.tgz"
     },
-    "pause-stream": {
-      "version": "0.0.11",
-      "from": "pause-stream@0.0.11",
-      "resolved": "https://registry.npmjs.org/pause-stream/-/pause-stream-0.0.11.tgz"
+    "lru-cache": {
+      "version": "2.7.3",
+      "from": "lru-cache@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.7.3.tgz"
     },
-    "pbkdf2": {
-      "version": "3.0.12",
-      "from": "pbkdf2@>=3.0.3 <4.0.0",
-      "resolved": "https://registry.npmjs.org/pbkdf2/-/pbkdf2-3.0.12.tgz",
-      "dependencies": {
-        "ripemd160": {
-          "version": "2.0.1",
-          "from": "ripemd160@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz"
-        },
-        "sha.js": {
-          "version": "2.4.8",
-          "from": "sha.js@>=2.4.8 <3.0.0",
-          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz"
-        }
-      }
+    "macaddress": {
+      "version": "0.2.8",
+      "from": "macaddress@>=0.2.8 <0.3.0",
+      "resolved": "https://registry.npmjs.org/macaddress/-/macaddress-0.2.8.tgz"
     },
-    "pbkdf2-compat": {
-      "version": "2.0.1",
-      "from": "pbkdf2-compat@2.0.1",
-      "resolved": "https://registry.npmjs.org/pbkdf2-compat/-/pbkdf2-compat-2.0.1.tgz"
+    "make-dir": {
+      "version": "1.0.0",
+      "from": "make-dir@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-1.0.0.tgz"
     },
-    "pend": {
-      "version": "1.2.0",
-      "from": "pend@>=1.2.0 <1.3.0",
-      "resolved": "https://registry.npmjs.org/pend/-/pend-1.2.0.tgz"
+    "map-cache": {
+      "version": "0.2.2",
+      "from": "map-cache@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz"
     },
-    "performance-now": {
-      "version": "0.2.0",
-      "from": "performance-now@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-0.2.0.tgz"
+    "map-obj": {
+      "version": "1.0.1",
+      "from": "map-obj@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/map-obj/-/map-obj-1.0.1.tgz"
     },
-    "phantomcss": {
-      "version": "1.1.3",
-      "from": "phantomcss@1.1.3",
-      "resolved": "https://registry.npmjs.org/phantomcss/-/phantomcss-1.1.3.tgz"
+    "map-stream": {
+      "version": "0.0.7",
+      "from": "map-stream@>=0.0.3 <0.1.0",
+      "resolved": "https://registry.npmjs.org/map-stream/-/map-stream-0.0.7.tgz"
     },
-    "phantomjs-polyfill": {
-      "version": "0.0.2",
-      "from": "phantomjs-polyfill@>=0.0.2 <0.1.0",
-      "resolved": "https://registry.npmjs.org/phantomjs-polyfill/-/phantomjs-polyfill-0.0.2.tgz"
+    "marked": {
+      "version": "0.3.6",
+      "from": "marked@>=0.3.6 <0.4.0",
+      "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.6.tgz"
     },
-    "phantomjs-prebuilt": {
-      "version": "2.1.14",
-      "from": "phantomjs-prebuilt@>=2.1.6 <2.2.0",
-      "resolved": "https://registry.npmjs.org/phantomjs-prebuilt/-/phantomjs-prebuilt-2.1.14.tgz",
-      "dependencies": {
-        "caseless": {
-          "version": "0.11.0",
-          "from": "caseless@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz"
-        },
-        "es6-promise": {
-          "version": "4.0.5",
-          "from": "es6-promise@>=4.0.3 <4.1.0",
-          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.0.5.tgz"
-        },
-        "fs-extra": {
-          "version": "1.0.0",
-          "from": "fs-extra@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-1.0.0.tgz"
-        },
-        "har-validator": {
-          "version": "2.0.6",
-          "from": "har-validator@>=2.0.6 <2.1.0",
-          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz"
-        },
-        "qs": {
-          "version": "6.3.2",
-          "from": "qs@>=6.3.0 <6.4.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-6.3.2.tgz"
-        },
-        "request": {
-          "version": "2.79.0",
-          "from": "request@>=2.79.0 <2.80.0",
-          "resolved": "https://registry.npmjs.org/request/-/request-2.79.0.tgz"
+    "marked-terminal": {
+      "version": "1.7.0",
+      "from": "marked-terminal@>=1.6.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/marked-terminal/-/marked-terminal-1.7.0.tgz"
+    },
+    "math-expression-evaluator": {
+      "version": "1.2.17",
+      "from": "math-expression-evaluator@>=1.2.14 <2.0.0",
+      "resolved": "https://registry.npmjs.org/math-expression-evaluator/-/math-expression-evaluator-1.2.17.tgz"
+    },
+    "md5": {
+      "version": "2.2.1",
+      "from": "md5@>=2.2.1 <2.3.0",
+      "resolved": "https://registry.npmjs.org/md5/-/md5-2.2.1.tgz"
+    },
+    "media-typer": {
+      "version": "0.3.0",
+      "from": "media-typer@0.3.0",
+      "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz"
+    },
+    "memory-fs": {
+      "version": "0.4.1",
+      "from": "memory-fs@>=0.4.1 <0.5.0",
+      "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.4.1.tgz",
+      "dependencies": {
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
-        "tunnel-agent": {
-          "version": "0.4.3",
-          "from": "tunnel-agent@>=0.4.1 <0.5.0",
-          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz"
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
-        "uuid": {
-          "version": "3.0.1",
-          "from": "uuid@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.0.1.tgz"
+        "string_decoder": {
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
-    "pidof": {
-      "version": "1.0.2",
-      "from": "pidof@>=1.0.2 <1.1.0",
-      "resolved": "https://registry.npmjs.org/pidof/-/pidof-1.0.2.tgz"
-    },
-    "pify": {
-      "version": "2.3.0",
-      "from": "pify@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz"
-    },
-    "pinkie": {
-      "version": "2.0.4",
-      "from": "pinkie@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/pinkie/-/pinkie-2.0.4.tgz"
-    },
-    "pinkie-promise": {
-      "version": "2.0.1",
-      "from": "pinkie-promise@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz"
+    "meow": {
+      "version": "3.7.0",
+      "from": "meow@>=3.3.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/meow/-/meow-3.7.0.tgz"
     },
-    "pkg-conf": {
-      "version": "1.1.3",
-      "from": "pkg-conf@>=1.1.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/pkg-conf/-/pkg-conf-1.1.3.tgz"
+    "merge-descriptors": {
+      "version": "1.0.1",
+      "from": "merge-descriptors@1.0.1",
+      "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.1.tgz"
     },
-    "plur": {
-      "version": "2.1.2",
-      "from": "plur@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/plur/-/plur-2.1.2.tgz"
+    "merge-stream": {
+      "version": "1.0.1",
+      "from": "merge-stream@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-1.0.1.tgz",
+      "dependencies": {
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+        },
+        "string_decoder": {
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+        }
+      }
     },
-    "portfinder": {
-      "version": "1.0.13",
-      "from": "portfinder@>=1.0.9 <2.0.0",
-      "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.13.tgz"
+    "merge2": {
+      "version": "1.0.3",
+      "from": "merge2@>=1.0.2 <1.1.0",
+      "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.0.3.tgz"
     },
-    "postcss": {
-      "version": "5.2.17",
-      "from": "postcss@>=5.0.21 <6.0.0",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+    "method-override": {
+      "version": "2.3.9",
+      "from": "method-override@>=2.3.5 <2.4.0",
+      "resolved": "https://registry.npmjs.org/method-override/-/method-override-2.3.9.tgz",
       "dependencies": {
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.6 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "from": "supports-color@>=3.2.3 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+        "debug": {
+          "version": "2.6.8",
+          "from": "debug@2.6.8",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz"
         }
       }
     },
-    "postcss-calc": {
-      "version": "5.3.1",
-      "from": "postcss-calc@>=5.2.0 <6.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-5.3.1.tgz"
+    "methods": {
+      "version": "1.1.2",
+      "from": "methods@>=1.1.2 <1.2.0",
+      "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz"
     },
-    "postcss-colormin": {
-      "version": "2.2.2",
-      "from": "postcss-colormin@>=2.1.8 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-colormin/-/postcss-colormin-2.2.2.tgz"
+    "micromatch": {
+      "version": "2.3.11",
+      "from": "micromatch@>=2.3.7 <3.0.0",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz"
     },
-    "postcss-convert-values": {
-      "version": "2.6.1",
-      "from": "postcss-convert-values@>=2.3.4 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-convert-values/-/postcss-convert-values-2.6.1.tgz"
+    "miller-rabin": {
+      "version": "4.0.0",
+      "from": "miller-rabin@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/miller-rabin/-/miller-rabin-4.0.0.tgz"
     },
-    "postcss-discard-comments": {
-      "version": "2.0.4",
-      "from": "postcss-discard-comments@>=2.0.4 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-discard-comments/-/postcss-discard-comments-2.0.4.tgz"
+    "mime": {
+      "version": "1.3.6",
+      "from": "mime@>=1.3.4 <2.0.0",
+      "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.6.tgz"
     },
-    "postcss-discard-duplicates": {
-      "version": "2.1.0",
-      "from": "postcss-discard-duplicates@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-discard-duplicates/-/postcss-discard-duplicates-2.1.0.tgz"
+    "mime-db": {
+      "version": "1.27.0",
+      "from": "mime-db@>=1.27.0 <1.28.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.27.0.tgz"
     },
-    "postcss-discard-empty": {
-      "version": "2.1.0",
-      "from": "postcss-discard-empty@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-discard-empty/-/postcss-discard-empty-2.1.0.tgz"
+    "mime-types": {
+      "version": "2.1.15",
+      "from": "mime-types@>=2.1.7 <2.2.0",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.15.tgz"
     },
-    "postcss-discard-overridden": {
-      "version": "0.1.1",
-      "from": "postcss-discard-overridden@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/postcss-discard-overridden/-/postcss-discard-overridden-0.1.1.tgz"
+    "minimalistic-assert": {
+      "version": "1.0.0",
+      "from": "minimalistic-assert@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.0.tgz"
     },
-    "postcss-discard-unused": {
-      "version": "2.2.3",
-      "from": "postcss-discard-unused@>=2.2.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-discard-unused/-/postcss-discard-unused-2.2.3.tgz"
+    "minimalistic-crypto-utils": {
+      "version": "1.0.1",
+      "from": "minimalistic-crypto-utils@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/minimalistic-crypto-utils/-/minimalistic-crypto-utils-1.0.1.tgz"
     },
-    "postcss-filter-plugins": {
-      "version": "2.0.2",
-      "from": "postcss-filter-plugins@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-filter-plugins/-/postcss-filter-plugins-2.0.2.tgz"
+    "minimatch": {
+      "version": "3.0.4",
+      "from": "minimatch@>=3.0.4 <4.0.0",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz"
     },
-    "postcss-load-config": {
+    "minimist": {
       "version": "1.2.0",
-      "from": "postcss-load-config@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-1.2.0.tgz"
+      "from": "minimist@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz"
     },
-    "postcss-load-options": {
-      "version": "1.2.0",
-      "from": "postcss-load-options@>=1.2.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-load-options/-/postcss-load-options-1.2.0.tgz"
+    "mixin-object": {
+      "version": "2.0.1",
+      "from": "mixin-object@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/mixin-object/-/mixin-object-2.0.1.tgz",
+      "dependencies": {
+        "for-in": {
+          "version": "0.1.8",
+          "from": "for-in@>=0.1.3 <0.2.0",
+          "resolved": "https://registry.npmjs.org/for-in/-/for-in-0.1.8.tgz"
+        }
+      }
     },
-    "postcss-load-plugins": {
-      "version": "2.3.0",
-      "from": "postcss-load-plugins@>=2.3.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-load-plugins/-/postcss-load-plugins-2.3.0.tgz"
+    "mkdirp": {
+      "version": "0.5.1",
+      "from": "mkdirp@>=0.5.1 <0.6.0",
+      "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
+      "dependencies": {
+        "minimist": {
+          "version": "0.0.8",
+          "from": "minimist@0.0.8",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz"
+        }
+      }
     },
-    "postcss-loader": {
-      "version": "1.3.3",
-      "from": "postcss-loader@>=1.3.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-1.3.3.tgz",
+    "mocha": {
+      "version": "2.5.3",
+      "from": "mocha@>=2.5.3 <2.6.0",
+      "resolved": "https://registry.npmjs.org/mocha/-/mocha-2.5.3.tgz",
+      "dependencies": {
+        "commander": {
+          "version": "2.3.0",
+          "from": "commander@2.3.0",
+          "resolved": "https://registry.npmjs.org/commander/-/commander-2.3.0.tgz"
+        },
+        "debug": {
+          "version": "2.2.0",
+          "from": "debug@2.2.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+        },
+        "diff": {
+          "version": "1.4.0",
+          "from": "diff@1.4.0",
+          "resolved": "https://registry.npmjs.org/diff/-/diff-1.4.0.tgz"
+        },
+        "escape-string-regexp": {
+          "version": "1.0.2",
+          "from": "escape-string-regexp@1.0.2",
+          "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.2.tgz"
+        },
+        "glob": {
+          "version": "3.2.11",
+          "from": "glob@3.2.11",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-3.2.11.tgz"
+        },
+        "minimatch": {
+          "version": "0.3.0",
+          "from": "minimatch@>=0.3.0 <0.4.0",
+          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.3.0.tgz"
+        },
+        "ms": {
+          "version": "0.7.1",
+          "from": "ms@0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+        },
+        "supports-color": {
+          "version": "1.2.0",
+          "from": "supports-color@1.2.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-1.2.0.tgz"
+        }
+      }
+    },
+    "mocha-clean": {
+      "version": "0.4.0",
+      "from": "mocha-clean@>=0.4.0 <0.5.0",
+      "resolved": "https://registry.npmjs.org/mocha-clean/-/mocha-clean-0.4.0.tgz"
+    },
+    "mocha-loader": {
+      "version": "1.1.1",
+      "from": "mocha-loader@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/mocha-loader/-/mocha-loader-1.1.1.tgz",
       "dependencies": {
+        "css-loader": {
+          "version": "0.23.1",
+          "from": "css-loader@>=0.23.1 <0.24.0",
+          "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.23.1.tgz",
+          "dependencies": {
+            "loader-utils": {
+              "version": "0.2.17",
+              "from": "loader-utils@~0.2.2",
+              "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz"
+            }
+          }
+        },
+        "css-selector-tokenizer": {
+          "version": "0.5.4",
+          "from": "css-selector-tokenizer@>=0.5.1 <0.6.0",
+          "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.5.4.tgz"
+        },
         "loader-utils": {
           "version": "1.1.0",
           "from": "loader-utils@>=1.0.2 <2.0.0",
           "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
+        },
+        "style-loader": {
+          "version": "0.13.2",
+          "from": "style-loader@>=0.13.1 <0.14.0",
+          "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.13.2.tgz"
         }
       }
     },
-    "postcss-merge-idents": {
-      "version": "2.1.7",
-      "from": "postcss-merge-idents@>=2.1.5 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-merge-idents/-/postcss-merge-idents-2.1.7.tgz"
-    },
-    "postcss-merge-longhand": {
-      "version": "2.0.2",
-      "from": "postcss-merge-longhand@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-merge-longhand/-/postcss-merge-longhand-2.0.2.tgz"
-    },
-    "postcss-merge-rules": {
-      "version": "2.1.2",
-      "from": "postcss-merge-rules@>=2.0.3 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-merge-rules/-/postcss-merge-rules-2.1.2.tgz",
+    "morgan": {
+      "version": "1.6.1",
+      "from": "morgan@>=1.6.1 <1.7.0",
+      "resolved": "https://registry.npmjs.org/morgan/-/morgan-1.6.1.tgz",
       "dependencies": {
-        "browserslist": {
-          "version": "1.7.7",
-          "from": "browserslist@>=1.5.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz"
+        "debug": {
+          "version": "2.2.0",
+          "from": "debug@>=2.2.0 <2.3.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+        },
+        "depd": {
+          "version": "1.0.1",
+          "from": "depd@>=1.0.1 <1.1.0",
+          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz"
+        },
+        "ms": {
+          "version": "0.7.1",
+          "from": "ms@0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
         }
       }
     },
-    "postcss-message-helpers": {
+    "ms": {
       "version": "2.0.0",
-      "from": "postcss-message-helpers@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-message-helpers/-/postcss-message-helpers-2.0.0.tgz"
+      "from": "ms@2.0.0",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz"
     },
-    "postcss-minify-font-values": {
-      "version": "1.0.5",
-      "from": "postcss-minify-font-values@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-minify-font-values/-/postcss-minify-font-values-1.0.5.tgz"
+    "multiparty": {
+      "version": "3.3.2",
+      "from": "multiparty@3.3.2",
+      "resolved": "https://registry.npmjs.org/multiparty/-/multiparty-3.3.2.tgz"
     },
-    "postcss-minify-gradients": {
-      "version": "1.0.5",
-      "from": "postcss-minify-gradients@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-minify-gradients/-/postcss-minify-gradients-1.0.5.tgz"
+    "multipipe": {
+      "version": "0.1.2",
+      "from": "multipipe@>=0.1.2 <0.2.0",
+      "resolved": "https://registry.npmjs.org/multipipe/-/multipipe-0.1.2.tgz"
     },
-    "postcss-minify-params": {
-      "version": "1.2.2",
-      "from": "postcss-minify-params@>=1.0.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-minify-params/-/postcss-minify-params-1.2.2.tgz"
+    "mute-stream": {
+      "version": "0.0.7",
+      "from": "mute-stream@>=0.0.4 <0.1.0",
+      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.7.tgz"
     },
-    "postcss-minify-selectors": {
-      "version": "2.1.1",
-      "from": "postcss-minify-selectors@>=2.0.4 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-minify-selectors/-/postcss-minify-selectors-2.1.1.tgz"
+    "nan": {
+      "version": "2.6.2",
+      "from": "nan@>=2.3.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/nan/-/nan-2.6.2.tgz"
     },
-    "postcss-modules": {
-      "version": "0.6.4",
-      "from": "postcss-modules@>=0.6.4 <0.7.0",
-      "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.6.4.tgz"
+    "native-promise-only": {
+      "version": "0.8.1",
+      "from": "native-promise-only@>=0.8.1 <0.9.0",
+      "resolved": "https://registry.npmjs.org/native-promise-only/-/native-promise-only-0.8.1.tgz"
     },
-    "postcss-modules-extract-imports": {
+    "natives": {
       "version": "1.1.0",
-      "from": "postcss-modules-extract-imports@1.1.0",
-      "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-1.1.0.tgz",
-      "dependencies": {
-        "postcss": {
-          "version": "6.0.1",
-          "from": "postcss@>=6.0.1 <7.0.0",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
-        },
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.6 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "from": "supports-color@>=3.2.3 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
-        }
-      }
+      "from": "natives@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/natives/-/natives-1.1.0.tgz"
     },
-    "postcss-modules-local-by-default": {
-      "version": "1.2.0",
-      "from": "postcss-modules-local-by-default@1.2.0",
-      "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-1.2.0.tgz",
-      "dependencies": {
-        "postcss": {
-          "version": "6.0.1",
-          "from": "postcss@>=6.0.1 <7.0.0",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
-        },
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.6 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "from": "supports-color@>=3.2.3 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
-        }
-      }
+    "ncname": {
+      "version": "1.0.0",
+      "from": "ncname@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/ncname/-/ncname-1.0.0.tgz"
     },
-    "postcss-modules-scope": {
-      "version": "1.1.0",
-      "from": "postcss-modules-scope@1.1.0",
-      "resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-1.1.0.tgz",
-      "dependencies": {
-        "postcss": {
-          "version": "6.0.1",
-          "from": "postcss@>=6.0.1 <7.0.0",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
-        },
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.6 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "from": "supports-color@>=3.2.3 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
-        }
-      }
+    "negotiator": {
+      "version": "0.6.1",
+      "from": "negotiator@0.6.1",
+      "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.1.tgz"
     },
-    "postcss-modules-values": {
-      "version": "1.3.0",
-      "from": "postcss-modules-values@1.3.0",
-      "resolved": "https://registry.npmjs.org/postcss-modules-values/-/postcss-modules-values-1.3.0.tgz",
+    "no-case": {
+      "version": "2.3.1",
+      "from": "no-case@>=2.2.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/no-case/-/no-case-2.3.1.tgz"
+    },
+    "node-emoji": {
+      "version": "1.5.1",
+      "from": "node-emoji@>=1.4.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/node-emoji/-/node-emoji-1.5.1.tgz"
+    },
+    "node-fetch": {
+      "version": "1.7.0",
+      "from": "node-fetch@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.0.tgz"
+    },
+    "node-forge": {
+      "version": "0.7.1",
+      "from": "node-forge@>=0.7.1 <0.8.0",
+      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.7.1.tgz"
+    },
+    "node-gyp": {
+      "version": "3.6.1",
+      "from": "node-gyp@>=3.3.1 <4.0.0",
+      "resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-3.6.1.tgz"
+    },
+    "node-libs-browser": {
+      "version": "0.6.0",
+      "from": "node-libs-browser@>=0.6.0 <0.7.0",
+      "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-0.6.0.tgz"
+    },
+    "node-notifier": {
+      "version": "5.0.2",
+      "from": "node-notifier@>=5.0.2 <5.1.0",
+      "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-5.0.2.tgz"
+    },
+    "node-sass": {
+      "version": "4.5.3",
+      "from": "node-sass@>=4.5.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.5.3.tgz",
       "dependencies": {
-        "postcss": {
-          "version": "6.0.1",
-          "from": "postcss@>=6.0.1 <7.0.0",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
+        "gaze": {
+          "version": "1.1.2",
+          "from": "gaze@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz"
         },
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.6 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
+        "globule": {
+          "version": "1.1.0",
+          "from": "globule@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/globule/-/globule-1.1.0.tgz"
         },
-        "supports-color": {
-          "version": "3.2.3",
-          "from": "supports-color@>=3.2.3 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+        "lodash": {
+          "version": "4.16.6",
+          "from": "lodash@>=4.16.4 <4.17.0",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.16.6.tgz"
         }
       }
     },
-    "postcss-normalize-charset": {
-      "version": "1.1.1",
-      "from": "postcss-normalize-charset@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-normalize-charset/-/postcss-normalize-charset-1.1.1.tgz"
+    "node-status-codes": {
+      "version": "1.0.0",
+      "from": "node-status-codes@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/node-status-codes/-/node-status-codes-1.0.0.tgz"
+    },
+    "node-zip": {
+      "version": "1.1.1",
+      "from": "node-zip@>=1.1.1 <1.2.0",
+      "resolved": "https://registry.npmjs.org/node-zip/-/node-zip-1.1.1.tgz"
+    },
+    "node.extend": {
+      "version": "1.1.6",
+      "from": "node.extend@>=1.0.10 <2.0.0",
+      "resolved": "https://registry.npmjs.org/node.extend/-/node.extend-1.1.6.tgz"
+    },
+    "nopt": {
+      "version": "3.0.6",
+      "from": "nopt@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/nopt/-/nopt-3.0.6.tgz"
+    },
+    "normalize-package-data": {
+      "version": "2.3.8",
+      "from": "normalize-package-data@>=2.3.2 <3.0.0",
+      "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.3.8.tgz"
+    },
+    "normalize-path": {
+      "version": "2.1.1",
+      "from": "normalize-path@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-2.1.1.tgz"
+    },
+    "normalize-range": {
+      "version": "0.1.2",
+      "from": "normalize-range@>=0.1.2 <0.2.0",
+      "resolved": "https://registry.npmjs.org/normalize-range/-/normalize-range-0.1.2.tgz"
     },
-    "postcss-normalize-url": {
-      "version": "3.0.8",
-      "from": "postcss-normalize-url@>=3.0.7 <4.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-normalize-url/-/postcss-normalize-url-3.0.8.tgz"
+    "normalize-url": {
+      "version": "1.9.1",
+      "from": "normalize-url@>=1.4.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/normalize-url/-/normalize-url-1.9.1.tgz"
     },
-    "postcss-ordered-values": {
-      "version": "2.2.3",
-      "from": "postcss-ordered-values@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-ordered-values/-/postcss-ordered-values-2.2.3.tgz"
+    "npm-run-path": {
+      "version": "1.0.0",
+      "from": "npm-run-path@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-1.0.0.tgz"
     },
-    "postcss-reduce-idents": {
-      "version": "2.4.0",
-      "from": "postcss-reduce-idents@>=2.2.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-reduce-idents/-/postcss-reduce-idents-2.4.0.tgz"
+    "npmlog": {
+      "version": "4.1.0",
+      "from": "npmlog@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.0.tgz"
     },
-    "postcss-reduce-initial": {
+    "nth-check": {
       "version": "1.0.1",
-      "from": "postcss-reduce-initial@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-reduce-initial/-/postcss-reduce-initial-1.0.1.tgz"
+      "from": "nth-check@>=1.0.1 <1.1.0",
+      "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-1.0.1.tgz"
     },
-    "postcss-reduce-transforms": {
-      "version": "1.0.4",
-      "from": "postcss-reduce-transforms@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-reduce-transforms/-/postcss-reduce-transforms-1.0.4.tgz"
+    "num2fraction": {
+      "version": "1.2.2",
+      "from": "num2fraction@>=1.2.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/num2fraction/-/num2fraction-1.2.2.tgz"
     },
-    "postcss-selector-parser": {
-      "version": "2.2.3",
-      "from": "postcss-selector-parser@>=2.2.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-2.2.3.tgz"
+    "number-is-nan": {
+      "version": "1.0.1",
+      "from": "number-is-nan@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz"
     },
-    "postcss-svgo": {
-      "version": "2.1.6",
-      "from": "postcss-svgo@>=2.1.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-svgo/-/postcss-svgo-2.1.6.tgz"
+    "oauth-sign": {
+      "version": "0.8.2",
+      "from": "oauth-sign@>=0.8.1 <0.9.0",
+      "resolved": "https://registry.npmjs.org/oauth-sign/-/oauth-sign-0.8.2.tgz"
     },
-    "postcss-unique-selectors": {
-      "version": "2.0.2",
-      "from": "postcss-unique-selectors@>=2.0.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-unique-selectors/-/postcss-unique-selectors-2.0.2.tgz"
+    "object-assign": {
+      "version": "4.1.1",
+      "from": "object-assign@>=4.1.0 <4.2.0",
+      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz"
     },
-    "postcss-value-parser": {
-      "version": "3.3.0",
-      "from": "postcss-value-parser@>=3.2.3 <4.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-3.3.0.tgz"
+    "object-component": {
+      "version": "0.0.3",
+      "from": "object-component@0.0.3",
+      "resolved": "https://registry.npmjs.org/object-component/-/object-component-0.0.3.tgz"
     },
-    "postcss-zindex": {
-      "version": "2.2.0",
-      "from": "postcss-zindex@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-zindex/-/postcss-zindex-2.2.0.tgz"
+    "object-is": {
+      "version": "1.0.1",
+      "from": "object-is@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.0.1.tgz"
     },
-    "prelude-ls": {
-      "version": "1.1.2",
-      "from": "prelude-ls@>=1.1.2 <1.2.0",
-      "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.1.2.tgz"
+    "object-keys": {
+      "version": "0.4.0",
+      "from": "object-keys@>=0.4.0 <0.5.0",
+      "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-0.4.0.tgz"
     },
-    "prepend-http": {
+    "object.assign": {
+      "version": "4.0.4",
+      "from": "object.assign@>=4.0.4 <5.0.0",
+      "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.0.4.tgz",
+      "dependencies": {
+        "object-keys": {
+          "version": "1.0.11",
+          "from": "object-keys@>=1.0.10 <2.0.0",
+          "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.0.11.tgz"
+        }
+      }
+    },
+    "object.entries": {
       "version": "1.0.4",
-      "from": "prepend-http@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/prepend-http/-/prepend-http-1.0.4.tgz"
+      "from": "object.entries@>=1.0.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/object.entries/-/object.entries-1.0.4.tgz"
     },
-    "preserve": {
-      "version": "0.2.0",
-      "from": "preserve@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/preserve/-/preserve-0.2.0.tgz"
+    "object.omit": {
+      "version": "2.0.1",
+      "from": "object.omit@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/object.omit/-/object.omit-2.0.1.tgz"
     },
-    "pretty-hrtime": {
-      "version": "1.0.3",
-      "from": "pretty-hrtime@>=1.0.2 <1.1.0",
-      "resolved": "https://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz"
+    "object.pick": {
+      "version": "1.2.0",
+      "from": "object.pick@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/object.pick/-/object.pick-1.2.0.tgz"
     },
-    "private": {
-      "version": "0.1.7",
-      "from": "private@>=0.1.5 <0.2.0",
-      "resolved": "https://registry.npmjs.org/private/-/private-0.1.7.tgz"
+    "object.values": {
+      "version": "1.0.4",
+      "from": "object.values@>=1.0.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.0.4.tgz"
     },
-    "process": {
-      "version": "0.11.10",
-      "from": "process@>=0.11.0 <0.12.0",
-      "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz"
+    "obuf": {
+      "version": "1.1.1",
+      "from": "obuf@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/obuf/-/obuf-1.1.1.tgz"
     },
-    "process-nextick-args": {
-      "version": "1.0.7",
-      "from": "process-nextick-args@>=1.0.6 <1.1.0",
-      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz"
+    "office-ui-fabric-core": {
+      "version": "7.0.0",
+      "from": "office-ui-fabric-core@>=7.0.0 <8.0.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-7.0.0.tgz"
     },
-    "progress": {
-      "version": "1.1.8",
-      "from": "progress@>=1.1.8 <1.2.0",
-      "resolved": "https://registry.npmjs.org/progress/-/progress-1.1.8.tgz"
+    "office-ui-fabric-react": {
+      "version": "2.34.2",
+      "from": "office-ui-fabric-react@>=2.11.0-0 <3.0.0-0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-2.34.2.tgz"
     },
-    "promise": {
-      "version": "7.1.1",
-      "from": "promise@>=7.1.1 <8.0.0",
-      "resolved": "https://registry.npmjs.org/promise/-/promise-7.1.1.tgz"
+    "on-finished": {
+      "version": "2.3.0",
+      "from": "on-finished@>=2.3.0 <2.4.0",
+      "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz"
     },
-    "prop-types": {
-      "version": "15.5.10",
-      "from": "prop-types@>=15.5.10 <16.0.0",
-      "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.5.10.tgz"
+    "on-headers": {
+      "version": "1.0.1",
+      "from": "on-headers@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/on-headers/-/on-headers-1.0.1.tgz"
     },
-    "proxy-addr": {
-      "version": "1.1.4",
-      "from": "proxy-addr@>=1.1.3 <1.2.0",
-      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-1.1.4.tgz"
+    "once": {
+      "version": "1.4.0",
+      "from": "once@>=1.3.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz"
     },
-    "prr": {
-      "version": "0.0.0",
-      "from": "prr@>=0.0.0 <0.1.0",
-      "resolved": "https://registry.npmjs.org/prr/-/prr-0.0.0.tgz"
+    "onetime": {
+      "version": "1.1.0",
+      "from": "onetime@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/onetime/-/onetime-1.1.0.tgz"
     },
-    "pseudomap": {
-      "version": "1.0.2",
-      "from": "pseudomap@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/pseudomap/-/pseudomap-1.0.2.tgz"
+    "open": {
+      "version": "0.0.5",
+      "from": "open@0.0.5",
+      "resolved": "https://registry.npmjs.org/open/-/open-0.0.5.tgz"
     },
-    "public-encrypt": {
-      "version": "4.0.0",
-      "from": "public-encrypt@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/public-encrypt/-/public-encrypt-4.0.0.tgz"
+    "opener": {
+      "version": "1.4.3",
+      "from": "opener@>=1.4.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/opener/-/opener-1.4.3.tgz"
     },
-    "punycode": {
-      "version": "1.4.1",
-      "from": "punycode@>=1.4.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz"
+    "opn": {
+      "version": "4.0.2",
+      "from": "opn@4.0.2",
+      "resolved": "https://registry.npmjs.org/opn/-/opn-4.0.2.tgz"
     },
-    "q": {
-      "version": "1.5.0",
-      "from": "q@>=1.1.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/q/-/q-1.5.0.tgz"
+    "optimist": {
+      "version": "0.6.1",
+      "from": "optimist@>=0.6.0 <0.7.0",
+      "resolved": "https://registry.npmjs.org/optimist/-/optimist-0.6.1.tgz",
+      "dependencies": {
+        "minimist": {
+          "version": "0.0.10",
+          "from": "minimist@>=0.0.1 <0.1.0",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.10.tgz"
+        }
+      }
+    },
+    "optionator": {
+      "version": "0.8.2",
+      "from": "optionator@>=0.8.1 <0.9.0",
+      "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.8.2.tgz",
+      "dependencies": {
+        "wordwrap": {
+          "version": "1.0.0",
+          "from": "wordwrap@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz"
+        }
+      }
+    },
+    "options": {
+      "version": "0.0.6",
+      "from": "options@>=0.0.5",
+      "resolved": "https://registry.npmjs.org/options/-/options-0.0.6.tgz"
+    },
+    "orchestrator": {
+      "version": "0.3.8",
+      "from": "orchestrator@>=0.3.7 <0.4.0",
+      "resolved": "https://registry.npmjs.org/orchestrator/-/orchestrator-0.3.8.tgz",
+      "dependencies": {
+        "end-of-stream": {
+          "version": "0.1.5",
+          "from": "end-of-stream@>=0.1.5 <0.2.0",
+          "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-0.1.5.tgz"
+        },
+        "once": {
+          "version": "1.3.3",
+          "from": "once@>=1.3.0 <1.4.0",
+          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz"
+        }
+      }
     },
-    "qs": {
-      "version": "6.4.0",
-      "from": "qs@>=6.4.0 <6.5.0",
-      "resolved": "https://registry.npmjs.org/qs/-/qs-6.4.0.tgz"
+    "ordered-read-streams": {
+      "version": "0.1.0",
+      "from": "ordered-read-streams@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.1.0.tgz"
     },
-    "query-string": {
-      "version": "4.3.4",
-      "from": "query-string@>=4.1.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/query-string/-/query-string-4.3.4.tgz"
+    "original": {
+      "version": "1.0.0",
+      "from": "original@>=0.0.5",
+      "resolved": "https://registry.npmjs.org/original/-/original-1.0.0.tgz",
+      "dependencies": {
+        "url-parse": {
+          "version": "1.0.5",
+          "from": "url-parse@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.0.5.tgz"
+        }
+      }
     },
-    "querystring": {
-      "version": "0.2.0",
-      "from": "querystring@0.2.0",
-      "resolved": "https://registry.npmjs.org/querystring/-/querystring-0.2.0.tgz"
+    "os-browserify": {
+      "version": "0.1.2",
+      "from": "os-browserify@>=0.1.2 <0.2.0",
+      "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.1.2.tgz"
     },
-    "querystring-es3": {
-      "version": "0.2.1",
-      "from": "querystring-es3@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/querystring-es3/-/querystring-es3-0.2.1.tgz"
+    "os-homedir": {
+      "version": "1.0.2",
+      "from": "os-homedir@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz"
     },
-    "querystringify": {
-      "version": "0.0.4",
-      "from": "querystringify@>=0.0.0 <0.1.0",
-      "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-0.0.4.tgz"
+    "os-locale": {
+      "version": "1.4.0",
+      "from": "os-locale@>=1.4.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz"
     },
-    "random-bytes": {
-      "version": "1.0.0",
-      "from": "random-bytes@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/random-bytes/-/random-bytes-1.0.0.tgz"
+    "os-tmpdir": {
+      "version": "1.0.2",
+      "from": "os-tmpdir@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz"
     },
-    "randomatic": {
-      "version": "1.1.6",
-      "from": "randomatic@>=1.1.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-1.1.6.tgz"
+    "osenv": {
+      "version": "0.1.4",
+      "from": "osenv@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.4.tgz"
     },
-    "randombytes": {
-      "version": "2.0.3",
-      "from": "randombytes@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.0.3.tgz"
+    "package-json": {
+      "version": "2.4.0",
+      "from": "package-json@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/package-json/-/package-json-2.4.0.tgz"
     },
-    "range-parser": {
-      "version": "1.2.0",
-      "from": "range-parser@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.0.tgz"
+    "pako": {
+      "version": "0.2.9",
+      "from": "pako@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/pako/-/pako-0.2.9.tgz"
     },
-    "raw-body": {
-      "version": "2.2.0",
-      "from": "raw-body@>=2.2.0 <2.3.0",
-      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.2.0.tgz",
+    "parallel-transform": {
+      "version": "1.1.0",
+      "from": "parallel-transform@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/parallel-transform/-/parallel-transform-1.1.0.tgz",
       "dependencies": {
-        "iconv-lite": {
-          "version": "0.4.15",
-          "from": "iconv-lite@0.4.15",
-          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.15.tgz"
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.1.5 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+        },
+        "string_decoder": {
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
-    "raw-loader": {
-      "version": "0.5.1",
-      "from": "raw-loader@>=0.5.1 <0.6.0",
-      "resolved": "https://registry.npmjs.org/raw-loader/-/raw-loader-0.5.1.tgz"
+    "param-case": {
+      "version": "2.1.1",
+      "from": "param-case@>=2.1.0 <2.2.0",
+      "resolved": "https://registry.npmjs.org/param-case/-/param-case-2.1.1.tgz"
     },
-    "rc": {
-      "version": "1.2.1",
-      "from": "rc@>=1.1.6 <2.0.0",
-      "resolved": "https://registry.npmjs.org/rc/-/rc-1.2.1.tgz"
+    "parse-asn1": {
+      "version": "5.1.0",
+      "from": "parse-asn1@>=5.0.0 <6.0.0",
+      "resolved": "https://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.0.tgz",
+      "dependencies": {
+        "browserify-aes": {
+          "version": "1.0.6",
+          "from": "browserify-aes@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.6.tgz"
+        }
+      }
     },
-    "react": {
-      "version": "15.4.2",
-      "from": "react@15.4.2",
-      "resolved": "https://registry.npmjs.org/react/-/react-15.4.2.tgz"
+    "parse-filepath": {
+      "version": "1.0.1",
+      "from": "parse-filepath@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/parse-filepath/-/parse-filepath-1.0.1.tgz"
     },
-    "react-addons-test-utils": {
-      "version": "15.4.2",
-      "from": "react-addons-test-utils@15.4.2",
-      "resolved": "https://registry.npmjs.org/react-addons-test-utils/-/react-addons-test-utils-15.4.2.tgz"
+    "parse-glob": {
+      "version": "3.0.4",
+      "from": "parse-glob@>=3.0.4 <4.0.0",
+      "resolved": "https://registry.npmjs.org/parse-glob/-/parse-glob-3.0.4.tgz"
     },
-    "react-dom": {
-      "version": "15.4.2",
-      "from": "react-dom@15.4.2",
-      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-15.4.2.tgz"
+    "parse-json": {
+      "version": "2.2.0",
+      "from": "parse-json@>=2.2.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz"
     },
-    "react-highlight": {
-      "version": "0.9.0",
-      "from": "react-highlight@0.9.0",
-      "resolved": "https://registry.npmjs.org/react-highlight/-/react-highlight-0.9.0.tgz"
+    "parse-passwd": {
+      "version": "1.0.0",
+      "from": "parse-passwd@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/parse-passwd/-/parse-passwd-1.0.0.tgz"
     },
-    "read": {
-      "version": "1.0.7",
-      "from": "read@>=1.0.3 <1.1.0",
-      "resolved": "https://registry.npmjs.org/read/-/read-1.0.7.tgz"
+    "parsejson": {
+      "version": "0.0.3",
+      "from": "parsejson@0.0.3",
+      "resolved": "https://registry.npmjs.org/parsejson/-/parsejson-0.0.3.tgz"
     },
-    "read-all-stream": {
-      "version": "3.1.0",
-      "from": "read-all-stream@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/read-all-stream/-/read-all-stream-3.1.0.tgz"
+    "parseqs": {
+      "version": "0.0.5",
+      "from": "parseqs@0.0.5",
+      "resolved": "https://registry.npmjs.org/parseqs/-/parseqs-0.0.5.tgz"
     },
-    "read-pkg": {
-      "version": "1.1.0",
-      "from": "read-pkg@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz"
+    "parseuri": {
+      "version": "0.0.5",
+      "from": "parseuri@0.0.5",
+      "resolved": "https://registry.npmjs.org/parseuri/-/parseuri-0.0.5.tgz"
     },
-    "read-pkg-up": {
-      "version": "1.0.1",
-      "from": "read-pkg-up@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz"
+    "parseurl": {
+      "version": "1.3.1",
+      "from": "parseurl@>=1.3.1 <1.4.0",
+      "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.1.tgz"
     },
-    "readable-stream": {
-      "version": "2.2.9",
-      "from": "readable-stream@>=2.0.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+    "path-browserify": {
+      "version": "0.0.0",
+      "from": "path-browserify@0.0.0",
+      "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-0.0.0.tgz"
     },
-    "readdirp": {
+    "path-dirname": {
+      "version": "1.0.2",
+      "from": "path-dirname@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/path-dirname/-/path-dirname-1.0.2.tgz"
+    },
+    "path-exists": {
       "version": "2.1.0",
-      "from": "readdirp@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-2.1.0.tgz"
+      "from": "path-exists@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz"
     },
-    "readline2": {
+    "path-is-absolute": {
       "version": "1.0.1",
-      "from": "readline2@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/readline2/-/readline2-1.0.1.tgz",
-      "dependencies": {
-        "mute-stream": {
-          "version": "0.0.5",
-          "from": "mute-stream@0.0.5",
-          "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.5.tgz"
-        }
-      }
-    },
-    "recast": {
-      "version": "0.11.23",
-      "from": "recast@>=0.11.12 <0.12.0",
-      "resolved": "https://registry.npmjs.org/recast/-/recast-0.11.23.tgz",
-      "dependencies": {
-        "esprima": {
-          "version": "3.1.3",
-          "from": "esprima@>=3.1.0 <3.2.0",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz"
-        },
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.0 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
-        }
-      }
+      "from": "path-is-absolute@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz"
     },
-    "rechoir": {
-      "version": "0.6.2",
-      "from": "rechoir@>=0.6.2 <0.7.0",
-      "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz"
+    "path-is-inside": {
+      "version": "1.0.2",
+      "from": "path-is-inside@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/path-is-inside/-/path-is-inside-1.0.2.tgz"
     },
-    "redent": {
+    "path-key": {
       "version": "1.0.0",
-      "from": "redent@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/redent/-/redent-1.0.0.tgz"
+      "from": "path-key@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/path-key/-/path-key-1.0.0.tgz"
     },
-    "redeyed": {
-      "version": "1.0.1",
-      "from": "redeyed@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/redeyed/-/redeyed-1.0.1.tgz",
-      "dependencies": {
-        "esprima": {
-          "version": "3.0.0",
-          "from": "esprima@>=3.0.0 <3.1.0",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.0.0.tgz"
-        }
-      }
+    "path-parse": {
+      "version": "1.0.5",
+      "from": "path-parse@>=1.0.5 <2.0.0",
+      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.5.tgz"
     },
-    "reduce-css-calc": {
-      "version": "1.3.0",
-      "from": "reduce-css-calc@>=1.2.6 <2.0.0",
-      "resolved": "https://registry.npmjs.org/reduce-css-calc/-/reduce-css-calc-1.3.0.tgz"
+    "path-root": {
+      "version": "0.1.1",
+      "from": "path-root@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/path-root/-/path-root-0.1.1.tgz"
     },
-    "reduce-function-call": {
-      "version": "1.0.2",
-      "from": "reduce-function-call@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/reduce-function-call/-/reduce-function-call-1.0.2.tgz"
+    "path-root-regex": {
+      "version": "0.1.2",
+      "from": "path-root-regex@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/path-root-regex/-/path-root-regex-0.1.2.tgz"
+    },
+    "path-to-regexp": {
+      "version": "0.1.7",
+      "from": "path-to-regexp@0.1.7",
+      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz"
     },
-    "regenerate": {
-      "version": "1.3.2",
-      "from": "regenerate@>=1.2.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.3.2.tgz"
+    "path-type": {
+      "version": "1.1.0",
+      "from": "path-type@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz"
     },
-    "regenerator-runtime": {
-      "version": "0.10.5",
-      "from": "regenerator-runtime@>=0.10.0 <0.11.0",
-      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz"
+    "pause": {
+      "version": "0.1.0",
+      "from": "pause@0.1.0",
+      "resolved": "https://registry.npmjs.org/pause/-/pause-0.1.0.tgz"
     },
-    "regex-cache": {
-      "version": "0.4.3",
-      "from": "regex-cache@>=0.4.2 <0.5.0",
-      "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.3.tgz"
+    "pause-stream": {
+      "version": "0.0.11",
+      "from": "pause-stream@0.0.11",
+      "resolved": "https://registry.npmjs.org/pause-stream/-/pause-stream-0.0.11.tgz"
     },
-    "regexpu-core": {
-      "version": "1.0.0",
-      "from": "regexpu-core@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-1.0.0.tgz"
+    "pbkdf2": {
+      "version": "3.0.12",
+      "from": "pbkdf2@>=3.0.3 <4.0.0",
+      "resolved": "https://registry.npmjs.org/pbkdf2/-/pbkdf2-3.0.12.tgz",
+      "dependencies": {
+        "ripemd160": {
+          "version": "2.0.1",
+          "from": "ripemd160@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz"
+        },
+        "sha.js": {
+          "version": "2.4.8",
+          "from": "sha.js@>=2.4.8 <3.0.0",
+          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz"
+        }
+      }
     },
-    "registry-auth-token": {
-      "version": "3.3.1",
-      "from": "registry-auth-token@>=3.0.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/registry-auth-token/-/registry-auth-token-3.3.1.tgz"
+    "pbkdf2-compat": {
+      "version": "2.0.1",
+      "from": "pbkdf2-compat@2.0.1",
+      "resolved": "https://registry.npmjs.org/pbkdf2-compat/-/pbkdf2-compat-2.0.1.tgz"
     },
-    "registry-url": {
-      "version": "3.1.0",
-      "from": "registry-url@>=3.0.3 <4.0.0",
-      "resolved": "https://registry.npmjs.org/registry-url/-/registry-url-3.1.0.tgz"
+    "pend": {
+      "version": "1.2.0",
+      "from": "pend@>=1.2.0 <1.3.0",
+      "resolved": "https://registry.npmjs.org/pend/-/pend-1.2.0.tgz"
     },
-    "regjsgen": {
+    "performance-now": {
       "version": "0.2.0",
-      "from": "regjsgen@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.2.0.tgz"
+      "from": "performance-now@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-0.2.0.tgz"
     },
-    "regjsparser": {
-      "version": "0.1.5",
-      "from": "regjsparser@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz"
+    "phantomcss": {
+      "version": "1.1.3",
+      "from": "phantomcss@1.1.3",
+      "resolved": "https://registry.npmjs.org/phantomcss/-/phantomcss-1.1.3.tgz"
     },
-    "relateurl": {
-      "version": "0.2.7",
-      "from": "relateurl@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/relateurl/-/relateurl-0.2.7.tgz"
+    "phantomjs-polyfill": {
+      "version": "0.0.2",
+      "from": "phantomjs-polyfill@>=0.0.2 <0.1.0",
+      "resolved": "https://registry.npmjs.org/phantomjs-polyfill/-/phantomjs-polyfill-0.0.2.tgz"
     },
-    "remove-trailing-separator": {
-      "version": "1.0.1",
-      "from": "remove-trailing-separator@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.0.1.tgz"
+    "phantomjs-prebuilt": {
+      "version": "2.1.14",
+      "from": "phantomjs-prebuilt@>=2.1.6 <2.2.0",
+      "resolved": "https://registry.npmjs.org/phantomjs-prebuilt/-/phantomjs-prebuilt-2.1.14.tgz",
+      "dependencies": {
+        "caseless": {
+          "version": "0.11.0",
+          "from": "caseless@>=0.11.0 <0.12.0",
+          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz"
+        },
+        "fs-extra": {
+          "version": "1.0.0",
+          "from": "fs-extra@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-1.0.0.tgz"
+        },
+        "har-validator": {
+          "version": "2.0.6",
+          "from": "har-validator@>=2.0.6 <2.1.0",
+          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz"
+        },
+        "qs": {
+          "version": "6.3.2",
+          "from": "qs@>=6.3.0 <6.4.0",
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.3.2.tgz"
+        },
+        "request": {
+          "version": "2.79.0",
+          "from": "request@>=2.79.0 <2.80.0",
+          "resolved": "https://registry.npmjs.org/request/-/request-2.79.0.tgz"
+        },
+        "tunnel-agent": {
+          "version": "0.4.3",
+          "from": "tunnel-agent@>=0.4.1 <0.5.0",
+          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz"
+        }
+      }
     },
-    "repeat-element": {
-      "version": "1.1.2",
-      "from": "repeat-element@>=1.1.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/repeat-element/-/repeat-element-1.1.2.tgz"
+    "pidof": {
+      "version": "1.0.2",
+      "from": "pidof@>=1.0.2 <1.1.0",
+      "resolved": "https://registry.npmjs.org/pidof/-/pidof-1.0.2.tgz"
     },
-    "repeat-string": {
-      "version": "1.6.1",
-      "from": "repeat-string@>=1.5.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-1.6.1.tgz"
+    "pify": {
+      "version": "2.3.0",
+      "from": "pify@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz"
     },
-    "repeating": {
+    "pinkie": {
+      "version": "2.0.4",
+      "from": "pinkie@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/pinkie/-/pinkie-2.0.4.tgz"
+    },
+    "pinkie-promise": {
       "version": "2.0.1",
-      "from": "repeating@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/repeating/-/repeating-2.0.1.tgz"
+      "from": "pinkie-promise@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz"
     },
-    "replace-ext": {
-      "version": "0.0.1",
-      "from": "replace-ext@0.0.1",
-      "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-0.0.1.tgz"
+    "pkg-conf": {
+      "version": "1.1.3",
+      "from": "pkg-conf@>=1.1.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/pkg-conf/-/pkg-conf-1.1.3.tgz"
     },
-    "replacestream": {
-      "version": "4.0.2",
-      "from": "replacestream@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/replacestream/-/replacestream-4.0.2.tgz"
+    "plur": {
+      "version": "2.1.2",
+      "from": "plur@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/plur/-/plur-2.1.2.tgz"
     },
-    "request": {
-      "version": "2.81.0",
-      "from": "request@>=2.54.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz",
+    "portfinder": {
+      "version": "1.0.13",
+      "from": "portfinder@>=1.0.9 <2.0.0",
+      "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.13.tgz"
+    },
+    "postcss": {
+      "version": "5.2.17",
+      "from": "postcss@>=5.0.21 <6.0.0",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
       "dependencies": {
-        "uuid": {
-          "version": "3.0.1",
-          "from": "uuid@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.0.1.tgz"
+        "supports-color": {
+          "version": "3.2.3",
+          "from": "supports-color@>=3.2.3 <4.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
         }
       }
     },
-    "request-progress": {
-      "version": "2.0.1",
-      "from": "request-progress@>=2.0.1 <2.1.0",
-      "resolved": "https://registry.npmjs.org/request-progress/-/request-progress-2.0.1.tgz"
-    },
-    "require-directory": {
-      "version": "2.1.1",
-      "from": "require-directory@>=2.1.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz"
+    "postcss-calc": {
+      "version": "5.3.1",
+      "from": "postcss-calc@>=5.2.0 <6.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-5.3.1.tgz"
     },
-    "require-from-string": {
-      "version": "1.2.1",
-      "from": "require-from-string@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-1.2.1.tgz"
+    "postcss-colormin": {
+      "version": "2.2.2",
+      "from": "postcss-colormin@>=2.1.8 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-colormin/-/postcss-colormin-2.2.2.tgz"
     },
-    "require-main-filename": {
-      "version": "1.0.1",
-      "from": "require-main-filename@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-1.0.1.tgz"
+    "postcss-convert-values": {
+      "version": "2.6.1",
+      "from": "postcss-convert-values@>=2.3.4 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-convert-values/-/postcss-convert-values-2.6.1.tgz"
     },
-    "requires-port": {
-      "version": "1.0.0",
-      "from": "requires-port@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz"
+    "postcss-discard-comments": {
+      "version": "2.0.4",
+      "from": "postcss-discard-comments@>=2.0.4 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-discard-comments/-/postcss-discard-comments-2.0.4.tgz"
     },
-    "resemblejs": {
-      "version": "2.2.4",
-      "from": "resemblejs@>=2.2.3 <2.3.0",
-      "resolved": "https://registry.npmjs.org/resemblejs/-/resemblejs-2.2.4.tgz"
+    "postcss-discard-duplicates": {
+      "version": "2.1.0",
+      "from": "postcss-discard-duplicates@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-discard-duplicates/-/postcss-discard-duplicates-2.1.0.tgz"
     },
-    "resolve": {
-      "version": "1.3.3",
-      "from": "resolve@>=1.1.7 <2.0.0",
-      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.3.3.tgz"
+    "postcss-discard-empty": {
+      "version": "2.1.0",
+      "from": "postcss-discard-empty@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-discard-empty/-/postcss-discard-empty-2.1.0.tgz"
     },
-    "resolve-dir": {
+    "postcss-discard-overridden": {
       "version": "0.1.1",
-      "from": "resolve-dir@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/resolve-dir/-/resolve-dir-0.1.1.tgz"
-    },
-    "response-time": {
-      "version": "2.3.2",
-      "from": "response-time@>=2.3.1 <2.4.0",
-      "resolved": "https://registry.npmjs.org/response-time/-/response-time-2.3.2.tgz"
-    },
-    "restore-cursor": {
-      "version": "1.0.1",
-      "from": "restore-cursor@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-1.0.1.tgz"
-    },
-    "right-align": {
-      "version": "0.1.3",
-      "from": "right-align@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/right-align/-/right-align-0.1.3.tgz"
+      "from": "postcss-discard-overridden@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/postcss-discard-overridden/-/postcss-discard-overridden-0.1.1.tgz"
     },
-    "rimraf": {
-      "version": "2.5.4",
-      "from": "rimraf@>=2.5.4 <2.6.0",
-      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz"
+    "postcss-discard-unused": {
+      "version": "2.2.3",
+      "from": "postcss-discard-unused@>=2.2.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-discard-unused/-/postcss-discard-unused-2.2.3.tgz"
     },
-    "ripemd160": {
-      "version": "0.2.0",
-      "from": "ripemd160@0.2.0",
-      "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-0.2.0.tgz"
+    "postcss-filter-plugins": {
+      "version": "2.0.2",
+      "from": "postcss-filter-plugins@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-filter-plugins/-/postcss-filter-plugins-2.0.2.tgz"
     },
-    "rndm": {
+    "postcss-load-config": {
       "version": "1.2.0",
-      "from": "rndm@1.2.0",
-      "resolved": "https://registry.npmjs.org/rndm/-/rndm-1.2.0.tgz"
-    },
-    "rtl-css-js": {
-      "version": "1.1.0",
-      "from": "rtl-css-js@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.1.0.tgz"
+      "from": "postcss-load-config@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-1.2.0.tgz"
     },
-    "run-async": {
-      "version": "0.1.0",
-      "from": "run-async@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/run-async/-/run-async-0.1.0.tgz"
+    "postcss-load-options": {
+      "version": "1.2.0",
+      "from": "postcss-load-options@>=1.2.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-load-options/-/postcss-load-options-1.2.0.tgz"
     },
-    "rush-example-app-base": {
-      "version": "0.0.0",
-      "from": "temp_modules/rush-example-app-base",
-      "resolved": "file:temp_modules/rush-example-app-base"
+    "postcss-load-plugins": {
+      "version": "2.3.0",
+      "from": "postcss-load-plugins@>=2.3.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-load-plugins/-/postcss-load-plugins-2.3.0.tgz"
     },
-    "rush-example-component": {
-      "version": "0.0.0",
-      "from": "temp_modules/rush-example-component",
-      "resolved": "file:temp_modules/rush-example-component",
+    "postcss-loader": {
+      "version": "1.3.3",
+      "from": "postcss-loader@>=1.3.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-1.3.3.tgz",
       "dependencies": {
-        "acorn": {
-          "version": "5.0.3",
-          "from": "acorn@>=5.0.0 <6.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
-        },
-        "async": {
-          "version": "2.4.1",
-          "from": "async@>=2.1.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
-        },
-        "autoprefixer": {
-          "version": "6.7.7",
-          "from": "autoprefixer@>=6.7.6 <7.0.0",
-          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.7.7.tgz"
-        },
-        "browserslist": {
-          "version": "1.7.7",
-          "from": "browserslist@>=1.7.6 <2.0.0",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz"
-        },
-        "camelcase": {
-          "version": "3.0.0",
-          "from": "camelcase@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
-        },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "from": "constants-browserify@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
-        },
-        "crypto-browserify": {
-          "version": "3.11.0",
-          "from": "crypto-browserify@>=3.11.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
-        },
-        "enhanced-resolve": {
-          "version": "3.1.0",
-          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "from": "https-browserify@0.0.1",
-          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
-        },
-        "node-libs-browser": {
-          "version": "2.0.0",
-          "from": "node-libs-browser@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
-        },
-        "os-browserify": {
-          "version": "0.2.1",
-          "from": "os-browserify@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
-        },
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.3 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
-        },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "from": "stream-browserify@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.25 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "from": "supports-color@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
-        },
-        "tapable": {
-          "version": "0.2.6",
-          "from": "tapable@>=0.2.5 <0.3.0",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
-        },
-        "timers-browserify": {
-          "version": "2.0.2",
-          "from": "timers-browserify@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
-        },
-        "url": {
-          "version": "0.11.0",
-          "from": "url@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "from": "punycode@1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
-            }
-          }
-        },
-        "watchpack": {
-          "version": "1.3.1",
-          "from": "watchpack@>=1.3.1 <2.0.0",
-          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz"
-        },
-        "webpack": {
-          "version": "2.6.1",
-          "from": "webpack@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz"
-        },
-        "yargs": {
-          "version": "6.6.0",
-          "from": "yargs@>=6.0.0 <7.0.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
-        },
-        "yargs-parser": {
-          "version": "4.2.1",
-          "from": "yargs-parser@>=4.2.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
+        "loader-utils": {
+          "version": "1.1.0",
+          "from": "loader-utils@>=1.0.2 <2.0.0",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
         }
       }
     },
-    "rush-fabric-website": {
-      "version": "0.0.0",
-      "from": "temp_modules/rush-fabric-website",
-      "resolved": "file:temp_modules/rush-fabric-website"
+    "postcss-merge-idents": {
+      "version": "2.1.7",
+      "from": "postcss-merge-idents@>=2.1.5 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-merge-idents/-/postcss-merge-idents-2.1.7.tgz"
     },
-    "rush-office-ui-fabric-react": {
-      "version": "0.0.0",
-      "from": "temp_modules/rush-office-ui-fabric-react",
-      "resolved": "file:temp_modules/rush-office-ui-fabric-react",
+    "postcss-merge-longhand": {
+      "version": "2.0.2",
+      "from": "postcss-merge-longhand@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-merge-longhand/-/postcss-merge-longhand-2.0.2.tgz"
+    },
+    "postcss-merge-rules": {
+      "version": "2.1.2",
+      "from": "postcss-merge-rules@>=2.0.3 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-merge-rules/-/postcss-merge-rules-2.1.2.tgz",
       "dependencies": {
-        "acorn": {
-          "version": "5.0.3",
-          "from": "acorn@>=5.0.0 <6.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
-        },
-        "async": {
-          "version": "2.4.1",
-          "from": "async@>=2.1.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
-        },
-        "autoprefixer": {
-          "version": "6.7.7",
-          "from": "autoprefixer@>=6.7.6 <7.0.0",
-          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.7.7.tgz"
-        },
         "browserslist": {
           "version": "1.7.7",
-          "from": "browserslist@>=1.7.6 <2.0.0",
+          "from": "browserslist@>=1.5.2 <2.0.0",
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz"
-        },
-        "camelcase": {
-          "version": "3.0.0",
-          "from": "camelcase@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
-        },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "from": "constants-browserify@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
-        },
-        "crypto-browserify": {
-          "version": "3.11.0",
-          "from": "crypto-browserify@>=3.11.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
-        },
-        "diff": {
-          "version": "3.2.0",
-          "from": "diff@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/diff/-/diff-3.2.0.tgz"
-        },
-        "enhanced-resolve": {
-          "version": "3.1.0",
-          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
-        },
-        "formatio": {
-          "version": "1.2.0",
-          "from": "formatio@1.2.0",
-          "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.2.0.tgz"
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "from": "https-browserify@0.0.1",
-          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
-        },
-        "isarray": {
-          "version": "0.0.1",
-          "from": "isarray@0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
-        },
-        "lolex": {
-          "version": "1.6.0",
-          "from": "lolex@>=1.6.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz"
-        },
-        "node-libs-browser": {
-          "version": "2.0.0",
-          "from": "node-libs-browser@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
-        },
-        "os-browserify": {
-          "version": "0.2.1",
-          "from": "os-browserify@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
-        },
-        "path-to-regexp": {
-          "version": "1.7.0",
-          "from": "path-to-regexp@>=1.7.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.7.0.tgz"
-        },
-        "samsam": {
-          "version": "1.2.1",
-          "from": "samsam@>=1.1.3 <2.0.0",
-          "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.2.1.tgz"
-        },
-        "sinon": {
-          "version": "2.3.2",
-          "from": "sinon@>=2.1.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/sinon/-/sinon-2.3.2.tgz"
-        },
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.3 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
-        },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "from": "stream-browserify@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.25 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
+        }
+      }
+    },
+    "postcss-message-helpers": {
+      "version": "2.0.0",
+      "from": "postcss-message-helpers@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-message-helpers/-/postcss-message-helpers-2.0.0.tgz"
+    },
+    "postcss-minify-font-values": {
+      "version": "1.0.5",
+      "from": "postcss-minify-font-values@>=1.0.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-minify-font-values/-/postcss-minify-font-values-1.0.5.tgz"
+    },
+    "postcss-minify-gradients": {
+      "version": "1.0.5",
+      "from": "postcss-minify-gradients@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-minify-gradients/-/postcss-minify-gradients-1.0.5.tgz"
+    },
+    "postcss-minify-params": {
+      "version": "1.2.2",
+      "from": "postcss-minify-params@>=1.0.4 <2.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-minify-params/-/postcss-minify-params-1.2.2.tgz"
+    },
+    "postcss-minify-selectors": {
+      "version": "2.1.1",
+      "from": "postcss-minify-selectors@>=2.0.4 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-minify-selectors/-/postcss-minify-selectors-2.1.1.tgz"
+    },
+    "postcss-modules": {
+      "version": "0.5.2",
+      "from": "postcss-modules@>=0.5.0 <0.6.0",
+      "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.5.2.tgz"
+    },
+    "postcss-modules-extract-imports": {
+      "version": "1.1.0",
+      "from": "postcss-modules-extract-imports@1.1.0",
+      "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-1.1.0.tgz",
+      "dependencies": {
+        "postcss": {
+          "version": "6.0.1",
+          "from": "postcss@>=6.0.1 <7.0.0",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.1.0 <4.0.0",
+          "from": "supports-color@>=3.2.3 <4.0.0",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+        }
+      }
+    },
+    "postcss-modules-local-by-default": {
+      "version": "1.2.0",
+      "from": "postcss-modules-local-by-default@1.2.0",
+      "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-1.2.0.tgz",
+      "dependencies": {
+        "postcss": {
+          "version": "6.0.1",
+          "from": "postcss@>=6.0.1 <7.0.0",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
         },
-        "tapable": {
-          "version": "0.2.6",
-          "from": "tapable@>=0.2.5 <0.3.0",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
-        },
-        "timers-browserify": {
-          "version": "2.0.2",
-          "from": "timers-browserify@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
-        },
-        "type-detect": {
-          "version": "4.0.3",
-          "from": "type-detect@>=4.0.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.0.3.tgz"
-        },
-        "url": {
-          "version": "0.11.0",
-          "from": "url@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "from": "punycode@1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
-            }
-          }
+        "supports-color": {
+          "version": "3.2.3",
+          "from": "supports-color@>=3.2.3 <4.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+        }
+      }
+    },
+    "postcss-modules-scope": {
+      "version": "1.1.0",
+      "from": "postcss-modules-scope@1.1.0",
+      "resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-1.1.0.tgz",
+      "dependencies": {
+        "postcss": {
+          "version": "6.0.1",
+          "from": "postcss@>=6.0.1 <7.0.0",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
         },
-        "watchpack": {
-          "version": "1.3.1",
-          "from": "watchpack@>=1.3.1 <2.0.0",
-          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz"
+        "supports-color": {
+          "version": "3.2.3",
+          "from": "supports-color@>=3.2.3 <4.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+        }
+      }
+    },
+    "postcss-modules-values": {
+      "version": "1.3.0",
+      "from": "postcss-modules-values@1.3.0",
+      "resolved": "https://registry.npmjs.org/postcss-modules-values/-/postcss-modules-values-1.3.0.tgz",
+      "dependencies": {
+        "postcss": {
+          "version": "6.0.1",
+          "from": "postcss@>=6.0.1 <7.0.0",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
         },
-        "webpack": {
-          "version": "2.6.1",
-          "from": "webpack@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz"
+        "supports-color": {
+          "version": "3.2.3",
+          "from": "supports-color@>=3.2.3 <4.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+        }
+      }
+    },
+    "postcss-normalize-charset": {
+      "version": "1.1.1",
+      "from": "postcss-normalize-charset@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-normalize-charset/-/postcss-normalize-charset-1.1.1.tgz"
+    },
+    "postcss-normalize-url": {
+      "version": "3.0.8",
+      "from": "postcss-normalize-url@>=3.0.7 <4.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-normalize-url/-/postcss-normalize-url-3.0.8.tgz"
+    },
+    "postcss-ordered-values": {
+      "version": "2.2.3",
+      "from": "postcss-ordered-values@>=2.1.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-ordered-values/-/postcss-ordered-values-2.2.3.tgz"
+    },
+    "postcss-reduce-idents": {
+      "version": "2.4.0",
+      "from": "postcss-reduce-idents@>=2.2.2 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-reduce-idents/-/postcss-reduce-idents-2.4.0.tgz"
+    },
+    "postcss-reduce-initial": {
+      "version": "1.0.1",
+      "from": "postcss-reduce-initial@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-reduce-initial/-/postcss-reduce-initial-1.0.1.tgz"
+    },
+    "postcss-reduce-transforms": {
+      "version": "1.0.4",
+      "from": "postcss-reduce-transforms@>=1.0.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-reduce-transforms/-/postcss-reduce-transforms-1.0.4.tgz"
+    },
+    "postcss-selector-parser": {
+      "version": "2.2.3",
+      "from": "postcss-selector-parser@>=2.2.2 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-2.2.3.tgz"
+    },
+    "postcss-svgo": {
+      "version": "2.1.6",
+      "from": "postcss-svgo@>=2.1.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-svgo/-/postcss-svgo-2.1.6.tgz"
+    },
+    "postcss-unique-selectors": {
+      "version": "2.0.2",
+      "from": "postcss-unique-selectors@>=2.0.2 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-unique-selectors/-/postcss-unique-selectors-2.0.2.tgz"
+    },
+    "postcss-value-parser": {
+      "version": "3.3.0",
+      "from": "postcss-value-parser@>=3.2.3 <4.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-3.3.0.tgz"
+    },
+    "postcss-zindex": {
+      "version": "2.2.0",
+      "from": "postcss-zindex@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-zindex/-/postcss-zindex-2.2.0.tgz"
+    },
+    "prelude-ls": {
+      "version": "1.1.2",
+      "from": "prelude-ls@>=1.1.2 <1.2.0",
+      "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.1.2.tgz"
+    },
+    "prepend-http": {
+      "version": "1.0.4",
+      "from": "prepend-http@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/prepend-http/-/prepend-http-1.0.4.tgz"
+    },
+    "preserve": {
+      "version": "0.2.0",
+      "from": "preserve@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/preserve/-/preserve-0.2.0.tgz"
+    },
+    "pretty-hrtime": {
+      "version": "1.0.3",
+      "from": "pretty-hrtime@>=1.0.2 <1.1.0",
+      "resolved": "https://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz"
+    },
+    "private": {
+      "version": "0.1.7",
+      "from": "private@>=0.1.5 <0.2.0",
+      "resolved": "https://registry.npmjs.org/private/-/private-0.1.7.tgz"
+    },
+    "process": {
+      "version": "0.11.10",
+      "from": "process@>=0.11.0 <0.12.0",
+      "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz"
+    },
+    "process-nextick-args": {
+      "version": "1.0.7",
+      "from": "process-nextick-args@>=1.0.6 <1.1.0",
+      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz"
+    },
+    "progress": {
+      "version": "1.1.8",
+      "from": "progress@>=1.1.8 <1.2.0",
+      "resolved": "https://registry.npmjs.org/progress/-/progress-1.1.8.tgz"
+    },
+    "promise": {
+      "version": "7.1.1",
+      "from": "promise@>=7.0.3 <8.0.0",
+      "resolved": "https://registry.npmjs.org/promise/-/promise-7.1.1.tgz"
+    },
+    "prop-types": {
+      "version": "15.5.10",
+      "from": "prop-types@>=15.5.10 <16.0.0",
+      "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.5.10.tgz",
+      "dependencies": {
+        "core-js": {
+          "version": "1.2.7",
+          "from": "core-js@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
         },
-        "yargs": {
-          "version": "6.6.0",
-          "from": "yargs@>=6.0.0 <7.0.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
+        "fbjs": {
+          "version": "0.8.12",
+          "from": "fbjs@>=0.8.9 <0.9.0",
+          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz"
+        }
+      }
+    },
+    "proxy-addr": {
+      "version": "1.1.4",
+      "from": "proxy-addr@>=1.1.3 <1.2.0",
+      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-1.1.4.tgz"
+    },
+    "prr": {
+      "version": "0.0.0",
+      "from": "prr@>=0.0.0 <0.1.0",
+      "resolved": "https://registry.npmjs.org/prr/-/prr-0.0.0.tgz"
+    },
+    "pseudomap": {
+      "version": "1.0.2",
+      "from": "pseudomap@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/pseudomap/-/pseudomap-1.0.2.tgz"
+    },
+    "public-encrypt": {
+      "version": "4.0.0",
+      "from": "public-encrypt@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/public-encrypt/-/public-encrypt-4.0.0.tgz"
+    },
+    "punycode": {
+      "version": "1.4.1",
+      "from": "punycode@>=1.4.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz"
+    },
+    "q": {
+      "version": "1.5.0",
+      "from": "q@>=1.1.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/q/-/q-1.5.0.tgz"
+    },
+    "qs": {
+      "version": "6.4.0",
+      "from": "qs@>=6.4.0 <6.5.0",
+      "resolved": "https://registry.npmjs.org/qs/-/qs-6.4.0.tgz"
+    },
+    "query-string": {
+      "version": "4.3.4",
+      "from": "query-string@>=4.1.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/query-string/-/query-string-4.3.4.tgz"
+    },
+    "querystring": {
+      "version": "0.2.0",
+      "from": "querystring@0.2.0",
+      "resolved": "https://registry.npmjs.org/querystring/-/querystring-0.2.0.tgz"
+    },
+    "querystring-es3": {
+      "version": "0.2.1",
+      "from": "querystring-es3@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/querystring-es3/-/querystring-es3-0.2.1.tgz"
+    },
+    "querystringify": {
+      "version": "0.0.4",
+      "from": "querystringify@>=0.0.0 <0.1.0",
+      "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-0.0.4.tgz"
+    },
+    "random-bytes": {
+      "version": "1.0.0",
+      "from": "random-bytes@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/random-bytes/-/random-bytes-1.0.0.tgz"
+    },
+    "randomatic": {
+      "version": "1.1.6",
+      "from": "randomatic@>=1.1.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-1.1.6.tgz"
+    },
+    "randombytes": {
+      "version": "2.0.3",
+      "from": "randombytes@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.0.3.tgz"
+    },
+    "range-parser": {
+      "version": "1.2.0",
+      "from": "range-parser@>=1.0.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.0.tgz"
+    },
+    "raw-body": {
+      "version": "2.2.0",
+      "from": "raw-body@>=2.2.0 <2.3.0",
+      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.2.0.tgz"
+    },
+    "raw-loader": {
+      "version": "0.5.1",
+      "from": "raw-loader@>=0.5.1 <0.6.0",
+      "resolved": "https://registry.npmjs.org/raw-loader/-/raw-loader-0.5.1.tgz"
+    },
+    "rc": {
+      "version": "1.2.1",
+      "from": "rc@>=1.1.6 <2.0.0",
+      "resolved": "https://registry.npmjs.org/rc/-/rc-1.2.1.tgz"
+    },
+    "react": {
+      "version": "15.4.2",
+      "from": "react@15.4.2",
+      "resolved": "https://registry.npmjs.org/react/-/react-15.4.2.tgz",
+      "dependencies": {
+        "core-js": {
+          "version": "1.2.7",
+          "from": "core-js@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
         },
-        "yargs-parser": {
-          "version": "4.2.1",
-          "from": "yargs-parser@>=4.2.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
+        "fbjs": {
+          "version": "0.8.12",
+          "from": "fbjs@>=0.8.4 <0.9.0",
+          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz"
         }
       }
     },
-    "rush-office-ui-fabric-react-tslint": {
-      "version": "0.0.0",
-      "from": "temp_modules/rush-office-ui-fabric-react-tslint",
-      "resolved": "file:temp_modules/rush-office-ui-fabric-react-tslint",
+    "react-addons-test-utils": {
+      "version": "15.4.2",
+      "from": "react-addons-test-utils@15.4.2",
+      "resolved": "https://registry.npmjs.org/react-addons-test-utils/-/react-addons-test-utils-15.4.2.tgz",
       "dependencies": {
-        "@microsoft/api-extractor": {
-          "version": "1.1.19",
-          "from": "@microsoft/api-extractor@>=1.1.19 <2.0.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-1.1.19.tgz"
-        },
-        "@microsoft/gulp-core-build-typescript": {
-          "version": "2.4.4",
-          "from": "@microsoft/gulp-core-build-typescript@>=2.4.4 <3.0.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-2.4.4.tgz"
-        },
-        "lodash": {
-          "version": "4.15.0",
-          "from": "lodash@>=4.15.0 <4.16.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.15.0.tgz"
+        "core-js": {
+          "version": "1.2.7",
+          "from": "core-js@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
         },
-        "typescript": {
-          "version": "2.1.6",
-          "from": "typescript@>=2.1.4 <2.2.0",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.1.6.tgz"
+        "fbjs": {
+          "version": "0.8.12",
+          "from": "fbjs@>=0.8.4 <0.9.0",
+          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz"
         }
       }
     },
-    "rush-ssr-tests": {
-      "version": "0.0.0",
-      "from": "temp_modules/rush-ssr-tests",
-      "resolved": "file:temp_modules/rush-ssr-tests",
+    "react-dom": {
+      "version": "15.4.2",
+      "from": "react-dom@15.4.2",
+      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-15.4.2.tgz",
       "dependencies": {
-        "acorn": {
-          "version": "5.0.3",
-          "from": "acorn@>=5.0.0 <6.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
-        },
-        "async": {
-          "version": "2.4.1",
-          "from": "async@>=2.1.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
-        },
-        "camelcase": {
-          "version": "3.0.0",
-          "from": "camelcase@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
+        "core-js": {
+          "version": "1.2.7",
+          "from": "core-js@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
         },
-        "constants-browserify": {
+        "fbjs": {
+          "version": "0.8.12",
+          "from": "fbjs@>=0.8.1 <0.9.0",
+          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz"
+        }
+      }
+    },
+    "react-highlight": {
+      "version": "0.9.0",
+      "from": "react-highlight@0.9.0",
+      "resolved": "https://registry.npmjs.org/react-highlight/-/react-highlight-0.9.0.tgz"
+    },
+    "read": {
+      "version": "1.0.7",
+      "from": "read@>=1.0.3 <1.1.0",
+      "resolved": "https://registry.npmjs.org/read/-/read-1.0.7.tgz"
+    },
+    "read-all-stream": {
+      "version": "3.1.0",
+      "from": "read-all-stream@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/read-all-stream/-/read-all-stream-3.1.0.tgz",
+      "dependencies": {
+        "isarray": {
           "version": "1.0.0",
-          "from": "constants-browserify@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
-        },
-        "crypto-browserify": {
-          "version": "3.11.0",
-          "from": "crypto-browserify@>=3.11.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
-        },
-        "enhanced-resolve": {
-          "version": "3.1.0",
-          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "from": "https-browserify@0.0.1",
-          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
-        },
-        "node-libs-browser": {
-          "version": "2.0.0",
-          "from": "node-libs-browser@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
-        },
-        "os-browserify": {
-          "version": "0.2.1",
-          "from": "os-browserify@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
-        },
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.3 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "from": "stream-browserify@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.25 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "from": "supports-color@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
-        },
-        "tapable": {
-          "version": "0.2.6",
-          "from": "tapable@>=0.2.5 <0.3.0",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
-        },
-        "timers-browserify": {
-          "version": "2.0.2",
-          "from": "timers-browserify@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
-        },
-        "url": {
-          "version": "0.11.0",
-          "from": "url@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "from": "punycode@1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
-            }
-          }
-        },
-        "watchpack": {
-          "version": "1.3.1",
-          "from": "watchpack@>=1.3.1 <2.0.0",
-          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz"
-        },
-        "webpack": {
-          "version": "2.6.1",
-          "from": "webpack@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz"
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+        }
+      }
+    },
+    "read-pkg": {
+      "version": "1.1.0",
+      "from": "read-pkg@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz"
+    },
+    "read-pkg-up": {
+      "version": "1.0.1",
+      "from": "read-pkg-up@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz"
+    },
+    "readable-stream": {
+      "version": "1.1.14",
+      "from": "readable-stream@>=1.1.9 <1.2.0",
+      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz"
+    },
+    "readdirp": {
+      "version": "2.1.0",
+      "from": "readdirp@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-2.1.0.tgz",
+      "dependencies": {
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
-        "yargs": {
-          "version": "6.6.0",
-          "from": "yargs@>=6.0.0 <7.0.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
-        "yargs-parser": {
-          "version": "4.2.1",
-          "from": "yargs-parser@>=4.2.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
+        "string_decoder": {
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+        }
+      }
+    },
+    "readline2": {
+      "version": "1.0.1",
+      "from": "readline2@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/readline2/-/readline2-1.0.1.tgz",
+      "dependencies": {
+        "mute-stream": {
+          "version": "0.0.5",
+          "from": "mute-stream@0.0.5",
+          "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.5.tgz"
+        }
+      }
+    },
+    "recast": {
+      "version": "0.11.23",
+      "from": "recast@>=0.11.12 <0.12.0",
+      "resolved": "https://registry.npmjs.org/recast/-/recast-0.11.23.tgz"
+    },
+    "rechoir": {
+      "version": "0.6.2",
+      "from": "rechoir@>=0.6.2 <0.7.0",
+      "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz"
+    },
+    "redent": {
+      "version": "1.0.0",
+      "from": "redent@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/redent/-/redent-1.0.0.tgz"
+    },
+    "redeyed": {
+      "version": "1.0.1",
+      "from": "redeyed@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/redeyed/-/redeyed-1.0.1.tgz",
+      "dependencies": {
+        "esprima": {
+          "version": "3.0.0",
+          "from": "esprima@>=3.0.0 <3.1.0",
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.0.0.tgz"
         }
       }
     },
-    "rush-styling": {
-      "version": "0.0.0",
-      "from": "temp_modules/rush-styling",
-      "resolved": "file:temp_modules/rush-styling",
+    "reduce-css-calc": {
+      "version": "1.3.0",
+      "from": "reduce-css-calc@>=1.2.6 <2.0.0",
+      "resolved": "https://registry.npmjs.org/reduce-css-calc/-/reduce-css-calc-1.3.0.tgz"
+    },
+    "reduce-function-call": {
+      "version": "1.0.2",
+      "from": "reduce-function-call@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/reduce-function-call/-/reduce-function-call-1.0.2.tgz"
+    },
+    "regenerate": {
+      "version": "1.3.2",
+      "from": "regenerate@>=1.2.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.3.2.tgz"
+    },
+    "regenerator-runtime": {
+      "version": "0.10.5",
+      "from": "regenerator-runtime@>=0.10.0 <0.11.0",
+      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz"
+    },
+    "regex-cache": {
+      "version": "0.4.3",
+      "from": "regex-cache@>=0.4.2 <0.5.0",
+      "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.3.tgz"
+    },
+    "regexpu-core": {
+      "version": "1.0.0",
+      "from": "regexpu-core@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-1.0.0.tgz"
+    },
+    "registry-auth-token": {
+      "version": "3.3.1",
+      "from": "registry-auth-token@>=3.0.1 <4.0.0",
+      "resolved": "https://registry.npmjs.org/registry-auth-token/-/registry-auth-token-3.3.1.tgz"
+    },
+    "registry-url": {
+      "version": "3.1.0",
+      "from": "registry-url@>=3.0.3 <4.0.0",
+      "resolved": "https://registry.npmjs.org/registry-url/-/registry-url-3.1.0.tgz"
+    },
+    "regjsgen": {
+      "version": "0.2.0",
+      "from": "regjsgen@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.2.0.tgz"
+    },
+    "regjsparser": {
+      "version": "0.1.5",
+      "from": "regjsparser@>=0.1.4 <0.2.0",
+      "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz"
+    },
+    "relateurl": {
+      "version": "0.2.7",
+      "from": "relateurl@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/relateurl/-/relateurl-0.2.7.tgz"
+    },
+    "remove-trailing-separator": {
+      "version": "1.0.1",
+      "from": "remove-trailing-separator@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.0.1.tgz"
+    },
+    "repeat-element": {
+      "version": "1.1.2",
+      "from": "repeat-element@>=1.1.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/repeat-element/-/repeat-element-1.1.2.tgz"
+    },
+    "repeat-string": {
+      "version": "1.6.1",
+      "from": "repeat-string@>=1.5.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-1.6.1.tgz"
+    },
+    "repeating": {
+      "version": "2.0.1",
+      "from": "repeating@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/repeating/-/repeating-2.0.1.tgz"
+    },
+    "replace-ext": {
+      "version": "0.0.1",
+      "from": "replace-ext@0.0.1",
+      "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-0.0.1.tgz"
+    },
+    "replacestream": {
+      "version": "4.0.2",
+      "from": "replacestream@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/replacestream/-/replacestream-4.0.2.tgz",
       "dependencies": {
-        "acorn": {
-          "version": "5.0.3",
-          "from": "acorn@>=5.0.0 <6.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
-        },
-        "async": {
-          "version": "2.4.1",
-          "from": "async@>=2.1.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
-        },
-        "camelcase": {
-          "version": "3.0.0",
-          "from": "camelcase@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
-        },
-        "constants-browserify": {
+        "isarray": {
           "version": "1.0.0",
-          "from": "constants-browserify@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
-        },
-        "crypto-browserify": {
-          "version": "3.11.0",
-          "from": "crypto-browserify@>=3.11.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
-        },
-        "enhanced-resolve": {
-          "version": "3.1.0",
-          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "from": "https-browserify@0.0.1",
-          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
-        },
-        "node-libs-browser": {
-          "version": "2.0.0",
-          "from": "node-libs-browser@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
-        },
-        "os-browserify": {
-          "version": "0.2.1",
-          "from": "os-browserify@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
-        },
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.3 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "from": "stream-browserify@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.25 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "from": "supports-color@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
-        },
-        "tapable": {
-          "version": "0.2.6",
-          "from": "tapable@>=0.2.5 <0.3.0",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
-        },
-        "timers-browserify": {
-          "version": "2.0.2",
-          "from": "timers-browserify@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
-        },
-        "url": {
-          "version": "0.11.0",
-          "from": "url@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "from": "punycode@1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
-            }
-          }
-        },
-        "watchpack": {
-          "version": "1.3.1",
-          "from": "watchpack@>=1.3.1 <2.0.0",
-          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz"
-        },
-        "webpack": {
-          "version": "2.6.1",
-          "from": "webpack@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz"
-        },
-        "yargs": {
-          "version": "6.6.0",
-          "from": "yargs@>=6.0.0 <7.0.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
-        },
-        "yargs-parser": {
-          "version": "4.2.1",
-          "from": "yargs-parser@>=4.2.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
-    "rush-test-bundle-button": {
-      "version": "0.0.0",
-      "from": "temp_modules/rush-test-bundle-button",
-      "resolved": "file:temp_modules/rush-test-bundle-button"
+    "request": {
+      "version": "2.81.0",
+      "from": "request@>=2.81.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz"
+    },
+    "request-progress": {
+      "version": "2.0.1",
+      "from": "request-progress@>=2.0.1 <2.1.0",
+      "resolved": "https://registry.npmjs.org/request-progress/-/request-progress-2.0.1.tgz"
+    },
+    "require-directory": {
+      "version": "2.1.1",
+      "from": "require-directory@>=2.1.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz"
+    },
+    "require-from-string": {
+      "version": "1.2.1",
+      "from": "require-from-string@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-1.2.1.tgz"
+    },
+    "require-main-filename": {
+      "version": "1.0.1",
+      "from": "require-main-filename@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-1.0.1.tgz"
+    },
+    "requires-port": {
+      "version": "1.0.0",
+      "from": "requires-port@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz"
+    },
+    "resemblejs": {
+      "version": "2.2.4",
+      "from": "resemblejs@>=2.2.3 <2.3.0",
+      "resolved": "https://registry.npmjs.org/resemblejs/-/resemblejs-2.2.4.tgz"
+    },
+    "resolve": {
+      "version": "1.3.3",
+      "from": "resolve@>=1.1.7 <2.0.0",
+      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.3.3.tgz"
+    },
+    "resolve-dir": {
+      "version": "0.1.1",
+      "from": "resolve-dir@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/resolve-dir/-/resolve-dir-0.1.1.tgz"
+    },
+    "response-time": {
+      "version": "2.3.2",
+      "from": "response-time@>=2.3.1 <2.4.0",
+      "resolved": "https://registry.npmjs.org/response-time/-/response-time-2.3.2.tgz"
+    },
+    "restore-cursor": {
+      "version": "1.0.1",
+      "from": "restore-cursor@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-1.0.1.tgz"
+    },
+    "right-align": {
+      "version": "0.1.3",
+      "from": "right-align@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/right-align/-/right-align-0.1.3.tgz"
+    },
+    "rimraf": {
+      "version": "2.6.1",
+      "from": "rimraf@>=2.2.8 <3.0.0",
+      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.1.tgz"
     },
-    "rush-todo-app": {
-      "version": "0.0.0",
-      "from": "temp_modules/rush-todo-app",
-      "resolved": "file:temp_modules/rush-todo-app"
+    "ripemd160": {
+      "version": "0.2.0",
+      "from": "ripemd160@0.2.0",
+      "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-0.2.0.tgz"
     },
-    "rush-utilities": {
-      "version": "0.0.0",
-      "from": "temp_modules/rush-utilities",
-      "resolved": "file:temp_modules/rush-utilities",
-      "dependencies": {
-        "diff": {
-          "version": "3.2.0",
-          "from": "diff@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/diff/-/diff-3.2.0.tgz"
-        },
-        "formatio": {
-          "version": "1.2.0",
-          "from": "formatio@1.2.0",
-          "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.2.0.tgz"
-        },
-        "isarray": {
-          "version": "0.0.1",
-          "from": "isarray@0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
-        },
-        "lolex": {
-          "version": "1.6.0",
-          "from": "lolex@>=1.6.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz"
-        },
-        "path-to-regexp": {
-          "version": "1.7.0",
-          "from": "path-to-regexp@>=1.7.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.7.0.tgz"
-        },
-        "samsam": {
-          "version": "1.2.1",
-          "from": "samsam@>=1.1.3 <2.0.0",
-          "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.2.1.tgz"
-        },
-        "sinon": {
-          "version": "2.3.2",
-          "from": "sinon@>=2.1.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/sinon/-/sinon-2.3.2.tgz"
-        },
-        "type-detect": {
-          "version": "4.0.3",
-          "from": "type-detect@>=4.0.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.0.3.tgz"
-        }
-      }
+    "rndm": {
+      "version": "1.2.0",
+      "from": "rndm@1.2.0",
+      "resolved": "https://registry.npmjs.org/rndm/-/rndm-1.2.0.tgz"
+    },
+    "rtl-css-js": {
+      "version": "1.1.0",
+      "from": "rtl-css-js@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.1.0.tgz"
+    },
+    "run-async": {
+      "version": "0.1.0",
+      "from": "run-async@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/run-async/-/run-async-0.1.0.tgz"
     },
     "rx-lite": {
       "version": "3.1.2",
@@ -7661,9 +8113,9 @@
       }
     },
     "sax": {
-      "version": "1.2.2",
-      "from": "sax@>=1.2.1 <1.3.0",
-      "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.2.tgz"
+      "version": "0.5.2",
+      "from": "sax@0.5.2",
+      "resolved": "https://registry.npmjs.org/sax/-/sax-0.5.2.tgz"
     },
     "script-loader": {
       "version": "0.7.0",
@@ -7802,7 +8254,7 @@
     },
     "setimmediate": {
       "version": "1.0.5",
-      "from": "setimmediate@>=1.0.5 <2.0.0",
+      "from": "setimmediate@>=1.0.4 <2.0.0",
       "resolved": "https://registry.npmjs.org/setimmediate/-/setimmediate-1.0.5.tgz"
     },
     "setprototypeof": {
@@ -7848,21 +8300,41 @@
       "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.2.tgz"
     },
     "sinon": {
-      "version": "1.17.7",
-      "from": "sinon@>=1.17.3 <1.18.0",
-      "resolved": "https://registry.npmjs.org/sinon/-/sinon-1.17.7.tgz",
+      "version": "2.3.2",
+      "from": "sinon@2.3.2",
+      "resolved": "https://registry.npmjs.org/sinon/-/sinon-2.3.2.tgz",
       "dependencies": {
+        "formatio": {
+          "version": "1.2.0",
+          "from": "formatio@1.2.0",
+          "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.2.0.tgz"
+        },
         "lolex": {
-          "version": "1.3.2",
-          "from": "lolex@1.3.2",
-          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.3.2.tgz"
+          "version": "1.6.0",
+          "from": "lolex@>=1.6.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz"
+        },
+        "path-to-regexp": {
+          "version": "1.7.0",
+          "from": "path-to-regexp@>=1.7.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.7.0.tgz"
+        },
+        "samsam": {
+          "version": "1.2.1",
+          "from": "samsam@>=1.1.3 <2.0.0",
+          "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.2.1.tgz"
+        },
+        "type-detect": {
+          "version": "4.0.3",
+          "from": "type-detect@>=4.0.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.0.3.tgz"
         }
       }
     },
     "sinon-chai": {
-      "version": "2.8.0",
-      "from": "sinon-chai@>=2.8.0 <2.9.0",
-      "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.8.0.tgz"
+      "version": "2.10.0",
+      "from": "sinon-chai@2.10.0",
+      "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.10.0.tgz"
     },
     "sliced": {
       "version": "1.0.1",
@@ -7950,11 +8422,6 @@
           "from": "debug@2.2.0",
           "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
         },
-        "isarray": {
-          "version": "0.0.1",
-          "from": "isarray@0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
-        },
         "ms": {
           "version": "0.7.1",
           "from": "ms@0.7.1",
@@ -7965,7 +8432,14 @@
     "sockjs": {
       "version": "0.3.18",
       "from": "sockjs@0.3.18",
-      "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.18.tgz"
+      "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.18.tgz",
+      "dependencies": {
+        "uuid": {
+          "version": "2.0.3",
+          "from": "uuid@>=2.0.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz"
+        }
+      }
     },
     "sockjs-client": {
       "version": "1.1.2",
@@ -7990,15 +8464,14 @@
       "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-0.1.8.tgz"
     },
     "source-map": {
-      "version": "0.2.0",
-      "from": "source-map@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.2.0.tgz",
-      "optional": true
+      "version": "0.5.6",
+      "from": "source-map@>=0.5.3 <0.6.0",
+      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
     },
     "source-map-loader": {
-      "version": "0.2.1",
-      "from": "source-map-loader@0.2.1",
-      "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz",
+      "version": "0.1.6",
+      "from": "source-map-loader@>=0.1.5 <0.2.0",
+      "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.1.6.tgz",
       "dependencies": {
         "async": {
           "version": "0.9.2",
@@ -8053,6 +8526,21 @@
           "version": "2.6.8",
           "from": "debug@>=2.6.8 <3.0.0",
           "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz"
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.2.9 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+        },
+        "string_decoder": {
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
@@ -8062,9 +8550,9 @@
       "resolved": "https://registry.npmjs.org/split/-/split-0.2.10.tgz"
     },
     "sprintf-js": {
-      "version": "1.0.3",
-      "from": "sprintf-js@>=1.0.2 <1.1.0",
-      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz"
+      "version": "1.1.0",
+      "from": "sprintf-js@>=1.0.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.1.0.tgz"
     },
     "sshpk": {
       "version": "1.13.0",
@@ -8086,30 +8574,30 @@
     "stdout-stream": {
       "version": "1.4.0",
       "from": "stdout-stream@>=1.4.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/stdout-stream/-/stdout-stream-1.4.0.tgz"
-    },
-    "stream-browserify": {
-      "version": "1.0.0",
-      "from": "stream-browserify@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-1.0.0.tgz",
+      "resolved": "https://registry.npmjs.org/stdout-stream/-/stdout-stream-1.4.0.tgz",
       "dependencies": {
         "isarray": {
-          "version": "0.0.1",
-          "from": "isarray@0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
-          "version": "1.1.14",
-          "from": "readable-stream@>=1.0.27-1 <2.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz"
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.0 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
+    "stream-browserify": {
+      "version": "1.0.0",
+      "from": "stream-browserify@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-1.0.0.tgz"
+    },
     "stream-combiner": {
       "version": "0.0.4",
       "from": "stream-combiner@>=0.0.3 <0.1.0",
@@ -8123,30 +8611,30 @@
     "stream-counter": {
       "version": "0.2.0",
       "from": "stream-counter@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/stream-counter/-/stream-counter-0.2.0.tgz",
+      "resolved": "https://registry.npmjs.org/stream-counter/-/stream-counter-0.2.0.tgz"
+    },
+    "stream-http": {
+      "version": "2.7.1",
+      "from": "stream-http@>=2.3.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/stream-http/-/stream-http-2.7.1.tgz",
       "dependencies": {
         "isarray": {
-          "version": "0.0.1",
-          "from": "isarray@0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
-          "version": "1.1.14",
-          "from": "readable-stream@>=1.1.8 <1.2.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz"
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.2.6 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.0 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
-    "stream-http": {
-      "version": "2.7.1",
-      "from": "stream-http@>=2.3.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/stream-http/-/stream-http-2.7.1.tgz"
-    },
     "stream-shift": {
       "version": "1.0.0",
       "from": "stream-shift@>=1.0.0 <2.0.0",
@@ -8158,13 +8646,13 @@
       "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz"
     },
     "string_decoder": {
-      "version": "1.0.1",
-      "from": "string_decoder@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+      "version": "0.10.31",
+      "from": "string_decoder@>=0.10.0 <0.11.0",
+      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
     },
     "string-hash": {
       "version": "1.1.3",
-      "from": "string-hash@>=1.1.1 <2.0.0",
+      "from": "string-hash@>=1.1.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/string-hash/-/string-hash-1.1.3.tgz"
     },
     "string-width": {
@@ -8251,10 +8739,20 @@
       "from": "svgo@>=0.7.0 <0.8.0",
       "resolved": "https://registry.npmjs.org/svgo/-/svgo-0.7.2.tgz",
       "dependencies": {
+        "esprima": {
+          "version": "2.7.3",
+          "from": "esprima@>=2.6.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz"
+        },
         "js-yaml": {
           "version": "3.7.0",
           "from": "js-yaml@>=3.7.0 <3.8.0",
           "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.7.0.tgz"
+        },
+        "sax": {
+          "version": "1.2.2",
+          "from": "sax@>=1.2.1 <1.3.0",
+          "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.2.tgz"
         }
       }
     },
@@ -8306,7 +8804,24 @@
     "through2": {
       "version": "2.0.3",
       "from": "through2@>=2.0.1 <2.1.0",
-      "resolved": "https://registry.npmjs.org/through2/-/through2-2.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/through2/-/through2-2.0.3.tgz",
+      "dependencies": {
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.1.5 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+        },
+        "string_decoder": {
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+        }
+      }
     },
     "through2-concurrent": {
       "version": "1.1.1",
@@ -8329,9 +8844,9 @@
       "resolved": "https://registry.npmjs.org/time-stamp/-/time-stamp-1.1.0.tgz"
     },
     "timed-out": {
-      "version": "4.0.1",
-      "from": "timed-out@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-4.0.1.tgz"
+      "version": "3.1.3",
+      "from": "timed-out@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-3.1.3.tgz"
     },
     "timers-browserify": {
       "version": "1.4.2",
@@ -8471,36 +8986,6 @@
       "from": "tslint@4.0.2",
       "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.0.2.tgz",
       "dependencies": {
-        "ansi-align": {
-          "version": "1.1.0",
-          "from": "ansi-align@>=1.1.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-1.1.0.tgz"
-        },
-        "boxen": {
-          "version": "0.6.0",
-          "from": "boxen@>=0.6.0 <0.7.0",
-          "resolved": "https://registry.npmjs.org/boxen/-/boxen-0.6.0.tgz"
-        },
-        "configstore": {
-          "version": "2.1.0",
-          "from": "configstore@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/configstore/-/configstore-2.1.0.tgz"
-        },
-        "diff": {
-          "version": "3.2.0",
-          "from": "diff@>=3.0.1 <4.0.0",
-          "resolved": "https://registry.npmjs.org/diff/-/diff-3.2.0.tgz"
-        },
-        "dot-prop": {
-          "version": "3.0.0",
-          "from": "dot-prop@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-3.0.0.tgz"
-        },
-        "duplexer2": {
-          "version": "0.1.4",
-          "from": "duplexer2@>=0.1.4 <0.2.0",
-          "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.1.4.tgz"
-        },
         "findup-sync": {
           "version": "0.3.0",
           "from": "findup-sync@>=0.3.0 <0.4.0",
@@ -8512,51 +8997,6 @@
               "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
             }
           }
-        },
-        "got": {
-          "version": "5.7.1",
-          "from": "got@>=5.0.0 <6.0.0",
-          "resolved": "https://registry.npmjs.org/got/-/got-5.7.1.tgz"
-        },
-        "latest-version": {
-          "version": "2.0.0",
-          "from": "latest-version@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-2.0.0.tgz"
-        },
-        "lazy-req": {
-          "version": "1.1.0",
-          "from": "lazy-req@>=1.1.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/lazy-req/-/lazy-req-1.1.0.tgz"
-        },
-        "package-json": {
-          "version": "2.4.0",
-          "from": "package-json@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/package-json/-/package-json-2.4.0.tgz"
-        },
-        "timed-out": {
-          "version": "3.1.3",
-          "from": "timed-out@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-3.1.3.tgz"
-        },
-        "unzip-response": {
-          "version": "1.0.2",
-          "from": "unzip-response@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-1.0.2.tgz"
-        },
-        "update-notifier": {
-          "version": "1.0.3",
-          "from": "update-notifier@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-1.0.3.tgz"
-        },
-        "write-file-atomic": {
-          "version": "1.3.4",
-          "from": "write-file-atomic@>=1.1.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-1.3.4.tgz"
-        },
-        "xdg-basedir": {
-          "version": "2.0.0",
-          "from": "xdg-basedir@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-2.0.0.tgz"
         }
       }
     },
@@ -8612,9 +9052,9 @@
       "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz"
     },
     "typescript": {
-      "version": "2.2.2",
-      "from": "typescript@2.2.2",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
+      "version": "2.3.3",
+      "from": "typescript@2.3.3",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.3.3.tgz"
     },
     "ua-parser-js": {
       "version": "0.7.12",
@@ -8636,11 +9076,6 @@
           "from": "cliui@>=2.1.0 <3.0.0",
           "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz"
         },
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.1 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
-        },
         "window-size": {
           "version": "0.1.0",
           "from": "window-size@0.1.0",
@@ -8666,14 +9101,7 @@
     "uglifyjs-webpack-plugin": {
       "version": "0.4.3",
       "from": "uglifyjs-webpack-plugin@>=0.4.3 <0.5.0",
-      "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-0.4.3.tgz",
-      "dependencies": {
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.6 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
-        }
-      }
+      "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-0.4.3.tgz"
     },
     "uid-safe": {
       "version": "2.1.4",
@@ -8731,14 +9159,14 @@
       "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz"
     },
     "unzip-response": {
-      "version": "2.0.1",
-      "from": "unzip-response@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-2.0.1.tgz"
+      "version": "1.0.2",
+      "from": "unzip-response@>=1.0.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-1.0.2.tgz"
     },
     "update-notifier": {
-      "version": "2.1.0",
-      "from": "update-notifier@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-2.1.0.tgz"
+      "version": "1.0.3",
+      "from": "update-notifier@>=1.0.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-1.0.3.tgz"
     },
     "upper-case": {
       "version": "1.1.3",
@@ -8814,9 +9242,9 @@
       "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.0.tgz"
     },
     "uuid": {
-      "version": "2.0.3",
-      "from": "uuid@>=2.0.3 <3.0.0",
-      "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz"
+      "version": "3.0.1",
+      "from": "uuid@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.0.1.tgz"
     },
     "v8flags": {
       "version": "2.1.1",
@@ -8883,21 +9311,11 @@
           "from": "graceful-fs@>=3.0.0 <4.0.0",
           "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-3.0.11.tgz"
         },
-        "isarray": {
-          "version": "0.0.1",
-          "from": "isarray@0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
-        },
         "readable-stream": {
           "version": "1.0.34",
           "from": "readable-stream@>=1.0.33-1 <1.1.0-0",
           "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
         },
-        "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.0 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
-        },
         "through2": {
           "version": "0.6.5",
           "from": "through2@>=0.6.1 <0.7.0",
@@ -8935,14 +9353,7 @@
     "vinyl-sourcemaps-apply": {
       "version": "0.2.1",
       "from": "vinyl-sourcemaps-apply@>=0.2.1 <0.3.0",
-      "resolved": "https://registry.npmjs.org/vinyl-sourcemaps-apply/-/vinyl-sourcemaps-apply-0.2.1.tgz",
-      "dependencies": {
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.1 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
-        }
-      }
+      "resolved": "https://registry.npmjs.org/vinyl-sourcemaps-apply/-/vinyl-sourcemaps-apply-0.2.1.tgz"
     },
     "vm-browserify": {
       "version": "0.0.4",
@@ -9011,6 +9422,11 @@
           "from": "https-browserify@0.0.1",
           "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
         },
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+        },
         "node-libs-browser": {
           "version": "2.0.0",
           "from": "node-libs-browser@>=2.0.0 <3.0.0",
@@ -9021,21 +9437,23 @@
           "from": "os-browserify@>=0.2.0 <0.3.0",
           "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
         },
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.3 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.5 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "dependencies": {
+            "string_decoder": {
+              "version": "1.0.1",
+              "from": "string_decoder@>=1.0.0 <1.1.0",
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+            }
+          }
         },
         "stream-browserify": {
           "version": "2.0.1",
           "from": "stream-browserify@>=2.0.1 <3.0.0",
           "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
         },
-        "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.25 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
-        },
         "supports-color": {
           "version": "3.2.3",
           "from": "supports-color@>=3.1.0 <4.0.0",
@@ -9110,6 +9528,11 @@
           "from": "fresh@0.5.0",
           "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.0.tgz"
         },
+        "lodash": {
+          "version": "4.17.4",
+          "from": "lodash@>=4.17.4 <5.0.0",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz"
+        },
         "mime": {
           "version": "1.3.4",
           "from": "mime@1.3.4",
@@ -9217,11 +9640,6 @@
           "version": "1.1.2",
           "from": "source-list-map@>=1.1.1 <2.0.0",
           "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-1.1.2.tgz"
-        },
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.3 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
         }
       }
     },
@@ -9240,11 +9658,6 @@
       "from": "webpack-stream@>=3.2.0 <3.3.0",
       "resolved": "https://registry.npmjs.org/webpack-stream/-/webpack-stream-3.2.0.tgz",
       "dependencies": {
-        "browserify-aes": {
-          "version": "0.4.0",
-          "from": "browserify-aes@0.4.0",
-          "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-0.4.0.tgz"
-        },
         "camelcase": {
           "version": "1.2.1",
           "from": "camelcase@>=1.0.2 <2.0.0",
@@ -9275,6 +9688,11 @@
           "from": "interpret@>=0.6.4 <0.7.0",
           "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz"
         },
+        "isarray": {
+          "version": "1.0.0",
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+        },
         "memory-fs": {
           "version": "0.3.0",
           "from": "memory-fs@>=0.3.0 <0.4.0",
@@ -9283,17 +9701,24 @@
         "node-libs-browser": {
           "version": "0.7.0",
           "from": "node-libs-browser@>=0.7.0 <0.8.0",
-          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-0.7.0.tgz"
+          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-0.7.0.tgz",
+          "dependencies": {
+            "string_decoder": {
+              "version": "0.10.31",
+              "from": "string_decoder@^0.10.25",
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
+            }
+          }
         },
         "os-browserify": {
           "version": "0.2.1",
           "from": "os-browserify@>=0.2.0 <0.3.0",
           "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
         },
-        "source-map": {
-          "version": "0.5.6",
-          "from": "source-map@>=0.5.1 <0.6.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
+        "readable-stream": {
+          "version": "2.2.9",
+          "from": "readable-stream@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "stream-browserify": {
           "version": "2.0.1",
@@ -9301,9 +9726,9 @@
           "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
         },
         "string_decoder": {
-          "version": "0.10.31",
-          "from": "string_decoder@>=0.10.25 <0.11.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
+          "version": "1.0.1",
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         },
         "supports-color": {
           "version": "3.2.3",
@@ -9371,11 +9796,6 @@
       "from": "webpack-visualizer-plugin@>=0.1.5 <0.2.0",
       "resolved": "https://registry.npmjs.org/webpack-visualizer-plugin/-/webpack-visualizer-plugin-0.1.11.tgz",
       "dependencies": {
-        "fbjs": {
-          "version": "0.6.1",
-          "from": "fbjs@>=0.6.1 <0.7.0",
-          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.6.1.tgz"
-        },
         "react": {
           "version": "0.14.9",
           "from": "react@>=0.14.0 <0.15.0",
@@ -9385,11 +9805,6 @@
           "version": "0.14.9",
           "from": "react-dom@>=0.14.0 <0.15.0",
           "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-0.14.9.tgz"
-        },
-        "whatwg-fetch": {
-          "version": "0.9.0",
-          "from": "whatwg-fetch@>=0.9.0 <0.10.0",
-          "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-0.9.0.tgz"
         }
       }
     },
@@ -9404,9 +9819,9 @@
       "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.1.tgz"
     },
     "whatwg-fetch": {
-      "version": "2.0.3",
-      "from": "whatwg-fetch@>=0.10.0",
-      "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-2.0.3.tgz"
+      "version": "0.9.0",
+      "from": "whatwg-fetch@>=0.9.0 <0.10.0",
+      "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-0.9.0.tgz"
     },
     "whet.extend": {
       "version": "0.9.9",
@@ -9454,9 +9869,9 @@
       "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz"
     },
     "write-file-atomic": {
-      "version": "2.1.0",
-      "from": "write-file-atomic@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.1.0.tgz"
+      "version": "1.3.4",
+      "from": "write-file-atomic@>=1.1.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-1.3.4.tgz"
     },
     "ws": {
       "version": "1.1.4",
@@ -9469,9 +9884,9 @@
       "resolved": "https://registry.npmjs.org/wtf-8/-/wtf-8-1.0.0.tgz"
     },
     "xdg-basedir": {
-      "version": "3.0.0",
-      "from": "xdg-basedir@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-3.0.0.tgz"
+      "version": "2.0.0",
+      "from": "xdg-basedir@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-2.0.0.tgz"
     },
     "xml": {
       "version": "1.0.1",
@@ -9486,14 +9901,7 @@
     "xml2js": {
       "version": "0.2.7",
       "from": "xml2js@0.2.7",
-      "resolved": "https://registry.npmjs.org/xml2js/-/xml2js-0.2.7.tgz",
-      "dependencies": {
-        "sax": {
-          "version": "0.5.2",
-          "from": "sax@0.5.2",
-          "resolved": "https://registry.npmjs.org/sax/-/sax-0.5.2.tgz"
-        }
-      }
+      "resolved": "https://registry.npmjs.org/xml2js/-/xml2js-0.2.7.tgz"
     },
     "xmlbuilder": {
       "version": "0.4.3",
diff --git a/common/pinnedVersions.json b/common/config/rush/pinned-versions.json
similarity index 52%
rename from common/pinnedVersions.json
rename to common/config/rush/pinned-versions.json
index 89debca8fabc0..ad579bbec3fc5 100644
--- a/common/pinnedVersions.json
+++ b/common/config/rush/pinned-versions.json
@@ -5,5 +5,9 @@
   "enzyme": "2.7.0",
   "webpack": "2.2.1",
   "tslint": "4.0.2",
-  "tslint-microsoft-contrib": "4.0.0"
+  "tslint-microsoft-contrib": "4.0.0",
+  "karma-sinon-chai": "1.3.1",
+  "typescript": "2.3.3",
+  "sinon-chai": "2.10.0",
+  "sinon": "2.3.2"
 }
\ No newline at end of file
diff --git a/common/package.json b/common/package.json
deleted file mode 100644
index 9f2d7fee0a56e..0000000000000
--- a/common/package.json
+++ /dev/null
@@ -1,25 +0,0 @@
-{
-  "dependencies": {
-    "react": "15.4.2",
-    "react-addons-test-utils": "15.4.2",
-    "react-dom": "15.4.2",
-    "enzyme": "2.7.0",
-    "webpack": "2.2.1",
-    "tslint": "4.0.2",
-    "tslint-microsoft-contrib": "4.0.0",
-    "rush-example-app-base": "file:./temp_modules/rush-example-app-base",
-    "rush-example-component": "file:./temp_modules/rush-example-component",
-    "rush-fabric-website": "file:./temp_modules/rush-fabric-website",
-    "rush-office-ui-fabric-react": "file:./temp_modules/rush-office-ui-fabric-react",
-    "rush-office-ui-fabric-react-tslint": "file:./temp_modules/rush-office-ui-fabric-react-tslint",
-    "rush-ssr-tests": "file:./temp_modules/rush-ssr-tests",
-    "rush-styling": "file:./temp_modules/rush-styling",
-    "rush-test-bundle-button": "file:./temp_modules/rush-test-bundle-button",
-    "rush-todo-app": "file:./temp_modules/rush-todo-app",
-    "rush-utilities": "file:./temp_modules/rush-utilities"
-  },
-  "description": "Temporary file generated by the Rush tool",
-  "name": "rush-common",
-  "private": true,
-  "version": "0.0.0"
-}
diff --git a/common/temp_modules/rush-example-app-base/package.json b/common/temp_modules/rush-example-app-base/package.json
deleted file mode 100644
index 020410702077f..0000000000000
--- a/common/temp_modules/rush-example-app-base/package.json
+++ /dev/null
@@ -1,32 +0,0 @@
-{
-  "name": "rush-example-app-base",
-  "version": "0.0.0",
-  "private": true,
-  "dependencies": {
-    "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
-    "@types/chai": "^3.4.35",
-    "@types/enzyme": "^2.7.5",
-    "@types/es6-promise": "^0.0.32",
-    "@types/mocha": "^2.2.39",
-    "@types/react": "^15.0.25",
-    "@types/react-addons-test-utils": "^0.14.18",
-    "@types/react-dom": "^15.5.0",
-    "@types/webpack-env": "^1.13.0",
-    "enzyme": "^2.7.0",
-    "es6-promise": "4.1.0",
-    "gulp": "~3.9.1",
-    "mocha": "~3.3.0",
-    "react": "^15.4.2",
-    "react-addons-test-utils": "^15.4.2",
-    "react-dom": "^15.4.2",
-    "source-map-loader": "0.2.1",
-    "typescript": "2.2.2",
-    "highlight.js": "^9.9.0",
-    "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=2.11.0-0 <3.0.0-0"
-  },
-  "rushDependencies": {
-    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
-    "@uifabric/utilities": "1.10.2"
-  }
-}
diff --git a/common/temp_modules/rush-example-component/package.json b/common/temp_modules/rush-example-component/package.json
deleted file mode 100644
index df5661cab0558..0000000000000
--- a/common/temp_modules/rush-example-component/package.json
+++ /dev/null
@@ -1,41 +0,0 @@
-{
-  "name": "rush-example-component",
-  "version": "0.0.0",
-  "private": true,
-  "dependencies": {
-    "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
-    "@microsoft/load-themed-styles": "^1.2.2",
-    "@types/chai": "^3.4.35",
-    "@types/enzyme": "^2.7.5",
-    "@types/es6-promise": "^0.0.32",
-    "@types/mocha": "^2.2.39",
-    "@types/react": "^15.0.25",
-    "@types/react-addons-test-utils": "^0.14.18",
-    "@types/react-dom": "^15.5.0",
-    "@types/webpack-env": "^1.13.0",
-    "autoprefixer": "^6.7.6",
-    "chai": "^3.5.0",
-    "css-loader": "^0.28.0",
-    "load-themed-styles-loader": "^0.0.3",
-    "mocha": "^3.2.0",
-    "mocha-loader": "^1.1.1",
-    "node-sass": "^4.5.0",
-    "postcss-loader": "^1.3.3",
-    "react": "^15.4.2",
-    "react-addons-test-utils": "^15.4.2",
-    "react-dom": "^15.4.2",
-    "sass-loader": "^6.0.3",
-    "style-loader": "^0.17.0",
-    "ts-loader": "^2.0.1",
-    "typescript": "2.2.2",
-    "webpack": "^2.4.1",
-    "webpack-dev-server": "^2.4.1",
-    "webpack-notifier": "^1.5.0"
-  },
-  "rushDependencies": {
-    "@uifabric/example-app-base": "1.3.14",
-    "@uifabric/utilities": "1.10.2",
-    "office-ui-fabric-react": ">=2.34.2 <3.0.0",
-    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0"
-  }
-}
diff --git a/common/temp_modules/rush-fabric-website/package.json b/common/temp_modules/rush-fabric-website/package.json
deleted file mode 100644
index 9aabe7ffffdf4..0000000000000
--- a/common/temp_modules/rush-fabric-website/package.json
+++ /dev/null
@@ -1,46 +0,0 @@
-{
-  "name": "rush-fabric-website",
-  "version": "0.0.0",
-  "private": true,
-  "dependencies": {
-    "@microsoft/load-themed-styles": "^1.2.2",
-    "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
-    "@types/chai": "^3.4.35",
-    "@types/enzyme": "^2.7.5",
-    "@types/es6-promise": "^0.0.32",
-    "@types/mocha": "^2.2.39",
-    "@types/react": "^15.0.16",
-    "@types/react-addons-test-utils": "^0.14.17",
-    "@types/react-dom": "^15.5.0",
-    "@types/webpack-env": "^1.13.0",
-    "es6-promise": "4.1.0",
-    "git-rev": "0.2.1",
-    "gulp": "~3.9.1",
-    "gulp-debug": "3.1.0",
-    "gulp-prompt": "^0.2.0",
-    "gulp-util": "3.0.8",
-    "gutil": "1.6.4",
-    "highlight.js": "9.11.0",
-    "mocha": "~3.3.0",
-    "orchestrator": "^0.3.7",
-    "react": "^15.4.2",
-    "react-addons-test-utils": "^15.4.2",
-    "react-dom": "^15.4.2",
-    "react-highlight": "0.9.0",
-    "request": "^2.81.0",
-    "source-map-loader": "0.2.1",
-    "typescript": "2.2.2",
-    "vinyl-ftp": "0.6.0",
-    "webpack-bundle-analyzer": "^2.2.1",
-    "color-functions": "1.1.0",
-    "json-loader": "^0.5.4",
-    "load-themed-styles": "^1.1.0",
-    "office-ui-fabric-core": ">=7.0.0 <8.0.0"
-  },
-  "rushDependencies": {
-    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
-    "@uifabric/example-app-base": "1.3.14",
-    "office-ui-fabric-react": ">=2.34.2 <3.0.0",
-    "@uifabric/utilities": ">=1.10.2 <2.0.0"
-  }
-}
diff --git a/common/temp_modules/rush-office-ui-fabric-react-tslint/package.json b/common/temp_modules/rush-office-ui-fabric-react-tslint/package.json
deleted file mode 100644
index c088e63e3af43..0000000000000
--- a/common/temp_modules/rush-office-ui-fabric-react-tslint/package.json
+++ /dev/null
@@ -1,8 +0,0 @@
-{
-  "name": "rush-office-ui-fabric-react-tslint",
-  "version": "0.0.0",
-  "private": true,
-  "dependencies": {
-    "@microsoft/gulp-core-build-typescript": "^2.4.4"
-  }
-}
diff --git a/common/temp_modules/rush-office-ui-fabric-react/package.json b/common/temp_modules/rush-office-ui-fabric-react/package.json
deleted file mode 100644
index ee183ae700c51..0000000000000
--- a/common/temp_modules/rush-office-ui-fabric-react/package.json
+++ /dev/null
@@ -1,62 +0,0 @@
-{
-  "name": "rush-office-ui-fabric-react",
-  "version": "0.0.0",
-  "private": true,
-  "dependencies": {
-    "@microsoft/load-themed-styles": "^1.2.2",
-    "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
-    "@types/chai": "^3.4.35",
-    "@types/enzyme": "^2.7.5",
-    "@types/es6-promise": "^0.0.32",
-    "@types/mocha": "^2.2.39",
-    "@types/prop-types": "^15.5.1",
-    "@types/react": "^15.0.25",
-    "@types/react-addons-test-utils": "^0.14.18",
-    "@types/react-dom": "^15.5.0",
-    "@types/resemblejs": "~1.3.28",
-    "@types/sinon": "^2.1.3",
-    "@types/webpack-env": "^1.13.0",
-    "autoprefixer": "^6.7.6",
-    "chai": "^3.5.0",
-    "css-loader": "^0.28.0",
-    "enzyme": "^2.7.0",
-    "es6-promise": "4.1.0",
-    "git-rev": "0.2.1",
-    "gulp": "~3.9.1",
-    "gulp-phantomcss": "~0.3.0",
-    "gulp-prompt": "^0.2.0",
-    "gulp-util": "3.0.8",
-    "gutil": "1.6.4",
-    "highlight.js": "^9.6.0",
-    "load-themed-styles-loader": "^0.0.3",
-    "mocha": "^3.2.0",
-    "mocha-loader": "^1.1.1",
-    "node-sass": "^4.5.0",
-    "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "postcss-loader": "^1.3.3",
-    "raw-loader": "^0.5.1",
-    "react": "^15.4.2",
-    "react-addons-test-utils": "^15.4.2",
-    "react-dom": "^15.4.2",
-    "react-highlight": "0.9.0",
-    "resemblejs": "~2.2.3",
-    "sass-loader": "^6.0.3",
-    "sinon": "^2.1.0",
-    "source-map-loader": "0.2.1",
-    "style-loader": "^0.17.0",
-    "ts-loader": "^2.0.1",
-    "typescript": "2.2.2",
-    "vinyl-ftp": "0.6.0",
-    "webpack": "^2.4.1",
-    "webpack-bundle-analyzer": "^2.2.1",
-    "webpack-dev-server": "^2.4.1",
-    "webpack-notifier": "^1.5.0",
-    "webpack-split-by-path": "2.0.0",
-    "prop-types": "^15.5.10"
-  },
-  "rushDependencies": {
-    "@uifabric/example-app-base": "1.3.14",
-    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
-    "@uifabric/utilities": ">=1.10.2 <2.0.0"
-  }
-}
diff --git a/common/temp_modules/rush-ssr-tests/package.json b/common/temp_modules/rush-ssr-tests/package.json
deleted file mode 100644
index 9b77cec31fe22..0000000000000
--- a/common/temp_modules/rush-ssr-tests/package.json
+++ /dev/null
@@ -1,24 +0,0 @@
-{
-  "name": "rush-ssr-tests",
-  "version": "0.0.0",
-  "private": true,
-  "dependencies": {
-    "@microsoft/load-themed-styles": "^1.2.2",
-    "@types/chai": "^3.4.35",
-    "@types/enzyme": "^2.7.5",
-    "@types/es6-promise": "^0.0.32",
-    "@types/mocha": "^2.2.39",
-    "@types/webpack-env": "^1.13.0",
-    "mocha": "~3.3.0",
-    "raw-loader": "^0.5.1",
-    "react": "^15.4.2",
-    "react-addons-test-utils": "^15.4.2",
-    "react-dom": "^15.4.2",
-    "webpack": "^2.4.1",
-    "webpack-node-externals": "^1.5.4",
-    "es6-promise": "^4.1.0"
-  },
-  "rushDependencies": {
-    "office-ui-fabric-react": ">=2.34.2 <3.0.0"
-  }
-}
diff --git a/common/temp_modules/rush-styling/package.json b/common/temp_modules/rush-styling/package.json
deleted file mode 100644
index 5a50eba8d2bad..0000000000000
--- a/common/temp_modules/rush-styling/package.json
+++ /dev/null
@@ -1,44 +0,0 @@
-{
-  "name": "rush-styling",
-  "version": "0.0.0",
-  "private": true,
-  "dependencies": {
-    "@microsoft/sp-build-web": "~1.0.0",
-    "@microsoft/sp-module-interfaces": "~1.0.0",
-    "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
-    "@types/chai": "^3.4.35",
-    "@types/enzyme": "^2.7.5",
-    "@types/mocha": "^2.2.39",
-    "@types/react": "^15.0.25",
-    "@types/react-addons-test-utils": "^0.14.18",
-    "@types/react-dom": "^15.5.0",
-    "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": ">=1.3.12 <2.0.0",
-    "chai": "^3.5.0",
-    "enzyme": "^2.7.0",
-    "es6-promise": "4.1.0",
-    "gulp": "~3.9.1",
-    "mocha": "^3.2.0",
-    "mocha-loader": "^1.1.1",
-    "office-ui-fabric-react": ">=2.11.0-0 <3.0.0-0",
-    "react": "^15.4.2",
-    "react-addons-test-utils": "^15.4.2",
-    "react-dom": "^15.4.2",
-    "source-map-loader": "^0.2.1",
-    "ts-loader": "^2.0.1",
-    "tslib": "^1.6.0",
-    "typescript": "2.2.2",
-    "uglifyjs-webpack-plugin": "^0.4.3",
-    "webpack": "^2.4.1",
-    "webpack-bundle-analyzer": "^2.2.1",
-    "webpack-dev-server": "^2.4.1",
-    "webpack-notifier": "^1.5.0",
-    "webpack-split-by-path": "2.0.0",
-    "glamor": "^2.20.24",
-    "rtl-css-js": "^1.1.0"
-  },
-  "rushDependencies": {
-    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
-    "@uifabric/utilities": ">=1.10.2 <2.0.0"
-  }
-}
diff --git a/common/temp_modules/rush-test-bundle-button/package.json b/common/temp_modules/rush-test-bundle-button/package.json
deleted file mode 100644
index f2fe2a1a22446..0000000000000
--- a/common/temp_modules/rush-test-bundle-button/package.json
+++ /dev/null
@@ -1,23 +0,0 @@
-{
-  "name": "rush-test-bundle-button",
-  "version": "0.0.0",
-  "private": true,
-  "dependencies": {
-    "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
-    "@types/react": "^15.0.25",
-    "@types/react-addons-test-utils": "^0.14.18",
-    "@types/react-dom": "^15.5.0",
-    "@types/webpack-env": "^1.13.0",
-    "source-map-loader": "^0.2.1",
-    "ts-loader": "^2.0.1",
-    "typescript": "^2.2.2",
-    "webpack": "^2.2.1",
-    "webpack-bundle-analyzer": "^2.2.1",
-    "webpack-dev-server": "^2.4.1",
-    "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
-  },
-  "rushDependencies": {
-    "office-ui-fabric-react": ">=2.34.2 <3.0.0"
-  }
-}
diff --git a/common/temp_modules/rush-todo-app/package.json b/common/temp_modules/rush-todo-app/package.json
deleted file mode 100644
index 048872a6fe38d..0000000000000
--- a/common/temp_modules/rush-todo-app/package.json
+++ /dev/null
@@ -1,27 +0,0 @@
-{
-  "name": "rush-todo-app",
-  "version": "0.0.0",
-  "private": true,
-  "dependencies": {
-    "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
-    "@types/chai": "^3.4.35",
-    "@types/enzyme": "^2.7.5",
-    "@types/es6-promise": "^0.0.32",
-    "@types/mocha": "^2.2.39",
-    "@types/react": "^15.0.25",
-    "@types/react-addons-test-utils": "^0.14.18",
-    "@types/react-dom": "^15.5.0",
-    "@types/webpack-env": "^1.13.0",
-    "react-addons-test-utils": "^15.4.2",
-    "@microsoft/load-themed-styles": ">=1.2.2 <2.0.0",
-    "es6-promise": "^4.1.0",
-    "immutability-helper": "^2.0.0",
-    "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "react": "^15.4.2",
-    "react-dom": "^15.4.2",
-    "typescript": "2.2.2"
-  },
-  "rushDependencies": {
-    "office-ui-fabric-react": ">=2.34.2 <3.0.0"
-  }
-}
diff --git a/common/temp_modules/rush-utilities/package.json b/common/temp_modules/rush-utilities/package.json
deleted file mode 100644
index 97baec2bcf12a..0000000000000
--- a/common/temp_modules/rush-utilities/package.json
+++ /dev/null
@@ -1,33 +0,0 @@
-{
-  "name": "rush-utilities",
-  "version": "0.0.0",
-  "private": true,
-  "dependencies": {
-    "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
-    "@types/chai": "^3.4.35",
-    "@types/enzyme": "^2.7.5",
-    "@types/es6-promise": "^0.0.32",
-    "@types/mocha": "^2.2.39",
-    "@types/prop-types": "^15.5.1",
-    "@types/react": "^15.0.25",
-    "@types/react-addons-test-utils": "^0.14.18",
-    "@types/react-dom": "^15.5.0",
-    "@types/sinon": "^2.1.3",
-    "@types/webpack-env": "^1.13.0",
-    "enzyme": "^2.7.0",
-    "es6-promise": "4.1.0",
-    "es6-weak-map": "^2.0.2",
-    "gulp": "~3.9.1",
-    "mocha": "~3.3.0",
-    "react": "^15.4.2",
-    "react-addons-test-utils": "^15.4.2",
-    "react-dom": "^15.4.2",
-    "sinon": "^2.1.0",
-    "source-map-loader": "^0.2.1",
-    "typescript": "2.2.2",
-    "prop-types": "^15.5.10"
-  },
-  "rushDependencies": {
-    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0"
-  }
-}
diff --git a/package.json b/package.json
index 96f7fbbf32a00..1d689747390a0 100644
--- a/package.json
+++ b/package.json
@@ -20,7 +20,7 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@microsoft/rush": "2.5.0",
+    "@microsoft/rush": "3.0.7",
     "github": "^7.0.0",
     "gulp": "^3.9.1",
     "yargs": "^6.5.0"
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 1532b44cf06db..1776707dff24e 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -27,7 +27,7 @@
     "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/resemblejs": "~1.3.28",
-    "@types/sinon": "^2.1.3",
+    "@types/sinon": "^2.2.2",
     "@types/webpack-env": "^1.13.0",
     "@uifabric/example-app-base": "1.3.14",
     "autoprefixer": "^6.7.6",
@@ -56,7 +56,7 @@
     "react-highlight": "0.9.0",
     "resemblejs": "~2.2.3",
     "sass-loader": "^6.0.3",
-    "sinon": "^2.1.0",
+    "sinon": "^2.3.2",
     "source-map-loader": "0.2.1",
     "style-loader": "^0.17.0",
     "ts-loader": "^2.0.1",
@@ -77,4 +77,4 @@
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   }
-}
+}
\ No newline at end of file
diff --git a/packages/styling/package.json b/packages/styling/package.json
index bbbaa5cd1da58..b05060116d0cf 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -33,7 +33,7 @@
     "react-addons-test-utils": "^15.4.2",
     "react-dom": "^15.4.2",
     "source-map-loader": "^0.2.1",
-    "ts-loader": "^2.0.1",
+    "ts-loader": "^2.1.0",
     "tslib": "^1.6.0",
     "typescript": "2.2.2",
     "uglifyjs-webpack-plugin": "^0.4.3",
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index e317acfe0c71f..6afef38c1a96d 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -25,7 +25,7 @@
     "@types/react": "^15.0.25",
     "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
-    "@types/sinon": "^2.1.3",
+    "@types/sinon": "^2.2.2",
     "@types/webpack-env": "^1.13.0",
     "enzyme": "^2.7.0",
     "es6-promise": "4.1.0",
@@ -36,7 +36,7 @@
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
     "react-dom": "^15.4.2",
-    "sinon": "^2.1.0",
+    "sinon": "^2.3.2",
     "source-map-loader": "^0.2.1",
     "typescript": "2.2.2"
   },
diff --git a/rush.json b/rush.json
index 0b6c291e956d5..c03ac5fa47bcb 100644
--- a/rush.json
+++ b/rush.json
@@ -1,8 +1,7 @@
 {
   "npmVersion": "3.10.9",
-  "rushMinimumVersion": "2.5.0",
+  "rushMinimumVersion": "3.0.7",
   "nodeSupportedVersionRange": ">=6.9.0 <8.0.0",
-  "commonFolder": "common",
   "projectFolderMinDepth": 1,
   "projectFolderMaxDepth": 999,
   "projects": [

From 3a198d4811b76f491acce31efa358c9c95740a63 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 29 May 2017 12:28:57 -0700
Subject: [PATCH 0027/1641] Styling: integrating glamor based styling, removing
 fabric-core dependency (#1837)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Updating rush generate to include styling.

* Adding a test-bundle-button package to test bundling only the button. This will help identify how we're impacting the bundle size of the button, and will help validate that we're actually able to render a button without fabric-core.

* Updating typescript build errors due to new shrinkwrap; also adding a replacement css utility that works better mixing glamor styling and class name strings together.

* Updating the classname contract for buttons to have more specific understandable rules that don't rely on non-contractual css child selectors to do anything. Updated Primary button to not use sass.

* Updating all buttons to use styling.

* Removing unnecessary files. Cleaning up lint.

* Updates to linting.

* More cleanup; adding mergeRules helper to reduce mistakes .

* Removing redundant button definitions.

* More changes, better type safety.

* Completely removing the fabric-core dependency for icons.

* Updating sourcemap loader.

* Fixing Panel animations completely. Fixing Callouts to not depend on fabric-core.

* Replacing random ms-Icon usage with styling icons.

* Fixing icon usage in chevron.

* Removing more references to ms-icon.

* Removing icons and animations from nav.

* Fixing the example header css.

* Removing more font class name usage.

* Fixing a number of cases that rely on ms-Icon--* classnames to use the Icon component!

* Fixing lint.

* Fixing the panel test.

* Fixing lint.

* Updates to all of the things.

* Fixing lint.

* Updates to typings and usage.

* Updating rush, comments.

* More renames.

* Updating color page.

* Temp updates.

* Adding memoization optimization. Updating lint, updating rtl.

* Removing fonts, deprecating TextField iconClass

* Removing iconClass usage from TextField.

* updating versions.

* Adding rush updates.

* Updating styling package.

* Fixing the urls in the shrinkwrap.

* rename1.

* Updating files.

* Referencing the Styling top-level entry.

* Removing icons .

* Exporting font weights and sizes, using them in button icons.

* Fixing base button and command button.

* Removing optional palette and fonts.

* Updates.

* Various cleanup.

* Updating tests to polyfill weakmap.

* Adding styling tests entry.

* Moving polyfill.

* Updating Icons to be display inline-block by default.

* Variety of fixes for memoize and button style mixing.

* Fixing memoize to work with arbirtrary arguments.

* Renaming memoize to memoizeFunction, and making “memoize” a decorator like autobind.

Updating things accordingly.

* Updating IStyle to include arrays of raw or processed styles.

* Fixing typings.

* Flattened hovered/active styling to be part of the style contract. Fixed mergeStyleSets so that you don’t have to specify “undefined” for non styled things in the base class.

* Styling: add semantic colors and convert toggle to new system (#1827)

* add semantic colors and convert nonhover toggle colors to use them

* fix lint error

* address code review feedback and better comment

* wip: finishing up toggle, still have disabled thumb color bug to address

* update toggle to new way of doing things

* code review feedback

* cleanup

* umm, updates and stuff

* cleanup for merge

* fix lint errors

* Updating memoize to set “this” to null to prevent bugs, complete scrub of Toggle things.

* Adding change file and such.

* Deprecating button toggled in favor of checked.

* missed save.

* updating shrinkwrap

* Updating how font families are loaded based on the language of the page.
---
 .vscode/settings.json                         |   4 +-
 apps/ssr-tests/package.json                   |   1 +
 apps/test-bundle-button/package.json          |   1 +
 apps/todo-app/package.json                    |   1 +
 .../styling-updates_2017-05-27-00-02.json     |  30 +++
 common/config/rush/npm-shrinkwrap.json        |   4 +-
 package.json                                  |   2 +-
 packages/example-app-base/package.json        |   3 +-
 .../src/components/Header/Header.scss         |   3 +-
 .../src/components/Header/Header.tsx          |  12 +-
 .../PropertiesTable/PropertiesTable.tsx       |   3 +-
 .../src/utilities/examplesOf.ts               |   2 +-
 .../office-ui-fabric-react-tslint/tslint.json |   4 +-
 packages/office-ui-fabric-react/index.html    |   1 -
 .../office-ui-fabric-react/karma.config.js    |   8 +-
 packages/office-ui-fabric-react/package.json  |   2 +
 .../office-ui-fabric-react/src/Styling.ts     |   1 +
 .../src/common/_semanticColorVariables.scss   |   6 +-
 .../src/common/connect.test.tsx               |   4 +-
 .../src/common/tests.js                       |   3 +
 .../src/components/Breadcrumb/Breadcrumb.scss |  15 +-
 .../src/components/Breadcrumb/Breadcrumb.tsx  |  31 ++-
 .../src/components/Button/BaseButton.scss     |  17 --
 .../components/Button/BaseButton.styles.ts    |  94 +++++++
 .../src/components/Button/BaseButton.tsx      | 246 ++++++++++++------
 .../src/components/Button/Button.Props.ts     | 126 ++++++++-
 .../components/Button/Button.visualtest.ts    |  20 +-
 .../Button/ButtonCore/ButtonCore.scss         |  48 ----
 .../Button/ButtonCore/ButtonCoreVars.scss     |   4 -
 .../src/components/Button/ButtonPage.tsx      |  33 +--
 .../Button/ButtonPage.visualtest.tsx          |  18 +-
 .../Button/CommandButton/CommandButton.scss   |  64 -----
 .../CommandButton/CommandButton.styles.ts     |  69 +++++
 .../Button/CommandButton/CommandButton.tsx    |  26 +-
 .../Button/CompoundButton/CompoundButton.scss |  97 -------
 .../CompoundButton/CompoundButton.styles.ts   |  71 +++++
 .../Button/CompoundButton/CompoundButton.tsx  |  26 +-
 .../Button/DefaultButton/DefaultButton.scss   |  52 ----
 .../DefaultButton/DefaultButton.styles.ts     |  53 ++++
 .../Button/DefaultButton/DefaultButton.tsx    |  26 +-
 .../Button/IconButton/IconButton.scss         |  59 -----
 .../Button/IconButton/IconButton.styles.ts    |  51 ++++
 .../Button/IconButton/IconButton.tsx          |  24 +-
 .../Button/PrimaryButton/PrimaryButton.scss   |  57 ----
 .../PrimaryButton/PrimaryButton.styles.ts     |  51 ++++
 .../Button/PrimaryButton/PrimaryButton.tsx    |  25 +-
 .../Button/examples/Button.Anchor.Example.tsx |   4 +-
 .../examples/Button.Command.Example.tsx       |   4 +-
 .../examples/Button.Compound.Example.tsx      |   4 +-
 .../Button.ContextualMenu.Example.tsx         |   4 +-
 .../examples/Button.Default.Example.tsx       |   4 +-
 .../Button/examples/Button.Icon.Example.tsx   |   4 +-
 .../examples/Button.Primary.Example.tsx       |  52 ++--
 .../examples/Button.ScreenReader.Example.tsx  |   4 +-
 .../Button/examples/Button.Swap.Example.tsx   |   6 +-
 .../Button/examples/IButtonDemoPageState.tsx  |   4 -
 .../src/components/Calendar/CalendarDay.tsx   |   6 +-
 .../src/components/Calendar/CalendarMonth.tsx |   5 +-
 .../src/components/Callout/CalloutContent.tsx |  11 +-
 .../src/components/Callout/CalloutPage.tsx    |   2 +-
 .../src/components/Check/Check.scss           |  80 +++---
 .../src/components/Check/Check.tsx            |  23 +-
 .../components/ColorPicker/ColorPicker.tsx    |   3 +-
 .../src/components/CommandBar/CommandBar.tsx  |  15 +-
 .../CommandBar.Customization.Example.tsx      |  59 ++---
 .../ContextualMenu/ContextualMenu.tsx         |   3 +-
 .../ContextualMenu.Customization.Example.tsx  |   2 +-
 .../src/components/DatePicker/DatePicker.tsx  |  12 +-
 .../components/DetailsList/DetailsHeader.scss |   7 +-
 .../src/components/DetailsList/DetailsRow.tsx |  18 +-
 .../DocumentCard/DocumentCardActions.tsx      |   3 +-
 .../src/components/Dropdown/Dropdown.tsx      |   3 +-
 .../src/components/Fabric/Fabric.styles.ts    |  30 +++
 .../src/components/Fabric/Fabric.tsx          |  18 +-
 .../src/components/Facepile/Facepile.test.tsx |   6 +-
 .../src/components/Facepile/Facepile.tsx      |   7 +-
 .../src/components/Facepile/FacepilePage.tsx  |  11 +-
 .../components/GroupedList/GroupHeader.scss   |   1 +
 .../components/GroupedList/GroupHeader.tsx    |   2 +-
 .../examples/GroupedList.Custom.Example.tsx   |   8 +-
 .../src/components/Icon/Icon.Props.ts         |  16 ++
 .../src/components/Icon/Icon.scss             |   3 -
 .../src/components/Icon/Icon.styles.ts        |  28 ++
 .../src/components/Icon/Icon.tsx              |  54 +++-
 .../Icon/examples/Icon.Basic.Example.tsx      |   6 +-
 .../src/components/Image/Image.tsx            |  17 +-
 .../Layer/examples/Layer.Basic.Example.tsx    |   3 +-
 .../Layer/examples/Layer.Hosted.Example.tsx   |   5 +-
 .../src/components/List/ListPage.tsx          |   5 -
 .../List/examples/List.Basic.Example.scss     |   1 +
 .../List/examples/List.Basic.Example.tsx      |  13 +-
 .../List/examples/List.Mail.Example.scss      | 236 -----------------
 .../List/examples/List.Mail.Example.tsx       |  46 ----
 .../src/components/MessageBar/MessageBar.tsx  |   3 +-
 .../src/components/Nav/Nav.scss               |   4 +-
 .../src/components/Nav/Nav.tsx                |  32 ++-
 .../src/components/Panel/Panel.Props.ts       |   8 +
 .../src/components/Panel/Panel.scss           |   9 -
 .../src/components/Panel/Panel.test.tsx       |  40 ++-
 .../src/components/Panel/Panel.tsx            | 173 ++++++------
 .../src/components/Panel/PanelPage.tsx        |   3 +-
 .../Panel/examples/Panel.Custom.Example.tsx   |   2 +-
 .../examples/Panel.ExtraLarge.Example.tsx     |   2 +-
 .../Panel/examples/Panel.Large.Example.tsx    |   2 +-
 .../examples/Panel.LargeFixed.Example.tsx     |   2 +-
 .../examples/Panel.LightDismiss.Example.tsx   |   2 +-
 .../Panel/examples/Panel.Medium.Example.tsx   |   2 +-
 .../Panel/examples/Panel.NonModal.Example.tsx |   2 +-
 .../examples/Panel.SmallFluid.Example.tsx     |   2 +-
 .../examples/Panel.SmallLeft.Example.tsx      |   2 +-
 .../src/components/Persona/Persona.tsx        |   6 +-
 .../examples/Persona.Basic.Example.tsx        |   2 +
 .../src/components/Pivot/Pivot.tsx            |   3 +-
 .../src/components/Rating/Rating.tsx          |   3 +-
 .../components/SearchBox/SearchBoxPage.tsx    |  11 +-
 .../components/TextField/TextField.Props.ts   |  12 +-
 .../src/components/TextField/TextField.tsx    |  13 +-
 .../examples/TextField.Basic.Example.tsx      |   4 +-
 .../src/components/Theme/ThemePage.tsx        |   6 +-
 .../src/components/Toggle/Toggle.Props.ts     |  92 ++++++-
 .../src/components/Toggle/Toggle.scss         | 207 ---------------
 .../src/components/Toggle/Toggle.styles.ts    | 120 +++++++++
 .../src/components/Toggle/Toggle.test.tsx     |   4 +-
 .../src/components/Toggle/Toggle.tsx          | 202 +++++++++-----
 .../src/components/Toggle/TogglePage.tsx      |   3 +-
 .../Toggle/examples/Toggle.Basic.Example.tsx  |   2 +-
 .../src/components/Tooltip/Tooltip.tsx        |  11 +-
 .../components/pickers/TagPicker/TagItem.tsx  |   3 +-
 packages/office-ui-fabric-react/src/index.ts  |   3 +-
 .../decorators/withContainsFocus.tsx          |   6 +-
 .../webpack.serve.config.js                   |   4 +
 packages/styling/gulpfile.js                  |   1 -
 packages/styling/package.json                 |   1 +
 packages/styling/src/common/tests.js          |  18 ++
 packages/styling/src/glamorExports.ts         |   3 +-
 packages/styling/src/interfaces/IPalette.ts   |   5 -
 .../styling/src/interfaces/ISemanticColors.ts |  31 +++
 packages/styling/src/interfaces/IStyle.ts     |   5 +-
 packages/styling/src/interfaces/index.ts      |   1 +
 .../styling/src/styles/DefaultFontStyles.ts   | 192 +++++++++-----
 packages/styling/src/styles/DefaultPalette.ts |   1 -
 packages/styling/src/styles/IconCodes.ts      |   2 +-
 .../styling/src/utilities/mergeStyleSets.ts   |  29 ++-
 packages/styling/src/utilities/mergeStyles.ts |  33 ++-
 packages/styling/src/utilities/theme.ts       |  31 ++-
 packages/utilities/api/utilities.api.ts       |  12 +-
 packages/utilities/karma.config.js            |   2 +-
 packages/utilities/src/BaseComponent.ts       |   5 +-
 packages/utilities/src/common/tests.js        |   3 +
 packages/utilities/src/index.ts               |   1 +
 packages/utilities/src/language.ts            |  53 ++++
 packages/utilities/src/memoize.test.ts        |  83 +++++-
 packages/utilities/src/memoize.ts             | 118 ++++++---
 packages/utilities/src/resources.ts           |   5 -
 packages/utilities/src/rtl.ts                 |   6 +-
 155 files changed, 2224 insertions(+), 1780 deletions(-)
 create mode 100644 common/changes/styling-updates_2017-05-27-00-02.json
 create mode 100644 packages/office-ui-fabric-react/src/Styling.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Button/BaseButton.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Button/ButtonCore/ButtonCore.scss
 delete mode 100644 packages/office-ui-fabric-react/src/components/Button/ButtonCore/ButtonCoreVars.scss
 delete mode 100644 packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Button/examples/IButtonDemoPageState.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Fabric/Fabric.styles.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Icon/Icon.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/Icon/Icon.styles.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/List/examples/List.Mail.Example.scss
 delete mode 100644 packages/office-ui-fabric-react/src/components/List/examples/List.Mail.Example.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/components/Toggle/Toggle.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts
 create mode 100644 packages/styling/src/common/tests.js
 create mode 100644 packages/styling/src/interfaces/ISemanticColors.ts
 create mode 100644 packages/utilities/src/language.ts

diff --git a/.vscode/settings.json b/.vscode/settings.json
index 4d90f661ad6c5..ed39f2d27033f 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -29,10 +29,10 @@
   "editor.wordWrap": "wordWrapColumn",
   "editor.wordWrapColumn": 140,
   "tslint.enable": true,
-  "tslint.rulesDirectory": "./common/node_modules/tslint-microsoft-contrib",
+  "tslint.rulesDirectory": "./common/temp/node_modules/tslint-microsoft-contrib",
   // Defines space handling after opening and before closing JSX expression braces. Requires TypeScript >= 2.0.6.
   "typescript.format.insertSpaceAfterOpeningAndBeforeClosingJsxExpressionBraces": true,
   "editor.formatOnSave": true,
-  "typescript.tsdk": "./common/node_modules/typescript/lib",
+  "typescript.tsdk": "./common/temp/node_modules/typescript/lib",
   "tslint.autoFixOnSave": true
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index a1cd82ae4d375..260007057de1a 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -3,6 +3,7 @@
   "version": "1.0.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
+  "private": true,
   "typings": "lib/index.d.ts",
   "repository": {
     "type": "git",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index a4483c2621f0b..ef7f92e85687c 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -4,6 +4,7 @@
   "description": "Testing the button for bundling.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
+  "private": true,
   "repository": {
     "type": "git",
     "url": "https://github.com/OfficeDev/office-ui-fabric-react"
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index c927e3454aec9..6d012c12f136e 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -2,6 +2,7 @@
   "name": "todo-app",
   "description": "Sample todo app using office-ui-fabric-react.",
   "version": "1.0.2",
+  "private": true,
   "scripts": {
     "build": "gulp",
     "clean": "gulp clean",
diff --git a/common/changes/styling-updates_2017-05-27-00-02.json b/common/changes/styling-updates_2017-05-27-00-02.json
new file mode 100644
index 0000000000000..228334a892b42
--- /dev/null
+++ b/common/changes/styling-updates_2017-05-27-00-02.json
@@ -0,0 +1,30 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "The styling package is now a dependency of fabric-react, which brings in the initial steps towards offering consumers a much better way to customize components to meet their requirements. The Button components and Toggle components have so far been converted to use the styling utilities. We will be ellaborating more on this as we refine our patterns towards customization and refine the documentation.",
+      "type": "major"
+    },
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "memoize/memoizeFunction: memoize converted to a decorator, memoizeFunction is now for memoizing functions.",
+      "type": "major"
+    },
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "getLangauge/setLanguage: new apis added for getting/setting the language normally specified on the html lang attribute.",
+      "type": "major"
+    },
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Major updates to mergeStyles and other various utilities. Updating fonts to follow latest fabric-core language fallbacks.",
+      "type": "minor"
+    },
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "All references to fabric-core removed.",
+      "type": "major"
+    }
+  ],
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index e4278eac58f8b..20ac2971751af 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -2469,9 +2469,9 @@
       "resolved": "https://registry.npmjs.org/caniuse-api/-/caniuse-api-1.6.1.tgz"
     },
     "caniuse-db": {
-      "version": "1.0.30000673",
+      "version": "1.0.30000674",
       "from": "caniuse-db@>=1.0.30000488 <2.0.0",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000673.tgz"
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000674.tgz"
     },
     "capture-stack-trace": {
       "version": "1.0.0",
diff --git a/package.json b/package.json
index 1d689747390a0..c4973bb88abfe 100644
--- a/package.json
+++ b/package.json
@@ -2,13 +2,13 @@
   "name": "office-ui-fabric-react-repo",
   "version": "1.0.0",
   "description": "Reusable React components for building experiences for Office 365.",
+  "private": true,
   "repository": {
     "type": "git",
     "url": "https://github.com/OfficeDev/office-ui-fabric-react"
   },
   "scripts": {
     "_rushInstall": "node node_modules/@microsoft/rush/bin/rush install",
-    "_rushLink": "node node_modules/@microsoft/rush/bin/rush link",
     "_rushBuild": "node node_modules/@microsoft/rush/bin/rush build --verbose",
     "_rushBuildToFabric": "node node_modules/@microsoft/rush/bin/rush build --to office-ui-fabric-react",
     "_rushRebuild": "node node_modules/@microsoft/rush/bin/rush rebuild --production --verbose",
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 15ff05d903e38..f81417ad40b50 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -40,7 +40,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/utilities": "1.10.2",
+    "@uifabric/styling": ">=0.0.1 <2.0.0",
+    "@uifabric/utilities": ">=1.10.2 <2.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
     "office-ui-fabric-react": ">=2.11.0-0 <3.0.0-0"
diff --git a/packages/example-app-base/src/components/Header/Header.scss b/packages/example-app-base/src/components/Header/Header.scss
index 188d142840485..2001ae2e7e220 100644
--- a/packages/example-app-base/src/components/Header/Header.scss
+++ b/packages/example-app-base/src/components/Header/Header.scss
@@ -11,6 +11,7 @@ $Header-fabricWebsiteHeaderColor: #272630;
     overflow: hidden;
     white-space: no-wrap;
     user-select: none;
+    color: white;
   }
 
   @media (max-width: $ms-screen-max-lg) {
@@ -24,6 +25,7 @@ $Header-fabricWebsiteHeaderColor: #272630;
   .Header-button {
     display: inline-block;
     vertical-align: top;
+    color: white;
   }
 
   .Header-title {
@@ -44,7 +46,6 @@ $Header-fabricWebsiteHeaderColor: #272630;
     position: relative;
     text-decoration: none;
     background: none;
-    color: white;
     border: none;
     padding: 0;
     padding: 0px 10px;
diff --git a/packages/example-app-base/src/components/Header/Header.tsx b/packages/example-app-base/src/components/Header/Header.tsx
index 9612b664fba0d..814667d8644f4 100644
--- a/packages/example-app-base/src/components/Header/Header.tsx
+++ b/packages/example-app-base/src/components/Header/Header.tsx
@@ -7,7 +7,9 @@ import {
 } from 'office-ui-fabric-react/lib/ContextualMenu';
 import { FocusZone, FocusZoneDirection } from 'office-ui-fabric-react/lib/FocusZone';
 import { withResponsiveMode, ResponsiveMode } from 'office-ui-fabric-react/lib/utilities/decorators/withResponsiveMode';
+import { Icon } from 'office-ui-fabric-react/lib/Icon';
 import './Header.scss';
+import { FontClassNames } from '@uifabric/styling/lib/index';
 
 export interface IHeaderProps {
   title: string;
@@ -57,20 +59,20 @@ export class Header extends React.Component<IHeaderProps, IHeaderState> {
         <div className='Header'>
           { (responsiveMode <= ResponsiveMode.large) && (
             <button className='Header-button' onClick={ this._onMenuClick }>
-              <i className='ms-Icon ms-Icon--GlobalNavButton' />
+              <Icon iconName='GlobalNavButton' />
             </button>
           ) }
-          <div className='Header-title ms-font-xl ms-fontColor-white'>
-            <i className='ms-Icon ms-Icon--Org' />
+          <div className={ 'Header-title ' + FontClassNames.large }>
+            <Icon iconName='Org' />
             { title }
           </div>
           <div className='Header-buttons'>
             <FocusZone direction={ FocusZoneDirection.horizontal }>
               { sideLinks.map((link, linkIndex) => (
-                <a key={ linkIndex } className='Header-button ms-fontColor-white' href={ link.url }>{ link.name }</a>
+                <a key={ linkIndex } className='Header-button' href={ link.url }>{ link.name }</a>
               )).concat([
                 <button key='headerButton' className='Header-button' onClick={ this._onGearClick }>
-                  <i className='ms-Icon ms-Icon--Settings' />
+                  <Icon iconName='Settings' />
                 </button>
               ]) }
             </FocusZone>
diff --git a/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx b/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx
index 21cc0fa9553b1..2e469fb8a8fb1 100644
--- a/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx
+++ b/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx
@@ -8,6 +8,7 @@ import {
   IEnumProperty,
   InterfacePropertyType
 } from '../../utilities/parser/index';
+import { FontClassNames } from '@uifabric/styling/lib/index';
 
 export interface IPropertiesTableProps {
   title?: string;
@@ -115,7 +116,7 @@ export class PropertiesTable extends React.Component<IPropertiesTableProps, any>
 
     return (
       <div className='PropertiesTable'>
-        <h2 className='ms-font-xl'>{ title }</h2>
+        <h2 className={ FontClassNames.xLarge }>{ title }</h2>
         { (properties && properties.length) ? (
           <DetailsList
             selectionMode={ SelectionMode.none }
diff --git a/packages/example-app-base/src/utilities/examplesOf.ts b/packages/example-app-base/src/utilities/examplesOf.ts
index 572ed4c4ff943..ce1115a3a4c34 100644
--- a/packages/example-app-base/src/utilities/examplesOf.ts
+++ b/packages/example-app-base/src/utilities/examplesOf.ts
@@ -2,7 +2,7 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-imports */
 
-import { getId } from '@uifabric/utilities';
+import { getId } from 'office-ui-fabric-react/lib/Utilities';
 
 export interface IExample {
   key: string;
diff --git a/packages/office-ui-fabric-react-tslint/tslint.json b/packages/office-ui-fabric-react-tslint/tslint.json
index 0f2a07fb578bf..495fcbff25dbd 100644
--- a/packages/office-ui-fabric-react-tslint/tslint.json
+++ b/packages/office-ui-fabric-react-tslint/tslint.json
@@ -15,7 +15,9 @@
       "property-declaration",
       "member-variable-declaration"
     ],
-    "no-unused-imports": true,
+    "no-unused-imports": [
+      true
+    ],
     "prefer-const": false,
     "quotemark": [
       "single"
diff --git a/packages/office-ui-fabric-react/index.html b/packages/office-ui-fabric-react/index.html
index 77ad3f419611b..7ab596ec9a628 100644
--- a/packages/office-ui-fabric-react/index.html
+++ b/packages/office-ui-fabric-react/index.html
@@ -6,7 +6,6 @@
   <meta http-equiv="X-UA-Compatible" content="IE=edge" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" user-scalable="no" />
 
-  <link rel="stylesheet" href="node_modules/office-ui-fabric-core/dist/css/fabric.min.css"></link>
   <title>Office UI Fabric React Examples</title>
 
 </head>
diff --git a/packages/office-ui-fabric-react/karma.config.js b/packages/office-ui-fabric-react/karma.config.js
index 0f8ac892cf813..6eb13997c250b 100644
--- a/packages/office-ui-fabric-react/karma.config.js
+++ b/packages/office-ui-fabric-react/karma.config.js
@@ -5,6 +5,7 @@
 
 let path = require('path');
 let build = require('@microsoft/web-library-build');
+let webpack = require('webpack');
 let buildConfig = build.getConfig();
 let configResources = build.karma.resources;
 let bindPolyfillPath = configResources.bindPolyfillPath;
@@ -56,7 +57,12 @@ module.exports = function (config) {
           buildConfig.libFolder,
           'node_modules'
         ]
-      }
+      },
+      plugins: [
+        new webpack.DefinePlugin({
+          'process.env.NODE_ENV': JSON.stringify('production')
+        })
+      ]
     },
 
     webpackMiddleware: {
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 1776707dff24e..c7de9725b3e84 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -35,6 +35,7 @@
     "css-loader": "^0.28.0",
     "enzyme": "^2.7.0",
     "es6-promise": "4.1.0",
+    "es6-weak-map": "^2.0.2",
     "git-rev": "0.2.1",
     "gulp": "~3.9.1",
     "gulp-phantomcss": "~0.3.0",
@@ -71,6 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=1.10.2 <2.0.0",
+    "@uifabric/styling": ">=0.0.1 <2.0.0",
     "prop-types": "^15.5.10"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/src/Styling.ts b/packages/office-ui-fabric-react/src/Styling.ts
new file mode 100644
index 0000000000000..78429ea76882e
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/Styling.ts
@@ -0,0 +1 @@
+export * from '@uifabric/styling/lib/index';
diff --git a/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss b/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
index e27af68a39a7a..a23209fb32e17 100644
--- a/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
+++ b/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
@@ -59,14 +59,14 @@ $fieldPlaceholderColor: $ms-color-neutralTertiary;
 /*** State controls ***/
 $controlBackgroundColor: $ms-color-white;
 $controlBackgroundSelectedColor: $ms-color-themePrimary;
-$controlBackgroundSelectedHoverColor: $ms-color-themeSecondary;
+$controlBackgroundSelectedHoverColor: $ms-color-themeDarkAlt;
 
 $controlForegroundColor: $ms-color-neutralPrimary;
 $controlForegroundHoverColor: $ms-color-black;
 $controlForegroundSelectedColor: $ms-color-white;
 
-$controlBorderUnselectedColor: $ms-color-neutralSecondaryAlt;
-$controlBorderUnselectedHoverColor: $ms-color-black;
+$controlBorderUnselectedColor: $ms-color-neutralTertiary;
+$controlBorderUnselectedHoverColor: $ms-color-neutralPrimary;
 // $controlBorderSelectedColor: unused
 $controlBorderSelectedHoverColor: $ms-color-themePrimary;
 
diff --git a/packages/office-ui-fabric-react/src/common/connect.test.tsx b/packages/office-ui-fabric-react/src/common/connect.test.tsx
index 1496821501310..d1ed5782cd1e6 100644
--- a/packages/office-ui-fabric-react/src/common/connect.test.tsx
+++ b/packages/office-ui-fabric-react/src/common/connect.test.tsx
@@ -92,7 +92,7 @@ describe('connect', () => {
 
   it('can throw when requiring a store in an environment without any stores hosted', () => {
     let hello = storeKey<IHelloStore>('hello');
-    let Connected = connect(
+    let Connected = connect<ITestComponentProps, {}>(
       TestComponent,
       [hello],
       () => ({ /* empty */ })
@@ -112,7 +112,7 @@ describe('connect', () => {
 
   it('can throw in an environment that does not contain the required store', () => {
     let hello = storeKey<IHelloStore>('hello');
-    let Connected = connect(
+    let Connected = connect<ITestComponentProps, {}>(
       TestComponent,
       [hello],
       () => ({ /* empty */ })
diff --git a/packages/office-ui-fabric-react/src/common/tests.js b/packages/office-ui-fabric-react/src/common/tests.js
index 31923f7c58879..3a716c9dd52da 100644
--- a/packages/office-ui-fabric-react/src/common/tests.js
+++ b/packages/office-ui-fabric-react/src/common/tests.js
@@ -1,5 +1,8 @@
 'use strict';
 
+// Polyfills
+require('es6-weak-map/implement');
+
 /**
  * This is a test entry point to help karma-webpack find all tests in the project.
  **/
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss
index 7faf7819e54a1..002fe3f67db82 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss
@@ -27,9 +27,7 @@ $Breadcrumb-chevron-sm: 8px;
 .chevron {
   font-size: $ms-font-size-s;
   color: $ms-color-neutralSecondary;
-  vertical-align: top;
-  margin: 11px 0px;
-  line-height: 1;
+  line-height: $ms-font-size-xxl;
 }
 
 .listItem {
@@ -68,11 +66,10 @@ $Breadcrumb-chevron-sm: 8px;
 .overflowButton {
   font-size: $Breadcrumb-overflowButtonSize;
   display: inline-block;
-  color: $Breadcrumb-overflowButtonColor;
-  padding: 9px 8px;
-  cursor: pointer;
   vertical-align: top;
+  height: 28px;
   line-height: 1;
+
   &:hover {
     cursor: pointer;
     background-color: $ms-color-neutralLighter;
@@ -118,13 +115,11 @@ $Breadcrumb-chevron-sm: 8px;
 
   .chevron {
     font-size: $ms-font-size-mi;
-    margin: 8px 0;
+    line-height: $ms-font-size-l;
   }
 
   .overflowButton {
     font-size: $ms-font-size-m-plus;
-    padding: 6px 8px;
-    line-height: 1;
   }
 }
 
@@ -136,7 +131,7 @@ $Breadcrumb-chevron-sm: 8px;
 
   .chevron {
     font-size: $Breadcrumb-chevron-sm;
-    margin: 7px 0;
+    line-height: $ms-font-size-m;
   }
 
   .overflowButton {
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
index 5b5d4cbb428fb..25967ca1a609b 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
@@ -9,6 +9,8 @@ import {
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { ContextualMenu } from '../../ContextualMenu';
 import { Link } from '../../Link';
+import { Icon } from '../../Icon';
+import { IconButton } from '../../Button';
 import { IBreadcrumbProps, IBreadcrumbItem } from './Breadcrumb.Props';
 import { DirectionalHint } from '../../common/DirectionalHint';
 
@@ -73,30 +75,37 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, IBreadcrumbState
     let { onRenderItem = this._onRenderItem } = this.props;
 
     return (
-      <div 
-        className={ css('ms-Breadcrumb', className, styles.root) } 
-        ref='renderingArea' 
-        role='navigation' 
+      <div
+        className={ css('ms-Breadcrumb', className, styles.root) }
+        ref='renderingArea'
+        role='navigation'
         aria-label={ ariaLabel }
       >
         <FocusZone direction={ FocusZoneDirection.horizontal } >
           <ol className={ css('ms-Breadcrumb-list', styles.list) }>
             { renderedOverflowItems && renderedOverflowItems.length ? (
               <li className={ css('ms-Breadcrumb-overflow', styles.overflow) } key={ OVERFLOW_KEY } ref={ OVERFLOW_KEY }>
-                <div className={ css('ms-Breadcrumb-overflowButton ms-Icon ms-Icon--More', styles.overflowButton) }
+                <IconButton
+                  className={ css('ms-Breadcrumb-overflowButton', styles.overflowButton) }
+                  iconProps={ { iconName: 'more' } }
                   onClick={ this._onOverflowClicked }
-                  data-is-focusable={ true }
                   role='button'
                   aria-haspopup='true'
-                  aria-owns={ isOverflowOpen ? overflowMenuId : null } />
-                <i className={ css('ms-Breadcrumb-chevron ms-Icon', styles.chevron, getRTL() ? 'ms-Icon--ChevronLeft' : 'ms-Icon--ChevronRight') }></i>
+                  aria-owns={ isOverflowOpen ? overflowMenuId : null }
+                />
+                <Icon
+                  className={ css('ms-Breadcrumb-chevron', styles.chevron) }
+                  iconName={ getRTL() ? 'ChevronLeft' : 'ChevronRight' }
+                />
               </li>
             ) : (null) }
             { renderedItems.map(
               (item, index) => (
                 <li className={ css('ms-Breadcrumb-listItem', styles.listItem) } key={ item.key || String(index) } ref={ item.key || String(index) }>
                   { onRenderItem(item, this._defaultRenderItem) }
-                  <i className={ css('ms-Breadcrumb-chevron ms-Icon', styles.chevron, getRTL() ? 'ms-Icon--ChevronLeft' : 'ms-Icon--ChevronRight') }></i>
+                  <Icon
+                    className={ css('ms-Breadcrumb-chevron', styles.chevron) }
+                    iconName={ getRTL() ? 'ChevronLeft' : 'ChevronRight' } />
                 </li>
               )) }
           </ol>
@@ -148,7 +157,7 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, IBreadcrumbState
   }
 
   @autobind
-  private _onOverflowClicked(ev: React.MouseEvent<HTMLElement>) {
+  private _onOverflowClicked(ev: React.MouseEvent<HTMLButtonElement>) {
     this.setState({
       'isOverflowOpen': !this.state.isOverflowOpen,
       'overflowAnchor': ev.currentTarget as HTMLElement
@@ -156,7 +165,7 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, IBreadcrumbState
   }
 
   @autobind
-  private _onOverflowDismissed(ev: MouseEvent) {
+  private _onOverflowDismissed(ev: React.MouseEvent<HTMLElement>) {
     this.setState({
       'isOverflowOpen': false,
       'overflowAnchor': null
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.scss b/packages/office-ui-fabric-react/src/components/Button/BaseButton.scss
deleted file mode 100644
index d57ee78483446..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.scss
+++ /dev/null
@@ -1,17 +0,0 @@
-@import '../../common/common';
-
-.flexContainer {
-  display: flex;
-  height: 100%;
-  flex-wrap: nowrap;
-  justify-content: center;
-  align-items: center;
-}
-
-.root {
-  outline: transparent;
-}
-
-.screenReaderOnly {
-  @include ms-screenReaderOnly;
-}
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
new file mode 100644
index 0000000000000..54b9821ce6052
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
@@ -0,0 +1,94 @@
+import { IButtonStyles } from './Button.Props';
+import { memoizeFunction } from '../../Utilities';
+import {
+  ITheme,
+  getFocusStyle,
+  FontSizes
+} from '../../Styling';
+
+const noOutline = {
+  outline: 0
+};
+
+const iconStyle = {
+  fontSize: FontSizes.icon,
+  margin: '0 4px',
+  height: '16px',
+  lineHeight: '16px',
+  textAlign: 'center',
+  verticalAlign: 'middle'
+};
+
+/**
+ * Gets the base button styles. Note: because it is a base class to be used with the `mergeRules`
+ * helper, it should have values for all class names in the interface. This let `mergeRules` optimize
+ * mixing class names together.
+ */
+export const getStyles = memoizeFunction((
+  theme: ITheme,
+  focusInset: string = '0',
+  focusColor: string = theme.palette.neutralSecondary
+): IButtonStyles => {
+
+  return {
+    root: [
+      getFocusStyle(theme, focusInset, focusColor),
+      theme.fonts.medium,
+      {
+        // this transparent border converts to the correct colors in HC mode
+        boxSizing: 'border-box',
+        border: '1px solid transparent',
+        userSelect: 'none',
+        display: 'inline-block',
+        textDecoration: 'none',
+        textAlign: 'center',
+        cursor: 'pointer',
+        verticalAlign: 'top',
+        padding: '0 16px'
+      }
+    ],
+
+    rootDisabled: {
+      backgroundColor: theme.palette.neutralLighter,
+      color: theme.palette.neutralTertiary,
+      cursor: 'default',
+      pointerEvents: 'none',
+      ':hover': noOutline,
+      ':focus': noOutline
+    },
+
+    flexContainer: {
+      display: 'flex',
+      height: '100%',
+      flexWrap: 'nowrap',
+      justifyContent: 'center',
+      alignItems: 'center'
+    },
+
+    icon: iconStyle,
+
+    menuIcon: [
+      iconStyle,
+      {
+        fontSize: FontSizes.small
+      }
+    ],
+
+    label: {
+      margin: '0 4px',
+      lineHeight: '100%'
+    },
+
+    screenReaderText: {
+      position: 'absolute',
+      width: '1px',
+      height: '1px',
+      margin: '-1px',
+      padding: 0,
+      overflow: 'hidden',
+      clip: 'rect(0,0,0,0)',
+      border: 0
+    }
+
+  };
+});
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index fe80398a608dc..534d64fc51b61 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -6,73 +6,57 @@ import {
   assign,
   autobind,
   buttonProperties,
-  css,
   getId,
-  getNativeProps
+  getNativeProps,
+  memoize
 } from '../../Utilities';
+import { mergeStyles } from '../../Styling';
 import { Icon, IIconProps } from '../../Icon';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { ContextualMenu, IContextualMenuProps } from '../../ContextualMenu';
-import { IButtonProps, IButton } from './Button.Props';
-import * as stylesImport from './BaseButton.scss';
-const styles: any = stylesImport;
-
-export interface IButtonClassNames {
-  base?: string;
-  variant?: string;
-  isDisabled?: string;
-  isEnabled?: string;
-  isToggled?: string;
-  description?: string;
-  flexContainer?: string;
-  icon?: string;
-  menuIcon?: string;
-  label?: string;
-  root?: string;
-}
+import { IButtonProps, IButton, IButtonStyles } from './Button.Props';
 
-/**
- * These props are not in the Props file as they are undocumented props only specific to BaseButton.
- *
- * @export
- * @interface IBaseButtonProps
- * @extends {IButtonProps}
- */
 export interface IBaseButtonProps extends IButtonProps {
-  /**
-   *  Custom class names for individual elements within the button DOM.
-   */
-  classNames?: IButtonClassNames;
+  baseClassName?: string;
+  variantClassName?: string;
 }
 
 export interface IBaseButtonState {
   menuProps?: IContextualMenuProps | null;
 }
 
+interface IButtonClassNames {
+  root?: string;
+  flexContainer?: string;
+  icon?: string;
+  label?: string;
+  menuIcon?: string;
+  description?: string;
+  screenReaderText?: string;
+}
+
 export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState> implements IButton {
 
-  public static defaultProps: IBaseButtonProps = {
-    classNames: {
-      base: 'ms-Button',
-      variant: '',
-      isEnabled: '',
-      isDisabled: '',
-      isToggled: ''
-    }
+  public static defaultProps = {
+    baseClassName: 'ms-Button',
+    classNames: {},
+    styles: {}
   };
 
-  private _buttonElement: HTMLButtonElement;
+  private _buttonElement: HTMLElement;
   private _labelId: string;
   private _descriptionId: string;
   private _ariaDescriptionId: string;
+  private _classNames: IButtonClassNames;
 
-  constructor(props: IButtonProps, rootClassName: string) {
+  constructor(props: IBaseButtonProps, rootClassName: string) {
     super(props);
 
     this._warnDeprecations({
       rootProps: null,
       icon: 'iconProps',
-      menuIconName: 'menuIconProps'
+      menuIconName: 'menuIconProps',
+      toggled: 'checked'
     });
 
     this._labelId = getId();
@@ -84,7 +68,28 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   }
 
   public render(): JSX.Element {
-    const { description, ariaLabel, ariaDescription, href, disabled, toggled, classNames } = this.props;
+    const {
+      ariaDescription,
+      ariaLabel,
+      className,
+      description,
+      disabled,
+      href,
+      iconProps,
+      styles,
+      checked,
+      variantClassName
+         } = this.props;
+
+    this._classNames = this._getClassNames(
+      styles,
+      className,
+      variantClassName,
+      iconProps && iconProps.className,
+      disabled,
+      checked
+    );
+
     const { _ariaDescriptionId, _labelId, _descriptionId } = this;
     const renderAsAnchor: boolean = !!href;
     const tag = renderAsAnchor ? 'a' : 'button';
@@ -97,7 +102,6 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       [
         'disabled' // Let disabled buttons be focused and styled as disabled.
       ]);
-
     // Check for ariaDescription, description or aria-describedby in the native props to determine source of aria-describedby
     // otherwise default to null.
     let ariaDescribedBy;
@@ -115,25 +119,15 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     const buttonProps = assign(
       nativeProps,
       {
-        className: css(
-          styles.root,
-          this.props.className,
-          classNames.base,
-          classNames.variant,
-          classNames.root,
-          {
-            'disabled': disabled,
-            [classNames.isDisabled]: disabled,
-            [classNames.isEnabled]: !disabled,
-            [classNames.isToggled]: toggled
-          }),
+        className: this._classNames.root,
         ref: this._resolveRef('_buttonElement'),
         'disabled': disabled,
         'aria-label': ariaLabel,
         'aria-labelledby': ariaLabel ? null : _labelId,
         'aria-describedby': ariaDescribedBy,
         'aria-disabled': disabled,
-        'aria-pressed': toggled
+        'data-is-focusable': disabled ? false : true,
+        'aria-pressed': checked
       }
     );
 
@@ -161,7 +155,8 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   private _onRenderContent(tag: any, buttonProps: IButtonProps): JSX.Element {
     let props = this.props;
     let {
-      classNames,
+      baseClassName,
+      styles,
       menuIconName,
       menuProps,
       onRenderIcon = this._onRenderIcon,
@@ -172,7 +167,8 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       onRenderMenu = this._onRenderMenu,
       onRenderMenuIcon = this._onRenderMenuIcon
     } = props;
-    const className = css(classNames.base + '-flexContainer', styles.flexContainer, classNames.flexContainer);
+
+    const className = mergeStyles(baseClassName + '-flexContainer', styles.flexContainer);
 
     return React.createElement(
       tag,
@@ -192,7 +188,14 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
 
   @autobind
   private _onRenderIcon(buttonProps?: IButtonProps, defaultRender?: IRenderFunction<IButtonProps>) {
-    let { classNames, icon, iconProps } = this.props;
+    let {
+      baseClassName,
+      disabled,
+      icon,
+      iconProps,
+      styles,
+      checked
+       } = this.props;
 
     if (icon || iconProps) {
       iconProps = iconProps || {
@@ -201,13 +204,18 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     }
 
     return iconProps && (
-      <Icon { ...iconProps } className={ css(`${classNames.base}-icon`, classNames.icon, iconProps.className) } />
+      <Icon { ...iconProps } className={ this._classNames.icon } />
     );
   }
 
   @autobind
   private _onRenderText() {
-    let { classNames, children, text } = this.props;
+    let {
+    children,
+      disabled,
+      styles,
+      text
+            } = this.props;
 
     // For backwards compat, we should continue to take in the text content from children.
     if (text === undefined && typeof (children) === 'string') {
@@ -215,7 +223,10 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     }
 
     return text && (
-      <span className={ css(`${classNames.base}-label`, classNames.label) } id={ this._labelId } >
+      <span
+        className={ this._classNames.label }
+        id={ this._labelId }
+      >
         { text }
       </span>
     );
@@ -235,16 +246,15 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   }
 
   @autobind
-  private _onRenderDescription() {
-    const { classNames, description } = this.props;
+  private _onRenderDescription(props: IButtonProps) {
+    const {
+    description
+    } = this.props;
 
     // ms-Button-description is only shown when the button type is compound.
     // In other cases it will not be displayed.
     return description ? (
-      <span
-        className={ css(`${classNames.base}-description`, classNames.description) }
-        id={ this._descriptionId }
-      >
+      <span className={ this._classNames.description } id={ this._descriptionId }>
         { description }
       </span>
     ) : (
@@ -254,12 +264,15 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
 
   @autobind
   private _onRenderAriaDescription() {
-    const { ariaDescription } = this.props;
+    const {
+     ariaDescription,
+      styles
+     } = this.props;
 
     // If ariaDescription is given, descriptionId will be assigned to ariaDescriptionSpan,
     // otherwise it will be assigned to descriptionSpan.
     return ariaDescription ? (
-      <span className={ styles.screenReaderOnly } id={ this._ariaDescriptionId }>{ ariaDescription }</span>
+      <span className={ styles.screenReaderText as string } id={ this._ariaDescriptionId }>{ ariaDescription }</span>
     ) : (
         null
       );
@@ -267,7 +280,14 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
 
   @autobind
   private _onRenderMenuIcon(props: IButtonProps): JSX.Element | null {
-    let { classNames, menuIconProps, menuIconName } = this.props;
+    let {
+      baseClassName,
+      checked,
+      disabled,
+      menuIconName,
+      menuIconProps,
+      styles
+       } = this.props;
 
     if (menuIconProps === undefined) {
       menuIconProps = {
@@ -279,7 +299,14 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       menuIconProps ?
         <Icon
           { ...menuIconProps }
-          className={ css(`${classNames.base}-icon`, classNames.menuIcon, menuIconProps.className) }
+          className={
+            mergeStyles(
+              `${baseClassName}-icon`,
+              styles.menuIcon,
+              disabled && styles.menuIconDisabled,
+              !disabled && checked && styles.menuIconChecked,
+              menuIconProps.className
+            ) as string }
         />
         :
         null
@@ -293,7 +320,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         isBeakVisible={ true }
         directionalHint={ DirectionalHint.bottomLeftEdge }
         {...menuProps}
-        className={ css('ms-BaseButton-menuhost', menuProps.className) }
+        className={ mergeStyles('ms-BaseButton-menuhost', menuProps.className) as string }
         target={ this._buttonElement }
         labelElementId={ this._labelId }
         onDismiss={ this._onToggleMenu }
@@ -302,11 +329,82 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   }
 
   @autobind
-  private _onToggleMenu() {
+  private _onToggleMenu(): void {
     const { menuProps } = this.props;
     let currentMenuProps = this.state.menuProps;
 
     this.setState({ menuProps: currentMenuProps ? null : menuProps });
   }
 
+  @memoize
+  private _getClassNames(
+    styles: IButtonStyles,
+    className: string,
+    variantClassName: string,
+    iconClassName: string,
+    disabled: boolean,
+    checked: boolean
+    ): IButtonClassNames {
+    return {
+      root: mergeStyles(
+        className,
+        'ms-Button',
+        variantClassName,
+        styles.root,
+        checked && [
+          'is-checked',
+          styles.rootChecked
+        ],
+        disabled && [
+          'is-disabled',
+          styles.rootDisabled
+        ],
+        !disabled && {
+          ':hover': styles.rootHovered,
+          ':hover .ms-Button-description': styles.descriptionHovered,
+          ':active': styles.rootPressed,
+          ':active .ms-Button-description': styles.descriptionPressed
+        }
+      ) as string,
+
+      flexContainer: mergeStyles(
+        'ms-Button-flexContainer',
+        styles.flexContainer
+      ) as string,
+
+      icon: mergeStyles(
+        'ms-Button-icon',
+        iconClassName,
+        styles.icon,
+        checked && styles.iconChecked,
+        disabled && styles.iconDisabled,
+      ) as string,
+
+      label: mergeStyles(
+        'ms-Button-label',
+        styles.label,
+        checked && styles.labelChecked,
+        disabled && styles.labelDisabled,
+      ) as string,
+
+      menuIcon: mergeStyles(
+        'ms-Button-menuIcon',
+        styles.menuIcon,
+        checked && styles.menuIconChecked,
+        disabled && styles.menuIconDisabled
+      ) as string,
+
+      description: mergeStyles(
+        'ms-Button-description',
+        styles.description,
+        checked && styles.descriptionChecked,
+        disabled && styles.descriptionDisabled
+      ) as string,
+
+      screenReaderText: mergeStyles(
+        'ms-Button-screenReaderText',
+        styles.screenReaderText
+      ) as string
+    };
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
index b82769fd1ee24..a1fab053a75b3 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
@@ -4,6 +4,7 @@ import { Button } from './Button';
 import { IRenderFunction } from '../../Utilities';
 import { IContextualMenuProps } from '../../ContextualMenu';
 import { IIconProps, IconName } from '../../Icon';
+import { IStyle } from '../../Styling';
 
 export interface IButton {
   /**
@@ -31,9 +32,14 @@ export interface IButtonProps extends React.HTMLAttributes<HTMLButtonElement | H
   disabled?: boolean;
 
   /**
-   * Whether the button is toggled
+   * Custom styling for individual elements within the button DOM.
    */
-  toggled?: boolean;
+  styles?: IButtonStyles;
+
+  /**
+   * Whether the button is checked
+   */
+  checked?: boolean;
 
   /**
    * If provided, additional class name to provide on the root element.
@@ -130,17 +136,22 @@ export interface IButtonProps extends React.HTMLAttributes<HTMLButtonElement | H
   rootProps?: React.HTMLProps<HTMLButtonElement> | React.HTMLProps<HTMLAnchorElement>;
 
   /**
-   * Deprecated on 4/15/2017, use iconProps={ { iconName: 'Emoji2' } } .
+   * Deprecated on 4/15/2017, use iconProps={ { iconName: 'Emoji2' } }.
    * @deprecated
    */
   icon?: string;
 
   /**
-   * Deprecated on 4/15/2017, use menuIconProps={ { iconName: 'Emoji2' } } .
+   * Deprecated on 4/15/2017, use menuIconProps={ { iconName: 'Emoji2' } }.
    * @deprecated
    */
   menuIconName?: IconName | string | null;
 
+  /**
+   * Deprecated on 5/26/2016, use checked.
+   * @deprecated
+   */
+  toggled?: boolean;
 }
 
 export enum ElementType {
@@ -159,3 +170,110 @@ export enum ButtonType {
   icon = 5,
   default = 6
 }
+
+export interface IButtonStyles {
+  /**
+   * Style for the root element in the default enabled, non-toggled state.
+   */
+  root?: IStyle;
+
+  /**
+   * Style override for the root element in a checked state, layered on top of the root style.
+   */
+  rootChecked?: IStyle;
+
+  /**
+   * Style override for the root element in a disabled state, layered on top of the root style.
+   */
+  rootDisabled?: IStyle;
+
+  /**
+   * Style override applied to the root on hover in the default, enabled, non-toggled state.
+   */
+  rootHovered?: IStyle;
+
+  /**
+   * Style override applied to the root on pressed in the default, enabled, non-toggled state.
+   */
+  rootPressed?: IStyle;
+
+  /**
+   * Style for the flexbox container within the root element.
+   */
+  flexContainer?: IStyle;
+
+  /**
+   * Style for the icon on the near side of the label.
+   */
+  icon?: IStyle;
+
+  /**
+   * Style override for the icon when the button is disabled.
+   */
+  iconDisabled?: IStyle;
+
+  /**
+   * Style override for the icon when the button is checked.
+   */
+  iconChecked?: IStyle;
+
+  /**
+   * Style for the text content of the button.
+   */
+  label?: IStyle;
+
+  /**
+   * Style override for the text content when the button is disabled.
+   */
+  labelDisabled?: IStyle;
+
+  /**
+   * Style override for the text content when the button is checked.
+   */
+  labelChecked?: IStyle;
+
+  /**
+   * Style for the menu chevron.
+   */
+  menuIcon?: IStyle;
+
+  /**
+   * Style override for the menu chevron when the button is disabled.
+   */
+  menuIconDisabled?: IStyle;
+
+  /**
+   * Style override for the menu chevron when the button is checked.
+   */
+  menuIconChecked?: IStyle;
+
+  /**
+   * Style for the description text if applicable (for compound buttons.)
+   */
+  description?: IStyle;
+
+  /**
+   * Style override for the description text when the button is hovered.
+   */
+  descriptionHovered?: IStyle;
+
+  /**
+   * Style for the description text when the button is pressed.
+   */
+  descriptionPressed?: IStyle;
+
+  /**
+   * Style override for the description text when the button is disabled.
+   */
+  descriptionDisabled?: IStyle;
+
+  /**
+   * Style override for the description text when the button is checked.
+   */
+  descriptionChecked?: IStyle;
+
+  /**
+   * Style for the screen reader text.
+   */
+  screenReaderText?: IStyle;
+}
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.visualtest.ts b/packages/office-ui-fabric-react/src/components/Button/Button.visualtest.ts
index 2f677b815ea91..dc268c7b803ff 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.visualtest.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.visualtest.ts
@@ -19,8 +19,8 @@ componentIds.push({
   commands: [defaultScreenshot]
 });
 componentIds.push({
-  selector: '#' + 'DefaultButtonToggled',
-  fileName: 'buttonDefaultToggled',
+  selector: '#' + 'DefaultButtonChecked',
+  fileName: 'buttonDefaultChecked',
   commands: [defaultScreenshot]
 });
 
@@ -36,8 +36,8 @@ componentIds.push({
   commands: [defaultScreenshot]
 });
 componentIds.push({
-  selector: '#' + 'PrimaryButtonToggled',
-  fileName: 'buttonPrimaryToggled',
+  selector: '#' + 'PrimaryButtonChecked',
+  fileName: 'buttonPrimaryChecked',
   commands: [defaultScreenshot]
 });
 
@@ -52,8 +52,8 @@ componentIds.push({
   commands: [defaultScreenshot]
 });
 componentIds.push({
-  selector: '#' + 'CommandButtonToggled',
-  fileName: 'buttonCommandToggled',
+  selector: '#' + 'CommandButtonChecked',
+  fileName: 'buttonCommandChecked',
   commands: [defaultScreenshot]
 });
 
@@ -68,8 +68,8 @@ componentIds.push({
   commands: [defaultScreenshot]
 });
 componentIds.push({
-  selector: '#' + 'CompoundButtonToggled',
-  fileName: 'buttonCompoundToggled',
+  selector: '#' + 'CompoundButtonChecked',
+  fileName: 'buttonCompoundChecked',
   commands: [defaultScreenshot]
 });
 
@@ -89,8 +89,8 @@ componentIds.push({
   }
 });
 componentIds.push({
-  selector: '#' + 'ContextualButtonToggled',
-  fileName: 'buttonContextualToggled',
+  selector: '#' + 'ContextualButtonChecked',
+  fileName: 'buttonContextualChecked',
   commands: [defaultScreenshot, mouseClickScreenshot, mouseDownScreenshot, mouseMoveScreenshot]
 });
 
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonCore/ButtonCore.scss b/packages/office-ui-fabric-react/src/components/Button/ButtonCore/ButtonCore.scss
deleted file mode 100644
index 3aca59dc9ffaf..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonCore/ButtonCore.scss
+++ /dev/null
@@ -1,48 +0,0 @@
- // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
-
-//
-// Office UI Fabric
-// --------------------------------------------------
-// Base Button styles
-
-@import '../../../common/common';
-@import './ButtonCoreVars';
-
-@mixin button-core-root-styles {
-  @include focus-border();
-  @include ms-font-m;
-
-  user-select: none;
-  border: 1px solid transparent; // this transparent border converts to the correct colors in HC mode
-  text-decoration: none;
-  text-align: center;
-  cursor: pointer;
-  display: inline-block;
-  vertical-align: top;
-  padding: $button-core-default-padding;
-}
-
-@mixin button-core-icon-styles {
-  margin: 0 4px;
-  height: 16px;
-  line-height: 16px;
-  text-align: center;
-  vertical-align: middle;
-}
-
-@mixin button-core-label-styles {
-  margin: 0 4px;
-  line-height: 100%;
-}
-
-@mixin button-core-disabled {
-  background-color: $ms-color-neutralLighter;
-  color: $ms-color-neutralTertiary;
-  cursor: default;
-  pointer-events: none;
-
-  &:hover,
-  &:focus {
-    outline: 0;
-  }
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonCore/ButtonCoreVars.scss b/packages/office-ui-fabric-react/src/components/Button/ButtonCore/ButtonCoreVars.scss
deleted file mode 100644
index e53c1f61ee2f9..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonCore/ButtonCoreVars.scss
+++ /dev/null
@@ -1,4 +0,0 @@
-$button-core-default-height: 32px;
-$button-core-default-minWidth: 80px;
-$button-core-default-padding: 0 16px;
-
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
index d7dab01ecdc92..9028a194ff603 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
@@ -15,7 +15,6 @@ import { ButtonIconExample } from './examples/Button.Icon.Example';
 import { ButtonAnchorExample } from './examples/Button.Anchor.Example';
 import { ButtonScreenReaderExample } from './examples/Button.ScreenReader.Example';
 import { ButtonSwapExample } from './examples/Button.Swap.Example';
-import { IButtonDemoPageState } from './examples/IButtonDemoPageState';
 import './examples/Button.Basic.Example.scss';
 import { Link } from '../../Link';
 
@@ -29,12 +28,17 @@ const ButtonScreenReaderExampleCode = require('!raw-loader!office-ui-fabric-reac
 const ButtonContextualMenuExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.ContextualMenu.Example.tsx') as string;
 const ButtonSwapExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx') as string;
 
+export interface IButtonDemoPageState {
+  areButtonsDisabled?: boolean;
+  areButtonsChecked?: boolean;
+}
+
 export class ButtonPage extends React.Component<IComponentDemoPageProps, IButtonDemoPageState> {
   constructor() {
     super();
     this.state = {
       areButtonsDisabled: false,
-      areButtonsToggled: false
+      areButtonsChecked: false
     };
   }
 
@@ -46,36 +50,33 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
         exampleCards={
           <div>
             <Checkbox label='Disable buttons' checked={ this.state.areButtonsDisabled } onChange={ this._onDisabledChanged.bind(this) } />
-            <Checkbox label='Toggle buttons' checked={ this.state.areButtonsToggled } onChange={ this._onToggledChanged.bind(this) } />
+            <Checkbox label='Mark as checked' checked={ this.state.areButtonsChecked } onChange={ this._onToggledChanged.bind(this) } />
             <ExampleCard title='Default Button' code={ ButtonDefaultExampleCode }>
-              <ButtonDefaultExample disabled={ this.state.areButtonsDisabled } toggled={ this.state.areButtonsToggled } />
-            </ExampleCard>
-            <ExampleCard title='Default NonToggle-able Button' code={ ButtonDefaultExampleCode }>
-              <ButtonDefaultExample disabled={ this.state.areButtonsDisabled } />
+              <ButtonDefaultExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
             <ExampleCard title='Primary Button' code={ ButtonPrimaryExampleCode }>
-              <ButtonPrimaryExample disabled={ this.state.areButtonsDisabled } toggled={ this.state.areButtonsToggled } />
+              <ButtonPrimaryExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
             <ExampleCard title='Compound Button' code={ ButtonCompoundExampleCode }>
-              <ButtonCompoundExample disabled={ this.state.areButtonsDisabled } toggled={ this.state.areButtonsToggled } />
+              <ButtonCompoundExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
             <ExampleCard title='Command Button' code={ ButtonCommandExampleCode }>
-              <ButtonCommandExample disabled={ this.state.areButtonsDisabled } toggled={ this.state.areButtonsToggled } />
+              <ButtonCommandExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
             <ExampleCard title='Icon Button' code={ ButtonIconExampleCode }>
-              <ButtonIconExample disabled={ this.state.areButtonsDisabled } toggled={ this.state.areButtonsToggled } />
+              <ButtonIconExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
             <ExampleCard title='Contextual Menu Button' code={ ButtonContextualMenuExampleCode }>
-              <ButtonContextualMenuExample disabled={ this.state.areButtonsDisabled } toggled={ this.state.areButtonsToggled } />
+              <ButtonContextualMenuExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
             <ExampleCard title='Button Like Anchor' code={ ButtonAnchorExampleCode }>
-              <ButtonAnchorExample disabled={ this.state.areButtonsDisabled } toggled={ this.state.areButtonsToggled } />
+              <ButtonAnchorExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
             <ExampleCard title='Button with Aria Description for Screen Reader' code={ ButtonScreenReaderExampleCode }>
-              <ButtonScreenReaderExample disabled={ this.state.areButtonsDisabled } toggled={ this.state.areButtonsToggled } />
+              <ButtonScreenReaderExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
             <ExampleCard title='Button Swap with Focus State' code={ ButtonSwapExampleCode }>
-              <ButtonSwapExample disabled={ this.state.areButtonsDisabled } toggled={ this.state.areButtonsToggled } />
+              <ButtonSwapExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
           </div>
         }
@@ -144,7 +145,7 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
 
   private _onToggledChanged(ev: React.MouseEvent<HTMLElement>, toggled: boolean) {
     this.setState({
-      areButtonsToggled: toggled
+      areButtonsChecked: toggled
     });
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.visualtest.tsx
index 1e88c3caffdbf..3fe9d8f7f542b 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.visualtest.tsx
@@ -16,14 +16,14 @@ export default class ButtonVPage extends React.Component<any, any> {
         <DefaultButton id='DefaultButtonDisabled' disabled={ true } icon='Add' text='Default Button' />
       </div>&nbsp;
       <div>
-        <label> Default Button Toggled:   </label>
-        <DefaultButton id='DefaultButtonToggled' icon='Add' toggled={ true } text='Default Button' />
+        <label> Default Button Checked:   </label>
+        <DefaultButton id='DefaultButtonChecked' icon='Add' checked={ true } text='Default Button' />
       </div>&nbsp;
       <div style={ { backgroundColor: 'white' } }>
         <IconButton id={ 'IconButton' } iconProps={ { iconName } } />
       </div>&nbsp;
       <div style={ { backgroundColor: 'white' } }>
-        <IconButton id={ 'IconButtonToggled' } toggled={ true } iconProps={ { iconName } } />
+        <IconButton id={ 'IconButtonChecked' } checked={ true } iconProps={ { iconName } } />
       </div>&nbsp;
       <div style={ { backgroundColor: 'white' } }>
         <CommandButton id='CommandButton'
@@ -36,8 +36,8 @@ export default class ButtonVPage extends React.Component<any, any> {
           text='Command Button' />
       </div >&nbsp;
       <div style={ { backgroundColor: 'white' } }>
-        <CommandButton id='CommandButtonToggled'
-          toggled={ true }
+        <CommandButton id='CommandButtonChecked'
+          checked={ true }
           icon='AddFriend'
           text='Command Button' />
       </div>&nbsp;
@@ -53,8 +53,8 @@ export default class ButtonVPage extends React.Component<any, any> {
           text='Compound Button' />
       </div>&nbsp;
       <div>
-        <CompoundButton id='CompoundButtonToggled'
-          toggled={ true }
+        <CompoundButton id='CompoundButtonChecked'
+          checked={ true }
           description='You can create a new account here.'
           text='Compound Button' />
       </div>&nbsp;
@@ -65,7 +65,7 @@ export default class ButtonVPage extends React.Component<any, any> {
         <PrimaryButton id='PrimaryButtonDisabled' disabled={ true } icon='Add' text='Primary Button' />
       </div >&nbsp;
       <div>
-        <PrimaryButton id='PrimaryButtonToggled' toggled={ true } icon='Add' text='Primary Button' />
+        <PrimaryButton id='PrimaryButtonToggled' checked={ true } icon='Add' text='Primary Button' />
       </div >&nbsp;
 
       <div>
@@ -95,7 +95,7 @@ export default class ButtonVPage extends React.Component<any, any> {
         </DefaultButton>
         <DefaultButton
           id='ContextualButtonToggled'
-          toggled={ true }
+          checked={ true }
           icon='Add'
           text='New'
           menuProps={ {
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.scss b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.scss
deleted file mode 100644
index 9fb29b19740bf..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.scss
+++ /dev/null
@@ -1,64 +0,0 @@
-// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
-
-//
-// Office UI Fabric
-// --------------------------------------------------
-// Command Button styles
-
-@import '../../../common/common';
-@import '../ButtonCore/ButtonCore';
-@import '../ButtonCore/ButtonCoreVars';
-
-$button-commandButtonHeight: 40px;
-
-.root {
-  @include button-core-root-styles;
-  border-width: 0;
-
-  background-color: transparent;
-  padding: 0 4px;
-  height: $button-commandButtonHeight;
-  color: $ms-color-neutralPrimary;
-}
-
-.flexContainer {
-  justify-content: flex-start;
-}
-
-.label {
-  @include button-core-label-styles;
-}
-
-.icon {
-  @include button-core-icon-styles;
-}
-
-.isEnabled {
-
-  &.isToggled {
-    background-color: $ms-color-neutralTertiaryAlt;
-
-    &:hover {
-      background-color: $ms-color-neutralLight;
-      color: $ms-color-themeDarker;
-    }
-  }
-
-  &:hover {
-    color: $ms-color-themeDarker;
-  }
-
-  &:active {
-    color: $ms-color-themePrimary;
-  }
-
-  .icon {
-    color: $ms-color-themePrimary;
-  }
-}
-
-.isDisabled {
-  @include button-core-disabled;
-  background-color: transparent;
-}
-
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
new file mode 100644
index 0000000000000..c53aa889d753d
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
@@ -0,0 +1,69 @@
+import { IButtonStyles } from '../Button.Props';
+import {
+  ITheme,
+  getTheme,
+  mergeStyleSets
+} from '../../../Styling';
+import { memoizeFunction } from '../../../Utilities';
+import {
+  getStyles as getBaseButtonStyles
+} from '../BaseButton.styles';
+
+const DEFAULT_BUTTON_HEIGHT = '40px';
+const DEFAULT_PADDING = '0 4px';
+
+export const getStyles = memoizeFunction((
+  theme: ITheme = getTheme(),
+  customStyles?: IButtonStyles
+): IButtonStyles => {
+  let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
+  let commandButtonStyles: IButtonStyles = {
+    root: {
+      borderWidth: '0',
+      padding: DEFAULT_PADDING,
+      height: DEFAULT_BUTTON_HEIGHT,
+      color: theme.palette.neutralPrimary,
+      backgroundColor: 'transparent'
+    },
+
+    rootHovered: {
+      color: theme.palette.themeDarker
+    },
+
+    rootPressed: {
+      color: theme.palette.themePrimary
+    },
+
+    rootDisabled: {
+      color: theme.palette.neutralTertiary,
+      backgroundColor: 'transparent'
+    },
+
+    rootChecked: {
+      backgroundColor: theme.palette.neutralTertiaryAlt,
+
+      ':hover': {
+        backgroundColor: theme.palette.neutralLight
+      }
+    },
+
+    flexContainer: {
+      justifyContent: 'flex-start'
+    },
+
+    icon: {
+      color: theme.palette.themePrimary
+    },
+
+    iconDisabled: {
+      color: 'inherit'
+    },
+
+    menuIcon: {
+      color: theme.palette.neutralSecondary
+    }
+
+  };
+
+  return mergeStyleSets(baseButtonStyles, commandButtonStyles, customStyles);
+});
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx
index cf8f74c0cafc5..f79fed9fa8076 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx
@@ -1,22 +1,8 @@
 import * as React from 'react';
-import { BaseButton, IButtonClassNames } from '../BaseButton';
+import { BaseButton } from '../BaseButton';
 import { BaseComponent, nullRender } from '../../../Utilities';
 import { IButtonProps } from '../Button.Props';
-import * as stylesImport from './CommandButton.scss';
-const styles: any = stylesImport;
-
-const CLASS_NAMES: IButtonClassNames = {
-  base: 'ms-Button',
-  variant: 'ms-Button--command',
-  icon: styles.icon,
-  menuIcon: styles.icon,
-  isDisabled: styles.isDisabled,
-  isEnabled: styles.isEnabled,
-  isToggled: styles.isToggled,
-  label: styles.label,
-  root: styles.root,
-  flexContainer: styles.flexContainer
-};
+import { getStyles } from './CommandButton.styles';
 
 export class CommandButton extends BaseComponent<IButtonProps, {}> {
 
@@ -26,11 +12,15 @@ export class CommandButton extends BaseComponent<IButtonProps, {}> {
   protected _shouldUpdateComponentRef = false;
 
   public render() {
+    let { styles } = this.props;
+
     return (
       <BaseButton
-        classNames={ CLASS_NAMES }
+        { ...this.props }
+        variantClassName='ms-Button--command'
+        styles={ getStyles(undefined, styles) }
         onRenderDescription={ nullRender }
-        { ...this.props } />
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.scss b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.scss
deleted file mode 100644
index 4956d4fdb0673..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.scss
+++ /dev/null
@@ -1,97 +0,0 @@
-// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
-
-//
-// Office UI Fabric
-// --------------------------------------------------
-// Compound Button styles
-
-@import '../../../common/common';
-@import '../ButtonCore/ButtonCore';
-@import '../ButtonCore/ButtonCoreVars';
-
-.root {
-  @include button-core-root-styles;
-
-  padding: 16px 20px;
-  background-color: $ms-color-neutralLighter;
-  color: $ms-color-neutralSecondary;
-
-  min-width: $button-core-default-minWidth;
-  max-width: 280px;
-
-  min-height: 72px;
-}
-
-.flexContainer {
-  flex-direction: column;
-  justify-content: center;
-  align-items: stretch;
-
-  @include text-align(left);
-
-  min-width: 100%;
-  height: auto;
-}
-
-
-.label {
-  @include button-core-label-styles;
-
-  font-weight: $ms-font-weight-semibold;
-  color: $ms-color-black;
-  margin: 0 0 5px;
-}
-
-.description {
-  @include ms-font-s;
-  color: $ms-color-neutralSecondary;
-  line-height: 100%;
-}
-
-.isEnabled {
-
-  &.isToggled {
-    background-color: $ms-color-themePrimary;
-    color: $ms-color-white;
-
-    .label,
-    .description {
-      color: inherit;
-    }
-
-    &:hover {
-      background-color: $ms-color-neutralLight;
-      .label,
-      .description {
-        color: $ms-color-neutralDark;
-      }
-    }
-  }
-
-  &:hover {
-    background-color: $ms-color-neutralLight;
-
-    .description {
-      color: $ms-color-neutralDark;
-    }
-  }
-
-  &:active {
-    background-color: $ms-color-themePrimary;
-    color: $ms-color-white;
-
-    .label,
-    .description {
-      color: inherit;
-    }
-  }
-}
-
-.isDisabled {
-  @include button-core-disabled;
-
-  .label,
-  .description {
-    color: inherit;
-  }
-}
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
new file mode 100644
index 0000000000000..3e444a08f2ea1
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
@@ -0,0 +1,71 @@
+import { IButtonStyles } from '../Button.Props';
+import {
+  ITheme,
+  getTheme,
+  mergeStyleSets
+} from '../../../Styling';
+import { memoizeFunction } from '../../../Utilities';
+import {
+  getStyles as getDefaultButtonStyles
+} from '../DefaultButton/DefaultButton.styles';
+
+const DEFAULT_BUTTON_HEIGHT = '32px';
+const DEFAULT_BUTTON_MINWIDTH = '80px';
+const DEFAULT_PADDING = '0 16px';
+
+export const getStyles = memoizeFunction((
+  theme: ITheme = getTheme(),
+  customStyles?: IButtonStyles
+): IButtonStyles => {
+  let defaultButtonStyles: IButtonStyles = getDefaultButtonStyles(
+    theme,
+    customStyles
+  );
+  let compoundButtonStyles: IButtonStyles = {
+    root: {
+      maxWidth: '280px',
+      minHeight: '72px',
+      height: 'auto',
+      padding: '20px'
+    },
+
+    flexContainer: {
+      flexDirection: 'column',
+      alignItems: 'flex-start',
+      minWidth: '100%',
+      margin: ''
+    },
+
+    label: {
+      margin: '0 0 5px',
+      lineHeight: '100%'
+    },
+
+    description: [
+      theme.fonts.small,
+      {
+        color: theme.palette.neutralSecondary,
+        lineHeight: '100%'
+      }
+    ],
+
+    descriptionHovered: {
+      color: theme.palette.neutralDark
+    },
+
+    descriptionPressed: {
+      color: 'inherit'
+    },
+
+    descriptionChecked: {
+      color: 'inherit'
+    },
+
+    descriptionDisabled: {
+      color: 'inherit'
+    }
+
+  };
+
+  return mergeStyleSets(defaultButtonStyles, compoundButtonStyles, customStyles);
+});
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
index 9d82f4a9bd7f7..9ea261fa817a0 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
@@ -1,23 +1,8 @@
 import * as React from 'react';
-import { BaseButton, IButtonClassNames } from '../BaseButton';
-import { BaseComponent } from '../../../Utilities';
+import { BaseButton } from '../BaseButton';
+import { BaseComponent, nullRender } from '../../../Utilities';
 import { IButtonProps } from '../Button.Props';
-
-import * as stylesImport from './CompoundButton.scss';
-const styles: any = stylesImport;
-
-const CLASS_NAMES: IButtonClassNames = {
-  base: 'ms-Button',
-  variant: 'ms-Button--compound',
-  description: styles.description,
-  flexContainer: styles.flexContainer,
-  icon: null,
-  isDisabled: styles.isDisabled,
-  isEnabled: styles.isEnabled,
-  isToggled: styles.isToggled,
-  label: styles.label,
-  root: styles.root
-};
+import { getStyles } from './CompoundButton.styles';
 
 export class CompoundButton extends BaseComponent<IButtonProps, {}> {
   /**
@@ -26,10 +11,13 @@ export class CompoundButton extends BaseComponent<IButtonProps, {}> {
   protected _shouldUpdateComponentRef = false;
 
   public render() {
+    let { styles } = this.props;
     return (
       <BaseButton
-        classNames={ CLASS_NAMES }
         { ...this.props }
+        variantClassName='ms-Button--compound'
+        styles={ getStyles(undefined, styles) }
+        onRenderIcon={ nullRender }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.scss b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.scss
deleted file mode 100644
index 93cc3f7862323..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.scss
+++ /dev/null
@@ -1,52 +0,0 @@
-// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
-//
-// Office UI Fabric
-// --------------------------------------------------
-// Default Button styles
-
-@import '../../../common/common';
-@import '../ButtonCore/ButtonCore';
-@import '../ButtonCore/ButtonCoreVars';
-
-.root {
-  @include button-core-root-styles;
-
-  background-color: $ms-color-neutralLighter;
-  color: $ms-color-neutralPrimary;
-
-  min-width: $button-core-default-minWidth;
-  height: $button-core-default-height;
-
-  font-weight: $ms-font-weight-semibold;
-  font-size: $ms-font-size-m;
-}
-
-.label {
-  @include button-core-label-styles;
-}
-
-.icon {
-  @include button-core-icon-styles;
-}
-
-.isEnabled {
-
-  &.isToggled {
-    background-color: $ms-color-themePrimary;
-    color: $ms-color-white;
-  }
-
-  &:hover {
-    background-color: $ms-color-neutralLight;
-    color: $ms-color-black;
-  }
-
-  &:active {
-    background-color: $ms-color-themePrimary;
-    color: $ms-color-white;
-  }
-}
-
-.isDisabled {
-  @include button-core-disabled;
-}
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
new file mode 100644
index 0000000000000..9cbe13fdd2cce
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
@@ -0,0 +1,53 @@
+import { IButtonStyles } from '../Button.Props';
+import {
+  ITheme,
+  getTheme,
+  mergeStyleSets
+} from '../../../Styling';
+import { memoizeFunction } from '../../../Utilities';
+import {
+  getStyles as getBaseButtonStyles
+} from '../BaseButton.styles';
+
+const DEFAULT_BUTTON_HEIGHT = '32px';
+const DEFAULT_BUTTON_MINWIDTH = '80px';
+const DEFAULT_PADDING = '0 16px';
+
+export const getStyles = memoizeFunction((
+  theme: ITheme = getTheme(),
+  customStyles?: IButtonStyles,
+  focusInset?: string,
+  focusColor?: string
+): IButtonStyles => {
+  let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme, focusInset, focusColor);
+  let defaultButtonStyles: IButtonStyles = {
+    root: {
+      minWidth: DEFAULT_BUTTON_MINWIDTH,
+      height: DEFAULT_BUTTON_HEIGHT,
+      backgroundColor: theme.palette.neutralLighter,
+      color: theme.palette.neutralPrimary
+    },
+
+    rootHovered: {
+      backgroundColor: theme.palette.neutralLight,
+      color: theme.palette.black
+    },
+
+    rootPressed: {
+      backgroundColor: theme.palette.themePrimary,
+      color: theme.palette.white
+    },
+
+    rootChecked: {
+      backgroundColor: theme.palette.themePrimary,
+      color: theme.palette.white
+    },
+
+    label: {
+      fontWeight: 'bold' // theme.fontWeights.semibold,
+    }
+
+  };
+
+  return mergeStyleSets(baseButtonStyles, defaultButtonStyles, customStyles);
+});
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
index 525e9bde94c40..1e01c0bd2f441 100644
--- a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
@@ -1,22 +1,8 @@
 import * as React from 'react';
-import { BaseButton, IButtonClassNames } from '../BaseButton';
+import { BaseButton } from '../BaseButton';
 import { BaseComponent, nullRender } from '../../../Utilities';
 import { IButtonProps } from '../Button.Props';
-
-import * as stylesImport from './DefaultButton.scss';
-const styles: any = stylesImport;
-
-export const CLASS_NAMES: IButtonClassNames = {
-  base: 'ms-Button',
-  variant: 'ms-Button--default',
-  icon: styles.icon,
-  menuIcon: styles.icon,
-  isDisabled: styles.isDisabled,
-  isEnabled: styles.isEnabled,
-  isToggled: styles.isToggled,
-  label: styles.label,
-  root: styles.root
-};
+import { getStyles } from './DefaultButton.styles';
 
 export class DefaultButton extends BaseComponent<IButtonProps, {}> {
   /**
@@ -25,11 +11,15 @@ export class DefaultButton extends BaseComponent<IButtonProps, {}> {
   protected _shouldUpdateComponentRef = false;
 
   public render() {
+    const { styles } = this.props;
+
     return (
       <BaseButton
-        classNames={ CLASS_NAMES }
+        { ...this.props }
+        variantClassName='ms-Button--default'
+        styles={ getStyles(undefined, styles) }
         onRenderDescription={ nullRender }
-        { ...this.props } />
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.scss b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.scss
deleted file mode 100644
index 69ad41dc2c48c..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.scss
+++ /dev/null
@@ -1,59 +0,0 @@
-// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
-
-//
-// Office UI Fabric
-// --------------------------------------------------
-// Icon Button styles
-
-@import '../../../common/common';
-@import '../ButtonCore/ButtonCore';
-@import '../ButtonCore/ButtonCoreVars';
-
-$button-iconButtonSize: $button-core-default-height;
-
-.root {
-  @include button-core-root-styles;
-  border-width: 0;
-
-  background-color: transparent;
-  padding: 0 4px;
-
-  width: $button-iconButtonSize;
-  height: $button-iconButtonSize;
-
-  color: $ms-color-neutralSecondary;
-  font-size: $ms-icon-size-m;
-}
-
-.icon {
-  @include button-core-icon-styles;
-  color: $ms-color-black;
-}
-
-.isEnabled {
-
-  &.isToggled {
-    background-color: $ms-color-neutralTertiaryAlt;
-
-    &.icon {
-      color: $ms-color-black;
-    }
-
-    &:hover {
-      background-color: $ms-color-neutralLight;
-    }
-  }
-
-  &:hover {
-    color: $ms-color-themeDarker;
-  }
-
-  &:active {
-    color: $ms-color-themePrimary;
-  }
-}
-
-.isDisabled {
-  @include button-core-disabled;
-  background-color: transparent;
-}
diff --git a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
new file mode 100644
index 0000000000000..cafb1ca161e40
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
@@ -0,0 +1,51 @@
+import { IButtonStyles } from '../Button.Props';
+import {
+  ITheme,
+  mergeStyleSets,
+  getTheme
+} from '../../../Styling';
+import { memoizeFunction } from '../../../Utilities';
+import {
+  getStyles as getBaseButtonStyles
+} from '../BaseButton.styles';
+
+const DEFAULT_BUTTON_HEIGHT = '32px';
+const DEFAULT_PADDING = '0 4px';
+
+export const getStyles = memoizeFunction((
+  theme: ITheme = getTheme(),
+  customStyles?: IButtonStyles
+): IButtonStyles => {
+  let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
+  let iconButtonStyles: IButtonStyles = {
+    root: {
+      padding: '0 4px',
+      width: '32px',
+      height: '32px',
+      backgroundColor: 'transparent'
+    },
+
+    rootHovered: {
+      color: theme.palette.themeDarker
+    },
+
+    rootPressed: {
+      color: theme.palette.themePrimary
+    },
+
+    rootChecked: {
+      backgroundColor: theme.palette.neutralTertiaryAlt,
+
+      ':hover': {
+        backgroundColor: theme.palette.neutralLight
+      }
+
+    },
+
+    rootDisabled: {
+      color: theme.palette.neutralTertiary
+    }
+  };
+
+  return mergeStyleSets(baseButtonStyles, iconButtonStyles, customStyles);
+});
diff --git a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
index 42c1f35774c19..89b88186c4baa 100644
--- a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
@@ -1,20 +1,8 @@
 import * as React from 'react';
-import { BaseButton, IButtonClassNames } from '../BaseButton';
+import { BaseButton } from '../BaseButton';
 import { BaseComponent, nullRender } from '../../../Utilities';
 import { IButtonProps } from '../Button.Props';
-import * as stylesImport from './IconButton.scss';
-const styles: any = stylesImport;
-
-const CLASS_NAMES: IButtonClassNames = {
-  base: 'ms-Button',
-  variant: 'ms-Button--icon',
-  icon: styles.icon,
-  menuIcon: styles.icon,
-  isDisabled: styles.isDisabled,
-  isEnabled: styles.isEnabled,
-  isToggled: styles.isToggled,
-  root: styles.root
-};
+import { getStyles } from './IconButton.styles';
 
 export class IconButton extends BaseComponent<IButtonProps, {}> {
   /**
@@ -23,12 +11,16 @@ export class IconButton extends BaseComponent<IButtonProps, {}> {
   protected _shouldUpdateComponentRef = false;
 
   public render() {
+    let { styles } = this.props;
+
     return (
       <BaseButton
-        classNames={ CLASS_NAMES }
+        { ...this.props }
+        variantClassName='ms-Button--icon'
+        styles={ getStyles(undefined, styles) }
         onRenderText={ nullRender }
         onRenderDescription={ nullRender }
-        { ...this.props } />
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.scss b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.scss
deleted file mode 100644
index 0223eb7b9341f..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.scss
+++ /dev/null
@@ -1,57 +0,0 @@
-// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
-//
-// Office UI Fabric
-// --------------------------------------------------
-// Default Button styles
-
-@import '../../../common/common';
-@import '../ButtonCore/ButtonCore';
-@import '../ButtonCore/ButtonCoreVars';
-
-.root {
-  @include button-core-root-styles;
-  @include focus-border(1px, $ms-color-white);
-
-  background-color: $ms-color-themePrimary;
-  color: $ms-color-white;
-
-  min-width: $button-core-default-minWidth;
-  height: $button-core-default-height;
-
-  font-weight: $ms-font-weight-semibold;
-  font-size: $ms-font-size-m;
-}
-
-.label {
-  @include button-core-label-styles;
-}
-
-.icon {
-  @include button-core-icon-styles;
-}
-
-.isEnabled {
-
-  &.isToggled {
-    background-color: $ms-color-themeDark;
-    color: $ms-color-white;
-
-    &:hover {
-      background-color: $ms-color-neutralLight;
-      color: $ms-color-black;
-    }
-  }
-
-  &:hover {
-    background-color: $ms-color-themeDark;
-  }
-
-  &:active {
-    background-color: $ms-color-themePrimary;
-    color: $ms-color-white;
-  }
-}
-
-.isDisabled {
-  @include button-core-disabled;
-}
diff --git a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
new file mode 100644
index 0000000000000..ea0b5b0d3217a
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
@@ -0,0 +1,51 @@
+import { IButtonStyles } from '../Button.Props';
+import {
+  ITheme,
+  getTheme,
+  mergeStyleSets
+} from '../../../Styling';
+import { memoizeFunction } from '../../../Utilities';
+import {
+  getStyles as getDefaultButtonStyles
+} from '../DefaultButton/DefaultButton.styles';
+
+export const getStyles = memoizeFunction((
+  theme: ITheme = getTheme(),
+  customStyles?: IButtonStyles
+): IButtonStyles => {
+  let { palette } = theme;
+  let defaultButtonStyles: IButtonStyles = getDefaultButtonStyles(
+    theme,
+    customStyles,
+    '0px',
+    palette.white
+  );
+  let primaryButtonStyles: IButtonStyles = {
+    root: {
+      backgroundColor: palette.themePrimary,
+      color: palette.white
+    },
+
+    rootHovered: {
+      backgroundColor: palette.themeDark,
+      color: palette.white
+    },
+
+    rootPressed: {
+      backgroundColor: palette.themePrimary,
+      color: palette.white
+    },
+
+    rootChecked: {
+      backgroundColor: palette.themeDark,
+      color: palette.white,
+
+      ':hover': {
+        backgroundColor: theme.palette.neutralLight,
+        color: theme.palette.black
+      }
+    }
+  };
+
+  return mergeStyleSets(defaultButtonStyles, primaryButtonStyles, customStyles);
+});
diff --git a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
index 90e193a585f73..7e7dd1c6e23ae 100644
--- a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
@@ -1,22 +1,8 @@
 import * as React from 'react';
 import { BaseComponent, nullRender } from '../../../Utilities';
-import { BaseButton, IButtonClassNames } from '../BaseButton';
+import { BaseButton } from '../BaseButton';
 import { IButtonProps } from '../Button.Props';
-
-import * as stylesImport from './PrimaryButton.scss';
-const styles: any = stylesImport;
-
-const CLASS_NAMES: IButtonClassNames = {
-  base: 'ms-Button',
-  variant: 'ms-Button--primary',
-  icon: styles.icon,
-  menuIcon: styles.icon,
-  isDisabled: styles.isDisabled,
-  isEnabled: styles.isEnabled,
-  isToggled: styles.isToggled,
-  label: styles.label,
-  root: styles.root
-};
+import { getStyles } from './PrimaryButton.styles';
 
 export class PrimaryButton extends BaseComponent<IButtonProps, {}> {
   /**
@@ -25,11 +11,14 @@ export class PrimaryButton extends BaseComponent<IButtonProps, {}> {
   protected _shouldUpdateComponentRef = false;
 
   public render() {
+    const { styles } = this.props;
+
     return (
       <BaseButton
-        classNames={ CLASS_NAMES }
-        onRenderDescription={ nullRender }
         { ...this.props }
+        variantClassName='ms-Button--primary'
+        onRenderDescription={ nullRender }
+        styles={ getStyles(undefined, styles) }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
index 0178be4019780..75273071d7c38 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
@@ -13,7 +13,7 @@ export class ButtonAnchorExample extends React.Component<IButtonProps, {}> {
   }
 
   public render() {
-    let { disabled, toggled } = this.props;
+    let { disabled, checked } = this.props;
 
     return (
       <div className='ms-BasicButtonsExample'>
@@ -21,7 +21,7 @@ export class ButtonAnchorExample extends React.Component<IButtonProps, {}> {
         <PrimaryButton
           data-automation-id='test'
           disabled={ disabled }
-          toggled={ toggled }
+          checked={ checked }
           href='http://bing.com'
           target='_blank'
           title='Let us bing!'>
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Command.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Command.Example.tsx
index 6c3f713ad3d24..c241ba99f6f18 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Command.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Command.Example.tsx
@@ -13,7 +13,7 @@ export class ButtonCommandExample extends React.Component<IButtonProps, any> {
   }
 
   public render() {
-    let { disabled, toggled } = this.props;
+    let { disabled, checked } = this.props;
 
     return (
       <div className='ms-BasicButtonsExample'>
@@ -22,7 +22,7 @@ export class ButtonCommandExample extends React.Component<IButtonProps, any> {
           data-automation-id='test'
           iconProps={ { iconName: 'AddFriend' } }
           disabled={ disabled }
-          toggled={ toggled }
+          checked={ checked }
         >
           Create account
         </CommandButton>
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx
index 534dc3c44b667..d626df339bd38 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx
@@ -11,7 +11,7 @@ export class ButtonCompoundExample extends React.Component<IButtonProps, {}> {
   }
 
   public render() {
-    let { disabled, toggled } = this.props;
+    let { disabled, checked } = this.props;
 
     return (
       <div className='ms-BasicButtonsExample'>
@@ -19,7 +19,7 @@ export class ButtonCompoundExample extends React.Component<IButtonProps, {}> {
         <CompoundButton
           description='You can create a new account here.'
           disabled={ disabled }
-          toggled={ toggled }
+          checked={ checked }
         >
           Create account
         </CompoundButton>
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.ContextualMenu.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.ContextualMenu.Example.tsx
index ead0c96b08227..497a76c02876c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.ContextualMenu.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.ContextualMenu.Example.tsx
@@ -3,7 +3,7 @@ import { DefaultButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
 
 export class ButtonContextualMenuExample extends React.Component<IButtonProps, {}> {
   public render() {
-    let { disabled, toggled } = this.props;
+    let { disabled, checked } = this.props;
 
     return (
       <div className='ms-ContextualMenuButtonsExample'>
@@ -11,7 +11,7 @@ export class ButtonContextualMenuExample extends React.Component<IButtonProps, {
           <DefaultButton
             data-automation-id='test'
             disabled={ disabled }
-            toggled={ toggled }
+            checked={ checked }
             iconProps={ { iconName: 'Add' } }
             text='New'
             menuProps={ {
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
index 4064622a79097..d6d2e05f8f239 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
@@ -3,7 +3,7 @@ import { DefaultButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
 
 export class ButtonDefaultExample extends React.Component<IButtonProps, {}> {
   public render() {
-    let { disabled, toggled } = this.props;
+    let { disabled, checked } = this.props;
 
     return (
       <div className='ms-BasicButtonsExample'>
@@ -11,7 +11,7 @@ export class ButtonDefaultExample extends React.Component<IButtonProps, {}> {
           <DefaultButton
             data-automation-id='test'
             disabled={ disabled }
-            toggled={ toggled }
+            checked={ checked }
             iconProps={ { iconName: 'Add' } }
             description='I am a description'
             text='Create account'
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx
index 2cce4a6e4b8fe..06bf11e75b558 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx
@@ -8,14 +8,14 @@ export class ButtonIconExample extends React.Component<IButtonProps, {}> {
   }
 
   public render() {
-    let { disabled, toggled } = this.props;
+    let { disabled, checked } = this.props;
 
     return (
       <div className='ms-BasicButtonsExample'>
         <Label>Icon button</Label>
         <IconButton
           disabled={ disabled }
-          toggled={ toggled }
+          checked={ checked }
           iconProps={ { iconName: 'Emoji2' } }
           title='Emoji'
           ariaLabel='Emoji' />
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
index 0032f9620dbc5..ccfceb56e3e13 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
@@ -1,26 +1,26 @@
-import * as React from 'react';
-import { PrimaryButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
-import { Label } from 'office-ui-fabric-react/lib/Label';
-
-export class ButtonPrimaryExample extends React.Component<IButtonProps, {}> {
-  public constructor() {
-    super();
-  }
-
-  public render() {
-    let { disabled, toggled } = this.props;
-
-    return (
-      <div className='ms-BasicButtonsExample'>
-        <Label>Primary button</Label>
-        <PrimaryButton
-          data-automation-id='test'
-          disabled={ disabled }
-          toggled={ toggled }
-          text='Create account'
-          onClick={ () => alert('Clicked') }
-        />
-      </div>
-    );
-  }
-}
+import * as React from 'react';
+import { PrimaryButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
+import { Label } from 'office-ui-fabric-react/lib/Label';
+
+export class ButtonPrimaryExample extends React.Component<IButtonProps, {}> {
+  public constructor() {
+    super();
+  }
+
+  public render() {
+    let { disabled, checked } = this.props;
+
+    return (
+      <div className='ms-BasicButtonsExample'>
+        <Label>Primary button</Label>
+        <PrimaryButton
+          data-automation-id='test'
+          disabled={ disabled }
+          checked={ checked }
+          text='Create account'
+          onClick={ () => alert('Clicked') }
+        />
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx
index eb3a0af017ead..d7695f5a31d4e 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx
@@ -8,7 +8,7 @@ export class ButtonScreenReaderExample extends React.Component<IButtonProps, {}>
   }
 
   public render() {
-    let { disabled, toggled } = this.props;
+    let { disabled, checked } = this.props;
 
     return (
       <div className='ms-BasicButtonsExample'>
@@ -16,7 +16,7 @@ export class ButtonScreenReaderExample extends React.Component<IButtonProps, {}>
         <PrimaryButton
           data-automation-id='test'
           disabled={ disabled }
-          toggled={ toggled }
+          checked={ checked }
           ariaDescription='This is aria description used for screen reader.'>
           Aria Description
         </PrimaryButton>
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
index c434ef26a0f3a..a9ab0846342f4 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
@@ -40,7 +40,7 @@ export class ButtonSwapExample extends React.Component<IButtonProps, IButtonSwap
 
   public render() {
     let { isPrimary } = this.state;
-    let { disabled, toggled } = this.props;
+    let { disabled, checked } = this.props;
     let text = 'Swap';
 
     // determine which button to render
@@ -48,14 +48,14 @@ export class ButtonSwapExample extends React.Component<IButtonProps, IButtonSwap
       ? <PrimaryButton
         ref={ this._setButtonRef }
         disabled={ disabled }
-        toggled={ toggled }
+        checked={ checked }
         onClick={ this._onClick }>
         { text }
       </PrimaryButton>
       : <DefaultButton
         ref={ this._setButtonRef }
         disabled={ disabled }
-        toggled={ toggled }
+        checked={ checked }
         onClick={ this._onClick }>
         { text }
       </DefaultButton>;
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/IButtonDemoPageState.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/IButtonDemoPageState.tsx
deleted file mode 100644
index 018de2e71d1d4..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Button/examples/IButtonDemoPageState.tsx
+++ /dev/null
@@ -1,4 +0,0 @@
-export interface IButtonDemoPageState {
-  areButtonsDisabled?: boolean;
-  areButtonsToggled?: boolean;
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index eca2361c89cdb..f924f5ff36312 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -11,7 +11,7 @@ import {
 import { ICalendarStrings } from './Calendar.Props';
 import { DayOfWeek, DateRangeType } from '../../utilities/dateValues/DateValues';
 import { FocusZone } from '../../FocusZone';
-
+import { Icon } from '../../Icon';
 import {
   addDays,
   addWeeks,
@@ -105,7 +105,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
               aria-label={ strings.prevMonthAriaLabel }
               role='button'
               tabIndex={ 0 }>
-              <i className={ css('ms-Icon', { 'ms-Icon--ChevronLeft': !getRTL(), 'ms-Icon--ChevronRight': getRTL() }) } />
+              <Icon iconName={ getRTL() ? 'chevronRight' : 'chevronLeft' } />
             </span >
             <span
               className={ css('ms-DatePicker-nextMonth js-nextMonth', styles.nextMonth) }
@@ -115,7 +115,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
               aria-label={ strings.nextMonthAriaLabel }
               role='button'
               tabIndex={ 0 }>
-              <i className={ css('ms-Icon', { 'ms-Icon--ChevronLeft': getRTL(), 'ms-Icon--ChevronRight': !getRTL() }) } />
+              <Icon iconName={ getRTL() ? 'chevronLeft' : 'chevronRight' } />
             </span >
           </div >
           <div className={ css('ms-DatePicker-headerToggleView js-showMonthPicker', styles.headerToggleView) } />
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
index 9c79628d0c632..df6ebe204a673 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
@@ -8,6 +8,7 @@ import {
 import { ICalendarStrings } from './Calendar.Props';
 import { FocusZone } from '../../FocusZone';
 import { addYears, setMonth } from '../../utilities/dateMath/DateMath';
+import { Icon } from '../../Icon';
 import * as stylesImport from './Calendar.scss';
 const styles: any = stylesImport;
 
@@ -52,7 +53,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
               aria-label={ strings.prevYearAriaLabel }
               role='button'
               tabIndex={ 0 }>
-              <i className={ css('ms-Icon', { 'ms-Icon--ChevronLeft': !getRTL(), 'ms-Icon--ChevronRight': getRTL() }) } />
+              <Icon iconName={ getRTL() ? 'chevronRight' : 'chevronLeft' } />
             </span>
             <span
               className={ css('ms-DatePicker-nextYear js-nextYear', styles.nextYear) }
@@ -61,7 +62,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
               aria-label={ strings.nextYearAriaLabel }
               role='button'
               tabIndex={ 0 }>
-              <i className={ css('ms-Icon', { 'ms-Icon--ChevronLeft': getRTL(), 'ms-Icon--ChevronRight': !getRTL() }) } />
+              <Icon iconName={ getRTL() ? 'chevronLeft' : 'chevronRight' } />
             </span>
           </div>
           <div className={ css('ms-DatePicker-currentYear js-showYearPicker', styles.currentYear) }>{ navigatedDate.getFullYear() }</div>
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index c6d7fdbf3da55..7beb3ac258198 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -17,6 +17,8 @@ import {
 import { getRelativePositions, IPositionInfo, IPositionProps, getMaxHeight } from '../../utilities/positioning';
 import { Popup } from '../../Popup';
 import * as stylesImport from './Callout.scss';
+import { AnimationClassNames } from '../../Styling';
+
 const styles: any = stylesImport;
 
 const BEAK_ORIGIN_POSITION = { top: 0, left: 0 };
@@ -122,12 +124,17 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       backgroundColor: backgroundColor,
     };
 
-    let directionalClassName = positions && positions.directionalClassName ? `ms-${positions.directionalClassName}` : '';
+    let directionalClassName = (positions && positions.directionalClassName)
+      ? AnimationClassNames[positions.directionalClassName]
+      : '';
 
     let contentMaxHeight: number = this._getMaxHeight();
     let beakVisible: boolean = isBeakVisible && (!!targetElement || !!target);
     let content = (
-      <div ref={ this._resolveRef('_hostElement') } className={ css('ms-Callout-container', styles.container) }>
+      <div
+        ref={ this._resolveRef('_hostElement') }
+        className={ css('ms-Callout-container', styles.container) }
+      >
         <div
           className={
             css(
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
index b37dcf75b08f5..ffd7cb30feec0 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
@@ -57,7 +57,7 @@ export class CalloutPage extends React.Component<IComponentDemoPageProps, any> {
 
             <p>Use a Callout for displaying additional contextual information about an item on the screen. Callouts also have a tail that identifies their source. A common use for Callout is the introduction of a new feature or capability of an app or site. Alternate usages include pairing the Callout with a button or clickable element for on-demand presentation of additional or supporting content.</p>
 
-            <p>Real-world examples of this implementation can be seen in administrative interfaces where a particularly difficult-to-understand concept is paired with the ms-Icon--info "i" icon. In this example, Callout - with its tip text - is opened when the user clicks on or hovers over the icon.</p>
+            <p>Real-world examples of this implementation can be seen in administrative interfaces where a particularly difficult-to-understand concept is paired with the iconClassNames.info "i" icon. In this example, Callout - with its tip text - is opened when the user clicks on or hovers over the icon.</p>
           </div>
         }
         related={
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.scss b/packages/office-ui-fabric-react/src/components/Check/Check.scss
index 267f6c9fa53b1..532bb15360661 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.scss
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.scss
@@ -16,66 +16,50 @@ $checkBoxHeight: 24px;
   vertical-align: top;
   position: relative;
   @include ms-user-select(none);
+}
 
-  &.rootIsChecked {
-    .background {
-      &:before {
-        color: $ms-color-themePrimary;
-      }
-
-      &:after {
-        color: $ms-color-white;
-      }
-    }
-
-    .check {
-      opacity: 1;
-      color: $ms-color-white;
-      font-weight: 900;
-      font-size: $ms-font-size-s;
-    }
-  }
-
-  &:hover {
-    .check {
-      opacity: 1;
-    }
-  }
+.root:hover,
+.root:focus,
+.rootIsChecked {
+  opacity: 1;
 }
 
+.background,
+.circle,
 .check {
+  position: absolute;
+  height: $checkBoxHeight;
+  width: $checkBoxHeight;
   left: 50%;
   top: 50%;
   transform: translate(-50%, -50%);
-  position: absolute;
-  color: $ms-color-neutralTertiaryAlt;
-  opacity: 0;
+  font-size: $checkBoxHeight;
 }
 
 .background {
-  position: relative;
-  height: $checkBoxHeight;
-  width: $checkBoxHeight;
+  color: $ms-color-white;
+}
+
+.rootIsChecked .background {
+  color: $ms-color-themePrimary;
+}
 
-  &:before {
-    content: '\E91F';
-    color: $ms-color-white;
-  }
+.circle {
+  color: $ms-color-neutralTertiaryAlt;
+}
 
-  &:after {
-    content: '\EA3A';
-    color: $ms-color-neutralTertiaryAlt;
-  }
+.rootIsChecked .circle {
+  color: $ms-color-white;
+}
 
-  &:before,
-  &:after {
-    left: 50%;
-    top: 50%;
-    transform: translate(-50%, -50%);
-    font-size: $checkBoxHeight;
-    height: $checkBoxHeight;
-    width: $checkBoxHeight;
-    position: absolute;
-  }
+.check {
+  width: auto;
+  height: auto;
+  color: $ms-color-neutralTertiaryAlt;
+  font-size: 12px;
 }
 
+.rootIsChecked .check {
+  color: $ms-color-white;
+  font-weight: 900;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.tsx b/packages/office-ui-fabric-react/src/components/Check/Check.tsx
index f14c644539e90..625b4f404d85d 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.tsx
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.tsx
@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { BaseComponent, css } from '../../Utilities';
+import { Icon } from '../../Icon';
 import * as stylesImport from './Check.scss';
 const styles: any = stylesImport;
 
@@ -14,6 +15,8 @@ export interface ICheckProps extends React.Props<Check> {
    * @deprecated
    */
   isChecked?: boolean;
+
+  alwaysShowCheck?: boolean;
 }
 
 export class Check extends BaseComponent<ICheckProps, {}> {
@@ -34,12 +37,20 @@ export class Check extends BaseComponent<ICheckProps, {}> {
       <div className={ css(
         'ms-Check',
         styles.root,
-        {
-          ['is-checked ' + styles.rootIsChecked]: isChecked
-        }) }>
-        <div className={ css('ms-Icon ms-Check-background', styles.background) }>
-        </div>
-        <i className={ css('ms-Check-check ms-Icon ms-Icon--CheckMark', styles.check) }></i>
+        isChecked && ('is-checked ' + styles.rootIsChecked)
+      ) }>
+        <Icon
+          className={ css('ms-Check-background', styles.background) }
+          iconName='fullCircleMask'
+        />
+        <Icon
+          className={ css('ms-Check-circle', styles.circle) }
+          iconName='circleRing'
+        />
+        <Icon
+          className={ css('ms-Check-check', styles.check) }
+          iconName='checkMark'
+        />
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
index 6d290b6ea438c..9acc79e6c04d7 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
@@ -17,6 +17,7 @@ import {
   updateH,
   updateSV
 } from '../../utilities/color/colors';
+import { FontClassNames } from '../../Styling';
 import * as stylesImport from './ColorPicker.scss';
 const styles: any = stylesImport;
 
@@ -71,7 +72,7 @@ export class ColorPicker extends BaseComponent<IColorPickerProps, IColorPickerSt
             />) }
           <table className='ms-ColorPicker-table' cellPadding='0' cellSpacing='0'>
             <thead>
-              <tr className='ms-font-s'>
+              <tr className={ FontClassNames.small }>
                 <td>Hex</td>
                 <td>Red</td>
                 <td>Green</td>
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 37692f14b2161..4c7aed048d603 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -18,6 +18,7 @@ import {
   IconName,
   IIconProps
 } from '../../Icon';
+import { FontClassNames } from '../../Styling';
 import * as stylesImport from './CommandBar.scss';
 const styles: any = stylesImport;
 
@@ -93,14 +94,15 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
           <div className={ css(
             'ms-CommandBarSearch-iconWrapper ms-CommandBarSearch-iconSearchWrapper',
             styles.searchIconWrapper, styles.searchIconSearchWrapper) }>
-            <i className={ css('ms-Icon ms-Icon--Search') }></i>
+            <Icon iconName='search' />
           </div>
           <div className={ css(
-            'ms-CommandBarSearch-iconWrapper ms-CommandBarSearch-iconClearWrapper ms-font-s',
+            'ms-CommandBarSearch-iconWrapper ms-CommandBarSearch-iconClearWrapper',
+            FontClassNames.small,
             styles.searchIconWrapper,
             styles.searchIconClearWrapper
           ) }>
-            <i className={ css('ms-Icon ms-Icon--Cancel') }></i>
+            <Icon iconName='cancel' />
           </div>
         </div>
       );
@@ -127,7 +129,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
                   aria-haspopup={ true }
                   data-automation-id='commandBarOverflow'
                 >
-                  <i className={ css('ms-CommandBarItem-overflow ms-Icon ms-Icon--More', styles.itemOverflow) } />
+                  <Icon className={ css('ms-CommandBarItem-overflow', styles.itemOverflow) } iconName='more' />
                 </button>
               </div>
             ] : []) }
@@ -195,7 +197,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
               </span>
             ) }
             { hasSubmenuItems(item) ? (
-              <i className={ css('ms-CommandBarItem-chevronDown ms-Icon ms-Icon--ChevronDown', styles.itemChevronDown) } />
+              <Icon className={ css('ms-CommandBarItem-chevronDown', styles.itemChevronDown) } iconName='chevronDown' />
             ) : (null) }
           </button>;
         } else if (item.href) {
@@ -227,7 +229,8 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
             aria-haspopup={ hasSubmenuItems(item) }
           >
             { (hasIcon) ? this._renderIcon(item) : (null) }
-            <span className={ css('ms-CommandBarItem-commandText ms-font-m ms-font-weight-regular', styles.itemCommandText) } aria-hidden='true' role='presentation'>{ item.name }</span>
+            <span className={ css(
+              'ms-CommandBarItem-commandText', styles.itemCommandText) } aria-hidden='true' role='presentation'>{ item.name }</span>
           </div>;
         }
       })() }
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
index 487120b46c403..513d7e76737e2 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
+import { CommandButton } from 'office-ui-fabric-react/lib/Button';
 import { CommandBar } from 'office-ui-fabric-react/lib/CommandBar';
 import { css, autobind, } from 'office-ui-fabric-react/lib/Utilities';
 import styles = require('./CommandBar.Example.scss');
-import { ContextualMenu, IContextualMenuItem, DirectionalHint } from '../../ContextualMenu';
+import { IContextualMenuItem } from '../../ContextualMenu';
 
 export interface ISplitDropDownButtonState {
   isContextMenuShown: boolean;
@@ -56,24 +56,6 @@ export class CommandBarCustomizationExample extends React.Component<any, ISplitD
   @autobind
   private _renderSplitButtonMenuItem(item: IContextualMenuItem) {
     let darkerBG = this.state.isContextMenuShown && styles.darkerBG;
-    let leftIconClassNames = css(
-      styles.icon,
-      styles.themeDarkAltColor,
-      'ms-Icon ms-Icon--Add',
-      darkerBG);
-    let dropDownIconClassNames = css(
-      styles.icon,
-      'ms-Icon ms-Icon--ChevronDown',
-      darkerBG);
-    let leftTextClassNames = css(
-      styles.leftText,
-      'ms-CommandBarItem-commandText',
-      darkerBG);
-
-    let containerClasName = css(
-      styles.customButtonContainer,
-      darkerBG
-    );
 
     let dropDownButtonClass = css(
       styles.button,
@@ -87,34 +69,23 @@ export class CommandBarCustomizationExample extends React.Component<any, ISplitD
 
     return (
       <div>
-        <div className={ containerClasName } ref={ ref => this.container = ref }>
-          <DefaultButton
-            key='mainButton'
+        <div className={ css(
+          styles.customButtonContainer,
+          darkerBG
+        ) } ref={ ref => this.container = ref }>
+          <CommandButton
             className={ mainBtnClassName }
-            data-is-focusable={ true }>
-            <span className={ leftIconClassNames } />
-            <span className={ leftTextClassNames }>{ 'New' }</span>
-          </DefaultButton>
+            iconProps={ { iconName: 'add' } }
+            text='New' />
           <span className={ styles.splitter }>|</span>
-          <DefaultButton
-            key='dropDownButton'
+          <CommandButton
             onClick={ this.onClickChevron }
-            className={ dropDownButtonClass }>
-            <span
-              className={ dropDownIconClassNames }
-              data-is-focusable={ true } />
-          </DefaultButton>
+            className={ dropDownButtonClass }
+            menuProps={ {
+              className: css('ms-CommandBar-menuHost'),
+              items: item.subMenuProps.items
+            } } />
         </div>
-        {
-          this.state && this.state.isContextMenuShown &&
-          <ContextualMenu
-            isBeakVisible={ true }
-            className={ css('ms-CommandBar-menuHost') }
-            items={ item.subMenuProps.items }
-            target={ this.container }
-            directionalHint={ DirectionalHint.bottomAutoEdge }
-            onDismiss={ this.toggleDropDownMenuShown } />
-        }
       </div >
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index db7522f9dfc40..e926fb91054ba 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -398,8 +398,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     // Only present to allow continued use of item.icon which is deprecated.
 
     let iconProps: IIconProps = item.iconProps ? item.iconProps : {
-      iconName: 'CustomIcon',
-      className: item.icon ? 'ms-Icon--' + item.icon : ''
+      iconName: item.icon
     };
     // Use the default icon color for the known icon names
     let iconColorClassName = iconProps.iconName === 'None' ? '' : ('ms-ContextualMenu-iconColor ' + styles.iconColor);
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
index 8e80cc79e83f1..908b5822f75eb 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
@@ -240,7 +240,7 @@ export class ContextualMenuCustomizationExample extends React.Component<any, ICo
                 <span
                   className='ms-ContextualMenu-icon ms-ContextualMenu-customizationExample-categorySwatch'
                   style={ { backgroundColor: category.color } } />
-                <span className='ms-ContextualMenu-itemText ms-font-m ms-font-weight-regular'>
+                <span className='ms-ContextualMenu-itemText'>
                   { category.name }
                 </span>
               </div>
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index d020decf3fb94..05e0ea5bf1aa1 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -196,11 +196,13 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
             label={ label }
             placeholder={ placeholder }
             borderless={ borderless }
-            iconClass={ css(
-              'ms-Icon ms-Icon--Calendar',
-              label ? 'ms-DatePicker-event--with-label' : 'ms-DatePicker-event--without-label',
-              label ? styles.eventWithLabel : styles.eventWithoutLabel
-            ) }
+            iconProps={ {
+              iconName: 'calendar',
+              className: css(
+                label ? 'ms-DatePicker-event--with-label' : 'ms-DatePicker-event--without-label',
+                label ? styles.eventWithLabel : styles.eventWithoutLabel
+              )
+            } }
             readOnly={ !allowTextInput }
             value={ formattedDate }
             ref='textField' />
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
index 8dc4ae5d20444..432a354a9ab1b 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
@@ -25,12 +25,13 @@ $resizerColor: $ms-color-neutralTertiaryAlt;
   }
 }
 
-.cell.cellIsCheck :global(.ms-Check-background) {
+.cell.cellIsCheck :global(.ms-Check-circle) {
   opacity: 0;
 }
 
-.cell.cellIsCheck:hover :global(.ms-Check-background),
-.root.rootIsAllSelected :global(.ms-Check-background) {
+.cell.cellIsCheck:hover :global(.ms-Check-circle),
+.cell.cellIsCheck:focus :global(.ms-Check-circle),
+.root.rootIsAllSelected :global(.ms-Check-circle) {
   opacity: 1;
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index a8ad69859e9f3..1be478ba618ba 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -22,6 +22,7 @@ import {
 import { IViewport } from '../../utilities/decorators/withViewport';
 import * as stylesImport from './DetailsRow.scss';
 const styles: any = stylesImport;
+import { AnimationClassNames } from '../../Styling';
 
 export interface IDetailsRowProps extends React.Props<DetailsRow> {
   item: any;
@@ -184,15 +185,20 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
 
     return (
       <div
-        {...getNativeProps(this.props, divProperties)}
+        {...getNativeProps(this.props, divProperties) }
         ref='root'
         role='row'
         aria-label={ ariaLabel }
-        className={ css('ms-DetailsRow ms-fadeIn400', styles.root, droppingClassName, {
-          ['is-contentUnselectable ' + styles.rootIsContentUnselectable]: isContentUnselectable,
-          ['is-selected ' + styles.rootIsSelected]: isSelected,
-          ['is-check-visible ' + styles.rootIsCheckVisible]: checkboxVisibility === CheckboxVisibility.always
-        }) }
+        className={ css(
+          'ms-DetailsRow',
+          AnimationClassNames.fadeIn400,
+          styles.root,
+          droppingClassName,
+          {
+            ['is-contentUnselectable ' + styles.rootIsContentUnselectable]: isContentUnselectable,
+            ['is-selected ' + styles.rootIsSelected]: isSelected,
+            ['is-check-visible ' + styles.rootIsCheckVisible]: checkboxVisibility === CheckboxVisibility.always
+          }) }
         data-is-focusable={ true }
         data-selection-index={ itemIndex }
         data-item-index={ itemIndex }
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActions.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActions.tsx
index 0526b35239bb4..5c62da9e55416 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActions.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActions.tsx
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { BaseComponent, css } from '../../Utilities';
 import { IDocumentCardActionsProps } from './DocumentCard.Props';
+import { Icon } from '../../Icon';
 import { IconButton } from '../../Button';
 import * as stylesImport from './DocumentCard.scss';
 const styles: any = stylesImport;
@@ -22,7 +23,7 @@ export class DocumentCardActions extends BaseComponent<IDocumentCardActionsProps
 
         { views > 0 && (
           <div className={ css('ms-DocumentCardActions-views', styles.views) }>
-            <i className='ms-Icon ms-Icon--View' />
+            <Icon iconName='view' />
             { views }
           </div>
         ) }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index cb62b269b33ff..9f7f8a52a32fc 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -5,6 +5,7 @@ import { Callout } from '../../Callout';
 import { Label } from '../../Label';
 import { CommandButton } from '../../Button';
 import { Panel } from '../../Panel';
+import { Icon } from '../../Icon';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { withResponsiveMode, ResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
 import { IWithResponsiveModeState } from '../../utilities/decorators/withResponsiveMode';
@@ -155,7 +156,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
                 this._onRenderPlaceHolder(this.props)
             }
           </span>
-          <i className={ css('ms-Dropdown-caretDown ms-Icon ms-Icon--ChevronDown', styles.caretDown) } role='presentation' aria-hidden='true'></i>
+          <Icon className={ css('ms-Dropdown-caretDown', styles.caretDown) } iconName='chevronDown' />
         </div>
         { isOpen && (
           onRenderContainer(this.props, this._onRenderContainer)
diff --git a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.styles.ts b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.styles.ts
new file mode 100644
index 0000000000000..555bb0c05c1e4
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.styles.ts
@@ -0,0 +1,30 @@
+
+import {
+  memoizeFunction,
+} from '../../Utilities';
+import {
+  ITheme,
+  IStyle,
+  getTheme
+} from '../../Styling';
+
+const inheritFont = { fontFamily: 'inherit' };
+
+export interface IFabricStyles {
+  root: IStyle;
+}
+
+export const getStyles = memoizeFunction((
+  theme: ITheme = getTheme()
+): IFabricStyles => {
+  return {
+    root: [
+      theme.fonts.medium,
+      {
+        color: theme.palette.neutralPrimary,
+        '& button': inheritFont,
+        '& input': inheritFont
+      }
+    ]
+  };
+});
diff --git a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
index da54043ad17e9..0a0b2b398b8e3 100644
--- a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
+++ b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
@@ -1,9 +1,12 @@
 import * as React from 'react';
 import {
   BaseComponent,
-  KeyCodes,
-  css
+  KeyCodes
 } from '../../Utilities';
+import {
+  mergeStyles
+} from '../../Styling';
+import { getStyles } from './Fabric.styles';
 
 const DIRECTIONAL_KEY_CODES = [
   KeyCodes.up,
@@ -51,9 +54,14 @@ export class Fabric extends BaseComponent<React.HTMLProps<HTMLDivElement>, IFabr
 
   public render() {
     const { isFocusVisible } = this.state;
-    const rootClass = css('ms-Fabric', this.props.className, {
-      'is-focusVisible': isFocusVisible
-    });
+    const styles = getStyles();
+
+    const rootClass = mergeStyles(
+      'ms-Fabric',
+      styles.root,
+      this.props.className,
+      isFocusVisible && 'is-focusVisible'
+    ) as string;
 
     return (
       <div { ...this.props } className={ rootClass } ref='root' />
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
index 34d7759baefe9..e0e1712c6cd98 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
@@ -47,7 +47,7 @@ describe('Facepile', () => {
         />);
       let facepile = ReactDOM.findDOMNode(wrapper as React.ReactInstance);
 
-      let addButton = facepile.querySelectorAll('.ms-Icon--AddFriend');
+      let addButton = facepile.querySelectorAll('.ms-Facepile-addButton');
       expect(addButton).to.have.length(1, 'Add button should render');
       let buttons = facepile.querySelectorAll('.ms-Facepile-itemButton');
       expect(buttons).to.have.length(1, 'Only one button should be rendered');
@@ -61,7 +61,7 @@ describe('Facepile', () => {
           overflowButtonType={ OverflowButtonType.downArrow }
         />);
       let facepile = ReactDOM.findDOMNode(wrapper as React.ReactInstance);
-      let overflowButton = facepile.querySelectorAll('.ms-Icon--ChevronDown');
+      let overflowButton = facepile.querySelectorAll('.ms-Facepile-overflowButton');
       expect(overflowButton).to.have.length(1, 'Overflow button should render');
       let buttons = facepile.querySelectorAll('.ms-Facepile-itemButton');
       expect(buttons).to.have.length(1, 'Only one button should be rendered');
@@ -75,7 +75,7 @@ describe('Facepile', () => {
           overflowButtonType={ OverflowButtonType.more }
         />);
       let facepile = ReactDOM.findDOMNode(wrapper as React.ReactInstance);
-      let overflowButton = facepile.querySelectorAll('.ms-Icon--More');
+      let overflowButton = facepile.querySelectorAll('.ms-Facepile-overflowButton');
       expect(overflowButton).to.have.length(1, 'Overflow button should render');
       let buttons = facepile.querySelectorAll('.ms-Facepile-itemButton');
       expect(buttons).to.have.length(1, 'Only one button should be rendered');
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
index f3566bf08a116..138435550aa55 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
@@ -19,6 +19,9 @@ import {
 import {
   BaseButton
 } from '../../Button';
+import {
+  Icon
+} from '../../Icon';
 import {
   Persona,
   PersonaSize
@@ -192,7 +195,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
         size={ personaSize }
         hidePersonaDetails={ true }
         onRenderInitials={ () => (
-          <i className={ css('ms-Icon', 'msIcon', `ms-Icon ms-Icon--${icon}`) } aria-hidden='true' />
+          <Icon iconName={ icon } />
         ) }
       />
     </BaseButton>;
@@ -208,7 +211,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
         size={ personaSize }
         hidePersonaDetails={ true }
         onRenderInitials={ () => (
-          <i className='ms-Icon msIcon ms-Icon--AddFriend' aria-hidden='true' />
+          <Icon iconName='addFriend' />
         ) }
       />
     </BaseButton>;
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx b/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx
index 023f068342428..960e6239b1415 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx
@@ -8,6 +8,7 @@ import {
 import { FacepileAddFaceExample } from './examples/Facepile.AddFace.Example';
 import { FacepileBasicExample } from './examples/Facepile.Basic.Example';
 import { FacepileOverflowExample } from './examples/Facepile.Overflow.Example';
+import { FontClassNames } from '../../Styling';
 
 const FacepileAddFaceExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Facepile/examples/Facepile.AddFace.Example.tsx') as string;
 const FacepileBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx') as string;
@@ -45,28 +46,28 @@ export class FacepilePage extends React.Component<IComponentDemoPageProps, {}> {
               The Facepile shows a list of faces or initials in a horizontal lockup. Each circle represents a person. Many times this component is used when sharing who has access to a specific view or file or when assigning a user to a task within a workflow.
             </p>
 
-            <h2 className='ms-font-xl'>Adding people</h2>
+            <h2 className={ FontClassNames.xLarge }>Adding people</h2>
             <p>
               The component can include an add button which can be used for quickly adding a person to the list.
             </p>
 
-            <h2 className='ms-font-xl'>Empty state</h2>
+            <h2 className={ FontClassNames.xLarge }>Empty state</h2>
             <p>
               The empty state of the Facepile should include only an add button. Another variant is to use an input field with placeholder text instructing the user to add a person. See the PeoplePicker component for the menu used to add people to the Facepile list.
             </p>
 
-            <h2 className='ms-font-xl'>One person</h2>
+            <h2 className={ FontClassNames.xLarge }>One person</h2>
             <p>
               When there is only one person in the Facepile, consider using their name next to the face or initials.
             </p>
 
-            <h2 className='ms-font-xl'>Expanding the list when there is no overflow</h2>
+            <h2 className={ FontClassNames.xLarge }>Expanding the list when there is no overflow</h2>
 
             <p>
               When there is a need to show the Facepile expanded into a vertical list, include a downward chevron button. Clicking or tapping on the chevron would open a standard list view of personas.
             </p>
 
-            <h2 className='ms-font-xl'>Overflow</h2>
+            <h2 className={ FontClassNames.xLarge }>Overflow</h2>
 
             <p>
               When the Facepile exceeds a max number of 5 people, show a button at the end of the list indicating how many are not being shown. Clicking or tapping on the overflow would open a standard list view of personas.
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss
index b5c5c5bc00c46..031be8dada884 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss
@@ -51,6 +51,7 @@ $groupHeader-ease-in-back: cubic-bezier(0.600, -0.280, 0.735, 0.045);
 }
 
 .title {
+  @include ms-font-xl;
   padding: 14px 6px;
   display: inline-block;
   cursor: pointer;
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
index b41d169a4943c..334c44bd1a741 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
@@ -101,7 +101,7 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
             />
           </button>
 
-          <div className={ css('ms-GroupHeader-title ms-font-xl', styles.title) }>
+          <div className={ css('ms-GroupHeader-title', styles.title) }>
             <span>{ group.name }</span>
             {
               // hasMoreData flag is set when grouping is throttle by SPO server which in turn resorts to regular
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx
index 169be263addd8..802a194cbe231 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx
@@ -4,8 +4,10 @@ import {
   IGroup,
   IGroupDividerProps
 } from 'office-ui-fabric-react/lib/components/GroupedList/index';
+import { css } from 'office-ui-fabric-react/lib/Utilities';
 import { Link } from 'office-ui-fabric-react/lib/Link';
 import { createListItems, createGroups } from '@uifabric/example-app-base';
+import { FontClassNames } from '../../../Styling';
 import './GroupedList.Custom.Example.scss';
 
 let _items: any[];
@@ -49,16 +51,16 @@ export class GroupedListCustomExample extends React.Component<any, any> {
 
   private _onRenderHeader(props: IGroupDividerProps): JSX.Element {
     return (
-      <div className='ms-GroupedListExample-header ms-font-xl'>
+      <div className={ css('ms-GroupedListExample-header', FontClassNames.xLarge) }>
         This is a custom header for { props.group.name }
-        (<Link onClick={ () => props.onToggleCollapse(props.group) }>{ props.group.isCollapsed ? 'Expand' : 'Collapse' }</Link>)
+        &nbsp;(<Link onClick={ () => props.onToggleCollapse(props.group) }>{ props.group.isCollapsed ? 'Expand' : 'Collapse' }</Link>)
       </div>
     );
   }
 
   private _onRenderFooter(props: IGroupDividerProps): JSX.Element {
     return (
-      <div className='ms-GroupedListExample-footer ms-font-xl'>
+      <div className={ css('ms-GroupedListExample-footer', FontClassNames.xLarge) }>
         This is a custom footer for { props.group.name }
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts b/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
index 3cf46a3012215..3a5be57cc9844 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { IconName } from './IconName';
 import { IImageProps } from '../Image/Image.Props';
+import { IStyle } from '../../Styling';
 
 // Please keep alphabetized
 export enum IconType {
@@ -28,6 +29,11 @@ export enum IconType {
   Image = 100001
 }
 
+export interface IIconStyles {
+  root?: IStyle;
+  imageContainer?: IStyle;
+}
+
 export interface IIconProps extends React.HTMLProps<HTMLElement> {
   /**
    * The name of the icon to use from the icon font.
@@ -37,6 +43,16 @@ export interface IIconProps extends React.HTMLProps<HTMLElement> {
    */
   iconName?: IconName | string | null;
 
+  /**
+   * Optional styling for the elements within the Icon.
+   */
+  styles?: IIconStyles;
+
+  /**
+   * The aria label of the button for the benefit of screen readers.
+   */
+  ariaLabel?: string;
+
   /**
    * The type of icon to render (image or icon font).
    *
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.scss b/packages/office-ui-fabric-react/src/components/Icon/Icon.scss
deleted file mode 100644
index 9de6896681642..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.scss
+++ /dev/null
@@ -1,3 +0,0 @@
-.imageContainer {
-  overflow: hidden;
-}
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.styles.ts b/packages/office-ui-fabric-react/src/components/Icon/Icon.styles.ts
new file mode 100644
index 0000000000000..f6596c5c48f4a
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.styles.ts
@@ -0,0 +1,28 @@
+import {
+  mergeStyles,
+  mergeStyleSets,
+  ITheme,
+  getTheme
+} from '../../Styling';
+import {
+  memoizeFunction
+} from '../../Utilities';
+import { IIconStyles } from './Icon.Props';
+
+export const getStyles = memoizeFunction((
+  theme: ITheme = getTheme(),
+  customStyles: IIconStyles = undefined
+): IIconStyles => {
+  let iconStyles = {
+
+    root: mergeStyles({
+      display: 'inline-block'
+    }),
+
+    imageContainer: mergeStyles({
+      overflow: 'hidden'
+    })
+  };
+
+  return mergeStyleSets(iconStyles, customStyles);
+});
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
index 1862e376324d0..4dfbe005cc04e 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
@@ -1,7 +1,7 @@
 /* tslint:disable */
 import * as React from 'react';
-import styles = require('./Icon.scss')
 /* tslint:enable */
+
 import { IIconProps, IconType } from './Icon.Props';
 import { Image } from '../Image/Image';
 import {
@@ -9,22 +9,56 @@ import {
   getNativeProps,
   htmlElementProperties
 } from '../../Utilities';
+import { IconClassNames } from '../../Styling';
+import { getStyles } from './Icon.styles';
 
-export const Icon: (props: IIconProps) => JSX.Element = (props: IIconProps) => {
-  let customIcon = props.iconName === 'None';
-  let iconClassName = props.iconName ? ('ms-Icon--' + props.iconName) : '';
+export function Icon(props: IIconProps): JSX.Element {
+  let {
+    ariaLabel,
+    className,
+    styles: customStyles,
+    iconName
+   } = props;
+  let styles = getStyles(undefined, customStyles);
 
   if (props.iconType === IconType.image || props.iconType === IconType.Image) {
-    let containerClassName = css('ms-Icon', 'ms-Icon-imageContainer', styles.imageContainer, props.className);
+    let containerClassName = css(
+      'ms-Icon',
+      'ms-Icon-imageContainer',
+      styles.root,
+      styles.imageContainer,
+      className
+    );
 
     return (
-      <div className={ containerClassName } >
-        <Image { ...props.imageProps as any } />
+      <div className={
+        css(
+          containerClassName,
+          styles.root
+        ) }
+      >
+        l  <Image { ...props.imageProps as any } />
       </div>
     );
   } else {
-    let className = css('ms-Icon', customIcon ? '' : iconClassName, props.className);
+    let iconMemberName = iconName ? iconName.charAt(0).toLowerCase() + iconName.substr(1) : '';
 
-    return <i { ...getNativeProps(props, htmlElementProperties) } className={ className } />;
+    return (
+      <i
+        aria-label={ ariaLabel }
+        { ...(ariaLabel ? {} : {
+          role: 'presentation',
+          'aria-hidden': true
+        }) }
+        { ...getNativeProps(props, htmlElementProperties) }
+        className={
+          css(
+            'ms-Icon',
+            IconClassNames[iconMemberName],
+            styles.root,
+            props.className
+          ) }
+      />
+    );
   }
-};
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Icon/examples/Icon.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Icon/examples/Icon.Basic.Example.tsx
index 48239756b8957..f05b207a3ab45 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/examples/Icon.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/examples/Icon.Basic.Example.tsx
@@ -8,9 +8,9 @@ export class IconBasicExample extends React.Component<any, any> {
   public render() {
     return (
       <div>
-        <Icon iconName={ 'CompassNW' } className={ 'ms-IconExample' } />
-        <Icon iconName={ 'Dictionary' } className={ 'ms-IconExample' } />
-        <Icon iconName={ 'TrainSolid' } className={ 'ms-IconExample' } />
+        <Icon iconName='CompassNW' className='ms-IconExample' />
+        <Icon iconName='Dictionary' className='ms-IconExample' />
+        <Icon iconName='TrainSolid' className='ms-IconExample' />
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.tsx
index e30a3ee81f31a..6cdf3ff068700 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.tsx
@@ -9,7 +9,7 @@ import {
   imageProperties
 } from '../../Utilities';
 import { IImageProps, ImageFit, ImageLoadState } from './Image.Props';
-
+import { AnimationClassNames } from '../../Styling';
 import * as stylesImport from './Image.scss';
 const styles: any = stylesImport;
 
@@ -107,15 +107,16 @@ export class Image extends BaseComponent<IImageProps, IImageState> {
               'ms-Image-image',
               styles.image,
               CoverStyleMap[coverStyle],
-              (imageFit !== undefined) && ImageFitMap[imageFit], {
-                'is-fadeIn': shouldFadeIn,
-                'is-notLoaded': !loaded,
-                ['is-loaded ' + styles.imageIsLoaded]: loaded,
-                'ms-fadeIn400': loaded && shouldFadeIn,
-                'is-error': loadState === ImageLoadState.error,
+              (imageFit !== undefined) && ImageFitMap[imageFit],
+              !loaded && 'is-notLoaded',
+              loaded && 'is-loaded ' + styles.imageIsLoaded,
+              shouldFadeIn && 'is-fadeIn',
+              loadState === ImageLoadState.error && 'is-error',
+              loaded && shouldFadeIn && AnimationClassNames.fadeIn400,
+              {
                 ['ms-Image-image--scaleWidth ' + styles.imageIsScaleWidth]: (imageFit === undefined && !!width && !height),
                 ['ms-Image-image--scaleHeight ' + styles.imageIsScaleHeight]: (imageFit === undefined && !width && !!height),
-                ['ms-Image-image--scaleWidthHeight ' + styles.imageIsScaleWidthHeight]: (imageFit === undefined && !!width && !!height),
+                ['ms-Image-image--scaleWidthHeight ' + styles.imageIsScaleWidthHeight]: (imageFit === undefined && !!width && !!height)
               }) }
           ref={ this._resolveRef('_imageElement') }
           src={ src }
diff --git a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
index f03e579fced5d..b92da5b4a5840 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
@@ -4,6 +4,7 @@ import './Layer.Example.scss';
 import { BaseComponent } from 'office-ui-fabric-react/lib/Utilities';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { Layer } from 'office-ui-fabric-react/lib/Layer';
+import { AnimationClassNames } from '../../../Styling';
 
 export class LayerContentExample extends BaseComponent<any, any> {
   public static contextTypes = {
@@ -27,7 +28,7 @@ export class LayerContentExample extends BaseComponent<any, any> {
 
   public render() {
     return (
-      <div className='LayerExample-content ms-scaleUpIn100'>
+      <div className={ 'LayerExample-content ' + AnimationClassNames.scaleUpIn100 }>
         <div className='LayerExample-textContent'>{ this.context.message }</div>
         <div>{ this.state.time }</div>
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
index 4f91460d67023..836fb4de2bc1a 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
@@ -3,6 +3,7 @@ import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { Layer, LayerHost } from 'office-ui-fabric-react/lib/Layer';
 import { Toggle } from 'office-ui-fabric-react/lib/Toggle';
 import './Layer.Example.scss';
+import { AnimationClassNames } from '../../../Styling';
 
 export class LayerHostedExample extends React.Component<any, any> {
   constructor() {
@@ -14,9 +15,9 @@ export class LayerHostedExample extends React.Component<any, any> {
   }
 
   public render() {
-    let { showLayer, showHost} = this.state;
+    let { showLayer, showHost } = this.state;
     let content = (
-      <div className='LayerExample-content ms-scaleUpIn100'>
+      <div className={ 'LayerExample-content ' + AnimationClassNames.scaleUpIn100 } >
         This is example layer content.
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/List/ListPage.tsx b/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
index 0ddd90c2912fd..6bf72d363dfe1 100644
--- a/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
@@ -6,13 +6,11 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { ListBasicExample } from './examples/List.Basic.Example';
-import { ListMailExample } from './examples/List.Mail.Example';
 import { ListGridExample } from './examples/List.Grid.Example';
 import { ListScrollingExample } from './examples/List.Scrolling.Example';
 import { createListItems } from '@uifabric/example-app-base';
 
 const ListBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx') as string;
-const ListMailExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/List/examples/List.Mail.Example.tsx') as string;
 const ListGridExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx') as string;
 const ListScrollingExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx') as string;
 
@@ -38,9 +36,6 @@ export class ListPage extends React.Component<IComponentDemoPageProps, {}> {
             <ExampleCard title='List of 5000 variable height items' isOptIn={ true } code={ ListBasicExampleCode }>
               <ListBasicExample items={ _cachedItems } />
             </ExampleCard>
-            <ExampleCard title='Fixed list of 5000 email tiles' isOptIn={ true } code={ ListMailExampleCode }>
-              <ListMailExample items={ _cachedItems } />
-            </ExampleCard>
             <ExampleCard title='Scrolling items into view' isOptIn={ true } code={ ListScrollingExampleCode }>
               <ListScrollingExample items={ _cachedItems } />
             </ExampleCard>
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.scss b/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.scss
index 2ca467518f45c..4fc7083ed1e94 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.scss
@@ -26,6 +26,7 @@
   }
 
   .ms-ListBasicExample-itemName {
+    @include ms-font-xl;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx
index 048048620ad3c..0314f7d60dbb1 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx
@@ -6,6 +6,7 @@ import {
 import { FocusZone, FocusZoneDirection } from 'office-ui-fabric-react/lib/FocusZone';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
 import { Image, ImageFit } from 'office-ui-fabric-react/lib/Image';
+import { Icon } from 'office-ui-fabric-react/lib/Icon';
 import { List } from 'office-ui-fabric-react/lib/List';
 import './List.Basic.Example.scss';
 
@@ -50,14 +51,14 @@ export class ListBasicExample extends React.Component<IListBasicExampleProps, an
                 imageFit={ ImageFit.cover }
               />
               <div className='ms-ListBasicExample-itemContent'>
-                <div className='ms-ListBasicExample-itemName ms-font-xl'>{ item.name }</div>
+                <div className='ms-ListBasicExample-itemName'>{ item.name }</div>
                 <div className='ms-ListBasicExample-itemIndex'>{ `Item ${index}` }</div>
-                <div className='ms-ListBasicExample-itemDesc ms-font-s'>{ item.description }</div>
+                <div className='ms-ListBasicExample-itemDesc'>{ item.description }</div>
               </div>
-              <i className={ css('ms-ListBasicExample-chevron ms-Icon', {
-                'ms-Icon--chevronRight': !getRTL(),
-                'ms-Icon--chevronLeft': getRTL()
-              }) } />
+              <Icon
+                className='ms-ListBasicExample-chevron'
+                iconName={ getRTL() ? 'chevronLeft' : 'chevronRight' }
+              />
             </div>
           ) }
         />
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Mail.Example.scss b/packages/office-ui-fabric-react/src/components/List/examples/List.Mail.Example.scss
deleted file mode 100644
index ddbcd8597be12..0000000000000
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Mail.Example.scss
+++ /dev/null
@@ -1,236 +0,0 @@
-@import '../../../common/common';
-
-// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
-
-//
-// Office UI Fabric
-// --------------------------------------------------
-// List item styles
-
-:global {
-  .ms-ListItem {
-    @include ms-font-m;
-    @include ms-normalize;
-    @include ms-clearfix;
-    padding: 9px 28px 3px;
-    position: relative;
-    display: block;
-  }
-
-  .ms-ListItem-primaryText,
-  .ms-ListItem-secondaryText,
-  .ms-ListItem-tertiaryText {
-    @include ms-no-wrap;
-    display: block;
-  }
-
-  .ms-ListItem-primaryText {
-    @include ms-font-xl;
-    padding-right: 80px; // Prevent overlap with up to three actions.
-    position: relative;
-    top: -4px;
-  }
-
-  .ms-ListItem-secondaryText {
-    @include ms-font-m;
-    line-height: 25px;
-    position: relative;
-    top: -7px;
-    padding-right: 30px;
-  }
-
-  .ms-ListItem-tertiaryText {
-    @include ms-font-m;
-    position: relative;
-    top: -9px;
-    margin-bottom: -4px;
-    padding-right: 30px;
-  }
-
-  .ms-ListItem-metaText {
-    @include ms-font-xs;
-    position: absolute;
-    right: 30px;
-    top: 39px;
-  }
-
-  .ms-ListItem-image {
-    float: left;
-    height: 70px;
-    margin-left: -8px; // Images sit closer to the edge than text.
-    margin-right: 10px;
-    width: 70px;
-  }
-
-  .ms-ListItem-selectionTarget {
-    display: none;
-  }
-
-  .ms-ListItem-actions {
-    max-width: 80px; // Up to three actions.
-    position: absolute;
-    right: 30px;
-    text-align: right;
-    top: 10px;
-  }
-
-  .ms-ListItem-action {
-    color: $ms-color-neutralTertiary;
-    display: inline-block;
-    font-size: 15px;
-    position: relative;
-    text-align: center;
-    top: 3px;
-    cursor: pointer;
-    height: 16px;
-    width: 16px;
-
-    .ms-Icon {
-      vertical-align: top;
-    }
-
-    &:hover {
-      color: $ms-color-neutralSecondary;
-      outline: 1px solid transparent;
-    }
-  }
-
-
-  //== State: Unread list item
-  //
-  .ms-ListItem.is-unread {
-    border-left: 3px solid $ms-color-themePrimary;
-    padding-left: 27px; // Reduce padding to allow room for border.
-
-    .ms-ListItem-secondaryText, .ms-ListItem-metaText {
-      color: $ms-color-themePrimary;
-      @include ms-fontWeight-semibold;
-    }
-  }
-
-
-  //== State: Unseen list item
-  //
-  .ms-ListItem.is-unseen {
-    &:after {
-      border-right: 10px solid transparent;
-      border-top: 10px solid $ms-color-themePrimary;
-      left: 0;
-      position: absolute;
-      top: 0;
-    }
-  }
-
-
-  //== State: Selectable list item
-  //
-  .ms-ListItem.is-selectable {
-    .ms-ListItem-selectionTarget {
-      display: block;
-      height: 20px;
-      left: 6px;
-      position: absolute;
-      top: 13px;
-      width: 20px;
-    }
-
-    .ms-ListItem-image {
-      margin-left: 0;
-    }
-
-    &:hover {
-      background-color: $ms-color-neutralLight;
-      cursor: pointer;
-      outline: 1px solid transparent;
-
-      // Insert the empty box.
-      &:before {
-        @include ms-Icon;
-        position: absolute;
-        top: 12px;
-        left: 6px;
-        height: 15px;
-        width: 15px;
-        border: 1px solid $ms-color-neutralSecondaryAlt;
-      }
-    }
-  }
-
-
-  //== State: Selected list item
-  //
-  .ms-ListItem.is-selected {
-    // Insert the checkmark.
-    &:before {
-      border: 1px solid transparent;
-    }
-
-    &:before,
-    &:hover:before {
-      @include ms-Icon;
-      content: '\e041';
-      font-size: $ms-font-size-m-plus;
-      color: $ms-color-neutralSecondaryAlt;
-      position: absolute;
-      top: 12px;
-      left: 6px;
-    }
-
-    &:hover {
-      background-color: $ms-color-themeLight;
-      outline: 1px solid transparent;
-    }
-  }
-
-
-  //== Modifier: Document list item
-  //
-  .ms-ListItem.ms-ListItem--document {
-    padding: 0;
-
-    // The icon for a file or folder in the items list. This may
-    // be an .ms-Icon or a specific modifier that loads an image.
-    .ms-ListItem-itemIcon {
-      width: 70px;
-      height: 70px;
-      float: left;
-      text-align: center;
-    }
-
-    // If the item icon is an .ms-Icon, position and color it appropriately.
-    .ms-ListItem-itemIcon .ms-Icon {
-      font-size: 38px;
-      line-height: 70px;
-      color: $ms-color-neutralSecondary;
-    }
-
-    // Primary text, typically the name.
-    .ms-ListItem-primaryText {
-      @include ms-no-wrap;
-      font-size: $ms-font-size-m;
-      padding-top: 15px;
-      padding-right: 0;
-      position: static;
-    }
-
-    // Secondary text, typically the modified date or some other metadata.
-    .ms-ListItem-secondaryText {
-      @include ms-no-wrap;
-      @include ms-font-xs;
-      padding-top: 6px;
-    }
-  }
-
-  .MailList {
-    overflow-y: auto;
-    -webkit-overflow-scrolling: touch;
-
-    max-height: 500px;
-  }
-
-  .MailTile {
-    margin-bottom: 5px;
-    padding: 10px;
-    background: red;
-  }
-}
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Mail.Example.tsx b/packages/office-ui-fabric-react/src/components/List/examples/List.Mail.Example.tsx
deleted file mode 100644
index b1b0e844db4ca..0000000000000
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Mail.Example.tsx
+++ /dev/null
@@ -1,46 +0,0 @@
-import * as React from 'react';
-import { List } from 'office-ui-fabric-react/lib/List';
-import './List.Mail.Example.scss';
-
-export class MailTile extends React.Component<any, any> {
-  public render() {
-    let { item } = this.props;
-    return (
-      <div className='ms-ListItem is-unread is-selectable'>
-        <span className='ms-ListItem-primaryText'>{ item.name }</span>
-        <span className='ms-ListItem-secondaryText'>{ item.title }</span>
-        <span className='ms-ListItem-tertiaryText'>{ item.description }</span>
-        <span className='ms-ListItem-metaText'>2:42p</span>
-        <div className='ms-ListItem-selectionTarget js-toggleSelection'></div>
-        <div className='ms-ListItem-actions'>
-          <div className='ms-ListItem-action'></div>
-          <div className='ms-ListItem-action'></div>
-          <div className='ms-ListItem-action'></div>
-          <div className='ms-ListItem-action'></div>
-        </div>
-      </div>
-    );
-  }
-}
-
-export interface IListMailExampleProps {
-  items: any[];
-}
-
-export class ListMailExample extends React.Component<IListMailExampleProps, any> {
-  public render() {
-    return (
-      <div>
-        <h1 className='ms-font-xxl'>Inbox</h1>
-        <div className='MailList' data-is-scrollable={ true }>
-          <List
-            items={ this.props.items }
-            onRenderCell={ (item, index) => (
-              <MailTile item={ item } />
-            ) }
-          />
-        </div>
-      </div>
-    );
-  }
-}
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
index 15b8b242153d1..123ca3f4da4c4 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
@@ -6,6 +6,7 @@ import {
   getId
 } from '../../Utilities';
 import { IconButton } from '../../Button';
+import { Icon } from '../../Icon';
 import { IMessageBarProps, MessageBarType } from './MessageBar.Props';
 import * as stylesImport from './MessageBar.scss';
 const styles: any = stylesImport;
@@ -89,7 +90,7 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
   private _getIconSpan(): JSX.Element {
     return (
       <div className={ css('ms-MessageBar-icon', styles.icon) }>
-        <i className={ `ms-Icon ms-Icon--${this.ICON_MAP[this.props.messageBarType]}` }></i>
+        <Icon iconName={ this.ICON_MAP[this.props.messageBarType] } />
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.scss b/packages/office-ui-fabric-react/src/components/Nav/Nav.scss
index c4b2b3ed8facc..8d8789ce4f430 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.scss
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.scss
@@ -114,8 +114,8 @@ $linkRightPadding: 20px;
     padding: 0;
     margin: 0;
 
-  .chevronIcon {
-      position: relative;
+    .chevronIcon {
+      top: 0;
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
index d469d5b689165..97a3663c40215 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
@@ -6,9 +6,10 @@ import {
 } from '../../Utilities';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { CommandButton } from '../../Button';
+import { Icon } from '../../Icon';
 import * as stylesImport from './Nav.scss';
 const styles: any = stylesImport;
-
+import { AnimationClassNames } from '../../Styling';
 import {
   INav,
   INavProps,
@@ -73,10 +74,12 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
     return (
       <FocusZone direction={ FocusZoneDirection.vertical }>
         <nav role='navigation'
-          className={ css('ms-Nav', styles.root, className, {
-            'is-onTop ms-slideRightIn40': isOnTop,
-            [styles.rootIsOnTop]: isOnTop
-          }) }>
+          className={ css(
+            'ms-Nav',
+            styles.root,
+            className,
+            isOnTop && css('is-onTop', styles.rootIsOnTop, AnimationClassNames.slideRightIn40)
+          ) }>
           { groupElements }
         </nav>
       </FocusZone>
@@ -104,7 +107,12 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
         title={ link.title || link.name }
         target={ link.target }
       >
-        { link.iconClassName && <i className={ css('ms-Icon', 'ms-Nav-IconLink', link.iconClassName, styles.iconLink) }></i> }
+        { link.iconClassName && (
+          <Icon
+            className={ css(link.iconClassName, styles.iconLink) }
+            iconName='iconLink'
+          />
+        ) }
         { this.props.onRenderLink(link) }
       </a>
     );
@@ -143,7 +151,10 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
             aria-label={ this.props.expandButtonAriaLabel }
             aria-expanded={ link.isExpanded ? 'true' : 'false' }
           >
-            <i className={ css('ms-Nav-chevron ms-Icon ms-Icon--ChevronDown', styles.chevronIcon) }></i>
+            <Icon
+              className={ css('ms-Nav-chevron', styles.chevronIcon, link.isExpanded) }
+              iconName='chevronDown'
+            />
           </button> : null
         ) }
         { !!link.onClick ? this._renderButtonLink(link, linkIndex) : this._renderAnchorLink(link, linkIndex, nestingLevel) }
@@ -187,17 +198,18 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
             className={ css('ms-Nav-chevronButton ms-Nav-chevronButton--group ms-Nav-groupHeaderFontSize', styles.chevronButton, styles.chevronButtonIsGroup, styles.groupHeaderFontSize) }
             onClick={ this._onGroupHeaderClicked.bind(this, group.name) }
           >
-            <i
+            <Icon
               className={ css(
-                'ms-Nav-chevron ms-Icon ms-Icon--ChevronDown',
+                'ms-Nav-chevron',
                 styles.chevronIcon,
                 isGroupExpanded && styles.chevronIsExpanded
               ) }
+              iconName='chevronDown'
             />
             { group.name }
           </button> : null)
         }
-        <div className={ css('ms-Nav-groupContent', 'ms-slideDownIn20', styles.groupContent) }>
+        <div className={ css('ms-Nav-groupContent', AnimationClassNames.slideDownIn20, styles.groupContent) }>
           { this._renderLinks(group.links, 0 /* nestingLevel */) }
         </div>
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.Props.ts b/packages/office-ui-fabric-react/src/components/Panel/Panel.Props.ts
index ada6dcc0503ab..ddd9dc77fbe2c 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.Props.ts
@@ -4,7 +4,15 @@ import { IRenderFunction } from '../../Utilities';
 import { ILayerProps } from '../../Layer';
 
 export interface IPanel {
+  /**
+   * Forces the panel to open.
+   */
+  open: () => void;
 
+  /**
+   * Forces the panel to dismiss.
+   */
+  dismiss: () => void;
 }
 export interface IPanelProps extends React.Props<Panel> {
   /**
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.scss b/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
index be2b8e78df341..9a1b47deb9dbe 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
@@ -26,7 +26,6 @@ $Panel-margin-xl: 176px;
 $CommandBarHeight: 44px;
 
 .root {
-  display: none;
   pointer-events: none;
 
   position: absolute;
@@ -38,7 +37,6 @@ $CommandBarHeight: 44px;
 
   // Overlay used within panel
   .overlay {
-    display: none;
     pointer-events: none;
     opacity: 1;
     cursor: pointer;
@@ -56,8 +54,6 @@ $CommandBarHeight: 44px;
   bottom: 0;
   top: 0;
 
-  display: none;
-
   overflow-x: hidden;
   overflow-y: auto;
   -webkit-overflow-scrolling: touch;
@@ -174,17 +170,12 @@ $CommandBarHeight: 44px;
 //== State: When the panel is open.
 //
 .root.rootIsOpen {
-  display: block;
-
   .main {
-    opacity: 1;
     pointer-events: auto;
-    display: block;
   }
 
   .overlay {
     cursor: pointer;
-    display: block;
     pointer-events: auto;
 
     @media screen and (-ms-high-contrast: active) {
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.test.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.test.tsx
index ba66372379f53..425fa56b8aed2 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.test.tsx
@@ -8,28 +8,25 @@ let { expect } = chai;
 
 import { Panel } from './Panel';
 
+let div: HTMLElement;
+
 describe('Panel', () => {
-  afterEach(() => {
-    [].forEach.call(document.querySelectorAll('body > div'), div => div.parentNode.removeChild(div));
+  beforeEach(() => {
+    div = document.createElement('div');
+  });
 
-    expect(document.querySelector('.ms-Panel')).to.be.null;
+  afterEach(() => {
+    ReactDOM.unmountComponentAtNode(div);
   });
 
-  it('Fires the correct events when closing', () => {
+  it('fires the correct events when closing', (done) => {
     let dismissedCalled = false;
     let dismissCalled = false;
-
-    const handleDismissed = () => {
-      dismissedCalled = true;
-    };
-
-    const div = document.createElement('div');
-
     let panel: Panel = ReactDOM.render(
       <Panel
         isOpen={ true }
         onDismiss={ () => { dismissCalled = true; } }
-        onDismissed={ handleDismissed } />,
+        onDismissed={ () => dismissedCalled = true } />,
       div) as any;
 
     panel.dismiss();
@@ -37,16 +34,13 @@ describe('Panel', () => {
     expect(dismissCalled).equals(true, 'onDismiss was not called');
     expect(dismissedCalled).equals(false, 'onDismissed was called prematurely');
 
-    // Generate animation event to simulate animation completing.
-    const event = document.createEvent('CustomEvent'); // AnimationEvent is not supported by PhantomJS
-    event.initCustomEvent('animationend', true, true, {});
-    (event as any).animationName = 'fadeOut';
-
-    const panelElement = document.querySelector('.ms-Panel');
-    expect(panel).not.to.be.null;
-
-    panelElement.dispatchEvent(event);
-
-    expect(dismissedCalled).equals(true, 'onDismissed was not called');
+    setTimeout(() => {
+      try {
+        expect(dismissedCalled).equals(true, 'onDismissed not called');
+        done();
+      } catch (e) {
+        done(e);
+      }
+    }, 250);
   });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
index 133956d6ad2a0..73aa5263881e5 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
@@ -4,37 +4,29 @@ import * as React from 'react';
 
 import {
   BaseComponent,
+  autobind,
   css,
   getId,
-  getRTL,
-  autobind
+  getRTL
 } from '../../Utilities';
 import { FocusTrapZone } from '../FocusTrapZone/index';
-import { IPanelProps, PanelType } from './Panel.Props';
+import { IPanel, IPanelProps, PanelType } from './Panel.Props';
 import { Layer } from '../Layer/Layer';
 import { Overlay } from '../../Overlay';
 import { Popup } from '../../Popup';
 import { IconButton } from '../../Button';
+import { AnimationClassNames } from '../../Styling';
 import * as stylesImport from './Panel.scss';
 const styles: any = stylesImport;
 
 export interface IPanelState {
   isFooterSticky?: boolean;
   isOpen?: boolean;
-  isAnimatingOpen?: boolean;
-  isAnimatingClose?: boolean;
+  isAnimating?: boolean;
   id?: string;
 }
 
-// Animation class constants.
-const FADE_IN_200 = 'ms-fadeIn200';
-const FADE_OUT_200 = 'ms-fadeOut200';
-const SLIDE_LEFT_IN_40 = 'ms-slideLeftIn40';
-const SLIDE_LEFT_OUT_40 = 'ms-slideLeftOut40';
-const SLIDE_RIGHT_IN_40 = 'ms-slideRightIn40';
-const SLIDE_RIGHT_OUT_40 = 'ms-slideRightOut40';
-
-export class Panel extends BaseComponent<IPanelProps, IPanelState> {
+export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IPanel {
 
   public static defaultProps: IPanelProps = {
     isOpen: false,
@@ -48,49 +40,29 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> {
   constructor(props: IPanelProps) {
     super(props);
 
-    this._onPanelClick = this._onPanelClick.bind(this);
-    this._onPanelRef = this._onPanelRef.bind(this);
-
     this.state = {
       isFooterSticky: false,
-      isOpen: !!props.isOpen,
-      isAnimatingOpen: props.isOpen,
-      isAnimatingClose: false,
+      isOpen: false,
+      isAnimating: false,
       id: getId('Panel')
     };
   }
 
   public componentDidMount() {
     this._events.on(window, 'resize', this._updateFooterPosition);
-    if (this.state.isOpen) {
-      this._async.setTimeout(() => {
-        this.setState({
-          isAnimatingOpen: false
-        });
-      }, 2000);
+
+    if (this.props.isOpen) {
+      this.open();
     }
   }
 
   public componentWillReceiveProps(newProps: IPanelProps) {
     if (newProps.isOpen !== this.state.isOpen) {
-      this.setState({
-        isOpen: true,
-        isAnimatingOpen: newProps.isOpen ? true : false,
-        isAnimatingClose: newProps.isOpen ? false : true
-      });
-
-    }
-  }
-
-  public componentDidUpdate(prevProps, prevState) {
-    if (prevState.isOpen === false) {
-      this._updateFooterPosition();
-    }
-    if (
-      prevState.isAnimatingClose === false &&
-      this.state.isAnimatingClose === true &&
-      this.props.onDismiss) {
-      this.props.onDismiss();
+      if (newProps.isOpen) {
+        this.open();
+      } else {
+        this.dismiss();
+      }
     }
   }
 
@@ -115,14 +87,14 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> {
       onRenderBody = this._onRenderBody,
       onRenderFooter = this._onRenderFooter
     } = this.props;
-    let { isOpen, isAnimatingOpen, isAnimatingClose, id, isFooterSticky } = this.state;
+    let { isOpen, isAnimating, id, isFooterSticky } = this.state;
     let isLeft = type === PanelType.smallFixedNear ? true : false;
     let isRTL = getRTL();
     let isOnRightSide = isRTL ? isLeft : !isLeft;
     const headerTextId = id + '-headerText';
     const customWidthStyles = (type === PanelType.custom) ? { width: customWidth } : {};
 
-    if (!isOpen) {
+    if (!isOpen && !isAnimating) {
       return null;
     }
 
@@ -132,10 +104,9 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> {
         <Overlay
           className={ css(
             styles.overlay,
-            {
-              [FADE_IN_200]: isAnimatingOpen,
-              [FADE_OUT_200]: isAnimatingClose
-            }) }
+            isOpen && isAnimating && AnimationClassNames.fadeIn200,
+            !isOpen && isAnimating && AnimationClassNames.fadeOut200
+          ) }
           isDarkThemed={ false }
           onClick={ isLightDismiss ? this._onPanelClick : null }
         />
@@ -147,37 +118,38 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> {
         <Popup
           role='dialog'
           ariaLabelledBy={ headerText && headerTextId }
-          onDismiss={ this.props.onDismiss }>
+          onDismiss={ this.dismiss }>
           <div
-            ref={ this._onPanelRef }
             className={
-              css('ms-Panel', styles.root, className, {
+              css(
+                'ms-Panel',
+                styles.root,
+                className,
                 // because the RTL animations are not being used, we need to set a class
-                ['is-open ' + styles.rootIsOpen]: isOpen,
-                ['ms-Panel--smFluid ' + styles.rootIsSmallFluid]: type === PanelType.smallFluid,
-                ['ms-Panel--smLeft ' + styles.rootIsSmallLeft]: type === PanelType.smallFixedNear,
-                ['ms-Panel--sm ' + styles.rootIsSmall]: type === PanelType.smallFixedFar,
-                ['ms-Panel--md ' + styles.rootIsMedium]: type === PanelType.medium,
-                ['ms-Panel--lg ' + styles.rootIsLarge]: type === PanelType.large || type === PanelType.largeFixed,
-                ['ms-Panel--fixed ' + styles.rootIsFixed]: type === PanelType.largeFixed,
-                ['ms-Panel--xl ' + styles.rootIsXLarge]: type === PanelType.extraLarge,
-                ['ms-Panel--custom ' + styles.rootIsCustom]: type === PanelType.custom,
-                ['ms-Panel--hasCloseButton ' + styles.rootHasCloseButton]: hasCloseButton
-              })
+                isOpen && ('is-open ' + styles.rootIsOpen),
+                type === PanelType.smallFluid && ('ms-Panel--smFluid ' + styles.rootIsSmallFluid),
+                type === PanelType.smallFixedNear && ('ms-Panel--smLeft ' + styles.rootIsSmallLeft),
+                type === PanelType.smallFixedFar && ('ms-Panel--sm ' + styles.rootIsSmall),
+                type === PanelType.medium && ('ms-Panel--md ' + styles.rootIsMedium),
+                type === PanelType.large || type === PanelType.largeFixed && ('ms-Panel--lg ' + styles.rootIsLarge),
+                type === PanelType.largeFixed && ('ms-Panel--fixed ' + styles.rootIsFixed),
+                type === PanelType.extraLarge && ('ms-Panel--xl ' + styles.rootIsXLarge),
+                type === PanelType.custom && ('ms-Panel--custom ' + styles.rootIsCustom),
+                hasCloseButton && ('ms-Panel--hasCloseButton ' + styles.rootHasCloseButton)
+              )
             }
           >
             { overlay }
             <FocusTrapZone
-              className={ css(
-                'ms-Panel-main',
-                styles.main,
-                {
-                  [SLIDE_RIGHT_IN_40]: isAnimatingOpen && !isOnRightSide,
-                  [SLIDE_LEFT_IN_40]: isAnimatingOpen && isOnRightSide,
-                  [SLIDE_LEFT_OUT_40]: isAnimatingClose && !isOnRightSide,
-                  [SLIDE_RIGHT_OUT_40]: isAnimatingClose && isOnRightSide
-                }
-              ) }
+              className={
+                css(
+                  'ms-Panel-main',
+                  styles.main,
+                  isOpen && isAnimating && !isOnRightSide && AnimationClassNames.slideRightIn40,
+                  isOpen && isAnimating && isOnRightSide && AnimationClassNames.slideLeftIn40,
+                  !isOpen && isAnimating && !isOnRightSide && AnimationClassNames.slideLeftOut40,
+                  !isOpen && isAnimating && isOnRightSide && AnimationClassNames.slideRightOut40,
+                ) }
               style={ customWidthStyles }
               elementToFocusOnDismiss={ elementToFocusOnDismiss }
               isClickableOutsideFocusTrap={ isLightDismiss }
@@ -200,12 +172,30 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> {
     );
   }
 
+  public open() {
+    if (!this.state.isOpen) {
+      this.setState({
+        isOpen: true,
+        isAnimating: true
+      }, () => {
+        this._async.setTimeout(this._onTransitionComplete, 200);
+      });
+    }
+  }
+
+  @autobind
   public dismiss() {
     if (this.state.isOpen) {
       this.setState({
-        isAnimatingOpen: false,
-        isAnimatingClose: true
+        isOpen: false,
+        isAnimating: true
+      }, () => {
+        this._async.setTimeout(this._onTransitionComplete, 200);
       });
+
+      if (this.props.onDismiss) {
+        this.props.onDismiss();
+      }
     }
   }
 
@@ -279,34 +269,19 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> {
     }
   }
 
+  @autobind
   private _onPanelClick() {
     this.dismiss();
   }
 
-  private _onPanelRef(ref: HTMLDivElement) {
-    if (ref) {
-      this._events.on(ref, 'animationend', this._onAnimationEnd);
-    } else {
-      this._events.off();
-    }
-  }
-
-  private _onAnimationEnd(ev: AnimationEvent) {
-    if (ev.animationName.indexOf('In') > -1) {
-      this.setState({
-        isOpen: true,
-        isAnimatingOpen: false
-      });
-    }
-    if (ev.animationName.indexOf('Out') > -1) {
-      this.setState({
-        isOpen: false,
-        isAnimatingClose: false
-      });
+  @autobind
+  private _onTransitionComplete() {
+    this.setState({
+      isAnimating: false
+    });
 
-      if (this.props.onDismissed) {
-        this.props.onDismissed();
-      }
+    if (!this.state.isOpen && this.props.onDismissed) {
+      this.props.onDismissed();
     }
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx b/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
index 1d46577a92dfb..fcbc72a76ca46 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
@@ -15,6 +15,7 @@ import { PanelExtraLargeExample } from './examples/Panel.ExtraLarge.Example';
 import { PanelCustomExample } from './examples/Panel.Custom.Example';
 import { PanelLightDismissExample } from './examples/Panel.LightDismiss.Example';
 import { PanelNonModalExample } from './examples/Panel.NonModal.Example';
+import { FontClassNames } from '../../Styling';
 
 const PanelSmallRightExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Panel/examples/Panel.SmallRight.Example.tsx') as string;
 const PanelSmallLeftExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Panel/examples/Panel.SmallLeft.Example.tsx') as string;
@@ -80,7 +81,7 @@ export class PanelPage extends React.Component<IComponentDemoPageProps, {}> {
               Panels are modal UI overlays that provide contextual app information. They often request some kind of creation or management action from the user. Panels are paired with the Overlay component, also known as a Light Dismiss. The Overlay blocks interactions with the app view until dismissed either through clicking or tapping on the Overlay or by selecting a close or completion action within the Panel.
             </p>
 
-            <h2 className='ms-font-xl'>Examples of experiences that use Panels</h2>
+            <h2 className={ FontClassNames.xLarge }>Examples of experiences that use Panels</h2>
 
             <ul>
               <li>Member or group list creation or management</li>
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Custom.Example.tsx
index c531de0c2d46a..e1bcec7de9d6b 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Custom.Example.tsx
@@ -26,7 +26,7 @@ export class PanelCustomExample extends React.Component<any, any> {
           customWidth='888px'
           headerText='Custom Panel with custom 888px width'
         >
-          <span className='ms-font-m'>Content goes here.</span>
+          <span>Content goes here.</span>
         </Panel>
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.ExtraLarge.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.ExtraLarge.Example.tsx
index f0cf81ace7361..705fcadcfa4f5 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.ExtraLarge.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.ExtraLarge.Example.tsx
@@ -24,7 +24,7 @@ export class PanelExtraLargeExample extends React.Component<any, any> {
           headerText='Extra Large Panel'
           closeButtonAriaLabel='Close'
         >
-          <span className='ms-font-m'>Content goes here.</span>
+          <span>Content goes here.</span>
         </Panel>
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Large.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Large.Example.tsx
index bee73dabaf9a1..8de41f08c2a5e 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Large.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Large.Example.tsx
@@ -23,7 +23,7 @@ export class PanelLargeExample extends React.Component<any, any> {
           type={ PanelType.large }
           headerText='Large Panel'
         >
-          <span className='ms-font-m'>Content goes here.</span>
+          <span>Content goes here.</span>
         </Panel>
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LargeFixed.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LargeFixed.Example.tsx
index d0f4bea22b250..469716df1079b 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LargeFixed.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LargeFixed.Example.tsx
@@ -25,7 +25,7 @@ export class PanelLargeFixedExample extends React.Component<any, any> {
           type={ PanelType.largeFixed }
           headerText='Large Panel'
         >
-          <span className='ms-font-m'>Content goes here.</span>
+          <span>Content goes here.</span>
         </Panel>
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismiss.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismiss.Example.tsx
index 83fec802ea137..26b01203fe92b 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismiss.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismiss.Example.tsx
@@ -23,7 +23,7 @@ export class PanelLightDismissExample extends React.Component<any, any> {
           headerText='Light Dismiss Panel'
           onDismiss={ () => this.setState({ showPanel: false }) }
         >
-          <span className='ms-font-m'>Light Dismiss usage is meant for the Contextual Menu on mobile sized breakpoints.</span>
+          <span>Light Dismiss usage is meant for the Contextual Menu on mobile sized breakpoints.</span>
         </Panel>
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Medium.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Medium.Example.tsx
index fd15b3d76b7f0..980127b36508b 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Medium.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Medium.Example.tsx
@@ -23,7 +23,7 @@ export class PanelMediumExample extends React.Component<any, any> {
           type={ PanelType.medium }
           headerText='Medium Panel'
         >
-          <span className='ms-font-m'>Content goes here.</span>
+          <span>Content goes here.</span>
         </Panel>
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.NonModal.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.NonModal.Example.tsx
index 07025f5385d50..5a911ded99840 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.NonModal.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.NonModal.Example.tsx
@@ -24,7 +24,7 @@ export class PanelNonModalExample extends React.Component<any, any> {
           headerText='Non-Modal Panel'
           closeButtonAriaLabel='Close'
         >
-          <span className='ms-font-m'>Content goes here.</span>
+          <span>Content goes here.</span>
         </Panel>
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallFluid.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallFluid.Example.tsx
index 74e3c630a166e..8641695485d8c 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallFluid.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallFluid.Example.tsx
@@ -23,7 +23,7 @@ export class PanelSmallFluidExample extends React.Component<any, any> {
           onDismiss={ () => this.setState({ showPanel: false }) }
           headerText='Panel - Small, right-aligned, fixed'
         >
-          <span className='ms-font-m'>Content goes here.</span>
+          <span>Content goes here.</span>
         </Panel>
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallLeft.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallLeft.Example.tsx
index e08042c96289b..6b326dff2f121 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallLeft.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallLeft.Example.tsx
@@ -23,7 +23,7 @@ export class PanelSmallLeftExample extends React.Component<any, any> {
           onDismiss={ () => this.setState({ showPanel: false }) }
           headerText='Panel - Small, left-aligned, fixed'
         >
-          <span className='ms-font-m'>Content goes here.</span>
+          <span>Content goes here.</span>
         </Panel>
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index dfbfb7ea99946..a895e9e19ed35 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -9,6 +9,7 @@ import {
   getRTL,
   IRenderFunction
 } from '../../Utilities';
+import { Icon } from '../../Icon';
 import { Image, ImageFit, ImageLoadState } from '../../Image';
 import {
   IPersonaProps,
@@ -105,8 +106,9 @@ export class Persona extends BaseComponent<IPersonaProps, IPersonaState> {
           userPresence = '';
       }
       if (userPresence) {
-        let iconClass = css(`ms-Persona-presenceIcon ms-Icon ms-Icon--${userPresence}`, styles.presenceIcon);
-        statusIcon = <i className={ iconClass }></i>;
+        statusIcon = (
+          <Icon className={ css('ms-Persona-presenceIcon', styles.presenceIcon) } iconName={ userPresence } />
+        );
       }
       presenceElement = <div className={ css('ms-Persona-presence', styles.presence) }>{ statusIcon }</div>;
     }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
index 00a7d37b52eda..75710da45a62f 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
@@ -5,6 +5,7 @@ import {
   PersonaPresence
 } from 'office-ui-fabric-react/lib/Persona';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
+import { Label } from 'office-ui-fabric-react/lib/Label';
 import { TestImages } from '../../../common/TestImages';
 
 const examplePersona = {
@@ -35,6 +36,7 @@ export class PersonaBasicExample extends React.Component<React.Props<PersonaBasi
             checked={ renderPersonaDetails }
             onChange={ (ev, checked) => { this.setState({ renderPersonaDetails: checked }); } } />
         </div>
+
         <Persona
           { ...examplePersona }
           size={ PersonaSize.tiny }
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
index ccb955e0cf8be..8e25ec01a49c8 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
@@ -13,6 +13,7 @@ import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { PivotItem } from './PivotItem';
 import { PivotLinkFormat } from './Pivot.Props';
 import { PivotLinkSize } from './Pivot.Props';
+import { Icon } from '../../Icon';
 import * as stylesImport from './Pivot.scss';
 const styles: any = stylesImport;
 
@@ -158,7 +159,7 @@ export class Pivot extends BaseComponent<IPivotProps, IPivotState> {
     return <span className={ css('ms-Pivot-link-content') }>
       { itemIcon !== undefined && (
         <span className={ css('ms-Pivot-icon', styles.icon) }>
-          <i className={ `ms-Icon ms-Icon--${itemIcon}` }></i>
+          <Icon iconName={ itemIcon } />
         </span>
       ) }
       { linkText !== undefined && <span className={ css('ms-Pivot-text', styles.text) }> { link.linkText }</span> }
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx b/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
index db2e20f6175e3..93f2e998d144b 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
@@ -4,6 +4,7 @@ import {
   css,
   getId
 } from '../../Utilities';
+import { Icon } from '../../Icon';
 import { IRatingProps, RatingSize } from './Rating.Props';
 import * as stylesImport from './Rating.scss';
 const styles: any = stylesImport;
@@ -122,7 +123,7 @@ export class Rating extends BaseComponent<IRatingProps, IRatingState> {
   }
 
   private _getIcon(): JSX.Element {
-    return <i className={ css('ms-Icon', this.props.icon || 'ms-Icon--FavoriteStarFill') } />;
+    return <Icon iconName={ this.props.icon || 'favoriteStarFill' } />;
   }
 
   private _getInitialValue(props: IRatingProps) {
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
index 4a0ca97ea6455..e0500d8bd7a56 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
@@ -7,6 +7,7 @@ import {
 } from '@uifabric/example-app-base';
 import { SearchBoxSmallExample } from './examples/SearchBox.Small.Example';
 import { SearchBoxFullSizeExample } from './examples/SearchBox.FullSize.Example';
+import { FontClassNames } from '../../Styling';
 
 const SearchBoxSmallExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Small.Example.tsx') as string;
 const SearchBoxFullSizeExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.FullSize.Example.tsx') as string;
@@ -40,19 +41,19 @@ export class SearchBoxPage extends React.Component<IComponentDemoPageProps, {}>
               SearchBoxes provide an input field for searching through content, allowing users to locate specific items within the website or app.
             </p>
 
-            <h2 className='ms-font-xl'>Zero input state </h2>
+            <h2 className={ FontClassNames.xLarge }>Zero input state </h2>
 
             <p>
               When the user has clicked into the SearchBox, but has not entered any text, there is an opportunity to display "hint text" within the input field, explaining what a user can do next. This could prompt a user to search for specific type content, or explain the scope of the search. Examples include "type to search", "try searching for &lt;x&gt;", "search for a place" or "type to search in &lt;x location&gt;".
             </p>
 
-            <h2 className='ms-font-xl'>Autocomplete suggestions</h2>
+            <h2 className={ FontClassNames.xLarge }>Autocomplete suggestions</h2>
 
             <p>
               As the user enters a query string, they are provided with a dropdown of autocomplete suggestions or disambiguation options. This will help them expedite the input process and formulate an effective query. Recent search history, trending searches, contextual search suggestions, hints and tips are all good candidates for autocomplete content. In general, autocomplete suggestions have the user's input highlighted in some way (generally bolded) to indicate why it's being displayed. As the user enters more keystrokes, the suggestions update continuously/in real time. To see autocomplete suggestions, the user does not need to hit enter (execute a full search), as it is a lightweight way to get quick suggestions or results. If there are mixed result types within the autocomplete suggestions, provide visual indicators or grouping to help organize the information, making it easier to parse.
             </p>
 
-            <h2 className='ms-font-xl'>Full search</h2>
+            <h2 className={ FontClassNames.xLarge }>Full search</h2>
 
             <p>
               If a user hits "enter" after entering input, a full search is executed. Full searches often go to another "results" page, or change/filter the content of the current page to show only applicable content. The results can appear in any form that best communicates the content.
@@ -62,7 +63,7 @@ export class SearchBoxPage extends React.Component<IComponentDemoPageProps, {}>
               As a general guideline, results should be displayed in context with the query that was typed, with immediate access to edit the query or enter a new one. One method to enable efficient access to both edit the previous query and enter a new query is to highlight the previous query when the field is reactivated. This way, any keystroke will replace the previous string, but the string is maintained so that the user can position a cursor to edit or append the previous string.
             </p>
 
-            <h2 className='ms-font-xl'>Search scopes</h2>
+            <h2 className={ FontClassNames.xLarge }>Search scopes</h2>
 
             <p>
               Although search entry points tend to be similarly visualized, they can provide access to results that range from broad to narrow. By effectively communicating the scope of a search, you can help to ensure that the user expectation will be met by the capabilities of the search you are performing, which will reduce the possibility of frustration. The search entry point should be juxtaposed with the content being searched.
@@ -78,7 +79,7 @@ export class SearchBoxPage extends React.Component<IComponentDemoPageProps, {}>
               <li><strong>My stuff:</strong> Search across device(s), cloud, social graphs, and more. Results are varied, but are constrained by the connection to user account(s).</li>
             </ul>
 
-            <h2 className='ms-font-xl'>SearchBox with no parent container</h2>
+            <h2 className={ FontClassNames.xLarge }>SearchBox with no parent container</h2>
 
             <p>
               Use a SearchBox without a parent container when it is not restricted to a certain width to accommodate other content. This search box will span the entire width of the space it's in.
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts b/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts
index 1f742ec4647ac..e55f80b4ab2f8 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts
@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { IRenderFunction } from '../../Utilities';
+import { IIconProps } from '../../Icon';
 
 export interface ITextField {
   /** Gets the current value of the input. */
@@ -86,9 +87,9 @@ export interface ITextFieldProps extends React.HTMLProps<HTMLInputElement | HTML
   onRenderAddon?: IRenderFunction<ITextFieldProps>;
 
   /**
-   * CSS class for the icon.
+   * Optional icon props for an icon.
    */
-  iconClass?: string;
+  iconProps?: IIconProps;
 
   /**
    * Default value of the textfield, if any. Only provide this if the textfield is an uncontrolled component;
@@ -181,4 +182,11 @@ export interface ITextFieldProps extends React.HTMLProps<HTMLInputElement | HTML
    * @default true
    */
   validateOnLoad?: boolean;
+
+  /**
+   * @deprecated
+   * Deprecated; use iconProps instead.
+   */
+  iconClass?: string;
+
 }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index 59c8c059c8265..d6cf9c9098af3 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -13,7 +13,7 @@ import {
 } from '../../Utilities';
 import * as stylesImport from './TextField.scss';
 const styles: any = stylesImport;
-
+import { AnimationClassNames } from '../../Styling';
 export interface ITextFieldState {
   value?: string;
 
@@ -60,6 +60,10 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
   public constructor(props: ITextFieldProps) {
     super(props);
 
+    this._warnDeprecations({
+      'iconClass': 'iconProps'
+    });
+
     this._warnMutuallyExclusive({
       'value': 'defaultValue'
     });
@@ -126,6 +130,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
       description,
       disabled,
       iconClass,
+      iconProps,
       label,
       multiline,
       required,
@@ -157,7 +162,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
             </div>
           ) }
           { multiline ? this._renderTextArea() : this._renderInput() }
-          { iconClass && <i className={ css(iconClass, styles.icon) }></i> }
+          { (iconClass || iconProps) && <Icon className={ css(iconClass, styles.icon) } { ...iconProps } /> }
         </div>
         { this._isDescriptionAvailable &&
           <span id={ this._descriptionId }>
@@ -166,9 +171,9 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
               <div aria-live='assertive'>
                 <DelayedRender>
                   <p
-                    className={ css('ms-TextField-errorMessage ms-slideDownIn20', styles.errorMessage) }
+                    className={ css('ms-TextField-errorMessage', AnimationClassNames.slideDownIn20, styles.errorMessage) }
                     data-automation-id='error-message'>
-                    <i className={ css('ms-Icon ms-Icon--Error', styles.errorIcon) } aria-hidden='true'></i>
+                    <Icon iconName='error' className={ styles.errorIcon } />
                     { errorMessage }
                   </p>
                 </DelayedRender>
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
index ec471903d4a58..b2d6bfd277d86 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
@@ -13,9 +13,9 @@ export class TextFieldBasicExample extends React.Component<any, any> {
         <TextField label='Disabled TextField' disabled={ true } placeholder='Placeholder text' />
         <TextField label='Required TextField' required={ true } />
         <TextField label='TextField with a placeholder' placeholder='Now I am a Placeholder' ariaLabel='Please enter text here' />
-        <TextField label='TextField with an icon' iconClass='ms-Icon--Calendar ms-Icon' />
+        <TextField label='TextField with an icon' iconProps={ { iconName: 'calendar' } } />
         <TextField label='Textfield with an addon' addonString='https://' />
-        <TextField label='Multiline TextField' multiline rows={ 4 } iconClass='ms-Icon--Calendar ms-Icon' />
+        <TextField label='Multiline TextField' multiline rows={ 4 } iconProps={ { iconName: 'calendar' } } />
         <TextField label='Multiline TextField Unresizable' multiline resizable={ false } />
         <TextField label='Multiline TextField with auto adjust height' multiline autoAdjustHeight />
         <TextField label='Underlined TextField' underlined />
diff --git a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
index ac35c3bf14888..a02ab939d08b0 100644
--- a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
@@ -6,8 +6,8 @@ import { Callout } from 'office-ui-fabric-react/lib/Callout';
 import { DetailsList, DetailsListLayoutMode as LayoutMode } from 'office-ui-fabric-react/lib/DetailsList';
 import { SelectionMode } from 'office-ui-fabric-react/lib/Selection';
 import { ColorPicker } from 'office-ui-fabric-react/lib/ColorPicker';
+import { FontClassNames } from '../../Styling';
 import './ThemePage.scss';
-
 const ThemeCodeExample = require('!raw-loader!office-ui-fabric-react/src/components/Theme/examples/ThemeCode.Example.tsx');
 
 export class ThemePage extends React.Component<any, any> {
@@ -38,7 +38,7 @@ export class ThemePage extends React.Component<any, any> {
 
     return (
       <div className='Themes'>
-        <h1 className='ms-font-xxl'>Themes</h1>
+        <h1 className={ FontClassNames.xxLarge }>Themes</h1>
         <p>The entire color pallete of the controls are themeable. We provide a set of sensible defaults, but you can override all colors individually.</p>
         <p>To override the themes, you need to call <span className='code'>loadTheme()</span> with the appropriate set of overrides:</p>
 
@@ -46,7 +46,7 @@ export class ThemePage extends React.Component<any, any> {
           { ThemeCodeExample }
         </Highlight>
 
-        <h1 className='ms-font-xl'>Define a theme</h1>
+        <h1 className={ FontClassNames.xLarge }>Define a theme</h1>
         <div>
           <DetailsList
             ref='list'
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.Props.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.Props.ts
index 051a392f07597..66acc45a4a66e 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.Props.ts
@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { Toggle } from './Toggle';
+import { IStyle } from '../../Styling';
 
 export interface IToggle {
   focus: () => void;
@@ -8,7 +9,7 @@ export interface IToggle {
 /**
  * Toggle component props.
  */
-export interface IToggleProps extends React.HTMLProps<HTMLInputElement | Toggle> {
+export interface IToggleProps extends React.HTMLProps<HTMLElement | Toggle> {
   /**
    * Optional callback to access the IToggle interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
@@ -59,4 +60,91 @@ export interface IToggleProps extends React.HTMLProps<HTMLInputElement | Toggle>
    * onchange callback.
    */
   onChanged?: (checked: boolean) => void;
-}
\ No newline at end of file
+
+  /**
+   * Custom styles for this component
+   */
+  styles?: IToggleStyles;
+}
+
+export interface IToggleStyles {
+  /**
+   * Style for the root element in the default enabled/unchecked state.
+   */
+  root?: IStyle;
+
+  /*
+   * Style for the text before the actual toggle switch.
+   */
+  label?: IStyle;
+
+  /**
+   * Style for the container wrapping switch and the state (on/off) text.
+   */
+  container?: IStyle;
+
+  /**
+   * Style for the toggle "pill" element, which is inside of the container and contains the thumb.
+   */
+  pill?: IStyle;
+
+  /**
+   * Style override for the pill element when enabled/checked.
+   */
+  pillChecked?: IStyle;
+
+  /**
+   * Style override for the pill element when enabled/unchecked/hovered.
+   */
+  pillHovered?: IStyle;
+
+  /**
+   * Style override for the pill element when enabled/checked/hovered.
+   */
+  pillCheckedHovered?: IStyle;
+
+  /**
+   * Style override for the pill element when disabled/unchecked.
+   */
+  pillDisabled?: IStyle;
+
+  /**
+   * Style override for the pill element when disabled/checked.
+   */
+  pillCheckedDisabled?: IStyle;
+
+  /**
+   * Style for the thumb element inside of the pill, in the normal unchecked enabled state.
+   */
+  thumb?: IStyle;
+
+  /**
+   * Style override for the thumb when enabled/unchecked/hovered.
+   */
+  thumbHovered?: IStyle;
+
+  /**
+   * Style override for the thumb when enabled/checked.
+   */
+  thumbChecked?: IStyle;
+
+  /**
+   * Style override for the thumb when enabled/checked/hovered.
+   */
+  thumbCheckedHovered?: IStyle;
+
+  /**
+   * Style override for the thumb when disabled/unchecked.
+   */
+  thumbDisabled?: IStyle;
+
+  /**
+   * Style override for the thumb when disabled/checked.
+   */
+  thumbCheckedDisabled?: IStyle;
+
+  /**
+   * Style for the text indicating the on/off state of the control.
+   */
+  text?: IStyle;
+}
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.scss b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.scss
deleted file mode 100644
index 83cacd8166764..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.scss
+++ /dev/null
@@ -1,207 +0,0 @@
-@import '../../common/common';
-
-// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
-
-// --------------------------------------------------
-// Toggle semantic slots
-
-$toggle-background-off-color: $controlBackgroundColor;
-$toggle-background-on-color: $controlBackgroundSelectedColor;
-$toggle-background-on-hover-color: $controlBackgroundSelectedHoverColor;
-
-$toggle-thumb-off-color: $controlBorderUnselectedColor;
-$toggle-thumb-off-hover-color: $controlBorderUnselectedHoverColor;
-$toggle-thumb-on-color: $controlForegroundSelectedColor;
-
-$toggle-border-off-color: $toggle-thumb-off-color;
-$toggle-border-off-hover-color: $toggle-thumb-off-hover-color;
-$toggle-border-on-hover-color: $controlBorderSelectedHoverColor;
-
-$toggle-thumb-off-disabled-color: $disabledTextColor;
-$toggle-border-off-disabled-color: $disabledTextColor;
-$toggle-background-on-disabled-color: $disabledTextColor;
-$toggle-thumb-on-disabled-color: $disabledBackgroundColor;
-
-$toggle-focusBorder-color: $focusBorderColor;
-
-//
-// Office UI Fabric
-// --------------------------------------------------
-// Toggle styles
-
-@mixin highContrast-bgColor($active-color, $bw-color) {
-  @media screen and (-ms-high-contrast: active) {
-    background-color: $active-color;
-  }
-
-  @media screen and (-ms-high-contrast: black-on-white) {
-    background-color: $bw-color;
-  }
-}
-
-// Toggle
-.root {
-  @include ms-normalize;
-  position: relative;
-  display: block;
-  margin-bottom: 8px;
-  user-select: none;
-}
-
-// Interactive overrides
-.isEnabled {
-
-  .invisibleToggle {
-    cursor: pointer;
-  }
-
-  .background {
-    background: $toggle-background-off-color;
-    border: 1px solid $toggle-border-off-color;
-  }
-
-  .thumb {
-    background: $toggle-thumb-off-color;
-    @include highContrast-bgColor($ms-color-white, $ms-color-black);
-  }
-
-  .slider:hover {
-    .background {
-      border: 1px solid $toggle-border-off-hover-color;
-    }
-
-    .thumb {
-      background: $toggle-thumb-off-hover-color;
-    }
-  }
-
-  &.isChecked {
-    .background {
-      background: $toggle-background-on-color;
-      border: 1px solid transparent;
-      @include highContrast-bgColor($ms-color-white, $ms-color-black);
-    }
-
-    .thumb {
-      background: $toggle-thumb-on-color;
-      @include ms-left(28px);
-      @include highContrast-bgColor($ms-color-black, $ms-color-white);
-    }
-
-    .slider:hover {
-      .background {
-        border: 1px solid $toggle-border-on-hover-color;
-        background: $toggle-background-on-hover-color;
-      }
-
-      .thumb {
-        background: $toggle-thumb-on-color;
-        @include left(28px);
-        @include highContrast-bgColor($ms-color-black, $ms-color-white);
-      }
-    }
-  }
-
-}
-
-// Disabled overrides
-.isDisabled {
-  .thumb {
-    background: $toggle-thumb-off-disabled-color;
-    @include highContrast-bgColor($ms-color-contrastBlackDisabled, $ms-color-contrastWhiteDisabled);
-  }
-
-  .background {
-    background: $toggle-background-off-color;
-    border: 1px solid $toggle-border-off-disabled-color;
-
-    @media screen and (-ms-high-contrast: active) {
-      border-color: $ms-color-contrastBlackDisabled;
-    }
-
-    @media screen and (-ms-high-contrast: black-on-white) {
-      border-color: $ms-color-contrastWhiteDisabled;
-    }
-  }
-
-  &.isChecked {
-    .background {
-      background: $toggle-background-on-disabled-color;
-      border: 1px solid transparent;
-      @include highContrast-bgColor($ms-color-contrastBlackDisabled, $ms-color-contrastWhiteDisabled);
-    }
-
-    .thumb {
-      background: $toggle-thumb-on-disabled-color;
-      @include ms-left(28px);
-      @include highContrast-bgColor($ms-color-black, $ms-color-white);
-    }
-  }
-}
-
-
-.innerContainer {
-  display: inline-block;
-  min-width: 45px;
-}
-
-:global(.ms-Fabric.is-focusVisible) .root.isEnabled .invisibleToggle:focus + .background .focus {
-  border: 1px solid $toggle-focusBorder-color;
-}
-
-.invisibleToggle {
-  position: absolute;
-  opacity: 0;
-  left: 0;
-  top: 0;
-  width: 100%;
-  height: 100%;
-  margin: 0;
-  padding: 0;
-}
-
-.slider {
-  position: relative;
-  min-height: 20px;
-}
-
-.background {
-  display: inline-block;
-  position: absolute;
-  width: 44px;
-  height: 20px;
-  box-sizing: border-box;
-  vertical-align: middle;
-  border-radius: 20px;
-  cursor: pointer;
-  transition: all 0.1s ease;
-  pointer-events: none;
-}
-
-.thumb {
-  position: absolute;
-  width: 10px;
-  height: 10px;
-  border-radius: 10px;
-  top: 4px;
-  @include ms-left(4px);
-  transition: all 0.1s ease;
-}
-
-.stateText {
-  display: inline-block;
-  vertical-align: top;
-  line-height: 20px;
-  @include margin-left(54px);
-  padding: 0;
-}
-
-.focus {
-  position: absolute;
-  left: -3px;
-  top: -3px;
-  right: -3px;
-  bottom: -3px;
-  box-sizing: border-box;
-  outline: transparent;
-}
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts
new file mode 100644
index 0000000000000..c2d630a3a39f3
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts
@@ -0,0 +1,120 @@
+import { IToggleStyles } from './Toggle.Props';
+import {
+  ITheme,
+  getTheme,
+  mergeStyleSets,
+  getFocusStyle
+} from '../../Styling';
+import { memoizeFunction } from '../../Utilities';
+
+export const getStyles = memoizeFunction((
+  theme: ITheme = getTheme(),
+  customStyles?: IToggleStyles
+): IToggleStyles => {
+  const { semanticColors } = theme;
+  const pillUncheckedBackground = semanticColors.bodyBackground;
+  const pillCheckedBackground = semanticColors.inputBackgroundSelected;
+  const pillCheckedHoveredBackground = semanticColors.inputBackgroundSelectedHovered;
+  const pillCheckedDisabledBackground = semanticColors.disabledText;
+  const thumbBackground = semanticColors.inputBorderHovered;
+  const thumbCheckedBackground = semanticColors.inputForegroundSelected;
+  const thumbDisabledBackground = semanticColors.disabledText;
+  const thumbCheckedDisabledBackground = semanticColors.disabledBackground;
+  const pillBorderColor = semanticColors.inputBorder;
+  const pillBorderHoveredColor = semanticColors.inputBorderHovered;
+  const pillBorderDisabledColor = semanticColors.disabledText;
+  const toggleFocusBorderColor = semanticColors.focusBorder;
+
+  const styles: IToggleStyles = {
+    root: {
+      marginBottom: '8px'
+    },
+
+    container: [
+      {
+        display: 'inline-flex',
+        position: 'relative',
+      }
+    ],
+
+    pill: [
+      getFocusStyle(theme, '-1px'),
+      {
+        fontSize: '20px',
+        lineHeight: '1em',
+        boxSizing: 'border-box',
+        position: 'relative',
+        width: '2.2em',
+        height: '1em',
+        borderRadius: '1em',
+        transition: 'all 0.1s ease',
+        borderWidth: '1px',
+        borderStyle: 'solid',
+        background: pillUncheckedBackground,
+        borderColor: pillBorderColor,
+      }
+    ],
+
+    pillHovered: {
+      borderColor: pillBorderHoveredColor
+    },
+
+    pillChecked: {
+      background: pillCheckedBackground,
+      borderColor: 'transparent',
+    },
+
+    pillCheckedHovered: {
+      backgroundColor: pillCheckedHoveredBackground,
+      borderColor: 'transparent'
+    },
+
+    pillDisabled: {
+      borderColor: pillBorderDisabledColor
+    },
+
+    pillCheckedDisabled: {
+      backgroundColor: pillCheckedDisabledBackground,
+      borderColor: 'transparent'
+    },
+
+    thumb: {
+      width: '.5em',
+      height: '.5em',
+      borderRadius: '.5em',
+      position: 'absolute',
+      top: '.2em',
+      transition: 'all 0.1s ease',
+      backgroundColor: thumbBackground,
+      left: '.2em'
+    },
+
+    thumbChecked: {
+      backgroundColor: thumbCheckedBackground,
+      left: '1.4em'
+    },
+
+    thumbDisabled: {
+      backgroundColor: thumbDisabledBackground,
+      left: '.2em',
+    },
+
+    thumbCheckedDisabled: {
+      backgroundColor: thumbCheckedDisabledBackground,
+      left: '1.4em'
+    },
+
+    text: {
+      // Workaround; until Label is converted and we can pass in custom styles, we need to make this
+      // more specific. Once Label is converted, we should be able to just pull in the customized styling.
+      '.ms-Toggle-stateText': {
+        padding: '0',
+        margin: '0 10px',
+        userSelect: 'none'
+      }
+    }
+
+  };
+
+  return mergeStyleSets(styles, customStyles);
+});
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
index 2846e57b11595..6ee1c52d5bc2f 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
@@ -35,7 +35,7 @@ describe('Toggle', () => {
       />
     );
     let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
-    let button = renderedDOM.querySelector('input');
+    let button = renderedDOM.querySelector('button');
 
     ReactTestUtils.Simulate.click(button);
     expect(isToggledValue).to.equal(true);
@@ -50,7 +50,7 @@ describe('Toggle', () => {
       />
     );
     let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
-    let button = renderedDOM.querySelector('input');
+    let button = renderedDOM.querySelector('button');
 
     ReactTestUtils.Simulate.click(button);
 
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
index 595968254d47e..3c4ee0b7cbca7 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
@@ -1,26 +1,41 @@
 import * as React from 'react';
 import {
   BaseComponent,
-  KeyCodes,
   autobind,
-  css,
   getId,
   inputProperties,
-  getNativeProps
+  getNativeProps,
+  memoize
 } from '../../Utilities';
-import { IToggleProps, IToggle } from './Toggle.Props';
+import {
+  IToggleProps,
+  IToggle,
+  IToggleStyles
+} from './Toggle.Props';
 import { Label } from '../../Label';
-import * as stylesImport from './Toggle.scss';
-const styles: any = stylesImport;
+import {
+  mergeStyles
+} from '../../Styling';
+
+import { getStyles } from './Toggle.styles';
 
 export interface IToggleState {
   isChecked: boolean;
 }
 
+interface IToggleClassNames {
+  root: string;
+  label: string;
+  container: string;
+  pill: string;
+  thumb: string;
+  text: string;
+}
+
 export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements IToggle {
 
   private _id: string;
-  private _toggleInput: HTMLInputElement;
+  private _toggleButton: HTMLButtonElement;
 
   constructor(props: IToggleProps) {
     super();
@@ -57,68 +72,66 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
     // In the future when more screenreaders support aria-pressed it would be a good idea to change this control back to using it as it is
     // more semantically correct.
 
-    let { label, onAriaLabel, offAriaLabel, onText, offText, className, disabled } = this.props;
+    let {
+      className,
+      styles: customStyles,
+      disabled,
+      label,
+      offAriaLabel,
+      offText,
+      onAriaLabel,
+      onText
+      } = this.props;
     let { isChecked } = this.state;
     let stateText = isChecked ? onText : offText;
     const ariaLabel = isChecked ? onAriaLabel : offAriaLabel;
     const toggleNativeProps = getNativeProps(this.props, inputProperties, ['defaultChecked']);
+    const classNames = this._getClassNames(
+      getStyles(undefined, customStyles),
+      className,
+      disabled,
+      isChecked
+    );
+
     return (
-      <div className={
-        css(
-          styles.root,
-          'ms-Toggle',
-          className,
-          {
-            'is-checked': isChecked,
-            'is-enabled': !disabled,
-            'is-disabled': disabled,
-            [styles.isChecked]: isChecked,
-            [styles.isEnabled]: !disabled,
-            [styles.isDisabled]: disabled,
-          }
-        ) }>
-        <div className={ css(styles.innerContainer, 'ms-Toggle-innerContainer') }>
-          { label && (
-            <Label className='ms-Toggle-label' htmlFor={ this._id }>{ label }</Label>
+      <div className={ classNames.root }>
+
+        { label && (
+          <Label htmlFor={ this._id } className={ classNames.label }>{ label }</Label>
+        ) }
+
+        <div className={ classNames.container } >
+          <button
+            { ...toggleNativeProps }
+            className={ classNames.pill }
+            ref={ (c): HTMLButtonElement => this._toggleButton = c }
+            aria-disabled={ disabled }
+            aria-pressed={ isChecked }
+            id={ this._id }
+            onChange={ () => { /* no-op */ } }
+            disabled={ disabled }
+            data-is-focusable={ true }
+            onClick={ this._onClick }
+          >
+            <div className={ classNames.thumb } />
+          </button>
+          { stateText && (
+            <Label className={ classNames.text }>{ stateText }</Label>
           ) }
-          <div className={ css(styles.slider, 'ms-Toggle-slider') }>
-            <input
-              key='invisibleToggle'
-              ref={ (c): HTMLInputElement => this._toggleInput = c }
-              type='checkbox'
-              id={ this._id }
-              onChange={ () => { /* no-op */ } }
-              { ...toggleNativeProps }
-              className={ styles.invisibleToggle }
-              name={ this._id }
-              disabled={ disabled }
-              checked={ isChecked }
-              aria-label={ ariaLabel }
-              onClick={ this._onClick }
-              onKeyDown={ this._onInputKeyDown }
-            />
-            <div className={ css(styles.background, 'ms-Toggle-background') }>
-              <div className={ css(styles.focus, 'ms-Toggle-focus') } />
-              <div className={ css(styles.thumb, 'ms-Toggle-thumb') } />
-            </div>
-            { stateText && (
-              <Label className={ css(styles.stateText, 'ms-Toggle-stateText') }>{ stateText }</Label>
-            ) }
-          </div>
         </div>
-      </div>
+      </div >
     );
   }
 
   public focus() {
-    if (this._toggleInput) {
-      this._toggleInput.focus();
+    if (this._toggleButton) {
+      this._toggleButton.focus();
     }
   }
 
   @autobind
-  private _onClick() {
-    let { checked, onChanged } = this.props;
+  private _onClick(ev: React.MouseEvent<HTMLElement>) {
+    let { checked, onChanged, onClick } = this.props;
     let { isChecked } = this.state;
 
     // Only update the state if the user hasn't provided it.
@@ -131,17 +144,78 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
     if (onChanged) {
       onChanged(!isChecked);
     }
-  }
 
-  @autobind
-  private _onInputKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
-    switch (ev.which) {
-      case KeyCodes.enter:
-        // Also support toggling via the enter key.
-        // While toggling via the space bar is technically correct for a checkbox, this control looks more like a button to sighted users.
-        this._onClick();
-
-        break;
+    if (onClick) {
+      onClick(ev);
     }
   }
+
+  @memoize
+  private _getClassNames(
+    styles: IToggleStyles,
+    className: string,
+    disabled: boolean,
+    isChecked: boolean
+    ): IToggleClassNames {
+
+    return {
+      root: mergeStyles(
+        'ms-Toggle',
+        isChecked && 'is-checked',
+        !disabled && 'is-enabled',
+        disabled && 'is-disabled',
+        className,
+        styles.root
+      ) as string,
+
+      label: mergeStyles(
+        'ms-Toggle-label',
+        styles.label
+      ) as string,
+
+      container: mergeStyles(
+        'ms-Toggle-innerContainer',
+        styles.container
+      ) as string,
+
+      pill: mergeStyles(
+        'ms-Toggle-background',
+        styles.pill,
+        !disabled && [
+          !isChecked && {
+            ':hover': styles.pillHovered,
+            ':hover .ms-Toggle-thumb': styles.thumbHovered
+          },
+          isChecked && [
+            styles.pillChecked,
+            {
+              ':hover': styles.pillCheckedHovered,
+              ':hover .ms-Toggle-thumb': styles.thumbCheckedHovered
+            }
+          ]
+        ],
+        disabled && [
+          !isChecked && styles.pillDisabled,
+          isChecked && styles.pillCheckedDisabled,
+        ]
+      ) as string,
+
+      thumb: mergeStyles(
+        'ms-Toggle-thumb',
+        styles.thumb,
+        !disabled && isChecked && styles.thumbChecked,
+        disabled && [
+          !isChecked && styles.thumbDisabled,
+          isChecked && styles.thumbCheckedDisabled
+        ]
+      ) as string,
+
+      text: mergeStyles(
+        'ms-Toggle-stateText',
+        styles.text
+      ) as string,
+
+    };
+  };
+
 }
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
index dd9bba1f7d3c7..6be030a3240b7 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
@@ -6,6 +6,7 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { ToggleBasicExample } from './examples/Toggle.Basic.Example';
+import { FontClassNames } from '../../Styling';
 
 const ToggleBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Toggle/examples/Toggle.Basic.Example.tsx') as string;
 
@@ -33,7 +34,7 @@ export class TogglePage extends React.Component<IComponentDemoPageProps, {}> {
               Toggles represent a physical switch that allows users to turn things on or off. Use Toggles to present users with two mutually exclusive options (like on/off), where choosing an option results in an immediate action. Use a Toggle for binary operations that take effect right after the user flips the Toggle. For example, use a Toggle to turn services or hardware components on or off. In other words, if a physical switch would work for the action, a Toggle is probably the best control to use.
             </p>
 
-            <h2 className='ms-font-xl'>Choosing between Toggle and Checkbox</h2>
+            <h2 className={ FontClassNames.xLarge }>Choosing between Toggle and Checkbox</h2>
 
             <p>
               For some actions, either a Toggle or a Checkbox might work. To decide which control would work better, follow these tips:
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/examples/Toggle.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Toggle/examples/Toggle.Basic.Example.tsx
index a8b39ab0958a5..339881ba480cc 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/examples/Toggle.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/examples/Toggle.Basic.Example.tsx
@@ -4,7 +4,7 @@ import * as React from 'react';
 import { Toggle } from 'office-ui-fabric-react/lib/Toggle';
 
 export const ToggleBasicExample = () => (
-  <div>
+  <div style={ { padding: '2px' } }>
     <Toggle
       defaultChecked={ true }
       label='Enabled and checked'
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
index 9ebd980709d09..1c62b89be24c8 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
@@ -12,6 +12,7 @@ import { Callout } from '../../Callout';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import * as stylesImport from './Tooltip.scss';
 const styles: any = stylesImport;
+import { AnimationClassNames } from '../../Styling';
 
 export class Tooltip extends BaseComponent<ITooltipProps, any> {
 
@@ -41,9 +42,13 @@ export class Tooltip extends BaseComponent<ITooltipProps, any> {
 
     return (
       <Callout
-        className={ css('ms-Tooltip ms-fadeIn200', styles.root, {
-          [styles.hasMediumDelay]: delay === TooltipDelay.medium
-        }) }
+        className={ css(
+          'ms-Tooltip',
+          AnimationClassNames.fadeIn200,
+          styles.root, {
+            [styles.hasMediumDelay]: delay === TooltipDelay.medium
+          }
+        ) }
         targetElement={ targetElement }
         directionalHint={ directionalHint }
         {...calloutProps}
diff --git a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx
index 69ca9cde022d6..f7484731a7d6b 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx
@@ -2,6 +2,7 @@
 import * as React from 'react';
 /* tslint:enable */
 import { css } from '../../../Utilities';
+import { Icon } from '../../../Icon';
 import { IPickerItemProps } from '../PickerItem.Props';
 import { ITag } from './TagPicker';
 import * as stylesImport from './TagItem.scss';
@@ -18,7 +19,7 @@ export const TagItem = (props: IPickerItemProps<ITag>) => (
     data-is-focusable={ true }>
     <span className={ css('ms-TagItem-text', styles.tagItemText) }>{ props.children }</span>
     <span className={ css('ms-TagItem-close', styles.tagItemClose) } onClick={ props.onRemoveItem }>
-      <i className=' ms-Icon ms-Icon--Cancel' />
+      <Icon iconName='cancel' />
     </span>
   </div>
 );
diff --git a/packages/office-ui-fabric-react/src/index.ts b/packages/office-ui-fabric-react/src/index.ts
index c96aa1d436290..2cfe405cb6c25 100644
--- a/packages/office-ui-fabric-react/src/index.ts
+++ b/packages/office-ui-fabric-react/src/index.ts
@@ -41,8 +41,9 @@ export * from './Rating';
 export * from './SearchBox';
 export * from './Slider';
 export * from './Spinner';
+export * from './Styling';
 export * from './TeachingBubble';
 export * from './TextField';
 export * from './Toggle';
 export * from './Tooltip';
-export * from './Utilities';
+export * from './Utilities';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx b/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx
index 52f7b7dc5bb60..bbcb39e06d28c 100644
--- a/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx
@@ -31,7 +31,11 @@ export function withContainsFocus<P extends { containsFocus?: boolean }, S>(Comp
 
       return (
         <div ref='root' onFocus={ this._handleFocus.bind(this) } onBlur={ this._handleBlur.bind(this) }>
-          <ComposedComponent ref={ this._updateComposedComponentRef } containsFocus={ containsFocus } { ...this.props as any } />
+          <ComposedComponent
+            ref={ this._updateComposedComponentRef }
+            containsFocus={ containsFocus }
+            { ...this.props as any }
+          />
         </div>
       );
     }
diff --git a/packages/office-ui-fabric-react/webpack.serve.config.js b/packages/office-ui-fabric-react/webpack.serve.config.js
index 313b1449ba033..9d2f49739be82 100644
--- a/packages/office-ui-fabric-react/webpack.serve.config.js
+++ b/packages/office-ui-fabric-react/webpack.serve.config.js
@@ -1,4 +1,5 @@
 let path = require('path');
+let webpack = require('webpack');
 let WebpackNotifierPlugin = require('webpack-notifier');
 
 const PACKAGE_NAME = require('./package.json').name;
@@ -81,6 +82,9 @@ module.exports = {
   },
 
   plugins: [
+    new webpack.DefinePlugin({
+      'process.env.NODE_ENV': JSON.stringify('production')
+    }),
     new WebpackNotifierPlugin()
   ]
 }
diff --git a/packages/styling/gulpfile.js b/packages/styling/gulpfile.js
index 2c69875f9134e..aa84b07cb5d21 100644
--- a/packages/styling/gulpfile.js
+++ b/packages/styling/gulpfile.js
@@ -26,4 +26,3 @@ build.preCopy.isEnabled = () => false;
 
 // Until typings work.
 build.apiExtractor.isEnabled = () => false;
-
diff --git a/packages/styling/package.json b/packages/styling/package.json
index b05060116d0cf..24ba4ce2f6d2f 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -24,6 +24,7 @@
     "chai": "^3.5.0",
     "enzyme": "^2.7.0",
     "es6-promise": "4.1.0",
+    "es6-weak-map": "^2.0.2",
     "gulp": "~3.9.1",
     "mocha": "^3.2.0",
     "mocha-loader": "^1.1.1",
diff --git a/packages/styling/src/common/tests.js b/packages/styling/src/common/tests.js
new file mode 100644
index 0000000000000..3a716c9dd52da
--- /dev/null
+++ b/packages/styling/src/common/tests.js
@@ -0,0 +1,18 @@
+'use strict';
+
+// Polyfills
+require('es6-weak-map/implement');
+
+/**
+ * This is a test entry point to help karma-webpack find all tests in the project.
+ **/
+
+// Before loading modules, treat errors and warnings as test failures.
+console.error = console.warn = function (warning) {
+  throw new Error(warning);
+}
+
+var context = require.context('..', true, /.+\.test\.js?$/);
+
+context.keys().forEach(context);
+module.exports = context;
\ No newline at end of file
diff --git a/packages/styling/src/glamorExports.ts b/packages/styling/src/glamorExports.ts
index e39b4f10e402b..978d6cfa95015 100644
--- a/packages/styling/src/glamorExports.ts
+++ b/packages/styling/src/glamorExports.ts
@@ -9,7 +9,8 @@ interface IGlamorRulePair {
 }
 
 // force speedy.
-// Glamor['speedy'](true);
+// tslint:disable-next-line:no-string-literal
+Glamor['speedy'](true);
 
 // tslint:disable-next-line:no-string-literal
 Glamor['plugins'].add(
diff --git a/packages/styling/src/interfaces/IPalette.ts b/packages/styling/src/interfaces/IPalette.ts
index fa73d28a730b8..73dc4e77fc4a2 100644
--- a/packages/styling/src/interfaces/IPalette.ts
+++ b/packages/styling/src/interfaces/IPalette.ts
@@ -77,11 +77,6 @@ export interface IPalette {
    */
   neutralSecondary?: string;
 
-  /**
-   * Color code for neutralSecondaryAlt.
-   */
-  neutralSecondaryAlt?: string;
-
   /**
    * Color code for neutralTertiary.
    */
diff --git a/packages/styling/src/interfaces/ISemanticColors.ts b/packages/styling/src/interfaces/ISemanticColors.ts
new file mode 100644
index 0000000000000..8695b135e71da
--- /dev/null
+++ b/packages/styling/src/interfaces/ISemanticColors.ts
@@ -0,0 +1,31 @@
+/**
+ * The collection of semantic slots for colors used in themes.
+ * See documentation [todo]
+ */
+export interface ISemanticColors {
+  /**
+   * ANY ADDITIONS/REMOVALS HERE MUST ALSO BE MADE TO \packages\styling\src\utilities\theme.ts:_makeSemanticColorsFromPalette()
+   */
+
+  // Base slots defining universal colors
+  bodyBackground?: string;
+  bodyText?: string;
+  bodySubtext?: string;
+
+  disabledBackground?: string;
+  disabledText?: string;
+  disabledSubtext?: string;
+
+  focusBorder?: string;
+
+  // Invariants - slots that rarely change color theme-to-theme because the color has meaning
+  errorBackground?: string;
+  errorText?: string;
+
+  // Input controls slots (text fields, checkboxes, radios...)
+  inputBorder?: string;
+  inputBorderHovered?: string;
+  inputBackgroundSelected?: string;
+  inputBackgroundSelectedHovered?: string;
+  inputForegroundSelected?: string;
+}
\ No newline at end of file
diff --git a/packages/styling/src/interfaces/IStyle.ts b/packages/styling/src/interfaces/IStyle.ts
index 2c0e150a62c06..86f57812b8c69 100644
--- a/packages/styling/src/interfaces/IStyle.ts
+++ b/packages/styling/src/interfaces/IStyle.ts
@@ -1,7 +1,8 @@
 import { IProcessedStyle } from './IProcessedStyle';
+import { IRawStyle } from './IRawStyle';
 
 /**
- * A style entry which can be represented as a string class name, a raw style object, or a processed style
+ * A style entry which can be represented as a string class name or a processed style
  * object. This is the type returned from mergeStyles utility.
  */
-export type IStyle = string | IProcessedStyle;
+export type IStyle = IRawStyle | IProcessedStyle | (IRawStyle | IProcessedStyle)[];
diff --git a/packages/styling/src/interfaces/index.ts b/packages/styling/src/interfaces/index.ts
index 95f9a01bdda57..6dbc8c420ce68 100644
--- a/packages/styling/src/interfaces/index.ts
+++ b/packages/styling/src/interfaces/index.ts
@@ -3,4 +3,5 @@ export { IRawStyle } from './IRawStyle';
 export { IStyle } from './IStyle';
 export { IAnimationStyles } from './IAnimationStyles';
 export { IPalette } from './IPalette';
+export { ISemanticColors } from './ISemanticColors';
 export { IFontStyles } from './IFontStyles';
diff --git a/packages/styling/src/styles/DefaultFontStyles.ts b/packages/styling/src/styles/DefaultFontStyles.ts
index bf8e88b440bb2..69a296e143e20 100644
--- a/packages/styling/src/styles/DefaultFontStyles.ts
+++ b/packages/styling/src/styles/DefaultFontStyles.ts
@@ -1,12 +1,72 @@
 import { IFontStyles, IRawStyle } from '../interfaces/index';
 import { fontFace } from '../glamorExports';
+import {
+  getLanguage
+} from '@uifabric/utilities/lib/index';
 
-const FONT_BASE_URL = 'https://static2.sharepointonline.com/files/fabric/assets/fonts/segoeui-westeuropean';
-const ICON_BASE_URL = 'https://static2.sharepointonline.com/files/fabric/assets/icons';
+// Default urls.
+const DefaultFontUrl = 'https://static2.sharepointonline.com/files/fabric/assets/fonts';
+const DefaultIconUrl = 'https://static2.sharepointonline.com/files/fabric/assets/icons';
 
-const SYSTEM_BASE = '"Segoe UI", -apple-system, BlinkMacSystemFont, "Roboto", "Helvetica Neue", sans-serif';
-const FAMILY_BASE = '"Segoe UI WestEuropean", ' + SYSTEM_BASE;
+// Fallback fonts, if specified system or web fonts are unavailable.
+const FontFamilyFallbacks = `-apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif`;
 
+// Font face names to be registered.
+const FontNameArabic = 'Segoe UI Web (Arabic)';
+const FontNameCyrillic = 'Segoe UI Web (Cyrillic)';
+const FontNameEastEuropean = 'Segoe UI Web (East European)';
+const FontNameGreek = 'Segoe UI Web (Greek)';
+const FontNameHebrew = 'Segoe UI Web (Hebrew)';
+const FontNameThai = 'Leelawadee UI Web';
+const FontNameVietnamese = 'Segoe UI Web (Vietnamese)';
+const FontNameWestEuropean = 'Segoe UI Web (West European)';
+const FontNameSelawik = 'Selawik Web';
+
+// Font families with fallbacks, for the general regions.
+const FontFamilyArabic = `'${FontNameArabic}'`;
+const FontFamilyChineseSimplified = `'Microsoft Yahei', Verdana, Simsun`;
+const FontFamilyChineseTraditional = `'Microsoft Jhenghei', Pmingliu`;
+const FontFamilyCyrillic = `'${FontNameCyrillic}'`;
+const FontFamilyEastEuropean = `'${FontNameEastEuropean}'`;
+const FontFamilyGreek = `'${FontNameGreek}'`;
+const FontFamilyHebrew = `'${FontNameHebrew}'`;
+const FontFamilyHindi = `'Nirmala UI'`;
+const FontFamilyJapanese = `'Yu Gothic', 'Meiryo UI', Meiryo, 'MS Pgothic', Osaka`;
+const FontFamilyKorean = `'Malgun Gothic', Gulim`;
+const FontFamilySelawik = `'${FontNameSelawik}'`;
+const FontFamilyThai = `'Leelawadee UI Web', 'Kmer UI'`;
+const FontFamilyVietnamese = `'${FontNameVietnamese}'`;
+const FontFamilyWestEuropean = `'${FontNameWestEuropean}'`;
+
+// Mapping of language prefix to to font family.
+const LanguageToFontMap = {
+  'ar': FontFamilyArabic,
+  'bg': FontFamilyCyrillic,
+  'cs': FontFamilyEastEuropean,
+  'el': FontFamilyGreek,
+  'et': FontFamilyEastEuropean,
+  'he': FontFamilyHebrew,
+  'hi': FontFamilyHindi,
+  'hr': FontFamilyEastEuropean,
+  'hu': FontFamilyEastEuropean,
+  'ja': FontFamilyJapanese,
+  'kk': FontFamilyEastEuropean,
+  'ko': FontFamilyKorean,
+  'lt': FontFamilyEastEuropean,
+  'lv': FontFamilyEastEuropean,
+  'pl': FontFamilyEastEuropean,
+  'ru': FontFamilyCyrillic,
+  'sk': FontFamilyEastEuropean,
+  'sr-latn': FontFamilyEastEuropean,
+  'th': FontFamilyThai,
+  'tr': FontFamilyEastEuropean,
+  'uk': FontFamilyCyrillic,
+  'vi': FontFamilyVietnamese,
+  'zh-hans': FontFamilyChineseSimplified,
+  'zh-hant': FontFamilyChineseTraditional,
+};
+
+// Standard font sizes.
 export namespace FontSizes {
   export const mini = '10px';
   export const xSmall = '11px';
@@ -22,6 +82,7 @@ export namespace FontSizes {
   export const mega = '72px';
 }
 
+// Standard font weights.
 export namespace FontWeights {
   export const light = 100;
   export const semilight = 300;
@@ -30,6 +91,7 @@ export namespace FontWeights {
   export const bold = 700;
 }
 
+// Standard font styling.
 export const DefaultFontStyles: IFontStyles = {
   tiny: _createFont(FontSizes.mini, FontWeights.semibold),
   xSmall: _createFont(FontSizes.xSmall, FontWeights.regular),
@@ -49,10 +111,26 @@ export const DefaultFontStyles: IFontStyles = {
   }
 };
 
+function _getFontFamily(): string {
+  let language = getLanguage();
+  let fontFamily = FontFamilyWestEuropean;
+
+  for (let lang in LanguageToFontMap) {
+    if (LanguageToFontMap.hasOwnProperty(lang) && lang.indexOf(language) === 0) {
+      fontFamily = LanguageToFontMap[lang];
+      break;
+    }
+  }
+
+  return `${fontFamily}, ${FontFamilyFallbacks}`;
+}
+
 function _createFont(size: string, weight: number): IRawStyle {
   return {
-    fontFamily: FAMILY_BASE,
-    WebkitFontSmoothing: 'antialiased',
+    fontFamily: _getFontFamily(),
+    '-moz-osx-font-smoothing': 'grayscale',
+    '-ms-high-contrast-adjust': 'none',
+    '-webkit-font-smoothing': 'antialiased',
     fontSize: size,
     fontWeight: weight
   };
@@ -60,71 +138,55 @@ function _createFont(size: string, weight: number): IRawStyle {
 
 function _registerFontFace(
   fontFamily: string,
-  fontName: string,
-  baseUrl: string,
-  fontFileName: string,
-  fontWeight: number
+  url: string,
+  fontWeight?: number
 ): void {
+  fontFamily = `'${fontFamily}'`;
+
   fontFace({
     fontFamily,
     src:
-    `local('${fontName}'),` +
-    `url('${baseUrl}/${fontFileName}.woff2') format('woff2'),` +
-    `url('${baseUrl}/${fontFileName}.woff') format('woff'),` +
-    `url('${baseUrl}/${fontFileName}.ttf') format('truetype')`,
+    `url('${url}.woff2') format('woff2'),` +
+    `url('${url}.woff') format('woff')`,
     fontWeight,
     fontStyle: 'normal'
   });
 }
 
-[
-  'Arabic',
-  'Cyrillic',
-  'EastEuropean',
-  'Greek',
-  'Hebrew',
-  'Vietnamese',
-  'WestEuropean'
-].forEach((language: string) => {
-
-  _registerFontFace(
-    `'Segoe UI${language ? ' ' + language : ''}'`,
-    'Segoe UI Light',
-    FONT_BASE_URL,
-    'segoeui-light',
-    FontWeights.light
-  );
-
-  _registerFontFace(
-    `'Segoe UI${language ? ' ' + language : ''}'`,
-    'Segoe UI Semilight',
-    FONT_BASE_URL,
-    'segoeui-semilight',
-    200
-  );
-
-  _registerFontFace(
-    `'Segoe UI${language ? ' ' + language : ''}'`,
-    'Segoe UI',
-    FONT_BASE_URL,
-    'segoeui-regular',
-    FontWeights.regular
-  );
-
-  _registerFontFace(
-    `'Segoe UI${language ? ' ' + language : ''}'`,
-    'Segoe UI Semibold',
-    FONT_BASE_URL,
-    'segoeui-semibold',
-    FontWeights.semibold
-  );
-});
-
-// Icon font
-_registerFontFace(
-  'FabricMDL2Icons',
-  'FabricMDL2Icons',
-  ICON_BASE_URL,
-  'fabricmdl2icons',
-  FontWeights.regular
-);
+function _registerFontFaceSet(
+  fontFamily: string,
+  cdnFolder: string,
+  cdnFontName: string = 'segoeui'
+): void {
+  const urlBase = `${DefaultFontUrl}/${cdnFolder}/${cdnFontName}`;
+
+  _registerFontFace(fontFamily, urlBase + '-light', FontWeights.light);
+  _registerFontFace(fontFamily, urlBase + '-semilight', FontWeights.semilight);
+  _registerFontFace(fontFamily, urlBase + '-regular', FontWeights.regular);
+  _registerFontFace(fontFamily, urlBase + '-semibold', FontWeights.semibold);
+}
+
+function _registerDefaultFontFaces(): void {
+  // Produce @font-face definitions for all supported web fonts.
+  _registerFontFaceSet(FontNameThai, 'leelawadeeui-thai', 'leelawadeeui');
+  _registerFontFaceSet(FontNameArabic, 'segoeui-arabic');
+  _registerFontFaceSet(FontNameCyrillic, 'segoeui-cyrillic');
+  _registerFontFaceSet(FontNameEastEuropean, 'segoeui-easteuropean');
+  _registerFontFaceSet(FontNameGreek, 'segoeui-greek');
+  _registerFontFaceSet(FontNameHebrew, 'segoeui-hebrew');
+  _registerFontFaceSet(FontNameVietnamese, 'segoeui-vietnamese');
+  _registerFontFaceSet(FontNameWestEuropean, 'segoeui-westeuropean');
+  _registerFontFaceSet(FontFamilySelawik, 'selawik', 'selawik');
+
+  // Leelawadee UI (Thai) does not have a 'light' weight, so we override
+  // the font-face generated above to use the 'semilight' weight instead.
+  _registerFontFace('Leelawadee UI Web', `${DefaultFontUrl}/leelawadeeui-thai/leelawadeeui-semilight`, FontWeights.light);
+
+  // Leelawadee UI (Thai) does not have a 'semibold' weight, so we override
+  // the font-face generated above to use the 'bold' weight instead.
+  _registerFontFace('Leelawadee UI Web', `${DefaultFontUrl}/leelawadeeui-thai/leelawadeeui-bold`, FontWeights.semibold);
+
+  _registerFontFace('FabricMDL2Icons', DefaultIconUrl + '/fabricmdl2icons', FontWeights.regular);
+}
+
+_registerDefaultFontFaces();
\ No newline at end of file
diff --git a/packages/styling/src/styles/DefaultPalette.ts b/packages/styling/src/styles/DefaultPalette.ts
index 6609542e9754a..68adf43165d02 100644
--- a/packages/styling/src/styles/DefaultPalette.ts
+++ b/packages/styling/src/styles/DefaultPalette.ts
@@ -16,7 +16,6 @@ export const DefaultPalette: IPalette = {
   neutralPrimary: '#333333',
   neutralPrimaryAlt: '#3c3c3c',
   neutralSecondary: '#666666',
-  neutralSecondaryAlt: '#767676',
   neutralTertiary: '#a6a6a6',
   neutralTertiaryAlt: '#c8c8c8',
   neutralQuaternary: '#d0d0d0',
diff --git a/packages/styling/src/styles/IconCodes.ts b/packages/styling/src/styles/IconCodes.ts
index 3dceecc066f87..1461a370e495b 100644
--- a/packages/styling/src/styles/IconCodes.ts
+++ b/packages/styling/src/styles/IconCodes.ts
@@ -682,7 +682,7 @@ export const IconCodes = {
   /**
    * Icon code with the value '\uE942'.
    */
-  compassNw: '\uE942',
+  compassNW: '\uE942',
   /**
    * Icon code with the value '\uE930'.
    */
diff --git a/packages/styling/src/utilities/mergeStyleSets.ts b/packages/styling/src/utilities/mergeStyleSets.ts
index 4e7513bcc5ea3..402fd710d0344 100644
--- a/packages/styling/src/utilities/mergeStyleSets.ts
+++ b/packages/styling/src/utilities/mergeStyleSets.ts
@@ -1,21 +1,24 @@
 import { mergeStyles } from './mergeStyles';
 
+/**
+ * Merges a give set of styles by running mergeStyles for each unique key. Works
+ * like Object.assign in that it layers them in the argument order specified, but will
+ * not mutate them and will return the merged result.
+ */
 export function mergeStyleSets<T>(...args: T[]): T {
   const mergedRules: T = {} as T;
-  let ruleToMerge: Object = args[0];
+  const setStyles = {};
 
-  for (let prop in ruleToMerge) {
-    if (ruleToMerge.hasOwnProperty(prop)) {
-      let allArgs: Object[] = [];
-      for (let i = 0; i < args.length; i++) {
-        let currentArg: Object = args[i];
-
-        if (currentArg && currentArg[prop]) {
-          allArgs.push(currentArg[prop]);
-        }
-      }
-      mergedRules[prop] = mergeStyles(...allArgs);
+  args.forEach((arg: T) => arg && Object.keys(arg).forEach((key: string) => {
+    if (!setStyles[key]) {
+      setStyles[key] = [];
     }
-  }
+    setStyles[key].push(arg[key]);
+  }));
+
+  Object.keys(setStyles).forEach((key: string) => {
+    mergedRules[key] = mergeStyles(setStyles[key]);
+  });
+
   return mergedRules;
 }
diff --git a/packages/styling/src/utilities/mergeStyles.ts b/packages/styling/src/utilities/mergeStyles.ts
index bd4715df8b08a..869648ac51e6c 100644
--- a/packages/styling/src/utilities/mergeStyles.ts
+++ b/packages/styling/src/utilities/mergeStyles.ts
@@ -1,20 +1,37 @@
 import { css, Rule } from 'glamor';
-import { IStyle, IRawStyle } from '../interfaces/index';
+import { IStyle, IProcessedStyle } from '../interfaces/index';
 
-export function mergeStyles(...args: (IStyle | IRawStyle)[]): IStyle {
+/**
+ * Takes a collection of collection of styles, defined in various formats, and compresses them into
+ * a single thing of one format to return.
+ * If any class names (strings) are passed in, it will return a list of space-separated class names,
+ * using glamor to generate a class name for all passed in style objects.
+ * Otherwise, all style objects passed in will be compressed into a single IProcessedStyle.
+ *
+ * @export
+ * @param {(...(IStyle | string)[])} args
+ * @returns {IStyle}
+ */
+export function mergeStyles(...args: (IStyle | string)[]): IProcessedStyle | string {
   const classes: string[] = [];
   const rules: Rule[] = [];
 
-  for (const arg of args) {
-    if (arg) {
-      if (typeof arg === 'string') {
-        classes.push(arg);
-      } else {
-        rules.push(arg as Rule);
+  function _parseArgs(theArgs: (IStyle | string)[]): void {
+    for (const arg of theArgs) {
+      if (arg) {
+        if (typeof arg === 'string') {
+          classes.push(arg);
+        } else if (Array.isArray(arg)) {
+          _parseArgs(arg);
+        } else {
+          rules.push(arg as Rule);
+        }
       }
     }
   }
 
+  _parseArgs(args);
+
   const rulesObject: IStyle = rules.length ? css(...rules) : null;
 
   if (classes.length) {
diff --git a/packages/styling/src/utilities/theme.ts b/packages/styling/src/utilities/theme.ts
index 9bf7885a150fe..a3f10c53f6edd 100644
--- a/packages/styling/src/utilities/theme.ts
+++ b/packages/styling/src/utilities/theme.ts
@@ -1,7 +1,8 @@
 import * as assign from 'object-assign';
 import {
   IPalette,
-  IFontStyles
+  IFontStyles,
+  ISemanticColors
 } from '../interfaces/index';
 import {
   DefaultPalette,
@@ -11,10 +12,12 @@ import {
 export interface ITheme {
   palette: IPalette;
   fonts: IFontStyles;
+  semanticColors: ISemanticColors;
 }
 
 const _theme: ITheme = {
   palette: DefaultPalette,
+  semanticColors: _makeSemanticColorsFromPalette(DefaultPalette),
   fonts: DefaultFontStyles
 };
 
@@ -30,5 +33,31 @@ export function getTheme(): ITheme {
  */
 export function loadTheme(theme: ITheme): void {
   _theme.palette = assign({}, _theme.palette, theme.palette);
+  _theme.semanticColors = assign({}, _makeSemanticColorsFromPalette(_theme.palette), theme.semanticColors);
   _theme.fonts = assign({}, _theme.fonts, theme.fonts);
 }
+
+// Generates all the semantic slot colors based on the Fabric palette.
+// We'll use these as fallbacks for semantic slots that the passed in theme did not define.
+function _makeSemanticColorsFromPalette(p: IPalette): ISemanticColors {
+  return {
+    bodyBackground: p.white,
+    bodyText: p.neutralPrimary,
+    bodySubtext: p.neutralSecondary,
+
+    disabledBackground: p.neutralLighter,
+    disabledText: p.neutralTertiaryAlt,
+    disabledSubtext: p.neutralQuaternary,
+
+    focusBorder: p.black,
+
+    // errorBackground: todo,
+    errorText: p.redDark,
+
+    inputBorder: p.neutralTertiary,
+    inputBorderHovered: p.neutralPrimary,
+    inputBackgroundSelected: p.themePrimary,
+    inputBackgroundSelectedHovered: p.themeDarkAlt,
+    inputForegroundSelected: p.white
+  };
+}
diff --git a/packages/utilities/api/utilities.api.ts b/packages/utilities/api/utilities.api.ts
index ffbca505d4b64..5dbec0c7c4e18 100644
--- a/packages/utilities/api/utilities.api.ts
+++ b/packages/utilities/api/utilities.api.ts
@@ -104,6 +104,8 @@ export function getId(prefix?: string): string;
 
 export function getInitials(displayName: string, isRtl: boolean): string;
 
+export function getLanguage(): string;
+
 // (undocumented)
 export function getLastFocusable(rootElement: HTMLElement,
   currentElement: HTMLElement,
@@ -311,8 +313,10 @@ enum KeyCodes {
   up = 38
 }
 
-// (undocumented)
-export function memoize < T extends (...args: any[]) => RET_TYPE, RET_TYPE >(cb: T): T;
+export function memoizeFunction < T extends (...args: any[]) => RET_TYPE, RET_TYPE >(cb: T,
+  maxCacheSize: number = 100): T;
+
+export function nullRender(): JSX.Element | null;
 
 // (undocumented)
 class Rectangle {
@@ -345,7 +349,6 @@ export function warnMutuallyExclusive < P >(componentName: string,
   props: P,
   exclusiveMap: ISettingsMap<P>): void;
 
-// WARNING: nullRender has incomplete type information
 // WARNING: createArray has incomplete type information
 // WARNING: autobind has incomplete type information
 // WARNING: Unsupported export: ICssInput
@@ -357,6 +360,7 @@ export function warnMutuallyExclusive < P >(componentName: string,
 // WARNING: getDocument has incomplete type information
 // WARNING: doesElementContainFocus has incomplete type information
 // WARNING: hoistMethods has incomplete type information
+// WARNING: setLanguage has incomplete type information
 // WARNING: shallowCompare has incomplete type information
 // WARNING: assign has incomplete type information
 // WARNING: filteredAssign has incomplete type information
@@ -371,10 +375,10 @@ export function warnMutuallyExclusive < P >(componentName: string,
 // WARNING: Unsupported export: imageProperties
 // WARNING: getResourceUrl has incomplete type information
 // WARNING: setBaseUrl has incomplete type information
-// WARNING: getLanguage has incomplete type information
 // WARNING: setRTL has incomplete type information
 // WARNING: Unsupported export: DATA_IS_SCROLLABLE_ATTRIBUTE
 // WARNING: disableBodyScroll has incomplete type information
 // WARNING: enableBodyScroll has incomplete type information
 // WARNING: Unsupported export: ISettingsMap
+// WARNING: memoize has incomplete type information
 // (No packageDescription for this package)
diff --git a/packages/utilities/karma.config.js b/packages/utilities/karma.config.js
index 1cc76d92cb5cb..a706b978e8741 100644
--- a/packages/utilities/karma.config.js
+++ b/packages/utilities/karma.config.js
@@ -31,7 +31,7 @@ module.exports = function (config) {
 
     // webpack config for bundling tests.
     webpack: {
-      devtool: 'inline-source-map',
+      devtool: 'source-map',
       module: {
         loaders: [
           {
diff --git a/packages/utilities/src/BaseComponent.ts b/packages/utilities/src/BaseComponent.ts
index 40adec994225e..f9a70fdd0f64f 100644
--- a/packages/utilities/src/BaseComponent.ts
+++ b/packages/utilities/src/BaseComponent.ts
@@ -234,4 +234,7 @@ BaseComponent.onError = (errorMessage) => {
   throw errorMessage;
 };
 
-export function nullRender() { return null; }
+/**
+ * Simple constant function for returning null, used to render empty templates in JSX.
+ */
+export function nullRender(): JSX.Element | null { return null; }
diff --git a/packages/utilities/src/common/tests.js b/packages/utilities/src/common/tests.js
index f2ee7d9123445..2670e405e5c9a 100644
--- a/packages/utilities/src/common/tests.js
+++ b/packages/utilities/src/common/tests.js
@@ -1,5 +1,8 @@
 'use strict';
 
+// Polyfills
+require('es6-weak-map/implement');
+
 /**
  * This is a test entry point to help karma-webpack find all tests in the project.
  **/
diff --git a/packages/utilities/src/index.ts b/packages/utilities/src/index.ts
index 51f17005b44e9..68694e0f80fe6 100644
--- a/packages/utilities/src/index.ts
+++ b/packages/utilities/src/index.ts
@@ -18,6 +18,7 @@ export * from './dom';
 export * from './focus';
 export * from './hoist';
 export * from './initials';
+export * from './language';
 export * from './math';
 export * from './object';
 export * from './overflow';
diff --git a/packages/utilities/src/language.ts b/packages/utilities/src/language.ts
new file mode 100644
index 0000000000000..367d053de7568
--- /dev/null
+++ b/packages/utilities/src/language.ts
@@ -0,0 +1,53 @@
+import { KeyCodes } from './KeyCodes';
+import { getDocument, getWindow } from './dom';
+
+// Default to undefined so that we initialize on first read.
+let _language: string;
+
+/**
+ * Gets the rtl state of the page (returns true if in rtl.)
+ */
+export function getLanguage(): string {
+  if (_language === undefined) {
+    let doc = getDocument();
+    let win = getWindow();
+
+    // tslint:disable-next-line:no-string-literal
+    if (win && win['localStorage']) {
+      let savedLanguage = localStorage.getItem('language');
+
+      if (savedLanguage !== null) {
+        _language = savedLanguage;
+      }
+    }
+
+    if (_language === undefined && doc) {
+      _language = doc.documentElement.getAttribute('lang');
+    }
+
+    if (_language === undefined) {
+      setLanguage('en', false);
+    }
+  }
+
+  return _language;
+}
+
+/**
+ * Sets the rtl state of the page (by adjusting the dir attribute of the html element.)
+ */
+export function setLanguage(language: string, avoidPersisting = false): void {
+  let doc = getDocument();
+
+  if (doc) {
+    doc.documentElement.setAttribute('lang', language);
+  }
+
+  let win = getWindow();
+  // tslint:disable-next-line:no-string-literal
+  if (win && win['localStorage'] && !avoidPersisting) {
+    localStorage.setItem('language', language);
+  }
+
+  _language = language;
+}
diff --git a/packages/utilities/src/memoize.test.ts b/packages/utilities/src/memoize.test.ts
index 572db698de0b7..917e85d115e60 100644
--- a/packages/utilities/src/memoize.test.ts
+++ b/packages/utilities/src/memoize.test.ts
@@ -1,21 +1,22 @@
+// Polyfills
 import 'es6-weak-map/implement';
 
-import { memoize } from './memoize';
+import { memoize, memoizeFunction } from './memoize';
 
 let { expect } = chai;
 
-describe('memoize', () => {
+describe('memoizeFunction', () => {
   it('can return a cached result with a no args function', () => {
     let _timesCalled = 0;
-    let memoizedTimesCalled = memoize(() => ++_timesCalled);
+    let memoizeFunctiondTimesCalled = memoizeFunction(() => ++_timesCalled);
 
-    expect(memoizedTimesCalled()).equals(1);
-    expect(memoizedTimesCalled()).equals(1);
+    expect(memoizeFunctiondTimesCalled()).equals(1);
+    expect(memoizeFunctiondTimesCalled()).equals(1);
   });
 
   it('can return a cached result with a 2 arg function', () => {
     let _timesCalled = 0;
-    let combine = memoize((obj1, obj2) => (obj1.val + obj2.val + ++_timesCalled));
+    let combine = memoizeFunction((obj1, obj2) => (obj1.val + obj2.val + ++_timesCalled));
     let objA = { val: 'a' };
     let objB = { val: 'b' };
 
@@ -29,7 +30,7 @@ describe('memoize', () => {
 
   it('can return a cached result with falsy args', () => {
     let _timesCalled = 0;
-    let combine = memoize((obj1, obj2) => ((obj1 ? obj1.val : '') + (obj2 ? obj2.val : '') + ++_timesCalled));
+    let combine = memoizeFunction((obj1, obj2) => ((obj1 ? obj1.val : '') + (obj2 ? obj2.val : '') + ++_timesCalled));
     let objA = { val: 'a' };
     let objB = { val: 'b' };
 
@@ -39,4 +40,72 @@ describe('memoize', () => {
     expect(combine(false, 0)).equals('4');
   });
 
+  it('works if you pass less arguments on subsequent calls', () => {
+    let count = 0;
+    let func = memoizeFunction((
+      a: string = '',
+      b: string = ''
+    ) => a + b + count++);
+
+    expect(func('hi', 'world')).equals('hiworld0');
+    expect(func('hi', 'world')).equals('hiworld0');
+    expect(func('hi')).equals('hi1');
+    expect(func('hi')).equals('hi1');
+    expect(func()).equals('2');
+    expect(func()).equals('2');
+  });
+
+  it('works if you pass more arguments on subsequent calls', () => {
+    let count = 0;
+    let func = memoizeFunction((
+      a: string = '',
+      b: string = ''
+    ) => a + b + count++);
+
+    expect(func()).equals('0');
+    expect(func()).equals('0');
+    expect(func('hi')).equals('hi1');
+    expect(func('hi')).equals('hi1');
+    expect(func('hi', 'world')).equals('hiworld2');
+    expect(func('hi', 'world')).equals('hiworld2');
+  });
+
+  it('resets after resetCount limit is reached.', () => {
+    let count = 0;
+    let func = memoizeFunction((
+      a: string
+    ) => a + count++, 1);
+
+    expect(func('a')).equals('a0');
+    expect(func('a')).equals('a0');
+    expect(func('b')).equals('b1');
+    expect(func('b')).equals('b2');
+    expect(func('b')).equals('b2');
+    expect(func('a')).equals('a3');
+    expect(func('a')).equals('a4');
+    expect(func('a')).equals('a4');
+  });
+
 });
+
+describe('memoize', () => {
+  it('can work on multiple instances of a class', () => {
+    let _count = 0;
+
+    class Foo {
+
+      @memoize
+      public bar(val: string) {
+        return val + _count++;
+      }
+    }
+
+    let f = new Foo();
+
+    expect(f.bar('hi')).equals('hi0');
+    expect(f.bar('hi')).equals('hi0');
+    expect(f.bar('bye')).equals('bye1');
+    expect(f.bar('bye')).equals('bye1');
+  });
+
+});
\ No newline at end of file
diff --git a/packages/utilities/src/memoize.ts b/packages/utilities/src/memoize.ts
index c59a6d640ff74..be5a7408a447e 100644
--- a/packages/utilities/src/memoize.ts
+++ b/packages/utilities/src/memoize.ts
@@ -4,65 +4,97 @@ declare class WeakMap {
   public has(key: any);
 }
 
-const _emptyObject = {};
+const _emptyObject = { empty: true };
 const _dictionary = {};
 
-function _normalizeArg(val: any) {
-  if (!val) {
-    return _emptyObject;
-  } else if (typeof val === 'object') {
-    return val;
-  } else if (!_dictionary[val]) {
-    _dictionary[val] = {};
-  }
+interface IMemoizeNode {
+  map: WeakMap;
+  value?: any;
+}
 
-  return _dictionary[val];
+export function memoize<T extends Function>(
+  target: any,
+  key: string,
+  descriptor: TypedPropertyDescriptor<T>) {
+
+  // We bind to "null" to prevent people from inadvertently pulling values from "this",
+  // rather than passing them in as input values which can be memoized.
+  let fn = memoizeFunction(descriptor.value.bind(null));
+
+  return {
+    configurable: true,
+    get() {
+      return fn;
+    }
+  };
 }
 
-export function memoize<T extends (...args: any[]) => RET_TYPE, RET_TYPE>(cb: T): T {
-  let cache: any;
+/**
+ * Memoizes a function; when you pass in the same parameters multiple times, it returns a cached result.
+ * Be careful when passing in objects, you need to pass in the same INSTANCE for caching to work. Otherwise
+ * it will grow the cache unnecessarily.
+ *
+ * By default, the cache will reset after 100 permutations, to avoid abuse cases where the function is
+ * unintendedly called with unique objects. Without a reset, the cache could grow infinitely, so we safeguard
+ * by resetting. To override this behavior, pass a value of 0 to the maxCacheSize parameter.
+ *
+ * @param cb - The function to memoize.
+ * @param maxCacheSize - Max results to cache. If the cache exceeds this value, it will reset on the next call.
+ * @returns A memoized version of the function.
+ */
+export function memoizeFunction<T extends (...args: any[]) => RET_TYPE, RET_TYPE>(
+  cb: T,
+  maxCacheSize: number = 100
+): T {
+
+  let rootNode: any;
+  let cacheSize = 0;
 
   // tslint:disable-next-line:no-function-expression
   return function memoizedFunction(...args: any[]): RET_TYPE {
-    let retVal: RET_TYPE;
+    let currentNode: any = rootNode;
 
-    if (args.length === 0) {
-      if (cache === undefined) {
-        cache = cb(...args);
-      }
-      retVal = cache;
-    } else {
-      if (!cache) {
-        cache = new WeakMap();
-      }
+    if (rootNode === undefined || (maxCacheSize > 0 && cacheSize > maxCacheSize)) {
+      rootNode = _createNode();
+      cacheSize = 0;
+    }
 
-      let currentCache: any = cache;
+    currentNode = rootNode;
 
-      for (let i = 0; i < args.length - 1; i++) {
-        let arg = _normalizeArg(args[i]);
+    // Traverse the tree until we find the match.
+    for (let i = 0; i < args.length; i++) {
+      let arg = _normalizeArg(args[i]);
 
-        if (!arg) {
-          arg = _emptyObject;
-        }
-        if (cache.has(arg)) {
-          currentCache = cache.get(arg);
-        } else {
-          currentCache = new WeakMap();
-          cache.set(arg, currentCache);
-        }
+      if (!currentNode.map.has(arg)) {
+        currentNode.map.set(arg, _createNode());
       }
 
-      let lastArg = _normalizeArg(args[args.length - 1]);
+      currentNode = currentNode.map.get(arg);
+    }
 
-      if (currentCache.has(lastArg)) {
-        retVal = currentCache.get(lastArg);
-      } else {
-        let value = cb(...args);
-        currentCache.set(lastArg, value);
-        retVal = value;
-      }
+    if (!currentNode.hasOwnProperty('value')) {
+      currentNode.value = cb(...args);
+      cacheSize++;
     }
 
-    return retVal;
+    return currentNode.value;
   } as any;
 }
+
+function _normalizeArg(val: any) {
+  if (!val) {
+    return _emptyObject;
+  } else if (typeof val === 'object') {
+    return val;
+  } else if (!_dictionary[val]) {
+    _dictionary[val] = { val };
+  }
+
+  return _dictionary[val];
+}
+
+function _createNode(): IMemoizeNode {
+  return {
+    map: new WeakMap()
+  };
+}
diff --git a/packages/utilities/src/resources.ts b/packages/utilities/src/resources.ts
index ee04cd5b9ede2..7db0806d03cc9 100644
--- a/packages/utilities/src/resources.ts
+++ b/packages/utilities/src/resources.ts
@@ -9,8 +9,3 @@ export function getResourceUrl(url) {
 export function setBaseUrl(baseUrl) {
   _baseUrl = baseUrl;
 }
-
-/** Gets the current runtime language. */
-export function getLanguage() {
-  return 'en-us';
-}
diff --git a/packages/utilities/src/rtl.ts b/packages/utilities/src/rtl.ts
index fe4e87a9bfb15..80f7c7a60ec31 100644
--- a/packages/utilities/src/rtl.ts
+++ b/packages/utilities/src/rtl.ts
@@ -25,7 +25,7 @@ export function getRTL(): boolean {
     }
 
     if (_isRTL !== undefined) {
-      setRTL(_isRTL);
+      setRTL(_isRTL, true);
     } else {
       throw new Error(
         'getRTL was called in a server environment without setRTL being called first. ' +
@@ -40,7 +40,7 @@ export function getRTL(): boolean {
 /**
  * Sets the rtl state of the page (by adjusting the dir attribute of the html element.)
  */
-export function setRTL(isRTL: boolean) {
+export function setRTL(isRTL: boolean, avoidPersisting = false) {
   let doc = getDocument();
   if (doc) {
     doc.documentElement.setAttribute('dir', isRTL ? 'rtl' : 'ltr');
@@ -48,7 +48,7 @@ export function setRTL(isRTL: boolean) {
 
   let win = getWindow();
   // tslint:disable-next-line:no-string-literal
-  if (win && win['localStorage']) {
+  if (win && win['localStorage'] && !avoidPersisting) {
     localStorage.setItem('isRTL', isRTL ? '1' : '0');
   }
 

From b80bb353828845d2baa1d2d0eeabe82c7ce51dce Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 29 May 2017 14:59:54 -0700
Subject: [PATCH 0028/1641] Updating to npm5 support. (#1879)

* Updating to npm5 support.

* removing travis step.

* Updating shrinkwrap.

* Updating es6-promise.

* Adding updates to build faster in ci.

* fix

* Fixing selective-build

* Fixing ssr test warnings.
---
 .travis.yml                                  |    2 +-
 apps/component-demo/package.json             |    2 +-
 apps/fabric-website/gulpfile.js              |    2 +
 apps/fabric-website/package.json             |    2 +-
 apps/ssr-tests/webpack.config.js             |    4 +
 common/config/rush/npm-shrinkwrap.json       | 7057 +++++++++---------
 package-lock.json                            | 2148 ++++++
 package.json                                 |    5 +-
 packages/example-app-base/package.json       |    2 +-
 packages/office-ui-fabric-react/package.json |    2 +-
 packages/styling/package.json                |    2 +-
 packages/utilities/package.json              |    2 +-
 rush.json                                    |    2 +-
 scripts/selective-build.js                   |  111 +
 14 files changed, 5721 insertions(+), 3622 deletions(-)
 create mode 100644 package-lock.json
 create mode 100644 scripts/selective-build.js

diff --git a/.travis.yml b/.travis.yml
index 15fe4aacfbc8d..f03070e42cf27 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -4,7 +4,7 @@ node_js:
 before_script:
   - npm install -g gulp
 script:
-  - npm run build
+  - npm run buildfast
 cache:
   directories:
     - node_modules
diff --git a/apps/component-demo/package.json b/apps/component-demo/package.json
index c13f39c558a9f..9fe1f79da7af7 100644
--- a/apps/component-demo/package.json
+++ b/apps/component-demo/package.json
@@ -22,7 +22,7 @@
     "@types/react-addons-test-utils": "^0.14.17",
     "@types/react-dom": "^0.14.23",
     "@types/webpack-env": "^1.13.0",
-    "es6-promise": ">=3.2.1 <4.0.0",
+    "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
     "office-ui-fabric-react": ">=1.5.5 <2.0.0",
diff --git a/apps/fabric-website/gulpfile.js b/apps/fabric-website/gulpfile.js
index 04b3e087fb250..8fe20fdb16619 100644
--- a/apps/fabric-website/gulpfile.js
+++ b/apps/fabric-website/gulpfile.js
@@ -29,6 +29,8 @@ build.tslint.setConfig({
 // TODO: remove this! There are a number of lint errors to fix.
 build.tslint.isEnabled = () => false;
 
+build.webpack.isEnabled = () => isProduction;
+
 // Configure TypeScript.
 build.TypeScriptConfiguration.setTypescriptCompiler(require('typescript'));
 
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index bd8706aef01ef..55031ac88f329 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -25,7 +25,7 @@
     "@types/react-addons-test-utils": "^0.14.17",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
-    "es6-promise": "4.1.0",
+    "es6-promise": "^4.1.0",
     "git-rev": "0.2.1",
     "gulp": "~3.9.1",
     "gulp-debug": "3.1.0",
diff --git a/apps/ssr-tests/webpack.config.js b/apps/ssr-tests/webpack.config.js
index 8ffc5cee6e26a..bbe4265db6033 100644
--- a/apps/ssr-tests/webpack.config.js
+++ b/apps/ssr-tests/webpack.config.js
@@ -1,5 +1,6 @@
 let path = require('path');
 let nodeExternals = require('webpack-node-externals');
+let webpack = require('webpack');
 
 module.exports = {
   entry: './test/test.js',
@@ -41,5 +42,8 @@ module.exports = {
   },
 
   plugins: [
+    new webpack.DefinePlugin({
+      'process.env.NODE_ENV': JSON.stringify('production')
+    }),
   ]
 }
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 20ac2971751af..770d39fbc07f8 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -1,8914 +1,8745 @@
 {
   "name": "rush-common",
   "version": "0.0.0",
+  "lockfileVersion": 1,
   "dependencies": {
     "@microsoft/api-extractor": {
       "version": "1.1.19",
-      "from": "@microsoft/api-extractor@>=1.1.19 <2.0.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-1.1.19.tgz"
+      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-1.1.19.tgz",
+      "integrity": "sha1-aBrxRDx7s/3xnRnPqvdd2QoD2dI="
     },
     "@microsoft/gulp-core-build": {
       "version": "2.5.3",
-      "from": "@microsoft/gulp-core-build@>=2.4.2 <3.0.0",
       "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.5.3.tgz",
+      "integrity": "sha1-26R2Li/7oxiYdlmTx3d7AVk8/rc=",
       "dependencies": {
         "@types/chai": {
           "version": "3.4.34",
-          "from": "@types/chai@3.4.34",
-          "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz"
+          "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz",
+          "integrity": "sha1-1TNXkoI7sJzd1eOMPSEbcJGDhU0="
         },
         "@types/mocha": {
           "version": "2.2.38",
-          "from": "@types/mocha@2.2.38",
-          "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz"
+          "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz",
+          "integrity": "sha1-jBiPbjTC58Px0BJ9kI1aNuWmDck="
         },
         "rimraf": {
           "version": "2.5.4",
-          "from": "rimraf@>=2.5.4 <2.6.0",
-          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz"
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
+          "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
         }
       }
     },
     "@microsoft/gulp-core-build-karma": {
       "version": "2.2.2",
-      "from": "@microsoft/gulp-core-build-karma@>=2.1.2 <3.0.0",
       "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-karma/-/gulp-core-build-karma-2.2.2.tgz",
+      "integrity": "sha1-L910uWl7x2VZjGwrOCxR9XBhSmg=",
       "dependencies": {
         "camelcase": {
           "version": "1.2.1",
-          "from": "camelcase@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
+          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
         },
         "cliui": {
           "version": "2.1.0",
-          "from": "cliui@>=2.1.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
+          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE="
         },
         "interpret": {
           "version": "0.6.6",
-          "from": "interpret@>=0.6.4 <0.7.0",
-          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz"
+          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz",
+          "integrity": "sha1-/s16GOfOXKar+5U+H4YhOknxYls="
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "karma-sinon-chai": {
           "version": "1.2.4",
-          "from": "karma-sinon-chai@>=1.2.0 <1.3.0",
           "resolved": "https://registry.npmjs.org/karma-sinon-chai/-/karma-sinon-chai-1.2.4.tgz",
+          "integrity": "sha1-/qk19ivjNmzwJxyNi+UcDHDkCrw=",
           "dependencies": {
             "lolex": {
               "version": "1.6.0",
-              "from": "lolex@>=1.5.0 <2.0.0",
-              "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz"
+              "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
+              "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
             }
           }
         },
         "memory-fs": {
           "version": "0.3.0",
-          "from": "memory-fs@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz",
+          "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "sinon": {
           "version": "1.17.7",
-          "from": "sinon@>=1.17.3 <1.18.0",
           "resolved": "https://registry.npmjs.org/sinon/-/sinon-1.17.7.tgz",
+          "integrity": "sha1-RUKk9JugxFwF6y6d2dID4rjv4L8=",
           "dependencies": {
             "lolex": {
               "version": "1.3.2",
-              "from": "lolex@1.3.2",
-              "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.3.2.tgz"
+              "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.3.2.tgz",
+              "integrity": "sha1-fD2mL/yzDw9agKJWbKJORdigHzE="
             }
           }
         },
         "sinon-chai": {
           "version": "2.8.0",
-          "from": "sinon-chai@>=2.8.0 <2.9.0",
-          "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.8.0.tgz"
+          "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.8.0.tgz",
+          "integrity": "sha1-Qyqbv9Uab8AHmPTSUmqCnAYGh6w="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         },
         "uglify-js": {
           "version": "2.7.5",
-          "from": "uglify-js@>=2.7.3 <2.8.0",
           "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.7.5.tgz",
+          "integrity": "sha1-RhLAx7qu4rp8SH3kkErhIgefLKg=",
           "dependencies": {
             "async": {
               "version": "0.2.10",
-              "from": "async@>=0.2.6 <0.3.0",
-              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz"
+              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz",
+              "integrity": "sha1-trvgsGdLnXGXCMo43owjfLUmw9E="
             }
           }
         },
         "webpack": {
           "version": "1.13.3",
-          "from": "webpack@>=1.13.0 <1.14.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz"
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz",
+          "integrity": "sha1-55xG/lo3xcpwCEugiUxZXNy0KBU="
         },
         "window-size": {
           "version": "0.1.0",
-          "from": "window-size@0.1.0",
-          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
+          "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
         },
         "wordwrap": {
           "version": "0.0.2",
-          "from": "wordwrap@0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
+          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
         },
         "yargs": {
           "version": "3.10.0",
-          "from": "yargs@>=3.10.0 <3.11.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz"
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
+          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
         }
       }
     },
     "@microsoft/gulp-core-build-sass": {
       "version": "2.0.8",
-      "from": "@microsoft/gulp-core-build-sass@>=2.0.3 <3.0.0",
       "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-2.0.8.tgz",
+      "integrity": "sha1-Xq3URcMEIKuHxvHd5KTc68aKEmQ=",
       "dependencies": {
         "autoprefixer": {
           "version": "6.3.7",
-          "from": "autoprefixer@6.3.7",
-          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz"
+          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz",
+          "integrity": "sha1-jt8xZt2f1hFlM2Ysi7NqA8DvyHQ="
         }
       }
     },
     "@microsoft/gulp-core-build-serve": {
       "version": "2.1.3",
-      "from": "@microsoft/gulp-core-build-serve@>=2.0.3 <3.0.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-serve/-/gulp-core-build-serve-2.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-serve/-/gulp-core-build-serve-2.1.3.tgz",
+      "integrity": "sha1-k9LYWMLwL+3wxZSKal4KQ8XjqCU="
     },
     "@microsoft/gulp-core-build-typescript": {
       "version": "2.4.4",
-      "from": "@microsoft/gulp-core-build-typescript@>=2.4.4 <3.0.0",
       "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-2.4.4.tgz",
+      "integrity": "sha1-DJ7UgdBtZNmv3KpEzsGoVI89tTs=",
       "dependencies": {
         "typescript": {
           "version": "2.1.6",
-          "from": "typescript@>=2.1.4 <2.2.0",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.1.6.tgz"
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.1.6.tgz",
+          "integrity": "sha1-QMfm6eXaeWG3cYtVUF+crJSHpgc="
         }
       }
     },
     "@microsoft/gulp-core-build-webpack": {
       "version": "1.1.6",
-      "from": "@microsoft/gulp-core-build-webpack@>=1.1.2 <2.0.0",
       "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-webpack/-/gulp-core-build-webpack-1.1.6.tgz",
+      "integrity": "sha1-OloimWPldBfH8WPd99iNfPdm8uA=",
       "dependencies": {
         "camelcase": {
           "version": "1.2.1",
-          "from": "camelcase@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
+          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
         },
         "cliui": {
           "version": "2.1.0",
-          "from": "cliui@>=2.1.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
+          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE="
         },
         "interpret": {
           "version": "0.6.6",
-          "from": "interpret@>=0.6.4 <0.7.0",
-          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz"
+          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz",
+          "integrity": "sha1-/s16GOfOXKar+5U+H4YhOknxYls="
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "memory-fs": {
           "version": "0.3.0",
-          "from": "memory-fs@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz",
+          "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         },
         "uglify-js": {
           "version": "2.7.5",
-          "from": "uglify-js@>=2.7.3 <2.8.0",
           "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.7.5.tgz",
+          "integrity": "sha1-RhLAx7qu4rp8SH3kkErhIgefLKg=",
           "dependencies": {
             "async": {
               "version": "0.2.10",
-              "from": "async@>=0.2.6 <0.3.0",
-              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz"
+              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz",
+              "integrity": "sha1-trvgsGdLnXGXCMo43owjfLUmw9E="
             }
           }
         },
         "webpack": {
           "version": "1.13.3",
-          "from": "webpack@>=1.13.0 <1.14.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz"
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz",
+          "integrity": "sha1-55xG/lo3xcpwCEugiUxZXNy0KBU="
         },
         "window-size": {
           "version": "0.1.0",
-          "from": "window-size@0.1.0",
-          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
+          "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
         },
         "wordwrap": {
           "version": "0.0.2",
-          "from": "wordwrap@0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
+          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
         },
         "yargs": {
           "version": "3.10.0",
-          "from": "yargs@>=3.10.0 <3.11.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz"
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
+          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
         }
       }
     },
     "@microsoft/load-themed-styles": {
       "version": "1.4.0",
-      "from": "@microsoft/load-themed-styles@>=1.2.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.4.0.tgz",
+      "integrity": "sha1-GDC9288QFxLKJgIX5Vq3RKUgQdw="
     },
     "@microsoft/loader-cased-file": {
       "version": "1.0.0",
-      "from": "@microsoft/loader-cased-file@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-cased-file/-/loader-cased-file-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-cased-file/-/loader-cased-file-1.0.0.tgz",
+      "integrity": "sha1-2juX73tbnVGI1IT1a+Vs6QRzQSw="
     },
     "@microsoft/loader-load-themed-styles": {
       "version": "0.0.5",
-      "from": "@microsoft/loader-load-themed-styles@>=0.0.5 <0.1.0",
       "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-0.0.5.tgz",
+      "integrity": "sha1-L9eYt4pDdvyRL5ASaI33kX8cofg=",
       "dependencies": {
         "@microsoft/load-themed-styles": {
           "version": "1.2.2",
-          "from": "@microsoft/load-themed-styles@>=1.2.2 <1.3.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.2.2.tgz"
+          "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.2.2.tgz",
+          "integrity": "sha1-+i+hypxPDEliPi5IrTujBSRJWGc="
         }
       }
     },
     "@microsoft/loader-set-webpack-public-path": {
       "version": "0.1.7",
-      "from": "@microsoft/loader-set-webpack-public-path@>=0.1.7 <0.2.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-set-webpack-public-path/-/loader-set-webpack-public-path-0.1.7.tgz"
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-set-webpack-public-path/-/loader-set-webpack-public-path-0.1.7.tgz",
+      "integrity": "sha1-elXNxsfwP05ZZyk+XKLAppxIxLI="
     },
     "@microsoft/rush-lib": {
       "version": "1.8.3",
-      "from": "@microsoft/rush-lib@>=1.8.3 <1.9.0",
       "resolved": "https://registry.npmjs.org/@microsoft/rush-lib/-/rush-lib-1.8.3.tgz",
+      "integrity": "sha1-+40E9QAknaLY7vXhwfj2Guy3t4Y=",
       "dependencies": {
         "@types/chai": {
           "version": "3.4.34",
-          "from": "@types/chai@3.4.34",
-          "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz"
+          "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz",
+          "integrity": "sha1-1TNXkoI7sJzd1eOMPSEbcJGDhU0="
         },
         "@types/fs-extra": {
           "version": "0.0.34",
-          "from": "@types/fs-extra@0.0.34",
-          "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.34.tgz"
+          "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.34.tgz",
+          "integrity": "sha1-Tv8v9bBqWjv8VErdOm7TTN+JIzU="
         },
         "@types/mocha": {
           "version": "2.2.38",
-          "from": "@types/mocha@2.2.38",
-          "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz"
+          "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz",
+          "integrity": "sha1-jBiPbjTC58Px0BJ9kI1aNuWmDck="
         },
         "rimraf": {
           "version": "2.5.4",
-          "from": "rimraf@>=2.5.2 <2.6.0",
-          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz"
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
+          "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
         },
         "semver": {
           "version": "5.2.0",
-          "from": "semver@>=5.2.0 <5.3.0",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.2.0.tgz",
+          "integrity": "sha1-KBmVuAwUSCCUFd28TPUMJpzvVcU="
         }
       }
     },
     "@microsoft/sp-build-common": {
       "version": "1.0.0",
-      "from": "@microsoft/sp-build-common@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/@microsoft/sp-build-common/-/sp-build-common-1.0.0.tgz",
+      "integrity": "sha1-LYMxudMf39F+CmgR9/Q4LQIIYPQ=",
       "dependencies": {
         "@types/yargs": {
           "version": "0.0.35",
-          "from": "@types/yargs@0.0.35",
-          "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.35.tgz"
+          "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.35.tgz",
+          "integrity": "sha1-QHczV2rO1IlfutZ6Pwr2M9Lfy60="
         },
         "@types/z-schema": {
           "version": "3.16.20-alpha",
-          "from": "@types/z-schema@3.16.20-alpha",
-          "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.20-alpha.tgz"
+          "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.20-alpha.tgz",
+          "integrity": "sha1-NvWIzMon2Oht1rtZWpc67eiAN2Y="
         }
       }
     },
     "@microsoft/sp-build-core-tasks": {
       "version": "1.0.1",
-      "from": "@microsoft/sp-build-core-tasks@>=1.0.1 <1.1.0",
       "resolved": "https://registry.npmjs.org/@microsoft/sp-build-core-tasks/-/sp-build-core-tasks-1.0.1.tgz",
+      "integrity": "sha1-lw0TAjg9Sph6HOzM+O47NRQR2k0=",
       "dependencies": {
         "@microsoft/load-themed-styles": {
           "version": "1.2.2",
-          "from": "@microsoft/load-themed-styles@>=1.2.2 <1.3.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.2.2.tgz"
+          "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.2.2.tgz",
+          "integrity": "sha1-+i+hypxPDEliPi5IrTujBSRJWGc="
         },
         "camelcase": {
           "version": "1.2.1",
-          "from": "camelcase@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
+          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
         },
         "cliui": {
           "version": "2.1.0",
-          "from": "cliui@>=2.1.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
+          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE="
         },
         "css-loader": {
           "version": "0.24.0",
-          "from": "css-loader@>=0.24.0 <0.25.0",
-          "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.24.0.tgz"
+          "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.24.0.tgz",
+          "integrity": "sha1-evqvtMD7L5CzNe0Qocd7NNZIQ/4="
         },
         "css-selector-tokenizer": {
           "version": "0.6.0",
-          "from": "css-selector-tokenizer@>=0.6.0 <0.7.0",
-          "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.6.0.tgz"
+          "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.6.0.tgz",
+          "integrity": "sha1-ZEX1gseTDSQdzFAHpD1vy48HMVI="
         },
         "debug": {
           "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "es6-promise": {
           "version": "3.1.2",
-          "from": "es6-promise@3.1.2",
-          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-3.1.2.tgz"
+          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-3.1.2.tgz",
+          "integrity": "sha1-eV4lzrR/e6uyY9FRr77dktGOagc="
         },
         "finalhandler": {
           "version": "0.4.1",
-          "from": "finalhandler@>=0.4.1 <0.5.0",
-          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.4.1.tgz",
+          "integrity": "sha1-haF8bFmpRxfSYtYSMNSw6+PUoU0="
         },
         "glob": {
           "version": "7.0.6",
-          "from": "glob@>=7.0.5 <7.1.0",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.0.6.tgz"
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.0.6.tgz",
+          "integrity": "sha1-IRuvr0nlJbjNkyYNFKsTYVKz9Xo="
         },
         "http-errors": {
           "version": "1.3.1",
-          "from": "http-errors@>=1.3.1 <1.4.0",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
+          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
         },
         "interpret": {
           "version": "0.6.6",
-          "from": "interpret@>=0.6.4 <0.7.0",
-          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz"
+          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz",
+          "integrity": "sha1-/s16GOfOXKar+5U+H4YhOknxYls="
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "memory-fs": {
           "version": "0.3.0",
-          "from": "memory-fs@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz",
+          "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
         },
         "mime": {
           "version": "1.3.4",
-          "from": "mime@1.3.4",
-          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz"
+          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz",
+          "integrity": "sha1-EV+eO2s9rylZmDyzjxSaLUDrXVM="
         },
         "ms": {
           "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         },
         "node-uuid": {
           "version": "1.4.8",
-          "from": "node-uuid@>=1.4.7 <1.5.0",
-          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz"
+          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz",
+          "integrity": "sha1-sEDrCSOWivq/jTL7HxfxFn/auQc="
         },
         "range-parser": {
           "version": "1.0.3",
-          "from": "range-parser@>=1.0.3 <1.1.0",
-          "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.0.3.tgz"
+          "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.0.3.tgz",
+          "integrity": "sha1-aHKCNTXGkuLCoBA4Jq/YLC4P8XU="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "resolve": {
           "version": "1.1.7",
-          "from": "resolve@>=1.1.7 <1.2.0",
-          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz"
+          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz",
+          "integrity": "sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs="
         },
         "rimraf": {
           "version": "2.5.4",
-          "from": "rimraf@>=2.5.2 <2.6.0",
-          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz"
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
+          "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
         },
         "send": {
           "version": "0.13.2",
-          "from": "send@0.13.2",
-          "resolved": "https://registry.npmjs.org/send/-/send-0.13.2.tgz"
+          "resolved": "https://registry.npmjs.org/send/-/send-0.13.2.tgz",
+          "integrity": "sha1-dl52B8gFVFK7pvCwUllTUJhgNt4="
         },
         "serve-static": {
           "version": "1.10.3",
-          "from": "serve-static@>=1.10.2 <1.11.0",
-          "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.10.3.tgz"
+          "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.10.3.tgz",
+          "integrity": "sha1-zlpuzTEB/tXsCYJ9rCKpwpv7BTU="
         },
         "statuses": {
           "version": "1.2.1",
-          "from": "statuses@>=1.2.1 <1.3.0",
-          "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.2.1.tgz",
+          "integrity": "sha1-3e1FzBglbVHtQK7BQkidXGECbSg="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         },
         "uglify-js": {
           "version": "2.7.5",
-          "from": "uglify-js@>=2.7.3 <2.8.0",
           "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.7.5.tgz",
+          "integrity": "sha1-RhLAx7qu4rp8SH3kkErhIgefLKg=",
           "dependencies": {
             "async": {
               "version": "0.2.10",
-              "from": "async@>=0.2.6 <0.3.0",
-              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz"
+              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz",
+              "integrity": "sha1-trvgsGdLnXGXCMo43owjfLUmw9E="
             }
           }
         },
         "webpack": {
           "version": "1.13.3",
-          "from": "webpack@>=1.13.0 <1.14.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz"
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz",
+          "integrity": "sha1-55xG/lo3xcpwCEugiUxZXNy0KBU="
         },
         "window-size": {
           "version": "0.1.0",
-          "from": "window-size@0.1.0",
-          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
+          "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
         },
         "wordwrap": {
           "version": "0.0.2",
-          "from": "wordwrap@0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
+          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
         },
         "yargs": {
           "version": "3.10.0",
-          "from": "yargs@>=3.10.0 <3.11.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz"
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
+          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
         }
       }
     },
     "@microsoft/sp-build-web": {
       "version": "1.0.1",
-      "from": "@microsoft/sp-build-web@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/@microsoft/sp-build-web/-/sp-build-web-1.0.1.tgz",
+      "integrity": "sha1-wLbn7gPT45eH38x9FZAn0UuhaRM=",
       "dependencies": {
         "@types/yargs": {
           "version": "0.0.35",
-          "from": "@types/yargs@0.0.35",
-          "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.35.tgz"
+          "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.35.tgz",
+          "integrity": "sha1-QHczV2rO1IlfutZ6Pwr2M9Lfy60="
         }
       }
     },
     "@microsoft/sp-module-interfaces": {
       "version": "1.0.0",
-      "from": "@microsoft/sp-module-interfaces@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/@microsoft/sp-module-interfaces/-/sp-module-interfaces-1.0.0.tgz",
+      "integrity": "sha1-cHc83IuclD92RemXChcyud8gKbw=",
       "dependencies": {
         "@types/z-schema": {
           "version": "3.16.20-alpha",
-          "from": "@types/z-schema@3.16.20-alpha",
-          "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.20-alpha.tgz"
+          "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.20-alpha.tgz",
+          "integrity": "sha1-NvWIzMon2Oht1rtZWpc67eiAN2Y="
         }
       }
     },
     "@microsoft/sp-polyfills": {
       "version": "1.0.0",
-      "from": "@microsoft/sp-polyfills@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/@microsoft/sp-polyfills/-/sp-polyfills-1.0.0.tgz",
+      "integrity": "sha1-tB/N8Njkgbib46/reNdaBe4Zkqs=",
       "dependencies": {
         "es6-promise": {
           "version": "3.1.2",
-          "from": "es6-promise@3.1.2",
-          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-3.1.2.tgz"
+          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-3.1.2.tgz",
+          "integrity": "sha1-eV4lzrR/e6uyY9FRr77dktGOagc="
         },
         "whatwg-fetch": {
           "version": "0.11.0",
-          "from": "whatwg-fetch@0.11.0",
-          "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-0.11.0.tgz"
+          "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-0.11.0.tgz",
+          "integrity": "sha1-RrHRjQqpmVWXHvGi9arFBq3SiBU="
         }
       }
     },
     "@microsoft/sp-tslint-rules": {
       "version": "1.0.0",
-      "from": "@microsoft/sp-tslint-rules@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/sp-tslint-rules/-/sp-tslint-rules-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/@microsoft/sp-tslint-rules/-/sp-tslint-rules-1.0.0.tgz",
+      "integrity": "sha1-Nas2DM1FUhb4e/YVDljVZlVZsjA="
     },
     "@microsoft/stream-collator": {
       "version": "1.0.2",
-      "from": "@microsoft/stream-collator@>=1.0.2 <1.1.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/stream-collator/-/stream-collator-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/@microsoft/stream-collator/-/stream-collator-1.0.2.tgz",
+      "integrity": "sha1-Qqwrj4yx79VSDd209FGZcBLLgwA="
     },
     "@microsoft/web-library-build": {
       "version": "3.0.2",
-      "from": "@microsoft/web-library-build@>=3.0.0-0 <4.0.0-0",
       "resolved": "https://registry.npmjs.org/@microsoft/web-library-build/-/web-library-build-3.0.2.tgz",
+      "integrity": "sha1-DldYaol/ddjdDAKdKVtBapg4f5w=",
       "dependencies": {
         "@microsoft/api-extractor": {
           "version": "2.0.6",
-          "from": "@microsoft/api-extractor@>=2.0.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.0.6.tgz"
+          "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.0.6.tgz",
+          "integrity": "sha1-BVN2DgbyuUGn9zbjP+wVK1/BQoQ="
         },
         "@microsoft/gulp-core-build-sass": {
           "version": "3.1.2",
-          "from": "@microsoft/gulp-core-build-sass@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.1.2.tgz"
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.1.2.tgz",
+          "integrity": "sha1-msehN3WBLY3s1/BOQrfy1BKjnCc="
         },
         "@microsoft/gulp-core-build-typescript": {
           "version": "3.1.1",
-          "from": "@microsoft/gulp-core-build-typescript@>=3.1.1 <4.0.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.1.1.tgz"
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.1.1.tgz",
+          "integrity": "sha1-e3gdjlKeSQzz5hB5eh+7fuZx01s="
         },
         "ansi-align": {
           "version": "2.0.0",
-          "from": "ansi-align@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-2.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-2.0.0.tgz",
+          "integrity": "sha1-w2rsy6VjuJzrVW82kPCx2eNUf38="
         },
         "autoprefixer": {
           "version": "6.3.7",
-          "from": "autoprefixer@6.3.7",
-          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz"
+          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz",
+          "integrity": "sha1-jt8xZt2f1hFlM2Ysi7NqA8DvyHQ="
         },
         "boxen": {
           "version": "1.1.0",
-          "from": "boxen@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/boxen/-/boxen-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/boxen/-/boxen-1.1.0.tgz",
+          "integrity": "sha1-sbad1SIwXoB6md7ud329blFnsQI="
         },
         "camelcase": {
           "version": "4.1.0",
-          "from": "camelcase@>=4.0.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
+          "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
         },
         "clean-css": {
           "version": "4.1.3",
-          "from": "clean-css@>=4.0.9 <5.0.0",
-          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.3.tgz"
+          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.3.tgz",
+          "integrity": "sha1-B8/omA7bINRV3cI6rc8eBMblCc4="
         },
         "configstore": {
           "version": "3.1.0",
-          "from": "configstore@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.0.tgz",
+          "integrity": "sha1-Rd+QcHPibfoc9LLVL1tgVF6qEdE="
         },
         "dot-prop": {
           "version": "4.1.1",
-          "from": "dot-prop@>=4.1.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-4.1.1.tgz"
+          "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-4.1.1.tgz",
+          "integrity": "sha1-qEk/C3te7sglJbXHWH+n3nyoWcE="
         },
         "findup-sync": {
           "version": "0.3.0",
-          "from": "findup-sync@>=0.3.0 <0.4.0",
           "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.3.0.tgz",
+          "integrity": "sha1-N5MKpdgWt3fANEXhlmzGeQpMCxY=",
           "dependencies": {
             "glob": {
               "version": "5.0.15",
-              "from": "glob@>=5.0.0 <5.1.0",
-              "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
+              "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
+              "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
             }
           }
         },
         "got": {
           "version": "6.7.1",
-          "from": "got@>=6.7.1 <7.0.0",
-          "resolved": "https://registry.npmjs.org/got/-/got-6.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/got/-/got-6.7.1.tgz",
+          "integrity": "sha1-JAzQV4WpoY5WHcG0S0HHY+8ejbA="
         },
         "gulp-clean-css": {
           "version": "3.0.4",
-          "from": "gulp-clean-css@>=3.0.4 <3.1.0",
-          "resolved": "https://registry.npmjs.org/gulp-clean-css/-/gulp-clean-css-3.0.4.tgz"
+          "resolved": "https://registry.npmjs.org/gulp-clean-css/-/gulp-clean-css-3.0.4.tgz",
+          "integrity": "sha1-DFrY0EVAfIjzwrnwNXCWOWfc/VQ="
         },
         "gulp-postcss": {
           "version": "6.3.0",
-          "from": "gulp-postcss@>=6.3.0 <6.4.0",
-          "resolved": "https://registry.npmjs.org/gulp-postcss/-/gulp-postcss-6.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/gulp-postcss/-/gulp-postcss-6.3.0.tgz",
+          "integrity": "sha1-M+6XI+WcMC8z1wf8S3OYsQ8DK/8="
         },
         "gulp-sass": {
           "version": "3.1.0",
-          "from": "gulp-sass@>=3.1.0 <3.2.0",
-          "resolved": "https://registry.npmjs.org/gulp-sass/-/gulp-sass-3.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/gulp-sass/-/gulp-sass-3.1.0.tgz",
+          "integrity": "sha1-U9xLaKH13f5EJKtMJHZVJpqLdLc="
         },
         "is-fullwidth-code-point": {
           "version": "2.0.0",
-          "from": "is-fullwidth-code-point@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
+          "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8="
         },
         "latest-version": {
           "version": "3.1.0",
-          "from": "latest-version@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-3.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-3.1.0.tgz",
+          "integrity": "sha1-ogU4P+oyKzO1rjsYq+4NwvNW7hU="
         },
         "lazy-req": {
           "version": "2.0.0",
-          "from": "lazy-req@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/lazy-req/-/lazy-req-2.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/lazy-req/-/lazy-req-2.0.0.tgz",
+          "integrity": "sha1-yUUKNj7N2i5vDHATKtTzf48G8rQ="
         },
         "package-json": {
           "version": "4.0.1",
-          "from": "package-json@>=4.0.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/package-json/-/package-json-4.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/package-json/-/package-json-4.0.1.tgz",
+          "integrity": "sha1-iGmgQBJTZhxMTKPabCEh7VVfXu0="
         },
         "postcss-modules": {
           "version": "0.6.4",
-          "from": "postcss-modules@>=0.6.4 <0.7.0",
-          "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.6.4.tgz"
+          "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.6.4.tgz",
+          "integrity": "sha1-d6WLt3uhtDkrJwwLWYUv116JqLQ="
         },
         "string-width": {
           "version": "2.0.0",
-          "from": "string-width@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.0.0.tgz",
+          "integrity": "sha1-Y1xUNsxypuDDh87KJ41OLuxSaH4="
         },
         "timed-out": {
           "version": "4.0.1",
-          "from": "timed-out@>=4.0.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-4.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-4.0.1.tgz",
+          "integrity": "sha1-8y6srFoXW+ol1/q1Zas+2HQe9W8="
         },
         "tslint": {
           "version": "4.5.1",
-          "from": "tslint@>=4.5.1 <4.6.0",
-          "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.5.1.tgz"
+          "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.5.1.tgz",
+          "integrity": "sha1-BTVocb7yOkNJBnNABvwYgza6gks="
         },
         "typescript": {
           "version": "2.2.2",
-          "from": "typescript@>=2.2.2 <2.3.0",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz",
+          "integrity": "sha1-YGAiUIR5tV/6NotY/uljoD39eww="
         },
         "unzip-response": {
           "version": "2.0.1",
-          "from": "unzip-response@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-2.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-2.0.1.tgz",
+          "integrity": "sha1-0vD3N9FrBhXnKmk17QQhRXLVb5c="
         },
         "update-notifier": {
           "version": "2.1.0",
-          "from": "update-notifier@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-2.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-2.1.0.tgz",
+          "integrity": "sha1-7AweU1NrdmR6JLd8uDlm2TFRI9k="
         },
         "write-file-atomic": {
           "version": "2.1.0",
-          "from": "write-file-atomic@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.1.0.tgz",
+          "integrity": "sha512-0TZ20a+xcIl4u0+Mj5xDH2yOWdmQiXlKf9Hm+TgDXjTMsEYb+gDrmb8e8UNAzMCitX8NBqG4Z/FUQIyzv/R1JQ=="
         },
         "xdg-basedir": {
           "version": "3.0.0",
-          "from": "xdg-basedir@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-3.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-3.0.0.tgz",
+          "integrity": "sha1-SWsswQnsqNus/i3HK2A8F8WHCtQ="
         }
       }
     },
     "@rush-temp/example-app-base": {
-      "version": "0.0.0",
-      "from": "projects/example-app-base",
-      "resolved": "file:projects/example-app-base",
+      "version": "file:projects/example-app-base",
       "dependencies": {
         "async": {
           "version": "0.9.2",
-          "from": "async@>=0.9.0 <0.10.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+          "bundled": true
         },
         "debug": {
           "version": "2.6.0",
-          "from": "debug@2.6.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
+          "bundled": true
         },
         "es6-promise": {
           "version": "4.1.0",
-          "from": "es6-promise@4.1.0",
-          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.0.tgz"
+          "bundled": true
         },
         "glob": {
           "version": "7.1.1",
-          "from": "glob@7.1.1",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
+          "bundled": true
         },
         "mocha": {
           "version": "3.3.0",
-          "from": "mocha@>=3.3.0 <3.4.0",
-          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz"
+          "bundled": true
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "bundled": true
         },
         "source-map": {
           "version": "0.1.43",
-          "from": "source-map@>=0.1.33 <0.2.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
+          "bundled": true
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "from": "source-map-loader@0.2.1",
-          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
+          "bundled": true
         },
         "supports-color": {
           "version": "3.1.2",
-          "from": "supports-color@3.1.2",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
+          "bundled": true
         },
         "typescript": {
           "version": "2.2.2",
-          "from": "typescript@2.2.2",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
+          "bundled": true
         }
       }
     },
     "@rush-temp/example-component": {
-      "version": "0.0.0",
-      "from": "projects/example-component",
-      "resolved": "file:projects/example-component",
+      "version": "file:projects/example-component",
       "dependencies": {
         "acorn": {
           "version": "5.0.3",
-          "from": "acorn@>=5.0.0 <6.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
+          "bundled": true
         },
         "async": {
           "version": "2.4.1",
-          "from": "async@>=2.1.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+          "bundled": true
         },
         "camelcase": {
           "version": "3.0.0",
-          "from": "camelcase@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
+          "bundled": true
         },
         "constants-browserify": {
           "version": "1.0.0",
-          "from": "constants-browserify@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
+          "bundled": true
         },
         "crypto-browserify": {
           "version": "3.11.0",
-          "from": "crypto-browserify@>=3.11.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
+          "bundled": true
         },
         "debug": {
           "version": "2.6.0",
-          "from": "debug@2.6.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
+          "bundled": true
         },
         "enhanced-resolve": {
           "version": "3.1.0",
-          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
+          "bundled": true
         },
         "glob": {
           "version": "7.1.1",
-          "from": "glob@7.1.1",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
+          "bundled": true
         },
         "https-browserify": {
           "version": "0.0.1",
-          "from": "https-browserify@0.0.1",
-          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
+          "bundled": true
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "bundled": true
         },
         "mocha": {
           "version": "3.4.2",
-          "from": "mocha@>=3.2.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.4.2.tgz"
+          "bundled": true
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "bundled": true
         },
         "node-libs-browser": {
           "version": "2.0.0",
-          "from": "node-libs-browser@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
+          "bundled": true
         },
         "os-browserify": {
           "version": "0.2.1",
-          "from": "os-browserify@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
+          "bundled": true
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "bundled": true,
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "from": "string_decoder@>=1.0.0 <1.1.0",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+              "bundled": true
             }
           }
         },
         "stream-browserify": {
           "version": "2.0.1",
-          "from": "stream-browserify@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
+          "bundled": true
         },
         "supports-color": {
           "version": "3.1.2",
-          "from": "supports-color@3.1.2",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
+          "bundled": true
         },
         "tapable": {
           "version": "0.2.6",
-          "from": "tapable@>=0.2.5 <0.3.0",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
+          "bundled": true
         },
         "timers-browserify": {
           "version": "2.0.2",
-          "from": "timers-browserify@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
+          "bundled": true
         },
         "typescript": {
           "version": "2.2.2",
-          "from": "typescript@2.2.2",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
+          "bundled": true
         },
         "url": {
           "version": "0.11.0",
-          "from": "url@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
+          "bundled": true,
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "from": "punycode@1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
+              "bundled": true
             }
           }
         },
         "watchpack": {
           "version": "1.3.1",
-          "from": "watchpack@>=1.3.1 <2.0.0",
-          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz"
+          "bundled": true
         },
         "webpack": {
           "version": "2.6.1",
-          "from": "webpack@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz"
+          "bundled": true
         },
         "yargs": {
           "version": "6.6.0",
-          "from": "yargs@>=6.0.0 <7.0.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
+          "bundled": true
         },
         "yargs-parser": {
           "version": "4.2.1",
-          "from": "yargs-parser@>=4.2.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
+          "bundled": true
         }
       }
     },
     "@rush-temp/fabric-website": {
-      "version": "0.0.0",
-      "from": "projects/fabric-website",
-      "resolved": "file:projects/fabric-website",
+      "version": "file:projects/fabric-website",
       "dependencies": {
         "async": {
           "version": "0.9.2",
-          "from": "async@>=0.9.0 <0.10.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+          "bundled": true
         },
         "debug": {
           "version": "2.6.0",
-          "from": "debug@2.6.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
+          "bundled": true
         },
         "es6-promise": {
           "version": "4.1.0",
-          "from": "es6-promise@4.1.0",
-          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.0.tgz"
+          "bundled": true
         },
         "glob": {
           "version": "7.1.1",
-          "from": "glob@7.1.1",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
+          "bundled": true
         },
         "mocha": {
           "version": "3.3.0",
-          "from": "mocha@>=3.3.0 <3.4.0",
-          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz"
+          "bundled": true
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "bundled": true
         },
         "source-map": {
           "version": "0.1.43",
-          "from": "source-map@>=0.1.33 <0.2.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
+          "bundled": true
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "from": "source-map-loader@0.2.1",
-          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
+          "bundled": true
         },
         "supports-color": {
           "version": "3.1.2",
-          "from": "supports-color@3.1.2",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
+          "bundled": true
         },
         "typescript": {
           "version": "2.2.2",
-          "from": "typescript@2.2.2",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
+          "bundled": true
         }
       }
     },
     "@rush-temp/office-ui-fabric-react": {
-      "version": "0.0.0",
-      "from": "projects/office-ui-fabric-react",
-      "resolved": "file:projects/office-ui-fabric-react",
+      "version": "file:projects/office-ui-fabric-react",
       "dependencies": {
         "acorn": {
           "version": "5.0.3",
-          "from": "acorn@>=5.0.0 <6.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
+          "bundled": true
         },
         "async": {
           "version": "0.9.2",
-          "from": "async@>=0.9.0 <0.10.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+          "bundled": true
         },
         "camelcase": {
           "version": "3.0.0",
-          "from": "camelcase@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
+          "bundled": true
         },
         "constants-browserify": {
           "version": "1.0.0",
-          "from": "constants-browserify@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
+          "bundled": true
         },
         "crypto-browserify": {
           "version": "3.11.0",
-          "from": "crypto-browserify@>=3.11.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
+          "bundled": true
         },
         "debug": {
           "version": "2.6.0",
-          "from": "debug@2.6.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
+          "bundled": true
         },
         "enhanced-resolve": {
           "version": "3.1.0",
-          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
+          "bundled": true
         },
         "es6-promise": {
           "version": "4.1.0",
-          "from": "es6-promise@4.1.0",
-          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.0.tgz"
+          "bundled": true
         },
         "glob": {
           "version": "7.1.1",
-          "from": "glob@7.1.1",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
+          "bundled": true
         },
         "https-browserify": {
           "version": "0.0.1",
-          "from": "https-browserify@0.0.1",
-          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
+          "bundled": true
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "bundled": true
         },
         "mocha": {
           "version": "3.4.2",
-          "from": "mocha@>=3.2.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.4.2.tgz"
+          "bundled": true
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "bundled": true
         },
         "node-libs-browser": {
           "version": "2.0.0",
-          "from": "node-libs-browser@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
+          "bundled": true
         },
         "os-browserify": {
           "version": "0.2.1",
-          "from": "os-browserify@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
+          "bundled": true
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "bundled": true,
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "from": "string_decoder@>=1.0.0 <1.1.0",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+              "bundled": true
             }
           }
         },
         "source-map": {
           "version": "0.1.43",
-          "from": "source-map@>=0.1.33 <0.2.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
+          "bundled": true
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "from": "source-map-loader@0.2.1",
-          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
+          "bundled": true
         },
         "stream-browserify": {
           "version": "2.0.1",
-          "from": "stream-browserify@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
+          "bundled": true
         },
         "supports-color": {
           "version": "3.1.2",
-          "from": "supports-color@3.1.2",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
+          "bundled": true
         },
         "tapable": {
           "version": "0.2.6",
-          "from": "tapable@>=0.2.5 <0.3.0",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
+          "bundled": true
         },
         "timers-browserify": {
           "version": "2.0.2",
-          "from": "timers-browserify@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
+          "bundled": true
         },
         "typescript": {
           "version": "2.2.2",
-          "from": "typescript@2.2.2",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
+          "bundled": true
         },
         "url": {
           "version": "0.11.0",
-          "from": "url@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
+          "bundled": true,
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "from": "punycode@1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
+              "bundled": true
             }
           }
         },
         "watchpack": {
           "version": "1.3.1",
-          "from": "watchpack@>=1.3.1 <2.0.0",
-          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz",
+          "bundled": true,
           "dependencies": {
             "async": {
               "version": "2.4.1",
-              "from": "async@>=2.1.2 <3.0.0",
-              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+              "bundled": true
             }
           }
         },
         "webpack": {
           "version": "2.6.1",
-          "from": "webpack@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz",
+          "bundled": true,
           "dependencies": {
             "async": {
               "version": "2.4.1",
-              "from": "async@>=2.1.2 <3.0.0",
-              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+              "bundled": true
             },
             "source-map": {
               "version": "0.5.6",
-              "from": "source-map@^0.5.3",
-              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
+              "bundled": true
             }
           }
         },
         "yargs": {
           "version": "6.6.0",
-          "from": "yargs@>=6.0.0 <7.0.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
+          "bundled": true
         },
         "yargs-parser": {
           "version": "4.2.1",
-          "from": "yargs-parser@>=4.2.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
+          "bundled": true
         }
       }
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
-      "version": "0.0.0",
-      "from": "projects/office-ui-fabric-react-tslint",
-      "resolved": "file:projects/office-ui-fabric-react-tslint"
+      "version": "file:projects/office-ui-fabric-react-tslint"
     },
     "@rush-temp/ssr-tests": {
-      "version": "0.0.0",
-      "from": "projects/ssr-tests",
-      "resolved": "file:projects/ssr-tests",
+      "version": "file:projects/ssr-tests",
       "dependencies": {
         "acorn": {
           "version": "5.0.3",
-          "from": "acorn@>=5.0.0 <6.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
+          "bundled": true
         },
         "async": {
           "version": "2.4.1",
-          "from": "async@>=2.1.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+          "bundled": true
         },
         "camelcase": {
           "version": "3.0.0",
-          "from": "camelcase@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
+          "bundled": true
         },
         "constants-browserify": {
           "version": "1.0.0",
-          "from": "constants-browserify@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
+          "bundled": true
         },
         "crypto-browserify": {
           "version": "3.11.0",
-          "from": "crypto-browserify@>=3.11.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
+          "bundled": true
         },
         "debug": {
           "version": "2.6.0",
-          "from": "debug@2.6.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
+          "bundled": true
         },
         "enhanced-resolve": {
           "version": "3.1.0",
-          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
+          "bundled": true
         },
         "es6-promise": {
           "version": "4.1.0",
-          "from": "es6-promise@>=4.1.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.0.tgz"
+          "bundled": true
         },
         "glob": {
           "version": "7.1.1",
-          "from": "glob@7.1.1",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
+          "bundled": true
         },
         "https-browserify": {
           "version": "0.0.1",
-          "from": "https-browserify@0.0.1",
-          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
+          "bundled": true
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "bundled": true
         },
         "mocha": {
           "version": "3.3.0",
-          "from": "mocha@>=3.3.0 <3.4.0",
-          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz"
+          "bundled": true
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "bundled": true
         },
         "node-libs-browser": {
           "version": "2.0.0",
-          "from": "node-libs-browser@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
+          "bundled": true
         },
         "os-browserify": {
           "version": "0.2.1",
-          "from": "os-browserify@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
+          "bundled": true
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "bundled": true,
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "from": "string_decoder@>=1.0.0 <1.1.0",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+              "bundled": true
             }
           }
         },
         "stream-browserify": {
           "version": "2.0.1",
-          "from": "stream-browserify@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
+          "bundled": true
         },
         "supports-color": {
           "version": "3.1.2",
-          "from": "supports-color@3.1.2",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
+          "bundled": true
         },
         "tapable": {
           "version": "0.2.6",
-          "from": "tapable@>=0.2.5 <0.3.0",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
+          "bundled": true
         },
         "timers-browserify": {
           "version": "2.0.2",
-          "from": "timers-browserify@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
+          "bundled": true
         },
         "url": {
           "version": "0.11.0",
-          "from": "url@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
+          "bundled": true,
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "from": "punycode@1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
+              "bundled": true
             }
           }
         },
         "watchpack": {
           "version": "1.3.1",
-          "from": "watchpack@>=1.3.1 <2.0.0",
-          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz"
+          "bundled": true
         },
         "webpack": {
           "version": "2.6.1",
-          "from": "webpack@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz"
+          "bundled": true
         },
         "yargs": {
           "version": "6.6.0",
-          "from": "yargs@>=6.0.0 <7.0.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
+          "bundled": true
         },
         "yargs-parser": {
           "version": "4.2.1",
-          "from": "yargs-parser@>=4.2.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
+          "bundled": true
         }
       }
     },
     "@rush-temp/styling": {
-      "version": "0.0.0",
-      "from": "projects/styling",
-      "resolved": "file:projects/styling",
+      "version": "file:projects/styling",
       "dependencies": {
         "acorn": {
           "version": "5.0.3",
-          "from": "acorn@>=5.0.0 <6.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
+          "bundled": true
         },
         "async": {
           "version": "0.9.2",
-          "from": "async@>=0.9.0 <0.10.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+          "bundled": true
         },
         "camelcase": {
           "version": "3.0.0",
-          "from": "camelcase@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
+          "bundled": true
         },
         "constants-browserify": {
           "version": "1.0.0",
-          "from": "constants-browserify@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
+          "bundled": true
         },
         "crypto-browserify": {
           "version": "3.11.0",
-          "from": "crypto-browserify@>=3.11.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
+          "bundled": true
         },
         "debug": {
           "version": "2.6.0",
-          "from": "debug@2.6.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
+          "bundled": true
         },
         "enhanced-resolve": {
           "version": "3.1.0",
-          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
+          "bundled": true
         },
         "es6-promise": {
           "version": "4.1.0",
-          "from": "es6-promise@4.1.0",
-          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.0.tgz"
+          "bundled": true
         },
         "glob": {
           "version": "7.1.1",
-          "from": "glob@7.1.1",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
+          "bundled": true
         },
         "https-browserify": {
           "version": "0.0.1",
-          "from": "https-browserify@0.0.1",
-          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
+          "bundled": true
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "bundled": true
         },
         "mocha": {
           "version": "3.4.2",
-          "from": "mocha@>=3.2.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.4.2.tgz"
+          "bundled": true
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "bundled": true
         },
         "node-libs-browser": {
           "version": "2.0.0",
-          "from": "node-libs-browser@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
+          "bundled": true
         },
         "os-browserify": {
           "version": "0.2.1",
-          "from": "os-browserify@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
+          "bundled": true
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "bundled": true,
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "from": "string_decoder@>=1.0.0 <1.1.0",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+              "bundled": true
             }
           }
         },
         "source-map": {
           "version": "0.1.43",
-          "from": "source-map@>=0.1.33 <0.2.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
+          "bundled": true
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "from": "source-map-loader@>=0.2.1 <0.3.0",
-          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
+          "bundled": true
         },
         "stream-browserify": {
           "version": "2.0.1",
-          "from": "stream-browserify@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
+          "bundled": true
         },
         "supports-color": {
           "version": "3.1.2",
-          "from": "supports-color@3.1.2",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
+          "bundled": true
         },
         "tapable": {
           "version": "0.2.6",
-          "from": "tapable@>=0.2.5 <0.3.0",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
+          "bundled": true
         },
         "timers-browserify": {
           "version": "2.0.2",
-          "from": "timers-browserify@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
+          "bundled": true
         },
         "typescript": {
           "version": "2.2.2",
-          "from": "typescript@2.2.2",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
+          "bundled": true
         },
         "url": {
           "version": "0.11.0",
-          "from": "url@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
+          "bundled": true,
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "from": "punycode@1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
+              "bundled": true
             }
           }
         },
         "watchpack": {
           "version": "1.3.1",
-          "from": "watchpack@>=1.3.1 <2.0.0",
-          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz",
+          "bundled": true,
           "dependencies": {
             "async": {
               "version": "2.4.1",
-              "from": "async@>=2.1.2 <3.0.0",
-              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+              "bundled": true
             }
           }
         },
         "webpack": {
           "version": "2.6.1",
-          "from": "webpack@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz",
+          "bundled": true,
           "dependencies": {
             "async": {
               "version": "2.4.1",
-              "from": "async@>=2.1.2 <3.0.0",
-              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+              "bundled": true
             },
             "source-map": {
               "version": "0.5.6",
-              "from": "source-map@^0.5.3",
-              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
+              "bundled": true
             }
           }
         },
         "yargs": {
           "version": "6.6.0",
-          "from": "yargs@>=6.0.0 <7.0.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
+          "bundled": true
         },
         "yargs-parser": {
           "version": "4.2.1",
-          "from": "yargs-parser@>=4.2.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
+          "bundled": true
         }
       }
     },
     "@rush-temp/test-bundle-button": {
-      "version": "0.0.0",
-      "from": "projects/test-bundle-button",
-      "resolved": "file:projects/test-bundle-button",
+      "version": "file:projects/test-bundle-button",
       "dependencies": {
         "async": {
           "version": "0.9.2",
-          "from": "async@>=0.9.0 <0.10.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+          "bundled": true
         },
         "source-map": {
           "version": "0.1.43",
-          "from": "source-map@>=0.1.33 <0.2.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
+          "bundled": true
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "from": "source-map-loader@>=0.2.1 <0.3.0",
-          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
+          "bundled": true
         }
       }
     },
     "@rush-temp/todo-app": {
-      "version": "0.0.0",
-      "from": "projects/todo-app",
-      "resolved": "file:projects/todo-app",
+      "version": "file:projects/todo-app",
       "dependencies": {
         "es6-promise": {
           "version": "4.1.0",
-          "from": "es6-promise@>=4.1.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.0.tgz"
+          "bundled": true
         },
         "typescript": {
           "version": "2.2.2",
-          "from": "typescript@2.2.2",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
+          "bundled": true
         }
       }
     },
     "@rush-temp/utilities": {
-      "version": "0.0.0",
-      "from": "projects/utilities",
-      "resolved": "file:projects/utilities",
+      "version": "file:projects/utilities",
       "dependencies": {
         "async": {
           "version": "0.9.2",
-          "from": "async@>=0.9.0 <0.10.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+          "bundled": true
         },
         "debug": {
           "version": "2.6.0",
-          "from": "debug@2.6.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
+          "bundled": true
         },
         "es6-promise": {
           "version": "4.1.0",
-          "from": "es6-promise@4.1.0",
-          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.0.tgz"
+          "bundled": true
         },
         "glob": {
           "version": "7.1.1",
-          "from": "glob@7.1.1",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
+          "bundled": true
         },
         "mocha": {
           "version": "3.3.0",
-          "from": "mocha@>=3.3.0 <3.4.0",
-          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz"
+          "bundled": true
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "bundled": true
         },
         "source-map": {
           "version": "0.1.43",
-          "from": "source-map@>=0.1.33 <0.2.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
+          "bundled": true
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "from": "source-map-loader@>=0.2.1 <0.3.0",
-          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
+          "bundled": true
         },
         "supports-color": {
           "version": "3.1.2",
-          "from": "supports-color@3.1.2",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
+          "bundled": true
         },
         "typescript": {
           "version": "2.2.2",
-          "from": "typescript@2.2.2",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
+          "bundled": true
         }
       }
     },
     "@types/assertion-error": {
       "version": "1.0.30",
-      "from": "@types/assertion-error@1.0.30",
-      "resolved": "https://registry.npmjs.org/@types/assertion-error/-/assertion-error-1.0.30.tgz"
+      "resolved": "https://registry.npmjs.org/@types/assertion-error/-/assertion-error-1.0.30.tgz",
+      "integrity": "sha1-89DV2i7Ie1FOMNs/+aAYh7VhnCk="
     },
     "@types/bluebird": {
       "version": "3.5.4",
-      "from": "@types/bluebird@*",
-      "resolved": "https://registry.npmjs.org/@types/bluebird/-/bluebird-3.5.4.tgz"
+      "resolved": "https://registry.npmjs.org/@types/bluebird/-/bluebird-3.5.4.tgz",
+      "integrity": "sha1-8SAWKwT9bVXhA0bX4ulu7UYrAs8="
     },
     "@types/chai": {
       "version": "3.5.2",
-      "from": "@types/chai@>=3.4.35 <4.0.0",
-      "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.5.2.tgz"
+      "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.5.2.tgz",
+      "integrity": "sha1-wRzSgX06QBt7oPWkIPNcVhObHB4="
     },
     "@types/chalk": {
       "version": "0.4.31",
-      "from": "@types/chalk@0.4.31",
-      "resolved": "https://registry.npmjs.org/@types/chalk/-/chalk-0.4.31.tgz"
+      "resolved": "https://registry.npmjs.org/@types/chalk/-/chalk-0.4.31.tgz",
+      "integrity": "sha1-ox10JBprHtu5c8822XooloNKUfk="
     },
     "@types/cheerio": {
       "version": "0.22.1",
-      "from": "@types/cheerio@*",
-      "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.1.tgz"
+      "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.1.tgz",
+      "integrity": "sha1-dAxM2MTT8wdPg7mrYucR6sLHZM4="
     },
     "@types/colors": {
       "version": "1.1.1",
-      "from": "@types/colors@1.1.1",
-      "resolved": "https://registry.npmjs.org/@types/colors/-/colors-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/@types/colors/-/colors-1.1.1.tgz",
+      "integrity": "sha1-SXM5KPtHzxElS3YR4vb4X/YCBSE="
     },
     "@types/enzyme": {
       "version": "2.8.0",
-      "from": "@types/enzyme@>=2.7.5 <3.0.0",
-      "resolved": "https://registry.npmjs.org/@types/enzyme/-/enzyme-2.8.0.tgz"
+      "resolved": "https://registry.npmjs.org/@types/enzyme/-/enzyme-2.8.0.tgz",
+      "integrity": "sha1-hMYgTPiYMSI6iattw/SQseCIY1I="
     },
     "@types/es6-collections": {
       "version": "0.5.29",
-      "from": "@types/es6-collections@0.5.29",
-      "resolved": "https://registry.npmjs.org/@types/es6-collections/-/es6-collections-0.5.29.tgz"
+      "resolved": "https://registry.npmjs.org/@types/es6-collections/-/es6-collections-0.5.29.tgz",
+      "integrity": "sha1-7CKDH36N5zY3vxVmD52MomlGmA0="
     },
     "@types/es6-promise": {
       "version": "0.0.32",
-      "from": "@types/es6-promise@>=0.0.32 <0.0.33",
-      "resolved": "https://registry.npmjs.org/@types/es6-promise/-/es6-promise-0.0.32.tgz"
+      "resolved": "https://registry.npmjs.org/@types/es6-promise/-/es6-promise-0.0.32.tgz",
+      "integrity": "sha1-O89E+x5Cnz33YYjIxth0Rjujcf0="
     },
     "@types/express": {
       "version": "4.0.35",
-      "from": "@types/express@*",
-      "resolved": "https://registry.npmjs.org/@types/express/-/express-4.0.35.tgz"
+      "resolved": "https://registry.npmjs.org/@types/express/-/express-4.0.35.tgz",
+      "integrity": "sha1-YmfHtgpR+sRzRns8SgLNHkQYBf4="
     },
     "@types/express-serve-static-core": {
       "version": "4.0.45",
-      "from": "@types/express-serve-static-core@*",
-      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.0.45.tgz"
+      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.0.45.tgz",
+      "integrity": "sha1-cbsfh9cYdILQ2IUfWylEWOHHhmc="
     },
     "@types/finalhandler": {
       "version": "0.0.31",
-      "from": "@types/finalhandler@0.0.31",
-      "resolved": "https://registry.npmjs.org/@types/finalhandler/-/finalhandler-0.0.31.tgz"
+      "resolved": "https://registry.npmjs.org/@types/finalhandler/-/finalhandler-0.0.31.tgz",
+      "integrity": "sha1-7PMvOpu0Om+0BFdQ6h5VJYLTXcM="
     },
     "@types/fs-extra": {
       "version": "0.0.37",
-      "from": "@types/fs-extra@0.0.37",
-      "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.37.tgz"
+      "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.37.tgz",
+      "integrity": "sha1-GV8RvNmhuX2eQSxrZombVFRxofc="
     },
     "@types/glob": {
       "version": "5.0.30",
-      "from": "@types/glob@5.0.30",
-      "resolved": "https://registry.npmjs.org/@types/glob/-/glob-5.0.30.tgz"
+      "resolved": "https://registry.npmjs.org/@types/glob/-/glob-5.0.30.tgz",
+      "integrity": "sha1-ECZAnFYlqGiQdGAoCNCCsoZ7ilE="
     },
     "@types/gulp": {
       "version": "3.8.32",
-      "from": "@types/gulp@3.8.32",
-      "resolved": "https://registry.npmjs.org/@types/gulp/-/gulp-3.8.32.tgz"
+      "resolved": "https://registry.npmjs.org/@types/gulp/-/gulp-3.8.32.tgz",
+      "integrity": "sha1-g8WcaBzCM9Hsf4LSaVVVZvoTMVY="
     },
     "@types/gulp-replace": {
       "version": "0.0.29",
-      "from": "@types/gulp-replace@0.0.29",
-      "resolved": "https://registry.npmjs.org/@types/gulp-replace/-/gulp-replace-0.0.29.tgz"
+      "resolved": "https://registry.npmjs.org/@types/gulp-replace/-/gulp-replace-0.0.29.tgz",
+      "integrity": "sha1-gFqGw0pcz8+IS8E24GgzHkj5tls="
     },
     "@types/gulp-util": {
       "version": "3.0.30",
-      "from": "@types/gulp-util@3.0.30",
-      "resolved": "https://registry.npmjs.org/@types/gulp-util/-/gulp-util-3.0.30.tgz"
+      "resolved": "https://registry.npmjs.org/@types/gulp-util/-/gulp-util-3.0.30.tgz",
+      "integrity": "sha1-TF9lg6IWCBOWZ+OsVrBbxn7PqPs="
     },
     "@types/karma": {
       "version": "0.13.33",
-      "from": "@types/karma@0.13.33",
-      "resolved": "https://registry.npmjs.org/@types/karma/-/karma-0.13.33.tgz"
+      "resolved": "https://registry.npmjs.org/@types/karma/-/karma-0.13.33.tgz",
+      "integrity": "sha1-ODXT2U6IS23oiEo+cKb1aQ5qWFA="
     },
     "@types/lodash": {
       "version": "4.14.52",
-      "from": "@types/lodash@4.14.52",
-      "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.52.tgz"
+      "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.52.tgz",
+      "integrity": "sha1-3lx6sU2hKJczIzybDsb543fbkPU="
     },
     "@types/log4js": {
       "version": "0.0.32",
-      "from": "@types/log4js@*",
-      "resolved": "https://registry.npmjs.org/@types/log4js/-/log4js-0.0.32.tgz"
+      "resolved": "https://registry.npmjs.org/@types/log4js/-/log4js-0.0.32.tgz",
+      "integrity": "sha1-wVYhz6lvkuxrDPtJCWvdI82JPHw="
     },
     "@types/merge2": {
       "version": "0.3.29",
-      "from": "@types/merge2@0.3.29",
-      "resolved": "https://registry.npmjs.org/@types/merge2/-/merge2-0.3.29.tgz"
+      "resolved": "https://registry.npmjs.org/@types/merge2/-/merge2-0.3.29.tgz",
+      "integrity": "sha1-y1UumCbKPAjZ5lSd6ezY8VQX8G0="
     },
     "@types/mime": {
       "version": "0.0.29",
-      "from": "@types/mime@*",
-      "resolved": "https://registry.npmjs.org/@types/mime/-/mime-0.0.29.tgz"
+      "resolved": "https://registry.npmjs.org/@types/mime/-/mime-0.0.29.tgz",
+      "integrity": "sha1-+8/TMFc7kS71nu7hRgK/rOYwdUs="
     },
     "@types/minimatch": {
       "version": "2.0.29",
-      "from": "@types/minimatch@*",
-      "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-2.0.29.tgz"
+      "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-2.0.29.tgz",
+      "integrity": "sha1-UALhT3Xi1x5WQoHfBDHIwbSio2o="
     },
     "@types/mkdirp": {
       "version": "0.3.29",
-      "from": "@types/mkdirp@0.3.29",
-      "resolved": "https://registry.npmjs.org/@types/mkdirp/-/mkdirp-0.3.29.tgz"
+      "resolved": "https://registry.npmjs.org/@types/mkdirp/-/mkdirp-0.3.29.tgz",
+      "integrity": "sha1-fyrX7FX5FEgvybHsS7GuYCjUYGY="
     },
     "@types/mocha": {
       "version": "2.2.41",
-      "from": "@types/mocha@>=2.2.39 <3.0.0",
-      "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.41.tgz"
+      "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.41.tgz",
+      "integrity": "sha1-4nzwgXFT658nE7LT9saPHhw8pgg="
     },
     "@types/node": {
       "version": "6.0.62",
-      "from": "@types/node@6.0.62",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.62.tgz"
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.62.tgz",
+      "integrity": "sha1-hSIsB3tU8ltXQXu3CLn4d72jf4k="
     },
     "@types/node-notifier": {
       "version": "0.0.28",
-      "from": "@types/node-notifier@0.0.28",
-      "resolved": "https://registry.npmjs.org/@types/node-notifier/-/node-notifier-0.0.28.tgz"
+      "resolved": "https://registry.npmjs.org/@types/node-notifier/-/node-notifier-0.0.28.tgz",
+      "integrity": "sha1-hro9OqjZGDUswxkdiN4yiyDck8E="
     },
     "@types/node-uuid": {
       "version": "0.0.28",
-      "from": "@types/node-uuid@0.0.28",
-      "resolved": "https://registry.npmjs.org/@types/node-uuid/-/node-uuid-0.0.28.tgz"
+      "resolved": "https://registry.npmjs.org/@types/node-uuid/-/node-uuid-0.0.28.tgz",
+      "integrity": "sha1-QWVbXOY7LzN0xOgmtN0h5ykFjj0="
     },
     "@types/orchestrator": {
       "version": "0.0.30",
-      "from": "@types/orchestrator@0.0.30",
-      "resolved": "https://registry.npmjs.org/@types/orchestrator/-/orchestrator-0.0.30.tgz"
+      "resolved": "https://registry.npmjs.org/@types/orchestrator/-/orchestrator-0.0.30.tgz",
+      "integrity": "sha1-3N2o1ke1aLex40F4yx8LRKyamOU="
     },
     "@types/prop-types": {
       "version": "15.5.1",
-      "from": "@types/prop-types@>=15.5.1 <16.0.0",
-      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.5.1.tgz"
+      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.5.1.tgz",
+      "integrity": "sha1-Hs9SYhKZ5luFU3Qzf7Ef0tEGb8E="
     },
     "@types/q": {
       "version": "0.0.32",
-      "from": "@types/q@0.0.32",
-      "resolved": "https://registry.npmjs.org/@types/q/-/q-0.0.32.tgz"
+      "resolved": "https://registry.npmjs.org/@types/q/-/q-0.0.32.tgz",
+      "integrity": "sha1-vShOV8hPEyXacCur/IKlMoGQwMU="
     },
     "@types/react": {
       "version": "15.0.25",
-      "from": "@types/react@>=15.0.25 <16.0.0",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.25.tgz"
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.25.tgz",
+      "integrity": "sha1-05aUnMzJqQthdV3vl4HlrO2bImE="
     },
     "@types/react-addons-test-utils": {
       "version": "0.14.18",
-      "from": "@types/react-addons-test-utils@>=0.14.18 <0.15.0",
-      "resolved": "https://registry.npmjs.org/@types/react-addons-test-utils/-/react-addons-test-utils-0.14.18.tgz"
+      "resolved": "https://registry.npmjs.org/@types/react-addons-test-utils/-/react-addons-test-utils-0.14.18.tgz",
+      "integrity": "sha1-g+EK8dvl7CU1vC3FNz17w7gv3uE="
     },
     "@types/react-dom": {
       "version": "15.5.0",
-      "from": "@types/react-dom@>=15.5.0 <16.0.0",
-      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-15.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-15.5.0.tgz",
+      "integrity": "sha1-f0+5YT1AURQXcyQve2tfGkazS9k="
     },
     "@types/resemblejs": {
       "version": "1.3.28",
-      "from": "@types/resemblejs@>=1.3.28 <1.4.0",
-      "resolved": "https://registry.npmjs.org/@types/resemblejs/-/resemblejs-1.3.28.tgz"
+      "resolved": "https://registry.npmjs.org/@types/resemblejs/-/resemblejs-1.3.28.tgz",
+      "integrity": "sha1-Lg2ztf2w8vPUVPXXLhMkEgnql60="
     },
     "@types/resolve": {
       "version": "0.0.4",
-      "from": "@types/resolve@0.0.4",
-      "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-0.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-0.0.4.tgz",
+      "integrity": "sha1-m1htZalH3qiMS8JNoLkF/pUgoNU="
     },
     "@types/rimraf": {
       "version": "0.0.28",
-      "from": "@types/rimraf@0.0.28",
-      "resolved": "https://registry.npmjs.org/@types/rimraf/-/rimraf-0.0.28.tgz"
+      "resolved": "https://registry.npmjs.org/@types/rimraf/-/rimraf-0.0.28.tgz",
+      "integrity": "sha1-VWJRm8eWPKyoq/fxKMrjtZTUHQY="
     },
     "@types/semver": {
       "version": "5.3.31",
-      "from": "@types/semver@5.3.31",
-      "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.31.tgz"
+      "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.31.tgz",
+      "integrity": "sha1-uZnX2TX0P1IHsBsA094ghS9Mp18="
     },
     "@types/serve-static": {
       "version": "1.7.31",
-      "from": "@types/serve-static@1.7.31",
-      "resolved": "https://registry.npmjs.org/@types/serve-static/-/serve-static-1.7.31.tgz"
+      "resolved": "https://registry.npmjs.org/@types/serve-static/-/serve-static-1.7.31.tgz",
+      "integrity": "sha1-FUVt6NmNa0z/Mb5savdJKuY/Uho="
     },
     "@types/sinon": {
       "version": "2.2.2",
-      "from": "@types/sinon@>=2.2.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/@types/sinon/-/sinon-2.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/@types/sinon/-/sinon-2.2.2.tgz",
+      "integrity": "sha1-qA2khougisysvOTTcnbzXhugpS8="
     },
     "@types/source-map": {
       "version": "0.5.0",
-      "from": "@types/source-map@*",
-      "resolved": "https://registry.npmjs.org/@types/source-map/-/source-map-0.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/@types/source-map/-/source-map-0.5.0.tgz",
+      "integrity": "sha1-3TS72OMv5OdPLj2KwH+KpbRaR6w="
     },
     "@types/through2": {
       "version": "2.0.32",
-      "from": "@types/through2@2.0.32",
-      "resolved": "https://registry.npmjs.org/@types/through2/-/through2-2.0.32.tgz"
+      "resolved": "https://registry.npmjs.org/@types/through2/-/through2-2.0.32.tgz",
+      "integrity": "sha1-RwAkRQ8at2QPGfnr9C09pXTCYSk="
     },
     "@types/uglify-js": {
       "version": "2.6.28",
-      "from": "@types/uglify-js@*",
-      "resolved": "https://registry.npmjs.org/@types/uglify-js/-/uglify-js-2.6.28.tgz"
+      "resolved": "https://registry.npmjs.org/@types/uglify-js/-/uglify-js-2.6.28.tgz",
+      "integrity": "sha1-FJm0jKOkQTIlCzGM3eJbj0XwxhY="
     },
     "@types/vinyl": {
       "version": "1.2.30",
-      "from": "@types/vinyl@1.2.30",
-      "resolved": "https://registry.npmjs.org/@types/vinyl/-/vinyl-1.2.30.tgz"
+      "resolved": "https://registry.npmjs.org/@types/vinyl/-/vinyl-1.2.30.tgz",
+      "integrity": "sha1-kRXAxFxAxXVziQa+n7Tfb1ueUBM="
     },
     "@types/webpack": {
       "version": "1.12.36",
-      "from": "@types/webpack@1.12.36",
-      "resolved": "https://registry.npmjs.org/@types/webpack/-/webpack-1.12.36.tgz"
+      "resolved": "https://registry.npmjs.org/@types/webpack/-/webpack-1.12.36.tgz",
+      "integrity": "sha1-RjSfb7NFSe9HKpbFzsAwpUTyaSQ="
     },
     "@types/webpack-env": {
       "version": "1.13.0",
-      "from": "@types/webpack-env@>=1.13.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/@types/webpack-env/-/webpack-env-1.13.0.tgz"
+      "resolved": "https://registry.npmjs.org/@types/webpack-env/-/webpack-env-1.13.0.tgz",
+      "integrity": "sha1-MEQ4FkfhHulzxa8uklMjkw9pHYA="
     },
     "@types/webpack-stream": {
       "version": "3.2.5",
-      "from": "@types/webpack-stream@3.2.5",
-      "resolved": "https://registry.npmjs.org/@types/webpack-stream/-/webpack-stream-3.2.5.tgz"
+      "resolved": "https://registry.npmjs.org/@types/webpack-stream/-/webpack-stream-3.2.5.tgz",
+      "integrity": "sha1-iwNFN5GCGX+y2prqCpMKzgDRkJs="
     },
     "@types/whatwg-fetch": {
       "version": "0.0.30",
-      "from": "@types/whatwg-fetch@0.0.30",
-      "resolved": "https://registry.npmjs.org/@types/whatwg-fetch/-/whatwg-fetch-0.0.30.tgz"
+      "resolved": "https://registry.npmjs.org/@types/whatwg-fetch/-/whatwg-fetch-0.0.30.tgz",
+      "integrity": "sha1-6Raex/Gv6gVsOtupnulAIy0O41s="
     },
     "@types/yargs": {
       "version": "0.0.34",
-      "from": "@types/yargs@0.0.34",
-      "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.34.tgz"
+      "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.34.tgz",
+      "integrity": "sha1-FWBCn8VQxDvEGnt9PfoK+8yRSjU="
     },
     "@types/z-schema": {
       "version": "3.16.31",
-      "from": "@types/z-schema@3.16.31",
-      "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.31.tgz"
+      "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.31.tgz",
+      "integrity": "sha1-LrHQCl5Ow/pYx2r94S4YK2bcXBw="
     },
     "@uifabric/example-app-base": {
       "version": "1.3.14",
-      "from": "@uifabric/example-app-base@>=1.3.12 <2.0.0",
       "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-1.3.14.tgz",
+      "integrity": "sha1-xme4sp7g4dyDDMBE8sFJFJe+5f4=",
       "dependencies": {
         "office-ui-fabric-core": {
           "version": "5.1.0",
-          "from": "office-ui-fabric-core@>=5.0.0 <6.0.0",
-          "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-5.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-5.1.0.tgz",
+          "integrity": "sha1-v49DCOFbNjJEwWc0WygzRRTsCSA="
         }
       }
     },
     "@uifabric/utilities": {
       "version": "1.10.2",
-      "from": "@uifabric/utilities@>=1.10.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-1.10.2.tgz"
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-1.10.2.tgz",
+      "integrity": "sha1-46chhW9rIUDPOXoNRkdwlmrScyQ="
     },
     "abbrev": {
       "version": "1.0.9",
-      "from": "abbrev@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.0.9.tgz"
+      "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.0.9.tgz",
+      "integrity": "sha1-kbR5JYinc4wl813W9jdSovh3YTU="
     },
     "accepts": {
       "version": "1.3.3",
-      "from": "accepts@1.3.3",
-      "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.3.tgz"
+      "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.3.tgz",
+      "integrity": "sha1-w8p0NJOGSMPg2cHjKN1otiLChMo="
     },
     "acorn": {
       "version": "3.3.0",
-      "from": "acorn@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-3.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-3.3.0.tgz",
+      "integrity": "sha1-ReN/s56No/JbruP/U2niu18iAXo="
     },
     "acorn-dynamic-import": {
       "version": "2.0.2",
-      "from": "acorn-dynamic-import@>=2.0.0 <3.0.0",
       "resolved": "https://registry.npmjs.org/acorn-dynamic-import/-/acorn-dynamic-import-2.0.2.tgz",
+      "integrity": "sha1-x1K9IQvvZ5UBtsbLf8hPj0cVjMQ=",
       "dependencies": {
         "acorn": {
           "version": "4.0.13",
-          "from": "acorn@>=4.0.3 <5.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz"
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
+          "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c="
         }
       }
     },
     "after": {
       "version": "0.8.2",
-      "from": "after@0.8.2",
-      "resolved": "https://registry.npmjs.org/after/-/after-0.8.2.tgz"
+      "resolved": "https://registry.npmjs.org/after/-/after-0.8.2.tgz",
+      "integrity": "sha1-/ts5T58OAqqXaOcCvaI7UF+ufh8="
     },
     "ajv": {
       "version": "4.11.8",
-      "from": "ajv@>=4.9.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz"
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz",
+      "integrity": "sha1-gv+wKynmYq5TvcIK8VlHcGc5xTY="
     },
     "ajv-keywords": {
       "version": "1.5.1",
-      "from": "ajv-keywords@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-1.5.1.tgz"
+      "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-1.5.1.tgz",
+      "integrity": "sha1-MU3QpLM2j609/NxU7eYXG4htrzw="
     },
     "align-text": {
       "version": "0.1.4",
-      "from": "align-text@>=0.1.3 <0.2.0",
-      "resolved": "https://registry.npmjs.org/align-text/-/align-text-0.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/align-text/-/align-text-0.1.4.tgz",
+      "integrity": "sha1-DNkKVhCT810KmSVsIrcGlDP60Rc="
     },
     "alphanum-sort": {
       "version": "1.0.2",
-      "from": "alphanum-sort@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/alphanum-sort/-/alphanum-sort-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/alphanum-sort/-/alphanum-sort-1.0.2.tgz",
+      "integrity": "sha1-l6ERlkmyEa0zaR2fn0hqjsn74KM="
     },
     "amdefine": {
       "version": "1.0.1",
-      "from": "amdefine@>=0.0.4",
-      "resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz",
+      "integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU="
     },
     "ansi-align": {
       "version": "1.1.0",
-      "from": "ansi-align@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-1.1.0.tgz",
+      "integrity": "sha1-LwwWWIKXOa3V67FeawxuNCPwFro="
     },
     "ansi-escapes": {
       "version": "1.4.0",
-      "from": "ansi-escapes@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz",
+      "integrity": "sha1-06ioOzGapneTZisT52HHkRQiMG4="
     },
     "ansi-html": {
       "version": "0.0.7",
-      "from": "ansi-html@0.0.7",
-      "resolved": "https://registry.npmjs.org/ansi-html/-/ansi-html-0.0.7.tgz"
+      "resolved": "https://registry.npmjs.org/ansi-html/-/ansi-html-0.0.7.tgz",
+      "integrity": "sha1-gTWEAhliqenm/QOflA0S9WynhZ4="
     },
     "ansi-regex": {
       "version": "2.1.1",
-      "from": "ansi-regex@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
+      "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
     },
     "ansi-styles": {
       "version": "2.2.1",
-      "from": "ansi-styles@>=2.2.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+      "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
     },
     "ansicolors": {
       "version": "0.2.1",
-      "from": "ansicolors@>=0.2.1 <0.3.0",
-      "resolved": "https://registry.npmjs.org/ansicolors/-/ansicolors-0.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/ansicolors/-/ansicolors-0.2.1.tgz",
+      "integrity": "sha1-vgiVmQl7dKXJxKhKDNvNtivYeu8="
     },
     "anymatch": {
       "version": "1.3.0",
-      "from": "anymatch@>=1.3.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-1.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-1.3.0.tgz",
+      "integrity": "sha1-o+Uvo5FoyCX/V7AkgSbOWo/5VQc="
     },
     "aproba": {
       "version": "1.1.1",
-      "from": "aproba@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.1.1.tgz",
+      "integrity": "sha1-ldNgDwdxCqDpKYxyatXs8urLq6s="
     },
     "archy": {
       "version": "1.0.0",
-      "from": "archy@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/archy/-/archy-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/archy/-/archy-1.0.0.tgz",
+      "integrity": "sha1-+cjBN1fMHde8N5rHeyxipcKGjEA="
     },
     "are-we-there-yet": {
       "version": "1.1.4",
-      "from": "are-we-there-yet@>=1.1.2 <1.2.0",
       "resolved": "https://registry.npmjs.org/are-we-there-yet/-/are-we-there-yet-1.1.4.tgz",
+      "integrity": "sha1-u13KOCu5TwXhUZQ3PRb9O6HKEQ0=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.6 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "argparse": {
       "version": "1.0.9",
-      "from": "argparse@>=1.0.7 <2.0.0",
       "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.9.tgz",
+      "integrity": "sha1-c9g7wmP4bpf4zE9rrhsOkKfSLIY=",
       "dependencies": {
         "sprintf-js": {
           "version": "1.0.3",
-          "from": "sprintf-js@>=1.0.2 <1.1.0",
-          "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz"
+          "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
+          "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw="
         }
       }
     },
     "arr-diff": {
       "version": "2.0.0",
-      "from": "arr-diff@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
+      "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8="
     },
     "arr-flatten": {
       "version": "1.0.3",
-      "from": "arr-flatten@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.0.3.tgz",
+      "integrity": "sha1-onTthawIhJtr14R8RYB0XcUa37E="
     },
     "array-differ": {
       "version": "1.0.0",
-      "from": "array-differ@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/array-differ/-/array-differ-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/array-differ/-/array-differ-1.0.0.tgz",
+      "integrity": "sha1-7/UuN1gknTO+QCuLuOVkuytdQDE="
     },
     "array-find-index": {
       "version": "1.0.2",
-      "from": "array-find-index@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/array-find-index/-/array-find-index-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/array-find-index/-/array-find-index-1.0.2.tgz",
+      "integrity": "sha1-3wEKoSh+Fku9pvlyOwqWoexBh6E="
     },
     "array-flatten": {
       "version": "1.1.1",
-      "from": "array-flatten@1.1.1",
-      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
+      "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI="
     },
     "array-slice": {
       "version": "0.2.3",
-      "from": "array-slice@>=0.2.3 <0.3.0",
-      "resolved": "https://registry.npmjs.org/array-slice/-/array-slice-0.2.3.tgz"
+      "resolved": "https://registry.npmjs.org/array-slice/-/array-slice-0.2.3.tgz",
+      "integrity": "sha1-3Tz7gO15c6dRF82sabC5nshhhvU="
     },
     "array-union": {
       "version": "1.0.2",
-      "from": "array-union@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz",
+      "integrity": "sha1-mjRBDk9OPaI96jdb5b5w8kd47Dk="
     },
     "array-uniq": {
       "version": "1.0.3",
-      "from": "array-uniq@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz",
+      "integrity": "sha1-r2rId6Jcx/dOBYiUdThY39sk/bY="
     },
     "array-unique": {
       "version": "0.2.1",
-      "from": "array-unique@>=0.2.1 <0.3.0",
-      "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
+      "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM="
     },
     "arraybuffer.slice": {
       "version": "0.0.6",
-      "from": "arraybuffer.slice@0.0.6",
-      "resolved": "https://registry.npmjs.org/arraybuffer.slice/-/arraybuffer.slice-0.0.6.tgz"
+      "resolved": "https://registry.npmjs.org/arraybuffer.slice/-/arraybuffer.slice-0.0.6.tgz",
+      "integrity": "sha1-8zshWfBTKj8xB6JywMz70a0peco="
     },
     "arrify": {
       "version": "1.0.1",
-      "from": "arrify@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz",
+      "integrity": "sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0="
     },
     "asap": {
       "version": "2.0.5",
-      "from": "asap@>=2.0.3 <2.1.0",
-      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.5.tgz",
+      "integrity": "sha1-UidltQw1EEkOUtfc/ghe+bqWlY8="
     },
     "asn1": {
       "version": "0.2.3",
-      "from": "asn1@>=0.2.3 <0.3.0",
-      "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.3.tgz"
+      "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.3.tgz",
+      "integrity": "sha1-2sh4dxPJlmhJ/IGAd36+nB3fO4Y="
     },
     "asn1.js": {
       "version": "4.9.1",
-      "from": "asn1.js@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-4.9.1.tgz"
+      "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-4.9.1.tgz",
+      "integrity": "sha1-SLokC0WpKA6UdImQull9IWYX/UA="
     },
     "assert": {
       "version": "1.4.1",
-      "from": "assert@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/assert/-/assert-1.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/assert/-/assert-1.4.1.tgz",
+      "integrity": "sha1-mZEtWRg2tab1s0XA8H7vwI/GXZE="
     },
     "assert-plus": {
       "version": "0.2.0",
-      "from": "assert-plus@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-0.2.0.tgz",
+      "integrity": "sha1-104bh+ev/A24qttwIfP+SBAasjQ="
     },
     "assertion-error": {
       "version": "1.0.2",
-      "from": "assertion-error@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-1.0.2.tgz",
+      "integrity": "sha1-E8pRXYYgbaC6xm6DTdOX2HWBCUw="
     },
     "ast-types": {
       "version": "0.9.6",
-      "from": "ast-types@0.9.6",
-      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.9.6.tgz"
+      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.9.6.tgz",
+      "integrity": "sha1-ECyenpAF0+fjgpvwxPok7oYu6bk="
     },
     "async": {
       "version": "1.5.2",
-      "from": "async@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz"
+      "resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz",
+      "integrity": "sha1-7GphrlZIDAw8skHJVhjiCJL5Zyo="
     },
     "async-each": {
       "version": "1.0.1",
-      "from": "async-each@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/async-each/-/async-each-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/async-each/-/async-each-1.0.1.tgz",
+      "integrity": "sha1-GdOGodntxufByF04iu28xW0zYC0="
     },
     "async-foreach": {
       "version": "0.1.3",
-      "from": "async-foreach@>=0.1.3 <0.2.0",
-      "resolved": "https://registry.npmjs.org/async-foreach/-/async-foreach-0.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/async-foreach/-/async-foreach-0.1.3.tgz",
+      "integrity": "sha1-NhIfhFwFeBct5Bmpfb6x0W7DRUI="
     },
     "asynckit": {
       "version": "0.4.0",
-      "from": "asynckit@>=0.4.0 <0.5.0",
-      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
+      "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k="
     },
     "autoprefixer": {
       "version": "6.7.7",
-      "from": "autoprefixer@>=6.7.6 <7.0.0",
       "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.7.7.tgz",
+      "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ=",
       "dependencies": {
         "browserslist": {
           "version": "1.7.7",
-          "from": "browserslist@>=1.7.6 <2.0.0",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz"
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
+          "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk="
         }
       }
     },
     "aws-sign2": {
       "version": "0.6.0",
-      "from": "aws-sign2@>=0.6.0 <0.7.0",
-      "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz",
+      "integrity": "sha1-FDQt0428yU0OW4fXY81jYSwOeU8="
     },
     "aws4": {
       "version": "1.6.0",
-      "from": "aws4@>=1.2.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.6.0.tgz",
+      "integrity": "sha1-g+9cqGCysy5KDe7e6MdxudtXRx4="
     },
     "azure-storage": {
       "version": "0.10.0",
-      "from": "azure-storage@>=0.10.0 <0.11.0",
       "resolved": "https://registry.npmjs.org/azure-storage/-/azure-storage-0.10.0.tgz",
+      "integrity": "sha1-QsV7ty1vM+u3jS2VTds99Jp1sro=",
       "dependencies": {
         "async": {
           "version": "2.4.1",
-          "from": "async@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
+          "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c="
         },
         "caseless": {
           "version": "0.11.0",
-          "from": "caseless@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz"
+          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz",
+          "integrity": "sha1-cVuW6phBWTzDMGeSP17GDr2k99c="
         },
         "extend": {
           "version": "1.2.1",
-          "from": "extend@>=1.2.1 <1.3.0",
-          "resolved": "https://registry.npmjs.org/extend/-/extend-1.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/extend/-/extend-1.2.1.tgz",
+          "integrity": "sha1-oPX9bPyDpf5J72mNYOyKYk3UV2w="
         },
         "form-data": {
           "version": "1.0.1",
-          "from": "form-data@>=1.0.0-rc3 <1.1.0",
-          "resolved": "https://registry.npmjs.org/form-data/-/form-data-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/form-data/-/form-data-1.0.1.tgz",
+          "integrity": "sha1-rjFduaSQf6BlUCMEpm13M0de43w="
         },
         "har-validator": {
           "version": "2.0.6",
-          "from": "har-validator@>=2.0.6 <2.1.0",
-          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz"
+          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz",
+          "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0="
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "node-uuid": {
           "version": "1.4.8",
-          "from": "node-uuid@~1.4.0",
-          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz"
+          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz",
+          "integrity": "sha1-sEDrCSOWivq/jTL7HxfxFn/auQc="
         },
         "qs": {
           "version": "6.0.4",
-          "from": "qs@>=6.0.2 <6.1.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-6.0.4.tgz"
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.0.4.tgz",
+          "integrity": "sha1-UQGdhHIMk5uCc36EVWp4Izjs6ns="
         },
         "readable-stream": {
           "version": "2.0.6",
-          "from": "readable-stream@>=2.0.0 <2.1.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz",
+          "integrity": "sha1-j5A0HmilPMySh4jaz80Rs265t44="
         },
         "request": {
           "version": "2.69.0",
-          "from": "request@>=2.69.0 <2.70.0",
           "resolved": "https://registry.npmjs.org/request/-/request-2.69.0.tgz",
+          "integrity": "sha1-z5HS4AB1KxIXFVwAUkGRGZGiNGo=",
           "dependencies": {
             "extend": {
               "version": "3.0.1",
-              "from": "extend@~3.0.0",
-              "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz"
+              "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz",
+              "integrity": "sha1-p1Xqe8Gt/MWjHOfnYtuq3F5jZEQ="
             }
           }
         },
         "tough-cookie": {
           "version": "2.2.2",
-          "from": "tough-cookie@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.2.2.tgz"
+          "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.2.2.tgz",
+          "integrity": "sha1-yDoYMPTl7wuT7yo0iOck+N4Basc="
         },
         "tunnel-agent": {
           "version": "0.4.3",
-          "from": "tunnel-agent@>=0.4.1 <0.5.0",
-          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz"
+          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz",
+          "integrity": "sha1-Y3PbdpCf5XDgjXNYM2Xtgop07us="
         },
         "validator": {
           "version": "3.22.2",
-          "from": "validator@>=3.22.2 <3.23.0",
-          "resolved": "https://registry.npmjs.org/validator/-/validator-3.22.2.tgz"
+          "resolved": "https://registry.npmjs.org/validator/-/validator-3.22.2.tgz",
+          "integrity": "sha1-byl65n9/gqzHbQr9tJ8Y2aCcGMA="
         }
       }
     },
     "babel-code-frame": {
       "version": "6.22.0",
-      "from": "babel-code-frame@>=6.11.0 <7.0.0",
-      "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.22.0.tgz"
+      "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.22.0.tgz",
+      "integrity": "sha1-AnYgvuVnqIwyVhV05/0IAdMxGOQ="
     },
     "babel-runtime": {
       "version": "6.23.0",
-      "from": "babel-runtime@>=6.18.0 <7.0.0",
-      "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.23.0.tgz"
+      "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.23.0.tgz",
+      "integrity": "sha1-CpSJ8UTecO+zzkMArM2zKeL8VDs="
     },
     "backo2": {
       "version": "1.0.2",
-      "from": "backo2@1.0.2",
-      "resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz",
+      "integrity": "sha1-MasayLEpNjRj41s+u2n038+6eUc="
     },
     "balanced-match": {
       "version": "0.4.2",
-      "from": "balanced-match@>=0.4.1 <0.5.0",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-0.4.2.tgz"
+      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-0.4.2.tgz",
+      "integrity": "sha1-yz8+PHMtwPAe5wtAPzAuYddwmDg="
     },
     "base62": {
       "version": "1.2.0",
-      "from": "base62@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/base62/-/base62-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/base62/-/base62-1.2.0.tgz",
+      "integrity": "sha1-MeflYNyEbJ9EwaUx32UU2jVHQVc="
     },
     "Base64": {
       "version": "0.2.1",
-      "from": "Base64@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/Base64/-/Base64-0.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/Base64/-/Base64-0.2.1.tgz",
+      "integrity": "sha1-ujpCMHCOGGcFBl5mur3Uw1z2ACg="
     },
     "base64-arraybuffer": {
       "version": "0.1.5",
-      "from": "base64-arraybuffer@0.1.5",
-      "resolved": "https://registry.npmjs.org/base64-arraybuffer/-/base64-arraybuffer-0.1.5.tgz"
+      "resolved": "https://registry.npmjs.org/base64-arraybuffer/-/base64-arraybuffer-0.1.5.tgz",
+      "integrity": "sha1-c5JncZI7Whl0etZmqlzUv5xunOg="
     },
     "base64-js": {
       "version": "1.2.0",
-      "from": "base64-js@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.2.0.tgz",
+      "integrity": "sha1-o5mS1yNYSBGYK+XikLtqU9hnAPE="
     },
     "base64-url": {
       "version": "1.2.1",
-      "from": "base64-url@1.2.1",
-      "resolved": "https://registry.npmjs.org/base64-url/-/base64-url-1.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/base64-url/-/base64-url-1.2.1.tgz",
+      "integrity": "sha1-GZ/WYXAqDnt9yubgaYuwicUvbXg="
     },
     "base64id": {
       "version": "1.0.0",
-      "from": "base64id@1.0.0",
-      "resolved": "https://registry.npmjs.org/base64id/-/base64id-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/base64id/-/base64id-1.0.0.tgz",
+      "integrity": "sha1-R2iMuZu2gE8OBtPnY7HDLlfY5rY="
     },
     "basic-auth": {
       "version": "1.0.4",
-      "from": "basic-auth@>=1.0.3 <1.1.0",
-      "resolved": "https://registry.npmjs.org/basic-auth/-/basic-auth-1.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/basic-auth/-/basic-auth-1.0.4.tgz",
+      "integrity": "sha1-Awk1sB3nyblKgksp8/zLdQ06UpA="
     },
     "basic-auth-connect": {
       "version": "1.0.0",
-      "from": "basic-auth-connect@1.0.0",
-      "resolved": "https://registry.npmjs.org/basic-auth-connect/-/basic-auth-connect-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/basic-auth-connect/-/basic-auth-connect-1.0.0.tgz",
+      "integrity": "sha1-/bC0OWLKe0BFanwrtI/hc9otISI="
     },
     "batch": {
       "version": "0.5.3",
-      "from": "batch@>=0.5.3 <0.6.0",
-      "resolved": "https://registry.npmjs.org/batch/-/batch-0.5.3.tgz"
+      "resolved": "https://registry.npmjs.org/batch/-/batch-0.5.3.tgz",
+      "integrity": "sha1-PzQU84AyF0O/wQQvmoP/HVgk1GQ="
     },
     "bcrypt-pbkdf": {
       "version": "1.0.1",
-      "from": "bcrypt-pbkdf@>=1.0.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/bcrypt-pbkdf/-/bcrypt-pbkdf-1.0.1.tgz",
+      "integrity": "sha1-Y7xdy2EzG5K8Bf1SiVPDNGKgb40=",
       "optional": true
     },
     "beeper": {
       "version": "1.1.1",
-      "from": "beeper@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/beeper/-/beeper-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/beeper/-/beeper-1.1.1.tgz",
+      "integrity": "sha1-5tXqjF2tABMEpwsiY4RH9pyy+Ak="
     },
     "better-assert": {
       "version": "1.0.2",
-      "from": "better-assert@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/better-assert/-/better-assert-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/better-assert/-/better-assert-1.0.2.tgz",
+      "integrity": "sha1-QIZrnhueC1W0gYlDEeaPr/rrxSI="
     },
     "big.js": {
       "version": "3.1.3",
-      "from": "big.js@>=3.1.3 <4.0.0",
-      "resolved": "https://registry.npmjs.org/big.js/-/big.js-3.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/big.js/-/big.js-3.1.3.tgz",
+      "integrity": "sha1-TK2iGTZS6zyp7I5VyQFWacmAaXg="
     },
     "binary-extensions": {
       "version": "1.8.0",
-      "from": "binary-extensions@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.8.0.tgz"
+      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.8.0.tgz",
+      "integrity": "sha1-SOyNFt9Dd+rl+liEaCSAr02Vx3Q="
     },
     "binaryextensions": {
       "version": "1.0.1",
-      "from": "binaryextensions@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/binaryextensions/-/binaryextensions-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/binaryextensions/-/binaryextensions-1.0.1.tgz",
+      "integrity": "sha1-HmN0iLNbWL2l9HdL+WpSEqjJB1U="
     },
     "bindings": {
       "version": "1.2.1",
-      "from": "bindings@>=1.2.1 <1.3.0",
-      "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.2.1.tgz",
+      "integrity": "sha1-FK1hE4EtLTfXLme0ystLtyZQXxE="
     },
     "bl": {
       "version": "1.0.3",
-      "from": "bl@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/bl/-/bl-1.0.3.tgz",
+      "integrity": "sha1-/FQhoo/UImA2w7OJGmaiW8ZNIm4=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.0.6",
-          "from": "readable-stream@>=2.0.5 <2.1.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz",
+          "integrity": "sha1-j5A0HmilPMySh4jaz80Rs265t44="
         }
       }
     },
     "blob": {
       "version": "0.0.4",
-      "from": "blob@0.0.4",
-      "resolved": "https://registry.npmjs.org/blob/-/blob-0.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/blob/-/blob-0.0.4.tgz",
+      "integrity": "sha1-vPEwUspURj8w+fx+lbmkdjCpSSE="
     },
     "block-stream": {
       "version": "0.0.9",
-      "from": "block-stream@*",
-      "resolved": "https://registry.npmjs.org/block-stream/-/block-stream-0.0.9.tgz"
+      "resolved": "https://registry.npmjs.org/block-stream/-/block-stream-0.0.9.tgz",
+      "integrity": "sha1-E+v+d4oDIFz+A3UUgeu0szAMEmo="
     },
     "bluebird": {
       "version": "3.5.0",
-      "from": "bluebird@>=3.0.5 <4.0.0",
-      "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.5.0.tgz",
+      "integrity": "sha1-eRQg1/VR7qKJdFOop3ZT+WYG1nw="
     },
     "bn.js": {
       "version": "4.11.6",
-      "from": "bn.js@>=4.1.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.6.tgz"
+      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.6.tgz",
+      "integrity": "sha1-UzRK2xRhehP26N0s4okF0cC6MhU="
     },
     "body-parser": {
       "version": "1.17.2",
-      "from": "body-parser@>=1.12.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.17.2.tgz"
+      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.17.2.tgz",
+      "integrity": "sha1-+IkqvI+eYn1Crtr7yma/WrmRBO4="
     },
     "boolbase": {
       "version": "1.0.0",
-      "from": "boolbase@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
+      "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24="
     },
     "boom": {
       "version": "2.10.1",
-      "from": "boom@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz"
+      "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
+      "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8="
     },
     "boxen": {
       "version": "0.6.0",
-      "from": "boxen@>=0.6.0 <0.7.0",
-      "resolved": "https://registry.npmjs.org/boxen/-/boxen-0.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/boxen/-/boxen-0.6.0.tgz",
+      "integrity": "sha1-g2TUJIrDT/DvGy8r9JpsYM4NgbY="
     },
     "brace-expansion": {
       "version": "1.1.7",
-      "from": "brace-expansion@>=1.1.7 <2.0.0",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.7.tgz"
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.7.tgz",
+      "integrity": "sha1-Pv/DxQ4ABTH7cg6v+A8K6O8jz1k="
     },
     "braces": {
       "version": "1.8.5",
-      "from": "braces@>=1.8.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz"
+      "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
+      "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
     },
     "brorand": {
       "version": "1.1.0",
-      "from": "brorand@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/brorand/-/brorand-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/brorand/-/brorand-1.1.0.tgz",
+      "integrity": "sha1-EsJe/kCkXjwyPrhnWgoM5XsiNx8="
     },
     "browser-stdout": {
       "version": "1.3.0",
-      "from": "browser-stdout@1.3.0",
-      "resolved": "https://registry.npmjs.org/browser-stdout/-/browser-stdout-1.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/browser-stdout/-/browser-stdout-1.3.0.tgz",
+      "integrity": "sha1-81HTKWnTL6XXpVZxVCY9korjvR8="
     },
     "browserify-aes": {
       "version": "0.4.0",
-      "from": "browserify-aes@0.4.0",
-      "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-0.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-0.4.0.tgz",
+      "integrity": "sha1-BnFJtmjfMcS1hTPgLQHoBthgjiw="
     },
     "browserify-cipher": {
       "version": "1.0.0",
-      "from": "browserify-cipher@>=1.0.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/browserify-cipher/-/browserify-cipher-1.0.0.tgz",
+      "integrity": "sha1-mYgkSHS/XtTijalWZtzWasj8Njo=",
       "dependencies": {
         "browserify-aes": {
           "version": "1.0.6",
-          "from": "browserify-aes@>=1.0.4 <2.0.0",
-          "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.6.tgz"
+          "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.6.tgz",
+          "integrity": "sha1-Xncl297x/Vkw1OurSFZ85FHEigo="
         }
       }
     },
     "browserify-des": {
       "version": "1.0.0",
-      "from": "browserify-des@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/browserify-des/-/browserify-des-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/browserify-des/-/browserify-des-1.0.0.tgz",
+      "integrity": "sha1-2qJ3cXRwki7S/hhZQRihdUOXId0="
     },
     "browserify-mime": {
       "version": "1.2.9",
-      "from": "browserify-mime@>=1.2.9 <1.3.0",
-      "resolved": "https://registry.npmjs.org/browserify-mime/-/browserify-mime-1.2.9.tgz"
+      "resolved": "https://registry.npmjs.org/browserify-mime/-/browserify-mime-1.2.9.tgz",
+      "integrity": "sha1-rrGvKN5sDXpqLOQK22j/GEIq8x8="
     },
     "browserify-rsa": {
       "version": "4.0.1",
-      "from": "browserify-rsa@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz",
+      "integrity": "sha1-IeCr+vbyApzy+vsTNWenAdQTVSQ="
     },
     "browserify-sign": {
       "version": "4.0.4",
-      "from": "browserify-sign@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/browserify-sign/-/browserify-sign-4.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/browserify-sign/-/browserify-sign-4.0.4.tgz",
+      "integrity": "sha1-qk62jl17ZYuqa/alfmMMvXqT0pg="
     },
     "browserify-zlib": {
       "version": "0.1.4",
-      "from": "browserify-zlib@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/browserify-zlib/-/browserify-zlib-0.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/browserify-zlib/-/browserify-zlib-0.1.4.tgz",
+      "integrity": "sha1-uzX4pRn2AOD6a4SFJByXnQFB+y0="
     },
     "browserslist": {
       "version": "1.3.6",
-      "from": "browserslist@>=1.3.4 <1.4.0",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.3.6.tgz"
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.3.6.tgz",
+      "integrity": "sha1-lS/0jVZGPTtTj4XvL46t39KEsTM="
     },
     "buffer": {
       "version": "4.9.1",
-      "from": "buffer@>=4.9.0 <5.0.0",
       "resolved": "https://registry.npmjs.org/buffer/-/buffer-4.9.1.tgz",
+      "integrity": "sha1-bRu2AbB6TvztlwlBMgkwJ8lbwpg=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         }
       }
     },
     "buffer-shims": {
       "version": "1.0.0",
-      "from": "buffer-shims@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/buffer-shims/-/buffer-shims-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/buffer-shims/-/buffer-shims-1.0.0.tgz",
+      "integrity": "sha1-mXjOMXOIxkmth5MCjDR37wRKi1E="
     },
     "buffer-xor": {
       "version": "1.0.3",
-      "from": "buffer-xor@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/buffer-xor/-/buffer-xor-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/buffer-xor/-/buffer-xor-1.0.3.tgz",
+      "integrity": "sha1-JuYe0UIvtw3ULm42cp7VHYVf6Nk="
     },
     "bufferstreams": {
       "version": "1.0.1",
-      "from": "bufferstreams@1.0.1",
-      "resolved": "https://registry.npmjs.org/bufferstreams/-/bufferstreams-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/bufferstreams/-/bufferstreams-1.0.1.tgz",
+      "integrity": "sha1-z7GtlWjTujz+k1upq92VLeiKqyo="
     },
     "builtin-modules": {
       "version": "1.1.1",
-      "from": "builtin-modules@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz",
+      "integrity": "sha1-Jw8HbFpywC9bZaR9+Uxf46J4iS8="
     },
     "builtin-status-codes": {
       "version": "3.0.0",
-      "from": "builtin-status-codes@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz",
+      "integrity": "sha1-hZgoeOIbmOHGZCXgPQF0eI9Wnug="
     },
     "bytes": {
       "version": "2.4.0",
-      "from": "bytes@2.4.0",
-      "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz",
+      "integrity": "sha1-fZcZb51br39pNeJZhVSe3SpsIzk="
     },
     "cache-swap": {
       "version": "0.3.0",
-      "from": "cache-swap@>=0.3.0 <0.4.0",
-      "resolved": "https://registry.npmjs.org/cache-swap/-/cache-swap-0.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/cache-swap/-/cache-swap-0.3.0.tgz",
+      "integrity": "sha1-HFQaoQilAQb2ML3Zj+HeyLoTP1E="
     },
     "callsite": {
       "version": "1.0.0",
-      "from": "callsite@1.0.0",
-      "resolved": "https://registry.npmjs.org/callsite/-/callsite-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/callsite/-/callsite-1.0.0.tgz",
+      "integrity": "sha1-KAOY5dZkvXQDi28JBRU+borxvCA="
     },
     "camel-case": {
       "version": "3.0.0",
-      "from": "camel-case@>=3.0.0 <3.1.0",
-      "resolved": "https://registry.npmjs.org/camel-case/-/camel-case-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/camel-case/-/camel-case-3.0.0.tgz",
+      "integrity": "sha1-yjw2iKTpzzpM2nd9xNy8cTJJz3M="
     },
     "camelcase": {
       "version": "2.1.1",
-      "from": "camelcase@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz",
+      "integrity": "sha1-fB0W1nmhu+WcoCys7PsBHiAfWh8="
     },
     "camelcase-keys": {
       "version": "2.1.0",
-      "from": "camelcase-keys@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/camelcase-keys/-/camelcase-keys-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/camelcase-keys/-/camelcase-keys-2.1.0.tgz",
+      "integrity": "sha1-MIvur/3ygRkFHvodkyITyRuPkuc="
     },
     "caniuse-api": {
       "version": "1.6.1",
-      "from": "caniuse-api@>=1.5.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/caniuse-api/-/caniuse-api-1.6.1.tgz"
+      "resolved": "https://registry.npmjs.org/caniuse-api/-/caniuse-api-1.6.1.tgz",
+      "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
       "version": "1.0.30000674",
-      "from": "caniuse-db@>=1.0.30000488 <2.0.0",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000674.tgz"
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000674.tgz",
+      "integrity": "sha1-146ZoykTQfU4MOlq0vEpIblxXo0="
     },
     "capture-stack-trace": {
       "version": "1.0.0",
-      "from": "capture-stack-trace@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/capture-stack-trace/-/capture-stack-trace-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/capture-stack-trace/-/capture-stack-trace-1.0.0.tgz",
+      "integrity": "sha1-Sm+gc5nCa7pH8LJJa00PtAjFVQ0="
     },
     "cardinal": {
       "version": "1.0.0",
-      "from": "cardinal@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/cardinal/-/cardinal-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/cardinal/-/cardinal-1.0.0.tgz",
+      "integrity": "sha1-UOIcGwqjdyn5N33vGWtanOyTLuk="
     },
     "caseless": {
       "version": "0.12.0",
-      "from": "caseless@>=0.12.0 <0.13.0",
-      "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz"
+      "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz",
+      "integrity": "sha1-G2gcIf+EAzyCZUMJBolCDRhxUdw="
     },
     "casperjs": {
       "version": "1.1.3",
-      "from": "casperjs@1.1.3",
-      "resolved": "https://registry.npmjs.org/casperjs/-/casperjs-1.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/casperjs/-/casperjs-1.1.3.tgz",
+      "integrity": "sha1-llPecx+KpE0JFaaboiMxZLsur5Q="
     },
     "center-align": {
       "version": "0.1.3",
-      "from": "center-align@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/center-align/-/center-align-0.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/center-align/-/center-align-0.1.3.tgz",
+      "integrity": "sha1-qg0yYptu6XIgBBHL1EYckHvCt60="
     },
     "chai": {
       "version": "3.5.0",
-      "from": "chai@>=3.5.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/chai/-/chai-3.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/chai/-/chai-3.5.0.tgz",
+      "integrity": "sha1-TQJjewZ/6Vi9v906QOxW/vc3Mkc="
     },
     "chalk": {
       "version": "1.1.3",
-      "from": "chalk@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+      "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
     },
     "charenc": {
       "version": "0.0.2",
-      "from": "charenc@>=0.0.1 <0.1.0",
-      "resolved": "https://registry.npmjs.org/charenc/-/charenc-0.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/charenc/-/charenc-0.0.2.tgz",
+      "integrity": "sha1-wKHS86cJLgN3S/qD8UwPxXkKhmc="
     },
     "cheerio": {
       "version": "0.22.0",
-      "from": "cheerio@>=0.22.0 <0.23.0",
       "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-0.22.0.tgz",
+      "integrity": "sha1-qbqoYKP5tZWmuBsahocxIe06Jp4=",
       "dependencies": {
         "lodash.defaults": {
           "version": "4.2.0",
-          "from": "lodash.defaults@>=4.0.1 <5.0.0",
-          "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-4.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-4.2.0.tgz",
+          "integrity": "sha1-0JF4cW/+pN3p5ft7N/bwgCJ0WAw="
         },
         "lodash.merge": {
           "version": "4.6.0",
-          "from": "lodash.merge@>=4.4.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.0.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.0.tgz",
+          "integrity": "sha1-aYhLoUSsM/5plzemCG3v+t0PicU="
         }
       }
     },
     "chokidar": {
       "version": "1.7.0",
-      "from": "chokidar@>=1.4.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-1.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-1.7.0.tgz",
+      "integrity": "sha1-eY5ol3gVHIB2tLNg5e3SjNortGg="
     },
     "cipher-base": {
       "version": "1.0.3",
-      "from": "cipher-base@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/cipher-base/-/cipher-base-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/cipher-base/-/cipher-base-1.0.3.tgz",
+      "integrity": "sha1-7qvxlEGc6QDaMBjCB9IS8qbfCgc="
     },
     "clap": {
       "version": "1.1.3",
-      "from": "clap@>=1.0.9 <2.0.0",
-      "resolved": "https://registry.npmjs.org/clap/-/clap-1.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/clap/-/clap-1.1.3.tgz",
+      "integrity": "sha1-s7026T3Uy/s5WjwmiWNSRFJlwFs="
     },
     "clean-css": {
       "version": "3.4.26",
-      "from": "clean-css@>=3.4.20 <4.0.0",
       "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-3.4.26.tgz",
+      "integrity": "sha1-VTI7NE/zvO5oSi6sgck9+Ppz3us=",
       "dependencies": {
         "commander": {
           "version": "2.8.1",
-          "from": "commander@>=2.8.0 <2.9.0",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-2.8.1.tgz"
+          "resolved": "https://registry.npmjs.org/commander/-/commander-2.8.1.tgz",
+          "integrity": "sha1-Br42f+v9oMMwqh4qBy09yXYkJdQ="
         },
         "source-map": {
           "version": "0.4.4",
-          "from": "source-map@>=0.4.0 <0.5.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz"
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
+          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s="
         }
       }
     },
     "cli-boxes": {
       "version": "1.0.0",
-      "from": "cli-boxes@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/cli-boxes/-/cli-boxes-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/cli-boxes/-/cli-boxes-1.0.0.tgz",
+      "integrity": "sha1-T6kXw+WclKAEzWH47lCdplFocUM="
     },
     "cli-cursor": {
       "version": "1.0.2",
-      "from": "cli-cursor@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-1.0.2.tgz",
+      "integrity": "sha1-ZNo/fValRBLll5S9Ytw1KV6PKYc="
     },
     "cli-table": {
       "version": "0.3.1",
-      "from": "cli-table@>=0.3.1 <0.4.0",
       "resolved": "https://registry.npmjs.org/cli-table/-/cli-table-0.3.1.tgz",
+      "integrity": "sha1-9TsFJmqLGguTSz0IIebi3FkUriM=",
       "dependencies": {
         "colors": {
           "version": "1.0.3",
-          "from": "colors@1.0.3",
-          "resolved": "https://registry.npmjs.org/colors/-/colors-1.0.3.tgz"
+          "resolved": "https://registry.npmjs.org/colors/-/colors-1.0.3.tgz",
+          "integrity": "sha1-BDP0TYCWgP3rYO0mDxsMJi6CpAs="
         }
       }
     },
     "cli-usage": {
       "version": "0.1.4",
-      "from": "cli-usage@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/cli-usage/-/cli-usage-0.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/cli-usage/-/cli-usage-0.1.4.tgz",
+      "integrity": "sha1-fAHg3HBsI0s5yTODjI4gshdXduI="
     },
     "cli-width": {
       "version": "1.1.1",
-      "from": "cli-width@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-1.1.1.tgz",
+      "integrity": "sha1-pNKT72frt7iNSk1CwMzwDE0eNm0="
     },
     "cliui": {
       "version": "3.2.0",
-      "from": "cliui@>=3.2.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
+      "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
     },
     "clone": {
       "version": "1.0.2",
-      "from": "clone@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.2.tgz",
+      "integrity": "sha1-Jgt6meux7f4kdTgXX3gyQ8sZ0Uk="
     },
     "clone-buffer": {
       "version": "1.0.0",
-      "from": "clone-buffer@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/clone-buffer/-/clone-buffer-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/clone-buffer/-/clone-buffer-1.0.0.tgz",
+      "integrity": "sha1-4+JbIHrE5wGvch4staFnksrD3Fg="
     },
     "clone-deep": {
       "version": "0.2.4",
-      "from": "clone-deep@>=0.2.4 <0.3.0",
-      "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-0.2.4.tgz"
+      "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-0.2.4.tgz",
+      "integrity": "sha1-TnPdCen7lxzDhnDF3O2cGJZIHMY="
     },
     "clone-stats": {
       "version": "0.0.1",
-      "from": "clone-stats@>=0.0.1 <0.0.2",
-      "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-0.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-0.0.1.tgz",
+      "integrity": "sha1-uI+UqCzzi4eR1YBG6kAprYjKmdE="
     },
     "cloneable-readable": {
       "version": "1.0.0",
-      "from": "cloneable-readable@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/cloneable-readable/-/cloneable-readable-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/cloneable-readable/-/cloneable-readable-1.0.0.tgz",
+      "integrity": "sha1-pikNQT8hemEjL5XkWP84QYz7ARc="
     },
     "co": {
       "version": "4.6.0",
-      "from": "co@>=4.6.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
+      "integrity": "sha1-bqa989hTrlTMuOR7+gvz+QMfsYQ="
     },
     "coa": {
       "version": "1.0.2",
-      "from": "coa@>=1.0.1 <1.1.0",
-      "resolved": "https://registry.npmjs.org/coa/-/coa-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/coa/-/coa-1.0.2.tgz",
+      "integrity": "sha1-K6n+w7SqQ9eknX5sNWHpIGG2vOw="
     },
     "code-point-at": {
       "version": "1.1.0",
-      "from": "code-point-at@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz",
+      "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c="
     },
     "color": {
       "version": "0.11.4",
-      "from": "color@>=0.11.0 <0.12.0",
-      "resolved": "https://registry.npmjs.org/color/-/color-0.11.4.tgz"
+      "resolved": "https://registry.npmjs.org/color/-/color-0.11.4.tgz",
+      "integrity": "sha1-bXtcdPtl6EHNSHkq0e1eB7kE12Q="
     },
     "color-convert": {
       "version": "1.9.0",
-      "from": "color-convert@>=1.3.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.0.tgz"
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.0.tgz",
+      "integrity": "sha1-Gsz5fdc5uYO/mU1W/sj5WFNkG3o="
     },
     "color-functions": {
       "version": "1.1.0",
-      "from": "color-functions@1.1.0",
-      "resolved": "https://registry.npmjs.org/color-functions/-/color-functions-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/color-functions/-/color-functions-1.1.0.tgz",
+      "integrity": "sha1-TLgFR5Blo2WMMmn0j6xz7/APld4="
     },
     "color-name": {
       "version": "1.1.2",
-      "from": "color-name@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.2.tgz",
+      "integrity": "sha1-XIq3K2S9IhXWF66VWeuxSEdc+Y0="
     },
     "color-string": {
       "version": "0.3.0",
-      "from": "color-string@>=0.3.0 <0.4.0",
-      "resolved": "https://registry.npmjs.org/color-string/-/color-string-0.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/color-string/-/color-string-0.3.0.tgz",
+      "integrity": "sha1-J9RvtnAlxcL6JZk7+/V55HhBuZE="
     },
     "colormin": {
       "version": "1.1.2",
-      "from": "colormin@>=1.0.5 <2.0.0",
-      "resolved": "https://registry.npmjs.org/colormin/-/colormin-1.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/colormin/-/colormin-1.1.2.tgz",
+      "integrity": "sha1-6i90IKcrlogaOKrlnsEkpvcpgTM="
     },
     "colors": {
       "version": "1.1.2",
-      "from": "colors@>=1.1.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/colors/-/colors-1.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/colors/-/colors-1.1.2.tgz",
+      "integrity": "sha1-FopHAXVran9RoSzgyXv6KMCE7WM="
     },
     "combined-stream": {
       "version": "1.0.5",
-      "from": "combined-stream@>=1.0.5 <1.1.0",
-      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz",
+      "integrity": "sha1-k4NwpXtKUd6ix3wV1cX9+JUWQAk="
     },
     "commander": {
       "version": "2.9.0",
-      "from": "commander@>=2.7.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz"
+      "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
+      "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q="
     },
     "commoner": {
       "version": "0.10.8",
-      "from": "commoner@>=0.10.1 <0.11.0",
       "resolved": "https://registry.npmjs.org/commoner/-/commoner-0.10.8.tgz",
+      "integrity": "sha1-NPw2cs0kOT6LtH5wyqApOBH08sU=",
       "dependencies": {
         "glob": {
           "version": "5.0.15",
-          "from": "glob@>=5.0.15 <6.0.0",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
+          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
+          "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
         }
       }
     },
     "component-bind": {
       "version": "1.0.0",
-      "from": "component-bind@1.0.0",
-      "resolved": "https://registry.npmjs.org/component-bind/-/component-bind-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/component-bind/-/component-bind-1.0.0.tgz",
+      "integrity": "sha1-AMYIq33Nk4l8AAllGx06jh5zu9E="
     },
     "component-emitter": {
       "version": "1.1.2",
-      "from": "component-emitter@1.1.2",
-      "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.1.2.tgz",
+      "integrity": "sha1-KWWU8nU9qmOZbSrwjRWpURbJrsM="
     },
     "component-inherit": {
       "version": "0.0.3",
-      "from": "component-inherit@0.0.3",
-      "resolved": "https://registry.npmjs.org/component-inherit/-/component-inherit-0.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/component-inherit/-/component-inherit-0.0.3.tgz",
+      "integrity": "sha1-ZF/ErfWLcrZJ1crmUTVhnbJv8UM="
     },
     "compressible": {
       "version": "2.0.10",
-      "from": "compressible@>=2.0.5 <2.1.0",
-      "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.10.tgz"
+      "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.10.tgz",
+      "integrity": "sha1-/tocf3YXkScyspv4zyYlKiC57s0="
     },
     "compression": {
       "version": "1.5.2",
-      "from": "compression@>=1.5.2 <1.6.0",
       "resolved": "https://registry.npmjs.org/compression/-/compression-1.5.2.tgz",
+      "integrity": "sha1-sDuNhub4rSloPLqN+R3cb/x3s5U=",
       "dependencies": {
         "accepts": {
           "version": "1.2.13",
-          "from": "accepts@>=1.2.12 <1.3.0",
-          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.2.13.tgz"
+          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.2.13.tgz",
+          "integrity": "sha1-5fHzkoxtlf2WVYw27D2dDeSm7Oo="
         },
         "bytes": {
           "version": "2.1.0",
-          "from": "bytes@2.1.0",
-          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.1.0.tgz",
+          "integrity": "sha1-rJPEEOL/ycx89LRks4KJBn9eR7Q="
         },
         "debug": {
           "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "ms": {
           "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         },
         "negotiator": {
           "version": "0.5.3",
-          "from": "negotiator@0.5.3",
-          "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.5.3.tgz"
+          "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.5.3.tgz",
+          "integrity": "sha1-Jp1cR2gQ7JLtvntsLygxY4T5p+g="
         },
         "vary": {
           "version": "1.0.1",
-          "from": "vary@>=1.0.1 <1.1.0",
-          "resolved": "https://registry.npmjs.org/vary/-/vary-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/vary/-/vary-1.0.1.tgz",
+          "integrity": "sha1-meSYFWaihhGN+yuBc1ffeZM3bRA="
         }
       }
     },
     "concat-map": {
       "version": "0.0.1",
-      "from": "concat-map@0.0.1",
-      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
+      "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s="
     },
     "concat-stream": {
       "version": "1.5.0",
-      "from": "concat-stream@1.5.0",
       "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.5.0.tgz",
+      "integrity": "sha1-U/fUPFHF5D+ByP3QMyHGMb5o1hE=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.0.6",
-          "from": "readable-stream@>=2.0.0 <2.1.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz",
+          "integrity": "sha1-j5A0HmilPMySh4jaz80Rs265t44="
         }
       }
     },
     "configstore": {
       "version": "2.1.0",
-      "from": "configstore@>=2.0.0 <3.0.0",
       "resolved": "https://registry.npmjs.org/configstore/-/configstore-2.1.0.tgz",
+      "integrity": "sha1-c3o6cDbpiGECqmCZ5HuzOrGroaE=",
       "dependencies": {
         "uuid": {
           "version": "2.0.3",
-          "from": "uuid@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz"
+          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz",
+          "integrity": "sha1-Z+LoY3lyFVMN/zGOW/nc6/1Hsho="
         }
       }
     },
     "connect": {
       "version": "3.6.2",
-      "from": "connect@>=3.3.5 <4.0.0",
-      "resolved": "https://registry.npmjs.org/connect/-/connect-3.6.2.tgz"
+      "resolved": "https://registry.npmjs.org/connect/-/connect-3.6.2.tgz",
+      "integrity": "sha1-aU6NIGgb/kkCgsiriGvpjwn0L+c="
     },
     "connect-history-api-fallback": {
       "version": "1.3.0",
-      "from": "connect-history-api-fallback@>=1.3.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.3.0.tgz",
+      "integrity": "sha1-5R0X+PDvDbkKZP20feMFFVbp8Wk="
     },
     "connect-livereload": {
       "version": "0.5.4",
-      "from": "connect-livereload@>=0.5.4 <0.6.0",
-      "resolved": "https://registry.npmjs.org/connect-livereload/-/connect-livereload-0.5.4.tgz"
+      "resolved": "https://registry.npmjs.org/connect-livereload/-/connect-livereload-0.5.4.tgz",
+      "integrity": "sha1-gBV9E3HJ83zBQDmrGJWXDRGdw7w="
     },
     "connect-timeout": {
       "version": "1.6.2",
-      "from": "connect-timeout@>=1.6.2 <1.7.0",
       "resolved": "https://registry.npmjs.org/connect-timeout/-/connect-timeout-1.6.2.tgz",
+      "integrity": "sha1-3ppexh4zoStu2qt7XwYumMWZuI4=",
       "dependencies": {
         "debug": {
           "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "http-errors": {
           "version": "1.3.1",
-          "from": "http-errors@>=1.3.1 <1.4.0",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
+          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
         },
         "ms": {
           "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         }
       }
     },
     "console-browserify": {
       "version": "1.1.0",
-      "from": "console-browserify@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.1.0.tgz",
+      "integrity": "sha1-8CQcRXMKn8YyOyBtvzjtx0HQuxA="
     },
     "console-control-strings": {
       "version": "1.1.0",
-      "from": "console-control-strings@>=1.1.0 <1.2.0",
-      "resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz",
+      "integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4="
     },
     "constants-browserify": {
       "version": "0.0.1",
-      "from": "constants-browserify@0.0.1",
-      "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-0.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-0.0.1.tgz",
+      "integrity": "sha1-kld9tSe6bEzwpFaNhLwDH0QeIfI="
     },
     "content-disposition": {
       "version": "0.5.2",
-      "from": "content-disposition@0.5.2",
-      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.2.tgz"
+      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.2.tgz",
+      "integrity": "sha1-DPaLud318r55YcOoUXjLhdunjLQ="
     },
     "content-type": {
       "version": "1.0.2",
-      "from": "content-type@>=1.0.2 <1.1.0",
-      "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.2.tgz",
+      "integrity": "sha1-t9ETrueo3Se9IRM8TcJSnfFyHu0="
     },
     "convert-source-map": {
       "version": "1.5.0",
-      "from": "convert-source-map@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.5.0.tgz",
+      "integrity": "sha1-ms1whRxtXf3ZPZKC5e35SgP/RrU="
     },
     "cookie": {
       "version": "0.3.1",
-      "from": "cookie@0.3.1",
-      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.3.1.tgz"
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.3.1.tgz",
+      "integrity": "sha1-5+Ch+e9DtMi6klxcWpboBtFoc7s="
     },
     "cookie-parser": {
       "version": "1.3.5",
-      "from": "cookie-parser@>=1.3.5 <1.4.0",
       "resolved": "https://registry.npmjs.org/cookie-parser/-/cookie-parser-1.3.5.tgz",
+      "integrity": "sha1-nXVVcPtdF4kHcSJ6AjFNm+fPg1Y=",
       "dependencies": {
         "cookie": {
           "version": "0.1.3",
-          "from": "cookie@0.1.3",
-          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz"
+          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz",
+          "integrity": "sha1-5zSlwUF/zkctWu+Cw4HKu2TRpDU="
         }
       }
     },
     "cookie-signature": {
       "version": "1.0.6",
-      "from": "cookie-signature@1.0.6",
-      "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz"
+      "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
+      "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw="
     },
     "core-js": {
       "version": "2.4.1",
-      "from": "core-js@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.4.1.tgz",
+      "integrity": "sha1-TekR5mew6ukSTjQlS1OupvxhjT4="
     },
     "core-util-is": {
       "version": "1.0.2",
-      "from": "core-util-is@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
+      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac="
     },
     "cosmiconfig": {
       "version": "2.1.3",
-      "from": "cosmiconfig@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-2.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-2.1.3.tgz",
+      "integrity": "sha1-lSdx6w3dwcs/ovb75RpSLpOz7go="
     },
     "crc": {
       "version": "3.3.0",
-      "from": "crc@3.3.0",
-      "resolved": "https://registry.npmjs.org/crc/-/crc-3.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/crc/-/crc-3.3.0.tgz",
+      "integrity": "sha1-+mIuG8OIvyVzCQgta2UgDOZwkLo="
     },
     "create-ecdh": {
       "version": "4.0.0",
-      "from": "create-ecdh@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.0.tgz",
+      "integrity": "sha1-iIxyNZbN92EvZJgjPuvXo1MBc30="
     },
     "create-error-class": {
       "version": "3.0.2",
-      "from": "create-error-class@>=3.0.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/create-error-class/-/create-error-class-3.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/create-error-class/-/create-error-class-3.0.2.tgz",
+      "integrity": "sha1-Br56vvlHo/FKMP1hBnHUAbyot7Y="
     },
     "create-hash": {
       "version": "1.1.3",
-      "from": "create-hash@>=1.1.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/create-hash/-/create-hash-1.1.3.tgz",
+      "integrity": "sha1-YGBCrIuSYnUPSDyt2rD1gZFy2P0=",
       "dependencies": {
         "ripemd160": {
           "version": "2.0.1",
-          "from": "ripemd160@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz",
+          "integrity": "sha1-D0WEKVxTo2KK9+bXmsohzlfRxuc="
         },
         "sha.js": {
           "version": "2.4.8",
-          "from": "sha.js@>=2.4.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz"
+          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz",
+          "integrity": "sha1-NwaMLEdra69ALRSknGf1l5IfY08="
         }
       }
     },
     "create-hmac": {
       "version": "1.1.6",
-      "from": "create-hmac@>=1.1.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/create-hmac/-/create-hmac-1.1.6.tgz",
+      "integrity": "sha1-rLniIaThe9sHbpBlfEK5PjcmzwY=",
       "dependencies": {
         "ripemd160": {
           "version": "2.0.1",
-          "from": "ripemd160@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz",
+          "integrity": "sha1-D0WEKVxTo2KK9+bXmsohzlfRxuc="
         },
         "sha.js": {
           "version": "2.4.8",
-          "from": "sha.js@>=2.4.8 <3.0.0",
-          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz"
+          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz",
+          "integrity": "sha1-NwaMLEdra69ALRSknGf1l5IfY08="
         }
       }
     },
     "cross-spawn": {
       "version": "3.0.1",
-      "from": "cross-spawn@>=3.0.0 <4.0.0",
       "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-3.0.1.tgz",
+      "integrity": "sha1-ElYDfsufDF9549bvE14wdwGEuYI=",
       "dependencies": {
         "lru-cache": {
           "version": "4.0.2",
-          "from": "lru-cache@>=4.0.1 <5.0.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.0.2.tgz",
+          "integrity": "sha1-HRdnnAac2l0ECZGgnbwsDbN35V4="
         }
       }
     },
     "cross-spawn-async": {
       "version": "2.2.5",
-      "from": "cross-spawn-async@>=2.1.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/cross-spawn-async/-/cross-spawn-async-2.2.5.tgz",
+      "integrity": "sha1-hF/wwINKPe2dFg2sptOQkGuyiMw=",
       "dependencies": {
         "lru-cache": {
           "version": "4.0.2",
-          "from": "lru-cache@>=4.0.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.0.2.tgz",
+          "integrity": "sha1-HRdnnAac2l0ECZGgnbwsDbN35V4="
         }
       }
     },
     "crypt": {
       "version": "0.0.2",
-      "from": "crypt@>=0.0.1 <0.1.0",
-      "resolved": "https://registry.npmjs.org/crypt/-/crypt-0.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/crypt/-/crypt-0.0.2.tgz",
+      "integrity": "sha1-iNf/fsDfuG9xPch7u0LQRNPmxBs="
     },
     "cryptiles": {
       "version": "2.0.5",
-      "from": "cryptiles@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz",
+      "integrity": "sha1-O9/s3GCBR8HGcgL6KR59ylnqo7g="
     },
     "crypto-browserify": {
       "version": "3.2.8",
-      "from": "crypto-browserify@>=3.2.6 <3.3.0",
-      "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.2.8.tgz"
+      "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.2.8.tgz",
+      "integrity": "sha1-ubEdvm2WUd2IKgHmzEZ99xjs8Yk="
     },
     "crypto-random-string": {
       "version": "1.0.0",
-      "from": "crypto-random-string@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-1.0.0.tgz",
+      "integrity": "sha1-ojD2T1aDEOFJgAmUB5DsmVRbyn4="
     },
     "csrf": {
       "version": "3.0.6",
-      "from": "csrf@>=3.0.0 <3.1.0",
-      "resolved": "https://registry.npmjs.org/csrf/-/csrf-3.0.6.tgz"
+      "resolved": "https://registry.npmjs.org/csrf/-/csrf-3.0.6.tgz",
+      "integrity": "sha1-thEg3c7q/JHnbtUxO7XAsmZ7cQo="
     },
     "css-color-names": {
       "version": "0.0.4",
-      "from": "css-color-names@0.0.4",
-      "resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz",
+      "integrity": "sha1-gIrcLnnPhHOAabZGyyDsJ762KeA="
     },
     "css-loader": {
       "version": "0.28.3",
-      "from": "css-loader@>=0.28.0 <0.29.0",
       "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.3.tgz",
+      "integrity": "sha1-n9XguMQFtt+Se6EQOIcBXTYGQM4=",
       "dependencies": {
         "loader-utils": {
           "version": "1.1.0",
-          "from": "loader-utils@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
+          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
         },
         "lodash.camelcase": {
           "version": "4.3.0",
-          "from": "lodash.camelcase@>=4.3.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz",
+          "integrity": "sha1-soqmKIorn8ZRA1x3EfZathkDMaY="
         }
       }
     },
     "css-modules-loader-core": {
       "version": "1.1.0",
-      "from": "css-modules-loader-core@>=1.0.1 <2.0.0",
       "resolved": "https://registry.npmjs.org/css-modules-loader-core/-/css-modules-loader-core-1.1.0.tgz",
+      "integrity": "sha1-WQhmgpShvs0mGuCkziGwtVHyHRY=",
       "dependencies": {
         "postcss": {
           "version": "6.0.1",
-          "from": "postcss@6.0.1",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
+          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.2.3 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
     "css-select": {
       "version": "1.2.0",
-      "from": "css-select@>=1.2.0 <1.3.0",
-      "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz",
+      "integrity": "sha1-KzoRBTnFNV8c2NMUYj6HCxIeyFg="
     },
     "css-selector-tokenizer": {
       "version": "0.7.0",
-      "from": "css-selector-tokenizer@>=0.7.0 <0.8.0",
-      "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.7.0.tgz",
+      "integrity": "sha1-5piEdK6MlTR3v15+/s/OzNnPTIY="
     },
     "css-what": {
       "version": "2.1.0",
-      "from": "css-what@>=2.1.0 <2.2.0",
-      "resolved": "https://registry.npmjs.org/css-what/-/css-what-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/css-what/-/css-what-2.1.0.tgz",
+      "integrity": "sha1-lGfQMsOM+u+58teVASUwYvh/ob0="
     },
     "cssesc": {
       "version": "0.1.0",
-      "from": "cssesc@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-0.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-0.1.0.tgz",
+      "integrity": "sha1-yBSQPkViM3GgR3tAEJqq++6t27Q="
     },
     "cssnano": {
       "version": "3.10.0",
-      "from": "cssnano@>=2.6.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/cssnano/-/cssnano-3.10.0.tgz"
+      "resolved": "https://registry.npmjs.org/cssnano/-/cssnano-3.10.0.tgz",
+      "integrity": "sha1-Tzj2zqK5sX+gFJDyPx3GjqZcHDg="
     },
     "csso": {
       "version": "2.3.2",
-      "from": "csso@>=2.3.1 <2.4.0",
-      "resolved": "https://registry.npmjs.org/csso/-/csso-2.3.2.tgz"
+      "resolved": "https://registry.npmjs.org/csso/-/csso-2.3.2.tgz",
+      "integrity": "sha1-3dUsWHAz9J6Utx/FVWnyUuj/X4U="
     },
     "csurf": {
       "version": "1.8.3",
-      "from": "csurf@>=1.8.3 <1.9.0",
       "resolved": "https://registry.npmjs.org/csurf/-/csurf-1.8.3.tgz",
+      "integrity": "sha1-I/KhO/HY/OHQyZZYg5RELLqGpWo=",
       "dependencies": {
         "cookie": {
           "version": "0.1.3",
-          "from": "cookie@0.1.3",
-          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz"
+          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz",
+          "integrity": "sha1-5zSlwUF/zkctWu+Cw4HKu2TRpDU="
         },
         "http-errors": {
           "version": "1.3.1",
-          "from": "http-errors@>=1.3.1 <1.4.0",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
+          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
         }
       }
     },
     "currently-unhandled": {
       "version": "0.4.1",
-      "from": "currently-unhandled@>=0.4.1 <0.5.0",
-      "resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz",
+      "integrity": "sha1-mI3zP+qxke95mmE2nddsF635V+o="
     },
     "custom-event": {
       "version": "1.0.1",
-      "from": "custom-event@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/custom-event/-/custom-event-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/custom-event/-/custom-event-1.0.1.tgz",
+      "integrity": "sha1-XQKkaFCt8bSjF5RqOSj8y1v9BCU="
     },
     "cyclist": {
       "version": "0.2.2",
-      "from": "cyclist@>=0.2.2 <0.3.0",
-      "resolved": "https://registry.npmjs.org/cyclist/-/cyclist-0.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/cyclist/-/cyclist-0.2.2.tgz",
+      "integrity": "sha1-GzN5LhHpFKL9bW7WRHRkRE5fpkA="
     },
     "d": {
       "version": "1.0.0",
-      "from": "d@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/d/-/d-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/d/-/d-1.0.0.tgz",
+      "integrity": "sha1-dUu1v+VUUdpppYuU1F9MWwRi1Y8="
     },
     "d3": {
       "version": "3.5.17",
-      "from": "d3@>=3.5.6 <4.0.0",
-      "resolved": "https://registry.npmjs.org/d3/-/d3-3.5.17.tgz"
+      "resolved": "https://registry.npmjs.org/d3/-/d3-3.5.17.tgz",
+      "integrity": "sha1-vEZ0gAQ3iyGjYMn8fPUjF5B2L7g="
     },
     "dashdash": {
       "version": "1.14.1",
-      "from": "dashdash@>=1.12.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/dashdash/-/dashdash-1.14.1.tgz",
+      "integrity": "sha1-hTz6D3y+L+1d4gMmuN1YEDX24vA=",
       "dependencies": {
         "assert-plus": {
           "version": "1.0.0",
-          "from": "assert-plus@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
         }
       }
     },
     "date-now": {
       "version": "0.1.4",
-      "from": "date-now@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/date-now/-/date-now-0.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/date-now/-/date-now-0.1.4.tgz",
+      "integrity": "sha1-6vQ5/U1ISK105cx9vvIAZyueNFs="
     },
     "dateformat": {
       "version": "2.0.0",
-      "from": "dateformat@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-2.0.0.tgz",
+      "integrity": "sha1-J0Pjq7XD/CRi5SfcpEXgTp9N7hc="
     },
     "deasync": {
       "version": "0.1.9",
-      "from": "deasync@>=0.1.7 <0.2.0",
-      "resolved": "https://registry.npmjs.org/deasync/-/deasync-0.1.9.tgz"
+      "resolved": "https://registry.npmjs.org/deasync/-/deasync-0.1.9.tgz",
+      "integrity": "sha1-9Y3Un6YxEMdL6oQFqQqCi+JtOiQ="
     },
     "debug": {
       "version": "2.6.7",
-      "from": "debug@2.6.7",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.7.tgz"
+      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.7.tgz",
+      "integrity": "sha1-krrR9tBbu2u6Isyoi80OyJTChh4="
     },
     "decamelize": {
       "version": "1.2.0",
-      "from": "decamelize@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
+      "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA="
     },
     "decomment": {
       "version": "0.8.7",
-      "from": "decomment@>=0.8.2 <0.9.0",
-      "resolved": "https://registry.npmjs.org/decomment/-/decomment-0.8.7.tgz"
+      "resolved": "https://registry.npmjs.org/decomment/-/decomment-0.8.7.tgz",
+      "integrity": "sha1-JI8hFvbOOo6N0bY+WzWrpcoFTKU="
     },
     "deep-eql": {
       "version": "0.1.3",
-      "from": "deep-eql@>=0.1.3 <0.2.0",
       "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-0.1.3.tgz",
+      "integrity": "sha1-71WKyrjeJSBs1xOQbXTlaTDrafI=",
       "dependencies": {
         "type-detect": {
           "version": "0.1.1",
-          "from": "type-detect@0.1.1",
-          "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-0.1.1.tgz"
+          "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-0.1.1.tgz",
+          "integrity": "sha1-C6XsKohWQORw6k6FBZcZANrFiCI="
         }
       }
     },
     "deep-extend": {
       "version": "0.4.2",
-      "from": "deep-extend@>=0.4.0 <0.5.0",
-      "resolved": "https://registry.npmjs.org/deep-extend/-/deep-extend-0.4.2.tgz"
+      "resolved": "https://registry.npmjs.org/deep-extend/-/deep-extend-0.4.2.tgz",
+      "integrity": "sha1-SLaZwn4zS/ifEIkr5DL25MfTSn8="
     },
     "deep-is": {
       "version": "0.1.3",
-      "from": "deep-is@>=0.1.3 <0.2.0",
-      "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz",
+      "integrity": "sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ="
     },
     "defaults": {
       "version": "1.0.3",
-      "from": "defaults@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.3.tgz",
+      "integrity": "sha1-xlYFHpgX2f8I7YgUd/P+QBnz730="
     },
     "define-properties": {
       "version": "1.1.2",
-      "from": "define-properties@>=1.1.2 <2.0.0",
       "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.1.2.tgz",
+      "integrity": "sha1-g6c/L+pWmJj7c3GTyPhzyvbUXJQ=",
       "dependencies": {
         "object-keys": {
           "version": "1.0.11",
-          "from": "object-keys@>=1.0.8 <2.0.0",
-          "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.0.11.tgz"
+          "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.0.11.tgz",
+          "integrity": "sha1-xUYBd4rVYPEULODgG8yotW0TQm0="
         }
       }
     },
     "defined": {
       "version": "1.0.0",
-      "from": "defined@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/defined/-/defined-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/defined/-/defined-1.0.0.tgz",
+      "integrity": "sha1-yY2bzvdWdBiOEQlpFRGZ45sfppM="
     },
     "del": {
       "version": "2.2.2",
-      "from": "del@>=2.2.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/del/-/del-2.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/del/-/del-2.2.2.tgz",
+      "integrity": "sha1-wSyYHQZ4RshLyvhiz/kw2Qf/0ag="
     },
     "delayed-stream": {
       "version": "1.0.0",
-      "from": "delayed-stream@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
+      "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk="
     },
     "delegates": {
       "version": "1.0.0",
-      "from": "delegates@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz",
+      "integrity": "sha1-hMbhWbgZBP3KWaDvRM2HDTElD5o="
     },
     "depd": {
       "version": "1.1.0",
-      "from": "depd@>=1.1.0 <1.2.0",
-      "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.0.tgz",
+      "integrity": "sha1-4b2Cxqq2ztlluXuIsX7T5SjKGMM="
     },
     "deprecated": {
       "version": "0.0.1",
-      "from": "deprecated@>=0.0.1 <0.0.2",
-      "resolved": "https://registry.npmjs.org/deprecated/-/deprecated-0.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/deprecated/-/deprecated-0.0.1.tgz",
+      "integrity": "sha1-+cmvVGSvoeepcUWKi97yqpTVuxk="
     },
     "des.js": {
       "version": "1.0.0",
-      "from": "des.js@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/des.js/-/des.js-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/des.js/-/des.js-1.0.0.tgz",
+      "integrity": "sha1-wHTS4qpqipoH29YfmhXCzYPsjsw="
     },
     "destroy": {
       "version": "1.0.4",
-      "from": "destroy@>=1.0.4 <1.1.0",
-      "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.0.4.tgz",
+      "integrity": "sha1-l4hXRCxEdJ5CBmE+N5RiBYJqvYA="
     },
     "detect-file": {
       "version": "0.1.0",
-      "from": "detect-file@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/detect-file/-/detect-file-0.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/detect-file/-/detect-file-0.1.0.tgz",
+      "integrity": "sha1-STXe39lIhkjgBrASlWbpOGcR6mM="
     },
     "detect-node": {
       "version": "2.0.3",
-      "from": "detect-node@>=2.0.3 <3.0.0",
-      "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.0.3.tgz",
+      "integrity": "sha1-ogM8CcyOFY03dI+951B4Mr1s4Sc="
     },
     "detective": {
       "version": "4.5.0",
-      "from": "detective@>=4.3.1 <5.0.0",
       "resolved": "https://registry.npmjs.org/detective/-/detective-4.5.0.tgz",
+      "integrity": "sha1-blqMaybmx6JUsca210kNmOyR7dE=",
       "dependencies": {
         "acorn": {
           "version": "4.0.13",
-          "from": "acorn@>=4.0.3 <5.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz"
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
+          "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c="
         }
       }
     },
     "di": {
       "version": "0.0.1",
-      "from": "di@>=0.0.1 <0.0.2",
-      "resolved": "https://registry.npmjs.org/di/-/di-0.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/di/-/di-0.0.1.tgz",
+      "integrity": "sha1-gGZJMmzqp8qjMG112YXqJ0i6kTw="
     },
     "diff": {
       "version": "3.2.0",
-      "from": "diff@>=3.0.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/diff/-/diff-3.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/diff/-/diff-3.2.0.tgz",
+      "integrity": "sha1-yc45Okt8vQsFinJck98pkCeGj/k="
     },
     "diffie-hellman": {
       "version": "5.0.2",
-      "from": "diffie-hellman@>=5.0.0 <6.0.0",
-      "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.2.tgz",
+      "integrity": "sha1-tYNXOScM/ias9jIJn97SoH8gnl4="
     },
     "dom-serialize": {
       "version": "2.2.1",
-      "from": "dom-serialize@>=2.2.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/dom-serialize/-/dom-serialize-2.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/dom-serialize/-/dom-serialize-2.2.1.tgz",
+      "integrity": "sha1-ViromZ9Evl6jB29UGdzVnrQ6yVs="
     },
     "dom-serializer": {
       "version": "0.1.0",
-      "from": "dom-serializer@>=0.1.0 <0.2.0",
       "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.1.0.tgz",
+      "integrity": "sha1-BzxpdUbOB4DOI75KKOKT5AvDDII=",
       "dependencies": {
         "domelementtype": {
           "version": "1.1.3",
-          "from": "domelementtype@>=1.1.1 <1.2.0",
-          "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.1.3.tgz"
+          "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.1.3.tgz",
+          "integrity": "sha1-vSh3PiZCiBrsUVRJJCmcXNgiGFs="
         }
       }
     },
     "domain-browser": {
       "version": "1.1.7",
-      "from": "domain-browser@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.1.7.tgz"
+      "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.1.7.tgz",
+      "integrity": "sha1-hnqksJP6oF8d4IwG9NeyH9+GmLw="
     },
     "domelementtype": {
       "version": "1.3.0",
-      "from": "domelementtype@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.3.0.tgz",
+      "integrity": "sha1-sXrtguirWeUt2cGbF1bg/BhyBMI="
     },
     "domhandler": {
       "version": "2.4.1",
-      "from": "domhandler@>=2.3.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.4.1.tgz",
+      "integrity": "sha1-iS5HAAqZvlW783dP/qBWHYh5wlk="
     },
     "domutils": {
       "version": "1.5.1",
-      "from": "domutils@1.5.1",
-      "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.5.1.tgz"
+      "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.5.1.tgz",
+      "integrity": "sha1-3NhIiib1Y9YQeeSMn3t+Mjc2gs8="
     },
     "dot-prop": {
       "version": "3.0.0",
-      "from": "dot-prop@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-3.0.0.tgz",
+      "integrity": "sha1-G3CK8JSknJoOfbyteQq6U52sEXc="
     },
     "duplexer": {
       "version": "0.1.1",
-      "from": "duplexer@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz",
+      "integrity": "sha1-rOb/gIwc5mtX0ev5eXessCM0z8E="
     },
     "duplexer2": {
       "version": "0.0.2",
-      "from": "duplexer2@0.0.2",
-      "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.0.2.tgz",
+      "integrity": "sha1-xhTc9n4vsUmVqRcR5aYX6KYKMds="
     },
     "duplexer3": {
       "version": "0.1.4",
-      "from": "duplexer3@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/duplexer3/-/duplexer3-0.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/duplexer3/-/duplexer3-0.1.4.tgz",
+      "integrity": "sha1-7gHdHKwO08vH/b6jfcCo8c4ALOI="
     },
     "duplexify": {
       "version": "3.5.0",
-      "from": "duplexify@>=3.5.0 <4.0.0",
       "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-3.5.0.tgz",
+      "integrity": "sha1-GqdzAC4VeEV+nZ1KULDMquvL1gQ=",
       "dependencies": {
         "end-of-stream": {
           "version": "1.0.0",
-          "from": "end-of-stream@1.0.0",
-          "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.0.0.tgz",
+          "integrity": "sha1-1FlucCc0qT5A6a+GQxnqvZn/Lw4="
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "once": {
           "version": "1.3.3",
-          "from": "once@>=1.3.0 <1.4.0",
-          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz"
+          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz",
+          "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "ecc-jsbn": {
       "version": "0.1.1",
-      "from": "ecc-jsbn@>=0.1.1 <0.2.0",
       "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.1.tgz",
+      "integrity": "sha1-D8c6ntXw1Tw4GTOYUj735UN3dQU=",
       "optional": true
     },
     "ee-first": {
       "version": "1.1.1",
-      "from": "ee-first@1.1.1",
-      "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
+      "integrity": "sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0="
     },
     "ejs": {
       "version": "2.5.6",
-      "from": "ejs@>=2.5.6 <3.0.0",
-      "resolved": "https://registry.npmjs.org/ejs/-/ejs-2.5.6.tgz"
+      "resolved": "https://registry.npmjs.org/ejs/-/ejs-2.5.6.tgz",
+      "integrity": "sha1-R5Y2v6P+Ox3r1SCH8KyyBLTxnIg="
     },
     "electron-to-chromium": {
       "version": "1.3.13",
-      "from": "electron-to-chromium@>=1.2.7 <2.0.0",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.13.tgz"
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.13.tgz",
+      "integrity": "sha1-GzperObgh7teJXoQCwy/6Bsokfw="
     },
     "elliptic": {
       "version": "6.4.0",
-      "from": "elliptic@>=6.0.0 <7.0.0",
-      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.4.0.tgz",
+      "integrity": "sha1-ysmvh2LIWDYYcAPI3+GT5eLq5d8="
     },
     "emojis-list": {
       "version": "2.1.0",
-      "from": "emojis-list@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-2.1.0.tgz",
+      "integrity": "sha1-TapNnbAPmBmIDHn6RXrlsJof04k="
     },
     "encodeurl": {
       "version": "1.0.1",
-      "from": "encodeurl@>=1.0.1 <1.1.0",
-      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.1.tgz",
+      "integrity": "sha1-eePVhlU0aQn+bw9Fpd5oEDspTSA="
     },
     "encoding": {
       "version": "0.1.12",
-      "from": "encoding@>=0.1.11 <0.2.0",
-      "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.12.tgz"
+      "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.12.tgz",
+      "integrity": "sha1-U4tm8+5izRq1HsMjgp0flIDHS+s="
     },
     "end-of-stream": {
       "version": "1.1.0",
-      "from": "end-of-stream@>=1.1.0 <1.2.0",
       "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.1.0.tgz",
+      "integrity": "sha1-6TUyWLqpEIll78QcsO+K3i88+wc=",
       "dependencies": {
         "once": {
           "version": "1.3.3",
-          "from": "once@>=1.3.0 <1.4.0",
-          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz"
+          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz",
+          "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA="
         }
       }
     },
     "engine.io": {
       "version": "1.8.4",
-      "from": "engine.io@>=1.8.4 <1.9.0",
       "resolved": "https://registry.npmjs.org/engine.io/-/engine.io-1.8.4.tgz",
+      "integrity": "sha1-d7zhK4Dl1gQpM3/sOw2vaR68kAM=",
       "dependencies": {
         "debug": {
           "version": "2.3.3",
-          "from": "debug@2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
+          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
+          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
         }
       }
     },
     "engine.io-client": {
       "version": "1.8.4",
-      "from": "engine.io-client@>=1.8.4 <1.9.0",
       "resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-1.8.4.tgz",
+      "integrity": "sha1-n+hd7iWFPKa6viW9KtaHEIY+kcI=",
       "dependencies": {
         "component-emitter": {
           "version": "1.2.1",
-          "from": "component-emitter@1.2.1",
-          "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz",
+          "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY="
         },
         "debug": {
           "version": "2.3.3",
-          "from": "debug@2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
+          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
+          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
         },
         "ws": {
           "version": "1.1.2",
-          "from": "ws@1.1.2",
-          "resolved": "https://registry.npmjs.org/ws/-/ws-1.1.2.tgz"
+          "resolved": "https://registry.npmjs.org/ws/-/ws-1.1.2.tgz",
+          "integrity": "sha1-iiRPoFJAHgjJiGz0SoUYnh/UBn8="
         }
       }
     },
     "engine.io-parser": {
       "version": "1.3.2",
-      "from": "engine.io-parser@1.3.2",
-      "resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-1.3.2.tgz"
+      "resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-1.3.2.tgz",
+      "integrity": "sha1-k3sHnwAH0Ik+xW1GyyILjLQ1Igo="
     },
     "enhanced-resolve": {
       "version": "0.9.1",
-      "from": "enhanced-resolve@>=0.9.0 <0.10.0",
       "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-0.9.1.tgz",
+      "integrity": "sha1-TW5omzcl+GCQknzMhs2fFjW4ni4=",
       "dependencies": {
         "memory-fs": {
           "version": "0.2.0",
-          "from": "memory-fs@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.2.0.tgz",
+          "integrity": "sha1-8rslNovBIeORwlIN6Slpyu4KApA="
         }
       }
     },
     "ent": {
       "version": "2.2.0",
-      "from": "ent@>=2.2.0 <2.3.0",
-      "resolved": "https://registry.npmjs.org/ent/-/ent-2.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/ent/-/ent-2.2.0.tgz",
+      "integrity": "sha1-6WQhkyWiHQX0RGai9obtbOX13R0="
     },
     "entities": {
       "version": "1.1.1",
-      "from": "entities@>=1.1.1 <1.2.0",
-      "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.1.tgz",
+      "integrity": "sha1-blwtClYhtdra7O+AuQ7ftc13cvA="
     },
     "envify": {
       "version": "3.4.1",
-      "from": "envify@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/envify/-/envify-3.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/envify/-/envify-3.4.1.tgz",
+      "integrity": "sha1-1xIjKejfFoi6dxsSUBkXyc5cvOg="
     },
     "enzyme": {
       "version": "2.7.0",
-      "from": "enzyme@2.7.0",
       "resolved": "https://registry.npmjs.org/enzyme/-/enzyme-2.7.0.tgz",
+      "integrity": "sha1-dyR3gAVHyiUUzAryWOZHwWau6Jk=",
       "dependencies": {
         "lodash": {
           "version": "4.17.4",
-          "from": "lodash@>=4.17.2 <5.0.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz"
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
         },
         "uuid": {
           "version": "2.0.3",
-          "from": "uuid@>=2.0.3 <3.0.0",
-          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz"
+          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz",
+          "integrity": "sha1-Z+LoY3lyFVMN/zGOW/nc6/1Hsho="
         }
       }
     },
     "errno": {
       "version": "0.1.4",
-      "from": "errno@>=0.1.3 <0.2.0",
-      "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.4.tgz",
+      "integrity": "sha1-uJbiOp5ei6M4cfyZar02NfyaHH0="
     },
     "error-ex": {
       "version": "1.3.1",
-      "from": "error-ex@>=1.2.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.1.tgz"
+      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.1.tgz",
+      "integrity": "sha1-+FWobOYa3E6GIcPNoh56dhLDqNw="
     },
     "errorhandler": {
       "version": "1.4.3",
-      "from": "errorhandler@>=1.4.2 <1.5.0",
-      "resolved": "https://registry.npmjs.org/errorhandler/-/errorhandler-1.4.3.tgz"
+      "resolved": "https://registry.npmjs.org/errorhandler/-/errorhandler-1.4.3.tgz",
+      "integrity": "sha1-t7cO2PNZ6duICS8tIMD4MUIK2D8="
     },
     "es-abstract": {
       "version": "1.7.0",
-      "from": "es-abstract@>=1.6.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.7.0.tgz",
+      "integrity": "sha1-363ndOAb/Nl/lhgCmMRJyGI/uUw="
     },
     "es-to-primitive": {
       "version": "1.1.1",
-      "from": "es-to-primitive@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.1.1.tgz",
+      "integrity": "sha1-RTVSSKiJeQNLZ5Lhm7gfK3l13Q0="
     },
     "es5-ext": {
       "version": "0.10.21",
-      "from": "es5-ext@>=0.10.14 <0.11.0",
-      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.21.tgz"
+      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.21.tgz",
+      "integrity": "sha1-Gacl+eUdAwC7wejoIRCf2dr1WSU="
     },
     "es6-collections": {
       "version": "0.5.6",
-      "from": "es6-collections@0.5.6",
-      "resolved": "https://registry.npmjs.org/es6-collections/-/es6-collections-0.5.6.tgz"
+      "resolved": "https://registry.npmjs.org/es6-collections/-/es6-collections-0.5.6.tgz",
+      "integrity": "sha1-VVLoAK0SwYIM2ivUp5rn27A9iaI="
     },
     "es6-iterator": {
       "version": "2.0.1",
-      "from": "es6-iterator@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.1.tgz",
+      "integrity": "sha1-jjGcnwRTv1ddN0lAplWSDlnKVRI="
     },
     "es6-promise": {
-      "version": "4.0.5",
-      "from": "es6-promise@>=4.0.3 <4.1.0",
-      "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.0.5.tgz"
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.0.tgz",
+      "integrity": "sha1-3aA8qPn4m8WX5omEKSnee6jOvfA="
     },
     "es6-symbol": {
       "version": "3.1.1",
-      "from": "es6-symbol@>=3.1.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.1.tgz",
+      "integrity": "sha1-vwDvT9q2uhtG7Le2KbTH7VcVzHc="
     },
     "es6-templates": {
       "version": "0.2.3",
-      "from": "es6-templates@>=0.2.2 <0.3.0",
-      "resolved": "https://registry.npmjs.org/es6-templates/-/es6-templates-0.2.3.tgz"
+      "resolved": "https://registry.npmjs.org/es6-templates/-/es6-templates-0.2.3.tgz",
+      "integrity": "sha1-XLmsn7He1usSOTQrgdeSu7QHjuQ="
     },
     "es6-weak-map": {
       "version": "2.0.2",
-      "from": "es6-weak-map@>=2.0.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/es6-weak-map/-/es6-weak-map-2.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/es6-weak-map/-/es6-weak-map-2.0.2.tgz",
+      "integrity": "sha1-XjqzIlH/0VOKH45f+hNXdy+S2W8="
     },
     "escape-html": {
       "version": "1.0.3",
-      "from": "escape-html@>=1.0.3 <1.1.0",
-      "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
+      "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg="
     },
     "escape-string-regexp": {
       "version": "1.0.5",
-      "from": "escape-string-regexp@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
+      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ="
     },
     "escodegen": {
       "version": "1.8.1",
-      "from": "escodegen@>=1.8.0 <1.9.0",
       "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-1.8.1.tgz",
+      "integrity": "sha1-WltTr0aTEQvrsIZ6o0MN07cKEBg=",
       "dependencies": {
         "esprima": {
           "version": "2.7.3",
-          "from": "esprima@>=2.7.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz"
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz",
+          "integrity": "sha1-luO3DVd59q1JzQMmc9HDEnZ7pYE="
         },
         "source-map": {
           "version": "0.2.0",
-          "from": "source-map@>=0.2.0 <0.3.0",
           "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.2.0.tgz",
+          "integrity": "sha1-2rc/vPwrqBm03gO9b26qSBZLP50=",
           "optional": true
         }
       }
     },
     "esprima": {
       "version": "3.1.3",
-      "from": "esprima@>=3.1.0 <3.2.0",
-      "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz",
+      "integrity": "sha1-/cpRzuYTOJXjyI1TXOSdv/YqRjM="
     },
     "estraverse": {
       "version": "1.9.3",
-      "from": "estraverse@>=1.9.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-1.9.3.tgz"
+      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-1.9.3.tgz",
+      "integrity": "sha1-r2fy3JIlgkFZUJJgkaQAXSnJu0Q="
     },
     "esutils": {
       "version": "2.0.2",
-      "from": "esutils@>=2.0.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.2.tgz",
+      "integrity": "sha1-Cr9PHKpbyx96nYrMbepPqqBLrJs="
     },
     "etag": {
       "version": "1.7.0",
-      "from": "etag@>=1.7.0 <1.8.0",
-      "resolved": "https://registry.npmjs.org/etag/-/etag-1.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/etag/-/etag-1.7.0.tgz",
+      "integrity": "sha1-A9MLX2fdbmMtKUXTDWZScxo01dg="
     },
     "event-stream": {
       "version": "3.0.20",
-      "from": "event-stream@>=3.0.20 <3.1.0",
-      "resolved": "https://registry.npmjs.org/event-stream/-/event-stream-3.0.20.tgz"
+      "resolved": "https://registry.npmjs.org/event-stream/-/event-stream-3.0.20.tgz",
+      "integrity": "sha1-A4u7LqnqkDhbJvvBhU0LU58qvqM="
     },
     "eventemitter3": {
       "version": "1.2.0",
-      "from": "eventemitter3@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-1.2.0.tgz",
+      "integrity": "sha1-HIaZHYFq0eUEdQ5zh0Ik7PO+xQg="
     },
     "events": {
       "version": "1.1.1",
-      "from": "events@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/events/-/events-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/events/-/events-1.1.1.tgz",
+      "integrity": "sha1-nr23Y1rQmccNzEwqH1AEKI6L2SQ="
     },
     "eventsource": {
       "version": "0.1.6",
-      "from": "eventsource@0.1.6",
-      "resolved": "https://registry.npmjs.org/eventsource/-/eventsource-0.1.6.tgz"
+      "resolved": "https://registry.npmjs.org/eventsource/-/eventsource-0.1.6.tgz",
+      "integrity": "sha1-Cs7ehJ7X3RzMMsgRuxG5RNTykjI="
     },
     "evp_bytestokey": {
       "version": "1.0.0",
-      "from": "evp_bytestokey@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/evp_bytestokey/-/evp_bytestokey-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/evp_bytestokey/-/evp_bytestokey-1.0.0.tgz",
+      "integrity": "sha1-SXtmrZ/vZc18CKYYCCS6FHa2blM="
     },
     "execa": {
       "version": "0.4.0",
-      "from": "execa@>=0.4.0 <0.5.0",
-      "resolved": "https://registry.npmjs.org/execa/-/execa-0.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/execa/-/execa-0.4.0.tgz",
+      "integrity": "sha1-TrZGejaglfq7KXD/nV4/t7zm68M="
     },
     "exit-hook": {
       "version": "1.1.1",
-      "from": "exit-hook@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/exit-hook/-/exit-hook-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/exit-hook/-/exit-hook-1.1.1.tgz",
+      "integrity": "sha1-8FyiM7SMBdVP/wd2XfhQfpXAL/g="
     },
     "expand-braces": {
       "version": "0.1.2",
-      "from": "expand-braces@>=0.1.1 <0.2.0",
       "resolved": "https://registry.npmjs.org/expand-braces/-/expand-braces-0.1.2.tgz",
+      "integrity": "sha1-SIsdHSRRyz06axks/AMPRMWFX+o=",
       "dependencies": {
         "braces": {
           "version": "0.1.5",
-          "from": "braces@>=0.1.2 <0.2.0",
-          "resolved": "https://registry.npmjs.org/braces/-/braces-0.1.5.tgz"
+          "resolved": "https://registry.npmjs.org/braces/-/braces-0.1.5.tgz",
+          "integrity": "sha1-wIVxEIUpHYt1/ddOqw+FlygHEeY="
         },
         "expand-range": {
           "version": "0.1.1",
-          "from": "expand-range@>=0.1.0 <0.2.0",
-          "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-0.1.1.tgz"
+          "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-0.1.1.tgz",
+          "integrity": "sha1-TLjtoJk8pW+k9B/ELzy7TMrf8EQ="
         },
         "is-number": {
           "version": "0.1.1",
-          "from": "is-number@>=0.1.1 <0.2.0",
-          "resolved": "https://registry.npmjs.org/is-number/-/is-number-0.1.1.tgz"
+          "resolved": "https://registry.npmjs.org/is-number/-/is-number-0.1.1.tgz",
+          "integrity": "sha1-aaevEWlj1HIG7JvZtIoUIW8eOAY="
         },
         "repeat-string": {
           "version": "0.2.2",
-          "from": "repeat-string@>=0.2.2 <0.3.0",
-          "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-0.2.2.tgz"
+          "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-0.2.2.tgz",
+          "integrity": "sha1-x6jTI2BoNiBZp+RlH8aITosftK4="
         }
       }
     },
     "expand-brackets": {
       "version": "0.1.5",
-      "from": "expand-brackets@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz"
+      "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
+      "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s="
     },
     "expand-range": {
       "version": "1.8.2",
-      "from": "expand-range@>=1.8.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz"
+      "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz",
+      "integrity": "sha1-opnv/TNf4nIeuujiV+x5ZE/IUzc="
     },
     "expand-tilde": {
       "version": "1.2.2",
-      "from": "expand-tilde@>=1.2.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-1.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-1.2.2.tgz",
+      "integrity": "sha1-C4HrqJflo9MdHD0QL48BRB5VlEk="
     },
     "express": {
       "version": "4.14.1",
-      "from": "express@>=4.14.0 <4.15.0",
       "resolved": "https://registry.npmjs.org/express/-/express-4.14.1.tgz",
+      "integrity": "sha1-ZGwjf3ZvFIwhIK/wc4F7nk1+DTM=",
       "dependencies": {
         "debug": {
           "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "finalhandler": {
           "version": "0.5.1",
-          "from": "finalhandler@0.5.1",
-          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.5.1.tgz"
+          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.5.1.tgz",
+          "integrity": "sha1-LEANjUUwk1vCMlScX6OF7Afeb80="
         },
         "ms": {
           "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         },
         "qs": {
           "version": "6.2.0",
-          "from": "qs@6.2.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-6.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.2.0.tgz",
+          "integrity": "sha1-O3hIwDwt7OaalSKw+ujEEm10Xzs="
         }
       }
     },
     "express-session": {
       "version": "1.11.3",
-      "from": "express-session@>=1.11.3 <1.12.0",
       "resolved": "https://registry.npmjs.org/express-session/-/express-session-1.11.3.tgz",
+      "integrity": "sha1-XMmPP1/4Ttg1+Ry/CqvQxxB0AK8=",
       "dependencies": {
         "cookie": {
           "version": "0.1.3",
-          "from": "cookie@0.1.3",
-          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz"
+          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz",
+          "integrity": "sha1-5zSlwUF/zkctWu+Cw4HKu2TRpDU="
         },
         "debug": {
           "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "depd": {
           "version": "1.0.1",
-          "from": "depd@>=1.0.1 <1.1.0",
-          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz",
+          "integrity": "sha1-gK7GTJ1tl+ZcwqnKqTwKpqv3Oqo="
         },
         "ms": {
           "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         },
         "uid-safe": {
           "version": "2.0.0",
-          "from": "uid-safe@>=2.0.0 <2.1.0",
-          "resolved": "https://registry.npmjs.org/uid-safe/-/uid-safe-2.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/uid-safe/-/uid-safe-2.0.0.tgz",
+          "integrity": "sha1-p/PGymSh9qXQTsDvPkw9U2cxcTc="
         }
       }
     },
     "extend": {
       "version": "3.0.1",
-      "from": "extend@>=3.0.0 <3.1.0",
-      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz",
+      "integrity": "sha1-p1Xqe8Gt/MWjHOfnYtuq3F5jZEQ="
     },
     "extend-shallow": {
       "version": "2.0.1",
-      "from": "extend-shallow@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+      "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8="
     },
     "extglob": {
       "version": "0.3.2",
-      "from": "extglob@>=0.3.1 <0.4.0",
-      "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz"
+      "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
+      "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
     },
     "extract-zip": {
       "version": "1.5.0",
-      "from": "extract-zip@>=1.5.0 <1.6.0",
       "resolved": "https://registry.npmjs.org/extract-zip/-/extract-zip-1.5.0.tgz",
+      "integrity": "sha1-ksz22B73Cp+kwXRxFMzvbYaIpsQ=",
       "dependencies": {
         "debug": {
           "version": "0.7.4",
-          "from": "debug@0.7.4",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-0.7.4.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-0.7.4.tgz",
+          "integrity": "sha1-BuHqgILCyxTjmAbiLi9vdX+Srzk="
         },
         "minimist": {
           "version": "0.0.8",
-          "from": "minimist@0.0.8",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz"
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
+          "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0="
         },
         "mkdirp": {
           "version": "0.5.0",
-          "from": "mkdirp@0.5.0",
-          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.0.tgz"
+          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.0.tgz",
+          "integrity": "sha1-HXMHam35hs2TROFecfzAWkyavxI="
         }
       }
     },
     "extsprintf": {
       "version": "1.0.2",
-      "from": "extsprintf@1.0.2",
-      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.0.2.tgz",
+      "integrity": "sha1-4QgOBljjALBilJkMxw4VAiNf1VA="
     },
     "fancy-log": {
       "version": "1.3.0",
-      "from": "fancy-log@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/fancy-log/-/fancy-log-1.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/fancy-log/-/fancy-log-1.3.0.tgz",
+      "integrity": "sha1-Rb4X0Cu5kX1gzP/UmVyZnmyMmUg="
     },
     "fast-levenshtein": {
       "version": "2.0.6",
-      "from": "fast-levenshtein@>=2.0.4 <2.1.0",
-      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz"
+      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
+      "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc="
     },
     "fastparse": {
       "version": "1.1.1",
-      "from": "fastparse@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.1.tgz",
+      "integrity": "sha1-0eJkOzipTXWDtHkGDmxK/8lAcfg="
     },
     "faye-websocket": {
       "version": "0.10.0",
-      "from": "faye-websocket@>=0.10.0 <0.11.0",
-      "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz"
+      "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz",
+      "integrity": "sha1-TkkvjQTftviQA1B/btvy1QHnxvQ="
     },
     "fbjs": {
       "version": "0.6.1",
-      "from": "fbjs@>=0.6.1 <0.7.0",
       "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.6.1.tgz",
+      "integrity": "sha1-lja3cF9bqWhNRLcveDISVK/IYPc=",
       "dependencies": {
         "core-js": {
           "version": "1.2.7",
-          "from": "core-js@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
+          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
         }
       }
     },
     "fd-slicer": {
       "version": "1.0.1",
-      "from": "fd-slicer@>=1.0.1 <1.1.0",
-      "resolved": "https://registry.npmjs.org/fd-slicer/-/fd-slicer-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/fd-slicer/-/fd-slicer-1.0.1.tgz",
+      "integrity": "sha1-i1vL2ewyfFBBv5qwI/1nUPEXfmU="
     },
     "figures": {
       "version": "1.7.0",
-      "from": "figures@>=1.3.5 <2.0.0",
-      "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz",
+      "integrity": "sha1-y+Hjr/zxzUS4DK3+0o3Hk6lwHS4="
     },
     "file-loader": {
       "version": "0.8.5",
-      "from": "file-loader@>=0.8.5 <0.9.0",
-      "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.8.5.tgz"
+      "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.8.5.tgz",
+      "integrity": "sha1-knXQMf54DyfUf19K8CvUNxPMFRs="
     },
     "filename-regex": {
       "version": "2.0.1",
-      "from": "filename-regex@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz",
+      "integrity": "sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY="
     },
     "filesize": {
       "version": "3.5.10",
-      "from": "filesize@>=3.5.9 <4.0.0",
-      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.5.10.tgz"
+      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.5.10.tgz",
+      "integrity": "sha1-/I+iPdtO+eXgq24eZPZ5okpWdh8="
     },
     "fill-range": {
       "version": "2.2.3",
-      "from": "fill-range@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz"
+      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz",
+      "integrity": "sha1-ULd9/X5Gm8dJJHCWNpn+eoSFpyM="
     },
     "filled-array": {
       "version": "1.1.0",
-      "from": "filled-array@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/filled-array/-/filled-array-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/filled-array/-/filled-array-1.1.0.tgz",
+      "integrity": "sha1-w8T2xmO5I0WamqKZEtLQMfFQf4Q="
     },
     "finalhandler": {
       "version": "1.0.3",
-      "from": "finalhandler@1.0.3",
-      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.3.tgz",
+      "integrity": "sha1-70fneVDpmXgOhgIqVg4yF+DQzIk="
     },
     "find-index": {
       "version": "0.1.1",
-      "from": "find-index@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
+      "integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ="
     },
     "find-up": {
       "version": "1.1.2",
-      "from": "find-up@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
+      "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8="
     },
     "findup-sync": {
       "version": "0.4.3",
-      "from": "findup-sync@>=0.4.2 <0.5.0",
-      "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.4.3.tgz"
+      "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.4.3.tgz",
+      "integrity": "sha1-QAQ5Kee8YK3wt/SCfExudaDeyhI="
     },
     "fined": {
       "version": "1.0.2",
-      "from": "fined@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/fined/-/fined-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/fined/-/fined-1.0.2.tgz",
+      "integrity": "sha1-WyhCS3YNdZiWC374SA3/itNmDpc="
     },
     "first-chunk-stream": {
       "version": "1.0.0",
-      "from": "first-chunk-stream@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/first-chunk-stream/-/first-chunk-stream-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/first-chunk-stream/-/first-chunk-stream-1.0.0.tgz",
+      "integrity": "sha1-Wb+1DNkF9g18OUzT2ayqtOatk04="
     },
     "flagged-respawn": {
       "version": "0.3.2",
-      "from": "flagged-respawn@>=0.3.2 <0.4.0",
-      "resolved": "https://registry.npmjs.org/flagged-respawn/-/flagged-respawn-0.3.2.tgz"
+      "resolved": "https://registry.npmjs.org/flagged-respawn/-/flagged-respawn-0.3.2.tgz",
+      "integrity": "sha1-/xke3c1wiKZ1smEP/8l2vpuAdLU="
     },
     "flatten": {
       "version": "1.0.2",
-      "from": "flatten@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz",
+      "integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I="
     },
     "for-in": {
       "version": "1.0.2",
-      "from": "for-in@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
+      "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA="
     },
     "for-own": {
       "version": "0.1.5",
-      "from": "for-own@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz"
+      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz",
+      "integrity": "sha1-UmXGgaTylNq78XyVCbZ2OqhFEM4="
     },
     "foreach": {
       "version": "2.0.5",
-      "from": "foreach@>=2.0.5 <3.0.0",
-      "resolved": "https://registry.npmjs.org/foreach/-/foreach-2.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/foreach/-/foreach-2.0.5.tgz",
+      "integrity": "sha1-C+4AUBiusmDQo6865ljdATbsG5k="
     },
     "forever-agent": {
       "version": "0.6.1",
-      "from": "forever-agent@>=0.6.1 <0.7.0",
-      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz"
+      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
+      "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE="
     },
     "fork-stream": {
       "version": "0.0.4",
-      "from": "fork-stream@>=0.0.4 <0.0.5",
-      "resolved": "https://registry.npmjs.org/fork-stream/-/fork-stream-0.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/fork-stream/-/fork-stream-0.0.4.tgz",
+      "integrity": "sha1-24Sfznf2cIpfjzhq5TOgkHtUrnA="
     },
     "form-data": {
       "version": "2.1.4",
-      "from": "form-data@>=2.1.1 <2.2.0",
-      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
+      "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE="
     },
     "formatio": {
       "version": "1.1.1",
-      "from": "formatio@1.1.1",
-      "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.1.1.tgz",
+      "integrity": "sha1-XtPM1jZVEJc4NGXZlhmRAOhhYek="
     },
     "forwarded": {
       "version": "0.1.0",
-      "from": "forwarded@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.0.tgz",
+      "integrity": "sha1-Ge+YdMSuHCl7zweP3mOgm2aoQ2M="
     },
     "fresh": {
       "version": "0.3.0",
-      "from": "fresh@0.3.0",
-      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.3.0.tgz",
+      "integrity": "sha1-ZR+DjiJCTnVm3hYdg1jKoZn4PU8="
     },
     "from": {
       "version": "0.1.7",
-      "from": "from@>=0.0.0 <1.0.0",
-      "resolved": "https://registry.npmjs.org/from/-/from-0.1.7.tgz"
+      "resolved": "https://registry.npmjs.org/from/-/from-0.1.7.tgz",
+      "integrity": "sha1-g8YK/Fi5xWmXAH7Rp2izqzA6RP4="
     },
     "fs-exists-sync": {
       "version": "0.1.0",
-      "from": "fs-exists-sync@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/fs-exists-sync/-/fs-exists-sync-0.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/fs-exists-sync/-/fs-exists-sync-0.1.0.tgz",
+      "integrity": "sha1-mC1ok6+RjnLQjeyehnP/K1qNat0="
     },
     "fs-extra": {
       "version": "0.26.7",
-      "from": "fs-extra@>=0.26.7 <0.27.0",
-      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz"
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz",
+      "integrity": "sha1-muH92UiXeY7at20JGM9C0MMYT6k="
     },
     "fs.realpath": {
       "version": "1.0.0",
-      "from": "fs.realpath@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
+      "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
     },
     "fstream": {
       "version": "1.0.11",
-      "from": "fstream@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz"
+      "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
+      "integrity": "sha1-XB+x8RdHcRTwYyoOtLcbPLD9MXE="
     },
     "ftp": {
       "version": "0.3.10",
-      "from": "ftp@>=0.3.8 <0.4.0",
-      "resolved": "https://registry.npmjs.org/ftp/-/ftp-0.3.10.tgz"
+      "resolved": "https://registry.npmjs.org/ftp/-/ftp-0.3.10.tgz",
+      "integrity": "sha1-kZfYYa2BQvPmPVqDv+TFn3MwiF0="
     },
     "function-bind": {
       "version": "1.1.0",
-      "from": "function-bind@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.0.tgz",
+      "integrity": "sha1-FhdnFMgBeY5Ojyz391KUZ7tKV3E="
     },
     "function.prototype.name": {
       "version": "1.0.0",
-      "from": "function.prototype.name@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.0.0.tgz",
+      "integrity": "sha1-X1I8pk5JGl+Vq6gMweORCAoUSC4="
     },
     "gauge": {
       "version": "2.7.4",
-      "from": "gauge@>=2.7.3 <2.8.0",
-      "resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz"
+      "resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz",
+      "integrity": "sha1-LANAXHU4w51+s3sxcCLjJfsBi/c="
     },
     "gaze": {
       "version": "0.5.2",
-      "from": "gaze@>=0.5.1 <0.6.0",
-      "resolved": "https://registry.npmjs.org/gaze/-/gaze-0.5.2.tgz"
+      "resolved": "https://registry.npmjs.org/gaze/-/gaze-0.5.2.tgz",
+      "integrity": "sha1-QLcJU30k0dRXZ9takIaJ3+aaxE8="
     },
     "generate-function": {
       "version": "2.0.0",
-      "from": "generate-function@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/generate-function/-/generate-function-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/generate-function/-/generate-function-2.0.0.tgz",
+      "integrity": "sha1-aFj+fAlpt9TpCTM3ZHrHn2DfvnQ="
     },
     "generate-object-property": {
       "version": "1.2.0",
-      "from": "generate-object-property@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/generate-object-property/-/generate-object-property-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/generate-object-property/-/generate-object-property-1.2.0.tgz",
+      "integrity": "sha1-nA4cQDCM6AT0eDYYuTf6iPmdUNA="
     },
     "generic-names": {
       "version": "1.0.2",
-      "from": "generic-names@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/generic-names/-/generic-names-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/generic-names/-/generic-names-1.0.2.tgz",
+      "integrity": "sha1-4lt/7OtbWo8o9flyp8z+V+Virc0="
     },
     "get-caller-file": {
       "version": "1.0.2",
-      "from": "get-caller-file@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz",
+      "integrity": "sha1-9wLmMSfn4jHBYKgMFVSstw1QR+U="
     },
     "get-own-enumerable-property-symbols": {
       "version": "1.0.1",
-      "from": "get-own-enumerable-property-symbols@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/get-own-enumerable-property-symbols/-/get-own-enumerable-property-symbols-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/get-own-enumerable-property-symbols/-/get-own-enumerable-property-symbols-1.0.1.tgz",
+      "integrity": "sha1-8dTjrRQC4DmJjlbR6bmqkkwm5IQ="
     },
     "get-stdin": {
       "version": "4.0.1",
-      "from": "get-stdin@>=4.0.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz",
+      "integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4="
     },
     "get-stream": {
       "version": "3.0.0",
-      "from": "get-stream@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz",
+      "integrity": "sha1-jpQ9E1jcN1VQVOy+LtsFqhdO3hQ="
     },
     "getpass": {
       "version": "0.1.7",
-      "from": "getpass@>=0.1.1 <0.2.0",
       "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
+      "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo=",
       "dependencies": {
         "assert-plus": {
           "version": "1.0.0",
-          "from": "assert-plus@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
         }
       }
     },
     "git-rev": {
       "version": "0.2.1",
-      "from": "git-rev@0.2.1",
-      "resolved": "https://registry.npmjs.org/git-rev/-/git-rev-0.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/git-rev/-/git-rev-0.2.1.tgz",
+      "integrity": "sha1-jMvSCSs0W8LJFJVIOW31SWRspj8="
     },
     "glamor": {
       "version": "2.20.25",
-      "from": "glamor@>=2.20.24 <3.0.0",
       "resolved": "https://registry.npmjs.org/glamor/-/glamor-2.20.25.tgz",
+      "integrity": "sha1-cbhLgrZ6kyd3GsWd5T7pFdFIpKM=",
       "dependencies": {
         "core-js": {
           "version": "1.2.7",
-          "from": "core-js@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
+          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
         },
         "fbjs": {
           "version": "0.8.12",
-          "from": "fbjs@>=0.8.8 <0.9.0",
-          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz"
+          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz",
+          "integrity": "sha1-ELXZL3bUVXX9Y6IX1OoCvqL47QQ="
         }
       }
     },
     "glob": {
       "version": "7.1.2",
-      "from": "glob@>=7.0.5 <8.0.0",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
+      "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ=="
     },
     "glob-base": {
       "version": "0.3.0",
-      "from": "glob-base@>=0.3.0 <0.4.0",
-      "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz",
+      "integrity": "sha1-27Fk9iIbHAscz4Kuoyi0l98Oo8Q="
     },
     "glob-escape": {
       "version": "0.0.2",
-      "from": "glob-escape@>=0.0.1 <0.1.0",
-      "resolved": "https://registry.npmjs.org/glob-escape/-/glob-escape-0.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/glob-escape/-/glob-escape-0.0.2.tgz",
+      "integrity": "sha1-nCf3gh7RwTd1gvPv2VWOP2dWKO0="
     },
     "glob-parent": {
       "version": "2.0.0",
-      "from": "glob-parent@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz",
+      "integrity": "sha1-gTg9ctsFT8zPUzbaqQLxgvbtuyg="
     },
     "glob-stream": {
       "version": "3.1.18",
-      "from": "glob-stream@>=3.1.5 <4.0.0",
       "resolved": "https://registry.npmjs.org/glob-stream/-/glob-stream-3.1.18.tgz",
+      "integrity": "sha1-kXCl8St5Awb9/lmPMT+PeVT9FDs=",
       "dependencies": {
         "glob": {
           "version": "4.5.3",
-          "from": "glob@>=4.3.1 <5.0.0",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-4.5.3.tgz"
+          "resolved": "https://registry.npmjs.org/glob/-/glob-4.5.3.tgz",
+          "integrity": "sha1-xstz0yJsHv7wTePFbQEvAzd+4V8="
         },
         "minimatch": {
           "version": "2.0.10",
-          "from": "minimatch@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-2.0.10.tgz"
+          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-2.0.10.tgz",
+          "integrity": "sha1-jQh8OcazjAAbl/ynzm0OHoCvusc="
         },
         "readable-stream": {
           "version": "1.0.34",
-          "from": "readable-stream@>=1.0.33-1 <1.1.0-0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
         },
         "through2": {
           "version": "0.6.5",
-          "from": "through2@>=0.6.1 <0.7.0",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz"
+          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
+          "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg="
         }
       }
     },
     "glob-watcher": {
       "version": "0.0.6",
-      "from": "glob-watcher@>=0.0.6 <0.0.7",
-      "resolved": "https://registry.npmjs.org/glob-watcher/-/glob-watcher-0.0.6.tgz"
+      "resolved": "https://registry.npmjs.org/glob-watcher/-/glob-watcher-0.0.6.tgz",
+      "integrity": "sha1-uVtKjfdLOcgymLDAXJeLTZo7cQs="
     },
     "glob2base": {
       "version": "0.0.12",
-      "from": "glob2base@>=0.0.12 <0.0.13",
-      "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz"
+      "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz",
+      "integrity": "sha1-nUGbPijxLoOjYhZKJ3BVkiycDVY="
     },
     "global-modules": {
       "version": "0.2.3",
-      "from": "global-modules@>=0.2.3 <0.3.0",
-      "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-0.2.3.tgz"
+      "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-0.2.3.tgz",
+      "integrity": "sha1-6lo77ULG1s6ZWk+KEmm12uIjgo0="
     },
     "global-prefix": {
       "version": "0.1.5",
-      "from": "global-prefix@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-0.1.5.tgz"
+      "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-0.1.5.tgz",
+      "integrity": "sha1-jTvGuNo8qBEqFg2NSW/wRiv+948="
     },
     "globby": {
       "version": "5.0.0",
-      "from": "globby@>=5.0.0 <5.1.0",
-      "resolved": "https://registry.npmjs.org/globby/-/globby-5.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/globby/-/globby-5.0.0.tgz",
+      "integrity": "sha1-69hGZ8oNuzMLmbz8aOrCvFQ3Dg0="
     },
     "globule": {
       "version": "0.1.0",
-      "from": "globule@>=0.1.0 <0.2.0",
       "resolved": "https://registry.npmjs.org/globule/-/globule-0.1.0.tgz",
+      "integrity": "sha1-2cjt3h2nnRJaFRt5UzuXhnY0auU=",
       "dependencies": {
         "glob": {
           "version": "3.1.21",
-          "from": "glob@>=3.1.21 <3.2.0",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-3.1.21.tgz"
+          "resolved": "https://registry.npmjs.org/glob/-/glob-3.1.21.tgz",
+          "integrity": "sha1-0p4KBV3qUTj00H7UDomC6DwgZs0="
         },
         "graceful-fs": {
           "version": "1.2.3",
-          "from": "graceful-fs@>=1.2.0 <1.3.0",
-          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-1.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-1.2.3.tgz",
+          "integrity": "sha1-FaSAaldUfLLS2/J/QuiajDRRs2Q="
         },
         "inherits": {
           "version": "1.0.2",
-          "from": "inherits@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/inherits/-/inherits-1.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/inherits/-/inherits-1.0.2.tgz",
+          "integrity": "sha1-ykMJ2t7mtUzAuNJH6NfHoJdb3Js="
         },
         "lodash": {
           "version": "1.0.2",
-          "from": "lodash@>=1.0.1 <1.1.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-1.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-1.0.2.tgz",
+          "integrity": "sha1-j1dWDIO1n8JwvT1WG2kAQ0MOJVE="
         },
         "minimatch": {
           "version": "0.2.14",
-          "from": "minimatch@>=0.2.11 <0.3.0",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.2.14.tgz"
+          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.2.14.tgz",
+          "integrity": "sha1-x054BXT2PG+aCQ6Q775u9TpqdWo="
         }
       }
     },
     "glogg": {
       "version": "1.0.0",
-      "from": "glogg@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/glogg/-/glogg-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/glogg/-/glogg-1.0.0.tgz",
+      "integrity": "sha1-f+DxmfV6yQbPUS/urY+Q7kooT8U="
     },
     "got": {
       "version": "5.7.1",
-      "from": "got@>=5.0.0 <6.0.0",
       "resolved": "https://registry.npmjs.org/got/-/got-5.7.1.tgz",
+      "integrity": "sha1-X4FjWmHkplifGAVp6k44FoClHzU=",
       "dependencies": {
         "duplexer2": {
           "version": "0.1.4",
-          "from": "duplexer2@>=0.1.4 <0.2.0",
-          "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.1.4.tgz"
+          "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.1.4.tgz",
+          "integrity": "sha1-ixLauHjA1p4+eJEFFmKjL8a93ME="
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "graceful-fs": {
       "version": "4.1.11",
-      "from": "graceful-fs@>=4.1.2 <5.0.0",
-      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz"
+      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz",
+      "integrity": "sha1-Dovf5NHduIVNZOBOp8AOKgJuVlg="
     },
     "graceful-readlink": {
       "version": "1.0.1",
-      "from": "graceful-readlink@>=1.0.0",
-      "resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz",
+      "integrity": "sha1-TK+tdrxi8C+gObL5Tpo906ORpyU="
     },
     "growl": {
       "version": "1.9.2",
-      "from": "growl@1.9.2",
-      "resolved": "https://registry.npmjs.org/growl/-/growl-1.9.2.tgz"
+      "resolved": "https://registry.npmjs.org/growl/-/growl-1.9.2.tgz",
+      "integrity": "sha1-Dqd0NxXbjY3ixe3hd14bRayFwC8="
     },
     "growly": {
       "version": "1.3.0",
-      "from": "growly@>=1.3.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz",
+      "integrity": "sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE="
     },
     "gulp": {
       "version": "3.9.1",
-      "from": "gulp@>=3.9.1 <3.10.0",
       "resolved": "https://registry.npmjs.org/gulp/-/gulp-3.9.1.tgz",
+      "integrity": "sha1-VxzkWSjdQK9lFPxAEYZgFsE4RbQ=",
       "dependencies": {
         "semver": {
           "version": "4.3.6",
-          "from": "semver@>=4.1.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz"
+          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz",
+          "integrity": "sha1-MAvG4OhjdPe6YQaLWx7NV/xlMto="
         }
       }
     },
     "gulp-cache": {
       "version": "0.4.6",
-      "from": "gulp-cache@>=0.4.5 <0.5.0",
       "resolved": "https://registry.npmjs.org/gulp-cache/-/gulp-cache-0.4.6.tgz",
+      "integrity": "sha1-LQO1LbT2pVOuHVvvAeSD6Qfp95Y=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.4 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         },
         "vinyl": {
           "version": "1.2.0",
-          "from": "vinyl@>=1.1.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz",
+          "integrity": "sha1-XIgDbPVl5d8FVYv8kR+GVt8hiIQ="
         }
       }
     },
     "gulp-changed": {
       "version": "1.3.2",
-      "from": "gulp-changed@>=1.3.2 <1.4.0",
-      "resolved": "https://registry.npmjs.org/gulp-changed/-/gulp-changed-1.3.2.tgz"
+      "resolved": "https://registry.npmjs.org/gulp-changed/-/gulp-changed-1.3.2.tgz",
+      "integrity": "sha1-nvyNMl+YBcx2aP3059YNSxQQ8s8="
     },
     "gulp-clean-css": {
       "version": "2.0.13",
-      "from": "gulp-clean-css@>=2.0.11 <2.1.0",
       "resolved": "https://registry.npmjs.org/gulp-clean-css/-/gulp-clean-css-2.0.13.tgz",
+      "integrity": "sha1-hd70qqKvbwbBZG4FER/XtLXmJ9A=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.1.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "gulp-clip-empty-files": {
       "version": "0.1.2",
-      "from": "gulp-clip-empty-files@>=0.1.2 <0.2.0",
-      "resolved": "https://registry.npmjs.org/gulp-clip-empty-files/-/gulp-clip-empty-files-0.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/gulp-clip-empty-files/-/gulp-clip-empty-files-0.1.2.tgz",
+      "integrity": "sha1-vumATiU7vaVc+8Em6NuuZDPtzMg="
     },
     "gulp-clone": {
       "version": "1.0.0",
-      "from": "gulp-clone@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/gulp-clone/-/gulp-clone-1.0.0.tgz",
+      "integrity": "sha1-mubGVr2cTzae6AXu9WV4a8gQBbA=",
       "dependencies": {
         "ansi-regex": {
           "version": "0.2.1",
-          "from": "ansi-regex@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-0.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-0.2.1.tgz",
+          "integrity": "sha1-DY6UaWej2BQ/k+JOKYUl/BsiNfk="
         },
         "ansi-styles": {
           "version": "1.1.0",
-          "from": "ansi-styles@>=1.1.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-1.1.0.tgz",
+          "integrity": "sha1-6uy/Zs1waIJ2Cy9GkVgrj1XXp94="
         },
         "chalk": {
           "version": "0.5.1",
-          "from": "chalk@>=0.5.0 <0.6.0",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-0.5.1.tgz"
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-0.5.1.tgz",
+          "integrity": "sha1-Zjs6ZItotV0EaQ1JFnqoN4WPIXQ="
         },
         "dateformat": {
           "version": "1.0.12",
-          "from": "dateformat@>=1.0.7-1.2.3 <2.0.0",
-          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz"
+          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
+          "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk="
         },
         "gulp-util": {
           "version": "2.2.20",
-          "from": "gulp-util@>=2.2.14 <2.3.0",
           "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-2.2.20.tgz",
+          "integrity": "sha1-1xRuVyiRC9jwR6awseVJvCLb1kw=",
           "dependencies": {
             "through2": {
               "version": "0.5.1",
-              "from": "through2@>=0.5.0 <0.6.0",
-              "resolved": "https://registry.npmjs.org/through2/-/through2-0.5.1.tgz"
+              "resolved": "https://registry.npmjs.org/through2/-/through2-0.5.1.tgz",
+              "integrity": "sha1-390BLrnHAOIyP9M084rGIqs3Lac="
             }
           }
         },
         "has-ansi": {
           "version": "0.1.0",
-          "from": "has-ansi@>=0.1.0 <0.2.0",
-          "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-0.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-0.1.0.tgz",
+          "integrity": "sha1-hPJlqujA5qiKEtcCKJS3VoiUxi4="
         },
         "lodash._reinterpolate": {
           "version": "2.4.1",
-          "from": "lodash._reinterpolate@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-2.4.1.tgz",
+          "integrity": "sha1-TxInqlqHEfxjL1sHofRgequLMiI="
         },
         "lodash.escape": {
           "version": "2.4.1",
-          "from": "lodash.escape@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-2.4.1.tgz",
+          "integrity": "sha1-LOEsXghNsKV92l5dHu659dF1o7Q="
         },
         "lodash.keys": {
           "version": "2.4.1",
-          "from": "lodash.keys@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz",
+          "integrity": "sha1-SN6kbfj/djKxDXBrissmWR4rNyc="
         },
         "lodash.template": {
           "version": "2.4.1",
-          "from": "lodash.template@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-2.4.1.tgz",
+          "integrity": "sha1-nmEQB+32KRKal0qzxIuBez4c8g0="
         },
         "lodash.templatesettings": {
           "version": "2.4.1",
-          "from": "lodash.templatesettings@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-2.4.1.tgz",
+          "integrity": "sha1-6nbHXRHrhtTb6JqDiTu4YZKaxpk="
         },
         "minimist": {
           "version": "0.2.0",
-          "from": "minimist@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.0.tgz",
+          "integrity": "sha1-Tf/lJdriuGTGbC4jxicdev3s784="
         },
         "readable-stream": {
           "version": "1.0.34",
-          "from": "readable-stream@>=1.0.17 <1.1.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
         },
         "strip-ansi": {
           "version": "0.3.0",
-          "from": "strip-ansi@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-0.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-0.3.0.tgz",
+          "integrity": "sha1-JfSOoiynkYfzF0pNuHWTR7sSYiA="
         },
         "supports-color": {
           "version": "0.2.0",
-          "from": "supports-color@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-0.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-0.2.0.tgz",
+          "integrity": "sha1-2S3iaU6z9nMjlz1649i1W0wiGQo="
         },
         "through2": {
           "version": "0.4.2",
-          "from": "through2@>=0.4.1 <0.5.0",
           "resolved": "https://registry.npmjs.org/through2/-/through2-0.4.2.tgz",
+          "integrity": "sha1-2/WGYDEVHsg1K7bE22SiKSqEC5s=",
           "dependencies": {
             "xtend": {
               "version": "2.1.2",
-              "from": "xtend@>=2.1.1 <2.2.0",
-              "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz"
+              "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz",
+              "integrity": "sha1-bv7MKk2tjmlixJAbM3znuoe10os="
             }
           }
         },
         "vinyl": {
           "version": "0.2.3",
-          "from": "vinyl@>=0.2.1 <0.3.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.2.3.tgz",
+          "integrity": "sha1-vKk4IJWC7FpJrVOKAPofEl5RMlI="
         },
         "xtend": {
           "version": "3.0.0",
-          "from": "xtend@>=3.0.0 <3.1.0",
-          "resolved": "https://registry.npmjs.org/xtend/-/xtend-3.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/xtend/-/xtend-3.0.0.tgz",
+          "integrity": "sha1-XM50B7r2Qsunvs2laBEcST9ZZlo="
         }
       }
     },
     "gulp-connect": {
       "version": "5.0.0",
-      "from": "gulp-connect@>=5.0.0 <5.1.0",
       "resolved": "https://registry.npmjs.org/gulp-connect/-/gulp-connect-5.0.0.tgz",
+      "integrity": "sha1-8v3zBq6RFGg2jCKF8teC8T7dr04=",
       "dependencies": {
         "body-parser": {
           "version": "1.13.3",
-          "from": "body-parser@>=1.13.3 <1.14.0",
-          "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.13.3.tgz"
+          "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.13.3.tgz",
+          "integrity": "sha1-wIzzMMM1jhUQFqBXRvE/ApyX+pc="
         },
         "bytes": {
           "version": "2.1.0",
-          "from": "bytes@2.1.0",
-          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.1.0.tgz",
+          "integrity": "sha1-rJPEEOL/ycx89LRks4KJBn9eR7Q="
         },
         "connect": {
           "version": "2.30.2",
-          "from": "connect@>=2.30.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/connect/-/connect-2.30.2.tgz"
+          "resolved": "https://registry.npmjs.org/connect/-/connect-2.30.2.tgz",
+          "integrity": "sha1-jam8vooFTT0xjXTf7JA7XDmhtgk="
         },
         "cookie": {
           "version": "0.1.3",
-          "from": "cookie@0.1.3",
-          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz"
+          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz",
+          "integrity": "sha1-5zSlwUF/zkctWu+Cw4HKu2TRpDU="
         },
         "debug": {
           "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "depd": {
           "version": "1.0.1",
-          "from": "depd@>=1.0.1 <1.1.0",
-          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz",
+          "integrity": "sha1-gK7GTJ1tl+ZcwqnKqTwKpqv3Oqo="
         },
         "escape-html": {
           "version": "1.0.2",
-          "from": "escape-html@1.0.2",
-          "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.2.tgz",
+          "integrity": "sha1-130y+pjjjC9BroXpJ44ODmuhAiw="
         },
         "event-stream": {
           "version": "3.3.4",
-          "from": "event-stream@>=3.3.2 <4.0.0",
-          "resolved": "https://registry.npmjs.org/event-stream/-/event-stream-3.3.4.tgz"
+          "resolved": "https://registry.npmjs.org/event-stream/-/event-stream-3.3.4.tgz",
+          "integrity": "sha1-SrTJoPWlTbkzi0w02Gv86PSzVXE="
         },
         "finalhandler": {
           "version": "0.4.0",
-          "from": "finalhandler@0.4.0",
-          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.4.0.tgz"
+          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.4.0.tgz",
+          "integrity": "sha1-llpS2ejQXSuFdUhUH7ibU6JJfZs="
         },
         "http-errors": {
           "version": "1.3.1",
-          "from": "http-errors@>=1.3.1 <1.4.0",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
+          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
         },
         "iconv-lite": {
           "version": "0.4.11",
-          "from": "iconv-lite@0.4.11",
-          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.11.tgz"
+          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.11.tgz",
+          "integrity": "sha1-LstC/SlHRJIiCaLnxATayHk9it4="
         },
         "map-stream": {
           "version": "0.1.0",
-          "from": "map-stream@>=0.1.0 <0.2.0",
-          "resolved": "https://registry.npmjs.org/map-stream/-/map-stream-0.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/map-stream/-/map-stream-0.1.0.tgz",
+          "integrity": "sha1-5WqpTEyAVaFkBKBnS3jyFffI4ZQ="
         },
         "mime": {
           "version": "1.3.4",
-          "from": "mime@1.3.4",
-          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz"
+          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz",
+          "integrity": "sha1-EV+eO2s9rylZmDyzjxSaLUDrXVM="
         },
         "ms": {
           "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         },
         "qs": {
           "version": "4.0.0",
-          "from": "qs@4.0.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-4.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/qs/-/qs-4.0.0.tgz",
+          "integrity": "sha1-wx2bdOwn33XlQ6hseHKO2NRiNgc="
         },
         "range-parser": {
           "version": "1.0.3",
-          "from": "range-parser@>=1.0.3 <1.1.0",
-          "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.0.3.tgz"
+          "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.0.3.tgz",
+          "integrity": "sha1-aHKCNTXGkuLCoBA4Jq/YLC4P8XU="
         },
         "raw-body": {
           "version": "2.1.7",
-          "from": "raw-body@>=2.1.2 <2.2.0",
           "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.1.7.tgz",
+          "integrity": "sha1-rf6s4uT7MJgFgBTQjActzFl1h3Q=",
           "dependencies": {
             "bytes": {
               "version": "2.4.0",
-              "from": "bytes@2.4.0",
-              "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz"
+              "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz",
+              "integrity": "sha1-fZcZb51br39pNeJZhVSe3SpsIzk="
             },
             "iconv-lite": {
               "version": "0.4.13",
-              "from": "iconv-lite@0.4.13",
-              "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.13.tgz"
+              "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.13.tgz",
+              "integrity": "sha1-H4irpKsLFQjoMSrMOTRfNumS4vI="
             }
           }
         },
         "send": {
           "version": "0.13.2",
-          "from": "send@0.13.2",
           "resolved": "https://registry.npmjs.org/send/-/send-0.13.2.tgz",
+          "integrity": "sha1-dl52B8gFVFK7pvCwUllTUJhgNt4=",
           "dependencies": {
             "depd": {
               "version": "1.1.0",
-              "from": "depd@~1.1.0",
-              "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.0.tgz"
+              "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.0.tgz",
+              "integrity": "sha1-4b2Cxqq2ztlluXuIsX7T5SjKGMM="
             },
             "escape-html": {
               "version": "1.0.3",
-              "from": "escape-html@~1.0.3",
-              "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz"
+              "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
+              "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg="
             },
             "statuses": {
               "version": "1.2.1",
-              "from": "statuses@>=1.2.1 <1.3.0",
-              "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.2.1.tgz"
+              "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.2.1.tgz",
+              "integrity": "sha1-3e1FzBglbVHtQK7BQkidXGECbSg="
             }
           }
         },
         "serve-static": {
           "version": "1.10.3",
-          "from": "serve-static@>=1.10.0 <1.11.0",
           "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.10.3.tgz",
+          "integrity": "sha1-zlpuzTEB/tXsCYJ9rCKpwpv7BTU=",
           "dependencies": {
             "escape-html": {
               "version": "1.0.3",
-              "from": "escape-html@~1.0.3",
-              "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz"
+              "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
+              "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg="
             }
           }
         },
         "split": {
           "version": "0.3.3",
-          "from": "split@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/split/-/split-0.3.3.tgz"
+          "resolved": "https://registry.npmjs.org/split/-/split-0.3.3.tgz",
+          "integrity": "sha1-zQ7qXmOiEd//frDwkcQTPi0N0o8="
         }
       }
     },
     "gulp-debug": {
       "version": "3.1.0",
-      "from": "gulp-debug@3.1.0",
-      "resolved": "https://registry.npmjs.org/gulp-debug/-/gulp-debug-3.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/gulp-debug/-/gulp-debug-3.1.0.tgz",
+      "integrity": "sha1-TakVaLVJFb6ANpbKqsEMiVssCnE="
     },
     "gulp-decomment": {
       "version": "0.1.3",
-      "from": "gulp-decomment@>=0.1.3 <0.2.0",
-      "resolved": "https://registry.npmjs.org/gulp-decomment/-/gulp-decomment-0.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/gulp-decomment/-/gulp-decomment-0.1.3.tgz",
+      "integrity": "sha1-q6CMjhbzh3bQhtNuMV8ZpbGjFjU="
     },
     "gulp-flatten": {
       "version": "0.2.0",
-      "from": "gulp-flatten@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/gulp-flatten/-/gulp-flatten-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/gulp-flatten/-/gulp-flatten-0.2.0.tgz",
+      "integrity": "sha1-iS1RfjjXkA/UVM+aHgIQMA6S6wY="
     },
     "gulp-if": {
       "version": "2.0.2",
-      "from": "gulp-if@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/gulp-if/-/gulp-if-2.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/gulp-if/-/gulp-if-2.0.2.tgz",
+      "integrity": "sha1-pJe351cwBQQcqivIt92jyARE1ik="
     },
     "gulp-karma": {
       "version": "0.0.5",
-      "from": "gulp-karma@>=0.0.5 <0.1.0",
       "resolved": "https://registry.npmjs.org/gulp-karma/-/gulp-karma-0.0.5.tgz",
+      "integrity": "sha1-RLoZejEFTlyXOlujOUITwUKAOVg=",
       "dependencies": {
         "ansi-regex": {
           "version": "0.2.1",
-          "from": "ansi-regex@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-0.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-0.2.1.tgz",
+          "integrity": "sha1-DY6UaWej2BQ/k+JOKYUl/BsiNfk="
         },
         "ansi-styles": {
           "version": "1.1.0",
-          "from": "ansi-styles@>=1.1.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-1.1.0.tgz",
+          "integrity": "sha1-6uy/Zs1waIJ2Cy9GkVgrj1XXp94="
         },
         "chalk": {
           "version": "0.5.1",
-          "from": "chalk@>=0.5.0 <0.6.0",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-0.5.1.tgz"
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-0.5.1.tgz",
+          "integrity": "sha1-Zjs6ZItotV0EaQ1JFnqoN4WPIXQ="
         },
         "dateformat": {
           "version": "1.0.12",
-          "from": "dateformat@>=1.0.7-1.2.3 <2.0.0",
-          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz"
+          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
+          "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk="
         },
         "gulp-util": {
           "version": "2.2.20",
-          "from": "gulp-util@>=2.2.14 <2.3.0",
-          "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-2.2.20.tgz"
+          "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-2.2.20.tgz",
+          "integrity": "sha1-1xRuVyiRC9jwR6awseVJvCLb1kw="
         },
         "has-ansi": {
           "version": "0.1.0",
-          "from": "has-ansi@>=0.1.0 <0.2.0",
-          "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-0.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-0.1.0.tgz",
+          "integrity": "sha1-hPJlqujA5qiKEtcCKJS3VoiUxi4="
         },
         "lodash._reinterpolate": {
           "version": "2.4.1",
-          "from": "lodash._reinterpolate@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-2.4.1.tgz",
+          "integrity": "sha1-TxInqlqHEfxjL1sHofRgequLMiI="
         },
         "lodash.escape": {
           "version": "2.4.1",
-          "from": "lodash.escape@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-2.4.1.tgz",
+          "integrity": "sha1-LOEsXghNsKV92l5dHu659dF1o7Q="
         },
         "lodash.keys": {
           "version": "2.4.1",
-          "from": "lodash.keys@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz",
+          "integrity": "sha1-SN6kbfj/djKxDXBrissmWR4rNyc="
         },
         "lodash.template": {
           "version": "2.4.1",
-          "from": "lodash.template@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-2.4.1.tgz",
+          "integrity": "sha1-nmEQB+32KRKal0qzxIuBez4c8g0="
         },
         "lodash.templatesettings": {
           "version": "2.4.1",
-          "from": "lodash.templatesettings@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-2.4.1.tgz",
+          "integrity": "sha1-6nbHXRHrhtTb6JqDiTu4YZKaxpk="
         },
         "minimist": {
           "version": "0.2.0",
-          "from": "minimist@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.0.tgz",
+          "integrity": "sha1-Tf/lJdriuGTGbC4jxicdev3s784="
         },
         "readable-stream": {
           "version": "1.0.34",
-          "from": "readable-stream@>=1.0.17 <1.1.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
         },
         "strip-ansi": {
           "version": "0.3.0",
-          "from": "strip-ansi@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-0.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-0.3.0.tgz",
+          "integrity": "sha1-JfSOoiynkYfzF0pNuHWTR7sSYiA="
         },
         "supports-color": {
           "version": "0.2.0",
-          "from": "supports-color@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-0.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-0.2.0.tgz",
+          "integrity": "sha1-2S3iaU6z9nMjlz1649i1W0wiGQo="
         },
         "through2": {
           "version": "0.5.1",
-          "from": "through2@>=0.5.0 <0.6.0",
           "resolved": "https://registry.npmjs.org/through2/-/through2-0.5.1.tgz",
+          "integrity": "sha1-390BLrnHAOIyP9M084rGIqs3Lac=",
           "dependencies": {
             "xtend": {
               "version": "3.0.0",
-              "from": "xtend@>=3.0.0 <3.1.0",
-              "resolved": "https://registry.npmjs.org/xtend/-/xtend-3.0.0.tgz"
+              "resolved": "https://registry.npmjs.org/xtend/-/xtend-3.0.0.tgz",
+              "integrity": "sha1-XM50B7r2Qsunvs2laBEcST9ZZlo="
             }
           }
         },
         "vinyl": {
           "version": "0.2.3",
-          "from": "vinyl@>=0.2.1 <0.3.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.2.3.tgz",
+          "integrity": "sha1-vKk4IJWC7FpJrVOKAPofEl5RMlI="
         },
         "xtend": {
           "version": "2.1.2",
-          "from": "xtend@>=2.1.1 <2.2.0",
-          "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz"
+          "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz",
+          "integrity": "sha1-bv7MKk2tjmlixJAbM3znuoe10os="
         }
       }
     },
     "gulp-match": {
       "version": "1.0.3",
-      "from": "gulp-match@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/gulp-match/-/gulp-match-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/gulp-match/-/gulp-match-1.0.3.tgz",
+      "integrity": "sha1-kcfA1/Kb7NZgbVfYCn+Hdqh6uo4="
     },
     "gulp-open": {
       "version": "2.0.0",
-      "from": "gulp-open@>=2.0.0 <2.1.0",
-      "resolved": "https://registry.npmjs.org/gulp-open/-/gulp-open-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/gulp-open/-/gulp-open-2.0.0.tgz",
+      "integrity": "sha1-oW9n6VzqiyBhtjo7jDibxVm44c4="
     },
     "gulp-phantomcss": {
       "version": "0.3.0",
-      "from": "gulp-phantomcss@>=0.3.0 <0.4.0",
       "resolved": "https://registry.npmjs.org/gulp-phantomcss/-/gulp-phantomcss-0.3.0.tgz",
+      "integrity": "sha1-Hu0Vyz5BQw0AH5qUVg+/1Pihd1k=",
       "dependencies": {
         "async": {
           "version": "2.4.1",
-          "from": "async@>=2.0.1 <3.0.0",
           "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
+          "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c=",
           "dependencies": {
             "lodash": {
               "version": "4.17.4",
-              "from": "lodash@>=4.14.0 <5.0.0",
-              "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz"
+              "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+              "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
             }
           }
         },
         "caseless": {
           "version": "0.11.0",
-          "from": "caseless@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz"
+          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz",
+          "integrity": "sha1-cVuW6phBWTzDMGeSP17GDr2k99c="
         },
         "dateformat": {
           "version": "1.0.12",
-          "from": "dateformat@>=1.0.11 <2.0.0",
-          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz"
+          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
+          "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk="
         },
         "form-data": {
           "version": "1.0.1",
-          "from": "form-data@>=1.0.0-rc3 <1.1.0",
-          "resolved": "https://registry.npmjs.org/form-data/-/form-data-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/form-data/-/form-data-1.0.1.tgz",
+          "integrity": "sha1-rjFduaSQf6BlUCMEpm13M0de43w="
         },
         "gulp-util": {
           "version": "3.0.7",
-          "from": "gulp-util@3.0.7",
-          "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.7.tgz"
+          "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.7.tgz",
+          "integrity": "sha1-eJJcS4+LSQBawBoBHFV+YhiUHLs="
         },
         "har-validator": {
           "version": "2.0.6",
-          "from": "har-validator@>=2.0.2 <2.1.0",
-          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz"
+          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz",
+          "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0="
         },
         "lodash": {
           "version": "3.10.1",
-          "from": "lodash@3.10.1",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
+          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
         },
         "node-uuid": {
           "version": "1.4.8",
-          "from": "node-uuid@~1.4.7",
-          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz"
+          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz",
+          "integrity": "sha1-sEDrCSOWivq/jTL7HxfxFn/auQc="
         },
         "object-assign": {
           "version": "3.0.0",
-          "from": "object-assign@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz",
+          "integrity": "sha1-m+3VygiXlJvKR+f/QIBi1Un1h/I="
         },
         "phantomjs-prebuilt": {
           "version": "2.1.7",
-          "from": "phantomjs-prebuilt@2.1.7",
-          "resolved": "https://registry.npmjs.org/phantomjs-prebuilt/-/phantomjs-prebuilt-2.1.7.tgz"
+          "resolved": "https://registry.npmjs.org/phantomjs-prebuilt/-/phantomjs-prebuilt-2.1.7.tgz",
+          "integrity": "sha1-yQvxuXcvoZeZQzH88/ZwmaloU8o="
         },
         "qs": {
           "version": "5.2.1",
-          "from": "qs@>=5.2.0 <5.3.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-5.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/qs/-/qs-5.2.1.tgz",
+          "integrity": "sha1-gB/uAw4LlFDWOFrcSKTMVbRK7fw="
         },
         "request": {
           "version": "2.67.0",
-          "from": "request@>=2.67.0 <2.68.0",
-          "resolved": "https://registry.npmjs.org/request/-/request-2.67.0.tgz"
+          "resolved": "https://registry.npmjs.org/request/-/request-2.67.0.tgz",
+          "integrity": "sha1-ivdHgOK/EeoK6aqWXBHxGv0nJ0I="
         },
         "tough-cookie": {
           "version": "2.2.2",
-          "from": "tough-cookie@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.2.2.tgz"
+          "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.2.2.tgz",
+          "integrity": "sha1-yDoYMPTl7wuT7yo0iOck+N4Basc="
         },
         "tunnel-agent": {
           "version": "0.4.3",
-          "from": "tunnel-agent@>=0.4.1 <0.5.0",
-          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz"
+          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz",
+          "integrity": "sha1-Y3PbdpCf5XDgjXNYM2Xtgop07us="
         }
       }
     },
     "gulp-plumber": {
       "version": "1.1.0",
-      "from": "gulp-plumber@>=1.1.0 <1.2.0",
-      "resolved": "https://registry.npmjs.org/gulp-plumber/-/gulp-plumber-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/gulp-plumber/-/gulp-plumber-1.1.0.tgz",
+      "integrity": "sha1-8SF2wtBCL2AwbCQv/2oBo5T6ugk="
     },
     "gulp-postcss": {
       "version": "6.1.1",
-      "from": "gulp-postcss@>=6.1.1 <6.2.0",
-      "resolved": "https://registry.npmjs.org/gulp-postcss/-/gulp-postcss-6.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/gulp-postcss/-/gulp-postcss-6.1.1.tgz",
+      "integrity": "sha1-h01E6f9srd3VfOPJVSAuVy0mkBU="
     },
     "gulp-prompt": {
       "version": "0.2.0",
-      "from": "gulp-prompt@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/gulp-prompt/-/gulp-prompt-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/gulp-prompt/-/gulp-prompt-0.2.0.tgz",
+      "integrity": "sha1-l2DJC72H6AAigzDrrHTWWcwt23g="
     },
     "gulp-replace": {
       "version": "0.5.4",
-      "from": "gulp-replace@>=0.5.4 <0.6.0",
       "resolved": "https://registry.npmjs.org/gulp-replace/-/gulp-replace-0.5.4.tgz",
+      "integrity": "sha1-aaZ5FLvRPFYr/xT1BKQDeWqg2qk=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "gulp-sass": {
       "version": "2.3.2",
-      "from": "gulp-sass@>=2.3.2 <2.4.0",
       "resolved": "https://registry.npmjs.org/gulp-sass/-/gulp-sass-2.3.2.tgz",
+      "integrity": "sha1-grerkP6QLNw0wE8YDZLyw0kC3VI=",
       "dependencies": {
         "gaze": {
           "version": "1.1.2",
-          "from": "gaze@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz"
+          "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz",
+          "integrity": "sha1-hHIkZ3rbiHDWeSV+0ziP22HkAQU="
         },
         "globule": {
           "version": "1.1.0",
-          "from": "globule@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/globule/-/globule-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/globule/-/globule-1.1.0.tgz",
+          "integrity": "sha1-xJNS5NwYPYWJPuglOF65lLtt9F8="
         },
         "lodash": {
           "version": "4.16.6",
-          "from": "lodash@>=4.16.4 <4.17.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.16.6.tgz"
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.16.6.tgz",
+          "integrity": "sha1-0iyaxmAojzhD4Wun0rXQbMon13c="
         },
         "node-sass": {
           "version": "3.13.1",
-          "from": "node-sass@>=3.4.2 <4.0.0",
-          "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-3.13.1.tgz"
+          "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-3.13.1.tgz",
+          "integrity": "sha1-ckD7v/I5YwS0IjUn7TAgWJwAT8I="
         }
       }
     },
     "gulp-sourcemaps": {
       "version": "1.6.0",
-      "from": "gulp-sourcemaps@>=1.6.0 <1.7.0",
       "resolved": "https://registry.npmjs.org/gulp-sourcemaps/-/gulp-sourcemaps-1.6.0.tgz",
+      "integrity": "sha1-uG/zSdgBzrVuHZ59x7vLS33uYAw=",
       "dependencies": {
         "strip-bom": {
           "version": "2.0.0",
-          "from": "strip-bom@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
         },
         "vinyl": {
           "version": "1.2.0",
-          "from": "vinyl@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz",
+          "integrity": "sha1-XIgDbPVl5d8FVYv8kR+GVt8hiIQ="
         }
       }
     },
     "gulp-texttojs": {
       "version": "1.0.3",
-      "from": "gulp-texttojs@>=1.0.3 <1.1.0",
       "resolved": "https://registry.npmjs.org/gulp-texttojs/-/gulp-texttojs-1.0.3.tgz",
+      "integrity": "sha1-SIWgEDXrQfNiPEzADP21Ci+tl3Q=",
       "dependencies": {
         "lodash": {
           "version": "2.4.2",
-          "from": "lodash@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-2.4.2.tgz"
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-2.4.2.tgz",
+          "integrity": "sha1-+t2DS5aDBz2hebPq5tnA0VBT9z4="
         },
         "readable-stream": {
           "version": "1.0.34",
-          "from": "readable-stream@>=1.0.17 <1.1.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
         },
         "through2": {
           "version": "0.4.2",
-          "from": "through2@>=0.4.2 <0.5.0",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.4.2.tgz"
+          "resolved": "https://registry.npmjs.org/through2/-/through2-0.4.2.tgz",
+          "integrity": "sha1-2/WGYDEVHsg1K7bE22SiKSqEC5s="
         },
         "xtend": {
           "version": "2.1.2",
-          "from": "xtend@>=2.1.1 <2.2.0",
-          "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz"
+          "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz",
+          "integrity": "sha1-bv7MKk2tjmlixJAbM3znuoe10os="
         }
       }
     },
     "gulp-typescript": {
       "version": "3.1.7",
-      "from": "gulp-typescript@>=3.1.3 <3.2.0",
       "resolved": "https://registry.npmjs.org/gulp-typescript/-/gulp-typescript-3.1.7.tgz",
+      "integrity": "sha1-2IYAqRQVPxHAnJpcqMJWHsdaSXg=",
       "dependencies": {
         "glob": {
           "version": "5.0.15",
-          "from": "glob@>=5.0.3 <6.0.0",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
+          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
+          "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
         },
         "glob-parent": {
           "version": "3.1.0",
-          "from": "glob-parent@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-3.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-3.1.0.tgz",
+          "integrity": "sha1-nmr2KZ2NO9K9QEMIMr0RPfkGxa4="
         },
         "glob-stream": {
           "version": "5.3.5",
-          "from": "glob-stream@>=5.3.2 <6.0.0",
           "resolved": "https://registry.npmjs.org/glob-stream/-/glob-stream-5.3.5.tgz",
+          "integrity": "sha1-pVZlqajM3EGRWofHAeMtTgFvrSI=",
           "dependencies": {
             "isarray": {
               "version": "0.0.1",
-              "from": "isarray@0.0.1",
-              "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
+              "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+              "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
             },
             "readable-stream": {
               "version": "1.0.34",
-              "from": "readable-stream@>=1.0.33-1 <1.1.0-0",
-              "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
+              "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+              "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
             },
             "string_decoder": {
               "version": "0.10.31",
-              "from": "string_decoder@~0.10.x",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+              "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
             },
             "through2": {
               "version": "0.6.5",
-              "from": "through2@>=0.6.0 <0.7.0",
-              "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz"
+              "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
+              "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg="
             }
           }
         },
         "is-extglob": {
           "version": "2.1.1",
-          "from": "is-extglob@>=2.1.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz"
+          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
+          "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI="
         },
         "is-glob": {
           "version": "3.1.0",
-          "from": "is-glob@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz",
+          "integrity": "sha1-e6WuJCF4BKxwcHuWkiVnSGzD6Eo="
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "ordered-read-streams": {
           "version": "0.3.0",
-          "from": "ordered-read-streams@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.3.0.tgz",
+          "integrity": "sha1-cTfmmzKYuzQiR6G77jiByA4v14s="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.4 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         },
         "strip-bom": {
           "version": "2.0.0",
-          "from": "strip-bom@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
         },
         "unique-stream": {
           "version": "2.2.1",
-          "from": "unique-stream@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-2.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-2.2.1.tgz",
+          "integrity": "sha1-WqADz76Uxf+GbE59ZouxxNuts2k="
         },
         "vinyl": {
           "version": "1.2.0",
-          "from": "vinyl@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz",
+          "integrity": "sha1-XIgDbPVl5d8FVYv8kR+GVt8hiIQ="
         },
         "vinyl-fs": {
           "version": "2.4.4",
-          "from": "vinyl-fs@>=2.4.3 <2.5.0",
-          "resolved": "https://registry.npmjs.org/vinyl-fs/-/vinyl-fs-2.4.4.tgz"
+          "resolved": "https://registry.npmjs.org/vinyl-fs/-/vinyl-fs-2.4.4.tgz",
+          "integrity": "sha1-vm/zJwy1Xf19MGNkDegfJddTIjk="
         }
       }
     },
     "gulp-util": {
       "version": "3.0.8",
-      "from": "gulp-util@3.0.8",
       "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.8.tgz",
+      "integrity": "sha1-AFTh50RQLifATBh8PsxQXdVLu08=",
       "dependencies": {
         "object-assign": {
           "version": "3.0.0",
-          "from": "object-assign@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz",
+          "integrity": "sha1-m+3VygiXlJvKR+f/QIBi1Un1h/I="
         }
       }
     },
     "gulplog": {
       "version": "1.0.0",
-      "from": "gulplog@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/gulplog/-/gulplog-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/gulplog/-/gulplog-1.0.0.tgz",
+      "integrity": "sha1-4oxNRdBey77YGDY86PnFkmIp/+U="
     },
     "gutil": {
       "version": "1.6.4",
-      "from": "gutil@1.6.4",
-      "resolved": "https://registry.npmjs.org/gutil/-/gutil-1.6.4.tgz"
+      "resolved": "https://registry.npmjs.org/gutil/-/gutil-1.6.4.tgz",
+      "integrity": "sha1-d8+fqgWMBHbWO506xfvgTgcvbNI="
     },
     "gzip-size": {
       "version": "3.0.0",
-      "from": "gzip-size@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-3.0.0.tgz",
+      "integrity": "sha1-VGGI6b3DN/Zzdy+BZgRks4nc5SA="
     },
     "handle-thing": {
       "version": "1.2.5",
-      "from": "handle-thing@>=1.2.5 <2.0.0",
-      "resolved": "https://registry.npmjs.org/handle-thing/-/handle-thing-1.2.5.tgz"
+      "resolved": "https://registry.npmjs.org/handle-thing/-/handle-thing-1.2.5.tgz",
+      "integrity": "sha1-/Xqtcmvxpf0W38KbL3pmAdJxOcQ="
     },
     "handlebars": {
       "version": "4.0.10",
-      "from": "handlebars@>=4.0.1 <5.0.0",
       "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.0.10.tgz",
+      "integrity": "sha1-PTDHGLCaPZbyPqTMH0A8TTup/08=",
       "dependencies": {
         "source-map": {
           "version": "0.4.4",
-          "from": "source-map@>=0.4.4 <0.5.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz"
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
+          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s="
         }
       }
     },
     "har-schema": {
       "version": "1.0.5",
-      "from": "har-schema@>=1.0.5 <2.0.0",
-      "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-1.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-1.0.5.tgz",
+      "integrity": "sha1-0mMTX0MwfALGAq/I/pWXDAFRNp4="
     },
     "har-validator": {
       "version": "4.2.1",
-      "from": "har-validator@>=4.2.1 <4.3.0",
-      "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz",
+      "integrity": "sha1-M0gdDxu/9gDdID11gSpqX7oALio="
     },
     "has": {
       "version": "1.0.1",
-      "from": "has@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/has/-/has-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/has/-/has-1.0.1.tgz",
+      "integrity": "sha1-hGFzP1OLCDfJNh45qauelwTcLyg="
     },
     "has-ansi": {
       "version": "2.0.0",
-      "from": "has-ansi@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz",
+      "integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE="
     },
     "has-binary": {
       "version": "0.1.7",
-      "from": "has-binary@0.1.7",
-      "resolved": "https://registry.npmjs.org/has-binary/-/has-binary-0.1.7.tgz"
+      "resolved": "https://registry.npmjs.org/has-binary/-/has-binary-0.1.7.tgz",
+      "integrity": "sha1-aOYesWIQyVRaClzOBqhzkS/h5ow="
     },
     "has-cors": {
       "version": "1.1.0",
-      "from": "has-cors@1.1.0",
-      "resolved": "https://registry.npmjs.org/has-cors/-/has-cors-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/has-cors/-/has-cors-1.1.0.tgz",
+      "integrity": "sha1-XkdHk/fqmEPRu5nCPu9J/xJv/zk="
     },
     "has-flag": {
       "version": "1.0.0",
-      "from": "has-flag@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+      "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
     },
     "has-gulplog": {
       "version": "0.1.0",
-      "from": "has-gulplog@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/has-gulplog/-/has-gulplog-0.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/has-gulplog/-/has-gulplog-0.1.0.tgz",
+      "integrity": "sha1-ZBTIKRNpfaUVkDl9r7EvIpZ4Ec4="
     },
     "has-unicode": {
       "version": "2.0.1",
-      "from": "has-unicode@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz",
+      "integrity": "sha1-4Ob+aijPUROIVeCG0Wkedx3iqLk="
     },
     "hash-base": {
       "version": "2.0.2",
-      "from": "hash-base@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/hash-base/-/hash-base-2.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/hash-base/-/hash-base-2.0.2.tgz",
+      "integrity": "sha1-ZuodhW206KVHDK32/OI65SRO8uE="
     },
     "hash.js": {
       "version": "1.0.3",
-      "from": "hash.js@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/hash.js/-/hash.js-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/hash.js/-/hash.js-1.0.3.tgz",
+      "integrity": "sha1-EzL/ABVsCg/92CNgE9B7d6BFFXM="
     },
     "hasha": {
       "version": "2.2.0",
-      "from": "hasha@>=2.2.0 <2.3.0",
-      "resolved": "https://registry.npmjs.org/hasha/-/hasha-2.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/hasha/-/hasha-2.2.0.tgz",
+      "integrity": "sha1-eNfL/B5tZjA/55g3NlmEUXsvbuE="
     },
     "hawk": {
       "version": "3.1.3",
-      "from": "hawk@>=3.1.3 <3.2.0",
-      "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz",
+      "integrity": "sha1-B4REvXwWQLD+VA0sm3PVlnjo4cQ="
     },
     "he": {
       "version": "1.1.1",
-      "from": "he@>=1.1.0 <1.2.0",
-      "resolved": "https://registry.npmjs.org/he/-/he-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/he/-/he-1.1.1.tgz",
+      "integrity": "sha1-k0EP0hsAlzUVH4howvJx80J+I/0="
     },
     "highlight.js": {
       "version": "9.11.0",
-      "from": "highlight.js@>=9.9.0 <10.0.0",
-      "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-9.11.0.tgz"
+      "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-9.11.0.tgz",
+      "integrity": "sha1-R/mMc5mRhwDbLK8jDe0SzsQahK4="
     },
     "hmac-drbg": {
       "version": "1.0.1",
-      "from": "hmac-drbg@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz",
+      "integrity": "sha1-0nRXAQJabHdabFRXk+1QL8DGSaE="
     },
     "hoek": {
       "version": "2.16.3",
-      "from": "hoek@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz"
+      "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz",
+      "integrity": "sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0="
     },
     "homedir-polyfill": {
       "version": "1.0.1",
-      "from": "homedir-polyfill@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.1.tgz",
+      "integrity": "sha1-TCu8inWJmP7r9e1oWA921GdotLw="
     },
     "hosted-git-info": {
       "version": "2.4.2",
-      "from": "hosted-git-info@>=2.1.4 <3.0.0",
-      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.4.2.tgz"
+      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.4.2.tgz",
+      "integrity": "sha1-AHa59GonBQbduq6lZJaJdGBhKmc="
     },
     "hpack.js": {
       "version": "2.1.6",
-      "from": "hpack.js@>=2.1.6 <3.0.0",
       "resolved": "https://registry.npmjs.org/hpack.js/-/hpack.js-2.1.6.tgz",
+      "integrity": "sha1-h3dMCUnlE/QuhFdbPEVoH63ioLI=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "html-comment-regex": {
       "version": "1.1.1",
-      "from": "html-comment-regex@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/html-comment-regex/-/html-comment-regex-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/html-comment-regex/-/html-comment-regex-1.1.1.tgz",
+      "integrity": "sha1-ZouTd26q5V696POtRkswekljYl4="
     },
     "html-entities": {
       "version": "1.2.1",
-      "from": "html-entities@>=1.2.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-1.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-1.2.1.tgz",
+      "integrity": "sha1-DfKTUfByEWNRXfueVUPl9u7VFi8="
     },
     "html-loader": {
       "version": "0.4.5",
-      "from": "html-loader@>=0.4.3 <0.5.0",
       "resolved": "https://registry.npmjs.org/html-loader/-/html-loader-0.4.5.tgz",
+      "integrity": "sha1-X7zYfNY6XEmn/OL+VvQl4Fcpxow=",
       "dependencies": {
         "loader-utils": {
           "version": "1.1.0",
-          "from": "loader-utils@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
+          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
         }
       }
     },
     "html-minifier": {
       "version": "3.5.2",
-      "from": "html-minifier@>=3.0.1 <4.0.0",
       "resolved": "https://registry.npmjs.org/html-minifier/-/html-minifier-3.5.2.tgz",
+      "integrity": "sha1-1zvD/0SJQkCIGM5gm/P7DqfvTrc=",
       "dependencies": {
         "clean-css": {
           "version": "4.1.3",
-          "from": "clean-css@>=4.1.0 <4.2.0",
-          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.3.tgz"
+          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.3.tgz",
+          "integrity": "sha1-B8/omA7bINRV3cI6rc8eBMblCc4="
         },
         "uglify-js": {
-          "version": "3.0.12",
-          "from": "uglify-js@>=3.0.0 <3.1.0",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.12.tgz"
+          "version": "3.0.13",
+          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.13.tgz",
+          "integrity": "sha1-GHHXNqoeVQxyjX5aZVZXnnCSXWg="
         }
       }
     },
     "htmlparser2": {
       "version": "3.9.2",
-      "from": "htmlparser2@>=3.9.1 <4.0.0",
       "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.9.2.tgz",
+      "integrity": "sha1-G9+HrMoPP55T+k/M6w9LTLsAszg=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "http-browserify": {
       "version": "1.7.0",
-      "from": "http-browserify@>=1.3.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/http-browserify/-/http-browserify-1.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/http-browserify/-/http-browserify-1.7.0.tgz",
+      "integrity": "sha1-M3la3nLfiKz7/TZ3PO/tp2RzWyA="
     },
     "http-deceiver": {
       "version": "1.2.7",
-      "from": "http-deceiver@>=1.2.7 <2.0.0",
-      "resolved": "https://registry.npmjs.org/http-deceiver/-/http-deceiver-1.2.7.tgz"
+      "resolved": "https://registry.npmjs.org/http-deceiver/-/http-deceiver-1.2.7.tgz",
+      "integrity": "sha1-+nFolEq5pRnTN8sL7HKE3D5yPYc="
     },
     "http-errors": {
       "version": "1.6.1",
-      "from": "http-errors@>=1.6.1 <1.7.0",
-      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.1.tgz"
+      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.1.tgz",
+      "integrity": "sha1-X4uO2YrKVFZWv1cplzh/kEpyIlc="
     },
     "http-proxy": {
       "version": "1.16.2",
-      "from": "http-proxy@>=1.13.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.16.2.tgz"
+      "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.16.2.tgz",
+      "integrity": "sha1-Bt/ykpUr9k2+hHH6nfcwZtTzd0I="
     },
     "http-proxy-middleware": {
       "version": "0.17.4",
-      "from": "http-proxy-middleware@>=0.17.4 <0.18.0",
       "resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-0.17.4.tgz",
+      "integrity": "sha1-ZC6ISIUdZvCdTxJJEoRtuutBuDM=",
       "dependencies": {
         "is-extglob": {
           "version": "2.1.1",
-          "from": "is-extglob@>=2.1.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz"
+          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
+          "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI="
         },
         "is-glob": {
           "version": "3.1.0",
-          "from": "is-glob@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz",
+          "integrity": "sha1-e6WuJCF4BKxwcHuWkiVnSGzD6Eo="
         },
         "lodash": {
           "version": "4.17.4",
-          "from": "lodash@>=4.17.2 <5.0.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz"
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
         }
       }
     },
     "http-signature": {
       "version": "1.1.1",
-      "from": "http-signature@>=1.1.0 <1.2.0",
-      "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz",
+      "integrity": "sha1-33LiZwZs0Kxn+3at+OE0qPvPkb8="
     },
     "https-browserify": {
       "version": "0.0.0",
-      "from": "https-browserify@0.0.0",
-      "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.0.tgz",
+      "integrity": "sha1-s//f5zSyo9Sp79WOhlTJH86G6v0="
     },
     "iconv-lite": {
       "version": "0.4.15",
-      "from": "iconv-lite@0.4.15",
-      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.15.tgz"
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.15.tgz",
+      "integrity": "sha1-/iZaIYrGpXz+hUkn6dBMGYJe3es="
     },
     "icss-replace-symbols": {
       "version": "1.1.0",
-      "from": "icss-replace-symbols@1.1.0",
-      "resolved": "https://registry.npmjs.org/icss-replace-symbols/-/icss-replace-symbols-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/icss-replace-symbols/-/icss-replace-symbols-1.1.0.tgz",
+      "integrity": "sha1-Bupvg2ead0njhs/h/oEq5dsiPe0="
     },
     "ieee754": {
       "version": "1.1.8",
-      "from": "ieee754@>=1.1.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.8.tgz"
+      "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.8.tgz",
+      "integrity": "sha1-vjPUCsEO8ZJnAfbwii2G+/0a0+Q="
     },
     "immutability-helper": {
       "version": "2.2.2",
-      "from": "immutability-helper@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.2.2.tgz",
+      "integrity": "sha1-5+nacos94vrTSiFvQVezJtvMyJI="
     },
     "imurmurhash": {
       "version": "0.1.4",
-      "from": "imurmurhash@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz",
+      "integrity": "sha1-khi5srkoojixPcT7a21XbyMUU+o="
     },
     "in-publish": {
       "version": "2.0.0",
-      "from": "in-publish@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/in-publish/-/in-publish-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/in-publish/-/in-publish-2.0.0.tgz",
+      "integrity": "sha1-4g/146KvwmkDILbcVSaCqcf631E="
     },
     "indent-string": {
       "version": "2.1.0",
-      "from": "indent-string@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-2.1.0.tgz",
+      "integrity": "sha1-ji1INIdCEhtKghi3oTfppSBJ3IA="
     },
     "indexes-of": {
       "version": "1.0.1",
-      "from": "indexes-of@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/indexes-of/-/indexes-of-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/indexes-of/-/indexes-of-1.0.1.tgz",
+      "integrity": "sha1-8w9xbI4r00bHtn0985FVZqfAVgc="
     },
     "indexof": {
       "version": "0.0.1",
-      "from": "indexof@0.0.1",
-      "resolved": "https://registry.npmjs.org/indexof/-/indexof-0.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/indexof/-/indexof-0.0.1.tgz",
+      "integrity": "sha1-gtwzbSMrkGIXnQWrMpOmYFn9Q10="
     },
     "inflight": {
       "version": "1.0.6",
-      "from": "inflight@>=1.0.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz"
+      "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
+      "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk="
     },
     "inherits": {
       "version": "2.0.3",
-      "from": "inherits@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
+      "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4="
     },
     "ini": {
       "version": "1.3.4",
-      "from": "ini@>=1.3.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.4.tgz"
+      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.4.tgz",
+      "integrity": "sha1-BTfLedr1m1mhpRff9wbIbsA5Fi4="
     },
     "inpath": {
       "version": "1.0.2",
-      "from": "inpath@>=1.0.2 <1.1.0",
-      "resolved": "https://registry.npmjs.org/inpath/-/inpath-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/inpath/-/inpath-1.0.2.tgz",
+      "integrity": "sha1-SsIZcQ7Hpy9GD/lL9CTdPvDlKBc="
     },
     "inquirer": {
       "version": "0.10.1",
-      "from": "inquirer@>=0.10.0 <0.11.0",
       "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-0.10.1.tgz",
+      "integrity": "sha1-6iXkzmnKFF4FyZ5G3P7AXkASWUo=",
       "dependencies": {
         "lodash": {
           "version": "3.10.1",
-          "from": "lodash@>=3.3.1 <4.0.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
+          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
         }
       }
     },
     "interpret": {
       "version": "1.0.3",
-      "from": "interpret@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.0.3.tgz",
+      "integrity": "sha1-y8NcYu7uc/Gat7EKgBURQBr8D5A="
     },
     "invariant": {
       "version": "2.2.2",
-      "from": "invariant@>=2.2.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.2.tgz",
+      "integrity": "sha1-nh9WrArNtr8wMwbzOL47IErmA2A="
     },
     "invert-kv": {
       "version": "1.0.0",
-      "from": "invert-kv@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/invert-kv/-/invert-kv-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/invert-kv/-/invert-kv-1.0.0.tgz",
+      "integrity": "sha1-EEqOSqym09jNFXqO+L+rLXo//bY="
     },
     "ipaddr.js": {
       "version": "1.3.0",
-      "from": "ipaddr.js@1.3.0",
-      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.3.0.tgz",
+      "integrity": "sha1-HgOlL9rYOou7KyXL9JmLTP/NPew="
     },
     "irregular-plurals": {
       "version": "1.2.0",
-      "from": "irregular-plurals@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/irregular-plurals/-/irregular-plurals-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/irregular-plurals/-/irregular-plurals-1.2.0.tgz",
+      "integrity": "sha1-OPKZg0uowAwwvpxVThNyaXUv86w="
     },
     "is": {
       "version": "3.2.1",
-      "from": "is@>=3.1.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/is/-/is-3.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/is/-/is-3.2.1.tgz",
+      "integrity": "sha1-0Kwq1V63sL7JJqUmb2xmKqqD3KU="
     },
     "is-absolute": {
       "version": "0.2.6",
-      "from": "is-absolute@>=0.2.3 <0.3.0",
-      "resolved": "https://registry.npmjs.org/is-absolute/-/is-absolute-0.2.6.tgz"
+      "resolved": "https://registry.npmjs.org/is-absolute/-/is-absolute-0.2.6.tgz",
+      "integrity": "sha1-IN5p89uULvLYe5wto28XIjWxtes="
     },
     "is-absolute-url": {
       "version": "2.1.0",
-      "from": "is-absolute-url@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/is-absolute-url/-/is-absolute-url-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-absolute-url/-/is-absolute-url-2.1.0.tgz",
+      "integrity": "sha1-UFMN+4T8yap9vnhS6Do3uTufKqY="
     },
     "is-arrayish": {
       "version": "0.2.1",
-      "from": "is-arrayish@>=0.2.1 <0.3.0",
-      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
+      "integrity": "sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0="
     },
     "is-binary-path": {
       "version": "1.0.1",
-      "from": "is-binary-path@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-1.0.1.tgz",
+      "integrity": "sha1-dfFmQrSA8YenEcgUFh/TpKdlWJg="
     },
     "is-buffer": {
       "version": "1.1.5",
-      "from": "is-buffer@>=1.1.5 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.5.tgz"
+      "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.5.tgz",
+      "integrity": "sha1-Hzsm72E7IUuIy8ojzGwB2Hlh7sw="
     },
     "is-builtin-module": {
       "version": "1.0.0",
-      "from": "is-builtin-module@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-1.0.0.tgz",
+      "integrity": "sha1-VAVy0096wxGfj3bDDLwbHgN6/74="
     },
     "is-callable": {
       "version": "1.1.3",
-      "from": "is-callable@>=1.1.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.1.3.tgz",
+      "integrity": "sha1-hut1OSgF3cM69xySoO7fdO52BLI="
     },
     "is-date-object": {
       "version": "1.0.1",
-      "from": "is-date-object@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.1.tgz",
+      "integrity": "sha1-mqIOtq7rv/d/vTPnTKAbM1gdOhY="
     },
     "is-directory": {
       "version": "0.3.1",
-      "from": "is-directory@>=0.3.1 <0.4.0",
-      "resolved": "https://registry.npmjs.org/is-directory/-/is-directory-0.3.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-directory/-/is-directory-0.3.1.tgz",
+      "integrity": "sha1-YTObbyR1/Hcv2cnYP1yFddwVSuE="
     },
     "is-dotfile": {
       "version": "1.0.2",
-      "from": "is-dotfile@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-dotfile/-/is-dotfile-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/is-dotfile/-/is-dotfile-1.0.2.tgz",
+      "integrity": "sha1-LBMjg/ORmfjtwmjKAbmwB9IFzE0="
     },
     "is-equal-shallow": {
       "version": "0.1.3",
-      "from": "is-equal-shallow@>=0.1.3 <0.2.0",
-      "resolved": "https://registry.npmjs.org/is-equal-shallow/-/is-equal-shallow-0.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/is-equal-shallow/-/is-equal-shallow-0.1.3.tgz",
+      "integrity": "sha1-IjgJj8Ih3gvPpdnqxMRdY4qhxTQ="
     },
     "is-extendable": {
       "version": "0.1.1",
-      "from": "is-extendable@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
+      "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik="
     },
     "is-extglob": {
       "version": "1.0.0",
-      "from": "is-extglob@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
+      "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
     },
     "is-finite": {
       "version": "1.0.2",
-      "from": "is-finite@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-finite/-/is-finite-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/is-finite/-/is-finite-1.0.2.tgz",
+      "integrity": "sha1-zGZ3aVYCvlUO8R6LSqYwU0K20Ko="
     },
     "is-fullwidth-code-point": {
       "version": "1.0.0",
-      "from": "is-fullwidth-code-point@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
+      "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
     },
     "is-glob": {
       "version": "2.0.1",
-      "from": "is-glob@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz",
+      "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM="
     },
     "is-my-json-valid": {
       "version": "2.16.0",
-      "from": "is-my-json-valid@>=2.12.4 <3.0.0",
-      "resolved": "https://registry.npmjs.org/is-my-json-valid/-/is-my-json-valid-2.16.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-my-json-valid/-/is-my-json-valid-2.16.0.tgz",
+      "integrity": "sha1-8Hndm/2uZe4gOKrorLyGqxCeNpM="
     },
     "is-npm": {
       "version": "1.0.0",
-      "from": "is-npm@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-npm/-/is-npm-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-npm/-/is-npm-1.0.0.tgz",
+      "integrity": "sha1-8vtjpl5JBbQGyGBydloaTceTufQ="
     },
     "is-number": {
       "version": "2.1.0",
-      "from": "is-number@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz",
+      "integrity": "sha1-Afy7s5NGOlSPL0ZszhbezknbkI8="
     },
     "is-obj": {
       "version": "1.0.1",
-      "from": "is-obj@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-1.0.1.tgz",
+      "integrity": "sha1-PkcprB9f3gJc19g6iW2rn09n2w8="
     },
     "is-path-cwd": {
       "version": "1.0.0",
-      "from": "is-path-cwd@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-1.0.0.tgz",
+      "integrity": "sha1-0iXsIxMuie3Tj9p2dHLmLmXxEG0="
     },
     "is-path-in-cwd": {
       "version": "1.0.0",
-      "from": "is-path-in-cwd@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-1.0.0.tgz",
+      "integrity": "sha1-ZHdYK4IU1gI0YJRWcAO+ip6sBNw="
     },
     "is-path-inside": {
       "version": "1.0.0",
-      "from": "is-path-inside@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-1.0.0.tgz",
+      "integrity": "sha1-/AbloWg/vaE95mev9xe7wQpI838="
     },
     "is-plain-obj": {
       "version": "1.1.0",
-      "from": "is-plain-obj@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-1.1.0.tgz",
+      "integrity": "sha1-caUMhCnfync8kqOQpKA7OfzVHT4="
     },
     "is-plain-object": {
       "version": "2.0.2",
-      "from": "is-plain-object@>=2.0.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.2.tgz",
+      "integrity": "sha1-HZq3lWaZN94xmYBxyh9wF3CzdaQ=",
       "dependencies": {
         "isobject": {
           "version": "3.0.0",
-          "from": "isobject@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.0.tgz",
+          "integrity": "sha1-OVZSF/NmF4nooKDAgNX35rxG4aA="
         }
       }
     },
     "is-posix-bracket": {
       "version": "0.1.1",
-      "from": "is-posix-bracket@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz",
+      "integrity": "sha1-MzTceXdDaOkvAW5vvAqI9c1ua8Q="
     },
     "is-primitive": {
       "version": "2.0.0",
-      "from": "is-primitive@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/is-primitive/-/is-primitive-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-primitive/-/is-primitive-2.0.0.tgz",
+      "integrity": "sha1-IHurkWOEmcB7Kt8kCkGochADRXU="
     },
     "is-property": {
       "version": "1.0.2",
-      "from": "is-property@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-property/-/is-property-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/is-property/-/is-property-1.0.2.tgz",
+      "integrity": "sha1-V/4cTkhHTt1lsJkR8msc1Ald2oQ="
     },
     "is-redirect": {
       "version": "1.0.0",
-      "from": "is-redirect@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-redirect/-/is-redirect-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-redirect/-/is-redirect-1.0.0.tgz",
+      "integrity": "sha1-HQPd7VO9jbDzDCbk+V02/HyH3CQ="
     },
     "is-regex": {
       "version": "1.0.4",
-      "from": "is-regex@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.0.4.tgz",
+      "integrity": "sha1-VRdIm1RwkbCTDglWVM7SXul+lJE="
     },
     "is-regexp": {
       "version": "1.0.0",
-      "from": "is-regexp@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-regexp/-/is-regexp-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-regexp/-/is-regexp-1.0.0.tgz",
+      "integrity": "sha1-/S2INUXEa6xaYz57mgnof6LLUGk="
     },
     "is-relative": {
       "version": "0.2.1",
-      "from": "is-relative@>=0.2.1 <0.3.0",
-      "resolved": "https://registry.npmjs.org/is-relative/-/is-relative-0.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-relative/-/is-relative-0.2.1.tgz",
+      "integrity": "sha1-0n9MfVFtF1+2ENuEu+7yPDvJeqU="
     },
     "is-retry-allowed": {
       "version": "1.1.0",
-      "from": "is-retry-allowed@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-retry-allowed/-/is-retry-allowed-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-retry-allowed/-/is-retry-allowed-1.1.0.tgz",
+      "integrity": "sha1-EaBgVotnM5REAz0BJaYaINVk+zQ="
     },
     "is-stream": {
       "version": "1.1.0",
-      "from": "is-stream@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz",
+      "integrity": "sha1-EtSj3U5o4Lec6428hBc66A2RykQ="
     },
     "is-subset": {
       "version": "0.1.1",
-      "from": "is-subset@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/is-subset/-/is-subset-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-subset/-/is-subset-0.1.1.tgz",
+      "integrity": "sha1-ilkRfZMt4d4A8kX83TnOQ/HpOaY="
     },
     "is-svg": {
       "version": "2.1.0",
-      "from": "is-svg@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/is-svg/-/is-svg-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-svg/-/is-svg-2.1.0.tgz",
+      "integrity": "sha1-z2EJDaDZ77yrhyLeum8DIgjbsOk="
     },
     "is-symbol": {
       "version": "1.0.1",
-      "from": "is-symbol@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.0.1.tgz",
+      "integrity": "sha1-PMWfAAJRlLarLjjbrmaJJWtmBXI="
     },
     "is-typedarray": {
       "version": "1.0.0",
-      "from": "is-typedarray@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz",
+      "integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo="
     },
     "is-unc-path": {
       "version": "0.1.2",
-      "from": "is-unc-path@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/is-unc-path/-/is-unc-path-0.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/is-unc-path/-/is-unc-path-0.1.2.tgz",
+      "integrity": "sha1-arBTpyVzwQJQ/0FqOBTDUXivObk="
     },
     "is-utf8": {
       "version": "0.2.1",
-      "from": "is-utf8@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz",
+      "integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI="
     },
     "is-valid-glob": {
       "version": "0.3.0",
-      "from": "is-valid-glob@>=0.3.0 <0.4.0",
-      "resolved": "https://registry.npmjs.org/is-valid-glob/-/is-valid-glob-0.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-valid-glob/-/is-valid-glob-0.3.0.tgz",
+      "integrity": "sha1-1LVcafUYhvm2XHDWwmItN+KfSP4="
     },
     "is-windows": {
       "version": "0.2.0",
-      "from": "is-windows@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-0.2.0.tgz",
+      "integrity": "sha1-3hqm1j6indJIc3tp8f+LgALSEIw="
     },
     "isarray": {
       "version": "0.0.1",
-      "from": "isarray@0.0.1",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+      "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
     },
     "isbinaryfile": {
       "version": "3.0.2",
-      "from": "isbinaryfile@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/isbinaryfile/-/isbinaryfile-3.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/isbinaryfile/-/isbinaryfile-3.0.2.tgz",
+      "integrity": "sha1-Sj6XTsDLqQBNP8bN5yCeppNopiE="
     },
     "isexe": {
       "version": "2.0.0",
-      "from": "isexe@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
+      "integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA="
     },
     "isobject": {
       "version": "2.1.0",
-      "from": "isobject@>=2.0.0 <3.0.0",
       "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
+      "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         }
       }
     },
     "isomorphic-fetch": {
       "version": "2.2.1",
-      "from": "isomorphic-fetch@>=2.1.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz",
+      "integrity": "sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk=",
       "dependencies": {
         "whatwg-fetch": {
           "version": "2.0.3",
-          "from": "whatwg-fetch@>=0.10.0",
-          "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-2.0.3.tgz"
+          "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-2.0.3.tgz",
+          "integrity": "sha1-nITsLc9oGH/wC8ZOEnS0QhduHIQ="
         }
       }
     },
     "isstream": {
       "version": "0.1.2",
-      "from": "isstream@>=0.1.2 <0.2.0",
-      "resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz",
+      "integrity": "sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo="
     },
     "istanbul": {
       "version": "0.4.5",
-      "from": "istanbul@>=0.0.0 <1.0.0",
       "resolved": "https://registry.npmjs.org/istanbul/-/istanbul-0.4.5.tgz",
+      "integrity": "sha1-ZcfXPUxNqE1POsMQuRj7C4Azczs=",
       "dependencies": {
         "esprima": {
           "version": "2.7.3",
-          "from": "esprima@>=2.7.0 <2.8.0",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz"
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz",
+          "integrity": "sha1-luO3DVd59q1JzQMmc9HDEnZ7pYE="
         },
         "glob": {
           "version": "5.0.15",
-          "from": "glob@>=5.0.15 <6.0.0",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
+          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
+          "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
         },
         "resolve": {
           "version": "1.1.7",
-          "from": "resolve@>=1.1.0 <1.2.0",
-          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz"
+          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz",
+          "integrity": "sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         },
         "wordwrap": {
           "version": "1.0.0",
-          "from": "wordwrap@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz",
+          "integrity": "sha1-J1hIEIkUVqQXHI0CJkQa3pDLyus="
         }
       }
     },
     "istanbul-instrumenter-loader": {
       "version": "0.2.0",
-      "from": "istanbul-instrumenter-loader@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/istanbul-instrumenter-loader/-/istanbul-instrumenter-loader-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/istanbul-instrumenter-loader/-/istanbul-instrumenter-loader-0.2.0.tgz",
+      "integrity": "sha1-ZD5OXk6PlGaGOimpd9KDqzcsAZw="
     },
     "istextorbinary": {
       "version": "1.0.2",
-      "from": "istextorbinary@1.0.2",
-      "resolved": "https://registry.npmjs.org/istextorbinary/-/istextorbinary-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/istextorbinary/-/istextorbinary-1.0.2.tgz",
+      "integrity": "sha1-rOGTVNGpoBc+/rEITOD4ewrX3s8="
     },
     "jade": {
       "version": "0.26.3",
-      "from": "jade@0.26.3",
       "resolved": "https://registry.npmjs.org/jade/-/jade-0.26.3.tgz",
+      "integrity": "sha1-jxDXl32NefL2/4YqgbBRPMslaGw=",
       "dependencies": {
         "commander": {
           "version": "0.6.1",
-          "from": "commander@0.6.1",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-0.6.1.tgz"
+          "resolved": "https://registry.npmjs.org/commander/-/commander-0.6.1.tgz",
+          "integrity": "sha1-+mihT2qUXVTbvlDYzbMyDp47GgY="
         },
         "mkdirp": {
           "version": "0.3.0",
-          "from": "mkdirp@0.3.0",
-          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.3.0.tgz",
+          "integrity": "sha1-G79asbqCevI1dRQ0kEJkVfSB/h4="
         }
       }
     },
     "jju": {
       "version": "1.3.0",
-      "from": "jju@>=1.3.0 <1.4.0",
-      "resolved": "https://registry.npmjs.org/jju/-/jju-1.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/jju/-/jju-1.3.0.tgz",
+      "integrity": "sha1-2t2e8BkkvHKLA/L3l5vb1i96Kqo="
     },
     "jodid25519": {
       "version": "1.0.2",
-      "from": "jodid25519@>=1.0.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/jodid25519/-/jodid25519-1.0.2.tgz",
+      "integrity": "sha1-BtSRIlUJNBlHfUJWM2BuDpB4KWc=",
       "optional": true
     },
     "js-base64": {
       "version": "2.1.9",
-      "from": "js-base64@>=2.1.9 <3.0.0",
-      "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.1.9.tgz"
+      "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.1.9.tgz",
+      "integrity": "sha1-8OgK4DmkvWVLXygfyT8EqRSn/M4="
     },
     "js-tokens": {
       "version": "3.0.1",
-      "from": "js-tokens@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.1.tgz",
+      "integrity": "sha1-COnxMkhKLEWjCQfp3E1VZ7fxFNc="
     },
     "js-yaml": {
       "version": "3.8.4",
-      "from": "js-yaml@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.8.4.tgz"
+      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.8.4.tgz",
+      "integrity": "sha1-UgtFZPhlc7qWZir4Woyvp7S1pvY="
     },
     "jsbn": {
       "version": "0.1.1",
-      "from": "jsbn@>=0.1.0 <0.2.0",
       "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-0.1.1.tgz",
+      "integrity": "sha1-peZUwuWi3rXyAdls77yoDA7y9RM=",
       "optional": true
     },
     "jsesc": {
       "version": "0.5.0",
-      "from": "jsesc@>=0.5.0 <0.6.0",
-      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
+      "integrity": "sha1-597mbjXW/Bb3EP6R1c9p9w8IkR0="
     },
     "json-loader": {
       "version": "0.5.4",
-      "from": "json-loader@>=0.5.4 <0.6.0",
-      "resolved": "https://registry.npmjs.org/json-loader/-/json-loader-0.5.4.tgz"
+      "resolved": "https://registry.npmjs.org/json-loader/-/json-loader-0.5.4.tgz",
+      "integrity": "sha1-i6oTZaYy9Yo8RtIBdfxgAsluN94="
     },
     "json-schema": {
       "version": "0.2.3",
-      "from": "json-schema@0.2.3",
-      "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz"
+      "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz",
+      "integrity": "sha1-tIDIkuWaLwWVTOcnvT8qTogvnhM="
     },
     "json-stable-stringify": {
       "version": "1.0.1",
-      "from": "json-stable-stringify@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz",
+      "integrity": "sha1-mnWdOcXy/1A/1TAGRu1EX4jE+a8="
     },
     "json-stringify-safe": {
       "version": "5.0.1",
-      "from": "json-stringify-safe@>=5.0.1 <5.1.0",
-      "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz",
+      "integrity": "sha1-Epai1Y/UXxmg9s4B1lcB4sc1tus="
     },
     "json3": {
       "version": "3.3.2",
-      "from": "json3@3.3.2",
-      "resolved": "https://registry.npmjs.org/json3/-/json3-3.3.2.tgz"
+      "resolved": "https://registry.npmjs.org/json3/-/json3-3.3.2.tgz",
+      "integrity": "sha1-PAQ0dD35Pi9cQq7nsZvLSDV19OE="
     },
     "json5": {
       "version": "0.5.1",
-      "from": "json5@>=0.5.0 <0.6.0",
-      "resolved": "https://registry.npmjs.org/json5/-/json5-0.5.1.tgz"
+      "resolved": "https://registry.npmjs.org/json5/-/json5-0.5.1.tgz",
+      "integrity": "sha1-Hq3nrMASA0rYTiOWdn6tn6VJWCE="
     },
     "jsonfile": {
       "version": "2.4.0",
-      "from": "jsonfile@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz",
+      "integrity": "sha1-NzaitCi4e72gzIO1P6PWM6NcKug="
     },
     "jsonify": {
       "version": "0.0.0",
-      "from": "jsonify@>=0.0.0 <0.1.0",
-      "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz",
+      "integrity": "sha1-LHS27kHZPKUbe1qu6PUDYx0lKnM="
     },
     "jsonpointer": {
       "version": "4.0.1",
-      "from": "jsonpointer@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/jsonpointer/-/jsonpointer-4.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/jsonpointer/-/jsonpointer-4.0.1.tgz",
+      "integrity": "sha1-T9kss04OnbPInIYi7PUfm5eMbLk="
     },
     "jsprim": {
       "version": "1.4.0",
-      "from": "jsprim@>=1.2.2 <2.0.0",
       "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.0.tgz",
+      "integrity": "sha1-o7h+QCmNjDgFUtjMdiigu5WiKRg=",
       "dependencies": {
         "assert-plus": {
           "version": "1.0.0",
-          "from": "assert-plus@1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
         }
       }
     },
     "jstransform": {
       "version": "11.0.3",
-      "from": "jstransform@>=11.0.3 <12.0.0",
       "resolved": "https://registry.npmjs.org/jstransform/-/jstransform-11.0.3.tgz",
+      "integrity": "sha1-CaeJk+CuTU70SH9hVakfYZDLQiM=",
       "dependencies": {
         "esprima-fb": {
           "version": "15001.1.0-dev-harmony-fb",
-          "from": "esprima-fb@>=15001.1.0-dev-harmony-fb <15002.0.0",
-          "resolved": "https://registry.npmjs.org/esprima-fb/-/esprima-fb-15001.1.0-dev-harmony-fb.tgz"
+          "resolved": "https://registry.npmjs.org/esprima-fb/-/esprima-fb-15001.1.0-dev-harmony-fb.tgz",
+          "integrity": "sha1-MKlHMDxrjV6VW+4rmbHSMyBqaQE="
         },
         "object-assign": {
           "version": "2.1.1",
-          "from": "object-assign@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-2.1.1.tgz"
+          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-2.1.1.tgz",
+          "integrity": "sha1-Q8NuXVaf+OSBbE76i+AtJpZ8GKo="
         },
         "source-map": {
           "version": "0.4.4",
-          "from": "source-map@>=0.4.2 <0.5.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz"
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
+          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s="
         }
       }
     },
     "jszip": {
       "version": "2.5.0",
-      "from": "jszip@2.5.0",
-      "resolved": "https://registry.npmjs.org/jszip/-/jszip-2.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/jszip/-/jszip-2.5.0.tgz",
+      "integrity": "sha1-dET9hVHd8+XacZj+oMkbyDCMwnQ="
     },
     "karma": {
       "version": "0.13.22",
-      "from": "karma@>=0.13.9 <0.14.0",
       "resolved": "https://registry.npmjs.org/karma/-/karma-0.13.22.tgz",
+      "integrity": "sha1-B3ULG9Bj1+fnuRvNLmNU2PKqh0Q=",
       "dependencies": {
         "bluebird": {
           "version": "2.11.0",
-          "from": "bluebird@>=2.9.27 <3.0.0",
-          "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-2.11.0.tgz"
+          "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-2.11.0.tgz",
+          "integrity": "sha1-U0uQM8AiyVecVro7Plpcqvu2UOE="
         },
         "lodash": {
           "version": "3.10.1",
-          "from": "lodash@>=3.8.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
+          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
         }
       }
     },
     "karma-coverage": {
       "version": "0.5.5",
-      "from": "karma-coverage@>=0.5.5 <0.6.0",
       "resolved": "https://registry.npmjs.org/karma-coverage/-/karma-coverage-0.5.5.tgz",
+      "integrity": "sha1-sNWLECXVnVxmICYxhvHVj11TSMU=",
       "dependencies": {
         "dateformat": {
           "version": "1.0.12",
-          "from": "dateformat@>=1.0.6 <2.0.0",
-          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz"
+          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
+          "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk="
         }
       }
     },
     "karma-mocha": {
       "version": "0.2.2",
-      "from": "karma-mocha@>=0.2.2 <0.3.0",
-      "resolved": "https://registry.npmjs.org/karma-mocha/-/karma-mocha-0.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/karma-mocha/-/karma-mocha-0.2.2.tgz",
+      "integrity": "sha1-OI7ZF9oV3LGW0bkVwZNO+AMZP44="
     },
     "karma-mocha-clean-reporter": {
       "version": "0.0.1",
-      "from": "karma-mocha-clean-reporter@>=0.0.1 <0.1.0",
-      "resolved": "https://registry.npmjs.org/karma-mocha-clean-reporter/-/karma-mocha-clean-reporter-0.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/karma-mocha-clean-reporter/-/karma-mocha-clean-reporter-0.0.1.tgz",
+      "integrity": "sha1-6G961LxefGLX8uJC3ydRzPk/Rvo="
     },
     "karma-phantomjs-launcher": {
       "version": "1.0.4",
-      "from": "karma-phantomjs-launcher@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/karma-phantomjs-launcher/-/karma-phantomjs-launcher-1.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/karma-phantomjs-launcher/-/karma-phantomjs-launcher-1.0.4.tgz",
+      "integrity": "sha1-0jyjSAG9qYY60xjju0vUBisTrNI="
     },
     "karma-sinon-chai": {
       "version": "1.3.1",
-      "from": "karma-sinon-chai@1.3.1",
       "resolved": "https://registry.npmjs.org/karma-sinon-chai/-/karma-sinon-chai-1.3.1.tgz",
+      "integrity": "sha1-RjNBlJTZ4thIeH3XYFMDGFn1t/U=",
       "dependencies": {
         "lolex": {
           "version": "1.6.0",
-          "from": "lolex@>=1.6.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz"
+          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
+          "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
         }
       }
     },
     "karma-webpack": {
       "version": "2.0.3",
-      "from": "karma-webpack@>=2.0.1 <2.1.0",
       "resolved": "https://registry.npmjs.org/karma-webpack/-/karma-webpack-2.0.3.tgz",
+      "integrity": "sha1-Oc6/XKJYATmyf5rmm3iBa5yC+uY=",
       "dependencies": {
         "async": {
           "version": "0.9.2",
-          "from": "async@>=0.9.0 <0.10.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz",
+          "integrity": "sha1-rqdNXmHB+JlhO/ZL2mbUx48v0X0="
         },
         "lodash": {
           "version": "3.10.1",
-          "from": "lodash@>=3.8.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
+          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
         },
         "source-map": {
           "version": "0.1.43",
-          "from": "source-map@>=0.1.41 <0.2.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz",
+          "integrity": "sha1-wkvBRspRfBRx9drL4lcbK3+eM0Y="
         }
       }
     },
     "kew": {
       "version": "0.7.0",
-      "from": "kew@>=0.7.0 <0.8.0",
-      "resolved": "https://registry.npmjs.org/kew/-/kew-0.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/kew/-/kew-0.7.0.tgz",
+      "integrity": "sha1-edk9LTM2PW/dKXCzNdkUGtWR15s="
     },
     "kind-of": {
       "version": "3.2.2",
-      "from": "kind-of@>=3.0.2 <4.0.0",
-      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+      "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
     },
     "klaw": {
       "version": "1.3.1",
-      "from": "klaw@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/klaw/-/klaw-1.3.1.tgz"
+      "resolved": "https://registry.npmjs.org/klaw/-/klaw-1.3.1.tgz",
+      "integrity": "sha1-QIhDO0azsbolnXh4XY6W9zugJDk="
     },
     "latest-version": {
       "version": "2.0.0",
-      "from": "latest-version@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-2.0.0.tgz",
+      "integrity": "sha1-VvjWE5YghHuAF/jx9NeOIRMkFos="
     },
     "lazy-cache": {
       "version": "1.0.4",
-      "from": "lazy-cache@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-1.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-1.0.4.tgz",
+      "integrity": "sha1-odePw6UEdMuAhF07O24dpJpEbo4="
     },
     "lazy-req": {
       "version": "1.1.0",
-      "from": "lazy-req@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/lazy-req/-/lazy-req-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/lazy-req/-/lazy-req-1.1.0.tgz",
+      "integrity": "sha1-va6+rTD42CQDnODOFJ1Nqge6H6w="
     },
     "lazystream": {
       "version": "1.0.0",
-      "from": "lazystream@>=1.0.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/lazystream/-/lazystream-1.0.0.tgz",
+      "integrity": "sha1-9plf4PggOS9hOWvolGJAe7dxaOQ=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "lcid": {
       "version": "1.0.0",
-      "from": "lcid@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/lcid/-/lcid-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/lcid/-/lcid-1.0.0.tgz",
+      "integrity": "sha1-MIrMr6C8SDo4Z7S28rlQYlHRuDU="
     },
     "levn": {
       "version": "0.3.0",
-      "from": "levn@>=0.3.0 <0.4.0",
-      "resolved": "https://registry.npmjs.org/levn/-/levn-0.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/levn/-/levn-0.3.0.tgz",
+      "integrity": "sha1-OwmSTt+fCDwEkP3UwLxEIeBHZO4="
     },
     "liftoff": {
       "version": "2.3.0",
-      "from": "liftoff@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/liftoff/-/liftoff-2.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/liftoff/-/liftoff-2.3.0.tgz",
+      "integrity": "sha1-qY8v9nGD2Lp8+soQVIvX/wVQs4U="
     },
     "livereload-js": {
       "version": "2.2.2",
-      "from": "livereload-js@>=2.2.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/livereload-js/-/livereload-js-2.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/livereload-js/-/livereload-js-2.2.2.tgz",
+      "integrity": "sha1-bIclfmSKtHW8JOoldFftzB+NC8I="
     },
     "load-json-file": {
       "version": "1.1.0",
-      "from": "load-json-file@>=1.1.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
+      "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
       "dependencies": {
         "strip-bom": {
           "version": "2.0.0",
-          "from": "strip-bom@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
         }
       }
     },
     "load-themed-styles": {
       "version": "1.2.0",
-      "from": "load-themed-styles@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/load-themed-styles/-/load-themed-styles-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/load-themed-styles/-/load-themed-styles-1.2.0.tgz",
+      "integrity": "sha1-R6uq2LC7kxBtXX8Bq4DcIL85IDw="
     },
     "load-themed-styles-loader": {
       "version": "0.0.3",
-      "from": "load-themed-styles-loader@>=0.0.3 <0.0.4",
-      "resolved": "https://registry.npmjs.org/load-themed-styles-loader/-/load-themed-styles-loader-0.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/load-themed-styles-loader/-/load-themed-styles-loader-0.0.3.tgz",
+      "integrity": "sha1-zmFd1QkLzjvCYcnYE6tHmHdHya8="
     },
     "loader-runner": {
       "version": "2.3.0",
-      "from": "loader-runner@>=2.3.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/loader-runner/-/loader-runner-2.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/loader-runner/-/loader-runner-2.3.0.tgz",
+      "integrity": "sha1-9IKuqC1UPgeSFwDVpG7yb9rGuKI="
     },
     "loader-utils": {
       "version": "0.2.17",
-      "from": "loader-utils@>=0.0.0 <1.0.0",
-      "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz"
+      "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz",
+      "integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g="
     },
     "lodash": {
       "version": "4.15.0",
-      "from": "lodash@>=4.15.0 <4.16.0",
-      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.15.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.15.0.tgz",
+      "integrity": "sha1-MWI5HY8BQKoiz49rPDTWt/Y9Oqk="
     },
     "lodash._arraycopy": {
       "version": "3.0.0",
-      "from": "lodash._arraycopy@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._arraycopy/-/lodash._arraycopy-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._arraycopy/-/lodash._arraycopy-3.0.0.tgz",
+      "integrity": "sha1-due3wfH7klRzdIeKVi7Qaj5Q9uE="
     },
     "lodash._arrayeach": {
       "version": "3.0.0",
-      "from": "lodash._arrayeach@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._arrayeach/-/lodash._arrayeach-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._arrayeach/-/lodash._arrayeach-3.0.0.tgz",
+      "integrity": "sha1-urFWsqkNPxu9XGU0AzSeXlkz754="
     },
     "lodash._baseassign": {
       "version": "3.2.0",
-      "from": "lodash._baseassign@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._baseassign/-/lodash._baseassign-3.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._baseassign/-/lodash._baseassign-3.2.0.tgz",
+      "integrity": "sha1-jDigmVAPIVrQnlnxci/QxSv+Ck4="
     },
     "lodash._baseclone": {
       "version": "4.5.7",
-      "from": "lodash._baseclone@>=4.5.0 <4.6.0",
-      "resolved": "https://registry.npmjs.org/lodash._baseclone/-/lodash._baseclone-4.5.7.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._baseclone/-/lodash._baseclone-4.5.7.tgz",
+      "integrity": "sha1-zkKt4IOE711i+nfDD2GkbmhvhDQ="
     },
     "lodash._basecopy": {
       "version": "3.0.1",
-      "from": "lodash._basecopy@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz",
+      "integrity": "sha1-jaDmqHbPNEwK2KVIghEd08XHyjY="
     },
     "lodash._basecreate": {
       "version": "3.0.3",
-      "from": "lodash._basecreate@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._basecreate/-/lodash._basecreate-3.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._basecreate/-/lodash._basecreate-3.0.3.tgz",
+      "integrity": "sha1-G8ZhYU2qf8MRt9A78WgGoCE8+CE="
     },
     "lodash._basefor": {
       "version": "3.0.3",
-      "from": "lodash._basefor@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._basefor/-/lodash._basefor-3.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._basefor/-/lodash._basefor-3.0.3.tgz",
+      "integrity": "sha1-dVC06SGO8J+tJDQ7YSAhx5tMIMI="
     },
     "lodash._basetostring": {
       "version": "3.0.1",
-      "from": "lodash._basetostring@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._basetostring/-/lodash._basetostring-3.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._basetostring/-/lodash._basetostring-3.0.1.tgz",
+      "integrity": "sha1-0YYdh3+CSlL2aYMtyvPuFVZqB9U="
     },
     "lodash._basevalues": {
       "version": "3.0.0",
-      "from": "lodash._basevalues@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._basevalues/-/lodash._basevalues-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._basevalues/-/lodash._basevalues-3.0.0.tgz",
+      "integrity": "sha1-W3dXYoAr3j0yl1A+JjAIIP32Ybc="
     },
     "lodash._bindcallback": {
       "version": "3.0.1",
-      "from": "lodash._bindcallback@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._bindcallback/-/lodash._bindcallback-3.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._bindcallback/-/lodash._bindcallback-3.0.1.tgz",
+      "integrity": "sha1-5THCdkTPi1epnhftlbNcdIeJOS4="
     },
     "lodash._createcompounder": {
       "version": "3.0.0",
-      "from": "lodash._createcompounder@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._createcompounder/-/lodash._createcompounder-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._createcompounder/-/lodash._createcompounder-3.0.0.tgz",
+      "integrity": "sha1-XdLLVTctbnDg4jkvsjBNZjEJEHU="
     },
     "lodash._escapehtmlchar": {
       "version": "2.4.1",
-      "from": "lodash._escapehtmlchar@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash._escapehtmlchar/-/lodash._escapehtmlchar-2.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._escapehtmlchar/-/lodash._escapehtmlchar-2.4.1.tgz",
+      "integrity": "sha1-32fDu2t+jh6DGrSL+geVuSr+iZ0="
     },
     "lodash._escapestringchar": {
       "version": "2.4.1",
-      "from": "lodash._escapestringchar@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash._escapestringchar/-/lodash._escapestringchar-2.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._escapestringchar/-/lodash._escapestringchar-2.4.1.tgz",
+      "integrity": "sha1-7P4iYYoq3lC/7qQ5N+Ud9m8O23I="
     },
     "lodash._getnative": {
       "version": "3.9.1",
-      "from": "lodash._getnative@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._getnative/-/lodash._getnative-3.9.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._getnative/-/lodash._getnative-3.9.1.tgz",
+      "integrity": "sha1-VwvH3t5G1hzc3mh9ZdPuy6o6r/U="
     },
     "lodash._htmlescapes": {
       "version": "2.4.1",
-      "from": "lodash._htmlescapes@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash._htmlescapes/-/lodash._htmlescapes-2.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._htmlescapes/-/lodash._htmlescapes-2.4.1.tgz",
+      "integrity": "sha1-MtFL8IRLbeb4tioFG09nwii2JMs="
     },
     "lodash._isiterateecall": {
       "version": "3.0.9",
-      "from": "lodash._isiterateecall@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._isiterateecall/-/lodash._isiterateecall-3.0.9.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._isiterateecall/-/lodash._isiterateecall-3.0.9.tgz",
+      "integrity": "sha1-UgOte6Ql+uhCRg5pbbnPPmqsBXw="
     },
     "lodash._isnative": {
       "version": "2.4.1",
-      "from": "lodash._isnative@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash._isnative/-/lodash._isnative-2.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._isnative/-/lodash._isnative-2.4.1.tgz",
+      "integrity": "sha1-PqZAS3hKe+g2x7V1gOHN95sUgyw="
     },
     "lodash._objecttypes": {
       "version": "2.4.1",
-      "from": "lodash._objecttypes@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash._objecttypes/-/lodash._objecttypes-2.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._objecttypes/-/lodash._objecttypes-2.4.1.tgz",
+      "integrity": "sha1-fAt/admKH3ZSn4kLDNsbTf7BHBE="
     },
     "lodash._reescape": {
       "version": "3.0.0",
-      "from": "lodash._reescape@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reescape/-/lodash._reescape-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._reescape/-/lodash._reescape-3.0.0.tgz",
+      "integrity": "sha1-Kx1vXf4HyKNVdT5fJ/rH8c3hYWo="
     },
     "lodash._reevaluate": {
       "version": "3.0.0",
-      "from": "lodash._reevaluate@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reevaluate/-/lodash._reevaluate-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._reevaluate/-/lodash._reevaluate-3.0.0.tgz",
+      "integrity": "sha1-WLx0xAZklTrgsSTYBpltrKQx4u0="
     },
     "lodash._reinterpolate": {
       "version": "3.0.0",
-      "from": "lodash._reinterpolate@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz",
+      "integrity": "sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0="
     },
     "lodash._reunescapedhtml": {
       "version": "2.4.1",
-      "from": "lodash._reunescapedhtml@>=2.4.1 <2.5.0",
       "resolved": "https://registry.npmjs.org/lodash._reunescapedhtml/-/lodash._reunescapedhtml-2.4.1.tgz",
+      "integrity": "sha1-dHxPxAED6zu4oJduVx96JlnpO6c=",
       "dependencies": {
         "lodash.keys": {
           "version": "2.4.1",
-          "from": "lodash.keys@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz",
+          "integrity": "sha1-SN6kbfj/djKxDXBrissmWR4rNyc="
         }
       }
     },
     "lodash._root": {
       "version": "3.0.1",
-      "from": "lodash._root@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._root/-/lodash._root-3.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._root/-/lodash._root-3.0.1.tgz",
+      "integrity": "sha1-+6HEUkwZ7ppfgTa0YJ8BfPTe1pI="
     },
     "lodash._shimkeys": {
       "version": "2.4.1",
-      "from": "lodash._shimkeys@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash._shimkeys/-/lodash._shimkeys-2.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._shimkeys/-/lodash._shimkeys-2.4.1.tgz",
+      "integrity": "sha1-bpzJZm/wgfC1psl4uD4kLmlJ0gM="
     },
     "lodash._stack": {
       "version": "4.1.3",
-      "from": "lodash._stack@>=4.1.0 <4.2.0",
-      "resolved": "https://registry.npmjs.org/lodash._stack/-/lodash._stack-4.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._stack/-/lodash._stack-4.1.3.tgz",
+      "integrity": "sha1-dRqnbBuWSwR+dtFPxyoJP8teLdA="
     },
     "lodash.assign": {
       "version": "4.2.0",
-      "from": "lodash.assign@>=4.0.3 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.assign/-/lodash.assign-4.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.assign/-/lodash.assign-4.2.0.tgz",
+      "integrity": "sha1-DZnzzNem0mHRm9rrkkUAXShYCOc="
     },
     "lodash.assignin": {
       "version": "4.2.0",
-      "from": "lodash.assignin@>=4.0.9 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.assignin/-/lodash.assignin-4.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.assignin/-/lodash.assignin-4.2.0.tgz",
+      "integrity": "sha1-uo31+4QesKPoBEIysOJjqNxqKKI="
     },
     "lodash.assignwith": {
       "version": "4.2.0",
-      "from": "lodash.assignwith@>=4.0.7 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.assignwith/-/lodash.assignwith-4.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.assignwith/-/lodash.assignwith-4.2.0.tgz",
+      "integrity": "sha1-EnqX8CrcQXUalU0ksN4X4QDgOOs="
     },
     "lodash.bind": {
       "version": "4.2.1",
-      "from": "lodash.bind@>=4.1.4 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.bind/-/lodash.bind-4.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.bind/-/lodash.bind-4.2.1.tgz",
+      "integrity": "sha1-euMBfpOWIqwxt9fX3LGzTbFpDTU="
     },
     "lodash.camelcase": {
       "version": "3.0.1",
-      "from": "lodash.camelcase@>=3.0.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-3.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-3.0.1.tgz",
+      "integrity": "sha1-kyyLh/ikN3iXxnGXUzKC+Xrqwpg="
     },
     "lodash.clone": {
       "version": "4.5.0",
-      "from": "lodash.clone@>=4.3.2 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.clone/-/lodash.clone-4.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.clone/-/lodash.clone-4.5.0.tgz",
+      "integrity": "sha1-GVhwRQ9aExkkeN9Lw9I9LeoZB7Y="
     },
     "lodash.clonedeep": {
       "version": "4.5.0",
-      "from": "lodash.clonedeep@>=4.3.2 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz",
+      "integrity": "sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8="
     },
     "lodash.create": {
       "version": "3.1.1",
-      "from": "lodash.create@3.1.1",
-      "resolved": "https://registry.npmjs.org/lodash.create/-/lodash.create-3.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.create/-/lodash.create-3.1.1.tgz",
+      "integrity": "sha1-1/KEnw29p+BGgruM1yqwIkYd6+c="
     },
     "lodash.deburr": {
       "version": "3.2.0",
-      "from": "lodash.deburr@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.deburr/-/lodash.deburr-3.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.deburr/-/lodash.deburr-3.2.0.tgz",
+      "integrity": "sha1-baj1QzSjZqfPTEx2742Aqhs2XtU="
     },
     "lodash.defaults": {
       "version": "2.4.1",
-      "from": "lodash.defaults@>=2.4.1 <2.5.0",
       "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-2.4.1.tgz",
+      "integrity": "sha1-p+iIXwXmiFEUS24SqPNngCa8TFQ=",
       "dependencies": {
         "lodash.keys": {
           "version": "2.4.1",
-          "from": "lodash.keys@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz",
+          "integrity": "sha1-SN6kbfj/djKxDXBrissmWR4rNyc="
         }
       }
     },
     "lodash.escape": {
       "version": "3.2.0",
-      "from": "lodash.escape@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-3.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-3.2.0.tgz",
+      "integrity": "sha1-mV7g3BjBtIzJLv+ucaEKq1tIdpg="
     },
     "lodash.filter": {
       "version": "4.6.0",
-      "from": "lodash.filter@>=4.4.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.filter/-/lodash.filter-4.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.filter/-/lodash.filter-4.6.0.tgz",
+      "integrity": "sha1-ZosdSYFgOuHMWm+nYBQ+SAtMSs4="
     },
     "lodash.flatten": {
       "version": "4.4.0",
-      "from": "lodash.flatten@>=4.2.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.flatten/-/lodash.flatten-4.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.flatten/-/lodash.flatten-4.4.0.tgz",
+      "integrity": "sha1-8xwiIlqWMtK7+OSt2+8kCqdlph8="
     },
     "lodash.foreach": {
       "version": "4.5.0",
-      "from": "lodash.foreach@>=4.3.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.foreach/-/lodash.foreach-4.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.foreach/-/lodash.foreach-4.5.0.tgz",
+      "integrity": "sha1-Gmo16s5AEoDH8G3d7DUWWrJ+PlM="
     },
     "lodash.get": {
       "version": "4.4.2",
-      "from": "lodash.get@>=4.1.2 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
+      "integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk="
     },
     "lodash.isarguments": {
       "version": "3.1.0",
-      "from": "lodash.isarguments@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz",
+      "integrity": "sha1-L1c9hcaiQon/AGY7SRwdM4/zRYo="
     },
     "lodash.isarray": {
       "version": "3.0.4",
-      "from": "lodash.isarray@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz",
+      "integrity": "sha1-eeTriMNqgSKvhvhEqpvNhRtfu1U="
     },
     "lodash.isempty": {
       "version": "4.4.0",
-      "from": "lodash.isempty@>=4.2.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.isempty/-/lodash.isempty-4.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.isempty/-/lodash.isempty-4.4.0.tgz",
+      "integrity": "sha1-b4bL7di+TsmHvpqvM8loTbGzHn4="
     },
     "lodash.isequal": {
       "version": "4.5.0",
-      "from": "lodash.isequal@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
+      "integrity": "sha1-QVxEePK8wwEgwizhDtMib30+GOA="
     },
     "lodash.isobject": {
       "version": "2.4.1",
-      "from": "lodash.isobject@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash.isobject/-/lodash.isobject-2.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.isobject/-/lodash.isobject-2.4.1.tgz",
+      "integrity": "sha1-Wi5H/mmVPx7mMafrof5k0tBlWPU="
     },
     "lodash.isplainobject": {
       "version": "4.0.6",
-      "from": "lodash.isplainobject@>=4.0.4 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
+      "integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs="
     },
     "lodash.isstring": {
       "version": "4.0.1",
-      "from": "lodash.isstring@>=4.0.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.isstring/-/lodash.isstring-4.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.isstring/-/lodash.isstring-4.0.1.tgz",
+      "integrity": "sha1-1SfftUVuynzJu5XV2ur4i6VKVFE="
     },
     "lodash.keys": {
       "version": "3.1.2",
-      "from": "lodash.keys@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz",
+      "integrity": "sha1-TbwEcrFWvlCgsoaFXRvQsMZWCYo="
     },
     "lodash.keysin": {
       "version": "4.2.0",
-      "from": "lodash.keysin@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.keysin/-/lodash.keysin-4.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.keysin/-/lodash.keysin-4.2.0.tgz",
+      "integrity": "sha1-jMP7NcLZSsxEOhhj4C+kB5nqbyg="
     },
     "lodash.map": {
       "version": "4.6.0",
-      "from": "lodash.map@>=4.4.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.map/-/lodash.map-4.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.map/-/lodash.map-4.6.0.tgz",
+      "integrity": "sha1-dx7Hg540c9nEzeKLGTlMNWL09tM="
     },
     "lodash.mapvalues": {
       "version": "4.6.0",
-      "from": "lodash.mapvalues@>=4.4.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.mapvalues/-/lodash.mapvalues-4.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.mapvalues/-/lodash.mapvalues-4.6.0.tgz",
+      "integrity": "sha1-G6+lAF3p3W9PJmaMMMo3IwzJaJw="
     },
     "lodash.memoize": {
       "version": "4.1.2",
-      "from": "lodash.memoize@>=4.1.2 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz",
+      "integrity": "sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4="
     },
     "lodash.merge": {
       "version": "4.3.5",
-      "from": "lodash.merge@>=4.3.2 <4.4.0",
-      "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.3.5.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.3.5.tgz",
+      "integrity": "sha1-VOWMTyCD2f7MsVeaYPdLCT1yrRc="
     },
     "lodash.mergewith": {
       "version": "4.6.0",
-      "from": "lodash.mergewith@>=4.6.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.mergewith/-/lodash.mergewith-4.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.mergewith/-/lodash.mergewith-4.6.0.tgz",
+      "integrity": "sha1-FQzwoWeR9ZA7iJHqsVRgknS96lU="
     },
     "lodash.pick": {
       "version": "4.4.0",
-      "from": "lodash.pick@>=4.2.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz",
+      "integrity": "sha1-UvBWEP/53tQiYRRB7R/BI6AwAbM="
     },
     "lodash.reduce": {
       "version": "4.6.0",
-      "from": "lodash.reduce@>=4.4.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.reduce/-/lodash.reduce-4.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.reduce/-/lodash.reduce-4.6.0.tgz",
+      "integrity": "sha1-8atrg5KZrUj3hKu/R2WW8DuRTTs="
     },
     "lodash.reject": {
       "version": "4.6.0",
-      "from": "lodash.reject@>=4.4.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.reject/-/lodash.reject-4.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.reject/-/lodash.reject-4.6.0.tgz",
+      "integrity": "sha1-gNZJLcFHCGS79YNTO2UfQqn1JBU="
     },
     "lodash.rest": {
       "version": "4.0.5",
-      "from": "lodash.rest@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.rest/-/lodash.rest-4.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.rest/-/lodash.rest-4.0.5.tgz",
+      "integrity": "sha1-lU73UEkmIDjJbR/Jiyj9r58Hcqo="
     },
     "lodash.restparam": {
       "version": "3.6.1",
-      "from": "lodash.restparam@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.restparam/-/lodash.restparam-3.6.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.restparam/-/lodash.restparam-3.6.1.tgz",
+      "integrity": "sha1-k2pOMJ7zMKdkXtQUWYbIWuWyCAU="
     },
     "lodash.some": {
       "version": "4.6.0",
-      "from": "lodash.some@>=4.2.2 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.some/-/lodash.some-4.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.some/-/lodash.some-4.6.0.tgz",
+      "integrity": "sha1-G7nzFO9ri63tE7VJFpsqlF62jk0="
     },
     "lodash.tail": {
       "version": "4.1.1",
-      "from": "lodash.tail@>=4.1.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.tail/-/lodash.tail-4.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.tail/-/lodash.tail-4.1.1.tgz",
+      "integrity": "sha1-0jM6NtnncXyK0vfKyv7HwytERmQ="
     },
     "lodash.template": {
       "version": "3.6.2",
-      "from": "lodash.template@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-3.6.2.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-3.6.2.tgz",
+      "integrity": "sha1-+M3sxhaaJVvpCYrosMU9N4kx0U8="
     },
     "lodash.templatesettings": {
       "version": "3.1.1",
-      "from": "lodash.templatesettings@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-3.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-3.1.1.tgz",
+      "integrity": "sha1-+zB4RHU7Zrnxr6VOJix0UwfbqOU="
     },
     "lodash.uniq": {
       "version": "4.5.0",
-      "from": "lodash.uniq@>=4.5.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz",
+      "integrity": "sha1-0CJTc662Uq3BvILklFM5qEJ1R3M="
     },
     "lodash.values": {
       "version": "2.4.1",
-      "from": "lodash.values@>=2.4.1 <2.5.0",
       "resolved": "https://registry.npmjs.org/lodash.values/-/lodash.values-2.4.1.tgz",
+      "integrity": "sha1-q/UUQ2s8twUAFieXjLzzCxKA7qQ=",
       "dependencies": {
         "lodash.keys": {
           "version": "2.4.1",
-          "from": "lodash.keys@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz",
+          "integrity": "sha1-SN6kbfj/djKxDXBrissmWR4rNyc="
         }
       }
     },
     "lodash.words": {
       "version": "3.2.0",
-      "from": "lodash.words@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.words/-/lodash.words-3.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.words/-/lodash.words-3.2.0.tgz",
+      "integrity": "sha1-TiqGSbwIdFsXxpWxo86P7llmI7M="
     },
     "log-symbols": {
       "version": "1.0.2",
-      "from": "log-symbols@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-1.0.2.tgz",
+      "integrity": "sha1-N2/3tY6jCGoPCfrMdGF+ylAeGhg="
     },
     "log4js": {
       "version": "0.6.38",
-      "from": "log4js@>=0.6.31 <0.7.0",
       "resolved": "https://registry.npmjs.org/log4js/-/log4js-0.6.38.tgz",
+      "integrity": "sha1-LElBFmldb7JUgJQ9P8hy5mKlIv0=",
       "dependencies": {
         "readable-stream": {
           "version": "1.0.34",
-          "from": "readable-stream@>=1.0.2 <1.1.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
         },
         "semver": {
           "version": "4.3.6",
-          "from": "semver@>=4.3.3 <4.4.0",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz"
+          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz",
+          "integrity": "sha1-MAvG4OhjdPe6YQaLWx7NV/xlMto="
         }
       }
     },
     "lolex": {
       "version": "1.4.0",
-      "from": "lolex@>=1.4.0 <1.5.0",
-      "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.4.0.tgz",
+      "integrity": "sha1-LycSsbwYDendzF06epbvPAuxYq0="
     },
     "longest": {
       "version": "1.0.1",
-      "from": "longest@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/longest/-/longest-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/longest/-/longest-1.0.1.tgz",
+      "integrity": "sha1-MKCy2jj3N3DoKUoNIuZiXtd9AJc="
     },
     "loose-envify": {
       "version": "1.3.1",
-      "from": "loose-envify@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.3.1.tgz"
+      "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.3.1.tgz",
+      "integrity": "sha1-0aitM/qc4OcT1l/dCsi3SNR4yEg="
     },
     "loud-rejection": {
       "version": "1.6.0",
-      "from": "loud-rejection@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/loud-rejection/-/loud-rejection-1.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/loud-rejection/-/loud-rejection-1.6.0.tgz",
+      "integrity": "sha1-W0b4AUft7leIcPCG0Eghz5mOVR8="
     },
     "lower-case": {
       "version": "1.1.4",
-      "from": "lower-case@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-1.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-1.1.4.tgz",
+      "integrity": "sha1-miyr0bno4K6ZOkv31YdcOcQujqw="
     },
     "lowercase-keys": {
       "version": "1.0.0",
-      "from": "lowercase-keys@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.0.tgz",
+      "integrity": "sha1-TjNms55/VFfjXxMkvfb4jQv8cwY="
     },
     "lru-cache": {
       "version": "2.7.3",
-      "from": "lru-cache@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.7.3.tgz"
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.7.3.tgz",
+      "integrity": "sha1-bUUk6LlV+V1PW1iFHOId1y+06VI="
     },
     "macaddress": {
       "version": "0.2.8",
-      "from": "macaddress@>=0.2.8 <0.3.0",
-      "resolved": "https://registry.npmjs.org/macaddress/-/macaddress-0.2.8.tgz"
+      "resolved": "https://registry.npmjs.org/macaddress/-/macaddress-0.2.8.tgz",
+      "integrity": "sha1-WQTcU3w57G2+/q6QIycTX6hRHxI="
     },
     "make-dir": {
       "version": "1.0.0",
-      "from": "make-dir@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-1.0.0.tgz",
+      "integrity": "sha1-l6ARdR6R3YfPre9Ygy67BJNt6Xg="
     },
     "map-cache": {
       "version": "0.2.2",
-      "from": "map-cache@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz",
+      "integrity": "sha1-wyq9C9ZSXZsFFkW7TyasXcmKDb8="
     },
     "map-obj": {
       "version": "1.0.1",
-      "from": "map-obj@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/map-obj/-/map-obj-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/map-obj/-/map-obj-1.0.1.tgz",
+      "integrity": "sha1-2TPOuSBdgr3PSIb2dCvcK03qFG0="
     },
     "map-stream": {
       "version": "0.0.7",
-      "from": "map-stream@>=0.0.3 <0.1.0",
-      "resolved": "https://registry.npmjs.org/map-stream/-/map-stream-0.0.7.tgz"
+      "resolved": "https://registry.npmjs.org/map-stream/-/map-stream-0.0.7.tgz",
+      "integrity": "sha1-ih8HiW2CsQkmvTdEokIACfiJdKg="
     },
     "marked": {
       "version": "0.3.6",
-      "from": "marked@>=0.3.6 <0.4.0",
-      "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.6.tgz"
+      "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.6.tgz",
+      "integrity": "sha1-ssbGGPzOzk74bE/Gy4p8v1rtqNc="
     },
     "marked-terminal": {
       "version": "1.7.0",
-      "from": "marked-terminal@>=1.6.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/marked-terminal/-/marked-terminal-1.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/marked-terminal/-/marked-terminal-1.7.0.tgz",
+      "integrity": "sha1-yMRgiBx3LHYEtkNnAH7l938SWQQ="
     },
     "math-expression-evaluator": {
       "version": "1.2.17",
-      "from": "math-expression-evaluator@>=1.2.14 <2.0.0",
-      "resolved": "https://registry.npmjs.org/math-expression-evaluator/-/math-expression-evaluator-1.2.17.tgz"
+      "resolved": "https://registry.npmjs.org/math-expression-evaluator/-/math-expression-evaluator-1.2.17.tgz",
+      "integrity": "sha1-3oGf282E3M2PrlnGrreWFbnSZqw="
     },
     "md5": {
       "version": "2.2.1",
-      "from": "md5@>=2.2.1 <2.3.0",
-      "resolved": "https://registry.npmjs.org/md5/-/md5-2.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/md5/-/md5-2.2.1.tgz",
+      "integrity": "sha1-U6s41f48iJG6RlMp6iP6wFQBJvk="
     },
     "media-typer": {
       "version": "0.3.0",
-      "from": "media-typer@0.3.0",
-      "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
+      "integrity": "sha1-hxDXrwqmJvj/+hzgAWhUUmMlV0g="
     },
     "memory-fs": {
       "version": "0.4.1",
-      "from": "memory-fs@>=0.4.1 <0.5.0",
       "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.4.1.tgz",
+      "integrity": "sha1-OpoguEYlI+RHz7x+i7gO1me/xVI=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "meow": {
       "version": "3.7.0",
-      "from": "meow@>=3.3.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/meow/-/meow-3.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/meow/-/meow-3.7.0.tgz",
+      "integrity": "sha1-cstmi0JSKCkKu/qFaJJYcwioAfs="
     },
     "merge-descriptors": {
       "version": "1.0.1",
-      "from": "merge-descriptors@1.0.1",
-      "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.1.tgz",
+      "integrity": "sha1-sAqqVW3YtEVoFQ7J0blT8/kMu2E="
     },
     "merge-stream": {
       "version": "1.0.1",
-      "from": "merge-stream@>=1.0.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-1.0.1.tgz",
+      "integrity": "sha1-QEEgLVCKNCugAXQAjfDCUbjBNeE=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "merge2": {
       "version": "1.0.3",
-      "from": "merge2@>=1.0.2 <1.1.0",
-      "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.0.3.tgz",
+      "integrity": "sha1-+kT4siYmFaty8ICKQB1HinDjlNs="
     },
     "method-override": {
       "version": "2.3.9",
-      "from": "method-override@>=2.3.5 <2.4.0",
       "resolved": "https://registry.npmjs.org/method-override/-/method-override-2.3.9.tgz",
+      "integrity": "sha1-vRUfLONM8Bp2ykAKuVwBKxAtj3E=",
       "dependencies": {
         "debug": {
           "version": "2.6.8",
-          "from": "debug@2.6.8",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
+          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
         }
       }
     },
     "methods": {
       "version": "1.1.2",
-      "from": "methods@>=1.1.2 <1.2.0",
-      "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz",
+      "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4="
     },
     "micromatch": {
       "version": "2.3.11",
-      "from": "micromatch@>=2.3.7 <3.0.0",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz"
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
+      "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
     },
     "miller-rabin": {
       "version": "4.0.0",
-      "from": "miller-rabin@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/miller-rabin/-/miller-rabin-4.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/miller-rabin/-/miller-rabin-4.0.0.tgz",
+      "integrity": "sha1-SmL7HUKTPAVYOYL0xxb2+55sbT0="
     },
     "mime": {
       "version": "1.3.6",
-      "from": "mime@>=1.3.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.6.tgz"
+      "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.6.tgz",
+      "integrity": "sha1-WR2E02U6awtKO5343lqoEI5y5eA="
     },
     "mime-db": {
       "version": "1.27.0",
-      "from": "mime-db@>=1.27.0 <1.28.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.27.0.tgz"
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.27.0.tgz",
+      "integrity": "sha1-gg9XIpa70g7CXtVeW13oaeVDbrE="
     },
     "mime-types": {
       "version": "2.1.15",
-      "from": "mime-types@>=2.1.7 <2.2.0",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.15.tgz"
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.15.tgz",
+      "integrity": "sha1-pOv1BkCUVpI3uM9wBGd20J/JKu0="
     },
     "minimalistic-assert": {
       "version": "1.0.0",
-      "from": "minimalistic-assert@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.0.tgz",
+      "integrity": "sha1-cCvi3aazf0g2vLP121ZkG2Sh09M="
     },
     "minimalistic-crypto-utils": {
       "version": "1.0.1",
-      "from": "minimalistic-crypto-utils@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/minimalistic-crypto-utils/-/minimalistic-crypto-utils-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/minimalistic-crypto-utils/-/minimalistic-crypto-utils-1.0.1.tgz",
+      "integrity": "sha1-9sAMHAsIIkblxNmd+4x8CDsrWCo="
     },
     "minimatch": {
       "version": "3.0.4",
-      "from": "minimatch@>=3.0.4 <4.0.0",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
+      "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA=="
     },
     "minimist": {
       "version": "1.2.0",
-      "from": "minimist@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
+      "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
     },
     "mixin-object": {
       "version": "2.0.1",
-      "from": "mixin-object@>=2.0.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/mixin-object/-/mixin-object-2.0.1.tgz",
+      "integrity": "sha1-T7lJRB2rGCVA8f4DW6YOGUel5X4=",
       "dependencies": {
         "for-in": {
           "version": "0.1.8",
-          "from": "for-in@>=0.1.3 <0.2.0",
-          "resolved": "https://registry.npmjs.org/for-in/-/for-in-0.1.8.tgz"
+          "resolved": "https://registry.npmjs.org/for-in/-/for-in-0.1.8.tgz",
+          "integrity": "sha1-2Hc5COMSVhCZUrH9ubP6hn0ndeE="
         }
       }
     },
     "mkdirp": {
       "version": "0.5.1",
-      "from": "mkdirp@>=0.5.1 <0.6.0",
       "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
+      "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
       "dependencies": {
         "minimist": {
           "version": "0.0.8",
-          "from": "minimist@0.0.8",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz"
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
+          "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0="
         }
       }
     },
     "mocha": {
       "version": "2.5.3",
-      "from": "mocha@>=2.5.3 <2.6.0",
       "resolved": "https://registry.npmjs.org/mocha/-/mocha-2.5.3.tgz",
+      "integrity": "sha1-FhvlvetJZ3HrmzV0UFC2IrWu/Fg=",
       "dependencies": {
         "commander": {
           "version": "2.3.0",
-          "from": "commander@2.3.0",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-2.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/commander/-/commander-2.3.0.tgz",
+          "integrity": "sha1-/UMOiJgy7DU7ms0d4hfBHLPu+HM="
         },
         "debug": {
           "version": "2.2.0",
-          "from": "debug@2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "diff": {
           "version": "1.4.0",
-          "from": "diff@1.4.0",
-          "resolved": "https://registry.npmjs.org/diff/-/diff-1.4.0.tgz"
+          "resolved": "https://registry.npmjs.org/diff/-/diff-1.4.0.tgz",
+          "integrity": "sha1-fyjS657nsVqX79ic5j3P2qPMur8="
         },
         "escape-string-regexp": {
           "version": "1.0.2",
-          "from": "escape-string-regexp@1.0.2",
-          "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.2.tgz",
+          "integrity": "sha1-Tbwv5nTnGUnK8/smlc5/LcHZqNE="
         },
         "glob": {
           "version": "3.2.11",
-          "from": "glob@3.2.11",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-3.2.11.tgz"
+          "resolved": "https://registry.npmjs.org/glob/-/glob-3.2.11.tgz",
+          "integrity": "sha1-Spc/Y1uRkPcV0QmH1cAP0oFevj0="
         },
         "minimatch": {
           "version": "0.3.0",
-          "from": "minimatch@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.3.0.tgz",
+          "integrity": "sha1-J12O2qxPG7MyZHIInnlJyDlGmd0="
         },
         "ms": {
           "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         },
         "supports-color": {
           "version": "1.2.0",
-          "from": "supports-color@1.2.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-1.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-1.2.0.tgz",
+          "integrity": "sha1-/x7R5hFp0Gs88tWI4YixjYhH4X4="
         }
       }
     },
     "mocha-clean": {
       "version": "0.4.0",
-      "from": "mocha-clean@>=0.4.0 <0.5.0",
-      "resolved": "https://registry.npmjs.org/mocha-clean/-/mocha-clean-0.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/mocha-clean/-/mocha-clean-0.4.0.tgz",
+      "integrity": "sha1-CbaYXDIYFhQDIeED593ktIdgkhw="
     },
     "mocha-loader": {
       "version": "1.1.1",
-      "from": "mocha-loader@>=1.1.1 <2.0.0",
       "resolved": "https://registry.npmjs.org/mocha-loader/-/mocha-loader-1.1.1.tgz",
+      "integrity": "sha1-Ocm3jErWmrxTPtAuLas5gkTKM6s=",
       "dependencies": {
         "css-loader": {
           "version": "0.23.1",
-          "from": "css-loader@>=0.23.1 <0.24.0",
           "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.23.1.tgz",
+          "integrity": "sha1-n6I/K1wJZSNZEK1ezvO4o2OQ/lA=",
           "dependencies": {
             "loader-utils": {
               "version": "0.2.17",
-              "from": "loader-utils@~0.2.2",
-              "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz"
+              "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz",
+              "integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g="
             }
           }
         },
         "css-selector-tokenizer": {
           "version": "0.5.4",
-          "from": "css-selector-tokenizer@>=0.5.1 <0.6.0",
-          "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.5.4.tgz"
+          "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.5.4.tgz",
+          "integrity": "sha1-E5uv00o1/QwUKEhwSeBpnm9qLCE="
         },
         "loader-utils": {
           "version": "1.1.0",
-          "from": "loader-utils@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
+          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
         },
         "style-loader": {
           "version": "0.13.2",
-          "from": "style-loader@>=0.13.1 <0.14.0",
-          "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.13.2.tgz"
+          "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.13.2.tgz",
+          "integrity": "sha1-dFMzhM9pjHEEx5URULSXF63C87s="
         }
       }
     },
     "morgan": {
       "version": "1.6.1",
-      "from": "morgan@>=1.6.1 <1.7.0",
       "resolved": "https://registry.npmjs.org/morgan/-/morgan-1.6.1.tgz",
+      "integrity": "sha1-X9gYOYxoGcuiinzWZk8pL+HAu/I=",
       "dependencies": {
         "debug": {
           "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "depd": {
           "version": "1.0.1",
-          "from": "depd@>=1.0.1 <1.1.0",
-          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz",
+          "integrity": "sha1-gK7GTJ1tl+ZcwqnKqTwKpqv3Oqo="
         },
         "ms": {
           "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         }
       }
     },
     "ms": {
       "version": "2.0.0",
-      "from": "ms@2.0.0",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+      "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
     },
     "multiparty": {
       "version": "3.3.2",
-      "from": "multiparty@3.3.2",
-      "resolved": "https://registry.npmjs.org/multiparty/-/multiparty-3.3.2.tgz"
+      "resolved": "https://registry.npmjs.org/multiparty/-/multiparty-3.3.2.tgz",
+      "integrity": "sha1-Nd5oBNwZZD5SSfPT473GyM4wHT8="
     },
     "multipipe": {
       "version": "0.1.2",
-      "from": "multipipe@>=0.1.2 <0.2.0",
-      "resolved": "https://registry.npmjs.org/multipipe/-/multipipe-0.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/multipipe/-/multipipe-0.1.2.tgz",
+      "integrity": "sha1-Ko8t33Du1WTf8tV/HhoTfZ8FB4s="
     },
     "mute-stream": {
       "version": "0.0.7",
-      "from": "mute-stream@>=0.0.4 <0.1.0",
-      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.7.tgz"
+      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.7.tgz",
+      "integrity": "sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s="
     },
     "nan": {
       "version": "2.6.2",
-      "from": "nan@>=2.3.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/nan/-/nan-2.6.2.tgz"
+      "resolved": "https://registry.npmjs.org/nan/-/nan-2.6.2.tgz",
+      "integrity": "sha1-5P805slf37WuzAjeZZb0NgWn20U="
     },
     "native-promise-only": {
       "version": "0.8.1",
-      "from": "native-promise-only@>=0.8.1 <0.9.0",
-      "resolved": "https://registry.npmjs.org/native-promise-only/-/native-promise-only-0.8.1.tgz"
+      "resolved": "https://registry.npmjs.org/native-promise-only/-/native-promise-only-0.8.1.tgz",
+      "integrity": "sha1-IKMYwwy0X3H+et+/eyHJnBRy7xE="
     },
     "natives": {
       "version": "1.1.0",
-      "from": "natives@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/natives/-/natives-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/natives/-/natives-1.1.0.tgz",
+      "integrity": "sha1-6f+EFBimsux6SV6TmYT3jxY+bjE="
     },
     "ncname": {
       "version": "1.0.0",
-      "from": "ncname@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/ncname/-/ncname-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/ncname/-/ncname-1.0.0.tgz",
+      "integrity": "sha1-W1etGLHKCShk72Kwse2BlPODtxw="
     },
     "negotiator": {
       "version": "0.6.1",
-      "from": "negotiator@0.6.1",
-      "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.1.tgz"
+      "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.1.tgz",
+      "integrity": "sha1-KzJxhOiZIQEXeyhWP7XnECrNDKk="
     },
     "no-case": {
       "version": "2.3.1",
-      "from": "no-case@>=2.2.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/no-case/-/no-case-2.3.1.tgz"
+      "resolved": "https://registry.npmjs.org/no-case/-/no-case-2.3.1.tgz",
+      "integrity": "sha1-euuhxzpSGEJlVUt9wDuvcg34AIE="
     },
     "node-emoji": {
       "version": "1.5.1",
-      "from": "node-emoji@>=1.4.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/node-emoji/-/node-emoji-1.5.1.tgz"
+      "resolved": "https://registry.npmjs.org/node-emoji/-/node-emoji-1.5.1.tgz",
+      "integrity": "sha1-/ZGOQSdpv4xEgFEjgjOECyr/FqE="
     },
     "node-fetch": {
       "version": "1.7.0",
-      "from": "node-fetch@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.0.tgz",
+      "integrity": "sha1-P/bFZUT5t/sAaCM4u1Xub1SooO8="
     },
     "node-forge": {
       "version": "0.7.1",
-      "from": "node-forge@>=0.7.1 <0.8.0",
-      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.7.1.tgz"
+      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.7.1.tgz",
+      "integrity": "sha1-naYR6giYL0uUIGs760zJZl8gwwA="
     },
     "node-gyp": {
       "version": "3.6.1",
-      "from": "node-gyp@>=3.3.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-3.6.1.tgz"
+      "resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-3.6.1.tgz",
+      "integrity": "sha1-GVYQZ/8YVGSt7UeCEmgfR/1XjLw="
     },
     "node-libs-browser": {
       "version": "0.6.0",
-      "from": "node-libs-browser@>=0.6.0 <0.7.0",
-      "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-0.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-0.6.0.tgz",
+      "integrity": "sha1-JEgG1E0xngSLyGB7XMTq+aKdLjw="
     },
     "node-notifier": {
       "version": "5.0.2",
-      "from": "node-notifier@>=5.0.2 <5.1.0",
-      "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-5.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-5.0.2.tgz",
+      "integrity": "sha1-RDhEn+aeMh+UHO+UOYaweXAycBs="
     },
     "node-sass": {
       "version": "4.5.3",
-      "from": "node-sass@>=4.5.0 <5.0.0",
       "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.5.3.tgz",
+      "integrity": "sha1-0JydEXlkEjnRuX/8YjH9zsU+FWg=",
       "dependencies": {
         "gaze": {
           "version": "1.1.2",
-          "from": "gaze@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz"
+          "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz",
+          "integrity": "sha1-hHIkZ3rbiHDWeSV+0ziP22HkAQU="
         },
         "globule": {
           "version": "1.1.0",
-          "from": "globule@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/globule/-/globule-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/globule/-/globule-1.1.0.tgz",
+          "integrity": "sha1-xJNS5NwYPYWJPuglOF65lLtt9F8="
         },
         "lodash": {
           "version": "4.16.6",
-          "from": "lodash@>=4.16.4 <4.17.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.16.6.tgz"
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.16.6.tgz",
+          "integrity": "sha1-0iyaxmAojzhD4Wun0rXQbMon13c="
         }
       }
     },
     "node-status-codes": {
       "version": "1.0.0",
-      "from": "node-status-codes@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/node-status-codes/-/node-status-codes-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/node-status-codes/-/node-status-codes-1.0.0.tgz",
+      "integrity": "sha1-WuVUHQJGRdMqWPzdyc7s6nrjrC8="
     },
     "node-zip": {
       "version": "1.1.1",
-      "from": "node-zip@>=1.1.1 <1.2.0",
-      "resolved": "https://registry.npmjs.org/node-zip/-/node-zip-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/node-zip/-/node-zip-1.1.1.tgz",
+      "integrity": "sha1-lNGtZ0o81GoViN1zb0qaeMdX62I="
     },
     "node.extend": {
       "version": "1.1.6",
-      "from": "node.extend@>=1.0.10 <2.0.0",
-      "resolved": "https://registry.npmjs.org/node.extend/-/node.extend-1.1.6.tgz"
+      "resolved": "https://registry.npmjs.org/node.extend/-/node.extend-1.1.6.tgz",
+      "integrity": "sha1-p7iCyC1sk6SGOlUEvV3o7IYli5Y="
     },
     "nopt": {
       "version": "3.0.6",
-      "from": "nopt@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/nopt/-/nopt-3.0.6.tgz"
+      "resolved": "https://registry.npmjs.org/nopt/-/nopt-3.0.6.tgz",
+      "integrity": "sha1-xkZdvwirzU2zWTF/eaxopkayj/k="
     },
     "normalize-package-data": {
       "version": "2.3.8",
-      "from": "normalize-package-data@>=2.3.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.3.8.tgz"
+      "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.3.8.tgz",
+      "integrity": "sha1-2Bntoqne29H/pWPqQHHZNngilbs="
     },
     "normalize-path": {
       "version": "2.1.1",
-      "from": "normalize-path@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-2.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-2.1.1.tgz",
+      "integrity": "sha1-GrKLVW4Zg2Oowab35vogE3/mrtk="
     },
     "normalize-range": {
       "version": "0.1.2",
-      "from": "normalize-range@>=0.1.2 <0.2.0",
-      "resolved": "https://registry.npmjs.org/normalize-range/-/normalize-range-0.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/normalize-range/-/normalize-range-0.1.2.tgz",
+      "integrity": "sha1-LRDAa9/TEuqXd2laTShDlFa3WUI="
     },
     "normalize-url": {
       "version": "1.9.1",
-      "from": "normalize-url@>=1.4.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/normalize-url/-/normalize-url-1.9.1.tgz"
+      "resolved": "https://registry.npmjs.org/normalize-url/-/normalize-url-1.9.1.tgz",
+      "integrity": "sha1-LMDWazHqIwNkWENuNiDYWVTGbDw="
     },
     "npm-run-path": {
       "version": "1.0.0",
-      "from": "npm-run-path@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-1.0.0.tgz",
+      "integrity": "sha1-9cMr9ZX+ga6Sfa7FLoL4sACsPI8="
     },
     "npmlog": {
       "version": "4.1.0",
-      "from": "npmlog@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.0.tgz",
+      "integrity": "sha512-ocolIkZYZt8UveuiDS0yAkkIjid1o7lPG8cYm05yNYzBn8ykQtaiPMEGp8fY9tKdDgm8okpdKzkvu1y9hUYugA=="
     },
     "nth-check": {
       "version": "1.0.1",
-      "from": "nth-check@>=1.0.1 <1.1.0",
-      "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-1.0.1.tgz",
+      "integrity": "sha1-mSms32KPwsQQmN6rgqxYDPFJquQ="
     },
     "num2fraction": {
       "version": "1.2.2",
-      "from": "num2fraction@>=1.2.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/num2fraction/-/num2fraction-1.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/num2fraction/-/num2fraction-1.2.2.tgz",
+      "integrity": "sha1-b2gragJ6Tp3fpFZM0lidHU5mnt4="
     },
     "number-is-nan": {
       "version": "1.0.1",
-      "from": "number-is-nan@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz",
+      "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0="
     },
     "oauth-sign": {
       "version": "0.8.2",
-      "from": "oauth-sign@>=0.8.1 <0.9.0",
-      "resolved": "https://registry.npmjs.org/oauth-sign/-/oauth-sign-0.8.2.tgz"
+      "resolved": "https://registry.npmjs.org/oauth-sign/-/oauth-sign-0.8.2.tgz",
+      "integrity": "sha1-Rqarfwrq2N6unsBWV4C31O/rnUM="
     },
     "object-assign": {
       "version": "4.1.1",
-      "from": "object-assign@>=4.1.0 <4.2.0",
-      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
+      "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM="
     },
     "object-component": {
       "version": "0.0.3",
-      "from": "object-component@0.0.3",
-      "resolved": "https://registry.npmjs.org/object-component/-/object-component-0.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/object-component/-/object-component-0.0.3.tgz",
+      "integrity": "sha1-8MaapQ78lbhmwYb0AKM3acsvEpE="
     },
     "object-is": {
       "version": "1.0.1",
-      "from": "object-is@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.0.1.tgz",
+      "integrity": "sha1-CqYOyZiaCz7Xlc9NBvYs8a1lObY="
     },
     "object-keys": {
       "version": "0.4.0",
-      "from": "object-keys@>=0.4.0 <0.5.0",
-      "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-0.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-0.4.0.tgz",
+      "integrity": "sha1-KKaq50KN0sOpLz2V8hM13SBOAzY="
     },
     "object.assign": {
       "version": "4.0.4",
-      "from": "object.assign@>=4.0.4 <5.0.0",
       "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.0.4.tgz",
+      "integrity": "sha1-scnMBE7xuf5jYG/BQau7MuFHMMw=",
       "dependencies": {
         "object-keys": {
           "version": "1.0.11",
-          "from": "object-keys@>=1.0.10 <2.0.0",
-          "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.0.11.tgz"
+          "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.0.11.tgz",
+          "integrity": "sha1-xUYBd4rVYPEULODgG8yotW0TQm0="
         }
       }
     },
     "object.entries": {
       "version": "1.0.4",
-      "from": "object.entries@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/object.entries/-/object.entries-1.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/object.entries/-/object.entries-1.0.4.tgz",
+      "integrity": "sha1-G/mk3SKI9bM/Opk9JXZh8F0WGl8="
     },
     "object.omit": {
       "version": "2.0.1",
-      "from": "object.omit@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/object.omit/-/object.omit-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/object.omit/-/object.omit-2.0.1.tgz",
+      "integrity": "sha1-Gpx0SCnznbuFjHbKNXmuKlTr0fo="
     },
     "object.pick": {
       "version": "1.2.0",
-      "from": "object.pick@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/object.pick/-/object.pick-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/object.pick/-/object.pick-1.2.0.tgz",
+      "integrity": "sha1-tTkr7peC2m2ft9avr1OXefEjTCs="
     },
     "object.values": {
       "version": "1.0.4",
-      "from": "object.values@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.0.4.tgz",
+      "integrity": "sha1-5STaCbT2b/Bd9FdUbscqyZ8TBpo="
     },
     "obuf": {
       "version": "1.1.1",
-      "from": "obuf@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/obuf/-/obuf-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/obuf/-/obuf-1.1.1.tgz",
+      "integrity": "sha1-EEEktsYCxnlogaBCVB0220OlJk4="
     },
     "office-ui-fabric-core": {
       "version": "7.0.0",
-      "from": "office-ui-fabric-core@>=7.0.0 <8.0.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-7.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-7.0.0.tgz",
+      "integrity": "sha1-5rl2yY1wuKoAvVAGTIgOE3dFiY4="
     },
     "office-ui-fabric-react": {
       "version": "2.34.2",
-      "from": "office-ui-fabric-react@>=2.11.0-0 <3.0.0-0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-2.34.2.tgz"
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-2.34.2.tgz",
+      "integrity": "sha1-+sP1mNQTD3//PprellvW+LOwQ/M="
     },
     "on-finished": {
       "version": "2.3.0",
-      "from": "on-finished@>=2.3.0 <2.4.0",
-      "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz",
+      "integrity": "sha1-IPEzZIGwg811M3mSoWlxqi2QaUc="
     },
     "on-headers": {
       "version": "1.0.1",
-      "from": "on-headers@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/on-headers/-/on-headers-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/on-headers/-/on-headers-1.0.1.tgz",
+      "integrity": "sha1-ko9dD0cNSTQmUepnlLCFfBAGk/c="
     },
     "once": {
       "version": "1.4.0",
-      "from": "once@>=1.3.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
+      "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E="
     },
     "onetime": {
       "version": "1.1.0",
-      "from": "onetime@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/onetime/-/onetime-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/onetime/-/onetime-1.1.0.tgz",
+      "integrity": "sha1-ofeDj4MUxRbwXs78vEzP4EtO14k="
     },
     "open": {
       "version": "0.0.5",
-      "from": "open@0.0.5",
-      "resolved": "https://registry.npmjs.org/open/-/open-0.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/open/-/open-0.0.5.tgz",
+      "integrity": "sha1-QsPhjslUZra/DcQvOilFw/DK2Pw="
     },
     "opener": {
       "version": "1.4.3",
-      "from": "opener@>=1.4.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/opener/-/opener-1.4.3.tgz"
+      "resolved": "https://registry.npmjs.org/opener/-/opener-1.4.3.tgz",
+      "integrity": "sha1-XG2ixdflgx6P+jlklQ+NZnSskLg="
     },
     "opn": {
       "version": "4.0.2",
-      "from": "opn@4.0.2",
-      "resolved": "https://registry.npmjs.org/opn/-/opn-4.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/opn/-/opn-4.0.2.tgz",
+      "integrity": "sha1-erwi5kTf9jsKltWrfyeQwPAavJU="
     },
     "optimist": {
       "version": "0.6.1",
-      "from": "optimist@>=0.6.0 <0.7.0",
       "resolved": "https://registry.npmjs.org/optimist/-/optimist-0.6.1.tgz",
+      "integrity": "sha1-2j6nRob6IaGaERwybpDrFaAZZoY=",
       "dependencies": {
         "minimist": {
           "version": "0.0.10",
-          "from": "minimist@>=0.0.1 <0.1.0",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.10.tgz"
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.10.tgz",
+          "integrity": "sha1-3j+YVD2/lggr5IrRoMfNqDYwHc8="
         }
       }
     },
     "optionator": {
       "version": "0.8.2",
-      "from": "optionator@>=0.8.1 <0.9.0",
       "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.8.2.tgz",
+      "integrity": "sha1-NkxeQJ0/TWMB1sC0wFu6UBgK62Q=",
       "dependencies": {
         "wordwrap": {
           "version": "1.0.0",
-          "from": "wordwrap@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz",
+          "integrity": "sha1-J1hIEIkUVqQXHI0CJkQa3pDLyus="
         }
       }
     },
     "options": {
       "version": "0.0.6",
-      "from": "options@>=0.0.5",
-      "resolved": "https://registry.npmjs.org/options/-/options-0.0.6.tgz"
+      "resolved": "https://registry.npmjs.org/options/-/options-0.0.6.tgz",
+      "integrity": "sha1-7CLTEoBrtT5zF3Pnza788cZDEo8="
     },
     "orchestrator": {
       "version": "0.3.8",
-      "from": "orchestrator@>=0.3.7 <0.4.0",
       "resolved": "https://registry.npmjs.org/orchestrator/-/orchestrator-0.3.8.tgz",
+      "integrity": "sha1-FOfp4nZPcxX7rBhOUGx6pt+UrX4=",
       "dependencies": {
         "end-of-stream": {
           "version": "0.1.5",
-          "from": "end-of-stream@>=0.1.5 <0.2.0",
-          "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-0.1.5.tgz"
+          "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-0.1.5.tgz",
+          "integrity": "sha1-jhdyBsPICDfYVjLouTWd/osvbq8="
         },
         "once": {
           "version": "1.3.3",
-          "from": "once@>=1.3.0 <1.4.0",
-          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz"
+          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz",
+          "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA="
         }
       }
     },
     "ordered-read-streams": {
       "version": "0.1.0",
-      "from": "ordered-read-streams@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.1.0.tgz",
+      "integrity": "sha1-/VZamvjrRHO6abbtijQ1LLVS8SY="
     },
     "original": {
       "version": "1.0.0",
-      "from": "original@>=0.0.5",
       "resolved": "https://registry.npmjs.org/original/-/original-1.0.0.tgz",
+      "integrity": "sha1-kUf5P6FpbQS+YeAb1QuurKZWvTs=",
       "dependencies": {
         "url-parse": {
           "version": "1.0.5",
-          "from": "url-parse@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.0.5.tgz"
+          "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.0.5.tgz",
+          "integrity": "sha1-CFSGBCKv3P7+tsllxmLUgAFpkns="
         }
       }
     },
     "os-browserify": {
       "version": "0.1.2",
-      "from": "os-browserify@>=0.1.2 <0.2.0",
-      "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.1.2.tgz",
+      "integrity": "sha1-ScoCk+CxlZCl9d4Qx/JlphfY/lQ="
     },
     "os-homedir": {
       "version": "1.0.2",
-      "from": "os-homedir@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
+      "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M="
     },
     "os-locale": {
       "version": "1.4.0",
-      "from": "os-locale@>=1.4.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
+      "integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk="
     },
     "os-tmpdir": {
       "version": "1.0.2",
-      "from": "os-tmpdir@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
+      "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ="
     },
     "osenv": {
       "version": "0.1.4",
-      "from": "osenv@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.4.tgz",
+      "integrity": "sha1-Qv5tWVPfBsgGS+bxdsPQWqqjRkQ="
     },
     "package-json": {
       "version": "2.4.0",
-      "from": "package-json@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/package-json/-/package-json-2.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/package-json/-/package-json-2.4.0.tgz",
+      "integrity": "sha1-DRW9Z9HLvduyyiIv8u24a8sxqLs="
     },
     "pako": {
       "version": "0.2.9",
-      "from": "pako@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/pako/-/pako-0.2.9.tgz"
+      "resolved": "https://registry.npmjs.org/pako/-/pako-0.2.9.tgz",
+      "integrity": "sha1-8/dSL073gjSNqBYbrZ7P1Rv4OnU="
     },
     "parallel-transform": {
       "version": "1.1.0",
-      "from": "parallel-transform@>=1.1.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/parallel-transform/-/parallel-transform-1.1.0.tgz",
+      "integrity": "sha1-1BDwZbBdojCB/NEPKIVMKb2jOwY=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.1.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "param-case": {
       "version": "2.1.1",
-      "from": "param-case@>=2.1.0 <2.2.0",
-      "resolved": "https://registry.npmjs.org/param-case/-/param-case-2.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/param-case/-/param-case-2.1.1.tgz",
+      "integrity": "sha1-35T9jPZTHs915r75oIWPvHK+Ikc="
     },
     "parse-asn1": {
       "version": "5.1.0",
-      "from": "parse-asn1@>=5.0.0 <6.0.0",
       "resolved": "https://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.0.tgz",
+      "integrity": "sha1-N8T5t+06tlx0gXtfJICTf7+XxxI=",
       "dependencies": {
         "browserify-aes": {
           "version": "1.0.6",
-          "from": "browserify-aes@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.6.tgz"
+          "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.6.tgz",
+          "integrity": "sha1-Xncl297x/Vkw1OurSFZ85FHEigo="
         }
       }
     },
     "parse-filepath": {
       "version": "1.0.1",
-      "from": "parse-filepath@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/parse-filepath/-/parse-filepath-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/parse-filepath/-/parse-filepath-1.0.1.tgz",
+      "integrity": "sha1-FZ1hVdQ5BNFsEO9piRHaHpGWm3M="
     },
     "parse-glob": {
       "version": "3.0.4",
-      "from": "parse-glob@>=3.0.4 <4.0.0",
-      "resolved": "https://registry.npmjs.org/parse-glob/-/parse-glob-3.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/parse-glob/-/parse-glob-3.0.4.tgz",
+      "integrity": "sha1-ssN2z7EfNVE7rdFz7wu246OIORw="
     },
     "parse-json": {
       "version": "2.2.0",
-      "from": "parse-json@>=2.2.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz",
+      "integrity": "sha1-9ID0BDTvgHQfhGkJn43qGPVaTck="
     },
     "parse-passwd": {
       "version": "1.0.0",
-      "from": "parse-passwd@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/parse-passwd/-/parse-passwd-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/parse-passwd/-/parse-passwd-1.0.0.tgz",
+      "integrity": "sha1-bVuTSkVpk7I9N/QKOC1vFmao5cY="
     },
     "parsejson": {
       "version": "0.0.3",
-      "from": "parsejson@0.0.3",
-      "resolved": "https://registry.npmjs.org/parsejson/-/parsejson-0.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/parsejson/-/parsejson-0.0.3.tgz",
+      "integrity": "sha1-q343WfIJ7OmUN5c/fQ8fZK4OZKs="
     },
     "parseqs": {
       "version": "0.0.5",
-      "from": "parseqs@0.0.5",
-      "resolved": "https://registry.npmjs.org/parseqs/-/parseqs-0.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/parseqs/-/parseqs-0.0.5.tgz",
+      "integrity": "sha1-1SCKNzjkZ2bikbouoXNoSSGouJ0="
     },
     "parseuri": {
       "version": "0.0.5",
-      "from": "parseuri@0.0.5",
-      "resolved": "https://registry.npmjs.org/parseuri/-/parseuri-0.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/parseuri/-/parseuri-0.0.5.tgz",
+      "integrity": "sha1-gCBKUNTbt3m/3G6+J3jZDkvOMgo="
     },
     "parseurl": {
       "version": "1.3.1",
-      "from": "parseurl@>=1.3.1 <1.4.0",
-      "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.1.tgz"
+      "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.1.tgz",
+      "integrity": "sha1-yKuMkiO6NIiKpkopeyiFO+wY2lY="
     },
     "path-browserify": {
       "version": "0.0.0",
-      "from": "path-browserify@0.0.0",
-      "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-0.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-0.0.0.tgz",
+      "integrity": "sha1-oLhwcpquIUAFt9UDLsLLuw+0RRo="
     },
     "path-dirname": {
       "version": "1.0.2",
-      "from": "path-dirname@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/path-dirname/-/path-dirname-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/path-dirname/-/path-dirname-1.0.2.tgz",
+      "integrity": "sha1-zDPSTVJeCZpTiMAzbG4yuRYGCeA="
     },
     "path-exists": {
       "version": "2.1.0",
-      "from": "path-exists@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
+      "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s="
     },
     "path-is-absolute": {
       "version": "1.0.1",
-      "from": "path-is-absolute@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
+      "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18="
     },
     "path-is-inside": {
       "version": "1.0.2",
-      "from": "path-is-inside@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/path-is-inside/-/path-is-inside-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/path-is-inside/-/path-is-inside-1.0.2.tgz",
+      "integrity": "sha1-NlQX3t5EQw0cEa9hAn+s8HS9/FM="
     },
     "path-key": {
       "version": "1.0.0",
-      "from": "path-key@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/path-key/-/path-key-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/path-key/-/path-key-1.0.0.tgz",
+      "integrity": "sha1-XVPVeAGWRsDWiADbThRua9wqx68="
     },
     "path-parse": {
       "version": "1.0.5",
-      "from": "path-parse@>=1.0.5 <2.0.0",
-      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.5.tgz",
+      "integrity": "sha1-PBrfhx6pzWyUMbbqK9dKD/BVxME="
     },
     "path-root": {
       "version": "0.1.1",
-      "from": "path-root@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/path-root/-/path-root-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/path-root/-/path-root-0.1.1.tgz",
+      "integrity": "sha1-mkpoFMrBwM1zNgqV8yCDyOpHRbc="
     },
     "path-root-regex": {
       "version": "0.1.2",
-      "from": "path-root-regex@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/path-root-regex/-/path-root-regex-0.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/path-root-regex/-/path-root-regex-0.1.2.tgz",
+      "integrity": "sha1-v8zcjfWxLcUsi0PsONGNcsBLqW0="
     },
     "path-to-regexp": {
       "version": "0.1.7",
-      "from": "path-to-regexp@0.1.7",
-      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz"
+      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
+      "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
     },
     "path-type": {
       "version": "1.1.0",
-      "from": "path-type@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
+      "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE="
     },
     "pause": {
       "version": "0.1.0",
-      "from": "pause@0.1.0",
-      "resolved": "https://registry.npmjs.org/pause/-/pause-0.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/pause/-/pause-0.1.0.tgz",
+      "integrity": "sha1-68ikqGGf8LioGsFRPDQ0/0af23Q="
     },
     "pause-stream": {
       "version": "0.0.11",
-      "from": "pause-stream@0.0.11",
-      "resolved": "https://registry.npmjs.org/pause-stream/-/pause-stream-0.0.11.tgz"
+      "resolved": "https://registry.npmjs.org/pause-stream/-/pause-stream-0.0.11.tgz",
+      "integrity": "sha1-/lo0sMvOErWqaitAPuLnO2AvFEU="
     },
     "pbkdf2": {
       "version": "3.0.12",
-      "from": "pbkdf2@>=3.0.3 <4.0.0",
       "resolved": "https://registry.npmjs.org/pbkdf2/-/pbkdf2-3.0.12.tgz",
+      "integrity": "sha1-vjZ4XFBn6kjYBv+SMojF91C2uKI=",
       "dependencies": {
         "ripemd160": {
           "version": "2.0.1",
-          "from": "ripemd160@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz",
+          "integrity": "sha1-D0WEKVxTo2KK9+bXmsohzlfRxuc="
         },
         "sha.js": {
           "version": "2.4.8",
-          "from": "sha.js@>=2.4.8 <3.0.0",
-          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz"
+          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz",
+          "integrity": "sha1-NwaMLEdra69ALRSknGf1l5IfY08="
         }
       }
     },
     "pbkdf2-compat": {
       "version": "2.0.1",
-      "from": "pbkdf2-compat@2.0.1",
-      "resolved": "https://registry.npmjs.org/pbkdf2-compat/-/pbkdf2-compat-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/pbkdf2-compat/-/pbkdf2-compat-2.0.1.tgz",
+      "integrity": "sha1-tuDI+plJTZTgURV1gCpZpcFC8og="
     },
     "pend": {
       "version": "1.2.0",
-      "from": "pend@>=1.2.0 <1.3.0",
-      "resolved": "https://registry.npmjs.org/pend/-/pend-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/pend/-/pend-1.2.0.tgz",
+      "integrity": "sha1-elfrVQpng/kRUzH89GY9XI4AelA="
     },
     "performance-now": {
       "version": "0.2.0",
-      "from": "performance-now@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-0.2.0.tgz",
+      "integrity": "sha1-M+8wxcd9TqIcWlOGnZG1bY8lVeU="
     },
     "phantomcss": {
       "version": "1.1.3",
-      "from": "phantomcss@1.1.3",
-      "resolved": "https://registry.npmjs.org/phantomcss/-/phantomcss-1.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/phantomcss/-/phantomcss-1.1.3.tgz",
+      "integrity": "sha1-4+N98YNapNYWcLnyzbiIVipjMMM="
     },
     "phantomjs-polyfill": {
       "version": "0.0.2",
-      "from": "phantomjs-polyfill@>=0.0.2 <0.1.0",
-      "resolved": "https://registry.npmjs.org/phantomjs-polyfill/-/phantomjs-polyfill-0.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/phantomjs-polyfill/-/phantomjs-polyfill-0.0.2.tgz",
+      "integrity": "sha1-jGpxY+m8j9n/2+fWBctTUvn7iR4="
     },
     "phantomjs-prebuilt": {
       "version": "2.1.14",
-      "from": "phantomjs-prebuilt@>=2.1.6 <2.2.0",
       "resolved": "https://registry.npmjs.org/phantomjs-prebuilt/-/phantomjs-prebuilt-2.1.14.tgz",
+      "integrity": "sha1-1T0xH8+30dCN2yQBRVjxGIxRbaA=",
       "dependencies": {
         "caseless": {
           "version": "0.11.0",
-          "from": "caseless@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz"
+          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz",
+          "integrity": "sha1-cVuW6phBWTzDMGeSP17GDr2k99c="
+        },
+        "es6-promise": {
+          "version": "4.0.5",
+          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.0.5.tgz",
+          "integrity": "sha1-eILzCt3lskDM+n99eMVIMwlRrkI="
         },
         "fs-extra": {
           "version": "1.0.0",
-          "from": "fs-extra@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-1.0.0.tgz",
+          "integrity": "sha1-zTzl9+fLYUWIP8rjGR6Yd/hYeVA="
         },
         "har-validator": {
           "version": "2.0.6",
-          "from": "har-validator@>=2.0.6 <2.1.0",
-          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz"
+          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz",
+          "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0="
         },
         "qs": {
           "version": "6.3.2",
-          "from": "qs@>=6.3.0 <6.4.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-6.3.2.tgz"
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.3.2.tgz",
+          "integrity": "sha1-51vV9uJoEioqDgvaYwslUMFmUCw="
         },
         "request": {
           "version": "2.79.0",
-          "from": "request@>=2.79.0 <2.80.0",
-          "resolved": "https://registry.npmjs.org/request/-/request-2.79.0.tgz"
+          "resolved": "https://registry.npmjs.org/request/-/request-2.79.0.tgz",
+          "integrity": "sha1-Tf5b9r6LjNw3/Pk+BLZVd3InEN4="
         },
         "tunnel-agent": {
           "version": "0.4.3",
-          "from": "tunnel-agent@>=0.4.1 <0.5.0",
-          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz"
+          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz",
+          "integrity": "sha1-Y3PbdpCf5XDgjXNYM2Xtgop07us="
         }
       }
     },
     "pidof": {
       "version": "1.0.2",
-      "from": "pidof@>=1.0.2 <1.1.0",
-      "resolved": "https://registry.npmjs.org/pidof/-/pidof-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/pidof/-/pidof-1.0.2.tgz",
+      "integrity": "sha1-+6Dq4cgzWhHrgJn10PPvvEXLTpA="
     },
     "pify": {
       "version": "2.3.0",
-      "from": "pify@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+      "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
     },
     "pinkie": {
       "version": "2.0.4",
-      "from": "pinkie@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/pinkie/-/pinkie-2.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/pinkie/-/pinkie-2.0.4.tgz",
+      "integrity": "sha1-clVrgM+g1IqXToDnckjoDtT3+HA="
     },
     "pinkie-promise": {
       "version": "2.0.1",
-      "from": "pinkie-promise@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz",
+      "integrity": "sha1-ITXW36ejWMBprJsXh3YogihFD/o="
     },
     "pkg-conf": {
       "version": "1.1.3",
-      "from": "pkg-conf@>=1.1.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/pkg-conf/-/pkg-conf-1.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/pkg-conf/-/pkg-conf-1.1.3.tgz",
+      "integrity": "sha1-N45W1v0T6Iv7b0ol33qD+qvduls="
     },
     "plur": {
       "version": "2.1.2",
-      "from": "plur@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/plur/-/plur-2.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/plur/-/plur-2.1.2.tgz",
+      "integrity": "sha1-dIJFLBoPUI4+NE6uwxLJHCncZVo="
     },
     "portfinder": {
       "version": "1.0.13",
-      "from": "portfinder@>=1.0.9 <2.0.0",
-      "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.13.tgz"
+      "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.13.tgz",
+      "integrity": "sha1-uzLs2HwnEErm7kS1o8y/Drsa7ek="
     },
     "postcss": {
       "version": "5.2.17",
-      "from": "postcss@>=5.0.21 <6.0.0",
       "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+      "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
       "dependencies": {
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.2.3 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
     "postcss-calc": {
       "version": "5.3.1",
-      "from": "postcss-calc@>=5.2.0 <6.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-5.3.1.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-5.3.1.tgz",
+      "integrity": "sha1-d7rnypKK2FcW4v2kLyYb98HWW14="
     },
     "postcss-colormin": {
       "version": "2.2.2",
-      "from": "postcss-colormin@>=2.1.8 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-colormin/-/postcss-colormin-2.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-colormin/-/postcss-colormin-2.2.2.tgz",
+      "integrity": "sha1-ZjFBfV8OkJo9fsJrJMio0eT5bks="
     },
     "postcss-convert-values": {
       "version": "2.6.1",
-      "from": "postcss-convert-values@>=2.3.4 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-convert-values/-/postcss-convert-values-2.6.1.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-convert-values/-/postcss-convert-values-2.6.1.tgz",
+      "integrity": "sha1-u9hZPFwf0uPRwyK7kl3K6Nrk1i0="
     },
     "postcss-discard-comments": {
       "version": "2.0.4",
-      "from": "postcss-discard-comments@>=2.0.4 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-discard-comments/-/postcss-discard-comments-2.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-discard-comments/-/postcss-discard-comments-2.0.4.tgz",
+      "integrity": "sha1-vv6J+v1bPazlzM5Rt2uBUUvgDj0="
     },
     "postcss-discard-duplicates": {
       "version": "2.1.0",
-      "from": "postcss-discard-duplicates@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-discard-duplicates/-/postcss-discard-duplicates-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-discard-duplicates/-/postcss-discard-duplicates-2.1.0.tgz",
+      "integrity": "sha1-uavye4isGIFYpesSq8riAmO5GTI="
     },
     "postcss-discard-empty": {
       "version": "2.1.0",
-      "from": "postcss-discard-empty@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-discard-empty/-/postcss-discard-empty-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-discard-empty/-/postcss-discard-empty-2.1.0.tgz",
+      "integrity": "sha1-0rS9nVztXr2Nyt52QMfXzX9PkrU="
     },
     "postcss-discard-overridden": {
       "version": "0.1.1",
-      "from": "postcss-discard-overridden@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/postcss-discard-overridden/-/postcss-discard-overridden-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-discard-overridden/-/postcss-discard-overridden-0.1.1.tgz",
+      "integrity": "sha1-ix6vVU9ob7KIzYdMVWZ7CqNmjVg="
     },
     "postcss-discard-unused": {
       "version": "2.2.3",
-      "from": "postcss-discard-unused@>=2.2.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-discard-unused/-/postcss-discard-unused-2.2.3.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-discard-unused/-/postcss-discard-unused-2.2.3.tgz",
+      "integrity": "sha1-vOMLLMWR/8Y0Mitfs0ZLbZNPRDM="
     },
     "postcss-filter-plugins": {
       "version": "2.0.2",
-      "from": "postcss-filter-plugins@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-filter-plugins/-/postcss-filter-plugins-2.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-filter-plugins/-/postcss-filter-plugins-2.0.2.tgz",
+      "integrity": "sha1-bYWGJTTXNaxCDkqFgG4fXUKG2Ew="
     },
     "postcss-load-config": {
       "version": "1.2.0",
-      "from": "postcss-load-config@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-1.2.0.tgz",
+      "integrity": "sha1-U56a/J3chiASHr+djDZz4M5Q0oo="
     },
     "postcss-load-options": {
       "version": "1.2.0",
-      "from": "postcss-load-options@>=1.2.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-load-options/-/postcss-load-options-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-load-options/-/postcss-load-options-1.2.0.tgz",
+      "integrity": "sha1-sJixVZ3awt8EvAuzdfmaXP4rbYw="
     },
     "postcss-load-plugins": {
       "version": "2.3.0",
-      "from": "postcss-load-plugins@>=2.3.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-load-plugins/-/postcss-load-plugins-2.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-load-plugins/-/postcss-load-plugins-2.3.0.tgz",
+      "integrity": "sha1-dFdoEWWZrKLwCfrUJrABdQSdjZI="
     },
     "postcss-loader": {
       "version": "1.3.3",
-      "from": "postcss-loader@>=1.3.3 <2.0.0",
       "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-1.3.3.tgz",
+      "integrity": "sha1-piHqH6KQYqg5cqRvVEhncTAZFus=",
       "dependencies": {
         "loader-utils": {
           "version": "1.1.0",
-          "from": "loader-utils@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
+          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
         }
       }
     },
     "postcss-merge-idents": {
       "version": "2.1.7",
-      "from": "postcss-merge-idents@>=2.1.5 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-merge-idents/-/postcss-merge-idents-2.1.7.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-merge-idents/-/postcss-merge-idents-2.1.7.tgz",
+      "integrity": "sha1-TFUwMTwI4dWzu/PSu8dH4njuonA="
     },
     "postcss-merge-longhand": {
       "version": "2.0.2",
-      "from": "postcss-merge-longhand@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-merge-longhand/-/postcss-merge-longhand-2.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-merge-longhand/-/postcss-merge-longhand-2.0.2.tgz",
+      "integrity": "sha1-I9kM0Sewp3mUkVMyc5A0oaTz1lg="
     },
     "postcss-merge-rules": {
       "version": "2.1.2",
-      "from": "postcss-merge-rules@>=2.0.3 <3.0.0",
       "resolved": "https://registry.npmjs.org/postcss-merge-rules/-/postcss-merge-rules-2.1.2.tgz",
+      "integrity": "sha1-0d9d+qexrMO+VT8OnhDofGG19yE=",
       "dependencies": {
         "browserslist": {
           "version": "1.7.7",
-          "from": "browserslist@>=1.5.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz"
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
+          "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk="
         }
       }
     },
     "postcss-message-helpers": {
       "version": "2.0.0",
-      "from": "postcss-message-helpers@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-message-helpers/-/postcss-message-helpers-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-message-helpers/-/postcss-message-helpers-2.0.0.tgz",
+      "integrity": "sha1-pPL0+rbk/gAvCu0ABHjN9S+bpg4="
     },
     "postcss-minify-font-values": {
       "version": "1.0.5",
-      "from": "postcss-minify-font-values@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-minify-font-values/-/postcss-minify-font-values-1.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-minify-font-values/-/postcss-minify-font-values-1.0.5.tgz",
+      "integrity": "sha1-S1jttWZB66fIR0qzUmyv17vey2k="
     },
     "postcss-minify-gradients": {
       "version": "1.0.5",
-      "from": "postcss-minify-gradients@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-minify-gradients/-/postcss-minify-gradients-1.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-minify-gradients/-/postcss-minify-gradients-1.0.5.tgz",
+      "integrity": "sha1-Xb2hE3NwP4PPtKPqOIHY11/15uE="
     },
     "postcss-minify-params": {
       "version": "1.2.2",
-      "from": "postcss-minify-params@>=1.0.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-minify-params/-/postcss-minify-params-1.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-minify-params/-/postcss-minify-params-1.2.2.tgz",
+      "integrity": "sha1-rSzgcTc7lDs9kwo/pZo1jCjW8fM="
     },
     "postcss-minify-selectors": {
       "version": "2.1.1",
-      "from": "postcss-minify-selectors@>=2.0.4 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-minify-selectors/-/postcss-minify-selectors-2.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-minify-selectors/-/postcss-minify-selectors-2.1.1.tgz",
+      "integrity": "sha1-ssapjAByz5G5MtGkllCBFDEXNb8="
     },
     "postcss-modules": {
       "version": "0.5.2",
-      "from": "postcss-modules@>=0.5.0 <0.6.0",
-      "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.5.2.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.5.2.tgz",
+      "integrity": "sha1-nWgv7T8oK9ZLKqT+tvIqKvQ1/9o="
     },
     "postcss-modules-extract-imports": {
       "version": "1.1.0",
-      "from": "postcss-modules-extract-imports@1.1.0",
       "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-1.1.0.tgz",
+      "integrity": "sha1-thTJcgvmgW6u41+zpfqh26agXds=",
       "dependencies": {
         "postcss": {
           "version": "6.0.1",
-          "from": "postcss@>=6.0.1 <7.0.0",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
+          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.2.3 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
     "postcss-modules-local-by-default": {
       "version": "1.2.0",
-      "from": "postcss-modules-local-by-default@1.2.0",
       "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-1.2.0.tgz",
+      "integrity": "sha1-99gMOYxaOT+nlkRmvRlQCn1hwGk=",
       "dependencies": {
         "postcss": {
           "version": "6.0.1",
-          "from": "postcss@>=6.0.1 <7.0.0",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
+          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.2.3 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
     "postcss-modules-scope": {
       "version": "1.1.0",
-      "from": "postcss-modules-scope@1.1.0",
       "resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-1.1.0.tgz",
+      "integrity": "sha1-1upkmUx5+XtipytCb75gVqGUu5A=",
       "dependencies": {
         "postcss": {
           "version": "6.0.1",
-          "from": "postcss@>=6.0.1 <7.0.0",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
+          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.2.3 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
     "postcss-modules-values": {
       "version": "1.3.0",
-      "from": "postcss-modules-values@1.3.0",
       "resolved": "https://registry.npmjs.org/postcss-modules-values/-/postcss-modules-values-1.3.0.tgz",
+      "integrity": "sha1-7P+p1+GSUYOJ9CrQ6D9yrsRW6iA=",
       "dependencies": {
         "postcss": {
           "version": "6.0.1",
-          "from": "postcss@>=6.0.1 <7.0.0",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
+          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.2.3 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
     "postcss-normalize-charset": {
       "version": "1.1.1",
-      "from": "postcss-normalize-charset@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-normalize-charset/-/postcss-normalize-charset-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-normalize-charset/-/postcss-normalize-charset-1.1.1.tgz",
+      "integrity": "sha1-757nEhLX/nWceO0WL2HtYrXLk/E="
     },
     "postcss-normalize-url": {
       "version": "3.0.8",
-      "from": "postcss-normalize-url@>=3.0.7 <4.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-normalize-url/-/postcss-normalize-url-3.0.8.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-normalize-url/-/postcss-normalize-url-3.0.8.tgz",
+      "integrity": "sha1-EI90s/L82viRov+j6kWSJ5/HgiI="
     },
     "postcss-ordered-values": {
       "version": "2.2.3",
-      "from": "postcss-ordered-values@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-ordered-values/-/postcss-ordered-values-2.2.3.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-ordered-values/-/postcss-ordered-values-2.2.3.tgz",
+      "integrity": "sha1-7sbCpntsQSqNsgQud/6NpD+VwR0="
     },
     "postcss-reduce-idents": {
       "version": "2.4.0",
-      "from": "postcss-reduce-idents@>=2.2.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-reduce-idents/-/postcss-reduce-idents-2.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-reduce-idents/-/postcss-reduce-idents-2.4.0.tgz",
+      "integrity": "sha1-wsbSDMlYKE9qv75j92Cb9AkFmtM="
     },
     "postcss-reduce-initial": {
       "version": "1.0.1",
-      "from": "postcss-reduce-initial@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-reduce-initial/-/postcss-reduce-initial-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-reduce-initial/-/postcss-reduce-initial-1.0.1.tgz",
+      "integrity": "sha1-aPgGlfBF0IJjqHmtJA343WT2ROo="
     },
     "postcss-reduce-transforms": {
       "version": "1.0.4",
-      "from": "postcss-reduce-transforms@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-reduce-transforms/-/postcss-reduce-transforms-1.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-reduce-transforms/-/postcss-reduce-transforms-1.0.4.tgz",
+      "integrity": "sha1-/3b02CEkN7McKYpC0uFEQCV3GuE="
     },
     "postcss-selector-parser": {
       "version": "2.2.3",
-      "from": "postcss-selector-parser@>=2.2.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-2.2.3.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-2.2.3.tgz",
+      "integrity": "sha1-+UN3iGBsPJrO4W/+jYsWKX8nu5A="
     },
     "postcss-svgo": {
       "version": "2.1.6",
-      "from": "postcss-svgo@>=2.1.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-svgo/-/postcss-svgo-2.1.6.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-svgo/-/postcss-svgo-2.1.6.tgz",
+      "integrity": "sha1-tt8YqmE7Zm4TPwittSGcJoSsEI0="
     },
     "postcss-unique-selectors": {
       "version": "2.0.2",
-      "from": "postcss-unique-selectors@>=2.0.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-unique-selectors/-/postcss-unique-selectors-2.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-unique-selectors/-/postcss-unique-selectors-2.0.2.tgz",
+      "integrity": "sha1-mB1X0p3csz57Hf4f1DuGSfkzyh0="
     },
     "postcss-value-parser": {
       "version": "3.3.0",
-      "from": "postcss-value-parser@>=3.2.3 <4.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-3.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-3.3.0.tgz",
+      "integrity": "sha1-h/OPnxj3dKSrTIojL1xc6IcqnRU="
     },
     "postcss-zindex": {
       "version": "2.2.0",
-      "from": "postcss-zindex@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-zindex/-/postcss-zindex-2.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-zindex/-/postcss-zindex-2.2.0.tgz",
+      "integrity": "sha1-0hCd3AVbka9n/EyzsCWUZjnSryI="
     },
     "prelude-ls": {
       "version": "1.1.2",
-      "from": "prelude-ls@>=1.1.2 <1.2.0",
-      "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.1.2.tgz",
+      "integrity": "sha1-IZMqVJ9eUv/ZqCf1cOBL5iqX2lQ="
     },
     "prepend-http": {
       "version": "1.0.4",
-      "from": "prepend-http@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/prepend-http/-/prepend-http-1.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/prepend-http/-/prepend-http-1.0.4.tgz",
+      "integrity": "sha1-1PRWKwzjaW5BrFLQ4ALlemNdxtw="
     },
     "preserve": {
       "version": "0.2.0",
-      "from": "preserve@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/preserve/-/preserve-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/preserve/-/preserve-0.2.0.tgz",
+      "integrity": "sha1-gV7R9uvGWSb4ZbMQwHE7yzMVzks="
     },
     "pretty-hrtime": {
       "version": "1.0.3",
-      "from": "pretty-hrtime@>=1.0.2 <1.1.0",
-      "resolved": "https://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz",
+      "integrity": "sha1-t+PqQkNaTJsnWdmeDyAesZWALuE="
     },
     "private": {
       "version": "0.1.7",
-      "from": "private@>=0.1.5 <0.2.0",
-      "resolved": "https://registry.npmjs.org/private/-/private-0.1.7.tgz"
+      "resolved": "https://registry.npmjs.org/private/-/private-0.1.7.tgz",
+      "integrity": "sha1-aM5eih7woju1cMwoU3tTMqumPvE="
     },
     "process": {
       "version": "0.11.10",
-      "from": "process@>=0.11.0 <0.12.0",
-      "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz"
+      "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
+      "integrity": "sha1-czIwDoQBYb2j5podHZGn1LwW8YI="
     },
     "process-nextick-args": {
       "version": "1.0.7",
-      "from": "process-nextick-args@>=1.0.6 <1.1.0",
-      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz"
+      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz",
+      "integrity": "sha1-FQ4gt1ZZCtP5EJPyWk8q2L/zC6M="
     },
     "progress": {
       "version": "1.1.8",
-      "from": "progress@>=1.1.8 <1.2.0",
-      "resolved": "https://registry.npmjs.org/progress/-/progress-1.1.8.tgz"
+      "resolved": "https://registry.npmjs.org/progress/-/progress-1.1.8.tgz",
+      "integrity": "sha1-4mDHj2Fhzdmw5WzD4Khd4Xx6V74="
     },
     "promise": {
       "version": "7.1.1",
-      "from": "promise@>=7.0.3 <8.0.0",
-      "resolved": "https://registry.npmjs.org/promise/-/promise-7.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/promise/-/promise-7.1.1.tgz",
+      "integrity": "sha1-SJZUxpJha4qlWwck+oCbt9tJxb8="
     },
     "prop-types": {
       "version": "15.5.10",
-      "from": "prop-types@>=15.5.10 <16.0.0",
       "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.5.10.tgz",
+      "integrity": "sha1-J5ffwxJhguOpXj37suiT3ddFYVQ=",
       "dependencies": {
         "core-js": {
           "version": "1.2.7",
-          "from": "core-js@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
+          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
         },
         "fbjs": {
           "version": "0.8.12",
-          "from": "fbjs@>=0.8.9 <0.9.0",
-          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz"
+          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz",
+          "integrity": "sha1-ELXZL3bUVXX9Y6IX1OoCvqL47QQ="
         }
       }
     },
     "proxy-addr": {
       "version": "1.1.4",
-      "from": "proxy-addr@>=1.1.3 <1.2.0",
-      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-1.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-1.1.4.tgz",
+      "integrity": "sha1-J+VF9pYKRKYn2bREZ+NcG2tM4vM="
     },
     "prr": {
       "version": "0.0.0",
-      "from": "prr@>=0.0.0 <0.1.0",
-      "resolved": "https://registry.npmjs.org/prr/-/prr-0.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/prr/-/prr-0.0.0.tgz",
+      "integrity": "sha1-GoS4WQgyVQFBGFPQCB7j+obikmo="
     },
     "pseudomap": {
       "version": "1.0.2",
-      "from": "pseudomap@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/pseudomap/-/pseudomap-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/pseudomap/-/pseudomap-1.0.2.tgz",
+      "integrity": "sha1-8FKijacOYYkX7wqKw0wa5aaChrM="
     },
     "public-encrypt": {
       "version": "4.0.0",
-      "from": "public-encrypt@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/public-encrypt/-/public-encrypt-4.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/public-encrypt/-/public-encrypt-4.0.0.tgz",
+      "integrity": "sha1-OfaZ86RlYN1eusvKaTyvfGXBjMY="
     },
     "punycode": {
       "version": "1.4.1",
-      "from": "punycode@>=1.4.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
+      "integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4="
     },
     "q": {
       "version": "1.5.0",
-      "from": "q@>=1.1.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/q/-/q-1.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/q/-/q-1.5.0.tgz",
+      "integrity": "sha1-3QG6ydBtMObyGa7LglPunr3DCPE="
     },
     "qs": {
       "version": "6.4.0",
-      "from": "qs@>=6.4.0 <6.5.0",
-      "resolved": "https://registry.npmjs.org/qs/-/qs-6.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/qs/-/qs-6.4.0.tgz",
+      "integrity": "sha1-E+JtKK1rD/qpExLNO/cI7TUecjM="
     },
     "query-string": {
       "version": "4.3.4",
-      "from": "query-string@>=4.1.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/query-string/-/query-string-4.3.4.tgz"
+      "resolved": "https://registry.npmjs.org/query-string/-/query-string-4.3.4.tgz",
+      "integrity": "sha1-u7aTucqRXCMlFbIosaArYJBD2+s="
     },
     "querystring": {
       "version": "0.2.0",
-      "from": "querystring@0.2.0",
-      "resolved": "https://registry.npmjs.org/querystring/-/querystring-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/querystring/-/querystring-0.2.0.tgz",
+      "integrity": "sha1-sgmEkgO7Jd+CDadW50cAWHhSFiA="
     },
     "querystring-es3": {
       "version": "0.2.1",
-      "from": "querystring-es3@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/querystring-es3/-/querystring-es3-0.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/querystring-es3/-/querystring-es3-0.2.1.tgz",
+      "integrity": "sha1-nsYfeQSYdXB9aUFFlv2Qek1xHnM="
     },
     "querystringify": {
       "version": "0.0.4",
-      "from": "querystringify@>=0.0.0 <0.1.0",
-      "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-0.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-0.0.4.tgz",
+      "integrity": "sha1-DPf4T5Rj/wrlHExLFC2VvjdyTZw="
     },
     "random-bytes": {
       "version": "1.0.0",
-      "from": "random-bytes@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/random-bytes/-/random-bytes-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/random-bytes/-/random-bytes-1.0.0.tgz",
+      "integrity": "sha1-T2ih3Arli9P7lYSMMDJNt11kNgs="
     },
     "randomatic": {
       "version": "1.1.6",
-      "from": "randomatic@>=1.1.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-1.1.6.tgz"
+      "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-1.1.6.tgz",
+      "integrity": "sha1-EQ3Kv/OX6dz/fAeJzMCkmt8exbs="
     },
     "randombytes": {
       "version": "2.0.3",
-      "from": "randombytes@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.0.3.tgz",
+      "integrity": "sha1-Z0yZdgkBw8QRJ3GjHlIdw0nMCew="
     },
     "range-parser": {
       "version": "1.2.0",
-      "from": "range-parser@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.0.tgz",
+      "integrity": "sha1-9JvmtIeJTdxA3MlKMi9hEJLgDV4="
     },
     "raw-body": {
       "version": "2.2.0",
-      "from": "raw-body@>=2.2.0 <2.3.0",
-      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.2.0.tgz",
+      "integrity": "sha1-mUl2z2pQlqQRYoQEkvC9xdbn+5Y="
     },
     "raw-loader": {
       "version": "0.5.1",
-      "from": "raw-loader@>=0.5.1 <0.6.0",
-      "resolved": "https://registry.npmjs.org/raw-loader/-/raw-loader-0.5.1.tgz"
+      "resolved": "https://registry.npmjs.org/raw-loader/-/raw-loader-0.5.1.tgz",
+      "integrity": "sha1-DD0L6u2KAclm2Xh793goElKpeao="
     },
     "rc": {
       "version": "1.2.1",
-      "from": "rc@>=1.1.6 <2.0.0",
-      "resolved": "https://registry.npmjs.org/rc/-/rc-1.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/rc/-/rc-1.2.1.tgz",
+      "integrity": "sha1-LgPo5C7kULjLPc5lvhv4l04d/ZU="
     },
     "react": {
       "version": "15.4.2",
-      "from": "react@15.4.2",
       "resolved": "https://registry.npmjs.org/react/-/react-15.4.2.tgz",
+      "integrity": "sha1-QfeZGyYYU5K6m66WyIiefgGDl+8=",
       "dependencies": {
         "core-js": {
           "version": "1.2.7",
-          "from": "core-js@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
+          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
         },
         "fbjs": {
           "version": "0.8.12",
-          "from": "fbjs@>=0.8.4 <0.9.0",
-          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz"
+          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz",
+          "integrity": "sha1-ELXZL3bUVXX9Y6IX1OoCvqL47QQ="
         }
       }
     },
     "react-addons-test-utils": {
       "version": "15.4.2",
-      "from": "react-addons-test-utils@15.4.2",
       "resolved": "https://registry.npmjs.org/react-addons-test-utils/-/react-addons-test-utils-15.4.2.tgz",
+      "integrity": "sha1-k7yqcY/K5zYNQuj7HAl1bMNjAqI=",
       "dependencies": {
         "core-js": {
           "version": "1.2.7",
-          "from": "core-js@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
+          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
         },
         "fbjs": {
           "version": "0.8.12",
-          "from": "fbjs@>=0.8.4 <0.9.0",
-          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz"
+          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz",
+          "integrity": "sha1-ELXZL3bUVXX9Y6IX1OoCvqL47QQ="
         }
       }
     },
     "react-dom": {
       "version": "15.4.2",
-      "from": "react-dom@15.4.2",
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-15.4.2.tgz",
+      "integrity": "sha1-AVNj8FsKH9Uq6e/dOgBg2QaVII8=",
       "dependencies": {
         "core-js": {
           "version": "1.2.7",
-          "from": "core-js@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
+          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
         },
         "fbjs": {
           "version": "0.8.12",
-          "from": "fbjs@>=0.8.1 <0.9.0",
-          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz"
+          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz",
+          "integrity": "sha1-ELXZL3bUVXX9Y6IX1OoCvqL47QQ="
         }
       }
     },
     "react-highlight": {
       "version": "0.9.0",
-      "from": "react-highlight@0.9.0",
-      "resolved": "https://registry.npmjs.org/react-highlight/-/react-highlight-0.9.0.tgz"
+      "resolved": "https://registry.npmjs.org/react-highlight/-/react-highlight-0.9.0.tgz",
+      "integrity": "sha1-1e3udEzLhon3k4eUtqG1VLsVDrc="
     },
     "read": {
       "version": "1.0.7",
-      "from": "read@>=1.0.3 <1.1.0",
-      "resolved": "https://registry.npmjs.org/read/-/read-1.0.7.tgz"
+      "resolved": "https://registry.npmjs.org/read/-/read-1.0.7.tgz",
+      "integrity": "sha1-s9oZvQUkMal2cdRKQmNK33ELQMQ="
     },
     "read-all-stream": {
       "version": "3.1.0",
-      "from": "read-all-stream@>=3.0.0 <4.0.0",
       "resolved": "https://registry.npmjs.org/read-all-stream/-/read-all-stream-3.1.0.tgz",
+      "integrity": "sha1-NcPhd/IHjveJ7kv6+kNzB06u9Po=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "read-pkg": {
       "version": "1.1.0",
-      "from": "read-pkg@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
+      "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg="
     },
     "read-pkg-up": {
       "version": "1.0.1",
-      "from": "read-pkg-up@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
+      "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI="
     },
     "readable-stream": {
       "version": "1.1.14",
-      "from": "readable-stream@>=1.1.9 <1.2.0",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz"
+      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
+      "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk="
     },
     "readdirp": {
       "version": "2.1.0",
-      "from": "readdirp@>=2.0.0 <3.0.0",
       "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-2.1.0.tgz",
+      "integrity": "sha1-TtCtBg3zBzMAxIRANz9y0cxkLXg=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "readline2": {
       "version": "1.0.1",
-      "from": "readline2@>=1.0.1 <2.0.0",
       "resolved": "https://registry.npmjs.org/readline2/-/readline2-1.0.1.tgz",
+      "integrity": "sha1-QQWWCP/BVHV7cV2ZidGZ/783LjU=",
       "dependencies": {
         "mute-stream": {
           "version": "0.0.5",
-          "from": "mute-stream@0.0.5",
-          "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.5.tgz"
+          "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.5.tgz",
+          "integrity": "sha1-j7+rsKmKJT0xhDMfno3rc3L6xsA="
         }
       }
     },
     "recast": {
       "version": "0.11.23",
-      "from": "recast@>=0.11.12 <0.12.0",
-      "resolved": "https://registry.npmjs.org/recast/-/recast-0.11.23.tgz"
+      "resolved": "https://registry.npmjs.org/recast/-/recast-0.11.23.tgz",
+      "integrity": "sha1-RR/TAEqx5N+bTktmN2sqIZEkYtM="
     },
     "rechoir": {
       "version": "0.6.2",
-      "from": "rechoir@>=0.6.2 <0.7.0",
-      "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz"
+      "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz",
+      "integrity": "sha1-hSBLVNuoLVdC4oyWdW70OvUOM4Q="
     },
     "redent": {
       "version": "1.0.0",
-      "from": "redent@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/redent/-/redent-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/redent/-/redent-1.0.0.tgz",
+      "integrity": "sha1-z5Fqsf1fHxbfsggi3W7H9zDCr94="
     },
     "redeyed": {
       "version": "1.0.1",
-      "from": "redeyed@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/redeyed/-/redeyed-1.0.1.tgz",
+      "integrity": "sha1-6WwZO0DAgWsArshCaY5hGF5VSYo=",
       "dependencies": {
         "esprima": {
           "version": "3.0.0",
-          "from": "esprima@>=3.0.0 <3.1.0",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.0.0.tgz",
+          "integrity": "sha1-U88kes2ncxPlUcOqLnM0LT+099k="
         }
       }
     },
     "reduce-css-calc": {
       "version": "1.3.0",
-      "from": "reduce-css-calc@>=1.2.6 <2.0.0",
-      "resolved": "https://registry.npmjs.org/reduce-css-calc/-/reduce-css-calc-1.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/reduce-css-calc/-/reduce-css-calc-1.3.0.tgz",
+      "integrity": "sha1-dHyRTgSWFKTJz7umKYca0dKSdxY="
     },
     "reduce-function-call": {
       "version": "1.0.2",
-      "from": "reduce-function-call@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/reduce-function-call/-/reduce-function-call-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/reduce-function-call/-/reduce-function-call-1.0.2.tgz",
+      "integrity": "sha1-WiAL+S4ON3UXUv5FsKszD9S2vpk="
     },
     "regenerate": {
       "version": "1.3.2",
-      "from": "regenerate@>=1.2.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.3.2.tgz"
+      "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.3.2.tgz",
+      "integrity": "sha1-0ZQcZ7rUN+G+dkM63Vs4X5WxkmA="
     },
     "regenerator-runtime": {
       "version": "0.10.5",
-      "from": "regenerator-runtime@>=0.10.0 <0.11.0",
-      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz"
+      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz",
+      "integrity": "sha1-M2w+/BIgrc7dosn6tntaeVWjNlg="
     },
     "regex-cache": {
       "version": "0.4.3",
-      "from": "regex-cache@>=0.4.2 <0.5.0",
-      "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.3.tgz"
+      "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.3.tgz",
+      "integrity": "sha1-mxpsNdTQ3871cRrmUejp09cRQUU="
     },
     "regexpu-core": {
       "version": "1.0.0",
-      "from": "regexpu-core@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-1.0.0.tgz",
+      "integrity": "sha1-hqdj9Y7k18L2sQLkdkBQ3n7ZDGs="
     },
     "registry-auth-token": {
       "version": "3.3.1",
-      "from": "registry-auth-token@>=3.0.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/registry-auth-token/-/registry-auth-token-3.3.1.tgz"
+      "resolved": "https://registry.npmjs.org/registry-auth-token/-/registry-auth-token-3.3.1.tgz",
+      "integrity": "sha1-+w0yie4Nmtosu1KvXf5mywcNMAY="
     },
     "registry-url": {
       "version": "3.1.0",
-      "from": "registry-url@>=3.0.3 <4.0.0",
-      "resolved": "https://registry.npmjs.org/registry-url/-/registry-url-3.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/registry-url/-/registry-url-3.1.0.tgz",
+      "integrity": "sha1-PU74cPc93h138M+aOBQyRE4XSUI="
     },
     "regjsgen": {
       "version": "0.2.0",
-      "from": "regjsgen@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.2.0.tgz",
+      "integrity": "sha1-bAFq3qxVT3WCP+N6wFuS1aTtsfc="
     },
     "regjsparser": {
       "version": "0.1.5",
-      "from": "regjsparser@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz"
+      "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz",
+      "integrity": "sha1-fuj4Tcb6eS0/0K4ijSS9lJ6tIFw="
     },
     "relateurl": {
       "version": "0.2.7",
-      "from": "relateurl@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/relateurl/-/relateurl-0.2.7.tgz"
+      "resolved": "https://registry.npmjs.org/relateurl/-/relateurl-0.2.7.tgz",
+      "integrity": "sha1-VNvzd+UUQKypCkzSdGANP/LYiKk="
     },
     "remove-trailing-separator": {
       "version": "1.0.1",
-      "from": "remove-trailing-separator@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.0.1.tgz",
+      "integrity": "sha1-YV67lq9VlVLUv0BXyENtSGq2PMQ="
     },
     "repeat-element": {
       "version": "1.1.2",
-      "from": "repeat-element@>=1.1.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/repeat-element/-/repeat-element-1.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/repeat-element/-/repeat-element-1.1.2.tgz",
+      "integrity": "sha1-7wiaF40Ug7quTZPrmLT55OEdmQo="
     },
     "repeat-string": {
       "version": "1.6.1",
-      "from": "repeat-string@>=1.5.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-1.6.1.tgz"
+      "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-1.6.1.tgz",
+      "integrity": "sha1-jcrkcOHIirwtYA//Sndihtp15jc="
     },
     "repeating": {
       "version": "2.0.1",
-      "from": "repeating@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/repeating/-/repeating-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/repeating/-/repeating-2.0.1.tgz",
+      "integrity": "sha1-UhTFOpJtNVJwdSf7q0FdvAjQbdo="
     },
     "replace-ext": {
       "version": "0.0.1",
-      "from": "replace-ext@0.0.1",
-      "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-0.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-0.0.1.tgz",
+      "integrity": "sha1-KbvZIHinOfC8zitO5B6DeVNSKSQ="
     },
     "replacestream": {
       "version": "4.0.2",
-      "from": "replacestream@>=4.0.0 <5.0.0",
       "resolved": "https://registry.npmjs.org/replacestream/-/replacestream-4.0.2.tgz",
+      "integrity": "sha1-DEFAcH5PAyP1DeBEhRcIz1i8N70=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "request": {
       "version": "2.81.0",
-      "from": "request@>=2.81.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz"
+      "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz",
+      "integrity": "sha1-xpKJRqDgbF+Nb4qTM0af/aRimKA="
     },
     "request-progress": {
       "version": "2.0.1",
-      "from": "request-progress@>=2.0.1 <2.1.0",
-      "resolved": "https://registry.npmjs.org/request-progress/-/request-progress-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/request-progress/-/request-progress-2.0.1.tgz",
+      "integrity": "sha1-XTa7V5YcZzqlt4jbyBQf3yO0Tgg="
     },
     "require-directory": {
       "version": "2.1.1",
-      "from": "require-directory@>=2.1.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
+      "integrity": "sha1-jGStX9MNqxyXbiNE/+f3kqam30I="
     },
     "require-from-string": {
       "version": "1.2.1",
-      "from": "require-from-string@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-1.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-1.2.1.tgz",
+      "integrity": "sha1-UpyczvJzgK3+yaL5ZbZJu+5jZBg="
     },
     "require-main-filename": {
       "version": "1.0.1",
-      "from": "require-main-filename@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-1.0.1.tgz",
+      "integrity": "sha1-l/cXtp1IeE9fUmpsWqj/3aBVpNE="
     },
     "requires-port": {
       "version": "1.0.0",
-      "from": "requires-port@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
+      "integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8="
     },
     "resemblejs": {
       "version": "2.2.4",
-      "from": "resemblejs@>=2.2.3 <2.3.0",
-      "resolved": "https://registry.npmjs.org/resemblejs/-/resemblejs-2.2.4.tgz"
+      "resolved": "https://registry.npmjs.org/resemblejs/-/resemblejs-2.2.4.tgz",
+      "integrity": "sha1-g1JeKtt333fIrQhqGyUQ8DJ2DAg="
     },
     "resolve": {
       "version": "1.3.3",
-      "from": "resolve@>=1.1.7 <2.0.0",
-      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.3.3.tgz"
+      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.3.3.tgz",
+      "integrity": "sha1-ZVkHw0aahoDcLeOidaj91paR8OU="
     },
     "resolve-dir": {
       "version": "0.1.1",
-      "from": "resolve-dir@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/resolve-dir/-/resolve-dir-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/resolve-dir/-/resolve-dir-0.1.1.tgz",
+      "integrity": "sha1-shklmlYC+sXFxJatiUpujMQwJh4="
     },
     "response-time": {
       "version": "2.3.2",
-      "from": "response-time@>=2.3.1 <2.4.0",
-      "resolved": "https://registry.npmjs.org/response-time/-/response-time-2.3.2.tgz"
+      "resolved": "https://registry.npmjs.org/response-time/-/response-time-2.3.2.tgz",
+      "integrity": "sha1-/6cbq5UtYvfB1Jt0NDVfvGjf/Fo="
     },
     "restore-cursor": {
       "version": "1.0.1",
-      "from": "restore-cursor@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-1.0.1.tgz",
+      "integrity": "sha1-NGYfRohjJ/7SmRR5FSJS35LapUE="
     },
     "right-align": {
       "version": "0.1.3",
-      "from": "right-align@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/right-align/-/right-align-0.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/right-align/-/right-align-0.1.3.tgz",
+      "integrity": "sha1-YTObci/mo1FWiSENJOFMlhSGE+8="
     },
     "rimraf": {
       "version": "2.6.1",
-      "from": "rimraf@>=2.2.8 <3.0.0",
-      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.1.tgz"
+      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.1.tgz",
+      "integrity": "sha1-wjOOxkPfeht/5cVPqG9XQopV8z0="
     },
     "ripemd160": {
       "version": "0.2.0",
-      "from": "ripemd160@0.2.0",
-      "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-0.2.0.tgz",
+      "integrity": "sha1-K/GYveFnys+lHAqSjoS2i74XH84="
     },
     "rndm": {
       "version": "1.2.0",
-      "from": "rndm@1.2.0",
-      "resolved": "https://registry.npmjs.org/rndm/-/rndm-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/rndm/-/rndm-1.2.0.tgz",
+      "integrity": "sha1-8z/pz7Urv9UgqhgyO8ZdsRCht2w="
     },
     "rtl-css-js": {
       "version": "1.1.0",
-      "from": "rtl-css-js@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.1.0.tgz",
+      "integrity": "sha1-c5qMN9k+xt2safWtRVZWxgQ9b5U="
     },
     "run-async": {
       "version": "0.1.0",
-      "from": "run-async@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/run-async/-/run-async-0.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/run-async/-/run-async-0.1.0.tgz",
+      "integrity": "sha1-yK1KXhEGYeQCp9IbUw4AnyX444k="
     },
     "rx-lite": {
       "version": "3.1.2",
-      "from": "rx-lite@>=3.1.2 <4.0.0",
-      "resolved": "https://registry.npmjs.org/rx-lite/-/rx-lite-3.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/rx-lite/-/rx-lite-3.1.2.tgz",
+      "integrity": "sha1-Gc5QLKVyZl87ZHsQk5+X/RYV8QI="
     },
     "safe-buffer": {
       "version": "5.0.1",
-      "from": "safe-buffer@>=5.0.1 <6.0.0",
-      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+      "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
     },
     "samsam": {
       "version": "1.1.2",
-      "from": "samsam@1.1.2",
-      "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.1.2.tgz",
+      "integrity": "sha1-vsEf3IOp/aBjQBIQ5AF2wwJNFWc="
     },
     "sass-graph": {
       "version": "2.2.4",
-      "from": "sass-graph@>=2.1.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/sass-graph/-/sass-graph-2.2.4.tgz",
+      "integrity": "sha1-E/vWPNHK8JCLn9k0dq1DpR0eC0k=",
       "dependencies": {
         "camelcase": {
           "version": "3.0.0",
-          "from": "camelcase@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
+          "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
         },
         "yargs": {
           "version": "7.1.0",
-          "from": "yargs@>=7.0.0 <8.0.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-7.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-7.1.0.tgz",
+          "integrity": "sha1-a6MY6xaWFyf10oT46gA+jWFU0Mg="
         },
         "yargs-parser": {
           "version": "5.0.0",
-          "from": "yargs-parser@>=5.0.0 <6.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-5.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-5.0.0.tgz",
+          "integrity": "sha1-J17PDX/+Bcd+ZOfIbkzZS/DhIoo="
         }
       }
     },
     "sass-loader": {
       "version": "6.0.5",
-      "from": "sass-loader@>=6.0.3 <7.0.0",
       "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-6.0.5.tgz",
+      "integrity": "sha1-qEeRDzZEKqVsWYWHnVTrUZ4koyg=",
       "dependencies": {
         "async": {
           "version": "2.4.1",
-          "from": "async@>=2.1.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
+          "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c="
         },
         "loader-utils": {
           "version": "1.1.0",
-          "from": "loader-utils@>=1.0.1 <2.0.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
+          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
         }
       }
     },
     "sax": {
       "version": "0.5.2",
-      "from": "sax@0.5.2",
-      "resolved": "https://registry.npmjs.org/sax/-/sax-0.5.2.tgz"
+      "resolved": "https://registry.npmjs.org/sax/-/sax-0.5.2.tgz",
+      "integrity": "sha1-c1/6o5oc/4/7lZjwIjq9sDqfsuo="
     },
     "script-loader": {
       "version": "0.7.0",
-      "from": "script-loader@>=0.7.0 <0.8.0",
-      "resolved": "https://registry.npmjs.org/script-loader/-/script-loader-0.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/script-loader/-/script-loader-0.7.0.tgz",
+      "integrity": "sha1-aF3H5waeDe56kmdPDrxbD1W6pew="
     },
     "scss-tokenizer": {
       "version": "0.2.3",
-      "from": "scss-tokenizer@>=0.2.3 <0.3.0",
       "resolved": "https://registry.npmjs.org/scss-tokenizer/-/scss-tokenizer-0.2.3.tgz",
+      "integrity": "sha1-jrBtualyMzOCTT9VMGQRSYR85dE=",
       "dependencies": {
         "source-map": {
           "version": "0.4.4",
-          "from": "source-map@>=0.4.2 <0.5.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz"
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
+          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s="
         }
       }
     },
     "select-hose": {
       "version": "2.0.0",
-      "from": "select-hose@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz",
+      "integrity": "sha1-Yl2GWPhlr0Psliv8N2o3NZpJlMo="
     },
     "semver": {
       "version": "5.3.0",
-      "from": "semver@>=5.3.0 <5.4.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz",
+      "integrity": "sha1-myzl094C0XxgEq0yaqa00M9U+U8="
     },
     "semver-diff": {
       "version": "2.1.0",
-      "from": "semver-diff@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/semver-diff/-/semver-diff-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/semver-diff/-/semver-diff-2.1.0.tgz",
+      "integrity": "sha1-S7uEN8jTfksM8aaP1ybsbWRdbTY="
     },
     "send": {
       "version": "0.14.2",
-      "from": "send@0.14.2",
       "resolved": "https://registry.npmjs.org/send/-/send-0.14.2.tgz",
+      "integrity": "sha1-ObBDiz9RC+Xcb2Z6EfcWiTaM3u8=",
       "dependencies": {
         "debug": {
           "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
           "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo=",
           "dependencies": {
             "ms": {
               "version": "0.7.1",
-              "from": "ms@0.7.1",
-              "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+              "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+              "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
             }
           }
         },
         "http-errors": {
           "version": "1.5.1",
-          "from": "http-errors@>=1.5.1 <1.6.0",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.5.1.tgz"
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.5.1.tgz",
+          "integrity": "sha1-eIwNLB3iyBuebowBhDtrl+uSB1A="
         },
         "mime": {
           "version": "1.3.4",
-          "from": "mime@1.3.4",
-          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz"
+          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz",
+          "integrity": "sha1-EV+eO2s9rylZmDyzjxSaLUDrXVM="
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
+          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
         },
         "setprototypeof": {
           "version": "1.0.2",
-          "from": "setprototypeof@1.0.2",
-          "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.0.2.tgz",
+          "integrity": "sha1-gaVSFB7BBLiOic44MQOtXGZWTQg="
         }
       }
     },
     "sequencify": {
       "version": "0.0.7",
-      "from": "sequencify@>=0.0.7 <0.1.0",
-      "resolved": "https://registry.npmjs.org/sequencify/-/sequencify-0.0.7.tgz"
+      "resolved": "https://registry.npmjs.org/sequencify/-/sequencify-0.0.7.tgz",
+      "integrity": "sha1-kM/xnQLgcCf9dn9erT57ldHnOAw="
     },
     "serve-favicon": {
       "version": "2.3.2",
-      "from": "serve-favicon@>=2.3.0 <2.4.0",
       "resolved": "https://registry.npmjs.org/serve-favicon/-/serve-favicon-2.3.2.tgz",
+      "integrity": "sha1-3UGeJo3gEqtysxnTN/IQUBP5OB8=",
       "dependencies": {
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
+          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
         }
       }
     },
     "serve-index": {
       "version": "1.7.3",
-      "from": "serve-index@>=1.7.2 <1.8.0",
       "resolved": "https://registry.npmjs.org/serve-index/-/serve-index-1.7.3.tgz",
+      "integrity": "sha1-egV/xu4o3GP2RWbl+lexEahq7NI=",
       "dependencies": {
         "accepts": {
           "version": "1.2.13",
-          "from": "accepts@>=1.2.13 <1.3.0",
-          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.2.13.tgz"
+          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.2.13.tgz",
+          "integrity": "sha1-5fHzkoxtlf2WVYw27D2dDeSm7Oo="
         },
         "debug": {
           "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "http-errors": {
           "version": "1.3.1",
-          "from": "http-errors@>=1.3.1 <1.4.0",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
+          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
         },
         "ms": {
           "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         },
         "negotiator": {
           "version": "0.5.3",
-          "from": "negotiator@0.5.3",
-          "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.5.3.tgz"
+          "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.5.3.tgz",
+          "integrity": "sha1-Jp1cR2gQ7JLtvntsLygxY4T5p+g="
         }
       }
     },
     "serve-static": {
       "version": "1.11.2",
-      "from": "serve-static@>=1.11.2 <1.12.0",
-      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.11.2.tgz"
+      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.11.2.tgz",
+      "integrity": "sha1-LPmIm9RDWjIMw2iVyapXvWYuasc="
     },
     "set-blocking": {
       "version": "2.0.0",
-      "from": "set-blocking@>=2.0.0 <2.1.0",
-      "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
+      "integrity": "sha1-BF+XgtARrppoA93TgrJDkrPYkPc="
     },
     "set-immediate-shim": {
       "version": "1.0.1",
-      "from": "set-immediate-shim@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/set-immediate-shim/-/set-immediate-shim-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/set-immediate-shim/-/set-immediate-shim-1.0.1.tgz",
+      "integrity": "sha1-SysbJ+uAip+NzEgaWOXlb1mfP2E="
     },
     "setimmediate": {
       "version": "1.0.5",
-      "from": "setimmediate@>=1.0.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/setimmediate/-/setimmediate-1.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/setimmediate/-/setimmediate-1.0.5.tgz",
+      "integrity": "sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU="
     },
     "setprototypeof": {
       "version": "1.0.3",
-      "from": "setprototypeof@1.0.3",
-      "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.0.3.tgz",
+      "integrity": "sha1-ZlZ+NwQ+608E2RvWWMDL77VbjgQ="
     },
     "sha.js": {
       "version": "2.2.6",
-      "from": "sha.js@2.2.6",
-      "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.2.6.tgz"
+      "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.2.6.tgz",
+      "integrity": "sha1-F93t3F9yL7ZlAWWIlUYZd4ZzFbo="
     },
     "shallow-clone": {
       "version": "0.1.2",
-      "from": "shallow-clone@>=0.1.2 <0.2.0",
       "resolved": "https://registry.npmjs.org/shallow-clone/-/shallow-clone-0.1.2.tgz",
+      "integrity": "sha1-WQnodLp3EG1zrEFM/sH/yofZcGA=",
       "dependencies": {
         "kind-of": {
           "version": "2.0.1",
-          "from": "kind-of@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-2.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-2.0.1.tgz",
+          "integrity": "sha1-AY7HpM5+OobLkUG+UZ0kyPqpgbU="
         },
         "lazy-cache": {
           "version": "0.2.7",
-          "from": "lazy-cache@>=0.2.3 <0.3.0",
-          "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-0.2.7.tgz"
+          "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-0.2.7.tgz",
+          "integrity": "sha1-f+3fLctu23fRHvHRF6tf/fCrG2U="
         }
       }
     },
     "shellwords": {
       "version": "0.1.0",
-      "from": "shellwords@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/shellwords/-/shellwords-0.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/shellwords/-/shellwords-0.1.0.tgz",
+      "integrity": "sha1-Zq/Ue2oSky2Qccv9mKUueFzQuhQ="
     },
     "sigmund": {
       "version": "1.0.1",
-      "from": "sigmund@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/sigmund/-/sigmund-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/sigmund/-/sigmund-1.0.1.tgz",
+      "integrity": "sha1-P/IfGYytIXX587eBhT/ZTQ0ZtZA="
     },
     "signal-exit": {
       "version": "3.0.2",
-      "from": "signal-exit@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.2.tgz",
+      "integrity": "sha1-tf3AjxKH6hF4Yo5BXiUTK3NkbG0="
     },
     "sinon": {
       "version": "2.3.2",
-      "from": "sinon@2.3.2",
       "resolved": "https://registry.npmjs.org/sinon/-/sinon-2.3.2.tgz",
+      "integrity": "sha1-xDqcVw8yuqwRWVBc/u0ZEIhV34k=",
       "dependencies": {
         "formatio": {
           "version": "1.2.0",
-          "from": "formatio@1.2.0",
-          "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.2.0.tgz",
+          "integrity": "sha1-87IWfZBoxGmKjVH092CjmlTYGOs="
         },
         "lolex": {
           "version": "1.6.0",
-          "from": "lolex@>=1.6.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz"
+          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
+          "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
         },
         "path-to-regexp": {
           "version": "1.7.0",
-          "from": "path-to-regexp@>=1.7.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.7.0.tgz"
+          "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.7.0.tgz",
+          "integrity": "sha1-Wf3g9DW62suhA6hOnTvGTpa5k30="
         },
         "samsam": {
           "version": "1.2.1",
-          "from": "samsam@>=1.1.3 <2.0.0",
-          "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.2.1.tgz",
+          "integrity": "sha1-7dOQk6MYQ3DLhZJDsr3yVefY6mc="
         },
         "type-detect": {
           "version": "4.0.3",
-          "from": "type-detect@>=4.0.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.0.3.tgz"
+          "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.0.3.tgz",
+          "integrity": "sha1-Dj8mcLRAmbC0bChNE2p+9Jx0wuo="
         }
       }
     },
     "sinon-chai": {
       "version": "2.10.0",
-      "from": "sinon-chai@2.10.0",
-      "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.10.0.tgz"
+      "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.10.0.tgz",
+      "integrity": "sha1-arMAi7jK6ZKedE12ZXS0zzXzS1s="
     },
     "sliced": {
       "version": "1.0.1",
-      "from": "sliced@*",
-      "resolved": "https://registry.npmjs.org/sliced/-/sliced-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/sliced/-/sliced-1.0.1.tgz",
+      "integrity": "sha1-CzpmK10Ewxd7GSa+qCsD+Dei70E="
     },
     "slide": {
       "version": "1.1.6",
-      "from": "slide@>=1.1.5 <2.0.0",
-      "resolved": "https://registry.npmjs.org/slide/-/slide-1.1.6.tgz"
+      "resolved": "https://registry.npmjs.org/slide/-/slide-1.1.6.tgz",
+      "integrity": "sha1-VusCfWW00tzmyy4tMsTUr8nh1wc="
     },
     "sntp": {
       "version": "1.0.9",
-      "from": "sntp@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz"
+      "resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz",
+      "integrity": "sha1-ZUEYTMkK7qbG57NeJlkIJEPGYZg="
     },
     "socket.io": {
       "version": "1.7.4",
-      "from": "socket.io@>=1.4.5 <2.0.0",
       "resolved": "https://registry.npmjs.org/socket.io/-/socket.io-1.7.4.tgz",
+      "integrity": "sha1-L37O3DORvy1cc+KR/iM+bjTU3QA=",
       "dependencies": {
         "debug": {
           "version": "2.3.3",
-          "from": "debug@2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
+          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
+          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
         },
         "object-assign": {
           "version": "4.1.0",
-          "from": "object-assign@4.1.0",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.0.tgz",
+          "integrity": "sha1-ejs9DpgGPUP0wD8uiubNUahog6A="
         }
       }
     },
     "socket.io-adapter": {
       "version": "0.5.0",
-      "from": "socket.io-adapter@0.5.0",
       "resolved": "https://registry.npmjs.org/socket.io-adapter/-/socket.io-adapter-0.5.0.tgz",
+      "integrity": "sha1-y21LuL7IHhB4uZZ3+c7QBGBmu4s=",
       "dependencies": {
         "debug": {
           "version": "2.3.3",
-          "from": "debug@2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
+          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
+          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
         }
       }
     },
     "socket.io-client": {
       "version": "1.7.4",
-      "from": "socket.io-client@1.7.4",
       "resolved": "https://registry.npmjs.org/socket.io-client/-/socket.io-client-1.7.4.tgz",
+      "integrity": "sha1-7J+CA1btme9tNX8HVtZIcXvdQoE=",
       "dependencies": {
         "component-emitter": {
           "version": "1.2.1",
-          "from": "component-emitter@1.2.1",
-          "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz",
+          "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY="
         },
         "debug": {
           "version": "2.3.3",
-          "from": "debug@2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
+          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
+          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
         }
       }
     },
     "socket.io-parser": {
       "version": "2.3.1",
-      "from": "socket.io-parser@2.3.1",
       "resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-2.3.1.tgz",
+      "integrity": "sha1-3VMgJRA85Clpcya+/WQAX8/ltKA=",
       "dependencies": {
         "debug": {
           "version": "2.2.0",
-          "from": "debug@2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "ms": {
           "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         }
       }
     },
     "sockjs": {
       "version": "0.3.18",
-      "from": "sockjs@0.3.18",
       "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.18.tgz",
+      "integrity": "sha1-2bKJMWyn33dZXvKZ4HXw+TfrQgc=",
       "dependencies": {
         "uuid": {
           "version": "2.0.3",
-          "from": "uuid@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz"
+          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz",
+          "integrity": "sha1-Z+LoY3lyFVMN/zGOW/nc6/1Hsho="
         }
       }
     },
     "sockjs-client": {
       "version": "1.1.2",
-      "from": "sockjs-client@1.1.2",
       "resolved": "https://registry.npmjs.org/sockjs-client/-/sockjs-client-1.1.2.tgz",
+      "integrity": "sha1-8CEqhVDkyUaMjM6u79LjSTwDOtU=",
       "dependencies": {
         "faye-websocket": {
           "version": "0.11.1",
-          "from": "faye-websocket@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.1.tgz"
+          "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.1.tgz",
+          "integrity": "sha1-8O/hjE9W5PQK/H4Gxxn9XuYYjzg="
         }
       }
     },
     "sort-keys": {
       "version": "1.1.2",
-      "from": "sort-keys@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/sort-keys/-/sort-keys-1.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/sort-keys/-/sort-keys-1.1.2.tgz",
+      "integrity": "sha1-RBttTTRnmPG05J6JIK37oOVD+a0="
     },
     "source-list-map": {
       "version": "0.1.8",
-      "from": "source-list-map@>=0.1.7 <0.2.0",
-      "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-0.1.8.tgz"
+      "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-0.1.8.tgz",
+      "integrity": "sha1-xVCyq1Qn9rPyH1r+rYjE9Vh7IQY="
     },
     "source-map": {
       "version": "0.5.6",
-      "from": "source-map@>=0.5.3 <0.6.0",
-      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
+      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz",
+      "integrity": "sha1-dc449SvwczxafwwRjYEzSiu19BI="
     },
     "source-map-loader": {
       "version": "0.1.6",
-      "from": "source-map-loader@>=0.1.5 <0.2.0",
       "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.1.6.tgz",
+      "integrity": "sha1-wJkD2m1zueU7ftjuUkVZcFHpjpE=",
       "dependencies": {
         "async": {
           "version": "0.9.2",
-          "from": "async@>=0.9.0 <0.10.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz",
+          "integrity": "sha1-rqdNXmHB+JlhO/ZL2mbUx48v0X0="
         },
         "source-map": {
           "version": "0.1.43",
-          "from": "source-map@>=0.1.33 <0.2.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz",
+          "integrity": "sha1-wkvBRspRfBRx9drL4lcbK3+eM0Y="
         }
       }
     },
     "sparkles": {
       "version": "1.0.0",
-      "from": "sparkles@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/sparkles/-/sparkles-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/sparkles/-/sparkles-1.0.0.tgz",
+      "integrity": "sha1-Gsu/tZJDbRC76PeFt8xvgoFQEsM="
     },
     "spdx-correct": {
       "version": "1.0.2",
-      "from": "spdx-correct@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-1.0.2.tgz",
+      "integrity": "sha1-SzBz2TP/UfORLwOsVRlJikFQ20A="
     },
     "spdx-expression-parse": {
       "version": "1.0.4",
-      "from": "spdx-expression-parse@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-1.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-1.0.4.tgz",
+      "integrity": "sha1-m98vIOH0DtRH++JzJmGR/O1RYmw="
     },
     "spdx-license-ids": {
       "version": "1.2.2",
-      "from": "spdx-license-ids@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-1.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-1.2.2.tgz",
+      "integrity": "sha1-yd96NCRZSt5r0RkA1ZZpbcBrrFc="
     },
     "spdy": {
       "version": "3.4.7",
-      "from": "spdy@>=3.4.1 <4.0.0",
       "resolved": "https://registry.npmjs.org/spdy/-/spdy-3.4.7.tgz",
+      "integrity": "sha1-Qv9B7OXMD5mjpsKKq7c/XDsDrLw=",
       "dependencies": {
         "debug": {
           "version": "2.6.8",
-          "from": "debug@>=2.6.8 <3.0.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
+          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
         }
       }
     },
     "spdy-transport": {
       "version": "2.0.20",
-      "from": "spdy-transport@>=2.0.18 <3.0.0",
       "resolved": "https://registry.npmjs.org/spdy-transport/-/spdy-transport-2.0.20.tgz",
+      "integrity": "sha1-c15yBUxIayNU/onnAiVgBKOazk0=",
       "dependencies": {
         "debug": {
           "version": "2.6.8",
-          "from": "debug@>=2.6.8 <3.0.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
+          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.2.9 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "split": {
       "version": "0.2.10",
-      "from": "split@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/split/-/split-0.2.10.tgz"
+      "resolved": "https://registry.npmjs.org/split/-/split-0.2.10.tgz",
+      "integrity": "sha1-Zwl8YB1pfOE2j0GPBs0gHPBSGlc="
     },
     "sprintf-js": {
-      "version": "1.1.0",
-      "from": "sprintf-js@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.1.0.tgz"
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.1.1.tgz",
+      "integrity": "sha1-Nr54Mgr+WAH2zqPueLblqrlA6gw="
     },
     "sshpk": {
       "version": "1.13.0",
-      "from": "sshpk@>=1.7.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.13.0.tgz",
+      "integrity": "sha1-/yo+T9BEl1Vf7Zezmg/YL6+zozw=",
       "dependencies": {
         "assert-plus": {
           "version": "1.0.0",
-          "from": "assert-plus@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
         }
       }
     },
     "statuses": {
       "version": "1.3.1",
-      "from": "statuses@>=1.3.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.3.1.tgz"
+      "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.3.1.tgz",
+      "integrity": "sha1-+vUbnrdKrvOzrPStX2Gr8ky3uT4="
     },
     "stdout-stream": {
       "version": "1.4.0",
-      "from": "stdout-stream@>=1.4.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/stdout-stream/-/stdout-stream-1.4.0.tgz",
+      "integrity": "sha1-osfIWH5U2UJ+qe2zrD8s1SLfN4s=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "stream-browserify": {
       "version": "1.0.0",
-      "from": "stream-browserify@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-1.0.0.tgz",
+      "integrity": "sha1-v5tKv7QrJ011FHnkTg/yZWtvEZM="
     },
     "stream-combiner": {
       "version": "0.0.4",
-      "from": "stream-combiner@>=0.0.3 <0.1.0",
-      "resolved": "https://registry.npmjs.org/stream-combiner/-/stream-combiner-0.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/stream-combiner/-/stream-combiner-0.0.4.tgz",
+      "integrity": "sha1-TV5DPBhSYd3mI8o/RMWGvPXErRQ="
     },
     "stream-consume": {
       "version": "0.1.0",
-      "from": "stream-consume@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/stream-consume/-/stream-consume-0.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/stream-consume/-/stream-consume-0.1.0.tgz",
+      "integrity": "sha1-pB6tGm1ggc63n2WwYZAbbY89HQ8="
     },
     "stream-counter": {
       "version": "0.2.0",
-      "from": "stream-counter@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/stream-counter/-/stream-counter-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/stream-counter/-/stream-counter-0.2.0.tgz",
+      "integrity": "sha1-3tJmVWMZyLDiIoErnPOyb6fZR94="
     },
     "stream-http": {
       "version": "2.7.1",
-      "from": "stream-http@>=2.3.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/stream-http/-/stream-http-2.7.1.tgz",
+      "integrity": "sha1-VGpRdBrVprB+njGwsQRBqRffUoo=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.2.6 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "stream-shift": {
       "version": "1.0.0",
-      "from": "stream-shift@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/stream-shift/-/stream-shift-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/stream-shift/-/stream-shift-1.0.0.tgz",
+      "integrity": "sha1-1cdSgl5TZ+eG944Y5EXqIjoVWVI="
     },
     "strict-uri-encode": {
       "version": "1.1.0",
-      "from": "strict-uri-encode@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz",
+      "integrity": "sha1-J5siXfHVgrH1TmWt3UNS4Y+qBxM="
     },
     "string_decoder": {
       "version": "0.10.31",
-      "from": "string_decoder@>=0.10.0 <0.11.0",
-      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
+      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+      "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
     },
     "string-hash": {
       "version": "1.1.3",
-      "from": "string-hash@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/string-hash/-/string-hash-1.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/string-hash/-/string-hash-1.1.3.tgz",
+      "integrity": "sha1-6Kr8CsGFW0Zmkp7X3RJ1311sgRs="
     },
     "string-width": {
       "version": "1.0.2",
-      "from": "string-width@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
+      "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
     },
     "string.prototype.codepointat": {
       "version": "0.2.0",
-      "from": "string.prototype.codepointat@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/string.prototype.codepointat/-/string.prototype.codepointat-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/string.prototype.codepointat/-/string.prototype.codepointat-0.2.0.tgz",
+      "integrity": "sha1-aybpvTr8qnvjtCabUm3huCAArHg="
     },
     "stringify-object": {
       "version": "3.2.0",
-      "from": "stringify-object@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/stringify-object/-/stringify-object-3.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/stringify-object/-/stringify-object-3.2.0.tgz",
+      "integrity": "sha1-lDcKE15BvASDWIE7+ZSB8TFcaqY="
     },
     "stringstream": {
       "version": "0.0.5",
-      "from": "stringstream@>=0.0.4 <0.1.0",
-      "resolved": "https://registry.npmjs.org/stringstream/-/stringstream-0.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/stringstream/-/stringstream-0.0.5.tgz",
+      "integrity": "sha1-TkhM1N5aC7vuGORjB3EKioFiGHg="
     },
     "strip-ansi": {
       "version": "3.0.1",
-      "from": "strip-ansi@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
+      "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8="
     },
     "strip-bom": {
       "version": "1.0.0",
-      "from": "strip-bom@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-1.0.0.tgz",
+      "integrity": "sha1-hbiGLzhEtabV7IRnqTWYFzo295Q="
     },
     "strip-bom-stream": {
       "version": "1.0.0",
-      "from": "strip-bom-stream@>=1.0.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/strip-bom-stream/-/strip-bom-stream-1.0.0.tgz",
+      "integrity": "sha1-5xRDmFd9Uaa+0PoZlPoF9D/ZiO4=",
       "dependencies": {
         "strip-bom": {
           "version": "2.0.0",
-          "from": "strip-bom@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
         }
       }
     },
     "strip-eof": {
       "version": "1.0.0",
-      "from": "strip-eof@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz",
+      "integrity": "sha1-u0P/VZim6wXYm1n80SnJgzE2Br8="
     },
     "strip-indent": {
       "version": "1.0.1",
-      "from": "strip-indent@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-1.0.1.tgz",
+      "integrity": "sha1-DHlipq3vp7vUrDZkYKY4VSrhoKI="
     },
     "strip-json-comments": {
       "version": "2.0.1",
-      "from": "strip-json-comments@>=2.0.1 <2.1.0",
-      "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz",
+      "integrity": "sha1-PFMZQukIwml8DsNEhYwobHygpgo="
     },
     "style-loader": {
       "version": "0.17.0",
-      "from": "style-loader@>=0.17.0 <0.18.0",
       "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.17.0.tgz",
+      "integrity": "sha1-6CVLzNt690vVgnTjYQe01atN8xA=",
       "dependencies": {
         "loader-utils": {
           "version": "1.1.0",
-          "from": "loader-utils@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
+          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
         }
       }
     },
     "sudo": {
       "version": "1.0.3",
-      "from": "sudo@>=1.0.3 <1.1.0",
-      "resolved": "https://registry.npmjs.org/sudo/-/sudo-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/sudo/-/sudo-1.0.3.tgz",
+      "integrity": "sha1-zPKGaRIPi3T4K4Rt/38clRIO/yA="
     },
     "supports-color": {
       "version": "2.0.0",
-      "from": "supports-color@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+      "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
     },
     "svgo": {
       "version": "0.7.2",
-      "from": "svgo@>=0.7.0 <0.8.0",
       "resolved": "https://registry.npmjs.org/svgo/-/svgo-0.7.2.tgz",
+      "integrity": "sha1-n1dyQTlSE1xv779Ar+ak+qiLS7U=",
       "dependencies": {
         "esprima": {
           "version": "2.7.3",
-          "from": "esprima@>=2.6.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz"
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz",
+          "integrity": "sha1-luO3DVd59q1JzQMmc9HDEnZ7pYE="
         },
         "js-yaml": {
           "version": "3.7.0",
-          "from": "js-yaml@>=3.7.0 <3.8.0",
-          "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.7.0.tgz"
+          "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.7.0.tgz",
+          "integrity": "sha1-XJZ93YN6m/3KXy3oQlOr6KHAO4A="
         },
         "sax": {
           "version": "1.2.2",
-          "from": "sax@>=1.2.1 <1.3.0",
-          "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.2.tgz"
+          "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.2.tgz",
+          "integrity": "sha1-/YYxojvHgmvvXYcb24c3jJVkeCg="
         }
       }
     },
     "symbol": {
       "version": "0.2.3",
-      "from": "symbol@>=0.2.1 <0.3.0",
-      "resolved": "https://registry.npmjs.org/symbol/-/symbol-0.2.3.tgz"
+      "resolved": "https://registry.npmjs.org/symbol/-/symbol-0.2.3.tgz",
+      "integrity": "sha1-O5hzuKkB5Hxu/iFSajrDcu8ou8c="
     },
     "tapable": {
       "version": "0.1.10",
-      "from": "tapable@>=0.1.8 <0.2.0",
-      "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.1.10.tgz"
+      "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.1.10.tgz",
+      "integrity": "sha1-KcNXB8K3DlDQdIK10gLo7URtr9Q="
     },
     "tar": {
       "version": "2.2.1",
-      "from": "tar@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/tar/-/tar-2.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/tar/-/tar-2.2.1.tgz",
+      "integrity": "sha1-jk0qJWwOIYXGsYrWlK7JaLg8sdE="
     },
     "term-size": {
       "version": "0.1.1",
-      "from": "term-size@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/term-size/-/term-size-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/term-size/-/term-size-0.1.1.tgz",
+      "integrity": "sha1-hzYLljlsq1dgljcUzaDQy+7K2co="
     },
     "ternary-stream": {
       "version": "2.0.1",
-      "from": "ternary-stream@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/ternary-stream/-/ternary-stream-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/ternary-stream/-/ternary-stream-2.0.1.tgz",
+      "integrity": "sha1-Bk5Im0tb9gumpre8fy9cJ07Pgmk="
     },
     "text-encoding": {
       "version": "0.6.4",
-      "from": "text-encoding@0.6.4",
-      "resolved": "https://registry.npmjs.org/text-encoding/-/text-encoding-0.6.4.tgz"
+      "resolved": "https://registry.npmjs.org/text-encoding/-/text-encoding-0.6.4.tgz",
+      "integrity": "sha1-45mpgiV6J22uQou5KEXLcb3CbRk="
     },
     "textextensions": {
       "version": "1.0.2",
-      "from": "textextensions@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/textextensions/-/textextensions-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/textextensions/-/textextensions-1.0.2.tgz",
+      "integrity": "sha1-ZUhjk+4fK7A5pgy7oFsLaL2VAdI="
     },
     "throttleit": {
       "version": "1.0.0",
-      "from": "throttleit@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/throttleit/-/throttleit-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/throttleit/-/throttleit-1.0.0.tgz",
+      "integrity": "sha1-nnhYNtr0Z0MUWlmEtiaNgoUorGw="
     },
     "through": {
       "version": "2.3.8",
-      "from": "through@>=2.3.1 <2.4.0",
-      "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz"
+      "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
+      "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU="
     },
     "through2": {
       "version": "2.0.3",
-      "from": "through2@>=2.0.1 <2.1.0",
       "resolved": "https://registry.npmjs.org/through2/-/through2-2.0.3.tgz",
+      "integrity": "sha1-AARWmzfHx0ujnEPzzteNGtlBQL4=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.1.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "through2-concurrent": {
       "version": "1.1.1",
-      "from": "through2-concurrent@1.1.1",
-      "resolved": "https://registry.npmjs.org/through2-concurrent/-/through2-concurrent-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/through2-concurrent/-/through2-concurrent-1.1.1.tgz",
+      "integrity": "sha1-EctOpMnjG8puTB5tukjRxyjDUks="
     },
     "through2-filter": {
       "version": "2.0.0",
-      "from": "through2-filter@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/through2-filter/-/through2-filter-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/through2-filter/-/through2-filter-2.0.0.tgz",
+      "integrity": "sha1-YLxVoNrLdghdsfna6Zq0P4PWIuw="
     },
     "tildify": {
       "version": "1.2.0",
-      "from": "tildify@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/tildify/-/tildify-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/tildify/-/tildify-1.2.0.tgz",
+      "integrity": "sha1-3OwD9V3Km3qj5bBPIYF+tW5jWIo="
     },
     "time-stamp": {
       "version": "1.1.0",
-      "from": "time-stamp@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/time-stamp/-/time-stamp-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/time-stamp/-/time-stamp-1.1.0.tgz",
+      "integrity": "sha1-dkpaEa9QVhkhsTPztE5hhofg9cM="
     },
     "timed-out": {
       "version": "3.1.3",
-      "from": "timed-out@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-3.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-3.1.3.tgz",
+      "integrity": "sha1-lYYL/MXHbCd/j4Mm/Q9bLiDrohc="
     },
     "timers-browserify": {
       "version": "1.4.2",
-      "from": "timers-browserify@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-1.4.2.tgz"
+      "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-1.4.2.tgz",
+      "integrity": "sha1-ycWLV1voQHN1y14kYtrO50NZ9B0="
     },
     "tiny-lr": {
       "version": "0.2.1",
-      "from": "tiny-lr@>=0.2.1 <0.3.0",
       "resolved": "https://registry.npmjs.org/tiny-lr/-/tiny-lr-0.2.1.tgz",
+      "integrity": "sha1-s/26gC5dVqM8L28QeUsy5Hescp0=",
       "dependencies": {
         "body-parser": {
           "version": "1.14.2",
-          "from": "body-parser@>=1.14.0 <1.15.0",
           "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.14.2.tgz",
+          "integrity": "sha1-EBXLH+LEQ4WCWVgdtTMy+NDPUPk=",
           "dependencies": {
             "qs": {
               "version": "5.2.0",
-              "from": "qs@5.2.0",
-              "resolved": "https://registry.npmjs.org/qs/-/qs-5.2.0.tgz"
+              "resolved": "https://registry.npmjs.org/qs/-/qs-5.2.0.tgz",
+              "integrity": "sha1-qfMRQq9GjLcrJbMBNrokVoNJFr4="
             }
           }
         },
         "bytes": {
           "version": "2.2.0",
-          "from": "bytes@2.2.0",
-          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.2.0.tgz",
+          "integrity": "sha1-/TVGSkA/b5EXwt42Cez/nK4ABYg="
         },
         "debug": {
           "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "http-errors": {
           "version": "1.3.1",
-          "from": "http-errors@>=1.3.1 <1.4.0",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
+          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
         },
         "iconv-lite": {
           "version": "0.4.13",
-          "from": "iconv-lite@0.4.13",
-          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.13.tgz"
+          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.13.tgz",
+          "integrity": "sha1-H4irpKsLFQjoMSrMOTRfNumS4vI="
         },
         "ms": {
           "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         },
         "qs": {
           "version": "5.1.0",
-          "from": "qs@>=5.1.0 <5.2.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-5.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/qs/-/qs-5.1.0.tgz",
+          "integrity": "sha1-TZMuXH6kEcynajEtOaYGIA/VDNk="
         },
         "raw-body": {
           "version": "2.1.7",
-          "from": "raw-body@>=2.1.5 <2.2.0",
           "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.1.7.tgz",
+          "integrity": "sha1-rf6s4uT7MJgFgBTQjActzFl1h3Q=",
           "dependencies": {
             "bytes": {
               "version": "2.4.0",
-              "from": "bytes@2.4.0",
-              "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz"
+              "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz",
+              "integrity": "sha1-fZcZb51br39pNeJZhVSe3SpsIzk="
             }
           }
         }
@@ -8916,85 +8747,85 @@
     },
     "tmp": {
       "version": "0.0.31",
-      "from": "tmp@>=0.0.0 <0.1.0",
-      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.31.tgz"
+      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.31.tgz",
+      "integrity": "sha1-jzirlDjhcxXl29izZX6L+yd65Kc="
     },
     "to-absolute-glob": {
       "version": "0.1.1",
-      "from": "to-absolute-glob@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/to-absolute-glob/-/to-absolute-glob-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/to-absolute-glob/-/to-absolute-glob-0.1.1.tgz",
+      "integrity": "sha1-HN+kcqnvUMI57maZm2YsoOs5k38="
     },
     "to-array": {
       "version": "0.1.4",
-      "from": "to-array@0.1.4",
-      "resolved": "https://registry.npmjs.org/to-array/-/to-array-0.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/to-array/-/to-array-0.1.4.tgz",
+      "integrity": "sha1-F+bBH3PdTz10zaek/zI46a2b+JA="
     },
     "to-arraybuffer": {
       "version": "1.0.1",
-      "from": "to-arraybuffer@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/to-arraybuffer/-/to-arraybuffer-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/to-arraybuffer/-/to-arraybuffer-1.0.1.tgz",
+      "integrity": "sha1-fSKbH8xjfkZsoIEYCDanqr/4P0M="
     },
     "to-iso-string": {
       "version": "0.0.2",
-      "from": "to-iso-string@0.0.2",
-      "resolved": "https://registry.npmjs.org/to-iso-string/-/to-iso-string-0.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/to-iso-string/-/to-iso-string-0.0.2.tgz",
+      "integrity": "sha1-TcGeZk38y+Jb2NtQiwDG2hWCVdE="
     },
     "tough-cookie": {
       "version": "2.3.2",
-      "from": "tough-cookie@>=2.3.0 <2.4.0",
-      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.2.tgz"
+      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.2.tgz",
+      "integrity": "sha1-8IH3bkyFcg5sN6X6ztc3FQ2EByo="
     },
     "trim-newlines": {
       "version": "1.0.0",
-      "from": "trim-newlines@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/trim-newlines/-/trim-newlines-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/trim-newlines/-/trim-newlines-1.0.0.tgz",
+      "integrity": "sha1-WIeWa7WCpFA6QetST301ARgVphM="
     },
     "try-json-parse": {
       "version": "0.1.1",
-      "from": "try-json-parse@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/try-json-parse/-/try-json-parse-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/try-json-parse/-/try-json-parse-0.1.1.tgz",
+      "integrity": "sha1-jbAWIuh35RuDFAyu58gIZK05DII="
     },
     "ts-loader": {
       "version": "2.1.0",
-      "from": "ts-loader@>=2.0.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/ts-loader/-/ts-loader-2.1.0.tgz",
+      "integrity": "sha1-Wo78xccsBvxJ1putachWF8YZT3c=",
       "dependencies": {
         "enhanced-resolve": {
           "version": "3.1.0",
-          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz",
+          "integrity": "sha1-n0tib1dyRe3PSyrYPYbhf09CHew="
         },
         "loader-utils": {
           "version": "1.1.0",
-          "from": "loader-utils@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
+          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
         },
         "tapable": {
           "version": "0.2.6",
-          "from": "tapable@>=0.2.5 <0.3.0",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz",
+          "integrity": "sha1-IGvo4YiGC1FEJTdebxrom/sB/Y0="
         }
       }
     },
     "tslib": {
       "version": "1.7.1",
-      "from": "tslib@>=1.6.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.7.1.tgz"
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.7.1.tgz",
+      "integrity": "sha1-vIAEFkaRkjp5/oN4u+s9ogF1OOw="
     },
     "tslint": {
       "version": "4.0.2",
-      "from": "tslint@4.0.2",
       "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.0.2.tgz",
+      "integrity": "sha1-1D8kwMH4Jt5/Ogl7t4CKi0Ml/qw=",
       "dependencies": {
         "findup-sync": {
           "version": "0.3.0",
-          "from": "findup-sync@>=0.3.0 <0.4.0",
           "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.3.0.tgz",
+          "integrity": "sha1-N5MKpdgWt3fANEXhlmzGeQpMCxY=",
           "dependencies": {
             "glob": {
               "version": "5.0.15",
-              "from": "glob@>=5.0.0 <5.1.0",
-              "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
+              "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
+              "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
             }
           }
         }
@@ -9002,968 +8833,968 @@
     },
     "tslint-microsoft-contrib": {
       "version": "4.0.0",
-      "from": "tslint-microsoft-contrib@4.0.0",
-      "resolved": "https://registry.npmjs.org/tslint-microsoft-contrib/-/tslint-microsoft-contrib-4.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/tslint-microsoft-contrib/-/tslint-microsoft-contrib-4.0.0.tgz",
+      "integrity": "sha1-fgClbBQXJR0/kaiA78xDNhpp+yo="
     },
     "tsscmp": {
       "version": "1.0.5",
-      "from": "tsscmp@1.0.5",
-      "resolved": "https://registry.npmjs.org/tsscmp/-/tsscmp-1.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/tsscmp/-/tsscmp-1.0.5.tgz",
+      "integrity": "sha1-fcSjOvcVgatDN9qR2FylQn69mpc="
     },
     "tsutils": {
       "version": "1.9.1",
-      "from": "tsutils@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-1.9.1.tgz"
+      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-1.9.1.tgz",
+      "integrity": "sha1-ufmrROVa+WgYMdXyjQrur1x1DLA="
     },
     "tty-browserify": {
       "version": "0.0.0",
-      "from": "tty-browserify@0.0.0",
-      "resolved": "https://registry.npmjs.org/tty-browserify/-/tty-browserify-0.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/tty-browserify/-/tty-browserify-0.0.0.tgz",
+      "integrity": "sha1-oVe6QC2iTpv5V/mqadUk7tQpAaY="
     },
     "tunnel-agent": {
       "version": "0.6.0",
-      "from": "tunnel-agent@>=0.6.0 <0.7.0",
-      "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.6.0.tgz",
+      "integrity": "sha1-J6XeoGs2sEoKmWZ3SykIaPD8QP0="
     },
     "tweetnacl": {
       "version": "0.14.5",
-      "from": "tweetnacl@>=0.14.0 <0.15.0",
       "resolved": "https://registry.npmjs.org/tweetnacl/-/tweetnacl-0.14.5.tgz",
+      "integrity": "sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q=",
       "optional": true
     },
     "type-check": {
       "version": "0.3.2",
-      "from": "type-check@>=0.3.2 <0.4.0",
-      "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.3.2.tgz"
+      "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.3.2.tgz",
+      "integrity": "sha1-WITKtRLPHTVeP7eE8wgEsrUg23I="
     },
     "type-detect": {
       "version": "1.0.0",
-      "from": "type-detect@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-1.0.0.tgz",
+      "integrity": "sha1-diIXzAbbJY7EiQihKY6LlRIejqI="
     },
     "type-is": {
       "version": "1.6.15",
-      "from": "type-is@>=1.6.15 <1.7.0",
-      "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.15.tgz"
+      "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.15.tgz",
+      "integrity": "sha1-yrEPtJCeRByChC6v4a1kbIGARBA="
     },
     "typedarray": {
       "version": "0.0.6",
-      "from": "typedarray@>=0.0.5 <0.1.0",
-      "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz"
+      "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
+      "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
     },
     "typescript": {
       "version": "2.3.3",
-      "from": "typescript@2.3.3",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.3.3.tgz"
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.3.3.tgz",
+      "integrity": "sha1-ljnzw7QBSOjKl/4IpR3RiRu2viI="
     },
     "ua-parser-js": {
       "version": "0.7.12",
-      "from": "ua-parser-js@>=0.7.9 <0.8.0",
-      "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.12.tgz"
+      "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.12.tgz",
+      "integrity": "sha1-BMgamb3V3FImPqKdJMa/jUgYpLs="
     },
     "uglify-js": {
       "version": "2.8.27",
-      "from": "uglify-js@>=2.6.0 <3.0.0",
       "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.8.27.tgz",
+      "integrity": "sha1-R3h/kSsPJC5bmENDvo416V9pTJw=",
       "dependencies": {
         "camelcase": {
           "version": "1.2.1",
-          "from": "camelcase@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
+          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
         },
         "cliui": {
           "version": "2.1.0",
-          "from": "cliui@>=2.1.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
+          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE="
         },
         "window-size": {
           "version": "0.1.0",
-          "from": "window-size@0.1.0",
-          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
+          "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
         },
         "wordwrap": {
           "version": "0.0.2",
-          "from": "wordwrap@0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
+          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
         },
         "yargs": {
           "version": "3.10.0",
-          "from": "yargs@>=3.10.0 <3.11.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz"
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
+          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
         }
       }
     },
     "uglify-to-browserify": {
       "version": "1.0.2",
-      "from": "uglify-to-browserify@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/uglify-to-browserify/-/uglify-to-browserify-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/uglify-to-browserify/-/uglify-to-browserify-1.0.2.tgz",
+      "integrity": "sha1-bgkk1r2mta/jSeOabWMoUKD4grc="
     },
     "uglifyjs-webpack-plugin": {
       "version": "0.4.3",
-      "from": "uglifyjs-webpack-plugin@>=0.4.3 <0.5.0",
-      "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-0.4.3.tgz"
+      "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-0.4.3.tgz",
+      "integrity": "sha1-pnKn1mVflN+n4JZw1IAw83zJMmc="
     },
     "uid-safe": {
       "version": "2.1.4",
-      "from": "uid-safe@2.1.4",
-      "resolved": "https://registry.npmjs.org/uid-safe/-/uid-safe-2.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/uid-safe/-/uid-safe-2.1.4.tgz",
+      "integrity": "sha1-Otbzg2jG1MjHXsF2I/t5qh0HHYE="
     },
     "ultron": {
       "version": "1.0.2",
-      "from": "ultron@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.0.2.tgz",
+      "integrity": "sha1-rOEWq1V80Zc4ak6I9GhTeMiy5Po="
     },
     "unc-path-regex": {
       "version": "0.1.2",
-      "from": "unc-path-regex@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/unc-path-regex/-/unc-path-regex-0.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/unc-path-regex/-/unc-path-regex-0.1.2.tgz",
+      "integrity": "sha1-5z3T17DXxe2G+6xrCufYxqadUPo="
     },
     "underscore": {
       "version": "1.4.4",
-      "from": "underscore@>=1.4.4 <1.5.0",
-      "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.4.4.tgz"
+      "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.4.4.tgz",
+      "integrity": "sha1-YaajIBBiKvoHljvzJSA88SI51gQ="
     },
     "underscore.string": {
       "version": "3.3.4",
-      "from": "underscore.string@>=3.3.4 <4.0.0",
-      "resolved": "https://registry.npmjs.org/underscore.string/-/underscore.string-3.3.4.tgz"
+      "resolved": "https://registry.npmjs.org/underscore.string/-/underscore.string-3.3.4.tgz",
+      "integrity": "sha1-LCo/n4PmR2L9xF5s6sZRQoZCE9s="
     },
     "uniq": {
       "version": "1.0.1",
-      "from": "uniq@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/uniq/-/uniq-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/uniq/-/uniq-1.0.1.tgz",
+      "integrity": "sha1-sxxa6CVIRKOoKBVBzisEuGWnNP8="
     },
     "uniqid": {
       "version": "4.1.1",
-      "from": "uniqid@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/uniqid/-/uniqid-4.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/uniqid/-/uniqid-4.1.1.tgz",
+      "integrity": "sha1-iSIN32t1GuUrX3JISGNShZa7hME="
     },
     "uniqs": {
       "version": "2.0.0",
-      "from": "uniqs@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/uniqs/-/uniqs-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/uniqs/-/uniqs-2.0.0.tgz",
+      "integrity": "sha1-/+3ks2slKQaW5uFl1KWe25mOawI="
     },
     "unique-stream": {
       "version": "1.0.0",
-      "from": "unique-stream@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-1.0.0.tgz",
+      "integrity": "sha1-1ZpKdUJ0R9mqbJHnAmP40mpLEEs="
     },
     "unique-string": {
       "version": "1.0.0",
-      "from": "unique-string@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/unique-string/-/unique-string-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/unique-string/-/unique-string-1.0.0.tgz",
+      "integrity": "sha1-nhBXzKhRq7kzmPizOuGHuZyuwRo="
     },
     "unpipe": {
       "version": "1.0.0",
-      "from": "unpipe@1.0.0",
-      "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz",
+      "integrity": "sha1-sr9O6FFKrmFltIF4KdIbLvSZBOw="
     },
     "unzip-response": {
       "version": "1.0.2",
-      "from": "unzip-response@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-1.0.2.tgz",
+      "integrity": "sha1-uYTwh3/AqJwsdzzB73tbIytbBv4="
     },
     "update-notifier": {
       "version": "1.0.3",
-      "from": "update-notifier@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-1.0.3.tgz",
+      "integrity": "sha1-j5LFFUgr1oMbfJMBPnD4dVLHz1o="
     },
     "upper-case": {
       "version": "1.1.3",
-      "from": "upper-case@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/upper-case/-/upper-case-1.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/upper-case/-/upper-case-1.1.3.tgz",
+      "integrity": "sha1-9rRQHC7EzdJrp4vnIilh3ndiFZg="
     },
     "url": {
       "version": "0.10.3",
-      "from": "url@>=0.10.1 <0.11.0",
       "resolved": "https://registry.npmjs.org/url/-/url-0.10.3.tgz",
+      "integrity": "sha1-Ah5NnHcF8hu/N9A861h2dAJ3TGQ=",
       "dependencies": {
         "punycode": {
           "version": "1.3.2",
-          "from": "punycode@1.3.2",
-          "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
+          "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
+          "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
         }
       }
     },
     "url-parse": {
       "version": "1.1.9",
-      "from": "url-parse@>=1.1.1 <2.0.0",
       "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.1.9.tgz",
+      "integrity": "sha1-xn8dd11R8KGJEd17P/rSe7nlvRk=",
       "dependencies": {
         "querystringify": {
           "version": "1.0.0",
-          "from": "querystringify@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-1.0.0.tgz",
+          "integrity": "sha1-YoYkIRLFtxL6ZU5SZlK/ahP/Bcs="
         }
       }
     },
     "url-parse-lax": {
       "version": "1.0.0",
-      "from": "url-parse-lax@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/url-parse-lax/-/url-parse-lax-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/url-parse-lax/-/url-parse-lax-1.0.0.tgz",
+      "integrity": "sha1-evjzA2Rem9eaJy56FKxovAYJ2nM="
     },
     "user-home": {
       "version": "1.1.1",
-      "from": "user-home@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/user-home/-/user-home-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/user-home/-/user-home-1.1.1.tgz",
+      "integrity": "sha1-K1viOjK2Onyd640PKNSFcko98ZA="
     },
     "useragent": {
       "version": "2.1.13",
-      "from": "useragent@>=2.1.6 <3.0.0",
       "resolved": "https://registry.npmjs.org/useragent/-/useragent-2.1.13.tgz",
+      "integrity": "sha1-u6Q+iqJNXOuDwpN0c+EC4h33TBA=",
       "dependencies": {
         "lru-cache": {
           "version": "2.2.4",
-          "from": "lru-cache@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.2.4.tgz"
+          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.2.4.tgz",
+          "integrity": "sha1-bGWGGb7PFAMdDQtZSxYELOTcBj0="
         }
       }
     },
     "util": {
       "version": "0.10.3",
-      "from": "util@>=0.10.3 <1.0.0",
       "resolved": "https://registry.npmjs.org/util/-/util-0.10.3.tgz",
+      "integrity": "sha1-evsa/lCAUkZInj23/g7TeTNqwPk=",
       "dependencies": {
         "inherits": {
           "version": "2.0.1",
-          "from": "inherits@2.0.1",
-          "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.1.tgz",
+          "integrity": "sha1-sX0I0ya0Qj5Wjv9xn5GwscvfafE="
         }
       }
     },
     "util-deprecate": {
       "version": "1.0.2",
-      "from": "util-deprecate@>=1.0.1 <1.1.0",
-      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
+      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8="
     },
     "utils-merge": {
       "version": "1.0.0",
-      "from": "utils-merge@1.0.0",
-      "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.0.tgz",
+      "integrity": "sha1-ApT7kiu5N1FTVBxPcJYjHyh8ivg="
     },
     "uuid": {
       "version": "3.0.1",
-      "from": "uuid@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.0.1.tgz",
+      "integrity": "sha1-ZUS7ot/ajBzxfmKaOjBeK7H+5sE="
     },
     "v8flags": {
       "version": "2.1.1",
-      "from": "v8flags@>=2.0.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/v8flags/-/v8flags-2.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/v8flags/-/v8flags-2.1.1.tgz",
+      "integrity": "sha1-qrGh+jDUX4jdMhFIh1rALAtV5bQ="
     },
     "vali-date": {
       "version": "1.0.0",
-      "from": "vali-date@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/vali-date/-/vali-date-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/vali-date/-/vali-date-1.0.0.tgz",
+      "integrity": "sha1-G5BKWWCfsyjvB4E4Qgk09rhnCaY="
     },
     "validate-npm-package-license": {
       "version": "3.0.1",
-      "from": "validate-npm-package-license@>=3.0.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.1.tgz",
+      "integrity": "sha1-KAS6vnEq0zeUWaz74kdGqywwP7w="
     },
     "validator": {
       "version": "5.7.0",
-      "from": "validator@>=5.0.0 <6.0.0",
-      "resolved": "https://registry.npmjs.org/validator/-/validator-5.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/validator/-/validator-5.7.0.tgz",
+      "integrity": "sha1-eoelgUa2laxIYHEUHAxJ1n2gXlw="
     },
     "vary": {
       "version": "1.1.1",
-      "from": "vary@>=1.1.0 <1.2.0",
-      "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.1.tgz",
+      "integrity": "sha1-Z1Neu2lMHVIldFeYRmUyP1h+jTc="
     },
     "vendors": {
       "version": "1.0.1",
-      "from": "vendors@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/vendors/-/vendors-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/vendors/-/vendors-1.0.1.tgz",
+      "integrity": "sha1-N61zyO5Bf7PVgOeFMSMH0nSEfyI="
     },
     "verror": {
       "version": "1.3.6",
-      "from": "verror@1.3.6",
-      "resolved": "https://registry.npmjs.org/verror/-/verror-1.3.6.tgz"
+      "resolved": "https://registry.npmjs.org/verror/-/verror-1.3.6.tgz",
+      "integrity": "sha1-z/XfEpRtKX0rqu+qJoniW+AcAFw="
     },
     "vhost": {
       "version": "3.0.2",
-      "from": "vhost@>=3.0.1 <3.1.0",
-      "resolved": "https://registry.npmjs.org/vhost/-/vhost-3.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/vhost/-/vhost-3.0.2.tgz",
+      "integrity": "sha1-L7HezUxGaqiLD5NBrzPcGv8keNU="
     },
     "vinyl": {
       "version": "0.5.3",
-      "from": "vinyl@>=0.5.0 <0.6.0",
-      "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.5.3.tgz"
+      "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.5.3.tgz",
+      "integrity": "sha1-sEVbOPxeDPMNQyUTLkYZcMIJHN4="
     },
     "vinyl-bufferstream": {
       "version": "1.0.1",
-      "from": "vinyl-bufferstream@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/vinyl-bufferstream/-/vinyl-bufferstream-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/vinyl-bufferstream/-/vinyl-bufferstream-1.0.1.tgz",
+      "integrity": "sha1-BTeGn1gO/6TKRay0dXnkuf5jCBo="
     },
     "vinyl-fs": {
       "version": "0.3.14",
-      "from": "vinyl-fs@>=0.3.0 <0.4.0",
       "resolved": "https://registry.npmjs.org/vinyl-fs/-/vinyl-fs-0.3.14.tgz",
+      "integrity": "sha1-mmhRzhysHBzqX+hsCTHWIMLPqeY=",
       "dependencies": {
         "clone": {
           "version": "0.2.0",
-          "from": "clone@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/clone/-/clone-0.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/clone/-/clone-0.2.0.tgz",
+          "integrity": "sha1-xhJqkK1Pctv1rNskPMN3JP6T/B8="
         },
         "graceful-fs": {
           "version": "3.0.11",
-          "from": "graceful-fs@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-3.0.11.tgz"
+          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-3.0.11.tgz",
+          "integrity": "sha1-dhPHeKGv6mLyXGMKCG1/Osu92Bg="
         },
         "readable-stream": {
           "version": "1.0.34",
-          "from": "readable-stream@>=1.0.33-1 <1.1.0-0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
         },
         "through2": {
           "version": "0.6.5",
-          "from": "through2@>=0.6.1 <0.7.0",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz"
+          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
+          "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg="
         },
         "vinyl": {
           "version": "0.4.6",
-          "from": "vinyl@>=0.4.0 <0.5.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.4.6.tgz"
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.4.6.tgz",
+          "integrity": "sha1-LzVsh6VQolVGHza76ypbqL94SEc="
         }
       }
     },
     "vinyl-ftp": {
       "version": "0.6.0",
-      "from": "vinyl-ftp@0.6.0",
       "resolved": "https://registry.npmjs.org/vinyl-ftp/-/vinyl-ftp-0.6.0.tgz",
+      "integrity": "sha1-L7Q+xNWKLkwGtAblac7ps6pd+Mo=",
       "dependencies": {
         "clone-stats": {
           "version": "1.0.0",
-          "from": "clone-stats@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-1.0.0.tgz",
+          "integrity": "sha1-s3gt/4u1R04Yuba/D9/ngvh3doA="
         },
         "replace-ext": {
           "version": "1.0.0",
-          "from": "replace-ext@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-1.0.0.tgz",
+          "integrity": "sha1-3mMSg3P8v3w8z6TeWkgMRaZ5WOs="
         },
         "vinyl": {
           "version": "2.0.2",
-          "from": "vinyl@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-2.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-2.0.2.tgz",
+          "integrity": "sha1-CjcT2NTpIhxY8QyhbAEWyeJe2nw="
         }
       }
     },
     "vinyl-sourcemaps-apply": {
       "version": "0.2.1",
-      "from": "vinyl-sourcemaps-apply@>=0.2.1 <0.3.0",
-      "resolved": "https://registry.npmjs.org/vinyl-sourcemaps-apply/-/vinyl-sourcemaps-apply-0.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/vinyl-sourcemaps-apply/-/vinyl-sourcemaps-apply-0.2.1.tgz",
+      "integrity": "sha1-q2VJ1h0XLCsbh75cUI0jnI74dwU="
     },
     "vm-browserify": {
       "version": "0.0.4",
-      "from": "vm-browserify@0.0.4",
-      "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-0.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-0.0.4.tgz",
+      "integrity": "sha1-XX6kW7755Kb/ZflUOOCofDV9WnM="
     },
     "void-elements": {
       "version": "2.0.1",
-      "from": "void-elements@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/void-elements/-/void-elements-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/void-elements/-/void-elements-2.0.1.tgz",
+      "integrity": "sha1-wGavtYK7HLQSjWDqkjkulNXp2+w="
     },
     "watchpack": {
       "version": "0.2.9",
-      "from": "watchpack@>=0.2.1 <0.3.0",
       "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-0.2.9.tgz",
+      "integrity": "sha1-Yuqkq15bo1/fwBgnVibjwPXj+ws=",
       "dependencies": {
         "async": {
           "version": "0.9.2",
-          "from": "async@>=0.9.0 <0.10.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz",
+          "integrity": "sha1-rqdNXmHB+JlhO/ZL2mbUx48v0X0="
         }
       }
     },
     "wbuf": {
       "version": "1.7.2",
-      "from": "wbuf@>=1.7.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/wbuf/-/wbuf-1.7.2.tgz"
+      "resolved": "https://registry.npmjs.org/wbuf/-/wbuf-1.7.2.tgz",
+      "integrity": "sha1-1pe5nx9ZUS3ydRvkJ2nBWAtYAf4="
     },
     "webpack": {
       "version": "2.2.1",
-      "from": "webpack@2.2.1",
       "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.2.1.tgz",
+      "integrity": "sha1-e7HXKuIIfdGkr1Jq/sFe7RfdpHU=",
       "dependencies": {
         "acorn": {
           "version": "4.0.13",
-          "from": "acorn@>=4.0.4 <5.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz"
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
+          "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c="
         },
         "async": {
           "version": "2.4.1",
-          "from": "async@>=2.1.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
+          "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c="
         },
         "camelcase": {
           "version": "3.0.0",
-          "from": "camelcase@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
+          "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
         },
         "constants-browserify": {
           "version": "1.0.0",
-          "from": "constants-browserify@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz",
+          "integrity": "sha1-wguW2MYXdIqvHBYCF2DNJ/y4y3U="
         },
         "crypto-browserify": {
           "version": "3.11.0",
-          "from": "crypto-browserify@>=3.11.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
+          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz",
+          "integrity": "sha1-NlKgkGq5sqfgw85mpAjpV6JIVSI="
         },
         "enhanced-resolve": {
           "version": "3.1.0",
-          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz",
+          "integrity": "sha1-n0tib1dyRe3PSyrYPYbhf09CHew="
         },
         "https-browserify": {
           "version": "0.0.1",
-          "from": "https-browserify@0.0.1",
-          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz",
+          "integrity": "sha1-P5E2XKvmC3ftDruiS0VOPgnZWoI="
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "node-libs-browser": {
           "version": "2.0.0",
-          "from": "node-libs-browser@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz",
+          "integrity": "sha1-o6WeyXAkmFtG6Vg3lkb5bEthZkY="
         },
         "os-browserify": {
           "version": "0.2.1",
-          "from": "os-browserify@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz",
+          "integrity": "sha1-Y/xMzuXS13Y9Jrv4YBB45sLgBE8="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.5 <3.0.0",
           "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g=",
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "from": "string_decoder@>=1.0.0 <1.1.0",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+              "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
             }
           }
         },
         "stream-browserify": {
           "version": "2.0.1",
-          "from": "stream-browserify@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz",
+          "integrity": "sha1-ZiZu5fm9uZQKTkUUyvtDu3Hlyds="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         },
         "tapable": {
           "version": "0.2.6",
-          "from": "tapable@>=0.2.5 <0.3.0",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz",
+          "integrity": "sha1-IGvo4YiGC1FEJTdebxrom/sB/Y0="
         },
         "timers-browserify": {
           "version": "2.0.2",
-          "from": "timers-browserify@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz",
+          "integrity": "sha1-q0iDz1l9zVCvIRNJoA+8pWrIa4Y="
         },
         "url": {
           "version": "0.11.0",
-          "from": "url@>=0.11.0 <0.12.0",
           "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
+          "integrity": "sha1-ODjpfPxgUh63PFJajlW/3Z4uKPE=",
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "from": "punycode@1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
+              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
+              "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
             }
           }
         },
         "watchpack": {
           "version": "1.3.1",
-          "from": "watchpack@>=1.2.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz"
+          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz",
+          "integrity": "sha1-fYaTkHsozmAT5/NhCqKhrPB9rYc="
         },
         "webpack-sources": {
           "version": "0.1.5",
-          "from": "webpack-sources@>=0.1.4 <0.2.0",
-          "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-0.1.5.tgz"
+          "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-0.1.5.tgz",
+          "integrity": "sha1-qh86vw8NdNtxEcQOUAuE+WZkB1A="
         },
         "yargs": {
           "version": "6.6.0",
-          "from": "yargs@>=6.0.0 <7.0.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz",
+          "integrity": "sha1-eC7CHvQDNF+DCoCMo9UTr1YGUgg="
         },
         "yargs-parser": {
           "version": "4.2.1",
-          "from": "yargs-parser@>=4.2.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz",
+          "integrity": "sha1-KczqwNxPA8bIe0qfIX3RjJ90hxw="
         }
       }
     },
     "webpack-bundle-analyzer": {
       "version": "2.8.2",
-      "from": "webpack-bundle-analyzer@>=2.2.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.8.2.tgz",
+      "integrity": "sha1-i2JAwpqdY7xy8J2SD7BQrbzOn+g=",
       "dependencies": {
         "acorn": {
           "version": "5.0.3",
-          "from": "acorn@>=5.0.3 <6.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz",
+          "integrity": "sha1-xGDfCEkUY/AozLguqzcwvwEIez0="
         },
         "etag": {
           "version": "1.8.0",
-          "from": "etag@>=1.8.0 <1.9.0",
-          "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.0.tgz"
+          "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.0.tgz",
+          "integrity": "sha1-b2Ma7zNtbEY2K1F2QETOIWvjwFE="
         },
         "express": {
           "version": "4.15.3",
-          "from": "express@>=4.15.2 <5.0.0",
-          "resolved": "https://registry.npmjs.org/express/-/express-4.15.3.tgz"
+          "resolved": "https://registry.npmjs.org/express/-/express-4.15.3.tgz",
+          "integrity": "sha1-urZdDwOqgMNYQIly/HAPkWlEtmI="
         },
         "fresh": {
           "version": "0.5.0",
-          "from": "fresh@0.5.0",
-          "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.0.tgz"
+          "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.0.tgz",
+          "integrity": "sha1-9HTKXmqSRtb9jglTz6m5yAWvp44="
         },
         "lodash": {
           "version": "4.17.4",
-          "from": "lodash@>=4.17.4 <5.0.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz"
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
         },
         "mime": {
           "version": "1.3.4",
-          "from": "mime@1.3.4",
-          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz"
+          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz",
+          "integrity": "sha1-EV+eO2s9rylZmDyzjxSaLUDrXVM="
         },
         "send": {
           "version": "0.15.3",
-          "from": "send@0.15.3",
-          "resolved": "https://registry.npmjs.org/send/-/send-0.15.3.tgz"
+          "resolved": "https://registry.npmjs.org/send/-/send-0.15.3.tgz",
+          "integrity": "sha1-UBP5+ZAj31DRvZiSwZ4979HVMwk="
         },
         "serve-static": {
           "version": "1.12.3",
-          "from": "serve-static@1.12.3",
-          "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.12.3.tgz"
+          "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.12.3.tgz",
+          "integrity": "sha1-n0uhni8wMMVH+K+ZEHg47DjVseI="
         },
         "ultron": {
           "version": "1.1.0",
-          "from": "ultron@>=1.1.0 <1.2.0",
-          "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.1.0.tgz",
+          "integrity": "sha1-sHoualQagV/Go0zNRTO67DB8qGQ="
         },
         "ws": {
           "version": "2.3.1",
-          "from": "ws@>=2.3.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/ws/-/ws-2.3.1.tgz"
+          "resolved": "https://registry.npmjs.org/ws/-/ws-2.3.1.tgz",
+          "integrity": "sha1-a5Sz5EfLajY/eF6vlK9jWejoHIA="
         }
       }
     },
     "webpack-core": {
       "version": "0.6.9",
-      "from": "webpack-core@>=0.6.0 <0.7.0",
       "resolved": "https://registry.npmjs.org/webpack-core/-/webpack-core-0.6.9.tgz",
+      "integrity": "sha1-/FcViMhVjad76e+23r3Fo7FyvcI=",
       "dependencies": {
         "source-map": {
           "version": "0.4.4",
-          "from": "source-map@>=0.4.1 <0.5.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz"
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
+          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s="
         }
       }
     },
     "webpack-dev-middleware": {
       "version": "1.10.2",
-      "from": "webpack-dev-middleware@>=1.0.11 <2.0.0",
-      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-1.10.2.tgz"
+      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-1.10.2.tgz",
+      "integrity": "sha1-LiUs4d+wINvaHMs33ybzCrAU29E="
     },
     "webpack-dev-server": {
       "version": "2.4.5",
-      "from": "webpack-dev-server@>=2.4.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.4.5.tgz",
+      "integrity": "sha1-MThM6BE2vhCAtLTN4OubkOVO5s8=",
       "dependencies": {
         "camelcase": {
           "version": "3.0.0",
-          "from": "camelcase@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
+          "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.1.1 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         },
         "yargs": {
           "version": "6.6.0",
-          "from": "yargs@>=6.0.0 <7.0.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz",
+          "integrity": "sha1-eC7CHvQDNF+DCoCMo9UTr1YGUgg="
         },
         "yargs-parser": {
           "version": "4.2.1",
-          "from": "yargs-parser@>=4.2.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz",
+          "integrity": "sha1-KczqwNxPA8bIe0qfIX3RjJ90hxw="
         }
       }
     },
     "webpack-node-externals": {
       "version": "1.6.0",
-      "from": "webpack-node-externals@>=1.5.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/webpack-node-externals/-/webpack-node-externals-1.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/webpack-node-externals/-/webpack-node-externals-1.6.0.tgz",
+      "integrity": "sha1-Iyxi7GCSsQBjWj0p2DwXRxKN+b0="
     },
     "webpack-notifier": {
       "version": "1.5.0",
-      "from": "webpack-notifier@>=1.5.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/webpack-notifier/-/webpack-notifier-1.5.0.tgz",
+      "integrity": "sha1-wBAAfUSM68NN78mezyiPpejGuvY=",
       "dependencies": {
         "lodash._baseclone": {
           "version": "3.3.0",
-          "from": "lodash._baseclone@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/lodash._baseclone/-/lodash._baseclone-3.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/lodash._baseclone/-/lodash._baseclone-3.3.0.tgz",
+          "integrity": "sha1-MDUZv2OT/n5C802LYw73eU41Qrc="
         },
         "lodash.clonedeep": {
           "version": "3.0.2",
-          "from": "lodash.clonedeep@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-3.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-3.0.2.tgz",
+          "integrity": "sha1-oKHkDYKl6on/WxR7hETtY9koJ9s="
         },
         "node-notifier": {
           "version": "4.6.1",
-          "from": "node-notifier@>=4.1.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-4.6.1.tgz"
+          "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-4.6.1.tgz",
+          "integrity": "sha1-BW0UJE89zBzq3+aK+c/wxUc6M/M="
         }
       }
     },
     "webpack-sources": {
       "version": "0.2.3",
-      "from": "webpack-sources@>=0.2.3 <0.3.0",
       "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-0.2.3.tgz",
+      "integrity": "sha1-F8Yr+vE8cH+dAsR54Nzd6DgGl/s=",
       "dependencies": {
         "source-list-map": {
           "version": "1.1.2",
-          "from": "source-list-map@>=1.1.1 <2.0.0",
-          "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-1.1.2.tgz"
+          "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-1.1.2.tgz",
+          "integrity": "sha1-mIkBnRAkzOVc3AaUmDN+9hhqEaE="
         }
       }
     },
     "webpack-split-by-path": {
       "version": "2.0.0",
-      "from": "webpack-split-by-path@2.0.0",
-      "resolved": "https://registry.npmjs.org/webpack-split-by-path/-/webpack-split-by-path-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/webpack-split-by-path/-/webpack-split-by-path-2.0.0.tgz",
+      "integrity": "sha1-K2p1MB82lfc9h4jZkMTwxxVn4rA="
     },
     "webpack-stats-plugin": {
       "version": "0.1.5",
-      "from": "webpack-stats-plugin@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/webpack-stats-plugin/-/webpack-stats-plugin-0.1.5.tgz"
+      "resolved": "https://registry.npmjs.org/webpack-stats-plugin/-/webpack-stats-plugin-0.1.5.tgz",
+      "integrity": "sha1-KeXxLr/VMVjTHWVqETrB97hhedk="
     },
     "webpack-stream": {
       "version": "3.2.0",
-      "from": "webpack-stream@>=3.2.0 <3.3.0",
       "resolved": "https://registry.npmjs.org/webpack-stream/-/webpack-stream-3.2.0.tgz",
+      "integrity": "sha1-Oh0WD7EdQXJ7fObzL3IkZPmLIYY=",
       "dependencies": {
         "camelcase": {
           "version": "1.2.1",
-          "from": "camelcase@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
+          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
         },
         "cliui": {
           "version": "2.1.0",
-          "from": "cliui@>=2.1.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
+          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE="
         },
         "constants-browserify": {
           "version": "1.0.0",
-          "from": "constants-browserify@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz",
+          "integrity": "sha1-wguW2MYXdIqvHBYCF2DNJ/y4y3U="
         },
         "crypto-browserify": {
           "version": "3.3.0",
-          "from": "crypto-browserify@3.3.0",
-          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.3.0.tgz",
+          "integrity": "sha1-ufx1u0oO1h3PHNXa6W6zDJw+UGw="
         },
         "https-browserify": {
           "version": "0.0.1",
-          "from": "https-browserify@0.0.1",
-          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz",
+          "integrity": "sha1-P5E2XKvmC3ftDruiS0VOPgnZWoI="
         },
         "interpret": {
           "version": "0.6.6",
-          "from": "interpret@>=0.6.4 <0.7.0",
-          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz"
+          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz",
+          "integrity": "sha1-/s16GOfOXKar+5U+H4YhOknxYls="
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "memory-fs": {
           "version": "0.3.0",
-          "from": "memory-fs@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz",
+          "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
         },
         "node-libs-browser": {
           "version": "0.7.0",
-          "from": "node-libs-browser@>=0.7.0 <0.8.0",
           "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-0.7.0.tgz",
+          "integrity": "sha1-PicsCBnjCJNeJmdECNevDhSRuDs=",
           "dependencies": {
             "string_decoder": {
               "version": "0.10.31",
-              "from": "string_decoder@^0.10.25",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+              "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
             }
           }
         },
         "os-browserify": {
           "version": "0.2.1",
-          "from": "os-browserify@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz",
+          "integrity": "sha1-Y/xMzuXS13Y9Jrv4YBB45sLgBE8="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "stream-browserify": {
           "version": "2.0.1",
-          "from": "stream-browserify@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz",
+          "integrity": "sha1-ZiZu5fm9uZQKTkUUyvtDu3Hlyds="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         },
         "timers-browserify": {
           "version": "2.0.2",
-          "from": "timers-browserify@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz",
+          "integrity": "sha1-q0iDz1l9zVCvIRNJoA+8pWrIa4Y="
         },
         "uglify-js": {
           "version": "2.7.5",
-          "from": "uglify-js@>=2.7.3 <2.8.0",
           "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.7.5.tgz",
+          "integrity": "sha1-RhLAx7qu4rp8SH3kkErhIgefLKg=",
           "dependencies": {
             "async": {
               "version": "0.2.10",
-              "from": "async@>=0.2.6 <0.3.0",
-              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz"
+              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz",
+              "integrity": "sha1-trvgsGdLnXGXCMo43owjfLUmw9E="
             }
           }
         },
         "url": {
           "version": "0.11.0",
-          "from": "url@>=0.11.0 <0.12.0",
           "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
+          "integrity": "sha1-ODjpfPxgUh63PFJajlW/3Z4uKPE=",
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "from": "punycode@1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
+              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
+              "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
             }
           }
         },
         "vinyl": {
           "version": "1.2.0",
-          "from": "vinyl@>=1.1.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz",
+          "integrity": "sha1-XIgDbPVl5d8FVYv8kR+GVt8hiIQ="
         },
         "webpack": {
           "version": "1.15.0",
-          "from": "webpack@>=1.12.9 <2.0.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.15.0.tgz"
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.15.0.tgz",
+          "integrity": "sha1-T/MfU9sDM55VFkqdRo7gMklo/pg="
         },
         "window-size": {
           "version": "0.1.0",
-          "from": "window-size@0.1.0",
-          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
+          "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
         },
         "wordwrap": {
           "version": "0.0.2",
-          "from": "wordwrap@0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
+          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
         },
         "yargs": {
           "version": "3.10.0",
-          "from": "yargs@>=3.10.0 <3.11.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz"
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
+          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
         }
       }
     },
     "webpack-visualizer-plugin": {
       "version": "0.1.11",
-      "from": "webpack-visualizer-plugin@>=0.1.5 <0.2.0",
       "resolved": "https://registry.npmjs.org/webpack-visualizer-plugin/-/webpack-visualizer-plugin-0.1.11.tgz",
+      "integrity": "sha1-uHcK2GtPZSYSxosbeCJT+vn4o04=",
       "dependencies": {
         "react": {
           "version": "0.14.9",
-          "from": "react@>=0.14.0 <0.15.0",
-          "resolved": "https://registry.npmjs.org/react/-/react-0.14.9.tgz"
+          "resolved": "https://registry.npmjs.org/react/-/react-0.14.9.tgz",
+          "integrity": "sha1-kRCmSXxJ1EuhwO3TF67CnC4NkdE="
         },
         "react-dom": {
           "version": "0.14.9",
-          "from": "react-dom@>=0.14.0 <0.15.0",
-          "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-0.14.9.tgz"
+          "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-0.14.9.tgz",
+          "integrity": "sha1-BQZKPc8PsYgKOyv8nVjFXY2fYpM="
         }
       }
     },
     "websocket-driver": {
       "version": "0.6.5",
-      "from": "websocket-driver@>=0.5.1",
-      "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.6.5.tgz"
+      "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.6.5.tgz",
+      "integrity": "sha1-XLJVbOuF9Dc8bYI4qmkchFThOjY="
     },
     "websocket-extensions": {
       "version": "0.1.1",
-      "from": "websocket-extensions@>=0.1.1",
-      "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.1.tgz",
+      "integrity": "sha1-domUmcGEtu91Q3fC27DNbLVdKec="
     },
     "whatwg-fetch": {
       "version": "0.9.0",
-      "from": "whatwg-fetch@>=0.9.0 <0.10.0",
-      "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-0.9.0.tgz"
+      "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-0.9.0.tgz",
+      "integrity": "sha1-DjaExsuZlbQ+/J3wPkw2XZX9nMA="
     },
     "whet.extend": {
       "version": "0.9.9",
-      "from": "whet.extend@>=0.9.9 <0.10.0",
-      "resolved": "https://registry.npmjs.org/whet.extend/-/whet.extend-0.9.9.tgz"
+      "resolved": "https://registry.npmjs.org/whet.extend/-/whet.extend-0.9.9.tgz",
+      "integrity": "sha1-+HfVv2SMl+WqVC+twW1qJZucEaE="
     },
     "which": {
       "version": "1.2.14",
-      "from": "which@>=1.2.12 <2.0.0",
-      "resolved": "https://registry.npmjs.org/which/-/which-1.2.14.tgz"
+      "resolved": "https://registry.npmjs.org/which/-/which-1.2.14.tgz",
+      "integrity": "sha1-mofEN48D6CfOyvGs31bHNsAcFOU="
     },
     "which-module": {
       "version": "1.0.0",
-      "from": "which-module@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/which-module/-/which-module-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/which-module/-/which-module-1.0.0.tgz",
+      "integrity": "sha1-u6Y8qGGUiZT/MHc2CJ47lgJsKk8="
     },
     "wide-align": {
       "version": "1.1.2",
-      "from": "wide-align@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/wide-align/-/wide-align-1.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/wide-align/-/wide-align-1.1.2.tgz",
+      "integrity": "sha512-ijDLlyQ7s6x1JgCLur53osjm/UXUYD9+0PbYKrBsYisYXzCxN+HC3mYDNy/dWdmf3AwqwU3CXwDCvsNgGK1S0w=="
     },
     "widest-line": {
       "version": "1.0.0",
-      "from": "widest-line@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/widest-line/-/widest-line-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/widest-line/-/widest-line-1.0.0.tgz",
+      "integrity": "sha1-DAnIXCqUaD0Nfq+O4JfVZL8OEFw="
     },
     "window-size": {
       "version": "0.2.0",
-      "from": "window-size@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.2.0.tgz",
+      "integrity": "sha1-tDFbtCFKPXBY6+7okuE/ok2YsHU="
     },
     "wordwrap": {
       "version": "0.0.3",
-      "from": "wordwrap@>=0.0.2 <0.1.0",
-      "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.3.tgz",
+      "integrity": "sha1-o9XabNXAvAAI03I0u68b7WMFkQc="
     },
     "wrap-ansi": {
       "version": "2.1.0",
-      "from": "wrap-ansi@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
+      "integrity": "sha1-2Pw9KE3QV5T+hJc8rs3Rz4JP3YU="
     },
     "wrappy": {
       "version": "1.0.2",
-      "from": "wrappy@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
+      "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8="
     },
     "write-file-atomic": {
       "version": "1.3.4",
-      "from": "write-file-atomic@>=1.1.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-1.3.4.tgz"
+      "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-1.3.4.tgz",
+      "integrity": "sha1-+Aek8LHZ6ROuekgRLmzDrxmRtF8="
     },
     "ws": {
       "version": "1.1.4",
-      "from": "ws@1.1.4",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-1.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/ws/-/ws-1.1.4.tgz",
+      "integrity": "sha1-V/QNA2gy5fUFVmKjl8Tedu1mv2E="
     },
     "wtf-8": {
       "version": "1.0.0",
-      "from": "wtf-8@1.0.0",
-      "resolved": "https://registry.npmjs.org/wtf-8/-/wtf-8-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/wtf-8/-/wtf-8-1.0.0.tgz",
+      "integrity": "sha1-OS2LotDxw00e4tYw8V0O+2jhBIo="
     },
     "xdg-basedir": {
       "version": "2.0.0",
-      "from": "xdg-basedir@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-2.0.0.tgz",
+      "integrity": "sha1-7byQPMOF/ARSPZZqM1UEtVBNG9I="
     },
     "xml": {
       "version": "1.0.1",
-      "from": "xml@>=1.0.1 <1.1.0",
-      "resolved": "https://registry.npmjs.org/xml/-/xml-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/xml/-/xml-1.0.1.tgz",
+      "integrity": "sha1-eLpyAgApxbyHuKgaPPzXS0ovweU="
     },
     "xml-char-classes": {
       "version": "1.0.0",
-      "from": "xml-char-classes@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/xml-char-classes/-/xml-char-classes-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/xml-char-classes/-/xml-char-classes-1.0.0.tgz",
+      "integrity": "sha1-ZGV4SKIP/F31g6Qq2KJ3tFErvE0="
     },
     "xml2js": {
       "version": "0.2.7",
-      "from": "xml2js@0.2.7",
-      "resolved": "https://registry.npmjs.org/xml2js/-/xml2js-0.2.7.tgz"
+      "resolved": "https://registry.npmjs.org/xml2js/-/xml2js-0.2.7.tgz",
+      "integrity": "sha1-GDhRi7AXQcrgh4urSRXklMMjBq8="
     },
     "xmlbuilder": {
       "version": "0.4.3",
-      "from": "xmlbuilder@0.4.3",
-      "resolved": "https://registry.npmjs.org/xmlbuilder/-/xmlbuilder-0.4.3.tgz"
+      "resolved": "https://registry.npmjs.org/xmlbuilder/-/xmlbuilder-0.4.3.tgz",
+      "integrity": "sha1-xGFLp04K0ZbmCcknLNnh3bKKilg="
     },
     "xmlhttprequest-ssl": {
       "version": "1.5.3",
-      "from": "xmlhttprequest-ssl@1.5.3",
-      "resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-1.5.3.tgz"
+      "resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-1.5.3.tgz",
+      "integrity": "sha1-GFqIjATspGw+QHDZn3tJ3jUomS0="
     },
     "xregexp": {
       "version": "2.0.0",
-      "from": "xregexp@2.0.0",
-      "resolved": "https://registry.npmjs.org/xregexp/-/xregexp-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/xregexp/-/xregexp-2.0.0.tgz",
+      "integrity": "sha1-UqY+VsoLhKfzpfPWGHLxJq16WUM="
     },
     "xtend": {
       "version": "4.0.1",
-      "from": "xtend@>=4.0.1 <4.1.0",
-      "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.1.tgz",
+      "integrity": "sha1-pcbVMr5lbiPbgg77lDofBJmNY68="
     },
     "y18n": {
       "version": "3.2.1",
-      "from": "y18n@>=3.2.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/y18n/-/y18n-3.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/y18n/-/y18n-3.2.1.tgz",
+      "integrity": "sha1-bRX7qITAhnnA136I53WegR4H+kE="
     },
     "yallist": {
       "version": "2.1.2",
-      "from": "yallist@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-2.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-2.1.2.tgz",
+      "integrity": "sha1-HBH5IY8HYImkfdUS+TxmmaaoHVI="
     },
     "yargs": {
       "version": "4.6.0",
-      "from": "yargs@>=4.6.0 <4.7.0",
-      "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz",
+      "integrity": "sha1-y0BQwBWb+2u2ScD0r1UFJqhGGdw="
     },
     "yargs-parser": {
       "version": "2.4.1",
-      "from": "yargs-parser@>=2.4.0 <3.0.0",
       "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-2.4.1.tgz",
+      "integrity": "sha1-hVaN488VD/SfpRgl8DqMiA3cxcQ=",
       "dependencies": {
         "camelcase": {
           "version": "3.0.0",
-          "from": "camelcase@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
+          "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
         }
       }
     },
     "yauzl": {
       "version": "2.4.1",
-      "from": "yauzl@2.4.1",
-      "resolved": "https://registry.npmjs.org/yauzl/-/yauzl-2.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/yauzl/-/yauzl-2.4.1.tgz",
+      "integrity": "sha1-lSj0QtqxsihOWLQ3m7GU4i4MQAU="
     },
     "yeast": {
       "version": "0.1.2",
-      "from": "yeast@0.1.2",
-      "resolved": "https://registry.npmjs.org/yeast/-/yeast-0.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/yeast/-/yeast-0.1.2.tgz",
+      "integrity": "sha1-AI4G2AlDIMNy28L47XagymyKxBk="
     },
     "z-schema": {
       "version": "3.17.0",
-      "from": "z-schema@>=3.17.0 <3.18.0",
-      "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-3.17.0.tgz"
+      "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-3.17.0.tgz",
+      "integrity": "sha1-RCs4+denr3rke/z8NWhz6GFq0bc="
     }
   }
 }
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
new file mode 100644
index 0000000000000..e7573fca22684
--- /dev/null
+++ b/package-lock.json
@@ -0,0 +1,2148 @@
+{
+  "name": "office-ui-fabric-react-repo",
+  "version": "1.0.0",
+  "lockfileVersion": 1,
+  "dependencies": {
+    "@microsoft/package-deps-hash": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/@microsoft/package-deps-hash/-/package-deps-hash-2.0.2.tgz",
+      "integrity": "sha1-e17NHr2RS2YIvwBUdKnQZ81MmUg=",
+      "dev": true
+    },
+    "@microsoft/rush": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/@microsoft/rush/-/rush-3.0.7.tgz",
+      "integrity": "sha1-3fehsUYJ+0E1Aoej9anz70gVC7w=",
+      "dev": true
+    },
+    "@microsoft/rush-lib": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/@microsoft/rush-lib/-/rush-lib-3.0.7.tgz",
+      "integrity": "sha1-bKgpmEgMMxDKcHqeWW+NXAA+MMQ=",
+      "dev": true
+    },
+    "@microsoft/stream-collator": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/stream-collator/-/stream-collator-2.0.0.tgz",
+      "integrity": "sha1-O4vFx28J03IFX8LtV+0bCKsChyM=",
+      "dev": true
+    },
+    "@microsoft/ts-command-line": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/ts-command-line/-/ts-command-line-2.0.0.tgz",
+      "integrity": "sha1-4+OOiCRkLlQAu0Sl9xs+hVT/e4s=",
+      "dev": true
+    },
+    "@types/es6-collections": {
+      "version": "0.5.29",
+      "resolved": "https://registry.npmjs.org/@types/es6-collections/-/es6-collections-0.5.29.tgz",
+      "integrity": "sha1-7CKDH36N5zY3vxVmD52MomlGmA0=",
+      "dev": true
+    },
+    "@types/fs-extra": {
+      "version": "0.0.37",
+      "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.37.tgz",
+      "integrity": "sha1-GV8RvNmhuX2eQSxrZombVFRxofc=",
+      "dev": true
+    },
+    "@types/node": {
+      "version": "6.0.62",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.62.tgz",
+      "integrity": "sha1-hSIsB3tU8ltXQXu3CLn4d72jf4k=",
+      "dev": true
+    },
+    "@types/z-schema": {
+      "version": "3.16.31",
+      "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.31.tgz",
+      "integrity": "sha1-LrHQCl5Ow/pYx2r94S4YK2bcXBw=",
+      "dev": true
+    },
+    "agent-base": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-2.1.0.tgz",
+      "integrity": "sha1-GTRV5DR7ymsFhHy4HpObsyVEbag=",
+      "dev": true,
+      "dependencies": {
+        "semver": {
+          "version": "5.0.3",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.0.3.tgz",
+          "integrity": "sha1-d0Zt5YnNXTyV8TiqeLxWmjy10no=",
+          "dev": true
+        }
+      }
+    },
+    "ajv": {
+      "version": "4.11.8",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz",
+      "integrity": "sha1-gv+wKynmYq5TvcIK8VlHcGc5xTY=",
+      "dev": true,
+      "optional": true
+    },
+    "ansi-escapes": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz",
+      "integrity": "sha1-06ioOzGapneTZisT52HHkRQiMG4=",
+      "dev": true
+    },
+    "ansi-regex": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
+      "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
+      "dev": true
+    },
+    "ansi-styles": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+      "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=",
+      "dev": true
+    },
+    "archy": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/archy/-/archy-1.0.0.tgz",
+      "integrity": "sha1-+cjBN1fMHde8N5rHeyxipcKGjEA=",
+      "dev": true
+    },
+    "argparse": {
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.9.tgz",
+      "integrity": "sha1-c9g7wmP4bpf4zE9rrhsOkKfSLIY=",
+      "dev": true
+    },
+    "arr-diff": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
+      "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8=",
+      "dev": true
+    },
+    "arr-flatten": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.0.3.tgz",
+      "integrity": "sha1-onTthawIhJtr14R8RYB0XcUa37E=",
+      "dev": true
+    },
+    "array-differ": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/array-differ/-/array-differ-1.0.0.tgz",
+      "integrity": "sha1-7/UuN1gknTO+QCuLuOVkuytdQDE=",
+      "dev": true
+    },
+    "array-uniq": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz",
+      "integrity": "sha1-r2rId6Jcx/dOBYiUdThY39sk/bY=",
+      "dev": true
+    },
+    "array-unique": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
+      "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM=",
+      "dev": true
+    },
+    "asap": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.5.tgz",
+      "integrity": "sha1-UidltQw1EEkOUtfc/ghe+bqWlY8=",
+      "dev": true
+    },
+    "asn1": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.3.tgz",
+      "integrity": "sha1-2sh4dxPJlmhJ/IGAd36+nB3fO4Y=",
+      "dev": true,
+      "optional": true
+    },
+    "assert-plus": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-0.2.0.tgz",
+      "integrity": "sha1-104bh+ev/A24qttwIfP+SBAasjQ=",
+      "dev": true,
+      "optional": true
+    },
+    "asynckit": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
+      "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k=",
+      "dev": true,
+      "optional": true
+    },
+    "aws-sign2": {
+      "version": "0.6.0",
+      "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz",
+      "integrity": "sha1-FDQt0428yU0OW4fXY81jYSwOeU8=",
+      "dev": true,
+      "optional": true
+    },
+    "aws4": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.6.0.tgz",
+      "integrity": "sha1-g+9cqGCysy5KDe7e6MdxudtXRx4=",
+      "dev": true,
+      "optional": true
+    },
+    "balanced-match": {
+      "version": "0.4.2",
+      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-0.4.2.tgz",
+      "integrity": "sha1-yz8+PHMtwPAe5wtAPzAuYddwmDg=",
+      "dev": true
+    },
+    "bcrypt-pbkdf": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/bcrypt-pbkdf/-/bcrypt-pbkdf-1.0.1.tgz",
+      "integrity": "sha1-Y7xdy2EzG5K8Bf1SiVPDNGKgb40=",
+      "dev": true,
+      "optional": true
+    },
+    "beeper": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/beeper/-/beeper-1.1.1.tgz",
+      "integrity": "sha1-5tXqjF2tABMEpwsiY4RH9pyy+Ak=",
+      "dev": true
+    },
+    "boom": {
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
+      "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8=",
+      "dev": true
+    },
+    "brace-expansion": {
+      "version": "1.1.7",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.7.tgz",
+      "integrity": "sha1-Pv/DxQ4ABTH7cg6v+A8K6O8jz1k=",
+      "dev": true
+    },
+    "braces": {
+      "version": "1.8.5",
+      "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
+      "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc=",
+      "dev": true
+    },
+    "buffer-shims": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/buffer-shims/-/buffer-shims-1.0.0.tgz",
+      "integrity": "sha1-mXjOMXOIxkmth5MCjDR37wRKi1E=",
+      "dev": true
+    },
+    "builtin-modules": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz",
+      "integrity": "sha1-Jw8HbFpywC9bZaR9+Uxf46J4iS8=",
+      "dev": true
+    },
+    "builtins": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/builtins/-/builtins-1.0.3.tgz",
+      "integrity": "sha1-y5T662HIaWRR2zZTThQi+U8K7og=",
+      "dev": true
+    },
+    "camelcase": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
+      "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo=",
+      "dev": true
+    },
+    "caseless": {
+      "version": "0.12.0",
+      "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz",
+      "integrity": "sha1-G2gcIf+EAzyCZUMJBolCDRhxUdw=",
+      "dev": true,
+      "optional": true
+    },
+    "chalk": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+      "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+      "dev": true
+    },
+    "cli-cursor": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-1.0.2.tgz",
+      "integrity": "sha1-ZNo/fValRBLll5S9Ytw1KV6PKYc=",
+      "dev": true
+    },
+    "cli-width": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-2.1.0.tgz",
+      "integrity": "sha1-sjTKIJsp72b8UY2bmNWEewDt8Ao=",
+      "dev": true
+    },
+    "cliui": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
+      "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0=",
+      "dev": true
+    },
+    "clone": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.2.tgz",
+      "integrity": "sha1-Jgt6meux7f4kdTgXX3gyQ8sZ0Uk=",
+      "dev": true
+    },
+    "clone-stats": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-0.0.1.tgz",
+      "integrity": "sha1-uI+UqCzzi4eR1YBG6kAprYjKmdE=",
+      "dev": true
+    },
+    "co": {
+      "version": "4.6.0",
+      "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
+      "integrity": "sha1-bqa989hTrlTMuOR7+gvz+QMfsYQ=",
+      "dev": true,
+      "optional": true
+    },
+    "code-point-at": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz",
+      "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c=",
+      "dev": true
+    },
+    "colors": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/colors/-/colors-1.1.2.tgz",
+      "integrity": "sha1-FopHAXVran9RoSzgyXv6KMCE7WM=",
+      "dev": true
+    },
+    "combined-stream": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz",
+      "integrity": "sha1-k4NwpXtKUd6ix3wV1cX9+JUWQAk=",
+      "dev": true
+    },
+    "commander": {
+      "version": "2.9.0",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
+      "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q=",
+      "dev": true,
+      "optional": true
+    },
+    "concat-map": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
+      "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=",
+      "dev": true
+    },
+    "concat-stream": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.0.tgz",
+      "integrity": "sha1-CqxmL9Ur54lk1VMvaUeE5wEQrPc=",
+      "dev": true
+    },
+    "core-util-is": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
+      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=",
+      "dev": true
+    },
+    "cryptiles": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz",
+      "integrity": "sha1-O9/s3GCBR8HGcgL6KR59ylnqo7g=",
+      "dev": true,
+      "optional": true
+    },
+    "dashdash": {
+      "version": "1.14.1",
+      "resolved": "https://registry.npmjs.org/dashdash/-/dashdash-1.14.1.tgz",
+      "integrity": "sha1-hTz6D3y+L+1d4gMmuN1YEDX24vA=",
+      "dev": true,
+      "optional": true,
+      "dependencies": {
+        "assert-plus": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
+          "dev": true,
+          "optional": true
+        }
+      }
+    },
+    "dateformat": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-2.0.0.tgz",
+      "integrity": "sha1-J0Pjq7XD/CRi5SfcpEXgTp9N7hc=",
+      "dev": true
+    },
+    "debug": {
+      "version": "2.6.8",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
+      "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw=",
+      "dev": true
+    },
+    "debuglog": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/debuglog/-/debuglog-1.0.1.tgz",
+      "integrity": "sha1-qiT/uaw9+aI1GDfPstJ5NgzXhJI=",
+      "dev": true
+    },
+    "decamelize": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
+      "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA=",
+      "dev": true
+    },
+    "defaults": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.3.tgz",
+      "integrity": "sha1-xlYFHpgX2f8I7YgUd/P+QBnz730=",
+      "dev": true
+    },
+    "delayed-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
+      "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk=",
+      "dev": true
+    },
+    "deprecated": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/deprecated/-/deprecated-0.0.1.tgz",
+      "integrity": "sha1-+cmvVGSvoeepcUWKi97yqpTVuxk=",
+      "dev": true
+    },
+    "detect-file": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/detect-file/-/detect-file-0.1.0.tgz",
+      "integrity": "sha1-STXe39lIhkjgBrASlWbpOGcR6mM=",
+      "dev": true
+    },
+    "dezalgo": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/dezalgo/-/dezalgo-1.0.3.tgz",
+      "integrity": "sha1-f3Qt4Gb8dIvI24IFad3c5Jvw1FY=",
+      "dev": true
+    },
+    "duplexer2": {
+      "version": "0.0.2",
+      "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.0.2.tgz",
+      "integrity": "sha1-xhTc9n4vsUmVqRcR5aYX6KYKMds=",
+      "dev": true,
+      "dependencies": {
+        "isarray": {
+          "version": "0.0.1",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
+          "dev": true
+        },
+        "readable-stream": {
+          "version": "1.1.14",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
+          "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk=",
+          "dev": true
+        },
+        "string_decoder": {
+          "version": "0.10.31",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=",
+          "dev": true
+        }
+      }
+    },
+    "ecc-jsbn": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.1.tgz",
+      "integrity": "sha1-D8c6ntXw1Tw4GTOYUj735UN3dQU=",
+      "dev": true,
+      "optional": true
+    },
+    "end-of-stream": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-0.1.5.tgz",
+      "integrity": "sha1-jhdyBsPICDfYVjLouTWd/osvbq8=",
+      "dev": true,
+      "dependencies": {
+        "once": {
+          "version": "1.3.3",
+          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz",
+          "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA=",
+          "dev": true
+        }
+      }
+    },
+    "error-ex": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.1.tgz",
+      "integrity": "sha1-+FWobOYa3E6GIcPNoh56dhLDqNw=",
+      "dev": true
+    },
+    "escape-string-regexp": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
+      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
+      "dev": true
+    },
+    "exit-hook": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/exit-hook/-/exit-hook-1.1.1.tgz",
+      "integrity": "sha1-8FyiM7SMBdVP/wd2XfhQfpXAL/g=",
+      "dev": true
+    },
+    "expand-brackets": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
+      "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s=",
+      "dev": true
+    },
+    "expand-range": {
+      "version": "1.8.2",
+      "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz",
+      "integrity": "sha1-opnv/TNf4nIeuujiV+x5ZE/IUzc=",
+      "dev": true
+    },
+    "expand-tilde": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-1.2.2.tgz",
+      "integrity": "sha1-C4HrqJflo9MdHD0QL48BRB5VlEk=",
+      "dev": true
+    },
+    "extend": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz",
+      "integrity": "sha1-p1Xqe8Gt/MWjHOfnYtuq3F5jZEQ=",
+      "dev": true
+    },
+    "external-editor": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/external-editor/-/external-editor-1.1.1.tgz",
+      "integrity": "sha1-Etew24UPf/fnCBuvQAVwAGDEYAs=",
+      "dev": true
+    },
+    "extglob": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
+      "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE=",
+      "dev": true
+    },
+    "extsprintf": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.0.2.tgz",
+      "integrity": "sha1-4QgOBljjALBilJkMxw4VAiNf1VA=",
+      "dev": true
+    },
+    "fancy-log": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/fancy-log/-/fancy-log-1.3.0.tgz",
+      "integrity": "sha1-Rb4X0Cu5kX1gzP/UmVyZnmyMmUg=",
+      "dev": true
+    },
+    "figures": {
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz",
+      "integrity": "sha1-y+Hjr/zxzUS4DK3+0o3Hk6lwHS4=",
+      "dev": true
+    },
+    "filename-regex": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz",
+      "integrity": "sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY=",
+      "dev": true
+    },
+    "fill-range": {
+      "version": "2.2.3",
+      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz",
+      "integrity": "sha1-ULd9/X5Gm8dJJHCWNpn+eoSFpyM=",
+      "dev": true
+    },
+    "find-index": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
+      "integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ=",
+      "dev": true
+    },
+    "find-up": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
+      "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8=",
+      "dev": true
+    },
+    "findup-sync": {
+      "version": "0.4.3",
+      "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.4.3.tgz",
+      "integrity": "sha1-QAQ5Kee8YK3wt/SCfExudaDeyhI=",
+      "dev": true
+    },
+    "fined": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/fined/-/fined-1.0.2.tgz",
+      "integrity": "sha1-WyhCS3YNdZiWC374SA3/itNmDpc=",
+      "dev": true
+    },
+    "first-chunk-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/first-chunk-stream/-/first-chunk-stream-1.0.0.tgz",
+      "integrity": "sha1-Wb+1DNkF9g18OUzT2ayqtOatk04=",
+      "dev": true
+    },
+    "flagged-respawn": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/flagged-respawn/-/flagged-respawn-0.3.2.tgz",
+      "integrity": "sha1-/xke3c1wiKZ1smEP/8l2vpuAdLU=",
+      "dev": true
+    },
+    "follow-redirects": {
+      "version": "0.0.7",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-0.0.7.tgz",
+      "integrity": "sha1-NLkLqyqRGqNHVx2pDyK9NuzYqRk=",
+      "dev": true
+    },
+    "for-in": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
+      "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA=",
+      "dev": true
+    },
+    "for-own": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz",
+      "integrity": "sha1-UmXGgaTylNq78XyVCbZ2OqhFEM4=",
+      "dev": true
+    },
+    "forever-agent": {
+      "version": "0.6.1",
+      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
+      "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE=",
+      "dev": true,
+      "optional": true
+    },
+    "form-data": {
+      "version": "2.1.4",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
+      "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE=",
+      "dev": true,
+      "optional": true
+    },
+    "fs-exists-sync": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/fs-exists-sync/-/fs-exists-sync-0.1.0.tgz",
+      "integrity": "sha1-mC1ok6+RjnLQjeyehnP/K1qNat0=",
+      "dev": true
+    },
+    "fs-extra": {
+      "version": "0.26.7",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz",
+      "integrity": "sha1-muH92UiXeY7at20JGM9C0MMYT6k=",
+      "dev": true
+    },
+    "fs.realpath": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
+      "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=",
+      "dev": true
+    },
+    "gaze": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/gaze/-/gaze-0.5.2.tgz",
+      "integrity": "sha1-QLcJU30k0dRXZ9takIaJ3+aaxE8=",
+      "dev": true
+    },
+    "get-caller-file": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz",
+      "integrity": "sha1-9wLmMSfn4jHBYKgMFVSstw1QR+U=",
+      "dev": true
+    },
+    "getpass": {
+      "version": "0.1.7",
+      "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
+      "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo=",
+      "dev": true,
+      "optional": true,
+      "dependencies": {
+        "assert-plus": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
+          "dev": true,
+          "optional": true
+        }
+      }
+    },
+    "git-repo-info": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/git-repo-info/-/git-repo-info-1.1.4.tgz",
+      "integrity": "sha1-E0n6OIinZh6h/2OgR8L/Q7PglgI=",
+      "dev": true
+    },
+    "github": {
+      "version": "7.3.2",
+      "resolved": "https://registry.npmjs.org/github/-/github-7.3.2.tgz",
+      "integrity": "sha1-/hDN5pZDUsXZHhGnYW0m1f+2+Hs=",
+      "dev": true
+    },
+    "glob": {
+      "version": "7.0.6",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-7.0.6.tgz",
+      "integrity": "sha1-IRuvr0nlJbjNkyYNFKsTYVKz9Xo=",
+      "dev": true
+    },
+    "glob-base": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz",
+      "integrity": "sha1-27Fk9iIbHAscz4Kuoyi0l98Oo8Q=",
+      "dev": true
+    },
+    "glob-escape": {
+      "version": "0.0.2",
+      "resolved": "https://registry.npmjs.org/glob-escape/-/glob-escape-0.0.2.tgz",
+      "integrity": "sha1-nCf3gh7RwTd1gvPv2VWOP2dWKO0=",
+      "dev": true
+    },
+    "glob-parent": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz",
+      "integrity": "sha1-gTg9ctsFT8zPUzbaqQLxgvbtuyg=",
+      "dev": true
+    },
+    "glob-stream": {
+      "version": "3.1.18",
+      "resolved": "https://registry.npmjs.org/glob-stream/-/glob-stream-3.1.18.tgz",
+      "integrity": "sha1-kXCl8St5Awb9/lmPMT+PeVT9FDs=",
+      "dev": true,
+      "dependencies": {
+        "glob": {
+          "version": "4.5.3",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-4.5.3.tgz",
+          "integrity": "sha1-xstz0yJsHv7wTePFbQEvAzd+4V8=",
+          "dev": true
+        },
+        "isarray": {
+          "version": "0.0.1",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
+          "dev": true
+        },
+        "minimatch": {
+          "version": "2.0.10",
+          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-2.0.10.tgz",
+          "integrity": "sha1-jQh8OcazjAAbl/ynzm0OHoCvusc=",
+          "dev": true
+        },
+        "readable-stream": {
+          "version": "1.0.34",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=",
+          "dev": true
+        },
+        "string_decoder": {
+          "version": "0.10.31",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=",
+          "dev": true
+        },
+        "through2": {
+          "version": "0.6.5",
+          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
+          "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg=",
+          "dev": true
+        }
+      }
+    },
+    "glob-watcher": {
+      "version": "0.0.6",
+      "resolved": "https://registry.npmjs.org/glob-watcher/-/glob-watcher-0.0.6.tgz",
+      "integrity": "sha1-uVtKjfdLOcgymLDAXJeLTZo7cQs=",
+      "dev": true
+    },
+    "glob2base": {
+      "version": "0.0.12",
+      "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz",
+      "integrity": "sha1-nUGbPijxLoOjYhZKJ3BVkiycDVY=",
+      "dev": true
+    },
+    "global-modules": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-0.2.3.tgz",
+      "integrity": "sha1-6lo77ULG1s6ZWk+KEmm12uIjgo0=",
+      "dev": true
+    },
+    "global-prefix": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-0.1.5.tgz",
+      "integrity": "sha1-jTvGuNo8qBEqFg2NSW/wRiv+948=",
+      "dev": true
+    },
+    "globule": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/globule/-/globule-0.1.0.tgz",
+      "integrity": "sha1-2cjt3h2nnRJaFRt5UzuXhnY0auU=",
+      "dev": true,
+      "dependencies": {
+        "glob": {
+          "version": "3.1.21",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-3.1.21.tgz",
+          "integrity": "sha1-0p4KBV3qUTj00H7UDomC6DwgZs0=",
+          "dev": true
+        },
+        "graceful-fs": {
+          "version": "1.2.3",
+          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-1.2.3.tgz",
+          "integrity": "sha1-FaSAaldUfLLS2/J/QuiajDRRs2Q=",
+          "dev": true
+        },
+        "inherits": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/inherits/-/inherits-1.0.2.tgz",
+          "integrity": "sha1-ykMJ2t7mtUzAuNJH6NfHoJdb3Js=",
+          "dev": true
+        },
+        "lodash": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-1.0.2.tgz",
+          "integrity": "sha1-j1dWDIO1n8JwvT1WG2kAQ0MOJVE=",
+          "dev": true
+        },
+        "minimatch": {
+          "version": "0.2.14",
+          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.2.14.tgz",
+          "integrity": "sha1-x054BXT2PG+aCQ6Q775u9TpqdWo=",
+          "dev": true
+        }
+      }
+    },
+    "glogg": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/glogg/-/glogg-1.0.0.tgz",
+      "integrity": "sha1-f+DxmfV6yQbPUS/urY+Q7kooT8U=",
+      "dev": true
+    },
+    "graceful-fs": {
+      "version": "4.1.11",
+      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz",
+      "integrity": "sha1-Dovf5NHduIVNZOBOp8AOKgJuVlg=",
+      "dev": true
+    },
+    "graceful-readlink": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz",
+      "integrity": "sha1-TK+tdrxi8C+gObL5Tpo906ORpyU=",
+      "dev": true,
+      "optional": true
+    },
+    "gulp": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/gulp/-/gulp-3.9.1.tgz",
+      "integrity": "sha1-VxzkWSjdQK9lFPxAEYZgFsE4RbQ=",
+      "dev": true,
+      "dependencies": {
+        "semver": {
+          "version": "4.3.6",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz",
+          "integrity": "sha1-MAvG4OhjdPe6YQaLWx7NV/xlMto=",
+          "dev": true
+        }
+      }
+    },
+    "gulp-util": {
+      "version": "3.0.8",
+      "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.8.tgz",
+      "integrity": "sha1-AFTh50RQLifATBh8PsxQXdVLu08=",
+      "dev": true,
+      "dependencies": {
+        "object-assign": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz",
+          "integrity": "sha1-m+3VygiXlJvKR+f/QIBi1Un1h/I=",
+          "dev": true
+        }
+      }
+    },
+    "gulplog": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/gulplog/-/gulplog-1.0.0.tgz",
+      "integrity": "sha1-4oxNRdBey77YGDY86PnFkmIp/+U=",
+      "dev": true
+    },
+    "har-schema": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-1.0.5.tgz",
+      "integrity": "sha1-0mMTX0MwfALGAq/I/pWXDAFRNp4=",
+      "dev": true,
+      "optional": true
+    },
+    "har-validator": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz",
+      "integrity": "sha1-M0gdDxu/9gDdID11gSpqX7oALio=",
+      "dev": true,
+      "optional": true
+    },
+    "has-ansi": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz",
+      "integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE=",
+      "dev": true
+    },
+    "has-gulplog": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/has-gulplog/-/has-gulplog-0.1.0.tgz",
+      "integrity": "sha1-ZBTIKRNpfaUVkDl9r7EvIpZ4Ec4=",
+      "dev": true
+    },
+    "hawk": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz",
+      "integrity": "sha1-B4REvXwWQLD+VA0sm3PVlnjo4cQ=",
+      "dev": true,
+      "optional": true
+    },
+    "hoek": {
+      "version": "2.16.3",
+      "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz",
+      "integrity": "sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0=",
+      "dev": true
+    },
+    "homedir-polyfill": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.1.tgz",
+      "integrity": "sha1-TCu8inWJmP7r9e1oWA921GdotLw=",
+      "dev": true
+    },
+    "hosted-git-info": {
+      "version": "2.4.2",
+      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.4.2.tgz",
+      "integrity": "sha1-AHa59GonBQbduq6lZJaJdGBhKmc=",
+      "dev": true
+    },
+    "http-signature": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz",
+      "integrity": "sha1-33LiZwZs0Kxn+3at+OE0qPvPkb8=",
+      "dev": true,
+      "optional": true
+    },
+    "https-proxy-agent": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-1.0.0.tgz",
+      "integrity": "sha1-NffabEjOTdv6JkiRrFk+5f+GceY=",
+      "dev": true
+    },
+    "inflight": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
+      "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=",
+      "dev": true
+    },
+    "inherits": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
+      "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=",
+      "dev": true
+    },
+    "ini": {
+      "version": "1.3.4",
+      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.4.tgz",
+      "integrity": "sha1-BTfLedr1m1mhpRff9wbIbsA5Fi4=",
+      "dev": true
+    },
+    "inquirer": {
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-1.2.3.tgz",
+      "integrity": "sha1-TexvMvN+97sLLtPx0aXD9UUHSRg=",
+      "dev": true
+    },
+    "interpret": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.0.3.tgz",
+      "integrity": "sha1-y8NcYu7uc/Gat7EKgBURQBr8D5A=",
+      "dev": true
+    },
+    "invert-kv": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/invert-kv/-/invert-kv-1.0.0.tgz",
+      "integrity": "sha1-EEqOSqym09jNFXqO+L+rLXo//bY=",
+      "dev": true
+    },
+    "is-absolute": {
+      "version": "0.2.6",
+      "resolved": "https://registry.npmjs.org/is-absolute/-/is-absolute-0.2.6.tgz",
+      "integrity": "sha1-IN5p89uULvLYe5wto28XIjWxtes=",
+      "dev": true
+    },
+    "is-arrayish": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
+      "integrity": "sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0=",
+      "dev": true
+    },
+    "is-buffer": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.5.tgz",
+      "integrity": "sha1-Hzsm72E7IUuIy8ojzGwB2Hlh7sw=",
+      "dev": true
+    },
+    "is-builtin-module": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-1.0.0.tgz",
+      "integrity": "sha1-VAVy0096wxGfj3bDDLwbHgN6/74=",
+      "dev": true
+    },
+    "is-dotfile": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/is-dotfile/-/is-dotfile-1.0.2.tgz",
+      "integrity": "sha1-LBMjg/ORmfjtwmjKAbmwB9IFzE0=",
+      "dev": true
+    },
+    "is-equal-shallow": {
+      "version": "0.1.3",
+      "resolved": "https://registry.npmjs.org/is-equal-shallow/-/is-equal-shallow-0.1.3.tgz",
+      "integrity": "sha1-IjgJj8Ih3gvPpdnqxMRdY4qhxTQ=",
+      "dev": true
+    },
+    "is-extendable": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
+      "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=",
+      "dev": true
+    },
+    "is-extglob": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
+      "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA=",
+      "dev": true
+    },
+    "is-fullwidth-code-point": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
+      "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
+      "dev": true
+    },
+    "is-glob": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz",
+      "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM=",
+      "dev": true
+    },
+    "is-number": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz",
+      "integrity": "sha1-Afy7s5NGOlSPL0ZszhbezknbkI8=",
+      "dev": true
+    },
+    "is-posix-bracket": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz",
+      "integrity": "sha1-MzTceXdDaOkvAW5vvAqI9c1ua8Q=",
+      "dev": true
+    },
+    "is-primitive": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/is-primitive/-/is-primitive-2.0.0.tgz",
+      "integrity": "sha1-IHurkWOEmcB7Kt8kCkGochADRXU=",
+      "dev": true
+    },
+    "is-promise": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-promise/-/is-promise-2.1.0.tgz",
+      "integrity": "sha1-eaKp7OfwlugPNtKy87wWwf9L8/o=",
+      "dev": true
+    },
+    "is-relative": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/is-relative/-/is-relative-0.2.1.tgz",
+      "integrity": "sha1-0n9MfVFtF1+2ENuEu+7yPDvJeqU=",
+      "dev": true
+    },
+    "is-typedarray": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz",
+      "integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo=",
+      "dev": true,
+      "optional": true
+    },
+    "is-unc-path": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/is-unc-path/-/is-unc-path-0.1.2.tgz",
+      "integrity": "sha1-arBTpyVzwQJQ/0FqOBTDUXivObk=",
+      "dev": true
+    },
+    "is-utf8": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz",
+      "integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI=",
+      "dev": true
+    },
+    "is-windows": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-0.2.0.tgz",
+      "integrity": "sha1-3hqm1j6indJIc3tp8f+LgALSEIw=",
+      "dev": true
+    },
+    "isarray": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+      "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=",
+      "dev": true
+    },
+    "isexe": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
+      "integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA=",
+      "dev": true
+    },
+    "isobject": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
+      "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk=",
+      "dev": true
+    },
+    "isstream": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz",
+      "integrity": "sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo=",
+      "dev": true,
+      "optional": true
+    },
+    "jju": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/jju/-/jju-1.3.0.tgz",
+      "integrity": "sha1-2t2e8BkkvHKLA/L3l5vb1i96Kqo=",
+      "dev": true
+    },
+    "jodid25519": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/jodid25519/-/jodid25519-1.0.2.tgz",
+      "integrity": "sha1-BtSRIlUJNBlHfUJWM2BuDpB4KWc=",
+      "dev": true,
+      "optional": true
+    },
+    "jsbn": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-0.1.1.tgz",
+      "integrity": "sha1-peZUwuWi3rXyAdls77yoDA7y9RM=",
+      "dev": true,
+      "optional": true
+    },
+    "json-parse-helpfulerror": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/json-parse-helpfulerror/-/json-parse-helpfulerror-1.0.3.tgz",
+      "integrity": "sha1-E/FM4C7tTpgSl7ZOueO5MuLdE9w=",
+      "dev": true
+    },
+    "json-schema": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz",
+      "integrity": "sha1-tIDIkuWaLwWVTOcnvT8qTogvnhM=",
+      "dev": true,
+      "optional": true
+    },
+    "json-stable-stringify": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz",
+      "integrity": "sha1-mnWdOcXy/1A/1TAGRu1EX4jE+a8=",
+      "dev": true,
+      "optional": true
+    },
+    "json-stringify-safe": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz",
+      "integrity": "sha1-Epai1Y/UXxmg9s4B1lcB4sc1tus=",
+      "dev": true,
+      "optional": true
+    },
+    "jsonfile": {
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz",
+      "integrity": "sha1-NzaitCi4e72gzIO1P6PWM6NcKug=",
+      "dev": true
+    },
+    "jsonify": {
+      "version": "0.0.0",
+      "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz",
+      "integrity": "sha1-LHS27kHZPKUbe1qu6PUDYx0lKnM=",
+      "dev": true,
+      "optional": true
+    },
+    "jsprim": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.0.tgz",
+      "integrity": "sha1-o7h+QCmNjDgFUtjMdiigu5WiKRg=",
+      "dev": true,
+      "optional": true,
+      "dependencies": {
+        "assert-plus": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
+          "dev": true,
+          "optional": true
+        }
+      }
+    },
+    "kind-of": {
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+      "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+      "dev": true
+    },
+    "klaw": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/klaw/-/klaw-1.3.1.tgz",
+      "integrity": "sha1-QIhDO0azsbolnXh4XY6W9zugJDk=",
+      "dev": true
+    },
+    "lcid": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/lcid/-/lcid-1.0.0.tgz",
+      "integrity": "sha1-MIrMr6C8SDo4Z7S28rlQYlHRuDU=",
+      "dev": true
+    },
+    "liftoff": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/liftoff/-/liftoff-2.3.0.tgz",
+      "integrity": "sha1-qY8v9nGD2Lp8+soQVIvX/wVQs4U=",
+      "dev": true
+    },
+    "load-json-file": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
+      "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
+      "dev": true,
+      "dependencies": {
+        "strip-bom": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4=",
+          "dev": true
+        }
+      }
+    },
+    "lodash": {
+      "version": "4.15.0",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.15.0.tgz",
+      "integrity": "sha1-MWI5HY8BQKoiz49rPDTWt/Y9Oqk=",
+      "dev": true
+    },
+    "lodash._basecopy": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz",
+      "integrity": "sha1-jaDmqHbPNEwK2KVIghEd08XHyjY=",
+      "dev": true
+    },
+    "lodash._basetostring": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/lodash._basetostring/-/lodash._basetostring-3.0.1.tgz",
+      "integrity": "sha1-0YYdh3+CSlL2aYMtyvPuFVZqB9U=",
+      "dev": true
+    },
+    "lodash._basevalues": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._basevalues/-/lodash._basevalues-3.0.0.tgz",
+      "integrity": "sha1-W3dXYoAr3j0yl1A+JjAIIP32Ybc=",
+      "dev": true
+    },
+    "lodash._getnative": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/lodash._getnative/-/lodash._getnative-3.9.1.tgz",
+      "integrity": "sha1-VwvH3t5G1hzc3mh9ZdPuy6o6r/U=",
+      "dev": true
+    },
+    "lodash._isiterateecall": {
+      "version": "3.0.9",
+      "resolved": "https://registry.npmjs.org/lodash._isiterateecall/-/lodash._isiterateecall-3.0.9.tgz",
+      "integrity": "sha1-UgOte6Ql+uhCRg5pbbnPPmqsBXw=",
+      "dev": true
+    },
+    "lodash._reescape": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._reescape/-/lodash._reescape-3.0.0.tgz",
+      "integrity": "sha1-Kx1vXf4HyKNVdT5fJ/rH8c3hYWo=",
+      "dev": true
+    },
+    "lodash._reevaluate": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._reevaluate/-/lodash._reevaluate-3.0.0.tgz",
+      "integrity": "sha1-WLx0xAZklTrgsSTYBpltrKQx4u0=",
+      "dev": true
+    },
+    "lodash._reinterpolate": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz",
+      "integrity": "sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0=",
+      "dev": true
+    },
+    "lodash._root": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/lodash._root/-/lodash._root-3.0.1.tgz",
+      "integrity": "sha1-+6HEUkwZ7ppfgTa0YJ8BfPTe1pI=",
+      "dev": true
+    },
+    "lodash.assignwith": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/lodash.assignwith/-/lodash.assignwith-4.2.0.tgz",
+      "integrity": "sha1-EnqX8CrcQXUalU0ksN4X4QDgOOs=",
+      "dev": true
+    },
+    "lodash.escape": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-3.2.0.tgz",
+      "integrity": "sha1-mV7g3BjBtIzJLv+ucaEKq1tIdpg=",
+      "dev": true
+    },
+    "lodash.get": {
+      "version": "4.4.2",
+      "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
+      "integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk=",
+      "dev": true
+    },
+    "lodash.isarguments": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz",
+      "integrity": "sha1-L1c9hcaiQon/AGY7SRwdM4/zRYo=",
+      "dev": true
+    },
+    "lodash.isarray": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz",
+      "integrity": "sha1-eeTriMNqgSKvhvhEqpvNhRtfu1U=",
+      "dev": true
+    },
+    "lodash.isempty": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/lodash.isempty/-/lodash.isempty-4.4.0.tgz",
+      "integrity": "sha1-b4bL7di+TsmHvpqvM8loTbGzHn4=",
+      "dev": true
+    },
+    "lodash.isplainobject": {
+      "version": "4.0.6",
+      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
+      "integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs=",
+      "dev": true
+    },
+    "lodash.isstring": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/lodash.isstring/-/lodash.isstring-4.0.1.tgz",
+      "integrity": "sha1-1SfftUVuynzJu5XV2ur4i6VKVFE=",
+      "dev": true
+    },
+    "lodash.keys": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz",
+      "integrity": "sha1-TbwEcrFWvlCgsoaFXRvQsMZWCYo=",
+      "dev": true
+    },
+    "lodash.mapvalues": {
+      "version": "4.6.0",
+      "resolved": "https://registry.npmjs.org/lodash.mapvalues/-/lodash.mapvalues-4.6.0.tgz",
+      "integrity": "sha1-G6+lAF3p3W9PJmaMMMo3IwzJaJw=",
+      "dev": true
+    },
+    "lodash.pick": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz",
+      "integrity": "sha1-UvBWEP/53tQiYRRB7R/BI6AwAbM=",
+      "dev": true
+    },
+    "lodash.restparam": {
+      "version": "3.6.1",
+      "resolved": "https://registry.npmjs.org/lodash.restparam/-/lodash.restparam-3.6.1.tgz",
+      "integrity": "sha1-k2pOMJ7zMKdkXtQUWYbIWuWyCAU=",
+      "dev": true
+    },
+    "lodash.template": {
+      "version": "3.6.2",
+      "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-3.6.2.tgz",
+      "integrity": "sha1-+M3sxhaaJVvpCYrosMU9N4kx0U8=",
+      "dev": true
+    },
+    "lodash.templatesettings": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-3.1.1.tgz",
+      "integrity": "sha1-+zB4RHU7Zrnxr6VOJix0UwfbqOU=",
+      "dev": true
+    },
+    "lru-cache": {
+      "version": "2.7.3",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.7.3.tgz",
+      "integrity": "sha1-bUUk6LlV+V1PW1iFHOId1y+06VI=",
+      "dev": true
+    },
+    "map-cache": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz",
+      "integrity": "sha1-wyq9C9ZSXZsFFkW7TyasXcmKDb8=",
+      "dev": true
+    },
+    "micromatch": {
+      "version": "2.3.11",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
+      "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU=",
+      "dev": true
+    },
+    "mime": {
+      "version": "1.3.6",
+      "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.6.tgz",
+      "integrity": "sha1-WR2E02U6awtKO5343lqoEI5y5eA=",
+      "dev": true
+    },
+    "mime-db": {
+      "version": "1.27.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.27.0.tgz",
+      "integrity": "sha1-gg9XIpa70g7CXtVeW13oaeVDbrE=",
+      "dev": true
+    },
+    "mime-types": {
+      "version": "2.1.15",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.15.tgz",
+      "integrity": "sha1-pOv1BkCUVpI3uM9wBGd20J/JKu0=",
+      "dev": true
+    },
+    "minimatch": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
+      "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==",
+      "dev": true
+    },
+    "minimist": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
+      "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=",
+      "dev": true
+    },
+    "mkdirp": {
+      "version": "0.5.1",
+      "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
+      "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
+      "dev": true,
+      "dependencies": {
+        "minimist": {
+          "version": "0.0.8",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
+          "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0=",
+          "dev": true
+        }
+      }
+    },
+    "ms": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+      "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
+      "dev": true
+    },
+    "multipipe": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/multipipe/-/multipipe-0.1.2.tgz",
+      "integrity": "sha1-Ko8t33Du1WTf8tV/HhoTfZ8FB4s=",
+      "dev": true
+    },
+    "mute-stream": {
+      "version": "0.0.6",
+      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.6.tgz",
+      "integrity": "sha1-SJYrGeFp/R38JAs/HnMXYnu8R9s=",
+      "dev": true
+    },
+    "natives": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/natives/-/natives-1.1.0.tgz",
+      "integrity": "sha1-6f+EFBimsux6SV6TmYT3jxY+bjE=",
+      "dev": true
+    },
+    "netrc": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/netrc/-/netrc-0.1.4.tgz",
+      "integrity": "sha1-a+lPysqNd63gqWcNxGCRTJRHJEQ=",
+      "dev": true
+    },
+    "normalize-package-data": {
+      "version": "2.3.8",
+      "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.3.8.tgz",
+      "integrity": "sha1-2Bntoqne29H/pWPqQHHZNngilbs=",
+      "dev": true
+    },
+    "normalize-path": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-2.1.1.tgz",
+      "integrity": "sha1-GrKLVW4Zg2Oowab35vogE3/mrtk=",
+      "dev": true
+    },
+    "number-is-nan": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz",
+      "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=",
+      "dev": true
+    },
+    "oauth-sign": {
+      "version": "0.8.2",
+      "resolved": "https://registry.npmjs.org/oauth-sign/-/oauth-sign-0.8.2.tgz",
+      "integrity": "sha1-Rqarfwrq2N6unsBWV4C31O/rnUM=",
+      "dev": true,
+      "optional": true
+    },
+    "object-assign": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
+      "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=",
+      "dev": true
+    },
+    "object.omit": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/object.omit/-/object.omit-2.0.1.tgz",
+      "integrity": "sha1-Gpx0SCnznbuFjHbKNXmuKlTr0fo=",
+      "dev": true
+    },
+    "once": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
+      "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
+      "dev": true
+    },
+    "onetime": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/onetime/-/onetime-1.1.0.tgz",
+      "integrity": "sha1-ofeDj4MUxRbwXs78vEzP4EtO14k=",
+      "dev": true
+    },
+    "orchestrator": {
+      "version": "0.3.8",
+      "resolved": "https://registry.npmjs.org/orchestrator/-/orchestrator-0.3.8.tgz",
+      "integrity": "sha1-FOfp4nZPcxX7rBhOUGx6pt+UrX4=",
+      "dev": true
+    },
+    "ordered-read-streams": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.1.0.tgz",
+      "integrity": "sha1-/VZamvjrRHO6abbtijQ1LLVS8SY=",
+      "dev": true
+    },
+    "os-homedir": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
+      "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M=",
+      "dev": true
+    },
+    "os-locale": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
+      "integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk=",
+      "dev": true
+    },
+    "os-shim": {
+      "version": "0.1.3",
+      "resolved": "https://registry.npmjs.org/os-shim/-/os-shim-0.1.3.tgz",
+      "integrity": "sha1-a2LDeRz3kJ6jXtRuF2WLtBfLORc=",
+      "dev": true
+    },
+    "os-tmpdir": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
+      "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ=",
+      "dev": true
+    },
+    "parse-filepath": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/parse-filepath/-/parse-filepath-1.0.1.tgz",
+      "integrity": "sha1-FZ1hVdQ5BNFsEO9piRHaHpGWm3M=",
+      "dev": true
+    },
+    "parse-glob": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/parse-glob/-/parse-glob-3.0.4.tgz",
+      "integrity": "sha1-ssN2z7EfNVE7rdFz7wu246OIORw=",
+      "dev": true
+    },
+    "parse-json": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz",
+      "integrity": "sha1-9ID0BDTvgHQfhGkJn43qGPVaTck=",
+      "dev": true
+    },
+    "parse-passwd": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/parse-passwd/-/parse-passwd-1.0.0.tgz",
+      "integrity": "sha1-bVuTSkVpk7I9N/QKOC1vFmao5cY=",
+      "dev": true
+    },
+    "path-exists": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
+      "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s=",
+      "dev": true
+    },
+    "path-is-absolute": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
+      "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=",
+      "dev": true
+    },
+    "path-parse": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.5.tgz",
+      "integrity": "sha1-PBrfhx6pzWyUMbbqK9dKD/BVxME=",
+      "dev": true
+    },
+    "path-root": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/path-root/-/path-root-0.1.1.tgz",
+      "integrity": "sha1-mkpoFMrBwM1zNgqV8yCDyOpHRbc=",
+      "dev": true
+    },
+    "path-root-regex": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/path-root-regex/-/path-root-regex-0.1.2.tgz",
+      "integrity": "sha1-v8zcjfWxLcUsi0PsONGNcsBLqW0=",
+      "dev": true
+    },
+    "path-type": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
+      "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE=",
+      "dev": true
+    },
+    "performance-now": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-0.2.0.tgz",
+      "integrity": "sha1-M+8wxcd9TqIcWlOGnZG1bY8lVeU=",
+      "dev": true,
+      "optional": true
+    },
+    "pify": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+      "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
+      "dev": true
+    },
+    "pinkie": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/pinkie/-/pinkie-2.0.4.tgz",
+      "integrity": "sha1-clVrgM+g1IqXToDnckjoDtT3+HA=",
+      "dev": true
+    },
+    "pinkie-promise": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz",
+      "integrity": "sha1-ITXW36ejWMBprJsXh3YogihFD/o=",
+      "dev": true
+    },
+    "preserve": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/preserve/-/preserve-0.2.0.tgz",
+      "integrity": "sha1-gV7R9uvGWSb4ZbMQwHE7yzMVzks=",
+      "dev": true
+    },
+    "pretty-hrtime": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz",
+      "integrity": "sha1-t+PqQkNaTJsnWdmeDyAesZWALuE=",
+      "dev": true
+    },
+    "process-nextick-args": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz",
+      "integrity": "sha1-FQ4gt1ZZCtP5EJPyWk8q2L/zC6M=",
+      "dev": true
+    },
+    "punycode": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
+      "integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4=",
+      "dev": true,
+      "optional": true
+    },
+    "qs": {
+      "version": "6.4.0",
+      "resolved": "https://registry.npmjs.org/qs/-/qs-6.4.0.tgz",
+      "integrity": "sha1-E+JtKK1rD/qpExLNO/cI7TUecjM=",
+      "dev": true,
+      "optional": true
+    },
+    "randomatic": {
+      "version": "1.1.6",
+      "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-1.1.6.tgz",
+      "integrity": "sha1-EQ3Kv/OX6dz/fAeJzMCkmt8exbs=",
+      "dev": true
+    },
+    "read-package-json": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/read-package-json/-/read-package-json-2.0.5.tgz",
+      "integrity": "sha1-+Tpk5kFSnfaKCMZN5GOJ6KP4iEU=",
+      "dev": true,
+      "dependencies": {
+        "glob": {
+          "version": "7.1.2",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
+          "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ==",
+          "dev": true
+        }
+      }
+    },
+    "read-package-tree": {
+      "version": "5.1.5",
+      "resolved": "https://registry.npmjs.org/read-package-tree/-/read-package-tree-5.1.5.tgz",
+      "integrity": "sha1-rOfmOBx2hPlwqqmPx8XStmat2rY=",
+      "dev": true
+    },
+    "read-pkg": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
+      "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg=",
+      "dev": true
+    },
+    "read-pkg-up": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
+      "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI=",
+      "dev": true
+    },
+    "readable-stream": {
+      "version": "2.2.9",
+      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+      "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g=",
+      "dev": true
+    },
+    "readdir-scoped-modules": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/readdir-scoped-modules/-/readdir-scoped-modules-1.0.2.tgz",
+      "integrity": "sha1-n6+jfShr5dksuuve4DDcm19AZ0c=",
+      "dev": true
+    },
+    "rechoir": {
+      "version": "0.6.2",
+      "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz",
+      "integrity": "sha1-hSBLVNuoLVdC4oyWdW70OvUOM4Q=",
+      "dev": true
+    },
+    "regex-cache": {
+      "version": "0.4.3",
+      "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.3.tgz",
+      "integrity": "sha1-mxpsNdTQ3871cRrmUejp09cRQUU=",
+      "dev": true
+    },
+    "remove-trailing-separator": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.0.1.tgz",
+      "integrity": "sha1-YV67lq9VlVLUv0BXyENtSGq2PMQ=",
+      "dev": true
+    },
+    "repeat-element": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/repeat-element/-/repeat-element-1.1.2.tgz",
+      "integrity": "sha1-7wiaF40Ug7quTZPrmLT55OEdmQo=",
+      "dev": true
+    },
+    "repeat-string": {
+      "version": "1.6.1",
+      "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-1.6.1.tgz",
+      "integrity": "sha1-jcrkcOHIirwtYA//Sndihtp15jc=",
+      "dev": true
+    },
+    "replace-ext": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-0.0.1.tgz",
+      "integrity": "sha1-KbvZIHinOfC8zitO5B6DeVNSKSQ=",
+      "dev": true
+    },
+    "request": {
+      "version": "2.81.0",
+      "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz",
+      "integrity": "sha1-xpKJRqDgbF+Nb4qTM0af/aRimKA=",
+      "dev": true,
+      "optional": true
+    },
+    "require-directory": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
+      "integrity": "sha1-jGStX9MNqxyXbiNE/+f3kqam30I=",
+      "dev": true
+    },
+    "require-main-filename": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-1.0.1.tgz",
+      "integrity": "sha1-l/cXtp1IeE9fUmpsWqj/3aBVpNE=",
+      "dev": true
+    },
+    "resolve": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.3.3.tgz",
+      "integrity": "sha1-ZVkHw0aahoDcLeOidaj91paR8OU=",
+      "dev": true
+    },
+    "resolve-dir": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/resolve-dir/-/resolve-dir-0.1.1.tgz",
+      "integrity": "sha1-shklmlYC+sXFxJatiUpujMQwJh4=",
+      "dev": true
+    },
+    "restore-cursor": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-1.0.1.tgz",
+      "integrity": "sha1-NGYfRohjJ/7SmRR5FSJS35LapUE=",
+      "dev": true
+    },
+    "rimraf": {
+      "version": "2.5.4",
+      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
+      "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ=",
+      "dev": true
+    },
+    "run-async": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/run-async/-/run-async-2.3.0.tgz",
+      "integrity": "sha1-A3GrSuC91yDUFm19/aZP96RFpsA=",
+      "dev": true
+    },
+    "rx": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/rx/-/rx-4.1.0.tgz",
+      "integrity": "sha1-pfE/957zt0D+MKqAP7CfmIBdR4I=",
+      "dev": true
+    },
+    "safe-buffer": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+      "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c=",
+      "dev": true
+    },
+    "semver": {
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz",
+      "integrity": "sha1-myzl094C0XxgEq0yaqa00M9U+U8=",
+      "dev": true
+    },
+    "sequencify": {
+      "version": "0.0.7",
+      "resolved": "https://registry.npmjs.org/sequencify/-/sequencify-0.0.7.tgz",
+      "integrity": "sha1-kM/xnQLgcCf9dn9erT57ldHnOAw=",
+      "dev": true
+    },
+    "set-blocking": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
+      "integrity": "sha1-BF+XgtARrppoA93TgrJDkrPYkPc=",
+      "dev": true
+    },
+    "sigmund": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/sigmund/-/sigmund-1.0.1.tgz",
+      "integrity": "sha1-P/IfGYytIXX587eBhT/ZTQ0ZtZA=",
+      "dev": true
+    },
+    "sntp": {
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz",
+      "integrity": "sha1-ZUEYTMkK7qbG57NeJlkIJEPGYZg=",
+      "dev": true,
+      "optional": true
+    },
+    "sparkles": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/sparkles/-/sparkles-1.0.0.tgz",
+      "integrity": "sha1-Gsu/tZJDbRC76PeFt8xvgoFQEsM=",
+      "dev": true
+    },
+    "spawn-sync": {
+      "version": "1.0.15",
+      "resolved": "https://registry.npmjs.org/spawn-sync/-/spawn-sync-1.0.15.tgz",
+      "integrity": "sha1-sAeZVX63+wyDdsKdROih6mfldHY=",
+      "dev": true
+    },
+    "spdx-correct": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-1.0.2.tgz",
+      "integrity": "sha1-SzBz2TP/UfORLwOsVRlJikFQ20A=",
+      "dev": true
+    },
+    "spdx-expression-parse": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-1.0.4.tgz",
+      "integrity": "sha1-m98vIOH0DtRH++JzJmGR/O1RYmw=",
+      "dev": true
+    },
+    "spdx-license-ids": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-1.2.2.tgz",
+      "integrity": "sha1-yd96NCRZSt5r0RkA1ZZpbcBrrFc=",
+      "dev": true
+    },
+    "sprintf-js": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
+      "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=",
+      "dev": true
+    },
+    "sshpk": {
+      "version": "1.13.0",
+      "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.13.0.tgz",
+      "integrity": "sha1-/yo+T9BEl1Vf7Zezmg/YL6+zozw=",
+      "dev": true,
+      "optional": true,
+      "dependencies": {
+        "assert-plus": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
+          "dev": true,
+          "optional": true
+        }
+      }
+    },
+    "stream-consume": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/stream-consume/-/stream-consume-0.1.0.tgz",
+      "integrity": "sha1-pB6tGm1ggc63n2WwYZAbbY89HQ8=",
+      "dev": true
+    },
+    "string_decoder": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+      "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg=",
+      "dev": true
+    },
+    "string-width": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
+      "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
+      "dev": true
+    },
+    "stringstream": {
+      "version": "0.0.5",
+      "resolved": "https://registry.npmjs.org/stringstream/-/stringstream-0.0.5.tgz",
+      "integrity": "sha1-TkhM1N5aC7vuGORjB3EKioFiGHg=",
+      "dev": true,
+      "optional": true
+    },
+    "strip-ansi": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
+      "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
+      "dev": true
+    },
+    "strip-bom": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-1.0.0.tgz",
+      "integrity": "sha1-hbiGLzhEtabV7IRnqTWYFzo295Q=",
+      "dev": true
+    },
+    "supports-color": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+      "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=",
+      "dev": true
+    },
+    "through": {
+      "version": "2.3.8",
+      "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
+      "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU=",
+      "dev": true
+    },
+    "through2": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/through2/-/through2-2.0.3.tgz",
+      "integrity": "sha1-AARWmzfHx0ujnEPzzteNGtlBQL4=",
+      "dev": true
+    },
+    "tildify": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/tildify/-/tildify-1.2.0.tgz",
+      "integrity": "sha1-3OwD9V3Km3qj5bBPIYF+tW5jWIo=",
+      "dev": true
+    },
+    "time-stamp": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/time-stamp/-/time-stamp-1.1.0.tgz",
+      "integrity": "sha1-dkpaEa9QVhkhsTPztE5hhofg9cM=",
+      "dev": true
+    },
+    "tmp": {
+      "version": "0.0.29",
+      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.29.tgz",
+      "integrity": "sha1-8lEl/w3Z2jzLDC3Tce4SiLuRKMA=",
+      "dev": true
+    },
+    "tough-cookie": {
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.2.tgz",
+      "integrity": "sha1-8IH3bkyFcg5sN6X6ztc3FQ2EByo=",
+      "dev": true,
+      "optional": true
+    },
+    "tunnel-agent": {
+      "version": "0.6.0",
+      "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.6.0.tgz",
+      "integrity": "sha1-J6XeoGs2sEoKmWZ3SykIaPD8QP0=",
+      "dev": true,
+      "optional": true
+    },
+    "tweetnacl": {
+      "version": "0.14.5",
+      "resolved": "https://registry.npmjs.org/tweetnacl/-/tweetnacl-0.14.5.tgz",
+      "integrity": "sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q=",
+      "dev": true,
+      "optional": true
+    },
+    "typedarray": {
+      "version": "0.0.6",
+      "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
+      "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=",
+      "dev": true
+    },
+    "unc-path-regex": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/unc-path-regex/-/unc-path-regex-0.1.2.tgz",
+      "integrity": "sha1-5z3T17DXxe2G+6xrCufYxqadUPo=",
+      "dev": true
+    },
+    "unique-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-1.0.0.tgz",
+      "integrity": "sha1-1ZpKdUJ0R9mqbJHnAmP40mpLEEs=",
+      "dev": true
+    },
+    "user-home": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/user-home/-/user-home-1.1.1.tgz",
+      "integrity": "sha1-K1viOjK2Onyd640PKNSFcko98ZA=",
+      "dev": true
+    },
+    "util-deprecate": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
+      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=",
+      "dev": true
+    },
+    "uuid": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.0.1.tgz",
+      "integrity": "sha1-ZUS7ot/ajBzxfmKaOjBeK7H+5sE=",
+      "dev": true,
+      "optional": true
+    },
+    "v8flags": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/v8flags/-/v8flags-2.1.1.tgz",
+      "integrity": "sha1-qrGh+jDUX4jdMhFIh1rALAtV5bQ=",
+      "dev": true
+    },
+    "validate-npm-package-license": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.1.tgz",
+      "integrity": "sha1-KAS6vnEq0zeUWaz74kdGqywwP7w=",
+      "dev": true
+    },
+    "validator": {
+      "version": "5.7.0",
+      "resolved": "https://registry.npmjs.org/validator/-/validator-5.7.0.tgz",
+      "integrity": "sha1-eoelgUa2laxIYHEUHAxJ1n2gXlw=",
+      "dev": true
+    },
+    "verror": {
+      "version": "1.3.6",
+      "resolved": "https://registry.npmjs.org/verror/-/verror-1.3.6.tgz",
+      "integrity": "sha1-z/XfEpRtKX0rqu+qJoniW+AcAFw=",
+      "dev": true,
+      "optional": true
+    },
+    "vinyl": {
+      "version": "0.5.3",
+      "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.5.3.tgz",
+      "integrity": "sha1-sEVbOPxeDPMNQyUTLkYZcMIJHN4=",
+      "dev": true
+    },
+    "vinyl-fs": {
+      "version": "0.3.14",
+      "resolved": "https://registry.npmjs.org/vinyl-fs/-/vinyl-fs-0.3.14.tgz",
+      "integrity": "sha1-mmhRzhysHBzqX+hsCTHWIMLPqeY=",
+      "dev": true,
+      "dependencies": {
+        "clone": {
+          "version": "0.2.0",
+          "resolved": "https://registry.npmjs.org/clone/-/clone-0.2.0.tgz",
+          "integrity": "sha1-xhJqkK1Pctv1rNskPMN3JP6T/B8=",
+          "dev": true
+        },
+        "graceful-fs": {
+          "version": "3.0.11",
+          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-3.0.11.tgz",
+          "integrity": "sha1-dhPHeKGv6mLyXGMKCG1/Osu92Bg=",
+          "dev": true
+        },
+        "isarray": {
+          "version": "0.0.1",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
+          "dev": true
+        },
+        "readable-stream": {
+          "version": "1.0.34",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=",
+          "dev": true
+        },
+        "string_decoder": {
+          "version": "0.10.31",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=",
+          "dev": true
+        },
+        "through2": {
+          "version": "0.6.5",
+          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
+          "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg=",
+          "dev": true
+        },
+        "vinyl": {
+          "version": "0.4.6",
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.4.6.tgz",
+          "integrity": "sha1-LzVsh6VQolVGHza76ypbqL94SEc=",
+          "dev": true
+        }
+      }
+    },
+    "which": {
+      "version": "1.2.14",
+      "resolved": "https://registry.npmjs.org/which/-/which-1.2.14.tgz",
+      "integrity": "sha1-mofEN48D6CfOyvGs31bHNsAcFOU=",
+      "dev": true
+    },
+    "which-module": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/which-module/-/which-module-1.0.0.tgz",
+      "integrity": "sha1-u6Y8qGGUiZT/MHc2CJ47lgJsKk8=",
+      "dev": true
+    },
+    "wordwrap": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz",
+      "integrity": "sha1-J1hIEIkUVqQXHI0CJkQa3pDLyus=",
+      "dev": true
+    },
+    "wrap-ansi": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
+      "integrity": "sha1-2Pw9KE3QV5T+hJc8rs3Rz4JP3YU=",
+      "dev": true
+    },
+    "wrappy": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
+      "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=",
+      "dev": true
+    },
+    "xtend": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.1.tgz",
+      "integrity": "sha1-pcbVMr5lbiPbgg77lDofBJmNY68=",
+      "dev": true
+    },
+    "y18n": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/y18n/-/y18n-3.2.1.tgz",
+      "integrity": "sha1-bRX7qITAhnnA136I53WegR4H+kE=",
+      "dev": true
+    },
+    "yargs": {
+      "version": "6.6.0",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz",
+      "integrity": "sha1-eC7CHvQDNF+DCoCMo9UTr1YGUgg=",
+      "dev": true
+    },
+    "yargs-parser": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz",
+      "integrity": "sha1-KczqwNxPA8bIe0qfIX3RjJ90hxw=",
+      "dev": true
+    },
+    "z-schema": {
+      "version": "3.17.0",
+      "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-3.17.0.tgz",
+      "integrity": "sha1-RCs4+denr3rke/z8NWhz6GFq0bc=",
+      "dev": true
+    }
+  }
+}
diff --git a/package.json b/package.json
index c4973bb88abfe..28ebb32f0eeec 100644
--- a/package.json
+++ b/package.json
@@ -12,11 +12,14 @@
     "_rushBuild": "node node_modules/@microsoft/rush/bin/rush build --verbose",
     "_rushBuildToFabric": "node node_modules/@microsoft/rush/bin/rush build --to office-ui-fabric-react",
     "_rushRebuild": "node node_modules/@microsoft/rush/bin/rush rebuild --production --verbose",
+    "_rushRebuildFast": "node node_modules/@microsoft/rush/bin/rush rebuild --verbose",
     "postinstall": "npm run _rushInstall && npm run _rushBuildToFabric",
     "test": "npm run _rushBuild",
     "start": "cd packages && cd office-ui-fabric-react && npm start",
     "build": "npm run _rushRebuild",
-    "change": "node node_modules/@microsoft/rush/bin/rush change"
+    "buildfast": "node scripts/selective-build.js",
+    "change": "node node_modules/@microsoft/rush/bin/rush change",
+    "generate": "node node_modules/@microsoft/rush/bin/rush generate"
   },
   "license": "MIT",
   "devDependencies": {
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index f81417ad40b50..ece06c66fae04 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -25,7 +25,7 @@
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
     "enzyme": "^2.7.0",
-    "es6-promise": "4.1.0",
+    "es6-promise": "^4.1.0",
     "gulp": "~3.9.1",
     "mocha": "~3.3.0",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index c7de9725b3e84..38c397722e568 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -34,7 +34,7 @@
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
     "enzyme": "^2.7.0",
-    "es6-promise": "4.1.0",
+    "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
     "git-rev": "0.2.1",
     "gulp": "~3.9.1",
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 24ba4ce2f6d2f..e9df2c6883110 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -23,7 +23,7 @@
     "@uifabric/example-app-base": ">=1.3.12 <2.0.0",
     "chai": "^3.5.0",
     "enzyme": "^2.7.0",
-    "es6-promise": "4.1.0",
+    "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
     "gulp": "~3.9.1",
     "mocha": "^3.2.0",
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 6afef38c1a96d..1ac35139b9c18 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -28,7 +28,7 @@
     "@types/sinon": "^2.2.2",
     "@types/webpack-env": "^1.13.0",
     "enzyme": "^2.7.0",
-    "es6-promise": "4.1.0",
+    "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
     "gulp": "~3.9.1",
     "mocha": "~3.3.0",
diff --git a/rush.json b/rush.json
index c03ac5fa47bcb..44266d69d03ac 100644
--- a/rush.json
+++ b/rush.json
@@ -1,5 +1,5 @@
 {
-  "npmVersion": "3.10.9",
+  "npmVersion": "5.0.0",
   "rushMinimumVersion": "3.0.7",
   "nodeSupportedVersionRange": ">=6.9.0 <8.0.0",
   "projectFolderMinDepth": 1,
diff --git a/scripts/selective-build.js b/scripts/selective-build.js
new file mode 100644
index 0000000000000..673d137e7321b
--- /dev/null
+++ b/scripts/selective-build.js
@@ -0,0 +1,111 @@
+// Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license.
+// See LICENSE in the project root for license information.
+
+const child_process = require('child_process');
+const fs = require('fs');
+const path = require('path');
+const rushPackages = JSON.parse(fs.readFileSync('rush.json', 'utf8'));
+
+const excludedFolders = [
+  path.resolve('common/changes'),
+  path.resolve('scripts')
+];
+
+/**
+ * Tests if the folder path falls under any of the excluded folders.
+ */
+function isExcluded(folderPath) {
+  for (let exclude of excludedFolders) {
+    if (folderPath.indexOf(exclude) === 0) {
+      return true;
+    }
+  }
+
+  return false;
+}
+
+/**
+ * Gets changed packages.
+ * @returns null if nothing changed, empty array if everything changed, or specific project names if some changed.
+ */
+function getChangedPackages(targetBranch) {
+  let changedPackages = [];
+
+  let changedFiles = child_process.execSync(`git diff --name-only ${targetBranch}`)
+    .toString()
+    .trim()
+    .split('\n');
+
+  for (let filename of changedFiles) {
+    let changedPath = path.dirname(path.resolve(filename));
+    console.log(changedPath);
+
+    if (isExcluded(changedPath)) {
+      console.log('excluding')
+    } else {
+      let packageName = getPackageName(changedPath);
+
+      if (!packageName) {
+        return [];
+      }
+      if (changedPackages.indexOf(packageName) < 0) {
+        changedPackages.push(packageName);
+      }
+    }
+  }
+
+  return changedPackages.length ? changedPackages : undefined;
+}
+
+function cleanPackageDeps() {
+  rushPackages.projects.forEach(project => {
+    const depFile = path.join(project.projectFolder, 'package-deps.json');
+
+    if (fs.existsSync(depFile)) {
+      console.log(`Removing ${depFile}`);
+      fs.unlinkSync(depFile);
+    }
+  });
+}
+
+function getPackageName(changedFilePath) {
+  if (changedFilePath) {
+    console.log(`looking up; ${changedFilePath}`);
+    for (let project of rushPackages.projects) {
+      let projectPath = path.resolve(project.projectFolder);
+
+      if (changedFilePath.indexOf(projectPath) === 0) {
+        console.log(`found ${project.packageName}`);
+        return project.packageName;
+      }
+    }
+  }
+  console.log(`not found`)
+  return undefined;
+}
+
+cleanPackageDeps();
+
+const defaultSourceBranch = 'origin/master';
+const defaultRushParams = '--vso -p 4 --verbose';
+const rushLocation = 'node_modules/@microsoft/rush/bin/rush';
+
+let changedPackages = getChangedPackages(defaultSourceBranch);
+
+if (changedPackages) {
+  if (changedPackages.length === 0) {
+    /* Build all. */
+    console.log('Rebuilding all due to unrecognized updates.');
+    child_process.execSync(`node ${rushLocation} rebuild ${defaultRushParams}`, { stdio: [0, 1, 2] });
+  } else {
+    /* Build specifics. */
+    console.log('Building specific packages with detected changes.');
+    changedPackages.forEach(packageName => {
+      const buildCommand = `${rushLocation} build --from ${packageName} --to ${packageName} ${defaultRushParams}`;
+      console.log(`Running: ${buildCommand}`);
+      child_process.execSync(buildCommand, { stdio: [0, 1, 2] });
+    });
+  }
+} else {
+  console.log('No packages have been modified.');
+}

From e3c0c94c0a2bd1b2956481660302615d4e77eb78 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 29 May 2017 17:00:10 -0700
Subject: [PATCH 0029/1641] Ugh fixing versions, since 3.0.0 was already
 published...

---
 packages/example-app-base/package.json       | 4 ++--
 packages/example-component/package.json      | 5 +++--
 packages/office-ui-fabric-react/package.json | 4 ++--
 packages/styling/package.json                | 2 +-
 packages/utilities/package.json              | 2 +-
 5 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index ece06c66fae04..a156ad192c4b7 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -41,9 +41,9 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=0.0.1 <2.0.0",
-    "@uifabric/utilities": ">=1.10.2 <2.0.0",
+    "@uifabric/utilities": ">=3.0.0 <4.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=2.11.0-0 <3.0.0-0"
+    "office-ui-fabric-react": ">=3.0.0 <4.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index d4a022c8a2b22..081b2b74d72b8 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -30,7 +30,6 @@
     "mocha": "^3.2.0",
     "mocha-loader": "^1.1.1",
     "node-sass": "^4.5.0",
-    "office-ui-fabric-react": ">=2.34.2 <3.0.0",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
     "postcss-loader": "^1.3.3",
     "react": "^15.4.2",
@@ -49,5 +48,7 @@
     "react": "^0.14 || ^15.4.2-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
-  "dependencies": {}
+  "dependencies": {
+    "office-ui-fabric-react": ">=3.0.0 <4.0.0"
+  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 38c397722e568..c2bf144cbe68a 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "2.34.2",
+  "version": "3.0.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -71,7 +71,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=1.10.2 <2.0.0",
+    "@uifabric/utilities": ">=3.0.0 <4.0.0",
     "@uifabric/styling": ">=0.0.1 <2.0.0",
     "prop-types": "^15.5.10"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index e9df2c6883110..d78c3753793e2 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -45,7 +45,7 @@
     "webpack-split-by-path": "2.0.0"
   },
   "dependencies": {
-    "@uifabric/utilities": ">=1.10.2 <2.0.0",
+    "@uifabric/utilities": ">=3.0.0 <4.0.0",
     "glamor": "^2.20.24",
     "rtl-css-js": "^1.1.0"
   }
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 1ac35139b9c18..c95e7695ac8ff 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "1.10.2",
+  "version": "3.0.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 89660364911f368866f1cc5186673e89b15e661e Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 29 May 2017 17:00:29 -0700
Subject: [PATCH 0030/1641] Removing unnecessary change files.

---
 ...textfield-add-setSelectRange_2017-05-18-21-16.json | 11 -----------
 ...textfield-add-setSelectRange_2017-05-18-21-16.json | 11 -----------
 ...textfield-add-setSelectRange_2017-05-18-21-16.json | 11 -----------
 ...textfield-add-setSelectRange_2017-05-18-21-16.json | 11 -----------
 ...textfield-add-setSelectRange_2017-05-18-21-16.json |  0
 5 files changed, 44 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/joem-textfield-add-setSelectRange_2017-05-18-21-16.json
 delete mode 100644 common/changes/@uifabric/fabric-website/joem-textfield-add-setSelectRange_2017-05-18-21-16.json
 delete mode 100644 common/changes/@uifabric/styling/joem-textfield-add-setSelectRange_2017-05-18-21-16.json
 delete mode 100644 common/changes/@uifabric/utilities/joem-textfield-add-setSelectRange_2017-05-18-21-16.json
 rename common/changes/{office-ui-fabric-react => }/joem-textfield-add-setSelectRange_2017-05-18-21-16.json (100%)

diff --git a/common/changes/@uifabric/example-app-base/joem-textfield-add-setSelectRange_2017-05-18-21-16.json b/common/changes/@uifabric/example-app-base/joem-textfield-add-setSelectRange_2017-05-18-21-16.json
deleted file mode 100644
index db89bebafd713..0000000000000
--- a/common/changes/@uifabric/example-app-base/joem-textfield-add-setSelectRange_2017-05-18-21-16.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "joem@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/joem-textfield-add-setSelectRange_2017-05-18-21-16.json b/common/changes/@uifabric/fabric-website/joem-textfield-add-setSelectRange_2017-05-18-21-16.json
deleted file mode 100644
index be9847f74d2a6..0000000000000
--- a/common/changes/@uifabric/fabric-website/joem-textfield-add-setSelectRange_2017-05-18-21-16.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "joem@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/joem-textfield-add-setSelectRange_2017-05-18-21-16.json b/common/changes/@uifabric/styling/joem-textfield-add-setSelectRange_2017-05-18-21-16.json
deleted file mode 100644
index ad08fc23dbb50..0000000000000
--- a/common/changes/@uifabric/styling/joem-textfield-add-setSelectRange_2017-05-18-21-16.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "joem@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/joem-textfield-add-setSelectRange_2017-05-18-21-16.json b/common/changes/@uifabric/utilities/joem-textfield-add-setSelectRange_2017-05-18-21-16.json
deleted file mode 100644
index 44aabc466118d..0000000000000
--- a/common/changes/@uifabric/utilities/joem-textfield-add-setSelectRange_2017-05-18-21-16.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "joem@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/joem-textfield-add-setSelectRange_2017-05-18-21-16.json b/common/changes/joem-textfield-add-setSelectRange_2017-05-18-21-16.json
similarity index 100%
rename from common/changes/office-ui-fabric-react/joem-textfield-add-setSelectRange_2017-05-18-21-16.json
rename to common/changes/joem-textfield-add-setSelectRange_2017-05-18-21-16.json

From 4b1c1dc1c07fea26747f34b2898754fe8996c045 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 29 May 2017 19:28:49 -0700
Subject: [PATCH 0031/1641] Updating versions.

---
 apps/fabric-website/package.json       |  4 ++--
 apps/ssr-tests/package.json            |  2 +-
 apps/test-bundle-button/package.json   |  2 +-
 apps/todo-app/package.json             |  2 +-
 common/config/rush/npm-shrinkwrap.json | 23 ++++++++++++++++++++---
 packages/example-app-base/package.json |  2 +-
 6 files changed, 26 insertions(+), 9 deletions(-)

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 55031ac88f329..fa104d4223c4d 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -52,7 +52,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=2.34.2 <3.0.0",
-    "@uifabric/utilities": ">=1.10.2 <2.0.0"
+    "office-ui-fabric-react": ">=3.0.0 <4.0.0",
+    "@uifabric/utilities": ">=3.0.0 <4.0.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 260007057de1a..1a0718e9f3d1f 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -25,7 +25,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=2.34.2 <3.0.0",
+    "office-ui-fabric-react": ">=3.0.0 <4.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index ef7f92e85687c..2f4012eb140e8 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,6 +33,6 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=2.34.2 <3.0.0"
+    "office-ui-fabric-react": ">=3.0.0 <4.0.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 6d012c12f136e..e2034c9405494 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=2.34.2 <3.0.0",
+    "office-ui-fabric-react": ">=3.0.0 <4.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2"
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 770d39fbc07f8..90ef2722f8972 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -2821,9 +2821,9 @@
       "integrity": "sha1-gIrcLnnPhHOAabZGyyDsJ762KeA="
     },
     "css-loader": {
-      "version": "0.28.3",
-      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.3.tgz",
-      "integrity": "sha1-n9XguMQFtt+Se6EQOIcBXTYGQM4=",
+      "version": "0.28.4",
+      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.4.tgz",
+      "integrity": "sha1-bPNXkZLONV6LONX0Ldeh8uyJjQ8=",
       "dependencies": {
         "loader-utils": {
           "version": "1.1.0",
@@ -5061,6 +5061,23 @@
       "resolved": "https://registry.npmjs.org/icss-replace-symbols/-/icss-replace-symbols-1.1.0.tgz",
       "integrity": "sha1-Bupvg2ead0njhs/h/oEq5dsiPe0="
     },
+    "icss-utils": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-2.1.0.tgz",
+      "integrity": "sha1-g/Cg7DeL8yRheLbCrZE28TWxyWI=",
+      "dependencies": {
+        "postcss": {
+          "version": "6.0.1",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
+          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
+    },
     "ieee754": {
       "version": "1.1.8",
       "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.8.tgz",
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index a156ad192c4b7..6eb5d8951f270 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -44,6 +44,6 @@
     "@uifabric/utilities": ">=3.0.0 <4.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=3.0.0 <4.0.0"
+    "office-ui-fabric-react": ">=2.0.0 <3.0.0"
   }
 }
\ No newline at end of file

From 70f9c1bf808a931cba2cdcccd61b7f4e9244b9bb Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 29 May 2017 20:02:08 -0700
Subject: [PATCH 0032/1641] Downgrading npm version since the build machines
 seem to have an issue with the shrinkwrap.

---
 common/config/rush/npm-shrinkwrap.json | 7067 ++++++++++++------------
 package.json                           |    2 +-
 rush.json                              |    2 +-
 3 files changed, 3605 insertions(+), 3466 deletions(-)

diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 90ef2722f8972..e2f93e48306e8 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -1,8762 +1,8901 @@
 {
   "name": "rush-common",
   "version": "0.0.0",
-  "lockfileVersion": 1,
   "dependencies": {
     "@microsoft/api-extractor": {
       "version": "1.1.19",
-      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-1.1.19.tgz",
-      "integrity": "sha1-aBrxRDx7s/3xnRnPqvdd2QoD2dI="
+      "from": "@microsoft/api-extractor@>=1.1.19 <2.0.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-1.1.19.tgz"
     },
     "@microsoft/gulp-core-build": {
       "version": "2.5.3",
+      "from": "@microsoft/gulp-core-build@>=2.4.2 <3.0.0",
       "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.5.3.tgz",
-      "integrity": "sha1-26R2Li/7oxiYdlmTx3d7AVk8/rc=",
       "dependencies": {
         "@types/chai": {
           "version": "3.4.34",
-          "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz",
-          "integrity": "sha1-1TNXkoI7sJzd1eOMPSEbcJGDhU0="
+          "from": "@types/chai@3.4.34",
+          "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz"
         },
         "@types/mocha": {
           "version": "2.2.38",
-          "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz",
-          "integrity": "sha1-jBiPbjTC58Px0BJ9kI1aNuWmDck="
+          "from": "@types/mocha@2.2.38",
+          "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz"
         },
         "rimraf": {
           "version": "2.5.4",
-          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
-          "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
+          "from": "rimraf@>=2.5.4 <2.6.0",
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz"
         }
       }
     },
     "@microsoft/gulp-core-build-karma": {
       "version": "2.2.2",
+      "from": "@microsoft/gulp-core-build-karma@>=2.1.2 <3.0.0",
       "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-karma/-/gulp-core-build-karma-2.2.2.tgz",
-      "integrity": "sha1-L910uWl7x2VZjGwrOCxR9XBhSmg=",
       "dependencies": {
         "camelcase": {
           "version": "1.2.1",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
-          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
+          "from": "camelcase@>=1.0.2 <2.0.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz"
         },
         "cliui": {
           "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
-          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE="
+          "from": "cliui@>=2.1.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz"
         },
         "interpret": {
           "version": "0.6.6",
-          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz",
-          "integrity": "sha1-/s16GOfOXKar+5U+H4YhOknxYls="
+          "from": "interpret@>=0.6.4 <0.7.0",
+          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz"
         },
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "karma-sinon-chai": {
           "version": "1.2.4",
+          "from": "karma-sinon-chai@>=1.2.0 <1.3.0",
           "resolved": "https://registry.npmjs.org/karma-sinon-chai/-/karma-sinon-chai-1.2.4.tgz",
-          "integrity": "sha1-/qk19ivjNmzwJxyNi+UcDHDkCrw=",
           "dependencies": {
             "lolex": {
               "version": "1.6.0",
-              "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
-              "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
+              "from": "lolex@>=1.5.0 <2.0.0",
+              "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz"
             }
           }
         },
         "memory-fs": {
           "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz",
-          "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
+          "from": "memory-fs@>=0.3.0 <0.4.0",
+          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "sinon": {
           "version": "1.17.7",
+          "from": "sinon@>=1.17.3 <1.18.0",
           "resolved": "https://registry.npmjs.org/sinon/-/sinon-1.17.7.tgz",
-          "integrity": "sha1-RUKk9JugxFwF6y6d2dID4rjv4L8=",
           "dependencies": {
             "lolex": {
               "version": "1.3.2",
-              "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.3.2.tgz",
-              "integrity": "sha1-fD2mL/yzDw9agKJWbKJORdigHzE="
+              "from": "lolex@1.3.2",
+              "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.3.2.tgz"
             }
           }
         },
         "sinon-chai": {
           "version": "2.8.0",
-          "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.8.0.tgz",
-          "integrity": "sha1-Qyqbv9Uab8AHmPTSUmqCnAYGh6w="
+          "from": "sinon-chai@>=2.8.0 <2.9.0",
+          "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.8.0.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         },
         "supports-color": {
           "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "from": "supports-color@>=3.1.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
         },
         "uglify-js": {
           "version": "2.7.5",
+          "from": "uglify-js@>=2.7.3 <2.8.0",
           "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.7.5.tgz",
-          "integrity": "sha1-RhLAx7qu4rp8SH3kkErhIgefLKg=",
           "dependencies": {
             "async": {
               "version": "0.2.10",
-              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz",
-              "integrity": "sha1-trvgsGdLnXGXCMo43owjfLUmw9E="
+              "from": "async@>=0.2.6 <0.3.0",
+              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz"
             }
           }
         },
         "webpack": {
           "version": "1.13.3",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz",
-          "integrity": "sha1-55xG/lo3xcpwCEugiUxZXNy0KBU="
+          "from": "webpack@>=1.13.0 <1.14.0",
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz"
         },
         "window-size": {
           "version": "0.1.0",
-          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
-          "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
+          "from": "window-size@0.1.0",
+          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz"
         },
         "wordwrap": {
           "version": "0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
-          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
+          "from": "wordwrap@0.0.2",
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz"
         },
         "yargs": {
           "version": "3.10.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
-          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
+          "from": "yargs@>=3.10.0 <3.11.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz"
         }
       }
     },
     "@microsoft/gulp-core-build-sass": {
       "version": "2.0.8",
+      "from": "@microsoft/gulp-core-build-sass@>=2.0.3 <3.0.0",
       "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-2.0.8.tgz",
-      "integrity": "sha1-Xq3URcMEIKuHxvHd5KTc68aKEmQ=",
       "dependencies": {
         "autoprefixer": {
           "version": "6.3.7",
-          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz",
-          "integrity": "sha1-jt8xZt2f1hFlM2Ysi7NqA8DvyHQ="
+          "from": "autoprefixer@6.3.7",
+          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz"
         }
       }
     },
     "@microsoft/gulp-core-build-serve": {
       "version": "2.1.3",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-serve/-/gulp-core-build-serve-2.1.3.tgz",
-      "integrity": "sha1-k9LYWMLwL+3wxZSKal4KQ8XjqCU="
+      "from": "@microsoft/gulp-core-build-serve@>=2.0.3 <3.0.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-serve/-/gulp-core-build-serve-2.1.3.tgz"
     },
     "@microsoft/gulp-core-build-typescript": {
       "version": "2.4.4",
+      "from": "@microsoft/gulp-core-build-typescript@>=2.4.4 <3.0.0",
       "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-2.4.4.tgz",
-      "integrity": "sha1-DJ7UgdBtZNmv3KpEzsGoVI89tTs=",
       "dependencies": {
         "typescript": {
           "version": "2.1.6",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.1.6.tgz",
-          "integrity": "sha1-QMfm6eXaeWG3cYtVUF+crJSHpgc="
+          "from": "typescript@>=2.1.4 <2.2.0",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.1.6.tgz"
         }
       }
     },
     "@microsoft/gulp-core-build-webpack": {
       "version": "1.1.6",
+      "from": "@microsoft/gulp-core-build-webpack@>=1.1.2 <2.0.0",
       "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-webpack/-/gulp-core-build-webpack-1.1.6.tgz",
-      "integrity": "sha1-OloimWPldBfH8WPd99iNfPdm8uA=",
       "dependencies": {
         "camelcase": {
           "version": "1.2.1",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
-          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
+          "from": "camelcase@>=1.0.2 <2.0.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz"
         },
         "cliui": {
           "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
-          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE="
+          "from": "cliui@>=2.1.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz"
         },
         "interpret": {
           "version": "0.6.6",
-          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz",
-          "integrity": "sha1-/s16GOfOXKar+5U+H4YhOknxYls="
+          "from": "interpret@>=0.6.4 <0.7.0",
+          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz"
         },
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "memory-fs": {
           "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz",
-          "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
+          "from": "memory-fs@>=0.3.0 <0.4.0",
+          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         },
         "supports-color": {
           "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "from": "supports-color@>=3.1.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
         },
         "uglify-js": {
           "version": "2.7.5",
+          "from": "uglify-js@>=2.7.3 <2.8.0",
           "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.7.5.tgz",
-          "integrity": "sha1-RhLAx7qu4rp8SH3kkErhIgefLKg=",
           "dependencies": {
             "async": {
               "version": "0.2.10",
-              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz",
-              "integrity": "sha1-trvgsGdLnXGXCMo43owjfLUmw9E="
+              "from": "async@>=0.2.6 <0.3.0",
+              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz"
             }
           }
         },
         "webpack": {
           "version": "1.13.3",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz",
-          "integrity": "sha1-55xG/lo3xcpwCEugiUxZXNy0KBU="
+          "from": "webpack@>=1.13.0 <1.14.0",
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz"
         },
         "window-size": {
           "version": "0.1.0",
-          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
-          "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
+          "from": "window-size@0.1.0",
+          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz"
         },
         "wordwrap": {
           "version": "0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
-          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
+          "from": "wordwrap@0.0.2",
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz"
         },
         "yargs": {
           "version": "3.10.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
-          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
+          "from": "yargs@>=3.10.0 <3.11.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz"
         }
       }
     },
     "@microsoft/load-themed-styles": {
       "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.4.0.tgz",
-      "integrity": "sha1-GDC9288QFxLKJgIX5Vq3RKUgQdw="
+      "from": "@microsoft/load-themed-styles@>=1.2.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.4.0.tgz"
     },
     "@microsoft/loader-cased-file": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-cased-file/-/loader-cased-file-1.0.0.tgz",
-      "integrity": "sha1-2juX73tbnVGI1IT1a+Vs6QRzQSw="
+      "from": "@microsoft/loader-cased-file@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-cased-file/-/loader-cased-file-1.0.0.tgz"
     },
     "@microsoft/loader-load-themed-styles": {
       "version": "0.0.5",
+      "from": "@microsoft/loader-load-themed-styles@>=0.0.5 <0.1.0",
       "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-0.0.5.tgz",
-      "integrity": "sha1-L9eYt4pDdvyRL5ASaI33kX8cofg=",
       "dependencies": {
         "@microsoft/load-themed-styles": {
           "version": "1.2.2",
-          "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.2.2.tgz",
-          "integrity": "sha1-+i+hypxPDEliPi5IrTujBSRJWGc="
+          "from": "@microsoft/load-themed-styles@>=1.2.2 <1.3.0",
+          "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.2.2.tgz"
         }
       }
     },
     "@microsoft/loader-set-webpack-public-path": {
       "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-set-webpack-public-path/-/loader-set-webpack-public-path-0.1.7.tgz",
-      "integrity": "sha1-elXNxsfwP05ZZyk+XKLAppxIxLI="
+      "from": "@microsoft/loader-set-webpack-public-path@>=0.1.7 <0.2.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-set-webpack-public-path/-/loader-set-webpack-public-path-0.1.7.tgz"
     },
     "@microsoft/rush-lib": {
       "version": "1.8.3",
+      "from": "@microsoft/rush-lib@>=1.8.3 <1.9.0",
       "resolved": "https://registry.npmjs.org/@microsoft/rush-lib/-/rush-lib-1.8.3.tgz",
-      "integrity": "sha1-+40E9QAknaLY7vXhwfj2Guy3t4Y=",
       "dependencies": {
         "@types/chai": {
           "version": "3.4.34",
-          "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz",
-          "integrity": "sha1-1TNXkoI7sJzd1eOMPSEbcJGDhU0="
+          "from": "@types/chai@3.4.34",
+          "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz"
         },
         "@types/fs-extra": {
           "version": "0.0.34",
-          "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.34.tgz",
-          "integrity": "sha1-Tv8v9bBqWjv8VErdOm7TTN+JIzU="
+          "from": "@types/fs-extra@0.0.34",
+          "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.34.tgz"
         },
         "@types/mocha": {
           "version": "2.2.38",
-          "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz",
-          "integrity": "sha1-jBiPbjTC58Px0BJ9kI1aNuWmDck="
+          "from": "@types/mocha@2.2.38",
+          "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz"
         },
         "rimraf": {
           "version": "2.5.4",
-          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
-          "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
+          "from": "rimraf@>=2.5.2 <2.6.0",
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz"
         },
         "semver": {
           "version": "5.2.0",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.2.0.tgz",
-          "integrity": "sha1-KBmVuAwUSCCUFd28TPUMJpzvVcU="
+          "from": "semver@>=5.2.0 <5.3.0",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.2.0.tgz"
         }
       }
     },
     "@microsoft/sp-build-common": {
       "version": "1.0.0",
+      "from": "@microsoft/sp-build-common@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/@microsoft/sp-build-common/-/sp-build-common-1.0.0.tgz",
-      "integrity": "sha1-LYMxudMf39F+CmgR9/Q4LQIIYPQ=",
       "dependencies": {
         "@types/yargs": {
           "version": "0.0.35",
-          "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.35.tgz",
-          "integrity": "sha1-QHczV2rO1IlfutZ6Pwr2M9Lfy60="
+          "from": "@types/yargs@0.0.35",
+          "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.35.tgz"
         },
         "@types/z-schema": {
           "version": "3.16.20-alpha",
-          "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.20-alpha.tgz",
-          "integrity": "sha1-NvWIzMon2Oht1rtZWpc67eiAN2Y="
+          "from": "@types/z-schema@3.16.20-alpha",
+          "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.20-alpha.tgz"
         }
       }
     },
     "@microsoft/sp-build-core-tasks": {
       "version": "1.0.1",
+      "from": "@microsoft/sp-build-core-tasks@>=1.0.1 <1.1.0",
       "resolved": "https://registry.npmjs.org/@microsoft/sp-build-core-tasks/-/sp-build-core-tasks-1.0.1.tgz",
-      "integrity": "sha1-lw0TAjg9Sph6HOzM+O47NRQR2k0=",
       "dependencies": {
         "@microsoft/load-themed-styles": {
           "version": "1.2.2",
-          "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.2.2.tgz",
-          "integrity": "sha1-+i+hypxPDEliPi5IrTujBSRJWGc="
+          "from": "@microsoft/load-themed-styles@>=1.2.2 <1.3.0",
+          "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.2.2.tgz"
         },
         "camelcase": {
           "version": "1.2.1",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
-          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
+          "from": "camelcase@>=1.0.2 <2.0.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz"
         },
         "cliui": {
           "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
-          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE="
+          "from": "cliui@>=2.1.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz"
         },
         "css-loader": {
           "version": "0.24.0",
-          "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.24.0.tgz",
-          "integrity": "sha1-evqvtMD7L5CzNe0Qocd7NNZIQ/4="
+          "from": "css-loader@>=0.24.0 <0.25.0",
+          "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.24.0.tgz"
         },
         "css-selector-tokenizer": {
           "version": "0.6.0",
-          "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.6.0.tgz",
-          "integrity": "sha1-ZEX1gseTDSQdzFAHpD1vy48HMVI="
+          "from": "css-selector-tokenizer@>=0.6.0 <0.7.0",
+          "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.6.0.tgz"
         },
         "debug": {
           "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
+          "from": "debug@>=2.2.0 <2.3.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
         },
         "es6-promise": {
           "version": "3.1.2",
-          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-3.1.2.tgz",
-          "integrity": "sha1-eV4lzrR/e6uyY9FRr77dktGOagc="
+          "from": "es6-promise@3.1.2",
+          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-3.1.2.tgz"
         },
         "finalhandler": {
           "version": "0.4.1",
-          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.4.1.tgz",
-          "integrity": "sha1-haF8bFmpRxfSYtYSMNSw6+PUoU0="
+          "from": "finalhandler@>=0.4.1 <0.5.0",
+          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.4.1.tgz"
         },
         "glob": {
           "version": "7.0.6",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.0.6.tgz",
-          "integrity": "sha1-IRuvr0nlJbjNkyYNFKsTYVKz9Xo="
+          "from": "glob@>=7.0.5 <7.1.0",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.0.6.tgz"
         },
         "http-errors": {
           "version": "1.3.1",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
-          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
+          "from": "http-errors@>=1.3.1 <1.4.0",
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
         },
         "interpret": {
           "version": "0.6.6",
-          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz",
-          "integrity": "sha1-/s16GOfOXKar+5U+H4YhOknxYls="
+          "from": "interpret@>=0.6.4 <0.7.0",
+          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz"
         },
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "memory-fs": {
           "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz",
-          "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
+          "from": "memory-fs@>=0.3.0 <0.4.0",
+          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz"
         },
         "mime": {
           "version": "1.3.4",
-          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz",
-          "integrity": "sha1-EV+eO2s9rylZmDyzjxSaLUDrXVM="
+          "from": "mime@1.3.4",
+          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz"
         },
         "ms": {
           "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+          "from": "ms@0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
         },
         "node-uuid": {
           "version": "1.4.8",
-          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz",
-          "integrity": "sha1-sEDrCSOWivq/jTL7HxfxFn/auQc="
+          "from": "node-uuid@>=1.4.7 <1.5.0",
+          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz"
         },
         "range-parser": {
           "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.0.3.tgz",
-          "integrity": "sha1-aHKCNTXGkuLCoBA4Jq/YLC4P8XU="
+          "from": "range-parser@>=1.0.3 <1.1.0",
+          "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.0.3.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "resolve": {
           "version": "1.1.7",
-          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz",
-          "integrity": "sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs="
+          "from": "resolve@>=1.1.7 <1.2.0",
+          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz"
         },
         "rimraf": {
           "version": "2.5.4",
-          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
-          "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
+          "from": "rimraf@>=2.5.2 <2.6.0",
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz"
         },
         "send": {
           "version": "0.13.2",
-          "resolved": "https://registry.npmjs.org/send/-/send-0.13.2.tgz",
-          "integrity": "sha1-dl52B8gFVFK7pvCwUllTUJhgNt4="
+          "from": "send@0.13.2",
+          "resolved": "https://registry.npmjs.org/send/-/send-0.13.2.tgz"
         },
         "serve-static": {
           "version": "1.10.3",
-          "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.10.3.tgz",
-          "integrity": "sha1-zlpuzTEB/tXsCYJ9rCKpwpv7BTU="
+          "from": "serve-static@>=1.10.2 <1.11.0",
+          "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.10.3.tgz"
         },
         "statuses": {
           "version": "1.2.1",
-          "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.2.1.tgz",
-          "integrity": "sha1-3e1FzBglbVHtQK7BQkidXGECbSg="
+          "from": "statuses@>=1.2.1 <1.3.0",
+          "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.2.1.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         },
         "supports-color": {
           "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "from": "supports-color@>=3.1.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
         },
         "uglify-js": {
           "version": "2.7.5",
+          "from": "uglify-js@>=2.7.3 <2.8.0",
           "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.7.5.tgz",
-          "integrity": "sha1-RhLAx7qu4rp8SH3kkErhIgefLKg=",
           "dependencies": {
             "async": {
               "version": "0.2.10",
-              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz",
-              "integrity": "sha1-trvgsGdLnXGXCMo43owjfLUmw9E="
+              "from": "async@>=0.2.6 <0.3.0",
+              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz"
             }
           }
         },
         "webpack": {
           "version": "1.13.3",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz",
-          "integrity": "sha1-55xG/lo3xcpwCEugiUxZXNy0KBU="
+          "from": "webpack@>=1.13.0 <1.14.0",
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz"
         },
         "window-size": {
           "version": "0.1.0",
-          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
-          "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
+          "from": "window-size@0.1.0",
+          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz"
         },
         "wordwrap": {
           "version": "0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
-          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
+          "from": "wordwrap@0.0.2",
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz"
         },
         "yargs": {
           "version": "3.10.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
-          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
+          "from": "yargs@>=3.10.0 <3.11.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz"
         }
       }
     },
     "@microsoft/sp-build-web": {
       "version": "1.0.1",
+      "from": "@microsoft/sp-build-web@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/@microsoft/sp-build-web/-/sp-build-web-1.0.1.tgz",
-      "integrity": "sha1-wLbn7gPT45eH38x9FZAn0UuhaRM=",
       "dependencies": {
         "@types/yargs": {
           "version": "0.0.35",
-          "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.35.tgz",
-          "integrity": "sha1-QHczV2rO1IlfutZ6Pwr2M9Lfy60="
+          "from": "@types/yargs@0.0.35",
+          "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.35.tgz"
         }
       }
     },
     "@microsoft/sp-module-interfaces": {
       "version": "1.0.0",
+      "from": "@microsoft/sp-module-interfaces@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/@microsoft/sp-module-interfaces/-/sp-module-interfaces-1.0.0.tgz",
-      "integrity": "sha1-cHc83IuclD92RemXChcyud8gKbw=",
       "dependencies": {
         "@types/z-schema": {
           "version": "3.16.20-alpha",
-          "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.20-alpha.tgz",
-          "integrity": "sha1-NvWIzMon2Oht1rtZWpc67eiAN2Y="
+          "from": "@types/z-schema@3.16.20-alpha",
+          "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.20-alpha.tgz"
         }
       }
     },
     "@microsoft/sp-polyfills": {
       "version": "1.0.0",
+      "from": "@microsoft/sp-polyfills@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/@microsoft/sp-polyfills/-/sp-polyfills-1.0.0.tgz",
-      "integrity": "sha1-tB/N8Njkgbib46/reNdaBe4Zkqs=",
       "dependencies": {
         "es6-promise": {
           "version": "3.1.2",
-          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-3.1.2.tgz",
-          "integrity": "sha1-eV4lzrR/e6uyY9FRr77dktGOagc="
+          "from": "es6-promise@3.1.2",
+          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-3.1.2.tgz"
         },
         "whatwg-fetch": {
           "version": "0.11.0",
-          "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-0.11.0.tgz",
-          "integrity": "sha1-RrHRjQqpmVWXHvGi9arFBq3SiBU="
+          "from": "whatwg-fetch@0.11.0",
+          "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-0.11.0.tgz"
         }
       }
     },
     "@microsoft/sp-tslint-rules": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/sp-tslint-rules/-/sp-tslint-rules-1.0.0.tgz",
-      "integrity": "sha1-Nas2DM1FUhb4e/YVDljVZlVZsjA="
+      "from": "@microsoft/sp-tslint-rules@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/sp-tslint-rules/-/sp-tslint-rules-1.0.0.tgz"
     },
     "@microsoft/stream-collator": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@microsoft/stream-collator/-/stream-collator-1.0.2.tgz",
-      "integrity": "sha1-Qqwrj4yx79VSDd209FGZcBLLgwA="
+      "from": "@microsoft/stream-collator@>=1.0.2 <1.1.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/stream-collator/-/stream-collator-1.0.2.tgz"
     },
     "@microsoft/web-library-build": {
       "version": "3.0.2",
+      "from": "@microsoft/web-library-build@>=3.0.0-0 <4.0.0-0",
       "resolved": "https://registry.npmjs.org/@microsoft/web-library-build/-/web-library-build-3.0.2.tgz",
-      "integrity": "sha1-DldYaol/ddjdDAKdKVtBapg4f5w=",
       "dependencies": {
         "@microsoft/api-extractor": {
           "version": "2.0.6",
-          "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.0.6.tgz",
-          "integrity": "sha1-BVN2DgbyuUGn9zbjP+wVK1/BQoQ="
+          "from": "@microsoft/api-extractor@>=2.0.5 <3.0.0",
+          "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.0.6.tgz"
         },
         "@microsoft/gulp-core-build-sass": {
           "version": "3.1.2",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.1.2.tgz",
-          "integrity": "sha1-msehN3WBLY3s1/BOQrfy1BKjnCc="
+          "from": "@microsoft/gulp-core-build-sass@>=3.1.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.1.2.tgz"
         },
         "@microsoft/gulp-core-build-typescript": {
           "version": "3.1.1",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.1.1.tgz",
-          "integrity": "sha1-e3gdjlKeSQzz5hB5eh+7fuZx01s="
+          "from": "@microsoft/gulp-core-build-typescript@>=3.1.1 <4.0.0",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.1.1.tgz"
         },
         "ansi-align": {
           "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-2.0.0.tgz",
-          "integrity": "sha1-w2rsy6VjuJzrVW82kPCx2eNUf38="
+          "from": "ansi-align@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-2.0.0.tgz"
         },
         "autoprefixer": {
           "version": "6.3.7",
-          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz",
-          "integrity": "sha1-jt8xZt2f1hFlM2Ysi7NqA8DvyHQ="
+          "from": "autoprefixer@6.3.7",
+          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz"
         },
         "boxen": {
           "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/boxen/-/boxen-1.1.0.tgz",
-          "integrity": "sha1-sbad1SIwXoB6md7ud329blFnsQI="
+          "from": "boxen@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/boxen/-/boxen-1.1.0.tgz"
         },
         "camelcase": {
           "version": "4.1.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
-          "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
+          "from": "camelcase@>=4.0.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz"
         },
         "clean-css": {
           "version": "4.1.3",
-          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.3.tgz",
-          "integrity": "sha1-B8/omA7bINRV3cI6rc8eBMblCc4="
+          "from": "clean-css@>=4.0.9 <5.0.0",
+          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.3.tgz"
         },
         "configstore": {
           "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.0.tgz",
-          "integrity": "sha1-Rd+QcHPibfoc9LLVL1tgVF6qEdE="
+          "from": "configstore@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.0.tgz"
         },
         "dot-prop": {
           "version": "4.1.1",
-          "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-4.1.1.tgz",
-          "integrity": "sha1-qEk/C3te7sglJbXHWH+n3nyoWcE="
+          "from": "dot-prop@>=4.1.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-4.1.1.tgz"
         },
         "findup-sync": {
           "version": "0.3.0",
+          "from": "findup-sync@>=0.3.0 <0.4.0",
           "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.3.0.tgz",
-          "integrity": "sha1-N5MKpdgWt3fANEXhlmzGeQpMCxY=",
           "dependencies": {
             "glob": {
               "version": "5.0.15",
-              "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
-              "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
+              "from": "glob@>=5.0.0 <5.1.0",
+              "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
             }
           }
         },
         "got": {
           "version": "6.7.1",
-          "resolved": "https://registry.npmjs.org/got/-/got-6.7.1.tgz",
-          "integrity": "sha1-JAzQV4WpoY5WHcG0S0HHY+8ejbA="
+          "from": "got@>=6.7.1 <7.0.0",
+          "resolved": "https://registry.npmjs.org/got/-/got-6.7.1.tgz"
         },
         "gulp-clean-css": {
           "version": "3.0.4",
-          "resolved": "https://registry.npmjs.org/gulp-clean-css/-/gulp-clean-css-3.0.4.tgz",
-          "integrity": "sha1-DFrY0EVAfIjzwrnwNXCWOWfc/VQ="
+          "from": "gulp-clean-css@>=3.0.4 <3.1.0",
+          "resolved": "https://registry.npmjs.org/gulp-clean-css/-/gulp-clean-css-3.0.4.tgz"
         },
         "gulp-postcss": {
           "version": "6.3.0",
-          "resolved": "https://registry.npmjs.org/gulp-postcss/-/gulp-postcss-6.3.0.tgz",
-          "integrity": "sha1-M+6XI+WcMC8z1wf8S3OYsQ8DK/8="
+          "from": "gulp-postcss@>=6.3.0 <6.4.0",
+          "resolved": "https://registry.npmjs.org/gulp-postcss/-/gulp-postcss-6.3.0.tgz"
         },
         "gulp-sass": {
           "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/gulp-sass/-/gulp-sass-3.1.0.tgz",
-          "integrity": "sha1-U9xLaKH13f5EJKtMJHZVJpqLdLc="
+          "from": "gulp-sass@>=3.1.0 <3.2.0",
+          "resolved": "https://registry.npmjs.org/gulp-sass/-/gulp-sass-3.1.0.tgz"
         },
         "is-fullwidth-code-point": {
           "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
-          "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8="
+          "from": "is-fullwidth-code-point@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz"
         },
         "latest-version": {
           "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-3.1.0.tgz",
-          "integrity": "sha1-ogU4P+oyKzO1rjsYq+4NwvNW7hU="
+          "from": "latest-version@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-3.1.0.tgz"
         },
         "lazy-req": {
           "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/lazy-req/-/lazy-req-2.0.0.tgz",
-          "integrity": "sha1-yUUKNj7N2i5vDHATKtTzf48G8rQ="
+          "from": "lazy-req@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/lazy-req/-/lazy-req-2.0.0.tgz"
         },
         "package-json": {
           "version": "4.0.1",
-          "resolved": "https://registry.npmjs.org/package-json/-/package-json-4.0.1.tgz",
-          "integrity": "sha1-iGmgQBJTZhxMTKPabCEh7VVfXu0="
+          "from": "package-json@>=4.0.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/package-json/-/package-json-4.0.1.tgz"
         },
         "postcss-modules": {
           "version": "0.6.4",
-          "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.6.4.tgz",
-          "integrity": "sha1-d6WLt3uhtDkrJwwLWYUv116JqLQ="
+          "from": "postcss-modules@>=0.6.4 <0.7.0",
+          "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.6.4.tgz"
         },
         "string-width": {
           "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.0.0.tgz",
-          "integrity": "sha1-Y1xUNsxypuDDh87KJ41OLuxSaH4="
+          "from": "string-width@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.0.0.tgz"
         },
         "timed-out": {
           "version": "4.0.1",
-          "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-4.0.1.tgz",
-          "integrity": "sha1-8y6srFoXW+ol1/q1Zas+2HQe9W8="
+          "from": "timed-out@>=4.0.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-4.0.1.tgz"
         },
         "tslint": {
           "version": "4.5.1",
-          "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.5.1.tgz",
-          "integrity": "sha1-BTVocb7yOkNJBnNABvwYgza6gks="
+          "from": "tslint@>=4.5.1 <4.6.0",
+          "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.5.1.tgz"
         },
         "typescript": {
           "version": "2.2.2",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz",
-          "integrity": "sha1-YGAiUIR5tV/6NotY/uljoD39eww="
+          "from": "typescript@>=2.2.2 <2.3.0",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
         },
         "unzip-response": {
           "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-2.0.1.tgz",
-          "integrity": "sha1-0vD3N9FrBhXnKmk17QQhRXLVb5c="
+          "from": "unzip-response@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-2.0.1.tgz"
         },
         "update-notifier": {
           "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-2.1.0.tgz",
-          "integrity": "sha1-7AweU1NrdmR6JLd8uDlm2TFRI9k="
+          "from": "update-notifier@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-2.1.0.tgz"
         },
         "write-file-atomic": {
           "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.1.0.tgz",
-          "integrity": "sha512-0TZ20a+xcIl4u0+Mj5xDH2yOWdmQiXlKf9Hm+TgDXjTMsEYb+gDrmb8e8UNAzMCitX8NBqG4Z/FUQIyzv/R1JQ=="
+          "from": "write-file-atomic@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.1.0.tgz"
         },
         "xdg-basedir": {
           "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-3.0.0.tgz",
-          "integrity": "sha1-SWsswQnsqNus/i3HK2A8F8WHCtQ="
+          "from": "xdg-basedir@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-3.0.0.tgz"
         }
       }
     },
     "@rush-temp/example-app-base": {
-      "version": "file:projects/example-app-base",
+      "version": "0.0.0",
+      "from": "projects/example-app-base",
+      "resolved": "file:projects/example-app-base",
       "dependencies": {
         "async": {
           "version": "0.9.2",
-          "bundled": true
+          "from": "async@>=0.9.0 <0.10.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
         },
         "debug": {
           "version": "2.6.0",
-          "bundled": true
-        },
-        "es6-promise": {
-          "version": "4.1.0",
-          "bundled": true
+          "from": "debug@2.6.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
         },
         "glob": {
           "version": "7.1.1",
-          "bundled": true
+          "from": "glob@7.1.1",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
         },
         "mocha": {
           "version": "3.3.0",
-          "bundled": true
+          "from": "mocha@>=3.3.0 <3.4.0",
+          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz"
         },
         "ms": {
           "version": "0.7.2",
-          "bundled": true
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
         },
         "source-map": {
           "version": "0.1.43",
-          "bundled": true
+          "from": "source-map@>=0.1.33 <0.2.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "bundled": true
+          "from": "source-map-loader@0.2.1",
+          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
         },
         "supports-color": {
           "version": "3.1.2",
-          "bundled": true
+          "from": "supports-color@3.1.2",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
         },
         "typescript": {
           "version": "2.2.2",
-          "bundled": true
+          "from": "typescript@2.2.2",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
         }
       }
     },
     "@rush-temp/example-component": {
-      "version": "file:projects/example-component",
+      "version": "0.0.0",
+      "from": "projects/example-component",
+      "resolved": "file:projects/example-component",
       "dependencies": {
         "acorn": {
           "version": "5.0.3",
-          "bundled": true
+          "from": "acorn@>=5.0.0 <6.0.0",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
         },
         "async": {
           "version": "2.4.1",
-          "bundled": true
+          "from": "async@>=2.1.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
         },
         "camelcase": {
           "version": "3.0.0",
-          "bundled": true
+          "from": "camelcase@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
         },
         "constants-browserify": {
           "version": "1.0.0",
-          "bundled": true
+          "from": "constants-browserify@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
         },
         "crypto-browserify": {
           "version": "3.11.0",
-          "bundled": true
+          "from": "crypto-browserify@>=3.11.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
         },
         "debug": {
           "version": "2.6.0",
-          "bundled": true
+          "from": "debug@2.6.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
         },
         "enhanced-resolve": {
           "version": "3.1.0",
-          "bundled": true
+          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
         },
         "glob": {
           "version": "7.1.1",
-          "bundled": true
+          "from": "glob@7.1.1",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
         },
         "https-browserify": {
           "version": "0.0.1",
-          "bundled": true
+          "from": "https-browserify@0.0.1",
+          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
         },
         "isarray": {
           "version": "1.0.0",
-          "bundled": true
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "mocha": {
           "version": "3.4.2",
-          "bundled": true
+          "from": "mocha@>=3.2.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.4.2.tgz"
         },
         "ms": {
           "version": "0.7.2",
-          "bundled": true
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
         },
         "node-libs-browser": {
           "version": "2.0.0",
-          "bundled": true
+          "from": "node-libs-browser@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
         },
         "os-browserify": {
           "version": "0.2.1",
-          "bundled": true
+          "from": "os-browserify@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "bundled": true,
+          "from": "readable-stream@>=2.0.5 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "bundled": true
+              "from": "string_decoder@>=1.0.0 <1.1.0",
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
             }
           }
         },
         "stream-browserify": {
           "version": "2.0.1",
-          "bundled": true
+          "from": "stream-browserify@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
         },
         "supports-color": {
           "version": "3.1.2",
-          "bundled": true
+          "from": "supports-color@3.1.2",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
         },
         "tapable": {
           "version": "0.2.6",
-          "bundled": true
+          "from": "tapable@>=0.2.5 <0.3.0",
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
         },
         "timers-browserify": {
           "version": "2.0.2",
-          "bundled": true
+          "from": "timers-browserify@>=2.0.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
         },
         "typescript": {
           "version": "2.2.2",
-          "bundled": true
+          "from": "typescript@2.2.2",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
         },
         "url": {
           "version": "0.11.0",
-          "bundled": true,
+          "from": "url@>=0.11.0 <0.12.0",
+          "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "bundled": true
+              "from": "punycode@1.3.2",
+              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
             }
           }
         },
         "watchpack": {
           "version": "1.3.1",
-          "bundled": true
+          "from": "watchpack@>=1.3.1 <2.0.0",
+          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz"
         },
         "webpack": {
           "version": "2.6.1",
-          "bundled": true
+          "from": "webpack@>=2.4.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz"
         },
         "yargs": {
           "version": "6.6.0",
-          "bundled": true
+          "from": "yargs@>=6.0.0 <7.0.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
         },
         "yargs-parser": {
           "version": "4.2.1",
-          "bundled": true
+          "from": "yargs-parser@>=4.2.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
         }
       }
     },
     "@rush-temp/fabric-website": {
-      "version": "file:projects/fabric-website",
+      "version": "0.0.0",
+      "from": "projects/fabric-website",
+      "resolved": "file:projects/fabric-website",
       "dependencies": {
         "async": {
           "version": "0.9.2",
-          "bundled": true
+          "from": "async@>=0.9.0 <0.10.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
         },
         "debug": {
           "version": "2.6.0",
-          "bundled": true
-        },
-        "es6-promise": {
-          "version": "4.1.0",
-          "bundled": true
+          "from": "debug@2.6.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
         },
         "glob": {
           "version": "7.1.1",
-          "bundled": true
+          "from": "glob@7.1.1",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
         },
         "mocha": {
           "version": "3.3.0",
-          "bundled": true
+          "from": "mocha@>=3.3.0 <3.4.0",
+          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz"
         },
         "ms": {
           "version": "0.7.2",
-          "bundled": true
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
         },
         "source-map": {
           "version": "0.1.43",
-          "bundled": true
+          "from": "source-map@>=0.1.33 <0.2.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "bundled": true
+          "from": "source-map-loader@0.2.1",
+          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
         },
         "supports-color": {
           "version": "3.1.2",
-          "bundled": true
+          "from": "supports-color@3.1.2",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
         },
         "typescript": {
           "version": "2.2.2",
-          "bundled": true
+          "from": "typescript@2.2.2",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
         }
       }
     },
     "@rush-temp/office-ui-fabric-react": {
-      "version": "file:projects/office-ui-fabric-react",
+      "version": "0.0.0",
+      "from": "projects/office-ui-fabric-react",
+      "resolved": "file:projects/office-ui-fabric-react",
       "dependencies": {
         "acorn": {
           "version": "5.0.3",
-          "bundled": true
+          "from": "acorn@>=5.0.0 <6.0.0",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
         },
         "async": {
           "version": "0.9.2",
-          "bundled": true
+          "from": "async@>=0.9.0 <0.10.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
         },
         "camelcase": {
           "version": "3.0.0",
-          "bundled": true
+          "from": "camelcase@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
         },
         "constants-browserify": {
           "version": "1.0.0",
-          "bundled": true
+          "from": "constants-browserify@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
         },
         "crypto-browserify": {
           "version": "3.11.0",
-          "bundled": true
+          "from": "crypto-browserify@>=3.11.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
         },
         "debug": {
           "version": "2.6.0",
-          "bundled": true
+          "from": "debug@2.6.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
         },
         "enhanced-resolve": {
           "version": "3.1.0",
-          "bundled": true
-        },
-        "es6-promise": {
-          "version": "4.1.0",
-          "bundled": true
+          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
         },
         "glob": {
           "version": "7.1.1",
-          "bundled": true
+          "from": "glob@7.1.1",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
         },
         "https-browserify": {
           "version": "0.0.1",
-          "bundled": true
+          "from": "https-browserify@0.0.1",
+          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
         },
         "isarray": {
           "version": "1.0.0",
-          "bundled": true
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "mocha": {
           "version": "3.4.2",
-          "bundled": true
+          "from": "mocha@>=3.2.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.4.2.tgz"
         },
         "ms": {
           "version": "0.7.2",
-          "bundled": true
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
         },
         "node-libs-browser": {
           "version": "2.0.0",
-          "bundled": true
+          "from": "node-libs-browser@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
         },
         "os-browserify": {
           "version": "0.2.1",
-          "bundled": true
+          "from": "os-browserify@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "bundled": true,
+          "from": "readable-stream@>=2.0.5 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "bundled": true
+              "from": "string_decoder@>=1.0.0 <1.1.0",
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
             }
           }
         },
         "source-map": {
           "version": "0.1.43",
-          "bundled": true
+          "from": "source-map@>=0.1.33 <0.2.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "bundled": true
+          "from": "source-map-loader@0.2.1",
+          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
         },
         "stream-browserify": {
           "version": "2.0.1",
-          "bundled": true
+          "from": "stream-browserify@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
         },
         "supports-color": {
           "version": "3.1.2",
-          "bundled": true
+          "from": "supports-color@3.1.2",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
         },
         "tapable": {
           "version": "0.2.6",
-          "bundled": true
+          "from": "tapable@>=0.2.5 <0.3.0",
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
         },
         "timers-browserify": {
           "version": "2.0.2",
-          "bundled": true
+          "from": "timers-browserify@>=2.0.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
         },
         "typescript": {
           "version": "2.2.2",
-          "bundled": true
+          "from": "typescript@2.2.2",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
         },
         "url": {
           "version": "0.11.0",
-          "bundled": true,
+          "from": "url@>=0.11.0 <0.12.0",
+          "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "bundled": true
+              "from": "punycode@1.3.2",
+              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
             }
           }
         },
         "watchpack": {
           "version": "1.3.1",
-          "bundled": true,
+          "from": "watchpack@>=1.3.1 <2.0.0",
+          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz",
           "dependencies": {
             "async": {
               "version": "2.4.1",
-              "bundled": true
+              "from": "async@>=2.1.2 <3.0.0",
+              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
             }
           }
         },
         "webpack": {
           "version": "2.6.1",
-          "bundled": true,
+          "from": "webpack@>=2.4.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz",
           "dependencies": {
             "async": {
               "version": "2.4.1",
-              "bundled": true
+              "from": "async@>=2.1.2 <3.0.0",
+              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
             },
             "source-map": {
               "version": "0.5.6",
-              "bundled": true
+              "from": "source-map@^0.5.3",
+              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
             }
           }
         },
         "yargs": {
           "version": "6.6.0",
-          "bundled": true
+          "from": "yargs@>=6.0.0 <7.0.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
         },
         "yargs-parser": {
           "version": "4.2.1",
-          "bundled": true
+          "from": "yargs-parser@>=4.2.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
         }
       }
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
-      "version": "file:projects/office-ui-fabric-react-tslint"
+      "version": "0.0.0",
+      "from": "projects/office-ui-fabric-react-tslint",
+      "resolved": "file:projects/office-ui-fabric-react-tslint"
     },
     "@rush-temp/ssr-tests": {
-      "version": "file:projects/ssr-tests",
+      "version": "0.0.0",
+      "from": "projects/ssr-tests",
+      "resolved": "file:projects/ssr-tests",
       "dependencies": {
         "acorn": {
           "version": "5.0.3",
-          "bundled": true
+          "from": "acorn@>=5.0.0 <6.0.0",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
         },
         "async": {
           "version": "2.4.1",
-          "bundled": true
+          "from": "async@>=2.1.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
         },
         "camelcase": {
           "version": "3.0.0",
-          "bundled": true
+          "from": "camelcase@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
         },
         "constants-browserify": {
           "version": "1.0.0",
-          "bundled": true
+          "from": "constants-browserify@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
         },
         "crypto-browserify": {
           "version": "3.11.0",
-          "bundled": true
+          "from": "crypto-browserify@>=3.11.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
         },
         "debug": {
           "version": "2.6.0",
-          "bundled": true
+          "from": "debug@2.6.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
         },
         "enhanced-resolve": {
           "version": "3.1.0",
-          "bundled": true
-        },
-        "es6-promise": {
-          "version": "4.1.0",
-          "bundled": true
+          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
         },
         "glob": {
           "version": "7.1.1",
-          "bundled": true
+          "from": "glob@7.1.1",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
         },
         "https-browserify": {
           "version": "0.0.1",
-          "bundled": true
+          "from": "https-browserify@0.0.1",
+          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
         },
         "isarray": {
           "version": "1.0.0",
-          "bundled": true
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "mocha": {
           "version": "3.3.0",
-          "bundled": true
+          "from": "mocha@>=3.3.0 <3.4.0",
+          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz"
         },
         "ms": {
           "version": "0.7.2",
-          "bundled": true
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
         },
         "node-libs-browser": {
           "version": "2.0.0",
-          "bundled": true
+          "from": "node-libs-browser@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
         },
         "os-browserify": {
           "version": "0.2.1",
-          "bundled": true
+          "from": "os-browserify@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "bundled": true,
+          "from": "readable-stream@>=2.0.5 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "bundled": true
+              "from": "string_decoder@>=1.0.0 <1.1.0",
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
             }
           }
         },
         "stream-browserify": {
           "version": "2.0.1",
-          "bundled": true
+          "from": "stream-browserify@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
         },
         "supports-color": {
           "version": "3.1.2",
-          "bundled": true
+          "from": "supports-color@3.1.2",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
         },
         "tapable": {
           "version": "0.2.6",
-          "bundled": true
+          "from": "tapable@>=0.2.5 <0.3.0",
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
         },
         "timers-browserify": {
           "version": "2.0.2",
-          "bundled": true
+          "from": "timers-browserify@>=2.0.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
         },
         "url": {
           "version": "0.11.0",
-          "bundled": true,
+          "from": "url@>=0.11.0 <0.12.0",
+          "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "bundled": true
+              "from": "punycode@1.3.2",
+              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
             }
           }
         },
         "watchpack": {
           "version": "1.3.1",
-          "bundled": true
+          "from": "watchpack@>=1.3.1 <2.0.0",
+          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz"
         },
         "webpack": {
           "version": "2.6.1",
-          "bundled": true
+          "from": "webpack@>=2.4.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz"
         },
         "yargs": {
           "version": "6.6.0",
-          "bundled": true
+          "from": "yargs@>=6.0.0 <7.0.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
         },
         "yargs-parser": {
           "version": "4.2.1",
-          "bundled": true
+          "from": "yargs-parser@>=4.2.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
         }
       }
     },
     "@rush-temp/styling": {
-      "version": "file:projects/styling",
+      "version": "0.0.0",
+      "from": "projects/styling",
+      "resolved": "file:projects/styling",
       "dependencies": {
         "acorn": {
           "version": "5.0.3",
-          "bundled": true
+          "from": "acorn@>=5.0.0 <6.0.0",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
         },
         "async": {
           "version": "0.9.2",
-          "bundled": true
+          "from": "async@>=0.9.0 <0.10.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
         },
         "camelcase": {
           "version": "3.0.0",
-          "bundled": true
+          "from": "camelcase@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
         },
         "constants-browserify": {
           "version": "1.0.0",
-          "bundled": true
+          "from": "constants-browserify@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
         },
         "crypto-browserify": {
           "version": "3.11.0",
-          "bundled": true
+          "from": "crypto-browserify@>=3.11.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
         },
         "debug": {
           "version": "2.6.0",
-          "bundled": true
+          "from": "debug@2.6.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
         },
         "enhanced-resolve": {
           "version": "3.1.0",
-          "bundled": true
-        },
-        "es6-promise": {
-          "version": "4.1.0",
-          "bundled": true
+          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
         },
         "glob": {
           "version": "7.1.1",
-          "bundled": true
+          "from": "glob@7.1.1",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
         },
         "https-browserify": {
           "version": "0.0.1",
-          "bundled": true
+          "from": "https-browserify@0.0.1",
+          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
         },
         "isarray": {
           "version": "1.0.0",
-          "bundled": true
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "mocha": {
           "version": "3.4.2",
-          "bundled": true
+          "from": "mocha@>=3.2.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.4.2.tgz"
         },
         "ms": {
           "version": "0.7.2",
-          "bundled": true
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
         },
         "node-libs-browser": {
           "version": "2.0.0",
-          "bundled": true
+          "from": "node-libs-browser@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
         },
         "os-browserify": {
           "version": "0.2.1",
-          "bundled": true
+          "from": "os-browserify@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "bundled": true,
+          "from": "readable-stream@>=2.0.5 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "bundled": true
+              "from": "string_decoder@>=1.0.0 <1.1.0",
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
             }
           }
         },
         "source-map": {
           "version": "0.1.43",
-          "bundled": true
+          "from": "source-map@>=0.1.33 <0.2.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "bundled": true
+          "from": "source-map-loader@>=0.2.1 <0.3.0",
+          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
         },
         "stream-browserify": {
           "version": "2.0.1",
-          "bundled": true
+          "from": "stream-browserify@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
         },
         "supports-color": {
           "version": "3.1.2",
-          "bundled": true
+          "from": "supports-color@3.1.2",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
         },
         "tapable": {
           "version": "0.2.6",
-          "bundled": true
+          "from": "tapable@>=0.2.5 <0.3.0",
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
         },
         "timers-browserify": {
           "version": "2.0.2",
-          "bundled": true
+          "from": "timers-browserify@>=2.0.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
         },
         "typescript": {
           "version": "2.2.2",
-          "bundled": true
+          "from": "typescript@2.2.2",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
         },
         "url": {
           "version": "0.11.0",
-          "bundled": true,
+          "from": "url@>=0.11.0 <0.12.0",
+          "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "bundled": true
+              "from": "punycode@1.3.2",
+              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
             }
           }
         },
         "watchpack": {
           "version": "1.3.1",
-          "bundled": true,
+          "from": "watchpack@>=1.3.1 <2.0.0",
+          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz",
           "dependencies": {
             "async": {
               "version": "2.4.1",
-              "bundled": true
+              "from": "async@>=2.1.2 <3.0.0",
+              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
             }
           }
         },
         "webpack": {
           "version": "2.6.1",
-          "bundled": true,
+          "from": "webpack@>=2.4.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz",
           "dependencies": {
             "async": {
               "version": "2.4.1",
-              "bundled": true
+              "from": "async@>=2.1.2 <3.0.0",
+              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
             },
             "source-map": {
               "version": "0.5.6",
-              "bundled": true
+              "from": "source-map@^0.5.3",
+              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
             }
           }
         },
         "yargs": {
           "version": "6.6.0",
-          "bundled": true
+          "from": "yargs@>=6.0.0 <7.0.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
         },
         "yargs-parser": {
           "version": "4.2.1",
-          "bundled": true
+          "from": "yargs-parser@>=4.2.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
         }
       }
     },
     "@rush-temp/test-bundle-button": {
-      "version": "file:projects/test-bundle-button",
+      "version": "0.0.0",
+      "from": "projects/test-bundle-button",
+      "resolved": "file:projects/test-bundle-button",
       "dependencies": {
         "async": {
           "version": "0.9.2",
-          "bundled": true
+          "from": "async@>=0.9.0 <0.10.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
         },
         "source-map": {
           "version": "0.1.43",
-          "bundled": true
+          "from": "source-map@>=0.1.33 <0.2.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "bundled": true
+          "from": "source-map-loader@>=0.2.1 <0.3.0",
+          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
         }
       }
     },
     "@rush-temp/todo-app": {
-      "version": "file:projects/todo-app",
+      "version": "0.0.0",
+      "from": "projects/todo-app",
+      "resolved": "file:projects/todo-app",
       "dependencies": {
-        "es6-promise": {
-          "version": "4.1.0",
-          "bundled": true
-        },
         "typescript": {
           "version": "2.2.2",
-          "bundled": true
+          "from": "typescript@2.2.2",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
         }
       }
     },
     "@rush-temp/utilities": {
-      "version": "file:projects/utilities",
+      "version": "0.0.0",
+      "from": "projects/utilities",
+      "resolved": "file:projects/utilities",
       "dependencies": {
         "async": {
           "version": "0.9.2",
-          "bundled": true
+          "from": "async@>=0.9.0 <0.10.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
         },
         "debug": {
           "version": "2.6.0",
-          "bundled": true
-        },
-        "es6-promise": {
-          "version": "4.1.0",
-          "bundled": true
+          "from": "debug@2.6.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
         },
         "glob": {
           "version": "7.1.1",
-          "bundled": true
+          "from": "glob@7.1.1",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
         },
         "mocha": {
           "version": "3.3.0",
-          "bundled": true
+          "from": "mocha@>=3.3.0 <3.4.0",
+          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz"
         },
         "ms": {
           "version": "0.7.2",
-          "bundled": true
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
         },
         "source-map": {
           "version": "0.1.43",
-          "bundled": true
+          "from": "source-map@>=0.1.33 <0.2.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "bundled": true
+          "from": "source-map-loader@>=0.2.1 <0.3.0",
+          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
         },
         "supports-color": {
           "version": "3.1.2",
-          "bundled": true
+          "from": "supports-color@3.1.2",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
         },
         "typescript": {
           "version": "2.2.2",
-          "bundled": true
+          "from": "typescript@2.2.2",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
         }
       }
     },
     "@types/assertion-error": {
       "version": "1.0.30",
-      "resolved": "https://registry.npmjs.org/@types/assertion-error/-/assertion-error-1.0.30.tgz",
-      "integrity": "sha1-89DV2i7Ie1FOMNs/+aAYh7VhnCk="
+      "from": "@types/assertion-error@1.0.30",
+      "resolved": "https://registry.npmjs.org/@types/assertion-error/-/assertion-error-1.0.30.tgz"
     },
     "@types/bluebird": {
       "version": "3.5.4",
-      "resolved": "https://registry.npmjs.org/@types/bluebird/-/bluebird-3.5.4.tgz",
-      "integrity": "sha1-8SAWKwT9bVXhA0bX4ulu7UYrAs8="
+      "from": "@types/bluebird@*",
+      "resolved": "https://registry.npmjs.org/@types/bluebird/-/bluebird-3.5.4.tgz"
     },
     "@types/chai": {
       "version": "3.5.2",
-      "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.5.2.tgz",
-      "integrity": "sha1-wRzSgX06QBt7oPWkIPNcVhObHB4="
+      "from": "@types/chai@>=3.4.35 <4.0.0",
+      "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.5.2.tgz"
     },
     "@types/chalk": {
       "version": "0.4.31",
-      "resolved": "https://registry.npmjs.org/@types/chalk/-/chalk-0.4.31.tgz",
-      "integrity": "sha1-ox10JBprHtu5c8822XooloNKUfk="
+      "from": "@types/chalk@0.4.31",
+      "resolved": "https://registry.npmjs.org/@types/chalk/-/chalk-0.4.31.tgz"
     },
     "@types/cheerio": {
       "version": "0.22.1",
-      "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.1.tgz",
-      "integrity": "sha1-dAxM2MTT8wdPg7mrYucR6sLHZM4="
+      "from": "@types/cheerio@*",
+      "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.1.tgz"
     },
     "@types/colors": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/@types/colors/-/colors-1.1.1.tgz",
-      "integrity": "sha1-SXM5KPtHzxElS3YR4vb4X/YCBSE="
+      "from": "@types/colors@1.1.1",
+      "resolved": "https://registry.npmjs.org/@types/colors/-/colors-1.1.1.tgz"
     },
     "@types/enzyme": {
       "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@types/enzyme/-/enzyme-2.8.0.tgz",
-      "integrity": "sha1-hMYgTPiYMSI6iattw/SQseCIY1I="
+      "from": "@types/enzyme@>=2.7.5 <3.0.0",
+      "resolved": "https://registry.npmjs.org/@types/enzyme/-/enzyme-2.8.0.tgz"
     },
     "@types/es6-collections": {
       "version": "0.5.29",
-      "resolved": "https://registry.npmjs.org/@types/es6-collections/-/es6-collections-0.5.29.tgz",
-      "integrity": "sha1-7CKDH36N5zY3vxVmD52MomlGmA0="
+      "from": "@types/es6-collections@0.5.29",
+      "resolved": "https://registry.npmjs.org/@types/es6-collections/-/es6-collections-0.5.29.tgz"
     },
     "@types/es6-promise": {
       "version": "0.0.32",
-      "resolved": "https://registry.npmjs.org/@types/es6-promise/-/es6-promise-0.0.32.tgz",
-      "integrity": "sha1-O89E+x5Cnz33YYjIxth0Rjujcf0="
+      "from": "@types/es6-promise@>=0.0.32 <0.0.33",
+      "resolved": "https://registry.npmjs.org/@types/es6-promise/-/es6-promise-0.0.32.tgz"
     },
     "@types/express": {
       "version": "4.0.35",
-      "resolved": "https://registry.npmjs.org/@types/express/-/express-4.0.35.tgz",
-      "integrity": "sha1-YmfHtgpR+sRzRns8SgLNHkQYBf4="
+      "from": "@types/express@*",
+      "resolved": "https://registry.npmjs.org/@types/express/-/express-4.0.35.tgz"
     },
     "@types/express-serve-static-core": {
       "version": "4.0.45",
-      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.0.45.tgz",
-      "integrity": "sha1-cbsfh9cYdILQ2IUfWylEWOHHhmc="
+      "from": "@types/express-serve-static-core@*",
+      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.0.45.tgz"
     },
     "@types/finalhandler": {
       "version": "0.0.31",
-      "resolved": "https://registry.npmjs.org/@types/finalhandler/-/finalhandler-0.0.31.tgz",
-      "integrity": "sha1-7PMvOpu0Om+0BFdQ6h5VJYLTXcM="
+      "from": "@types/finalhandler@0.0.31",
+      "resolved": "https://registry.npmjs.org/@types/finalhandler/-/finalhandler-0.0.31.tgz"
     },
     "@types/fs-extra": {
       "version": "0.0.37",
-      "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.37.tgz",
-      "integrity": "sha1-GV8RvNmhuX2eQSxrZombVFRxofc="
+      "from": "@types/fs-extra@0.0.37",
+      "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.37.tgz"
     },
     "@types/glob": {
       "version": "5.0.30",
-      "resolved": "https://registry.npmjs.org/@types/glob/-/glob-5.0.30.tgz",
-      "integrity": "sha1-ECZAnFYlqGiQdGAoCNCCsoZ7ilE="
+      "from": "@types/glob@5.0.30",
+      "resolved": "https://registry.npmjs.org/@types/glob/-/glob-5.0.30.tgz"
     },
     "@types/gulp": {
       "version": "3.8.32",
-      "resolved": "https://registry.npmjs.org/@types/gulp/-/gulp-3.8.32.tgz",
-      "integrity": "sha1-g8WcaBzCM9Hsf4LSaVVVZvoTMVY="
+      "from": "@types/gulp@3.8.32",
+      "resolved": "https://registry.npmjs.org/@types/gulp/-/gulp-3.8.32.tgz"
     },
     "@types/gulp-replace": {
       "version": "0.0.29",
-      "resolved": "https://registry.npmjs.org/@types/gulp-replace/-/gulp-replace-0.0.29.tgz",
-      "integrity": "sha1-gFqGw0pcz8+IS8E24GgzHkj5tls="
+      "from": "@types/gulp-replace@0.0.29",
+      "resolved": "https://registry.npmjs.org/@types/gulp-replace/-/gulp-replace-0.0.29.tgz"
     },
     "@types/gulp-util": {
       "version": "3.0.30",
-      "resolved": "https://registry.npmjs.org/@types/gulp-util/-/gulp-util-3.0.30.tgz",
-      "integrity": "sha1-TF9lg6IWCBOWZ+OsVrBbxn7PqPs="
+      "from": "@types/gulp-util@3.0.30",
+      "resolved": "https://registry.npmjs.org/@types/gulp-util/-/gulp-util-3.0.30.tgz"
     },
     "@types/karma": {
       "version": "0.13.33",
-      "resolved": "https://registry.npmjs.org/@types/karma/-/karma-0.13.33.tgz",
-      "integrity": "sha1-ODXT2U6IS23oiEo+cKb1aQ5qWFA="
+      "from": "@types/karma@0.13.33",
+      "resolved": "https://registry.npmjs.org/@types/karma/-/karma-0.13.33.tgz"
     },
     "@types/lodash": {
       "version": "4.14.52",
-      "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.52.tgz",
-      "integrity": "sha1-3lx6sU2hKJczIzybDsb543fbkPU="
+      "from": "@types/lodash@4.14.52",
+      "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.52.tgz"
     },
     "@types/log4js": {
       "version": "0.0.32",
-      "resolved": "https://registry.npmjs.org/@types/log4js/-/log4js-0.0.32.tgz",
-      "integrity": "sha1-wVYhz6lvkuxrDPtJCWvdI82JPHw="
+      "from": "@types/log4js@*",
+      "resolved": "https://registry.npmjs.org/@types/log4js/-/log4js-0.0.32.tgz"
     },
     "@types/merge2": {
       "version": "0.3.29",
-      "resolved": "https://registry.npmjs.org/@types/merge2/-/merge2-0.3.29.tgz",
-      "integrity": "sha1-y1UumCbKPAjZ5lSd6ezY8VQX8G0="
+      "from": "@types/merge2@0.3.29",
+      "resolved": "https://registry.npmjs.org/@types/merge2/-/merge2-0.3.29.tgz"
     },
     "@types/mime": {
       "version": "0.0.29",
-      "resolved": "https://registry.npmjs.org/@types/mime/-/mime-0.0.29.tgz",
-      "integrity": "sha1-+8/TMFc7kS71nu7hRgK/rOYwdUs="
+      "from": "@types/mime@*",
+      "resolved": "https://registry.npmjs.org/@types/mime/-/mime-0.0.29.tgz"
     },
     "@types/minimatch": {
       "version": "2.0.29",
-      "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-2.0.29.tgz",
-      "integrity": "sha1-UALhT3Xi1x5WQoHfBDHIwbSio2o="
+      "from": "@types/minimatch@*",
+      "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-2.0.29.tgz"
     },
     "@types/mkdirp": {
       "version": "0.3.29",
-      "resolved": "https://registry.npmjs.org/@types/mkdirp/-/mkdirp-0.3.29.tgz",
-      "integrity": "sha1-fyrX7FX5FEgvybHsS7GuYCjUYGY="
+      "from": "@types/mkdirp@0.3.29",
+      "resolved": "https://registry.npmjs.org/@types/mkdirp/-/mkdirp-0.3.29.tgz"
     },
     "@types/mocha": {
       "version": "2.2.41",
-      "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.41.tgz",
-      "integrity": "sha1-4nzwgXFT658nE7LT9saPHhw8pgg="
+      "from": "@types/mocha@>=2.2.39 <3.0.0",
+      "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.41.tgz"
     },
     "@types/node": {
       "version": "6.0.62",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.62.tgz",
-      "integrity": "sha1-hSIsB3tU8ltXQXu3CLn4d72jf4k="
+      "from": "@types/node@6.0.62",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.62.tgz"
     },
     "@types/node-notifier": {
       "version": "0.0.28",
-      "resolved": "https://registry.npmjs.org/@types/node-notifier/-/node-notifier-0.0.28.tgz",
-      "integrity": "sha1-hro9OqjZGDUswxkdiN4yiyDck8E="
+      "from": "@types/node-notifier@0.0.28",
+      "resolved": "https://registry.npmjs.org/@types/node-notifier/-/node-notifier-0.0.28.tgz"
     },
     "@types/node-uuid": {
       "version": "0.0.28",
-      "resolved": "https://registry.npmjs.org/@types/node-uuid/-/node-uuid-0.0.28.tgz",
-      "integrity": "sha1-QWVbXOY7LzN0xOgmtN0h5ykFjj0="
+      "from": "@types/node-uuid@0.0.28",
+      "resolved": "https://registry.npmjs.org/@types/node-uuid/-/node-uuid-0.0.28.tgz"
     },
     "@types/orchestrator": {
       "version": "0.0.30",
-      "resolved": "https://registry.npmjs.org/@types/orchestrator/-/orchestrator-0.0.30.tgz",
-      "integrity": "sha1-3N2o1ke1aLex40F4yx8LRKyamOU="
+      "from": "@types/orchestrator@0.0.30",
+      "resolved": "https://registry.npmjs.org/@types/orchestrator/-/orchestrator-0.0.30.tgz"
     },
     "@types/prop-types": {
       "version": "15.5.1",
-      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.5.1.tgz",
-      "integrity": "sha1-Hs9SYhKZ5luFU3Qzf7Ef0tEGb8E="
+      "from": "@types/prop-types@>=15.5.1 <16.0.0",
+      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.5.1.tgz"
     },
     "@types/q": {
       "version": "0.0.32",
-      "resolved": "https://registry.npmjs.org/@types/q/-/q-0.0.32.tgz",
-      "integrity": "sha1-vShOV8hPEyXacCur/IKlMoGQwMU="
+      "from": "@types/q@0.0.32",
+      "resolved": "https://registry.npmjs.org/@types/q/-/q-0.0.32.tgz"
     },
     "@types/react": {
       "version": "15.0.25",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.25.tgz",
-      "integrity": "sha1-05aUnMzJqQthdV3vl4HlrO2bImE="
+      "from": "@types/react@>=15.0.25 <16.0.0",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.25.tgz"
     },
     "@types/react-addons-test-utils": {
       "version": "0.14.18",
-      "resolved": "https://registry.npmjs.org/@types/react-addons-test-utils/-/react-addons-test-utils-0.14.18.tgz",
-      "integrity": "sha1-g+EK8dvl7CU1vC3FNz17w7gv3uE="
+      "from": "@types/react-addons-test-utils@>=0.14.18 <0.15.0",
+      "resolved": "https://registry.npmjs.org/@types/react-addons-test-utils/-/react-addons-test-utils-0.14.18.tgz"
     },
     "@types/react-dom": {
       "version": "15.5.0",
-      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-15.5.0.tgz",
-      "integrity": "sha1-f0+5YT1AURQXcyQve2tfGkazS9k="
+      "from": "@types/react-dom@>=15.5.0 <16.0.0",
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-15.5.0.tgz"
     },
     "@types/resemblejs": {
       "version": "1.3.28",
-      "resolved": "https://registry.npmjs.org/@types/resemblejs/-/resemblejs-1.3.28.tgz",
-      "integrity": "sha1-Lg2ztf2w8vPUVPXXLhMkEgnql60="
+      "from": "@types/resemblejs@>=1.3.28 <1.4.0",
+      "resolved": "https://registry.npmjs.org/@types/resemblejs/-/resemblejs-1.3.28.tgz"
     },
     "@types/resolve": {
       "version": "0.0.4",
-      "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-0.0.4.tgz",
-      "integrity": "sha1-m1htZalH3qiMS8JNoLkF/pUgoNU="
+      "from": "@types/resolve@0.0.4",
+      "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-0.0.4.tgz"
     },
     "@types/rimraf": {
       "version": "0.0.28",
-      "resolved": "https://registry.npmjs.org/@types/rimraf/-/rimraf-0.0.28.tgz",
-      "integrity": "sha1-VWJRm8eWPKyoq/fxKMrjtZTUHQY="
+      "from": "@types/rimraf@0.0.28",
+      "resolved": "https://registry.npmjs.org/@types/rimraf/-/rimraf-0.0.28.tgz"
     },
     "@types/semver": {
       "version": "5.3.31",
-      "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.31.tgz",
-      "integrity": "sha1-uZnX2TX0P1IHsBsA094ghS9Mp18="
+      "from": "@types/semver@5.3.31",
+      "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.31.tgz"
     },
     "@types/serve-static": {
       "version": "1.7.31",
-      "resolved": "https://registry.npmjs.org/@types/serve-static/-/serve-static-1.7.31.tgz",
-      "integrity": "sha1-FUVt6NmNa0z/Mb5savdJKuY/Uho="
+      "from": "@types/serve-static@1.7.31",
+      "resolved": "https://registry.npmjs.org/@types/serve-static/-/serve-static-1.7.31.tgz"
     },
     "@types/sinon": {
       "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/@types/sinon/-/sinon-2.2.2.tgz",
-      "integrity": "sha1-qA2khougisysvOTTcnbzXhugpS8="
+      "from": "@types/sinon@>=2.2.2 <3.0.0",
+      "resolved": "https://registry.npmjs.org/@types/sinon/-/sinon-2.2.2.tgz"
     },
     "@types/source-map": {
       "version": "0.5.0",
-      "resolved": "https://registry.npmjs.org/@types/source-map/-/source-map-0.5.0.tgz",
-      "integrity": "sha1-3TS72OMv5OdPLj2KwH+KpbRaR6w="
+      "from": "@types/source-map@*",
+      "resolved": "https://registry.npmjs.org/@types/source-map/-/source-map-0.5.0.tgz"
     },
     "@types/through2": {
       "version": "2.0.32",
-      "resolved": "https://registry.npmjs.org/@types/through2/-/through2-2.0.32.tgz",
-      "integrity": "sha1-RwAkRQ8at2QPGfnr9C09pXTCYSk="
+      "from": "@types/through2@2.0.32",
+      "resolved": "https://registry.npmjs.org/@types/through2/-/through2-2.0.32.tgz"
     },
     "@types/uglify-js": {
       "version": "2.6.28",
-      "resolved": "https://registry.npmjs.org/@types/uglify-js/-/uglify-js-2.6.28.tgz",
-      "integrity": "sha1-FJm0jKOkQTIlCzGM3eJbj0XwxhY="
+      "from": "@types/uglify-js@*",
+      "resolved": "https://registry.npmjs.org/@types/uglify-js/-/uglify-js-2.6.28.tgz"
     },
     "@types/vinyl": {
       "version": "1.2.30",
-      "resolved": "https://registry.npmjs.org/@types/vinyl/-/vinyl-1.2.30.tgz",
-      "integrity": "sha1-kRXAxFxAxXVziQa+n7Tfb1ueUBM="
+      "from": "@types/vinyl@1.2.30",
+      "resolved": "https://registry.npmjs.org/@types/vinyl/-/vinyl-1.2.30.tgz"
     },
     "@types/webpack": {
       "version": "1.12.36",
-      "resolved": "https://registry.npmjs.org/@types/webpack/-/webpack-1.12.36.tgz",
-      "integrity": "sha1-RjSfb7NFSe9HKpbFzsAwpUTyaSQ="
+      "from": "@types/webpack@1.12.36",
+      "resolved": "https://registry.npmjs.org/@types/webpack/-/webpack-1.12.36.tgz"
     },
     "@types/webpack-env": {
       "version": "1.13.0",
-      "resolved": "https://registry.npmjs.org/@types/webpack-env/-/webpack-env-1.13.0.tgz",
-      "integrity": "sha1-MEQ4FkfhHulzxa8uklMjkw9pHYA="
+      "from": "@types/webpack-env@>=1.13.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/@types/webpack-env/-/webpack-env-1.13.0.tgz"
     },
     "@types/webpack-stream": {
       "version": "3.2.5",
-      "resolved": "https://registry.npmjs.org/@types/webpack-stream/-/webpack-stream-3.2.5.tgz",
-      "integrity": "sha1-iwNFN5GCGX+y2prqCpMKzgDRkJs="
+      "from": "@types/webpack-stream@3.2.5",
+      "resolved": "https://registry.npmjs.org/@types/webpack-stream/-/webpack-stream-3.2.5.tgz"
     },
     "@types/whatwg-fetch": {
       "version": "0.0.30",
-      "resolved": "https://registry.npmjs.org/@types/whatwg-fetch/-/whatwg-fetch-0.0.30.tgz",
-      "integrity": "sha1-6Raex/Gv6gVsOtupnulAIy0O41s="
+      "from": "@types/whatwg-fetch@0.0.30",
+      "resolved": "https://registry.npmjs.org/@types/whatwg-fetch/-/whatwg-fetch-0.0.30.tgz"
     },
     "@types/yargs": {
       "version": "0.0.34",
-      "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.34.tgz",
-      "integrity": "sha1-FWBCn8VQxDvEGnt9PfoK+8yRSjU="
+      "from": "@types/yargs@0.0.34",
+      "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.34.tgz"
     },
     "@types/z-schema": {
       "version": "3.16.31",
-      "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.31.tgz",
-      "integrity": "sha1-LrHQCl5Ow/pYx2r94S4YK2bcXBw="
+      "from": "@types/z-schema@3.16.31",
+      "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.31.tgz"
     },
     "@uifabric/example-app-base": {
       "version": "1.3.14",
+      "from": "@uifabric/example-app-base@>=1.3.12 <2.0.0",
       "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-1.3.14.tgz",
-      "integrity": "sha1-xme4sp7g4dyDDMBE8sFJFJe+5f4=",
       "dependencies": {
         "office-ui-fabric-core": {
           "version": "5.1.0",
-          "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-5.1.0.tgz",
-          "integrity": "sha1-v49DCOFbNjJEwWc0WygzRRTsCSA="
+          "from": "office-ui-fabric-core@>=5.0.0 <6.0.0",
+          "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-5.1.0.tgz"
         }
       }
     },
     "@uifabric/utilities": {
       "version": "1.10.2",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-1.10.2.tgz",
-      "integrity": "sha1-46chhW9rIUDPOXoNRkdwlmrScyQ="
+      "from": "@uifabric/utilities@1.10.2",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-1.10.2.tgz"
     },
     "abbrev": {
       "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.0.9.tgz",
-      "integrity": "sha1-kbR5JYinc4wl813W9jdSovh3YTU="
+      "from": "abbrev@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.0.9.tgz"
     },
     "accepts": {
       "version": "1.3.3",
-      "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.3.tgz",
-      "integrity": "sha1-w8p0NJOGSMPg2cHjKN1otiLChMo="
+      "from": "accepts@1.3.3",
+      "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.3.tgz"
     },
     "acorn": {
       "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-3.3.0.tgz",
-      "integrity": "sha1-ReN/s56No/JbruP/U2niu18iAXo="
+      "from": "acorn@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-3.3.0.tgz"
     },
     "acorn-dynamic-import": {
       "version": "2.0.2",
+      "from": "acorn-dynamic-import@>=2.0.0 <3.0.0",
       "resolved": "https://registry.npmjs.org/acorn-dynamic-import/-/acorn-dynamic-import-2.0.2.tgz",
-      "integrity": "sha1-x1K9IQvvZ5UBtsbLf8hPj0cVjMQ=",
       "dependencies": {
         "acorn": {
           "version": "4.0.13",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
-          "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c="
+          "from": "acorn@>=4.0.3 <5.0.0",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz"
         }
       }
     },
     "after": {
       "version": "0.8.2",
-      "resolved": "https://registry.npmjs.org/after/-/after-0.8.2.tgz",
-      "integrity": "sha1-/ts5T58OAqqXaOcCvaI7UF+ufh8="
+      "from": "after@0.8.2",
+      "resolved": "https://registry.npmjs.org/after/-/after-0.8.2.tgz"
     },
     "ajv": {
       "version": "4.11.8",
-      "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz",
-      "integrity": "sha1-gv+wKynmYq5TvcIK8VlHcGc5xTY="
+      "from": "ajv@>=4.9.1 <5.0.0",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz"
     },
     "ajv-keywords": {
       "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-1.5.1.tgz",
-      "integrity": "sha1-MU3QpLM2j609/NxU7eYXG4htrzw="
+      "from": "ajv-keywords@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-1.5.1.tgz"
     },
     "align-text": {
       "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/align-text/-/align-text-0.1.4.tgz",
-      "integrity": "sha1-DNkKVhCT810KmSVsIrcGlDP60Rc="
+      "from": "align-text@>=0.1.3 <0.2.0",
+      "resolved": "https://registry.npmjs.org/align-text/-/align-text-0.1.4.tgz"
     },
     "alphanum-sort": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/alphanum-sort/-/alphanum-sort-1.0.2.tgz",
-      "integrity": "sha1-l6ERlkmyEa0zaR2fn0hqjsn74KM="
+      "from": "alphanum-sort@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/alphanum-sort/-/alphanum-sort-1.0.2.tgz"
     },
     "amdefine": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz",
-      "integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU="
+      "from": "amdefine@>=0.0.4",
+      "resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz"
     },
     "ansi-align": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-1.1.0.tgz",
-      "integrity": "sha1-LwwWWIKXOa3V67FeawxuNCPwFro="
+      "from": "ansi-align@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-1.1.0.tgz"
     },
     "ansi-escapes": {
       "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz",
-      "integrity": "sha1-06ioOzGapneTZisT52HHkRQiMG4="
+      "from": "ansi-escapes@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz"
     },
     "ansi-html": {
       "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/ansi-html/-/ansi-html-0.0.7.tgz",
-      "integrity": "sha1-gTWEAhliqenm/QOflA0S9WynhZ4="
+      "from": "ansi-html@0.0.7",
+      "resolved": "https://registry.npmjs.org/ansi-html/-/ansi-html-0.0.7.tgz"
     },
     "ansi-regex": {
       "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
-      "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
+      "from": "ansi-regex@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz"
     },
     "ansi-styles": {
       "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-      "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+      "from": "ansi-styles@>=2.2.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz"
     },
     "ansicolors": {
       "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/ansicolors/-/ansicolors-0.2.1.tgz",
-      "integrity": "sha1-vgiVmQl7dKXJxKhKDNvNtivYeu8="
+      "from": "ansicolors@>=0.2.1 <0.3.0",
+      "resolved": "https://registry.npmjs.org/ansicolors/-/ansicolors-0.2.1.tgz"
     },
     "anymatch": {
       "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-1.3.0.tgz",
-      "integrity": "sha1-o+Uvo5FoyCX/V7AkgSbOWo/5VQc="
+      "from": "anymatch@>=1.3.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-1.3.0.tgz"
     },
     "aproba": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.1.1.tgz",
-      "integrity": "sha1-ldNgDwdxCqDpKYxyatXs8urLq6s="
+      "from": "aproba@>=1.0.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.1.1.tgz"
     },
     "archy": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/archy/-/archy-1.0.0.tgz",
-      "integrity": "sha1-+cjBN1fMHde8N5rHeyxipcKGjEA="
+      "from": "archy@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/archy/-/archy-1.0.0.tgz"
     },
     "are-we-there-yet": {
       "version": "1.1.4",
+      "from": "are-we-there-yet@>=1.1.2 <1.2.0",
       "resolved": "https://registry.npmjs.org/are-we-there-yet/-/are-we-there-yet-1.1.4.tgz",
-      "integrity": "sha1-u13KOCu5TwXhUZQ3PRb9O6HKEQ0=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.0.6 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
     "argparse": {
       "version": "1.0.9",
+      "from": "argparse@>=1.0.7 <2.0.0",
       "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.9.tgz",
-      "integrity": "sha1-c9g7wmP4bpf4zE9rrhsOkKfSLIY=",
       "dependencies": {
         "sprintf-js": {
           "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
-          "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw="
+          "from": "sprintf-js@>=1.0.2 <1.1.0",
+          "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz"
         }
       }
     },
     "arr-diff": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
-      "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8="
+      "from": "arr-diff@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz"
     },
     "arr-flatten": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.0.3.tgz",
-      "integrity": "sha1-onTthawIhJtr14R8RYB0XcUa37E="
+      "from": "arr-flatten@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.0.3.tgz"
     },
     "array-differ": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/array-differ/-/array-differ-1.0.0.tgz",
-      "integrity": "sha1-7/UuN1gknTO+QCuLuOVkuytdQDE="
+      "from": "array-differ@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/array-differ/-/array-differ-1.0.0.tgz"
     },
     "array-find-index": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/array-find-index/-/array-find-index-1.0.2.tgz",
-      "integrity": "sha1-3wEKoSh+Fku9pvlyOwqWoexBh6E="
+      "from": "array-find-index@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/array-find-index/-/array-find-index-1.0.2.tgz"
     },
     "array-flatten": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
-      "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI="
+      "from": "array-flatten@1.1.1",
+      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz"
     },
     "array-slice": {
       "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/array-slice/-/array-slice-0.2.3.tgz",
-      "integrity": "sha1-3Tz7gO15c6dRF82sabC5nshhhvU="
+      "from": "array-slice@>=0.2.3 <0.3.0",
+      "resolved": "https://registry.npmjs.org/array-slice/-/array-slice-0.2.3.tgz"
     },
     "array-union": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz",
-      "integrity": "sha1-mjRBDk9OPaI96jdb5b5w8kd47Dk="
+      "from": "array-union@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz"
     },
     "array-uniq": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz",
-      "integrity": "sha1-r2rId6Jcx/dOBYiUdThY39sk/bY="
+      "from": "array-uniq@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz"
     },
     "array-unique": {
       "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
-      "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM="
+      "from": "array-unique@>=0.2.1 <0.3.0",
+      "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz"
     },
     "arraybuffer.slice": {
       "version": "0.0.6",
-      "resolved": "https://registry.npmjs.org/arraybuffer.slice/-/arraybuffer.slice-0.0.6.tgz",
-      "integrity": "sha1-8zshWfBTKj8xB6JywMz70a0peco="
+      "from": "arraybuffer.slice@0.0.6",
+      "resolved": "https://registry.npmjs.org/arraybuffer.slice/-/arraybuffer.slice-0.0.6.tgz"
     },
     "arrify": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz",
-      "integrity": "sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0="
+      "from": "arrify@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz"
     },
     "asap": {
       "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.5.tgz",
-      "integrity": "sha1-UidltQw1EEkOUtfc/ghe+bqWlY8="
+      "from": "asap@>=2.0.3 <2.1.0",
+      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.5.tgz"
     },
     "asn1": {
       "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.3.tgz",
-      "integrity": "sha1-2sh4dxPJlmhJ/IGAd36+nB3fO4Y="
+      "from": "asn1@>=0.2.3 <0.3.0",
+      "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.3.tgz"
     },
     "asn1.js": {
       "version": "4.9.1",
-      "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-4.9.1.tgz",
-      "integrity": "sha1-SLokC0WpKA6UdImQull9IWYX/UA="
+      "from": "asn1.js@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-4.9.1.tgz"
     },
     "assert": {
       "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/assert/-/assert-1.4.1.tgz",
-      "integrity": "sha1-mZEtWRg2tab1s0XA8H7vwI/GXZE="
+      "from": "assert@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/assert/-/assert-1.4.1.tgz"
     },
     "assert-plus": {
       "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-0.2.0.tgz",
-      "integrity": "sha1-104bh+ev/A24qttwIfP+SBAasjQ="
+      "from": "assert-plus@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-0.2.0.tgz"
     },
     "assertion-error": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-1.0.2.tgz",
-      "integrity": "sha1-E8pRXYYgbaC6xm6DTdOX2HWBCUw="
+      "from": "assertion-error@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-1.0.2.tgz"
     },
     "ast-types": {
       "version": "0.9.6",
-      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.9.6.tgz",
-      "integrity": "sha1-ECyenpAF0+fjgpvwxPok7oYu6bk="
+      "from": "ast-types@0.9.6",
+      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.9.6.tgz"
     },
     "async": {
       "version": "1.5.2",
-      "resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz",
-      "integrity": "sha1-7GphrlZIDAw8skHJVhjiCJL5Zyo="
+      "from": "async@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz"
     },
     "async-each": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/async-each/-/async-each-1.0.1.tgz",
-      "integrity": "sha1-GdOGodntxufByF04iu28xW0zYC0="
+      "from": "async-each@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/async-each/-/async-each-1.0.1.tgz"
     },
     "async-foreach": {
       "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/async-foreach/-/async-foreach-0.1.3.tgz",
-      "integrity": "sha1-NhIfhFwFeBct5Bmpfb6x0W7DRUI="
+      "from": "async-foreach@>=0.1.3 <0.2.0",
+      "resolved": "https://registry.npmjs.org/async-foreach/-/async-foreach-0.1.3.tgz"
     },
     "asynckit": {
       "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
-      "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k="
+      "from": "asynckit@>=0.4.0 <0.5.0",
+      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz"
     },
     "autoprefixer": {
       "version": "6.7.7",
+      "from": "autoprefixer@>=6.7.6 <7.0.0",
       "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.7.7.tgz",
-      "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ=",
       "dependencies": {
         "browserslist": {
           "version": "1.7.7",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
-          "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk="
+          "from": "browserslist@>=1.7.6 <2.0.0",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz"
         }
       }
     },
     "aws-sign2": {
       "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz",
-      "integrity": "sha1-FDQt0428yU0OW4fXY81jYSwOeU8="
+      "from": "aws-sign2@>=0.6.0 <0.7.0",
+      "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz"
     },
     "aws4": {
       "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.6.0.tgz",
-      "integrity": "sha1-g+9cqGCysy5KDe7e6MdxudtXRx4="
+      "from": "aws4@>=1.2.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.6.0.tgz"
     },
     "azure-storage": {
       "version": "0.10.0",
+      "from": "azure-storage@>=0.10.0 <0.11.0",
       "resolved": "https://registry.npmjs.org/azure-storage/-/azure-storage-0.10.0.tgz",
-      "integrity": "sha1-QsV7ty1vM+u3jS2VTds99Jp1sro=",
       "dependencies": {
         "async": {
           "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
-          "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c="
+          "from": "async@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
         },
         "caseless": {
           "version": "0.11.0",
-          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz",
-          "integrity": "sha1-cVuW6phBWTzDMGeSP17GDr2k99c="
+          "from": "caseless@>=0.11.0 <0.12.0",
+          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz"
         },
         "extend": {
           "version": "1.2.1",
-          "resolved": "https://registry.npmjs.org/extend/-/extend-1.2.1.tgz",
-          "integrity": "sha1-oPX9bPyDpf5J72mNYOyKYk3UV2w="
+          "from": "extend@>=1.2.1 <1.3.0",
+          "resolved": "https://registry.npmjs.org/extend/-/extend-1.2.1.tgz"
         },
         "form-data": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/form-data/-/form-data-1.0.1.tgz",
-          "integrity": "sha1-rjFduaSQf6BlUCMEpm13M0de43w="
+          "from": "form-data@>=1.0.0-rc3 <1.1.0",
+          "resolved": "https://registry.npmjs.org/form-data/-/form-data-1.0.1.tgz"
         },
         "har-validator": {
           "version": "2.0.6",
-          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz",
-          "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0="
+          "from": "har-validator@>=2.0.6 <2.1.0",
+          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz"
         },
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "node-uuid": {
           "version": "1.4.8",
-          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz",
-          "integrity": "sha1-sEDrCSOWivq/jTL7HxfxFn/auQc="
+          "from": "node-uuid@~1.4.0",
+          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz"
         },
         "qs": {
           "version": "6.0.4",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-6.0.4.tgz",
-          "integrity": "sha1-UQGdhHIMk5uCc36EVWp4Izjs6ns="
+          "from": "qs@>=6.0.2 <6.1.0",
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.0.4.tgz"
         },
         "readable-stream": {
           "version": "2.0.6",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz",
-          "integrity": "sha1-j5A0HmilPMySh4jaz80Rs265t44="
+          "from": "readable-stream@>=2.0.0 <2.1.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz"
         },
         "request": {
           "version": "2.69.0",
+          "from": "request@>=2.69.0 <2.70.0",
           "resolved": "https://registry.npmjs.org/request/-/request-2.69.0.tgz",
-          "integrity": "sha1-z5HS4AB1KxIXFVwAUkGRGZGiNGo=",
           "dependencies": {
             "extend": {
               "version": "3.0.1",
-              "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz",
-              "integrity": "sha1-p1Xqe8Gt/MWjHOfnYtuq3F5jZEQ="
+              "from": "extend@~3.0.0",
+              "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz"
             }
           }
         },
         "tough-cookie": {
           "version": "2.2.2",
-          "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.2.2.tgz",
-          "integrity": "sha1-yDoYMPTl7wuT7yo0iOck+N4Basc="
+          "from": "tough-cookie@>=2.2.0 <2.3.0",
+          "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.2.2.tgz"
         },
         "tunnel-agent": {
           "version": "0.4.3",
-          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz",
-          "integrity": "sha1-Y3PbdpCf5XDgjXNYM2Xtgop07us="
+          "from": "tunnel-agent@>=0.4.1 <0.5.0",
+          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz"
         },
         "validator": {
           "version": "3.22.2",
-          "resolved": "https://registry.npmjs.org/validator/-/validator-3.22.2.tgz",
-          "integrity": "sha1-byl65n9/gqzHbQr9tJ8Y2aCcGMA="
+          "from": "validator@>=3.22.2 <3.23.0",
+          "resolved": "https://registry.npmjs.org/validator/-/validator-3.22.2.tgz"
         }
       }
     },
     "babel-code-frame": {
       "version": "6.22.0",
-      "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.22.0.tgz",
-      "integrity": "sha1-AnYgvuVnqIwyVhV05/0IAdMxGOQ="
+      "from": "babel-code-frame@>=6.11.0 <7.0.0",
+      "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.22.0.tgz"
     },
     "babel-runtime": {
       "version": "6.23.0",
-      "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.23.0.tgz",
-      "integrity": "sha1-CpSJ8UTecO+zzkMArM2zKeL8VDs="
+      "from": "babel-runtime@>=6.18.0 <7.0.0",
+      "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.23.0.tgz"
     },
     "backo2": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz",
-      "integrity": "sha1-MasayLEpNjRj41s+u2n038+6eUc="
+      "from": "backo2@1.0.2",
+      "resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz"
     },
     "balanced-match": {
       "version": "0.4.2",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-0.4.2.tgz",
-      "integrity": "sha1-yz8+PHMtwPAe5wtAPzAuYddwmDg="
+      "from": "balanced-match@>=0.4.1 <0.5.0",
+      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-0.4.2.tgz"
     },
     "base62": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/base62/-/base62-1.2.0.tgz",
-      "integrity": "sha1-MeflYNyEbJ9EwaUx32UU2jVHQVc="
+      "from": "base62@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/base62/-/base62-1.2.0.tgz"
     },
     "Base64": {
       "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/Base64/-/Base64-0.2.1.tgz",
-      "integrity": "sha1-ujpCMHCOGGcFBl5mur3Uw1z2ACg="
+      "from": "Base64@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/Base64/-/Base64-0.2.1.tgz"
     },
     "base64-arraybuffer": {
       "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/base64-arraybuffer/-/base64-arraybuffer-0.1.5.tgz",
-      "integrity": "sha1-c5JncZI7Whl0etZmqlzUv5xunOg="
+      "from": "base64-arraybuffer@0.1.5",
+      "resolved": "https://registry.npmjs.org/base64-arraybuffer/-/base64-arraybuffer-0.1.5.tgz"
     },
     "base64-js": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.2.0.tgz",
-      "integrity": "sha1-o5mS1yNYSBGYK+XikLtqU9hnAPE="
+      "from": "base64-js@>=1.0.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.2.0.tgz"
     },
     "base64-url": {
       "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/base64-url/-/base64-url-1.2.1.tgz",
-      "integrity": "sha1-GZ/WYXAqDnt9yubgaYuwicUvbXg="
+      "from": "base64-url@1.2.1",
+      "resolved": "https://registry.npmjs.org/base64-url/-/base64-url-1.2.1.tgz"
     },
     "base64id": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/base64id/-/base64id-1.0.0.tgz",
-      "integrity": "sha1-R2iMuZu2gE8OBtPnY7HDLlfY5rY="
+      "from": "base64id@1.0.0",
+      "resolved": "https://registry.npmjs.org/base64id/-/base64id-1.0.0.tgz"
     },
     "basic-auth": {
       "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/basic-auth/-/basic-auth-1.0.4.tgz",
-      "integrity": "sha1-Awk1sB3nyblKgksp8/zLdQ06UpA="
+      "from": "basic-auth@>=1.0.3 <1.1.0",
+      "resolved": "https://registry.npmjs.org/basic-auth/-/basic-auth-1.0.4.tgz"
     },
     "basic-auth-connect": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/basic-auth-connect/-/basic-auth-connect-1.0.0.tgz",
-      "integrity": "sha1-/bC0OWLKe0BFanwrtI/hc9otISI="
+      "from": "basic-auth-connect@1.0.0",
+      "resolved": "https://registry.npmjs.org/basic-auth-connect/-/basic-auth-connect-1.0.0.tgz"
     },
     "batch": {
       "version": "0.5.3",
-      "resolved": "https://registry.npmjs.org/batch/-/batch-0.5.3.tgz",
-      "integrity": "sha1-PzQU84AyF0O/wQQvmoP/HVgk1GQ="
+      "from": "batch@>=0.5.3 <0.6.0",
+      "resolved": "https://registry.npmjs.org/batch/-/batch-0.5.3.tgz"
     },
     "bcrypt-pbkdf": {
       "version": "1.0.1",
+      "from": "bcrypt-pbkdf@>=1.0.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/bcrypt-pbkdf/-/bcrypt-pbkdf-1.0.1.tgz",
-      "integrity": "sha1-Y7xdy2EzG5K8Bf1SiVPDNGKgb40=",
       "optional": true
     },
     "beeper": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/beeper/-/beeper-1.1.1.tgz",
-      "integrity": "sha1-5tXqjF2tABMEpwsiY4RH9pyy+Ak="
+      "from": "beeper@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/beeper/-/beeper-1.1.1.tgz"
     },
     "better-assert": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/better-assert/-/better-assert-1.0.2.tgz",
-      "integrity": "sha1-QIZrnhueC1W0gYlDEeaPr/rrxSI="
+      "from": "better-assert@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/better-assert/-/better-assert-1.0.2.tgz"
     },
     "big.js": {
       "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/big.js/-/big.js-3.1.3.tgz",
-      "integrity": "sha1-TK2iGTZS6zyp7I5VyQFWacmAaXg="
+      "from": "big.js@>=3.1.3 <4.0.0",
+      "resolved": "https://registry.npmjs.org/big.js/-/big.js-3.1.3.tgz"
     },
     "binary-extensions": {
       "version": "1.8.0",
-      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.8.0.tgz",
-      "integrity": "sha1-SOyNFt9Dd+rl+liEaCSAr02Vx3Q="
+      "from": "binary-extensions@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.8.0.tgz"
     },
     "binaryextensions": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/binaryextensions/-/binaryextensions-1.0.1.tgz",
-      "integrity": "sha1-HmN0iLNbWL2l9HdL+WpSEqjJB1U="
+      "from": "binaryextensions@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/binaryextensions/-/binaryextensions-1.0.1.tgz"
     },
     "bindings": {
       "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.2.1.tgz",
-      "integrity": "sha1-FK1hE4EtLTfXLme0ystLtyZQXxE="
+      "from": "bindings@>=1.2.1 <1.3.0",
+      "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.2.1.tgz"
     },
     "bl": {
       "version": "1.0.3",
+      "from": "bl@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/bl/-/bl-1.0.3.tgz",
-      "integrity": "sha1-/FQhoo/UImA2w7OJGmaiW8ZNIm4=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
           "version": "2.0.6",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz",
-          "integrity": "sha1-j5A0HmilPMySh4jaz80Rs265t44="
+          "from": "readable-stream@>=2.0.5 <2.1.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz"
         }
       }
     },
     "blob": {
       "version": "0.0.4",
-      "resolved": "https://registry.npmjs.org/blob/-/blob-0.0.4.tgz",
-      "integrity": "sha1-vPEwUspURj8w+fx+lbmkdjCpSSE="
+      "from": "blob@0.0.4",
+      "resolved": "https://registry.npmjs.org/blob/-/blob-0.0.4.tgz"
     },
     "block-stream": {
       "version": "0.0.9",
-      "resolved": "https://registry.npmjs.org/block-stream/-/block-stream-0.0.9.tgz",
-      "integrity": "sha1-E+v+d4oDIFz+A3UUgeu0szAMEmo="
+      "from": "block-stream@*",
+      "resolved": "https://registry.npmjs.org/block-stream/-/block-stream-0.0.9.tgz"
     },
     "bluebird": {
       "version": "3.5.0",
-      "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.5.0.tgz",
-      "integrity": "sha1-eRQg1/VR7qKJdFOop3ZT+WYG1nw="
+      "from": "bluebird@>=3.0.5 <4.0.0",
+      "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.5.0.tgz"
     },
     "bn.js": {
       "version": "4.11.6",
-      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.6.tgz",
-      "integrity": "sha1-UzRK2xRhehP26N0s4okF0cC6MhU="
+      "from": "bn.js@>=4.1.1 <5.0.0",
+      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.6.tgz"
     },
     "body-parser": {
       "version": "1.17.2",
-      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.17.2.tgz",
-      "integrity": "sha1-+IkqvI+eYn1Crtr7yma/WrmRBO4="
+      "from": "body-parser@>=1.12.4 <2.0.0",
+      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.17.2.tgz"
     },
     "boolbase": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
-      "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24="
+      "from": "boolbase@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz"
     },
     "boom": {
       "version": "2.10.1",
-      "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
-      "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8="
+      "from": "boom@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz"
     },
     "boxen": {
       "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/boxen/-/boxen-0.6.0.tgz",
-      "integrity": "sha1-g2TUJIrDT/DvGy8r9JpsYM4NgbY="
+      "from": "boxen@>=0.6.0 <0.7.0",
+      "resolved": "https://registry.npmjs.org/boxen/-/boxen-0.6.0.tgz"
     },
     "brace-expansion": {
       "version": "1.1.7",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.7.tgz",
-      "integrity": "sha1-Pv/DxQ4ABTH7cg6v+A8K6O8jz1k="
+      "from": "brace-expansion@>=1.1.7 <2.0.0",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.7.tgz"
     },
     "braces": {
       "version": "1.8.5",
-      "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
-      "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
+      "from": "braces@>=1.8.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz"
     },
     "brorand": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/brorand/-/brorand-1.1.0.tgz",
-      "integrity": "sha1-EsJe/kCkXjwyPrhnWgoM5XsiNx8="
+      "from": "brorand@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/brorand/-/brorand-1.1.0.tgz"
     },
     "browser-stdout": {
       "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/browser-stdout/-/browser-stdout-1.3.0.tgz",
-      "integrity": "sha1-81HTKWnTL6XXpVZxVCY9korjvR8="
+      "from": "browser-stdout@1.3.0",
+      "resolved": "https://registry.npmjs.org/browser-stdout/-/browser-stdout-1.3.0.tgz"
     },
     "browserify-aes": {
       "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-0.4.0.tgz",
-      "integrity": "sha1-BnFJtmjfMcS1hTPgLQHoBthgjiw="
+      "from": "browserify-aes@0.4.0",
+      "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-0.4.0.tgz"
     },
     "browserify-cipher": {
       "version": "1.0.0",
+      "from": "browserify-cipher@>=1.0.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/browserify-cipher/-/browserify-cipher-1.0.0.tgz",
-      "integrity": "sha1-mYgkSHS/XtTijalWZtzWasj8Njo=",
       "dependencies": {
         "browserify-aes": {
           "version": "1.0.6",
-          "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.6.tgz",
-          "integrity": "sha1-Xncl297x/Vkw1OurSFZ85FHEigo="
+          "from": "browserify-aes@>=1.0.4 <2.0.0",
+          "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.6.tgz"
         }
       }
     },
     "browserify-des": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/browserify-des/-/browserify-des-1.0.0.tgz",
-      "integrity": "sha1-2qJ3cXRwki7S/hhZQRihdUOXId0="
+      "from": "browserify-des@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/browserify-des/-/browserify-des-1.0.0.tgz"
     },
     "browserify-mime": {
       "version": "1.2.9",
-      "resolved": "https://registry.npmjs.org/browserify-mime/-/browserify-mime-1.2.9.tgz",
-      "integrity": "sha1-rrGvKN5sDXpqLOQK22j/GEIq8x8="
+      "from": "browserify-mime@>=1.2.9 <1.3.0",
+      "resolved": "https://registry.npmjs.org/browserify-mime/-/browserify-mime-1.2.9.tgz"
     },
     "browserify-rsa": {
       "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz",
-      "integrity": "sha1-IeCr+vbyApzy+vsTNWenAdQTVSQ="
+      "from": "browserify-rsa@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz"
     },
     "browserify-sign": {
       "version": "4.0.4",
-      "resolved": "https://registry.npmjs.org/browserify-sign/-/browserify-sign-4.0.4.tgz",
-      "integrity": "sha1-qk62jl17ZYuqa/alfmMMvXqT0pg="
+      "from": "browserify-sign@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/browserify-sign/-/browserify-sign-4.0.4.tgz"
     },
     "browserify-zlib": {
       "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/browserify-zlib/-/browserify-zlib-0.1.4.tgz",
-      "integrity": "sha1-uzX4pRn2AOD6a4SFJByXnQFB+y0="
+      "from": "browserify-zlib@>=0.1.4 <0.2.0",
+      "resolved": "https://registry.npmjs.org/browserify-zlib/-/browserify-zlib-0.1.4.tgz"
     },
     "browserslist": {
       "version": "1.3.6",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.3.6.tgz",
-      "integrity": "sha1-lS/0jVZGPTtTj4XvL46t39KEsTM="
+      "from": "browserslist@>=1.3.4 <1.4.0",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.3.6.tgz"
     },
     "buffer": {
       "version": "4.9.1",
+      "from": "buffer@>=4.9.0 <5.0.0",
       "resolved": "https://registry.npmjs.org/buffer/-/buffer-4.9.1.tgz",
-      "integrity": "sha1-bRu2AbB6TvztlwlBMgkwJ8lbwpg=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         }
       }
     },
     "buffer-shims": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/buffer-shims/-/buffer-shims-1.0.0.tgz",
-      "integrity": "sha1-mXjOMXOIxkmth5MCjDR37wRKi1E="
+      "from": "buffer-shims@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/buffer-shims/-/buffer-shims-1.0.0.tgz"
     },
     "buffer-xor": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/buffer-xor/-/buffer-xor-1.0.3.tgz",
-      "integrity": "sha1-JuYe0UIvtw3ULm42cp7VHYVf6Nk="
+      "from": "buffer-xor@>=1.0.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/buffer-xor/-/buffer-xor-1.0.3.tgz"
     },
     "bufferstreams": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/bufferstreams/-/bufferstreams-1.0.1.tgz",
-      "integrity": "sha1-z7GtlWjTujz+k1upq92VLeiKqyo="
+      "from": "bufferstreams@1.0.1",
+      "resolved": "https://registry.npmjs.org/bufferstreams/-/bufferstreams-1.0.1.tgz"
     },
     "builtin-modules": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz",
-      "integrity": "sha1-Jw8HbFpywC9bZaR9+Uxf46J4iS8="
+      "from": "builtin-modules@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz"
     },
     "builtin-status-codes": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz",
-      "integrity": "sha1-hZgoeOIbmOHGZCXgPQF0eI9Wnug="
+      "from": "builtin-status-codes@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz"
     },
     "bytes": {
       "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz",
-      "integrity": "sha1-fZcZb51br39pNeJZhVSe3SpsIzk="
+      "from": "bytes@2.4.0",
+      "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz"
     },
     "cache-swap": {
       "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/cache-swap/-/cache-swap-0.3.0.tgz",
-      "integrity": "sha1-HFQaoQilAQb2ML3Zj+HeyLoTP1E="
+      "from": "cache-swap@>=0.3.0 <0.4.0",
+      "resolved": "https://registry.npmjs.org/cache-swap/-/cache-swap-0.3.0.tgz"
     },
     "callsite": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/callsite/-/callsite-1.0.0.tgz",
-      "integrity": "sha1-KAOY5dZkvXQDi28JBRU+borxvCA="
+      "from": "callsite@1.0.0",
+      "resolved": "https://registry.npmjs.org/callsite/-/callsite-1.0.0.tgz"
     },
     "camel-case": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/camel-case/-/camel-case-3.0.0.tgz",
-      "integrity": "sha1-yjw2iKTpzzpM2nd9xNy8cTJJz3M="
+      "from": "camel-case@>=3.0.0 <3.1.0",
+      "resolved": "https://registry.npmjs.org/camel-case/-/camel-case-3.0.0.tgz"
     },
     "camelcase": {
       "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz",
-      "integrity": "sha1-fB0W1nmhu+WcoCys7PsBHiAfWh8="
+      "from": "camelcase@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz"
     },
     "camelcase-keys": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/camelcase-keys/-/camelcase-keys-2.1.0.tgz",
-      "integrity": "sha1-MIvur/3ygRkFHvodkyITyRuPkuc="
+      "from": "camelcase-keys@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/camelcase-keys/-/camelcase-keys-2.1.0.tgz"
     },
     "caniuse-api": {
       "version": "1.6.1",
-      "resolved": "https://registry.npmjs.org/caniuse-api/-/caniuse-api-1.6.1.tgz",
-      "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
+      "from": "caniuse-api@>=1.5.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/caniuse-api/-/caniuse-api-1.6.1.tgz"
     },
     "caniuse-db": {
       "version": "1.0.30000674",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000674.tgz",
-      "integrity": "sha1-146ZoykTQfU4MOlq0vEpIblxXo0="
+      "from": "caniuse-db@>=1.0.30000488 <2.0.0",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000674.tgz"
     },
     "capture-stack-trace": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/capture-stack-trace/-/capture-stack-trace-1.0.0.tgz",
-      "integrity": "sha1-Sm+gc5nCa7pH8LJJa00PtAjFVQ0="
+      "from": "capture-stack-trace@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/capture-stack-trace/-/capture-stack-trace-1.0.0.tgz"
     },
     "cardinal": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/cardinal/-/cardinal-1.0.0.tgz",
-      "integrity": "sha1-UOIcGwqjdyn5N33vGWtanOyTLuk="
+      "from": "cardinal@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/cardinal/-/cardinal-1.0.0.tgz"
     },
     "caseless": {
       "version": "0.12.0",
-      "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz",
-      "integrity": "sha1-G2gcIf+EAzyCZUMJBolCDRhxUdw="
+      "from": "caseless@>=0.12.0 <0.13.0",
+      "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz"
     },
     "casperjs": {
       "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/casperjs/-/casperjs-1.1.3.tgz",
-      "integrity": "sha1-llPecx+KpE0JFaaboiMxZLsur5Q="
+      "from": "casperjs@1.1.3",
+      "resolved": "https://registry.npmjs.org/casperjs/-/casperjs-1.1.3.tgz"
     },
     "center-align": {
       "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/center-align/-/center-align-0.1.3.tgz",
-      "integrity": "sha1-qg0yYptu6XIgBBHL1EYckHvCt60="
+      "from": "center-align@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/center-align/-/center-align-0.1.3.tgz"
     },
     "chai": {
       "version": "3.5.0",
-      "resolved": "https://registry.npmjs.org/chai/-/chai-3.5.0.tgz",
-      "integrity": "sha1-TQJjewZ/6Vi9v906QOxW/vc3Mkc="
+      "from": "chai@>=3.5.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/chai/-/chai-3.5.0.tgz"
     },
     "chalk": {
       "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-      "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+      "from": "chalk@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz"
     },
     "charenc": {
       "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/charenc/-/charenc-0.0.2.tgz",
-      "integrity": "sha1-wKHS86cJLgN3S/qD8UwPxXkKhmc="
+      "from": "charenc@>=0.0.1 <0.1.0",
+      "resolved": "https://registry.npmjs.org/charenc/-/charenc-0.0.2.tgz"
     },
     "cheerio": {
       "version": "0.22.0",
+      "from": "cheerio@>=0.22.0 <0.23.0",
       "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-0.22.0.tgz",
-      "integrity": "sha1-qbqoYKP5tZWmuBsahocxIe06Jp4=",
       "dependencies": {
         "lodash.defaults": {
           "version": "4.2.0",
-          "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-4.2.0.tgz",
-          "integrity": "sha1-0JF4cW/+pN3p5ft7N/bwgCJ0WAw="
+          "from": "lodash.defaults@>=4.0.1 <5.0.0",
+          "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-4.2.0.tgz"
         },
         "lodash.merge": {
           "version": "4.6.0",
-          "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.0.tgz",
-          "integrity": "sha1-aYhLoUSsM/5plzemCG3v+t0PicU="
+          "from": "lodash.merge@>=4.4.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.0.tgz"
         }
       }
     },
     "chokidar": {
       "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-1.7.0.tgz",
-      "integrity": "sha1-eY5ol3gVHIB2tLNg5e3SjNortGg="
+      "from": "chokidar@>=1.4.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-1.7.0.tgz"
     },
     "cipher-base": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/cipher-base/-/cipher-base-1.0.3.tgz",
-      "integrity": "sha1-7qvxlEGc6QDaMBjCB9IS8qbfCgc="
+      "from": "cipher-base@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/cipher-base/-/cipher-base-1.0.3.tgz"
     },
     "clap": {
       "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/clap/-/clap-1.1.3.tgz",
-      "integrity": "sha1-s7026T3Uy/s5WjwmiWNSRFJlwFs="
+      "from": "clap@>=1.0.9 <2.0.0",
+      "resolved": "https://registry.npmjs.org/clap/-/clap-1.1.3.tgz"
     },
     "clean-css": {
       "version": "3.4.26",
+      "from": "clean-css@>=3.4.20 <4.0.0",
       "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-3.4.26.tgz",
-      "integrity": "sha1-VTI7NE/zvO5oSi6sgck9+Ppz3us=",
       "dependencies": {
         "commander": {
           "version": "2.8.1",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-2.8.1.tgz",
-          "integrity": "sha1-Br42f+v9oMMwqh4qBy09yXYkJdQ="
+          "from": "commander@>=2.8.0 <2.9.0",
+          "resolved": "https://registry.npmjs.org/commander/-/commander-2.8.1.tgz"
         },
         "source-map": {
           "version": "0.4.4",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
-          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s="
+          "from": "source-map@>=0.4.0 <0.5.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz"
         }
       }
     },
     "cli-boxes": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/cli-boxes/-/cli-boxes-1.0.0.tgz",
-      "integrity": "sha1-T6kXw+WclKAEzWH47lCdplFocUM="
+      "from": "cli-boxes@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/cli-boxes/-/cli-boxes-1.0.0.tgz"
     },
     "cli-cursor": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-1.0.2.tgz",
-      "integrity": "sha1-ZNo/fValRBLll5S9Ytw1KV6PKYc="
+      "from": "cli-cursor@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-1.0.2.tgz"
     },
     "cli-table": {
       "version": "0.3.1",
+      "from": "cli-table@>=0.3.1 <0.4.0",
       "resolved": "https://registry.npmjs.org/cli-table/-/cli-table-0.3.1.tgz",
-      "integrity": "sha1-9TsFJmqLGguTSz0IIebi3FkUriM=",
       "dependencies": {
         "colors": {
           "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/colors/-/colors-1.0.3.tgz",
-          "integrity": "sha1-BDP0TYCWgP3rYO0mDxsMJi6CpAs="
+          "from": "colors@1.0.3",
+          "resolved": "https://registry.npmjs.org/colors/-/colors-1.0.3.tgz"
         }
       }
     },
     "cli-usage": {
       "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/cli-usage/-/cli-usage-0.1.4.tgz",
-      "integrity": "sha1-fAHg3HBsI0s5yTODjI4gshdXduI="
+      "from": "cli-usage@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/cli-usage/-/cli-usage-0.1.4.tgz"
     },
     "cli-width": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-1.1.1.tgz",
-      "integrity": "sha1-pNKT72frt7iNSk1CwMzwDE0eNm0="
+      "from": "cli-width@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-1.1.1.tgz"
     },
     "cliui": {
       "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
-      "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
+      "from": "cliui@>=3.2.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz"
     },
     "clone": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.2.tgz",
-      "integrity": "sha1-Jgt6meux7f4kdTgXX3gyQ8sZ0Uk="
+      "from": "clone@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.2.tgz"
     },
     "clone-buffer": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/clone-buffer/-/clone-buffer-1.0.0.tgz",
-      "integrity": "sha1-4+JbIHrE5wGvch4staFnksrD3Fg="
+      "from": "clone-buffer@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/clone-buffer/-/clone-buffer-1.0.0.tgz"
     },
     "clone-deep": {
       "version": "0.2.4",
-      "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-0.2.4.tgz",
-      "integrity": "sha1-TnPdCen7lxzDhnDF3O2cGJZIHMY="
+      "from": "clone-deep@>=0.2.4 <0.3.0",
+      "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-0.2.4.tgz"
     },
     "clone-stats": {
       "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-0.0.1.tgz",
-      "integrity": "sha1-uI+UqCzzi4eR1YBG6kAprYjKmdE="
+      "from": "clone-stats@>=0.0.1 <0.0.2",
+      "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-0.0.1.tgz"
     },
     "cloneable-readable": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/cloneable-readable/-/cloneable-readable-1.0.0.tgz",
-      "integrity": "sha1-pikNQT8hemEjL5XkWP84QYz7ARc="
+      "from": "cloneable-readable@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/cloneable-readable/-/cloneable-readable-1.0.0.tgz"
     },
     "co": {
       "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
-      "integrity": "sha1-bqa989hTrlTMuOR7+gvz+QMfsYQ="
+      "from": "co@>=4.6.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz"
     },
     "coa": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/coa/-/coa-1.0.2.tgz",
-      "integrity": "sha1-K6n+w7SqQ9eknX5sNWHpIGG2vOw="
+      "from": "coa@>=1.0.1 <1.1.0",
+      "resolved": "https://registry.npmjs.org/coa/-/coa-1.0.2.tgz"
     },
     "code-point-at": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz",
-      "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c="
+      "from": "code-point-at@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz"
     },
     "color": {
       "version": "0.11.4",
-      "resolved": "https://registry.npmjs.org/color/-/color-0.11.4.tgz",
-      "integrity": "sha1-bXtcdPtl6EHNSHkq0e1eB7kE12Q="
+      "from": "color@>=0.11.0 <0.12.0",
+      "resolved": "https://registry.npmjs.org/color/-/color-0.11.4.tgz"
     },
     "color-convert": {
       "version": "1.9.0",
-      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.0.tgz",
-      "integrity": "sha1-Gsz5fdc5uYO/mU1W/sj5WFNkG3o="
+      "from": "color-convert@>=1.3.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.0.tgz"
     },
     "color-functions": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/color-functions/-/color-functions-1.1.0.tgz",
-      "integrity": "sha1-TLgFR5Blo2WMMmn0j6xz7/APld4="
+      "from": "color-functions@1.1.0",
+      "resolved": "https://registry.npmjs.org/color-functions/-/color-functions-1.1.0.tgz"
     },
     "color-name": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.2.tgz",
-      "integrity": "sha1-XIq3K2S9IhXWF66VWeuxSEdc+Y0="
+      "from": "color-name@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.2.tgz"
     },
     "color-string": {
       "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/color-string/-/color-string-0.3.0.tgz",
-      "integrity": "sha1-J9RvtnAlxcL6JZk7+/V55HhBuZE="
+      "from": "color-string@>=0.3.0 <0.4.0",
+      "resolved": "https://registry.npmjs.org/color-string/-/color-string-0.3.0.tgz"
     },
     "colormin": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/colormin/-/colormin-1.1.2.tgz",
-      "integrity": "sha1-6i90IKcrlogaOKrlnsEkpvcpgTM="
+      "from": "colormin@>=1.0.5 <2.0.0",
+      "resolved": "https://registry.npmjs.org/colormin/-/colormin-1.1.2.tgz"
     },
     "colors": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/colors/-/colors-1.1.2.tgz",
-      "integrity": "sha1-FopHAXVran9RoSzgyXv6KMCE7WM="
+      "from": "colors@>=1.1.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/colors/-/colors-1.1.2.tgz"
     },
     "combined-stream": {
       "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz",
-      "integrity": "sha1-k4NwpXtKUd6ix3wV1cX9+JUWQAk="
+      "from": "combined-stream@>=1.0.5 <1.1.0",
+      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz"
     },
     "commander": {
       "version": "2.9.0",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
-      "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q="
+      "from": "commander@>=2.7.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz"
     },
     "commoner": {
       "version": "0.10.8",
+      "from": "commoner@>=0.10.1 <0.11.0",
       "resolved": "https://registry.npmjs.org/commoner/-/commoner-0.10.8.tgz",
-      "integrity": "sha1-NPw2cs0kOT6LtH5wyqApOBH08sU=",
       "dependencies": {
         "glob": {
           "version": "5.0.15",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
-          "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
+          "from": "glob@>=5.0.15 <6.0.0",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
         }
       }
     },
     "component-bind": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/component-bind/-/component-bind-1.0.0.tgz",
-      "integrity": "sha1-AMYIq33Nk4l8AAllGx06jh5zu9E="
+      "from": "component-bind@1.0.0",
+      "resolved": "https://registry.npmjs.org/component-bind/-/component-bind-1.0.0.tgz"
     },
     "component-emitter": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.1.2.tgz",
-      "integrity": "sha1-KWWU8nU9qmOZbSrwjRWpURbJrsM="
+      "from": "component-emitter@1.1.2",
+      "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.1.2.tgz"
     },
     "component-inherit": {
       "version": "0.0.3",
-      "resolved": "https://registry.npmjs.org/component-inherit/-/component-inherit-0.0.3.tgz",
-      "integrity": "sha1-ZF/ErfWLcrZJ1crmUTVhnbJv8UM="
+      "from": "component-inherit@0.0.3",
+      "resolved": "https://registry.npmjs.org/component-inherit/-/component-inherit-0.0.3.tgz"
     },
     "compressible": {
       "version": "2.0.10",
-      "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.10.tgz",
-      "integrity": "sha1-/tocf3YXkScyspv4zyYlKiC57s0="
+      "from": "compressible@>=2.0.5 <2.1.0",
+      "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.10.tgz"
     },
     "compression": {
       "version": "1.5.2",
+      "from": "compression@>=1.5.2 <1.6.0",
       "resolved": "https://registry.npmjs.org/compression/-/compression-1.5.2.tgz",
-      "integrity": "sha1-sDuNhub4rSloPLqN+R3cb/x3s5U=",
       "dependencies": {
         "accepts": {
           "version": "1.2.13",
-          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.2.13.tgz",
-          "integrity": "sha1-5fHzkoxtlf2WVYw27D2dDeSm7Oo="
+          "from": "accepts@>=1.2.12 <1.3.0",
+          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.2.13.tgz"
         },
         "bytes": {
           "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.1.0.tgz",
-          "integrity": "sha1-rJPEEOL/ycx89LRks4KJBn9eR7Q="
+          "from": "bytes@2.1.0",
+          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.1.0.tgz"
         },
         "debug": {
           "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
+          "from": "debug@>=2.2.0 <2.3.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
         },
         "ms": {
           "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+          "from": "ms@0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
         },
         "negotiator": {
           "version": "0.5.3",
-          "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.5.3.tgz",
-          "integrity": "sha1-Jp1cR2gQ7JLtvntsLygxY4T5p+g="
+          "from": "negotiator@0.5.3",
+          "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.5.3.tgz"
         },
         "vary": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/vary/-/vary-1.0.1.tgz",
-          "integrity": "sha1-meSYFWaihhGN+yuBc1ffeZM3bRA="
+          "from": "vary@>=1.0.1 <1.1.0",
+          "resolved": "https://registry.npmjs.org/vary/-/vary-1.0.1.tgz"
         }
       }
     },
     "concat-map": {
       "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
-      "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s="
+      "from": "concat-map@0.0.1",
+      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz"
     },
     "concat-stream": {
       "version": "1.5.0",
+      "from": "concat-stream@1.5.0",
       "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.5.0.tgz",
-      "integrity": "sha1-U/fUPFHF5D+ByP3QMyHGMb5o1hE=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
           "version": "2.0.6",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz",
-          "integrity": "sha1-j5A0HmilPMySh4jaz80Rs265t44="
+          "from": "readable-stream@>=2.0.0 <2.1.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz"
         }
       }
     },
     "configstore": {
       "version": "2.1.0",
+      "from": "configstore@>=2.0.0 <3.0.0",
       "resolved": "https://registry.npmjs.org/configstore/-/configstore-2.1.0.tgz",
-      "integrity": "sha1-c3o6cDbpiGECqmCZ5HuzOrGroaE=",
       "dependencies": {
         "uuid": {
           "version": "2.0.3",
-          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz",
-          "integrity": "sha1-Z+LoY3lyFVMN/zGOW/nc6/1Hsho="
+          "from": "uuid@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz"
         }
       }
     },
     "connect": {
       "version": "3.6.2",
-      "resolved": "https://registry.npmjs.org/connect/-/connect-3.6.2.tgz",
-      "integrity": "sha1-aU6NIGgb/kkCgsiriGvpjwn0L+c="
+      "from": "connect@>=3.3.5 <4.0.0",
+      "resolved": "https://registry.npmjs.org/connect/-/connect-3.6.2.tgz"
     },
     "connect-history-api-fallback": {
       "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.3.0.tgz",
-      "integrity": "sha1-5R0X+PDvDbkKZP20feMFFVbp8Wk="
+      "from": "connect-history-api-fallback@>=1.3.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.3.0.tgz"
     },
     "connect-livereload": {
       "version": "0.5.4",
-      "resolved": "https://registry.npmjs.org/connect-livereload/-/connect-livereload-0.5.4.tgz",
-      "integrity": "sha1-gBV9E3HJ83zBQDmrGJWXDRGdw7w="
+      "from": "connect-livereload@>=0.5.4 <0.6.0",
+      "resolved": "https://registry.npmjs.org/connect-livereload/-/connect-livereload-0.5.4.tgz"
     },
     "connect-timeout": {
       "version": "1.6.2",
+      "from": "connect-timeout@>=1.6.2 <1.7.0",
       "resolved": "https://registry.npmjs.org/connect-timeout/-/connect-timeout-1.6.2.tgz",
-      "integrity": "sha1-3ppexh4zoStu2qt7XwYumMWZuI4=",
       "dependencies": {
         "debug": {
           "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
+          "from": "debug@>=2.2.0 <2.3.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
         },
         "http-errors": {
           "version": "1.3.1",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
-          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
+          "from": "http-errors@>=1.3.1 <1.4.0",
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
         },
         "ms": {
           "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+          "from": "ms@0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
         }
       }
     },
     "console-browserify": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.1.0.tgz",
-      "integrity": "sha1-8CQcRXMKn8YyOyBtvzjtx0HQuxA="
+      "from": "console-browserify@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.1.0.tgz"
     },
     "console-control-strings": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz",
-      "integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4="
+      "from": "console-control-strings@>=1.1.0 <1.2.0",
+      "resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz"
     },
     "constants-browserify": {
       "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-0.0.1.tgz",
-      "integrity": "sha1-kld9tSe6bEzwpFaNhLwDH0QeIfI="
+      "from": "constants-browserify@0.0.1",
+      "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-0.0.1.tgz"
     },
     "content-disposition": {
       "version": "0.5.2",
-      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.2.tgz",
-      "integrity": "sha1-DPaLud318r55YcOoUXjLhdunjLQ="
+      "from": "content-disposition@0.5.2",
+      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.2.tgz"
     },
     "content-type": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.2.tgz",
-      "integrity": "sha1-t9ETrueo3Se9IRM8TcJSnfFyHu0="
+      "from": "content-type@>=1.0.2 <1.1.0",
+      "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.2.tgz"
     },
     "convert-source-map": {
       "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.5.0.tgz",
-      "integrity": "sha1-ms1whRxtXf3ZPZKC5e35SgP/RrU="
+      "from": "convert-source-map@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.5.0.tgz"
     },
     "cookie": {
       "version": "0.3.1",
-      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.3.1.tgz",
-      "integrity": "sha1-5+Ch+e9DtMi6klxcWpboBtFoc7s="
+      "from": "cookie@0.3.1",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.3.1.tgz"
     },
     "cookie-parser": {
       "version": "1.3.5",
+      "from": "cookie-parser@>=1.3.5 <1.4.0",
       "resolved": "https://registry.npmjs.org/cookie-parser/-/cookie-parser-1.3.5.tgz",
-      "integrity": "sha1-nXVVcPtdF4kHcSJ6AjFNm+fPg1Y=",
       "dependencies": {
         "cookie": {
           "version": "0.1.3",
-          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz",
-          "integrity": "sha1-5zSlwUF/zkctWu+Cw4HKu2TRpDU="
+          "from": "cookie@0.1.3",
+          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz"
         }
       }
     },
     "cookie-signature": {
       "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
-      "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw="
+      "from": "cookie-signature@1.0.6",
+      "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz"
     },
     "core-js": {
       "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.4.1.tgz",
-      "integrity": "sha1-TekR5mew6ukSTjQlS1OupvxhjT4="
+      "from": "core-js@>=2.1.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.4.1.tgz"
     },
     "core-util-is": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
-      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac="
+      "from": "core-util-is@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz"
     },
     "cosmiconfig": {
       "version": "2.1.3",
-      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-2.1.3.tgz",
-      "integrity": "sha1-lSdx6w3dwcs/ovb75RpSLpOz7go="
+      "from": "cosmiconfig@>=2.1.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-2.1.3.tgz"
     },
     "crc": {
       "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/crc/-/crc-3.3.0.tgz",
-      "integrity": "sha1-+mIuG8OIvyVzCQgta2UgDOZwkLo="
+      "from": "crc@3.3.0",
+      "resolved": "https://registry.npmjs.org/crc/-/crc-3.3.0.tgz"
     },
     "create-ecdh": {
       "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.0.tgz",
-      "integrity": "sha1-iIxyNZbN92EvZJgjPuvXo1MBc30="
+      "from": "create-ecdh@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.0.tgz"
     },
     "create-error-class": {
       "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/create-error-class/-/create-error-class-3.0.2.tgz",
-      "integrity": "sha1-Br56vvlHo/FKMP1hBnHUAbyot7Y="
+      "from": "create-error-class@>=3.0.1 <4.0.0",
+      "resolved": "https://registry.npmjs.org/create-error-class/-/create-error-class-3.0.2.tgz"
     },
     "create-hash": {
       "version": "1.1.3",
+      "from": "create-hash@>=1.1.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/create-hash/-/create-hash-1.1.3.tgz",
-      "integrity": "sha1-YGBCrIuSYnUPSDyt2rD1gZFy2P0=",
       "dependencies": {
         "ripemd160": {
           "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz",
-          "integrity": "sha1-D0WEKVxTo2KK9+bXmsohzlfRxuc="
+          "from": "ripemd160@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz"
         },
         "sha.js": {
           "version": "2.4.8",
-          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz",
-          "integrity": "sha1-NwaMLEdra69ALRSknGf1l5IfY08="
+          "from": "sha.js@>=2.4.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz"
         }
       }
     },
     "create-hmac": {
       "version": "1.1.6",
+      "from": "create-hmac@>=1.1.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/create-hmac/-/create-hmac-1.1.6.tgz",
-      "integrity": "sha1-rLniIaThe9sHbpBlfEK5PjcmzwY=",
       "dependencies": {
         "ripemd160": {
           "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz",
-          "integrity": "sha1-D0WEKVxTo2KK9+bXmsohzlfRxuc="
+          "from": "ripemd160@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz"
         },
         "sha.js": {
           "version": "2.4.8",
-          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz",
-          "integrity": "sha1-NwaMLEdra69ALRSknGf1l5IfY08="
+          "from": "sha.js@>=2.4.8 <3.0.0",
+          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz"
         }
       }
     },
     "cross-spawn": {
       "version": "3.0.1",
+      "from": "cross-spawn@>=3.0.0 <4.0.0",
       "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-3.0.1.tgz",
-      "integrity": "sha1-ElYDfsufDF9549bvE14wdwGEuYI=",
       "dependencies": {
         "lru-cache": {
           "version": "4.0.2",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.0.2.tgz",
-          "integrity": "sha1-HRdnnAac2l0ECZGgnbwsDbN35V4="
+          "from": "lru-cache@>=4.0.1 <5.0.0",
+          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.0.2.tgz"
         }
       }
     },
     "cross-spawn-async": {
       "version": "2.2.5",
+      "from": "cross-spawn-async@>=2.1.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/cross-spawn-async/-/cross-spawn-async-2.2.5.tgz",
-      "integrity": "sha1-hF/wwINKPe2dFg2sptOQkGuyiMw=",
       "dependencies": {
         "lru-cache": {
           "version": "4.0.2",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.0.2.tgz",
-          "integrity": "sha1-HRdnnAac2l0ECZGgnbwsDbN35V4="
+          "from": "lru-cache@>=4.0.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.0.2.tgz"
         }
       }
     },
     "crypt": {
       "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/crypt/-/crypt-0.0.2.tgz",
-      "integrity": "sha1-iNf/fsDfuG9xPch7u0LQRNPmxBs="
+      "from": "crypt@>=0.0.1 <0.1.0",
+      "resolved": "https://registry.npmjs.org/crypt/-/crypt-0.0.2.tgz"
     },
     "cryptiles": {
       "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz",
-      "integrity": "sha1-O9/s3GCBR8HGcgL6KR59ylnqo7g="
+      "from": "cryptiles@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz"
     },
     "crypto-browserify": {
       "version": "3.2.8",
-      "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.2.8.tgz",
-      "integrity": "sha1-ubEdvm2WUd2IKgHmzEZ99xjs8Yk="
+      "from": "crypto-browserify@>=3.2.6 <3.3.0",
+      "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.2.8.tgz"
     },
     "crypto-random-string": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-1.0.0.tgz",
-      "integrity": "sha1-ojD2T1aDEOFJgAmUB5DsmVRbyn4="
+      "from": "crypto-random-string@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-1.0.0.tgz"
     },
     "csrf": {
       "version": "3.0.6",
-      "resolved": "https://registry.npmjs.org/csrf/-/csrf-3.0.6.tgz",
-      "integrity": "sha1-thEg3c7q/JHnbtUxO7XAsmZ7cQo="
+      "from": "csrf@>=3.0.0 <3.1.0",
+      "resolved": "https://registry.npmjs.org/csrf/-/csrf-3.0.6.tgz"
     },
     "css-color-names": {
       "version": "0.0.4",
-      "resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz",
-      "integrity": "sha1-gIrcLnnPhHOAabZGyyDsJ762KeA="
+      "from": "css-color-names@0.0.4",
+      "resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz"
     },
     "css-loader": {
       "version": "0.28.4",
+      "from": "css-loader@>=0.28.0 <0.29.0",
       "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.4.tgz",
-      "integrity": "sha1-bPNXkZLONV6LONX0Ldeh8uyJjQ8=",
       "dependencies": {
         "loader-utils": {
           "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
-          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
+          "from": "loader-utils@>=1.0.2 <2.0.0",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
         },
         "lodash.camelcase": {
           "version": "4.3.0",
-          "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz",
-          "integrity": "sha1-soqmKIorn8ZRA1x3EfZathkDMaY="
+          "from": "lodash.camelcase@>=4.3.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz"
         }
       }
     },
     "css-modules-loader-core": {
       "version": "1.1.0",
+      "from": "css-modules-loader-core@>=1.0.1 <2.0.0",
       "resolved": "https://registry.npmjs.org/css-modules-loader-core/-/css-modules-loader-core-1.1.0.tgz",
-      "integrity": "sha1-WQhmgpShvs0mGuCkziGwtVHyHRY=",
       "dependencies": {
         "postcss": {
           "version": "6.0.1",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
-          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
+          "from": "postcss@6.0.1",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
         },
         "supports-color": {
           "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "from": "supports-color@>=3.2.3 <4.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
         }
       }
     },
     "css-select": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz",
-      "integrity": "sha1-KzoRBTnFNV8c2NMUYj6HCxIeyFg="
+      "from": "css-select@>=1.2.0 <1.3.0",
+      "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz"
     },
     "css-selector-tokenizer": {
       "version": "0.7.0",
-      "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.7.0.tgz",
-      "integrity": "sha1-5piEdK6MlTR3v15+/s/OzNnPTIY="
+      "from": "css-selector-tokenizer@>=0.7.0 <0.8.0",
+      "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.7.0.tgz"
     },
     "css-what": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/css-what/-/css-what-2.1.0.tgz",
-      "integrity": "sha1-lGfQMsOM+u+58teVASUwYvh/ob0="
+      "from": "css-what@>=2.1.0 <2.2.0",
+      "resolved": "https://registry.npmjs.org/css-what/-/css-what-2.1.0.tgz"
     },
     "cssesc": {
       "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-0.1.0.tgz",
-      "integrity": "sha1-yBSQPkViM3GgR3tAEJqq++6t27Q="
+      "from": "cssesc@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-0.1.0.tgz"
     },
     "cssnano": {
       "version": "3.10.0",
-      "resolved": "https://registry.npmjs.org/cssnano/-/cssnano-3.10.0.tgz",
-      "integrity": "sha1-Tzj2zqK5sX+gFJDyPx3GjqZcHDg="
+      "from": "cssnano@>=2.6.1 <4.0.0",
+      "resolved": "https://registry.npmjs.org/cssnano/-/cssnano-3.10.0.tgz"
     },
     "csso": {
       "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/csso/-/csso-2.3.2.tgz",
-      "integrity": "sha1-3dUsWHAz9J6Utx/FVWnyUuj/X4U="
+      "from": "csso@>=2.3.1 <2.4.0",
+      "resolved": "https://registry.npmjs.org/csso/-/csso-2.3.2.tgz"
     },
     "csurf": {
       "version": "1.8.3",
+      "from": "csurf@>=1.8.3 <1.9.0",
       "resolved": "https://registry.npmjs.org/csurf/-/csurf-1.8.3.tgz",
-      "integrity": "sha1-I/KhO/HY/OHQyZZYg5RELLqGpWo=",
       "dependencies": {
         "cookie": {
           "version": "0.1.3",
-          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz",
-          "integrity": "sha1-5zSlwUF/zkctWu+Cw4HKu2TRpDU="
+          "from": "cookie@0.1.3",
+          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz"
         },
         "http-errors": {
           "version": "1.3.1",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
-          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
+          "from": "http-errors@>=1.3.1 <1.4.0",
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
         }
       }
     },
     "currently-unhandled": {
       "version": "0.4.1",
-      "resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz",
-      "integrity": "sha1-mI3zP+qxke95mmE2nddsF635V+o="
+      "from": "currently-unhandled@>=0.4.1 <0.5.0",
+      "resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz"
     },
     "custom-event": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/custom-event/-/custom-event-1.0.1.tgz",
-      "integrity": "sha1-XQKkaFCt8bSjF5RqOSj8y1v9BCU="
+      "from": "custom-event@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/custom-event/-/custom-event-1.0.1.tgz"
     },
     "cyclist": {
       "version": "0.2.2",
-      "resolved": "https://registry.npmjs.org/cyclist/-/cyclist-0.2.2.tgz",
-      "integrity": "sha1-GzN5LhHpFKL9bW7WRHRkRE5fpkA="
+      "from": "cyclist@>=0.2.2 <0.3.0",
+      "resolved": "https://registry.npmjs.org/cyclist/-/cyclist-0.2.2.tgz"
     },
     "d": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/d/-/d-1.0.0.tgz",
-      "integrity": "sha1-dUu1v+VUUdpppYuU1F9MWwRi1Y8="
+      "from": "d@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/d/-/d-1.0.0.tgz"
     },
     "d3": {
       "version": "3.5.17",
-      "resolved": "https://registry.npmjs.org/d3/-/d3-3.5.17.tgz",
-      "integrity": "sha1-vEZ0gAQ3iyGjYMn8fPUjF5B2L7g="
+      "from": "d3@>=3.5.6 <4.0.0",
+      "resolved": "https://registry.npmjs.org/d3/-/d3-3.5.17.tgz"
     },
     "dashdash": {
       "version": "1.14.1",
+      "from": "dashdash@>=1.12.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/dashdash/-/dashdash-1.14.1.tgz",
-      "integrity": "sha1-hTz6D3y+L+1d4gMmuN1YEDX24vA=",
       "dependencies": {
         "assert-plus": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
+          "from": "assert-plus@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz"
         }
       }
     },
     "date-now": {
       "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/date-now/-/date-now-0.1.4.tgz",
-      "integrity": "sha1-6vQ5/U1ISK105cx9vvIAZyueNFs="
+      "from": "date-now@>=0.1.4 <0.2.0",
+      "resolved": "https://registry.npmjs.org/date-now/-/date-now-0.1.4.tgz"
     },
     "dateformat": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-2.0.0.tgz",
-      "integrity": "sha1-J0Pjq7XD/CRi5SfcpEXgTp9N7hc="
+      "from": "dateformat@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-2.0.0.tgz"
     },
     "deasync": {
       "version": "0.1.9",
-      "resolved": "https://registry.npmjs.org/deasync/-/deasync-0.1.9.tgz",
-      "integrity": "sha1-9Y3Un6YxEMdL6oQFqQqCi+JtOiQ="
+      "from": "deasync@>=0.1.7 <0.2.0",
+      "resolved": "https://registry.npmjs.org/deasync/-/deasync-0.1.9.tgz"
     },
     "debug": {
       "version": "2.6.7",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.7.tgz",
-      "integrity": "sha1-krrR9tBbu2u6Isyoi80OyJTChh4="
+      "from": "debug@2.6.7",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.7.tgz"
     },
     "decamelize": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
-      "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA="
+      "from": "decamelize@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz"
     },
     "decomment": {
       "version": "0.8.7",
-      "resolved": "https://registry.npmjs.org/decomment/-/decomment-0.8.7.tgz",
-      "integrity": "sha1-JI8hFvbOOo6N0bY+WzWrpcoFTKU="
+      "from": "decomment@>=0.8.2 <0.9.0",
+      "resolved": "https://registry.npmjs.org/decomment/-/decomment-0.8.7.tgz"
     },
     "deep-eql": {
       "version": "0.1.3",
+      "from": "deep-eql@>=0.1.3 <0.2.0",
       "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-0.1.3.tgz",
-      "integrity": "sha1-71WKyrjeJSBs1xOQbXTlaTDrafI=",
       "dependencies": {
         "type-detect": {
           "version": "0.1.1",
-          "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-0.1.1.tgz",
-          "integrity": "sha1-C6XsKohWQORw6k6FBZcZANrFiCI="
+          "from": "type-detect@0.1.1",
+          "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-0.1.1.tgz"
         }
       }
     },
     "deep-extend": {
       "version": "0.4.2",
-      "resolved": "https://registry.npmjs.org/deep-extend/-/deep-extend-0.4.2.tgz",
-      "integrity": "sha1-SLaZwn4zS/ifEIkr5DL25MfTSn8="
+      "from": "deep-extend@>=0.4.0 <0.5.0",
+      "resolved": "https://registry.npmjs.org/deep-extend/-/deep-extend-0.4.2.tgz"
     },
     "deep-is": {
       "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz",
-      "integrity": "sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ="
+      "from": "deep-is@>=0.1.3 <0.2.0",
+      "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz"
     },
     "defaults": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.3.tgz",
-      "integrity": "sha1-xlYFHpgX2f8I7YgUd/P+QBnz730="
+      "from": "defaults@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.3.tgz"
     },
     "define-properties": {
       "version": "1.1.2",
+      "from": "define-properties@>=1.1.2 <2.0.0",
       "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.1.2.tgz",
-      "integrity": "sha1-g6c/L+pWmJj7c3GTyPhzyvbUXJQ=",
       "dependencies": {
         "object-keys": {
           "version": "1.0.11",
-          "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.0.11.tgz",
-          "integrity": "sha1-xUYBd4rVYPEULODgG8yotW0TQm0="
+          "from": "object-keys@>=1.0.8 <2.0.0",
+          "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.0.11.tgz"
         }
       }
     },
     "defined": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/defined/-/defined-1.0.0.tgz",
-      "integrity": "sha1-yY2bzvdWdBiOEQlpFRGZ45sfppM="
+      "from": "defined@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/defined/-/defined-1.0.0.tgz"
     },
     "del": {
       "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/del/-/del-2.2.2.tgz",
-      "integrity": "sha1-wSyYHQZ4RshLyvhiz/kw2Qf/0ag="
+      "from": "del@>=2.2.2 <3.0.0",
+      "resolved": "https://registry.npmjs.org/del/-/del-2.2.2.tgz"
     },
     "delayed-stream": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
-      "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk="
+      "from": "delayed-stream@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz"
     },
     "delegates": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz",
-      "integrity": "sha1-hMbhWbgZBP3KWaDvRM2HDTElD5o="
+      "from": "delegates@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz"
     },
     "depd": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.0.tgz",
-      "integrity": "sha1-4b2Cxqq2ztlluXuIsX7T5SjKGMM="
+      "from": "depd@>=1.1.0 <1.2.0",
+      "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.0.tgz"
     },
     "deprecated": {
       "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/deprecated/-/deprecated-0.0.1.tgz",
-      "integrity": "sha1-+cmvVGSvoeepcUWKi97yqpTVuxk="
+      "from": "deprecated@>=0.0.1 <0.0.2",
+      "resolved": "https://registry.npmjs.org/deprecated/-/deprecated-0.0.1.tgz"
     },
     "des.js": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/des.js/-/des.js-1.0.0.tgz",
-      "integrity": "sha1-wHTS4qpqipoH29YfmhXCzYPsjsw="
+      "from": "des.js@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/des.js/-/des.js-1.0.0.tgz"
     },
     "destroy": {
       "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.0.4.tgz",
-      "integrity": "sha1-l4hXRCxEdJ5CBmE+N5RiBYJqvYA="
+      "from": "destroy@>=1.0.4 <1.1.0",
+      "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.0.4.tgz"
     },
     "detect-file": {
       "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/detect-file/-/detect-file-0.1.0.tgz",
-      "integrity": "sha1-STXe39lIhkjgBrASlWbpOGcR6mM="
+      "from": "detect-file@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/detect-file/-/detect-file-0.1.0.tgz"
     },
     "detect-node": {
       "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.0.3.tgz",
-      "integrity": "sha1-ogM8CcyOFY03dI+951B4Mr1s4Sc="
+      "from": "detect-node@>=2.0.3 <3.0.0",
+      "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.0.3.tgz"
     },
     "detective": {
       "version": "4.5.0",
+      "from": "detective@>=4.3.1 <5.0.0",
       "resolved": "https://registry.npmjs.org/detective/-/detective-4.5.0.tgz",
-      "integrity": "sha1-blqMaybmx6JUsca210kNmOyR7dE=",
       "dependencies": {
         "acorn": {
           "version": "4.0.13",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
-          "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c="
+          "from": "acorn@>=4.0.3 <5.0.0",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz"
         }
       }
     },
     "di": {
       "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/di/-/di-0.0.1.tgz",
-      "integrity": "sha1-gGZJMmzqp8qjMG112YXqJ0i6kTw="
+      "from": "di@>=0.0.1 <0.0.2",
+      "resolved": "https://registry.npmjs.org/di/-/di-0.0.1.tgz"
     },
     "diff": {
       "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/diff/-/diff-3.2.0.tgz",
-      "integrity": "sha1-yc45Okt8vQsFinJck98pkCeGj/k="
+      "from": "diff@>=3.0.1 <4.0.0",
+      "resolved": "https://registry.npmjs.org/diff/-/diff-3.2.0.tgz"
     },
     "diffie-hellman": {
       "version": "5.0.2",
-      "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.2.tgz",
-      "integrity": "sha1-tYNXOScM/ias9jIJn97SoH8gnl4="
+      "from": "diffie-hellman@>=5.0.0 <6.0.0",
+      "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.2.tgz"
     },
     "dom-serialize": {
       "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/dom-serialize/-/dom-serialize-2.2.1.tgz",
-      "integrity": "sha1-ViromZ9Evl6jB29UGdzVnrQ6yVs="
+      "from": "dom-serialize@>=2.2.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/dom-serialize/-/dom-serialize-2.2.1.tgz"
     },
     "dom-serializer": {
       "version": "0.1.0",
+      "from": "dom-serializer@>=0.1.0 <0.2.0",
       "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.1.0.tgz",
-      "integrity": "sha1-BzxpdUbOB4DOI75KKOKT5AvDDII=",
       "dependencies": {
         "domelementtype": {
           "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.1.3.tgz",
-          "integrity": "sha1-vSh3PiZCiBrsUVRJJCmcXNgiGFs="
+          "from": "domelementtype@>=1.1.1 <1.2.0",
+          "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.1.3.tgz"
         }
       }
     },
     "domain-browser": {
       "version": "1.1.7",
-      "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.1.7.tgz",
-      "integrity": "sha1-hnqksJP6oF8d4IwG9NeyH9+GmLw="
+      "from": "domain-browser@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.1.7.tgz"
     },
     "domelementtype": {
       "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.3.0.tgz",
-      "integrity": "sha1-sXrtguirWeUt2cGbF1bg/BhyBMI="
+      "from": "domelementtype@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.3.0.tgz"
     },
     "domhandler": {
       "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.4.1.tgz",
-      "integrity": "sha1-iS5HAAqZvlW783dP/qBWHYh5wlk="
+      "from": "domhandler@>=2.3.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.4.1.tgz"
     },
     "domutils": {
       "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.5.1.tgz",
-      "integrity": "sha1-3NhIiib1Y9YQeeSMn3t+Mjc2gs8="
+      "from": "domutils@1.5.1",
+      "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.5.1.tgz"
     },
     "dot-prop": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-3.0.0.tgz",
-      "integrity": "sha1-G3CK8JSknJoOfbyteQq6U52sEXc="
+      "from": "dot-prop@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-3.0.0.tgz"
     },
     "duplexer": {
       "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz",
-      "integrity": "sha1-rOb/gIwc5mtX0ev5eXessCM0z8E="
+      "from": "duplexer@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz"
     },
     "duplexer2": {
       "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.0.2.tgz",
-      "integrity": "sha1-xhTc9n4vsUmVqRcR5aYX6KYKMds="
+      "from": "duplexer2@0.0.2",
+      "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.0.2.tgz"
     },
     "duplexer3": {
       "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/duplexer3/-/duplexer3-0.1.4.tgz",
-      "integrity": "sha1-7gHdHKwO08vH/b6jfcCo8c4ALOI="
+      "from": "duplexer3@>=0.1.4 <0.2.0",
+      "resolved": "https://registry.npmjs.org/duplexer3/-/duplexer3-0.1.4.tgz"
     },
     "duplexify": {
       "version": "3.5.0",
+      "from": "duplexify@>=3.5.0 <4.0.0",
       "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-3.5.0.tgz",
-      "integrity": "sha1-GqdzAC4VeEV+nZ1KULDMquvL1gQ=",
       "dependencies": {
         "end-of-stream": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.0.0.tgz",
-          "integrity": "sha1-1FlucCc0qT5A6a+GQxnqvZn/Lw4="
+          "from": "end-of-stream@1.0.0",
+          "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.0.0.tgz"
         },
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "once": {
           "version": "1.3.3",
-          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz",
-          "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA="
+          "from": "once@>=1.3.0 <1.4.0",
+          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
     "ecc-jsbn": {
       "version": "0.1.1",
+      "from": "ecc-jsbn@>=0.1.1 <0.2.0",
       "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.1.tgz",
-      "integrity": "sha1-D8c6ntXw1Tw4GTOYUj735UN3dQU=",
       "optional": true
     },
     "ee-first": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
-      "integrity": "sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0="
+      "from": "ee-first@1.1.1",
+      "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz"
     },
     "ejs": {
       "version": "2.5.6",
-      "resolved": "https://registry.npmjs.org/ejs/-/ejs-2.5.6.tgz",
-      "integrity": "sha1-R5Y2v6P+Ox3r1SCH8KyyBLTxnIg="
+      "from": "ejs@>=2.5.6 <3.0.0",
+      "resolved": "https://registry.npmjs.org/ejs/-/ejs-2.5.6.tgz"
     },
     "electron-to-chromium": {
       "version": "1.3.13",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.13.tgz",
-      "integrity": "sha1-GzperObgh7teJXoQCwy/6Bsokfw="
+      "from": "electron-to-chromium@>=1.2.7 <2.0.0",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.13.tgz"
     },
     "elliptic": {
       "version": "6.4.0",
-      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.4.0.tgz",
-      "integrity": "sha1-ysmvh2LIWDYYcAPI3+GT5eLq5d8="
+      "from": "elliptic@>=6.0.0 <7.0.0",
+      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.4.0.tgz"
     },
     "emojis-list": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-2.1.0.tgz",
-      "integrity": "sha1-TapNnbAPmBmIDHn6RXrlsJof04k="
+      "from": "emojis-list@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-2.1.0.tgz"
     },
     "encodeurl": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.1.tgz",
-      "integrity": "sha1-eePVhlU0aQn+bw9Fpd5oEDspTSA="
+      "from": "encodeurl@>=1.0.1 <1.1.0",
+      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.1.tgz"
     },
     "encoding": {
       "version": "0.1.12",
-      "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.12.tgz",
-      "integrity": "sha1-U4tm8+5izRq1HsMjgp0flIDHS+s="
+      "from": "encoding@>=0.1.11 <0.2.0",
+      "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.12.tgz"
     },
     "end-of-stream": {
       "version": "1.1.0",
+      "from": "end-of-stream@>=1.1.0 <1.2.0",
       "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.1.0.tgz",
-      "integrity": "sha1-6TUyWLqpEIll78QcsO+K3i88+wc=",
       "dependencies": {
         "once": {
           "version": "1.3.3",
-          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz",
-          "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA="
+          "from": "once@>=1.3.0 <1.4.0",
+          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz"
         }
       }
     },
     "engine.io": {
       "version": "1.8.4",
+      "from": "engine.io@>=1.8.4 <1.9.0",
       "resolved": "https://registry.npmjs.org/engine.io/-/engine.io-1.8.4.tgz",
-      "integrity": "sha1-d7zhK4Dl1gQpM3/sOw2vaR68kAM=",
       "dependencies": {
         "debug": {
           "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
-          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
+          "from": "debug@2.3.3",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz"
         },
         "ms": {
           "version": "0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
-          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
         }
       }
     },
     "engine.io-client": {
       "version": "1.8.4",
+      "from": "engine.io-client@>=1.8.4 <1.9.0",
       "resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-1.8.4.tgz",
-      "integrity": "sha1-n+hd7iWFPKa6viW9KtaHEIY+kcI=",
       "dependencies": {
         "component-emitter": {
           "version": "1.2.1",
-          "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz",
-          "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY="
+          "from": "component-emitter@1.2.1",
+          "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz"
         },
         "debug": {
           "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
-          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
+          "from": "debug@2.3.3",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz"
         },
         "ms": {
           "version": "0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
-          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
         },
         "ws": {
           "version": "1.1.2",
-          "resolved": "https://registry.npmjs.org/ws/-/ws-1.1.2.tgz",
-          "integrity": "sha1-iiRPoFJAHgjJiGz0SoUYnh/UBn8="
+          "from": "ws@1.1.2",
+          "resolved": "https://registry.npmjs.org/ws/-/ws-1.1.2.tgz"
         }
       }
     },
     "engine.io-parser": {
       "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-1.3.2.tgz",
-      "integrity": "sha1-k3sHnwAH0Ik+xW1GyyILjLQ1Igo="
+      "from": "engine.io-parser@1.3.2",
+      "resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-1.3.2.tgz"
     },
     "enhanced-resolve": {
       "version": "0.9.1",
+      "from": "enhanced-resolve@>=0.9.0 <0.10.0",
       "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-0.9.1.tgz",
-      "integrity": "sha1-TW5omzcl+GCQknzMhs2fFjW4ni4=",
       "dependencies": {
         "memory-fs": {
           "version": "0.2.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.2.0.tgz",
-          "integrity": "sha1-8rslNovBIeORwlIN6Slpyu4KApA="
+          "from": "memory-fs@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.2.0.tgz"
         }
       }
     },
     "ent": {
       "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/ent/-/ent-2.2.0.tgz",
-      "integrity": "sha1-6WQhkyWiHQX0RGai9obtbOX13R0="
+      "from": "ent@>=2.2.0 <2.3.0",
+      "resolved": "https://registry.npmjs.org/ent/-/ent-2.2.0.tgz"
     },
     "entities": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.1.tgz",
-      "integrity": "sha1-blwtClYhtdra7O+AuQ7ftc13cvA="
+      "from": "entities@>=1.1.1 <1.2.0",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.1.tgz"
     },
     "envify": {
       "version": "3.4.1",
-      "resolved": "https://registry.npmjs.org/envify/-/envify-3.4.1.tgz",
-      "integrity": "sha1-1xIjKejfFoi6dxsSUBkXyc5cvOg="
+      "from": "envify@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/envify/-/envify-3.4.1.tgz"
     },
     "enzyme": {
       "version": "2.7.0",
+      "from": "enzyme@2.7.0",
       "resolved": "https://registry.npmjs.org/enzyme/-/enzyme-2.7.0.tgz",
-      "integrity": "sha1-dyR3gAVHyiUUzAryWOZHwWau6Jk=",
       "dependencies": {
         "lodash": {
           "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+          "from": "lodash@>=4.17.2 <5.0.0",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz"
         },
         "uuid": {
           "version": "2.0.3",
-          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz",
-          "integrity": "sha1-Z+LoY3lyFVMN/zGOW/nc6/1Hsho="
+          "from": "uuid@>=2.0.3 <3.0.0",
+          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz"
         }
       }
     },
     "errno": {
       "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.4.tgz",
-      "integrity": "sha1-uJbiOp5ei6M4cfyZar02NfyaHH0="
+      "from": "errno@>=0.1.3 <0.2.0",
+      "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.4.tgz"
     },
     "error-ex": {
       "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.1.tgz",
-      "integrity": "sha1-+FWobOYa3E6GIcPNoh56dhLDqNw="
+      "from": "error-ex@>=1.2.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.1.tgz"
     },
     "errorhandler": {
       "version": "1.4.3",
-      "resolved": "https://registry.npmjs.org/errorhandler/-/errorhandler-1.4.3.tgz",
-      "integrity": "sha1-t7cO2PNZ6duICS8tIMD4MUIK2D8="
+      "from": "errorhandler@>=1.4.2 <1.5.0",
+      "resolved": "https://registry.npmjs.org/errorhandler/-/errorhandler-1.4.3.tgz"
     },
     "es-abstract": {
       "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.7.0.tgz",
-      "integrity": "sha1-363ndOAb/Nl/lhgCmMRJyGI/uUw="
+      "from": "es-abstract@>=1.6.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.7.0.tgz"
     },
     "es-to-primitive": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.1.1.tgz",
-      "integrity": "sha1-RTVSSKiJeQNLZ5Lhm7gfK3l13Q0="
+      "from": "es-to-primitive@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.1.1.tgz"
     },
     "es5-ext": {
       "version": "0.10.21",
-      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.21.tgz",
-      "integrity": "sha1-Gacl+eUdAwC7wejoIRCf2dr1WSU="
+      "from": "es5-ext@>=0.10.14 <0.11.0",
+      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.21.tgz"
     },
     "es6-collections": {
       "version": "0.5.6",
-      "resolved": "https://registry.npmjs.org/es6-collections/-/es6-collections-0.5.6.tgz",
-      "integrity": "sha1-VVLoAK0SwYIM2ivUp5rn27A9iaI="
+      "from": "es6-collections@0.5.6",
+      "resolved": "https://registry.npmjs.org/es6-collections/-/es6-collections-0.5.6.tgz"
     },
     "es6-iterator": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.1.tgz",
-      "integrity": "sha1-jjGcnwRTv1ddN0lAplWSDlnKVRI="
+      "from": "es6-iterator@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.1.tgz"
     },
     "es6-promise": {
       "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.0.tgz",
-      "integrity": "sha1-3aA8qPn4m8WX5omEKSnee6jOvfA="
+      "from": "es6-promise@>=4.1.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.0.tgz"
     },
     "es6-symbol": {
       "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.1.tgz",
-      "integrity": "sha1-vwDvT9q2uhtG7Le2KbTH7VcVzHc="
+      "from": "es6-symbol@>=3.1.1 <4.0.0",
+      "resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.1.tgz"
     },
     "es6-templates": {
       "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/es6-templates/-/es6-templates-0.2.3.tgz",
-      "integrity": "sha1-XLmsn7He1usSOTQrgdeSu7QHjuQ="
+      "from": "es6-templates@>=0.2.2 <0.3.0",
+      "resolved": "https://registry.npmjs.org/es6-templates/-/es6-templates-0.2.3.tgz"
     },
     "es6-weak-map": {
       "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/es6-weak-map/-/es6-weak-map-2.0.2.tgz",
-      "integrity": "sha1-XjqzIlH/0VOKH45f+hNXdy+S2W8="
+      "from": "es6-weak-map@>=2.0.2 <3.0.0",
+      "resolved": "https://registry.npmjs.org/es6-weak-map/-/es6-weak-map-2.0.2.tgz"
     },
     "escape-html": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
-      "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg="
+      "from": "escape-html@>=1.0.3 <1.1.0",
+      "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz"
     },
     "escape-string-regexp": {
       "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
-      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ="
+      "from": "escape-string-regexp@>=1.0.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz"
     },
     "escodegen": {
       "version": "1.8.1",
+      "from": "escodegen@>=1.8.0 <1.9.0",
       "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-1.8.1.tgz",
-      "integrity": "sha1-WltTr0aTEQvrsIZ6o0MN07cKEBg=",
       "dependencies": {
         "esprima": {
           "version": "2.7.3",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz",
-          "integrity": "sha1-luO3DVd59q1JzQMmc9HDEnZ7pYE="
+          "from": "esprima@>=2.7.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz"
         },
         "source-map": {
           "version": "0.2.0",
+          "from": "source-map@>=0.2.0 <0.3.0",
           "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.2.0.tgz",
-          "integrity": "sha1-2rc/vPwrqBm03gO9b26qSBZLP50=",
           "optional": true
         }
       }
     },
     "esprima": {
       "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz",
-      "integrity": "sha1-/cpRzuYTOJXjyI1TXOSdv/YqRjM="
+      "from": "esprima@>=3.1.0 <3.2.0",
+      "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz"
     },
     "estraverse": {
       "version": "1.9.3",
-      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-1.9.3.tgz",
-      "integrity": "sha1-r2fy3JIlgkFZUJJgkaQAXSnJu0Q="
+      "from": "estraverse@>=1.9.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-1.9.3.tgz"
     },
     "esutils": {
       "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.2.tgz",
-      "integrity": "sha1-Cr9PHKpbyx96nYrMbepPqqBLrJs="
+      "from": "esutils@>=2.0.2 <3.0.0",
+      "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.2.tgz"
     },
     "etag": {
       "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/etag/-/etag-1.7.0.tgz",
-      "integrity": "sha1-A9MLX2fdbmMtKUXTDWZScxo01dg="
+      "from": "etag@>=1.7.0 <1.8.0",
+      "resolved": "https://registry.npmjs.org/etag/-/etag-1.7.0.tgz"
     },
     "event-stream": {
       "version": "3.0.20",
-      "resolved": "https://registry.npmjs.org/event-stream/-/event-stream-3.0.20.tgz",
-      "integrity": "sha1-A4u7LqnqkDhbJvvBhU0LU58qvqM="
+      "from": "event-stream@>=3.0.20 <3.1.0",
+      "resolved": "https://registry.npmjs.org/event-stream/-/event-stream-3.0.20.tgz"
     },
     "eventemitter3": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-1.2.0.tgz",
-      "integrity": "sha1-HIaZHYFq0eUEdQ5zh0Ik7PO+xQg="
+      "from": "eventemitter3@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-1.2.0.tgz"
     },
     "events": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/events/-/events-1.1.1.tgz",
-      "integrity": "sha1-nr23Y1rQmccNzEwqH1AEKI6L2SQ="
+      "from": "events@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/events/-/events-1.1.1.tgz"
     },
     "eventsource": {
       "version": "0.1.6",
-      "resolved": "https://registry.npmjs.org/eventsource/-/eventsource-0.1.6.tgz",
-      "integrity": "sha1-Cs7ehJ7X3RzMMsgRuxG5RNTykjI="
+      "from": "eventsource@0.1.6",
+      "resolved": "https://registry.npmjs.org/eventsource/-/eventsource-0.1.6.tgz"
     },
     "evp_bytestokey": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/evp_bytestokey/-/evp_bytestokey-1.0.0.tgz",
-      "integrity": "sha1-SXtmrZ/vZc18CKYYCCS6FHa2blM="
+      "from": "evp_bytestokey@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/evp_bytestokey/-/evp_bytestokey-1.0.0.tgz"
     },
     "execa": {
       "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/execa/-/execa-0.4.0.tgz",
-      "integrity": "sha1-TrZGejaglfq7KXD/nV4/t7zm68M="
+      "from": "execa@>=0.4.0 <0.5.0",
+      "resolved": "https://registry.npmjs.org/execa/-/execa-0.4.0.tgz"
     },
     "exit-hook": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/exit-hook/-/exit-hook-1.1.1.tgz",
-      "integrity": "sha1-8FyiM7SMBdVP/wd2XfhQfpXAL/g="
+      "from": "exit-hook@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/exit-hook/-/exit-hook-1.1.1.tgz"
     },
     "expand-braces": {
       "version": "0.1.2",
+      "from": "expand-braces@>=0.1.1 <0.2.0",
       "resolved": "https://registry.npmjs.org/expand-braces/-/expand-braces-0.1.2.tgz",
-      "integrity": "sha1-SIsdHSRRyz06axks/AMPRMWFX+o=",
       "dependencies": {
         "braces": {
           "version": "0.1.5",
-          "resolved": "https://registry.npmjs.org/braces/-/braces-0.1.5.tgz",
-          "integrity": "sha1-wIVxEIUpHYt1/ddOqw+FlygHEeY="
+          "from": "braces@>=0.1.2 <0.2.0",
+          "resolved": "https://registry.npmjs.org/braces/-/braces-0.1.5.tgz"
         },
         "expand-range": {
           "version": "0.1.1",
-          "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-0.1.1.tgz",
-          "integrity": "sha1-TLjtoJk8pW+k9B/ELzy7TMrf8EQ="
+          "from": "expand-range@>=0.1.0 <0.2.0",
+          "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-0.1.1.tgz"
         },
         "is-number": {
           "version": "0.1.1",
-          "resolved": "https://registry.npmjs.org/is-number/-/is-number-0.1.1.tgz",
-          "integrity": "sha1-aaevEWlj1HIG7JvZtIoUIW8eOAY="
+          "from": "is-number@>=0.1.1 <0.2.0",
+          "resolved": "https://registry.npmjs.org/is-number/-/is-number-0.1.1.tgz"
         },
         "repeat-string": {
           "version": "0.2.2",
-          "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-0.2.2.tgz",
-          "integrity": "sha1-x6jTI2BoNiBZp+RlH8aITosftK4="
+          "from": "repeat-string@>=0.2.2 <0.3.0",
+          "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-0.2.2.tgz"
         }
       }
     },
     "expand-brackets": {
       "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
-      "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s="
+      "from": "expand-brackets@>=0.1.4 <0.2.0",
+      "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz"
     },
     "expand-range": {
       "version": "1.8.2",
-      "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz",
-      "integrity": "sha1-opnv/TNf4nIeuujiV+x5ZE/IUzc="
+      "from": "expand-range@>=1.8.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz"
     },
     "expand-tilde": {
       "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-1.2.2.tgz",
-      "integrity": "sha1-C4HrqJflo9MdHD0QL48BRB5VlEk="
+      "from": "expand-tilde@>=1.2.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-1.2.2.tgz"
     },
     "express": {
       "version": "4.14.1",
+      "from": "express@>=4.14.0 <4.15.0",
       "resolved": "https://registry.npmjs.org/express/-/express-4.14.1.tgz",
-      "integrity": "sha1-ZGwjf3ZvFIwhIK/wc4F7nk1+DTM=",
       "dependencies": {
         "debug": {
           "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
+          "from": "debug@>=2.2.0 <2.3.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
         },
         "finalhandler": {
           "version": "0.5.1",
-          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.5.1.tgz",
-          "integrity": "sha1-LEANjUUwk1vCMlScX6OF7Afeb80="
+          "from": "finalhandler@0.5.1",
+          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.5.1.tgz"
         },
         "ms": {
           "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+          "from": "ms@0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
         },
         "qs": {
           "version": "6.2.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-6.2.0.tgz",
-          "integrity": "sha1-O3hIwDwt7OaalSKw+ujEEm10Xzs="
+          "from": "qs@6.2.0",
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.2.0.tgz"
         }
       }
     },
     "express-session": {
       "version": "1.11.3",
+      "from": "express-session@>=1.11.3 <1.12.0",
       "resolved": "https://registry.npmjs.org/express-session/-/express-session-1.11.3.tgz",
-      "integrity": "sha1-XMmPP1/4Ttg1+Ry/CqvQxxB0AK8=",
       "dependencies": {
         "cookie": {
           "version": "0.1.3",
-          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz",
-          "integrity": "sha1-5zSlwUF/zkctWu+Cw4HKu2TRpDU="
+          "from": "cookie@0.1.3",
+          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz"
         },
         "debug": {
           "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
+          "from": "debug@>=2.2.0 <2.3.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
         },
         "depd": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz",
-          "integrity": "sha1-gK7GTJ1tl+ZcwqnKqTwKpqv3Oqo="
+          "from": "depd@>=1.0.1 <1.1.0",
+          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz"
         },
         "ms": {
           "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+          "from": "ms@0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
         },
         "uid-safe": {
           "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/uid-safe/-/uid-safe-2.0.0.tgz",
-          "integrity": "sha1-p/PGymSh9qXQTsDvPkw9U2cxcTc="
+          "from": "uid-safe@>=2.0.0 <2.1.0",
+          "resolved": "https://registry.npmjs.org/uid-safe/-/uid-safe-2.0.0.tgz"
         }
       }
     },
     "extend": {
       "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz",
-      "integrity": "sha1-p1Xqe8Gt/MWjHOfnYtuq3F5jZEQ="
+      "from": "extend@>=3.0.0 <3.1.0",
+      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz"
     },
     "extend-shallow": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
-      "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8="
+      "from": "extend-shallow@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz"
     },
     "extglob": {
       "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
-      "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
+      "from": "extglob@>=0.3.1 <0.4.0",
+      "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz"
     },
     "extract-zip": {
       "version": "1.5.0",
+      "from": "extract-zip@>=1.5.0 <1.6.0",
       "resolved": "https://registry.npmjs.org/extract-zip/-/extract-zip-1.5.0.tgz",
-      "integrity": "sha1-ksz22B73Cp+kwXRxFMzvbYaIpsQ=",
       "dependencies": {
         "debug": {
           "version": "0.7.4",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-0.7.4.tgz",
-          "integrity": "sha1-BuHqgILCyxTjmAbiLi9vdX+Srzk="
+          "from": "debug@0.7.4",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-0.7.4.tgz"
         },
         "minimist": {
           "version": "0.0.8",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
-          "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0="
+          "from": "minimist@0.0.8",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz"
         },
         "mkdirp": {
           "version": "0.5.0",
-          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.0.tgz",
-          "integrity": "sha1-HXMHam35hs2TROFecfzAWkyavxI="
+          "from": "mkdirp@0.5.0",
+          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.0.tgz"
         }
       }
     },
     "extsprintf": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.0.2.tgz",
-      "integrity": "sha1-4QgOBljjALBilJkMxw4VAiNf1VA="
+      "from": "extsprintf@1.0.2",
+      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.0.2.tgz"
     },
     "fancy-log": {
       "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/fancy-log/-/fancy-log-1.3.0.tgz",
-      "integrity": "sha1-Rb4X0Cu5kX1gzP/UmVyZnmyMmUg="
+      "from": "fancy-log@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/fancy-log/-/fancy-log-1.3.0.tgz"
     },
     "fast-levenshtein": {
       "version": "2.0.6",
-      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
-      "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc="
+      "from": "fast-levenshtein@>=2.0.4 <2.1.0",
+      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz"
     },
     "fastparse": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.1.tgz",
-      "integrity": "sha1-0eJkOzipTXWDtHkGDmxK/8lAcfg="
+      "from": "fastparse@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.1.tgz"
     },
     "faye-websocket": {
       "version": "0.10.0",
-      "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz",
-      "integrity": "sha1-TkkvjQTftviQA1B/btvy1QHnxvQ="
+      "from": "faye-websocket@>=0.10.0 <0.11.0",
+      "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz"
     },
     "fbjs": {
       "version": "0.6.1",
+      "from": "fbjs@>=0.6.1 <0.7.0",
       "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.6.1.tgz",
-      "integrity": "sha1-lja3cF9bqWhNRLcveDISVK/IYPc=",
       "dependencies": {
         "core-js": {
           "version": "1.2.7",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
-          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
+          "from": "core-js@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
         }
       }
     },
     "fd-slicer": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/fd-slicer/-/fd-slicer-1.0.1.tgz",
-      "integrity": "sha1-i1vL2ewyfFBBv5qwI/1nUPEXfmU="
+      "from": "fd-slicer@>=1.0.1 <1.1.0",
+      "resolved": "https://registry.npmjs.org/fd-slicer/-/fd-slicer-1.0.1.tgz"
     },
     "figures": {
       "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz",
-      "integrity": "sha1-y+Hjr/zxzUS4DK3+0o3Hk6lwHS4="
+      "from": "figures@>=1.3.5 <2.0.0",
+      "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz"
     },
     "file-loader": {
       "version": "0.8.5",
-      "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.8.5.tgz",
-      "integrity": "sha1-knXQMf54DyfUf19K8CvUNxPMFRs="
+      "from": "file-loader@>=0.8.5 <0.9.0",
+      "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.8.5.tgz"
     },
     "filename-regex": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz",
-      "integrity": "sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY="
+      "from": "filename-regex@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz"
     },
     "filesize": {
       "version": "3.5.10",
-      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.5.10.tgz",
-      "integrity": "sha1-/I+iPdtO+eXgq24eZPZ5okpWdh8="
+      "from": "filesize@>=3.5.9 <4.0.0",
+      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.5.10.tgz"
     },
     "fill-range": {
       "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz",
-      "integrity": "sha1-ULd9/X5Gm8dJJHCWNpn+eoSFpyM="
+      "from": "fill-range@>=2.1.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz"
     },
     "filled-array": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/filled-array/-/filled-array-1.1.0.tgz",
-      "integrity": "sha1-w8T2xmO5I0WamqKZEtLQMfFQf4Q="
+      "from": "filled-array@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/filled-array/-/filled-array-1.1.0.tgz"
     },
     "finalhandler": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.3.tgz",
-      "integrity": "sha1-70fneVDpmXgOhgIqVg4yF+DQzIk="
+      "from": "finalhandler@1.0.3",
+      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.3.tgz"
     },
     "find-index": {
       "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
-      "integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ="
+      "from": "find-index@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz"
     },
     "find-up": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
-      "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8="
+      "from": "find-up@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz"
     },
     "findup-sync": {
       "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.4.3.tgz",
-      "integrity": "sha1-QAQ5Kee8YK3wt/SCfExudaDeyhI="
+      "from": "findup-sync@>=0.4.2 <0.5.0",
+      "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.4.3.tgz"
     },
     "fined": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/fined/-/fined-1.0.2.tgz",
-      "integrity": "sha1-WyhCS3YNdZiWC374SA3/itNmDpc="
+      "from": "fined@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/fined/-/fined-1.0.2.tgz"
     },
     "first-chunk-stream": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/first-chunk-stream/-/first-chunk-stream-1.0.0.tgz",
-      "integrity": "sha1-Wb+1DNkF9g18OUzT2ayqtOatk04="
+      "from": "first-chunk-stream@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/first-chunk-stream/-/first-chunk-stream-1.0.0.tgz"
     },
     "flagged-respawn": {
       "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/flagged-respawn/-/flagged-respawn-0.3.2.tgz",
-      "integrity": "sha1-/xke3c1wiKZ1smEP/8l2vpuAdLU="
+      "from": "flagged-respawn@>=0.3.2 <0.4.0",
+      "resolved": "https://registry.npmjs.org/flagged-respawn/-/flagged-respawn-0.3.2.tgz"
     },
     "flatten": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz",
-      "integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I="
+      "from": "flatten@>=1.0.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz"
     },
     "for-in": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
-      "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA="
+      "from": "for-in@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz"
     },
     "for-own": {
       "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz",
-      "integrity": "sha1-UmXGgaTylNq78XyVCbZ2OqhFEM4="
+      "from": "for-own@>=0.1.4 <0.2.0",
+      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz"
     },
     "foreach": {
       "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/foreach/-/foreach-2.0.5.tgz",
-      "integrity": "sha1-C+4AUBiusmDQo6865ljdATbsG5k="
+      "from": "foreach@>=2.0.5 <3.0.0",
+      "resolved": "https://registry.npmjs.org/foreach/-/foreach-2.0.5.tgz"
     },
     "forever-agent": {
       "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
-      "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE="
+      "from": "forever-agent@>=0.6.1 <0.7.0",
+      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz"
     },
     "fork-stream": {
       "version": "0.0.4",
-      "resolved": "https://registry.npmjs.org/fork-stream/-/fork-stream-0.0.4.tgz",
-      "integrity": "sha1-24Sfznf2cIpfjzhq5TOgkHtUrnA="
+      "from": "fork-stream@>=0.0.4 <0.0.5",
+      "resolved": "https://registry.npmjs.org/fork-stream/-/fork-stream-0.0.4.tgz"
     },
     "form-data": {
       "version": "2.1.4",
-      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
-      "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE="
+      "from": "form-data@>=2.1.1 <2.2.0",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz"
     },
     "formatio": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.1.1.tgz",
-      "integrity": "sha1-XtPM1jZVEJc4NGXZlhmRAOhhYek="
+      "from": "formatio@1.1.1",
+      "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.1.1.tgz"
     },
     "forwarded": {
       "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.0.tgz",
-      "integrity": "sha1-Ge+YdMSuHCl7zweP3mOgm2aoQ2M="
+      "from": "forwarded@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.0.tgz"
     },
     "fresh": {
       "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.3.0.tgz",
-      "integrity": "sha1-ZR+DjiJCTnVm3hYdg1jKoZn4PU8="
+      "from": "fresh@0.3.0",
+      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.3.0.tgz"
     },
     "from": {
       "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/from/-/from-0.1.7.tgz",
-      "integrity": "sha1-g8YK/Fi5xWmXAH7Rp2izqzA6RP4="
+      "from": "from@>=0.0.0 <1.0.0",
+      "resolved": "https://registry.npmjs.org/from/-/from-0.1.7.tgz"
     },
     "fs-exists-sync": {
       "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/fs-exists-sync/-/fs-exists-sync-0.1.0.tgz",
-      "integrity": "sha1-mC1ok6+RjnLQjeyehnP/K1qNat0="
+      "from": "fs-exists-sync@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/fs-exists-sync/-/fs-exists-sync-0.1.0.tgz"
     },
     "fs-extra": {
       "version": "0.26.7",
-      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz",
-      "integrity": "sha1-muH92UiXeY7at20JGM9C0MMYT6k="
+      "from": "fs-extra@>=0.26.7 <0.27.0",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz"
     },
     "fs.realpath": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
-      "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
+      "from": "fs.realpath@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz"
     },
     "fstream": {
       "version": "1.0.11",
-      "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
-      "integrity": "sha1-XB+x8RdHcRTwYyoOtLcbPLD9MXE="
+      "from": "fstream@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz"
     },
     "ftp": {
       "version": "0.3.10",
-      "resolved": "https://registry.npmjs.org/ftp/-/ftp-0.3.10.tgz",
-      "integrity": "sha1-kZfYYa2BQvPmPVqDv+TFn3MwiF0="
+      "from": "ftp@>=0.3.8 <0.4.0",
+      "resolved": "https://registry.npmjs.org/ftp/-/ftp-0.3.10.tgz"
     },
     "function-bind": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.0.tgz",
-      "integrity": "sha1-FhdnFMgBeY5Ojyz391KUZ7tKV3E="
+      "from": "function-bind@>=1.0.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.0.tgz"
     },
     "function.prototype.name": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.0.0.tgz",
-      "integrity": "sha1-X1I8pk5JGl+Vq6gMweORCAoUSC4="
+      "from": "function.prototype.name@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.0.0.tgz"
     },
     "gauge": {
       "version": "2.7.4",
-      "resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz",
-      "integrity": "sha1-LANAXHU4w51+s3sxcCLjJfsBi/c="
+      "from": "gauge@>=2.7.3 <2.8.0",
+      "resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz"
     },
     "gaze": {
       "version": "0.5.2",
-      "resolved": "https://registry.npmjs.org/gaze/-/gaze-0.5.2.tgz",
-      "integrity": "sha1-QLcJU30k0dRXZ9takIaJ3+aaxE8="
+      "from": "gaze@>=0.5.1 <0.6.0",
+      "resolved": "https://registry.npmjs.org/gaze/-/gaze-0.5.2.tgz"
     },
     "generate-function": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/generate-function/-/generate-function-2.0.0.tgz",
-      "integrity": "sha1-aFj+fAlpt9TpCTM3ZHrHn2DfvnQ="
+      "from": "generate-function@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/generate-function/-/generate-function-2.0.0.tgz"
     },
     "generate-object-property": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/generate-object-property/-/generate-object-property-1.2.0.tgz",
-      "integrity": "sha1-nA4cQDCM6AT0eDYYuTf6iPmdUNA="
+      "from": "generate-object-property@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/generate-object-property/-/generate-object-property-1.2.0.tgz"
     },
     "generic-names": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/generic-names/-/generic-names-1.0.2.tgz",
-      "integrity": "sha1-4lt/7OtbWo8o9flyp8z+V+Virc0="
+      "from": "generic-names@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/generic-names/-/generic-names-1.0.2.tgz"
     },
     "get-caller-file": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz",
-      "integrity": "sha1-9wLmMSfn4jHBYKgMFVSstw1QR+U="
+      "from": "get-caller-file@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz"
     },
     "get-own-enumerable-property-symbols": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/get-own-enumerable-property-symbols/-/get-own-enumerable-property-symbols-1.0.1.tgz",
-      "integrity": "sha1-8dTjrRQC4DmJjlbR6bmqkkwm5IQ="
+      "from": "get-own-enumerable-property-symbols@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/get-own-enumerable-property-symbols/-/get-own-enumerable-property-symbols-1.0.1.tgz"
     },
     "get-stdin": {
       "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz",
-      "integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4="
+      "from": "get-stdin@>=4.0.1 <5.0.0",
+      "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz"
     },
     "get-stream": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz",
-      "integrity": "sha1-jpQ9E1jcN1VQVOy+LtsFqhdO3hQ="
+      "from": "get-stream@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz"
     },
     "getpass": {
       "version": "0.1.7",
+      "from": "getpass@>=0.1.1 <0.2.0",
       "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
-      "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo=",
       "dependencies": {
         "assert-plus": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
+          "from": "assert-plus@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz"
         }
       }
     },
     "git-rev": {
       "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/git-rev/-/git-rev-0.2.1.tgz",
-      "integrity": "sha1-jMvSCSs0W8LJFJVIOW31SWRspj8="
+      "from": "git-rev@0.2.1",
+      "resolved": "https://registry.npmjs.org/git-rev/-/git-rev-0.2.1.tgz"
     },
     "glamor": {
       "version": "2.20.25",
+      "from": "glamor@>=2.20.24 <3.0.0",
       "resolved": "https://registry.npmjs.org/glamor/-/glamor-2.20.25.tgz",
-      "integrity": "sha1-cbhLgrZ6kyd3GsWd5T7pFdFIpKM=",
       "dependencies": {
         "core-js": {
           "version": "1.2.7",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
-          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
+          "from": "core-js@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
         },
         "fbjs": {
           "version": "0.8.12",
-          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz",
-          "integrity": "sha1-ELXZL3bUVXX9Y6IX1OoCvqL47QQ="
+          "from": "fbjs@>=0.8.8 <0.9.0",
+          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz"
         }
       }
     },
     "glob": {
       "version": "7.1.2",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
-      "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ=="
+      "from": "glob@>=7.0.5 <8.0.0",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz"
     },
     "glob-base": {
       "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz",
-      "integrity": "sha1-27Fk9iIbHAscz4Kuoyi0l98Oo8Q="
+      "from": "glob-base@>=0.3.0 <0.4.0",
+      "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz"
     },
     "glob-escape": {
       "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/glob-escape/-/glob-escape-0.0.2.tgz",
-      "integrity": "sha1-nCf3gh7RwTd1gvPv2VWOP2dWKO0="
+      "from": "glob-escape@>=0.0.1 <0.1.0",
+      "resolved": "https://registry.npmjs.org/glob-escape/-/glob-escape-0.0.2.tgz"
     },
     "glob-parent": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz",
-      "integrity": "sha1-gTg9ctsFT8zPUzbaqQLxgvbtuyg="
+      "from": "glob-parent@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz"
     },
     "glob-stream": {
       "version": "3.1.18",
+      "from": "glob-stream@>=3.1.5 <4.0.0",
       "resolved": "https://registry.npmjs.org/glob-stream/-/glob-stream-3.1.18.tgz",
-      "integrity": "sha1-kXCl8St5Awb9/lmPMT+PeVT9FDs=",
       "dependencies": {
         "glob": {
           "version": "4.5.3",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-4.5.3.tgz",
-          "integrity": "sha1-xstz0yJsHv7wTePFbQEvAzd+4V8="
+          "from": "glob@>=4.3.1 <5.0.0",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-4.5.3.tgz"
         },
         "minimatch": {
           "version": "2.0.10",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-2.0.10.tgz",
-          "integrity": "sha1-jQh8OcazjAAbl/ynzm0OHoCvusc="
+          "from": "minimatch@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-2.0.10.tgz"
         },
         "readable-stream": {
           "version": "1.0.34",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
-          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
+          "from": "readable-stream@>=1.0.33-1 <1.1.0-0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
         },
         "through2": {
           "version": "0.6.5",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
-          "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg="
+          "from": "through2@>=0.6.1 <0.7.0",
+          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz"
         }
       }
     },
     "glob-watcher": {
       "version": "0.0.6",
-      "resolved": "https://registry.npmjs.org/glob-watcher/-/glob-watcher-0.0.6.tgz",
-      "integrity": "sha1-uVtKjfdLOcgymLDAXJeLTZo7cQs="
+      "from": "glob-watcher@>=0.0.6 <0.0.7",
+      "resolved": "https://registry.npmjs.org/glob-watcher/-/glob-watcher-0.0.6.tgz"
     },
     "glob2base": {
       "version": "0.0.12",
-      "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz",
-      "integrity": "sha1-nUGbPijxLoOjYhZKJ3BVkiycDVY="
+      "from": "glob2base@>=0.0.12 <0.0.13",
+      "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz"
     },
     "global-modules": {
       "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-0.2.3.tgz",
-      "integrity": "sha1-6lo77ULG1s6ZWk+KEmm12uIjgo0="
+      "from": "global-modules@>=0.2.3 <0.3.0",
+      "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-0.2.3.tgz"
     },
     "global-prefix": {
       "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-0.1.5.tgz",
-      "integrity": "sha1-jTvGuNo8qBEqFg2NSW/wRiv+948="
+      "from": "global-prefix@>=0.1.4 <0.2.0",
+      "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-0.1.5.tgz"
     },
     "globby": {
       "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/globby/-/globby-5.0.0.tgz",
-      "integrity": "sha1-69hGZ8oNuzMLmbz8aOrCvFQ3Dg0="
+      "from": "globby@>=5.0.0 <5.1.0",
+      "resolved": "https://registry.npmjs.org/globby/-/globby-5.0.0.tgz"
     },
     "globule": {
       "version": "0.1.0",
+      "from": "globule@>=0.1.0 <0.2.0",
       "resolved": "https://registry.npmjs.org/globule/-/globule-0.1.0.tgz",
-      "integrity": "sha1-2cjt3h2nnRJaFRt5UzuXhnY0auU=",
       "dependencies": {
         "glob": {
           "version": "3.1.21",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-3.1.21.tgz",
-          "integrity": "sha1-0p4KBV3qUTj00H7UDomC6DwgZs0="
+          "from": "glob@>=3.1.21 <3.2.0",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-3.1.21.tgz"
         },
         "graceful-fs": {
           "version": "1.2.3",
-          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-1.2.3.tgz",
-          "integrity": "sha1-FaSAaldUfLLS2/J/QuiajDRRs2Q="
+          "from": "graceful-fs@>=1.2.0 <1.3.0",
+          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-1.2.3.tgz"
         },
         "inherits": {
           "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/inherits/-/inherits-1.0.2.tgz",
-          "integrity": "sha1-ykMJ2t7mtUzAuNJH6NfHoJdb3Js="
+          "from": "inherits@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/inherits/-/inherits-1.0.2.tgz"
         },
         "lodash": {
           "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-1.0.2.tgz",
-          "integrity": "sha1-j1dWDIO1n8JwvT1WG2kAQ0MOJVE="
+          "from": "lodash@>=1.0.1 <1.1.0",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-1.0.2.tgz"
         },
         "minimatch": {
           "version": "0.2.14",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.2.14.tgz",
-          "integrity": "sha1-x054BXT2PG+aCQ6Q775u9TpqdWo="
+          "from": "minimatch@>=0.2.11 <0.3.0",
+          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.2.14.tgz"
         }
       }
     },
     "glogg": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/glogg/-/glogg-1.0.0.tgz",
-      "integrity": "sha1-f+DxmfV6yQbPUS/urY+Q7kooT8U="
+      "from": "glogg@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/glogg/-/glogg-1.0.0.tgz"
     },
     "got": {
       "version": "5.7.1",
+      "from": "got@>=5.0.0 <6.0.0",
       "resolved": "https://registry.npmjs.org/got/-/got-5.7.1.tgz",
-      "integrity": "sha1-X4FjWmHkplifGAVp6k44FoClHzU=",
       "dependencies": {
         "duplexer2": {
           "version": "0.1.4",
-          "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.1.4.tgz",
-          "integrity": "sha1-ixLauHjA1p4+eJEFFmKjL8a93ME="
+          "from": "duplexer2@>=0.1.4 <0.2.0",
+          "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.1.4.tgz"
         },
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.0.5 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
     "graceful-fs": {
       "version": "4.1.11",
-      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz",
-      "integrity": "sha1-Dovf5NHduIVNZOBOp8AOKgJuVlg="
+      "from": "graceful-fs@>=4.1.2 <5.0.0",
+      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz"
     },
     "graceful-readlink": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz",
-      "integrity": "sha1-TK+tdrxi8C+gObL5Tpo906ORpyU="
+      "from": "graceful-readlink@>=1.0.0",
+      "resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz"
     },
     "growl": {
       "version": "1.9.2",
-      "resolved": "https://registry.npmjs.org/growl/-/growl-1.9.2.tgz",
-      "integrity": "sha1-Dqd0NxXbjY3ixe3hd14bRayFwC8="
+      "from": "growl@1.9.2",
+      "resolved": "https://registry.npmjs.org/growl/-/growl-1.9.2.tgz"
     },
     "growly": {
       "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz",
-      "integrity": "sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE="
+      "from": "growly@>=1.3.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz"
     },
     "gulp": {
       "version": "3.9.1",
+      "from": "gulp@>=3.9.1 <3.10.0",
       "resolved": "https://registry.npmjs.org/gulp/-/gulp-3.9.1.tgz",
-      "integrity": "sha1-VxzkWSjdQK9lFPxAEYZgFsE4RbQ=",
       "dependencies": {
         "semver": {
           "version": "4.3.6",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz",
-          "integrity": "sha1-MAvG4OhjdPe6YQaLWx7NV/xlMto="
+          "from": "semver@>=4.1.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz"
         }
       }
     },
     "gulp-cache": {
       "version": "0.4.6",
+      "from": "gulp-cache@>=0.4.5 <0.5.0",
       "resolved": "https://registry.npmjs.org/gulp-cache/-/gulp-cache-0.4.6.tgz",
-      "integrity": "sha1-LQO1LbT2pVOuHVvvAeSD6Qfp95Y=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.0.4 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         },
         "vinyl": {
           "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz",
-          "integrity": "sha1-XIgDbPVl5d8FVYv8kR+GVt8hiIQ="
+          "from": "vinyl@>=1.1.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz"
         }
       }
     },
     "gulp-changed": {
       "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/gulp-changed/-/gulp-changed-1.3.2.tgz",
-      "integrity": "sha1-nvyNMl+YBcx2aP3059YNSxQQ8s8="
+      "from": "gulp-changed@>=1.3.2 <1.4.0",
+      "resolved": "https://registry.npmjs.org/gulp-changed/-/gulp-changed-1.3.2.tgz"
     },
     "gulp-clean-css": {
       "version": "2.0.13",
+      "from": "gulp-clean-css@>=2.0.11 <2.1.0",
       "resolved": "https://registry.npmjs.org/gulp-clean-css/-/gulp-clean-css-2.0.13.tgz",
-      "integrity": "sha1-hd70qqKvbwbBZG4FER/XtLXmJ9A=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.1.5 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
     "gulp-clip-empty-files": {
       "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/gulp-clip-empty-files/-/gulp-clip-empty-files-0.1.2.tgz",
-      "integrity": "sha1-vumATiU7vaVc+8Em6NuuZDPtzMg="
+      "from": "gulp-clip-empty-files@>=0.1.2 <0.2.0",
+      "resolved": "https://registry.npmjs.org/gulp-clip-empty-files/-/gulp-clip-empty-files-0.1.2.tgz"
     },
     "gulp-clone": {
       "version": "1.0.0",
+      "from": "gulp-clone@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/gulp-clone/-/gulp-clone-1.0.0.tgz",
-      "integrity": "sha1-mubGVr2cTzae6AXu9WV4a8gQBbA=",
       "dependencies": {
         "ansi-regex": {
           "version": "0.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-0.2.1.tgz",
-          "integrity": "sha1-DY6UaWej2BQ/k+JOKYUl/BsiNfk="
+          "from": "ansi-regex@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-0.2.1.tgz"
         },
         "ansi-styles": {
           "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-1.1.0.tgz",
-          "integrity": "sha1-6uy/Zs1waIJ2Cy9GkVgrj1XXp94="
+          "from": "ansi-styles@>=1.1.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-1.1.0.tgz"
         },
         "chalk": {
           "version": "0.5.1",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-0.5.1.tgz",
-          "integrity": "sha1-Zjs6ZItotV0EaQ1JFnqoN4WPIXQ="
+          "from": "chalk@>=0.5.0 <0.6.0",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-0.5.1.tgz"
         },
         "dateformat": {
           "version": "1.0.12",
-          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
-          "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk="
+          "from": "dateformat@>=1.0.7-1.2.3 <2.0.0",
+          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz"
         },
         "gulp-util": {
           "version": "2.2.20",
+          "from": "gulp-util@>=2.2.14 <2.3.0",
           "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-2.2.20.tgz",
-          "integrity": "sha1-1xRuVyiRC9jwR6awseVJvCLb1kw=",
           "dependencies": {
             "through2": {
               "version": "0.5.1",
-              "resolved": "https://registry.npmjs.org/through2/-/through2-0.5.1.tgz",
-              "integrity": "sha1-390BLrnHAOIyP9M084rGIqs3Lac="
+              "from": "through2@>=0.5.0 <0.6.0",
+              "resolved": "https://registry.npmjs.org/through2/-/through2-0.5.1.tgz"
             }
           }
         },
         "has-ansi": {
           "version": "0.1.0",
-          "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-0.1.0.tgz",
-          "integrity": "sha1-hPJlqujA5qiKEtcCKJS3VoiUxi4="
+          "from": "has-ansi@>=0.1.0 <0.2.0",
+          "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-0.1.0.tgz"
         },
         "lodash._reinterpolate": {
           "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-2.4.1.tgz",
-          "integrity": "sha1-TxInqlqHEfxjL1sHofRgequLMiI="
+          "from": "lodash._reinterpolate@>=2.4.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-2.4.1.tgz"
         },
         "lodash.escape": {
           "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-2.4.1.tgz",
-          "integrity": "sha1-LOEsXghNsKV92l5dHu659dF1o7Q="
+          "from": "lodash.escape@>=2.4.1 <2.5.0",
+          "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-2.4.1.tgz"
         },
         "lodash.keys": {
           "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz",
-          "integrity": "sha1-SN6kbfj/djKxDXBrissmWR4rNyc="
+          "from": "lodash.keys@>=2.4.1 <2.5.0",
+          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
         },
         "lodash.template": {
           "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-2.4.1.tgz",
-          "integrity": "sha1-nmEQB+32KRKal0qzxIuBez4c8g0="
+          "from": "lodash.template@>=2.4.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-2.4.1.tgz"
         },
         "lodash.templatesettings": {
           "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-2.4.1.tgz",
-          "integrity": "sha1-6nbHXRHrhtTb6JqDiTu4YZKaxpk="
+          "from": "lodash.templatesettings@>=2.4.1 <2.5.0",
+          "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-2.4.1.tgz"
         },
         "minimist": {
           "version": "0.2.0",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.0.tgz",
-          "integrity": "sha1-Tf/lJdriuGTGbC4jxicdev3s784="
+          "from": "minimist@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.0.tgz"
         },
         "readable-stream": {
           "version": "1.0.34",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
-          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
+          "from": "readable-stream@>=1.0.17 <1.1.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
         },
         "strip-ansi": {
           "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-0.3.0.tgz",
-          "integrity": "sha1-JfSOoiynkYfzF0pNuHWTR7sSYiA="
+          "from": "strip-ansi@>=0.3.0 <0.4.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-0.3.0.tgz"
         },
         "supports-color": {
           "version": "0.2.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-0.2.0.tgz",
-          "integrity": "sha1-2S3iaU6z9nMjlz1649i1W0wiGQo="
+          "from": "supports-color@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-0.2.0.tgz"
         },
         "through2": {
           "version": "0.4.2",
+          "from": "through2@>=0.4.1 <0.5.0",
           "resolved": "https://registry.npmjs.org/through2/-/through2-0.4.2.tgz",
-          "integrity": "sha1-2/WGYDEVHsg1K7bE22SiKSqEC5s=",
           "dependencies": {
             "xtend": {
               "version": "2.1.2",
-              "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz",
-              "integrity": "sha1-bv7MKk2tjmlixJAbM3znuoe10os="
+              "from": "xtend@>=2.1.1 <2.2.0",
+              "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz"
             }
           }
         },
         "vinyl": {
           "version": "0.2.3",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.2.3.tgz",
-          "integrity": "sha1-vKk4IJWC7FpJrVOKAPofEl5RMlI="
+          "from": "vinyl@>=0.2.1 <0.3.0",
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.2.3.tgz"
         },
         "xtend": {
           "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/xtend/-/xtend-3.0.0.tgz",
-          "integrity": "sha1-XM50B7r2Qsunvs2laBEcST9ZZlo="
+          "from": "xtend@>=3.0.0 <3.1.0",
+          "resolved": "https://registry.npmjs.org/xtend/-/xtend-3.0.0.tgz"
         }
       }
     },
     "gulp-connect": {
       "version": "5.0.0",
+      "from": "gulp-connect@>=5.0.0 <5.1.0",
       "resolved": "https://registry.npmjs.org/gulp-connect/-/gulp-connect-5.0.0.tgz",
-      "integrity": "sha1-8v3zBq6RFGg2jCKF8teC8T7dr04=",
       "dependencies": {
         "body-parser": {
           "version": "1.13.3",
-          "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.13.3.tgz",
-          "integrity": "sha1-wIzzMMM1jhUQFqBXRvE/ApyX+pc="
+          "from": "body-parser@>=1.13.3 <1.14.0",
+          "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.13.3.tgz"
         },
         "bytes": {
           "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.1.0.tgz",
-          "integrity": "sha1-rJPEEOL/ycx89LRks4KJBn9eR7Q="
+          "from": "bytes@2.1.0",
+          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.1.0.tgz"
         },
         "connect": {
           "version": "2.30.2",
-          "resolved": "https://registry.npmjs.org/connect/-/connect-2.30.2.tgz",
-          "integrity": "sha1-jam8vooFTT0xjXTf7JA7XDmhtgk="
+          "from": "connect@>=2.30.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/connect/-/connect-2.30.2.tgz"
         },
         "cookie": {
           "version": "0.1.3",
-          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz",
-          "integrity": "sha1-5zSlwUF/zkctWu+Cw4HKu2TRpDU="
+          "from": "cookie@0.1.3",
+          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz"
         },
         "debug": {
           "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
+          "from": "debug@>=2.2.0 <2.3.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
         },
         "depd": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz",
-          "integrity": "sha1-gK7GTJ1tl+ZcwqnKqTwKpqv3Oqo="
+          "from": "depd@>=1.0.1 <1.1.0",
+          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz"
         },
         "escape-html": {
           "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.2.tgz",
-          "integrity": "sha1-130y+pjjjC9BroXpJ44ODmuhAiw="
+          "from": "escape-html@1.0.2",
+          "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.2.tgz"
         },
         "event-stream": {
           "version": "3.3.4",
-          "resolved": "https://registry.npmjs.org/event-stream/-/event-stream-3.3.4.tgz",
-          "integrity": "sha1-SrTJoPWlTbkzi0w02Gv86PSzVXE="
+          "from": "event-stream@>=3.3.2 <4.0.0",
+          "resolved": "https://registry.npmjs.org/event-stream/-/event-stream-3.3.4.tgz"
         },
         "finalhandler": {
           "version": "0.4.0",
-          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.4.0.tgz",
-          "integrity": "sha1-llpS2ejQXSuFdUhUH7ibU6JJfZs="
+          "from": "finalhandler@0.4.0",
+          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.4.0.tgz"
         },
         "http-errors": {
           "version": "1.3.1",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
-          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
+          "from": "http-errors@>=1.3.1 <1.4.0",
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
         },
         "iconv-lite": {
           "version": "0.4.11",
-          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.11.tgz",
-          "integrity": "sha1-LstC/SlHRJIiCaLnxATayHk9it4="
+          "from": "iconv-lite@0.4.11",
+          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.11.tgz"
         },
         "map-stream": {
           "version": "0.1.0",
-          "resolved": "https://registry.npmjs.org/map-stream/-/map-stream-0.1.0.tgz",
-          "integrity": "sha1-5WqpTEyAVaFkBKBnS3jyFffI4ZQ="
+          "from": "map-stream@>=0.1.0 <0.2.0",
+          "resolved": "https://registry.npmjs.org/map-stream/-/map-stream-0.1.0.tgz"
         },
         "mime": {
           "version": "1.3.4",
-          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz",
-          "integrity": "sha1-EV+eO2s9rylZmDyzjxSaLUDrXVM="
+          "from": "mime@1.3.4",
+          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz"
         },
         "ms": {
           "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+          "from": "ms@0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
         },
         "qs": {
           "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-4.0.0.tgz",
-          "integrity": "sha1-wx2bdOwn33XlQ6hseHKO2NRiNgc="
+          "from": "qs@4.0.0",
+          "resolved": "https://registry.npmjs.org/qs/-/qs-4.0.0.tgz"
         },
         "range-parser": {
           "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.0.3.tgz",
-          "integrity": "sha1-aHKCNTXGkuLCoBA4Jq/YLC4P8XU="
+          "from": "range-parser@>=1.0.3 <1.1.0",
+          "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.0.3.tgz"
         },
         "raw-body": {
           "version": "2.1.7",
+          "from": "raw-body@>=2.1.2 <2.2.0",
           "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.1.7.tgz",
-          "integrity": "sha1-rf6s4uT7MJgFgBTQjActzFl1h3Q=",
           "dependencies": {
             "bytes": {
               "version": "2.4.0",
-              "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz",
-              "integrity": "sha1-fZcZb51br39pNeJZhVSe3SpsIzk="
+              "from": "bytes@2.4.0",
+              "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz"
             },
             "iconv-lite": {
               "version": "0.4.13",
-              "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.13.tgz",
-              "integrity": "sha1-H4irpKsLFQjoMSrMOTRfNumS4vI="
+              "from": "iconv-lite@0.4.13",
+              "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.13.tgz"
             }
           }
         },
         "send": {
           "version": "0.13.2",
+          "from": "send@0.13.2",
           "resolved": "https://registry.npmjs.org/send/-/send-0.13.2.tgz",
-          "integrity": "sha1-dl52B8gFVFK7pvCwUllTUJhgNt4=",
           "dependencies": {
             "depd": {
               "version": "1.1.0",
-              "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.0.tgz",
-              "integrity": "sha1-4b2Cxqq2ztlluXuIsX7T5SjKGMM="
+              "from": "depd@~1.1.0",
+              "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.0.tgz"
             },
             "escape-html": {
               "version": "1.0.3",
-              "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
-              "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg="
+              "from": "escape-html@~1.0.3",
+              "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz"
             },
             "statuses": {
               "version": "1.2.1",
-              "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.2.1.tgz",
-              "integrity": "sha1-3e1FzBglbVHtQK7BQkidXGECbSg="
+              "from": "statuses@>=1.2.1 <1.3.0",
+              "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.2.1.tgz"
             }
           }
         },
         "serve-static": {
           "version": "1.10.3",
+          "from": "serve-static@>=1.10.0 <1.11.0",
           "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.10.3.tgz",
-          "integrity": "sha1-zlpuzTEB/tXsCYJ9rCKpwpv7BTU=",
           "dependencies": {
             "escape-html": {
               "version": "1.0.3",
-              "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
-              "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg="
+              "from": "escape-html@~1.0.3",
+              "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz"
             }
           }
         },
         "split": {
           "version": "0.3.3",
-          "resolved": "https://registry.npmjs.org/split/-/split-0.3.3.tgz",
-          "integrity": "sha1-zQ7qXmOiEd//frDwkcQTPi0N0o8="
+          "from": "split@>=0.3.0 <0.4.0",
+          "resolved": "https://registry.npmjs.org/split/-/split-0.3.3.tgz"
         }
       }
     },
     "gulp-debug": {
       "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/gulp-debug/-/gulp-debug-3.1.0.tgz",
-      "integrity": "sha1-TakVaLVJFb6ANpbKqsEMiVssCnE="
+      "from": "gulp-debug@3.1.0",
+      "resolved": "https://registry.npmjs.org/gulp-debug/-/gulp-debug-3.1.0.tgz"
     },
     "gulp-decomment": {
       "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/gulp-decomment/-/gulp-decomment-0.1.3.tgz",
-      "integrity": "sha1-q6CMjhbzh3bQhtNuMV8ZpbGjFjU="
+      "from": "gulp-decomment@>=0.1.3 <0.2.0",
+      "resolved": "https://registry.npmjs.org/gulp-decomment/-/gulp-decomment-0.1.3.tgz"
     },
     "gulp-flatten": {
       "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/gulp-flatten/-/gulp-flatten-0.2.0.tgz",
-      "integrity": "sha1-iS1RfjjXkA/UVM+aHgIQMA6S6wY="
+      "from": "gulp-flatten@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/gulp-flatten/-/gulp-flatten-0.2.0.tgz"
     },
     "gulp-if": {
       "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/gulp-if/-/gulp-if-2.0.2.tgz",
-      "integrity": "sha1-pJe351cwBQQcqivIt92jyARE1ik="
+      "from": "gulp-if@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/gulp-if/-/gulp-if-2.0.2.tgz"
     },
     "gulp-karma": {
       "version": "0.0.5",
+      "from": "gulp-karma@>=0.0.5 <0.1.0",
       "resolved": "https://registry.npmjs.org/gulp-karma/-/gulp-karma-0.0.5.tgz",
-      "integrity": "sha1-RLoZejEFTlyXOlujOUITwUKAOVg=",
       "dependencies": {
         "ansi-regex": {
           "version": "0.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-0.2.1.tgz",
-          "integrity": "sha1-DY6UaWej2BQ/k+JOKYUl/BsiNfk="
+          "from": "ansi-regex@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-0.2.1.tgz"
         },
         "ansi-styles": {
           "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-1.1.0.tgz",
-          "integrity": "sha1-6uy/Zs1waIJ2Cy9GkVgrj1XXp94="
+          "from": "ansi-styles@>=1.1.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-1.1.0.tgz"
         },
         "chalk": {
           "version": "0.5.1",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-0.5.1.tgz",
-          "integrity": "sha1-Zjs6ZItotV0EaQ1JFnqoN4WPIXQ="
+          "from": "chalk@>=0.5.0 <0.6.0",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-0.5.1.tgz"
         },
         "dateformat": {
           "version": "1.0.12",
-          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
-          "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk="
+          "from": "dateformat@>=1.0.7-1.2.3 <2.0.0",
+          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz"
         },
         "gulp-util": {
           "version": "2.2.20",
-          "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-2.2.20.tgz",
-          "integrity": "sha1-1xRuVyiRC9jwR6awseVJvCLb1kw="
+          "from": "gulp-util@>=2.2.14 <2.3.0",
+          "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-2.2.20.tgz"
         },
         "has-ansi": {
           "version": "0.1.0",
-          "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-0.1.0.tgz",
-          "integrity": "sha1-hPJlqujA5qiKEtcCKJS3VoiUxi4="
+          "from": "has-ansi@>=0.1.0 <0.2.0",
+          "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-0.1.0.tgz"
         },
         "lodash._reinterpolate": {
           "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-2.4.1.tgz",
-          "integrity": "sha1-TxInqlqHEfxjL1sHofRgequLMiI="
+          "from": "lodash._reinterpolate@>=2.4.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-2.4.1.tgz"
         },
         "lodash.escape": {
           "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-2.4.1.tgz",
-          "integrity": "sha1-LOEsXghNsKV92l5dHu659dF1o7Q="
+          "from": "lodash.escape@>=2.4.1 <2.5.0",
+          "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-2.4.1.tgz"
         },
         "lodash.keys": {
           "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz",
-          "integrity": "sha1-SN6kbfj/djKxDXBrissmWR4rNyc="
+          "from": "lodash.keys@>=2.4.1 <2.5.0",
+          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
         },
         "lodash.template": {
           "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-2.4.1.tgz",
-          "integrity": "sha1-nmEQB+32KRKal0qzxIuBez4c8g0="
+          "from": "lodash.template@>=2.4.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-2.4.1.tgz"
         },
         "lodash.templatesettings": {
           "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-2.4.1.tgz",
-          "integrity": "sha1-6nbHXRHrhtTb6JqDiTu4YZKaxpk="
+          "from": "lodash.templatesettings@>=2.4.1 <2.5.0",
+          "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-2.4.1.tgz"
         },
         "minimist": {
           "version": "0.2.0",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.0.tgz",
-          "integrity": "sha1-Tf/lJdriuGTGbC4jxicdev3s784="
+          "from": "minimist@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.0.tgz"
         },
         "readable-stream": {
           "version": "1.0.34",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
-          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
+          "from": "readable-stream@>=1.0.17 <1.1.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
         },
         "strip-ansi": {
           "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-0.3.0.tgz",
-          "integrity": "sha1-JfSOoiynkYfzF0pNuHWTR7sSYiA="
+          "from": "strip-ansi@>=0.3.0 <0.4.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-0.3.0.tgz"
         },
         "supports-color": {
           "version": "0.2.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-0.2.0.tgz",
-          "integrity": "sha1-2S3iaU6z9nMjlz1649i1W0wiGQo="
+          "from": "supports-color@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-0.2.0.tgz"
         },
         "through2": {
           "version": "0.5.1",
+          "from": "through2@>=0.5.0 <0.6.0",
           "resolved": "https://registry.npmjs.org/through2/-/through2-0.5.1.tgz",
-          "integrity": "sha1-390BLrnHAOIyP9M084rGIqs3Lac=",
           "dependencies": {
             "xtend": {
               "version": "3.0.0",
-              "resolved": "https://registry.npmjs.org/xtend/-/xtend-3.0.0.tgz",
-              "integrity": "sha1-XM50B7r2Qsunvs2laBEcST9ZZlo="
+              "from": "xtend@>=3.0.0 <3.1.0",
+              "resolved": "https://registry.npmjs.org/xtend/-/xtend-3.0.0.tgz"
             }
           }
         },
         "vinyl": {
           "version": "0.2.3",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.2.3.tgz",
-          "integrity": "sha1-vKk4IJWC7FpJrVOKAPofEl5RMlI="
+          "from": "vinyl@>=0.2.1 <0.3.0",
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.2.3.tgz"
         },
         "xtend": {
           "version": "2.1.2",
-          "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz",
-          "integrity": "sha1-bv7MKk2tjmlixJAbM3znuoe10os="
+          "from": "xtend@>=2.1.1 <2.2.0",
+          "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz"
         }
       }
     },
     "gulp-match": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/gulp-match/-/gulp-match-1.0.3.tgz",
-      "integrity": "sha1-kcfA1/Kb7NZgbVfYCn+Hdqh6uo4="
+      "from": "gulp-match@>=1.0.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/gulp-match/-/gulp-match-1.0.3.tgz"
     },
     "gulp-open": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/gulp-open/-/gulp-open-2.0.0.tgz",
-      "integrity": "sha1-oW9n6VzqiyBhtjo7jDibxVm44c4="
+      "from": "gulp-open@>=2.0.0 <2.1.0",
+      "resolved": "https://registry.npmjs.org/gulp-open/-/gulp-open-2.0.0.tgz"
     },
     "gulp-phantomcss": {
       "version": "0.3.0",
+      "from": "gulp-phantomcss@>=0.3.0 <0.4.0",
       "resolved": "https://registry.npmjs.org/gulp-phantomcss/-/gulp-phantomcss-0.3.0.tgz",
-      "integrity": "sha1-Hu0Vyz5BQw0AH5qUVg+/1Pihd1k=",
       "dependencies": {
         "async": {
           "version": "2.4.1",
+          "from": "async@>=2.0.1 <3.0.0",
           "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
-          "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c=",
           "dependencies": {
             "lodash": {
               "version": "4.17.4",
-              "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-              "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+              "from": "lodash@>=4.14.0 <5.0.0",
+              "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz"
             }
           }
         },
         "caseless": {
           "version": "0.11.0",
-          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz",
-          "integrity": "sha1-cVuW6phBWTzDMGeSP17GDr2k99c="
+          "from": "caseless@>=0.11.0 <0.12.0",
+          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz"
         },
         "dateformat": {
           "version": "1.0.12",
-          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
-          "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk="
+          "from": "dateformat@>=1.0.11 <2.0.0",
+          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz"
         },
         "form-data": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/form-data/-/form-data-1.0.1.tgz",
-          "integrity": "sha1-rjFduaSQf6BlUCMEpm13M0de43w="
+          "from": "form-data@>=1.0.0-rc3 <1.1.0",
+          "resolved": "https://registry.npmjs.org/form-data/-/form-data-1.0.1.tgz"
         },
         "gulp-util": {
           "version": "3.0.7",
-          "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.7.tgz",
-          "integrity": "sha1-eJJcS4+LSQBawBoBHFV+YhiUHLs="
+          "from": "gulp-util@3.0.7",
+          "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.7.tgz"
         },
         "har-validator": {
           "version": "2.0.6",
-          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz",
-          "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0="
+          "from": "har-validator@>=2.0.2 <2.1.0",
+          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz"
         },
         "lodash": {
           "version": "3.10.1",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
-          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
+          "from": "lodash@3.10.1",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz"
         },
         "node-uuid": {
           "version": "1.4.8",
-          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz",
-          "integrity": "sha1-sEDrCSOWivq/jTL7HxfxFn/auQc="
+          "from": "node-uuid@~1.4.7",
+          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz"
         },
         "object-assign": {
           "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz",
-          "integrity": "sha1-m+3VygiXlJvKR+f/QIBi1Un1h/I="
+          "from": "object-assign@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz"
         },
         "phantomjs-prebuilt": {
           "version": "2.1.7",
-          "resolved": "https://registry.npmjs.org/phantomjs-prebuilt/-/phantomjs-prebuilt-2.1.7.tgz",
-          "integrity": "sha1-yQvxuXcvoZeZQzH88/ZwmaloU8o="
+          "from": "phantomjs-prebuilt@2.1.7",
+          "resolved": "https://registry.npmjs.org/phantomjs-prebuilt/-/phantomjs-prebuilt-2.1.7.tgz"
         },
         "qs": {
           "version": "5.2.1",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-5.2.1.tgz",
-          "integrity": "sha1-gB/uAw4LlFDWOFrcSKTMVbRK7fw="
+          "from": "qs@>=5.2.0 <5.3.0",
+          "resolved": "https://registry.npmjs.org/qs/-/qs-5.2.1.tgz"
         },
         "request": {
           "version": "2.67.0",
-          "resolved": "https://registry.npmjs.org/request/-/request-2.67.0.tgz",
-          "integrity": "sha1-ivdHgOK/EeoK6aqWXBHxGv0nJ0I="
+          "from": "request@>=2.67.0 <2.68.0",
+          "resolved": "https://registry.npmjs.org/request/-/request-2.67.0.tgz"
         },
         "tough-cookie": {
           "version": "2.2.2",
-          "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.2.2.tgz",
-          "integrity": "sha1-yDoYMPTl7wuT7yo0iOck+N4Basc="
+          "from": "tough-cookie@>=2.2.0 <2.3.0",
+          "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.2.2.tgz"
         },
         "tunnel-agent": {
           "version": "0.4.3",
-          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz",
-          "integrity": "sha1-Y3PbdpCf5XDgjXNYM2Xtgop07us="
+          "from": "tunnel-agent@>=0.4.1 <0.5.0",
+          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz"
         }
       }
     },
     "gulp-plumber": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/gulp-plumber/-/gulp-plumber-1.1.0.tgz",
-      "integrity": "sha1-8SF2wtBCL2AwbCQv/2oBo5T6ugk="
+      "from": "gulp-plumber@>=1.1.0 <1.2.0",
+      "resolved": "https://registry.npmjs.org/gulp-plumber/-/gulp-plumber-1.1.0.tgz"
     },
     "gulp-postcss": {
       "version": "6.1.1",
-      "resolved": "https://registry.npmjs.org/gulp-postcss/-/gulp-postcss-6.1.1.tgz",
-      "integrity": "sha1-h01E6f9srd3VfOPJVSAuVy0mkBU="
+      "from": "gulp-postcss@>=6.1.1 <6.2.0",
+      "resolved": "https://registry.npmjs.org/gulp-postcss/-/gulp-postcss-6.1.1.tgz"
     },
     "gulp-prompt": {
       "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/gulp-prompt/-/gulp-prompt-0.2.0.tgz",
-      "integrity": "sha1-l2DJC72H6AAigzDrrHTWWcwt23g="
+      "from": "gulp-prompt@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/gulp-prompt/-/gulp-prompt-0.2.0.tgz"
     },
     "gulp-replace": {
       "version": "0.5.4",
+      "from": "gulp-replace@>=0.5.4 <0.6.0",
       "resolved": "https://registry.npmjs.org/gulp-replace/-/gulp-replace-0.5.4.tgz",
-      "integrity": "sha1-aaZ5FLvRPFYr/xT1BKQDeWqg2qk=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
     "gulp-sass": {
       "version": "2.3.2",
+      "from": "gulp-sass@>=2.3.2 <2.4.0",
       "resolved": "https://registry.npmjs.org/gulp-sass/-/gulp-sass-2.3.2.tgz",
-      "integrity": "sha1-grerkP6QLNw0wE8YDZLyw0kC3VI=",
       "dependencies": {
         "gaze": {
           "version": "1.1.2",
-          "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz",
-          "integrity": "sha1-hHIkZ3rbiHDWeSV+0ziP22HkAQU="
+          "from": "gaze@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz"
         },
         "globule": {
           "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/globule/-/globule-1.1.0.tgz",
-          "integrity": "sha1-xJNS5NwYPYWJPuglOF65lLtt9F8="
+          "from": "globule@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/globule/-/globule-1.1.0.tgz"
         },
         "lodash": {
           "version": "4.16.6",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.16.6.tgz",
-          "integrity": "sha1-0iyaxmAojzhD4Wun0rXQbMon13c="
+          "from": "lodash@>=4.16.4 <4.17.0",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.16.6.tgz"
         },
         "node-sass": {
           "version": "3.13.1",
-          "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-3.13.1.tgz",
-          "integrity": "sha1-ckD7v/I5YwS0IjUn7TAgWJwAT8I="
+          "from": "node-sass@>=3.4.2 <4.0.0",
+          "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-3.13.1.tgz"
         }
       }
     },
     "gulp-sourcemaps": {
       "version": "1.6.0",
+      "from": "gulp-sourcemaps@>=1.6.0 <1.7.0",
       "resolved": "https://registry.npmjs.org/gulp-sourcemaps/-/gulp-sourcemaps-1.6.0.tgz",
-      "integrity": "sha1-uG/zSdgBzrVuHZ59x7vLS33uYAw=",
       "dependencies": {
         "strip-bom": {
           "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
-          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
+          "from": "strip-bom@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz"
         },
         "vinyl": {
           "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz",
-          "integrity": "sha1-XIgDbPVl5d8FVYv8kR+GVt8hiIQ="
+          "from": "vinyl@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz"
         }
       }
     },
     "gulp-texttojs": {
       "version": "1.0.3",
+      "from": "gulp-texttojs@>=1.0.3 <1.1.0",
       "resolved": "https://registry.npmjs.org/gulp-texttojs/-/gulp-texttojs-1.0.3.tgz",
-      "integrity": "sha1-SIWgEDXrQfNiPEzADP21Ci+tl3Q=",
       "dependencies": {
         "lodash": {
           "version": "2.4.2",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-2.4.2.tgz",
-          "integrity": "sha1-+t2DS5aDBz2hebPq5tnA0VBT9z4="
+          "from": "lodash@>=2.4.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-2.4.2.tgz"
         },
         "readable-stream": {
           "version": "1.0.34",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
-          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
+          "from": "readable-stream@>=1.0.17 <1.1.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
         },
         "through2": {
           "version": "0.4.2",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.4.2.tgz",
-          "integrity": "sha1-2/WGYDEVHsg1K7bE22SiKSqEC5s="
+          "from": "through2@>=0.4.2 <0.5.0",
+          "resolved": "https://registry.npmjs.org/through2/-/through2-0.4.2.tgz"
         },
         "xtend": {
           "version": "2.1.2",
-          "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz",
-          "integrity": "sha1-bv7MKk2tjmlixJAbM3znuoe10os="
+          "from": "xtend@>=2.1.1 <2.2.0",
+          "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz"
         }
       }
     },
     "gulp-typescript": {
       "version": "3.1.7",
+      "from": "gulp-typescript@>=3.1.3 <3.2.0",
       "resolved": "https://registry.npmjs.org/gulp-typescript/-/gulp-typescript-3.1.7.tgz",
-      "integrity": "sha1-2IYAqRQVPxHAnJpcqMJWHsdaSXg=",
       "dependencies": {
         "glob": {
           "version": "5.0.15",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
-          "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
+          "from": "glob@>=5.0.3 <6.0.0",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
         },
         "glob-parent": {
           "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-3.1.0.tgz",
-          "integrity": "sha1-nmr2KZ2NO9K9QEMIMr0RPfkGxa4="
+          "from": "glob-parent@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-3.1.0.tgz"
         },
         "glob-stream": {
           "version": "5.3.5",
+          "from": "glob-stream@>=5.3.2 <6.0.0",
           "resolved": "https://registry.npmjs.org/glob-stream/-/glob-stream-5.3.5.tgz",
-          "integrity": "sha1-pVZlqajM3EGRWofHAeMtTgFvrSI=",
           "dependencies": {
             "isarray": {
               "version": "0.0.1",
-              "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
-              "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
+              "from": "isarray@0.0.1",
+              "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
             },
             "readable-stream": {
               "version": "1.0.34",
-              "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
-              "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
+              "from": "readable-stream@>=1.0.33-1 <1.1.0-0",
+              "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
             },
             "string_decoder": {
               "version": "0.10.31",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
-              "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
+              "from": "string_decoder@~0.10.x",
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
             },
             "through2": {
               "version": "0.6.5",
-              "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
-              "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg="
+              "from": "through2@>=0.6.0 <0.7.0",
+              "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz"
             }
           }
         },
         "is-extglob": {
           "version": "2.1.1",
-          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
-          "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI="
+          "from": "is-extglob@>=2.1.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz"
         },
         "is-glob": {
           "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz",
-          "integrity": "sha1-e6WuJCF4BKxwcHuWkiVnSGzD6Eo="
+          "from": "is-glob@>=3.1.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz"
         },
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "ordered-read-streams": {
           "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.3.0.tgz",
-          "integrity": "sha1-cTfmmzKYuzQiR6G77jiByA4v14s="
+          "from": "ordered-read-streams@>=0.3.0 <0.4.0",
+          "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.3.0.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.0.4 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         },
         "strip-bom": {
           "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
-          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
+          "from": "strip-bom@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz"
         },
         "unique-stream": {
           "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-2.2.1.tgz",
-          "integrity": "sha1-WqADz76Uxf+GbE59ZouxxNuts2k="
+          "from": "unique-stream@>=2.0.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-2.2.1.tgz"
         },
         "vinyl": {
           "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz",
-          "integrity": "sha1-XIgDbPVl5d8FVYv8kR+GVt8hiIQ="
+          "from": "vinyl@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz"
         },
         "vinyl-fs": {
           "version": "2.4.4",
-          "resolved": "https://registry.npmjs.org/vinyl-fs/-/vinyl-fs-2.4.4.tgz",
-          "integrity": "sha1-vm/zJwy1Xf19MGNkDegfJddTIjk="
+          "from": "vinyl-fs@>=2.4.3 <2.5.0",
+          "resolved": "https://registry.npmjs.org/vinyl-fs/-/vinyl-fs-2.4.4.tgz"
         }
       }
     },
     "gulp-util": {
       "version": "3.0.8",
+      "from": "gulp-util@3.0.8",
       "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.8.tgz",
-      "integrity": "sha1-AFTh50RQLifATBh8PsxQXdVLu08=",
       "dependencies": {
         "object-assign": {
           "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz",
-          "integrity": "sha1-m+3VygiXlJvKR+f/QIBi1Un1h/I="
+          "from": "object-assign@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz"
         }
       }
     },
     "gulplog": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/gulplog/-/gulplog-1.0.0.tgz",
-      "integrity": "sha1-4oxNRdBey77YGDY86PnFkmIp/+U="
+      "from": "gulplog@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/gulplog/-/gulplog-1.0.0.tgz"
     },
     "gutil": {
       "version": "1.6.4",
-      "resolved": "https://registry.npmjs.org/gutil/-/gutil-1.6.4.tgz",
-      "integrity": "sha1-d8+fqgWMBHbWO506xfvgTgcvbNI="
+      "from": "gutil@1.6.4",
+      "resolved": "https://registry.npmjs.org/gutil/-/gutil-1.6.4.tgz"
     },
     "gzip-size": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-3.0.0.tgz",
-      "integrity": "sha1-VGGI6b3DN/Zzdy+BZgRks4nc5SA="
+      "from": "gzip-size@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-3.0.0.tgz"
     },
     "handle-thing": {
       "version": "1.2.5",
-      "resolved": "https://registry.npmjs.org/handle-thing/-/handle-thing-1.2.5.tgz",
-      "integrity": "sha1-/Xqtcmvxpf0W38KbL3pmAdJxOcQ="
+      "from": "handle-thing@>=1.2.5 <2.0.0",
+      "resolved": "https://registry.npmjs.org/handle-thing/-/handle-thing-1.2.5.tgz"
     },
     "handlebars": {
       "version": "4.0.10",
+      "from": "handlebars@>=4.0.1 <5.0.0",
       "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.0.10.tgz",
-      "integrity": "sha1-PTDHGLCaPZbyPqTMH0A8TTup/08=",
       "dependencies": {
         "source-map": {
           "version": "0.4.4",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
-          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s="
+          "from": "source-map@>=0.4.4 <0.5.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz"
         }
       }
     },
     "har-schema": {
       "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-1.0.5.tgz",
-      "integrity": "sha1-0mMTX0MwfALGAq/I/pWXDAFRNp4="
+      "from": "har-schema@>=1.0.5 <2.0.0",
+      "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-1.0.5.tgz"
     },
     "har-validator": {
       "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz",
-      "integrity": "sha1-M0gdDxu/9gDdID11gSpqX7oALio="
+      "from": "har-validator@>=4.2.1 <4.3.0",
+      "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz"
     },
     "has": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/has/-/has-1.0.1.tgz",
-      "integrity": "sha1-hGFzP1OLCDfJNh45qauelwTcLyg="
+      "from": "has@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/has/-/has-1.0.1.tgz"
     },
     "has-ansi": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz",
-      "integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE="
+      "from": "has-ansi@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz"
     },
     "has-binary": {
       "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/has-binary/-/has-binary-0.1.7.tgz",
-      "integrity": "sha1-aOYesWIQyVRaClzOBqhzkS/h5ow="
+      "from": "has-binary@0.1.7",
+      "resolved": "https://registry.npmjs.org/has-binary/-/has-binary-0.1.7.tgz"
     },
     "has-cors": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/has-cors/-/has-cors-1.1.0.tgz",
-      "integrity": "sha1-XkdHk/fqmEPRu5nCPu9J/xJv/zk="
+      "from": "has-cors@1.1.0",
+      "resolved": "https://registry.npmjs.org/has-cors/-/has-cors-1.1.0.tgz"
     },
     "has-flag": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
-      "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+      "from": "has-flag@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz"
     },
     "has-gulplog": {
       "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/has-gulplog/-/has-gulplog-0.1.0.tgz",
-      "integrity": "sha1-ZBTIKRNpfaUVkDl9r7EvIpZ4Ec4="
+      "from": "has-gulplog@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/has-gulplog/-/has-gulplog-0.1.0.tgz"
     },
     "has-unicode": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz",
-      "integrity": "sha1-4Ob+aijPUROIVeCG0Wkedx3iqLk="
+      "from": "has-unicode@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz"
     },
     "hash-base": {
       "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/hash-base/-/hash-base-2.0.2.tgz",
-      "integrity": "sha1-ZuodhW206KVHDK32/OI65SRO8uE="
+      "from": "hash-base@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/hash-base/-/hash-base-2.0.2.tgz"
     },
     "hash.js": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/hash.js/-/hash.js-1.0.3.tgz",
-      "integrity": "sha1-EzL/ABVsCg/92CNgE9B7d6BFFXM="
+      "from": "hash.js@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/hash.js/-/hash.js-1.0.3.tgz"
     },
     "hasha": {
       "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/hasha/-/hasha-2.2.0.tgz",
-      "integrity": "sha1-eNfL/B5tZjA/55g3NlmEUXsvbuE="
+      "from": "hasha@>=2.2.0 <2.3.0",
+      "resolved": "https://registry.npmjs.org/hasha/-/hasha-2.2.0.tgz"
     },
     "hawk": {
       "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz",
-      "integrity": "sha1-B4REvXwWQLD+VA0sm3PVlnjo4cQ="
+      "from": "hawk@>=3.1.3 <3.2.0",
+      "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz"
     },
     "he": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/he/-/he-1.1.1.tgz",
-      "integrity": "sha1-k0EP0hsAlzUVH4howvJx80J+I/0="
+      "from": "he@>=1.1.0 <1.2.0",
+      "resolved": "https://registry.npmjs.org/he/-/he-1.1.1.tgz"
     },
     "highlight.js": {
       "version": "9.11.0",
-      "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-9.11.0.tgz",
-      "integrity": "sha1-R/mMc5mRhwDbLK8jDe0SzsQahK4="
+      "from": "highlight.js@>=9.9.0 <10.0.0",
+      "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-9.11.0.tgz"
     },
     "hmac-drbg": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz",
-      "integrity": "sha1-0nRXAQJabHdabFRXk+1QL8DGSaE="
+      "from": "hmac-drbg@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz"
     },
     "hoek": {
       "version": "2.16.3",
-      "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz",
-      "integrity": "sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0="
+      "from": "hoek@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz"
     },
     "homedir-polyfill": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.1.tgz",
-      "integrity": "sha1-TCu8inWJmP7r9e1oWA921GdotLw="
+      "from": "homedir-polyfill@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.1.tgz"
     },
     "hosted-git-info": {
       "version": "2.4.2",
-      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.4.2.tgz",
-      "integrity": "sha1-AHa59GonBQbduq6lZJaJdGBhKmc="
+      "from": "hosted-git-info@>=2.1.4 <3.0.0",
+      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.4.2.tgz"
     },
     "hpack.js": {
       "version": "2.1.6",
+      "from": "hpack.js@>=2.1.6 <3.0.0",
       "resolved": "https://registry.npmjs.org/hpack.js/-/hpack.js-2.1.6.tgz",
-      "integrity": "sha1-h3dMCUnlE/QuhFdbPEVoH63ioLI=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
     "html-comment-regex": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/html-comment-regex/-/html-comment-regex-1.1.1.tgz",
-      "integrity": "sha1-ZouTd26q5V696POtRkswekljYl4="
+      "from": "html-comment-regex@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/html-comment-regex/-/html-comment-regex-1.1.1.tgz"
     },
     "html-entities": {
       "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-1.2.1.tgz",
-      "integrity": "sha1-DfKTUfByEWNRXfueVUPl9u7VFi8="
+      "from": "html-entities@>=1.2.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-1.2.1.tgz"
     },
     "html-loader": {
       "version": "0.4.5",
+      "from": "html-loader@>=0.4.3 <0.5.0",
       "resolved": "https://registry.npmjs.org/html-loader/-/html-loader-0.4.5.tgz",
-      "integrity": "sha1-X7zYfNY6XEmn/OL+VvQl4Fcpxow=",
       "dependencies": {
         "loader-utils": {
           "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
-          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
+          "from": "loader-utils@>=1.0.2 <2.0.0",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
         }
       }
     },
     "html-minifier": {
       "version": "3.5.2",
+      "from": "html-minifier@>=3.0.1 <4.0.0",
       "resolved": "https://registry.npmjs.org/html-minifier/-/html-minifier-3.5.2.tgz",
-      "integrity": "sha1-1zvD/0SJQkCIGM5gm/P7DqfvTrc=",
       "dependencies": {
         "clean-css": {
           "version": "4.1.3",
-          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.3.tgz",
-          "integrity": "sha1-B8/omA7bINRV3cI6rc8eBMblCc4="
+          "from": "clean-css@>=4.1.0 <4.2.0",
+          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.3.tgz"
         },
         "uglify-js": {
           "version": "3.0.13",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.13.tgz",
-          "integrity": "sha1-GHHXNqoeVQxyjX5aZVZXnnCSXWg="
+          "from": "uglify-js@>=3.0.0 <3.1.0",
+          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.13.tgz"
         }
       }
     },
     "htmlparser2": {
       "version": "3.9.2",
+      "from": "htmlparser2@>=3.9.1 <4.0.0",
       "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.9.2.tgz",
-      "integrity": "sha1-G9+HrMoPP55T+k/M6w9LTLsAszg=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.0.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
     "http-browserify": {
       "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/http-browserify/-/http-browserify-1.7.0.tgz",
-      "integrity": "sha1-M3la3nLfiKz7/TZ3PO/tp2RzWyA="
+      "from": "http-browserify@>=1.3.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/http-browserify/-/http-browserify-1.7.0.tgz"
     },
     "http-deceiver": {
       "version": "1.2.7",
-      "resolved": "https://registry.npmjs.org/http-deceiver/-/http-deceiver-1.2.7.tgz",
-      "integrity": "sha1-+nFolEq5pRnTN8sL7HKE3D5yPYc="
+      "from": "http-deceiver@>=1.2.7 <2.0.0",
+      "resolved": "https://registry.npmjs.org/http-deceiver/-/http-deceiver-1.2.7.tgz"
     },
     "http-errors": {
       "version": "1.6.1",
-      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.1.tgz",
-      "integrity": "sha1-X4uO2YrKVFZWv1cplzh/kEpyIlc="
+      "from": "http-errors@>=1.6.1 <1.7.0",
+      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.1.tgz"
     },
     "http-proxy": {
       "version": "1.16.2",
-      "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.16.2.tgz",
-      "integrity": "sha1-Bt/ykpUr9k2+hHH6nfcwZtTzd0I="
+      "from": "http-proxy@>=1.13.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.16.2.tgz"
     },
     "http-proxy-middleware": {
       "version": "0.17.4",
+      "from": "http-proxy-middleware@>=0.17.4 <0.18.0",
       "resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-0.17.4.tgz",
-      "integrity": "sha1-ZC6ISIUdZvCdTxJJEoRtuutBuDM=",
       "dependencies": {
         "is-extglob": {
           "version": "2.1.1",
-          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
-          "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI="
+          "from": "is-extglob@>=2.1.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz"
         },
         "is-glob": {
           "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz",
-          "integrity": "sha1-e6WuJCF4BKxwcHuWkiVnSGzD6Eo="
+          "from": "is-glob@>=3.1.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz"
         },
         "lodash": {
           "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+          "from": "lodash@>=4.17.2 <5.0.0",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz"
         }
       }
     },
     "http-signature": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz",
-      "integrity": "sha1-33LiZwZs0Kxn+3at+OE0qPvPkb8="
+      "from": "http-signature@>=1.1.0 <1.2.0",
+      "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz"
     },
     "https-browserify": {
       "version": "0.0.0",
-      "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.0.tgz",
-      "integrity": "sha1-s//f5zSyo9Sp79WOhlTJH86G6v0="
+      "from": "https-browserify@0.0.0",
+      "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.0.tgz"
     },
     "iconv-lite": {
       "version": "0.4.15",
-      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.15.tgz",
-      "integrity": "sha1-/iZaIYrGpXz+hUkn6dBMGYJe3es="
+      "from": "iconv-lite@0.4.15",
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.15.tgz"
     },
     "icss-replace-symbols": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/icss-replace-symbols/-/icss-replace-symbols-1.1.0.tgz",
-      "integrity": "sha1-Bupvg2ead0njhs/h/oEq5dsiPe0="
+      "from": "icss-replace-symbols@1.1.0",
+      "resolved": "https://registry.npmjs.org/icss-replace-symbols/-/icss-replace-symbols-1.1.0.tgz"
     },
     "icss-utils": {
       "version": "2.1.0",
+      "from": "icss-utils@>=2.1.0 <3.0.0",
       "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-2.1.0.tgz",
-      "integrity": "sha1-g/Cg7DeL8yRheLbCrZE28TWxyWI=",
       "dependencies": {
         "postcss": {
           "version": "6.0.1",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
-          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
+          "from": "postcss@>=6.0.1 <7.0.0",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
         },
         "supports-color": {
           "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "from": "supports-color@>=3.2.3 <4.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
         }
       }
     },
     "ieee754": {
       "version": "1.1.8",
-      "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.8.tgz",
-      "integrity": "sha1-vjPUCsEO8ZJnAfbwii2G+/0a0+Q="
+      "from": "ieee754@>=1.1.4 <2.0.0",
+      "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.8.tgz"
     },
     "immutability-helper": {
       "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.2.2.tgz",
-      "integrity": "sha1-5+nacos94vrTSiFvQVezJtvMyJI="
+      "from": "immutability-helper@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.2.2.tgz"
     },
     "imurmurhash": {
       "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz",
-      "integrity": "sha1-khi5srkoojixPcT7a21XbyMUU+o="
+      "from": "imurmurhash@>=0.1.4 <0.2.0",
+      "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz"
     },
     "in-publish": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/in-publish/-/in-publish-2.0.0.tgz",
-      "integrity": "sha1-4g/146KvwmkDILbcVSaCqcf631E="
+      "from": "in-publish@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/in-publish/-/in-publish-2.0.0.tgz"
     },
     "indent-string": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-2.1.0.tgz",
-      "integrity": "sha1-ji1INIdCEhtKghi3oTfppSBJ3IA="
+      "from": "indent-string@>=2.1.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-2.1.0.tgz"
     },
     "indexes-of": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/indexes-of/-/indexes-of-1.0.1.tgz",
-      "integrity": "sha1-8w9xbI4r00bHtn0985FVZqfAVgc="
+      "from": "indexes-of@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/indexes-of/-/indexes-of-1.0.1.tgz"
     },
     "indexof": {
       "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/indexof/-/indexof-0.0.1.tgz",
-      "integrity": "sha1-gtwzbSMrkGIXnQWrMpOmYFn9Q10="
+      "from": "indexof@0.0.1",
+      "resolved": "https://registry.npmjs.org/indexof/-/indexof-0.0.1.tgz"
     },
     "inflight": {
       "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
-      "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk="
+      "from": "inflight@>=1.0.4 <2.0.0",
+      "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz"
     },
     "inherits": {
       "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
-      "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4="
+      "from": "inherits@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz"
     },
     "ini": {
       "version": "1.3.4",
-      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.4.tgz",
-      "integrity": "sha1-BTfLedr1m1mhpRff9wbIbsA5Fi4="
+      "from": "ini@>=1.3.4 <2.0.0",
+      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.4.tgz"
     },
     "inpath": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/inpath/-/inpath-1.0.2.tgz",
-      "integrity": "sha1-SsIZcQ7Hpy9GD/lL9CTdPvDlKBc="
+      "from": "inpath@>=1.0.2 <1.1.0",
+      "resolved": "https://registry.npmjs.org/inpath/-/inpath-1.0.2.tgz"
     },
     "inquirer": {
       "version": "0.10.1",
+      "from": "inquirer@>=0.10.0 <0.11.0",
       "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-0.10.1.tgz",
-      "integrity": "sha1-6iXkzmnKFF4FyZ5G3P7AXkASWUo=",
       "dependencies": {
         "lodash": {
           "version": "3.10.1",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
-          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
+          "from": "lodash@>=3.3.1 <4.0.0",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz"
         }
       }
     },
     "interpret": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.0.3.tgz",
-      "integrity": "sha1-y8NcYu7uc/Gat7EKgBURQBr8D5A="
+      "from": "interpret@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.0.3.tgz"
     },
     "invariant": {
       "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.2.tgz",
-      "integrity": "sha1-nh9WrArNtr8wMwbzOL47IErmA2A="
+      "from": "invariant@>=2.2.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.2.tgz"
     },
     "invert-kv": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/invert-kv/-/invert-kv-1.0.0.tgz",
-      "integrity": "sha1-EEqOSqym09jNFXqO+L+rLXo//bY="
+      "from": "invert-kv@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/invert-kv/-/invert-kv-1.0.0.tgz"
     },
     "ipaddr.js": {
       "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.3.0.tgz",
-      "integrity": "sha1-HgOlL9rYOou7KyXL9JmLTP/NPew="
+      "from": "ipaddr.js@1.3.0",
+      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.3.0.tgz"
     },
     "irregular-plurals": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/irregular-plurals/-/irregular-plurals-1.2.0.tgz",
-      "integrity": "sha1-OPKZg0uowAwwvpxVThNyaXUv86w="
+      "from": "irregular-plurals@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/irregular-plurals/-/irregular-plurals-1.2.0.tgz"
     },
     "is": {
       "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/is/-/is-3.2.1.tgz",
-      "integrity": "sha1-0Kwq1V63sL7JJqUmb2xmKqqD3KU="
+      "from": "is@>=3.1.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/is/-/is-3.2.1.tgz"
     },
     "is-absolute": {
       "version": "0.2.6",
-      "resolved": "https://registry.npmjs.org/is-absolute/-/is-absolute-0.2.6.tgz",
-      "integrity": "sha1-IN5p89uULvLYe5wto28XIjWxtes="
+      "from": "is-absolute@>=0.2.3 <0.3.0",
+      "resolved": "https://registry.npmjs.org/is-absolute/-/is-absolute-0.2.6.tgz"
     },
     "is-absolute-url": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/is-absolute-url/-/is-absolute-url-2.1.0.tgz",
-      "integrity": "sha1-UFMN+4T8yap9vnhS6Do3uTufKqY="
+      "from": "is-absolute-url@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/is-absolute-url/-/is-absolute-url-2.1.0.tgz"
     },
     "is-arrayish": {
       "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
-      "integrity": "sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0="
+      "from": "is-arrayish@>=0.2.1 <0.3.0",
+      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz"
     },
     "is-binary-path": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-1.0.1.tgz",
-      "integrity": "sha1-dfFmQrSA8YenEcgUFh/TpKdlWJg="
+      "from": "is-binary-path@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-1.0.1.tgz"
     },
     "is-buffer": {
       "version": "1.1.5",
-      "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.5.tgz",
-      "integrity": "sha1-Hzsm72E7IUuIy8ojzGwB2Hlh7sw="
+      "from": "is-buffer@>=1.1.5 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.5.tgz"
     },
     "is-builtin-module": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-1.0.0.tgz",
-      "integrity": "sha1-VAVy0096wxGfj3bDDLwbHgN6/74="
+      "from": "is-builtin-module@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-1.0.0.tgz"
     },
     "is-callable": {
       "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.1.3.tgz",
-      "integrity": "sha1-hut1OSgF3cM69xySoO7fdO52BLI="
+      "from": "is-callable@>=1.1.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.1.3.tgz"
     },
     "is-date-object": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.1.tgz",
-      "integrity": "sha1-mqIOtq7rv/d/vTPnTKAbM1gdOhY="
+      "from": "is-date-object@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.1.tgz"
     },
     "is-directory": {
       "version": "0.3.1",
-      "resolved": "https://registry.npmjs.org/is-directory/-/is-directory-0.3.1.tgz",
-      "integrity": "sha1-YTObbyR1/Hcv2cnYP1yFddwVSuE="
+      "from": "is-directory@>=0.3.1 <0.4.0",
+      "resolved": "https://registry.npmjs.org/is-directory/-/is-directory-0.3.1.tgz"
     },
     "is-dotfile": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/is-dotfile/-/is-dotfile-1.0.2.tgz",
-      "integrity": "sha1-LBMjg/ORmfjtwmjKAbmwB9IFzE0="
+      "from": "is-dotfile@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-dotfile/-/is-dotfile-1.0.2.tgz"
     },
     "is-equal-shallow": {
       "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/is-equal-shallow/-/is-equal-shallow-0.1.3.tgz",
-      "integrity": "sha1-IjgJj8Ih3gvPpdnqxMRdY4qhxTQ="
+      "from": "is-equal-shallow@>=0.1.3 <0.2.0",
+      "resolved": "https://registry.npmjs.org/is-equal-shallow/-/is-equal-shallow-0.1.3.tgz"
     },
     "is-extendable": {
       "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
-      "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik="
+      "from": "is-extendable@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz"
     },
     "is-extglob": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
-      "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
+      "from": "is-extglob@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz"
     },
     "is-finite": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/is-finite/-/is-finite-1.0.2.tgz",
-      "integrity": "sha1-zGZ3aVYCvlUO8R6LSqYwU0K20Ko="
+      "from": "is-finite@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-finite/-/is-finite-1.0.2.tgz"
     },
     "is-fullwidth-code-point": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
-      "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
+      "from": "is-fullwidth-code-point@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz"
     },
     "is-glob": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz",
-      "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM="
+      "from": "is-glob@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz"
     },
     "is-my-json-valid": {
       "version": "2.16.0",
-      "resolved": "https://registry.npmjs.org/is-my-json-valid/-/is-my-json-valid-2.16.0.tgz",
-      "integrity": "sha1-8Hndm/2uZe4gOKrorLyGqxCeNpM="
+      "from": "is-my-json-valid@>=2.12.4 <3.0.0",
+      "resolved": "https://registry.npmjs.org/is-my-json-valid/-/is-my-json-valid-2.16.0.tgz"
     },
     "is-npm": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-npm/-/is-npm-1.0.0.tgz",
-      "integrity": "sha1-8vtjpl5JBbQGyGBydloaTceTufQ="
+      "from": "is-npm@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-npm/-/is-npm-1.0.0.tgz"
     },
     "is-number": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz",
-      "integrity": "sha1-Afy7s5NGOlSPL0ZszhbezknbkI8="
+      "from": "is-number@>=2.1.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz"
     },
     "is-obj": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-1.0.1.tgz",
-      "integrity": "sha1-PkcprB9f3gJc19g6iW2rn09n2w8="
+      "from": "is-obj@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-1.0.1.tgz"
     },
     "is-path-cwd": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-1.0.0.tgz",
-      "integrity": "sha1-0iXsIxMuie3Tj9p2dHLmLmXxEG0="
+      "from": "is-path-cwd@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-1.0.0.tgz"
     },
     "is-path-in-cwd": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-1.0.0.tgz",
-      "integrity": "sha1-ZHdYK4IU1gI0YJRWcAO+ip6sBNw="
+      "from": "is-path-in-cwd@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-1.0.0.tgz"
     },
     "is-path-inside": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-1.0.0.tgz",
-      "integrity": "sha1-/AbloWg/vaE95mev9xe7wQpI838="
+      "from": "is-path-inside@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-1.0.0.tgz"
     },
     "is-plain-obj": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-1.1.0.tgz",
-      "integrity": "sha1-caUMhCnfync8kqOQpKA7OfzVHT4="
+      "from": "is-plain-obj@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-1.1.0.tgz"
     },
     "is-plain-object": {
       "version": "2.0.2",
+      "from": "is-plain-object@>=2.0.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.2.tgz",
-      "integrity": "sha1-HZq3lWaZN94xmYBxyh9wF3CzdaQ=",
       "dependencies": {
         "isobject": {
           "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.0.tgz",
-          "integrity": "sha1-OVZSF/NmF4nooKDAgNX35rxG4aA="
+          "from": "isobject@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.0.tgz"
         }
       }
     },
     "is-posix-bracket": {
       "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz",
-      "integrity": "sha1-MzTceXdDaOkvAW5vvAqI9c1ua8Q="
+      "from": "is-posix-bracket@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz"
     },
     "is-primitive": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/is-primitive/-/is-primitive-2.0.0.tgz",
-      "integrity": "sha1-IHurkWOEmcB7Kt8kCkGochADRXU="
+      "from": "is-primitive@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/is-primitive/-/is-primitive-2.0.0.tgz"
     },
     "is-property": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/is-property/-/is-property-1.0.2.tgz",
-      "integrity": "sha1-V/4cTkhHTt1lsJkR8msc1Ald2oQ="
+      "from": "is-property@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-property/-/is-property-1.0.2.tgz"
     },
     "is-redirect": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-redirect/-/is-redirect-1.0.0.tgz",
-      "integrity": "sha1-HQPd7VO9jbDzDCbk+V02/HyH3CQ="
+      "from": "is-redirect@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-redirect/-/is-redirect-1.0.0.tgz"
     },
     "is-regex": {
       "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.0.4.tgz",
-      "integrity": "sha1-VRdIm1RwkbCTDglWVM7SXul+lJE="
+      "from": "is-regex@>=1.0.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.0.4.tgz"
     },
     "is-regexp": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-regexp/-/is-regexp-1.0.0.tgz",
-      "integrity": "sha1-/S2INUXEa6xaYz57mgnof6LLUGk="
+      "from": "is-regexp@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-regexp/-/is-regexp-1.0.0.tgz"
     },
     "is-relative": {
       "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/is-relative/-/is-relative-0.2.1.tgz",
-      "integrity": "sha1-0n9MfVFtF1+2ENuEu+7yPDvJeqU="
+      "from": "is-relative@>=0.2.1 <0.3.0",
+      "resolved": "https://registry.npmjs.org/is-relative/-/is-relative-0.2.1.tgz"
     },
     "is-retry-allowed": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/is-retry-allowed/-/is-retry-allowed-1.1.0.tgz",
-      "integrity": "sha1-EaBgVotnM5REAz0BJaYaINVk+zQ="
+      "from": "is-retry-allowed@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-retry-allowed/-/is-retry-allowed-1.1.0.tgz"
     },
     "is-stream": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz",
-      "integrity": "sha1-EtSj3U5o4Lec6428hBc66A2RykQ="
+      "from": "is-stream@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz"
     },
     "is-subset": {
       "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/is-subset/-/is-subset-0.1.1.tgz",
-      "integrity": "sha1-ilkRfZMt4d4A8kX83TnOQ/HpOaY="
+      "from": "is-subset@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/is-subset/-/is-subset-0.1.1.tgz"
     },
     "is-svg": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/is-svg/-/is-svg-2.1.0.tgz",
-      "integrity": "sha1-z2EJDaDZ77yrhyLeum8DIgjbsOk="
+      "from": "is-svg@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/is-svg/-/is-svg-2.1.0.tgz"
     },
     "is-symbol": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.0.1.tgz",
-      "integrity": "sha1-PMWfAAJRlLarLjjbrmaJJWtmBXI="
+      "from": "is-symbol@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.0.1.tgz"
     },
     "is-typedarray": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz",
-      "integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo="
+      "from": "is-typedarray@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz"
     },
     "is-unc-path": {
       "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/is-unc-path/-/is-unc-path-0.1.2.tgz",
-      "integrity": "sha1-arBTpyVzwQJQ/0FqOBTDUXivObk="
+      "from": "is-unc-path@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/is-unc-path/-/is-unc-path-0.1.2.tgz"
     },
     "is-utf8": {
       "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz",
-      "integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI="
+      "from": "is-utf8@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz"
     },
     "is-valid-glob": {
       "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/is-valid-glob/-/is-valid-glob-0.3.0.tgz",
-      "integrity": "sha1-1LVcafUYhvm2XHDWwmItN+KfSP4="
+      "from": "is-valid-glob@>=0.3.0 <0.4.0",
+      "resolved": "https://registry.npmjs.org/is-valid-glob/-/is-valid-glob-0.3.0.tgz"
     },
     "is-windows": {
       "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-0.2.0.tgz",
-      "integrity": "sha1-3hqm1j6indJIc3tp8f+LgALSEIw="
+      "from": "is-windows@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-0.2.0.tgz"
     },
     "isarray": {
       "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
-      "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
+      "from": "isarray@0.0.1",
+      "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
     },
     "isbinaryfile": {
       "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/isbinaryfile/-/isbinaryfile-3.0.2.tgz",
-      "integrity": "sha1-Sj6XTsDLqQBNP8bN5yCeppNopiE="
+      "from": "isbinaryfile@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/isbinaryfile/-/isbinaryfile-3.0.2.tgz"
     },
     "isexe": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
-      "integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA="
+      "from": "isexe@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz"
     },
     "isobject": {
       "version": "2.1.0",
+      "from": "isobject@>=2.0.0 <3.0.0",
       "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
-      "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@1.0.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         }
       }
     },
     "isomorphic-fetch": {
       "version": "2.2.1",
+      "from": "isomorphic-fetch@>=2.1.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz",
-      "integrity": "sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk=",
       "dependencies": {
         "whatwg-fetch": {
           "version": "2.0.3",
-          "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-2.0.3.tgz",
-          "integrity": "sha1-nITsLc9oGH/wC8ZOEnS0QhduHIQ="
+          "from": "whatwg-fetch@>=0.10.0",
+          "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-2.0.3.tgz"
         }
       }
     },
     "isstream": {
       "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz",
-      "integrity": "sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo="
+      "from": "isstream@>=0.1.2 <0.2.0",
+      "resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz"
     },
     "istanbul": {
       "version": "0.4.5",
+      "from": "istanbul@>=0.0.0 <1.0.0",
       "resolved": "https://registry.npmjs.org/istanbul/-/istanbul-0.4.5.tgz",
-      "integrity": "sha1-ZcfXPUxNqE1POsMQuRj7C4Azczs=",
       "dependencies": {
         "esprima": {
           "version": "2.7.3",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz",
-          "integrity": "sha1-luO3DVd59q1JzQMmc9HDEnZ7pYE="
+          "from": "esprima@>=2.7.0 <2.8.0",
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz"
         },
         "glob": {
           "version": "5.0.15",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
-          "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
+          "from": "glob@>=5.0.15 <6.0.0",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
         },
         "resolve": {
           "version": "1.1.7",
-          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz",
-          "integrity": "sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs="
+          "from": "resolve@>=1.1.0 <1.2.0",
+          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz"
         },
         "supports-color": {
           "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "from": "supports-color@>=3.1.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
         },
         "wordwrap": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz",
-          "integrity": "sha1-J1hIEIkUVqQXHI0CJkQa3pDLyus="
+          "from": "wordwrap@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz"
         }
       }
     },
     "istanbul-instrumenter-loader": {
       "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/istanbul-instrumenter-loader/-/istanbul-instrumenter-loader-0.2.0.tgz",
-      "integrity": "sha1-ZD5OXk6PlGaGOimpd9KDqzcsAZw="
+      "from": "istanbul-instrumenter-loader@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/istanbul-instrumenter-loader/-/istanbul-instrumenter-loader-0.2.0.tgz"
     },
     "istextorbinary": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/istextorbinary/-/istextorbinary-1.0.2.tgz",
-      "integrity": "sha1-rOGTVNGpoBc+/rEITOD4ewrX3s8="
+      "from": "istextorbinary@1.0.2",
+      "resolved": "https://registry.npmjs.org/istextorbinary/-/istextorbinary-1.0.2.tgz"
     },
     "jade": {
       "version": "0.26.3",
+      "from": "jade@0.26.3",
       "resolved": "https://registry.npmjs.org/jade/-/jade-0.26.3.tgz",
-      "integrity": "sha1-jxDXl32NefL2/4YqgbBRPMslaGw=",
       "dependencies": {
         "commander": {
           "version": "0.6.1",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-0.6.1.tgz",
-          "integrity": "sha1-+mihT2qUXVTbvlDYzbMyDp47GgY="
+          "from": "commander@0.6.1",
+          "resolved": "https://registry.npmjs.org/commander/-/commander-0.6.1.tgz"
         },
         "mkdirp": {
           "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.3.0.tgz",
-          "integrity": "sha1-G79asbqCevI1dRQ0kEJkVfSB/h4="
+          "from": "mkdirp@0.3.0",
+          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.3.0.tgz"
         }
       }
     },
     "jju": {
       "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/jju/-/jju-1.3.0.tgz",
-      "integrity": "sha1-2t2e8BkkvHKLA/L3l5vb1i96Kqo="
+      "from": "jju@>=1.3.0 <1.4.0",
+      "resolved": "https://registry.npmjs.org/jju/-/jju-1.3.0.tgz"
     },
     "jodid25519": {
       "version": "1.0.2",
+      "from": "jodid25519@>=1.0.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/jodid25519/-/jodid25519-1.0.2.tgz",
-      "integrity": "sha1-BtSRIlUJNBlHfUJWM2BuDpB4KWc=",
       "optional": true
     },
     "js-base64": {
       "version": "2.1.9",
-      "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.1.9.tgz",
-      "integrity": "sha1-8OgK4DmkvWVLXygfyT8EqRSn/M4="
+      "from": "js-base64@>=2.1.9 <3.0.0",
+      "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.1.9.tgz"
     },
     "js-tokens": {
       "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.1.tgz",
-      "integrity": "sha1-COnxMkhKLEWjCQfp3E1VZ7fxFNc="
+      "from": "js-tokens@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.1.tgz"
     },
     "js-yaml": {
       "version": "3.8.4",
-      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.8.4.tgz",
-      "integrity": "sha1-UgtFZPhlc7qWZir4Woyvp7S1pvY="
+      "from": "js-yaml@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.8.4.tgz"
     },
     "jsbn": {
       "version": "0.1.1",
+      "from": "jsbn@>=0.1.0 <0.2.0",
       "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-0.1.1.tgz",
-      "integrity": "sha1-peZUwuWi3rXyAdls77yoDA7y9RM=",
       "optional": true
     },
     "jsesc": {
       "version": "0.5.0",
-      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
-      "integrity": "sha1-597mbjXW/Bb3EP6R1c9p9w8IkR0="
+      "from": "jsesc@>=0.5.0 <0.6.0",
+      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz"
     },
     "json-loader": {
       "version": "0.5.4",
-      "resolved": "https://registry.npmjs.org/json-loader/-/json-loader-0.5.4.tgz",
-      "integrity": "sha1-i6oTZaYy9Yo8RtIBdfxgAsluN94="
+      "from": "json-loader@>=0.5.4 <0.6.0",
+      "resolved": "https://registry.npmjs.org/json-loader/-/json-loader-0.5.4.tgz"
     },
     "json-schema": {
       "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz",
-      "integrity": "sha1-tIDIkuWaLwWVTOcnvT8qTogvnhM="
+      "from": "json-schema@0.2.3",
+      "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz"
     },
     "json-stable-stringify": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz",
-      "integrity": "sha1-mnWdOcXy/1A/1TAGRu1EX4jE+a8="
+      "from": "json-stable-stringify@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz"
     },
     "json-stringify-safe": {
       "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz",
-      "integrity": "sha1-Epai1Y/UXxmg9s4B1lcB4sc1tus="
+      "from": "json-stringify-safe@>=5.0.1 <5.1.0",
+      "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz"
     },
     "json3": {
       "version": "3.3.2",
-      "resolved": "https://registry.npmjs.org/json3/-/json3-3.3.2.tgz",
-      "integrity": "sha1-PAQ0dD35Pi9cQq7nsZvLSDV19OE="
+      "from": "json3@3.3.2",
+      "resolved": "https://registry.npmjs.org/json3/-/json3-3.3.2.tgz"
     },
     "json5": {
       "version": "0.5.1",
-      "resolved": "https://registry.npmjs.org/json5/-/json5-0.5.1.tgz",
-      "integrity": "sha1-Hq3nrMASA0rYTiOWdn6tn6VJWCE="
+      "from": "json5@>=0.5.0 <0.6.0",
+      "resolved": "https://registry.npmjs.org/json5/-/json5-0.5.1.tgz"
     },
     "jsonfile": {
       "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz",
-      "integrity": "sha1-NzaitCi4e72gzIO1P6PWM6NcKug="
+      "from": "jsonfile@>=2.1.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz"
     },
     "jsonify": {
       "version": "0.0.0",
-      "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz",
-      "integrity": "sha1-LHS27kHZPKUbe1qu6PUDYx0lKnM="
+      "from": "jsonify@>=0.0.0 <0.1.0",
+      "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz"
     },
     "jsonpointer": {
       "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/jsonpointer/-/jsonpointer-4.0.1.tgz",
-      "integrity": "sha1-T9kss04OnbPInIYi7PUfm5eMbLk="
+      "from": "jsonpointer@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/jsonpointer/-/jsonpointer-4.0.1.tgz"
     },
     "jsprim": {
       "version": "1.4.0",
+      "from": "jsprim@>=1.2.2 <2.0.0",
       "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.0.tgz",
-      "integrity": "sha1-o7h+QCmNjDgFUtjMdiigu5WiKRg=",
       "dependencies": {
         "assert-plus": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
+          "from": "assert-plus@1.0.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz"
         }
       }
     },
     "jstransform": {
       "version": "11.0.3",
+      "from": "jstransform@>=11.0.3 <12.0.0",
       "resolved": "https://registry.npmjs.org/jstransform/-/jstransform-11.0.3.tgz",
-      "integrity": "sha1-CaeJk+CuTU70SH9hVakfYZDLQiM=",
       "dependencies": {
         "esprima-fb": {
           "version": "15001.1.0-dev-harmony-fb",
-          "resolved": "https://registry.npmjs.org/esprima-fb/-/esprima-fb-15001.1.0-dev-harmony-fb.tgz",
-          "integrity": "sha1-MKlHMDxrjV6VW+4rmbHSMyBqaQE="
+          "from": "esprima-fb@>=15001.1.0-dev-harmony-fb <15002.0.0",
+          "resolved": "https://registry.npmjs.org/esprima-fb/-/esprima-fb-15001.1.0-dev-harmony-fb.tgz"
         },
         "object-assign": {
           "version": "2.1.1",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-2.1.1.tgz",
-          "integrity": "sha1-Q8NuXVaf+OSBbE76i+AtJpZ8GKo="
+          "from": "object-assign@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-2.1.1.tgz"
         },
         "source-map": {
           "version": "0.4.4",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
-          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s="
+          "from": "source-map@>=0.4.2 <0.5.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz"
         }
       }
     },
     "jszip": {
       "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/jszip/-/jszip-2.5.0.tgz",
-      "integrity": "sha1-dET9hVHd8+XacZj+oMkbyDCMwnQ="
+      "from": "jszip@2.5.0",
+      "resolved": "https://registry.npmjs.org/jszip/-/jszip-2.5.0.tgz"
     },
     "karma": {
       "version": "0.13.22",
+      "from": "karma@>=0.13.9 <0.14.0",
       "resolved": "https://registry.npmjs.org/karma/-/karma-0.13.22.tgz",
-      "integrity": "sha1-B3ULG9Bj1+fnuRvNLmNU2PKqh0Q=",
       "dependencies": {
         "bluebird": {
           "version": "2.11.0",
-          "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-2.11.0.tgz",
-          "integrity": "sha1-U0uQM8AiyVecVro7Plpcqvu2UOE="
+          "from": "bluebird@>=2.9.27 <3.0.0",
+          "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-2.11.0.tgz"
         },
         "lodash": {
           "version": "3.10.1",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
-          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
+          "from": "lodash@>=3.8.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz"
         }
       }
     },
     "karma-coverage": {
       "version": "0.5.5",
+      "from": "karma-coverage@>=0.5.5 <0.6.0",
       "resolved": "https://registry.npmjs.org/karma-coverage/-/karma-coverage-0.5.5.tgz",
-      "integrity": "sha1-sNWLECXVnVxmICYxhvHVj11TSMU=",
       "dependencies": {
         "dateformat": {
           "version": "1.0.12",
-          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
-          "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk="
+          "from": "dateformat@>=1.0.6 <2.0.0",
+          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz"
         }
       }
     },
     "karma-mocha": {
       "version": "0.2.2",
-      "resolved": "https://registry.npmjs.org/karma-mocha/-/karma-mocha-0.2.2.tgz",
-      "integrity": "sha1-OI7ZF9oV3LGW0bkVwZNO+AMZP44="
+      "from": "karma-mocha@>=0.2.2 <0.3.0",
+      "resolved": "https://registry.npmjs.org/karma-mocha/-/karma-mocha-0.2.2.tgz"
     },
     "karma-mocha-clean-reporter": {
       "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/karma-mocha-clean-reporter/-/karma-mocha-clean-reporter-0.0.1.tgz",
-      "integrity": "sha1-6G961LxefGLX8uJC3ydRzPk/Rvo="
+      "from": "karma-mocha-clean-reporter@>=0.0.1 <0.1.0",
+      "resolved": "https://registry.npmjs.org/karma-mocha-clean-reporter/-/karma-mocha-clean-reporter-0.0.1.tgz"
     },
     "karma-phantomjs-launcher": {
       "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/karma-phantomjs-launcher/-/karma-phantomjs-launcher-1.0.4.tgz",
-      "integrity": "sha1-0jyjSAG9qYY60xjju0vUBisTrNI="
+      "from": "karma-phantomjs-launcher@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/karma-phantomjs-launcher/-/karma-phantomjs-launcher-1.0.4.tgz"
     },
     "karma-sinon-chai": {
       "version": "1.3.1",
+      "from": "karma-sinon-chai@1.3.1",
       "resolved": "https://registry.npmjs.org/karma-sinon-chai/-/karma-sinon-chai-1.3.1.tgz",
-      "integrity": "sha1-RjNBlJTZ4thIeH3XYFMDGFn1t/U=",
       "dependencies": {
         "lolex": {
           "version": "1.6.0",
-          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
-          "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
+          "from": "lolex@>=1.6.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz"
         }
       }
     },
     "karma-webpack": {
       "version": "2.0.3",
+      "from": "karma-webpack@>=2.0.1 <2.1.0",
       "resolved": "https://registry.npmjs.org/karma-webpack/-/karma-webpack-2.0.3.tgz",
-      "integrity": "sha1-Oc6/XKJYATmyf5rmm3iBa5yC+uY=",
       "dependencies": {
         "async": {
           "version": "0.9.2",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz",
-          "integrity": "sha1-rqdNXmHB+JlhO/ZL2mbUx48v0X0="
+          "from": "async@>=0.9.0 <0.10.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
         },
         "lodash": {
           "version": "3.10.1",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
-          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
+          "from": "lodash@>=3.8.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz"
         },
         "source-map": {
           "version": "0.1.43",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz",
-          "integrity": "sha1-wkvBRspRfBRx9drL4lcbK3+eM0Y="
+          "from": "source-map@>=0.1.41 <0.2.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
         }
       }
     },
     "kew": {
       "version": "0.7.0",
-      "resolved": "https://registry.npmjs.org/kew/-/kew-0.7.0.tgz",
-      "integrity": "sha1-edk9LTM2PW/dKXCzNdkUGtWR15s="
+      "from": "kew@>=0.7.0 <0.8.0",
+      "resolved": "https://registry.npmjs.org/kew/-/kew-0.7.0.tgz"
     },
     "kind-of": {
       "version": "3.2.2",
-      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-      "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+      "from": "kind-of@>=3.0.2 <4.0.0",
+      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz"
     },
     "klaw": {
       "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/klaw/-/klaw-1.3.1.tgz",
-      "integrity": "sha1-QIhDO0azsbolnXh4XY6W9zugJDk="
+      "from": "klaw@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/klaw/-/klaw-1.3.1.tgz"
     },
     "latest-version": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-2.0.0.tgz",
-      "integrity": "sha1-VvjWE5YghHuAF/jx9NeOIRMkFos="
+      "from": "latest-version@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-2.0.0.tgz"
     },
     "lazy-cache": {
       "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-1.0.4.tgz",
-      "integrity": "sha1-odePw6UEdMuAhF07O24dpJpEbo4="
+      "from": "lazy-cache@>=1.0.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-1.0.4.tgz"
     },
     "lazy-req": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/lazy-req/-/lazy-req-1.1.0.tgz",
-      "integrity": "sha1-va6+rTD42CQDnODOFJ1Nqge6H6w="
+      "from": "lazy-req@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/lazy-req/-/lazy-req-1.1.0.tgz"
     },
     "lazystream": {
       "version": "1.0.0",
+      "from": "lazystream@>=1.0.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/lazystream/-/lazystream-1.0.0.tgz",
-      "integrity": "sha1-9plf4PggOS9hOWvolGJAe7dxaOQ=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.0.5 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
     "lcid": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/lcid/-/lcid-1.0.0.tgz",
-      "integrity": "sha1-MIrMr6C8SDo4Z7S28rlQYlHRuDU="
+      "from": "lcid@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/lcid/-/lcid-1.0.0.tgz"
     },
     "levn": {
       "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/levn/-/levn-0.3.0.tgz",
-      "integrity": "sha1-OwmSTt+fCDwEkP3UwLxEIeBHZO4="
+      "from": "levn@>=0.3.0 <0.4.0",
+      "resolved": "https://registry.npmjs.org/levn/-/levn-0.3.0.tgz"
     },
     "liftoff": {
       "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/liftoff/-/liftoff-2.3.0.tgz",
-      "integrity": "sha1-qY8v9nGD2Lp8+soQVIvX/wVQs4U="
+      "from": "liftoff@>=2.1.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/liftoff/-/liftoff-2.3.0.tgz"
     },
     "livereload-js": {
       "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/livereload-js/-/livereload-js-2.2.2.tgz",
-      "integrity": "sha1-bIclfmSKtHW8JOoldFftzB+NC8I="
+      "from": "livereload-js@>=2.2.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/livereload-js/-/livereload-js-2.2.2.tgz"
     },
     "load-json-file": {
       "version": "1.1.0",
+      "from": "load-json-file@>=1.1.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
-      "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
       "dependencies": {
         "strip-bom": {
           "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
-          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
+          "from": "strip-bom@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz"
         }
       }
     },
     "load-themed-styles": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/load-themed-styles/-/load-themed-styles-1.2.0.tgz",
-      "integrity": "sha1-R6uq2LC7kxBtXX8Bq4DcIL85IDw="
+      "from": "load-themed-styles@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/load-themed-styles/-/load-themed-styles-1.2.0.tgz"
     },
     "load-themed-styles-loader": {
       "version": "0.0.3",
-      "resolved": "https://registry.npmjs.org/load-themed-styles-loader/-/load-themed-styles-loader-0.0.3.tgz",
-      "integrity": "sha1-zmFd1QkLzjvCYcnYE6tHmHdHya8="
+      "from": "load-themed-styles-loader@>=0.0.3 <0.0.4",
+      "resolved": "https://registry.npmjs.org/load-themed-styles-loader/-/load-themed-styles-loader-0.0.3.tgz"
     },
     "loader-runner": {
       "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/loader-runner/-/loader-runner-2.3.0.tgz",
-      "integrity": "sha1-9IKuqC1UPgeSFwDVpG7yb9rGuKI="
+      "from": "loader-runner@>=2.3.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/loader-runner/-/loader-runner-2.3.0.tgz"
     },
     "loader-utils": {
       "version": "0.2.17",
-      "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz",
-      "integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g="
+      "from": "loader-utils@>=0.0.0 <1.0.0",
+      "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz"
     },
     "lodash": {
       "version": "4.15.0",
-      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.15.0.tgz",
-      "integrity": "sha1-MWI5HY8BQKoiz49rPDTWt/Y9Oqk="
+      "from": "lodash@>=4.15.0 <4.16.0",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.15.0.tgz"
     },
     "lodash._arraycopy": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._arraycopy/-/lodash._arraycopy-3.0.0.tgz",
-      "integrity": "sha1-due3wfH7klRzdIeKVi7Qaj5Q9uE="
+      "from": "lodash._arraycopy@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._arraycopy/-/lodash._arraycopy-3.0.0.tgz"
     },
     "lodash._arrayeach": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._arrayeach/-/lodash._arrayeach-3.0.0.tgz",
-      "integrity": "sha1-urFWsqkNPxu9XGU0AzSeXlkz754="
+      "from": "lodash._arrayeach@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._arrayeach/-/lodash._arrayeach-3.0.0.tgz"
     },
     "lodash._baseassign": {
       "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/lodash._baseassign/-/lodash._baseassign-3.2.0.tgz",
-      "integrity": "sha1-jDigmVAPIVrQnlnxci/QxSv+Ck4="
+      "from": "lodash._baseassign@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._baseassign/-/lodash._baseassign-3.2.0.tgz"
     },
     "lodash._baseclone": {
       "version": "4.5.7",
-      "resolved": "https://registry.npmjs.org/lodash._baseclone/-/lodash._baseclone-4.5.7.tgz",
-      "integrity": "sha1-zkKt4IOE711i+nfDD2GkbmhvhDQ="
+      "from": "lodash._baseclone@>=4.5.0 <4.6.0",
+      "resolved": "https://registry.npmjs.org/lodash._baseclone/-/lodash._baseclone-4.5.7.tgz"
     },
     "lodash._basecopy": {
       "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz",
-      "integrity": "sha1-jaDmqHbPNEwK2KVIghEd08XHyjY="
+      "from": "lodash._basecopy@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz"
     },
     "lodash._basecreate": {
       "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/lodash._basecreate/-/lodash._basecreate-3.0.3.tgz",
-      "integrity": "sha1-G8ZhYU2qf8MRt9A78WgGoCE8+CE="
+      "from": "lodash._basecreate@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._basecreate/-/lodash._basecreate-3.0.3.tgz"
     },
     "lodash._basefor": {
       "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/lodash._basefor/-/lodash._basefor-3.0.3.tgz",
-      "integrity": "sha1-dVC06SGO8J+tJDQ7YSAhx5tMIMI="
+      "from": "lodash._basefor@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._basefor/-/lodash._basefor-3.0.3.tgz"
     },
     "lodash._basetostring": {
       "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/lodash._basetostring/-/lodash._basetostring-3.0.1.tgz",
-      "integrity": "sha1-0YYdh3+CSlL2aYMtyvPuFVZqB9U="
+      "from": "lodash._basetostring@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._basetostring/-/lodash._basetostring-3.0.1.tgz"
     },
     "lodash._basevalues": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._basevalues/-/lodash._basevalues-3.0.0.tgz",
-      "integrity": "sha1-W3dXYoAr3j0yl1A+JjAIIP32Ybc="
+      "from": "lodash._basevalues@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._basevalues/-/lodash._basevalues-3.0.0.tgz"
     },
     "lodash._bindcallback": {
       "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/lodash._bindcallback/-/lodash._bindcallback-3.0.1.tgz",
-      "integrity": "sha1-5THCdkTPi1epnhftlbNcdIeJOS4="
+      "from": "lodash._bindcallback@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._bindcallback/-/lodash._bindcallback-3.0.1.tgz"
     },
     "lodash._createcompounder": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._createcompounder/-/lodash._createcompounder-3.0.0.tgz",
-      "integrity": "sha1-XdLLVTctbnDg4jkvsjBNZjEJEHU="
+      "from": "lodash._createcompounder@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._createcompounder/-/lodash._createcompounder-3.0.0.tgz"
     },
     "lodash._escapehtmlchar": {
       "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/lodash._escapehtmlchar/-/lodash._escapehtmlchar-2.4.1.tgz",
-      "integrity": "sha1-32fDu2t+jh6DGrSL+geVuSr+iZ0="
+      "from": "lodash._escapehtmlchar@>=2.4.1 <2.5.0",
+      "resolved": "https://registry.npmjs.org/lodash._escapehtmlchar/-/lodash._escapehtmlchar-2.4.1.tgz"
     },
     "lodash._escapestringchar": {
       "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/lodash._escapestringchar/-/lodash._escapestringchar-2.4.1.tgz",
-      "integrity": "sha1-7P4iYYoq3lC/7qQ5N+Ud9m8O23I="
+      "from": "lodash._escapestringchar@>=2.4.1 <2.5.0",
+      "resolved": "https://registry.npmjs.org/lodash._escapestringchar/-/lodash._escapestringchar-2.4.1.tgz"
     },
     "lodash._getnative": {
       "version": "3.9.1",
-      "resolved": "https://registry.npmjs.org/lodash._getnative/-/lodash._getnative-3.9.1.tgz",
-      "integrity": "sha1-VwvH3t5G1hzc3mh9ZdPuy6o6r/U="
+      "from": "lodash._getnative@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._getnative/-/lodash._getnative-3.9.1.tgz"
     },
     "lodash._htmlescapes": {
       "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/lodash._htmlescapes/-/lodash._htmlescapes-2.4.1.tgz",
-      "integrity": "sha1-MtFL8IRLbeb4tioFG09nwii2JMs="
+      "from": "lodash._htmlescapes@>=2.4.1 <2.5.0",
+      "resolved": "https://registry.npmjs.org/lodash._htmlescapes/-/lodash._htmlescapes-2.4.1.tgz"
     },
     "lodash._isiterateecall": {
       "version": "3.0.9",
-      "resolved": "https://registry.npmjs.org/lodash._isiterateecall/-/lodash._isiterateecall-3.0.9.tgz",
-      "integrity": "sha1-UgOte6Ql+uhCRg5pbbnPPmqsBXw="
+      "from": "lodash._isiterateecall@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._isiterateecall/-/lodash._isiterateecall-3.0.9.tgz"
     },
     "lodash._isnative": {
       "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/lodash._isnative/-/lodash._isnative-2.4.1.tgz",
-      "integrity": "sha1-PqZAS3hKe+g2x7V1gOHN95sUgyw="
+      "from": "lodash._isnative@>=2.4.1 <2.5.0",
+      "resolved": "https://registry.npmjs.org/lodash._isnative/-/lodash._isnative-2.4.1.tgz"
     },
     "lodash._objecttypes": {
       "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/lodash._objecttypes/-/lodash._objecttypes-2.4.1.tgz",
-      "integrity": "sha1-fAt/admKH3ZSn4kLDNsbTf7BHBE="
+      "from": "lodash._objecttypes@>=2.4.1 <2.5.0",
+      "resolved": "https://registry.npmjs.org/lodash._objecttypes/-/lodash._objecttypes-2.4.1.tgz"
     },
     "lodash._reescape": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reescape/-/lodash._reescape-3.0.0.tgz",
-      "integrity": "sha1-Kx1vXf4HyKNVdT5fJ/rH8c3hYWo="
+      "from": "lodash._reescape@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._reescape/-/lodash._reescape-3.0.0.tgz"
     },
     "lodash._reevaluate": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reevaluate/-/lodash._reevaluate-3.0.0.tgz",
-      "integrity": "sha1-WLx0xAZklTrgsSTYBpltrKQx4u0="
+      "from": "lodash._reevaluate@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._reevaluate/-/lodash._reevaluate-3.0.0.tgz"
     },
     "lodash._reinterpolate": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz",
-      "integrity": "sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0="
+      "from": "lodash._reinterpolate@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz"
     },
     "lodash._reunescapedhtml": {
       "version": "2.4.1",
+      "from": "lodash._reunescapedhtml@>=2.4.1 <2.5.0",
       "resolved": "https://registry.npmjs.org/lodash._reunescapedhtml/-/lodash._reunescapedhtml-2.4.1.tgz",
-      "integrity": "sha1-dHxPxAED6zu4oJduVx96JlnpO6c=",
       "dependencies": {
         "lodash.keys": {
           "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz",
-          "integrity": "sha1-SN6kbfj/djKxDXBrissmWR4rNyc="
+          "from": "lodash.keys@>=2.4.1 <2.5.0",
+          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
         }
       }
     },
     "lodash._root": {
       "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/lodash._root/-/lodash._root-3.0.1.tgz",
-      "integrity": "sha1-+6HEUkwZ7ppfgTa0YJ8BfPTe1pI="
+      "from": "lodash._root@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._root/-/lodash._root-3.0.1.tgz"
     },
     "lodash._shimkeys": {
       "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/lodash._shimkeys/-/lodash._shimkeys-2.4.1.tgz",
-      "integrity": "sha1-bpzJZm/wgfC1psl4uD4kLmlJ0gM="
+      "from": "lodash._shimkeys@>=2.4.1 <2.5.0",
+      "resolved": "https://registry.npmjs.org/lodash._shimkeys/-/lodash._shimkeys-2.4.1.tgz"
     },
     "lodash._stack": {
       "version": "4.1.3",
-      "resolved": "https://registry.npmjs.org/lodash._stack/-/lodash._stack-4.1.3.tgz",
-      "integrity": "sha1-dRqnbBuWSwR+dtFPxyoJP8teLdA="
+      "from": "lodash._stack@>=4.1.0 <4.2.0",
+      "resolved": "https://registry.npmjs.org/lodash._stack/-/lodash._stack-4.1.3.tgz"
     },
     "lodash.assign": {
       "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/lodash.assign/-/lodash.assign-4.2.0.tgz",
-      "integrity": "sha1-DZnzzNem0mHRm9rrkkUAXShYCOc="
+      "from": "lodash.assign@>=4.0.3 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.assign/-/lodash.assign-4.2.0.tgz"
     },
     "lodash.assignin": {
       "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/lodash.assignin/-/lodash.assignin-4.2.0.tgz",
-      "integrity": "sha1-uo31+4QesKPoBEIysOJjqNxqKKI="
+      "from": "lodash.assignin@>=4.0.9 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.assignin/-/lodash.assignin-4.2.0.tgz"
     },
     "lodash.assignwith": {
       "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/lodash.assignwith/-/lodash.assignwith-4.2.0.tgz",
-      "integrity": "sha1-EnqX8CrcQXUalU0ksN4X4QDgOOs="
+      "from": "lodash.assignwith@>=4.0.7 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.assignwith/-/lodash.assignwith-4.2.0.tgz"
     },
     "lodash.bind": {
       "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/lodash.bind/-/lodash.bind-4.2.1.tgz",
-      "integrity": "sha1-euMBfpOWIqwxt9fX3LGzTbFpDTU="
+      "from": "lodash.bind@>=4.1.4 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.bind/-/lodash.bind-4.2.1.tgz"
     },
     "lodash.camelcase": {
       "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-3.0.1.tgz",
-      "integrity": "sha1-kyyLh/ikN3iXxnGXUzKC+Xrqwpg="
+      "from": "lodash.camelcase@>=3.0.1 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-3.0.1.tgz"
     },
     "lodash.clone": {
       "version": "4.5.0",
-      "resolved": "https://registry.npmjs.org/lodash.clone/-/lodash.clone-4.5.0.tgz",
-      "integrity": "sha1-GVhwRQ9aExkkeN9Lw9I9LeoZB7Y="
+      "from": "lodash.clone@>=4.3.2 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.clone/-/lodash.clone-4.5.0.tgz"
     },
     "lodash.clonedeep": {
       "version": "4.5.0",
-      "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz",
-      "integrity": "sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8="
+      "from": "lodash.clonedeep@>=4.3.2 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz"
     },
     "lodash.create": {
       "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/lodash.create/-/lodash.create-3.1.1.tgz",
-      "integrity": "sha1-1/KEnw29p+BGgruM1yqwIkYd6+c="
+      "from": "lodash.create@3.1.1",
+      "resolved": "https://registry.npmjs.org/lodash.create/-/lodash.create-3.1.1.tgz"
     },
     "lodash.deburr": {
       "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/lodash.deburr/-/lodash.deburr-3.2.0.tgz",
-      "integrity": "sha1-baj1QzSjZqfPTEx2742Aqhs2XtU="
+      "from": "lodash.deburr@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.deburr/-/lodash.deburr-3.2.0.tgz"
     },
     "lodash.defaults": {
       "version": "2.4.1",
+      "from": "lodash.defaults@>=2.4.1 <2.5.0",
       "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-2.4.1.tgz",
-      "integrity": "sha1-p+iIXwXmiFEUS24SqPNngCa8TFQ=",
       "dependencies": {
         "lodash.keys": {
           "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz",
-          "integrity": "sha1-SN6kbfj/djKxDXBrissmWR4rNyc="
+          "from": "lodash.keys@>=2.4.1 <2.5.0",
+          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
         }
       }
     },
     "lodash.escape": {
       "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-3.2.0.tgz",
-      "integrity": "sha1-mV7g3BjBtIzJLv+ucaEKq1tIdpg="
+      "from": "lodash.escape@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-3.2.0.tgz"
     },
     "lodash.filter": {
       "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/lodash.filter/-/lodash.filter-4.6.0.tgz",
-      "integrity": "sha1-ZosdSYFgOuHMWm+nYBQ+SAtMSs4="
+      "from": "lodash.filter@>=4.4.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.filter/-/lodash.filter-4.6.0.tgz"
     },
     "lodash.flatten": {
       "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/lodash.flatten/-/lodash.flatten-4.4.0.tgz",
-      "integrity": "sha1-8xwiIlqWMtK7+OSt2+8kCqdlph8="
+      "from": "lodash.flatten@>=4.2.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.flatten/-/lodash.flatten-4.4.0.tgz"
     },
     "lodash.foreach": {
       "version": "4.5.0",
-      "resolved": "https://registry.npmjs.org/lodash.foreach/-/lodash.foreach-4.5.0.tgz",
-      "integrity": "sha1-Gmo16s5AEoDH8G3d7DUWWrJ+PlM="
+      "from": "lodash.foreach@>=4.3.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.foreach/-/lodash.foreach-4.5.0.tgz"
     },
     "lodash.get": {
       "version": "4.4.2",
-      "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
-      "integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk="
+      "from": "lodash.get@>=4.1.2 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz"
     },
     "lodash.isarguments": {
       "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz",
-      "integrity": "sha1-L1c9hcaiQon/AGY7SRwdM4/zRYo="
+      "from": "lodash.isarguments@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz"
     },
     "lodash.isarray": {
       "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz",
-      "integrity": "sha1-eeTriMNqgSKvhvhEqpvNhRtfu1U="
+      "from": "lodash.isarray@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz"
     },
     "lodash.isempty": {
       "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/lodash.isempty/-/lodash.isempty-4.4.0.tgz",
-      "integrity": "sha1-b4bL7di+TsmHvpqvM8loTbGzHn4="
+      "from": "lodash.isempty@>=4.2.1 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.isempty/-/lodash.isempty-4.4.0.tgz"
     },
     "lodash.isequal": {
       "version": "4.5.0",
-      "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
-      "integrity": "sha1-QVxEePK8wwEgwizhDtMib30+GOA="
+      "from": "lodash.isequal@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz"
     },
     "lodash.isobject": {
       "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/lodash.isobject/-/lodash.isobject-2.4.1.tgz",
-      "integrity": "sha1-Wi5H/mmVPx7mMafrof5k0tBlWPU="
+      "from": "lodash.isobject@>=2.4.1 <2.5.0",
+      "resolved": "https://registry.npmjs.org/lodash.isobject/-/lodash.isobject-2.4.1.tgz"
     },
     "lodash.isplainobject": {
       "version": "4.0.6",
-      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
-      "integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs="
+      "from": "lodash.isplainobject@>=4.0.4 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz"
     },
     "lodash.isstring": {
       "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/lodash.isstring/-/lodash.isstring-4.0.1.tgz",
-      "integrity": "sha1-1SfftUVuynzJu5XV2ur4i6VKVFE="
+      "from": "lodash.isstring@>=4.0.1 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.isstring/-/lodash.isstring-4.0.1.tgz"
     },
     "lodash.keys": {
       "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz",
-      "integrity": "sha1-TbwEcrFWvlCgsoaFXRvQsMZWCYo="
+      "from": "lodash.keys@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz"
     },
     "lodash.keysin": {
       "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/lodash.keysin/-/lodash.keysin-4.2.0.tgz",
-      "integrity": "sha1-jMP7NcLZSsxEOhhj4C+kB5nqbyg="
+      "from": "lodash.keysin@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.keysin/-/lodash.keysin-4.2.0.tgz"
     },
     "lodash.map": {
       "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/lodash.map/-/lodash.map-4.6.0.tgz",
-      "integrity": "sha1-dx7Hg540c9nEzeKLGTlMNWL09tM="
+      "from": "lodash.map@>=4.4.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.map/-/lodash.map-4.6.0.tgz"
     },
     "lodash.mapvalues": {
       "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/lodash.mapvalues/-/lodash.mapvalues-4.6.0.tgz",
-      "integrity": "sha1-G6+lAF3p3W9PJmaMMMo3IwzJaJw="
+      "from": "lodash.mapvalues@>=4.4.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.mapvalues/-/lodash.mapvalues-4.6.0.tgz"
     },
     "lodash.memoize": {
       "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz",
-      "integrity": "sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4="
+      "from": "lodash.memoize@>=4.1.2 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz"
     },
     "lodash.merge": {
       "version": "4.3.5",
-      "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.3.5.tgz",
-      "integrity": "sha1-VOWMTyCD2f7MsVeaYPdLCT1yrRc="
+      "from": "lodash.merge@>=4.3.2 <4.4.0",
+      "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.3.5.tgz"
     },
     "lodash.mergewith": {
       "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/lodash.mergewith/-/lodash.mergewith-4.6.0.tgz",
-      "integrity": "sha1-FQzwoWeR9ZA7iJHqsVRgknS96lU="
+      "from": "lodash.mergewith@>=4.6.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.mergewith/-/lodash.mergewith-4.6.0.tgz"
     },
     "lodash.pick": {
       "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz",
-      "integrity": "sha1-UvBWEP/53tQiYRRB7R/BI6AwAbM="
+      "from": "lodash.pick@>=4.2.1 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz"
     },
     "lodash.reduce": {
       "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/lodash.reduce/-/lodash.reduce-4.6.0.tgz",
-      "integrity": "sha1-8atrg5KZrUj3hKu/R2WW8DuRTTs="
+      "from": "lodash.reduce@>=4.4.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.reduce/-/lodash.reduce-4.6.0.tgz"
     },
     "lodash.reject": {
       "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/lodash.reject/-/lodash.reject-4.6.0.tgz",
-      "integrity": "sha1-gNZJLcFHCGS79YNTO2UfQqn1JBU="
+      "from": "lodash.reject@>=4.4.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.reject/-/lodash.reject-4.6.0.tgz"
     },
     "lodash.rest": {
       "version": "4.0.5",
-      "resolved": "https://registry.npmjs.org/lodash.rest/-/lodash.rest-4.0.5.tgz",
-      "integrity": "sha1-lU73UEkmIDjJbR/Jiyj9r58Hcqo="
+      "from": "lodash.rest@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.rest/-/lodash.rest-4.0.5.tgz"
     },
     "lodash.restparam": {
       "version": "3.6.1",
-      "resolved": "https://registry.npmjs.org/lodash.restparam/-/lodash.restparam-3.6.1.tgz",
-      "integrity": "sha1-k2pOMJ7zMKdkXtQUWYbIWuWyCAU="
+      "from": "lodash.restparam@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.restparam/-/lodash.restparam-3.6.1.tgz"
     },
     "lodash.some": {
       "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/lodash.some/-/lodash.some-4.6.0.tgz",
-      "integrity": "sha1-G7nzFO9ri63tE7VJFpsqlF62jk0="
+      "from": "lodash.some@>=4.2.2 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.some/-/lodash.some-4.6.0.tgz"
     },
     "lodash.tail": {
       "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/lodash.tail/-/lodash.tail-4.1.1.tgz",
-      "integrity": "sha1-0jM6NtnncXyK0vfKyv7HwytERmQ="
+      "from": "lodash.tail@>=4.1.1 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.tail/-/lodash.tail-4.1.1.tgz"
     },
     "lodash.template": {
       "version": "3.6.2",
-      "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-3.6.2.tgz",
-      "integrity": "sha1-+M3sxhaaJVvpCYrosMU9N4kx0U8="
+      "from": "lodash.template@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-3.6.2.tgz"
     },
     "lodash.templatesettings": {
       "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-3.1.1.tgz",
-      "integrity": "sha1-+zB4RHU7Zrnxr6VOJix0UwfbqOU="
+      "from": "lodash.templatesettings@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-3.1.1.tgz"
     },
     "lodash.uniq": {
       "version": "4.5.0",
-      "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz",
-      "integrity": "sha1-0CJTc662Uq3BvILklFM5qEJ1R3M="
+      "from": "lodash.uniq@>=4.5.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz"
     },
     "lodash.values": {
       "version": "2.4.1",
+      "from": "lodash.values@>=2.4.1 <2.5.0",
       "resolved": "https://registry.npmjs.org/lodash.values/-/lodash.values-2.4.1.tgz",
-      "integrity": "sha1-q/UUQ2s8twUAFieXjLzzCxKA7qQ=",
       "dependencies": {
         "lodash.keys": {
           "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz",
-          "integrity": "sha1-SN6kbfj/djKxDXBrissmWR4rNyc="
+          "from": "lodash.keys@>=2.4.1 <2.5.0",
+          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
         }
       }
     },
     "lodash.words": {
       "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/lodash.words/-/lodash.words-3.2.0.tgz",
-      "integrity": "sha1-TiqGSbwIdFsXxpWxo86P7llmI7M="
+      "from": "lodash.words@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/lodash.words/-/lodash.words-3.2.0.tgz"
     },
     "log-symbols": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-1.0.2.tgz",
-      "integrity": "sha1-N2/3tY6jCGoPCfrMdGF+ylAeGhg="
+      "from": "log-symbols@>=1.0.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-1.0.2.tgz"
     },
     "log4js": {
       "version": "0.6.38",
+      "from": "log4js@>=0.6.31 <0.7.0",
       "resolved": "https://registry.npmjs.org/log4js/-/log4js-0.6.38.tgz",
-      "integrity": "sha1-LElBFmldb7JUgJQ9P8hy5mKlIv0=",
       "dependencies": {
         "readable-stream": {
           "version": "1.0.34",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
-          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
+          "from": "readable-stream@>=1.0.2 <1.1.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
         },
         "semver": {
           "version": "4.3.6",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz",
-          "integrity": "sha1-MAvG4OhjdPe6YQaLWx7NV/xlMto="
+          "from": "semver@>=4.3.3 <4.4.0",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz"
         }
       }
     },
     "lolex": {
       "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.4.0.tgz",
-      "integrity": "sha1-LycSsbwYDendzF06epbvPAuxYq0="
+      "from": "lolex@>=1.4.0 <1.5.0",
+      "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.4.0.tgz"
     },
     "longest": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/longest/-/longest-1.0.1.tgz",
-      "integrity": "sha1-MKCy2jj3N3DoKUoNIuZiXtd9AJc="
+      "from": "longest@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/longest/-/longest-1.0.1.tgz"
     },
     "loose-envify": {
       "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.3.1.tgz",
-      "integrity": "sha1-0aitM/qc4OcT1l/dCsi3SNR4yEg="
+      "from": "loose-envify@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.3.1.tgz"
     },
     "loud-rejection": {
       "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/loud-rejection/-/loud-rejection-1.6.0.tgz",
-      "integrity": "sha1-W0b4AUft7leIcPCG0Eghz5mOVR8="
+      "from": "loud-rejection@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/loud-rejection/-/loud-rejection-1.6.0.tgz"
     },
     "lower-case": {
       "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-1.1.4.tgz",
-      "integrity": "sha1-miyr0bno4K6ZOkv31YdcOcQujqw="
+      "from": "lower-case@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-1.1.4.tgz"
     },
     "lowercase-keys": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.0.tgz",
-      "integrity": "sha1-TjNms55/VFfjXxMkvfb4jQv8cwY="
+      "from": "lowercase-keys@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.0.tgz"
     },
     "lru-cache": {
       "version": "2.7.3",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.7.3.tgz",
-      "integrity": "sha1-bUUk6LlV+V1PW1iFHOId1y+06VI="
+      "from": "lru-cache@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.7.3.tgz"
     },
     "macaddress": {
       "version": "0.2.8",
-      "resolved": "https://registry.npmjs.org/macaddress/-/macaddress-0.2.8.tgz",
-      "integrity": "sha1-WQTcU3w57G2+/q6QIycTX6hRHxI="
+      "from": "macaddress@>=0.2.8 <0.3.0",
+      "resolved": "https://registry.npmjs.org/macaddress/-/macaddress-0.2.8.tgz"
     },
     "make-dir": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-1.0.0.tgz",
-      "integrity": "sha1-l6ARdR6R3YfPre9Ygy67BJNt6Xg="
+      "from": "make-dir@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-1.0.0.tgz"
     },
     "map-cache": {
       "version": "0.2.2",
-      "resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz",
-      "integrity": "sha1-wyq9C9ZSXZsFFkW7TyasXcmKDb8="
+      "from": "map-cache@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz"
     },
     "map-obj": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/map-obj/-/map-obj-1.0.1.tgz",
-      "integrity": "sha1-2TPOuSBdgr3PSIb2dCvcK03qFG0="
+      "from": "map-obj@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/map-obj/-/map-obj-1.0.1.tgz"
     },
     "map-stream": {
       "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/map-stream/-/map-stream-0.0.7.tgz",
-      "integrity": "sha1-ih8HiW2CsQkmvTdEokIACfiJdKg="
+      "from": "map-stream@>=0.0.3 <0.1.0",
+      "resolved": "https://registry.npmjs.org/map-stream/-/map-stream-0.0.7.tgz"
     },
     "marked": {
       "version": "0.3.6",
-      "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.6.tgz",
-      "integrity": "sha1-ssbGGPzOzk74bE/Gy4p8v1rtqNc="
+      "from": "marked@>=0.3.6 <0.4.0",
+      "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.6.tgz"
     },
     "marked-terminal": {
       "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/marked-terminal/-/marked-terminal-1.7.0.tgz",
-      "integrity": "sha1-yMRgiBx3LHYEtkNnAH7l938SWQQ="
+      "from": "marked-terminal@>=1.6.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/marked-terminal/-/marked-terminal-1.7.0.tgz"
     },
     "math-expression-evaluator": {
       "version": "1.2.17",
-      "resolved": "https://registry.npmjs.org/math-expression-evaluator/-/math-expression-evaluator-1.2.17.tgz",
-      "integrity": "sha1-3oGf282E3M2PrlnGrreWFbnSZqw="
+      "from": "math-expression-evaluator@>=1.2.14 <2.0.0",
+      "resolved": "https://registry.npmjs.org/math-expression-evaluator/-/math-expression-evaluator-1.2.17.tgz"
     },
     "md5": {
       "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/md5/-/md5-2.2.1.tgz",
-      "integrity": "sha1-U6s41f48iJG6RlMp6iP6wFQBJvk="
+      "from": "md5@>=2.2.1 <2.3.0",
+      "resolved": "https://registry.npmjs.org/md5/-/md5-2.2.1.tgz"
     },
     "media-typer": {
       "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
-      "integrity": "sha1-hxDXrwqmJvj/+hzgAWhUUmMlV0g="
+      "from": "media-typer@0.3.0",
+      "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz"
     },
     "memory-fs": {
       "version": "0.4.1",
+      "from": "memory-fs@>=0.4.1 <0.5.0",
       "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.4.1.tgz",
-      "integrity": "sha1-OpoguEYlI+RHz7x+i7gO1me/xVI=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
     "meow": {
       "version": "3.7.0",
-      "resolved": "https://registry.npmjs.org/meow/-/meow-3.7.0.tgz",
-      "integrity": "sha1-cstmi0JSKCkKu/qFaJJYcwioAfs="
+      "from": "meow@>=3.3.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/meow/-/meow-3.7.0.tgz"
     },
     "merge-descriptors": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.1.tgz",
-      "integrity": "sha1-sAqqVW3YtEVoFQ7J0blT8/kMu2E="
+      "from": "merge-descriptors@1.0.1",
+      "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.1.tgz"
     },
     "merge-stream": {
       "version": "1.0.1",
+      "from": "merge-stream@>=1.0.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-1.0.1.tgz",
-      "integrity": "sha1-QEEgLVCKNCugAXQAjfDCUbjBNeE=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
     "merge2": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.0.3.tgz",
-      "integrity": "sha1-+kT4siYmFaty8ICKQB1HinDjlNs="
+      "from": "merge2@>=1.0.2 <1.1.0",
+      "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.0.3.tgz"
     },
     "method-override": {
       "version": "2.3.9",
+      "from": "method-override@>=2.3.5 <2.4.0",
       "resolved": "https://registry.npmjs.org/method-override/-/method-override-2.3.9.tgz",
-      "integrity": "sha1-vRUfLONM8Bp2ykAKuVwBKxAtj3E=",
       "dependencies": {
         "debug": {
           "version": "2.6.8",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
-          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
+          "from": "debug@2.6.8",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz"
         }
       }
     },
     "methods": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz",
-      "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4="
+      "from": "methods@>=1.1.2 <1.2.0",
+      "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz"
     },
     "micromatch": {
       "version": "2.3.11",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
-      "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
+      "from": "micromatch@>=2.3.7 <3.0.0",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz"
     },
     "miller-rabin": {
       "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/miller-rabin/-/miller-rabin-4.0.0.tgz",
-      "integrity": "sha1-SmL7HUKTPAVYOYL0xxb2+55sbT0="
+      "from": "miller-rabin@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/miller-rabin/-/miller-rabin-4.0.0.tgz"
     },
     "mime": {
       "version": "1.3.6",
-      "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.6.tgz",
-      "integrity": "sha1-WR2E02U6awtKO5343lqoEI5y5eA="
+      "from": "mime@>=1.3.4 <2.0.0",
+      "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.6.tgz"
     },
     "mime-db": {
       "version": "1.27.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.27.0.tgz",
-      "integrity": "sha1-gg9XIpa70g7CXtVeW13oaeVDbrE="
+      "from": "mime-db@>=1.27.0 <1.28.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.27.0.tgz"
     },
     "mime-types": {
       "version": "2.1.15",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.15.tgz",
-      "integrity": "sha1-pOv1BkCUVpI3uM9wBGd20J/JKu0="
+      "from": "mime-types@>=2.1.7 <2.2.0",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.15.tgz"
     },
     "minimalistic-assert": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.0.tgz",
-      "integrity": "sha1-cCvi3aazf0g2vLP121ZkG2Sh09M="
+      "from": "minimalistic-assert@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.0.tgz"
     },
     "minimalistic-crypto-utils": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/minimalistic-crypto-utils/-/minimalistic-crypto-utils-1.0.1.tgz",
-      "integrity": "sha1-9sAMHAsIIkblxNmd+4x8CDsrWCo="
+      "from": "minimalistic-crypto-utils@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/minimalistic-crypto-utils/-/minimalistic-crypto-utils-1.0.1.tgz"
     },
     "minimatch": {
       "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
-      "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA=="
+      "from": "minimatch@>=3.0.4 <4.0.0",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz"
     },
     "minimist": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
-      "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
+      "from": "minimist@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz"
     },
     "mixin-object": {
       "version": "2.0.1",
+      "from": "mixin-object@>=2.0.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/mixin-object/-/mixin-object-2.0.1.tgz",
-      "integrity": "sha1-T7lJRB2rGCVA8f4DW6YOGUel5X4=",
       "dependencies": {
         "for-in": {
           "version": "0.1.8",
-          "resolved": "https://registry.npmjs.org/for-in/-/for-in-0.1.8.tgz",
-          "integrity": "sha1-2Hc5COMSVhCZUrH9ubP6hn0ndeE="
+          "from": "for-in@>=0.1.3 <0.2.0",
+          "resolved": "https://registry.npmjs.org/for-in/-/for-in-0.1.8.tgz"
         }
       }
     },
     "mkdirp": {
       "version": "0.5.1",
+      "from": "mkdirp@>=0.5.1 <0.6.0",
       "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
-      "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
       "dependencies": {
         "minimist": {
           "version": "0.0.8",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
-          "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0="
+          "from": "minimist@0.0.8",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz"
         }
       }
     },
     "mocha": {
       "version": "2.5.3",
+      "from": "mocha@>=2.5.3 <2.6.0",
       "resolved": "https://registry.npmjs.org/mocha/-/mocha-2.5.3.tgz",
-      "integrity": "sha1-FhvlvetJZ3HrmzV0UFC2IrWu/Fg=",
       "dependencies": {
         "commander": {
           "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-2.3.0.tgz",
-          "integrity": "sha1-/UMOiJgy7DU7ms0d4hfBHLPu+HM="
+          "from": "commander@2.3.0",
+          "resolved": "https://registry.npmjs.org/commander/-/commander-2.3.0.tgz"
         },
         "debug": {
           "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
+          "from": "debug@2.2.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
         },
         "diff": {
           "version": "1.4.0",
-          "resolved": "https://registry.npmjs.org/diff/-/diff-1.4.0.tgz",
-          "integrity": "sha1-fyjS657nsVqX79ic5j3P2qPMur8="
+          "from": "diff@1.4.0",
+          "resolved": "https://registry.npmjs.org/diff/-/diff-1.4.0.tgz"
         },
         "escape-string-regexp": {
           "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.2.tgz",
-          "integrity": "sha1-Tbwv5nTnGUnK8/smlc5/LcHZqNE="
+          "from": "escape-string-regexp@1.0.2",
+          "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.2.tgz"
         },
         "glob": {
           "version": "3.2.11",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-3.2.11.tgz",
-          "integrity": "sha1-Spc/Y1uRkPcV0QmH1cAP0oFevj0="
+          "from": "glob@3.2.11",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-3.2.11.tgz"
         },
         "minimatch": {
           "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.3.0.tgz",
-          "integrity": "sha1-J12O2qxPG7MyZHIInnlJyDlGmd0="
+          "from": "minimatch@>=0.3.0 <0.4.0",
+          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.3.0.tgz"
         },
         "ms": {
           "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+          "from": "ms@0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
         },
         "supports-color": {
           "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-1.2.0.tgz",
-          "integrity": "sha1-/x7R5hFp0Gs88tWI4YixjYhH4X4="
+          "from": "supports-color@1.2.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-1.2.0.tgz"
         }
       }
     },
     "mocha-clean": {
       "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/mocha-clean/-/mocha-clean-0.4.0.tgz",
-      "integrity": "sha1-CbaYXDIYFhQDIeED593ktIdgkhw="
+      "from": "mocha-clean@>=0.4.0 <0.5.0",
+      "resolved": "https://registry.npmjs.org/mocha-clean/-/mocha-clean-0.4.0.tgz"
     },
     "mocha-loader": {
       "version": "1.1.1",
+      "from": "mocha-loader@>=1.1.1 <2.0.0",
       "resolved": "https://registry.npmjs.org/mocha-loader/-/mocha-loader-1.1.1.tgz",
-      "integrity": "sha1-Ocm3jErWmrxTPtAuLas5gkTKM6s=",
       "dependencies": {
         "css-loader": {
           "version": "0.23.1",
+          "from": "css-loader@>=0.23.1 <0.24.0",
           "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.23.1.tgz",
-          "integrity": "sha1-n6I/K1wJZSNZEK1ezvO4o2OQ/lA=",
           "dependencies": {
             "loader-utils": {
               "version": "0.2.17",
-              "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz",
-              "integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g="
+              "from": "loader-utils@~0.2.2",
+              "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz"
             }
           }
         },
         "css-selector-tokenizer": {
           "version": "0.5.4",
-          "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.5.4.tgz",
-          "integrity": "sha1-E5uv00o1/QwUKEhwSeBpnm9qLCE="
+          "from": "css-selector-tokenizer@>=0.5.1 <0.6.0",
+          "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.5.4.tgz"
         },
         "loader-utils": {
           "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
-          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
+          "from": "loader-utils@>=1.0.2 <2.0.0",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
         },
         "style-loader": {
           "version": "0.13.2",
-          "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.13.2.tgz",
-          "integrity": "sha1-dFMzhM9pjHEEx5URULSXF63C87s="
+          "from": "style-loader@>=0.13.1 <0.14.0",
+          "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.13.2.tgz"
         }
       }
     },
     "morgan": {
       "version": "1.6.1",
+      "from": "morgan@>=1.6.1 <1.7.0",
       "resolved": "https://registry.npmjs.org/morgan/-/morgan-1.6.1.tgz",
-      "integrity": "sha1-X9gYOYxoGcuiinzWZk8pL+HAu/I=",
       "dependencies": {
         "debug": {
           "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
+          "from": "debug@>=2.2.0 <2.3.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
         },
         "depd": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz",
-          "integrity": "sha1-gK7GTJ1tl+ZcwqnKqTwKpqv3Oqo="
+          "from": "depd@>=1.0.1 <1.1.0",
+          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz"
         },
         "ms": {
           "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+          "from": "ms@0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
         }
       }
     },
     "ms": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-      "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
+      "from": "ms@2.0.0",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz"
     },
     "multiparty": {
       "version": "3.3.2",
-      "resolved": "https://registry.npmjs.org/multiparty/-/multiparty-3.3.2.tgz",
-      "integrity": "sha1-Nd5oBNwZZD5SSfPT473GyM4wHT8="
+      "from": "multiparty@3.3.2",
+      "resolved": "https://registry.npmjs.org/multiparty/-/multiparty-3.3.2.tgz"
     },
     "multipipe": {
       "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/multipipe/-/multipipe-0.1.2.tgz",
-      "integrity": "sha1-Ko8t33Du1WTf8tV/HhoTfZ8FB4s="
+      "from": "multipipe@>=0.1.2 <0.2.0",
+      "resolved": "https://registry.npmjs.org/multipipe/-/multipipe-0.1.2.tgz"
     },
     "mute-stream": {
       "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.7.tgz",
-      "integrity": "sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s="
+      "from": "mute-stream@>=0.0.4 <0.1.0",
+      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.7.tgz"
     },
     "nan": {
       "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/nan/-/nan-2.6.2.tgz",
-      "integrity": "sha1-5P805slf37WuzAjeZZb0NgWn20U="
+      "from": "nan@>=2.3.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/nan/-/nan-2.6.2.tgz"
     },
     "native-promise-only": {
       "version": "0.8.1",
-      "resolved": "https://registry.npmjs.org/native-promise-only/-/native-promise-only-0.8.1.tgz",
-      "integrity": "sha1-IKMYwwy0X3H+et+/eyHJnBRy7xE="
+      "from": "native-promise-only@>=0.8.1 <0.9.0",
+      "resolved": "https://registry.npmjs.org/native-promise-only/-/native-promise-only-0.8.1.tgz"
     },
     "natives": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/natives/-/natives-1.1.0.tgz",
-      "integrity": "sha1-6f+EFBimsux6SV6TmYT3jxY+bjE="
+      "from": "natives@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/natives/-/natives-1.1.0.tgz"
     },
     "ncname": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/ncname/-/ncname-1.0.0.tgz",
-      "integrity": "sha1-W1etGLHKCShk72Kwse2BlPODtxw="
+      "from": "ncname@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/ncname/-/ncname-1.0.0.tgz"
     },
     "negotiator": {
       "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.1.tgz",
-      "integrity": "sha1-KzJxhOiZIQEXeyhWP7XnECrNDKk="
+      "from": "negotiator@0.6.1",
+      "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.1.tgz"
     },
     "no-case": {
       "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/no-case/-/no-case-2.3.1.tgz",
-      "integrity": "sha1-euuhxzpSGEJlVUt9wDuvcg34AIE="
+      "from": "no-case@>=2.2.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/no-case/-/no-case-2.3.1.tgz"
     },
     "node-emoji": {
       "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/node-emoji/-/node-emoji-1.5.1.tgz",
-      "integrity": "sha1-/ZGOQSdpv4xEgFEjgjOECyr/FqE="
+      "from": "node-emoji@>=1.4.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/node-emoji/-/node-emoji-1.5.1.tgz"
     },
     "node-fetch": {
       "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.0.tgz",
-      "integrity": "sha1-P/bFZUT5t/sAaCM4u1Xub1SooO8="
+      "from": "node-fetch@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.0.tgz"
     },
     "node-forge": {
       "version": "0.7.1",
-      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.7.1.tgz",
-      "integrity": "sha1-naYR6giYL0uUIGs760zJZl8gwwA="
+      "from": "node-forge@>=0.7.1 <0.8.0",
+      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.7.1.tgz"
     },
     "node-gyp": {
       "version": "3.6.1",
-      "resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-3.6.1.tgz",
-      "integrity": "sha1-GVYQZ/8YVGSt7UeCEmgfR/1XjLw="
+      "from": "node-gyp@>=3.3.1 <4.0.0",
+      "resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-3.6.1.tgz"
     },
     "node-libs-browser": {
       "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-0.6.0.tgz",
-      "integrity": "sha1-JEgG1E0xngSLyGB7XMTq+aKdLjw="
+      "from": "node-libs-browser@>=0.6.0 <0.7.0",
+      "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-0.6.0.tgz"
     },
     "node-notifier": {
       "version": "5.0.2",
-      "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-5.0.2.tgz",
-      "integrity": "sha1-RDhEn+aeMh+UHO+UOYaweXAycBs="
+      "from": "node-notifier@>=5.0.2 <5.1.0",
+      "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-5.0.2.tgz"
     },
     "node-sass": {
       "version": "4.5.3",
+      "from": "node-sass@>=4.5.0 <5.0.0",
       "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.5.3.tgz",
-      "integrity": "sha1-0JydEXlkEjnRuX/8YjH9zsU+FWg=",
       "dependencies": {
         "gaze": {
           "version": "1.1.2",
-          "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz",
-          "integrity": "sha1-hHIkZ3rbiHDWeSV+0ziP22HkAQU="
+          "from": "gaze@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz"
         },
         "globule": {
           "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/globule/-/globule-1.1.0.tgz",
-          "integrity": "sha1-xJNS5NwYPYWJPuglOF65lLtt9F8="
+          "from": "globule@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/globule/-/globule-1.1.0.tgz"
         },
         "lodash": {
           "version": "4.16.6",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.16.6.tgz",
-          "integrity": "sha1-0iyaxmAojzhD4Wun0rXQbMon13c="
+          "from": "lodash@>=4.16.4 <4.17.0",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.16.6.tgz"
         }
       }
     },
     "node-status-codes": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/node-status-codes/-/node-status-codes-1.0.0.tgz",
-      "integrity": "sha1-WuVUHQJGRdMqWPzdyc7s6nrjrC8="
+      "from": "node-status-codes@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/node-status-codes/-/node-status-codes-1.0.0.tgz"
     },
     "node-zip": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/node-zip/-/node-zip-1.1.1.tgz",
-      "integrity": "sha1-lNGtZ0o81GoViN1zb0qaeMdX62I="
+      "from": "node-zip@>=1.1.1 <1.2.0",
+      "resolved": "https://registry.npmjs.org/node-zip/-/node-zip-1.1.1.tgz"
     },
     "node.extend": {
       "version": "1.1.6",
-      "resolved": "https://registry.npmjs.org/node.extend/-/node.extend-1.1.6.tgz",
-      "integrity": "sha1-p7iCyC1sk6SGOlUEvV3o7IYli5Y="
+      "from": "node.extend@>=1.0.10 <2.0.0",
+      "resolved": "https://registry.npmjs.org/node.extend/-/node.extend-1.1.6.tgz"
     },
     "nopt": {
       "version": "3.0.6",
-      "resolved": "https://registry.npmjs.org/nopt/-/nopt-3.0.6.tgz",
-      "integrity": "sha1-xkZdvwirzU2zWTF/eaxopkayj/k="
+      "from": "nopt@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/nopt/-/nopt-3.0.6.tgz"
     },
     "normalize-package-data": {
       "version": "2.3.8",
-      "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.3.8.tgz",
-      "integrity": "sha1-2Bntoqne29H/pWPqQHHZNngilbs="
+      "from": "normalize-package-data@>=2.3.2 <3.0.0",
+      "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.3.8.tgz"
     },
     "normalize-path": {
       "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-2.1.1.tgz",
-      "integrity": "sha1-GrKLVW4Zg2Oowab35vogE3/mrtk="
+      "from": "normalize-path@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-2.1.1.tgz"
     },
     "normalize-range": {
       "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/normalize-range/-/normalize-range-0.1.2.tgz",
-      "integrity": "sha1-LRDAa9/TEuqXd2laTShDlFa3WUI="
+      "from": "normalize-range@>=0.1.2 <0.2.0",
+      "resolved": "https://registry.npmjs.org/normalize-range/-/normalize-range-0.1.2.tgz"
     },
     "normalize-url": {
       "version": "1.9.1",
-      "resolved": "https://registry.npmjs.org/normalize-url/-/normalize-url-1.9.1.tgz",
-      "integrity": "sha1-LMDWazHqIwNkWENuNiDYWVTGbDw="
+      "from": "normalize-url@>=1.4.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/normalize-url/-/normalize-url-1.9.1.tgz"
     },
     "npm-run-path": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-1.0.0.tgz",
-      "integrity": "sha1-9cMr9ZX+ga6Sfa7FLoL4sACsPI8="
+      "from": "npm-run-path@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-1.0.0.tgz"
     },
     "npmlog": {
       "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.0.tgz",
-      "integrity": "sha512-ocolIkZYZt8UveuiDS0yAkkIjid1o7lPG8cYm05yNYzBn8ykQtaiPMEGp8fY9tKdDgm8okpdKzkvu1y9hUYugA=="
+      "from": "npmlog@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.0.tgz"
     },
     "nth-check": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-1.0.1.tgz",
-      "integrity": "sha1-mSms32KPwsQQmN6rgqxYDPFJquQ="
+      "from": "nth-check@>=1.0.1 <1.1.0",
+      "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-1.0.1.tgz"
     },
     "num2fraction": {
       "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/num2fraction/-/num2fraction-1.2.2.tgz",
-      "integrity": "sha1-b2gragJ6Tp3fpFZM0lidHU5mnt4="
+      "from": "num2fraction@>=1.2.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/num2fraction/-/num2fraction-1.2.2.tgz"
     },
     "number-is-nan": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz",
-      "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0="
+      "from": "number-is-nan@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz"
     },
     "oauth-sign": {
       "version": "0.8.2",
-      "resolved": "https://registry.npmjs.org/oauth-sign/-/oauth-sign-0.8.2.tgz",
-      "integrity": "sha1-Rqarfwrq2N6unsBWV4C31O/rnUM="
+      "from": "oauth-sign@>=0.8.1 <0.9.0",
+      "resolved": "https://registry.npmjs.org/oauth-sign/-/oauth-sign-0.8.2.tgz"
     },
     "object-assign": {
       "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
-      "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM="
+      "from": "object-assign@>=4.1.0 <4.2.0",
+      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz"
     },
     "object-component": {
       "version": "0.0.3",
-      "resolved": "https://registry.npmjs.org/object-component/-/object-component-0.0.3.tgz",
-      "integrity": "sha1-8MaapQ78lbhmwYb0AKM3acsvEpE="
+      "from": "object-component@0.0.3",
+      "resolved": "https://registry.npmjs.org/object-component/-/object-component-0.0.3.tgz"
     },
     "object-is": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.0.1.tgz",
-      "integrity": "sha1-CqYOyZiaCz7Xlc9NBvYs8a1lObY="
+      "from": "object-is@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.0.1.tgz"
     },
     "object-keys": {
       "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-0.4.0.tgz",
-      "integrity": "sha1-KKaq50KN0sOpLz2V8hM13SBOAzY="
+      "from": "object-keys@>=0.4.0 <0.5.0",
+      "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-0.4.0.tgz"
     },
     "object.assign": {
       "version": "4.0.4",
+      "from": "object.assign@>=4.0.4 <5.0.0",
       "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.0.4.tgz",
-      "integrity": "sha1-scnMBE7xuf5jYG/BQau7MuFHMMw=",
       "dependencies": {
         "object-keys": {
           "version": "1.0.11",
-          "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.0.11.tgz",
-          "integrity": "sha1-xUYBd4rVYPEULODgG8yotW0TQm0="
+          "from": "object-keys@>=1.0.10 <2.0.0",
+          "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.0.11.tgz"
         }
       }
     },
     "object.entries": {
       "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/object.entries/-/object.entries-1.0.4.tgz",
-      "integrity": "sha1-G/mk3SKI9bM/Opk9JXZh8F0WGl8="
+      "from": "object.entries@>=1.0.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/object.entries/-/object.entries-1.0.4.tgz"
     },
     "object.omit": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/object.omit/-/object.omit-2.0.1.tgz",
-      "integrity": "sha1-Gpx0SCnznbuFjHbKNXmuKlTr0fo="
+      "from": "object.omit@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/object.omit/-/object.omit-2.0.1.tgz"
     },
     "object.pick": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/object.pick/-/object.pick-1.2.0.tgz",
-      "integrity": "sha1-tTkr7peC2m2ft9avr1OXefEjTCs="
+      "from": "object.pick@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/object.pick/-/object.pick-1.2.0.tgz"
     },
     "object.values": {
       "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.0.4.tgz",
-      "integrity": "sha1-5STaCbT2b/Bd9FdUbscqyZ8TBpo="
+      "from": "object.values@>=1.0.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.0.4.tgz"
     },
     "obuf": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/obuf/-/obuf-1.1.1.tgz",
-      "integrity": "sha1-EEEktsYCxnlogaBCVB0220OlJk4="
+      "from": "obuf@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/obuf/-/obuf-1.1.1.tgz"
     },
     "office-ui-fabric-core": {
       "version": "7.0.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-7.0.0.tgz",
-      "integrity": "sha1-5rl2yY1wuKoAvVAGTIgOE3dFiY4="
+      "from": "office-ui-fabric-core@>=7.0.0 <8.0.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-7.0.0.tgz"
     },
     "office-ui-fabric-react": {
       "version": "2.34.2",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-2.34.2.tgz",
-      "integrity": "sha1-+sP1mNQTD3//PprellvW+LOwQ/M="
+      "from": "office-ui-fabric-react@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-2.34.2.tgz"
     },
     "on-finished": {
       "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz",
-      "integrity": "sha1-IPEzZIGwg811M3mSoWlxqi2QaUc="
+      "from": "on-finished@>=2.3.0 <2.4.0",
+      "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz"
     },
     "on-headers": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/on-headers/-/on-headers-1.0.1.tgz",
-      "integrity": "sha1-ko9dD0cNSTQmUepnlLCFfBAGk/c="
+      "from": "on-headers@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/on-headers/-/on-headers-1.0.1.tgz"
     },
     "once": {
       "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
-      "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E="
+      "from": "once@>=1.3.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz"
     },
     "onetime": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/onetime/-/onetime-1.1.0.tgz",
-      "integrity": "sha1-ofeDj4MUxRbwXs78vEzP4EtO14k="
+      "from": "onetime@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/onetime/-/onetime-1.1.0.tgz"
     },
     "open": {
       "version": "0.0.5",
-      "resolved": "https://registry.npmjs.org/open/-/open-0.0.5.tgz",
-      "integrity": "sha1-QsPhjslUZra/DcQvOilFw/DK2Pw="
+      "from": "open@0.0.5",
+      "resolved": "https://registry.npmjs.org/open/-/open-0.0.5.tgz"
     },
     "opener": {
       "version": "1.4.3",
-      "resolved": "https://registry.npmjs.org/opener/-/opener-1.4.3.tgz",
-      "integrity": "sha1-XG2ixdflgx6P+jlklQ+NZnSskLg="
+      "from": "opener@>=1.4.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/opener/-/opener-1.4.3.tgz"
     },
     "opn": {
       "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/opn/-/opn-4.0.2.tgz",
-      "integrity": "sha1-erwi5kTf9jsKltWrfyeQwPAavJU="
+      "from": "opn@4.0.2",
+      "resolved": "https://registry.npmjs.org/opn/-/opn-4.0.2.tgz"
     },
     "optimist": {
       "version": "0.6.1",
+      "from": "optimist@>=0.6.0 <0.7.0",
       "resolved": "https://registry.npmjs.org/optimist/-/optimist-0.6.1.tgz",
-      "integrity": "sha1-2j6nRob6IaGaERwybpDrFaAZZoY=",
       "dependencies": {
         "minimist": {
           "version": "0.0.10",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.10.tgz",
-          "integrity": "sha1-3j+YVD2/lggr5IrRoMfNqDYwHc8="
+          "from": "minimist@>=0.0.1 <0.1.0",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.10.tgz"
         }
       }
     },
     "optionator": {
       "version": "0.8.2",
+      "from": "optionator@>=0.8.1 <0.9.0",
       "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.8.2.tgz",
-      "integrity": "sha1-NkxeQJ0/TWMB1sC0wFu6UBgK62Q=",
       "dependencies": {
         "wordwrap": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz",
-          "integrity": "sha1-J1hIEIkUVqQXHI0CJkQa3pDLyus="
+          "from": "wordwrap@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz"
         }
       }
     },
     "options": {
       "version": "0.0.6",
-      "resolved": "https://registry.npmjs.org/options/-/options-0.0.6.tgz",
-      "integrity": "sha1-7CLTEoBrtT5zF3Pnza788cZDEo8="
+      "from": "options@>=0.0.5",
+      "resolved": "https://registry.npmjs.org/options/-/options-0.0.6.tgz"
     },
     "orchestrator": {
       "version": "0.3.8",
+      "from": "orchestrator@>=0.3.7 <0.4.0",
       "resolved": "https://registry.npmjs.org/orchestrator/-/orchestrator-0.3.8.tgz",
-      "integrity": "sha1-FOfp4nZPcxX7rBhOUGx6pt+UrX4=",
       "dependencies": {
         "end-of-stream": {
           "version": "0.1.5",
-          "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-0.1.5.tgz",
-          "integrity": "sha1-jhdyBsPICDfYVjLouTWd/osvbq8="
+          "from": "end-of-stream@>=0.1.5 <0.2.0",
+          "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-0.1.5.tgz"
         },
         "once": {
           "version": "1.3.3",
-          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz",
-          "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA="
+          "from": "once@>=1.3.0 <1.4.0",
+          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz"
         }
       }
     },
     "ordered-read-streams": {
       "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.1.0.tgz",
-      "integrity": "sha1-/VZamvjrRHO6abbtijQ1LLVS8SY="
+      "from": "ordered-read-streams@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.1.0.tgz"
     },
     "original": {
       "version": "1.0.0",
+      "from": "original@>=0.0.5",
       "resolved": "https://registry.npmjs.org/original/-/original-1.0.0.tgz",
-      "integrity": "sha1-kUf5P6FpbQS+YeAb1QuurKZWvTs=",
       "dependencies": {
         "url-parse": {
           "version": "1.0.5",
-          "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.0.5.tgz",
-          "integrity": "sha1-CFSGBCKv3P7+tsllxmLUgAFpkns="
+          "from": "url-parse@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.0.5.tgz"
         }
       }
     },
     "os-browserify": {
       "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.1.2.tgz",
-      "integrity": "sha1-ScoCk+CxlZCl9d4Qx/JlphfY/lQ="
+      "from": "os-browserify@>=0.1.2 <0.2.0",
+      "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.1.2.tgz"
     },
     "os-homedir": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
-      "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M="
+      "from": "os-homedir@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz"
     },
     "os-locale": {
       "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
-      "integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk="
+      "from": "os-locale@>=1.4.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz"
     },
     "os-tmpdir": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
-      "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ="
+      "from": "os-tmpdir@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz"
     },
     "osenv": {
       "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.4.tgz",
-      "integrity": "sha1-Qv5tWVPfBsgGS+bxdsPQWqqjRkQ="
+      "from": "osenv@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.4.tgz"
     },
     "package-json": {
       "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/package-json/-/package-json-2.4.0.tgz",
-      "integrity": "sha1-DRW9Z9HLvduyyiIv8u24a8sxqLs="
+      "from": "package-json@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/package-json/-/package-json-2.4.0.tgz"
     },
     "pako": {
       "version": "0.2.9",
-      "resolved": "https://registry.npmjs.org/pako/-/pako-0.2.9.tgz",
-      "integrity": "sha1-8/dSL073gjSNqBYbrZ7P1Rv4OnU="
+      "from": "pako@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/pako/-/pako-0.2.9.tgz"
     },
     "parallel-transform": {
       "version": "1.1.0",
+      "from": "parallel-transform@>=1.1.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/parallel-transform/-/parallel-transform-1.1.0.tgz",
-      "integrity": "sha1-1BDwZbBdojCB/NEPKIVMKb2jOwY=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.1.5 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
     "param-case": {
       "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/param-case/-/param-case-2.1.1.tgz",
-      "integrity": "sha1-35T9jPZTHs915r75oIWPvHK+Ikc="
+      "from": "param-case@>=2.1.0 <2.2.0",
+      "resolved": "https://registry.npmjs.org/param-case/-/param-case-2.1.1.tgz"
     },
     "parse-asn1": {
       "version": "5.1.0",
+      "from": "parse-asn1@>=5.0.0 <6.0.0",
       "resolved": "https://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.0.tgz",
-      "integrity": "sha1-N8T5t+06tlx0gXtfJICTf7+XxxI=",
       "dependencies": {
         "browserify-aes": {
           "version": "1.0.6",
-          "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.6.tgz",
-          "integrity": "sha1-Xncl297x/Vkw1OurSFZ85FHEigo="
+          "from": "browserify-aes@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.6.tgz"
         }
       }
     },
     "parse-filepath": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/parse-filepath/-/parse-filepath-1.0.1.tgz",
-      "integrity": "sha1-FZ1hVdQ5BNFsEO9piRHaHpGWm3M="
+      "from": "parse-filepath@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/parse-filepath/-/parse-filepath-1.0.1.tgz"
     },
     "parse-glob": {
       "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/parse-glob/-/parse-glob-3.0.4.tgz",
-      "integrity": "sha1-ssN2z7EfNVE7rdFz7wu246OIORw="
+      "from": "parse-glob@>=3.0.4 <4.0.0",
+      "resolved": "https://registry.npmjs.org/parse-glob/-/parse-glob-3.0.4.tgz"
     },
     "parse-json": {
       "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz",
-      "integrity": "sha1-9ID0BDTvgHQfhGkJn43qGPVaTck="
+      "from": "parse-json@>=2.2.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz"
     },
     "parse-passwd": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/parse-passwd/-/parse-passwd-1.0.0.tgz",
-      "integrity": "sha1-bVuTSkVpk7I9N/QKOC1vFmao5cY="
+      "from": "parse-passwd@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/parse-passwd/-/parse-passwd-1.0.0.tgz"
     },
     "parsejson": {
       "version": "0.0.3",
-      "resolved": "https://registry.npmjs.org/parsejson/-/parsejson-0.0.3.tgz",
-      "integrity": "sha1-q343WfIJ7OmUN5c/fQ8fZK4OZKs="
+      "from": "parsejson@0.0.3",
+      "resolved": "https://registry.npmjs.org/parsejson/-/parsejson-0.0.3.tgz"
     },
     "parseqs": {
       "version": "0.0.5",
-      "resolved": "https://registry.npmjs.org/parseqs/-/parseqs-0.0.5.tgz",
-      "integrity": "sha1-1SCKNzjkZ2bikbouoXNoSSGouJ0="
+      "from": "parseqs@0.0.5",
+      "resolved": "https://registry.npmjs.org/parseqs/-/parseqs-0.0.5.tgz"
     },
     "parseuri": {
       "version": "0.0.5",
-      "resolved": "https://registry.npmjs.org/parseuri/-/parseuri-0.0.5.tgz",
-      "integrity": "sha1-gCBKUNTbt3m/3G6+J3jZDkvOMgo="
+      "from": "parseuri@0.0.5",
+      "resolved": "https://registry.npmjs.org/parseuri/-/parseuri-0.0.5.tgz"
     },
     "parseurl": {
       "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.1.tgz",
-      "integrity": "sha1-yKuMkiO6NIiKpkopeyiFO+wY2lY="
+      "from": "parseurl@>=1.3.1 <1.4.0",
+      "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.1.tgz"
     },
     "path-browserify": {
       "version": "0.0.0",
-      "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-0.0.0.tgz",
-      "integrity": "sha1-oLhwcpquIUAFt9UDLsLLuw+0RRo="
+      "from": "path-browserify@0.0.0",
+      "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-0.0.0.tgz"
     },
     "path-dirname": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/path-dirname/-/path-dirname-1.0.2.tgz",
-      "integrity": "sha1-zDPSTVJeCZpTiMAzbG4yuRYGCeA="
+      "from": "path-dirname@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/path-dirname/-/path-dirname-1.0.2.tgz"
     },
     "path-exists": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
-      "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s="
+      "from": "path-exists@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz"
     },
     "path-is-absolute": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
-      "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18="
+      "from": "path-is-absolute@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz"
     },
     "path-is-inside": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/path-is-inside/-/path-is-inside-1.0.2.tgz",
-      "integrity": "sha1-NlQX3t5EQw0cEa9hAn+s8HS9/FM="
+      "from": "path-is-inside@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/path-is-inside/-/path-is-inside-1.0.2.tgz"
     },
     "path-key": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/path-key/-/path-key-1.0.0.tgz",
-      "integrity": "sha1-XVPVeAGWRsDWiADbThRua9wqx68="
+      "from": "path-key@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/path-key/-/path-key-1.0.0.tgz"
     },
     "path-parse": {
       "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.5.tgz",
-      "integrity": "sha1-PBrfhx6pzWyUMbbqK9dKD/BVxME="
+      "from": "path-parse@>=1.0.5 <2.0.0",
+      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.5.tgz"
     },
     "path-root": {
       "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/path-root/-/path-root-0.1.1.tgz",
-      "integrity": "sha1-mkpoFMrBwM1zNgqV8yCDyOpHRbc="
+      "from": "path-root@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/path-root/-/path-root-0.1.1.tgz"
     },
     "path-root-regex": {
       "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/path-root-regex/-/path-root-regex-0.1.2.tgz",
-      "integrity": "sha1-v8zcjfWxLcUsi0PsONGNcsBLqW0="
+      "from": "path-root-regex@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/path-root-regex/-/path-root-regex-0.1.2.tgz"
     },
     "path-to-regexp": {
       "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
-      "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
+      "from": "path-to-regexp@0.1.7",
+      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz"
     },
     "path-type": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
-      "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE="
+      "from": "path-type@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz"
     },
     "pause": {
       "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/pause/-/pause-0.1.0.tgz",
-      "integrity": "sha1-68ikqGGf8LioGsFRPDQ0/0af23Q="
+      "from": "pause@0.1.0",
+      "resolved": "https://registry.npmjs.org/pause/-/pause-0.1.0.tgz"
     },
     "pause-stream": {
       "version": "0.0.11",
-      "resolved": "https://registry.npmjs.org/pause-stream/-/pause-stream-0.0.11.tgz",
-      "integrity": "sha1-/lo0sMvOErWqaitAPuLnO2AvFEU="
+      "from": "pause-stream@0.0.11",
+      "resolved": "https://registry.npmjs.org/pause-stream/-/pause-stream-0.0.11.tgz"
     },
     "pbkdf2": {
       "version": "3.0.12",
+      "from": "pbkdf2@>=3.0.3 <4.0.0",
       "resolved": "https://registry.npmjs.org/pbkdf2/-/pbkdf2-3.0.12.tgz",
-      "integrity": "sha1-vjZ4XFBn6kjYBv+SMojF91C2uKI=",
       "dependencies": {
         "ripemd160": {
           "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz",
-          "integrity": "sha1-D0WEKVxTo2KK9+bXmsohzlfRxuc="
+          "from": "ripemd160@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz"
         },
         "sha.js": {
           "version": "2.4.8",
-          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz",
-          "integrity": "sha1-NwaMLEdra69ALRSknGf1l5IfY08="
+          "from": "sha.js@>=2.4.8 <3.0.0",
+          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz"
         }
       }
     },
     "pbkdf2-compat": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/pbkdf2-compat/-/pbkdf2-compat-2.0.1.tgz",
-      "integrity": "sha1-tuDI+plJTZTgURV1gCpZpcFC8og="
+      "from": "pbkdf2-compat@2.0.1",
+      "resolved": "https://registry.npmjs.org/pbkdf2-compat/-/pbkdf2-compat-2.0.1.tgz"
     },
     "pend": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/pend/-/pend-1.2.0.tgz",
-      "integrity": "sha1-elfrVQpng/kRUzH89GY9XI4AelA="
+      "from": "pend@>=1.2.0 <1.3.0",
+      "resolved": "https://registry.npmjs.org/pend/-/pend-1.2.0.tgz"
     },
     "performance-now": {
       "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-0.2.0.tgz",
-      "integrity": "sha1-M+8wxcd9TqIcWlOGnZG1bY8lVeU="
+      "from": "performance-now@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-0.2.0.tgz"
     },
     "phantomcss": {
       "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/phantomcss/-/phantomcss-1.1.3.tgz",
-      "integrity": "sha1-4+N98YNapNYWcLnyzbiIVipjMMM="
+      "from": "phantomcss@1.1.3",
+      "resolved": "https://registry.npmjs.org/phantomcss/-/phantomcss-1.1.3.tgz"
     },
     "phantomjs-polyfill": {
       "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/phantomjs-polyfill/-/phantomjs-polyfill-0.0.2.tgz",
-      "integrity": "sha1-jGpxY+m8j9n/2+fWBctTUvn7iR4="
+      "from": "phantomjs-polyfill@>=0.0.2 <0.1.0",
+      "resolved": "https://registry.npmjs.org/phantomjs-polyfill/-/phantomjs-polyfill-0.0.2.tgz"
     },
     "phantomjs-prebuilt": {
       "version": "2.1.14",
+      "from": "phantomjs-prebuilt@>=2.1.6 <2.2.0",
       "resolved": "https://registry.npmjs.org/phantomjs-prebuilt/-/phantomjs-prebuilt-2.1.14.tgz",
-      "integrity": "sha1-1T0xH8+30dCN2yQBRVjxGIxRbaA=",
       "dependencies": {
         "caseless": {
           "version": "0.11.0",
-          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz",
-          "integrity": "sha1-cVuW6phBWTzDMGeSP17GDr2k99c="
+          "from": "caseless@>=0.11.0 <0.12.0",
+          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz"
         },
         "es6-promise": {
           "version": "4.0.5",
-          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.0.5.tgz",
-          "integrity": "sha1-eILzCt3lskDM+n99eMVIMwlRrkI="
+          "from": "es6-promise@>=4.0.3 <4.1.0",
+          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.0.5.tgz"
         },
         "fs-extra": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-1.0.0.tgz",
-          "integrity": "sha1-zTzl9+fLYUWIP8rjGR6Yd/hYeVA="
+          "from": "fs-extra@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-1.0.0.tgz"
         },
         "har-validator": {
           "version": "2.0.6",
-          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz",
-          "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0="
+          "from": "har-validator@>=2.0.6 <2.1.0",
+          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz"
         },
         "qs": {
           "version": "6.3.2",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-6.3.2.tgz",
-          "integrity": "sha1-51vV9uJoEioqDgvaYwslUMFmUCw="
+          "from": "qs@>=6.3.0 <6.4.0",
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.3.2.tgz"
         },
         "request": {
           "version": "2.79.0",
-          "resolved": "https://registry.npmjs.org/request/-/request-2.79.0.tgz",
-          "integrity": "sha1-Tf5b9r6LjNw3/Pk+BLZVd3InEN4="
+          "from": "request@>=2.79.0 <2.80.0",
+          "resolved": "https://registry.npmjs.org/request/-/request-2.79.0.tgz"
         },
         "tunnel-agent": {
           "version": "0.4.3",
-          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz",
-          "integrity": "sha1-Y3PbdpCf5XDgjXNYM2Xtgop07us="
+          "from": "tunnel-agent@>=0.4.1 <0.5.0",
+          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz"
         }
       }
     },
     "pidof": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/pidof/-/pidof-1.0.2.tgz",
-      "integrity": "sha1-+6Dq4cgzWhHrgJn10PPvvEXLTpA="
+      "from": "pidof@>=1.0.2 <1.1.0",
+      "resolved": "https://registry.npmjs.org/pidof/-/pidof-1.0.2.tgz"
     },
     "pify": {
       "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
-      "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
+      "from": "pify@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz"
     },
     "pinkie": {
       "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/pinkie/-/pinkie-2.0.4.tgz",
-      "integrity": "sha1-clVrgM+g1IqXToDnckjoDtT3+HA="
+      "from": "pinkie@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/pinkie/-/pinkie-2.0.4.tgz"
     },
     "pinkie-promise": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz",
-      "integrity": "sha1-ITXW36ejWMBprJsXh3YogihFD/o="
+      "from": "pinkie-promise@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz"
     },
     "pkg-conf": {
       "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/pkg-conf/-/pkg-conf-1.1.3.tgz",
-      "integrity": "sha1-N45W1v0T6Iv7b0ol33qD+qvduls="
+      "from": "pkg-conf@>=1.1.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/pkg-conf/-/pkg-conf-1.1.3.tgz"
     },
     "plur": {
       "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/plur/-/plur-2.1.2.tgz",
-      "integrity": "sha1-dIJFLBoPUI4+NE6uwxLJHCncZVo="
+      "from": "plur@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/plur/-/plur-2.1.2.tgz"
     },
     "portfinder": {
       "version": "1.0.13",
-      "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.13.tgz",
-      "integrity": "sha1-uzLs2HwnEErm7kS1o8y/Drsa7ek="
+      "from": "portfinder@>=1.0.9 <2.0.0",
+      "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.13.tgz"
     },
     "postcss": {
       "version": "5.2.17",
+      "from": "postcss@>=5.0.21 <6.0.0",
       "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-      "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
       "dependencies": {
         "supports-color": {
           "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "from": "supports-color@>=3.2.3 <4.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
         }
       }
     },
     "postcss-calc": {
       "version": "5.3.1",
-      "resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-5.3.1.tgz",
-      "integrity": "sha1-d7rnypKK2FcW4v2kLyYb98HWW14="
+      "from": "postcss-calc@>=5.2.0 <6.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-5.3.1.tgz"
     },
     "postcss-colormin": {
       "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/postcss-colormin/-/postcss-colormin-2.2.2.tgz",
-      "integrity": "sha1-ZjFBfV8OkJo9fsJrJMio0eT5bks="
+      "from": "postcss-colormin@>=2.1.8 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-colormin/-/postcss-colormin-2.2.2.tgz"
     },
     "postcss-convert-values": {
       "version": "2.6.1",
-      "resolved": "https://registry.npmjs.org/postcss-convert-values/-/postcss-convert-values-2.6.1.tgz",
-      "integrity": "sha1-u9hZPFwf0uPRwyK7kl3K6Nrk1i0="
+      "from": "postcss-convert-values@>=2.3.4 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-convert-values/-/postcss-convert-values-2.6.1.tgz"
     },
     "postcss-discard-comments": {
       "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/postcss-discard-comments/-/postcss-discard-comments-2.0.4.tgz",
-      "integrity": "sha1-vv6J+v1bPazlzM5Rt2uBUUvgDj0="
+      "from": "postcss-discard-comments@>=2.0.4 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-discard-comments/-/postcss-discard-comments-2.0.4.tgz"
     },
     "postcss-discard-duplicates": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/postcss-discard-duplicates/-/postcss-discard-duplicates-2.1.0.tgz",
-      "integrity": "sha1-uavye4isGIFYpesSq8riAmO5GTI="
+      "from": "postcss-discard-duplicates@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-discard-duplicates/-/postcss-discard-duplicates-2.1.0.tgz"
     },
     "postcss-discard-empty": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/postcss-discard-empty/-/postcss-discard-empty-2.1.0.tgz",
-      "integrity": "sha1-0rS9nVztXr2Nyt52QMfXzX9PkrU="
+      "from": "postcss-discard-empty@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-discard-empty/-/postcss-discard-empty-2.1.0.tgz"
     },
     "postcss-discard-overridden": {
       "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/postcss-discard-overridden/-/postcss-discard-overridden-0.1.1.tgz",
-      "integrity": "sha1-ix6vVU9ob7KIzYdMVWZ7CqNmjVg="
+      "from": "postcss-discard-overridden@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/postcss-discard-overridden/-/postcss-discard-overridden-0.1.1.tgz"
     },
     "postcss-discard-unused": {
       "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/postcss-discard-unused/-/postcss-discard-unused-2.2.3.tgz",
-      "integrity": "sha1-vOMLLMWR/8Y0Mitfs0ZLbZNPRDM="
+      "from": "postcss-discard-unused@>=2.2.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-discard-unused/-/postcss-discard-unused-2.2.3.tgz"
     },
     "postcss-filter-plugins": {
       "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/postcss-filter-plugins/-/postcss-filter-plugins-2.0.2.tgz",
-      "integrity": "sha1-bYWGJTTXNaxCDkqFgG4fXUKG2Ew="
+      "from": "postcss-filter-plugins@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-filter-plugins/-/postcss-filter-plugins-2.0.2.tgz"
     },
     "postcss-load-config": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-1.2.0.tgz",
-      "integrity": "sha1-U56a/J3chiASHr+djDZz4M5Q0oo="
+      "from": "postcss-load-config@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-1.2.0.tgz"
     },
     "postcss-load-options": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/postcss-load-options/-/postcss-load-options-1.2.0.tgz",
-      "integrity": "sha1-sJixVZ3awt8EvAuzdfmaXP4rbYw="
+      "from": "postcss-load-options@>=1.2.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-load-options/-/postcss-load-options-1.2.0.tgz"
     },
     "postcss-load-plugins": {
       "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/postcss-load-plugins/-/postcss-load-plugins-2.3.0.tgz",
-      "integrity": "sha1-dFdoEWWZrKLwCfrUJrABdQSdjZI="
+      "from": "postcss-load-plugins@>=2.3.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-load-plugins/-/postcss-load-plugins-2.3.0.tgz"
     },
     "postcss-loader": {
       "version": "1.3.3",
+      "from": "postcss-loader@>=1.3.3 <2.0.0",
       "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-1.3.3.tgz",
-      "integrity": "sha1-piHqH6KQYqg5cqRvVEhncTAZFus=",
       "dependencies": {
         "loader-utils": {
           "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
-          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
+          "from": "loader-utils@>=1.0.2 <2.0.0",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
         }
       }
     },
     "postcss-merge-idents": {
       "version": "2.1.7",
-      "resolved": "https://registry.npmjs.org/postcss-merge-idents/-/postcss-merge-idents-2.1.7.tgz",
-      "integrity": "sha1-TFUwMTwI4dWzu/PSu8dH4njuonA="
+      "from": "postcss-merge-idents@>=2.1.5 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-merge-idents/-/postcss-merge-idents-2.1.7.tgz"
     },
     "postcss-merge-longhand": {
       "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/postcss-merge-longhand/-/postcss-merge-longhand-2.0.2.tgz",
-      "integrity": "sha1-I9kM0Sewp3mUkVMyc5A0oaTz1lg="
+      "from": "postcss-merge-longhand@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-merge-longhand/-/postcss-merge-longhand-2.0.2.tgz"
     },
     "postcss-merge-rules": {
       "version": "2.1.2",
+      "from": "postcss-merge-rules@>=2.0.3 <3.0.0",
       "resolved": "https://registry.npmjs.org/postcss-merge-rules/-/postcss-merge-rules-2.1.2.tgz",
-      "integrity": "sha1-0d9d+qexrMO+VT8OnhDofGG19yE=",
       "dependencies": {
         "browserslist": {
           "version": "1.7.7",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
-          "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk="
+          "from": "browserslist@>=1.5.2 <2.0.0",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz"
         }
       }
     },
     "postcss-message-helpers": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-message-helpers/-/postcss-message-helpers-2.0.0.tgz",
-      "integrity": "sha1-pPL0+rbk/gAvCu0ABHjN9S+bpg4="
+      "from": "postcss-message-helpers@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-message-helpers/-/postcss-message-helpers-2.0.0.tgz"
     },
     "postcss-minify-font-values": {
       "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/postcss-minify-font-values/-/postcss-minify-font-values-1.0.5.tgz",
-      "integrity": "sha1-S1jttWZB66fIR0qzUmyv17vey2k="
+      "from": "postcss-minify-font-values@>=1.0.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-minify-font-values/-/postcss-minify-font-values-1.0.5.tgz"
     },
     "postcss-minify-gradients": {
       "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/postcss-minify-gradients/-/postcss-minify-gradients-1.0.5.tgz",
-      "integrity": "sha1-Xb2hE3NwP4PPtKPqOIHY11/15uE="
+      "from": "postcss-minify-gradients@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-minify-gradients/-/postcss-minify-gradients-1.0.5.tgz"
     },
     "postcss-minify-params": {
       "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/postcss-minify-params/-/postcss-minify-params-1.2.2.tgz",
-      "integrity": "sha1-rSzgcTc7lDs9kwo/pZo1jCjW8fM="
+      "from": "postcss-minify-params@>=1.0.4 <2.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-minify-params/-/postcss-minify-params-1.2.2.tgz"
     },
     "postcss-minify-selectors": {
       "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/postcss-minify-selectors/-/postcss-minify-selectors-2.1.1.tgz",
-      "integrity": "sha1-ssapjAByz5G5MtGkllCBFDEXNb8="
+      "from": "postcss-minify-selectors@>=2.0.4 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-minify-selectors/-/postcss-minify-selectors-2.1.1.tgz"
     },
     "postcss-modules": {
       "version": "0.5.2",
-      "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.5.2.tgz",
-      "integrity": "sha1-nWgv7T8oK9ZLKqT+tvIqKvQ1/9o="
+      "from": "postcss-modules@>=0.5.0 <0.6.0",
+      "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.5.2.tgz"
     },
     "postcss-modules-extract-imports": {
       "version": "1.1.0",
+      "from": "postcss-modules-extract-imports@1.1.0",
       "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-1.1.0.tgz",
-      "integrity": "sha1-thTJcgvmgW6u41+zpfqh26agXds=",
       "dependencies": {
         "postcss": {
           "version": "6.0.1",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
-          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
+          "from": "postcss@>=6.0.1 <7.0.0",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
         },
         "supports-color": {
           "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "from": "supports-color@>=3.2.3 <4.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
         }
       }
     },
     "postcss-modules-local-by-default": {
       "version": "1.2.0",
+      "from": "postcss-modules-local-by-default@1.2.0",
       "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-1.2.0.tgz",
-      "integrity": "sha1-99gMOYxaOT+nlkRmvRlQCn1hwGk=",
       "dependencies": {
         "postcss": {
           "version": "6.0.1",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
-          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
+          "from": "postcss@>=6.0.1 <7.0.0",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
         },
         "supports-color": {
           "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "from": "supports-color@>=3.2.3 <4.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
         }
       }
     },
     "postcss-modules-scope": {
       "version": "1.1.0",
+      "from": "postcss-modules-scope@1.1.0",
       "resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-1.1.0.tgz",
-      "integrity": "sha1-1upkmUx5+XtipytCb75gVqGUu5A=",
       "dependencies": {
         "postcss": {
           "version": "6.0.1",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
-          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
+          "from": "postcss@>=6.0.1 <7.0.0",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
         },
         "supports-color": {
           "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "from": "supports-color@>=3.2.3 <4.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
         }
       }
     },
     "postcss-modules-values": {
       "version": "1.3.0",
+      "from": "postcss-modules-values@1.3.0",
       "resolved": "https://registry.npmjs.org/postcss-modules-values/-/postcss-modules-values-1.3.0.tgz",
-      "integrity": "sha1-7P+p1+GSUYOJ9CrQ6D9yrsRW6iA=",
       "dependencies": {
         "postcss": {
           "version": "6.0.1",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
-          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
+          "from": "postcss@>=6.0.1 <7.0.0",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
         },
         "supports-color": {
           "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "from": "supports-color@>=3.2.3 <4.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
         }
       }
     },
     "postcss-normalize-charset": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/postcss-normalize-charset/-/postcss-normalize-charset-1.1.1.tgz",
-      "integrity": "sha1-757nEhLX/nWceO0WL2HtYrXLk/E="
+      "from": "postcss-normalize-charset@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-normalize-charset/-/postcss-normalize-charset-1.1.1.tgz"
     },
     "postcss-normalize-url": {
       "version": "3.0.8",
-      "resolved": "https://registry.npmjs.org/postcss-normalize-url/-/postcss-normalize-url-3.0.8.tgz",
-      "integrity": "sha1-EI90s/L82viRov+j6kWSJ5/HgiI="
+      "from": "postcss-normalize-url@>=3.0.7 <4.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-normalize-url/-/postcss-normalize-url-3.0.8.tgz"
     },
     "postcss-ordered-values": {
       "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/postcss-ordered-values/-/postcss-ordered-values-2.2.3.tgz",
-      "integrity": "sha1-7sbCpntsQSqNsgQud/6NpD+VwR0="
+      "from": "postcss-ordered-values@>=2.1.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-ordered-values/-/postcss-ordered-values-2.2.3.tgz"
     },
     "postcss-reduce-idents": {
       "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/postcss-reduce-idents/-/postcss-reduce-idents-2.4.0.tgz",
-      "integrity": "sha1-wsbSDMlYKE9qv75j92Cb9AkFmtM="
+      "from": "postcss-reduce-idents@>=2.2.2 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-reduce-idents/-/postcss-reduce-idents-2.4.0.tgz"
     },
     "postcss-reduce-initial": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/postcss-reduce-initial/-/postcss-reduce-initial-1.0.1.tgz",
-      "integrity": "sha1-aPgGlfBF0IJjqHmtJA343WT2ROo="
+      "from": "postcss-reduce-initial@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-reduce-initial/-/postcss-reduce-initial-1.0.1.tgz"
     },
     "postcss-reduce-transforms": {
       "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/postcss-reduce-transforms/-/postcss-reduce-transforms-1.0.4.tgz",
-      "integrity": "sha1-/3b02CEkN7McKYpC0uFEQCV3GuE="
+      "from": "postcss-reduce-transforms@>=1.0.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-reduce-transforms/-/postcss-reduce-transforms-1.0.4.tgz"
     },
     "postcss-selector-parser": {
       "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-2.2.3.tgz",
-      "integrity": "sha1-+UN3iGBsPJrO4W/+jYsWKX8nu5A="
+      "from": "postcss-selector-parser@>=2.2.2 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-2.2.3.tgz"
     },
     "postcss-svgo": {
       "version": "2.1.6",
-      "resolved": "https://registry.npmjs.org/postcss-svgo/-/postcss-svgo-2.1.6.tgz",
-      "integrity": "sha1-tt8YqmE7Zm4TPwittSGcJoSsEI0="
+      "from": "postcss-svgo@>=2.1.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-svgo/-/postcss-svgo-2.1.6.tgz"
     },
     "postcss-unique-selectors": {
       "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/postcss-unique-selectors/-/postcss-unique-selectors-2.0.2.tgz",
-      "integrity": "sha1-mB1X0p3csz57Hf4f1DuGSfkzyh0="
+      "from": "postcss-unique-selectors@>=2.0.2 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-unique-selectors/-/postcss-unique-selectors-2.0.2.tgz"
     },
     "postcss-value-parser": {
       "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-3.3.0.tgz",
-      "integrity": "sha1-h/OPnxj3dKSrTIojL1xc6IcqnRU="
+      "from": "postcss-value-parser@>=3.2.3 <4.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-3.3.0.tgz"
     },
     "postcss-zindex": {
       "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/postcss-zindex/-/postcss-zindex-2.2.0.tgz",
-      "integrity": "sha1-0hCd3AVbka9n/EyzsCWUZjnSryI="
+      "from": "postcss-zindex@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-zindex/-/postcss-zindex-2.2.0.tgz"
     },
     "prelude-ls": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.1.2.tgz",
-      "integrity": "sha1-IZMqVJ9eUv/ZqCf1cOBL5iqX2lQ="
+      "from": "prelude-ls@>=1.1.2 <1.2.0",
+      "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.1.2.tgz"
     },
     "prepend-http": {
       "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/prepend-http/-/prepend-http-1.0.4.tgz",
-      "integrity": "sha1-1PRWKwzjaW5BrFLQ4ALlemNdxtw="
+      "from": "prepend-http@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/prepend-http/-/prepend-http-1.0.4.tgz"
     },
     "preserve": {
       "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/preserve/-/preserve-0.2.0.tgz",
-      "integrity": "sha1-gV7R9uvGWSb4ZbMQwHE7yzMVzks="
+      "from": "preserve@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/preserve/-/preserve-0.2.0.tgz"
     },
     "pretty-hrtime": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz",
-      "integrity": "sha1-t+PqQkNaTJsnWdmeDyAesZWALuE="
+      "from": "pretty-hrtime@>=1.0.2 <1.1.0",
+      "resolved": "https://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz"
     },
     "private": {
       "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/private/-/private-0.1.7.tgz",
-      "integrity": "sha1-aM5eih7woju1cMwoU3tTMqumPvE="
+      "from": "private@>=0.1.5 <0.2.0",
+      "resolved": "https://registry.npmjs.org/private/-/private-0.1.7.tgz"
     },
     "process": {
       "version": "0.11.10",
-      "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
-      "integrity": "sha1-czIwDoQBYb2j5podHZGn1LwW8YI="
+      "from": "process@>=0.11.0 <0.12.0",
+      "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz"
     },
     "process-nextick-args": {
       "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz",
-      "integrity": "sha1-FQ4gt1ZZCtP5EJPyWk8q2L/zC6M="
+      "from": "process-nextick-args@>=1.0.6 <1.1.0",
+      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz"
     },
     "progress": {
       "version": "1.1.8",
-      "resolved": "https://registry.npmjs.org/progress/-/progress-1.1.8.tgz",
-      "integrity": "sha1-4mDHj2Fhzdmw5WzD4Khd4Xx6V74="
+      "from": "progress@>=1.1.8 <1.2.0",
+      "resolved": "https://registry.npmjs.org/progress/-/progress-1.1.8.tgz"
     },
     "promise": {
       "version": "7.1.1",
-      "resolved": "https://registry.npmjs.org/promise/-/promise-7.1.1.tgz",
-      "integrity": "sha1-SJZUxpJha4qlWwck+oCbt9tJxb8="
+      "from": "promise@>=7.0.3 <8.0.0",
+      "resolved": "https://registry.npmjs.org/promise/-/promise-7.1.1.tgz"
     },
     "prop-types": {
       "version": "15.5.10",
+      "from": "prop-types@>=15.5.10 <16.0.0",
       "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.5.10.tgz",
-      "integrity": "sha1-J5ffwxJhguOpXj37suiT3ddFYVQ=",
       "dependencies": {
         "core-js": {
           "version": "1.2.7",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
-          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
+          "from": "core-js@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
         },
         "fbjs": {
           "version": "0.8.12",
-          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz",
-          "integrity": "sha1-ELXZL3bUVXX9Y6IX1OoCvqL47QQ="
+          "from": "fbjs@>=0.8.9 <0.9.0",
+          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz"
         }
       }
     },
     "proxy-addr": {
       "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-1.1.4.tgz",
-      "integrity": "sha1-J+VF9pYKRKYn2bREZ+NcG2tM4vM="
+      "from": "proxy-addr@>=1.1.3 <1.2.0",
+      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-1.1.4.tgz"
     },
     "prr": {
       "version": "0.0.0",
-      "resolved": "https://registry.npmjs.org/prr/-/prr-0.0.0.tgz",
-      "integrity": "sha1-GoS4WQgyVQFBGFPQCB7j+obikmo="
+      "from": "prr@>=0.0.0 <0.1.0",
+      "resolved": "https://registry.npmjs.org/prr/-/prr-0.0.0.tgz"
     },
     "pseudomap": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/pseudomap/-/pseudomap-1.0.2.tgz",
-      "integrity": "sha1-8FKijacOYYkX7wqKw0wa5aaChrM="
+      "from": "pseudomap@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/pseudomap/-/pseudomap-1.0.2.tgz"
     },
     "public-encrypt": {
       "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/public-encrypt/-/public-encrypt-4.0.0.tgz",
-      "integrity": "sha1-OfaZ86RlYN1eusvKaTyvfGXBjMY="
+      "from": "public-encrypt@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/public-encrypt/-/public-encrypt-4.0.0.tgz"
     },
     "punycode": {
       "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
-      "integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4="
+      "from": "punycode@>=1.4.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz"
     },
     "q": {
       "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/q/-/q-1.5.0.tgz",
-      "integrity": "sha1-3QG6ydBtMObyGa7LglPunr3DCPE="
+      "from": "q@>=1.1.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/q/-/q-1.5.0.tgz"
     },
     "qs": {
       "version": "6.4.0",
-      "resolved": "https://registry.npmjs.org/qs/-/qs-6.4.0.tgz",
-      "integrity": "sha1-E+JtKK1rD/qpExLNO/cI7TUecjM="
+      "from": "qs@>=6.4.0 <6.5.0",
+      "resolved": "https://registry.npmjs.org/qs/-/qs-6.4.0.tgz"
     },
     "query-string": {
       "version": "4.3.4",
-      "resolved": "https://registry.npmjs.org/query-string/-/query-string-4.3.4.tgz",
-      "integrity": "sha1-u7aTucqRXCMlFbIosaArYJBD2+s="
+      "from": "query-string@>=4.1.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/query-string/-/query-string-4.3.4.tgz"
     },
     "querystring": {
       "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/querystring/-/querystring-0.2.0.tgz",
-      "integrity": "sha1-sgmEkgO7Jd+CDadW50cAWHhSFiA="
+      "from": "querystring@0.2.0",
+      "resolved": "https://registry.npmjs.org/querystring/-/querystring-0.2.0.tgz"
     },
     "querystring-es3": {
       "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/querystring-es3/-/querystring-es3-0.2.1.tgz",
-      "integrity": "sha1-nsYfeQSYdXB9aUFFlv2Qek1xHnM="
+      "from": "querystring-es3@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/querystring-es3/-/querystring-es3-0.2.1.tgz"
     },
     "querystringify": {
       "version": "0.0.4",
-      "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-0.0.4.tgz",
-      "integrity": "sha1-DPf4T5Rj/wrlHExLFC2VvjdyTZw="
+      "from": "querystringify@>=0.0.0 <0.1.0",
+      "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-0.0.4.tgz"
     },
     "random-bytes": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/random-bytes/-/random-bytes-1.0.0.tgz",
-      "integrity": "sha1-T2ih3Arli9P7lYSMMDJNt11kNgs="
+      "from": "random-bytes@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/random-bytes/-/random-bytes-1.0.0.tgz"
     },
     "randomatic": {
       "version": "1.1.6",
-      "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-1.1.6.tgz",
-      "integrity": "sha1-EQ3Kv/OX6dz/fAeJzMCkmt8exbs="
+      "from": "randomatic@>=1.1.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-1.1.6.tgz"
     },
     "randombytes": {
       "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.0.3.tgz",
-      "integrity": "sha1-Z0yZdgkBw8QRJ3GjHlIdw0nMCew="
+      "from": "randombytes@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.0.3.tgz"
     },
     "range-parser": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.0.tgz",
-      "integrity": "sha1-9JvmtIeJTdxA3MlKMi9hEJLgDV4="
+      "from": "range-parser@>=1.0.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.0.tgz"
     },
     "raw-body": {
       "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.2.0.tgz",
-      "integrity": "sha1-mUl2z2pQlqQRYoQEkvC9xdbn+5Y="
+      "from": "raw-body@>=2.2.0 <2.3.0",
+      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.2.0.tgz"
     },
     "raw-loader": {
       "version": "0.5.1",
-      "resolved": "https://registry.npmjs.org/raw-loader/-/raw-loader-0.5.1.tgz",
-      "integrity": "sha1-DD0L6u2KAclm2Xh793goElKpeao="
+      "from": "raw-loader@>=0.5.1 <0.6.0",
+      "resolved": "https://registry.npmjs.org/raw-loader/-/raw-loader-0.5.1.tgz"
     },
     "rc": {
       "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/rc/-/rc-1.2.1.tgz",
-      "integrity": "sha1-LgPo5C7kULjLPc5lvhv4l04d/ZU="
+      "from": "rc@>=1.1.6 <2.0.0",
+      "resolved": "https://registry.npmjs.org/rc/-/rc-1.2.1.tgz"
     },
     "react": {
       "version": "15.4.2",
+      "from": "react@15.4.2",
       "resolved": "https://registry.npmjs.org/react/-/react-15.4.2.tgz",
-      "integrity": "sha1-QfeZGyYYU5K6m66WyIiefgGDl+8=",
       "dependencies": {
         "core-js": {
           "version": "1.2.7",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
-          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
+          "from": "core-js@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
         },
         "fbjs": {
           "version": "0.8.12",
-          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz",
-          "integrity": "sha1-ELXZL3bUVXX9Y6IX1OoCvqL47QQ="
+          "from": "fbjs@>=0.8.4 <0.9.0",
+          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz"
         }
       }
     },
     "react-addons-test-utils": {
       "version": "15.4.2",
+      "from": "react-addons-test-utils@15.4.2",
       "resolved": "https://registry.npmjs.org/react-addons-test-utils/-/react-addons-test-utils-15.4.2.tgz",
-      "integrity": "sha1-k7yqcY/K5zYNQuj7HAl1bMNjAqI=",
       "dependencies": {
         "core-js": {
           "version": "1.2.7",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
-          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
+          "from": "core-js@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
         },
         "fbjs": {
           "version": "0.8.12",
-          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz",
-          "integrity": "sha1-ELXZL3bUVXX9Y6IX1OoCvqL47QQ="
+          "from": "fbjs@>=0.8.4 <0.9.0",
+          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz"
         }
       }
     },
     "react-dom": {
       "version": "15.4.2",
+      "from": "react-dom@15.4.2",
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-15.4.2.tgz",
-      "integrity": "sha1-AVNj8FsKH9Uq6e/dOgBg2QaVII8=",
       "dependencies": {
         "core-js": {
           "version": "1.2.7",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
-          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
+          "from": "core-js@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
         },
         "fbjs": {
           "version": "0.8.12",
-          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz",
-          "integrity": "sha1-ELXZL3bUVXX9Y6IX1OoCvqL47QQ="
+          "from": "fbjs@>=0.8.1 <0.9.0",
+          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz"
         }
       }
     },
     "react-highlight": {
       "version": "0.9.0",
-      "resolved": "https://registry.npmjs.org/react-highlight/-/react-highlight-0.9.0.tgz",
-      "integrity": "sha1-1e3udEzLhon3k4eUtqG1VLsVDrc="
+      "from": "react-highlight@0.9.0",
+      "resolved": "https://registry.npmjs.org/react-highlight/-/react-highlight-0.9.0.tgz"
     },
     "read": {
       "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/read/-/read-1.0.7.tgz",
-      "integrity": "sha1-s9oZvQUkMal2cdRKQmNK33ELQMQ="
+      "from": "read@>=1.0.3 <1.1.0",
+      "resolved": "https://registry.npmjs.org/read/-/read-1.0.7.tgz"
     },
     "read-all-stream": {
       "version": "3.1.0",
+      "from": "read-all-stream@>=3.0.0 <4.0.0",
       "resolved": "https://registry.npmjs.org/read-all-stream/-/read-all-stream-3.1.0.tgz",
-      "integrity": "sha1-NcPhd/IHjveJ7kv6+kNzB06u9Po=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
     "read-pkg": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
-      "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg="
+      "from": "read-pkg@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz"
     },
     "read-pkg-up": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
-      "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI="
+      "from": "read-pkg-up@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz"
     },
     "readable-stream": {
       "version": "1.1.14",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
-      "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk="
+      "from": "readable-stream@>=1.1.9 <1.2.0",
+      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz"
     },
     "readdirp": {
       "version": "2.1.0",
+      "from": "readdirp@>=2.0.0 <3.0.0",
       "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-2.1.0.tgz",
-      "integrity": "sha1-TtCtBg3zBzMAxIRANz9y0cxkLXg=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.0.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
     "readline2": {
       "version": "1.0.1",
+      "from": "readline2@>=1.0.1 <2.0.0",
       "resolved": "https://registry.npmjs.org/readline2/-/readline2-1.0.1.tgz",
-      "integrity": "sha1-QQWWCP/BVHV7cV2ZidGZ/783LjU=",
       "dependencies": {
         "mute-stream": {
           "version": "0.0.5",
-          "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.5.tgz",
-          "integrity": "sha1-j7+rsKmKJT0xhDMfno3rc3L6xsA="
+          "from": "mute-stream@0.0.5",
+          "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.5.tgz"
         }
       }
     },
     "recast": {
       "version": "0.11.23",
-      "resolved": "https://registry.npmjs.org/recast/-/recast-0.11.23.tgz",
-      "integrity": "sha1-RR/TAEqx5N+bTktmN2sqIZEkYtM="
+      "from": "recast@>=0.11.12 <0.12.0",
+      "resolved": "https://registry.npmjs.org/recast/-/recast-0.11.23.tgz"
     },
     "rechoir": {
       "version": "0.6.2",
-      "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz",
-      "integrity": "sha1-hSBLVNuoLVdC4oyWdW70OvUOM4Q="
+      "from": "rechoir@>=0.6.2 <0.7.0",
+      "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz"
     },
     "redent": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/redent/-/redent-1.0.0.tgz",
-      "integrity": "sha1-z5Fqsf1fHxbfsggi3W7H9zDCr94="
+      "from": "redent@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/redent/-/redent-1.0.0.tgz"
     },
     "redeyed": {
       "version": "1.0.1",
+      "from": "redeyed@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/redeyed/-/redeyed-1.0.1.tgz",
-      "integrity": "sha1-6WwZO0DAgWsArshCaY5hGF5VSYo=",
       "dependencies": {
         "esprima": {
           "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.0.0.tgz",
-          "integrity": "sha1-U88kes2ncxPlUcOqLnM0LT+099k="
+          "from": "esprima@>=3.0.0 <3.1.0",
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.0.0.tgz"
         }
       }
     },
     "reduce-css-calc": {
       "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/reduce-css-calc/-/reduce-css-calc-1.3.0.tgz",
-      "integrity": "sha1-dHyRTgSWFKTJz7umKYca0dKSdxY="
+      "from": "reduce-css-calc@>=1.2.6 <2.0.0",
+      "resolved": "https://registry.npmjs.org/reduce-css-calc/-/reduce-css-calc-1.3.0.tgz"
     },
     "reduce-function-call": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/reduce-function-call/-/reduce-function-call-1.0.2.tgz",
-      "integrity": "sha1-WiAL+S4ON3UXUv5FsKszD9S2vpk="
+      "from": "reduce-function-call@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/reduce-function-call/-/reduce-function-call-1.0.2.tgz"
     },
     "regenerate": {
       "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.3.2.tgz",
-      "integrity": "sha1-0ZQcZ7rUN+G+dkM63Vs4X5WxkmA="
+      "from": "regenerate@>=1.2.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.3.2.tgz"
     },
     "regenerator-runtime": {
       "version": "0.10.5",
-      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz",
-      "integrity": "sha1-M2w+/BIgrc7dosn6tntaeVWjNlg="
+      "from": "regenerator-runtime@>=0.10.0 <0.11.0",
+      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz"
     },
     "regex-cache": {
       "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.3.tgz",
-      "integrity": "sha1-mxpsNdTQ3871cRrmUejp09cRQUU="
+      "from": "regex-cache@>=0.4.2 <0.5.0",
+      "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.3.tgz"
     },
     "regexpu-core": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-1.0.0.tgz",
-      "integrity": "sha1-hqdj9Y7k18L2sQLkdkBQ3n7ZDGs="
+      "from": "regexpu-core@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-1.0.0.tgz"
     },
     "registry-auth-token": {
       "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/registry-auth-token/-/registry-auth-token-3.3.1.tgz",
-      "integrity": "sha1-+w0yie4Nmtosu1KvXf5mywcNMAY="
+      "from": "registry-auth-token@>=3.0.1 <4.0.0",
+      "resolved": "https://registry.npmjs.org/registry-auth-token/-/registry-auth-token-3.3.1.tgz"
     },
     "registry-url": {
       "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/registry-url/-/registry-url-3.1.0.tgz",
-      "integrity": "sha1-PU74cPc93h138M+aOBQyRE4XSUI="
+      "from": "registry-url@>=3.0.3 <4.0.0",
+      "resolved": "https://registry.npmjs.org/registry-url/-/registry-url-3.1.0.tgz"
     },
     "regjsgen": {
       "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.2.0.tgz",
-      "integrity": "sha1-bAFq3qxVT3WCP+N6wFuS1aTtsfc="
+      "from": "regjsgen@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.2.0.tgz"
     },
     "regjsparser": {
       "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz",
-      "integrity": "sha1-fuj4Tcb6eS0/0K4ijSS9lJ6tIFw="
+      "from": "regjsparser@>=0.1.4 <0.2.0",
+      "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz"
     },
     "relateurl": {
       "version": "0.2.7",
-      "resolved": "https://registry.npmjs.org/relateurl/-/relateurl-0.2.7.tgz",
-      "integrity": "sha1-VNvzd+UUQKypCkzSdGANP/LYiKk="
+      "from": "relateurl@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/relateurl/-/relateurl-0.2.7.tgz"
     },
     "remove-trailing-separator": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.0.1.tgz",
-      "integrity": "sha1-YV67lq9VlVLUv0BXyENtSGq2PMQ="
+      "from": "remove-trailing-separator@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.0.1.tgz"
     },
     "repeat-element": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/repeat-element/-/repeat-element-1.1.2.tgz",
-      "integrity": "sha1-7wiaF40Ug7quTZPrmLT55OEdmQo="
+      "from": "repeat-element@>=1.1.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/repeat-element/-/repeat-element-1.1.2.tgz"
     },
     "repeat-string": {
       "version": "1.6.1",
-      "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-1.6.1.tgz",
-      "integrity": "sha1-jcrkcOHIirwtYA//Sndihtp15jc="
+      "from": "repeat-string@>=1.5.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-1.6.1.tgz"
     },
     "repeating": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/repeating/-/repeating-2.0.1.tgz",
-      "integrity": "sha1-UhTFOpJtNVJwdSf7q0FdvAjQbdo="
+      "from": "repeating@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/repeating/-/repeating-2.0.1.tgz"
     },
     "replace-ext": {
       "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-0.0.1.tgz",
-      "integrity": "sha1-KbvZIHinOfC8zitO5B6DeVNSKSQ="
+      "from": "replace-ext@0.0.1",
+      "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-0.0.1.tgz"
     },
     "replacestream": {
       "version": "4.0.2",
+      "from": "replacestream@>=4.0.0 <5.0.0",
       "resolved": "https://registry.npmjs.org/replacestream/-/replacestream-4.0.2.tgz",
-      "integrity": "sha1-DEFAcH5PAyP1DeBEhRcIz1i8N70=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.0.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
     "request": {
       "version": "2.81.0",
-      "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz",
-      "integrity": "sha1-xpKJRqDgbF+Nb4qTM0af/aRimKA="
+      "from": "request@>=2.81.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz"
     },
     "request-progress": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/request-progress/-/request-progress-2.0.1.tgz",
-      "integrity": "sha1-XTa7V5YcZzqlt4jbyBQf3yO0Tgg="
+      "from": "request-progress@>=2.0.1 <2.1.0",
+      "resolved": "https://registry.npmjs.org/request-progress/-/request-progress-2.0.1.tgz"
     },
     "require-directory": {
       "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
-      "integrity": "sha1-jGStX9MNqxyXbiNE/+f3kqam30I="
+      "from": "require-directory@>=2.1.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz"
     },
     "require-from-string": {
       "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-1.2.1.tgz",
-      "integrity": "sha1-UpyczvJzgK3+yaL5ZbZJu+5jZBg="
+      "from": "require-from-string@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-1.2.1.tgz"
     },
     "require-main-filename": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-1.0.1.tgz",
-      "integrity": "sha1-l/cXtp1IeE9fUmpsWqj/3aBVpNE="
+      "from": "require-main-filename@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-1.0.1.tgz"
     },
     "requires-port": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
-      "integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8="
+      "from": "requires-port@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz"
     },
     "resemblejs": {
       "version": "2.2.4",
-      "resolved": "https://registry.npmjs.org/resemblejs/-/resemblejs-2.2.4.tgz",
-      "integrity": "sha1-g1JeKtt333fIrQhqGyUQ8DJ2DAg="
+      "from": "resemblejs@>=2.2.3 <2.3.0",
+      "resolved": "https://registry.npmjs.org/resemblejs/-/resemblejs-2.2.4.tgz"
     },
     "resolve": {
       "version": "1.3.3",
-      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.3.3.tgz",
-      "integrity": "sha1-ZVkHw0aahoDcLeOidaj91paR8OU="
+      "from": "resolve@>=1.1.7 <2.0.0",
+      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.3.3.tgz"
     },
     "resolve-dir": {
       "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/resolve-dir/-/resolve-dir-0.1.1.tgz",
-      "integrity": "sha1-shklmlYC+sXFxJatiUpujMQwJh4="
+      "from": "resolve-dir@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/resolve-dir/-/resolve-dir-0.1.1.tgz"
     },
     "response-time": {
       "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/response-time/-/response-time-2.3.2.tgz",
-      "integrity": "sha1-/6cbq5UtYvfB1Jt0NDVfvGjf/Fo="
+      "from": "response-time@>=2.3.1 <2.4.0",
+      "resolved": "https://registry.npmjs.org/response-time/-/response-time-2.3.2.tgz"
     },
     "restore-cursor": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-1.0.1.tgz",
-      "integrity": "sha1-NGYfRohjJ/7SmRR5FSJS35LapUE="
+      "from": "restore-cursor@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-1.0.1.tgz"
     },
     "right-align": {
       "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/right-align/-/right-align-0.1.3.tgz",
-      "integrity": "sha1-YTObci/mo1FWiSENJOFMlhSGE+8="
+      "from": "right-align@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/right-align/-/right-align-0.1.3.tgz"
     },
     "rimraf": {
       "version": "2.6.1",
-      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.1.tgz",
-      "integrity": "sha1-wjOOxkPfeht/5cVPqG9XQopV8z0="
+      "from": "rimraf@>=2.2.8 <3.0.0",
+      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.1.tgz"
     },
     "ripemd160": {
       "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-0.2.0.tgz",
-      "integrity": "sha1-K/GYveFnys+lHAqSjoS2i74XH84="
+      "from": "ripemd160@0.2.0",
+      "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-0.2.0.tgz"
     },
     "rndm": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/rndm/-/rndm-1.2.0.tgz",
-      "integrity": "sha1-8z/pz7Urv9UgqhgyO8ZdsRCht2w="
+      "from": "rndm@1.2.0",
+      "resolved": "https://registry.npmjs.org/rndm/-/rndm-1.2.0.tgz"
     },
     "rtl-css-js": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.1.0.tgz",
-      "integrity": "sha1-c5qMN9k+xt2safWtRVZWxgQ9b5U="
+      "from": "rtl-css-js@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.1.0.tgz"
     },
     "run-async": {
       "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/run-async/-/run-async-0.1.0.tgz",
-      "integrity": "sha1-yK1KXhEGYeQCp9IbUw4AnyX444k="
+      "from": "run-async@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/run-async/-/run-async-0.1.0.tgz"
     },
     "rx-lite": {
       "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/rx-lite/-/rx-lite-3.1.2.tgz",
-      "integrity": "sha1-Gc5QLKVyZl87ZHsQk5+X/RYV8QI="
+      "from": "rx-lite@>=3.1.2 <4.0.0",
+      "resolved": "https://registry.npmjs.org/rx-lite/-/rx-lite-3.1.2.tgz"
     },
     "safe-buffer": {
       "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-      "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+      "from": "safe-buffer@>=5.0.1 <6.0.0",
+      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz"
     },
     "samsam": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.1.2.tgz",
-      "integrity": "sha1-vsEf3IOp/aBjQBIQ5AF2wwJNFWc="
+      "from": "samsam@1.1.2",
+      "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.1.2.tgz"
     },
     "sass-graph": {
       "version": "2.2.4",
+      "from": "sass-graph@>=2.1.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/sass-graph/-/sass-graph-2.2.4.tgz",
-      "integrity": "sha1-E/vWPNHK8JCLn9k0dq1DpR0eC0k=",
       "dependencies": {
         "camelcase": {
           "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
-          "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
+          "from": "camelcase@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
         },
         "yargs": {
           "version": "7.1.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-7.1.0.tgz",
-          "integrity": "sha1-a6MY6xaWFyf10oT46gA+jWFU0Mg="
+          "from": "yargs@>=7.0.0 <8.0.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-7.1.0.tgz"
         },
         "yargs-parser": {
           "version": "5.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-5.0.0.tgz",
-          "integrity": "sha1-J17PDX/+Bcd+ZOfIbkzZS/DhIoo="
+          "from": "yargs-parser@>=5.0.0 <6.0.0",
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-5.0.0.tgz"
         }
       }
     },
     "sass-loader": {
       "version": "6.0.5",
+      "from": "sass-loader@>=6.0.3 <7.0.0",
       "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-6.0.5.tgz",
-      "integrity": "sha1-qEeRDzZEKqVsWYWHnVTrUZ4koyg=",
       "dependencies": {
         "async": {
           "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
-          "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c="
+          "from": "async@>=2.1.5 <3.0.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
         },
         "loader-utils": {
           "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
-          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
+          "from": "loader-utils@>=1.0.1 <2.0.0",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
         }
       }
     },
     "sax": {
       "version": "0.5.2",
-      "resolved": "https://registry.npmjs.org/sax/-/sax-0.5.2.tgz",
-      "integrity": "sha1-c1/6o5oc/4/7lZjwIjq9sDqfsuo="
+      "from": "sax@0.5.2",
+      "resolved": "https://registry.npmjs.org/sax/-/sax-0.5.2.tgz"
     },
     "script-loader": {
       "version": "0.7.0",
-      "resolved": "https://registry.npmjs.org/script-loader/-/script-loader-0.7.0.tgz",
-      "integrity": "sha1-aF3H5waeDe56kmdPDrxbD1W6pew="
+      "from": "script-loader@>=0.7.0 <0.8.0",
+      "resolved": "https://registry.npmjs.org/script-loader/-/script-loader-0.7.0.tgz"
     },
     "scss-tokenizer": {
       "version": "0.2.3",
+      "from": "scss-tokenizer@>=0.2.3 <0.3.0",
       "resolved": "https://registry.npmjs.org/scss-tokenizer/-/scss-tokenizer-0.2.3.tgz",
-      "integrity": "sha1-jrBtualyMzOCTT9VMGQRSYR85dE=",
       "dependencies": {
         "source-map": {
           "version": "0.4.4",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
-          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s="
+          "from": "source-map@>=0.4.2 <0.5.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz"
         }
       }
     },
     "select-hose": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz",
-      "integrity": "sha1-Yl2GWPhlr0Psliv8N2o3NZpJlMo="
+      "from": "select-hose@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz"
     },
     "semver": {
       "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz",
-      "integrity": "sha1-myzl094C0XxgEq0yaqa00M9U+U8="
+      "from": "semver@>=5.3.0 <5.4.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz"
     },
     "semver-diff": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/semver-diff/-/semver-diff-2.1.0.tgz",
-      "integrity": "sha1-S7uEN8jTfksM8aaP1ybsbWRdbTY="
+      "from": "semver-diff@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/semver-diff/-/semver-diff-2.1.0.tgz"
     },
     "send": {
       "version": "0.14.2",
+      "from": "send@0.14.2",
       "resolved": "https://registry.npmjs.org/send/-/send-0.14.2.tgz",
-      "integrity": "sha1-ObBDiz9RC+Xcb2Z6EfcWiTaM3u8=",
       "dependencies": {
         "debug": {
           "version": "2.2.0",
+          "from": "debug@>=2.2.0 <2.3.0",
           "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo=",
           "dependencies": {
             "ms": {
               "version": "0.7.1",
-              "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-              "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+              "from": "ms@0.7.1",
+              "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
             }
           }
         },
         "http-errors": {
           "version": "1.5.1",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.5.1.tgz",
-          "integrity": "sha1-eIwNLB3iyBuebowBhDtrl+uSB1A="
+          "from": "http-errors@>=1.5.1 <1.6.0",
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.5.1.tgz"
         },
         "mime": {
           "version": "1.3.4",
-          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz",
-          "integrity": "sha1-EV+eO2s9rylZmDyzjxSaLUDrXVM="
+          "from": "mime@1.3.4",
+          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz"
         },
         "ms": {
           "version": "0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
-          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
         },
         "setprototypeof": {
           "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.0.2.tgz",
-          "integrity": "sha1-gaVSFB7BBLiOic44MQOtXGZWTQg="
+          "from": "setprototypeof@1.0.2",
+          "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.0.2.tgz"
         }
       }
     },
     "sequencify": {
       "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/sequencify/-/sequencify-0.0.7.tgz",
-      "integrity": "sha1-kM/xnQLgcCf9dn9erT57ldHnOAw="
+      "from": "sequencify@>=0.0.7 <0.1.0",
+      "resolved": "https://registry.npmjs.org/sequencify/-/sequencify-0.0.7.tgz"
     },
     "serve-favicon": {
       "version": "2.3.2",
+      "from": "serve-favicon@>=2.3.0 <2.4.0",
       "resolved": "https://registry.npmjs.org/serve-favicon/-/serve-favicon-2.3.2.tgz",
-      "integrity": "sha1-3UGeJo3gEqtysxnTN/IQUBP5OB8=",
       "dependencies": {
         "ms": {
           "version": "0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
-          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
         }
       }
     },
     "serve-index": {
       "version": "1.7.3",
+      "from": "serve-index@>=1.7.2 <1.8.0",
       "resolved": "https://registry.npmjs.org/serve-index/-/serve-index-1.7.3.tgz",
-      "integrity": "sha1-egV/xu4o3GP2RWbl+lexEahq7NI=",
       "dependencies": {
         "accepts": {
           "version": "1.2.13",
-          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.2.13.tgz",
-          "integrity": "sha1-5fHzkoxtlf2WVYw27D2dDeSm7Oo="
+          "from": "accepts@>=1.2.13 <1.3.0",
+          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.2.13.tgz"
         },
         "debug": {
           "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
+          "from": "debug@>=2.2.0 <2.3.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
         },
         "http-errors": {
           "version": "1.3.1",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
-          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
+          "from": "http-errors@>=1.3.1 <1.4.0",
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
         },
         "ms": {
           "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+          "from": "ms@0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
         },
         "negotiator": {
           "version": "0.5.3",
-          "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.5.3.tgz",
-          "integrity": "sha1-Jp1cR2gQ7JLtvntsLygxY4T5p+g="
+          "from": "negotiator@0.5.3",
+          "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.5.3.tgz"
         }
       }
     },
     "serve-static": {
       "version": "1.11.2",
-      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.11.2.tgz",
-      "integrity": "sha1-LPmIm9RDWjIMw2iVyapXvWYuasc="
+      "from": "serve-static@>=1.11.2 <1.12.0",
+      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.11.2.tgz"
     },
     "set-blocking": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
-      "integrity": "sha1-BF+XgtARrppoA93TgrJDkrPYkPc="
+      "from": "set-blocking@>=2.0.0 <2.1.0",
+      "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz"
     },
     "set-immediate-shim": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/set-immediate-shim/-/set-immediate-shim-1.0.1.tgz",
-      "integrity": "sha1-SysbJ+uAip+NzEgaWOXlb1mfP2E="
+      "from": "set-immediate-shim@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/set-immediate-shim/-/set-immediate-shim-1.0.1.tgz"
     },
     "setimmediate": {
       "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/setimmediate/-/setimmediate-1.0.5.tgz",
-      "integrity": "sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU="
+      "from": "setimmediate@>=1.0.4 <2.0.0",
+      "resolved": "https://registry.npmjs.org/setimmediate/-/setimmediate-1.0.5.tgz"
     },
     "setprototypeof": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.0.3.tgz",
-      "integrity": "sha1-ZlZ+NwQ+608E2RvWWMDL77VbjgQ="
+      "from": "setprototypeof@1.0.3",
+      "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.0.3.tgz"
     },
     "sha.js": {
       "version": "2.2.6",
-      "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.2.6.tgz",
-      "integrity": "sha1-F93t3F9yL7ZlAWWIlUYZd4ZzFbo="
+      "from": "sha.js@2.2.6",
+      "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.2.6.tgz"
     },
     "shallow-clone": {
       "version": "0.1.2",
+      "from": "shallow-clone@>=0.1.2 <0.2.0",
       "resolved": "https://registry.npmjs.org/shallow-clone/-/shallow-clone-0.1.2.tgz",
-      "integrity": "sha1-WQnodLp3EG1zrEFM/sH/yofZcGA=",
       "dependencies": {
         "kind-of": {
           "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-2.0.1.tgz",
-          "integrity": "sha1-AY7HpM5+OobLkUG+UZ0kyPqpgbU="
+          "from": "kind-of@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-2.0.1.tgz"
         },
         "lazy-cache": {
           "version": "0.2.7",
-          "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-0.2.7.tgz",
-          "integrity": "sha1-f+3fLctu23fRHvHRF6tf/fCrG2U="
+          "from": "lazy-cache@>=0.2.3 <0.3.0",
+          "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-0.2.7.tgz"
         }
       }
     },
     "shellwords": {
       "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/shellwords/-/shellwords-0.1.0.tgz",
-      "integrity": "sha1-Zq/Ue2oSky2Qccv9mKUueFzQuhQ="
+      "from": "shellwords@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/shellwords/-/shellwords-0.1.0.tgz"
     },
     "sigmund": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/sigmund/-/sigmund-1.0.1.tgz",
-      "integrity": "sha1-P/IfGYytIXX587eBhT/ZTQ0ZtZA="
+      "from": "sigmund@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/sigmund/-/sigmund-1.0.1.tgz"
     },
     "signal-exit": {
       "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.2.tgz",
-      "integrity": "sha1-tf3AjxKH6hF4Yo5BXiUTK3NkbG0="
+      "from": "signal-exit@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.2.tgz"
     },
     "sinon": {
       "version": "2.3.2",
+      "from": "sinon@2.3.2",
       "resolved": "https://registry.npmjs.org/sinon/-/sinon-2.3.2.tgz",
-      "integrity": "sha1-xDqcVw8yuqwRWVBc/u0ZEIhV34k=",
       "dependencies": {
         "formatio": {
           "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.2.0.tgz",
-          "integrity": "sha1-87IWfZBoxGmKjVH092CjmlTYGOs="
+          "from": "formatio@1.2.0",
+          "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.2.0.tgz"
         },
         "lolex": {
           "version": "1.6.0",
-          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
-          "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
+          "from": "lolex@>=1.6.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz"
         },
         "path-to-regexp": {
           "version": "1.7.0",
-          "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.7.0.tgz",
-          "integrity": "sha1-Wf3g9DW62suhA6hOnTvGTpa5k30="
+          "from": "path-to-regexp@>=1.7.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.7.0.tgz"
         },
         "samsam": {
           "version": "1.2.1",
-          "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.2.1.tgz",
-          "integrity": "sha1-7dOQk6MYQ3DLhZJDsr3yVefY6mc="
+          "from": "samsam@>=1.1.3 <2.0.0",
+          "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.2.1.tgz"
         },
         "type-detect": {
           "version": "4.0.3",
-          "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.0.3.tgz",
-          "integrity": "sha1-Dj8mcLRAmbC0bChNE2p+9Jx0wuo="
+          "from": "type-detect@>=4.0.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.0.3.tgz"
         }
       }
     },
     "sinon-chai": {
       "version": "2.10.0",
-      "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.10.0.tgz",
-      "integrity": "sha1-arMAi7jK6ZKedE12ZXS0zzXzS1s="
+      "from": "sinon-chai@2.10.0",
+      "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.10.0.tgz"
     },
     "sliced": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/sliced/-/sliced-1.0.1.tgz",
-      "integrity": "sha1-CzpmK10Ewxd7GSa+qCsD+Dei70E="
+      "from": "sliced@*",
+      "resolved": "https://registry.npmjs.org/sliced/-/sliced-1.0.1.tgz"
     },
     "slide": {
       "version": "1.1.6",
-      "resolved": "https://registry.npmjs.org/slide/-/slide-1.1.6.tgz",
-      "integrity": "sha1-VusCfWW00tzmyy4tMsTUr8nh1wc="
+      "from": "slide@>=1.1.5 <2.0.0",
+      "resolved": "https://registry.npmjs.org/slide/-/slide-1.1.6.tgz"
     },
     "sntp": {
       "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz",
-      "integrity": "sha1-ZUEYTMkK7qbG57NeJlkIJEPGYZg="
+      "from": "sntp@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz"
     },
     "socket.io": {
       "version": "1.7.4",
+      "from": "socket.io@>=1.4.5 <2.0.0",
       "resolved": "https://registry.npmjs.org/socket.io/-/socket.io-1.7.4.tgz",
-      "integrity": "sha1-L37O3DORvy1cc+KR/iM+bjTU3QA=",
       "dependencies": {
         "debug": {
           "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
-          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
+          "from": "debug@2.3.3",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz"
         },
         "ms": {
           "version": "0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
-          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
         },
         "object-assign": {
           "version": "4.1.0",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.0.tgz",
-          "integrity": "sha1-ejs9DpgGPUP0wD8uiubNUahog6A="
+          "from": "object-assign@4.1.0",
+          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.0.tgz"
         }
       }
     },
     "socket.io-adapter": {
       "version": "0.5.0",
+      "from": "socket.io-adapter@0.5.0",
       "resolved": "https://registry.npmjs.org/socket.io-adapter/-/socket.io-adapter-0.5.0.tgz",
-      "integrity": "sha1-y21LuL7IHhB4uZZ3+c7QBGBmu4s=",
       "dependencies": {
         "debug": {
           "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
-          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
+          "from": "debug@2.3.3",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz"
         },
         "ms": {
           "version": "0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
-          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
         }
       }
     },
     "socket.io-client": {
       "version": "1.7.4",
+      "from": "socket.io-client@1.7.4",
       "resolved": "https://registry.npmjs.org/socket.io-client/-/socket.io-client-1.7.4.tgz",
-      "integrity": "sha1-7J+CA1btme9tNX8HVtZIcXvdQoE=",
       "dependencies": {
         "component-emitter": {
           "version": "1.2.1",
-          "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz",
-          "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY="
+          "from": "component-emitter@1.2.1",
+          "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz"
         },
         "debug": {
           "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
-          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
+          "from": "debug@2.3.3",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz"
         },
         "ms": {
           "version": "0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
-          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
+          "from": "ms@0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
         }
       }
     },
     "socket.io-parser": {
       "version": "2.3.1",
+      "from": "socket.io-parser@2.3.1",
       "resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-2.3.1.tgz",
-      "integrity": "sha1-3VMgJRA85Clpcya+/WQAX8/ltKA=",
       "dependencies": {
         "debug": {
           "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
+          "from": "debug@2.2.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
         },
         "ms": {
           "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+          "from": "ms@0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
         }
       }
     },
     "sockjs": {
       "version": "0.3.18",
+      "from": "sockjs@0.3.18",
       "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.18.tgz",
-      "integrity": "sha1-2bKJMWyn33dZXvKZ4HXw+TfrQgc=",
       "dependencies": {
         "uuid": {
           "version": "2.0.3",
-          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz",
-          "integrity": "sha1-Z+LoY3lyFVMN/zGOW/nc6/1Hsho="
+          "from": "uuid@>=2.0.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz"
         }
       }
     },
     "sockjs-client": {
       "version": "1.1.2",
+      "from": "sockjs-client@1.1.2",
       "resolved": "https://registry.npmjs.org/sockjs-client/-/sockjs-client-1.1.2.tgz",
-      "integrity": "sha1-8CEqhVDkyUaMjM6u79LjSTwDOtU=",
       "dependencies": {
         "faye-websocket": {
           "version": "0.11.1",
-          "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.1.tgz",
-          "integrity": "sha1-8O/hjE9W5PQK/H4Gxxn9XuYYjzg="
+          "from": "faye-websocket@>=0.11.0 <0.12.0",
+          "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.1.tgz"
         }
       }
     },
     "sort-keys": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/sort-keys/-/sort-keys-1.1.2.tgz",
-      "integrity": "sha1-RBttTTRnmPG05J6JIK37oOVD+a0="
+      "from": "sort-keys@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/sort-keys/-/sort-keys-1.1.2.tgz"
     },
     "source-list-map": {
       "version": "0.1.8",
-      "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-0.1.8.tgz",
-      "integrity": "sha1-xVCyq1Qn9rPyH1r+rYjE9Vh7IQY="
+      "from": "source-list-map@>=0.1.7 <0.2.0",
+      "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-0.1.8.tgz"
     },
     "source-map": {
       "version": "0.5.6",
-      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz",
-      "integrity": "sha1-dc449SvwczxafwwRjYEzSiu19BI="
+      "from": "source-map@>=0.5.3 <0.6.0",
+      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
     },
     "source-map-loader": {
       "version": "0.1.6",
+      "from": "source-map-loader@>=0.1.5 <0.2.0",
       "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.1.6.tgz",
-      "integrity": "sha1-wJkD2m1zueU7ftjuUkVZcFHpjpE=",
       "dependencies": {
         "async": {
           "version": "0.9.2",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz",
-          "integrity": "sha1-rqdNXmHB+JlhO/ZL2mbUx48v0X0="
+          "from": "async@>=0.9.0 <0.10.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
         },
         "source-map": {
           "version": "0.1.43",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz",
-          "integrity": "sha1-wkvBRspRfBRx9drL4lcbK3+eM0Y="
+          "from": "source-map@>=0.1.33 <0.2.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
         }
       }
     },
     "sparkles": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/sparkles/-/sparkles-1.0.0.tgz",
-      "integrity": "sha1-Gsu/tZJDbRC76PeFt8xvgoFQEsM="
+      "from": "sparkles@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/sparkles/-/sparkles-1.0.0.tgz"
     },
     "spdx-correct": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-1.0.2.tgz",
-      "integrity": "sha1-SzBz2TP/UfORLwOsVRlJikFQ20A="
+      "from": "spdx-correct@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-1.0.2.tgz"
     },
     "spdx-expression-parse": {
       "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-1.0.4.tgz",
-      "integrity": "sha1-m98vIOH0DtRH++JzJmGR/O1RYmw="
+      "from": "spdx-expression-parse@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-1.0.4.tgz"
     },
     "spdx-license-ids": {
       "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-1.2.2.tgz",
-      "integrity": "sha1-yd96NCRZSt5r0RkA1ZZpbcBrrFc="
+      "from": "spdx-license-ids@>=1.0.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-1.2.2.tgz"
     },
     "spdy": {
       "version": "3.4.7",
+      "from": "spdy@>=3.4.1 <4.0.0",
       "resolved": "https://registry.npmjs.org/spdy/-/spdy-3.4.7.tgz",
-      "integrity": "sha1-Qv9B7OXMD5mjpsKKq7c/XDsDrLw=",
       "dependencies": {
         "debug": {
           "version": "2.6.8",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
-          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
+          "from": "debug@>=2.6.8 <3.0.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz"
         }
       }
     },
     "spdy-transport": {
       "version": "2.0.20",
+      "from": "spdy-transport@>=2.0.18 <3.0.0",
       "resolved": "https://registry.npmjs.org/spdy-transport/-/spdy-transport-2.0.20.tgz",
-      "integrity": "sha1-c15yBUxIayNU/onnAiVgBKOazk0=",
       "dependencies": {
         "debug": {
           "version": "2.6.8",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
-          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
+          "from": "debug@>=2.6.8 <3.0.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz"
         },
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.2.9 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
     "split": {
       "version": "0.2.10",
-      "resolved": "https://registry.npmjs.org/split/-/split-0.2.10.tgz",
-      "integrity": "sha1-Zwl8YB1pfOE2j0GPBs0gHPBSGlc="
+      "from": "split@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/split/-/split-0.2.10.tgz"
     },
     "sprintf-js": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.1.1.tgz",
-      "integrity": "sha1-Nr54Mgr+WAH2zqPueLblqrlA6gw="
+      "from": "sprintf-js@>=1.0.3 <2.0.0",
+      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.1.1.tgz"
     },
     "sshpk": {
       "version": "1.13.0",
+      "from": "sshpk@>=1.7.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.13.0.tgz",
-      "integrity": "sha1-/yo+T9BEl1Vf7Zezmg/YL6+zozw=",
       "dependencies": {
         "assert-plus": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
+          "from": "assert-plus@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz"
         }
       }
     },
     "statuses": {
       "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.3.1.tgz",
-      "integrity": "sha1-+vUbnrdKrvOzrPStX2Gr8ky3uT4="
+      "from": "statuses@>=1.3.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.3.1.tgz"
     },
     "stdout-stream": {
       "version": "1.4.0",
+      "from": "stdout-stream@>=1.4.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/stdout-stream/-/stdout-stream-1.4.0.tgz",
-      "integrity": "sha1-osfIWH5U2UJ+qe2zrD8s1SLfN4s=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
     "stream-browserify": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-1.0.0.tgz",
-      "integrity": "sha1-v5tKv7QrJ011FHnkTg/yZWtvEZM="
+      "from": "stream-browserify@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-1.0.0.tgz"
     },
     "stream-combiner": {
       "version": "0.0.4",
-      "resolved": "https://registry.npmjs.org/stream-combiner/-/stream-combiner-0.0.4.tgz",
-      "integrity": "sha1-TV5DPBhSYd3mI8o/RMWGvPXErRQ="
+      "from": "stream-combiner@>=0.0.3 <0.1.0",
+      "resolved": "https://registry.npmjs.org/stream-combiner/-/stream-combiner-0.0.4.tgz"
     },
     "stream-consume": {
       "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/stream-consume/-/stream-consume-0.1.0.tgz",
-      "integrity": "sha1-pB6tGm1ggc63n2WwYZAbbY89HQ8="
+      "from": "stream-consume@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/stream-consume/-/stream-consume-0.1.0.tgz"
     },
     "stream-counter": {
       "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/stream-counter/-/stream-counter-0.2.0.tgz",
-      "integrity": "sha1-3tJmVWMZyLDiIoErnPOyb6fZR94="
+      "from": "stream-counter@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/stream-counter/-/stream-counter-0.2.0.tgz"
     },
     "stream-http": {
       "version": "2.7.1",
+      "from": "stream-http@>=2.3.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/stream-http/-/stream-http-2.7.1.tgz",
-      "integrity": "sha1-VGpRdBrVprB+njGwsQRBqRffUoo=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.2.6 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
     "stream-shift": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/stream-shift/-/stream-shift-1.0.0.tgz",
-      "integrity": "sha1-1cdSgl5TZ+eG944Y5EXqIjoVWVI="
+      "from": "stream-shift@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/stream-shift/-/stream-shift-1.0.0.tgz"
     },
     "strict-uri-encode": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz",
-      "integrity": "sha1-J5siXfHVgrH1TmWt3UNS4Y+qBxM="
+      "from": "strict-uri-encode@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz"
     },
     "string_decoder": {
       "version": "0.10.31",
-      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
-      "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
+      "from": "string_decoder@>=0.10.0 <0.11.0",
+      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
     },
     "string-hash": {
       "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/string-hash/-/string-hash-1.1.3.tgz",
-      "integrity": "sha1-6Kr8CsGFW0Zmkp7X3RJ1311sgRs="
+      "from": "string-hash@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/string-hash/-/string-hash-1.1.3.tgz"
     },
     "string-width": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
-      "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
+      "from": "string-width@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz"
     },
     "string.prototype.codepointat": {
       "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/string.prototype.codepointat/-/string.prototype.codepointat-0.2.0.tgz",
-      "integrity": "sha1-aybpvTr8qnvjtCabUm3huCAArHg="
+      "from": "string.prototype.codepointat@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/string.prototype.codepointat/-/string.prototype.codepointat-0.2.0.tgz"
     },
     "stringify-object": {
       "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/stringify-object/-/stringify-object-3.2.0.tgz",
-      "integrity": "sha1-lDcKE15BvASDWIE7+ZSB8TFcaqY="
+      "from": "stringify-object@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/stringify-object/-/stringify-object-3.2.0.tgz"
     },
     "stringstream": {
       "version": "0.0.5",
-      "resolved": "https://registry.npmjs.org/stringstream/-/stringstream-0.0.5.tgz",
-      "integrity": "sha1-TkhM1N5aC7vuGORjB3EKioFiGHg="
+      "from": "stringstream@>=0.0.4 <0.1.0",
+      "resolved": "https://registry.npmjs.org/stringstream/-/stringstream-0.0.5.tgz"
     },
     "strip-ansi": {
       "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
-      "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8="
+      "from": "strip-ansi@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz"
     },
     "strip-bom": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-1.0.0.tgz",
-      "integrity": "sha1-hbiGLzhEtabV7IRnqTWYFzo295Q="
+      "from": "strip-bom@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-1.0.0.tgz"
     },
     "strip-bom-stream": {
       "version": "1.0.0",
+      "from": "strip-bom-stream@>=1.0.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/strip-bom-stream/-/strip-bom-stream-1.0.0.tgz",
-      "integrity": "sha1-5xRDmFd9Uaa+0PoZlPoF9D/ZiO4=",
       "dependencies": {
         "strip-bom": {
           "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
-          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
+          "from": "strip-bom@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz"
         }
       }
     },
     "strip-eof": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz",
-      "integrity": "sha1-u0P/VZim6wXYm1n80SnJgzE2Br8="
+      "from": "strip-eof@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz"
     },
     "strip-indent": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-1.0.1.tgz",
-      "integrity": "sha1-DHlipq3vp7vUrDZkYKY4VSrhoKI="
+      "from": "strip-indent@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-1.0.1.tgz"
     },
     "strip-json-comments": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz",
-      "integrity": "sha1-PFMZQukIwml8DsNEhYwobHygpgo="
+      "from": "strip-json-comments@>=2.0.1 <2.1.0",
+      "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz"
     },
     "style-loader": {
       "version": "0.17.0",
+      "from": "style-loader@>=0.17.0 <0.18.0",
       "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.17.0.tgz",
-      "integrity": "sha1-6CVLzNt690vVgnTjYQe01atN8xA=",
       "dependencies": {
         "loader-utils": {
           "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
-          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
+          "from": "loader-utils@>=1.0.2 <2.0.0",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
         }
       }
     },
     "sudo": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/sudo/-/sudo-1.0.3.tgz",
-      "integrity": "sha1-zPKGaRIPi3T4K4Rt/38clRIO/yA="
+      "from": "sudo@>=1.0.3 <1.1.0",
+      "resolved": "https://registry.npmjs.org/sudo/-/sudo-1.0.3.tgz"
     },
     "supports-color": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-      "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+      "from": "supports-color@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz"
     },
     "svgo": {
       "version": "0.7.2",
+      "from": "svgo@>=0.7.0 <0.8.0",
       "resolved": "https://registry.npmjs.org/svgo/-/svgo-0.7.2.tgz",
-      "integrity": "sha1-n1dyQTlSE1xv779Ar+ak+qiLS7U=",
       "dependencies": {
         "esprima": {
           "version": "2.7.3",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz",
-          "integrity": "sha1-luO3DVd59q1JzQMmc9HDEnZ7pYE="
+          "from": "esprima@>=2.6.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz"
         },
         "js-yaml": {
           "version": "3.7.0",
-          "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.7.0.tgz",
-          "integrity": "sha1-XJZ93YN6m/3KXy3oQlOr6KHAO4A="
+          "from": "js-yaml@>=3.7.0 <3.8.0",
+          "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.7.0.tgz"
         },
         "sax": {
           "version": "1.2.2",
-          "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.2.tgz",
-          "integrity": "sha1-/YYxojvHgmvvXYcb24c3jJVkeCg="
+          "from": "sax@>=1.2.1 <1.3.0",
+          "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.2.tgz"
         }
       }
     },
     "symbol": {
       "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/symbol/-/symbol-0.2.3.tgz",
-      "integrity": "sha1-O5hzuKkB5Hxu/iFSajrDcu8ou8c="
+      "from": "symbol@>=0.2.1 <0.3.0",
+      "resolved": "https://registry.npmjs.org/symbol/-/symbol-0.2.3.tgz"
     },
     "tapable": {
       "version": "0.1.10",
-      "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.1.10.tgz",
-      "integrity": "sha1-KcNXB8K3DlDQdIK10gLo7URtr9Q="
+      "from": "tapable@>=0.1.8 <0.2.0",
+      "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.1.10.tgz"
     },
     "tar": {
       "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/tar/-/tar-2.2.1.tgz",
-      "integrity": "sha1-jk0qJWwOIYXGsYrWlK7JaLg8sdE="
+      "from": "tar@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/tar/-/tar-2.2.1.tgz"
     },
     "term-size": {
       "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/term-size/-/term-size-0.1.1.tgz",
-      "integrity": "sha1-hzYLljlsq1dgljcUzaDQy+7K2co="
+      "from": "term-size@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/term-size/-/term-size-0.1.1.tgz"
     },
     "ternary-stream": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/ternary-stream/-/ternary-stream-2.0.1.tgz",
-      "integrity": "sha1-Bk5Im0tb9gumpre8fy9cJ07Pgmk="
+      "from": "ternary-stream@>=2.0.1 <3.0.0",
+      "resolved": "https://registry.npmjs.org/ternary-stream/-/ternary-stream-2.0.1.tgz"
     },
     "text-encoding": {
       "version": "0.6.4",
-      "resolved": "https://registry.npmjs.org/text-encoding/-/text-encoding-0.6.4.tgz",
-      "integrity": "sha1-45mpgiV6J22uQou5KEXLcb3CbRk="
+      "from": "text-encoding@0.6.4",
+      "resolved": "https://registry.npmjs.org/text-encoding/-/text-encoding-0.6.4.tgz"
     },
     "textextensions": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/textextensions/-/textextensions-1.0.2.tgz",
-      "integrity": "sha1-ZUhjk+4fK7A5pgy7oFsLaL2VAdI="
+      "from": "textextensions@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/textextensions/-/textextensions-1.0.2.tgz"
     },
     "throttleit": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/throttleit/-/throttleit-1.0.0.tgz",
-      "integrity": "sha1-nnhYNtr0Z0MUWlmEtiaNgoUorGw="
+      "from": "throttleit@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/throttleit/-/throttleit-1.0.0.tgz"
     },
     "through": {
       "version": "2.3.8",
-      "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
-      "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU="
+      "from": "through@>=2.3.1 <2.4.0",
+      "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz"
     },
     "through2": {
       "version": "2.0.3",
+      "from": "through2@>=2.0.1 <2.1.0",
       "resolved": "https://registry.npmjs.org/through2/-/through2-2.0.3.tgz",
-      "integrity": "sha1-AARWmzfHx0ujnEPzzteNGtlBQL4=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.1.5 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         }
       }
     },
     "through2-concurrent": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/through2-concurrent/-/through2-concurrent-1.1.1.tgz",
-      "integrity": "sha1-EctOpMnjG8puTB5tukjRxyjDUks="
+      "from": "through2-concurrent@1.1.1",
+      "resolved": "https://registry.npmjs.org/through2-concurrent/-/through2-concurrent-1.1.1.tgz"
     },
     "through2-filter": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/through2-filter/-/through2-filter-2.0.0.tgz",
-      "integrity": "sha1-YLxVoNrLdghdsfna6Zq0P4PWIuw="
+      "from": "through2-filter@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/through2-filter/-/through2-filter-2.0.0.tgz"
     },
     "tildify": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/tildify/-/tildify-1.2.0.tgz",
-      "integrity": "sha1-3OwD9V3Km3qj5bBPIYF+tW5jWIo="
+      "from": "tildify@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/tildify/-/tildify-1.2.0.tgz"
     },
     "time-stamp": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/time-stamp/-/time-stamp-1.1.0.tgz",
-      "integrity": "sha1-dkpaEa9QVhkhsTPztE5hhofg9cM="
+      "from": "time-stamp@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/time-stamp/-/time-stamp-1.1.0.tgz"
     },
     "timed-out": {
       "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-3.1.3.tgz",
-      "integrity": "sha1-lYYL/MXHbCd/j4Mm/Q9bLiDrohc="
+      "from": "timed-out@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-3.1.3.tgz"
     },
     "timers-browserify": {
       "version": "1.4.2",
-      "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-1.4.2.tgz",
-      "integrity": "sha1-ycWLV1voQHN1y14kYtrO50NZ9B0="
+      "from": "timers-browserify@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-1.4.2.tgz"
     },
     "tiny-lr": {
       "version": "0.2.1",
+      "from": "tiny-lr@>=0.2.1 <0.3.0",
       "resolved": "https://registry.npmjs.org/tiny-lr/-/tiny-lr-0.2.1.tgz",
-      "integrity": "sha1-s/26gC5dVqM8L28QeUsy5Hescp0=",
       "dependencies": {
         "body-parser": {
           "version": "1.14.2",
+          "from": "body-parser@>=1.14.0 <1.15.0",
           "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.14.2.tgz",
-          "integrity": "sha1-EBXLH+LEQ4WCWVgdtTMy+NDPUPk=",
           "dependencies": {
             "qs": {
               "version": "5.2.0",
-              "resolved": "https://registry.npmjs.org/qs/-/qs-5.2.0.tgz",
-              "integrity": "sha1-qfMRQq9GjLcrJbMBNrokVoNJFr4="
+              "from": "qs@5.2.0",
+              "resolved": "https://registry.npmjs.org/qs/-/qs-5.2.0.tgz"
             }
           }
         },
         "bytes": {
           "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.2.0.tgz",
-          "integrity": "sha1-/TVGSkA/b5EXwt42Cez/nK4ABYg="
+          "from": "bytes@2.2.0",
+          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.2.0.tgz"
         },
         "debug": {
           "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
+          "from": "debug@>=2.2.0 <2.3.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
         },
         "http-errors": {
           "version": "1.3.1",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
-          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
+          "from": "http-errors@>=1.3.1 <1.4.0",
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
         },
         "iconv-lite": {
           "version": "0.4.13",
-          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.13.tgz",
-          "integrity": "sha1-H4irpKsLFQjoMSrMOTRfNumS4vI="
+          "from": "iconv-lite@0.4.13",
+          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.13.tgz"
         },
         "ms": {
           "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+          "from": "ms@0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
         },
         "qs": {
           "version": "5.1.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-5.1.0.tgz",
-          "integrity": "sha1-TZMuXH6kEcynajEtOaYGIA/VDNk="
+          "from": "qs@>=5.1.0 <5.2.0",
+          "resolved": "https://registry.npmjs.org/qs/-/qs-5.1.0.tgz"
         },
         "raw-body": {
           "version": "2.1.7",
+          "from": "raw-body@>=2.1.5 <2.2.0",
           "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.1.7.tgz",
-          "integrity": "sha1-rf6s4uT7MJgFgBTQjActzFl1h3Q=",
           "dependencies": {
             "bytes": {
               "version": "2.4.0",
-              "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz",
-              "integrity": "sha1-fZcZb51br39pNeJZhVSe3SpsIzk="
+              "from": "bytes@2.4.0",
+              "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz"
             }
           }
         }
@@ -8764,85 +8903,85 @@
     },
     "tmp": {
       "version": "0.0.31",
-      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.31.tgz",
-      "integrity": "sha1-jzirlDjhcxXl29izZX6L+yd65Kc="
+      "from": "tmp@>=0.0.0 <0.1.0",
+      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.31.tgz"
     },
     "to-absolute-glob": {
       "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/to-absolute-glob/-/to-absolute-glob-0.1.1.tgz",
-      "integrity": "sha1-HN+kcqnvUMI57maZm2YsoOs5k38="
+      "from": "to-absolute-glob@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/to-absolute-glob/-/to-absolute-glob-0.1.1.tgz"
     },
     "to-array": {
       "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/to-array/-/to-array-0.1.4.tgz",
-      "integrity": "sha1-F+bBH3PdTz10zaek/zI46a2b+JA="
+      "from": "to-array@0.1.4",
+      "resolved": "https://registry.npmjs.org/to-array/-/to-array-0.1.4.tgz"
     },
     "to-arraybuffer": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/to-arraybuffer/-/to-arraybuffer-1.0.1.tgz",
-      "integrity": "sha1-fSKbH8xjfkZsoIEYCDanqr/4P0M="
+      "from": "to-arraybuffer@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/to-arraybuffer/-/to-arraybuffer-1.0.1.tgz"
     },
     "to-iso-string": {
       "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/to-iso-string/-/to-iso-string-0.0.2.tgz",
-      "integrity": "sha1-TcGeZk38y+Jb2NtQiwDG2hWCVdE="
+      "from": "to-iso-string@0.0.2",
+      "resolved": "https://registry.npmjs.org/to-iso-string/-/to-iso-string-0.0.2.tgz"
     },
     "tough-cookie": {
       "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.2.tgz",
-      "integrity": "sha1-8IH3bkyFcg5sN6X6ztc3FQ2EByo="
+      "from": "tough-cookie@>=2.3.0 <2.4.0",
+      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.2.tgz"
     },
     "trim-newlines": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/trim-newlines/-/trim-newlines-1.0.0.tgz",
-      "integrity": "sha1-WIeWa7WCpFA6QetST301ARgVphM="
+      "from": "trim-newlines@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/trim-newlines/-/trim-newlines-1.0.0.tgz"
     },
     "try-json-parse": {
       "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/try-json-parse/-/try-json-parse-0.1.1.tgz",
-      "integrity": "sha1-jbAWIuh35RuDFAyu58gIZK05DII="
+      "from": "try-json-parse@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/try-json-parse/-/try-json-parse-0.1.1.tgz"
     },
     "ts-loader": {
       "version": "2.1.0",
+      "from": "ts-loader@>=2.0.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/ts-loader/-/ts-loader-2.1.0.tgz",
-      "integrity": "sha1-Wo78xccsBvxJ1putachWF8YZT3c=",
       "dependencies": {
         "enhanced-resolve": {
           "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz",
-          "integrity": "sha1-n0tib1dyRe3PSyrYPYbhf09CHew="
+          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
         },
         "loader-utils": {
           "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
-          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
+          "from": "loader-utils@>=1.0.2 <2.0.0",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
         },
         "tapable": {
           "version": "0.2.6",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz",
-          "integrity": "sha1-IGvo4YiGC1FEJTdebxrom/sB/Y0="
+          "from": "tapable@>=0.2.5 <0.3.0",
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
         }
       }
     },
     "tslib": {
       "version": "1.7.1",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.7.1.tgz",
-      "integrity": "sha1-vIAEFkaRkjp5/oN4u+s9ogF1OOw="
+      "from": "tslib@>=1.6.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.7.1.tgz"
     },
     "tslint": {
       "version": "4.0.2",
+      "from": "tslint@4.0.2",
       "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.0.2.tgz",
-      "integrity": "sha1-1D8kwMH4Jt5/Ogl7t4CKi0Ml/qw=",
       "dependencies": {
         "findup-sync": {
           "version": "0.3.0",
+          "from": "findup-sync@>=0.3.0 <0.4.0",
           "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.3.0.tgz",
-          "integrity": "sha1-N5MKpdgWt3fANEXhlmzGeQpMCxY=",
           "dependencies": {
             "glob": {
               "version": "5.0.15",
-              "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
-              "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
+              "from": "glob@>=5.0.0 <5.1.0",
+              "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
             }
           }
         }
@@ -8850,968 +8989,968 @@
     },
     "tslint-microsoft-contrib": {
       "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/tslint-microsoft-contrib/-/tslint-microsoft-contrib-4.0.0.tgz",
-      "integrity": "sha1-fgClbBQXJR0/kaiA78xDNhpp+yo="
+      "from": "tslint-microsoft-contrib@4.0.0",
+      "resolved": "https://registry.npmjs.org/tslint-microsoft-contrib/-/tslint-microsoft-contrib-4.0.0.tgz"
     },
     "tsscmp": {
       "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/tsscmp/-/tsscmp-1.0.5.tgz",
-      "integrity": "sha1-fcSjOvcVgatDN9qR2FylQn69mpc="
+      "from": "tsscmp@1.0.5",
+      "resolved": "https://registry.npmjs.org/tsscmp/-/tsscmp-1.0.5.tgz"
     },
     "tsutils": {
       "version": "1.9.1",
-      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-1.9.1.tgz",
-      "integrity": "sha1-ufmrROVa+WgYMdXyjQrur1x1DLA="
+      "from": "tsutils@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-1.9.1.tgz"
     },
     "tty-browserify": {
       "version": "0.0.0",
-      "resolved": "https://registry.npmjs.org/tty-browserify/-/tty-browserify-0.0.0.tgz",
-      "integrity": "sha1-oVe6QC2iTpv5V/mqadUk7tQpAaY="
+      "from": "tty-browserify@0.0.0",
+      "resolved": "https://registry.npmjs.org/tty-browserify/-/tty-browserify-0.0.0.tgz"
     },
     "tunnel-agent": {
       "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.6.0.tgz",
-      "integrity": "sha1-J6XeoGs2sEoKmWZ3SykIaPD8QP0="
+      "from": "tunnel-agent@>=0.6.0 <0.7.0",
+      "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.6.0.tgz"
     },
     "tweetnacl": {
       "version": "0.14.5",
+      "from": "tweetnacl@>=0.14.0 <0.15.0",
       "resolved": "https://registry.npmjs.org/tweetnacl/-/tweetnacl-0.14.5.tgz",
-      "integrity": "sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q=",
       "optional": true
     },
     "type-check": {
       "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.3.2.tgz",
-      "integrity": "sha1-WITKtRLPHTVeP7eE8wgEsrUg23I="
+      "from": "type-check@>=0.3.2 <0.4.0",
+      "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.3.2.tgz"
     },
     "type-detect": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-1.0.0.tgz",
-      "integrity": "sha1-diIXzAbbJY7EiQihKY6LlRIejqI="
+      "from": "type-detect@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-1.0.0.tgz"
     },
     "type-is": {
       "version": "1.6.15",
-      "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.15.tgz",
-      "integrity": "sha1-yrEPtJCeRByChC6v4a1kbIGARBA="
+      "from": "type-is@>=1.6.15 <1.7.0",
+      "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.15.tgz"
     },
     "typedarray": {
       "version": "0.0.6",
-      "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
-      "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
+      "from": "typedarray@>=0.0.5 <0.1.0",
+      "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz"
     },
     "typescript": {
       "version": "2.3.3",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.3.3.tgz",
-      "integrity": "sha1-ljnzw7QBSOjKl/4IpR3RiRu2viI="
+      "from": "typescript@2.3.3",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.3.3.tgz"
     },
     "ua-parser-js": {
       "version": "0.7.12",
-      "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.12.tgz",
-      "integrity": "sha1-BMgamb3V3FImPqKdJMa/jUgYpLs="
+      "from": "ua-parser-js@>=0.7.9 <0.8.0",
+      "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.12.tgz"
     },
     "uglify-js": {
       "version": "2.8.27",
+      "from": "uglify-js@>=2.6.0 <3.0.0",
       "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.8.27.tgz",
-      "integrity": "sha1-R3h/kSsPJC5bmENDvo416V9pTJw=",
       "dependencies": {
         "camelcase": {
           "version": "1.2.1",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
-          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
+          "from": "camelcase@>=1.0.2 <2.0.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz"
         },
         "cliui": {
           "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
-          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE="
+          "from": "cliui@>=2.1.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz"
         },
         "window-size": {
           "version": "0.1.0",
-          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
-          "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
+          "from": "window-size@0.1.0",
+          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz"
         },
         "wordwrap": {
           "version": "0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
-          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
+          "from": "wordwrap@0.0.2",
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz"
         },
         "yargs": {
           "version": "3.10.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
-          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
+          "from": "yargs@>=3.10.0 <3.11.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz"
         }
       }
     },
     "uglify-to-browserify": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/uglify-to-browserify/-/uglify-to-browserify-1.0.2.tgz",
-      "integrity": "sha1-bgkk1r2mta/jSeOabWMoUKD4grc="
+      "from": "uglify-to-browserify@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/uglify-to-browserify/-/uglify-to-browserify-1.0.2.tgz"
     },
     "uglifyjs-webpack-plugin": {
       "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-0.4.3.tgz",
-      "integrity": "sha1-pnKn1mVflN+n4JZw1IAw83zJMmc="
+      "from": "uglifyjs-webpack-plugin@>=0.4.3 <0.5.0",
+      "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-0.4.3.tgz"
     },
     "uid-safe": {
       "version": "2.1.4",
-      "resolved": "https://registry.npmjs.org/uid-safe/-/uid-safe-2.1.4.tgz",
-      "integrity": "sha1-Otbzg2jG1MjHXsF2I/t5qh0HHYE="
+      "from": "uid-safe@2.1.4",
+      "resolved": "https://registry.npmjs.org/uid-safe/-/uid-safe-2.1.4.tgz"
     },
     "ultron": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.0.2.tgz",
-      "integrity": "sha1-rOEWq1V80Zc4ak6I9GhTeMiy5Po="
+      "from": "ultron@>=1.0.0 <1.1.0",
+      "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.0.2.tgz"
     },
     "unc-path-regex": {
       "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/unc-path-regex/-/unc-path-regex-0.1.2.tgz",
-      "integrity": "sha1-5z3T17DXxe2G+6xrCufYxqadUPo="
+      "from": "unc-path-regex@>=0.1.0 <0.2.0",
+      "resolved": "https://registry.npmjs.org/unc-path-regex/-/unc-path-regex-0.1.2.tgz"
     },
     "underscore": {
       "version": "1.4.4",
-      "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.4.4.tgz",
-      "integrity": "sha1-YaajIBBiKvoHljvzJSA88SI51gQ="
+      "from": "underscore@>=1.4.4 <1.5.0",
+      "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.4.4.tgz"
     },
     "underscore.string": {
       "version": "3.3.4",
-      "resolved": "https://registry.npmjs.org/underscore.string/-/underscore.string-3.3.4.tgz",
-      "integrity": "sha1-LCo/n4PmR2L9xF5s6sZRQoZCE9s="
+      "from": "underscore.string@>=3.3.4 <4.0.0",
+      "resolved": "https://registry.npmjs.org/underscore.string/-/underscore.string-3.3.4.tgz"
     },
     "uniq": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/uniq/-/uniq-1.0.1.tgz",
-      "integrity": "sha1-sxxa6CVIRKOoKBVBzisEuGWnNP8="
+      "from": "uniq@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/uniq/-/uniq-1.0.1.tgz"
     },
     "uniqid": {
       "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/uniqid/-/uniqid-4.1.1.tgz",
-      "integrity": "sha1-iSIN32t1GuUrX3JISGNShZa7hME="
+      "from": "uniqid@>=4.0.0 <5.0.0",
+      "resolved": "https://registry.npmjs.org/uniqid/-/uniqid-4.1.1.tgz"
     },
     "uniqs": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/uniqs/-/uniqs-2.0.0.tgz",
-      "integrity": "sha1-/+3ks2slKQaW5uFl1KWe25mOawI="
+      "from": "uniqs@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/uniqs/-/uniqs-2.0.0.tgz"
     },
     "unique-stream": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-1.0.0.tgz",
-      "integrity": "sha1-1ZpKdUJ0R9mqbJHnAmP40mpLEEs="
+      "from": "unique-stream@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-1.0.0.tgz"
     },
     "unique-string": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/unique-string/-/unique-string-1.0.0.tgz",
-      "integrity": "sha1-nhBXzKhRq7kzmPizOuGHuZyuwRo="
+      "from": "unique-string@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/unique-string/-/unique-string-1.0.0.tgz"
     },
     "unpipe": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz",
-      "integrity": "sha1-sr9O6FFKrmFltIF4KdIbLvSZBOw="
+      "from": "unpipe@1.0.0",
+      "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz"
     },
     "unzip-response": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-1.0.2.tgz",
-      "integrity": "sha1-uYTwh3/AqJwsdzzB73tbIytbBv4="
+      "from": "unzip-response@>=1.0.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-1.0.2.tgz"
     },
     "update-notifier": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-1.0.3.tgz",
-      "integrity": "sha1-j5LFFUgr1oMbfJMBPnD4dVLHz1o="
+      "from": "update-notifier@>=1.0.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-1.0.3.tgz"
     },
     "upper-case": {
       "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/upper-case/-/upper-case-1.1.3.tgz",
-      "integrity": "sha1-9rRQHC7EzdJrp4vnIilh3ndiFZg="
+      "from": "upper-case@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/upper-case/-/upper-case-1.1.3.tgz"
     },
     "url": {
       "version": "0.10.3",
+      "from": "url@>=0.10.1 <0.11.0",
       "resolved": "https://registry.npmjs.org/url/-/url-0.10.3.tgz",
-      "integrity": "sha1-Ah5NnHcF8hu/N9A861h2dAJ3TGQ=",
       "dependencies": {
         "punycode": {
           "version": "1.3.2",
-          "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
-          "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
+          "from": "punycode@1.3.2",
+          "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
         }
       }
     },
     "url-parse": {
       "version": "1.1.9",
+      "from": "url-parse@>=1.1.1 <2.0.0",
       "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.1.9.tgz",
-      "integrity": "sha1-xn8dd11R8KGJEd17P/rSe7nlvRk=",
       "dependencies": {
         "querystringify": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-1.0.0.tgz",
-          "integrity": "sha1-YoYkIRLFtxL6ZU5SZlK/ahP/Bcs="
+          "from": "querystringify@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-1.0.0.tgz"
         }
       }
     },
     "url-parse-lax": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/url-parse-lax/-/url-parse-lax-1.0.0.tgz",
-      "integrity": "sha1-evjzA2Rem9eaJy56FKxovAYJ2nM="
+      "from": "url-parse-lax@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/url-parse-lax/-/url-parse-lax-1.0.0.tgz"
     },
     "user-home": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/user-home/-/user-home-1.1.1.tgz",
-      "integrity": "sha1-K1viOjK2Onyd640PKNSFcko98ZA="
+      "from": "user-home@>=1.1.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/user-home/-/user-home-1.1.1.tgz"
     },
     "useragent": {
       "version": "2.1.13",
+      "from": "useragent@>=2.1.6 <3.0.0",
       "resolved": "https://registry.npmjs.org/useragent/-/useragent-2.1.13.tgz",
-      "integrity": "sha1-u6Q+iqJNXOuDwpN0c+EC4h33TBA=",
       "dependencies": {
         "lru-cache": {
           "version": "2.2.4",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.2.4.tgz",
-          "integrity": "sha1-bGWGGb7PFAMdDQtZSxYELOTcBj0="
+          "from": "lru-cache@>=2.2.0 <2.3.0",
+          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.2.4.tgz"
         }
       }
     },
     "util": {
       "version": "0.10.3",
+      "from": "util@>=0.10.3 <1.0.0",
       "resolved": "https://registry.npmjs.org/util/-/util-0.10.3.tgz",
-      "integrity": "sha1-evsa/lCAUkZInj23/g7TeTNqwPk=",
       "dependencies": {
         "inherits": {
           "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.1.tgz",
-          "integrity": "sha1-sX0I0ya0Qj5Wjv9xn5GwscvfafE="
+          "from": "inherits@2.0.1",
+          "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.1.tgz"
         }
       }
     },
     "util-deprecate": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
-      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8="
+      "from": "util-deprecate@>=1.0.1 <1.1.0",
+      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz"
     },
     "utils-merge": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.0.tgz",
-      "integrity": "sha1-ApT7kiu5N1FTVBxPcJYjHyh8ivg="
+      "from": "utils-merge@1.0.0",
+      "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.0.tgz"
     },
     "uuid": {
       "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.0.1.tgz",
-      "integrity": "sha1-ZUS7ot/ajBzxfmKaOjBeK7H+5sE="
+      "from": "uuid@>=3.0.0 <4.0.0",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.0.1.tgz"
     },
     "v8flags": {
       "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/v8flags/-/v8flags-2.1.1.tgz",
-      "integrity": "sha1-qrGh+jDUX4jdMhFIh1rALAtV5bQ="
+      "from": "v8flags@>=2.0.2 <3.0.0",
+      "resolved": "https://registry.npmjs.org/v8flags/-/v8flags-2.1.1.tgz"
     },
     "vali-date": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/vali-date/-/vali-date-1.0.0.tgz",
-      "integrity": "sha1-G5BKWWCfsyjvB4E4Qgk09rhnCaY="
+      "from": "vali-date@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/vali-date/-/vali-date-1.0.0.tgz"
     },
     "validate-npm-package-license": {
       "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.1.tgz",
-      "integrity": "sha1-KAS6vnEq0zeUWaz74kdGqywwP7w="
+      "from": "validate-npm-package-license@>=3.0.1 <4.0.0",
+      "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.1.tgz"
     },
     "validator": {
       "version": "5.7.0",
-      "resolved": "https://registry.npmjs.org/validator/-/validator-5.7.0.tgz",
-      "integrity": "sha1-eoelgUa2laxIYHEUHAxJ1n2gXlw="
+      "from": "validator@>=5.0.0 <6.0.0",
+      "resolved": "https://registry.npmjs.org/validator/-/validator-5.7.0.tgz"
     },
     "vary": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.1.tgz",
-      "integrity": "sha1-Z1Neu2lMHVIldFeYRmUyP1h+jTc="
+      "from": "vary@>=1.1.0 <1.2.0",
+      "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.1.tgz"
     },
     "vendors": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/vendors/-/vendors-1.0.1.tgz",
-      "integrity": "sha1-N61zyO5Bf7PVgOeFMSMH0nSEfyI="
+      "from": "vendors@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/vendors/-/vendors-1.0.1.tgz"
     },
     "verror": {
       "version": "1.3.6",
-      "resolved": "https://registry.npmjs.org/verror/-/verror-1.3.6.tgz",
-      "integrity": "sha1-z/XfEpRtKX0rqu+qJoniW+AcAFw="
+      "from": "verror@1.3.6",
+      "resolved": "https://registry.npmjs.org/verror/-/verror-1.3.6.tgz"
     },
     "vhost": {
       "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/vhost/-/vhost-3.0.2.tgz",
-      "integrity": "sha1-L7HezUxGaqiLD5NBrzPcGv8keNU="
+      "from": "vhost@>=3.0.1 <3.1.0",
+      "resolved": "https://registry.npmjs.org/vhost/-/vhost-3.0.2.tgz"
     },
     "vinyl": {
       "version": "0.5.3",
-      "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.5.3.tgz",
-      "integrity": "sha1-sEVbOPxeDPMNQyUTLkYZcMIJHN4="
+      "from": "vinyl@>=0.5.0 <0.6.0",
+      "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.5.3.tgz"
     },
     "vinyl-bufferstream": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/vinyl-bufferstream/-/vinyl-bufferstream-1.0.1.tgz",
-      "integrity": "sha1-BTeGn1gO/6TKRay0dXnkuf5jCBo="
+      "from": "vinyl-bufferstream@>=1.0.1 <2.0.0",
+      "resolved": "https://registry.npmjs.org/vinyl-bufferstream/-/vinyl-bufferstream-1.0.1.tgz"
     },
     "vinyl-fs": {
       "version": "0.3.14",
+      "from": "vinyl-fs@>=0.3.0 <0.4.0",
       "resolved": "https://registry.npmjs.org/vinyl-fs/-/vinyl-fs-0.3.14.tgz",
-      "integrity": "sha1-mmhRzhysHBzqX+hsCTHWIMLPqeY=",
       "dependencies": {
         "clone": {
           "version": "0.2.0",
-          "resolved": "https://registry.npmjs.org/clone/-/clone-0.2.0.tgz",
-          "integrity": "sha1-xhJqkK1Pctv1rNskPMN3JP6T/B8="
+          "from": "clone@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/clone/-/clone-0.2.0.tgz"
         },
         "graceful-fs": {
           "version": "3.0.11",
-          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-3.0.11.tgz",
-          "integrity": "sha1-dhPHeKGv6mLyXGMKCG1/Osu92Bg="
+          "from": "graceful-fs@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-3.0.11.tgz"
         },
         "readable-stream": {
           "version": "1.0.34",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
-          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
+          "from": "readable-stream@>=1.0.33-1 <1.1.0-0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
         },
         "through2": {
           "version": "0.6.5",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
-          "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg="
+          "from": "through2@>=0.6.1 <0.7.0",
+          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz"
         },
         "vinyl": {
           "version": "0.4.6",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.4.6.tgz",
-          "integrity": "sha1-LzVsh6VQolVGHza76ypbqL94SEc="
+          "from": "vinyl@>=0.4.0 <0.5.0",
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.4.6.tgz"
         }
       }
     },
     "vinyl-ftp": {
       "version": "0.6.0",
+      "from": "vinyl-ftp@0.6.0",
       "resolved": "https://registry.npmjs.org/vinyl-ftp/-/vinyl-ftp-0.6.0.tgz",
-      "integrity": "sha1-L7Q+xNWKLkwGtAblac7ps6pd+Mo=",
       "dependencies": {
         "clone-stats": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-1.0.0.tgz",
-          "integrity": "sha1-s3gt/4u1R04Yuba/D9/ngvh3doA="
+          "from": "clone-stats@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-1.0.0.tgz"
         },
         "replace-ext": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-1.0.0.tgz",
-          "integrity": "sha1-3mMSg3P8v3w8z6TeWkgMRaZ5WOs="
+          "from": "replace-ext@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-1.0.0.tgz"
         },
         "vinyl": {
           "version": "2.0.2",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-2.0.2.tgz",
-          "integrity": "sha1-CjcT2NTpIhxY8QyhbAEWyeJe2nw="
+          "from": "vinyl@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-2.0.2.tgz"
         }
       }
     },
     "vinyl-sourcemaps-apply": {
       "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/vinyl-sourcemaps-apply/-/vinyl-sourcemaps-apply-0.2.1.tgz",
-      "integrity": "sha1-q2VJ1h0XLCsbh75cUI0jnI74dwU="
+      "from": "vinyl-sourcemaps-apply@>=0.2.1 <0.3.0",
+      "resolved": "https://registry.npmjs.org/vinyl-sourcemaps-apply/-/vinyl-sourcemaps-apply-0.2.1.tgz"
     },
     "vm-browserify": {
       "version": "0.0.4",
-      "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-0.0.4.tgz",
-      "integrity": "sha1-XX6kW7755Kb/ZflUOOCofDV9WnM="
+      "from": "vm-browserify@0.0.4",
+      "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-0.0.4.tgz"
     },
     "void-elements": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/void-elements/-/void-elements-2.0.1.tgz",
-      "integrity": "sha1-wGavtYK7HLQSjWDqkjkulNXp2+w="
+      "from": "void-elements@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/void-elements/-/void-elements-2.0.1.tgz"
     },
     "watchpack": {
       "version": "0.2.9",
+      "from": "watchpack@>=0.2.1 <0.3.0",
       "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-0.2.9.tgz",
-      "integrity": "sha1-Yuqkq15bo1/fwBgnVibjwPXj+ws=",
       "dependencies": {
         "async": {
           "version": "0.9.2",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz",
-          "integrity": "sha1-rqdNXmHB+JlhO/ZL2mbUx48v0X0="
+          "from": "async@>=0.9.0 <0.10.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
         }
       }
     },
     "wbuf": {
       "version": "1.7.2",
-      "resolved": "https://registry.npmjs.org/wbuf/-/wbuf-1.7.2.tgz",
-      "integrity": "sha1-1pe5nx9ZUS3ydRvkJ2nBWAtYAf4="
+      "from": "wbuf@>=1.7.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/wbuf/-/wbuf-1.7.2.tgz"
     },
     "webpack": {
       "version": "2.2.1",
+      "from": "webpack@2.2.1",
       "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.2.1.tgz",
-      "integrity": "sha1-e7HXKuIIfdGkr1Jq/sFe7RfdpHU=",
       "dependencies": {
         "acorn": {
           "version": "4.0.13",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
-          "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c="
+          "from": "acorn@>=4.0.4 <5.0.0",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz"
         },
         "async": {
           "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
-          "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c="
+          "from": "async@>=2.1.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
         },
         "camelcase": {
           "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
-          "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
+          "from": "camelcase@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
         },
         "constants-browserify": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz",
-          "integrity": "sha1-wguW2MYXdIqvHBYCF2DNJ/y4y3U="
+          "from": "constants-browserify@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
         },
         "crypto-browserify": {
           "version": "3.11.0",
-          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz",
-          "integrity": "sha1-NlKgkGq5sqfgw85mpAjpV6JIVSI="
+          "from": "crypto-browserify@>=3.11.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
         },
         "enhanced-resolve": {
           "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz",
-          "integrity": "sha1-n0tib1dyRe3PSyrYPYbhf09CHew="
+          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
         },
         "https-browserify": {
           "version": "0.0.1",
-          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz",
-          "integrity": "sha1-P5E2XKvmC3ftDruiS0VOPgnZWoI="
+          "from": "https-browserify@0.0.1",
+          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
         },
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "node-libs-browser": {
           "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz",
-          "integrity": "sha1-o6WeyXAkmFtG6Vg3lkb5bEthZkY="
+          "from": "node-libs-browser@>=2.0.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
         },
         "os-browserify": {
           "version": "0.2.1",
-          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz",
-          "integrity": "sha1-Y/xMzuXS13Y9Jrv4YBB45sLgBE8="
+          "from": "os-browserify@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
+          "from": "readable-stream@>=2.0.5 <3.0.0",
           "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g=",
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-              "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+              "from": "string_decoder@>=1.0.0 <1.1.0",
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
             }
           }
         },
         "stream-browserify": {
           "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz",
-          "integrity": "sha1-ZiZu5fm9uZQKTkUUyvtDu3Hlyds="
+          "from": "stream-browserify@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
         },
         "supports-color": {
           "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "from": "supports-color@>=3.1.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
         },
         "tapable": {
           "version": "0.2.6",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz",
-          "integrity": "sha1-IGvo4YiGC1FEJTdebxrom/sB/Y0="
+          "from": "tapable@>=0.2.5 <0.3.0",
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
         },
         "timers-browserify": {
           "version": "2.0.2",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz",
-          "integrity": "sha1-q0iDz1l9zVCvIRNJoA+8pWrIa4Y="
+          "from": "timers-browserify@>=2.0.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
         },
         "url": {
           "version": "0.11.0",
+          "from": "url@>=0.11.0 <0.12.0",
           "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
-          "integrity": "sha1-ODjpfPxgUh63PFJajlW/3Z4uKPE=",
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
-              "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
+              "from": "punycode@1.3.2",
+              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
             }
           }
         },
         "watchpack": {
           "version": "1.3.1",
-          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz",
-          "integrity": "sha1-fYaTkHsozmAT5/NhCqKhrPB9rYc="
+          "from": "watchpack@>=1.2.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz"
         },
         "webpack-sources": {
           "version": "0.1.5",
-          "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-0.1.5.tgz",
-          "integrity": "sha1-qh86vw8NdNtxEcQOUAuE+WZkB1A="
+          "from": "webpack-sources@>=0.1.4 <0.2.0",
+          "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-0.1.5.tgz"
         },
         "yargs": {
           "version": "6.6.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz",
-          "integrity": "sha1-eC7CHvQDNF+DCoCMo9UTr1YGUgg="
+          "from": "yargs@>=6.0.0 <7.0.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
         },
         "yargs-parser": {
           "version": "4.2.1",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz",
-          "integrity": "sha1-KczqwNxPA8bIe0qfIX3RjJ90hxw="
+          "from": "yargs-parser@>=4.2.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
         }
       }
     },
     "webpack-bundle-analyzer": {
       "version": "2.8.2",
+      "from": "webpack-bundle-analyzer@>=2.2.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.8.2.tgz",
-      "integrity": "sha1-i2JAwpqdY7xy8J2SD7BQrbzOn+g=",
       "dependencies": {
         "acorn": {
           "version": "5.0.3",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz",
-          "integrity": "sha1-xGDfCEkUY/AozLguqzcwvwEIez0="
+          "from": "acorn@>=5.0.3 <6.0.0",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
         },
         "etag": {
           "version": "1.8.0",
-          "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.0.tgz",
-          "integrity": "sha1-b2Ma7zNtbEY2K1F2QETOIWvjwFE="
+          "from": "etag@>=1.8.0 <1.9.0",
+          "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.0.tgz"
         },
         "express": {
           "version": "4.15.3",
-          "resolved": "https://registry.npmjs.org/express/-/express-4.15.3.tgz",
-          "integrity": "sha1-urZdDwOqgMNYQIly/HAPkWlEtmI="
+          "from": "express@>=4.15.2 <5.0.0",
+          "resolved": "https://registry.npmjs.org/express/-/express-4.15.3.tgz"
         },
         "fresh": {
           "version": "0.5.0",
-          "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.0.tgz",
-          "integrity": "sha1-9HTKXmqSRtb9jglTz6m5yAWvp44="
+          "from": "fresh@0.5.0",
+          "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.0.tgz"
         },
         "lodash": {
           "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+          "from": "lodash@>=4.17.4 <5.0.0",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz"
         },
         "mime": {
           "version": "1.3.4",
-          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz",
-          "integrity": "sha1-EV+eO2s9rylZmDyzjxSaLUDrXVM="
+          "from": "mime@1.3.4",
+          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz"
         },
         "send": {
           "version": "0.15.3",
-          "resolved": "https://registry.npmjs.org/send/-/send-0.15.3.tgz",
-          "integrity": "sha1-UBP5+ZAj31DRvZiSwZ4979HVMwk="
+          "from": "send@0.15.3",
+          "resolved": "https://registry.npmjs.org/send/-/send-0.15.3.tgz"
         },
         "serve-static": {
           "version": "1.12.3",
-          "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.12.3.tgz",
-          "integrity": "sha1-n0uhni8wMMVH+K+ZEHg47DjVseI="
+          "from": "serve-static@1.12.3",
+          "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.12.3.tgz"
         },
         "ultron": {
           "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.1.0.tgz",
-          "integrity": "sha1-sHoualQagV/Go0zNRTO67DB8qGQ="
+          "from": "ultron@>=1.1.0 <1.2.0",
+          "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.1.0.tgz"
         },
         "ws": {
           "version": "2.3.1",
-          "resolved": "https://registry.npmjs.org/ws/-/ws-2.3.1.tgz",
-          "integrity": "sha1-a5Sz5EfLajY/eF6vlK9jWejoHIA="
+          "from": "ws@>=2.3.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/ws/-/ws-2.3.1.tgz"
         }
       }
     },
     "webpack-core": {
       "version": "0.6.9",
+      "from": "webpack-core@>=0.6.0 <0.7.0",
       "resolved": "https://registry.npmjs.org/webpack-core/-/webpack-core-0.6.9.tgz",
-      "integrity": "sha1-/FcViMhVjad76e+23r3Fo7FyvcI=",
       "dependencies": {
         "source-map": {
           "version": "0.4.4",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
-          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s="
+          "from": "source-map@>=0.4.1 <0.5.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz"
         }
       }
     },
     "webpack-dev-middleware": {
       "version": "1.10.2",
-      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-1.10.2.tgz",
-      "integrity": "sha1-LiUs4d+wINvaHMs33ybzCrAU29E="
+      "from": "webpack-dev-middleware@>=1.0.11 <2.0.0",
+      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-1.10.2.tgz"
     },
     "webpack-dev-server": {
       "version": "2.4.5",
+      "from": "webpack-dev-server@>=2.4.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.4.5.tgz",
-      "integrity": "sha1-MThM6BE2vhCAtLTN4OubkOVO5s8=",
       "dependencies": {
         "camelcase": {
           "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
-          "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
+          "from": "camelcase@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
         },
         "supports-color": {
           "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "from": "supports-color@>=3.1.1 <4.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
         },
         "yargs": {
           "version": "6.6.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz",
-          "integrity": "sha1-eC7CHvQDNF+DCoCMo9UTr1YGUgg="
+          "from": "yargs@>=6.0.0 <7.0.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
         },
         "yargs-parser": {
           "version": "4.2.1",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz",
-          "integrity": "sha1-KczqwNxPA8bIe0qfIX3RjJ90hxw="
+          "from": "yargs-parser@>=4.2.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
         }
       }
     },
     "webpack-node-externals": {
       "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/webpack-node-externals/-/webpack-node-externals-1.6.0.tgz",
-      "integrity": "sha1-Iyxi7GCSsQBjWj0p2DwXRxKN+b0="
+      "from": "webpack-node-externals@>=1.5.4 <2.0.0",
+      "resolved": "https://registry.npmjs.org/webpack-node-externals/-/webpack-node-externals-1.6.0.tgz"
     },
     "webpack-notifier": {
       "version": "1.5.0",
+      "from": "webpack-notifier@>=1.5.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/webpack-notifier/-/webpack-notifier-1.5.0.tgz",
-      "integrity": "sha1-wBAAfUSM68NN78mezyiPpejGuvY=",
       "dependencies": {
         "lodash._baseclone": {
           "version": "3.3.0",
-          "resolved": "https://registry.npmjs.org/lodash._baseclone/-/lodash._baseclone-3.3.0.tgz",
-          "integrity": "sha1-MDUZv2OT/n5C802LYw73eU41Qrc="
+          "from": "lodash._baseclone@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/lodash._baseclone/-/lodash._baseclone-3.3.0.tgz"
         },
         "lodash.clonedeep": {
           "version": "3.0.2",
-          "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-3.0.2.tgz",
-          "integrity": "sha1-oKHkDYKl6on/WxR7hETtY9koJ9s="
+          "from": "lodash.clonedeep@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-3.0.2.tgz"
         },
         "node-notifier": {
           "version": "4.6.1",
-          "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-4.6.1.tgz",
-          "integrity": "sha1-BW0UJE89zBzq3+aK+c/wxUc6M/M="
+          "from": "node-notifier@>=4.1.0 <5.0.0",
+          "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-4.6.1.tgz"
         }
       }
     },
     "webpack-sources": {
       "version": "0.2.3",
+      "from": "webpack-sources@>=0.2.3 <0.3.0",
       "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-0.2.3.tgz",
-      "integrity": "sha1-F8Yr+vE8cH+dAsR54Nzd6DgGl/s=",
       "dependencies": {
         "source-list-map": {
           "version": "1.1.2",
-          "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-1.1.2.tgz",
-          "integrity": "sha1-mIkBnRAkzOVc3AaUmDN+9hhqEaE="
+          "from": "source-list-map@>=1.1.1 <2.0.0",
+          "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-1.1.2.tgz"
         }
       }
     },
     "webpack-split-by-path": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/webpack-split-by-path/-/webpack-split-by-path-2.0.0.tgz",
-      "integrity": "sha1-K2p1MB82lfc9h4jZkMTwxxVn4rA="
+      "from": "webpack-split-by-path@2.0.0",
+      "resolved": "https://registry.npmjs.org/webpack-split-by-path/-/webpack-split-by-path-2.0.0.tgz"
     },
     "webpack-stats-plugin": {
       "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/webpack-stats-plugin/-/webpack-stats-plugin-0.1.5.tgz",
-      "integrity": "sha1-KeXxLr/VMVjTHWVqETrB97hhedk="
+      "from": "webpack-stats-plugin@>=0.1.1 <0.2.0",
+      "resolved": "https://registry.npmjs.org/webpack-stats-plugin/-/webpack-stats-plugin-0.1.5.tgz"
     },
     "webpack-stream": {
       "version": "3.2.0",
+      "from": "webpack-stream@>=3.2.0 <3.3.0",
       "resolved": "https://registry.npmjs.org/webpack-stream/-/webpack-stream-3.2.0.tgz",
-      "integrity": "sha1-Oh0WD7EdQXJ7fObzL3IkZPmLIYY=",
       "dependencies": {
         "camelcase": {
           "version": "1.2.1",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
-          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
+          "from": "camelcase@>=1.0.2 <2.0.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz"
         },
         "cliui": {
           "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
-          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE="
+          "from": "cliui@>=2.1.0 <3.0.0",
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz"
         },
         "constants-browserify": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz",
-          "integrity": "sha1-wguW2MYXdIqvHBYCF2DNJ/y4y3U="
+          "from": "constants-browserify@>=1.0.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
         },
         "crypto-browserify": {
           "version": "3.3.0",
-          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.3.0.tgz",
-          "integrity": "sha1-ufx1u0oO1h3PHNXa6W6zDJw+UGw="
+          "from": "crypto-browserify@3.3.0",
+          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.3.0.tgz"
         },
         "https-browserify": {
           "version": "0.0.1",
-          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz",
-          "integrity": "sha1-P5E2XKvmC3ftDruiS0VOPgnZWoI="
+          "from": "https-browserify@0.0.1",
+          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
         },
         "interpret": {
           "version": "0.6.6",
-          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz",
-          "integrity": "sha1-/s16GOfOXKar+5U+H4YhOknxYls="
+          "from": "interpret@>=0.6.4 <0.7.0",
+          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz"
         },
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "from": "isarray@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
         },
         "memory-fs": {
           "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz",
-          "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
+          "from": "memory-fs@>=0.3.0 <0.4.0",
+          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz"
         },
         "node-libs-browser": {
           "version": "0.7.0",
+          "from": "node-libs-browser@>=0.7.0 <0.8.0",
           "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-0.7.0.tgz",
-          "integrity": "sha1-PicsCBnjCJNeJmdECNevDhSRuDs=",
           "dependencies": {
             "string_decoder": {
               "version": "0.10.31",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
-              "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
+              "from": "string_decoder@^0.10.25",
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
             }
           }
         },
         "os-browserify": {
           "version": "0.2.1",
-          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz",
-          "integrity": "sha1-Y/xMzuXS13Y9Jrv4YBB45sLgBE8="
+          "from": "os-browserify@>=0.2.0 <0.3.0",
+          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
         },
         "readable-stream": {
           "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "from": "readable-stream@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
         },
         "stream-browserify": {
           "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz",
-          "integrity": "sha1-ZiZu5fm9uZQKTkUUyvtDu3Hlyds="
+          "from": "stream-browserify@>=2.0.1 <3.0.0",
+          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
         },
         "string_decoder": {
           "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "from": "string_decoder@>=1.0.0 <1.1.0",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
         },
         "supports-color": {
           "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "from": "supports-color@>=3.1.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
         },
         "timers-browserify": {
           "version": "2.0.2",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz",
-          "integrity": "sha1-q0iDz1l9zVCvIRNJoA+8pWrIa4Y="
+          "from": "timers-browserify@>=2.0.2 <3.0.0",
+          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
         },
         "uglify-js": {
           "version": "2.7.5",
+          "from": "uglify-js@>=2.7.3 <2.8.0",
           "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.7.5.tgz",
-          "integrity": "sha1-RhLAx7qu4rp8SH3kkErhIgefLKg=",
           "dependencies": {
             "async": {
               "version": "0.2.10",
-              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz",
-              "integrity": "sha1-trvgsGdLnXGXCMo43owjfLUmw9E="
+              "from": "async@>=0.2.6 <0.3.0",
+              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz"
             }
           }
         },
         "url": {
           "version": "0.11.0",
+          "from": "url@>=0.11.0 <0.12.0",
           "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
-          "integrity": "sha1-ODjpfPxgUh63PFJajlW/3Z4uKPE=",
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
-              "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
+              "from": "punycode@1.3.2",
+              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
             }
           }
         },
         "vinyl": {
           "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz",
-          "integrity": "sha1-XIgDbPVl5d8FVYv8kR+GVt8hiIQ="
+          "from": "vinyl@>=1.1.0 <2.0.0",
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz"
         },
         "webpack": {
           "version": "1.15.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.15.0.tgz",
-          "integrity": "sha1-T/MfU9sDM55VFkqdRo7gMklo/pg="
+          "from": "webpack@>=1.12.9 <2.0.0",
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.15.0.tgz"
         },
         "window-size": {
           "version": "0.1.0",
-          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
-          "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
+          "from": "window-size@0.1.0",
+          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz"
         },
         "wordwrap": {
           "version": "0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
-          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
+          "from": "wordwrap@0.0.2",
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz"
         },
         "yargs": {
           "version": "3.10.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
-          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
+          "from": "yargs@>=3.10.0 <3.11.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz"
         }
       }
     },
     "webpack-visualizer-plugin": {
       "version": "0.1.11",
+      "from": "webpack-visualizer-plugin@>=0.1.5 <0.2.0",
       "resolved": "https://registry.npmjs.org/webpack-visualizer-plugin/-/webpack-visualizer-plugin-0.1.11.tgz",
-      "integrity": "sha1-uHcK2GtPZSYSxosbeCJT+vn4o04=",
       "dependencies": {
         "react": {
           "version": "0.14.9",
-          "resolved": "https://registry.npmjs.org/react/-/react-0.14.9.tgz",
-          "integrity": "sha1-kRCmSXxJ1EuhwO3TF67CnC4NkdE="
+          "from": "react@>=0.14.0 <0.15.0",
+          "resolved": "https://registry.npmjs.org/react/-/react-0.14.9.tgz"
         },
         "react-dom": {
           "version": "0.14.9",
-          "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-0.14.9.tgz",
-          "integrity": "sha1-BQZKPc8PsYgKOyv8nVjFXY2fYpM="
+          "from": "react-dom@>=0.14.0 <0.15.0",
+          "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-0.14.9.tgz"
         }
       }
     },
     "websocket-driver": {
       "version": "0.6.5",
-      "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.6.5.tgz",
-      "integrity": "sha1-XLJVbOuF9Dc8bYI4qmkchFThOjY="
+      "from": "websocket-driver@>=0.5.1",
+      "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.6.5.tgz"
     },
     "websocket-extensions": {
       "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.1.tgz",
-      "integrity": "sha1-domUmcGEtu91Q3fC27DNbLVdKec="
+      "from": "websocket-extensions@>=0.1.1",
+      "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.1.tgz"
     },
     "whatwg-fetch": {
       "version": "0.9.0",
-      "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-0.9.0.tgz",
-      "integrity": "sha1-DjaExsuZlbQ+/J3wPkw2XZX9nMA="
+      "from": "whatwg-fetch@>=0.9.0 <0.10.0",
+      "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-0.9.0.tgz"
     },
     "whet.extend": {
       "version": "0.9.9",
-      "resolved": "https://registry.npmjs.org/whet.extend/-/whet.extend-0.9.9.tgz",
-      "integrity": "sha1-+HfVv2SMl+WqVC+twW1qJZucEaE="
+      "from": "whet.extend@>=0.9.9 <0.10.0",
+      "resolved": "https://registry.npmjs.org/whet.extend/-/whet.extend-0.9.9.tgz"
     },
     "which": {
       "version": "1.2.14",
-      "resolved": "https://registry.npmjs.org/which/-/which-1.2.14.tgz",
-      "integrity": "sha1-mofEN48D6CfOyvGs31bHNsAcFOU="
+      "from": "which@>=1.2.12 <2.0.0",
+      "resolved": "https://registry.npmjs.org/which/-/which-1.2.14.tgz"
     },
     "which-module": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/which-module/-/which-module-1.0.0.tgz",
-      "integrity": "sha1-u6Y8qGGUiZT/MHc2CJ47lgJsKk8="
+      "from": "which-module@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/which-module/-/which-module-1.0.0.tgz"
     },
     "wide-align": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/wide-align/-/wide-align-1.1.2.tgz",
-      "integrity": "sha512-ijDLlyQ7s6x1JgCLur53osjm/UXUYD9+0PbYKrBsYisYXzCxN+HC3mYDNy/dWdmf3AwqwU3CXwDCvsNgGK1S0w=="
+      "from": "wide-align@>=1.1.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/wide-align/-/wide-align-1.1.2.tgz"
     },
     "widest-line": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/widest-line/-/widest-line-1.0.0.tgz",
-      "integrity": "sha1-DAnIXCqUaD0Nfq+O4JfVZL8OEFw="
+      "from": "widest-line@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/widest-line/-/widest-line-1.0.0.tgz"
     },
     "window-size": {
       "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.2.0.tgz",
-      "integrity": "sha1-tDFbtCFKPXBY6+7okuE/ok2YsHU="
+      "from": "window-size@>=0.2.0 <0.3.0",
+      "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.2.0.tgz"
     },
     "wordwrap": {
       "version": "0.0.3",
-      "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.3.tgz",
-      "integrity": "sha1-o9XabNXAvAAI03I0u68b7WMFkQc="
+      "from": "wordwrap@>=0.0.2 <0.1.0",
+      "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.3.tgz"
     },
     "wrap-ansi": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
-      "integrity": "sha1-2Pw9KE3QV5T+hJc8rs3Rz4JP3YU="
+      "from": "wrap-ansi@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz"
     },
     "wrappy": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
-      "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8="
+      "from": "wrappy@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz"
     },
     "write-file-atomic": {
       "version": "1.3.4",
-      "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-1.3.4.tgz",
-      "integrity": "sha1-+Aek8LHZ6ROuekgRLmzDrxmRtF8="
+      "from": "write-file-atomic@>=1.1.2 <2.0.0",
+      "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-1.3.4.tgz"
     },
     "ws": {
       "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-1.1.4.tgz",
-      "integrity": "sha1-V/QNA2gy5fUFVmKjl8Tedu1mv2E="
+      "from": "ws@1.1.4",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-1.1.4.tgz"
     },
     "wtf-8": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/wtf-8/-/wtf-8-1.0.0.tgz",
-      "integrity": "sha1-OS2LotDxw00e4tYw8V0O+2jhBIo="
+      "from": "wtf-8@1.0.0",
+      "resolved": "https://registry.npmjs.org/wtf-8/-/wtf-8-1.0.0.tgz"
     },
     "xdg-basedir": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-2.0.0.tgz",
-      "integrity": "sha1-7byQPMOF/ARSPZZqM1UEtVBNG9I="
+      "from": "xdg-basedir@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-2.0.0.tgz"
     },
     "xml": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/xml/-/xml-1.0.1.tgz",
-      "integrity": "sha1-eLpyAgApxbyHuKgaPPzXS0ovweU="
+      "from": "xml@>=1.0.1 <1.1.0",
+      "resolved": "https://registry.npmjs.org/xml/-/xml-1.0.1.tgz"
     },
     "xml-char-classes": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/xml-char-classes/-/xml-char-classes-1.0.0.tgz",
-      "integrity": "sha1-ZGV4SKIP/F31g6Qq2KJ3tFErvE0="
+      "from": "xml-char-classes@>=1.0.0 <2.0.0",
+      "resolved": "https://registry.npmjs.org/xml-char-classes/-/xml-char-classes-1.0.0.tgz"
     },
     "xml2js": {
       "version": "0.2.7",
-      "resolved": "https://registry.npmjs.org/xml2js/-/xml2js-0.2.7.tgz",
-      "integrity": "sha1-GDhRi7AXQcrgh4urSRXklMMjBq8="
+      "from": "xml2js@0.2.7",
+      "resolved": "https://registry.npmjs.org/xml2js/-/xml2js-0.2.7.tgz"
     },
     "xmlbuilder": {
       "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/xmlbuilder/-/xmlbuilder-0.4.3.tgz",
-      "integrity": "sha1-xGFLp04K0ZbmCcknLNnh3bKKilg="
+      "from": "xmlbuilder@0.4.3",
+      "resolved": "https://registry.npmjs.org/xmlbuilder/-/xmlbuilder-0.4.3.tgz"
     },
     "xmlhttprequest-ssl": {
       "version": "1.5.3",
-      "resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-1.5.3.tgz",
-      "integrity": "sha1-GFqIjATspGw+QHDZn3tJ3jUomS0="
+      "from": "xmlhttprequest-ssl@1.5.3",
+      "resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-1.5.3.tgz"
     },
     "xregexp": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/xregexp/-/xregexp-2.0.0.tgz",
-      "integrity": "sha1-UqY+VsoLhKfzpfPWGHLxJq16WUM="
+      "from": "xregexp@2.0.0",
+      "resolved": "https://registry.npmjs.org/xregexp/-/xregexp-2.0.0.tgz"
     },
     "xtend": {
       "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.1.tgz",
-      "integrity": "sha1-pcbVMr5lbiPbgg77lDofBJmNY68="
+      "from": "xtend@>=4.0.1 <4.1.0",
+      "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.1.tgz"
     },
     "y18n": {
       "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/y18n/-/y18n-3.2.1.tgz",
-      "integrity": "sha1-bRX7qITAhnnA136I53WegR4H+kE="
+      "from": "y18n@>=3.2.1 <4.0.0",
+      "resolved": "https://registry.npmjs.org/y18n/-/y18n-3.2.1.tgz"
     },
     "yallist": {
       "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-2.1.2.tgz",
-      "integrity": "sha1-HBH5IY8HYImkfdUS+TxmmaaoHVI="
+      "from": "yallist@>=2.0.0 <3.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-2.1.2.tgz"
     },
     "yargs": {
       "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz",
-      "integrity": "sha1-y0BQwBWb+2u2ScD0r1UFJqhGGdw="
+      "from": "yargs@>=4.6.0 <4.7.0",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz"
     },
     "yargs-parser": {
       "version": "2.4.1",
+      "from": "yargs-parser@>=2.4.0 <3.0.0",
       "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-2.4.1.tgz",
-      "integrity": "sha1-hVaN488VD/SfpRgl8DqMiA3cxcQ=",
       "dependencies": {
         "camelcase": {
           "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
-          "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
+          "from": "camelcase@>=3.0.0 <4.0.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
         }
       }
     },
     "yauzl": {
       "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/yauzl/-/yauzl-2.4.1.tgz",
-      "integrity": "sha1-lSj0QtqxsihOWLQ3m7GU4i4MQAU="
+      "from": "yauzl@2.4.1",
+      "resolved": "https://registry.npmjs.org/yauzl/-/yauzl-2.4.1.tgz"
     },
     "yeast": {
       "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/yeast/-/yeast-0.1.2.tgz",
-      "integrity": "sha1-AI4G2AlDIMNy28L47XagymyKxBk="
+      "from": "yeast@0.1.2",
+      "resolved": "https://registry.npmjs.org/yeast/-/yeast-0.1.2.tgz"
     },
     "z-schema": {
       "version": "3.17.0",
-      "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-3.17.0.tgz",
-      "integrity": "sha1-RCs4+denr3rke/z8NWhz6GFq0bc="
+      "from": "z-schema@>=3.17.0 <3.18.0",
+      "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-3.17.0.tgz"
     }
   }
 }
\ No newline at end of file
diff --git a/package.json b/package.json
index 28ebb32f0eeec..7a84505619937 100644
--- a/package.json
+++ b/package.json
@@ -28,4 +28,4 @@
     "gulp": "^3.9.1",
     "yargs": "^6.5.0"
   }
-}
\ No newline at end of file
+}
diff --git a/rush.json b/rush.json
index 44266d69d03ac..0ef8c259e99da 100644
--- a/rush.json
+++ b/rush.json
@@ -1,5 +1,5 @@
 {
-  "npmVersion": "5.0.0",
+  "npmVersion": "4.6.1",
   "rushMinimumVersion": "3.0.7",
   "nodeSupportedVersionRange": ">=6.9.0 <8.0.0",
   "projectFolderMinDepth": 1,

From 474786c0923202726c72664b797783019974b683 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 29 May 2017 20:15:50 -0700
Subject: [PATCH 0033/1641] Revert "Downgrading npm version since the build
 machines seem to have an issue with the shrinkwrap."

This reverts commit 70f9c1bf808a931cba2cdcccd61b7f4e9244b9bb.
---
 common/config/rush/npm-shrinkwrap.json | 7067 ++++++++++++------------
 package.json                           |    2 +-
 rush.json                              |    2 +-
 3 files changed, 3466 insertions(+), 3605 deletions(-)

diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index e2f93e48306e8..90ef2722f8972 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -1,8901 +1,8762 @@
 {
   "name": "rush-common",
   "version": "0.0.0",
+  "lockfileVersion": 1,
   "dependencies": {
     "@microsoft/api-extractor": {
       "version": "1.1.19",
-      "from": "@microsoft/api-extractor@>=1.1.19 <2.0.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-1.1.19.tgz"
+      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-1.1.19.tgz",
+      "integrity": "sha1-aBrxRDx7s/3xnRnPqvdd2QoD2dI="
     },
     "@microsoft/gulp-core-build": {
       "version": "2.5.3",
-      "from": "@microsoft/gulp-core-build@>=2.4.2 <3.0.0",
       "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.5.3.tgz",
+      "integrity": "sha1-26R2Li/7oxiYdlmTx3d7AVk8/rc=",
       "dependencies": {
         "@types/chai": {
           "version": "3.4.34",
-          "from": "@types/chai@3.4.34",
-          "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz"
+          "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz",
+          "integrity": "sha1-1TNXkoI7sJzd1eOMPSEbcJGDhU0="
         },
         "@types/mocha": {
           "version": "2.2.38",
-          "from": "@types/mocha@2.2.38",
-          "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz"
+          "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz",
+          "integrity": "sha1-jBiPbjTC58Px0BJ9kI1aNuWmDck="
         },
         "rimraf": {
           "version": "2.5.4",
-          "from": "rimraf@>=2.5.4 <2.6.0",
-          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz"
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
+          "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
         }
       }
     },
     "@microsoft/gulp-core-build-karma": {
       "version": "2.2.2",
-      "from": "@microsoft/gulp-core-build-karma@>=2.1.2 <3.0.0",
       "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-karma/-/gulp-core-build-karma-2.2.2.tgz",
+      "integrity": "sha1-L910uWl7x2VZjGwrOCxR9XBhSmg=",
       "dependencies": {
         "camelcase": {
           "version": "1.2.1",
-          "from": "camelcase@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
+          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
         },
         "cliui": {
           "version": "2.1.0",
-          "from": "cliui@>=2.1.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
+          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE="
         },
         "interpret": {
           "version": "0.6.6",
-          "from": "interpret@>=0.6.4 <0.7.0",
-          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz"
+          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz",
+          "integrity": "sha1-/s16GOfOXKar+5U+H4YhOknxYls="
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "karma-sinon-chai": {
           "version": "1.2.4",
-          "from": "karma-sinon-chai@>=1.2.0 <1.3.0",
           "resolved": "https://registry.npmjs.org/karma-sinon-chai/-/karma-sinon-chai-1.2.4.tgz",
+          "integrity": "sha1-/qk19ivjNmzwJxyNi+UcDHDkCrw=",
           "dependencies": {
             "lolex": {
               "version": "1.6.0",
-              "from": "lolex@>=1.5.0 <2.0.0",
-              "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz"
+              "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
+              "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
             }
           }
         },
         "memory-fs": {
           "version": "0.3.0",
-          "from": "memory-fs@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz",
+          "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "sinon": {
           "version": "1.17.7",
-          "from": "sinon@>=1.17.3 <1.18.0",
           "resolved": "https://registry.npmjs.org/sinon/-/sinon-1.17.7.tgz",
+          "integrity": "sha1-RUKk9JugxFwF6y6d2dID4rjv4L8=",
           "dependencies": {
             "lolex": {
               "version": "1.3.2",
-              "from": "lolex@1.3.2",
-              "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.3.2.tgz"
+              "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.3.2.tgz",
+              "integrity": "sha1-fD2mL/yzDw9agKJWbKJORdigHzE="
             }
           }
         },
         "sinon-chai": {
           "version": "2.8.0",
-          "from": "sinon-chai@>=2.8.0 <2.9.0",
-          "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.8.0.tgz"
+          "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.8.0.tgz",
+          "integrity": "sha1-Qyqbv9Uab8AHmPTSUmqCnAYGh6w="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         },
         "uglify-js": {
           "version": "2.7.5",
-          "from": "uglify-js@>=2.7.3 <2.8.0",
           "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.7.5.tgz",
+          "integrity": "sha1-RhLAx7qu4rp8SH3kkErhIgefLKg=",
           "dependencies": {
             "async": {
               "version": "0.2.10",
-              "from": "async@>=0.2.6 <0.3.0",
-              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz"
+              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz",
+              "integrity": "sha1-trvgsGdLnXGXCMo43owjfLUmw9E="
             }
           }
         },
         "webpack": {
           "version": "1.13.3",
-          "from": "webpack@>=1.13.0 <1.14.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz"
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz",
+          "integrity": "sha1-55xG/lo3xcpwCEugiUxZXNy0KBU="
         },
         "window-size": {
           "version": "0.1.0",
-          "from": "window-size@0.1.0",
-          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
+          "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
         },
         "wordwrap": {
           "version": "0.0.2",
-          "from": "wordwrap@0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
+          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
         },
         "yargs": {
           "version": "3.10.0",
-          "from": "yargs@>=3.10.0 <3.11.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz"
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
+          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
         }
       }
     },
     "@microsoft/gulp-core-build-sass": {
       "version": "2.0.8",
-      "from": "@microsoft/gulp-core-build-sass@>=2.0.3 <3.0.0",
       "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-2.0.8.tgz",
+      "integrity": "sha1-Xq3URcMEIKuHxvHd5KTc68aKEmQ=",
       "dependencies": {
         "autoprefixer": {
           "version": "6.3.7",
-          "from": "autoprefixer@6.3.7",
-          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz"
+          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz",
+          "integrity": "sha1-jt8xZt2f1hFlM2Ysi7NqA8DvyHQ="
         }
       }
     },
     "@microsoft/gulp-core-build-serve": {
       "version": "2.1.3",
-      "from": "@microsoft/gulp-core-build-serve@>=2.0.3 <3.0.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-serve/-/gulp-core-build-serve-2.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-serve/-/gulp-core-build-serve-2.1.3.tgz",
+      "integrity": "sha1-k9LYWMLwL+3wxZSKal4KQ8XjqCU="
     },
     "@microsoft/gulp-core-build-typescript": {
       "version": "2.4.4",
-      "from": "@microsoft/gulp-core-build-typescript@>=2.4.4 <3.0.0",
       "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-2.4.4.tgz",
+      "integrity": "sha1-DJ7UgdBtZNmv3KpEzsGoVI89tTs=",
       "dependencies": {
         "typescript": {
           "version": "2.1.6",
-          "from": "typescript@>=2.1.4 <2.2.0",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.1.6.tgz"
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.1.6.tgz",
+          "integrity": "sha1-QMfm6eXaeWG3cYtVUF+crJSHpgc="
         }
       }
     },
     "@microsoft/gulp-core-build-webpack": {
       "version": "1.1.6",
-      "from": "@microsoft/gulp-core-build-webpack@>=1.1.2 <2.0.0",
       "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-webpack/-/gulp-core-build-webpack-1.1.6.tgz",
+      "integrity": "sha1-OloimWPldBfH8WPd99iNfPdm8uA=",
       "dependencies": {
         "camelcase": {
           "version": "1.2.1",
-          "from": "camelcase@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
+          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
         },
         "cliui": {
           "version": "2.1.0",
-          "from": "cliui@>=2.1.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
+          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE="
         },
         "interpret": {
           "version": "0.6.6",
-          "from": "interpret@>=0.6.4 <0.7.0",
-          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz"
+          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz",
+          "integrity": "sha1-/s16GOfOXKar+5U+H4YhOknxYls="
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "memory-fs": {
           "version": "0.3.0",
-          "from": "memory-fs@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz",
+          "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         },
         "uglify-js": {
           "version": "2.7.5",
-          "from": "uglify-js@>=2.7.3 <2.8.0",
           "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.7.5.tgz",
+          "integrity": "sha1-RhLAx7qu4rp8SH3kkErhIgefLKg=",
           "dependencies": {
             "async": {
               "version": "0.2.10",
-              "from": "async@>=0.2.6 <0.3.0",
-              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz"
+              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz",
+              "integrity": "sha1-trvgsGdLnXGXCMo43owjfLUmw9E="
             }
           }
         },
         "webpack": {
           "version": "1.13.3",
-          "from": "webpack@>=1.13.0 <1.14.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz"
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz",
+          "integrity": "sha1-55xG/lo3xcpwCEugiUxZXNy0KBU="
         },
         "window-size": {
           "version": "0.1.0",
-          "from": "window-size@0.1.0",
-          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
+          "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
         },
         "wordwrap": {
           "version": "0.0.2",
-          "from": "wordwrap@0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
+          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
         },
         "yargs": {
           "version": "3.10.0",
-          "from": "yargs@>=3.10.0 <3.11.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz"
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
+          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
         }
       }
     },
     "@microsoft/load-themed-styles": {
       "version": "1.4.0",
-      "from": "@microsoft/load-themed-styles@>=1.2.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.4.0.tgz",
+      "integrity": "sha1-GDC9288QFxLKJgIX5Vq3RKUgQdw="
     },
     "@microsoft/loader-cased-file": {
       "version": "1.0.0",
-      "from": "@microsoft/loader-cased-file@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-cased-file/-/loader-cased-file-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-cased-file/-/loader-cased-file-1.0.0.tgz",
+      "integrity": "sha1-2juX73tbnVGI1IT1a+Vs6QRzQSw="
     },
     "@microsoft/loader-load-themed-styles": {
       "version": "0.0.5",
-      "from": "@microsoft/loader-load-themed-styles@>=0.0.5 <0.1.0",
       "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-0.0.5.tgz",
+      "integrity": "sha1-L9eYt4pDdvyRL5ASaI33kX8cofg=",
       "dependencies": {
         "@microsoft/load-themed-styles": {
           "version": "1.2.2",
-          "from": "@microsoft/load-themed-styles@>=1.2.2 <1.3.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.2.2.tgz"
+          "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.2.2.tgz",
+          "integrity": "sha1-+i+hypxPDEliPi5IrTujBSRJWGc="
         }
       }
     },
     "@microsoft/loader-set-webpack-public-path": {
       "version": "0.1.7",
-      "from": "@microsoft/loader-set-webpack-public-path@>=0.1.7 <0.2.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-set-webpack-public-path/-/loader-set-webpack-public-path-0.1.7.tgz"
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-set-webpack-public-path/-/loader-set-webpack-public-path-0.1.7.tgz",
+      "integrity": "sha1-elXNxsfwP05ZZyk+XKLAppxIxLI="
     },
     "@microsoft/rush-lib": {
       "version": "1.8.3",
-      "from": "@microsoft/rush-lib@>=1.8.3 <1.9.0",
       "resolved": "https://registry.npmjs.org/@microsoft/rush-lib/-/rush-lib-1.8.3.tgz",
+      "integrity": "sha1-+40E9QAknaLY7vXhwfj2Guy3t4Y=",
       "dependencies": {
         "@types/chai": {
           "version": "3.4.34",
-          "from": "@types/chai@3.4.34",
-          "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz"
+          "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz",
+          "integrity": "sha1-1TNXkoI7sJzd1eOMPSEbcJGDhU0="
         },
         "@types/fs-extra": {
           "version": "0.0.34",
-          "from": "@types/fs-extra@0.0.34",
-          "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.34.tgz"
+          "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.34.tgz",
+          "integrity": "sha1-Tv8v9bBqWjv8VErdOm7TTN+JIzU="
         },
         "@types/mocha": {
           "version": "2.2.38",
-          "from": "@types/mocha@2.2.38",
-          "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz"
+          "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz",
+          "integrity": "sha1-jBiPbjTC58Px0BJ9kI1aNuWmDck="
         },
         "rimraf": {
           "version": "2.5.4",
-          "from": "rimraf@>=2.5.2 <2.6.0",
-          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz"
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
+          "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
         },
         "semver": {
           "version": "5.2.0",
-          "from": "semver@>=5.2.0 <5.3.0",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.2.0.tgz",
+          "integrity": "sha1-KBmVuAwUSCCUFd28TPUMJpzvVcU="
         }
       }
     },
     "@microsoft/sp-build-common": {
       "version": "1.0.0",
-      "from": "@microsoft/sp-build-common@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/@microsoft/sp-build-common/-/sp-build-common-1.0.0.tgz",
+      "integrity": "sha1-LYMxudMf39F+CmgR9/Q4LQIIYPQ=",
       "dependencies": {
         "@types/yargs": {
           "version": "0.0.35",
-          "from": "@types/yargs@0.0.35",
-          "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.35.tgz"
+          "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.35.tgz",
+          "integrity": "sha1-QHczV2rO1IlfutZ6Pwr2M9Lfy60="
         },
         "@types/z-schema": {
           "version": "3.16.20-alpha",
-          "from": "@types/z-schema@3.16.20-alpha",
-          "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.20-alpha.tgz"
+          "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.20-alpha.tgz",
+          "integrity": "sha1-NvWIzMon2Oht1rtZWpc67eiAN2Y="
         }
       }
     },
     "@microsoft/sp-build-core-tasks": {
       "version": "1.0.1",
-      "from": "@microsoft/sp-build-core-tasks@>=1.0.1 <1.1.0",
       "resolved": "https://registry.npmjs.org/@microsoft/sp-build-core-tasks/-/sp-build-core-tasks-1.0.1.tgz",
+      "integrity": "sha1-lw0TAjg9Sph6HOzM+O47NRQR2k0=",
       "dependencies": {
         "@microsoft/load-themed-styles": {
           "version": "1.2.2",
-          "from": "@microsoft/load-themed-styles@>=1.2.2 <1.3.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.2.2.tgz"
+          "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.2.2.tgz",
+          "integrity": "sha1-+i+hypxPDEliPi5IrTujBSRJWGc="
         },
         "camelcase": {
           "version": "1.2.1",
-          "from": "camelcase@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
+          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
         },
         "cliui": {
           "version": "2.1.0",
-          "from": "cliui@>=2.1.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
+          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE="
         },
         "css-loader": {
           "version": "0.24.0",
-          "from": "css-loader@>=0.24.0 <0.25.0",
-          "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.24.0.tgz"
+          "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.24.0.tgz",
+          "integrity": "sha1-evqvtMD7L5CzNe0Qocd7NNZIQ/4="
         },
         "css-selector-tokenizer": {
           "version": "0.6.0",
-          "from": "css-selector-tokenizer@>=0.6.0 <0.7.0",
-          "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.6.0.tgz"
+          "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.6.0.tgz",
+          "integrity": "sha1-ZEX1gseTDSQdzFAHpD1vy48HMVI="
         },
         "debug": {
           "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "es6-promise": {
           "version": "3.1.2",
-          "from": "es6-promise@3.1.2",
-          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-3.1.2.tgz"
+          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-3.1.2.tgz",
+          "integrity": "sha1-eV4lzrR/e6uyY9FRr77dktGOagc="
         },
         "finalhandler": {
           "version": "0.4.1",
-          "from": "finalhandler@>=0.4.1 <0.5.0",
-          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.4.1.tgz",
+          "integrity": "sha1-haF8bFmpRxfSYtYSMNSw6+PUoU0="
         },
         "glob": {
           "version": "7.0.6",
-          "from": "glob@>=7.0.5 <7.1.0",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.0.6.tgz"
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.0.6.tgz",
+          "integrity": "sha1-IRuvr0nlJbjNkyYNFKsTYVKz9Xo="
         },
         "http-errors": {
           "version": "1.3.1",
-          "from": "http-errors@>=1.3.1 <1.4.0",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
+          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
         },
         "interpret": {
           "version": "0.6.6",
-          "from": "interpret@>=0.6.4 <0.7.0",
-          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz"
+          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz",
+          "integrity": "sha1-/s16GOfOXKar+5U+H4YhOknxYls="
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "memory-fs": {
           "version": "0.3.0",
-          "from": "memory-fs@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz",
+          "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
         },
         "mime": {
           "version": "1.3.4",
-          "from": "mime@1.3.4",
-          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz"
+          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz",
+          "integrity": "sha1-EV+eO2s9rylZmDyzjxSaLUDrXVM="
         },
         "ms": {
           "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         },
         "node-uuid": {
           "version": "1.4.8",
-          "from": "node-uuid@>=1.4.7 <1.5.0",
-          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz"
+          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz",
+          "integrity": "sha1-sEDrCSOWivq/jTL7HxfxFn/auQc="
         },
         "range-parser": {
           "version": "1.0.3",
-          "from": "range-parser@>=1.0.3 <1.1.0",
-          "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.0.3.tgz"
+          "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.0.3.tgz",
+          "integrity": "sha1-aHKCNTXGkuLCoBA4Jq/YLC4P8XU="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "resolve": {
           "version": "1.1.7",
-          "from": "resolve@>=1.1.7 <1.2.0",
-          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz"
+          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz",
+          "integrity": "sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs="
         },
         "rimraf": {
           "version": "2.5.4",
-          "from": "rimraf@>=2.5.2 <2.6.0",
-          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz"
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
+          "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
         },
         "send": {
           "version": "0.13.2",
-          "from": "send@0.13.2",
-          "resolved": "https://registry.npmjs.org/send/-/send-0.13.2.tgz"
+          "resolved": "https://registry.npmjs.org/send/-/send-0.13.2.tgz",
+          "integrity": "sha1-dl52B8gFVFK7pvCwUllTUJhgNt4="
         },
         "serve-static": {
           "version": "1.10.3",
-          "from": "serve-static@>=1.10.2 <1.11.0",
-          "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.10.3.tgz"
+          "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.10.3.tgz",
+          "integrity": "sha1-zlpuzTEB/tXsCYJ9rCKpwpv7BTU="
         },
         "statuses": {
           "version": "1.2.1",
-          "from": "statuses@>=1.2.1 <1.3.0",
-          "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.2.1.tgz",
+          "integrity": "sha1-3e1FzBglbVHtQK7BQkidXGECbSg="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         },
         "uglify-js": {
           "version": "2.7.5",
-          "from": "uglify-js@>=2.7.3 <2.8.0",
           "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.7.5.tgz",
+          "integrity": "sha1-RhLAx7qu4rp8SH3kkErhIgefLKg=",
           "dependencies": {
             "async": {
               "version": "0.2.10",
-              "from": "async@>=0.2.6 <0.3.0",
-              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz"
+              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz",
+              "integrity": "sha1-trvgsGdLnXGXCMo43owjfLUmw9E="
             }
           }
         },
         "webpack": {
           "version": "1.13.3",
-          "from": "webpack@>=1.13.0 <1.14.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz"
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz",
+          "integrity": "sha1-55xG/lo3xcpwCEugiUxZXNy0KBU="
         },
         "window-size": {
           "version": "0.1.0",
-          "from": "window-size@0.1.0",
-          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
+          "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
         },
         "wordwrap": {
           "version": "0.0.2",
-          "from": "wordwrap@0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
+          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
         },
         "yargs": {
           "version": "3.10.0",
-          "from": "yargs@>=3.10.0 <3.11.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz"
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
+          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
         }
       }
     },
     "@microsoft/sp-build-web": {
       "version": "1.0.1",
-      "from": "@microsoft/sp-build-web@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/@microsoft/sp-build-web/-/sp-build-web-1.0.1.tgz",
+      "integrity": "sha1-wLbn7gPT45eH38x9FZAn0UuhaRM=",
       "dependencies": {
         "@types/yargs": {
           "version": "0.0.35",
-          "from": "@types/yargs@0.0.35",
-          "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.35.tgz"
+          "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.35.tgz",
+          "integrity": "sha1-QHczV2rO1IlfutZ6Pwr2M9Lfy60="
         }
       }
     },
     "@microsoft/sp-module-interfaces": {
       "version": "1.0.0",
-      "from": "@microsoft/sp-module-interfaces@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/@microsoft/sp-module-interfaces/-/sp-module-interfaces-1.0.0.tgz",
+      "integrity": "sha1-cHc83IuclD92RemXChcyud8gKbw=",
       "dependencies": {
         "@types/z-schema": {
           "version": "3.16.20-alpha",
-          "from": "@types/z-schema@3.16.20-alpha",
-          "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.20-alpha.tgz"
+          "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.20-alpha.tgz",
+          "integrity": "sha1-NvWIzMon2Oht1rtZWpc67eiAN2Y="
         }
       }
     },
     "@microsoft/sp-polyfills": {
       "version": "1.0.0",
-      "from": "@microsoft/sp-polyfills@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/@microsoft/sp-polyfills/-/sp-polyfills-1.0.0.tgz",
+      "integrity": "sha1-tB/N8Njkgbib46/reNdaBe4Zkqs=",
       "dependencies": {
         "es6-promise": {
           "version": "3.1.2",
-          "from": "es6-promise@3.1.2",
-          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-3.1.2.tgz"
+          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-3.1.2.tgz",
+          "integrity": "sha1-eV4lzrR/e6uyY9FRr77dktGOagc="
         },
         "whatwg-fetch": {
           "version": "0.11.0",
-          "from": "whatwg-fetch@0.11.0",
-          "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-0.11.0.tgz"
+          "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-0.11.0.tgz",
+          "integrity": "sha1-RrHRjQqpmVWXHvGi9arFBq3SiBU="
         }
       }
     },
     "@microsoft/sp-tslint-rules": {
       "version": "1.0.0",
-      "from": "@microsoft/sp-tslint-rules@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/sp-tslint-rules/-/sp-tslint-rules-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/@microsoft/sp-tslint-rules/-/sp-tslint-rules-1.0.0.tgz",
+      "integrity": "sha1-Nas2DM1FUhb4e/YVDljVZlVZsjA="
     },
     "@microsoft/stream-collator": {
       "version": "1.0.2",
-      "from": "@microsoft/stream-collator@>=1.0.2 <1.1.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/stream-collator/-/stream-collator-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/@microsoft/stream-collator/-/stream-collator-1.0.2.tgz",
+      "integrity": "sha1-Qqwrj4yx79VSDd209FGZcBLLgwA="
     },
     "@microsoft/web-library-build": {
       "version": "3.0.2",
-      "from": "@microsoft/web-library-build@>=3.0.0-0 <4.0.0-0",
       "resolved": "https://registry.npmjs.org/@microsoft/web-library-build/-/web-library-build-3.0.2.tgz",
+      "integrity": "sha1-DldYaol/ddjdDAKdKVtBapg4f5w=",
       "dependencies": {
         "@microsoft/api-extractor": {
           "version": "2.0.6",
-          "from": "@microsoft/api-extractor@>=2.0.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.0.6.tgz"
+          "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.0.6.tgz",
+          "integrity": "sha1-BVN2DgbyuUGn9zbjP+wVK1/BQoQ="
         },
         "@microsoft/gulp-core-build-sass": {
           "version": "3.1.2",
-          "from": "@microsoft/gulp-core-build-sass@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.1.2.tgz"
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.1.2.tgz",
+          "integrity": "sha1-msehN3WBLY3s1/BOQrfy1BKjnCc="
         },
         "@microsoft/gulp-core-build-typescript": {
           "version": "3.1.1",
-          "from": "@microsoft/gulp-core-build-typescript@>=3.1.1 <4.0.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.1.1.tgz"
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.1.1.tgz",
+          "integrity": "sha1-e3gdjlKeSQzz5hB5eh+7fuZx01s="
         },
         "ansi-align": {
           "version": "2.0.0",
-          "from": "ansi-align@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-2.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-2.0.0.tgz",
+          "integrity": "sha1-w2rsy6VjuJzrVW82kPCx2eNUf38="
         },
         "autoprefixer": {
           "version": "6.3.7",
-          "from": "autoprefixer@6.3.7",
-          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz"
+          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz",
+          "integrity": "sha1-jt8xZt2f1hFlM2Ysi7NqA8DvyHQ="
         },
         "boxen": {
           "version": "1.1.0",
-          "from": "boxen@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/boxen/-/boxen-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/boxen/-/boxen-1.1.0.tgz",
+          "integrity": "sha1-sbad1SIwXoB6md7ud329blFnsQI="
         },
         "camelcase": {
           "version": "4.1.0",
-          "from": "camelcase@>=4.0.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
+          "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
         },
         "clean-css": {
           "version": "4.1.3",
-          "from": "clean-css@>=4.0.9 <5.0.0",
-          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.3.tgz"
+          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.3.tgz",
+          "integrity": "sha1-B8/omA7bINRV3cI6rc8eBMblCc4="
         },
         "configstore": {
           "version": "3.1.0",
-          "from": "configstore@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.0.tgz",
+          "integrity": "sha1-Rd+QcHPibfoc9LLVL1tgVF6qEdE="
         },
         "dot-prop": {
           "version": "4.1.1",
-          "from": "dot-prop@>=4.1.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-4.1.1.tgz"
+          "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-4.1.1.tgz",
+          "integrity": "sha1-qEk/C3te7sglJbXHWH+n3nyoWcE="
         },
         "findup-sync": {
           "version": "0.3.0",
-          "from": "findup-sync@>=0.3.0 <0.4.0",
           "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.3.0.tgz",
+          "integrity": "sha1-N5MKpdgWt3fANEXhlmzGeQpMCxY=",
           "dependencies": {
             "glob": {
               "version": "5.0.15",
-              "from": "glob@>=5.0.0 <5.1.0",
-              "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
+              "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
+              "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
             }
           }
         },
         "got": {
           "version": "6.7.1",
-          "from": "got@>=6.7.1 <7.0.0",
-          "resolved": "https://registry.npmjs.org/got/-/got-6.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/got/-/got-6.7.1.tgz",
+          "integrity": "sha1-JAzQV4WpoY5WHcG0S0HHY+8ejbA="
         },
         "gulp-clean-css": {
           "version": "3.0.4",
-          "from": "gulp-clean-css@>=3.0.4 <3.1.0",
-          "resolved": "https://registry.npmjs.org/gulp-clean-css/-/gulp-clean-css-3.0.4.tgz"
+          "resolved": "https://registry.npmjs.org/gulp-clean-css/-/gulp-clean-css-3.0.4.tgz",
+          "integrity": "sha1-DFrY0EVAfIjzwrnwNXCWOWfc/VQ="
         },
         "gulp-postcss": {
           "version": "6.3.0",
-          "from": "gulp-postcss@>=6.3.0 <6.4.0",
-          "resolved": "https://registry.npmjs.org/gulp-postcss/-/gulp-postcss-6.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/gulp-postcss/-/gulp-postcss-6.3.0.tgz",
+          "integrity": "sha1-M+6XI+WcMC8z1wf8S3OYsQ8DK/8="
         },
         "gulp-sass": {
           "version": "3.1.0",
-          "from": "gulp-sass@>=3.1.0 <3.2.0",
-          "resolved": "https://registry.npmjs.org/gulp-sass/-/gulp-sass-3.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/gulp-sass/-/gulp-sass-3.1.0.tgz",
+          "integrity": "sha1-U9xLaKH13f5EJKtMJHZVJpqLdLc="
         },
         "is-fullwidth-code-point": {
           "version": "2.0.0",
-          "from": "is-fullwidth-code-point@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
+          "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8="
         },
         "latest-version": {
           "version": "3.1.0",
-          "from": "latest-version@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-3.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-3.1.0.tgz",
+          "integrity": "sha1-ogU4P+oyKzO1rjsYq+4NwvNW7hU="
         },
         "lazy-req": {
           "version": "2.0.0",
-          "from": "lazy-req@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/lazy-req/-/lazy-req-2.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/lazy-req/-/lazy-req-2.0.0.tgz",
+          "integrity": "sha1-yUUKNj7N2i5vDHATKtTzf48G8rQ="
         },
         "package-json": {
           "version": "4.0.1",
-          "from": "package-json@>=4.0.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/package-json/-/package-json-4.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/package-json/-/package-json-4.0.1.tgz",
+          "integrity": "sha1-iGmgQBJTZhxMTKPabCEh7VVfXu0="
         },
         "postcss-modules": {
           "version": "0.6.4",
-          "from": "postcss-modules@>=0.6.4 <0.7.0",
-          "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.6.4.tgz"
+          "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.6.4.tgz",
+          "integrity": "sha1-d6WLt3uhtDkrJwwLWYUv116JqLQ="
         },
         "string-width": {
           "version": "2.0.0",
-          "from": "string-width@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.0.0.tgz",
+          "integrity": "sha1-Y1xUNsxypuDDh87KJ41OLuxSaH4="
         },
         "timed-out": {
           "version": "4.0.1",
-          "from": "timed-out@>=4.0.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-4.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-4.0.1.tgz",
+          "integrity": "sha1-8y6srFoXW+ol1/q1Zas+2HQe9W8="
         },
         "tslint": {
           "version": "4.5.1",
-          "from": "tslint@>=4.5.1 <4.6.0",
-          "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.5.1.tgz"
+          "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.5.1.tgz",
+          "integrity": "sha1-BTVocb7yOkNJBnNABvwYgza6gks="
         },
         "typescript": {
           "version": "2.2.2",
-          "from": "typescript@>=2.2.2 <2.3.0",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz",
+          "integrity": "sha1-YGAiUIR5tV/6NotY/uljoD39eww="
         },
         "unzip-response": {
           "version": "2.0.1",
-          "from": "unzip-response@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-2.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-2.0.1.tgz",
+          "integrity": "sha1-0vD3N9FrBhXnKmk17QQhRXLVb5c="
         },
         "update-notifier": {
           "version": "2.1.0",
-          "from": "update-notifier@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-2.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-2.1.0.tgz",
+          "integrity": "sha1-7AweU1NrdmR6JLd8uDlm2TFRI9k="
         },
         "write-file-atomic": {
           "version": "2.1.0",
-          "from": "write-file-atomic@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.1.0.tgz",
+          "integrity": "sha512-0TZ20a+xcIl4u0+Mj5xDH2yOWdmQiXlKf9Hm+TgDXjTMsEYb+gDrmb8e8UNAzMCitX8NBqG4Z/FUQIyzv/R1JQ=="
         },
         "xdg-basedir": {
           "version": "3.0.0",
-          "from": "xdg-basedir@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-3.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-3.0.0.tgz",
+          "integrity": "sha1-SWsswQnsqNus/i3HK2A8F8WHCtQ="
         }
       }
     },
     "@rush-temp/example-app-base": {
-      "version": "0.0.0",
-      "from": "projects/example-app-base",
-      "resolved": "file:projects/example-app-base",
+      "version": "file:projects/example-app-base",
       "dependencies": {
         "async": {
           "version": "0.9.2",
-          "from": "async@>=0.9.0 <0.10.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+          "bundled": true
         },
         "debug": {
           "version": "2.6.0",
-          "from": "debug@2.6.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
+          "bundled": true
+        },
+        "es6-promise": {
+          "version": "4.1.0",
+          "bundled": true
         },
         "glob": {
           "version": "7.1.1",
-          "from": "glob@7.1.1",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
+          "bundled": true
         },
         "mocha": {
           "version": "3.3.0",
-          "from": "mocha@>=3.3.0 <3.4.0",
-          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz"
+          "bundled": true
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "bundled": true
         },
         "source-map": {
           "version": "0.1.43",
-          "from": "source-map@>=0.1.33 <0.2.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
+          "bundled": true
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "from": "source-map-loader@0.2.1",
-          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
+          "bundled": true
         },
         "supports-color": {
           "version": "3.1.2",
-          "from": "supports-color@3.1.2",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
+          "bundled": true
         },
         "typescript": {
           "version": "2.2.2",
-          "from": "typescript@2.2.2",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
+          "bundled": true
         }
       }
     },
     "@rush-temp/example-component": {
-      "version": "0.0.0",
-      "from": "projects/example-component",
-      "resolved": "file:projects/example-component",
+      "version": "file:projects/example-component",
       "dependencies": {
         "acorn": {
           "version": "5.0.3",
-          "from": "acorn@>=5.0.0 <6.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
+          "bundled": true
         },
         "async": {
           "version": "2.4.1",
-          "from": "async@>=2.1.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+          "bundled": true
         },
         "camelcase": {
           "version": "3.0.0",
-          "from": "camelcase@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
+          "bundled": true
         },
         "constants-browserify": {
           "version": "1.0.0",
-          "from": "constants-browserify@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
+          "bundled": true
         },
         "crypto-browserify": {
           "version": "3.11.0",
-          "from": "crypto-browserify@>=3.11.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
+          "bundled": true
         },
         "debug": {
           "version": "2.6.0",
-          "from": "debug@2.6.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
+          "bundled": true
         },
         "enhanced-resolve": {
           "version": "3.1.0",
-          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
+          "bundled": true
         },
         "glob": {
           "version": "7.1.1",
-          "from": "glob@7.1.1",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
+          "bundled": true
         },
         "https-browserify": {
           "version": "0.0.1",
-          "from": "https-browserify@0.0.1",
-          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
+          "bundled": true
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "bundled": true
         },
         "mocha": {
           "version": "3.4.2",
-          "from": "mocha@>=3.2.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.4.2.tgz"
+          "bundled": true
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "bundled": true
         },
         "node-libs-browser": {
           "version": "2.0.0",
-          "from": "node-libs-browser@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
+          "bundled": true
         },
         "os-browserify": {
           "version": "0.2.1",
-          "from": "os-browserify@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
+          "bundled": true
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "bundled": true,
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "from": "string_decoder@>=1.0.0 <1.1.0",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+              "bundled": true
             }
           }
         },
         "stream-browserify": {
           "version": "2.0.1",
-          "from": "stream-browserify@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
+          "bundled": true
         },
         "supports-color": {
           "version": "3.1.2",
-          "from": "supports-color@3.1.2",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
+          "bundled": true
         },
         "tapable": {
           "version": "0.2.6",
-          "from": "tapable@>=0.2.5 <0.3.0",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
+          "bundled": true
         },
         "timers-browserify": {
           "version": "2.0.2",
-          "from": "timers-browserify@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
+          "bundled": true
         },
         "typescript": {
           "version": "2.2.2",
-          "from": "typescript@2.2.2",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
+          "bundled": true
         },
         "url": {
           "version": "0.11.0",
-          "from": "url@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
+          "bundled": true,
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "from": "punycode@1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
+              "bundled": true
             }
           }
         },
         "watchpack": {
           "version": "1.3.1",
-          "from": "watchpack@>=1.3.1 <2.0.0",
-          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz"
+          "bundled": true
         },
         "webpack": {
           "version": "2.6.1",
-          "from": "webpack@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz"
+          "bundled": true
         },
         "yargs": {
           "version": "6.6.0",
-          "from": "yargs@>=6.0.0 <7.0.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
+          "bundled": true
         },
         "yargs-parser": {
           "version": "4.2.1",
-          "from": "yargs-parser@>=4.2.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
+          "bundled": true
         }
       }
     },
     "@rush-temp/fabric-website": {
-      "version": "0.0.0",
-      "from": "projects/fabric-website",
-      "resolved": "file:projects/fabric-website",
+      "version": "file:projects/fabric-website",
       "dependencies": {
         "async": {
           "version": "0.9.2",
-          "from": "async@>=0.9.0 <0.10.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+          "bundled": true
         },
         "debug": {
           "version": "2.6.0",
-          "from": "debug@2.6.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
+          "bundled": true
+        },
+        "es6-promise": {
+          "version": "4.1.0",
+          "bundled": true
         },
         "glob": {
           "version": "7.1.1",
-          "from": "glob@7.1.1",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
+          "bundled": true
         },
         "mocha": {
           "version": "3.3.0",
-          "from": "mocha@>=3.3.0 <3.4.0",
-          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz"
+          "bundled": true
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "bundled": true
         },
         "source-map": {
           "version": "0.1.43",
-          "from": "source-map@>=0.1.33 <0.2.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
+          "bundled": true
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "from": "source-map-loader@0.2.1",
-          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
+          "bundled": true
         },
         "supports-color": {
           "version": "3.1.2",
-          "from": "supports-color@3.1.2",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
+          "bundled": true
         },
         "typescript": {
           "version": "2.2.2",
-          "from": "typescript@2.2.2",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
+          "bundled": true
         }
       }
     },
     "@rush-temp/office-ui-fabric-react": {
-      "version": "0.0.0",
-      "from": "projects/office-ui-fabric-react",
-      "resolved": "file:projects/office-ui-fabric-react",
+      "version": "file:projects/office-ui-fabric-react",
       "dependencies": {
         "acorn": {
           "version": "5.0.3",
-          "from": "acorn@>=5.0.0 <6.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
+          "bundled": true
         },
         "async": {
           "version": "0.9.2",
-          "from": "async@>=0.9.0 <0.10.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+          "bundled": true
         },
         "camelcase": {
           "version": "3.0.0",
-          "from": "camelcase@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
+          "bundled": true
         },
         "constants-browserify": {
           "version": "1.0.0",
-          "from": "constants-browserify@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
+          "bundled": true
         },
         "crypto-browserify": {
           "version": "3.11.0",
-          "from": "crypto-browserify@>=3.11.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
+          "bundled": true
         },
         "debug": {
           "version": "2.6.0",
-          "from": "debug@2.6.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
+          "bundled": true
         },
         "enhanced-resolve": {
           "version": "3.1.0",
-          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
+          "bundled": true
+        },
+        "es6-promise": {
+          "version": "4.1.0",
+          "bundled": true
         },
         "glob": {
           "version": "7.1.1",
-          "from": "glob@7.1.1",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
+          "bundled": true
         },
         "https-browserify": {
           "version": "0.0.1",
-          "from": "https-browserify@0.0.1",
-          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
+          "bundled": true
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "bundled": true
         },
         "mocha": {
           "version": "3.4.2",
-          "from": "mocha@>=3.2.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.4.2.tgz"
+          "bundled": true
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "bundled": true
         },
         "node-libs-browser": {
           "version": "2.0.0",
-          "from": "node-libs-browser@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
+          "bundled": true
         },
         "os-browserify": {
           "version": "0.2.1",
-          "from": "os-browserify@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
+          "bundled": true
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "bundled": true,
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "from": "string_decoder@>=1.0.0 <1.1.0",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+              "bundled": true
             }
           }
         },
         "source-map": {
           "version": "0.1.43",
-          "from": "source-map@>=0.1.33 <0.2.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
+          "bundled": true
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "from": "source-map-loader@0.2.1",
-          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
+          "bundled": true
         },
         "stream-browserify": {
           "version": "2.0.1",
-          "from": "stream-browserify@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
+          "bundled": true
         },
         "supports-color": {
           "version": "3.1.2",
-          "from": "supports-color@3.1.2",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
+          "bundled": true
         },
         "tapable": {
           "version": "0.2.6",
-          "from": "tapable@>=0.2.5 <0.3.0",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
+          "bundled": true
         },
         "timers-browserify": {
           "version": "2.0.2",
-          "from": "timers-browserify@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
+          "bundled": true
         },
         "typescript": {
           "version": "2.2.2",
-          "from": "typescript@2.2.2",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
+          "bundled": true
         },
         "url": {
           "version": "0.11.0",
-          "from": "url@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
+          "bundled": true,
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "from": "punycode@1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
+              "bundled": true
             }
           }
         },
         "watchpack": {
           "version": "1.3.1",
-          "from": "watchpack@>=1.3.1 <2.0.0",
-          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz",
+          "bundled": true,
           "dependencies": {
             "async": {
               "version": "2.4.1",
-              "from": "async@>=2.1.2 <3.0.0",
-              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+              "bundled": true
             }
           }
         },
         "webpack": {
           "version": "2.6.1",
-          "from": "webpack@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz",
+          "bundled": true,
           "dependencies": {
             "async": {
               "version": "2.4.1",
-              "from": "async@>=2.1.2 <3.0.0",
-              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+              "bundled": true
             },
             "source-map": {
               "version": "0.5.6",
-              "from": "source-map@^0.5.3",
-              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
+              "bundled": true
             }
           }
         },
         "yargs": {
           "version": "6.6.0",
-          "from": "yargs@>=6.0.0 <7.0.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
+          "bundled": true
         },
         "yargs-parser": {
           "version": "4.2.1",
-          "from": "yargs-parser@>=4.2.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
+          "bundled": true
         }
       }
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
-      "version": "0.0.0",
-      "from": "projects/office-ui-fabric-react-tslint",
-      "resolved": "file:projects/office-ui-fabric-react-tslint"
+      "version": "file:projects/office-ui-fabric-react-tslint"
     },
     "@rush-temp/ssr-tests": {
-      "version": "0.0.0",
-      "from": "projects/ssr-tests",
-      "resolved": "file:projects/ssr-tests",
+      "version": "file:projects/ssr-tests",
       "dependencies": {
         "acorn": {
           "version": "5.0.3",
-          "from": "acorn@>=5.0.0 <6.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
+          "bundled": true
         },
         "async": {
           "version": "2.4.1",
-          "from": "async@>=2.1.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+          "bundled": true
         },
         "camelcase": {
           "version": "3.0.0",
-          "from": "camelcase@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
+          "bundled": true
         },
         "constants-browserify": {
           "version": "1.0.0",
-          "from": "constants-browserify@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
+          "bundled": true
         },
         "crypto-browserify": {
           "version": "3.11.0",
-          "from": "crypto-browserify@>=3.11.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
+          "bundled": true
         },
         "debug": {
           "version": "2.6.0",
-          "from": "debug@2.6.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
+          "bundled": true
         },
         "enhanced-resolve": {
           "version": "3.1.0",
-          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
+          "bundled": true
+        },
+        "es6-promise": {
+          "version": "4.1.0",
+          "bundled": true
         },
         "glob": {
           "version": "7.1.1",
-          "from": "glob@7.1.1",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
+          "bundled": true
         },
         "https-browserify": {
           "version": "0.0.1",
-          "from": "https-browserify@0.0.1",
-          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
+          "bundled": true
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "bundled": true
         },
         "mocha": {
           "version": "3.3.0",
-          "from": "mocha@>=3.3.0 <3.4.0",
-          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz"
+          "bundled": true
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "bundled": true
         },
         "node-libs-browser": {
           "version": "2.0.0",
-          "from": "node-libs-browser@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
+          "bundled": true
         },
         "os-browserify": {
           "version": "0.2.1",
-          "from": "os-browserify@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
+          "bundled": true
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "bundled": true,
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "from": "string_decoder@>=1.0.0 <1.1.0",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+              "bundled": true
             }
           }
         },
         "stream-browserify": {
           "version": "2.0.1",
-          "from": "stream-browserify@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
+          "bundled": true
         },
         "supports-color": {
           "version": "3.1.2",
-          "from": "supports-color@3.1.2",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
+          "bundled": true
         },
         "tapable": {
           "version": "0.2.6",
-          "from": "tapable@>=0.2.5 <0.3.0",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
+          "bundled": true
         },
         "timers-browserify": {
           "version": "2.0.2",
-          "from": "timers-browserify@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
+          "bundled": true
         },
         "url": {
           "version": "0.11.0",
-          "from": "url@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
+          "bundled": true,
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "from": "punycode@1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
+              "bundled": true
             }
           }
         },
         "watchpack": {
           "version": "1.3.1",
-          "from": "watchpack@>=1.3.1 <2.0.0",
-          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz"
+          "bundled": true
         },
         "webpack": {
           "version": "2.6.1",
-          "from": "webpack@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz"
+          "bundled": true
         },
         "yargs": {
           "version": "6.6.0",
-          "from": "yargs@>=6.0.0 <7.0.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
+          "bundled": true
         },
         "yargs-parser": {
           "version": "4.2.1",
-          "from": "yargs-parser@>=4.2.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
+          "bundled": true
         }
       }
     },
     "@rush-temp/styling": {
-      "version": "0.0.0",
-      "from": "projects/styling",
-      "resolved": "file:projects/styling",
+      "version": "file:projects/styling",
       "dependencies": {
         "acorn": {
           "version": "5.0.3",
-          "from": "acorn@>=5.0.0 <6.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
+          "bundled": true
         },
         "async": {
           "version": "0.9.2",
-          "from": "async@>=0.9.0 <0.10.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+          "bundled": true
         },
         "camelcase": {
           "version": "3.0.0",
-          "from": "camelcase@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
+          "bundled": true
         },
         "constants-browserify": {
           "version": "1.0.0",
-          "from": "constants-browserify@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
+          "bundled": true
         },
         "crypto-browserify": {
           "version": "3.11.0",
-          "from": "crypto-browserify@>=3.11.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
+          "bundled": true
         },
         "debug": {
           "version": "2.6.0",
-          "from": "debug@2.6.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
+          "bundled": true
         },
         "enhanced-resolve": {
           "version": "3.1.0",
-          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
+          "bundled": true
+        },
+        "es6-promise": {
+          "version": "4.1.0",
+          "bundled": true
         },
         "glob": {
           "version": "7.1.1",
-          "from": "glob@7.1.1",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
+          "bundled": true
         },
         "https-browserify": {
           "version": "0.0.1",
-          "from": "https-browserify@0.0.1",
-          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
+          "bundled": true
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "bundled": true
         },
         "mocha": {
           "version": "3.4.2",
-          "from": "mocha@>=3.2.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.4.2.tgz"
+          "bundled": true
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "bundled": true
         },
         "node-libs-browser": {
           "version": "2.0.0",
-          "from": "node-libs-browser@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
+          "bundled": true
         },
         "os-browserify": {
           "version": "0.2.1",
-          "from": "os-browserify@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
+          "bundled": true
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "bundled": true,
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "from": "string_decoder@>=1.0.0 <1.1.0",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+              "bundled": true
             }
           }
         },
         "source-map": {
           "version": "0.1.43",
-          "from": "source-map@>=0.1.33 <0.2.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
+          "bundled": true
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "from": "source-map-loader@>=0.2.1 <0.3.0",
-          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
+          "bundled": true
         },
         "stream-browserify": {
           "version": "2.0.1",
-          "from": "stream-browserify@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
+          "bundled": true
         },
         "supports-color": {
           "version": "3.1.2",
-          "from": "supports-color@3.1.2",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
+          "bundled": true
         },
         "tapable": {
           "version": "0.2.6",
-          "from": "tapable@>=0.2.5 <0.3.0",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
+          "bundled": true
         },
         "timers-browserify": {
           "version": "2.0.2",
-          "from": "timers-browserify@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
+          "bundled": true
         },
         "typescript": {
           "version": "2.2.2",
-          "from": "typescript@2.2.2",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
+          "bundled": true
         },
         "url": {
           "version": "0.11.0",
-          "from": "url@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
+          "bundled": true,
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "from": "punycode@1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
+              "bundled": true
             }
           }
         },
         "watchpack": {
           "version": "1.3.1",
-          "from": "watchpack@>=1.3.1 <2.0.0",
-          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz",
+          "bundled": true,
           "dependencies": {
             "async": {
               "version": "2.4.1",
-              "from": "async@>=2.1.2 <3.0.0",
-              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+              "bundled": true
             }
           }
         },
         "webpack": {
           "version": "2.6.1",
-          "from": "webpack@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.6.1.tgz",
+          "bundled": true,
           "dependencies": {
             "async": {
               "version": "2.4.1",
-              "from": "async@>=2.1.2 <3.0.0",
-              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+              "bundled": true
             },
             "source-map": {
               "version": "0.5.6",
-              "from": "source-map@^0.5.3",
-              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
+              "bundled": true
             }
           }
         },
         "yargs": {
           "version": "6.6.0",
-          "from": "yargs@>=6.0.0 <7.0.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
+          "bundled": true
         },
         "yargs-parser": {
           "version": "4.2.1",
-          "from": "yargs-parser@>=4.2.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
+          "bundled": true
         }
       }
     },
     "@rush-temp/test-bundle-button": {
-      "version": "0.0.0",
-      "from": "projects/test-bundle-button",
-      "resolved": "file:projects/test-bundle-button",
+      "version": "file:projects/test-bundle-button",
       "dependencies": {
         "async": {
           "version": "0.9.2",
-          "from": "async@>=0.9.0 <0.10.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+          "bundled": true
         },
         "source-map": {
           "version": "0.1.43",
-          "from": "source-map@>=0.1.33 <0.2.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
+          "bundled": true
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "from": "source-map-loader@>=0.2.1 <0.3.0",
-          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
+          "bundled": true
         }
       }
     },
     "@rush-temp/todo-app": {
-      "version": "0.0.0",
-      "from": "projects/todo-app",
-      "resolved": "file:projects/todo-app",
+      "version": "file:projects/todo-app",
       "dependencies": {
+        "es6-promise": {
+          "version": "4.1.0",
+          "bundled": true
+        },
         "typescript": {
           "version": "2.2.2",
-          "from": "typescript@2.2.2",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
+          "bundled": true
         }
       }
     },
     "@rush-temp/utilities": {
-      "version": "0.0.0",
-      "from": "projects/utilities",
-      "resolved": "file:projects/utilities",
+      "version": "file:projects/utilities",
       "dependencies": {
         "async": {
           "version": "0.9.2",
-          "from": "async@>=0.9.0 <0.10.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+          "bundled": true
         },
         "debug": {
           "version": "2.6.0",
-          "from": "debug@2.6.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz"
+          "bundled": true
+        },
+        "es6-promise": {
+          "version": "4.1.0",
+          "bundled": true
         },
         "glob": {
           "version": "7.1.1",
-          "from": "glob@7.1.1",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz"
+          "bundled": true
         },
         "mocha": {
           "version": "3.3.0",
-          "from": "mocha@>=3.3.0 <3.4.0",
-          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz"
+          "bundled": true
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "bundled": true
         },
         "source-map": {
           "version": "0.1.43",
-          "from": "source-map@>=0.1.33 <0.2.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
+          "bundled": true
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "from": "source-map-loader@>=0.2.1 <0.3.0",
-          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz"
+          "bundled": true
         },
         "supports-color": {
           "version": "3.1.2",
-          "from": "supports-color@3.1.2",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz"
+          "bundled": true
         },
         "typescript": {
           "version": "2.2.2",
-          "from": "typescript@2.2.2",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz"
+          "bundled": true
         }
       }
     },
     "@types/assertion-error": {
       "version": "1.0.30",
-      "from": "@types/assertion-error@1.0.30",
-      "resolved": "https://registry.npmjs.org/@types/assertion-error/-/assertion-error-1.0.30.tgz"
+      "resolved": "https://registry.npmjs.org/@types/assertion-error/-/assertion-error-1.0.30.tgz",
+      "integrity": "sha1-89DV2i7Ie1FOMNs/+aAYh7VhnCk="
     },
     "@types/bluebird": {
       "version": "3.5.4",
-      "from": "@types/bluebird@*",
-      "resolved": "https://registry.npmjs.org/@types/bluebird/-/bluebird-3.5.4.tgz"
+      "resolved": "https://registry.npmjs.org/@types/bluebird/-/bluebird-3.5.4.tgz",
+      "integrity": "sha1-8SAWKwT9bVXhA0bX4ulu7UYrAs8="
     },
     "@types/chai": {
       "version": "3.5.2",
-      "from": "@types/chai@>=3.4.35 <4.0.0",
-      "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.5.2.tgz"
+      "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.5.2.tgz",
+      "integrity": "sha1-wRzSgX06QBt7oPWkIPNcVhObHB4="
     },
     "@types/chalk": {
       "version": "0.4.31",
-      "from": "@types/chalk@0.4.31",
-      "resolved": "https://registry.npmjs.org/@types/chalk/-/chalk-0.4.31.tgz"
+      "resolved": "https://registry.npmjs.org/@types/chalk/-/chalk-0.4.31.tgz",
+      "integrity": "sha1-ox10JBprHtu5c8822XooloNKUfk="
     },
     "@types/cheerio": {
       "version": "0.22.1",
-      "from": "@types/cheerio@*",
-      "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.1.tgz"
+      "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.1.tgz",
+      "integrity": "sha1-dAxM2MTT8wdPg7mrYucR6sLHZM4="
     },
     "@types/colors": {
       "version": "1.1.1",
-      "from": "@types/colors@1.1.1",
-      "resolved": "https://registry.npmjs.org/@types/colors/-/colors-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/@types/colors/-/colors-1.1.1.tgz",
+      "integrity": "sha1-SXM5KPtHzxElS3YR4vb4X/YCBSE="
     },
     "@types/enzyme": {
       "version": "2.8.0",
-      "from": "@types/enzyme@>=2.7.5 <3.0.0",
-      "resolved": "https://registry.npmjs.org/@types/enzyme/-/enzyme-2.8.0.tgz"
+      "resolved": "https://registry.npmjs.org/@types/enzyme/-/enzyme-2.8.0.tgz",
+      "integrity": "sha1-hMYgTPiYMSI6iattw/SQseCIY1I="
     },
     "@types/es6-collections": {
       "version": "0.5.29",
-      "from": "@types/es6-collections@0.5.29",
-      "resolved": "https://registry.npmjs.org/@types/es6-collections/-/es6-collections-0.5.29.tgz"
+      "resolved": "https://registry.npmjs.org/@types/es6-collections/-/es6-collections-0.5.29.tgz",
+      "integrity": "sha1-7CKDH36N5zY3vxVmD52MomlGmA0="
     },
     "@types/es6-promise": {
       "version": "0.0.32",
-      "from": "@types/es6-promise@>=0.0.32 <0.0.33",
-      "resolved": "https://registry.npmjs.org/@types/es6-promise/-/es6-promise-0.0.32.tgz"
+      "resolved": "https://registry.npmjs.org/@types/es6-promise/-/es6-promise-0.0.32.tgz",
+      "integrity": "sha1-O89E+x5Cnz33YYjIxth0Rjujcf0="
     },
     "@types/express": {
       "version": "4.0.35",
-      "from": "@types/express@*",
-      "resolved": "https://registry.npmjs.org/@types/express/-/express-4.0.35.tgz"
+      "resolved": "https://registry.npmjs.org/@types/express/-/express-4.0.35.tgz",
+      "integrity": "sha1-YmfHtgpR+sRzRns8SgLNHkQYBf4="
     },
     "@types/express-serve-static-core": {
       "version": "4.0.45",
-      "from": "@types/express-serve-static-core@*",
-      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.0.45.tgz"
+      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.0.45.tgz",
+      "integrity": "sha1-cbsfh9cYdILQ2IUfWylEWOHHhmc="
     },
     "@types/finalhandler": {
       "version": "0.0.31",
-      "from": "@types/finalhandler@0.0.31",
-      "resolved": "https://registry.npmjs.org/@types/finalhandler/-/finalhandler-0.0.31.tgz"
+      "resolved": "https://registry.npmjs.org/@types/finalhandler/-/finalhandler-0.0.31.tgz",
+      "integrity": "sha1-7PMvOpu0Om+0BFdQ6h5VJYLTXcM="
     },
     "@types/fs-extra": {
       "version": "0.0.37",
-      "from": "@types/fs-extra@0.0.37",
-      "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.37.tgz"
+      "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.37.tgz",
+      "integrity": "sha1-GV8RvNmhuX2eQSxrZombVFRxofc="
     },
     "@types/glob": {
       "version": "5.0.30",
-      "from": "@types/glob@5.0.30",
-      "resolved": "https://registry.npmjs.org/@types/glob/-/glob-5.0.30.tgz"
+      "resolved": "https://registry.npmjs.org/@types/glob/-/glob-5.0.30.tgz",
+      "integrity": "sha1-ECZAnFYlqGiQdGAoCNCCsoZ7ilE="
     },
     "@types/gulp": {
       "version": "3.8.32",
-      "from": "@types/gulp@3.8.32",
-      "resolved": "https://registry.npmjs.org/@types/gulp/-/gulp-3.8.32.tgz"
+      "resolved": "https://registry.npmjs.org/@types/gulp/-/gulp-3.8.32.tgz",
+      "integrity": "sha1-g8WcaBzCM9Hsf4LSaVVVZvoTMVY="
     },
     "@types/gulp-replace": {
       "version": "0.0.29",
-      "from": "@types/gulp-replace@0.0.29",
-      "resolved": "https://registry.npmjs.org/@types/gulp-replace/-/gulp-replace-0.0.29.tgz"
+      "resolved": "https://registry.npmjs.org/@types/gulp-replace/-/gulp-replace-0.0.29.tgz",
+      "integrity": "sha1-gFqGw0pcz8+IS8E24GgzHkj5tls="
     },
     "@types/gulp-util": {
       "version": "3.0.30",
-      "from": "@types/gulp-util@3.0.30",
-      "resolved": "https://registry.npmjs.org/@types/gulp-util/-/gulp-util-3.0.30.tgz"
+      "resolved": "https://registry.npmjs.org/@types/gulp-util/-/gulp-util-3.0.30.tgz",
+      "integrity": "sha1-TF9lg6IWCBOWZ+OsVrBbxn7PqPs="
     },
     "@types/karma": {
       "version": "0.13.33",
-      "from": "@types/karma@0.13.33",
-      "resolved": "https://registry.npmjs.org/@types/karma/-/karma-0.13.33.tgz"
+      "resolved": "https://registry.npmjs.org/@types/karma/-/karma-0.13.33.tgz",
+      "integrity": "sha1-ODXT2U6IS23oiEo+cKb1aQ5qWFA="
     },
     "@types/lodash": {
       "version": "4.14.52",
-      "from": "@types/lodash@4.14.52",
-      "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.52.tgz"
+      "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.52.tgz",
+      "integrity": "sha1-3lx6sU2hKJczIzybDsb543fbkPU="
     },
     "@types/log4js": {
       "version": "0.0.32",
-      "from": "@types/log4js@*",
-      "resolved": "https://registry.npmjs.org/@types/log4js/-/log4js-0.0.32.tgz"
+      "resolved": "https://registry.npmjs.org/@types/log4js/-/log4js-0.0.32.tgz",
+      "integrity": "sha1-wVYhz6lvkuxrDPtJCWvdI82JPHw="
     },
     "@types/merge2": {
       "version": "0.3.29",
-      "from": "@types/merge2@0.3.29",
-      "resolved": "https://registry.npmjs.org/@types/merge2/-/merge2-0.3.29.tgz"
+      "resolved": "https://registry.npmjs.org/@types/merge2/-/merge2-0.3.29.tgz",
+      "integrity": "sha1-y1UumCbKPAjZ5lSd6ezY8VQX8G0="
     },
     "@types/mime": {
       "version": "0.0.29",
-      "from": "@types/mime@*",
-      "resolved": "https://registry.npmjs.org/@types/mime/-/mime-0.0.29.tgz"
+      "resolved": "https://registry.npmjs.org/@types/mime/-/mime-0.0.29.tgz",
+      "integrity": "sha1-+8/TMFc7kS71nu7hRgK/rOYwdUs="
     },
     "@types/minimatch": {
       "version": "2.0.29",
-      "from": "@types/minimatch@*",
-      "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-2.0.29.tgz"
+      "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-2.0.29.tgz",
+      "integrity": "sha1-UALhT3Xi1x5WQoHfBDHIwbSio2o="
     },
     "@types/mkdirp": {
       "version": "0.3.29",
-      "from": "@types/mkdirp@0.3.29",
-      "resolved": "https://registry.npmjs.org/@types/mkdirp/-/mkdirp-0.3.29.tgz"
+      "resolved": "https://registry.npmjs.org/@types/mkdirp/-/mkdirp-0.3.29.tgz",
+      "integrity": "sha1-fyrX7FX5FEgvybHsS7GuYCjUYGY="
     },
     "@types/mocha": {
       "version": "2.2.41",
-      "from": "@types/mocha@>=2.2.39 <3.0.0",
-      "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.41.tgz"
+      "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.41.tgz",
+      "integrity": "sha1-4nzwgXFT658nE7LT9saPHhw8pgg="
     },
     "@types/node": {
       "version": "6.0.62",
-      "from": "@types/node@6.0.62",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.62.tgz"
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.62.tgz",
+      "integrity": "sha1-hSIsB3tU8ltXQXu3CLn4d72jf4k="
     },
     "@types/node-notifier": {
       "version": "0.0.28",
-      "from": "@types/node-notifier@0.0.28",
-      "resolved": "https://registry.npmjs.org/@types/node-notifier/-/node-notifier-0.0.28.tgz"
+      "resolved": "https://registry.npmjs.org/@types/node-notifier/-/node-notifier-0.0.28.tgz",
+      "integrity": "sha1-hro9OqjZGDUswxkdiN4yiyDck8E="
     },
     "@types/node-uuid": {
       "version": "0.0.28",
-      "from": "@types/node-uuid@0.0.28",
-      "resolved": "https://registry.npmjs.org/@types/node-uuid/-/node-uuid-0.0.28.tgz"
+      "resolved": "https://registry.npmjs.org/@types/node-uuid/-/node-uuid-0.0.28.tgz",
+      "integrity": "sha1-QWVbXOY7LzN0xOgmtN0h5ykFjj0="
     },
     "@types/orchestrator": {
       "version": "0.0.30",
-      "from": "@types/orchestrator@0.0.30",
-      "resolved": "https://registry.npmjs.org/@types/orchestrator/-/orchestrator-0.0.30.tgz"
+      "resolved": "https://registry.npmjs.org/@types/orchestrator/-/orchestrator-0.0.30.tgz",
+      "integrity": "sha1-3N2o1ke1aLex40F4yx8LRKyamOU="
     },
     "@types/prop-types": {
       "version": "15.5.1",
-      "from": "@types/prop-types@>=15.5.1 <16.0.0",
-      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.5.1.tgz"
+      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.5.1.tgz",
+      "integrity": "sha1-Hs9SYhKZ5luFU3Qzf7Ef0tEGb8E="
     },
     "@types/q": {
       "version": "0.0.32",
-      "from": "@types/q@0.0.32",
-      "resolved": "https://registry.npmjs.org/@types/q/-/q-0.0.32.tgz"
+      "resolved": "https://registry.npmjs.org/@types/q/-/q-0.0.32.tgz",
+      "integrity": "sha1-vShOV8hPEyXacCur/IKlMoGQwMU="
     },
     "@types/react": {
       "version": "15.0.25",
-      "from": "@types/react@>=15.0.25 <16.0.0",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.25.tgz"
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.25.tgz",
+      "integrity": "sha1-05aUnMzJqQthdV3vl4HlrO2bImE="
     },
     "@types/react-addons-test-utils": {
       "version": "0.14.18",
-      "from": "@types/react-addons-test-utils@>=0.14.18 <0.15.0",
-      "resolved": "https://registry.npmjs.org/@types/react-addons-test-utils/-/react-addons-test-utils-0.14.18.tgz"
+      "resolved": "https://registry.npmjs.org/@types/react-addons-test-utils/-/react-addons-test-utils-0.14.18.tgz",
+      "integrity": "sha1-g+EK8dvl7CU1vC3FNz17w7gv3uE="
     },
     "@types/react-dom": {
       "version": "15.5.0",
-      "from": "@types/react-dom@>=15.5.0 <16.0.0",
-      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-15.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-15.5.0.tgz",
+      "integrity": "sha1-f0+5YT1AURQXcyQve2tfGkazS9k="
     },
     "@types/resemblejs": {
       "version": "1.3.28",
-      "from": "@types/resemblejs@>=1.3.28 <1.4.0",
-      "resolved": "https://registry.npmjs.org/@types/resemblejs/-/resemblejs-1.3.28.tgz"
+      "resolved": "https://registry.npmjs.org/@types/resemblejs/-/resemblejs-1.3.28.tgz",
+      "integrity": "sha1-Lg2ztf2w8vPUVPXXLhMkEgnql60="
     },
     "@types/resolve": {
       "version": "0.0.4",
-      "from": "@types/resolve@0.0.4",
-      "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-0.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-0.0.4.tgz",
+      "integrity": "sha1-m1htZalH3qiMS8JNoLkF/pUgoNU="
     },
     "@types/rimraf": {
       "version": "0.0.28",
-      "from": "@types/rimraf@0.0.28",
-      "resolved": "https://registry.npmjs.org/@types/rimraf/-/rimraf-0.0.28.tgz"
+      "resolved": "https://registry.npmjs.org/@types/rimraf/-/rimraf-0.0.28.tgz",
+      "integrity": "sha1-VWJRm8eWPKyoq/fxKMrjtZTUHQY="
     },
     "@types/semver": {
       "version": "5.3.31",
-      "from": "@types/semver@5.3.31",
-      "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.31.tgz"
+      "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.31.tgz",
+      "integrity": "sha1-uZnX2TX0P1IHsBsA094ghS9Mp18="
     },
     "@types/serve-static": {
       "version": "1.7.31",
-      "from": "@types/serve-static@1.7.31",
-      "resolved": "https://registry.npmjs.org/@types/serve-static/-/serve-static-1.7.31.tgz"
+      "resolved": "https://registry.npmjs.org/@types/serve-static/-/serve-static-1.7.31.tgz",
+      "integrity": "sha1-FUVt6NmNa0z/Mb5savdJKuY/Uho="
     },
     "@types/sinon": {
       "version": "2.2.2",
-      "from": "@types/sinon@>=2.2.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/@types/sinon/-/sinon-2.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/@types/sinon/-/sinon-2.2.2.tgz",
+      "integrity": "sha1-qA2khougisysvOTTcnbzXhugpS8="
     },
     "@types/source-map": {
       "version": "0.5.0",
-      "from": "@types/source-map@*",
-      "resolved": "https://registry.npmjs.org/@types/source-map/-/source-map-0.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/@types/source-map/-/source-map-0.5.0.tgz",
+      "integrity": "sha1-3TS72OMv5OdPLj2KwH+KpbRaR6w="
     },
     "@types/through2": {
       "version": "2.0.32",
-      "from": "@types/through2@2.0.32",
-      "resolved": "https://registry.npmjs.org/@types/through2/-/through2-2.0.32.tgz"
+      "resolved": "https://registry.npmjs.org/@types/through2/-/through2-2.0.32.tgz",
+      "integrity": "sha1-RwAkRQ8at2QPGfnr9C09pXTCYSk="
     },
     "@types/uglify-js": {
       "version": "2.6.28",
-      "from": "@types/uglify-js@*",
-      "resolved": "https://registry.npmjs.org/@types/uglify-js/-/uglify-js-2.6.28.tgz"
+      "resolved": "https://registry.npmjs.org/@types/uglify-js/-/uglify-js-2.6.28.tgz",
+      "integrity": "sha1-FJm0jKOkQTIlCzGM3eJbj0XwxhY="
     },
     "@types/vinyl": {
       "version": "1.2.30",
-      "from": "@types/vinyl@1.2.30",
-      "resolved": "https://registry.npmjs.org/@types/vinyl/-/vinyl-1.2.30.tgz"
+      "resolved": "https://registry.npmjs.org/@types/vinyl/-/vinyl-1.2.30.tgz",
+      "integrity": "sha1-kRXAxFxAxXVziQa+n7Tfb1ueUBM="
     },
     "@types/webpack": {
       "version": "1.12.36",
-      "from": "@types/webpack@1.12.36",
-      "resolved": "https://registry.npmjs.org/@types/webpack/-/webpack-1.12.36.tgz"
+      "resolved": "https://registry.npmjs.org/@types/webpack/-/webpack-1.12.36.tgz",
+      "integrity": "sha1-RjSfb7NFSe9HKpbFzsAwpUTyaSQ="
     },
     "@types/webpack-env": {
       "version": "1.13.0",
-      "from": "@types/webpack-env@>=1.13.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/@types/webpack-env/-/webpack-env-1.13.0.tgz"
+      "resolved": "https://registry.npmjs.org/@types/webpack-env/-/webpack-env-1.13.0.tgz",
+      "integrity": "sha1-MEQ4FkfhHulzxa8uklMjkw9pHYA="
     },
     "@types/webpack-stream": {
       "version": "3.2.5",
-      "from": "@types/webpack-stream@3.2.5",
-      "resolved": "https://registry.npmjs.org/@types/webpack-stream/-/webpack-stream-3.2.5.tgz"
+      "resolved": "https://registry.npmjs.org/@types/webpack-stream/-/webpack-stream-3.2.5.tgz",
+      "integrity": "sha1-iwNFN5GCGX+y2prqCpMKzgDRkJs="
     },
     "@types/whatwg-fetch": {
       "version": "0.0.30",
-      "from": "@types/whatwg-fetch@0.0.30",
-      "resolved": "https://registry.npmjs.org/@types/whatwg-fetch/-/whatwg-fetch-0.0.30.tgz"
+      "resolved": "https://registry.npmjs.org/@types/whatwg-fetch/-/whatwg-fetch-0.0.30.tgz",
+      "integrity": "sha1-6Raex/Gv6gVsOtupnulAIy0O41s="
     },
     "@types/yargs": {
       "version": "0.0.34",
-      "from": "@types/yargs@0.0.34",
-      "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.34.tgz"
+      "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.34.tgz",
+      "integrity": "sha1-FWBCn8VQxDvEGnt9PfoK+8yRSjU="
     },
     "@types/z-schema": {
       "version": "3.16.31",
-      "from": "@types/z-schema@3.16.31",
-      "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.31.tgz"
+      "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.31.tgz",
+      "integrity": "sha1-LrHQCl5Ow/pYx2r94S4YK2bcXBw="
     },
     "@uifabric/example-app-base": {
       "version": "1.3.14",
-      "from": "@uifabric/example-app-base@>=1.3.12 <2.0.0",
       "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-1.3.14.tgz",
+      "integrity": "sha1-xme4sp7g4dyDDMBE8sFJFJe+5f4=",
       "dependencies": {
         "office-ui-fabric-core": {
           "version": "5.1.0",
-          "from": "office-ui-fabric-core@>=5.0.0 <6.0.0",
-          "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-5.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-5.1.0.tgz",
+          "integrity": "sha1-v49DCOFbNjJEwWc0WygzRRTsCSA="
         }
       }
     },
     "@uifabric/utilities": {
       "version": "1.10.2",
-      "from": "@uifabric/utilities@1.10.2",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-1.10.2.tgz"
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-1.10.2.tgz",
+      "integrity": "sha1-46chhW9rIUDPOXoNRkdwlmrScyQ="
     },
     "abbrev": {
       "version": "1.0.9",
-      "from": "abbrev@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.0.9.tgz"
+      "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.0.9.tgz",
+      "integrity": "sha1-kbR5JYinc4wl813W9jdSovh3YTU="
     },
     "accepts": {
       "version": "1.3.3",
-      "from": "accepts@1.3.3",
-      "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.3.tgz"
+      "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.3.tgz",
+      "integrity": "sha1-w8p0NJOGSMPg2cHjKN1otiLChMo="
     },
     "acorn": {
       "version": "3.3.0",
-      "from": "acorn@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-3.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-3.3.0.tgz",
+      "integrity": "sha1-ReN/s56No/JbruP/U2niu18iAXo="
     },
     "acorn-dynamic-import": {
       "version": "2.0.2",
-      "from": "acorn-dynamic-import@>=2.0.0 <3.0.0",
       "resolved": "https://registry.npmjs.org/acorn-dynamic-import/-/acorn-dynamic-import-2.0.2.tgz",
+      "integrity": "sha1-x1K9IQvvZ5UBtsbLf8hPj0cVjMQ=",
       "dependencies": {
         "acorn": {
           "version": "4.0.13",
-          "from": "acorn@>=4.0.3 <5.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz"
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
+          "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c="
         }
       }
     },
     "after": {
       "version": "0.8.2",
-      "from": "after@0.8.2",
-      "resolved": "https://registry.npmjs.org/after/-/after-0.8.2.tgz"
+      "resolved": "https://registry.npmjs.org/after/-/after-0.8.2.tgz",
+      "integrity": "sha1-/ts5T58OAqqXaOcCvaI7UF+ufh8="
     },
     "ajv": {
       "version": "4.11.8",
-      "from": "ajv@>=4.9.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz"
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz",
+      "integrity": "sha1-gv+wKynmYq5TvcIK8VlHcGc5xTY="
     },
     "ajv-keywords": {
       "version": "1.5.1",
-      "from": "ajv-keywords@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-1.5.1.tgz"
+      "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-1.5.1.tgz",
+      "integrity": "sha1-MU3QpLM2j609/NxU7eYXG4htrzw="
     },
     "align-text": {
       "version": "0.1.4",
-      "from": "align-text@>=0.1.3 <0.2.0",
-      "resolved": "https://registry.npmjs.org/align-text/-/align-text-0.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/align-text/-/align-text-0.1.4.tgz",
+      "integrity": "sha1-DNkKVhCT810KmSVsIrcGlDP60Rc="
     },
     "alphanum-sort": {
       "version": "1.0.2",
-      "from": "alphanum-sort@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/alphanum-sort/-/alphanum-sort-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/alphanum-sort/-/alphanum-sort-1.0.2.tgz",
+      "integrity": "sha1-l6ERlkmyEa0zaR2fn0hqjsn74KM="
     },
     "amdefine": {
       "version": "1.0.1",
-      "from": "amdefine@>=0.0.4",
-      "resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz",
+      "integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU="
     },
     "ansi-align": {
       "version": "1.1.0",
-      "from": "ansi-align@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-1.1.0.tgz",
+      "integrity": "sha1-LwwWWIKXOa3V67FeawxuNCPwFro="
     },
     "ansi-escapes": {
       "version": "1.4.0",
-      "from": "ansi-escapes@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz",
+      "integrity": "sha1-06ioOzGapneTZisT52HHkRQiMG4="
     },
     "ansi-html": {
       "version": "0.0.7",
-      "from": "ansi-html@0.0.7",
-      "resolved": "https://registry.npmjs.org/ansi-html/-/ansi-html-0.0.7.tgz"
+      "resolved": "https://registry.npmjs.org/ansi-html/-/ansi-html-0.0.7.tgz",
+      "integrity": "sha1-gTWEAhliqenm/QOflA0S9WynhZ4="
     },
     "ansi-regex": {
       "version": "2.1.1",
-      "from": "ansi-regex@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
+      "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
     },
     "ansi-styles": {
       "version": "2.2.1",
-      "from": "ansi-styles@>=2.2.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+      "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
     },
     "ansicolors": {
       "version": "0.2.1",
-      "from": "ansicolors@>=0.2.1 <0.3.0",
-      "resolved": "https://registry.npmjs.org/ansicolors/-/ansicolors-0.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/ansicolors/-/ansicolors-0.2.1.tgz",
+      "integrity": "sha1-vgiVmQl7dKXJxKhKDNvNtivYeu8="
     },
     "anymatch": {
       "version": "1.3.0",
-      "from": "anymatch@>=1.3.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-1.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-1.3.0.tgz",
+      "integrity": "sha1-o+Uvo5FoyCX/V7AkgSbOWo/5VQc="
     },
     "aproba": {
       "version": "1.1.1",
-      "from": "aproba@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.1.1.tgz",
+      "integrity": "sha1-ldNgDwdxCqDpKYxyatXs8urLq6s="
     },
     "archy": {
       "version": "1.0.0",
-      "from": "archy@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/archy/-/archy-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/archy/-/archy-1.0.0.tgz",
+      "integrity": "sha1-+cjBN1fMHde8N5rHeyxipcKGjEA="
     },
     "are-we-there-yet": {
       "version": "1.1.4",
-      "from": "are-we-there-yet@>=1.1.2 <1.2.0",
       "resolved": "https://registry.npmjs.org/are-we-there-yet/-/are-we-there-yet-1.1.4.tgz",
+      "integrity": "sha1-u13KOCu5TwXhUZQ3PRb9O6HKEQ0=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.6 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "argparse": {
       "version": "1.0.9",
-      "from": "argparse@>=1.0.7 <2.0.0",
       "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.9.tgz",
+      "integrity": "sha1-c9g7wmP4bpf4zE9rrhsOkKfSLIY=",
       "dependencies": {
         "sprintf-js": {
           "version": "1.0.3",
-          "from": "sprintf-js@>=1.0.2 <1.1.0",
-          "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz"
+          "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
+          "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw="
         }
       }
     },
     "arr-diff": {
       "version": "2.0.0",
-      "from": "arr-diff@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
+      "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8="
     },
     "arr-flatten": {
       "version": "1.0.3",
-      "from": "arr-flatten@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.0.3.tgz",
+      "integrity": "sha1-onTthawIhJtr14R8RYB0XcUa37E="
     },
     "array-differ": {
       "version": "1.0.0",
-      "from": "array-differ@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/array-differ/-/array-differ-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/array-differ/-/array-differ-1.0.0.tgz",
+      "integrity": "sha1-7/UuN1gknTO+QCuLuOVkuytdQDE="
     },
     "array-find-index": {
       "version": "1.0.2",
-      "from": "array-find-index@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/array-find-index/-/array-find-index-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/array-find-index/-/array-find-index-1.0.2.tgz",
+      "integrity": "sha1-3wEKoSh+Fku9pvlyOwqWoexBh6E="
     },
     "array-flatten": {
       "version": "1.1.1",
-      "from": "array-flatten@1.1.1",
-      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
+      "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI="
     },
     "array-slice": {
       "version": "0.2.3",
-      "from": "array-slice@>=0.2.3 <0.3.0",
-      "resolved": "https://registry.npmjs.org/array-slice/-/array-slice-0.2.3.tgz"
+      "resolved": "https://registry.npmjs.org/array-slice/-/array-slice-0.2.3.tgz",
+      "integrity": "sha1-3Tz7gO15c6dRF82sabC5nshhhvU="
     },
     "array-union": {
       "version": "1.0.2",
-      "from": "array-union@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz",
+      "integrity": "sha1-mjRBDk9OPaI96jdb5b5w8kd47Dk="
     },
     "array-uniq": {
       "version": "1.0.3",
-      "from": "array-uniq@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz",
+      "integrity": "sha1-r2rId6Jcx/dOBYiUdThY39sk/bY="
     },
     "array-unique": {
       "version": "0.2.1",
-      "from": "array-unique@>=0.2.1 <0.3.0",
-      "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
+      "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM="
     },
     "arraybuffer.slice": {
       "version": "0.0.6",
-      "from": "arraybuffer.slice@0.0.6",
-      "resolved": "https://registry.npmjs.org/arraybuffer.slice/-/arraybuffer.slice-0.0.6.tgz"
+      "resolved": "https://registry.npmjs.org/arraybuffer.slice/-/arraybuffer.slice-0.0.6.tgz",
+      "integrity": "sha1-8zshWfBTKj8xB6JywMz70a0peco="
     },
     "arrify": {
       "version": "1.0.1",
-      "from": "arrify@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz",
+      "integrity": "sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0="
     },
     "asap": {
       "version": "2.0.5",
-      "from": "asap@>=2.0.3 <2.1.0",
-      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.5.tgz",
+      "integrity": "sha1-UidltQw1EEkOUtfc/ghe+bqWlY8="
     },
     "asn1": {
       "version": "0.2.3",
-      "from": "asn1@>=0.2.3 <0.3.0",
-      "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.3.tgz"
+      "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.3.tgz",
+      "integrity": "sha1-2sh4dxPJlmhJ/IGAd36+nB3fO4Y="
     },
     "asn1.js": {
       "version": "4.9.1",
-      "from": "asn1.js@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-4.9.1.tgz"
+      "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-4.9.1.tgz",
+      "integrity": "sha1-SLokC0WpKA6UdImQull9IWYX/UA="
     },
     "assert": {
       "version": "1.4.1",
-      "from": "assert@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/assert/-/assert-1.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/assert/-/assert-1.4.1.tgz",
+      "integrity": "sha1-mZEtWRg2tab1s0XA8H7vwI/GXZE="
     },
     "assert-plus": {
       "version": "0.2.0",
-      "from": "assert-plus@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-0.2.0.tgz",
+      "integrity": "sha1-104bh+ev/A24qttwIfP+SBAasjQ="
     },
     "assertion-error": {
       "version": "1.0.2",
-      "from": "assertion-error@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-1.0.2.tgz",
+      "integrity": "sha1-E8pRXYYgbaC6xm6DTdOX2HWBCUw="
     },
     "ast-types": {
       "version": "0.9.6",
-      "from": "ast-types@0.9.6",
-      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.9.6.tgz"
+      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.9.6.tgz",
+      "integrity": "sha1-ECyenpAF0+fjgpvwxPok7oYu6bk="
     },
     "async": {
       "version": "1.5.2",
-      "from": "async@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz"
+      "resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz",
+      "integrity": "sha1-7GphrlZIDAw8skHJVhjiCJL5Zyo="
     },
     "async-each": {
       "version": "1.0.1",
-      "from": "async-each@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/async-each/-/async-each-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/async-each/-/async-each-1.0.1.tgz",
+      "integrity": "sha1-GdOGodntxufByF04iu28xW0zYC0="
     },
     "async-foreach": {
       "version": "0.1.3",
-      "from": "async-foreach@>=0.1.3 <0.2.0",
-      "resolved": "https://registry.npmjs.org/async-foreach/-/async-foreach-0.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/async-foreach/-/async-foreach-0.1.3.tgz",
+      "integrity": "sha1-NhIfhFwFeBct5Bmpfb6x0W7DRUI="
     },
     "asynckit": {
       "version": "0.4.0",
-      "from": "asynckit@>=0.4.0 <0.5.0",
-      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
+      "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k="
     },
     "autoprefixer": {
       "version": "6.7.7",
-      "from": "autoprefixer@>=6.7.6 <7.0.0",
       "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.7.7.tgz",
+      "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ=",
       "dependencies": {
         "browserslist": {
           "version": "1.7.7",
-          "from": "browserslist@>=1.7.6 <2.0.0",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz"
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
+          "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk="
         }
       }
     },
     "aws-sign2": {
       "version": "0.6.0",
-      "from": "aws-sign2@>=0.6.0 <0.7.0",
-      "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz",
+      "integrity": "sha1-FDQt0428yU0OW4fXY81jYSwOeU8="
     },
     "aws4": {
       "version": "1.6.0",
-      "from": "aws4@>=1.2.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.6.0.tgz",
+      "integrity": "sha1-g+9cqGCysy5KDe7e6MdxudtXRx4="
     },
     "azure-storage": {
       "version": "0.10.0",
-      "from": "azure-storage@>=0.10.0 <0.11.0",
       "resolved": "https://registry.npmjs.org/azure-storage/-/azure-storage-0.10.0.tgz",
+      "integrity": "sha1-QsV7ty1vM+u3jS2VTds99Jp1sro=",
       "dependencies": {
         "async": {
           "version": "2.4.1",
-          "from": "async@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
+          "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c="
         },
         "caseless": {
           "version": "0.11.0",
-          "from": "caseless@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz"
+          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz",
+          "integrity": "sha1-cVuW6phBWTzDMGeSP17GDr2k99c="
         },
         "extend": {
           "version": "1.2.1",
-          "from": "extend@>=1.2.1 <1.3.0",
-          "resolved": "https://registry.npmjs.org/extend/-/extend-1.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/extend/-/extend-1.2.1.tgz",
+          "integrity": "sha1-oPX9bPyDpf5J72mNYOyKYk3UV2w="
         },
         "form-data": {
           "version": "1.0.1",
-          "from": "form-data@>=1.0.0-rc3 <1.1.0",
-          "resolved": "https://registry.npmjs.org/form-data/-/form-data-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/form-data/-/form-data-1.0.1.tgz",
+          "integrity": "sha1-rjFduaSQf6BlUCMEpm13M0de43w="
         },
         "har-validator": {
           "version": "2.0.6",
-          "from": "har-validator@>=2.0.6 <2.1.0",
-          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz"
+          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz",
+          "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0="
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "node-uuid": {
           "version": "1.4.8",
-          "from": "node-uuid@~1.4.0",
-          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz"
+          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz",
+          "integrity": "sha1-sEDrCSOWivq/jTL7HxfxFn/auQc="
         },
         "qs": {
           "version": "6.0.4",
-          "from": "qs@>=6.0.2 <6.1.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-6.0.4.tgz"
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.0.4.tgz",
+          "integrity": "sha1-UQGdhHIMk5uCc36EVWp4Izjs6ns="
         },
         "readable-stream": {
           "version": "2.0.6",
-          "from": "readable-stream@>=2.0.0 <2.1.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz",
+          "integrity": "sha1-j5A0HmilPMySh4jaz80Rs265t44="
         },
         "request": {
           "version": "2.69.0",
-          "from": "request@>=2.69.0 <2.70.0",
           "resolved": "https://registry.npmjs.org/request/-/request-2.69.0.tgz",
+          "integrity": "sha1-z5HS4AB1KxIXFVwAUkGRGZGiNGo=",
           "dependencies": {
             "extend": {
               "version": "3.0.1",
-              "from": "extend@~3.0.0",
-              "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz"
+              "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz",
+              "integrity": "sha1-p1Xqe8Gt/MWjHOfnYtuq3F5jZEQ="
             }
           }
         },
         "tough-cookie": {
           "version": "2.2.2",
-          "from": "tough-cookie@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.2.2.tgz"
+          "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.2.2.tgz",
+          "integrity": "sha1-yDoYMPTl7wuT7yo0iOck+N4Basc="
         },
         "tunnel-agent": {
           "version": "0.4.3",
-          "from": "tunnel-agent@>=0.4.1 <0.5.0",
-          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz"
+          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz",
+          "integrity": "sha1-Y3PbdpCf5XDgjXNYM2Xtgop07us="
         },
         "validator": {
           "version": "3.22.2",
-          "from": "validator@>=3.22.2 <3.23.0",
-          "resolved": "https://registry.npmjs.org/validator/-/validator-3.22.2.tgz"
+          "resolved": "https://registry.npmjs.org/validator/-/validator-3.22.2.tgz",
+          "integrity": "sha1-byl65n9/gqzHbQr9tJ8Y2aCcGMA="
         }
       }
     },
     "babel-code-frame": {
       "version": "6.22.0",
-      "from": "babel-code-frame@>=6.11.0 <7.0.0",
-      "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.22.0.tgz"
+      "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.22.0.tgz",
+      "integrity": "sha1-AnYgvuVnqIwyVhV05/0IAdMxGOQ="
     },
     "babel-runtime": {
       "version": "6.23.0",
-      "from": "babel-runtime@>=6.18.0 <7.0.0",
-      "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.23.0.tgz"
+      "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.23.0.tgz",
+      "integrity": "sha1-CpSJ8UTecO+zzkMArM2zKeL8VDs="
     },
     "backo2": {
       "version": "1.0.2",
-      "from": "backo2@1.0.2",
-      "resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz",
+      "integrity": "sha1-MasayLEpNjRj41s+u2n038+6eUc="
     },
     "balanced-match": {
       "version": "0.4.2",
-      "from": "balanced-match@>=0.4.1 <0.5.0",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-0.4.2.tgz"
+      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-0.4.2.tgz",
+      "integrity": "sha1-yz8+PHMtwPAe5wtAPzAuYddwmDg="
     },
     "base62": {
       "version": "1.2.0",
-      "from": "base62@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/base62/-/base62-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/base62/-/base62-1.2.0.tgz",
+      "integrity": "sha1-MeflYNyEbJ9EwaUx32UU2jVHQVc="
     },
     "Base64": {
       "version": "0.2.1",
-      "from": "Base64@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/Base64/-/Base64-0.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/Base64/-/Base64-0.2.1.tgz",
+      "integrity": "sha1-ujpCMHCOGGcFBl5mur3Uw1z2ACg="
     },
     "base64-arraybuffer": {
       "version": "0.1.5",
-      "from": "base64-arraybuffer@0.1.5",
-      "resolved": "https://registry.npmjs.org/base64-arraybuffer/-/base64-arraybuffer-0.1.5.tgz"
+      "resolved": "https://registry.npmjs.org/base64-arraybuffer/-/base64-arraybuffer-0.1.5.tgz",
+      "integrity": "sha1-c5JncZI7Whl0etZmqlzUv5xunOg="
     },
     "base64-js": {
       "version": "1.2.0",
-      "from": "base64-js@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.2.0.tgz",
+      "integrity": "sha1-o5mS1yNYSBGYK+XikLtqU9hnAPE="
     },
     "base64-url": {
       "version": "1.2.1",
-      "from": "base64-url@1.2.1",
-      "resolved": "https://registry.npmjs.org/base64-url/-/base64-url-1.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/base64-url/-/base64-url-1.2.1.tgz",
+      "integrity": "sha1-GZ/WYXAqDnt9yubgaYuwicUvbXg="
     },
     "base64id": {
       "version": "1.0.0",
-      "from": "base64id@1.0.0",
-      "resolved": "https://registry.npmjs.org/base64id/-/base64id-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/base64id/-/base64id-1.0.0.tgz",
+      "integrity": "sha1-R2iMuZu2gE8OBtPnY7HDLlfY5rY="
     },
     "basic-auth": {
       "version": "1.0.4",
-      "from": "basic-auth@>=1.0.3 <1.1.0",
-      "resolved": "https://registry.npmjs.org/basic-auth/-/basic-auth-1.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/basic-auth/-/basic-auth-1.0.4.tgz",
+      "integrity": "sha1-Awk1sB3nyblKgksp8/zLdQ06UpA="
     },
     "basic-auth-connect": {
       "version": "1.0.0",
-      "from": "basic-auth-connect@1.0.0",
-      "resolved": "https://registry.npmjs.org/basic-auth-connect/-/basic-auth-connect-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/basic-auth-connect/-/basic-auth-connect-1.0.0.tgz",
+      "integrity": "sha1-/bC0OWLKe0BFanwrtI/hc9otISI="
     },
     "batch": {
       "version": "0.5.3",
-      "from": "batch@>=0.5.3 <0.6.0",
-      "resolved": "https://registry.npmjs.org/batch/-/batch-0.5.3.tgz"
+      "resolved": "https://registry.npmjs.org/batch/-/batch-0.5.3.tgz",
+      "integrity": "sha1-PzQU84AyF0O/wQQvmoP/HVgk1GQ="
     },
     "bcrypt-pbkdf": {
       "version": "1.0.1",
-      "from": "bcrypt-pbkdf@>=1.0.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/bcrypt-pbkdf/-/bcrypt-pbkdf-1.0.1.tgz",
+      "integrity": "sha1-Y7xdy2EzG5K8Bf1SiVPDNGKgb40=",
       "optional": true
     },
     "beeper": {
       "version": "1.1.1",
-      "from": "beeper@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/beeper/-/beeper-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/beeper/-/beeper-1.1.1.tgz",
+      "integrity": "sha1-5tXqjF2tABMEpwsiY4RH9pyy+Ak="
     },
     "better-assert": {
       "version": "1.0.2",
-      "from": "better-assert@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/better-assert/-/better-assert-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/better-assert/-/better-assert-1.0.2.tgz",
+      "integrity": "sha1-QIZrnhueC1W0gYlDEeaPr/rrxSI="
     },
     "big.js": {
       "version": "3.1.3",
-      "from": "big.js@>=3.1.3 <4.0.0",
-      "resolved": "https://registry.npmjs.org/big.js/-/big.js-3.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/big.js/-/big.js-3.1.3.tgz",
+      "integrity": "sha1-TK2iGTZS6zyp7I5VyQFWacmAaXg="
     },
     "binary-extensions": {
       "version": "1.8.0",
-      "from": "binary-extensions@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.8.0.tgz"
+      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.8.0.tgz",
+      "integrity": "sha1-SOyNFt9Dd+rl+liEaCSAr02Vx3Q="
     },
     "binaryextensions": {
       "version": "1.0.1",
-      "from": "binaryextensions@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/binaryextensions/-/binaryextensions-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/binaryextensions/-/binaryextensions-1.0.1.tgz",
+      "integrity": "sha1-HmN0iLNbWL2l9HdL+WpSEqjJB1U="
     },
     "bindings": {
       "version": "1.2.1",
-      "from": "bindings@>=1.2.1 <1.3.0",
-      "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.2.1.tgz",
+      "integrity": "sha1-FK1hE4EtLTfXLme0ystLtyZQXxE="
     },
     "bl": {
       "version": "1.0.3",
-      "from": "bl@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/bl/-/bl-1.0.3.tgz",
+      "integrity": "sha1-/FQhoo/UImA2w7OJGmaiW8ZNIm4=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.0.6",
-          "from": "readable-stream@>=2.0.5 <2.1.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz",
+          "integrity": "sha1-j5A0HmilPMySh4jaz80Rs265t44="
         }
       }
     },
     "blob": {
       "version": "0.0.4",
-      "from": "blob@0.0.4",
-      "resolved": "https://registry.npmjs.org/blob/-/blob-0.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/blob/-/blob-0.0.4.tgz",
+      "integrity": "sha1-vPEwUspURj8w+fx+lbmkdjCpSSE="
     },
     "block-stream": {
       "version": "0.0.9",
-      "from": "block-stream@*",
-      "resolved": "https://registry.npmjs.org/block-stream/-/block-stream-0.0.9.tgz"
+      "resolved": "https://registry.npmjs.org/block-stream/-/block-stream-0.0.9.tgz",
+      "integrity": "sha1-E+v+d4oDIFz+A3UUgeu0szAMEmo="
     },
     "bluebird": {
       "version": "3.5.0",
-      "from": "bluebird@>=3.0.5 <4.0.0",
-      "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.5.0.tgz",
+      "integrity": "sha1-eRQg1/VR7qKJdFOop3ZT+WYG1nw="
     },
     "bn.js": {
       "version": "4.11.6",
-      "from": "bn.js@>=4.1.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.6.tgz"
+      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.6.tgz",
+      "integrity": "sha1-UzRK2xRhehP26N0s4okF0cC6MhU="
     },
     "body-parser": {
       "version": "1.17.2",
-      "from": "body-parser@>=1.12.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.17.2.tgz"
+      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.17.2.tgz",
+      "integrity": "sha1-+IkqvI+eYn1Crtr7yma/WrmRBO4="
     },
     "boolbase": {
       "version": "1.0.0",
-      "from": "boolbase@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
+      "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24="
     },
     "boom": {
       "version": "2.10.1",
-      "from": "boom@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz"
+      "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
+      "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8="
     },
     "boxen": {
       "version": "0.6.0",
-      "from": "boxen@>=0.6.0 <0.7.0",
-      "resolved": "https://registry.npmjs.org/boxen/-/boxen-0.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/boxen/-/boxen-0.6.0.tgz",
+      "integrity": "sha1-g2TUJIrDT/DvGy8r9JpsYM4NgbY="
     },
     "brace-expansion": {
       "version": "1.1.7",
-      "from": "brace-expansion@>=1.1.7 <2.0.0",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.7.tgz"
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.7.tgz",
+      "integrity": "sha1-Pv/DxQ4ABTH7cg6v+A8K6O8jz1k="
     },
     "braces": {
       "version": "1.8.5",
-      "from": "braces@>=1.8.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz"
+      "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
+      "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
     },
     "brorand": {
       "version": "1.1.0",
-      "from": "brorand@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/brorand/-/brorand-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/brorand/-/brorand-1.1.0.tgz",
+      "integrity": "sha1-EsJe/kCkXjwyPrhnWgoM5XsiNx8="
     },
     "browser-stdout": {
       "version": "1.3.0",
-      "from": "browser-stdout@1.3.0",
-      "resolved": "https://registry.npmjs.org/browser-stdout/-/browser-stdout-1.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/browser-stdout/-/browser-stdout-1.3.0.tgz",
+      "integrity": "sha1-81HTKWnTL6XXpVZxVCY9korjvR8="
     },
     "browserify-aes": {
       "version": "0.4.0",
-      "from": "browserify-aes@0.4.0",
-      "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-0.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-0.4.0.tgz",
+      "integrity": "sha1-BnFJtmjfMcS1hTPgLQHoBthgjiw="
     },
     "browserify-cipher": {
       "version": "1.0.0",
-      "from": "browserify-cipher@>=1.0.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/browserify-cipher/-/browserify-cipher-1.0.0.tgz",
+      "integrity": "sha1-mYgkSHS/XtTijalWZtzWasj8Njo=",
       "dependencies": {
         "browserify-aes": {
           "version": "1.0.6",
-          "from": "browserify-aes@>=1.0.4 <2.0.0",
-          "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.6.tgz"
+          "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.6.tgz",
+          "integrity": "sha1-Xncl297x/Vkw1OurSFZ85FHEigo="
         }
       }
     },
     "browserify-des": {
       "version": "1.0.0",
-      "from": "browserify-des@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/browserify-des/-/browserify-des-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/browserify-des/-/browserify-des-1.0.0.tgz",
+      "integrity": "sha1-2qJ3cXRwki7S/hhZQRihdUOXId0="
     },
     "browserify-mime": {
       "version": "1.2.9",
-      "from": "browserify-mime@>=1.2.9 <1.3.0",
-      "resolved": "https://registry.npmjs.org/browserify-mime/-/browserify-mime-1.2.9.tgz"
+      "resolved": "https://registry.npmjs.org/browserify-mime/-/browserify-mime-1.2.9.tgz",
+      "integrity": "sha1-rrGvKN5sDXpqLOQK22j/GEIq8x8="
     },
     "browserify-rsa": {
       "version": "4.0.1",
-      "from": "browserify-rsa@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz",
+      "integrity": "sha1-IeCr+vbyApzy+vsTNWenAdQTVSQ="
     },
     "browserify-sign": {
       "version": "4.0.4",
-      "from": "browserify-sign@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/browserify-sign/-/browserify-sign-4.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/browserify-sign/-/browserify-sign-4.0.4.tgz",
+      "integrity": "sha1-qk62jl17ZYuqa/alfmMMvXqT0pg="
     },
     "browserify-zlib": {
       "version": "0.1.4",
-      "from": "browserify-zlib@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/browserify-zlib/-/browserify-zlib-0.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/browserify-zlib/-/browserify-zlib-0.1.4.tgz",
+      "integrity": "sha1-uzX4pRn2AOD6a4SFJByXnQFB+y0="
     },
     "browserslist": {
       "version": "1.3.6",
-      "from": "browserslist@>=1.3.4 <1.4.0",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.3.6.tgz"
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.3.6.tgz",
+      "integrity": "sha1-lS/0jVZGPTtTj4XvL46t39KEsTM="
     },
     "buffer": {
       "version": "4.9.1",
-      "from": "buffer@>=4.9.0 <5.0.0",
       "resolved": "https://registry.npmjs.org/buffer/-/buffer-4.9.1.tgz",
+      "integrity": "sha1-bRu2AbB6TvztlwlBMgkwJ8lbwpg=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         }
       }
     },
     "buffer-shims": {
       "version": "1.0.0",
-      "from": "buffer-shims@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/buffer-shims/-/buffer-shims-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/buffer-shims/-/buffer-shims-1.0.0.tgz",
+      "integrity": "sha1-mXjOMXOIxkmth5MCjDR37wRKi1E="
     },
     "buffer-xor": {
       "version": "1.0.3",
-      "from": "buffer-xor@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/buffer-xor/-/buffer-xor-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/buffer-xor/-/buffer-xor-1.0.3.tgz",
+      "integrity": "sha1-JuYe0UIvtw3ULm42cp7VHYVf6Nk="
     },
     "bufferstreams": {
       "version": "1.0.1",
-      "from": "bufferstreams@1.0.1",
-      "resolved": "https://registry.npmjs.org/bufferstreams/-/bufferstreams-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/bufferstreams/-/bufferstreams-1.0.1.tgz",
+      "integrity": "sha1-z7GtlWjTujz+k1upq92VLeiKqyo="
     },
     "builtin-modules": {
       "version": "1.1.1",
-      "from": "builtin-modules@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz",
+      "integrity": "sha1-Jw8HbFpywC9bZaR9+Uxf46J4iS8="
     },
     "builtin-status-codes": {
       "version": "3.0.0",
-      "from": "builtin-status-codes@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz",
+      "integrity": "sha1-hZgoeOIbmOHGZCXgPQF0eI9Wnug="
     },
     "bytes": {
       "version": "2.4.0",
-      "from": "bytes@2.4.0",
-      "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz",
+      "integrity": "sha1-fZcZb51br39pNeJZhVSe3SpsIzk="
     },
     "cache-swap": {
       "version": "0.3.0",
-      "from": "cache-swap@>=0.3.0 <0.4.0",
-      "resolved": "https://registry.npmjs.org/cache-swap/-/cache-swap-0.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/cache-swap/-/cache-swap-0.3.0.tgz",
+      "integrity": "sha1-HFQaoQilAQb2ML3Zj+HeyLoTP1E="
     },
     "callsite": {
       "version": "1.0.0",
-      "from": "callsite@1.0.0",
-      "resolved": "https://registry.npmjs.org/callsite/-/callsite-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/callsite/-/callsite-1.0.0.tgz",
+      "integrity": "sha1-KAOY5dZkvXQDi28JBRU+borxvCA="
     },
     "camel-case": {
       "version": "3.0.0",
-      "from": "camel-case@>=3.0.0 <3.1.0",
-      "resolved": "https://registry.npmjs.org/camel-case/-/camel-case-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/camel-case/-/camel-case-3.0.0.tgz",
+      "integrity": "sha1-yjw2iKTpzzpM2nd9xNy8cTJJz3M="
     },
     "camelcase": {
       "version": "2.1.1",
-      "from": "camelcase@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz",
+      "integrity": "sha1-fB0W1nmhu+WcoCys7PsBHiAfWh8="
     },
     "camelcase-keys": {
       "version": "2.1.0",
-      "from": "camelcase-keys@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/camelcase-keys/-/camelcase-keys-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/camelcase-keys/-/camelcase-keys-2.1.0.tgz",
+      "integrity": "sha1-MIvur/3ygRkFHvodkyITyRuPkuc="
     },
     "caniuse-api": {
       "version": "1.6.1",
-      "from": "caniuse-api@>=1.5.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/caniuse-api/-/caniuse-api-1.6.1.tgz"
+      "resolved": "https://registry.npmjs.org/caniuse-api/-/caniuse-api-1.6.1.tgz",
+      "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
       "version": "1.0.30000674",
-      "from": "caniuse-db@>=1.0.30000488 <2.0.0",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000674.tgz"
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000674.tgz",
+      "integrity": "sha1-146ZoykTQfU4MOlq0vEpIblxXo0="
     },
     "capture-stack-trace": {
       "version": "1.0.0",
-      "from": "capture-stack-trace@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/capture-stack-trace/-/capture-stack-trace-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/capture-stack-trace/-/capture-stack-trace-1.0.0.tgz",
+      "integrity": "sha1-Sm+gc5nCa7pH8LJJa00PtAjFVQ0="
     },
     "cardinal": {
       "version": "1.0.0",
-      "from": "cardinal@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/cardinal/-/cardinal-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/cardinal/-/cardinal-1.0.0.tgz",
+      "integrity": "sha1-UOIcGwqjdyn5N33vGWtanOyTLuk="
     },
     "caseless": {
       "version": "0.12.0",
-      "from": "caseless@>=0.12.0 <0.13.0",
-      "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz"
+      "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz",
+      "integrity": "sha1-G2gcIf+EAzyCZUMJBolCDRhxUdw="
     },
     "casperjs": {
       "version": "1.1.3",
-      "from": "casperjs@1.1.3",
-      "resolved": "https://registry.npmjs.org/casperjs/-/casperjs-1.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/casperjs/-/casperjs-1.1.3.tgz",
+      "integrity": "sha1-llPecx+KpE0JFaaboiMxZLsur5Q="
     },
     "center-align": {
       "version": "0.1.3",
-      "from": "center-align@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/center-align/-/center-align-0.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/center-align/-/center-align-0.1.3.tgz",
+      "integrity": "sha1-qg0yYptu6XIgBBHL1EYckHvCt60="
     },
     "chai": {
       "version": "3.5.0",
-      "from": "chai@>=3.5.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/chai/-/chai-3.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/chai/-/chai-3.5.0.tgz",
+      "integrity": "sha1-TQJjewZ/6Vi9v906QOxW/vc3Mkc="
     },
     "chalk": {
       "version": "1.1.3",
-      "from": "chalk@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+      "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
     },
     "charenc": {
       "version": "0.0.2",
-      "from": "charenc@>=0.0.1 <0.1.0",
-      "resolved": "https://registry.npmjs.org/charenc/-/charenc-0.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/charenc/-/charenc-0.0.2.tgz",
+      "integrity": "sha1-wKHS86cJLgN3S/qD8UwPxXkKhmc="
     },
     "cheerio": {
       "version": "0.22.0",
-      "from": "cheerio@>=0.22.0 <0.23.0",
       "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-0.22.0.tgz",
+      "integrity": "sha1-qbqoYKP5tZWmuBsahocxIe06Jp4=",
       "dependencies": {
         "lodash.defaults": {
           "version": "4.2.0",
-          "from": "lodash.defaults@>=4.0.1 <5.0.0",
-          "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-4.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-4.2.0.tgz",
+          "integrity": "sha1-0JF4cW/+pN3p5ft7N/bwgCJ0WAw="
         },
         "lodash.merge": {
           "version": "4.6.0",
-          "from": "lodash.merge@>=4.4.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.0.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.0.tgz",
+          "integrity": "sha1-aYhLoUSsM/5plzemCG3v+t0PicU="
         }
       }
     },
     "chokidar": {
       "version": "1.7.0",
-      "from": "chokidar@>=1.4.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-1.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-1.7.0.tgz",
+      "integrity": "sha1-eY5ol3gVHIB2tLNg5e3SjNortGg="
     },
     "cipher-base": {
       "version": "1.0.3",
-      "from": "cipher-base@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/cipher-base/-/cipher-base-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/cipher-base/-/cipher-base-1.0.3.tgz",
+      "integrity": "sha1-7qvxlEGc6QDaMBjCB9IS8qbfCgc="
     },
     "clap": {
       "version": "1.1.3",
-      "from": "clap@>=1.0.9 <2.0.0",
-      "resolved": "https://registry.npmjs.org/clap/-/clap-1.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/clap/-/clap-1.1.3.tgz",
+      "integrity": "sha1-s7026T3Uy/s5WjwmiWNSRFJlwFs="
     },
     "clean-css": {
       "version": "3.4.26",
-      "from": "clean-css@>=3.4.20 <4.0.0",
       "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-3.4.26.tgz",
+      "integrity": "sha1-VTI7NE/zvO5oSi6sgck9+Ppz3us=",
       "dependencies": {
         "commander": {
           "version": "2.8.1",
-          "from": "commander@>=2.8.0 <2.9.0",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-2.8.1.tgz"
+          "resolved": "https://registry.npmjs.org/commander/-/commander-2.8.1.tgz",
+          "integrity": "sha1-Br42f+v9oMMwqh4qBy09yXYkJdQ="
         },
         "source-map": {
           "version": "0.4.4",
-          "from": "source-map@>=0.4.0 <0.5.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz"
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
+          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s="
         }
       }
     },
     "cli-boxes": {
       "version": "1.0.0",
-      "from": "cli-boxes@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/cli-boxes/-/cli-boxes-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/cli-boxes/-/cli-boxes-1.0.0.tgz",
+      "integrity": "sha1-T6kXw+WclKAEzWH47lCdplFocUM="
     },
     "cli-cursor": {
       "version": "1.0.2",
-      "from": "cli-cursor@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-1.0.2.tgz",
+      "integrity": "sha1-ZNo/fValRBLll5S9Ytw1KV6PKYc="
     },
     "cli-table": {
       "version": "0.3.1",
-      "from": "cli-table@>=0.3.1 <0.4.0",
       "resolved": "https://registry.npmjs.org/cli-table/-/cli-table-0.3.1.tgz",
+      "integrity": "sha1-9TsFJmqLGguTSz0IIebi3FkUriM=",
       "dependencies": {
         "colors": {
           "version": "1.0.3",
-          "from": "colors@1.0.3",
-          "resolved": "https://registry.npmjs.org/colors/-/colors-1.0.3.tgz"
+          "resolved": "https://registry.npmjs.org/colors/-/colors-1.0.3.tgz",
+          "integrity": "sha1-BDP0TYCWgP3rYO0mDxsMJi6CpAs="
         }
       }
     },
     "cli-usage": {
       "version": "0.1.4",
-      "from": "cli-usage@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/cli-usage/-/cli-usage-0.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/cli-usage/-/cli-usage-0.1.4.tgz",
+      "integrity": "sha1-fAHg3HBsI0s5yTODjI4gshdXduI="
     },
     "cli-width": {
       "version": "1.1.1",
-      "from": "cli-width@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-1.1.1.tgz",
+      "integrity": "sha1-pNKT72frt7iNSk1CwMzwDE0eNm0="
     },
     "cliui": {
       "version": "3.2.0",
-      "from": "cliui@>=3.2.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
+      "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
     },
     "clone": {
       "version": "1.0.2",
-      "from": "clone@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.2.tgz",
+      "integrity": "sha1-Jgt6meux7f4kdTgXX3gyQ8sZ0Uk="
     },
     "clone-buffer": {
       "version": "1.0.0",
-      "from": "clone-buffer@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/clone-buffer/-/clone-buffer-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/clone-buffer/-/clone-buffer-1.0.0.tgz",
+      "integrity": "sha1-4+JbIHrE5wGvch4staFnksrD3Fg="
     },
     "clone-deep": {
       "version": "0.2.4",
-      "from": "clone-deep@>=0.2.4 <0.3.0",
-      "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-0.2.4.tgz"
+      "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-0.2.4.tgz",
+      "integrity": "sha1-TnPdCen7lxzDhnDF3O2cGJZIHMY="
     },
     "clone-stats": {
       "version": "0.0.1",
-      "from": "clone-stats@>=0.0.1 <0.0.2",
-      "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-0.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-0.0.1.tgz",
+      "integrity": "sha1-uI+UqCzzi4eR1YBG6kAprYjKmdE="
     },
     "cloneable-readable": {
       "version": "1.0.0",
-      "from": "cloneable-readable@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/cloneable-readable/-/cloneable-readable-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/cloneable-readable/-/cloneable-readable-1.0.0.tgz",
+      "integrity": "sha1-pikNQT8hemEjL5XkWP84QYz7ARc="
     },
     "co": {
       "version": "4.6.0",
-      "from": "co@>=4.6.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
+      "integrity": "sha1-bqa989hTrlTMuOR7+gvz+QMfsYQ="
     },
     "coa": {
       "version": "1.0.2",
-      "from": "coa@>=1.0.1 <1.1.0",
-      "resolved": "https://registry.npmjs.org/coa/-/coa-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/coa/-/coa-1.0.2.tgz",
+      "integrity": "sha1-K6n+w7SqQ9eknX5sNWHpIGG2vOw="
     },
     "code-point-at": {
       "version": "1.1.0",
-      "from": "code-point-at@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz",
+      "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c="
     },
     "color": {
       "version": "0.11.4",
-      "from": "color@>=0.11.0 <0.12.0",
-      "resolved": "https://registry.npmjs.org/color/-/color-0.11.4.tgz"
+      "resolved": "https://registry.npmjs.org/color/-/color-0.11.4.tgz",
+      "integrity": "sha1-bXtcdPtl6EHNSHkq0e1eB7kE12Q="
     },
     "color-convert": {
       "version": "1.9.0",
-      "from": "color-convert@>=1.3.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.0.tgz"
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.0.tgz",
+      "integrity": "sha1-Gsz5fdc5uYO/mU1W/sj5WFNkG3o="
     },
     "color-functions": {
       "version": "1.1.0",
-      "from": "color-functions@1.1.0",
-      "resolved": "https://registry.npmjs.org/color-functions/-/color-functions-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/color-functions/-/color-functions-1.1.0.tgz",
+      "integrity": "sha1-TLgFR5Blo2WMMmn0j6xz7/APld4="
     },
     "color-name": {
       "version": "1.1.2",
-      "from": "color-name@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.2.tgz",
+      "integrity": "sha1-XIq3K2S9IhXWF66VWeuxSEdc+Y0="
     },
     "color-string": {
       "version": "0.3.0",
-      "from": "color-string@>=0.3.0 <0.4.0",
-      "resolved": "https://registry.npmjs.org/color-string/-/color-string-0.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/color-string/-/color-string-0.3.0.tgz",
+      "integrity": "sha1-J9RvtnAlxcL6JZk7+/V55HhBuZE="
     },
     "colormin": {
       "version": "1.1.2",
-      "from": "colormin@>=1.0.5 <2.0.0",
-      "resolved": "https://registry.npmjs.org/colormin/-/colormin-1.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/colormin/-/colormin-1.1.2.tgz",
+      "integrity": "sha1-6i90IKcrlogaOKrlnsEkpvcpgTM="
     },
     "colors": {
       "version": "1.1.2",
-      "from": "colors@>=1.1.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/colors/-/colors-1.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/colors/-/colors-1.1.2.tgz",
+      "integrity": "sha1-FopHAXVran9RoSzgyXv6KMCE7WM="
     },
     "combined-stream": {
       "version": "1.0.5",
-      "from": "combined-stream@>=1.0.5 <1.1.0",
-      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz",
+      "integrity": "sha1-k4NwpXtKUd6ix3wV1cX9+JUWQAk="
     },
     "commander": {
       "version": "2.9.0",
-      "from": "commander@>=2.7.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz"
+      "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
+      "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q="
     },
     "commoner": {
       "version": "0.10.8",
-      "from": "commoner@>=0.10.1 <0.11.0",
       "resolved": "https://registry.npmjs.org/commoner/-/commoner-0.10.8.tgz",
+      "integrity": "sha1-NPw2cs0kOT6LtH5wyqApOBH08sU=",
       "dependencies": {
         "glob": {
           "version": "5.0.15",
-          "from": "glob@>=5.0.15 <6.0.0",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
+          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
+          "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
         }
       }
     },
     "component-bind": {
       "version": "1.0.0",
-      "from": "component-bind@1.0.0",
-      "resolved": "https://registry.npmjs.org/component-bind/-/component-bind-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/component-bind/-/component-bind-1.0.0.tgz",
+      "integrity": "sha1-AMYIq33Nk4l8AAllGx06jh5zu9E="
     },
     "component-emitter": {
       "version": "1.1.2",
-      "from": "component-emitter@1.1.2",
-      "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.1.2.tgz",
+      "integrity": "sha1-KWWU8nU9qmOZbSrwjRWpURbJrsM="
     },
     "component-inherit": {
       "version": "0.0.3",
-      "from": "component-inherit@0.0.3",
-      "resolved": "https://registry.npmjs.org/component-inherit/-/component-inherit-0.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/component-inherit/-/component-inherit-0.0.3.tgz",
+      "integrity": "sha1-ZF/ErfWLcrZJ1crmUTVhnbJv8UM="
     },
     "compressible": {
       "version": "2.0.10",
-      "from": "compressible@>=2.0.5 <2.1.0",
-      "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.10.tgz"
+      "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.10.tgz",
+      "integrity": "sha1-/tocf3YXkScyspv4zyYlKiC57s0="
     },
     "compression": {
       "version": "1.5.2",
-      "from": "compression@>=1.5.2 <1.6.0",
       "resolved": "https://registry.npmjs.org/compression/-/compression-1.5.2.tgz",
+      "integrity": "sha1-sDuNhub4rSloPLqN+R3cb/x3s5U=",
       "dependencies": {
         "accepts": {
           "version": "1.2.13",
-          "from": "accepts@>=1.2.12 <1.3.0",
-          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.2.13.tgz"
+          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.2.13.tgz",
+          "integrity": "sha1-5fHzkoxtlf2WVYw27D2dDeSm7Oo="
         },
         "bytes": {
           "version": "2.1.0",
-          "from": "bytes@2.1.0",
-          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.1.0.tgz",
+          "integrity": "sha1-rJPEEOL/ycx89LRks4KJBn9eR7Q="
         },
         "debug": {
           "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "ms": {
           "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         },
         "negotiator": {
           "version": "0.5.3",
-          "from": "negotiator@0.5.3",
-          "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.5.3.tgz"
+          "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.5.3.tgz",
+          "integrity": "sha1-Jp1cR2gQ7JLtvntsLygxY4T5p+g="
         },
         "vary": {
           "version": "1.0.1",
-          "from": "vary@>=1.0.1 <1.1.0",
-          "resolved": "https://registry.npmjs.org/vary/-/vary-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/vary/-/vary-1.0.1.tgz",
+          "integrity": "sha1-meSYFWaihhGN+yuBc1ffeZM3bRA="
         }
       }
     },
     "concat-map": {
       "version": "0.0.1",
-      "from": "concat-map@0.0.1",
-      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
+      "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s="
     },
     "concat-stream": {
       "version": "1.5.0",
-      "from": "concat-stream@1.5.0",
       "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.5.0.tgz",
+      "integrity": "sha1-U/fUPFHF5D+ByP3QMyHGMb5o1hE=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.0.6",
-          "from": "readable-stream@>=2.0.0 <2.1.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz",
+          "integrity": "sha1-j5A0HmilPMySh4jaz80Rs265t44="
         }
       }
     },
     "configstore": {
       "version": "2.1.0",
-      "from": "configstore@>=2.0.0 <3.0.0",
       "resolved": "https://registry.npmjs.org/configstore/-/configstore-2.1.0.tgz",
+      "integrity": "sha1-c3o6cDbpiGECqmCZ5HuzOrGroaE=",
       "dependencies": {
         "uuid": {
           "version": "2.0.3",
-          "from": "uuid@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz"
+          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz",
+          "integrity": "sha1-Z+LoY3lyFVMN/zGOW/nc6/1Hsho="
         }
       }
     },
     "connect": {
       "version": "3.6.2",
-      "from": "connect@>=3.3.5 <4.0.0",
-      "resolved": "https://registry.npmjs.org/connect/-/connect-3.6.2.tgz"
+      "resolved": "https://registry.npmjs.org/connect/-/connect-3.6.2.tgz",
+      "integrity": "sha1-aU6NIGgb/kkCgsiriGvpjwn0L+c="
     },
     "connect-history-api-fallback": {
       "version": "1.3.0",
-      "from": "connect-history-api-fallback@>=1.3.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.3.0.tgz",
+      "integrity": "sha1-5R0X+PDvDbkKZP20feMFFVbp8Wk="
     },
     "connect-livereload": {
       "version": "0.5.4",
-      "from": "connect-livereload@>=0.5.4 <0.6.0",
-      "resolved": "https://registry.npmjs.org/connect-livereload/-/connect-livereload-0.5.4.tgz"
+      "resolved": "https://registry.npmjs.org/connect-livereload/-/connect-livereload-0.5.4.tgz",
+      "integrity": "sha1-gBV9E3HJ83zBQDmrGJWXDRGdw7w="
     },
     "connect-timeout": {
       "version": "1.6.2",
-      "from": "connect-timeout@>=1.6.2 <1.7.0",
       "resolved": "https://registry.npmjs.org/connect-timeout/-/connect-timeout-1.6.2.tgz",
+      "integrity": "sha1-3ppexh4zoStu2qt7XwYumMWZuI4=",
       "dependencies": {
         "debug": {
           "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "http-errors": {
           "version": "1.3.1",
-          "from": "http-errors@>=1.3.1 <1.4.0",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
+          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
         },
         "ms": {
           "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         }
       }
     },
     "console-browserify": {
       "version": "1.1.0",
-      "from": "console-browserify@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.1.0.tgz",
+      "integrity": "sha1-8CQcRXMKn8YyOyBtvzjtx0HQuxA="
     },
     "console-control-strings": {
       "version": "1.1.0",
-      "from": "console-control-strings@>=1.1.0 <1.2.0",
-      "resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz",
+      "integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4="
     },
     "constants-browserify": {
       "version": "0.0.1",
-      "from": "constants-browserify@0.0.1",
-      "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-0.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-0.0.1.tgz",
+      "integrity": "sha1-kld9tSe6bEzwpFaNhLwDH0QeIfI="
     },
     "content-disposition": {
       "version": "0.5.2",
-      "from": "content-disposition@0.5.2",
-      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.2.tgz"
+      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.2.tgz",
+      "integrity": "sha1-DPaLud318r55YcOoUXjLhdunjLQ="
     },
     "content-type": {
       "version": "1.0.2",
-      "from": "content-type@>=1.0.2 <1.1.0",
-      "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.2.tgz",
+      "integrity": "sha1-t9ETrueo3Se9IRM8TcJSnfFyHu0="
     },
     "convert-source-map": {
       "version": "1.5.0",
-      "from": "convert-source-map@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.5.0.tgz",
+      "integrity": "sha1-ms1whRxtXf3ZPZKC5e35SgP/RrU="
     },
     "cookie": {
       "version": "0.3.1",
-      "from": "cookie@0.3.1",
-      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.3.1.tgz"
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.3.1.tgz",
+      "integrity": "sha1-5+Ch+e9DtMi6klxcWpboBtFoc7s="
     },
     "cookie-parser": {
       "version": "1.3.5",
-      "from": "cookie-parser@>=1.3.5 <1.4.0",
       "resolved": "https://registry.npmjs.org/cookie-parser/-/cookie-parser-1.3.5.tgz",
+      "integrity": "sha1-nXVVcPtdF4kHcSJ6AjFNm+fPg1Y=",
       "dependencies": {
         "cookie": {
           "version": "0.1.3",
-          "from": "cookie@0.1.3",
-          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz"
+          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz",
+          "integrity": "sha1-5zSlwUF/zkctWu+Cw4HKu2TRpDU="
         }
       }
     },
     "cookie-signature": {
       "version": "1.0.6",
-      "from": "cookie-signature@1.0.6",
-      "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz"
+      "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
+      "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw="
     },
     "core-js": {
       "version": "2.4.1",
-      "from": "core-js@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.4.1.tgz",
+      "integrity": "sha1-TekR5mew6ukSTjQlS1OupvxhjT4="
     },
     "core-util-is": {
       "version": "1.0.2",
-      "from": "core-util-is@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
+      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac="
     },
     "cosmiconfig": {
       "version": "2.1.3",
-      "from": "cosmiconfig@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-2.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-2.1.3.tgz",
+      "integrity": "sha1-lSdx6w3dwcs/ovb75RpSLpOz7go="
     },
     "crc": {
       "version": "3.3.0",
-      "from": "crc@3.3.0",
-      "resolved": "https://registry.npmjs.org/crc/-/crc-3.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/crc/-/crc-3.3.0.tgz",
+      "integrity": "sha1-+mIuG8OIvyVzCQgta2UgDOZwkLo="
     },
     "create-ecdh": {
       "version": "4.0.0",
-      "from": "create-ecdh@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.0.tgz",
+      "integrity": "sha1-iIxyNZbN92EvZJgjPuvXo1MBc30="
     },
     "create-error-class": {
       "version": "3.0.2",
-      "from": "create-error-class@>=3.0.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/create-error-class/-/create-error-class-3.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/create-error-class/-/create-error-class-3.0.2.tgz",
+      "integrity": "sha1-Br56vvlHo/FKMP1hBnHUAbyot7Y="
     },
     "create-hash": {
       "version": "1.1.3",
-      "from": "create-hash@>=1.1.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/create-hash/-/create-hash-1.1.3.tgz",
+      "integrity": "sha1-YGBCrIuSYnUPSDyt2rD1gZFy2P0=",
       "dependencies": {
         "ripemd160": {
           "version": "2.0.1",
-          "from": "ripemd160@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz",
+          "integrity": "sha1-D0WEKVxTo2KK9+bXmsohzlfRxuc="
         },
         "sha.js": {
           "version": "2.4.8",
-          "from": "sha.js@>=2.4.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz"
+          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz",
+          "integrity": "sha1-NwaMLEdra69ALRSknGf1l5IfY08="
         }
       }
     },
     "create-hmac": {
       "version": "1.1.6",
-      "from": "create-hmac@>=1.1.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/create-hmac/-/create-hmac-1.1.6.tgz",
+      "integrity": "sha1-rLniIaThe9sHbpBlfEK5PjcmzwY=",
       "dependencies": {
         "ripemd160": {
           "version": "2.0.1",
-          "from": "ripemd160@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz",
+          "integrity": "sha1-D0WEKVxTo2KK9+bXmsohzlfRxuc="
         },
         "sha.js": {
           "version": "2.4.8",
-          "from": "sha.js@>=2.4.8 <3.0.0",
-          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz"
+          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz",
+          "integrity": "sha1-NwaMLEdra69ALRSknGf1l5IfY08="
         }
       }
     },
     "cross-spawn": {
       "version": "3.0.1",
-      "from": "cross-spawn@>=3.0.0 <4.0.0",
       "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-3.0.1.tgz",
+      "integrity": "sha1-ElYDfsufDF9549bvE14wdwGEuYI=",
       "dependencies": {
         "lru-cache": {
           "version": "4.0.2",
-          "from": "lru-cache@>=4.0.1 <5.0.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.0.2.tgz",
+          "integrity": "sha1-HRdnnAac2l0ECZGgnbwsDbN35V4="
         }
       }
     },
     "cross-spawn-async": {
       "version": "2.2.5",
-      "from": "cross-spawn-async@>=2.1.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/cross-spawn-async/-/cross-spawn-async-2.2.5.tgz",
+      "integrity": "sha1-hF/wwINKPe2dFg2sptOQkGuyiMw=",
       "dependencies": {
         "lru-cache": {
           "version": "4.0.2",
-          "from": "lru-cache@>=4.0.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.0.2.tgz",
+          "integrity": "sha1-HRdnnAac2l0ECZGgnbwsDbN35V4="
         }
       }
     },
     "crypt": {
       "version": "0.0.2",
-      "from": "crypt@>=0.0.1 <0.1.0",
-      "resolved": "https://registry.npmjs.org/crypt/-/crypt-0.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/crypt/-/crypt-0.0.2.tgz",
+      "integrity": "sha1-iNf/fsDfuG9xPch7u0LQRNPmxBs="
     },
     "cryptiles": {
       "version": "2.0.5",
-      "from": "cryptiles@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz",
+      "integrity": "sha1-O9/s3GCBR8HGcgL6KR59ylnqo7g="
     },
     "crypto-browserify": {
       "version": "3.2.8",
-      "from": "crypto-browserify@>=3.2.6 <3.3.0",
-      "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.2.8.tgz"
+      "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.2.8.tgz",
+      "integrity": "sha1-ubEdvm2WUd2IKgHmzEZ99xjs8Yk="
     },
     "crypto-random-string": {
       "version": "1.0.0",
-      "from": "crypto-random-string@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-1.0.0.tgz",
+      "integrity": "sha1-ojD2T1aDEOFJgAmUB5DsmVRbyn4="
     },
     "csrf": {
       "version": "3.0.6",
-      "from": "csrf@>=3.0.0 <3.1.0",
-      "resolved": "https://registry.npmjs.org/csrf/-/csrf-3.0.6.tgz"
+      "resolved": "https://registry.npmjs.org/csrf/-/csrf-3.0.6.tgz",
+      "integrity": "sha1-thEg3c7q/JHnbtUxO7XAsmZ7cQo="
     },
     "css-color-names": {
       "version": "0.0.4",
-      "from": "css-color-names@0.0.4",
-      "resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz",
+      "integrity": "sha1-gIrcLnnPhHOAabZGyyDsJ762KeA="
     },
     "css-loader": {
       "version": "0.28.4",
-      "from": "css-loader@>=0.28.0 <0.29.0",
       "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.4.tgz",
+      "integrity": "sha1-bPNXkZLONV6LONX0Ldeh8uyJjQ8=",
       "dependencies": {
         "loader-utils": {
           "version": "1.1.0",
-          "from": "loader-utils@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
+          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
         },
         "lodash.camelcase": {
           "version": "4.3.0",
-          "from": "lodash.camelcase@>=4.3.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz",
+          "integrity": "sha1-soqmKIorn8ZRA1x3EfZathkDMaY="
         }
       }
     },
     "css-modules-loader-core": {
       "version": "1.1.0",
-      "from": "css-modules-loader-core@>=1.0.1 <2.0.0",
       "resolved": "https://registry.npmjs.org/css-modules-loader-core/-/css-modules-loader-core-1.1.0.tgz",
+      "integrity": "sha1-WQhmgpShvs0mGuCkziGwtVHyHRY=",
       "dependencies": {
         "postcss": {
           "version": "6.0.1",
-          "from": "postcss@6.0.1",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
+          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.2.3 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
     "css-select": {
       "version": "1.2.0",
-      "from": "css-select@>=1.2.0 <1.3.0",
-      "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz",
+      "integrity": "sha1-KzoRBTnFNV8c2NMUYj6HCxIeyFg="
     },
     "css-selector-tokenizer": {
       "version": "0.7.0",
-      "from": "css-selector-tokenizer@>=0.7.0 <0.8.0",
-      "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.7.0.tgz",
+      "integrity": "sha1-5piEdK6MlTR3v15+/s/OzNnPTIY="
     },
     "css-what": {
       "version": "2.1.0",
-      "from": "css-what@>=2.1.0 <2.2.0",
-      "resolved": "https://registry.npmjs.org/css-what/-/css-what-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/css-what/-/css-what-2.1.0.tgz",
+      "integrity": "sha1-lGfQMsOM+u+58teVASUwYvh/ob0="
     },
     "cssesc": {
       "version": "0.1.0",
-      "from": "cssesc@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-0.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-0.1.0.tgz",
+      "integrity": "sha1-yBSQPkViM3GgR3tAEJqq++6t27Q="
     },
     "cssnano": {
       "version": "3.10.0",
-      "from": "cssnano@>=2.6.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/cssnano/-/cssnano-3.10.0.tgz"
+      "resolved": "https://registry.npmjs.org/cssnano/-/cssnano-3.10.0.tgz",
+      "integrity": "sha1-Tzj2zqK5sX+gFJDyPx3GjqZcHDg="
     },
     "csso": {
       "version": "2.3.2",
-      "from": "csso@>=2.3.1 <2.4.0",
-      "resolved": "https://registry.npmjs.org/csso/-/csso-2.3.2.tgz"
+      "resolved": "https://registry.npmjs.org/csso/-/csso-2.3.2.tgz",
+      "integrity": "sha1-3dUsWHAz9J6Utx/FVWnyUuj/X4U="
     },
     "csurf": {
       "version": "1.8.3",
-      "from": "csurf@>=1.8.3 <1.9.0",
       "resolved": "https://registry.npmjs.org/csurf/-/csurf-1.8.3.tgz",
+      "integrity": "sha1-I/KhO/HY/OHQyZZYg5RELLqGpWo=",
       "dependencies": {
         "cookie": {
           "version": "0.1.3",
-          "from": "cookie@0.1.3",
-          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz"
+          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz",
+          "integrity": "sha1-5zSlwUF/zkctWu+Cw4HKu2TRpDU="
         },
         "http-errors": {
           "version": "1.3.1",
-          "from": "http-errors@>=1.3.1 <1.4.0",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
+          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
         }
       }
     },
     "currently-unhandled": {
       "version": "0.4.1",
-      "from": "currently-unhandled@>=0.4.1 <0.5.0",
-      "resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz",
+      "integrity": "sha1-mI3zP+qxke95mmE2nddsF635V+o="
     },
     "custom-event": {
       "version": "1.0.1",
-      "from": "custom-event@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/custom-event/-/custom-event-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/custom-event/-/custom-event-1.0.1.tgz",
+      "integrity": "sha1-XQKkaFCt8bSjF5RqOSj8y1v9BCU="
     },
     "cyclist": {
       "version": "0.2.2",
-      "from": "cyclist@>=0.2.2 <0.3.0",
-      "resolved": "https://registry.npmjs.org/cyclist/-/cyclist-0.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/cyclist/-/cyclist-0.2.2.tgz",
+      "integrity": "sha1-GzN5LhHpFKL9bW7WRHRkRE5fpkA="
     },
     "d": {
       "version": "1.0.0",
-      "from": "d@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/d/-/d-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/d/-/d-1.0.0.tgz",
+      "integrity": "sha1-dUu1v+VUUdpppYuU1F9MWwRi1Y8="
     },
     "d3": {
       "version": "3.5.17",
-      "from": "d3@>=3.5.6 <4.0.0",
-      "resolved": "https://registry.npmjs.org/d3/-/d3-3.5.17.tgz"
+      "resolved": "https://registry.npmjs.org/d3/-/d3-3.5.17.tgz",
+      "integrity": "sha1-vEZ0gAQ3iyGjYMn8fPUjF5B2L7g="
     },
     "dashdash": {
       "version": "1.14.1",
-      "from": "dashdash@>=1.12.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/dashdash/-/dashdash-1.14.1.tgz",
+      "integrity": "sha1-hTz6D3y+L+1d4gMmuN1YEDX24vA=",
       "dependencies": {
         "assert-plus": {
           "version": "1.0.0",
-          "from": "assert-plus@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
         }
       }
     },
     "date-now": {
       "version": "0.1.4",
-      "from": "date-now@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/date-now/-/date-now-0.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/date-now/-/date-now-0.1.4.tgz",
+      "integrity": "sha1-6vQ5/U1ISK105cx9vvIAZyueNFs="
     },
     "dateformat": {
       "version": "2.0.0",
-      "from": "dateformat@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-2.0.0.tgz",
+      "integrity": "sha1-J0Pjq7XD/CRi5SfcpEXgTp9N7hc="
     },
     "deasync": {
       "version": "0.1.9",
-      "from": "deasync@>=0.1.7 <0.2.0",
-      "resolved": "https://registry.npmjs.org/deasync/-/deasync-0.1.9.tgz"
+      "resolved": "https://registry.npmjs.org/deasync/-/deasync-0.1.9.tgz",
+      "integrity": "sha1-9Y3Un6YxEMdL6oQFqQqCi+JtOiQ="
     },
     "debug": {
       "version": "2.6.7",
-      "from": "debug@2.6.7",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.7.tgz"
+      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.7.tgz",
+      "integrity": "sha1-krrR9tBbu2u6Isyoi80OyJTChh4="
     },
     "decamelize": {
       "version": "1.2.0",
-      "from": "decamelize@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
+      "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA="
     },
     "decomment": {
       "version": "0.8.7",
-      "from": "decomment@>=0.8.2 <0.9.0",
-      "resolved": "https://registry.npmjs.org/decomment/-/decomment-0.8.7.tgz"
+      "resolved": "https://registry.npmjs.org/decomment/-/decomment-0.8.7.tgz",
+      "integrity": "sha1-JI8hFvbOOo6N0bY+WzWrpcoFTKU="
     },
     "deep-eql": {
       "version": "0.1.3",
-      "from": "deep-eql@>=0.1.3 <0.2.0",
       "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-0.1.3.tgz",
+      "integrity": "sha1-71WKyrjeJSBs1xOQbXTlaTDrafI=",
       "dependencies": {
         "type-detect": {
           "version": "0.1.1",
-          "from": "type-detect@0.1.1",
-          "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-0.1.1.tgz"
+          "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-0.1.1.tgz",
+          "integrity": "sha1-C6XsKohWQORw6k6FBZcZANrFiCI="
         }
       }
     },
     "deep-extend": {
       "version": "0.4.2",
-      "from": "deep-extend@>=0.4.0 <0.5.0",
-      "resolved": "https://registry.npmjs.org/deep-extend/-/deep-extend-0.4.2.tgz"
+      "resolved": "https://registry.npmjs.org/deep-extend/-/deep-extend-0.4.2.tgz",
+      "integrity": "sha1-SLaZwn4zS/ifEIkr5DL25MfTSn8="
     },
     "deep-is": {
       "version": "0.1.3",
-      "from": "deep-is@>=0.1.3 <0.2.0",
-      "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz",
+      "integrity": "sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ="
     },
     "defaults": {
       "version": "1.0.3",
-      "from": "defaults@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.3.tgz",
+      "integrity": "sha1-xlYFHpgX2f8I7YgUd/P+QBnz730="
     },
     "define-properties": {
       "version": "1.1.2",
-      "from": "define-properties@>=1.1.2 <2.0.0",
       "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.1.2.tgz",
+      "integrity": "sha1-g6c/L+pWmJj7c3GTyPhzyvbUXJQ=",
       "dependencies": {
         "object-keys": {
           "version": "1.0.11",
-          "from": "object-keys@>=1.0.8 <2.0.0",
-          "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.0.11.tgz"
+          "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.0.11.tgz",
+          "integrity": "sha1-xUYBd4rVYPEULODgG8yotW0TQm0="
         }
       }
     },
     "defined": {
       "version": "1.0.0",
-      "from": "defined@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/defined/-/defined-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/defined/-/defined-1.0.0.tgz",
+      "integrity": "sha1-yY2bzvdWdBiOEQlpFRGZ45sfppM="
     },
     "del": {
       "version": "2.2.2",
-      "from": "del@>=2.2.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/del/-/del-2.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/del/-/del-2.2.2.tgz",
+      "integrity": "sha1-wSyYHQZ4RshLyvhiz/kw2Qf/0ag="
     },
     "delayed-stream": {
       "version": "1.0.0",
-      "from": "delayed-stream@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
+      "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk="
     },
     "delegates": {
       "version": "1.0.0",
-      "from": "delegates@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz",
+      "integrity": "sha1-hMbhWbgZBP3KWaDvRM2HDTElD5o="
     },
     "depd": {
       "version": "1.1.0",
-      "from": "depd@>=1.1.0 <1.2.0",
-      "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.0.tgz",
+      "integrity": "sha1-4b2Cxqq2ztlluXuIsX7T5SjKGMM="
     },
     "deprecated": {
       "version": "0.0.1",
-      "from": "deprecated@>=0.0.1 <0.0.2",
-      "resolved": "https://registry.npmjs.org/deprecated/-/deprecated-0.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/deprecated/-/deprecated-0.0.1.tgz",
+      "integrity": "sha1-+cmvVGSvoeepcUWKi97yqpTVuxk="
     },
     "des.js": {
       "version": "1.0.0",
-      "from": "des.js@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/des.js/-/des.js-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/des.js/-/des.js-1.0.0.tgz",
+      "integrity": "sha1-wHTS4qpqipoH29YfmhXCzYPsjsw="
     },
     "destroy": {
       "version": "1.0.4",
-      "from": "destroy@>=1.0.4 <1.1.0",
-      "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.0.4.tgz",
+      "integrity": "sha1-l4hXRCxEdJ5CBmE+N5RiBYJqvYA="
     },
     "detect-file": {
       "version": "0.1.0",
-      "from": "detect-file@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/detect-file/-/detect-file-0.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/detect-file/-/detect-file-0.1.0.tgz",
+      "integrity": "sha1-STXe39lIhkjgBrASlWbpOGcR6mM="
     },
     "detect-node": {
       "version": "2.0.3",
-      "from": "detect-node@>=2.0.3 <3.0.0",
-      "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.0.3.tgz",
+      "integrity": "sha1-ogM8CcyOFY03dI+951B4Mr1s4Sc="
     },
     "detective": {
       "version": "4.5.0",
-      "from": "detective@>=4.3.1 <5.0.0",
       "resolved": "https://registry.npmjs.org/detective/-/detective-4.5.0.tgz",
+      "integrity": "sha1-blqMaybmx6JUsca210kNmOyR7dE=",
       "dependencies": {
         "acorn": {
           "version": "4.0.13",
-          "from": "acorn@>=4.0.3 <5.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz"
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
+          "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c="
         }
       }
     },
     "di": {
       "version": "0.0.1",
-      "from": "di@>=0.0.1 <0.0.2",
-      "resolved": "https://registry.npmjs.org/di/-/di-0.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/di/-/di-0.0.1.tgz",
+      "integrity": "sha1-gGZJMmzqp8qjMG112YXqJ0i6kTw="
     },
     "diff": {
       "version": "3.2.0",
-      "from": "diff@>=3.0.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/diff/-/diff-3.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/diff/-/diff-3.2.0.tgz",
+      "integrity": "sha1-yc45Okt8vQsFinJck98pkCeGj/k="
     },
     "diffie-hellman": {
       "version": "5.0.2",
-      "from": "diffie-hellman@>=5.0.0 <6.0.0",
-      "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.2.tgz",
+      "integrity": "sha1-tYNXOScM/ias9jIJn97SoH8gnl4="
     },
     "dom-serialize": {
       "version": "2.2.1",
-      "from": "dom-serialize@>=2.2.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/dom-serialize/-/dom-serialize-2.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/dom-serialize/-/dom-serialize-2.2.1.tgz",
+      "integrity": "sha1-ViromZ9Evl6jB29UGdzVnrQ6yVs="
     },
     "dom-serializer": {
       "version": "0.1.0",
-      "from": "dom-serializer@>=0.1.0 <0.2.0",
       "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.1.0.tgz",
+      "integrity": "sha1-BzxpdUbOB4DOI75KKOKT5AvDDII=",
       "dependencies": {
         "domelementtype": {
           "version": "1.1.3",
-          "from": "domelementtype@>=1.1.1 <1.2.0",
-          "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.1.3.tgz"
+          "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.1.3.tgz",
+          "integrity": "sha1-vSh3PiZCiBrsUVRJJCmcXNgiGFs="
         }
       }
     },
     "domain-browser": {
       "version": "1.1.7",
-      "from": "domain-browser@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.1.7.tgz"
+      "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.1.7.tgz",
+      "integrity": "sha1-hnqksJP6oF8d4IwG9NeyH9+GmLw="
     },
     "domelementtype": {
       "version": "1.3.0",
-      "from": "domelementtype@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.3.0.tgz",
+      "integrity": "sha1-sXrtguirWeUt2cGbF1bg/BhyBMI="
     },
     "domhandler": {
       "version": "2.4.1",
-      "from": "domhandler@>=2.3.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.4.1.tgz",
+      "integrity": "sha1-iS5HAAqZvlW783dP/qBWHYh5wlk="
     },
     "domutils": {
       "version": "1.5.1",
-      "from": "domutils@1.5.1",
-      "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.5.1.tgz"
+      "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.5.1.tgz",
+      "integrity": "sha1-3NhIiib1Y9YQeeSMn3t+Mjc2gs8="
     },
     "dot-prop": {
       "version": "3.0.0",
-      "from": "dot-prop@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-3.0.0.tgz",
+      "integrity": "sha1-G3CK8JSknJoOfbyteQq6U52sEXc="
     },
     "duplexer": {
       "version": "0.1.1",
-      "from": "duplexer@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz",
+      "integrity": "sha1-rOb/gIwc5mtX0ev5eXessCM0z8E="
     },
     "duplexer2": {
       "version": "0.0.2",
-      "from": "duplexer2@0.0.2",
-      "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.0.2.tgz",
+      "integrity": "sha1-xhTc9n4vsUmVqRcR5aYX6KYKMds="
     },
     "duplexer3": {
       "version": "0.1.4",
-      "from": "duplexer3@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/duplexer3/-/duplexer3-0.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/duplexer3/-/duplexer3-0.1.4.tgz",
+      "integrity": "sha1-7gHdHKwO08vH/b6jfcCo8c4ALOI="
     },
     "duplexify": {
       "version": "3.5.0",
-      "from": "duplexify@>=3.5.0 <4.0.0",
       "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-3.5.0.tgz",
+      "integrity": "sha1-GqdzAC4VeEV+nZ1KULDMquvL1gQ=",
       "dependencies": {
         "end-of-stream": {
           "version": "1.0.0",
-          "from": "end-of-stream@1.0.0",
-          "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.0.0.tgz",
+          "integrity": "sha1-1FlucCc0qT5A6a+GQxnqvZn/Lw4="
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "once": {
           "version": "1.3.3",
-          "from": "once@>=1.3.0 <1.4.0",
-          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz"
+          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz",
+          "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "ecc-jsbn": {
       "version": "0.1.1",
-      "from": "ecc-jsbn@>=0.1.1 <0.2.0",
       "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.1.tgz",
+      "integrity": "sha1-D8c6ntXw1Tw4GTOYUj735UN3dQU=",
       "optional": true
     },
     "ee-first": {
       "version": "1.1.1",
-      "from": "ee-first@1.1.1",
-      "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
+      "integrity": "sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0="
     },
     "ejs": {
       "version": "2.5.6",
-      "from": "ejs@>=2.5.6 <3.0.0",
-      "resolved": "https://registry.npmjs.org/ejs/-/ejs-2.5.6.tgz"
+      "resolved": "https://registry.npmjs.org/ejs/-/ejs-2.5.6.tgz",
+      "integrity": "sha1-R5Y2v6P+Ox3r1SCH8KyyBLTxnIg="
     },
     "electron-to-chromium": {
       "version": "1.3.13",
-      "from": "electron-to-chromium@>=1.2.7 <2.0.0",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.13.tgz"
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.13.tgz",
+      "integrity": "sha1-GzperObgh7teJXoQCwy/6Bsokfw="
     },
     "elliptic": {
       "version": "6.4.0",
-      "from": "elliptic@>=6.0.0 <7.0.0",
-      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.4.0.tgz",
+      "integrity": "sha1-ysmvh2LIWDYYcAPI3+GT5eLq5d8="
     },
     "emojis-list": {
       "version": "2.1.0",
-      "from": "emojis-list@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-2.1.0.tgz",
+      "integrity": "sha1-TapNnbAPmBmIDHn6RXrlsJof04k="
     },
     "encodeurl": {
       "version": "1.0.1",
-      "from": "encodeurl@>=1.0.1 <1.1.0",
-      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.1.tgz",
+      "integrity": "sha1-eePVhlU0aQn+bw9Fpd5oEDspTSA="
     },
     "encoding": {
       "version": "0.1.12",
-      "from": "encoding@>=0.1.11 <0.2.0",
-      "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.12.tgz"
+      "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.12.tgz",
+      "integrity": "sha1-U4tm8+5izRq1HsMjgp0flIDHS+s="
     },
     "end-of-stream": {
       "version": "1.1.0",
-      "from": "end-of-stream@>=1.1.0 <1.2.0",
       "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.1.0.tgz",
+      "integrity": "sha1-6TUyWLqpEIll78QcsO+K3i88+wc=",
       "dependencies": {
         "once": {
           "version": "1.3.3",
-          "from": "once@>=1.3.0 <1.4.0",
-          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz"
+          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz",
+          "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA="
         }
       }
     },
     "engine.io": {
       "version": "1.8.4",
-      "from": "engine.io@>=1.8.4 <1.9.0",
       "resolved": "https://registry.npmjs.org/engine.io/-/engine.io-1.8.4.tgz",
+      "integrity": "sha1-d7zhK4Dl1gQpM3/sOw2vaR68kAM=",
       "dependencies": {
         "debug": {
           "version": "2.3.3",
-          "from": "debug@2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
+          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
+          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
         }
       }
     },
     "engine.io-client": {
       "version": "1.8.4",
-      "from": "engine.io-client@>=1.8.4 <1.9.0",
       "resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-1.8.4.tgz",
+      "integrity": "sha1-n+hd7iWFPKa6viW9KtaHEIY+kcI=",
       "dependencies": {
         "component-emitter": {
           "version": "1.2.1",
-          "from": "component-emitter@1.2.1",
-          "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz",
+          "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY="
         },
         "debug": {
           "version": "2.3.3",
-          "from": "debug@2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
+          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
+          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
         },
         "ws": {
           "version": "1.1.2",
-          "from": "ws@1.1.2",
-          "resolved": "https://registry.npmjs.org/ws/-/ws-1.1.2.tgz"
+          "resolved": "https://registry.npmjs.org/ws/-/ws-1.1.2.tgz",
+          "integrity": "sha1-iiRPoFJAHgjJiGz0SoUYnh/UBn8="
         }
       }
     },
     "engine.io-parser": {
       "version": "1.3.2",
-      "from": "engine.io-parser@1.3.2",
-      "resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-1.3.2.tgz"
+      "resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-1.3.2.tgz",
+      "integrity": "sha1-k3sHnwAH0Ik+xW1GyyILjLQ1Igo="
     },
     "enhanced-resolve": {
       "version": "0.9.1",
-      "from": "enhanced-resolve@>=0.9.0 <0.10.0",
       "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-0.9.1.tgz",
+      "integrity": "sha1-TW5omzcl+GCQknzMhs2fFjW4ni4=",
       "dependencies": {
         "memory-fs": {
           "version": "0.2.0",
-          "from": "memory-fs@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.2.0.tgz",
+          "integrity": "sha1-8rslNovBIeORwlIN6Slpyu4KApA="
         }
       }
     },
     "ent": {
       "version": "2.2.0",
-      "from": "ent@>=2.2.0 <2.3.0",
-      "resolved": "https://registry.npmjs.org/ent/-/ent-2.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/ent/-/ent-2.2.0.tgz",
+      "integrity": "sha1-6WQhkyWiHQX0RGai9obtbOX13R0="
     },
     "entities": {
       "version": "1.1.1",
-      "from": "entities@>=1.1.1 <1.2.0",
-      "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.1.tgz",
+      "integrity": "sha1-blwtClYhtdra7O+AuQ7ftc13cvA="
     },
     "envify": {
       "version": "3.4.1",
-      "from": "envify@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/envify/-/envify-3.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/envify/-/envify-3.4.1.tgz",
+      "integrity": "sha1-1xIjKejfFoi6dxsSUBkXyc5cvOg="
     },
     "enzyme": {
       "version": "2.7.0",
-      "from": "enzyme@2.7.0",
       "resolved": "https://registry.npmjs.org/enzyme/-/enzyme-2.7.0.tgz",
+      "integrity": "sha1-dyR3gAVHyiUUzAryWOZHwWau6Jk=",
       "dependencies": {
         "lodash": {
           "version": "4.17.4",
-          "from": "lodash@>=4.17.2 <5.0.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz"
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
         },
         "uuid": {
           "version": "2.0.3",
-          "from": "uuid@>=2.0.3 <3.0.0",
-          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz"
+          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz",
+          "integrity": "sha1-Z+LoY3lyFVMN/zGOW/nc6/1Hsho="
         }
       }
     },
     "errno": {
       "version": "0.1.4",
-      "from": "errno@>=0.1.3 <0.2.0",
-      "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.4.tgz",
+      "integrity": "sha1-uJbiOp5ei6M4cfyZar02NfyaHH0="
     },
     "error-ex": {
       "version": "1.3.1",
-      "from": "error-ex@>=1.2.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.1.tgz"
+      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.1.tgz",
+      "integrity": "sha1-+FWobOYa3E6GIcPNoh56dhLDqNw="
     },
     "errorhandler": {
       "version": "1.4.3",
-      "from": "errorhandler@>=1.4.2 <1.5.0",
-      "resolved": "https://registry.npmjs.org/errorhandler/-/errorhandler-1.4.3.tgz"
+      "resolved": "https://registry.npmjs.org/errorhandler/-/errorhandler-1.4.3.tgz",
+      "integrity": "sha1-t7cO2PNZ6duICS8tIMD4MUIK2D8="
     },
     "es-abstract": {
       "version": "1.7.0",
-      "from": "es-abstract@>=1.6.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.7.0.tgz",
+      "integrity": "sha1-363ndOAb/Nl/lhgCmMRJyGI/uUw="
     },
     "es-to-primitive": {
       "version": "1.1.1",
-      "from": "es-to-primitive@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.1.1.tgz",
+      "integrity": "sha1-RTVSSKiJeQNLZ5Lhm7gfK3l13Q0="
     },
     "es5-ext": {
       "version": "0.10.21",
-      "from": "es5-ext@>=0.10.14 <0.11.0",
-      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.21.tgz"
+      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.21.tgz",
+      "integrity": "sha1-Gacl+eUdAwC7wejoIRCf2dr1WSU="
     },
     "es6-collections": {
       "version": "0.5.6",
-      "from": "es6-collections@0.5.6",
-      "resolved": "https://registry.npmjs.org/es6-collections/-/es6-collections-0.5.6.tgz"
+      "resolved": "https://registry.npmjs.org/es6-collections/-/es6-collections-0.5.6.tgz",
+      "integrity": "sha1-VVLoAK0SwYIM2ivUp5rn27A9iaI="
     },
     "es6-iterator": {
       "version": "2.0.1",
-      "from": "es6-iterator@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.1.tgz",
+      "integrity": "sha1-jjGcnwRTv1ddN0lAplWSDlnKVRI="
     },
     "es6-promise": {
       "version": "4.1.0",
-      "from": "es6-promise@>=4.1.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.0.tgz",
+      "integrity": "sha1-3aA8qPn4m8WX5omEKSnee6jOvfA="
     },
     "es6-symbol": {
       "version": "3.1.1",
-      "from": "es6-symbol@>=3.1.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.1.tgz",
+      "integrity": "sha1-vwDvT9q2uhtG7Le2KbTH7VcVzHc="
     },
     "es6-templates": {
       "version": "0.2.3",
-      "from": "es6-templates@>=0.2.2 <0.3.0",
-      "resolved": "https://registry.npmjs.org/es6-templates/-/es6-templates-0.2.3.tgz"
+      "resolved": "https://registry.npmjs.org/es6-templates/-/es6-templates-0.2.3.tgz",
+      "integrity": "sha1-XLmsn7He1usSOTQrgdeSu7QHjuQ="
     },
     "es6-weak-map": {
       "version": "2.0.2",
-      "from": "es6-weak-map@>=2.0.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/es6-weak-map/-/es6-weak-map-2.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/es6-weak-map/-/es6-weak-map-2.0.2.tgz",
+      "integrity": "sha1-XjqzIlH/0VOKH45f+hNXdy+S2W8="
     },
     "escape-html": {
       "version": "1.0.3",
-      "from": "escape-html@>=1.0.3 <1.1.0",
-      "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
+      "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg="
     },
     "escape-string-regexp": {
       "version": "1.0.5",
-      "from": "escape-string-regexp@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
+      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ="
     },
     "escodegen": {
       "version": "1.8.1",
-      "from": "escodegen@>=1.8.0 <1.9.0",
       "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-1.8.1.tgz",
+      "integrity": "sha1-WltTr0aTEQvrsIZ6o0MN07cKEBg=",
       "dependencies": {
         "esprima": {
           "version": "2.7.3",
-          "from": "esprima@>=2.7.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz"
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz",
+          "integrity": "sha1-luO3DVd59q1JzQMmc9HDEnZ7pYE="
         },
         "source-map": {
           "version": "0.2.0",
-          "from": "source-map@>=0.2.0 <0.3.0",
           "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.2.0.tgz",
+          "integrity": "sha1-2rc/vPwrqBm03gO9b26qSBZLP50=",
           "optional": true
         }
       }
     },
     "esprima": {
       "version": "3.1.3",
-      "from": "esprima@>=3.1.0 <3.2.0",
-      "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz",
+      "integrity": "sha1-/cpRzuYTOJXjyI1TXOSdv/YqRjM="
     },
     "estraverse": {
       "version": "1.9.3",
-      "from": "estraverse@>=1.9.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-1.9.3.tgz"
+      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-1.9.3.tgz",
+      "integrity": "sha1-r2fy3JIlgkFZUJJgkaQAXSnJu0Q="
     },
     "esutils": {
       "version": "2.0.2",
-      "from": "esutils@>=2.0.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.2.tgz",
+      "integrity": "sha1-Cr9PHKpbyx96nYrMbepPqqBLrJs="
     },
     "etag": {
       "version": "1.7.0",
-      "from": "etag@>=1.7.0 <1.8.0",
-      "resolved": "https://registry.npmjs.org/etag/-/etag-1.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/etag/-/etag-1.7.0.tgz",
+      "integrity": "sha1-A9MLX2fdbmMtKUXTDWZScxo01dg="
     },
     "event-stream": {
       "version": "3.0.20",
-      "from": "event-stream@>=3.0.20 <3.1.0",
-      "resolved": "https://registry.npmjs.org/event-stream/-/event-stream-3.0.20.tgz"
+      "resolved": "https://registry.npmjs.org/event-stream/-/event-stream-3.0.20.tgz",
+      "integrity": "sha1-A4u7LqnqkDhbJvvBhU0LU58qvqM="
     },
     "eventemitter3": {
       "version": "1.2.0",
-      "from": "eventemitter3@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-1.2.0.tgz",
+      "integrity": "sha1-HIaZHYFq0eUEdQ5zh0Ik7PO+xQg="
     },
     "events": {
       "version": "1.1.1",
-      "from": "events@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/events/-/events-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/events/-/events-1.1.1.tgz",
+      "integrity": "sha1-nr23Y1rQmccNzEwqH1AEKI6L2SQ="
     },
     "eventsource": {
       "version": "0.1.6",
-      "from": "eventsource@0.1.6",
-      "resolved": "https://registry.npmjs.org/eventsource/-/eventsource-0.1.6.tgz"
+      "resolved": "https://registry.npmjs.org/eventsource/-/eventsource-0.1.6.tgz",
+      "integrity": "sha1-Cs7ehJ7X3RzMMsgRuxG5RNTykjI="
     },
     "evp_bytestokey": {
       "version": "1.0.0",
-      "from": "evp_bytestokey@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/evp_bytestokey/-/evp_bytestokey-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/evp_bytestokey/-/evp_bytestokey-1.0.0.tgz",
+      "integrity": "sha1-SXtmrZ/vZc18CKYYCCS6FHa2blM="
     },
     "execa": {
       "version": "0.4.0",
-      "from": "execa@>=0.4.0 <0.5.0",
-      "resolved": "https://registry.npmjs.org/execa/-/execa-0.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/execa/-/execa-0.4.0.tgz",
+      "integrity": "sha1-TrZGejaglfq7KXD/nV4/t7zm68M="
     },
     "exit-hook": {
       "version": "1.1.1",
-      "from": "exit-hook@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/exit-hook/-/exit-hook-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/exit-hook/-/exit-hook-1.1.1.tgz",
+      "integrity": "sha1-8FyiM7SMBdVP/wd2XfhQfpXAL/g="
     },
     "expand-braces": {
       "version": "0.1.2",
-      "from": "expand-braces@>=0.1.1 <0.2.0",
       "resolved": "https://registry.npmjs.org/expand-braces/-/expand-braces-0.1.2.tgz",
+      "integrity": "sha1-SIsdHSRRyz06axks/AMPRMWFX+o=",
       "dependencies": {
         "braces": {
           "version": "0.1.5",
-          "from": "braces@>=0.1.2 <0.2.0",
-          "resolved": "https://registry.npmjs.org/braces/-/braces-0.1.5.tgz"
+          "resolved": "https://registry.npmjs.org/braces/-/braces-0.1.5.tgz",
+          "integrity": "sha1-wIVxEIUpHYt1/ddOqw+FlygHEeY="
         },
         "expand-range": {
           "version": "0.1.1",
-          "from": "expand-range@>=0.1.0 <0.2.0",
-          "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-0.1.1.tgz"
+          "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-0.1.1.tgz",
+          "integrity": "sha1-TLjtoJk8pW+k9B/ELzy7TMrf8EQ="
         },
         "is-number": {
           "version": "0.1.1",
-          "from": "is-number@>=0.1.1 <0.2.0",
-          "resolved": "https://registry.npmjs.org/is-number/-/is-number-0.1.1.tgz"
+          "resolved": "https://registry.npmjs.org/is-number/-/is-number-0.1.1.tgz",
+          "integrity": "sha1-aaevEWlj1HIG7JvZtIoUIW8eOAY="
         },
         "repeat-string": {
           "version": "0.2.2",
-          "from": "repeat-string@>=0.2.2 <0.3.0",
-          "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-0.2.2.tgz"
+          "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-0.2.2.tgz",
+          "integrity": "sha1-x6jTI2BoNiBZp+RlH8aITosftK4="
         }
       }
     },
     "expand-brackets": {
       "version": "0.1.5",
-      "from": "expand-brackets@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz"
+      "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
+      "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s="
     },
     "expand-range": {
       "version": "1.8.2",
-      "from": "expand-range@>=1.8.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz"
+      "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz",
+      "integrity": "sha1-opnv/TNf4nIeuujiV+x5ZE/IUzc="
     },
     "expand-tilde": {
       "version": "1.2.2",
-      "from": "expand-tilde@>=1.2.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-1.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-1.2.2.tgz",
+      "integrity": "sha1-C4HrqJflo9MdHD0QL48BRB5VlEk="
     },
     "express": {
       "version": "4.14.1",
-      "from": "express@>=4.14.0 <4.15.0",
       "resolved": "https://registry.npmjs.org/express/-/express-4.14.1.tgz",
+      "integrity": "sha1-ZGwjf3ZvFIwhIK/wc4F7nk1+DTM=",
       "dependencies": {
         "debug": {
           "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "finalhandler": {
           "version": "0.5.1",
-          "from": "finalhandler@0.5.1",
-          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.5.1.tgz"
+          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.5.1.tgz",
+          "integrity": "sha1-LEANjUUwk1vCMlScX6OF7Afeb80="
         },
         "ms": {
           "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         },
         "qs": {
           "version": "6.2.0",
-          "from": "qs@6.2.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-6.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.2.0.tgz",
+          "integrity": "sha1-O3hIwDwt7OaalSKw+ujEEm10Xzs="
         }
       }
     },
     "express-session": {
       "version": "1.11.3",
-      "from": "express-session@>=1.11.3 <1.12.0",
       "resolved": "https://registry.npmjs.org/express-session/-/express-session-1.11.3.tgz",
+      "integrity": "sha1-XMmPP1/4Ttg1+Ry/CqvQxxB0AK8=",
       "dependencies": {
         "cookie": {
           "version": "0.1.3",
-          "from": "cookie@0.1.3",
-          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz"
+          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz",
+          "integrity": "sha1-5zSlwUF/zkctWu+Cw4HKu2TRpDU="
         },
         "debug": {
           "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "depd": {
           "version": "1.0.1",
-          "from": "depd@>=1.0.1 <1.1.0",
-          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz",
+          "integrity": "sha1-gK7GTJ1tl+ZcwqnKqTwKpqv3Oqo="
         },
         "ms": {
           "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         },
         "uid-safe": {
           "version": "2.0.0",
-          "from": "uid-safe@>=2.0.0 <2.1.0",
-          "resolved": "https://registry.npmjs.org/uid-safe/-/uid-safe-2.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/uid-safe/-/uid-safe-2.0.0.tgz",
+          "integrity": "sha1-p/PGymSh9qXQTsDvPkw9U2cxcTc="
         }
       }
     },
     "extend": {
       "version": "3.0.1",
-      "from": "extend@>=3.0.0 <3.1.0",
-      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz",
+      "integrity": "sha1-p1Xqe8Gt/MWjHOfnYtuq3F5jZEQ="
     },
     "extend-shallow": {
       "version": "2.0.1",
-      "from": "extend-shallow@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+      "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8="
     },
     "extglob": {
       "version": "0.3.2",
-      "from": "extglob@>=0.3.1 <0.4.0",
-      "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz"
+      "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
+      "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
     },
     "extract-zip": {
       "version": "1.5.0",
-      "from": "extract-zip@>=1.5.0 <1.6.0",
       "resolved": "https://registry.npmjs.org/extract-zip/-/extract-zip-1.5.0.tgz",
+      "integrity": "sha1-ksz22B73Cp+kwXRxFMzvbYaIpsQ=",
       "dependencies": {
         "debug": {
           "version": "0.7.4",
-          "from": "debug@0.7.4",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-0.7.4.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-0.7.4.tgz",
+          "integrity": "sha1-BuHqgILCyxTjmAbiLi9vdX+Srzk="
         },
         "minimist": {
           "version": "0.0.8",
-          "from": "minimist@0.0.8",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz"
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
+          "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0="
         },
         "mkdirp": {
           "version": "0.5.0",
-          "from": "mkdirp@0.5.0",
-          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.0.tgz"
+          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.0.tgz",
+          "integrity": "sha1-HXMHam35hs2TROFecfzAWkyavxI="
         }
       }
     },
     "extsprintf": {
       "version": "1.0.2",
-      "from": "extsprintf@1.0.2",
-      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.0.2.tgz",
+      "integrity": "sha1-4QgOBljjALBilJkMxw4VAiNf1VA="
     },
     "fancy-log": {
       "version": "1.3.0",
-      "from": "fancy-log@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/fancy-log/-/fancy-log-1.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/fancy-log/-/fancy-log-1.3.0.tgz",
+      "integrity": "sha1-Rb4X0Cu5kX1gzP/UmVyZnmyMmUg="
     },
     "fast-levenshtein": {
       "version": "2.0.6",
-      "from": "fast-levenshtein@>=2.0.4 <2.1.0",
-      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz"
+      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
+      "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc="
     },
     "fastparse": {
       "version": "1.1.1",
-      "from": "fastparse@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.1.tgz",
+      "integrity": "sha1-0eJkOzipTXWDtHkGDmxK/8lAcfg="
     },
     "faye-websocket": {
       "version": "0.10.0",
-      "from": "faye-websocket@>=0.10.0 <0.11.0",
-      "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz"
+      "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz",
+      "integrity": "sha1-TkkvjQTftviQA1B/btvy1QHnxvQ="
     },
     "fbjs": {
       "version": "0.6.1",
-      "from": "fbjs@>=0.6.1 <0.7.0",
       "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.6.1.tgz",
+      "integrity": "sha1-lja3cF9bqWhNRLcveDISVK/IYPc=",
       "dependencies": {
         "core-js": {
           "version": "1.2.7",
-          "from": "core-js@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
+          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
         }
       }
     },
     "fd-slicer": {
       "version": "1.0.1",
-      "from": "fd-slicer@>=1.0.1 <1.1.0",
-      "resolved": "https://registry.npmjs.org/fd-slicer/-/fd-slicer-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/fd-slicer/-/fd-slicer-1.0.1.tgz",
+      "integrity": "sha1-i1vL2ewyfFBBv5qwI/1nUPEXfmU="
     },
     "figures": {
       "version": "1.7.0",
-      "from": "figures@>=1.3.5 <2.0.0",
-      "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz",
+      "integrity": "sha1-y+Hjr/zxzUS4DK3+0o3Hk6lwHS4="
     },
     "file-loader": {
       "version": "0.8.5",
-      "from": "file-loader@>=0.8.5 <0.9.0",
-      "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.8.5.tgz"
+      "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.8.5.tgz",
+      "integrity": "sha1-knXQMf54DyfUf19K8CvUNxPMFRs="
     },
     "filename-regex": {
       "version": "2.0.1",
-      "from": "filename-regex@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz",
+      "integrity": "sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY="
     },
     "filesize": {
       "version": "3.5.10",
-      "from": "filesize@>=3.5.9 <4.0.0",
-      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.5.10.tgz"
+      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.5.10.tgz",
+      "integrity": "sha1-/I+iPdtO+eXgq24eZPZ5okpWdh8="
     },
     "fill-range": {
       "version": "2.2.3",
-      "from": "fill-range@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz"
+      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz",
+      "integrity": "sha1-ULd9/X5Gm8dJJHCWNpn+eoSFpyM="
     },
     "filled-array": {
       "version": "1.1.0",
-      "from": "filled-array@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/filled-array/-/filled-array-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/filled-array/-/filled-array-1.1.0.tgz",
+      "integrity": "sha1-w8T2xmO5I0WamqKZEtLQMfFQf4Q="
     },
     "finalhandler": {
       "version": "1.0.3",
-      "from": "finalhandler@1.0.3",
-      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.3.tgz",
+      "integrity": "sha1-70fneVDpmXgOhgIqVg4yF+DQzIk="
     },
     "find-index": {
       "version": "0.1.1",
-      "from": "find-index@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
+      "integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ="
     },
     "find-up": {
       "version": "1.1.2",
-      "from": "find-up@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
+      "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8="
     },
     "findup-sync": {
       "version": "0.4.3",
-      "from": "findup-sync@>=0.4.2 <0.5.0",
-      "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.4.3.tgz"
+      "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.4.3.tgz",
+      "integrity": "sha1-QAQ5Kee8YK3wt/SCfExudaDeyhI="
     },
     "fined": {
       "version": "1.0.2",
-      "from": "fined@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/fined/-/fined-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/fined/-/fined-1.0.2.tgz",
+      "integrity": "sha1-WyhCS3YNdZiWC374SA3/itNmDpc="
     },
     "first-chunk-stream": {
       "version": "1.0.0",
-      "from": "first-chunk-stream@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/first-chunk-stream/-/first-chunk-stream-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/first-chunk-stream/-/first-chunk-stream-1.0.0.tgz",
+      "integrity": "sha1-Wb+1DNkF9g18OUzT2ayqtOatk04="
     },
     "flagged-respawn": {
       "version": "0.3.2",
-      "from": "flagged-respawn@>=0.3.2 <0.4.0",
-      "resolved": "https://registry.npmjs.org/flagged-respawn/-/flagged-respawn-0.3.2.tgz"
+      "resolved": "https://registry.npmjs.org/flagged-respawn/-/flagged-respawn-0.3.2.tgz",
+      "integrity": "sha1-/xke3c1wiKZ1smEP/8l2vpuAdLU="
     },
     "flatten": {
       "version": "1.0.2",
-      "from": "flatten@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz",
+      "integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I="
     },
     "for-in": {
       "version": "1.0.2",
-      "from": "for-in@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
+      "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA="
     },
     "for-own": {
       "version": "0.1.5",
-      "from": "for-own@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz"
+      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz",
+      "integrity": "sha1-UmXGgaTylNq78XyVCbZ2OqhFEM4="
     },
     "foreach": {
       "version": "2.0.5",
-      "from": "foreach@>=2.0.5 <3.0.0",
-      "resolved": "https://registry.npmjs.org/foreach/-/foreach-2.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/foreach/-/foreach-2.0.5.tgz",
+      "integrity": "sha1-C+4AUBiusmDQo6865ljdATbsG5k="
     },
     "forever-agent": {
       "version": "0.6.1",
-      "from": "forever-agent@>=0.6.1 <0.7.0",
-      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz"
+      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
+      "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE="
     },
     "fork-stream": {
       "version": "0.0.4",
-      "from": "fork-stream@>=0.0.4 <0.0.5",
-      "resolved": "https://registry.npmjs.org/fork-stream/-/fork-stream-0.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/fork-stream/-/fork-stream-0.0.4.tgz",
+      "integrity": "sha1-24Sfznf2cIpfjzhq5TOgkHtUrnA="
     },
     "form-data": {
       "version": "2.1.4",
-      "from": "form-data@>=2.1.1 <2.2.0",
-      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
+      "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE="
     },
     "formatio": {
       "version": "1.1.1",
-      "from": "formatio@1.1.1",
-      "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.1.1.tgz",
+      "integrity": "sha1-XtPM1jZVEJc4NGXZlhmRAOhhYek="
     },
     "forwarded": {
       "version": "0.1.0",
-      "from": "forwarded@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.0.tgz",
+      "integrity": "sha1-Ge+YdMSuHCl7zweP3mOgm2aoQ2M="
     },
     "fresh": {
       "version": "0.3.0",
-      "from": "fresh@0.3.0",
-      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.3.0.tgz",
+      "integrity": "sha1-ZR+DjiJCTnVm3hYdg1jKoZn4PU8="
     },
     "from": {
       "version": "0.1.7",
-      "from": "from@>=0.0.0 <1.0.0",
-      "resolved": "https://registry.npmjs.org/from/-/from-0.1.7.tgz"
+      "resolved": "https://registry.npmjs.org/from/-/from-0.1.7.tgz",
+      "integrity": "sha1-g8YK/Fi5xWmXAH7Rp2izqzA6RP4="
     },
     "fs-exists-sync": {
       "version": "0.1.0",
-      "from": "fs-exists-sync@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/fs-exists-sync/-/fs-exists-sync-0.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/fs-exists-sync/-/fs-exists-sync-0.1.0.tgz",
+      "integrity": "sha1-mC1ok6+RjnLQjeyehnP/K1qNat0="
     },
     "fs-extra": {
       "version": "0.26.7",
-      "from": "fs-extra@>=0.26.7 <0.27.0",
-      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz"
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz",
+      "integrity": "sha1-muH92UiXeY7at20JGM9C0MMYT6k="
     },
     "fs.realpath": {
       "version": "1.0.0",
-      "from": "fs.realpath@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
+      "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
     },
     "fstream": {
       "version": "1.0.11",
-      "from": "fstream@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz"
+      "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
+      "integrity": "sha1-XB+x8RdHcRTwYyoOtLcbPLD9MXE="
     },
     "ftp": {
       "version": "0.3.10",
-      "from": "ftp@>=0.3.8 <0.4.0",
-      "resolved": "https://registry.npmjs.org/ftp/-/ftp-0.3.10.tgz"
+      "resolved": "https://registry.npmjs.org/ftp/-/ftp-0.3.10.tgz",
+      "integrity": "sha1-kZfYYa2BQvPmPVqDv+TFn3MwiF0="
     },
     "function-bind": {
       "version": "1.1.0",
-      "from": "function-bind@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.0.tgz",
+      "integrity": "sha1-FhdnFMgBeY5Ojyz391KUZ7tKV3E="
     },
     "function.prototype.name": {
       "version": "1.0.0",
-      "from": "function.prototype.name@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.0.0.tgz",
+      "integrity": "sha1-X1I8pk5JGl+Vq6gMweORCAoUSC4="
     },
     "gauge": {
       "version": "2.7.4",
-      "from": "gauge@>=2.7.3 <2.8.0",
-      "resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz"
+      "resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz",
+      "integrity": "sha1-LANAXHU4w51+s3sxcCLjJfsBi/c="
     },
     "gaze": {
       "version": "0.5.2",
-      "from": "gaze@>=0.5.1 <0.6.0",
-      "resolved": "https://registry.npmjs.org/gaze/-/gaze-0.5.2.tgz"
+      "resolved": "https://registry.npmjs.org/gaze/-/gaze-0.5.2.tgz",
+      "integrity": "sha1-QLcJU30k0dRXZ9takIaJ3+aaxE8="
     },
     "generate-function": {
       "version": "2.0.0",
-      "from": "generate-function@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/generate-function/-/generate-function-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/generate-function/-/generate-function-2.0.0.tgz",
+      "integrity": "sha1-aFj+fAlpt9TpCTM3ZHrHn2DfvnQ="
     },
     "generate-object-property": {
       "version": "1.2.0",
-      "from": "generate-object-property@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/generate-object-property/-/generate-object-property-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/generate-object-property/-/generate-object-property-1.2.0.tgz",
+      "integrity": "sha1-nA4cQDCM6AT0eDYYuTf6iPmdUNA="
     },
     "generic-names": {
       "version": "1.0.2",
-      "from": "generic-names@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/generic-names/-/generic-names-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/generic-names/-/generic-names-1.0.2.tgz",
+      "integrity": "sha1-4lt/7OtbWo8o9flyp8z+V+Virc0="
     },
     "get-caller-file": {
       "version": "1.0.2",
-      "from": "get-caller-file@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz",
+      "integrity": "sha1-9wLmMSfn4jHBYKgMFVSstw1QR+U="
     },
     "get-own-enumerable-property-symbols": {
       "version": "1.0.1",
-      "from": "get-own-enumerable-property-symbols@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/get-own-enumerable-property-symbols/-/get-own-enumerable-property-symbols-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/get-own-enumerable-property-symbols/-/get-own-enumerable-property-symbols-1.0.1.tgz",
+      "integrity": "sha1-8dTjrRQC4DmJjlbR6bmqkkwm5IQ="
     },
     "get-stdin": {
       "version": "4.0.1",
-      "from": "get-stdin@>=4.0.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz",
+      "integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4="
     },
     "get-stream": {
       "version": "3.0.0",
-      "from": "get-stream@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz",
+      "integrity": "sha1-jpQ9E1jcN1VQVOy+LtsFqhdO3hQ="
     },
     "getpass": {
       "version": "0.1.7",
-      "from": "getpass@>=0.1.1 <0.2.0",
       "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
+      "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo=",
       "dependencies": {
         "assert-plus": {
           "version": "1.0.0",
-          "from": "assert-plus@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
         }
       }
     },
     "git-rev": {
       "version": "0.2.1",
-      "from": "git-rev@0.2.1",
-      "resolved": "https://registry.npmjs.org/git-rev/-/git-rev-0.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/git-rev/-/git-rev-0.2.1.tgz",
+      "integrity": "sha1-jMvSCSs0W8LJFJVIOW31SWRspj8="
     },
     "glamor": {
       "version": "2.20.25",
-      "from": "glamor@>=2.20.24 <3.0.0",
       "resolved": "https://registry.npmjs.org/glamor/-/glamor-2.20.25.tgz",
+      "integrity": "sha1-cbhLgrZ6kyd3GsWd5T7pFdFIpKM=",
       "dependencies": {
         "core-js": {
           "version": "1.2.7",
-          "from": "core-js@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
+          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
         },
         "fbjs": {
           "version": "0.8.12",
-          "from": "fbjs@>=0.8.8 <0.9.0",
-          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz"
+          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz",
+          "integrity": "sha1-ELXZL3bUVXX9Y6IX1OoCvqL47QQ="
         }
       }
     },
     "glob": {
       "version": "7.1.2",
-      "from": "glob@>=7.0.5 <8.0.0",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
+      "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ=="
     },
     "glob-base": {
       "version": "0.3.0",
-      "from": "glob-base@>=0.3.0 <0.4.0",
-      "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz",
+      "integrity": "sha1-27Fk9iIbHAscz4Kuoyi0l98Oo8Q="
     },
     "glob-escape": {
       "version": "0.0.2",
-      "from": "glob-escape@>=0.0.1 <0.1.0",
-      "resolved": "https://registry.npmjs.org/glob-escape/-/glob-escape-0.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/glob-escape/-/glob-escape-0.0.2.tgz",
+      "integrity": "sha1-nCf3gh7RwTd1gvPv2VWOP2dWKO0="
     },
     "glob-parent": {
       "version": "2.0.0",
-      "from": "glob-parent@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz",
+      "integrity": "sha1-gTg9ctsFT8zPUzbaqQLxgvbtuyg="
     },
     "glob-stream": {
       "version": "3.1.18",
-      "from": "glob-stream@>=3.1.5 <4.0.0",
       "resolved": "https://registry.npmjs.org/glob-stream/-/glob-stream-3.1.18.tgz",
+      "integrity": "sha1-kXCl8St5Awb9/lmPMT+PeVT9FDs=",
       "dependencies": {
         "glob": {
           "version": "4.5.3",
-          "from": "glob@>=4.3.1 <5.0.0",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-4.5.3.tgz"
+          "resolved": "https://registry.npmjs.org/glob/-/glob-4.5.3.tgz",
+          "integrity": "sha1-xstz0yJsHv7wTePFbQEvAzd+4V8="
         },
         "minimatch": {
           "version": "2.0.10",
-          "from": "minimatch@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-2.0.10.tgz"
+          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-2.0.10.tgz",
+          "integrity": "sha1-jQh8OcazjAAbl/ynzm0OHoCvusc="
         },
         "readable-stream": {
           "version": "1.0.34",
-          "from": "readable-stream@>=1.0.33-1 <1.1.0-0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
         },
         "through2": {
           "version": "0.6.5",
-          "from": "through2@>=0.6.1 <0.7.0",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz"
+          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
+          "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg="
         }
       }
     },
     "glob-watcher": {
       "version": "0.0.6",
-      "from": "glob-watcher@>=0.0.6 <0.0.7",
-      "resolved": "https://registry.npmjs.org/glob-watcher/-/glob-watcher-0.0.6.tgz"
+      "resolved": "https://registry.npmjs.org/glob-watcher/-/glob-watcher-0.0.6.tgz",
+      "integrity": "sha1-uVtKjfdLOcgymLDAXJeLTZo7cQs="
     },
     "glob2base": {
       "version": "0.0.12",
-      "from": "glob2base@>=0.0.12 <0.0.13",
-      "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz"
+      "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz",
+      "integrity": "sha1-nUGbPijxLoOjYhZKJ3BVkiycDVY="
     },
     "global-modules": {
       "version": "0.2.3",
-      "from": "global-modules@>=0.2.3 <0.3.0",
-      "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-0.2.3.tgz"
+      "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-0.2.3.tgz",
+      "integrity": "sha1-6lo77ULG1s6ZWk+KEmm12uIjgo0="
     },
     "global-prefix": {
       "version": "0.1.5",
-      "from": "global-prefix@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-0.1.5.tgz"
+      "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-0.1.5.tgz",
+      "integrity": "sha1-jTvGuNo8qBEqFg2NSW/wRiv+948="
     },
     "globby": {
       "version": "5.0.0",
-      "from": "globby@>=5.0.0 <5.1.0",
-      "resolved": "https://registry.npmjs.org/globby/-/globby-5.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/globby/-/globby-5.0.0.tgz",
+      "integrity": "sha1-69hGZ8oNuzMLmbz8aOrCvFQ3Dg0="
     },
     "globule": {
       "version": "0.1.0",
-      "from": "globule@>=0.1.0 <0.2.0",
       "resolved": "https://registry.npmjs.org/globule/-/globule-0.1.0.tgz",
+      "integrity": "sha1-2cjt3h2nnRJaFRt5UzuXhnY0auU=",
       "dependencies": {
         "glob": {
           "version": "3.1.21",
-          "from": "glob@>=3.1.21 <3.2.0",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-3.1.21.tgz"
+          "resolved": "https://registry.npmjs.org/glob/-/glob-3.1.21.tgz",
+          "integrity": "sha1-0p4KBV3qUTj00H7UDomC6DwgZs0="
         },
         "graceful-fs": {
           "version": "1.2.3",
-          "from": "graceful-fs@>=1.2.0 <1.3.0",
-          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-1.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-1.2.3.tgz",
+          "integrity": "sha1-FaSAaldUfLLS2/J/QuiajDRRs2Q="
         },
         "inherits": {
           "version": "1.0.2",
-          "from": "inherits@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/inherits/-/inherits-1.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/inherits/-/inherits-1.0.2.tgz",
+          "integrity": "sha1-ykMJ2t7mtUzAuNJH6NfHoJdb3Js="
         },
         "lodash": {
           "version": "1.0.2",
-          "from": "lodash@>=1.0.1 <1.1.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-1.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-1.0.2.tgz",
+          "integrity": "sha1-j1dWDIO1n8JwvT1WG2kAQ0MOJVE="
         },
         "minimatch": {
           "version": "0.2.14",
-          "from": "minimatch@>=0.2.11 <0.3.0",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.2.14.tgz"
+          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.2.14.tgz",
+          "integrity": "sha1-x054BXT2PG+aCQ6Q775u9TpqdWo="
         }
       }
     },
     "glogg": {
       "version": "1.0.0",
-      "from": "glogg@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/glogg/-/glogg-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/glogg/-/glogg-1.0.0.tgz",
+      "integrity": "sha1-f+DxmfV6yQbPUS/urY+Q7kooT8U="
     },
     "got": {
       "version": "5.7.1",
-      "from": "got@>=5.0.0 <6.0.0",
       "resolved": "https://registry.npmjs.org/got/-/got-5.7.1.tgz",
+      "integrity": "sha1-X4FjWmHkplifGAVp6k44FoClHzU=",
       "dependencies": {
         "duplexer2": {
           "version": "0.1.4",
-          "from": "duplexer2@>=0.1.4 <0.2.0",
-          "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.1.4.tgz"
+          "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.1.4.tgz",
+          "integrity": "sha1-ixLauHjA1p4+eJEFFmKjL8a93ME="
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "graceful-fs": {
       "version": "4.1.11",
-      "from": "graceful-fs@>=4.1.2 <5.0.0",
-      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz"
+      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz",
+      "integrity": "sha1-Dovf5NHduIVNZOBOp8AOKgJuVlg="
     },
     "graceful-readlink": {
       "version": "1.0.1",
-      "from": "graceful-readlink@>=1.0.0",
-      "resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz",
+      "integrity": "sha1-TK+tdrxi8C+gObL5Tpo906ORpyU="
     },
     "growl": {
       "version": "1.9.2",
-      "from": "growl@1.9.2",
-      "resolved": "https://registry.npmjs.org/growl/-/growl-1.9.2.tgz"
+      "resolved": "https://registry.npmjs.org/growl/-/growl-1.9.2.tgz",
+      "integrity": "sha1-Dqd0NxXbjY3ixe3hd14bRayFwC8="
     },
     "growly": {
       "version": "1.3.0",
-      "from": "growly@>=1.3.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz",
+      "integrity": "sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE="
     },
     "gulp": {
       "version": "3.9.1",
-      "from": "gulp@>=3.9.1 <3.10.0",
       "resolved": "https://registry.npmjs.org/gulp/-/gulp-3.9.1.tgz",
+      "integrity": "sha1-VxzkWSjdQK9lFPxAEYZgFsE4RbQ=",
       "dependencies": {
         "semver": {
           "version": "4.3.6",
-          "from": "semver@>=4.1.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz"
+          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz",
+          "integrity": "sha1-MAvG4OhjdPe6YQaLWx7NV/xlMto="
         }
       }
     },
     "gulp-cache": {
       "version": "0.4.6",
-      "from": "gulp-cache@>=0.4.5 <0.5.0",
       "resolved": "https://registry.npmjs.org/gulp-cache/-/gulp-cache-0.4.6.tgz",
+      "integrity": "sha1-LQO1LbT2pVOuHVvvAeSD6Qfp95Y=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.4 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         },
         "vinyl": {
           "version": "1.2.0",
-          "from": "vinyl@>=1.1.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz",
+          "integrity": "sha1-XIgDbPVl5d8FVYv8kR+GVt8hiIQ="
         }
       }
     },
     "gulp-changed": {
       "version": "1.3.2",
-      "from": "gulp-changed@>=1.3.2 <1.4.0",
-      "resolved": "https://registry.npmjs.org/gulp-changed/-/gulp-changed-1.3.2.tgz"
+      "resolved": "https://registry.npmjs.org/gulp-changed/-/gulp-changed-1.3.2.tgz",
+      "integrity": "sha1-nvyNMl+YBcx2aP3059YNSxQQ8s8="
     },
     "gulp-clean-css": {
       "version": "2.0.13",
-      "from": "gulp-clean-css@>=2.0.11 <2.1.0",
       "resolved": "https://registry.npmjs.org/gulp-clean-css/-/gulp-clean-css-2.0.13.tgz",
+      "integrity": "sha1-hd70qqKvbwbBZG4FER/XtLXmJ9A=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.1.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "gulp-clip-empty-files": {
       "version": "0.1.2",
-      "from": "gulp-clip-empty-files@>=0.1.2 <0.2.0",
-      "resolved": "https://registry.npmjs.org/gulp-clip-empty-files/-/gulp-clip-empty-files-0.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/gulp-clip-empty-files/-/gulp-clip-empty-files-0.1.2.tgz",
+      "integrity": "sha1-vumATiU7vaVc+8Em6NuuZDPtzMg="
     },
     "gulp-clone": {
       "version": "1.0.0",
-      "from": "gulp-clone@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/gulp-clone/-/gulp-clone-1.0.0.tgz",
+      "integrity": "sha1-mubGVr2cTzae6AXu9WV4a8gQBbA=",
       "dependencies": {
         "ansi-regex": {
           "version": "0.2.1",
-          "from": "ansi-regex@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-0.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-0.2.1.tgz",
+          "integrity": "sha1-DY6UaWej2BQ/k+JOKYUl/BsiNfk="
         },
         "ansi-styles": {
           "version": "1.1.0",
-          "from": "ansi-styles@>=1.1.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-1.1.0.tgz",
+          "integrity": "sha1-6uy/Zs1waIJ2Cy9GkVgrj1XXp94="
         },
         "chalk": {
           "version": "0.5.1",
-          "from": "chalk@>=0.5.0 <0.6.0",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-0.5.1.tgz"
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-0.5.1.tgz",
+          "integrity": "sha1-Zjs6ZItotV0EaQ1JFnqoN4WPIXQ="
         },
         "dateformat": {
           "version": "1.0.12",
-          "from": "dateformat@>=1.0.7-1.2.3 <2.0.0",
-          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz"
+          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
+          "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk="
         },
         "gulp-util": {
           "version": "2.2.20",
-          "from": "gulp-util@>=2.2.14 <2.3.0",
           "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-2.2.20.tgz",
+          "integrity": "sha1-1xRuVyiRC9jwR6awseVJvCLb1kw=",
           "dependencies": {
             "through2": {
               "version": "0.5.1",
-              "from": "through2@>=0.5.0 <0.6.0",
-              "resolved": "https://registry.npmjs.org/through2/-/through2-0.5.1.tgz"
+              "resolved": "https://registry.npmjs.org/through2/-/through2-0.5.1.tgz",
+              "integrity": "sha1-390BLrnHAOIyP9M084rGIqs3Lac="
             }
           }
         },
         "has-ansi": {
           "version": "0.1.0",
-          "from": "has-ansi@>=0.1.0 <0.2.0",
-          "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-0.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-0.1.0.tgz",
+          "integrity": "sha1-hPJlqujA5qiKEtcCKJS3VoiUxi4="
         },
         "lodash._reinterpolate": {
           "version": "2.4.1",
-          "from": "lodash._reinterpolate@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-2.4.1.tgz",
+          "integrity": "sha1-TxInqlqHEfxjL1sHofRgequLMiI="
         },
         "lodash.escape": {
           "version": "2.4.1",
-          "from": "lodash.escape@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-2.4.1.tgz",
+          "integrity": "sha1-LOEsXghNsKV92l5dHu659dF1o7Q="
         },
         "lodash.keys": {
           "version": "2.4.1",
-          "from": "lodash.keys@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz",
+          "integrity": "sha1-SN6kbfj/djKxDXBrissmWR4rNyc="
         },
         "lodash.template": {
           "version": "2.4.1",
-          "from": "lodash.template@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-2.4.1.tgz",
+          "integrity": "sha1-nmEQB+32KRKal0qzxIuBez4c8g0="
         },
         "lodash.templatesettings": {
           "version": "2.4.1",
-          "from": "lodash.templatesettings@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-2.4.1.tgz",
+          "integrity": "sha1-6nbHXRHrhtTb6JqDiTu4YZKaxpk="
         },
         "minimist": {
           "version": "0.2.0",
-          "from": "minimist@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.0.tgz",
+          "integrity": "sha1-Tf/lJdriuGTGbC4jxicdev3s784="
         },
         "readable-stream": {
           "version": "1.0.34",
-          "from": "readable-stream@>=1.0.17 <1.1.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
         },
         "strip-ansi": {
           "version": "0.3.0",
-          "from": "strip-ansi@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-0.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-0.3.0.tgz",
+          "integrity": "sha1-JfSOoiynkYfzF0pNuHWTR7sSYiA="
         },
         "supports-color": {
           "version": "0.2.0",
-          "from": "supports-color@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-0.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-0.2.0.tgz",
+          "integrity": "sha1-2S3iaU6z9nMjlz1649i1W0wiGQo="
         },
         "through2": {
           "version": "0.4.2",
-          "from": "through2@>=0.4.1 <0.5.0",
           "resolved": "https://registry.npmjs.org/through2/-/through2-0.4.2.tgz",
+          "integrity": "sha1-2/WGYDEVHsg1K7bE22SiKSqEC5s=",
           "dependencies": {
             "xtend": {
               "version": "2.1.2",
-              "from": "xtend@>=2.1.1 <2.2.0",
-              "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz"
+              "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz",
+              "integrity": "sha1-bv7MKk2tjmlixJAbM3znuoe10os="
             }
           }
         },
         "vinyl": {
           "version": "0.2.3",
-          "from": "vinyl@>=0.2.1 <0.3.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.2.3.tgz",
+          "integrity": "sha1-vKk4IJWC7FpJrVOKAPofEl5RMlI="
         },
         "xtend": {
           "version": "3.0.0",
-          "from": "xtend@>=3.0.0 <3.1.0",
-          "resolved": "https://registry.npmjs.org/xtend/-/xtend-3.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/xtend/-/xtend-3.0.0.tgz",
+          "integrity": "sha1-XM50B7r2Qsunvs2laBEcST9ZZlo="
         }
       }
     },
     "gulp-connect": {
       "version": "5.0.0",
-      "from": "gulp-connect@>=5.0.0 <5.1.0",
       "resolved": "https://registry.npmjs.org/gulp-connect/-/gulp-connect-5.0.0.tgz",
+      "integrity": "sha1-8v3zBq6RFGg2jCKF8teC8T7dr04=",
       "dependencies": {
         "body-parser": {
           "version": "1.13.3",
-          "from": "body-parser@>=1.13.3 <1.14.0",
-          "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.13.3.tgz"
+          "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.13.3.tgz",
+          "integrity": "sha1-wIzzMMM1jhUQFqBXRvE/ApyX+pc="
         },
         "bytes": {
           "version": "2.1.0",
-          "from": "bytes@2.1.0",
-          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.1.0.tgz",
+          "integrity": "sha1-rJPEEOL/ycx89LRks4KJBn9eR7Q="
         },
         "connect": {
           "version": "2.30.2",
-          "from": "connect@>=2.30.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/connect/-/connect-2.30.2.tgz"
+          "resolved": "https://registry.npmjs.org/connect/-/connect-2.30.2.tgz",
+          "integrity": "sha1-jam8vooFTT0xjXTf7JA7XDmhtgk="
         },
         "cookie": {
           "version": "0.1.3",
-          "from": "cookie@0.1.3",
-          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz"
+          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz",
+          "integrity": "sha1-5zSlwUF/zkctWu+Cw4HKu2TRpDU="
         },
         "debug": {
           "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "depd": {
           "version": "1.0.1",
-          "from": "depd@>=1.0.1 <1.1.0",
-          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz",
+          "integrity": "sha1-gK7GTJ1tl+ZcwqnKqTwKpqv3Oqo="
         },
         "escape-html": {
           "version": "1.0.2",
-          "from": "escape-html@1.0.2",
-          "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.2.tgz",
+          "integrity": "sha1-130y+pjjjC9BroXpJ44ODmuhAiw="
         },
         "event-stream": {
           "version": "3.3.4",
-          "from": "event-stream@>=3.3.2 <4.0.0",
-          "resolved": "https://registry.npmjs.org/event-stream/-/event-stream-3.3.4.tgz"
+          "resolved": "https://registry.npmjs.org/event-stream/-/event-stream-3.3.4.tgz",
+          "integrity": "sha1-SrTJoPWlTbkzi0w02Gv86PSzVXE="
         },
         "finalhandler": {
           "version": "0.4.0",
-          "from": "finalhandler@0.4.0",
-          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.4.0.tgz"
+          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.4.0.tgz",
+          "integrity": "sha1-llpS2ejQXSuFdUhUH7ibU6JJfZs="
         },
         "http-errors": {
           "version": "1.3.1",
-          "from": "http-errors@>=1.3.1 <1.4.0",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
+          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
         },
         "iconv-lite": {
           "version": "0.4.11",
-          "from": "iconv-lite@0.4.11",
-          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.11.tgz"
+          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.11.tgz",
+          "integrity": "sha1-LstC/SlHRJIiCaLnxATayHk9it4="
         },
         "map-stream": {
           "version": "0.1.0",
-          "from": "map-stream@>=0.1.0 <0.2.0",
-          "resolved": "https://registry.npmjs.org/map-stream/-/map-stream-0.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/map-stream/-/map-stream-0.1.0.tgz",
+          "integrity": "sha1-5WqpTEyAVaFkBKBnS3jyFffI4ZQ="
         },
         "mime": {
           "version": "1.3.4",
-          "from": "mime@1.3.4",
-          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz"
+          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz",
+          "integrity": "sha1-EV+eO2s9rylZmDyzjxSaLUDrXVM="
         },
         "ms": {
           "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         },
         "qs": {
           "version": "4.0.0",
-          "from": "qs@4.0.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-4.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/qs/-/qs-4.0.0.tgz",
+          "integrity": "sha1-wx2bdOwn33XlQ6hseHKO2NRiNgc="
         },
         "range-parser": {
           "version": "1.0.3",
-          "from": "range-parser@>=1.0.3 <1.1.0",
-          "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.0.3.tgz"
+          "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.0.3.tgz",
+          "integrity": "sha1-aHKCNTXGkuLCoBA4Jq/YLC4P8XU="
         },
         "raw-body": {
           "version": "2.1.7",
-          "from": "raw-body@>=2.1.2 <2.2.0",
           "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.1.7.tgz",
+          "integrity": "sha1-rf6s4uT7MJgFgBTQjActzFl1h3Q=",
           "dependencies": {
             "bytes": {
               "version": "2.4.0",
-              "from": "bytes@2.4.0",
-              "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz"
+              "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz",
+              "integrity": "sha1-fZcZb51br39pNeJZhVSe3SpsIzk="
             },
             "iconv-lite": {
               "version": "0.4.13",
-              "from": "iconv-lite@0.4.13",
-              "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.13.tgz"
+              "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.13.tgz",
+              "integrity": "sha1-H4irpKsLFQjoMSrMOTRfNumS4vI="
             }
           }
         },
         "send": {
           "version": "0.13.2",
-          "from": "send@0.13.2",
           "resolved": "https://registry.npmjs.org/send/-/send-0.13.2.tgz",
+          "integrity": "sha1-dl52B8gFVFK7pvCwUllTUJhgNt4=",
           "dependencies": {
             "depd": {
               "version": "1.1.0",
-              "from": "depd@~1.1.0",
-              "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.0.tgz"
+              "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.0.tgz",
+              "integrity": "sha1-4b2Cxqq2ztlluXuIsX7T5SjKGMM="
             },
             "escape-html": {
               "version": "1.0.3",
-              "from": "escape-html@~1.0.3",
-              "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz"
+              "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
+              "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg="
             },
             "statuses": {
               "version": "1.2.1",
-              "from": "statuses@>=1.2.1 <1.3.0",
-              "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.2.1.tgz"
+              "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.2.1.tgz",
+              "integrity": "sha1-3e1FzBglbVHtQK7BQkidXGECbSg="
             }
           }
         },
         "serve-static": {
           "version": "1.10.3",
-          "from": "serve-static@>=1.10.0 <1.11.0",
           "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.10.3.tgz",
+          "integrity": "sha1-zlpuzTEB/tXsCYJ9rCKpwpv7BTU=",
           "dependencies": {
             "escape-html": {
               "version": "1.0.3",
-              "from": "escape-html@~1.0.3",
-              "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz"
+              "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
+              "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg="
             }
           }
         },
         "split": {
           "version": "0.3.3",
-          "from": "split@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/split/-/split-0.3.3.tgz"
+          "resolved": "https://registry.npmjs.org/split/-/split-0.3.3.tgz",
+          "integrity": "sha1-zQ7qXmOiEd//frDwkcQTPi0N0o8="
         }
       }
     },
     "gulp-debug": {
       "version": "3.1.0",
-      "from": "gulp-debug@3.1.0",
-      "resolved": "https://registry.npmjs.org/gulp-debug/-/gulp-debug-3.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/gulp-debug/-/gulp-debug-3.1.0.tgz",
+      "integrity": "sha1-TakVaLVJFb6ANpbKqsEMiVssCnE="
     },
     "gulp-decomment": {
       "version": "0.1.3",
-      "from": "gulp-decomment@>=0.1.3 <0.2.0",
-      "resolved": "https://registry.npmjs.org/gulp-decomment/-/gulp-decomment-0.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/gulp-decomment/-/gulp-decomment-0.1.3.tgz",
+      "integrity": "sha1-q6CMjhbzh3bQhtNuMV8ZpbGjFjU="
     },
     "gulp-flatten": {
       "version": "0.2.0",
-      "from": "gulp-flatten@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/gulp-flatten/-/gulp-flatten-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/gulp-flatten/-/gulp-flatten-0.2.0.tgz",
+      "integrity": "sha1-iS1RfjjXkA/UVM+aHgIQMA6S6wY="
     },
     "gulp-if": {
       "version": "2.0.2",
-      "from": "gulp-if@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/gulp-if/-/gulp-if-2.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/gulp-if/-/gulp-if-2.0.2.tgz",
+      "integrity": "sha1-pJe351cwBQQcqivIt92jyARE1ik="
     },
     "gulp-karma": {
       "version": "0.0.5",
-      "from": "gulp-karma@>=0.0.5 <0.1.0",
       "resolved": "https://registry.npmjs.org/gulp-karma/-/gulp-karma-0.0.5.tgz",
+      "integrity": "sha1-RLoZejEFTlyXOlujOUITwUKAOVg=",
       "dependencies": {
         "ansi-regex": {
           "version": "0.2.1",
-          "from": "ansi-regex@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-0.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-0.2.1.tgz",
+          "integrity": "sha1-DY6UaWej2BQ/k+JOKYUl/BsiNfk="
         },
         "ansi-styles": {
           "version": "1.1.0",
-          "from": "ansi-styles@>=1.1.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-1.1.0.tgz",
+          "integrity": "sha1-6uy/Zs1waIJ2Cy9GkVgrj1XXp94="
         },
         "chalk": {
           "version": "0.5.1",
-          "from": "chalk@>=0.5.0 <0.6.0",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-0.5.1.tgz"
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-0.5.1.tgz",
+          "integrity": "sha1-Zjs6ZItotV0EaQ1JFnqoN4WPIXQ="
         },
         "dateformat": {
           "version": "1.0.12",
-          "from": "dateformat@>=1.0.7-1.2.3 <2.0.0",
-          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz"
+          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
+          "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk="
         },
         "gulp-util": {
           "version": "2.2.20",
-          "from": "gulp-util@>=2.2.14 <2.3.0",
-          "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-2.2.20.tgz"
+          "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-2.2.20.tgz",
+          "integrity": "sha1-1xRuVyiRC9jwR6awseVJvCLb1kw="
         },
         "has-ansi": {
           "version": "0.1.0",
-          "from": "has-ansi@>=0.1.0 <0.2.0",
-          "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-0.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-0.1.0.tgz",
+          "integrity": "sha1-hPJlqujA5qiKEtcCKJS3VoiUxi4="
         },
         "lodash._reinterpolate": {
           "version": "2.4.1",
-          "from": "lodash._reinterpolate@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-2.4.1.tgz",
+          "integrity": "sha1-TxInqlqHEfxjL1sHofRgequLMiI="
         },
         "lodash.escape": {
           "version": "2.4.1",
-          "from": "lodash.escape@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-2.4.1.tgz",
+          "integrity": "sha1-LOEsXghNsKV92l5dHu659dF1o7Q="
         },
         "lodash.keys": {
           "version": "2.4.1",
-          "from": "lodash.keys@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz",
+          "integrity": "sha1-SN6kbfj/djKxDXBrissmWR4rNyc="
         },
         "lodash.template": {
           "version": "2.4.1",
-          "from": "lodash.template@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-2.4.1.tgz",
+          "integrity": "sha1-nmEQB+32KRKal0qzxIuBez4c8g0="
         },
         "lodash.templatesettings": {
           "version": "2.4.1",
-          "from": "lodash.templatesettings@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-2.4.1.tgz",
+          "integrity": "sha1-6nbHXRHrhtTb6JqDiTu4YZKaxpk="
         },
         "minimist": {
           "version": "0.2.0",
-          "from": "minimist@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.0.tgz",
+          "integrity": "sha1-Tf/lJdriuGTGbC4jxicdev3s784="
         },
         "readable-stream": {
           "version": "1.0.34",
-          "from": "readable-stream@>=1.0.17 <1.1.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
         },
         "strip-ansi": {
           "version": "0.3.0",
-          "from": "strip-ansi@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-0.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-0.3.0.tgz",
+          "integrity": "sha1-JfSOoiynkYfzF0pNuHWTR7sSYiA="
         },
         "supports-color": {
           "version": "0.2.0",
-          "from": "supports-color@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-0.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-0.2.0.tgz",
+          "integrity": "sha1-2S3iaU6z9nMjlz1649i1W0wiGQo="
         },
         "through2": {
           "version": "0.5.1",
-          "from": "through2@>=0.5.0 <0.6.0",
           "resolved": "https://registry.npmjs.org/through2/-/through2-0.5.1.tgz",
+          "integrity": "sha1-390BLrnHAOIyP9M084rGIqs3Lac=",
           "dependencies": {
             "xtend": {
               "version": "3.0.0",
-              "from": "xtend@>=3.0.0 <3.1.0",
-              "resolved": "https://registry.npmjs.org/xtend/-/xtend-3.0.0.tgz"
+              "resolved": "https://registry.npmjs.org/xtend/-/xtend-3.0.0.tgz",
+              "integrity": "sha1-XM50B7r2Qsunvs2laBEcST9ZZlo="
             }
           }
         },
         "vinyl": {
           "version": "0.2.3",
-          "from": "vinyl@>=0.2.1 <0.3.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.2.3.tgz",
+          "integrity": "sha1-vKk4IJWC7FpJrVOKAPofEl5RMlI="
         },
         "xtend": {
           "version": "2.1.2",
-          "from": "xtend@>=2.1.1 <2.2.0",
-          "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz"
+          "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz",
+          "integrity": "sha1-bv7MKk2tjmlixJAbM3znuoe10os="
         }
       }
     },
     "gulp-match": {
       "version": "1.0.3",
-      "from": "gulp-match@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/gulp-match/-/gulp-match-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/gulp-match/-/gulp-match-1.0.3.tgz",
+      "integrity": "sha1-kcfA1/Kb7NZgbVfYCn+Hdqh6uo4="
     },
     "gulp-open": {
       "version": "2.0.0",
-      "from": "gulp-open@>=2.0.0 <2.1.0",
-      "resolved": "https://registry.npmjs.org/gulp-open/-/gulp-open-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/gulp-open/-/gulp-open-2.0.0.tgz",
+      "integrity": "sha1-oW9n6VzqiyBhtjo7jDibxVm44c4="
     },
     "gulp-phantomcss": {
       "version": "0.3.0",
-      "from": "gulp-phantomcss@>=0.3.0 <0.4.0",
       "resolved": "https://registry.npmjs.org/gulp-phantomcss/-/gulp-phantomcss-0.3.0.tgz",
+      "integrity": "sha1-Hu0Vyz5BQw0AH5qUVg+/1Pihd1k=",
       "dependencies": {
         "async": {
           "version": "2.4.1",
-          "from": "async@>=2.0.1 <3.0.0",
           "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
+          "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c=",
           "dependencies": {
             "lodash": {
               "version": "4.17.4",
-              "from": "lodash@>=4.14.0 <5.0.0",
-              "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz"
+              "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+              "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
             }
           }
         },
         "caseless": {
           "version": "0.11.0",
-          "from": "caseless@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz"
+          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz",
+          "integrity": "sha1-cVuW6phBWTzDMGeSP17GDr2k99c="
         },
         "dateformat": {
           "version": "1.0.12",
-          "from": "dateformat@>=1.0.11 <2.0.0",
-          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz"
+          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
+          "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk="
         },
         "form-data": {
           "version": "1.0.1",
-          "from": "form-data@>=1.0.0-rc3 <1.1.0",
-          "resolved": "https://registry.npmjs.org/form-data/-/form-data-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/form-data/-/form-data-1.0.1.tgz",
+          "integrity": "sha1-rjFduaSQf6BlUCMEpm13M0de43w="
         },
         "gulp-util": {
           "version": "3.0.7",
-          "from": "gulp-util@3.0.7",
-          "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.7.tgz"
+          "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.7.tgz",
+          "integrity": "sha1-eJJcS4+LSQBawBoBHFV+YhiUHLs="
         },
         "har-validator": {
           "version": "2.0.6",
-          "from": "har-validator@>=2.0.2 <2.1.0",
-          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz"
+          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz",
+          "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0="
         },
         "lodash": {
           "version": "3.10.1",
-          "from": "lodash@3.10.1",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
+          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
         },
         "node-uuid": {
           "version": "1.4.8",
-          "from": "node-uuid@~1.4.7",
-          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz"
+          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz",
+          "integrity": "sha1-sEDrCSOWivq/jTL7HxfxFn/auQc="
         },
         "object-assign": {
           "version": "3.0.0",
-          "from": "object-assign@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz",
+          "integrity": "sha1-m+3VygiXlJvKR+f/QIBi1Un1h/I="
         },
         "phantomjs-prebuilt": {
           "version": "2.1.7",
-          "from": "phantomjs-prebuilt@2.1.7",
-          "resolved": "https://registry.npmjs.org/phantomjs-prebuilt/-/phantomjs-prebuilt-2.1.7.tgz"
+          "resolved": "https://registry.npmjs.org/phantomjs-prebuilt/-/phantomjs-prebuilt-2.1.7.tgz",
+          "integrity": "sha1-yQvxuXcvoZeZQzH88/ZwmaloU8o="
         },
         "qs": {
           "version": "5.2.1",
-          "from": "qs@>=5.2.0 <5.3.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-5.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/qs/-/qs-5.2.1.tgz",
+          "integrity": "sha1-gB/uAw4LlFDWOFrcSKTMVbRK7fw="
         },
         "request": {
           "version": "2.67.0",
-          "from": "request@>=2.67.0 <2.68.0",
-          "resolved": "https://registry.npmjs.org/request/-/request-2.67.0.tgz"
+          "resolved": "https://registry.npmjs.org/request/-/request-2.67.0.tgz",
+          "integrity": "sha1-ivdHgOK/EeoK6aqWXBHxGv0nJ0I="
         },
         "tough-cookie": {
           "version": "2.2.2",
-          "from": "tough-cookie@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.2.2.tgz"
+          "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.2.2.tgz",
+          "integrity": "sha1-yDoYMPTl7wuT7yo0iOck+N4Basc="
         },
         "tunnel-agent": {
           "version": "0.4.3",
-          "from": "tunnel-agent@>=0.4.1 <0.5.0",
-          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz"
+          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz",
+          "integrity": "sha1-Y3PbdpCf5XDgjXNYM2Xtgop07us="
         }
       }
     },
     "gulp-plumber": {
       "version": "1.1.0",
-      "from": "gulp-plumber@>=1.1.0 <1.2.0",
-      "resolved": "https://registry.npmjs.org/gulp-plumber/-/gulp-plumber-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/gulp-plumber/-/gulp-plumber-1.1.0.tgz",
+      "integrity": "sha1-8SF2wtBCL2AwbCQv/2oBo5T6ugk="
     },
     "gulp-postcss": {
       "version": "6.1.1",
-      "from": "gulp-postcss@>=6.1.1 <6.2.0",
-      "resolved": "https://registry.npmjs.org/gulp-postcss/-/gulp-postcss-6.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/gulp-postcss/-/gulp-postcss-6.1.1.tgz",
+      "integrity": "sha1-h01E6f9srd3VfOPJVSAuVy0mkBU="
     },
     "gulp-prompt": {
       "version": "0.2.0",
-      "from": "gulp-prompt@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/gulp-prompt/-/gulp-prompt-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/gulp-prompt/-/gulp-prompt-0.2.0.tgz",
+      "integrity": "sha1-l2DJC72H6AAigzDrrHTWWcwt23g="
     },
     "gulp-replace": {
       "version": "0.5.4",
-      "from": "gulp-replace@>=0.5.4 <0.6.0",
       "resolved": "https://registry.npmjs.org/gulp-replace/-/gulp-replace-0.5.4.tgz",
+      "integrity": "sha1-aaZ5FLvRPFYr/xT1BKQDeWqg2qk=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "gulp-sass": {
       "version": "2.3.2",
-      "from": "gulp-sass@>=2.3.2 <2.4.0",
       "resolved": "https://registry.npmjs.org/gulp-sass/-/gulp-sass-2.3.2.tgz",
+      "integrity": "sha1-grerkP6QLNw0wE8YDZLyw0kC3VI=",
       "dependencies": {
         "gaze": {
           "version": "1.1.2",
-          "from": "gaze@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz"
+          "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz",
+          "integrity": "sha1-hHIkZ3rbiHDWeSV+0ziP22HkAQU="
         },
         "globule": {
           "version": "1.1.0",
-          "from": "globule@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/globule/-/globule-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/globule/-/globule-1.1.0.tgz",
+          "integrity": "sha1-xJNS5NwYPYWJPuglOF65lLtt9F8="
         },
         "lodash": {
           "version": "4.16.6",
-          "from": "lodash@>=4.16.4 <4.17.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.16.6.tgz"
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.16.6.tgz",
+          "integrity": "sha1-0iyaxmAojzhD4Wun0rXQbMon13c="
         },
         "node-sass": {
           "version": "3.13.1",
-          "from": "node-sass@>=3.4.2 <4.0.0",
-          "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-3.13.1.tgz"
+          "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-3.13.1.tgz",
+          "integrity": "sha1-ckD7v/I5YwS0IjUn7TAgWJwAT8I="
         }
       }
     },
     "gulp-sourcemaps": {
       "version": "1.6.0",
-      "from": "gulp-sourcemaps@>=1.6.0 <1.7.0",
       "resolved": "https://registry.npmjs.org/gulp-sourcemaps/-/gulp-sourcemaps-1.6.0.tgz",
+      "integrity": "sha1-uG/zSdgBzrVuHZ59x7vLS33uYAw=",
       "dependencies": {
         "strip-bom": {
           "version": "2.0.0",
-          "from": "strip-bom@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
         },
         "vinyl": {
           "version": "1.2.0",
-          "from": "vinyl@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz",
+          "integrity": "sha1-XIgDbPVl5d8FVYv8kR+GVt8hiIQ="
         }
       }
     },
     "gulp-texttojs": {
       "version": "1.0.3",
-      "from": "gulp-texttojs@>=1.0.3 <1.1.0",
       "resolved": "https://registry.npmjs.org/gulp-texttojs/-/gulp-texttojs-1.0.3.tgz",
+      "integrity": "sha1-SIWgEDXrQfNiPEzADP21Ci+tl3Q=",
       "dependencies": {
         "lodash": {
           "version": "2.4.2",
-          "from": "lodash@>=2.4.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-2.4.2.tgz"
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-2.4.2.tgz",
+          "integrity": "sha1-+t2DS5aDBz2hebPq5tnA0VBT9z4="
         },
         "readable-stream": {
           "version": "1.0.34",
-          "from": "readable-stream@>=1.0.17 <1.1.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
         },
         "through2": {
           "version": "0.4.2",
-          "from": "through2@>=0.4.2 <0.5.0",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.4.2.tgz"
+          "resolved": "https://registry.npmjs.org/through2/-/through2-0.4.2.tgz",
+          "integrity": "sha1-2/WGYDEVHsg1K7bE22SiKSqEC5s="
         },
         "xtend": {
           "version": "2.1.2",
-          "from": "xtend@>=2.1.1 <2.2.0",
-          "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz"
+          "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz",
+          "integrity": "sha1-bv7MKk2tjmlixJAbM3znuoe10os="
         }
       }
     },
     "gulp-typescript": {
       "version": "3.1.7",
-      "from": "gulp-typescript@>=3.1.3 <3.2.0",
       "resolved": "https://registry.npmjs.org/gulp-typescript/-/gulp-typescript-3.1.7.tgz",
+      "integrity": "sha1-2IYAqRQVPxHAnJpcqMJWHsdaSXg=",
       "dependencies": {
         "glob": {
           "version": "5.0.15",
-          "from": "glob@>=5.0.3 <6.0.0",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
+          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
+          "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
         },
         "glob-parent": {
           "version": "3.1.0",
-          "from": "glob-parent@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-3.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-3.1.0.tgz",
+          "integrity": "sha1-nmr2KZ2NO9K9QEMIMr0RPfkGxa4="
         },
         "glob-stream": {
           "version": "5.3.5",
-          "from": "glob-stream@>=5.3.2 <6.0.0",
           "resolved": "https://registry.npmjs.org/glob-stream/-/glob-stream-5.3.5.tgz",
+          "integrity": "sha1-pVZlqajM3EGRWofHAeMtTgFvrSI=",
           "dependencies": {
             "isarray": {
               "version": "0.0.1",
-              "from": "isarray@0.0.1",
-              "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
+              "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+              "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
             },
             "readable-stream": {
               "version": "1.0.34",
-              "from": "readable-stream@>=1.0.33-1 <1.1.0-0",
-              "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
+              "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+              "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
             },
             "string_decoder": {
               "version": "0.10.31",
-              "from": "string_decoder@~0.10.x",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+              "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
             },
             "through2": {
               "version": "0.6.5",
-              "from": "through2@>=0.6.0 <0.7.0",
-              "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz"
+              "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
+              "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg="
             }
           }
         },
         "is-extglob": {
           "version": "2.1.1",
-          "from": "is-extglob@>=2.1.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz"
+          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
+          "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI="
         },
         "is-glob": {
           "version": "3.1.0",
-          "from": "is-glob@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz",
+          "integrity": "sha1-e6WuJCF4BKxwcHuWkiVnSGzD6Eo="
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "ordered-read-streams": {
           "version": "0.3.0",
-          "from": "ordered-read-streams@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.3.0.tgz",
+          "integrity": "sha1-cTfmmzKYuzQiR6G77jiByA4v14s="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.4 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         },
         "strip-bom": {
           "version": "2.0.0",
-          "from": "strip-bom@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
         },
         "unique-stream": {
           "version": "2.2.1",
-          "from": "unique-stream@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-2.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-2.2.1.tgz",
+          "integrity": "sha1-WqADz76Uxf+GbE59ZouxxNuts2k="
         },
         "vinyl": {
           "version": "1.2.0",
-          "from": "vinyl@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz",
+          "integrity": "sha1-XIgDbPVl5d8FVYv8kR+GVt8hiIQ="
         },
         "vinyl-fs": {
           "version": "2.4.4",
-          "from": "vinyl-fs@>=2.4.3 <2.5.0",
-          "resolved": "https://registry.npmjs.org/vinyl-fs/-/vinyl-fs-2.4.4.tgz"
+          "resolved": "https://registry.npmjs.org/vinyl-fs/-/vinyl-fs-2.4.4.tgz",
+          "integrity": "sha1-vm/zJwy1Xf19MGNkDegfJddTIjk="
         }
       }
     },
     "gulp-util": {
       "version": "3.0.8",
-      "from": "gulp-util@3.0.8",
       "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.8.tgz",
+      "integrity": "sha1-AFTh50RQLifATBh8PsxQXdVLu08=",
       "dependencies": {
         "object-assign": {
           "version": "3.0.0",
-          "from": "object-assign@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz",
+          "integrity": "sha1-m+3VygiXlJvKR+f/QIBi1Un1h/I="
         }
       }
     },
     "gulplog": {
       "version": "1.0.0",
-      "from": "gulplog@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/gulplog/-/gulplog-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/gulplog/-/gulplog-1.0.0.tgz",
+      "integrity": "sha1-4oxNRdBey77YGDY86PnFkmIp/+U="
     },
     "gutil": {
       "version": "1.6.4",
-      "from": "gutil@1.6.4",
-      "resolved": "https://registry.npmjs.org/gutil/-/gutil-1.6.4.tgz"
+      "resolved": "https://registry.npmjs.org/gutil/-/gutil-1.6.4.tgz",
+      "integrity": "sha1-d8+fqgWMBHbWO506xfvgTgcvbNI="
     },
     "gzip-size": {
       "version": "3.0.0",
-      "from": "gzip-size@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-3.0.0.tgz",
+      "integrity": "sha1-VGGI6b3DN/Zzdy+BZgRks4nc5SA="
     },
     "handle-thing": {
       "version": "1.2.5",
-      "from": "handle-thing@>=1.2.5 <2.0.0",
-      "resolved": "https://registry.npmjs.org/handle-thing/-/handle-thing-1.2.5.tgz"
+      "resolved": "https://registry.npmjs.org/handle-thing/-/handle-thing-1.2.5.tgz",
+      "integrity": "sha1-/Xqtcmvxpf0W38KbL3pmAdJxOcQ="
     },
     "handlebars": {
       "version": "4.0.10",
-      "from": "handlebars@>=4.0.1 <5.0.0",
       "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.0.10.tgz",
+      "integrity": "sha1-PTDHGLCaPZbyPqTMH0A8TTup/08=",
       "dependencies": {
         "source-map": {
           "version": "0.4.4",
-          "from": "source-map@>=0.4.4 <0.5.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz"
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
+          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s="
         }
       }
     },
     "har-schema": {
       "version": "1.0.5",
-      "from": "har-schema@>=1.0.5 <2.0.0",
-      "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-1.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-1.0.5.tgz",
+      "integrity": "sha1-0mMTX0MwfALGAq/I/pWXDAFRNp4="
     },
     "har-validator": {
       "version": "4.2.1",
-      "from": "har-validator@>=4.2.1 <4.3.0",
-      "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz",
+      "integrity": "sha1-M0gdDxu/9gDdID11gSpqX7oALio="
     },
     "has": {
       "version": "1.0.1",
-      "from": "has@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/has/-/has-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/has/-/has-1.0.1.tgz",
+      "integrity": "sha1-hGFzP1OLCDfJNh45qauelwTcLyg="
     },
     "has-ansi": {
       "version": "2.0.0",
-      "from": "has-ansi@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz",
+      "integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE="
     },
     "has-binary": {
       "version": "0.1.7",
-      "from": "has-binary@0.1.7",
-      "resolved": "https://registry.npmjs.org/has-binary/-/has-binary-0.1.7.tgz"
+      "resolved": "https://registry.npmjs.org/has-binary/-/has-binary-0.1.7.tgz",
+      "integrity": "sha1-aOYesWIQyVRaClzOBqhzkS/h5ow="
     },
     "has-cors": {
       "version": "1.1.0",
-      "from": "has-cors@1.1.0",
-      "resolved": "https://registry.npmjs.org/has-cors/-/has-cors-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/has-cors/-/has-cors-1.1.0.tgz",
+      "integrity": "sha1-XkdHk/fqmEPRu5nCPu9J/xJv/zk="
     },
     "has-flag": {
       "version": "1.0.0",
-      "from": "has-flag@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+      "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
     },
     "has-gulplog": {
       "version": "0.1.0",
-      "from": "has-gulplog@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/has-gulplog/-/has-gulplog-0.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/has-gulplog/-/has-gulplog-0.1.0.tgz",
+      "integrity": "sha1-ZBTIKRNpfaUVkDl9r7EvIpZ4Ec4="
     },
     "has-unicode": {
       "version": "2.0.1",
-      "from": "has-unicode@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz",
+      "integrity": "sha1-4Ob+aijPUROIVeCG0Wkedx3iqLk="
     },
     "hash-base": {
       "version": "2.0.2",
-      "from": "hash-base@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/hash-base/-/hash-base-2.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/hash-base/-/hash-base-2.0.2.tgz",
+      "integrity": "sha1-ZuodhW206KVHDK32/OI65SRO8uE="
     },
     "hash.js": {
       "version": "1.0.3",
-      "from": "hash.js@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/hash.js/-/hash.js-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/hash.js/-/hash.js-1.0.3.tgz",
+      "integrity": "sha1-EzL/ABVsCg/92CNgE9B7d6BFFXM="
     },
     "hasha": {
       "version": "2.2.0",
-      "from": "hasha@>=2.2.0 <2.3.0",
-      "resolved": "https://registry.npmjs.org/hasha/-/hasha-2.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/hasha/-/hasha-2.2.0.tgz",
+      "integrity": "sha1-eNfL/B5tZjA/55g3NlmEUXsvbuE="
     },
     "hawk": {
       "version": "3.1.3",
-      "from": "hawk@>=3.1.3 <3.2.0",
-      "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz",
+      "integrity": "sha1-B4REvXwWQLD+VA0sm3PVlnjo4cQ="
     },
     "he": {
       "version": "1.1.1",
-      "from": "he@>=1.1.0 <1.2.0",
-      "resolved": "https://registry.npmjs.org/he/-/he-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/he/-/he-1.1.1.tgz",
+      "integrity": "sha1-k0EP0hsAlzUVH4howvJx80J+I/0="
     },
     "highlight.js": {
       "version": "9.11.0",
-      "from": "highlight.js@>=9.9.0 <10.0.0",
-      "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-9.11.0.tgz"
+      "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-9.11.0.tgz",
+      "integrity": "sha1-R/mMc5mRhwDbLK8jDe0SzsQahK4="
     },
     "hmac-drbg": {
       "version": "1.0.1",
-      "from": "hmac-drbg@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz",
+      "integrity": "sha1-0nRXAQJabHdabFRXk+1QL8DGSaE="
     },
     "hoek": {
       "version": "2.16.3",
-      "from": "hoek@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz"
+      "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz",
+      "integrity": "sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0="
     },
     "homedir-polyfill": {
       "version": "1.0.1",
-      "from": "homedir-polyfill@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.1.tgz",
+      "integrity": "sha1-TCu8inWJmP7r9e1oWA921GdotLw="
     },
     "hosted-git-info": {
       "version": "2.4.2",
-      "from": "hosted-git-info@>=2.1.4 <3.0.0",
-      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.4.2.tgz"
+      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.4.2.tgz",
+      "integrity": "sha1-AHa59GonBQbduq6lZJaJdGBhKmc="
     },
     "hpack.js": {
       "version": "2.1.6",
-      "from": "hpack.js@>=2.1.6 <3.0.0",
       "resolved": "https://registry.npmjs.org/hpack.js/-/hpack.js-2.1.6.tgz",
+      "integrity": "sha1-h3dMCUnlE/QuhFdbPEVoH63ioLI=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "html-comment-regex": {
       "version": "1.1.1",
-      "from": "html-comment-regex@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/html-comment-regex/-/html-comment-regex-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/html-comment-regex/-/html-comment-regex-1.1.1.tgz",
+      "integrity": "sha1-ZouTd26q5V696POtRkswekljYl4="
     },
     "html-entities": {
       "version": "1.2.1",
-      "from": "html-entities@>=1.2.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-1.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-1.2.1.tgz",
+      "integrity": "sha1-DfKTUfByEWNRXfueVUPl9u7VFi8="
     },
     "html-loader": {
       "version": "0.4.5",
-      "from": "html-loader@>=0.4.3 <0.5.0",
       "resolved": "https://registry.npmjs.org/html-loader/-/html-loader-0.4.5.tgz",
+      "integrity": "sha1-X7zYfNY6XEmn/OL+VvQl4Fcpxow=",
       "dependencies": {
         "loader-utils": {
           "version": "1.1.0",
-          "from": "loader-utils@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
+          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
         }
       }
     },
     "html-minifier": {
       "version": "3.5.2",
-      "from": "html-minifier@>=3.0.1 <4.0.0",
       "resolved": "https://registry.npmjs.org/html-minifier/-/html-minifier-3.5.2.tgz",
+      "integrity": "sha1-1zvD/0SJQkCIGM5gm/P7DqfvTrc=",
       "dependencies": {
         "clean-css": {
           "version": "4.1.3",
-          "from": "clean-css@>=4.1.0 <4.2.0",
-          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.3.tgz"
+          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.3.tgz",
+          "integrity": "sha1-B8/omA7bINRV3cI6rc8eBMblCc4="
         },
         "uglify-js": {
           "version": "3.0.13",
-          "from": "uglify-js@>=3.0.0 <3.1.0",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.13.tgz"
+          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.13.tgz",
+          "integrity": "sha1-GHHXNqoeVQxyjX5aZVZXnnCSXWg="
         }
       }
     },
     "htmlparser2": {
       "version": "3.9.2",
-      "from": "htmlparser2@>=3.9.1 <4.0.0",
       "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.9.2.tgz",
+      "integrity": "sha1-G9+HrMoPP55T+k/M6w9LTLsAszg=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "http-browserify": {
       "version": "1.7.0",
-      "from": "http-browserify@>=1.3.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/http-browserify/-/http-browserify-1.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/http-browserify/-/http-browserify-1.7.0.tgz",
+      "integrity": "sha1-M3la3nLfiKz7/TZ3PO/tp2RzWyA="
     },
     "http-deceiver": {
       "version": "1.2.7",
-      "from": "http-deceiver@>=1.2.7 <2.0.0",
-      "resolved": "https://registry.npmjs.org/http-deceiver/-/http-deceiver-1.2.7.tgz"
+      "resolved": "https://registry.npmjs.org/http-deceiver/-/http-deceiver-1.2.7.tgz",
+      "integrity": "sha1-+nFolEq5pRnTN8sL7HKE3D5yPYc="
     },
     "http-errors": {
       "version": "1.6.1",
-      "from": "http-errors@>=1.6.1 <1.7.0",
-      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.1.tgz"
+      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.1.tgz",
+      "integrity": "sha1-X4uO2YrKVFZWv1cplzh/kEpyIlc="
     },
     "http-proxy": {
       "version": "1.16.2",
-      "from": "http-proxy@>=1.13.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.16.2.tgz"
+      "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.16.2.tgz",
+      "integrity": "sha1-Bt/ykpUr9k2+hHH6nfcwZtTzd0I="
     },
     "http-proxy-middleware": {
       "version": "0.17.4",
-      "from": "http-proxy-middleware@>=0.17.4 <0.18.0",
       "resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-0.17.4.tgz",
+      "integrity": "sha1-ZC6ISIUdZvCdTxJJEoRtuutBuDM=",
       "dependencies": {
         "is-extglob": {
           "version": "2.1.1",
-          "from": "is-extglob@>=2.1.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz"
+          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
+          "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI="
         },
         "is-glob": {
           "version": "3.1.0",
-          "from": "is-glob@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz",
+          "integrity": "sha1-e6WuJCF4BKxwcHuWkiVnSGzD6Eo="
         },
         "lodash": {
           "version": "4.17.4",
-          "from": "lodash@>=4.17.2 <5.0.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz"
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
         }
       }
     },
     "http-signature": {
       "version": "1.1.1",
-      "from": "http-signature@>=1.1.0 <1.2.0",
-      "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz",
+      "integrity": "sha1-33LiZwZs0Kxn+3at+OE0qPvPkb8="
     },
     "https-browserify": {
       "version": "0.0.0",
-      "from": "https-browserify@0.0.0",
-      "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.0.tgz",
+      "integrity": "sha1-s//f5zSyo9Sp79WOhlTJH86G6v0="
     },
     "iconv-lite": {
       "version": "0.4.15",
-      "from": "iconv-lite@0.4.15",
-      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.15.tgz"
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.15.tgz",
+      "integrity": "sha1-/iZaIYrGpXz+hUkn6dBMGYJe3es="
     },
     "icss-replace-symbols": {
       "version": "1.1.0",
-      "from": "icss-replace-symbols@1.1.0",
-      "resolved": "https://registry.npmjs.org/icss-replace-symbols/-/icss-replace-symbols-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/icss-replace-symbols/-/icss-replace-symbols-1.1.0.tgz",
+      "integrity": "sha1-Bupvg2ead0njhs/h/oEq5dsiPe0="
     },
     "icss-utils": {
       "version": "2.1.0",
-      "from": "icss-utils@>=2.1.0 <3.0.0",
       "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-2.1.0.tgz",
+      "integrity": "sha1-g/Cg7DeL8yRheLbCrZE28TWxyWI=",
       "dependencies": {
         "postcss": {
           "version": "6.0.1",
-          "from": "postcss@>=6.0.1 <7.0.0",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
+          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.2.3 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
     "ieee754": {
       "version": "1.1.8",
-      "from": "ieee754@>=1.1.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.8.tgz"
+      "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.8.tgz",
+      "integrity": "sha1-vjPUCsEO8ZJnAfbwii2G+/0a0+Q="
     },
     "immutability-helper": {
       "version": "2.2.2",
-      "from": "immutability-helper@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.2.2.tgz",
+      "integrity": "sha1-5+nacos94vrTSiFvQVezJtvMyJI="
     },
     "imurmurhash": {
       "version": "0.1.4",
-      "from": "imurmurhash@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz",
+      "integrity": "sha1-khi5srkoojixPcT7a21XbyMUU+o="
     },
     "in-publish": {
       "version": "2.0.0",
-      "from": "in-publish@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/in-publish/-/in-publish-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/in-publish/-/in-publish-2.0.0.tgz",
+      "integrity": "sha1-4g/146KvwmkDILbcVSaCqcf631E="
     },
     "indent-string": {
       "version": "2.1.0",
-      "from": "indent-string@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-2.1.0.tgz",
+      "integrity": "sha1-ji1INIdCEhtKghi3oTfppSBJ3IA="
     },
     "indexes-of": {
       "version": "1.0.1",
-      "from": "indexes-of@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/indexes-of/-/indexes-of-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/indexes-of/-/indexes-of-1.0.1.tgz",
+      "integrity": "sha1-8w9xbI4r00bHtn0985FVZqfAVgc="
     },
     "indexof": {
       "version": "0.0.1",
-      "from": "indexof@0.0.1",
-      "resolved": "https://registry.npmjs.org/indexof/-/indexof-0.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/indexof/-/indexof-0.0.1.tgz",
+      "integrity": "sha1-gtwzbSMrkGIXnQWrMpOmYFn9Q10="
     },
     "inflight": {
       "version": "1.0.6",
-      "from": "inflight@>=1.0.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz"
+      "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
+      "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk="
     },
     "inherits": {
       "version": "2.0.3",
-      "from": "inherits@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
+      "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4="
     },
     "ini": {
       "version": "1.3.4",
-      "from": "ini@>=1.3.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.4.tgz"
+      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.4.tgz",
+      "integrity": "sha1-BTfLedr1m1mhpRff9wbIbsA5Fi4="
     },
     "inpath": {
       "version": "1.0.2",
-      "from": "inpath@>=1.0.2 <1.1.0",
-      "resolved": "https://registry.npmjs.org/inpath/-/inpath-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/inpath/-/inpath-1.0.2.tgz",
+      "integrity": "sha1-SsIZcQ7Hpy9GD/lL9CTdPvDlKBc="
     },
     "inquirer": {
       "version": "0.10.1",
-      "from": "inquirer@>=0.10.0 <0.11.0",
       "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-0.10.1.tgz",
+      "integrity": "sha1-6iXkzmnKFF4FyZ5G3P7AXkASWUo=",
       "dependencies": {
         "lodash": {
           "version": "3.10.1",
-          "from": "lodash@>=3.3.1 <4.0.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
+          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
         }
       }
     },
     "interpret": {
       "version": "1.0.3",
-      "from": "interpret@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.0.3.tgz",
+      "integrity": "sha1-y8NcYu7uc/Gat7EKgBURQBr8D5A="
     },
     "invariant": {
       "version": "2.2.2",
-      "from": "invariant@>=2.2.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.2.tgz",
+      "integrity": "sha1-nh9WrArNtr8wMwbzOL47IErmA2A="
     },
     "invert-kv": {
       "version": "1.0.0",
-      "from": "invert-kv@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/invert-kv/-/invert-kv-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/invert-kv/-/invert-kv-1.0.0.tgz",
+      "integrity": "sha1-EEqOSqym09jNFXqO+L+rLXo//bY="
     },
     "ipaddr.js": {
       "version": "1.3.0",
-      "from": "ipaddr.js@1.3.0",
-      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.3.0.tgz",
+      "integrity": "sha1-HgOlL9rYOou7KyXL9JmLTP/NPew="
     },
     "irregular-plurals": {
       "version": "1.2.0",
-      "from": "irregular-plurals@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/irregular-plurals/-/irregular-plurals-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/irregular-plurals/-/irregular-plurals-1.2.0.tgz",
+      "integrity": "sha1-OPKZg0uowAwwvpxVThNyaXUv86w="
     },
     "is": {
       "version": "3.2.1",
-      "from": "is@>=3.1.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/is/-/is-3.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/is/-/is-3.2.1.tgz",
+      "integrity": "sha1-0Kwq1V63sL7JJqUmb2xmKqqD3KU="
     },
     "is-absolute": {
       "version": "0.2.6",
-      "from": "is-absolute@>=0.2.3 <0.3.0",
-      "resolved": "https://registry.npmjs.org/is-absolute/-/is-absolute-0.2.6.tgz"
+      "resolved": "https://registry.npmjs.org/is-absolute/-/is-absolute-0.2.6.tgz",
+      "integrity": "sha1-IN5p89uULvLYe5wto28XIjWxtes="
     },
     "is-absolute-url": {
       "version": "2.1.0",
-      "from": "is-absolute-url@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/is-absolute-url/-/is-absolute-url-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-absolute-url/-/is-absolute-url-2.1.0.tgz",
+      "integrity": "sha1-UFMN+4T8yap9vnhS6Do3uTufKqY="
     },
     "is-arrayish": {
       "version": "0.2.1",
-      "from": "is-arrayish@>=0.2.1 <0.3.0",
-      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
+      "integrity": "sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0="
     },
     "is-binary-path": {
       "version": "1.0.1",
-      "from": "is-binary-path@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-1.0.1.tgz",
+      "integrity": "sha1-dfFmQrSA8YenEcgUFh/TpKdlWJg="
     },
     "is-buffer": {
       "version": "1.1.5",
-      "from": "is-buffer@>=1.1.5 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.5.tgz"
+      "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.5.tgz",
+      "integrity": "sha1-Hzsm72E7IUuIy8ojzGwB2Hlh7sw="
     },
     "is-builtin-module": {
       "version": "1.0.0",
-      "from": "is-builtin-module@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-1.0.0.tgz",
+      "integrity": "sha1-VAVy0096wxGfj3bDDLwbHgN6/74="
     },
     "is-callable": {
       "version": "1.1.3",
-      "from": "is-callable@>=1.1.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.1.3.tgz",
+      "integrity": "sha1-hut1OSgF3cM69xySoO7fdO52BLI="
     },
     "is-date-object": {
       "version": "1.0.1",
-      "from": "is-date-object@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.1.tgz",
+      "integrity": "sha1-mqIOtq7rv/d/vTPnTKAbM1gdOhY="
     },
     "is-directory": {
       "version": "0.3.1",
-      "from": "is-directory@>=0.3.1 <0.4.0",
-      "resolved": "https://registry.npmjs.org/is-directory/-/is-directory-0.3.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-directory/-/is-directory-0.3.1.tgz",
+      "integrity": "sha1-YTObbyR1/Hcv2cnYP1yFddwVSuE="
     },
     "is-dotfile": {
       "version": "1.0.2",
-      "from": "is-dotfile@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-dotfile/-/is-dotfile-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/is-dotfile/-/is-dotfile-1.0.2.tgz",
+      "integrity": "sha1-LBMjg/ORmfjtwmjKAbmwB9IFzE0="
     },
     "is-equal-shallow": {
       "version": "0.1.3",
-      "from": "is-equal-shallow@>=0.1.3 <0.2.0",
-      "resolved": "https://registry.npmjs.org/is-equal-shallow/-/is-equal-shallow-0.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/is-equal-shallow/-/is-equal-shallow-0.1.3.tgz",
+      "integrity": "sha1-IjgJj8Ih3gvPpdnqxMRdY4qhxTQ="
     },
     "is-extendable": {
       "version": "0.1.1",
-      "from": "is-extendable@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
+      "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik="
     },
     "is-extglob": {
       "version": "1.0.0",
-      "from": "is-extglob@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
+      "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
     },
     "is-finite": {
       "version": "1.0.2",
-      "from": "is-finite@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-finite/-/is-finite-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/is-finite/-/is-finite-1.0.2.tgz",
+      "integrity": "sha1-zGZ3aVYCvlUO8R6LSqYwU0K20Ko="
     },
     "is-fullwidth-code-point": {
       "version": "1.0.0",
-      "from": "is-fullwidth-code-point@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
+      "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
     },
     "is-glob": {
       "version": "2.0.1",
-      "from": "is-glob@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz",
+      "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM="
     },
     "is-my-json-valid": {
       "version": "2.16.0",
-      "from": "is-my-json-valid@>=2.12.4 <3.0.0",
-      "resolved": "https://registry.npmjs.org/is-my-json-valid/-/is-my-json-valid-2.16.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-my-json-valid/-/is-my-json-valid-2.16.0.tgz",
+      "integrity": "sha1-8Hndm/2uZe4gOKrorLyGqxCeNpM="
     },
     "is-npm": {
       "version": "1.0.0",
-      "from": "is-npm@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-npm/-/is-npm-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-npm/-/is-npm-1.0.0.tgz",
+      "integrity": "sha1-8vtjpl5JBbQGyGBydloaTceTufQ="
     },
     "is-number": {
       "version": "2.1.0",
-      "from": "is-number@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz",
+      "integrity": "sha1-Afy7s5NGOlSPL0ZszhbezknbkI8="
     },
     "is-obj": {
       "version": "1.0.1",
-      "from": "is-obj@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-1.0.1.tgz",
+      "integrity": "sha1-PkcprB9f3gJc19g6iW2rn09n2w8="
     },
     "is-path-cwd": {
       "version": "1.0.0",
-      "from": "is-path-cwd@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-1.0.0.tgz",
+      "integrity": "sha1-0iXsIxMuie3Tj9p2dHLmLmXxEG0="
     },
     "is-path-in-cwd": {
       "version": "1.0.0",
-      "from": "is-path-in-cwd@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-1.0.0.tgz",
+      "integrity": "sha1-ZHdYK4IU1gI0YJRWcAO+ip6sBNw="
     },
     "is-path-inside": {
       "version": "1.0.0",
-      "from": "is-path-inside@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-1.0.0.tgz",
+      "integrity": "sha1-/AbloWg/vaE95mev9xe7wQpI838="
     },
     "is-plain-obj": {
       "version": "1.1.0",
-      "from": "is-plain-obj@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-1.1.0.tgz",
+      "integrity": "sha1-caUMhCnfync8kqOQpKA7OfzVHT4="
     },
     "is-plain-object": {
       "version": "2.0.2",
-      "from": "is-plain-object@>=2.0.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.2.tgz",
+      "integrity": "sha1-HZq3lWaZN94xmYBxyh9wF3CzdaQ=",
       "dependencies": {
         "isobject": {
           "version": "3.0.0",
-          "from": "isobject@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.0.tgz",
+          "integrity": "sha1-OVZSF/NmF4nooKDAgNX35rxG4aA="
         }
       }
     },
     "is-posix-bracket": {
       "version": "0.1.1",
-      "from": "is-posix-bracket@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz",
+      "integrity": "sha1-MzTceXdDaOkvAW5vvAqI9c1ua8Q="
     },
     "is-primitive": {
       "version": "2.0.0",
-      "from": "is-primitive@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/is-primitive/-/is-primitive-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-primitive/-/is-primitive-2.0.0.tgz",
+      "integrity": "sha1-IHurkWOEmcB7Kt8kCkGochADRXU="
     },
     "is-property": {
       "version": "1.0.2",
-      "from": "is-property@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-property/-/is-property-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/is-property/-/is-property-1.0.2.tgz",
+      "integrity": "sha1-V/4cTkhHTt1lsJkR8msc1Ald2oQ="
     },
     "is-redirect": {
       "version": "1.0.0",
-      "from": "is-redirect@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-redirect/-/is-redirect-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-redirect/-/is-redirect-1.0.0.tgz",
+      "integrity": "sha1-HQPd7VO9jbDzDCbk+V02/HyH3CQ="
     },
     "is-regex": {
       "version": "1.0.4",
-      "from": "is-regex@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.0.4.tgz",
+      "integrity": "sha1-VRdIm1RwkbCTDglWVM7SXul+lJE="
     },
     "is-regexp": {
       "version": "1.0.0",
-      "from": "is-regexp@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-regexp/-/is-regexp-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-regexp/-/is-regexp-1.0.0.tgz",
+      "integrity": "sha1-/S2INUXEa6xaYz57mgnof6LLUGk="
     },
     "is-relative": {
       "version": "0.2.1",
-      "from": "is-relative@>=0.2.1 <0.3.0",
-      "resolved": "https://registry.npmjs.org/is-relative/-/is-relative-0.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-relative/-/is-relative-0.2.1.tgz",
+      "integrity": "sha1-0n9MfVFtF1+2ENuEu+7yPDvJeqU="
     },
     "is-retry-allowed": {
       "version": "1.1.0",
-      "from": "is-retry-allowed@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-retry-allowed/-/is-retry-allowed-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-retry-allowed/-/is-retry-allowed-1.1.0.tgz",
+      "integrity": "sha1-EaBgVotnM5REAz0BJaYaINVk+zQ="
     },
     "is-stream": {
       "version": "1.1.0",
-      "from": "is-stream@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz",
+      "integrity": "sha1-EtSj3U5o4Lec6428hBc66A2RykQ="
     },
     "is-subset": {
       "version": "0.1.1",
-      "from": "is-subset@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/is-subset/-/is-subset-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-subset/-/is-subset-0.1.1.tgz",
+      "integrity": "sha1-ilkRfZMt4d4A8kX83TnOQ/HpOaY="
     },
     "is-svg": {
       "version": "2.1.0",
-      "from": "is-svg@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/is-svg/-/is-svg-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-svg/-/is-svg-2.1.0.tgz",
+      "integrity": "sha1-z2EJDaDZ77yrhyLeum8DIgjbsOk="
     },
     "is-symbol": {
       "version": "1.0.1",
-      "from": "is-symbol@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.0.1.tgz",
+      "integrity": "sha1-PMWfAAJRlLarLjjbrmaJJWtmBXI="
     },
     "is-typedarray": {
       "version": "1.0.0",
-      "from": "is-typedarray@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz",
+      "integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo="
     },
     "is-unc-path": {
       "version": "0.1.2",
-      "from": "is-unc-path@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/is-unc-path/-/is-unc-path-0.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/is-unc-path/-/is-unc-path-0.1.2.tgz",
+      "integrity": "sha1-arBTpyVzwQJQ/0FqOBTDUXivObk="
     },
     "is-utf8": {
       "version": "0.2.1",
-      "from": "is-utf8@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz",
+      "integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI="
     },
     "is-valid-glob": {
       "version": "0.3.0",
-      "from": "is-valid-glob@>=0.3.0 <0.4.0",
-      "resolved": "https://registry.npmjs.org/is-valid-glob/-/is-valid-glob-0.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-valid-glob/-/is-valid-glob-0.3.0.tgz",
+      "integrity": "sha1-1LVcafUYhvm2XHDWwmItN+KfSP4="
     },
     "is-windows": {
       "version": "0.2.0",
-      "from": "is-windows@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-0.2.0.tgz",
+      "integrity": "sha1-3hqm1j6indJIc3tp8f+LgALSEIw="
     },
     "isarray": {
       "version": "0.0.1",
-      "from": "isarray@0.0.1",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+      "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
     },
     "isbinaryfile": {
       "version": "3.0.2",
-      "from": "isbinaryfile@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/isbinaryfile/-/isbinaryfile-3.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/isbinaryfile/-/isbinaryfile-3.0.2.tgz",
+      "integrity": "sha1-Sj6XTsDLqQBNP8bN5yCeppNopiE="
     },
     "isexe": {
       "version": "2.0.0",
-      "from": "isexe@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
+      "integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA="
     },
     "isobject": {
       "version": "2.1.0",
-      "from": "isobject@>=2.0.0 <3.0.0",
       "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
+      "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         }
       }
     },
     "isomorphic-fetch": {
       "version": "2.2.1",
-      "from": "isomorphic-fetch@>=2.1.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz",
+      "integrity": "sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk=",
       "dependencies": {
         "whatwg-fetch": {
           "version": "2.0.3",
-          "from": "whatwg-fetch@>=0.10.0",
-          "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-2.0.3.tgz"
+          "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-2.0.3.tgz",
+          "integrity": "sha1-nITsLc9oGH/wC8ZOEnS0QhduHIQ="
         }
       }
     },
     "isstream": {
       "version": "0.1.2",
-      "from": "isstream@>=0.1.2 <0.2.0",
-      "resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz",
+      "integrity": "sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo="
     },
     "istanbul": {
       "version": "0.4.5",
-      "from": "istanbul@>=0.0.0 <1.0.0",
       "resolved": "https://registry.npmjs.org/istanbul/-/istanbul-0.4.5.tgz",
+      "integrity": "sha1-ZcfXPUxNqE1POsMQuRj7C4Azczs=",
       "dependencies": {
         "esprima": {
           "version": "2.7.3",
-          "from": "esprima@>=2.7.0 <2.8.0",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz"
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz",
+          "integrity": "sha1-luO3DVd59q1JzQMmc9HDEnZ7pYE="
         },
         "glob": {
           "version": "5.0.15",
-          "from": "glob@>=5.0.15 <6.0.0",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
+          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
+          "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
         },
         "resolve": {
           "version": "1.1.7",
-          "from": "resolve@>=1.1.0 <1.2.0",
-          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz"
+          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz",
+          "integrity": "sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         },
         "wordwrap": {
           "version": "1.0.0",
-          "from": "wordwrap@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz",
+          "integrity": "sha1-J1hIEIkUVqQXHI0CJkQa3pDLyus="
         }
       }
     },
     "istanbul-instrumenter-loader": {
       "version": "0.2.0",
-      "from": "istanbul-instrumenter-loader@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/istanbul-instrumenter-loader/-/istanbul-instrumenter-loader-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/istanbul-instrumenter-loader/-/istanbul-instrumenter-loader-0.2.0.tgz",
+      "integrity": "sha1-ZD5OXk6PlGaGOimpd9KDqzcsAZw="
     },
     "istextorbinary": {
       "version": "1.0.2",
-      "from": "istextorbinary@1.0.2",
-      "resolved": "https://registry.npmjs.org/istextorbinary/-/istextorbinary-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/istextorbinary/-/istextorbinary-1.0.2.tgz",
+      "integrity": "sha1-rOGTVNGpoBc+/rEITOD4ewrX3s8="
     },
     "jade": {
       "version": "0.26.3",
-      "from": "jade@0.26.3",
       "resolved": "https://registry.npmjs.org/jade/-/jade-0.26.3.tgz",
+      "integrity": "sha1-jxDXl32NefL2/4YqgbBRPMslaGw=",
       "dependencies": {
         "commander": {
           "version": "0.6.1",
-          "from": "commander@0.6.1",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-0.6.1.tgz"
+          "resolved": "https://registry.npmjs.org/commander/-/commander-0.6.1.tgz",
+          "integrity": "sha1-+mihT2qUXVTbvlDYzbMyDp47GgY="
         },
         "mkdirp": {
           "version": "0.3.0",
-          "from": "mkdirp@0.3.0",
-          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.3.0.tgz",
+          "integrity": "sha1-G79asbqCevI1dRQ0kEJkVfSB/h4="
         }
       }
     },
     "jju": {
       "version": "1.3.0",
-      "from": "jju@>=1.3.0 <1.4.0",
-      "resolved": "https://registry.npmjs.org/jju/-/jju-1.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/jju/-/jju-1.3.0.tgz",
+      "integrity": "sha1-2t2e8BkkvHKLA/L3l5vb1i96Kqo="
     },
     "jodid25519": {
       "version": "1.0.2",
-      "from": "jodid25519@>=1.0.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/jodid25519/-/jodid25519-1.0.2.tgz",
+      "integrity": "sha1-BtSRIlUJNBlHfUJWM2BuDpB4KWc=",
       "optional": true
     },
     "js-base64": {
       "version": "2.1.9",
-      "from": "js-base64@>=2.1.9 <3.0.0",
-      "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.1.9.tgz"
+      "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.1.9.tgz",
+      "integrity": "sha1-8OgK4DmkvWVLXygfyT8EqRSn/M4="
     },
     "js-tokens": {
       "version": "3.0.1",
-      "from": "js-tokens@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.1.tgz",
+      "integrity": "sha1-COnxMkhKLEWjCQfp3E1VZ7fxFNc="
     },
     "js-yaml": {
       "version": "3.8.4",
-      "from": "js-yaml@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.8.4.tgz"
+      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.8.4.tgz",
+      "integrity": "sha1-UgtFZPhlc7qWZir4Woyvp7S1pvY="
     },
     "jsbn": {
       "version": "0.1.1",
-      "from": "jsbn@>=0.1.0 <0.2.0",
       "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-0.1.1.tgz",
+      "integrity": "sha1-peZUwuWi3rXyAdls77yoDA7y9RM=",
       "optional": true
     },
     "jsesc": {
       "version": "0.5.0",
-      "from": "jsesc@>=0.5.0 <0.6.0",
-      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
+      "integrity": "sha1-597mbjXW/Bb3EP6R1c9p9w8IkR0="
     },
     "json-loader": {
       "version": "0.5.4",
-      "from": "json-loader@>=0.5.4 <0.6.0",
-      "resolved": "https://registry.npmjs.org/json-loader/-/json-loader-0.5.4.tgz"
+      "resolved": "https://registry.npmjs.org/json-loader/-/json-loader-0.5.4.tgz",
+      "integrity": "sha1-i6oTZaYy9Yo8RtIBdfxgAsluN94="
     },
     "json-schema": {
       "version": "0.2.3",
-      "from": "json-schema@0.2.3",
-      "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz"
+      "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz",
+      "integrity": "sha1-tIDIkuWaLwWVTOcnvT8qTogvnhM="
     },
     "json-stable-stringify": {
       "version": "1.0.1",
-      "from": "json-stable-stringify@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz",
+      "integrity": "sha1-mnWdOcXy/1A/1TAGRu1EX4jE+a8="
     },
     "json-stringify-safe": {
       "version": "5.0.1",
-      "from": "json-stringify-safe@>=5.0.1 <5.1.0",
-      "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz",
+      "integrity": "sha1-Epai1Y/UXxmg9s4B1lcB4sc1tus="
     },
     "json3": {
       "version": "3.3.2",
-      "from": "json3@3.3.2",
-      "resolved": "https://registry.npmjs.org/json3/-/json3-3.3.2.tgz"
+      "resolved": "https://registry.npmjs.org/json3/-/json3-3.3.2.tgz",
+      "integrity": "sha1-PAQ0dD35Pi9cQq7nsZvLSDV19OE="
     },
     "json5": {
       "version": "0.5.1",
-      "from": "json5@>=0.5.0 <0.6.0",
-      "resolved": "https://registry.npmjs.org/json5/-/json5-0.5.1.tgz"
+      "resolved": "https://registry.npmjs.org/json5/-/json5-0.5.1.tgz",
+      "integrity": "sha1-Hq3nrMASA0rYTiOWdn6tn6VJWCE="
     },
     "jsonfile": {
       "version": "2.4.0",
-      "from": "jsonfile@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz",
+      "integrity": "sha1-NzaitCi4e72gzIO1P6PWM6NcKug="
     },
     "jsonify": {
       "version": "0.0.0",
-      "from": "jsonify@>=0.0.0 <0.1.0",
-      "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz",
+      "integrity": "sha1-LHS27kHZPKUbe1qu6PUDYx0lKnM="
     },
     "jsonpointer": {
       "version": "4.0.1",
-      "from": "jsonpointer@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/jsonpointer/-/jsonpointer-4.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/jsonpointer/-/jsonpointer-4.0.1.tgz",
+      "integrity": "sha1-T9kss04OnbPInIYi7PUfm5eMbLk="
     },
     "jsprim": {
       "version": "1.4.0",
-      "from": "jsprim@>=1.2.2 <2.0.0",
       "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.0.tgz",
+      "integrity": "sha1-o7h+QCmNjDgFUtjMdiigu5WiKRg=",
       "dependencies": {
         "assert-plus": {
           "version": "1.0.0",
-          "from": "assert-plus@1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
         }
       }
     },
     "jstransform": {
       "version": "11.0.3",
-      "from": "jstransform@>=11.0.3 <12.0.0",
       "resolved": "https://registry.npmjs.org/jstransform/-/jstransform-11.0.3.tgz",
+      "integrity": "sha1-CaeJk+CuTU70SH9hVakfYZDLQiM=",
       "dependencies": {
         "esprima-fb": {
           "version": "15001.1.0-dev-harmony-fb",
-          "from": "esprima-fb@>=15001.1.0-dev-harmony-fb <15002.0.0",
-          "resolved": "https://registry.npmjs.org/esprima-fb/-/esprima-fb-15001.1.0-dev-harmony-fb.tgz"
+          "resolved": "https://registry.npmjs.org/esprima-fb/-/esprima-fb-15001.1.0-dev-harmony-fb.tgz",
+          "integrity": "sha1-MKlHMDxrjV6VW+4rmbHSMyBqaQE="
         },
         "object-assign": {
           "version": "2.1.1",
-          "from": "object-assign@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-2.1.1.tgz"
+          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-2.1.1.tgz",
+          "integrity": "sha1-Q8NuXVaf+OSBbE76i+AtJpZ8GKo="
         },
         "source-map": {
           "version": "0.4.4",
-          "from": "source-map@>=0.4.2 <0.5.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz"
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
+          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s="
         }
       }
     },
     "jszip": {
       "version": "2.5.0",
-      "from": "jszip@2.5.0",
-      "resolved": "https://registry.npmjs.org/jszip/-/jszip-2.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/jszip/-/jszip-2.5.0.tgz",
+      "integrity": "sha1-dET9hVHd8+XacZj+oMkbyDCMwnQ="
     },
     "karma": {
       "version": "0.13.22",
-      "from": "karma@>=0.13.9 <0.14.0",
       "resolved": "https://registry.npmjs.org/karma/-/karma-0.13.22.tgz",
+      "integrity": "sha1-B3ULG9Bj1+fnuRvNLmNU2PKqh0Q=",
       "dependencies": {
         "bluebird": {
           "version": "2.11.0",
-          "from": "bluebird@>=2.9.27 <3.0.0",
-          "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-2.11.0.tgz"
+          "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-2.11.0.tgz",
+          "integrity": "sha1-U0uQM8AiyVecVro7Plpcqvu2UOE="
         },
         "lodash": {
           "version": "3.10.1",
-          "from": "lodash@>=3.8.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
+          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
         }
       }
     },
     "karma-coverage": {
       "version": "0.5.5",
-      "from": "karma-coverage@>=0.5.5 <0.6.0",
       "resolved": "https://registry.npmjs.org/karma-coverage/-/karma-coverage-0.5.5.tgz",
+      "integrity": "sha1-sNWLECXVnVxmICYxhvHVj11TSMU=",
       "dependencies": {
         "dateformat": {
           "version": "1.0.12",
-          "from": "dateformat@>=1.0.6 <2.0.0",
-          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz"
+          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
+          "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk="
         }
       }
     },
     "karma-mocha": {
       "version": "0.2.2",
-      "from": "karma-mocha@>=0.2.2 <0.3.0",
-      "resolved": "https://registry.npmjs.org/karma-mocha/-/karma-mocha-0.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/karma-mocha/-/karma-mocha-0.2.2.tgz",
+      "integrity": "sha1-OI7ZF9oV3LGW0bkVwZNO+AMZP44="
     },
     "karma-mocha-clean-reporter": {
       "version": "0.0.1",
-      "from": "karma-mocha-clean-reporter@>=0.0.1 <0.1.0",
-      "resolved": "https://registry.npmjs.org/karma-mocha-clean-reporter/-/karma-mocha-clean-reporter-0.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/karma-mocha-clean-reporter/-/karma-mocha-clean-reporter-0.0.1.tgz",
+      "integrity": "sha1-6G961LxefGLX8uJC3ydRzPk/Rvo="
     },
     "karma-phantomjs-launcher": {
       "version": "1.0.4",
-      "from": "karma-phantomjs-launcher@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/karma-phantomjs-launcher/-/karma-phantomjs-launcher-1.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/karma-phantomjs-launcher/-/karma-phantomjs-launcher-1.0.4.tgz",
+      "integrity": "sha1-0jyjSAG9qYY60xjju0vUBisTrNI="
     },
     "karma-sinon-chai": {
       "version": "1.3.1",
-      "from": "karma-sinon-chai@1.3.1",
       "resolved": "https://registry.npmjs.org/karma-sinon-chai/-/karma-sinon-chai-1.3.1.tgz",
+      "integrity": "sha1-RjNBlJTZ4thIeH3XYFMDGFn1t/U=",
       "dependencies": {
         "lolex": {
           "version": "1.6.0",
-          "from": "lolex@>=1.6.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz"
+          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
+          "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
         }
       }
     },
     "karma-webpack": {
       "version": "2.0.3",
-      "from": "karma-webpack@>=2.0.1 <2.1.0",
       "resolved": "https://registry.npmjs.org/karma-webpack/-/karma-webpack-2.0.3.tgz",
+      "integrity": "sha1-Oc6/XKJYATmyf5rmm3iBa5yC+uY=",
       "dependencies": {
         "async": {
           "version": "0.9.2",
-          "from": "async@>=0.9.0 <0.10.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz",
+          "integrity": "sha1-rqdNXmHB+JlhO/ZL2mbUx48v0X0="
         },
         "lodash": {
           "version": "3.10.1",
-          "from": "lodash@>=3.8.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
+          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
         },
         "source-map": {
           "version": "0.1.43",
-          "from": "source-map@>=0.1.41 <0.2.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz",
+          "integrity": "sha1-wkvBRspRfBRx9drL4lcbK3+eM0Y="
         }
       }
     },
     "kew": {
       "version": "0.7.0",
-      "from": "kew@>=0.7.0 <0.8.0",
-      "resolved": "https://registry.npmjs.org/kew/-/kew-0.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/kew/-/kew-0.7.0.tgz",
+      "integrity": "sha1-edk9LTM2PW/dKXCzNdkUGtWR15s="
     },
     "kind-of": {
       "version": "3.2.2",
-      "from": "kind-of@>=3.0.2 <4.0.0",
-      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+      "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
     },
     "klaw": {
       "version": "1.3.1",
-      "from": "klaw@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/klaw/-/klaw-1.3.1.tgz"
+      "resolved": "https://registry.npmjs.org/klaw/-/klaw-1.3.1.tgz",
+      "integrity": "sha1-QIhDO0azsbolnXh4XY6W9zugJDk="
     },
     "latest-version": {
       "version": "2.0.0",
-      "from": "latest-version@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-2.0.0.tgz",
+      "integrity": "sha1-VvjWE5YghHuAF/jx9NeOIRMkFos="
     },
     "lazy-cache": {
       "version": "1.0.4",
-      "from": "lazy-cache@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-1.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-1.0.4.tgz",
+      "integrity": "sha1-odePw6UEdMuAhF07O24dpJpEbo4="
     },
     "lazy-req": {
       "version": "1.1.0",
-      "from": "lazy-req@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/lazy-req/-/lazy-req-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/lazy-req/-/lazy-req-1.1.0.tgz",
+      "integrity": "sha1-va6+rTD42CQDnODOFJ1Nqge6H6w="
     },
     "lazystream": {
       "version": "1.0.0",
-      "from": "lazystream@>=1.0.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/lazystream/-/lazystream-1.0.0.tgz",
+      "integrity": "sha1-9plf4PggOS9hOWvolGJAe7dxaOQ=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "lcid": {
       "version": "1.0.0",
-      "from": "lcid@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/lcid/-/lcid-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/lcid/-/lcid-1.0.0.tgz",
+      "integrity": "sha1-MIrMr6C8SDo4Z7S28rlQYlHRuDU="
     },
     "levn": {
       "version": "0.3.0",
-      "from": "levn@>=0.3.0 <0.4.0",
-      "resolved": "https://registry.npmjs.org/levn/-/levn-0.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/levn/-/levn-0.3.0.tgz",
+      "integrity": "sha1-OwmSTt+fCDwEkP3UwLxEIeBHZO4="
     },
     "liftoff": {
       "version": "2.3.0",
-      "from": "liftoff@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/liftoff/-/liftoff-2.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/liftoff/-/liftoff-2.3.0.tgz",
+      "integrity": "sha1-qY8v9nGD2Lp8+soQVIvX/wVQs4U="
     },
     "livereload-js": {
       "version": "2.2.2",
-      "from": "livereload-js@>=2.2.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/livereload-js/-/livereload-js-2.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/livereload-js/-/livereload-js-2.2.2.tgz",
+      "integrity": "sha1-bIclfmSKtHW8JOoldFftzB+NC8I="
     },
     "load-json-file": {
       "version": "1.1.0",
-      "from": "load-json-file@>=1.1.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
+      "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
       "dependencies": {
         "strip-bom": {
           "version": "2.0.0",
-          "from": "strip-bom@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
         }
       }
     },
     "load-themed-styles": {
       "version": "1.2.0",
-      "from": "load-themed-styles@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/load-themed-styles/-/load-themed-styles-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/load-themed-styles/-/load-themed-styles-1.2.0.tgz",
+      "integrity": "sha1-R6uq2LC7kxBtXX8Bq4DcIL85IDw="
     },
     "load-themed-styles-loader": {
       "version": "0.0.3",
-      "from": "load-themed-styles-loader@>=0.0.3 <0.0.4",
-      "resolved": "https://registry.npmjs.org/load-themed-styles-loader/-/load-themed-styles-loader-0.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/load-themed-styles-loader/-/load-themed-styles-loader-0.0.3.tgz",
+      "integrity": "sha1-zmFd1QkLzjvCYcnYE6tHmHdHya8="
     },
     "loader-runner": {
       "version": "2.3.0",
-      "from": "loader-runner@>=2.3.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/loader-runner/-/loader-runner-2.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/loader-runner/-/loader-runner-2.3.0.tgz",
+      "integrity": "sha1-9IKuqC1UPgeSFwDVpG7yb9rGuKI="
     },
     "loader-utils": {
       "version": "0.2.17",
-      "from": "loader-utils@>=0.0.0 <1.0.0",
-      "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz"
+      "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz",
+      "integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g="
     },
     "lodash": {
       "version": "4.15.0",
-      "from": "lodash@>=4.15.0 <4.16.0",
-      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.15.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.15.0.tgz",
+      "integrity": "sha1-MWI5HY8BQKoiz49rPDTWt/Y9Oqk="
     },
     "lodash._arraycopy": {
       "version": "3.0.0",
-      "from": "lodash._arraycopy@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._arraycopy/-/lodash._arraycopy-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._arraycopy/-/lodash._arraycopy-3.0.0.tgz",
+      "integrity": "sha1-due3wfH7klRzdIeKVi7Qaj5Q9uE="
     },
     "lodash._arrayeach": {
       "version": "3.0.0",
-      "from": "lodash._arrayeach@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._arrayeach/-/lodash._arrayeach-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._arrayeach/-/lodash._arrayeach-3.0.0.tgz",
+      "integrity": "sha1-urFWsqkNPxu9XGU0AzSeXlkz754="
     },
     "lodash._baseassign": {
       "version": "3.2.0",
-      "from": "lodash._baseassign@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._baseassign/-/lodash._baseassign-3.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._baseassign/-/lodash._baseassign-3.2.0.tgz",
+      "integrity": "sha1-jDigmVAPIVrQnlnxci/QxSv+Ck4="
     },
     "lodash._baseclone": {
       "version": "4.5.7",
-      "from": "lodash._baseclone@>=4.5.0 <4.6.0",
-      "resolved": "https://registry.npmjs.org/lodash._baseclone/-/lodash._baseclone-4.5.7.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._baseclone/-/lodash._baseclone-4.5.7.tgz",
+      "integrity": "sha1-zkKt4IOE711i+nfDD2GkbmhvhDQ="
     },
     "lodash._basecopy": {
       "version": "3.0.1",
-      "from": "lodash._basecopy@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz",
+      "integrity": "sha1-jaDmqHbPNEwK2KVIghEd08XHyjY="
     },
     "lodash._basecreate": {
       "version": "3.0.3",
-      "from": "lodash._basecreate@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._basecreate/-/lodash._basecreate-3.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._basecreate/-/lodash._basecreate-3.0.3.tgz",
+      "integrity": "sha1-G8ZhYU2qf8MRt9A78WgGoCE8+CE="
     },
     "lodash._basefor": {
       "version": "3.0.3",
-      "from": "lodash._basefor@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._basefor/-/lodash._basefor-3.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._basefor/-/lodash._basefor-3.0.3.tgz",
+      "integrity": "sha1-dVC06SGO8J+tJDQ7YSAhx5tMIMI="
     },
     "lodash._basetostring": {
       "version": "3.0.1",
-      "from": "lodash._basetostring@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._basetostring/-/lodash._basetostring-3.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._basetostring/-/lodash._basetostring-3.0.1.tgz",
+      "integrity": "sha1-0YYdh3+CSlL2aYMtyvPuFVZqB9U="
     },
     "lodash._basevalues": {
       "version": "3.0.0",
-      "from": "lodash._basevalues@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._basevalues/-/lodash._basevalues-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._basevalues/-/lodash._basevalues-3.0.0.tgz",
+      "integrity": "sha1-W3dXYoAr3j0yl1A+JjAIIP32Ybc="
     },
     "lodash._bindcallback": {
       "version": "3.0.1",
-      "from": "lodash._bindcallback@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._bindcallback/-/lodash._bindcallback-3.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._bindcallback/-/lodash._bindcallback-3.0.1.tgz",
+      "integrity": "sha1-5THCdkTPi1epnhftlbNcdIeJOS4="
     },
     "lodash._createcompounder": {
       "version": "3.0.0",
-      "from": "lodash._createcompounder@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._createcompounder/-/lodash._createcompounder-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._createcompounder/-/lodash._createcompounder-3.0.0.tgz",
+      "integrity": "sha1-XdLLVTctbnDg4jkvsjBNZjEJEHU="
     },
     "lodash._escapehtmlchar": {
       "version": "2.4.1",
-      "from": "lodash._escapehtmlchar@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash._escapehtmlchar/-/lodash._escapehtmlchar-2.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._escapehtmlchar/-/lodash._escapehtmlchar-2.4.1.tgz",
+      "integrity": "sha1-32fDu2t+jh6DGrSL+geVuSr+iZ0="
     },
     "lodash._escapestringchar": {
       "version": "2.4.1",
-      "from": "lodash._escapestringchar@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash._escapestringchar/-/lodash._escapestringchar-2.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._escapestringchar/-/lodash._escapestringchar-2.4.1.tgz",
+      "integrity": "sha1-7P4iYYoq3lC/7qQ5N+Ud9m8O23I="
     },
     "lodash._getnative": {
       "version": "3.9.1",
-      "from": "lodash._getnative@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._getnative/-/lodash._getnative-3.9.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._getnative/-/lodash._getnative-3.9.1.tgz",
+      "integrity": "sha1-VwvH3t5G1hzc3mh9ZdPuy6o6r/U="
     },
     "lodash._htmlescapes": {
       "version": "2.4.1",
-      "from": "lodash._htmlescapes@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash._htmlescapes/-/lodash._htmlescapes-2.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._htmlescapes/-/lodash._htmlescapes-2.4.1.tgz",
+      "integrity": "sha1-MtFL8IRLbeb4tioFG09nwii2JMs="
     },
     "lodash._isiterateecall": {
       "version": "3.0.9",
-      "from": "lodash._isiterateecall@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._isiterateecall/-/lodash._isiterateecall-3.0.9.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._isiterateecall/-/lodash._isiterateecall-3.0.9.tgz",
+      "integrity": "sha1-UgOte6Ql+uhCRg5pbbnPPmqsBXw="
     },
     "lodash._isnative": {
       "version": "2.4.1",
-      "from": "lodash._isnative@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash._isnative/-/lodash._isnative-2.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._isnative/-/lodash._isnative-2.4.1.tgz",
+      "integrity": "sha1-PqZAS3hKe+g2x7V1gOHN95sUgyw="
     },
     "lodash._objecttypes": {
       "version": "2.4.1",
-      "from": "lodash._objecttypes@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash._objecttypes/-/lodash._objecttypes-2.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._objecttypes/-/lodash._objecttypes-2.4.1.tgz",
+      "integrity": "sha1-fAt/admKH3ZSn4kLDNsbTf7BHBE="
     },
     "lodash._reescape": {
       "version": "3.0.0",
-      "from": "lodash._reescape@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reescape/-/lodash._reescape-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._reescape/-/lodash._reescape-3.0.0.tgz",
+      "integrity": "sha1-Kx1vXf4HyKNVdT5fJ/rH8c3hYWo="
     },
     "lodash._reevaluate": {
       "version": "3.0.0",
-      "from": "lodash._reevaluate@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reevaluate/-/lodash._reevaluate-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._reevaluate/-/lodash._reevaluate-3.0.0.tgz",
+      "integrity": "sha1-WLx0xAZklTrgsSTYBpltrKQx4u0="
     },
     "lodash._reinterpolate": {
       "version": "3.0.0",
-      "from": "lodash._reinterpolate@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz",
+      "integrity": "sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0="
     },
     "lodash._reunescapedhtml": {
       "version": "2.4.1",
-      "from": "lodash._reunescapedhtml@>=2.4.1 <2.5.0",
       "resolved": "https://registry.npmjs.org/lodash._reunescapedhtml/-/lodash._reunescapedhtml-2.4.1.tgz",
+      "integrity": "sha1-dHxPxAED6zu4oJduVx96JlnpO6c=",
       "dependencies": {
         "lodash.keys": {
           "version": "2.4.1",
-          "from": "lodash.keys@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz",
+          "integrity": "sha1-SN6kbfj/djKxDXBrissmWR4rNyc="
         }
       }
     },
     "lodash._root": {
       "version": "3.0.1",
-      "from": "lodash._root@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._root/-/lodash._root-3.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._root/-/lodash._root-3.0.1.tgz",
+      "integrity": "sha1-+6HEUkwZ7ppfgTa0YJ8BfPTe1pI="
     },
     "lodash._shimkeys": {
       "version": "2.4.1",
-      "from": "lodash._shimkeys@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash._shimkeys/-/lodash._shimkeys-2.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._shimkeys/-/lodash._shimkeys-2.4.1.tgz",
+      "integrity": "sha1-bpzJZm/wgfC1psl4uD4kLmlJ0gM="
     },
     "lodash._stack": {
       "version": "4.1.3",
-      "from": "lodash._stack@>=4.1.0 <4.2.0",
-      "resolved": "https://registry.npmjs.org/lodash._stack/-/lodash._stack-4.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/lodash._stack/-/lodash._stack-4.1.3.tgz",
+      "integrity": "sha1-dRqnbBuWSwR+dtFPxyoJP8teLdA="
     },
     "lodash.assign": {
       "version": "4.2.0",
-      "from": "lodash.assign@>=4.0.3 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.assign/-/lodash.assign-4.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.assign/-/lodash.assign-4.2.0.tgz",
+      "integrity": "sha1-DZnzzNem0mHRm9rrkkUAXShYCOc="
     },
     "lodash.assignin": {
       "version": "4.2.0",
-      "from": "lodash.assignin@>=4.0.9 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.assignin/-/lodash.assignin-4.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.assignin/-/lodash.assignin-4.2.0.tgz",
+      "integrity": "sha1-uo31+4QesKPoBEIysOJjqNxqKKI="
     },
     "lodash.assignwith": {
       "version": "4.2.0",
-      "from": "lodash.assignwith@>=4.0.7 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.assignwith/-/lodash.assignwith-4.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.assignwith/-/lodash.assignwith-4.2.0.tgz",
+      "integrity": "sha1-EnqX8CrcQXUalU0ksN4X4QDgOOs="
     },
     "lodash.bind": {
       "version": "4.2.1",
-      "from": "lodash.bind@>=4.1.4 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.bind/-/lodash.bind-4.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.bind/-/lodash.bind-4.2.1.tgz",
+      "integrity": "sha1-euMBfpOWIqwxt9fX3LGzTbFpDTU="
     },
     "lodash.camelcase": {
       "version": "3.0.1",
-      "from": "lodash.camelcase@>=3.0.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-3.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-3.0.1.tgz",
+      "integrity": "sha1-kyyLh/ikN3iXxnGXUzKC+Xrqwpg="
     },
     "lodash.clone": {
       "version": "4.5.0",
-      "from": "lodash.clone@>=4.3.2 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.clone/-/lodash.clone-4.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.clone/-/lodash.clone-4.5.0.tgz",
+      "integrity": "sha1-GVhwRQ9aExkkeN9Lw9I9LeoZB7Y="
     },
     "lodash.clonedeep": {
       "version": "4.5.0",
-      "from": "lodash.clonedeep@>=4.3.2 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz",
+      "integrity": "sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8="
     },
     "lodash.create": {
       "version": "3.1.1",
-      "from": "lodash.create@3.1.1",
-      "resolved": "https://registry.npmjs.org/lodash.create/-/lodash.create-3.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.create/-/lodash.create-3.1.1.tgz",
+      "integrity": "sha1-1/KEnw29p+BGgruM1yqwIkYd6+c="
     },
     "lodash.deburr": {
       "version": "3.2.0",
-      "from": "lodash.deburr@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.deburr/-/lodash.deburr-3.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.deburr/-/lodash.deburr-3.2.0.tgz",
+      "integrity": "sha1-baj1QzSjZqfPTEx2742Aqhs2XtU="
     },
     "lodash.defaults": {
       "version": "2.4.1",
-      "from": "lodash.defaults@>=2.4.1 <2.5.0",
       "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-2.4.1.tgz",
+      "integrity": "sha1-p+iIXwXmiFEUS24SqPNngCa8TFQ=",
       "dependencies": {
         "lodash.keys": {
           "version": "2.4.1",
-          "from": "lodash.keys@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz",
+          "integrity": "sha1-SN6kbfj/djKxDXBrissmWR4rNyc="
         }
       }
     },
     "lodash.escape": {
       "version": "3.2.0",
-      "from": "lodash.escape@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-3.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-3.2.0.tgz",
+      "integrity": "sha1-mV7g3BjBtIzJLv+ucaEKq1tIdpg="
     },
     "lodash.filter": {
       "version": "4.6.0",
-      "from": "lodash.filter@>=4.4.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.filter/-/lodash.filter-4.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.filter/-/lodash.filter-4.6.0.tgz",
+      "integrity": "sha1-ZosdSYFgOuHMWm+nYBQ+SAtMSs4="
     },
     "lodash.flatten": {
       "version": "4.4.0",
-      "from": "lodash.flatten@>=4.2.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.flatten/-/lodash.flatten-4.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.flatten/-/lodash.flatten-4.4.0.tgz",
+      "integrity": "sha1-8xwiIlqWMtK7+OSt2+8kCqdlph8="
     },
     "lodash.foreach": {
       "version": "4.5.0",
-      "from": "lodash.foreach@>=4.3.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.foreach/-/lodash.foreach-4.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.foreach/-/lodash.foreach-4.5.0.tgz",
+      "integrity": "sha1-Gmo16s5AEoDH8G3d7DUWWrJ+PlM="
     },
     "lodash.get": {
       "version": "4.4.2",
-      "from": "lodash.get@>=4.1.2 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
+      "integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk="
     },
     "lodash.isarguments": {
       "version": "3.1.0",
-      "from": "lodash.isarguments@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz",
+      "integrity": "sha1-L1c9hcaiQon/AGY7SRwdM4/zRYo="
     },
     "lodash.isarray": {
       "version": "3.0.4",
-      "from": "lodash.isarray@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz",
+      "integrity": "sha1-eeTriMNqgSKvhvhEqpvNhRtfu1U="
     },
     "lodash.isempty": {
       "version": "4.4.0",
-      "from": "lodash.isempty@>=4.2.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.isempty/-/lodash.isempty-4.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.isempty/-/lodash.isempty-4.4.0.tgz",
+      "integrity": "sha1-b4bL7di+TsmHvpqvM8loTbGzHn4="
     },
     "lodash.isequal": {
       "version": "4.5.0",
-      "from": "lodash.isequal@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
+      "integrity": "sha1-QVxEePK8wwEgwizhDtMib30+GOA="
     },
     "lodash.isobject": {
       "version": "2.4.1",
-      "from": "lodash.isobject@>=2.4.1 <2.5.0",
-      "resolved": "https://registry.npmjs.org/lodash.isobject/-/lodash.isobject-2.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.isobject/-/lodash.isobject-2.4.1.tgz",
+      "integrity": "sha1-Wi5H/mmVPx7mMafrof5k0tBlWPU="
     },
     "lodash.isplainobject": {
       "version": "4.0.6",
-      "from": "lodash.isplainobject@>=4.0.4 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
+      "integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs="
     },
     "lodash.isstring": {
       "version": "4.0.1",
-      "from": "lodash.isstring@>=4.0.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.isstring/-/lodash.isstring-4.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.isstring/-/lodash.isstring-4.0.1.tgz",
+      "integrity": "sha1-1SfftUVuynzJu5XV2ur4i6VKVFE="
     },
     "lodash.keys": {
       "version": "3.1.2",
-      "from": "lodash.keys@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz",
+      "integrity": "sha1-TbwEcrFWvlCgsoaFXRvQsMZWCYo="
     },
     "lodash.keysin": {
       "version": "4.2.0",
-      "from": "lodash.keysin@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.keysin/-/lodash.keysin-4.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.keysin/-/lodash.keysin-4.2.0.tgz",
+      "integrity": "sha1-jMP7NcLZSsxEOhhj4C+kB5nqbyg="
     },
     "lodash.map": {
       "version": "4.6.0",
-      "from": "lodash.map@>=4.4.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.map/-/lodash.map-4.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.map/-/lodash.map-4.6.0.tgz",
+      "integrity": "sha1-dx7Hg540c9nEzeKLGTlMNWL09tM="
     },
     "lodash.mapvalues": {
       "version": "4.6.0",
-      "from": "lodash.mapvalues@>=4.4.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.mapvalues/-/lodash.mapvalues-4.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.mapvalues/-/lodash.mapvalues-4.6.0.tgz",
+      "integrity": "sha1-G6+lAF3p3W9PJmaMMMo3IwzJaJw="
     },
     "lodash.memoize": {
       "version": "4.1.2",
-      "from": "lodash.memoize@>=4.1.2 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz",
+      "integrity": "sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4="
     },
     "lodash.merge": {
       "version": "4.3.5",
-      "from": "lodash.merge@>=4.3.2 <4.4.0",
-      "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.3.5.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.3.5.tgz",
+      "integrity": "sha1-VOWMTyCD2f7MsVeaYPdLCT1yrRc="
     },
     "lodash.mergewith": {
       "version": "4.6.0",
-      "from": "lodash.mergewith@>=4.6.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.mergewith/-/lodash.mergewith-4.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.mergewith/-/lodash.mergewith-4.6.0.tgz",
+      "integrity": "sha1-FQzwoWeR9ZA7iJHqsVRgknS96lU="
     },
     "lodash.pick": {
       "version": "4.4.0",
-      "from": "lodash.pick@>=4.2.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz",
+      "integrity": "sha1-UvBWEP/53tQiYRRB7R/BI6AwAbM="
     },
     "lodash.reduce": {
       "version": "4.6.0",
-      "from": "lodash.reduce@>=4.4.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.reduce/-/lodash.reduce-4.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.reduce/-/lodash.reduce-4.6.0.tgz",
+      "integrity": "sha1-8atrg5KZrUj3hKu/R2WW8DuRTTs="
     },
     "lodash.reject": {
       "version": "4.6.0",
-      "from": "lodash.reject@>=4.4.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.reject/-/lodash.reject-4.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.reject/-/lodash.reject-4.6.0.tgz",
+      "integrity": "sha1-gNZJLcFHCGS79YNTO2UfQqn1JBU="
     },
     "lodash.rest": {
       "version": "4.0.5",
-      "from": "lodash.rest@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.rest/-/lodash.rest-4.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.rest/-/lodash.rest-4.0.5.tgz",
+      "integrity": "sha1-lU73UEkmIDjJbR/Jiyj9r58Hcqo="
     },
     "lodash.restparam": {
       "version": "3.6.1",
-      "from": "lodash.restparam@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.restparam/-/lodash.restparam-3.6.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.restparam/-/lodash.restparam-3.6.1.tgz",
+      "integrity": "sha1-k2pOMJ7zMKdkXtQUWYbIWuWyCAU="
     },
     "lodash.some": {
       "version": "4.6.0",
-      "from": "lodash.some@>=4.2.2 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.some/-/lodash.some-4.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.some/-/lodash.some-4.6.0.tgz",
+      "integrity": "sha1-G7nzFO9ri63tE7VJFpsqlF62jk0="
     },
     "lodash.tail": {
       "version": "4.1.1",
-      "from": "lodash.tail@>=4.1.1 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.tail/-/lodash.tail-4.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.tail/-/lodash.tail-4.1.1.tgz",
+      "integrity": "sha1-0jM6NtnncXyK0vfKyv7HwytERmQ="
     },
     "lodash.template": {
       "version": "3.6.2",
-      "from": "lodash.template@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-3.6.2.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-3.6.2.tgz",
+      "integrity": "sha1-+M3sxhaaJVvpCYrosMU9N4kx0U8="
     },
     "lodash.templatesettings": {
       "version": "3.1.1",
-      "from": "lodash.templatesettings@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-3.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-3.1.1.tgz",
+      "integrity": "sha1-+zB4RHU7Zrnxr6VOJix0UwfbqOU="
     },
     "lodash.uniq": {
       "version": "4.5.0",
-      "from": "lodash.uniq@>=4.5.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz",
+      "integrity": "sha1-0CJTc662Uq3BvILklFM5qEJ1R3M="
     },
     "lodash.values": {
       "version": "2.4.1",
-      "from": "lodash.values@>=2.4.1 <2.5.0",
       "resolved": "https://registry.npmjs.org/lodash.values/-/lodash.values-2.4.1.tgz",
+      "integrity": "sha1-q/UUQ2s8twUAFieXjLzzCxKA7qQ=",
       "dependencies": {
         "lodash.keys": {
           "version": "2.4.1",
-          "from": "lodash.keys@>=2.4.1 <2.5.0",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz",
+          "integrity": "sha1-SN6kbfj/djKxDXBrissmWR4rNyc="
         }
       }
     },
     "lodash.words": {
       "version": "3.2.0",
-      "from": "lodash.words@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/lodash.words/-/lodash.words-3.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/lodash.words/-/lodash.words-3.2.0.tgz",
+      "integrity": "sha1-TiqGSbwIdFsXxpWxo86P7llmI7M="
     },
     "log-symbols": {
       "version": "1.0.2",
-      "from": "log-symbols@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-1.0.2.tgz",
+      "integrity": "sha1-N2/3tY6jCGoPCfrMdGF+ylAeGhg="
     },
     "log4js": {
       "version": "0.6.38",
-      "from": "log4js@>=0.6.31 <0.7.0",
       "resolved": "https://registry.npmjs.org/log4js/-/log4js-0.6.38.tgz",
+      "integrity": "sha1-LElBFmldb7JUgJQ9P8hy5mKlIv0=",
       "dependencies": {
         "readable-stream": {
           "version": "1.0.34",
-          "from": "readable-stream@>=1.0.2 <1.1.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
         },
         "semver": {
           "version": "4.3.6",
-          "from": "semver@>=4.3.3 <4.4.0",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz"
+          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz",
+          "integrity": "sha1-MAvG4OhjdPe6YQaLWx7NV/xlMto="
         }
       }
     },
     "lolex": {
       "version": "1.4.0",
-      "from": "lolex@>=1.4.0 <1.5.0",
-      "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.4.0.tgz",
+      "integrity": "sha1-LycSsbwYDendzF06epbvPAuxYq0="
     },
     "longest": {
       "version": "1.0.1",
-      "from": "longest@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/longest/-/longest-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/longest/-/longest-1.0.1.tgz",
+      "integrity": "sha1-MKCy2jj3N3DoKUoNIuZiXtd9AJc="
     },
     "loose-envify": {
       "version": "1.3.1",
-      "from": "loose-envify@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.3.1.tgz"
+      "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.3.1.tgz",
+      "integrity": "sha1-0aitM/qc4OcT1l/dCsi3SNR4yEg="
     },
     "loud-rejection": {
       "version": "1.6.0",
-      "from": "loud-rejection@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/loud-rejection/-/loud-rejection-1.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/loud-rejection/-/loud-rejection-1.6.0.tgz",
+      "integrity": "sha1-W0b4AUft7leIcPCG0Eghz5mOVR8="
     },
     "lower-case": {
       "version": "1.1.4",
-      "from": "lower-case@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-1.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-1.1.4.tgz",
+      "integrity": "sha1-miyr0bno4K6ZOkv31YdcOcQujqw="
     },
     "lowercase-keys": {
       "version": "1.0.0",
-      "from": "lowercase-keys@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.0.tgz",
+      "integrity": "sha1-TjNms55/VFfjXxMkvfb4jQv8cwY="
     },
     "lru-cache": {
       "version": "2.7.3",
-      "from": "lru-cache@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.7.3.tgz"
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.7.3.tgz",
+      "integrity": "sha1-bUUk6LlV+V1PW1iFHOId1y+06VI="
     },
     "macaddress": {
       "version": "0.2.8",
-      "from": "macaddress@>=0.2.8 <0.3.0",
-      "resolved": "https://registry.npmjs.org/macaddress/-/macaddress-0.2.8.tgz"
+      "resolved": "https://registry.npmjs.org/macaddress/-/macaddress-0.2.8.tgz",
+      "integrity": "sha1-WQTcU3w57G2+/q6QIycTX6hRHxI="
     },
     "make-dir": {
       "version": "1.0.0",
-      "from": "make-dir@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-1.0.0.tgz",
+      "integrity": "sha1-l6ARdR6R3YfPre9Ygy67BJNt6Xg="
     },
     "map-cache": {
       "version": "0.2.2",
-      "from": "map-cache@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz",
+      "integrity": "sha1-wyq9C9ZSXZsFFkW7TyasXcmKDb8="
     },
     "map-obj": {
       "version": "1.0.1",
-      "from": "map-obj@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/map-obj/-/map-obj-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/map-obj/-/map-obj-1.0.1.tgz",
+      "integrity": "sha1-2TPOuSBdgr3PSIb2dCvcK03qFG0="
     },
     "map-stream": {
       "version": "0.0.7",
-      "from": "map-stream@>=0.0.3 <0.1.0",
-      "resolved": "https://registry.npmjs.org/map-stream/-/map-stream-0.0.7.tgz"
+      "resolved": "https://registry.npmjs.org/map-stream/-/map-stream-0.0.7.tgz",
+      "integrity": "sha1-ih8HiW2CsQkmvTdEokIACfiJdKg="
     },
     "marked": {
       "version": "0.3.6",
-      "from": "marked@>=0.3.6 <0.4.0",
-      "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.6.tgz"
+      "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.6.tgz",
+      "integrity": "sha1-ssbGGPzOzk74bE/Gy4p8v1rtqNc="
     },
     "marked-terminal": {
       "version": "1.7.0",
-      "from": "marked-terminal@>=1.6.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/marked-terminal/-/marked-terminal-1.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/marked-terminal/-/marked-terminal-1.7.0.tgz",
+      "integrity": "sha1-yMRgiBx3LHYEtkNnAH7l938SWQQ="
     },
     "math-expression-evaluator": {
       "version": "1.2.17",
-      "from": "math-expression-evaluator@>=1.2.14 <2.0.0",
-      "resolved": "https://registry.npmjs.org/math-expression-evaluator/-/math-expression-evaluator-1.2.17.tgz"
+      "resolved": "https://registry.npmjs.org/math-expression-evaluator/-/math-expression-evaluator-1.2.17.tgz",
+      "integrity": "sha1-3oGf282E3M2PrlnGrreWFbnSZqw="
     },
     "md5": {
       "version": "2.2.1",
-      "from": "md5@>=2.2.1 <2.3.0",
-      "resolved": "https://registry.npmjs.org/md5/-/md5-2.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/md5/-/md5-2.2.1.tgz",
+      "integrity": "sha1-U6s41f48iJG6RlMp6iP6wFQBJvk="
     },
     "media-typer": {
       "version": "0.3.0",
-      "from": "media-typer@0.3.0",
-      "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
+      "integrity": "sha1-hxDXrwqmJvj/+hzgAWhUUmMlV0g="
     },
     "memory-fs": {
       "version": "0.4.1",
-      "from": "memory-fs@>=0.4.1 <0.5.0",
       "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.4.1.tgz",
+      "integrity": "sha1-OpoguEYlI+RHz7x+i7gO1me/xVI=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "meow": {
       "version": "3.7.0",
-      "from": "meow@>=3.3.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/meow/-/meow-3.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/meow/-/meow-3.7.0.tgz",
+      "integrity": "sha1-cstmi0JSKCkKu/qFaJJYcwioAfs="
     },
     "merge-descriptors": {
       "version": "1.0.1",
-      "from": "merge-descriptors@1.0.1",
-      "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.1.tgz",
+      "integrity": "sha1-sAqqVW3YtEVoFQ7J0blT8/kMu2E="
     },
     "merge-stream": {
       "version": "1.0.1",
-      "from": "merge-stream@>=1.0.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-1.0.1.tgz",
+      "integrity": "sha1-QEEgLVCKNCugAXQAjfDCUbjBNeE=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "merge2": {
       "version": "1.0.3",
-      "from": "merge2@>=1.0.2 <1.1.0",
-      "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.0.3.tgz",
+      "integrity": "sha1-+kT4siYmFaty8ICKQB1HinDjlNs="
     },
     "method-override": {
       "version": "2.3.9",
-      "from": "method-override@>=2.3.5 <2.4.0",
       "resolved": "https://registry.npmjs.org/method-override/-/method-override-2.3.9.tgz",
+      "integrity": "sha1-vRUfLONM8Bp2ykAKuVwBKxAtj3E=",
       "dependencies": {
         "debug": {
           "version": "2.6.8",
-          "from": "debug@2.6.8",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
+          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
         }
       }
     },
     "methods": {
       "version": "1.1.2",
-      "from": "methods@>=1.1.2 <1.2.0",
-      "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz",
+      "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4="
     },
     "micromatch": {
       "version": "2.3.11",
-      "from": "micromatch@>=2.3.7 <3.0.0",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz"
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
+      "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
     },
     "miller-rabin": {
       "version": "4.0.0",
-      "from": "miller-rabin@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/miller-rabin/-/miller-rabin-4.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/miller-rabin/-/miller-rabin-4.0.0.tgz",
+      "integrity": "sha1-SmL7HUKTPAVYOYL0xxb2+55sbT0="
     },
     "mime": {
       "version": "1.3.6",
-      "from": "mime@>=1.3.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.6.tgz"
+      "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.6.tgz",
+      "integrity": "sha1-WR2E02U6awtKO5343lqoEI5y5eA="
     },
     "mime-db": {
       "version": "1.27.0",
-      "from": "mime-db@>=1.27.0 <1.28.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.27.0.tgz"
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.27.0.tgz",
+      "integrity": "sha1-gg9XIpa70g7CXtVeW13oaeVDbrE="
     },
     "mime-types": {
       "version": "2.1.15",
-      "from": "mime-types@>=2.1.7 <2.2.0",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.15.tgz"
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.15.tgz",
+      "integrity": "sha1-pOv1BkCUVpI3uM9wBGd20J/JKu0="
     },
     "minimalistic-assert": {
       "version": "1.0.0",
-      "from": "minimalistic-assert@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.0.tgz",
+      "integrity": "sha1-cCvi3aazf0g2vLP121ZkG2Sh09M="
     },
     "minimalistic-crypto-utils": {
       "version": "1.0.1",
-      "from": "minimalistic-crypto-utils@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/minimalistic-crypto-utils/-/minimalistic-crypto-utils-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/minimalistic-crypto-utils/-/minimalistic-crypto-utils-1.0.1.tgz",
+      "integrity": "sha1-9sAMHAsIIkblxNmd+4x8CDsrWCo="
     },
     "minimatch": {
       "version": "3.0.4",
-      "from": "minimatch@>=3.0.4 <4.0.0",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
+      "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA=="
     },
     "minimist": {
       "version": "1.2.0",
-      "from": "minimist@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
+      "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
     },
     "mixin-object": {
       "version": "2.0.1",
-      "from": "mixin-object@>=2.0.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/mixin-object/-/mixin-object-2.0.1.tgz",
+      "integrity": "sha1-T7lJRB2rGCVA8f4DW6YOGUel5X4=",
       "dependencies": {
         "for-in": {
           "version": "0.1.8",
-          "from": "for-in@>=0.1.3 <0.2.0",
-          "resolved": "https://registry.npmjs.org/for-in/-/for-in-0.1.8.tgz"
+          "resolved": "https://registry.npmjs.org/for-in/-/for-in-0.1.8.tgz",
+          "integrity": "sha1-2Hc5COMSVhCZUrH9ubP6hn0ndeE="
         }
       }
     },
     "mkdirp": {
       "version": "0.5.1",
-      "from": "mkdirp@>=0.5.1 <0.6.0",
       "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
+      "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
       "dependencies": {
         "minimist": {
           "version": "0.0.8",
-          "from": "minimist@0.0.8",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz"
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
+          "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0="
         }
       }
     },
     "mocha": {
       "version": "2.5.3",
-      "from": "mocha@>=2.5.3 <2.6.0",
       "resolved": "https://registry.npmjs.org/mocha/-/mocha-2.5.3.tgz",
+      "integrity": "sha1-FhvlvetJZ3HrmzV0UFC2IrWu/Fg=",
       "dependencies": {
         "commander": {
           "version": "2.3.0",
-          "from": "commander@2.3.0",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-2.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/commander/-/commander-2.3.0.tgz",
+          "integrity": "sha1-/UMOiJgy7DU7ms0d4hfBHLPu+HM="
         },
         "debug": {
           "version": "2.2.0",
-          "from": "debug@2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "diff": {
           "version": "1.4.0",
-          "from": "diff@1.4.0",
-          "resolved": "https://registry.npmjs.org/diff/-/diff-1.4.0.tgz"
+          "resolved": "https://registry.npmjs.org/diff/-/diff-1.4.0.tgz",
+          "integrity": "sha1-fyjS657nsVqX79ic5j3P2qPMur8="
         },
         "escape-string-regexp": {
           "version": "1.0.2",
-          "from": "escape-string-regexp@1.0.2",
-          "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.2.tgz",
+          "integrity": "sha1-Tbwv5nTnGUnK8/smlc5/LcHZqNE="
         },
         "glob": {
           "version": "3.2.11",
-          "from": "glob@3.2.11",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-3.2.11.tgz"
+          "resolved": "https://registry.npmjs.org/glob/-/glob-3.2.11.tgz",
+          "integrity": "sha1-Spc/Y1uRkPcV0QmH1cAP0oFevj0="
         },
         "minimatch": {
           "version": "0.3.0",
-          "from": "minimatch@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.3.0.tgz",
+          "integrity": "sha1-J12O2qxPG7MyZHIInnlJyDlGmd0="
         },
         "ms": {
           "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         },
         "supports-color": {
           "version": "1.2.0",
-          "from": "supports-color@1.2.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-1.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-1.2.0.tgz",
+          "integrity": "sha1-/x7R5hFp0Gs88tWI4YixjYhH4X4="
         }
       }
     },
     "mocha-clean": {
       "version": "0.4.0",
-      "from": "mocha-clean@>=0.4.0 <0.5.0",
-      "resolved": "https://registry.npmjs.org/mocha-clean/-/mocha-clean-0.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/mocha-clean/-/mocha-clean-0.4.0.tgz",
+      "integrity": "sha1-CbaYXDIYFhQDIeED593ktIdgkhw="
     },
     "mocha-loader": {
       "version": "1.1.1",
-      "from": "mocha-loader@>=1.1.1 <2.0.0",
       "resolved": "https://registry.npmjs.org/mocha-loader/-/mocha-loader-1.1.1.tgz",
+      "integrity": "sha1-Ocm3jErWmrxTPtAuLas5gkTKM6s=",
       "dependencies": {
         "css-loader": {
           "version": "0.23.1",
-          "from": "css-loader@>=0.23.1 <0.24.0",
           "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.23.1.tgz",
+          "integrity": "sha1-n6I/K1wJZSNZEK1ezvO4o2OQ/lA=",
           "dependencies": {
             "loader-utils": {
               "version": "0.2.17",
-              "from": "loader-utils@~0.2.2",
-              "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz"
+              "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz",
+              "integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g="
             }
           }
         },
         "css-selector-tokenizer": {
           "version": "0.5.4",
-          "from": "css-selector-tokenizer@>=0.5.1 <0.6.0",
-          "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.5.4.tgz"
+          "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.5.4.tgz",
+          "integrity": "sha1-E5uv00o1/QwUKEhwSeBpnm9qLCE="
         },
         "loader-utils": {
           "version": "1.1.0",
-          "from": "loader-utils@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
+          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
         },
         "style-loader": {
           "version": "0.13.2",
-          "from": "style-loader@>=0.13.1 <0.14.0",
-          "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.13.2.tgz"
+          "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.13.2.tgz",
+          "integrity": "sha1-dFMzhM9pjHEEx5URULSXF63C87s="
         }
       }
     },
     "morgan": {
       "version": "1.6.1",
-      "from": "morgan@>=1.6.1 <1.7.0",
       "resolved": "https://registry.npmjs.org/morgan/-/morgan-1.6.1.tgz",
+      "integrity": "sha1-X9gYOYxoGcuiinzWZk8pL+HAu/I=",
       "dependencies": {
         "debug": {
           "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "depd": {
           "version": "1.0.1",
-          "from": "depd@>=1.0.1 <1.1.0",
-          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz",
+          "integrity": "sha1-gK7GTJ1tl+ZcwqnKqTwKpqv3Oqo="
         },
         "ms": {
           "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         }
       }
     },
     "ms": {
       "version": "2.0.0",
-      "from": "ms@2.0.0",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+      "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
     },
     "multiparty": {
       "version": "3.3.2",
-      "from": "multiparty@3.3.2",
-      "resolved": "https://registry.npmjs.org/multiparty/-/multiparty-3.3.2.tgz"
+      "resolved": "https://registry.npmjs.org/multiparty/-/multiparty-3.3.2.tgz",
+      "integrity": "sha1-Nd5oBNwZZD5SSfPT473GyM4wHT8="
     },
     "multipipe": {
       "version": "0.1.2",
-      "from": "multipipe@>=0.1.2 <0.2.0",
-      "resolved": "https://registry.npmjs.org/multipipe/-/multipipe-0.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/multipipe/-/multipipe-0.1.2.tgz",
+      "integrity": "sha1-Ko8t33Du1WTf8tV/HhoTfZ8FB4s="
     },
     "mute-stream": {
       "version": "0.0.7",
-      "from": "mute-stream@>=0.0.4 <0.1.0",
-      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.7.tgz"
+      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.7.tgz",
+      "integrity": "sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s="
     },
     "nan": {
       "version": "2.6.2",
-      "from": "nan@>=2.3.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/nan/-/nan-2.6.2.tgz"
+      "resolved": "https://registry.npmjs.org/nan/-/nan-2.6.2.tgz",
+      "integrity": "sha1-5P805slf37WuzAjeZZb0NgWn20U="
     },
     "native-promise-only": {
       "version": "0.8.1",
-      "from": "native-promise-only@>=0.8.1 <0.9.0",
-      "resolved": "https://registry.npmjs.org/native-promise-only/-/native-promise-only-0.8.1.tgz"
+      "resolved": "https://registry.npmjs.org/native-promise-only/-/native-promise-only-0.8.1.tgz",
+      "integrity": "sha1-IKMYwwy0X3H+et+/eyHJnBRy7xE="
     },
     "natives": {
       "version": "1.1.0",
-      "from": "natives@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/natives/-/natives-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/natives/-/natives-1.1.0.tgz",
+      "integrity": "sha1-6f+EFBimsux6SV6TmYT3jxY+bjE="
     },
     "ncname": {
       "version": "1.0.0",
-      "from": "ncname@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/ncname/-/ncname-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/ncname/-/ncname-1.0.0.tgz",
+      "integrity": "sha1-W1etGLHKCShk72Kwse2BlPODtxw="
     },
     "negotiator": {
       "version": "0.6.1",
-      "from": "negotiator@0.6.1",
-      "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.1.tgz"
+      "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.1.tgz",
+      "integrity": "sha1-KzJxhOiZIQEXeyhWP7XnECrNDKk="
     },
     "no-case": {
       "version": "2.3.1",
-      "from": "no-case@>=2.2.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/no-case/-/no-case-2.3.1.tgz"
+      "resolved": "https://registry.npmjs.org/no-case/-/no-case-2.3.1.tgz",
+      "integrity": "sha1-euuhxzpSGEJlVUt9wDuvcg34AIE="
     },
     "node-emoji": {
       "version": "1.5.1",
-      "from": "node-emoji@>=1.4.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/node-emoji/-/node-emoji-1.5.1.tgz"
+      "resolved": "https://registry.npmjs.org/node-emoji/-/node-emoji-1.5.1.tgz",
+      "integrity": "sha1-/ZGOQSdpv4xEgFEjgjOECyr/FqE="
     },
     "node-fetch": {
       "version": "1.7.0",
-      "from": "node-fetch@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.0.tgz",
+      "integrity": "sha1-P/bFZUT5t/sAaCM4u1Xub1SooO8="
     },
     "node-forge": {
       "version": "0.7.1",
-      "from": "node-forge@>=0.7.1 <0.8.0",
-      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.7.1.tgz"
+      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.7.1.tgz",
+      "integrity": "sha1-naYR6giYL0uUIGs760zJZl8gwwA="
     },
     "node-gyp": {
       "version": "3.6.1",
-      "from": "node-gyp@>=3.3.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-3.6.1.tgz"
+      "resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-3.6.1.tgz",
+      "integrity": "sha1-GVYQZ/8YVGSt7UeCEmgfR/1XjLw="
     },
     "node-libs-browser": {
       "version": "0.6.0",
-      "from": "node-libs-browser@>=0.6.0 <0.7.0",
-      "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-0.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-0.6.0.tgz",
+      "integrity": "sha1-JEgG1E0xngSLyGB7XMTq+aKdLjw="
     },
     "node-notifier": {
       "version": "5.0.2",
-      "from": "node-notifier@>=5.0.2 <5.1.0",
-      "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-5.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-5.0.2.tgz",
+      "integrity": "sha1-RDhEn+aeMh+UHO+UOYaweXAycBs="
     },
     "node-sass": {
       "version": "4.5.3",
-      "from": "node-sass@>=4.5.0 <5.0.0",
       "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.5.3.tgz",
+      "integrity": "sha1-0JydEXlkEjnRuX/8YjH9zsU+FWg=",
       "dependencies": {
         "gaze": {
           "version": "1.1.2",
-          "from": "gaze@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz"
+          "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz",
+          "integrity": "sha1-hHIkZ3rbiHDWeSV+0ziP22HkAQU="
         },
         "globule": {
           "version": "1.1.0",
-          "from": "globule@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/globule/-/globule-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/globule/-/globule-1.1.0.tgz",
+          "integrity": "sha1-xJNS5NwYPYWJPuglOF65lLtt9F8="
         },
         "lodash": {
           "version": "4.16.6",
-          "from": "lodash@>=4.16.4 <4.17.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.16.6.tgz"
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.16.6.tgz",
+          "integrity": "sha1-0iyaxmAojzhD4Wun0rXQbMon13c="
         }
       }
     },
     "node-status-codes": {
       "version": "1.0.0",
-      "from": "node-status-codes@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/node-status-codes/-/node-status-codes-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/node-status-codes/-/node-status-codes-1.0.0.tgz",
+      "integrity": "sha1-WuVUHQJGRdMqWPzdyc7s6nrjrC8="
     },
     "node-zip": {
       "version": "1.1.1",
-      "from": "node-zip@>=1.1.1 <1.2.0",
-      "resolved": "https://registry.npmjs.org/node-zip/-/node-zip-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/node-zip/-/node-zip-1.1.1.tgz",
+      "integrity": "sha1-lNGtZ0o81GoViN1zb0qaeMdX62I="
     },
     "node.extend": {
       "version": "1.1.6",
-      "from": "node.extend@>=1.0.10 <2.0.0",
-      "resolved": "https://registry.npmjs.org/node.extend/-/node.extend-1.1.6.tgz"
+      "resolved": "https://registry.npmjs.org/node.extend/-/node.extend-1.1.6.tgz",
+      "integrity": "sha1-p7iCyC1sk6SGOlUEvV3o7IYli5Y="
     },
     "nopt": {
       "version": "3.0.6",
-      "from": "nopt@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/nopt/-/nopt-3.0.6.tgz"
+      "resolved": "https://registry.npmjs.org/nopt/-/nopt-3.0.6.tgz",
+      "integrity": "sha1-xkZdvwirzU2zWTF/eaxopkayj/k="
     },
     "normalize-package-data": {
       "version": "2.3.8",
-      "from": "normalize-package-data@>=2.3.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.3.8.tgz"
+      "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.3.8.tgz",
+      "integrity": "sha1-2Bntoqne29H/pWPqQHHZNngilbs="
     },
     "normalize-path": {
       "version": "2.1.1",
-      "from": "normalize-path@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-2.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-2.1.1.tgz",
+      "integrity": "sha1-GrKLVW4Zg2Oowab35vogE3/mrtk="
     },
     "normalize-range": {
       "version": "0.1.2",
-      "from": "normalize-range@>=0.1.2 <0.2.0",
-      "resolved": "https://registry.npmjs.org/normalize-range/-/normalize-range-0.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/normalize-range/-/normalize-range-0.1.2.tgz",
+      "integrity": "sha1-LRDAa9/TEuqXd2laTShDlFa3WUI="
     },
     "normalize-url": {
       "version": "1.9.1",
-      "from": "normalize-url@>=1.4.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/normalize-url/-/normalize-url-1.9.1.tgz"
+      "resolved": "https://registry.npmjs.org/normalize-url/-/normalize-url-1.9.1.tgz",
+      "integrity": "sha1-LMDWazHqIwNkWENuNiDYWVTGbDw="
     },
     "npm-run-path": {
       "version": "1.0.0",
-      "from": "npm-run-path@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-1.0.0.tgz",
+      "integrity": "sha1-9cMr9ZX+ga6Sfa7FLoL4sACsPI8="
     },
     "npmlog": {
       "version": "4.1.0",
-      "from": "npmlog@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.0.tgz",
+      "integrity": "sha512-ocolIkZYZt8UveuiDS0yAkkIjid1o7lPG8cYm05yNYzBn8ykQtaiPMEGp8fY9tKdDgm8okpdKzkvu1y9hUYugA=="
     },
     "nth-check": {
       "version": "1.0.1",
-      "from": "nth-check@>=1.0.1 <1.1.0",
-      "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-1.0.1.tgz",
+      "integrity": "sha1-mSms32KPwsQQmN6rgqxYDPFJquQ="
     },
     "num2fraction": {
       "version": "1.2.2",
-      "from": "num2fraction@>=1.2.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/num2fraction/-/num2fraction-1.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/num2fraction/-/num2fraction-1.2.2.tgz",
+      "integrity": "sha1-b2gragJ6Tp3fpFZM0lidHU5mnt4="
     },
     "number-is-nan": {
       "version": "1.0.1",
-      "from": "number-is-nan@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz",
+      "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0="
     },
     "oauth-sign": {
       "version": "0.8.2",
-      "from": "oauth-sign@>=0.8.1 <0.9.0",
-      "resolved": "https://registry.npmjs.org/oauth-sign/-/oauth-sign-0.8.2.tgz"
+      "resolved": "https://registry.npmjs.org/oauth-sign/-/oauth-sign-0.8.2.tgz",
+      "integrity": "sha1-Rqarfwrq2N6unsBWV4C31O/rnUM="
     },
     "object-assign": {
       "version": "4.1.1",
-      "from": "object-assign@>=4.1.0 <4.2.0",
-      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
+      "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM="
     },
     "object-component": {
       "version": "0.0.3",
-      "from": "object-component@0.0.3",
-      "resolved": "https://registry.npmjs.org/object-component/-/object-component-0.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/object-component/-/object-component-0.0.3.tgz",
+      "integrity": "sha1-8MaapQ78lbhmwYb0AKM3acsvEpE="
     },
     "object-is": {
       "version": "1.0.1",
-      "from": "object-is@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.0.1.tgz",
+      "integrity": "sha1-CqYOyZiaCz7Xlc9NBvYs8a1lObY="
     },
     "object-keys": {
       "version": "0.4.0",
-      "from": "object-keys@>=0.4.0 <0.5.0",
-      "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-0.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-0.4.0.tgz",
+      "integrity": "sha1-KKaq50KN0sOpLz2V8hM13SBOAzY="
     },
     "object.assign": {
       "version": "4.0.4",
-      "from": "object.assign@>=4.0.4 <5.0.0",
       "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.0.4.tgz",
+      "integrity": "sha1-scnMBE7xuf5jYG/BQau7MuFHMMw=",
       "dependencies": {
         "object-keys": {
           "version": "1.0.11",
-          "from": "object-keys@>=1.0.10 <2.0.0",
-          "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.0.11.tgz"
+          "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.0.11.tgz",
+          "integrity": "sha1-xUYBd4rVYPEULODgG8yotW0TQm0="
         }
       }
     },
     "object.entries": {
       "version": "1.0.4",
-      "from": "object.entries@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/object.entries/-/object.entries-1.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/object.entries/-/object.entries-1.0.4.tgz",
+      "integrity": "sha1-G/mk3SKI9bM/Opk9JXZh8F0WGl8="
     },
     "object.omit": {
       "version": "2.0.1",
-      "from": "object.omit@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/object.omit/-/object.omit-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/object.omit/-/object.omit-2.0.1.tgz",
+      "integrity": "sha1-Gpx0SCnznbuFjHbKNXmuKlTr0fo="
     },
     "object.pick": {
       "version": "1.2.0",
-      "from": "object.pick@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/object.pick/-/object.pick-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/object.pick/-/object.pick-1.2.0.tgz",
+      "integrity": "sha1-tTkr7peC2m2ft9avr1OXefEjTCs="
     },
     "object.values": {
       "version": "1.0.4",
-      "from": "object.values@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.0.4.tgz",
+      "integrity": "sha1-5STaCbT2b/Bd9FdUbscqyZ8TBpo="
     },
     "obuf": {
       "version": "1.1.1",
-      "from": "obuf@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/obuf/-/obuf-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/obuf/-/obuf-1.1.1.tgz",
+      "integrity": "sha1-EEEktsYCxnlogaBCVB0220OlJk4="
     },
     "office-ui-fabric-core": {
       "version": "7.0.0",
-      "from": "office-ui-fabric-core@>=7.0.0 <8.0.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-7.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-7.0.0.tgz",
+      "integrity": "sha1-5rl2yY1wuKoAvVAGTIgOE3dFiY4="
     },
     "office-ui-fabric-react": {
       "version": "2.34.2",
-      "from": "office-ui-fabric-react@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-2.34.2.tgz"
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-2.34.2.tgz",
+      "integrity": "sha1-+sP1mNQTD3//PprellvW+LOwQ/M="
     },
     "on-finished": {
       "version": "2.3.0",
-      "from": "on-finished@>=2.3.0 <2.4.0",
-      "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz",
+      "integrity": "sha1-IPEzZIGwg811M3mSoWlxqi2QaUc="
     },
     "on-headers": {
       "version": "1.0.1",
-      "from": "on-headers@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/on-headers/-/on-headers-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/on-headers/-/on-headers-1.0.1.tgz",
+      "integrity": "sha1-ko9dD0cNSTQmUepnlLCFfBAGk/c="
     },
     "once": {
       "version": "1.4.0",
-      "from": "once@>=1.3.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
+      "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E="
     },
     "onetime": {
       "version": "1.1.0",
-      "from": "onetime@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/onetime/-/onetime-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/onetime/-/onetime-1.1.0.tgz",
+      "integrity": "sha1-ofeDj4MUxRbwXs78vEzP4EtO14k="
     },
     "open": {
       "version": "0.0.5",
-      "from": "open@0.0.5",
-      "resolved": "https://registry.npmjs.org/open/-/open-0.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/open/-/open-0.0.5.tgz",
+      "integrity": "sha1-QsPhjslUZra/DcQvOilFw/DK2Pw="
     },
     "opener": {
       "version": "1.4.3",
-      "from": "opener@>=1.4.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/opener/-/opener-1.4.3.tgz"
+      "resolved": "https://registry.npmjs.org/opener/-/opener-1.4.3.tgz",
+      "integrity": "sha1-XG2ixdflgx6P+jlklQ+NZnSskLg="
     },
     "opn": {
       "version": "4.0.2",
-      "from": "opn@4.0.2",
-      "resolved": "https://registry.npmjs.org/opn/-/opn-4.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/opn/-/opn-4.0.2.tgz",
+      "integrity": "sha1-erwi5kTf9jsKltWrfyeQwPAavJU="
     },
     "optimist": {
       "version": "0.6.1",
-      "from": "optimist@>=0.6.0 <0.7.0",
       "resolved": "https://registry.npmjs.org/optimist/-/optimist-0.6.1.tgz",
+      "integrity": "sha1-2j6nRob6IaGaERwybpDrFaAZZoY=",
       "dependencies": {
         "minimist": {
           "version": "0.0.10",
-          "from": "minimist@>=0.0.1 <0.1.0",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.10.tgz"
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.10.tgz",
+          "integrity": "sha1-3j+YVD2/lggr5IrRoMfNqDYwHc8="
         }
       }
     },
     "optionator": {
       "version": "0.8.2",
-      "from": "optionator@>=0.8.1 <0.9.0",
       "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.8.2.tgz",
+      "integrity": "sha1-NkxeQJ0/TWMB1sC0wFu6UBgK62Q=",
       "dependencies": {
         "wordwrap": {
           "version": "1.0.0",
-          "from": "wordwrap@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz",
+          "integrity": "sha1-J1hIEIkUVqQXHI0CJkQa3pDLyus="
         }
       }
     },
     "options": {
       "version": "0.0.6",
-      "from": "options@>=0.0.5",
-      "resolved": "https://registry.npmjs.org/options/-/options-0.0.6.tgz"
+      "resolved": "https://registry.npmjs.org/options/-/options-0.0.6.tgz",
+      "integrity": "sha1-7CLTEoBrtT5zF3Pnza788cZDEo8="
     },
     "orchestrator": {
       "version": "0.3.8",
-      "from": "orchestrator@>=0.3.7 <0.4.0",
       "resolved": "https://registry.npmjs.org/orchestrator/-/orchestrator-0.3.8.tgz",
+      "integrity": "sha1-FOfp4nZPcxX7rBhOUGx6pt+UrX4=",
       "dependencies": {
         "end-of-stream": {
           "version": "0.1.5",
-          "from": "end-of-stream@>=0.1.5 <0.2.0",
-          "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-0.1.5.tgz"
+          "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-0.1.5.tgz",
+          "integrity": "sha1-jhdyBsPICDfYVjLouTWd/osvbq8="
         },
         "once": {
           "version": "1.3.3",
-          "from": "once@>=1.3.0 <1.4.0",
-          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz"
+          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz",
+          "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA="
         }
       }
     },
     "ordered-read-streams": {
       "version": "0.1.0",
-      "from": "ordered-read-streams@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.1.0.tgz",
+      "integrity": "sha1-/VZamvjrRHO6abbtijQ1LLVS8SY="
     },
     "original": {
       "version": "1.0.0",
-      "from": "original@>=0.0.5",
       "resolved": "https://registry.npmjs.org/original/-/original-1.0.0.tgz",
+      "integrity": "sha1-kUf5P6FpbQS+YeAb1QuurKZWvTs=",
       "dependencies": {
         "url-parse": {
           "version": "1.0.5",
-          "from": "url-parse@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.0.5.tgz"
+          "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.0.5.tgz",
+          "integrity": "sha1-CFSGBCKv3P7+tsllxmLUgAFpkns="
         }
       }
     },
     "os-browserify": {
       "version": "0.1.2",
-      "from": "os-browserify@>=0.1.2 <0.2.0",
-      "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.1.2.tgz",
+      "integrity": "sha1-ScoCk+CxlZCl9d4Qx/JlphfY/lQ="
     },
     "os-homedir": {
       "version": "1.0.2",
-      "from": "os-homedir@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
+      "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M="
     },
     "os-locale": {
       "version": "1.4.0",
-      "from": "os-locale@>=1.4.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
+      "integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk="
     },
     "os-tmpdir": {
       "version": "1.0.2",
-      "from": "os-tmpdir@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
+      "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ="
     },
     "osenv": {
       "version": "0.1.4",
-      "from": "osenv@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.4.tgz",
+      "integrity": "sha1-Qv5tWVPfBsgGS+bxdsPQWqqjRkQ="
     },
     "package-json": {
       "version": "2.4.0",
-      "from": "package-json@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/package-json/-/package-json-2.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/package-json/-/package-json-2.4.0.tgz",
+      "integrity": "sha1-DRW9Z9HLvduyyiIv8u24a8sxqLs="
     },
     "pako": {
       "version": "0.2.9",
-      "from": "pako@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/pako/-/pako-0.2.9.tgz"
+      "resolved": "https://registry.npmjs.org/pako/-/pako-0.2.9.tgz",
+      "integrity": "sha1-8/dSL073gjSNqBYbrZ7P1Rv4OnU="
     },
     "parallel-transform": {
       "version": "1.1.0",
-      "from": "parallel-transform@>=1.1.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/parallel-transform/-/parallel-transform-1.1.0.tgz",
+      "integrity": "sha1-1BDwZbBdojCB/NEPKIVMKb2jOwY=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.1.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "param-case": {
       "version": "2.1.1",
-      "from": "param-case@>=2.1.0 <2.2.0",
-      "resolved": "https://registry.npmjs.org/param-case/-/param-case-2.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/param-case/-/param-case-2.1.1.tgz",
+      "integrity": "sha1-35T9jPZTHs915r75oIWPvHK+Ikc="
     },
     "parse-asn1": {
       "version": "5.1.0",
-      "from": "parse-asn1@>=5.0.0 <6.0.0",
       "resolved": "https://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.0.tgz",
+      "integrity": "sha1-N8T5t+06tlx0gXtfJICTf7+XxxI=",
       "dependencies": {
         "browserify-aes": {
           "version": "1.0.6",
-          "from": "browserify-aes@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.6.tgz"
+          "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.6.tgz",
+          "integrity": "sha1-Xncl297x/Vkw1OurSFZ85FHEigo="
         }
       }
     },
     "parse-filepath": {
       "version": "1.0.1",
-      "from": "parse-filepath@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/parse-filepath/-/parse-filepath-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/parse-filepath/-/parse-filepath-1.0.1.tgz",
+      "integrity": "sha1-FZ1hVdQ5BNFsEO9piRHaHpGWm3M="
     },
     "parse-glob": {
       "version": "3.0.4",
-      "from": "parse-glob@>=3.0.4 <4.0.0",
-      "resolved": "https://registry.npmjs.org/parse-glob/-/parse-glob-3.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/parse-glob/-/parse-glob-3.0.4.tgz",
+      "integrity": "sha1-ssN2z7EfNVE7rdFz7wu246OIORw="
     },
     "parse-json": {
       "version": "2.2.0",
-      "from": "parse-json@>=2.2.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz",
+      "integrity": "sha1-9ID0BDTvgHQfhGkJn43qGPVaTck="
     },
     "parse-passwd": {
       "version": "1.0.0",
-      "from": "parse-passwd@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/parse-passwd/-/parse-passwd-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/parse-passwd/-/parse-passwd-1.0.0.tgz",
+      "integrity": "sha1-bVuTSkVpk7I9N/QKOC1vFmao5cY="
     },
     "parsejson": {
       "version": "0.0.3",
-      "from": "parsejson@0.0.3",
-      "resolved": "https://registry.npmjs.org/parsejson/-/parsejson-0.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/parsejson/-/parsejson-0.0.3.tgz",
+      "integrity": "sha1-q343WfIJ7OmUN5c/fQ8fZK4OZKs="
     },
     "parseqs": {
       "version": "0.0.5",
-      "from": "parseqs@0.0.5",
-      "resolved": "https://registry.npmjs.org/parseqs/-/parseqs-0.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/parseqs/-/parseqs-0.0.5.tgz",
+      "integrity": "sha1-1SCKNzjkZ2bikbouoXNoSSGouJ0="
     },
     "parseuri": {
       "version": "0.0.5",
-      "from": "parseuri@0.0.5",
-      "resolved": "https://registry.npmjs.org/parseuri/-/parseuri-0.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/parseuri/-/parseuri-0.0.5.tgz",
+      "integrity": "sha1-gCBKUNTbt3m/3G6+J3jZDkvOMgo="
     },
     "parseurl": {
       "version": "1.3.1",
-      "from": "parseurl@>=1.3.1 <1.4.0",
-      "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.1.tgz"
+      "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.1.tgz",
+      "integrity": "sha1-yKuMkiO6NIiKpkopeyiFO+wY2lY="
     },
     "path-browserify": {
       "version": "0.0.0",
-      "from": "path-browserify@0.0.0",
-      "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-0.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-0.0.0.tgz",
+      "integrity": "sha1-oLhwcpquIUAFt9UDLsLLuw+0RRo="
     },
     "path-dirname": {
       "version": "1.0.2",
-      "from": "path-dirname@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/path-dirname/-/path-dirname-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/path-dirname/-/path-dirname-1.0.2.tgz",
+      "integrity": "sha1-zDPSTVJeCZpTiMAzbG4yuRYGCeA="
     },
     "path-exists": {
       "version": "2.1.0",
-      "from": "path-exists@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
+      "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s="
     },
     "path-is-absolute": {
       "version": "1.0.1",
-      "from": "path-is-absolute@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
+      "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18="
     },
     "path-is-inside": {
       "version": "1.0.2",
-      "from": "path-is-inside@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/path-is-inside/-/path-is-inside-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/path-is-inside/-/path-is-inside-1.0.2.tgz",
+      "integrity": "sha1-NlQX3t5EQw0cEa9hAn+s8HS9/FM="
     },
     "path-key": {
       "version": "1.0.0",
-      "from": "path-key@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/path-key/-/path-key-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/path-key/-/path-key-1.0.0.tgz",
+      "integrity": "sha1-XVPVeAGWRsDWiADbThRua9wqx68="
     },
     "path-parse": {
       "version": "1.0.5",
-      "from": "path-parse@>=1.0.5 <2.0.0",
-      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.5.tgz",
+      "integrity": "sha1-PBrfhx6pzWyUMbbqK9dKD/BVxME="
     },
     "path-root": {
       "version": "0.1.1",
-      "from": "path-root@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/path-root/-/path-root-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/path-root/-/path-root-0.1.1.tgz",
+      "integrity": "sha1-mkpoFMrBwM1zNgqV8yCDyOpHRbc="
     },
     "path-root-regex": {
       "version": "0.1.2",
-      "from": "path-root-regex@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/path-root-regex/-/path-root-regex-0.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/path-root-regex/-/path-root-regex-0.1.2.tgz",
+      "integrity": "sha1-v8zcjfWxLcUsi0PsONGNcsBLqW0="
     },
     "path-to-regexp": {
       "version": "0.1.7",
-      "from": "path-to-regexp@0.1.7",
-      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz"
+      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
+      "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
     },
     "path-type": {
       "version": "1.1.0",
-      "from": "path-type@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
+      "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE="
     },
     "pause": {
       "version": "0.1.0",
-      "from": "pause@0.1.0",
-      "resolved": "https://registry.npmjs.org/pause/-/pause-0.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/pause/-/pause-0.1.0.tgz",
+      "integrity": "sha1-68ikqGGf8LioGsFRPDQ0/0af23Q="
     },
     "pause-stream": {
       "version": "0.0.11",
-      "from": "pause-stream@0.0.11",
-      "resolved": "https://registry.npmjs.org/pause-stream/-/pause-stream-0.0.11.tgz"
+      "resolved": "https://registry.npmjs.org/pause-stream/-/pause-stream-0.0.11.tgz",
+      "integrity": "sha1-/lo0sMvOErWqaitAPuLnO2AvFEU="
     },
     "pbkdf2": {
       "version": "3.0.12",
-      "from": "pbkdf2@>=3.0.3 <4.0.0",
       "resolved": "https://registry.npmjs.org/pbkdf2/-/pbkdf2-3.0.12.tgz",
+      "integrity": "sha1-vjZ4XFBn6kjYBv+SMojF91C2uKI=",
       "dependencies": {
         "ripemd160": {
           "version": "2.0.1",
-          "from": "ripemd160@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz",
+          "integrity": "sha1-D0WEKVxTo2KK9+bXmsohzlfRxuc="
         },
         "sha.js": {
           "version": "2.4.8",
-          "from": "sha.js@>=2.4.8 <3.0.0",
-          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz"
+          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz",
+          "integrity": "sha1-NwaMLEdra69ALRSknGf1l5IfY08="
         }
       }
     },
     "pbkdf2-compat": {
       "version": "2.0.1",
-      "from": "pbkdf2-compat@2.0.1",
-      "resolved": "https://registry.npmjs.org/pbkdf2-compat/-/pbkdf2-compat-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/pbkdf2-compat/-/pbkdf2-compat-2.0.1.tgz",
+      "integrity": "sha1-tuDI+plJTZTgURV1gCpZpcFC8og="
     },
     "pend": {
       "version": "1.2.0",
-      "from": "pend@>=1.2.0 <1.3.0",
-      "resolved": "https://registry.npmjs.org/pend/-/pend-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/pend/-/pend-1.2.0.tgz",
+      "integrity": "sha1-elfrVQpng/kRUzH89GY9XI4AelA="
     },
     "performance-now": {
       "version": "0.2.0",
-      "from": "performance-now@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-0.2.0.tgz",
+      "integrity": "sha1-M+8wxcd9TqIcWlOGnZG1bY8lVeU="
     },
     "phantomcss": {
       "version": "1.1.3",
-      "from": "phantomcss@1.1.3",
-      "resolved": "https://registry.npmjs.org/phantomcss/-/phantomcss-1.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/phantomcss/-/phantomcss-1.1.3.tgz",
+      "integrity": "sha1-4+N98YNapNYWcLnyzbiIVipjMMM="
     },
     "phantomjs-polyfill": {
       "version": "0.0.2",
-      "from": "phantomjs-polyfill@>=0.0.2 <0.1.0",
-      "resolved": "https://registry.npmjs.org/phantomjs-polyfill/-/phantomjs-polyfill-0.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/phantomjs-polyfill/-/phantomjs-polyfill-0.0.2.tgz",
+      "integrity": "sha1-jGpxY+m8j9n/2+fWBctTUvn7iR4="
     },
     "phantomjs-prebuilt": {
       "version": "2.1.14",
-      "from": "phantomjs-prebuilt@>=2.1.6 <2.2.0",
       "resolved": "https://registry.npmjs.org/phantomjs-prebuilt/-/phantomjs-prebuilt-2.1.14.tgz",
+      "integrity": "sha1-1T0xH8+30dCN2yQBRVjxGIxRbaA=",
       "dependencies": {
         "caseless": {
           "version": "0.11.0",
-          "from": "caseless@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz"
+          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz",
+          "integrity": "sha1-cVuW6phBWTzDMGeSP17GDr2k99c="
         },
         "es6-promise": {
           "version": "4.0.5",
-          "from": "es6-promise@>=4.0.3 <4.1.0",
-          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.0.5.tgz"
+          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.0.5.tgz",
+          "integrity": "sha1-eILzCt3lskDM+n99eMVIMwlRrkI="
         },
         "fs-extra": {
           "version": "1.0.0",
-          "from": "fs-extra@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-1.0.0.tgz",
+          "integrity": "sha1-zTzl9+fLYUWIP8rjGR6Yd/hYeVA="
         },
         "har-validator": {
           "version": "2.0.6",
-          "from": "har-validator@>=2.0.6 <2.1.0",
-          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz"
+          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz",
+          "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0="
         },
         "qs": {
           "version": "6.3.2",
-          "from": "qs@>=6.3.0 <6.4.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-6.3.2.tgz"
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.3.2.tgz",
+          "integrity": "sha1-51vV9uJoEioqDgvaYwslUMFmUCw="
         },
         "request": {
           "version": "2.79.0",
-          "from": "request@>=2.79.0 <2.80.0",
-          "resolved": "https://registry.npmjs.org/request/-/request-2.79.0.tgz"
+          "resolved": "https://registry.npmjs.org/request/-/request-2.79.0.tgz",
+          "integrity": "sha1-Tf5b9r6LjNw3/Pk+BLZVd3InEN4="
         },
         "tunnel-agent": {
           "version": "0.4.3",
-          "from": "tunnel-agent@>=0.4.1 <0.5.0",
-          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz"
+          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz",
+          "integrity": "sha1-Y3PbdpCf5XDgjXNYM2Xtgop07us="
         }
       }
     },
     "pidof": {
       "version": "1.0.2",
-      "from": "pidof@>=1.0.2 <1.1.0",
-      "resolved": "https://registry.npmjs.org/pidof/-/pidof-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/pidof/-/pidof-1.0.2.tgz",
+      "integrity": "sha1-+6Dq4cgzWhHrgJn10PPvvEXLTpA="
     },
     "pify": {
       "version": "2.3.0",
-      "from": "pify@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+      "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
     },
     "pinkie": {
       "version": "2.0.4",
-      "from": "pinkie@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/pinkie/-/pinkie-2.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/pinkie/-/pinkie-2.0.4.tgz",
+      "integrity": "sha1-clVrgM+g1IqXToDnckjoDtT3+HA="
     },
     "pinkie-promise": {
       "version": "2.0.1",
-      "from": "pinkie-promise@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz",
+      "integrity": "sha1-ITXW36ejWMBprJsXh3YogihFD/o="
     },
     "pkg-conf": {
       "version": "1.1.3",
-      "from": "pkg-conf@>=1.1.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/pkg-conf/-/pkg-conf-1.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/pkg-conf/-/pkg-conf-1.1.3.tgz",
+      "integrity": "sha1-N45W1v0T6Iv7b0ol33qD+qvduls="
     },
     "plur": {
       "version": "2.1.2",
-      "from": "plur@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/plur/-/plur-2.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/plur/-/plur-2.1.2.tgz",
+      "integrity": "sha1-dIJFLBoPUI4+NE6uwxLJHCncZVo="
     },
     "portfinder": {
       "version": "1.0.13",
-      "from": "portfinder@>=1.0.9 <2.0.0",
-      "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.13.tgz"
+      "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.13.tgz",
+      "integrity": "sha1-uzLs2HwnEErm7kS1o8y/Drsa7ek="
     },
     "postcss": {
       "version": "5.2.17",
-      "from": "postcss@>=5.0.21 <6.0.0",
       "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+      "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
       "dependencies": {
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.2.3 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
     "postcss-calc": {
       "version": "5.3.1",
-      "from": "postcss-calc@>=5.2.0 <6.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-5.3.1.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-5.3.1.tgz",
+      "integrity": "sha1-d7rnypKK2FcW4v2kLyYb98HWW14="
     },
     "postcss-colormin": {
       "version": "2.2.2",
-      "from": "postcss-colormin@>=2.1.8 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-colormin/-/postcss-colormin-2.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-colormin/-/postcss-colormin-2.2.2.tgz",
+      "integrity": "sha1-ZjFBfV8OkJo9fsJrJMio0eT5bks="
     },
     "postcss-convert-values": {
       "version": "2.6.1",
-      "from": "postcss-convert-values@>=2.3.4 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-convert-values/-/postcss-convert-values-2.6.1.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-convert-values/-/postcss-convert-values-2.6.1.tgz",
+      "integrity": "sha1-u9hZPFwf0uPRwyK7kl3K6Nrk1i0="
     },
     "postcss-discard-comments": {
       "version": "2.0.4",
-      "from": "postcss-discard-comments@>=2.0.4 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-discard-comments/-/postcss-discard-comments-2.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-discard-comments/-/postcss-discard-comments-2.0.4.tgz",
+      "integrity": "sha1-vv6J+v1bPazlzM5Rt2uBUUvgDj0="
     },
     "postcss-discard-duplicates": {
       "version": "2.1.0",
-      "from": "postcss-discard-duplicates@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-discard-duplicates/-/postcss-discard-duplicates-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-discard-duplicates/-/postcss-discard-duplicates-2.1.0.tgz",
+      "integrity": "sha1-uavye4isGIFYpesSq8riAmO5GTI="
     },
     "postcss-discard-empty": {
       "version": "2.1.0",
-      "from": "postcss-discard-empty@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-discard-empty/-/postcss-discard-empty-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-discard-empty/-/postcss-discard-empty-2.1.0.tgz",
+      "integrity": "sha1-0rS9nVztXr2Nyt52QMfXzX9PkrU="
     },
     "postcss-discard-overridden": {
       "version": "0.1.1",
-      "from": "postcss-discard-overridden@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/postcss-discard-overridden/-/postcss-discard-overridden-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-discard-overridden/-/postcss-discard-overridden-0.1.1.tgz",
+      "integrity": "sha1-ix6vVU9ob7KIzYdMVWZ7CqNmjVg="
     },
     "postcss-discard-unused": {
       "version": "2.2.3",
-      "from": "postcss-discard-unused@>=2.2.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-discard-unused/-/postcss-discard-unused-2.2.3.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-discard-unused/-/postcss-discard-unused-2.2.3.tgz",
+      "integrity": "sha1-vOMLLMWR/8Y0Mitfs0ZLbZNPRDM="
     },
     "postcss-filter-plugins": {
       "version": "2.0.2",
-      "from": "postcss-filter-plugins@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-filter-plugins/-/postcss-filter-plugins-2.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-filter-plugins/-/postcss-filter-plugins-2.0.2.tgz",
+      "integrity": "sha1-bYWGJTTXNaxCDkqFgG4fXUKG2Ew="
     },
     "postcss-load-config": {
       "version": "1.2.0",
-      "from": "postcss-load-config@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-1.2.0.tgz",
+      "integrity": "sha1-U56a/J3chiASHr+djDZz4M5Q0oo="
     },
     "postcss-load-options": {
       "version": "1.2.0",
-      "from": "postcss-load-options@>=1.2.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-load-options/-/postcss-load-options-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-load-options/-/postcss-load-options-1.2.0.tgz",
+      "integrity": "sha1-sJixVZ3awt8EvAuzdfmaXP4rbYw="
     },
     "postcss-load-plugins": {
       "version": "2.3.0",
-      "from": "postcss-load-plugins@>=2.3.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-load-plugins/-/postcss-load-plugins-2.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-load-plugins/-/postcss-load-plugins-2.3.0.tgz",
+      "integrity": "sha1-dFdoEWWZrKLwCfrUJrABdQSdjZI="
     },
     "postcss-loader": {
       "version": "1.3.3",
-      "from": "postcss-loader@>=1.3.3 <2.0.0",
       "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-1.3.3.tgz",
+      "integrity": "sha1-piHqH6KQYqg5cqRvVEhncTAZFus=",
       "dependencies": {
         "loader-utils": {
           "version": "1.1.0",
-          "from": "loader-utils@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
+          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
         }
       }
     },
     "postcss-merge-idents": {
       "version": "2.1.7",
-      "from": "postcss-merge-idents@>=2.1.5 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-merge-idents/-/postcss-merge-idents-2.1.7.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-merge-idents/-/postcss-merge-idents-2.1.7.tgz",
+      "integrity": "sha1-TFUwMTwI4dWzu/PSu8dH4njuonA="
     },
     "postcss-merge-longhand": {
       "version": "2.0.2",
-      "from": "postcss-merge-longhand@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-merge-longhand/-/postcss-merge-longhand-2.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-merge-longhand/-/postcss-merge-longhand-2.0.2.tgz",
+      "integrity": "sha1-I9kM0Sewp3mUkVMyc5A0oaTz1lg="
     },
     "postcss-merge-rules": {
       "version": "2.1.2",
-      "from": "postcss-merge-rules@>=2.0.3 <3.0.0",
       "resolved": "https://registry.npmjs.org/postcss-merge-rules/-/postcss-merge-rules-2.1.2.tgz",
+      "integrity": "sha1-0d9d+qexrMO+VT8OnhDofGG19yE=",
       "dependencies": {
         "browserslist": {
           "version": "1.7.7",
-          "from": "browserslist@>=1.5.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz"
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
+          "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk="
         }
       }
     },
     "postcss-message-helpers": {
       "version": "2.0.0",
-      "from": "postcss-message-helpers@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-message-helpers/-/postcss-message-helpers-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-message-helpers/-/postcss-message-helpers-2.0.0.tgz",
+      "integrity": "sha1-pPL0+rbk/gAvCu0ABHjN9S+bpg4="
     },
     "postcss-minify-font-values": {
       "version": "1.0.5",
-      "from": "postcss-minify-font-values@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-minify-font-values/-/postcss-minify-font-values-1.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-minify-font-values/-/postcss-minify-font-values-1.0.5.tgz",
+      "integrity": "sha1-S1jttWZB66fIR0qzUmyv17vey2k="
     },
     "postcss-minify-gradients": {
       "version": "1.0.5",
-      "from": "postcss-minify-gradients@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-minify-gradients/-/postcss-minify-gradients-1.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-minify-gradients/-/postcss-minify-gradients-1.0.5.tgz",
+      "integrity": "sha1-Xb2hE3NwP4PPtKPqOIHY11/15uE="
     },
     "postcss-minify-params": {
       "version": "1.2.2",
-      "from": "postcss-minify-params@>=1.0.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-minify-params/-/postcss-minify-params-1.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-minify-params/-/postcss-minify-params-1.2.2.tgz",
+      "integrity": "sha1-rSzgcTc7lDs9kwo/pZo1jCjW8fM="
     },
     "postcss-minify-selectors": {
       "version": "2.1.1",
-      "from": "postcss-minify-selectors@>=2.0.4 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-minify-selectors/-/postcss-minify-selectors-2.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-minify-selectors/-/postcss-minify-selectors-2.1.1.tgz",
+      "integrity": "sha1-ssapjAByz5G5MtGkllCBFDEXNb8="
     },
     "postcss-modules": {
       "version": "0.5.2",
-      "from": "postcss-modules@>=0.5.0 <0.6.0",
-      "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.5.2.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.5.2.tgz",
+      "integrity": "sha1-nWgv7T8oK9ZLKqT+tvIqKvQ1/9o="
     },
     "postcss-modules-extract-imports": {
       "version": "1.1.0",
-      "from": "postcss-modules-extract-imports@1.1.0",
       "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-1.1.0.tgz",
+      "integrity": "sha1-thTJcgvmgW6u41+zpfqh26agXds=",
       "dependencies": {
         "postcss": {
           "version": "6.0.1",
-          "from": "postcss@>=6.0.1 <7.0.0",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
+          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.2.3 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
     "postcss-modules-local-by-default": {
       "version": "1.2.0",
-      "from": "postcss-modules-local-by-default@1.2.0",
       "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-1.2.0.tgz",
+      "integrity": "sha1-99gMOYxaOT+nlkRmvRlQCn1hwGk=",
       "dependencies": {
         "postcss": {
           "version": "6.0.1",
-          "from": "postcss@>=6.0.1 <7.0.0",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
+          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.2.3 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
     "postcss-modules-scope": {
       "version": "1.1.0",
-      "from": "postcss-modules-scope@1.1.0",
       "resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-1.1.0.tgz",
+      "integrity": "sha1-1upkmUx5+XtipytCb75gVqGUu5A=",
       "dependencies": {
         "postcss": {
           "version": "6.0.1",
-          "from": "postcss@>=6.0.1 <7.0.0",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
+          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.2.3 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
     "postcss-modules-values": {
       "version": "1.3.0",
-      "from": "postcss-modules-values@1.3.0",
       "resolved": "https://registry.npmjs.org/postcss-modules-values/-/postcss-modules-values-1.3.0.tgz",
+      "integrity": "sha1-7P+p1+GSUYOJ9CrQ6D9yrsRW6iA=",
       "dependencies": {
         "postcss": {
           "version": "6.0.1",
-          "from": "postcss@>=6.0.1 <7.0.0",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
+          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.2.3 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
     "postcss-normalize-charset": {
       "version": "1.1.1",
-      "from": "postcss-normalize-charset@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-normalize-charset/-/postcss-normalize-charset-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-normalize-charset/-/postcss-normalize-charset-1.1.1.tgz",
+      "integrity": "sha1-757nEhLX/nWceO0WL2HtYrXLk/E="
     },
     "postcss-normalize-url": {
       "version": "3.0.8",
-      "from": "postcss-normalize-url@>=3.0.7 <4.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-normalize-url/-/postcss-normalize-url-3.0.8.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-normalize-url/-/postcss-normalize-url-3.0.8.tgz",
+      "integrity": "sha1-EI90s/L82viRov+j6kWSJ5/HgiI="
     },
     "postcss-ordered-values": {
       "version": "2.2.3",
-      "from": "postcss-ordered-values@>=2.1.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-ordered-values/-/postcss-ordered-values-2.2.3.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-ordered-values/-/postcss-ordered-values-2.2.3.tgz",
+      "integrity": "sha1-7sbCpntsQSqNsgQud/6NpD+VwR0="
     },
     "postcss-reduce-idents": {
       "version": "2.4.0",
-      "from": "postcss-reduce-idents@>=2.2.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-reduce-idents/-/postcss-reduce-idents-2.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-reduce-idents/-/postcss-reduce-idents-2.4.0.tgz",
+      "integrity": "sha1-wsbSDMlYKE9qv75j92Cb9AkFmtM="
     },
     "postcss-reduce-initial": {
       "version": "1.0.1",
-      "from": "postcss-reduce-initial@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-reduce-initial/-/postcss-reduce-initial-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-reduce-initial/-/postcss-reduce-initial-1.0.1.tgz",
+      "integrity": "sha1-aPgGlfBF0IJjqHmtJA343WT2ROo="
     },
     "postcss-reduce-transforms": {
       "version": "1.0.4",
-      "from": "postcss-reduce-transforms@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-reduce-transforms/-/postcss-reduce-transforms-1.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-reduce-transforms/-/postcss-reduce-transforms-1.0.4.tgz",
+      "integrity": "sha1-/3b02CEkN7McKYpC0uFEQCV3GuE="
     },
     "postcss-selector-parser": {
       "version": "2.2.3",
-      "from": "postcss-selector-parser@>=2.2.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-2.2.3.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-2.2.3.tgz",
+      "integrity": "sha1-+UN3iGBsPJrO4W/+jYsWKX8nu5A="
     },
     "postcss-svgo": {
       "version": "2.1.6",
-      "from": "postcss-svgo@>=2.1.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-svgo/-/postcss-svgo-2.1.6.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-svgo/-/postcss-svgo-2.1.6.tgz",
+      "integrity": "sha1-tt8YqmE7Zm4TPwittSGcJoSsEI0="
     },
     "postcss-unique-selectors": {
       "version": "2.0.2",
-      "from": "postcss-unique-selectors@>=2.0.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-unique-selectors/-/postcss-unique-selectors-2.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-unique-selectors/-/postcss-unique-selectors-2.0.2.tgz",
+      "integrity": "sha1-mB1X0p3csz57Hf4f1DuGSfkzyh0="
     },
     "postcss-value-parser": {
       "version": "3.3.0",
-      "from": "postcss-value-parser@>=3.2.3 <4.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-3.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-3.3.0.tgz",
+      "integrity": "sha1-h/OPnxj3dKSrTIojL1xc6IcqnRU="
     },
     "postcss-zindex": {
       "version": "2.2.0",
-      "from": "postcss-zindex@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-zindex/-/postcss-zindex-2.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/postcss-zindex/-/postcss-zindex-2.2.0.tgz",
+      "integrity": "sha1-0hCd3AVbka9n/EyzsCWUZjnSryI="
     },
     "prelude-ls": {
       "version": "1.1.2",
-      "from": "prelude-ls@>=1.1.2 <1.2.0",
-      "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.1.2.tgz",
+      "integrity": "sha1-IZMqVJ9eUv/ZqCf1cOBL5iqX2lQ="
     },
     "prepend-http": {
       "version": "1.0.4",
-      "from": "prepend-http@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/prepend-http/-/prepend-http-1.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/prepend-http/-/prepend-http-1.0.4.tgz",
+      "integrity": "sha1-1PRWKwzjaW5BrFLQ4ALlemNdxtw="
     },
     "preserve": {
       "version": "0.2.0",
-      "from": "preserve@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/preserve/-/preserve-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/preserve/-/preserve-0.2.0.tgz",
+      "integrity": "sha1-gV7R9uvGWSb4ZbMQwHE7yzMVzks="
     },
     "pretty-hrtime": {
       "version": "1.0.3",
-      "from": "pretty-hrtime@>=1.0.2 <1.1.0",
-      "resolved": "https://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz",
+      "integrity": "sha1-t+PqQkNaTJsnWdmeDyAesZWALuE="
     },
     "private": {
       "version": "0.1.7",
-      "from": "private@>=0.1.5 <0.2.0",
-      "resolved": "https://registry.npmjs.org/private/-/private-0.1.7.tgz"
+      "resolved": "https://registry.npmjs.org/private/-/private-0.1.7.tgz",
+      "integrity": "sha1-aM5eih7woju1cMwoU3tTMqumPvE="
     },
     "process": {
       "version": "0.11.10",
-      "from": "process@>=0.11.0 <0.12.0",
-      "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz"
+      "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
+      "integrity": "sha1-czIwDoQBYb2j5podHZGn1LwW8YI="
     },
     "process-nextick-args": {
       "version": "1.0.7",
-      "from": "process-nextick-args@>=1.0.6 <1.1.0",
-      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz"
+      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz",
+      "integrity": "sha1-FQ4gt1ZZCtP5EJPyWk8q2L/zC6M="
     },
     "progress": {
       "version": "1.1.8",
-      "from": "progress@>=1.1.8 <1.2.0",
-      "resolved": "https://registry.npmjs.org/progress/-/progress-1.1.8.tgz"
+      "resolved": "https://registry.npmjs.org/progress/-/progress-1.1.8.tgz",
+      "integrity": "sha1-4mDHj2Fhzdmw5WzD4Khd4Xx6V74="
     },
     "promise": {
       "version": "7.1.1",
-      "from": "promise@>=7.0.3 <8.0.0",
-      "resolved": "https://registry.npmjs.org/promise/-/promise-7.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/promise/-/promise-7.1.1.tgz",
+      "integrity": "sha1-SJZUxpJha4qlWwck+oCbt9tJxb8="
     },
     "prop-types": {
       "version": "15.5.10",
-      "from": "prop-types@>=15.5.10 <16.0.0",
       "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.5.10.tgz",
+      "integrity": "sha1-J5ffwxJhguOpXj37suiT3ddFYVQ=",
       "dependencies": {
         "core-js": {
           "version": "1.2.7",
-          "from": "core-js@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
+          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
         },
         "fbjs": {
           "version": "0.8.12",
-          "from": "fbjs@>=0.8.9 <0.9.0",
-          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz"
+          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz",
+          "integrity": "sha1-ELXZL3bUVXX9Y6IX1OoCvqL47QQ="
         }
       }
     },
     "proxy-addr": {
       "version": "1.1.4",
-      "from": "proxy-addr@>=1.1.3 <1.2.0",
-      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-1.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-1.1.4.tgz",
+      "integrity": "sha1-J+VF9pYKRKYn2bREZ+NcG2tM4vM="
     },
     "prr": {
       "version": "0.0.0",
-      "from": "prr@>=0.0.0 <0.1.0",
-      "resolved": "https://registry.npmjs.org/prr/-/prr-0.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/prr/-/prr-0.0.0.tgz",
+      "integrity": "sha1-GoS4WQgyVQFBGFPQCB7j+obikmo="
     },
     "pseudomap": {
       "version": "1.0.2",
-      "from": "pseudomap@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/pseudomap/-/pseudomap-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/pseudomap/-/pseudomap-1.0.2.tgz",
+      "integrity": "sha1-8FKijacOYYkX7wqKw0wa5aaChrM="
     },
     "public-encrypt": {
       "version": "4.0.0",
-      "from": "public-encrypt@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/public-encrypt/-/public-encrypt-4.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/public-encrypt/-/public-encrypt-4.0.0.tgz",
+      "integrity": "sha1-OfaZ86RlYN1eusvKaTyvfGXBjMY="
     },
     "punycode": {
       "version": "1.4.1",
-      "from": "punycode@>=1.4.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
+      "integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4="
     },
     "q": {
       "version": "1.5.0",
-      "from": "q@>=1.1.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/q/-/q-1.5.0.tgz"
+      "resolved": "https://registry.npmjs.org/q/-/q-1.5.0.tgz",
+      "integrity": "sha1-3QG6ydBtMObyGa7LglPunr3DCPE="
     },
     "qs": {
       "version": "6.4.0",
-      "from": "qs@>=6.4.0 <6.5.0",
-      "resolved": "https://registry.npmjs.org/qs/-/qs-6.4.0.tgz"
+      "resolved": "https://registry.npmjs.org/qs/-/qs-6.4.0.tgz",
+      "integrity": "sha1-E+JtKK1rD/qpExLNO/cI7TUecjM="
     },
     "query-string": {
       "version": "4.3.4",
-      "from": "query-string@>=4.1.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/query-string/-/query-string-4.3.4.tgz"
+      "resolved": "https://registry.npmjs.org/query-string/-/query-string-4.3.4.tgz",
+      "integrity": "sha1-u7aTucqRXCMlFbIosaArYJBD2+s="
     },
     "querystring": {
       "version": "0.2.0",
-      "from": "querystring@0.2.0",
-      "resolved": "https://registry.npmjs.org/querystring/-/querystring-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/querystring/-/querystring-0.2.0.tgz",
+      "integrity": "sha1-sgmEkgO7Jd+CDadW50cAWHhSFiA="
     },
     "querystring-es3": {
       "version": "0.2.1",
-      "from": "querystring-es3@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/querystring-es3/-/querystring-es3-0.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/querystring-es3/-/querystring-es3-0.2.1.tgz",
+      "integrity": "sha1-nsYfeQSYdXB9aUFFlv2Qek1xHnM="
     },
     "querystringify": {
       "version": "0.0.4",
-      "from": "querystringify@>=0.0.0 <0.1.0",
-      "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-0.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-0.0.4.tgz",
+      "integrity": "sha1-DPf4T5Rj/wrlHExLFC2VvjdyTZw="
     },
     "random-bytes": {
       "version": "1.0.0",
-      "from": "random-bytes@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/random-bytes/-/random-bytes-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/random-bytes/-/random-bytes-1.0.0.tgz",
+      "integrity": "sha1-T2ih3Arli9P7lYSMMDJNt11kNgs="
     },
     "randomatic": {
       "version": "1.1.6",
-      "from": "randomatic@>=1.1.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-1.1.6.tgz"
+      "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-1.1.6.tgz",
+      "integrity": "sha1-EQ3Kv/OX6dz/fAeJzMCkmt8exbs="
     },
     "randombytes": {
       "version": "2.0.3",
-      "from": "randombytes@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.0.3.tgz",
+      "integrity": "sha1-Z0yZdgkBw8QRJ3GjHlIdw0nMCew="
     },
     "range-parser": {
       "version": "1.2.0",
-      "from": "range-parser@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.0.tgz",
+      "integrity": "sha1-9JvmtIeJTdxA3MlKMi9hEJLgDV4="
     },
     "raw-body": {
       "version": "2.2.0",
-      "from": "raw-body@>=2.2.0 <2.3.0",
-      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.2.0.tgz",
+      "integrity": "sha1-mUl2z2pQlqQRYoQEkvC9xdbn+5Y="
     },
     "raw-loader": {
       "version": "0.5.1",
-      "from": "raw-loader@>=0.5.1 <0.6.0",
-      "resolved": "https://registry.npmjs.org/raw-loader/-/raw-loader-0.5.1.tgz"
+      "resolved": "https://registry.npmjs.org/raw-loader/-/raw-loader-0.5.1.tgz",
+      "integrity": "sha1-DD0L6u2KAclm2Xh793goElKpeao="
     },
     "rc": {
       "version": "1.2.1",
-      "from": "rc@>=1.1.6 <2.0.0",
-      "resolved": "https://registry.npmjs.org/rc/-/rc-1.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/rc/-/rc-1.2.1.tgz",
+      "integrity": "sha1-LgPo5C7kULjLPc5lvhv4l04d/ZU="
     },
     "react": {
       "version": "15.4.2",
-      "from": "react@15.4.2",
       "resolved": "https://registry.npmjs.org/react/-/react-15.4.2.tgz",
+      "integrity": "sha1-QfeZGyYYU5K6m66WyIiefgGDl+8=",
       "dependencies": {
         "core-js": {
           "version": "1.2.7",
-          "from": "core-js@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
+          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
         },
         "fbjs": {
           "version": "0.8.12",
-          "from": "fbjs@>=0.8.4 <0.9.0",
-          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz"
+          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz",
+          "integrity": "sha1-ELXZL3bUVXX9Y6IX1OoCvqL47QQ="
         }
       }
     },
     "react-addons-test-utils": {
       "version": "15.4.2",
-      "from": "react-addons-test-utils@15.4.2",
       "resolved": "https://registry.npmjs.org/react-addons-test-utils/-/react-addons-test-utils-15.4.2.tgz",
+      "integrity": "sha1-k7yqcY/K5zYNQuj7HAl1bMNjAqI=",
       "dependencies": {
         "core-js": {
           "version": "1.2.7",
-          "from": "core-js@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
+          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
         },
         "fbjs": {
           "version": "0.8.12",
-          "from": "fbjs@>=0.8.4 <0.9.0",
-          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz"
+          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz",
+          "integrity": "sha1-ELXZL3bUVXX9Y6IX1OoCvqL47QQ="
         }
       }
     },
     "react-dom": {
       "version": "15.4.2",
-      "from": "react-dom@15.4.2",
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-15.4.2.tgz",
+      "integrity": "sha1-AVNj8FsKH9Uq6e/dOgBg2QaVII8=",
       "dependencies": {
         "core-js": {
           "version": "1.2.7",
-          "from": "core-js@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz"
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
+          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
         },
         "fbjs": {
           "version": "0.8.12",
-          "from": "fbjs@>=0.8.1 <0.9.0",
-          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz"
+          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz",
+          "integrity": "sha1-ELXZL3bUVXX9Y6IX1OoCvqL47QQ="
         }
       }
     },
     "react-highlight": {
       "version": "0.9.0",
-      "from": "react-highlight@0.9.0",
-      "resolved": "https://registry.npmjs.org/react-highlight/-/react-highlight-0.9.0.tgz"
+      "resolved": "https://registry.npmjs.org/react-highlight/-/react-highlight-0.9.0.tgz",
+      "integrity": "sha1-1e3udEzLhon3k4eUtqG1VLsVDrc="
     },
     "read": {
       "version": "1.0.7",
-      "from": "read@>=1.0.3 <1.1.0",
-      "resolved": "https://registry.npmjs.org/read/-/read-1.0.7.tgz"
+      "resolved": "https://registry.npmjs.org/read/-/read-1.0.7.tgz",
+      "integrity": "sha1-s9oZvQUkMal2cdRKQmNK33ELQMQ="
     },
     "read-all-stream": {
       "version": "3.1.0",
-      "from": "read-all-stream@>=3.0.0 <4.0.0",
       "resolved": "https://registry.npmjs.org/read-all-stream/-/read-all-stream-3.1.0.tgz",
+      "integrity": "sha1-NcPhd/IHjveJ7kv6+kNzB06u9Po=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "read-pkg": {
       "version": "1.1.0",
-      "from": "read-pkg@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
+      "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg="
     },
     "read-pkg-up": {
       "version": "1.0.1",
-      "from": "read-pkg-up@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
+      "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI="
     },
     "readable-stream": {
       "version": "1.1.14",
-      "from": "readable-stream@>=1.1.9 <1.2.0",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz"
+      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
+      "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk="
     },
     "readdirp": {
       "version": "2.1.0",
-      "from": "readdirp@>=2.0.0 <3.0.0",
       "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-2.1.0.tgz",
+      "integrity": "sha1-TtCtBg3zBzMAxIRANz9y0cxkLXg=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "readline2": {
       "version": "1.0.1",
-      "from": "readline2@>=1.0.1 <2.0.0",
       "resolved": "https://registry.npmjs.org/readline2/-/readline2-1.0.1.tgz",
+      "integrity": "sha1-QQWWCP/BVHV7cV2ZidGZ/783LjU=",
       "dependencies": {
         "mute-stream": {
           "version": "0.0.5",
-          "from": "mute-stream@0.0.5",
-          "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.5.tgz"
+          "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.5.tgz",
+          "integrity": "sha1-j7+rsKmKJT0xhDMfno3rc3L6xsA="
         }
       }
     },
     "recast": {
       "version": "0.11.23",
-      "from": "recast@>=0.11.12 <0.12.0",
-      "resolved": "https://registry.npmjs.org/recast/-/recast-0.11.23.tgz"
+      "resolved": "https://registry.npmjs.org/recast/-/recast-0.11.23.tgz",
+      "integrity": "sha1-RR/TAEqx5N+bTktmN2sqIZEkYtM="
     },
     "rechoir": {
       "version": "0.6.2",
-      "from": "rechoir@>=0.6.2 <0.7.0",
-      "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz"
+      "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz",
+      "integrity": "sha1-hSBLVNuoLVdC4oyWdW70OvUOM4Q="
     },
     "redent": {
       "version": "1.0.0",
-      "from": "redent@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/redent/-/redent-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/redent/-/redent-1.0.0.tgz",
+      "integrity": "sha1-z5Fqsf1fHxbfsggi3W7H9zDCr94="
     },
     "redeyed": {
       "version": "1.0.1",
-      "from": "redeyed@>=1.0.0 <1.1.0",
       "resolved": "https://registry.npmjs.org/redeyed/-/redeyed-1.0.1.tgz",
+      "integrity": "sha1-6WwZO0DAgWsArshCaY5hGF5VSYo=",
       "dependencies": {
         "esprima": {
           "version": "3.0.0",
-          "from": "esprima@>=3.0.0 <3.1.0",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.0.0.tgz",
+          "integrity": "sha1-U88kes2ncxPlUcOqLnM0LT+099k="
         }
       }
     },
     "reduce-css-calc": {
       "version": "1.3.0",
-      "from": "reduce-css-calc@>=1.2.6 <2.0.0",
-      "resolved": "https://registry.npmjs.org/reduce-css-calc/-/reduce-css-calc-1.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/reduce-css-calc/-/reduce-css-calc-1.3.0.tgz",
+      "integrity": "sha1-dHyRTgSWFKTJz7umKYca0dKSdxY="
     },
     "reduce-function-call": {
       "version": "1.0.2",
-      "from": "reduce-function-call@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/reduce-function-call/-/reduce-function-call-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/reduce-function-call/-/reduce-function-call-1.0.2.tgz",
+      "integrity": "sha1-WiAL+S4ON3UXUv5FsKszD9S2vpk="
     },
     "regenerate": {
       "version": "1.3.2",
-      "from": "regenerate@>=1.2.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.3.2.tgz"
+      "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.3.2.tgz",
+      "integrity": "sha1-0ZQcZ7rUN+G+dkM63Vs4X5WxkmA="
     },
     "regenerator-runtime": {
       "version": "0.10.5",
-      "from": "regenerator-runtime@>=0.10.0 <0.11.0",
-      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz"
+      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz",
+      "integrity": "sha1-M2w+/BIgrc7dosn6tntaeVWjNlg="
     },
     "regex-cache": {
       "version": "0.4.3",
-      "from": "regex-cache@>=0.4.2 <0.5.0",
-      "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.3.tgz"
+      "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.3.tgz",
+      "integrity": "sha1-mxpsNdTQ3871cRrmUejp09cRQUU="
     },
     "regexpu-core": {
       "version": "1.0.0",
-      "from": "regexpu-core@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-1.0.0.tgz",
+      "integrity": "sha1-hqdj9Y7k18L2sQLkdkBQ3n7ZDGs="
     },
     "registry-auth-token": {
       "version": "3.3.1",
-      "from": "registry-auth-token@>=3.0.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/registry-auth-token/-/registry-auth-token-3.3.1.tgz"
+      "resolved": "https://registry.npmjs.org/registry-auth-token/-/registry-auth-token-3.3.1.tgz",
+      "integrity": "sha1-+w0yie4Nmtosu1KvXf5mywcNMAY="
     },
     "registry-url": {
       "version": "3.1.0",
-      "from": "registry-url@>=3.0.3 <4.0.0",
-      "resolved": "https://registry.npmjs.org/registry-url/-/registry-url-3.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/registry-url/-/registry-url-3.1.0.tgz",
+      "integrity": "sha1-PU74cPc93h138M+aOBQyRE4XSUI="
     },
     "regjsgen": {
       "version": "0.2.0",
-      "from": "regjsgen@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.2.0.tgz",
+      "integrity": "sha1-bAFq3qxVT3WCP+N6wFuS1aTtsfc="
     },
     "regjsparser": {
       "version": "0.1.5",
-      "from": "regjsparser@>=0.1.4 <0.2.0",
-      "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz"
+      "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz",
+      "integrity": "sha1-fuj4Tcb6eS0/0K4ijSS9lJ6tIFw="
     },
     "relateurl": {
       "version": "0.2.7",
-      "from": "relateurl@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/relateurl/-/relateurl-0.2.7.tgz"
+      "resolved": "https://registry.npmjs.org/relateurl/-/relateurl-0.2.7.tgz",
+      "integrity": "sha1-VNvzd+UUQKypCkzSdGANP/LYiKk="
     },
     "remove-trailing-separator": {
       "version": "1.0.1",
-      "from": "remove-trailing-separator@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.0.1.tgz",
+      "integrity": "sha1-YV67lq9VlVLUv0BXyENtSGq2PMQ="
     },
     "repeat-element": {
       "version": "1.1.2",
-      "from": "repeat-element@>=1.1.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/repeat-element/-/repeat-element-1.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/repeat-element/-/repeat-element-1.1.2.tgz",
+      "integrity": "sha1-7wiaF40Ug7quTZPrmLT55OEdmQo="
     },
     "repeat-string": {
       "version": "1.6.1",
-      "from": "repeat-string@>=1.5.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-1.6.1.tgz"
+      "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-1.6.1.tgz",
+      "integrity": "sha1-jcrkcOHIirwtYA//Sndihtp15jc="
     },
     "repeating": {
       "version": "2.0.1",
-      "from": "repeating@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/repeating/-/repeating-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/repeating/-/repeating-2.0.1.tgz",
+      "integrity": "sha1-UhTFOpJtNVJwdSf7q0FdvAjQbdo="
     },
     "replace-ext": {
       "version": "0.0.1",
-      "from": "replace-ext@0.0.1",
-      "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-0.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-0.0.1.tgz",
+      "integrity": "sha1-KbvZIHinOfC8zitO5B6DeVNSKSQ="
     },
     "replacestream": {
       "version": "4.0.2",
-      "from": "replacestream@>=4.0.0 <5.0.0",
       "resolved": "https://registry.npmjs.org/replacestream/-/replacestream-4.0.2.tgz",
+      "integrity": "sha1-DEFAcH5PAyP1DeBEhRcIz1i8N70=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "request": {
       "version": "2.81.0",
-      "from": "request@>=2.81.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz"
+      "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz",
+      "integrity": "sha1-xpKJRqDgbF+Nb4qTM0af/aRimKA="
     },
     "request-progress": {
       "version": "2.0.1",
-      "from": "request-progress@>=2.0.1 <2.1.0",
-      "resolved": "https://registry.npmjs.org/request-progress/-/request-progress-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/request-progress/-/request-progress-2.0.1.tgz",
+      "integrity": "sha1-XTa7V5YcZzqlt4jbyBQf3yO0Tgg="
     },
     "require-directory": {
       "version": "2.1.1",
-      "from": "require-directory@>=2.1.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
+      "integrity": "sha1-jGStX9MNqxyXbiNE/+f3kqam30I="
     },
     "require-from-string": {
       "version": "1.2.1",
-      "from": "require-from-string@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-1.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-1.2.1.tgz",
+      "integrity": "sha1-UpyczvJzgK3+yaL5ZbZJu+5jZBg="
     },
     "require-main-filename": {
       "version": "1.0.1",
-      "from": "require-main-filename@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-1.0.1.tgz",
+      "integrity": "sha1-l/cXtp1IeE9fUmpsWqj/3aBVpNE="
     },
     "requires-port": {
       "version": "1.0.0",
-      "from": "requires-port@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
+      "integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8="
     },
     "resemblejs": {
       "version": "2.2.4",
-      "from": "resemblejs@>=2.2.3 <2.3.0",
-      "resolved": "https://registry.npmjs.org/resemblejs/-/resemblejs-2.2.4.tgz"
+      "resolved": "https://registry.npmjs.org/resemblejs/-/resemblejs-2.2.4.tgz",
+      "integrity": "sha1-g1JeKtt333fIrQhqGyUQ8DJ2DAg="
     },
     "resolve": {
       "version": "1.3.3",
-      "from": "resolve@>=1.1.7 <2.0.0",
-      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.3.3.tgz"
+      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.3.3.tgz",
+      "integrity": "sha1-ZVkHw0aahoDcLeOidaj91paR8OU="
     },
     "resolve-dir": {
       "version": "0.1.1",
-      "from": "resolve-dir@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/resolve-dir/-/resolve-dir-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/resolve-dir/-/resolve-dir-0.1.1.tgz",
+      "integrity": "sha1-shklmlYC+sXFxJatiUpujMQwJh4="
     },
     "response-time": {
       "version": "2.3.2",
-      "from": "response-time@>=2.3.1 <2.4.0",
-      "resolved": "https://registry.npmjs.org/response-time/-/response-time-2.3.2.tgz"
+      "resolved": "https://registry.npmjs.org/response-time/-/response-time-2.3.2.tgz",
+      "integrity": "sha1-/6cbq5UtYvfB1Jt0NDVfvGjf/Fo="
     },
     "restore-cursor": {
       "version": "1.0.1",
-      "from": "restore-cursor@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-1.0.1.tgz",
+      "integrity": "sha1-NGYfRohjJ/7SmRR5FSJS35LapUE="
     },
     "right-align": {
       "version": "0.1.3",
-      "from": "right-align@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/right-align/-/right-align-0.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/right-align/-/right-align-0.1.3.tgz",
+      "integrity": "sha1-YTObci/mo1FWiSENJOFMlhSGE+8="
     },
     "rimraf": {
       "version": "2.6.1",
-      "from": "rimraf@>=2.2.8 <3.0.0",
-      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.1.tgz"
+      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.1.tgz",
+      "integrity": "sha1-wjOOxkPfeht/5cVPqG9XQopV8z0="
     },
     "ripemd160": {
       "version": "0.2.0",
-      "from": "ripemd160@0.2.0",
-      "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-0.2.0.tgz",
+      "integrity": "sha1-K/GYveFnys+lHAqSjoS2i74XH84="
     },
     "rndm": {
       "version": "1.2.0",
-      "from": "rndm@1.2.0",
-      "resolved": "https://registry.npmjs.org/rndm/-/rndm-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/rndm/-/rndm-1.2.0.tgz",
+      "integrity": "sha1-8z/pz7Urv9UgqhgyO8ZdsRCht2w="
     },
     "rtl-css-js": {
       "version": "1.1.0",
-      "from": "rtl-css-js@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.1.0.tgz",
+      "integrity": "sha1-c5qMN9k+xt2safWtRVZWxgQ9b5U="
     },
     "run-async": {
       "version": "0.1.0",
-      "from": "run-async@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/run-async/-/run-async-0.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/run-async/-/run-async-0.1.0.tgz",
+      "integrity": "sha1-yK1KXhEGYeQCp9IbUw4AnyX444k="
     },
     "rx-lite": {
       "version": "3.1.2",
-      "from": "rx-lite@>=3.1.2 <4.0.0",
-      "resolved": "https://registry.npmjs.org/rx-lite/-/rx-lite-3.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/rx-lite/-/rx-lite-3.1.2.tgz",
+      "integrity": "sha1-Gc5QLKVyZl87ZHsQk5+X/RYV8QI="
     },
     "safe-buffer": {
       "version": "5.0.1",
-      "from": "safe-buffer@>=5.0.1 <6.0.0",
-      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+      "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
     },
     "samsam": {
       "version": "1.1.2",
-      "from": "samsam@1.1.2",
-      "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.1.2.tgz",
+      "integrity": "sha1-vsEf3IOp/aBjQBIQ5AF2wwJNFWc="
     },
     "sass-graph": {
       "version": "2.2.4",
-      "from": "sass-graph@>=2.1.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/sass-graph/-/sass-graph-2.2.4.tgz",
+      "integrity": "sha1-E/vWPNHK8JCLn9k0dq1DpR0eC0k=",
       "dependencies": {
         "camelcase": {
           "version": "3.0.0",
-          "from": "camelcase@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
+          "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
         },
         "yargs": {
           "version": "7.1.0",
-          "from": "yargs@>=7.0.0 <8.0.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-7.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-7.1.0.tgz",
+          "integrity": "sha1-a6MY6xaWFyf10oT46gA+jWFU0Mg="
         },
         "yargs-parser": {
           "version": "5.0.0",
-          "from": "yargs-parser@>=5.0.0 <6.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-5.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-5.0.0.tgz",
+          "integrity": "sha1-J17PDX/+Bcd+ZOfIbkzZS/DhIoo="
         }
       }
     },
     "sass-loader": {
       "version": "6.0.5",
-      "from": "sass-loader@>=6.0.3 <7.0.0",
       "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-6.0.5.tgz",
+      "integrity": "sha1-qEeRDzZEKqVsWYWHnVTrUZ4koyg=",
       "dependencies": {
         "async": {
           "version": "2.4.1",
-          "from": "async@>=2.1.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
+          "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c="
         },
         "loader-utils": {
           "version": "1.1.0",
-          "from": "loader-utils@>=1.0.1 <2.0.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
+          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
         }
       }
     },
     "sax": {
       "version": "0.5.2",
-      "from": "sax@0.5.2",
-      "resolved": "https://registry.npmjs.org/sax/-/sax-0.5.2.tgz"
+      "resolved": "https://registry.npmjs.org/sax/-/sax-0.5.2.tgz",
+      "integrity": "sha1-c1/6o5oc/4/7lZjwIjq9sDqfsuo="
     },
     "script-loader": {
       "version": "0.7.0",
-      "from": "script-loader@>=0.7.0 <0.8.0",
-      "resolved": "https://registry.npmjs.org/script-loader/-/script-loader-0.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/script-loader/-/script-loader-0.7.0.tgz",
+      "integrity": "sha1-aF3H5waeDe56kmdPDrxbD1W6pew="
     },
     "scss-tokenizer": {
       "version": "0.2.3",
-      "from": "scss-tokenizer@>=0.2.3 <0.3.0",
       "resolved": "https://registry.npmjs.org/scss-tokenizer/-/scss-tokenizer-0.2.3.tgz",
+      "integrity": "sha1-jrBtualyMzOCTT9VMGQRSYR85dE=",
       "dependencies": {
         "source-map": {
           "version": "0.4.4",
-          "from": "source-map@>=0.4.2 <0.5.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz"
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
+          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s="
         }
       }
     },
     "select-hose": {
       "version": "2.0.0",
-      "from": "select-hose@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz",
+      "integrity": "sha1-Yl2GWPhlr0Psliv8N2o3NZpJlMo="
     },
     "semver": {
       "version": "5.3.0",
-      "from": "semver@>=5.3.0 <5.4.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz"
+      "resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz",
+      "integrity": "sha1-myzl094C0XxgEq0yaqa00M9U+U8="
     },
     "semver-diff": {
       "version": "2.1.0",
-      "from": "semver-diff@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/semver-diff/-/semver-diff-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/semver-diff/-/semver-diff-2.1.0.tgz",
+      "integrity": "sha1-S7uEN8jTfksM8aaP1ybsbWRdbTY="
     },
     "send": {
       "version": "0.14.2",
-      "from": "send@0.14.2",
       "resolved": "https://registry.npmjs.org/send/-/send-0.14.2.tgz",
+      "integrity": "sha1-ObBDiz9RC+Xcb2Z6EfcWiTaM3u8=",
       "dependencies": {
         "debug": {
           "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
           "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo=",
           "dependencies": {
             "ms": {
               "version": "0.7.1",
-              "from": "ms@0.7.1",
-              "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+              "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+              "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
             }
           }
         },
         "http-errors": {
           "version": "1.5.1",
-          "from": "http-errors@>=1.5.1 <1.6.0",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.5.1.tgz"
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.5.1.tgz",
+          "integrity": "sha1-eIwNLB3iyBuebowBhDtrl+uSB1A="
         },
         "mime": {
           "version": "1.3.4",
-          "from": "mime@1.3.4",
-          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz"
+          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz",
+          "integrity": "sha1-EV+eO2s9rylZmDyzjxSaLUDrXVM="
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
+          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
         },
         "setprototypeof": {
           "version": "1.0.2",
-          "from": "setprototypeof@1.0.2",
-          "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.0.2.tgz",
+          "integrity": "sha1-gaVSFB7BBLiOic44MQOtXGZWTQg="
         }
       }
     },
     "sequencify": {
       "version": "0.0.7",
-      "from": "sequencify@>=0.0.7 <0.1.0",
-      "resolved": "https://registry.npmjs.org/sequencify/-/sequencify-0.0.7.tgz"
+      "resolved": "https://registry.npmjs.org/sequencify/-/sequencify-0.0.7.tgz",
+      "integrity": "sha1-kM/xnQLgcCf9dn9erT57ldHnOAw="
     },
     "serve-favicon": {
       "version": "2.3.2",
-      "from": "serve-favicon@>=2.3.0 <2.4.0",
       "resolved": "https://registry.npmjs.org/serve-favicon/-/serve-favicon-2.3.2.tgz",
+      "integrity": "sha1-3UGeJo3gEqtysxnTN/IQUBP5OB8=",
       "dependencies": {
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
+          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
         }
       }
     },
     "serve-index": {
       "version": "1.7.3",
-      "from": "serve-index@>=1.7.2 <1.8.0",
       "resolved": "https://registry.npmjs.org/serve-index/-/serve-index-1.7.3.tgz",
+      "integrity": "sha1-egV/xu4o3GP2RWbl+lexEahq7NI=",
       "dependencies": {
         "accepts": {
           "version": "1.2.13",
-          "from": "accepts@>=1.2.13 <1.3.0",
-          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.2.13.tgz"
+          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.2.13.tgz",
+          "integrity": "sha1-5fHzkoxtlf2WVYw27D2dDeSm7Oo="
         },
         "debug": {
           "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "http-errors": {
           "version": "1.3.1",
-          "from": "http-errors@>=1.3.1 <1.4.0",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
+          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
         },
         "ms": {
           "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         },
         "negotiator": {
           "version": "0.5.3",
-          "from": "negotiator@0.5.3",
-          "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.5.3.tgz"
+          "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.5.3.tgz",
+          "integrity": "sha1-Jp1cR2gQ7JLtvntsLygxY4T5p+g="
         }
       }
     },
     "serve-static": {
       "version": "1.11.2",
-      "from": "serve-static@>=1.11.2 <1.12.0",
-      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.11.2.tgz"
+      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.11.2.tgz",
+      "integrity": "sha1-LPmIm9RDWjIMw2iVyapXvWYuasc="
     },
     "set-blocking": {
       "version": "2.0.0",
-      "from": "set-blocking@>=2.0.0 <2.1.0",
-      "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
+      "integrity": "sha1-BF+XgtARrppoA93TgrJDkrPYkPc="
     },
     "set-immediate-shim": {
       "version": "1.0.1",
-      "from": "set-immediate-shim@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/set-immediate-shim/-/set-immediate-shim-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/set-immediate-shim/-/set-immediate-shim-1.0.1.tgz",
+      "integrity": "sha1-SysbJ+uAip+NzEgaWOXlb1mfP2E="
     },
     "setimmediate": {
       "version": "1.0.5",
-      "from": "setimmediate@>=1.0.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/setimmediate/-/setimmediate-1.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/setimmediate/-/setimmediate-1.0.5.tgz",
+      "integrity": "sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU="
     },
     "setprototypeof": {
       "version": "1.0.3",
-      "from": "setprototypeof@1.0.3",
-      "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.0.3.tgz",
+      "integrity": "sha1-ZlZ+NwQ+608E2RvWWMDL77VbjgQ="
     },
     "sha.js": {
       "version": "2.2.6",
-      "from": "sha.js@2.2.6",
-      "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.2.6.tgz"
+      "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.2.6.tgz",
+      "integrity": "sha1-F93t3F9yL7ZlAWWIlUYZd4ZzFbo="
     },
     "shallow-clone": {
       "version": "0.1.2",
-      "from": "shallow-clone@>=0.1.2 <0.2.0",
       "resolved": "https://registry.npmjs.org/shallow-clone/-/shallow-clone-0.1.2.tgz",
+      "integrity": "sha1-WQnodLp3EG1zrEFM/sH/yofZcGA=",
       "dependencies": {
         "kind-of": {
           "version": "2.0.1",
-          "from": "kind-of@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-2.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-2.0.1.tgz",
+          "integrity": "sha1-AY7HpM5+OobLkUG+UZ0kyPqpgbU="
         },
         "lazy-cache": {
           "version": "0.2.7",
-          "from": "lazy-cache@>=0.2.3 <0.3.0",
-          "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-0.2.7.tgz"
+          "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-0.2.7.tgz",
+          "integrity": "sha1-f+3fLctu23fRHvHRF6tf/fCrG2U="
         }
       }
     },
     "shellwords": {
       "version": "0.1.0",
-      "from": "shellwords@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/shellwords/-/shellwords-0.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/shellwords/-/shellwords-0.1.0.tgz",
+      "integrity": "sha1-Zq/Ue2oSky2Qccv9mKUueFzQuhQ="
     },
     "sigmund": {
       "version": "1.0.1",
-      "from": "sigmund@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/sigmund/-/sigmund-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/sigmund/-/sigmund-1.0.1.tgz",
+      "integrity": "sha1-P/IfGYytIXX587eBhT/ZTQ0ZtZA="
     },
     "signal-exit": {
       "version": "3.0.2",
-      "from": "signal-exit@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.2.tgz",
+      "integrity": "sha1-tf3AjxKH6hF4Yo5BXiUTK3NkbG0="
     },
     "sinon": {
       "version": "2.3.2",
-      "from": "sinon@2.3.2",
       "resolved": "https://registry.npmjs.org/sinon/-/sinon-2.3.2.tgz",
+      "integrity": "sha1-xDqcVw8yuqwRWVBc/u0ZEIhV34k=",
       "dependencies": {
         "formatio": {
           "version": "1.2.0",
-          "from": "formatio@1.2.0",
-          "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.2.0.tgz",
+          "integrity": "sha1-87IWfZBoxGmKjVH092CjmlTYGOs="
         },
         "lolex": {
           "version": "1.6.0",
-          "from": "lolex@>=1.6.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz"
+          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
+          "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
         },
         "path-to-regexp": {
           "version": "1.7.0",
-          "from": "path-to-regexp@>=1.7.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.7.0.tgz"
+          "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.7.0.tgz",
+          "integrity": "sha1-Wf3g9DW62suhA6hOnTvGTpa5k30="
         },
         "samsam": {
           "version": "1.2.1",
-          "from": "samsam@>=1.1.3 <2.0.0",
-          "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.2.1.tgz",
+          "integrity": "sha1-7dOQk6MYQ3DLhZJDsr3yVefY6mc="
         },
         "type-detect": {
           "version": "4.0.3",
-          "from": "type-detect@>=4.0.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.0.3.tgz"
+          "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.0.3.tgz",
+          "integrity": "sha1-Dj8mcLRAmbC0bChNE2p+9Jx0wuo="
         }
       }
     },
     "sinon-chai": {
       "version": "2.10.0",
-      "from": "sinon-chai@2.10.0",
-      "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.10.0.tgz"
+      "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.10.0.tgz",
+      "integrity": "sha1-arMAi7jK6ZKedE12ZXS0zzXzS1s="
     },
     "sliced": {
       "version": "1.0.1",
-      "from": "sliced@*",
-      "resolved": "https://registry.npmjs.org/sliced/-/sliced-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/sliced/-/sliced-1.0.1.tgz",
+      "integrity": "sha1-CzpmK10Ewxd7GSa+qCsD+Dei70E="
     },
     "slide": {
       "version": "1.1.6",
-      "from": "slide@>=1.1.5 <2.0.0",
-      "resolved": "https://registry.npmjs.org/slide/-/slide-1.1.6.tgz"
+      "resolved": "https://registry.npmjs.org/slide/-/slide-1.1.6.tgz",
+      "integrity": "sha1-VusCfWW00tzmyy4tMsTUr8nh1wc="
     },
     "sntp": {
       "version": "1.0.9",
-      "from": "sntp@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz"
+      "resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz",
+      "integrity": "sha1-ZUEYTMkK7qbG57NeJlkIJEPGYZg="
     },
     "socket.io": {
       "version": "1.7.4",
-      "from": "socket.io@>=1.4.5 <2.0.0",
       "resolved": "https://registry.npmjs.org/socket.io/-/socket.io-1.7.4.tgz",
+      "integrity": "sha1-L37O3DORvy1cc+KR/iM+bjTU3QA=",
       "dependencies": {
         "debug": {
           "version": "2.3.3",
-          "from": "debug@2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
+          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
+          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
         },
         "object-assign": {
           "version": "4.1.0",
-          "from": "object-assign@4.1.0",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.0.tgz",
+          "integrity": "sha1-ejs9DpgGPUP0wD8uiubNUahog6A="
         }
       }
     },
     "socket.io-adapter": {
       "version": "0.5.0",
-      "from": "socket.io-adapter@0.5.0",
       "resolved": "https://registry.npmjs.org/socket.io-adapter/-/socket.io-adapter-0.5.0.tgz",
+      "integrity": "sha1-y21LuL7IHhB4uZZ3+c7QBGBmu4s=",
       "dependencies": {
         "debug": {
           "version": "2.3.3",
-          "from": "debug@2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
+          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
+          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
         }
       }
     },
     "socket.io-client": {
       "version": "1.7.4",
-      "from": "socket.io-client@1.7.4",
       "resolved": "https://registry.npmjs.org/socket.io-client/-/socket.io-client-1.7.4.tgz",
+      "integrity": "sha1-7J+CA1btme9tNX8HVtZIcXvdQoE=",
       "dependencies": {
         "component-emitter": {
           "version": "1.2.1",
-          "from": "component-emitter@1.2.1",
-          "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz",
+          "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY="
         },
         "debug": {
           "version": "2.3.3",
-          "from": "debug@2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
+          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
         },
         "ms": {
           "version": "0.7.2",
-          "from": "ms@0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
+          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
         }
       }
     },
     "socket.io-parser": {
       "version": "2.3.1",
-      "from": "socket.io-parser@2.3.1",
       "resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-2.3.1.tgz",
+      "integrity": "sha1-3VMgJRA85Clpcya+/WQAX8/ltKA=",
       "dependencies": {
         "debug": {
           "version": "2.2.0",
-          "from": "debug@2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "ms": {
           "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         }
       }
     },
     "sockjs": {
       "version": "0.3.18",
-      "from": "sockjs@0.3.18",
       "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.18.tgz",
+      "integrity": "sha1-2bKJMWyn33dZXvKZ4HXw+TfrQgc=",
       "dependencies": {
         "uuid": {
           "version": "2.0.3",
-          "from": "uuid@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz"
+          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz",
+          "integrity": "sha1-Z+LoY3lyFVMN/zGOW/nc6/1Hsho="
         }
       }
     },
     "sockjs-client": {
       "version": "1.1.2",
-      "from": "sockjs-client@1.1.2",
       "resolved": "https://registry.npmjs.org/sockjs-client/-/sockjs-client-1.1.2.tgz",
+      "integrity": "sha1-8CEqhVDkyUaMjM6u79LjSTwDOtU=",
       "dependencies": {
         "faye-websocket": {
           "version": "0.11.1",
-          "from": "faye-websocket@>=0.11.0 <0.12.0",
-          "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.1.tgz"
+          "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.1.tgz",
+          "integrity": "sha1-8O/hjE9W5PQK/H4Gxxn9XuYYjzg="
         }
       }
     },
     "sort-keys": {
       "version": "1.1.2",
-      "from": "sort-keys@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/sort-keys/-/sort-keys-1.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/sort-keys/-/sort-keys-1.1.2.tgz",
+      "integrity": "sha1-RBttTTRnmPG05J6JIK37oOVD+a0="
     },
     "source-list-map": {
       "version": "0.1.8",
-      "from": "source-list-map@>=0.1.7 <0.2.0",
-      "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-0.1.8.tgz"
+      "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-0.1.8.tgz",
+      "integrity": "sha1-xVCyq1Qn9rPyH1r+rYjE9Vh7IQY="
     },
     "source-map": {
       "version": "0.5.6",
-      "from": "source-map@>=0.5.3 <0.6.0",
-      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz"
+      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz",
+      "integrity": "sha1-dc449SvwczxafwwRjYEzSiu19BI="
     },
     "source-map-loader": {
       "version": "0.1.6",
-      "from": "source-map-loader@>=0.1.5 <0.2.0",
       "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.1.6.tgz",
+      "integrity": "sha1-wJkD2m1zueU7ftjuUkVZcFHpjpE=",
       "dependencies": {
         "async": {
           "version": "0.9.2",
-          "from": "async@>=0.9.0 <0.10.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz",
+          "integrity": "sha1-rqdNXmHB+JlhO/ZL2mbUx48v0X0="
         },
         "source-map": {
           "version": "0.1.43",
-          "from": "source-map@>=0.1.33 <0.2.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz"
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz",
+          "integrity": "sha1-wkvBRspRfBRx9drL4lcbK3+eM0Y="
         }
       }
     },
     "sparkles": {
       "version": "1.0.0",
-      "from": "sparkles@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/sparkles/-/sparkles-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/sparkles/-/sparkles-1.0.0.tgz",
+      "integrity": "sha1-Gsu/tZJDbRC76PeFt8xvgoFQEsM="
     },
     "spdx-correct": {
       "version": "1.0.2",
-      "from": "spdx-correct@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-1.0.2.tgz",
+      "integrity": "sha1-SzBz2TP/UfORLwOsVRlJikFQ20A="
     },
     "spdx-expression-parse": {
       "version": "1.0.4",
-      "from": "spdx-expression-parse@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-1.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-1.0.4.tgz",
+      "integrity": "sha1-m98vIOH0DtRH++JzJmGR/O1RYmw="
     },
     "spdx-license-ids": {
       "version": "1.2.2",
-      "from": "spdx-license-ids@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-1.2.2.tgz"
+      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-1.2.2.tgz",
+      "integrity": "sha1-yd96NCRZSt5r0RkA1ZZpbcBrrFc="
     },
     "spdy": {
       "version": "3.4.7",
-      "from": "spdy@>=3.4.1 <4.0.0",
       "resolved": "https://registry.npmjs.org/spdy/-/spdy-3.4.7.tgz",
+      "integrity": "sha1-Qv9B7OXMD5mjpsKKq7c/XDsDrLw=",
       "dependencies": {
         "debug": {
           "version": "2.6.8",
-          "from": "debug@>=2.6.8 <3.0.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
+          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
         }
       }
     },
     "spdy-transport": {
       "version": "2.0.20",
-      "from": "spdy-transport@>=2.0.18 <3.0.0",
       "resolved": "https://registry.npmjs.org/spdy-transport/-/spdy-transport-2.0.20.tgz",
+      "integrity": "sha1-c15yBUxIayNU/onnAiVgBKOazk0=",
       "dependencies": {
         "debug": {
           "version": "2.6.8",
-          "from": "debug@>=2.6.8 <3.0.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
+          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.2.9 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "split": {
       "version": "0.2.10",
-      "from": "split@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/split/-/split-0.2.10.tgz"
+      "resolved": "https://registry.npmjs.org/split/-/split-0.2.10.tgz",
+      "integrity": "sha1-Zwl8YB1pfOE2j0GPBs0gHPBSGlc="
     },
     "sprintf-js": {
       "version": "1.1.1",
-      "from": "sprintf-js@>=1.0.3 <2.0.0",
-      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.1.1.tgz",
+      "integrity": "sha1-Nr54Mgr+WAH2zqPueLblqrlA6gw="
     },
     "sshpk": {
       "version": "1.13.0",
-      "from": "sshpk@>=1.7.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.13.0.tgz",
+      "integrity": "sha1-/yo+T9BEl1Vf7Zezmg/YL6+zozw=",
       "dependencies": {
         "assert-plus": {
           "version": "1.0.0",
-          "from": "assert-plus@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
         }
       }
     },
     "statuses": {
       "version": "1.3.1",
-      "from": "statuses@>=1.3.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.3.1.tgz"
+      "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.3.1.tgz",
+      "integrity": "sha1-+vUbnrdKrvOzrPStX2Gr8ky3uT4="
     },
     "stdout-stream": {
       "version": "1.4.0",
-      "from": "stdout-stream@>=1.4.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/stdout-stream/-/stdout-stream-1.4.0.tgz",
+      "integrity": "sha1-osfIWH5U2UJ+qe2zrD8s1SLfN4s=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "stream-browserify": {
       "version": "1.0.0",
-      "from": "stream-browserify@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-1.0.0.tgz",
+      "integrity": "sha1-v5tKv7QrJ011FHnkTg/yZWtvEZM="
     },
     "stream-combiner": {
       "version": "0.0.4",
-      "from": "stream-combiner@>=0.0.3 <0.1.0",
-      "resolved": "https://registry.npmjs.org/stream-combiner/-/stream-combiner-0.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/stream-combiner/-/stream-combiner-0.0.4.tgz",
+      "integrity": "sha1-TV5DPBhSYd3mI8o/RMWGvPXErRQ="
     },
     "stream-consume": {
       "version": "0.1.0",
-      "from": "stream-consume@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/stream-consume/-/stream-consume-0.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/stream-consume/-/stream-consume-0.1.0.tgz",
+      "integrity": "sha1-pB6tGm1ggc63n2WwYZAbbY89HQ8="
     },
     "stream-counter": {
       "version": "0.2.0",
-      "from": "stream-counter@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/stream-counter/-/stream-counter-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/stream-counter/-/stream-counter-0.2.0.tgz",
+      "integrity": "sha1-3tJmVWMZyLDiIoErnPOyb6fZR94="
     },
     "stream-http": {
       "version": "2.7.1",
-      "from": "stream-http@>=2.3.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/stream-http/-/stream-http-2.7.1.tgz",
+      "integrity": "sha1-VGpRdBrVprB+njGwsQRBqRffUoo=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.2.6 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "stream-shift": {
       "version": "1.0.0",
-      "from": "stream-shift@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/stream-shift/-/stream-shift-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/stream-shift/-/stream-shift-1.0.0.tgz",
+      "integrity": "sha1-1cdSgl5TZ+eG944Y5EXqIjoVWVI="
     },
     "strict-uri-encode": {
       "version": "1.1.0",
-      "from": "strict-uri-encode@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz",
+      "integrity": "sha1-J5siXfHVgrH1TmWt3UNS4Y+qBxM="
     },
     "string_decoder": {
       "version": "0.10.31",
-      "from": "string_decoder@>=0.10.0 <0.11.0",
-      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
+      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+      "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
     },
     "string-hash": {
       "version": "1.1.3",
-      "from": "string-hash@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/string-hash/-/string-hash-1.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/string-hash/-/string-hash-1.1.3.tgz",
+      "integrity": "sha1-6Kr8CsGFW0Zmkp7X3RJ1311sgRs="
     },
     "string-width": {
       "version": "1.0.2",
-      "from": "string-width@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
+      "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
     },
     "string.prototype.codepointat": {
       "version": "0.2.0",
-      "from": "string.prototype.codepointat@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/string.prototype.codepointat/-/string.prototype.codepointat-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/string.prototype.codepointat/-/string.prototype.codepointat-0.2.0.tgz",
+      "integrity": "sha1-aybpvTr8qnvjtCabUm3huCAArHg="
     },
     "stringify-object": {
       "version": "3.2.0",
-      "from": "stringify-object@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/stringify-object/-/stringify-object-3.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/stringify-object/-/stringify-object-3.2.0.tgz",
+      "integrity": "sha1-lDcKE15BvASDWIE7+ZSB8TFcaqY="
     },
     "stringstream": {
       "version": "0.0.5",
-      "from": "stringstream@>=0.0.4 <0.1.0",
-      "resolved": "https://registry.npmjs.org/stringstream/-/stringstream-0.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/stringstream/-/stringstream-0.0.5.tgz",
+      "integrity": "sha1-TkhM1N5aC7vuGORjB3EKioFiGHg="
     },
     "strip-ansi": {
       "version": "3.0.1",
-      "from": "strip-ansi@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
+      "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8="
     },
     "strip-bom": {
       "version": "1.0.0",
-      "from": "strip-bom@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-1.0.0.tgz",
+      "integrity": "sha1-hbiGLzhEtabV7IRnqTWYFzo295Q="
     },
     "strip-bom-stream": {
       "version": "1.0.0",
-      "from": "strip-bom-stream@>=1.0.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/strip-bom-stream/-/strip-bom-stream-1.0.0.tgz",
+      "integrity": "sha1-5xRDmFd9Uaa+0PoZlPoF9D/ZiO4=",
       "dependencies": {
         "strip-bom": {
           "version": "2.0.0",
-          "from": "strip-bom@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
         }
       }
     },
     "strip-eof": {
       "version": "1.0.0",
-      "from": "strip-eof@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz",
+      "integrity": "sha1-u0P/VZim6wXYm1n80SnJgzE2Br8="
     },
     "strip-indent": {
       "version": "1.0.1",
-      "from": "strip-indent@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-1.0.1.tgz",
+      "integrity": "sha1-DHlipq3vp7vUrDZkYKY4VSrhoKI="
     },
     "strip-json-comments": {
       "version": "2.0.1",
-      "from": "strip-json-comments@>=2.0.1 <2.1.0",
-      "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz",
+      "integrity": "sha1-PFMZQukIwml8DsNEhYwobHygpgo="
     },
     "style-loader": {
       "version": "0.17.0",
-      "from": "style-loader@>=0.17.0 <0.18.0",
       "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.17.0.tgz",
+      "integrity": "sha1-6CVLzNt690vVgnTjYQe01atN8xA=",
       "dependencies": {
         "loader-utils": {
           "version": "1.1.0",
-          "from": "loader-utils@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
+          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
         }
       }
     },
     "sudo": {
       "version": "1.0.3",
-      "from": "sudo@>=1.0.3 <1.1.0",
-      "resolved": "https://registry.npmjs.org/sudo/-/sudo-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/sudo/-/sudo-1.0.3.tgz",
+      "integrity": "sha1-zPKGaRIPi3T4K4Rt/38clRIO/yA="
     },
     "supports-color": {
       "version": "2.0.0",
-      "from": "supports-color@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+      "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
     },
     "svgo": {
       "version": "0.7.2",
-      "from": "svgo@>=0.7.0 <0.8.0",
       "resolved": "https://registry.npmjs.org/svgo/-/svgo-0.7.2.tgz",
+      "integrity": "sha1-n1dyQTlSE1xv779Ar+ak+qiLS7U=",
       "dependencies": {
         "esprima": {
           "version": "2.7.3",
-          "from": "esprima@>=2.6.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz"
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz",
+          "integrity": "sha1-luO3DVd59q1JzQMmc9HDEnZ7pYE="
         },
         "js-yaml": {
           "version": "3.7.0",
-          "from": "js-yaml@>=3.7.0 <3.8.0",
-          "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.7.0.tgz"
+          "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.7.0.tgz",
+          "integrity": "sha1-XJZ93YN6m/3KXy3oQlOr6KHAO4A="
         },
         "sax": {
           "version": "1.2.2",
-          "from": "sax@>=1.2.1 <1.3.0",
-          "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.2.tgz"
+          "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.2.tgz",
+          "integrity": "sha1-/YYxojvHgmvvXYcb24c3jJVkeCg="
         }
       }
     },
     "symbol": {
       "version": "0.2.3",
-      "from": "symbol@>=0.2.1 <0.3.0",
-      "resolved": "https://registry.npmjs.org/symbol/-/symbol-0.2.3.tgz"
+      "resolved": "https://registry.npmjs.org/symbol/-/symbol-0.2.3.tgz",
+      "integrity": "sha1-O5hzuKkB5Hxu/iFSajrDcu8ou8c="
     },
     "tapable": {
       "version": "0.1.10",
-      "from": "tapable@>=0.1.8 <0.2.0",
-      "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.1.10.tgz"
+      "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.1.10.tgz",
+      "integrity": "sha1-KcNXB8K3DlDQdIK10gLo7URtr9Q="
     },
     "tar": {
       "version": "2.2.1",
-      "from": "tar@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/tar/-/tar-2.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/tar/-/tar-2.2.1.tgz",
+      "integrity": "sha1-jk0qJWwOIYXGsYrWlK7JaLg8sdE="
     },
     "term-size": {
       "version": "0.1.1",
-      "from": "term-size@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/term-size/-/term-size-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/term-size/-/term-size-0.1.1.tgz",
+      "integrity": "sha1-hzYLljlsq1dgljcUzaDQy+7K2co="
     },
     "ternary-stream": {
       "version": "2.0.1",
-      "from": "ternary-stream@>=2.0.1 <3.0.0",
-      "resolved": "https://registry.npmjs.org/ternary-stream/-/ternary-stream-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/ternary-stream/-/ternary-stream-2.0.1.tgz",
+      "integrity": "sha1-Bk5Im0tb9gumpre8fy9cJ07Pgmk="
     },
     "text-encoding": {
       "version": "0.6.4",
-      "from": "text-encoding@0.6.4",
-      "resolved": "https://registry.npmjs.org/text-encoding/-/text-encoding-0.6.4.tgz"
+      "resolved": "https://registry.npmjs.org/text-encoding/-/text-encoding-0.6.4.tgz",
+      "integrity": "sha1-45mpgiV6J22uQou5KEXLcb3CbRk="
     },
     "textextensions": {
       "version": "1.0.2",
-      "from": "textextensions@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/textextensions/-/textextensions-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/textextensions/-/textextensions-1.0.2.tgz",
+      "integrity": "sha1-ZUhjk+4fK7A5pgy7oFsLaL2VAdI="
     },
     "throttleit": {
       "version": "1.0.0",
-      "from": "throttleit@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/throttleit/-/throttleit-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/throttleit/-/throttleit-1.0.0.tgz",
+      "integrity": "sha1-nnhYNtr0Z0MUWlmEtiaNgoUorGw="
     },
     "through": {
       "version": "2.3.8",
-      "from": "through@>=2.3.1 <2.4.0",
-      "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz"
+      "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
+      "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU="
     },
     "through2": {
       "version": "2.0.3",
-      "from": "through2@>=2.0.1 <2.1.0",
       "resolved": "https://registry.npmjs.org/through2/-/through2-2.0.3.tgz",
+      "integrity": "sha1-AARWmzfHx0ujnEPzzteNGtlBQL4=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.1.5 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         }
       }
     },
     "through2-concurrent": {
       "version": "1.1.1",
-      "from": "through2-concurrent@1.1.1",
-      "resolved": "https://registry.npmjs.org/through2-concurrent/-/through2-concurrent-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/through2-concurrent/-/through2-concurrent-1.1.1.tgz",
+      "integrity": "sha1-EctOpMnjG8puTB5tukjRxyjDUks="
     },
     "through2-filter": {
       "version": "2.0.0",
-      "from": "through2-filter@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/through2-filter/-/through2-filter-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/through2-filter/-/through2-filter-2.0.0.tgz",
+      "integrity": "sha1-YLxVoNrLdghdsfna6Zq0P4PWIuw="
     },
     "tildify": {
       "version": "1.2.0",
-      "from": "tildify@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/tildify/-/tildify-1.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/tildify/-/tildify-1.2.0.tgz",
+      "integrity": "sha1-3OwD9V3Km3qj5bBPIYF+tW5jWIo="
     },
     "time-stamp": {
       "version": "1.1.0",
-      "from": "time-stamp@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/time-stamp/-/time-stamp-1.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/time-stamp/-/time-stamp-1.1.0.tgz",
+      "integrity": "sha1-dkpaEa9QVhkhsTPztE5hhofg9cM="
     },
     "timed-out": {
       "version": "3.1.3",
-      "from": "timed-out@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-3.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-3.1.3.tgz",
+      "integrity": "sha1-lYYL/MXHbCd/j4Mm/Q9bLiDrohc="
     },
     "timers-browserify": {
       "version": "1.4.2",
-      "from": "timers-browserify@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-1.4.2.tgz"
+      "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-1.4.2.tgz",
+      "integrity": "sha1-ycWLV1voQHN1y14kYtrO50NZ9B0="
     },
     "tiny-lr": {
       "version": "0.2.1",
-      "from": "tiny-lr@>=0.2.1 <0.3.0",
       "resolved": "https://registry.npmjs.org/tiny-lr/-/tiny-lr-0.2.1.tgz",
+      "integrity": "sha1-s/26gC5dVqM8L28QeUsy5Hescp0=",
       "dependencies": {
         "body-parser": {
           "version": "1.14.2",
-          "from": "body-parser@>=1.14.0 <1.15.0",
           "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.14.2.tgz",
+          "integrity": "sha1-EBXLH+LEQ4WCWVgdtTMy+NDPUPk=",
           "dependencies": {
             "qs": {
               "version": "5.2.0",
-              "from": "qs@5.2.0",
-              "resolved": "https://registry.npmjs.org/qs/-/qs-5.2.0.tgz"
+              "resolved": "https://registry.npmjs.org/qs/-/qs-5.2.0.tgz",
+              "integrity": "sha1-qfMRQq9GjLcrJbMBNrokVoNJFr4="
             }
           }
         },
         "bytes": {
           "version": "2.2.0",
-          "from": "bytes@2.2.0",
-          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.2.0.tgz",
+          "integrity": "sha1-/TVGSkA/b5EXwt42Cez/nK4ABYg="
         },
         "debug": {
           "version": "2.2.0",
-          "from": "debug@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "http-errors": {
           "version": "1.3.1",
-          "from": "http-errors@>=1.3.1 <1.4.0",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz"
+          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
+          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
         },
         "iconv-lite": {
           "version": "0.4.13",
-          "from": "iconv-lite@0.4.13",
-          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.13.tgz"
+          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.13.tgz",
+          "integrity": "sha1-H4irpKsLFQjoMSrMOTRfNumS4vI="
         },
         "ms": {
           "version": "0.7.1",
-          "from": "ms@0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz"
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         },
         "qs": {
           "version": "5.1.0",
-          "from": "qs@>=5.1.0 <5.2.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-5.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/qs/-/qs-5.1.0.tgz",
+          "integrity": "sha1-TZMuXH6kEcynajEtOaYGIA/VDNk="
         },
         "raw-body": {
           "version": "2.1.7",
-          "from": "raw-body@>=2.1.5 <2.2.0",
           "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.1.7.tgz",
+          "integrity": "sha1-rf6s4uT7MJgFgBTQjActzFl1h3Q=",
           "dependencies": {
             "bytes": {
               "version": "2.4.0",
-              "from": "bytes@2.4.0",
-              "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz"
+              "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz",
+              "integrity": "sha1-fZcZb51br39pNeJZhVSe3SpsIzk="
             }
           }
         }
@@ -8903,85 +8764,85 @@
     },
     "tmp": {
       "version": "0.0.31",
-      "from": "tmp@>=0.0.0 <0.1.0",
-      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.31.tgz"
+      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.31.tgz",
+      "integrity": "sha1-jzirlDjhcxXl29izZX6L+yd65Kc="
     },
     "to-absolute-glob": {
       "version": "0.1.1",
-      "from": "to-absolute-glob@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/to-absolute-glob/-/to-absolute-glob-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/to-absolute-glob/-/to-absolute-glob-0.1.1.tgz",
+      "integrity": "sha1-HN+kcqnvUMI57maZm2YsoOs5k38="
     },
     "to-array": {
       "version": "0.1.4",
-      "from": "to-array@0.1.4",
-      "resolved": "https://registry.npmjs.org/to-array/-/to-array-0.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/to-array/-/to-array-0.1.4.tgz",
+      "integrity": "sha1-F+bBH3PdTz10zaek/zI46a2b+JA="
     },
     "to-arraybuffer": {
       "version": "1.0.1",
-      "from": "to-arraybuffer@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/to-arraybuffer/-/to-arraybuffer-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/to-arraybuffer/-/to-arraybuffer-1.0.1.tgz",
+      "integrity": "sha1-fSKbH8xjfkZsoIEYCDanqr/4P0M="
     },
     "to-iso-string": {
       "version": "0.0.2",
-      "from": "to-iso-string@0.0.2",
-      "resolved": "https://registry.npmjs.org/to-iso-string/-/to-iso-string-0.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/to-iso-string/-/to-iso-string-0.0.2.tgz",
+      "integrity": "sha1-TcGeZk38y+Jb2NtQiwDG2hWCVdE="
     },
     "tough-cookie": {
       "version": "2.3.2",
-      "from": "tough-cookie@>=2.3.0 <2.4.0",
-      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.2.tgz"
+      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.2.tgz",
+      "integrity": "sha1-8IH3bkyFcg5sN6X6ztc3FQ2EByo="
     },
     "trim-newlines": {
       "version": "1.0.0",
-      "from": "trim-newlines@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/trim-newlines/-/trim-newlines-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/trim-newlines/-/trim-newlines-1.0.0.tgz",
+      "integrity": "sha1-WIeWa7WCpFA6QetST301ARgVphM="
     },
     "try-json-parse": {
       "version": "0.1.1",
-      "from": "try-json-parse@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/try-json-parse/-/try-json-parse-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/try-json-parse/-/try-json-parse-0.1.1.tgz",
+      "integrity": "sha1-jbAWIuh35RuDFAyu58gIZK05DII="
     },
     "ts-loader": {
       "version": "2.1.0",
-      "from": "ts-loader@>=2.0.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/ts-loader/-/ts-loader-2.1.0.tgz",
+      "integrity": "sha1-Wo78xccsBvxJ1putachWF8YZT3c=",
       "dependencies": {
         "enhanced-resolve": {
           "version": "3.1.0",
-          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz",
+          "integrity": "sha1-n0tib1dyRe3PSyrYPYbhf09CHew="
         },
         "loader-utils": {
           "version": "1.1.0",
-          "from": "loader-utils@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
+          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
         },
         "tapable": {
           "version": "0.2.6",
-          "from": "tapable@>=0.2.5 <0.3.0",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz",
+          "integrity": "sha1-IGvo4YiGC1FEJTdebxrom/sB/Y0="
         }
       }
     },
     "tslib": {
       "version": "1.7.1",
-      "from": "tslib@>=1.6.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.7.1.tgz"
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.7.1.tgz",
+      "integrity": "sha1-vIAEFkaRkjp5/oN4u+s9ogF1OOw="
     },
     "tslint": {
       "version": "4.0.2",
-      "from": "tslint@4.0.2",
       "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.0.2.tgz",
+      "integrity": "sha1-1D8kwMH4Jt5/Ogl7t4CKi0Ml/qw=",
       "dependencies": {
         "findup-sync": {
           "version": "0.3.0",
-          "from": "findup-sync@>=0.3.0 <0.4.0",
           "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.3.0.tgz",
+          "integrity": "sha1-N5MKpdgWt3fANEXhlmzGeQpMCxY=",
           "dependencies": {
             "glob": {
               "version": "5.0.15",
-              "from": "glob@>=5.0.0 <5.1.0",
-              "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz"
+              "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
+              "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
             }
           }
         }
@@ -8989,968 +8850,968 @@
     },
     "tslint-microsoft-contrib": {
       "version": "4.0.0",
-      "from": "tslint-microsoft-contrib@4.0.0",
-      "resolved": "https://registry.npmjs.org/tslint-microsoft-contrib/-/tslint-microsoft-contrib-4.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/tslint-microsoft-contrib/-/tslint-microsoft-contrib-4.0.0.tgz",
+      "integrity": "sha1-fgClbBQXJR0/kaiA78xDNhpp+yo="
     },
     "tsscmp": {
       "version": "1.0.5",
-      "from": "tsscmp@1.0.5",
-      "resolved": "https://registry.npmjs.org/tsscmp/-/tsscmp-1.0.5.tgz"
+      "resolved": "https://registry.npmjs.org/tsscmp/-/tsscmp-1.0.5.tgz",
+      "integrity": "sha1-fcSjOvcVgatDN9qR2FylQn69mpc="
     },
     "tsutils": {
       "version": "1.9.1",
-      "from": "tsutils@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-1.9.1.tgz"
+      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-1.9.1.tgz",
+      "integrity": "sha1-ufmrROVa+WgYMdXyjQrur1x1DLA="
     },
     "tty-browserify": {
       "version": "0.0.0",
-      "from": "tty-browserify@0.0.0",
-      "resolved": "https://registry.npmjs.org/tty-browserify/-/tty-browserify-0.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/tty-browserify/-/tty-browserify-0.0.0.tgz",
+      "integrity": "sha1-oVe6QC2iTpv5V/mqadUk7tQpAaY="
     },
     "tunnel-agent": {
       "version": "0.6.0",
-      "from": "tunnel-agent@>=0.6.0 <0.7.0",
-      "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.6.0.tgz",
+      "integrity": "sha1-J6XeoGs2sEoKmWZ3SykIaPD8QP0="
     },
     "tweetnacl": {
       "version": "0.14.5",
-      "from": "tweetnacl@>=0.14.0 <0.15.0",
       "resolved": "https://registry.npmjs.org/tweetnacl/-/tweetnacl-0.14.5.tgz",
+      "integrity": "sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q=",
       "optional": true
     },
     "type-check": {
       "version": "0.3.2",
-      "from": "type-check@>=0.3.2 <0.4.0",
-      "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.3.2.tgz"
+      "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.3.2.tgz",
+      "integrity": "sha1-WITKtRLPHTVeP7eE8wgEsrUg23I="
     },
     "type-detect": {
       "version": "1.0.0",
-      "from": "type-detect@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-1.0.0.tgz",
+      "integrity": "sha1-diIXzAbbJY7EiQihKY6LlRIejqI="
     },
     "type-is": {
       "version": "1.6.15",
-      "from": "type-is@>=1.6.15 <1.7.0",
-      "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.15.tgz"
+      "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.15.tgz",
+      "integrity": "sha1-yrEPtJCeRByChC6v4a1kbIGARBA="
     },
     "typedarray": {
       "version": "0.0.6",
-      "from": "typedarray@>=0.0.5 <0.1.0",
-      "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz"
+      "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
+      "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
     },
     "typescript": {
       "version": "2.3.3",
-      "from": "typescript@2.3.3",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.3.3.tgz"
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.3.3.tgz",
+      "integrity": "sha1-ljnzw7QBSOjKl/4IpR3RiRu2viI="
     },
     "ua-parser-js": {
       "version": "0.7.12",
-      "from": "ua-parser-js@>=0.7.9 <0.8.0",
-      "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.12.tgz"
+      "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.12.tgz",
+      "integrity": "sha1-BMgamb3V3FImPqKdJMa/jUgYpLs="
     },
     "uglify-js": {
       "version": "2.8.27",
-      "from": "uglify-js@>=2.6.0 <3.0.0",
       "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.8.27.tgz",
+      "integrity": "sha1-R3h/kSsPJC5bmENDvo416V9pTJw=",
       "dependencies": {
         "camelcase": {
           "version": "1.2.1",
-          "from": "camelcase@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
+          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
         },
         "cliui": {
           "version": "2.1.0",
-          "from": "cliui@>=2.1.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
+          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE="
         },
         "window-size": {
           "version": "0.1.0",
-          "from": "window-size@0.1.0",
-          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
+          "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
         },
         "wordwrap": {
           "version": "0.0.2",
-          "from": "wordwrap@0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
+          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
         },
         "yargs": {
           "version": "3.10.0",
-          "from": "yargs@>=3.10.0 <3.11.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz"
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
+          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
         }
       }
     },
     "uglify-to-browserify": {
       "version": "1.0.2",
-      "from": "uglify-to-browserify@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/uglify-to-browserify/-/uglify-to-browserify-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/uglify-to-browserify/-/uglify-to-browserify-1.0.2.tgz",
+      "integrity": "sha1-bgkk1r2mta/jSeOabWMoUKD4grc="
     },
     "uglifyjs-webpack-plugin": {
       "version": "0.4.3",
-      "from": "uglifyjs-webpack-plugin@>=0.4.3 <0.5.0",
-      "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-0.4.3.tgz"
+      "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-0.4.3.tgz",
+      "integrity": "sha1-pnKn1mVflN+n4JZw1IAw83zJMmc="
     },
     "uid-safe": {
       "version": "2.1.4",
-      "from": "uid-safe@2.1.4",
-      "resolved": "https://registry.npmjs.org/uid-safe/-/uid-safe-2.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/uid-safe/-/uid-safe-2.1.4.tgz",
+      "integrity": "sha1-Otbzg2jG1MjHXsF2I/t5qh0HHYE="
     },
     "ultron": {
       "version": "1.0.2",
-      "from": "ultron@>=1.0.0 <1.1.0",
-      "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.0.2.tgz",
+      "integrity": "sha1-rOEWq1V80Zc4ak6I9GhTeMiy5Po="
     },
     "unc-path-regex": {
       "version": "0.1.2",
-      "from": "unc-path-regex@>=0.1.0 <0.2.0",
-      "resolved": "https://registry.npmjs.org/unc-path-regex/-/unc-path-regex-0.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/unc-path-regex/-/unc-path-regex-0.1.2.tgz",
+      "integrity": "sha1-5z3T17DXxe2G+6xrCufYxqadUPo="
     },
     "underscore": {
       "version": "1.4.4",
-      "from": "underscore@>=1.4.4 <1.5.0",
-      "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.4.4.tgz"
+      "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.4.4.tgz",
+      "integrity": "sha1-YaajIBBiKvoHljvzJSA88SI51gQ="
     },
     "underscore.string": {
       "version": "3.3.4",
-      "from": "underscore.string@>=3.3.4 <4.0.0",
-      "resolved": "https://registry.npmjs.org/underscore.string/-/underscore.string-3.3.4.tgz"
+      "resolved": "https://registry.npmjs.org/underscore.string/-/underscore.string-3.3.4.tgz",
+      "integrity": "sha1-LCo/n4PmR2L9xF5s6sZRQoZCE9s="
     },
     "uniq": {
       "version": "1.0.1",
-      "from": "uniq@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/uniq/-/uniq-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/uniq/-/uniq-1.0.1.tgz",
+      "integrity": "sha1-sxxa6CVIRKOoKBVBzisEuGWnNP8="
     },
     "uniqid": {
       "version": "4.1.1",
-      "from": "uniqid@>=4.0.0 <5.0.0",
-      "resolved": "https://registry.npmjs.org/uniqid/-/uniqid-4.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/uniqid/-/uniqid-4.1.1.tgz",
+      "integrity": "sha1-iSIN32t1GuUrX3JISGNShZa7hME="
     },
     "uniqs": {
       "version": "2.0.0",
-      "from": "uniqs@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/uniqs/-/uniqs-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/uniqs/-/uniqs-2.0.0.tgz",
+      "integrity": "sha1-/+3ks2slKQaW5uFl1KWe25mOawI="
     },
     "unique-stream": {
       "version": "1.0.0",
-      "from": "unique-stream@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-1.0.0.tgz",
+      "integrity": "sha1-1ZpKdUJ0R9mqbJHnAmP40mpLEEs="
     },
     "unique-string": {
       "version": "1.0.0",
-      "from": "unique-string@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/unique-string/-/unique-string-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/unique-string/-/unique-string-1.0.0.tgz",
+      "integrity": "sha1-nhBXzKhRq7kzmPizOuGHuZyuwRo="
     },
     "unpipe": {
       "version": "1.0.0",
-      "from": "unpipe@1.0.0",
-      "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz",
+      "integrity": "sha1-sr9O6FFKrmFltIF4KdIbLvSZBOw="
     },
     "unzip-response": {
       "version": "1.0.2",
-      "from": "unzip-response@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-1.0.2.tgz",
+      "integrity": "sha1-uYTwh3/AqJwsdzzB73tbIytbBv4="
     },
     "update-notifier": {
       "version": "1.0.3",
-      "from": "update-notifier@>=1.0.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-1.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-1.0.3.tgz",
+      "integrity": "sha1-j5LFFUgr1oMbfJMBPnD4dVLHz1o="
     },
     "upper-case": {
       "version": "1.1.3",
-      "from": "upper-case@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/upper-case/-/upper-case-1.1.3.tgz"
+      "resolved": "https://registry.npmjs.org/upper-case/-/upper-case-1.1.3.tgz",
+      "integrity": "sha1-9rRQHC7EzdJrp4vnIilh3ndiFZg="
     },
     "url": {
       "version": "0.10.3",
-      "from": "url@>=0.10.1 <0.11.0",
       "resolved": "https://registry.npmjs.org/url/-/url-0.10.3.tgz",
+      "integrity": "sha1-Ah5NnHcF8hu/N9A861h2dAJ3TGQ=",
       "dependencies": {
         "punycode": {
           "version": "1.3.2",
-          "from": "punycode@1.3.2",
-          "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
+          "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
+          "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
         }
       }
     },
     "url-parse": {
       "version": "1.1.9",
-      "from": "url-parse@>=1.1.1 <2.0.0",
       "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.1.9.tgz",
+      "integrity": "sha1-xn8dd11R8KGJEd17P/rSe7nlvRk=",
       "dependencies": {
         "querystringify": {
           "version": "1.0.0",
-          "from": "querystringify@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-1.0.0.tgz",
+          "integrity": "sha1-YoYkIRLFtxL6ZU5SZlK/ahP/Bcs="
         }
       }
     },
     "url-parse-lax": {
       "version": "1.0.0",
-      "from": "url-parse-lax@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/url-parse-lax/-/url-parse-lax-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/url-parse-lax/-/url-parse-lax-1.0.0.tgz",
+      "integrity": "sha1-evjzA2Rem9eaJy56FKxovAYJ2nM="
     },
     "user-home": {
       "version": "1.1.1",
-      "from": "user-home@>=1.1.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/user-home/-/user-home-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/user-home/-/user-home-1.1.1.tgz",
+      "integrity": "sha1-K1viOjK2Onyd640PKNSFcko98ZA="
     },
     "useragent": {
       "version": "2.1.13",
-      "from": "useragent@>=2.1.6 <3.0.0",
       "resolved": "https://registry.npmjs.org/useragent/-/useragent-2.1.13.tgz",
+      "integrity": "sha1-u6Q+iqJNXOuDwpN0c+EC4h33TBA=",
       "dependencies": {
         "lru-cache": {
           "version": "2.2.4",
-          "from": "lru-cache@>=2.2.0 <2.3.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.2.4.tgz"
+          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.2.4.tgz",
+          "integrity": "sha1-bGWGGb7PFAMdDQtZSxYELOTcBj0="
         }
       }
     },
     "util": {
       "version": "0.10.3",
-      "from": "util@>=0.10.3 <1.0.0",
       "resolved": "https://registry.npmjs.org/util/-/util-0.10.3.tgz",
+      "integrity": "sha1-evsa/lCAUkZInj23/g7TeTNqwPk=",
       "dependencies": {
         "inherits": {
           "version": "2.0.1",
-          "from": "inherits@2.0.1",
-          "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.1.tgz",
+          "integrity": "sha1-sX0I0ya0Qj5Wjv9xn5GwscvfafE="
         }
       }
     },
     "util-deprecate": {
       "version": "1.0.2",
-      "from": "util-deprecate@>=1.0.1 <1.1.0",
-      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
+      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8="
     },
     "utils-merge": {
       "version": "1.0.0",
-      "from": "utils-merge@1.0.0",
-      "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.0.tgz",
+      "integrity": "sha1-ApT7kiu5N1FTVBxPcJYjHyh8ivg="
     },
     "uuid": {
       "version": "3.0.1",
-      "from": "uuid@>=3.0.0 <4.0.0",
-      "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.0.1.tgz",
+      "integrity": "sha1-ZUS7ot/ajBzxfmKaOjBeK7H+5sE="
     },
     "v8flags": {
       "version": "2.1.1",
-      "from": "v8flags@>=2.0.2 <3.0.0",
-      "resolved": "https://registry.npmjs.org/v8flags/-/v8flags-2.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/v8flags/-/v8flags-2.1.1.tgz",
+      "integrity": "sha1-qrGh+jDUX4jdMhFIh1rALAtV5bQ="
     },
     "vali-date": {
       "version": "1.0.0",
-      "from": "vali-date@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/vali-date/-/vali-date-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/vali-date/-/vali-date-1.0.0.tgz",
+      "integrity": "sha1-G5BKWWCfsyjvB4E4Qgk09rhnCaY="
     },
     "validate-npm-package-license": {
       "version": "3.0.1",
-      "from": "validate-npm-package-license@>=3.0.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.1.tgz",
+      "integrity": "sha1-KAS6vnEq0zeUWaz74kdGqywwP7w="
     },
     "validator": {
       "version": "5.7.0",
-      "from": "validator@>=5.0.0 <6.0.0",
-      "resolved": "https://registry.npmjs.org/validator/-/validator-5.7.0.tgz"
+      "resolved": "https://registry.npmjs.org/validator/-/validator-5.7.0.tgz",
+      "integrity": "sha1-eoelgUa2laxIYHEUHAxJ1n2gXlw="
     },
     "vary": {
       "version": "1.1.1",
-      "from": "vary@>=1.1.0 <1.2.0",
-      "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.1.tgz",
+      "integrity": "sha1-Z1Neu2lMHVIldFeYRmUyP1h+jTc="
     },
     "vendors": {
       "version": "1.0.1",
-      "from": "vendors@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/vendors/-/vendors-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/vendors/-/vendors-1.0.1.tgz",
+      "integrity": "sha1-N61zyO5Bf7PVgOeFMSMH0nSEfyI="
     },
     "verror": {
       "version": "1.3.6",
-      "from": "verror@1.3.6",
-      "resolved": "https://registry.npmjs.org/verror/-/verror-1.3.6.tgz"
+      "resolved": "https://registry.npmjs.org/verror/-/verror-1.3.6.tgz",
+      "integrity": "sha1-z/XfEpRtKX0rqu+qJoniW+AcAFw="
     },
     "vhost": {
       "version": "3.0.2",
-      "from": "vhost@>=3.0.1 <3.1.0",
-      "resolved": "https://registry.npmjs.org/vhost/-/vhost-3.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/vhost/-/vhost-3.0.2.tgz",
+      "integrity": "sha1-L7HezUxGaqiLD5NBrzPcGv8keNU="
     },
     "vinyl": {
       "version": "0.5.3",
-      "from": "vinyl@>=0.5.0 <0.6.0",
-      "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.5.3.tgz"
+      "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.5.3.tgz",
+      "integrity": "sha1-sEVbOPxeDPMNQyUTLkYZcMIJHN4="
     },
     "vinyl-bufferstream": {
       "version": "1.0.1",
-      "from": "vinyl-bufferstream@>=1.0.1 <2.0.0",
-      "resolved": "https://registry.npmjs.org/vinyl-bufferstream/-/vinyl-bufferstream-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/vinyl-bufferstream/-/vinyl-bufferstream-1.0.1.tgz",
+      "integrity": "sha1-BTeGn1gO/6TKRay0dXnkuf5jCBo="
     },
     "vinyl-fs": {
       "version": "0.3.14",
-      "from": "vinyl-fs@>=0.3.0 <0.4.0",
       "resolved": "https://registry.npmjs.org/vinyl-fs/-/vinyl-fs-0.3.14.tgz",
+      "integrity": "sha1-mmhRzhysHBzqX+hsCTHWIMLPqeY=",
       "dependencies": {
         "clone": {
           "version": "0.2.0",
-          "from": "clone@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/clone/-/clone-0.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/clone/-/clone-0.2.0.tgz",
+          "integrity": "sha1-xhJqkK1Pctv1rNskPMN3JP6T/B8="
         },
         "graceful-fs": {
           "version": "3.0.11",
-          "from": "graceful-fs@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-3.0.11.tgz"
+          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-3.0.11.tgz",
+          "integrity": "sha1-dhPHeKGv6mLyXGMKCG1/Osu92Bg="
         },
         "readable-stream": {
           "version": "1.0.34",
-          "from": "readable-stream@>=1.0.33-1 <1.1.0-0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
         },
         "through2": {
           "version": "0.6.5",
-          "from": "through2@>=0.6.1 <0.7.0",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz"
+          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
+          "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg="
         },
         "vinyl": {
           "version": "0.4.6",
-          "from": "vinyl@>=0.4.0 <0.5.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.4.6.tgz"
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.4.6.tgz",
+          "integrity": "sha1-LzVsh6VQolVGHza76ypbqL94SEc="
         }
       }
     },
     "vinyl-ftp": {
       "version": "0.6.0",
-      "from": "vinyl-ftp@0.6.0",
       "resolved": "https://registry.npmjs.org/vinyl-ftp/-/vinyl-ftp-0.6.0.tgz",
+      "integrity": "sha1-L7Q+xNWKLkwGtAblac7ps6pd+Mo=",
       "dependencies": {
         "clone-stats": {
           "version": "1.0.0",
-          "from": "clone-stats@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-1.0.0.tgz",
+          "integrity": "sha1-s3gt/4u1R04Yuba/D9/ngvh3doA="
         },
         "replace-ext": {
           "version": "1.0.0",
-          "from": "replace-ext@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-1.0.0.tgz",
+          "integrity": "sha1-3mMSg3P8v3w8z6TeWkgMRaZ5WOs="
         },
         "vinyl": {
           "version": "2.0.2",
-          "from": "vinyl@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-2.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-2.0.2.tgz",
+          "integrity": "sha1-CjcT2NTpIhxY8QyhbAEWyeJe2nw="
         }
       }
     },
     "vinyl-sourcemaps-apply": {
       "version": "0.2.1",
-      "from": "vinyl-sourcemaps-apply@>=0.2.1 <0.3.0",
-      "resolved": "https://registry.npmjs.org/vinyl-sourcemaps-apply/-/vinyl-sourcemaps-apply-0.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/vinyl-sourcemaps-apply/-/vinyl-sourcemaps-apply-0.2.1.tgz",
+      "integrity": "sha1-q2VJ1h0XLCsbh75cUI0jnI74dwU="
     },
     "vm-browserify": {
       "version": "0.0.4",
-      "from": "vm-browserify@0.0.4",
-      "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-0.0.4.tgz"
+      "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-0.0.4.tgz",
+      "integrity": "sha1-XX6kW7755Kb/ZflUOOCofDV9WnM="
     },
     "void-elements": {
       "version": "2.0.1",
-      "from": "void-elements@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/void-elements/-/void-elements-2.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/void-elements/-/void-elements-2.0.1.tgz",
+      "integrity": "sha1-wGavtYK7HLQSjWDqkjkulNXp2+w="
     },
     "watchpack": {
       "version": "0.2.9",
-      "from": "watchpack@>=0.2.1 <0.3.0",
       "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-0.2.9.tgz",
+      "integrity": "sha1-Yuqkq15bo1/fwBgnVibjwPXj+ws=",
       "dependencies": {
         "async": {
           "version": "0.9.2",
-          "from": "async@>=0.9.0 <0.10.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz"
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz",
+          "integrity": "sha1-rqdNXmHB+JlhO/ZL2mbUx48v0X0="
         }
       }
     },
     "wbuf": {
       "version": "1.7.2",
-      "from": "wbuf@>=1.7.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/wbuf/-/wbuf-1.7.2.tgz"
+      "resolved": "https://registry.npmjs.org/wbuf/-/wbuf-1.7.2.tgz",
+      "integrity": "sha1-1pe5nx9ZUS3ydRvkJ2nBWAtYAf4="
     },
     "webpack": {
       "version": "2.2.1",
-      "from": "webpack@2.2.1",
       "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.2.1.tgz",
+      "integrity": "sha1-e7HXKuIIfdGkr1Jq/sFe7RfdpHU=",
       "dependencies": {
         "acorn": {
           "version": "4.0.13",
-          "from": "acorn@>=4.0.4 <5.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz"
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
+          "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c="
         },
         "async": {
           "version": "2.4.1",
-          "from": "async@>=2.1.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz"
+          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
+          "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c="
         },
         "camelcase": {
           "version": "3.0.0",
-          "from": "camelcase@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
+          "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
         },
         "constants-browserify": {
           "version": "1.0.0",
-          "from": "constants-browserify@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz",
+          "integrity": "sha1-wguW2MYXdIqvHBYCF2DNJ/y4y3U="
         },
         "crypto-browserify": {
           "version": "3.11.0",
-          "from": "crypto-browserify@>=3.11.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz"
+          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz",
+          "integrity": "sha1-NlKgkGq5sqfgw85mpAjpV6JIVSI="
         },
         "enhanced-resolve": {
           "version": "3.1.0",
-          "from": "enhanced-resolve@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz",
+          "integrity": "sha1-n0tib1dyRe3PSyrYPYbhf09CHew="
         },
         "https-browserify": {
           "version": "0.0.1",
-          "from": "https-browserify@0.0.1",
-          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz",
+          "integrity": "sha1-P5E2XKvmC3ftDruiS0VOPgnZWoI="
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "node-libs-browser": {
           "version": "2.0.0",
-          "from": "node-libs-browser@>=2.0.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz",
+          "integrity": "sha1-o6WeyXAkmFtG6Vg3lkb5bEthZkY="
         },
         "os-browserify": {
           "version": "0.2.1",
-          "from": "os-browserify@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz",
+          "integrity": "sha1-Y/xMzuXS13Y9Jrv4YBB45sLgBE8="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.5 <3.0.0",
           "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g=",
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "from": "string_decoder@>=1.0.0 <1.1.0",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+              "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
             }
           }
         },
         "stream-browserify": {
           "version": "2.0.1",
-          "from": "stream-browserify@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz",
+          "integrity": "sha1-ZiZu5fm9uZQKTkUUyvtDu3Hlyds="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         },
         "tapable": {
           "version": "0.2.6",
-          "from": "tapable@>=0.2.5 <0.3.0",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz"
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz",
+          "integrity": "sha1-IGvo4YiGC1FEJTdebxrom/sB/Y0="
         },
         "timers-browserify": {
           "version": "2.0.2",
-          "from": "timers-browserify@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz",
+          "integrity": "sha1-q0iDz1l9zVCvIRNJoA+8pWrIa4Y="
         },
         "url": {
           "version": "0.11.0",
-          "from": "url@>=0.11.0 <0.12.0",
           "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
+          "integrity": "sha1-ODjpfPxgUh63PFJajlW/3Z4uKPE=",
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "from": "punycode@1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
+              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
+              "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
             }
           }
         },
         "watchpack": {
           "version": "1.3.1",
-          "from": "watchpack@>=1.2.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz"
+          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz",
+          "integrity": "sha1-fYaTkHsozmAT5/NhCqKhrPB9rYc="
         },
         "webpack-sources": {
           "version": "0.1.5",
-          "from": "webpack-sources@>=0.1.4 <0.2.0",
-          "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-0.1.5.tgz"
+          "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-0.1.5.tgz",
+          "integrity": "sha1-qh86vw8NdNtxEcQOUAuE+WZkB1A="
         },
         "yargs": {
           "version": "6.6.0",
-          "from": "yargs@>=6.0.0 <7.0.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz",
+          "integrity": "sha1-eC7CHvQDNF+DCoCMo9UTr1YGUgg="
         },
         "yargs-parser": {
           "version": "4.2.1",
-          "from": "yargs-parser@>=4.2.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz",
+          "integrity": "sha1-KczqwNxPA8bIe0qfIX3RjJ90hxw="
         }
       }
     },
     "webpack-bundle-analyzer": {
       "version": "2.8.2",
-      "from": "webpack-bundle-analyzer@>=2.2.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.8.2.tgz",
+      "integrity": "sha1-i2JAwpqdY7xy8J2SD7BQrbzOn+g=",
       "dependencies": {
         "acorn": {
           "version": "5.0.3",
-          "from": "acorn@>=5.0.3 <6.0.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz"
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz",
+          "integrity": "sha1-xGDfCEkUY/AozLguqzcwvwEIez0="
         },
         "etag": {
           "version": "1.8.0",
-          "from": "etag@>=1.8.0 <1.9.0",
-          "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.0.tgz"
+          "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.0.tgz",
+          "integrity": "sha1-b2Ma7zNtbEY2K1F2QETOIWvjwFE="
         },
         "express": {
           "version": "4.15.3",
-          "from": "express@>=4.15.2 <5.0.0",
-          "resolved": "https://registry.npmjs.org/express/-/express-4.15.3.tgz"
+          "resolved": "https://registry.npmjs.org/express/-/express-4.15.3.tgz",
+          "integrity": "sha1-urZdDwOqgMNYQIly/HAPkWlEtmI="
         },
         "fresh": {
           "version": "0.5.0",
-          "from": "fresh@0.5.0",
-          "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.0.tgz"
+          "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.0.tgz",
+          "integrity": "sha1-9HTKXmqSRtb9jglTz6m5yAWvp44="
         },
         "lodash": {
           "version": "4.17.4",
-          "from": "lodash@>=4.17.4 <5.0.0",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz"
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
         },
         "mime": {
           "version": "1.3.4",
-          "from": "mime@1.3.4",
-          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz"
+          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz",
+          "integrity": "sha1-EV+eO2s9rylZmDyzjxSaLUDrXVM="
         },
         "send": {
           "version": "0.15.3",
-          "from": "send@0.15.3",
-          "resolved": "https://registry.npmjs.org/send/-/send-0.15.3.tgz"
+          "resolved": "https://registry.npmjs.org/send/-/send-0.15.3.tgz",
+          "integrity": "sha1-UBP5+ZAj31DRvZiSwZ4979HVMwk="
         },
         "serve-static": {
           "version": "1.12.3",
-          "from": "serve-static@1.12.3",
-          "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.12.3.tgz"
+          "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.12.3.tgz",
+          "integrity": "sha1-n0uhni8wMMVH+K+ZEHg47DjVseI="
         },
         "ultron": {
           "version": "1.1.0",
-          "from": "ultron@>=1.1.0 <1.2.0",
-          "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.1.0.tgz",
+          "integrity": "sha1-sHoualQagV/Go0zNRTO67DB8qGQ="
         },
         "ws": {
           "version": "2.3.1",
-          "from": "ws@>=2.3.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/ws/-/ws-2.3.1.tgz"
+          "resolved": "https://registry.npmjs.org/ws/-/ws-2.3.1.tgz",
+          "integrity": "sha1-a5Sz5EfLajY/eF6vlK9jWejoHIA="
         }
       }
     },
     "webpack-core": {
       "version": "0.6.9",
-      "from": "webpack-core@>=0.6.0 <0.7.0",
       "resolved": "https://registry.npmjs.org/webpack-core/-/webpack-core-0.6.9.tgz",
+      "integrity": "sha1-/FcViMhVjad76e+23r3Fo7FyvcI=",
       "dependencies": {
         "source-map": {
           "version": "0.4.4",
-          "from": "source-map@>=0.4.1 <0.5.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz"
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
+          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s="
         }
       }
     },
     "webpack-dev-middleware": {
       "version": "1.10.2",
-      "from": "webpack-dev-middleware@>=1.0.11 <2.0.0",
-      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-1.10.2.tgz"
+      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-1.10.2.tgz",
+      "integrity": "sha1-LiUs4d+wINvaHMs33ybzCrAU29E="
     },
     "webpack-dev-server": {
       "version": "2.4.5",
-      "from": "webpack-dev-server@>=2.4.1 <3.0.0",
       "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.4.5.tgz",
+      "integrity": "sha1-MThM6BE2vhCAtLTN4OubkOVO5s8=",
       "dependencies": {
         "camelcase": {
           "version": "3.0.0",
-          "from": "camelcase@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
+          "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.1.1 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         },
         "yargs": {
           "version": "6.6.0",
-          "from": "yargs@>=6.0.0 <7.0.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz"
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz",
+          "integrity": "sha1-eC7CHvQDNF+DCoCMo9UTr1YGUgg="
         },
         "yargs-parser": {
           "version": "4.2.1",
-          "from": "yargs-parser@>=4.2.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz",
+          "integrity": "sha1-KczqwNxPA8bIe0qfIX3RjJ90hxw="
         }
       }
     },
     "webpack-node-externals": {
       "version": "1.6.0",
-      "from": "webpack-node-externals@>=1.5.4 <2.0.0",
-      "resolved": "https://registry.npmjs.org/webpack-node-externals/-/webpack-node-externals-1.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/webpack-node-externals/-/webpack-node-externals-1.6.0.tgz",
+      "integrity": "sha1-Iyxi7GCSsQBjWj0p2DwXRxKN+b0="
     },
     "webpack-notifier": {
       "version": "1.5.0",
-      "from": "webpack-notifier@>=1.5.0 <2.0.0",
       "resolved": "https://registry.npmjs.org/webpack-notifier/-/webpack-notifier-1.5.0.tgz",
+      "integrity": "sha1-wBAAfUSM68NN78mezyiPpejGuvY=",
       "dependencies": {
         "lodash._baseclone": {
           "version": "3.3.0",
-          "from": "lodash._baseclone@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/lodash._baseclone/-/lodash._baseclone-3.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/lodash._baseclone/-/lodash._baseclone-3.3.0.tgz",
+          "integrity": "sha1-MDUZv2OT/n5C802LYw73eU41Qrc="
         },
         "lodash.clonedeep": {
           "version": "3.0.2",
-          "from": "lodash.clonedeep@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-3.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-3.0.2.tgz",
+          "integrity": "sha1-oKHkDYKl6on/WxR7hETtY9koJ9s="
         },
         "node-notifier": {
           "version": "4.6.1",
-          "from": "node-notifier@>=4.1.0 <5.0.0",
-          "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-4.6.1.tgz"
+          "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-4.6.1.tgz",
+          "integrity": "sha1-BW0UJE89zBzq3+aK+c/wxUc6M/M="
         }
       }
     },
     "webpack-sources": {
       "version": "0.2.3",
-      "from": "webpack-sources@>=0.2.3 <0.3.0",
       "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-0.2.3.tgz",
+      "integrity": "sha1-F8Yr+vE8cH+dAsR54Nzd6DgGl/s=",
       "dependencies": {
         "source-list-map": {
           "version": "1.1.2",
-          "from": "source-list-map@>=1.1.1 <2.0.0",
-          "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-1.1.2.tgz"
+          "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-1.1.2.tgz",
+          "integrity": "sha1-mIkBnRAkzOVc3AaUmDN+9hhqEaE="
         }
       }
     },
     "webpack-split-by-path": {
       "version": "2.0.0",
-      "from": "webpack-split-by-path@2.0.0",
-      "resolved": "https://registry.npmjs.org/webpack-split-by-path/-/webpack-split-by-path-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/webpack-split-by-path/-/webpack-split-by-path-2.0.0.tgz",
+      "integrity": "sha1-K2p1MB82lfc9h4jZkMTwxxVn4rA="
     },
     "webpack-stats-plugin": {
       "version": "0.1.5",
-      "from": "webpack-stats-plugin@>=0.1.1 <0.2.0",
-      "resolved": "https://registry.npmjs.org/webpack-stats-plugin/-/webpack-stats-plugin-0.1.5.tgz"
+      "resolved": "https://registry.npmjs.org/webpack-stats-plugin/-/webpack-stats-plugin-0.1.5.tgz",
+      "integrity": "sha1-KeXxLr/VMVjTHWVqETrB97hhedk="
     },
     "webpack-stream": {
       "version": "3.2.0",
-      "from": "webpack-stream@>=3.2.0 <3.3.0",
       "resolved": "https://registry.npmjs.org/webpack-stream/-/webpack-stream-3.2.0.tgz",
+      "integrity": "sha1-Oh0WD7EdQXJ7fObzL3IkZPmLIYY=",
       "dependencies": {
         "camelcase": {
           "version": "1.2.1",
-          "from": "camelcase@>=1.0.2 <2.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
+          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
         },
         "cliui": {
           "version": "2.1.0",
-          "from": "cliui@>=2.1.0 <3.0.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
+          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE="
         },
         "constants-browserify": {
           "version": "1.0.0",
-          "from": "constants-browserify@>=1.0.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz",
+          "integrity": "sha1-wguW2MYXdIqvHBYCF2DNJ/y4y3U="
         },
         "crypto-browserify": {
           "version": "3.3.0",
-          "from": "crypto-browserify@3.3.0",
-          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.3.0.tgz",
+          "integrity": "sha1-ufx1u0oO1h3PHNXa6W6zDJw+UGw="
         },
         "https-browserify": {
           "version": "0.0.1",
-          "from": "https-browserify@0.0.1",
-          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz",
+          "integrity": "sha1-P5E2XKvmC3ftDruiS0VOPgnZWoI="
         },
         "interpret": {
           "version": "0.6.6",
-          "from": "interpret@>=0.6.4 <0.7.0",
-          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz"
+          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz",
+          "integrity": "sha1-/s16GOfOXKar+5U+H4YhOknxYls="
         },
         "isarray": {
           "version": "1.0.0",
-          "from": "isarray@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "memory-fs": {
           "version": "0.3.0",
-          "from": "memory-fs@>=0.3.0 <0.4.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz"
+          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz",
+          "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
         },
         "node-libs-browser": {
           "version": "0.7.0",
-          "from": "node-libs-browser@>=0.7.0 <0.8.0",
           "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-0.7.0.tgz",
+          "integrity": "sha1-PicsCBnjCJNeJmdECNevDhSRuDs=",
           "dependencies": {
             "string_decoder": {
               "version": "0.10.31",
-              "from": "string_decoder@^0.10.25",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz"
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+              "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
             }
           }
         },
         "os-browserify": {
           "version": "0.2.1",
-          "from": "os-browserify@>=0.2.0 <0.3.0",
-          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz"
+          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz",
+          "integrity": "sha1-Y/xMzuXS13Y9Jrv4YBB45sLgBE8="
         },
         "readable-stream": {
           "version": "2.2.9",
-          "from": "readable-stream@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz"
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
+          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
         },
         "stream-browserify": {
           "version": "2.0.1",
-          "from": "stream-browserify@>=2.0.1 <3.0.0",
-          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz",
+          "integrity": "sha1-ZiZu5fm9uZQKTkUUyvtDu3Hlyds="
         },
         "string_decoder": {
           "version": "1.0.1",
-          "from": "string_decoder@>=1.0.0 <1.1.0",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz"
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
         },
         "supports-color": {
           "version": "3.2.3",
-          "from": "supports-color@>=3.1.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz"
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         },
         "timers-browserify": {
           "version": "2.0.2",
-          "from": "timers-browserify@>=2.0.2 <3.0.0",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz",
+          "integrity": "sha1-q0iDz1l9zVCvIRNJoA+8pWrIa4Y="
         },
         "uglify-js": {
           "version": "2.7.5",
-          "from": "uglify-js@>=2.7.3 <2.8.0",
           "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.7.5.tgz",
+          "integrity": "sha1-RhLAx7qu4rp8SH3kkErhIgefLKg=",
           "dependencies": {
             "async": {
               "version": "0.2.10",
-              "from": "async@>=0.2.6 <0.3.0",
-              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz"
+              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz",
+              "integrity": "sha1-trvgsGdLnXGXCMo43owjfLUmw9E="
             }
           }
         },
         "url": {
           "version": "0.11.0",
-          "from": "url@>=0.11.0 <0.12.0",
           "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
+          "integrity": "sha1-ODjpfPxgUh63PFJajlW/3Z4uKPE=",
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "from": "punycode@1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz"
+              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
+              "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
             }
           }
         },
         "vinyl": {
           "version": "1.2.0",
-          "from": "vinyl@>=1.1.0 <2.0.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz"
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz",
+          "integrity": "sha1-XIgDbPVl5d8FVYv8kR+GVt8hiIQ="
         },
         "webpack": {
           "version": "1.15.0",
-          "from": "webpack@>=1.12.9 <2.0.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.15.0.tgz"
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.15.0.tgz",
+          "integrity": "sha1-T/MfU9sDM55VFkqdRo7gMklo/pg="
         },
         "window-size": {
           "version": "0.1.0",
-          "from": "window-size@0.1.0",
-          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz"
+          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
+          "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
         },
         "wordwrap": {
           "version": "0.0.2",
-          "from": "wordwrap@0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz"
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
+          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
         },
         "yargs": {
           "version": "3.10.0",
-          "from": "yargs@>=3.10.0 <3.11.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz"
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
+          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
         }
       }
     },
     "webpack-visualizer-plugin": {
       "version": "0.1.11",
-      "from": "webpack-visualizer-plugin@>=0.1.5 <0.2.0",
       "resolved": "https://registry.npmjs.org/webpack-visualizer-plugin/-/webpack-visualizer-plugin-0.1.11.tgz",
+      "integrity": "sha1-uHcK2GtPZSYSxosbeCJT+vn4o04=",
       "dependencies": {
         "react": {
           "version": "0.14.9",
-          "from": "react@>=0.14.0 <0.15.0",
-          "resolved": "https://registry.npmjs.org/react/-/react-0.14.9.tgz"
+          "resolved": "https://registry.npmjs.org/react/-/react-0.14.9.tgz",
+          "integrity": "sha1-kRCmSXxJ1EuhwO3TF67CnC4NkdE="
         },
         "react-dom": {
           "version": "0.14.9",
-          "from": "react-dom@>=0.14.0 <0.15.0",
-          "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-0.14.9.tgz"
+          "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-0.14.9.tgz",
+          "integrity": "sha1-BQZKPc8PsYgKOyv8nVjFXY2fYpM="
         }
       }
     },
     "websocket-driver": {
       "version": "0.6.5",
-      "from": "websocket-driver@>=0.5.1",
-      "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.6.5.tgz"
+      "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.6.5.tgz",
+      "integrity": "sha1-XLJVbOuF9Dc8bYI4qmkchFThOjY="
     },
     "websocket-extensions": {
       "version": "0.1.1",
-      "from": "websocket-extensions@>=0.1.1",
-      "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.1.tgz"
+      "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.1.tgz",
+      "integrity": "sha1-domUmcGEtu91Q3fC27DNbLVdKec="
     },
     "whatwg-fetch": {
       "version": "0.9.0",
-      "from": "whatwg-fetch@>=0.9.0 <0.10.0",
-      "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-0.9.0.tgz"
+      "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-0.9.0.tgz",
+      "integrity": "sha1-DjaExsuZlbQ+/J3wPkw2XZX9nMA="
     },
     "whet.extend": {
       "version": "0.9.9",
-      "from": "whet.extend@>=0.9.9 <0.10.0",
-      "resolved": "https://registry.npmjs.org/whet.extend/-/whet.extend-0.9.9.tgz"
+      "resolved": "https://registry.npmjs.org/whet.extend/-/whet.extend-0.9.9.tgz",
+      "integrity": "sha1-+HfVv2SMl+WqVC+twW1qJZucEaE="
     },
     "which": {
       "version": "1.2.14",
-      "from": "which@>=1.2.12 <2.0.0",
-      "resolved": "https://registry.npmjs.org/which/-/which-1.2.14.tgz"
+      "resolved": "https://registry.npmjs.org/which/-/which-1.2.14.tgz",
+      "integrity": "sha1-mofEN48D6CfOyvGs31bHNsAcFOU="
     },
     "which-module": {
       "version": "1.0.0",
-      "from": "which-module@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/which-module/-/which-module-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/which-module/-/which-module-1.0.0.tgz",
+      "integrity": "sha1-u6Y8qGGUiZT/MHc2CJ47lgJsKk8="
     },
     "wide-align": {
       "version": "1.1.2",
-      "from": "wide-align@>=1.1.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/wide-align/-/wide-align-1.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/wide-align/-/wide-align-1.1.2.tgz",
+      "integrity": "sha512-ijDLlyQ7s6x1JgCLur53osjm/UXUYD9+0PbYKrBsYisYXzCxN+HC3mYDNy/dWdmf3AwqwU3CXwDCvsNgGK1S0w=="
     },
     "widest-line": {
       "version": "1.0.0",
-      "from": "widest-line@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/widest-line/-/widest-line-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/widest-line/-/widest-line-1.0.0.tgz",
+      "integrity": "sha1-DAnIXCqUaD0Nfq+O4JfVZL8OEFw="
     },
     "window-size": {
       "version": "0.2.0",
-      "from": "window-size@>=0.2.0 <0.3.0",
-      "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.2.0.tgz"
+      "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.2.0.tgz",
+      "integrity": "sha1-tDFbtCFKPXBY6+7okuE/ok2YsHU="
     },
     "wordwrap": {
       "version": "0.0.3",
-      "from": "wordwrap@>=0.0.2 <0.1.0",
-      "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.3.tgz"
+      "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.3.tgz",
+      "integrity": "sha1-o9XabNXAvAAI03I0u68b7WMFkQc="
     },
     "wrap-ansi": {
       "version": "2.1.0",
-      "from": "wrap-ansi@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz"
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
+      "integrity": "sha1-2Pw9KE3QV5T+hJc8rs3Rz4JP3YU="
     },
     "wrappy": {
       "version": "1.0.2",
-      "from": "wrappy@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz"
+      "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
+      "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8="
     },
     "write-file-atomic": {
       "version": "1.3.4",
-      "from": "write-file-atomic@>=1.1.2 <2.0.0",
-      "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-1.3.4.tgz"
+      "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-1.3.4.tgz",
+      "integrity": "sha1-+Aek8LHZ6ROuekgRLmzDrxmRtF8="
     },
     "ws": {
       "version": "1.1.4",
-      "from": "ws@1.1.4",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-1.1.4.tgz"
+      "resolved": "https://registry.npmjs.org/ws/-/ws-1.1.4.tgz",
+      "integrity": "sha1-V/QNA2gy5fUFVmKjl8Tedu1mv2E="
     },
     "wtf-8": {
       "version": "1.0.0",
-      "from": "wtf-8@1.0.0",
-      "resolved": "https://registry.npmjs.org/wtf-8/-/wtf-8-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/wtf-8/-/wtf-8-1.0.0.tgz",
+      "integrity": "sha1-OS2LotDxw00e4tYw8V0O+2jhBIo="
     },
     "xdg-basedir": {
       "version": "2.0.0",
-      "from": "xdg-basedir@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-2.0.0.tgz",
+      "integrity": "sha1-7byQPMOF/ARSPZZqM1UEtVBNG9I="
     },
     "xml": {
       "version": "1.0.1",
-      "from": "xml@>=1.0.1 <1.1.0",
-      "resolved": "https://registry.npmjs.org/xml/-/xml-1.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/xml/-/xml-1.0.1.tgz",
+      "integrity": "sha1-eLpyAgApxbyHuKgaPPzXS0ovweU="
     },
     "xml-char-classes": {
       "version": "1.0.0",
-      "from": "xml-char-classes@>=1.0.0 <2.0.0",
-      "resolved": "https://registry.npmjs.org/xml-char-classes/-/xml-char-classes-1.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/xml-char-classes/-/xml-char-classes-1.0.0.tgz",
+      "integrity": "sha1-ZGV4SKIP/F31g6Qq2KJ3tFErvE0="
     },
     "xml2js": {
       "version": "0.2.7",
-      "from": "xml2js@0.2.7",
-      "resolved": "https://registry.npmjs.org/xml2js/-/xml2js-0.2.7.tgz"
+      "resolved": "https://registry.npmjs.org/xml2js/-/xml2js-0.2.7.tgz",
+      "integrity": "sha1-GDhRi7AXQcrgh4urSRXklMMjBq8="
     },
     "xmlbuilder": {
       "version": "0.4.3",
-      "from": "xmlbuilder@0.4.3",
-      "resolved": "https://registry.npmjs.org/xmlbuilder/-/xmlbuilder-0.4.3.tgz"
+      "resolved": "https://registry.npmjs.org/xmlbuilder/-/xmlbuilder-0.4.3.tgz",
+      "integrity": "sha1-xGFLp04K0ZbmCcknLNnh3bKKilg="
     },
     "xmlhttprequest-ssl": {
       "version": "1.5.3",
-      "from": "xmlhttprequest-ssl@1.5.3",
-      "resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-1.5.3.tgz"
+      "resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-1.5.3.tgz",
+      "integrity": "sha1-GFqIjATspGw+QHDZn3tJ3jUomS0="
     },
     "xregexp": {
       "version": "2.0.0",
-      "from": "xregexp@2.0.0",
-      "resolved": "https://registry.npmjs.org/xregexp/-/xregexp-2.0.0.tgz"
+      "resolved": "https://registry.npmjs.org/xregexp/-/xregexp-2.0.0.tgz",
+      "integrity": "sha1-UqY+VsoLhKfzpfPWGHLxJq16WUM="
     },
     "xtend": {
       "version": "4.0.1",
-      "from": "xtend@>=4.0.1 <4.1.0",
-      "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.1.tgz"
+      "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.1.tgz",
+      "integrity": "sha1-pcbVMr5lbiPbgg77lDofBJmNY68="
     },
     "y18n": {
       "version": "3.2.1",
-      "from": "y18n@>=3.2.1 <4.0.0",
-      "resolved": "https://registry.npmjs.org/y18n/-/y18n-3.2.1.tgz"
+      "resolved": "https://registry.npmjs.org/y18n/-/y18n-3.2.1.tgz",
+      "integrity": "sha1-bRX7qITAhnnA136I53WegR4H+kE="
     },
     "yallist": {
       "version": "2.1.2",
-      "from": "yallist@>=2.0.0 <3.0.0",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-2.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-2.1.2.tgz",
+      "integrity": "sha1-HBH5IY8HYImkfdUS+TxmmaaoHVI="
     },
     "yargs": {
       "version": "4.6.0",
-      "from": "yargs@>=4.6.0 <4.7.0",
-      "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz"
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz",
+      "integrity": "sha1-y0BQwBWb+2u2ScD0r1UFJqhGGdw="
     },
     "yargs-parser": {
       "version": "2.4.1",
-      "from": "yargs-parser@>=2.4.0 <3.0.0",
       "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-2.4.1.tgz",
+      "integrity": "sha1-hVaN488VD/SfpRgl8DqMiA3cxcQ=",
       "dependencies": {
         "camelcase": {
           "version": "3.0.0",
-          "from": "camelcase@>=3.0.0 <4.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz"
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
+          "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
         }
       }
     },
     "yauzl": {
       "version": "2.4.1",
-      "from": "yauzl@2.4.1",
-      "resolved": "https://registry.npmjs.org/yauzl/-/yauzl-2.4.1.tgz"
+      "resolved": "https://registry.npmjs.org/yauzl/-/yauzl-2.4.1.tgz",
+      "integrity": "sha1-lSj0QtqxsihOWLQ3m7GU4i4MQAU="
     },
     "yeast": {
       "version": "0.1.2",
-      "from": "yeast@0.1.2",
-      "resolved": "https://registry.npmjs.org/yeast/-/yeast-0.1.2.tgz"
+      "resolved": "https://registry.npmjs.org/yeast/-/yeast-0.1.2.tgz",
+      "integrity": "sha1-AI4G2AlDIMNy28L47XagymyKxBk="
     },
     "z-schema": {
       "version": "3.17.0",
-      "from": "z-schema@>=3.17.0 <3.18.0",
-      "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-3.17.0.tgz"
+      "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-3.17.0.tgz",
+      "integrity": "sha1-RCs4+denr3rke/z8NWhz6GFq0bc="
     }
   }
 }
\ No newline at end of file
diff --git a/package.json b/package.json
index 7a84505619937..28ebb32f0eeec 100644
--- a/package.json
+++ b/package.json
@@ -28,4 +28,4 @@
     "gulp": "^3.9.1",
     "yargs": "^6.5.0"
   }
-}
+}
\ No newline at end of file
diff --git a/rush.json b/rush.json
index 0ef8c259e99da..44266d69d03ac 100644
--- a/rush.json
+++ b/rush.json
@@ -1,5 +1,5 @@
 {
-  "npmVersion": "4.6.1",
+  "npmVersion": "5.0.0",
   "rushMinimumVersion": "3.0.7",
   "nodeSupportedVersionRange": ">=6.9.0 <8.0.0",
   "projectFolderMinDepth": 1,

From bdfee7b66c87d95399a2da427564a2dbfb2f374e Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 29 May 2017 20:16:00 -0700
Subject: [PATCH 0034/1641] adding npmrc

---
 .npmrc | 2 ++
 1 file changed, 2 insertions(+)
 create mode 100644 .npmrc

diff --git a/.npmrc b/.npmrc
new file mode 100644
index 0000000000000..825c83e09df4d
--- /dev/null
+++ b/.npmrc
@@ -0,0 +1,2 @@
+registry=https://registry.npmjs.org/
+

From 2348e59e988a083e25cfcc7a91f2ae501acc8f99 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 30 May 2017 03:27:20 +0000
Subject: [PATCH 0035/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 18 ++++++
 apps/fabric-website/CHANGELOG.md              |  7 +-
 apps/fabric-website/package.json              |  8 +--
 apps/ssr-tests/package.json                   |  4 +-
 apps/test-bundle-button/package.json          |  4 +-
 apps/todo-app/package.json                    |  4 +-
 .../changes/beta-core-6_2017-04-24-19-30.json | 15 -----
 ...edIndexOnMountedRows_2017-05-23-06-30.json | 30 ---------
 ...lsListSelectionFixes_2017-05-18-14-34.json | 10 ---
 ...introduce-prop-types_2017-05-23-04-28.json | 15 -----
 ...d-add-setSelectRange_2017-05-18-21-16.json | 11 ----
 .../listimprovements_2017-05-25-23-31.json    | 10 ---
 ...roup-optimize-shrink_2017-05-26-21-04.json | 10 ---
 .../styling-updates_2017-05-27-00-02.json     | 30 ---------
 packages/example-app-base/CHANGELOG.json      | 29 +++++++++
 packages/example-app-base/CHANGELOG.md        | 13 +++-
 packages/example-app-base/package.json        |  6 +-
 packages/example-component/package.json       |  8 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 64 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 22 ++++++-
 packages/office-ui-fabric-react/package.json  |  8 +--
 packages/styling/CHANGELOG.json               | 19 ++++++
 packages/styling/CHANGELOG.md                 |  9 ++-
 packages/styling/package.json                 |  4 +-
 packages/utilities/CHANGELOG.json             | 26 ++++++++
 packages/utilities/CHANGELOG.md               | 14 +++-
 packages/utilities/package.json               |  2 +-
 27 files changed, 240 insertions(+), 160 deletions(-)
 delete mode 100644 common/changes/beta-core-6_2017-04-24-19-30.json
 delete mode 100644 common/changes/detailsList-initialFocusedIndexOnMountedRows_2017-05-23-06-30.json
 delete mode 100644 common/changes/groupedDetailsListSelectionFixes_2017-05-18-14-34.json
 delete mode 100644 common/changes/introduce-prop-types_2017-05-23-04-28.json
 delete mode 100644 common/changes/joem-textfield-add-setSelectRange_2017-05-18-21-16.json
 delete mode 100644 common/changes/listimprovements_2017-05-25-23-31.json
 delete mode 100644 common/changes/resizegroup-optimize-shrink_2017-05-26-21-04.json
 delete mode 100644 common/changes/styling-updates_2017-05-27-00-02.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 7203eac8d15cb..0775360bc4e7a 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,24 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.5.27",
+      "tag": "@uifabric/fabric-website_v4.5.27",
+      "date": "Tue, 30 May 2017 03:27:20 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `1.3.14` to `2.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=3.0.0 <4.0.0` to `>=4.0.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=3.0.0 <4.0.0` to `>=4.0.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.5.26",
       "tag": "@uifabric/fabric-website_v4.5.26",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 04283b609bd93..e89dae61f36f1 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Fri, 26 May 2017 10:21:03 GMT and should not be manually modified.
+This log was last generated on Tue, 30 May 2017 03:27:20 GMT and should not be manually modified.
+
+## 4.5.27
+Tue, 30 May 2017 03:27:20 GMT
+
+*Changes not tracked*
 
 ## 4.5.26
 Fri, 26 May 2017 10:21:03 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index fa104d4223c4d..ab02eb2eb8388 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.5.26",
+  "version": "4.5.27",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,12 +47,12 @@
     "webpack-bundle-analyzer": "^2.2.1"
   },
   "dependencies": {
-    "@uifabric/example-app-base": "1.3.14",
+    "@uifabric/example-app-base": "2.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=3.0.0 <4.0.0",
-    "@uifabric/utilities": ">=3.0.0 <4.0.0"
+    "office-ui-fabric-react": ">=4.0.0 <5.0.0",
+    "@uifabric/utilities": ">=4.0.0 <5.0.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 1a0718e9f3d1f..2d29df715ee6e 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ssr-tests",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "private": true,
@@ -25,7 +25,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=3.0.0 <4.0.0",
+    "office-ui-fabric-react": ">=4.0.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 2f4012eb140e8..46c4f68fb3d3f 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -1,6 +1,6 @@
 {
   "name": "test-bundle-button",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "description": "Testing the button for bundling.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -33,6 +33,6 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=3.0.0 <4.0.0"
+    "office-ui-fabric-react": ">=4.0.0 <5.0.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index e2034c9405494..6d4e2d15940ec 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -1,7 +1,7 @@
 {
   "name": "todo-app",
   "description": "Sample todo app using office-ui-fabric-react.",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "private": true,
   "scripts": {
     "build": "gulp",
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=3.0.0 <4.0.0",
+    "office-ui-fabric-react": ">=4.0.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2"
diff --git a/common/changes/beta-core-6_2017-04-24-19-30.json b/common/changes/beta-core-6_2017-04-24-19-30.json
deleted file mode 100644
index bda762b60a0ce..0000000000000
--- a/common/changes/beta-core-6_2017-04-24-19-30.json
+++ /dev/null
@@ -1,15 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Updated dependency to Fabric Core 7",
-      "type": "major"
-    },
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Updated dependency to Fabric Core 7",
-      "type": "patch"
-    }
-  ],
-  "email": "miwhea@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/detailsList-initialFocusedIndexOnMountedRows_2017-05-23-06-30.json b/common/changes/detailsList-initialFocusedIndexOnMountedRows_2017-05-23-06-30.json
deleted file mode 100644
index aa68bc39d3d8c..0000000000000
--- a/common/changes/detailsList-initialFocusedIndexOnMountedRows_2017-05-23-06-30.json
+++ /dev/null
@@ -1,30 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: initialFocusedIndex is considered on already mounted rows ",
-      "type": "patch"
-    },
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    },
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    },
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    },
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "email": "v-panu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/groupedDetailsListSelectionFixes_2017-05-18-14-34.json b/common/changes/groupedDetailsListSelectionFixes_2017-05-18-14-34.json
deleted file mode 100644
index 1b8a656c1aef5..0000000000000
--- a/common/changes/groupedDetailsListSelectionFixes_2017-05-18-14-34.json
+++ /dev/null
@@ -1,10 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SelectionZone: Update behavior to fix using up/down arrows to navigate between groups in a GroupedList.",
-      "type": "patch"
-    }
-  ],
-  "email": "aazhou@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/introduce-prop-types_2017-05-23-04-28.json b/common/changes/introduce-prop-types_2017-05-23-04-28.json
deleted file mode 100644
index 72e8e70b89d06..0000000000000
--- a/common/changes/introduce-prop-types_2017-05-23-04-28.json
+++ /dev/null
@@ -1,15 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Introduce prop-types instead of React.PropTypes",
-      "type": "patch"
-    },
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Introduce prop-types instead of React.PropTypes",
-      "type": "patch"
-    }
-  ],
-  "email": "ryo.studiom@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/joem-textfield-add-setSelectRange_2017-05-18-21-16.json b/common/changes/joem-textfield-add-setSelectRange_2017-05-18-21-16.json
deleted file mode 100644
index 0fbd6def72719..0000000000000
--- a/common/changes/joem-textfield-add-setSelectRange_2017-05-18-21-16.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Exposes setSelectionRange function to TextField component.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joem@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/listimprovements_2017-05-25-23-31.json b/common/changes/listimprovements_2017-05-25-23-31.json
deleted file mode 100644
index 422a94faa0a90..0000000000000
--- a/common/changes/listimprovements_2017-05-25-23-31.json
+++ /dev/null
@@ -1,10 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "List: improved measure logic and fix nested list scroll problem",
-      "type": "patch"
-    }
-  ],
-  "email": "joschect@microsoft.com"
-}
diff --git a/common/changes/resizegroup-optimize-shrink_2017-05-26-21-04.json b/common/changes/resizegroup-optimize-shrink_2017-05-26-21-04.json
deleted file mode 100644
index 3be096ea38bc2..0000000000000
--- a/common/changes/resizegroup-optimize-shrink_2017-05-26-21-04.json
+++ /dev/null
@@ -1,10 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ResizeGroup: Reduce the number of render calls when reducing the width.",
-      "type": "patch"
-    }
-  ],
-  "email": "chrisgo@microsoft.com"
-}
diff --git a/common/changes/styling-updates_2017-05-27-00-02.json b/common/changes/styling-updates_2017-05-27-00-02.json
deleted file mode 100644
index 228334a892b42..0000000000000
--- a/common/changes/styling-updates_2017-05-27-00-02.json
+++ /dev/null
@@ -1,30 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "The styling package is now a dependency of fabric-react, which brings in the initial steps towards offering consumers a much better way to customize components to meet their requirements. The Button components and Toggle components have so far been converted to use the styling utilities. We will be ellaborating more on this as we refine our patterns towards customization and refine the documentation.",
-      "type": "major"
-    },
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "memoize/memoizeFunction: memoize converted to a decorator, memoizeFunction is now for memoizing functions.",
-      "type": "major"
-    },
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "getLangauge/setLanguage: new apis added for getting/setting the language normally specified on the html lang attribute.",
-      "type": "major"
-    },
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Major updates to mergeStyles and other various utilities. Updating fonts to follow latest fabric-core language fallbacks.",
-      "type": "minor"
-    },
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "All references to fabric-core removed.",
-      "type": "major"
-    }
-  ],
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 8dcce9744f517..b23793b484d0a 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,35 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "2.0.0",
+      "tag": "@uifabric/example-app-base_v2.0.0",
+      "date": "Tue, 30 May 2017 03:27:20 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Mike Wheaton <miwhea@microsoft.com>",
+            "commit": "da0f88a8690c867e2bbcf19c533ba57487acc4ed",
+            "comment": "Updated dependency to Fabric Core 7"
+          }
+        ],
+        "major": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "3a198d4811b76f491acce31efa358c9c95740a63",
+            "comment": "All references to fabric-core removed."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.0.1 <2.0.0` to `>=0.3.0 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=3.0.0 <4.0.0` to `>=4.0.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "1.3.14",
       "tag": "@uifabric/example-app-base_v1.3.14",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index 43a046f210e40..25aa72aa9b951 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Fri, 26 May 2017 10:21:03 GMT and should not be manually modified.
+This log was last generated on Tue, 30 May 2017 03:27:20 GMT and should not be manually modified.
+
+## 2.0.0
+Tue, 30 May 2017 03:27:20 GMT
+
+### Breaking changes
+
+- All references to fabric-core removed.
+
+### Patches
+
+- Updated dependency to Fabric Core 7
 
 ## 1.3.14
 Fri, 26 May 2017 10:21:03 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 6eb5d8951f270..398f2c5128c5a 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "1.3.14",
+  "version": "2.0.0",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -40,8 +40,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.0.1 <2.0.0",
-    "@uifabric/utilities": ">=3.0.0 <4.0.0",
+    "@uifabric/styling": ">=0.3.0 <1.0.0",
+    "@uifabric/utilities": ">=4.0.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
     "office-ui-fabric-react": ">=2.0.0 <3.0.0"
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 081b2b74d72b8..147bdead5a12b 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-component",
-  "version": "1.0.25",
+  "version": "1.0.26",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -21,8 +21,8 @@
     "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "1.3.14",
-    "@uifabric/utilities": "1.10.2",
+    "@uifabric/example-app-base": "2.0.0",
+    "@uifabric/utilities": "4.0.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -49,6 +49,6 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=3.0.0 <4.0.0"
+    "office-ui-fabric-react": ">=4.0.0 <5.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 19ba6585ba376..766695f429591 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,70 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.0.0",
+      "tag": "office-ui-fabric-react_v4.0.0",
+      "date": "Tue, 30 May 2017 03:27:20 GMT",
+      "comments": {
+        "major": [
+          {
+            "author": "Mike Wheaton <miwhea@microsoft.com>",
+            "commit": "da0f88a8690c867e2bbcf19c533ba57487acc4ed",
+            "comment": "Updated dependency to Fabric Core 7"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "3a198d4811b76f491acce31efa358c9c95740a63",
+            "comment": "The styling package is now a dependency of fabric-react, which brings in the initial steps towards offering consumers a much better way to customize components to meet their requirements. The Button components and Toggle components have so far been converted to use the styling utilities. We will be ellaborating more on this as we refine our patterns towards customization and refine the documentation."
+          }
+        ],
+        "patch": [
+          {
+            "author": "Pablo Núñez <pablonete@gmail.com>",
+            "commit": "cfffab19f72102f075b55422bbf3448f840deb9e",
+            "comment": "DetailsList: initialFocusedIndex is considered on already mounted rows "
+          },
+          {
+            "author": "Aaron Zhou <aaronyzhou88@gmail.com>",
+            "commit": "8424c7680a618013d5cb4d320e7f6ed798cb317b",
+            "comment": "SelectionZone: Update behavior to fix using up/down arrows to navigate between groups in a GroupedList."
+          },
+          {
+            "author": "Ryo Miyake <ryo.studiom@gmail.com>",
+            "commit": "83b0787a17884867a2ad336d3dad9e713da8f04e",
+            "comment": "Introduce prop-types instead of React.PropTypes"
+          },
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "63b34daf51bc7185585c29c81bc34abd1ae64edb",
+            "comment": "List: improved measure logic and fix nested list scroll problem"
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "f812b804e890fd7762e0c09226fb28f9e5036717",
+            "comment": "ResizeGroup: Reduce the number of render calls when reducing the width."
+          }
+        ],
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "89660364911f368866f1cc5186673e89b15e661e",
+            "comment": "Exposes setSelectionRange function to TextField component."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=3.0.0 <4.0.0` to `>=4.0.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.0.1 <2.0.0` to `>=0.3.0 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `1.3.14` to `2.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "2.34.2",
       "tag": "office-ui-fabric-react_v2.34.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index a86fdc7d48eec..d8adff3ca13c6 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,26 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Sat, 27 May 2017 01:47:19 GMT and should not be manually modified.
+This log was last generated on Tue, 30 May 2017 03:27:20 GMT and should not be manually modified.
+
+## 4.0.0
+Tue, 30 May 2017 03:27:20 GMT
+
+### Breaking changes
+
+- Updated dependency to Fabric Core 7
+- The styling package is now a dependency of fabric-react, which brings in the initial steps towards offering consumers a much better way to customize components to meet their requirements. The Button components and Toggle components have so far been converted to use the styling utilities. We will be ellaborating more on this as we refine our patterns towards customization and refine the documentation.
+
+### Minor changes
+
+- Exposes setSelectionRange function to TextField component.
+
+### Patches
+
+- DetailsList: initialFocusedIndex is considered on already mounted rows 
+- SelectionZone: Update behavior to fix using up/down arrows to navigate between groups in a GroupedList.
+- Introduce prop-types instead of React.PropTypes
+- List: improved measure logic and fix nested list scroll problem
+- ResizeGroup: Reduce the number of render calls when reducing the width.
 
 ## 2.34.2
 Sat, 27 May 2017 01:47:19 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index c2bf144cbe68a..265bbc7b355e2 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "3.0.0",
+  "version": "4.0.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "^2.2.2",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "1.3.14",
+    "@uifabric/example-app-base": "2.0.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -71,8 +71,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=3.0.0 <4.0.0",
-    "@uifabric/styling": ">=0.0.1 <2.0.0",
+    "@uifabric/utilities": ">=4.0.0 <5.0.0",
+    "@uifabric/styling": ">=0.3.0 <1.0.0",
     "prop-types": "^15.5.10"
   },
   "peerDependencies": {
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index ebfc4208353d4..e53e015ee2b45 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.3.0",
+      "tag": "@uifabric/styling_v0.3.0",
+      "date": "Tue, 30 May 2017 03:27:20 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "3a198d4811b76f491acce31efa358c9c95740a63",
+            "comment": "Major updates to mergeStyles and other various utilities. Updating fonts to follow latest fabric-core language fallbacks."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=3.0.0 <4.0.0` to `>=4.0.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.2.0",
       "tag": "@uifabric/styling_v0.2.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index a4f9596629357..aa8cb1df800df 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 18 May 2017 10:09:58 GMT and should not be manually modified.
+This log was last generated on Tue, 30 May 2017 03:27:20 GMT and should not be manually modified.
+
+## 0.3.0
+Tue, 30 May 2017 03:27:20 GMT
+
+### Minor changes
+
+- Major updates to mergeStyles and other various utilities. Updating fonts to follow latest fabric-core language fallbacks.
 
 ## 0.2.0
 Thu, 18 May 2017 10:09:58 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index d78c3753793e2..8af655286ed87 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
     "webpack-split-by-path": "2.0.0"
   },
   "dependencies": {
-    "@uifabric/utilities": ">=3.0.0 <4.0.0",
+    "@uifabric/utilities": ">=4.0.0 <5.0.0",
     "glamor": "^2.20.24",
     "rtl-css-js": "^1.1.0"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 8c438499544e0..1120a96205755 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.0.0",
+      "tag": "@uifabric/utilities_v4.0.0",
+      "date": "Tue, 30 May 2017 03:27:20 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Ryo Miyake <ryo.studiom@gmail.com>",
+            "commit": "83b0787a17884867a2ad336d3dad9e713da8f04e",
+            "comment": "Introduce prop-types instead of React.PropTypes"
+          }
+        ],
+        "major": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "3a198d4811b76f491acce31efa358c9c95740a63",
+            "comment": "memoize/memoizeFunction: memoize converted to a decorator, memoizeFunction is now for memoizing functions."
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "3a198d4811b76f491acce31efa358c9c95740a63",
+            "comment": "getLangauge/setLanguage: new apis added for getting/setting the language normally specified on the html lang attribute."
+          }
+        ]
+      }
+    },
     {
       "version": "1.10.2",
       "tag": "@uifabric/utilities_v1.10.2",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 282a2e8dd333b..dab34a6689b25 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,18 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Fri, 26 May 2017 10:21:03 GMT and should not be manually modified.
+This log was last generated on Tue, 30 May 2017 03:27:20 GMT and should not be manually modified.
+
+## 4.0.0
+Tue, 30 May 2017 03:27:20 GMT
+
+### Breaking changes
+
+- memoize/memoizeFunction: memoize converted to a decorator, memoizeFunction is now for memoizing functions.
+- getLangauge/setLanguage: new apis added for getting/setting the language normally specified on the html lang attribute.
+
+### Patches
+
+- Introduce prop-types instead of React.PropTypes
 
 ## 1.10.2
 Fri, 26 May 2017 10:21:03 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index c95e7695ac8ff..f3bf4ac12f364 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "3.0.0",
+  "version": "4.0.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 930b5046166fb2b4212b401011d009e32d7c7427 Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Tue, 30 May 2017 10:05:54 -0700
Subject: [PATCH 0036/1641] PeoplePicker: Updating to match OWA and Fabric
 toolkit people picker (#1843)

* attempt at people picker changes

* more changes

* More updates

* picker changes

* fix suggestions.tsx

* Fix } in suggestions.tsx

* Update onrendersuggestionitem to take in item props and persona props,

* Styling and keyboarding update, adding new layout to compact and member list layouts.

* Moving commandButton from base picker to picker to onRenderSuggestionsItem implementations

* Improving limit search layout and persona size styling.

* Styling external command button.

* Moving command button and remove button back in to suggestion, making remove button optional.

* Code clean up and styling improvements

* Rush change

* Fixing build test warnings.

* Fixing broken build and making showRemoveButtons an optional suggestions property.

* Addressing PR comments.

* Refactoring to remove lines repeated in onEmptyInputFocus and updateValue

* Changing resultsFooter and resultsFooterFull to use a basic custom renderer instead of a string.

* Making itemProps optional in people picker custom renderers.

* Letting updateSuggestions accept an index instead of a boolean that just indicates that the index is 0.

* Renaming onInputFocus for clarity.

* Adding alternative small personas with two lines instead of one and adding them to the normal sized people picker.
---
 ...peoplepicker-changes_2017-05-23-17-54.json |  10 +
 .../src/components/Persona/Persona.Props.ts   |   5 +
 .../src/components/Persona/Persona.scss       |  49 +++-
 .../src/components/Persona/Persona.tsx        |   2 +-
 .../src/components/Persona/PersonaPage.tsx    |   5 +
 .../examples/Persona.Alternate.Example.tsx    |  53 ++++
 .../components/pickers/BasePicker.Props.ts    |  39 ++-
 .../components/pickers/BasePicker.test.tsx    |   4 +-
 .../src/components/pickers/BasePicker.tsx     | 134 ++++++++--
 .../pickers/PeoplePicker/PeoplePicker.scss    |   7 +
 .../pickers/PeoplePicker/PeoplePicker.tsx     |  13 +-
 .../PeoplePickerItems/PickerItemsDefault.scss |  36 ++-
 .../PeoplePickerItems/SelectedItemDefault.tsx |   4 +-
 .../SuggestionItemDefault.tsx                 |  18 +-
 .../examples/PeoplePicker.Types.Example.tsx   |  90 ++++++-
 .../examples/PeoplePickerExampleData.ts       | 239 ++++++++++++++++--
 .../pickers/Suggestions/Suggestions.Props.ts  |  48 +++-
 .../pickers/Suggestions/Suggestions.scss      |  68 +++--
 .../pickers/Suggestions/Suggestions.tsx       |  76 +++++-
 .../Suggestions/SuggestionsController.ts      |  12 +-
 .../components/pickers/TagPicker/TagItem.scss |   5 +
 .../examples/Picker.CustomResult.Example.scss |   6 +
 .../examples/Picker.CustomResult.Example.tsx  |   9 +-
 23 files changed, 804 insertions(+), 128 deletions(-)
 create mode 100644 common/changes/v-krbrow-peoplepicker-changes_2017-05-23-17-54.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Alternate.Example.tsx

diff --git a/common/changes/v-krbrow-peoplepicker-changes_2017-05-23-17-54.json b/common/changes/v-krbrow-peoplepicker-changes_2017-05-23-17-54.json
new file mode 100644
index 0000000000000..2ee084d9e2e77
--- /dev/null
+++ b/common/changes/v-krbrow-peoplepicker-changes_2017-05-23-17-54.json
@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "PeoplePicker: Updated to match OWA people picker and Fabric toolkit spec",
+      "type": "minor"
+    }
+  ],
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts b/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
index 34309d0e5979e..3938c40b3af53 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
@@ -108,6 +108,11 @@ export interface IPersonaProps extends React.HTMLProps<Persona> {
    * Additional CSS class(es) to apply to the Persona
    */
   className?: string;
+
+  /*
+   * If true, show the secondary text line regardless of the size of the persona
+   */
+  showSecondaryText?: boolean;
 }
 
 export enum PersonaSize {
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
index e6de4e1e5e617..be1fe2d62df60 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
@@ -72,10 +72,17 @@ $ms-Persona-presenceSizeXl: 28px;
   height: $ms-Persona-sizeMd;
   display: flex;
   align-items: center;
+  overflow: hidden;
 
   .contextualHost {
     display: none;
   }
+
+  &:hover {
+    .primaryText {
+      color: $ms-color-neutralDark;
+    }
+  }
 }
 
 .imageArea {
@@ -357,7 +364,7 @@ $ms-Persona-presenceSizeXl: 28px;
   .presence {
     height: $ms-Persona-presenceSizeXxs;
     width: $ms-Persona-presenceSizeXxs;
-    border: 4px solid #ffffff;
+    border: 2px solid $ms-color-white;
     @include ms-left(16px);
   }
 
@@ -374,6 +381,18 @@ $ms-Persona-presenceSizeXl: 28px;
   .secondaryText {
     display: none;
   }
+
+  &.showSecondaryText {
+    height: 30px;
+
+    .primaryText,
+    .secondaryText {
+      display: block;
+      padding: 0;
+      line-height: 1;
+      overflow: visible;
+    }
+  }
 }
 
 
@@ -383,6 +402,7 @@ $ms-Persona-presenceSizeXl: 28px;
   height: $ms-Persona-size28;
   line-height: $ms-Persona-size28;
   min-width: $ms-Persona-size28;
+  overflow: hidden;
 
   .imageArea,
   .image {
@@ -405,8 +425,8 @@ $ms-Persona-presenceSizeXl: 28px;
   .presence {
     height: $ms-Persona-presenceSizeXxs;
     width: $ms-Persona-presenceSizeXxs;
-    border: 4px solid #ffffff;
-    @include ms-left(16px);
+    border: 2px solid $ms-color-white;
+    @include ms-left(20px);
   }
 
   .presenceIcon {
@@ -422,6 +442,16 @@ $ms-Persona-presenceSizeXl: 28px;
   .secondaryText {
     display: none;
   }
+
+  &.showSecondaryText {
+    .primaryText,
+    .secondaryText {
+      display: block;
+      padding: 0;
+      line-height: 1;
+      overflow: visible;
+    }
+  }
 }
 
 
@@ -462,6 +492,16 @@ $ms-Persona-presenceSizeXl: 28px;
   .secondaryText {
     display: none;
   }
+
+  &.showSecondaryText {
+    .primaryText,
+    .secondaryText {
+      display: block;
+      padding: 0;
+      line-height: 1;
+      overflow: visible;
+    }
+  }
 }
 
 
@@ -707,7 +747,8 @@ $ms-Persona-presenceSizeXl: 28px;
       background-color: $ms-color-presence-busy-average;
       transform: rotate(-45deg);
       position: absolute;
-      top: 5px;
+      // Using 40% as the top position of the cross bar element causes it to render in the correct position, even on very small persona sizes.
+      top: 40%;
       @include ms-left(0);
     }
 
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index a895e9e19ed35..eaf611f070c2a 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -137,7 +137,7 @@ export class Persona extends BaseComponent<IPersonaProps, IPersonaState> {
     return (
       <div
         { ...divProps }
-        className={ css('ms-Persona', styles.root, className, PERSONA_SIZE[size], PERSONA_PRESENCE[presence]) }
+        className={ css('ms-Persona', styles.root, className, PERSONA_SIZE[size], PERSONA_PRESENCE[presence], this.props.showSecondaryText ? styles.showSecondaryText : '') }
       >
         { size !== PersonaSize.tiny && (
           <div className={ css('ms-Persona-imageArea', styles.imageArea) }>
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
index d1f52d0937265..54a6190464a4f 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
@@ -7,10 +7,12 @@ import {
 } from '@uifabric/example-app-base';
 import { PersonaInitialsExample } from './examples/Persona.Initials.Example';
 import { PersonaBasicExample } from './examples/Persona.Basic.Example';
+import { PersonaAlternateExample } from './examples/Persona.Alternate.Example';
 import { PersonaCustomRenderExample } from './examples/Persona.CustomRender.Example';
 
 const PersonaInitialsExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Persona/examples/Persona.Initials.Example.tsx') as string;
 const PersonaBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx') as string;
+const PersonaAlternateExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Persona/examples/Persona.Alternate.Example.tsx') as string;
 const PersonaCustomRenderExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx') as string;
 
 export class PersonaPage extends React.Component<IComponentDemoPageProps, {}> {
@@ -24,6 +26,9 @@ export class PersonaPage extends React.Component<IComponentDemoPageProps, {}> {
             <ExampleCard title='Persona in various sizes' code={ PersonaBasicExampleCode }>
               <PersonaBasicExample />
             </ExampleCard>
+            <ExampleCard title='Alternative small personas' code={ PersonaAlternateExampleCode }>
+              <PersonaAlternateExample />
+            </ExampleCard>
             <ExampleCard title='Persona in initials' code={ PersonaInitialsExampleCode }>
               <PersonaInitialsExample />
             </ExampleCard>
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Alternate.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Alternate.Example.tsx
new file mode 100644
index 0000000000000..3e510b9baefbc
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Alternate.Example.tsx
@@ -0,0 +1,53 @@
+import * as React from 'react';
+import {
+  Persona,
+  PersonaSize,
+  PersonaPresence
+} from 'office-ui-fabric-react/lib/Persona';
+import { TestImages } from '../../../common/TestImages';
+
+const examplePersona = {
+  imageUrl: TestImages.personaMale,
+  imageInitials: 'AR',
+  primaryText: 'Annie Reid',
+  secondaryText: 'Designer',
+  tertiaryText: 'In a meeting',
+  optionalText: 'Available at 4:00pm',
+  showSecondaryText: true
+};
+
+export class PersonaAlternateExample extends React.Component<React.Props<PersonaAlternateExample>, { renderPersonaDetails?: boolean; }> {
+  constructor() {
+    super();
+    this.state = {
+      renderPersonaDetails: true
+    };
+  }
+
+  public render() {
+    let { renderPersonaDetails } = this.state;
+
+    return (
+      <div>
+        <Persona
+          { ...examplePersona }
+          size={ PersonaSize.extraExtraSmall }
+          presence={ PersonaPresence.none }
+          hidePersonaDetails={ !renderPersonaDetails }
+        />
+        <Persona
+          { ...examplePersona }
+          size={ PersonaSize.size28 }
+          presence={ PersonaPresence.none }
+          hidePersonaDetails={ !renderPersonaDetails }
+        />
+        <Persona
+          { ...examplePersona }
+          size={ PersonaSize.extraSmall }
+          presence={ PersonaPresence.online }
+          hidePersonaDetails={ !renderPersonaDetails }
+        />
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
index d4e74b885c045..bde6afbd4b424 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { IPickerItemProps } from './PickerItem.Props';
+import { IPersonaProps } from '../Persona/Persona.Props';
 import { IRenderFunction } from '../../Utilities';
 
 // Type T is the type of the item that is displayed
@@ -13,12 +14,16 @@ export interface IBasePickerProps<T> extends React.Props<any> {
   /**
    * Function that specifies how an individual suggestion item will appear.
    */
-  onRenderSuggestionsItem?: (props: T) => JSX.Element;
+  onRenderSuggestionsItem?: (props: T, itemProps?: T) => JSX.Element;
   /**
    * A callback for what should happen when a person types text into the input.
    * Returns the already selected items so the resolver can filter them out.
    */
   onResolveSuggestions: (filter: string, selectedItems?: T[]) => T[] | PromiseLike<T[]>;
+  /**
+   * A callback for what should happen when a user clicks the input.
+   */
+  onEmptyInputFocus?: (selectedItems?: T[]) => T[] | PromiseLike<T[]>;
   /**
    * Initial items that have already been selected and should appear in the people picker.
    */
@@ -48,6 +53,14 @@ export interface IBasePickerProps<T> extends React.Props<any> {
    * @default undefined
    */
   inputProps?: React.HTMLProps<HTMLInputElement>;
+  /**
+   * A callback for when a persona is removed from the suggestion list
+   */
+  onRemoveSuggestion?: (item: IPersonaProps) => void;
+  /**
+   * The text to display while searching for more results in a limited sugesstions list
+   */
+  searchingText?: ((props: { input: string }) => string) | string;
   /**
    * Flag for disabling the picker.
    * @default false
@@ -64,6 +77,10 @@ export interface IBasePickerSuggestionsProps {
    * The text that should appear at the top of the suggestion box.
    */
   suggestionsHeaderText?: string;
+  /**
+   * The text that should appear at the top of the most recenty used box.
+   */
+  mostRecentlyUsedHeaderText?: string;
   /**
    * the text that should appear when no results are returned.
    */
@@ -88,4 +105,24 @@ export interface IBasePickerSuggestionsProps {
    * The text to display while the results are loading.
    */
   loadingText?: string;
+  /**
+   * The text to display while searching for more results in a limited sugesstions list.
+   */
+  searchingText?: string;
+  /**
+   * A renderer that adds an element at the end of the suggestions list it has more items than resultsMaximumNumber.
+   */
+  resultsFooterFull?: (props) => JSX.Element;
+  /**
+   * A renderer that adds an element at the end of the suggestions list when there are fewer than resultsMaximumNumber.
+   */
+  resultsFooter?: (props) => JSX.Element;
+  /**
+   * Maximum number of suggestions to show in the full suggestion list.
+   */
+  resultsMaximumNumber?: number;
+  /**
+   * Indicates whether to show a button with each suggestion to remove that suggestion.
+   */
+  showRemoveButtons?: boolean;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
index c83b972d28dfb..2ee21cc8c1e05 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
@@ -69,7 +69,7 @@ describe('Pickers', () => {
       let suggestions = document.querySelector('.ms-Suggestions') as HTMLInputElement;
 
       expect(suggestions).to.exist;
-      let suggestionOptions = document.querySelectorAll('.ms-Suggestions-item');
+      let suggestionOptions = document.querySelectorAll('.ms-Suggestions-itemButton');
 
       expect(suggestionOptions.length).to.be.equal(2, 'There were not 2 suggestions');
       ReactTestUtils.Simulate.click(suggestionOptions[0]);
@@ -103,7 +103,7 @@ describe('Pickers', () => {
       let suggestions = document.querySelector('.ms-Suggestions') as HTMLInputElement;
 
       expect(suggestions).to.exist;
-      let suggestionOptions = document.querySelectorAll('.ms-Suggestions-item');
+      let suggestionOptions = document.querySelectorAll('.ms-Suggestions-itemButton');
 
       expect(suggestionOptions.length).to.be.equal(2, 'There were not 2 suggestions');
       ReactTestUtils.Simulate.click(suggestionOptions[0]);
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 0ba922a01f667..ea2a3412477d2 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -15,6 +15,7 @@ import { SuggestionsController } from './Suggestions/SuggestionsController';
 import { IBasePickerProps } from './BasePicker.Props';
 import { BaseAutoFill } from './AutoFill/BaseAutoFill';
 import { IPickerItemProps } from './PickerItem.Props';
+import { IPersonaProps } from '../Persona/Persona.Props';
 import * as stylesImport from './BasePicker.scss';
 const styles: any = stylesImport;
 
@@ -22,8 +23,11 @@ export interface IBasePickerState {
   items?: any;
   suggestedDisplayValue?: string;
   moreSuggestionsAvailable?: boolean;
+  isSearching?: boolean;
+  isMostRecentlyUsedVisible?: boolean;
   suggestionsVisible?: boolean;
   suggestionsLoading?: boolean;
+  isResultsFooterVisible?: boolean;
 }
 
 export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<P, IBasePickerState> {
@@ -51,7 +55,9 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     this.state = {
       items: items,
       suggestedDisplayValue: '',
-      moreSuggestionsAvailable: false
+      isMostRecentlyUsedVisible: false,
+      moreSuggestionsAvailable: false,
+      isSearching: false
     };
   }
 
@@ -93,7 +99,6 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
       inputProps,
       disabled
     } = this.props;
-
     return (
       <div
         ref={ this._resolveRef('root') }
@@ -143,11 +148,15 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
         <TypedSuggestion
           onRenderSuggestion={ this.props.onRenderSuggestionsItem }
           onSuggestionClick={ this.onSuggestionClick }
+          onSuggestionRemove={ this.onSuggestionRemove }
           suggestions={ this.suggestionStore.getSuggestions() }
           ref={ this._resolveRef('suggestionElement') }
           onGetMoreResults={ this.onGetMoreResults }
           moreSuggestionsAvailable={ this.state.moreSuggestionsAvailable }
           isLoading={ this.state.suggestionsLoading }
+          isSearching={ this.state.isSearching }
+          isMostRecentlyUsedVisible={ this.state.isMostRecentlyUsedVisible }
+          isResultsFooterVisible={ this.state.isResultsFooterVisible }
           { ...this.props.pickerSuggestionsProps as any }
         />
       </Callout>
@@ -194,19 +203,32 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   }
 
   protected updateSuggestions(suggestions: any[]) {
-    this.suggestionStore.updateSuggestions(suggestions);
+    this.suggestionStore.updateSuggestions(suggestions, 0);
     this.forceUpdate();
   }
 
+  protected onEmptyInputFocus() {
+    let suggestions: T[] | PromiseLike<T[]> = this.props.onEmptyInputFocus(this.state.items);
+    this.updateSuggestionsList(suggestions);
+  }
+
   protected updateValue(updatedValue: string) {
     let suggestions: T[] | PromiseLike<T[]> = this.props.onResolveSuggestions(updatedValue, this.state.items);
+    this.updateSuggestionsList(suggestions, updatedValue);
+  }
+
+  protected updateSuggestionsList(suggestions: T[] | PromiseLike<T[]>, updatedValue?: string) {
     let suggestionsArray: T[] = suggestions as T[];
     let suggestionsPromiseLike: PromiseLike<T[]> = suggestions as PromiseLike<T[]>;
 
     // Check to see if the returned value is an array, if it is then just pass it into the next function.
     // If the returned value is not an array then check to see if it's a promise or PromiseLike. If it is then resolve it asynchronously.
     if (Array.isArray(suggestionsArray)) {
-      this.resolveNewValue(updatedValue, suggestionsArray);
+      if (updatedValue !== undefined) {
+        this.resolveNewValue(updatedValue, suggestionsArray);
+      } else {
+        this.suggestionStore.updateSuggestions(suggestionsArray);
+      }
     } else if (suggestionsPromiseLike && suggestionsPromiseLike.then) {
       if (!this.loadingTimer) {
         this.loadingTimer = this._async.setTimeout(() => this.setState({
@@ -214,14 +236,31 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
         }), 500);
       }
 
-      this.setState({
-        suggestionsVisible: this.input.value !== '' && this.input.inputElement === document.activeElement
-      });
+      // Clear suggestions
+      this.suggestionStore.updateSuggestions([]);
+
+      if (updatedValue !== undefined) {
+        this.setState({
+          suggestionsVisible: this.input.value !== '' && this.input.inputElement === document.activeElement
+        });
+      } else {
+        this.setState({
+          suggestionsVisible: this.input.inputElement === document.activeElement
+        });
+      }
+
       // Ensure that the promise will only use the callback if it was the most recent one.
       let promise: PromiseLike<T[]> = this.currentPromise = suggestionsPromiseLike;
       promise.then((newSuggestions: T[]) => {
         if (promise === this.currentPromise) {
-          this.resolveNewValue(updatedValue, newSuggestions);
+          if (updatedValue !== undefined) {
+            this.resolveNewValue(updatedValue, newSuggestions);
+          } else {
+            this.suggestionStore.updateSuggestions(newSuggestions);
+            this.setState({
+              suggestionsLoading: false
+            });
+          }
           if (this.loadingTimer) {
             this._async.clearTimeout(this.loadingTimer);
             this.loadingTimer = undefined;
@@ -232,7 +271,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   }
 
   protected resolveNewValue(updatedValue: string, suggestions: T[]) {
-    this.suggestionStore.updateSuggestions(suggestions);
+    this.suggestionStore.updateSuggestions(suggestions, 0);
     let itemValue: string = undefined;
 
     if (this.suggestionStore.currentSuggestion) {
@@ -255,7 +294,10 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   @autobind
   protected onInputChange(value: string) {
     this.updateValue(value);
-    this.setState({ moreSuggestionsAvailable: true });
+    this.setState({
+      moreSuggestionsAvailable: true,
+      isMostRecentlyUsedVisible: false
+    });
   }
 
   @autobind
@@ -263,18 +305,35 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     this.addItemByIndex(index);
   }
 
+  @autobind
+  protected onSuggestionRemove(ev: React.MouseEvent<HTMLElement>, item: IPersonaProps, index: number) {
+    if (this.props.onRemoveSuggestion) {
+      this.props.onRemoveSuggestion(item);
+    }
+    this.suggestionStore.removeSuggestion(index);
+  }
+
   @autobind
   protected onInputFocus(ev: React.FocusEvent<HTMLInputElement | BaseAutoFill>) {
     this.selection.setAllSelected(false);
-    if (this.input.value) {
-      this.setState({ suggestionsVisible: true });
+    if (this.input.value === '' && this.props.onEmptyInputFocus) {
+      this.onEmptyInputFocus();
+      this.setState({
+        isMostRecentlyUsedVisible: true,
+        moreSuggestionsAvailable: false,
+        suggestionsVisible: true
+      });
+    } else if (this.input.value) {
+      this.setState({
+        isMostRecentlyUsedVisible: false,
+        suggestionsVisible: true
+      });
     }
   }
 
   @autobind
   protected onKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
     let value = this.input.value;
-
     switch (ev.which) {
       case KeyCodes.escape:
         if (this.state.suggestionsVisible) {
@@ -286,7 +345,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
       case KeyCodes.tab:
       case KeyCodes.enter:
-        if (!ev.shiftKey && value && this.suggestionStore.hasSelectedSuggestion() && this.state.suggestionsVisible) {
+        if (!ev.shiftKey && this.suggestionStore.hasSelectedSuggestion() && this.state.suggestionsVisible) {
           this.completeSuggestion();
           ev.preventDefault();
           ev.stopPropagation();
@@ -298,6 +357,16 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
         this.onBackspace(ev);
         break;
 
+      case KeyCodes.del:
+        if (ev.target === this.input.inputElement && this.state.suggestionsVisible && this.suggestionStore.currentIndex !== -1) {
+          if (this.props.onRemoveSuggestion) {
+            this.props.onRemoveSuggestion(this.suggestionStore.currentSuggestion.item);
+          }
+          this.suggestionStore.removeSuggestion(this.suggestionStore.currentIndex);
+          this.forceUpdate();
+        }
+        break;
+
       case KeyCodes.up:
         if (ev.target === this.input.inputElement && this.suggestionStore.previousSuggestion() && this.state.suggestionsVisible) {
           ev.preventDefault();
@@ -332,19 +401,32 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   @autobind
   protected onGetMoreResults() {
-    if (this.props.onGetMoreResults) {
-      let suggestions: T[] | PromiseLike<T[]> = this.props.onGetMoreResults(this.input.value, this.state.items);
-      let suggestionsArray: T[] = suggestions as T[];
-      let suggestionsPromiseLike: PromiseLike<T[]> = suggestions as PromiseLike<T[]>;
-
-      if (Array.isArray(suggestionsArray)) {
-        this.updateSuggestions(suggestionsArray);
-      } else if (suggestionsPromiseLike.then) {
-        suggestionsPromiseLike.then((newSuggestions: T[]) => this.updateSuggestions(newSuggestions));
+    this.setState({
+      isSearching: true
+    }, () => {
+      if (this.props.onGetMoreResults) {
+        let suggestions: T[] | PromiseLike<T[]> = this.props.onGetMoreResults(this.input.value, this.state.items);
+        let suggestionsArray: T[] = suggestions as T[];
+        let suggestionsPromiseLike: PromiseLike<T[]> = suggestions as PromiseLike<T[]>;
+
+        if (Array.isArray(suggestionsArray)) {
+          this.updateSuggestions(suggestionsArray);
+          this.setState({ isSearching: false });
+        } else if (suggestionsPromiseLike.then) {
+          suggestionsPromiseLike.then((newSuggestions: T[]) => {
+            this.updateSuggestions(newSuggestions);
+            this.setState({ isSearching: false });
+          });
+        }
+      } else {
+        this.setState({ isSearching: false });
       }
-    }
-    this.input.focus();
-    this.setState({ moreSuggestionsAvailable: false });
+      this.input.focus();
+      this.setState({
+        moreSuggestionsAvailable: false,
+        isResultsFooterVisible: true
+      });
+    });
   }
 
   @autobind
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.scss b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.scss
index 611d06831b1cc..49186633cdb62 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.scss
@@ -20,3 +20,10 @@
     min-height: 40px;
   }
 }
+
+.peoplePickerPersonaContent {
+  display: flex;
+  width: 100%;
+  justify-content: space-between;
+  align-items: center;
+}
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.tsx
index 9eedf02a7006e..3b71c47ac908b 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.tsx
@@ -6,7 +6,6 @@ import { IBasePickerProps } from '../BasePicker.Props';
 import { SelectedItemDefault } from './PeoplePickerItems/SelectedItemDefault';
 import { IPersonaProps } from '../../../Persona';
 import { SuggestionItemSmall, SuggestionItemNormal } from './PeoplePickerItems/SuggestionItemDefault';
-import { SelectedItemWithMenu } from './PeoplePickerItems/SelectedItemWithMenu';
 import './PeoplePicker.scss';
 
 export interface IPeoplePickerProps extends IBasePickerProps<IPersonaProps> {
@@ -23,8 +22,8 @@ export class MemberListPeoplePicker extends BasePickerListBelow<IPersonaProps, I
  */
 export class NormalPeoplePicker extends BasePeoplePicker {
   public static defaultProps = {
-    onRenderItem: (props) => <SelectedItemDefault {...props}/>,
-    onRenderSuggestionsItem: (props) => <SuggestionItemNormal { ...props }/>
+    onRenderItem: (props) => <SelectedItemDefault {...props} />,
+    onRenderSuggestionsItem: (props, itemProps?) => SuggestionItemNormal({ ...props }, { ...itemProps })
   };
 }
 
@@ -33,8 +32,8 @@ export class NormalPeoplePicker extends BasePeoplePicker {
 */
 export class CompactPeoplePicker extends BasePeoplePicker {
   public static defaultProps = {
-    onRenderItem: (props) => <SelectedItemDefault {...props}/>,
-    onRenderSuggestionsItem: (props) => <SuggestionItemSmall { ...props }/>
+    onRenderItem: (props) => <SelectedItemDefault {...props} />,
+    onRenderSuggestionsItem: (props, itemProps?) => SuggestionItemSmall({ ...props }, { ...itemProps })
   };
 }
 
@@ -43,7 +42,7 @@ export class CompactPeoplePicker extends BasePeoplePicker {
  */
 export class ListPeoplePicker extends MemberListPeoplePicker {
   public static defaultProps = {
-    onRenderItem: (props) => <SelectedItemWithMenu { ...props }/>,
-    onRenderSuggestionsItem: (props) => <SuggestionItemNormal { ...props }/>
+    onRenderItem: (props) => <SelectedItemDefault {...props} />,
+    onRenderSuggestionsItem: (props, itemProps?) => SuggestionItemNormal({ ...props }, { ...itemProps })
   };
 }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
index 9c3bab915561d..2ded0bab09f5d 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
@@ -2,23 +2,40 @@
 
 .personaContainer {
   @include focus-border();
+  border-radius: 15px;
   display: inline-flex;
   align-items: center;
   background: $ms-color-neutralLighter;
   margin: 1px;
   cursor: default;
   user-select: none;
-  max-width: 100%;
+  max-width: 180px;
 
   &:hover {
     background: $ms-color-neutralLight;
+
+    .removeButton {
+      color: $ms-color-neutralPrimary;
+    }
   }
 
   &.personaContainerIsSelected {
-    background: $ms-color-neutralQuaternary;
+    background: $ms-color-blue;
 
-    &:hover {
-      background: $ms-color-neutralQuaternaryAlt;
+    // Setting global values here to override persona's normal behavior specifically in this selected variation
+    :global(.ms-Persona-primaryText) {
+      color: $ms-color-white;
+    }
+
+    .removeButton {
+      :global(.ms-Button-icon) {
+        color: $ms-color-white;
+      }
+
+      &:hover {
+        color: $ms-color-white;
+        background: $ms-color-themeDark;
+      }
     }
   }
 
@@ -32,9 +49,16 @@
   }
 
   .removeButton {
+    border-radius: 15px;
     flex: 0 0 auto;
-    flex-basis: 32px;
-    height: 100%;
+    width: 28px;
+    height: 28px;
+    flex-basis: 28px;
+
+    &:hover {
+      background: $ms-color-neutralTertiaryAlt;
+      color: $ms-color-neutralDark;
+    }
   }
 
   .personaDetails {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
index af8ed7a742966..f9c158853a90d 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
@@ -26,13 +26,13 @@ export const SelectedItemDefault: (props: IPeoplePickerItemProps) => JSX.Element
         <Persona
           { ...item }
           presence={ item.presence !== undefined ? item.presence : PersonaPresence.none }
-          size={ PersonaSize.extraExtraSmall }
+          size={ PersonaSize.size28 }
         />
       </div>
       <IconButton
         onClick={ () => { if (onRemoveItem) { onRemoveItem(); } } }
         iconProps={ { iconName: 'Cancel' } }
-        className={ css('ms-PickerItem-content', styles.removeButton, styles.itemContent) }
+        className={ css('ms-PickerItem-removeButton', styles.removeButton) }
         data-is-focusable={ false }
       />
     </div >
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
index 072357a5b062e..3843ee5c1abe1 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
@@ -3,31 +3,35 @@ import * as React from 'react';
 /* tslint:enable */
 import { css } from '../../../../Utilities';
 import { Persona, PersonaSize, IPersonaProps, PersonaPresence } from '../../../../Persona';
+import { IBasePickerSuggestionsProps, ISuggestionItemProps } from 'office-ui-fabric-react/lib/Pickers';
 import * as stylesImport from '../PeoplePicker.scss';
 const styles: any = stylesImport;
 
-export const SuggestionItemNormal: (persona: IPersonaProps) => JSX.Element = (personaProps: IPersonaProps) => {
+export const SuggestionItemNormal: (persona: IPersonaProps, suggestionProps?: IBasePickerSuggestionsProps) => JSX.Element = (personaProps: IPersonaProps, suggestionItemProps?: ISuggestionItemProps<any>) => {
+  let { onRemoveItem, onClick, showRemoveButton } = suggestionItemProps;
   return (
-    <div className='ms-PeoplePicker-personaContent'>
+    <div className={ css('ms-PeoplePicker-personaContent', styles.peoplePickerPersonaContent) }>
       <Persona
         { ...personaProps }
         presence={ personaProps.presence !== undefined ? personaProps.presence : PersonaPresence.none }
-        size={ PersonaSize.small }
+        size={ PersonaSize.extraExtraSmall }
         className={ css('ms-PeoplePicker-Persona', styles.peoplePickerPersona) }
+        showSecondaryText={ true }
       />
     </div>
   );
 };
 
-export const SuggestionItemSmall: (persona: IPersonaProps) => JSX.Element = (personaProps: IPersonaProps) => {
+export const SuggestionItemSmall: (persona: IPersonaProps, suggestionProps?: IBasePickerSuggestionsProps) => JSX.Element = (personaProps: IPersonaProps, suggestionItemProps?: ISuggestionItemProps<any>) => {
+  let { onRemoveItem, onClick } = suggestionItemProps;
   return (
-    <div className='ms-PeoplePicker-personaContent'>
+    <div className={ css('ms-PeoplePicker-personaContent', styles.peoplePickerPersonaContent) }>
       <Persona
         { ...personaProps }
         presence={ personaProps.presence !== undefined ? personaProps.presence : PersonaPresence.none }
-        size={ PersonaSize.extraSmall }
+        size={ PersonaSize.extraExtraSmall }
         className={ css('ms-PeoplePicker-Persona', styles.peoplePickerPersona) }
       />
     </div>
   );
-};
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index f8a172d15567d..235c7f89c2108 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -8,7 +8,7 @@ import {
 } from 'office-ui-fabric-react/lib/Utilities';
 import { Dropdown, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
 import { Toggle } from 'office-ui-fabric-react/lib/Toggle';
-import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
+import { IPersonaProps, Persona, PersonaSize } from 'office-ui-fabric-react/lib/Persona';
 import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
 import {
   CompactPeoplePicker,
@@ -17,23 +17,34 @@ import {
   NormalPeoplePicker
 } from 'office-ui-fabric-react/lib/Pickers';
 import { IPersonaWithMenu } from 'office-ui-fabric-react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.Props';
-import { people } from './PeoplePickerExampleData';
+import { people, mostRecentlyUsed } from './PeoplePickerExampleData';
 import './PeoplePicker.Types.Example.scss';
 import { Promise } from 'es6-promise';
 
 export interface IPeoplePickerExampleState {
   currentPicker?: number | string;
   delayResults?: boolean;
+  peopleList: IPersonaProps[];
+  mostRecentlyUsed: IPersonaProps[];
 }
 
 const suggestionProps: IBasePickerSuggestionsProps = {
   suggestionsHeaderText: 'Suggested People',
+  mostRecentlyUsedHeaderText: 'Suggested Contacts',
   noResultsFoundText: 'No results found',
-  loadingText: 'Loading'
+  loadingText: 'Loading',
+  showRemoveButtons: true
 };
 
+const limitedSearchAdditionalProps: IBasePickerSuggestionsProps = {
+  searchForMoreText: 'Load all Results',
+  resultsMaximumNumber: 10,
+  searchingText: 'Searching...'
+};
+
+const limitedSearchSuggestionProps: IBasePickerSuggestionsProps = assign(limitedSearchAdditionalProps, suggestionProps);
+
 export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerExampleState> {
-  private _peopleList;
   private contextualMenuItems: IContextualMenuItem[] = [
     {
       key: 'newItem',
@@ -66,17 +77,19 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
 
   constructor() {
     super();
-    this._peopleList = [];
+    let peopleList = [];
     people.forEach((persona: IPersonaProps) => {
       let target: IPersonaWithMenu = {};
 
       assign(target, persona, { menuItems: this.contextualMenuItems });
-      this._peopleList.push(target);
+      peopleList.push(target);
     });
 
     this.state = {
       currentPicker: 1,
-      delayResults: false
+      delayResults: false,
+      peopleList: peopleList,
+      mostRecentlyUsed: mostRecentlyUsed
     };
   }
 
@@ -119,7 +132,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
           <Toggle
             label='Delay Suggestion Results'
             defaultChecked={ false }
-            onChanged={ this._toggleChange } />
+            onChanged={ this._toggleDelayResultsChange } />
         </div>
       </div>
     );
@@ -129,10 +142,12 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     return (
       <ListPeoplePicker
         onResolveSuggestions={ this._onFilterChanged }
+        onEmptyInputFocus={ this._returnMostRecentlyUsed }
         getTextFromItem={ (persona: IPersonaProps) => persona.primaryText }
         className={ 'ms-PeoplePicker' }
         pickerSuggestionsProps={ suggestionProps }
         key={ 'list' }
+        onRemoveSuggestion={ this._onRemoveSuggestion }
       />
     );
   }
@@ -141,10 +156,12 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     return (
       <NormalPeoplePicker
         onResolveSuggestions={ this._onFilterChanged }
+        onEmptyInputFocus={ this._returnMostRecentlyUsed }
         getTextFromItem={ (persona: IPersonaProps) => persona.primaryText }
         pickerSuggestionsProps={ suggestionProps }
         className={ 'ms-PeoplePicker' }
         key={ 'normal' }
+        onRemoveSuggestion={ this._onRemoveSuggestion }
       />
     );
   }
@@ -153,9 +170,11 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     return (
       <CompactPeoplePicker
         onResolveSuggestions={ this._onFilterChanged }
+        onEmptyInputFocus={ this._returnMostRecentlyUsed }
         getTextFromItem={ (persona: IPersonaProps) => persona.primaryText }
         pickerSuggestionsProps={ suggestionProps }
         className={ 'ms-PeoplePicker' }
+        onRemoveSuggestion={ this._onRemoveSuggestion }
       />
     );
   }
@@ -164,29 +183,61 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     return (
       <CompactPeoplePicker
         onResolveSuggestions={ this._onFilterChanged }
+        onEmptyInputFocus={ this._returnMostRecentlyUsed }
         getTextFromItem={ (persona: IPersonaProps) => persona.primaryText }
         className={ 'ms-PeoplePicker' }
         defaultSelectedItems={ people.splice(0, 3) }
         key={ 'list' }
         pickerSuggestionsProps={ suggestionProps }
+        onRemoveSuggestion={ this._onRemoveSuggestion }
       />
     );
   }
 
   public _renderLimitedSearch() {
-    let limitedSearchSuggestionProps = suggestionProps;
-    limitedSearchSuggestionProps.searchForMoreText = 'Load all Results';
+    limitedSearchSuggestionProps.resultsFooter = this._renderFooterText;
+    limitedSearchSuggestionProps.resultsFooterFull = this._renderFooterFullText;
+
     return (
       <CompactPeoplePicker
         onResolveSuggestions={ this._onFilterChangedWithLimit }
+        onEmptyInputFocus={ this._returnMostRecentlyUsedWithLimit }
         getTextFromItem={ (persona: IPersonaProps) => persona.primaryText }
         className={ 'ms-PeoplePicker' }
         onGetMoreResults={ this._onFilterChanged }
         pickerSuggestionsProps={ limitedSearchSuggestionProps }
+        onRemoveSuggestion={ this._onRemoveSuggestion }
       />
     );
   }
 
+  @autobind
+  private _renderFooterText(): JSX.Element {
+    return <div>No additional results</div>;
+  }
+
+  @autobind
+  private _renderFooterFullText(): JSX.Element {
+    return <div>Top 10 results</div>;
+  }
+
+  @autobind
+  private _onRemoveSuggestion(item: IPersonaProps): void {
+    let { peopleList, mostRecentlyUsed } = this.state;
+    let indexPeopleList: number = peopleList.indexOf(item);
+    let indexMostRecentlyUsed: number = mostRecentlyUsed.indexOf(item);
+
+    if (indexPeopleList >= 0) {
+      let newPeople: IPersonaProps[] = peopleList.slice(0, indexPeopleList).concat(peopleList.slice(indexPeopleList + 1));
+      this.setState({ peopleList: newPeople });
+    }
+
+    if (indexMostRecentlyUsed >= 0) {
+      let newSuggestedPeople: IPersonaProps[] = mostRecentlyUsed.slice(0, indexMostRecentlyUsed).concat(mostRecentlyUsed.slice(indexMostRecentlyUsed + 1));
+      this.setState({ mostRecentlyUsed: newSuggestedPeople });
+    }
+  }
+
   @autobind
   private _onFilterChanged(filterText: string, currentPersonas: IPersonaProps[], limitResults?: number) {
     if (filterText) {
@@ -200,6 +251,21 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     }
   }
 
+  @autobind
+  private _returnMostRecentlyUsed(currentPersonas: IPersonaProps[]): IPersonaProps[] | Promise<IPersonaProps[]> {
+    let { mostRecentlyUsed } = this.state;
+    mostRecentlyUsed = this._removeDuplicates(mostRecentlyUsed, currentPersonas);
+    return this._filterPromise(mostRecentlyUsed);
+  }
+
+  @autobind
+  private _returnMostRecentlyUsedWithLimit(currentPersonas: IPersonaProps[]): IPersonaProps[] | Promise<IPersonaProps[]> {
+    let { mostRecentlyUsed } = this.state;
+    mostRecentlyUsed = this._removeDuplicates(mostRecentlyUsed, currentPersonas);
+    mostRecentlyUsed = mostRecentlyUsed.splice(0, 3);
+    return this._filterPromise(mostRecentlyUsed);
+  }
+
   @autobind
   private _onFilterChangedWithLimit(filterText: string, currentPersonas: IPersonaProps[]): IPersonaProps[] | Promise<IPersonaProps[]> {
     return this._onFilterChanged(filterText, currentPersonas, 3);
@@ -221,7 +287,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
   }
 
   private _filterPersonasByText(filterText: string): IPersonaProps[] {
-    return this._peopleList.filter(item => this._doesTextStartWith(item.primaryText, filterText));
+    return this.state.peopleList.filter(item => this._doesTextStartWith(item.primaryText, filterText));
   }
 
   private _doesTextStartWith(text: string, filterText: string): boolean {
@@ -237,7 +303,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
   }
 
   @autobind
-  private _toggleChange(toggleState: boolean) {
+  private _toggleDelayResultsChange(toggleState: boolean) {
     this.setState({ delayResults: toggleState });
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePickerExampleData.ts b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePickerExampleData.ts
index c1a529cd0c498..53a9478cd7404 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePickerExampleData.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePickerExampleData.ts
@@ -1,24 +1,28 @@
-import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
+import { IPersonaProps, PersonaPresence } from 'office-ui-fabric-react/lib/Persona';
 import { TestImages } from '../../../../common/TestImages';
 
 export const people: IPersonaProps[] = [
   {
     key: 0,
+
     imageUrl: TestImages.personaFemale,
     imageInitials: 'PV',
     primaryText: 'Annie Lindqvist',
     secondaryText: 'Designer',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.online
   },
   {
     key: 1,
+
     imageUrl: TestImages.personaMale,
     imageInitials: 'AR',
     primaryText: 'Aaron Reid',
     secondaryText: 'Designer',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.busy
   },
   {
     key: 2,
@@ -27,7 +31,8 @@ export const people: IPersonaProps[] = [
     primaryText: 'Alex Lundberg',
     secondaryText: 'Software Developer',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.dnd
   },
   {
     key: 3,
@@ -36,7 +41,8 @@ export const people: IPersonaProps[] = [
     primaryText: 'Roko Kolar',
     secondaryText: 'Financial Analyst',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.offline
   },
   {
     key: 4,
@@ -45,7 +51,8 @@ export const people: IPersonaProps[] = [
     primaryText: 'Christian Bergqvist',
     secondaryText: 'Sr. Designer',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.online
   },
   {
     key: 5,
@@ -54,7 +61,8 @@ export const people: IPersonaProps[] = [
     primaryText: 'Valentina Lovric',
     secondaryText: 'Design Developer',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.online
   },
   {
     key: 6,
@@ -63,7 +71,8 @@ export const people: IPersonaProps[] = [
     primaryText: 'Maor Sharett',
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.away
   },
   {
     key: 7,
@@ -72,7 +81,8 @@ export const people: IPersonaProps[] = [
     primaryText: 'Anny Lindqvist',
     secondaryText: 'Designer',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.busy
   },
   {
     key: 8,
@@ -81,7 +91,8 @@ export const people: IPersonaProps[] = [
     primaryText: 'Aron Reid',
     secondaryText: 'Designer',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.dnd
   },
   {
     key: 9,
@@ -90,7 +101,8 @@ export const people: IPersonaProps[] = [
     primaryText: 'Alix Lundberg',
     secondaryText: 'Software Developer',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.offline
   },
   {
     key: 10,
@@ -99,7 +111,9 @@ export const people: IPersonaProps[] = [
     primaryText: 'Roko Kular',
     secondaryText: 'Financial Analyst',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.none
+
   },
   {
     key: 11,
@@ -108,7 +122,8 @@ export const people: IPersonaProps[] = [
     primaryText: 'Christian Bergqvest',
     secondaryText: 'Sr. Designer',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.busy
   },
   {
     key: 12,
@@ -117,7 +132,8 @@ export const people: IPersonaProps[] = [
     primaryText: 'Valintina Lovric',
     secondaryText: 'Design Developer',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.busy
   },
   {
     key: 13,
@@ -126,7 +142,8 @@ export const people: IPersonaProps[] = [
     primaryText: 'Maor Sharet',
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.blocked
   },
   {
     key: 14,
@@ -135,7 +152,8 @@ export const people: IPersonaProps[] = [
     primaryText: 'Anny Lindqvest',
     secondaryText: 'SDE',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.blocked
   },
   {
     key: 15,
@@ -144,7 +162,8 @@ export const people: IPersonaProps[] = [
     primaryText: 'Alix Lunberg',
     secondaryText: 'SE',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.away
   },
   {
     key: 16,
@@ -153,7 +172,8 @@ export const people: IPersonaProps[] = [
     primaryText: 'Annie Lindqvest',
     secondaryText: 'SDET',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.online
   },
   {
     key: 17,
@@ -162,7 +182,8 @@ export const people: IPersonaProps[] = [
     primaryText: 'Alixander Lundberg',
     secondaryText: 'Senior Manager of SDET',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.offline
   },
   {
     key: 18,
@@ -171,7 +192,8 @@ export const people: IPersonaProps[] = [
     primaryText: 'Anny Lundqvist',
     secondaryText: 'Junior Manager of Software',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.away
   },
   {
     key: 13,
@@ -180,7 +202,8 @@ export const people: IPersonaProps[] = [
     primaryText: 'Maor Shorett',
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.blocked
   },
   {
     key: 12,
@@ -189,7 +212,8 @@ export const people: IPersonaProps[] = [
     primaryText: 'Valentina Lovrics',
     secondaryText: 'Design Developer',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.online
   },
   {
     key: 13,
@@ -198,7 +222,8 @@ export const people: IPersonaProps[] = [
     primaryText: 'Maor Sharet',
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.online
   },
   {
     key: 12,
@@ -207,7 +232,8 @@ export const people: IPersonaProps[] = [
     primaryText: 'Valentina Lovrecs',
     secondaryText: 'Design Developer',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.blocked
   },
   {
     key: 13,
@@ -216,6 +242,169 @@ export const people: IPersonaProps[] = [
     primaryText: 'Maor Sharitt',
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
-    optionalText: 'Available at 4:00pm'
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.offline
+  },
+  {
+    key: 14,
+    imageUrl: './images/persona-male.png',
+    imageInitials: 'MS',
+    primaryText: 'Maor Shariett',
+    secondaryText: 'Design Developer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 3:00pm',
+    presence: PersonaPresence.online
+  },
+  {
+    key: 14,
+    imageUrl: './images/persona-female.png',
+    imageInitials: 'AL',
+    primaryText: 'Alix Lundburg',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 3:00pm',
+    presence: PersonaPresence.away
+  },
+  {
+    key: 15,
+    imageUrl: './images/persona-female.png',
+    imageInitials: 'VL',
+    primaryText: 'Valantena Lovric',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.busy
+  },
+  {
+    key: 16,
+    imageUrl: './images/persona-female.png',
+    imageInitials: 'VL',
+    primaryText: 'Velatine Lourvric',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.online
+  },
+  {
+    key: 16,
+    imageUrl: './images/persona-female.png',
+    imageInitials: 'VL',
+    primaryText: 'Valentyna Lovrique',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.busy
   },
+  {
+    key: 17,
+    imageUrl: './images/persona-female.png',
+    imageInitials: 'AL',
+    primaryText: 'Annie Lindquest',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.dnd
+  },
+  {
+    key: 18,
+    imageUrl: './images/persona-female.png',
+    imageInitials: 'AL',
+    primaryText: 'Anne Lindquist',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.blocked
+  },
+  {
+    key: 19,
+    imageUrl: './images/persona-female.png',
+    imageInitials: 'AL',
+    primaryText: 'Ann Lindqiest',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.online
+  },
+  {
+    key: 20,
+    imageUrl: './images/persona-male.png',
+    imageInitials: 'AR',
+    primaryText: 'Aron Reid',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.away
+  },
+  {
+    key: 21,
+    imageUrl: './images/persona-male.png',
+    imageInitials: 'AR',
+    primaryText: 'Aaron Reed',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.offline
+  },
+  {
+    key: 21,
+    imageUrl: './images/persona-female.png',
+    imageInitials: 'AL',
+    primaryText: 'Alix Lindberg',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.busy
+  },
+  {
+    key: 22,
+    imageUrl: './images/persona-male.png',
+    imageInitials: 'AL',
+    primaryText: 'Alan Lindberg',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.busy
+  },
+  {
+    key: 23,
+    imageUrl: './images/persona-male.png',
+    imageInitials: 'MS',
+    primaryText: 'Maor Sharit',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.offline
+  },
+  {
+    key: 24,
+    imageUrl: './images/persona-male.png',
+    imageInitials: 'MS',
+    primaryText: 'Maorr Sherit',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.online
+  },
+  {
+    key: 25,
+    imageUrl: './images/persona-male.png',
+    imageInitials: 'AL',
+    primaryText: 'Alex Lindbirg',
+    secondaryText: 'Software Developer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.dnd
+  },
+  {
+    key: 26,
+    imageUrl: './images/persona-male.png',
+    imageInitials: 'AL',
+    primaryText: 'Alex Lindbarg',
+    secondaryText: 'Software Developer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.online
+  }
 ];
+
+export const mostRecentlyUsed: IPersonaProps[] = people.slice(0, 5);
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts
index c18a14122beed..d019d72fc038c 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts
@@ -1,12 +1,13 @@
 import * as React from 'react';
 import { ISuggestionModel } from './SuggestionsController';
 import { IRenderFunction } from '../../../Utilities';
+import { IPersonaProps } from '../../Persona/Persona.Props';
 
 export interface ISuggestionsProps<T> extends React.Props<any> {
   /**
    * How the suggestion should look in the suggestion list.
    */
-  onRenderSuggestion: (props: any) => JSX.Element;
+  onRenderSuggestion: (props: T, suggestionItemProps: any) => JSX.Element;
   /**
    * What should occur when a suggestion is clicked
    */
@@ -23,6 +24,10 @@ export interface ISuggestionsProps<T> extends React.Props<any> {
    * The text that appears at the top of the suggestions list.
    */
   suggestionsHeaderText?: string;
+  /**
+   * The text that should appear at the top of the most recenty used box.
+   */
+  mostRecentlyUsedHeaderText?: string;
   /**
    * The text that appears indicating to the user that they can search for more results.
    */
@@ -56,15 +61,54 @@ export interface ISuggestionsProps<T> extends React.Props<any> {
    * Used to indicate whether or not the suggestions are loading.
    */
   isLoading?: boolean;
+  /**
+   * Used to indicate whether or not the component is searching for more results.
+   */
+  isSearching?: boolean;
   /**
    * The text to display while the results are loading.
    */
   loadingText?: string;
+  /**
+   * The text to display while searching for more results in a limited sugesstions list.
+   */
+  searchingText?: string;
+  /**
+   * Indicates if a short list of recent suggestions should be shown.
+   */
+  isMostRecentlyUsedVisible?: boolean;
+  /**
+   * Function to fire when one of the optional remove buttons on a suggestion is clicked.
+   */
+  onSuggestionRemove?: (ev?: React.MouseEvent<HTMLElement>, item?: IPersonaProps, index?: number) => void;
+  /**
+   * Indicates if the text in resultsFooter or resultsFooterFull should be shown at the end of the suggestion list.
+   */
+  isResultsFooterVisible?: boolean;
+  /**
+   * Maximum number of suggestions to show in the full suggestion list.
+   */
+  resultsMaximumNumber?: number;
+  /**
+   * A renderer that adds an element at the end of the suggestions list it has more items than resultsMaximumNumber.
+   */
+  resultsFooterFull?: (props: ISuggestionsProps<T>) => JSX.Element;
+  /**
+   * A renderer that adds an element at the end of the suggestions list it has fewer items than resultsMaximumNumber.
+   */
+  resultsFooter?: (props: ISuggestionsProps<T>) => JSX.Element;
+  /**
+   * Indicates whether to show a button with each suggestion to remove that suggestion.
+   */
+  showRemoveButtons?: boolean;
 }
 
 export interface ISuggestionItemProps<T> {
   suggestionModel: ISuggestionModel<T>;
-  RenderSuggestion: (item: any) => JSX.Element;
+  RenderSuggestion: (item: T, suggestionItemProps?: ISuggestionItemProps<T>) => JSX.Element;
   onClick: (ev: React.MouseEvent<HTMLButtonElement>) => void;
+  onRemoveItem: (ev: React.MouseEvent<HTMLButtonElement>) => void;
   className?: string;
+  id?: string;
+  showRemoveButton?: boolean;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
index 2c12965ff89f3..aae4537a84e4a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
@@ -1,28 +1,32 @@
 @import '../../../common/common';
 
 .root {
-  min-width: 180px;
+  min-width: 260px;
 }
 
 .suggestionsItem {
+  display: flex;
+  align-items: stretch;
+  box-sizing: border-box;
   width: 100%;
-  height: auto;
-
-  @include ms-text-align(left);
-  padding: 4px 20px 6px;
-
-  display: block;
-  border: none;
-  background: $ms-color-white;
+  position: relative;
 
   &:hover {
     background: $ms-color-neutralLight;
   }
 
   &.suggestionsItemIsSuggested {
-    background: $ms-color-neutralQuaternary;
+    background: $ms-color-neutralLight;
+
     &:hover {
-      background: $ms-color-neutralQuaternaryAlt;
+      background: $ms-color-neutralTertiaryAlt;
+    }
+
+    .closeButton {
+      &:hover {
+        background: $ms-color-neutralTertiary;
+        color: $ms-color-black;
+      }
     }
   }
 }
@@ -31,9 +35,12 @@
   background: none;
   border: 0;
   cursor: pointer;
-  height: auto;
-  text-align: center;
   margin: 0;
+  @include ms-padding-left(8px);
+  position: relative;
+  border-top: 1px solid $ms-color-neutralLight;
+  height: 40px;
+  @include ms-text-align(left);
   width: 100%;
   &:hover {
       background-color: $ms-color-neutralLight;
@@ -44,12 +51,21 @@
   &:active {
       background-color: $ms-color-themeLight;
   }
+
+  :global(.ms-Button-icon) {
+    font-size: 16px;
+    width: 25px;
+  }
+
+  :global(.ms-Button-label) {
+    @include margin(0, 4px, 0, 9px);
+  }
 }
 
 .suggestionsTitle {
+  padding: 0 12px;
   color: $ms-color-themePrimary;
   font-size: $ms-font-size-s;
-  text-align: center;
   text-transform: uppercase;
   line-height: 40px;
   border-bottom: 1px solid $ms-color-neutralLight;
@@ -70,8 +86,9 @@
 }
 
 .suggestionsSpinner {
-  margin: 5px;
-  text-align: center;
+  margin: 5px 0;
+  @include padding-left(14px);
+  @include text-align(left);
   white-space: nowrap;
   line-height: 20px;
 
@@ -81,7 +98,24 @@
   }
   :global(.ms-Spinner-label) {
     display: inline-block;
-    margin: 0px 10px;
+    @include margin(0px, 10px, 0, 16px);
     vertical-align: middle;
   }
+}
+
+.itemButton {
+  height: 100%;
+  width: 100%;
+  padding: 7px 12px;
+}
+
+.closeButton {
+  padding: 0 4px;
+  height: auto;
+  width: 32px;
+
+  &:hover {
+    background: $ms-color-neutralTertiaryAlt;
+    color: $ms-color-neutralDark;
+  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index c4089e99645fb..0d09f0e847cb0 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -1,9 +1,10 @@
 import * as React from 'react';
 import {
   BaseComponent,
-  css
+  css,
+  assign
 } from '../../../Utilities';
-import { CommandButton, IButton } from '../../../Button';
+import { CommandButton, IconButton, IButton } from '../../../Button';
 import { Spinner } from '../../../Spinner';
 import { ISuggestionItemProps, ISuggestionsProps } from './Suggestions.Props';
 import * as stylesImport from './Suggestions.scss';
@@ -15,11 +16,14 @@ export class SuggestionsItem<T> extends BaseComponent<ISuggestionItemProps<T>, {
       suggestionModel,
       RenderSuggestion,
       onClick,
-      className
+      className,
+      onRemoveItem,
+      showRemoveButton,
+      id
     } = this.props;
+    let itemProps = assign({}, suggestionModel.item, { onRemoveItem });
     return (
-      <CommandButton
-        onClick={ onClick }
+      <div
         className={ css(
           'ms-Suggestions-item',
           styles.suggestionsItem,
@@ -29,8 +33,22 @@ export class SuggestionsItem<T> extends BaseComponent<ISuggestionItemProps<T>, {
           className
         ) }
       >
-        <RenderSuggestion { ...suggestionModel.item as any } />
-      </CommandButton>
+        <CommandButton
+          onClick={ onClick }
+          className={ css('ms-Suggestions-itemButton', styles.itemButton) }
+        >
+          { RenderSuggestion(suggestionModel.item, this.props) }
+        </CommandButton>
+        { this.props.showRemoveButton ? (
+          <IconButton
+            iconProps={ { iconName: 'Cancel' } }
+            title='Remove'
+            ariaLabel='Remove'
+            onClick={ onRemoveItem }
+            className={ css('ms-Suggestions-closeButton', styles.closeButton) }
+          />) : (null)
+        }
+      </div>
     );
   }
 }
@@ -53,14 +71,23 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
   public render() {
     let {
       suggestionsHeaderText,
+      mostRecentlyUsedHeaderText,
       searchForMoreText,
       className,
       moreSuggestionsAvailable,
       noResultsFoundText,
       suggestions,
       isLoading,
+      isSearching,
       loadingText,
       onRenderNoResultFound,
+      searchingText,
+      isMostRecentlyUsedVisible,
+      resultsMaximumNumber,
+      resultsFooterFull,
+      resultsFooter,
+      isResultsFooterVisible,
+      showRemoveButtons,
     } = this.props;
 
     let noResults: () => JSX.Element = () => {
@@ -70,14 +97,16 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
         </div> : null;
     };
 
+    let headerText = isMostRecentlyUsedVisible && mostRecentlyUsedHeaderText ? mostRecentlyUsedHeaderText : null;
+    let footerTitle = (suggestions.length >= resultsMaximumNumber) ? resultsFooterFull : resultsFooter;
     return (
       <div className={ css(
         'ms-Suggestions',
         className ? className : '',
         styles.root) }>
-        { suggestionsHeaderText ?
+        { headerText ?
           (<div className={ css('ms-Suggestions-title', styles.suggestionsTitle) }>
-            { suggestionsHeaderText }
+            { headerText }
           </div>) : (null) }
         { isLoading && (
           <Spinner
@@ -98,6 +127,18 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
             { searchForMoreText }
           </CommandButton>
         ) }
+        { isSearching ?
+          (<Spinner
+            className={ css('ms-Suggestions-spinner', styles.suggestionsSpinner) }
+            label={ searchingText }
+          />) : (null)
+        }
+        {
+          !moreSuggestionsAvailable && !isMostRecentlyUsedVisible && !isSearching ?
+            (<div className={ css('ms-Suggestions-title', styles.suggestionsTitle) }>
+              { footerTitle(this.props) }
+            </div>) : (null)
+        }
       </div>
     );
   }
@@ -119,9 +160,15 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
     let {
       suggestions,
       onRenderSuggestion,
-      suggestionsItemClassName } = this.props;
+      suggestionsItemClassName,
+      resultsMaximumNumber,
+      showRemoveButtons } = this.props;
     let TypedSuggestionsItem = this.SuggestionsItemOfProperType;
 
+    if (resultsMaximumNumber) {
+      suggestions = suggestions.slice(0, resultsMaximumNumber);
+    }
+
     return (
       <div
         className={ css('ms-Suggestions-container', styles.suggestionsContainer) }
@@ -133,10 +180,17 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
             id={ 'sug-' + index }
             role='menuitem'>
             <TypedSuggestionsItem
+              id={ 'sug-item' + index }
               suggestionModel={ suggestion }
               RenderSuggestion={ onRenderSuggestion }
-              onClick={ (ev: React.MouseEvent<HTMLElement>) => this.props.onSuggestionClick(ev, suggestion.item, index) }
+              onClick={ (ev: React.MouseEvent<HTMLElement>) => { this.props.onSuggestionClick(ev, suggestion.item, index); } }
               className={ suggestionsItemClassName }
+              showRemoveButton={ showRemoveButtons }
+              onRemoveItem={ (ev: React.MouseEvent<HTMLElement>) => {
+                this.props.onSuggestionRemove(ev, suggestion.item, index);
+                ev.stopPropagation();
+              }
+              }
             />
           </div>) }
       </div>);
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
index 88449bb223ccb..cb701e7e692bb 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
@@ -12,12 +12,14 @@ export class SuggestionsController<T> {
     this.currentIndex = -1;
   }
 
-  public updateSuggestions(newSuggestions: T[]) {
+  public updateSuggestions(newSuggestions: T[], selectedIndex?: number) {
     if (newSuggestions && newSuggestions.length > 0) {
       this.suggestions = this._convertSuggestionsToSuggestionItems(newSuggestions);
       this.currentIndex = 0;
-      this.suggestions[0].selected = true;
-      this.currentSuggestion = this.suggestions[0];
+      if (selectedIndex !== undefined) {
+        this.suggestions[selectedIndex].selected = true;
+        this.currentSuggestion = this.suggestions[selectedIndex];
+      }
     } else {
       this.suggestions = [];
       this.currentIndex = -1;
@@ -75,6 +77,10 @@ export class SuggestionsController<T> {
     return this.currentSuggestion ? true : false;
   }
 
+  public removeSuggestion(index: number) {
+    this.suggestions.splice(index, 1);
+  }
+
   private _convertSuggestionsToSuggestionItems(suggestions: any[]): ISuggestionModel<T>[] {
     let converted: ISuggestionModel<T>[] = [];
     suggestions.forEach((suggestion: any) => converted.push({ item: suggestion, selected: false }));
diff --git a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.scss b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.scss
index acf24bca8bb89..aa9d7be1b6f93 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.scss
@@ -46,6 +46,11 @@
   flex-shrink: 0;
 }
 
+.tagItemButton {
+  width: 100%;
+  height: 100%;
+}
+
 .tagItemTextOverflow {
     overflow: hidden;
     text-overflow: ellipsis;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.scss b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.scss
index 10cb5683c8da2..32bc39e978ba5 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.scss
@@ -13,4 +13,10 @@
       width: 300px;
     }
   }
+
+  .ms-DocumentPicker-button {
+    height: 48px;
+    width: 100%;
+    padding: 4px;
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
index 75c23b0e0d285..32933f8a9e30a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
@@ -21,7 +21,9 @@ import {
   IBasePickerProps,
   BasePickerListBelow,
   BaseAutoFill,
-  IPickerItemProps
+  IPickerItemProps,
+  ISuggestionsProps,
+  ISuggestionItemProps
 } from 'office-ui-fabric-react/lib/Pickers';
 import './Picker.CustomResult.Example.scss';
 import { TestImages } from '../../../common/TestImages';
@@ -266,11 +268,14 @@ export const SuggestedDocumentItem: (documentProps: IFullDocumentCardProps) => J
   return (<div> { documentProps.documentTitleProps.title } </div>);
 };
 
-export const SuggestedBigItem: (documentProps: IFullDocumentCardProps) => JSX.Element = (documentProps: IFullDocumentCardProps) => {
+export const SuggestedBigItem: (documentProps: IFullDocumentCardProps, itemProps: ISuggestionItemProps<any>) => JSX.Element = (documentProps: IFullDocumentCardProps, itemProps: ISuggestionItemProps<any>) => {
   let {
     documentPreviewProps,
     documentTitleProps
   } = documentProps;
+  let {
+    onClick
+  } = itemProps;
   return (
     <Persona
       imageUrl={ documentPreviewProps.previewImages[0].previewImageSrc }

From 494141224cddf73bf46e21addb9c2d8354148f67 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 30 May 2017 13:10:30 -0700
Subject: [PATCH 0037/1641] Adding support for customizing the location of the
 font download (#1883)

* Adding support for defining custom locations to the fonts (or preventing the fontfaces from being registered alltogether.)

* Change files.

* Updating supported node range.

* Going back to node v6.
---
 .travis.yml                                   |  2 +-
 .../fontface-config_2017-05-30-18-57.json     | 11 +++
 .../fontface-config_2017-05-30-18-57.json     | 11 +++
 packages/office-ui-fabric-react/index.html    |  6 ++
 .../styling/src/interfaces/IFabricConfig.ts   |  6 ++
 .../styling/src/styles/DefaultFontStyles.ts   | 81 ++++++++++++-------
 6 files changed, 88 insertions(+), 29 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/fontface-config_2017-05-30-18-57.json
 create mode 100644 common/changes/office-ui-fabric-react/fontface-config_2017-05-30-18-57.json
 create mode 100644 packages/styling/src/interfaces/IFabricConfig.ts

diff --git a/.travis.yml b/.travis.yml
index f03070e42cf27..7927295fb720c 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -1,6 +1,6 @@
 language: node_js
 node_js:
-  - 'node'
+  - '6'
 before_script:
   - npm install -g gulp
 script:
diff --git a/common/changes/@uifabric/styling/fontface-config_2017-05-30-18-57.json b/common/changes/@uifabric/styling/fontface-config_2017-05-30-18-57.json
new file mode 100644
index 0000000000000..68ba50f3e6bb1
--- /dev/null
+++ b/common/changes/@uifabric/styling/fontface-config_2017-05-30-18-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Adding support for specifying `window.FabricConfig.fontBaseUrl` in order to customize where the font resources are pulled from. Leaving it blank will avoid fontface definitions from being registered.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fontface-config_2017-05-30-18-57.json b/common/changes/office-ui-fabric-react/fontface-config_2017-05-30-18-57.json
new file mode 100644
index 0000000000000..bdac204cd2e2e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fontface-config_2017-05-30-18-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "office-ui-fabric-react",
+      "type": "none"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/index.html b/packages/office-ui-fabric-react/index.html
index 7ab596ec9a628..91f6558f337b1 100644
--- a/packages/office-ui-fabric-react/index.html
+++ b/packages/office-ui-fabric-react/index.html
@@ -13,6 +13,12 @@
 <body>
   <div id="content"></div>
   <script type="text/javascript">
+    window.FabricConfig = {
+      // Uncommenting this prevents the fontfaces from being registered.
+      // Alternatively you can specify a base url which contains the font/icon assets.
+      // fontBaseUrl: ''
+    };
+
     var isProduction = (
       document.location.search.indexOf('?min=0') === -1 && (
         document.location.search.indexOf('?min=1') > -1 ||
diff --git a/packages/styling/src/interfaces/IFabricConfig.ts b/packages/styling/src/interfaces/IFabricConfig.ts
new file mode 100644
index 0000000000000..3988edf4073c9
--- /dev/null
+++ b/packages/styling/src/interfaces/IFabricConfig.ts
@@ -0,0 +1,6 @@
+/**
+ * The interface of window.FabricConfig.
+ */
+export interface IFabricConfig {
+  fontBaseUrl?: string;
+}
diff --git a/packages/styling/src/styles/DefaultFontStyles.ts b/packages/styling/src/styles/DefaultFontStyles.ts
index 69a296e143e20..36a969bce9341 100644
--- a/packages/styling/src/styles/DefaultFontStyles.ts
+++ b/packages/styling/src/styles/DefaultFontStyles.ts
@@ -1,12 +1,13 @@
 import { IFontStyles, IRawStyle } from '../interfaces/index';
 import { fontFace } from '../glamorExports';
 import {
-  getLanguage
+  getLanguage,
+  getWindow
 } from '@uifabric/utilities/lib/index';
+import { IFabricConfig } from '../interfaces/IFabricConfig';
 
 // Default urls.
-const DefaultFontUrl = 'https://static2.sharepointonline.com/files/fabric/assets/fonts';
-const DefaultIconUrl = 'https://static2.sharepointonline.com/files/fabric/assets/icons';
+const DefaultBaseUrl = 'https://static2.sharepointonline.com/files/fabric/assets';
 
 // Fallback fonts, if specified system or web fonts are unavailable.
 const FontFamilyFallbacks = `-apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif`;
@@ -128,9 +129,9 @@ function _getFontFamily(): string {
 function _createFont(size: string, weight: number): IRawStyle {
   return {
     fontFamily: _getFontFamily(),
-    '-moz-osx-font-smoothing': 'grayscale',
-    '-ms-high-contrast-adjust': 'none',
-    '-webkit-font-smoothing': 'antialiased',
+    MozOsxFontSmoothing: 'grayscale',
+    MsHighContrastAdjust: 'none',
+    WebkitFontSmoothing: 'antialiased',
     fontSize: size,
     fontWeight: weight
   };
@@ -154,11 +155,12 @@ function _registerFontFace(
 }
 
 function _registerFontFaceSet(
+  baseUrl: string,
   fontFamily: string,
   cdnFolder: string,
   cdnFontName: string = 'segoeui'
 ): void {
-  const urlBase = `${DefaultFontUrl}/${cdnFolder}/${cdnFontName}`;
+  const urlBase = `${baseUrl}/${cdnFolder}/${cdnFontName}`;
 
   _registerFontFace(fontFamily, urlBase + '-light', FontWeights.light);
   _registerFontFace(fontFamily, urlBase + '-semilight', FontWeights.semilight);
@@ -167,26 +169,49 @@ function _registerFontFaceSet(
 }
 
 function _registerDefaultFontFaces(): void {
-  // Produce @font-face definitions for all supported web fonts.
-  _registerFontFaceSet(FontNameThai, 'leelawadeeui-thai', 'leelawadeeui');
-  _registerFontFaceSet(FontNameArabic, 'segoeui-arabic');
-  _registerFontFaceSet(FontNameCyrillic, 'segoeui-cyrillic');
-  _registerFontFaceSet(FontNameEastEuropean, 'segoeui-easteuropean');
-  _registerFontFaceSet(FontNameGreek, 'segoeui-greek');
-  _registerFontFaceSet(FontNameHebrew, 'segoeui-hebrew');
-  _registerFontFaceSet(FontNameVietnamese, 'segoeui-vietnamese');
-  _registerFontFaceSet(FontNameWestEuropean, 'segoeui-westeuropean');
-  _registerFontFaceSet(FontFamilySelawik, 'selawik', 'selawik');
-
-  // Leelawadee UI (Thai) does not have a 'light' weight, so we override
-  // the font-face generated above to use the 'semilight' weight instead.
-  _registerFontFace('Leelawadee UI Web', `${DefaultFontUrl}/leelawadeeui-thai/leelawadeeui-semilight`, FontWeights.light);
-
-  // Leelawadee UI (Thai) does not have a 'semibold' weight, so we override
-  // the font-face generated above to use the 'bold' weight instead.
-  _registerFontFace('Leelawadee UI Web', `${DefaultFontUrl}/leelawadeeui-thai/leelawadeeui-bold`, FontWeights.semibold);
-
-  _registerFontFace('FabricMDL2Icons', DefaultIconUrl + '/fabricmdl2icons', FontWeights.regular);
+  const baseUrl = _getFontBaseUrl();
+
+  if (baseUrl) {
+    const fontUrl = `${baseUrl}/fonts`;
+    const iconUrl = `${baseUrl}/icons`;
+
+    // Produce @font-face definitions for all supported web fonts.
+    _registerFontFaceSet(fontUrl, FontNameThai, 'leelawadeeui-thai', 'leelawadeeui');
+    _registerFontFaceSet(fontUrl, FontNameArabic, 'segoeui-arabic');
+    _registerFontFaceSet(fontUrl, FontNameCyrillic, 'segoeui-cyrillic');
+    _registerFontFaceSet(fontUrl, FontNameEastEuropean, 'segoeui-easteuropean');
+    _registerFontFaceSet(fontUrl, FontNameGreek, 'segoeui-greek');
+    _registerFontFaceSet(fontUrl, FontNameHebrew, 'segoeui-hebrew');
+    _registerFontFaceSet(fontUrl, FontNameVietnamese, 'segoeui-vietnamese');
+    _registerFontFaceSet(fontUrl, FontNameWestEuropean, 'segoeui-westeuropean');
+    _registerFontFaceSet(fontUrl, FontFamilySelawik, 'selawik', 'selawik');
+
+    // Leelawadee UI (Thai) does not have a 'light' weight, so we override
+    // the font-face generated above to use the 'semilight' weight instead.
+    _registerFontFace('Leelawadee UI Web', `${fontUrl}/leelawadeeui-thai/leelawadeeui-semilight`, FontWeights.light);
+
+    // Leelawadee UI (Thai) does not have a 'semibold' weight, so we override
+    // the font-face generated above to use the 'bold' weight instead.
+    _registerFontFace('Leelawadee UI Web', `${fontUrl}/leelawadeeui-thai/leelawadeeui-bold`, FontWeights.semibold);
+
+    // Register icon urls.
+    _registerFontFace('FabricMDL2Icons', `${iconUrl}/fabricmdl2icons`, FontWeights.regular);
+  }
+}
+
+/**
+ * Reads the fontBaseUrl from window.FabricConfig.fontBaseUrl or falls back to a default.
+ */
+function _getFontBaseUrl(): string {
+  let win = getWindow();
+
+  // tslint:disable-next-line:no-string-literal
+  let fabricConfig: IFabricConfig = win ? win['FabricConfig'] : undefined;
+
+  return (fabricConfig && fabricConfig.fontBaseUrl !== undefined) ? fabricConfig.fontBaseUrl : DefaultBaseUrl;
 }
 
-_registerDefaultFontFaces();
\ No newline at end of file
+/**
+ * Register the font faces.
+ */
+_registerDefaultFontFaces();

From acab066bee210e1f0f104598462db31276bae6cd Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 30 May 2017 20:23:45 +0000
Subject: [PATCH 0038/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 15 +++++++++++++
 apps/fabric-website/CHANGELOG.md              |  7 +++++-
 apps/fabric-website/package.json              |  6 ++---
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../fontface-config_2017-05-30-18-57.json     | 11 ----------
 .../fontface-config_2017-05-30-18-57.json     | 11 ----------
 ...peoplepicker-changes_2017-05-23-17-54.json | 10 ---------
 packages/example-app-base/CHANGELOG.json      | 12 ++++++++++
 packages/example-app-base/CHANGELOG.md        |  7 +++++-
 packages/example-app-base/package.json        |  4 ++--
 packages/example-component/package.json       |  6 ++---
 .../office-ui-fabric-react/CHANGELOG.json     | 22 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 +++++++-
 packages/office-ui-fabric-react/package.json  |  6 ++---
 packages/styling/CHANGELOG.json               | 14 ++++++++++++
 packages/styling/CHANGELOG.md                 |  9 +++++++-
 packages/styling/package.json                 |  2 +-
 19 files changed, 106 insertions(+), 51 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/fontface-config_2017-05-30-18-57.json
 delete mode 100644 common/changes/office-ui-fabric-react/fontface-config_2017-05-30-18-57.json
 delete mode 100644 common/changes/v-krbrow-peoplepicker-changes_2017-05-23-17-54.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 0775360bc4e7a..0e9d7969e32d0 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,21 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.5.28",
+      "tag": "@uifabric/fabric-website_v4.5.28",
+      "date": "Tue, 30 May 2017 20:23:45 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `2.0.0` to `2.0.1`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.0.0 <5.0.0` to `>=4.1.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.5.27",
       "tag": "@uifabric/fabric-website_v4.5.27",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index e89dae61f36f1..dc732a1a7f8bb 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Tue, 30 May 2017 03:27:20 GMT and should not be manually modified.
+This log was last generated on Tue, 30 May 2017 20:23:45 GMT and should not be manually modified.
+
+## 4.5.28
+Tue, 30 May 2017 20:23:45 GMT
+
+*Changes not tracked*
 
 ## 4.5.27
 Tue, 30 May 2017 03:27:20 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index ab02eb2eb8388..48653163cc518 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.5.27",
+  "version": "4.5.28",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,12 +47,12 @@
     "webpack-bundle-analyzer": "^2.2.1"
   },
   "dependencies": {
-    "@uifabric/example-app-base": "2.0.0",
+    "@uifabric/example-app-base": "2.0.1",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=4.0.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.1.0 <5.0.0",
     "@uifabric/utilities": ">=4.0.0 <5.0.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 2d29df715ee6e..e3847ea456295 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -25,7 +25,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.0.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.1.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 46c4f68fb3d3f..6370c0d273a59 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,6 +33,6 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.0.0 <5.0.0"
+    "office-ui-fabric-react": ">=4.1.0 <5.0.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 6d4e2d15940ec..c5ac3a02af42a 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=4.0.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.1.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2"
diff --git a/common/changes/@uifabric/styling/fontface-config_2017-05-30-18-57.json b/common/changes/@uifabric/styling/fontface-config_2017-05-30-18-57.json
deleted file mode 100644
index 68ba50f3e6bb1..0000000000000
--- a/common/changes/@uifabric/styling/fontface-config_2017-05-30-18-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Adding support for specifying `window.FabricConfig.fontBaseUrl` in order to customize where the font resources are pulled from. Leaving it blank will avoid fontface definitions from being registered.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fontface-config_2017-05-30-18-57.json b/common/changes/office-ui-fabric-react/fontface-config_2017-05-30-18-57.json
deleted file mode 100644
index bdac204cd2e2e..0000000000000
--- a/common/changes/office-ui-fabric-react/fontface-config_2017-05-30-18-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "office-ui-fabric-react",
-      "type": "none"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/v-krbrow-peoplepicker-changes_2017-05-23-17-54.json b/common/changes/v-krbrow-peoplepicker-changes_2017-05-23-17-54.json
deleted file mode 100644
index 2ee084d9e2e77..0000000000000
--- a/common/changes/v-krbrow-peoplepicker-changes_2017-05-23-17-54.json
+++ /dev/null
@@ -1,10 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "PeoplePicker: Updated to match OWA people picker and Fabric toolkit spec",
-      "type": "minor"
-    }
-  ],
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index b23793b484d0a..2d7d16e3c5d08 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,18 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "2.0.1",
+      "tag": "@uifabric/example-app-base_v2.0.1",
+      "date": "Tue, 30 May 2017 20:23:45 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.3.0 <1.0.0` to `>=0.4.0 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "2.0.0",
       "tag": "@uifabric/example-app-base_v2.0.0",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index 25aa72aa9b951..b330c72bfa291 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Tue, 30 May 2017 03:27:20 GMT and should not be manually modified.
+This log was last generated on Tue, 30 May 2017 20:23:45 GMT and should not be manually modified.
+
+## 2.0.1
+Tue, 30 May 2017 20:23:45 GMT
+
+*Changes not tracked*
 
 ## 2.0.0
 Tue, 30 May 2017 03:27:20 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 398f2c5128c5a..2327e1daf4983 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -40,7 +40,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.3.0 <1.0.0",
+    "@uifabric/styling": ">=0.4.0 <1.0.0",
     "@uifabric/utilities": ">=4.0.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 147bdead5a12b..ee48e2e5d902c 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-component",
-  "version": "1.0.26",
+  "version": "1.0.27",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -21,7 +21,7 @@
     "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "2.0.0",
+    "@uifabric/example-app-base": "2.0.1",
     "@uifabric/utilities": "4.0.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
@@ -49,6 +49,6 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.0.0 <5.0.0"
+    "office-ui-fabric-react": ">=4.1.0 <5.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 766695f429591..62ccd1a0ac1d0 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.1.0",
+      "tag": "office-ui-fabric-react_v4.1.0",
+      "date": "Tue, 30 May 2017 20:23:45 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "930b5046166fb2b4212b401011d009e32d7c7427",
+            "comment": "PeoplePicker: Updated to match OWA people picker and Fabric toolkit spec"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.3.0 <1.0.0` to `>=0.4.0 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `2.0.0` to `2.0.1`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.0.0",
       "tag": "office-ui-fabric-react_v4.0.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index d8adff3ca13c6..217f29f620a1b 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 30 May 2017 03:27:20 GMT and should not be manually modified.
+This log was last generated on Tue, 30 May 2017 20:23:45 GMT and should not be manually modified.
+
+## 4.1.0
+Tue, 30 May 2017 20:23:45 GMT
+
+### Minor changes
+
+- PeoplePicker: Updated to match OWA people picker and Fabric toolkit spec
 
 ## 4.0.0
 Tue, 30 May 2017 03:27:20 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 265bbc7b355e2..0ba13ebcd60f9 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.0.0",
+  "version": "4.1.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "^2.2.2",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "2.0.0",
+    "@uifabric/example-app-base": "2.0.1",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.0.0 <5.0.0",
-    "@uifabric/styling": ">=0.3.0 <1.0.0",
+    "@uifabric/styling": ">=0.4.0 <1.0.0",
     "prop-types": "^15.5.10"
   },
   "peerDependencies": {
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index e53e015ee2b45..0f97bd0ed3b88 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.4.0",
+      "tag": "@uifabric/styling_v0.4.0",
+      "date": "Tue, 30 May 2017 20:23:45 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "494141224cddf73bf46e21addb9c2d8354148f67",
+            "comment": "Adding support for specifying `window.FabricConfig.fontBaseUrl` in order to customize where the font resources are pulled from. Leaving it blank will avoid fontface definitions from being registered."
+          }
+        ]
+      }
+    },
     {
       "version": "0.3.0",
       "tag": "@uifabric/styling_v0.3.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index aa8cb1df800df..6196a9be967d0 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Tue, 30 May 2017 03:27:20 GMT and should not be manually modified.
+This log was last generated on Tue, 30 May 2017 20:23:45 GMT and should not be manually modified.
+
+## 0.4.0
+Tue, 30 May 2017 20:23:45 GMT
+
+### Minor changes
+
+- Adding support for specifying `window.FabricConfig.fontBaseUrl` in order to customize where the font resources are pulled from. Leaving it blank will avoid fontface definitions from being registered.
 
 ## 0.3.0
 Tue, 30 May 2017 03:27:20 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 8af655286ed87..203c246de27d2 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From b6634efe0d29aaeed26332375b05eba16d9d53a5 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Tue, 30 May 2017 15:07:59 -0700
Subject: [PATCH 0039/1641] ResizeGroup: Reduce render times when shrinking the
 contianer (#1881)

* Don't rerender when everything already fits in a resize group.

* Add comments

* More accurate typing of _lastKnownRootWidth

* update grammer, add new test

* Rush change

* When the window shrinks and the contents of the container don't fit, we should call onReduceData from the rendered data instead of starting from the beginning.

* Remove early returns

* Revert "Remove early returns"

This reverts commit 277df88dcaa14d00b29d2d209d35dfea7846e38d.

* Move to single return.

* Remove all returns

* Rush change
---
 ...roup-dont-start-over_2017-05-30-17-29.json | 11 +++
 .../ResizeGroup/ResizeGroup.test.tsx          | 95 +++++++++++++------
 .../components/ResizeGroup/ResizeGroup.tsx    | 28 ++++--
 3 files changed, 100 insertions(+), 34 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/resizegroup-dont-start-over_2017-05-30-17-29.json

diff --git a/common/changes/office-ui-fabric-react/resizegroup-dont-start-over_2017-05-30-17-29.json b/common/changes/office-ui-fabric-react/resizegroup-dont-start-over_2017-05-30-17-29.json
new file mode 100644
index 0000000000000..3f22371f9c405
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/resizegroup-dont-start-over_2017-05-30-17-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ResizeGroup: Reduce render time when reducing the width of the container.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chrisgo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
index f1747af1d86be..c977dc6e7563a 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
@@ -202,6 +202,74 @@ describe('ResizeGroup', () => {
     expect(renderSpy.callCount).to.equal(3);
   });
 
+  it('starts scaling from the initial data when the container grows', () => {
+    let data = { scalingIndex: 10 };
+
+    let { wrapper,
+      onReduceDataSpy,
+      rootGetClientRectMock,
+      measuredGetClientRectMock } = getWrapperWithMocks(data, onReduceScalingData);
+
+    // Simulate a few scale down calls.
+    rootGetClientRectMock.returns({ width: 200 });
+    measuredGetClientRectMock.onFirstCall().returns({ width: 300 });
+    measuredGetClientRectMock.onSecondCall().returns({ width: 250 });
+    measuredGetClientRectMock.onThirdCall().returns({ width: 150 });
+    wrapper.setState({ shouldMeasure: true });
+
+    expect(wrapper.state().renderedData.scalingIndex).to.equal(8);
+
+    onReduceDataSpy.reset();
+    rootGetClientRectMock.reset();
+    measuredGetClientRectMock.reset();
+
+    // Simulate a resize where the container grows
+    rootGetClientRectMock.returns({ width: 300 });
+    measuredGetClientRectMock.returns({ width: 150 });
+
+    window.dispatchEvent(new Event('resize'));
+
+    // The contents fit, so there should be no call to onReduceData
+    expect(onReduceDataSpy.callCount).to.equal(0);
+
+    // The internal state should match that of the initial data
+    expect(wrapper.state().renderedData.scalingIndex).to.equal(10);
+  });
+
+  it('continues scaling from the last rendered data when the container shrinks', () => {
+    let data = { scalingIndex: 10 };
+
+    let { wrapper,
+      onReduceDataSpy,
+      rootGetClientRectMock,
+      measuredGetClientRectMock } = getWrapperWithMocks(data, onReduceScalingData);
+
+    // Simulate a few scale down calls.
+    rootGetClientRectMock.returns({ width: 200 });
+    measuredGetClientRectMock.onFirstCall().returns({ width: 300 });
+    measuredGetClientRectMock.onSecondCall().returns({ width: 250 });
+    measuredGetClientRectMock.onThirdCall().returns({ width: 150 });
+    wrapper.setState({ shouldMeasure: true });
+
+    expect(wrapper.state().renderedData.scalingIndex).to.equal(8);
+
+    onReduceDataSpy.reset();
+    rootGetClientRectMock.reset();
+    measuredGetClientRectMock.reset();
+
+    // Simulate a resize where the container shrinks and the contents don't fit
+    // The contents will then fit after a call to onReduceData
+    rootGetClientRectMock.returns({ width: 100 });
+    measuredGetClientRectMock.onFirstCall().returns({ width: 150 });
+    measuredGetClientRectMock.onSecondCall().returns({ width: 50 });
+
+    window.dispatchEvent(new Event('resize'));
+
+    expect(onReduceDataSpy.callCount).to.equal(1);
+    expect(onReduceDataSpy.getCall(0).args[0]).to.deep.equal({ scalingIndex: 8 });
+    expect(wrapper.state().renderedData.scalingIndex).to.equal(7);
+  });
+
   it('continues to shrink until everything fits', () => {
     let data = { scalingIndex: 7 };
 
@@ -246,33 +314,6 @@ describe('ResizeGroup', () => {
     expect(onRenderSpy.callCount).to.equal(2);
   });
 
-  it('starts from the beginning when resizing', () => {
-    let data = { scalingIndex: 10 };
-    let { wrapper, onRenderDataSpy } = getWrapperWithMocks(data);
-
-    wrapper.setState({
-      renderedData: { scalingIndex: 5 },
-      shouldMeasure: false
-    });
-
-    onRenderDataSpy.reset();
-    wrapper.setState({
-      shouldMeasure: true
-    });
-
-    // This is a scenario where too many renders take place,
-    // but the important thing here is that the last onRender data
-    // starts from the beginning to make sure we are making maximal
-    // use of the screen real estate.
-    expect(onRenderDataSpy.callCount).to.equal(3);
-    expect(onRenderDataSpy.getCall(2).args[0]).to.deep.equal(data);
-    expect(wrapper.state()).to.deep.equal({
-      renderedData: data,
-      measuredData: data,
-      shouldMeasure: false
-    });
-  });
-
   it('does not call onReduceData again when it returns undefined', () => {
     let mockData = { data: 'foo' };
     let onReduceDataStub = sinon.stub();
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index 335e69670109a..5813921fd6778 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -92,19 +92,33 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
   }
 
   private _onResize() {
-    // If we have some cached measurements, let's see if we can skip rendering
+    let shouldMeasure = true;
+    let nextMeasuredData = this.state.measuredData;
+
     if (this._root && this._lastKnownRootWidth && this._lastKnownMeasuredWidth) {
+      // If we have some cached measurements, let's see if we can skip rendering
       let containerWidth = this._root.getBoundingClientRect().width;
 
-      // If the container didn't grow and the component still fits, don't trigger a remeasure.
-      // If the container grew, we want to trigger a remeasure since we might be able to fit more content.
-      if (containerWidth <= this._lastKnownRootWidth && this._lastKnownMeasuredWidth <= containerWidth) {
-        this._lastKnownRootWidth = containerWidth;
-        return;
+      if (containerWidth <= this._lastKnownRootWidth) {
+        // If the container shrank as a result of this resize, we can do an optimized rerender.
+        if (this._lastKnownMeasuredWidth <= containerWidth) {
+          // If the contents still fit within the container, don't trigger a remeasure.
+          this._lastKnownRootWidth = containerWidth;
+          shouldMeasure = false;
+        } else {
+          // If the container shrank and the contents don't fit, we can trigger a measurement
+          // pass starting from the current value of rendered data.
+          nextMeasuredData = this.state.renderedData;
+        }
       }
     }
 
-    this.setState({ shouldMeasure: true });
+    if (shouldMeasure) {
+      this.setState({
+        shouldMeasure: true,
+        measuredData: nextMeasuredData
+      });
+    }
   }
 
   private _measureItems() {

From ee2ea2da473875f48afc28b4270bc658eaa49f92 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 30 May 2017 17:49:39 -0700
Subject: [PATCH 0040/1641] Reverts the accidentally added prop from the picker
 PR. (#1884)

Reverts the accidentally added 'props' from the picker changes a few hours ago.

Updates an import to be AMD friendly.
---
 .../styling/fixes_2017-05-30-23-57.json       | 11 +++++++
 .../styling/fixes_2017-05-31-00-44.json       | 11 +++++++
 .../fixes_2017-05-30-23-57.json               | 11 +++++++
 .../fixes_2017-05-31-00-44.json               | 11 +++++++
 .../components/pickers/BasePicker.Props.ts    |  4 +--
 .../styling/src/classNames/IconClassNames.ts  | 18 ++++++-----
 .../src/examples/IconTile/IconTile.tsx        |  6 ++--
 packages/styling/src/glamorExports.ts         | 31 ++++++++++++-------
 packages/styling/src/index.ts                 |  2 +-
 9 files changed, 80 insertions(+), 25 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/fixes_2017-05-30-23-57.json
 create mode 100644 common/changes/@uifabric/styling/fixes_2017-05-31-00-44.json
 create mode 100644 common/changes/office-ui-fabric-react/fixes_2017-05-30-23-57.json
 create mode 100644 common/changes/office-ui-fabric-react/fixes_2017-05-31-00-44.json

diff --git a/common/changes/@uifabric/styling/fixes_2017-05-30-23-57.json b/common/changes/@uifabric/styling/fixes_2017-05-30-23-57.json
new file mode 100644
index 0000000000000..f6d55bf7f71ba
--- /dev/null
+++ b/common/changes/@uifabric/styling/fixes_2017-05-30-23-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/fixes_2017-05-31-00-44.json b/common/changes/@uifabric/styling/fixes_2017-05-31-00-44.json
new file mode 100644
index 0000000000000..a48c3ede3f94c
--- /dev/null
+++ b/common/changes/@uifabric/styling/fixes_2017-05-31-00-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Icon classes: adjusting how they are registered so that we merge raw styles together to form the icon classes.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fixes_2017-05-30-23-57.json b/common/changes/office-ui-fabric-react/fixes_2017-05-30-23-57.json
new file mode 100644
index 0000000000000..686e145fc013d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fixes_2017-05-30-23-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "BasePicker: Removing extraneous unnecessary required non-typesafe prop that isn't being used.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fixes_2017-05-31-00-44.json b/common/changes/office-ui-fabric-react/fixes_2017-05-31-00-44.json
new file mode 100644
index 0000000000000..bdac204cd2e2e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fixes_2017-05-31-00-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "office-ui-fabric-react",
+      "type": "none"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
index bde6afbd4b424..f95ac98cebeb1 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
@@ -112,11 +112,11 @@ export interface IBasePickerSuggestionsProps {
   /**
    * A renderer that adds an element at the end of the suggestions list it has more items than resultsMaximumNumber.
    */
-  resultsFooterFull?: (props) => JSX.Element;
+  resultsFooterFull?: () => JSX.Element;
   /**
    * A renderer that adds an element at the end of the suggestions list when there are fewer than resultsMaximumNumber.
    */
-  resultsFooter?: (props) => JSX.Element;
+  resultsFooter?: () => JSX.Element;
   /**
    * Maximum number of suggestions to show in the full suggestion list.
    */
diff --git a/packages/styling/src/classNames/IconClassNames.ts b/packages/styling/src/classNames/IconClassNames.ts
index 1a518c4527ba9..fa104b98bafd1 100644
--- a/packages/styling/src/classNames/IconClassNames.ts
+++ b/packages/styling/src/classNames/IconClassNames.ts
@@ -2,9 +2,6 @@ import { IconCodes, DefaultFontStyles } from '../styles/index';
 import {
   mergeStyles
 } from '../utilities/index';
-import {
-  before
-} from '../glamorExports';
 
 /**
  * All class names for all Fabric icons.
@@ -14,10 +11,17 @@ export const IconClassNames: {[key in keyof typeof IconCodes]?: string } = {};
 // tslint:disable-next-line:forin
 for (const iconName in IconCodes) {
   Object.defineProperty(IconClassNames, iconName, {
-    get: (): string => mergeStyles(
-      DefaultFontStyles.icon,
-      before({ content: `"${IconCodes[iconName]}"` })
-    ).toString(),
+    get: (): string => {
+      let className = mergeStyles(
+        DefaultFontStyles.icon,
+        {
+          ':before': {
+            content: `"${IconCodes[iconName]}"`
+          }
+        },
+      ).toString();
+      return className;
+    },
     enumerable: true,
     configurable: true
   });
diff --git a/packages/styling/src/examples/IconTile/IconTile.tsx b/packages/styling/src/examples/IconTile/IconTile.tsx
index 587d2ec8fda92..c1f67a3ee8a39 100644
--- a/packages/styling/src/examples/IconTile/IconTile.tsx
+++ b/packages/styling/src/examples/IconTile/IconTile.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { SearchBox } from 'office-ui-fabric-react/lib/SearchBox';
-import { IconCodes } from '@uifabric/styling';
+import { IconClassNames } from '@uifabric/styling';
 import { IIconTileStyles, getStyles } from './IconTile.styles';
 
 export interface IIconTileProps extends React.HTMLProps<HTMLDivElement> {
@@ -8,12 +8,12 @@ export interface IIconTileProps extends React.HTMLProps<HTMLDivElement> {
 }
 
 export function IconTile(props: IIconTileProps): JSX.Element {
-  const { iconName, ...divProps }: IIconTileProps = props;
+  const { iconName, children, ...divProps }: IIconTileProps = props;
   const styles: IIconTileStyles = getStyles();
 
   return (
     <div className={ styles.iconTile as string } { ...divProps }>
-      <i className={ styles.icon as string }>{ IconCodes[iconName] }</i>
+      <i className={ IconClassNames[iconName] + ' ' + styles.icon } />
       <div>{ iconName }</div>
     </div>
   );
diff --git a/packages/styling/src/glamorExports.ts b/packages/styling/src/glamorExports.ts
index 978d6cfa95015..3862dc9b0b2b3 100644
--- a/packages/styling/src/glamorExports.ts
+++ b/packages/styling/src/glamorExports.ts
@@ -1,25 +1,32 @@
 import * as Glamor from 'glamor';
 import rtlify from 'rtl-css-js';
 import { IRawStyle, IProcessedStyle } from './interfaces/index';
-import { getRTL } from '@uifabric/utilities';
+import { getRTL } from '@uifabric/utilities/lib/index';
 
 interface IGlamorRulePair {
   selector: string;
   style: Glamor.CSSProperties;
 }
 
-// force speedy.
-// tslint:disable-next-line:no-string-literal
-Glamor['speedy'](true);
+function _initializeGlamor(): void {
+  // force speedy.
+  // tslint:disable-next-line:no-string-literal
+  if (!Glamor['styleSheet'] || !Glamor['styleSheet'].isSpeedy) {
+    // tslint:disable-next-line:no-string-literal
+    Glamor['speedy'](true);
+  }
 
-// tslint:disable-next-line:no-string-literal
-Glamor['plugins'].add(
-  ({ selector, style }: IGlamorRulePair): IGlamorRulePair => (
-    {
-      selector,
-      style: getRTL() ? rtlify(style) : style
-    }
-  ));
+  // tslint:disable-next-line:no-string-literal
+  Glamor['plugins'].add(
+    ({ selector, style }: IGlamorRulePair): IGlamorRulePair => (
+      {
+        selector,
+        style: getRTL() ? rtlify(style) : style
+      }
+    ));
+}
+
+_initializeGlamor();
 
 /**
  * Defines a :before pseudo-selector scoped style object for the given raw style.
diff --git a/packages/styling/src/index.ts b/packages/styling/src/index.ts
index 7504ad8c76fe4..9a45f899bb873 100644
--- a/packages/styling/src/index.ts
+++ b/packages/styling/src/index.ts
@@ -1,5 +1,5 @@
+export * from './glamorExports';
 export * from './classNames/index';
 export * from './styles/index';
 export * from './utilities/index';
 export * from './interfaces/index';
-export * from './glamorExports';

From 02a1d5a22a995d01caeab0b0e64c903542cf6a9c Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 30 May 2017 18:47:39 -0700
Subject: [PATCH 0041/1641] Adding .npmrc files. (#1886)

* Fixes.

* change files.

* Addressing a weird issue with merging processed styles.

* Adding change files.

* Adding npmrc files.

* update the selective build.
---
 apps/fabric-website/.npmrc             |  2 ++
 packages/example-app-base/.npmrc       |  2 ++
 packages/example-component/.npmrc      |  2 ++
 packages/office-ui-fabric-react/.npmrc |  2 ++
 packages/styling/.npmignore            | 23 +++++++++++++++++++++++
 packages/styling/.npmrc                |  2 ++
 packages/utilities/.npmrc              |  2 ++
 scripts/selective-build.js             |  2 +-
 8 files changed, 36 insertions(+), 1 deletion(-)
 create mode 100644 apps/fabric-website/.npmrc
 create mode 100644 packages/example-app-base/.npmrc
 create mode 100644 packages/example-component/.npmrc
 create mode 100644 packages/office-ui-fabric-react/.npmrc
 create mode 100644 packages/styling/.npmignore
 create mode 100644 packages/styling/.npmrc
 create mode 100644 packages/utilities/.npmrc

diff --git a/apps/fabric-website/.npmrc b/apps/fabric-website/.npmrc
new file mode 100644
index 0000000000000..825c83e09df4d
--- /dev/null
+++ b/apps/fabric-website/.npmrc
@@ -0,0 +1,2 @@
+registry=https://registry.npmjs.org/
+
diff --git a/packages/example-app-base/.npmrc b/packages/example-app-base/.npmrc
new file mode 100644
index 0000000000000..825c83e09df4d
--- /dev/null
+++ b/packages/example-app-base/.npmrc
@@ -0,0 +1,2 @@
+registry=https://registry.npmjs.org/
+
diff --git a/packages/example-component/.npmrc b/packages/example-component/.npmrc
new file mode 100644
index 0000000000000..825c83e09df4d
--- /dev/null
+++ b/packages/example-component/.npmrc
@@ -0,0 +1,2 @@
+registry=https://registry.npmjs.org/
+
diff --git a/packages/office-ui-fabric-react/.npmrc b/packages/office-ui-fabric-react/.npmrc
new file mode 100644
index 0000000000000..825c83e09df4d
--- /dev/null
+++ b/packages/office-ui-fabric-react/.npmrc
@@ -0,0 +1,2 @@
+registry=https://registry.npmjs.org/
+
diff --git a/packages/styling/.npmignore b/packages/styling/.npmignore
new file mode 100644
index 0000000000000..e904e69d3b861
--- /dev/null
+++ b/packages/styling/.npmignore
@@ -0,0 +1,23 @@
+*.config.js
+*.nuspec
+*.yml
+*.log
+*.test.*
+.editorconfig
+.gitattributes
+.gitignore
+.vscode
+coverage
+dist/*.stats.html
+dist/demo*.*
+gulpfile.js
+index.html
+jsconfig.json
+karma.config.js
+node_modules
+src
+tsconfig.json
+tsd.json
+tslint.json
+typings
+*.config.js
diff --git a/packages/styling/.npmrc b/packages/styling/.npmrc
new file mode 100644
index 0000000000000..825c83e09df4d
--- /dev/null
+++ b/packages/styling/.npmrc
@@ -0,0 +1,2 @@
+registry=https://registry.npmjs.org/
+
diff --git a/packages/utilities/.npmrc b/packages/utilities/.npmrc
new file mode 100644
index 0000000000000..825c83e09df4d
--- /dev/null
+++ b/packages/utilities/.npmrc
@@ -0,0 +1,2 @@
+registry=https://registry.npmjs.org/
+
diff --git a/scripts/selective-build.js b/scripts/selective-build.js
index 673d137e7321b..9e20aefd82f13 100644
--- a/scripts/selective-build.js
+++ b/scripts/selective-build.js
@@ -101,7 +101,7 @@ if (changedPackages) {
     /* Build specifics. */
     console.log('Building specific packages with detected changes.');
     changedPackages.forEach(packageName => {
-      const buildCommand = `${rushLocation} build --from ${packageName} --to ${packageName} ${defaultRushParams}`;
+      const buildCommand = `node ${rushLocation} build --from ${packageName} --to ${packageName} ${defaultRushParams}`;
       console.log(`Running: ${buildCommand}`);
       child_process.execSync(buildCommand, { stdio: [0, 1, 2] });
     });

From 37ced2a2cb72231102cdccbc41c626a427578eb8 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 31 May 2017 01:58:23 +0000
Subject: [PATCH 0042/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 15 +++++++++++
 apps/fabric-website/CHANGELOG.md              |  7 ++++-
 apps/fabric-website/package.json              |  6 ++---
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../styling/fixes_2017-05-30-23-57.json       | 11 --------
 .../styling/fixes_2017-05-31-00-44.json       | 11 --------
 .../fixes_2017-05-30-23-57.json               | 11 --------
 .../fixes_2017-05-31-00-44.json               | 11 --------
 ...roup-dont-start-over_2017-05-30-17-29.json | 11 --------
 packages/example-app-base/CHANGELOG.json      | 12 +++++++++
 packages/example-app-base/CHANGELOG.md        |  7 ++++-
 packages/example-app-base/package.json        |  4 +--
 packages/example-component/package.json       |  6 ++---
 .../office-ui-fabric-react/CHANGELOG.json     | 27 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 ++++++-
 packages/office-ui-fabric-react/package.json  |  6 ++---
 packages/styling/CHANGELOG.json               | 14 ++++++++++
 packages/styling/CHANGELOG.md                 |  9 ++++++-
 packages/styling/package.json                 |  2 +-
 21 files changed, 112 insertions(+), 74 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/fixes_2017-05-30-23-57.json
 delete mode 100644 common/changes/@uifabric/styling/fixes_2017-05-31-00-44.json
 delete mode 100644 common/changes/office-ui-fabric-react/fixes_2017-05-30-23-57.json
 delete mode 100644 common/changes/office-ui-fabric-react/fixes_2017-05-31-00-44.json
 delete mode 100644 common/changes/office-ui-fabric-react/resizegroup-dont-start-over_2017-05-30-17-29.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 0e9d7969e32d0..d1793698893fd 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,21 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.5.29",
+      "tag": "@uifabric/fabric-website_v4.5.29",
+      "date": "Wed, 31 May 2017 01:58:23 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `2.0.1` to `2.0.2`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.1.0 <5.0.0` to `>=4.1.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.5.28",
       "tag": "@uifabric/fabric-website_v4.5.28",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index dc732a1a7f8bb..c7f97850e5ca1 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Tue, 30 May 2017 20:23:45 GMT and should not be manually modified.
+This log was last generated on Wed, 31 May 2017 01:58:23 GMT and should not be manually modified.
+
+## 4.5.29
+Wed, 31 May 2017 01:58:23 GMT
+
+*Changes not tracked*
 
 ## 4.5.28
 Tue, 30 May 2017 20:23:45 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 48653163cc518..43687e963de44 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.5.28",
+  "version": "4.5.29",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,12 +47,12 @@
     "webpack-bundle-analyzer": "^2.2.1"
   },
   "dependencies": {
-    "@uifabric/example-app-base": "2.0.1",
+    "@uifabric/example-app-base": "2.0.2",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=4.1.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.1.1 <5.0.0",
     "@uifabric/utilities": ">=4.0.0 <5.0.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index e3847ea456295..72b7aa72b7516 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -25,7 +25,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.1.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.1.1 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 6370c0d273a59..1d9f0f6bb6b07 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,6 +33,6 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.1.0 <5.0.0"
+    "office-ui-fabric-react": ">=4.1.1 <5.0.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index c5ac3a02af42a..c9a8463507528 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=4.1.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.1.1 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2"
diff --git a/common/changes/@uifabric/styling/fixes_2017-05-30-23-57.json b/common/changes/@uifabric/styling/fixes_2017-05-30-23-57.json
deleted file mode 100644
index f6d55bf7f71ba..0000000000000
--- a/common/changes/@uifabric/styling/fixes_2017-05-30-23-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/fixes_2017-05-31-00-44.json b/common/changes/@uifabric/styling/fixes_2017-05-31-00-44.json
deleted file mode 100644
index a48c3ede3f94c..0000000000000
--- a/common/changes/@uifabric/styling/fixes_2017-05-31-00-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Icon classes: adjusting how they are registered so that we merge raw styles together to form the icon classes.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fixes_2017-05-30-23-57.json b/common/changes/office-ui-fabric-react/fixes_2017-05-30-23-57.json
deleted file mode 100644
index 686e145fc013d..0000000000000
--- a/common/changes/office-ui-fabric-react/fixes_2017-05-30-23-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "BasePicker: Removing extraneous unnecessary required non-typesafe prop that isn't being used.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fixes_2017-05-31-00-44.json b/common/changes/office-ui-fabric-react/fixes_2017-05-31-00-44.json
deleted file mode 100644
index bdac204cd2e2e..0000000000000
--- a/common/changes/office-ui-fabric-react/fixes_2017-05-31-00-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "office-ui-fabric-react",
-      "type": "none"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/resizegroup-dont-start-over_2017-05-30-17-29.json b/common/changes/office-ui-fabric-react/resizegroup-dont-start-over_2017-05-30-17-29.json
deleted file mode 100644
index 3f22371f9c405..0000000000000
--- a/common/changes/office-ui-fabric-react/resizegroup-dont-start-over_2017-05-30-17-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ResizeGroup: Reduce render time when reducing the width of the container.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chrisgo@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 2d7d16e3c5d08..9900eee872112 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,18 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "2.0.2",
+      "tag": "@uifabric/example-app-base_v2.0.2",
+      "date": "Wed, 31 May 2017 01:58:23 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.4.0 <1.0.0` to `>=0.4.1 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "2.0.1",
       "tag": "@uifabric/example-app-base_v2.0.1",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index b330c72bfa291..74e1468635d9d 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Tue, 30 May 2017 20:23:45 GMT and should not be manually modified.
+This log was last generated on Wed, 31 May 2017 01:58:23 GMT and should not be manually modified.
+
+## 2.0.2
+Wed, 31 May 2017 01:58:23 GMT
+
+*Changes not tracked*
 
 ## 2.0.1
 Tue, 30 May 2017 20:23:45 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 2327e1daf4983..d4fa4fefb45da 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "2.0.1",
+  "version": "2.0.2",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -40,7 +40,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.4.0 <1.0.0",
+    "@uifabric/styling": ">=0.4.1 <1.0.0",
     "@uifabric/utilities": ">=4.0.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index ee48e2e5d902c..1bc154f955031 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-component",
-  "version": "1.0.27",
+  "version": "1.0.28",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -21,7 +21,7 @@
     "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "2.0.1",
+    "@uifabric/example-app-base": "2.0.2",
     "@uifabric/utilities": "4.0.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
@@ -49,6 +49,6 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.1.0 <5.0.0"
+    "office-ui-fabric-react": ">=4.1.1 <5.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 62ccd1a0ac1d0..09969f66a5ac0 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,33 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.1.1",
+      "tag": "office-ui-fabric-react_v4.1.1",
+      "date": "Wed, 31 May 2017 01:58:23 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "ee2ea2da473875f48afc28b4270bc658eaa49f92",
+            "comment": "BasePicker: Removing extraneous unnecessary required non-typesafe prop that isn't being used."
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "b6634efe0d29aaeed26332375b05eba16d9d53a5",
+            "comment": "ResizeGroup: Reduce render time when reducing the width of the container."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.4.0 <1.0.0` to `>=0.4.1 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `2.0.1` to `2.0.2`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.1.0",
       "tag": "office-ui-fabric-react_v4.1.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 217f29f620a1b..2af470ec2a04d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 30 May 2017 20:23:45 GMT and should not be manually modified.
+This log was last generated on Wed, 31 May 2017 01:58:23 GMT and should not be manually modified.
+
+## 4.1.1
+Wed, 31 May 2017 01:58:23 GMT
+
+### Patches
+
+- BasePicker: Removing extraneous unnecessary required non-typesafe prop that isn't being used.
+- ResizeGroup: Reduce render time when reducing the width of the container.
 
 ## 4.1.0
 Tue, 30 May 2017 20:23:45 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 0ba13ebcd60f9..dabe32792057d 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.1.0",
+  "version": "4.1.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "^2.2.2",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "2.0.1",
+    "@uifabric/example-app-base": "2.0.2",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.0.0 <5.0.0",
-    "@uifabric/styling": ">=0.4.0 <1.0.0",
+    "@uifabric/styling": ">=0.4.1 <1.0.0",
     "prop-types": "^15.5.10"
   },
   "peerDependencies": {
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 0f97bd0ed3b88..2c3dc9f0fd25d 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.4.1",
+      "tag": "@uifabric/styling_v0.4.1",
+      "date": "Wed, 31 May 2017 01:58:23 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "ee2ea2da473875f48afc28b4270bc658eaa49f92",
+            "comment": "Icon classes: adjusting how they are registered so that we merge raw styles together to form the icon classes."
+          }
+        ]
+      }
+    },
     {
       "version": "0.4.0",
       "tag": "@uifabric/styling_v0.4.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 6196a9be967d0..ecefdc2bf886a 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Tue, 30 May 2017 20:23:45 GMT and should not be manually modified.
+This log was last generated on Wed, 31 May 2017 01:58:23 GMT and should not be manually modified.
+
+## 0.4.1
+Wed, 31 May 2017 01:58:23 GMT
+
+### Patches
+
+- Icon classes: adjusting how they are registered so that we merge raw styles together to form the icon classes.
 
 ## 0.4.0
 Tue, 30 May 2017 20:23:45 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 203c246de27d2..79cde78598bdf 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.4.0",
+  "version": "0.4.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From b61038339aa141659bba37a86b3127c2a389b92a Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 31 May 2017 00:23:52 -0700
Subject: [PATCH 0043/1641] DetailsList: last column measured correctly when
 checkboxes are hidden (#1887)

* Fixing the column measuring when checkbox is hidden.

* Adding change file.
---
 .../fix-dl-column_2017-05-31-06-44.json       | 11 ++++++++++
 .../components/DetailsList/DetailsList.tsx    | 22 +++++++++++--------
 2 files changed, 24 insertions(+), 9 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-dl-column_2017-05-31-06-44.json

diff --git a/common/changes/office-ui-fabric-react/fix-dl-column_2017-05-31-06-44.json b/common/changes/office-ui-fabric-react/fix-dl-column_2017-05-31-06-44.json
new file mode 100644
index 0000000000000..f204c5aa9b721
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-dl-column_2017-05-31-06-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: Last column measured correctly when `checkboxVisibility` set to `hidden`.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@hotmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index e7ca609f418a1..5cb78b2feaf57 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -1,36 +1,39 @@
 import * as React from 'react';
+import * as stylesImport from './DetailsList.scss';
+
 import {
   BaseComponent,
   KeyCodes,
   assign,
   autobind,
   css,
-  getRTLSafeKeyCode
+  getRTLSafeKeyCode,
 } from '../../Utilities';
 import {
-  IDetailsListProps,
+  CheckboxVisibility,
   ColumnActionsMode,
   ConstrainMode,
   DetailsListLayoutMode,
   IColumn,
   IDetailsList,
-  CheckboxVisibility
+  IDetailsListProps,
 } from '../DetailsList/DetailsList.Props';
 import { DetailsHeader, SelectAllVisibility } from '../DetailsList/DetailsHeader';
 import { DetailsRow, IDetailsRowProps } from '../DetailsList/DetailsRow';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
-import { GroupedList } from '../../GroupedList';
-import { List } from '../../List';
-import { withViewport } from '../../utilities/decorators/withViewport';
 import {
   IObjectWithKey,
   ISelection,
   Selection,
   SelectionMode,
-  SelectionZone
+  SelectionZone,
 } from '../../utilities/selection/index';
+
 import { DragDropHelper } from '../../utilities/dragdrop/DragDropHelper';
-import * as stylesImport from './DetailsList.scss';
+import { GroupedList } from '../../GroupedList';
+import { List } from '../../List';
+import { withViewport } from '../../utilities/decorators/withViewport';
+
 const styles: any = stylesImport;
 
 export interface IDetailsListState {
@@ -548,10 +551,11 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   private _getJustifiedColumns(newColumns: IColumn[], viewportWidth: number, props: IDetailsListProps) {
     let {
       selectionMode,
+      checkboxVisibility,
       groups
     } = props;
     let outerPadding = DEFAULT_INNER_PADDING;
-    let rowCheckWidth = (selectionMode !== SelectionMode.none) ? CHECKBOX_WIDTH : 0;
+    let rowCheckWidth = (selectionMode !== SelectionMode.none && checkboxVisibility !== CheckboxVisibility.hidden) ? CHECKBOX_WIDTH : 0;
     let groupExpandWidth = groups ? GROUP_EXPAND_WIDTH : 0;
     let totalWidth = 0; // offset because we have one less inner padding.
     let availableWidth = viewportWidth - (outerPadding + rowCheckWidth + groupExpandWidth);

From c6b411ecbac8c9c678c551565021a37978a82356 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Wed, 31 May 2017 13:15:38 -0700
Subject: [PATCH 0044/1641] ResizeGroup: Make sure initial render always
 renders some content (#1894)

* Add a test that captures the bug.

* Clean up bug fix, add more tests

* Rush change
---
 ...group-initial-render_2017-05-31-19-59.json | 11 ++++
 .../ResizeGroup/ResizeGroup.test.tsx          | 53 +++++++++++++++++--
 .../components/ResizeGroup/ResizeGroup.tsx    | 22 ++++----
 3 files changed, 71 insertions(+), 15 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/resize-group-initial-render_2017-05-31-19-59.json

diff --git a/common/changes/office-ui-fabric-react/resize-group-initial-render_2017-05-31-19-59.json b/common/changes/office-ui-fabric-react/resize-group-initial-render_2017-05-31-19-59.json
new file mode 100644
index 0000000000000..a6b2c4ea88d34
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/resize-group-initial-render_2017-05-31-19-59.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ResizeGroup: Make sure that it renders contents when there are no more scaling steps and it doesn't fit",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chrisgo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
index c977dc6e7563a..57b805e6e53be 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
@@ -6,6 +6,7 @@ import { ResizeGroup, IResizeGroupState } from './ResizeGroup';
 import * as sinon from 'sinon';
 import * as stylesImport from './ResizeGroup.scss';
 import { injectWrapperMethod, setRenderSpy } from '@uifabric/utilities/lib/test/';
+import { IResizeGroupProps } from './ResizeGroup.Props';
 const styles: any = stylesImport;
 
 interface ITestScalingData {
@@ -23,7 +24,7 @@ function getWrapperWithMocks(data: ITestScalingData = { scalingIndex: 5 },
   const onReduceDataSpy = sinon.spy(onReduceData);
   const onRenderDataSpy = sinon.spy();
 
-  let wrapper = mount<ResizeGroup, IResizeGroupState>(<ResizeGroup
+  let wrapper = mount<IResizeGroupProps, IResizeGroupState>(<ResizeGroup
     data={ data }
     onReduceData={ onReduceDataSpy }
     onRenderData={ onRenderDataSpy }
@@ -37,7 +38,7 @@ function getWrapperWithMocks(data: ITestScalingData = { scalingIndex: 5 },
   };
 }
 
-function getMeasurementMocks(wrapper: ReactWrapper<ResizeGroup, IResizeGroupState>) {
+function getMeasurementMocks(wrapper: ReactWrapper<IResizeGroupProps, IResizeGroupState>) {
   let rootGetClientRectMock = sinon.stub();
   let measuredGetClientRectMock = sinon.stub();
   rootGetClientRectMock.returns({ width: 0 });
@@ -65,7 +66,7 @@ describe('ResizeGroup', () => {
   it('does not render ResizeGroup when no data is passed', () => {
     const onReduceData = sinon.spy();
     const onRenderData = sinon.spy();
-    const wrapper = shallow(
+    const wrapper = shallow<IResizeGroupProps, IResizeGroupState>(
       <ResizeGroup
         onReduceData={ onReduceData }
         onRenderData={ onRenderData }
@@ -78,7 +79,7 @@ describe('ResizeGroup', () => {
   it('does not render ResizeGroup when empty data is passed', () => {
     const onReduceData = sinon.spy();
     const onRenderData = sinon.spy();
-    const wrapper = shallow(
+    const wrapper = shallow<IResizeGroupProps, IResizeGroupState>(
       <ResizeGroup
         data={ {} }
         onReduceData={ onReduceData }
@@ -89,6 +90,27 @@ describe('ResizeGroup', () => {
     expect(onRenderData.called).to.equal(false);
   });
 
+  it('renders the result of onRenderData', () => {
+    const initialData = { content: 5 };
+    const renderedDataId = 'onRenderDataId';
+    const onRenderData = (data) => <div id={ renderedDataId }> Rendered data: { data.content }</div >;
+
+    const wrapper = shallow<IResizeGroupProps, IResizeGroupState>(
+      <ResizeGroup
+        data={ initialData }
+        onReduceData={ onReduceScalingData }
+        onRenderData={ onRenderData }
+      />
+    );
+
+    expect(wrapper.containsMatchingElement(onRenderData(initialData))).to.be.true;
+
+    // Updating the renderedData state should also render new data
+    const nextData = { content: 5 };
+    wrapper.setState({ renderedData: nextData });
+    expect(wrapper.containsMatchingElement(onRenderData(nextData)));
+  });
+
   it('remeasures if props are updated', () => {
     const onReduceData = sinon.spy();
     const onRenderData = sinon.spy();
@@ -320,7 +342,7 @@ describe('ResizeGroup', () => {
     onReduceDataStub.returns({});
     const onRenderDataMock = sinon.spy();
 
-    let wrapper = mount<ResizeGroup, IResizeGroupState>(<ResizeGroup
+    let wrapper = mount<IResizeGroupProps, IResizeGroupState>(<ResizeGroup
       data={ mockData }
       onReduceData={ onReduceDataStub }
       onRenderData={ onRenderDataMock }
@@ -351,4 +373,25 @@ describe('ResizeGroup', () => {
     expect(onReduceDataStub.callCount).to.equal(2);
     expect(wrapper.state().shouldMeasure).to.equal(false);
   });
+
+  it('initially renders content even if it does not fit', () => {
+    let data = { scalingIndex: 5 };
+
+    // Simulate an onReduce data that has no more scaling operations
+    let onReduceData = (_) => undefined;
+
+    let { rootGetClientRectMock, measuredGetClientRectMock, wrapper } = getWrapperWithMocks(data, onReduceData);
+
+    // Make sure the content never fits
+    rootGetClientRectMock.returns({ width: 27 });
+    measuredGetClientRectMock.returns({ width: 52 });
+
+    // Reset the internal rendered state of the component
+    wrapper.setState({
+      shouldMeasure: true,
+      renderedData: null
+    });
+
+    expect(wrapper.state().renderedData).to.deep.equal(data);
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index 5813921fd6778..47c370d58dfe8 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -121,6 +121,16 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
     }
   }
 
+  private _setStateToDoneMeasuring() {
+    this.setState((prevState, props) => {
+      return {
+        renderedData: prevState.measuredData,
+        measuredData: { ...this.props.data },
+        shouldMeasure: false
+      };
+    });
+  }
+
   private _measureItems() {
     const { data, onReduceData } = this.props;
     const { shouldMeasure } = this.state;
@@ -139,19 +149,11 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
             measuredData: nextMeasuredData,
           });
         } else {
-          this.setState({
-            shouldMeasure: false
-          });
+          this._setStateToDoneMeasuring();
         }
 
       } else {
-        this.setState((prevState, props) => {
-          return {
-            renderedData: prevState.measuredData,
-            measuredData: { ...this.props.data },
-            shouldMeasure: false
-          };
-        });
+        this._setStateToDoneMeasuring();
       }
     }
   }

From 90ef0576bb0f68a3a157176937b9ad5cc1797730 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Wed, 31 May 2017 14:50:31 -0700
Subject: [PATCH 0045/1641] Overhaul DetailsList accessibility to support
 improved keyboarding flows and screen reader semantics (#1736)

* Factor out Focus mixin to detect focus state but not add border

* Allow position to be changed for FocusBorder mixin

* Update change output

* Allow FocusZone to be itself focusable, and fix perforfance issues with lots of nested zones

* Add support for FocusZone "sub-zones" to reduce FocusZone usage in DetailsList

* Cleanup unit tests for FocusZone

* Add unit tests for new FocusZone behaviors

* Update Utilities API declarations

* Add ability to turn off aria-describedby in ToolTipHost

* Add 'presentation' role to List structural elements

* Fix typing for onColumnContextMenu event callback

* Update keyboarding flow for DetailsList to work with screen readers

* Add ARIA labels to DetailsList examples
---
 .../accessibility_2017-05-05-20-51.json       |  15 +
 .../src/common/_focusBorder.scss              |  28 +-
 .../components/DetailsList/DetailsHeader.scss | 100 +-
 .../components/DetailsList/DetailsHeader.tsx  | 952 ++++++++++--------
 .../DetailsList/DetailsList.Props.ts          | 725 ++++++-------
 .../components/DetailsList/DetailsList.tsx    |  24 +-
 .../components/DetailsList/DetailsRow.scss    |  39 +-
 .../src/components/DetailsList/DetailsRow.tsx |  97 +-
 .../DetailsList/DetailsRowCheck.scss          |  37 +
 .../DetailsList/DetailsRowCheck.tsx           |  28 +-
 .../DetailsList/DetailsRowFields.tsx          |  14 +-
 .../examples/DetailsList.Advanced.Example.tsx |  39 +-
 .../examples/DetailsList.Basic.Example.tsx    |  13 +-
 .../examples/DetailsList.Grouped.Example.tsx  |   2 +
 .../components/FocusZone/FocusZone.test.tsx   | 597 +++++++----
 .../src/components/FocusZone/FocusZone.tsx    |  87 +-
 .../src/components/List/List.tsx              |   8 +-
 .../components/Tooltip/TooltipHost.Props.ts   |   6 +
 .../src/components/Tooltip/TooltipHost.tsx    |  30 +-
 .../src/utilities/selection/SelectionZone.tsx |   1 +
 packages/utilities/api/utilities.api.ts       |   3 +
 packages/utilities/src/focus.ts               |  13 +-
 22 files changed, 1710 insertions(+), 1148 deletions(-)
 create mode 100644 common/changes/accessibility_2017-05-05-20-51.json
 create mode 100644 packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss

diff --git a/common/changes/accessibility_2017-05-05-20-51.json b/common/changes/accessibility_2017-05-05-20-51.json
new file mode 100644
index 0000000000000..64b7f2cd9bae4
--- /dev/null
+++ b/common/changes/accessibility_2017-05-05-20-51.json
@@ -0,0 +1,15 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Update DetailsList to support screen readers with cleaner keyboarding flow",
+      "type": "minor"
+    },
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Update Focus handling to suport immediately-nested focus zones",
+      "type": "patch"
+    }
+  ],
+  "email": "tmichon@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/common/_focusBorder.scss b/packages/office-ui-fabric-react/src/common/_focusBorder.scss
index 1defeda670f44..f44de847ea45a 100644
--- a/packages/office-ui-fabric-react/src/common/_focusBorder.scss
+++ b/packages/office-ui-fabric-react/src/common/_focusBorder.scss
@@ -1,6 +1,6 @@
 @import './semanticColorVariables';
 
-@mixin focus-border($padding: 0, $color: $focusedBorderColor, $thickness: 1px, $onFocus: true) {
+@mixin focus-clear() {
   &::-moz-focus-inner {
     // Clear the focus border in Firefox. Reference: http://stackoverflow.com/a/199319/1436671
     border: 0;
@@ -9,18 +9,30 @@
   & {
     // Clear browser specific focus styles and use transparent as placeholder for focus style
     outline: transparent;
-
-    // It is MUST because the pseudo-element is absolute position.
-    position: relative;
   }
+}
 
+@mixin focus($onFocus: true) {
   @if $onFocus {
-    :global(.ms-Fabric.is-focusVisible) &:focus:after {
-      @include after-outline($padding, $color, $thickness);
+    :global(.ms-Fabric.is-focusVisible) &:focus {
+      @content;
     }
   }
   @else {
-    &::after {
+    @content;
+  }
+}
+
+@mixin focus-border($padding: 0, $color: $focusedBorderColor, $thickness: 1px, $onFocus: true, $position: relative) {
+  @include focus-clear();
+
+  & {
+    // It is MUST because the pseudo-element is absolute position.
+    position: $position;
+  }
+
+  @include focus($onFocus) {
+    &:after {
       @include after-outline($padding, $color, $thickness);
     }
   }
@@ -48,4 +60,4 @@
   :global(.ms-Fabric.is-focusVisible) &:focus {
     outline: 1px solid $focusedBorderColor;
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
index 432a354a9ab1b..45c5aac89ef67 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
@@ -25,21 +25,6 @@ $resizerColor: $ms-color-neutralTertiaryAlt;
   }
 }
 
-.cell.cellIsCheck :global(.ms-Check-circle) {
-  opacity: 0;
-}
-
-.cell.cellIsCheck:hover :global(.ms-Check-circle),
-.cell.cellIsCheck:focus :global(.ms-Check-circle),
-.root.rootIsAllSelected :global(.ms-Check-circle) {
-  opacity: 1;
-}
-
-.cellWrapper {
-  display: inline-block;
-  position: relative;
-}
-
 .cell {
   @include ms-font-s;
   background: transparent;
@@ -56,14 +41,13 @@ $resizerColor: $ms-color-neutralTertiaryAlt;
   @include text-align(left);
   height: $rowHeight;
   vertical-align: top;
-  overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
   @include text-align(left);
 
   &.cellIsCheck {
     position: relative;
-    padding: 6px;
+    padding: 0;
     margin: 0;
   }
 
@@ -80,38 +64,47 @@ $resizerColor: $ms-color-neutralTertiaryAlt;
     }
   }
 
-  &.cellIsSizer {
-    position: absolute;
-    width: 16px;
-
-    @include margin-left(-10px);
-    cursor: ew-resize;
-    bottom: 0;
-    top: 0;
-    height: inherit;
-    background: transparent;
-  }
-
   &.cellIsEmpty {
     text-overflow: clip;
   }
 }
 
-.cell.cellIsSizer:after {
-  content: '';
-  position: absolute;
-  left: 50%;
-  top: 0;
+.cellSizer {
+  @include focus-clear();
+
+  display: inline-block;
+  position: relative;
+  cursor: ew-resize;
   bottom: 0;
-  width: 1px;
-  background: $resizerColor;
-  opacity: 0;
-}
+  top: 0;
+  margin: 0 -8px;
+  overflow: hidden;
+  height: inherit;
+  background: transparent;
+  z-index: 1;
+  width: 16px;
 
-.cell.cellIsSizer:hover:after,
-.cell.cellIsSizer.cellIsResizing:after {
-  opacity: 1;
-  transition: opacity .3s linear;
+  &:after {
+    content: '';
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    width: 1px;
+    background: $resizerColor;
+    opacity: 0;
+    left: 50%;
+  }
+
+  &:focus:after,
+  &:hover:after,
+  &.cellIsResizing:after {
+    opacity: 1;
+    transition: opacity .3s linear;
+  }
+
+  &.cellIsResizing:after {
+    @include ms-drop-shadow();
+  }
 }
 
 .collapseButton {
@@ -139,6 +132,29 @@ $resizerColor: $ms-color-neutralTertiaryAlt;
   vertical-align: middle;
 }
 
+.cellTitle {
+  display: block;
+  overflow: hidden;
+  @include focus-border($position: absolute);
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
+  padding: 0 8px;
+}
+
+:global(.ms-TooltipHost).checkTooltip {
+  display: block;
+}
+
+.cellTooltip {
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
+}
+
 .sizingOverlay {
   position: absolute;
   left: 0;
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index d1774e2e51d9d..c708096d2296f 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -1,406 +1,546 @@
-import * as React from 'react';
-import {
-  BaseComponent,
-  autobind,
-  css,
-  getRTL
-} from '../../Utilities';
-import { IColumn, DetailsListLayoutMode, ColumnActionsMode } from './DetailsList.Props';
-import { FocusZone, FocusZoneDirection } from '../../FocusZone';
-import { Check } from '../../Check';
-import { Icon } from '../../Icon';
-import { Layer } from '../../Layer';
-import { GroupSpacer } from '../GroupedList/GroupSpacer';
-import { ISelection, SelectionMode, SELECTION_CHANGE } from '../../utilities/selection/interfaces';
-import * as stylesImport from './DetailsHeader.scss';
-const styles: any = stylesImport;
-
-const MOUSEDOWN_PRIMARY_BUTTON = 0; // for mouse down event we are using ev.button property, 0 means left button
-const MOUSEMOVE_PRIMARY_BUTTON = 1; // for mouse move event we are using ev.buttons property, 1 means left button
-const INNER_PADDING = 16;
-
-export interface IDetailsHeaderProps extends React.Props<DetailsHeader> {
-  columns: IColumn[];
-  selection: ISelection;
-  selectionMode: SelectionMode;
-  layoutMode: DetailsListLayoutMode;
-  onColumnIsSizingChanged?: (column: IColumn, isSizing: boolean) => void;
-  onColumnResized?: (column: IColumn, newWidth: number) => void;
-  onColumnAutoResized?: (column: IColumn, columnIndex: number) => void;
-  onColumnClick?: (ev: React.MouseEvent<HTMLElement>, column: IColumn) => void;
-  onColumnContextMenu?: (column: IColumn, ev: Event) => void;
-  groupNestingDepth?: number;
-  isAllCollapsed?: boolean;
-  onToggleCollapseAll?: (isAllCollapsed: boolean) => void;
-  /** ariaLabel for the entire header */
-  ariaLabel?: string;
-  /** ariaLabel for the header checkbox that selects or deselects everything */
-  ariaLabelForSelectAllCheckbox?: string;
-  selectAllVisibility?: SelectAllVisibility;
-}
-
-export enum SelectAllVisibility {
-  none = 0,
-  hidden = 1,
-  visible = 2
-}
-
-export interface IDetailsHeaderState {
-  columnResizeDetails?: IColumnResizeDetails;
-  isAllSelected?: boolean;
-  isSizing?: boolean;
-  groupNestingDepth?: number;
-  isAllCollapsed?: boolean;
-}
-
-export interface IColumnResizeDetails {
-  columnIndex: number;
-  originX: number;
-  columnMinWidth: number;
-}
-
-export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHeaderState> {
-  public static defaultProps = {
-    isSelectAllVisible: SelectAllVisibility.visible
-  };
-
-  public refs: {
-    [key: string]: React.ReactInstance;
-    root: HTMLElement;
-    focusZone: FocusZone;
-  };
-
-  constructor(props: IDetailsHeaderProps) {
-    super(props);
-
-    this.state = {
-      columnResizeDetails: null,
-      groupNestingDepth: this.props.groupNestingDepth,
-      isAllCollapsed: this.props.isAllCollapsed
-    };
-
-    this._onToggleCollapseAll = this._onToggleCollapseAll.bind(this);
-    this._onSelectAllClicked = this._onSelectAllClicked.bind(this);
-  }
-
-  public componentDidMount() {
-    let { selection } = this.props;
-
-    this._events.on(selection, SELECTION_CHANGE, this._onSelectionChanged);
-
-    // We need to use native on this to avoid MarqueeSelection from handling the event before us.
-    this._events.on(this.refs.root, 'mousedown', this._onRootMouseDown);
-  }
-
-  public componentWillReceiveProps(newProps) {
-    let { groupNestingDepth } = this.state;
-
-    if (newProps.groupNestingDepth !== groupNestingDepth) {
-      this.setState({ groupNestingDepth: newProps.groupNestingDepth });
-    }
-  }
-
-  public render() {
-    let { columns, ariaLabel, ariaLabelForSelectAllCheckbox, selectAllVisibility } = this.props;
-    let { isAllSelected, columnResizeDetails, isSizing, groupNestingDepth, isAllCollapsed } = this.state;
-
-    return (
-      <div
-        role='row'
-        aria-label={ ariaLabel }
-        className={ css('ms-DetailsHeader', styles.root, {
-          ['is-allSelected ' + styles.rootIsAllSelected]: isAllSelected,
-          ['is-selectAllHidden ' + styles.rootIsSelectAllHidden]: selectAllVisibility === SelectAllVisibility.hidden,
-          'is-resizingColumn': !!columnResizeDetails && isSizing,
-        }) }
-        ref='root'
-        onMouseMove={ this._onRootMouseMove }
-        data-automationid='DetailsHeader'>
-        <FocusZone ref='focusZone' direction={ FocusZoneDirection.horizontal }>
-          { (selectAllVisibility !== SelectAllVisibility.none) ? (
-            <div className={ css('ms-DetailsHeader-cellWrapper', styles.cellWrapper) } role='columnheader'>
-              <button
-                type='button'
-                className={ css('ms-DetailsHeader-cell is-check', styles.cell, styles.cellIsCheck) }
-                onClick={ this._onSelectAllClicked }
-                aria-label={ ariaLabelForSelectAllCheckbox }
-                aria-pressed={ isAllSelected }
-              >
-                <Check checked={ isAllSelected } />
-              </button>
-            </div>
-          ) : null }
-          { groupNestingDepth > 0 ? (
-            <button
-              type='button'
-              className={ css('ms-DetailsHeader-cell', styles.cell) }
-              onClick={ this._onToggleCollapseAll }>
-              <Icon
-                className={ css(
-                  'ms-DetailsHeader-collapseButton',
-                  styles.collapseButton,
-                  isAllCollapsed && ('is-collapsed ' + styles.collapseButtonIsCollapsed)
-                ) }
-                iconName='ChevronDown'
-              />
-            </button>
-          ) : (null) }
-          { GroupSpacer({ count: groupNestingDepth - 1 }) }
-          { columns.map((column, columnIndex) => (
-            <div
-              key={ column.key }
-              className={ css('ms-DetailsHeader-cellWrapper', styles.cellWrapper) }
-              role='columnheader'
-              aria-sort={ column.isSorted ? (column.isSortedDescending ? 'descending' : 'ascending') : 'none' }
-            >
-              <button
-                type='button'
-                key={ column.fieldName }
-                disabled={ column.columnActionsMode === ColumnActionsMode.disabled }
-                className={ css(
-                  'ms-DetailsHeader-cell',
-                  styles.cell,
-                  column.headerClassName, {
-                    ['is-actionable ' + styles.cellIsActionable]: column.columnActionsMode !== ColumnActionsMode.disabled,
-                    ['is-empty ' + styles.cellIsEmpty]: !column.name,
-                    'is-icon-visible': column.isSorted || column.isGrouped || column.isFiltered
-                  }) }
-                style={ { width: column.calculatedWidth + INNER_PADDING } }
-                onClick={ this._onColumnClick.bind(this, column) }
-                onContextMenu={ this._onColumnContextMenu.bind(this, column) }
-                aria-haspopup={ column.columnActionsMode === ColumnActionsMode.hasDropdown }
-                aria-label={ column.ariaLabel || column.name }
-                data-automationid='ColumnsHeaderColumn'
-                data-item-key={ column.key }
-              >
-
-                { column.isFiltered && (
-                  <Icon className={ styles.nearIcon } iconName='Filter' />
-                ) }
-
-                { column.isSorted && (
-                  <Icon className={ styles.nearIcon } iconName={ column.isSortedDescending ? 'SortDown' : 'SortUp' } />
-                ) }
-
-                { column.isGrouped && (
-                  <Icon className={ styles.nearIcon } iconName='GroupedDescending' />
-                ) }
-
-                { column.iconClassName && (
-                  <Icon className={ css(styles.nearIcon, column.iconClassName) } iconName={ column.iconName } />
-                ) }
-
-                { column.name }
-
-                { column.columnActionsMode === ColumnActionsMode.hasDropdown && (
-                  <Icon
-                    className={ css('ms-DetailsHeader-filterChevron', styles.filterChevron) }
-                    iconName='ChevronDown'
-                  />
-                ) }
-              </button>
-              { (column.isResizable) && (
-                <div
-                  data-sizer-index={ columnIndex }
-                  className={ css(
-                    'ms-DetailsHeader-cell is-sizer',
-                    styles.cell,
-                    styles.cellIsSizer,
-                    {
-                      ['is-resizing ' + styles.cellIsResizing]: isSizing && columnResizeDetails.columnIndex === columnIndex
-                    }) }
-                  onDoubleClick={ this._onSizerDoubleClick.bind(this, columnIndex) }
-                />
-              ) }
-            </div>
-          )) }
-        </FocusZone>
-        { isSizing && (
-          <Layer>
-            <div
-              className={ css(isSizing && styles.sizingOverlay) }
-              onMouseMove={ this._onSizerMouseMove }
-              onMouseUp={ this._onSizerMouseUp }
-            />
-          </Layer>
-        ) }
-      </div>
-    );
-  }
-
-  /** Set focus to the active thing in the focus area. */
-  public focus(): boolean {
-    return this.refs.focusZone.focus();
-  }
-
-  /**
-   * double click on the column sizer will auto ajust column width
-   * to fit the longest content among current rendered rows.
-   *
-   * @private
-   * @param {number} columnIndex (index of the column user double clicked)
-   * @param {React.MouseEvent} ev (mouse double click event)
-   */
-  private _onSizerDoubleClick(columnIndex: number, ev: React.MouseEvent<HTMLElement>) {
-    let { onColumnAutoResized, columns } = this.props;
-    if (onColumnAutoResized) {
-      onColumnAutoResized(columns[columnIndex], columnIndex);
-    }
-  }
-
-  /**
-   * Called when the select all toggle is clicked.
-   */
-
-  @autobind
-  private _onSelectAllClicked() {
-    let { selection } = this.props;
-
-    selection.toggleAllSelected();
-  }
-
-  @autobind
-  private _onRootMouseDown(ev: MouseEvent) {
-    let columnIndexAttr = (ev.target as HTMLElement).getAttribute('data-sizer-index');
-    let columnIndex = Number(columnIndexAttr);
-    let { columns } = this.props;
-
-    if (columnIndexAttr === null || ev.button !== MOUSEDOWN_PRIMARY_BUTTON) {
-      // Ignore anything except the primary button.
-      return;
-    }
-
-    this.setState({
-      columnResizeDetails: {
-        columnIndex: columnIndex,
-        columnMinWidth: columns[columnIndex].calculatedWidth,
-        originX: ev.clientX
-      }
-    });
-
-    ev.preventDefault();
-    ev.stopPropagation();
-  }
-
-  @autobind
-  private _onRootMouseMove(ev: React.MouseEvent<HTMLElement>) {
-    let { columnResizeDetails, isSizing } = this.state;
-
-    if (columnResizeDetails && !isSizing && ev.clientX !== columnResizeDetails.originX) {
-      this.setState({ isSizing: true });
-    }
-  }
-
-  /**
-   * mouse move event handler in the header
-   * it will set isSizing state to true when user clicked on the sizer and move the mouse.
-   *
-   * @private
-   * @param {React.MouseEvent} ev (mouse move event)
-   */
-  @autobind
-  private _onSizerMouseMove(ev: React.MouseEvent<HTMLElement>) {
-    let {
-      // use buttons property here since ev.button in some edge case is not upding well during the move.
-      // but firefox doesn't support it, so we set the default value when it is not defined.
-      buttons
-    } = ev;
-    let { onColumnIsSizingChanged, onColumnResized, columns } = this.props;
-    let { columnResizeDetails } = this.state;
-
-    if (buttons !== undefined && buttons !== MOUSEMOVE_PRIMARY_BUTTON) {
-      // cancel mouse down event and return early when the primary button is not pressed
-      this._onSizerMouseUp(ev);
-      return;
-    }
-
-    if (ev.clientX !== columnResizeDetails.originX) {
-      if (onColumnIsSizingChanged) {
-        onColumnIsSizingChanged(columns[columnResizeDetails.columnIndex], true);
-      }
-    }
-
-    if (onColumnResized) {
-      let movement = ev.clientX - columnResizeDetails.originX;
-
-      if (getRTL()) {
-        movement = -movement;
-      }
-
-      onColumnResized(
-        columns[columnResizeDetails.columnIndex],
-        columnResizeDetails.columnMinWidth + movement
-      );
-    }
-
-  }
-
-  /**
-   * mouse up event handler in the header
-   * clear the resize related state.
-   * This is to ensure we can catch double click event
-   *
-   * @private
-   * @param {React.MouseEvent} ev (mouse up event)
-   */
-  @autobind
-  private _onSizerMouseUp(ev: React.MouseEvent<HTMLElement>) {
-    let { columns, onColumnIsSizingChanged } = this.props;
-    let { columnResizeDetails } = this.state;
-
-    this.setState({
-      columnResizeDetails: null,
-      isSizing: false
-    });
-
-    if (onColumnIsSizingChanged) {
-      onColumnIsSizingChanged(columns[columnResizeDetails.columnIndex], false);
-    }
-  }
-
-  private _onSelectionChanged() {
-    let isAllSelected = this.props.selection.isAllSelected();
-
-    if (this.state.isAllSelected !== isAllSelected) {
-      this.setState({
-        isAllSelected: isAllSelected
-      });
-    }
-  }
-
-  private _onColumnClick(column, ev) {
-    let { onColumnClick } = this.props;
-
-    if (column.onColumnClick) {
-      column.onColumnClick(ev, column);
-    }
-
-    if (onColumnClick) {
-      onColumnClick(ev, column);
-    }
-  }
-
-  private _onColumnContextMenu(column, ev) {
-    let { onColumnContextMenu } = this.props;
-
-    if (column.onContextMenu) {
-      column.onColumnContextMenu(column, ev);
-    }
-
-    if (onColumnContextMenu) {
-      onColumnContextMenu(column, ev);
-    }
-  }
-
-  private _onToggleCollapseAll() {
-    let { onToggleCollapseAll } = this.props;
-    let newCollapsed = !this.state.isAllCollapsed;
-    this.setState({
-      isAllCollapsed: newCollapsed
-    });
-    if (onToggleCollapseAll) {
-      onToggleCollapseAll(newCollapsed);
-    }
-  }
-
-}
+import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+import {
+  BaseComponent,
+  autobind,
+  css,
+  getRTL,
+  getId,
+  KeyCodes
+} from '../../Utilities';
+import { IColumn, DetailsListLayoutMode, ColumnActionsMode } from './DetailsList.Props';
+import { FocusZone, FocusZoneDirection } from '../../FocusZone';
+import { Icon } from '../../Icon';
+import { Layer } from '../../Layer';
+import { GroupSpacer } from '../GroupedList/GroupSpacer';
+import { DetailsRowCheck } from './DetailsRowCheck';
+import { TooltipHost } from '../../Tooltip';
+import * as checkStyles from './DetailsRowCheck.scss';
+import { ISelection, SelectionMode, SELECTION_CHANGE } from '../../utilities/selection/interfaces';
+import * as stylesImport from './DetailsHeader.scss';
+const styles: any = stylesImport;
+
+const MOUSEDOWN_PRIMARY_BUTTON = 0; // for mouse down event we are using ev.button property, 0 means left button
+const MOUSEMOVE_PRIMARY_BUTTON = 1; // for mouse move event we are using ev.buttons property, 1 means left button
+const INNER_PADDING = 16;
+
+export interface IDetailsHeaderProps extends React.Props<DetailsHeader> {
+  columns: IColumn[];
+  selection: ISelection;
+  selectionMode: SelectionMode;
+  layoutMode: DetailsListLayoutMode;
+  onColumnIsSizingChanged?: (column: IColumn, isSizing: boolean) => void;
+  onColumnResized?: (column: IColumn, newWidth: number) => void;
+  onColumnAutoResized?: (column: IColumn, columnIndex: number) => void;
+  onColumnClick?: (ev: React.MouseEvent<HTMLElement>, column: IColumn) => void;
+  onColumnContextMenu?: (column: IColumn, ev: React.MouseEvent<HTMLElement>) => void;
+  groupNestingDepth?: number;
+  isAllCollapsed?: boolean;
+  onToggleCollapseAll?: (isAllCollapsed: boolean) => void;
+  /** ariaLabel for the entire header */
+  ariaLabel?: string;
+  /** ariaLabel for the header checkbox that selects or deselects everything */
+  ariaLabelForSelectAllCheckbox?: string;
+  ariaLabelForSelectionColumn?: string;
+  selectAllVisibility?: SelectAllVisibility;
+}
+
+export enum SelectAllVisibility {
+  none = 0,
+  hidden = 1,
+  visible = 2
+}
+
+export interface IDetailsHeaderState {
+  columnResizeDetails?: IColumnResizeDetails;
+  isAllSelected?: boolean;
+  isSizing?: boolean;
+  groupNestingDepth?: number;
+  isAllCollapsed?: boolean;
+}
+
+export interface IColumnResizeDetails {
+  columnIndex: number;
+  originX?: number;
+  columnMinWidth: number;
+}
+
+export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHeaderState> {
+  public static defaultProps = {
+    isSelectAllVisible: SelectAllVisibility.visible
+  };
+
+  public refs: {
+    [key: string]: React.ReactInstance;
+    root: FocusZone;
+  };
+
+  private _id: string;
+
+  constructor(props: IDetailsHeaderProps) {
+    super(props);
+
+    this.state = {
+      columnResizeDetails: null,
+      groupNestingDepth: this.props.groupNestingDepth,
+      isAllCollapsed: this.props.isAllCollapsed
+    };
+
+    this._onToggleCollapseAll = this._onToggleCollapseAll.bind(this);
+    this._onSelectAllClicked = this._onSelectAllClicked.bind(this);
+    this._id = getId('header');
+  }
+
+  public componentDidMount() {
+    let { selection } = this.props;
+
+    this._events.on(selection, SELECTION_CHANGE, this._onSelectionChanged);
+
+    const rootElement = ReactDOM.findDOMNode(this.refs.root);
+
+    // We need to use native on this to avoid MarqueeSelection from handling the event before us.
+    this._events.on(rootElement, 'mousedown', this._onRootMouseDown);
+
+    this._events.on(rootElement, 'keydown', this._onRootKeyDown);
+  }
+
+  public componentWillReceiveProps(newProps) {
+    let { groupNestingDepth } = this.state;
+
+    if (newProps.groupNestingDepth !== groupNestingDepth) {
+      this.setState({ groupNestingDepth: newProps.groupNestingDepth });
+    }
+  }
+
+  public render() {
+    let { columns, ariaLabel, ariaLabelForSelectAllCheckbox, selectAllVisibility, ariaLabelForSelectionColumn } = this.props;
+    let { isAllSelected, columnResizeDetails, isSizing, groupNestingDepth, isAllCollapsed } = this.state;
+
+    const showCheckbox = selectAllVisibility !== SelectAllVisibility.none;
+
+    return (
+      <FocusZone
+        role='row'
+        aria-label={ ariaLabel }
+        className={ css('ms-DetailsHeader', styles.root, {
+          ['is-allSelected ' + styles.rootIsAllSelected]: isAllSelected,
+          ['is-selectAllHidden ' + styles.rootIsSelectAllHidden]: selectAllVisibility === SelectAllVisibility.hidden,
+          'is-resizingColumn': !!columnResizeDetails && isSizing,
+        }) }
+        ref='root'
+        onMouseMove={ this._onRootMouseMove }
+        data-automationid='DetailsHeader'
+        direction={ FocusZoneDirection.horizontal }
+      >
+        { showCheckbox ? (
+          <div
+            className={ css('ms-DetailsHeader-cell', 'ms-DetailsHeader-cellIsCheck', styles.cell, styles.cellIsCheck, checkStyles.owner, {
+              [checkStyles.isSelected]: isAllSelected
+            }) }
+            onClick={ this._onSelectAllClicked }
+            aria-colindex={ 0 }
+            role='columnheader'>
+            <span
+              aria-label={ ariaLabelForSelectionColumn }
+            ></span>
+            <TooltipHost
+              hostClassName={ css(styles.checkTooltip) }
+              id={ `${this._id}-checkTooltip` }
+              setAriaDescribedBy={ false }
+              content={ ariaLabelForSelectAllCheckbox }>
+              <DetailsRowCheck
+                aria-describedby={ `${this._id}-checkTooltip` }
+                selected={ isAllSelected }
+                anySelected={ false }
+                canSelect={ true }
+              />
+            </TooltipHost>
+          </div>
+        ) : null }
+        { groupNestingDepth > 0 ? (
+          <div
+            className={ css('ms-DetailsHeader-cell', styles.cell) }
+            onClick={ this._onToggleCollapseAll }
+          >
+            <Icon
+              className={ css(
+                'ms-DetailsHeader-collapseButton',
+                styles.collapseButton,
+                isAllCollapsed && ('is-collapsed ' + styles.collapseButtonIsCollapsed)
+              ) }
+              iconName='ChevronDown'
+            />
+          </div>
+        ) : (null) }
+        { GroupSpacer({ count: groupNestingDepth - 1 }) }
+        { columns.map((column: IColumn, columnIndex: number) => {
+          const previousColumnIndex = columnIndex - 1;
+          const previousColumn = columns[previousColumnIndex];
+
+          return (
+            [
+              <div
+                key={ column.key }
+                role='columnheader'
+                aria-sort={ column.isSorted ? (column.isSortedDescending ? 'descending' : 'ascending') : 'none' }
+                aria-disabled={ column.columnActionsMode === ColumnActionsMode.disabled }
+                aria-colindex={ (showCheckbox ? 1 : 0) + columnIndex }
+                className={ css(
+                  'ms-DetailsHeader-cell',
+                  styles.cell,
+                  column.headerClassName, {
+                    ['is-actionable ' + styles.cellIsActionable]: column.columnActionsMode !== ColumnActionsMode.disabled,
+                    ['is-empty ' + styles.cellIsEmpty]: !column.name,
+                    'is-icon-visible': column.isSorted || column.isGrouped || column.isFiltered
+                  }) }
+                style={ { width: column.calculatedWidth + INNER_PADDING } }
+                aria-haspopup={ column.columnActionsMode === ColumnActionsMode.hasDropdown }
+                data-automationid='ColumnsHeaderColumn'
+                data-item-key={ column.key }
+              >
+                <TooltipHost
+                  hostClassName={ css(styles.cellTooltip) }
+                  id={ `${this._id}-${column.key}-tooltip` }
+                  setAriaDescribedBy={ false }
+                  content={ column.columnActionsMode !== ColumnActionsMode.disabled ? column.ariaLabel : '' }
+                >
+                  <span
+                    className={ css('ms-DetailsHeader-cellTitle', styles.cellTitle) }
+                    data-is-focusable={ column.columnActionsMode !== ColumnActionsMode.disabled }
+                    role={ column.columnActionsMode !== ColumnActionsMode.disabled ? 'button' : undefined }
+                    aria-describedby={ `${this._id}-${column.key}-tooltip` }
+                    onContextMenu={ this._onColumnContextMenu.bind(this, column) }
+                    onClick={ this._onColumnClick.bind(this, column) }
+                  >
+                    { column.isFiltered && (
+                      <Icon className={ styles.nearIcon } iconName='Filter' />
+                    ) }
+
+                    { column.isSorted && (
+                      <Icon className={ styles.nearIcon } iconName={ column.isSortedDescending ? 'SortDown' : 'SortUp' } />
+                    ) }
+
+                    { column.isGrouped && (
+                      <Icon className={ styles.nearIcon } iconName='GroupedDescending' />
+                    ) }
+
+                    <span
+                      aria-label={ column.isIconOnly ? column.name : undefined }
+                      className={ css('ms-DetailsHeader-cellName', styles.cellName) }
+                    >
+                      { (column.iconName || column.iconClassName) && (
+                        <Icon className={ css(styles.nearIcon, column.iconClassName) } iconName={ column.iconName } />
+                      ) }
+
+                      { !column.isIconOnly ? column.name : undefined }
+                    </span>
+
+                    { column.columnActionsMode === ColumnActionsMode.hasDropdown && !column.isIconOnly && (
+                      <Icon
+                        className={ css('ms-DetailsHeader-filterChevron', styles.filterChevron) }
+                        iconName='ChevronDown'
+                      />
+                    ) }
+                  </span>
+                </TooltipHost>
+              </div>,
+              (column.isResizable) && this._renderColumnSizer(columnIndex)
+            ]
+          );
+        }) }
+        { isSizing && (
+          <Layer>
+            <div
+              className={ css(isSizing && styles.sizingOverlay) }
+              onMouseMove={ this._onSizerMouseMove }
+              onMouseUp={ this._onSizerMouseUp }
+            />
+          </Layer>
+        ) }
+      </FocusZone>
+    );
+  }
+
+  /** Set focus to the active thing in the focus area. */
+  public focus(): boolean {
+    return this.refs.root.focus();
+  }
+
+  private _renderColumnSizer(columnIndex: number) {
+    const { columns } = this.props;
+    const column = this.props.columns[columnIndex];
+    const { isSizing, columnResizeDetails } = this.state;
+
+    return (
+      <div
+        aria-hidden={ true }
+        role='button'
+        data-is-focusable={ false }
+        onClick={ stopPropagation }
+        data-sizer-index={ columnIndex }
+        onBlur={ this._onSizerBlur }
+        className={ css(
+          'ms-DetailsHeader-cellSizer',
+          styles.cellSizer,
+          columnIndex < columns.length - 1 ? styles.cellSizerStart : styles.cellSizerEnd,
+          {
+            ['is-resizing ' + styles.cellIsResizing]: columnResizeDetails && columnResizeDetails.columnIndex === columnIndex
+          }) }
+        onDoubleClick={ this._onSizerDoubleClick.bind(this, columnIndex) }
+      />
+    );
+  }
+
+  /**
+   * double click on the column sizer will auto ajust column width
+   * to fit the longest content among current rendered rows.
+   *
+   * @private
+   * @param {number} columnIndex (index of the column user double clicked)
+   * @param {React.MouseEvent} ev (mouse double click event)
+   */
+  private _onSizerDoubleClick(columnIndex: number, ev: React.MouseEvent<HTMLElement>) {
+    let { onColumnAutoResized, columns } = this.props;
+    if (onColumnAutoResized) {
+      onColumnAutoResized(columns[columnIndex], columnIndex);
+    }
+  }
+
+  /**
+   * Called when the select all toggle is clicked.
+   */
+
+  @autobind
+  private _onSelectAllClicked() {
+    let { selection } = this.props;
+
+    selection.toggleAllSelected();
+  }
+
+  @autobind
+  private _onRootMouseDown(ev: MouseEvent) {
+    let columnIndexAttr = (ev.target as HTMLElement).getAttribute('data-sizer-index');
+    let columnIndex = Number(columnIndexAttr);
+    let { columns } = this.props;
+
+    if (columnIndexAttr === null || ev.button !== MOUSEDOWN_PRIMARY_BUTTON) {
+      // Ignore anything except the primary button.
+      return;
+    }
+
+    this.setState({
+      columnResizeDetails: {
+        columnIndex: columnIndex,
+        columnMinWidth: columns[columnIndex].calculatedWidth,
+        originX: ev.clientX
+      }
+    });
+
+    ev.preventDefault();
+    ev.stopPropagation();
+  }
+
+  @autobind
+  private _onRootMouseMove(ev: React.MouseEvent<HTMLElement>) {
+    let { columnResizeDetails, isSizing } = this.state;
+
+    if (columnResizeDetails && !isSizing && ev.clientX !== columnResizeDetails.originX) {
+      this.setState({ isSizing: true });
+    }
+  }
+
+  @autobind
+  private _onRootKeyDown(ev: KeyboardEvent) {
+    const { columnResizeDetails, isSizing } = this.state;
+    const { columns, onColumnResized } = this.props;
+
+    const columnIndexAttr = (ev.target as HTMLElement).getAttribute('data-sizer-index');
+
+    if (!columnIndexAttr || isSizing) {
+      return;
+    }
+
+    const columnIndex = Number(columnIndexAttr);
+
+    if (!columnResizeDetails) {
+      if (ev.which === KeyCodes.enter) {
+        this.setState({
+          columnResizeDetails: {
+            columnIndex: columnIndex,
+            columnMinWidth: columns[columnIndex].calculatedWidth
+          }
+        });
+
+        ev.preventDefault();
+        ev.stopPropagation();
+      }
+    } else {
+      let increment: number;
+
+      if (ev.which === KeyCodes.enter) {
+        this.setState({
+          columnResizeDetails: null
+        });
+
+        ev.preventDefault();
+        ev.stopPropagation();
+      } else if (ev.which === KeyCodes.left) {
+        increment = getRTL() ? 1 : -1;
+      } else if (ev.which === KeyCodes.right) {
+        increment = getRTL() ? -1 : 1;
+      }
+
+      if (increment) {
+        if (!ev.shiftKey) {
+          increment *= 10;
+        }
+
+        this.setState({
+          columnResizeDetails: {
+            ...columnResizeDetails,
+            columnMinWidth: columnResizeDetails.columnMinWidth + increment
+          }
+        });
+
+        if (onColumnResized) {
+          onColumnResized(columns[columnIndex], columnResizeDetails.columnMinWidth + increment);
+        }
+
+        ev.preventDefault();
+        ev.stopPropagation();
+      }
+    }
+  }
+
+  /**
+   * mouse move event handler in the header
+   * it will set isSizing state to true when user clicked on the sizer and move the mouse.
+   *
+   * @private
+   * @param {React.MouseEvent} ev (mouse move event)
+   */
+  @autobind
+  private _onSizerMouseMove(ev: React.MouseEvent<HTMLElement>) {
+    let {
+      // use buttons property here since ev.button in some edge case is not upding well during the move.
+      // but firefox doesn't support it, so we set the default value when it is not defined.
+      buttons
+    } = ev;
+    let { onColumnIsSizingChanged, onColumnResized, columns } = this.props;
+    let { columnResizeDetails } = this.state;
+
+    if (buttons !== undefined && buttons !== MOUSEMOVE_PRIMARY_BUTTON) {
+      // cancel mouse down event and return early when the primary button is not pressed
+      this._onSizerMouseUp(ev);
+      return;
+    }
+
+    if (ev.clientX !== columnResizeDetails.originX) {
+      if (onColumnIsSizingChanged) {
+        onColumnIsSizingChanged(columns[columnResizeDetails.columnIndex], true);
+      }
+    }
+
+    if (onColumnResized) {
+      let movement = ev.clientX - columnResizeDetails.originX;
+
+      if (getRTL()) {
+        movement = -movement;
+      }
+
+      onColumnResized(
+        columns[columnResizeDetails.columnIndex],
+        columnResizeDetails.columnMinWidth + movement
+      );
+    }
+
+  }
+
+  @autobind
+  private _onSizerBlur(ev: React.FocusEvent<HTMLElement>) {
+    const { columnResizeDetails } = this.state;
+
+    if (columnResizeDetails) {
+      this.setState({
+        columnResizeDetails: null,
+        isSizing: false
+      });
+    }
+  }
+
+  /**
+   * mouse up event handler in the header
+   * clear the resize related state.
+   * This is to ensure we can catch double click event
+   *
+   * @private
+   * @param {React.MouseEvent} ev (mouse up event)
+   */
+  @autobind
+  private _onSizerMouseUp(ev: React.MouseEvent<HTMLElement>) {
+    let { columns, onColumnIsSizingChanged } = this.props;
+    let { columnResizeDetails } = this.state;
+
+    this.setState({
+      columnResizeDetails: null,
+      isSizing: false
+    });
+
+    if (onColumnIsSizingChanged) {
+      onColumnIsSizingChanged(columns[columnResizeDetails.columnIndex], false);
+    }
+  }
+
+  private _onSelectionChanged() {
+    let isAllSelected = this.props.selection.isAllSelected();
+
+    if (this.state.isAllSelected !== isAllSelected) {
+      this.setState({
+        isAllSelected: isAllSelected
+      });
+    }
+  }
+
+  private _onColumnClick(column, ev) {
+    let { onColumnClick } = this.props;
+
+    if (column.onColumnClick) {
+      column.onColumnClick(ev, column);
+    }
+
+    if (onColumnClick) {
+      onColumnClick(ev, column);
+    }
+  }
+
+  private _onColumnContextMenu(column: IColumn, ev: React.MouseEvent<HTMLElement>) {
+    let { onColumnContextMenu } = this.props;
+
+    if (column.onColumnContextMenu) {
+      column.onColumnContextMenu(column, ev);
+
+      ev.preventDefault();
+    }
+
+    if (onColumnContextMenu) {
+      onColumnContextMenu(column, ev);
+
+      ev.preventDefault();
+    }
+  }
+
+  private _onToggleCollapseAll() {
+    let { onToggleCollapseAll } = this.props;
+    let newCollapsed = !this.state.isAllCollapsed;
+    this.setState({
+      isAllCollapsed: newCollapsed
+    });
+    if (onToggleCollapseAll) {
+      onToggleCollapseAll(newCollapsed);
+    }
+  }
+}
+
+function stopPropagation(ev: React.MouseEvent<HTMLElement>) {
+  ev.stopPropagation();
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
index edea7b25d747a..0064a959be80a 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
@@ -1,357 +1,368 @@
-import * as React from 'react';
-import { DetailsList } from './DetailsList';
-import {
-  ISelection,
-  SelectionMode
-} from '../../utilities/selection/index';
-import { IRenderFunction } from '../../Utilities';
-import {
-  IDragDropEvents,
-  IDragDropContext,
-} from './../../utilities/dragdrop/index';
-import { IconName } from '../../Icon';
-import {
-  IGroup,
-  IGroupRenderProps
-} from '../GroupedList/index';
-import { IDetailsRowProps } from '../DetailsList/DetailsRow';
-import { IViewport } from '../../utilities/decorators/withViewport';
-
-export interface IDetailsList {
-  /**
-   * Ensures that the list content is updated. Call this in cases where the list prop updates don't change, but the list
-   * still needs to be re-evaluated. For example, if a sizer bar is adjusted and causes the list width to change, you can
-   * call this to force a re-evaluation. Be aware that this can be an expensive operation and should be done sparingly.
-   */
-  forceUpdate: () => void;
-}
-
-export interface IDetailsListProps extends React.Props<DetailsList> {
-  /**
-   * Optional callback to access the IDetailsList interface. Use this instead of ref for accessing
-   * the public methods and properties of the component.
-   */
-  componentRef?: (component: IDetailsList) => void;
-
-  /** A key that uniquely identifies the given items. If provided, the selection will be reset when the key changes. */
-  setKey?: string;
-
-  /** The items to render. */
-  items: any[];
-
-  /**
-   * Optional default focused index to set focus to once the items have rendered and the index exists.
-   */
-  initialFocusedIndex?: number;
-
-  /** Optional class name to add to the root element. */
-  className?: string;
-
-  /** Optional grouping instructions. The definition for IGroup can be found under the GroupedList component. */
-  groups?: IGroup[];
-
-  /** Optional override properties to render groups. The definition for IGroupRenderProps can be found under the GroupedList component. */
-  groupProps?: IGroupRenderProps;
-
-  /** Optional selection model to track selection state.  */
-  selection?: ISelection;
-
-  /** Controls how/if the details list manages selection. */
-  selectionMode?: SelectionMode;
-
-  /**
-   * By default, selection is cleared when clicking on an empty (non-focusable) section of the screen. Setting this value to true
-   * overrides that behavior and maintains selection.
-   * @default false
-   **/
-  selectionPreservedOnEmptyClick?: boolean;
-
-  /** Controls how the columns are adjusted. */
-  layoutMode?: DetailsListLayoutMode;
-
-  /**
-   * Controls the visibility of selection check box.
-   * @default CheckboxVisibility.onHover
-   */
-  checkboxVisibility?: CheckboxVisibility;
-
-  /**
-   * Controls the visibility of the details header.
-   * @default true
-   */
-  isHeaderVisible?: boolean;
-
-  /** Given column defitions. If none are provided, default columns will be created based on the item's properties. */
-  columns?: IColumn[];
-
-  /** Controls how the list contrains overflow. */
-  constrainMode?: ConstrainMode;
-
-  /** Event names and corresponding callbacks that will be registered to rendered row elements. */
-  rowElementEventMap?: { eventName: string, callback: (context: IDragDropContext, event?: any) => void }[];
-
-  /** Callback for when the details list has been updated. Useful for telemetry tracking externally. */
-  onDidUpdate?: (detailsList?: DetailsList) => any;
-
-  /** Callback for when a given row has been mounted. Useful for identifying when a row has been rendered on the page. */
-  onRowDidMount?: (item?: any, index?: number) => void;
-
-  /** Callback for when a given row has been mounted. Useful for identifying when a row has been removed from the page. */
-  onRowWillUnmount?: (item?: any, index?: number) => void;
-
-  /** Callback for when the user clicks on the column header. */
-  onColumnHeaderClick?: (ev?: React.MouseEvent<HTMLElement>, column?: IColumn) => void;
-
-  /** Callback for when the user asks for a contextual menu (usually via right click) from a column header. */
-  onColumnHeaderContextMenu?: (column?: IColumn, ev?: Event) => void;
-
-  /** Callback fired on column resize */
-  onColumnResize?: (column?: IColumn, newWidth?: number) => void;
-
-  /** Callback for when a given row has been invoked (by pressing enter while it is selected.) */
-  onItemInvoked?: (item?: any, index?: number, ev?: Event) => void;
-
-  /** Callback for when the context menu of an item has been accessed. */
-  onItemContextMenu?: (item?: any, index?: number, ev?: Event) => void;
-
-  /**
-   *  If provided, will allow the caller to override the default row rendering.
-   */
-  onRenderRow?: IRenderFunction<IDetailsRowProps>;
-
-  /**
-   * If provided, will be the "default" item column renderer method. This affects cells within the rows; not the rows themselves.
-   * If a column definition provides its own onRender method, that will be used instead of this.
-   */
-  onRenderItemColumn?: (item?: any, index?: number, column?: IColumn) => any;
-
-  /** Map of callback functions related to drag and drop functionality. */
-  dragDropEvents?: IDragDropEvents;
-
-  /** Callback for what to render when the item is missing. */
-  onRenderMissingItem?: (index?: number) => React.ReactNode;
-
-  /** Viewport, provided by the withViewport decorator. */
-  viewport?: IViewport;
-
-  /** Callback for when an item in the list becomes active by clicking anywhere inside the row or navigating to it with keyboard. */
-  onActiveItemChanged?: (item?: any, index?: number, ev?: React.FocusEvent<HTMLElement>) => void;
-
-  /** The aria-label attribute to stamp out on the list header */
-  ariaLabelForListHeader?: string;
-
-  /** The aria-label attribute to stamp out on select all checkbox for the list */
-  ariaLabelForSelectAllCheckbox?: string;
-
-  /** Optional callback to get the aria-label string for a given item. */
-  getRowAriaLabel?: (item: any) => string;
-
-  /** Optional callback to get the item key, to be used in the selection and on render. */
-  getKey?: (item: any, index?: number) => string;
-
-  /** A text summary of the table set via aria-label. */
-  ariaLabel?: string;
-
-  /** Check button aria label for details list. */
-  checkButtonAriaLabel?: string;
-
-  /** Aria label for grid in details list. */
-  ariaLabelForGrid?: string;
-
-  /** Boolean value to indicate if the role application should be applied on details list. Set to false by default */
-  shouldApplyApplicationRole?: boolean;
-
-  /** 
-   * The minimum mouse move distance to interpret the action as drag event.
-   * @defaultValue 5
-   */
-  minimumPixelsForDrag?: number;
-}
-
-export interface IColumn {
-  /**
-   * A unique key for identifying the column.
-   */
-  key: string;
-
-  /**
-   * Name to render on the column header.
-   */
-  name: string;
-
-  /**
-   * The field to pull the text value from for the column. This can be null if a custom
-   * onRender method is provided.
-   */
-  fieldName: string;
-
-  /**
-   * An optional class name to stick on the column cell within each row.
-   */
-  className?: string;
-
-  /**
-   * Minimum width for the column.
-   */
-  minWidth: number;
-
-  /**
-   * Optional accessibility label (aria-label) attribute that will be stamped on to the element.
-   * If none is specified, the arai-label attribute will contain the column name
-   */
-  ariaLabel?: string;
-
-  /**
-   * Optional flag on whether the column is a header for the given row. There should be only one column with
-   * row header set to true.
-   * @default false
-   */
-  isRowHeader?: boolean;
-
-  /**
-   * Maximum width for the column, if stretching is allowed in justified scenarios.
-   */
-  maxWidth?: number;
-
-  /**
-   * Defines how the column's header should render.
-   * @default ColumnActionsMode.clickable */
-  columnActionsMode?: ColumnActionsMode;
-
-  /**
-   * Optional iconName to use for the column header.
-   */
-  iconName?: IconName;
-
-  /**
-   * Class name to add to the Icon component.
-   */
-  iconClassName?: string;
-
-  /**
-   * If specified will allow the column to be collapsed when rendered in justified layout.
-   */
-  isCollapsable?: boolean;
-
-  /**
-   * Determines if the column is currently sorted. Renders a sort arrow in the column header.
-   */
-  isSorted?: boolean;
-
-  /**
-   * Determines if the arrow is pointed down (descending) or up.
-   */
-  isSortedDescending?: boolean;
-
-  /**
-   * Determines if the column can be resized.
-   */
-  isResizable?: boolean;
-
-  /**
-   * Determines if the column can render multi-line text.
-   */
-  isMultiline?: boolean;
-
-  /**
-   * If provided uses this method to render custom cell content, rather than the default text rendering.
-   */
-  onRender?: (item?: any, index?: number, column?: IColumn) => any;
-
-  /**
-   * Determines if the column is filtered, and if so shows a filter icon.
-   */
-  isFiltered?: boolean;
-
-  /**
-   * If provided, will be executed when the user clicks on the column header.
-   */
-  onColumnClick?: (ev?: React.MouseEvent<HTMLElement>, column?: IColumn) => any;
-
-  /**
-   * If provided, will be executed when the user accesses the contextmenu on a column header.
-   */
-  onColumnContextMenu?: (column?: IColumn, ev?: React.MouseEvent<HTMLElement>) => any;
-
-  /**
-   * If set will show a grouped icon next to the column header name.
-   */
-  isGrouped?: boolean;
-
-  /**
-   * Arbitrary data passthrough which can be used by the caller.
-   */
-  data?: any;
-
-  /**
-   * Internal only value.
-   */
-  calculatedWidth?: number;
-
-  /**
-   * An optional class name to stick on the column cell within each header.
-   */
-  headerClassName?: string;
-}
-
-/**
- * Enum to describe how a particular column header behaves.... This enum is used to
- * to specify the property IColumn:columnActionsMode.
- * If IColumn:columnActionsMode is undefined, then it's equivalent to ColumnActionsMode.clickable
- */
-export enum ColumnActionsMode {
-  /**
-   * Renders the column header as disabled.
-   */
-  disabled = 0,
-
-  /**
-   * Renders the column header is clickable.
-   */
-  clickable = 1,
-
-  /**
-   * Renders the column header ias clickable and displays the dropdown cheveron.
-   */
-  hasDropdown = 2
-}
-
-export enum ConstrainMode {
-  /** If specified, lets the content grow which allows the page to manage scrolling. */
-  unconstrained = 0,
-
-  /**
-   * If specified, constrains the list to the given layout space.
-   */
-  horizontalConstrained = 1
-}
-
-export enum DetailsListLayoutMode {
-  /**
-   * Lets the user resize columns and makes not attempt to fit them.
-   */
-  fixedColumns = 0,
-
-  /**
-   * Manages which columns are visible, tries to size them according to their min/max rules and drops
-   * off columns that can't fit and have isCollapsable set.
-   */
-  justified = 1
-}
-
-export enum CheckboxVisibility {
-  /**
-   * Visible on hover.
-   */
-  onHover = 0,
-
-  /**
-   * Visible always.
-   */
-  always = 1,
-
-  /**
-   * Hide checkboxes.
-   */
-  hidden = 2
-}
+import * as React from 'react';
+import { DetailsList } from './DetailsList';
+import {
+  ISelection,
+  SelectionMode
+} from '../../utilities/selection/index';
+import { IRenderFunction } from '../../Utilities';
+import {
+  IDragDropEvents,
+  IDragDropContext,
+} from './../../utilities/dragdrop/index';
+import { IconName } from '../../Icon';
+import {
+  IGroup,
+  IGroupRenderProps
+} from '../GroupedList/index';
+import { IDetailsRowProps } from '../DetailsList/DetailsRow';
+import { IViewport } from '../../utilities/decorators/withViewport';
+
+export interface IDetailsList {
+  /**
+   * Ensures that the list content is updated. Call this in cases where the list prop updates don't change, but the list
+   * still needs to be re-evaluated. For example, if a sizer bar is adjusted and causes the list width to change, you can
+   * call this to force a re-evaluation. Be aware that this can be an expensive operation and should be done sparingly.
+   */
+  forceUpdate: () => void;
+}
+
+export interface IDetailsListProps extends React.Props<DetailsList> {
+  /**
+   * Optional callback to access the IDetailsList interface. Use this instead of ref for accessing
+   * the public methods and properties of the component.
+   */
+  componentRef?: (component: IDetailsList) => void;
+
+  /** A key that uniquely identifies the given items. If provided, the selection will be reset when the key changes. */
+  setKey?: string;
+
+  /** The items to render. */
+  items: any[];
+
+  /**
+   * Optional default focused index to set focus to once the items have rendered and the index exists.
+   */
+  initialFocusedIndex?: number;
+
+  /** Optional class name to add to the root element. */
+  className?: string;
+
+  /** Optional grouping instructions. The definition for IGroup can be found under the GroupedList component. */
+  groups?: IGroup[];
+
+  /** Optional override properties to render groups. The definition for IGroupRenderProps can be found under the GroupedList component. */
+  groupProps?: IGroupRenderProps;
+
+  /** Optional selection model to track selection state.  */
+  selection?: ISelection;
+
+  /** Controls how/if the details list manages selection. */
+  selectionMode?: SelectionMode;
+
+  /**
+   * By default, selection is cleared when clicking on an empty (non-focusable) section of the screen. Setting this value to true
+   * overrides that behavior and maintains selection.
+   * @default false
+   **/
+  selectionPreservedOnEmptyClick?: boolean;
+
+  /** Controls how the columns are adjusted. */
+  layoutMode?: DetailsListLayoutMode;
+
+  /**
+   * Controls the visibility of selection check box.
+   * @default CheckboxVisibility.onHover
+   */
+  checkboxVisibility?: CheckboxVisibility;
+
+  /**
+   * Controls the visibility of the details header.
+   * @default true
+   */
+  isHeaderVisible?: boolean;
+
+  /** Given column defitions. If none are provided, default columns will be created based on the item's properties. */
+  columns?: IColumn[];
+
+  /** Controls how the list contrains overflow. */
+  constrainMode?: ConstrainMode;
+
+  /** Event names and corresponding callbacks that will be registered to rendered row elements. */
+  rowElementEventMap?: { eventName: string, callback: (context: IDragDropContext, event?: any) => void }[];
+
+  /** Callback for when the details list has been updated. Useful for telemetry tracking externally. */
+  onDidUpdate?: (detailsList?: DetailsList) => any;
+
+  /** Callback for when a given row has been mounted. Useful for identifying when a row has been rendered on the page. */
+  onRowDidMount?: (item?: any, index?: number) => void;
+
+  /** Callback for when a given row has been mounted. Useful for identifying when a row has been removed from the page. */
+  onRowWillUnmount?: (item?: any, index?: number) => void;
+
+  /** Callback for when the user clicks on the column header. */
+  onColumnHeaderClick?: (ev?: React.MouseEvent<HTMLElement>, column?: IColumn) => void;
+
+  /** Callback for when the user asks for a contextual menu (usually via right click) from a column header. */
+  onColumnHeaderContextMenu?: (column?: IColumn, ev?: React.MouseEvent<HTMLElement>) => void;
+
+  /** Callback fired on column resize */
+  onColumnResize?: (column?: IColumn, newWidth?: number) => void;
+
+  /** Callback for when a given row has been invoked (by pressing enter while it is selected.) */
+  onItemInvoked?: (item?: any, index?: number, ev?: Event) => void;
+
+  /** Callback for when the context menu of an item has been accessed. */
+  onItemContextMenu?: (item?: any, index?: number, ev?: Event) => void;
+
+  /**
+   *  If provided, will allow the caller to override the default row rendering.
+   */
+  onRenderRow?: IRenderFunction<IDetailsRowProps>;
+
+  /**
+   * If provided, will be the "default" item column renderer method. This affects cells within the rows; not the rows themselves.
+   * If a column definition provides its own onRender method, that will be used instead of this.
+   */
+  onRenderItemColumn?: (item?: any, index?: number, column?: IColumn) => any;
+
+  /** Map of callback functions related to drag and drop functionality. */
+  dragDropEvents?: IDragDropEvents;
+
+  /** Callback for what to render when the item is missing. */
+  onRenderMissingItem?: (index?: number) => React.ReactNode;
+
+  /** Viewport, provided by the withViewport decorator. */
+  viewport?: IViewport;
+
+  /** Callback for when an item in the list becomes active by clicking anywhere inside the row or navigating to it with keyboard. */
+  onActiveItemChanged?: (item?: any, index?: number, ev?: React.FocusEvent<HTMLElement>) => void;
+
+  /** The aria-label attribute to stamp out on the list header */
+  ariaLabelForListHeader?: string;
+
+  /** The aria-label attribute to stamp out on select all checkbox for the list */
+  ariaLabelForSelectAllCheckbox?: string;
+
+  /**
+   * An ARIA label for the name of the selection column, for localization.
+   */
+  ariaLabelForSelectionColumn?: string;
+
+  /** Optional callback to get the aria-label string for a given item. */
+  getRowAriaLabel?: (item: any) => string;
+
+  /** Optional callback to get the item key, to be used in the selection and on render. */
+  getKey?: (item: any, index?: number) => string;
+
+  /** A text summary of the table set via aria-label. */
+  ariaLabel?: string;
+
+  /** Check button aria label for details list. */
+  checkButtonAriaLabel?: string;
+
+  /** Aria label for grid in details list. */
+  ariaLabelForGrid?: string;
+
+  /** Boolean value to indicate if the role application should be applied on details list. Set to false by default */
+  shouldApplyApplicationRole?: boolean;
+
+  /**
+   * The minimum mouse move distance to interpret the action as drag event.
+   * @defaultValue 5
+   */
+  minimumPixelsForDrag?: number;
+}
+
+export interface IColumn {
+  /**
+   * A unique key for identifying the column.
+   */
+  key: string;
+
+  /**
+   * Name to render on the column header.
+   */
+  name: string;
+
+  /**
+   * The field to pull the text value from for the column. This can be null if a custom
+   * onRender method is provided.
+   */
+  fieldName: string;
+
+  /**
+   * An optional class name to stick on the column cell within each row.
+   */
+  className?: string;
+
+  /**
+   * Minimum width for the column.
+   */
+  minWidth: number;
+
+  /**
+   * Optional accessibility label (aria-label) attribute that will be stamped on to the element.
+   * If none is specified, the arai-label attribute will contain the column name
+   */
+  ariaLabel?: string;
+
+  /**
+   * Optional flag on whether the column is a header for the given row. There should be only one column with
+   * row header set to true.
+   * @default false
+   */
+  isRowHeader?: boolean;
+
+  /**
+   * Maximum width for the column, if stretching is allowed in justified scenarios.
+   */
+  maxWidth?: number;
+
+  /**
+   * Defines how the column's header should render.
+   * @default ColumnActionsMode.clickable */
+  columnActionsMode?: ColumnActionsMode;
+
+  /**
+   * Optional iconName to use for the column header.
+   */
+  iconName?: IconName;
+
+  /**
+   * Whether or not only the icon is used in the column header.
+   * Set this to true so the column name and dropdown chevron are not displayed.
+   */
+  isIconOnly?: boolean;
+
+  /**
+   * Class name to add to the Icon component.
+   */
+  iconClassName?: string;
+
+  /**
+   * If specified will allow the column to be collapsed when rendered in justified layout.
+   */
+  isCollapsable?: boolean;
+
+  /**
+   * Determines if the column is currently sorted. Renders a sort arrow in the column header.
+   */
+  isSorted?: boolean;
+
+  /**
+   * Determines if the arrow is pointed down (descending) or up.
+   */
+  isSortedDescending?: boolean;
+
+  /**
+   * Determines if the column can be resized.
+   */
+  isResizable?: boolean;
+
+  /**
+   * Determines if the column can render multi-line text.
+   */
+  isMultiline?: boolean;
+
+  /**
+   * If provided uses this method to render custom cell content, rather than the default text rendering.
+   */
+  onRender?: (item?: any, index?: number, column?: IColumn) => any;
+
+  /**
+   * Determines if the column is filtered, and if so shows a filter icon.
+   */
+  isFiltered?: boolean;
+
+  /**
+   * If provided, will be executed when the user clicks on the column header.
+   */
+  onColumnClick?: (ev?: React.MouseEvent<HTMLElement>, column?: IColumn) => any;
+
+  /**
+   * If provided, will be executed when the user accesses the contextmenu on a column header.
+   */
+  onColumnContextMenu?: (column?: IColumn, ev?: React.MouseEvent<HTMLElement>) => any;
+
+  /**
+   * If set will show a grouped icon next to the column header name.
+   */
+  isGrouped?: boolean;
+
+  /**
+   * Arbitrary data passthrough which can be used by the caller.
+   */
+  data?: any;
+
+  /**
+   * Internal only value.
+   */
+  calculatedWidth?: number;
+
+  /**
+   * An optional class name to stick on the column cell within each header.
+   */
+  headerClassName?: string;
+}
+
+/**
+ * Enum to describe how a particular column header behaves.... This enum is used to
+ * to specify the property IColumn:columnActionsMode.
+ * If IColumn:columnActionsMode is undefined, then it's equivalent to ColumnActionsMode.clickable
+ */
+export enum ColumnActionsMode {
+  /**
+   * Renders the column header as disabled.
+   */
+  disabled = 0,
+
+  /**
+   * Renders the column header is clickable.
+   */
+  clickable = 1,
+
+  /**
+   * Renders the column header ias clickable and displays the dropdown cheveron.
+   */
+  hasDropdown = 2
+}
+
+export enum ConstrainMode {
+  /** If specified, lets the content grow which allows the page to manage scrolling. */
+  unconstrained = 0,
+
+  /**
+   * If specified, constrains the list to the given layout space.
+   */
+  horizontalConstrained = 1
+}
+
+export enum DetailsListLayoutMode {
+  /**
+   * Lets the user resize columns and makes not attempt to fit them.
+   */
+  fixedColumns = 0,
+
+  /**
+   * Manages which columns are visible, tries to size them according to their min/max rules and drops
+   * off columns that can't fit and have isCollapsable set.
+   */
+  justified = 1
+}
+
+export enum CheckboxVisibility {
+  /**
+   * Visible on hover.
+   */
+  onHover = 0,
+
+  /**
+   * Visible always.
+   */
+  always = 1,
+
+  /**
+   * Hide checkboxes.
+   */
+  hidden = 2
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 5cb78b2feaf57..2a698268153c4 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -1,5 +1,7 @@
+
 import * as React from 'react';
 import * as stylesImport from './DetailsList.scss';
+import * as ReactDOM from 'react-dom';
 
 import {
   BaseComponent,
@@ -189,6 +191,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     let {
       ariaLabelForListHeader,
       ariaLabelForSelectAllCheckbox,
+      ariaLabelForSelectionColumn,
       className,
       checkboxVisibility,
       constrainMode,
@@ -257,7 +260,11 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
         data-is-scrollable='false'
         aria-label={ ariaLabel }
         { ...(shouldApplyApplicationRole ? { role: 'application' } : {}) }>
-        <div role='grid' aria-label={ ariaLabelForGrid } aria-rowcount={ items ? items.length : 0 } aria-colcount={ adjustedColumns ? adjustedColumns.length : 0 }>
+        <div role='grid'
+          aria-label={ ariaLabelForGrid }
+          aria-rowcount={ (isHeaderVisible ? 1 : 0) + (items ? items.length : 0) }
+          aria-colcount={ (selectAllVisibility !== SelectAllVisibility.none ? 1 : 0) + (adjustedColumns ? adjustedColumns.length : 0) }
+          aria-readonly='true'>
           <div onKeyDown={ this._onHeaderKeyDown } role='presentation'>
             { isHeaderVisible && (
               <DetailsHeader
@@ -276,6 +283,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
                 onToggleCollapseAll={ this._onToggleCollapse }
                 ariaLabel={ ariaLabelForListHeader }
                 ariaLabelForSelectAllCheckbox={ ariaLabelForSelectAllCheckbox }
+                ariaLabelForSelectionColumn={ ariaLabelForSelectionColumn }
                 selectAllVisibility={ selectAllVisibility }
               />
             ) }
@@ -285,7 +293,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
               ref='focusZone'
               className={ styles.focusZone }
               direction={ FocusZoneDirection.vertical }
-              isInnerZoneKeystroke={ (ev) => (ev.which === getRTLSafeKeyCode(KeyCodes.right)) }
+              isInnerZoneKeystroke={ isRightArrow }
               onActiveElementChanged={ this._onActiveRowChanged }
             >
               <SelectionZone
@@ -313,7 +321,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
                   />
                 ) : (
                     <List
-                      role={ null }
+                      role='presentation'
                       items={ items }
                       onRenderCell={ (item, itemIndex) => this._onRenderCell(0, item, itemIndex) }
                       { ...additionalListProps }
@@ -444,7 +452,9 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       if (this.refs.selectionZone) {
         this.refs.selectionZone.ignoreNextFocus();
       }
-      this._async.setTimeout(() => row.focus(), 0);
+      this._async.setTimeout(() => {
+        row.focus();
+      }, 0);
 
       delete this._initialFocusedIndex;
     }
@@ -699,7 +709,7 @@ export function buildColumns(
           isRowHeader: false,
           columnActionsMode: ColumnActionsMode.clickable,
           isResizable: canResizeColumns,
-          onColumnClick,
+          onColumnClick: onColumnClick,
           isGrouped: groupedColumnKey === propName
         });
 
@@ -710,3 +720,7 @@ export function buildColumns(
 
   return columns;
 }
+
+function isRightArrow(event: React.KeyboardEvent<HTMLElement>) {
+  return event.which === getRTLSafeKeyCode(KeyCodes.right);
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
index ff0cb9f7c2b73..a9b36006dcee6 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
@@ -45,11 +45,12 @@ $detailsList-item-selected-hover-color: $listItemSelectedHoverColor;
 }
 
 .cell {
+  @include focus-border();
+
   display: inline-block;
   position: relative;
   box-sizing: border-box;
-  padding: $rowVerticalPadding 0;
-  margin: 0 8px;
+  padding: $rowVerticalPadding 8px;
   min-height: $rowHeight;
   vertical-align: top;
   white-space: nowrap;
@@ -59,6 +60,11 @@ $detailsList-item-selected-hover-color: $listItemSelectedHoverColor;
   & > button {
     max-width: 100%;
   }
+
+  &.checkCell {
+    padding: 0;
+    margin: 0;
+  }
 }
 
 .isMultiline {
@@ -71,36 +77,7 @@ $detailsList-item-selected-hover-color: $listItemSelectedHoverColor;
   display: inline-block;
 }
 
-.check {
-  @include focus-border();
-
-  display: inline-block;
-  cursor: default;
-  padding: 6px;
-  box-sizing: border-box;
-  vertical-align: top;
-  background: none;
-  border: none;
-  opacity: 0;
-}
-
-.checkDisabled {
-  visibility: hidden;
-}
-
-.root:hover .check,
-.rootIsSelected .check,
-.rootIsCheckVisible .check {
-  opacity: 1;
-}
-
 .cellMeasurer .cell {
   overflow: visible;
   white-space: nowrap;
 }
-
-.checkSpacer {
-  display: inline-block;
-  height: 20px;
-  width: 20px;
-}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index 1be478ba618ba..2122c8a134c1c 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -23,6 +23,7 @@ import { IViewport } from '../../utilities/decorators/withViewport';
 import * as stylesImport from './DetailsRow.scss';
 const styles: any = stylesImport;
 import { AnimationClassNames } from '../../Styling';
+import * as checkStyles from './DetailsRowCheck.scss';
 
 export interface IDetailsRowProps extends React.Props<DetailsRow> {
   item: any;
@@ -87,7 +88,9 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
     this._hasSetFocus = false;
 
     this._droppingClassNames = '';
+
     this._updateDroppingState = this._updateDroppingState.bind(this);
+    this._onToggleSelection = this._onToggleSelection.bind(this);
   }
 
   public componentDidMount() {
@@ -182,10 +185,12 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
     const ariaLabel = getRowAriaLabel ? getRowAriaLabel(item) : null;
     const canSelect = selection.canSelectItem(item);
     const isContentUnselectable = selectionMode === SelectionMode.multiple;
+    const showCheckbox = selectionMode !== SelectionMode.none && checkboxVisibility !== CheckboxVisibility.hidden;
 
     return (
-      <div
+      <FocusZone
         {...getNativeProps(this.props, divProperties) }
+        direction={ FocusZoneDirection.horizontal }
         ref='root'
         role='row'
         aria-label={ ariaLabel }
@@ -193,11 +198,12 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
           'ms-DetailsRow',
           AnimationClassNames.fadeIn400,
           styles.root,
+          checkStyles.owner,
           droppingClassName,
           {
-            ['is-contentUnselectable ' + styles.rootIsContentUnselectable]: isContentUnselectable,
-            ['is-selected ' + styles.rootIsSelected]: isSelected,
-            ['is-check-visible ' + styles.rootIsCheckVisible]: checkboxVisibility === CheckboxVisibility.always
+            [`is-contentUnselectable ${styles.rootIsContentUnselectable}`]: isContentUnselectable,
+            [`is-selected ${checkStyles.isSelected} ${styles.rootIsSelected}`]: isSelected,
+            [`is-check-visible ${checkStyles.isVisible}`]: checkboxVisibility === CheckboxVisibility.always
           }) }
         data-is-focusable={ true }
         data-selection-index={ itemIndex }
@@ -209,42 +215,47 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
         style={ { minWidth: viewport ? viewport.width : 0 } }
         aria-selected={ isSelected }
       >
-        <FocusZone direction={ FocusZoneDirection.horizontal }>
-          { (selectionMode !== SelectionMode.none && checkboxVisibility !== CheckboxVisibility.hidden) && (
-            <span role='gridcell'>
-              { onRenderCheck({
-                isSelected,
-                anySelected,
-                ariaLabel: checkButtonAriaLabel,
-                canSelect
-              }) }
-            </span>
-          ) }
-
-          { GroupSpacer({ count: groupNestingDepth }) }
-
-          { item && (
+        { showCheckbox && (
+          <div
+            role='gridcell'
+            aria-colindex={ 0 }
+            className={ css('ms-DetailsRow-cell', 'ms-DetailsRow-cellCheck', checkStyles.owner, styles.cell, styles.checkCell) }
+          >
+            { onRenderCheck({
+              isSelected,
+              anySelected,
+              title: checkButtonAriaLabel,
+              canSelect
+            }) }
+          </div>
+        ) }
+
+        { GroupSpacer({ count: groupNestingDepth }) }
+
+        { item && (
+          <DetailsRowFields
+            columns={ columns }
+            item={ item }
+            itemIndex={ itemIndex }
+            columnStartIndex={ showCheckbox ? 1 : 0 }
+            onRenderItemColumn={ onRenderItemColumn } />
+        ) }
+
+        { columnMeasureInfo && (
+          <span
+            role='presentation'
+            className={ css('ms-DetailsRow-cellMeasurer ms-DetailsRow-cell', styles.cellMeasurer, styles.cell) }
+            ref='cellMeasurer'
+          >
             <DetailsRowFields
-              columns={ columns }
+              columns={ [columnMeasureInfo.column] }
               item={ item }
               itemIndex={ itemIndex }
+              columnStartIndex={ (showCheckbox ? 1 : 0) + columns.length }
               onRenderItemColumn={ onRenderItemColumn } />
-          ) }
-
-          { columnMeasureInfo && (
-            <span
-              className={ css('ms-DetailsRow-cellMeasurer ms-DetailsRow-cell', styles.cellMeasurer, styles.cell) }
-              ref='cellMeasurer'
-            >
-              <DetailsRowFields
-                columns={ [columnMeasureInfo.column] }
-                item={ item }
-                itemIndex={ itemIndex }
-                onRenderItemColumn={ onRenderItemColumn } />
-            </span>
-          ) }
-        </FocusZone>
-      </div>
+          </span>
+        ) }
+      </FocusZone>
     );
   }
 
@@ -271,11 +282,13 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
     });
   }
 
-  public focus() {
-    if (this.refs && this.refs.root) {
-      this.refs.root.tabIndex = 0;
+  public focus(): boolean {
+    if (this.refs.root) {
       this.refs.root.focus();
+      return true;
     }
+
+    return false;
   }
 
   protected _onRenderCheck(props: IDetailsRowCheckProps) {
@@ -301,6 +314,12 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
     }
   }
 
+  private _onToggleSelection() {
+    const { selection } = this.props;
+
+    selection.toggleIndexSelected(this.props.itemIndex);
+  }
+
   private _getRowDragDropOptions(): IDragDropOptions {
     const {
       item,
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
new file mode 100644
index 0000000000000..71a9fb6ae4069
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
@@ -0,0 +1,37 @@
+
+@import '../../common/common';
+
+.check {
+  @include focus-border();
+
+  display: inline-block;
+  cursor: default;
+  box-sizing: border-box;
+  vertical-align: top;
+  background: none;
+  border: none;
+  opacity: 0;
+
+  &:focus {
+    opacity: 1;
+  }
+}
+
+button.check {
+  padding: 6px;
+}
+
+.owner {
+  &.isSelected,
+  &.isVisible,
+  &:hover,
+  &:focus {
+    .check {
+      opacity: 1;
+    }
+  }
+}
+
+.isDisabled {
+  visibility: hidden;
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx
index a420719cedbeb..0d06c9da8afb3 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx
@@ -3,10 +3,9 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import { css } from '../../Utilities';
 import { Check } from '../../Check';
-import * as stylesImport from './DetailsRow.scss';
-const styles: any = stylesImport;
+import * as styles from './DetailsRowCheck.scss';
 
-export interface IDetailsRowCheckProps {
+export interface IDetailsRowCheckProps extends React.HTMLProps<HTMLElement> {
   selected?: boolean;
   /**
    * Deprecated at v.65.1 and will be removed by v 1.0. Use 'selected' instead.
@@ -14,26 +13,33 @@ export interface IDetailsRowCheckProps {
    */
   isSelected?: boolean;
   anySelected: boolean;
-  ariaLabel: string;
   canSelect: boolean;
 }
 
 export const DetailsRowCheck = (props: IDetailsRowCheckProps) => {
-  let selected = props.isSelected || props.selected;
+  const {
+    canSelect,
+    isSelected,
+    anySelected,
+    selected,
+    ...buttonProps
+  } = props;
+
+  let isPressed = props.isSelected || props.selected;
+
   return (
     <button
-      type='button'
+      { ...buttonProps }
+      role='checkbox'
       className={ css('ms-DetailsRow-check', styles.check, {
-        [styles.checkDisabled]: !props.canSelect,
+        [styles.isDisabled]: !props.canSelect,
         'ms-DetailsRow-check--isDisabled': !props.canSelect
       }) }
-      role='button'
-      aria-pressed={ selected }
+      aria-checked={ isPressed }
       data-selection-toggle={ true }
       data-automationid='DetailsRowCheck'
-      aria-label={ props.ariaLabel }
     >
-      <Check checked={ selected } />
+      <Check checked={ isPressed } />
     </button>
   );
 };
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
index 636ceaf5a1726..696dd514860ff 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
@@ -4,9 +4,12 @@ import { BaseComponent, css } from '../../Utilities';
 import * as stylesImport from './DetailsRow.scss';
 const styles: any = stylesImport;
 
+const INNER_PADDING = 16; // Account for padding around the cell.
+
 export interface IDetailsRowFieldsProps {
   item: any;
   itemIndex: number;
+  columnStartIndex: number;
   columns: IColumn[];
   onRenderItemColumn?: (item?: any, index?: number, column?: IColumn) => any;
 }
@@ -27,21 +30,24 @@ export class DetailsRowFields extends BaseComponent<IDetailsRowFieldsProps, IDet
   }
 
   public render() {
-    let { columns } = this.props;
+    let { columns, columnStartIndex } = this.props;
     let { cellContent } = this.state;
 
     return (
-      <div className={ css('ms-DetailsRow-fields', styles.fields) } data-automationid='DetailsRowFields'>
+      <div
+        className={ css('ms-DetailsRow-fields', styles.fields) }
+        data-automationid='DetailsRowFields'
+        role='presentation'>
         { columns.map((column, columnIndex) => (
           <div
             key={ columnIndex }
             role={ column.isRowHeader ? 'rowheader' : 'gridcell' }
-            aria-colindex={ columnIndex }
+            aria-colindex={ columnIndex + columnStartIndex }
             className={ css('ms-DetailsRow-cell', styles.cell, column.className, {
               'is-multiline': column.isMultiline,
               [styles.isMultiline]: column.isMultiline
             }) }
-            style={ { width: column.calculatedWidth } }
+            style={ { width: column.calculatedWidth + INNER_PADDING } }
             data-automationid='DetailsRowCell'
             data-automation-key={ column.key }>
             { cellContent[columnIndex] }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
index 5d5c21423b0d5..20d8c7323ef6d 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
@@ -76,7 +76,7 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
       selectionMode: SelectionMode.multiple,
       canResizeColumns: true,
       checkboxVisibility: CheckboxVisibility.onHover,
-      columns: this._buildColumns(_items, true, this._onColumnClick, ''),
+      columns: this._buildColumns(_items, true, this._onColumnClick, '', undefined, undefined, this._onColumnContextMenu),
       contextualMenuProps: null,
       sortedColumnKey: 'name',
       isSortedDescending: false,
@@ -139,6 +139,7 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
           onItemContextMenu={ this._onItemContextMenu }
           ariaLabelForListHeader='Column headers. Use menus to perform column operations like sort and filter'
           ariaLabelForSelectAllCheckbox='Toggle selection for all items'
+          ariaLabelForSelectionColumn='Toggle selection'
           onRenderMissingItem={ (index) => {
             this._onDataMiss(index);
             return null;
@@ -450,9 +451,20 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
 
   @autobind
   private _onColumnClick(ev: React.MouseEvent<HTMLElement>, column: IColumn) {
-    this.setState({
-      contextualMenuProps: this._getContextualMenuProps(ev, column)
-    });
+    if (column.columnActionsMode !== ColumnActionsMode.disabled) {
+      this.setState({
+        contextualMenuProps: this._getContextualMenuProps(ev, column)
+      });
+    }
+  }
+
+  @autobind
+  private _onColumnContextMenu(column: IColumn, ev: React.MouseEvent<HTMLElement>) {
+    if (column.columnActionsMode !== ColumnActionsMode.disabled) {
+      this.setState({
+        contextualMenuProps: this._getContextualMenuProps(ev, column)
+      });
+    }
   }
 
   @autobind
@@ -469,7 +481,14 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
     this.setState({
       items: sortedItems,
       groups: null,
-      columns: this._buildColumns(sortedItems, true, this._onColumnClick, key, isSortedDescending),
+      columns: this._buildColumns(
+        sortedItems,
+        true,
+        this._onColumnClick,
+        key,
+        isSortedDescending,
+        undefined,
+        this._onColumnContextMenu),
       isSortedDescending: isSortedDescending,
       sortedColumnKey: key
     });
@@ -578,11 +597,17 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
     onColumnClick?: (ev: React.MouseEvent<HTMLElement>, column: IColumn) => any,
     sortedColumnKey?: string,
     isSortedDescending?: boolean,
-    groupedColumnKey?: string) {
+    groupedColumnKey?: string,
+    onColumnContextMenu?: (column: IColumn, ev: React.MouseEvent<HTMLElement>) => any) {
     let columns = buildColumns(items, canResizeColumns, onColumnClick, sortedColumnKey, isSortedDescending, groupedColumnKey);
 
     columns.forEach(column => {
-      if (column.key === 'description') {
+      column.onColumnContextMenu = onColumnContextMenu;
+      column.ariaLabel = `Operations for ${column.name}`;
+      if (column.key === 'thumbnail') {
+        column.iconName = 'Picture';
+        column.isIconOnly = true;
+      } else if (column.key === 'description') {
         column.isMultiline = true;
         column.minWidth = 200;
       } else if (column.key === 'name') {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
index 90ae16251fa80..fb0d814a0a72a 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
@@ -5,20 +5,22 @@ import { TextField } from 'office-ui-fabric-react/lib/TextField';
 import {
   DetailsList,
   DetailsListLayoutMode,
-  Selection
+  Selection,
+  IColumn
 } from 'office-ui-fabric-react/lib/DetailsList';
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
 
 let _items = [];
 
-let _columns = [
+let _columns: IColumn[] = [
   {
     key: 'column1',
     name: 'Name',
     fieldName: 'name',
     minWidth: 100,
     maxWidth: 200,
-    isResizable: true
+    isResizable: true,
+    ariaLabel: 'Operations for name'
   },
   {
     key: 'column2',
@@ -26,7 +28,8 @@ let _columns = [
     fieldName: 'value',
     minWidth: 100,
     maxWidth: 200,
-    isResizable: true
+    isResizable: true,
+    ariaLabel: 'Operations for value'
   },
 ];
 
@@ -75,6 +78,8 @@ export class DetailsListBasicExample extends React.Component<any, any> {
             layoutMode={ DetailsListLayoutMode.fixedColumns }
             selection={ this._selection }
             selectionPreservedOnEmptyClick={ true }
+            ariaLabelForSelectionColumn='Toggle selection'
+            ariaLabelForSelectAllCheckbox='Toggle selection for all items'
             onItemInvoked={ (item) => alert(`Item invoked: ${item.name}`) }
           />
         </MarqueeSelection>
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
index eb37253750ce4..c40ed1432c4f7 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
@@ -100,6 +100,8 @@ export class DetailsListGroupedExample extends React.Component<any, any> {
           items={ items }
           groups={ groupBy(items, 'color') }
           columns={ _columns }
+          ariaLabelForSelectAllCheckbox='Toggle selection for all items'
+          ariaLabelForSelectionColumn='Toggle selection'
         />
       </Fabric>
     );
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
index 0ec90f9ff11d5..3eed527eb7207 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
@@ -9,17 +9,49 @@ import { KeyCodes } from '../../Utilities';
 import { FocusZone } from './FocusZone';
 import { FocusZoneDirection } from './FocusZone.Props';
 
-let { assert } = chai;
-let _lastFocusedElement;
-
-function _onFocus(ev) {
-  _lastFocusedElement = ev.target;
-}
+import { assert } from 'chai';
 
 describe('FocusZone', () => {
+  let lastFocusedElement: HTMLElement;
+
+  function _onFocus(ev) {
+    lastFocusedElement = ev.target;
+  }
+
+  function setupElement(element: HTMLElement, {
+    clientRect,
+    isVisible = true
+  }: {
+      clientRect: {
+        top: number;
+        left: number;
+        bottom: number;
+        right: number;
+      };
+      isVisible?: boolean;
+    }): void {
+    element.getBoundingClientRect = () => ({
+      top: clientRect.top,
+      left: clientRect.left,
+      bottom: clientRect.bottom,
+      right: clientRect.right,
+      width: clientRect.right - clientRect.left,
+      height: clientRect.bottom - clientRect.top
+    });
+    if (isVisible) {
+      (element as any).isVisible = isVisible;
+    } else {
+      (element as any).hidden = !isVisible;
+    }
+    element.focus = () => ReactTestUtils.Simulate.focus(element);
+  }
+
+  beforeEach(() => {
+    lastFocusedElement = undefined;
+  });
 
   it('can use arrows vertically', () => {
-    let component = ReactTestUtils.renderIntoDocument(
+    const component = ReactTestUtils.renderIntoDocument(
       <div { ...{ onFocusCapture: _onFocus } }>
         <FocusZone direction={ FocusZoneDirection.vertical }>
           <button className='a'>a</button>
@@ -28,93 +60,95 @@ describe('FocusZone', () => {
         </FocusZone>
       </div>
     );
-    let focusZone = ReactDOM.findDOMNode(component as React.ReactInstance).firstChild as Element;
-    let buttonA = focusZone.querySelector('.a') as HTMLElement;
-    let buttonB = focusZone.querySelector('.b') as HTMLElement;
-    let buttonC = focusZone.querySelector('.c') as HTMLElement;
+
+    const focusZone = ReactDOM.findDOMNode(component as React.ReactInstance).firstChild as Element;
+
+    const buttonA = focusZone.querySelector('.a') as HTMLElement;
+    const buttonB = focusZone.querySelector('.b') as HTMLElement;
+    const buttonC = focusZone.querySelector('.c') as HTMLElement;
 
     // Assign bounding locations to buttons.
-    buttonA.getBoundingClientRect = () => ({
-      top: 0, bottom: 30,
-      left: 0, right: 100,
-      width: 100,
-      height: 30
-    } as ClientRect);
-    (buttonA as any).isVisible = true;
-    buttonA.focus = () => ReactTestUtils.Simulate.focus(buttonA);
-
-    buttonB.getBoundingClientRect = () => ({
-      top: 30, bottom: 60,
-      left: 0, right: 100,
-      width: 100,
-      height: 30
-    } as ClientRect);
-    (buttonB as any).isVisible = true;
-    buttonB.focus = () => ReactTestUtils.Simulate.focus(buttonB);
-
-    buttonC.getBoundingClientRect = () => ({
-      top: 60, bottom: 90,
-      left: 0, right: 100,
-      width: 100,
-      height: 30
-    } as ClientRect);
-    (buttonC as any).isVisible = true;
-    buttonC.focus = () => ReactTestUtils.Simulate.focus(buttonC);
+    setupElement(buttonA, {
+      clientRect: {
+        top: 0,
+        bottom: 30,
+        left: 0,
+        right: 100
+      }
+    });
+
+    setupElement(buttonB, {
+      clientRect: {
+        top: 30,
+        bottom: 60,
+        left: 0,
+        right: 100
+      }
+    });
+
+    setupElement(buttonC, {
+      clientRect: {
+        top: 60,
+        bottom: 90,
+        left: 0,
+        right: 100
+      }
+    });
 
     // Focus the first button.
     ReactTestUtils.Simulate.focus(buttonA);
-    assert(_lastFocusedElement === buttonA, 'buttonA was not focused');
+    assert(lastFocusedElement === buttonA, 'buttonA was not focused');
 
     // Pressing down should go to b.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
-    assert(_lastFocusedElement === buttonB, 'pressing down did not focus b');
+    assert(lastFocusedElement === buttonB, 'pressing down did not focus b');
 
     // Pressing down should go to c.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
-    assert(_lastFocusedElement === buttonC, 'pressing down did not focus c');
+    assert(lastFocusedElement === buttonC, 'pressing down did not focus c');
 
     // Pressing down should stay on c.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
-    assert(_lastFocusedElement === buttonC, 'pressing down again did not stay on c');
+    assert(lastFocusedElement === buttonC, 'pressing down again did not stay on c');
 
     // Pressing up should go to b.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
-    assert(_lastFocusedElement === buttonB, 'pressing up did not focus b');
+    assert(lastFocusedElement === buttonB, 'pressing up did not focus b');
 
     // Pressing up should go to a.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
-    assert(_lastFocusedElement === buttonA, 'pressing up did not focus a');
+    assert(lastFocusedElement === buttonA, 'pressing up did not focus a');
 
     // Pressing up should stay on a.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
-    assert(_lastFocusedElement === buttonA, 'pressing up again did not stay on a');
+    assert(lastFocusedElement === buttonA, 'pressing up again did not stay on a');
 
     // Click on c to focus it.
     ReactTestUtils.Simulate.focus(buttonC);
-    assert(_lastFocusedElement === buttonC, 'buttonC was not focused');
+    assert(lastFocusedElement === buttonC, 'buttonC was not focused');
 
     // Pressing up should move to b.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
-    assert(_lastFocusedElement === buttonB, 'pressing up after clicking on c did not focus b');
+    assert(lastFocusedElement === buttonB, 'pressing up after clicking on c did not focus b');
 
     // Test that pressing horizontal buttons don't move focus.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
-    assert(_lastFocusedElement === buttonB, 'pressing left did not keep focus on b');
+    assert(lastFocusedElement === buttonB, 'pressing left did not keep focus on b');
 
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
-    assert(_lastFocusedElement === buttonB, 'pressing right did not keep focus on b');
+    assert(lastFocusedElement === buttonB, 'pressing right did not keep focus on b');
 
     // Press home should go to the first target.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.home });
-    assert(_lastFocusedElement === buttonA, 'pressing home did not move focus to a');
+    assert(lastFocusedElement === buttonA, 'pressing home did not move focus to a');
 
     // // Press end should go to the last target.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.end });
-    assert(_lastFocusedElement === buttonC, 'pressing end did not move focus to c');
+    assert(lastFocusedElement === buttonC, 'pressing end did not move focus to c');
   });
 
   it('can use arrows horizontally', () => {
-    let component = ReactTestUtils.renderIntoDocument(
+    const component = ReactTestUtils.renderIntoDocument(
       <div { ...{ onFocusCapture: _onFocus } }>
         <FocusZone direction={ FocusZoneDirection.horizontal }>
           <button className='a'>a</button>
@@ -123,93 +157,94 @@ describe('FocusZone', () => {
         </FocusZone>
       </div>
     );
-    let focusZone = ReactDOM.findDOMNode(component as React.ReactInstance).firstChild as Element;
-    let buttonA = focusZone.querySelector('.a') as HTMLElement;
-    let buttonB = focusZone.querySelector('.b') as HTMLElement;
-    let buttonC = focusZone.querySelector('.c') as HTMLElement;
+
+    const focusZone = ReactDOM.findDOMNode(component as React.ReactInstance).firstChild as Element;
+    const buttonA = focusZone.querySelector('.a') as HTMLElement;
+    const buttonB = focusZone.querySelector('.b') as HTMLElement;
+    const buttonC = focusZone.querySelector('.c') as HTMLElement;
 
     // Assign bounding locations to buttons.
-    buttonA.getBoundingClientRect = () => ({
-      left: 0, right: 30,
-      top: 0, bottom: 100,
-      width: 30,
-      height: 100
-    } as ClientRect);
-    (buttonA as any).isVisible = true;
-    buttonA.focus = () => ReactTestUtils.Simulate.focus(buttonA);
-
-    buttonB.getBoundingClientRect = () => ({
-      left: 30, right: 60,
-      top: 0, bottom: 100,
-      width: 30,
-      height: 100
-    } as ClientRect);
-    (buttonB as any).isVisible = true;
-    buttonB.focus = () => ReactTestUtils.Simulate.focus(buttonB);
-
-    buttonC.getBoundingClientRect = () => ({
-      left: 60, right: 90,
-      top: 0, bottom: 100,
-      width: 30,
-      height: 100
-    } as ClientRect);
-    (buttonC as any).isVisible = true;
-    buttonC.focus = () => ReactTestUtils.Simulate.focus(buttonC);
+    setupElement(buttonA, {
+      clientRect: {
+        top: 0,
+        bottom: 100,
+        left: 0,
+        right: 30
+      }
+    });
+
+    setupElement(buttonB, {
+      clientRect: {
+        top: 0,
+        bottom: 100,
+        left: 30,
+        right: 60
+      }
+    });
+
+    setupElement(buttonC, {
+      clientRect: {
+        top: 0,
+        bottom: 100,
+        left: 60,
+        right: 90
+      }
+    });
 
     // Focus the first button.
     ReactTestUtils.Simulate.focus(buttonA);
-    assert(_lastFocusedElement === buttonA, 'buttonA was not focused');
+    assert(lastFocusedElement === buttonA, 'buttonA was not focused');
 
     // Pressing right should go to b.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
-    assert(_lastFocusedElement === buttonB, 'pressing right did not focus b');
+    assert(lastFocusedElement === buttonB, 'pressing right did not focus b');
 
     // Pressing right should go to c.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
-    assert(_lastFocusedElement === buttonC, 'pressing right did not focus c');
+    assert(lastFocusedElement === buttonC, 'pressing right did not focus c');
 
     // Pressing right should stay on c.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
-    assert(_lastFocusedElement === buttonC, 'pressing right again did not stay on c');
+    assert(lastFocusedElement === buttonC, 'pressing right again did not stay on c');
 
     // Pressing left should go to b.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
-    assert(_lastFocusedElement === buttonB, 'pressing left did not focus b');
+    assert(lastFocusedElement === buttonB, 'pressing left did not focus b');
 
     // Pressing left should go to a.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
-    assert(_lastFocusedElement === buttonA, 'pressing left did not focus a');
+    assert(lastFocusedElement === buttonA, 'pressing left did not focus a');
 
     // Pressing left should stay on a.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
-    assert(_lastFocusedElement === buttonA, 'pressing left again did not stay on a');
+    assert(lastFocusedElement === buttonA, 'pressing left again did not stay on a');
 
     // Click on c to focus it.
     ReactTestUtils.Simulate.focus(buttonC);
-    assert(_lastFocusedElement === buttonC, 'buttonC was not focused');
+    assert(lastFocusedElement === buttonC, 'buttonC was not focused');
 
     // Pressing left should move to b.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
-    assert(_lastFocusedElement === buttonB, 'pressing left after clicking on c did not focus b');
+    assert(lastFocusedElement === buttonB, 'pressing left after clicking on c did not focus b');
 
     // Test that pressing vertical buttons don't move focus.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
-    assert(_lastFocusedElement === buttonB, 'pressing up did not keep focus on b');
+    assert(lastFocusedElement === buttonB, 'pressing up did not keep focus on b');
 
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
-    assert(_lastFocusedElement === buttonB, 'pressing down did not keep focus on b');
+    assert(lastFocusedElement === buttonB, 'pressing down did not keep focus on b');
 
     // Press home should go to the first target.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.home });
-    assert(_lastFocusedElement === buttonA, 'pressing home did not move focus to a');
+    assert(lastFocusedElement === buttonA, 'pressing home did not move focus to a');
 
     // // Press end should go to the last target.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.end });
-    assert(_lastFocusedElement === buttonC, 'pressing end did not move focus to c');
+    assert(lastFocusedElement === buttonC, 'pressing end did not move focus to c');
   });
 
   it('can use arrows bidirectionally', () => {
-    let component = ReactTestUtils.renderIntoDocument(
+    const component = ReactTestUtils.renderIntoDocument(
       <div { ...{ onFocusCapture: _onFocus } }>
         <FocusZone>
           <button className='a'>a</button>
@@ -221,13 +256,14 @@ describe('FocusZone', () => {
         </FocusZone>
       </div>
     );
-    let focusZone = ReactDOM.findDOMNode(component as React.ReactInstance).firstChild as Element;
-    let buttonA = focusZone.querySelector('.a') as HTMLElement;
-    let buttonB = focusZone.querySelector('.b') as HTMLElement;
-    let buttonC = focusZone.querySelector('.c') as HTMLElement;
-    let hiddenButton = focusZone.querySelector('.hidden') as HTMLElement;
-    let buttonD = focusZone.querySelector('.d') as HTMLElement;
-    let buttonE = focusZone.querySelector('.e') as HTMLElement;
+
+    const focusZone = ReactDOM.findDOMNode(component as React.ReactInstance).firstChild as Element;
+    const buttonA = focusZone.querySelector('.a') as HTMLElement;
+    const buttonB = focusZone.querySelector('.b') as HTMLElement;
+    const buttonC = focusZone.querySelector('.c') as HTMLElement;
+    const hiddenButton = focusZone.querySelector('.hidden') as HTMLElement;
+    const buttonD = focusZone.querySelector('.d') as HTMLElement;
+    const buttonE = focusZone.querySelector('.e') as HTMLElement;
 
     // Set up a grid like so:
     // A B
@@ -236,92 +272,93 @@ describe('FocusZone', () => {
     //
     // We will iterate from A to B, press down to skip hidden and go to C,
     // down again to E, left to D, then back up to A.
-    buttonA.getBoundingClientRect = () => ({
-      left: 0, right: 20,
-      top: 0, bottom: 20,
-      width: 20,
-      height: 20
-    } as ClientRect);
-    (buttonA as any).isVisible = true;
-    buttonA.focus = () => ReactTestUtils.Simulate.focus(buttonA);
-
-    buttonB.getBoundingClientRect = () => ({
-      left: 20, right: 40,
-      top: 0, bottom: 20,
-      width: 20,
-      height: 20
-    } as ClientRect);
-    (buttonB as any).isVisible = true;
-    buttonB.focus = () => ReactTestUtils.Simulate.focus(buttonB);
-
-    buttonC.getBoundingClientRect = () => ({
-      left: 0, right: 20,
-      top: 20, bottom: 40,
-      width: 20,
-      height: 20
-    } as ClientRect);
-    (buttonC as any).isVisible = true;
-    buttonC.focus = () => ReactTestUtils.Simulate.focus(buttonC);
+    setupElement(buttonA, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 0,
+        right: 30
+      }
+    });
+
+    setupElement(buttonB, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 20,
+        right: 40
+      }
+    });
+
+    setupElement(buttonC, {
+      clientRect: {
+        top: 20,
+        bottom: 40,
+        left: 0,
+        right: 20
+      }
+    });
 
     // hidden button should be ignored.
-    hiddenButton.getBoundingClientRect = () => ({
-      left: 2, right: 40,
-      top: 20, bottom: 40,
-      width: 20,
-      height: 20
-    } as ClientRect);
-    hiddenButton.hidden = true;
-    hiddenButton.focus = () => ReactTestUtils.Simulate.focus(hiddenButton);
-
-    buttonD.getBoundingClientRect = () => ({
-      left: 0, right: 20,
-      top: 40, bottom: 60,
-      width: 20,
-      height: 20
-    } as ClientRect);
-    (buttonD as any).isVisible = true;
-    buttonD.focus = () => ReactTestUtils.Simulate.focus(buttonD);
-
-    buttonE.getBoundingClientRect = () => ({
-      left: 20, right: 40,
-      top: 40, bottom: 60,
-      width: 20,
-      height: 20
-    } as ClientRect);
-    (buttonE as any).isVisible = true;
-    buttonE.focus = () => ReactTestUtils.Simulate.focus(buttonE);
+    setupElement(hiddenButton, {
+      clientRect: {
+        top: 20,
+        bottom: 40,
+        left: 2,
+        right: 40
+      },
+      isVisible: false
+    });
+
+    setupElement(buttonD, {
+      clientRect: {
+        top: 40,
+        bottom: 60,
+        left: 0,
+        right: 20
+      }
+    });
+
+    setupElement(buttonE, {
+      clientRect: {
+        top: 40,
+        bottom: 60,
+        left: 20,
+        right: 40
+      }
+    });
 
     // Focus the first button.
     ReactTestUtils.Simulate.focus(buttonA);
-    assert(_lastFocusedElement === buttonA, 'buttonA was not focused');
+    assert(lastFocusedElement === buttonA, 'buttonA was not focused');
 
     // Pressing right should go to b.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
-    assert(_lastFocusedElement === buttonB, 'pressing right did not focus b');
+    assert(lastFocusedElement === buttonB, 'pressing right did not focus b');
 
     // Pressing down should go to c.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
-    assert(_lastFocusedElement === buttonC, 'pressing down did not focus c');
+    assert(lastFocusedElement === buttonC, 'pressing down did not focus c');
 
     // Pressing down should go to e.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
-    assert(_lastFocusedElement === buttonE, 'pressing down did not focus e');
+    assert(lastFocusedElement === buttonE, 'pressing down did not focus e');
 
     // Pressing left should go to d.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
-    assert(_lastFocusedElement === buttonD, 'pressing left did not focus d');
+    assert(lastFocusedElement === buttonD, 'pressing left did not focus d');
 
     // Pressing up should go to c.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
-    assert(_lastFocusedElement === buttonC, 'pressing up did not focus c');
+    assert(lastFocusedElement === buttonC, 'pressing up did not focus c');
 
     // Pressing up should go to a.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
-    assert(_lastFocusedElement === buttonA, 'pressing up did not focus a');
+    assert(lastFocusedElement === buttonA, 'pressing up did not focus a');
   });
 
   it('correctly skips data-not-focusable elements', () => {
-    let component = ReactTestUtils.renderIntoDocument(
+    const component = ReactTestUtils.renderIntoDocument(
       <div { ...{ onFocusCapture: _onFocus } }>
         <FocusZone>
           <button className='a'>a</button>
@@ -330,10 +367,11 @@ describe('FocusZone', () => {
         </FocusZone>
       </div>
     );
-    let focusZone = ReactDOM.findDOMNode(component as React.ReactInstance).firstChild as Element;
-    let buttonA = focusZone.querySelector('.a') as HTMLElement;
-    let buttonB = focusZone.querySelector('.b') as HTMLElement;
-    let buttonC = focusZone.querySelector('.c') as HTMLElement;
+
+    const focusZone = ReactDOM.findDOMNode(component as React.ReactInstance).firstChild as Element;
+    const buttonA = focusZone.querySelector('.a') as HTMLElement;
+    const buttonB = focusZone.querySelector('.b') as HTMLElement;
+    const buttonC = focusZone.querySelector('.c') as HTMLElement;
 
     // Set up a grid like so:
     // A B
@@ -342,44 +380,213 @@ describe('FocusZone', () => {
     //
     // We will iterate from A to B, press down to skip hidden and go to C,
     // down again to E, left to D, then back up to A.
-    buttonA.getBoundingClientRect = () => ({
-      left: 0, right: 20,
-      top: 0, bottom: 20,
-      width: 20,
-      height: 20
-    } as ClientRect);
-    (buttonA as any).isVisible = true;
-    buttonA.focus = () => ReactTestUtils.Simulate.focus(buttonA);
-
-    buttonB.getBoundingClientRect = () => ({
-      left: 20, right: 40,
-      top: 0, bottom: 20,
-      width: 20,
-      height: 20
-    } as ClientRect);
-    (buttonB as any).isVisible = true;
-    buttonB.focus = () => ReactTestUtils.Simulate.focus(buttonB);
-
-    buttonC.getBoundingClientRect = () => ({
-      left: 0, right: 20,
-      top: 20, bottom: 40,
-      width: 20,
-      height: 20
-    } as ClientRect);
-    (buttonC as any).isVisible = true;
-    buttonC.focus = () => ReactTestUtils.Simulate.focus(buttonC);
+    setupElement(buttonA, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 0,
+        right: 20
+      }
+    });
+
+    setupElement(buttonB, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 20,
+        right: 40
+      }
+    });
+
+    setupElement(buttonC, {
+      clientRect: {
+        top: 20,
+        bottom: 40,
+        left: 0,
+        right: 20
+      }
+    });
 
     // Focus the first button.
     ReactTestUtils.Simulate.focus(buttonA);
-    assert(_lastFocusedElement === buttonA, 'buttonA was not focused');
+    assert(lastFocusedElement === buttonA, 'buttonA was not focused');
 
     // Pressing right should go to b.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
-    assert(_lastFocusedElement === buttonC, 'pressing down did not focus c');
+    assert(lastFocusedElement === buttonC, 'pressing down did not focus c');
 
     // Pressing down should go to c.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
-    assert(_lastFocusedElement === buttonA, 'pressing down did not focus a');
+    assert(lastFocusedElement === buttonA, 'pressing down did not focus a');
+  });
+
+  it('skips subzone elements until manually entered', () => {
+    const component = ReactTestUtils.renderIntoDocument(
+      <div { ...{ onFocusCapture: _onFocus } }>
+        <FocusZone
+          direction={ FocusZoneDirection.horizontal }
+          isInnerZoneKeystroke={ (e: React.KeyboardEvent<HTMLElement>) => e.which === KeyCodes.enter }>
+          <button className='a'>a</button>
+          <div
+            className='b'
+            data-is-focusable={ true }
+            data-is-sub-focuszone={ true }>
+            <button className='bsub'>bsub</button>
+          </div>
+          <button className='c'>c</button>
+        </FocusZone>
+      </div>
+    );
+
+    const focusZone = ReactDOM.findDOMNode(component as React.ReactInstance).firstChild as Element;
+
+    const buttonA = focusZone.querySelector('.a') as HTMLElement;
+    const divB = focusZone.querySelector('.b') as HTMLElement;
+    const buttonC = focusZone.querySelector('.c') as HTMLElement;
+
+    const buttonB = focusZone.querySelector('.bsub') as HTMLElement;
+
+    setupElement(buttonA, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 0,
+        right: 20
+      }
+    });
+
+    setupElement(divB, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 20,
+        right: 40
+      }
+    });
+
+    setupElement(buttonB, {
+      clientRect: {
+        top: 5,
+        bottom: 15,
+        left: 25,
+        right: 35
+      }
+    });
+
+    setupElement(buttonC, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 40,
+        right: 60
+      }
+    });
+
+    // Focus the first button.
+    ReactTestUtils.Simulate.focus(buttonA);
+    assert(lastFocusedElement === buttonA, 'buttonA was not focused');
+
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    assert(lastFocusedElement === divB, 'pressing right did not focus divB');
+
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    assert(lastFocusedElement === buttonC, 'pressing right did not skip to buttonC');
+
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
+    assert(lastFocusedElement === divB, 'pressing left did not skip back to divB');
+
+    ReactTestUtils.Simulate.keyDown(divB, { which: KeyCodes.enter });
+    assert(lastFocusedElement === buttonB, 'pressing enter did not jump in to buttonB');
+
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    assert(lastFocusedElement === buttonC, 'pressing enter did not move to buttonC');
+
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
+    assert(lastFocusedElement === divB, 'pressing left did not skip back to divB');
   });
 
+  it('skips child focusZone elements until manually entered', () => {
+    const component = ReactTestUtils.renderIntoDocument(
+      <div { ...{ onFocusCapture: _onFocus } }>
+        <FocusZone
+          direction={ FocusZoneDirection.horizontal }
+          isInnerZoneKeystroke={ (e: React.KeyboardEvent<HTMLElement>) => e.which === KeyCodes.enter }>
+          <button className='a'>a</button>
+          <FocusZone
+            direction={ FocusZoneDirection.horizontal }
+            className='b'
+            data-is-focusable={ true }>
+            <button className='bsub'>bsub</button>
+          </FocusZone>
+          <button className='c'>c</button>
+        </FocusZone>
+      </div>
+    );
+
+    const focusZone = ReactDOM.findDOMNode(component as React.ReactInstance).firstChild as Element;
+
+    const buttonA = focusZone.querySelector('.a') as HTMLElement;
+    const divB = focusZone.querySelector('.b') as HTMLElement;
+    const buttonC = focusZone.querySelector('.c') as HTMLElement;
+
+    const buttonB = focusZone.querySelector('.bsub') as HTMLElement;
+
+    setupElement(buttonA, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 0,
+        right: 20
+      }
+    });
+
+    setupElement(divB, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 20,
+        right: 40
+      }
+    });
+
+    setupElement(buttonB, {
+      clientRect: {
+        top: 5,
+        bottom: 15,
+        left: 25,
+        right: 35
+      }
+    });
+
+    setupElement(buttonC, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 40,
+        right: 60
+      }
+    });
+
+    // Focus the first button.
+    ReactTestUtils.Simulate.focus(buttonA);
+    assert(lastFocusedElement === buttonA, 'buttonA was not focused');
+
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    assert(lastFocusedElement === divB, 'pressing right did not focus divB');
+
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    assert(lastFocusedElement === buttonC, 'pressing right did not skip to buttonC');
+
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
+    assert(lastFocusedElement === divB, 'pressing left did not skip back to divB');
+
+    ReactTestUtils.Simulate.keyDown(divB, { which: KeyCodes.enter });
+    assert(lastFocusedElement === buttonB, 'pressing enter did not jump in to buttonB');
+
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    assert(lastFocusedElement === buttonC, 'pressing enter did not move to buttonC');
+
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
+    assert(lastFocusedElement === divB, 'pressing left did not skip back to divB');
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 3a1aa1cfb3ada..62f6be3ff89ab 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -20,6 +20,7 @@ import {
   getPreviousElement,
   getRTL,
   isElementFocusZone,
+  isElementFocusSubZone,
   isElementTabbable
 } from '../../Utilities';
 
@@ -86,7 +87,9 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       parentElement = getParent(parentElement);
     }
 
-    this._events.on(windowElement, 'keydown', this._onKeyDownCapture, true);
+    if (!this._isInnerZone) {
+      this._events.on(windowElement, 'keydown', this._onKeyDownCapture, true);
+    }
 
     // Assign initial tab indexes so that we can set initial focus as appropriate.
     this._updateTabIndexes();
@@ -107,6 +110,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
     return (
       <div
+        role='presentation'
         { ...divProps }
         { ...rootProps }
         className={ css('ms-FocusZone', className) }
@@ -127,8 +131,11 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
    * Sets focus to the first tabbable item in the zone.
    * @returns True if focus could be set to an active element, false if no operation was taken.
    */
-  public focus(): boolean {
-    if (this._activeElement && elementContains(this.refs.root, this._activeElement)) {
+  public focus(forceIntoFirstElement: boolean = false): boolean {
+    if (!forceIntoFirstElement && this.refs.root.getAttribute(IS_FOCUSABLE_ATTRIBUTE) === 'true' && this._isInnerZone) {
+      // The parent focus zone should take responsibility for focusing this element.
+      return true;
+    } else if (this._activeElement && elementContains(this.refs.root, this._activeElement)) {
       this._activeElement.focus();
       return true;
     } else {
@@ -153,12 +160,18 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     }
 
     if (element) {
-      if (this._activeElement) {
-        this._activeElement.tabIndex = -1;
-      }
+      const previousActiveElement = this._activeElement;
 
       this._activeElement = element;
 
+      if (previousActiveElement) {
+        if (isElementFocusZone(previousActiveElement)) {
+          this._updateTabIndexes(previousActiveElement);
+        }
+
+        previousActiveElement.tabIndex = -1;
+      }
+
       if (element) {
         if (!this._focusAlignment) {
           this._setFocusAlignment(element, true, true);
@@ -225,12 +238,15 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     while (path.length) {
       target = path.pop();
 
-      if (isElementFocusZone(target)) {
-        break;
-      } else if (target && isElementTabbable(target)) {
+      if (target && isElementTabbable(target)) {
         target.tabIndex = 0;
         this._setFocusAlignment(target, true, true);
       }
+
+      if (isElementFocusZone(target)) {
+        // Stop here since the focus zone will take care of its own children.
+        break;
+      }
     }
   }
 
@@ -245,6 +261,12 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       return;
     }
 
+    if (document.activeElement === this.refs.root && this._isInnerZone) {
+      // If this element has focus, it is being controlled by a parent.
+      // Ignore the keystroke.
+      return;
+    }
+
     if (this.props.onKeyDown) {
       this.props.onKeyDown(ev);
 
@@ -255,13 +277,21 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
     if (
       isInnerZoneKeystroke &&
-      this._isImmediateDescendantOfZone(ev.target as HTMLElement) &&
-      isInnerZoneKeystroke(ev)) {
+      isInnerZoneKeystroke(ev) &&
+      this._isImmediateDescendantOfZone(ev.target as HTMLElement)) {
 
       // Try to focus
       let innerZone = this._getFirstInnerZone();
 
-      if (!innerZone || !innerZone.focus()) {
+      if (innerZone) {
+        if (!innerZone.focus(true)) {
+          return;
+        }
+      } else if (isElementFocusSubZone(ev.target as HTMLElement)) {
+        if (!this.focusElement(getNextElement(ev.target as HTMLElement, (ev.target as HTMLElement).firstChild as HTMLElement, true))) {
+          return;
+        }
+      } else {
         return;
       }
     } else if (ev.altKey) {
@@ -331,6 +361,10 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
    * Walk up the dom try to find a focusable element.
    */
   private _tryInvokeClickForFocusable(target: HTMLElement): boolean {
+    if (target === this.refs.root) {
+      return false;
+    }
+
     do {
       if (target.tagName === 'BUTTON' || target.tagName === 'A' || target.tagName === 'INPUT') {
         return false;
@@ -357,6 +391,10 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   private _getFirstInnerZone(rootElement?: HTMLElement): FocusZone {
     rootElement = rootElement || this._activeElement || this.refs.root;
 
+    if (isElementFocusZone(rootElement)) {
+      return _allInstances[rootElement.getAttribute(FOCUSZONE_ID_ATTRIBUTE)];
+    }
+
     let child: HTMLElement = rootElement.firstElementChild as HTMLElement;
 
     while (child) {
@@ -579,17 +617,21 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   }
 
   private _isImmediateDescendantOfZone(element?: HTMLElement): boolean {
+    return this._getOwnerZone(element) === this.refs.root;
+  }
+
+  private _getOwnerZone(element?: HTMLElement): HTMLElement {
     let parentElement = getParent(element);
 
     while (parentElement && parentElement !== this.refs.root && parentElement !== document.body) {
       if (isElementFocusZone(parentElement)) {
-        return false;
+        return parentElement;
       }
 
       parentElement = getParent(parentElement);
     }
 
-    return true;
+    return this.refs.root;
   }
 
   private _updateTabIndexes(element?: HTMLElement) {
@@ -610,6 +652,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
         if (child.getAttribute && child.getAttribute(IS_FOCUSABLE_ATTRIBUTE) === 'false') {
           child.setAttribute(TABINDEX, '-1');
         }
+
         if (isElementTabbable(child)) {
           if (this.props.disabled) {
             child.setAttribute(TABINDEX, '-1');
@@ -625,11 +668,19 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
           // Disgusting IE hack. Sad face.
           child.setAttribute('focusable', 'false');
         }
-
-        this._updateTabIndexes(child);
+      } else if (child.getAttribute(IS_FOCUSABLE_ATTRIBUTE) === 'true') {
+        if (!this._isInnerZone && (!this._activeElement || this._activeElement === child)) {
+          this._activeElement = child;
+          if (child.getAttribute(TABINDEX) !== '0') {
+            child.setAttribute(TABINDEX, '0');
+          }
+        } else if (child.getAttribute(TABINDEX) !== '-1') {
+          child.setAttribute(TABINDEX, '-1');
+        }
       }
-    }
 
+      this._updateTabIndexes(child);
+    }
   }
 
   private _isElementInput(element: HTMLElement): boolean {
@@ -662,4 +713,4 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     return true;
   }
 
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index 47d3c03775d0c..2b8ccde568445 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -303,7 +303,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
 
     return (
       <div ref='root' { ...divProps } role={ role } className={ css('ms-List', className) } >
-        <div ref='surface' className='ms-List-surface'>
+        <div ref='surface' className='ms-List-surface' role='presentation'>
           { pageElements }
         </div>
       </div>
@@ -316,7 +316,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     let pageStyle = this._getPageStyle(page);
 
     // only assign list item role if no role is assigned
-    role = (role === undefined) ? 'listitem' : null;
+    role = (role === undefined) ? 'listitem' : 'presentation';
 
     for (let i = 0; page.items && i < page.items.length; i++) {
       let item = page.items[i];
@@ -338,7 +338,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     }
 
     return (
-      <div className='ms-List-page' key={ page.key } ref={ page.key } style={ pageStyle }>
+      <div className='ms-List-page' key={ page.key } ref={ page.key } style={ pageStyle } role='presentation'>
         { cells }
       </div>
     );
@@ -780,4 +780,4 @@ function _mergeRect(targetRect: IRectangle, newRect: IRectangle): IRectangle {
   targetRect.height = targetRect.bottom - targetRect.top + 1;
 
   return targetRect;
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.Props.ts b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.Props.ts
index 3aa8a9db16fd8..d709b9f428c28 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.Props.ts
@@ -36,6 +36,12 @@ export interface ITooltipHostProps extends React.HTMLProps<HTMLDivElement | Tool
    */
   tooltipProps?: ITooltipProps;
 
+  /**
+   * Whether or not to mark the container as described by the tooltip.
+   * If not specified, the caller should mark as element as described by the tooltip id.
+   */
+  setAriaDescribedBy?: boolean;
+
   /**
    * Length of delay
    * @default medium
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
index 21fec480c4618..c15a6b9bafa99 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
@@ -49,6 +49,7 @@ export class TooltipHost extends BaseComponent<ITooltipHostProps, ITooltipHostSt
       directionalHint,
       delay,
       id,
+      setAriaDescribedBy = true,
       hostClassName
     } = this.props;
     const { isTooltipVisible } = this.state;
@@ -61,22 +62,23 @@ export class TooltipHost extends BaseComponent<ITooltipHostProps, ITooltipHostSt
         { ...{ onBlurCapture: this._onTooltipMouseLeave } }
         onMouseEnter={ this._onTooltipMouseEnter }
         onMouseLeave={ this._onTooltipMouseLeave }
-        aria-describedby={ isTooltipVisible ? tooltipId : undefined }
+        aria-describedby={ setAriaDescribedBy && isTooltipVisible && content ? tooltipId : undefined }
       >
         { children }
-        { isTooltipVisible && (
-          <Tooltip
-            { ...tooltipProps }
-            id={ tooltipId }
-            delay={ delay }
-            content={ content }
-            targetElement={ this._getTargetElement() }
-            directionalHint={ directionalHint }
-            calloutProps={ assign(calloutProps, { onDismiss: this._onTooltipCallOutDismiss }) }
-            { ...getNativeProps(this.props, divProperties) }
-          >
-          </Tooltip>
-        ) }
+        { isTooltipVisible &&
+          content ? (
+            <Tooltip
+              { ...tooltipProps }
+              id={ tooltipId }
+              delay={ delay }
+              content={ content }
+              targetElement={ this._getTargetElement() }
+              directionalHint={ directionalHint }
+              calloutProps={ assign(calloutProps, { onDismiss: this._onTooltipCallOutDismiss }) }
+              { ...getNativeProps(this.props, divProperties) }
+            >
+            </Tooltip>
+          ) : undefined }
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
index 88060758bbe63..78237beffa8db 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
@@ -84,6 +84,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
         onKeyDown={ this._onKeyDown }
         onMouseDown={ this._onMouseDown }
         onClick={ this._onClick }
+        role='presentation'
 
         onDoubleClick={ this._onDoubleClick }
         onContextMenu={ this._onContextMenu }
diff --git a/packages/utilities/api/utilities.api.ts b/packages/utilities/api/utilities.api.ts
index 5dbec0c7c4e18..6d7157fda166e 100644
--- a/packages/utilities/api/utilities.api.ts
+++ b/packages/utilities/api/utilities.api.ts
@@ -254,6 +254,9 @@ interface IRenderFunction<P> {
   (props?: P, defaultRender?: (props?: P) => JSX.Element | null): JSX.Element | null;
 }
 
+// (undocumented)
+export function isElementFocusSubZone(element?: HTMLElement): boolean;
+
 // (undocumented)
 export function isElementFocusZone(element?: HTMLElement): boolean;
 
diff --git a/packages/utilities/src/focus.ts b/packages/utilities/src/focus.ts
index 89fff57c58ac6..d2bcea1877b53 100644
--- a/packages/utilities/src/focus.ts
+++ b/packages/utilities/src/focus.ts
@@ -5,6 +5,7 @@ import { elementContains, getDocument } from './dom';
 const IS_FOCUSABLE_ATTRIBUTE = 'data-is-focusable';
 const IS_VISIBLE_ATTRIBUTE = 'data-is-visible';
 const FOCUSZONE_ID_ATTRIBUTE = 'data-focuszone-id';
+const FOCUSZONE_SUB_ATTRIBUTE = 'data-is-sub-focuszone';
 
 export function getFirstFocusable(
   rootElement: HTMLElement,
@@ -55,7 +56,8 @@ export function getPreviousElement(
   let isCurrentElementVisible = isElementVisible(currentElement);
 
   // Check its children.
-  if (traverseChildren && (includeElementsInFocusZones || !isElementFocusZone(currentElement)) && isCurrentElementVisible) {
+  if (traverseChildren && isCurrentElementVisible &&
+    (includeElementsInFocusZones || !(isElementFocusZone(currentElement) || isElementFocusSubZone(currentElement)))) {
     const childMatch = getPreviousElement(
       rootElement,
       currentElement.lastElementChild as HTMLElement,
@@ -118,7 +120,8 @@ export function getNextElement(
   }
 
   // Check its children.
-  if (!suppressChildTraversal && isCurrentElementVisible && (includeElementsInFocusZones || !isElementFocusZone(currentElement))) {
+  if (!suppressChildTraversal && isCurrentElementVisible &&
+    (includeElementsInFocusZones || !(isElementFocusZone(currentElement) || isElementFocusSubZone(currentElement)))) {
     const childMatch = getNextElement(
       rootElement,
       currentElement.firstElementChild as HTMLElement,
@@ -206,7 +209,11 @@ export function isElementTabbable(element: HTMLElement): boolean {
 }
 
 export function isElementFocusZone(element?: HTMLElement): boolean {
-  return element && !!element.getAttribute(FOCUSZONE_ID_ATTRIBUTE);
+  return element && element.getAttribute && !!element.getAttribute(FOCUSZONE_ID_ATTRIBUTE);
+}
+
+export function isElementFocusSubZone(element?: HTMLElement): boolean {
+  return element && element.getAttribute && element.getAttribute(FOCUSZONE_SUB_ATTRIBUTE) === 'true';
 }
 
 export function doesElementContainFocus(element: HTMLElement) {

From 7acff7237b6eaaa5106b73559496d2cb779baace Mon Sep 17 00:00:00 2001
From: zoarif <zoarif@microsoft.com>
Date: Wed, 31 May 2017 19:09:05 -0700
Subject: [PATCH 0046/1641] Update elementToFocusOnDismiss on unmount in focus
 trap zone (#1900)

* Fix the focus trap zone to pick element to focus on dismiss on unmount instead of didMount.

* Change file

* Addressed comment
---
 ...zoarif-FixFocusTrapZoneIssue_2017-05-31-22-14.json | 11 +++++++++++
 .../src/components/FocusTrapZone/FocusTrapZone.tsx    |  8 ++++----
 2 files changed, 15 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/zoarif-FixFocusTrapZoneIssue_2017-05-31-22-14.json

diff --git a/common/changes/office-ui-fabric-react/zoarif-FixFocusTrapZoneIssue_2017-05-31-22-14.json b/common/changes/office-ui-fabric-react/zoarif-FixFocusTrapZoneIssue_2017-05-31-22-14.json
new file mode 100644
index 0000000000000..fb0d37112d6b9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/zoarif-FixFocusTrapZoneIssue_2017-05-31-22-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Update elementToFocusOnDismiss on unmount in focus trap zone",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "zoarif@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
index b18e3c9152272..5f2f33e4a0348 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
@@ -39,9 +39,7 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
   }
 
   public componentDidMount() {
-    let { elementToFocusOnDismiss, isClickableOutsideFocusTrap = false, forceFocusInsideTrap = true } = this.props;
-
-    this._previouslyFocusedElement = elementToFocusOnDismiss ? elementToFocusOnDismiss : document.activeElement as HTMLElement;
+    let { isClickableOutsideFocusTrap = false, forceFocusInsideTrap = true } = this.props;
 
     if (!elementContains(this.refs.root, this._previouslyFocusedElement)) {
       this.focus();
@@ -57,7 +55,9 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
   }
 
   public componentWillUnmount() {
-    let { ignoreExternalFocusing } = this.props;
+    let { ignoreExternalFocusing, elementToFocusOnDismiss } = this.props;
+
+    this._previouslyFocusedElement = elementToFocusOnDismiss ? elementToFocusOnDismiss : document.activeElement as HTMLElement
 
     this._events.dispose();
     if (this._isInFocusStack || this._isInClickStack) {

From bc7d1026e947372e3ebfd7e9e26a5f928463af0c Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 31 May 2017 22:05:26 -0700
Subject: [PATCH 0047/1641] Locking to ts 2.2.2. (#1904)

---
 apps/component-demo/package.json        |   2 +-
 apps/test-bundle-button/package.json    |   2 +-
 common/config/rush/npm-shrinkwrap.json  | 159 +++++++++---------------
 common/config/rush/pinned-versions.json |   2 +-
 4 files changed, 60 insertions(+), 105 deletions(-)

diff --git a/apps/component-demo/package.json b/apps/component-demo/package.json
index 9fe1f79da7af7..1d42092baad55 100644
--- a/apps/component-demo/package.json
+++ b/apps/component-demo/package.json
@@ -28,6 +28,6 @@
     "office-ui-fabric-react": ">=1.5.5 <2.0.0",
     "react": ">=15.3.2 <16.0.0",
     "react-dom": ">=15.3.2 <16.0.0",
-    "typescript": "2.3.3"
+    "typescript": "2.2.2"
   }
 }
\ No newline at end of file
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 1d9f0f6bb6b07..f66f9661677f3 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
     "@types/prop-types": "^15.5.1",
     "source-map-loader": "^0.2.1",
     "ts-loader": "^2.0.1",
-    "typescript": "^2.2.2",
+    "typescript": "2.2.2",
     "webpack": "^2.2.1",
     "webpack-bundle-analyzer": "^2.2.1",
     "webpack-dev-server": "^2.4.1"
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 90ef2722f8972..01aa33c0978f6 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -664,11 +664,6 @@
           "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.5.1.tgz",
           "integrity": "sha1-BTVocb7yOkNJBnNABvwYgza6gks="
         },
-        "typescript": {
-          "version": "2.2.2",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz",
-          "integrity": "sha1-YGAiUIR5tV/6NotY/uljoD39eww="
-        },
         "unzip-response": {
           "version": "2.0.1",
           "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-2.0.1.tgz",
@@ -702,10 +697,6 @@
           "version": "2.6.0",
           "bundled": true
         },
-        "es6-promise": {
-          "version": "4.1.0",
-          "bundled": true
-        },
         "glob": {
           "version": "7.1.1",
           "bundled": true
@@ -729,10 +720,6 @@
         "supports-color": {
           "version": "3.1.2",
           "bundled": true
-        },
-        "typescript": {
-          "version": "2.2.2",
-          "bundled": true
         }
       }
     },
@@ -801,7 +788,8 @@
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+              "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
             }
           }
         },
@@ -821,17 +809,14 @@
           "version": "2.0.2",
           "bundled": true
         },
-        "typescript": {
-          "version": "2.2.2",
-          "bundled": true
-        },
         "url": {
           "version": "0.11.0",
           "bundled": true,
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
+              "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
             }
           }
         },
@@ -864,14 +849,14 @@
           "version": "2.6.0",
           "bundled": true
         },
-        "es6-promise": {
-          "version": "4.1.0",
-          "bundled": true
-        },
         "glob": {
           "version": "7.1.1",
           "bundled": true
         },
+        "highlight.js": {
+          "version": "9.11.0",
+          "bundled": true
+        },
         "mocha": {
           "version": "3.3.0",
           "bundled": true
@@ -891,10 +876,6 @@
         "supports-color": {
           "version": "3.1.2",
           "bundled": true
-        },
-        "typescript": {
-          "version": "2.2.2",
-          "bundled": true
         }
       }
     },
@@ -929,10 +910,6 @@
           "version": "3.1.0",
           "bundled": true
         },
-        "es6-promise": {
-          "version": "4.1.0",
-          "bundled": true
-        },
         "glob": {
           "version": "7.1.1",
           "bundled": true
@@ -967,7 +944,8 @@
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+              "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
             }
           }
         },
@@ -995,17 +973,14 @@
           "version": "2.0.2",
           "bundled": true
         },
-        "typescript": {
-          "version": "2.2.2",
-          "bundled": true
-        },
         "url": {
           "version": "0.11.0",
           "bundled": true,
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
+              "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
             }
           }
         },
@@ -1015,7 +990,8 @@
           "dependencies": {
             "async": {
               "version": "2.4.1",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
+              "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c="
             }
           }
         },
@@ -1025,11 +1001,13 @@
           "dependencies": {
             "async": {
               "version": "2.4.1",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
+              "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c="
             },
             "source-map": {
               "version": "0.5.6",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz",
+              "integrity": "sha1-dc449SvwczxafwwRjYEzSiu19BI="
             }
           }
         },
@@ -1077,10 +1055,6 @@
           "version": "3.1.0",
           "bundled": true
         },
-        "es6-promise": {
-          "version": "4.1.0",
-          "bundled": true
-        },
         "glob": {
           "version": "7.1.1",
           "bundled": true
@@ -1115,7 +1089,8 @@
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+              "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
             }
           }
         },
@@ -1141,7 +1116,8 @@
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
+              "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
             }
           }
         },
@@ -1194,10 +1170,6 @@
           "version": "3.1.0",
           "bundled": true
         },
-        "es6-promise": {
-          "version": "4.1.0",
-          "bundled": true
-        },
         "glob": {
           "version": "7.1.1",
           "bundled": true
@@ -1232,7 +1204,8 @@
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
+              "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
             }
           }
         },
@@ -1260,17 +1233,14 @@
           "version": "2.0.2",
           "bundled": true
         },
-        "typescript": {
-          "version": "2.2.2",
-          "bundled": true
-        },
         "url": {
           "version": "0.11.0",
           "bundled": true,
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
+              "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
             }
           }
         },
@@ -1280,7 +1250,8 @@
           "dependencies": {
             "async": {
               "version": "2.4.1",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
+              "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c="
             }
           }
         },
@@ -1290,11 +1261,13 @@
           "dependencies": {
             "async": {
               "version": "2.4.1",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
+              "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c="
             },
             "source-map": {
               "version": "0.5.6",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz",
+              "integrity": "sha1-dc449SvwczxafwwRjYEzSiu19BI="
             }
           }
         },
@@ -1326,17 +1299,7 @@
       }
     },
     "@rush-temp/todo-app": {
-      "version": "file:projects/todo-app",
-      "dependencies": {
-        "es6-promise": {
-          "version": "4.1.0",
-          "bundled": true
-        },
-        "typescript": {
-          "version": "2.2.2",
-          "bundled": true
-        }
-      }
+      "version": "file:projects/todo-app"
     },
     "@rush-temp/utilities": {
       "version": "file:projects/utilities",
@@ -1349,10 +1312,6 @@
           "version": "2.6.0",
           "bundled": true
         },
-        "es6-promise": {
-          "version": "4.1.0",
-          "bundled": true
-        },
         "glob": {
           "version": "7.1.1",
           "bundled": true
@@ -1376,10 +1335,6 @@
         "supports-color": {
           "version": "3.1.2",
           "bundled": true
-        },
-        "typescript": {
-          "version": "2.2.2",
-          "bundled": true
         }
       }
     },
@@ -2295,9 +2250,9 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000674",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000674.tgz",
-      "integrity": "sha1-146ZoykTQfU4MOlq0vEpIblxXo0="
+      "version": "1.0.30000676",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000676.tgz",
+      "integrity": "sha1-gupXgjdjfI/zSiisqt43O2JMTqg="
     },
     "capture-stack-trace": {
       "version": "1.0.0",
@@ -3345,9 +3300,9 @@
       "integrity": "sha1-RTVSSKiJeQNLZ5Lhm7gfK3l13Q0="
     },
     "es5-ext": {
-      "version": "0.10.21",
-      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.21.tgz",
-      "integrity": "sha1-Gacl+eUdAwC7wejoIRCf2dr1WSU="
+      "version": "0.10.22",
+      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.22.tgz",
+      "integrity": "sha512-YXTXSlZkJsVwMEVljp1Bh5P9+Raa3524OMl9kywGMp1aazKTCnAqORRL/8dkuqNHk+LRYe0LezuS8PlUt3+mOw=="
     },
     "es6-collections": {
       "version": "0.5.6",
@@ -4892,9 +4847,9 @@
       "integrity": "sha1-k0EP0hsAlzUVH4howvJx80J+I/0="
     },
     "highlight.js": {
-      "version": "9.11.0",
-      "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-9.11.0.tgz",
-      "integrity": "sha1-R/mMc5mRhwDbLK8jDe0SzsQahK4="
+      "version": "9.12.0",
+      "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-9.12.0.tgz",
+      "integrity": "sha1-5tnb5Xy+/mB1HwKvM2GVhwyQwB4="
     },
     "hmac-drbg": {
       "version": "1.0.1",
@@ -4971,9 +4926,9 @@
           "integrity": "sha1-B8/omA7bINRV3cI6rc8eBMblCc4="
         },
         "uglify-js": {
-          "version": "3.0.13",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.13.tgz",
-          "integrity": "sha1-GHHXNqoeVQxyjX5aZVZXnnCSXWg="
+          "version": "3.0.14",
+          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.14.tgz",
+          "integrity": "sha1-JpevEm/SFarFVvrLHt+xeHUgR2A="
         }
       }
     },
@@ -5221,9 +5176,9 @@
       "integrity": "sha1-YTObbyR1/Hcv2cnYP1yFddwVSuE="
     },
     "is-dotfile": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/is-dotfile/-/is-dotfile-1.0.2.tgz",
-      "integrity": "sha1-LBMjg/ORmfjtwmjKAbmwB9IFzE0="
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/is-dotfile/-/is-dotfile-1.0.3.tgz",
+      "integrity": "sha1-pqLzL/0t+wT1yiXs0Pa4PPeYoeE="
     },
     "is-equal-shallow": {
       "version": "0.1.3",
@@ -5296,9 +5251,9 @@
       "integrity": "sha1-caUMhCnfync8kqOQpKA7OfzVHT4="
     },
     "is-plain-object": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.2.tgz",
-      "integrity": "sha1-HZq3lWaZN94xmYBxyh9wF3CzdaQ=",
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.3.tgz",
+      "integrity": "sha1-wVvz5LZrYtcu+vKSWEhmPsvGGbY=",
       "dependencies": {
         "isobject": {
           "version": "3.0.0",
@@ -7897,9 +7852,9 @@
       "integrity": "sha1-8z/pz7Urv9UgqhgyO8ZdsRCht2w="
     },
     "rtl-css-js": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.1.0.tgz",
-      "integrity": "sha1-c5qMN9k+xt2safWtRVZWxgQ9b5U="
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.1.1.tgz",
+      "integrity": "sha1-IZ0QchuARIRXcaA76i5cQ4eCECQ="
     },
     "run-async": {
       "version": "0.1.0",
@@ -8900,9 +8855,9 @@
       "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
     },
     "typescript": {
-      "version": "2.3.3",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.3.3.tgz",
-      "integrity": "sha1-ljnzw7QBSOjKl/4IpR3RiRu2viI="
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz",
+      "integrity": "sha1-YGAiUIR5tV/6NotY/uljoD39eww="
     },
     "ua-parser-js": {
       "version": "0.7.12",
diff --git a/common/config/rush/pinned-versions.json b/common/config/rush/pinned-versions.json
index ad579bbec3fc5..25d1374df7f18 100644
--- a/common/config/rush/pinned-versions.json
+++ b/common/config/rush/pinned-versions.json
@@ -7,7 +7,7 @@
   "tslint": "4.0.2",
   "tslint-microsoft-contrib": "4.0.0",
   "karma-sinon-chai": "1.3.1",
-  "typescript": "2.3.3",
+  "typescript": "2.2.2",
   "sinon-chai": "2.10.0",
   "sinon": "2.3.2"
 }
\ No newline at end of file

From 262f85869f3c6b60fc403ab720e95f6687f8e0e0 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 31 May 2017 22:20:16 -0700
Subject: [PATCH 0048/1641] Updating getWindow/getDocument to be ssr happy.
 (#1908)

* Fixing ssr.

* Updating utilities to be happy with ssr.
---
 .../utilities/ssr_2017-06-01-05-06.json       | 11 ++++++++++
 packages/utilities/src/dom.test.ts            | 22 ++++++++++++++++++-
 packages/utilities/src/dom.ts                 |  6 ++---
 packages/utilities/src/language.ts            |  1 -
 4 files changed, 35 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/ssr_2017-06-01-05-06.json

diff --git a/common/changes/@uifabric/utilities/ssr_2017-06-01-05-06.json b/common/changes/@uifabric/utilities/ssr_2017-06-01-05-06.json
new file mode 100644
index 0000000000000..f2581bc7a9cf7
--- /dev/null
+++ b/common/changes/@uifabric/utilities/ssr_2017-06-01-05-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "getDocument/getWindow: now checks for doc/win undefined before accessing, making them ssr happy.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/src/dom.test.ts b/packages/utilities/src/dom.test.ts
index f4e3ab7fa5c2b..b5660f47f2f7c 100644
--- a/packages/utilities/src/dom.test.ts
+++ b/packages/utilities/src/dom.test.ts
@@ -1,5 +1,9 @@
 import {
-  elementContains, getParent
+  getDocument,
+  getParent,
+  getWindow,
+  setSSR,
+  elementContains
 } from './dom';
 
 const { expect } = chai;
@@ -44,3 +48,19 @@ describe('getParent', () => {
     expect(getParent(childSvg)).equals(parentDiv);
   });
 });
+
+describe('getWindow', () => {
+  it('returns undefined in server environment', () => {
+    setSSR(true);
+    expect(getWindow()).equals(undefined);
+    setSSR(false);
+  });
+});
+
+describe('getDocument', () => {
+  it('returns undefined in server environment', () => {
+    setSSR(true);
+    expect(getDocument()).equals(undefined);
+    setSSR(false);
+  });
+});
diff --git a/packages/utilities/src/dom.ts b/packages/utilities/src/dom.ts
index 76d1bd2740b9d..b114db5c24f72 100644
--- a/packages/utilities/src/dom.ts
+++ b/packages/utilities/src/dom.ts
@@ -112,7 +112,7 @@ export function setSSR(isEnabled) {
 
 /** Helper to get the window object. */
 export function getWindow(rootElement?: HTMLElement) {
-  if (_isSSR) {
+  if (_isSSR || typeof window === 'undefined') {
     return undefined;
   } else {
     return (
@@ -129,7 +129,7 @@ export function getWindow(rootElement?: HTMLElement) {
  * Helper to get the document object.
  */
 export function getDocument(rootElement?: HTMLElement) {
-  if (_isSSR) {
+  if (_isSSR || typeof document === 'undefined') {
     return undefined;
   } else {
     return rootElement && rootElement.ownerDocument ? rootElement.ownerDocument : document;
@@ -165,4 +165,4 @@ export function getRect(element: HTMLElement | Window): IRectangle {
  */
 function isVirtualElement(element: HTMLElement | IVirtualElement): element is IVirtualElement {
   return element && !!(<IVirtualElement>element)._virtual;
-}
\ No newline at end of file
+}
diff --git a/packages/utilities/src/language.ts b/packages/utilities/src/language.ts
index 367d053de7568..bf0edc3c2ece6 100644
--- a/packages/utilities/src/language.ts
+++ b/packages/utilities/src/language.ts
@@ -1,4 +1,3 @@
-import { KeyCodes } from './KeyCodes';
 import { getDocument, getWindow } from './dom';
 
 // Default to undefined so that we initialize on first read.

From ddab4eb3a90a6063efb745345348520f1972cbc5 Mon Sep 17 00:00:00 2001
From: Michael Loughry <miclo@microsoft.com>
Date: Wed, 31 May 2017 22:21:08 -0700
Subject: [PATCH 0049/1641] Panel: fix large size (#1907)

* Fix logic error around large Panel size

* Add change file
---
 .../panel-fix-large-size_2017-06-01-02-48.json        | 11 +++++++++++
 .../src/components/Panel/Panel.tsx                    |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/panel-fix-large-size_2017-06-01-02-48.json

diff --git a/common/changes/office-ui-fabric-react/panel-fix-large-size_2017-06-01-02-48.json b/common/changes/office-ui-fabric-react/panel-fix-large-size_2017-06-01-02-48.json
new file mode 100644
index 0000000000000..b94a056d50f0f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/panel-fix-large-size_2017-06-01-02-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Panel: fix regression in large Panel size",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
index 73aa5263881e5..cdd44f517b81e 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
@@ -131,7 +131,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
                 type === PanelType.smallFixedNear && ('ms-Panel--smLeft ' + styles.rootIsSmallLeft),
                 type === PanelType.smallFixedFar && ('ms-Panel--sm ' + styles.rootIsSmall),
                 type === PanelType.medium && ('ms-Panel--md ' + styles.rootIsMedium),
-                type === PanelType.large || type === PanelType.largeFixed && ('ms-Panel--lg ' + styles.rootIsLarge),
+                (type === PanelType.large || type === PanelType.largeFixed) && ('ms-Panel--lg ' + styles.rootIsLarge),
                 type === PanelType.largeFixed && ('ms-Panel--fixed ' + styles.rootIsFixed),
                 type === PanelType.extraLarge && ('ms-Panel--xl ' + styles.rootIsXLarge),
                 type === PanelType.custom && ('ms-Panel--custom ' + styles.rootIsCustom),

From 62299239afdb7a082c9abd7c984d5f587b998abb Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Wed, 31 May 2017 22:25:36 -0700
Subject: [PATCH 0050/1641] Styling: Checked hovered styles for buttons (#1905)

* Adding checked property to the styles object

* Rush change

* Update checked-hovered-styles_2017-06-01-00-44.json
---
 .../checked-hovered-styles_2017-06-01-00-44.json  | 11 +++++++++++
 .../src/components/Button/BaseButton.tsx          |  7 +++++++
 .../src/components/Button/Button.Props.ts         | 15 +++++++++++++++
 .../Button/CommandButton/CommandButton.styles.ts  |  6 +++---
 .../Button/IconButton/IconButton.styles.ts        |  7 +++----
 .../Button/PrimaryButton/PrimaryButton.styles.ts  |  8 ++++----
 6 files changed, 43 insertions(+), 11 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/checked-hovered-styles_2017-06-01-00-44.json

diff --git a/common/changes/office-ui-fabric-react/checked-hovered-styles_2017-06-01-00-44.json b/common/changes/office-ui-fabric-react/checked-hovered-styles_2017-06-01-00-44.json
new file mode 100644
index 0000000000000..78d964e3909bd
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/checked-hovered-styles_2017-06-01-00-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Styling: Add support for overriding the styles on the checked hovered, checked pressed, and checked disabled states",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chrisgo@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 534d64fc51b61..8a016cb960b48 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -364,6 +364,13 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
           ':hover .ms-Button-description': styles.descriptionHovered,
           ':active': styles.rootPressed,
           ':active .ms-Button-description': styles.descriptionPressed
+        },
+        disabled && checked && [
+          styles.rootCheckedDisabled
+        ],
+        !disabled && checked && {
+          ':hover': styles.rootCheckedHovered,
+          ':active': styles.rootCheckedPressed
         }
       ) as string,
 
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
index a1fab053a75b3..dde82b514a842 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
@@ -197,6 +197,21 @@ export interface IButtonStyles {
    */
   rootPressed?: IStyle;
 
+  /**
+   * Style override applied to the root on hover in a checked, enabled state
+   */
+  rootCheckedHovered?: IStyle;
+
+  /**
+   * Style override applied to the root on pressed in a checked, enabled state
+   */
+  rootCheckedPressed?: IStyle;
+
+  /**
+  * Style override applied to the root on hover in a checked, disabled state
+  */
+  rootCheckedDisabled?: IStyle;
+
   /**
    * Style for the flexbox container within the root element.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
index c53aa889d753d..7ba60f4f64abd 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
@@ -41,10 +41,10 @@ export const getStyles = memoizeFunction((
 
     rootChecked: {
       backgroundColor: theme.palette.neutralTertiaryAlt,
+    },
 
-      ':hover': {
-        backgroundColor: theme.palette.neutralLight
-      }
+    rootCheckedHovered: {
+      backgroundColor: theme.palette.neutralLight
     },
 
     flexContainer: {
diff --git a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
index cafb1ca161e40..2d6e38cf51bcd 100644
--- a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
@@ -35,11 +35,10 @@ export const getStyles = memoizeFunction((
 
     rootChecked: {
       backgroundColor: theme.palette.neutralTertiaryAlt,
+    },
 
-      ':hover': {
-        backgroundColor: theme.palette.neutralLight
-      }
-
+    rootCheckedHovered: {
+      backgroundColor: theme.palette.neutralLight
     },
 
     rootDisabled: {
diff --git a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
index ea0b5b0d3217a..e765ff5987117 100644
--- a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
@@ -39,11 +39,11 @@ export const getStyles = memoizeFunction((
     rootChecked: {
       backgroundColor: palette.themeDark,
       color: palette.white,
+    },
 
-      ':hover': {
-        backgroundColor: theme.palette.neutralLight,
-        color: theme.palette.black
-      }
+    rootCheckedHovered: {
+      backgroundColor: theme.palette.neutralLight,
+      color: theme.palette.black
     }
   };
 

From f4e40fcbd0bb3e1cfdd494076a55a16a815bed16 Mon Sep 17 00:00:00 2001
From: Justin Warner <warner.73@wright.edu>
Date: Wed, 31 May 2017 22:28:22 -0700
Subject: [PATCH 0051/1641] Message bar styling and single line support (#1891)

* Bringing PR over to my own fork

* Updates

* Some more minor fixes

* Fixing icon issue
---
 ...sage-bar-single-line_2017-05-31-15-57.json |  11 ++
 .../src/components/MessageBar/MessageBar.scss | 133 +++++++++++-------
 .../src/components/MessageBar/MessageBar.tsx  |  55 +++++---
 .../examples/MessageBar.Basic.Example.tsx     |  13 +-
 4 files changed, 135 insertions(+), 77 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/juwar-message-bar-single-line_2017-05-31-15-57.json

diff --git a/common/changes/office-ui-fabric-react/juwar-message-bar-single-line_2017-05-31-15-57.json b/common/changes/office-ui-fabric-react/juwar-message-bar-single-line_2017-05-31-15-57.json
new file mode 100644
index 0000000000000..a7997a819a4a2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/juwar-message-bar-single-line_2017-05-31-15-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix css for MessageBar, and support single line message bar styling",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "juwar@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
index 761e5b316d3cc..1af10d4cb1df0 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
@@ -9,6 +9,7 @@
 
 .root {
   @include ms-bgColor-info;
+  min-height: 32px;
   color: $ms-color-infoText;
   width: 100%;
   box-sizing: border-box;
@@ -106,9 +107,7 @@
 }
 
 // Shared
-
 .content {
-  padding: 16px;
   display: flex;
   width: 100%;
   box-sizing: border-box;
@@ -132,17 +131,41 @@
   }
 }
 
-.actionables {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  min-width: 0;
+.actions {
+  padding: 12px 0px;
 }
 
-.actionables > .dismissal {
-  right: 0;
-  top: 0;
-  position: absolute !important; // Needed because we're using focus-border mixin
+.innerTextPadding {
+  span, .innerText > span {
+    @include padding-right(4px); // Add padding between text and hyperlink.
+  }
+}
+
+// Single line specific attributes
+.singleline {
+  height: 32px;
+  .content {
+    align-items: center;
+    padding: 8px 0px;
+    .icon {
+      font-family: 'FabricMDL2Icons';
+      padding: 0px 8px;
+    }
+
+    .text {
+      align-items: center;
+      flex: 1 1 auto;
+
+      .innerText,
+      .innerTextPadding {
+        @include padding-right(8px);
+        max-height: 1.3em;
+        overflow-x: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+    }
+  }
 }
 
 .actions, .actionsOneline {
@@ -152,64 +175,72 @@
   align-items: center;
 }
 
-.actionsOneline {
-  position: relative;
-}
-
 .dismissal {
   @include focus-border();
+  @include right(0);
+  max-height: 16px;
   min-width: 0;
-}
-.dismissalOneline .dismissal {
-  @include ms-margin-right(-8px);
+  position: absolute;
+  top: 0;
 }
 
-// Add space between adjacent MessageBars.
-.root + .root {
-  margin-top: 6px;
+.dismissalOneline {
+  min-width: 16px;
+  min-height: 16px;
+  // We want padding between the outside of the dismiss button to be 8px
+  // and the padding between the dismiss button and the text to be 12px
+  @include padding(8px, 12px, 8px, 12px);
 }
 
-.innerTextPadding {
-  @include padding-right(24px); // Add padding if we have a dismiss to prevent button overlapping text.
-
-  span, .innerText > span {
-    @include padding-right(4px); // Add padding between text and hyperlink.
-  }
+.actionsOneline {
+  position: relative;
+  padding: 0px 8px;
 }
 
-// When we can have multiple lines in the message bar.
-.multiline > .content > .actionables {
-  flex-direction: column;
+.actionableOneline {
+  height: 48px;
+  .content {
+    .icon {
+      padding: 0px 16px;
+    }
+    .innerText {
+      @include padding-right(0px);
+    }
+  }
 }
 
-// When we should have only a single line of text in the message bar.
-.singleline {
+// Multi line specific attributes
+.multiline {
   .content {
-    .icon{
-      align-items: center;
-    }
+      padding-top: 16px;
+      flex-direction: row;
+      @include padding-left(16px);
 
-    .actionables > .text {
-      justify-content: center;
-      align-items: center;
+    .icon {
+      @include padding-right(8px);
+      font-family: 'FabricMDL2Icons';
+    }
 
-      .innerText,
-      .innerTextPadding {
-        max-height: 1.3em;
-        line-height: 1.3em;
-        overflow-x: hidden;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-      }
+    .innerText {
+      line-height: 16px; // Each line should add 16px to the height
     }
   }
 
-  .content > .actionables {
-    flex-direction: row;
+  .actions {
+    @include padding-right(12px);
+  }
+
+  .dismissal {
+    margin: 0px 12px;
   }
 }
 
-// Because of an odd behaviour in other CSS, ms-MessageBar--remove causes children's icons to use 8px, and not inherit.
-.root :global(.ms-Icon--Cancel) {
-  font-size: 14px;
+.multiline {
+  flex-direction: column;
 }
+
+.actionableMultiline.dismissalMultiline {
+  .innerTextPadding {
+    @include padding-right(48px);
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
index 123ca3f4da4c4..41690ab2bac90 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
@@ -73,7 +73,7 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
   }
 
   private _getDismissDiv(): JSX.Element {
-    if (this.props.onDismiss != null) {
+    if (this.props.onDismiss) {
       return (
         <IconButton
           disabled={ false }
@@ -87,6 +87,17 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
     return null;
   }
 
+  private _getDismissOneLine(): JSX.Element {
+    if (this.props.onDismiss) {
+      return (
+        <div className={ css('ms-MessageBar-dismissOneline', styles.dismissOneline) }>
+          { this._getDismissDiv() }
+        </div>
+      );
+    }
+    return null;
+  }
+
   private _getIconSpan(): JSX.Element {
     return (
       <div className={ css('ms-MessageBar-icon', styles.icon) }>
@@ -103,34 +114,42 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
   private _renderMultiLine(): React.ReactElement<React.HTMLProps<HTMLAreaElement>> {
     return (
       <div
-        className={ this._getClassName() + ' ms-MessageBar-multiline ' + styles.multiline }
+        className={
+          css(this._getClassName(),
+            'ms-MessageBar-multiline',
+            styles.multiline,
+            this.props.onDismiss && styles.dismissalMultiline,
+            this.props.actions && styles.actionableMultiline
+          )
+        }
         role='status'
         aria-live={ this._getAnnouncementPriority() }>
-        <div className={ css('ms-MessageBar-content', styles.content) }>
+        <div className={ css(styles.content, 'ms-MessageBar-content') }>
           { this._getIconSpan() }
-          <div className={ css('ms-MessageBar-actionables', styles.actionables) }>
-            { this._renderInnerText() }
-            { this._getActionsDiv() }
-            { this._getDismissDiv() }
-          </div>
+          { this._renderInnerText() }
+          { this._getDismissDiv() }
         </div>
-      </div>
+        { this._getActionsDiv() }
+      </div >
     );
   }
 
   private _renderSingleLine(): React.ReactElement<React.HTMLProps<HTMLAreaElement>> {
     return (
-      <div className={ this._getClassName() + ' ms-MessageBar-singleline ' + styles.singleline }>
-        <div className={ css('ms-MessageBar-content', styles.content) }>
+      <div className={
+        css(this._getClassName(),
+          'ms-MessageBar-singleline',
+          styles.singleline,
+          this.props.onDismiss && 'ms-MessageBar-dismissalOneline ' + styles.dismissalOneline,
+          this.props.actions && styles.actionableOneline
+        )
+      } >
+        <div className={ css(styles.content, 'ms-MessageBar-content') }>
           { this._getIconSpan() }
-          <div className={ css('ms-MessageBar-actionables', styles.actionables) }>
-            { this._renderInnerText() }
-          </div>
-          { this._getActionsDiv() }
-          <div className={ css('ms-MessageBar-dismissalOneline', styles.dismissalOneline) }>
-            { this._getDismissDiv() }
-          </div>
+          { this._renderInnerText() }
+          { this._getDismissOneLine() }
         </div>
+        { this._getActionsDiv() }
       </div >
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx
index aa9d08c26ddb0..c04737a043651 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx
@@ -12,20 +12,17 @@ export const MessageBarBasicExample = () => (
     <Label>Info/Default MessageBar</Label>
     <MessageBar>Info - lorem ipsum dolor sit amet, a elit sem interdum consectetur adipiscing elit. <Link href='www.bing.com'>Visit our website</Link></MessageBar>
 
-    <Label>Error MessageBar - only dismiss</Label>
+    <Label>Error MessageBar - only dismiss single line</Label>
     <MessageBar
       messageBarType={ MessageBarType.error }
+      isMultiline={ false }
       onDismiss={ () => { console.log('test'); } }>
       Error - lorem ipsum dolor sit amet, a elit sem interdum consectetur adipiscing elit. <Link href='www.bing.com'>Visit our website</Link></MessageBar>
-    <p>
-      Add a close box when the user can safely dismiss the message. They’ll want to do this to reclaim space or if they feel too disrupted.
-          </p>
 
-    <Label>Blocked MessageBar - single line</Label>
+    <Label>Blocked MessageBar - single line no buttons</Label>
     <MessageBar messageBarType={ MessageBarType.blocked }
-      onDismiss={ () => { console.log('test'); } }
       isMultiline={ false }
-      actions={ <div><DefaultButton>Yes</DefaultButton><DefaultButton>No</DefaultButton></div> }>
+      onDismiss={ () => { console.log('test'); } }>
       Blocked - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi luctus, purus a lobortis tristique, odio augue pharetra metus, ac placerat nunc mi nec dui. Vestibulum aliquam et nunc semper scelerisque. Curabitur vitae orci nec quam condimentum porttitor et sed lacus. Vivamus ac efficitur leo. Cras faucibus mauris libero, ac placerat erat euismod et. Donec pulvinar commodo odio sit amet faucibus. In hac habitasse platea dictumst. Duis eu ante commodo, condimentum nibh pellentesque, laoreet enim. Fusce massa lorem, ultrices eu mi a, fermentum suscipit magna. Integer porta purus pulvinar, hendrerit felis eget, condimentum mauris. <Link href='www.bing.com'>Visit our website</Link></MessageBar>
 
     <Label>SevereWarning MessageBar - multiline (default)</Label>
@@ -41,7 +38,7 @@ export const MessageBarBasicExample = () => (
       <Link href='www.bing.com'>Visit our website</Link>
     </MessageBar>
 
-    <Label>Success MessageBar - single line, long text with buttons</Label>
+    <Label>Success MessageBar - single line, short text with buttons</Label>
     <MessageBar
       actions={
         <div>

From b3a628d9a839d683af28dad8b27f06dde49bb55b Mon Sep 17 00:00:00 2001
From: Michael Loughry <miclo@microsoft.com>
Date: Thu, 1 Jun 2017 09:16:32 -0700
Subject: [PATCH 0052/1641] Fix TSLint error that is blocking publish (#1912)

---
 .../src/components/FocusTrapZone/FocusTrapZone.tsx              | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
index 5f2f33e4a0348..05cb9b11c8e18 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
@@ -57,7 +57,7 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
   public componentWillUnmount() {
     let { ignoreExternalFocusing, elementToFocusOnDismiss } = this.props;
 
-    this._previouslyFocusedElement = elementToFocusOnDismiss ? elementToFocusOnDismiss : document.activeElement as HTMLElement
+    this._previouslyFocusedElement = elementToFocusOnDismiss ? elementToFocusOnDismiss : document.activeElement as HTMLElement;
 
     this._events.dispose();
     if (this._isInFocusStack || this._isInClickStack) {

From 846245372033da09c5019f6af9c0272f3d72c986 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 1 Jun 2017 09:34:04 -0700
Subject: [PATCH 0053/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 18 ++++++
 apps/fabric-website/CHANGELOG.md              |  7 ++-
 apps/fabric-website/package.json              |  8 +--
 .../utilities/ssr_2017-06-01-05-06.json       | 11 ----
 .../accessibility_2017-05-05-20-51.json       | 15 -----
 ...ecked-hovered-styles_2017-06-01-00-44.json | 11 ----
 .../fix-dl-column_2017-05-31-06-44.json       | 11 ----
 ...sage-bar-single-line_2017-05-31-15-57.json | 11 ----
 ...panel-fix-large-size_2017-06-01-02-48.json | 11 ----
 ...group-initial-render_2017-05-31-19-59.json | 11 ----
 ...ixFocusTrapZoneIssue_2017-05-31-22-14.json | 11 ----
 packages/example-app-base/CHANGELOG.json      | 15 +++++
 packages/example-app-base/CHANGELOG.md        |  7 ++-
 packages/example-app-base/package.json        |  6 +-
 packages/example-component/package.json       |  8 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 57 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 18 +++++-
 packages/office-ui-fabric-react/package.json  |  8 +--
 packages/styling/CHANGELOG.json               | 12 ++++
 packages/styling/CHANGELOG.md                 |  7 ++-
 packages/styling/package.json                 |  4 +-
 packages/utilities/CHANGELOG.json             | 19 +++++++
 packages/utilities/CHANGELOG.md               | 10 +++-
 packages/utilities/package.json               |  2 +-
 24 files changed, 183 insertions(+), 115 deletions(-)
 delete mode 100644 common/changes/@uifabric/utilities/ssr_2017-06-01-05-06.json
 delete mode 100644 common/changes/accessibility_2017-05-05-20-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/checked-hovered-styles_2017-06-01-00-44.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-dl-column_2017-05-31-06-44.json
 delete mode 100644 common/changes/office-ui-fabric-react/juwar-message-bar-single-line_2017-05-31-15-57.json
 delete mode 100644 common/changes/office-ui-fabric-react/panel-fix-large-size_2017-06-01-02-48.json
 delete mode 100644 common/changes/office-ui-fabric-react/resize-group-initial-render_2017-05-31-19-59.json
 delete mode 100644 common/changes/office-ui-fabric-react/zoarif-FixFocusTrapZoneIssue_2017-05-31-22-14.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index d1793698893fd..dd2c901661870 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,24 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.5.30",
+      "tag": "@uifabric/fabric-website_v4.5.30",
+      "date": "Thu, 01 Jun 2017 16:34:03 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `2.0.2` to `2.0.3`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.1.1 <5.0.0` to `>=4.2.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.0.0 <5.0.0` to `>=4.0.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.5.29",
       "tag": "@uifabric/fabric-website_v4.5.29",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index c7f97850e5ca1..7d4a1d08c08d3 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Wed, 31 May 2017 01:58:23 GMT and should not be manually modified.
+This log was last generated on Thu, 01 Jun 2017 16:34:03 GMT and should not be manually modified.
+
+## 4.5.30
+Thu, 01 Jun 2017 16:34:03 GMT
+
+*Changes not tracked*
 
 ## 4.5.29
 Wed, 31 May 2017 01:58:23 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 43687e963de44..8f500ac3f44ae 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.5.29",
+  "version": "4.5.30",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,12 +47,12 @@
     "webpack-bundle-analyzer": "^2.2.1"
   },
   "dependencies": {
-    "@uifabric/example-app-base": "2.0.2",
+    "@uifabric/example-app-base": "2.0.3",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=4.1.1 <5.0.0",
-    "@uifabric/utilities": ">=4.0.0 <5.0.0"
+    "office-ui-fabric-react": ">=4.2.0 <5.0.0",
+    "@uifabric/utilities": ">=4.0.1 <5.0.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/ssr_2017-06-01-05-06.json b/common/changes/@uifabric/utilities/ssr_2017-06-01-05-06.json
deleted file mode 100644
index f2581bc7a9cf7..0000000000000
--- a/common/changes/@uifabric/utilities/ssr_2017-06-01-05-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "getDocument/getWindow: now checks for doc/win undefined before accessing, making them ssr happy.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/accessibility_2017-05-05-20-51.json b/common/changes/accessibility_2017-05-05-20-51.json
deleted file mode 100644
index 64b7f2cd9bae4..0000000000000
--- a/common/changes/accessibility_2017-05-05-20-51.json
+++ /dev/null
@@ -1,15 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Update DetailsList to support screen readers with cleaner keyboarding flow",
-      "type": "minor"
-    },
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Update Focus handling to suport immediately-nested focus zones",
-      "type": "patch"
-    }
-  ],
-  "email": "tmichon@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/checked-hovered-styles_2017-06-01-00-44.json b/common/changes/office-ui-fabric-react/checked-hovered-styles_2017-06-01-00-44.json
deleted file mode 100644
index 78d964e3909bd..0000000000000
--- a/common/changes/office-ui-fabric-react/checked-hovered-styles_2017-06-01-00-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Styling: Add support for overriding the styles on the checked hovered, checked pressed, and checked disabled states",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chrisgo@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/fix-dl-column_2017-05-31-06-44.json b/common/changes/office-ui-fabric-react/fix-dl-column_2017-05-31-06-44.json
deleted file mode 100644
index f204c5aa9b721..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-dl-column_2017-05-31-06-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: Last column measured correctly when `checkboxVisibility` set to `hidden`.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@hotmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/juwar-message-bar-single-line_2017-05-31-15-57.json b/common/changes/office-ui-fabric-react/juwar-message-bar-single-line_2017-05-31-15-57.json
deleted file mode 100644
index a7997a819a4a2..0000000000000
--- a/common/changes/office-ui-fabric-react/juwar-message-bar-single-line_2017-05-31-15-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix css for MessageBar, and support single line message bar styling",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "juwar@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/panel-fix-large-size_2017-06-01-02-48.json b/common/changes/office-ui-fabric-react/panel-fix-large-size_2017-06-01-02-48.json
deleted file mode 100644
index b94a056d50f0f..0000000000000
--- a/common/changes/office-ui-fabric-react/panel-fix-large-size_2017-06-01-02-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Panel: fix regression in large Panel size",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/resize-group-initial-render_2017-05-31-19-59.json b/common/changes/office-ui-fabric-react/resize-group-initial-render_2017-05-31-19-59.json
deleted file mode 100644
index a6b2c4ea88d34..0000000000000
--- a/common/changes/office-ui-fabric-react/resize-group-initial-render_2017-05-31-19-59.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ResizeGroup: Make sure that it renders contents when there are no more scaling steps and it doesn't fit",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chrisgo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/zoarif-FixFocusTrapZoneIssue_2017-05-31-22-14.json b/common/changes/office-ui-fabric-react/zoarif-FixFocusTrapZoneIssue_2017-05-31-22-14.json
deleted file mode 100644
index fb0d37112d6b9..0000000000000
--- a/common/changes/office-ui-fabric-react/zoarif-FixFocusTrapZoneIssue_2017-05-31-22-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Update elementToFocusOnDismiss on unmount in focus trap zone",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "zoarif@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 9900eee872112..d62b18eeef653 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,21 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "2.0.3",
+      "tag": "@uifabric/example-app-base_v2.0.3",
+      "date": "Thu, 01 Jun 2017 16:34:03 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.4.1 <1.0.0` to `>=0.4.2 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.0.0 <5.0.0` to `>=4.0.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "2.0.2",
       "tag": "@uifabric/example-app-base_v2.0.2",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index 74e1468635d9d..0a9399d310212 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Wed, 31 May 2017 01:58:23 GMT and should not be manually modified.
+This log was last generated on Thu, 01 Jun 2017 16:34:03 GMT and should not be manually modified.
+
+## 2.0.3
+Thu, 01 Jun 2017 16:34:03 GMT
+
+*Changes not tracked*
 
 ## 2.0.2
 Wed, 31 May 2017 01:58:23 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index d4fa4fefb45da..3f57be894cdb8 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "2.0.2",
+  "version": "2.0.3",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -40,8 +40,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.4.1 <1.0.0",
-    "@uifabric/utilities": ">=4.0.0 <5.0.0",
+    "@uifabric/styling": ">=0.4.2 <1.0.0",
+    "@uifabric/utilities": ">=4.0.1 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
     "office-ui-fabric-react": ">=2.0.0 <3.0.0"
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 1bc154f955031..f0514b3e3f353 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-component",
-  "version": "1.0.28",
+  "version": "1.0.29",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -21,8 +21,8 @@
     "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "2.0.2",
-    "@uifabric/utilities": "4.0.0",
+    "@uifabric/example-app-base": "2.0.3",
+    "@uifabric/utilities": "4.0.1",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -49,6 +49,6 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.1.1 <5.0.0"
+    "office-ui-fabric-react": ">=4.2.0 <5.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 09969f66a5ac0..91132315fd190 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,63 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.2.0",
+      "tag": "office-ui-fabric-react_v4.2.0",
+      "date": "Thu, 01 Jun 2017 16:34:03 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "90ef0576bb0f68a3a157176937b9ad5cc1797730",
+            "comment": "Update DetailsList to support screen readers with cleaner keyboarding flow"
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "62299239afdb7a082c9abd7c984d5f587b998abb",
+            "comment": "Styling: Add support for overriding the styles on the checked hovered, checked pressed, and checked disabled states"
+          },
+          {
+            "author": "zoarif <zoarif@microsoft.com>",
+            "commit": "7acff7237b6eaaa5106b73559496d2cb779baace",
+            "comment": "Update elementToFocusOnDismiss on unmount in focus trap zone"
+          }
+        ],
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "b61038339aa141659bba37a86b3127c2a389b92a",
+            "comment": "DetailsList: Last column measured correctly when `checkboxVisibility` set to `hidden`."
+          },
+          {
+            "author": "Justin Warner <warner.73@wright.edu>",
+            "commit": "f4e40fcbd0bb3e1cfdd494076a55a16a815bed16",
+            "comment": "Fix css for MessageBar, and support single line message bar styling"
+          },
+          {
+            "author": "Michael Loughry <miclo@microsoft.com>",
+            "commit": "ddab4eb3a90a6063efb745345348520f1972cbc5",
+            "comment": "Panel: fix regression in large Panel size"
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "c6b411ecbac8c9c678c551565021a37978a82356",
+            "comment": "ResizeGroup: Make sure that it renders contents when there are no more scaling steps and it doesn't fit"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.0.0 <5.0.0` to `>=4.0.1 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.4.1 <1.0.0` to `>=0.4.2 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `2.0.2` to `2.0.3`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.1.1",
       "tag": "office-ui-fabric-react_v4.1.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 2af470ec2a04d..9ce9a163ee432 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,22 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 31 May 2017 01:58:23 GMT and should not be manually modified.
+This log was last generated on Thu, 01 Jun 2017 16:34:03 GMT and should not be manually modified.
+
+## 4.2.0
+Thu, 01 Jun 2017 16:34:03 GMT
+
+### Minor changes
+
+- Update DetailsList to support screen readers with cleaner keyboarding flow
+- Styling: Add support for overriding the styles on the checked hovered, checked pressed, and checked disabled states
+- Update elementToFocusOnDismiss on unmount in focus trap zone
+
+### Patches
+
+- DetailsList: Last column measured correctly when `checkboxVisibility` set to `hidden`.
+- Fix css for MessageBar, and support single line message bar styling
+- Panel: fix regression in large Panel size
+- ResizeGroup: Make sure that it renders contents when there are no more scaling steps and it doesn't fit
 
 ## 4.1.1
 Wed, 31 May 2017 01:58:23 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index dabe32792057d..b5776c54282b7 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.1.1",
+  "version": "4.2.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "^2.2.2",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "2.0.2",
+    "@uifabric/example-app-base": "2.0.3",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -71,8 +71,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.0.0 <5.0.0",
-    "@uifabric/styling": ">=0.4.1 <1.0.0",
+    "@uifabric/utilities": ">=4.0.1 <5.0.0",
+    "@uifabric/styling": ">=0.4.2 <1.0.0",
     "prop-types": "^15.5.10"
   },
   "peerDependencies": {
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 2c3dc9f0fd25d..eeb49e572cd4a 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,18 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.4.2",
+      "tag": "@uifabric/styling_v0.4.2",
+      "date": "Thu, 01 Jun 2017 16:34:03 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.0.0 <5.0.0` to `>=4.0.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.4.1",
       "tag": "@uifabric/styling_v0.4.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index ecefdc2bf886a..7047b6f3ddc03 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Wed, 31 May 2017 01:58:23 GMT and should not be manually modified.
+This log was last generated on Thu, 01 Jun 2017 16:34:03 GMT and should not be manually modified.
+
+## 0.4.2
+Thu, 01 Jun 2017 16:34:03 GMT
+
+*Changes not tracked*
 
 ## 0.4.1
 Wed, 31 May 2017 01:58:23 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 79cde78598bdf..557683bf3af30 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.4.1",
+  "version": "0.4.2",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
     "webpack-split-by-path": "2.0.0"
   },
   "dependencies": {
-    "@uifabric/utilities": ">=4.0.0 <5.0.0",
+    "@uifabric/utilities": ">=4.0.1 <5.0.0",
     "glamor": "^2.20.24",
     "rtl-css-js": "^1.1.0"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 1120a96205755..3d74bc340c0d8 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.0.1",
+      "tag": "@uifabric/utilities_v4.0.1",
+      "date": "Thu, 01 Jun 2017 16:34:03 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "262f85869f3c6b60fc403ab720e95f6687f8e0e0",
+            "comment": "getDocument/getWindow: now checks for doc/win undefined before accessing, making them ssr happy."
+          },
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "90ef0576bb0f68a3a157176937b9ad5cc1797730",
+            "comment": "Update Focus handling to suport immediately-nested focus zones"
+          }
+        ]
+      }
+    },
     {
       "version": "4.0.0",
       "tag": "@uifabric/utilities_v4.0.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index dab34a6689b25..40468c9735d60 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Tue, 30 May 2017 03:27:20 GMT and should not be manually modified.
+This log was last generated on Thu, 01 Jun 2017 16:34:03 GMT and should not be manually modified.
+
+## 4.0.1
+Thu, 01 Jun 2017 16:34:03 GMT
+
+### Patches
+
+- getDocument/getWindow: now checks for doc/win undefined before accessing, making them ssr happy.
+- Update Focus handling to suport immediately-nested focus zones
 
 ## 4.0.0
 Tue, 30 May 2017 03:27:20 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index f3bf4ac12f364..d8d5e24e334b7 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.0.0",
+  "version": "4.0.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From dcecdfb37d4fbe87a3755ed42320ce81bddcade8 Mon Sep 17 00:00:00 2001
From: zoarif <zoarif@microsoft.com>
Date: Thu, 1 Jun 2017 17:55:06 -0700
Subject: [PATCH 0054/1641] Zoarif/fix focus trap zone focus regression (#1915)

* Fix focus trap zone regression

* change file

* Moving to component will receive props

* Fixing the comment
---
 ...usTrapZoneFocusRegression_2017-06-01-19-21.json | 11 +++++++++++
 .../src/components/FocusTrapZone/FocusTrapZone.tsx | 14 ++++++++++----
 2 files changed, 21 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/zoarif-FixFocusTrapZoneFocusRegression_2017-06-01-19-21.json

diff --git a/common/changes/office-ui-fabric-react/zoarif-FixFocusTrapZoneFocusRegression_2017-06-01-19-21.json b/common/changes/office-ui-fabric-react/zoarif-FixFocusTrapZoneFocusRegression_2017-06-01-19-21.json
new file mode 100644
index 0000000000000..9303fd77102c7
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/zoarif-FixFocusTrapZoneFocusRegression_2017-06-01-19-21.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixing an issue where restoring focus was not working due to a regression",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "zoarif@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
index 05cb9b11c8e18..713575c3db854 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
@@ -39,8 +39,9 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
   }
 
   public componentDidMount() {
-    let { isClickableOutsideFocusTrap = false, forceFocusInsideTrap = true } = this.props;
+    let { isClickableOutsideFocusTrap = false, forceFocusInsideTrap = true, elementToFocusOnDismiss } = this.props;
 
+    this._previouslyFocusedElement = elementToFocusOnDismiss ? elementToFocusOnDismiss : document.activeElement as HTMLElement;
     if (!elementContains(this.refs.root, this._previouslyFocusedElement)) {
       this.focus();
     }
@@ -54,10 +55,15 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
     }
   }
 
-  public componentWillUnmount() {
-    let { ignoreExternalFocusing, elementToFocusOnDismiss } = this.props;
+  public componentWillReceiveProps(nextProps: IFocusTrapZoneProps) {
+    let { elementToFocusOnDismiss } = nextProps;
+    if (elementToFocusOnDismiss && this._previouslyFocusedElement !== elementToFocusOnDismiss) {
+      this._previouslyFocusedElement = elementToFocusOnDismiss;
+    }
+  }
 
-    this._previouslyFocusedElement = elementToFocusOnDismiss ? elementToFocusOnDismiss : document.activeElement as HTMLElement;
+  public componentWillUnmount() {
+    let { ignoreExternalFocusing } = this.props;
 
     this._events.dispose();
     if (this._isInFocusStack || this._isInClickStack) {

From 9e146152b2fe14bd117a6601f3a5a0528942aa87 Mon Sep 17 00:00:00 2001
From: Junle Li <lijunle@gmail.com>
Date: Fri, 2 Jun 2017 08:56:01 +0800
Subject: [PATCH 0055/1641] Expose aria label prop in dropdown option. (#1910)

* Expose aria label prop in dropdown option.

* Run npm change.

* Update the rush change comment to follow pattern.
---
 .../dropdown-option-aria-label_2017-06-01-10-50.json  | 11 +++++++++++
 .../src/components/Dropdown/Dropdown.Props.ts         |  5 +++++
 .../src/components/Dropdown/Dropdown.tsx              |  2 +-
 3 files changed, 17 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/dropdown-option-aria-label_2017-06-01-10-50.json

diff --git a/common/changes/office-ui-fabric-react/dropdown-option-aria-label_2017-06-01-10-50.json b/common/changes/office-ui-fabric-react/dropdown-option-aria-label_2017-06-01-10-50.json
new file mode 100644
index 0000000000000..1b1ae7d183afa
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/dropdown-option-aria-label_2017-06-01-10-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: Expose aria label prop for the dropdown options.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lijunle@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
index f072181745de4..504f8f92a25ed 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
@@ -144,6 +144,11 @@ export interface IDropdownOption {
    */
   index?: number;
 
+  /**
+   * The aria label for the dropdown option. If not present, the `text` will be used.
+   */
+  ariaLabel?: string;
+
   /** If option is selected. */
   selected?: boolean;
 
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 9f7f8a52a32fc..e4642a6ef3a2c 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -332,7 +332,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
         onClick={ () => this._onItemClick(item.index) }
         role='option'
         aria-selected={ this.state.selectedIndex === item.index ? 'true' : 'false' }
-        ariaLabel={ item.text }
+        ariaLabel={ item.ariaLabel || item.text }
         title={ item.text }
       > { onRenderOption(item, this._onRenderOption) }</CommandButton>
     );

From b6b42af7b3501003e4b1fe545958db82201f1b40 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 2 Jun 2017 01:19:36 +0000
Subject: [PATCH 0056/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 15 +++++++++++
 apps/fabric-website/CHANGELOG.md              |  7 ++++-
 apps/fabric-website/package.json              |  6 ++---
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...wn-option-aria-label_2017-06-01-10-50.json | 11 --------
 ...pZoneFocusRegression_2017-06-01-19-21.json | 11 --------
 packages/example-app-base/CHANGELOG.json      | 12 +++++++++
 packages/example-app-base/CHANGELOG.md        |  7 ++++-
 packages/example-app-base/package.json        |  4 +--
 packages/example-component/package.json       |  6 ++---
 .../office-ui-fabric-react/CHANGELOG.json     | 27 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 ++++++-
 packages/office-ui-fabric-react/package.json  |  6 ++---
 packages/styling/CHANGELOG.json               |  6 +++++
 packages/styling/CHANGELOG.md                 |  7 ++++-
 packages/styling/package.json                 |  2 +-
 18 files changed, 102 insertions(+), 41 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/dropdown-option-aria-label_2017-06-01-10-50.json
 delete mode 100644 common/changes/office-ui-fabric-react/zoarif-FixFocusTrapZoneFocusRegression_2017-06-01-19-21.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index dd2c901661870..20c4c1953c613 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,21 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.5.31",
+      "tag": "@uifabric/fabric-website_v4.5.31",
+      "date": "Fri, 02 Jun 2017 01:19:36 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `2.0.3` to `2.0.4`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.2.0 <5.0.0` to `>=4.3.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.5.30",
       "tag": "@uifabric/fabric-website_v4.5.30",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 7d4a1d08c08d3..199db611c5b56 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Thu, 01 Jun 2017 16:34:03 GMT and should not be manually modified.
+This log was last generated on Fri, 02 Jun 2017 01:19:36 GMT and should not be manually modified.
+
+## 4.5.31
+Fri, 02 Jun 2017 01:19:36 GMT
+
+*Changes not tracked*
 
 ## 4.5.30
 Thu, 01 Jun 2017 16:34:03 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 8f500ac3f44ae..d8ec5bdf81843 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.5.30",
+  "version": "4.5.31",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,12 +47,12 @@
     "webpack-bundle-analyzer": "^2.2.1"
   },
   "dependencies": {
-    "@uifabric/example-app-base": "2.0.3",
+    "@uifabric/example-app-base": "2.0.4",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=4.2.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.3.0 <5.0.0",
     "@uifabric/utilities": ">=4.0.1 <5.0.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 72b7aa72b7516..eb8b5b91a1855 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -25,7 +25,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.1.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.3.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index f66f9661677f3..fb7f857da9723 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,6 +33,6 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.1.1 <5.0.0"
+    "office-ui-fabric-react": ">=4.3.0 <5.0.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index c9a8463507528..c744c77740002 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=4.1.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.3.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2"
diff --git a/common/changes/office-ui-fabric-react/dropdown-option-aria-label_2017-06-01-10-50.json b/common/changes/office-ui-fabric-react/dropdown-option-aria-label_2017-06-01-10-50.json
deleted file mode 100644
index 1b1ae7d183afa..0000000000000
--- a/common/changes/office-ui-fabric-react/dropdown-option-aria-label_2017-06-01-10-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: Expose aria label prop for the dropdown options.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lijunle@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/zoarif-FixFocusTrapZoneFocusRegression_2017-06-01-19-21.json b/common/changes/office-ui-fabric-react/zoarif-FixFocusTrapZoneFocusRegression_2017-06-01-19-21.json
deleted file mode 100644
index 9303fd77102c7..0000000000000
--- a/common/changes/office-ui-fabric-react/zoarif-FixFocusTrapZoneFocusRegression_2017-06-01-19-21.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixing an issue where restoring focus was not working due to a regression",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "zoarif@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index d62b18eeef653..6c459f816ffb8 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,18 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "2.0.4",
+      "tag": "@uifabric/example-app-base_v2.0.4",
+      "date": "Fri, 02 Jun 2017 01:19:36 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.4.2 <1.0.0` to `>=0.4.3 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "2.0.3",
       "tag": "@uifabric/example-app-base_v2.0.3",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index 0a9399d310212..9a4f4f6246fc6 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Thu, 01 Jun 2017 16:34:03 GMT and should not be manually modified.
+This log was last generated on Fri, 02 Jun 2017 01:19:36 GMT and should not be manually modified.
+
+## 2.0.4
+Fri, 02 Jun 2017 01:19:36 GMT
+
+*Changes not tracked*
 
 ## 2.0.3
 Thu, 01 Jun 2017 16:34:03 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 3f57be894cdb8..0fdf86199df51 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "2.0.3",
+  "version": "2.0.4",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -40,7 +40,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.4.2 <1.0.0",
+    "@uifabric/styling": ">=0.4.3 <1.0.0",
     "@uifabric/utilities": ">=4.0.1 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index f0514b3e3f353..a2b842338c40b 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-component",
-  "version": "1.0.29",
+  "version": "1.0.30",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -21,7 +21,7 @@
     "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "2.0.3",
+    "@uifabric/example-app-base": "2.0.4",
     "@uifabric/utilities": "4.0.1",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
@@ -49,6 +49,6 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.2.0 <5.0.0"
+    "office-ui-fabric-react": ">=4.3.0 <5.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 91132315fd190..f5c0a5c7d5148 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,33 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.3.0",
+      "tag": "office-ui-fabric-react_v4.3.0",
+      "date": "Fri, 02 Jun 2017 01:19:35 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Junle Li <lijunle@gmail.com>",
+            "commit": "9e146152b2fe14bd117a6601f3a5a0528942aa87",
+            "comment": "Dropdown: Expose aria label prop for the dropdown options."
+          },
+          {
+            "author": "zoarif <zoarif@microsoft.com>",
+            "commit": "dcecdfb37d4fbe87a3755ed42320ce81bddcade8",
+            "comment": "Fixing an issue where restoring focus was not working due to a regression"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.4.2 <1.0.0` to `>=0.4.3 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `2.0.3` to `2.0.4`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.2.0",
       "tag": "office-ui-fabric-react_v4.2.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 9ce9a163ee432..5f0bd40a8db5a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 01 Jun 2017 16:34:03 GMT and should not be manually modified.
+This log was last generated on Fri, 02 Jun 2017 01:19:36 GMT and should not be manually modified.
+
+## 4.3.0
+Fri, 02 Jun 2017 01:19:35 GMT
+
+### Minor changes
+
+- Dropdown: Expose aria label prop for the dropdown options.
+- Fixing an issue where restoring focus was not working due to a regression
 
 ## 4.2.0
 Thu, 01 Jun 2017 16:34:03 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index b5776c54282b7..f3a74082d9226 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.2.0",
+  "version": "4.3.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "^2.2.2",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "2.0.3",
+    "@uifabric/example-app-base": "2.0.4",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.0.1 <5.0.0",
-    "@uifabric/styling": ">=0.4.2 <1.0.0",
+    "@uifabric/styling": ">=0.4.3 <1.0.0",
     "prop-types": "^15.5.10"
   },
   "peerDependencies": {
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index eeb49e572cd4a..f03c7bfcc23e3 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.4.3",
+      "tag": "@uifabric/styling_v0.4.3",
+      "date": "Fri, 02 Jun 2017 01:19:36 GMT",
+      "comments": {}
+    },
     {
       "version": "0.4.2",
       "tag": "@uifabric/styling_v0.4.2",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 7047b6f3ddc03..0e586585c4e79 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 01 Jun 2017 16:34:03 GMT and should not be manually modified.
+This log was last generated on Fri, 02 Jun 2017 01:19:36 GMT and should not be manually modified.
+
+## 0.4.3
+Fri, 02 Jun 2017 01:19:36 GMT
+
+*Changes not tracked*
 
 ## 0.4.2
 Thu, 01 Jun 2017 16:34:03 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 557683bf3af30..b3f081995884c 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.4.2",
+  "version": "0.4.3",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From dfa4a3ef86bd908dfa4a6ecfa603d692466a2ee0 Mon Sep 17 00:00:00 2001
From: Aaron Zhou <aaronyzhou88@gmail.com>
Date: Thu, 1 Jun 2017 23:55:10 -0700
Subject: [PATCH 0057/1641] TextField: Show red border on error on textfield
 (#1898)

* Show red border on error on textfield

* Add rush change file
---
 .../textfieldErrorBorderFixes_2017-05-31-21-42.json   | 11 +++++++++++
 .../src/components/TextField/TextField.tsx            |  3 +--
 2 files changed, 12 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/textfieldErrorBorderFixes_2017-05-31-21-42.json

diff --git a/common/changes/office-ui-fabric-react/textfieldErrorBorderFixes_2017-05-31-21-42.json b/common/changes/office-ui-fabric-react/textfieldErrorBorderFixes_2017-05-31-21-42.json
new file mode 100644
index 0000000000000..6981934d3d660
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/textfieldErrorBorderFixes_2017-05-31-21-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "TextField: Show red border when invalid",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "aazhou@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index d6cf9c9098af3..b7f419fb619c8 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -155,7 +155,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
     return (
       <div className={ textFieldClassName }>
         { label && <Label htmlFor={ this._id }>{ label }</Label> }
-        <div className={ css(styles.fieldGroup, isFocused && styles.fieldGroupIsFocused) }>
+        <div className={ css(styles.fieldGroup, isFocused && styles.fieldGroupIsFocused, errorMessage && styles.invalid) }>
           { (addonString !== undefined || this.props.onRenderAddon) && (
             <div className={ css(styles.fieldAddon) }>
               { onRenderAddon(this.props, this._onRenderAddon) }
@@ -272,7 +272,6 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
     }
 
     return css(textFieldClassName, this.props.inputClassName, {
-      ['ms-TextField-invalid ' + styles.invalid]: !!errorMessage,
       [styles.hasIcon]: !!this.props.iconClass,
     });
   }

From ccf58fdb6d2448d60a9e0baf7057f8f2e57a4b29 Mon Sep 17 00:00:00 2001
From: Aaron Zhou <aaronyzhou88@gmail.com>
Date: Thu, 1 Jun 2017 23:56:04 -0700
Subject: [PATCH 0058/1641] DragDropHelper: Show firefox ghost when dragging
 (#1899)

* Show drag drop ghost on firefox

* Add changefile
---
 .../dragDropFirefoxGhost_2017-05-31-22-07.json        | 11 +++++++++++
 .../src/utilities/dragdrop/DragDropHelper.tsx         |  8 ++++++++
 2 files changed, 19 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/dragDropFirefoxGhost_2017-05-31-22-07.json

diff --git a/common/changes/office-ui-fabric-react/dragDropFirefoxGhost_2017-05-31-22-07.json b/common/changes/office-ui-fabric-react/dragDropFirefoxGhost_2017-05-31-22-07.json
new file mode 100644
index 0000000000000..2e72f46b46d2d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/dragDropFirefoxGhost_2017-05-31-22-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DragDropHelper: Fix to show ghost element when dragging on Firefox",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "aazhou@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/dragdrop/DragDropHelper.tsx b/packages/office-ui-fabric-react/src/utilities/dragdrop/DragDropHelper.tsx
index 14c2cbd810a08..b1ba91aa2cb7a 100644
--- a/packages/office-ui-fabric-react/src/utilities/dragdrop/DragDropHelper.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/dragdrop/DragDropHelper.tsx
@@ -72,6 +72,7 @@ export class DragDropHelper implements IDragDropHelper {
       eventName: string;
     }[] = [];
 
+    let onDragStart: (event: DragEvent) => void;
     let onDragLeave: (event: DragEvent) => void;
     let onDragEnter: (event: DragEvent) => void;
     let onDragEnd: (event: DragEvent) => void;
@@ -176,6 +177,12 @@ export class DragDropHelper implements IDragDropHelper {
         onMouseDown = this._onMouseDown.bind(this, dragDropTarget);
         onDragEnd = this._onDragEnd.bind(this, dragDropTarget);
 
+        // We need to add in data so that on Firefox we show the ghost element when dragging
+        onDragStart = (event: DragEvent) => {
+          event.dataTransfer.setData("id", root.id);
+        }
+
+        events.on(root, 'dragstart', onDragStart);
         events.on(root, 'mousedown', onMouseDown);
         events.on(root, 'dragend', onDragEnd);
       }
@@ -201,6 +208,7 @@ export class DragDropHelper implements IDragDropHelper {
             }
 
             if (isDraggable) {
+              events.off(root, 'dragstart', onDragStart);
               events.off(root, 'mousedown', onMouseDown);
               events.off(root, 'dragend', onDragEnd);
             }

From 2e2e9849cd715cabf19aa654df7115c8a00e9f78 Mon Sep 17 00:00:00 2001
From: dmarcey <demarcey@microsoft.com>
Date: Fri, 2 Jun 2017 12:56:49 -0400
Subject: [PATCH 0059/1641] Fixed a couple of imports in TagPicker examples
 that don't work with amd module resolution. (#1918)

---
 .../components/pickers/examples/Picker.CustomResult.Example.tsx | 2 +-
 .../src/components/pickers/examples/TagPicker.Basic.Example.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
index 32933f8a9e30a..0b27ee23511d9 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
@@ -16,7 +16,7 @@ import {
 } from 'office-ui-fabric-react/lib/DocumentCard';
 import { ImageFit } from 'office-ui-fabric-react/lib/Image';
 import { Persona, PersonaSize } from 'office-ui-fabric-react/lib/Persona';
-import { Checkbox } from 'office-ui-fabric-react/lib/components/Checkbox';
+import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import {
   IBasePickerProps,
   BasePickerListBelow,
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
index 7d63d3042ec24..21f24b995b1eb 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { TagPicker } from 'office-ui-fabric-react/lib/components/pickers/TagPicker/TagPicker';
-import { Checkbox } from 'office-ui-fabric-react/lib/components/Checkbox';
+import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { ITagPickerDemoPageState } from 'office-ui-fabric-react/lib/components/pickers/examples/ITagPickerDemoPageState';
 
 let _testTags = [

From 091ff0060056eaaf8c88fb6b27526379cbfa5ea3 Mon Sep 17 00:00:00 2001
From: Mike Wheaton <miwhea@microsoft.com>
Date: Mon, 5 Jun 2017 14:49:17 -0700
Subject: [PATCH 0060/1641] DragDropHelper: Fix TSLint warnings (#1922)

* Fix TSLint errors in DragDropHelper.tsx

* Add change file for PR
---
 ...miwhea-dragdrophelper-tslint_2017-06-02-20-06.json | 11 +++++++++++
 .../src/utilities/dragdrop/DragDropHelper.tsx         |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/miwhea-dragdrophelper-tslint_2017-06-02-20-06.json

diff --git a/common/changes/office-ui-fabric-react/miwhea-dragdrophelper-tslint_2017-06-02-20-06.json b/common/changes/office-ui-fabric-react/miwhea-dragdrophelper-tslint_2017-06-02-20-06.json
new file mode 100644
index 0000000000000..c3bb729f4ed23
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/miwhea-dragdrophelper-tslint_2017-06-02-20-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DragDropHelper: Fix TSLint warnings",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "miwhea@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/dragdrop/DragDropHelper.tsx b/packages/office-ui-fabric-react/src/utilities/dragdrop/DragDropHelper.tsx
index b1ba91aa2cb7a..ca8337c617487 100644
--- a/packages/office-ui-fabric-react/src/utilities/dragdrop/DragDropHelper.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/dragdrop/DragDropHelper.tsx
@@ -179,8 +179,8 @@ export class DragDropHelper implements IDragDropHelper {
 
         // We need to add in data so that on Firefox we show the ghost element when dragging
         onDragStart = (event: DragEvent) => {
-          event.dataTransfer.setData("id", root.id);
-        }
+          event.dataTransfer.setData('id', root.id);
+        };
 
         events.on(root, 'dragstart', onDragStart);
         events.on(root, 'mousedown', onMouseDown);

From cb407443e257121037ba57a6bc302f87e03eec9c Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 5 Jun 2017 16:02:47 -0700
Subject: [PATCH 0061/1641] Memoize: now friendlier with WeakMap missing.
 (#1937)

* Updating memoize to not fail in scenarios where it isn't implemented.

* Adding changefile.

* Updating test function.
---
 .../memoize-fix_2017-06-05-22-33.json         | 11 ++++++
 packages/utilities/api/utilities.api.ts       |  2 +
 packages/utilities/src/common/tests.js        |  3 --
 packages/utilities/src/memoize.test.ts        | 37 ++++++++++++++++---
 packages/utilities/src/memoize.ts             | 17 ++++++++-
 5 files changed, 60 insertions(+), 10 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/memoize-fix_2017-06-05-22-33.json

diff --git a/common/changes/@uifabric/utilities/memoize-fix_2017-06-05-22-33.json b/common/changes/@uifabric/utilities/memoize-fix_2017-06-05-22-33.json
new file mode 100644
index 0000000000000..6e4721194d450
--- /dev/null
+++ b/common/changes/@uifabric/utilities/memoize-fix_2017-06-05-22-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "memoize: returns the callback in scenarios where WeakMap isn't available.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/api/utilities.api.ts b/packages/utilities/api/utilities.api.ts
index 6d7157fda166e..d7a6c74ff9d23 100644
--- a/packages/utilities/api/utilities.api.ts
+++ b/packages/utilities/api/utilities.api.ts
@@ -338,6 +338,8 @@ class Rectangle {
   readonly width: number;
 }
 
+export function setMemoizeWeakMap(weakMap: any): void;
+
 export function setWarningCallback(warningCallback: (message: string) => void): void;
 
 export function unhoistMethods(source: any, methodNames: string[]): void;
diff --git a/packages/utilities/src/common/tests.js b/packages/utilities/src/common/tests.js
index 2670e405e5c9a..f2ee7d9123445 100644
--- a/packages/utilities/src/common/tests.js
+++ b/packages/utilities/src/common/tests.js
@@ -1,8 +1,5 @@
 'use strict';
 
-// Polyfills
-require('es6-weak-map/implement');
-
 /**
  * This is a test entry point to help karma-webpack find all tests in the project.
  **/
diff --git a/packages/utilities/src/memoize.test.ts b/packages/utilities/src/memoize.test.ts
index 917e85d115e60..7b1fe5e8518a9 100644
--- a/packages/utilities/src/memoize.test.ts
+++ b/packages/utilities/src/memoize.test.ts
@@ -1,11 +1,17 @@
-// Polyfills
-import 'es6-weak-map/implement';
-
-import { memoize, memoizeFunction } from './memoize';
+import { memoize, memoizeFunction, setMemoizeWeakMap } from './memoize';
+import * as weakMapPolyfill from 'es6-weak-map/polyfill';
 
 let { expect } = chai;
 
 describe('memoizeFunction', () => {
+  before(()=> {
+    setMemoizeWeakMap(weakMapPolyfill);
+  });
+
+  after(() => {
+    setMemoizeWeakMap(undefined);
+  });
+
   it('can return a cached result with a no args function', () => {
     let _timesCalled = 0;
     let memoizeFunctiondTimesCalled = memoizeFunction(() => ++_timesCalled);
@@ -89,6 +95,14 @@ describe('memoizeFunction', () => {
 });
 
 describe('memoize', () => {
+  before(()=> {
+    setMemoizeWeakMap(weakMapPolyfill);
+  });
+
+  after(() => {
+    setMemoizeWeakMap(undefined);
+  });
+
   it('can work on multiple instances of a class', () => {
     let _count = 0;
 
@@ -108,4 +122,17 @@ describe('memoize', () => {
     expect(f.bar('bye')).equals('bye1');
   });
 
-});
\ No newline at end of file
+});
+
+describe('memoizeFunctionWithoutPolyfill', () => {
+  it('passes through function without polyfill', () => {
+    let count = 0;
+    let func = memoizeFunction((
+      a: string
+    ) => a + count++, 1);
+
+    expect(func('a')).equals('a0');
+    expect(func('a')).equals('a1');
+    expect(func('a')).equals('a2');
+  });
+});
diff --git a/packages/utilities/src/memoize.ts b/packages/utilities/src/memoize.ts
index be5a7408a447e..3205cdbb69066 100644
--- a/packages/utilities/src/memoize.ts
+++ b/packages/utilities/src/memoize.ts
@@ -6,12 +6,18 @@ declare class WeakMap {
 
 const _emptyObject = { empty: true };
 const _dictionary = {};
+let _weakMap = (typeof WeakMap === 'undefined') ? null : WeakMap;
 
 interface IMemoizeNode {
   map: WeakMap;
   value?: any;
 }
 
+/** Test utility for providing a custom weakmap. */
+export function setMemoizeWeakMap(weakMap: any): void {
+  _weakMap = weakMap;
+}
+
 export function memoize<T extends Function>(
   target: any,
   key: string,
@@ -32,7 +38,9 @@ export function memoize<T extends Function>(
 /**
  * Memoizes a function; when you pass in the same parameters multiple times, it returns a cached result.
  * Be careful when passing in objects, you need to pass in the same INSTANCE for caching to work. Otherwise
- * it will grow the cache unnecessarily.
+ * it will grow the cache unnecessarily. Also avoid using default values that evaluate functions; passing in
+ * undefined for a value and relying on a default function will execute it the first time, but will not
+ * re-evaluate subsequent times which may have been unexpected.
  *
  * By default, the cache will reset after 100 permutations, to avoid abuse cases where the function is
  * unintendedly called with unique objects. Without a reset, the cache could grow infinitely, so we safeguard
@@ -50,6 +58,11 @@ export function memoizeFunction<T extends (...args: any[]) => RET_TYPE, RET_TYPE
   let rootNode: any;
   let cacheSize = 0;
 
+  // Avoid breaking scenarios which don't have weak map.
+  if (!_weakMap) {
+    return cb;
+  }
+
   // tslint:disable-next-line:no-function-expression
   return function memoizedFunction(...args: any[]): RET_TYPE {
     let currentNode: any = rootNode;
@@ -95,6 +108,6 @@ function _normalizeArg(val: any) {
 
 function _createNode(): IMemoizeNode {
   return {
-    map: new WeakMap()
+    map: new _weakMap()
   };
 }

From 90b3bd39868d4576bfadb0a339370934a6d42d3a Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Mon, 5 Jun 2017 16:48:40 -0700
Subject: [PATCH 0062/1641] ExampleApp: Allow the header links and name to be
 passed in as optional params to createApp (#1939)

* Add the ability to optionally pass in the app title and header links for createApp

* Rush change
---
 .../create-app-params_2017-06-05-23-32.json      | 11 +++++++++++
 .../create-app-params_2017-06-05-23-32.json      | 11 +++++++++++
 .../example-app-base/src/utilities/createApp.tsx | 16 +++++++++++++---
 3 files changed, 35 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/create-app-params_2017-06-05-23-32.json
 create mode 100644 common/changes/@uifabric/utilities/create-app-params_2017-06-05-23-32.json

diff --git a/common/changes/@uifabric/example-app-base/create-app-params_2017-06-05-23-32.json b/common/changes/@uifabric/example-app-base/create-app-params_2017-06-05-23-32.json
new file mode 100644
index 0000000000000..2c1754839c580
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/create-app-params_2017-06-05-23-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Add the ability to optionally pass in the app title and header links for createApp",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "chrisgo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/create-app-params_2017-06-05-23-32.json b/common/changes/@uifabric/utilities/create-app-params_2017-06-05-23-32.json
new file mode 100644
index 0000000000000..36952670e611f
--- /dev/null
+++ b/common/changes/@uifabric/utilities/create-app-params_2017-06-05-23-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "chrisgo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/src/utilities/createApp.tsx b/packages/example-app-base/src/utilities/createApp.tsx
index c17e34da448e7..49c502e3dbfc8 100644
--- a/packages/example-app-base/src/utilities/createApp.tsx
+++ b/packages/example-app-base/src/utilities/createApp.tsx
@@ -2,14 +2,14 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import * as ReactDOM from 'react-dom';
-import { App, IAppDefinition } from '../components/App/App';
+import { App, IAppDefinition, IAppLink } from '../components/App/App';
 import { Router, Route } from 'office-ui-fabric-react/lib/utilities/router/index';
 import { setBaseUrl } from 'office-ui-fabric-react/lib/Utilities';
 import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
 
 import { ExampleGroup, IExample } from './examplesOf';
 
-export function createApp(examples: ExampleGroup | ExampleGroup[], hideChrome?: boolean) {
+export function createApp(examples: ExampleGroup | ExampleGroup[], hideChrome?: boolean, appTitle?: string, headerLinks?: IAppLink[]) {
   let rootElement: HTMLElement | null;
   let groups: ExampleGroup[] = !Array.isArray(examples) ? [examples] : examples;
 
@@ -28,13 +28,23 @@ export function createApp(examples: ExampleGroup | ExampleGroup[], hideChrome?:
         />
       )));
 
+    let appDefinition = _getDefinition(groups);
+
+    if (appTitle) {
+      appDefinition.appTitle = appTitle;
+    }
+
+    if (headerLinks) {
+      appDefinition.headerLinks = headerLinks;
+    }
+
     ReactDOM.render(
       <Fabric>
         <Router>
           <Route key='minimal' path='?minimal' component={ (props) => <div { ...props } /> }>
             { routes }
           </Route>
-          <Route key={ 'app' } component={ (props) => <App appDefinition={ _getDefinition(groups) } { ...props } /> }>
+          <Route key={ 'app' } component={ (props) => <App appDefinition={ appDefinition } { ...props } /> }>
             { routes }
           </Route>
         </Router>

From b3bcac1b06db37dbce0aefbdceece9d8ebb4b3f5 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 5 Jun 2017 17:05:31 -0700
Subject: [PATCH 0063/1641] Updating customizer to work well with theming.
 Adding test.

---
 packages/utilities/api/utilities.api.ts      | 12 ++++++
 packages/utilities/src/Customizer.tsx        | 40 +++++++++++++++++++-
 packages/utilities/src/customizable.test.tsx | 38 +++++++++++++++++++
 packages/utilities/src/customizable.tsx      | 36 +++++++++++++++---
 4 files changed, 119 insertions(+), 7 deletions(-)
 create mode 100644 packages/utilities/src/customizable.test.tsx

diff --git a/packages/utilities/api/utilities.api.ts b/packages/utilities/api/utilities.api.ts
index d7a6c74ff9d23..887e90b8309f3 100644
--- a/packages/utilities/api/utilities.api.ts
+++ b/packages/utilities/api/utilities.api.ts
@@ -50,12 +50,18 @@ class BaseComponent<P extends IBaseProps, S> extends React.Component<P, S> {
 
 // WARNING: contextTypes has incomplete type information
 // WARNING: childContextTypes has incomplete type information
+// WARNING: setDefault has incomplete type information
+// WARNING: getDefault has incomplete type information
 // WARNING: __constructor has incomplete type information
 // WARNING: componentWillReceiveProps has incomplete type information
 // WARNING: render has incomplete type information
 class Customizer extends BaseComponent<ICustomizerProps, ICustomizerState> {
+  // (undocumented)
+  public static addChangeListener(onChanged: IChangeListener): void;
   // (undocumented)
   public getChildContext(): any;
+  // (undocumented)
+  public static removeChangeListener(onChanged: IChangeListener): void;
 }
 
 // WARNING: defaultProps has incomplete type information
@@ -152,6 +158,12 @@ interface IBaseProps {
   componentRef?: any;
 }
 
+// (undocumented)
+interface IChangeListener {
+  // (undocumented)
+  (propName?: string): void;
+}
+
 // (undocumented)
 interface ICustomizerProps {
   // (undocumented)
diff --git a/packages/utilities/src/Customizer.tsx b/packages/utilities/src/Customizer.tsx
index fad3696d1bd60..21ae8dd851617 100644
--- a/packages/utilities/src/Customizer.tsx
+++ b/packages/utilities/src/Customizer.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import * as PropTypes from 'prop-types';
 import { BaseComponent } from './BaseComponent';
-import { assign } from './object';
 
 export interface ISettings {
   [key: string]: any;
@@ -15,6 +14,13 @@ export interface ICustomizerState {
   injectedProps?: ISettings;
 }
 
+export interface IChangeListener {
+  (propName?: string): void;
+}
+
+let _defaultValues: { [key: string]: any } = {};
+let _changeListeners: IChangeListener[] = [];
+
 /**
  * The Customizer component allows for default props to be mixed into components which
  * are decorated with the customizable() decorator. This enables injection scenarios like:
@@ -32,6 +38,33 @@ export class Customizer extends BaseComponent<ICustomizerProps, ICustomizerState
 
   public static childContextTypes = Customizer.contextTypes;
 
+  public static setDefault(name, value): void {
+    _defaultValues[name] = value;
+    Customizer._change(name);
+  }
+
+  public static getDefault(fieldName) {
+    return _defaultValues[fieldName];
+  }
+
+  public static addChangeListener(onChanged: IChangeListener): void {
+    _changeListeners.push(onChanged);
+  }
+
+  public static removeChangeListener(onChanged: IChangeListener): void {
+    let index = _changeListeners.indexOf(onChanged);
+
+    if (index >= 0) {
+      _changeListeners.splice(index, 1);
+    }
+  }
+
+  private static _change(propName: string) {
+    for (let onChanged of _changeListeners) {
+      onChanged(propName);
+    }
+  }
+
   constructor(props, context) {
     super(props);
 
@@ -56,7 +89,10 @@ export class Customizer extends BaseComponent<ICustomizerProps, ICustomizerState
     let { injectedProps: injectedPropsFromContext = {} as ISettings } = context;
 
     return {
-      injectedProps: assign({}, injectedPropsFromContext, injectedPropsFromSettings)
+      injectedProps: {
+        ...injectedPropsFromContext,
+        ...injectedPropsFromSettings
+      }
     };
   }
 }
diff --git a/packages/utilities/src/customizable.test.tsx b/packages/utilities/src/customizable.test.tsx
new file mode 100644
index 0000000000000..41454c8afed01
--- /dev/null
+++ b/packages/utilities/src/customizable.test.tsx
@@ -0,0 +1,38 @@
+import * as React from 'react';
+import * as ReactDOM from 'react-dom/server';
+import { customizable } from './customizable';
+import { Customizer } from './Customizer';
+
+let { expect } = chai;
+
+@customizable(['name', 'name2'])
+class Foo extends React.Component<{ field: string; }, {}> {
+  public name: any;
+
+  public render() {
+    return <div>{ this.props[this.props.field] }</div>;
+  }
+}
+
+describe('customizable', () => {
+
+  it('can inject customizations', () => {
+    Customizer.setDefault('name', 'defaultName');
+
+    expect(ReactDOM.renderToStaticMarkup(<Foo field='name' />)).equals('<div>defaultName</div>');
+    expect(ReactDOM.renderToStaticMarkup(<Foo field='name2' />)).equals('<div></div>');
+
+    expect(ReactDOM.renderToStaticMarkup(
+      <Customizer settings={ { name: 'customName' } }>
+        <Foo field='name' />
+      </Customizer>
+    )).equals('<div>customName</div>');
+
+    expect(ReactDOM.renderToStaticMarkup(
+      <Customizer settings={ { name2: 'customName' } }>
+        <Foo field='name2' />
+      </Customizer>
+    )).equals('<div>customName</div>');
+  });
+
+});
diff --git a/packages/utilities/src/customizable.tsx b/packages/utilities/src/customizable.tsx
index 3042fb97181aa..6b5400a9a6e4c 100644
--- a/packages/utilities/src/customizable.tsx
+++ b/packages/utilities/src/customizable.tsx
@@ -1,7 +1,8 @@
 import * as React from 'react';
 import * as PropTypes from 'prop-types';
+import { Customizer } from './Customizer';
 
-export function customizable<P>(componentName?: string) {
+export function customizable<P>(fields: string[]) {
   return function customizableFactory<P, S>(
     ComposedComponent: (new (props: P, ...args: any[]) => React.Component<P, S>)
   ): any {
@@ -10,15 +11,40 @@ export function customizable<P>(componentName?: string) {
         injectedProps: PropTypes.object
       };
 
+      constructor(props: P, context: any) {
+        super(props, context);
+
+        this._onSettingChanged = this._onSettingChanged.bind(this);
+      }
+
+      public componentDidMount() {
+        Customizer.addChangeListener(this._onSettingChanged);
+      }
+
+      public componentWillUnmount() {
+        Customizer.removeChangeListener(this._onSettingChanged);
+      }
+
       public render() {
-        let defaultProps = ((this.context.injectedProps) ?
-          this.context.injectedProps[componentName] :
-          null) || {};
+        let defaultProps = {};
+
+        for (let propName of fields) {
+          defaultProps[propName] = (this.context.injectedProps) ?
+            this.context.injectedProps[propName] :
+            Customizer.getDefault(propName);
+        }
 
         return (
-          <ComposedComponent { ...defaultProps } { ...this.props } />
+          <ComposedComponent { ...defaultProps } { ...this.props as any } />
         );
       }
+
+      private _onSettingChanged(name: string) {
+        if (fields.indexOf(name) >= 0) {
+          this.forceUpdate();
+        }
+      }
+
     };
   };
 }

From e438887c9dae97c60ab694e2918b4f33cf044f3e Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 5 Jun 2017 17:10:44 -0700
Subject: [PATCH 0064/1641] Updating documentation and typings.

---
 packages/utilities/api/utilities.api.ts |  6 ++----
 packages/utilities/src/Customizer.tsx   | 21 ++++++++++++++++-----
 2 files changed, 18 insertions(+), 9 deletions(-)

diff --git a/packages/utilities/api/utilities.api.ts b/packages/utilities/api/utilities.api.ts
index 887e90b8309f3..7780172e49b96 100644
--- a/packages/utilities/api/utilities.api.ts
+++ b/packages/utilities/api/utilities.api.ts
@@ -50,18 +50,16 @@ class BaseComponent<P extends IBaseProps, S> extends React.Component<P, S> {
 
 // WARNING: contextTypes has incomplete type information
 // WARNING: childContextTypes has incomplete type information
-// WARNING: setDefault has incomplete type information
-// WARNING: getDefault has incomplete type information
 // WARNING: __constructor has incomplete type information
 // WARNING: componentWillReceiveProps has incomplete type information
 // WARNING: render has incomplete type information
 class Customizer extends BaseComponent<ICustomizerProps, ICustomizerState> {
-  // (undocumented)
   public static addChangeListener(onChanged: IChangeListener): void;
   // (undocumented)
   public getChildContext(): any;
-  // (undocumented)
+  public static getDefault(fieldName: string): any;
   public static removeChangeListener(onChanged: IChangeListener): void;
+  public static setDefault(name: string, value: any): void;
 }
 
 // WARNING: defaultProps has incomplete type information
diff --git a/packages/utilities/src/Customizer.tsx b/packages/utilities/src/Customizer.tsx
index 21ae8dd851617..d7b576f3bb161 100644
--- a/packages/utilities/src/Customizer.tsx
+++ b/packages/utilities/src/Customizer.tsx
@@ -28,8 +28,8 @@ let _changeListeners: IChangeListener[] = [];
  * 1. render svg icons instead of the icon font within all buttons
  * 2. inject a custom theme object into a component
  *
- * Props are provided via the settings prop, which should be a json map where the key is
- * the name of the customizable component, and the value is are the props to pass in.
+ * Props are provided via the settings prop, which should be a json map which contains 1 or more
+ * name/value pairs representing injectable props.
  */
 export class Customizer extends BaseComponent<ICustomizerProps, ICustomizerState> {
   public static contextTypes = {
@@ -38,19 +38,31 @@ export class Customizer extends BaseComponent<ICustomizerProps, ICustomizerState
 
   public static childContextTypes = Customizer.contextTypes;
 
-  public static setDefault(name, value): void {
+  /**
+   * Sets a default value for the given field.
+   */
+  public static setDefault(name: string, value: any): void {
     _defaultValues[name] = value;
     Customizer._change(name);
   }
 
-  public static getDefault(fieldName) {
+  /**
+   * Gets the current default value for a given field.
+   */
+  public static getDefault(fieldName: string): any {
     return _defaultValues[fieldName];
   }
 
+  /**
+   * Adds a change listener for when customizable defaults change.
+   */
   public static addChangeListener(onChanged: IChangeListener): void {
     _changeListeners.push(onChanged);
   }
 
+  /**
+   * Removes a change listener that was added.
+   */
   public static removeChangeListener(onChanged: IChangeListener): void {
     let index = _changeListeners.indexOf(onChanged);
 
@@ -76,7 +88,6 @@ export class Customizer extends BaseComponent<ICustomizerProps, ICustomizerState
   }
 
   public componentWillReceiveProps(newProps, newContext) {
-
     this.setState(this._getInjectedProps(newProps, newContext));
   }
 

From eb011d232ede2816026607471d7873cd5a23ca11 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 5 Jun 2017 17:20:42 -0700
Subject: [PATCH 0065/1641] Updating the theme definition to automatically
 refresh the theme.

---
 common/config/rush/npm-shrinkwrap.json        | 288 +++++++++---------
 .../src/components/Button/BaseButton.tsx      |   1 +
 .../src/components/Button/Button.Props.ts     |   7 +-
 .../CommandButton/CommandButton.styles.ts     |   3 +-
 .../Button/CommandButton/CommandButton.tsx    |   7 +-
 .../CompoundButton/CompoundButton.styles.ts   |   3 +-
 .../Button/CompoundButton/CompoundButton.tsx  |   7 +-
 .../Button/DefaultButton/DefaultButton.tsx    |   7 +-
 .../Button/IconButton/IconButton.styles.ts    |   5 +-
 .../Button/IconButton/IconButton.tsx          |   7 +-
 .../PrimaryButton/PrimaryButton.styles.ts     |   3 +-
 .../Button/PrimaryButton/PrimaryButton.tsx    |   8 +-
 packages/styling/package.json                 |   1 +
 packages/styling/src/utilities/theme.ts       |  47 ++-
 14 files changed, 208 insertions(+), 186 deletions(-)

diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 01aa33c0978f6..a0aa076b511fd 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -73,9 +73,9 @@
           "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "sinon": {
           "version": "1.17.7",
@@ -198,9 +198,9 @@
           "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "string_decoder": {
           "version": "1.0.1",
@@ -413,9 +413,9 @@
           "integrity": "sha1-aHKCNTXGkuLCoBA4Jq/YLC4P8XU="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "resolve": {
           "version": "1.1.7",
@@ -783,13 +783,12 @@
           "bundled": true
         },
         "readable-stream": {
-          "version": "2.2.9",
+          "version": "2.2.10",
           "bundled": true,
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-              "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+              "bundled": true
             }
           }
         },
@@ -815,8 +814,7 @@
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
-              "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
+              "bundled": true
             }
           }
         },
@@ -939,13 +937,12 @@
           "bundled": true
         },
         "readable-stream": {
-          "version": "2.2.9",
+          "version": "2.2.10",
           "bundled": true,
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-              "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+              "bundled": true
             }
           }
         },
@@ -979,8 +976,7 @@
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
-              "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
+              "bundled": true
             }
           }
         },
@@ -990,8 +986,7 @@
           "dependencies": {
             "async": {
               "version": "2.4.1",
-              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
-              "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c="
+              "bundled": true
             }
           }
         },
@@ -1001,13 +996,11 @@
           "dependencies": {
             "async": {
               "version": "2.4.1",
-              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
-              "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c="
+              "bundled": true
             },
             "source-map": {
               "version": "0.5.6",
-              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz",
-              "integrity": "sha1-dc449SvwczxafwwRjYEzSiu19BI="
+              "bundled": true
             }
           }
         },
@@ -1084,13 +1077,12 @@
           "bundled": true
         },
         "readable-stream": {
-          "version": "2.2.9",
+          "version": "2.2.10",
           "bundled": true,
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-              "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+              "bundled": true
             }
           }
         },
@@ -1116,8 +1108,7 @@
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
-              "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
+              "bundled": true
             }
           }
         },
@@ -1199,13 +1190,12 @@
           "bundled": true
         },
         "readable-stream": {
-          "version": "2.2.9",
+          "version": "2.2.10",
           "bundled": true,
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-              "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+              "bundled": true
             }
           }
         },
@@ -1239,8 +1229,7 @@
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
-              "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
+              "bundled": true
             }
           }
         },
@@ -1250,8 +1239,7 @@
           "dependencies": {
             "async": {
               "version": "2.4.1",
-              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
-              "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c="
+              "bundled": true
             }
           }
         },
@@ -1261,13 +1249,11 @@
           "dependencies": {
             "async": {
               "version": "2.4.1",
-              "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
-              "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c="
+              "bundled": true
             },
             "source-map": {
               "version": "0.5.6",
-              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz",
-              "integrity": "sha1-dc449SvwczxafwwRjYEzSiu19BI="
+              "bundled": true
             }
           }
         },
@@ -1344,9 +1330,9 @@
       "integrity": "sha1-89DV2i7Ie1FOMNs/+aAYh7VhnCk="
     },
     "@types/bluebird": {
-      "version": "3.5.4",
-      "resolved": "https://registry.npmjs.org/@types/bluebird/-/bluebird-3.5.4.tgz",
-      "integrity": "sha1-8SAWKwT9bVXhA0bX4ulu7UYrAs8="
+      "version": "3.5.5",
+      "resolved": "https://registry.npmjs.org/@types/bluebird/-/bluebird-3.5.5.tgz",
+      "integrity": "sha512-aBVzCAzfyApU0gg36QgCpJixGtYwuQ4djrn11J+DTB5vE4OmBPuZiulgTCA9ByULgVAyNV2CTpjjvZmxzukSLw=="
     },
     "@types/chai": {
       "version": "3.5.2",
@@ -1494,9 +1480,9 @@
       "integrity": "sha1-vShOV8hPEyXacCur/IKlMoGQwMU="
     },
     "@types/react": {
-      "version": "15.0.25",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.25.tgz",
-      "integrity": "sha1-05aUnMzJqQthdV3vl4HlrO2bImE="
+      "version": "15.0.27",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.27.tgz",
+      "integrity": "sha512-xijibeFUoyzNjAZVMIPiZW/j5WyUgClm7ii4rRj2IpgYHPFheSR/nwxzNFy60U2o1yp1XyB+QuWUz4+8DB5E1w=="
     },
     "@types/react-addons-test-utils": {
       "version": "0.14.18",
@@ -1534,9 +1520,9 @@
       "integrity": "sha1-FUVt6NmNa0z/Mb5savdJKuY/Uho="
     },
     "@types/sinon": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/@types/sinon/-/sinon-2.2.2.tgz",
-      "integrity": "sha1-qA2khougisysvOTTcnbzXhugpS8="
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/@types/sinon/-/sinon-2.3.1.tgz",
+      "integrity": "sha512-WXpK6gOice0sdhfrAtRaDNtg0E0e04MRuCKYuqtCmc8O1P9P+ia3Z5zuMf4cDVB27s9w4UjjML5/6vjkiI2gNA=="
     },
     "@types/source-map": {
       "version": "0.5.0",
@@ -1549,9 +1535,9 @@
       "integrity": "sha1-RwAkRQ8at2QPGfnr9C09pXTCYSk="
     },
     "@types/uglify-js": {
-      "version": "2.6.28",
-      "resolved": "https://registry.npmjs.org/@types/uglify-js/-/uglify-js-2.6.28.tgz",
-      "integrity": "sha1-FJm0jKOkQTIlCzGM3eJbj0XwxhY="
+      "version": "2.6.29",
+      "resolved": "https://registry.npmjs.org/@types/uglify-js/-/uglify-js-2.6.29.tgz",
+      "integrity": "sha512-BdFLCZW0GTl31AbqXSak8ss/MqEZ3DN2MH9rkAyGoTuzK7ifGUlX+u0nfbWeTsa7IPcZhtn8BlpYBXSV+vqGhQ=="
     },
     "@types/vinyl": {
       "version": "1.2.30",
@@ -1698,9 +1684,9 @@
       "integrity": "sha1-o+Uvo5FoyCX/V7AkgSbOWo/5VQc="
     },
     "aproba": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.1.1.tgz",
-      "integrity": "sha1-ldNgDwdxCqDpKYxyatXs8urLq6s="
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.1.2.tgz",
+      "integrity": "sha512-ZpYajIfO0j2cOFTO955KUMIKNmj6zhX8kVztMAxFsDaMwz+9Z9SV0uou2pC9HJqcfpffOsjnbrDMvkNy+9RXPw=="
     },
     "archy": {
       "version": "1.0.0",
@@ -1718,9 +1704,9 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "string_decoder": {
           "version": "1.0.1",
@@ -2189,11 +2175,6 @@
         }
       }
     },
-    "buffer-shims": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/buffer-shims/-/buffer-shims-1.0.0.tgz",
-      "integrity": "sha1-mXjOMXOIxkmth5MCjDR37wRKi1E="
-    },
     "buffer-xor": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/buffer-xor/-/buffer-xor-1.0.3.tgz",
@@ -2250,9 +2231,9 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000676",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000676.tgz",
-      "integrity": "sha1-gupXgjdjfI/zSiisqt43O2JMTqg="
+      "version": "1.0.30000677",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000677.tgz",
+      "integrity": "sha1-E/Qh1ArhQ0cCEDxJTSxNcW4qj8s="
     },
     "capture-stack-trace": {
       "version": "1.0.0",
@@ -3117,9 +3098,9 @@
           "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "string_decoder": {
           "version": "1.0.1",
@@ -3300,9 +3281,9 @@
       "integrity": "sha1-RTVSSKiJeQNLZ5Lhm7gfK3l13Q0="
     },
     "es5-ext": {
-      "version": "0.10.22",
-      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.22.tgz",
-      "integrity": "sha512-YXTXSlZkJsVwMEVljp1Bh5P9+Raa3524OMl9kywGMp1aazKTCnAqORRL/8dkuqNHk+LRYe0LezuS8PlUt3+mOw=="
+      "version": "0.10.23",
+      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.23.tgz",
+      "integrity": "sha1-dXi1G+l0IHpUh4IbVlOMIk5Oezg="
     },
     "es6-collections": {
       "version": "0.5.6",
@@ -3956,9 +3937,9 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "string_decoder": {
           "version": "1.0.1",
@@ -4010,9 +3991,9 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "string_decoder": {
           "version": "1.0.1",
@@ -4042,9 +4023,9 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "string_decoder": {
           "version": "1.0.1",
@@ -4556,9 +4537,9 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "string_decoder": {
           "version": "1.0.1",
@@ -4701,9 +4682,9 @@
           "integrity": "sha1-cTfmmzKYuzQiR6G77jiByA4v14s="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "string_decoder": {
           "version": "1.0.1",
@@ -4882,9 +4863,9 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "string_decoder": {
           "version": "1.0.1",
@@ -4926,9 +4907,9 @@
           "integrity": "sha1-B8/omA7bINRV3cI6rc8eBMblCc4="
         },
         "uglify-js": {
-          "version": "3.0.14",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.14.tgz",
-          "integrity": "sha1-JpevEm/SFarFVvrLHt+xeHUgR2A="
+          "version": "3.0.15",
+          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.15.tgz",
+          "integrity": "sha1-qssyOoRrI0YCJw3q2KMkQaiAb0I="
         }
       }
     },
@@ -4943,9 +4924,9 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "string_decoder": {
           "version": "1.0.1",
@@ -5690,9 +5671,9 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "string_decoder": {
           "version": "1.0.1",
@@ -6227,9 +6208,9 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "string_decoder": {
           "version": "1.0.1",
@@ -6259,9 +6240,9 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "string_decoder": {
           "version": "1.0.1",
@@ -6525,9 +6506,9 @@
       "integrity": "sha1-/ZGOQSdpv4xEgFEjgjOECyr/FqE="
     },
     "node-fetch": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.0.tgz",
-      "integrity": "sha1-P/bFZUT5t/sAaCM4u1Xub1SooO8="
+      "version": "1.7.1",
+      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.1.tgz",
+      "integrity": "sha512-j8XsFGCLw79vWXkZtMSmmLaOk9z5SQ9bV/tkbZVCqvgwzrjAGq66igobLofHtF63NvMTp2WjytpsNTGKa+XRIQ=="
     },
     "node-forge": {
       "version": "0.7.1",
@@ -6535,9 +6516,9 @@
       "integrity": "sha1-naYR6giYL0uUIGs760zJZl8gwwA="
     },
     "node-gyp": {
-      "version": "3.6.1",
-      "resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-3.6.1.tgz",
-      "integrity": "sha1-GVYQZ/8YVGSt7UeCEmgfR/1XjLw="
+      "version": "3.6.2",
+      "resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-3.6.2.tgz",
+      "integrity": "sha1-m/vlRWIoYoSDjnUOrAUpWFP6HGA="
     },
     "node-libs-browser": {
       "version": "0.6.0",
@@ -6852,9 +6833,9 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "string_decoder": {
           "version": "1.0.1",
@@ -7491,9 +7472,9 @@
       "integrity": "sha1-EQ3Kv/OX6dz/fAeJzMCkmt8exbs="
     },
     "randombytes": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.0.3.tgz",
-      "integrity": "sha1-Z0yZdgkBw8QRJ3GjHlIdw0nMCew="
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.0.4.tgz",
+      "integrity": "sha1-lVHfIIQiyPgOtY4jJt0LhA/yLv0="
     },
     "range-parser": {
       "version": "1.2.0",
@@ -7587,9 +7568,9 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "string_decoder": {
           "version": "1.0.1",
@@ -7624,9 +7605,9 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "string_decoder": {
           "version": "1.0.1",
@@ -7765,9 +7746,9 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "string_decoder": {
           "version": "1.0.1",
@@ -7867,9 +7848,9 @@
       "integrity": "sha1-Gc5QLKVyZl87ZHsQk5+X/RYV8QI="
     },
     "safe-buffer": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-      "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.0.tgz",
+      "integrity": "sha512-aSLEDudu6OoRr/2rU609gRmnYboRLxgDG1z9o2Q0os7236FwvcqIOO8r8U5JUEwivZOhDaKlFO4SbPTJYyBEyQ=="
     },
     "samsam": {
       "version": "1.1.2",
@@ -8336,9 +8317,9 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "string_decoder": {
           "version": "1.0.1",
@@ -8385,9 +8366,9 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "string_decoder": {
           "version": "1.0.1",
@@ -8427,9 +8408,9 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "string_decoder": {
           "version": "1.0.1",
@@ -8615,9 +8596,9 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "string_decoder": {
           "version": "1.0.1",
@@ -8865,9 +8846,9 @@
       "integrity": "sha1-BMgamb3V3FImPqKdJMa/jUgYpLs="
     },
     "uglify-js": {
-      "version": "2.8.27",
-      "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.8.27.tgz",
-      "integrity": "sha1-R3h/kSsPJC5bmENDvo416V9pTJw=",
+      "version": "2.8.28",
+      "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.8.28.tgz",
+      "integrity": "sha512-WqKNbmNJKzIdIEQu/U2ytgGBbhCy2PVks94GoetczOAJ/zCgVu2CuO7gguI5KPFGPtUtI1dmPQl6h0D4cPzypA==",
       "dependencies": {
         "camelcase": {
           "version": "1.2.1",
@@ -9241,9 +9222,9 @@
           "integrity": "sha1-Y/xMzuXS13Y9Jrv4YBB45sLgBE8="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g=",
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw==",
           "dependencies": {
             "string_decoder": {
               "version": "1.0.1",
@@ -9341,6 +9322,11 @@
           "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz",
           "integrity": "sha1-EV+eO2s9rylZmDyzjxSaLUDrXVM="
         },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+        },
         "send": {
           "version": "0.15.3",
           "resolved": "https://registry.npmjs.org/send/-/send-0.15.3.tgz",
@@ -9519,9 +9505,9 @@
           "integrity": "sha1-Y/xMzuXS13Y9Jrv4YBB45sLgBE8="
         },
         "readable-stream": {
-          "version": "2.2.9",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-          "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g="
+          "version": "2.2.10",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
+          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
         },
         "stream-browserify": {
           "version": "2.0.1",
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 8a016cb960b48..55d79cb8b0c72 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -6,6 +6,7 @@ import {
   assign,
   autobind,
   buttonProperties,
+  customizable,
   getId,
   getNativeProps,
   memoize
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
index dde82b514a842..4dbbee37e0218 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
@@ -4,7 +4,7 @@ import { Button } from './Button';
 import { IRenderFunction } from '../../Utilities';
 import { IContextualMenuProps } from '../../ContextualMenu';
 import { IIconProps, IconName } from '../../Icon';
-import { IStyle } from '../../Styling';
+import { IStyle, ITheme } from '../../Styling';
 
 export interface IButton {
   /**
@@ -36,6 +36,11 @@ export interface IButtonProps extends React.HTMLAttributes<HTMLButtonElement | H
    */
   styles?: IButtonStyles;
 
+  /**
+   * Theme provided by HOC.
+   */
+  theme?: ITheme;
+
   /**
    * Whether the button is checked
    */
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
index 7ba60f4f64abd..a76d988aa2900 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
@@ -1,7 +1,6 @@
 import { IButtonStyles } from '../Button.Props';
 import {
   ITheme,
-  getTheme,
   mergeStyleSets
 } from '../../../Styling';
 import { memoizeFunction } from '../../../Utilities';
@@ -13,7 +12,7 @@ const DEFAULT_BUTTON_HEIGHT = '40px';
 const DEFAULT_PADDING = '0 4px';
 
 export const getStyles = memoizeFunction((
-  theme: ITheme = getTheme(),
+  theme: ITheme,
   customStyles?: IButtonStyles
 ): IButtonStyles => {
   let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx
index f79fed9fa8076..bcf122cccf705 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx
@@ -1,9 +1,10 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
-import { BaseComponent, nullRender } from '../../../Utilities';
+import { BaseComponent, customizable, nullRender } from '../../../Utilities';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './CommandButton.styles';
 
+@customizable(['theme'])
 export class CommandButton extends BaseComponent<IButtonProps, {}> {
 
   /**
@@ -12,13 +13,13 @@ export class CommandButton extends BaseComponent<IButtonProps, {}> {
   protected _shouldUpdateComponentRef = false;
 
   public render() {
-    let { styles } = this.props;
+    let { styles, theme } = this.props;
 
     return (
       <BaseButton
         { ...this.props }
         variantClassName='ms-Button--command'
-        styles={ getStyles(undefined, styles) }
+        styles={ getStyles(theme, styles) }
         onRenderDescription={ nullRender }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
index 3e444a08f2ea1..41739edbd2731 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
@@ -1,7 +1,6 @@
 import { IButtonStyles } from '../Button.Props';
 import {
   ITheme,
-  getTheme,
   mergeStyleSets
 } from '../../../Styling';
 import { memoizeFunction } from '../../../Utilities';
@@ -14,7 +13,7 @@ const DEFAULT_BUTTON_MINWIDTH = '80px';
 const DEFAULT_PADDING = '0 16px';
 
 export const getStyles = memoizeFunction((
-  theme: ITheme = getTheme(),
+  theme: ITheme,
   customStyles?: IButtonStyles
 ): IButtonStyles => {
   let defaultButtonStyles: IButtonStyles = getDefaultButtonStyles(
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
index 9ea261fa817a0..caeb2f04d90e8 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
@@ -1,9 +1,10 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
-import { BaseComponent, nullRender } from '../../../Utilities';
+import { BaseComponent, customizable, nullRender } from '../../../Utilities';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './CompoundButton.styles';
 
+@customizable(['theme'])
 export class CompoundButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Tell BaseComponent to bypass resolution of componentRef.
@@ -11,12 +12,12 @@ export class CompoundButton extends BaseComponent<IButtonProps, {}> {
   protected _shouldUpdateComponentRef = false;
 
   public render() {
-    let { styles } = this.props;
+    let { styles, theme } = this.props;
     return (
       <BaseButton
         { ...this.props }
         variantClassName='ms-Button--compound'
-        styles={ getStyles(undefined, styles) }
+        styles={ getStyles(theme, styles) }
         onRenderIcon={ nullRender }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
index 1e01c0bd2f441..633370ddd8718 100644
--- a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
@@ -1,9 +1,10 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
-import { BaseComponent, nullRender } from '../../../Utilities';
+import { BaseComponent, customizable, nullRender } from '../../../Utilities';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './DefaultButton.styles';
 
+@customizable(['theme'])
 export class DefaultButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Tell BaseComponent to bypass resolution of componentRef.
@@ -11,13 +12,13 @@ export class DefaultButton extends BaseComponent<IButtonProps, {}> {
   protected _shouldUpdateComponentRef = false;
 
   public render() {
-    const { styles } = this.props;
+    const { styles, theme } = this.props;
 
     return (
       <BaseButton
         { ...this.props }
         variantClassName='ms-Button--default'
-        styles={ getStyles(undefined, styles) }
+        styles={ getStyles(theme, styles) }
         onRenderDescription={ nullRender }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
index 2d6e38cf51bcd..a445e6033afbb 100644
--- a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
@@ -1,8 +1,7 @@
 import { IButtonStyles } from '../Button.Props';
 import {
   ITheme,
-  mergeStyleSets,
-  getTheme
+  mergeStyleSets
 } from '../../../Styling';
 import { memoizeFunction } from '../../../Utilities';
 import {
@@ -13,7 +12,7 @@ const DEFAULT_BUTTON_HEIGHT = '32px';
 const DEFAULT_PADDING = '0 4px';
 
 export const getStyles = memoizeFunction((
-  theme: ITheme = getTheme(),
+  theme: ITheme,
   customStyles?: IButtonStyles
 ): IButtonStyles => {
   let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
diff --git a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
index 89b88186c4baa..f1ee410afcb22 100644
--- a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
@@ -1,9 +1,10 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
-import { BaseComponent, nullRender } from '../../../Utilities';
+import { BaseComponent, customizable, nullRender } from '../../../Utilities';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './IconButton.styles';
 
+@customizable(['theme'])
 export class IconButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Tell BaseComponent to bypass resolution of componentRef.
@@ -11,13 +12,13 @@ export class IconButton extends BaseComponent<IButtonProps, {}> {
   protected _shouldUpdateComponentRef = false;
 
   public render() {
-    let { styles } = this.props;
+    let { styles, theme } = this.props;
 
     return (
       <BaseButton
         { ...this.props }
         variantClassName='ms-Button--icon'
-        styles={ getStyles(undefined, styles) }
+        styles={ getStyles(theme, styles) }
         onRenderText={ nullRender }
         onRenderDescription={ nullRender }
       />
diff --git a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
index e765ff5987117..a5231558dcfb7 100644
--- a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
@@ -1,7 +1,6 @@
 import { IButtonStyles } from '../Button.Props';
 import {
   ITheme,
-  getTheme,
   mergeStyleSets
 } from '../../../Styling';
 import { memoizeFunction } from '../../../Utilities';
@@ -10,7 +9,7 @@ import {
 } from '../DefaultButton/DefaultButton.styles';
 
 export const getStyles = memoizeFunction((
-  theme: ITheme = getTheme(),
+  theme: ITheme,
   customStyles?: IButtonStyles
 ): IButtonStyles => {
   let { palette } = theme;
diff --git a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
index 7e7dd1c6e23ae..d6fefd646ab6c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
@@ -1,9 +1,11 @@
 import * as React from 'react';
-import { BaseComponent, nullRender } from '../../../Utilities';
+import { BaseComponent, customizable, nullRender } from '../../../Utilities';
+import { getTheme } from '../../../Styling';
 import { BaseButton } from '../BaseButton';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './PrimaryButton.styles';
 
+@customizable(['theme'])
 export class PrimaryButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Set this BaseComponent._resolveComponentRef to false, bypassing resolution of componentRef.
@@ -11,14 +13,14 @@ export class PrimaryButton extends BaseComponent<IButtonProps, {}> {
   protected _shouldUpdateComponentRef = false;
 
   public render() {
-    const { styles } = this.props;
+    const { theme, styles } = this.props;
 
     return (
       <BaseButton
         { ...this.props }
         variantClassName='ms-Button--primary'
         onRenderDescription={ nullRender }
-        styles={ getStyles(undefined, styles) }
+        styles={ getStyles(theme, styles) }
       />
     );
   }
diff --git a/packages/styling/package.json b/packages/styling/package.json
index b3f081995884c..924a5d6051d27 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -45,6 +45,7 @@
     "webpack-split-by-path": "2.0.0"
   },
   "dependencies": {
+    "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.0.1 <5.0.0",
     "glamor": "^2.20.24",
     "rtl-css-js": "^1.1.0"
diff --git a/packages/styling/src/utilities/theme.ts b/packages/styling/src/utilities/theme.ts
index a3f10c53f6edd..8ad3fe9976a70 100644
--- a/packages/styling/src/utilities/theme.ts
+++ b/packages/styling/src/utilities/theme.ts
@@ -1,4 +1,3 @@
-import * as assign from 'object-assign';
 import {
   IPalette,
   IFontStyles,
@@ -8,19 +7,22 @@ import {
   DefaultPalette,
   DefaultFontStyles
 } from '../styles/index';
-
+import { Customizer } from '@uifabric/utilities/lib/index';
 export interface ITheme {
-  palette: IPalette;
-  fonts: IFontStyles;
-  semanticColors: ISemanticColors;
+  palette?: IPalette;
+  fonts?: IFontStyles;
+  semanticColors?: ISemanticColors;
 }
+import { loadTheme as legacyLoadTheme } from '@microsoft/load-themed-styles';
 
-const _theme: ITheme = {
+let _theme: ITheme = {
   palette: DefaultPalette,
   semanticColors: _makeSemanticColorsFromPalette(DefaultPalette),
   fonts: DefaultFontStyles
 };
 
+Customizer.setDefault('theme', _theme);
+
 /**
  * Gets the theme object.
  */
@@ -29,12 +31,37 @@ export function getTheme(): ITheme {
 }
 
 /**
- * Mixes the given theme settings into the current theme object.
+ * Loads the default global theme definition.
  */
 export function loadTheme(theme: ITheme): void {
-  _theme.palette = assign({}, _theme.palette, theme.palette);
-  _theme.semanticColors = assign({}, _makeSemanticColorsFromPalette(_theme.palette), theme.semanticColors);
-  _theme.fonts = assign({}, _theme.fonts, theme.fonts);
+  _theme = createTheme(theme);
+
+  // Load the legacy theme from the palette.
+  legacyLoadTheme(_theme.palette as {});
+
+  Customizer.setDefault('theme', _theme);
+}
+
+/**
+ * Creates a custom theme definition which can be used with the Customizer.
+ */
+export function createTheme(theme: ITheme): ITheme {
+  let newPalette = {
+    ..._theme.palette,
+    ...theme.palette
+  };
+
+  return {
+    palette: newPalette,
+    fonts: {
+      ..._theme.fonts,
+      ...theme.fonts
+    },
+    semanticColors: {
+      ..._makeSemanticColorsFromPalette(newPalette),
+      ...theme.semanticColors
+    }
+  } as ITheme;
 }
 
 // Generates all the semantic slot colors based on the Fabric palette.

From bf7843a836c66b43dfa0e4bf1a0819b6168b1485 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 5 Jun 2017 17:28:18 -0700
Subject: [PATCH 0066/1641] Updates to the theme page and base button linting
 errors.

---
 .../src/components/Button/BaseButton.tsx                    | 1 -
 .../src/components/Button/PrimaryButton/PrimaryButton.tsx   | 1 -
 .../src/components/Theme/ThemePage.tsx                      | 5 ++---
 .../src/components/Theme/examples/ThemeCode.Example.tsx     | 6 ++++--
 4 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 55d79cb8b0c72..8a016cb960b48 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -6,7 +6,6 @@ import {
   assign,
   autobind,
   buttonProperties,
-  customizable,
   getId,
   getNativeProps,
   memoize
diff --git a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
index d6fefd646ab6c..6ef976a8f9484 100644
--- a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
-import { getTheme } from '../../../Styling';
 import { BaseButton } from '../BaseButton';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './PrimaryButton.styles';
diff --git a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
index a02ab939d08b0..cd61d36733073 100644
--- a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
@@ -1,12 +1,11 @@
 import * as React from 'react';
-import { loadTheme, ITheme } from '@microsoft/load-themed-styles';
+import { loadTheme, FontClassNames, ITheme } from 'office-ui-fabric-react/lib/Styling';
 import { Highlight } from '@uifabric/example-app-base';
 import { defaultTheme } from './defaultTheme';
 import { Callout } from 'office-ui-fabric-react/lib/Callout';
 import { DetailsList, DetailsListLayoutMode as LayoutMode } from 'office-ui-fabric-react/lib/DetailsList';
 import { SelectionMode } from 'office-ui-fabric-react/lib/Selection';
 import { ColorPicker } from 'office-ui-fabric-react/lib/ColorPicker';
-import { FontClassNames } from '../../Styling';
 import './ThemePage.scss';
 const ThemeCodeExample = require('!raw-loader!office-ui-fabric-react/src/components/Theme/examples/ThemeCode.Example.tsx');
 
@@ -126,7 +125,7 @@ export class ThemePage extends React.Component<any, any> {
       theme[themeColor.key] = themeColor.value;
     }
 
-    loadTheme(theme);
+    loadTheme({ palette: theme });
 
     // The theme has changed values, but color state is the same. Force an update on the list.
     this.refs.list.forceUpdate();
diff --git a/packages/office-ui-fabric-react/src/components/Theme/examples/ThemeCode.Example.tsx b/packages/office-ui-fabric-react/src/components/Theme/examples/ThemeCode.Example.tsx
index 29754dcd6ea2d..8889c8b957c5a 100644
--- a/packages/office-ui-fabric-react/src/components/Theme/examples/ThemeCode.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Theme/examples/ThemeCode.Example.tsx
@@ -1,5 +1,7 @@
-import { loadTheme } from '@microsoft/load-themed-styles';
+import { loadTheme } from 'office-ui-fabric-react/lib/Styling';
 
 loadTheme({
-  'themePrimary': 'red'
+  palette: {
+    'themePrimary': 'red'
+  }
 });

From 8024225d8a3936ccddbcfb9688727260827dfe09 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 5 Jun 2017 17:33:29 -0700
Subject: [PATCH 0067/1641] Adding missing change files.

---
 .../@uifabric/styling/master_2017-06-06-00-33.json    | 11 +++++++++++
 .../@uifabric/utilities/master_2017-06-06-00-33.json  | 11 +++++++++++
 .../master_2017-06-06-00-33.json                      | 11 +++++++++++
 3 files changed, 33 insertions(+)
 create mode 100644 common/changes/@uifabric/styling/master_2017-06-06-00-33.json
 create mode 100644 common/changes/@uifabric/utilities/master_2017-06-06-00-33.json
 create mode 100644 common/changes/office-ui-fabric-react/master_2017-06-06-00-33.json

diff --git a/common/changes/@uifabric/styling/master_2017-06-06-00-33.json b/common/changes/@uifabric/styling/master_2017-06-06-00-33.json
new file mode 100644
index 0000000000000..22332d2ab18fe
--- /dev/null
+++ b/common/changes/@uifabric/styling/master_2017-06-06-00-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Styling: loadTheme now updates both legacy theme as well as current global theming. All theme objects provided by customizable will get updated correctly.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/master_2017-06-06-00-33.json b/common/changes/@uifabric/utilities/master_2017-06-06-00-33.json
new file mode 100644
index 0000000000000..ce3e454aeba35
--- /dev/null
+++ b/common/changes/@uifabric/utilities/master_2017-06-06-00-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Customizer/customizable: adjusting to take in fields, rather than a single string representing the thing to customize.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2017-06-06-00-33.json b/common/changes/office-ui-fabric-react/master_2017-06-06-00-33.json
new file mode 100644
index 0000000000000..0029daf263f61
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2017-06-06-00-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Buttons: allowing theme to be provided via Customizer.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file

From 652aaea46284e84a403060c3936af239e92c9af0 Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Mon, 5 Jun 2017 17:47:31 -0700
Subject: [PATCH 0068/1641] Styling: Add more semantic color slots (#1901)

* add more semantic color slots

* add chang efile

* add documentation

* address code review feedback

* Update phkuo-glamor_2017-05-31-22-58.json
---
 .../phkuo-glamor_2017-05-31-22-58.json        |  11 ++
 .../src/components/Toggle/Toggle.styles.ts    |   6 +-
 .../styling/src/interfaces/ISemanticColors.ts | 132 ++++++++++++++++--
 packages/styling/src/utilities/theme.ts       |  19 ++-
 4 files changed, 154 insertions(+), 14 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/phkuo-glamor_2017-05-31-22-58.json

diff --git a/common/changes/@uifabric/styling/phkuo-glamor_2017-05-31-22-58.json b/common/changes/@uifabric/styling/phkuo-glamor_2017-05-31-22-58.json
new file mode 100644
index 0000000000000..25d0775f40bbc
--- /dev/null
+++ b/common/changes/@uifabric/styling/phkuo-glamor_2017-05-31-22-58.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "add more semantic color slots",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "phkuo@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts
index c2d630a3a39f3..49faaf10ba73c 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts
@@ -13,11 +13,11 @@ export const getStyles = memoizeFunction((
 ): IToggleStyles => {
   const { semanticColors } = theme;
   const pillUncheckedBackground = semanticColors.bodyBackground;
-  const pillCheckedBackground = semanticColors.inputBackgroundSelected;
-  const pillCheckedHoveredBackground = semanticColors.inputBackgroundSelectedHovered;
+  const pillCheckedBackground = semanticColors.inputBackgroundChecked;
+  const pillCheckedHoveredBackground = semanticColors.inputBackgroundCheckedHovered;
   const pillCheckedDisabledBackground = semanticColors.disabledText;
   const thumbBackground = semanticColors.inputBorderHovered;
-  const thumbCheckedBackground = semanticColors.inputForegroundSelected;
+  const thumbCheckedBackground = semanticColors.inputForegroundChecked;
   const thumbDisabledBackground = semanticColors.disabledText;
   const thumbCheckedDisabledBackground = semanticColors.disabledBackground;
   const pillBorderColor = semanticColors.inputBorder;
diff --git a/packages/styling/src/interfaces/ISemanticColors.ts b/packages/styling/src/interfaces/ISemanticColors.ts
index 8695b135e71da..938c2fa12f452 100644
--- a/packages/styling/src/interfaces/ISemanticColors.ts
+++ b/packages/styling/src/interfaces/ISemanticColors.ts
@@ -1,31 +1,147 @@
 /**
+ *
  * The collection of semantic slots for colors used in themes.
- * See documentation [todo]
- */
+
+Naming Convention 
+The name of a semantic slot can quickly tell you how it’s meant to be used. It generally follows this format: 
+[category name][element name][checked state][hovered/pressed/disabled state]  
+[category name] – The “family” that this slot belongs to. 
+[element name] – The name of the thing being targeted, such as the background or border. 
+[checked state] – Whether the thing is checked. We assume things are unchecked by default, so no need to specify the unchecked state.
+(We used “checked” to refer to anything that is on, selected, toggled, highlighted, emphasized, etc.) 
+[hovered/pressed/disabled state] – One of these states, if applicable. Each of these states are mutually exclusive.
+Pressed styles overwrite hovered styles, and disabled elements cannot be hovered or pressed.   
+ 
+Base/Body
+A basic set of slots that provide many default body styles, such as text, subtext, disabled colors, error text, and so on.
+If a category doesn't provide the slot you're looking for, use one from this category.
+For example, the placeholder text on a text input field has no corresponding slot in its category,
+so you'd use the bodySubtextColor from this category. 
+ 
+Input Controls 
+This category contains input components commonly used to denote state, including radio buttons,
+check boxes, toggle switches, sliders, progress bars, and more. 
+ 
+Menus 
+Any kind of popup menus uses this category. 
+ 
+Lists 
+Lists differ from menus in that they are designed to show infinite amounts of items, often scroll,
+and have a large and complex interaction surface.
+This category covers all kinds of lists, whether they're typical one-item-per-row lists (like DetailsList) or ones with a tiled layout.
+
+*/
 export interface ISemanticColors {
+  /* ANY ADDITIONS/REMOVALS HERE MUST ALSO BE MADE TO \packages\styling\src\utilities\theme.ts:_makeSemanticColorsFromPalette() */
+
   /**
-   * ANY ADDITIONS/REMOVALS HERE MUST ALSO BE MADE TO \packages\styling\src\utilities\theme.ts:_makeSemanticColorsFromPalette()
+   * The default color for backgrounds.
    */
-
-  // Base slots defining universal colors
   bodyBackground?: string;
+  /**
+   * The default color for text.
+   */
   bodyText?: string;
+  /**
+   * De-emphasized text; e.g. metadata, captions, placeholder text.
+   */
   bodySubtext?: string;
+  /**
+   * Divider lines; e.g. lines that separate sections in a menu, an <HR> element.
+   */
+  bodyDivider?: string;
 
+  /**
+   * The default color for backgrounds of disabled controls; e.g. disabled text field.
+   */
   disabledBackground?: string;
+  /**
+   * The default color for disabled text; e.g. user input inside a disabled text field.
+   */
   disabledText?: string;
+  /**
+   * Disabled de-emphasized text; e.g. placeholder text inside disabled input field.
+   */
   disabledSubtext?: string;
 
+  /**
+   * The color of the outline around focused controls that don't already have a border; e.g. menu items
+   */
   focusBorder?: string;
 
   // Invariants - slots that rarely change color theme-to-theme because the color has meaning
+  /**
+   * The background for errors, if necessary, or highlighting the section of the page where the error is present.
+   */
   errorBackground?: string;
+  /**
+   * The default color of error text.
+   */
   errorText?: string;
 
   // Input controls slots (text fields, checkboxes, radios...)
+  /**
+   * The border of an input control in its resting, unchecked state; e.g. the box of an unchecked checkbox.
+   */
   inputBorder?: string;
+  /**
+   * The border color of a hovered input control.
+   */
   inputBorderHovered?: string;
-  inputBackgroundSelected?: string;
-  inputBackgroundSelectedHovered?: string;
-  inputForegroundSelected?: string;
+  /**
+   * The background of a checked control; e.g. checked radio button's dot, checked toggle's background.
+   */
+  inputBackgroundChecked?: string;
+  /**
+   * The background of a checked and hovered control; e.g. checked checkbox's background color on hover.
+   */
+  inputBackgroundCheckedHovered?: string;
+  /**
+   * The foreground of a checked control; e.g. checked checkbox's checkmark color, checked toggle's thumb color, radio button's background color around the dot.
+   */
+  inputForegroundChecked?: string;
+  /**
+   * The alternate focus border color for elements that already have a border; e.g. text field borders on focus.
+   */
+  inputFocusBorderAlt?: string;
+
+  // Menus, popups, etc
+  /**
+   * The background of a hovered menu item.
+   */
+  menuItemBackgroundHovered?: string;
+  /**
+   * The background of checked menu item; e.g. a menu item whose submenu is open, a selected dropdown item.
+   */
+  menuItemBackgroundChecked?: string;
+  /**
+   * The default colors of icons in menus.
+   */
+  menuIcon?: string;
+  /**
+   * The headers in menus that denote title of a section.
+   */
+  menuHeader?: string;
+
+  // Lists
+  /**
+   * The background color for the entire list.
+   */
+  listBackground?: string;
+  /**
+   * The default text color for list item titles and text in column fields.
+   */
+  listTextColor?: string;
+  /**
+   * The background color of a hovered list item.
+   */
+  listItemBackgroundHovered?: string;
+  /**
+   * The background color of a checked list item.
+   */
+  listItemBackgroundChecked?: string;
+  /**
+   * The background color of a checked and hovered list item.
+   */
+  listItemBackgroundCheckedHovered?: string;
 }
\ No newline at end of file
diff --git a/packages/styling/src/utilities/theme.ts b/packages/styling/src/utilities/theme.ts
index 8ad3fe9976a70..680ec7dff0b57 100644
--- a/packages/styling/src/utilities/theme.ts
+++ b/packages/styling/src/utilities/theme.ts
@@ -71,6 +71,7 @@ function _makeSemanticColorsFromPalette(p: IPalette): ISemanticColors {
     bodyBackground: p.white,
     bodyText: p.neutralPrimary,
     bodySubtext: p.neutralSecondary,
+    bodyDivider: p.neutralLight,
 
     disabledBackground: p.neutralLighter,
     disabledText: p.neutralTertiaryAlt,
@@ -83,8 +84,20 @@ function _makeSemanticColorsFromPalette(p: IPalette): ISemanticColors {
 
     inputBorder: p.neutralTertiary,
     inputBorderHovered: p.neutralPrimary,
-    inputBackgroundSelected: p.themePrimary,
-    inputBackgroundSelectedHovered: p.themeDarkAlt,
-    inputForegroundSelected: p.white
+    inputBackgroundChecked: p.themePrimary,
+    inputBackgroundCheckedHovered: p.themeDarkAlt,
+    inputForegroundChecked: p.white,
+    inputFocusBorderAlt: p.themePrimary,
+
+    menuItemBackgroundHovered: p.neutralLighter,
+    menuItemBackgroundChecked: p.neutralQuaternaryAlt,
+    menuIcon: p.themePrimary,
+    menuHeader: p.themePrimary,
+
+    listBackground: p.white,
+    listTextColor: p.neutralPrimary,
+    listItemBackgroundHovered: p.neutralLighter,
+    listItemBackgroundChecked: p.neutralQuaternary,
+    listItemBackgroundCheckedHovered: p.neutralQuaternaryAlt
   };
 }

From a332579fa27705ec7748a0014539c81c1889d5ee Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 6 Jun 2017 00:50:06 +0000
Subject: [PATCH 0069/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 18 +++++++++
 apps/fabric-website/CHANGELOG.md              |  7 +++-
 apps/fabric-website/package.json              |  8 ++--
 .../create-app-params_2017-06-05-23-32.json   | 11 -----
 .../styling/master_2017-06-06-00-33.json      | 11 -----
 .../create-app-params_2017-06-05-23-32.json   | 11 -----
 .../utilities/master_2017-06-06-00-33.json    | 11 -----
 .../memoize-fix_2017-06-05-22-33.json         | 11 -----
 ...dragDropFirefoxGhost_2017-05-31-22-07.json | 11 -----
 .../master_2017-06-06-00-33.json              | 11 -----
 ...ragdrophelper-tslint_2017-06-02-20-06.json | 11 -----
 ...ieldErrorBorderFixes_2017-05-31-21-42.json | 11 -----
 packages/example-app-base/CHANGELOG.json      | 22 ++++++++++
 packages/example-app-base/CHANGELOG.md        |  9 ++++-
 packages/example-app-base/package.json        |  6 +--
 packages/example-component/package.json       |  8 ++--
 .../office-ui-fabric-react/CHANGELOG.json     | 40 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 12 +++++-
 packages/office-ui-fabric-react/package.json  |  8 ++--
 packages/styling/CHANGELOG.json               | 19 +++++++++
 packages/styling/CHANGELOG.md                 |  9 ++++-
 packages/styling/package.json                 |  4 +-
 packages/utilities/CHANGELOG.json             | 21 ++++++++++
 packages/utilities/CHANGELOG.md               | 13 +++++-
 packages/utilities/package.json               |  2 +-
 25 files changed, 183 insertions(+), 122 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/create-app-params_2017-06-05-23-32.json
 delete mode 100644 common/changes/@uifabric/styling/master_2017-06-06-00-33.json
 delete mode 100644 common/changes/@uifabric/utilities/create-app-params_2017-06-05-23-32.json
 delete mode 100644 common/changes/@uifabric/utilities/master_2017-06-06-00-33.json
 delete mode 100644 common/changes/@uifabric/utilities/memoize-fix_2017-06-05-22-33.json
 delete mode 100644 common/changes/office-ui-fabric-react/dragDropFirefoxGhost_2017-05-31-22-07.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2017-06-06-00-33.json
 delete mode 100644 common/changes/office-ui-fabric-react/miwhea-dragdrophelper-tslint_2017-06-02-20-06.json
 delete mode 100644 common/changes/office-ui-fabric-react/textfieldErrorBorderFixes_2017-05-31-21-42.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 20c4c1953c613..6df3939500782 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,24 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.5.32",
+      "tag": "@uifabric/fabric-website_v4.5.32",
+      "date": "Tue, 06 Jun 2017 00:50:06 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `2.0.4` to `2.1.0`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.3.0 <5.0.0` to `>=4.3.1 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.0.1 <5.0.0` to `>=4.1.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.5.31",
       "tag": "@uifabric/fabric-website_v4.5.31",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 199db611c5b56..5be76b0a23a85 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Fri, 02 Jun 2017 01:19:36 GMT and should not be manually modified.
+This log was last generated on Tue, 06 Jun 2017 00:50:06 GMT and should not be manually modified.
+
+## 4.5.32
+Tue, 06 Jun 2017 00:50:06 GMT
+
+*Changes not tracked*
 
 ## 4.5.31
 Fri, 02 Jun 2017 01:19:36 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index d8ec5bdf81843..de77da5232eeb 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.5.31",
+  "version": "4.5.32",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,12 +47,12 @@
     "webpack-bundle-analyzer": "^2.2.1"
   },
   "dependencies": {
-    "@uifabric/example-app-base": "2.0.4",
+    "@uifabric/example-app-base": "2.1.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=4.3.0 <5.0.0",
-    "@uifabric/utilities": ">=4.0.1 <5.0.0"
+    "office-ui-fabric-react": ">=4.3.1 <5.0.0",
+    "@uifabric/utilities": ">=4.1.0 <5.0.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/create-app-params_2017-06-05-23-32.json b/common/changes/@uifabric/example-app-base/create-app-params_2017-06-05-23-32.json
deleted file mode 100644
index 2c1754839c580..0000000000000
--- a/common/changes/@uifabric/example-app-base/create-app-params_2017-06-05-23-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Add the ability to optionally pass in the app title and header links for createApp",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "chrisgo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/master_2017-06-06-00-33.json b/common/changes/@uifabric/styling/master_2017-06-06-00-33.json
deleted file mode 100644
index 22332d2ab18fe..0000000000000
--- a/common/changes/@uifabric/styling/master_2017-06-06-00-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Styling: loadTheme now updates both legacy theme as well as current global theming. All theme objects provided by customizable will get updated correctly.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/create-app-params_2017-06-05-23-32.json b/common/changes/@uifabric/utilities/create-app-params_2017-06-05-23-32.json
deleted file mode 100644
index 36952670e611f..0000000000000
--- a/common/changes/@uifabric/utilities/create-app-params_2017-06-05-23-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "chrisgo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/master_2017-06-06-00-33.json b/common/changes/@uifabric/utilities/master_2017-06-06-00-33.json
deleted file mode 100644
index ce3e454aeba35..0000000000000
--- a/common/changes/@uifabric/utilities/master_2017-06-06-00-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Customizer/customizable: adjusting to take in fields, rather than a single string representing the thing to customize.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/memoize-fix_2017-06-05-22-33.json b/common/changes/@uifabric/utilities/memoize-fix_2017-06-05-22-33.json
deleted file mode 100644
index 6e4721194d450..0000000000000
--- a/common/changes/@uifabric/utilities/memoize-fix_2017-06-05-22-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "memoize: returns the callback in scenarios where WeakMap isn't available.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/dragDropFirefoxGhost_2017-05-31-22-07.json b/common/changes/office-ui-fabric-react/dragDropFirefoxGhost_2017-05-31-22-07.json
deleted file mode 100644
index 2e72f46b46d2d..0000000000000
--- a/common/changes/office-ui-fabric-react/dragDropFirefoxGhost_2017-05-31-22-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DragDropHelper: Fix to show ghost element when dragging on Firefox",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "aazhou@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2017-06-06-00-33.json b/common/changes/office-ui-fabric-react/master_2017-06-06-00-33.json
deleted file mode 100644
index 0029daf263f61..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2017-06-06-00-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Buttons: allowing theme to be provided via Customizer.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/miwhea-dragdrophelper-tslint_2017-06-02-20-06.json b/common/changes/office-ui-fabric-react/miwhea-dragdrophelper-tslint_2017-06-02-20-06.json
deleted file mode 100644
index c3bb729f4ed23..0000000000000
--- a/common/changes/office-ui-fabric-react/miwhea-dragdrophelper-tslint_2017-06-02-20-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DragDropHelper: Fix TSLint warnings",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "miwhea@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/textfieldErrorBorderFixes_2017-05-31-21-42.json b/common/changes/office-ui-fabric-react/textfieldErrorBorderFixes_2017-05-31-21-42.json
deleted file mode 100644
index 6981934d3d660..0000000000000
--- a/common/changes/office-ui-fabric-react/textfieldErrorBorderFixes_2017-05-31-21-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "TextField: Show red border when invalid",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "aazhou@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 6c459f816ffb8..7705fb4c98cfa 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "2.1.0",
+      "tag": "@uifabric/example-app-base_v2.1.0",
+      "date": "Tue, 06 Jun 2017 00:50:06 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "90b3bd39868d4576bfadb0a339370934a6d42d3a",
+            "comment": "Add the ability to optionally pass in the app title and header links for createApp"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.4.3 <1.0.0` to `>=0.5.0 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.0.1 <5.0.0` to `>=4.1.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "2.0.4",
       "tag": "@uifabric/example-app-base_v2.0.4",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index 9a4f4f6246fc6..4f5afd4854bbb 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Fri, 02 Jun 2017 01:19:36 GMT and should not be manually modified.
+This log was last generated on Tue, 06 Jun 2017 00:50:06 GMT and should not be manually modified.
+
+## 2.1.0
+Tue, 06 Jun 2017 00:50:06 GMT
+
+### Minor changes
+
+- Add the ability to optionally pass in the app title and header links for createApp
 
 ## 2.0.4
 Fri, 02 Jun 2017 01:19:36 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 0fdf86199df51..7d4a0f90571ff 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "2.0.4",
+  "version": "2.1.0",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -40,8 +40,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.4.3 <1.0.0",
-    "@uifabric/utilities": ">=4.0.1 <5.0.0",
+    "@uifabric/styling": ">=0.5.0 <1.0.0",
+    "@uifabric/utilities": ">=4.1.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
     "office-ui-fabric-react": ">=2.0.0 <3.0.0"
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index a2b842338c40b..f376098ff20c4 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-component",
-  "version": "1.0.30",
+  "version": "1.0.31",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -21,8 +21,8 @@
     "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "2.0.4",
-    "@uifabric/utilities": "4.0.1",
+    "@uifabric/example-app-base": "2.1.0",
+    "@uifabric/utilities": "4.1.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -49,6 +49,6 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.3.0 <5.0.0"
+    "office-ui-fabric-react": ">=4.3.1 <5.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index f5c0a5c7d5148..9fc54a10cbb87 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,46 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.3.1",
+      "tag": "office-ui-fabric-react_v4.3.1",
+      "date": "Tue, 06 Jun 2017 00:50:06 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Aaron Zhou <aaronyzhou88@gmail.com>",
+            "commit": "ccf58fdb6d2448d60a9e0baf7057f8f2e57a4b29",
+            "comment": "DragDropHelper: Fix to show ghost element when dragging on Firefox"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "8024225d8a3936ccddbcfb9688727260827dfe09",
+            "comment": "Buttons: allowing theme to be provided via Customizer."
+          },
+          {
+            "author": "Mike Wheaton <miwhea@microsoft.com>",
+            "commit": "091ff0060056eaaf8c88fb6b27526379cbfa5ea3",
+            "comment": "DragDropHelper: Fix TSLint warnings"
+          },
+          {
+            "author": "Aaron Zhou <aaronyzhou88@gmail.com>",
+            "commit": "dfa4a3ef86bd908dfa4a6ecfa603d692466a2ee0",
+            "comment": "TextField: Show red border when invalid"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.0.1 <5.0.0` to `>=4.1.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.4.3 <1.0.0` to `>=0.5.0 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `2.0.4` to `2.1.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.3.0",
       "tag": "office-ui-fabric-react_v4.3.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 5f0bd40a8db5a..85c52343409f2 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,16 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 02 Jun 2017 01:19:36 GMT and should not be manually modified.
+This log was last generated on Tue, 06 Jun 2017 00:50:06 GMT and should not be manually modified.
+
+## 4.3.1
+Tue, 06 Jun 2017 00:50:06 GMT
+
+### Patches
+
+- DragDropHelper: Fix to show ghost element when dragging on Firefox
+- Buttons: allowing theme to be provided via Customizer.
+- DragDropHelper: Fix TSLint warnings
+- TextField: Show red border when invalid
 
 ## 4.3.0
 Fri, 02 Jun 2017 01:19:35 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index f3a74082d9226..507c8d66e4e2e 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.3.0",
+  "version": "4.3.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "^2.2.2",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "2.0.4",
+    "@uifabric/example-app-base": "2.1.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -71,8 +71,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.0.1 <5.0.0",
-    "@uifabric/styling": ">=0.4.3 <1.0.0",
+    "@uifabric/utilities": ">=4.1.0 <5.0.0",
+    "@uifabric/styling": ">=0.5.0 <1.0.0",
     "prop-types": "^15.5.10"
   },
   "peerDependencies": {
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index f03c7bfcc23e3..79fc1474261e8 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.5.0",
+      "tag": "@uifabric/styling_v0.5.0",
+      "date": "Tue, 06 Jun 2017 00:50:06 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "8024225d8a3936ccddbcfb9688727260827dfe09",
+            "comment": "Styling: loadTheme now updates both legacy theme as well as current global theming. All theme objects provided by customizable will get updated correctly."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.0.1 <5.0.0` to `>=4.1.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.4.3",
       "tag": "@uifabric/styling_v0.4.3",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 0e586585c4e79..a884d6117cd4c 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 02 Jun 2017 01:19:36 GMT and should not be manually modified.
+This log was last generated on Tue, 06 Jun 2017 00:50:06 GMT and should not be manually modified.
+
+## 0.5.0
+Tue, 06 Jun 2017 00:50:06 GMT
+
+### Minor changes
+
+- Styling: loadTheme now updates both legacy theme as well as current global theming. All theme objects provided by customizable will get updated correctly.
 
 ## 0.4.3
 Fri, 02 Jun 2017 01:19:36 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 924a5d6051d27..c2475fd7ade41 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.4.3",
+  "version": "0.5.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -46,7 +46,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.0.1 <5.0.0",
+    "@uifabric/utilities": ">=4.1.0 <5.0.0",
     "glamor": "^2.20.24",
     "rtl-css-js": "^1.1.0"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 3d74bc340c0d8..aa8c8a8505389 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,27 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.1.0",
+      "tag": "@uifabric/utilities_v4.1.0",
+      "date": "Tue, 06 Jun 2017 00:50:06 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "8024225d8a3936ccddbcfb9688727260827dfe09",
+            "comment": "Customizer/customizable: adjusting to take in fields, rather than a single string representing the thing to customize."
+          }
+        ],
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "cb407443e257121037ba57a6bc302f87e03eec9c",
+            "comment": "memoize: returns the callback in scenarios where WeakMap isn't available."
+          }
+        ]
+      }
+    },
     {
       "version": "4.0.1",
       "tag": "@uifabric/utilities_v4.0.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 40468c9735d60..dad34e314cf2e 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Thu, 01 Jun 2017 16:34:03 GMT and should not be manually modified.
+This log was last generated on Tue, 06 Jun 2017 00:50:06 GMT and should not be manually modified.
+
+## 4.1.0
+Tue, 06 Jun 2017 00:50:06 GMT
+
+### Minor changes
+
+- Customizer/customizable: adjusting to take in fields, rather than a single string representing the thing to customize.
+
+### Patches
+
+- memoize: returns the callback in scenarios where WeakMap isn't available.
 
 ## 4.0.1
 Thu, 01 Jun 2017 16:34:03 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index d8d5e24e334b7..616f613c357ad 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.0.1",
+  "version": "4.1.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 1a785e3c7ab9adc1578ce528dffabcd186d3ccfc Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 5 Jun 2017 22:10:43 -0700
Subject: [PATCH 0070/1641] Adding createTheme to styling exports. (#1941)

* Adding createTheme to exports.

* Adding createTheme to exports.
---
 .../styling/createtheme_2017-06-06-01-00.json         | 11 +++++++++++
 packages/styling/src/utilities/index.ts               |  3 ++-
 2 files changed, 13 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/styling/createtheme_2017-06-06-01-00.json

diff --git a/common/changes/@uifabric/styling/createtheme_2017-06-06-01-00.json b/common/changes/@uifabric/styling/createtheme_2017-06-06-01-00.json
new file mode 100644
index 0000000000000..27dfff055d750
--- /dev/null
+++ b/common/changes/@uifabric/styling/createtheme_2017-06-06-01-00.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "createTheme: adding to exports",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/styling/src/utilities/index.ts b/packages/styling/src/utilities/index.ts
index 21ae1b21fae7d..8264f9df8a775 100644
--- a/packages/styling/src/utilities/index.ts
+++ b/packages/styling/src/utilities/index.ts
@@ -1,7 +1,8 @@
 export {
   ITheme,
   getTheme,
-  loadTheme
+  loadTheme,
+  createTheme
 } from './theme';
 export {
   mergeStyles

From 1820479f14ee2ddd8b6c926f7420aac1415feaa2 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 5 Jun 2017 22:33:26 -0700
Subject: [PATCH 0071/1641] Adding tslib dependency to remove redundant code.
 (#1942)

* Updating all packages to use tslib.

* Updating dependencies.
---
 apps/component-demo/package.json              |  1 +
 apps/component-demo/tsconfig.json             |  1 +
 apps/fabric-website/gulpfile.js               |  3 +-
 apps/fabric-website/package.json              |  3 +-
 apps/fabric-website/tsconfig.json             |  1 +
 apps/ssr-tests/package.json                   |  3 +-
 apps/test-bundle-button/package.json          |  3 +-
 apps/test-bundle-button/tsconfig.json         |  1 +
 apps/todo-app/package.json                    |  3 +-
 .../tslib-fix_2017-06-06-05-19.json           | 11 +++
 .../styling/tslib-fix_2017-06-06-05-19.json   | 11 +++
 .../utilities/tslib-fix_2017-06-06-05-19.json | 11 +++
 .../tslib-fix_2017-06-06-05-19.json           | 11 +++
 common/config/rush/npm-shrinkwrap.json        | 14 +--
 packages/example-app-base/gulpfile.js         |  5 +-
 packages/example-app-base/package.json        |  3 +-
 packages/example-app-base/tsconfig.json       |  1 +
 packages/example-component/gulpfile.js        |  5 +-
 packages/example-component/package.json       |  3 +-
 packages/example-component/tsconfig.json      |  1 +
 packages/office-ui-fabric-react/gulpfile.js   |  5 +-
 packages/office-ui-fabric-react/package.json  |  3 +-
 packages/office-ui-fabric-react/tsconfig.json |  1 +
 packages/styling/gulpfile.js                  | 19 +++-
 packages/styling/package.json                 |  6 +-
 .../styling/src/interfaces/ISemanticColors.ts | 88 ++++++++++++-------
 packages/styling/tsconfig.json                |  2 +-
 packages/utilities/gulpfile.js                | 10 ++-
 packages/utilities/package.json               |  3 +-
 packages/utilities/tsconfig.json              |  1 +
 30 files changed, 174 insertions(+), 59 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/tslib-fix_2017-06-06-05-19.json
 create mode 100644 common/changes/@uifabric/styling/tslib-fix_2017-06-06-05-19.json
 create mode 100644 common/changes/@uifabric/utilities/tslib-fix_2017-06-06-05-19.json
 create mode 100644 common/changes/office-ui-fabric-react/tslib-fix_2017-06-06-05-19.json

diff --git a/apps/component-demo/package.json b/apps/component-demo/package.json
index 1d42092baad55..54662af0612b2 100644
--- a/apps/component-demo/package.json
+++ b/apps/component-demo/package.json
@@ -28,6 +28,7 @@
     "office-ui-fabric-react": ">=1.5.5 <2.0.0",
     "react": ">=15.3.2 <16.0.0",
     "react-dom": ">=15.3.2 <16.0.0",
+    "tslib": "^1.6.0",
     "typescript": "2.2.2"
   }
 }
\ No newline at end of file
diff --git a/apps/component-demo/tsconfig.json b/apps/component-demo/tsconfig.json
index f287ad2753ab5..1e3d6bfc4b7c1 100644
--- a/apps/component-demo/tsconfig.json
+++ b/apps/component-demo/tsconfig.json
@@ -7,6 +7,7 @@
     "sourceMap": true,
     "experimentalDecorators": true,
     "noEmitOnError": true,
+    "importHelpers": true,
     "moduleResolution": "node",
     "types": [
       "chai",
diff --git a/apps/fabric-website/gulpfile.js b/apps/fabric-website/gulpfile.js
index 8fe20fdb16619..8bd68033321ee 100644
--- a/apps/fabric-website/gulpfile.js
+++ b/apps/fabric-website/gulpfile.js
@@ -24,8 +24,9 @@ let rules = Object.assign(
 );
 build.tslint.setConfig({
   lintConfig: { rules },
-  sourceMatch: ['src/**/*.ts', 'src/**/*.tsx', '!src/**/*.scss.tsx']
+  displayAsWarning: false
 });
+
 // TODO: remove this! There are a number of lint errors to fix.
 build.tslint.isEnabled = () => false;
 
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index de77da5232eeb..d680bf1eb3a57 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -48,11 +48,12 @@
   },
   "dependencies": {
     "@uifabric/example-app-base": "2.1.0",
+    "@uifabric/utilities": ">=4.1.0 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
     "office-ui-fabric-react": ">=4.3.1 <5.0.0",
-    "@uifabric/utilities": ">=4.1.0 <5.0.0"
+    "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/fabric-website/tsconfig.json b/apps/fabric-website/tsconfig.json
index 118321bc8ec14..08c937fedc784 100644
--- a/apps/fabric-website/tsconfig.json
+++ b/apps/fabric-website/tsconfig.json
@@ -7,6 +7,7 @@
     "declaration": true,
     "sourceMap": true,
     "experimentalDecorators": true,
+    "importHelpers": true,
     "moduleResolution": "node",
     "types": [
       "chai",
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index eb8b5b91a1855..d528b93144120 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -34,6 +34,7 @@
     "webpack-node-externals": "^1.5.4"
   },
   "dependencies": {
-    "es6-promise": "^4.1.0"
+    "es6-promise": "^4.1.0",
+    "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index fb7f857da9723..8c925ca481dfd 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,6 +33,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.3.0 <5.0.0"
+    "office-ui-fabric-react": ">=4.3.0 <5.0.0",
+    "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/test-bundle-button/tsconfig.json b/apps/test-bundle-button/tsconfig.json
index a072729ebc126..47318b8078a1a 100644
--- a/apps/test-bundle-button/tsconfig.json
+++ b/apps/test-bundle-button/tsconfig.json
@@ -7,6 +7,7 @@
     "declaration": true,
     "sourceMap": true,
     "experimentalDecorators": true,
+    "importHelpers": true,
     "moduleResolution": "node",
     "types": [
       "webpack-env"
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index c744c77740002..d5327835d8550 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -29,6 +29,7 @@
     "office-ui-fabric-react": ">=4.3.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
-    "typescript": "2.2.2"
+    "typescript": "2.2.2",
+    "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/tslib-fix_2017-06-06-05-19.json b/common/changes/@uifabric/example-app-base/tslib-fix_2017-06-06-05-19.json
new file mode 100644
index 0000000000000..30c3545f9a622
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/tslib-fix_2017-06-06-05-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Adding tslib dependency to reduce re",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/tslib-fix_2017-06-06-05-19.json b/common/changes/@uifabric/styling/tslib-fix_2017-06-06-05-19.json
new file mode 100644
index 0000000000000..987d63589537f
--- /dev/null
+++ b/common/changes/@uifabric/styling/tslib-fix_2017-06-06-05-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Adding tslib dependency to reduce re",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/tslib-fix_2017-06-06-05-19.json b/common/changes/@uifabric/utilities/tslib-fix_2017-06-06-05-19.json
new file mode 100644
index 0000000000000..7ee3d9912188f
--- /dev/null
+++ b/common/changes/@uifabric/utilities/tslib-fix_2017-06-06-05-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Adding tslib dependency to reduce re",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/tslib-fix_2017-06-06-05-19.json b/common/changes/office-ui-fabric-react/tslib-fix_2017-06-06-05-19.json
new file mode 100644
index 0000000000000..1cb29ae36babb
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/tslib-fix_2017-06-06-05-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Adding tslib dependency to reduce redundant code.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index a0aa076b511fd..4e55969f1cd72 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -2231,9 +2231,9 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000677",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000677.tgz",
-      "integrity": "sha1-E/Qh1ArhQ0cCEDxJTSxNcW4qj8s="
+      "version": "1.0.30000679",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000679.tgz",
+      "integrity": "sha1-3XvhLxZXfl1q5tuIDG1hnnfco2U="
     },
     "capture-stack-trace": {
       "version": "1.0.0",
@@ -2885,9 +2885,9 @@
       "integrity": "sha1-J0Pjq7XD/CRi5SfcpEXgTp9N7hc="
     },
     "deasync": {
-      "version": "0.1.9",
-      "resolved": "https://registry.npmjs.org/deasync/-/deasync-0.1.9.tgz",
-      "integrity": "sha1-9Y3Un6YxEMdL6oQFqQqCi+JtOiQ="
+      "version": "0.1.10",
+      "resolved": "https://registry.npmjs.org/deasync/-/deasync-0.1.10.tgz",
+      "integrity": "sha1-TkpoNvvgR3vV+Qgwi9KpZVfV1/4="
     },
     "debug": {
       "version": "2.6.7",
@@ -9755,4 +9755,4 @@
       "integrity": "sha1-RCs4+denr3rke/z8NWhz6GFq0bc="
     }
   }
-}
\ No newline at end of file
+}
diff --git a/packages/example-app-base/gulpfile.js b/packages/example-app-base/gulpfile.js
index d8cf9583ea480..b19ead1bd4d3a 100644
--- a/packages/example-app-base/gulpfile.js
+++ b/packages/example-app-base/gulpfile.js
@@ -14,7 +14,10 @@ let rules = Object.assign(
   require('./node_modules/office-ui-fabric-react-tslint/tslint.json').rules,
   require('./tslint.json').rules
 );
-build.tslint.setConfig({ lintConfig: { rules } });
+build.tslint.setConfig({
+  lintConfig: { rules },
+  displayAsWarning: false
+});
 
 // Configure TypeScript.
 build.TypeScriptConfiguration.setTypescriptCompiler(require('typescript'));
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 7d4a0f90571ff..c8b26041887b3 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -44,6 +44,7 @@
     "@uifabric/utilities": ">=4.1.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=2.0.0 <3.0.0"
+    "office-ui-fabric-react": ">=2.0.0 <3.0.0",
+    "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/example-app-base/tsconfig.json b/packages/example-app-base/tsconfig.json
index 914efa73ced5d..fce99fa3f7ac4 100644
--- a/packages/example-app-base/tsconfig.json
+++ b/packages/example-app-base/tsconfig.json
@@ -6,6 +6,7 @@
     "declaration": true,
     "sourceMap": true,
     "experimentalDecorators": true,
+    "importHelpers": true,
     "moduleResolution": "node",
     "lib": [
       "es2017",
diff --git a/packages/example-component/gulpfile.js b/packages/example-component/gulpfile.js
index c091755f4e544..68ded2f36e037 100644
--- a/packages/example-component/gulpfile.js
+++ b/packages/example-component/gulpfile.js
@@ -11,7 +11,10 @@ let rules = Object.assign(
   require('./node_modules/office-ui-fabric-react-tslint/tslint.json').rules,
   require('./tslint.json').rules
 );
-build.tslint.setConfig({ lintConfig: { rules } });
+build.tslint.setConfig({
+  lintConfig: { rules },
+  displayAsWarning: false
+});
 
 // Use css modules.
 build.sass.setConfig({
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index f376098ff20c4..e7273434597ba 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,6 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.3.1 <5.0.0"
+    "office-ui-fabric-react": ">=4.3.1 <5.0.0",
+    "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/example-component/tsconfig.json b/packages/example-component/tsconfig.json
index 7d7c6a4a5915a..66201a8633b19 100644
--- a/packages/example-component/tsconfig.json
+++ b/packages/example-component/tsconfig.json
@@ -6,6 +6,7 @@
     "noImplicitAny": false,
     "strictNullChecks": true,
     "experimentalDecorators": true,
+    "importHelpers": true,
     "moduleResolution": "node",
     "sourceMap": true,
     "jsx": "react",
diff --git a/packages/office-ui-fabric-react/gulpfile.js b/packages/office-ui-fabric-react/gulpfile.js
index 2940e5088f08b..90c173cc2bbe2 100644
--- a/packages/office-ui-fabric-react/gulpfile.js
+++ b/packages/office-ui-fabric-react/gulpfile.js
@@ -49,7 +49,10 @@ let rules = Object.assign(
   require('./node_modules/office-ui-fabric-react-tslint/tslint.json').rules,
   require('./tslint.json').rules
 );
-build.tslint.setConfig({ lintConfig: { rules } });
+build.tslint.setConfig({
+  lintConfig: { rules },
+  displayAsWarning: false
+});
 
 // Configure TypeScript.
 // build.typescript.setConfig({ typescript: require('typescript') });
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 507c8d66e4e2e..e2a73cbb00edb 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -73,7 +73,8 @@
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.1.0 <5.0.0",
     "@uifabric/styling": ">=0.5.0 <1.0.0",
-    "prop-types": "^15.5.10"
+    "prop-types": "^15.5.10",
+    "tslib": "^1.6.0"
   },
   "peerDependencies": {
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/packages/office-ui-fabric-react/tsconfig.json b/packages/office-ui-fabric-react/tsconfig.json
index b83d24ea1e409..45a6fd52e3110 100644
--- a/packages/office-ui-fabric-react/tsconfig.json
+++ b/packages/office-ui-fabric-react/tsconfig.json
@@ -7,6 +7,7 @@
     "declaration": true,
     "sourceMap": true,
     "experimentalDecorators": true,
+    "importHelpers": true,
     "moduleResolution": "node",
     "lib": [
       "es2017",
diff --git a/packages/styling/gulpfile.js b/packages/styling/gulpfile.js
index aa84b07cb5d21..c4d5fefcb3943 100644
--- a/packages/styling/gulpfile.js
+++ b/packages/styling/gulpfile.js
@@ -1,7 +1,12 @@
 'use strict';
 
 let build = require('@microsoft/sp-build-web');
+let path = require('path');
 let gulp = require('gulp');
+let buildConfig = build.getConfig();
+
+let isProduction = process.argv.indexOf('--production') >= 0;
+let isClean = process.argv.indexOf('clean') >= 0;
 
 // initialize tasks.
 build.initialize(gulp);
@@ -16,7 +21,10 @@ let rules = Object.assign(
   require('./node_modules/office-ui-fabric-react-tslint/tslint.json').rules,
   require('./tslint.json').rules
 );
-build.tslint.setConfig({ lintConfig: { rules } });
+build.tslint.setConfig({
+  lintConfig: { rules },
+  displayAsWarning: false
+});
 
 // Disable all unnecessary tasks.
 build.sass.isEnabled = () => false;
@@ -24,5 +32,14 @@ build.karma.isEnabled = () => false;
 build.text.isEnabled = () => false;
 build.preCopy.isEnabled = () => false;
 
+let packageFolder = buildConfig.packageFolder || '';
+let distFolder = buildConfig.distFolder;
+
+if (isProduction || isClean) {
+  build.setConfig({
+    libAMDFolder: path.join(packageFolder, 'lib-amd')
+  });
+}
+
 // Until typings work.
 build.apiExtractor.isEnabled = () => false;
diff --git a/packages/styling/package.json b/packages/styling/package.json
index c2475fd7ade41..ca5e198e5fc2a 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -35,7 +35,6 @@
     "react-dom": "^15.4.2",
     "source-map-loader": "^0.2.1",
     "ts-loader": "^2.1.0",
-    "tslib": "^1.6.0",
     "typescript": "2.2.2",
     "uglifyjs-webpack-plugin": "^0.4.3",
     "webpack": "^2.4.1",
@@ -47,7 +46,8 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.1.0 <5.0.0",
-    "glamor": "^2.20.24",
-    "rtl-css-js": "^1.1.0"
+    "tslib": "^1.6.0",
+    "rtl-css-js": "^1.1.0",
+    "glamor": "^2.20.24"
   }
 }
\ No newline at end of file
diff --git a/packages/styling/src/interfaces/ISemanticColors.ts b/packages/styling/src/interfaces/ISemanticColors.ts
index 938c2fa12f452..2a58cf069e4ff 100644
--- a/packages/styling/src/interfaces/ISemanticColors.ts
+++ b/packages/styling/src/interfaces/ISemanticColors.ts
@@ -1,36 +1,40 @@
 /**
- *
  * The collection of semantic slots for colors used in themes.
-
-Naming Convention 
-The name of a semantic slot can quickly tell you how it’s meant to be used. It generally follows this format: 
-[category name][element name][checked state][hovered/pressed/disabled state]  
-[category name] – The “family” that this slot belongs to. 
-[element name] – The name of the thing being targeted, such as the background or border. 
-[checked state] – Whether the thing is checked. We assume things are unchecked by default, so no need to specify the unchecked state.
-(We used “checked” to refer to anything that is on, selected, toggled, highlighted, emphasized, etc.) 
-[hovered/pressed/disabled state] – One of these states, if applicable. Each of these states are mutually exclusive.
-Pressed styles overwrite hovered styles, and disabled elements cannot be hovered or pressed.   
- 
-Base/Body
-A basic set of slots that provide many default body styles, such as text, subtext, disabled colors, error text, and so on.
-If a category doesn't provide the slot you're looking for, use one from this category.
-For example, the placeholder text on a text input field has no corresponding slot in its category,
-so you'd use the bodySubtextColor from this category. 
- 
-Input Controls 
-This category contains input components commonly used to denote state, including radio buttons,
-check boxes, toggle switches, sliders, progress bars, and more. 
- 
-Menus 
-Any kind of popup menus uses this category. 
- 
-Lists 
-Lists differ from menus in that they are designed to show infinite amounts of items, often scroll,
-and have a large and complex interaction surface.
-This category covers all kinds of lists, whether they're typical one-item-per-row lists (like DetailsList) or ones with a tiled layout.
-
-*/
+ *
+ * ## Naming Convention 
+ *
+ * The name of a semantic slot can quickly tell you how it’s meant to be used. It generally follows this format: 
+ *
+ * [category name][element name][checked state][hovered/pressed/disabled state]  
+ * [category name] – The “family” that this slot belongs to. 
+ * [element name] – The name of the thing being targeted, such as the background or border. 
+ * [checked state] – Whether the thing is checked. We assume things are unchecked by default, so no need to specify the unchecked state.
+ * (We used “checked” to refer to anything that is on, selected, toggled, highlighted, emphasized, etc.) 
+ * [hovered/pressed/disabled state] – One of these states, if applicable. Each of these states are mutually exclusive.
+ * Pressed styles overwrite hovered styles, and disabled elements cannot be hovered or pressed.   
+ *  
+ * ## Base/Body
+ *
+ * A basic set of slots that provide many default body styles, such as text, subtext, disabled colors, error text, and so on.
+ * If a category doesn't provide the slot you're looking for, use one from this category.
+ * For example, the placeholder text on a text input field has no corresponding slot in its category,
+ * so you'd use the bodySubtextColor from this category. 
+ *  
+ * ## Input Controls 
+ *
+ * This category contains input components commonly used to denote state, including radio buttons,
+ * check boxes, toggle switches, sliders, progress bars, and more. 
+ *  
+ * ## Menus 
+ *
+ * Any kind of popup menus uses this category. 
+ *  
+ * ## Lists
+ *  
+ * Lists differ from menus in that they are designed to show infinite amounts of items, often scroll,
+ * and have a large and complex interaction surface.
+ * This category covers all kinds of lists, whether they're typical one-item-per-row lists (like DetailsList) or ones with a tiled layout.
+ */
 export interface ISemanticColors {
   /* ANY ADDITIONS/REMOVALS HERE MUST ALSO BE MADE TO \packages\styling\src\utilities\theme.ts:_makeSemanticColorsFromPalette() */
 
@@ -38,14 +42,17 @@ export interface ISemanticColors {
    * The default color for backgrounds.
    */
   bodyBackground?: string;
+
   /**
    * The default color for text.
    */
   bodyText?: string;
+
   /**
    * De-emphasized text; e.g. metadata, captions, placeholder text.
    */
   bodySubtext?: string;
+
   /**
    * Divider lines; e.g. lines that separate sections in a menu, an <HR> element.
    */
@@ -55,10 +62,12 @@ export interface ISemanticColors {
    * The default color for backgrounds of disabled controls; e.g. disabled text field.
    */
   disabledBackground?: string;
+
   /**
    * The default color for disabled text; e.g. user input inside a disabled text field.
    */
   disabledText?: string;
+
   /**
    * Disabled de-emphasized text; e.g. placeholder text inside disabled input field.
    */
@@ -80,6 +89,7 @@ export interface ISemanticColors {
   errorText?: string;
 
   // Input controls slots (text fields, checkboxes, radios...)
+
   /**
    * The border of an input control in its resting, unchecked state; e.g. the box of an unchecked checkbox.
    */
@@ -88,58 +98,72 @@ export interface ISemanticColors {
    * The border color of a hovered input control.
    */
   inputBorderHovered?: string;
+
   /**
    * The background of a checked control; e.g. checked radio button's dot, checked toggle's background.
    */
   inputBackgroundChecked?: string;
+
   /**
    * The background of a checked and hovered control; e.g. checked checkbox's background color on hover.
    */
   inputBackgroundCheckedHovered?: string;
+
   /**
-   * The foreground of a checked control; e.g. checked checkbox's checkmark color, checked toggle's thumb color, radio button's background color around the dot.
+   * The foreground of a checked control; e.g. checked checkbox's checkmark color, checked toggle's thumb color,
+   * radio button's background color around the dot.
    */
   inputForegroundChecked?: string;
+
   /**
    * The alternate focus border color for elements that already have a border; e.g. text field borders on focus.
    */
   inputFocusBorderAlt?: string;
 
   // Menus, popups, etc
+
   /**
    * The background of a hovered menu item.
    */
   menuItemBackgroundHovered?: string;
+
   /**
    * The background of checked menu item; e.g. a menu item whose submenu is open, a selected dropdown item.
    */
   menuItemBackgroundChecked?: string;
+
   /**
    * The default colors of icons in menus.
    */
   menuIcon?: string;
+
   /**
    * The headers in menus that denote title of a section.
    */
   menuHeader?: string;
 
   // Lists
+
   /**
    * The background color for the entire list.
    */
   listBackground?: string;
+
   /**
    * The default text color for list item titles and text in column fields.
    */
   listTextColor?: string;
+
   /**
    * The background color of a hovered list item.
    */
   listItemBackgroundHovered?: string;
+
   /**
    * The background color of a checked list item.
    */
   listItemBackgroundChecked?: string;
+
   /**
    * The background color of a checked and hovered list item.
    */
diff --git a/packages/styling/tsconfig.json b/packages/styling/tsconfig.json
index 712011363426a..b7402a941d26b 100644
--- a/packages/styling/tsconfig.json
+++ b/packages/styling/tsconfig.json
@@ -7,8 +7,8 @@
     "declaration": true,
     "sourceMap": true,
     "experimentalDecorators": true,
-    "moduleResolution": "node",
     "importHelpers": true,
+    "moduleResolution": "node",
     "lib": [
       "es2017",
       "dom"
diff --git a/packages/utilities/gulpfile.js b/packages/utilities/gulpfile.js
index bd1fe240e9a78..b5238c40e78a0 100644
--- a/packages/utilities/gulpfile.js
+++ b/packages/utilities/gulpfile.js
@@ -8,6 +8,9 @@ let buildConfig = build.getConfig();
 let isProduction = process.argv.indexOf('--production') >= 0;
 let isClean = process.argv.indexOf('clean') >= 0;
 
+// initialize tasks.
+build.initialize(gulp);
+
 /* Configure lint rules */
 let rules = Object.assign(
   {},
@@ -15,7 +18,10 @@ let rules = Object.assign(
   require('./node_modules/office-ui-fabric-react-tslint/tslint.json').rules,
   require('./tslint.json').rules
 );
-build.tslint.setConfig({ lintConfig: { rules } });
+build.tslint.setConfig({
+  lintConfig: { rules },
+  displayAsWarning: false
+});
 
 // Configure TypeScript.
 build.TypeScriptConfiguration.setTypescriptCompiler(require('typescript'));
@@ -37,5 +43,3 @@ if (isProduction || isClean) {
 
 build.task('tslint', build.tslint);
 
-// initialize tasks.
-build.initialize(gulp);
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 616f613c357ad..8c95cfcd4f985 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -41,7 +41,8 @@
     "typescript": "2.2.2"
   },
   "dependencies": {
-    "prop-types": "^15.5.10"
+    "prop-types": "^15.5.10",
+    "tslib": "^1.6.0"
   },
   "peerDependencies": {
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/packages/utilities/tsconfig.json b/packages/utilities/tsconfig.json
index cac8e4a478dfa..df37502ab300d 100644
--- a/packages/utilities/tsconfig.json
+++ b/packages/utilities/tsconfig.json
@@ -10,6 +10,7 @@
     "declaration": true,
     "sourceMap": true,
     "experimentalDecorators": true,
+    "importHelpers": true,
     "moduleResolution": "node",
     "types": [
       "chai",

From fca3c2f6be156667613a196fe79cc450f231d3e3 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 6 Jun 2017 06:06:47 +0000
Subject: [PATCH 0072/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 18 +++++++++++
 apps/fabric-website/CHANGELOG.md              |  7 ++++-
 apps/fabric-website/package.json              |  8 ++---
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../tslib-fix_2017-06-06-05-19.json           | 11 -------
 .../styling/createtheme_2017-06-06-01-00.json | 11 -------
 .../phkuo-glamor_2017-05-31-22-58.json        | 11 -------
 .../styling/tslib-fix_2017-06-06-05-19.json   | 11 -------
 .../utilities/tslib-fix_2017-06-06-05-19.json | 11 -------
 .../tslib-fix_2017-06-06-05-19.json           | 11 -------
 packages/example-app-base/CHANGELOG.json      | 22 +++++++++++++
 packages/example-app-base/CHANGELOG.md        |  9 +++++-
 packages/example-app-base/package.json        |  6 ++--
 packages/example-component/package.json       |  8 ++---
 .../office-ui-fabric-react/CHANGELOG.json     | 25 +++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 +++++-
 packages/office-ui-fabric-react/package.json  |  8 ++---
 packages/styling/CHANGELOG.json               | 31 +++++++++++++++++++
 packages/styling/CHANGELOG.md                 | 14 ++++++++-
 packages/styling/package.json                 |  4 +--
 packages/utilities/CHANGELOG.json             | 14 +++++++++
 packages/utilities/CHANGELOG.md               |  9 +++++-
 packages/utilities/package.json               |  2 +-
 25 files changed, 174 insertions(+), 92 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/tslib-fix_2017-06-06-05-19.json
 delete mode 100644 common/changes/@uifabric/styling/createtheme_2017-06-06-01-00.json
 delete mode 100644 common/changes/@uifabric/styling/phkuo-glamor_2017-05-31-22-58.json
 delete mode 100644 common/changes/@uifabric/styling/tslib-fix_2017-06-06-05-19.json
 delete mode 100644 common/changes/@uifabric/utilities/tslib-fix_2017-06-06-05-19.json
 delete mode 100644 common/changes/office-ui-fabric-react/tslib-fix_2017-06-06-05-19.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 6df3939500782..33e2a42e10416 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,24 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.5.33",
+      "tag": "@uifabric/fabric-website_v4.5.33",
+      "date": "Tue, 06 Jun 2017 06:06:46 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `2.1.0` to `2.1.1`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.1.0 <5.0.0` to `>=4.1.1 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.3.1 <5.0.0` to `>=4.3.2 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.5.32",
       "tag": "@uifabric/fabric-website_v4.5.32",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 5be76b0a23a85..2fc3fbd3a2a21 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Tue, 06 Jun 2017 00:50:06 GMT and should not be manually modified.
+This log was last generated on Tue, 06 Jun 2017 06:06:46 GMT and should not be manually modified.
+
+## 4.5.33
+Tue, 06 Jun 2017 06:06:46 GMT
+
+*Changes not tracked*
 
 ## 4.5.32
 Tue, 06 Jun 2017 00:50:06 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index d680bf1eb3a57..235377ea084cd 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.5.32",
+  "version": "4.5.33",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,13 +47,13 @@
     "webpack-bundle-analyzer": "^2.2.1"
   },
   "dependencies": {
-    "@uifabric/example-app-base": "2.1.0",
-    "@uifabric/utilities": ">=4.1.0 <5.0.0",
+    "@uifabric/example-app-base": "2.1.1",
+    "@uifabric/utilities": ">=4.1.1 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=4.3.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.3.2 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index d528b93144120..568544368c2a2 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -25,7 +25,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.3.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.3.2 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 8c925ca481dfd..347546ed76bb4 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.3.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.3.2 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index d5327835d8550..abf529764348c 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=4.3.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.3.2 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/@uifabric/example-app-base/tslib-fix_2017-06-06-05-19.json b/common/changes/@uifabric/example-app-base/tslib-fix_2017-06-06-05-19.json
deleted file mode 100644
index 30c3545f9a622..0000000000000
--- a/common/changes/@uifabric/example-app-base/tslib-fix_2017-06-06-05-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Adding tslib dependency to reduce re",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/createtheme_2017-06-06-01-00.json b/common/changes/@uifabric/styling/createtheme_2017-06-06-01-00.json
deleted file mode 100644
index 27dfff055d750..0000000000000
--- a/common/changes/@uifabric/styling/createtheme_2017-06-06-01-00.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "createTheme: adding to exports",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/phkuo-glamor_2017-05-31-22-58.json b/common/changes/@uifabric/styling/phkuo-glamor_2017-05-31-22-58.json
deleted file mode 100644
index 25d0775f40bbc..0000000000000
--- a/common/changes/@uifabric/styling/phkuo-glamor_2017-05-31-22-58.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "add more semantic color slots",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "phkuo@microsoft.com"
-}
diff --git a/common/changes/@uifabric/styling/tslib-fix_2017-06-06-05-19.json b/common/changes/@uifabric/styling/tslib-fix_2017-06-06-05-19.json
deleted file mode 100644
index 987d63589537f..0000000000000
--- a/common/changes/@uifabric/styling/tslib-fix_2017-06-06-05-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Adding tslib dependency to reduce re",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/tslib-fix_2017-06-06-05-19.json b/common/changes/@uifabric/utilities/tslib-fix_2017-06-06-05-19.json
deleted file mode 100644
index 7ee3d9912188f..0000000000000
--- a/common/changes/@uifabric/utilities/tslib-fix_2017-06-06-05-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Adding tslib dependency to reduce re",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/tslib-fix_2017-06-06-05-19.json b/common/changes/office-ui-fabric-react/tslib-fix_2017-06-06-05-19.json
deleted file mode 100644
index 1cb29ae36babb..0000000000000
--- a/common/changes/office-ui-fabric-react/tslib-fix_2017-06-06-05-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Adding tslib dependency to reduce redundant code.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 7705fb4c98cfa..3f9794ea3ef3c 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "2.1.1",
+      "tag": "@uifabric/example-app-base_v2.1.1",
+      "date": "Tue, 06 Jun 2017 06:06:46 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "1820479f14ee2ddd8b6c926f7420aac1415feaa2",
+            "comment": "Adding tslib dependency to reduce re"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.5.0 <1.0.0` to `>=0.6.0 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.1.0 <5.0.0` to `>=4.1.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "2.1.0",
       "tag": "@uifabric/example-app-base_v2.1.0",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index 4f5afd4854bbb..f84095b360901 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Tue, 06 Jun 2017 00:50:06 GMT and should not be manually modified.
+This log was last generated on Tue, 06 Jun 2017 06:06:46 GMT and should not be manually modified.
+
+## 2.1.1
+Tue, 06 Jun 2017 06:06:46 GMT
+
+### Patches
+
+- Adding tslib dependency to reduce re
 
 ## 2.1.0
 Tue, 06 Jun 2017 00:50:06 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index c8b26041887b3..b301f16bda9f9 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "2.1.0",
+  "version": "2.1.1",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -40,8 +40,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.5.0 <1.0.0",
-    "@uifabric/utilities": ">=4.1.0 <5.0.0",
+    "@uifabric/styling": ">=0.6.0 <1.0.0",
+    "@uifabric/utilities": ">=4.1.1 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
     "office-ui-fabric-react": ">=2.0.0 <3.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index e7273434597ba..41b5573906928 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-component",
-  "version": "1.0.31",
+  "version": "1.0.32",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -21,8 +21,8 @@
     "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "2.1.0",
-    "@uifabric/utilities": "4.1.0",
+    "@uifabric/example-app-base": "2.1.1",
+    "@uifabric/utilities": "4.1.1",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.3.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.3.2 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 9fc54a10cbb87..d3fd7e9a6b7db 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,31 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.3.2",
+      "tag": "office-ui-fabric-react_v4.3.2",
+      "date": "Tue, 06 Jun 2017 06:06:46 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "1820479f14ee2ddd8b6c926f7420aac1415feaa2",
+            "comment": "Adding tslib dependency to reduce redundant code."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.1.0 <5.0.0` to `>=4.1.1 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.5.0 <1.0.0` to `>=0.6.0 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `2.1.0` to `2.1.1`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.3.1",
       "tag": "office-ui-fabric-react_v4.3.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 85c52343409f2..3e75ff08f0f13 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 06 Jun 2017 00:50:06 GMT and should not be manually modified.
+This log was last generated on Tue, 06 Jun 2017 06:06:46 GMT and should not be manually modified.
+
+## 4.3.2
+Tue, 06 Jun 2017 06:06:46 GMT
+
+### Patches
+
+- Adding tslib dependency to reduce redundant code.
 
 ## 4.3.1
 Tue, 06 Jun 2017 00:50:06 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index e2a73cbb00edb..f8bb21b5292dc 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.3.1",
+  "version": "4.3.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "^2.2.2",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "2.1.0",
+    "@uifabric/example-app-base": "2.1.1",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -71,8 +71,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.1.0 <5.0.0",
-    "@uifabric/styling": ">=0.5.0 <1.0.0",
+    "@uifabric/utilities": ">=4.1.1 <5.0.0",
+    "@uifabric/styling": ">=0.6.0 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 79fc1474261e8..37b19963bf088 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,37 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.6.0",
+      "tag": "@uifabric/styling_v0.6.0",
+      "date": "Tue, 06 Jun 2017 06:06:46 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "1a785e3c7ab9adc1578ce528dffabcd186d3ccfc",
+            "comment": "createTheme: adding to exports"
+          },
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "652aaea46284e84a403060c3936af239e92c9af0",
+            "comment": "add more semantic color slots"
+          }
+        ],
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "1820479f14ee2ddd8b6c926f7420aac1415feaa2",
+            "comment": "Adding tslib dependency to reduce re"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.1.0 <5.0.0` to `>=4.1.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.5.0",
       "tag": "@uifabric/styling_v0.5.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index a884d6117cd4c..6a41987cb1515 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,18 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Tue, 06 Jun 2017 00:50:06 GMT and should not be manually modified.
+This log was last generated on Tue, 06 Jun 2017 06:06:46 GMT and should not be manually modified.
+
+## 0.6.0
+Tue, 06 Jun 2017 06:06:46 GMT
+
+### Minor changes
+
+- createTheme: adding to exports
+- add more semantic color slots
+
+### Patches
+
+- Adding tslib dependency to reduce re
 
 ## 0.5.0
 Tue, 06 Jun 2017 00:50:06 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index ca5e198e5fc2a..574e1618670fd 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.5.0",
+  "version": "0.6.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.1.0 <5.0.0",
+    "@uifabric/utilities": ">=4.1.1 <5.0.0",
     "tslib": "^1.6.0",
     "rtl-css-js": "^1.1.0",
     "glamor": "^2.20.24"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index aa8c8a8505389..78364ec8f4778 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.1.1",
+      "tag": "@uifabric/utilities_v4.1.1",
+      "date": "Tue, 06 Jun 2017 06:06:46 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "1820479f14ee2ddd8b6c926f7420aac1415feaa2",
+            "comment": "Adding tslib dependency to reduce re"
+          }
+        ]
+      }
+    },
     {
       "version": "4.1.0",
       "tag": "@uifabric/utilities_v4.1.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index dad34e314cf2e..d9375fa34ed5f 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Tue, 06 Jun 2017 00:50:06 GMT and should not be manually modified.
+This log was last generated on Tue, 06 Jun 2017 06:06:46 GMT and should not be manually modified.
+
+## 4.1.1
+Tue, 06 Jun 2017 06:06:46 GMT
+
+### Patches
+
+- Adding tslib dependency to reduce re
 
 ## 4.1.0
 Tue, 06 Jun 2017 00:50:06 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 8c95cfcd4f985..b85e17b3be16f 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.1.0",
+  "version": "4.1.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 72be6cc47ebd962cfe24d932415d0f3d41883469 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 6 Jun 2017 00:28:41 -0700
Subject: [PATCH 0073/1641] Toggle: theme is now injectable. (#1943)

* Updating toggle to have a customizable theme.

* Adding changefile.

* Removing getTheme initializer which doesn't work in a memoized function.
---
 .../toggle_2017-06-06-07-11.json                      | 11 +++++++++++
 .../Button/DefaultButton/DefaultButton.styles.ts      |  3 +--
 .../src/components/Toggle/Toggle.Props.ts             |  7 ++++++-
 .../src/components/Toggle/Toggle.styles.ts            |  3 +--
 .../src/components/Toggle/Toggle.test.tsx             | 11 +++++++++--
 .../src/components/Toggle/Toggle.tsx                  |  7 ++++++-
 6 files changed, 34 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/toggle_2017-06-06-07-11.json

diff --git a/common/changes/office-ui-fabric-react/toggle_2017-06-06-07-11.json b/common/changes/office-ui-fabric-react/toggle_2017-06-06-07-11.json
new file mode 100644
index 0000000000000..094a12ac55b5d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/toggle_2017-06-06-07-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Toggle: theme now injectable through Customizer.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
index 9cbe13fdd2cce..6a005bd8194d5 100644
--- a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
@@ -1,7 +1,6 @@
 import { IButtonStyles } from '../Button.Props';
 import {
   ITheme,
-  getTheme,
   mergeStyleSets
 } from '../../../Styling';
 import { memoizeFunction } from '../../../Utilities';
@@ -14,7 +13,7 @@ const DEFAULT_BUTTON_MINWIDTH = '80px';
 const DEFAULT_PADDING = '0 16px';
 
 export const getStyles = memoizeFunction((
-  theme: ITheme = getTheme(),
+  theme: ITheme,
   customStyles?: IButtonStyles,
   focusInset?: string,
   focusColor?: string
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.Props.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.Props.ts
index 66acc45a4a66e..39b3483ff5523 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.Props.ts
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { Toggle } from './Toggle';
-import { IStyle } from '../../Styling';
+import { IStyle, ITheme } from '../../Styling';
 
 export interface IToggle {
   focus: () => void;
@@ -61,6 +61,11 @@ export interface IToggleProps extends React.HTMLProps<HTMLElement | Toggle> {
    */
   onChanged?: (checked: boolean) => void;
 
+  /**
+   * Theme provided by HOC.
+   */
+  theme?: ITheme;
+
   /**
    * Custom styles for this component
    */
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts
index 49faaf10ba73c..368a57431e591 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts
@@ -1,14 +1,13 @@
 import { IToggleStyles } from './Toggle.Props';
 import {
   ITheme,
-  getTheme,
   mergeStyleSets,
   getFocusStyle
 } from '../../Styling';
 import { memoizeFunction } from '../../Utilities';
 
 export const getStyles = memoizeFunction((
-  theme: ITheme = getTheme(),
+  theme: ITheme,
   customStyles?: IToggleStyles
 ): IToggleStyles => {
   const { semanticColors } = theme;
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
index 6ee1c52d5bc2f..25c5697478770 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
@@ -28,8 +28,11 @@ describe('Toggle', () => {
     let callback = (isToggled) => {
       isToggledValue = isToggled;
     };
-    let component = ReactTestUtils.renderIntoDocument<React.ReactInstance>(
+    let component;
+
+    ReactTestUtils.renderIntoDocument<React.ReactInstance>(
       <Toggle
+        componentRef={ ref => component = ref }
         label='Label'
         onChanged={ callback }
       />
@@ -43,8 +46,11 @@ describe('Toggle', () => {
   });
 
   it(`doesn't update the state if the user provides checked`, () => {
-    let component = ReactTestUtils.renderIntoDocument(
+    let component;
+
+    ReactTestUtils.renderIntoDocument(
       <Toggle
+        componentRef={ ref => component = ref }
         label='Label'
         checked={ false }
       />
@@ -66,6 +72,7 @@ describe('Toggle', () => {
     let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
     let label = renderedDOM.querySelector('label');
 
+    // tslint:disable-next-line:no-unused-expression
     expect(label).is.null;
   });
 
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
index 3c4ee0b7cbca7..ef5afb7c12640 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
@@ -13,6 +13,9 @@ import {
   IToggleStyles
 } from './Toggle.Props';
 import { Label } from '../../Label';
+import {
+  customizable
+} from '../../Utilities';
 import {
   mergeStyles
 } from '../../Styling';
@@ -32,6 +35,7 @@ interface IToggleClassNames {
   text: string;
 }
 
+@customizable(['theme'])
 export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements IToggle {
 
   private _id: string;
@@ -74,6 +78,7 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
 
     let {
       className,
+      theme,
       styles: customStyles,
       disabled,
       label,
@@ -87,7 +92,7 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
     const ariaLabel = isChecked ? onAriaLabel : offAriaLabel;
     const toggleNativeProps = getNativeProps(this.props, inputProperties, ['defaultChecked']);
     const classNames = this._getClassNames(
-      getStyles(undefined, customStyles),
+      getStyles(theme, customStyles),
       className,
       disabled,
       isChecked

From 62137619670c66933852601cac1f610849587f4b Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 6 Jun 2017 07:41:47 +0000
Subject: [PATCH 0074/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 15 +++++++++++++
 apps/fabric-website/CHANGELOG.md              |  7 +++++-
 apps/fabric-website/package.json              |  6 ++---
 .../toggle_2017-06-06-07-11.json              | 11 ----------
 packages/example-app-base/CHANGELOG.json      | 12 ++++++++++
 packages/example-app-base/CHANGELOG.md        |  7 +++++-
 packages/example-app-base/package.json        |  4 ++--
 packages/example-component/package.json       |  6 ++---
 .../office-ui-fabric-react/CHANGELOG.json     | 22 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 +++++++-
 packages/office-ui-fabric-react/package.json  |  6 ++---
 packages/styling/CHANGELOG.json               |  6 +++++
 packages/styling/CHANGELOG.md                 |  7 +++++-
 packages/styling/package.json                 |  2 +-
 14 files changed, 93 insertions(+), 27 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/toggle_2017-06-06-07-11.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 33e2a42e10416..552e696978b8b 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,21 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.5.34",
+      "tag": "@uifabric/fabric-website_v4.5.34",
+      "date": "Tue, 06 Jun 2017 07:41:47 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `2.1.1` to `2.1.2`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.3.2 <5.0.0` to `>=4.4.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.5.33",
       "tag": "@uifabric/fabric-website_v4.5.33",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 2fc3fbd3a2a21..d14541422cbd5 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Tue, 06 Jun 2017 06:06:46 GMT and should not be manually modified.
+This log was last generated on Tue, 06 Jun 2017 07:41:47 GMT and should not be manually modified.
+
+## 4.5.34
+Tue, 06 Jun 2017 07:41:47 GMT
+
+*Changes not tracked*
 
 ## 4.5.33
 Tue, 06 Jun 2017 06:06:46 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 235377ea084cd..a296b4a5615d3 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.5.33",
+  "version": "4.5.34",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,13 +47,13 @@
     "webpack-bundle-analyzer": "^2.2.1"
   },
   "dependencies": {
-    "@uifabric/example-app-base": "2.1.1",
+    "@uifabric/example-app-base": "2.1.2",
     "@uifabric/utilities": ">=4.1.1 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=4.3.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.4.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/toggle_2017-06-06-07-11.json b/common/changes/office-ui-fabric-react/toggle_2017-06-06-07-11.json
deleted file mode 100644
index 094a12ac55b5d..0000000000000
--- a/common/changes/office-ui-fabric-react/toggle_2017-06-06-07-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Toggle: theme now injectable through Customizer.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 3f9794ea3ef3c..7f56b8581239a 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,18 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "2.1.2",
+      "tag": "@uifabric/example-app-base_v2.1.2",
+      "date": "Tue, 06 Jun 2017 07:41:47 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.6.0 <1.0.0` to `>=0.6.1 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "2.1.1",
       "tag": "@uifabric/example-app-base_v2.1.1",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index f84095b360901..f86e1e4e0c139 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Tue, 06 Jun 2017 06:06:46 GMT and should not be manually modified.
+This log was last generated on Tue, 06 Jun 2017 07:41:47 GMT and should not be manually modified.
+
+## 2.1.2
+Tue, 06 Jun 2017 07:41:47 GMT
+
+*Changes not tracked*
 
 ## 2.1.1
 Tue, 06 Jun 2017 06:06:46 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index b301f16bda9f9..f1b3ac7dc1b0b 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "2.1.1",
+  "version": "2.1.2",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -40,7 +40,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.6.0 <1.0.0",
+    "@uifabric/styling": ">=0.6.1 <1.0.0",
     "@uifabric/utilities": ">=4.1.1 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 41b5573906928..0f1a59d049299 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-component",
-  "version": "1.0.32",
+  "version": "1.0.33",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -21,7 +21,7 @@
     "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "2.1.1",
+    "@uifabric/example-app-base": "2.1.2",
     "@uifabric/utilities": "4.1.1",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.3.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.4.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index d3fd7e9a6b7db..cfadc253ba94b 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.4.0",
+      "tag": "office-ui-fabric-react_v4.4.0",
+      "date": "Tue, 06 Jun 2017 07:41:47 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "72be6cc47ebd962cfe24d932415d0f3d41883469",
+            "comment": "Toggle: theme now injectable through Customizer."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.6.0 <1.0.0` to `>=0.6.1 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `2.1.1` to `2.1.2`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.3.2",
       "tag": "office-ui-fabric-react_v4.3.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 3e75ff08f0f13..f44b200efa720 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 06 Jun 2017 06:06:46 GMT and should not be manually modified.
+This log was last generated on Tue, 06 Jun 2017 07:41:47 GMT and should not be manually modified.
+
+## 4.4.0
+Tue, 06 Jun 2017 07:41:47 GMT
+
+### Minor changes
+
+- Toggle: theme now injectable through Customizer.
 
 ## 4.3.2
 Tue, 06 Jun 2017 06:06:46 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index f8bb21b5292dc..d17bfa6e48190 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.3.2",
+  "version": "4.4.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "^2.2.2",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "2.1.1",
+    "@uifabric/example-app-base": "2.1.2",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.1.1 <5.0.0",
-    "@uifabric/styling": ">=0.6.0 <1.0.0",
+    "@uifabric/styling": ">=0.6.1 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 37b19963bf088..f38aad554754b 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.6.1",
+      "tag": "@uifabric/styling_v0.6.1",
+      "date": "Tue, 06 Jun 2017 07:41:47 GMT",
+      "comments": {}
+    },
     {
       "version": "0.6.0",
       "tag": "@uifabric/styling_v0.6.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 6a41987cb1515..a8a1b09992fa1 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Tue, 06 Jun 2017 06:06:46 GMT and should not be manually modified.
+This log was last generated on Tue, 06 Jun 2017 07:41:47 GMT and should not be manually modified.
+
+## 0.6.1
+Tue, 06 Jun 2017 07:41:47 GMT
+
+*Changes not tracked*
 
 ## 0.6.0
 Tue, 06 Jun 2017 06:06:46 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 574e1618670fd..0dc9af9ba38a8 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.6.0",
+  "version": "0.6.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 3f42fef914dcbb2c26417d2b6c998d3c7cfc7599 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 7 Jun 2017 08:29:09 -0700
Subject: [PATCH 0075/1641] Updating node max version. (#1940)

* Updating node.

* Update rush.json
---
 .travis.yml | 2 +-
 rush.json   | 6 +++---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/.travis.yml b/.travis.yml
index 7927295fb720c..900094a3d1334 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -1,6 +1,6 @@
 language: node_js
 node_js:
-  - '6'
+  - '8'
 before_script:
   - npm install -g gulp
 script:
diff --git a/rush.json b/rush.json
index 44266d69d03ac..6a2859648d2d5 100644
--- a/rush.json
+++ b/rush.json
@@ -1,7 +1,7 @@
 {
-  "npmVersion": "5.0.0",
+  "npmVersion": "5.0.3",
   "rushMinimumVersion": "3.0.7",
-  "nodeSupportedVersionRange": ">=6.9.0 <8.0.0",
+  "nodeSupportedVersionRange": ">=6.9.0 <9.0.0",
   "projectFolderMinDepth": 1,
   "projectFolderMaxDepth": 999,
   "projects": [
@@ -63,4 +63,4 @@
       "shouldPublish": false
     }
   ]
-}
\ No newline at end of file
+}

From 58ebffae702a799225c3c09d94175bffd85b2986 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Wed, 7 Jun 2017 08:54:31 -0700
Subject: [PATCH 0076/1641] Palette not optional (#1951)

* Make palette and font required for theme

* Rush change

* Update ThemePage.tsx

* Rename theme to palette.
---
 .../palette-not-optional_2017-06-07-06-56.json        | 11 +++++++++++
 .../palette-not-optional_2017-06-07-06-56.json        | 11 +++++++++++
 .../src/components/Theme/ThemePage.tsx                |  8 ++++----
 packages/styling/src/utilities/theme.ts               |  8 ++++----
 4 files changed, 30 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/palette-not-optional_2017-06-07-06-56.json
 create mode 100644 common/changes/office-ui-fabric-react/palette-not-optional_2017-06-07-06-56.json

diff --git a/common/changes/@uifabric/styling/palette-not-optional_2017-06-07-06-56.json b/common/changes/@uifabric/styling/palette-not-optional_2017-06-07-06-56.json
new file mode 100644
index 0000000000000..919622252dcf8
--- /dev/null
+++ b/common/changes/@uifabric/styling/palette-not-optional_2017-06-07-06-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "ITheme: Make palette a required prop",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "chrisgo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/palette-not-optional_2017-06-07-06-56.json b/common/changes/office-ui-fabric-react/palette-not-optional_2017-06-07-06-56.json
new file mode 100644
index 0000000000000..b0fe8eef65633
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/palette-not-optional_2017-06-07-06-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ITheme: Make palette a required prop",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chrisgo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
index cd61d36733073..b565083304bd1 100644
--- a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { loadTheme, FontClassNames, ITheme } from 'office-ui-fabric-react/lib/Styling';
+import { loadTheme, FontClassNames, ITheme, IPalette } from 'office-ui-fabric-react/lib/Styling';
 import { Highlight } from '@uifabric/example-app-base';
 import { defaultTheme } from './defaultTheme';
 import { Callout } from 'office-ui-fabric-react/lib/Callout';
@@ -115,17 +115,17 @@ export class ThemePage extends React.Component<any, any> {
   private _onColorChanged(index: number, newColor: string) {
     let { colors } = this.state;
     let color = colors[index];
-    let theme: ITheme = {};
+    let palette: Partial<IPalette> = {};
 
     color.value = newColor;
 
     for (let i = 0; i < colors.length; i++) {
       let themeColor = colors[i];
 
-      theme[themeColor.key] = themeColor.value;
+      palette[themeColor.key] = themeColor.value;
     }
 
-    loadTheme({ palette: theme });
+    loadTheme({ palette });
 
     // The theme has changed values, but color state is the same. Force an update on the list.
     this.refs.list.forceUpdate();
diff --git a/packages/styling/src/utilities/theme.ts b/packages/styling/src/utilities/theme.ts
index 680ec7dff0b57..a4d6166a9a829 100644
--- a/packages/styling/src/utilities/theme.ts
+++ b/packages/styling/src/utilities/theme.ts
@@ -9,8 +9,8 @@ import {
 } from '../styles/index';
 import { Customizer } from '@uifabric/utilities/lib/index';
 export interface ITheme {
-  palette?: IPalette;
-  fonts?: IFontStyles;
+  palette: IPalette;
+  fonts: IFontStyles;
   semanticColors?: ISemanticColors;
 }
 import { loadTheme as legacyLoadTheme } from '@microsoft/load-themed-styles';
@@ -33,7 +33,7 @@ export function getTheme(): ITheme {
 /**
  * Loads the default global theme definition.
  */
-export function loadTheme(theme: ITheme): void {
+export function loadTheme(theme: Partial<ITheme>): void {
   _theme = createTheme(theme);
 
   // Load the legacy theme from the palette.
@@ -45,7 +45,7 @@ export function loadTheme(theme: ITheme): void {
 /**
  * Creates a custom theme definition which can be used with the Customizer.
  */
-export function createTheme(theme: ITheme): ITheme {
+export function createTheme(theme: Partial<ITheme>): ITheme {
   let newPalette = {
     ..._theme.palette,
     ...theme.palette

From f382123efa18802b5f86f4be669c5b34847872d4 Mon Sep 17 00:00:00 2001
From: soorajpurandare <soorajashutosh@gmail.com>
Date: Wed, 7 Jun 2017 14:30:20 -0700
Subject: [PATCH 0077/1641] Adding a  try catch around set RTL (#1950)

* Adding a  try catch around set RTL

* Fixing a typo comment

* Adding the change file
---
 .../sopurand-TryCatchForRTL_2017-06-07-18-51.json     | 11 +++++++++++
 packages/utilities/src/rtl.ts                         |  6 +++++-
 2 files changed, 16 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/utilities/sopurand-TryCatchForRTL_2017-06-07-18-51.json

diff --git a/common/changes/@uifabric/utilities/sopurand-TryCatchForRTL_2017-06-07-18-51.json b/common/changes/@uifabric/utilities/sopurand-TryCatchForRTL_2017-06-07-18-51.json
new file mode 100644
index 0000000000000..f3447c83dc71c
--- /dev/null
+++ b/common/changes/@uifabric/utilities/sopurand-TryCatchForRTL_2017-06-07-18-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Adding a try-catch around setting RTL in local storage for the browser",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "sopurand@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/src/rtl.ts b/packages/utilities/src/rtl.ts
index 80f7c7a60ec31..04fa5b623312b 100644
--- a/packages/utilities/src/rtl.ts
+++ b/packages/utilities/src/rtl.ts
@@ -49,7 +49,11 @@ export function setRTL(isRTL: boolean, avoidPersisting = false) {
   let win = getWindow();
   // tslint:disable-next-line:no-string-literal
   if (win && win['localStorage'] && !avoidPersisting) {
-    localStorage.setItem('isRTL', isRTL ? '1' : '0');
+    try {
+      localStorage.setItem('isRTL', isRTL ? '1' : '0');
+    } catch (e) {
+      /*  swallow the exception, because safari private mode does not have local storage */
+    }
   }
 
   _isRTL = isRTL;

From 437a52303c48ddf8bd7418446606586196972795 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 7 Jun 2017 16:56:35 -0700
Subject: [PATCH 0078/1641] Example app base fix (#1953)

* It seems the example-app-base didn't get published correctly, and the fabric-react version dependency is really old.

* Adding major bump changefile.
---
 .../example-app-base-fix_2017-06-07-23-54.json        | 11 +++++++++++
 packages/example-app-base/package.json                |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/example-app-base/example-app-base-fix_2017-06-07-23-54.json

diff --git a/common/changes/@uifabric/example-app-base/example-app-base-fix_2017-06-07-23-54.json b/common/changes/@uifabric/example-app-base/example-app-base-fix_2017-06-07-23-54.json
new file mode 100644
index 0000000000000..c7d7ce12a192b
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/example-app-base-fix_2017-06-07-23-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Bumping fabric dependency in example-app-base",
+      "type": "major"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index f1b3ac7dc1b0b..5cdb392c60fb2 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -44,7 +44,7 @@
     "@uifabric/utilities": ">=4.1.1 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=2.0.0 <3.0.0",
+    "office-ui-fabric-react": ">=4.4.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file

From b3d08ff4caf36ccedfb2198bcdc229121974e713 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 7 Jun 2017 17:04:11 -0700
Subject: [PATCH 0079/1641] Fixing shrinkwrap.

---
 common/config/rush/npm-shrinkwrap.json | 529 ++++++++++++++++---------
 1 file changed, 349 insertions(+), 180 deletions(-)

diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 4e55969f1cd72..bb33295801cc4 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -73,9 +73,14 @@
           "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "sinon": {
           "version": "1.17.7",
@@ -95,9 +100,9 @@
           "integrity": "sha1-Qyqbv9Uab8AHmPTSUmqCnAYGh6w="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -198,14 +203,19 @@
           "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -252,9 +262,21 @@
       "integrity": "sha1-GDC9288QFxLKJgIX5Vq3RKUgQdw="
     },
     "@microsoft/loader-cased-file": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-cased-file/-/loader-cased-file-1.0.0.tgz",
-      "integrity": "sha1-2juX73tbnVGI1IT1a+Vs6QRzQSw="
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-cased-file/-/loader-cased-file-1.0.1.tgz",
+      "integrity": "sha1-89JNxxtO1lEt6I+u0AyCf5ehWhY=",
+      "dependencies": {
+        "@types/node": {
+          "version": "6.0.64",
+          "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.64.tgz",
+          "integrity": "sha1-zckBQR9jAeFDff7SO8aPVEQuTcg="
+        },
+        "loader-utils": {
+          "version": "0.2.16",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.16.tgz",
+          "integrity": "sha1-8IYyBm7YKCg13/iN+1JwR2Wt7m0="
+        }
+      }
     },
     "@microsoft/loader-load-themed-styles": {
       "version": "0.0.5",
@@ -413,9 +435,9 @@
           "integrity": "sha1-aHKCNTXGkuLCoBA4Jq/YLC4P8XU="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
         },
         "resolve": {
           "version": "1.1.7",
@@ -427,6 +449,11 @@
           "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
           "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
         },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+        },
         "send": {
           "version": "0.13.2",
           "resolved": "https://registry.npmjs.org/send/-/send-0.13.2.tgz",
@@ -443,9 +470,9 @@
           "integrity": "sha1-3e1FzBglbVHtQK7BQkidXGECbSg="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -634,11 +661,6 @@
           "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-3.1.0.tgz",
           "integrity": "sha1-ogU4P+oyKzO1rjsYq+4NwvNW7hU="
         },
-        "lazy-req": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/lazy-req/-/lazy-req-2.0.0.tgz",
-          "integrity": "sha1-yUUKNj7N2i5vDHATKtTzf48G8rQ="
-        },
         "package-json": {
           "version": "4.0.1",
           "resolved": "https://registry.npmjs.org/package-json/-/package-json-4.0.1.tgz",
@@ -670,9 +692,9 @@
           "integrity": "sha1-0vD3N9FrBhXnKmk17QQhRXLVb5c="
         },
         "update-notifier": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-2.1.0.tgz",
-          "integrity": "sha1-7AweU1NrdmR6JLd8uDlm2TFRI9k="
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-2.2.0.tgz",
+          "integrity": "sha1-G1g3z5DAc22IYncytmHBOPht5y8="
         },
         "write-file-atomic": {
           "version": "2.1.0",
@@ -1133,6 +1155,10 @@
     "@rush-temp/styling": {
       "version": "file:projects/styling",
       "dependencies": {
+        "@uifabric/utilities": {
+          "version": "1.10.2",
+          "bundled": true
+        },
         "acorn": {
           "version": "5.0.3",
           "bundled": true
@@ -1185,6 +1211,10 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "office-ui-fabric-react": {
+          "version": "2.34.2",
+          "bundled": true
+        },
         "os-browserify": {
           "version": "0.2.1",
           "bundled": true
@@ -1579,17 +1609,32 @@
       "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-1.3.14.tgz",
       "integrity": "sha1-xme4sp7g4dyDDMBE8sFJFJe+5f4=",
       "dependencies": {
+        "@uifabric/utilities": {
+          "version": "1.10.2",
+          "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-1.10.2.tgz",
+          "integrity": "sha1-46chhW9rIUDPOXoNRkdwlmrScyQ="
+        },
         "office-ui-fabric-core": {
           "version": "5.1.0",
           "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-5.1.0.tgz",
           "integrity": "sha1-v49DCOFbNjJEwWc0WygzRRTsCSA="
+        },
+        "office-ui-fabric-react": {
+          "version": "2.34.2",
+          "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-2.34.2.tgz",
+          "integrity": "sha1-+sP1mNQTD3//PprellvW+LOwQ/M="
         }
       }
     },
+    "@uifabric/styling": {
+      "version": "0.6.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.6.1.tgz",
+      "integrity": "sha512-+wDTHWsDpuQuzeOiyg5Dkw7h1X35e0//CLYiKKeePv3q43QV3rbFPBgAIuozkBKCsq3egxPwPCBcVScf4DIZxA=="
+    },
     "@uifabric/utilities": {
-      "version": "1.10.2",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-1.10.2.tgz",
-      "integrity": "sha1-46chhW9rIUDPOXoNRkdwlmrScyQ="
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.1.1.tgz",
+      "integrity": "sha512-kfg+F6zQbCE4xtBK+CN5tGZVENoiQ9jnsCNI/0O2YSnLByY2AGxnTO0c4+HFXhdgcH0a+QR1J4ehWkz1oaeKTg=="
     },
     "abbrev": {
       "version": "1.0.9",
@@ -1704,14 +1749,19 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         }
       }
     },
@@ -2708,9 +2758,9 @@
       "integrity": "sha1-ElYDfsufDF9549bvE14wdwGEuYI=",
       "dependencies": {
         "lru-cache": {
-          "version": "4.0.2",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.0.2.tgz",
-          "integrity": "sha1-HRdnnAac2l0ECZGgnbwsDbN35V4="
+          "version": "4.1.0",
+          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.0.tgz",
+          "integrity": "sha512-aHGs865JXz6bkB4AHL+3AhyvTFKL3iZamKVWjIUKnXOXyasJvqPK8WAjOnAQKQZVpeXDVz19u1DD0r/12bWAdQ=="
         }
       }
     },
@@ -2720,9 +2770,9 @@
       "integrity": "sha1-hF/wwINKPe2dFg2sptOQkGuyiMw=",
       "dependencies": {
         "lru-cache": {
-          "version": "4.0.2",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.0.2.tgz",
-          "integrity": "sha1-HRdnnAac2l0ECZGgnbwsDbN35V4="
+          "version": "4.1.0",
+          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.0.tgz",
+          "integrity": "sha512-aHGs865JXz6bkB4AHL+3AhyvTFKL3iZamKVWjIUKnXOXyasJvqPK8WAjOnAQKQZVpeXDVz19u1DD0r/12bWAdQ=="
         }
       }
     },
@@ -3098,14 +3148,19 @@
           "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         }
       }
     },
@@ -3937,14 +3992,19 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         }
       }
     },
@@ -3991,14 +4051,19 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         },
         "vinyl": {
           "version": "1.2.0",
@@ -4023,14 +4088,19 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         }
       }
     },
@@ -4537,14 +4607,19 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         }
       }
     },
@@ -4682,14 +4757,19 @@
           "integrity": "sha1-cTfmmzKYuzQiR6G77jiByA4v14s="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         },
         "strip-bom": {
           "version": "2.0.0",
@@ -4863,14 +4943,19 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         }
       }
     },
@@ -4924,14 +5009,19 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         }
       }
     },
@@ -5024,6 +5114,11 @@
       "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.2.2.tgz",
       "integrity": "sha1-5+nacos94vrTSiFvQVezJtvMyJI="
     },
+    "import-lazy": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/import-lazy/-/import-lazy-2.1.0.tgz",
+      "integrity": "sha1-BWmOPUXIjo1+nZLLBYTnfwlvPkM="
+    },
     "imurmurhash": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz",
@@ -5671,14 +5766,19 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         }
       }
     },
@@ -6208,14 +6308,19 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         }
       }
     },
@@ -6240,14 +6345,19 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         }
       }
     },
@@ -6685,9 +6795,9 @@
       "integrity": "sha1-5rl2yY1wuKoAvVAGTIgOE3dFiY4="
     },
     "office-ui-fabric-react": {
-      "version": "2.34.2",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-2.34.2.tgz",
-      "integrity": "sha1-+sP1mNQTD3//PprellvW+LOwQ/M="
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.4.0.tgz",
+      "integrity": "sha512-xINePkVXmXFpxnF6FU5nxedOMaMAm9xIzPZdKr1SK5q2Ht8gu/+mwxdDsM18qyReq2qj9wZtfrSRuL8PowXT7A=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -6833,14 +6943,19 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         }
       }
     },
@@ -7472,9 +7587,9 @@
       "integrity": "sha1-EQ3Kv/OX6dz/fAeJzMCkmt8exbs="
     },
     "randombytes": {
-      "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.0.4.tgz",
-      "integrity": "sha1-lVHfIIQiyPgOtY4jJt0LhA/yLv0="
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.0.5.tgz",
+      "integrity": "sha512-8T7Zn1AhMsQ/HI1SjcCfT/t4ii3eAqco3yOcSzS4mozsOz69lHLsoMXmF9nZgnFanYscnSlUSgs8uZyKzpE6kg=="
     },
     "range-parser": {
       "version": "1.2.0",
@@ -7568,14 +7683,19 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         }
       }
     },
@@ -7605,14 +7725,19 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         }
       }
     },
@@ -7711,9 +7836,9 @@
       "integrity": "sha1-VNvzd+UUQKypCkzSdGANP/LYiKk="
     },
     "remove-trailing-separator": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.0.1.tgz",
-      "integrity": "sha1-YV67lq9VlVLUv0BXyENtSGq2PMQ="
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.0.2.tgz",
+      "integrity": "sha1-abBi2XhyetFNxrVrpKt3L9jXBRE="
     },
     "repeat-element": {
       "version": "1.1.2",
@@ -7746,14 +7871,19 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         }
       }
     },
@@ -8317,14 +8447,28 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q==",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         }
       }
     },
@@ -8366,14 +8510,19 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         }
       }
     },
@@ -8408,14 +8557,19 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         }
       }
     },
@@ -8596,14 +8750,19 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         }
       }
     },
@@ -9222,17 +9381,22 @@
           "integrity": "sha1-Y/xMzuXS13Y9Jrv4YBB45sLgBE8="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw==",
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q==",
           "dependencies": {
             "string_decoder": {
-              "version": "1.0.1",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-              "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+              "version": "1.0.2",
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+              "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
             }
           }
         },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+        },
         "stream-browserify": {
           "version": "2.0.1",
           "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz",
@@ -9505,9 +9669,14 @@
           "integrity": "sha1-Y/xMzuXS13Y9Jrv4YBB45sLgBE8="
         },
         "readable-stream": {
-          "version": "2.2.10",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.10.tgz",
-          "integrity": "sha512-HQEnnoV404e0EtwB9yNiuk2tJ+egeVC8Y9QBAxzDg8DBJt4BzRp+yQuIb/t3FIWkSTmIi+sgx7yVv/ZM0GNoqw=="
+          "version": "2.2.11",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "stream-browserify": {
           "version": "2.0.1",
@@ -9515,9 +9684,9 @@
           "integrity": "sha1-ZiZu5fm9uZQKTkUUyvtDu3Hlyds="
         },
         "string_decoder": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-          "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -9755,4 +9924,4 @@
       "integrity": "sha1-RCs4+denr3rke/z8NWhz6GFq0bc="
     }
   }
-}
+}
\ No newline at end of file

From a9ed58ce013d6f0860bd48840d66b84c23079c70 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 8 Jun 2017 00:18:06 +0000
Subject: [PATCH 0080/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 18 +++++++++++++
 apps/fabric-website/CHANGELOG.md              |  7 +++++-
 apps/fabric-website/package.json              |  8 +++---
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...example-app-base-fix_2017-06-07-23-54.json | 11 --------
 ...palette-not-optional_2017-06-07-06-56.json | 11 --------
 ...urand-TryCatchForRTL_2017-06-07-18-51.json | 11 --------
 ...palette-not-optional_2017-06-07-06-56.json | 11 --------
 packages/example-app-base/CHANGELOG.json      | 22 ++++++++++++++++
 packages/example-app-base/CHANGELOG.md        |  9 ++++++-
 packages/example-app-base/package.json        |  6 ++---
 packages/example-component/package.json       |  8 +++---
 .../office-ui-fabric-react/CHANGELOG.json     | 25 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++-
 packages/office-ui-fabric-react/package.json  |  8 +++---
 packages/styling/CHANGELOG.json               | 19 ++++++++++++++
 packages/styling/CHANGELOG.md                 |  9 ++++++-
 packages/styling/package.json                 |  4 +--
 packages/utilities/CHANGELOG.json             | 14 +++++++++++
 packages/utilities/CHANGELOG.md               |  9 ++++++-
 packages/utilities/package.json               |  2 +-
 23 files changed, 157 insertions(+), 70 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/example-app-base-fix_2017-06-07-23-54.json
 delete mode 100644 common/changes/@uifabric/styling/palette-not-optional_2017-06-07-06-56.json
 delete mode 100644 common/changes/@uifabric/utilities/sopurand-TryCatchForRTL_2017-06-07-18-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/palette-not-optional_2017-06-07-06-56.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 552e696978b8b..e66c52e3a8e75 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,24 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.5.35",
+      "tag": "@uifabric/fabric-website_v4.5.35",
+      "date": "Thu, 08 Jun 2017 00:18:05 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `2.1.2` to `3.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.1.1 <5.0.0` to `>=4.1.2 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.4.0 <5.0.0` to `>=4.4.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.5.34",
       "tag": "@uifabric/fabric-website_v4.5.34",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index d14541422cbd5..3ee5e76cfc0d7 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Tue, 06 Jun 2017 07:41:47 GMT and should not be manually modified.
+This log was last generated on Thu, 08 Jun 2017 00:18:05 GMT and should not be manually modified.
+
+## 4.5.35
+Thu, 08 Jun 2017 00:18:05 GMT
+
+*Changes not tracked*
 
 ## 4.5.34
 Tue, 06 Jun 2017 07:41:47 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index a296b4a5615d3..571226daa5be7 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.5.34",
+  "version": "4.5.35",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,13 +47,13 @@
     "webpack-bundle-analyzer": "^2.2.1"
   },
   "dependencies": {
-    "@uifabric/example-app-base": "2.1.2",
-    "@uifabric/utilities": ">=4.1.1 <5.0.0",
+    "@uifabric/example-app-base": "3.0.0",
+    "@uifabric/utilities": ">=4.1.2 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=4.4.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.4.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 568544368c2a2..af27f745b69ae 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -25,7 +25,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.3.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.4.1 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 347546ed76bb4..a0ffb03203af5 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.3.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.4.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index abf529764348c..b6fdbfea23a6b 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=4.3.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.4.1 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/@uifabric/example-app-base/example-app-base-fix_2017-06-07-23-54.json b/common/changes/@uifabric/example-app-base/example-app-base-fix_2017-06-07-23-54.json
deleted file mode 100644
index c7d7ce12a192b..0000000000000
--- a/common/changes/@uifabric/example-app-base/example-app-base-fix_2017-06-07-23-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Bumping fabric dependency in example-app-base",
-      "type": "major"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/palette-not-optional_2017-06-07-06-56.json b/common/changes/@uifabric/styling/palette-not-optional_2017-06-07-06-56.json
deleted file mode 100644
index 919622252dcf8..0000000000000
--- a/common/changes/@uifabric/styling/palette-not-optional_2017-06-07-06-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "ITheme: Make palette a required prop",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "chrisgo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/sopurand-TryCatchForRTL_2017-06-07-18-51.json b/common/changes/@uifabric/utilities/sopurand-TryCatchForRTL_2017-06-07-18-51.json
deleted file mode 100644
index f3447c83dc71c..0000000000000
--- a/common/changes/@uifabric/utilities/sopurand-TryCatchForRTL_2017-06-07-18-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Adding a try-catch around setting RTL in local storage for the browser",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "sopurand@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/palette-not-optional_2017-06-07-06-56.json b/common/changes/office-ui-fabric-react/palette-not-optional_2017-06-07-06-56.json
deleted file mode 100644
index b0fe8eef65633..0000000000000
--- a/common/changes/office-ui-fabric-react/palette-not-optional_2017-06-07-06-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ITheme: Make palette a required prop",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chrisgo@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 7f56b8581239a..014bea7face7c 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "3.0.0",
+      "tag": "@uifabric/example-app-base_v3.0.0",
+      "date": "Thu, 08 Jun 2017 00:18:05 GMT",
+      "comments": {
+        "major": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "437a52303c48ddf8bd7418446606586196972795",
+            "comment": "Bumping fabric dependency in example-app-base"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.6.1 <1.0.0` to `>=0.7.0 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.1.1 <5.0.0` to `>=4.1.2 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "2.1.2",
       "tag": "@uifabric/example-app-base_v2.1.2",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index f86e1e4e0c139..fcb21bd63f64f 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Tue, 06 Jun 2017 07:41:47 GMT and should not be manually modified.
+This log was last generated on Thu, 08 Jun 2017 00:18:05 GMT and should not be manually modified.
+
+## 3.0.0
+Thu, 08 Jun 2017 00:18:05 GMT
+
+### Breaking changes
+
+- Bumping fabric dependency in example-app-base
 
 ## 2.1.2
 Tue, 06 Jun 2017 07:41:47 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 5cdb392c60fb2..f5c4169861c79 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "2.1.2",
+  "version": "3.0.0",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -40,8 +40,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.6.1 <1.0.0",
-    "@uifabric/utilities": ">=4.1.1 <5.0.0",
+    "@uifabric/styling": ">=0.7.0 <1.0.0",
+    "@uifabric/utilities": ">=4.1.2 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
     "office-ui-fabric-react": ">=4.4.0 <5.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 0f1a59d049299..c12a15bb700cb 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-component",
-  "version": "1.0.33",
+  "version": "1.0.34",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -21,8 +21,8 @@
     "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "2.1.2",
-    "@uifabric/utilities": "4.1.1",
+    "@uifabric/example-app-base": "3.0.0",
+    "@uifabric/utilities": "4.1.2",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.4.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.4.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index cfadc253ba94b..776bb85600b12 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,31 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.4.1",
+      "tag": "office-ui-fabric-react_v4.4.1",
+      "date": "Thu, 08 Jun 2017 00:18:05 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "58ebffae702a799225c3c09d94175bffd85b2986",
+            "comment": "ITheme: Make palette a required prop"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.1.1 <5.0.0` to `>=4.1.2 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.6.1 <1.0.0` to `>=0.7.0 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `2.1.2` to `3.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.4.0",
       "tag": "office-ui-fabric-react_v4.4.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index f44b200efa720..891aac059b549 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 06 Jun 2017 07:41:47 GMT and should not be manually modified.
+This log was last generated on Thu, 08 Jun 2017 00:18:05 GMT and should not be manually modified.
+
+## 4.4.1
+Thu, 08 Jun 2017 00:18:05 GMT
+
+### Patches
+
+- ITheme: Make palette a required prop
 
 ## 4.4.0
 Tue, 06 Jun 2017 07:41:47 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index d17bfa6e48190..4318828b21e6d 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.4.0",
+  "version": "4.4.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "^2.2.2",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "2.1.2",
+    "@uifabric/example-app-base": "3.0.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -71,8 +71,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.1.1 <5.0.0",
-    "@uifabric/styling": ">=0.6.1 <1.0.0",
+    "@uifabric/utilities": ">=4.1.2 <5.0.0",
+    "@uifabric/styling": ">=0.7.0 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index f38aad554754b..df250b8cdfef8 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.7.0",
+      "tag": "@uifabric/styling_v0.7.0",
+      "date": "Thu, 08 Jun 2017 00:18:05 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "58ebffae702a799225c3c09d94175bffd85b2986",
+            "comment": "ITheme: Make palette a required prop"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.1.1 <5.0.0` to `>=4.1.2 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.6.1",
       "tag": "@uifabric/styling_v0.6.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index a8a1b09992fa1..6bb304f602830 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Tue, 06 Jun 2017 07:41:47 GMT and should not be manually modified.
+This log was last generated on Thu, 08 Jun 2017 00:18:05 GMT and should not be manually modified.
+
+## 0.7.0
+Thu, 08 Jun 2017 00:18:05 GMT
+
+### Minor changes
+
+- ITheme: Make palette a required prop
 
 ## 0.6.1
 Tue, 06 Jun 2017 07:41:47 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 0dc9af9ba38a8..81fbb199582e0 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.6.1",
+  "version": "0.7.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.1.1 <5.0.0",
+    "@uifabric/utilities": ">=4.1.2 <5.0.0",
     "tslib": "^1.6.0",
     "rtl-css-js": "^1.1.0",
     "glamor": "^2.20.24"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 78364ec8f4778..b826b10ec5427 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.1.2",
+      "tag": "@uifabric/utilities_v4.1.2",
+      "date": "Thu, 08 Jun 2017 00:18:05 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "soorajpurandare <soorajashutosh@gmail.com>",
+            "commit": "f382123efa18802b5f86f4be669c5b34847872d4",
+            "comment": "Adding a try-catch around setting RTL in local storage for the browser"
+          }
+        ]
+      }
+    },
     {
       "version": "4.1.1",
       "tag": "@uifabric/utilities_v4.1.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index d9375fa34ed5f..e9d85faf0022f 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Tue, 06 Jun 2017 06:06:46 GMT and should not be manually modified.
+This log was last generated on Thu, 08 Jun 2017 00:18:05 GMT and should not be manually modified.
+
+## 4.1.2
+Thu, 08 Jun 2017 00:18:05 GMT
+
+### Patches
+
+- Adding a try-catch around setting RTL in local storage for the browser
 
 ## 4.1.1
 Tue, 06 Jun 2017 06:06:46 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index b85e17b3be16f..aa1ff5d323cbc 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.1.1",
+  "version": "4.1.2",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 9cb6385ba93dd03550d1aec608cd43b32e7d3385 Mon Sep 17 00:00:00 2001
From: Joe Martella <martellaj@live.com>
Date: Wed, 7 Jun 2017 18:16:09 -0700
Subject: [PATCH 0081/1641] Fixes TextField flexbox layout (for IE). (#1954)

* Adds required "length unit" to flex-basis value.

* Adds change file.

* Create joem-fix-textfield-flex-values_2017-06-08-00-07.json
---
 ...em-fix-textfield-flex-values_2017-06-08-00-07.json | 11 +++++++++++
 .../src/components/TextField/TextField.scss           |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/joem-fix-textfield-flex-values_2017-06-08-00-07.json

diff --git a/common/changes/office-ui-fabric-react/joem-fix-textfield-flex-values_2017-06-08-00-07.json b/common/changes/office-ui-fabric-react/joem-fix-textfield-flex-values_2017-06-08-00-07.json
new file mode 100644
index 0000000000000..c85e77081b832
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/joem-fix-textfield-flex-values_2017-06-08-00-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "TextField: improves layout for IE.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joem@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index 57e0e8d4c396a..4d882f4d13197 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -194,7 +194,7 @@ $field-error-color: $errorTextColor;
   }
 
   .fieldGroup {
-    flex: 1 1 0;
+    flex: 1 1 0px;
     border: 0;
     @include ms-text-align(left);
   }

From 9a79fb54dab1abe51f38f7993bbdce81cca05d59 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 8 Jun 2017 10:20:07 +0000
Subject: [PATCH 0082/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 ...extfield-flex-values_2017-06-08-00-07.json | 11 -----------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++++-
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/CHANGELOG.json               |  6 ++++++
 packages/styling/CHANGELOG.md                 |  7 ++++++-
 packages/styling/package.json                 |  2 +-
 10 files changed, 45 insertions(+), 19 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/joem-fix-textfield-flex-values_2017-06-08-00-07.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 571226daa5be7..d41a4f93ace80 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=4.4.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.4.2 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/joem-fix-textfield-flex-values_2017-06-08-00-07.json b/common/changes/office-ui-fabric-react/joem-fix-textfield-flex-values_2017-06-08-00-07.json
deleted file mode 100644
index c85e77081b832..0000000000000
--- a/common/changes/office-ui-fabric-react/joem-fix-textfield-flex-values_2017-06-08-00-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "TextField: improves layout for IE.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joem@microsoft.com"
-}
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index f5c4169861c79..8afd6f378caeb 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -40,7 +40,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.7.0 <1.0.0",
+    "@uifabric/styling": ">=0.7.1 <1.0.0",
     "@uifabric/utilities": ">=4.1.2 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index c12a15bb700cb..cb918d9219ba0 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.4.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.4.2 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 776bb85600b12..9254db031de53 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.4.2",
+      "tag": "office-ui-fabric-react_v4.4.2",
+      "date": "Thu, 08 Jun 2017 10:20:07 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Joe Martella <martellaj@live.com>",
+            "commit": "9cb6385ba93dd03550d1aec608cd43b32e7d3385",
+            "comment": "TextField: improves layout for IE."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.7.0 <1.0.0` to `>=0.7.1 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.4.1",
       "tag": "office-ui-fabric-react_v4.4.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 891aac059b549..702e373faf416 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 08 Jun 2017 00:18:05 GMT and should not be manually modified.
+This log was last generated on Thu, 08 Jun 2017 10:20:07 GMT and should not be manually modified.
+
+## 4.4.2
+Thu, 08 Jun 2017 10:20:07 GMT
+
+### Patches
+
+- TextField: improves layout for IE.
 
 ## 4.4.1
 Thu, 08 Jun 2017 00:18:05 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 4318828b21e6d..71b138f970a2e 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.4.1",
+  "version": "4.4.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.1.2 <5.0.0",
-    "@uifabric/styling": ">=0.7.0 <1.0.0",
+    "@uifabric/styling": ">=0.7.1 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index df250b8cdfef8..c756715a37118 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.7.1",
+      "tag": "@uifabric/styling_v0.7.1",
+      "date": "Thu, 08 Jun 2017 10:20:07 GMT",
+      "comments": {}
+    },
     {
       "version": "0.7.0",
       "tag": "@uifabric/styling_v0.7.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 6bb304f602830..1f68f2a20e75e 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 08 Jun 2017 00:18:05 GMT and should not be manually modified.
+This log was last generated on Thu, 08 Jun 2017 10:20:07 GMT and should not be manually modified.
+
+## 0.7.1
+Thu, 08 Jun 2017 10:20:07 GMT
+
+*Changes not tracked*
 
 ## 0.7.0
 Thu, 08 Jun 2017 00:18:05 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 81fbb199582e0..c92c38f6814b6 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.7.0",
+  "version": "0.7.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From bc7c1ebc6b552d523728c2cb9a4f4127df38a11c Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 8 Jun 2017 15:30:51 -0700
Subject: [PATCH 0083/1641] Update minimum version of rtl-css-js (#1959)

* Upgrade rtl-css-js version

* Run shrinkwrap

* Rush change
---
 .../rtl-css-js_2017-06-08-18-28.json          |  11 +
 .../rtl-css-js_2017-06-08-18-28.json          |  11 +
 .../styling/rtl-css-js_2017-06-08-18-28.json  |  11 +
 .../rtl-css-js_2017-06-08-18-28.json          |  11 +
 .../rtl-css-js_2017-06-08-18-28.json          |  11 +
 common/config/rush/npm-shrinkwrap.json        | 671 ++++++++++++++++--
 packages/styling/package.json                 |   2 +-
 7 files changed, 684 insertions(+), 44 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/rtl-css-js_2017-06-08-18-28.json
 create mode 100644 common/changes/@uifabric/fabric-website/rtl-css-js_2017-06-08-18-28.json
 create mode 100644 common/changes/@uifabric/styling/rtl-css-js_2017-06-08-18-28.json
 create mode 100644 common/changes/@uifabric/utilities/rtl-css-js_2017-06-08-18-28.json
 create mode 100644 common/changes/office-ui-fabric-react/rtl-css-js_2017-06-08-18-28.json

diff --git a/common/changes/@uifabric/example-app-base/rtl-css-js_2017-06-08-18-28.json b/common/changes/@uifabric/example-app-base/rtl-css-js_2017-06-08-18-28.json
new file mode 100644
index 0000000000000..e807ce07d1d8c
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/rtl-css-js_2017-06-08-18-28.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/rtl-css-js_2017-06-08-18-28.json b/common/changes/@uifabric/fabric-website/rtl-css-js_2017-06-08-18-28.json
new file mode 100644
index 0000000000000..cbeaf5c6e2864
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/rtl-css-js_2017-06-08-18-28.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/rtl-css-js_2017-06-08-18-28.json b/common/changes/@uifabric/styling/rtl-css-js_2017-06-08-18-28.json
new file mode 100644
index 0000000000000..317346312781e
--- /dev/null
+++ b/common/changes/@uifabric/styling/rtl-css-js_2017-06-08-18-28.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Update the version of rtl-css-js used to get latest bug fixes",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/rtl-css-js_2017-06-08-18-28.json b/common/changes/@uifabric/utilities/rtl-css-js_2017-06-08-18-28.json
new file mode 100644
index 0000000000000..215b2a26b2777
--- /dev/null
+++ b/common/changes/@uifabric/utilities/rtl-css-js_2017-06-08-18-28.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/rtl-css-js_2017-06-08-18-28.json b/common/changes/office-ui-fabric-react/rtl-css-js_2017-06-08-18-28.json
new file mode 100644
index 0000000000000..d4aea377503d2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/rtl-css-js_2017-06-08-18-28.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "office-ui-fabric-react",
+      "type": "none"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index bb33295801cc4..78f0e535d0514 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -570,9 +570,9 @@
       "integrity": "sha1-DldYaol/ddjdDAKdKVtBapg4f5w=",
       "dependencies": {
         "@microsoft/api-extractor": {
-          "version": "2.0.6",
-          "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.0.6.tgz",
-          "integrity": "sha1-BVN2DgbyuUGn9zbjP+wVK1/BQoQ="
+          "version": "2.0.7",
+          "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.0.7.tgz",
+          "integrity": "sha1-zmAg7skaKVy1JlmXu58gIqmBPWk="
         },
         "@microsoft/gulp-core-build-sass": {
           "version": "3.1.2",
@@ -709,7 +709,7 @@
       }
     },
     "@rush-temp/example-app-base": {
-      "version": "file:projects/example-app-base",
+      "version": "file:projects\\example-app-base",
       "dependencies": {
         "async": {
           "version": "0.9.2",
@@ -746,7 +746,7 @@
       }
     },
     "@rush-temp/example-component": {
-      "version": "file:projects/example-component",
+      "version": "file:projects\\example-component",
       "dependencies": {
         "acorn": {
           "version": "5.0.3",
@@ -805,15 +805,19 @@
           "bundled": true
         },
         "readable-stream": {
-          "version": "2.2.10",
+          "version": "2.2.11",
           "bundled": true,
           "dependencies": {
             "string_decoder": {
-              "version": "1.0.1",
+              "version": "1.0.2",
               "bundled": true
             }
           }
         },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "bundled": true
+        },
         "stream-browserify": {
           "version": "2.0.1",
           "bundled": true
@@ -859,7 +863,7 @@
       }
     },
     "@rush-temp/fabric-website": {
-      "version": "file:projects/fabric-website",
+      "version": "file:projects\\fabric-website",
       "dependencies": {
         "async": {
           "version": "0.9.2",
@@ -900,7 +904,7 @@
       }
     },
     "@rush-temp/office-ui-fabric-react": {
-      "version": "file:projects/office-ui-fabric-react",
+      "version": "file:projects\\office-ui-fabric-react",
       "dependencies": {
         "acorn": {
           "version": "5.0.3",
@@ -959,15 +963,19 @@
           "bundled": true
         },
         "readable-stream": {
-          "version": "2.2.10",
+          "version": "2.2.11",
           "bundled": true,
           "dependencies": {
             "string_decoder": {
-              "version": "1.0.1",
+              "version": "1.0.2",
               "bundled": true
             }
           }
         },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "bundled": true
+        },
         "source-map": {
           "version": "0.1.43",
           "bundled": true
@@ -1037,10 +1045,10 @@
       }
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
-      "version": "file:projects/office-ui-fabric-react-tslint"
+      "version": "file:projects\\office-ui-fabric-react-tslint"
     },
     "@rush-temp/ssr-tests": {
-      "version": "file:projects/ssr-tests",
+      "version": "file:projects\\ssr-tests",
       "dependencies": {
         "acorn": {
           "version": "5.0.3",
@@ -1099,15 +1107,19 @@
           "bundled": true
         },
         "readable-stream": {
-          "version": "2.2.10",
+          "version": "2.2.11",
           "bundled": true,
           "dependencies": {
             "string_decoder": {
-              "version": "1.0.1",
+              "version": "1.0.2",
               "bundled": true
             }
           }
         },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "bundled": true
+        },
         "stream-browserify": {
           "version": "2.0.1",
           "bundled": true
@@ -1153,7 +1165,7 @@
       }
     },
     "@rush-temp/styling": {
-      "version": "file:projects/styling",
+      "version": "file:projects\\styling",
       "dependencies": {
         "@uifabric/utilities": {
           "version": "1.10.2",
@@ -1220,15 +1232,19 @@
           "bundled": true
         },
         "readable-stream": {
-          "version": "2.2.10",
+          "version": "2.2.11",
           "bundled": true,
           "dependencies": {
             "string_decoder": {
-              "version": "1.0.1",
+              "version": "1.0.2",
               "bundled": true
             }
           }
         },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "bundled": true
+        },
         "source-map": {
           "version": "0.1.43",
           "bundled": true
@@ -1298,7 +1314,7 @@
       }
     },
     "@rush-temp/test-bundle-button": {
-      "version": "file:projects/test-bundle-button",
+      "version": "file:projects\\test-bundle-button",
       "dependencies": {
         "async": {
           "version": "0.9.2",
@@ -1315,10 +1331,10 @@
       }
     },
     "@rush-temp/todo-app": {
-      "version": "file:projects/todo-app"
+      "version": "file:projects\\todo-app"
     },
     "@rush-temp/utilities": {
-      "version": "file:projects/utilities",
+      "version": "file:projects\\utilities",
       "dependencies": {
         "async": {
           "version": "0.9.2",
@@ -1627,14 +1643,14 @@
       }
     },
     "@uifabric/styling": {
-      "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.6.1.tgz",
-      "integrity": "sha512-+wDTHWsDpuQuzeOiyg5Dkw7h1X35e0//CLYiKKeePv3q43QV3rbFPBgAIuozkBKCsq3egxPwPCBcVScf4DIZxA=="
+      "version": "0.7.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.7.1.tgz",
+      "integrity": "sha512-PZ0ryYqj1Wu4Ojsb7e2VesvgsiY9Lghz9ByEXirywk0im/83fB58exrLtLUBsBU6H037kp8q2RaO2wuaQEnwMw=="
     },
     "@uifabric/utilities": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.1.1.tgz",
-      "integrity": "sha512-kfg+F6zQbCE4xtBK+CN5tGZVENoiQ9jnsCNI/0O2YSnLByY2AGxnTO0c4+HFXhdgcH0a+QR1J4ehWkz1oaeKTg=="
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.1.2.tgz",
+      "integrity": "sha512-tugHCTt9MTccNv4vx9t3QfAowSEZRKDykbuVn23DG1VMUmTOzCs6zozHk3cqb5WFFvjLIsirXU/zPsFABxjApw=="
     },
     "abbrev": {
       "version": "1.0.9",
@@ -2281,9 +2297,9 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000679",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000679.tgz",
-      "integrity": "sha1-3XvhLxZXfl1q5tuIDG1hnnfco2U="
+      "version": "1.0.30000680",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000680.tgz",
+      "integrity": "sha1-126+quuC49mVK/3FwjHE+DzUgUQ="
     },
     "capture-stack-trace": {
       "version": "1.0.0",
@@ -3768,6 +3784,581 @@
       "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
       "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
     },
+    "fsevents": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.1.tgz",
+      "integrity": "sha1-8Z/Sj0Pur3YWgOUZogPE0LPTGv8=",
+      "optional": true,
+      "dependencies": {
+        "abbrev": {
+          "version": "1.1.0",
+          "bundled": true,
+          "optional": true
+        },
+        "ansi-regex": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "ansi-styles": {
+          "version": "2.2.1",
+          "bundled": true,
+          "optional": true
+        },
+        "aproba": {
+          "version": "1.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "are-we-there-yet": {
+          "version": "1.1.2",
+          "bundled": true,
+          "optional": true
+        },
+        "asn1": {
+          "version": "0.2.3",
+          "bundled": true,
+          "optional": true
+        },
+        "assert-plus": {
+          "version": "0.2.0",
+          "bundled": true,
+          "optional": true
+        },
+        "asynckit": {
+          "version": "0.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "aws-sign2": {
+          "version": "0.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "aws4": {
+          "version": "1.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "balanced-match": {
+          "version": "0.4.2",
+          "bundled": true
+        },
+        "bcrypt-pbkdf": {
+          "version": "1.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "block-stream": {
+          "version": "0.0.9",
+          "bundled": true
+        },
+        "boom": {
+          "version": "2.10.1",
+          "bundled": true
+        },
+        "brace-expansion": {
+          "version": "1.1.6",
+          "bundled": true
+        },
+        "buffer-shims": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "caseless": {
+          "version": "0.11.0",
+          "bundled": true,
+          "optional": true
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "bundled": true,
+          "optional": true
+        },
+        "code-point-at": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "combined-stream": {
+          "version": "1.0.5",
+          "bundled": true
+        },
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true,
+          "optional": true
+        },
+        "concat-map": {
+          "version": "0.0.1",
+          "bundled": true
+        },
+        "console-control-strings": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "core-util-is": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "cryptiles": {
+          "version": "2.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "dashdash": {
+          "version": "1.14.1",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "debug": {
+          "version": "2.2.0",
+          "bundled": true,
+          "optional": true
+        },
+        "deep-extend": {
+          "version": "0.4.1",
+          "bundled": true,
+          "optional": true
+        },
+        "delayed-stream": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "delegates": {
+          "version": "1.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "ecc-jsbn": {
+          "version": "0.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "escape-string-regexp": {
+          "version": "1.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "extend": {
+          "version": "3.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "extsprintf": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "forever-agent": {
+          "version": "0.6.1",
+          "bundled": true,
+          "optional": true
+        },
+        "form-data": {
+          "version": "2.1.2",
+          "bundled": true,
+          "optional": true
+        },
+        "fs.realpath": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "fstream": {
+          "version": "1.0.10",
+          "bundled": true
+        },
+        "fstream-ignore": {
+          "version": "1.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "gauge": {
+          "version": "2.7.3",
+          "bundled": true,
+          "optional": true
+        },
+        "generate-function": {
+          "version": "2.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "generate-object-property": {
+          "version": "1.2.0",
+          "bundled": true,
+          "optional": true
+        },
+        "getpass": {
+          "version": "0.1.6",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "glob": {
+          "version": "7.1.1",
+          "bundled": true
+        },
+        "graceful-fs": {
+          "version": "4.1.11",
+          "bundled": true
+        },
+        "graceful-readlink": {
+          "version": "1.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "har-validator": {
+          "version": "2.0.6",
+          "bundled": true,
+          "optional": true
+        },
+        "has-ansi": {
+          "version": "2.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "has-unicode": {
+          "version": "2.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "hawk": {
+          "version": "3.1.3",
+          "bundled": true,
+          "optional": true
+        },
+        "hoek": {
+          "version": "2.16.3",
+          "bundled": true
+        },
+        "http-signature": {
+          "version": "1.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "inflight": {
+          "version": "1.0.6",
+          "bundled": true
+        },
+        "inherits": {
+          "version": "2.0.3",
+          "bundled": true
+        },
+        "ini": {
+          "version": "1.3.4",
+          "bundled": true,
+          "optional": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "is-my-json-valid": {
+          "version": "2.15.0",
+          "bundled": true,
+          "optional": true
+        },
+        "is-property": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "is-typedarray": {
+          "version": "1.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "isstream": {
+          "version": "0.1.2",
+          "bundled": true,
+          "optional": true
+        },
+        "jodid25519": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "jsbn": {
+          "version": "0.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "json-schema": {
+          "version": "0.2.3",
+          "bundled": true,
+          "optional": true
+        },
+        "json-stringify-safe": {
+          "version": "5.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "jsonpointer": {
+          "version": "4.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "jsprim": {
+          "version": "1.3.1",
+          "bundled": true,
+          "optional": true
+        },
+        "mime-db": {
+          "version": "1.26.0",
+          "bundled": true
+        },
+        "mime-types": {
+          "version": "2.1.14",
+          "bundled": true
+        },
+        "minimatch": {
+          "version": "3.0.3",
+          "bundled": true
+        },
+        "minimist": {
+          "version": "0.0.8",
+          "bundled": true
+        },
+        "mkdirp": {
+          "version": "0.5.1",
+          "bundled": true
+        },
+        "ms": {
+          "version": "0.7.1",
+          "bundled": true,
+          "optional": true
+        },
+        "node-pre-gyp": {
+          "version": "0.6.33",
+          "bundled": true,
+          "optional": true
+        },
+        "nopt": {
+          "version": "3.0.6",
+          "bundled": true,
+          "optional": true
+        },
+        "npmlog": {
+          "version": "4.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "number-is-nan": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "oauth-sign": {
+          "version": "0.8.2",
+          "bundled": true,
+          "optional": true
+        },
+        "object-assign": {
+          "version": "4.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "once": {
+          "version": "1.4.0",
+          "bundled": true
+        },
+        "path-is-absolute": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "pinkie": {
+          "version": "2.0.4",
+          "bundled": true,
+          "optional": true
+        },
+        "pinkie-promise": {
+          "version": "2.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "process-nextick-args": {
+          "version": "1.0.7",
+          "bundled": true
+        },
+        "punycode": {
+          "version": "1.4.1",
+          "bundled": true,
+          "optional": true
+        },
+        "qs": {
+          "version": "6.3.1",
+          "bundled": true,
+          "optional": true
+        },
+        "rc": {
+          "version": "1.1.7",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "minimist": {
+              "version": "1.2.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "readable-stream": {
+          "version": "2.2.2",
+          "bundled": true,
+          "optional": true
+        },
+        "request": {
+          "version": "2.79.0",
+          "bundled": true,
+          "optional": true
+        },
+        "rimraf": {
+          "version": "2.5.4",
+          "bundled": true
+        },
+        "semver": {
+          "version": "5.3.0",
+          "bundled": true,
+          "optional": true
+        },
+        "set-blocking": {
+          "version": "2.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "signal-exit": {
+          "version": "3.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "sntp": {
+          "version": "1.0.9",
+          "bundled": true,
+          "optional": true
+        },
+        "sshpk": {
+          "version": "1.10.2",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "string_decoder": {
+          "version": "0.10.31",
+          "bundled": true
+        },
+        "string-width": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "stringstream": {
+          "version": "0.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "strip-ansi": {
+          "version": "3.0.1",
+          "bundled": true
+        },
+        "strip-json-comments": {
+          "version": "2.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "tar": {
+          "version": "2.2.1",
+          "bundled": true
+        },
+        "tar-pack": {
+          "version": "3.3.0",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "once": {
+              "version": "1.3.3",
+              "bundled": true,
+              "optional": true
+            },
+            "readable-stream": {
+              "version": "2.1.5",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "tough-cookie": {
+          "version": "2.3.2",
+          "bundled": true,
+          "optional": true
+        },
+        "tunnel-agent": {
+          "version": "0.4.3",
+          "bundled": true,
+          "optional": true
+        },
+        "tweetnacl": {
+          "version": "0.14.5",
+          "bundled": true,
+          "optional": true
+        },
+        "uid-number": {
+          "version": "0.0.6",
+          "bundled": true,
+          "optional": true
+        },
+        "util-deprecate": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "uuid": {
+          "version": "3.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "verror": {
+          "version": "1.3.6",
+          "bundled": true,
+          "optional": true
+        },
+        "wide-align": {
+          "version": "1.1.0",
+          "bundled": true,
+          "optional": true
+        },
+        "wrappy": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "xtend": {
+          "version": "4.0.1",
+          "bundled": true,
+          "optional": true
+        }
+      }
+    },
     "fstream": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
@@ -5531,12 +6122,6 @@
       "resolved": "https://registry.npmjs.org/jju/-/jju-1.3.0.tgz",
       "integrity": "sha1-2t2e8BkkvHKLA/L3l5vb1i96Kqo="
     },
-    "jodid25519": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/jodid25519/-/jodid25519-1.0.2.tgz",
-      "integrity": "sha1-BtSRIlUJNBlHfUJWM2BuDpB4KWc=",
-      "optional": true
-    },
     "js-base64": {
       "version": "2.1.9",
       "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.1.9.tgz",
@@ -6795,9 +7380,9 @@
       "integrity": "sha1-5rl2yY1wuKoAvVAGTIgOE3dFiY4="
     },
     "office-ui-fabric-react": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.4.0.tgz",
-      "integrity": "sha512-xINePkVXmXFpxnF6FU5nxedOMaMAm9xIzPZdKr1SK5q2Ht8gu/+mwxdDsM18qyReq2qj9wZtfrSRuL8PowXT7A=="
+      "version": "4.4.2",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.4.2.tgz",
+      "integrity": "sha512-K9kBVRhnSRuXzwfN4YiNkYvCTrnJuvWUPVuYsbyFugRr+XpGw+j0x9pyBJgKiCr/GZgNmnpfJhVLoQQcXnJkTg=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -8483,9 +9068,9 @@
       "integrity": "sha1-Nr54Mgr+WAH2zqPueLblqrlA6gw="
     },
     "sshpk": {
-      "version": "1.13.0",
-      "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.13.0.tgz",
-      "integrity": "sha1-/yo+T9BEl1Vf7Zezmg/YL6+zozw=",
+      "version": "1.13.1",
+      "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.13.1.tgz",
+      "integrity": "sha1-US322mKHFEMW3EwY/hzx2UBzm+M=",
       "dependencies": {
         "assert-plus": {
           "version": "1.0.0",
@@ -9924,4 +10509,4 @@
       "integrity": "sha1-RCs4+denr3rke/z8NWhz6GFq0bc="
     }
   }
-}
\ No newline at end of file
+}
diff --git a/packages/styling/package.json b/packages/styling/package.json
index c92c38f6814b6..e24784e54b2a1 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -47,7 +47,7 @@
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.1.2 <5.0.0",
     "tslib": "^1.6.0",
-    "rtl-css-js": "^1.1.0",
+    "rtl-css-js": "^1.1.1",
     "glamor": "^2.20.24"
   }
 }
\ No newline at end of file

From 616ab8c875b65a3e2a2e7d3818f64087f5f8109e Mon Sep 17 00:00:00 2001
From: Boris Emorine <boris.emorine@gmail.com>
Date: Thu, 8 Jun 2017 15:56:17 -0700
Subject: [PATCH 0084/1641] New Component: Stepper (#1759)

* First step at stepper implementation.

* Add first implementation of stepper.

* Add functionality to stepper

* Refine the Stepper class and add tests

* let's make sure to put focus back on the text field when submitting via enter

* Added documentation to Stepper.

* Add flexibility to current stepper implementation.

* Modified example implementations.

* Add aria-valuemax.

* Change Stepper to SpinButton.

* Add example with unit.

* Implement color scheme in the ContextualMenu control to enable alternative theming.

* Improvements to SpinButton.

* Fix increment function calls.

* Add new width optional parameter.

* Add label direction.

* Fix border.

* Add Position enum.

* `defaultValue` is now the deciding prop for using the default implementation or not.

* onBlur is now onValidate.

* Fix tests.

* Fix warnings.

* Add implementation for labelGap.

* Put some polish on the styling, added some icon support, and added some more example spinButtons

* Implement the bar and unit tests and component page

* Add the ability for the spinButton buttons to look pressed when spinning via keyboard

* Revert "Implement color scheme in the ContextualMenu control to enable alternative theming."

This reverts commit 4f830cd8c55269368e73bfc6d0cd69430776b977.

* Don't render an empty icon for an icon-less header menu item.

* Revert "Implement Document Title Bar"

* update some CSS for high contrast in ff and use css utility instead of concatenating string classnames

* Fix quotation issue

* Fix Spin Button properties table.

* Fix Spin Button example code

* Use iconProps instead of string

* Extracted `spinning` out of state

* Add autobind instead of manually binding private functions to this

* Change `+` syntax for more explicit `Number()`

* Remove unnecessary cast

* Fix typos

* `incrementButtonIcon` and `decrementButtonIcon` are now IIconProps

* Add KeyboardSpinDirection enum

* Fix test description

* Fix SpinButton tests

* Remove unused onChange callback from SpinButton

* Revert onChange

* Remove old Stepper.ts file

* Use module css instead of global

* Fix missing word in comment

* Callback functions now allow for void return (state to be updated outside)

* Use `_async` instead of window

* Fix minor rendering issue with browser zoom

* Rename `_spinning` to `_spinningByMouse` for clarity

* Fix tests

* Fix extra space before label

* Remove width outside of SpinButton component and fix styling

* Add more tests to SpinButton

* Fix SpinButton documentation

* Fix typo

* Fix AppDefinition for SpinButton and Spinner

* Add missing documentation to SpinButton title prop

* Various SpinButton fixes

* Fix SpinButton path for properties

* Fix SpinButton styling issues

* Remove labelGap property from SpinButton
---
 .../src/components/App/AppState.tsx           |   6 +
 .../Components/SpinButtonComponentPage.tsx    |  37 ++
 .../office-ui-fabric-react/src/SpinButton.ts  |   1 +
 .../components/SpinButton/SpinButton.Props.ts | 107 ++++
 .../src/components/SpinButton/SpinButton.scss | 226 +++++++
 .../components/SpinButton/SpinButton.test.tsx | 554 ++++++++++++++++++
 .../src/components/SpinButton/SpinButton.tsx  | 428 ++++++++++++++
 .../components/SpinButton/SpinButtonPage.tsx  |  97 +++
 .../examples/SpinButton.Basic.Example.tsx     |  18 +
 .../SpinButton.BasicDisabled.Example.tsx      |  19 +
 ...pinButton.BasicWithEndPosition.Example.tsx |  21 +
 .../SpinButton.BasicWithIcon.Example.tsx      |  19 +
 .../examples/SpinButton.Stateful.Example.tsx  |  46 ++
 .../src/components/SpinButton/index.ts        |   2 +
 .../src/demo/AppDefinition.tsx                |   6 +
 packages/office-ui-fabric-react/src/index.ts  |   1 +
 .../src/utilities/positioning.ts              |   7 +
 17 files changed, 1595 insertions(+)
 create mode 100644 apps/fabric-website/src/pages/Components/SpinButtonComponentPage.tsx
 create mode 100644 packages/office-ui-fabric-react/src/SpinButton.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicDisabled.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithEndPosition.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/SpinButton/index.ts

diff --git a/apps/fabric-website/src/components/App/AppState.tsx b/apps/fabric-website/src/components/App/AppState.tsx
index f74ad8aa2111e..f722bddac0cfe 100644
--- a/apps/fabric-website/src/components/App/AppState.tsx
+++ b/apps/fabric-website/src/components/App/AppState.tsx
@@ -302,6 +302,12 @@ export const AppState: IAppState = {
           component: () => <LoadingComponent title='Spinner' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/SpinnerComponentPage').SpinnerComponentPage))
         },
+        {
+          title: 'SpinButton',
+          url: '#/components/spinbutton',
+          component: () => <LoadingComponent title='SpinButton' />,
+          getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/SpinButtonComponentPage').SpinButtonComponentPage))
+        },
         {
           title: 'TextField',
           url: '#/components/textfield',
diff --git a/apps/fabric-website/src/pages/Components/SpinButtonComponentPage.tsx b/apps/fabric-website/src/pages/Components/SpinButtonComponentPage.tsx
new file mode 100644
index 0000000000000..9da1685a03e5f
--- /dev/null
+++ b/apps/fabric-website/src/pages/Components/SpinButtonComponentPage.tsx
@@ -0,0 +1,37 @@
+import * as React from 'react';
+import { SpinButtonPage } from 'office-ui-fabric-react/lib/components/SpinButton/SpinButtonPage';
+import { PageHeader } from '../../components/PageHeader/PageHeader';
+import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+
+export class SpinButtonComponentPage extends React.Component<any, any> {
+  public render() {
+    return (
+      <div ref='pageElement'>
+        <ComponentPage>
+          <PageHeader pageTitle='SpinButton' backgroundColor='#038387'
+            links={
+              [
+                {
+                  'text': 'Overview',
+                  'location': 'Overview'
+                },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
+                {
+                  'text': 'Variants',
+                  'location': 'Variants'
+                },
+                {
+                  'text': 'Implementation',
+                  'location': 'Implementation'
+                }
+              ]
+            } />
+          <SpinButtonPage isHeaderVisible={ false } />
+        </ComponentPage>
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/SpinButton.ts b/packages/office-ui-fabric-react/src/SpinButton.ts
new file mode 100644
index 0000000000000..25568549f09b5
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/SpinButton.ts
@@ -0,0 +1 @@
+export * from './components/SpinButton/index';
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts
new file mode 100644
index 0000000000000..ac8a3233a54d5
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts
@@ -0,0 +1,107 @@
+import { Position } from '../../utilities/positioning';
+import { IIconProps } from '../../Icon';
+
+export interface ISpinButtonProps {
+
+  /**
+   * The initial value of the SpinButton. Use this if you intend for the SpinButton to be an uncontrolled component.
+   * This value is mutually exclusive to value. Use one or the other.
+   * @default 0
+   */
+  defaultValue?: string;
+
+  /**
+   * The value of the SpinButton. Use this if you intend to pass in a new value as a result of onChange events.
+   * This value is mutually exclusive to defaultValue. Use one or the other.
+   */
+  value?: string;
+
+  /**
+   * The min value of the SpinButton.
+   * @default 0
+   */
+  min?: number;
+
+  /**
+   * The max value of the SpinButton.
+   * @default 10
+   */
+  max?: number;
+
+  /**
+   * The difference between the two adjacent values of the SpinButton.
+   * @default 1
+   */
+  step?: number;
+
+  /**
+   * A description of the SpinButton for the benefit of screen readers.
+   */
+  ariaLabel?: string;
+
+  /**
+   * A title for the SpinButton used for a more descriptive name that's also visible on its tooltip.
+   */
+  title?: string;
+
+  /**
+   * Whether or not the SpinButton is disabled.
+   */
+  disabled?: boolean;
+
+  /**
+  * Optional className for SpinButton.
+  */
+  className?: string;
+
+  /**
+   * Descriptive label for the SpinButton.
+   */
+  label: string;
+
+  /**
+   * @default: Left
+   */
+  labelPosition?: Position;
+
+  /**
+   * Icon that goes along with the label for the whole SpinButton
+   */
+  iconProps?: IIconProps;
+
+  /**
+   * This callback is triggered when the value inside the SpinButton should be validated.
+   * @return {string | void} If a string is returned, it will be used as the value of the SpinButton.
+   */
+  onValidate?: (value: string) => string | void;
+
+  /**
+   * This callback is triggered when the increment button is pressed or if the user presses up arrow with focus on the input of the spinButton
+   * @return {string | void} If a string is returned, it will be used as the value of the SpinButton.
+   */
+  onIncrement?: (value: string) => string | void;
+
+  /**
+   * This callback is triggered when the decrement button is pressed or if the user presses down arrow with focus on the input of the spinButton
+   * @return {string | void} If a string is returned, it will be used as the value of the SpinButton.
+   */
+  onDecrement?: (value: string) => string | void;
+
+  /**
+   * Icon for the increment button of the spinButton
+   */
+  incrementButtonIcon?: IIconProps;
+
+  /**
+   * Icon for the decrement button of the spinButton
+   */
+  decrementButtonIcon?: IIconProps;
+}
+
+export interface ISpinButton {
+  /**
+   * The value of the SpinButton. Use this if you intend to pass in a new value as a result of onChange events.
+   * This value is mutually exclusive to defaultValue. Use one or the other.
+   */
+  value?: string;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.scss b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.scss
new file mode 100644
index 0000000000000..90ea34b50ff0e
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.scss
@@ -0,0 +1,226 @@
+@import '../../common/common';
+@import '../Label/LabelMixins.scss';
+
+.ArrowBox, .Input,
+.UpButton, .DownButton, .SpinButtonContainer {
+  outline: none;
+  font-size: 12px;
+}
+
+.SpinButtonLabel {
+  pointer-events: none;
+  padding: 2px 0px;
+}
+
+.SpinButtonContainer {
+  width: 100%;
+  min-width: 86px;
+  padding: 2px;
+}
+
+  .ArrowBox {
+    display: block;
+    float: left;
+    height: 100%;
+    border: 1px solid $ms-color-neutralTertiaryAlt;
+    border-left-width: 0px;
+    cursor: default;
+    padding: 0px;
+    box-sizing: border-box;
+  }
+
+  .SpinButtonWrapper:hover .ArrowBox, .SpinButtonWrapper:hover .Input {
+    border-color: $ms-color-neutralSecondaryAlt;
+    outline: 2px dashed transparent;
+
+    @media screen and (-ms-high-contrast: active) {
+      border-color: $ms-color-contrastBlackSelected;
+    }
+
+    @media screen and (-ms-high-contrast: black-on-white) {
+      border-color: $ms-color-contrastWhiteSelected;
+    }
+  }
+
+  .labelWrapper {
+    display: inline-flex;
+
+    &.start {
+       float: left;
+       margin-right: 10px;
+    }
+
+    &.end {
+      float: right;
+      margin-left: 10px;
+    }
+
+    &.top {
+      margin-bottom: 10px;
+    }
+
+    &.bottom {
+      margin-top: 10px;
+    }
+  }
+
+  .SpinButtonIcon {
+    padding: 2px 5px;
+    font-size: 20px;
+  }
+
+  .SpinButtonWrapper {
+    display: flex;
+    height: 26px;
+    min-width: 86px;
+  }
+
+  .SpinButtonWrapper.topBottom {
+    width: 100%;
+  }
+
+  .Input:focus + .ArrowBox {
+      border-color: $ms-color-themePrimary;
+      outline: 2px dashed transparent;
+
+      @media screen and (-ms-high-contrast: active) {
+        border-color: $ms-color-contrastBlackSelected;
+      }
+
+      @media screen and (-ms-high-contrast: black-on-white) {
+        border-color: $ms-color-contrastWhiteSelected;
+      }
+  }
+
+  .Input.disabled + .ArrowBox {
+    background-color: $ms-color-neutralLighter;
+    border-color: $ms-color-neutralLighter;
+    pointer-events: none;
+    cursor: default;
+
+    @media screen and (-ms-high-contrast: active) {
+    color: $ms-color-contrastBlackDisabled;
+    }
+
+    @media screen and (-ms-high-contrast: black-on-white) {
+      color: $ms-color-contrastWhiteDisabled;
+    }
+  }
+
+    .SpinButtonWrapper:hover .Input:focus {
+      border-color: $ms-color-themePrimary;
+    }
+
+  .Input {
+    @include ms-normalize;
+    border: 1px solid $ms-color-neutralTertiaryAlt;
+    border-radius: 0;
+    font-weight: $ms-font-weight-regular;
+    font-size: $ms-font-size-m;
+    color: $ms-color-neutralPrimary;
+    height: 100%;
+    @include padding(3px, 3px, 4px, 4px);
+    outline: 0;
+    text-overflow: ellipsis;
+    display: block;
+    float: left;
+    width: calc(100% - 14px);
+    min-width: 72px;
+    border-right-width: 0px;
+    overflow: hidden;
+    cursor: text;
+    user-select: text;
+
+    &:focus {
+      border-color: $ms-color-themePrimary;
+      outline: 2px dashed transparent;
+
+      @media screen and (-ms-high-contrast: active) {
+        border-color: $ms-color-contrastBlackSelected;
+      }
+
+      @media screen and (-ms-high-contrast: black-on-white) {
+        border-color: $ms-color-contrastWhiteSelected;
+      }
+    }
+
+    &::selection {
+      background-color: $ms-color-themePrimary;
+      color: $ms-color-white;
+    }
+  }
+
+  .SpinButtonWrapper:hover .Input.disabled,
+   .Input.disabled {
+      background-color: $ms-color-neutralLighter;
+      border-color: $ms-color-neutralLighter;
+      pointer-events: none;
+      cursor: default;
+      color: $ms-color-neutralTertiaryAlt;
+
+    @media screen and (-ms-high-contrast: active) {
+    color: $ms-color-contrastBlackDisabled;
+    }
+
+    @media screen and (-ms-high-contrast: black-on-white) {
+      color: $ms-color-contrastWhiteDisabled;
+    }
+  }
+
+  .Input:hover .UpButton, .Input:hover .DownButton {
+      background-color: $ms-color-neutralLighter;
+  }
+
+  .SpinButtonWrapper .UpButton, .SpinButtonWrapper .DownButton {
+    display: block;
+    height: 50%;
+    width: 12px;
+    padding: 0px;
+    background-color: transparent;
+    text-align: center;
+    cursor: default;
+    font-size: 6px;
+    color: $ms-color-neutralPrimary;
+
+    &:hover {
+      background-color: $ms-color-neutralLight;
+    }
+
+    &:active {
+      background-color: $ms-color-themePrimary;
+      color: $ms-color-white;
+
+      @media screen and (-ms-high-contrast: active) {
+        background-color: $ms-color-contrastBlackSelected;
+      }
+
+      @media screen and (-ms-high-contrast: black-on-white) {
+        background-color: $ms-color-contrastWhiteSelected;
+      }
+    }
+  }
+
+  .UpButton:disabled, .DownButton:disabled {
+    opacity: 0;
+
+    @media screen and (-ms-high-contrast: active) {
+    color: $ms-color-contrastBlackDisabled;
+    }
+
+    @media screen and (-ms-high-contrast: black-on-white) {
+      color: $ms-color-contrastWhiteDisabled;
+    }
+  }
+
+  .SpinButtonWrapper .UpButton.active, .SpinButtonWrapper .DownButton.active {
+      background-color: $ms-color-themePrimary;
+      color: $ms-color-white;
+
+      @media screen and (-ms-high-contrast: active) {
+        background-color: $ms-color-contrastBlackSelected;
+      }
+
+      @media screen and (-ms-high-contrast: black-on-white) {
+        background-color: $ms-color-contrastWhiteSelected;
+      }
+  }
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
new file mode 100644
index 0000000000000..64d48a3cf5c17
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
@@ -0,0 +1,554 @@
+import { Promise } from 'es6-promise';
+import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+import * as ReactTestUtils from 'react-addons-test-utils';
+import { SpinButton } from './SpinButton';
+import { KeyCodes } from '../../Utilities';
+
+const expect: Chai.ExpectStatic = chai.expect;
+
+describe('SpinButton', () => {
+  function renderIntoDocument(element: React.ReactElement<any>): HTMLElement {
+    const component = ReactTestUtils.renderIntoDocument(element);
+    const renderedDOM: Element = ReactDOM.findDOMNode(component as React.ReactInstance);
+    return renderedDOM as HTMLElement;
+  }
+
+  function mockEvent(targetValue: string = ''): ReactTestUtils.SyntheticEventData {
+    const target: EventTarget = { value: targetValue } as HTMLInputElement;
+    const event: ReactTestUtils.SyntheticEventData = { target };
+    return event;
+  }
+
+  it('should render a spinner with the default value on the input element', () => {
+    const exampleLabelValue: string = 'SpinButton';
+    const exampleMinValue: number = 2;
+    const exampleMaxValue: number = 22;
+    const exampleDefaultValue: string = '12';
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <SpinButton
+        label={ exampleLabelValue }
+        min={ exampleMinValue }
+        max={ exampleMaxValue }
+        defaultValue={ exampleDefaultValue }
+      />
+    );
+
+    // Assert on the input element.
+    const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
+    const labelDOM: HTMLLabelElement = renderedDOM.getElementsByTagName('label')[0];
+
+    expect(inputDOM.value).to.equal(exampleDefaultValue);
+    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(exampleDefaultValue));
+    expect(inputDOM.getAttribute('aria-labelledby')).to.equals(labelDOM.id);
+
+    // Assert on the label element.
+    expect(labelDOM.textContent).to.equal(exampleLabelValue);
+    expect(labelDOM.htmlFor).to.equal(inputDOM.id);
+  });
+
+  it('should increment the value in the spin button via the up button', () => {
+    const exampleLabelValue: string = 'SpinButton';
+    const exampleMinValue: number = 2;
+    const exampleMaxValue: number = 22;
+    const exampleDefaultValue: string = '12';
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <SpinButton
+        label={ exampleLabelValue }
+        min={ exampleMinValue }
+        max={ exampleMaxValue }
+        defaultValue={ exampleDefaultValue }
+      />
+    );
+
+    // Assert on the input element.
+    const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
+    const buttonDOM: Element = renderedDOM.getElementsByClassName('ms-UpButton')[0];
+
+    expect(buttonDOM.tagName).to.equal('BUTTON');
+
+    ReactTestUtils.Simulate.mouseDown(buttonDOM,
+      {
+        type: 'mousedown',
+        clientX: 0,
+        clientY: 0
+      });
+
+    ReactTestUtils.Simulate.mouseUp(buttonDOM,
+      {
+        type: 'mouseup',
+        clientX: 0,
+        clientY: 0
+      });
+
+    expect(inputDOM.value).to.equal('13');
+    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).to.equal('13');
+
+  });
+
+  it('should decrement the value in the spin button by the down button', () => {
+    const exampleLabelValue: string = 'SpinButton';
+    const exampleMinValue: number = 2;
+    const exampleMaxValue: number = 22;
+    const exampleDefaultValue: string = '12';
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <SpinButton
+        label={ exampleLabelValue }
+        min={ exampleMinValue }
+        max={ exampleMaxValue }
+        defaultValue={ exampleDefaultValue }
+      />
+    );
+
+    // Assert on the input element.
+    const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
+    const buttonDOM: Element = renderedDOM.getElementsByClassName('ms-DownButton')[0];
+
+    expect(buttonDOM.tagName).to.equal('BUTTON');
+
+    ReactTestUtils.Simulate.mouseDown(buttonDOM,
+      {
+        type: 'mousedown',
+        clientX: 0,
+        clientY: 0
+      });
+
+    ReactTestUtils.Simulate.mouseUp(buttonDOM,
+      {
+        type: 'mouseup',
+        clientX: 0,
+        clientY: 0
+      });
+
+    expect(inputDOM.value).to.equal('11');
+    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).to.equal('11');
+
+  });
+
+  it('should increment the value in the spin button by the up arrow', () => {
+    const exampleLabelValue: string = 'SpinButton';
+    const exampleMinValue: number = 2;
+    const exampleMaxValue: number = 22;
+    const exampleDefaultValue: string = '12';
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <SpinButton
+        label={ exampleLabelValue }
+        min={ exampleMinValue }
+        max={ exampleMaxValue }
+        defaultValue={ exampleDefaultValue }
+      />
+    );
+
+    // Assert on the input element.
+    const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
+
+    ReactTestUtils.Simulate.keyDown(inputDOM,
+      {
+        which: KeyCodes.up
+      });
+
+    ReactTestUtils.Simulate.keyUp(inputDOM,
+      {
+        which: KeyCodes.up
+      });
+
+    expect(inputDOM.value).to.equal('13');
+    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).to.equal('13');
+
+  });
+
+  it('should decrement the value in the spin button by the down arrow', () => {
+    const exampleLabelValue: string = 'SpinButton';
+    const exampleMinValue: number = 2;
+    const exampleMaxValue: number = 22;
+    const exampleDefaultValue: string = '12';
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <SpinButton
+        label={ exampleLabelValue }
+        min={ exampleMinValue }
+        max={ exampleMaxValue }
+        defaultValue={ exampleDefaultValue }
+      />
+    );
+
+    // Assert on the input element.
+    const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
+
+    ReactTestUtils.Simulate.keyDown(inputDOM,
+      {
+        which: KeyCodes.down
+      });
+
+    ReactTestUtils.Simulate.keyUp(inputDOM,
+      {
+        which: KeyCodes.down
+      });
+
+    expect(inputDOM.value).to.equal('11');
+    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).to.equal('11');
+
+  });
+
+  it('should increment the value in the spin button by a step value of 2', () => {
+    const exampleLabelValue: string = 'SpinButton';
+    const exampleMinValue: number = 2;
+    const exampleMaxValue: number = 22;
+    const exampleDefaultValue: string = '12';
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <SpinButton
+        label={ exampleLabelValue }
+        min={ exampleMinValue }
+        max={ exampleMaxValue }
+        defaultValue={ exampleDefaultValue }
+        step={ 2 }
+      />
+    );
+
+    // Assert on the input element.
+    const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
+
+    ReactTestUtils.Simulate.keyDown(inputDOM,
+      {
+        which: KeyCodes.up
+      });
+
+    ReactTestUtils.Simulate.keyUp(inputDOM,
+      {
+        which: KeyCodes.up
+      });
+
+    expect(inputDOM.value).to.equal('14');
+    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).to.equal('14');
+
+  });
+
+  it('should decrement the value in the spin button by a step value of 2', () => {
+    const exampleLabelValue: string = 'SpinButton';
+    const exampleMinValue: number = 2;
+    const exampleMaxValue: number = 22;
+    const exampleDefaultValue: string = '12';
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <SpinButton
+        label={ exampleLabelValue }
+        min={ exampleMinValue }
+        max={ exampleMaxValue }
+        defaultValue={ exampleDefaultValue }
+        step={ 2 }
+      />
+    );
+
+    // Assert on the input element.
+    const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
+
+    ReactTestUtils.Simulate.keyDown(inputDOM,
+      {
+        which: KeyCodes.down
+      });
+
+    ReactTestUtils.Simulate.keyUp(inputDOM,
+      {
+        which: KeyCodes.down
+      });
+
+    expect(inputDOM.value).to.equal('10');
+    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).to.equal('10');
+
+  });
+
+  it('should set the value of the spin button by manual entry', () => {
+    const exampleLabelValue: string = 'SpinButton';
+    const exampleMinValue: number = 2;
+    const exampleMaxValue: number = 22;
+    const exampleDefaultValue: string = '12';
+    const exampleNewValue: string = '21';
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <SpinButton
+        label={ exampleLabelValue }
+        min={ exampleMinValue }
+        max={ exampleMaxValue }
+        defaultValue={ exampleDefaultValue }
+      />
+    );
+
+    // Assert on the input element.
+    const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
+    ReactTestUtils.Simulate.input(inputDOM, mockEvent(exampleNewValue));
+    ReactTestUtils.Simulate.blur(inputDOM);
+
+    expect(inputDOM.value).to.equal(exampleNewValue);
+    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(exampleNewValue));
+  });
+
+  it('should reset the value of the spin button with invalid manual entry', () => {
+    const exampleLabelValue: string = 'SpinButton';
+    const exampleMinValue: number = 2;
+    const exampleMaxValue: number = 22;
+    const exampleDefaultValue: string = '12';
+    const exampleNewValue: string = 'garbage';
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <SpinButton
+        label={ exampleLabelValue }
+        min={ exampleMinValue }
+        max={ exampleMaxValue }
+        defaultValue={ exampleDefaultValue }
+      />
+    );
+
+    // Assert on the input element.
+    const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
+    ReactTestUtils.Simulate.input(inputDOM, mockEvent(exampleNewValue));
+    ReactTestUtils.Simulate.blur(inputDOM);
+
+    expect(inputDOM.value).to.equal(exampleDefaultValue);
+    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(exampleDefaultValue));
+  });
+
+  it('should revert to max value when input value is higher than the max of the spin button', () => {
+    const exampleLabelValue: string = 'SpinButton';
+    const exampleMinValue: number = 2;
+    const exampleMaxValue: number = 22;
+    const exampleDefaultValue: string = '12';
+    const exampleNewValue: string = '23';
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <SpinButton
+        label={ exampleLabelValue }
+        min={ exampleMinValue }
+        max={ exampleMaxValue }
+        defaultValue={ exampleDefaultValue }
+      />
+    );
+
+    // Assert on the input element.
+    const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
+    ReactTestUtils.Simulate.input(inputDOM, mockEvent(exampleNewValue));
+    ReactTestUtils.Simulate.blur(inputDOM);
+
+    expect(inputDOM.value).to.equal(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(exampleMaxValue));
+  });
+
+  it('should revert existing value when input value is lower than the min of the spin button', () => {
+    const exampleLabelValue: string = 'SpinButton';
+    const exampleMinValue: number = 2;
+    const exampleMaxValue: number = 22;
+    const exampleDefaultValue: string = '12';
+    const exampleNewValue: string = '0';
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <SpinButton
+        label={ exampleLabelValue }
+        min={ exampleMinValue }
+        max={ exampleMaxValue }
+        defaultValue={ exampleDefaultValue }
+      />
+    );
+
+    // Assert on the input element.
+    const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
+    ReactTestUtils.Simulate.input(inputDOM, mockEvent(String(exampleNewValue)));
+    ReactTestUtils.Simulate.blur(inputDOM);
+
+    expect(inputDOM.value).to.equal(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(exampleMinValue));
+  });
+
+  it('should use validator passed to the spin button (with valid input)', () => {
+    const errorMessage: string = 'The value is invalid';
+    const exampleLabelValue: string = 'SpinButton';
+    const exampleMinValue: number = 2;
+    const exampleMaxValue: number = 22;
+    const exampleDefaultValue: string = '12';
+    const exampleNewValue: string = '21';
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <SpinButton
+        label={ exampleLabelValue }
+        min={ exampleMinValue }
+        max={ exampleMaxValue }
+        defaultValue={ exampleDefaultValue }
+        onValidate={ (newValue: string): string => {
+          let numberValue: number = +newValue;
+          return (!isNaN(numberValue) && numberValue >= exampleMinValue && numberValue <= exampleMaxValue) ? newValue : errorMessage;
+        } }
+      />
+    );
+
+    // Assert on the input element.
+    const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
+    ReactTestUtils.Simulate.input(inputDOM, mockEvent(String(exampleNewValue)));
+    ReactTestUtils.Simulate.blur(inputDOM);
+
+    expect(inputDOM.value).to.equal(String(exampleNewValue));
+    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(exampleNewValue));
+  });
+
+  it('should use validator passed to the spin button', () => {
+    const errorMessage: string = 'The value is invalid';
+    const exampleLabelValue: string = 'SpinButton';
+    const exampleMinValue: number = 2;
+    const exampleMaxValue: number = 22;
+    const exampleDefaultValue: string = '12';
+    const exampleNewValue: string = '100';
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <SpinButton
+        label={ exampleLabelValue }
+        min={ exampleMinValue }
+        max={ exampleMaxValue }
+        value={ exampleDefaultValue }
+        onValidate={ (newValue: string): string => {
+          let numberValue: number = Number(newValue);
+          return (!isNaN(numberValue) && numberValue >= exampleMinValue && numberValue <= exampleMaxValue) ? newValue : errorMessage;
+        } }
+      />
+    );
+
+    // Assert on the input element.
+    const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
+    ReactTestUtils.Simulate.input(inputDOM, mockEvent(String(exampleNewValue)));
+    ReactTestUtils.Simulate.blur(inputDOM);
+
+    expect(inputDOM.value).to.equal(String(errorMessage));
+    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(errorMessage));
+  });
+
+  it('should have correct value after increment and using defaultValue', () => {
+    const exampleLabelValue: string = 'SpinButton';
+    const exampleMinValue: number = 2;
+    const exampleMaxValue: number = 22;
+    const exampleDefaultValue: string = '12';
+    const exampleStepValue: number = 2;
+    const exampleNewValue: string = String(Number(exampleDefaultValue) + exampleStepValue);
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <SpinButton
+        label={ exampleLabelValue }
+        min={ exampleMinValue }
+        max={ exampleMaxValue }
+        defaultValue={ exampleDefaultValue }
+        step={ exampleStepValue }
+      />
+    );
+
+    // Assert on the input element.
+    const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
+    const upButtonDOM: HTMLButtonElement = renderedDOM.getElementsByClassName('ms-UpButton')[0] as HTMLButtonElement;
+    ReactTestUtils.Simulate.mouseDown(upButtonDOM);
+    ReactTestUtils.Simulate.mouseUp(upButtonDOM);
+
+    expect(inputDOM.value).to.equal(String(exampleNewValue));
+    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(exampleNewValue));
+  });
+
+  it('should have correct value after decrement and using defaultValue', () => {
+    const exampleLabelValue: string = 'SpinButton';
+    const exampleMinValue: number = 2;
+    const exampleMaxValue: number = 22;
+    const exampleDefaultValue: string = '12';
+    const exampleStepValue: number = 2;
+    const exampleNewValue: string = String(Number(exampleDefaultValue) - exampleStepValue);
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <SpinButton
+        label={ exampleLabelValue }
+        min={ exampleMinValue }
+        max={ exampleMaxValue }
+        defaultValue={ exampleDefaultValue }
+        step={ exampleStepValue }
+      />
+    );
+
+    // Assert on the input element.
+    const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
+    const downButtonDOM: HTMLButtonElement = renderedDOM.getElementsByClassName('ms-DownButton')[0] as HTMLButtonElement;
+    ReactTestUtils.Simulate.mouseDown(downButtonDOM);
+    ReactTestUtils.Simulate.mouseUp(downButtonDOM);
+
+    expect(inputDOM.value).to.equal(String(exampleNewValue));
+    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(exampleNewValue));
+  });
+
+  it('should stop spinning if text field is focused while actively spinning', () => {
+    const exampleLabelValue: string = 'SpinButton';
+    const exampleMinValue: number = 2;
+    const exampleMaxValue: number = 22;
+    const exampleDefaultValue: string = '12';
+
+    function delay(millisecond: number): Promise<string> {
+      return new Promise<string>((resolve) => setTimeout(resolve, millisecond));
+    }
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <SpinButton
+        label={ exampleLabelValue }
+        min={ exampleMinValue }
+        max={ exampleMaxValue }
+        defaultValue={ exampleDefaultValue }
+      />
+    );
+
+    // Assert on the input element.
+    const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
+    const buttonDOM: Element = renderedDOM.getElementsByClassName('ms-UpButton')[0];
+
+    expect(buttonDOM.tagName).to.equal('BUTTON');
+
+    ReactTestUtils.Simulate.mouseDown(buttonDOM,
+      {
+        type: 'mousedown',
+        clientX: 0,
+        clientY: 0
+      });
+
+    delay(500).then(() => ReactTestUtils.Simulate.focus(inputDOM));
+
+    let currentValue = inputDOM.value;
+    expect(currentValue).to.not.equal('2');
+    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(currentValue);
+
+    let newCurrentValue = inputDOM.value;
+    expect(currentValue).to.equal(newCurrentValue);
+  });
+});
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
new file mode 100644
index 0000000000000..4e29fefbe90fb
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -0,0 +1,428 @@
+import * as React from 'react';
+import { IconButton } from '../../Button';
+import { Label } from '../../Label';
+import { Icon } from '../../Icon';
+import {
+  BaseComponent,
+  css,
+  getId,
+  KeyCodes,
+  autobind
+} from '../../Utilities';
+import {
+  ISpinButton,
+  ISpinButtonProps
+} from './SpinButton.Props';
+import { Position } from '../../utilities/positioning';
+import * as stylesImport from './SpinButton.scss';
+const styles: any = stylesImport;
+
+export enum KeyboardSpinDirection {
+  down = -1,
+  notSpinning = 0,
+  up = 1
+}
+
+export interface ISpinButtonState {
+  /**
+   * the value of the spin button
+   */
+  value?: string;
+
+  /**
+   * keyboard spin direction, used to style the up or down button
+   * as active when up/down arrow is pressed
+   */
+  keyboardSpinDirection?: KeyboardSpinDirection;
+}
+
+export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState> implements ISpinButton {
+
+  public static defaultProps: ISpinButtonProps = {
+    step: 1,
+    min: 0,
+    max: 100,
+    disabled: false,
+    labelPosition: Position.start,
+    label: null,
+    incrementButtonIcon: { iconName: 'ChevronUpSmall' },
+    decrementButtonIcon: { iconName: 'ChevronDownSmall' }
+  };
+
+  private _input: HTMLInputElement;
+  private _inputId: string;
+  private _labelId: string;
+  private _lastValidValue: string;
+  private _spinningByMouse: boolean;
+
+  private _onValidate?: (value: string) => string | void;
+  private _onIncrement?: (value: string) => string | void;
+  private _onDecrement?: (value: string) => string | void;
+
+  private _currentStepFunctionHandle: number;
+  private _stepDelay = 100;
+  private _formattedValidUnitOptions: string[] = [];
+  private _arrowButtonStyle: React.CSSProperties = {
+    icon: {
+      fontSize: '6px',
+    }
+  };
+
+  constructor(props: ISpinButtonProps) {
+    super(props);
+
+    this._warnMutuallyExclusive({
+      'value': 'defaultValue'
+    });
+
+    let value = props.value || props.defaultValue || String(props.min);
+    this._lastValidValue = value;
+
+    this.state = {
+      value: value,
+      keyboardSpinDirection: KeyboardSpinDirection.notSpinning
+    };
+
+    this._currentStepFunctionHandle = -1;
+    this._labelId = getId('Label');
+    this._inputId = getId('input');
+    this._spinningByMouse = false;
+
+    if (props.defaultValue) {
+      this._onValidate = this._defaultOnValidate;
+      this._onIncrement = this._defaultOnIncrement;
+      this._onDecrement = this._defaultOnDecrement;
+    } else {
+      this._onValidate = props.onValidate;
+      this._onIncrement = props.onIncrement;
+      this._onDecrement = props.onDecrement;
+    }
+
+    this.focus = this.focus.bind(this);
+  }
+
+  /**
+  * Invoked when a component is receiving new props. This method is not called for the initial render.
+  */
+  public componentWillReceiveProps(newProps: ISpinButtonProps): void {
+    this._lastValidValue = this.state.value;
+    let value: string = newProps.value ? newProps.value : String(newProps.min);
+    if (newProps.defaultValue) {
+      value = String(Math.max(newProps.min, Math.min(newProps.max, Number(newProps.defaultValue))));
+    }
+
+    this.setState({
+      value: value
+    });
+  }
+
+  public render() {
+    const {
+      disabled,
+      label,
+      min,
+      max,
+      labelPosition,
+      iconProps,
+      incrementButtonIcon,
+      decrementButtonIcon,
+      title,
+      ariaLabel
+    } = this.props;
+
+    const {
+      value,
+      keyboardSpinDirection
+    } = this.state;
+
+    return (
+      <div className={ styles.SpinButtonContainer }>
+        { labelPosition !== Position.bottom && <div className={ css(styles.labelWrapper, this._getClassNameForLabelPosition(labelPosition)) }>
+          { iconProps && <Icon iconName={ iconProps.iconName } className={ css(styles.SpinButtonIcon) } aria-hidden='true'></Icon> }
+          { label &&
+            <Label
+              id={ this._labelId }
+              htmlFor={ this._inputId }
+              className={ styles.SpinButtonLabel }>{ label }
+            </Label>
+          }
+        </div> }
+        <div
+          className={ css(styles.SpinButtonWrapper, ((labelPosition === Position.top || labelPosition === Position.bottom) ? styles.topBottom : '')) }
+          title={ title && title }
+          aria-label={ ariaLabel && ariaLabel }
+        >
+          <input
+            value={ value }
+            id={ this._inputId }
+            onChange={ this._onChange }
+            onInput={ this._onInputChange }
+            className={ css(styles.Input, (disabled ? styles.disabled : '')) }
+            type='text'
+            role='spinbutton'
+            aria-labelledby={ label && this._labelId }
+            aria-valuenow={ value }
+            aria-valuemin={ min && String(min) }
+            aria-valuemax={ max && String(max) }
+            onBlur={ this._validate }
+            ref={ this._resolveRef('_input') }
+            onFocus={ this.focus }
+            onKeyDown={ this._handleKeyDown }
+            onKeyUp={ this._handleKeyUp }
+            readOnly={ disabled }
+            aria-disabled={ disabled }
+          />
+          <span className={ styles.ArrowBox }>
+            <IconButton
+              className={ css('ms-UpButton', styles.UpButton, (keyboardSpinDirection === KeyboardSpinDirection.up ? styles.active : '')) }
+              styles={ this._arrowButtonStyle }
+              disabled={ disabled }
+              iconProps={ incrementButtonIcon }
+              aria-hidden='true'
+              onMouseDown={ () => this._onIncrementMouseDown() }
+              onMouseLeave={ this._stop }
+              onMouseUp={ this._stop }
+              tabIndex={ -1 }
+            />
+            <IconButton
+              className={ css('ms-DownButton', styles.DownButton, (keyboardSpinDirection === KeyboardSpinDirection.down ? styles.active : '')) }
+              styles={ this._arrowButtonStyle }
+              disabled={ disabled }
+              iconProps={ decrementButtonIcon }
+              aria-hidden='true'
+              onMouseDown={ () => this._onDecrementMouseDown() }
+              onMouseLeave={ this._stop }
+              onMouseUp={ this._stop }
+              tabIndex={ -1 }
+            />
+          </span>
+        </div>
+        { labelPosition === Position.bottom && <div className={ css(styles.labelWrapper, this._getClassNameForLabelPosition(labelPosition)) }>
+          { iconProps && <Icon iconName={ iconProps.iconName } className={ css(styles.SpinButtonIcon) } aria-hidden='true'></Icon> }
+          { label &&
+            <Label
+              id={ this._labelId }
+              htmlFor={ this._inputId }
+              className={ styles.SpinButtonLabel }>{ label }
+            </Label>
+          }
+        </div>
+        }
+      </div>
+    );
+  }
+
+  /**
+   * OnFocus select the contents of the input
+   */
+  public focus() {
+    if (this._spinningByMouse || this.state.keyboardSpinDirection !== KeyboardSpinDirection.notSpinning) {
+      this._stop();
+    }
+
+    this._input.focus();
+    this._input.select();
+  }
+
+  /**
+   * Validate function to use if one is not passed in
+   */
+  private _defaultOnValidate = (value: string) => {
+    if (isNaN(Number(value))) {
+      return this._lastValidValue;
+    }
+    const newValue = Math.min(this.props.max, Math.max(this.props.min, Number(value)));
+    return String(newValue);
+  }
+
+  /**
+   * Increment function to use if one is not passed in
+   */
+  private _defaultOnIncrement = (value: string) => {
+    let newValue = Math.min(Number(value) + this.props.step, this.props.max);
+    return String(newValue);
+  }
+
+  /**
+   * Increment function to use if one is not passed in
+   */
+  private _defaultOnDecrement = (value: string) => {
+    let newValue = Math.max(Number(value) - this.props.step, this.props.min);
+    return String(newValue);
+  }
+
+  /**
+   * Returns the class name corresponding to the label position
+   */
+  private _getClassNameForLabelPosition(labelPosition: Position): string {
+    let className: string = '';
+
+    switch (labelPosition) {
+      case Position.start:
+        className = styles.start;
+        break;
+      case Position.end:
+        className = styles.end;
+        break;
+      case Position.top:
+        className = styles.top;
+        break;
+      case Position.bottom:
+        className = styles.bottom;
+    }
+
+    return className;
+  }
+
+  private _onChange() {
+    /**
+     * A noop input change handler.
+     * https://github.com/facebook/react/issues/7027.
+     * Using the native onInput handler fixes the issue but onChange
+     * still need to be wired to avoid React console errors
+     * TODO: Check if issue is resolved when React 16 is available.
+     */
+  }
+
+  /**
+   * This is used when validating text entry
+   * in the input (not when changed via the buttons)
+   * @param event - the event that fired
+   */
+  @autobind
+  private _validate(event: React.FocusEvent<HTMLInputElement>) {
+    const element: HTMLInputElement = event.target as HTMLInputElement;
+    const value: string = element.value;
+    if (this.state.value) {
+      const newValue = this._onValidate(value);
+      if (newValue) {
+        this._lastValidValue = newValue;
+        this.setState({ value: newValue });
+      }
+    }
+  }
+
+  /**
+   * The method is needed to ensure we are updating the actual input value.
+   * without this our value will never change (and validation will not have the correct number)
+   * @param event - the event that was fired
+   */
+  @autobind
+  private _onInputChange(event: React.FormEvent<HTMLInputElement | HTMLTextAreaElement>): void {
+    const element: HTMLInputElement = event.target as HTMLInputElement;
+    const value: string = element.value;
+
+    this.setState({
+      value: value,
+    });
+  }
+
+  /**
+   * Update the value with the given stepFunction
+   * @param shouldSpin - should we fire off another updateValue when we are done here? This should be true
+   * when spinning in response to a mouseDown
+   * @param stepFunction - function to use to step by
+   */
+  @autobind
+  private _updateValue(shouldSpin: boolean, stepFunction: (string) => string | void) {
+    const newValue = stepFunction(this.state.value);
+    if (newValue) {
+      this._lastValidValue = newValue;
+      this.setState({ value: newValue });
+    }
+
+    if (this._spinningByMouse !== shouldSpin) {
+      this._spinningByMouse = shouldSpin;
+    }
+
+    if (shouldSpin) {
+      this._currentStepFunctionHandle = this._async.setTimeout(() => { this._updateValue(shouldSpin, stepFunction); }, this._stepDelay);
+    }
+  }
+
+  /**
+   * Stop spinning (clear any currently pending update and set spinning to false)
+   */
+  @autobind
+  private _stop() {
+    if (this._currentStepFunctionHandle >= 0) {
+      this._async.clearTimeout(this._currentStepFunctionHandle);
+      this._currentStepFunctionHandle = -1;
+    }
+
+    if (this._spinningByMouse || this.state.keyboardSpinDirection !== KeyboardSpinDirection.notSpinning) {
+      this._spinningByMouse = false;
+      this.setState({ keyboardSpinDirection: KeyboardSpinDirection.notSpinning });
+    }
+  }
+
+  /**
+   * Handle keydown on the text field. We need to update
+   * the value when up or down arrow are depressed
+   * @param event - the keyboardEvent that was fired
+   */
+  @autobind
+  private _handleKeyDown(event: React.KeyboardEvent<HTMLElement>) {
+    if (this.props.disabled) {
+      this._stop();
+
+      // eat the up and down arrow keys to keep the page from scrolling
+      if (event.which === KeyCodes.up || event.which === KeyCodes.down) {
+        event.preventDefault();
+        event.stopPropagation();
+      }
+
+      return;
+    }
+
+    let spinDirection = KeyboardSpinDirection.notSpinning;
+
+    if (event.which === KeyCodes.up) {
+
+      spinDirection = KeyboardSpinDirection.up;
+      this._updateValue(false /* shouldSpin */, this._onIncrement);
+    } else if (event.which === KeyCodes.down) {
+
+      spinDirection = KeyboardSpinDirection.down;
+      this._updateValue(false /* shouldSpin */, this._onDecrement);
+    } else if (event.which === KeyCodes.enter) {
+      event.currentTarget.blur();
+      this.focus();
+    } else if (event.which === KeyCodes.escape) {
+      if (this.state.value !== this._lastValidValue) {
+        this.setState({ value: this._lastValidValue });
+      }
+    }
+
+    // style the increment/decrement button to look active
+    // when the corresponding up/down arrow keys trigger a step
+    if (this.state.keyboardSpinDirection !== spinDirection) {
+      this.setState({ keyboardSpinDirection: spinDirection });
+    }
+  }
+
+  /**
+   * Make sure that we have stopped spinning on keyUp
+   * if the up or down arrow fired this event
+   * @param event stop spinning if we
+   */
+  @autobind
+  private _handleKeyUp(event: React.KeyboardEvent<HTMLElement>) {
+
+    if (this.props.disabled || event.which === KeyCodes.up || event.which === KeyCodes.down) {
+      this._stop();
+      return;
+    }
+  }
+
+  @autobind
+  private _onIncrementMouseDown() {
+    this._updateValue(true /* shouldSpin */, this._onIncrement);
+  }
+
+  @autobind
+  private _onDecrementMouseDown() {
+    this._updateValue(true /* shouldSpin */, this._onDecrement);
+  }
+
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
new file mode 100644
index 0000000000000..37fd9c958c51a
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
@@ -0,0 +1,97 @@
+import * as React from 'react';
+import {
+  ExampleCard,
+  IComponentDemoPageProps,
+  ComponentPage,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+import { SpinButtonBasicExample } from './examples/SpinButton.Basic.Example';
+import { SpinButtonBasicDisabledExample } from './examples/SpinButton.BasicDisabled.Example';
+import { SpinButtonStatefulExample } from './examples/SpinButton.Stateful.Example';
+import { SpinButtonBasicWithIconExample } from './examples/SpinButton.BasicWithIcon.Example';
+import { SpinButtonBasicWithEndPositionExample } from './examples/SpinButton.BasicWithEndPosition.Example';
+
+const SpinButtonBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx') as string;
+const SpinButtonBasicDisabledExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicDisabled.Example.tsx') as string;
+const SpinButtonStatefulExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx') as string;
+const SpinButtonBasicWithIconExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx') as string;
+const SpinButtonBasicWithEndPositionExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithEndPosition.Example.tsx') as string;
+
+export class SpinButtonPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render() {
+    return (
+      <ComponentPage
+        title='SpinButton'
+        componentName='SpinButtonExample'
+        exampleCards={
+          <div>
+            <ExampleCard
+              title={ 'Basic SpinButton' }
+              code={ SpinButtonBasicExampleCode }>
+              <SpinButtonBasicExample />
+            </ExampleCard>
+            <ExampleCard
+              title={ 'Basic Disabled SpinButton' }
+              code={ SpinButtonBasicDisabledExampleCode }>
+              <SpinButtonBasicDisabledExample />
+            </ExampleCard>
+            <ExampleCard
+              title={ 'Stateful SpinButton' }
+              code={ SpinButtonBasicExampleCode }>
+              <SpinButtonStatefulExample />
+            </ExampleCard>
+            <ExampleCard
+              title={ 'Basic SpinButton With Icon' }
+              code={ SpinButtonBasicWithIconExampleCode }>
+              <SpinButtonBasicWithIconExample />
+            </ExampleCard>
+            <ExampleCard
+              title={ 'Basic SpinButton With Icon and Positioned at the End' }
+              code={ SpinButtonBasicWithEndPositionExampleCode }>
+              <SpinButtonBasicWithEndPositionExample />
+            </ExampleCard>
+          </div>
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts')
+            ] }
+          />
+        }
+        overview={
+          <div>
+            <p>
+              A SpinButton allows the user to incrementaly adjust a value in small steps. It is mainly used for numeric values, but other values are supported too.
+            </p>
+          </div>
+        }
+        bestPractices={
+          <div></div>
+        }
+        dos={
+          <div>
+            <ul>
+              <li>Use a SpinButton when changing a value with precise control.</li>
+              <li>Use a SpinButton when values are tied to a unit.</li>
+              <li>Include a label indicating what value the SpinButton changes.</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul>
+              <li>Don’t use a SpinButton if the range of values is large.</li>
+              <li>Don’t use a SpinButton for binary settings.</li>
+              <li>Don't use a SpinButton for a range of three values or less.</li>
+            </ul>
+          </div>
+        }
+        related={
+          <a href='https://dev.office.com/fabric-js/Components/SpinButton/SpinButton.html'>Fabric JS</a>
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }>
+      </ComponentPage>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx
new file mode 100644
index 0000000000000..4999ef440bc24
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx
@@ -0,0 +1,18 @@
+import * as React from 'react';
+import { SpinButton } from 'office-ui-fabric-react/lib/SpinButton';
+
+export class SpinButtonBasicExample extends React.Component<any, any> {
+  public render() {
+    return (
+      <div style={ { width: '203px' } }>
+        <SpinButton
+          defaultValue='0'
+          label={ 'Basic SpinButton:' }
+          min={ 0 }
+          max={ 100 }
+          step={ 1 }
+        />
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicDisabled.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicDisabled.Example.tsx
new file mode 100644
index 0000000000000..b57b1d432db08
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicDisabled.Example.tsx
@@ -0,0 +1,19 @@
+import * as React from 'react';
+import { SpinButton } from 'office-ui-fabric-react/lib/SpinButton';
+
+export class SpinButtonBasicDisabledExample extends React.Component<any, any> {
+  public render() {
+    return (
+      <div style={ { width: '203px' } }>
+        <SpinButton
+          defaultValue='25'
+          label={ 'Basic SpinButton:' }
+          min={ 0 }
+          max={ 100 }
+          step={ 1 }
+          disabled={ true }
+        />
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithEndPosition.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithEndPosition.Example.tsx
new file mode 100644
index 0000000000000..31d1d77b14ab5
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithEndPosition.Example.tsx
@@ -0,0 +1,21 @@
+import * as React from 'react';
+import { SpinButton } from 'office-ui-fabric-react/lib/SpinButton';
+import { Position } from 'office-ui-fabric-react/lib/utilities/positioning';
+
+export class SpinButtonBasicWithEndPositionExample extends React.Component<any, any> {
+  public render() {
+    return (
+      <div style={ { width: '233px' } }>
+        <SpinButton
+          defaultValue='0'
+          iconProps={ { iconName: 'Light' } }
+          label={ 'Basic SpinButton' }
+          labelPosition={ Position.end }
+          min={ 0 }
+          max={ 100 }
+          step={ 1 }
+        />
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx
new file mode 100644
index 0000000000000..056ba07096ba3
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx
@@ -0,0 +1,19 @@
+import * as React from 'react';
+import { SpinButton } from 'office-ui-fabric-react/lib/SpinButton';
+
+export class SpinButtonBasicWithIconExample extends React.Component<any, any> {
+  public render() {
+    return (
+      <div style={ { width: '233px' } }>
+        <SpinButton
+          defaultValue='0'
+          iconProps={ { iconName: 'IncreaseIndentLegacy' } }
+          label={ 'Basic SpinButton:' }
+          min={ 0 }
+          max={ 100 }
+          step={ 1 }
+        />
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
new file mode 100644
index 0000000000000..205ddc1370100
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
@@ -0,0 +1,46 @@
+import * as React from 'react';
+import { SpinButton, ISpinButtonState, ISpinButtonProps } from 'office-ui-fabric-react/lib/SpinButton';
+
+export class SpinButtonStatefulExample extends React.Component<any, any> {
+  public render() {
+    let suffix = ' cm';
+
+    return (
+      <div style={ { width: '203px' } }>
+        <SpinButton
+          label='SpinButton with custom implementation:'
+          value={ '7' + suffix }
+          onValidate={ (value: string) => {
+            value = this.removeSuffix(value, suffix);
+            if (isNaN(+value)) {
+              return '0' + suffix;
+            }
+
+            return String(value) + suffix;
+          } }
+          onIncrement={ (value: string) => {
+            value = this.removeSuffix(value, suffix);
+            return String(+value + 2) + suffix;
+          } }
+          onDecrement={ (value: string) => {
+            value = this.removeSuffix(value, suffix);
+            return String(+value - 2) + suffix;
+          } }
+        />
+      </div>
+    );
+  }
+
+  private hasSuffix(string: string, suffix: string): Boolean {
+    let subString = string.substr(string.length - suffix.length);
+    return subString === suffix;
+  }
+
+  private removeSuffix(string: string, suffix: string): string {
+    if (!this.hasSuffix(string, suffix)) {
+      return string;
+    }
+
+    return string.substr(0, string.length - suffix.length);
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/index.ts b/packages/office-ui-fabric-react/src/components/SpinButton/index.ts
new file mode 100644
index 0000000000000..08acda35da3bd
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/index.ts
@@ -0,0 +1,2 @@
+export * from './SpinButton';
+export * from './SpinButton.Props';
diff --git a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
index d77a7debd6edf..6a02d00c8537d 100644
--- a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
+++ b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
@@ -202,6 +202,12 @@ export const AppDefinition: IAppDefinition = {
           name: 'SearchBox',
           url: '#/examples/searchbox'
         },
+        {
+          component: require<any>('../components/SpinButton/SpinButtonPage').SpinButtonPage,
+          key: 'SpinButton',
+          name: 'SpinButton',
+          url: '#/examples/spinbutton'
+        },
         {
           component: require<any>('../components/Spinner/SpinnerPage').SpinnerPage,
           key: 'Spinner',
diff --git a/packages/office-ui-fabric-react/src/index.ts b/packages/office-ui-fabric-react/src/index.ts
index 2cfe405cb6c25..952bd1f6b4afa 100644
--- a/packages/office-ui-fabric-react/src/index.ts
+++ b/packages/office-ui-fabric-react/src/index.ts
@@ -40,6 +40,7 @@ export * from './ProgressIndicator';
 export * from './Rating';
 export * from './SearchBox';
 export * from './Slider';
+export * from './SpinButton';
 export * from './Spinner';
 export * from './Styling';
 export * from './TeachingBubble';
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning.ts b/packages/office-ui-fabric-react/src/utilities/positioning.ts
index 75baa2310b660..b3b857cfd435e 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning.ts
@@ -13,6 +13,13 @@ export enum RectangleEdge {
   right = 3
 }
 
+export enum Position {
+  top = 0,
+  bottom = 1,
+  start = 2,
+  end = 3
+}
+
 let SLIDE_ANIMATIONS: { [key: number]: string; } = {
   [RectangleEdge.top]: 'slideUpIn20',
   [RectangleEdge.bottom]: 'slideDownIn20',

From 3e89e7bdc90da1fd714c990d59ce07c287dbe108 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 9 Jun 2017 10:10:47 +0000
Subject: [PATCH 0085/1641] Applying package updates.

---
 .../rtl-css-js_2017-06-08-18-28.json               | 11 -----------
 .../rtl-css-js_2017-06-08-18-28.json               | 11 -----------
 .../styling/rtl-css-js_2017-06-08-18-28.json       | 11 -----------
 .../utilities/rtl-css-js_2017-06-08-18-28.json     | 11 -----------
 .../rtl-css-js_2017-06-08-18-28.json               | 11 -----------
 packages/example-app-base/package.json             |  2 +-
 packages/office-ui-fabric-react/package.json       |  2 +-
 packages/styling/CHANGELOG.json                    | 14 ++++++++++++++
 packages/styling/CHANGELOG.md                      |  9 ++++++++-
 packages/styling/package.json                      |  2 +-
 10 files changed, 25 insertions(+), 59 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/rtl-css-js_2017-06-08-18-28.json
 delete mode 100644 common/changes/@uifabric/fabric-website/rtl-css-js_2017-06-08-18-28.json
 delete mode 100644 common/changes/@uifabric/styling/rtl-css-js_2017-06-08-18-28.json
 delete mode 100644 common/changes/@uifabric/utilities/rtl-css-js_2017-06-08-18-28.json
 delete mode 100644 common/changes/office-ui-fabric-react/rtl-css-js_2017-06-08-18-28.json

diff --git a/common/changes/@uifabric/example-app-base/rtl-css-js_2017-06-08-18-28.json b/common/changes/@uifabric/example-app-base/rtl-css-js_2017-06-08-18-28.json
deleted file mode 100644
index e807ce07d1d8c..0000000000000
--- a/common/changes/@uifabric/example-app-base/rtl-css-js_2017-06-08-18-28.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/rtl-css-js_2017-06-08-18-28.json b/common/changes/@uifabric/fabric-website/rtl-css-js_2017-06-08-18-28.json
deleted file mode 100644
index cbeaf5c6e2864..0000000000000
--- a/common/changes/@uifabric/fabric-website/rtl-css-js_2017-06-08-18-28.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/rtl-css-js_2017-06-08-18-28.json b/common/changes/@uifabric/styling/rtl-css-js_2017-06-08-18-28.json
deleted file mode 100644
index 317346312781e..0000000000000
--- a/common/changes/@uifabric/styling/rtl-css-js_2017-06-08-18-28.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Update the version of rtl-css-js used to get latest bug fixes",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/rtl-css-js_2017-06-08-18-28.json b/common/changes/@uifabric/utilities/rtl-css-js_2017-06-08-18-28.json
deleted file mode 100644
index 215b2a26b2777..0000000000000
--- a/common/changes/@uifabric/utilities/rtl-css-js_2017-06-08-18-28.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/rtl-css-js_2017-06-08-18-28.json b/common/changes/office-ui-fabric-react/rtl-css-js_2017-06-08-18-28.json
deleted file mode 100644
index d4aea377503d2..0000000000000
--- a/common/changes/office-ui-fabric-react/rtl-css-js_2017-06-08-18-28.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "office-ui-fabric-react",
-      "type": "none"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 8afd6f378caeb..6feb27e00660e 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -40,7 +40,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.7.1 <1.0.0",
+    "@uifabric/styling": ">=0.7.2 <1.0.0",
     "@uifabric/utilities": ">=4.1.2 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 71b138f970a2e..17986bb38d5b4 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.1.2 <5.0.0",
-    "@uifabric/styling": ">=0.7.1 <1.0.0",
+    "@uifabric/styling": ">=0.7.2 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index c756715a37118..ccd7cced26cbf 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.7.2",
+      "tag": "@uifabric/styling_v0.7.2",
+      "date": "Fri, 09 Jun 2017 10:10:47 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "bc7c1ebc6b552d523728c2cb9a4f4127df38a11c",
+            "comment": "Update the version of rtl-css-js used to get latest bug fixes"
+          }
+        ]
+      }
+    },
     {
       "version": "0.7.1",
       "tag": "@uifabric/styling_v0.7.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 1f68f2a20e75e..2e92533a2e2cc 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 08 Jun 2017 10:20:07 GMT and should not be manually modified.
+This log was last generated on Fri, 09 Jun 2017 10:10:47 GMT and should not be manually modified.
+
+## 0.7.2
+Fri, 09 Jun 2017 10:10:47 GMT
+
+### Patches
+
+- Update the version of rtl-css-js used to get latest bug fixes
 
 ## 0.7.1
 Thu, 08 Jun 2017 10:20:07 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index e24784e54b2a1..fad4db689ccfe 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.7.1",
+  "version": "0.7.2",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 9273411491a3c88f5a55b8b979d708d6cd8bf59c Mon Sep 17 00:00:00 2001
From: Michael Loughry <miclo@microsoft.com>
Date: Fri, 9 Jun 2017 13:52:28 -0700
Subject: [PATCH 0086/1641] Switch from using React.HTMLProps to
 React.HTMLAttributes (#1967)

* Switch from React.HTMLProps to React.HTMLAttributes

* Add rush files

* Fix build
---
 .../src/components/CodeBlock/CodeBlock.tsx            |  2 +-
 apps/todo-app/src/components/Todo.tsx                 |  4 ++--
 apps/todo-app/src/components/TodoItem.tsx             |  2 +-
 ...tch-from-props-to-attributes_2017-06-09-20-27.json | 11 +++++++++++
 ...tch-from-props-to-attributes_2017-06-09-20-27.json | 11 +++++++++++
 ...tch-from-props-to-attributes_2017-06-09-20-27.json | 11 +++++++++++
 ...tch-from-props-to-attributes_2017-06-09-20-27.json | 11 +++++++++++
 ...tch-from-props-to-attributes_2017-06-09-20-27.json | 11 +++++++++++
 .../src/components/Highlight/Highlight.tsx            |  2 +-
 .../example-component/src/ExampleComponent.Props.ts   |  2 +-
 packages/example-component/src/ExampleComponent.tsx   |  4 ++--
 .../src/common/connect.test.tsx                       |  2 +-
 .../src/components/Button/Button.Props.ts             |  2 +-
 .../src/components/Checkbox/Checkbox.Props.ts         |  4 ++--
 .../src/components/ChoiceGroup/ChoiceGroup.Props.ts   |  2 +-
 .../src/components/CommandBar/CommandBar.Props.ts     |  2 +-
 .../src/components/DetailsList/DetailsRowCheck.tsx    |  2 +-
 .../components/DocumentCard/DocumentCardPreview.tsx   |  4 ++--
 .../src/components/Fabric/Fabric.tsx                  |  2 +-
 .../src/components/Facepile/Facepile.Props.ts         |  4 ++--
 .../components/FocusTrapZone/FocusTrapZone.Props.ts   |  2 +-
 .../examples/FocusTrapZone.Box.Click.Example.tsx      |  2 +-
 .../examples/FocusTrapZone.Box.Example.tsx            |  2 +-
 ...FocusTrapZone.Box.FocusOnCustomElement.Example.tsx |  2 +-
 .../examples/FocusTrapZone.Nested.Example.tsx         |  2 +-
 .../src/components/FocusZone/FocusZone.Props.ts       |  4 ++--
 .../src/components/Icon/Icon.Props.ts                 |  2 +-
 .../src/components/Image/Image.Props.ts               |  2 +-
 .../src/components/Label/Label.Props.ts               |  2 +-
 .../src/components/Layer/Layer.Props.ts               |  2 +-
 .../src/components/Layer/LayerHost.Props.ts           |  2 +-
 .../src/components/Layer/LayerHost.tsx                |  2 +-
 .../src/components/Link/Link.Props.ts                 |  2 +-
 .../src/components/List/List.Props.ts                 |  2 +-
 .../MarqueeSelection/MarqueeSelection.Props.ts        |  2 +-
 .../src/components/MessageBar/MessageBar.Props.ts     |  2 +-
 .../src/components/MessageBar/MessageBar.tsx          |  4 ++--
 .../src/components/Overlay/Overlay.Props.ts           |  2 +-
 .../src/components/Persona/Persona.Props.ts           |  2 +-
 .../src/components/Pivot/PivotItem.Props.ts           |  2 +-
 .../src/components/Popup/Popup.Props.ts               |  2 +-
 .../src/components/Rating/Rating.Props.ts             |  2 +-
 .../src/components/ResizeGroup/ResizeGroup.Props.ts   |  2 +-
 .../src/components/Slider/Slider.Props.ts             |  2 +-
 .../src/components/TextField/TextField.Props.ts       |  2 +-
 .../src/components/TextField/TextField.tsx            |  6 +++---
 .../src/components/Toggle/Toggle.Props.ts             |  2 +-
 .../src/components/Tooltip/Tooltip.Props.ts           |  2 +-
 .../src/components/Tooltip/TooltipHost.Props.ts       |  2 +-
 .../components/pickers/AutoFill/BaseAutoFill.Props.ts |  2 +-
 .../src/components/pickers/BasePicker.Props.ts        |  2 +-
 .../PeoplePicker/examples/PeoplePickerExampleData.ts  |  2 +-
 packages/styling/src/examples/IconTile/IconTile.tsx   |  2 +-
 packages/utilities/src/properties.test.ts             |  8 ++++----
 54 files changed, 116 insertions(+), 61 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/types-switch-from-props-to-attributes_2017-06-09-20-27.json
 create mode 100644 common/changes/@uifabric/fabric-website/types-switch-from-props-to-attributes_2017-06-09-20-27.json
 create mode 100644 common/changes/@uifabric/styling/types-switch-from-props-to-attributes_2017-06-09-20-27.json
 create mode 100644 common/changes/@uifabric/utilities/types-switch-from-props-to-attributes_2017-06-09-20-27.json
 create mode 100644 common/changes/office-ui-fabric-react/types-switch-from-props-to-attributes_2017-06-09-20-27.json

diff --git a/apps/fabric-website/src/components/CodeBlock/CodeBlock.tsx b/apps/fabric-website/src/components/CodeBlock/CodeBlock.tsx
index 46a6a4f450780..869df7be29064 100644
--- a/apps/fabric-website/src/components/CodeBlock/CodeBlock.tsx
+++ b/apps/fabric-website/src/components/CodeBlock/CodeBlock.tsx
@@ -5,7 +5,7 @@ const styles: any = stylesImport;
 
 const Highlight = require('react-highlight');
 
-export interface ICodeBlockProps extends React.HTMLProps<HTMLElement> {
+export interface ICodeBlockProps extends React.HTMLAttributes<HTMLElement> {
   /**
    * The language of the code block. See https://highlightjs.org/static/demo/ for a list of supported languages.
    * @default html
diff --git a/apps/todo-app/src/components/Todo.tsx b/apps/todo-app/src/components/Todo.tsx
index af55e278f4aad..a9ee3fa419776 100644
--- a/apps/todo-app/src/components/Todo.tsx
+++ b/apps/todo-app/src/components/Todo.tsx
@@ -54,7 +54,7 @@ export default class Todo extends React.Component<ITodoProps, ITodoState> {
     );
   }
 
-  private _renderWorkingOnItSpinner(): React.ReactElement<React.HTMLProps<HTMLDivElement>> {
+  private _renderWorkingOnItSpinner(): React.ReactElement<React.HTMLAttributes<HTMLDivElement>> {
     return this.props.dataProvider.isLoading && this.state.items.length > 0
       ? <div className={ styles.workingOnItSpinner }>
         <Spinner type={ SpinnerType.normal } />
@@ -62,7 +62,7 @@ export default class Todo extends React.Component<ITodoProps, ITodoState> {
       : undefined;
   }
 
-  private _renderFetchingTasksSpinner(): React.ReactElement<React.HTMLProps<HTMLDivElement>> {
+  private _renderFetchingTasksSpinner(): React.ReactElement<React.HTMLAttributes<HTMLDivElement>> {
     return this.props.dataProvider.isLoading && this.state.items.length === 0
       ? <div className={ styles.fetchingTasksSpinner }>
         <Spinner type={ SpinnerType.large } label={ strings.fetchingTasksLabel } />
diff --git a/apps/todo-app/src/components/TodoItem.tsx b/apps/todo-app/src/components/TodoItem.tsx
index 2fa2f1565e1ef..0108328a22443 100644
--- a/apps/todo-app/src/components/TodoItem.tsx
+++ b/apps/todo-app/src/components/TodoItem.tsx
@@ -35,7 +35,7 @@ export default class TodoItem extends React.Component<ITodoItemProps, {}> {
     window.clearTimeout(this._animationTimeoutId);
   }
 
-  public render(): React.ReactElement<React.HTMLProps<HTMLDivElement>> {
+  public render(): React.ReactElement<React.HTMLAttributes<HTMLDivElement>> {
     const className: string = css(
       styles.todoItem,
       this.props.item.isComplete === true ? styles.isCompleted : '',
diff --git a/common/changes/@uifabric/example-app-base/types-switch-from-props-to-attributes_2017-06-09-20-27.json b/common/changes/@uifabric/example-app-base/types-switch-from-props-to-attributes_2017-06-09-20-27.json
new file mode 100644
index 0000000000000..6e9ba724f56cc
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/types-switch-from-props-to-attributes_2017-06-09-20-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/types-switch-from-props-to-attributes_2017-06-09-20-27.json b/common/changes/@uifabric/fabric-website/types-switch-from-props-to-attributes_2017-06-09-20-27.json
new file mode 100644
index 0000000000000..477fdb89846cb
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/types-switch-from-props-to-attributes_2017-06-09-20-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/types-switch-from-props-to-attributes_2017-06-09-20-27.json b/common/changes/@uifabric/styling/types-switch-from-props-to-attributes_2017-06-09-20-27.json
new file mode 100644
index 0000000000000..1e116b37d633c
--- /dev/null
+++ b/common/changes/@uifabric/styling/types-switch-from-props-to-attributes_2017-06-09-20-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/types-switch-from-props-to-attributes_2017-06-09-20-27.json b/common/changes/@uifabric/utilities/types-switch-from-props-to-attributes_2017-06-09-20-27.json
new file mode 100644
index 0000000000000..eccc273e30dae
--- /dev/null
+++ b/common/changes/@uifabric/utilities/types-switch-from-props-to-attributes_2017-06-09-20-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/types-switch-from-props-to-attributes_2017-06-09-20-27.json b/common/changes/office-ui-fabric-react/types-switch-from-props-to-attributes_2017-06-09-20-27.json
new file mode 100644
index 0000000000000..2fef18e362d6a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/types-switch-from-props-to-attributes_2017-06-09-20-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Component properties now extend React.HTMLAttributes, rather than React.HTMLProps",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/src/components/Highlight/Highlight.tsx b/packages/example-app-base/src/components/Highlight/Highlight.tsx
index 5c102f2c359f8..69d177046e47c 100644
--- a/packages/example-app-base/src/components/Highlight/Highlight.tsx
+++ b/packages/example-app-base/src/components/Highlight/Highlight.tsx
@@ -5,7 +5,7 @@ import { BaseComponent } from 'office-ui-fabric-react/lib/Utilities';
 
 hljs.registerLanguage('javascript', javascript);
 
-export class Highlight extends BaseComponent<React.HTMLProps<HTMLDivElement>, {}> {
+export class Highlight extends BaseComponent<React.HTMLAttributes<HTMLDivElement>, {}> {
   private _codeElement: HTMLElement;
 
   public render() {
diff --git a/packages/example-component/src/ExampleComponent.Props.ts b/packages/example-component/src/ExampleComponent.Props.ts
index c62e8435a6059..67d9cfe2d9387 100644
--- a/packages/example-component/src/ExampleComponent.Props.ts
+++ b/packages/example-component/src/ExampleComponent.Props.ts
@@ -1,7 +1,7 @@
 import { ExampleComponent } from './ExampleComponent';
 import { IRenderFunction } from '@uifabric/utilities';
 
-export interface IExampleComponentProps extends React.HTMLProps<HTMLDivElement | ExampleComponent> {
+export interface IExampleComponentProps extends React.HTMLAttributes<HTMLDivElement | ExampleComponent> {
   /**
    * Optional icon name using fabric icons.
    *
diff --git a/packages/example-component/src/ExampleComponent.tsx b/packages/example-component/src/ExampleComponent.tsx
index 9dbd859c5a1c8..3353b2ebddaa8 100644
--- a/packages/example-component/src/ExampleComponent.tsx
+++ b/packages/example-component/src/ExampleComponent.tsx
@@ -42,7 +42,7 @@ export class ExampleComponent extends BaseComponent<IExampleComponentProps, {}>
     const { className, href }: IExampleComponentProps = this.props;
 
     if (!!href) {
-      const anchorProps: React.HTMLProps<HTMLAnchorElement> =
+      const anchorProps: React.HTMLAttributes<HTMLAnchorElement> =
         getNativeProps(this.props, anchorProperties);
 
       return (
@@ -53,7 +53,7 @@ export class ExampleComponent extends BaseComponent<IExampleComponentProps, {}>
         />
       );
     } else {
-      const buttonProps: React.HTMLProps<HTMLButtonElement> =
+      const buttonProps: React.HTMLAttributes<HTMLButtonElement> =
         getNativeProps(this.props, buttonProperties);
 
       return (
diff --git a/packages/office-ui-fabric-react/src/common/connect.test.tsx b/packages/office-ui-fabric-react/src/common/connect.test.tsx
index d1ed5782cd1e6..1275e1ddd6d99 100644
--- a/packages/office-ui-fabric-react/src/common/connect.test.tsx
+++ b/packages/office-ui-fabric-react/src/common/connect.test.tsx
@@ -13,7 +13,7 @@ import { ISubscribable } from './ISubscribable';
 
 let { expect } = chai;
 
-interface ITestComponentProps extends React.HTMLProps<HTMLDivElement> { }
+interface ITestComponentProps extends React.HTMLAttributes<HTMLDivElement> { }
 
 // Dumb component.
 const TestComponent = (props: ITestComponentProps) => (
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
index 4dbbee37e0218..5fe44938302a6 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
@@ -138,7 +138,7 @@ export interface IButtonProps extends React.HTMLAttributes<HTMLButtonElement | H
    * they will be mixed into the button/anchor element rendered by the component.
    * @deprecated
    */
-  rootProps?: React.HTMLProps<HTMLButtonElement> | React.HTMLProps<HTMLAnchorElement>;
+  rootProps?: React.HTMLAttributes<HTMLButtonElement> | React.HTMLAttributes<HTMLAnchorElement>;
 
   /**
    * Deprecated on 4/15/2017, use iconProps={ { iconName: 'Emoji2' } }.
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
index 97224334d7e7e..20033e76dd2a3 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
@@ -14,7 +14,7 @@ export interface ICheckbox {
 /**
  * Checkbox properties.
  */
-export interface ICheckboxProps extends React.HTMLProps<HTMLElement | HTMLInputElement> {
+export interface ICheckboxProps extends React.HTMLAttributes<HTMLElement | HTMLInputElement> {
   /**
    * Optional callback to access the ICheckbox interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
@@ -59,5 +59,5 @@ export interface ICheckboxProps extends React.HTMLProps<HTMLElement | HTMLInputE
    * Note that if you provide, for example, "disabled" as well as "inputProps.disabled", the former will take
    * precedence over the later.
    */
-  inputProps?: React.HTMLProps<HTMLElement | HTMLInputElement>;
+  inputProps?: React.HTMLAttributes<HTMLElement | HTMLInputElement>;
 }
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts
index 7eb1810c4503d..c7ed0d8159471 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts
@@ -6,7 +6,7 @@ export interface IChoiceGroup {
 
 }
 
-export interface IChoiceGroupProps extends React.HTMLProps<HTMLElement | HTMLInputElement> {
+export interface IChoiceGroupProps extends React.HTMLAttributes<HTMLElement | HTMLInputElement> {
   /**
    * Optional callback to access the IChoiceGroup interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.Props.ts b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.Props.ts
index 94019e5aa1b9b..317dd8184b2bf 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.Props.ts
@@ -8,7 +8,7 @@ export interface ICommandBar {
   focus(): void;
 }
 
-export interface ICommandBarProps extends React.HTMLProps<HTMLDivElement> {
+export interface ICommandBarProps extends React.HTMLAttributes<HTMLDivElement> {
   /**
    * Optional callback to access the ICommandBar interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx
index 0d06c9da8afb3..fdb0032ad21c2 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx
@@ -5,7 +5,7 @@ import { css } from '../../Utilities';
 import { Check } from '../../Check';
 import * as styles from './DetailsRowCheck.scss';
 
-export interface IDetailsRowCheckProps extends React.HTMLProps<HTMLElement> {
+export interface IDetailsRowCheckProps extends React.HTMLAttributes<HTMLElement> {
   selected?: boolean;
   /**
    * Deprecated at v.65.1 and will be removed by v 1.0. Use 'selected' instead.
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx
index cc40147dc45b5..65630a08469b7 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx
@@ -40,7 +40,7 @@ export class DocumentCardPreview extends BaseComponent<IDocumentCardPreviewProps
     );
   }
 
-  private _renderPreviewImage(previewImage: IDocumentCardPreviewImage): React.ReactElement<React.HTMLProps<HTMLDivElement>> {
+  private _renderPreviewImage(previewImage: IDocumentCardPreviewImage): React.ReactElement<React.HTMLAttributes<HTMLDivElement>> {
     let { width, height, imageFit } = previewImage;
 
     let image = (
@@ -66,7 +66,7 @@ export class DocumentCardPreview extends BaseComponent<IDocumentCardPreviewProps
   }
 
   @autobind
-  private _renderPreviewList(previewImages: IDocumentCardPreviewImage[]): React.ReactElement<React.HTMLProps<HTMLDivElement>> {
+  private _renderPreviewList(previewImages: IDocumentCardPreviewImage[]): React.ReactElement<React.HTMLAttributes<HTMLDivElement>> {
     let { getOverflowDocumentCountText } = this.props;
 
     // Determine how many documents we won't be showing
diff --git a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
index 0a0b2b398b8e3..4bd15dbbd820c 100644
--- a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
+++ b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
@@ -33,7 +33,7 @@ if (typeof (document) === 'object' && document.documentElement && !document.docu
   document.documentElement.setAttribute('dir', 'ltr');
 }
 
-export class Fabric extends BaseComponent<React.HTMLProps<HTMLDivElement>, IFabricState> {
+export class Fabric extends BaseComponent<React.HTMLAttributes<HTMLDivElement>, IFabricState> {
   public refs: {
     [key: string]: React.ReactInstance;
     root: HTMLElement;
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.Props.ts b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.Props.ts
index 351d033bbdd3a..26d6bf2c3ffaf 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.Props.ts
@@ -53,14 +53,14 @@ export interface IFacepileProps extends React.Props<Facepile> {
 
   /** Method to access properties on the underlying Persona control */
   getPersonaProps?: (persona: IFacepilePersona) => IPersonaProps;
-  
+
   /**
    * Optional class for Facepile root element.
    */
   className?: string;
 }
 
-export interface IFacepilePersona extends React.HTMLProps<HTMLButtonElement | HTMLDivElement> {
+export interface IFacepilePersona extends React.HTMLAttributes<HTMLButtonElement | HTMLDivElement> {
   /**
    * Name of the person.
    */
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.Props.ts b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.Props.ts
index 14905c8b238c5..1244ec61ae6e1 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.Props.ts
@@ -7,7 +7,7 @@ export interface IFocusTrapZone {
   focus: () => void;
 }
 
-export interface IFocusTrapZoneProps extends React.HTMLProps<HTMLDivElement> {
+export interface IFocusTrapZoneProps extends React.HTMLAttributes<HTMLDivElement> {
   /**
    * Optional callback to access the IFocusTrapZone interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
index 08ee38f5201f6..2ed81f1d67da1 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
@@ -14,7 +14,7 @@ export interface IBoxNoClickExampleExampleState {
   isToggled: boolean;
 }
 
-export default class BoxNoClickExample extends React.Component<React.HTMLProps<HTMLDivElement>, IBoxNoClickExampleExampleState> {
+export default class BoxNoClickExample extends React.Component<React.HTMLAttributes<HTMLDivElement>, IBoxNoClickExampleExampleState> {
   private _toggle: IToggle;
 
   constructor(props) {
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
index 7350d5c3154c0..67eebef037b29 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
@@ -14,7 +14,7 @@ export interface IBoxExampleExampleState {
   isChecked: boolean;
 }
 
-export default class BoxExample extends React.Component<React.HTMLProps<HTMLDivElement>, IBoxExampleExampleState> {
+export default class BoxExample extends React.Component<React.HTMLAttributes<HTMLDivElement>, IBoxExampleExampleState> {
   private _toggle: IToggle;
 
   constructor(props) {
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
index e65a3aa307c1f..0cabce5b0b161 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
@@ -13,7 +13,7 @@ export interface IBoxExampleExampleState {
   isChecked: boolean;
 }
 
-export default class BoxExample extends React.Component<React.HTMLProps<HTMLDivElement>, IBoxExampleExampleState> {
+export default class BoxExample extends React.Component<React.HTMLAttributes<HTMLDivElement>, IBoxExampleExampleState> {
   private _toggle: IToggle;
 
   constructor(props) {
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx
index 28b88bcaaaa1e..94fbc1a7e8e83 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx
@@ -75,7 +75,7 @@ export interface IFocusTrapZoneNestedExampleState {
 
 const NAMES: string[] = ['One', 'Two', 'Three', 'Four', 'Five'];
 
-export default class FocusTrapZoneNestedExample extends React.Component<React.HTMLProps<HTMLDivElement>, IFocusTrapZoneNestedExampleState> {
+export default class FocusTrapZoneNestedExample extends React.Component<React.HTMLAttributes<HTMLDivElement>, IFocusTrapZoneNestedExampleState> {
 
   constructor() {
     super();
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.Props.ts b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.Props.ts
index fc26078a3ed11..aee62c1a0a134 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.Props.ts
@@ -24,7 +24,7 @@ export interface IFocusZone {
 /**
  * FocusZone component props.
  */
-export interface IFocusZoneProps extends React.HTMLProps<HTMLElement | FocusZone> {
+export interface IFocusZoneProps extends React.HTMLAttributes<HTMLElement | FocusZone> {
   /**
    * Optional callback to access the IFocusZone interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
@@ -86,7 +86,7 @@ export interface IFocusZoneProps extends React.HTMLProps<HTMLElement | FocusZone
    * Deprecated at v1.12.1. DIV props provided to the FocusZone will be mixed into the root element.
    * @deprecated
    */
-  rootProps?: React.HTMLProps<HTMLDivElement>;
+  rootProps?: React.HTMLAttributes<HTMLDivElement>;
 
   /**
    * Callback method for determining if focus should indeed be set on the given element.
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts b/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
index 3a5be57cc9844..91c093a1bc997 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
@@ -34,7 +34,7 @@ export interface IIconStyles {
   imageContainer?: IStyle;
 }
 
-export interface IIconProps extends React.HTMLProps<HTMLElement> {
+export interface IIconProps extends React.HTMLAttributes<HTMLElement> {
   /**
    * The name of the icon to use from the icon font.
    *
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.Props.ts b/packages/office-ui-fabric-react/src/components/Image/Image.Props.ts
index ac6a3391a5516..1e8b7bd8b4ef9 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.Props.ts
@@ -4,7 +4,7 @@ export interface IImage {
 
 }
 
-export interface IImageProps extends React.HTMLProps<HTMLImageElement> {
+export interface IImageProps extends React.HTMLAttributes<HTMLImageElement> {
   /**
    * Optional callback to access the ICheckbox interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.Props.ts b/packages/office-ui-fabric-react/src/components/Label/Label.Props.ts
index 71c733f8d479f..ab2e569623fe9 100644
--- a/packages/office-ui-fabric-react/src/components/Label/Label.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Label/Label.Props.ts
@@ -6,7 +6,7 @@ export interface ILabel {
 
 }
 
-export interface ILabelProps extends React.HTMLProps<HTMLLabelElement> {
+export interface ILabelProps extends React.HTMLAttributes<HTMLLabelElement> {
   /**
    * Optional callback to access the ILabel interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.Props.ts b/packages/office-ui-fabric-react/src/components/Layer/Layer.Props.ts
index 3671781df3343..fb6f36842cef0 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/Layer.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.Props.ts
@@ -5,7 +5,7 @@ export interface ILayer {
 
 }
 
-export interface ILayerProps extends React.HTMLProps<HTMLDivElement | Layer> {
+export interface ILayerProps extends React.HTMLAttributes<HTMLDivElement | Layer> {
   /**
    * Optional callback to access the ILayer interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/Layer/LayerHost.Props.ts b/packages/office-ui-fabric-react/src/components/Layer/LayerHost.Props.ts
index fa539655ff7fc..9f1f2b74ac945 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/LayerHost.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Layer/LayerHost.Props.ts
@@ -4,7 +4,7 @@ export interface ILayerHost {
 
 }
 
-export interface ILayerHostProps extends React.HTMLProps<HTMLElement> {
+export interface ILayerHostProps extends React.HTMLAttributes<HTMLElement> {
   /**
    * Optional callback to access the ILayerHost interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/Layer/LayerHost.tsx b/packages/office-ui-fabric-react/src/components/Layer/LayerHost.tsx
index bef9098341ca5..fee19b2a81252 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/LayerHost.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/LayerHost.tsx
@@ -7,7 +7,7 @@ import {
   Layer
 } from './Layer';
 
-export class LayerHost extends BaseComponent<React.HTMLProps<HTMLElement>, {}> {
+export class LayerHost extends BaseComponent<React.HTMLAttributes<HTMLElement>, {}> {
 
   public shouldComponentUpdate() {
     return false;
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.Props.ts b/packages/office-ui-fabric-react/src/components/Link/Link.Props.ts
index 2ee4575f68676..5493d4f483568 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.Props.ts
@@ -8,7 +8,7 @@ export interface ILink {
   focus(): void;
 }
 
-export interface ILinkProps extends React.HTMLProps<HTMLAnchorElement | HTMLButtonElement | HTMLElement | Link> {
+export interface ILinkProps extends React.HTMLAttributes<HTMLAnchorElement | HTMLButtonElement | HTMLElement | Link> {
   /**
    * Optional callback to access the ILink interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/List/List.Props.ts b/packages/office-ui-fabric-react/src/components/List/List.Props.ts
index 4cbf90d5bfb9c..2fba651a9cf9b 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/List/List.Props.ts
@@ -16,7 +16,7 @@ export interface IList {
   scrollToIndex(index: number, measureItem?: (itemIndex: number) => number): void;
 }
 
-export interface IListProps extends React.HTMLProps<List | HTMLDivElement> {
+export interface IListProps extends React.HTMLAttributes<List | HTMLDivElement> {
   /**
    * Optional callback to access the IList interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.Props.ts b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.Props.ts
index 91f8ec729dbab..858ca0aeaecec 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.Props.ts
@@ -21,7 +21,7 @@ export interface IMarqueeSelectionProps extends React.Props<MarqueeSelection> {
   /**
    * Optional props to mix into the root DIV element.
    */
-  rootProps?: React.HTMLProps<HTMLDivElement>;
+  rootProps?: React.HTMLAttributes<HTMLDivElement>;
 
   /**
    * Optional callback that is called, when the mouse down event occurs, in order to determine
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.Props.ts b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.Props.ts
index de75e9e5815f7..a80c29a0fe59e 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.Props.ts
@@ -4,7 +4,7 @@ export interface IMessageBar {
 
 }
 
-export interface IMessageBarProps extends React.HTMLProps<HTMLElement> {
+export interface IMessageBarProps extends React.HTMLAttributes<HTMLElement> {
   /**
    * Optional callback to access the IMessageBar interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
index 41690ab2bac90..dfa4b341cad86 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
@@ -111,7 +111,7 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
       'ms-MessageBar-innerTextPadding ' + styles.innerTextPadding : 'ms-MessageBar-innerText ' + styles.innerText;
   }
 
-  private _renderMultiLine(): React.ReactElement<React.HTMLProps<HTMLAreaElement>> {
+  private _renderMultiLine(): React.ReactElement<React.HTMLAttributes<HTMLAreaElement>> {
     return (
       <div
         className={
@@ -134,7 +134,7 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
     );
   }
 
-  private _renderSingleLine(): React.ReactElement<React.HTMLProps<HTMLAreaElement>> {
+  private _renderSingleLine(): React.ReactElement<React.HTMLAttributes<HTMLAreaElement>> {
     return (
       <div className={
         css(this._getClassName(),
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.Props.ts b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.Props.ts
index 3796783c3aba0..f93363283a0dd 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.Props.ts
@@ -4,7 +4,7 @@ export interface IOverlay {
 
 }
 
-export interface IOverlayProps extends React.HTMLProps<HTMLElement> {
+export interface IOverlayProps extends React.HTMLAttributes<HTMLElement> {
   /**
    * Optional callback to access the IOverlay interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts b/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
index 3938c40b3af53..5bacf9f2ff04e 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
@@ -6,7 +6,7 @@ export interface IPersona {
 
 }
 
-export interface IPersonaProps extends React.HTMLProps<Persona> {
+export interface IPersonaProps extends React.HTMLAttributes<Persona> {
   /**
    * Optional callback to access the IPersona interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/PivotItem.Props.ts b/packages/office-ui-fabric-react/src/components/Pivot/PivotItem.Props.ts
index 9b9328f8c213f..d6af8306cbe72 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/PivotItem.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Pivot/PivotItem.Props.ts
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { IRenderFunction } from '../../Utilities';
 
-export interface IPivotItemProps extends React.HTMLProps<HTMLDivElement> {
+export interface IPivotItemProps extends React.HTMLAttributes<HTMLDivElement> {
   /**
    * The text displayed of each pivot link.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Popup/Popup.Props.ts b/packages/office-ui-fabric-react/src/components/Popup/Popup.Props.ts
index 816795bbd2c43..03a92f97f4ece 100644
--- a/packages/office-ui-fabric-react/src/components/Popup/Popup.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Popup/Popup.Props.ts
@@ -7,7 +7,7 @@ export interface IPopup {
 
 }
 
-export interface IPopupProps extends React.HTMLProps<Popup> {
+export interface IPopupProps extends React.HTMLAttributes<Popup> {
   /**
    * Optional callback to access the IPopup interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.Props.ts b/packages/office-ui-fabric-react/src/components/Rating/Rating.Props.ts
index 907183eeceb8a..65839082209b4 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.Props.ts
@@ -7,7 +7,7 @@ export interface IRating {
 /**
  * Rating component props.
  */
-export interface IRatingProps extends React.HTMLProps<HTMLElement> {
+export interface IRatingProps extends React.HTMLAttributes<HTMLElement> {
   /**
    * Optional callback to access the IRating interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts
index 24d1738dde2a7..0431ec2cb4a0c 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts
@@ -5,7 +5,7 @@ export interface IResizeGroup {
 
 }
 
-export interface IResizeGroupProps extends React.HTMLProps<ResizeGroup | HTMLElement> {
+export interface IResizeGroupProps extends React.HTMLAttributes<ResizeGroup | HTMLElement> {
 
   /**
    * Optional callback to access the IResizeGroup interface. Use this instead of ref for accessing
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.Props.ts b/packages/office-ui-fabric-react/src/components/Slider/Slider.Props.ts
index 6b284d4073c25..9ef3df689a999 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.Props.ts
@@ -77,5 +77,5 @@ export interface ISliderProps {
   /**
    * Optional mixin for additional props on the thumb button within the slider.
    */
-  buttonProps?: React.HTMLProps<HTMLButtonElement>;
+  buttonProps?: React.HTMLAttributes<HTMLButtonElement>;
 }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts b/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts
index e55f80b4ab2f8..c2bd028ff60a7 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts
@@ -29,7 +29,7 @@ export interface ITextField {
 /**
  * TextField component props.
  */
-export interface ITextFieldProps extends React.HTMLProps<HTMLInputElement | HTMLTextAreaElement> {
+export interface ITextFieldProps extends React.HTMLAttributes<HTMLInputElement | HTMLTextAreaElement> {
   /**
    * Optional callback to access the ITextField interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index b7f419fb619c8..27e54c5afcea0 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -285,7 +285,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
     return errorMessage;
   }
 
-  private _renderTextArea(): React.ReactElement<React.HTMLProps<HTMLAreaElement>> {
+  private _renderTextArea(): React.ReactElement<React.HTMLAttributes<HTMLAreaElement>> {
     let textAreaProps = getNativeProps(this.props, textAreaProperties, ['defaultValue']);
 
     return (
@@ -306,8 +306,8 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
     );
   }
 
-  private _renderInput(): React.ReactElement<React.HTMLProps<HTMLInputElement>> {
-    let inputProps = getNativeProps<React.HTMLProps<HTMLInputElement>>(this.props, inputProperties, ['defaultValue']);
+  private _renderInput(): React.ReactElement<React.HTMLAttributes<HTMLInputElement>> {
+    let inputProps = getNativeProps<React.HTMLAttributes<HTMLInputElement>>(this.props, inputProperties, ['defaultValue']);
 
     return (
       <input
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.Props.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.Props.ts
index 39b3483ff5523..41a3d7fe3745e 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.Props.ts
@@ -9,7 +9,7 @@ export interface IToggle {
 /**
  * Toggle component props.
  */
-export interface IToggleProps extends React.HTMLProps<HTMLElement | Toggle> {
+export interface IToggleProps extends React.HTMLAttributes<HTMLElement | Toggle> {
   /**
    * Optional callback to access the IToggle interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.Props.ts b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.Props.ts
index 4d0f7054036a4..97d95ce2f9390 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.Props.ts
@@ -11,7 +11,7 @@ export interface ITooltip {
 /**
  * Tooltip component props.
  */
-export interface ITooltipProps extends React.HTMLProps<HTMLDivElement | Tooltip> {
+export interface ITooltipProps extends React.HTMLAttributes<HTMLDivElement | Tooltip> {
   /**
    * Optional callback to access the ITooltip interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.Props.ts b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.Props.ts
index d709b9f428c28..d82e435f430b3 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.Props.ts
@@ -19,7 +19,7 @@ export enum TooltipOverflowMode {
 /**
  * Tooltip component props.
  */
-export interface ITooltipHostProps extends React.HTMLProps<HTMLDivElement | TooltipHost> {
+export interface ITooltipHostProps extends React.HTMLAttributes<HTMLDivElement | TooltipHost> {
   /**
    * Optional callback to access the ITooltipHost interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts
index 09f8613191931..ace79d62535cd 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts
@@ -40,7 +40,7 @@ export interface IBaseAutoFill {
   clear(): void;
 }
 
-export interface IBaseAutoFillProps extends React.HTMLProps<HTMLInputElement | BaseAutoFill> {
+export interface IBaseAutoFillProps extends React.HTMLAttributes<HTMLInputElement | BaseAutoFill> {
   /**
    * The suggested autofill value that will display.
    */
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
index f95ac98cebeb1..693088670e7ea 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
@@ -52,7 +52,7 @@ export interface IBasePickerProps<T> extends React.Props<any> {
    * AutoFill input native props
    * @default undefined
    */
-  inputProps?: React.HTMLProps<HTMLInputElement>;
+  inputProps?: React.HTMLAttributes<HTMLInputElement>;
   /**
    * A callback for when a persona is removed from the suggestion list
    */
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePickerExampleData.ts b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePickerExampleData.ts
index 53a9478cd7404..871751efc82b3 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePickerExampleData.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePickerExampleData.ts
@@ -1,7 +1,7 @@
 import { IPersonaProps, PersonaPresence } from 'office-ui-fabric-react/lib/Persona';
 import { TestImages } from '../../../../common/TestImages';
 
-export const people: IPersonaProps[] = [
+export const people: (IPersonaProps & { key: string | number })[] = [
   {
     key: 0,
 
diff --git a/packages/styling/src/examples/IconTile/IconTile.tsx b/packages/styling/src/examples/IconTile/IconTile.tsx
index c1f67a3ee8a39..221dd8d4ef4f3 100644
--- a/packages/styling/src/examples/IconTile/IconTile.tsx
+++ b/packages/styling/src/examples/IconTile/IconTile.tsx
@@ -3,7 +3,7 @@ import { SearchBox } from 'office-ui-fabric-react/lib/SearchBox';
 import { IconClassNames } from '@uifabric/styling';
 import { IIconTileStyles, getStyles } from './IconTile.styles';
 
-export interface IIconTileProps extends React.HTMLProps<HTMLDivElement> {
+export interface IIconTileProps extends React.HTMLAttributes<HTMLDivElement> {
   iconName: string;
 }
 
diff --git a/packages/utilities/src/properties.test.ts b/packages/utilities/src/properties.test.ts
index 01a622cefee96..d3aa465be5b5b 100644
--- a/packages/utilities/src/properties.test.ts
+++ b/packages/utilities/src/properties.test.ts
@@ -8,21 +8,21 @@ let { expect } = chai;
 describe('getNativeProps', () => {
 
   it('can pass through data tags', () => {
-    let result = getNativeProps<React.HTMLProps<HTMLDivElement>>({
+    let result = getNativeProps<React.HTMLAttributes<HTMLDivElement>>({
       'data-automation-id': 1
     }, divProperties);
     expect(result['data-automation-id']).equals(1);
   });
 
   it('can pass through aria tags', () => {
-    let result = getNativeProps<React.HTMLProps<HTMLDivElement>>({
+    let result = getNativeProps<React.HTMLAttributes<HTMLDivElement>>({
       'aria-label': 1
     }, divProperties);
     expect(result['aria-label']).equals(1);
   });
 
   it('can pass through basic div properties and events', () => {
-    let result = getNativeProps<React.HTMLProps<HTMLDivElement>>({
+    let result = getNativeProps<React.HTMLAttributes<HTMLDivElement>>({
       className: 'foo',
       onClick: () => { /* no-op */ },
       onClickCapture: () => { /* no-op */ }
@@ -33,7 +33,7 @@ describe('getNativeProps', () => {
   });
 
   it('can remove unexpected properties', () => {
-    let result = getNativeProps<React.HTMLProps<HTMLDivElement>>({
+    let result = getNativeProps<React.HTMLAttributes<HTMLDivElement>>({
       'foobar': 1,
       className: 'hi'
     }, divProperties);

From b2026ec598638fc1a6f179326cdaca230b699882 Mon Sep 17 00:00:00 2001
From: Michael Loughry <miclo@microsoft.com>
Date: Fri, 9 Jun 2017 14:30:43 -0700
Subject: [PATCH 0087/1641] Toggle: add 'cursor: pointer' (#1969)

* Add 'cursor: pointer' to Toggle

* Add change files
---
 .../toggle-cursor-pointer_2017-06-09-21-07.json       | 11 +++++++++++
 .../toggle-cursor-pointer_2017-06-09-21-07.json       | 11 +++++++++++
 .../toggle-cursor-pointer_2017-06-09-21-07.json       | 11 +++++++++++
 .../toggle-cursor-pointer_2017-06-09-21-07.json       | 11 +++++++++++
 .../toggle-cursor-pointer_2017-06-09-21-07.json       | 11 +++++++++++
 .../src/components/Toggle/Toggle.styles.ts            |  1 +
 6 files changed, 56 insertions(+)
 create mode 100644 common/changes/@uifabric/example-app-base/toggle-cursor-pointer_2017-06-09-21-07.json
 create mode 100644 common/changes/@uifabric/fabric-website/toggle-cursor-pointer_2017-06-09-21-07.json
 create mode 100644 common/changes/@uifabric/styling/toggle-cursor-pointer_2017-06-09-21-07.json
 create mode 100644 common/changes/@uifabric/utilities/toggle-cursor-pointer_2017-06-09-21-07.json
 create mode 100644 common/changes/office-ui-fabric-react/toggle-cursor-pointer_2017-06-09-21-07.json

diff --git a/common/changes/@uifabric/example-app-base/toggle-cursor-pointer_2017-06-09-21-07.json b/common/changes/@uifabric/example-app-base/toggle-cursor-pointer_2017-06-09-21-07.json
new file mode 100644
index 0000000000000..6e9ba724f56cc
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/toggle-cursor-pointer_2017-06-09-21-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/toggle-cursor-pointer_2017-06-09-21-07.json b/common/changes/@uifabric/fabric-website/toggle-cursor-pointer_2017-06-09-21-07.json
new file mode 100644
index 0000000000000..477fdb89846cb
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/toggle-cursor-pointer_2017-06-09-21-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/toggle-cursor-pointer_2017-06-09-21-07.json b/common/changes/@uifabric/styling/toggle-cursor-pointer_2017-06-09-21-07.json
new file mode 100644
index 0000000000000..1e116b37d633c
--- /dev/null
+++ b/common/changes/@uifabric/styling/toggle-cursor-pointer_2017-06-09-21-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/toggle-cursor-pointer_2017-06-09-21-07.json b/common/changes/@uifabric/utilities/toggle-cursor-pointer_2017-06-09-21-07.json
new file mode 100644
index 0000000000000..eccc273e30dae
--- /dev/null
+++ b/common/changes/@uifabric/utilities/toggle-cursor-pointer_2017-06-09-21-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/toggle-cursor-pointer_2017-06-09-21-07.json b/common/changes/office-ui-fabric-react/toggle-cursor-pointer_2017-06-09-21-07.json
new file mode 100644
index 0000000000000..091bc2cd6b101
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/toggle-cursor-pointer_2017-06-09-21-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Toggle: add 'cursor: pointer'",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts
index 368a57431e591..1e02842b46773 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts
@@ -51,6 +51,7 @@ export const getStyles = memoizeFunction((
         borderStyle: 'solid',
         background: pillUncheckedBackground,
         borderColor: pillBorderColor,
+        cursor: 'pointer',
       }
     ],
 

From de7c49d2bd5e85af8d7ae0aee97eb9afd297966d Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Sun, 11 Jun 2017 10:51:36 -0700
Subject: [PATCH 0088/1641] Enable no implicit any in the utilities package
 (#1970)

* Fix no implicit anys in utilities package.

* Rush change

* Reverse all shrinkwrap changes except the typings one.
---
 .../strict-typescript_2017-06-10-01-29.json   | 11 ++++++++
 .../strict-typescript_2017-06-10-01-29.json   | 11 ++++++++
 .../strict-typescript_2017-06-10-01-29.json   | 11 ++++++++
 .../strict-typescript_2017-06-10-01-29.json   | 11 ++++++++
 .../strict-typescript_2017-06-10-01-29.json   | 11 ++++++++
 common/config/rush/npm-shrinkwrap.json        |  5 ++++
 packages/utilities/api/utilities.api.ts       |  9 ++++---
 packages/utilities/package.json               |  1 +
 packages/utilities/src/Async.ts               | 20 +++++++-------
 packages/utilities/src/BaseComponent.test.tsx |  4 +--
 packages/utilities/src/BaseComponent.ts       |  8 +++---
 packages/utilities/src/Customizer.tsx         |  4 +--
 packages/utilities/src/DelayedRender.tsx      |  2 +-
 packages/utilities/src/EventGroup.ts          |  8 +++---
 packages/utilities/src/autobind.ts            |  2 +-
 packages/utilities/src/css.ts                 |  2 +-
 packages/utilities/src/customizable.test.tsx  |  2 +-
 packages/utilities/src/customizable.tsx       |  2 +-
 packages/utilities/src/dom.ts                 |  2 +-
 packages/utilities/src/focus.test.tsx         |  6 ++---
 packages/utilities/src/hoist.ts               |  2 +-
 packages/utilities/src/memoize.test.ts        |  6 ++---
 packages/utilities/src/memoize.ts             |  4 +--
 packages/utilities/src/object.ts              |  8 +++---
 packages/utilities/src/properties.test.ts     | 11 ++++----
 packages/utilities/src/resources.ts           |  4 +--
 packages/utilities/src/string.ts              | 26 +++++++++----------
 .../utilities/src/test/injectWrapperMethod.ts |  4 +--
 packages/utilities/tsconfig.json              |  1 +
 29 files changed, 132 insertions(+), 66 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/strict-typescript_2017-06-10-01-29.json
 create mode 100644 common/changes/@uifabric/fabric-website/strict-typescript_2017-06-10-01-29.json
 create mode 100644 common/changes/@uifabric/styling/strict-typescript_2017-06-10-01-29.json
 create mode 100644 common/changes/@uifabric/utilities/strict-typescript_2017-06-10-01-29.json
 create mode 100644 common/changes/office-ui-fabric-react/strict-typescript_2017-06-10-01-29.json

diff --git a/common/changes/@uifabric/example-app-base/strict-typescript_2017-06-10-01-29.json b/common/changes/@uifabric/example-app-base/strict-typescript_2017-06-10-01-29.json
new file mode 100644
index 0000000000000..6336d0ba5a779
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/strict-typescript_2017-06-10-01-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Enable no implicit any in utilities package",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/strict-typescript_2017-06-10-01-29.json b/common/changes/@uifabric/fabric-website/strict-typescript_2017-06-10-01-29.json
new file mode 100644
index 0000000000000..3f948499b4b8f
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/strict-typescript_2017-06-10-01-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Enable no implicit any in utilities package",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/strict-typescript_2017-06-10-01-29.json b/common/changes/@uifabric/styling/strict-typescript_2017-06-10-01-29.json
new file mode 100644
index 0000000000000..4810bcc145412
--- /dev/null
+++ b/common/changes/@uifabric/styling/strict-typescript_2017-06-10-01-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Enable no implicit any in utilities package",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/strict-typescript_2017-06-10-01-29.json b/common/changes/@uifabric/utilities/strict-typescript_2017-06-10-01-29.json
new file mode 100644
index 0000000000000..a66076080ab1e
--- /dev/null
+++ b/common/changes/@uifabric/utilities/strict-typescript_2017-06-10-01-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Enable no implicit any in utilities package",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/strict-typescript_2017-06-10-01-29.json b/common/changes/office-ui-fabric-react/strict-typescript_2017-06-10-01-29.json
new file mode 100644
index 0000000000000..d1c1e8b159f19
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/strict-typescript_2017-06-10-01-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Enable no implicit any in utilities package",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 78f0e535d0514..bf17555b905bf 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -1415,6 +1415,11 @@
       "resolved": "https://registry.npmjs.org/@types/es6-promise/-/es6-promise-0.0.32.tgz",
       "integrity": "sha1-O89E+x5Cnz33YYjIxth0Rjujcf0="
     },
+    "@types/es6-weak-map": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/@types/es6-weak-map/-/es6-weak-map-1.2.0.tgz",
+      "integrity": "sha1-2fb4WDaaiLvGnvQCOAgfLWu8hhQ="
+    },
     "@types/express": {
       "version": "4.0.35",
       "resolved": "https://registry.npmjs.org/@types/express/-/express-4.0.35.tgz",
diff --git a/packages/utilities/api/utilities.api.ts b/packages/utilities/api/utilities.api.ts
index 7780172e49b96..9565f97f7ff08 100644
--- a/packages/utilities/api/utilities.api.ts
+++ b/packages/utilities/api/utilities.api.ts
@@ -1,3 +1,5 @@
+export function assign(target: any, ...args: any[]): any;
+
 // WARNING: dispose has incomplete type information
 // WARNING: clearImmediate has incomplete type information
 // WARNING: clearInterval has incomplete type information
@@ -50,10 +52,11 @@ class BaseComponent<P extends IBaseProps, S> extends React.Component<P, S> {
 
 // WARNING: contextTypes has incomplete type information
 // WARNING: childContextTypes has incomplete type information
-// WARNING: __constructor has incomplete type information
 // WARNING: componentWillReceiveProps has incomplete type information
 // WARNING: render has incomplete type information
 class Customizer extends BaseComponent<ICustomizerProps, ICustomizerState> {
+  // (undocumented)
+  constructor(props: any, context: any);
   public static addChangeListener(onChanged: IChangeListener): void;
   // (undocumented)
   public getChildContext(): any;
@@ -150,6 +153,8 @@ export function hasOverflow(element: HTMLElement): boolean;
 
 export function hasVerticalOverflow(element: HTMLElement): boolean;
 
+export function hoistMethods(destination: any, source: any, exclusions: string[] = REACT_LIFECYCLE_EXCLUSIONS): string[];
+
 // (undocumented)
 interface IBaseProps {
   // (undocumented)
@@ -374,10 +379,8 @@ export function warnMutuallyExclusive < P >(componentName: string,
 // WARNING: getWindow has incomplete type information
 // WARNING: getDocument has incomplete type information
 // WARNING: doesElementContainFocus has incomplete type information
-// WARNING: hoistMethods has incomplete type information
 // WARNING: setLanguage has incomplete type information
 // WARNING: shallowCompare has incomplete type information
-// WARNING: assign has incomplete type information
 // WARNING: filteredAssign has incomplete type information
 // WARNING: Unsupported export: baseElementEvents
 // WARNING: Unsupported export: baseElementProperties
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index aa1ff5d323cbc..c879c12efc2af 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -20,6 +20,7 @@
     "@types/chai": "^3.4.35",
     "@types/enzyme": "^2.7.5",
     "@types/es6-promise": "^0.0.32",
+    "@types/es6-weak-map": "1.2.0",
     "@types/mocha": "^2.2.39",
     "@types/prop-types": "^15.5.1",
     "@types/react": "^15.0.25",
diff --git a/packages/utilities/src/Async.ts b/packages/utilities/src/Async.ts
index 16701ed41a85a..d9d065a181a9b 100644
--- a/packages/utilities/src/Async.ts
+++ b/packages/utilities/src/Async.ts
@@ -10,9 +10,9 @@ declare function setTimeout(cb: Function, delay: number): number;
 declare function setInterval(cb: Function, delay: number): number;
 
 export class Async {
-  private _timeoutIds = null;
-  private _immediateIds = null;
-  private _intervalIds = null;
+  private _timeoutIds: any = null;
+  private _immediateIds: any = null;
+  private _intervalIds: any = null;
   private _animationFrameIds: { [id: number]: boolean } = null;
   private _isDisposed = false;
   private _parent: any;
@@ -38,7 +38,7 @@ export class Async {
     if (this._timeoutIds) {
       for (id in this._timeoutIds) {
         if (this._timeoutIds.hasOwnProperty(id)) {
-          this.clearTimeout(id);
+          this.clearTimeout(parseInt(id, 10));
         }
       }
 
@@ -49,7 +49,7 @@ export class Async {
     if (this._immediateIds) {
       for (id in this._immediateIds) {
         if (this._immediateIds.hasOwnProperty(id)) {
-          this.clearImmediate(id);
+          this.clearImmediate(parseInt(id, 10));
         }
       }
 
@@ -60,7 +60,7 @@ export class Async {
     if (this._intervalIds) {
       for (id in this._intervalIds) {
         if (this._intervalIds.hasOwnProperty(id)) {
-          this.clearInterval(id);
+          this.clearInterval(parseInt(id, 10));
         }
       }
       this._intervalIds = null;
@@ -70,7 +70,7 @@ export class Async {
     if (this._animationFrameIds) {
       for (id in this._animationFrameIds) {
         if (this._animationFrameIds.hasOwnProperty(id)) {
-          this.cancelAnimationFrame(id);
+          this.cancelAnimationFrame(parseInt(id, 10));
         }
       }
 
@@ -254,7 +254,7 @@ export class Async {
     let leading = true;
     let trailing = true;
     let lastExecuteTime = 0;
-    let lastResult;
+    let lastResult: any;
     let lastArgs: any[];
     let timeoutId: number = null;
 
@@ -320,10 +320,10 @@ export class Async {
     let waitMS = wait || 0;
     let leading = false;
     let trailing = true;
-    let maxWait = null;
+    let maxWait: any = null;
     let lastCallTime = 0;
     let lastExecuteTime = (new Date).getTime();
-    let lastResult;
+    let lastResult: any;
     let lastArgs: any[];
     let timeoutId: number = null;
 
diff --git a/packages/utilities/src/BaseComponent.test.tsx b/packages/utilities/src/BaseComponent.test.tsx
index a2f13026430c2..3301e49b86e00 100644
--- a/packages/utilities/src/BaseComponent.test.tsx
+++ b/packages/utilities/src/BaseComponent.test.tsx
@@ -85,7 +85,7 @@ describe('BaseComponent', () => {
   });
 });
 
-function _buildTestFor(methodName) {
+function _buildTestFor(methodName: string) {
   it(`calls the error logger on ${methodName} exception`, () => {
     let lastErrorMessage = null;
 
@@ -93,7 +93,7 @@ function _buildTestFor(methodName) {
 
     let c = new TestComponent();
 
-    c[methodName]();
+    (c as any)[methodName]();
 
     assert(lastErrorMessage !== null, 'Error callback not called');
   });
diff --git a/packages/utilities/src/BaseComponent.ts b/packages/utilities/src/BaseComponent.ts
index f9a70fdd0f64f..6054348f953ee 100644
--- a/packages/utilities/src/BaseComponent.ts
+++ b/packages/utilities/src/BaseComponent.ts
@@ -146,7 +146,7 @@ export class BaseComponent<P extends IBaseProps, S> extends React.Component<P, S
     }
     if (!this.__resolves[refName]) {
       this.__resolves[refName] = (ref) => {
-        return this[refName] = ref;
+        return (this as any)[refName] = ref;
       };
     }
 
@@ -202,11 +202,11 @@ function _makeAllSafe(obj: BaseComponent<any, any>, prototype: Object, methodNam
 }
 
 function _makeSafe(obj: BaseComponent<any, any>, prototype: Object, methodName: string) {
-  let classMethod = obj[methodName];
-  let prototypeMethod = prototype[methodName];
+  let classMethod = (obj as any)[methodName];
+  let prototypeMethod = (prototype as any)[methodName];
 
   if (classMethod || prototypeMethod) {
-    obj[methodName] = function () {
+    (obj as any)[methodName] = function () {
       let retVal;
 
       try {
diff --git a/packages/utilities/src/Customizer.tsx b/packages/utilities/src/Customizer.tsx
index d7b576f3bb161..e778b3feaa845 100644
--- a/packages/utilities/src/Customizer.tsx
+++ b/packages/utilities/src/Customizer.tsx
@@ -77,7 +77,7 @@ export class Customizer extends BaseComponent<ICustomizerProps, ICustomizerState
     }
   }
 
-  constructor(props, context) {
+  constructor(props: any, context: any) {
     super(props);
 
     this.state = this._getInjectedProps(props, context);
@@ -87,7 +87,7 @@ export class Customizer extends BaseComponent<ICustomizerProps, ICustomizerState
     return this.state;
   }
 
-  public componentWillReceiveProps(newProps, newContext) {
+  public componentWillReceiveProps(newProps: any, newContext: any) {
     this.setState(this._getInjectedProps(newProps, newContext));
   }
 
diff --git a/packages/utilities/src/DelayedRender.tsx b/packages/utilities/src/DelayedRender.tsx
index 3405a57bcf613..f586fb172c047 100644
--- a/packages/utilities/src/DelayedRender.tsx
+++ b/packages/utilities/src/DelayedRender.tsx
@@ -24,7 +24,7 @@ export class DelayedRender extends React.Component<IDelayedRenderProps, IDelayed
     delay: 0
   };
 
-  private _timeoutId;
+  private _timeoutId: number | undefined;
 
   constructor(props: IDelayedRenderProps) {
     super(props);
diff --git a/packages/utilities/src/EventGroup.ts b/packages/utilities/src/EventGroup.ts
index b0d609fb81966..d24127b8d7e5a 100644
--- a/packages/utilities/src/EventGroup.ts
+++ b/packages/utilities/src/EventGroup.ts
@@ -33,7 +33,7 @@ export interface IDeclaredEventsByName {
  */
 export class EventGroup {
   private static _uniqueId = 0;
-  private _parent;
+  private _parent: any;
   private _eventRecords: IEventRecord[];
   private _id = EventGroup._uniqueId++;
   private _isDisposed: boolean;
@@ -56,10 +56,10 @@ export class EventGroup {
         let ev = document.createEvent('HTMLEvents');
 
         ev.initEvent(eventName, bubbleEvent, true);
-        ev['args'] = eventArgs;
+        (ev as any)['args'] = eventArgs;
         retVal = target.dispatchEvent(ev);
-      } else if (document['createEventObject']) { // IE8
-        let evObj = document['createEventObject'](eventArgs);
+      } else if ((document as any)['createEventObject']) { // IE8
+        let evObj = (document as any)['createEventObject'](eventArgs);
         // cannot set cancelBubble on evObj, fireEvent will overwrite it
         target.fireEvent('on' + eventName, evObj);
       }
diff --git a/packages/utilities/src/autobind.ts b/packages/utilities/src/autobind.ts
index b9f01cb22fd7c..bca1666cb0b23 100644
--- a/packages/utilities/src/autobind.ts
+++ b/packages/utilities/src/autobind.ts
@@ -30,7 +30,7 @@ export function autobind<T extends Function>(target: any, key: string, descripto
       return fnBound;
     },
 
-    set(newValue) {
+    set(newValue: any) {
       Object.defineProperty(this, key, {
         configurable: true,
         writable: true,
diff --git a/packages/utilities/src/css.ts b/packages/utilities/src/css.ts
index 006cf4fddebfe..e16c39e8d1e07 100644
--- a/packages/utilities/src/css.ts
+++ b/packages/utilities/src/css.ts
@@ -20,7 +20,7 @@ export function css(...args: ICssInput[]) {
         classes.push(arg.toString());
       } else {
         for (let key in arg as any) {
-          if (arg[key]) {
+          if ((arg as any)[key]) {
             classes.push(key);
           }
         }
diff --git a/packages/utilities/src/customizable.test.tsx b/packages/utilities/src/customizable.test.tsx
index 41454c8afed01..8ef656a1e5a5c 100644
--- a/packages/utilities/src/customizable.test.tsx
+++ b/packages/utilities/src/customizable.test.tsx
@@ -10,7 +10,7 @@ class Foo extends React.Component<{ field: string; }, {}> {
   public name: any;
 
   public render() {
-    return <div>{ this.props[this.props.field] }</div>;
+    return <div>{ (this.props as any)[this.props.field] }</div>;
   }
 }
 
diff --git a/packages/utilities/src/customizable.tsx b/packages/utilities/src/customizable.tsx
index 6b5400a9a6e4c..a590468340c1a 100644
--- a/packages/utilities/src/customizable.tsx
+++ b/packages/utilities/src/customizable.tsx
@@ -29,7 +29,7 @@ export function customizable<P>(fields: string[]) {
         let defaultProps = {};
 
         for (let propName of fields) {
-          defaultProps[propName] = (this.context.injectedProps) ?
+          (defaultProps as any)[propName] = (this.context.injectedProps) ?
             this.context.injectedProps[propName] :
             Customizer.getDefault(propName);
         }
diff --git a/packages/utilities/src/dom.ts b/packages/utilities/src/dom.ts
index b114db5c24f72..1f3ac4740abe6 100644
--- a/packages/utilities/src/dom.ts
+++ b/packages/utilities/src/dom.ts
@@ -106,7 +106,7 @@ let _isSSR = false;
 /**
  * Helper to set ssr mode to simulate no window object returned from getWindow helper.
  */
-export function setSSR(isEnabled) {
+export function setSSR(isEnabled: boolean) {
   _isSSR = isEnabled;
 }
 
diff --git a/packages/utilities/src/focus.test.tsx b/packages/utilities/src/focus.test.tsx
index d04874f42b405..3d60e27f07190 100644
--- a/packages/utilities/src/focus.test.tsx
+++ b/packages/utilities/src/focus.test.tsx
@@ -8,9 +8,9 @@ let { expect } = chai;
 
 import { isElementVisible, isElementTabbable } from './focus';
 
-let _hiddenElement;
-let _visibleElement;
-let _element;
+let _hiddenElement: HTMLElement | undefined;
+let _visibleElement: HTMLElement | undefined;
+let _element: HTMLElement | undefined;
 
 function renderIntoDocument(element: React.ReactElement<any>): HTMLElement {
   const component = ReactTestUtils.renderIntoDocument(element);
diff --git a/packages/utilities/src/hoist.ts b/packages/utilities/src/hoist.ts
index bdd468fc55e94..9724aee142783 100644
--- a/packages/utilities/src/hoist.ts
+++ b/packages/utilities/src/hoist.ts
@@ -18,7 +18,7 @@ const REACT_LIFECYCLE_EXCLUSIONS = [
  * @param exclusions - (Optional) What methods to exclude from being hoisted.
  * @returns An array of names of methods that were hoisted.
  */
-export function hoistMethods(destination, source, exclusions: string[] = REACT_LIFECYCLE_EXCLUSIONS): string[] {
+export function hoistMethods(destination: any, source: any, exclusions: string[] = REACT_LIFECYCLE_EXCLUSIONS): string[] {
   let hoisted: string[] = [];
   for (let methodName in source) {
     if (
diff --git a/packages/utilities/src/memoize.test.ts b/packages/utilities/src/memoize.test.ts
index 7b1fe5e8518a9..b100ae39bf526 100644
--- a/packages/utilities/src/memoize.test.ts
+++ b/packages/utilities/src/memoize.test.ts
@@ -1,10 +1,10 @@
 import { memoize, memoizeFunction, setMemoizeWeakMap } from './memoize';
-import * as weakMapPolyfill from 'es6-weak-map/polyfill';
+import weakMapPolyfill = require('es6-weak-map');
 
 let { expect } = chai;
 
 describe('memoizeFunction', () => {
-  before(()=> {
+  before(() => {
     setMemoizeWeakMap(weakMapPolyfill);
   });
 
@@ -95,7 +95,7 @@ describe('memoizeFunction', () => {
 });
 
 describe('memoize', () => {
-  before(()=> {
+  before(() => {
     setMemoizeWeakMap(weakMapPolyfill);
   });
 
diff --git a/packages/utilities/src/memoize.ts b/packages/utilities/src/memoize.ts
index 3205cdbb69066..8353f85cccc24 100644
--- a/packages/utilities/src/memoize.ts
+++ b/packages/utilities/src/memoize.ts
@@ -1,11 +1,11 @@
 declare class WeakMap {
   public get(key: any): any;
   public set(key: any, value: any): void;
-  public has(key: any);
+  public has(key: any): boolean;
 }
 
 const _emptyObject = { empty: true };
-const _dictionary = {};
+const _dictionary: any = {};
 let _weakMap = (typeof WeakMap === 'undefined') ? null : WeakMap;
 
 interface IMemoizeNode {
diff --git a/packages/utilities/src/object.ts b/packages/utilities/src/object.ts
index 400d75ee2767f..339700c34969f 100644
--- a/packages/utilities/src/object.ts
+++ b/packages/utilities/src/object.ts
@@ -9,7 +9,7 @@ if (_global[CURRENT_ID_PROPERTY] === undefined) {
   _global[CURRENT_ID_PROPERTY] = 0;
 }
 
-function checkProperties(a, b) {
+function checkProperties(a: any, b: any) {
   for (let propName in a) {
     if (a.hasOwnProperty(propName)) {
       if (!b.hasOwnProperty(propName) || (b[propName] !== a[propName])) {
@@ -22,7 +22,7 @@ function checkProperties(a, b) {
 }
 
 // Compare a to b and b to a
-export function shallowCompare(a, b) {
+export function shallowCompare(a: any, b: any) {
   return checkProperties(a, b) && checkProperties(b, a);
 }
 
@@ -35,7 +35,7 @@ export function shallowCompare(a, b) {
  * @param args - One or more objects that will be mixed into the target in the order they are provided.
  * @returns Resulting merged target.
  */
-export function assign(target: any, ...args): any {
+export function assign(target: any, ...args: any[]): any {
   return filteredAssign.apply(this, [null, target].concat(args));
 }
 
@@ -50,7 +50,7 @@ export function assign(target: any, ...args): any {
  * @param args - One or more objects that will be mixed into the target in the order they are provided.
  * @returns Resulting merged target.
  */
-export function filteredAssign(isAllowed: (propName: string) => boolean, target: any, ...args) {
+export function filteredAssign(isAllowed: (propName: string) => boolean, target: any, ...args: any[]) {
   target = target || {};
 
   for (let sourceObject of args) {
diff --git a/packages/utilities/src/properties.test.ts b/packages/utilities/src/properties.test.ts
index d3aa465be5b5b..b3b8621cdceed 100644
--- a/packages/utilities/src/properties.test.ts
+++ b/packages/utilities/src/properties.test.ts
@@ -11,14 +11,14 @@ describe('getNativeProps', () => {
     let result = getNativeProps<React.HTMLAttributes<HTMLDivElement>>({
       'data-automation-id': 1
     }, divProperties);
-    expect(result['data-automation-id']).equals(1);
+    expect((result as any)['data-automation-id']).equals(1);
   });
 
   it('can pass through aria tags', () => {
     let result = getNativeProps<React.HTMLAttributes<HTMLDivElement>>({
       'aria-label': 1
     }, divProperties);
-    expect(result['aria-label']).equals(1);
+    expect((result as any)['aria-label']).equals(1);
   });
 
   it('can pass through basic div properties and events', () => {
@@ -29,7 +29,8 @@ describe('getNativeProps', () => {
     }, divProperties);
     expect(result.className).equals('foo');
     expect(result.onClick).is.instanceof(Function, 'onClick not function');
-    expect(result['onClickCapture']).is.instanceof(Function, 'onClickCapture not function');  // tslint:disable-line:no-string-literal
+    // tslint:disable-next-line:no-string-literal
+    expect((result as any)['onClickCapture']).is.instanceof(Function, 'onClickCapture not function');
   });
 
   it('can remove unexpected properties', () => {
@@ -38,11 +39,11 @@ describe('getNativeProps', () => {
       className: 'hi'
     }, divProperties);
     expect(result.className).equals('hi');
-    expect(result['foobar']).equals(undefined); // tslint:disable-line:no-string-literal
+    expect((result as any)['foobar']).equals(undefined); // tslint:disable-line:no-string-literal
   });
 
   it('can exclude properties', () => {
-    let result = getNativeProps<any>({ a: 1, b: 2}, ['a', 'b'], ['b']);
+    let result = getNativeProps<any>({ a: 1, b: 2 }, ['a', 'b'], ['b']);
 
     expect(result.a).to.exist;
     expect(result.b).to.not.exist;
diff --git a/packages/utilities/src/resources.ts b/packages/utilities/src/resources.ts
index 7db0806d03cc9..f1aedeee24a45 100644
--- a/packages/utilities/src/resources.ts
+++ b/packages/utilities/src/resources.ts
@@ -1,11 +1,11 @@
 let _baseUrl = '';
 
 /** Sets the current base url used for fetching images. */
-export function getResourceUrl(url) {
+export function getResourceUrl(url: string) {
   return _baseUrl + url;
 }
 
 /** Gets the current base url used for fetching images. */
-export function setBaseUrl(baseUrl) {
+export function setBaseUrl(baseUrl: string) {
   _baseUrl = baseUrl;
 }
diff --git a/packages/utilities/src/string.ts b/packages/utilities/src/string.ts
index ca0b126d8a8f5..0de594d55bdfc 100644
--- a/packages/utilities/src/string.ts
+++ b/packages/utilities/src/string.ts
@@ -11,20 +11,20 @@ const FORMAT_REGEX = /\{\d+\}/g;
  * Example "I love {0} every {1}".format("CXP") will result in a Debug Exception.
  */
 export function format(s: string, ...values: any[]): string {
-    'use strict';
+  'use strict';
 
-    let args = values;
-    // Callback match function
-    function replace_func(match: string) {
-        // looks up in the args
-        let replacement = args[match.replace(FORMAT_ARGS_REGEX, '')];
+  let args = values;
+  // Callback match function
+  function replace_func(match: string) {
+    // looks up in the args
+    let replacement = args[match.replace(FORMAT_ARGS_REGEX, '') as any];
 
-        // catches undefined in nondebug and null in debug and nondebug
-        if (replacement === null || replacement === undefined) {
-            replacement = '';
-        }
-
-        return replacement;
+    // catches undefined in nondebug and null in debug and nondebug
+    if (replacement === null || replacement === undefined) {
+      replacement = '';
     }
-    return (s.replace(FORMAT_REGEX, replace_func));
+
+    return replacement;
+  }
+  return (s.replace(FORMAT_REGEX, replace_func));
 }
\ No newline at end of file
diff --git a/packages/utilities/src/test/injectWrapperMethod.ts b/packages/utilities/src/test/injectWrapperMethod.ts
index 72fb2118276b2..b683b2cf1445e 100644
--- a/packages/utilities/src/test/injectWrapperMethod.ts
+++ b/packages/utilities/src/test/injectWrapperMethod.ts
@@ -7,13 +7,13 @@ import { ReactWrapper } from 'enzyme';
  * @param fn - The function to run prior to the call of the original method
  */
 export function injectWrapperMethod(wrapper: ReactWrapper<any, any>, methodName: string, fn: () => void) {
-  const originalMethod = wrapper.instance()[methodName];
+  const originalMethod = (wrapper.instance() as any)[methodName];
 
   if (typeof originalMethod !== 'function') {
     throw new Error(`Tried to override the method ${methodName} on a ReactWrapper that does not have that function`);
   }
 
-  wrapper.instance()[methodName] = function (prevProps: any) {
+  (wrapper.instance() as any)[methodName] = function (prevProps: any) {
     fn();
     originalMethod.call(this, prevProps);
   };
diff --git a/packages/utilities/tsconfig.json b/packages/utilities/tsconfig.json
index df37502ab300d..c86ca82c9d7db 100644
--- a/packages/utilities/tsconfig.json
+++ b/packages/utilities/tsconfig.json
@@ -11,6 +11,7 @@
     "sourceMap": true,
     "experimentalDecorators": true,
     "importHelpers": true,
+    "noImplicitAny": true,
     "moduleResolution": "node",
     "types": [
       "chai",

From 4629fbd8565a845375b025a15bda92f02792c4fd Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sun, 11 Jun 2017 18:34:17 -0700
Subject: [PATCH 0089/1641] Fix bundle minification to exclude debug warnings.
 (#1973)

* Updating shrinkwrap, rush, and making minify build have production flag to remove debug code.

* Updates.

* removing lockfile.

* dropping to 7. Moving back to npm run build.

* Downgrading rush.
---
 .travis.yml                                   |    8 +-
 apps/ssr-tests/package.json                   |    2 -
 .../fix-minify_2017-06-11-20-33.json          |   11 +
 common/config/rush/npm-shrinkwrap.json        |   97 +-
 package-lock.json                             | 2148 -----------------
 .../webpack.lib.config.js                     |   16 +-
 rush.json                                     |    2 +-
 7 files changed, 82 insertions(+), 2202 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-minify_2017-06-11-20-33.json
 delete mode 100644 package-lock.json

diff --git a/.travis.yml b/.travis.yml
index 900094a3d1334..5907ae300a6e1 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -1,11 +1,7 @@
 language: node_js
 node_js:
-  - '8'
+  - '7'
 before_script:
   - npm install -g gulp
 script:
-  - npm run buildfast
-cache:
-  directories:
-    - node_modules
-    - common/node_modules
+  - npm run build
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index af27f745b69ae..7c6690ca0b041 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -2,9 +2,7 @@
   "name": "ssr-tests",
   "version": "1.0.2",
   "description": "Reusable React components for building experiences for Office 365.",
-  "main": "lib/index.js",
   "private": true,
-  "typings": "lib/index.d.ts",
   "repository": {
     "type": "git",
     "url": "https://github.com/OfficeDev/office-ui-fabric-react"
diff --git a/common/changes/office-ui-fabric-react/fix-minify_2017-06-11-20-33.json b/common/changes/office-ui-fabric-react/fix-minify_2017-06-11-20-33.json
new file mode 100644
index 0000000000000..5ff25aeb96108
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-minify_2017-06-11-20-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Updating minified bundle to exclude debug warnings.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@hotmail.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index bf17555b905bf..51215c9930682 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -1648,9 +1648,9 @@
       }
     },
     "@uifabric/styling": {
-      "version": "0.7.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.7.1.tgz",
-      "integrity": "sha512-PZ0ryYqj1Wu4Ojsb7e2VesvgsiY9Lghz9ByEXirywk0im/83fB58exrLtLUBsBU6H037kp8q2RaO2wuaQEnwMw=="
+      "version": "0.7.2",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.7.2.tgz",
+      "integrity": "sha512-HZLvm7OU+gXeXO+QHnAJXimzBtEq/UoQwCUTb+gdFJP0oU43gLm40G1G+tPDjS0+ZB2CIIrkH7v0jQ2paKprSg=="
     },
     "@uifabric/utilities": {
       "version": "4.1.2",
@@ -2302,9 +2302,9 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000680",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000680.tgz",
-      "integrity": "sha1-126+quuC49mVK/3FwjHE+DzUgUQ="
+      "version": "1.0.30000683",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000683.tgz",
+      "integrity": "sha1-WLV+0eC7naVOrxRimFFHu+Fmefo="
     },
     "capture-stack-trace": {
       "version": "1.0.0",
@@ -2379,9 +2379,9 @@
       "integrity": "sha1-s7026T3Uy/s5WjwmiWNSRFJlwFs="
     },
     "clean-css": {
-      "version": "3.4.26",
-      "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-3.4.26.tgz",
-      "integrity": "sha1-VTI7NE/zvO5oSi6sgck9+Ppz3us=",
+      "version": "3.4.27",
+      "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-3.4.27.tgz",
+      "integrity": "sha1-re91sxwWD/pdcvTeZ5ZuJmDBolU=",
       "dependencies": {
         "commander": {
           "version": "2.8.1",
@@ -2463,9 +2463,9 @@
       "integrity": "sha1-bqa989hTrlTMuOR7+gvz+QMfsYQ="
     },
     "coa": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/coa/-/coa-1.0.2.tgz",
-      "integrity": "sha1-K6n+w7SqQ9eknX5sNWHpIGG2vOw="
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/coa/-/coa-1.0.3.tgz",
+      "integrity": "sha1-G1Sl4dz3fJkEVdTe6pjFZEFtyJM="
     },
     "code-point-at": {
       "version": "1.1.0",
@@ -2779,9 +2779,9 @@
       "integrity": "sha1-ElYDfsufDF9549bvE14wdwGEuYI=",
       "dependencies": {
         "lru-cache": {
-          "version": "4.1.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.0.tgz",
-          "integrity": "sha512-aHGs865JXz6bkB4AHL+3AhyvTFKL3iZamKVWjIUKnXOXyasJvqPK8WAjOnAQKQZVpeXDVz19u1DD0r/12bWAdQ=="
+          "version": "4.1.1",
+          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.1.tgz",
+          "integrity": "sha512-q4spe4KTfsAS1SUHLO0wz8Qiyf1+vMIAgpRYioFYDMNqKfHQbg+AVDH3i4fvpl71/P1L0dBl+fQi+P37UYf0ew=="
         }
       }
     },
@@ -2791,9 +2791,9 @@
       "integrity": "sha1-hF/wwINKPe2dFg2sptOQkGuyiMw=",
       "dependencies": {
         "lru-cache": {
-          "version": "4.1.0",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.0.tgz",
-          "integrity": "sha512-aHGs865JXz6bkB4AHL+3AhyvTFKL3iZamKVWjIUKnXOXyasJvqPK8WAjOnAQKQZVpeXDVz19u1DD0r/12bWAdQ=="
+          "version": "4.1.1",
+          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.1.tgz",
+          "integrity": "sha512-q4spe4KTfsAS1SUHLO0wz8Qiyf1+vMIAgpRYioFYDMNqKfHQbg+AVDH3i4fvpl71/P1L0dBl+fQi+P37UYf0ew=="
         }
       }
     },
@@ -3202,9 +3202,9 @@
       "integrity": "sha1-R5Y2v6P+Ox3r1SCH8KyyBLTxnIg="
     },
     "electron-to-chromium": {
-      "version": "1.3.13",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.13.tgz",
-      "integrity": "sha1-GzperObgh7teJXoQCwy/6Bsokfw="
+      "version": "1.3.14",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.14.tgz",
+      "integrity": "sha1-ZK8Pnv08PGrNV9cfg7Scp+6cS0M="
     },
     "elliptic": {
       "version": "6.4.0",
@@ -5230,14 +5230,14 @@
           "integrity": "sha1-hHIkZ3rbiHDWeSV+0ziP22HkAQU="
         },
         "globule": {
-          "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/globule/-/globule-1.1.0.tgz",
-          "integrity": "sha1-xJNS5NwYPYWJPuglOF65lLtt9F8="
+          "version": "1.2.0",
+          "resolved": "https://registry.npmjs.org/globule/-/globule-1.2.0.tgz",
+          "integrity": "sha1-HcScaCLdnoovoAuiopUAboZkvQk="
         },
         "lodash": {
-          "version": "4.16.6",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.16.6.tgz",
-          "integrity": "sha1-0iyaxmAojzhD4Wun0rXQbMon13c="
+          "version": "4.17.4",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
         },
         "node-sass": {
           "version": "3.13.1",
@@ -7241,14 +7241,14 @@
           "integrity": "sha1-hHIkZ3rbiHDWeSV+0ziP22HkAQU="
         },
         "globule": {
-          "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/globule/-/globule-1.1.0.tgz",
-          "integrity": "sha1-xJNS5NwYPYWJPuglOF65lLtt9F8="
+          "version": "1.2.0",
+          "resolved": "https://registry.npmjs.org/globule/-/globule-1.2.0.tgz",
+          "integrity": "sha1-HcScaCLdnoovoAuiopUAboZkvQk="
         },
         "lodash": {
-          "version": "4.16.6",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.16.6.tgz",
-          "integrity": "sha1-0iyaxmAojzhD4Wun0rXQbMon13c="
+          "version": "4.17.4",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
         }
       }
     },
@@ -7380,9 +7380,9 @@
       "integrity": "sha1-EEEktsYCxnlogaBCVB0220OlJk4="
     },
     "office-ui-fabric-core": {
-      "version": "7.0.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-7.0.0.tgz",
-      "integrity": "sha1-5rl2yY1wuKoAvVAGTIgOE3dFiY4="
+      "version": "7.1.1",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-7.1.1.tgz",
+      "integrity": "sha1-hm7CYioSwEE7X2gTbvy5f66o8WY="
     },
     "office-ui-fabric-react": {
       "version": "4.4.2",
@@ -8172,9 +8172,28 @@
       "integrity": "sha1-T2ih3Arli9P7lYSMMDJNt11kNgs="
     },
     "randomatic": {
-      "version": "1.1.6",
-      "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-1.1.6.tgz",
-      "integrity": "sha1-EQ3Kv/OX6dz/fAeJzMCkmt8exbs="
+      "version": "1.1.7",
+      "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-1.1.7.tgz",
+      "integrity": "sha512-D5JUjPyJbaJDkuAazpVnSfVkLlpeO3wDlPROTMLGKG1zMFNFRgrciKo1ltz/AzNTkqE0HzDx655QOL51N06how==",
+      "dependencies": {
+        "is-number": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/is-number/-/is-number-3.0.0.tgz",
+          "integrity": "sha1-JP1iAaR4LPUFYcgQJ2r8fRLXEZU=",
+          "dependencies": {
+            "kind-of": {
+              "version": "3.2.2",
+              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+              "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+            }
+          }
+        },
+        "kind-of": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-4.0.0.tgz",
+          "integrity": "sha1-IIE989cSkosgc3hpGkUGb65y3Vc="
+        }
+      }
     },
     "randombytes": {
       "version": "2.0.5",
diff --git a/package-lock.json b/package-lock.json
deleted file mode 100644
index e7573fca22684..0000000000000
--- a/package-lock.json
+++ /dev/null
@@ -1,2148 +0,0 @@
-{
-  "name": "office-ui-fabric-react-repo",
-  "version": "1.0.0",
-  "lockfileVersion": 1,
-  "dependencies": {
-    "@microsoft/package-deps-hash": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/@microsoft/package-deps-hash/-/package-deps-hash-2.0.2.tgz",
-      "integrity": "sha1-e17NHr2RS2YIvwBUdKnQZ81MmUg=",
-      "dev": true
-    },
-    "@microsoft/rush": {
-      "version": "3.0.7",
-      "resolved": "https://registry.npmjs.org/@microsoft/rush/-/rush-3.0.7.tgz",
-      "integrity": "sha1-3fehsUYJ+0E1Aoej9anz70gVC7w=",
-      "dev": true
-    },
-    "@microsoft/rush-lib": {
-      "version": "3.0.7",
-      "resolved": "https://registry.npmjs.org/@microsoft/rush-lib/-/rush-lib-3.0.7.tgz",
-      "integrity": "sha1-bKgpmEgMMxDKcHqeWW+NXAA+MMQ=",
-      "dev": true
-    },
-    "@microsoft/stream-collator": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/stream-collator/-/stream-collator-2.0.0.tgz",
-      "integrity": "sha1-O4vFx28J03IFX8LtV+0bCKsChyM=",
-      "dev": true
-    },
-    "@microsoft/ts-command-line": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/ts-command-line/-/ts-command-line-2.0.0.tgz",
-      "integrity": "sha1-4+OOiCRkLlQAu0Sl9xs+hVT/e4s=",
-      "dev": true
-    },
-    "@types/es6-collections": {
-      "version": "0.5.29",
-      "resolved": "https://registry.npmjs.org/@types/es6-collections/-/es6-collections-0.5.29.tgz",
-      "integrity": "sha1-7CKDH36N5zY3vxVmD52MomlGmA0=",
-      "dev": true
-    },
-    "@types/fs-extra": {
-      "version": "0.0.37",
-      "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.37.tgz",
-      "integrity": "sha1-GV8RvNmhuX2eQSxrZombVFRxofc=",
-      "dev": true
-    },
-    "@types/node": {
-      "version": "6.0.62",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.62.tgz",
-      "integrity": "sha1-hSIsB3tU8ltXQXu3CLn4d72jf4k=",
-      "dev": true
-    },
-    "@types/z-schema": {
-      "version": "3.16.31",
-      "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.31.tgz",
-      "integrity": "sha1-LrHQCl5Ow/pYx2r94S4YK2bcXBw=",
-      "dev": true
-    },
-    "agent-base": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-2.1.0.tgz",
-      "integrity": "sha1-GTRV5DR7ymsFhHy4HpObsyVEbag=",
-      "dev": true,
-      "dependencies": {
-        "semver": {
-          "version": "5.0.3",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.0.3.tgz",
-          "integrity": "sha1-d0Zt5YnNXTyV8TiqeLxWmjy10no=",
-          "dev": true
-        }
-      }
-    },
-    "ajv": {
-      "version": "4.11.8",
-      "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz",
-      "integrity": "sha1-gv+wKynmYq5TvcIK8VlHcGc5xTY=",
-      "dev": true,
-      "optional": true
-    },
-    "ansi-escapes": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz",
-      "integrity": "sha1-06ioOzGapneTZisT52HHkRQiMG4=",
-      "dev": true
-    },
-    "ansi-regex": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
-      "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
-      "dev": true
-    },
-    "ansi-styles": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-      "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=",
-      "dev": true
-    },
-    "archy": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/archy/-/archy-1.0.0.tgz",
-      "integrity": "sha1-+cjBN1fMHde8N5rHeyxipcKGjEA=",
-      "dev": true
-    },
-    "argparse": {
-      "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.9.tgz",
-      "integrity": "sha1-c9g7wmP4bpf4zE9rrhsOkKfSLIY=",
-      "dev": true
-    },
-    "arr-diff": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
-      "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8=",
-      "dev": true
-    },
-    "arr-flatten": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.0.3.tgz",
-      "integrity": "sha1-onTthawIhJtr14R8RYB0XcUa37E=",
-      "dev": true
-    },
-    "array-differ": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/array-differ/-/array-differ-1.0.0.tgz",
-      "integrity": "sha1-7/UuN1gknTO+QCuLuOVkuytdQDE=",
-      "dev": true
-    },
-    "array-uniq": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz",
-      "integrity": "sha1-r2rId6Jcx/dOBYiUdThY39sk/bY=",
-      "dev": true
-    },
-    "array-unique": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
-      "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM=",
-      "dev": true
-    },
-    "asap": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.5.tgz",
-      "integrity": "sha1-UidltQw1EEkOUtfc/ghe+bqWlY8=",
-      "dev": true
-    },
-    "asn1": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.3.tgz",
-      "integrity": "sha1-2sh4dxPJlmhJ/IGAd36+nB3fO4Y=",
-      "dev": true,
-      "optional": true
-    },
-    "assert-plus": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-0.2.0.tgz",
-      "integrity": "sha1-104bh+ev/A24qttwIfP+SBAasjQ=",
-      "dev": true,
-      "optional": true
-    },
-    "asynckit": {
-      "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
-      "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k=",
-      "dev": true,
-      "optional": true
-    },
-    "aws-sign2": {
-      "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz",
-      "integrity": "sha1-FDQt0428yU0OW4fXY81jYSwOeU8=",
-      "dev": true,
-      "optional": true
-    },
-    "aws4": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.6.0.tgz",
-      "integrity": "sha1-g+9cqGCysy5KDe7e6MdxudtXRx4=",
-      "dev": true,
-      "optional": true
-    },
-    "balanced-match": {
-      "version": "0.4.2",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-0.4.2.tgz",
-      "integrity": "sha1-yz8+PHMtwPAe5wtAPzAuYddwmDg=",
-      "dev": true
-    },
-    "bcrypt-pbkdf": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/bcrypt-pbkdf/-/bcrypt-pbkdf-1.0.1.tgz",
-      "integrity": "sha1-Y7xdy2EzG5K8Bf1SiVPDNGKgb40=",
-      "dev": true,
-      "optional": true
-    },
-    "beeper": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/beeper/-/beeper-1.1.1.tgz",
-      "integrity": "sha1-5tXqjF2tABMEpwsiY4RH9pyy+Ak=",
-      "dev": true
-    },
-    "boom": {
-      "version": "2.10.1",
-      "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
-      "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8=",
-      "dev": true
-    },
-    "brace-expansion": {
-      "version": "1.1.7",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.7.tgz",
-      "integrity": "sha1-Pv/DxQ4ABTH7cg6v+A8K6O8jz1k=",
-      "dev": true
-    },
-    "braces": {
-      "version": "1.8.5",
-      "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
-      "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc=",
-      "dev": true
-    },
-    "buffer-shims": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/buffer-shims/-/buffer-shims-1.0.0.tgz",
-      "integrity": "sha1-mXjOMXOIxkmth5MCjDR37wRKi1E=",
-      "dev": true
-    },
-    "builtin-modules": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz",
-      "integrity": "sha1-Jw8HbFpywC9bZaR9+Uxf46J4iS8=",
-      "dev": true
-    },
-    "builtins": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/builtins/-/builtins-1.0.3.tgz",
-      "integrity": "sha1-y5T662HIaWRR2zZTThQi+U8K7og=",
-      "dev": true
-    },
-    "camelcase": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
-      "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo=",
-      "dev": true
-    },
-    "caseless": {
-      "version": "0.12.0",
-      "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz",
-      "integrity": "sha1-G2gcIf+EAzyCZUMJBolCDRhxUdw=",
-      "dev": true,
-      "optional": true
-    },
-    "chalk": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-      "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
-      "dev": true
-    },
-    "cli-cursor": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-1.0.2.tgz",
-      "integrity": "sha1-ZNo/fValRBLll5S9Ytw1KV6PKYc=",
-      "dev": true
-    },
-    "cli-width": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-2.1.0.tgz",
-      "integrity": "sha1-sjTKIJsp72b8UY2bmNWEewDt8Ao=",
-      "dev": true
-    },
-    "cliui": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
-      "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0=",
-      "dev": true
-    },
-    "clone": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.2.tgz",
-      "integrity": "sha1-Jgt6meux7f4kdTgXX3gyQ8sZ0Uk=",
-      "dev": true
-    },
-    "clone-stats": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-0.0.1.tgz",
-      "integrity": "sha1-uI+UqCzzi4eR1YBG6kAprYjKmdE=",
-      "dev": true
-    },
-    "co": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
-      "integrity": "sha1-bqa989hTrlTMuOR7+gvz+QMfsYQ=",
-      "dev": true,
-      "optional": true
-    },
-    "code-point-at": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz",
-      "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c=",
-      "dev": true
-    },
-    "colors": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/colors/-/colors-1.1.2.tgz",
-      "integrity": "sha1-FopHAXVran9RoSzgyXv6KMCE7WM=",
-      "dev": true
-    },
-    "combined-stream": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz",
-      "integrity": "sha1-k4NwpXtKUd6ix3wV1cX9+JUWQAk=",
-      "dev": true
-    },
-    "commander": {
-      "version": "2.9.0",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
-      "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q=",
-      "dev": true,
-      "optional": true
-    },
-    "concat-map": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
-      "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=",
-      "dev": true
-    },
-    "concat-stream": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.0.tgz",
-      "integrity": "sha1-CqxmL9Ur54lk1VMvaUeE5wEQrPc=",
-      "dev": true
-    },
-    "core-util-is": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
-      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=",
-      "dev": true
-    },
-    "cryptiles": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz",
-      "integrity": "sha1-O9/s3GCBR8HGcgL6KR59ylnqo7g=",
-      "dev": true,
-      "optional": true
-    },
-    "dashdash": {
-      "version": "1.14.1",
-      "resolved": "https://registry.npmjs.org/dashdash/-/dashdash-1.14.1.tgz",
-      "integrity": "sha1-hTz6D3y+L+1d4gMmuN1YEDX24vA=",
-      "dev": true,
-      "optional": true,
-      "dependencies": {
-        "assert-plus": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
-          "dev": true,
-          "optional": true
-        }
-      }
-    },
-    "dateformat": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-2.0.0.tgz",
-      "integrity": "sha1-J0Pjq7XD/CRi5SfcpEXgTp9N7hc=",
-      "dev": true
-    },
-    "debug": {
-      "version": "2.6.8",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
-      "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw=",
-      "dev": true
-    },
-    "debuglog": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/debuglog/-/debuglog-1.0.1.tgz",
-      "integrity": "sha1-qiT/uaw9+aI1GDfPstJ5NgzXhJI=",
-      "dev": true
-    },
-    "decamelize": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
-      "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA=",
-      "dev": true
-    },
-    "defaults": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.3.tgz",
-      "integrity": "sha1-xlYFHpgX2f8I7YgUd/P+QBnz730=",
-      "dev": true
-    },
-    "delayed-stream": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
-      "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk=",
-      "dev": true
-    },
-    "deprecated": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/deprecated/-/deprecated-0.0.1.tgz",
-      "integrity": "sha1-+cmvVGSvoeepcUWKi97yqpTVuxk=",
-      "dev": true
-    },
-    "detect-file": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/detect-file/-/detect-file-0.1.0.tgz",
-      "integrity": "sha1-STXe39lIhkjgBrASlWbpOGcR6mM=",
-      "dev": true
-    },
-    "dezalgo": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/dezalgo/-/dezalgo-1.0.3.tgz",
-      "integrity": "sha1-f3Qt4Gb8dIvI24IFad3c5Jvw1FY=",
-      "dev": true
-    },
-    "duplexer2": {
-      "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.0.2.tgz",
-      "integrity": "sha1-xhTc9n4vsUmVqRcR5aYX6KYKMds=",
-      "dev": true,
-      "dependencies": {
-        "isarray": {
-          "version": "0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
-          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
-          "dev": true
-        },
-        "readable-stream": {
-          "version": "1.1.14",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
-          "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk=",
-          "dev": true
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
-          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=",
-          "dev": true
-        }
-      }
-    },
-    "ecc-jsbn": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.1.tgz",
-      "integrity": "sha1-D8c6ntXw1Tw4GTOYUj735UN3dQU=",
-      "dev": true,
-      "optional": true
-    },
-    "end-of-stream": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-0.1.5.tgz",
-      "integrity": "sha1-jhdyBsPICDfYVjLouTWd/osvbq8=",
-      "dev": true,
-      "dependencies": {
-        "once": {
-          "version": "1.3.3",
-          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz",
-          "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA=",
-          "dev": true
-        }
-      }
-    },
-    "error-ex": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.1.tgz",
-      "integrity": "sha1-+FWobOYa3E6GIcPNoh56dhLDqNw=",
-      "dev": true
-    },
-    "escape-string-regexp": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
-      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
-      "dev": true
-    },
-    "exit-hook": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/exit-hook/-/exit-hook-1.1.1.tgz",
-      "integrity": "sha1-8FyiM7SMBdVP/wd2XfhQfpXAL/g=",
-      "dev": true
-    },
-    "expand-brackets": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
-      "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s=",
-      "dev": true
-    },
-    "expand-range": {
-      "version": "1.8.2",
-      "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz",
-      "integrity": "sha1-opnv/TNf4nIeuujiV+x5ZE/IUzc=",
-      "dev": true
-    },
-    "expand-tilde": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-1.2.2.tgz",
-      "integrity": "sha1-C4HrqJflo9MdHD0QL48BRB5VlEk=",
-      "dev": true
-    },
-    "extend": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz",
-      "integrity": "sha1-p1Xqe8Gt/MWjHOfnYtuq3F5jZEQ=",
-      "dev": true
-    },
-    "external-editor": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/external-editor/-/external-editor-1.1.1.tgz",
-      "integrity": "sha1-Etew24UPf/fnCBuvQAVwAGDEYAs=",
-      "dev": true
-    },
-    "extglob": {
-      "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
-      "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE=",
-      "dev": true
-    },
-    "extsprintf": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.0.2.tgz",
-      "integrity": "sha1-4QgOBljjALBilJkMxw4VAiNf1VA=",
-      "dev": true
-    },
-    "fancy-log": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/fancy-log/-/fancy-log-1.3.0.tgz",
-      "integrity": "sha1-Rb4X0Cu5kX1gzP/UmVyZnmyMmUg=",
-      "dev": true
-    },
-    "figures": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz",
-      "integrity": "sha1-y+Hjr/zxzUS4DK3+0o3Hk6lwHS4=",
-      "dev": true
-    },
-    "filename-regex": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz",
-      "integrity": "sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY=",
-      "dev": true
-    },
-    "fill-range": {
-      "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz",
-      "integrity": "sha1-ULd9/X5Gm8dJJHCWNpn+eoSFpyM=",
-      "dev": true
-    },
-    "find-index": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
-      "integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ=",
-      "dev": true
-    },
-    "find-up": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
-      "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8=",
-      "dev": true
-    },
-    "findup-sync": {
-      "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.4.3.tgz",
-      "integrity": "sha1-QAQ5Kee8YK3wt/SCfExudaDeyhI=",
-      "dev": true
-    },
-    "fined": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/fined/-/fined-1.0.2.tgz",
-      "integrity": "sha1-WyhCS3YNdZiWC374SA3/itNmDpc=",
-      "dev": true
-    },
-    "first-chunk-stream": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/first-chunk-stream/-/first-chunk-stream-1.0.0.tgz",
-      "integrity": "sha1-Wb+1DNkF9g18OUzT2ayqtOatk04=",
-      "dev": true
-    },
-    "flagged-respawn": {
-      "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/flagged-respawn/-/flagged-respawn-0.3.2.tgz",
-      "integrity": "sha1-/xke3c1wiKZ1smEP/8l2vpuAdLU=",
-      "dev": true
-    },
-    "follow-redirects": {
-      "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-0.0.7.tgz",
-      "integrity": "sha1-NLkLqyqRGqNHVx2pDyK9NuzYqRk=",
-      "dev": true
-    },
-    "for-in": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
-      "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA=",
-      "dev": true
-    },
-    "for-own": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz",
-      "integrity": "sha1-UmXGgaTylNq78XyVCbZ2OqhFEM4=",
-      "dev": true
-    },
-    "forever-agent": {
-      "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
-      "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE=",
-      "dev": true,
-      "optional": true
-    },
-    "form-data": {
-      "version": "2.1.4",
-      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
-      "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE=",
-      "dev": true,
-      "optional": true
-    },
-    "fs-exists-sync": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/fs-exists-sync/-/fs-exists-sync-0.1.0.tgz",
-      "integrity": "sha1-mC1ok6+RjnLQjeyehnP/K1qNat0=",
-      "dev": true
-    },
-    "fs-extra": {
-      "version": "0.26.7",
-      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz",
-      "integrity": "sha1-muH92UiXeY7at20JGM9C0MMYT6k=",
-      "dev": true
-    },
-    "fs.realpath": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
-      "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=",
-      "dev": true
-    },
-    "gaze": {
-      "version": "0.5.2",
-      "resolved": "https://registry.npmjs.org/gaze/-/gaze-0.5.2.tgz",
-      "integrity": "sha1-QLcJU30k0dRXZ9takIaJ3+aaxE8=",
-      "dev": true
-    },
-    "get-caller-file": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz",
-      "integrity": "sha1-9wLmMSfn4jHBYKgMFVSstw1QR+U=",
-      "dev": true
-    },
-    "getpass": {
-      "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
-      "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo=",
-      "dev": true,
-      "optional": true,
-      "dependencies": {
-        "assert-plus": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
-          "dev": true,
-          "optional": true
-        }
-      }
-    },
-    "git-repo-info": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/git-repo-info/-/git-repo-info-1.1.4.tgz",
-      "integrity": "sha1-E0n6OIinZh6h/2OgR8L/Q7PglgI=",
-      "dev": true
-    },
-    "github": {
-      "version": "7.3.2",
-      "resolved": "https://registry.npmjs.org/github/-/github-7.3.2.tgz",
-      "integrity": "sha1-/hDN5pZDUsXZHhGnYW0m1f+2+Hs=",
-      "dev": true
-    },
-    "glob": {
-      "version": "7.0.6",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-7.0.6.tgz",
-      "integrity": "sha1-IRuvr0nlJbjNkyYNFKsTYVKz9Xo=",
-      "dev": true
-    },
-    "glob-base": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz",
-      "integrity": "sha1-27Fk9iIbHAscz4Kuoyi0l98Oo8Q=",
-      "dev": true
-    },
-    "glob-escape": {
-      "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/glob-escape/-/glob-escape-0.0.2.tgz",
-      "integrity": "sha1-nCf3gh7RwTd1gvPv2VWOP2dWKO0=",
-      "dev": true
-    },
-    "glob-parent": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz",
-      "integrity": "sha1-gTg9ctsFT8zPUzbaqQLxgvbtuyg=",
-      "dev": true
-    },
-    "glob-stream": {
-      "version": "3.1.18",
-      "resolved": "https://registry.npmjs.org/glob-stream/-/glob-stream-3.1.18.tgz",
-      "integrity": "sha1-kXCl8St5Awb9/lmPMT+PeVT9FDs=",
-      "dev": true,
-      "dependencies": {
-        "glob": {
-          "version": "4.5.3",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-4.5.3.tgz",
-          "integrity": "sha1-xstz0yJsHv7wTePFbQEvAzd+4V8=",
-          "dev": true
-        },
-        "isarray": {
-          "version": "0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
-          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
-          "dev": true
-        },
-        "minimatch": {
-          "version": "2.0.10",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-2.0.10.tgz",
-          "integrity": "sha1-jQh8OcazjAAbl/ynzm0OHoCvusc=",
-          "dev": true
-        },
-        "readable-stream": {
-          "version": "1.0.34",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
-          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=",
-          "dev": true
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
-          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=",
-          "dev": true
-        },
-        "through2": {
-          "version": "0.6.5",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
-          "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg=",
-          "dev": true
-        }
-      }
-    },
-    "glob-watcher": {
-      "version": "0.0.6",
-      "resolved": "https://registry.npmjs.org/glob-watcher/-/glob-watcher-0.0.6.tgz",
-      "integrity": "sha1-uVtKjfdLOcgymLDAXJeLTZo7cQs=",
-      "dev": true
-    },
-    "glob2base": {
-      "version": "0.0.12",
-      "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz",
-      "integrity": "sha1-nUGbPijxLoOjYhZKJ3BVkiycDVY=",
-      "dev": true
-    },
-    "global-modules": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-0.2.3.tgz",
-      "integrity": "sha1-6lo77ULG1s6ZWk+KEmm12uIjgo0=",
-      "dev": true
-    },
-    "global-prefix": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-0.1.5.tgz",
-      "integrity": "sha1-jTvGuNo8qBEqFg2NSW/wRiv+948=",
-      "dev": true
-    },
-    "globule": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/globule/-/globule-0.1.0.tgz",
-      "integrity": "sha1-2cjt3h2nnRJaFRt5UzuXhnY0auU=",
-      "dev": true,
-      "dependencies": {
-        "glob": {
-          "version": "3.1.21",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-3.1.21.tgz",
-          "integrity": "sha1-0p4KBV3qUTj00H7UDomC6DwgZs0=",
-          "dev": true
-        },
-        "graceful-fs": {
-          "version": "1.2.3",
-          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-1.2.3.tgz",
-          "integrity": "sha1-FaSAaldUfLLS2/J/QuiajDRRs2Q=",
-          "dev": true
-        },
-        "inherits": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/inherits/-/inherits-1.0.2.tgz",
-          "integrity": "sha1-ykMJ2t7mtUzAuNJH6NfHoJdb3Js=",
-          "dev": true
-        },
-        "lodash": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-1.0.2.tgz",
-          "integrity": "sha1-j1dWDIO1n8JwvT1WG2kAQ0MOJVE=",
-          "dev": true
-        },
-        "minimatch": {
-          "version": "0.2.14",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.2.14.tgz",
-          "integrity": "sha1-x054BXT2PG+aCQ6Q775u9TpqdWo=",
-          "dev": true
-        }
-      }
-    },
-    "glogg": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/glogg/-/glogg-1.0.0.tgz",
-      "integrity": "sha1-f+DxmfV6yQbPUS/urY+Q7kooT8U=",
-      "dev": true
-    },
-    "graceful-fs": {
-      "version": "4.1.11",
-      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz",
-      "integrity": "sha1-Dovf5NHduIVNZOBOp8AOKgJuVlg=",
-      "dev": true
-    },
-    "graceful-readlink": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz",
-      "integrity": "sha1-TK+tdrxi8C+gObL5Tpo906ORpyU=",
-      "dev": true,
-      "optional": true
-    },
-    "gulp": {
-      "version": "3.9.1",
-      "resolved": "https://registry.npmjs.org/gulp/-/gulp-3.9.1.tgz",
-      "integrity": "sha1-VxzkWSjdQK9lFPxAEYZgFsE4RbQ=",
-      "dev": true,
-      "dependencies": {
-        "semver": {
-          "version": "4.3.6",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz",
-          "integrity": "sha1-MAvG4OhjdPe6YQaLWx7NV/xlMto=",
-          "dev": true
-        }
-      }
-    },
-    "gulp-util": {
-      "version": "3.0.8",
-      "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.8.tgz",
-      "integrity": "sha1-AFTh50RQLifATBh8PsxQXdVLu08=",
-      "dev": true,
-      "dependencies": {
-        "object-assign": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz",
-          "integrity": "sha1-m+3VygiXlJvKR+f/QIBi1Un1h/I=",
-          "dev": true
-        }
-      }
-    },
-    "gulplog": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/gulplog/-/gulplog-1.0.0.tgz",
-      "integrity": "sha1-4oxNRdBey77YGDY86PnFkmIp/+U=",
-      "dev": true
-    },
-    "har-schema": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-1.0.5.tgz",
-      "integrity": "sha1-0mMTX0MwfALGAq/I/pWXDAFRNp4=",
-      "dev": true,
-      "optional": true
-    },
-    "har-validator": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz",
-      "integrity": "sha1-M0gdDxu/9gDdID11gSpqX7oALio=",
-      "dev": true,
-      "optional": true
-    },
-    "has-ansi": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz",
-      "integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE=",
-      "dev": true
-    },
-    "has-gulplog": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/has-gulplog/-/has-gulplog-0.1.0.tgz",
-      "integrity": "sha1-ZBTIKRNpfaUVkDl9r7EvIpZ4Ec4=",
-      "dev": true
-    },
-    "hawk": {
-      "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz",
-      "integrity": "sha1-B4REvXwWQLD+VA0sm3PVlnjo4cQ=",
-      "dev": true,
-      "optional": true
-    },
-    "hoek": {
-      "version": "2.16.3",
-      "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz",
-      "integrity": "sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0=",
-      "dev": true
-    },
-    "homedir-polyfill": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.1.tgz",
-      "integrity": "sha1-TCu8inWJmP7r9e1oWA921GdotLw=",
-      "dev": true
-    },
-    "hosted-git-info": {
-      "version": "2.4.2",
-      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.4.2.tgz",
-      "integrity": "sha1-AHa59GonBQbduq6lZJaJdGBhKmc=",
-      "dev": true
-    },
-    "http-signature": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz",
-      "integrity": "sha1-33LiZwZs0Kxn+3at+OE0qPvPkb8=",
-      "dev": true,
-      "optional": true
-    },
-    "https-proxy-agent": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-1.0.0.tgz",
-      "integrity": "sha1-NffabEjOTdv6JkiRrFk+5f+GceY=",
-      "dev": true
-    },
-    "inflight": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
-      "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=",
-      "dev": true
-    },
-    "inherits": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
-      "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=",
-      "dev": true
-    },
-    "ini": {
-      "version": "1.3.4",
-      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.4.tgz",
-      "integrity": "sha1-BTfLedr1m1mhpRff9wbIbsA5Fi4=",
-      "dev": true
-    },
-    "inquirer": {
-      "version": "1.2.3",
-      "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-1.2.3.tgz",
-      "integrity": "sha1-TexvMvN+97sLLtPx0aXD9UUHSRg=",
-      "dev": true
-    },
-    "interpret": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.0.3.tgz",
-      "integrity": "sha1-y8NcYu7uc/Gat7EKgBURQBr8D5A=",
-      "dev": true
-    },
-    "invert-kv": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/invert-kv/-/invert-kv-1.0.0.tgz",
-      "integrity": "sha1-EEqOSqym09jNFXqO+L+rLXo//bY=",
-      "dev": true
-    },
-    "is-absolute": {
-      "version": "0.2.6",
-      "resolved": "https://registry.npmjs.org/is-absolute/-/is-absolute-0.2.6.tgz",
-      "integrity": "sha1-IN5p89uULvLYe5wto28XIjWxtes=",
-      "dev": true
-    },
-    "is-arrayish": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
-      "integrity": "sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0=",
-      "dev": true
-    },
-    "is-buffer": {
-      "version": "1.1.5",
-      "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.5.tgz",
-      "integrity": "sha1-Hzsm72E7IUuIy8ojzGwB2Hlh7sw=",
-      "dev": true
-    },
-    "is-builtin-module": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-1.0.0.tgz",
-      "integrity": "sha1-VAVy0096wxGfj3bDDLwbHgN6/74=",
-      "dev": true
-    },
-    "is-dotfile": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/is-dotfile/-/is-dotfile-1.0.2.tgz",
-      "integrity": "sha1-LBMjg/ORmfjtwmjKAbmwB9IFzE0=",
-      "dev": true
-    },
-    "is-equal-shallow": {
-      "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/is-equal-shallow/-/is-equal-shallow-0.1.3.tgz",
-      "integrity": "sha1-IjgJj8Ih3gvPpdnqxMRdY4qhxTQ=",
-      "dev": true
-    },
-    "is-extendable": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
-      "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=",
-      "dev": true
-    },
-    "is-extglob": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
-      "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA=",
-      "dev": true
-    },
-    "is-fullwidth-code-point": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
-      "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
-      "dev": true
-    },
-    "is-glob": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz",
-      "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM=",
-      "dev": true
-    },
-    "is-number": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz",
-      "integrity": "sha1-Afy7s5NGOlSPL0ZszhbezknbkI8=",
-      "dev": true
-    },
-    "is-posix-bracket": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz",
-      "integrity": "sha1-MzTceXdDaOkvAW5vvAqI9c1ua8Q=",
-      "dev": true
-    },
-    "is-primitive": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/is-primitive/-/is-primitive-2.0.0.tgz",
-      "integrity": "sha1-IHurkWOEmcB7Kt8kCkGochADRXU=",
-      "dev": true
-    },
-    "is-promise": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/is-promise/-/is-promise-2.1.0.tgz",
-      "integrity": "sha1-eaKp7OfwlugPNtKy87wWwf9L8/o=",
-      "dev": true
-    },
-    "is-relative": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/is-relative/-/is-relative-0.2.1.tgz",
-      "integrity": "sha1-0n9MfVFtF1+2ENuEu+7yPDvJeqU=",
-      "dev": true
-    },
-    "is-typedarray": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz",
-      "integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo=",
-      "dev": true,
-      "optional": true
-    },
-    "is-unc-path": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/is-unc-path/-/is-unc-path-0.1.2.tgz",
-      "integrity": "sha1-arBTpyVzwQJQ/0FqOBTDUXivObk=",
-      "dev": true
-    },
-    "is-utf8": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz",
-      "integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI=",
-      "dev": true
-    },
-    "is-windows": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-0.2.0.tgz",
-      "integrity": "sha1-3hqm1j6indJIc3tp8f+LgALSEIw=",
-      "dev": true
-    },
-    "isarray": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-      "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=",
-      "dev": true
-    },
-    "isexe": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
-      "integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA=",
-      "dev": true
-    },
-    "isobject": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
-      "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk=",
-      "dev": true
-    },
-    "isstream": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz",
-      "integrity": "sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo=",
-      "dev": true,
-      "optional": true
-    },
-    "jju": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/jju/-/jju-1.3.0.tgz",
-      "integrity": "sha1-2t2e8BkkvHKLA/L3l5vb1i96Kqo=",
-      "dev": true
-    },
-    "jodid25519": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/jodid25519/-/jodid25519-1.0.2.tgz",
-      "integrity": "sha1-BtSRIlUJNBlHfUJWM2BuDpB4KWc=",
-      "dev": true,
-      "optional": true
-    },
-    "jsbn": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-0.1.1.tgz",
-      "integrity": "sha1-peZUwuWi3rXyAdls77yoDA7y9RM=",
-      "dev": true,
-      "optional": true
-    },
-    "json-parse-helpfulerror": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/json-parse-helpfulerror/-/json-parse-helpfulerror-1.0.3.tgz",
-      "integrity": "sha1-E/FM4C7tTpgSl7ZOueO5MuLdE9w=",
-      "dev": true
-    },
-    "json-schema": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz",
-      "integrity": "sha1-tIDIkuWaLwWVTOcnvT8qTogvnhM=",
-      "dev": true,
-      "optional": true
-    },
-    "json-stable-stringify": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz",
-      "integrity": "sha1-mnWdOcXy/1A/1TAGRu1EX4jE+a8=",
-      "dev": true,
-      "optional": true
-    },
-    "json-stringify-safe": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz",
-      "integrity": "sha1-Epai1Y/UXxmg9s4B1lcB4sc1tus=",
-      "dev": true,
-      "optional": true
-    },
-    "jsonfile": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz",
-      "integrity": "sha1-NzaitCi4e72gzIO1P6PWM6NcKug=",
-      "dev": true
-    },
-    "jsonify": {
-      "version": "0.0.0",
-      "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz",
-      "integrity": "sha1-LHS27kHZPKUbe1qu6PUDYx0lKnM=",
-      "dev": true,
-      "optional": true
-    },
-    "jsprim": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.0.tgz",
-      "integrity": "sha1-o7h+QCmNjDgFUtjMdiigu5WiKRg=",
-      "dev": true,
-      "optional": true,
-      "dependencies": {
-        "assert-plus": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
-          "dev": true,
-          "optional": true
-        }
-      }
-    },
-    "kind-of": {
-      "version": "3.2.2",
-      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-      "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
-      "dev": true
-    },
-    "klaw": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/klaw/-/klaw-1.3.1.tgz",
-      "integrity": "sha1-QIhDO0azsbolnXh4XY6W9zugJDk=",
-      "dev": true
-    },
-    "lcid": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/lcid/-/lcid-1.0.0.tgz",
-      "integrity": "sha1-MIrMr6C8SDo4Z7S28rlQYlHRuDU=",
-      "dev": true
-    },
-    "liftoff": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/liftoff/-/liftoff-2.3.0.tgz",
-      "integrity": "sha1-qY8v9nGD2Lp8+soQVIvX/wVQs4U=",
-      "dev": true
-    },
-    "load-json-file": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
-      "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
-      "dev": true,
-      "dependencies": {
-        "strip-bom": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
-          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4=",
-          "dev": true
-        }
-      }
-    },
-    "lodash": {
-      "version": "4.15.0",
-      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.15.0.tgz",
-      "integrity": "sha1-MWI5HY8BQKoiz49rPDTWt/Y9Oqk=",
-      "dev": true
-    },
-    "lodash._basecopy": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz",
-      "integrity": "sha1-jaDmqHbPNEwK2KVIghEd08XHyjY=",
-      "dev": true
-    },
-    "lodash._basetostring": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/lodash._basetostring/-/lodash._basetostring-3.0.1.tgz",
-      "integrity": "sha1-0YYdh3+CSlL2aYMtyvPuFVZqB9U=",
-      "dev": true
-    },
-    "lodash._basevalues": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._basevalues/-/lodash._basevalues-3.0.0.tgz",
-      "integrity": "sha1-W3dXYoAr3j0yl1A+JjAIIP32Ybc=",
-      "dev": true
-    },
-    "lodash._getnative": {
-      "version": "3.9.1",
-      "resolved": "https://registry.npmjs.org/lodash._getnative/-/lodash._getnative-3.9.1.tgz",
-      "integrity": "sha1-VwvH3t5G1hzc3mh9ZdPuy6o6r/U=",
-      "dev": true
-    },
-    "lodash._isiterateecall": {
-      "version": "3.0.9",
-      "resolved": "https://registry.npmjs.org/lodash._isiterateecall/-/lodash._isiterateecall-3.0.9.tgz",
-      "integrity": "sha1-UgOte6Ql+uhCRg5pbbnPPmqsBXw=",
-      "dev": true
-    },
-    "lodash._reescape": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reescape/-/lodash._reescape-3.0.0.tgz",
-      "integrity": "sha1-Kx1vXf4HyKNVdT5fJ/rH8c3hYWo=",
-      "dev": true
-    },
-    "lodash._reevaluate": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reevaluate/-/lodash._reevaluate-3.0.0.tgz",
-      "integrity": "sha1-WLx0xAZklTrgsSTYBpltrKQx4u0=",
-      "dev": true
-    },
-    "lodash._reinterpolate": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz",
-      "integrity": "sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0=",
-      "dev": true
-    },
-    "lodash._root": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/lodash._root/-/lodash._root-3.0.1.tgz",
-      "integrity": "sha1-+6HEUkwZ7ppfgTa0YJ8BfPTe1pI=",
-      "dev": true
-    },
-    "lodash.assignwith": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/lodash.assignwith/-/lodash.assignwith-4.2.0.tgz",
-      "integrity": "sha1-EnqX8CrcQXUalU0ksN4X4QDgOOs=",
-      "dev": true
-    },
-    "lodash.escape": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-3.2.0.tgz",
-      "integrity": "sha1-mV7g3BjBtIzJLv+ucaEKq1tIdpg=",
-      "dev": true
-    },
-    "lodash.get": {
-      "version": "4.4.2",
-      "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
-      "integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk=",
-      "dev": true
-    },
-    "lodash.isarguments": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz",
-      "integrity": "sha1-L1c9hcaiQon/AGY7SRwdM4/zRYo=",
-      "dev": true
-    },
-    "lodash.isarray": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz",
-      "integrity": "sha1-eeTriMNqgSKvhvhEqpvNhRtfu1U=",
-      "dev": true
-    },
-    "lodash.isempty": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/lodash.isempty/-/lodash.isempty-4.4.0.tgz",
-      "integrity": "sha1-b4bL7di+TsmHvpqvM8loTbGzHn4=",
-      "dev": true
-    },
-    "lodash.isplainobject": {
-      "version": "4.0.6",
-      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
-      "integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs=",
-      "dev": true
-    },
-    "lodash.isstring": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/lodash.isstring/-/lodash.isstring-4.0.1.tgz",
-      "integrity": "sha1-1SfftUVuynzJu5XV2ur4i6VKVFE=",
-      "dev": true
-    },
-    "lodash.keys": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz",
-      "integrity": "sha1-TbwEcrFWvlCgsoaFXRvQsMZWCYo=",
-      "dev": true
-    },
-    "lodash.mapvalues": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/lodash.mapvalues/-/lodash.mapvalues-4.6.0.tgz",
-      "integrity": "sha1-G6+lAF3p3W9PJmaMMMo3IwzJaJw=",
-      "dev": true
-    },
-    "lodash.pick": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz",
-      "integrity": "sha1-UvBWEP/53tQiYRRB7R/BI6AwAbM=",
-      "dev": true
-    },
-    "lodash.restparam": {
-      "version": "3.6.1",
-      "resolved": "https://registry.npmjs.org/lodash.restparam/-/lodash.restparam-3.6.1.tgz",
-      "integrity": "sha1-k2pOMJ7zMKdkXtQUWYbIWuWyCAU=",
-      "dev": true
-    },
-    "lodash.template": {
-      "version": "3.6.2",
-      "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-3.6.2.tgz",
-      "integrity": "sha1-+M3sxhaaJVvpCYrosMU9N4kx0U8=",
-      "dev": true
-    },
-    "lodash.templatesettings": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-3.1.1.tgz",
-      "integrity": "sha1-+zB4RHU7Zrnxr6VOJix0UwfbqOU=",
-      "dev": true
-    },
-    "lru-cache": {
-      "version": "2.7.3",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.7.3.tgz",
-      "integrity": "sha1-bUUk6LlV+V1PW1iFHOId1y+06VI=",
-      "dev": true
-    },
-    "map-cache": {
-      "version": "0.2.2",
-      "resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz",
-      "integrity": "sha1-wyq9C9ZSXZsFFkW7TyasXcmKDb8=",
-      "dev": true
-    },
-    "micromatch": {
-      "version": "2.3.11",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
-      "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU=",
-      "dev": true
-    },
-    "mime": {
-      "version": "1.3.6",
-      "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.6.tgz",
-      "integrity": "sha1-WR2E02U6awtKO5343lqoEI5y5eA=",
-      "dev": true
-    },
-    "mime-db": {
-      "version": "1.27.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.27.0.tgz",
-      "integrity": "sha1-gg9XIpa70g7CXtVeW13oaeVDbrE=",
-      "dev": true
-    },
-    "mime-types": {
-      "version": "2.1.15",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.15.tgz",
-      "integrity": "sha1-pOv1BkCUVpI3uM9wBGd20J/JKu0=",
-      "dev": true
-    },
-    "minimatch": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
-      "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==",
-      "dev": true
-    },
-    "minimist": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
-      "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=",
-      "dev": true
-    },
-    "mkdirp": {
-      "version": "0.5.1",
-      "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
-      "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
-      "dev": true,
-      "dependencies": {
-        "minimist": {
-          "version": "0.0.8",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
-          "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0=",
-          "dev": true
-        }
-      }
-    },
-    "ms": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-      "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
-      "dev": true
-    },
-    "multipipe": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/multipipe/-/multipipe-0.1.2.tgz",
-      "integrity": "sha1-Ko8t33Du1WTf8tV/HhoTfZ8FB4s=",
-      "dev": true
-    },
-    "mute-stream": {
-      "version": "0.0.6",
-      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.6.tgz",
-      "integrity": "sha1-SJYrGeFp/R38JAs/HnMXYnu8R9s=",
-      "dev": true
-    },
-    "natives": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/natives/-/natives-1.1.0.tgz",
-      "integrity": "sha1-6f+EFBimsux6SV6TmYT3jxY+bjE=",
-      "dev": true
-    },
-    "netrc": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/netrc/-/netrc-0.1.4.tgz",
-      "integrity": "sha1-a+lPysqNd63gqWcNxGCRTJRHJEQ=",
-      "dev": true
-    },
-    "normalize-package-data": {
-      "version": "2.3.8",
-      "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.3.8.tgz",
-      "integrity": "sha1-2Bntoqne29H/pWPqQHHZNngilbs=",
-      "dev": true
-    },
-    "normalize-path": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-2.1.1.tgz",
-      "integrity": "sha1-GrKLVW4Zg2Oowab35vogE3/mrtk=",
-      "dev": true
-    },
-    "number-is-nan": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz",
-      "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=",
-      "dev": true
-    },
-    "oauth-sign": {
-      "version": "0.8.2",
-      "resolved": "https://registry.npmjs.org/oauth-sign/-/oauth-sign-0.8.2.tgz",
-      "integrity": "sha1-Rqarfwrq2N6unsBWV4C31O/rnUM=",
-      "dev": true,
-      "optional": true
-    },
-    "object-assign": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
-      "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=",
-      "dev": true
-    },
-    "object.omit": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/object.omit/-/object.omit-2.0.1.tgz",
-      "integrity": "sha1-Gpx0SCnznbuFjHbKNXmuKlTr0fo=",
-      "dev": true
-    },
-    "once": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
-      "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
-      "dev": true
-    },
-    "onetime": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/onetime/-/onetime-1.1.0.tgz",
-      "integrity": "sha1-ofeDj4MUxRbwXs78vEzP4EtO14k=",
-      "dev": true
-    },
-    "orchestrator": {
-      "version": "0.3.8",
-      "resolved": "https://registry.npmjs.org/orchestrator/-/orchestrator-0.3.8.tgz",
-      "integrity": "sha1-FOfp4nZPcxX7rBhOUGx6pt+UrX4=",
-      "dev": true
-    },
-    "ordered-read-streams": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.1.0.tgz",
-      "integrity": "sha1-/VZamvjrRHO6abbtijQ1LLVS8SY=",
-      "dev": true
-    },
-    "os-homedir": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
-      "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M=",
-      "dev": true
-    },
-    "os-locale": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
-      "integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk=",
-      "dev": true
-    },
-    "os-shim": {
-      "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/os-shim/-/os-shim-0.1.3.tgz",
-      "integrity": "sha1-a2LDeRz3kJ6jXtRuF2WLtBfLORc=",
-      "dev": true
-    },
-    "os-tmpdir": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
-      "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ=",
-      "dev": true
-    },
-    "parse-filepath": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/parse-filepath/-/parse-filepath-1.0.1.tgz",
-      "integrity": "sha1-FZ1hVdQ5BNFsEO9piRHaHpGWm3M=",
-      "dev": true
-    },
-    "parse-glob": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/parse-glob/-/parse-glob-3.0.4.tgz",
-      "integrity": "sha1-ssN2z7EfNVE7rdFz7wu246OIORw=",
-      "dev": true
-    },
-    "parse-json": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz",
-      "integrity": "sha1-9ID0BDTvgHQfhGkJn43qGPVaTck=",
-      "dev": true
-    },
-    "parse-passwd": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/parse-passwd/-/parse-passwd-1.0.0.tgz",
-      "integrity": "sha1-bVuTSkVpk7I9N/QKOC1vFmao5cY=",
-      "dev": true
-    },
-    "path-exists": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
-      "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s=",
-      "dev": true
-    },
-    "path-is-absolute": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
-      "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=",
-      "dev": true
-    },
-    "path-parse": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.5.tgz",
-      "integrity": "sha1-PBrfhx6pzWyUMbbqK9dKD/BVxME=",
-      "dev": true
-    },
-    "path-root": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/path-root/-/path-root-0.1.1.tgz",
-      "integrity": "sha1-mkpoFMrBwM1zNgqV8yCDyOpHRbc=",
-      "dev": true
-    },
-    "path-root-regex": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/path-root-regex/-/path-root-regex-0.1.2.tgz",
-      "integrity": "sha1-v8zcjfWxLcUsi0PsONGNcsBLqW0=",
-      "dev": true
-    },
-    "path-type": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
-      "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE=",
-      "dev": true
-    },
-    "performance-now": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-0.2.0.tgz",
-      "integrity": "sha1-M+8wxcd9TqIcWlOGnZG1bY8lVeU=",
-      "dev": true,
-      "optional": true
-    },
-    "pify": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
-      "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
-      "dev": true
-    },
-    "pinkie": {
-      "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/pinkie/-/pinkie-2.0.4.tgz",
-      "integrity": "sha1-clVrgM+g1IqXToDnckjoDtT3+HA=",
-      "dev": true
-    },
-    "pinkie-promise": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz",
-      "integrity": "sha1-ITXW36ejWMBprJsXh3YogihFD/o=",
-      "dev": true
-    },
-    "preserve": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/preserve/-/preserve-0.2.0.tgz",
-      "integrity": "sha1-gV7R9uvGWSb4ZbMQwHE7yzMVzks=",
-      "dev": true
-    },
-    "pretty-hrtime": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz",
-      "integrity": "sha1-t+PqQkNaTJsnWdmeDyAesZWALuE=",
-      "dev": true
-    },
-    "process-nextick-args": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz",
-      "integrity": "sha1-FQ4gt1ZZCtP5EJPyWk8q2L/zC6M=",
-      "dev": true
-    },
-    "punycode": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
-      "integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4=",
-      "dev": true,
-      "optional": true
-    },
-    "qs": {
-      "version": "6.4.0",
-      "resolved": "https://registry.npmjs.org/qs/-/qs-6.4.0.tgz",
-      "integrity": "sha1-E+JtKK1rD/qpExLNO/cI7TUecjM=",
-      "dev": true,
-      "optional": true
-    },
-    "randomatic": {
-      "version": "1.1.6",
-      "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-1.1.6.tgz",
-      "integrity": "sha1-EQ3Kv/OX6dz/fAeJzMCkmt8exbs=",
-      "dev": true
-    },
-    "read-package-json": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/read-package-json/-/read-package-json-2.0.5.tgz",
-      "integrity": "sha1-+Tpk5kFSnfaKCMZN5GOJ6KP4iEU=",
-      "dev": true,
-      "dependencies": {
-        "glob": {
-          "version": "7.1.2",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
-          "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ==",
-          "dev": true
-        }
-      }
-    },
-    "read-package-tree": {
-      "version": "5.1.5",
-      "resolved": "https://registry.npmjs.org/read-package-tree/-/read-package-tree-5.1.5.tgz",
-      "integrity": "sha1-rOfmOBx2hPlwqqmPx8XStmat2rY=",
-      "dev": true
-    },
-    "read-pkg": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
-      "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg=",
-      "dev": true
-    },
-    "read-pkg-up": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
-      "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI=",
-      "dev": true
-    },
-    "readable-stream": {
-      "version": "2.2.9",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.9.tgz",
-      "integrity": "sha1-z3jsb0ptHrQ9JkiMrJfwQudLf8g=",
-      "dev": true
-    },
-    "readdir-scoped-modules": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/readdir-scoped-modules/-/readdir-scoped-modules-1.0.2.tgz",
-      "integrity": "sha1-n6+jfShr5dksuuve4DDcm19AZ0c=",
-      "dev": true
-    },
-    "rechoir": {
-      "version": "0.6.2",
-      "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz",
-      "integrity": "sha1-hSBLVNuoLVdC4oyWdW70OvUOM4Q=",
-      "dev": true
-    },
-    "regex-cache": {
-      "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.3.tgz",
-      "integrity": "sha1-mxpsNdTQ3871cRrmUejp09cRQUU=",
-      "dev": true
-    },
-    "remove-trailing-separator": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.0.1.tgz",
-      "integrity": "sha1-YV67lq9VlVLUv0BXyENtSGq2PMQ=",
-      "dev": true
-    },
-    "repeat-element": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/repeat-element/-/repeat-element-1.1.2.tgz",
-      "integrity": "sha1-7wiaF40Ug7quTZPrmLT55OEdmQo=",
-      "dev": true
-    },
-    "repeat-string": {
-      "version": "1.6.1",
-      "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-1.6.1.tgz",
-      "integrity": "sha1-jcrkcOHIirwtYA//Sndihtp15jc=",
-      "dev": true
-    },
-    "replace-ext": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-0.0.1.tgz",
-      "integrity": "sha1-KbvZIHinOfC8zitO5B6DeVNSKSQ=",
-      "dev": true
-    },
-    "request": {
-      "version": "2.81.0",
-      "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz",
-      "integrity": "sha1-xpKJRqDgbF+Nb4qTM0af/aRimKA=",
-      "dev": true,
-      "optional": true
-    },
-    "require-directory": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
-      "integrity": "sha1-jGStX9MNqxyXbiNE/+f3kqam30I=",
-      "dev": true
-    },
-    "require-main-filename": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-1.0.1.tgz",
-      "integrity": "sha1-l/cXtp1IeE9fUmpsWqj/3aBVpNE=",
-      "dev": true
-    },
-    "resolve": {
-      "version": "1.3.3",
-      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.3.3.tgz",
-      "integrity": "sha1-ZVkHw0aahoDcLeOidaj91paR8OU=",
-      "dev": true
-    },
-    "resolve-dir": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/resolve-dir/-/resolve-dir-0.1.1.tgz",
-      "integrity": "sha1-shklmlYC+sXFxJatiUpujMQwJh4=",
-      "dev": true
-    },
-    "restore-cursor": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-1.0.1.tgz",
-      "integrity": "sha1-NGYfRohjJ/7SmRR5FSJS35LapUE=",
-      "dev": true
-    },
-    "rimraf": {
-      "version": "2.5.4",
-      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
-      "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ=",
-      "dev": true
-    },
-    "run-async": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/run-async/-/run-async-2.3.0.tgz",
-      "integrity": "sha1-A3GrSuC91yDUFm19/aZP96RFpsA=",
-      "dev": true
-    },
-    "rx": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/rx/-/rx-4.1.0.tgz",
-      "integrity": "sha1-pfE/957zt0D+MKqAP7CfmIBdR4I=",
-      "dev": true
-    },
-    "safe-buffer": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-      "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c=",
-      "dev": true
-    },
-    "semver": {
-      "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz",
-      "integrity": "sha1-myzl094C0XxgEq0yaqa00M9U+U8=",
-      "dev": true
-    },
-    "sequencify": {
-      "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/sequencify/-/sequencify-0.0.7.tgz",
-      "integrity": "sha1-kM/xnQLgcCf9dn9erT57ldHnOAw=",
-      "dev": true
-    },
-    "set-blocking": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
-      "integrity": "sha1-BF+XgtARrppoA93TgrJDkrPYkPc=",
-      "dev": true
-    },
-    "sigmund": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/sigmund/-/sigmund-1.0.1.tgz",
-      "integrity": "sha1-P/IfGYytIXX587eBhT/ZTQ0ZtZA=",
-      "dev": true
-    },
-    "sntp": {
-      "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz",
-      "integrity": "sha1-ZUEYTMkK7qbG57NeJlkIJEPGYZg=",
-      "dev": true,
-      "optional": true
-    },
-    "sparkles": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/sparkles/-/sparkles-1.0.0.tgz",
-      "integrity": "sha1-Gsu/tZJDbRC76PeFt8xvgoFQEsM=",
-      "dev": true
-    },
-    "spawn-sync": {
-      "version": "1.0.15",
-      "resolved": "https://registry.npmjs.org/spawn-sync/-/spawn-sync-1.0.15.tgz",
-      "integrity": "sha1-sAeZVX63+wyDdsKdROih6mfldHY=",
-      "dev": true
-    },
-    "spdx-correct": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-1.0.2.tgz",
-      "integrity": "sha1-SzBz2TP/UfORLwOsVRlJikFQ20A=",
-      "dev": true
-    },
-    "spdx-expression-parse": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-1.0.4.tgz",
-      "integrity": "sha1-m98vIOH0DtRH++JzJmGR/O1RYmw=",
-      "dev": true
-    },
-    "spdx-license-ids": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-1.2.2.tgz",
-      "integrity": "sha1-yd96NCRZSt5r0RkA1ZZpbcBrrFc=",
-      "dev": true
-    },
-    "sprintf-js": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
-      "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=",
-      "dev": true
-    },
-    "sshpk": {
-      "version": "1.13.0",
-      "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.13.0.tgz",
-      "integrity": "sha1-/yo+T9BEl1Vf7Zezmg/YL6+zozw=",
-      "dev": true,
-      "optional": true,
-      "dependencies": {
-        "assert-plus": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
-          "dev": true,
-          "optional": true
-        }
-      }
-    },
-    "stream-consume": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/stream-consume/-/stream-consume-0.1.0.tgz",
-      "integrity": "sha1-pB6tGm1ggc63n2WwYZAbbY89HQ8=",
-      "dev": true
-    },
-    "string_decoder": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.1.tgz",
-      "integrity": "sha1-YuIA8DmVWmgQ2N8KM//A8BNmLZg=",
-      "dev": true
-    },
-    "string-width": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
-      "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
-      "dev": true
-    },
-    "stringstream": {
-      "version": "0.0.5",
-      "resolved": "https://registry.npmjs.org/stringstream/-/stringstream-0.0.5.tgz",
-      "integrity": "sha1-TkhM1N5aC7vuGORjB3EKioFiGHg=",
-      "dev": true,
-      "optional": true
-    },
-    "strip-ansi": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
-      "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
-      "dev": true
-    },
-    "strip-bom": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-1.0.0.tgz",
-      "integrity": "sha1-hbiGLzhEtabV7IRnqTWYFzo295Q=",
-      "dev": true
-    },
-    "supports-color": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-      "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=",
-      "dev": true
-    },
-    "through": {
-      "version": "2.3.8",
-      "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
-      "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU=",
-      "dev": true
-    },
-    "through2": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/through2/-/through2-2.0.3.tgz",
-      "integrity": "sha1-AARWmzfHx0ujnEPzzteNGtlBQL4=",
-      "dev": true
-    },
-    "tildify": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/tildify/-/tildify-1.2.0.tgz",
-      "integrity": "sha1-3OwD9V3Km3qj5bBPIYF+tW5jWIo=",
-      "dev": true
-    },
-    "time-stamp": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/time-stamp/-/time-stamp-1.1.0.tgz",
-      "integrity": "sha1-dkpaEa9QVhkhsTPztE5hhofg9cM=",
-      "dev": true
-    },
-    "tmp": {
-      "version": "0.0.29",
-      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.29.tgz",
-      "integrity": "sha1-8lEl/w3Z2jzLDC3Tce4SiLuRKMA=",
-      "dev": true
-    },
-    "tough-cookie": {
-      "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.2.tgz",
-      "integrity": "sha1-8IH3bkyFcg5sN6X6ztc3FQ2EByo=",
-      "dev": true,
-      "optional": true
-    },
-    "tunnel-agent": {
-      "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.6.0.tgz",
-      "integrity": "sha1-J6XeoGs2sEoKmWZ3SykIaPD8QP0=",
-      "dev": true,
-      "optional": true
-    },
-    "tweetnacl": {
-      "version": "0.14.5",
-      "resolved": "https://registry.npmjs.org/tweetnacl/-/tweetnacl-0.14.5.tgz",
-      "integrity": "sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q=",
-      "dev": true,
-      "optional": true
-    },
-    "typedarray": {
-      "version": "0.0.6",
-      "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
-      "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=",
-      "dev": true
-    },
-    "unc-path-regex": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/unc-path-regex/-/unc-path-regex-0.1.2.tgz",
-      "integrity": "sha1-5z3T17DXxe2G+6xrCufYxqadUPo=",
-      "dev": true
-    },
-    "unique-stream": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-1.0.0.tgz",
-      "integrity": "sha1-1ZpKdUJ0R9mqbJHnAmP40mpLEEs=",
-      "dev": true
-    },
-    "user-home": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/user-home/-/user-home-1.1.1.tgz",
-      "integrity": "sha1-K1viOjK2Onyd640PKNSFcko98ZA=",
-      "dev": true
-    },
-    "util-deprecate": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
-      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=",
-      "dev": true
-    },
-    "uuid": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.0.1.tgz",
-      "integrity": "sha1-ZUS7ot/ajBzxfmKaOjBeK7H+5sE=",
-      "dev": true,
-      "optional": true
-    },
-    "v8flags": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/v8flags/-/v8flags-2.1.1.tgz",
-      "integrity": "sha1-qrGh+jDUX4jdMhFIh1rALAtV5bQ=",
-      "dev": true
-    },
-    "validate-npm-package-license": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.1.tgz",
-      "integrity": "sha1-KAS6vnEq0zeUWaz74kdGqywwP7w=",
-      "dev": true
-    },
-    "validator": {
-      "version": "5.7.0",
-      "resolved": "https://registry.npmjs.org/validator/-/validator-5.7.0.tgz",
-      "integrity": "sha1-eoelgUa2laxIYHEUHAxJ1n2gXlw=",
-      "dev": true
-    },
-    "verror": {
-      "version": "1.3.6",
-      "resolved": "https://registry.npmjs.org/verror/-/verror-1.3.6.tgz",
-      "integrity": "sha1-z/XfEpRtKX0rqu+qJoniW+AcAFw=",
-      "dev": true,
-      "optional": true
-    },
-    "vinyl": {
-      "version": "0.5.3",
-      "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.5.3.tgz",
-      "integrity": "sha1-sEVbOPxeDPMNQyUTLkYZcMIJHN4=",
-      "dev": true
-    },
-    "vinyl-fs": {
-      "version": "0.3.14",
-      "resolved": "https://registry.npmjs.org/vinyl-fs/-/vinyl-fs-0.3.14.tgz",
-      "integrity": "sha1-mmhRzhysHBzqX+hsCTHWIMLPqeY=",
-      "dev": true,
-      "dependencies": {
-        "clone": {
-          "version": "0.2.0",
-          "resolved": "https://registry.npmjs.org/clone/-/clone-0.2.0.tgz",
-          "integrity": "sha1-xhJqkK1Pctv1rNskPMN3JP6T/B8=",
-          "dev": true
-        },
-        "graceful-fs": {
-          "version": "3.0.11",
-          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-3.0.11.tgz",
-          "integrity": "sha1-dhPHeKGv6mLyXGMKCG1/Osu92Bg=",
-          "dev": true
-        },
-        "isarray": {
-          "version": "0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
-          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
-          "dev": true
-        },
-        "readable-stream": {
-          "version": "1.0.34",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
-          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=",
-          "dev": true
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
-          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=",
-          "dev": true
-        },
-        "through2": {
-          "version": "0.6.5",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
-          "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg=",
-          "dev": true
-        },
-        "vinyl": {
-          "version": "0.4.6",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.4.6.tgz",
-          "integrity": "sha1-LzVsh6VQolVGHza76ypbqL94SEc=",
-          "dev": true
-        }
-      }
-    },
-    "which": {
-      "version": "1.2.14",
-      "resolved": "https://registry.npmjs.org/which/-/which-1.2.14.tgz",
-      "integrity": "sha1-mofEN48D6CfOyvGs31bHNsAcFOU=",
-      "dev": true
-    },
-    "which-module": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/which-module/-/which-module-1.0.0.tgz",
-      "integrity": "sha1-u6Y8qGGUiZT/MHc2CJ47lgJsKk8=",
-      "dev": true
-    },
-    "wordwrap": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz",
-      "integrity": "sha1-J1hIEIkUVqQXHI0CJkQa3pDLyus=",
-      "dev": true
-    },
-    "wrap-ansi": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
-      "integrity": "sha1-2Pw9KE3QV5T+hJc8rs3Rz4JP3YU=",
-      "dev": true
-    },
-    "wrappy": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
-      "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=",
-      "dev": true
-    },
-    "xtend": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.1.tgz",
-      "integrity": "sha1-pcbVMr5lbiPbgg77lDofBJmNY68=",
-      "dev": true
-    },
-    "y18n": {
-      "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/y18n/-/y18n-3.2.1.tgz",
-      "integrity": "sha1-bRX7qITAhnnA136I53WegR4H+kE=",
-      "dev": true
-    },
-    "yargs": {
-      "version": "6.6.0",
-      "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz",
-      "integrity": "sha1-eC7CHvQDNF+DCoCMo9UTr1YGUgg=",
-      "dev": true
-    },
-    "yargs-parser": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz",
-      "integrity": "sha1-KczqwNxPA8bIe0qfIX3RjJ90hxw=",
-      "dev": true
-    },
-    "z-schema": {
-      "version": "3.17.0",
-      "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-3.17.0.tgz",
-      "integrity": "sha1-RCs4+denr3rke/z8NWhz6GFq0bc=",
-      "dev": true
-    }
-  }
-}
diff --git a/packages/office-ui-fabric-react/webpack.lib.config.js b/packages/office-ui-fabric-react/webpack.lib.config.js
index dd4627e887685..8da3d58b8f788 100644
--- a/packages/office-ui-fabric-react/webpack.lib.config.js
+++ b/packages/office-ui-fabric-react/webpack.lib.config.js
@@ -60,12 +60,16 @@ function createConfig(isProduction) {
   };
 
   if (isProduction) {
-    webpackConfig.plugins.push(new webpack.optimize.UglifyJsPlugin({
-      minimize: true,
-      compress: {
-        warnings: false
-      }
-    }));
+    webpackConfig.plugins.push(
+      new webpack.DefinePlugin({
+        'process.env.NODE_ENV': JSON.stringify('production')
+      }),
+      new webpack.optimize.UglifyJsPlugin({
+        minimize: true,
+        compress: {
+          warnings: false
+        }
+      }));
   }
 
   return webpackConfig;
diff --git a/rush.json b/rush.json
index 6a2859648d2d5..82d8eb5ad17b6 100644
--- a/rush.json
+++ b/rush.json
@@ -63,4 +63,4 @@
       "shouldPublish": false
     }
   ]
-}
+}
\ No newline at end of file

From 6fb5ba32a9aa66ecdbd7ef26ba93910319b737c6 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 12 Jun 2017 01:47:19 +0000
Subject: [PATCH 0090/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 25 +++++++++++
 apps/fabric-website/CHANGELOG.md              |  9 +++-
 apps/fabric-website/package.json              |  4 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../strict-typescript_2017-06-10-01-29.json   | 11 -----
 ...oggle-cursor-pointer_2017-06-09-21-07.json | 11 -----
 ...-props-to-attributes_2017-06-09-20-27.json | 11 -----
 .../strict-typescript_2017-06-10-01-29.json   | 11 -----
 ...oggle-cursor-pointer_2017-06-09-21-07.json | 11 -----
 ...-props-to-attributes_2017-06-09-20-27.json | 11 -----
 .../strict-typescript_2017-06-10-01-29.json   | 11 -----
 ...oggle-cursor-pointer_2017-06-09-21-07.json | 11 -----
 ...-props-to-attributes_2017-06-09-20-27.json | 11 -----
 .../strict-typescript_2017-06-10-01-29.json   | 11 -----
 ...oggle-cursor-pointer_2017-06-09-21-07.json | 11 -----
 ...-props-to-attributes_2017-06-09-20-27.json | 11 -----
 .../fix-minify_2017-06-11-20-33.json          | 11 -----
 .../strict-typescript_2017-06-10-01-29.json   | 11 -----
 ...oggle-cursor-pointer_2017-06-09-21-07.json | 11 -----
 ...-props-to-attributes_2017-06-09-20-27.json | 11 -----
 packages/example-app-base/CHANGELOG.json      | 22 ++++++++++
 packages/example-app-base/CHANGELOG.md        |  9 +++-
 packages/example-app-base/package.json        |  4 +-
 packages/example-component/package.json       |  6 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 42 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 ++++++-
 packages/office-ui-fabric-react/package.json  |  6 +--
 packages/styling/CHANGELOG.json               | 19 +++++++++
 packages/styling/CHANGELOG.md                 |  9 +++-
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 +++++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  2 +-
 35 files changed, 183 insertions(+), 196 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/strict-typescript_2017-06-10-01-29.json
 delete mode 100644 common/changes/@uifabric/example-app-base/toggle-cursor-pointer_2017-06-09-21-07.json
 delete mode 100644 common/changes/@uifabric/example-app-base/types-switch-from-props-to-attributes_2017-06-09-20-27.json
 delete mode 100644 common/changes/@uifabric/fabric-website/strict-typescript_2017-06-10-01-29.json
 delete mode 100644 common/changes/@uifabric/fabric-website/toggle-cursor-pointer_2017-06-09-21-07.json
 delete mode 100644 common/changes/@uifabric/fabric-website/types-switch-from-props-to-attributes_2017-06-09-20-27.json
 delete mode 100644 common/changes/@uifabric/styling/strict-typescript_2017-06-10-01-29.json
 delete mode 100644 common/changes/@uifabric/styling/toggle-cursor-pointer_2017-06-09-21-07.json
 delete mode 100644 common/changes/@uifabric/styling/types-switch-from-props-to-attributes_2017-06-09-20-27.json
 delete mode 100644 common/changes/@uifabric/utilities/strict-typescript_2017-06-10-01-29.json
 delete mode 100644 common/changes/@uifabric/utilities/toggle-cursor-pointer_2017-06-09-21-07.json
 delete mode 100644 common/changes/@uifabric/utilities/types-switch-from-props-to-attributes_2017-06-09-20-27.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-minify_2017-06-11-20-33.json
 delete mode 100644 common/changes/office-ui-fabric-react/strict-typescript_2017-06-10-01-29.json
 delete mode 100644 common/changes/office-ui-fabric-react/toggle-cursor-pointer_2017-06-09-21-07.json
 delete mode 100644 common/changes/office-ui-fabric-react/types-switch-from-props-to-attributes_2017-06-09-20-27.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index e66c52e3a8e75..43e6ef83bbdb1 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,31 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.5.36",
+      "tag": "@uifabric/fabric-website_v4.5.36",
+      "date": "Mon, 12 Jun 2017 01:47:18 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "de7c49d2bd5e85af8d7ae0aee97eb9afd297966d",
+            "comment": "Enable no implicit any in utilities package"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `3.0.0` to `3.0.1`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.1.2 <5.0.0` to `>=4.1.2 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.4.2 <5.0.0` to `>=4.4.2 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.5.35",
       "tag": "@uifabric/fabric-website_v4.5.35",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 3ee5e76cfc0d7..b589fa364e4dd 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Thu, 08 Jun 2017 00:18:05 GMT and should not be manually modified.
+This log was last generated on Mon, 12 Jun 2017 01:47:18 GMT and should not be manually modified.
+
+## 4.5.36
+Mon, 12 Jun 2017 01:47:18 GMT
+
+### Patches
+
+- Enable no implicit any in utilities package
 
 ## 4.5.35
 Thu, 08 Jun 2017 00:18:05 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index d41a4f93ace80..3b40cd0157796 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.5.35",
+  "version": "4.5.36",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,7 +47,7 @@
     "webpack-bundle-analyzer": "^2.2.1"
   },
   "dependencies": {
-    "@uifabric/example-app-base": "3.0.0",
+    "@uifabric/example-app-base": "3.0.1",
     "@uifabric/utilities": ">=4.1.2 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 7c6690ca0b041..3afdb813adb6b 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.4.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.5.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index a0ffb03203af5..581208a43d3af 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.4.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.5.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index b6fdbfea23a6b..5c4b1f795b0ac 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=4.4.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.5.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/@uifabric/example-app-base/strict-typescript_2017-06-10-01-29.json b/common/changes/@uifabric/example-app-base/strict-typescript_2017-06-10-01-29.json
deleted file mode 100644
index 6336d0ba5a779..0000000000000
--- a/common/changes/@uifabric/example-app-base/strict-typescript_2017-06-10-01-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Enable no implicit any in utilities package",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/toggle-cursor-pointer_2017-06-09-21-07.json b/common/changes/@uifabric/example-app-base/toggle-cursor-pointer_2017-06-09-21-07.json
deleted file mode 100644
index 6e9ba724f56cc..0000000000000
--- a/common/changes/@uifabric/example-app-base/toggle-cursor-pointer_2017-06-09-21-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/types-switch-from-props-to-attributes_2017-06-09-20-27.json b/common/changes/@uifabric/example-app-base/types-switch-from-props-to-attributes_2017-06-09-20-27.json
deleted file mode 100644
index 6e9ba724f56cc..0000000000000
--- a/common/changes/@uifabric/example-app-base/types-switch-from-props-to-attributes_2017-06-09-20-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/strict-typescript_2017-06-10-01-29.json b/common/changes/@uifabric/fabric-website/strict-typescript_2017-06-10-01-29.json
deleted file mode 100644
index 3f948499b4b8f..0000000000000
--- a/common/changes/@uifabric/fabric-website/strict-typescript_2017-06-10-01-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Enable no implicit any in utilities package",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/toggle-cursor-pointer_2017-06-09-21-07.json b/common/changes/@uifabric/fabric-website/toggle-cursor-pointer_2017-06-09-21-07.json
deleted file mode 100644
index 477fdb89846cb..0000000000000
--- a/common/changes/@uifabric/fabric-website/toggle-cursor-pointer_2017-06-09-21-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/types-switch-from-props-to-attributes_2017-06-09-20-27.json b/common/changes/@uifabric/fabric-website/types-switch-from-props-to-attributes_2017-06-09-20-27.json
deleted file mode 100644
index 477fdb89846cb..0000000000000
--- a/common/changes/@uifabric/fabric-website/types-switch-from-props-to-attributes_2017-06-09-20-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/strict-typescript_2017-06-10-01-29.json b/common/changes/@uifabric/styling/strict-typescript_2017-06-10-01-29.json
deleted file mode 100644
index 4810bcc145412..0000000000000
--- a/common/changes/@uifabric/styling/strict-typescript_2017-06-10-01-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Enable no implicit any in utilities package",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/toggle-cursor-pointer_2017-06-09-21-07.json b/common/changes/@uifabric/styling/toggle-cursor-pointer_2017-06-09-21-07.json
deleted file mode 100644
index 1e116b37d633c..0000000000000
--- a/common/changes/@uifabric/styling/toggle-cursor-pointer_2017-06-09-21-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/types-switch-from-props-to-attributes_2017-06-09-20-27.json b/common/changes/@uifabric/styling/types-switch-from-props-to-attributes_2017-06-09-20-27.json
deleted file mode 100644
index 1e116b37d633c..0000000000000
--- a/common/changes/@uifabric/styling/types-switch-from-props-to-attributes_2017-06-09-20-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/strict-typescript_2017-06-10-01-29.json b/common/changes/@uifabric/utilities/strict-typescript_2017-06-10-01-29.json
deleted file mode 100644
index a66076080ab1e..0000000000000
--- a/common/changes/@uifabric/utilities/strict-typescript_2017-06-10-01-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Enable no implicit any in utilities package",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/toggle-cursor-pointer_2017-06-09-21-07.json b/common/changes/@uifabric/utilities/toggle-cursor-pointer_2017-06-09-21-07.json
deleted file mode 100644
index eccc273e30dae..0000000000000
--- a/common/changes/@uifabric/utilities/toggle-cursor-pointer_2017-06-09-21-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/types-switch-from-props-to-attributes_2017-06-09-20-27.json b/common/changes/@uifabric/utilities/types-switch-from-props-to-attributes_2017-06-09-20-27.json
deleted file mode 100644
index eccc273e30dae..0000000000000
--- a/common/changes/@uifabric/utilities/types-switch-from-props-to-attributes_2017-06-09-20-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-minify_2017-06-11-20-33.json b/common/changes/office-ui-fabric-react/fix-minify_2017-06-11-20-33.json
deleted file mode 100644
index 5ff25aeb96108..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-minify_2017-06-11-20-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Updating minified bundle to exclude debug warnings.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@hotmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/strict-typescript_2017-06-10-01-29.json b/common/changes/office-ui-fabric-react/strict-typescript_2017-06-10-01-29.json
deleted file mode 100644
index d1c1e8b159f19..0000000000000
--- a/common/changes/office-ui-fabric-react/strict-typescript_2017-06-10-01-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Enable no implicit any in utilities package",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/toggle-cursor-pointer_2017-06-09-21-07.json b/common/changes/office-ui-fabric-react/toggle-cursor-pointer_2017-06-09-21-07.json
deleted file mode 100644
index 091bc2cd6b101..0000000000000
--- a/common/changes/office-ui-fabric-react/toggle-cursor-pointer_2017-06-09-21-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Toggle: add 'cursor: pointer'",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/types-switch-from-props-to-attributes_2017-06-09-20-27.json b/common/changes/office-ui-fabric-react/types-switch-from-props-to-attributes_2017-06-09-20-27.json
deleted file mode 100644
index 2fef18e362d6a..0000000000000
--- a/common/changes/office-ui-fabric-react/types-switch-from-props-to-attributes_2017-06-09-20-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Component properties now extend React.HTMLAttributes, rather than React.HTMLProps",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 014bea7face7c..08652b4c964b0 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "3.0.1",
+      "tag": "@uifabric/example-app-base_v3.0.1",
+      "date": "Mon, 12 Jun 2017 01:47:18 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "de7c49d2bd5e85af8d7ae0aee97eb9afd297966d",
+            "comment": "Enable no implicit any in utilities package"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.7.2 <1.0.0` to `>=0.7.3 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.1.2 <5.0.0` to `>=4.1.2 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "3.0.0",
       "tag": "@uifabric/example-app-base_v3.0.0",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index fcb21bd63f64f..a0b8d5cd8457c 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Thu, 08 Jun 2017 00:18:05 GMT and should not be manually modified.
+This log was last generated on Mon, 12 Jun 2017 01:47:18 GMT and should not be manually modified.
+
+## 3.0.1
+Mon, 12 Jun 2017 01:47:18 GMT
+
+### Patches
+
+- Enable no implicit any in utilities package
 
 ## 3.0.0
 Thu, 08 Jun 2017 00:18:05 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 6feb27e00660e..b949a84192da1 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "3.0.0",
+  "version": "3.0.1",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -40,7 +40,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.7.2 <1.0.0",
+    "@uifabric/styling": ">=0.7.3 <1.0.0",
     "@uifabric/utilities": ">=4.1.2 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index cb918d9219ba0..573a843754482 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -21,8 +21,8 @@
     "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "3.0.0",
-    "@uifabric/utilities": "4.1.2",
+    "@uifabric/example-app-base": "3.0.1",
+    "@uifabric/utilities": "4.2.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.4.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.5.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 9254db031de53..0d375df8d87dc 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,48 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.5.0",
+      "tag": "office-ui-fabric-react_v4.5.0",
+      "date": "Mon, 12 Jun 2017 01:47:18 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "4629fbd8565a845375b025a15bda92f02792c4fd",
+            "comment": "Updating minified bundle to exclude debug warnings."
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "de7c49d2bd5e85af8d7ae0aee97eb9afd297966d",
+            "comment": "Enable no implicit any in utilities package"
+          },
+          {
+            "author": "Michael Loughry <miclo@microsoft.com>",
+            "commit": "b2026ec598638fc1a6f179326cdaca230b699882",
+            "comment": "Toggle: add 'cursor: pointer'"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Michael Loughry <miclo@microsoft.com>",
+            "commit": "9273411491a3c88f5a55b8b979d708d6cd8bf59c",
+            "comment": "Component properties now extend React.HTMLAttributes, rather than React.HTMLProps"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.1.2 <5.0.0` to `>=4.1.2 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.7.2 <1.0.0` to `>=0.7.3 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `3.0.0` to `3.0.1`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.4.2",
       "tag": "office-ui-fabric-react_v4.4.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 702e373faf416..c90548dc78575 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 08 Jun 2017 10:20:07 GMT and should not be manually modified.
+This log was last generated on Mon, 12 Jun 2017 01:47:18 GMT and should not be manually modified.
+
+## 4.5.0
+Mon, 12 Jun 2017 01:47:18 GMT
+
+### Minor changes
+
+- Component properties now extend React.HTMLAttributes, rather than React.HTMLProps
+
+### Patches
+
+- Updating minified bundle to exclude debug warnings.
+- Enable no implicit any in utilities package
+- Toggle: add 'cursor: pointer'
 
 ## 4.4.2
 Thu, 08 Jun 2017 10:20:07 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 17986bb38d5b4..da8ddd3719fbb 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.4.2",
+  "version": "4.5.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "^2.2.2",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "3.0.0",
+    "@uifabric/example-app-base": "3.0.1",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.1.2 <5.0.0",
-    "@uifabric/styling": ">=0.7.2 <1.0.0",
+    "@uifabric/styling": ">=0.7.3 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index ccd7cced26cbf..f8863ed432caf 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.7.3",
+      "tag": "@uifabric/styling_v0.7.3",
+      "date": "Mon, 12 Jun 2017 01:47:18 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "de7c49d2bd5e85af8d7ae0aee97eb9afd297966d",
+            "comment": "Enable no implicit any in utilities package"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.1.2 <5.0.0` to `>=4.1.2 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.7.2",
       "tag": "@uifabric/styling_v0.7.2",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 2e92533a2e2cc..91130f26322fd 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 09 Jun 2017 10:10:47 GMT and should not be manually modified.
+This log was last generated on Mon, 12 Jun 2017 01:47:18 GMT and should not be manually modified.
+
+## 0.7.3
+Mon, 12 Jun 2017 01:47:18 GMT
+
+### Patches
+
+- Enable no implicit any in utilities package
 
 ## 0.7.2
 Fri, 09 Jun 2017 10:10:47 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index fad4db689ccfe..6f0280a933519 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.7.2",
+  "version": "0.7.3",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index b826b10ec5427..6048be86463b8 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.2.0",
+      "tag": "@uifabric/utilities_v4.2.0",
+      "date": "Mon, 12 Jun 2017 01:47:18 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "de7c49d2bd5e85af8d7ae0aee97eb9afd297966d",
+            "comment": "Enable no implicit any in utilities package"
+          }
+        ]
+      }
+    },
     {
       "version": "4.1.2",
       "tag": "@uifabric/utilities_v4.1.2",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index e9d85faf0022f..bf4b0cb3cca75 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Thu, 08 Jun 2017 00:18:05 GMT and should not be manually modified.
+This log was last generated on Mon, 12 Jun 2017 01:47:18 GMT and should not be manually modified.
+
+## 4.2.0
+Mon, 12 Jun 2017 01:47:18 GMT
+
+### Minor changes
+
+- Enable no implicit any in utilities package
 
 ## 4.1.2
 Thu, 08 Jun 2017 00:18:05 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index c879c12efc2af..051da41bc9e3a 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.1.2",
+  "version": "4.2.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 363f27b27ad03a72718431e8977c2f3bee15182d Mon Sep 17 00:00:00 2001
From: Mike Wheaton <miwhea@microsoft.com>
Date: Mon, 12 Jun 2017 08:40:32 -0700
Subject: [PATCH 0091/1641] Website: Update dev.office.com header (#1966)

* Use Fabric Core 7.1.0 for the website

* Adjust position of caret's in header so that they spin around central axis

* Update to latest icon font from dev.office.com for header and move outside out :global{} to fix build issue

* Remove a u- prefix that was missed earlier

* Update dev.office.com header with the latest navigation links

* Add change file
---
 .../src/components/DOIcon/DOIcon.scss         | 24 +++----
 .../components/DONavigation/DONavigation.scss |  8 ++-
 .../components/DONavigation/DONavigation.tsx  |  2 +-
 .../src/data/DONavigationLinkData.json        | 62 +++++++++++--------
 apps/fabric-website/src/root.tsx              |  2 +-
 ...ebsite-update-header_2017-06-09-19-15.json | 11 ++++
 6 files changed, 65 insertions(+), 44 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json

diff --git a/apps/fabric-website/src/components/DOIcon/DOIcon.scss b/apps/fabric-website/src/components/DOIcon/DOIcon.scss
index a0cbfa7bffe19..3f5c726a803c9 100644
--- a/apps/fabric-website/src/components/DOIcon/DOIcon.scss
+++ b/apps/fabric-website/src/components/DOIcon/DOIcon.scss
@@ -1,12 +1,11 @@
-:global {
-  @font-face {
-    font-family: 'devoffice-product';
-    src:url("../Content/Fonts/devoffice-products/devoffice-product.eot");
-    src:url("../Content/Fonts/devoffice-products/devoffice-product.eot?#iefix") format("embedded-opentype"), url('data:application/octet-stream;base64,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') format("truetype"),url("../Content/Fonts/devoffice-products/devoffice-product.svg?#devoffice-product") format("svg");
-    font-weight:normal;
-    font-style:normal
-  }
+@font-face{
+  font-family: 'devoffice-product';
+  src: url('data:application/octet-stream;base64,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') format('truetype');
+  font-weight:normal;
+  font-style:normal
+}
 
+:global {
   .od-Icon {
     -moz-osx-font-smoothing: grayscale;
     -webkit-font-smoothing: antialiased;
@@ -54,15 +53,8 @@
   .od-Icon--yammer:before {
       content: ""
   }
-  // @todo: If the Microsoft Teams logo is added to the 'devoffice-product' font, this inline SVG won't be necessary.
   .od-Icon--microsoftTeams:before {
-      background: url("data:image/svg+xml,%3Csvg%20id%3D%22Layer_1%22%20data-name%3D%22Layer%201%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2030%2030%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23fff%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3ETeams_Logo_Only_White_Small%3C%2Ftitle%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M38%2C18.5a2.43288%2C2.43288%2C0%2C0%2C1-.19531.97168%2C2.51908%2C2.51908%2C0%2C0%2C1-1.333%2C1.333%2C2.51471%2C2.51471%2C0%2C0%2C1-1.94336%2C0%2C2.51908%2C2.51908%2C0%2C0%2C1-1.333-1.333%2C2.51471%2C2.51471%2C0%2C0%2C1%2C0-1.94336%2C2.51908%2C2.51908%2C0%2C0%2C1%2C1.333-1.333%2C2.51471%2C2.51471%2C0%2C0%2C1%2C1.94336%2C0%2C2.51908%2C2.51908%2C0%2C0%2C1%2C1.333%2C1.333A2.43288%2C2.43288%2C0%2C0%2C1%2C38%2C18.5Z%22%20transform%3D%22translate(-8%20-8)%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M38%2C27.40234a2.09377%2C2.09377%2C0%2C0%2C1-.35645%2C1.25%2C2.70805%2C2.70805%2C0%2C0%2C1-.90332.80078%2C3.95932%2C3.95932%2C0%2C0%2C1-1.21094.4248A7.07568%2C7.07568%2C0%2C0%2C1%2C34.25%2C30H33V22.5h5v4.90234Z%22%20transform%3D%22translate(-8%20-8)%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M31.29272%2C16.03729a2.51286%2C2.51286%2C0%2C0%2C0-1.32959-1.32953%2C2.50863%2C2.50863%2C0%2C0%2C0-1.93829%2C0%2C2.51987%2C2.51987%2C0%2C0%2C0-.79407.53571A0.60652%2C0.60652%2C0%2C0%2C0%2C27%2C15.52289v2.96716a0.60652%2C0.60652%2C0%2C0%2C0%2C.23077.27942%2C2.51831%2C2.51831%2C0%2C0%2C0%2C.79395.53571%2C2.50813%2C2.50813%2C0%2C0%2C0%2C1.93839%2C0%2C2.51286%2C2.51286%2C0%2C0%2C0%2C1.32961-1.32953A2.50878%2C2.50878%2C0%2C0%2C0%2C31.29272%2C16.03729Z%22%20transform%3D%22translate(-8%20-8)%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M27%2C21V31.967a0.45182%2C0.45182%2C0%2C0%2C0%2C.19128.08917%2C4.08179%2C4.08179%2C0%2C0%2C0%2C.75549.18018%2C5.34007%2C5.34007%2C0%2C0%2C0%2C.73816.05359%2C5.56675%2C5.56675%2C0%2C0%2C0%2C1.131-.12177%2C3.31069%2C3.31069%2C0%2C0%2C0%2C1.07045-.41882%2C2.46692%2C2.46692%2C0%2C0%2C0%2C.79853-0.79382A2.28623%2C2.28623%2C0%2C0%2C0%2C32%2C29.7088V21H27Z%22%20transform%3D%22translate(-8%20-8)%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M8%2C12V34l18%2C4V8Zm13%2C7.47089-3.40625.15491v9.73676L15%2C29.2369V19.74141l-3%2C.10527V17.489l9-.5705v2.55237Z%22%20transform%3D%22translate(-8%20-8)%22%2F%3E%3C%2Fsvg%3E") center center no-repeat;
-      background-color: #5558AF;
-      background-size: 16px 16px;
-      content: "";
-      display: block;
-      height: 100%;
-      width: 100%;
+    content: "";
   }
   .od-Icon--android:before {
       content: ""
diff --git a/apps/fabric-website/src/components/DONavigation/DONavigation.scss b/apps/fabric-website/src/components/DONavigation/DONavigation.scss
index a53bfd6d6c9c0..c2afcfab0bfde 100644
--- a/apps/fabric-website/src/components/DONavigation/DONavigation.scss
+++ b/apps/fabric-website/src/components/DONavigation/DONavigation.scss
@@ -29,6 +29,12 @@ $od-Navigation-columnPadding: 30px;
     background-color: $ms-color-black;
     vertical-align: top;
 
+    .ms-Icon {
+      height: auto;
+      position: relative;
+      top: -4px;
+    }
+
     &.is-open {
       .od-Navigation-link {
         background-color: $ms-color-neutralPrimaryAlt;
@@ -67,7 +73,7 @@ $od-Navigation-columnPadding: 30px;
 
     @media (min-width: $od-Header-bannerWidth) {
       position: fixed;
-      top: 50px;
+      top: $od-Header-height;
       left: 0;
       height: 404px;
     }
diff --git a/apps/fabric-website/src/components/DONavigation/DONavigation.tsx b/apps/fabric-website/src/components/DONavigation/DONavigation.tsx
index e56da4d563c1d..8f44764787421 100644
--- a/apps/fabric-website/src/components/DONavigation/DONavigation.tsx
+++ b/apps/fabric-website/src/components/DONavigation/DONavigation.tsx
@@ -94,7 +94,7 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
               <div className='od-Navigation-subMenuItems'>
                 <div className='ms-Grid'>
                   <div className='ms-Grid-row'>
-                    <div className='ms-Grid-col ms-u-xl3 ms-sm12 od-Navigation-menuFirstColumn'>
+                    <div className='ms-Grid-col ms-xl3 ms-sm12 od-Navigation-menuFirstColumn'>
                       { this._getLinks(links.exploreLinks.firstMenuColumn) }
                     </div>
                     <div className='ms-Grid-col ms-xl3 ms-sm12  od-Navigation-menuSecondColumn'>
diff --git a/apps/fabric-website/src/data/DONavigationLinkData.json b/apps/fabric-website/src/data/DONavigationLinkData.json
index a41ab4d4d37fa..10d0c250df3b8 100644
--- a/apps/fabric-website/src/data/DONavigationLinkData.json
+++ b/apps/fabric-website/src/data/DONavigationLinkData.json
@@ -1,27 +1,39 @@
 {
   "exploreLinks": {
-    "firstMenuColumn":  [
+    "firstMenuColumn": [
       {
         "label": "Why Office?",
-        "href": "http://dev.office.com/opportunity"
+        "href": "https://dev.office.com/opportunity"
       },
       {
         "label": "Office UI Fabric",
-        "href": "http://dev.office.com/fabric"
+        "href": "https://dev.office.com/fabric"
       },
       {
         "label": "Microsoft Graph",
-        "href": "http://graph.microsoft.io/"
+        "href": "https://developer.microsoft.com/graph"
       },
       {
         "label": "Better with Office",
-        "href": "http://betterwith.office.com/"
+        "href": "https://betterwith.office.com/"
+      },
+      {
+        "label": "Go To Market",
+        "href": "https://dev.office.com/go-to-market"
+      },
+      {
+        "label": "Industry Verticals",
+        "href": "https://dev.office.com/industry-verticals"
+      },
+      {
+        "label": "Business Platform",
+        "href": "https://businessplatform.microsoft.com/"
       }
     ],
     "secondMenuColumn": [
       {
         "label": "Word",
-        "href": "http://dev.office.com/word",
+        "href": "https://dev.office.com/word",
         "icon": {
           "iconClass": "word",
           "bgColor": "blue"
@@ -29,7 +41,7 @@
       },
       {
         "label": "Excel",
-        "href": "http://dev.office.com/excel",
+        "href": "https://dev.office.com/excel",
         "icon": {
           "iconClass": "excel",
           "bgColor": "green"
@@ -37,7 +49,7 @@
       },
       {
         "label": "PowerPoint",
-        "href": "http://dev.office.com/powerpoint",
+        "href": "https://dev.office.com/powerpoint",
         "icon": {
           "iconClass": "powerpoint",
           "bgColor": "orangeLight"
@@ -45,7 +57,7 @@
       },
       {
         "label": "Outlook",
-        "href": "http://dev.outlook.com/",
+        "href": "https://dev.outlook.com/",
         "icon": {
           "iconClass": "outlook",
           "bgColor": "blue"
@@ -53,7 +65,7 @@
       },
       {
         "label": "OneDrive",
-        "href": "http://dev.onedrive.com/",
+        "href": "https://dev.onedrive.com/",
         "icon": {
           "iconClass": "onedrive",
           "bgColor": "blue"
@@ -61,7 +73,7 @@
       },
       {
         "label": "OneNote",
-        "href": "http://dev.onenote.com/",
+        "href": "https://dev.onenote.com/",
         "icon": {
           "iconClass": "onenote",
           "bgColor": "magenta"
@@ -69,7 +81,7 @@
       },
       {
         "label": "SharePoint",
-        "href": "https://msdn.microsoft.com/en-us/library/office/dn833469.aspx",
+        "href": "https://dev.office.com/sharepoint",
         "icon": {
           "iconClass": "sharepoint",
           "bgColor": "blueLight"
@@ -77,7 +89,7 @@
       },
       {
         "label": "Skype",
-        "href": "http://dev.office.com/skype",
+        "href": "https://dev.office.com/skype",
         "icon": {
           "iconClass": "skype",
           "bgColor": "blueLight"
@@ -85,7 +97,7 @@
       },
       {
         "label": "Access",
-        "href": "https://msdn.microsoft.com/en-us/library/office/dn605890.aspx",
+        "href": "https://msdn.microsoft.com/en-us/library/office/fp179695.aspx",
         "icon": {
           "iconClass": "access",
           "bgColor": "redDark"
@@ -93,7 +105,7 @@
       },
       {
         "label": "Project",
-        "href": "https://msdn.microsoft.com/en-us/library/office/ms512767.aspx",
+        "href": "https://dev.office.com/project",
         "icon": {
           "iconClass": "project",
           "bgColor": "teal"
@@ -101,7 +113,7 @@
       },
       {
         "label": "Yammer",
-        "href": "http://dev.yammer.com/",
+        "href": "https://dev.yammer.com/",
         "icon": {
           "iconClass": "yammer",
           "bgColor": "blue"
@@ -112,28 +124,28 @@
         "href": "https://dev.office.com/microsoft-teams",
         "icon": {
           "iconClass": "microsoftTeams",
-          "bgColor": ""
+          "bgColor": "blue"
         }
       }
     ],
     "thirdMenuColumn": [
       {
         "label": "Android",
-        "href": "http://dev.office.com/android",
+        "href": "https://dev.office.com/android",
         "icon": {
           "iconClass": "android"
         }
       },
       {
         "label": "ASP .NET",
-        "href": "http://dev.office.com/asp-dot-net",
+        "href": "https://dev.office.com/asp-dot-net",
         "icon": {
           "iconClass": "aspnet"
         }
       },
       {
         "label": "iOS",
-        "href": "http://dev.office.com/ios",
+        "href": "https://dev.office.com/ios",
         "icon": {
           "iconClass": "ios",
           "bgColor": ""
@@ -141,35 +153,35 @@
       },
       {
         "label": "JavaScript",
-        "href": "http://dev.office.com/js",
+        "href": "https://dev.office.com/js",
         "icon": {
           "iconClass": "javascript"
         }
       },
       {
         "label": "Node.js",
-        "href": "http://dev.office.com/node",
+        "href": "https://dev.office.com/node",
         "icon": {
           "iconClass": "node"
         }
       },
       {
         "label": "PHP (coming soon)",
-        "href": "https://graph.microsoft.io/getting-started",
+        "href": "https://developer.microsoft.com/graph/quick-start",
         "icon": {
           "iconClass": "php"
         }
       },
       {
         "label": "Python (coming soon)",
-        "href": "https://graph.microsoft.io/getting-started",
+        "href": "https://developer.microsoft.com/graph/quick-start",
         "icon": {
           "iconClass": "python"
         }
       },
       {
         "label": "Ruby (coming soon)",
-        "href": "https://graph.microsoft.io/getting-started",
+        "href": "https://developer.microsoft.com/graph/quick-start",
         "icon": {
           "iconClass": "ruby"
         }
diff --git a/apps/fabric-website/src/root.tsx b/apps/fabric-website/src/root.tsx
index f6b5de06fdd01..29129cf7419e5 100644
--- a/apps/fabric-website/src/root.tsx
+++ b/apps/fabric-website/src/root.tsx
@@ -134,4 +134,4 @@ function addCSSToHeader(fileName) {
   linkEl.href = fileName
   headEl.appendChild(linkEl)
 }
-addCSSToHeader('https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/5.1.0/css/fabric.min.css')
\ No newline at end of file
+addCSSToHeader('https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/7.1.0/css/fabric.min.css')
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json b/common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json
new file mode 100644
index 0000000000000..ca46d03d32883
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Fix issues with dev.office.com header",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "miwhea@microsoft.com"
+}
\ No newline at end of file

From ad380fe066085c6e3b3448029fe58187ab503d65 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Mon, 12 Jun 2017 08:40:53 -0700
Subject: [PATCH 0092/1641] Make sure the quote rule is enabled for tsline
 (#1961)

---
 packages/office-ui-fabric-react-tslint/tslint.json | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/office-ui-fabric-react-tslint/tslint.json b/packages/office-ui-fabric-react-tslint/tslint.json
index 495fcbff25dbd..1ce8cc1f7b45d 100644
--- a/packages/office-ui-fabric-react-tslint/tslint.json
+++ b/packages/office-ui-fabric-react-tslint/tslint.json
@@ -20,6 +20,7 @@
     ],
     "prefer-const": false,
     "quotemark": [
+      true,
       "single"
     ],
     "no-inferrable-types": [

From b0ee1f6c9e5f0d9b31c060d92998e0c43af504d4 Mon Sep 17 00:00:00 2001
From: Aditya <adimittal91@gmail.com>
Date: Mon, 12 Jun 2017 21:13:53 +0530
Subject: [PATCH 0093/1641] With responsive mode error (#1956)

* withResponsiveMode: Adding error handling around the case where window.innerWidth throws an exception

* adding change log file

* Create withResponsiveMode.tsx
---
 .../withResponsiveModeError_2017-06-08-12-44.json     | 11 +++++++++++
 .../src/utilities/decorators/withResponsiveMode.tsx   |  9 +++++++--
 2 files changed, 18 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/withResponsiveModeError_2017-06-08-12-44.json

diff --git a/common/changes/office-ui-fabric-react/withResponsiveModeError_2017-06-08-12-44.json b/common/changes/office-ui-fabric-react/withResponsiveModeError_2017-06-08-12-44.json
new file mode 100644
index 0000000000000..d1aee3540cd18
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/withResponsiveModeError_2017-06-08-12-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "withResponsiveMode: Adding error handling around the case where window.innerWidth throws an exception.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "admitt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx b/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx
index 85c0318046908..3680f2b278c72 100644
--- a/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx
@@ -75,8 +75,13 @@ export function withResponsiveMode<P extends { responsiveMode?: ResponsiveMode }
       let win = getWindow();
 
       if (typeof win !== 'undefined') {
-        while (win.innerWidth > RESPONSIVE_MAX_CONSTRAINT[responsiveMode]) {
-          responsiveMode++;
+        try {
+          while (win.innerWidth > RESPONSIVE_MAX_CONSTRAINT[responsiveMode]) {
+            responsiveMode++;
+          }
+        } catch (e) {
+          // Return a best effort result in cases where we're in the browser but it throws on getting innerWidth.
+          responsiveMode = ResponsiveMode.large;
         }
       } else {
         if (_defaultMode !== undefined) {

From b0fa51097fde734c930c0b03cc43d63ff2704da0 Mon Sep 17 00:00:00 2001
From: Manish Dahamiwal <mdhamiwal@gmail.com>
Date: Tue, 13 Jun 2017 09:04:31 +0530
Subject: [PATCH 0094/1641] Firefox: HighContrast fixes: Pivot, Checkbox and
 choicegroup (#1962)

Firefox: HighContrast fixes: Pivot, Checkbox and choicegroup
---
 ...ox-highcontrastfixes_2017-06-09-10-44.json | 11 ++++++++++
 .../src/components/Checkbox/Checkbox.scss     | 20 ++++++++-----------
 .../components/ChoiceGroup/ChoiceGroup.scss   | 16 ++++-----------
 .../src/components/Pivot/Pivot.scss           |  9 ++++-----
 4 files changed, 27 insertions(+), 29 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/firefox-highcontrastfixes_2017-06-09-10-44.json

diff --git a/common/changes/office-ui-fabric-react/firefox-highcontrastfixes_2017-06-09-10-44.json b/common/changes/office-ui-fabric-react/firefox-highcontrastfixes_2017-06-09-10-44.json
new file mode 100644
index 0000000000000..986718c5404c2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/firefox-highcontrastfixes_2017-06-09-10-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "High contrast fixes for Pivot, Choicegroup and Checkbox",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "manishda@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.scss b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.scss
index c02ce06b859db..e3d7cba22b2e4 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.scss
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.scss
@@ -136,7 +136,7 @@ $ms-checkbox-highContrast-iconBoxSize: 16px;
   //
   &.labelIsChecked {
     &::before {
-      border: 10px solid $ms-color-themePrimary;
+      border: 1px solid $ms-color-themePrimary;
       background-color: $ms-color-themePrimary;
 
       @media screen and (-ms-high-contrast: active), (-ms-high-contrast: black-on-white) {
@@ -156,10 +156,13 @@ $ms-checkbox-highContrast-iconBoxSize: 16px;
       @include highContrast-border($ms-color-white, $ms-color-black);
     }
 
-    &:hover,
-    &:focus {
-      &::before {
-        border-color: $ms-color-themeDarkAlt;
+    &:not(.labelIsDisabled) {
+      &:hover,
+      &:focus {
+        &::before {
+          border-color: $ms-color-themeDarkAlt;
+          background-color: $ms-color-themeDarkAlt;
+        }
       }
     }
   }
@@ -169,13 +172,6 @@ $ms-checkbox-highContrast-iconBoxSize: 16px;
   &.labelIsDisabled {
     cursor: default;
 
-    &:hover,
-    &:focus {
-      &::before {
-        border-color: $ms-color-neutralTertiaryAlt;
-      }
-    }
-
     &::before {
       background-color: $ms-color-neutralTertiaryAlt;
       border-color: $ms-color-neutralTertiaryAlt;
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
index ecf5a710c3152..3311805c3ea72 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
@@ -95,18 +95,10 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
   position: absolute;
   @include ms-left($ms-choiceField-field-size / 2);
   @include ms-right(0);
-  transition-property: top, left, right, width, height;
+  transition-property: border-width;
   transition-duration: $ms-choiceField-transition-duration-inner;
   transition-timing-function: $ms-choiceField-transition-timing;
   box-sizing: border-box;
-
-  @media screen and (-ms-high-contrast: active) {
-    color: $ms-color-contrastBlackDisabled;
-  }
-
-  @media screen and (-ms-high-contrast: black-on-white) {
-    color: $ms-color-contrastWhiteDisabled;
-  }
 }
 
 .field {
@@ -144,18 +136,18 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
     }
 
     &::after { // the dot
-      background-color: $radioButton-dot-color;
+      border: 5px solid $radioButton-dot-color;
       top: 4px;
       @include ms-left(5px);
       width: 10px;
       height: 10px;
 
       @media screen and (-ms-high-contrast: active) {
-        background-color: $ms-color-contrastBlackSelected;
+        border-color: $ms-color-contrastBlackSelected;
       }
 
       @media screen and (-ms-high-contrast: black-on-white) {
-        background-color: $ms-color-contrastWhiteSelected;
+        border-color: $ms-color-contrastWhiteSelected;
       }
     }
 
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.scss b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.scss
index 3a2e67a687b62..d77255b1575f8 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.scss
+++ b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.scss
@@ -92,16 +92,15 @@
 
     // Show the underline
     &::before {
-      background-color: $ms-color-themePrimary;
+      box-sizing: border-box;
+      border-bottom: 2px solid $ms-color-themePrimary;
 
       @media screen and (-ms-high-contrast: active) {
-        background-color: transparent;
-        border-bottom: 2px solid $ms-color-white;
+        border-bottom-color: $ms-color-white;
       }
 
       @media screen and (-ms-high-contrast: black-on-white) {
-        background-color: transparent;
-        border-bottom: 2px solid $ms-color-black;
+        border-bottom-color: $ms-color-black;
       }
     }
   }

From 2d4d596a525158da7b1fd767bc0d5fe9f5e79088 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 13 Jun 2017 10:13:21 +0000
Subject: [PATCH 0095/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 19 +++++++++++++++
 apps/fabric-website/CHANGELOG.md              |  9 ++++++-
 apps/fabric-website/package.json              |  4 ++--
 ...ebsite-update-header_2017-06-09-19-15.json | 11 ---------
 ...ox-highcontrastfixes_2017-06-09-10-44.json | 11 ---------
 ...hResponsiveModeError_2017-06-08-12-44.json | 11 ---------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 24 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++++-
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/CHANGELOG.json               |  6 +++++
 packages/styling/CHANGELOG.md                 |  7 +++++-
 packages/styling/package.json                 |  2 +-
 14 files changed, 79 insertions(+), 43 deletions(-)
 delete mode 100644 common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json
 delete mode 100644 common/changes/office-ui-fabric-react/firefox-highcontrastfixes_2017-06-09-10-44.json
 delete mode 100644 common/changes/office-ui-fabric-react/withResponsiveModeError_2017-06-08-12-44.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 43e6ef83bbdb1..594741024caed 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.5.37",
+      "tag": "@uifabric/fabric-website_v4.5.37",
+      "date": "Tue, 13 Jun 2017 10:13:21 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Mike Wheaton <miwhea@microsoft.com>",
+            "commit": "363f27b27ad03a72718431e8977c2f3bee15182d",
+            "comment": "Fix issues with dev.office.com header"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.4.2 <5.0.0` to `>=4.5.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.5.36",
       "tag": "@uifabric/fabric-website_v4.5.36",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index b589fa364e4dd..62c9b0d4fa763 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Mon, 12 Jun 2017 01:47:18 GMT and should not be manually modified.
+This log was last generated on Tue, 13 Jun 2017 10:13:21 GMT and should not be manually modified.
+
+## 4.5.37
+Tue, 13 Jun 2017 10:13:21 GMT
+
+### Patches
+
+- Fix issues with dev.office.com header
 
 ## 4.5.36
 Mon, 12 Jun 2017 01:47:18 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 3b40cd0157796..e05806f0aec58 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.5.36",
+  "version": "4.5.37",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
-    "office-ui-fabric-react": ">=4.4.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.5.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json b/common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json
deleted file mode 100644
index ca46d03d32883..0000000000000
--- a/common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Fix issues with dev.office.com header",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "miwhea@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/firefox-highcontrastfixes_2017-06-09-10-44.json b/common/changes/office-ui-fabric-react/firefox-highcontrastfixes_2017-06-09-10-44.json
deleted file mode 100644
index 986718c5404c2..0000000000000
--- a/common/changes/office-ui-fabric-react/firefox-highcontrastfixes_2017-06-09-10-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "High contrast fixes for Pivot, Choicegroup and Checkbox",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "manishda@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/withResponsiveModeError_2017-06-08-12-44.json b/common/changes/office-ui-fabric-react/withResponsiveModeError_2017-06-08-12-44.json
deleted file mode 100644
index d1aee3540cd18..0000000000000
--- a/common/changes/office-ui-fabric-react/withResponsiveModeError_2017-06-08-12-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "withResponsiveMode: Adding error handling around the case where window.innerWidth throws an exception.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "admitt@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index b949a84192da1..32d001a4e7e95 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -40,7 +40,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.7.3 <1.0.0",
+    "@uifabric/styling": ">=0.7.4 <1.0.0",
     "@uifabric/utilities": ">=4.1.2 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.0.0 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 573a843754482..f67e9fea40b90 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.5.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.5.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 0d375df8d87dc..f5907ab3e42a8 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.5.1",
+      "tag": "office-ui-fabric-react_v4.5.1",
+      "date": "Tue, 13 Jun 2017 10:13:21 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Manish Dahamiwal <mdhamiwal@gmail.com>",
+            "commit": "b0fa51097fde734c930c0b03cc43d63ff2704da0",
+            "comment": "High contrast fixes for Pivot, Choicegroup and Checkbox"
+          },
+          {
+            "author": "Aditya <adimittal91@gmail.com>",
+            "commit": "b0ee1f6c9e5f0d9b31c060d92998e0c43af504d4",
+            "comment": "withResponsiveMode: Adding error handling around the case where window.innerWidth throws an exception."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.7.3 <1.0.0` to `>=0.7.4 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.5.0",
       "tag": "office-ui-fabric-react_v4.5.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index c90548dc78575..ba768e02ef5eb 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 12 Jun 2017 01:47:18 GMT and should not be manually modified.
+This log was last generated on Tue, 13 Jun 2017 10:13:21 GMT and should not be manually modified.
+
+## 4.5.1
+Tue, 13 Jun 2017 10:13:21 GMT
+
+### Patches
+
+- High contrast fixes for Pivot, Choicegroup and Checkbox
+- withResponsiveMode: Adding error handling around the case where window.innerWidth throws an exception.
 
 ## 4.5.0
 Mon, 12 Jun 2017 01:47:18 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index da8ddd3719fbb..8519614f8c58d 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.5.0",
+  "version": "4.5.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.1.2 <5.0.0",
-    "@uifabric/styling": ">=0.7.3 <1.0.0",
+    "@uifabric/styling": ">=0.7.4 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index f8863ed432caf..ddd343dc5b4b7 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.7.4",
+      "tag": "@uifabric/styling_v0.7.4",
+      "date": "Tue, 13 Jun 2017 10:13:21 GMT",
+      "comments": {}
+    },
     {
       "version": "0.7.3",
       "tag": "@uifabric/styling_v0.7.3",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 91130f26322fd..624633c3149a0 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Mon, 12 Jun 2017 01:47:18 GMT and should not be manually modified.
+This log was last generated on Tue, 13 Jun 2017 10:13:21 GMT and should not be manually modified.
+
+## 0.7.4
+Tue, 13 Jun 2017 10:13:21 GMT
+
+*Changes not tracked*
 
 ## 0.7.3
 Mon, 12 Jun 2017 01:47:18 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 6f0280a933519..d4fab1322ef4b 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.7.3",
+  "version": "0.7.4",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From a07c7287aeec78d8f17712551f94d3af55031592 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Tue, 13 Jun 2017 09:42:14 -0700
Subject: [PATCH 0096/1641] Enable --strictNullChecks compiler flag in
 Utilities Package (#1976)

* fix issues in async.ts

* Fix base component issues

* More fixes

* dom.ts fixes

* More fixes

* Fix more issues

* Api changes

* Rush change

* Make getItem required for createArray.
---
 ...tilities-strict-null_2017-06-12-16-27.json | 11 ++++++
 ...tilities-strict-null_2017-06-12-16-27.json | 11 ++++++
 ...tilities-strict-null_2017-06-12-16-27.json | 11 ++++++
 ...tilities-strict-null_2017-06-12-16-27.json | 11 ++++++
 ...tilities-strict-null_2017-06-12-16-27.json | 11 ++++++
 packages/utilities/api/utilities.api.ts       | 34 +++++++++----------
 packages/utilities/src/Async.ts               | 13 ++++---
 packages/utilities/src/AutoScroll.ts          | 13 +++++--
 packages/utilities/src/BaseComponent.test.tsx |  4 +--
 packages/utilities/src/BaseComponent.ts       |  9 +++--
 packages/utilities/src/DelayedRender.tsx      |  4 ++-
 packages/utilities/src/EventGroup.ts          | 26 +++++++-------
 packages/utilities/src/array.ts               |  2 +-
 packages/utilities/src/autobind.ts            |  4 +--
 packages/utilities/src/dom.ts                 | 14 ++++----
 packages/utilities/src/focus.ts               | 30 +++++++++-------
 packages/utilities/src/initials.ts            |  2 +-
 packages/utilities/src/language.ts            |  4 +--
 packages/utilities/src/memoize.ts             |  6 ++--
 packages/utilities/src/rtl.ts                 |  4 +--
 packages/utilities/src/scroll.ts              |  4 +--
 packages/utilities/src/warn.test.ts           |  4 +--
 packages/utilities/src/warn.ts                | 13 ++++---
 packages/utilities/tsconfig.json              |  1 +
 24 files changed, 162 insertions(+), 84 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/utilities-strict-null_2017-06-12-16-27.json
 create mode 100644 common/changes/@uifabric/fabric-website/utilities-strict-null_2017-06-12-16-27.json
 create mode 100644 common/changes/@uifabric/styling/utilities-strict-null_2017-06-12-16-27.json
 create mode 100644 common/changes/@uifabric/utilities/utilities-strict-null_2017-06-12-16-27.json
 create mode 100644 common/changes/office-ui-fabric-react/utilities-strict-null_2017-06-12-16-27.json

diff --git a/common/changes/@uifabric/example-app-base/utilities-strict-null_2017-06-12-16-27.json b/common/changes/@uifabric/example-app-base/utilities-strict-null_2017-06-12-16-27.json
new file mode 100644
index 0000000000000..e807ce07d1d8c
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/utilities-strict-null_2017-06-12-16-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/utilities-strict-null_2017-06-12-16-27.json b/common/changes/@uifabric/fabric-website/utilities-strict-null_2017-06-12-16-27.json
new file mode 100644
index 0000000000000..cbeaf5c6e2864
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/utilities-strict-null_2017-06-12-16-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/utilities-strict-null_2017-06-12-16-27.json b/common/changes/@uifabric/styling/utilities-strict-null_2017-06-12-16-27.json
new file mode 100644
index 0000000000000..25558583bb65c
--- /dev/null
+++ b/common/changes/@uifabric/styling/utilities-strict-null_2017-06-12-16-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Enable strictNullChecks in utilities package",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/utilities-strict-null_2017-06-12-16-27.json b/common/changes/@uifabric/utilities/utilities-strict-null_2017-06-12-16-27.json
new file mode 100644
index 0000000000000..05dbdf6b146a3
--- /dev/null
+++ b/common/changes/@uifabric/utilities/utilities-strict-null_2017-06-12-16-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Enable strictNullChecks in utilities package",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/utilities-strict-null_2017-06-12-16-27.json b/common/changes/office-ui-fabric-react/utilities-strict-null_2017-06-12-16-27.json
new file mode 100644
index 0000000000000..180d086f0ee73
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/utilities-strict-null_2017-06-12-16-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Enable strictNullChecks in utilities package",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/api/utilities.api.ts b/packages/utilities/api/utilities.api.ts
index 9565f97f7ff08..1af43d6fdd144 100644
--- a/packages/utilities/api/utilities.api.ts
+++ b/packages/utilities/api/utilities.api.ts
@@ -74,7 +74,7 @@ class DelayedRender extends React.Component<IDelayedRenderProps, IDelayedRenderS
   constructor(props: IDelayedRenderProps);
 }
 
-export function elementContains(parent: HTMLElement, child: HTMLElement, allowVirtualParents: boolean = true): boolean;
+export function elementContains(parent: HTMLElement | null, child: HTMLElement | null, allowVirtualParents: boolean = true): boolean;
 
 // WARNING: raise has incomplete type information
 // WARNING: stopPropagation has incomplete type information
@@ -93,7 +93,7 @@ class EventGroup {
 // (undocumented)
 export function findIndex(array: any[], cb: (item: any, index?: number) => boolean): number;
 
-export function findScrollableParent(startingElement: HTMLElement): HTMLElement;
+export function findScrollableParent(startingElement: HTMLElement): HTMLElement | null;
 
 export function focusFirstChild(rootElement: HTMLElement): boolean;
 
@@ -105,38 +105,38 @@ export function getDistanceBetweenPoints(point1: IPoint, point2: IPoint): number
 // (undocumented)
 export function getFirstFocusable(rootElement: HTMLElement,
   currentElement: HTMLElement,
-  includeElementsInFocusZones?: boolean): HTMLElement;
+  includeElementsInFocusZones?: boolean): HTMLElement | null;
 
 export function getId(prefix?: string): string;
 
-export function getInitials(displayName: string, isRtl: boolean): string;
+export function getInitials(displayName: string | undefined | null, isRtl: boolean): string;
 
-export function getLanguage(): string;
+export function getLanguage(): string | null;
 
 // (undocumented)
 export function getLastFocusable(rootElement: HTMLElement,
   currentElement: HTMLElement,
-  includeElementsInFocusZones?: boolean): HTMLElement;
+  includeElementsInFocusZones?: boolean): HTMLElement | null;
 
 export function getNativeProps < T >(props: any, allowedPropNames: string[], excludedPropNames?: string[]): T;
 
 export function getNextElement(rootElement: HTMLElement,
-  currentElement: HTMLElement,
+  currentElement: HTMLElement | null,
   checkNode?: boolean,
   suppressParentTraversal?: boolean,
   suppressChildTraversal?: boolean,
-  includeElementsInFocusZones?: boolean): HTMLElement;
+  includeElementsInFocusZones?: boolean): HTMLElement | null;
 
-export function getParent(child: HTMLElement, allowVirtualParents: boolean = true): HTMLElement;
+export function getParent(child: HTMLElement, allowVirtualParents: boolean = true): HTMLElement | null;
 
 export function getPreviousElement(rootElement: HTMLElement,
-  currentElement: HTMLElement,
+  currentElement: HTMLElement | null,
   checkNode?: boolean,
   suppressParentTraversal?: boolean,
   traverseChildren?: boolean,
-  includeElementsInFocusZones?: boolean): HTMLElement;
+  includeElementsInFocusZones?: boolean): HTMLElement | null;
 
-export function getRect(element: HTMLElement | Window): IRectangle;
+export function getRect(element: HTMLElement | Window | null): IRectangle | undefined;
 
 export function getRTL(): boolean;
 
@@ -145,7 +145,7 @@ export function getRTLSafeKeyCode(key: number): number;
 export function getScrollbarWidth(): number;
 
 // (undocumented)
-export function getVirtualParent(child: HTMLElement): HTMLElement;
+export function getVirtualParent(child: HTMLElement): HTMLElement | undefined;
 
 export function hasHorizontalOverflow(element: HTMLElement): boolean;
 
@@ -212,11 +212,11 @@ interface IEventRecord {
   // (undocumented)
   callback: (args?: any) => void;
   // (undocumented)
-  elementCallback: (...args: any[]) => void;
+  elementCallback?: (...args: any[]) => void;
   // (undocumented)
   eventName: string;
   // (undocumented)
-  objectCallback: (args?: any) => void;
+  objectCallback?: (args?: any) => void;
   // (undocumented)
   parent: any;
   // (undocumented)
@@ -279,7 +279,7 @@ export function isElementFocusZone(element?: HTMLElement): boolean;
 export function isElementTabbable(element: HTMLElement): boolean;
 
 // (undocumented)
-export function isElementVisible(element: HTMLElement): boolean;
+export function isElementVisible(element: HTMLElement | undefined | null): boolean;
 
 // (undocumented)
 interface ISerializableObject {
@@ -355,7 +355,7 @@ class Rectangle {
 
 export function setMemoizeWeakMap(weakMap: any): void;
 
-export function setWarningCallback(warningCallback: (message: string) => void): void;
+export function setWarningCallback(warningCallback?: (message: string) => void): void;
 
 export function unhoistMethods(source: any, methodNames: string[]): void;
 
diff --git a/packages/utilities/src/Async.ts b/packages/utilities/src/Async.ts
index d9d065a181a9b..1aa995bc28da2 100644
--- a/packages/utilities/src/Async.ts
+++ b/packages/utilities/src/Async.ts
@@ -13,10 +13,10 @@ export class Async {
   private _timeoutIds: any = null;
   private _immediateIds: any = null;
   private _intervalIds: any = null;
-  private _animationFrameIds: { [id: number]: boolean } = null;
+  private _animationFrameIds: { [id: number]: boolean } | null = null;
   private _isDisposed = false;
   private _parent: any;
-  private _onErrorHandler: (e: any) => void;
+  private _onErrorHandler: ((e: any) => void) | undefined;
   private _noop: any;
 
   constructor(parent?: any, onError?: (e: any) => void) {
@@ -256,7 +256,7 @@ export class Async {
     let lastExecuteTime = 0;
     let lastResult: any;
     let lastArgs: any[];
-    let timeoutId: number = null;
+    let timeoutId: number | null = null;
 
     if (options && typeof (options.leading) === 'boolean') {
       leading = options.leading;
@@ -325,7 +325,7 @@ export class Async {
     let lastExecuteTime = (new Date).getTime();
     let lastResult: any;
     let lastArgs: any[];
-    let timeoutId: number = null;
+    let timeoutId: number | null = null;
 
     if (options && typeof (options.leading) === 'boolean') {
       leading = options.leading;
@@ -396,7 +396,10 @@ export class Async {
       let animationFrameCallback = () => {
         try {
           // Now delete the record and call the callback.
-          delete this._animationFrameIds[animationFrameId];
+          if (this._animationFrameIds) {
+            delete this._animationFrameIds[animationFrameId];
+          }
+
           callback.apply(this._parent);
         } catch (e) {
           this._logError(e);
diff --git a/packages/utilities/src/AutoScroll.ts b/packages/utilities/src/AutoScroll.ts
index d41801bf26ba3..40475a6f3b709 100644
--- a/packages/utilities/src/AutoScroll.ts
+++ b/packages/utilities/src/AutoScroll.ts
@@ -17,8 +17,8 @@ const MAX_SCROLL_VELOCITY = 15;
  */
 export class AutoScroll {
   private _events: EventGroup;
-  private _scrollableParent: HTMLElement;
-  private _scrollRect: IRectangle;
+  private _scrollableParent: HTMLElement | null;
+  private _scrollRect: IRectangle | undefined;
   private _scrollVelocity: number;
   private _timeoutId: number;
 
@@ -55,6 +55,10 @@ export class AutoScroll {
   }
 
   private _computeScrollVelocity(clientY: number) {
+    if (!this._scrollRect) {
+      return;
+    }
+
     let scrollRectTop = this._scrollRect.top;
     let scrollClientBottom = scrollRectTop + this._scrollRect.height - SCROLL_GUTTER_HEIGHT;
 
@@ -86,7 +90,10 @@ export class AutoScroll {
   }
 
   private _incrementScroll() {
-    this._scrollableParent.scrollTop += Math.round(this._scrollVelocity);
+    if (this._scrollableParent) {
+      this._scrollableParent.scrollTop += Math.round(this._scrollVelocity);
+    }
+
     this._timeoutId = setTimeout(this._incrementScroll, SCROLL_ITERATION_DELAY);
   }
 
diff --git a/packages/utilities/src/BaseComponent.test.tsx b/packages/utilities/src/BaseComponent.test.tsx
index 3301e49b86e00..9002994ba1634 100644
--- a/packages/utilities/src/BaseComponent.test.tsx
+++ b/packages/utilities/src/BaseComponent.test.tsx
@@ -33,7 +33,7 @@ class TestComponent extends BaseComponent<{}, {}> {
     this._createNullRef();
   }
 
-  public render(): JSX.Element {
+  public render(): JSX.Element | null {
     this._createNullRef();
     return null;
   }
@@ -47,7 +47,7 @@ class TestComponent extends BaseComponent<{}, {}> {
   }
 
   private _createNullRef() {
-    let foo: () => void = null;
+    let foo: any = null;
 
     // Calling a null
     foo();
diff --git a/packages/utilities/src/BaseComponent.ts b/packages/utilities/src/BaseComponent.ts
index 6054348f953ee..b4903ecd68c79 100644
--- a/packages/utilities/src/BaseComponent.ts
+++ b/packages/utilities/src/BaseComponent.ts
@@ -24,7 +24,7 @@ export class BaseComponent<P extends IBaseProps, S> extends React.Component<P, S
 
   private __async: Async;
   private __events: EventGroup;
-  private __disposables: IDisposable[];
+  private __disposables: IDisposable[] | null;
   private __resolves: { [name: string]: (ref: any) => any };
   private __className: string;
 
@@ -36,7 +36,10 @@ export class BaseComponent<P extends IBaseProps, S> extends React.Component<P, S
   constructor(props?: P, context?: any) {
     super(props, context);
 
-    this.props = props;
+    if (props) {
+      this.props = props;
+    }
+
     this._shouldUpdateComponentRef = true;
 
     _makeAllSafe(this, BaseComponent.prototype, [
@@ -156,7 +159,7 @@ export class BaseComponent<P extends IBaseProps, S> extends React.Component<P, S
   /**
    * Updates the componentRef (by calling it with "this" when necessary.)
    */
-  protected _updateComponentRef(currentProps: IBaseProps, newProps: IBaseProps = {}) {
+  protected _updateComponentRef(currentProps: IBaseProps | undefined, newProps: IBaseProps = {}) {
     if (this._shouldUpdateComponentRef &&
       ((!currentProps && newProps.componentRef) ||
         (currentProps && currentProps.componentRef !== newProps.componentRef))) {
diff --git a/packages/utilities/src/DelayedRender.tsx b/packages/utilities/src/DelayedRender.tsx
index f586fb172c047..1e151ff49c87b 100644
--- a/packages/utilities/src/DelayedRender.tsx
+++ b/packages/utilities/src/DelayedRender.tsx
@@ -43,7 +43,9 @@ export class DelayedRender extends React.Component<IDelayedRenderProps, IDelayed
   }
 
   public componentWillUnmount() {
-    clearTimeout(this._timeoutId);
+    if (this._timeoutId) {
+      clearTimeout(this._timeoutId);
+    }
   }
 
   public render() {
diff --git a/packages/utilities/src/EventGroup.ts b/packages/utilities/src/EventGroup.ts
index d24127b8d7e5a..f5d75ddc7855e 100644
--- a/packages/utilities/src/EventGroup.ts
+++ b/packages/utilities/src/EventGroup.ts
@@ -5,8 +5,8 @@ export interface IEventRecord {
   eventName: string;
   parent: any;
   callback: (args?: any) => void;
-  elementCallback: (...args: any[]) => void;
-  objectCallback: (args?: any) => void;
+  elementCallback?: (...args: any[]) => void;
+  objectCallback?: (args?: any) => void;
   useCapture: boolean;
 }
 
@@ -55,7 +55,7 @@ export class EventGroup {
       if (document.createEvent) {
         let ev = document.createEvent('HTMLEvents');
 
-        ev.initEvent(eventName, bubbleEvent, true);
+        ev.initEvent(eventName, bubbleEvent || false, true);
         (ev as any)['args'] = eventArgs;
         retVal = target.dispatchEvent(ev);
       } else if ((document as any)['createEventObject']) { // IE8
@@ -68,15 +68,17 @@ export class EventGroup {
         let events = <IEventRecordsByName>target.__events__;
         let eventRecords = events ? events[eventName] : null;
 
-        for (let id in eventRecords) {
-          if (eventRecords.hasOwnProperty(id)) {
-            let eventRecordList = <IEventRecord[]>eventRecords[id];
+        if (eventRecords) {
+          for (let id in eventRecords) {
+            if (eventRecords.hasOwnProperty(id)) {
+              let eventRecordList = <IEventRecord[]>eventRecords[id];
 
-            for (let listIndex = 0; retVal !== false && listIndex < eventRecordList.length; listIndex++) {
-              let record = eventRecordList[listIndex];
+              for (let listIndex = 0; retVal !== false && listIndex < eventRecordList.length; listIndex++) {
+                let record = eventRecordList[listIndex];
 
-              if (record.objectCallback) {
-                retVal = record.objectCallback.call(record.parent, eventArgs);
+                if (record.objectCallback) {
+                  retVal = record.objectCallback.call(record.parent, eventArgs);
+                }
               }
             }
           }
@@ -156,9 +158,7 @@ export class EventGroup {
         eventName: eventName,
         parent: parent,
         callback: callback,
-        objectCallback: null,
-        elementCallback: null,
-        useCapture: useCapture
+        useCapture: useCapture || false
       };
 
       // Initialize and wire up the record on the target, so that it can call the callback if the event fires.
diff --git a/packages/utilities/src/array.ts b/packages/utilities/src/array.ts
index 645b6aa3cf1ba..59389c301ca0a 100644
--- a/packages/utilities/src/array.ts
+++ b/packages/utilities/src/array.ts
@@ -11,7 +11,7 @@ export function findIndex(array: any[], cb: (item: any, index?: number) => boole
   return index;
 }
 
-export function createArray(size: number, getItem?: (index?: number) => any) {
+export function createArray(size: number, getItem: (index?: number) => any) {
   let array = [];
 
   for (let i = 0; i < size; i++) {
diff --git a/packages/utilities/src/autobind.ts b/packages/utilities/src/autobind.ts
index bca1666cb0b23..893d873e065df 100644
--- a/packages/utilities/src/autobind.ts
+++ b/packages/utilities/src/autobind.ts
@@ -11,12 +11,12 @@ export function autobind<T extends Function>(target: any, key: string, descripto
     configurable: true,
 
     get() {
-      if (defining || this === fn.prototype || this.hasOwnProperty(key)) {
+      if (defining || (fn && this === fn.prototype) || this.hasOwnProperty(key)) {
         return fn;
       }
 
       // Bind method only once, and update the property to return the bound value from now on
-      let fnBound = fn.bind(this);
+      let fnBound = fn && fn.bind(this);
 
       defining = true;
       Object.defineProperty(this, key, {
diff --git a/packages/utilities/src/dom.ts b/packages/utilities/src/dom.ts
index 1f3ac4740abe6..c87ad16e26b6e 100644
--- a/packages/utilities/src/dom.ts
+++ b/packages/utilities/src/dom.ts
@@ -49,8 +49,8 @@ export function setVirtualParent(child: HTMLElement, parent: HTMLElement) {
   }
 }
 
-export function getVirtualParent(child: HTMLElement): HTMLElement {
-  let parent: HTMLElement;
+export function getVirtualParent(child: HTMLElement): HTMLElement | undefined {
+  let parent: HTMLElement | undefined;
 
   if (child && isVirtualElement(child)) {
     parent = child._virtual.parent;
@@ -64,7 +64,7 @@ export function getVirtualParent(child: HTMLElement): HTMLElement {
  * If `allowVirtuaParents` is `true`, this method prefers the virtual parent over
  * real DOM parent when present.
  */
-export function getParent(child: HTMLElement, allowVirtualParents: boolean = true): HTMLElement {
+export function getParent(child: HTMLElement, allowVirtualParents: boolean = true): HTMLElement | null {
   return child && (
     allowVirtualParents && getVirtualParent(child) ||
     child.parentNode && child.parentNode as HTMLElement
@@ -76,7 +76,7 @@ export function getParent(child: HTMLElement, allowVirtualParents: boolean = tru
  * If `allowVirtualParents` is true, this method may return `true` if the child
  * has the parent in its virtual element hierarchy.
  */
-export function elementContains(parent: HTMLElement, child: HTMLElement, allowVirtualParents: boolean = true): boolean {
+export function elementContains(parent: HTMLElement | null, child: HTMLElement | null, allowVirtualParents: boolean = true): boolean {
   let isContained = false;
 
   if (parent && child) {
@@ -84,7 +84,7 @@ export function elementContains(parent: HTMLElement, child: HTMLElement, allowVi
       isContained = false;
 
       while (child) {
-        let nextParent = getParent(child);
+        let nextParent: HTMLElement | null = getParent(child);
 
         if (nextParent === parent) {
           isContained = true;
@@ -139,8 +139,8 @@ export function getDocument(rootElement?: HTMLElement) {
 /**
  * Helper to get bounding client rect, works with window.
  */
-export function getRect(element: HTMLElement | Window): IRectangle {
-  let rect: IRectangle;
+export function getRect(element: HTMLElement | Window | null): IRectangle | undefined {
+  let rect: IRectangle | undefined;
 
   if (element) {
     if (element === window) {
diff --git a/packages/utilities/src/focus.ts b/packages/utilities/src/focus.ts
index d2bcea1877b53..139b2d5b0011f 100644
--- a/packages/utilities/src/focus.ts
+++ b/packages/utilities/src/focus.ts
@@ -10,7 +10,7 @@ const FOCUSZONE_SUB_ATTRIBUTE = 'data-is-sub-focuszone';
 export function getFirstFocusable(
   rootElement: HTMLElement,
   currentElement: HTMLElement,
-  includeElementsInFocusZones?: boolean): HTMLElement {
+  includeElementsInFocusZones?: boolean): HTMLElement | null {
 
   return getNextElement(rootElement, currentElement, true, false, false, includeElementsInFocusZones);
 }
@@ -18,7 +18,7 @@ export function getFirstFocusable(
 export function getLastFocusable(
   rootElement: HTMLElement,
   currentElement: HTMLElement,
-  includeElementsInFocusZones?: boolean): HTMLElement {
+  includeElementsInFocusZones?: boolean): HTMLElement | null {
 
   return getPreviousElement(rootElement, currentElement, true, false, true, includeElementsInFocusZones);
 }
@@ -30,7 +30,7 @@ export function getLastFocusable(
  */
 export function focusFirstChild(
   rootElement: HTMLElement): boolean {
-  let element: HTMLElement = getNextElement(rootElement, rootElement, true, false, false, true);
+  let element: HTMLElement | null = getNextElement(rootElement, rootElement, true, false, false, true);
 
   if (element) {
     element.focus();
@@ -42,11 +42,11 @@ export function focusFirstChild(
 /** Traverse to find the previous element. */
 export function getPreviousElement(
   rootElement: HTMLElement,
-  currentElement: HTMLElement,
+  currentElement: HTMLElement | null,
   checkNode?: boolean,
   suppressParentTraversal?: boolean,
   traverseChildren?: boolean,
-  includeElementsInFocusZones?: boolean): HTMLElement {
+  includeElementsInFocusZones?: boolean): HTMLElement | null {
 
   if (!currentElement ||
     currentElement === rootElement) {
@@ -100,11 +100,11 @@ export function getPreviousElement(
 /** Traverse to find the next focusable element. */
 export function getNextElement(
   rootElement: HTMLElement,
-  currentElement: HTMLElement,
+  currentElement: HTMLElement | null,
   checkNode?: boolean,
   suppressParentTraversal?: boolean,
   suppressChildTraversal?: boolean,
-  includeElementsInFocusZones?: boolean): HTMLElement {
+  includeElementsInFocusZones?: boolean): HTMLElement | null {
 
   if (
     !currentElement ||
@@ -159,7 +159,7 @@ export function getNextElement(
   return null;
 }
 
-export function isElementVisible(element: HTMLElement): boolean {
+export function isElementVisible(element: HTMLElement | undefined | null): boolean {
   // If the element is not valid, return false.
   if (!element || !element.getAttribute) {
     return false;
@@ -189,10 +189,13 @@ export function isElementTabbable(element: HTMLElement): boolean {
   let tabIndex = -1;
 
   if (element && element.getAttribute) {
-    tabIndex = parseInt(element.getAttribute('tabIndex'), 10);
+    let tabIndexAttributeValue = element.getAttribute('tabIndex');
+    if (tabIndexAttributeValue) {
+      tabIndex = parseInt(tabIndexAttributeValue, 10);
+    }
   }
 
-  let isFocusableAttribute: string = element.getAttribute ? element.getAttribute(IS_FOCUSABLE_ATTRIBUTE) : null;
+  let isFocusableAttribute = element.getAttribute ? element.getAttribute(IS_FOCUSABLE_ATTRIBUTE) : null;
 
   return (
     !!element && isFocusableAttribute !== 'false' &&
@@ -209,15 +212,16 @@ export function isElementTabbable(element: HTMLElement): boolean {
 }
 
 export function isElementFocusZone(element?: HTMLElement): boolean {
-  return element && element.getAttribute && !!element.getAttribute(FOCUSZONE_ID_ATTRIBUTE);
+  return !!(element && element.getAttribute && !!element.getAttribute(FOCUSZONE_ID_ATTRIBUTE));
 }
 
 export function isElementFocusSubZone(element?: HTMLElement): boolean {
-  return element && element.getAttribute && element.getAttribute(FOCUSZONE_SUB_ATTRIBUTE) === 'true';
+  return !!(element && element.getAttribute && element.getAttribute(FOCUSZONE_SUB_ATTRIBUTE) === 'true');
 }
 
 export function doesElementContainFocus(element: HTMLElement) {
-  let currentActiveElement: HTMLElement = getDocument(element).activeElement as HTMLElement;
+  let document = getDocument(element);
+  let currentActiveElement: HTMLElement | undefined = document && document.activeElement as HTMLElement;
   if (currentActiveElement && elementContains(element, currentActiveElement)) {
     return true;
   }
diff --git a/packages/utilities/src/initials.ts b/packages/utilities/src/initials.ts
index 43f2d08283272..52375a31af6af 100644
--- a/packages/utilities/src/initials.ts
+++ b/packages/utilities/src/initials.ts
@@ -50,7 +50,7 @@ function cleanupDisplayName(displayName: string): string {
 }
 
 /** Get (up to 2 characters) initials based on display name of the persona. */
-export function getInitials(displayName: string, isRtl: boolean): string {
+export function getInitials(displayName: string | undefined | null, isRtl: boolean): string {
   if (displayName == null) {
     return '';
   }
diff --git a/packages/utilities/src/language.ts b/packages/utilities/src/language.ts
index bf0edc3c2ece6..47796ae6c8d7b 100644
--- a/packages/utilities/src/language.ts
+++ b/packages/utilities/src/language.ts
@@ -1,12 +1,12 @@
 import { getDocument, getWindow } from './dom';
 
 // Default to undefined so that we initialize on first read.
-let _language: string;
+let _language: string | null;
 
 /**
  * Gets the rtl state of the page (returns true if in rtl.)
  */
-export function getLanguage(): string {
+export function getLanguage(): string | null {
   if (_language === undefined) {
     let doc = getDocument();
     let win = getWindow();
diff --git a/packages/utilities/src/memoize.ts b/packages/utilities/src/memoize.ts
index 8353f85cccc24..765fde6bb5e64 100644
--- a/packages/utilities/src/memoize.ts
+++ b/packages/utilities/src/memoize.ts
@@ -9,7 +9,7 @@ const _dictionary: any = {};
 let _weakMap = (typeof WeakMap === 'undefined') ? null : WeakMap;
 
 interface IMemoizeNode {
-  map: WeakMap;
+  map: WeakMap | null;
   value?: any;
 }
 
@@ -25,7 +25,7 @@ export function memoize<T extends Function>(
 
   // We bind to "null" to prevent people from inadvertently pulling values from "this",
   // rather than passing them in as input values which can be memoized.
-  let fn = memoizeFunction(descriptor.value.bind(null));
+  let fn = memoizeFunction(descriptor.value && descriptor.value.bind(null));
 
   return {
     configurable: true,
@@ -108,6 +108,6 @@ function _normalizeArg(val: any) {
 
 function _createNode(): IMemoizeNode {
   return {
-    map: new _weakMap()
+    map: _weakMap ? new _weakMap() : null
   };
 }
diff --git a/packages/utilities/src/rtl.ts b/packages/utilities/src/rtl.ts
index 04fa5b623312b..f5dbb976fffec 100644
--- a/packages/utilities/src/rtl.ts
+++ b/packages/utilities/src/rtl.ts
@@ -2,7 +2,7 @@ import { KeyCodes } from './KeyCodes';
 import { getDocument, getWindow } from './dom';
 
 // Default to undefined so that we initialize on first read.
-let _isRTL: boolean;
+let _isRTL: boolean | undefined;
 
 /**
  * Gets the rtl state of the page (returns true if in rtl.)
@@ -40,7 +40,7 @@ export function getRTL(): boolean {
 /**
  * Sets the rtl state of the page (by adjusting the dir attribute of the html element.)
  */
-export function setRTL(isRTL: boolean, avoidPersisting = false) {
+export function setRTL(isRTL: boolean | undefined, avoidPersisting = false) {
   let doc = getDocument();
   if (doc) {
     doc.documentElement.setAttribute('dir', isRTL ? 'rtl' : 'ltr');
diff --git a/packages/utilities/src/scroll.ts b/packages/utilities/src/scroll.ts
index dabce8318395c..763a190ed8ac5 100644
--- a/packages/utilities/src/scroll.ts
+++ b/packages/utilities/src/scroll.ts
@@ -52,8 +52,8 @@ export function getScrollbarWidth(): number {
  * Traverses up the DOM for the element with the data-is-scrollable=true attribute, or returns
  * document.body.
  */
-export function findScrollableParent(startingElement: HTMLElement): HTMLElement {
-  let el = startingElement;
+export function findScrollableParent(startingElement: HTMLElement): HTMLElement | null {
+  let el: HTMLElement | null = startingElement;
 
   // First do a quick scan for the scrollable attribute.
   while (el && el !== document.body) {
diff --git a/packages/utilities/src/warn.test.ts b/packages/utilities/src/warn.test.ts
index 6333468a752e7..23e7915a978b6 100644
--- a/packages/utilities/src/warn.test.ts
+++ b/packages/utilities/src/warn.test.ts
@@ -5,7 +5,7 @@ import {
 } from './warn';
 import { expect } from 'chai';
 
-let _lastWarning: string;
+let _lastWarning: string | undefined;
 
 describe('warnDeprecations', () => {
   beforeEach(() => {
@@ -21,7 +21,7 @@ describe('warnDeprecations', () => {
   });
 
   it('can warn on a deprecated prop', () => {
-    warnDeprecations('Foo', { foo: 1 }, { 'foo': null });
+    warnDeprecations('Foo', { foo: 1 }, { 'foo': null } as any);
     expect(_lastWarning).equals(`Foo property 'foo' was used but has been deprecated.`);
   });
 
diff --git a/packages/utilities/src/warn.ts b/packages/utilities/src/warn.ts
index 4643408c15843..077a71299a836 100644
--- a/packages/utilities/src/warn.ts
+++ b/packages/utilities/src/warn.ts
@@ -43,10 +43,13 @@ export function warnMutuallyExclusive<P>(
   exclusiveMap: ISettingsMap<P>): void {
 
   for (const propName in exclusiveMap) {
-    if (props && propName in props && exclusiveMap[propName] in props) {
-      _warningCallback(
-        `${componentName} property '${propName}' is mutually exclusive with '${exclusiveMap[propName]}'. Use one or the other.`
-      );
+    if (props && propName in props) {
+      let propInExclusiveMapValue = exclusiveMap[propName];
+      if (propInExclusiveMapValue && propInExclusiveMapValue in props) {
+        _warningCallback(
+          `${componentName} property '${propName}' is mutually exclusive with '${exclusiveMap[propName]}'. Use one or the other.`
+        );
+      }
     }
   }
 }
@@ -67,6 +70,6 @@ export function warn(message: string): void {
  *
  * @param warningCallback - Callback to override the generated warnings.
  */
-export function setWarningCallback(warningCallback: (message: string) => void): void {
+export function setWarningCallback(warningCallback?: (message: string) => void): void {
   _warningCallback = warningCallback === undefined ? warn : warningCallback;
 }
diff --git a/packages/utilities/tsconfig.json b/packages/utilities/tsconfig.json
index c86ca82c9d7db..219a36c4719d8 100644
--- a/packages/utilities/tsconfig.json
+++ b/packages/utilities/tsconfig.json
@@ -12,6 +12,7 @@
     "experimentalDecorators": true,
     "importHelpers": true,
     "noImplicitAny": true,
+    "strictNullChecks": true,
     "moduleResolution": "node",
     "types": [
       "chai",

From 0c2ecc7bab31a37798ce256a522923e2d1c4e7d3 Mon Sep 17 00:00:00 2001
From: zoarif <zoarif@microsoft.com>
Date: Tue, 13 Jun 2017 15:09:58 -0700
Subject: [PATCH 0097/1641] Zoarif/adding dialog props for aria label ids
 (#1981)

Adding props for Dialog ariaLabelledById and ariaDescribedById
---
 ...gDialogPropsForAriaLabelIds_2017-06-12-23-06.json | 11 +++++++++++
 .../src/components/Dialog/Dialog.Props.ts            | 10 ++++++++++
 .../src/components/Dialog/Dialog.tsx                 | 12 ++++++++++--
 .../Dialog/examples/Dialog.Basic.Example.scss        |  5 ++++-
 .../Dialog/examples/Dialog.Basic.Example.tsx         |  4 ++++
 5 files changed, 39 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/zoarif-addingDialogPropsForAriaLabelIds_2017-06-12-23-06.json

diff --git a/common/changes/office-ui-fabric-react/zoarif-addingDialogPropsForAriaLabelIds_2017-06-12-23-06.json b/common/changes/office-ui-fabric-react/zoarif-addingDialogPropsForAriaLabelIds_2017-06-12-23-06.json
new file mode 100644
index 0000000000000..2493c643c597c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/zoarif-addingDialogPropsForAriaLabelIds_2017-06-12-23-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Adding Aria label props for Dialog",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "zoarif@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.Props.ts b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.Props.ts
index 3a3a9955c6897..655d33aca76fd 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.Props.ts
@@ -122,6 +122,16 @@ export interface IDialogProps extends React.Props<Dialog>, IWithResponsiveModeSt
    * Other top buttons that will show up next to the close button
    */
   topButtonsProps?: IButtonProps[];
+
+  /**
+  * Optional id for aria-LabelledBy
+  */
+  ariaLabelledById?: string;
+
+  /**
+  * Optional id for aria-DescribedBy
+  */
+  ariaDescribedById?: string;
 }
 
 export enum DialogType {
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
index 278f448caa8f8..92e76753b9879 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
@@ -1,5 +1,6 @@
 import * as React from 'react';
 import {
+  autobind,
   BaseComponent,
   css,
   getId
@@ -40,6 +41,8 @@ export class Dialog extends BaseComponent<IDialogProps, IDialogState> {
 
   public render() {
     let {
+      ariaDescribedById,
+      ariaLabelledById,
       elementToFocusOnDismiss,
       firstFocusableSelector,
       forceFocusInsideTrap,
@@ -83,8 +86,8 @@ export class Dialog extends BaseComponent<IDialogProps, IDialogState> {
         onDismissed={ onDismissed }
         onLayerDidMount={ onLayerDidMount }
         responsiveMode={ responsiveMode }
-        subtitleAriaId={ subText && id + '-subText' }
-        titleAriaId={ title && id + '-title' }
+        subtitleAriaId={ this._getAriaLabelId(ariaDescribedById, subText, id + '-subText') }
+        titleAriaId={ this._getAriaLabelId(ariaLabelledById, title, id + '-title') }
       >
 
         <DialogContent
@@ -101,4 +104,9 @@ export class Dialog extends BaseComponent<IDialogProps, IDialogState> {
       </Modal>
     );
   }
+
+  @autobind
+  private _getAriaLabelId(ariaId: string, text: string, alternativeId: string): string {
+    return ariaId || text && alternativeId;
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.scss b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.scss
index cfa329bd91d87..132628ca3e97a 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.scss
@@ -4,4 +4,7 @@
   .ms-dialogMainOverride {
       max-width: 450px;
   }
-}
\ No newline at end of file
+  .screenReaderOnly {
+      @include  ms-screenReaderOnly;
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
index cb5a51e40ae24..7fba8be1e91e9 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
@@ -21,6 +21,8 @@ export class DialogBasicExample extends React.Component<any, any> {
           onClick={ this._showDialog.bind(this) }
           text='Open Dialog'
         />
+        <label id='myLabel' className='screenReaderOnly'>All emails together Your Inbox has changed.
+          No longer does it include favorites, it is a singular destination for your emails.</label>
         <Dialog
           isOpen={ this.state.showDialog }
           type={ DialogType.normal }
@@ -29,6 +31,8 @@ export class DialogBasicExample extends React.Component<any, any> {
           subText='Your Inbox has changed. No longer does it include favorites, it is a singular destination for your emails.'
           isBlocking={ false }
           containerClassName='ms-dialogMainOverride'
+          ariaLabelledById='myLabel'
+          ariaDescribedById=''
         >
           <ChoiceGroup
             options={ [

From f962234cf5c1231976331cfabc06680a762cd516 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 13 Jun 2017 17:50:18 -0700
Subject: [PATCH 0098/1641] Updating the fonts to use Segoe UI, also to be
 override-able on load. (#1990)

* Updating the fonts to use Segoe UI, also to be override-able on load.

* Updates.
---
 apps/component-demo/package.json              |   2 +-
 apps/fabric-website/package.json              |   2 +-
 apps/todo-app/package.json                    |   2 +-
 .../font-fix_2017-06-14-00-05.json            |  11 +
 .../font-fix_2017-06-14-00-05.json            |  11 +
 .../styling/font-fix_2017-06-14-00-05.json    |  11 +
 .../font-fix_2017-06-14-00-05.json            |  11 +
 common/config/rush/npm-shrinkwrap.json        | 306 +++++++++---------
 packages/example-app-base/package.json        |   2 +-
 packages/office-ui-fabric-react/package.json  |   2 +-
 .../styling/src/styles/DefaultFontStyles.ts   |   2 +-
 packages/styling/src/utilities/theme.ts       |  20 +-
 12 files changed, 205 insertions(+), 177 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/font-fix_2017-06-14-00-05.json
 create mode 100644 common/changes/@uifabric/fabric-website/font-fix_2017-06-14-00-05.json
 create mode 100644 common/changes/@uifabric/styling/font-fix_2017-06-14-00-05.json
 create mode 100644 common/changes/office-ui-fabric-react/font-fix_2017-06-14-00-05.json

diff --git a/apps/component-demo/package.json b/apps/component-demo/package.json
index 54662af0612b2..0ebe664ee7b8e 100644
--- a/apps/component-demo/package.json
+++ b/apps/component-demo/package.json
@@ -24,7 +24,7 @@
     "@types/webpack-env": "^1.13.0",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-core": ">=7.0.0 <8.0.0",
+    "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=1.5.5 <2.0.0",
     "react": ">=15.3.2 <16.0.0",
     "react-dom": ">=15.3.2 <16.0.0",
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index e05806f0aec58..6287ffde2242b 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -52,7 +52,7 @@
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
-    "office-ui-fabric-core": ">=7.0.0 <8.0.0",
+    "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.5.0 <5.0.0",
     "tslib": "^1.6.0"
   }
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 5c4b1f795b0ac..71935ad83a26e 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -25,7 +25,7 @@
     "@microsoft/load-themed-styles": ">=1.2.2 <2.0.0",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-core": ">=7.0.0 <8.0.0",
+    "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.5.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
diff --git a/common/changes/@uifabric/example-app-base/font-fix_2017-06-14-00-05.json b/common/changes/@uifabric/example-app-base/font-fix_2017-06-14-00-05.json
new file mode 100644
index 0000000000000..7aabda6ce5291
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/font-fix_2017-06-14-00-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Bumping fabric-core dependency.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/font-fix_2017-06-14-00-05.json b/common/changes/@uifabric/fabric-website/font-fix_2017-06-14-00-05.json
new file mode 100644
index 0000000000000..26b1f94ae5625
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/font-fix_2017-06-14-00-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Bumping fabric-core dependency.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/font-fix_2017-06-14-00-05.json b/common/changes/@uifabric/styling/font-fix_2017-06-14-00-05.json
new file mode 100644
index 0000000000000..1b8c481bd002b
--- /dev/null
+++ b/common/changes/@uifabric/styling/font-fix_2017-06-14-00-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Updating FabricConfig support to allow themes to be providable at bundle load time without weird race conditions.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/font-fix_2017-06-14-00-05.json b/common/changes/office-ui-fabric-react/font-fix_2017-06-14-00-05.json
new file mode 100644
index 0000000000000..54e8f233321f7
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/font-fix_2017-06-14-00-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Bumping fabric-core dependency to have Segoe UI be part of the font fallback.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 51215c9930682..3ee4a00cd0fa4 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -1426,9 +1426,9 @@
       "integrity": "sha1-YmfHtgpR+sRzRns8SgLNHkQYBf4="
     },
     "@types/express-serve-static-core": {
-      "version": "4.0.45",
-      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.0.45.tgz",
-      "integrity": "sha1-cbsfh9cYdILQ2IUfWylEWOHHhmc="
+      "version": "4.0.46",
+      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.0.46.tgz",
+      "integrity": "sha512-dtJos9GpTYqX/LBvpu8xHxOQTeAXEgFzZkQmcLgxj/ZbNv0v+cpM3A2ZAiOljgNAbHeguPivFn2wHbNYvLJVcA=="
     },
     "@types/finalhandler": {
       "version": "0.0.31",
@@ -1531,9 +1531,9 @@
       "integrity": "sha1-vShOV8hPEyXacCur/IKlMoGQwMU="
     },
     "@types/react": {
-      "version": "15.0.27",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.27.tgz",
-      "integrity": "sha512-xijibeFUoyzNjAZVMIPiZW/j5WyUgClm7ii4rRj2IpgYHPFheSR/nwxzNFy60U2o1yp1XyB+QuWUz4+8DB5E1w=="
+      "version": "15.0.28",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.28.tgz",
+      "integrity": "sha512-B63xn08FhmOGoOwOw4QswI4sMrEMqRMpPtcLmqJeXAABcAD6qha9OcJ890yorRgf5B9pG0GR9u5gGyWSgsLVCQ=="
     },
     "@types/react-addons-test-utils": {
       "version": "0.14.18",
@@ -1648,14 +1648,14 @@
       }
     },
     "@uifabric/styling": {
-      "version": "0.7.2",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.7.2.tgz",
-      "integrity": "sha512-HZLvm7OU+gXeXO+QHnAJXimzBtEq/UoQwCUTb+gdFJP0oU43gLm40G1G+tPDjS0+ZB2CIIrkH7v0jQ2paKprSg=="
+      "version": "0.7.4",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.7.4.tgz",
+      "integrity": "sha512-MzIyq7vk6crRTWATfj8ryESGwZApt9RlFIScPkAFy8MBIvLhWP3Rc0H3/TrgjEYgIjDph+DybjmW/9aXlq3jLg=="
     },
     "@uifabric/utilities": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.1.2.tgz",
-      "integrity": "sha512-tugHCTt9MTccNv4vx9t3QfAowSEZRKDykbuVn23DG1VMUmTOzCs6zozHk3cqb5WFFvjLIsirXU/zPsFABxjApw=="
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.2.0.tgz",
+      "integrity": "sha512-eB9YLGf1hDFXV0Uq8+FoaHi13aLOvDAVHFSnqoIMnlAa1Q+3bODmpifwGcxRiP8WzqhRKlZKt4boK6iF6uQnOg=="
     },
     "abbrev": {
       "version": "1.0.9",
@@ -2025,9 +2025,9 @@
       "integrity": "sha1-MasayLEpNjRj41s+u2n038+6eUc="
     },
     "balanced-match": {
-      "version": "0.4.2",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-0.4.2.tgz",
-      "integrity": "sha1-yz8+PHMtwPAe5wtAPzAuYddwmDg="
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
+      "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c="
     },
     "base62": {
       "version": "1.2.0",
@@ -2168,9 +2168,9 @@
       "integrity": "sha1-g2TUJIrDT/DvGy8r9JpsYM4NgbY="
     },
     "brace-expansion": {
-      "version": "1.1.7",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.7.tgz",
-      "integrity": "sha1-Pv/DxQ4ABTH7cg6v+A8K6O8jz1k="
+      "version": "1.1.8",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.8.tgz",
+      "integrity": "sha1-wHshHHyVLsH479Uad+8NHTmQopI="
     },
     "braces": {
       "version": "1.8.5",
@@ -2302,9 +2302,9 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000683",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000683.tgz",
-      "integrity": "sha1-WLV+0eC7naVOrxRimFFHu+Fmefo="
+      "version": "1.0.30000684",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000684.tgz",
+      "integrity": "sha1-maywEYuP0f3WAaFeDA8t/BWoFoA="
     },
     "capture-stack-trace": {
       "version": "1.0.0",
@@ -2374,9 +2374,9 @@
       "integrity": "sha1-7qvxlEGc6QDaMBjCB9IS8qbfCgc="
     },
     "clap": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/clap/-/clap-1.1.3.tgz",
-      "integrity": "sha1-s7026T3Uy/s5WjwmiWNSRFJlwFs="
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/clap/-/clap-1.2.0.tgz",
+      "integrity": "sha1-WckP4+E3EEdG/xlGmiemNP9oyFc="
     },
     "clean-css": {
       "version": "3.4.27",
@@ -3790,9 +3790,9 @@
       "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
     },
     "fsevents": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.1.tgz",
-      "integrity": "sha1-8Z/Sj0Pur3YWgOUZogPE0LPTGv8=",
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.2.tgz",
+      "integrity": "sha512-Sn44E5wQW4bTHXvQmvSHwqbuiXtduD6Rrjm2ZtUEGbyrig+nUH3t/QD4M4/ZXViY556TBpRgZkHLDx3JxPwxiw==",
       "optional": true,
       "dependencies": {
         "abbrev": {
@@ -3800,22 +3800,22 @@
           "bundled": true,
           "optional": true
         },
+        "ajv": {
+          "version": "4.11.8",
+          "bundled": true,
+          "optional": true
+        },
         "ansi-regex": {
           "version": "2.1.1",
           "bundled": true
         },
-        "ansi-styles": {
-          "version": "2.2.1",
-          "bundled": true,
-          "optional": true
-        },
         "aproba": {
           "version": "1.1.1",
           "bundled": true,
           "optional": true
         },
         "are-we-there-yet": {
-          "version": "1.1.2",
+          "version": "1.1.4",
           "bundled": true,
           "optional": true
         },
@@ -3862,7 +3862,7 @@
           "bundled": true
         },
         "brace-expansion": {
-          "version": "1.1.6",
+          "version": "1.1.7",
           "bundled": true
         },
         "buffer-shims": {
@@ -3870,12 +3870,12 @@
           "bundled": true
         },
         "caseless": {
-          "version": "0.11.0",
+          "version": "0.12.0",
           "bundled": true,
           "optional": true
         },
-        "chalk": {
-          "version": "1.1.3",
+        "co": {
+          "version": "4.6.0",
           "bundled": true,
           "optional": true
         },
@@ -3887,11 +3887,6 @@
           "version": "1.0.5",
           "bundled": true
         },
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true,
-          "optional": true
-        },
         "concat-map": {
           "version": "0.0.1",
           "bundled": true
@@ -3922,12 +3917,12 @@
           }
         },
         "debug": {
-          "version": "2.2.0",
+          "version": "2.6.8",
           "bundled": true,
           "optional": true
         },
         "deep-extend": {
-          "version": "0.4.1",
+          "version": "0.4.2",
           "bundled": true,
           "optional": true
         },
@@ -3945,13 +3940,8 @@
           "bundled": true,
           "optional": true
         },
-        "escape-string-regexp": {
-          "version": "1.0.5",
-          "bundled": true,
-          "optional": true
-        },
         "extend": {
-          "version": "3.0.0",
+          "version": "3.0.1",
           "bundled": true,
           "optional": true
         },
@@ -3965,7 +3955,7 @@
           "optional": true
         },
         "form-data": {
-          "version": "2.1.2",
+          "version": "2.1.4",
           "bundled": true,
           "optional": true
         },
@@ -3974,7 +3964,7 @@
           "bundled": true
         },
         "fstream": {
-          "version": "1.0.10",
+          "version": "1.0.11",
           "bundled": true
         },
         "fstream-ignore": {
@@ -3983,22 +3973,12 @@
           "optional": true
         },
         "gauge": {
-          "version": "2.7.3",
-          "bundled": true,
-          "optional": true
-        },
-        "generate-function": {
-          "version": "2.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "generate-object-property": {
-          "version": "1.2.0",
+          "version": "2.7.4",
           "bundled": true,
           "optional": true
         },
         "getpass": {
-          "version": "0.1.6",
+          "version": "0.1.7",
           "bundled": true,
           "optional": true,
           "dependencies": {
@@ -4010,25 +3990,20 @@
           }
         },
         "glob": {
-          "version": "7.1.1",
+          "version": "7.1.2",
           "bundled": true
         },
         "graceful-fs": {
           "version": "4.1.11",
           "bundled": true
         },
-        "graceful-readlink": {
-          "version": "1.0.1",
+        "har-schema": {
+          "version": "1.0.5",
           "bundled": true,
           "optional": true
         },
         "har-validator": {
-          "version": "2.0.6",
-          "bundled": true,
-          "optional": true
-        },
-        "has-ansi": {
-          "version": "2.0.0",
+          "version": "4.2.1",
           "bundled": true,
           "optional": true
         },
@@ -4068,16 +4043,6 @@
           "version": "1.0.0",
           "bundled": true
         },
-        "is-my-json-valid": {
-          "version": "2.15.0",
-          "bundled": true,
-          "optional": true
-        },
-        "is-property": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
         "is-typedarray": {
           "version": "1.0.0",
           "bundled": true,
@@ -4107,31 +4072,43 @@
           "bundled": true,
           "optional": true
         },
+        "json-stable-stringify": {
+          "version": "1.0.1",
+          "bundled": true,
+          "optional": true
+        },
         "json-stringify-safe": {
           "version": "5.0.1",
           "bundled": true,
           "optional": true
         },
-        "jsonpointer": {
-          "version": "4.0.1",
+        "jsonify": {
+          "version": "0.0.0",
           "bundled": true,
           "optional": true
         },
         "jsprim": {
-          "version": "1.3.1",
+          "version": "1.4.0",
           "bundled": true,
-          "optional": true
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
         },
         "mime-db": {
-          "version": "1.26.0",
+          "version": "1.27.0",
           "bundled": true
         },
         "mime-types": {
-          "version": "2.1.14",
+          "version": "2.1.15",
           "bundled": true
         },
         "minimatch": {
-          "version": "3.0.3",
+          "version": "3.0.4",
           "bundled": true
         },
         "minimist": {
@@ -4143,22 +4120,22 @@
           "bundled": true
         },
         "ms": {
-          "version": "0.7.1",
+          "version": "2.0.0",
           "bundled": true,
           "optional": true
         },
         "node-pre-gyp": {
-          "version": "0.6.33",
+          "version": "0.6.36",
           "bundled": true,
           "optional": true
         },
         "nopt": {
-          "version": "3.0.6",
+          "version": "4.0.1",
           "bundled": true,
           "optional": true
         },
         "npmlog": {
-          "version": "4.0.2",
+          "version": "4.1.0",
           "bundled": true,
           "optional": true
         },
@@ -4180,17 +4157,27 @@
           "version": "1.4.0",
           "bundled": true
         },
-        "path-is-absolute": {
-          "version": "1.0.1",
-          "bundled": true
+        "os-homedir": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
         },
-        "pinkie": {
-          "version": "2.0.4",
+        "os-tmpdir": {
+          "version": "1.0.2",
           "bundled": true,
           "optional": true
         },
-        "pinkie-promise": {
-          "version": "2.0.1",
+        "osenv": {
+          "version": "0.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "path-is-absolute": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "performance-now": {
+          "version": "0.2.0",
           "bundled": true,
           "optional": true
         },
@@ -4204,12 +4191,12 @@
           "optional": true
         },
         "qs": {
-          "version": "6.3.1",
+          "version": "6.4.0",
           "bundled": true,
           "optional": true
         },
         "rc": {
-          "version": "1.1.7",
+          "version": "1.2.1",
           "bundled": true,
           "optional": true,
           "dependencies": {
@@ -4221,17 +4208,20 @@
           }
         },
         "readable-stream": {
-          "version": "2.2.2",
-          "bundled": true,
-          "optional": true
+          "version": "2.2.9",
+          "bundled": true
         },
         "request": {
-          "version": "2.79.0",
+          "version": "2.81.0",
           "bundled": true,
           "optional": true
         },
         "rimraf": {
-          "version": "2.5.4",
+          "version": "2.6.1",
+          "bundled": true
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
           "bundled": true
         },
         "semver": {
@@ -4255,7 +4245,7 @@
           "optional": true
         },
         "sshpk": {
-          "version": "1.10.2",
+          "version": "1.13.0",
           "bundled": true,
           "optional": true,
           "dependencies": {
@@ -4267,7 +4257,7 @@
           }
         },
         "string_decoder": {
-          "version": "0.10.31",
+          "version": "1.0.1",
           "bundled": true
         },
         "string-width": {
@@ -4288,31 +4278,14 @@
           "bundled": true,
           "optional": true
         },
-        "supports-color": {
-          "version": "2.0.0",
-          "bundled": true,
-          "optional": true
-        },
         "tar": {
           "version": "2.2.1",
           "bundled": true
         },
         "tar-pack": {
-          "version": "3.3.0",
+          "version": "3.4.0",
           "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "once": {
-              "version": "1.3.3",
-              "bundled": true,
-              "optional": true
-            },
-            "readable-stream": {
-              "version": "2.1.5",
-              "bundled": true,
-              "optional": true
-            }
-          }
+          "optional": true
         },
         "tough-cookie": {
           "version": "2.3.2",
@@ -4320,7 +4293,7 @@
           "optional": true
         },
         "tunnel-agent": {
-          "version": "0.4.3",
+          "version": "0.6.0",
           "bundled": true,
           "optional": true
         },
@@ -4349,18 +4322,13 @@
           "optional": true
         },
         "wide-align": {
-          "version": "1.1.0",
+          "version": "1.1.2",
           "bundled": true,
           "optional": true
         },
         "wrappy": {
           "version": "1.0.2",
           "bundled": true
-        },
-        "xtend": {
-          "version": "4.0.1",
-          "bundled": true,
-          "optional": true
         }
       }
     },
@@ -5689,9 +5657,9 @@
       "integrity": "sha1-g/Cg7DeL8yRheLbCrZE28TWxyWI=",
       "dependencies": {
         "postcss": {
-          "version": "6.0.1",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
-          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
+          "version": "6.0.2",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.2.tgz",
+          "integrity": "sha1-XE/qWJ8Kw7AMqnWxy8OihBlbfl0="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -7380,14 +7348,14 @@
       "integrity": "sha1-EEEktsYCxnlogaBCVB0220OlJk4="
     },
     "office-ui-fabric-core": {
-      "version": "7.1.1",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-7.1.1.tgz",
-      "integrity": "sha1-hm7CYioSwEE7X2gTbvy5f66o8WY="
+      "version": "7.1.2",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-7.1.2.tgz",
+      "integrity": "sha1-6mJvqUURirroSrsZc45KCLCHPx8="
     },
     "office-ui-fabric-react": {
-      "version": "4.4.2",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.4.2.tgz",
-      "integrity": "sha512-K9kBVRhnSRuXzwfN4YiNkYvCTrnJuvWUPVuYsbyFugRr+XpGw+j0x9pyBJgKiCr/GZgNmnpfJhVLoQQcXnJkTg=="
+      "version": "4.5.1",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.5.1.tgz",
+      "integrity": "sha512-lPeE/wgI9C/ryKpaQGTQRvo/1txgoFs5/g6i5kBEMc41DDVj7ZMXW2kgPER6dtV9Ku1IYqcJSNwi/KP1a07KvA=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -7932,9 +7900,9 @@
       "integrity": "sha1-thTJcgvmgW6u41+zpfqh26agXds=",
       "dependencies": {
         "postcss": {
-          "version": "6.0.1",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
-          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
+          "version": "6.0.2",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.2.tgz",
+          "integrity": "sha1-XE/qWJ8Kw7AMqnWxy8OihBlbfl0="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -7949,9 +7917,9 @@
       "integrity": "sha1-99gMOYxaOT+nlkRmvRlQCn1hwGk=",
       "dependencies": {
         "postcss": {
-          "version": "6.0.1",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
-          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
+          "version": "6.0.2",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.2.tgz",
+          "integrity": "sha1-XE/qWJ8Kw7AMqnWxy8OihBlbfl0="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -7966,9 +7934,9 @@
       "integrity": "sha1-1upkmUx5+XtipytCb75gVqGUu5A=",
       "dependencies": {
         "postcss": {
-          "version": "6.0.1",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
-          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
+          "version": "6.0.2",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.2.tgz",
+          "integrity": "sha1-XE/qWJ8Kw7AMqnWxy8OihBlbfl0="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -7983,9 +7951,9 @@
       "integrity": "sha1-7P+p1+GSUYOJ9CrQ6D9yrsRW6iA=",
       "dependencies": {
         "postcss": {
-          "version": "6.0.1",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
-          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
+          "version": "6.0.2",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.2.tgz",
+          "integrity": "sha1-XE/qWJ8Kw7AMqnWxy8OihBlbfl0="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -8392,12 +8360,26 @@
     "reduce-css-calc": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/reduce-css-calc/-/reduce-css-calc-1.3.0.tgz",
-      "integrity": "sha1-dHyRTgSWFKTJz7umKYca0dKSdxY="
+      "integrity": "sha1-dHyRTgSWFKTJz7umKYca0dKSdxY=",
+      "dependencies": {
+        "balanced-match": {
+          "version": "0.4.2",
+          "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-0.4.2.tgz",
+          "integrity": "sha1-yz8+PHMtwPAe5wtAPzAuYddwmDg="
+        }
+      }
     },
     "reduce-function-call": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/reduce-function-call/-/reduce-function-call-1.0.2.tgz",
-      "integrity": "sha1-WiAL+S4ON3UXUv5FsKszD9S2vpk="
+      "integrity": "sha1-WiAL+S4ON3UXUv5FsKszD9S2vpk=",
+      "dependencies": {
+        "balanced-match": {
+          "version": "0.4.2",
+          "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-0.4.2.tgz",
+          "integrity": "sha1-yz8+PHMtwPAe5wtAPzAuYddwmDg="
+        }
+      }
     },
     "regenerate": {
       "version": "1.3.2",
@@ -9156,9 +9138,9 @@
       "integrity": "sha1-3tJmVWMZyLDiIoErnPOyb6fZR94="
     },
     "stream-http": {
-      "version": "2.7.1",
-      "resolved": "https://registry.npmjs.org/stream-http/-/stream-http-2.7.1.tgz",
-      "integrity": "sha1-VGpRdBrVprB+njGwsQRBqRffUoo=",
+      "version": "2.7.2",
+      "resolved": "https://registry.npmjs.org/stream-http/-/stream-http-2.7.2.tgz",
+      "integrity": "sha512-c0yTD2rbQzXtSsFSVhtpvY/vS6u066PcXOX9kBB3mSO76RiUQzL340uJkGBWnlBg4/HZzqiUXtaVA7wcRcJgEw==",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 32d001a4e7e95..2573b7d501617 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -43,7 +43,7 @@
     "@uifabric/styling": ">=0.7.4 <1.0.0",
     "@uifabric/utilities": ">=4.1.2 <5.0.0",
     "highlight.js": "^9.9.0",
-    "office-ui-fabric-core": ">=7.0.0 <8.0.0",
+    "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.4.0 <5.0.0",
     "tslib": "^1.6.0"
   }
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 8519614f8c58d..94ce1becbd94b 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -47,7 +47,7 @@
     "mocha": "^3.2.0",
     "mocha-loader": "^1.1.1",
     "node-sass": "^4.5.0",
-    "office-ui-fabric-core": ">=7.0.0 <8.0.0",
+    "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
     "postcss-loader": "^1.3.3",
     "raw-loader": "^0.5.1",
diff --git a/packages/styling/src/styles/DefaultFontStyles.ts b/packages/styling/src/styles/DefaultFontStyles.ts
index 36a969bce9341..f3f387671d4c4 100644
--- a/packages/styling/src/styles/DefaultFontStyles.ts
+++ b/packages/styling/src/styles/DefaultFontStyles.ts
@@ -10,7 +10,7 @@ import { IFabricConfig } from '../interfaces/IFabricConfig';
 const DefaultBaseUrl = 'https://static2.sharepointonline.com/files/fabric/assets';
 
 // Fallback fonts, if specified system or web fonts are unavailable.
-const FontFamilyFallbacks = `-apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif`;
+const FontFamilyFallbacks = `'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif`;
 
 // Font face names to be registered.
 const FontNameArabic = 'Segoe UI Web (Arabic)';
diff --git a/packages/styling/src/utilities/theme.ts b/packages/styling/src/utilities/theme.ts
index a4d6166a9a829..ed214028208c6 100644
--- a/packages/styling/src/utilities/theme.ts
+++ b/packages/styling/src/utilities/theme.ts
@@ -7,7 +7,7 @@ import {
   DefaultPalette,
   DefaultFontStyles
 } from '../styles/index';
-import { Customizer } from '@uifabric/utilities/lib/index';
+import { Customizer, getWindow } from '@uifabric/utilities/lib/index';
 export interface ITheme {
   palette: IPalette;
   fonts: IFontStyles;
@@ -21,6 +21,14 @@ let _theme: ITheme = {
   fonts: DefaultFontStyles
 };
 
+let win = getWindow();
+
+// tslint:disable:no-string-literal
+if (win && win['FabricConfig'] && win['FabricConfig'].theme) {
+  _theme = createTheme(win['FabricConfig'].theme);
+}
+// tslint:enable:no-string-literal
+
 Customizer.setDefault('theme', _theme);
 
 /**
@@ -46,10 +54,7 @@ export function loadTheme(theme: Partial<ITheme>): void {
  * Creates a custom theme definition which can be used with the Customizer.
  */
 export function createTheme(theme: Partial<ITheme>): ITheme {
-  let newPalette = {
-    ..._theme.palette,
-    ...theme.palette
-  };
+  let newPalette = { ..._theme.palette, ...theme.palette };
 
   return {
     palette: newPalette,
@@ -57,10 +62,7 @@ export function createTheme(theme: Partial<ITheme>): ITheme {
       ..._theme.fonts,
       ...theme.fonts
     },
-    semanticColors: {
-      ..._makeSemanticColorsFromPalette(newPalette),
-      ...theme.semanticColors
-    }
+    semanticColors: { ..._makeSemanticColorsFromPalette(newPalette), ...theme.semanticColors }
   } as ITheme;
 }
 

From e0dc2ba3f8504d77c0f19567e646608b1094018c Mon Sep 17 00:00:00 2001
From: Benjamin Kaiser <benjaminjkaiser@gmail.com>
Date: Tue, 13 Jun 2017 17:51:10 -0700
Subject: [PATCH 0099/1641] Add aria-haspopup attribute to buttons with
 menuProps (#1989)

* Add aria-haspopup attribute to buttons with menuProps

To improve accessibility of the Button components, when they are given
`menuProps` we should add the attribute `aria-haspopup="true"` so screenreaders
can announce that the button has a popup.

https://www.w3.org/TR/wai-aria/states_and_properties#aria-haspopup

* update changes file

* Create bekaise-button-aria-haspopup_2017-06-13-20-32.json
---
 ...button-aria-haspopup_2017-06-13-20-32.json | 11 +++++++
 .../src/components/Button/BaseButton.tsx      |  3 +-
 .../src/components/Button/Button.test.tsx     | 29 +++++++++++++++++++
 3 files changed, 42 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/bekaise-button-aria-haspopup_2017-06-13-20-32.json

diff --git a/common/changes/office-ui-fabric-react/bekaise-button-aria-haspopup_2017-06-13-20-32.json b/common/changes/office-ui-fabric-react/bekaise-button-aria-haspopup_2017-06-13-20-32.json
new file mode 100644
index 0000000000000..7eb489e3806e4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/bekaise-button-aria-haspopup_2017-06-13-20-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Buttons: Added `aria-haspopup` to buttons with menuProps.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "bekaise@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 8a016cb960b48..c3d7c1ecc7543 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -138,7 +138,8 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         buttonProps,
         {
           'onClick': this._onToggleMenu,
-          'aria-expanded': this.state.menuProps ? true : false
+          'aria-expanded': this.state.menuProps ? true : false,
+          'aria-haspopup': true
         }
       );
     }
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
index 5dd1a089221c5..44fe1a7137a8a 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
@@ -39,4 +39,33 @@ describe('DefaultButton', () => {
     expect(renderedDOM.tagName).equals('A', 'A Button with an href renders as an anchor');
   });
 
+  describe('with menuProps', () => {
+    let button;
+
+    before(() => {
+      const wrapper = ReactTestUtils.renderIntoDocument<any>(
+        <DefaultButton menuProps={ { items: [{ key: 'item', name: 'Item' }] } }>Hello</DefaultButton>
+      ) as DefaultButton;
+      button = ReactTestUtils.findRenderedDOMComponentWithTag(wrapper, 'button');
+    });
+
+    it('contains aria-haspopup=true', () => {
+      expect(button.getAttribute('aria-haspopup')).to.equal('true');
+    });
+  });
+
+  describe('without menuProps', () => {
+    let button;
+
+    before(() => {
+      const wrapper = ReactTestUtils.renderIntoDocument<any>(
+        <DefaultButton>Hello</DefaultButton>
+      ) as DefaultButton;
+      button = ReactTestUtils.findRenderedDOMComponentWithTag(wrapper, 'button');
+    });
+
+    it('does not contain aria-haspopup', () => {
+      expect(button.getAttribute('aria-haspopup')).to.equal(null);
+    });
+  });
 });

From bb1ad7c5662d95e1a65416f40e822f82085a692d Mon Sep 17 00:00:00 2001
From: Priyanka Mittal <prmittal@microsoft.com>
Date: Wed, 14 Jun 2017 06:23:11 +0530
Subject: [PATCH 0100/1641] Fixing aria details for dropdown (#1985)

* fix for aria-required-children

* change file
---
 ...s-prmittal-dropdown-aria-fix_2017-06-13-13-03.json | 11 +++++++++++
 .../src/components/Dropdown/Dropdown.tsx              |  5 +++--
 2 files changed, 14 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-prmittal-dropdown-aria-fix_2017-06-13-13-03.json

diff --git a/common/changes/office-ui-fabric-react/users-prmittal-dropdown-aria-fix_2017-06-13-13-03.json b/common/changes/office-ui-fabric-react/users-prmittal-dropdown-aria-fix_2017-06-13-13-03.json
new file mode 100644
index 0000000000000..1127a62a39d26
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-prmittal-dropdown-aria-fix_2017-06-13-13-03.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "[Accessibility] [DropDown] Fix aria-required-children",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "prmittal@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index e4642a6ef3a2c..29a8e2cf4e992 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -131,13 +131,12 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
           onClick={ this._onDropdownClick }
           aria-expanded={ isOpen ? 'true' : 'false' }
           role='combobox'
-          aria-readonly={ true }
           aria-live={ disabled || isOpen ? 'off' : 'assertive' }
           aria-label={ ariaLabel || label }
           aria-describedby={ id + '-option' }
           aria-activedescendant={ isOpen && selectedIndex >= 0 ? (this._id + '-list' + selectedIndex) : null }
           aria-disabled={ disabled }
-          aria-owns={ id + '-list' }
+          aria-owns={ isOpen ? id + '-list' : null }
         >
           <span
             id={ id + '-option' }
@@ -148,6 +147,8 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
             }
             key={ selectedIndex }
             aria-atomic={ true }
+            role='textbox'
+            aria-readonly='true'
           >
             { // If option is selected render title, otherwise render the placeholder text
               selectedOption ? (

From 057d6526f255d23b185c4d4618d63939b2ba8290 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 13 Jun 2017 17:55:29 -0700
Subject: [PATCH 0101/1641] Create
 users-prmittal-dropdown-aria-fix_2017-06-13-13-03.json

---
 .../users-prmittal-dropdown-aria-fix_2017-06-13-13-03.json    | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/common/changes/office-ui-fabric-react/users-prmittal-dropdown-aria-fix_2017-06-13-13-03.json b/common/changes/office-ui-fabric-react/users-prmittal-dropdown-aria-fix_2017-06-13-13-03.json
index 1127a62a39d26..3516cb0bd177c 100644
--- a/common/changes/office-ui-fabric-react/users-prmittal-dropdown-aria-fix_2017-06-13-13-03.json
+++ b/common/changes/office-ui-fabric-react/users-prmittal-dropdown-aria-fix_2017-06-13-13-03.json
@@ -2,10 +2,10 @@
   "changes": [
     {
       "packageName": "office-ui-fabric-react",
-      "comment": "[Accessibility] [DropDown] Fix aria-required-children",
+      "comment": "Dropdown: adding aria attribute `aria-readonly=true` and adjusting `aria-owns` to only show in cases where it is opened.",
       "type": "patch"
     }
   ],
   "packageName": "office-ui-fabric-react",
   "email": "prmittal@microsoft.com"
-}
\ No newline at end of file
+}

From 8c64e599a92a969603525640cedb8e0119efd61f Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Tue, 13 Jun 2017 17:58:20 -0700
Subject: [PATCH 0102/1641] PeoplePicker: Styling, accessibility, and perf bug
 fixes. (#1938)

* Increasing max-width of people picker items.

* Replacing conflicting persona padding values with flex box rules.

* Making single line primaryText of very small personas fill the full height of the container for better veritcal centering.

* Fixing keyboard focus and excessive suggestion/pill rerendering issues.

* Rush change.
---
 ...eoplepicker-bugfixes_2017-06-05-22-57.json | 11 ++++
 .../src/components/Button/BaseButton.tsx      |  2 +-
 .../src/components/Persona/Persona.scss       | 62 +++++--------------
 .../src/components/pickers/BasePicker.tsx     | 32 ++++++----
 .../PeoplePickerItems/PickerItemsDefault.scss |  5 +-
 .../examples/PeoplePicker.Types.Example.tsx   | 32 +---------
 .../examples/PeoplePickerExampleData.ts       | 43 +++++++------
 .../pickers/Suggestions/Suggestions.tsx       |  2 +-
 8 files changed, 74 insertions(+), 115 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-peoplepicker-bugfixes_2017-06-05-22-57.json

diff --git a/common/changes/office-ui-fabric-react/v-krbrow-peoplepicker-bugfixes_2017-06-05-22-57.json b/common/changes/office-ui-fabric-react/v-krbrow-peoplepicker-bugfixes_2017-06-05-22-57.json
new file mode 100644
index 0000000000000..beb1dbbc14901
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-peoplepicker-bugfixes_2017-06-05-22-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "PeoplePicker: fixing styling, focus, and extra rerendering issues.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index c3d7c1ecc7543..7df5a61c45cd6 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -126,7 +126,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         'aria-labelledby': ariaLabel ? null : _labelId,
         'aria-describedby': ariaDescribedBy,
         'aria-disabled': disabled,
-        'data-is-focusable': disabled ? false : true,
+        'data-is-focusable': (this.props['data-is-focusable'] === false || disabled) ? false : true,
         'aria-pressed': checked
       }
     );
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
index be1fe2d62df60..b39eb94147d60 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
@@ -67,7 +67,6 @@ $ms-Persona-presenceSizeXl: 28px;
   color: $ms-color-neutralPrimary;
   font-size: $ms-font-size-m;
   font-weight: $ms-font-weight-regular;
-  line-height: 1;
   position: relative;
   height: $ms-Persona-sizeMd;
   display: flex;
@@ -238,6 +237,9 @@ $ms-Persona-presenceSizeXl: 28px;
   min-width: 0;
   width: 100%;
   @include text-align(left);
+  display: flex;
+  flex-direction: column;
+  justify-content: space-around;
 }
 
 .primaryText,
@@ -252,8 +254,6 @@ $ms-Persona-presenceSizeXl: 28px;
   color: $ms-color-neutralPrimary;
   font-weight: $ms-font-weight-regular;
   font-size: $ms-font-size-l;
-  margin-top: -3px;
-  line-height: 1.4;
 }
 
 .secondaryText,
@@ -263,16 +263,10 @@ $ms-Persona-presenceSizeXl: 28px;
   font-weight: $ms-font-weight-regular;
   font-size: $ms-font-size-s;
   white-space: nowrap;
-  line-height: 1.3;
-}
-
-.secondaryText {
-  padding-top: 3px;
 }
 
 .tertiaryText,
 .optionalText {
-  padding-top: 5px;
   display: none; // Hidden on default persona
 }
 
@@ -312,7 +306,7 @@ $ms-Persona-presenceSizeXl: 28px;
 
   .primaryText {
     font-size: $ms-font-size-m;
-    padding-top: 4px;
+    line-height: $ms-Persona-sizeTiny;
   }
 
   .secondaryText {
@@ -339,9 +333,7 @@ $ms-Persona-presenceSizeXl: 28px;
 //
 .root.rootIsExtraExtraSmall {
   height: $ms-Persona-sizeXxs;
-  line-height: $ms-Persona-sizeXxs;
   min-width: $ms-Persona-sizeXxs;
-  margin-right: 4px;
 
   .imageArea,
   .image {
@@ -375,7 +367,7 @@ $ms-Persona-presenceSizeXl: 28px;
 
   .primaryText {
     font-size: $ms-font-size-m;
-    padding-top: 3px;
+    line-height: $ms-Persona-sizeXxs;
   }
 
   .secondaryText {
@@ -383,14 +375,13 @@ $ms-Persona-presenceSizeXl: 28px;
   }
 
   &.showSecondaryText {
-    height: 30px;
+    height: 32px;
 
     .primaryText,
     .secondaryText {
       display: block;
-      padding: 0;
-      line-height: 1;
-      overflow: visible;
+      height: 16px;
+      line-height: 16px;
     }
   }
 }
@@ -400,7 +391,6 @@ $ms-Persona-presenceSizeXl: 28px;
 //
 .root.rootIs28 {
   height: $ms-Persona-size28;
-  line-height: $ms-Persona-size28;
   min-width: $ms-Persona-size28;
   overflow: hidden;
 
@@ -436,7 +426,7 @@ $ms-Persona-presenceSizeXl: 28px;
 
   .primaryText {
     font-size: $ms-font-size-m;
-    padding-top: 3px;
+    line-height: $ms-Persona-size28;
   }
 
   .secondaryText {
@@ -444,12 +434,13 @@ $ms-Persona-presenceSizeXl: 28px;
   }
 
   &.showSecondaryText {
+    height: 32px;
+
     .primaryText,
     .secondaryText {
       display: block;
-      padding: 0;
-      line-height: 1;
-      overflow: visible;
+      line-height: 16px;
+      height: 16px;
     }
   }
 }
@@ -459,7 +450,6 @@ $ms-Persona-presenceSizeXl: 28px;
 //
 .root.rootIsExtraSmall {
   height: $ms-Persona-sizeXs;
-  line-height: $ms-Persona-sizeXs;
   min-width: $ms-Persona-sizeXs;
 
   .imageArea,
@@ -486,7 +476,7 @@ $ms-Persona-presenceSizeXl: 28px;
 
   .primaryText {
     font-size: $ms-font-size-m;
-    padding-top: 3px;
+    line-height: $ms-Persona-sizeXs;
   }
 
   .secondaryText {
@@ -497,9 +487,8 @@ $ms-Persona-presenceSizeXl: 28px;
     .primaryText,
     .secondaryText {
       display: block;
-      padding: 0;
-      line-height: 1;
-      overflow: visible;
+      height: 16px;
+      line-height: 16px;
     }
   }
 }
@@ -509,7 +498,6 @@ $ms-Persona-presenceSizeXl: 28px;
 //
 .root.rootIsSmall {
   height: $ms-Persona-sizeSm;
-  line-height: $ms-Persona-sizeSm;
   min-width: $ms-Persona-sizeSm;
 
   .imageArea,
@@ -537,11 +525,6 @@ $ms-Persona-presenceSizeXl: 28px;
   .primaryText {
     font-size: $ms-font-size-m;
   }
-
-  .primaryText,
-  .secondaryText {
-    padding-top: 1px;
-  }
 }
 
 
@@ -549,7 +532,6 @@ $ms-Persona-presenceSizeXl: 28px;
 //
 .root.rootIsLarge {
   height: $ms-Persona-sizeLg;
-  line-height: $ms-Persona-sizeLg;
   min-width: $ms-Persona-sizeLg;
 
   .imageArea,
@@ -582,12 +564,7 @@ $ms-Persona-presenceSizeXl: 28px;
     font-size: $ms-font-size-m;
   }
 
-  .secondaryText {
-    padding-top: 3px;
-  }
-
   .tertiaryText {
-    padding-top: 5px;
     display: block;
   }
 }
@@ -597,7 +574,6 @@ $ms-Persona-presenceSizeXl: 28px;
 //
 .root.rootIsExtraLarge {
   height: $ms-Persona-sizeXl;
-  line-height: $ms-Persona-sizeXl;
   min-width: $ms-Persona-sizeXl;
 
   .imageArea,
@@ -635,16 +611,10 @@ $ms-Persona-presenceSizeXl: 28px;
   .primaryText {
     font-size: $ms-font-size-xl;
     font-weight: $ms-font-weight-semilight;
-    margin-top: 0;
-  }
-
-  .secondaryText {
-    padding-top: 2px;
   }
 
   .tertiaryText,
   .optionalText {
-    padding-top: 5px;
     display: block; // Show tertiary and optional text
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index ea2a3412477d2..177ba0158fdb6 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -108,7 +108,9 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
         onKeyDown={ this.onKeyDown }>
         <FocusZone
           ref={ this._resolveRef('focusZone') }
-          direction={ FocusZoneDirection.horizontal }>
+          isCircularNavigation={ true }
+          direction={ FocusZoneDirection.bidirectional }
+          isInnerZoneKeystroke={ this._isFocusZoneInnerKeystroke }>
           <SelectionZone selection={ this.selection } selectionMode={ SelectionMode.multiple }>
             <div className={ css('ms-BasePicker-text', styles.pickerText) }>
               { this.renderItems() }
@@ -141,7 +143,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     return this.state.suggestionsVisible ? (
       <Callout
         isBeakVisible={ false }
-        gapSpace={ 0 }
+        gapSpace={ 5 }
         targetElement={ this.input.inputElement }
         onDismiss={ this.dismissSuggestions }
         directionalHint={ getRTL() ? DirectionalHint.bottomRightEdge : DirectionalHint.bottomLeftEdge }>
@@ -169,7 +171,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     return items.map((item, index) => onRenderItem({
       item,
       index,
-      key: index + this._getTextFromItem(item),
+      key: item.key ? item.key : index,
       selected: this.selection.isIndexSelected(index),
       onRemoveItem: () => this.removeItem(item),
       onItemChange: this.onItemChange
@@ -478,6 +480,19 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     }
   }
 
+  @autobind
+  protected _isFocusZoneInnerKeystroke(ev: React.KeyboardEvent<HTMLElement>): boolean {
+    // If suggestions are shown let up/down keys control them, otherwise allow them through to control the focusZone.
+    if (this.state.suggestionsVisible) {
+      switch (ev.which) {
+        case KeyCodes.up:
+        case KeyCodes.down:
+          return true;
+      }
+    }
+    return false;
+  }
+
   private _getTextFromItem(item: T, currentValue?: string): string {
     if (this.props.getTextFromItem) {
       return this.props.getTextFromItem(item, currentValue);
@@ -526,6 +541,8 @@ export class BasePickerListBelow<T, P extends IBasePickerProps<T>> extends BaseP
         { this.renderSuggestions() }
         <FocusZone ref={ this._resolveRef('focusZone') }
           className='ms-BasePicker-selectedItems'
+          isCircularNavigation={ true }
+          direction={ FocusZoneDirection.bidirectional }
           isInnerZoneKeystroke={ this._isFocusZoneInnerKeystroke } >
           { this.renderItems() }
         </FocusZone>
@@ -537,13 +554,4 @@ export class BasePickerListBelow<T, P extends IBasePickerProps<T>> extends BaseP
   protected onBackspace(ev: React.KeyboardEvent<HTMLElement>) {
     // override the existing backspace method to not do anything because the list items appear below.
   }
-
-  @autobind
-  private _isFocusZoneInnerKeystroke(ev: React.KeyboardEvent<HTMLElement>): boolean {
-    switch (ev.which) {
-      case KeyCodes.down:
-        return true;
-    }
-    return false;
-  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
index 2ded0bab09f5d..d4fad07ee1435 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
@@ -6,10 +6,11 @@
   display: inline-flex;
   align-items: center;
   background: $ms-color-neutralLighter;
-  margin: 1px;
+  margin: 1px 2px;
   cursor: default;
   user-select: none;
-  max-width: 180px;
+  max-width: 300px;
+  vertical-align: middle;
 
   &:hover {
     background: $ms-color-neutralLight;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index 235c7f89c2108..691553e1fa1e2 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -45,43 +45,13 @@ const limitedSearchAdditionalProps: IBasePickerSuggestionsProps = {
 const limitedSearchSuggestionProps: IBasePickerSuggestionsProps = assign(limitedSearchAdditionalProps, suggestionProps);
 
 export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerExampleState> {
-  private contextualMenuItems: IContextualMenuItem[] = [
-    {
-      key: 'newItem',
-      icon: 'circlePlus',
-      name: 'New'
-    },
-    {
-      key: 'upload',
-      icon: 'upload',
-      name: 'Upload'
-    },
-    {
-      key: 'divider_1',
-      name: '-',
-    },
-    {
-      key: 'rename',
-      name: 'Rename'
-    },
-    {
-      key: 'properties',
-      name: 'Properties'
-    },
-    {
-      key: 'disabled',
-      name: 'Disabled item',
-      disabled: true
-    }
-  ];
-
   constructor() {
     super();
     let peopleList = [];
     people.forEach((persona: IPersonaProps) => {
       let target: IPersonaWithMenu = {};
 
-      assign(target, persona, { menuItems: this.contextualMenuItems });
+      assign(target, persona);
       peopleList.push(target);
     });
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePickerExampleData.ts b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePickerExampleData.ts
index 871751efc82b3..9b250ada4ee1a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePickerExampleData.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePickerExampleData.ts
@@ -15,7 +15,6 @@ export const people: (IPersonaProps & { key: string | number })[] = [
   },
   {
     key: 1,
-
     imageUrl: TestImages.personaMale,
     imageInitials: 'AR',
     primaryText: 'Aaron Reid',
@@ -196,7 +195,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.away
   },
   {
-    key: 13,
+    key: 19,
     imageUrl: TestImages.personaMale,
     imageInitials: 'MS',
     primaryText: 'Maor Shorett',
@@ -206,7 +205,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.blocked
   },
   {
-    key: 12,
+    key: 20,
     imageUrl: TestImages.personaFemale,
     imageInitials: 'VL',
     primaryText: 'Valentina Lovrics',
@@ -216,7 +215,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.online
   },
   {
-    key: 13,
+    key: 21,
     imageUrl: TestImages.personaMale,
     imageInitials: 'MS',
     primaryText: 'Maor Sharet',
@@ -226,7 +225,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.online
   },
   {
-    key: 12,
+    key: 22,
     imageUrl: TestImages.personaFemale,
     imageInitials: 'VL',
     primaryText: 'Valentina Lovrecs',
@@ -236,7 +235,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.blocked
   },
   {
-    key: 13,
+    key: 23,
     imageUrl: TestImages.personaMale,
     imageInitials: 'MS',
     primaryText: 'Maor Sharitt',
@@ -246,7 +245,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.offline
   },
   {
-    key: 14,
+    key: 24,
     imageUrl: './images/persona-male.png',
     imageInitials: 'MS',
     primaryText: 'Maor Shariett',
@@ -256,7 +255,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.online
   },
   {
-    key: 14,
+    key: 25,
     imageUrl: './images/persona-female.png',
     imageInitials: 'AL',
     primaryText: 'Alix Lundburg',
@@ -266,7 +265,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.away
   },
   {
-    key: 15,
+    key: 26,
     imageUrl: './images/persona-female.png',
     imageInitials: 'VL',
     primaryText: 'Valantena Lovric',
@@ -276,7 +275,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.busy
   },
   {
-    key: 16,
+    key: 27,
     imageUrl: './images/persona-female.png',
     imageInitials: 'VL',
     primaryText: 'Velatine Lourvric',
@@ -286,7 +285,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.online
   },
   {
-    key: 16,
+    key: 28,
     imageUrl: './images/persona-female.png',
     imageInitials: 'VL',
     primaryText: 'Valentyna Lovrique',
@@ -296,7 +295,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.busy
   },
   {
-    key: 17,
+    key: 29,
     imageUrl: './images/persona-female.png',
     imageInitials: 'AL',
     primaryText: 'Annie Lindquest',
@@ -306,7 +305,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.dnd
   },
   {
-    key: 18,
+    key: 30,
     imageUrl: './images/persona-female.png',
     imageInitials: 'AL',
     primaryText: 'Anne Lindquist',
@@ -316,7 +315,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.blocked
   },
   {
-    key: 19,
+    key: 31,
     imageUrl: './images/persona-female.png',
     imageInitials: 'AL',
     primaryText: 'Ann Lindqiest',
@@ -326,7 +325,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.online
   },
   {
-    key: 20,
+    key: 32,
     imageUrl: './images/persona-male.png',
     imageInitials: 'AR',
     primaryText: 'Aron Reid',
@@ -336,7 +335,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.away
   },
   {
-    key: 21,
+    key: 33,
     imageUrl: './images/persona-male.png',
     imageInitials: 'AR',
     primaryText: 'Aaron Reed',
@@ -346,7 +345,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.offline
   },
   {
-    key: 21,
+    key: 34,
     imageUrl: './images/persona-female.png',
     imageInitials: 'AL',
     primaryText: 'Alix Lindberg',
@@ -356,7 +355,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.busy
   },
   {
-    key: 22,
+    key: 35,
     imageUrl: './images/persona-male.png',
     imageInitials: 'AL',
     primaryText: 'Alan Lindberg',
@@ -366,7 +365,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.busy
   },
   {
-    key: 23,
+    key: 36,
     imageUrl: './images/persona-male.png',
     imageInitials: 'MS',
     primaryText: 'Maor Sharit',
@@ -376,7 +375,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.offline
   },
   {
-    key: 24,
+    key: 37,
     imageUrl: './images/persona-male.png',
     imageInitials: 'MS',
     primaryText: 'Maorr Sherit',
@@ -386,7 +385,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.online
   },
   {
-    key: 25,
+    key: 38,
     imageUrl: './images/persona-male.png',
     imageInitials: 'AL',
     primaryText: 'Alex Lindbirg',
@@ -396,7 +395,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.dnd
   },
   {
-    key: 26,
+    key: 39,
     imageUrl: './images/persona-male.png',
     imageInitials: 'AL',
     primaryText: 'Alex Lindbarg',
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index 0d09f0e847cb0..9bab026069e1c 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -176,7 +176,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
         role='menu'>
         { suggestions.map((suggestion, index) =>
           <div ref={ this._resolveRef(suggestion.selected ? '_selectedElement' : '') }
-            key={ index }
+            key={ suggestion.item['key'] ? suggestion.item['key'] : index }
             id={ 'sug-' + index }
             role='menuitem'>
             <TypedSuggestionsItem

From f1437d6fa8f0e833efcdb7d5aa2e7de71ebd1e99 Mon Sep 17 00:00:00 2001
From: Eddie Liu <leddie24@gmail.com>
Date: Tue, 13 Jun 2017 18:56:41 -0700
Subject: [PATCH 0103/1641] Dropdown: Fix _onDropdownKeyDown focusing on
 Header/Separator option (#1846)

* Add _moveIndex method to find next available dropdown option on keypress up/down.  Add key prop to render header method. Add prevent scroll check on keypress up/down to prevent event propagation.

* add change file

* fix no-shadowed-var for newIndex

* fix in progress

* New fix for moving index

* Remove unused event param in moveIndex

* move options var after check for selectedIndex === index

* Change moveIndex method

* Add unit tests,  add jsdoc comments, change lets to consts, cleanup _onDropdownKeyDown

* Add step counter to break out of Header or Separator only list.  Change from recursion to simple assignment for index

* code cleanup

* Reset example options

* Set itemType to Normal as default

* Return selectedIndex if options is empty.  move stepCounter close to while loop
---
 ...-edwliu-dropdown-fix_2017-05-23-21-07.json | 10 +++
 package.json                                  |  2 +-
 .../src/components/Dropdown/Dropdown.test.tsx | 87 ++++++++++++++++++-
 .../src/components/Dropdown/Dropdown.tsx      | 71 +++++++++++++--
 .../examples/Dropdown.Basic.Example.tsx       |  2 +-
 5 files changed, 158 insertions(+), 14 deletions(-)
 create mode 100644 common/changes/v-edwliu-dropdown-fix_2017-05-23-21-07.json

diff --git a/common/changes/v-edwliu-dropdown-fix_2017-05-23-21-07.json b/common/changes/v-edwliu-dropdown-fix_2017-05-23-21-07.json
new file mode 100644
index 0000000000000..72a180c43fa1f
--- /dev/null
+++ b/common/changes/v-edwliu-dropdown-fix_2017-05-23-21-07.json
@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: Fix keyboard focus on Header/Separator items",
+      "type": "patch"
+    }
+  ],
+  "email": "v-edwliu@microsoft.com"
+}
\ No newline at end of file
diff --git a/package.json b/package.json
index 28ebb32f0eeec..7a84505619937 100644
--- a/package.json
+++ b/package.json
@@ -28,4 +28,4 @@
     "gulp": "^3.9.1",
     "yargs": "^6.5.0"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
index b4b28fcf37ad3..1e454c719dd8d 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
@@ -6,13 +6,22 @@ import * as ReactTestUtils from 'react-addons-test-utils';
 
 let { expect } = chai;
 
+import {
+  KeyCodes,
+} from '../../Utilities';
 import { Dropdown } from './Dropdown';
-import { IDropdownOption } from './Dropdown.Props';
+import { DropdownMenuItemType, IDropdownOption } from './Dropdown.Props';
 
 const DEFAULT_OPTIONS: IDropdownOption[] = [
+  { key: 'Header1', text: 'Header 1', itemType: DropdownMenuItemType.Header },
   { key: '1', text: '1' },
   { key: '2', text: '2' },
-  { key: '3', text: '3' }
+  { key: '3', text: '3' },
+  { key: 'Divider1', text: '-', itemType: DropdownMenuItemType.Divider },
+  { key: 'Header2', text: 'Header 2', itemType: DropdownMenuItemType.Header },
+  { key: '4', text: '4' },
+  { key: '5', text: '5' },
+  { key: '6', text: '6' },
 ];
 
 describe('Dropdown', () => {
@@ -108,7 +117,7 @@ describe('Dropdown', () => {
 
       ReactTestUtils.Simulate.click(dropdownRoot);
 
-      let secondItemElement = document.querySelector('.ms-Dropdown-item[data-index="1"]');
+      let secondItemElement = document.querySelector('.ms-Dropdown-item[data-index="2"]');
       ReactTestUtils.Simulate.click(secondItemElement);
     }
     finally {
@@ -116,4 +125,76 @@ describe('Dropdown', () => {
     }
   });
 
+  it('Will select the first valid item on keypress', () => {
+    let container = document.createElement('div');
+
+    ReactDOM.render(
+      <Dropdown
+        label='testgroup'
+        options={ DEFAULT_OPTIONS }
+      />,
+      container);
+    let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+    ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
+
+    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title');
+    expect(titleElement.textContent).equals('1');
+  });
+
+  it('Will select the first valid item on Home keypress', () => {
+    let container = document.createElement('div');
+
+    ReactDOM.render(
+      <Dropdown
+        label='testgroup'
+        options={ DEFAULT_OPTIONS }
+      />,
+      container);
+    let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+    ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.home });
+
+    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title');
+    expect(titleElement.textContent).equals('1');
+  });
+
+  it('Will select the last valid item on End keypress', () => {
+    let container = document.createElement('div');
+
+    ReactDOM.render(
+      <Dropdown
+        label='testgroup'
+        options={ DEFAULT_OPTIONS }
+      />,
+      container);
+    let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+    ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.end });
+
+    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title');
+    expect(titleElement.textContent).equals('6');
+  });
+
+  it('Will skip over headers and separators on keypress', () => {
+    let container = document.createElement('div');
+    let dropdownRoot;
+    let titleElement;
+
+    document.body.appendChild(container);
+    ReactDOM.render(
+      <Dropdown
+        label='testgroup'
+        options={ DEFAULT_OPTIONS }
+      />,
+      container);
+    dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+
+    ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
+    titleElement = dropdownRoot.querySelector('.ms-Dropdown-title');
+    expect(titleElement.textContent).equals('1');
+
+    ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
+    ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
+    ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
+    titleElement = dropdownRoot.querySelector('.ms-Dropdown-title');
+    expect(titleElement.textContent).equals('4');
+  });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 29a8e2cf4e992..e25cdd7216967 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -20,7 +20,7 @@ import {
 import * as stylesImport from './Dropdown.scss';
 const styles: any = stylesImport;
 
-// Internal only props iterface to support mixing in responsive mode
+// Internal only props interface to support mixing in responsive mode
 export interface IDropdownInternalProps extends IDropdownProps, IWithResponsiveModeState {
 
 }
@@ -51,6 +51,11 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   private _id: string;
 
   constructor(props?: IDropdownProps) {
+    props.options.forEach((option) => {
+      if (!option.itemType) {
+        option.itemType = DropdownMenuItemType.Normal;
+      }
+    });
     super(props);
 
     this._warnDeprecations({
@@ -197,6 +202,47 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     }
   }
 
+  /**
+   * Finds the next valid Dropdown option and sets the selected index to it.
+   * @param stepValue Value of how many items the function should traverse.  Should be -1 or 1.
+   * @param index Index of where the search should start
+   * @param selectedIndex The selectedIndex Dropdown's state
+   * @returns The next valid dropdown option's index
+   */
+  private _moveIndex(stepValue: number, index: number, selectedIndex: number): number {
+    const { options } = this.props;
+    // Return selectedIndex if nothing has changed or options is empty
+    if (selectedIndex === index || options.length === 0) {
+      return selectedIndex;
+    }
+
+    // Set starting index to 0 if index is < 0
+    if (index < 0) {
+      index = 0;
+    }
+    // Set starting index to last option index if greater than options.length
+    if (index >= options.length) {
+      index = options.length - 1;
+    }
+    let stepCounter = 0;
+    // If current index is a header or divider, increment by step
+    while (options[index].itemType !== DropdownMenuItemType.Normal) {
+      // If stepCounter exceeds length of options, then return selectedIndex (-1)
+      if (stepCounter >= options.length) {
+        return selectedIndex;
+      }
+      // If index + stepValue is out of bounds, reverse step direction
+      if (index + stepValue < 0 || index + stepValue >= options.length) {
+        stepValue *= -1;
+      }
+      index = index + stepValue;
+      stepCounter++;
+    }
+
+    this.setSelectedIndex(index);
+    return index;
+  }
+
   // Render text in dropdown input
   @autobind
   private _onRenderTitle(item: IDropdownOption): JSX.Element {
@@ -305,9 +351,11 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   private _renderHeader(item: IDropdownOption): JSX.Element {
-    let { onRenderOption = this._onRenderOption } = this.props;
+    const { onRenderOption = this._onRenderOption } = this.props;
+    const { key } = item;
     return (
-      <div className={ css('ms-Dropdown-header', styles.header) }>
+      <div key={ key }
+        className={ css('ms-Dropdown-header', styles.header) }>
         { onRenderOption(item, this._onRenderOption) }
       </div>);
   }
@@ -369,6 +417,9 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
 
   @autobind
   private _onDropdownKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+    let newIndex: number;
+    const { selectedIndex } = this.state;
+
     switch (ev.which) {
       case KeyCodes.enter:
         this.setState({
@@ -387,23 +438,23 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
         break;
 
       case KeyCodes.up:
-        this.setSelectedIndex(this.state.selectedIndex - 1);
+        newIndex = this._moveIndex(-1, selectedIndex - 1, selectedIndex);
         break;
 
       case KeyCodes.down:
         if (ev.altKey || ev.metaKey) {
           this.setState({ isOpen: true });
         } else {
-          this.setSelectedIndex(this.state.selectedIndex + 1);
+          newIndex = this._moveIndex(1, selectedIndex + 1, selectedIndex);
         }
         break;
 
       case KeyCodes.home:
-        this.setSelectedIndex(0);
+        newIndex = this._moveIndex(1, 0, selectedIndex);
         break;
 
       case KeyCodes.end:
-        this.setSelectedIndex(this.props.options.length - 1);
+        newIndex = this._moveIndex(-1, this.props.options.length - 1, selectedIndex);
         break;
 
       case KeyCodes.space:
@@ -414,8 +465,10 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
         return;
     }
 
-    ev.stopPropagation();
-    ev.preventDefault();
+    if (newIndex !== selectedIndex) {
+      ev.stopPropagation();
+      ev.preventDefault();
+    }
   }
 
   @autobind
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
index ee753c5ff4f6f..43bf14093a8f1 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
@@ -31,7 +31,7 @@ export class DropdownBasicExample extends React.Component<any, any> {
               { key: 'D', text: 'Option d' },
               { key: 'E', text: 'Option e' },
               { key: 'divider_2', text: '-', itemType: DropdownMenuItemType.Divider },
-              { key: 'Header', text: 'People', itemType: DropdownMenuItemType.Header },
+              { key: 'Header2', text: 'People', itemType: DropdownMenuItemType.Header },
               { key: 'F', text: 'Option f' },
               { key: 'G', text: 'Option g' },
               { key: 'H', text: 'Option h' },

From 79f1c3c5ed9ae63c1e035c67ad81a31b997bbe78 Mon Sep 17 00:00:00 2001
From: Abhinav Singh Teotia <abhinavsingh.bits@gmail.com>
Date: Wed, 14 Jun 2017 07:29:05 +0530
Subject: [PATCH 0104/1641] FocusZone should reset active element if it is not
 tabbable. This (#1958)

* FocusZone should reset active element if it is not tabbable. This
allows accessibility of rest of elements thru keybord in case of active
element changing state to disabled.

* Typo fixed

* Change file
---
 ...-AccessibilityBugFix_2017-06-08-16-01.json | 11 ++++
 .../components/FocusZone/FocusZone.test.tsx   | 50 +++++++++++++++++++
 .../src/components/FocusZone/FocusZone.tsx    | 13 +++--
 3 files changed, 71 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-AbhinavSinghT-AccessibilityBugFix_2017-06-08-16-01.json

diff --git a/common/changes/office-ui-fabric-react/users-AbhinavSinghT-AccessibilityBugFix_2017-06-08-16-01.json b/common/changes/office-ui-fabric-react/users-AbhinavSinghT-AccessibilityBugFix_2017-06-08-16-01.json
new file mode 100644
index 0000000000000..9ee7de96b2fec
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-AbhinavSinghT-AccessibilityBugFix_2017-06-08-16-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "FocusZone should reset active element if it is not tabbable.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "abhinavsingh.bits@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
index 3eed527eb7207..4483b1b6eca10 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
@@ -589,4 +589,54 @@ describe('FocusZone', () => {
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
     assert(lastFocusedElement === divB, 'pressing left did not skip back to divB');
   });
+
+  it('Focus first tabbable element, when active elemet is dynamically disabled', () => {
+    let focusZone: FocusZone = null;
+    let buttonA, buttonB = null;
+    const component = ReactTestUtils.renderIntoDocument(
+      <div { ...{ onFocusCapture: _onFocus } }>
+        <textarea className='t'></textarea>
+        <FocusZone ref={(focus) => { focusZone = focus; }}>
+          <button className='a' ref={(button) => { buttonA = button; }}>a</button>
+          <button className='b' ref={(button) => { buttonB = button; }}>b</button>
+        </FocusZone>
+      </div>
+    );
+
+    const rootNode = ReactDOM.findDOMNode(component as React.ReactInstance) as Element;
+    const textArea = rootNode.children[0];
+    const focusZoneElement = rootNode.children[1];
+
+    setupElement(buttonA, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 0,
+        right: 20
+      }
+    });
+
+    setupElement(buttonB, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 20,
+        right: 40
+      }
+    });
+
+    // ButtonA should be focussed.
+    focusZone.focus();
+    assert(lastFocusedElement === buttonA, 'buttonA was not focused');
+
+    buttonA.disabled = true;
+
+    // Focus the text area, outside focus zone.
+    ReactTestUtils.Simulate.focus(textArea);
+    assert(lastFocusedElement === textArea, 'textArea was not focused');
+
+    // ButtonB should be focussed.
+    focusZone.focus();
+    assert(lastFocusedElement === buttonB, 'buttonB was not focused ');
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 62f6be3ff89ab..2a9f7e9315a0c 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -135,9 +135,10 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     if (!forceIntoFirstElement && this.refs.root.getAttribute(IS_FOCUSABLE_ATTRIBUTE) === 'true' && this._isInnerZone) {
       // The parent focus zone should take responsibility for focusing this element.
       return true;
-    } else if (this._activeElement && elementContains(this.refs.root, this._activeElement)) {
-      this._activeElement.focus();
-      return true;
+     } else if (this._activeElement && elementContains(this.refs.root, this._activeElement)
+        && isElementTabbable(this._activeElement)) {
+        this._activeElement.focus();
+        return true;
     } else {
       const firstChild = this.refs.root.firstChild as HTMLElement;
 
@@ -642,6 +643,12 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       }
     }
 
+    // If active element changes state to disabled, set it to null. 
+    // Otherwise, we lose keyboard accessibility to other elements in focus zone.
+    if (this._activeElement && !isElementTabbable(this._activeElement)) {
+      this._activeElement = null;
+    }
+
     const childNodes = element.children;
 
     for (let childIndex = 0; childNodes && childIndex < childNodes.length; childIndex++) {

From d4527911db0d3c4bbdc74473e3d7d996c182b444 Mon Sep 17 00:00:00 2001
From: Chad Sheets <cjsheets@gmail.com>
Date: Tue, 13 Jun 2017 19:00:34 -0700
Subject: [PATCH 0105/1641] Focus Utility should respect tabindex="-1" on
 tabable elements (#1960)

* Respect tabindex -1 on tabbable elements

* add undefined condition

* add test and fix condition

* add change request file
---
 .../@uifabric/utilities/master_2017-06-09-15-37.json  | 11 +++++++++++
 packages/utilities/src/focus.test.tsx                 |  9 +++++++++
 packages/utilities/src/focus.ts                       |  2 +-
 3 files changed, 21 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/utilities/master_2017-06-09-15-37.json

diff --git a/common/changes/@uifabric/utilities/master_2017-06-09-15-37.json b/common/changes/@uifabric/utilities/master_2017-06-09-15-37.json
new file mode 100644
index 0000000000000..cd0e5b9ae8778
--- /dev/null
+++ b/common/changes/@uifabric/utilities/master_2017-06-09-15-37.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Focus Utility should respect tabindex=-1 on tabable elements",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "cjsheets@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/src/focus.test.tsx b/packages/utilities/src/focus.test.tsx
index 3d60e27f07190..cca238d394515 100644
--- a/packages/utilities/src/focus.test.tsx
+++ b/packages/utilities/src/focus.test.tsx
@@ -123,4 +123,13 @@ describe('isElementTabbable', () => {
     expect(isElementTabbable(button)).is.false;
   });
 
+  it('returns false when tabindex=-1', () => {
+    let button = document.createElement('button');
+
+    button.setAttribute('tabindex', '-1');
+
+    expect(isElementTabbable(button)).is.false;
+
+  });
+
 });
\ No newline at end of file
diff --git a/packages/utilities/src/focus.ts b/packages/utilities/src/focus.ts
index 139b2d5b0011f..4ada29e842278 100644
--- a/packages/utilities/src/focus.ts
+++ b/packages/utilities/src/focus.ts
@@ -199,11 +199,11 @@ export function isElementTabbable(element: HTMLElement): boolean {
 
   return (
     !!element && isFocusableAttribute !== 'false' &&
+    tabIndex >= 0 || !tabIndex &&
     (element.tagName === 'A' ||
       (element.tagName === 'BUTTON') ||
       (element.tagName === 'INPUT') ||
       (element.tagName === 'TEXTAREA') ||
-      (tabIndex >= 0) ||
       (element.getAttribute && (
         isFocusableAttribute === 'true' ||
         element.getAttribute('role') === 'button'

From 560719e7fc887c52b3ffc96cba08f9115b5c03e7 Mon Sep 17 00:00:00 2001
From: Mike Wheaton <miwhea@microsoft.com>
Date: Tue, 13 Jun 2017 19:01:25 -0700
Subject: [PATCH 0106/1641] Update icons to version 2.30 (#1925)

* Remove comments from IconCodes to match output from the icon font viewer

* Update icon font path to include the version number

* Update icon codes to those in 2.30

* Add change file
---
 .../miwhea-icons-2.30_2017-06-08-19-15.json   |   11 +
 .../styling/src/styles/DefaultFontStyles.ts   |    3 +-
 packages/styling/src/styles/IconCodes.ts      | 2622 +++--------------
 3 files changed, 466 insertions(+), 2170 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/miwhea-icons-2.30_2017-06-08-19-15.json

diff --git a/common/changes/@uifabric/styling/miwhea-icons-2.30_2017-06-08-19-15.json b/common/changes/@uifabric/styling/miwhea-icons-2.30_2017-06-08-19-15.json
new file mode 100644
index 0000000000000..891b9343488ff
--- /dev/null
+++ b/common/changes/@uifabric/styling/miwhea-icons-2.30_2017-06-08-19-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Updates to version 2.30 of the icon font",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "miwhea@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/styling/src/styles/DefaultFontStyles.ts b/packages/styling/src/styles/DefaultFontStyles.ts
index f3f387671d4c4..0645e53b30690 100644
--- a/packages/styling/src/styles/DefaultFontStyles.ts
+++ b/packages/styling/src/styles/DefaultFontStyles.ts
@@ -174,6 +174,7 @@ function _registerDefaultFontFaces(): void {
   if (baseUrl) {
     const fontUrl = `${baseUrl}/fonts`;
     const iconUrl = `${baseUrl}/icons`;
+    const iconVersion = '2.30';
 
     // Produce @font-face definitions for all supported web fonts.
     _registerFontFaceSet(fontUrl, FontNameThai, 'leelawadeeui-thai', 'leelawadeeui');
@@ -195,7 +196,7 @@ function _registerDefaultFontFaces(): void {
     _registerFontFace('Leelawadee UI Web', `${fontUrl}/leelawadeeui-thai/leelawadeeui-bold`, FontWeights.semibold);
 
     // Register icon urls.
-    _registerFontFace('FabricMDL2Icons', `${iconUrl}/fabricmdl2icons`, FontWeights.regular);
+    _registerFontFace('FabricMDL2Icons', `${iconUrl}/fabricmdl2icons-${iconVersion}`, FontWeights.regular);
   }
 }
 
diff --git a/packages/styling/src/styles/IconCodes.ts b/packages/styling/src/styles/IconCodes.ts
index 1461a370e495b..41bc017911fad 100644
--- a/packages/styling/src/styles/IconCodes.ts
+++ b/packages/styling/src/styles/IconCodes.ts
@@ -1,2830 +1,1114 @@
 export const IconCodes = {
-  /**
-   * Icon code with the value '\uED68'.
-   */
   aadLogo: '\uED68',
-  /**
-   * Icon code with the value '\uE8FB'.
-   */
   accept: '\uE8FB',
-  /**
-   * Icon code with the value '\uED69'.
-   */
   accessLogo: '\uED69',
-  /**
-   * Icon code with the value '\uE910'.
-   */
+  accessLogoFill: '\uF1DB',
   accounts: '\uE910',
-  /**
-   * Icon code with the value '\uE710'.
-   */
+  activityFeed: '\uF056',
   add: '\uE710',
-  /**
-   * Icon code with the value '\uEEB5'.
-   */
   addEvent: '\uEEB5',
-  /**
-   * Icon code with the value '\uF0C8'.
-   */
   addFavorite: '\uF0C8',
-  /**
-   * Icon code with the value '\uF0C9'.
-   */
   addFavoriteFill: '\uF0C9',
-  /**
-   * Icon code with the value '\uE8FA'.
-   */
   addFriend: '\uE8FA',
-  /**
-   * Icon code with the value '\uEE3D'.
-   */
   addGroup: '\uEE3D',
-  /**
-   * Icon code with the value '\uED8E'.
-   */
   addOnlineMeeting: '\uED8E',
-  /**
-   * Icon code with the value '\uED96'.
-   */
   addPhone: '\uED96',
-  /**
-   * Icon code with the value '\uECC8'.
-   */
   addTo: '\uECC8',
-  /**
-   * Icon code with the value '\uE7EF'.
-   */
   admin: '\uE7EF',
-  /**
-   * Icon code with the value '\uED6A'.
-   */
   adminALogo: '\uED6A',
-  /**
-   * Icon code with the value '\uED6B'.
-   */
   adminCLogo: '\uED6B',
-  /**
-   * Icon code with the value '\uED6C'.
-   */
   adminDLogo: '\uED6C',
-  /**
-   * Icon code with the value '\uED6D'.
-   */
   adminELogo: '\uED6D',
-  /**
-   * Icon code with the value '\uED6E'.
-   */
   adminLLogo: '\uED6E',
-  /**
-   * Icon code with the value '\uED6F'.
-   */
   adminMLogo: '\uED6F',
-  /**
-   * Icon code with the value '\uED70'.
-   */
   adminOLogo: '\uED70',
-  /**
-   * Icon code with the value '\uED71'.
-   */
   adminPLogo: '\uED71',
-  /**
-   * Icon code with the value '\uED72'.
-   */
   adminSLogo: '\uED72',
-  /**
-   * Icon code with the value '\uED73'.
-   */
   adminYLogo: '\uED73',
-  /**
-   * Icon code with the value '\uEF7A'.
-   */
-  airTickets: '\uEF7A',
-  /**
-   * Icon code with the value '\uE709'.
-   */
   airplane: '\uE709',
-  /**
-   * Icon code with the value '\uE919'.
-   */
+  airplaneSolid: '\uEB4C',
+  airTickets: '\uEF7A',
   alarmClock: '\uE919',
-  /**
-   * Icon code with the value '\uE7AB'.
-   */
   album: '\uE7AB',
-  /**
-   * Icon code with the value '\uEC62'.
-   */
   albumRemove: '\uEC62',
-  /**
-   * Icon code with the value '\uED74'.
-   */
-  alchemyLogo: '\uED74',
-  /**
-   * Icon code with the value '\uE8E3'.
-   */
+  alertSolid: '\uF331',
   alignCenter: '\uE8E3',
-  /**
-   * Icon code with the value '\uE8E4'.
-   */
   alignLeft: '\uE8E4',
-  /**
-   * Icon code with the value '\uE8E2'.
-   */
   alignRight: '\uE8E2',
-  /**
-   * Icon code with the value '\uEF8B'.
-   */
+  analyticsLogo: '\uF1DE',
+  analyticsQuery: '\uF1DF',
+  analyticsReport: '\uF1E1',
   androidLogo: '\uEF8B',
-  /**
-   * Icon code with the value '\uE924'.
-   */
   annotation: '\uE924',
-  /**
-   * Icon code with the value '\uEEC7'.
-   */
-  appForOfficeLogo: '\uEEC7',
-  /**
-   * Icon code with the value '\uECAA'.
-   */
   appIconDefault: '\uECAA',
-  /**
-   * Icon code with the value '\uEB34'.
-   */
+  archive: '\uF03F',
+  areaChart: '\uE9D2',
   arrivals: '\uEB34',
-  /**
-   * Icon code with the value '\uEED5'.
-   */
   arrowDownRight8: '\uEED5',
-  /**
-   * Icon code with the value '\uEEF0'.
-   */
   arrowDownRightMirrored8: '\uEEF0',
-  /**
-   * Icon code with the value '\uEED4'.
-   */
+  arrowTallDownLeft: '\uF2BF',
+  arrowTallDownRight: '\uF2C0',
+  arrowTallUpLeft: '\uF2BD',
+  arrowTallUpRight: '\uF2BE',
   arrowUpRight8: '\uEED4',
-  /**
-   * Icon code with the value '\uEEEF'.
-   */
   arrowUpRightMirrored8: '\uEEEF',
-  /**
-   * Icon code with the value '\uEAC1'.
-   */
   articles: '\uEAC1',
-  /**
-   * Icon code with the value '\uEDC0'.
-   */
   ascending: '\uEDC0',
-  /**
-   * Icon code with the value '\uEEB6'.
-   */
+  assessmentGroup: '\uF31A',
+  assessmentGroupTemplate: '\uF2B1',
   assetLibrary: '\uEEB6',
-  /**
-   * Icon code with the value '\uEA38'.
-   */
+  assign: '\uE9D3',
   asterisk: '\uEA38',
-  /**
-   * Icon code with the value '\uEF85'.
-   */
+  asteriskSolid: '\uF34D',
   atpLogo: '\uEF85',
-  /**
-   * Icon code with the value '\uE723'.
-   */
   attach: '\uE723',
-  /**
-   * Icon code with the value '\uEE70'.
-   */
   australianRules: '\uEE70',
-  /**
-   * Icon code with the value '\uE78E'.
-   */
   autoEnhanceOff: '\uE78E',
-  /**
-   * Icon code with the value '\uE78D'.
-   */
   autoEnhanceOn: '\uE78D',
-  /**
-   * Icon code with the value '\uEB24'.
-   */
+  autoFillTemplate: '\uF313',
   autoRacing: '\uEB24',
-  /**
-   * Icon code with the value '\uEE6A'.
-   */
   awayStatus: '\uEE6A',
-  /**
-   * Icon code with the value '\uEB6A'.
-   */
+  azureAPIManagement: '\uF37F',
+  azureKeyVault: '\uF3B4',
   azureLogo: '\uEB6A',
-  /**
-   * Icon code with the value '\uE72B'.
-   */
+  azureServiceEndpoint: '\uF380',
   back: '\uE72B',
-  /**
-   * Icon code with the value '\uE73F'.
-   */
+  backlog: '\uF2AC',
   backToWindow: '\uE73F',
-  /**
-   * Icon code with the value '\uEC1B'.
-   */
   badge: '\uEC1B',
-  /**
-   * Icon code with the value '\uED7E'.
-   */
   balloons: '\uED7E',
-  /**
-   * Icon code with the value '\uEAE7'.
-   */
+  bankSolid: '\uF34F',
   barChart4: '\uEAE7',
-  /**
-   * Icon code with the value '\uE9EB'.
-   */
   barChartHorizontal: '\uE9EB',
-  /**
-   * Icon code with the value '\uEB20'.
-   */
+  barChartVertical: '\uE9EC',
   baseball: '\uEB20',
-  /**
-   * Icon code with the value '\uE9AA'.
-   */
   bidiLtr: '\uE9AA',
-  /**
-   * Icon code with the value '\uE9AB'.
-   */
   bidiRtl: '\uE9AB',
-  /**
-   * Icon code with the value '\uEB6B'.
-   */
   bingLogo: '\uEB6B',
-  /**
-   * Icon code with the value '\uE8F8'.
-   */
   blockContact: '\uE8F8',
-  /**
-   * Icon code with the value '\uECE4'.
-   */
-  blocked2: '\uECE4',
-  /**
-   * Icon code with the value '\uE733'.
-   */
   blocked: '\uE733',
-  /**
-   * Icon code with the value '\uE9C9'.
-   */
+  blocked2: '\uECE4',
   blowingSnow: '\uE9C9',
-  /**
-   * Icon code with the value '\uEF68'.
-   */
+  blur: '\uF28E',
   boards: '\uEF68',
-  /**
-   * Icon code with the value '\uE8DD'.
-   */
   bold: '\uE8DD',
-  /**
-   * Icon code with the value '\uEDC7'.
-   */
   bookingsLogo: '\uEDC7',
-  /**
-   * Icon code with the value '\uE8A4'.
-   */
   bookmarks: '\uE8A4',
-  /**
-   * Icon code with the value '\uEA41'.
-   */
   bookmarksMirrored: '\uEA41',
-  /**
-   * Icon code with the value '\uED75'.
-   */
+  boxAdditionSolid: '\uF2D4',
+  boxCheckmarkSolid: '\uF2D7',
   boxLogo: '\uED75',
-  /**
-   * Icon code with the value '\uF173'.
-   */
+  boxMultiplySolid: '\uF2D5',
+  boxPlaySolid: '\uF2D6',
+  boxSubtractSolid: '\uF2D3',
+  branchCommit: '\uF293',
+  branchCompare: '\uF294',
   branchFork: '\uF173',
-  /**
-   * Icon code with the value '\uEF8C'.
-   */
+  branchFork2: '\uF291',
+  branchLocked: '\uF292',
+  branchMerge: '\uF295',
+  branchPullRequest: '\uF296',
+  branchSearch: '\uF297',
+  branchShelveset: '\uF298',
   breadcrumb: '\uEF8C',
-  /**
-   * Icon code with the value '\uE706'.
-   */
   brightness: '\uE706',
-  /**
-   * Icon code with the value '\uEA99'.
-   */
   broom: '\uEA99',
-  /**
-   * Icon code with the value '\uF0D0'.
-   */
+  bucketColor: '\uF1B6',
+  bucketColorFill: '\uF1B7',
   bufferTimeAfter: '\uF0D0',
-  /**
-   * Icon code with the value '\uF0CF'.
-   */
   bufferTimeBefore: '\uF0CF',
-  /**
-   * Icon code with the value '\uF0D1'.
-   */
   bufferTimeBoth: '\uF0D1',
-  /**
-   * Icon code with the value '\uE8FD'.
-   */
+  bugSolid: '\uF335',
+  build: '\uF28F',
+  buildIssue: '\uF319',
+  buildQueue: '\uF24F',
+  buildQueueNew: '\uF250',
   bulletedList: '\uE8FD',
-  /**
-   * Icon code with the value '\uEA42'.
-   */
+  bulletedList2: '\uF2C7',
+  bulletedList2Mirrored: '\uF2C8',
   bulletedListMirrored: '\uEA42',
-  /**
-   * Icon code with the value '\uEB47'.
-   */
+  businessHoursSign: '\uF310',
   busSolid: '\uEB47',
-  /**
-   * Icon code with the value '\uEC32'.
-   */
   cafe: '\uEC32',
-  /**
-   * Icon code with the value '\uECA4'.
-   */
   cake: '\uECA4',
-  /**
-   * Icon code with the value '\uE948'.
-   */
   calculatorAddition: '\uE948',
-  /**
-   * Icon code with the value '\uE949'.
-   */
+  calculatorEqualTo: '\uE94E',
+  calculatorMultiply: '\uE947',
+  calculatorNotEqualTo: '\uF2D2',
   calculatorSubtract: '\uE949',
-  /**
-   * Icon code with the value '\uE787'.
-   */
   calendar: '\uE787',
-  /**
-   * Icon code with the value '\uEE9A'.
-   */
   calendarAgenda: '\uEE9A',
-  /**
-   * Icon code with the value '\uE8BF'.
-   */
   calendarDay: '\uE8BF',
-  /**
-   * Icon code with the value '\uED28'.
-   */
   calendarMirrored: '\uED28',
-  /**
-   * Icon code with the value '\uE8F5'.
-   */
   calendarReply: '\uE8F5',
-  /**
-   * Icon code with the value '\uE8C0'.
-   */
   calendarWeek: '\uE8C0',
-  /**
-   * Icon code with the value '\uEF51'.
-   */
   calendarWorkWeek: '\uEF51',
-  /**
-   * Icon code with the value '\uF172'.
-   */
   caloriesAdd: '\uF172',
-  /**
-   * Icon code with the value '\uE722'.
-   */
   camera: '\uE722',
-  /**
-   * Icon code with the value '\uE711'.
-   */
   cancel: '\uE711',
-  /**
-   * Icon code with the value '\uE804'.
-   */
+  cannedChat: '\uF0F2',
   car: '\uE804',
-  /**
-   * Icon code with the value '\uF121'.
-   */
+  caretBottomLeftCenter8: '\uF365',
   caretBottomLeftSolid8: '\uF121',
-  /**
-   * Icon code with the value '\uF122'.
-   */
+  caretBottomRightCenter8: '\uF364',
   caretBottomRightSolid8: '\uF122',
-  /**
-   * Icon code with the value '\uEDD8'.
-   */
   caretDown8: '\uEDD8',
-  /**
-   * Icon code with the value '\uEDDC'.
-   */
   caretDownSolid8: '\uEDDC',
-  /**
-   * Icon code with the value '\uE817'.
-   */
   caretHollow: '\uE817',
-  /**
-   * Icon code with the value '\uEA45'.
-   */
   caretHollowMirrored: '\uEA45',
-  /**
-   * Icon code with the value '\uEDD5'.
-   */
   caretLeft8: '\uEDD5',
-  /**
-   * Icon code with the value '\uEDD9'.
-   */
   caretLeftSolid8: '\uEDD9',
-  /**
-   * Icon code with the value '\uEDD6'.
-   */
+  caretRight: '\uF06B',
   caretRight8: '\uEDD6',
-  /**
-   * Icon code with the value '\uEDDA'.
-   */
   caretRightSolid8: '\uEDDA',
-  /**
-   * Icon code with the value '\uE818'.
-   */
   caretSolid: '\uE818',
-  /**
-   * Icon code with the value '\uEA46'.
-   */
+  caretSolid16: '\uEE62',
+  caretSolidDown: '\uF08E',
+  caretSolidLeft: '\uF08D',
   caretSolidMirrored: '\uEA46',
-  /**
-   * Icon code with the value '\uEF54'.
-   */
+  caretSolidRight: '\uF08F',
+  caretSolidUp: '\uF090',
+  caretTopLeftCenter8: '\uF367',
   caretTopLeftSolid8: '\uEF54',
-  /**
-   * Icon code with the value '\uEF55'.
-   */
+  caretTopRightCenter8: '\uF366',
   caretTopRightSolid8: '\uEF55',
-  /**
-   * Icon code with the value '\uEDD7'.
-   */
   caretUp8: '\uEDD7',
-  /**
-   * Icon code with the value '\uEDDB'.
-   */
   caretUpSolid8: '\uEDDB',
-  /**
-   * Icon code with the value '\uED7F'.
-   */
   cat: '\uED7F',
-  /**
-   * Icon code with the value '\uE8EA'.
-   */
   cellPhone: '\uE8EA',
-  /**
-   * Icon code with the value '\uEB95'.
-   */
   certificate: '\uEB95',
-  /**
-   * Icon code with the value '\uE999'.
-   */
   chart: '\uE999',
-  /**
-   * Icon code with the value '\uE901'.
-   */
   chat: '\uE901',
-  /**
-   * Icon code with the value '\uECFE'.
-   */
   chatInviteFriend: '\uECFE',
-  /**
-   * Icon code with the value '\uE9D5'.
-   */
-  checkList: '\uE9D5',
-  /**
-   * Icon code with the value '\uE73E'.
-   */
-  checkMark: '\uE73E',
-  /**
-   * Icon code with the value '\uE739'.
-   */
+  chatSolid: '\uF344',
   checkbox: '\uE739',
-  /**
-   * Icon code with the value '\uE73A'.
-   */
   checkboxComposite: '\uE73A',
-  /**
-   * Icon code with the value '\uE73C'.
-   */
+  checkboxCompositeReversed: '\uE73D',
   checkboxIndeterminate: '\uE73C',
-  /**
-   * Icon code with the value '\uE70D'.
-   */
+  checkList: '\uE9D5',
+  checkMark: '\uE73E',
   chevronDown: '\uE70D',
-  /**
-   * Icon code with the value '\uE972'.
-   */
+  chevronDownEnd6: '\uF36F',
   chevronDownMed: '\uE972',
-  /**
-   * Icon code with the value '\uE96E'.
-   */
   chevronDownSmall: '\uE96E',
-  /**
-   * Icon code with the value '\uE76B'.
-   */
+  chevronFold10: '\uF36A',
   chevronLeft: '\uE76B',
-  /**
-   * Icon code with the value '\uE973'.
-   */
+  chevronLeftEnd6: '\uF371',
   chevronLeftMed: '\uE973',
-  /**
-   * Icon code with the value '\uE96F'.
-   */
   chevronLeftSmall: '\uE96F',
-  /**
-   * Icon code with the value '\uE76C'.
-   */
   chevronRight: '\uE76C',
-  /**
-   * Icon code with the value '\uE974'.
-   */
+  chevronRightEnd6: '\uF372',
   chevronRightMed: '\uE974',
-  /**
-   * Icon code with the value '\uE970'.
-   */
   chevronRightSmall: '\uE970',
-  /**
-   * Icon code with the value '\uE70E'.
-   */
+  chevronUnfold10: '\uF369',
   chevronUp: '\uE70E',
-  /**
-   * Icon code with the value '\uE971'.
-   */
+  chevronUpEnd6: '\uF370',
   chevronUpMed: '\uE971',
-  /**
-   * Icon code with the value '\uE96D'.
-   */
   chevronUpSmall: '\uE96D',
-  /**
-   * Icon code with the value '\uE830'.
-   */
   chromeBack: '\uE830',
-  /**
-   * Icon code with the value '\uEA47'.
-   */
   chromeBackMirrored: '\uEA47',
-  /**
-   * Icon code with the value '\uE8BB'.
-   */
   chromeClose: '\uE8BB',
-  /**
-   * Icon code with the value '\uE921'.
-   */
   chromeMinimize: '\uE921',
-  /**
-   * Icon code with the value '\uEA3B'.
-   */
+  circleAddition: '\uF2E3',
+  circleAdditionSolid: '\uF2E4',
   circleFill: '\uEA3B',
-  /**
-   * Icon code with the value '\uED9E'.
-   */
   circleHalfFull: '\uED9E',
-  /**
-   * Icon code with the value '\uEAEE'.
-   */
+  circlePause: '\uF2D9',
+  circlePauseSolid: '\uF2D8',
   circlePlus: '\uEAEE',
-  /**
-   * Icon code with the value '\uEA3A'.
-   */
   circleRing: '\uEA3A',
-  /**
-   * Icon code with the value '\uEDC8'.
-   */
-  classNotebookLogo: '\uEDC8',
-  /**
-   * Icon code with the value '\uEF75'.
-   */
+  circleStop: '\uF2DC',
+  circleStopSolid: '\uF2DB',
+  cityNext: '\uEC06',
+  classNotebookLogoInverse: '\uEDC8',
   classroomLogo: '\uEF75',
-  /**
-   * Icon code with the value '\uE894'.
-   */
   clear: '\uE894',
-  /**
-   * Icon code with the value '\uEF8F'.
-   */
   clearFilter: '\uEF8F',
-  /**
-   * Icon code with the value '\uEDDD'.
-   */
   clearFormatting: '\uEDDD',
-  /**
-   * Icon code with the value '\uE9C2'.
-   */
   clearNight: '\uE9C2',
-  /**
-   * Icon code with the value '\uE917'.
-   */
   clock: '\uE917',
-  /**
-   * Icon code with the value '\uE89F'.
-   */
+  cloneToDesktop: '\uF28C',
+  closedCaption: '\uEF84',
   closePane: '\uE89F',
-  /**
-   * Icon code with the value '\uEA49'.
-   */
   closePaneMirrored: '\uEA49',
-  /**
-   * Icon code with the value '\uEF84'.
-   */
-  closedCaption: '\uEF84',
-  /**
-   * Icon code with the value '\uECA9'.
-   */
+  cloud: '\uE753',
   cloudAdd: '\uECA9',
-  /**
-   * Icon code with the value '\uEBD3'.
-   */
   cloudDownload: '\uEBD3',
-  /**
-   * Icon code with the value '\uEC8E'.
-   */
   cloudUpload: '\uEC8E',
-  /**
-   * Icon code with the value '\uE9BE'.
-   */
   cloudWeather: '\uE9BE',
-  /**
-   * Icon code with the value '\uE9BF'.
-   */
   cloudy: '\uE9BF',
-  /**
-   * Icon code with the value '\uEA9D'.
-   */
   cocktails: '\uEA9D',
-  /**
-   * Icon code with the value '\uE943'.
-   */
   code: '\uE943',
-  /**
-   * Icon code with the value '\uEAEF'.
-   */
   coffee: '\uEAEF',
-  /**
-   * Icon code with the value '\uEDC9'.
-   */
-  collabsDbLogo: '\uEDC9',
-  /**
-   * Icon code with the value '\uEF66'.
-   */
+  coffeeScript: '\uF2FA',
+  collapseContent: '\uF165',
+  collapseContentSingle: '\uF166',
   collapseMenu: '\uEF66',
-  /**
-   * Icon code with the value '\uEB26'.
-   */
   collegeFootball: '\uEB26',
-  /**
-   * Icon code with the value '\uEB25'.
-   */
   collegeHoops: '\uEB25',
-  /**
-   * Icon code with the value '\uE790'.
-   */
   color: '\uE790',
-  /**
-   * Icon code with the value '\uEDBB'.
-   */
+  colorSolid: '\uF354',
+  columnLeftTwoThirds: '\uF1D6',
+  columnLeftTwoThirdsEdit: '\uF324',
+  columnOptions: '\uF317',
+  columnRightTwoThirds: '\uF1D7',
+  columnRightTwoThirdsEdit: '\uF325',
   combine: '\uEDBB',
-  /**
-   * Icon code with the value '\uE942'.
-   */
+  commandPrompt: '\uE756',
+  comment: '\uE90A',
+  commentAdd: '\uF2B3',
+  commentNext: '\uF2B4',
+  commentPrevious: '\uF2B5',
+  commentUrgent: '\uF307',
+  communications: '\uE95A',
   compassNW: '\uE942',
-  /**
-   * Icon code with the value '\uE930'.
-   */
   completed: '\uE930',
-  /**
-   * Icon code with the value '\uEC61'.
-   */
   completedSolid: '\uEC61',
-  /**
-   * Icon code with the value '\uE77B'.
-   */
+  configurationSolid: '\uF334',
+  constructionCone: '\uE98F',
+  constructionConeSolid: '\uF339',
   contact: '\uE77B',
-  /**
-   * Icon code with the value '\uEEBD'.
-   */
   contactCard: '\uEEBD',
-  /**
-   * Icon code with the value '\uE779'.
-   */
   contactInfo: '\uE779',
-  /**
-   * Icon code with the value '\uE7B8'.
-   */
-  container: '\uE7B8',
-  /**
-   * Icon code with the value '\uE7A1'.
-   */
   contrast: '\uE7A1',
-  /**
-   * Icon code with the value '\uE8C8'.
-   */
   copy: '\uE8C8',
-  /**
-   * Icon code with the value '\uEAF3'.
-   */
   cotton: '\uEAF3',
-  /**
-   * Icon code with the value '\uEB1E'.
-   */
+  cPlusPlus: '\uF2F4',
+  cPlusPlusLanguage: '\uF2F3',
   cricket: '\uEB1E',
-  /**
-   * Icon code with the value '\uEBEF'.
-   */
+  crmReport: '\uEFFE',
+  crownSolid: '\uF336',
+  cSharp: '\uF2F0',
+  cSharpLanguage: '\uF2EF',
   css: '\uEBEF',
-  /**
-   * Icon code with the value '\uEEBE'.
-   */
   customList: '\uEEBE',
-  /**
-   * Icon code with the value '\uEEBF'.
-   */
   customListMirrored: '\uEEBF',
-  /**
-   * Icon code with the value '\uEAC7'.
-   */
+  cut: '\uE8C6',
   cycling: '\uEAC7',
-  /**
-   * Icon code with the value '\uEEB7'.
-   */
+  database: '\uEFC7',
   dataConnectionLibrary: '\uEEB7',
-  /**
-   * Icon code with the value '\uEA17'.
-   */
-  dateTime2: '\uEA17',
-  /**
-   * Icon code with the value '\uEC92'.
-   */
   dateTime: '\uEC92',
-  /**
-   * Icon code with the value '\uEE93'.
-   */
+  dateTime2: '\uEA17',
   dateTimeMirrored: '\uEE93',
-  /**
-   * Icon code with the value '\uE290'.
-   */
+  decisionSolid: '\uF350',
   decreaseIndentLegacy: '\uE290',
-  /**
-   * Icon code with the value '\uEEEE'.
-   */
+  delete: '\uE74D',
   delveAnalytics: '\uEEEE',
-  /**
-   * Icon code with the value '\uEDCA'.
-   */
   delveAnalyticsLogo: '\uEDCA',
-  /**
-   * Icon code with the value '\uED76'.
-   */
-  delveLogo: '\uED76',
-  /**
-   * Icon code with the value '\uEDC1'.
-   */
+  delveLogo: '\uF280',
+  delveLogoFill: '\uF281',
+  delveLogoInverse: '\uED76',
+  deploy: '\uF29D',
   descending: '\uEDC1',
-  /**
-   * Icon code with the value '\uEB3C'.
-   */
   design: '\uEB3C',
-  /**
-   * Icon code with the value '\uEC7A'.
-   */
   developerTools: '\uEC7A',
-  /**
-   * Icon code with the value '\uEA6C'.
-   */
   devices3: '\uEA6C',
-  /**
-   * Icon code with the value '\uEB66'.
-   */
   devices4: '\uEB66',
-  /**
-   * Icon code with the value '\uE75F'.
-   */
   dialpad: '\uE75F',
-  /**
-   * Icon code with the value '\uE82D'.
-   */
+  diamondSolid: '\uF34C',
   dictionary: '\uE82D',
-  /**
-   * Icon code with the value '\uEAC8'.
-   */
   dietPlanNotebook: '\uEAC8',
-  /**
-   * Icon code with the value '\uE8D8'.
-   */
+  diffInline: '\uF309',
+  diffSideBySide: '\uF30A',
   disableUpdates: '\uE8D8',
-  /**
-   * Icon code with the value '\uE8E0'.
-   */
   dislike: '\uE8E0',
-  /**
-   * Icon code with the value '\uEEB8'.
-   */
-  docLibrary: '\uEEB8',
-  /**
-   * Icon code with the value '\uE90C'.
-   */
   dockLeft: '\uE90C',
-  /**
-   * Icon code with the value '\uEA4C'.
-   */
   dockLeftMirrored: '\uEA4C',
-  /**
-   * Icon code with the value '\uE90D'.
-   */
   dockRight: '\uE90D',
-  /**
-   * Icon code with the value '\uEDCB'.
-   */
-  docsLogo: '\uEDCB',
-  /**
-   * Icon code with the value '\uE8A5'.
-   */
+  docLibrary: '\uEEB8',
+  docsLogoInverse: '\uEDCB',
   document: '\uE8A5',
-  /**
-   * Icon code with the value '\uEF57'.
-   */
+  documentation: '\uEC17',
+  documentManagement: '\uEFFC',
   documentReply: '\uEF57',
-  /**
-   * Icon code with the value '\uEF6C'.
-   */
   documentSearch: '\uEF6C',
-  /**
-   * Icon code with the value '\uEED6'.
-   */
   documentSet: '\uEED6',
-  /**
-   * Icon code with the value '\uEC17'.
-   */
-  documentation: '\uEC17',
-  /**
-   * Icon code with the value '\uEB75'.
-   */
+  donutChart: '\uF368',
   door: '\uEB75',
-  /**
-   * Icon code with the value '\uEB8F'.
-   */
   doubleBookmark: '\uEB8F',
-  /**
-   * Icon code with the value '\uEE97'.
-   */
-  doubleChevronDown12: '\uEE97',
-  /**
-   * Icon code with the value '\uEE04'.
-   */
   doubleChevronDown: '\uEE04',
-  /**
-   * Icon code with the value '\uEE98'.
-   */
-  doubleChevronLeft12: '\uEE98',
-  /**
-   * Icon code with the value '\uEDBE'.
-   */
+  doubleChevronDown12: '\uEE97',
+  doubleChevronDown8: '\uF36B',
   doubleChevronLeft: '\uEDBE',
-  /**
-   * Icon code with the value '\uE991'.
-   */
+  doubleChevronLeft12: '\uEE98',
+  doubleChevronLeft8: '\uF36D',
   doubleChevronLeftMed: '\uE991',
-  /**
-   * Icon code with the value '\uEA4D'.
-   */
   doubleChevronLeftMedMirrored: '\uEA4D',
-  /**
-   * Icon code with the value '\uEE99'.
-   */
-  doubleChevronRight12: '\uEE99',
-  /**
-   * Icon code with the value '\uEDBF'.
-   */
   doubleChevronRight: '\uEDBF',
-  /**
-   * Icon code with the value '\uEE96'.
-   */
-  doubleChevronUp12: '\uEE96',
-  /**
-   * Icon code with the value '\uEDBD'.
-   */
+  doubleChevronRight12: '\uEE99',
+  doubleChevronRight8: '\uF36E',
   doubleChevronUp: '\uEDBD',
-  /**
-   * Icon code with the value '\uE74B'.
-   */
+  doubleChevronUp12: '\uEE96',
+  doubleChevronUp8: '\uF36C',
+  doubleColumn: '\uF1D4',
+  doubleColumnEdit: '\uF322',
   down: '\uE74B',
-  /**
-   * Icon code with the value '\uE896'.
-   */
   download: '\uE896',
-  /**
-   * Icon code with the value '\uECA8'.
-   */
   drm: '\uECA8',
-  /**
-   * Icon code with the value '\uEB42'.
-   */
   drop: '\uEB42',
-  /**
-   * Icon code with the value '\uED77'.
-   */
   dropboxLogo: '\uED77',
-  /**
-   * Icon code with the value '\uEDC5'.
-   */
   dropdown: '\uEDC5',
-  /**
-   * Icon code with the value '\uE9CD'.
-   */
   duststorm: '\uE9CD',
-  /**
-   * Icon code with the value '\uEDCD'.
-   */
-  dynamicSmbLogo: '\uEDCD',
-  /**
-   * Icon code with the value '\uEDCC'.
-   */
   dynamics365Logo: '\uEDCC',
-  /**
-   * Icon code with the value '\uE807'.
-   */
+  dynamicSMBLogo: '\uEDCD',
   eatDrink: '\uE807',
-  /**
-   * Icon code with the value '\uEC60'.
-   */
   edgeLogo: '\uEC60',
-  /**
-   * Icon code with the value '\uE70F'.
-   */
   edit: '\uE70F',
-  /**
-   * Icon code with the value '\uEF61'.
-   */
   editMail: '\uEF61',
-  /**
-   * Icon code with the value '\uEB7E'.
-   */
   editMirrored: '\uEB7E',
-  /**
-   * Icon code with the value '\uED9D'.
-   */
   editNote: '\uED9D',
-  /**
-   * Icon code with the value '\uEF77'.
-   */
   editPhoto: '\uEF77',
-  /**
-   * Icon code with the value '\uEF60'.
-   */
   editStyle: '\uEF60',
-  /**
-   * Icon code with the value '\uECCE'.
-   */
+  egnyteLogo: '\uF373',
   embed: '\uECCE',
-  /**
-   * Icon code with the value '\uE731'.
-   */
   emi: '\uE731',
-  /**
-   * Icon code with the value '\uE76E'.
-   */
-  emoji2: '\uE76E',
-  /**
-   * Icon code with the value '\uE899'.
-   */
   emoji: '\uE899',
-  /**
-   * Icon code with the value '\uEA88'.
-   */
+  emoji2: '\uE76E',
   emojiDisappointed: '\uEA88',
-  /**
-   * Icon code with the value '\uEA87'.
-   */
   emojiNeutral: '\uEA87',
-  /**
-   * Icon code with the value '\uEF88'.
-   */
   emptyRecycleBin: '\uEF88',
-  /**
-   * Icon code with the value '\uE9E9'.
-   */
+  engineeringGroup: '\uF362',
   equalizer: '\uE9E9',
-  /**
-   * Icon code with the value '\uE75C'.
-   */
   eraseTool: '\uE75C',
-  /**
-   * Icon code with the value '\uE783'.
-   */
   error: '\uE783',
-  /**
-   * Icon code with the value '\uEA39'.
-   */
   errorBadge: '\uEA39',
-  /**
-   * Icon code with the value '\uECA3'.
-   */
   event: '\uECA3',
-  /**
-   * Icon code with the value '\uED8B'.
-   */
+  eventDate: '\uF059',
   eventInfo: '\uED8B',
-  /**
-   * Icon code with the value '\uEF73'.
-   */
   excelDocument: '\uEF73',
-  /**
-   * Icon code with the value '\uEC28'.
-   */
-  excelLogo: '\uEC28',
-  /**
-   * Icon code with the value '\uED78'.
-   */
-  exchangeLogo: '\uED78',
-  /**
-   * Icon code with the value '\uEF67'.
-   */
+  excelLogo: '\uF1E5',
+  excelLogo16: '\uF397',
+  excelLogoFill: '\uF1E6',
+  excelLogoFill16: '\uF398',
+  excelLogoInverse: '\uEC28',
+  excelLogoInverse16: '\uF396',
+  exchangeLogo: '\uF284',
+  exchangeLogoFill: '\uF285',
+  exchangeLogoInverse: '\uED78',
   expandMenu: '\uEF67',
-  /**
-   * Icon code with the value '\uF09C'.
-   */
+  exploreContent: '\uECCD',
+  exploreContentSingle: '\uF164',
+  export: '\uEDE1',
+  exportMirrored: '\uEDE2',
   fabricAssetLibrary: '\uF09C',
-  /**
-   * Icon code with the value '\uF09D'.
-   */
   fabricDataConnectionLibrary: '\uF09D',
-  /**
-   * Icon code with the value '\uF09E'.
-   */
   fabricDocLibrary: '\uF09E',
-  /**
-   * Icon code with the value '\uF0A9'.
-   */
   fabricFolder: '\uF0A9',
-  /**
-   * Icon code with the value '\uF0AA'.
-   */
   fabricFolderFill: '\uF0AA',
-  /**
-   * Icon code with the value '\uF0A4'.
-   */
   fabricFolderSearch: '\uF0A4',
-  /**
-   * Icon code with the value '\uF09F'.
-   */
   fabricFormLibrary: '\uF09F',
-  /**
-   * Icon code with the value '\uF0A0'.
-   */
   fabricFormLibraryMirrored: '\uF0A0',
-  /**
-   * Icon code with the value '\uF0A5'.
-   */
   fabricMovetoFolder: '\uF0A5',
-  /**
-   * Icon code with the value '\uF0AB'.
-   */
   fabricNewFolder: '\uF0AB',
-  /**
-   * Icon code with the value '\uF0A8'.
-   */
   fabricOpenFolderHorizontal: '\uF0A8',
-  /**
-   * Icon code with the value '\uF0AC'.
-   */
   fabricPictureLibrary: '\uF0AC',
-  /**
-   * Icon code with the value '\uF0A3'.
-   */
   fabricPublicFolder: '\uF0A3',
-  /**
-   * Icon code with the value '\uF0A1'.
-   */
   fabricReportLibrary: '\uF0A1',
-  /**
-   * Icon code with the value '\uF0A2'.
-   */
   fabricReportLibraryMirrored: '\uF0A2',
-  /**
-   * Icon code with the value '\uF0A7'.
-   */
   fabricSyncFolder: '\uF0A7',
-  /**
-   * Icon code with the value '\uF0A6'.
-   */
   fabricUnsyncFolder: '\uF0A6',
-  /**
-   * Icon code with the value '\uECB3'.
-   */
   facebookLogo: '\uECB3',
-  /**
-   * Icon code with the value '\uEBDA'.
-   */
   family: '\uEBDA',
-  /**
-   * Icon code with the value '\uECEB'.
-   */
   fangBody: '\uECEB',
-  /**
-   * Icon code with the value '\uE728'.
-   */
+  fastForward: '\uEB9D',
+  favicon: '\uE737',
   favoriteList: '\uE728',
-  /**
-   * Icon code with the value '\uE734'.
-   */
   favoriteStar: '\uE734',
-  /**
-   * Icon code with the value '\uE735'.
-   */
   favoriteStarFill: '\uE735',
-  /**
-   * Icon code with the value '\uEF5C'.
-   */
   fax: '\uEF5C',
-  /**
-   * Icon code with the value '\uE7E3'.
-   */
+  feedback: '\uED15',
+  feedbackRequestMirroredSolid: '\uF35A',
+  feedbackRequestSolid: '\uF359',
+  feedbackResponseSolid: '\uF35B',
   ferry: '\uE7E3',
-  /**
-   * Icon code with the value '\uEB48'.
-   */
   ferrySolid: '\uEB48',
-  /**
-   * Icon code with the value '\uE71C'.
-   */
+  fieldChanged: '\uF2C3',
+  fieldEmpty: '\uF2C1',
+  fieldFilled: '\uF2C2',
+  fieldNotChanged: '\uF2C4',
+  fileASPX: '\uF2E9',
+  fileBug: '\uF30D',
+  fileCode: '\uF30E',
+  fileComment: '\uF30F',
+  fileCSS: '\uF2EA',
+  fileHTML: '\uF2ED',
+  fileImage: '\uF311',
+  fileJAVA: '\uF2E8',
+  fileLess: '\uF2EC',
+  filePDB: '\uF2E5',
+  fileSass: '\uF2EB',
+  fileSQL: '\uF2E7',
+  fileSymlink: '\uF312',
+  fileTemplate: '\uF2E6',
+  fileTypeSolution: '\uF387',
   filter: '\uE71C',
-  /**
-   * Icon code with the value '\uE795'.
-   */
   filters: '\uE795',
-  /**
-   * Icon code with the value '\uE7BB'.
-   */
+  filtersSolid: '\uF353',
   financial: '\uE7BB',
-  /**
-   * Icon code with the value '\uE928'.
-   */
+  financialMirroredSolid: '\uF347',
+  financialSolid: '\uF346',
   fingerprint: '\uE928',
-  /**
-   * Icon code with the value '\uE7C1'.
-   */
+  fiveTileGrid: '\uF274',
   flag: '\uE7C1',
-  /**
-   * Icon code with the value '\uE935'.
-   */
+  flameSolid: '\uF1F3',
   flickDown: '\uE935',
-  /**
-   * Icon code with the value '\uE937'.
-   */
   flickLeft: '\uE937',
-  /**
-   * Icon code with the value '\uE938'.
-   */
   flickRight: '\uE938',
-  /**
-   * Icon code with the value '\uE936'.
-   */
   flickUp: '\uE936',
-  /**
-   * Icon code with the value '\uEF90'.
-   */
   flow: '\uEF90',
-  /**
-   * Icon code with the value '\uE9CB'.
-   */
+  focalPoint: '\uF277',
   fog: '\uE9CB',
-  /**
-   * Icon code with the value '\uE8B7'.
-   */
   folder: '\uE8B7',
-  /**
-   * Icon code with the value '\uE8D5'.
-   */
   folderFill: '\uE8D5',
-  /**
-   * Icon code with the value '\uF12B'.
-   */
   folderHorizontal: '\uF12B',
-  /**
-   * Icon code with the value '\uE838'.
-   */
+  folderList: '\uF2CE',
+  folderListMirrored: '\uF2CF',
   folderOpen: '\uE838',
-  /**
-   * Icon code with the value '\uEF65'.
-   */
+  folderQuery: '\uF2CD',
   folderSearch: '\uEF65',
-  /**
-   * Icon code with the value '\uE8D2'.
-   */
   font: '\uE8D2',
-  /**
-   * Icon code with the value '\uE8D3'.
-   */
   fontColor: '\uE8D3',
-  /**
-   * Icon code with the value '\uE8E7'.
-   */
   fontDecrease: '\uE8E7',
-  /**
-   * Icon code with the value '\uE8E8'.
-   */
   fontIncrease: '\uE8E8',
-  /**
-   * Icon code with the value '\uE8E9'.
-   */
   fontSize: '\uE8E9',
-  /**
-   * Icon code with the value '\uEEB9'.
-   */
   formLibrary: '\uEEB9',
-  /**
-   * Icon code with the value '\uEEBA'.
-   */
   formLibraryMirrored: '\uEEBA',
-  /**
-   * Icon code with the value '\uE72A'.
-   */
   forward: '\uE72A',
-  /**
-   * Icon code with the value '\uED8C'.
-   */
   forwardEvent: '\uED8C',
-  /**
-   * Icon code with the value '\uE9EF'.
-   */
   freezing: '\uE9EF',
-  /**
-   * Icon code with the value '\uE9CA'.
-   */
   frigid: '\uE9CA',
-  /**
-   * Icon code with the value '\uE91F'.
-   */
+  fSharp: '\uF2F6',
+  fSharpLanguage: '\uF2F5',
   fullCircleMask: '\uE91F',
-  /**
-   * Icon code with the value '\uE740'.
-   */
+  fullHistory: '\uF31C',
   fullScreen: '\uE740',
-  /**
-   * Icon code with the value '\uE9DA'.
-   */
+  fullWidth: '\uF2FE',
+  fullWidthEdit: '\uF2FF',
   generate: '\uE9DA',
-  /**
-   * Icon code with the value '\uEB8E'.
-   */
-  giftCard: '\uEB8E',
-  /**
-   * Icon code with the value '\uEC1F'.
-   */
   giftbox: '\uEC1F',
-  /**
-   * Icon code with the value '\uEA16'.
-   */
+  giftboxOpen: '\uF133',
+  giftBoxSolid: '\uF341',
+  giftCard: '\uEB8E',
+  gitGraph: '\uF2CA',
   glasses: '\uEA16',
-  /**
-   * Icon code with the value '\uECF4'.
-   */
   glimmer: '\uECF4',
-  /**
-   * Icon code with the value '\uE700'.
-   */
   globalNavButton: '\uE700',
-  /**
-   * Icon code with the value '\uE774'.
-   */
   globe: '\uE774',
-  /**
-   * Icon code with the value '\uEF53'.
-   */
   globeFavorite: '\uEF53',
-  /**
-   * Icon code with the value '\uEB1F'.
-   */
   golf: '\uEB1F',
-  /**
-   * Icon code with the value '\uEE0B'.
-   */
   googleDriveLogo: '\uEE0B',
-  /**
-   * Icon code with the value '\uE8D1'.
-   */
+  googleDriveLogoBottomBlue: '\uF375',
+  googleDriveLogoLeftGreen: '\uF374',
+  googleDriveLogoRightYellow: '\uF376',
   gotoToday: '\uE8D1',
-  /**
-   * Icon code with the value '\uE75E'.
-   */
+  gripperBarVertical: '\uE784',
   gripperTool: '\uE75E',
-  /**
-   * Icon code with the value '\uE902'.
-   */
   group: '\uE902',
-  /**
-   * Icon code with the value '\uEE67'.
-   */
   groupedAscending: '\uEE67',
-  /**
-   * Icon code with the value '\uEE66'.
-   */
   groupedDescending: '\uEE66',
-  /**
-   * Icon code with the value '\uEF74'.
-   */
   groupedList: '\uEF74',
-  /**
-   * Icon code with the value '\uEA00'.
-   */
   hailDay: '\uEA00',
-  /**
-   * Icon code with the value '\uEA13'.
-   */
   hailNight: '\uEA13',
-  /**
-   * Icon code with the value '\uE929'.
-   */
+  halfAlpha: '\uE97E',
   handwriting: '\uE929',
-  /**
-   * Icon code with the value '\uEA19'.
-   */
+  hardDriveGroup: '\uF18F',
   header1: '\uEA19',
-  /**
-   * Icon code with the value '\uEF36'.
-   */
   header2: '\uEF36',
-  /**
-   * Icon code with the value '\uEF37'.
-   */
   header3: '\uEF37',
-  /**
-   * Icon code with the value '\uEF38'.
-   */
   header4: '\uEF38',
-  /**
-   * Icon code with the value '\uE95B'.
-   */
   headset: '\uE95B',
-  /**
-   * Icon code with the value '\uE95E'.
-   */
+  headsetSolid: '\uF348',
   health: '\uE95E',
-  /**
-   * Icon code with the value '\uEB51'.
-   */
+  healthSolid: '\uF33F',
   heart: '\uEB51',
-  /**
-   * Icon code with the value '\uEB52'.
-   */
   heartFill: '\uEB52',
-  /**
-   * Icon code with the value '\uE897'.
-   */
   help: '\uE897',
-  /**
-   * Icon code with the value '\uEA51'.
-   */
   helpMirrored: '\uEA51',
-  /**
-   * Icon code with the value '\uEF89'.
-   */
-  hide2: '\uEF89',
-  /**
-   * Icon code with the value '\uED1A'.
-   */
   hide: '\uED1A',
-  /**
-   * Icon code with the value '\uE81C'.
-   */
+  hide2: '\uEF89',
+  highlight: '\uE7E6',
+  highlightMappedShapes: '\uF2A1',
   history: '\uE81C',
-  /**
-   * Icon code with the value '\uE80F'.
-   */
   home: '\uE80F',
-  /**
-   * Icon code with the value '\uEA8A'.
-   */
   homeSolid: '\uEA8A',
-  /**
-   * Icon code with the value '\uE91D'.
-   */
   hospital: '\uE91D',
-  /**
-   * Icon code with the value '\uE824'.
-   */
   hotel: '\uE824',
-  /**
-   * Icon code with the value '\uEF8A'.
-   */
-  iOsAppStoreLogo: '\uEF8A',
-  /**
-   * Icon code with the value '\uE8C9'.
-   */
+  iconSetsFlag: '\uF2A4',
+  imageCrosshair: '\uF2C9',
+  imageDiff: '\uF30B',
+  imagePixel: '\uF30C',
+  import: '\uE8B5',
   important: '\uE8C9',
-  /**
-   * Icon code with the value '\uEF64'.
-   */
+  importMirrored: '\uEA52',
   inboxCheck: '\uEF64',
-  /**
-   * Icon code with the value '\uE814'.
-   */
   incidentTriangle: '\uE814',
-  /**
-   * Icon code with the value '\uE291'.
-   */
   increaseIndentLegacy: '\uE291',
-  /**
-   * Icon code with the value '\uEA1F'.
-   */
-  info2: '\uEA1F',
-  /**
-   * Icon code with the value '\uE946'.
-   */
   info: '\uE946',
-  /**
-   * Icon code with the value '\uEC7D'.
-   */
+  info2: '\uEA1F',
+  infoSolid: '\uF167',
   insertTextBox: '\uEC7D',
-  /**
-   * Icon code with the value '\uE704'.
-   */
+  installToDrive: '\uF28D',
   internetSharing: '\uE704',
-  /**
-   * Icon code with the value '\uEEC0'.
-   */
+  iOsAppStoreLogo: '\uEF8A',
   issueTracking: '\uEEC0',
-  /**
-   * Icon code with the value '\uEEC1'.
-   */
   issueTrackingMirrored: '\uEEC1',
-  /**
-   * Icon code with the value '\uE8DB'.
-   */
   italic: '\uE8DB',
-  /**
-   * Icon code with the value '\uED8F'.
-   */
+  javaScriptLanguage: '\uF2EE',
   joinOnlineMeeting: '\uED8F',
-  /**
-   * Icon code with the value '\uEBF0'.
-   */
   js: '\uEBF0',
-  /**
-   * Icon code with the value '\uE932'.
-   */
   label: '\uE932',
-  /**
-   * Icon code with the value '\uEF6B'.
-   */
   landscapeOrientation: '\uEF6B',
-  /**
-   * Icon code with the value '\uEC76'.
-   */
   laptopSelected: '\uEC76',
-  /**
-   * Icon code with the value '\uEECB'.
-   */
   largeGrid: '\uEECB',
-  /**
-   * Icon code with the value '\uE8F1'.
-   */
   library: '\uE8F1',
-  /**
-   * Icon code with the value '\uEF62'.
-   */
   lifesaver: '\uEF62',
-  /**
-   * Icon code with the value '\uEF63'.
-   */
   lifesaverLock: '\uEF63',
-  /**
-   * Icon code with the value '\uE793'.
-   */
   light: '\uE793',
-  /**
-   * Icon code with the value '\uEA80'.
-   */
   lightbulb: '\uEA80',
-  /**
-   * Icon code with the value '\uE945'.
-   */
   lightningBolt: '\uE945',
-  /**
-   * Icon code with the value '\uE8E1'.
-   */
   like: '\uE8E1',
-  /**
-   * Icon code with the value '\uE71B'.
-   */
+  lineChart: '\uE9E6',
   link: '\uE71B',
-  /**
-   * Icon code with the value '\uEA37'.
-   */
+  linkedInLogo: '\uF20A',
   list: '\uEA37',
-  /**
-   * Icon code with the value '\uEA55'.
-   */
   listMirrored: '\uEA55',
-  /**
-   * Icon code with the value '\uE81D'.
-   */
+  localeLanguage: '\uF2B7',
   location: '\uE81D',
-  /**
-   * Icon code with the value '\uE80E'.
-   */
   locationCircle: '\uE80E',
-  /**
-   * Icon code with the value '\uE827'.
-   */
   locationDot: '\uE827',
-  /**
-   * Icon code with the value '\uE920'.
-   */
   locationFill: '\uE920',
-  /**
-   * Icon code with the value '\uE72E'.
-   */
+  locationOutline: '\uF2D0',
   lock: '\uE72E',
-  /**
-   * Icon code with the value '\uEC8A'.
-   */
+  lockSolid: '\uE9A2',
+  logRemove: '\uF316',
   lowerBrightness: '\uEC8A',
-  /**
-   * Icon code with the value '\uED79'.
-   */
   lyncLogo: '\uED79',
-  /**
-   * Icon code with the value '\uE715'.
-   */
   mail: '\uE715',
-  /**
-   * Icon code with the value '\uED80'.
-   */
   mailAlert: '\uED80',
-  /**
-   * Icon code with the value '\uED81'.
-   */
   mailCheck: '\uED81',
-  /**
-   * Icon code with the value '\uE8A8'.
-   */
   mailFill: '\uE8A8',
-  /**
-   * Icon code with the value '\uE89C'.
-   */
   mailForward: '\uE89C',
-  /**
-   * Icon code with the value '\uEA56'.
-   */
   mailForwardMirrored: '\uEA56',
-  /**
-   * Icon code with the value '\uED82'.
-   */
   mailLowImportance: '\uED82',
-  /**
-   * Icon code with the value '\uED83'.
-   */
   mailPause: '\uED83',
-  /**
-   * Icon code with the value '\uED84'.
-   */
   mailRepeat: '\uED84',
-  /**
-   * Icon code with the value '\uE8CA'.
-   */
   mailReply: '\uE8CA',
-  /**
-   * Icon code with the value '\uE8C2'.
-   */
   mailReplyAll: '\uE8C2',
-  /**
-   * Icon code with the value '\uEA58'.
-   */
   mailReplyAllMirrored: '\uEA58',
-  /**
-   * Icon code with the value '\uEA57'.
-   */
   mailReplyMirrored: '\uEA57',
-  /**
-   * Icon code with the value '\uE816'.
-   */
+  mailSolid: '\uF343',
   mapDirections: '\uE816',
-  /**
-   * Icon code with the value '\uE707'.
-   */
   mapPin: '\uE707',
-  /**
-   * Icon code with the value '\uEAFC'.
-   */
+  markDownLanguage: '\uF2FB',
   market: '\uEAFC',
-  /**
-   * Icon code with the value '\uEF42'.
-   */
   marketDown: '\uEF42',
-  /**
-   * Icon code with the value '\uE789'.
-   */
+  medical: '\uEAD4',
   megaphone: '\uE789',
-  /**
-   * Icon code with the value '\uE77C'.
-   */
+  megaphoneSolid: '\uF332',
   memo: '\uE77C',
-  /**
-   * Icon code with the value '\uE7D5'.
-   */
   merge: '\uE7D5',
-  /**
-   * Icon code with the value '\uE8BD'.
-   */
+  mergeDuplicate: '\uF29A',
   message: '\uE8BD',
-  /**
-   * Icon code with the value '\uEC70'.
-   */
   messageFill: '\uEC70',
-  /**
-   * Icon code with the value '\uE720'.
-   */
   microphone: '\uE720',
-  /**
-   * Icon code with the value '\uF130'.
-   */
   microsoftStaffhubLogo: '\uF130',
-  /**
-   * Icon code with the value '\uE732'.
-   */
   miniLink: '\uE732',
-  /**
-   * Icon code with the value '\uEC75'.
-   */
   mobileSelected: '\uEC75',
-  /**
-   * Icon code with the value '\uEAFD'.
-   */
   money: '\uEAFD',
-  /**
-   * Icon code with the value '\uE712'.
-   */
   more: '\uE712',
-  /**
-   * Icon code with the value '\uEB22'.
-   */
   moreSports: '\uEB22',
-  /**
-   * Icon code with the value '\uE7C2'.
-   */
+  moreVertical: '\uF2BC',
   move: '\uE7C2',
-  /**
-   * Icon code with the value '\uE8DE'.
-   */
   moveToFolder: '\uE8DE',
-  /**
-   * Icon code with the value '\uEB6C'.
-   */
   msnLogo: '\uEB6C',
-  /**
-   * Icon code with the value '\uE762'.
-   */
+  msnVideos: '\uEB1C',
+  msnVideosSolid: '\uF2DA',
   multiSelect: '\uE762',
-  /**
-   * Icon code with the value '\uEA98'.
-   */
   multiSelectMirrored: '\uEA98',
-  /**
-   * Icon code with the value '\uE940'.
-   */
   musicInCollection: '\uE940',
-  /**
-   * Icon code with the value '\uEA36'.
-   */
   musicInCollectionFill: '\uEA36',
-  /**
-   * Icon code with the value '\uEC4F'.
-   */
   musicNote: '\uEC4F',
-  /**
-   * Icon code with the value '\uE800'.
-   */
   nav2DMapView: '\uE800',
-  /**
-   * Icon code with the value '\uE8F4'.
-   */
+  navigateBack: '\uF2DD',
+  navigateBackMirrored: '\uF2DE',
+  navigateExternalInline: '\uF35F',
+  navigateForward: '\uF2DF',
+  navigateForwardMirrored: '\uF2E0',
+  networkTower: '\uEC05',
+  newAnalyticsQuery: '\uF1E0',
   newFolder: '\uE8F4',
-  /**
-   * Icon code with the value '\uE900'.
-   */
   news: '\uE900',
-  /**
-   * Icon code with the value '\uED99'.
-   */
+  newTeamProject: '\uF2B2',
+  next: '\uE893',
   noteForward: '\uED99',
-  /**
-   * Icon code with the value '\uED9A'.
-   */
   notePinned: '\uED9A',
-  /**
-   * Icon code with the value '\uED98'.
-   */
   noteReply: '\uED98',
-  /**
-   * Icon code with the value '\uEDC4'.
-   */
-  numberField: '\uEDC4',
-  /**
-   * Icon code with the value '\uEA1C'.
-   */
   numberedList: '\uEA1C',
-  /**
-   * Icon code with the value '\uEDCE'.
-   */
+  numberField: '\uEDC4',
+  officeAddinsLogo: '\uEEC7',
   officeAssistantLogo: '\uEDCE',
-  /**
-   * Icon code with the value '\uEF86'.
-   */
   officeFormLogo: '\uEF86',
-  /**
-   * Icon code with the value '\uEB6E'.
-   */
   officeLogo: '\uEB6E',
-  /**
-   * Icon code with the value '\uEDCF'.
-   */
   officeStoreLogo: '\uEDCF',
-  /**
-   * Icon code with the value '\uED7A'.
-   */
-  officeVideoLogo: '\uED7A',
-  /**
-   * Icon code with the value '\uEEC8'.
-   */
+  officeVideoLogo: '\uF282',
+  officeVideoLogoFill: '\uF283',
+  officeVideoLogoInverse: '\uED7A',
   offlineOneDriveParachute: '\uEEC8',
-  /**
-   * Icon code with the value '\uEEC9'.
-   */
   offlineOneDriveParachuteDisabled: '\uEEC9',
-  /**
-   * Icon code with the value '\uE941'.
-   */
+  offlineStorageSolid: '\uF34E',
   oneDrive: '\uE941',
-  /**
-   * Icon code with the value '\uEF32'.
-   */
   oneDriveAdd: '\uEF32',
-  /**
-   * Icon code with the value '\uEDD0'.
-   */
-  oneNoteEduLogo: '\uEDD0',
-  /**
-   * Icon code with the value '\uEC0D'.
-   */
-  oneNoteLogo: '\uEC0D',
-  /**
-   * Icon code with the value '\uE8E5'.
-   */
+  oneNoteEduLogoInverse: '\uEDD0',
+  oneNoteLogo: '\uF1E7',
+  oneNoteLogo16: '\uF39A',
+  oneNoteLogoFill: '\uF1E8',
+  oneNoteLogoFill16: '\uF39B',
+  oneNoteLogoInverse: '\uEC0D',
+  oneNoteLogoInverse16: '\uF399',
   openFile: '\uE8E5',
-  /**
-   * Icon code with the value '\uED25'.
-   */
   openFolderHorizontal: '\uED25',
-  /**
-   * Icon code with the value '\uE8A7'.
-   */
   openInNewWindow: '\uE8A7',
-  /**
-   * Icon code with the value '\uE8A0'.
-   */
   openPane: '\uE8A0',
-  /**
-   * Icon code with the value '\uEA5B'.
-   */
   openPaneMirrored: '\uEA5B',
-  /**
-   * Icon code with the value '\uECA6'.
-   */
+  openSource: '\uEBC2',
   org: '\uECA6',
-  /**
-   * Icon code with the value '\uED34'.
-   */
+  outlookLogo: '\uF1E9',
+  outlookLogo16: '\uF39D',
+  outlookLogoFill: '\uF1EA',
+  outlookLogoFill16: '\uF39E',
+  outlookLogoInverse: '\uEB6D',
+  outlookLogoInverse16: '\uF39C',
   outOfOffice: '\uED34',
-  /**
-   * Icon code with the value '\uEB6D'.
-   */
-  outlookLogo: '\uEB6D',
-  /**
-   * Icon code with the value '\uE7C3'.
-   */
+  package: '\uE7B8',
+  packages: '\uF318',
   page: '\uE7C3',
-  /**
-   * Icon code with the value '\uEA1A'.
-   */
   pageAdd: '\uEA1A',
-  /**
-   * Icon code with the value '\uF02C'.
-   */
-  pageCheckedOut: '\uF02C',
-  /**
-   * Icon code with the value '\uF104'.
-   */
   pageCheckedin: '\uF104',
-  /**
-   * Icon code with the value '\uE760'.
-   */
+  pageCheckedOut: '\uF02C',
+  pageEdit: '\uEFB6',
   pageLeft: '\uE760',
-  /**
-   * Icon code with the value '\uE761'.
-   */
+  pageListMirroredSolid: '\uF33B',
+  pageListSolid: '\uF33A',
   pageRight: '\uE761',
-  /**
-   * Icon code with the value '\uE729'.
-   */
   pageSolid: '\uE729',
-  /**
-   * Icon code with the value '\uE7B0'.
-   */
   panoIndicator: '\uE7B0',
-  /**
-   * Icon code with the value '\uED7B'.
-   */
+  parachute: '\uF351',
+  parachuteSolid: '\uF352',
+  parameter: '\uF306',
   paratureLogo: '\uED7B',
-  /**
-   * Icon code with the value '\uE9C0'.
-   */
+  parkingLocation: '\uE811',
+  parkingLocationMirrored: '\uEA5E',
+  parkingMirroredSolid: '\uF34B',
+  parkingSolid: '\uF34A',
   partlyCloudyDay: '\uE9C0',
-  /**
-   * Icon code with the value '\uE9C1'.
-   */
   partlyCloudyNight: '\uE9C1',
-  /**
-   * Icon code with the value '\uECA7'.
-   */
   partyLeader: '\uECA7',
-  /**
-   * Icon code with the value '\uE769'.
-   */
+  paste: '\uE77F',
   pause: '\uE769',
-  /**
-   * Icon code with the value '\uE8C7'.
-   */
   paymentCard: '\uE8C7',
-  /**
-   * Icon code with the value '\uE977'.
-   */
   pc1: '\uE977',
-  /**
-   * Icon code with the value '\uEA90'.
-   */
   pdf: '\uEA90',
-  /**
-   * Icon code with the value '\uEF7B'.
-   */
   pencilReply: '\uEF7B',
-  /**
-   * Icon code with the value '\uE716'.
-   */
   people: '\uE716',
-  /**
-   * Icon code with the value '\uEA15'.
-   */
   peopleAdd: '\uEA15',
-  /**
-   * Icon code with the value '\uED93'.
-   */
   peopleAlert: '\uED93',
-  /**
-   * Icon code with the value '\uED91'.
-   */
   peopleBlock: '\uED91',
-  /**
-   * Icon code with the value '\uED94'.
-   */
   peoplePause: '\uED94',
-  /**
-   * Icon code with the value '\uED92'.
-   */
   peopleRepeat: '\uED92',
-  /**
-   * Icon code with the value '\uE8D7'.
-   */
   permissions: '\uE8D7',
-  /**
-   * Icon code with the value '\uE717'.
-   */
+  permissionsSolid: '\uF349',
+  personalize: '\uE771',
   phone: '\uE717',
-  /**
-   * Icon code with the value '\uEB9F'.
-   */
   photo2: '\uEB9F',
-  /**
-   * Icon code with the value '\uECAB'.
-   */
   photo2Add: '\uECAB',
-  /**
-   * Icon code with the value '\uECAC'.
-   */
   photo2Remove: '\uECAC',
-  /**
-   * Icon code with the value '\uE7AA'.
-   */
   photoCollection: '\uE7AA',
-  /**
-   * Icon code with the value '\uE8B9'.
-   */
   picture: '\uE8B9',
-  /**
-   * Icon code with the value '\uEEC2'.
-   */
   pictureLibrary: '\uEEC2',
-  /**
-   * Icon code with the value '\uEB04'.
-   */
   pieDouble: '\uEB04',
-  /**
-   * Icon code with the value '\uEACB'.
-   */
+  pieSingle: '\uEB05',
   pill: '\uEACB',
-  /**
-   * Icon code with the value '\uE718'.
-   */
   pin: '\uE718',
-  /**
-   * Icon code with the value '\uE840'.
-   */
   pinned: '\uE840',
-  /**
-   * Icon code with the value '\uE842'.
-   */
   pinnedFill: '\uE842',
-  /**
-   * Icon code with the value '\uEDD1'.
-   */
-  planner: '\uEDD1',
-  /**
-   * Icon code with the value '\uE768'.
-   */
+  pivotChart: '\uF24C',
+  plannerLogo: '\uEDD1',
+  planView: '\uF360',
   play: '\uE768',
-  /**
-   * Icon code with the value '\uEF58'.
-   */
   playerSettings: '\uEF58',
-  /**
-   * Icon code with the value '\uECAF'.
-   */
+  playResume: '\uF2C6',
+  plug: '\uF300',
+  plugConnected: '\uF302',
+  plugDisconnected: '\uF303',
+  plugSolid: '\uF301',
   poi: '\uECAF',
-  /**
-   * Icon code with the value '\uE8F3'.
-   */
+  poiSolid: '\uF2D1',
   postUpdate: '\uE8F3',
-  /**
-   * Icon code with the value '\uF092'.
-   */
-  powerApps2Logo: '\uF092',
-  /**
-   * Icon code with the value '\uEDD2'.
-   */
   powerApps: '\uEDD2',
-  /**
-   * Icon code with the value '\uF091'.
-   */
+  powerApps2Logo: '\uF092',
   powerAppsLogo: '\uF091',
-  /**
-   * Icon code with the value '\uEA1E'.
-   */
   powerBiLogo: '\uEA1E',
-  /**
-   * Icon code with the value '\uEF72'.
-   */
   powerPointDocument: '\uEF72',
-  /**
-   * Icon code with the value '\uEC2A'.
-   */
-  powerPointLogo: '\uEC2A',
-  /**
-   * Icon code with the value '\uE9CF'.
-   */
+  powerPointLogo: '\uF1EB',
+  powerPointLogo16: '\uF394',
+  powerPointLogoFill: '\uF1EC',
+  powerPointLogoFill16: '\uF395',
+  powerPointLogoInverse: '\uEC2A',
+  powerPointLogoInverse16: '\uF393',
   precipitation: '\uE9CF',
-  /**
-   * Icon code with the value '\uE979'.
-   */
   presenceChickletVideo: '\uE979',
-  /**
-   * Icon code with the value '\uE8FF'.
-   */
   preview: '\uE8FF',
-  /**
-   * Icon code with the value '\uE8A1'.
-   */
   previewLink: '\uE8A1',
-  /**
-   * Icon code with the value '\uE749'.
-   */
+  previous: '\uE892',
   print: '\uE749',
-  /**
-   * Icon code with the value '\uE956'.
-   */
   printfaxPrinterFile: '\uE956',
-  /**
-   * Icon code with the value '\uEB27'.
-   */
+  processing: '\uE9F5',
+  processMetaTask: '\uF290',
+  product: '\uECDC',
   proFootball: '\uEB27',
-  /**
-   * Icon code with the value '\uEB28'.
-   */
+  progressLoopInner: '\uECDE',
+  progressLoopOuter: '\uECDF',
+  progressRingDots: '\uF16A',
   proHockey: '\uEB28',
-  /**
-   * Icon code with the value '\uECDC'.
-   */
-  product: '\uECDC',
-  /**
-   * Icon code with the value '\uEDD4'.
-   */
-  projectLogo: '\uEDD4',
-  /**
-   * Icon code with the value '\uE8A6'.
-   */
+  projectCollection: '\uF363',
+  projectLogoInverse: '\uEDD4',
   protectedDocument: '\uE8A6',
-  /**
-   * Icon code with the value '\uEF6D'.
-   */
+  protectRestrict: '\uF22A',
   publicCalendar: '\uEF6D',
-  /**
-   * Icon code with the value '\uEF6E'.
-   */
   publicContactCard: '\uEF6E',
-  /**
-   * Icon code with the value '\uEF6F'.
-   */
   publicEmail: '\uEF6F',
-  /**
-   * Icon code with the value '\uEF70'.
-   */
   publicFolder: '\uEF70',
-  /**
-   * Icon code with the value '\uEA86'.
-   */
+  publisherLogo: '\uF1ED',
+  publisherLogo16: '\uF3A0',
+  publisherLogoFill: '\uF1EE',
+  publisherLogoFill16: '\uF3A1',
+  publisherLogoInverse16: '\uF39F',
   puzzle: '\uEA86',
-  /**
-   * Icon code with the value '\uEE19'.
-   */
+  py: '\uF2F9',
+  pythonLanguage: '\uF2F8',
+  queryList: '\uF2B8',
   questionnaire: '\uEE19',
-  /**
-   * Icon code with the value '\uEE4B'.
-   */
   questionnaireMirrored: '\uEE4B',
-  /**
-   * Icon code with the value '\uE70B'.
-   */
   quickNote: '\uE70B',
-  /**
-   * Icon code with the value '\uECCB'.
-   */
+  quickNoteSolid: '\uF338',
+  radioBtnOff: '\uECCA',
   radioBtnOn: '\uECCB',
-  /**
-   * Icon code with the value '\uE915'.
-   */
   radioBullet: '\uE915',
-  /**
-   * Icon code with the value '\uE9C4'.
-   */
   rain: '\uE9C4',
-  /**
-   * Icon code with the value '\uE9C3'.
-   */
   rainShowersDay: '\uE9C3',
-  /**
-   * Icon code with the value '\uEA0F'.
-   */
   rainShowersNight: '\uEA0F',
-  /**
-   * Icon code with the value '\uE9C7'.
-   */
   rainSnow: '\uE9C7',
-  /**
-   * Icon code with the value '\uE8C3'.
-   */
+  rawSource: '\uF299',
   read: '\uE8C3',
-  /**
-   * Icon code with the value '\uE736'.
-   */
   readingMode: '\uE736',
-  /**
-   * Icon code with the value '\uEF5B'.
-   */
+  readingModeSolid: '\uF33D',
   receiptCheck: '\uEF5B',
-  /**
-   * Icon code with the value '\uEF59'.
-   */
   receiptForward: '\uEF59',
-  /**
-   * Icon code with the value '\uEF5A'.
-   */
   receiptReply: '\uEF5A',
-  /**
-   * Icon code with the value '\uE823'.
-   */
   recent: '\uE823',
-  /**
-   * Icon code with the value '\uEF5D'.
-   */
+  record2: '\uEA3F',
   recurringEvent: '\uEF5D',
-  /**
-   * Icon code with the value '\uEDB2'.
-   */
   recurringTask: '\uEDB2',
-  /**
-   * Icon code with the value '\uEF87'.
-   */
   recycleBin: '\uEF87',
-  /**
-   * Icon code with the value '\uE7B3'.
-   */
+  redeploy: '\uF29E',
   redEye: '\uE7B3',
-  /**
-   * Icon code with the value '\uE7A6'.
-   */
   redo: '\uE7A6',
-  /**
-   * Icon code with the value '\uE72C'.
-   */
   refresh: '\uE72C',
-  /**
-   * Icon code with the value '\uEBF8'.
-   */
   reminderGroup: '\uEBF8',
-  /**
-   * Icon code with the value '\uE738'.
-   */
   remove: '\uE738',
-  /**
-   * Icon code with the value '\uED8A'.
-   */
   removeEvent: '\uED8A',
-  /**
-   * Icon code with the value '\uEB08'.
-   */
   removeFilter: '\uEB08',
-  /**
-   * Icon code with the value '\uED90'.
-   */
   removeLink: '\uED90',
-  /**
-   * Icon code with the value '\uED9B'.
-   */
   removeOccurrence: '\uED9B',
-  /**
-   * Icon code with the value '\uE8AC'.
-   */
   rename: '\uE8AC',
-  /**
-   * Icon code with the value '\uED50'.
-   */
   reopenPages: '\uED50',
-  /**
-   * Icon code with the value '\uE90F'.
-   */
   repair: '\uE90F',
-  /**
-   * Icon code with the value '\uE97A'.
-   */
   reply: '\uE97A',
-  /**
-   * Icon code with the value '\uEE0A'.
-   */
   replyAll: '\uEE0A',
-  /**
-   * Icon code with the value '\uEF5F'.
-   */
   replyAllAlt: '\uEF5F',
-  /**
-   * Icon code with the value '\uEE36'.
-   */
   replyAllMirrored: '\uEE36',
-  /**
-   * Icon code with the value '\uEF5E'.
-   */
   replyAlt: '\uEF5E',
-  /**
-   * Icon code with the value '\uEE35'.
-   */
   replyMirrored: '\uEE35',
-  /**
-   * Icon code with the value '\uEEBB'.
-   */
+  repo: '\uF2CB',
   reportLibrary: '\uEEBB',
-  /**
-   * Icon code with the value '\uEEBC'.
-   */
   reportLibraryMirrored: '\uEEBC',
-  /**
-   * Icon code with the value '\uED24'.
-   */
+  repoSolid: '\uF2CC',
   returnToSession: '\uED24',
-  /**
-   * Icon code with the value '\uE845'.
-   */
+  reviewRequestMirroredSolid: '\uF357',
+  reviewRequestSolid: '\uF356',
+  reviewResponseSolid: '\uF358',
+  reviewSolid: '\uF355',
   revToggleKey: '\uE845',
-  /**
-   * Icon code with the value '\uE9D1'.
-   */
+  rewind: '\uEB9E',
   ribbon: '\uE9D1',
-  /**
-   * Icon code with the value '\uE9B1'.
-   */
+  ribbonSolid: '\uF345',
   rightDoubleQuote: '\uE9B1',
-  /**
-   * Icon code with the value '\uEA8F'.
-   */
   ringer: '\uEA8F',
-  /**
-   * Icon code with the value '\uED9F'.
-   */
+  ringerOff: '\uF2C5',
+  robot: '\uE99A',
+  rocket: '\uF3B3',
   room: '\uED9F',
-  /**
-   * Icon code with the value '\uE7AD'.
-   */
   rotate: '\uE7AD',
-  /**
-   * Icon code with the value '\uEB2D'.
-   */
+  rowsChild: '\uF29C',
+  rowsGroup: '\uF29B',
   rugby: '\uEB2D',
-  /**
-   * Icon code with the value '\uEADA'.
-   */
   running: '\uEADA',
-  /**
-   * Icon code with the value '\uE757'.
-   */
   sad: '\uE757',
-  /**
-   * Icon code with the value '\uE74E'.
-   */
+  sadSolid: '\uF33E',
   save: '\uE74E',
-  /**
-   * Icon code with the value '\uE792'.
-   */
+  saveAll: '\uF203',
+  saveAndClose: '\uF038',
   saveAs: '\uE792',
-  /**
-   * Icon code with the value '\uE721'.
-   */
+  savings: '\uEB0B',
+  scheduleEventAction: '\uF1EF',
+  scopeTemplate: '\uF2B0',
+  script: '\uF03A',
+  scrollUpDown: '\uEC8F',
   search: '\uE721',
-  /**
-   * Icon code with the value '\uEC0C'.
-   */
+  searchAndApps: '\uE773',
   section: '\uEC0C',
-  /**
-   * Icon code with the value '\uEF76'.
-   */
   sections: '\uEF76',
-  /**
-   * Icon code with the value '\uED85'.
-   */
   securityGroup: '\uED85',
-  /**
-   * Icon code with the value '\uE724'.
-   */
   send: '\uE724',
-  /**
-   * Icon code with the value '\uEA63'.
-   */
   sendMirrored: '\uEA63',
-  /**
-   * Icon code with the value '\uF071'.
-   */
+  separator: '\uF35E',
+  server: '\uF201',
+  serverEnviroment: '\uF29F',
+  serverProcesses: '\uF1FE',
   setAction: '\uF071',
-  /**
-   * Icon code with the value '\uE713'.
-   */
   settings: '\uE713',
-  /**
-   * Icon code with the value '\uE72D'.
-   */
   share: '\uE72D',
-  /**
-   * Icon code with the value '\uEF79'.
-   */
   shareiOs: '\uEF79',
-  /**
-   * Icon code with the value '\uED18'.
-   */
-  sharepointLogo: '\uED18',
-  /**
-   * Icon code with the value '\uEA18'.
-   */
+  sharepointLogo: '\uF27E',
+  sharepointLogoFill: '\uF27F',
+  sharepointLogoInverse: '\uED18',
   shield: '\uEA18',
-  /**
-   * Icon code with the value '\uE719'.
-   */
+  shieldSolid: '\uF340',
   shop: '\uE719',
-  /**
-   * Icon code with the value '\uE7BF'.
-   */
   shoppingCart: '\uE7BF',
-  /**
-   * Icon code with the value '\uE8BC'.
-   */
+  shoppingCartSolid: '\uF342',
+  shopServer: '\uF2B6',
   showResults: '\uE8BC',
-  /**
-   * Icon code with the value '\uEA65'.
-   */
   showResultsMirrored: '\uEA65',
-  /**
-   * Icon code with the value '\uEF52'.
-   */
   sidePanel: '\uEF52',
-  /**
-   * Icon code with the value '\uEDFF'.
-   */
+  sidePanelMirrored: '\uF221',
+  signOut: '\uF3B1',
   singleBookmark: '\uEDFF',
-  /**
-   * Icon code with the value '\uE759'.
-   */
+  singleColumn: '\uF1D3',
+  singleColumnEdit: '\uF321',
   sipMove: '\uE759',
-  /**
-   * Icon code with the value '\uEF80'.
-   */
   skypeCheck: '\uEF80',
-  /**
-   * Icon code with the value '\uEF7D'.
-   */
   skypeCircleCheck: '\uEF7D',
-  /**
-   * Icon code with the value '\uEF7E'.
-   */
   skypeCircleClock: '\uEF7E',
-  /**
-   * Icon code with the value '\uEF7F'.
-   */
   skypeCircleMinus: '\uEF7F',
-  /**
-   * Icon code with the value '\uEF81'.
-   */
   skypeClock: '\uEF81',
-  /**
-   * Icon code with the value '\uEB6F'.
-   */
+  skypeForBusinessLogoFill: '\uF27D',
   skypeLogo: '\uEB6F',
-  /**
-   * Icon code with the value '\uEF83'.
-   */
   skypeMessage: '\uEF83',
-  /**
-   * Icon code with the value '\uEF82'.
-   */
   skypeMinus: '\uEF82',
-  /**
-   * Icon code with the value '\uEC13'.
-   */
   sliderThumb: '\uEC13',
-  /**
-   * Icon code with the value '\uEB46'.
-   */
-  snow: '\uEB46',
-  /**
-   * Icon code with the value '\uE9FD'.
-   */
+  snow: '\uE9C8',
+  snowflake: '\uEB46',
   snowShowerDay: '\uE9FD',
-  /**
-   * Icon code with the value '\uEA11'.
-   */
   snowShowerNight: '\uEA11',
-  /**
-   * Icon code with the value '\uEB21'.
-   */
   soccer: '\uEB21',
-  /**
-   * Icon code with the value '\uED7C'.
-   */
   socialListeningLogo: '\uED7C',
-  /**
-   * Icon code with the value '\uE8CB'.
-   */
   sort: '\uE8CB',
-  /**
-   * Icon code with the value '\uEE69'.
-   */
   sortDown: '\uEE69',
-  /**
-   * Icon code with the value '\uE9D0'.
-   */
   sortLines: '\uE9D0',
-  /**
-   * Icon code with the value '\uEE68'.
-   */
   sortUp: '\uEE68',
-  /**
-   * Icon code with the value '\uE7F5'.
-   */
   speakers: '\uE7F5',
-  /**
-   * Icon code with the value '\uEC4A'.
-   */
   speedHigh: '\uEC4A',
-  /**
-   * Icon code with the value '\uEDBC'.
-   */
   split: '\uEDBC',
-  /**
-   * Icon code with the value '\uE9CC'.
-   */
+  sprint: '\uF3B0',
   squalls: '\uE9CC',
-  /**
-   * Icon code with the value '\uE7FF'.
-   */
+  stackedBarChart: '\uF24D',
+  stackedLineChart: '\uF24E',
   stackIndicator: '\uE7FF',
-  /**
-   * Icon code with the value '\uEF78'.
-   */
   starburst: '\uEF78',
-  /**
-   * Icon code with the value '\uEB90'.
-   */
+  starburstSolid: '\uF33C',
   statusErrorFull: '\uEB90',
-  /**
-   * Icon code with the value '\uEA82'.
-   */
   statusTriangle: '\uEA82',
-  /**
-   * Icon code with the value '\uEB0F'.
-   */
+  step: '\uF241',
+  stepInsert: '\uF242',
+  stepShared: '\uF243',
+  stepSharedAdd: '\uF244',
+  stepSharedInsert: '\uF245',
   stockDown: '\uEB0F',
-  /**
-   * Icon code with the value '\uEB11'.
-   */
   stockUp: '\uEB11',
-  /**
-   * Icon code with the value '\uE916'.
-   */
+  stop: '\uE71A',
+  stopSolid: '\uEE95',
   stopwatch: '\uE916',
-  /**
-   * Icon code with the value '\uEA96'.
-   */
   storeLogo: '\uEA96',
-  /**
-   * Icon code with the value '\uEA04'.
-   */
   storeLogoMed: '\uEA04',
-  /**
-   * Icon code with the value '\uEDE0'.
-   */
+  storyboard: '\uF308',
+  streaming: '\uE93E',
+  streamingOff: '\uF2BB',
+  streamLogo: '\uF329',
   strikethrough: '\uEDE0',
-  /**
-   * Icon code with the value '\uEDA1'.
-   */
   subscribe: '\uEDA1',
-  /**
-   * Icon code with the value '\uEDDF'.
-   */
   subscript: '\uEDDF',
-  /**
-   * Icon code with the value '\uEDD3'.
-   */
   suitcase: '\uEDD3',
-  /**
-   * Icon code with the value '\uEF69'.
-   */
   sunAdd: '\uEF69',
-  /**
-   * Icon code with the value '\uEF6A'.
-   */
-  sunQuestionMark: '\uEF6A',
-  /**
-   * Icon code with the value '\uE9BD'.
-   */
   sunny: '\uE9BD',
-  /**
-   * Icon code with the value '\uEDDE'.
-   */
+  sunQuestionMark: '\uEF6A',
   superscript: '\uEDDE',
-  /**
-   * Icon code with the value '\uED29'.
-   */
-  swayLogo: '\uED29',
-  /**
-   * Icon code with the value '\uE8AB'.
-   */
-  switcher: '\uE8AB',
-  /**
-   * Icon code with the value '\uE810'.
-   */
+  swayLogoInverse: '\uED29',
+  switch: '\uE8AB',
   switcherStartEnd: '\uE810',
-  /**
-   * Icon code with the value '\uE895'.
-   */
   sync: '\uE895',
-  /**
-   * Icon code with the value '\uE8F7'.
-   */
   syncFolder: '\uE8F7',
-  /**
-   * Icon code with the value '\uEE6E'.
-   */
   syncToPc: '\uEE6E',
-  /**
-   * Icon code with the value '\uE770'.
-   */
   system: '\uE770',
-  /**
-   * Icon code with the value '\uE7E9'.
-   */
   tab: '\uE7E9',
-  /**
-   * Icon code with the value '\uED86'.
-   */
   table: '\uED86',
-  /**
-   * Icon code with the value '\uE70A'.
-   */
   tablet: '\uE70A',
-  /**
-   * Icon code with the value '\uEC74'.
-   */
   tabletSelected: '\uEC74',
-  /**
-   * Icon code with the value '\uE8EC'.
-   */
   tag: '\uE8EC',
-  /**
-   * Icon code with the value '\uEDB7'.
-   */
+  taskboard: '\uF1C2',
+  taskGroup: '\uF2AE',
+  taskGroupMirrored: '\uF2AF',
   taskManager: '\uEDB7',
-  /**
-   * Icon code with the value '\uEDB8'.
-   */
   taskManagerMirrored: '\uEDB8',
-  /**
-   * Icon code with the value '\uEA12'.
-   */
+  taskSolid: '\uF333',
+  teamFavorite: '\uF2AD',
+  teamsLogo: '\uF27B',
+  teamsLogoFill: '\uF27C',
+  teamsLogoInverse: '\uF27A',
   teamwork: '\uEA12',
-  /**
-   * Icon code with the value '\uEE58'.
-   */
   temporaryUser: '\uEE58',
-  /**
-   * Icon code with the value '\uEB33'.
-   */
   tennis: '\uEB33',
-  /**
-   * Icon code with the value '\uEDC2'.
-   */
+  testAutoSolid: '\uF3A8',
+  testBeaker: '\uF3A5',
+  testBeakerSolid: '\uF3A6',
+  testCase: '\uF3AF',
+  testExploreSolid: '\uF3A7',
+  testImpactSolid: '\uF3AA',
+  testParameter: '\uF3AD',
+  testPlan: '\uF3AB',
+  testStep: '\uF3AC',
+  testSuite: '\uF3AE',
+  testUserSolid: '\uF3A9',
   textBox: '\uEDC2',
-  /**
-   * Icon code with the value '\uEDC3'.
-   */
+  textCallout: '\uF2A2',
+  textDocument: '\uF029',
   textField: '\uEDC3',
-  /**
-   * Icon code with the value '\uE7B6'.
-   */
   thumbnailView: '\uE7B6',
-  /**
-   * Icon code with the value '\uEA67'.
-   */
   thumbnailViewMirrored: '\uEA67',
-  /**
-   * Icon code with the value '\uE9C6'.
-   */
   thunderstorms: '\uE9C6',
-  /**
-   * Icon code with the value '\uEB54'.
-   */
   ticket: '\uEB54',
-  /**
-   * Icon code with the value '\uEF7C'.
-   */
-  tiles2: '\uEF7C',
-  /**
-   * Icon code with the value '\uECA5'.
-   */
   tiles: '\uECA5',
-  /**
-   * Icon code with the value '\uED9C'.
-   */
+  tiles2: '\uEF7C',
   timeline: '\uED9C',
-  /**
-   * Icon code with the value '\uE91E'.
-   */
+  timelineDelivery: '\uF2AB',
+  timelineMatrixView: '\uF361',
+  timelineProgress: '\uF2AA',
   timer: '\uE91E',
-  /**
-   * Icon code with the value '\uEC12'.
-   */
   toggleBorder: '\uEC12',
-  /**
-   * Icon code with the value '\uEC11'.
-   */
   toggleFilled: '\uEC11',
-  /**
-   * Icon code with the value '\uEC14'.
-   */
   toggleThumb: '\uEC14',
-  /**
-   * Icon code with the value '\uE815'.
-   */
   touch: '\uE815',
-  /**
-   * Icon code with the value '\uE7C9'.
-   */
   touchPointer: '\uE7C9',
-  /**
-   * Icon code with the value '\uE7C0'.
-   */
   train: '\uE7C0',
-  /**
-   * Icon code with the value '\uEB4D'.
-   */
   trainSolid: '\uEB4D',
-  /**
-   * Icon code with the value '\uED95'.
-   */
   transferCall: '\uED95',
-  /**
-   * Icon code with the value '\uE74D'.
-   */
-  trash: '\uE74D',
-  /**
-   * Icon code with the value '\uEED1'.
-   */
   triangleDown12: '\uEED1',
-  /**
-   * Icon code with the value '\uEED2'.
-   */
   triangleLeft12: '\uEED2',
-  /**
-   * Icon code with the value '\uEED3'.
-   */
   triangleRight12: '\uEED3',
-  /**
-   * Icon code with the value '\uEECD'.
-   */
+  triangleSolid: '\uEA08',
   triangleSolidDown12: '\uEECD',
-  /**
-   * Icon code with the value '\uEECE'.
-   */
   triangleSolidLeft12: '\uEECE',
-  /**
-   * Icon code with the value '\uEECF'.
-   */
   triangleSolidRight12: '\uEECF',
-  /**
-   * Icon code with the value '\uEECC'.
-   */
   triangleSolidUp12: '\uEECC',
-  /**
-   * Icon code with the value '\uEED0'.
-   */
   triangleUp12: '\uEED0',
-  /**
-   * Icon code with the value '\uED3F'.
-   */
+  triggerApproval: '\uF3B2',
+  triggerAuto: '\uF24A',
+  triggerUser: '\uF24B',
+  tripleColumn: '\uF1D5',
+  tripleColumnEdit: '\uF323',
   trophy: '\uED3F',
-  /**
-   * Icon code with the value '\uE7DB'.
-   */
+  trophy2Solid: '\uF337',
   turnRight: '\uE7DB',
-  /**
-   * Icon code with the value '\uE7F4'.
-   */
   tvMonitor: '\uE7F4',
-  /**
-   * Icon code with the value '\uEC77'.
-   */
   tvMonitorSelected: '\uEC77',
-  /**
-   * Icon code with the value '\uE8DC'.
-   */
+  typeScriptLanguage: '\uF2F7',
+  umbrella: '\uEC04',
   underline: '\uE8DC',
-  /**
-   * Icon code with the value '\uE7A7'.
-   */
   undo: '\uE7A7',
-  /**
-   * Icon code with the value '\uE8D9'.
-   */
   unfavorite: '\uE8D9',
-  /**
-   * Icon code with the value '\uED97'.
-   */
+  unknown: '\uE9CE',
   unknownCall: '\uED97',
-  /**
-   * Icon code with the value '\uE785'.
-   */
+  unknownMirroredSolid: '\uF2E2',
+  unknownSolid: '\uF2E1',
   unlock: '\uE785',
-  /**
-   * Icon code with the value '\uE77A'.
-   */
+  unlockSolid: '\uF304',
   unpin: '\uE77A',
-  /**
-   * Icon code with the value '\uEDA0'.
-   */
   unsubscribe: '\uEDA0',
-  /**
-   * Icon code with the value '\uE8F6'.
-   */
   unsyncFolder: '\uE8F6',
-  /**
-   * Icon code with the value '\uE74A'.
-   */
   up: '\uE74A',
-  /**
-   * Icon code with the value '\uE898'.
-   */
   upload: '\uE898',
-  /**
-   * Icon code with the value '\uE714'.
-   */
+  userFollowed: '\uF25C',
+  userPause: '\uF2BA',
+  userSync: '\uF2B9',
+  variable: '\uF305',
+  variableGroup: '\uF31B',
+  vb: '\uF2F2',
+  vennDiagram: '\uF273',
   video: '\uE714',
-  /**
-   * Icon code with the value '\uEA0C'.
-   */
   videoSolid: '\uEA0C',
-  /**
-   * Icon code with the value '\uE890'.
-   */
   view: '\uE890',
-  /**
-   * Icon code with the value '\uEF56'.
-   */
-  viewAll2: '\uEF56',
-  /**
-   * Icon code with the value '\uE8A9'.
-   */
   viewAll: '\uE8A9',
-  /**
-   * Icon code with the value '\uED7D'.
-   */
-  visioLogo: '\uED7D',
-  /**
-   * Icon code with the value '\uED87'.
-   */
+  viewAll2: '\uEF56',
+  viewDashboard: '\uF246',
+  viewList: '\uF247',
+  viewListGroup: '\uF248',
+  viewListTree: '\uF249',
+  visioDiagram: '\uF2A0',
+  visioDocument: '\uF2A9',
+  visioLogo: '\uF2A7',
+  visioLogo16: '\uF3A3',
+  visioLogoFill: '\uF2A8',
+  visioLogoFill16: '\uF3A4',
+  visioLogoInverse: '\uED7D',
+  visioLogoInverse16: '\uF3A2',
+  visualBasicLanguage: '\uF2F1',
+  visualStudioLogo: '\uEC22',
   voicemailForward: '\uED87',
-  /**
-   * Icon code with the value '\uED88'.
-   */
   voicemailReply: '\uED88',
-  /**
-   * Icon code with the value '\uE992'.
-   */
   volume0: '\uE992',
-  /**
-   * Icon code with the value '\uE993'.
-   */
   volume1: '\uE993',
-  /**
-   * Icon code with the value '\uE994'.
-   */
   volume2: '\uE994',
-  /**
-   * Icon code with the value '\uE995'.
-   */
   volume3: '\uE995',
-  /**
-   * Icon code with the value '\uEA85'.
-   */
   volumeDisabled: '\uEA85',
-  /**
-   * Icon code with the value '\uED89'.
-   */
+  vstsAltLogo1: '\uF382',
+  vstsAltLogo2: '\uF383',
+  vstsLogo: '\uF381',
   waffle: '\uED89',
-  /**
-   * Icon code with the value '\uE7BA'.
-   */
   warning: '\uE7BA',
-  /**
-   * Icon code with the value '\uEB41'.
-   */
   website: '\uEB41',
-  /**
-   * Icon code with the value '\uEADB'.
-   */
   weights: '\uEADB',
-  /**
-   * Icon code with the value '\uEBE6'.
-   */
+  wifiEthernet: '\uEE77',
   windDirection: '\uEBE6',
-  /**
-   * Icon code with the value '\uE782'.
-   */
   windowsLogo: '\uE782',
-  /**
-   * Icon code with the value '\uED8D'.
-   */
   wipePhone: '\uED8D',
-  /**
-   * Icon code with the value '\uEF71'.
-   */
   wordDocument: '\uEF71',
-  /**
-   * Icon code with the value '\uEC29'.
-   */
-  wordLogo: '\uEC29',
-  /**
-   * Icon code with the value '\uE821'.
-   */
+  wordLogo: '\uF1E3',
+  wordLogo16: '\uF391',
+  wordLogoFill: '\uF1E4',
+  wordLogoFill16: '\uF392',
+  wordLogoInverse: '\uEC29',
+  wordLogoInverse16: '\uF390',
   work: '\uE821',
-  /**
-   * Icon code with the value '\uEA01'.
-   */
   workFlow: '\uEA01',
-  /**
-   * Icon code with the value '\uE918'.
-   */
+  workItem: '\uF314',
+  workItemBar: '\uF35C',
+  workItemBarSolid: '\uF35D',
+  workItemBug: '\uF315',
+  world: '\uE909',
   worldClock: '\uE918',
-  /**
-   * Icon code with the value '\uED19'.
-   */
   yammerLogo: '\uED19',
-  /**
-   * Icon code with the value '\uE71E'.
-   */
+  zipFolder: '\uF012',
   zoom: '\uE71E',
-  /**
-   * Icon code with the value '\uE8A3'.
-   */
   zoomIn: '\uE8A3',
-  /**
-   * Icon code with the value '\uE71F'.
-   */
   zoomOut: '\uE71F'
 };

From 74c01f80ee4fb502a45c77ac0ad135148b2146d9 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 13 Jun 2017 22:40:23 -0700
Subject: [PATCH 0107/1641] FocusZone: now correctly wraps in bidirectional
 mode. (#1991)

* Making FocusZone work correctly in bidirectional with regards to wrapping to the next line.

* Fixing test.

* Adding change files.

* Removing the tabindex=-1 check, because it conflicts with FocusZone setting tabIndex=-1 on elements.

* Adding del key.

* Create BasePicker.tsx
---
 .../focuszone-fix_2017-06-14-02-52.json       | 11 ++++++
 .../focuszone-fix_2017-06-14-02-52.json       | 11 ++++++
 .../src/components/FocusZone/FocusZone.tsx    | 37 ++++++++++++-------
 .../src/components/pickers/BasePicker.tsx     |  1 -
 .../pickers/Suggestions/Suggestions.tsx       |  1 +
 packages/utilities/src/focus.test.tsx         |  9 -----
 packages/utilities/src/focus.ts               | 19 +++++-----
 7 files changed, 56 insertions(+), 33 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/focuszone-fix_2017-06-14-02-52.json
 create mode 100644 common/changes/office-ui-fabric-react/focuszone-fix_2017-06-14-02-52.json

diff --git a/common/changes/@uifabric/utilities/focuszone-fix_2017-06-14-02-52.json b/common/changes/@uifabric/utilities/focuszone-fix_2017-06-14-02-52.json
new file mode 100644
index 0000000000000..3c0187577f01a
--- /dev/null
+++ b/common/changes/@uifabric/utilities/focuszone-fix_2017-06-14-02-52.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "isTabbableElement: fixed edge cases with identifying focusable elements that have tabIndex assigned.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/focuszone-fix_2017-06-14-02-52.json b/common/changes/office-ui-fabric-react/focuszone-fix_2017-06-14-02-52.json
new file mode 100644
index 0000000000000..2508c48c233af
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/focuszone-fix_2017-06-14-02-52.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "FocusZone: bidirectional movement now wraps on lines.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 2a9f7e9315a0c..32d87de74f354 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -447,6 +447,11 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
           const targetRect = element.getBoundingClientRect();
           const elementDistance = getDistanceFromCenter(activeRect, targetRect);
 
+          if (elementDistance === -1 && candidateDistance === -1) {
+            candidateElement = element;
+            break;
+          }
+
           if (elementDistance > -1 && (candidateDistance === -1 || elementDistance < candidateDistance)) {
             candidateDistance = elementDistance;
             candidateElement = element;
@@ -491,6 +496,10 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       let targetRectTop = Math.floor(targetRect.top);
       let activeRectBottom = Math.floor(activeRect.bottom);
 
+      if (targetRectTop < activeRectBottom) {
+        return 999999999;
+      }
+
       if ((targetTop === -1 && targetRectTop >= activeRectBottom) ||
         (targetRectTop === targetTop)) {
         targetTop = targetRectTop;
@@ -524,6 +533,10 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       let targetRectTop = Math.floor(targetRect.top);
       let activeRectTop = Math.floor(activeRect.top);
 
+      if (targetRectBottom > activeRectTop) {
+        return 999999999;
+      }
+
       if ((targetTop === -1 && targetRectBottom <= activeRectTop) ||
         (targetRectTop === targetTop)) {
         targetTop = targetRectTop;
@@ -544,20 +557,18 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   }
 
   private _moveFocusLeft(): boolean {
-    let targetTop = -1;
     const topAlignment = this._focusAlignment.top;
 
     if (this._moveFocus(getRTL(), (activeRect: ClientRect, targetRect: ClientRect) => {
       let distance = -1;
 
-      if ((
-        targetTop === -1 &&
+      if (
+        targetRect.bottom > activeRect.top &&
         targetRect.right <= activeRect.right &&
-        (this.props.direction === FocusZoneDirection.horizontal || targetRect.top === activeRect.top)) ||
-        (targetRect.top === targetTop)) {
+        this.props.direction !== FocusZoneDirection.vertical
+      ) {
 
-        targetTop = targetRect.top;
-        distance = Math.abs((targetRect.top + (targetRect.height / 2)) - topAlignment);
+        distance = activeRect.right - targetRect.right;
       }
 
       return distance;
@@ -570,20 +581,18 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   }
 
   private _moveFocusRight(): boolean {
-    let targetTop = -1;
     const topAlignment = this._focusAlignment.top;
 
     if (this._moveFocus(!getRTL(), (activeRect: ClientRect, targetRect: ClientRect) => {
       let distance = -1;
 
-      if ((
-        targetTop === -1 &&
+      if (
+        targetRect.top < activeRect.bottom &&
         targetRect.left >= activeRect.left &&
-        (this.props.direction === FocusZoneDirection.horizontal || targetRect.top === activeRect.top)) ||
-        (targetRect.top === targetTop)) {
+        this.props.direction !== FocusZoneDirection.vertical
+      ) {
 
-        targetTop = targetRect.top;
-        distance = Math.abs((targetRect.top + (targetRect.height / 2)) - topAlignment);
+        distance = targetRect.left - activeRect.left;
       }
 
       return distance;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 177ba0158fdb6..8545af55d27e4 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -108,7 +108,6 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
         onKeyDown={ this.onKeyDown }>
         <FocusZone
           ref={ this._resolveRef('focusZone') }
-          isCircularNavigation={ true }
           direction={ FocusZoneDirection.bidirectional }
           isInnerZoneKeystroke={ this._isFocusZoneInnerKeystroke }>
           <SelectionZone selection={ this.selection } selectionMode={ SelectionMode.multiple }>
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index 9bab026069e1c..9240d9ebdc4f5 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -176,6 +176,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
         role='menu'>
         { suggestions.map((suggestion, index) =>
           <div ref={ this._resolveRef(suggestion.selected ? '_selectedElement' : '') }
+            // tslint:disable-next-line:no-string-literal
             key={ suggestion.item['key'] ? suggestion.item['key'] : index }
             id={ 'sug-' + index }
             role='menuitem'>
diff --git a/packages/utilities/src/focus.test.tsx b/packages/utilities/src/focus.test.tsx
index cca238d394515..3d60e27f07190 100644
--- a/packages/utilities/src/focus.test.tsx
+++ b/packages/utilities/src/focus.test.tsx
@@ -123,13 +123,4 @@ describe('isElementTabbable', () => {
     expect(isElementTabbable(button)).is.false;
   });
 
-  it('returns false when tabindex=-1', () => {
-    let button = document.createElement('button');
-
-    button.setAttribute('tabindex', '-1');
-
-    expect(isElementTabbable(button)).is.false;
-
-  });
-
 });
\ No newline at end of file
diff --git a/packages/utilities/src/focus.ts b/packages/utilities/src/focus.ts
index 4ada29e842278..bffe10bef6931 100644
--- a/packages/utilities/src/focus.ts
+++ b/packages/utilities/src/focus.ts
@@ -185,29 +185,30 @@ export function isElementTabbable(element: HTMLElement): boolean {
     return false;
   }
 
-  // In IE, element.tabIndex is default to 0. We need to use element get tabIndex attribute to get the correct tabIndex
-  let tabIndex = -1;
+  let tabIndex = 0;
+  let tabIndexAttributeValue = null;
 
   if (element && element.getAttribute) {
-    let tabIndexAttributeValue = element.getAttribute('tabIndex');
+    tabIndexAttributeValue = element.getAttribute('tabIndex');
+
     if (tabIndexAttributeValue) {
       tabIndex = parseInt(tabIndexAttributeValue, 10);
     }
   }
 
   let isFocusableAttribute = element.getAttribute ? element.getAttribute(IS_FOCUSABLE_ATTRIBUTE) : null;
+  let isTabIndexSet = tabIndexAttributeValue !== null && tabIndex >= 0;
 
   return (
-    !!element && isFocusableAttribute !== 'false' &&
-    tabIndex >= 0 || !tabIndex &&
+    !!element &&
+    isFocusableAttribute !== 'false' &&
     (element.tagName === 'A' ||
       (element.tagName === 'BUTTON') ||
       (element.tagName === 'INPUT') ||
       (element.tagName === 'TEXTAREA') ||
-      (element.getAttribute && (
-        isFocusableAttribute === 'true' ||
-        element.getAttribute('role') === 'button'
-      ))
+      isFocusableAttribute === 'true' ||
+      isTabIndexSet ||
+      element.getAttribute && element.getAttribute('role') === 'button'
     ));
 }
 

From 5c591cad8e4de27a353fb11727aeddedb4820da1 Mon Sep 17 00:00:00 2001
From: Manish Dahamiwal <mdhamiwal@gmail.com>
Date: Wed, 14 Jun 2017 11:13:54 +0530
Subject: [PATCH 0108/1641] Remove ms-high-contrast-adjust:none from fabric
 styles (#1987)

* remove high contrast adjust from common styles

* change log
---
 .../styling/hc-adjust-fix_2017-06-13-13-35.json       | 11 +++++++++++
 packages/styling/src/styles/DefaultFontStyles.ts      |  1 -
 2 files changed, 11 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/styling/hc-adjust-fix_2017-06-13-13-35.json

diff --git a/common/changes/@uifabric/styling/hc-adjust-fix_2017-06-13-13-35.json b/common/changes/@uifabric/styling/hc-adjust-fix_2017-06-13-13-35.json
new file mode 100644
index 0000000000000..00cb33cb99485
--- /dev/null
+++ b/common/changes/@uifabric/styling/hc-adjust-fix_2017-06-13-13-35.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Remove high contrast adjust from common styles",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "manishda@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/styling/src/styles/DefaultFontStyles.ts b/packages/styling/src/styles/DefaultFontStyles.ts
index 0645e53b30690..ce12f3e085336 100644
--- a/packages/styling/src/styles/DefaultFontStyles.ts
+++ b/packages/styling/src/styles/DefaultFontStyles.ts
@@ -130,7 +130,6 @@ function _createFont(size: string, weight: number): IRawStyle {
   return {
     fontFamily: _getFontFamily(),
     MozOsxFontSmoothing: 'grayscale',
-    MsHighContrastAdjust: 'none',
     WebkitFontSmoothing: 'antialiased',
     fontSize: size,
     fontWeight: weight

From 0a53930a167b02ba931e6f5231472da854701bab Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 13 Jun 2017 22:45:23 -0700
Subject: [PATCH 0109/1641] Dropdown: Fixed onRenderPlaceHolder, added data
 prop to items, updated docs (#1964)

* Add data prop to dropdown items and update examples

* Updated examples, fixed broken onRenderPlaceholder

* CHange file

* Fixed linting errors
---
 ...dropdown-doc-updates_2017-06-09-17-21.json | 11 +++
 .../src/components/Dropdown/Dropdown.Props.ts |  5 ++
 .../src/components/Dropdown/Dropdown.tsx      |  5 +-
 .../src/components/Dropdown/DropdownPage.tsx  | 16 +++-
 .../examples/Dropdown.Basic.Example.scss      |  8 +-
 .../examples/Dropdown.Basic.Example.tsx       |  2 +-
 .../examples/Dropdown.Custom.Example.tsx      | 82 +++++++++++++++++++
 7 files changed, 122 insertions(+), 7 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/dropdown-doc-updates_2017-06-09-17-21.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/dropdown-doc-updates_2017-06-09-17-21.json b/common/changes/office-ui-fabric-react/dropdown-doc-updates_2017-06-09-17-21.json
new file mode 100644
index 0000000000000..6e0bbf984101c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/dropdown-doc-updates_2017-06-09-17-21.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: Fixed onRenderPlaceholder and update docs",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
index 504f8f92a25ed..a28fafc3d552f 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
@@ -152,6 +152,11 @@ export interface IDropdownOption {
   /** If option is selected. */
   selected?: boolean;
 
+  /**
+   * Data available to custom onRender functions.
+   */
+  data?: any;
+
   /**
    * Deprecated at v.65.1, use 'selected' instead.
    * @deprecated
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index e25cdd7216967..e818ad5583f0a 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -106,7 +106,8 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
       required,
       errorMessage,
       onRenderTitle = this._onRenderTitle,
-      onRenderContainer = this._onRenderContainer
+      onRenderContainer = this._onRenderContainer,
+      onRenderPlaceHolder = this._onRenderPlaceHolder
     } = this.props;
     let { isOpen, selectedIndex } = this.state;
     let selectedOption = options[selectedIndex];
@@ -159,7 +160,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
               selectedOption ? (
                 onRenderTitle(selectedOption, this._onRenderTitle)
               ) :
-                this._onRenderPlaceHolder(this.props)
+                onRenderPlaceHolder(this.props, this._onRenderPlaceHolder)
             }
           </span>
           <Icon className={ css('ms-Dropdown-caretDown', styles.caretDown) } iconName='chevronDown' />
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
index 788196f344eae..d43f945a4212b 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
@@ -6,8 +6,10 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { DropdownBasicExample } from './examples/Dropdown.Basic.Example';
+import { DropdownCustomExample } from './examples/Dropdown.Custom.Example';
 
 const DropdownBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx') as string;
+const DropdownCustomExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx') as string;
 
 export class DropdownPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
@@ -16,9 +18,17 @@ export class DropdownPage extends React.Component<IComponentDemoPageProps, {}> {
         title='Dropdown'
         componentName='DropdownExample'
         exampleCards={
-          <ExampleCard title='Dropdown' code={ DropdownBasicExampleCode }>
-            <DropdownBasicExample />
-          </ExampleCard>
+          <div>
+            <ExampleCard title='Dropdown' code={ DropdownBasicExampleCode }>
+              <DropdownBasicExample />
+            </ExampleCard>
+
+            <ExampleCard title='Customized Dropdown' code={ DropdownCustomExampleCode }>
+              <DropdownCustomExample />
+            </ExampleCard>
+
+          </div>
+
         }
         propertiesTables={
           <PropertiesTableSet
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss
index a7522599e8928..08458ffadaad1 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss
@@ -1,5 +1,11 @@
 :global {
-  .ms-DropdownBasicExample {
+  .dropdownExample {
     max-width: 300px;
   }
+  .dropdownExample-option {
+    display: flex;
+  }
+  .dropdownExample-placeholder {
+    display: flex;
+  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
index 43bf14093a8f1..80f547866832b 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
@@ -15,7 +15,7 @@ export class DropdownBasicExample extends React.Component<any, any> {
     let { selectedItem } = this.state;
 
     return (
-      <div className='ms-DropdownBasicExample'>
+      <div className='dropdownExample'>
 
         <Dropdown
           placeHolder='Select an Option'
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
new file mode 100644
index 0000000000000..ecf2a75b5a3d5
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
@@ -0,0 +1,82 @@
+import * as React from 'react';
+import { Dropdown } from 'office-ui-fabric-react/lib/Dropdown';
+import './Dropdown.Basic.Example.scss';
+import { DropdownMenuItemType, IDropdownOption, IDropdownProps } from './../Dropdown.Props';
+import { Icon } from '../../Icon';
+
+export class DropdownCustomExample extends React.Component<any, any> {
+  constructor() {
+    super();
+    this.state = {
+      selectedItem: null
+    };
+  }
+
+  public render() {
+    let { selectedItem } = this.state;
+
+    return (
+      <div className='dropdownExample'>
+
+        <Dropdown
+          placeHolder='Select an Option'
+          label='Custom example:'
+          id='Customdrop1'
+          ariaLabel='Custom dropdown example'
+          onRenderPlaceHolder={ this._onRenderPlaceHolder }
+          onRenderTitle={ this._onRenderOption }
+          onRenderOption={ this._onRenderOption }
+          options={
+            [
+              { key: 'Header', text: 'Actions', itemType: DropdownMenuItemType.Header },
+              { key: 'A', text: 'Option a', data: { icon: 'Memo' } },
+              { key: 'B', text: 'Option b', data: { icon: 'Print' } },
+              { key: 'C', text: 'Option c', data: { icon: 'ShoppingCart' } },
+              { key: 'D', text: 'Option d', data: { icon: 'Train' } },
+              { key: 'E', text: 'Option e', data: { icon: 'Repair' } },
+              { key: 'divider_2', text: '-', itemType: DropdownMenuItemType.Divider },
+              { key: 'Header2', text: 'People', itemType: DropdownMenuItemType.Header },
+              { key: 'F', text: 'Option f', data: { icon: 'Running' } },
+              { key: 'G', text: 'Option g', data: { icon: 'EmojiNeutral' } },
+              { key: 'H', text: 'Option h', data: { icon: 'ChatInviteFriend' } },
+              { key: 'I', text: 'Option i', data: { icon: 'SecurityGroup' } },
+              { key: 'J', text: 'Option j', data: { icon: 'AddGroup' } },
+            ]
+          }
+        />
+
+      </div>
+
+    );
+  }
+
+  private _onRenderOption = (option: IDropdownOption): JSX.Element => {
+    return (
+      <div className='dropdownExample-option'>
+        { option.data && option.data.icon &&
+          <Icon
+            style={ { marginRight: '8px' } }
+            iconName={ option.data.icon }
+            aria-hidden='true'
+            title={ option.data.icon }
+          />
+        }
+        <span>{ option.text }</span>
+      </div>
+    );
+  }
+
+  private _onRenderPlaceHolder = (props: IDropdownProps): JSX.Element => {
+    return (
+      <div className='dropdownExample-placeholder'>
+        <Icon
+          style={ { marginRight: '8px' } }
+          iconName={ 'MessageFill' }
+          aria-hidden='true'
+        />
+        <span>{ props.placeHolder }</span>
+      </div>
+    );
+  }
+
+}

From ae4a3494ac35336366d3c438f934f1d730189810 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 14 Jun 2017 06:02:15 +0000
Subject: [PATCH 0110/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 25 +++++++
 apps/fabric-website/CHANGELOG.md              |  9 ++-
 apps/fabric-website/package.json              |  8 +--
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../font-fix_2017-06-14-00-05.json            | 11 ---
 ...tilities-strict-null_2017-06-12-16-27.json | 11 ---
 .../font-fix_2017-06-14-00-05.json            | 11 ---
 ...tilities-strict-null_2017-06-12-16-27.json | 11 ---
 .../styling/font-fix_2017-06-14-00-05.json    | 11 ---
 .../hc-adjust-fix_2017-06-13-13-35.json       | 11 ---
 .../miwhea-icons-2.30_2017-06-08-19-15.json   | 11 ---
 ...tilities-strict-null_2017-06-12-16-27.json | 11 ---
 .../focuszone-fix_2017-06-14-02-52.json       | 11 ---
 .../utilities/master_2017-06-09-15-37.json    | 11 ---
 ...tilities-strict-null_2017-06-12-16-27.json | 11 ---
 ...button-aria-haspopup_2017-06-13-20-32.json | 11 ---
 ...dropdown-doc-updates_2017-06-09-17-21.json | 11 ---
 .../focuszone-fix_2017-06-14-02-52.json       | 11 ---
 .../font-fix_2017-06-14-00-05.json            | 11 ---
 ...-AccessibilityBugFix_2017-06-08-16-01.json | 11 ---
 ...al-dropdown-aria-fix_2017-06-13-13-03.json | 11 ---
 ...tilities-strict-null_2017-06-12-16-27.json | 11 ---
 ...eoplepicker-bugfixes_2017-06-05-22-57.json | 11 ---
 ...PropsForAriaLabelIds_2017-06-12-23-06.json | 11 ---
 ...-edwliu-dropdown-fix_2017-05-23-21-07.json | 10 ---
 packages/example-app-base/CHANGELOG.json      | 22 ++++++
 packages/example-app-base/CHANGELOG.md        |  9 ++-
 packages/example-app-base/package.json        |  6 +-
 packages/example-component/package.json       |  8 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 72 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 21 +++++-
 packages/office-ui-fabric-react/package.json  |  8 +--
 packages/styling/CHANGELOG.json               | 36 ++++++++++
 packages/styling/CHANGELOG.md                 | 15 +++-
 packages/styling/package.json                 |  4 +-
 packages/utilities/CHANGELOG.json             | 26 +++++++
 packages/utilities/CHANGELOG.md               | 14 +++-
 packages/utilities/package.json               |  2 +-
 40 files changed, 265 insertions(+), 256 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/font-fix_2017-06-14-00-05.json
 delete mode 100644 common/changes/@uifabric/example-app-base/utilities-strict-null_2017-06-12-16-27.json
 delete mode 100644 common/changes/@uifabric/fabric-website/font-fix_2017-06-14-00-05.json
 delete mode 100644 common/changes/@uifabric/fabric-website/utilities-strict-null_2017-06-12-16-27.json
 delete mode 100644 common/changes/@uifabric/styling/font-fix_2017-06-14-00-05.json
 delete mode 100644 common/changes/@uifabric/styling/hc-adjust-fix_2017-06-13-13-35.json
 delete mode 100644 common/changes/@uifabric/styling/miwhea-icons-2.30_2017-06-08-19-15.json
 delete mode 100644 common/changes/@uifabric/styling/utilities-strict-null_2017-06-12-16-27.json
 delete mode 100644 common/changes/@uifabric/utilities/focuszone-fix_2017-06-14-02-52.json
 delete mode 100644 common/changes/@uifabric/utilities/master_2017-06-09-15-37.json
 delete mode 100644 common/changes/@uifabric/utilities/utilities-strict-null_2017-06-12-16-27.json
 delete mode 100644 common/changes/office-ui-fabric-react/bekaise-button-aria-haspopup_2017-06-13-20-32.json
 delete mode 100644 common/changes/office-ui-fabric-react/dropdown-doc-updates_2017-06-09-17-21.json
 delete mode 100644 common/changes/office-ui-fabric-react/focuszone-fix_2017-06-14-02-52.json
 delete mode 100644 common/changes/office-ui-fabric-react/font-fix_2017-06-14-00-05.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-AbhinavSinghT-AccessibilityBugFix_2017-06-08-16-01.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-prmittal-dropdown-aria-fix_2017-06-13-13-03.json
 delete mode 100644 common/changes/office-ui-fabric-react/utilities-strict-null_2017-06-12-16-27.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-peoplepicker-bugfixes_2017-06-05-22-57.json
 delete mode 100644 common/changes/office-ui-fabric-react/zoarif-addingDialogPropsForAriaLabelIds_2017-06-12-23-06.json
 delete mode 100644 common/changes/v-edwliu-dropdown-fix_2017-05-23-21-07.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 594741024caed..7b6ca46321062 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,31 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.5.38",
+      "tag": "@uifabric/fabric-website_v4.5.38",
+      "date": "Wed, 14 Jun 2017 06:02:15 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "f962234cf5c1231976331cfabc06680a762cd516",
+            "comment": "Bumping fabric-core dependency."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `3.0.1` to `3.0.2`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.1.2 <5.0.0` to `>=4.3.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.5.0 <5.0.0` to `>=4.5.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.5.37",
       "tag": "@uifabric/fabric-website_v4.5.37",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 62c9b0d4fa763..a13c4cf69e3dd 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Tue, 13 Jun 2017 10:13:21 GMT and should not be manually modified.
+This log was last generated on Wed, 14 Jun 2017 06:02:15 GMT and should not be manually modified.
+
+## 4.5.38
+Wed, 14 Jun 2017 06:02:15 GMT
+
+### Patches
+
+- Bumping fabric-core dependency.
 
 ## 4.5.37
 Tue, 13 Jun 2017 10:13:21 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 6287ffde2242b..fe0348374de92 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.5.37",
+  "version": "4.5.38",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,13 +47,13 @@
     "webpack-bundle-analyzer": "^2.2.1"
   },
   "dependencies": {
-    "@uifabric/example-app-base": "3.0.1",
-    "@uifabric/utilities": ">=4.1.2 <5.0.0",
+    "@uifabric/example-app-base": "3.0.2",
+    "@uifabric/utilities": ">=4.3.0 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.5.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.5.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 3afdb813adb6b..6c5c5dc544e02 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.5.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.6.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 581208a43d3af..61a6862c60aa2 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.5.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.6.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 71935ad83a26e..a886af9a9b202 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.5.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.6.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/@uifabric/example-app-base/font-fix_2017-06-14-00-05.json b/common/changes/@uifabric/example-app-base/font-fix_2017-06-14-00-05.json
deleted file mode 100644
index 7aabda6ce5291..0000000000000
--- a/common/changes/@uifabric/example-app-base/font-fix_2017-06-14-00-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Bumping fabric-core dependency.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/utilities-strict-null_2017-06-12-16-27.json b/common/changes/@uifabric/example-app-base/utilities-strict-null_2017-06-12-16-27.json
deleted file mode 100644
index e807ce07d1d8c..0000000000000
--- a/common/changes/@uifabric/example-app-base/utilities-strict-null_2017-06-12-16-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/font-fix_2017-06-14-00-05.json b/common/changes/@uifabric/fabric-website/font-fix_2017-06-14-00-05.json
deleted file mode 100644
index 26b1f94ae5625..0000000000000
--- a/common/changes/@uifabric/fabric-website/font-fix_2017-06-14-00-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Bumping fabric-core dependency.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/utilities-strict-null_2017-06-12-16-27.json b/common/changes/@uifabric/fabric-website/utilities-strict-null_2017-06-12-16-27.json
deleted file mode 100644
index cbeaf5c6e2864..0000000000000
--- a/common/changes/@uifabric/fabric-website/utilities-strict-null_2017-06-12-16-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/font-fix_2017-06-14-00-05.json b/common/changes/@uifabric/styling/font-fix_2017-06-14-00-05.json
deleted file mode 100644
index 1b8c481bd002b..0000000000000
--- a/common/changes/@uifabric/styling/font-fix_2017-06-14-00-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Updating FabricConfig support to allow themes to be providable at bundle load time without weird race conditions.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/hc-adjust-fix_2017-06-13-13-35.json b/common/changes/@uifabric/styling/hc-adjust-fix_2017-06-13-13-35.json
deleted file mode 100644
index 00cb33cb99485..0000000000000
--- a/common/changes/@uifabric/styling/hc-adjust-fix_2017-06-13-13-35.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Remove high contrast adjust from common styles",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "manishda@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/miwhea-icons-2.30_2017-06-08-19-15.json b/common/changes/@uifabric/styling/miwhea-icons-2.30_2017-06-08-19-15.json
deleted file mode 100644
index 891b9343488ff..0000000000000
--- a/common/changes/@uifabric/styling/miwhea-icons-2.30_2017-06-08-19-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Updates to version 2.30 of the icon font",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "miwhea@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/utilities-strict-null_2017-06-12-16-27.json b/common/changes/@uifabric/styling/utilities-strict-null_2017-06-12-16-27.json
deleted file mode 100644
index 25558583bb65c..0000000000000
--- a/common/changes/@uifabric/styling/utilities-strict-null_2017-06-12-16-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Enable strictNullChecks in utilities package",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/focuszone-fix_2017-06-14-02-52.json b/common/changes/@uifabric/utilities/focuszone-fix_2017-06-14-02-52.json
deleted file mode 100644
index 3c0187577f01a..0000000000000
--- a/common/changes/@uifabric/utilities/focuszone-fix_2017-06-14-02-52.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "isTabbableElement: fixed edge cases with identifying focusable elements that have tabIndex assigned.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/master_2017-06-09-15-37.json b/common/changes/@uifabric/utilities/master_2017-06-09-15-37.json
deleted file mode 100644
index cd0e5b9ae8778..0000000000000
--- a/common/changes/@uifabric/utilities/master_2017-06-09-15-37.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Focus Utility should respect tabindex=-1 on tabable elements",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "cjsheets@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/utilities-strict-null_2017-06-12-16-27.json b/common/changes/@uifabric/utilities/utilities-strict-null_2017-06-12-16-27.json
deleted file mode 100644
index 05dbdf6b146a3..0000000000000
--- a/common/changes/@uifabric/utilities/utilities-strict-null_2017-06-12-16-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Enable strictNullChecks in utilities package",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/bekaise-button-aria-haspopup_2017-06-13-20-32.json b/common/changes/office-ui-fabric-react/bekaise-button-aria-haspopup_2017-06-13-20-32.json
deleted file mode 100644
index 7eb489e3806e4..0000000000000
--- a/common/changes/office-ui-fabric-react/bekaise-button-aria-haspopup_2017-06-13-20-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Buttons: Added `aria-haspopup` to buttons with menuProps.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "bekaise@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/dropdown-doc-updates_2017-06-09-17-21.json b/common/changes/office-ui-fabric-react/dropdown-doc-updates_2017-06-09-17-21.json
deleted file mode 100644
index 6e0bbf984101c..0000000000000
--- a/common/changes/office-ui-fabric-react/dropdown-doc-updates_2017-06-09-17-21.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: Fixed onRenderPlaceholder and update docs",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/focuszone-fix_2017-06-14-02-52.json b/common/changes/office-ui-fabric-react/focuszone-fix_2017-06-14-02-52.json
deleted file mode 100644
index 2508c48c233af..0000000000000
--- a/common/changes/office-ui-fabric-react/focuszone-fix_2017-06-14-02-52.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "FocusZone: bidirectional movement now wraps on lines.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/font-fix_2017-06-14-00-05.json b/common/changes/office-ui-fabric-react/font-fix_2017-06-14-00-05.json
deleted file mode 100644
index 54e8f233321f7..0000000000000
--- a/common/changes/office-ui-fabric-react/font-fix_2017-06-14-00-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Bumping fabric-core dependency to have Segoe UI be part of the font fallback.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-AbhinavSinghT-AccessibilityBugFix_2017-06-08-16-01.json b/common/changes/office-ui-fabric-react/users-AbhinavSinghT-AccessibilityBugFix_2017-06-08-16-01.json
deleted file mode 100644
index 9ee7de96b2fec..0000000000000
--- a/common/changes/office-ui-fabric-react/users-AbhinavSinghT-AccessibilityBugFix_2017-06-08-16-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "FocusZone should reset active element if it is not tabbable.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "abhinavsingh.bits@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-prmittal-dropdown-aria-fix_2017-06-13-13-03.json b/common/changes/office-ui-fabric-react/users-prmittal-dropdown-aria-fix_2017-06-13-13-03.json
deleted file mode 100644
index 3516cb0bd177c..0000000000000
--- a/common/changes/office-ui-fabric-react/users-prmittal-dropdown-aria-fix_2017-06-13-13-03.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: adding aria attribute `aria-readonly=true` and adjusting `aria-owns` to only show in cases where it is opened.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "prmittal@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/utilities-strict-null_2017-06-12-16-27.json b/common/changes/office-ui-fabric-react/utilities-strict-null_2017-06-12-16-27.json
deleted file mode 100644
index 180d086f0ee73..0000000000000
--- a/common/changes/office-ui-fabric-react/utilities-strict-null_2017-06-12-16-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Enable strictNullChecks in utilities package",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-peoplepicker-bugfixes_2017-06-05-22-57.json b/common/changes/office-ui-fabric-react/v-krbrow-peoplepicker-bugfixes_2017-06-05-22-57.json
deleted file mode 100644
index beb1dbbc14901..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-peoplepicker-bugfixes_2017-06-05-22-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "PeoplePicker: fixing styling, focus, and extra rerendering issues.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/zoarif-addingDialogPropsForAriaLabelIds_2017-06-12-23-06.json b/common/changes/office-ui-fabric-react/zoarif-addingDialogPropsForAriaLabelIds_2017-06-12-23-06.json
deleted file mode 100644
index 2493c643c597c..0000000000000
--- a/common/changes/office-ui-fabric-react/zoarif-addingDialogPropsForAriaLabelIds_2017-06-12-23-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Adding Aria label props for Dialog",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "zoarif@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/v-edwliu-dropdown-fix_2017-05-23-21-07.json b/common/changes/v-edwliu-dropdown-fix_2017-05-23-21-07.json
deleted file mode 100644
index 72a180c43fa1f..0000000000000
--- a/common/changes/v-edwliu-dropdown-fix_2017-05-23-21-07.json
+++ /dev/null
@@ -1,10 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: Fix keyboard focus on Header/Separator items",
-      "type": "patch"
-    }
-  ],
-  "email": "v-edwliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 08652b4c964b0..7bb0f4244dfb7 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "3.0.2",
+      "tag": "@uifabric/example-app-base_v3.0.2",
+      "date": "Wed, 14 Jun 2017 06:02:15 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "f962234cf5c1231976331cfabc06680a762cd516",
+            "comment": "Bumping fabric-core dependency."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.7.4 <1.0.0` to `>=0.8.0 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.1.2 <5.0.0` to `>=4.3.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "3.0.1",
       "tag": "@uifabric/example-app-base_v3.0.1",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index a0b8d5cd8457c..d140a79363e3c 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Mon, 12 Jun 2017 01:47:18 GMT and should not be manually modified.
+This log was last generated on Wed, 14 Jun 2017 06:02:15 GMT and should not be manually modified.
+
+## 3.0.2
+Wed, 14 Jun 2017 06:02:15 GMT
+
+### Patches
+
+- Bumping fabric-core dependency.
 
 ## 3.0.1
 Mon, 12 Jun 2017 01:47:18 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 2573b7d501617..6cd0b47bb431e 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "3.0.1",
+  "version": "3.0.2",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -40,8 +40,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.7.4 <1.0.0",
-    "@uifabric/utilities": ">=4.1.2 <5.0.0",
+    "@uifabric/styling": ">=0.8.0 <1.0.0",
+    "@uifabric/utilities": ">=4.3.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.4.0 <5.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index f67e9fea40b90..5932557d9e671 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-component",
-  "version": "1.0.34",
+  "version": "1.0.35",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -21,8 +21,8 @@
     "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "3.0.1",
-    "@uifabric/utilities": "4.2.0",
+    "@uifabric/example-app-base": "3.0.2",
+    "@uifabric/utilities": "4.3.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.5.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.6.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index f5907ab3e42a8..80904a874f0f9 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,78 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.6.0",
+      "tag": "office-ui-fabric-react_v4.6.0",
+      "date": "Wed, 14 Jun 2017 06:02:15 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Benjamin Kaiser <benjaminjkaiser@gmail.com>",
+            "commit": "e0dc2ba3f8504d77c0f19567e646608b1094018c",
+            "comment": "Buttons: Added `aria-haspopup` to buttons with menuProps."
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "74c01f80ee4fb502a45c77ac0ad135148b2146d9",
+            "comment": "FocusZone: bidirectional movement now wraps on lines."
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "f962234cf5c1231976331cfabc06680a762cd516",
+            "comment": "Bumping fabric-core dependency to have Segoe UI be part of the font fallback."
+          },
+          {
+            "author": "Abhinav Singh Teotia <abhinavsingh.bits@gmail.com>",
+            "commit": "79f1c3c5ed9ae63c1e035c67ad81a31b997bbe78",
+            "comment": "FocusZone should reset active element if it is not tabbable."
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "057d6526f255d23b185c4d4618d63939b2ba8290",
+            "comment": "Dropdown: adding aria attribute `aria-readonly=true` and adjusting `aria-owns` to only show in cases where it is opened."
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "a07c7287aeec78d8f17712551f94d3af55031592",
+            "comment": "Enable strictNullChecks in utilities package"
+          },
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "8c64e599a92a969603525640cedb8e0119efd61f",
+            "comment": "PeoplePicker: fixing styling, focus, and extra rerendering issues."
+          },
+          {
+            "author": "Eddie Liu <leddie24@gmail.com>",
+            "commit": "f1437d6fa8f0e833efcdb7d5aa2e7de71ebd1e99",
+            "comment": "Dropdown: Fix keyboard focus on Header/Separator items"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "0a53930a167b02ba931e6f5231472da854701bab",
+            "comment": "Dropdown: Fixed onRenderPlaceholder and update docs"
+          },
+          {
+            "author": "zoarif <zoarif@microsoft.com>",
+            "commit": "0c2ecc7bab31a37798ce256a522923e2d1c4e7d3",
+            "comment": "Adding Aria label props for Dialog"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.1.2 <5.0.0` to `>=4.3.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.7.4 <1.0.0` to `>=0.8.0 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `3.0.1` to `3.0.2`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.5.1",
       "tag": "office-ui-fabric-react_v4.5.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index ba768e02ef5eb..203287ae2df82 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,25 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 13 Jun 2017 10:13:21 GMT and should not be manually modified.
+This log was last generated on Wed, 14 Jun 2017 06:02:15 GMT and should not be manually modified.
+
+## 4.6.0
+Wed, 14 Jun 2017 06:02:15 GMT
+
+### Minor changes
+
+- Dropdown: Fixed onRenderPlaceholder and update docs
+- Adding Aria label props for Dialog
+
+### Patches
+
+- Buttons: Added `aria-haspopup` to buttons with menuProps.
+- FocusZone: bidirectional movement now wraps on lines.
+- Bumping fabric-core dependency to have Segoe UI be part of the font fallback.
+- FocusZone should reset active element if it is not tabbable.
+- Dropdown: adding aria attribute `aria-readonly=true` and adjusting `aria-owns` to only show in cases where it is opened.
+- Enable strictNullChecks in utilities package
+- PeoplePicker: fixing styling, focus, and extra rerendering issues.
+- Dropdown: Fix keyboard focus on Header/Separator items
 
 ## 4.5.1
 Tue, 13 Jun 2017 10:13:21 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 94ce1becbd94b..84dc5a07a0029 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.5.1",
+  "version": "4.6.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "^2.2.2",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "3.0.1",
+    "@uifabric/example-app-base": "3.0.2",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -71,8 +71,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.1.2 <5.0.0",
-    "@uifabric/styling": ">=0.7.4 <1.0.0",
+    "@uifabric/utilities": ">=4.3.0 <5.0.0",
+    "@uifabric/styling": ">=0.8.0 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index ddd343dc5b4b7..d6ff1472ec749 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,42 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.8.0",
+      "tag": "@uifabric/styling_v0.8.0",
+      "date": "Wed, 14 Jun 2017 06:02:15 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "f962234cf5c1231976331cfabc06680a762cd516",
+            "comment": "Updating FabricConfig support to allow themes to be providable at bundle load time without weird race conditions."
+          },
+          {
+            "author": "Mike Wheaton <miwhea@microsoft.com>",
+            "commit": "560719e7fc887c52b3ffc96cba08f9115b5c03e7",
+            "comment": "Updates to version 2.30 of the icon font"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Manish Dahamiwal <mdhamiwal@gmail.com>",
+            "commit": "5c591cad8e4de27a353fb11727aeddedb4820da1",
+            "comment": "Remove high contrast adjust from common styles"
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "a07c7287aeec78d8f17712551f94d3af55031592",
+            "comment": "Enable strictNullChecks in utilities package"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.1.2 <5.0.0` to `>=4.3.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.7.4",
       "tag": "@uifabric/styling_v0.7.4",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 624633c3149a0..42fc633d09055 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Tue, 13 Jun 2017 10:13:21 GMT and should not be manually modified.
+This log was last generated on Wed, 14 Jun 2017 06:02:15 GMT and should not be manually modified.
+
+## 0.8.0
+Wed, 14 Jun 2017 06:02:15 GMT
+
+### Minor changes
+
+- Updating FabricConfig support to allow themes to be providable at bundle load time without weird race conditions.
+- Updates to version 2.30 of the icon font
+
+### Patches
+
+- Remove high contrast adjust from common styles
+- Enable strictNullChecks in utilities package
 
 ## 0.7.4
 Tue, 13 Jun 2017 10:13:21 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index d4fab1322ef4b..1d167b41cea24 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.7.4",
+  "version": "0.8.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.1.2 <5.0.0",
+    "@uifabric/utilities": ">=4.3.0 <5.0.0",
     "tslib": "^1.6.0",
     "rtl-css-js": "^1.1.1",
     "glamor": "^2.20.24"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 6048be86463b8..8c48adb810024 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.3.0",
+      "tag": "@uifabric/utilities_v4.3.0",
+      "date": "Wed, 14 Jun 2017 06:02:15 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "74c01f80ee4fb502a45c77ac0ad135148b2146d9",
+            "comment": "isTabbableElement: fixed edge cases with identifying focusable elements that have tabIndex assigned."
+          },
+          {
+            "author": "Chad Sheets <cjsheets@gmail.com>",
+            "commit": "d4527911db0d3c4bbdc74473e3d7d996c182b444",
+            "comment": "Focus Utility should respect tabindex=-1 on tabable elements"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "a07c7287aeec78d8f17712551f94d3af55031592",
+            "comment": "Enable strictNullChecks in utilities package"
+          }
+        ]
+      }
+    },
     {
       "version": "4.2.0",
       "tag": "@uifabric/utilities_v4.2.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index bf4b0cb3cca75..d054b6d19bd92 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,18 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Mon, 12 Jun 2017 01:47:18 GMT and should not be manually modified.
+This log was last generated on Wed, 14 Jun 2017 06:02:15 GMT and should not be manually modified.
+
+## 4.3.0
+Wed, 14 Jun 2017 06:02:15 GMT
+
+### Minor changes
+
+- Enable strictNullChecks in utilities package
+
+### Patches
+
+- isTabbableElement: fixed edge cases with identifying focusable elements that have tabIndex assigned.
+- Focus Utility should respect tabindex=-1 on tabable elements
 
 ## 4.2.0
 Mon, 12 Jun 2017 01:47:18 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 051da41bc9e3a..83c8bcc6f9dce 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.2.0",
+  "version": "4.3.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 5d0adb20f07383a60fb9fa14bd6cde8887b0f5db Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 14 Jun 2017 12:28:06 -0700
Subject: [PATCH 0111/1641] Dialog: Deprecate old props and move props into
 contentProps and modalProps (#1865)

* Fix closeButtonAriaLabel, adding props and connecting to dialog content

* Refactored dialog props into modalProps and contentProps, deprecating all the original, duplicative values

* Adding change file

* Removed depracation on onDismiss to allow a single function to be passed for modal and content

* Moved ms-Dialog class to dialog

* Fixed failing tests

* Update DialogContent.Props.ts

* Updated dialog to use hidden, made props more consistent

* Update Dialog.tsx

* Added tests and deprecation warnings

* Return deprecated prop
---
 ...log-aria-label-close_2017-05-25-19-26.json |  30 +++++
 .../src/components/Dialog/Dialog.Props.ts     | 112 ++++++++----------
 .../src/components/Dialog/Dialog.scss         |  11 --
 .../src/components/Dialog/Dialog.test.tsx     |  65 +++++++---
 .../src/components/Dialog/Dialog.tsx          |  58 ++++++---
 .../components/Dialog/DialogContent.Props.ts  |  66 +++++++++++
 .../src/components/Dialog/DialogContent.tsx   |  36 +++---
 .../Dialog/examples/Dialog.Basic.Example.tsx  |  26 ++--
 .../examples/Dialog.Blocking.Example.tsx      |  21 ++--
 .../examples/Dialog.LargeHeader.Example.tsx   |  21 ++--
 .../src/components/Dialog/index.ts            |   3 +-
 .../src/components/Modal/Modal.tsx            |   2 +-
 12 files changed, 300 insertions(+), 151 deletions(-)
 create mode 100644 common/changes/dialog-aria-label-close_2017-05-25-19-26.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Dialog/DialogContent.Props.ts

diff --git a/common/changes/dialog-aria-label-close_2017-05-25-19-26.json b/common/changes/dialog-aria-label-close_2017-05-25-19-26.json
new file mode 100644
index 0000000000000..a7c1d4805de07
--- /dev/null
+++ b/common/changes/dialog-aria-label-close_2017-05-25-19-26.json
@@ -0,0 +1,30 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dialog: Deprecated old duplicative props and moved them into modalProps and contentProps",
+      "type": "minor"
+    },
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    },
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    },
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    },
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.Props.ts b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.Props.ts
index 655d33aca76fd..b3969216ffc3a 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.Props.ts
@@ -1,6 +1,7 @@
 import * as React from 'react';
+import { IModalProps } from '../../Modal';
 import { Dialog } from './Dialog';
-import { DialogContent } from './DialogContent';
+import { DialogType, IDialogContentProps } from './DialogContent.Props';
 import { IButtonProps } from '../Button/Button.Props';
 import { IWithResponsiveModeState } from '../../utilities/decorators/withResponsiveMode';
 import { IAccessiblePopupProps } from '../../common/IAccessiblePopupProps';
@@ -9,136 +10,127 @@ export interface IDialog {
 
 }
 
-export interface IDialogContentProps extends React.Props<DialogContent>, IWithResponsiveModeState, IAccessiblePopupProps {
-  /**
-  * Show an 'x' close button in the upper-right corner
-  */
-  showCloseButton?: boolean;
+export interface IDialogProps extends React.Props<Dialog>, IWithResponsiveModeState, IAccessiblePopupProps {
 
   /**
-   * Other top buttons that will show up next to the close button
+   * Optional callback to access the IDialog interface. Use this instead of ref for accessing
+   * the public methods and properties of the component.
    */
-  topButtonsProps?: IButtonProps[];
+  componentRef?: (component: IDialog) => void;
 
   /**
-  * Optional override class name
+  * Props to be passed through to Dialog Content
   */
-  className?: string;
+  dialogContentProps?: IDialogContentProps;
 
   /**
-  * A callback function for when the Dialog is dismissed from the close button or light dismiss, before the animation completes.
+  * A callback function for when the Dialog is dismissed from the close button or light dismiss. Can also be specified separately in content and modal.
   */
   onDismiss?: (ev?: React.MouseEvent<HTMLButtonElement>) => any;
 
   /**
-  * The subtext to display in the dialog.
+  * Whether the dialog is hidden.
+  * @default false
   */
-  subText?: string;
+  hidden?: boolean;
 
   /**
-  * The title text to display at the top of the dialog.
+  * Props to be passed through to Modal
   */
-  title?: string;
-}
-
-export interface IDialogProps extends React.Props<Dialog>, IWithResponsiveModeState, IAccessiblePopupProps {
-  /**
-   * Optional callback to access the IDialog interface. Use this instead of ref for accessing
-   * the public methods and properties of the component.
-   */
-  componentRef?: (component: IDialog) => void;
+  modalProps?: IModalProps;
 
   /**
   * Whether the dialog is displayed.
   * @default false
+  * @deprecated Use hidden instead
   */
   isOpen?: boolean;
 
-  /**
-  * The type of Dialog to display.
-  * @default DialogType.normal
-  */
-  type?: DialogType;
-
   /**
   * Whether the overlay is dark themed.
   * @default true
+  * @deprecated Pass through via modalProps instead
   */
   isDarkOverlay?: boolean;
 
-  /**
-  * A callback function for when the Dialog is dismissed from the close button or light dismiss, before the animation completes.
-  */
-  onDismiss?: (ev?: React.MouseEvent<HTMLButtonElement>) => any;
-
   /**
    * A callback function which is called after the Dialog is dismissed and the animation is complete.
+   * @deprecated Pass through via modalProps instead
    */
   onDismissed?: () => any;
 
-  /**
-  * The title text to display at the top of the dialog.
-  */
-  title?: string;
-
-  /**
-  * The subtext to display in the dialog.
-  */
-  subText?: string;
-
   /**
   * Whether the dialog can be light dismissed by clicking outside the dialog (on the overlay).
   * @default false
+  * @deprecated Pass through via modalProps instead
   */
   isBlocking?: boolean;
 
   /**
    * Optional class name to be added to the root class
+   * @deprecated Pass through via modalProps.className instead
    */
   className?: string;
 
   /**
   * Optional override for container class
+  * @deprecated Pass through via modalProps.className instead
   */
   containerClassName?: string;
 
-  /**
-  * Optional override content class
-  */
-  contentClassName?: string;
-
   /**
    * A callback function for when the Dialog content is mounted on the overlay layer
+   * @deprecated Pass through via modalProps instead
    */
   onLayerDidMount?: () => void;
 
   /**
-   * Deprecated at 0.81.2, use 'onLayerDidMount' instead.
-   * @deprecated
-   */
+ * Deprecated at 0.81.2, use 'onLayerDidMount' instead.
+ * @deprecated
+ */
   onLayerMounted?: () => void;
 
+  /**
+  * The type of Dialog to display.
+  * @default DialogType.normal
+  * @deprecated Pass through via dialogContentProps instead
+  */
+  type?: DialogType;
+
+  /**
+  * The title text to display at the top of the dialog.
+  * @deprecated Pass through via dialogContentProps instead
+  */
+  title?: string;
+
+  /**
+  * The subtext to display in the dialog.
+  * @deprecated Pass through via dialogContentProps instead
+  */
+  subText?: string;
+
+  /**
+  * Optional override content class
+  * @deprecated Pass through via dialogContentProps instead as className
+  */
+  contentClassName?: string;
+
   /**
    * Other top buttons that will show up next to the close button
+   * @deprecated Pass through via dialogContentProps instead
    */
   topButtonsProps?: IButtonProps[];
 
   /**
   * Optional id for aria-LabelledBy
+  * @deprecated Pass through via modalProps.titleAriaId instead
   */
   ariaLabelledById?: string;
 
   /**
   * Optional id for aria-DescribedBy
+  * @deprecated Pass through via modalProps.subtitleAriaId instead
   */
   ariaDescribedById?: string;
-}
 
-export enum DialogType {
-  /** Standard dialog */
-  normal = 0,
-  /** Dialog with large header banner */
-  largeHeader = 1,
-  /** Dialog with an 'x' close button in the upper-right corner */
-  close = 2
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.scss b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.scss
index 6af7f90936b34..a0e44ffba3c64 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.scss
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.scss
@@ -23,8 +23,6 @@ $Dialog-default-max-width: 340px;
 
 // Close button, hidden by default
 .button.isClose {
-  display: none;
-
   :global(.ms-Icon.ms-Icon--Cancel) {
     color: $ms-color-neutralSecondary;
     font-size: 16px;
@@ -110,15 +108,6 @@ $Dialog-default-max-width: 340px;
   }
 }
 
-//= Modifier: Dialog with close button
-//
-.isClose:not(.isLargeHeader) {
-  // Show the close button
-  .button.isClose {
-    display: block;
-  }
-}
-
 //= Modifier: Multiline button dialog
 //
 .isMultiline {
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
index 7943f05755fbe..99a610d17f0fa 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
@@ -4,34 +4,63 @@ import * as React from 'react';
 
 import * as ReactDOM from 'react-dom';
 
+import {
+    setWarningCallback,
+} from '@uifabric/utilities';
+
 let { expect } = chai;
 
 import { Dialog } from './Dialog';
 
+// export function setWarningCallback(warningCallback: (message: string) => void): void;
+
 describe('Dialog', () => {
-  afterEach(() => {
-    [].forEach.call(document.querySelectorAll('body > div'), div => div.parentNode.removeChild(div));
+    beforeEach(() => {
+        setWarningCallback(message => null);
+    });
+    afterEach(() => {
+        [].forEach.call(document.querySelectorAll('body > div'), div => div.parentNode.removeChild(div));
+
+        expect(document.querySelector('.ms-Dialog')).to.be.null;
+    });
+
+    it('Fires dismissed after closing', () => {
+        let dismissedCalled = false;
+
+        const handleDismissed = () => {
+            dismissedCalled = true;
+        };
+
+        const div = document.createElement('div');
+        ReactDOM.render(<Dialog isOpen={true} onDismissed={handleDismissed} />, div);
+        ReactDOM.render(<Dialog isOpen={false} onDismissed={handleDismissed} />, div);
+
+        setTimeout(() => {
+            const dialog = document.querySelector('.ms-Dialog');
+            expect(dialog).to.be.null;
+
+            expect(dismissedCalled).to.be.true;
+        }, 400);
 
-    expect(document.querySelector('.ms-Dialog')).to.be.null;
-  });
+    });
 
-  it('Fires dismissed after closing', () => {
-    let dismissedCalled = false;
+    it('Fires dismissed after hidden', () => {
+        let dismissedCalled = false;
 
-    const handleDismissed = () => {
-      dismissedCalled = true;
-    };
+        const handleDismissed = () => {
+            dismissedCalled = true;
+        };
 
-    const div = document.createElement('div');
-    ReactDOM.render(<Dialog isOpen={ true } onDismissed={ handleDismissed } />, div);
-    ReactDOM.render(<Dialog isOpen={ false } onDismissed={ handleDismissed } />, div);
+        const div = document.createElement('div');
+        ReactDOM.render(<Dialog hidden={false} modalProps={{ onDismissed: handleDismissed }} />, div);
+        ReactDOM.render(<Dialog hidden={true} modalProps={{ onDismissed: handleDismissed }} />, div);
 
-    setTimeout(() => {
-      const dialog = document.querySelector('.ms-Dialog');
-      expect(dialog).to.be.null;
+        setTimeout(() => {
+            const dialog = document.querySelector('.ms-Dialog');
+            expect(dialog).to.be.null;
 
-      expect(dismissedCalled).to.be.true;
-    }, 400);
+            expect(dismissedCalled).to.be.true;
+        }, 400);
 
-  });
+    });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
index 92e76753b9879..50dd2cc15642c 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
@@ -5,7 +5,8 @@ import {
   css,
   getId
 } from '../../Utilities';
-import { IDialogProps, DialogType } from './Dialog.Props';
+import { IDialogProps } from './Dialog.Props';
+import { DialogType } from './DialogContent.Props';
 import { Modal } from '../../Modal';
 import { withResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
 import * as stylesImport from './Dialog.scss';
@@ -21,6 +22,9 @@ export interface IDialogState {
 export class Dialog extends BaseComponent<IDialogProps, IDialogState> {
 
   public static defaultProps: IDialogProps = {
+    modalProps: {},
+    dialogContentProps: {},
+    // deprecated props
     isOpen: false,
     type: DialogType.normal,
     isDarkOverlay: true,
@@ -28,7 +32,7 @@ export class Dialog extends BaseComponent<IDialogProps, IDialogState> {
     className: '',
     containerClassName: '',
     contentClassName: '',
-    topButtonsProps: []
+    topButtonsProps: [],
   };
 
   constructor(props: IDialogProps) {
@@ -37,6 +41,22 @@ export class Dialog extends BaseComponent<IDialogProps, IDialogState> {
     this.state = {
       id: getId('Dialog'),
     };
+
+    this._warnDeprecations({
+      'isOpen': 'hidden',
+      'type': 'dialogContentProps.type',
+      'subText': 'dialogContentProps.subText',
+      'contentClassName': 'dialogContentProps.className',
+      'topButtonsProps': 'dialogContentProps.topButtonsProps',
+      'className': 'modalProps.className',
+      'isDarkOverlay': 'modalProps.isDarkOverlay',
+      'isBlocking': 'modalProps.isBlocking',
+      'containerClassName': 'modalProps.containerClassName',
+      'onDismissed': 'modalProps.onDismissed',
+      'onLayerDidMount': 'modalProps.onLayerDidMount',
+      'ariaDescribedById': 'modalProps.subtitleAriaId',
+      'ariaLabelledById': 'modalProps.titleAriaId'
+    });
   }
 
   public render() {
@@ -60,20 +80,16 @@ export class Dialog extends BaseComponent<IDialogProps, IDialogState> {
       title,
       type,
       contentClassName,
-      topButtonsProps
+      topButtonsProps,
+      dialogContentProps,
+      modalProps,
+      containerClassName,
+      hidden
     } = this.props;
     let { id } = this.state;
 
-    const dialogClassName = css(this.props.className, {
-      ['ms-Dialog--lgHeader ' + styles.isLargeHeader]: type === DialogType.largeHeader,
-      ['ms-Dialog--close ' + styles.isClose]: type === DialogType.close,
-    });
-    const containerClassName = css(this.props.containerClassName, styles.main);
-
     return (
       <Modal
-        className={ dialogClassName }
-        containerClassName={ containerClassName }
         elementToFocusOnDismiss={ elementToFocusOnDismiss }
         firstFocusableSelector={ firstFocusableSelector }
         forceFocusInsideTrap={ forceFocusInsideTrap }
@@ -81,22 +97,26 @@ export class Dialog extends BaseComponent<IDialogProps, IDialogState> {
         isBlocking={ isBlocking }
         isClickableOutsideFocusTrap={ isClickableOutsideFocusTrap }
         isDarkOverlay={ isDarkOverlay }
-        isOpen={ isOpen }
-        onDismiss={ onDismiss }
+        isOpen={ hidden !== undefined ? !hidden : isOpen }
         onDismissed={ onDismissed }
         onLayerDidMount={ onLayerDidMount }
         responsiveMode={ responsiveMode }
-        subtitleAriaId={ this._getAriaLabelId(ariaDescribedById, subText, id + '-subText') }
-        titleAriaId={ this._getAriaLabelId(ariaLabelledById, title, id + '-title') }
+        { ...modalProps }
+        className={ css('ms-Dialog', modalProps.className) }
+        containerClassName={ css(containerClassName, styles.main, modalProps.containerClassName) }
+        onDismiss={ modalProps.onDismiss || onDismiss }
+        subtitleAriaId={ this._getAriaLabelId(modalProps.subtitleAriaId ? modalProps.subtitleAriaId : ariaDescribedById, subText, id + '-subText') }
+        titleAriaId={ this._getAriaLabelId(modalProps.titleAriaId ? modalProps.titleAriaId : ariaLabelledById, title, id + '-title') }
       >
-
         <DialogContent
-          onDismiss={ onDismiss }
-          showCloseButton={ !isBlocking && type !== DialogType.largeHeader }
+          showCloseButton={ !isBlocking }
           title={ title }
           subText={ subText }
-          className={ contentClassName }
           topButtonsProps={ topButtonsProps }
+          type={ type }
+          {...dialogContentProps}
+          onDismiss={ dialogContentProps.onDismiss || onDismiss }
+          className={ css(contentClassName, dialogContentProps.className) }
         >
           { this.props.children }
         </DialogContent>
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.Props.ts b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.Props.ts
new file mode 100644
index 0000000000000..65c633ccc28ee
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.Props.ts
@@ -0,0 +1,66 @@
+import * as React from 'react';
+import { DialogContent } from './DialogContent';
+import { IButtonProps } from '../Button/Button.Props';
+
+export interface IDialogContent {
+
+}
+
+export interface IDialogContentProps extends React.Props<DialogContent> {
+   /**
+   * Optional callback to access the IDialogContent interface. Use this instead of ref for accessing
+   * the public methods and properties of the component.
+   */
+  componentRef?: (component: IDialogContent) => void;
+  
+  /**
+  * Show an 'x' close button in the upper-right corner
+  */
+  showCloseButton?: boolean;
+
+  /**
+   * Other top buttons that will show up next to the close button
+   */
+  topButtonsProps?: IButtonProps[];
+
+  /**
+  * Optional override class name
+  */
+  className?: string;
+
+  /**
+  * A callback function for when the Dialog is dismissed from the close button or light dismiss, before the animation completes.
+  */
+  onDismiss?: (ev?: React.MouseEvent<HTMLButtonElement>) => any;
+
+  /**
+  * The subtext to display in the dialog.
+  */
+  subText?: string;
+
+  /**
+  * The title text to display at the top of the dialog.
+  */
+  title?: string;
+
+  /**
+   * Label to be passed to to aria-label of close button
+   * @default Close
+   */
+  closeButtonAriaLabel?: string;
+
+  /**
+  * The type of Dialog to display.
+  * @default DialogType.normal
+  */
+  type?: DialogType;
+}
+
+export enum DialogType {
+  /** Standard dialog */
+  normal = 0,
+  /** Dialog with large header banner */
+  largeHeader = 1,
+  /** Dialog with an 'x' close button in the upper-right corner */
+  close = 2
+}
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx
index 2b46a7de73588..56f04b24fb54f 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx
@@ -4,7 +4,7 @@ import {
   css,
   getId
 } from '../../Utilities';
-import { IDialogContentProps } from './Dialog.Props';
+import { IDialogContentProps, DialogType } from './DialogContent.Props';
 import { IconButton } from '../../Button';
 import { DialogFooter } from './DialogFooter';
 import { withResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
@@ -21,7 +21,8 @@ export class DialogContent extends BaseComponent<IDialogContentProps, IDialogCon
   public static defaultProps: IDialogContentProps = {
     showCloseButton: false,
     className: '',
-    topButtonsProps: []
+    topButtonsProps: [],
+    closeButtonAriaLabel: 'Close'
   };
 
   constructor(props: IDialogContentProps) {
@@ -38,7 +39,8 @@ export class DialogContent extends BaseComponent<IDialogContentProps, IDialogCon
       closeButtonAriaLabel,
       onDismiss,
       subText,
-      title
+      title,
+      type
     } = this.props;
     let { id } = this.state;
 
@@ -48,24 +50,30 @@ export class DialogContent extends BaseComponent<IDialogContentProps, IDialogCon
       subTextContent = <p className={ css('ms-Dialog-subText', styles.subText) } id={ id + '-subText' }>{ subText }</p>;
     }
 
+    const contentClassName = css(this.props.className, {
+      ['ms-Dialog--lgHeader ' + styles.isLargeHeader]: type === DialogType.largeHeader,
+      ['ms-Dialog--close ' + styles.isClose]: type === DialogType.close,
+    });
+
     return (
-      <div>
+      <div className={ css(contentClassName) }>
         <div className={ css('ms-Dialog-header', styles.header) }>
           <p className={ css('ms-Dialog-title', styles.title) } id={ id + '-title' } role='heading'>{ title }</p>
           <div className={ css('ms-Dialog-topButton', styles.topButton) }>
             { this.props.topButtonsProps.map((props) => (
               <IconButton {...props} />
             )) }
-            <IconButton
-              className={ css(
-                'ms-Dialog-button ms-Dialog-button--close',
-                styles.button,
-                { [styles.isClose]: !showCloseButton }
-              ) }
-              iconProps={ { iconName: 'Cancel' } }
-              ariaLabel={ closeButtonAriaLabel }
-              onClick={ onDismiss }
-            />
+            { showCloseButton && type !== DialogType.largeHeader &&
+              <IconButton
+                className={ css(
+                  'ms-Dialog-button ms-Dialog-button--close',
+                  styles.button
+                ) }
+                iconProps={ { iconName: 'Cancel' } }
+                ariaLabel={ closeButtonAriaLabel }
+                onClick={ onDismiss }
+              />
+            }
           </div>
         </div>
         <div className={ css('ms-Dialog-inner', styles.inner) }>
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
index 7fba8be1e91e9..d07d1ed6c38c5 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
@@ -9,7 +9,7 @@ export class DialogBasicExample extends React.Component<any, any> {
   constructor() {
     super();
     this.state = {
-      showDialog: false
+      hideDialog: true
     };
   }
 
@@ -24,15 +24,19 @@ export class DialogBasicExample extends React.Component<any, any> {
         <label id='myLabel' className='screenReaderOnly'>All emails together Your Inbox has changed.
           No longer does it include favorites, it is a singular destination for your emails.</label>
         <Dialog
-          isOpen={ this.state.showDialog }
-          type={ DialogType.normal }
+          hidden={ this.state.hideDialog }
           onDismiss={ this._closeDialog.bind(this) }
-          title='All emails together'
-          subText='Your Inbox has changed. No longer does it include favorites, it is a singular destination for your emails.'
-          isBlocking={ false }
-          containerClassName='ms-dialogMainOverride'
-          ariaLabelledById='myLabel'
-          ariaDescribedById=''
+          dialogContentProps={ {
+            type: DialogType.normal,
+            title: 'All emails together',
+            subText: 'Your Inbox has changed. No longer does it include favorites, it is a singular destination for your emails.'
+          } }
+          modalProps={ {
+            titleAriaId: 'myLabel',
+            subtitleAriaId: '',
+            isBlocking: false,
+            containerClassName: 'ms-dialogMainOverride'
+          } }
         >
           <ChoiceGroup
             options={ [
@@ -64,11 +68,11 @@ export class DialogBasicExample extends React.Component<any, any> {
   }
 
   private _showDialog() {
-    this.setState({ showDialog: true });
+    this.setState({ hideDialog: false });
   }
 
   private _closeDialog() {
-    this.setState({ showDialog: false });
+    this.setState({ hideDialog: true });
   }
 
   private _onChoiceChanged() {
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx
index 3f9ec4121c5c1..419fb167a47ea 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx
@@ -8,7 +8,7 @@ export class DialogBlockingExample extends React.Component<any, any> {
   constructor() {
     super();
     this.state = {
-      showDialog: false
+      hideDialog: true
     };
   }
 
@@ -21,12 +21,17 @@ export class DialogBlockingExample extends React.Component<any, any> {
           text='Open Dialog'
         />
         <Dialog
-          isOpen={ this.state.showDialog }
-          type={ DialogType.normal }
+          hidden={ this.state.hideDialog }
           onDismiss={ this._closeDialog.bind(this) }
-          title='All emails together'
-          subText='Your Inbox has changed. No longer does it include favorites, it is a singular destination for your emails.'
-          isBlocking={ true }
+          dialogContentProps={ {
+            type: DialogType.normal,
+            title: 'All emails together',
+            subText: 'Your Inbox has changed. No longer does it include favorites, it is a singular destination for your emails.'
+          } }
+          modalProps={ {
+            isBlocking: true,
+            containerClassName: 'ms-dialogMainOverride'
+          } }
         >
           <ChoiceGroup
             options={ [
@@ -57,11 +62,11 @@ export class DialogBlockingExample extends React.Component<any, any> {
   }
 
   private _showDialog() {
-    this.setState({ showDialog: true });
+    this.setState({ hideDialog: false });
   }
 
   private _closeDialog() {
-    this.setState({ showDialog: false });
+    this.setState({ hideDialog: true });
   }
 
   private _onChoiceChanged() {
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.LargeHeader.Example.tsx b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.LargeHeader.Example.tsx
index 24a63a4dae83e..def21b76ce98f 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.LargeHeader.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.LargeHeader.Example.tsx
@@ -8,7 +8,7 @@ export class DialogLargeHeaderExample extends React.Component<any, any> {
   constructor() {
     super();
     this.state = {
-      showDialog: false
+      hideDialog: true
     };
   }
 
@@ -21,12 +21,17 @@ export class DialogLargeHeaderExample extends React.Component<any, any> {
           text='Open Dialog'
         />
         <Dialog
-          isOpen={ this.state.showDialog }
-          type={ DialogType.largeHeader }
+          hidden={ this.state.hideDialog }
           onDismiss={ this._closeDialog.bind(this) }
-          title='All emails together'
-          subText='Your Inbox has changed. No longer does it include favorites, it is a singular destination for your emails.'
-          isBlocking={ false }
+          dialogContentProps={ {
+            type: DialogType.largeHeader,
+            title: 'All emails together',
+            subText: 'Your Inbox has changed. No longer does it include favorites, it is a singular destination for your emails.'
+          } }
+          modalProps={ {
+            isBlocking: false,
+            containerClassName: 'ms-dialogMainOverride'
+          } }
         >
           <ChoiceGroup
             options={ [
@@ -57,11 +62,11 @@ export class DialogLargeHeaderExample extends React.Component<any, any> {
   }
 
   private _showDialog() {
-    this.setState({ showDialog: true });
+    this.setState({ hideDialog: false });
   }
 
   private _closeDialog() {
-    this.setState({ showDialog: false });
+    this.setState({ hideDialog: true });
   }
 
   private _onChoiceChanged() {
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/index.ts b/packages/office-ui-fabric-react/src/components/Dialog/index.ts
index 45a68e9aedea2..4ecd27afa03e7 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/index.ts
@@ -1,4 +1,5 @@
 export * from './Dialog';
 export * from './DialogContent';
 export * from './DialogFooter';
-export * from './Dialog.Props';
\ No newline at end of file
+export * from './Dialog.Props';
+export * from './DialogContent.Props';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx b/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
index e706c3ca09818..3f448eedc018d 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
+++ b/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
@@ -96,7 +96,7 @@ export class Modal extends BaseComponent<IModalProps, IDialogState> {
     } = this.props;
     let { id, isOpen, isVisible } = this.state;
 
-    const modalClassName = css('ms-Dialog', styles.root, this.props.className, {
+    const modalClassName = css('ms-Modal', styles.root, this.props.className, {
       ['is-open']: isOpen,
       [styles.rootIsVisible]: isVisible,
     });

From 2278009d39d643168f0f27508a1d01ddbb4fdb69 Mon Sep 17 00:00:00 2001
From: Ankit Khokhar <ankitkhokhar@iitrpr.ac.in>
Date: Thu, 15 Jun 2017 15:23:25 +0530
Subject: [PATCH 0112/1641] Toggle: high contrast fix for Firefox (#1986)

* Toggle fix

* Toggle changes

* Changed border width

* Change file created

* Border size adjust

* Removed extra stylings

* Leaving backgroundColor as is and using transparent border for Firefox high contrast

* Minor: added comment in scss file
---
 ...FixToggleHighContrastFirefox_2017-06-13-13-04.json | 11 +++++++++++
 .../src/components/Toggle/Toggle.styles.ts            |  5 +++++
 2 files changed, 16 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/users-ankhokha-FixToggleHighContrastFirefox_2017-06-13-13-04.json

diff --git a/common/changes/office-ui-fabric-react/users-ankhokha-FixToggleHighContrastFirefox_2017-06-13-13-04.json b/common/changes/office-ui-fabric-react/users-ankhokha-FixToggleHighContrastFirefox_2017-06-13-13-04.json
new file mode 100644
index 0000000000000..705d4ebdd1a13
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-ankhokha-FixToggleHighContrastFirefox_2017-06-13-13-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Toggle: High contrast fix for Firefox",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "ankhokha@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts
index 1e02842b46773..14b6eb3e45ea1 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts
@@ -86,6 +86,11 @@ export const getStyles = memoizeFunction((
       top: '.2em',
       transition: 'all 0.1s ease',
       backgroundColor: thumbBackground,
+      /* Border is added to handle high contrast mode for Firefox */
+      borderColor: 'transparent',
+      borderWidth: '.27em',
+      borderStyle: 'solid',
+      boxSizing: 'border-box',
       left: '.2em'
     },
 

From 467924d0e32416ef10ebfbbe51ef197480883687 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 15 Jun 2017 10:09:15 +0000
Subject: [PATCH 0113/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 ...log-aria-label-close_2017-05-25-19-26.json | 30 -------------------
 ...eHighContrastFirefox_2017-06-13-13-04.json | 11 -------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 26 ++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 13 +++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/CHANGELOG.json               |  6 ++++
 packages/styling/CHANGELOG.md                 |  7 ++++-
 packages/styling/package.json                 |  2 +-
 11 files changed, 56 insertions(+), 49 deletions(-)
 delete mode 100644 common/changes/dialog-aria-label-close_2017-05-25-19-26.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-ankhokha-FixToggleHighContrastFirefox_2017-06-13-13-04.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index fe0348374de92..68a7d93609cf6 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.5.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.7.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/dialog-aria-label-close_2017-05-25-19-26.json b/common/changes/dialog-aria-label-close_2017-05-25-19-26.json
deleted file mode 100644
index a7c1d4805de07..0000000000000
--- a/common/changes/dialog-aria-label-close_2017-05-25-19-26.json
+++ /dev/null
@@ -1,30 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dialog: Deprecated old duplicative props and moved them into modalProps and contentProps",
-      "type": "minor"
-    },
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    },
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    },
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    },
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-ankhokha-FixToggleHighContrastFirefox_2017-06-13-13-04.json b/common/changes/office-ui-fabric-react/users-ankhokha-FixToggleHighContrastFirefox_2017-06-13-13-04.json
deleted file mode 100644
index 705d4ebdd1a13..0000000000000
--- a/common/changes/office-ui-fabric-react/users-ankhokha-FixToggleHighContrastFirefox_2017-06-13-13-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Toggle: High contrast fix for Firefox",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "ankhokha@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 6cd0b47bb431e..c6cf30869a967 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -40,7 +40,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.8.0 <1.0.0",
+    "@uifabric/styling": ">=0.8.1 <1.0.0",
     "@uifabric/utilities": ">=4.3.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 5932557d9e671..fb7f0db6c70ea 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.6.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.7.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 80904a874f0f9..815c08adb823d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.7.0",
+      "tag": "office-ui-fabric-react_v4.7.0",
+      "date": "Thu, 15 Jun 2017 10:09:15 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "5d0adb20f07383a60fb9fa14bd6cde8887b0f5db",
+            "comment": "Dialog: Deprecated old duplicative props and moved them into modalProps and contentProps"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Ankit Khokhar <ankitkhokhar@iitrpr.ac.in>",
+            "commit": "2278009d39d643168f0f27508a1d01ddbb4fdb69",
+            "comment": "Toggle: High contrast fix for Firefox"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.8.0 <1.0.0` to `>=0.8.1 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.6.0",
       "tag": "office-ui-fabric-react_v4.6.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 203287ae2df82..24daf0d504927 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 14 Jun 2017 06:02:15 GMT and should not be manually modified.
+This log was last generated on Thu, 15 Jun 2017 10:09:15 GMT and should not be manually modified.
+
+## 4.7.0
+Thu, 15 Jun 2017 10:09:15 GMT
+
+### Minor changes
+
+- Dialog: Deprecated old duplicative props and moved them into modalProps and contentProps
+
+### Patches
+
+- Toggle: High contrast fix for Firefox
 
 ## 4.6.0
 Wed, 14 Jun 2017 06:02:15 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 84dc5a07a0029..210bf546b64a9 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.6.0",
+  "version": "4.7.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.3.0 <5.0.0",
-    "@uifabric/styling": ">=0.8.0 <1.0.0",
+    "@uifabric/styling": ">=0.8.1 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index d6ff1472ec749..be45cd3dd4b57 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.8.1",
+      "tag": "@uifabric/styling_v0.8.1",
+      "date": "Thu, 15 Jun 2017 10:09:15 GMT",
+      "comments": {}
+    },
     {
       "version": "0.8.0",
       "tag": "@uifabric/styling_v0.8.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 42fc633d09055..6360adbc7c517 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Wed, 14 Jun 2017 06:02:15 GMT and should not be manually modified.
+This log was last generated on Thu, 15 Jun 2017 10:09:15 GMT and should not be manually modified.
+
+## 0.8.1
+Thu, 15 Jun 2017 10:09:15 GMT
+
+*Changes not tracked*
 
 ## 0.8.0
 Wed, 14 Jun 2017 06:02:15 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 1d167b41cea24..50d827aaf8b43 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.8.0",
+  "version": "0.8.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From bed10f92f6c43d407e23b44787d879c09e2a37cb Mon Sep 17 00:00:00 2001
From: Ankit Khokhar <ankitkhokhar@iitrpr.ac.in>
Date: Thu, 15 Jun 2017 16:16:41 +0530
Subject: [PATCH 0114/1641] Details list check button in high contrast mode on
 firefox fix (#1992)

* Fix for check button high contrast

* Added change file

* PR comment for styling readability
---
 ...uttonHighContrastFirefox_2017-06-14-11-14.json | 11 +++++++++++
 .../src/components/Check/Check.scss               | 15 ++++++---------
 .../src/components/Check/Check.tsx                |  4 ----
 3 files changed, 17 insertions(+), 13 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-ankhokha-FixCheckButtonHighContrastFirefox_2017-06-14-11-14.json

diff --git a/common/changes/office-ui-fabric-react/users-ankhokha-FixCheckButtonHighContrastFirefox_2017-06-14-11-14.json b/common/changes/office-ui-fabric-react/users-ankhokha-FixCheckButtonHighContrastFirefox_2017-06-14-11-14.json
new file mode 100644
index 0000000000000..fc19343e1e123
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-ankhokha-FixCheckButtonHighContrastFirefox_2017-06-14-11-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "CheckButton: Firefox high contrast fix",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "ankhokha@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.scss b/packages/office-ui-fabric-react/src/components/Check/Check.scss
index 532bb15360661..931fd907ac5d2 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.scss
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.scss
@@ -16,6 +16,12 @@ $checkBoxHeight: 24px;
   vertical-align: top;
   position: relative;
   @include ms-user-select(none);
+  background: $ms-color-white;
+  border-radius: $checkBoxHeight;
+
+  &.rootIsChecked {
+    background: $ms-color-themePrimary;
+  }
 }
 
 .root:hover,
@@ -24,7 +30,6 @@ $checkBoxHeight: 24px;
   opacity: 1;
 }
 
-.background,
 .circle,
 .check {
   position: absolute;
@@ -36,14 +41,6 @@ $checkBoxHeight: 24px;
   font-size: $checkBoxHeight;
 }
 
-.background {
-  color: $ms-color-white;
-}
-
-.rootIsChecked .background {
-  color: $ms-color-themePrimary;
-}
-
 .circle {
   color: $ms-color-neutralTertiaryAlt;
 }
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.tsx b/packages/office-ui-fabric-react/src/components/Check/Check.tsx
index 625b4f404d85d..c8e409bc44aa9 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.tsx
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.tsx
@@ -39,10 +39,6 @@ export class Check extends BaseComponent<ICheckProps, {}> {
         styles.root,
         isChecked && ('is-checked ' + styles.rootIsChecked)
       ) }>
-        <Icon
-          className={ css('ms-Check-background', styles.background) }
-          iconName='fullCircleMask'
-        />
         <Icon
           className={ css('ms-Check-circle', styles.circle) }
           iconName='circleRing'

From 90e2da953d51ba71c019b0b1db9a7f63bf8f7e48 Mon Sep 17 00:00:00 2001
From: Mike Wheaton <miwhea@microsoft.com>
Date: Thu, 15 Jun 2017 15:59:43 -0700
Subject: [PATCH 0115/1641] Revert "Update icons to version 2.30 (#1925)"
 (#2001)

* Revert "Update icons to version 2.30 (#1925)"

This reverts commit 560719e7fc887c52b3ffc96cba08f9115b5c03e7.

* Add change file
---
 .../miwhea-reverse-1925_2017-06-15-20-15.json |   11 +
 .../styling/src/styles/DefaultFontStyles.ts   |    3 +-
 packages/styling/src/styles/IconCodes.ts      | 2622 ++++++++++++++---
 3 files changed, 2181 insertions(+), 455 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/miwhea-reverse-1925_2017-06-15-20-15.json

diff --git a/common/changes/@uifabric/styling/miwhea-reverse-1925_2017-06-15-20-15.json b/common/changes/@uifabric/styling/miwhea-reverse-1925_2017-06-15-20-15.json
new file mode 100644
index 0000000000000..87a0f48b63332
--- /dev/null
+++ b/common/changes/@uifabric/styling/miwhea-reverse-1925_2017-06-15-20-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Removed new icons that were added recently",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "miwhea@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/styling/src/styles/DefaultFontStyles.ts b/packages/styling/src/styles/DefaultFontStyles.ts
index ce12f3e085336..027406318c9db 100644
--- a/packages/styling/src/styles/DefaultFontStyles.ts
+++ b/packages/styling/src/styles/DefaultFontStyles.ts
@@ -173,7 +173,6 @@ function _registerDefaultFontFaces(): void {
   if (baseUrl) {
     const fontUrl = `${baseUrl}/fonts`;
     const iconUrl = `${baseUrl}/icons`;
-    const iconVersion = '2.30';
 
     // Produce @font-face definitions for all supported web fonts.
     _registerFontFaceSet(fontUrl, FontNameThai, 'leelawadeeui-thai', 'leelawadeeui');
@@ -195,7 +194,7 @@ function _registerDefaultFontFaces(): void {
     _registerFontFace('Leelawadee UI Web', `${fontUrl}/leelawadeeui-thai/leelawadeeui-bold`, FontWeights.semibold);
 
     // Register icon urls.
-    _registerFontFace('FabricMDL2Icons', `${iconUrl}/fabricmdl2icons-${iconVersion}`, FontWeights.regular);
+    _registerFontFace('FabricMDL2Icons', `${iconUrl}/fabricmdl2icons`, FontWeights.regular);
   }
 }
 
diff --git a/packages/styling/src/styles/IconCodes.ts b/packages/styling/src/styles/IconCodes.ts
index 41bc017911fad..1461a370e495b 100644
--- a/packages/styling/src/styles/IconCodes.ts
+++ b/packages/styling/src/styles/IconCodes.ts
@@ -1,1114 +1,2830 @@
 export const IconCodes = {
+  /**
+   * Icon code with the value '\uED68'.
+   */
   aadLogo: '\uED68',
+  /**
+   * Icon code with the value '\uE8FB'.
+   */
   accept: '\uE8FB',
+  /**
+   * Icon code with the value '\uED69'.
+   */
   accessLogo: '\uED69',
-  accessLogoFill: '\uF1DB',
+  /**
+   * Icon code with the value '\uE910'.
+   */
   accounts: '\uE910',
-  activityFeed: '\uF056',
+  /**
+   * Icon code with the value '\uE710'.
+   */
   add: '\uE710',
+  /**
+   * Icon code with the value '\uEEB5'.
+   */
   addEvent: '\uEEB5',
+  /**
+   * Icon code with the value '\uF0C8'.
+   */
   addFavorite: '\uF0C8',
+  /**
+   * Icon code with the value '\uF0C9'.
+   */
   addFavoriteFill: '\uF0C9',
+  /**
+   * Icon code with the value '\uE8FA'.
+   */
   addFriend: '\uE8FA',
+  /**
+   * Icon code with the value '\uEE3D'.
+   */
   addGroup: '\uEE3D',
+  /**
+   * Icon code with the value '\uED8E'.
+   */
   addOnlineMeeting: '\uED8E',
+  /**
+   * Icon code with the value '\uED96'.
+   */
   addPhone: '\uED96',
+  /**
+   * Icon code with the value '\uECC8'.
+   */
   addTo: '\uECC8',
+  /**
+   * Icon code with the value '\uE7EF'.
+   */
   admin: '\uE7EF',
+  /**
+   * Icon code with the value '\uED6A'.
+   */
   adminALogo: '\uED6A',
+  /**
+   * Icon code with the value '\uED6B'.
+   */
   adminCLogo: '\uED6B',
+  /**
+   * Icon code with the value '\uED6C'.
+   */
   adminDLogo: '\uED6C',
+  /**
+   * Icon code with the value '\uED6D'.
+   */
   adminELogo: '\uED6D',
+  /**
+   * Icon code with the value '\uED6E'.
+   */
   adminLLogo: '\uED6E',
+  /**
+   * Icon code with the value '\uED6F'.
+   */
   adminMLogo: '\uED6F',
+  /**
+   * Icon code with the value '\uED70'.
+   */
   adminOLogo: '\uED70',
+  /**
+   * Icon code with the value '\uED71'.
+   */
   adminPLogo: '\uED71',
+  /**
+   * Icon code with the value '\uED72'.
+   */
   adminSLogo: '\uED72',
+  /**
+   * Icon code with the value '\uED73'.
+   */
   adminYLogo: '\uED73',
-  airplane: '\uE709',
-  airplaneSolid: '\uEB4C',
+  /**
+   * Icon code with the value '\uEF7A'.
+   */
   airTickets: '\uEF7A',
+  /**
+   * Icon code with the value '\uE709'.
+   */
+  airplane: '\uE709',
+  /**
+   * Icon code with the value '\uE919'.
+   */
   alarmClock: '\uE919',
+  /**
+   * Icon code with the value '\uE7AB'.
+   */
   album: '\uE7AB',
+  /**
+   * Icon code with the value '\uEC62'.
+   */
   albumRemove: '\uEC62',
-  alertSolid: '\uF331',
+  /**
+   * Icon code with the value '\uED74'.
+   */
+  alchemyLogo: '\uED74',
+  /**
+   * Icon code with the value '\uE8E3'.
+   */
   alignCenter: '\uE8E3',
+  /**
+   * Icon code with the value '\uE8E4'.
+   */
   alignLeft: '\uE8E4',
+  /**
+   * Icon code with the value '\uE8E2'.
+   */
   alignRight: '\uE8E2',
-  analyticsLogo: '\uF1DE',
-  analyticsQuery: '\uF1DF',
-  analyticsReport: '\uF1E1',
+  /**
+   * Icon code with the value '\uEF8B'.
+   */
   androidLogo: '\uEF8B',
+  /**
+   * Icon code with the value '\uE924'.
+   */
   annotation: '\uE924',
+  /**
+   * Icon code with the value '\uEEC7'.
+   */
+  appForOfficeLogo: '\uEEC7',
+  /**
+   * Icon code with the value '\uECAA'.
+   */
   appIconDefault: '\uECAA',
-  archive: '\uF03F',
-  areaChart: '\uE9D2',
+  /**
+   * Icon code with the value '\uEB34'.
+   */
   arrivals: '\uEB34',
+  /**
+   * Icon code with the value '\uEED5'.
+   */
   arrowDownRight8: '\uEED5',
+  /**
+   * Icon code with the value '\uEEF0'.
+   */
   arrowDownRightMirrored8: '\uEEF0',
-  arrowTallDownLeft: '\uF2BF',
-  arrowTallDownRight: '\uF2C0',
-  arrowTallUpLeft: '\uF2BD',
-  arrowTallUpRight: '\uF2BE',
+  /**
+   * Icon code with the value '\uEED4'.
+   */
   arrowUpRight8: '\uEED4',
+  /**
+   * Icon code with the value '\uEEEF'.
+   */
   arrowUpRightMirrored8: '\uEEEF',
+  /**
+   * Icon code with the value '\uEAC1'.
+   */
   articles: '\uEAC1',
+  /**
+   * Icon code with the value '\uEDC0'.
+   */
   ascending: '\uEDC0',
-  assessmentGroup: '\uF31A',
-  assessmentGroupTemplate: '\uF2B1',
+  /**
+   * Icon code with the value '\uEEB6'.
+   */
   assetLibrary: '\uEEB6',
-  assign: '\uE9D3',
+  /**
+   * Icon code with the value '\uEA38'.
+   */
   asterisk: '\uEA38',
-  asteriskSolid: '\uF34D',
+  /**
+   * Icon code with the value '\uEF85'.
+   */
   atpLogo: '\uEF85',
+  /**
+   * Icon code with the value '\uE723'.
+   */
   attach: '\uE723',
+  /**
+   * Icon code with the value '\uEE70'.
+   */
   australianRules: '\uEE70',
+  /**
+   * Icon code with the value '\uE78E'.
+   */
   autoEnhanceOff: '\uE78E',
+  /**
+   * Icon code with the value '\uE78D'.
+   */
   autoEnhanceOn: '\uE78D',
-  autoFillTemplate: '\uF313',
+  /**
+   * Icon code with the value '\uEB24'.
+   */
   autoRacing: '\uEB24',
+  /**
+   * Icon code with the value '\uEE6A'.
+   */
   awayStatus: '\uEE6A',
-  azureAPIManagement: '\uF37F',
-  azureKeyVault: '\uF3B4',
+  /**
+   * Icon code with the value '\uEB6A'.
+   */
   azureLogo: '\uEB6A',
-  azureServiceEndpoint: '\uF380',
+  /**
+   * Icon code with the value '\uE72B'.
+   */
   back: '\uE72B',
-  backlog: '\uF2AC',
+  /**
+   * Icon code with the value '\uE73F'.
+   */
   backToWindow: '\uE73F',
+  /**
+   * Icon code with the value '\uEC1B'.
+   */
   badge: '\uEC1B',
+  /**
+   * Icon code with the value '\uED7E'.
+   */
   balloons: '\uED7E',
-  bankSolid: '\uF34F',
+  /**
+   * Icon code with the value '\uEAE7'.
+   */
   barChart4: '\uEAE7',
+  /**
+   * Icon code with the value '\uE9EB'.
+   */
   barChartHorizontal: '\uE9EB',
-  barChartVertical: '\uE9EC',
+  /**
+   * Icon code with the value '\uEB20'.
+   */
   baseball: '\uEB20',
+  /**
+   * Icon code with the value '\uE9AA'.
+   */
   bidiLtr: '\uE9AA',
+  /**
+   * Icon code with the value '\uE9AB'.
+   */
   bidiRtl: '\uE9AB',
+  /**
+   * Icon code with the value '\uEB6B'.
+   */
   bingLogo: '\uEB6B',
+  /**
+   * Icon code with the value '\uE8F8'.
+   */
   blockContact: '\uE8F8',
-  blocked: '\uE733',
+  /**
+   * Icon code with the value '\uECE4'.
+   */
   blocked2: '\uECE4',
+  /**
+   * Icon code with the value '\uE733'.
+   */
+  blocked: '\uE733',
+  /**
+   * Icon code with the value '\uE9C9'.
+   */
   blowingSnow: '\uE9C9',
-  blur: '\uF28E',
+  /**
+   * Icon code with the value '\uEF68'.
+   */
   boards: '\uEF68',
+  /**
+   * Icon code with the value '\uE8DD'.
+   */
   bold: '\uE8DD',
+  /**
+   * Icon code with the value '\uEDC7'.
+   */
   bookingsLogo: '\uEDC7',
+  /**
+   * Icon code with the value '\uE8A4'.
+   */
   bookmarks: '\uE8A4',
+  /**
+   * Icon code with the value '\uEA41'.
+   */
   bookmarksMirrored: '\uEA41',
-  boxAdditionSolid: '\uF2D4',
-  boxCheckmarkSolid: '\uF2D7',
+  /**
+   * Icon code with the value '\uED75'.
+   */
   boxLogo: '\uED75',
-  boxMultiplySolid: '\uF2D5',
-  boxPlaySolid: '\uF2D6',
-  boxSubtractSolid: '\uF2D3',
-  branchCommit: '\uF293',
-  branchCompare: '\uF294',
+  /**
+   * Icon code with the value '\uF173'.
+   */
   branchFork: '\uF173',
-  branchFork2: '\uF291',
-  branchLocked: '\uF292',
-  branchMerge: '\uF295',
-  branchPullRequest: '\uF296',
-  branchSearch: '\uF297',
-  branchShelveset: '\uF298',
+  /**
+   * Icon code with the value '\uEF8C'.
+   */
   breadcrumb: '\uEF8C',
+  /**
+   * Icon code with the value '\uE706'.
+   */
   brightness: '\uE706',
+  /**
+   * Icon code with the value '\uEA99'.
+   */
   broom: '\uEA99',
-  bucketColor: '\uF1B6',
-  bucketColorFill: '\uF1B7',
+  /**
+   * Icon code with the value '\uF0D0'.
+   */
   bufferTimeAfter: '\uF0D0',
+  /**
+   * Icon code with the value '\uF0CF'.
+   */
   bufferTimeBefore: '\uF0CF',
+  /**
+   * Icon code with the value '\uF0D1'.
+   */
   bufferTimeBoth: '\uF0D1',
-  bugSolid: '\uF335',
-  build: '\uF28F',
-  buildIssue: '\uF319',
-  buildQueue: '\uF24F',
-  buildQueueNew: '\uF250',
+  /**
+   * Icon code with the value '\uE8FD'.
+   */
   bulletedList: '\uE8FD',
-  bulletedList2: '\uF2C7',
-  bulletedList2Mirrored: '\uF2C8',
+  /**
+   * Icon code with the value '\uEA42'.
+   */
   bulletedListMirrored: '\uEA42',
-  businessHoursSign: '\uF310',
+  /**
+   * Icon code with the value '\uEB47'.
+   */
   busSolid: '\uEB47',
+  /**
+   * Icon code with the value '\uEC32'.
+   */
   cafe: '\uEC32',
+  /**
+   * Icon code with the value '\uECA4'.
+   */
   cake: '\uECA4',
+  /**
+   * Icon code with the value '\uE948'.
+   */
   calculatorAddition: '\uE948',
-  calculatorEqualTo: '\uE94E',
-  calculatorMultiply: '\uE947',
-  calculatorNotEqualTo: '\uF2D2',
+  /**
+   * Icon code with the value '\uE949'.
+   */
   calculatorSubtract: '\uE949',
+  /**
+   * Icon code with the value '\uE787'.
+   */
   calendar: '\uE787',
+  /**
+   * Icon code with the value '\uEE9A'.
+   */
   calendarAgenda: '\uEE9A',
+  /**
+   * Icon code with the value '\uE8BF'.
+   */
   calendarDay: '\uE8BF',
+  /**
+   * Icon code with the value '\uED28'.
+   */
   calendarMirrored: '\uED28',
+  /**
+   * Icon code with the value '\uE8F5'.
+   */
   calendarReply: '\uE8F5',
+  /**
+   * Icon code with the value '\uE8C0'.
+   */
   calendarWeek: '\uE8C0',
+  /**
+   * Icon code with the value '\uEF51'.
+   */
   calendarWorkWeek: '\uEF51',
+  /**
+   * Icon code with the value '\uF172'.
+   */
   caloriesAdd: '\uF172',
+  /**
+   * Icon code with the value '\uE722'.
+   */
   camera: '\uE722',
+  /**
+   * Icon code with the value '\uE711'.
+   */
   cancel: '\uE711',
-  cannedChat: '\uF0F2',
+  /**
+   * Icon code with the value '\uE804'.
+   */
   car: '\uE804',
-  caretBottomLeftCenter8: '\uF365',
+  /**
+   * Icon code with the value '\uF121'.
+   */
   caretBottomLeftSolid8: '\uF121',
-  caretBottomRightCenter8: '\uF364',
+  /**
+   * Icon code with the value '\uF122'.
+   */
   caretBottomRightSolid8: '\uF122',
+  /**
+   * Icon code with the value '\uEDD8'.
+   */
   caretDown8: '\uEDD8',
+  /**
+   * Icon code with the value '\uEDDC'.
+   */
   caretDownSolid8: '\uEDDC',
+  /**
+   * Icon code with the value '\uE817'.
+   */
   caretHollow: '\uE817',
+  /**
+   * Icon code with the value '\uEA45'.
+   */
   caretHollowMirrored: '\uEA45',
+  /**
+   * Icon code with the value '\uEDD5'.
+   */
   caretLeft8: '\uEDD5',
+  /**
+   * Icon code with the value '\uEDD9'.
+   */
   caretLeftSolid8: '\uEDD9',
-  caretRight: '\uF06B',
+  /**
+   * Icon code with the value '\uEDD6'.
+   */
   caretRight8: '\uEDD6',
+  /**
+   * Icon code with the value '\uEDDA'.
+   */
   caretRightSolid8: '\uEDDA',
+  /**
+   * Icon code with the value '\uE818'.
+   */
   caretSolid: '\uE818',
-  caretSolid16: '\uEE62',
-  caretSolidDown: '\uF08E',
-  caretSolidLeft: '\uF08D',
+  /**
+   * Icon code with the value '\uEA46'.
+   */
   caretSolidMirrored: '\uEA46',
-  caretSolidRight: '\uF08F',
-  caretSolidUp: '\uF090',
-  caretTopLeftCenter8: '\uF367',
+  /**
+   * Icon code with the value '\uEF54'.
+   */
   caretTopLeftSolid8: '\uEF54',
-  caretTopRightCenter8: '\uF366',
+  /**
+   * Icon code with the value '\uEF55'.
+   */
   caretTopRightSolid8: '\uEF55',
+  /**
+   * Icon code with the value '\uEDD7'.
+   */
   caretUp8: '\uEDD7',
+  /**
+   * Icon code with the value '\uEDDB'.
+   */
   caretUpSolid8: '\uEDDB',
+  /**
+   * Icon code with the value '\uED7F'.
+   */
   cat: '\uED7F',
+  /**
+   * Icon code with the value '\uE8EA'.
+   */
   cellPhone: '\uE8EA',
+  /**
+   * Icon code with the value '\uEB95'.
+   */
   certificate: '\uEB95',
+  /**
+   * Icon code with the value '\uE999'.
+   */
   chart: '\uE999',
+  /**
+   * Icon code with the value '\uE901'.
+   */
   chat: '\uE901',
+  /**
+   * Icon code with the value '\uECFE'.
+   */
   chatInviteFriend: '\uECFE',
-  chatSolid: '\uF344',
+  /**
+   * Icon code with the value '\uE9D5'.
+   */
+  checkList: '\uE9D5',
+  /**
+   * Icon code with the value '\uE73E'.
+   */
+  checkMark: '\uE73E',
+  /**
+   * Icon code with the value '\uE739'.
+   */
   checkbox: '\uE739',
+  /**
+   * Icon code with the value '\uE73A'.
+   */
   checkboxComposite: '\uE73A',
-  checkboxCompositeReversed: '\uE73D',
+  /**
+   * Icon code with the value '\uE73C'.
+   */
   checkboxIndeterminate: '\uE73C',
-  checkList: '\uE9D5',
-  checkMark: '\uE73E',
+  /**
+   * Icon code with the value '\uE70D'.
+   */
   chevronDown: '\uE70D',
-  chevronDownEnd6: '\uF36F',
+  /**
+   * Icon code with the value '\uE972'.
+   */
   chevronDownMed: '\uE972',
+  /**
+   * Icon code with the value '\uE96E'.
+   */
   chevronDownSmall: '\uE96E',
-  chevronFold10: '\uF36A',
+  /**
+   * Icon code with the value '\uE76B'.
+   */
   chevronLeft: '\uE76B',
-  chevronLeftEnd6: '\uF371',
+  /**
+   * Icon code with the value '\uE973'.
+   */
   chevronLeftMed: '\uE973',
+  /**
+   * Icon code with the value '\uE96F'.
+   */
   chevronLeftSmall: '\uE96F',
+  /**
+   * Icon code with the value '\uE76C'.
+   */
   chevronRight: '\uE76C',
-  chevronRightEnd6: '\uF372',
+  /**
+   * Icon code with the value '\uE974'.
+   */
   chevronRightMed: '\uE974',
+  /**
+   * Icon code with the value '\uE970'.
+   */
   chevronRightSmall: '\uE970',
-  chevronUnfold10: '\uF369',
+  /**
+   * Icon code with the value '\uE70E'.
+   */
   chevronUp: '\uE70E',
-  chevronUpEnd6: '\uF370',
+  /**
+   * Icon code with the value '\uE971'.
+   */
   chevronUpMed: '\uE971',
+  /**
+   * Icon code with the value '\uE96D'.
+   */
   chevronUpSmall: '\uE96D',
+  /**
+   * Icon code with the value '\uE830'.
+   */
   chromeBack: '\uE830',
+  /**
+   * Icon code with the value '\uEA47'.
+   */
   chromeBackMirrored: '\uEA47',
+  /**
+   * Icon code with the value '\uE8BB'.
+   */
   chromeClose: '\uE8BB',
+  /**
+   * Icon code with the value '\uE921'.
+   */
   chromeMinimize: '\uE921',
-  circleAddition: '\uF2E3',
-  circleAdditionSolid: '\uF2E4',
+  /**
+   * Icon code with the value '\uEA3B'.
+   */
   circleFill: '\uEA3B',
+  /**
+   * Icon code with the value '\uED9E'.
+   */
   circleHalfFull: '\uED9E',
-  circlePause: '\uF2D9',
-  circlePauseSolid: '\uF2D8',
+  /**
+   * Icon code with the value '\uEAEE'.
+   */
   circlePlus: '\uEAEE',
+  /**
+   * Icon code with the value '\uEA3A'.
+   */
   circleRing: '\uEA3A',
-  circleStop: '\uF2DC',
-  circleStopSolid: '\uF2DB',
-  cityNext: '\uEC06',
-  classNotebookLogoInverse: '\uEDC8',
+  /**
+   * Icon code with the value '\uEDC8'.
+   */
+  classNotebookLogo: '\uEDC8',
+  /**
+   * Icon code with the value '\uEF75'.
+   */
   classroomLogo: '\uEF75',
+  /**
+   * Icon code with the value '\uE894'.
+   */
   clear: '\uE894',
+  /**
+   * Icon code with the value '\uEF8F'.
+   */
   clearFilter: '\uEF8F',
+  /**
+   * Icon code with the value '\uEDDD'.
+   */
   clearFormatting: '\uEDDD',
+  /**
+   * Icon code with the value '\uE9C2'.
+   */
   clearNight: '\uE9C2',
+  /**
+   * Icon code with the value '\uE917'.
+   */
   clock: '\uE917',
-  cloneToDesktop: '\uF28C',
-  closedCaption: '\uEF84',
+  /**
+   * Icon code with the value '\uE89F'.
+   */
   closePane: '\uE89F',
+  /**
+   * Icon code with the value '\uEA49'.
+   */
   closePaneMirrored: '\uEA49',
-  cloud: '\uE753',
+  /**
+   * Icon code with the value '\uEF84'.
+   */
+  closedCaption: '\uEF84',
+  /**
+   * Icon code with the value '\uECA9'.
+   */
   cloudAdd: '\uECA9',
+  /**
+   * Icon code with the value '\uEBD3'.
+   */
   cloudDownload: '\uEBD3',
+  /**
+   * Icon code with the value '\uEC8E'.
+   */
   cloudUpload: '\uEC8E',
+  /**
+   * Icon code with the value '\uE9BE'.
+   */
   cloudWeather: '\uE9BE',
+  /**
+   * Icon code with the value '\uE9BF'.
+   */
   cloudy: '\uE9BF',
+  /**
+   * Icon code with the value '\uEA9D'.
+   */
   cocktails: '\uEA9D',
+  /**
+   * Icon code with the value '\uE943'.
+   */
   code: '\uE943',
+  /**
+   * Icon code with the value '\uEAEF'.
+   */
   coffee: '\uEAEF',
-  coffeeScript: '\uF2FA',
-  collapseContent: '\uF165',
-  collapseContentSingle: '\uF166',
+  /**
+   * Icon code with the value '\uEDC9'.
+   */
+  collabsDbLogo: '\uEDC9',
+  /**
+   * Icon code with the value '\uEF66'.
+   */
   collapseMenu: '\uEF66',
+  /**
+   * Icon code with the value '\uEB26'.
+   */
   collegeFootball: '\uEB26',
+  /**
+   * Icon code with the value '\uEB25'.
+   */
   collegeHoops: '\uEB25',
+  /**
+   * Icon code with the value '\uE790'.
+   */
   color: '\uE790',
-  colorSolid: '\uF354',
-  columnLeftTwoThirds: '\uF1D6',
-  columnLeftTwoThirdsEdit: '\uF324',
-  columnOptions: '\uF317',
-  columnRightTwoThirds: '\uF1D7',
-  columnRightTwoThirdsEdit: '\uF325',
+  /**
+   * Icon code with the value '\uEDBB'.
+   */
   combine: '\uEDBB',
-  commandPrompt: '\uE756',
-  comment: '\uE90A',
-  commentAdd: '\uF2B3',
-  commentNext: '\uF2B4',
-  commentPrevious: '\uF2B5',
-  commentUrgent: '\uF307',
-  communications: '\uE95A',
+  /**
+   * Icon code with the value '\uE942'.
+   */
   compassNW: '\uE942',
+  /**
+   * Icon code with the value '\uE930'.
+   */
   completed: '\uE930',
+  /**
+   * Icon code with the value '\uEC61'.
+   */
   completedSolid: '\uEC61',
-  configurationSolid: '\uF334',
-  constructionCone: '\uE98F',
-  constructionConeSolid: '\uF339',
+  /**
+   * Icon code with the value '\uE77B'.
+   */
   contact: '\uE77B',
+  /**
+   * Icon code with the value '\uEEBD'.
+   */
   contactCard: '\uEEBD',
+  /**
+   * Icon code with the value '\uE779'.
+   */
   contactInfo: '\uE779',
+  /**
+   * Icon code with the value '\uE7B8'.
+   */
+  container: '\uE7B8',
+  /**
+   * Icon code with the value '\uE7A1'.
+   */
   contrast: '\uE7A1',
+  /**
+   * Icon code with the value '\uE8C8'.
+   */
   copy: '\uE8C8',
+  /**
+   * Icon code with the value '\uEAF3'.
+   */
   cotton: '\uEAF3',
-  cPlusPlus: '\uF2F4',
-  cPlusPlusLanguage: '\uF2F3',
+  /**
+   * Icon code with the value '\uEB1E'.
+   */
   cricket: '\uEB1E',
-  crmReport: '\uEFFE',
-  crownSolid: '\uF336',
-  cSharp: '\uF2F0',
-  cSharpLanguage: '\uF2EF',
+  /**
+   * Icon code with the value '\uEBEF'.
+   */
   css: '\uEBEF',
+  /**
+   * Icon code with the value '\uEEBE'.
+   */
   customList: '\uEEBE',
+  /**
+   * Icon code with the value '\uEEBF'.
+   */
   customListMirrored: '\uEEBF',
-  cut: '\uE8C6',
+  /**
+   * Icon code with the value '\uEAC7'.
+   */
   cycling: '\uEAC7',
-  database: '\uEFC7',
+  /**
+   * Icon code with the value '\uEEB7'.
+   */
   dataConnectionLibrary: '\uEEB7',
-  dateTime: '\uEC92',
+  /**
+   * Icon code with the value '\uEA17'.
+   */
   dateTime2: '\uEA17',
+  /**
+   * Icon code with the value '\uEC92'.
+   */
+  dateTime: '\uEC92',
+  /**
+   * Icon code with the value '\uEE93'.
+   */
   dateTimeMirrored: '\uEE93',
-  decisionSolid: '\uF350',
+  /**
+   * Icon code with the value '\uE290'.
+   */
   decreaseIndentLegacy: '\uE290',
-  delete: '\uE74D',
+  /**
+   * Icon code with the value '\uEEEE'.
+   */
   delveAnalytics: '\uEEEE',
+  /**
+   * Icon code with the value '\uEDCA'.
+   */
   delveAnalyticsLogo: '\uEDCA',
-  delveLogo: '\uF280',
-  delveLogoFill: '\uF281',
-  delveLogoInverse: '\uED76',
-  deploy: '\uF29D',
+  /**
+   * Icon code with the value '\uED76'.
+   */
+  delveLogo: '\uED76',
+  /**
+   * Icon code with the value '\uEDC1'.
+   */
   descending: '\uEDC1',
+  /**
+   * Icon code with the value '\uEB3C'.
+   */
   design: '\uEB3C',
+  /**
+   * Icon code with the value '\uEC7A'.
+   */
   developerTools: '\uEC7A',
+  /**
+   * Icon code with the value '\uEA6C'.
+   */
   devices3: '\uEA6C',
+  /**
+   * Icon code with the value '\uEB66'.
+   */
   devices4: '\uEB66',
+  /**
+   * Icon code with the value '\uE75F'.
+   */
   dialpad: '\uE75F',
-  diamondSolid: '\uF34C',
+  /**
+   * Icon code with the value '\uE82D'.
+   */
   dictionary: '\uE82D',
+  /**
+   * Icon code with the value '\uEAC8'.
+   */
   dietPlanNotebook: '\uEAC8',
-  diffInline: '\uF309',
-  diffSideBySide: '\uF30A',
+  /**
+   * Icon code with the value '\uE8D8'.
+   */
   disableUpdates: '\uE8D8',
+  /**
+   * Icon code with the value '\uE8E0'.
+   */
   dislike: '\uE8E0',
+  /**
+   * Icon code with the value '\uEEB8'.
+   */
+  docLibrary: '\uEEB8',
+  /**
+   * Icon code with the value '\uE90C'.
+   */
   dockLeft: '\uE90C',
+  /**
+   * Icon code with the value '\uEA4C'.
+   */
   dockLeftMirrored: '\uEA4C',
+  /**
+   * Icon code with the value '\uE90D'.
+   */
   dockRight: '\uE90D',
-  docLibrary: '\uEEB8',
-  docsLogoInverse: '\uEDCB',
+  /**
+   * Icon code with the value '\uEDCB'.
+   */
+  docsLogo: '\uEDCB',
+  /**
+   * Icon code with the value '\uE8A5'.
+   */
   document: '\uE8A5',
-  documentation: '\uEC17',
-  documentManagement: '\uEFFC',
+  /**
+   * Icon code with the value '\uEF57'.
+   */
   documentReply: '\uEF57',
+  /**
+   * Icon code with the value '\uEF6C'.
+   */
   documentSearch: '\uEF6C',
+  /**
+   * Icon code with the value '\uEED6'.
+   */
   documentSet: '\uEED6',
-  donutChart: '\uF368',
+  /**
+   * Icon code with the value '\uEC17'.
+   */
+  documentation: '\uEC17',
+  /**
+   * Icon code with the value '\uEB75'.
+   */
   door: '\uEB75',
+  /**
+   * Icon code with the value '\uEB8F'.
+   */
   doubleBookmark: '\uEB8F',
-  doubleChevronDown: '\uEE04',
+  /**
+   * Icon code with the value '\uEE97'.
+   */
   doubleChevronDown12: '\uEE97',
-  doubleChevronDown8: '\uF36B',
-  doubleChevronLeft: '\uEDBE',
+  /**
+   * Icon code with the value '\uEE04'.
+   */
+  doubleChevronDown: '\uEE04',
+  /**
+   * Icon code with the value '\uEE98'.
+   */
   doubleChevronLeft12: '\uEE98',
-  doubleChevronLeft8: '\uF36D',
+  /**
+   * Icon code with the value '\uEDBE'.
+   */
+  doubleChevronLeft: '\uEDBE',
+  /**
+   * Icon code with the value '\uE991'.
+   */
   doubleChevronLeftMed: '\uE991',
+  /**
+   * Icon code with the value '\uEA4D'.
+   */
   doubleChevronLeftMedMirrored: '\uEA4D',
-  doubleChevronRight: '\uEDBF',
+  /**
+   * Icon code with the value '\uEE99'.
+   */
   doubleChevronRight12: '\uEE99',
-  doubleChevronRight8: '\uF36E',
-  doubleChevronUp: '\uEDBD',
+  /**
+   * Icon code with the value '\uEDBF'.
+   */
+  doubleChevronRight: '\uEDBF',
+  /**
+   * Icon code with the value '\uEE96'.
+   */
   doubleChevronUp12: '\uEE96',
-  doubleChevronUp8: '\uF36C',
-  doubleColumn: '\uF1D4',
-  doubleColumnEdit: '\uF322',
+  /**
+   * Icon code with the value '\uEDBD'.
+   */
+  doubleChevronUp: '\uEDBD',
+  /**
+   * Icon code with the value '\uE74B'.
+   */
   down: '\uE74B',
+  /**
+   * Icon code with the value '\uE896'.
+   */
   download: '\uE896',
+  /**
+   * Icon code with the value '\uECA8'.
+   */
   drm: '\uECA8',
+  /**
+   * Icon code with the value '\uEB42'.
+   */
   drop: '\uEB42',
+  /**
+   * Icon code with the value '\uED77'.
+   */
   dropboxLogo: '\uED77',
+  /**
+   * Icon code with the value '\uEDC5'.
+   */
   dropdown: '\uEDC5',
+  /**
+   * Icon code with the value '\uE9CD'.
+   */
   duststorm: '\uE9CD',
+  /**
+   * Icon code with the value '\uEDCD'.
+   */
+  dynamicSmbLogo: '\uEDCD',
+  /**
+   * Icon code with the value '\uEDCC'.
+   */
   dynamics365Logo: '\uEDCC',
-  dynamicSMBLogo: '\uEDCD',
+  /**
+   * Icon code with the value '\uE807'.
+   */
   eatDrink: '\uE807',
+  /**
+   * Icon code with the value '\uEC60'.
+   */
   edgeLogo: '\uEC60',
+  /**
+   * Icon code with the value '\uE70F'.
+   */
   edit: '\uE70F',
+  /**
+   * Icon code with the value '\uEF61'.
+   */
   editMail: '\uEF61',
+  /**
+   * Icon code with the value '\uEB7E'.
+   */
   editMirrored: '\uEB7E',
+  /**
+   * Icon code with the value '\uED9D'.
+   */
   editNote: '\uED9D',
+  /**
+   * Icon code with the value '\uEF77'.
+   */
   editPhoto: '\uEF77',
+  /**
+   * Icon code with the value '\uEF60'.
+   */
   editStyle: '\uEF60',
-  egnyteLogo: '\uF373',
+  /**
+   * Icon code with the value '\uECCE'.
+   */
   embed: '\uECCE',
+  /**
+   * Icon code with the value '\uE731'.
+   */
   emi: '\uE731',
-  emoji: '\uE899',
+  /**
+   * Icon code with the value '\uE76E'.
+   */
   emoji2: '\uE76E',
+  /**
+   * Icon code with the value '\uE899'.
+   */
+  emoji: '\uE899',
+  /**
+   * Icon code with the value '\uEA88'.
+   */
   emojiDisappointed: '\uEA88',
+  /**
+   * Icon code with the value '\uEA87'.
+   */
   emojiNeutral: '\uEA87',
+  /**
+   * Icon code with the value '\uEF88'.
+   */
   emptyRecycleBin: '\uEF88',
-  engineeringGroup: '\uF362',
+  /**
+   * Icon code with the value '\uE9E9'.
+   */
   equalizer: '\uE9E9',
+  /**
+   * Icon code with the value '\uE75C'.
+   */
   eraseTool: '\uE75C',
+  /**
+   * Icon code with the value '\uE783'.
+   */
   error: '\uE783',
+  /**
+   * Icon code with the value '\uEA39'.
+   */
   errorBadge: '\uEA39',
+  /**
+   * Icon code with the value '\uECA3'.
+   */
   event: '\uECA3',
-  eventDate: '\uF059',
+  /**
+   * Icon code with the value '\uED8B'.
+   */
   eventInfo: '\uED8B',
+  /**
+   * Icon code with the value '\uEF73'.
+   */
   excelDocument: '\uEF73',
-  excelLogo: '\uF1E5',
-  excelLogo16: '\uF397',
-  excelLogoFill: '\uF1E6',
-  excelLogoFill16: '\uF398',
-  excelLogoInverse: '\uEC28',
-  excelLogoInverse16: '\uF396',
-  exchangeLogo: '\uF284',
-  exchangeLogoFill: '\uF285',
-  exchangeLogoInverse: '\uED78',
+  /**
+   * Icon code with the value '\uEC28'.
+   */
+  excelLogo: '\uEC28',
+  /**
+   * Icon code with the value '\uED78'.
+   */
+  exchangeLogo: '\uED78',
+  /**
+   * Icon code with the value '\uEF67'.
+   */
   expandMenu: '\uEF67',
-  exploreContent: '\uECCD',
-  exploreContentSingle: '\uF164',
-  export: '\uEDE1',
-  exportMirrored: '\uEDE2',
+  /**
+   * Icon code with the value '\uF09C'.
+   */
   fabricAssetLibrary: '\uF09C',
+  /**
+   * Icon code with the value '\uF09D'.
+   */
   fabricDataConnectionLibrary: '\uF09D',
+  /**
+   * Icon code with the value '\uF09E'.
+   */
   fabricDocLibrary: '\uF09E',
+  /**
+   * Icon code with the value '\uF0A9'.
+   */
   fabricFolder: '\uF0A9',
+  /**
+   * Icon code with the value '\uF0AA'.
+   */
   fabricFolderFill: '\uF0AA',
+  /**
+   * Icon code with the value '\uF0A4'.
+   */
   fabricFolderSearch: '\uF0A4',
+  /**
+   * Icon code with the value '\uF09F'.
+   */
   fabricFormLibrary: '\uF09F',
+  /**
+   * Icon code with the value '\uF0A0'.
+   */
   fabricFormLibraryMirrored: '\uF0A0',
+  /**
+   * Icon code with the value '\uF0A5'.
+   */
   fabricMovetoFolder: '\uF0A5',
+  /**
+   * Icon code with the value '\uF0AB'.
+   */
   fabricNewFolder: '\uF0AB',
+  /**
+   * Icon code with the value '\uF0A8'.
+   */
   fabricOpenFolderHorizontal: '\uF0A8',
+  /**
+   * Icon code with the value '\uF0AC'.
+   */
   fabricPictureLibrary: '\uF0AC',
+  /**
+   * Icon code with the value '\uF0A3'.
+   */
   fabricPublicFolder: '\uF0A3',
+  /**
+   * Icon code with the value '\uF0A1'.
+   */
   fabricReportLibrary: '\uF0A1',
+  /**
+   * Icon code with the value '\uF0A2'.
+   */
   fabricReportLibraryMirrored: '\uF0A2',
+  /**
+   * Icon code with the value '\uF0A7'.
+   */
   fabricSyncFolder: '\uF0A7',
+  /**
+   * Icon code with the value '\uF0A6'.
+   */
   fabricUnsyncFolder: '\uF0A6',
+  /**
+   * Icon code with the value '\uECB3'.
+   */
   facebookLogo: '\uECB3',
+  /**
+   * Icon code with the value '\uEBDA'.
+   */
   family: '\uEBDA',
+  /**
+   * Icon code with the value '\uECEB'.
+   */
   fangBody: '\uECEB',
-  fastForward: '\uEB9D',
-  favicon: '\uE737',
+  /**
+   * Icon code with the value '\uE728'.
+   */
   favoriteList: '\uE728',
+  /**
+   * Icon code with the value '\uE734'.
+   */
   favoriteStar: '\uE734',
+  /**
+   * Icon code with the value '\uE735'.
+   */
   favoriteStarFill: '\uE735',
+  /**
+   * Icon code with the value '\uEF5C'.
+   */
   fax: '\uEF5C',
-  feedback: '\uED15',
-  feedbackRequestMirroredSolid: '\uF35A',
-  feedbackRequestSolid: '\uF359',
-  feedbackResponseSolid: '\uF35B',
+  /**
+   * Icon code with the value '\uE7E3'.
+   */
   ferry: '\uE7E3',
+  /**
+   * Icon code with the value '\uEB48'.
+   */
   ferrySolid: '\uEB48',
-  fieldChanged: '\uF2C3',
-  fieldEmpty: '\uF2C1',
-  fieldFilled: '\uF2C2',
-  fieldNotChanged: '\uF2C4',
-  fileASPX: '\uF2E9',
-  fileBug: '\uF30D',
-  fileCode: '\uF30E',
-  fileComment: '\uF30F',
-  fileCSS: '\uF2EA',
-  fileHTML: '\uF2ED',
-  fileImage: '\uF311',
-  fileJAVA: '\uF2E8',
-  fileLess: '\uF2EC',
-  filePDB: '\uF2E5',
-  fileSass: '\uF2EB',
-  fileSQL: '\uF2E7',
-  fileSymlink: '\uF312',
-  fileTemplate: '\uF2E6',
-  fileTypeSolution: '\uF387',
+  /**
+   * Icon code with the value '\uE71C'.
+   */
   filter: '\uE71C',
+  /**
+   * Icon code with the value '\uE795'.
+   */
   filters: '\uE795',
-  filtersSolid: '\uF353',
+  /**
+   * Icon code with the value '\uE7BB'.
+   */
   financial: '\uE7BB',
-  financialMirroredSolid: '\uF347',
-  financialSolid: '\uF346',
+  /**
+   * Icon code with the value '\uE928'.
+   */
   fingerprint: '\uE928',
-  fiveTileGrid: '\uF274',
+  /**
+   * Icon code with the value '\uE7C1'.
+   */
   flag: '\uE7C1',
-  flameSolid: '\uF1F3',
+  /**
+   * Icon code with the value '\uE935'.
+   */
   flickDown: '\uE935',
+  /**
+   * Icon code with the value '\uE937'.
+   */
   flickLeft: '\uE937',
+  /**
+   * Icon code with the value '\uE938'.
+   */
   flickRight: '\uE938',
+  /**
+   * Icon code with the value '\uE936'.
+   */
   flickUp: '\uE936',
+  /**
+   * Icon code with the value '\uEF90'.
+   */
   flow: '\uEF90',
-  focalPoint: '\uF277',
+  /**
+   * Icon code with the value '\uE9CB'.
+   */
   fog: '\uE9CB',
+  /**
+   * Icon code with the value '\uE8B7'.
+   */
   folder: '\uE8B7',
+  /**
+   * Icon code with the value '\uE8D5'.
+   */
   folderFill: '\uE8D5',
+  /**
+   * Icon code with the value '\uF12B'.
+   */
   folderHorizontal: '\uF12B',
-  folderList: '\uF2CE',
-  folderListMirrored: '\uF2CF',
+  /**
+   * Icon code with the value '\uE838'.
+   */
   folderOpen: '\uE838',
-  folderQuery: '\uF2CD',
+  /**
+   * Icon code with the value '\uEF65'.
+   */
   folderSearch: '\uEF65',
+  /**
+   * Icon code with the value '\uE8D2'.
+   */
   font: '\uE8D2',
+  /**
+   * Icon code with the value '\uE8D3'.
+   */
   fontColor: '\uE8D3',
+  /**
+   * Icon code with the value '\uE8E7'.
+   */
   fontDecrease: '\uE8E7',
+  /**
+   * Icon code with the value '\uE8E8'.
+   */
   fontIncrease: '\uE8E8',
+  /**
+   * Icon code with the value '\uE8E9'.
+   */
   fontSize: '\uE8E9',
+  /**
+   * Icon code with the value '\uEEB9'.
+   */
   formLibrary: '\uEEB9',
+  /**
+   * Icon code with the value '\uEEBA'.
+   */
   formLibraryMirrored: '\uEEBA',
+  /**
+   * Icon code with the value '\uE72A'.
+   */
   forward: '\uE72A',
+  /**
+   * Icon code with the value '\uED8C'.
+   */
   forwardEvent: '\uED8C',
+  /**
+   * Icon code with the value '\uE9EF'.
+   */
   freezing: '\uE9EF',
+  /**
+   * Icon code with the value '\uE9CA'.
+   */
   frigid: '\uE9CA',
-  fSharp: '\uF2F6',
-  fSharpLanguage: '\uF2F5',
+  /**
+   * Icon code with the value '\uE91F'.
+   */
   fullCircleMask: '\uE91F',
-  fullHistory: '\uF31C',
+  /**
+   * Icon code with the value '\uE740'.
+   */
   fullScreen: '\uE740',
-  fullWidth: '\uF2FE',
-  fullWidthEdit: '\uF2FF',
+  /**
+   * Icon code with the value '\uE9DA'.
+   */
   generate: '\uE9DA',
-  giftbox: '\uEC1F',
-  giftboxOpen: '\uF133',
-  giftBoxSolid: '\uF341',
+  /**
+   * Icon code with the value '\uEB8E'.
+   */
   giftCard: '\uEB8E',
-  gitGraph: '\uF2CA',
+  /**
+   * Icon code with the value '\uEC1F'.
+   */
+  giftbox: '\uEC1F',
+  /**
+   * Icon code with the value '\uEA16'.
+   */
   glasses: '\uEA16',
+  /**
+   * Icon code with the value '\uECF4'.
+   */
   glimmer: '\uECF4',
+  /**
+   * Icon code with the value '\uE700'.
+   */
   globalNavButton: '\uE700',
+  /**
+   * Icon code with the value '\uE774'.
+   */
   globe: '\uE774',
+  /**
+   * Icon code with the value '\uEF53'.
+   */
   globeFavorite: '\uEF53',
+  /**
+   * Icon code with the value '\uEB1F'.
+   */
   golf: '\uEB1F',
+  /**
+   * Icon code with the value '\uEE0B'.
+   */
   googleDriveLogo: '\uEE0B',
-  googleDriveLogoBottomBlue: '\uF375',
-  googleDriveLogoLeftGreen: '\uF374',
-  googleDriveLogoRightYellow: '\uF376',
+  /**
+   * Icon code with the value '\uE8D1'.
+   */
   gotoToday: '\uE8D1',
-  gripperBarVertical: '\uE784',
+  /**
+   * Icon code with the value '\uE75E'.
+   */
   gripperTool: '\uE75E',
+  /**
+   * Icon code with the value '\uE902'.
+   */
   group: '\uE902',
+  /**
+   * Icon code with the value '\uEE67'.
+   */
   groupedAscending: '\uEE67',
+  /**
+   * Icon code with the value '\uEE66'.
+   */
   groupedDescending: '\uEE66',
+  /**
+   * Icon code with the value '\uEF74'.
+   */
   groupedList: '\uEF74',
+  /**
+   * Icon code with the value '\uEA00'.
+   */
   hailDay: '\uEA00',
+  /**
+   * Icon code with the value '\uEA13'.
+   */
   hailNight: '\uEA13',
-  halfAlpha: '\uE97E',
+  /**
+   * Icon code with the value '\uE929'.
+   */
   handwriting: '\uE929',
-  hardDriveGroup: '\uF18F',
+  /**
+   * Icon code with the value '\uEA19'.
+   */
   header1: '\uEA19',
+  /**
+   * Icon code with the value '\uEF36'.
+   */
   header2: '\uEF36',
+  /**
+   * Icon code with the value '\uEF37'.
+   */
   header3: '\uEF37',
+  /**
+   * Icon code with the value '\uEF38'.
+   */
   header4: '\uEF38',
+  /**
+   * Icon code with the value '\uE95B'.
+   */
   headset: '\uE95B',
-  headsetSolid: '\uF348',
+  /**
+   * Icon code with the value '\uE95E'.
+   */
   health: '\uE95E',
-  healthSolid: '\uF33F',
+  /**
+   * Icon code with the value '\uEB51'.
+   */
   heart: '\uEB51',
+  /**
+   * Icon code with the value '\uEB52'.
+   */
   heartFill: '\uEB52',
+  /**
+   * Icon code with the value '\uE897'.
+   */
   help: '\uE897',
+  /**
+   * Icon code with the value '\uEA51'.
+   */
   helpMirrored: '\uEA51',
-  hide: '\uED1A',
+  /**
+   * Icon code with the value '\uEF89'.
+   */
   hide2: '\uEF89',
-  highlight: '\uE7E6',
-  highlightMappedShapes: '\uF2A1',
+  /**
+   * Icon code with the value '\uED1A'.
+   */
+  hide: '\uED1A',
+  /**
+   * Icon code with the value '\uE81C'.
+   */
   history: '\uE81C',
+  /**
+   * Icon code with the value '\uE80F'.
+   */
   home: '\uE80F',
+  /**
+   * Icon code with the value '\uEA8A'.
+   */
   homeSolid: '\uEA8A',
+  /**
+   * Icon code with the value '\uE91D'.
+   */
   hospital: '\uE91D',
+  /**
+   * Icon code with the value '\uE824'.
+   */
   hotel: '\uE824',
-  iconSetsFlag: '\uF2A4',
-  imageCrosshair: '\uF2C9',
-  imageDiff: '\uF30B',
-  imagePixel: '\uF30C',
-  import: '\uE8B5',
+  /**
+   * Icon code with the value '\uEF8A'.
+   */
+  iOsAppStoreLogo: '\uEF8A',
+  /**
+   * Icon code with the value '\uE8C9'.
+   */
   important: '\uE8C9',
-  importMirrored: '\uEA52',
+  /**
+   * Icon code with the value '\uEF64'.
+   */
   inboxCheck: '\uEF64',
+  /**
+   * Icon code with the value '\uE814'.
+   */
   incidentTriangle: '\uE814',
+  /**
+   * Icon code with the value '\uE291'.
+   */
   increaseIndentLegacy: '\uE291',
-  info: '\uE946',
+  /**
+   * Icon code with the value '\uEA1F'.
+   */
   info2: '\uEA1F',
-  infoSolid: '\uF167',
+  /**
+   * Icon code with the value '\uE946'.
+   */
+  info: '\uE946',
+  /**
+   * Icon code with the value '\uEC7D'.
+   */
   insertTextBox: '\uEC7D',
-  installToDrive: '\uF28D',
+  /**
+   * Icon code with the value '\uE704'.
+   */
   internetSharing: '\uE704',
-  iOsAppStoreLogo: '\uEF8A',
+  /**
+   * Icon code with the value '\uEEC0'.
+   */
   issueTracking: '\uEEC0',
+  /**
+   * Icon code with the value '\uEEC1'.
+   */
   issueTrackingMirrored: '\uEEC1',
+  /**
+   * Icon code with the value '\uE8DB'.
+   */
   italic: '\uE8DB',
-  javaScriptLanguage: '\uF2EE',
+  /**
+   * Icon code with the value '\uED8F'.
+   */
   joinOnlineMeeting: '\uED8F',
+  /**
+   * Icon code with the value '\uEBF0'.
+   */
   js: '\uEBF0',
+  /**
+   * Icon code with the value '\uE932'.
+   */
   label: '\uE932',
+  /**
+   * Icon code with the value '\uEF6B'.
+   */
   landscapeOrientation: '\uEF6B',
+  /**
+   * Icon code with the value '\uEC76'.
+   */
   laptopSelected: '\uEC76',
+  /**
+   * Icon code with the value '\uEECB'.
+   */
   largeGrid: '\uEECB',
+  /**
+   * Icon code with the value '\uE8F1'.
+   */
   library: '\uE8F1',
+  /**
+   * Icon code with the value '\uEF62'.
+   */
   lifesaver: '\uEF62',
+  /**
+   * Icon code with the value '\uEF63'.
+   */
   lifesaverLock: '\uEF63',
+  /**
+   * Icon code with the value '\uE793'.
+   */
   light: '\uE793',
+  /**
+   * Icon code with the value '\uEA80'.
+   */
   lightbulb: '\uEA80',
+  /**
+   * Icon code with the value '\uE945'.
+   */
   lightningBolt: '\uE945',
+  /**
+   * Icon code with the value '\uE8E1'.
+   */
   like: '\uE8E1',
-  lineChart: '\uE9E6',
+  /**
+   * Icon code with the value '\uE71B'.
+   */
   link: '\uE71B',
-  linkedInLogo: '\uF20A',
+  /**
+   * Icon code with the value '\uEA37'.
+   */
   list: '\uEA37',
+  /**
+   * Icon code with the value '\uEA55'.
+   */
   listMirrored: '\uEA55',
-  localeLanguage: '\uF2B7',
+  /**
+   * Icon code with the value '\uE81D'.
+   */
   location: '\uE81D',
+  /**
+   * Icon code with the value '\uE80E'.
+   */
   locationCircle: '\uE80E',
+  /**
+   * Icon code with the value '\uE827'.
+   */
   locationDot: '\uE827',
+  /**
+   * Icon code with the value '\uE920'.
+   */
   locationFill: '\uE920',
-  locationOutline: '\uF2D0',
+  /**
+   * Icon code with the value '\uE72E'.
+   */
   lock: '\uE72E',
-  lockSolid: '\uE9A2',
-  logRemove: '\uF316',
+  /**
+   * Icon code with the value '\uEC8A'.
+   */
   lowerBrightness: '\uEC8A',
+  /**
+   * Icon code with the value '\uED79'.
+   */
   lyncLogo: '\uED79',
+  /**
+   * Icon code with the value '\uE715'.
+   */
   mail: '\uE715',
+  /**
+   * Icon code with the value '\uED80'.
+   */
   mailAlert: '\uED80',
+  /**
+   * Icon code with the value '\uED81'.
+   */
   mailCheck: '\uED81',
+  /**
+   * Icon code with the value '\uE8A8'.
+   */
   mailFill: '\uE8A8',
+  /**
+   * Icon code with the value '\uE89C'.
+   */
   mailForward: '\uE89C',
+  /**
+   * Icon code with the value '\uEA56'.
+   */
   mailForwardMirrored: '\uEA56',
+  /**
+   * Icon code with the value '\uED82'.
+   */
   mailLowImportance: '\uED82',
+  /**
+   * Icon code with the value '\uED83'.
+   */
   mailPause: '\uED83',
+  /**
+   * Icon code with the value '\uED84'.
+   */
   mailRepeat: '\uED84',
+  /**
+   * Icon code with the value '\uE8CA'.
+   */
   mailReply: '\uE8CA',
+  /**
+   * Icon code with the value '\uE8C2'.
+   */
   mailReplyAll: '\uE8C2',
+  /**
+   * Icon code with the value '\uEA58'.
+   */
   mailReplyAllMirrored: '\uEA58',
+  /**
+   * Icon code with the value '\uEA57'.
+   */
   mailReplyMirrored: '\uEA57',
-  mailSolid: '\uF343',
+  /**
+   * Icon code with the value '\uE816'.
+   */
   mapDirections: '\uE816',
+  /**
+   * Icon code with the value '\uE707'.
+   */
   mapPin: '\uE707',
-  markDownLanguage: '\uF2FB',
+  /**
+   * Icon code with the value '\uEAFC'.
+   */
   market: '\uEAFC',
+  /**
+   * Icon code with the value '\uEF42'.
+   */
   marketDown: '\uEF42',
-  medical: '\uEAD4',
+  /**
+   * Icon code with the value '\uE789'.
+   */
   megaphone: '\uE789',
-  megaphoneSolid: '\uF332',
+  /**
+   * Icon code with the value '\uE77C'.
+   */
   memo: '\uE77C',
+  /**
+   * Icon code with the value '\uE7D5'.
+   */
   merge: '\uE7D5',
-  mergeDuplicate: '\uF29A',
+  /**
+   * Icon code with the value '\uE8BD'.
+   */
   message: '\uE8BD',
+  /**
+   * Icon code with the value '\uEC70'.
+   */
   messageFill: '\uEC70',
+  /**
+   * Icon code with the value '\uE720'.
+   */
   microphone: '\uE720',
+  /**
+   * Icon code with the value '\uF130'.
+   */
   microsoftStaffhubLogo: '\uF130',
+  /**
+   * Icon code with the value '\uE732'.
+   */
   miniLink: '\uE732',
+  /**
+   * Icon code with the value '\uEC75'.
+   */
   mobileSelected: '\uEC75',
+  /**
+   * Icon code with the value '\uEAFD'.
+   */
   money: '\uEAFD',
+  /**
+   * Icon code with the value '\uE712'.
+   */
   more: '\uE712',
+  /**
+   * Icon code with the value '\uEB22'.
+   */
   moreSports: '\uEB22',
-  moreVertical: '\uF2BC',
+  /**
+   * Icon code with the value '\uE7C2'.
+   */
   move: '\uE7C2',
+  /**
+   * Icon code with the value '\uE8DE'.
+   */
   moveToFolder: '\uE8DE',
+  /**
+   * Icon code with the value '\uEB6C'.
+   */
   msnLogo: '\uEB6C',
-  msnVideos: '\uEB1C',
-  msnVideosSolid: '\uF2DA',
+  /**
+   * Icon code with the value '\uE762'.
+   */
   multiSelect: '\uE762',
+  /**
+   * Icon code with the value '\uEA98'.
+   */
   multiSelectMirrored: '\uEA98',
+  /**
+   * Icon code with the value '\uE940'.
+   */
   musicInCollection: '\uE940',
+  /**
+   * Icon code with the value '\uEA36'.
+   */
   musicInCollectionFill: '\uEA36',
+  /**
+   * Icon code with the value '\uEC4F'.
+   */
   musicNote: '\uEC4F',
+  /**
+   * Icon code with the value '\uE800'.
+   */
   nav2DMapView: '\uE800',
-  navigateBack: '\uF2DD',
-  navigateBackMirrored: '\uF2DE',
-  navigateExternalInline: '\uF35F',
-  navigateForward: '\uF2DF',
-  navigateForwardMirrored: '\uF2E0',
-  networkTower: '\uEC05',
-  newAnalyticsQuery: '\uF1E0',
+  /**
+   * Icon code with the value '\uE8F4'.
+   */
   newFolder: '\uE8F4',
+  /**
+   * Icon code with the value '\uE900'.
+   */
   news: '\uE900',
-  newTeamProject: '\uF2B2',
-  next: '\uE893',
+  /**
+   * Icon code with the value '\uED99'.
+   */
   noteForward: '\uED99',
+  /**
+   * Icon code with the value '\uED9A'.
+   */
   notePinned: '\uED9A',
+  /**
+   * Icon code with the value '\uED98'.
+   */
   noteReply: '\uED98',
-  numberedList: '\uEA1C',
+  /**
+   * Icon code with the value '\uEDC4'.
+   */
   numberField: '\uEDC4',
-  officeAddinsLogo: '\uEEC7',
+  /**
+   * Icon code with the value '\uEA1C'.
+   */
+  numberedList: '\uEA1C',
+  /**
+   * Icon code with the value '\uEDCE'.
+   */
   officeAssistantLogo: '\uEDCE',
+  /**
+   * Icon code with the value '\uEF86'.
+   */
   officeFormLogo: '\uEF86',
+  /**
+   * Icon code with the value '\uEB6E'.
+   */
   officeLogo: '\uEB6E',
+  /**
+   * Icon code with the value '\uEDCF'.
+   */
   officeStoreLogo: '\uEDCF',
-  officeVideoLogo: '\uF282',
-  officeVideoLogoFill: '\uF283',
-  officeVideoLogoInverse: '\uED7A',
+  /**
+   * Icon code with the value '\uED7A'.
+   */
+  officeVideoLogo: '\uED7A',
+  /**
+   * Icon code with the value '\uEEC8'.
+   */
   offlineOneDriveParachute: '\uEEC8',
+  /**
+   * Icon code with the value '\uEEC9'.
+   */
   offlineOneDriveParachuteDisabled: '\uEEC9',
-  offlineStorageSolid: '\uF34E',
+  /**
+   * Icon code with the value '\uE941'.
+   */
   oneDrive: '\uE941',
+  /**
+   * Icon code with the value '\uEF32'.
+   */
   oneDriveAdd: '\uEF32',
-  oneNoteEduLogoInverse: '\uEDD0',
-  oneNoteLogo: '\uF1E7',
-  oneNoteLogo16: '\uF39A',
-  oneNoteLogoFill: '\uF1E8',
-  oneNoteLogoFill16: '\uF39B',
-  oneNoteLogoInverse: '\uEC0D',
-  oneNoteLogoInverse16: '\uF399',
+  /**
+   * Icon code with the value '\uEDD0'.
+   */
+  oneNoteEduLogo: '\uEDD0',
+  /**
+   * Icon code with the value '\uEC0D'.
+   */
+  oneNoteLogo: '\uEC0D',
+  /**
+   * Icon code with the value '\uE8E5'.
+   */
   openFile: '\uE8E5',
+  /**
+   * Icon code with the value '\uED25'.
+   */
   openFolderHorizontal: '\uED25',
+  /**
+   * Icon code with the value '\uE8A7'.
+   */
   openInNewWindow: '\uE8A7',
+  /**
+   * Icon code with the value '\uE8A0'.
+   */
   openPane: '\uE8A0',
+  /**
+   * Icon code with the value '\uEA5B'.
+   */
   openPaneMirrored: '\uEA5B',
-  openSource: '\uEBC2',
+  /**
+   * Icon code with the value '\uECA6'.
+   */
   org: '\uECA6',
-  outlookLogo: '\uF1E9',
-  outlookLogo16: '\uF39D',
-  outlookLogoFill: '\uF1EA',
-  outlookLogoFill16: '\uF39E',
-  outlookLogoInverse: '\uEB6D',
-  outlookLogoInverse16: '\uF39C',
+  /**
+   * Icon code with the value '\uED34'.
+   */
   outOfOffice: '\uED34',
-  package: '\uE7B8',
-  packages: '\uF318',
+  /**
+   * Icon code with the value '\uEB6D'.
+   */
+  outlookLogo: '\uEB6D',
+  /**
+   * Icon code with the value '\uE7C3'.
+   */
   page: '\uE7C3',
+  /**
+   * Icon code with the value '\uEA1A'.
+   */
   pageAdd: '\uEA1A',
-  pageCheckedin: '\uF104',
+  /**
+   * Icon code with the value '\uF02C'.
+   */
   pageCheckedOut: '\uF02C',
-  pageEdit: '\uEFB6',
+  /**
+   * Icon code with the value '\uF104'.
+   */
+  pageCheckedin: '\uF104',
+  /**
+   * Icon code with the value '\uE760'.
+   */
   pageLeft: '\uE760',
-  pageListMirroredSolid: '\uF33B',
-  pageListSolid: '\uF33A',
+  /**
+   * Icon code with the value '\uE761'.
+   */
   pageRight: '\uE761',
+  /**
+   * Icon code with the value '\uE729'.
+   */
   pageSolid: '\uE729',
+  /**
+   * Icon code with the value '\uE7B0'.
+   */
   panoIndicator: '\uE7B0',
-  parachute: '\uF351',
-  parachuteSolid: '\uF352',
-  parameter: '\uF306',
+  /**
+   * Icon code with the value '\uED7B'.
+   */
   paratureLogo: '\uED7B',
-  parkingLocation: '\uE811',
-  parkingLocationMirrored: '\uEA5E',
-  parkingMirroredSolid: '\uF34B',
-  parkingSolid: '\uF34A',
+  /**
+   * Icon code with the value '\uE9C0'.
+   */
   partlyCloudyDay: '\uE9C0',
+  /**
+   * Icon code with the value '\uE9C1'.
+   */
   partlyCloudyNight: '\uE9C1',
+  /**
+   * Icon code with the value '\uECA7'.
+   */
   partyLeader: '\uECA7',
-  paste: '\uE77F',
+  /**
+   * Icon code with the value '\uE769'.
+   */
   pause: '\uE769',
+  /**
+   * Icon code with the value '\uE8C7'.
+   */
   paymentCard: '\uE8C7',
+  /**
+   * Icon code with the value '\uE977'.
+   */
   pc1: '\uE977',
+  /**
+   * Icon code with the value '\uEA90'.
+   */
   pdf: '\uEA90',
+  /**
+   * Icon code with the value '\uEF7B'.
+   */
   pencilReply: '\uEF7B',
+  /**
+   * Icon code with the value '\uE716'.
+   */
   people: '\uE716',
+  /**
+   * Icon code with the value '\uEA15'.
+   */
   peopleAdd: '\uEA15',
+  /**
+   * Icon code with the value '\uED93'.
+   */
   peopleAlert: '\uED93',
+  /**
+   * Icon code with the value '\uED91'.
+   */
   peopleBlock: '\uED91',
+  /**
+   * Icon code with the value '\uED94'.
+   */
   peoplePause: '\uED94',
+  /**
+   * Icon code with the value '\uED92'.
+   */
   peopleRepeat: '\uED92',
+  /**
+   * Icon code with the value '\uE8D7'.
+   */
   permissions: '\uE8D7',
-  permissionsSolid: '\uF349',
-  personalize: '\uE771',
+  /**
+   * Icon code with the value '\uE717'.
+   */
   phone: '\uE717',
+  /**
+   * Icon code with the value '\uEB9F'.
+   */
   photo2: '\uEB9F',
+  /**
+   * Icon code with the value '\uECAB'.
+   */
   photo2Add: '\uECAB',
+  /**
+   * Icon code with the value '\uECAC'.
+   */
   photo2Remove: '\uECAC',
+  /**
+   * Icon code with the value '\uE7AA'.
+   */
   photoCollection: '\uE7AA',
+  /**
+   * Icon code with the value '\uE8B9'.
+   */
   picture: '\uE8B9',
+  /**
+   * Icon code with the value '\uEEC2'.
+   */
   pictureLibrary: '\uEEC2',
+  /**
+   * Icon code with the value '\uEB04'.
+   */
   pieDouble: '\uEB04',
-  pieSingle: '\uEB05',
+  /**
+   * Icon code with the value '\uEACB'.
+   */
   pill: '\uEACB',
+  /**
+   * Icon code with the value '\uE718'.
+   */
   pin: '\uE718',
+  /**
+   * Icon code with the value '\uE840'.
+   */
   pinned: '\uE840',
+  /**
+   * Icon code with the value '\uE842'.
+   */
   pinnedFill: '\uE842',
-  pivotChart: '\uF24C',
-  plannerLogo: '\uEDD1',
-  planView: '\uF360',
+  /**
+   * Icon code with the value '\uEDD1'.
+   */
+  planner: '\uEDD1',
+  /**
+   * Icon code with the value '\uE768'.
+   */
   play: '\uE768',
+  /**
+   * Icon code with the value '\uEF58'.
+   */
   playerSettings: '\uEF58',
-  playResume: '\uF2C6',
-  plug: '\uF300',
-  plugConnected: '\uF302',
-  plugDisconnected: '\uF303',
-  plugSolid: '\uF301',
+  /**
+   * Icon code with the value '\uECAF'.
+   */
   poi: '\uECAF',
-  poiSolid: '\uF2D1',
+  /**
+   * Icon code with the value '\uE8F3'.
+   */
   postUpdate: '\uE8F3',
-  powerApps: '\uEDD2',
+  /**
+   * Icon code with the value '\uF092'.
+   */
   powerApps2Logo: '\uF092',
+  /**
+   * Icon code with the value '\uEDD2'.
+   */
+  powerApps: '\uEDD2',
+  /**
+   * Icon code with the value '\uF091'.
+   */
   powerAppsLogo: '\uF091',
+  /**
+   * Icon code with the value '\uEA1E'.
+   */
   powerBiLogo: '\uEA1E',
+  /**
+   * Icon code with the value '\uEF72'.
+   */
   powerPointDocument: '\uEF72',
-  powerPointLogo: '\uF1EB',
-  powerPointLogo16: '\uF394',
-  powerPointLogoFill: '\uF1EC',
-  powerPointLogoFill16: '\uF395',
-  powerPointLogoInverse: '\uEC2A',
-  powerPointLogoInverse16: '\uF393',
+  /**
+   * Icon code with the value '\uEC2A'.
+   */
+  powerPointLogo: '\uEC2A',
+  /**
+   * Icon code with the value '\uE9CF'.
+   */
   precipitation: '\uE9CF',
+  /**
+   * Icon code with the value '\uE979'.
+   */
   presenceChickletVideo: '\uE979',
+  /**
+   * Icon code with the value '\uE8FF'.
+   */
   preview: '\uE8FF',
+  /**
+   * Icon code with the value '\uE8A1'.
+   */
   previewLink: '\uE8A1',
-  previous: '\uE892',
+  /**
+   * Icon code with the value '\uE749'.
+   */
   print: '\uE749',
+  /**
+   * Icon code with the value '\uE956'.
+   */
   printfaxPrinterFile: '\uE956',
-  processing: '\uE9F5',
-  processMetaTask: '\uF290',
-  product: '\uECDC',
+  /**
+   * Icon code with the value '\uEB27'.
+   */
   proFootball: '\uEB27',
-  progressLoopInner: '\uECDE',
-  progressLoopOuter: '\uECDF',
-  progressRingDots: '\uF16A',
+  /**
+   * Icon code with the value '\uEB28'.
+   */
   proHockey: '\uEB28',
-  projectCollection: '\uF363',
-  projectLogoInverse: '\uEDD4',
+  /**
+   * Icon code with the value '\uECDC'.
+   */
+  product: '\uECDC',
+  /**
+   * Icon code with the value '\uEDD4'.
+   */
+  projectLogo: '\uEDD4',
+  /**
+   * Icon code with the value '\uE8A6'.
+   */
   protectedDocument: '\uE8A6',
-  protectRestrict: '\uF22A',
+  /**
+   * Icon code with the value '\uEF6D'.
+   */
   publicCalendar: '\uEF6D',
+  /**
+   * Icon code with the value '\uEF6E'.
+   */
   publicContactCard: '\uEF6E',
+  /**
+   * Icon code with the value '\uEF6F'.
+   */
   publicEmail: '\uEF6F',
+  /**
+   * Icon code with the value '\uEF70'.
+   */
   publicFolder: '\uEF70',
-  publisherLogo: '\uF1ED',
-  publisherLogo16: '\uF3A0',
-  publisherLogoFill: '\uF1EE',
-  publisherLogoFill16: '\uF3A1',
-  publisherLogoInverse16: '\uF39F',
+  /**
+   * Icon code with the value '\uEA86'.
+   */
   puzzle: '\uEA86',
-  py: '\uF2F9',
-  pythonLanguage: '\uF2F8',
-  queryList: '\uF2B8',
+  /**
+   * Icon code with the value '\uEE19'.
+   */
   questionnaire: '\uEE19',
+  /**
+   * Icon code with the value '\uEE4B'.
+   */
   questionnaireMirrored: '\uEE4B',
+  /**
+   * Icon code with the value '\uE70B'.
+   */
   quickNote: '\uE70B',
-  quickNoteSolid: '\uF338',
-  radioBtnOff: '\uECCA',
+  /**
+   * Icon code with the value '\uECCB'.
+   */
   radioBtnOn: '\uECCB',
+  /**
+   * Icon code with the value '\uE915'.
+   */
   radioBullet: '\uE915',
+  /**
+   * Icon code with the value '\uE9C4'.
+   */
   rain: '\uE9C4',
+  /**
+   * Icon code with the value '\uE9C3'.
+   */
   rainShowersDay: '\uE9C3',
+  /**
+   * Icon code with the value '\uEA0F'.
+   */
   rainShowersNight: '\uEA0F',
+  /**
+   * Icon code with the value '\uE9C7'.
+   */
   rainSnow: '\uE9C7',
-  rawSource: '\uF299',
+  /**
+   * Icon code with the value '\uE8C3'.
+   */
   read: '\uE8C3',
+  /**
+   * Icon code with the value '\uE736'.
+   */
   readingMode: '\uE736',
-  readingModeSolid: '\uF33D',
+  /**
+   * Icon code with the value '\uEF5B'.
+   */
   receiptCheck: '\uEF5B',
+  /**
+   * Icon code with the value '\uEF59'.
+   */
   receiptForward: '\uEF59',
+  /**
+   * Icon code with the value '\uEF5A'.
+   */
   receiptReply: '\uEF5A',
+  /**
+   * Icon code with the value '\uE823'.
+   */
   recent: '\uE823',
-  record2: '\uEA3F',
+  /**
+   * Icon code with the value '\uEF5D'.
+   */
   recurringEvent: '\uEF5D',
+  /**
+   * Icon code with the value '\uEDB2'.
+   */
   recurringTask: '\uEDB2',
+  /**
+   * Icon code with the value '\uEF87'.
+   */
   recycleBin: '\uEF87',
-  redeploy: '\uF29E',
+  /**
+   * Icon code with the value '\uE7B3'.
+   */
   redEye: '\uE7B3',
+  /**
+   * Icon code with the value '\uE7A6'.
+   */
   redo: '\uE7A6',
+  /**
+   * Icon code with the value '\uE72C'.
+   */
   refresh: '\uE72C',
+  /**
+   * Icon code with the value '\uEBF8'.
+   */
   reminderGroup: '\uEBF8',
+  /**
+   * Icon code with the value '\uE738'.
+   */
   remove: '\uE738',
+  /**
+   * Icon code with the value '\uED8A'.
+   */
   removeEvent: '\uED8A',
+  /**
+   * Icon code with the value '\uEB08'.
+   */
   removeFilter: '\uEB08',
+  /**
+   * Icon code with the value '\uED90'.
+   */
   removeLink: '\uED90',
+  /**
+   * Icon code with the value '\uED9B'.
+   */
   removeOccurrence: '\uED9B',
+  /**
+   * Icon code with the value '\uE8AC'.
+   */
   rename: '\uE8AC',
+  /**
+   * Icon code with the value '\uED50'.
+   */
   reopenPages: '\uED50',
+  /**
+   * Icon code with the value '\uE90F'.
+   */
   repair: '\uE90F',
+  /**
+   * Icon code with the value '\uE97A'.
+   */
   reply: '\uE97A',
+  /**
+   * Icon code with the value '\uEE0A'.
+   */
   replyAll: '\uEE0A',
+  /**
+   * Icon code with the value '\uEF5F'.
+   */
   replyAllAlt: '\uEF5F',
+  /**
+   * Icon code with the value '\uEE36'.
+   */
   replyAllMirrored: '\uEE36',
+  /**
+   * Icon code with the value '\uEF5E'.
+   */
   replyAlt: '\uEF5E',
+  /**
+   * Icon code with the value '\uEE35'.
+   */
   replyMirrored: '\uEE35',
-  repo: '\uF2CB',
+  /**
+   * Icon code with the value '\uEEBB'.
+   */
   reportLibrary: '\uEEBB',
+  /**
+   * Icon code with the value '\uEEBC'.
+   */
   reportLibraryMirrored: '\uEEBC',
-  repoSolid: '\uF2CC',
+  /**
+   * Icon code with the value '\uED24'.
+   */
   returnToSession: '\uED24',
-  reviewRequestMirroredSolid: '\uF357',
-  reviewRequestSolid: '\uF356',
-  reviewResponseSolid: '\uF358',
-  reviewSolid: '\uF355',
+  /**
+   * Icon code with the value '\uE845'.
+   */
   revToggleKey: '\uE845',
-  rewind: '\uEB9E',
+  /**
+   * Icon code with the value '\uE9D1'.
+   */
   ribbon: '\uE9D1',
-  ribbonSolid: '\uF345',
+  /**
+   * Icon code with the value '\uE9B1'.
+   */
   rightDoubleQuote: '\uE9B1',
+  /**
+   * Icon code with the value '\uEA8F'.
+   */
   ringer: '\uEA8F',
-  ringerOff: '\uF2C5',
-  robot: '\uE99A',
-  rocket: '\uF3B3',
+  /**
+   * Icon code with the value '\uED9F'.
+   */
   room: '\uED9F',
+  /**
+   * Icon code with the value '\uE7AD'.
+   */
   rotate: '\uE7AD',
-  rowsChild: '\uF29C',
-  rowsGroup: '\uF29B',
+  /**
+   * Icon code with the value '\uEB2D'.
+   */
   rugby: '\uEB2D',
+  /**
+   * Icon code with the value '\uEADA'.
+   */
   running: '\uEADA',
+  /**
+   * Icon code with the value '\uE757'.
+   */
   sad: '\uE757',
-  sadSolid: '\uF33E',
+  /**
+   * Icon code with the value '\uE74E'.
+   */
   save: '\uE74E',
-  saveAll: '\uF203',
-  saveAndClose: '\uF038',
+  /**
+   * Icon code with the value '\uE792'.
+   */
   saveAs: '\uE792',
-  savings: '\uEB0B',
-  scheduleEventAction: '\uF1EF',
-  scopeTemplate: '\uF2B0',
-  script: '\uF03A',
-  scrollUpDown: '\uEC8F',
+  /**
+   * Icon code with the value '\uE721'.
+   */
   search: '\uE721',
-  searchAndApps: '\uE773',
+  /**
+   * Icon code with the value '\uEC0C'.
+   */
   section: '\uEC0C',
+  /**
+   * Icon code with the value '\uEF76'.
+   */
   sections: '\uEF76',
+  /**
+   * Icon code with the value '\uED85'.
+   */
   securityGroup: '\uED85',
+  /**
+   * Icon code with the value '\uE724'.
+   */
   send: '\uE724',
+  /**
+   * Icon code with the value '\uEA63'.
+   */
   sendMirrored: '\uEA63',
-  separator: '\uF35E',
-  server: '\uF201',
-  serverEnviroment: '\uF29F',
-  serverProcesses: '\uF1FE',
+  /**
+   * Icon code with the value '\uF071'.
+   */
   setAction: '\uF071',
+  /**
+   * Icon code with the value '\uE713'.
+   */
   settings: '\uE713',
+  /**
+   * Icon code with the value '\uE72D'.
+   */
   share: '\uE72D',
+  /**
+   * Icon code with the value '\uEF79'.
+   */
   shareiOs: '\uEF79',
-  sharepointLogo: '\uF27E',
-  sharepointLogoFill: '\uF27F',
-  sharepointLogoInverse: '\uED18',
+  /**
+   * Icon code with the value '\uED18'.
+   */
+  sharepointLogo: '\uED18',
+  /**
+   * Icon code with the value '\uEA18'.
+   */
   shield: '\uEA18',
-  shieldSolid: '\uF340',
+  /**
+   * Icon code with the value '\uE719'.
+   */
   shop: '\uE719',
+  /**
+   * Icon code with the value '\uE7BF'.
+   */
   shoppingCart: '\uE7BF',
-  shoppingCartSolid: '\uF342',
-  shopServer: '\uF2B6',
+  /**
+   * Icon code with the value '\uE8BC'.
+   */
   showResults: '\uE8BC',
+  /**
+   * Icon code with the value '\uEA65'.
+   */
   showResultsMirrored: '\uEA65',
+  /**
+   * Icon code with the value '\uEF52'.
+   */
   sidePanel: '\uEF52',
-  sidePanelMirrored: '\uF221',
-  signOut: '\uF3B1',
+  /**
+   * Icon code with the value '\uEDFF'.
+   */
   singleBookmark: '\uEDFF',
-  singleColumn: '\uF1D3',
-  singleColumnEdit: '\uF321',
+  /**
+   * Icon code with the value '\uE759'.
+   */
   sipMove: '\uE759',
+  /**
+   * Icon code with the value '\uEF80'.
+   */
   skypeCheck: '\uEF80',
+  /**
+   * Icon code with the value '\uEF7D'.
+   */
   skypeCircleCheck: '\uEF7D',
+  /**
+   * Icon code with the value '\uEF7E'.
+   */
   skypeCircleClock: '\uEF7E',
+  /**
+   * Icon code with the value '\uEF7F'.
+   */
   skypeCircleMinus: '\uEF7F',
+  /**
+   * Icon code with the value '\uEF81'.
+   */
   skypeClock: '\uEF81',
-  skypeForBusinessLogoFill: '\uF27D',
+  /**
+   * Icon code with the value '\uEB6F'.
+   */
   skypeLogo: '\uEB6F',
+  /**
+   * Icon code with the value '\uEF83'.
+   */
   skypeMessage: '\uEF83',
+  /**
+   * Icon code with the value '\uEF82'.
+   */
   skypeMinus: '\uEF82',
+  /**
+   * Icon code with the value '\uEC13'.
+   */
   sliderThumb: '\uEC13',
-  snow: '\uE9C8',
-  snowflake: '\uEB46',
+  /**
+   * Icon code with the value '\uEB46'.
+   */
+  snow: '\uEB46',
+  /**
+   * Icon code with the value '\uE9FD'.
+   */
   snowShowerDay: '\uE9FD',
+  /**
+   * Icon code with the value '\uEA11'.
+   */
   snowShowerNight: '\uEA11',
+  /**
+   * Icon code with the value '\uEB21'.
+   */
   soccer: '\uEB21',
+  /**
+   * Icon code with the value '\uED7C'.
+   */
   socialListeningLogo: '\uED7C',
+  /**
+   * Icon code with the value '\uE8CB'.
+   */
   sort: '\uE8CB',
+  /**
+   * Icon code with the value '\uEE69'.
+   */
   sortDown: '\uEE69',
+  /**
+   * Icon code with the value '\uE9D0'.
+   */
   sortLines: '\uE9D0',
+  /**
+   * Icon code with the value '\uEE68'.
+   */
   sortUp: '\uEE68',
+  /**
+   * Icon code with the value '\uE7F5'.
+   */
   speakers: '\uE7F5',
+  /**
+   * Icon code with the value '\uEC4A'.
+   */
   speedHigh: '\uEC4A',
+  /**
+   * Icon code with the value '\uEDBC'.
+   */
   split: '\uEDBC',
-  sprint: '\uF3B0',
+  /**
+   * Icon code with the value '\uE9CC'.
+   */
   squalls: '\uE9CC',
-  stackedBarChart: '\uF24D',
-  stackedLineChart: '\uF24E',
+  /**
+   * Icon code with the value '\uE7FF'.
+   */
   stackIndicator: '\uE7FF',
+  /**
+   * Icon code with the value '\uEF78'.
+   */
   starburst: '\uEF78',
-  starburstSolid: '\uF33C',
+  /**
+   * Icon code with the value '\uEB90'.
+   */
   statusErrorFull: '\uEB90',
+  /**
+   * Icon code with the value '\uEA82'.
+   */
   statusTriangle: '\uEA82',
-  step: '\uF241',
-  stepInsert: '\uF242',
-  stepShared: '\uF243',
-  stepSharedAdd: '\uF244',
-  stepSharedInsert: '\uF245',
+  /**
+   * Icon code with the value '\uEB0F'.
+   */
   stockDown: '\uEB0F',
+  /**
+   * Icon code with the value '\uEB11'.
+   */
   stockUp: '\uEB11',
-  stop: '\uE71A',
-  stopSolid: '\uEE95',
+  /**
+   * Icon code with the value '\uE916'.
+   */
   stopwatch: '\uE916',
+  /**
+   * Icon code with the value '\uEA96'.
+   */
   storeLogo: '\uEA96',
+  /**
+   * Icon code with the value '\uEA04'.
+   */
   storeLogoMed: '\uEA04',
-  storyboard: '\uF308',
-  streaming: '\uE93E',
-  streamingOff: '\uF2BB',
-  streamLogo: '\uF329',
+  /**
+   * Icon code with the value '\uEDE0'.
+   */
   strikethrough: '\uEDE0',
+  /**
+   * Icon code with the value '\uEDA1'.
+   */
   subscribe: '\uEDA1',
+  /**
+   * Icon code with the value '\uEDDF'.
+   */
   subscript: '\uEDDF',
+  /**
+   * Icon code with the value '\uEDD3'.
+   */
   suitcase: '\uEDD3',
+  /**
+   * Icon code with the value '\uEF69'.
+   */
   sunAdd: '\uEF69',
-  sunny: '\uE9BD',
+  /**
+   * Icon code with the value '\uEF6A'.
+   */
   sunQuestionMark: '\uEF6A',
+  /**
+   * Icon code with the value '\uE9BD'.
+   */
+  sunny: '\uE9BD',
+  /**
+   * Icon code with the value '\uEDDE'.
+   */
   superscript: '\uEDDE',
-  swayLogoInverse: '\uED29',
-  switch: '\uE8AB',
+  /**
+   * Icon code with the value '\uED29'.
+   */
+  swayLogo: '\uED29',
+  /**
+   * Icon code with the value '\uE8AB'.
+   */
+  switcher: '\uE8AB',
+  /**
+   * Icon code with the value '\uE810'.
+   */
   switcherStartEnd: '\uE810',
+  /**
+   * Icon code with the value '\uE895'.
+   */
   sync: '\uE895',
+  /**
+   * Icon code with the value '\uE8F7'.
+   */
   syncFolder: '\uE8F7',
+  /**
+   * Icon code with the value '\uEE6E'.
+   */
   syncToPc: '\uEE6E',
+  /**
+   * Icon code with the value '\uE770'.
+   */
   system: '\uE770',
+  /**
+   * Icon code with the value '\uE7E9'.
+   */
   tab: '\uE7E9',
+  /**
+   * Icon code with the value '\uED86'.
+   */
   table: '\uED86',
+  /**
+   * Icon code with the value '\uE70A'.
+   */
   tablet: '\uE70A',
+  /**
+   * Icon code with the value '\uEC74'.
+   */
   tabletSelected: '\uEC74',
+  /**
+   * Icon code with the value '\uE8EC'.
+   */
   tag: '\uE8EC',
-  taskboard: '\uF1C2',
-  taskGroup: '\uF2AE',
-  taskGroupMirrored: '\uF2AF',
+  /**
+   * Icon code with the value '\uEDB7'.
+   */
   taskManager: '\uEDB7',
+  /**
+   * Icon code with the value '\uEDB8'.
+   */
   taskManagerMirrored: '\uEDB8',
-  taskSolid: '\uF333',
-  teamFavorite: '\uF2AD',
-  teamsLogo: '\uF27B',
-  teamsLogoFill: '\uF27C',
-  teamsLogoInverse: '\uF27A',
+  /**
+   * Icon code with the value '\uEA12'.
+   */
   teamwork: '\uEA12',
+  /**
+   * Icon code with the value '\uEE58'.
+   */
   temporaryUser: '\uEE58',
+  /**
+   * Icon code with the value '\uEB33'.
+   */
   tennis: '\uEB33',
-  testAutoSolid: '\uF3A8',
-  testBeaker: '\uF3A5',
-  testBeakerSolid: '\uF3A6',
-  testCase: '\uF3AF',
-  testExploreSolid: '\uF3A7',
-  testImpactSolid: '\uF3AA',
-  testParameter: '\uF3AD',
-  testPlan: '\uF3AB',
-  testStep: '\uF3AC',
-  testSuite: '\uF3AE',
-  testUserSolid: '\uF3A9',
+  /**
+   * Icon code with the value '\uEDC2'.
+   */
   textBox: '\uEDC2',
-  textCallout: '\uF2A2',
-  textDocument: '\uF029',
+  /**
+   * Icon code with the value '\uEDC3'.
+   */
   textField: '\uEDC3',
+  /**
+   * Icon code with the value '\uE7B6'.
+   */
   thumbnailView: '\uE7B6',
+  /**
+   * Icon code with the value '\uEA67'.
+   */
   thumbnailViewMirrored: '\uEA67',
+  /**
+   * Icon code with the value '\uE9C6'.
+   */
   thunderstorms: '\uE9C6',
+  /**
+   * Icon code with the value '\uEB54'.
+   */
   ticket: '\uEB54',
-  tiles: '\uECA5',
+  /**
+   * Icon code with the value '\uEF7C'.
+   */
   tiles2: '\uEF7C',
+  /**
+   * Icon code with the value '\uECA5'.
+   */
+  tiles: '\uECA5',
+  /**
+   * Icon code with the value '\uED9C'.
+   */
   timeline: '\uED9C',
-  timelineDelivery: '\uF2AB',
-  timelineMatrixView: '\uF361',
-  timelineProgress: '\uF2AA',
+  /**
+   * Icon code with the value '\uE91E'.
+   */
   timer: '\uE91E',
+  /**
+   * Icon code with the value '\uEC12'.
+   */
   toggleBorder: '\uEC12',
+  /**
+   * Icon code with the value '\uEC11'.
+   */
   toggleFilled: '\uEC11',
+  /**
+   * Icon code with the value '\uEC14'.
+   */
   toggleThumb: '\uEC14',
+  /**
+   * Icon code with the value '\uE815'.
+   */
   touch: '\uE815',
+  /**
+   * Icon code with the value '\uE7C9'.
+   */
   touchPointer: '\uE7C9',
+  /**
+   * Icon code with the value '\uE7C0'.
+   */
   train: '\uE7C0',
+  /**
+   * Icon code with the value '\uEB4D'.
+   */
   trainSolid: '\uEB4D',
+  /**
+   * Icon code with the value '\uED95'.
+   */
   transferCall: '\uED95',
+  /**
+   * Icon code with the value '\uE74D'.
+   */
+  trash: '\uE74D',
+  /**
+   * Icon code with the value '\uEED1'.
+   */
   triangleDown12: '\uEED1',
+  /**
+   * Icon code with the value '\uEED2'.
+   */
   triangleLeft12: '\uEED2',
+  /**
+   * Icon code with the value '\uEED3'.
+   */
   triangleRight12: '\uEED3',
-  triangleSolid: '\uEA08',
+  /**
+   * Icon code with the value '\uEECD'.
+   */
   triangleSolidDown12: '\uEECD',
+  /**
+   * Icon code with the value '\uEECE'.
+   */
   triangleSolidLeft12: '\uEECE',
+  /**
+   * Icon code with the value '\uEECF'.
+   */
   triangleSolidRight12: '\uEECF',
+  /**
+   * Icon code with the value '\uEECC'.
+   */
   triangleSolidUp12: '\uEECC',
+  /**
+   * Icon code with the value '\uEED0'.
+   */
   triangleUp12: '\uEED0',
-  triggerApproval: '\uF3B2',
-  triggerAuto: '\uF24A',
-  triggerUser: '\uF24B',
-  tripleColumn: '\uF1D5',
-  tripleColumnEdit: '\uF323',
+  /**
+   * Icon code with the value '\uED3F'.
+   */
   trophy: '\uED3F',
-  trophy2Solid: '\uF337',
+  /**
+   * Icon code with the value '\uE7DB'.
+   */
   turnRight: '\uE7DB',
+  /**
+   * Icon code with the value '\uE7F4'.
+   */
   tvMonitor: '\uE7F4',
+  /**
+   * Icon code with the value '\uEC77'.
+   */
   tvMonitorSelected: '\uEC77',
-  typeScriptLanguage: '\uF2F7',
-  umbrella: '\uEC04',
+  /**
+   * Icon code with the value '\uE8DC'.
+   */
   underline: '\uE8DC',
+  /**
+   * Icon code with the value '\uE7A7'.
+   */
   undo: '\uE7A7',
+  /**
+   * Icon code with the value '\uE8D9'.
+   */
   unfavorite: '\uE8D9',
-  unknown: '\uE9CE',
+  /**
+   * Icon code with the value '\uED97'.
+   */
   unknownCall: '\uED97',
-  unknownMirroredSolid: '\uF2E2',
-  unknownSolid: '\uF2E1',
+  /**
+   * Icon code with the value '\uE785'.
+   */
   unlock: '\uE785',
-  unlockSolid: '\uF304',
+  /**
+   * Icon code with the value '\uE77A'.
+   */
   unpin: '\uE77A',
+  /**
+   * Icon code with the value '\uEDA0'.
+   */
   unsubscribe: '\uEDA0',
+  /**
+   * Icon code with the value '\uE8F6'.
+   */
   unsyncFolder: '\uE8F6',
+  /**
+   * Icon code with the value '\uE74A'.
+   */
   up: '\uE74A',
+  /**
+   * Icon code with the value '\uE898'.
+   */
   upload: '\uE898',
-  userFollowed: '\uF25C',
-  userPause: '\uF2BA',
-  userSync: '\uF2B9',
-  variable: '\uF305',
-  variableGroup: '\uF31B',
-  vb: '\uF2F2',
-  vennDiagram: '\uF273',
+  /**
+   * Icon code with the value '\uE714'.
+   */
   video: '\uE714',
+  /**
+   * Icon code with the value '\uEA0C'.
+   */
   videoSolid: '\uEA0C',
+  /**
+   * Icon code with the value '\uE890'.
+   */
   view: '\uE890',
-  viewAll: '\uE8A9',
+  /**
+   * Icon code with the value '\uEF56'.
+   */
   viewAll2: '\uEF56',
-  viewDashboard: '\uF246',
-  viewList: '\uF247',
-  viewListGroup: '\uF248',
-  viewListTree: '\uF249',
-  visioDiagram: '\uF2A0',
-  visioDocument: '\uF2A9',
-  visioLogo: '\uF2A7',
-  visioLogo16: '\uF3A3',
-  visioLogoFill: '\uF2A8',
-  visioLogoFill16: '\uF3A4',
-  visioLogoInverse: '\uED7D',
-  visioLogoInverse16: '\uF3A2',
-  visualBasicLanguage: '\uF2F1',
-  visualStudioLogo: '\uEC22',
+  /**
+   * Icon code with the value '\uE8A9'.
+   */
+  viewAll: '\uE8A9',
+  /**
+   * Icon code with the value '\uED7D'.
+   */
+  visioLogo: '\uED7D',
+  /**
+   * Icon code with the value '\uED87'.
+   */
   voicemailForward: '\uED87',
+  /**
+   * Icon code with the value '\uED88'.
+   */
   voicemailReply: '\uED88',
+  /**
+   * Icon code with the value '\uE992'.
+   */
   volume0: '\uE992',
+  /**
+   * Icon code with the value '\uE993'.
+   */
   volume1: '\uE993',
+  /**
+   * Icon code with the value '\uE994'.
+   */
   volume2: '\uE994',
+  /**
+   * Icon code with the value '\uE995'.
+   */
   volume3: '\uE995',
+  /**
+   * Icon code with the value '\uEA85'.
+   */
   volumeDisabled: '\uEA85',
-  vstsAltLogo1: '\uF382',
-  vstsAltLogo2: '\uF383',
-  vstsLogo: '\uF381',
+  /**
+   * Icon code with the value '\uED89'.
+   */
   waffle: '\uED89',
+  /**
+   * Icon code with the value '\uE7BA'.
+   */
   warning: '\uE7BA',
+  /**
+   * Icon code with the value '\uEB41'.
+   */
   website: '\uEB41',
+  /**
+   * Icon code with the value '\uEADB'.
+   */
   weights: '\uEADB',
-  wifiEthernet: '\uEE77',
+  /**
+   * Icon code with the value '\uEBE6'.
+   */
   windDirection: '\uEBE6',
+  /**
+   * Icon code with the value '\uE782'.
+   */
   windowsLogo: '\uE782',
+  /**
+   * Icon code with the value '\uED8D'.
+   */
   wipePhone: '\uED8D',
+  /**
+   * Icon code with the value '\uEF71'.
+   */
   wordDocument: '\uEF71',
-  wordLogo: '\uF1E3',
-  wordLogo16: '\uF391',
-  wordLogoFill: '\uF1E4',
-  wordLogoFill16: '\uF392',
-  wordLogoInverse: '\uEC29',
-  wordLogoInverse16: '\uF390',
+  /**
+   * Icon code with the value '\uEC29'.
+   */
+  wordLogo: '\uEC29',
+  /**
+   * Icon code with the value '\uE821'.
+   */
   work: '\uE821',
+  /**
+   * Icon code with the value '\uEA01'.
+   */
   workFlow: '\uEA01',
-  workItem: '\uF314',
-  workItemBar: '\uF35C',
-  workItemBarSolid: '\uF35D',
-  workItemBug: '\uF315',
-  world: '\uE909',
+  /**
+   * Icon code with the value '\uE918'.
+   */
   worldClock: '\uE918',
+  /**
+   * Icon code with the value '\uED19'.
+   */
   yammerLogo: '\uED19',
-  zipFolder: '\uF012',
+  /**
+   * Icon code with the value '\uE71E'.
+   */
   zoom: '\uE71E',
+  /**
+   * Icon code with the value '\uE8A3'.
+   */
   zoomIn: '\uE8A3',
+  /**
+   * Icon code with the value '\uE71F'.
+   */
   zoomOut: '\uE71F'
 };

From a5a7753f88e5b86ed2bbc16c3cb100a2dd121b37 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 15 Jun 2017 23:55:18 +0000
Subject: [PATCH 0116/1641] Applying package updates.

---
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../miwhea-reverse-1925_2017-06-15-20-15.json | 11 -----------
 ...nHighContrastFirefox_2017-06-14-11-14.json | 11 -----------
 packages/example-app-base/package.json        |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++++-
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/CHANGELOG.json               | 14 ++++++++++++++
 packages/styling/CHANGELOG.md                 |  9 ++++++++-
 packages/styling/package.json                 |  2 +-
 12 files changed, 56 insertions(+), 31 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/miwhea-reverse-1925_2017-06-15-20-15.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-ankhokha-FixCheckButtonHighContrastFirefox_2017-06-14-11-14.json

diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 6c5c5dc544e02..7f0b59c02d675 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.6.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.7.1 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 61a6862c60aa2..5c1af3323194b 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.6.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.7.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index a886af9a9b202..fd5a9bae11787 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.6.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.7.1 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/@uifabric/styling/miwhea-reverse-1925_2017-06-15-20-15.json b/common/changes/@uifabric/styling/miwhea-reverse-1925_2017-06-15-20-15.json
deleted file mode 100644
index 87a0f48b63332..0000000000000
--- a/common/changes/@uifabric/styling/miwhea-reverse-1925_2017-06-15-20-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Removed new icons that were added recently",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "miwhea@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-ankhokha-FixCheckButtonHighContrastFirefox_2017-06-14-11-14.json b/common/changes/office-ui-fabric-react/users-ankhokha-FixCheckButtonHighContrastFirefox_2017-06-14-11-14.json
deleted file mode 100644
index fc19343e1e123..0000000000000
--- a/common/changes/office-ui-fabric-react/users-ankhokha-FixCheckButtonHighContrastFirefox_2017-06-14-11-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "CheckButton: Firefox high contrast fix",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "ankhokha@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index c6cf30869a967..fd7f597a7ca47 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -40,7 +40,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.8.1 <1.0.0",
+    "@uifabric/styling": ">=0.9.0 <1.0.0",
     "@uifabric/utilities": ">=4.3.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 815c08adb823d..7e18d89832abb 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.7.1",
+      "tag": "office-ui-fabric-react_v4.7.1",
+      "date": "Thu, 15 Jun 2017 23:55:18 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Ankit Khokhar <ankitkhokhar@iitrpr.ac.in>",
+            "commit": "bed10f92f6c43d407e23b44787d879c09e2a37cb",
+            "comment": "CheckButton: Firefox high contrast fix"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.8.1 <1.0.0` to `>=0.9.0 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.7.0",
       "tag": "office-ui-fabric-react_v4.7.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 24daf0d504927..374e27656cf15 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 15 Jun 2017 10:09:15 GMT and should not be manually modified.
+This log was last generated on Thu, 15 Jun 2017 23:55:18 GMT and should not be manually modified.
+
+## 4.7.1
+Thu, 15 Jun 2017 23:55:18 GMT
+
+### Patches
+
+- CheckButton: Firefox high contrast fix
 
 ## 4.7.0
 Thu, 15 Jun 2017 10:09:15 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 210bf546b64a9..0783b7acbe3d0 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.7.0",
+  "version": "4.7.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.3.0 <5.0.0",
-    "@uifabric/styling": ">=0.8.1 <1.0.0",
+    "@uifabric/styling": ">=0.9.0 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index be45cd3dd4b57..c40bf4ad91fd6 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.9.0",
+      "tag": "@uifabric/styling_v0.9.0",
+      "date": "Thu, 15 Jun 2017 23:55:18 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Mike Wheaton <miwhea@microsoft.com>",
+            "commit": "90e2da953d51ba71c019b0b1db9a7f63bf8f7e48",
+            "comment": "Removed new icons that were added recently"
+          }
+        ]
+      }
+    },
     {
       "version": "0.8.1",
       "tag": "@uifabric/styling_v0.8.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 6360adbc7c517..9a3e035affb36 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 15 Jun 2017 10:09:15 GMT and should not be manually modified.
+This log was last generated on Thu, 15 Jun 2017 23:55:18 GMT and should not be manually modified.
+
+## 0.9.0
+Thu, 15 Jun 2017 23:55:18 GMT
+
+### Minor changes
+
+- Removed new icons that were added recently
 
 ## 0.8.1
 Thu, 15 Jun 2017 10:09:15 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 50d827aaf8b43..886e43e07c350 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.8.1",
+  "version": "0.9.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 54e9d048eb85e3a60688bfdc1482a9cb43a3662e Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Fri, 16 Jun 2017 08:59:19 -0700
Subject: [PATCH 0117/1641] OverflowSet: Don't ever use the index as the key
 (#1995)

* Don't ever use the index as the key in an overflowset.

* Fix spacing

* Rush change.

* Update rush change
---
 .../remove-index-key_2017-06-14-23-39.json            | 11 +++++++++++
 .../src/components/OverflowSet/OverflowSet.tsx        |  7 +++++--
 2 files changed, 16 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/remove-index-key_2017-06-14-23-39.json

diff --git a/common/changes/office-ui-fabric-react/remove-index-key_2017-06-14-23-39.json b/common/changes/office-ui-fabric-react/remove-index-key_2017-06-14-23-39.json
new file mode 100644
index 0000000000000..53e5ea204b58c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/remove-index-key_2017-06-14-23-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "OverflowSet: Don't use the index as the key",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
index f6ddc17066342..0a017b32e9391 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
@@ -30,9 +30,12 @@ export class OverflowSet extends BaseComponent<IOverflowSetProps, null> {
   @autobind
   private _onRenderItems(items: any[]): JSX.Element[] {
     return items.map((item, i) => {
-      let key = item.key ? item.key : i;
+      let wrapperDivProps: React.HTMLProps<HTMLDivElement> = { className: css('ms-OverflowSet-item', styles.item) };
+      if (item.key) {
+        wrapperDivProps.key = item.key;
+      }
       return (
-        <div key={ key } className={ css('ms-OverflowSet-item', styles.item) }>
+        <div {...wrapperDivProps}>
           { this.props.onRenderItem(item) }
         </div>
       );

From 16ea1d01cdae0a29f9be83778280b25abd857df5 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 16 Jun 2017 12:28:31 -0700
Subject: [PATCH 0118/1641] Icon: ms-Icon--{name} classname added back to Icons
 (#2006)

* Passing the icon member name through to avoid breaking backwards compat.

* Fixing icon to pass through class name to avoid regressions downstream.

* Slight tweak.

* Fixing "this" reference
---
 .../office-ui-fabric-react/icon_2017-06-16-18-53.json | 11 +++++++++++
 .../src/components/Icon/Icon.tsx                      |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/icon_2017-06-16-18-53.json

diff --git a/common/changes/office-ui-fabric-react/icon_2017-06-16-18-53.json b/common/changes/office-ui-fabric-react/icon_2017-06-16-18-53.json
new file mode 100644
index 0000000000000..5d41ff381ebbc
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/icon_2017-06-16-18-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Icon: adding back ms-Icon--iconName className to avoid breaking backwards compatibility.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
index 4dfbe005cc04e..9d5a117101f54 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
@@ -54,6 +54,7 @@ export function Icon(props: IIconProps): JSX.Element {
         className={
           css(
             'ms-Icon',
+            props.iconType === IconType.default && ('ms-Icon--' + iconMemberName),
             IconClassNames[iconMemberName],
             styles.root,
             props.className

From cddc435314b2b1fcea2e406b6a6be58e4c3663b1 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 16 Jun 2017 19:39:48 +0000
Subject: [PATCH 0119/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 .../icon_2017-06-16-18-53.json                | 11 ---------
 .../remove-index-key_2017-06-14-23-39.json    | 11 ---------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 24 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++++-
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/CHANGELOG.json               |  6 +++++
 packages/styling/CHANGELOG.md                 |  7 +++++-
 packages/styling/package.json                 |  2 +-
 11 files changed, 51 insertions(+), 30 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/icon_2017-06-16-18-53.json
 delete mode 100644 common/changes/office-ui-fabric-react/remove-index-key_2017-06-14-23-39.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 68a7d93609cf6..8719c473d9181 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.7.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.7.2 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/icon_2017-06-16-18-53.json b/common/changes/office-ui-fabric-react/icon_2017-06-16-18-53.json
deleted file mode 100644
index 5d41ff381ebbc..0000000000000
--- a/common/changes/office-ui-fabric-react/icon_2017-06-16-18-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Icon: adding back ms-Icon--iconName className to avoid breaking backwards compatibility.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/remove-index-key_2017-06-14-23-39.json b/common/changes/office-ui-fabric-react/remove-index-key_2017-06-14-23-39.json
deleted file mode 100644
index 53e5ea204b58c..0000000000000
--- a/common/changes/office-ui-fabric-react/remove-index-key_2017-06-14-23-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "OverflowSet: Don't use the index as the key",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index fd7f597a7ca47..8735f1b1921a0 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -40,7 +40,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.9.0 <1.0.0",
+    "@uifabric/styling": ">=0.9.1 <1.0.0",
     "@uifabric/utilities": ">=4.3.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index fb7f0db6c70ea..02610c0ee6e61 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.7.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.7.2 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 7e18d89832abb..679852c4411ec 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.7.2",
+      "tag": "office-ui-fabric-react_v4.7.2",
+      "date": "Fri, 16 Jun 2017 19:39:47 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "16ea1d01cdae0a29f9be83778280b25abd857df5",
+            "comment": "Icon: adding back ms-Icon--iconName className to avoid breaking backwards compatibility."
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "54e9d048eb85e3a60688bfdc1482a9cb43a3662e",
+            "comment": "OverflowSet: Don't use the index as the key"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.9.0 <1.0.0` to `>=0.9.1 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.7.1",
       "tag": "office-ui-fabric-react_v4.7.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 374e27656cf15..107a53b54bea8 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 15 Jun 2017 23:55:18 GMT and should not be manually modified.
+This log was last generated on Fri, 16 Jun 2017 19:39:47 GMT and should not be manually modified.
+
+## 4.7.2
+Fri, 16 Jun 2017 19:39:47 GMT
+
+### Patches
+
+- Icon: adding back ms-Icon--iconName className to avoid breaking backwards compatibility.
+- OverflowSet: Don't use the index as the key
 
 ## 4.7.1
 Thu, 15 Jun 2017 23:55:18 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 0783b7acbe3d0..ba8bf131e0c4b 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.7.1",
+  "version": "4.7.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.3.0 <5.0.0",
-    "@uifabric/styling": ">=0.9.0 <1.0.0",
+    "@uifabric/styling": ">=0.9.1 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index c40bf4ad91fd6..4235e6d5d9d6f 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.9.1",
+      "tag": "@uifabric/styling_v0.9.1",
+      "date": "Fri, 16 Jun 2017 19:39:47 GMT",
+      "comments": {}
+    },
     {
       "version": "0.9.0",
       "tag": "@uifabric/styling_v0.9.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 9a3e035affb36..09d954d17c2cd 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 15 Jun 2017 23:55:18 GMT and should not be manually modified.
+This log was last generated on Fri, 16 Jun 2017 19:39:47 GMT and should not be manually modified.
+
+## 0.9.1
+Fri, 16 Jun 2017 19:39:47 GMT
+
+*Changes not tracked*
 
 ## 0.9.0
 Thu, 15 Jun 2017 23:55:18 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 886e43e07c350..d061658080803 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.9.0",
+  "version": "0.9.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 38244b81d039f7cae9d20671fec9f218f3148685 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Fri, 16 Jun 2017 15:45:28 -0700
Subject: [PATCH 0120/1641] Remove Tooltip from DetailsList, allowing optional
 override (#2007)

* Require manual overriding of column header to use tooltips

* Add TooltipHost example to DetailsList

* Update change output

* Update details-tooltip_2017-06-16-20-13.json
---
 .../details-tooltip_2017-06-16-20-13.json     | 11 ++++++++
 .../components/DetailsList/DetailsHeader.scss |  1 +
 .../components/DetailsList/DetailsHeader.tsx  | 27 ++++++++++++++-----
 .../DetailsList/DetailsList.Props.ts          |  8 ++++++
 .../components/DetailsList/DetailsList.tsx    | 16 +++++++++--
 .../examples/DetailsList.Basic.Example.tsx    | 14 ++++++++++
 6 files changed, 69 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/details-tooltip_2017-06-16-20-13.json

diff --git a/common/changes/office-ui-fabric-react/details-tooltip_2017-06-16-20-13.json b/common/changes/office-ui-fabric-react/details-tooltip_2017-06-16-20-13.json
new file mode 100644
index 0000000000000..a3dbc785d080d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/details-tooltip_2017-06-16-20-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: Remove Tooltip by defaul, allowing optional override.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "tmichon@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
index 45c5aac89ef67..64dd09b99da58 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
@@ -148,6 +148,7 @@ $resizerColor: $ms-color-neutralTertiaryAlt;
 }
 
 .cellTooltip {
+  display: block;
   position: absolute;
   top: 0;
   left: 0;
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index c708096d2296f..9e2966169043f 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -6,7 +6,8 @@ import {
   css,
   getRTL,
   getId,
-  KeyCodes
+  KeyCodes,
+  IRenderFunction
 } from '../../Utilities';
 import { IColumn, DetailsListLayoutMode, ColumnActionsMode } from './DetailsList.Props';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
@@ -14,7 +15,7 @@ import { Icon } from '../../Icon';
 import { Layer } from '../../Layer';
 import { GroupSpacer } from '../GroupedList/GroupSpacer';
 import { DetailsRowCheck } from './DetailsRowCheck';
-import { TooltipHost } from '../../Tooltip';
+import { ITooltipHostProps } from '../../Tooltip';
 import * as checkStyles from './DetailsRowCheck.scss';
 import { ISelection, SelectionMode, SELECTION_CHANGE } from '../../utilities/selection/interfaces';
 import * as stylesImport from './DetailsHeader.scss';
@@ -34,6 +35,7 @@ export interface IDetailsHeaderProps extends React.Props<DetailsHeader> {
   onColumnAutoResized?: (column: IColumn, columnIndex: number) => void;
   onColumnClick?: (ev: React.MouseEvent<HTMLElement>, column: IColumn) => void;
   onColumnContextMenu?: (column: IColumn, ev: React.MouseEvent<HTMLElement>) => void;
+  onRenderColumnHeaderTooltip?: IRenderFunction<ITooltipHostProps>;
   groupNestingDepth?: number;
   isAllCollapsed?: boolean;
   onToggleCollapseAll?: (isAllCollapsed: boolean) => void;
@@ -118,6 +120,12 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
 
     const showCheckbox = selectAllVisibility !== SelectAllVisibility.none;
 
+    const {
+      onRenderColumnHeaderTooltip = this._onRenderColumnHeaderTooltip
+    } = this.props;
+
+    const ColumnHeaderTooltip = (props: ITooltipHostProps) => onRenderColumnHeaderTooltip(props, this._onRenderColumnHeaderTooltip);
+
     return (
       <FocusZone
         role='row'
@@ -143,7 +151,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
             <span
               aria-label={ ariaLabelForSelectionColumn }
             ></span>
-            <TooltipHost
+            <ColumnHeaderTooltip
               hostClassName={ css(styles.checkTooltip) }
               id={ `${this._id}-checkTooltip` }
               setAriaDescribedBy={ false }
@@ -154,7 +162,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
                 anySelected={ false }
                 canSelect={ true }
               />
-            </TooltipHost>
+            </ColumnHeaderTooltip>
           </div>
         ) : null }
         { groupNestingDepth > 0 ? (
@@ -198,7 +206,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
                 data-automationid='ColumnsHeaderColumn'
                 data-item-key={ column.key }
               >
-                <TooltipHost
+                <ColumnHeaderTooltip
                   hostClassName={ css(styles.cellTooltip) }
                   id={ `${this._id}-${column.key}-tooltip` }
                   setAriaDescribedBy={ false }
@@ -242,7 +250,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
                       />
                     ) }
                   </span>
-                </TooltipHost>
+                </ColumnHeaderTooltip>
               </div>,
               (column.isResizable) && this._renderColumnSizer(columnIndex)
             ]
@@ -291,6 +299,13 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
     );
   }
 
+  @autobind
+  private _onRenderColumnHeaderTooltip(tooltipHostProps: ITooltipHostProps, defaultRender?: IRenderFunction<ITooltipHostProps>) {
+    return <span className={ tooltipHostProps.hostClassName }>{
+      tooltipHostProps.children
+    }</span>;
+  }
+
   /**
    * double click on the column sizer will auto ajust column width
    * to fit the longest content among current rendered rows.
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
index 0064a959be80a..0f78c64ff890d 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
@@ -15,8 +15,11 @@ import {
   IGroupRenderProps
 } from '../GroupedList/index';
 import { IDetailsRowProps } from '../DetailsList/DetailsRow';
+import { IDetailsHeaderProps } from './DetailsHeader';
 import { IViewport } from '../../utilities/decorators/withViewport';
 
+export { IDetailsHeaderProps };
+
 export interface IDetailsList {
   /**
    * Ensures that the list content is updated. Call this in cases where the list prop updates don't change, but the list
@@ -131,6 +134,11 @@ export interface IDetailsListProps extends React.Props<DetailsList> {
   /** Callback for what to render when the item is missing. */
   onRenderMissingItem?: (index?: number) => React.ReactNode;
 
+  /**
+   * An override to render the details header.
+   */
+  onRenderDetailsHeader?: IRenderFunction<IDetailsHeaderProps>;
+
   /** Viewport, provided by the withViewport decorator. */
   viewport?: IViewport;
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 2a698268153c4..1a38d8949dcd9 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -10,6 +10,7 @@ import {
   autobind,
   css,
   getRTLSafeKeyCode,
+  IRenderFunction
 } from '../../Utilities';
 import {
   CheckboxVisibility,
@@ -20,7 +21,7 @@ import {
   IDetailsList,
   IDetailsListProps,
 } from '../DetailsList/DetailsList.Props';
-import { DetailsHeader, SelectAllVisibility } from '../DetailsList/DetailsHeader';
+import { DetailsHeader, SelectAllVisibility, IDetailsHeaderProps } from '../DetailsList/DetailsHeader';
 import { DetailsRow, IDetailsRowProps } from '../DetailsList/DetailsRow';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import {
@@ -247,6 +248,12 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       selectAllVisibility = SelectAllVisibility.none;
     }
 
+    const {
+      onRenderDetailsHeader = this._onRenderDetailsHeader
+    } = this.props;
+
+    const DetailsHeader = (props: IDetailsHeaderProps) => onRenderDetailsHeader(props, this._onRenderDetailsHeader);
+
     return (
       // If shouldApplyApplicationRole is true, role application will be applied to make arrow keys work
       // with JAWS.
@@ -347,6 +354,11 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     return <DetailsRow { ...props } />;
   }
 
+  @autobind
+  private _onRenderDetailsHeader(detailsHeaderProps: IDetailsHeaderProps, defaultRender?: IRenderFunction<IDetailsHeaderProps>) {
+    return <DetailsHeader { ...detailsHeaderProps } />;
+  }
+
   private _onRenderCell(nestingDepth: number, item: any, index: number): React.ReactNode {
     let {
       dragDropEvents,
@@ -677,7 +689,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     if (index >= 0) {
       onActiveItemChanged(items[index], index, ev);
     }
-  };
+  }
 }
 
 export function buildColumns(
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
index fb0d814a0a72a..ca7524751ca11 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
@@ -5,9 +5,17 @@ import { TextField } from 'office-ui-fabric-react/lib/TextField';
 import {
   DetailsList,
   DetailsListLayoutMode,
+  IDetailsHeaderProps,
   Selection,
   IColumn
 } from 'office-ui-fabric-react/lib/DetailsList';
+import {
+  IRenderFunction
+} from 'office-ui-fabric-react/lib/Utilities';
+import {
+  TooltipHost,
+  ITooltipHostProps
+} from 'office-ui-fabric-react/lib/Tooltip';
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
 
 let _items = [];
@@ -76,6 +84,12 @@ export class DetailsListBasicExample extends React.Component<any, any> {
             columns={ _columns }
             setKey='set'
             layoutMode={ DetailsListLayoutMode.fixedColumns }
+            onRenderDetailsHeader={
+              (detailsHeaderProps: IDetailsHeaderProps, defaultRender: IRenderFunction<IDetailsHeaderProps>) => defaultRender({
+                ...detailsHeaderProps,
+                onRenderColumnHeaderTooltip: (tooltipHostProps: ITooltipHostProps) => <TooltipHost { ...tooltipHostProps } />
+              })
+            }
             selection={ this._selection }
             selectionPreservedOnEmptyClick={ true }
             ariaLabelForSelectionColumn='Toggle selection'

From bc5da65c865a2b7209143193eb2009d4fba3a387 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 16 Jun 2017 15:45:46 -0700
Subject: [PATCH 0121/1641] Icon: className is still not being provided
 correctly. Adding another patch update. (#2008)

* Passing the icon member name through to avoid breaking backwards compat.

* Fixing icon to pass through class name to avoid regressions downstream.

* Slight tweak.

* Fixing "this" reference

* Doh.

* change file.

* Removing extra change.

* conditionalizing icon.
---
 .../office-ui-fabric-react/icon_2017-06-16-22-16.json | 11 +++++++++++
 .../src/components/Icon/Icon.tsx                      |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/icon_2017-06-16-22-16.json

diff --git a/common/changes/office-ui-fabric-react/icon_2017-06-16-22-16.json b/common/changes/office-ui-fabric-react/icon_2017-06-16-22-16.json
new file mode 100644
index 0000000000000..68a0221c6945a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/icon_2017-06-16-22-16.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Icon: patch to className change to add ms-Icon--* in cases where iconType is not provided.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
index 9d5a117101f54..6c5ea8a7f59ae 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
@@ -54,8 +54,8 @@ export function Icon(props: IIconProps): JSX.Element {
         className={
           css(
             'ms-Icon',
-            props.iconType === IconType.default && ('ms-Icon--' + iconMemberName),
-            IconClassNames[iconMemberName],
+            iconMemberName && ('ms-Icon--' + iconMemberName),
+            iconMemberName && IconClassNames[iconMemberName],
             styles.root,
             props.className
           ) }

From 31867d887e53378ab7ce057babe1fcac939d2d65 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Fri, 16 Jun 2017 15:46:36 -0700
Subject: [PATCH 0122/1641] Enable No Implicit Any in the styling package
 (#2003)

* Fix first batch of errors

* More fixes
---
 ...styling-no-implicit-any_2017-06-16-00-30.json | 11 +++++++++++
 .../styling/src/classNames/ColorClassNames.ts    |  3 ++-
 .../styling/src/classNames/IconClassNames.ts     |  3 ++-
 .../src/examples/AnimationTile/AnimationTile.tsx |  3 ++-
 .../styling/src/examples/ColorPage/ColorPage.tsx |  9 ++++++---
 .../styling/src/examples/FontPage/FontPage.tsx   |  8 +++++---
 .../styling/src/examples/IconTile/IconTile.tsx   |  4 +++-
 packages/styling/src/glamorExports.ts            | 16 +++++++++-------
 packages/styling/src/styles/DefaultFontStyles.ts |  7 ++++---
 packages/styling/src/utilities/buildClassMap.ts  |  3 ++-
 packages/styling/src/utilities/mergeStyleSets.ts |  9 ++++++---
 packages/styling/src/utilities/theme.ts          |  8 ++++----
 packages/styling/tsconfig.json                   |  1 +
 13 files changed, 57 insertions(+), 28 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/styling-no-implicit-any_2017-06-16-00-30.json

diff --git a/common/changes/@uifabric/styling/styling-no-implicit-any_2017-06-16-00-30.json b/common/changes/@uifabric/styling/styling-no-implicit-any_2017-06-16-00-30.json
new file mode 100644
index 0000000000000..4d862c77c9a78
--- /dev/null
+++ b/common/changes/@uifabric/styling/styling-no-implicit-any_2017-06-16-00-30.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Enable no-implicit-any in the styling package",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/styling/src/classNames/ColorClassNames.ts b/packages/styling/src/classNames/ColorClassNames.ts
index 64c3d578a5920..246b889dabc71 100644
--- a/packages/styling/src/classNames/ColorClassNames.ts
+++ b/packages/styling/src/classNames/ColorClassNames.ts
@@ -329,7 +329,8 @@ function _defineGetter(
 ): void {
   Object.defineProperty(obj, colorName + suffix, {
     get: (): string => {
-      const style: IRawStyle = { [cssProperty]: getTheme().palette[colorName] };
+      // tslint:disable-next-line:no-any
+      const style: IRawStyle = { [cssProperty]: (getTheme().palette as any)[colorName] };
 
       return mergeStyles(isHover ? { ':hover': style } : style).toString();
     },
diff --git a/packages/styling/src/classNames/IconClassNames.ts b/packages/styling/src/classNames/IconClassNames.ts
index fa104b98bafd1..3a4a421fcaa2f 100644
--- a/packages/styling/src/classNames/IconClassNames.ts
+++ b/packages/styling/src/classNames/IconClassNames.ts
@@ -16,7 +16,8 @@ for (const iconName in IconCodes) {
         DefaultFontStyles.icon,
         {
           ':before': {
-            content: `"${IconCodes[iconName]}"`
+            // tslint:disable-next-line:no-any
+            content: `"${(IconCodes as any)[iconName]}"`
           }
         },
       ).toString();
diff --git a/packages/styling/src/examples/AnimationTile/AnimationTile.tsx b/packages/styling/src/examples/AnimationTile/AnimationTile.tsx
index d38dc9f48615a..545bcf46b3603 100644
--- a/packages/styling/src/examples/AnimationTile/AnimationTile.tsx
+++ b/packages/styling/src/examples/AnimationTile/AnimationTile.tsx
@@ -42,7 +42,8 @@ export class AnimationTile extends BaseComponent<IAnimationTileProps, IAnimation
     }
 
     let animationClassName: string | null = this.state.isAnimating
-      ? AnimationClassNames[this.props.name]
+      // tslint:disable-next-line:no-any
+      ? (AnimationClassNames as any)[this.props.name]
       : null;
 
     return (
diff --git a/packages/styling/src/examples/ColorPage/ColorPage.tsx b/packages/styling/src/examples/ColorPage/ColorPage.tsx
index d90b62af37dc4..5c0f2d326a668 100644
--- a/packages/styling/src/examples/ColorPage/ColorPage.tsx
+++ b/packages/styling/src/examples/ColorPage/ColorPage.tsx
@@ -53,7 +53,8 @@ export class ColorPage extends BaseComponent<{}, {}> {
     const styles: IColorPageStyles = getStyles();
 
     Object.keys(DefaultPalette).forEach((colorName: string) => {
-      const colorValue: string = theme.palette[colorName];
+      // tslint:disable-next-line:no-any
+      const colorValue: string = (theme.palette as any)[colorName];
 
       ['', 'Hover', 'Background', 'BackgroundHover', 'Border', 'BorderHover'].forEach((suffix: string) => {
         items.push({
@@ -81,7 +82,8 @@ export class ColorPage extends BaseComponent<{}, {}> {
                 column.key === 'example' ? (
                   <div
                     className={
-                      ColorClassNames[item.name] +
+                      // tslint:disable-next-line:no-any
+                      (ColorClassNames as any)[item.name] +
                       ' ' +
                       (item.name.indexOf('Border') >= 0 ? styles.cellWithBorder : '')
                     }
@@ -89,7 +91,8 @@ export class ColorPage extends BaseComponent<{}, {}> {
                     The quick brown fox jumps over the lazy dog.
                   </div>
                 ) : (
-                    <div>{ item[column.fieldName] }</div>
+                    // tslint:disable-next-line:no-any
+                    <div>{ (item as any)[column.fieldName] }</div>
                   ) }
             </div>
           )
diff --git a/packages/styling/src/examples/FontPage/FontPage.tsx b/packages/styling/src/examples/FontPage/FontPage.tsx
index 5ae98688373a2..08a73b70f9da0 100644
--- a/packages/styling/src/examples/FontPage/FontPage.tsx
+++ b/packages/styling/src/examples/FontPage/FontPage.tsx
@@ -22,12 +22,13 @@ export class FontPage extends BaseComponent<{}, {}> {
           <tbody>
             {
               Object.keys(theme.fonts)
-                .filter((fontName: string) => theme.fonts[fontName].fontSize !== undefined)
+                // tslint:disable:no-any
+                .filter((fontName: string) => (theme.fonts as any)[fontName].fontSize !== undefined)
                 .map((fontName: string) => (
                   <tr className={ styles.row as string } key={ fontName }>
                     <td className={ styles.cell as string }>{ `${fontName}` }</td>
-                    <td className={ styles.cell as string }>{ `${theme.fonts[fontName].fontSize}` }</td>
-                    <td className={ mergeStyles(theme.fonts[fontName]) as string }>
+                    <td className={ styles.cell as string }>{ `${(theme.fonts as any)[fontName].fontSize}` }</td>
+                    <td className={ mergeStyles((theme.fonts as any)[fontName]) as string }>
                       The quick brown fox jumps over the lazy dog
                     </td>
                   </tr>
@@ -38,3 +39,4 @@ export class FontPage extends BaseComponent<{}, {}> {
     );
   }
 }
+// tslint:enable:no-any
diff --git a/packages/styling/src/examples/IconTile/IconTile.tsx b/packages/styling/src/examples/IconTile/IconTile.tsx
index 221dd8d4ef4f3..8a33511865ddd 100644
--- a/packages/styling/src/examples/IconTile/IconTile.tsx
+++ b/packages/styling/src/examples/IconTile/IconTile.tsx
@@ -12,9 +12,11 @@ export function IconTile(props: IIconTileProps): JSX.Element {
   const styles: IIconTileStyles = getStyles();
 
   return (
+    // tslint:disable:no-any
     <div className={ styles.iconTile as string } { ...divProps }>
-      <i className={ IconClassNames[iconName] + ' ' + styles.icon } />
+      <i className={ (IconClassNames as any)[iconName] + ' ' + styles.icon } />
       <div>{ iconName }</div>
     </div>
+    // tslint:enable:no-any
   );
 }
diff --git a/packages/styling/src/glamorExports.ts b/packages/styling/src/glamorExports.ts
index 3862dc9b0b2b3..7ab17ea4e10cb 100644
--- a/packages/styling/src/glamorExports.ts
+++ b/packages/styling/src/glamorExports.ts
@@ -1,8 +1,10 @@
 import * as Glamor from 'glamor';
-import rtlify from 'rtl-css-js';
 import { IRawStyle, IProcessedStyle } from './interfaces/index';
 import { getRTL } from '@uifabric/utilities/lib/index';
 
+// tslint:disable-next-line:no-any
+let rtlify: any = require('rtl-css-js');
+
 interface IGlamorRulePair {
   selector: string;
   style: Glamor.CSSProperties;
@@ -10,14 +12,14 @@ interface IGlamorRulePair {
 
 function _initializeGlamor(): void {
   // force speedy.
-  // tslint:disable-next-line:no-string-literal
-  if (!Glamor['styleSheet'] || !Glamor['styleSheet'].isSpeedy) {
-    // tslint:disable-next-line:no-string-literal
-    Glamor['speedy'](true);
+  // tslint:disable-next-line:no-string-literal no-any
+  if (!(Glamor as any)['styleSheet'] || !(Glamor as any)['styleSheet'].isSpeedy) {
+    // tslint:disable-next-line:no-string-literal no-any
+    (Glamor as any)['speedy'](true);
   }
 
-  // tslint:disable-next-line:no-string-literal
-  Glamor['plugins'].add(
+  // tslint:disable-next-line:no-string-literal no-any
+  (Glamor as any)['plugins'].add(
     ({ selector, style }: IGlamorRulePair): IGlamorRulePair => (
       {
         selector,
diff --git a/packages/styling/src/styles/DefaultFontStyles.ts b/packages/styling/src/styles/DefaultFontStyles.ts
index 027406318c9db..e74814b30848d 100644
--- a/packages/styling/src/styles/DefaultFontStyles.ts
+++ b/packages/styling/src/styles/DefaultFontStyles.ts
@@ -118,7 +118,8 @@ function _getFontFamily(): string {
 
   for (let lang in LanguageToFontMap) {
     if (LanguageToFontMap.hasOwnProperty(lang) && lang.indexOf(language) === 0) {
-      fontFamily = LanguageToFontMap[lang];
+      // tslint:disable-next-line:no-any
+      fontFamily = (LanguageToFontMap as any)[lang];
       break;
     }
   }
@@ -204,8 +205,8 @@ function _registerDefaultFontFaces(): void {
 function _getFontBaseUrl(): string {
   let win = getWindow();
 
-  // tslint:disable-next-line:no-string-literal
-  let fabricConfig: IFabricConfig = win ? win['FabricConfig'] : undefined;
+  // tslint:disable-next-line:no-string-literal no-any
+  let fabricConfig: IFabricConfig = win ? (win as any)['FabricConfig'] : undefined;
 
   return (fabricConfig && fabricConfig.fontBaseUrl !== undefined) ? fabricConfig.fontBaseUrl : DefaultBaseUrl;
 }
diff --git a/packages/styling/src/utilities/buildClassMap.ts b/packages/styling/src/utilities/buildClassMap.ts
index d2533b04d00fb..f0d748ad10a8f 100644
--- a/packages/styling/src/utilities/buildClassMap.ts
+++ b/packages/styling/src/utilities/buildClassMap.ts
@@ -10,7 +10,8 @@ export function buildClassMap<T>(styles: T): {[key in keyof T]?: string } {
   return Object
     .keys(styles)
     .reduce((classNames: {[key in keyof T]?: string }, className: string) => {
-      classNames[className] = mergeStyles(styles[className]).toString();
+      // tslint:disable-next-line:no-any
+      classNames[className] = mergeStyles((styles as any)[className]).toString();
       return classNames;
     }, {});
 }
diff --git a/packages/styling/src/utilities/mergeStyleSets.ts b/packages/styling/src/utilities/mergeStyleSets.ts
index 402fd710d0344..489a7e4e293fa 100644
--- a/packages/styling/src/utilities/mergeStyleSets.ts
+++ b/packages/styling/src/utilities/mergeStyleSets.ts
@@ -7,17 +7,20 @@ import { mergeStyles } from './mergeStyles';
  */
 export function mergeStyleSets<T>(...args: T[]): T {
   const mergedRules: T = {} as T;
-  const setStyles = {};
+  // tslint:disable-next-line:no-any
+  const setStyles: any = {};
 
   args.forEach((arg: T) => arg && Object.keys(arg).forEach((key: string) => {
     if (!setStyles[key]) {
       setStyles[key] = [];
     }
-    setStyles[key].push(arg[key]);
+    // tslint:disable-next-line:no-any
+    setStyles[key].push((arg as any)[key]);
   }));
 
   Object.keys(setStyles).forEach((key: string) => {
-    mergedRules[key] = mergeStyles(setStyles[key]);
+    // tslint:disable-next-line:no-any
+    (mergedRules as any)[key] = mergeStyles(setStyles[key]);
   });
 
   return mergedRules;
diff --git a/packages/styling/src/utilities/theme.ts b/packages/styling/src/utilities/theme.ts
index ed214028208c6..8bb63f8cd8613 100644
--- a/packages/styling/src/utilities/theme.ts
+++ b/packages/styling/src/utilities/theme.ts
@@ -23,11 +23,11 @@ let _theme: ITheme = {
 
 let win = getWindow();
 
-// tslint:disable:no-string-literal
-if (win && win['FabricConfig'] && win['FabricConfig'].theme) {
-  _theme = createTheme(win['FabricConfig'].theme);
+// tslint:disable:no-string-literal no-any
+if (win && (win as any)['FabricConfig'] && (win as any)['FabricConfig'].theme) {
+  _theme = createTheme((win as any)['FabricConfig'].theme);
 }
-// tslint:enable:no-string-literal
+// tslint:enable:no-string-literal no-any
 
 Customizer.setDefault('theme', _theme);
 
diff --git a/packages/styling/tsconfig.json b/packages/styling/tsconfig.json
index b7402a941d26b..c8a8b5899944b 100644
--- a/packages/styling/tsconfig.json
+++ b/packages/styling/tsconfig.json
@@ -9,6 +9,7 @@
     "experimentalDecorators": true,
     "importHelpers": true,
     "moduleResolution": "node",
+    "noImplicitAny": true,
     "lib": [
       "es2017",
       "dom"

From fd33abbc49ae958847a04d4337ef5d094c18c06b Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 16 Jun 2017 23:02:08 +0000
Subject: [PATCH 0123/1641] Applying package updates.

---
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...ling-no-implicit-any_2017-06-16-00-30.json | 11 --------
 .../details-tooltip_2017-06-16-20-13.json     | 11 --------
 .../icon_2017-06-16-22-16.json                | 11 --------
 packages/example-app-base/package.json        |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 26 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 13 +++++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/CHANGELOG.json               | 14 ++++++++++
 packages/styling/CHANGELOG.md                 |  9 ++++++-
 packages/styling/package.json                 |  2 +-
 13 files changed, 67 insertions(+), 42 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/styling-no-implicit-any_2017-06-16-00-30.json
 delete mode 100644 common/changes/office-ui-fabric-react/details-tooltip_2017-06-16-20-13.json
 delete mode 100644 common/changes/office-ui-fabric-react/icon_2017-06-16-22-16.json

diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 7f0b59c02d675..0be82ea981d12 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.7.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.8.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 5c1af3323194b..36a97c7f6b4e0 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.7.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.8.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index fd5a9bae11787..ed1967e833624 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.7.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.8.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/@uifabric/styling/styling-no-implicit-any_2017-06-16-00-30.json b/common/changes/@uifabric/styling/styling-no-implicit-any_2017-06-16-00-30.json
deleted file mode 100644
index 4d862c77c9a78..0000000000000
--- a/common/changes/@uifabric/styling/styling-no-implicit-any_2017-06-16-00-30.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Enable no-implicit-any in the styling package",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/details-tooltip_2017-06-16-20-13.json b/common/changes/office-ui-fabric-react/details-tooltip_2017-06-16-20-13.json
deleted file mode 100644
index a3dbc785d080d..0000000000000
--- a/common/changes/office-ui-fabric-react/details-tooltip_2017-06-16-20-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: Remove Tooltip by defaul, allowing optional override.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "tmichon@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/icon_2017-06-16-22-16.json b/common/changes/office-ui-fabric-react/icon_2017-06-16-22-16.json
deleted file mode 100644
index 68a0221c6945a..0000000000000
--- a/common/changes/office-ui-fabric-react/icon_2017-06-16-22-16.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Icon: patch to className change to add ms-Icon--* in cases where iconType is not provided.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 8735f1b1921a0..4ab365b1674c3 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -40,7 +40,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.9.1 <1.0.0",
+    "@uifabric/styling": ">=0.10.0 <1.0.0",
     "@uifabric/utilities": ">=4.3.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 679852c4411ec..7ed400ed85e1e 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.8.0",
+      "tag": "office-ui-fabric-react_v4.8.0",
+      "date": "Fri, 16 Jun 2017 23:02:08 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "38244b81d039f7cae9d20671fec9f218f3148685",
+            "comment": "DetailsList: Remove Tooltip by defaul, allowing optional override."
+          }
+        ],
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "bc5da65c865a2b7209143193eb2009d4fba3a387",
+            "comment": "Icon: patch to className change to add ms-Icon--* in cases where iconType is not provided."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.9.1 <1.0.0` to `>=0.10.0 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.7.2",
       "tag": "office-ui-fabric-react_v4.7.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 107a53b54bea8..49e32f38c4d4d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 16 Jun 2017 19:39:47 GMT and should not be manually modified.
+This log was last generated on Fri, 16 Jun 2017 23:02:08 GMT and should not be manually modified.
+
+## 4.8.0
+Fri, 16 Jun 2017 23:02:08 GMT
+
+### Minor changes
+
+- DetailsList: Remove Tooltip by defaul, allowing optional override.
+
+### Patches
+
+- Icon: patch to className change to add ms-Icon--* in cases where iconType is not provided.
 
 ## 4.7.2
 Fri, 16 Jun 2017 19:39:47 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index ba8bf131e0c4b..dff5672d79844 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.7.2",
+  "version": "4.8.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.3.0 <5.0.0",
-    "@uifabric/styling": ">=0.9.1 <1.0.0",
+    "@uifabric/styling": ">=0.10.0 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 4235e6d5d9d6f..3a8126a8fd06c 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.10.0",
+      "tag": "@uifabric/styling_v0.10.0",
+      "date": "Fri, 16 Jun 2017 23:02:08 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "31867d887e53378ab7ce057babe1fcac939d2d65",
+            "comment": "Enable no-implicit-any in the styling package"
+          }
+        ]
+      }
+    },
     {
       "version": "0.9.1",
       "tag": "@uifabric/styling_v0.9.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 09d954d17c2cd..a909c4958d8e0 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 16 Jun 2017 19:39:47 GMT and should not be manually modified.
+This log was last generated on Fri, 16 Jun 2017 23:02:08 GMT and should not be manually modified.
+
+## 0.10.0
+Fri, 16 Jun 2017 23:02:08 GMT
+
+### Minor changes
+
+- Enable no-implicit-any in the styling package
 
 ## 0.9.1
 Fri, 16 Jun 2017 19:39:47 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index d061658080803..38a6e3d135546 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.9.1",
+  "version": "0.10.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From ff0d219134776c9b5cff83a7ac9ed7596d8281a2 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 16 Jun 2017 21:04:16 -0700
Subject: [PATCH 0124/1641] Fixing AMD importing, which was busted by the
 no-implicit-anys fix. (#2010)

* Fixing non "import" which breaks amd. Reverting no implicit any flag until we can figure out a better workaround.

* Adding change file.
---
 .../@uifabric/styling/fix-amd_2017-06-17-04-00.json   | 11 +++++++++++
 packages/styling/src/glamorExports.ts                 |  4 +---
 packages/styling/tsconfig.json                        |  2 +-
 3 files changed, 13 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/fix-amd_2017-06-17-04-00.json

diff --git a/common/changes/@uifabric/styling/fix-amd_2017-06-17-04-00.json b/common/changes/@uifabric/styling/fix-amd_2017-06-17-04-00.json
new file mode 100644
index 0000000000000..e2d1a997cc963
--- /dev/null
+++ b/common/changes/@uifabric/styling/fix-amd_2017-06-17-04-00.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Fixing amd import that was broken byt the no-implicit-anys fix.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/styling/src/glamorExports.ts b/packages/styling/src/glamorExports.ts
index 7ab17ea4e10cb..32f01b6710deb 100644
--- a/packages/styling/src/glamorExports.ts
+++ b/packages/styling/src/glamorExports.ts
@@ -1,10 +1,8 @@
 import * as Glamor from 'glamor';
+import rtlify from 'rtl-css-js';
 import { IRawStyle, IProcessedStyle } from './interfaces/index';
 import { getRTL } from '@uifabric/utilities/lib/index';
 
-// tslint:disable-next-line:no-any
-let rtlify: any = require('rtl-css-js');
-
 interface IGlamorRulePair {
   selector: string;
   style: Glamor.CSSProperties;
diff --git a/packages/styling/tsconfig.json b/packages/styling/tsconfig.json
index c8a8b5899944b..b5f031e44f513 100644
--- a/packages/styling/tsconfig.json
+++ b/packages/styling/tsconfig.json
@@ -9,7 +9,7 @@
     "experimentalDecorators": true,
     "importHelpers": true,
     "moduleResolution": "node",
-    "noImplicitAny": true,
+    "noImplicitAny": false,
     "lib": [
       "es2017",
       "dom"

From 2c0474f1388da831ebf487a6f163d438c4f07921 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Sat, 17 Jun 2017 04:36:46 +0000
Subject: [PATCH 0125/1641] Applying package updates.

---
 .../styling/fix-amd_2017-06-17-04-00.json          | 11 -----------
 packages/example-app-base/package.json             |  2 +-
 packages/office-ui-fabric-react/package.json       |  2 +-
 packages/styling/CHANGELOG.json                    | 14 ++++++++++++++
 packages/styling/CHANGELOG.md                      |  9 ++++++++-
 packages/styling/package.json                      |  2 +-
 6 files changed, 25 insertions(+), 15 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/fix-amd_2017-06-17-04-00.json

diff --git a/common/changes/@uifabric/styling/fix-amd_2017-06-17-04-00.json b/common/changes/@uifabric/styling/fix-amd_2017-06-17-04-00.json
deleted file mode 100644
index e2d1a997cc963..0000000000000
--- a/common/changes/@uifabric/styling/fix-amd_2017-06-17-04-00.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Fixing amd import that was broken byt the no-implicit-anys fix.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 4ab365b1674c3..c63be831c69a1 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -40,7 +40,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.10.0 <1.0.0",
+    "@uifabric/styling": ">=0.10.1 <1.0.0",
     "@uifabric/utilities": ">=4.3.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index dff5672d79844..2b898a1098582 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.3.0 <5.0.0",
-    "@uifabric/styling": ">=0.10.0 <1.0.0",
+    "@uifabric/styling": ">=0.10.1 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 3a8126a8fd06c..af57ebbcd76e5 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.10.1",
+      "tag": "@uifabric/styling_v0.10.1",
+      "date": "Sat, 17 Jun 2017 04:36:46 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "ff0d219134776c9b5cff83a7ac9ed7596d8281a2",
+            "comment": "Fixing amd import that was broken byt the no-implicit-anys fix."
+          }
+        ]
+      }
+    },
     {
       "version": "0.10.0",
       "tag": "@uifabric/styling_v0.10.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index a909c4958d8e0..f0e8b86b032ad 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 16 Jun 2017 23:02:08 GMT and should not be manually modified.
+This log was last generated on Sat, 17 Jun 2017 04:36:46 GMT and should not be manually modified.
+
+## 0.10.1
+Sat, 17 Jun 2017 04:36:46 GMT
+
+### Patches
+
+- Fixing amd import that was broken byt the no-implicit-anys fix.
 
 ## 0.10.0
 Fri, 16 Jun 2017 23:02:08 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 38a6e3d135546..232e70db546d3 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.10.0",
+  "version": "0.10.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 87e7c6738132371faa77a957a4e69d7b74ce8283 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 16 Jun 2017 23:13:55 -0700
Subject: [PATCH 0126/1641] The iconname used for the classname should be
 passthrough casing.

---
 packages/office-ui-fabric-react/src/components/Icon/Icon.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
index 6c5ea8a7f59ae..2076a78455679 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
@@ -54,7 +54,7 @@ export function Icon(props: IIconProps): JSX.Element {
         className={
           css(
             'ms-Icon',
-            iconMemberName && ('ms-Icon--' + iconMemberName),
+            iconName && ('ms-Icon--' + iconName),
             iconMemberName && IconClassNames[iconMemberName],
             styles.root,
             props.className

From c8bdb73324b8702400e4d4f53bbb182378a49b74 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 16 Jun 2017 23:15:08 -0700
Subject: [PATCH 0127/1641] Adding change file.

---
 .../master_2017-06-17-06-14.json                      | 11 +++++++++++
 1 file changed, 11 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/master_2017-06-17-06-14.json

diff --git a/common/changes/office-ui-fabric-react/master_2017-06-17-06-14.json b/common/changes/office-ui-fabric-react/master_2017-06-17-06-14.json
new file mode 100644
index 0000000000000..c4f3cb14861d5
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2017-06-17-06-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Icon: iconName should pass through to the classname without casing alterations.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file

From ad3add52eabdb2fc227cb84196d341b5f28f7478 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Sat, 17 Jun 2017 06:27:46 +0000
Subject: [PATCH 0128/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 .../master_2017-06-17-06-14.json              | 11 -----------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++++-
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/CHANGELOG.json               |  6 ++++++
 packages/styling/CHANGELOG.md                 |  7 ++++++-
 packages/styling/package.json                 |  2 +-
 10 files changed, 45 insertions(+), 19 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/master_2017-06-17-06-14.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 8719c473d9181..2291be45467a2 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.7.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.8.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2017-06-17-06-14.json b/common/changes/office-ui-fabric-react/master_2017-06-17-06-14.json
deleted file mode 100644
index c4f3cb14861d5..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2017-06-17-06-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Icon: iconName should pass through to the classname without casing alterations.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index c63be831c69a1..b16ed8990cb85 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -40,7 +40,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.10.1 <1.0.0",
+    "@uifabric/styling": ">=0.10.2 <1.0.0",
     "@uifabric/utilities": ">=4.3.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 02610c0ee6e61..79391319a2ca3 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.7.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.8.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 7ed400ed85e1e..3e6b14b1caa0a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.8.1",
+      "tag": "office-ui-fabric-react_v4.8.1",
+      "date": "Sat, 17 Jun 2017 06:27:45 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "c8bdb73324b8702400e4d4f53bbb182378a49b74",
+            "comment": "Icon: iconName should pass through to the classname without casing alterations."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.10.1 <1.0.0` to `>=0.10.2 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.8.0",
       "tag": "office-ui-fabric-react_v4.8.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 49e32f38c4d4d..1c512ef713b1e 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 16 Jun 2017 23:02:08 GMT and should not be manually modified.
+This log was last generated on Sat, 17 Jun 2017 06:27:45 GMT and should not be manually modified.
+
+## 4.8.1
+Sat, 17 Jun 2017 06:27:45 GMT
+
+### Patches
+
+- Icon: iconName should pass through to the classname without casing alterations.
 
 ## 4.8.0
 Fri, 16 Jun 2017 23:02:08 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 2b898a1098582..04d65d6a3feb3 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.8.0",
+  "version": "4.8.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.3.0 <5.0.0",
-    "@uifabric/styling": ">=0.10.1 <1.0.0",
+    "@uifabric/styling": ">=0.10.2 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index af57ebbcd76e5..e77a61c60fe4c 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.10.2",
+      "tag": "@uifabric/styling_v0.10.2",
+      "date": "Sat, 17 Jun 2017 06:27:45 GMT",
+      "comments": {}
+    },
     {
       "version": "0.10.1",
       "tag": "@uifabric/styling_v0.10.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index f0e8b86b032ad..ce2999d32cadb 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Sat, 17 Jun 2017 04:36:46 GMT and should not be manually modified.
+This log was last generated on Sat, 17 Jun 2017 06:27:45 GMT and should not be manually modified.
+
+## 0.10.2
+Sat, 17 Jun 2017 06:27:45 GMT
+
+*Changes not tracked*
 
 ## 0.10.1
 Sat, 17 Jun 2017 04:36:46 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 232e70db546d3..4ab5c4797373b 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.10.1",
+  "version": "0.10.2",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 5b17bfe13dc1826f08c2fb261d53de4e976d0752 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 17 Jun 2017 09:58:01 -0700
Subject: [PATCH 0129/1641] Fix icon images! (#2011)

* Minor issue with image icons.

* Change file.
---
 .../fix-icon-images_2017-06-17-16-55.json             | 11 +++++++++++
 .../src/components/Icon/Icon.tsx                      |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-icon-images_2017-06-17-16-55.json

diff --git a/common/changes/office-ui-fabric-react/fix-icon-images_2017-06-17-16-55.json b/common/changes/office-ui-fabric-react/fix-icon-images_2017-06-17-16-55.json
new file mode 100644
index 0000000000000..4b6f7c81bfeeb
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-icon-images_2017-06-17-16-55.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Icon: image icons now have less random \"l\" characters. Sorry about that!",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
index 2076a78455679..a5dc517b0d035 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
@@ -37,7 +37,7 @@ export function Icon(props: IIconProps): JSX.Element {
           styles.root
         ) }
       >
-        l  <Image { ...props.imageProps as any } />
+        <Image { ...props.imageProps as any } />
       </div>
     );
   } else {

From b248217b1ecc656f1342a144dd99e0c7da51c5e4 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 17 Jun 2017 10:28:26 -0700
Subject: [PATCH 0130/1641] Adding bumps manually. Something is off with npm
 publishing.

---
 apps/fabric-website/package.json             | 2 +-
 apps/ssr-tests/package.json                  | 2 +-
 apps/test-bundle-button/package.json         | 2 +-
 apps/todo-app/package.json                   | 2 +-
 packages/example-app-base/package.json       | 2 +-
 packages/example-component/package.json      | 2 +-
 packages/office-ui-fabric-react/package.json | 4 ++--
 packages/styling/package.json                | 2 +-
 8 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 2291be45467a2..2c01b4bb54056 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.8.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.8.2 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 0be82ea981d12..53db4cb24d9e9 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.8.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.8.2 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 36a97c7f6b4e0..a014349f8be22 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.8.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.8.2 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index ed1967e833624..503930dede637 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.8.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.8.2 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index b16ed8990cb85..16f161a9e2e04 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -40,7 +40,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.10.2 <1.0.0",
+    "@uifabric/styling": ">=0.10.3 <1.0.0",
     "@uifabric/utilities": ">=4.3.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 79391319a2ca3..94d07fa07c45e 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.8.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.8.2 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 04d65d6a3feb3..1eab8bb118bc1 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.8.1",
+  "version": "4.8.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.3.0 <5.0.0",
-    "@uifabric/styling": ">=0.10.2 <1.0.0",
+    "@uifabric/styling": ">=0.10.3 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 4ab5c4797373b..1808d1849c324 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.10.2",
+  "version": "0.10.3",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 44f70367f345a8bdb2515b3847f8577548318154 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Sat, 17 Jun 2017 17:39:43 +0000
Subject: [PATCH 0131/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 .../fix-icon-images_2017-06-17-16-55.json     | 11 -----------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++++-
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/CHANGELOG.json               |  6 ++++++
 packages/styling/CHANGELOG.md                 |  7 ++++++-
 packages/styling/package.json                 |  2 +-
 10 files changed, 45 insertions(+), 19 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/fix-icon-images_2017-06-17-16-55.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 2c01b4bb54056..0629f6de44c06 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.8.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.8.3 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-icon-images_2017-06-17-16-55.json b/common/changes/office-ui-fabric-react/fix-icon-images_2017-06-17-16-55.json
deleted file mode 100644
index 4b6f7c81bfeeb..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-icon-images_2017-06-17-16-55.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Icon: image icons now have less random \"l\" characters. Sorry about that!",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 16f161a9e2e04..75df956651dd8 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -40,7 +40,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.10.3 <1.0.0",
+    "@uifabric/styling": ">=0.10.4 <1.0.0",
     "@uifabric/utilities": ">=4.3.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 94d07fa07c45e..d96b006241481 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.8.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.8.3 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 3e6b14b1caa0a..8ac20a3aca0f2 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.8.3",
+      "tag": "office-ui-fabric-react_v4.8.3",
+      "date": "Sat, 17 Jun 2017 17:39:43 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "5b17bfe13dc1826f08c2fb261d53de4e976d0752",
+            "comment": "Icon: image icons now have less random \"l\" characters. Sorry about that!"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.10.3 <1.0.0` to `>=0.10.4 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.8.1",
       "tag": "office-ui-fabric-react_v4.8.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 1c512ef713b1e..4d024ead25d60 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Sat, 17 Jun 2017 06:27:45 GMT and should not be manually modified.
+This log was last generated on Sat, 17 Jun 2017 17:39:43 GMT and should not be manually modified.
+
+## 4.8.3
+Sat, 17 Jun 2017 17:39:43 GMT
+
+### Patches
+
+- Icon: image icons now have less random "l" characters. Sorry about that!
 
 ## 4.8.1
 Sat, 17 Jun 2017 06:27:45 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 1eab8bb118bc1..ca23bf793754f 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.8.2",
+  "version": "4.8.3",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.3.0 <5.0.0",
-    "@uifabric/styling": ">=0.10.3 <1.0.0",
+    "@uifabric/styling": ">=0.10.4 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index e77a61c60fe4c..c0bfb84c006db 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.10.4",
+      "tag": "@uifabric/styling_v0.10.4",
+      "date": "Sat, 17 Jun 2017 17:39:43 GMT",
+      "comments": {}
+    },
     {
       "version": "0.10.2",
       "tag": "@uifabric/styling_v0.10.2",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index ce2999d32cadb..f19122587e268 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Sat, 17 Jun 2017 06:27:45 GMT and should not be manually modified.
+This log was last generated on Sat, 17 Jun 2017 17:39:43 GMT and should not be manually modified.
+
+## 0.10.4
+Sat, 17 Jun 2017 17:39:43 GMT
+
+*Changes not tracked*
 
 ## 0.10.2
 Sat, 17 Jun 2017 06:27:45 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 1808d1849c324..be4586fe52d85 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.10.3",
+  "version": "0.10.4",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From a3eeb9c5d81864d031c743587695941b227ae3bf Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sun, 18 Jun 2017 12:47:49 -0700
Subject: [PATCH 0132/1641] Adding jsx single tslint rule.

---
 packages/office-ui-fabric-react-tslint/tslint.json | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react-tslint/tslint.json b/packages/office-ui-fabric-react-tslint/tslint.json
index 1ce8cc1f7b45d..8e45fd95963bc 100644
--- a/packages/office-ui-fabric-react-tslint/tslint.json
+++ b/packages/office-ui-fabric-react-tslint/tslint.json
@@ -21,7 +21,8 @@
     "prefer-const": false,
     "quotemark": [
       true,
-      "single"
+      "single",
+      "jsx-single"
     ],
     "no-inferrable-types": [
       true,

From 1ca8cda27da8bf1243f2d794a917e8d6154ceade Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Mon, 19 Jun 2017 11:02:58 -0700
Subject: [PATCH 0133/1641] Breadcrumb resizegroup refactor (#2000)

* Breadcrumb: Use resize group and support inline width breadcrumbs

* Cleanup state, move aria-owns to button

* Add change file

* Fixed linting errors

* Updated with spreads, and added comments to onReduceData

* Remove unused import
---
 ...resizegroup-refactor_2017-06-15-18-00.json |  11 +
 .../components/Breadcrumb/Breadcrumb.Props.ts |   8 +-
 .../src/components/Breadcrumb/Breadcrumb.tsx  | 189 +++++-------------
 .../components/Breadcrumb/BreadcrumbPage.tsx  |  21 +-
 .../examples/Breadcrumb.Basic.Example.tsx     |   6 +-
 .../examples/Breadcrumb.Static.Example.tsx    |  44 ++++
 .../src/components/Button/BaseButton.tsx      |   2 +
 7 files changed, 132 insertions(+), 149 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/breadcrumb-resizegroup-refactor_2017-06-15-18-00.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/breadcrumb-resizegroup-refactor_2017-06-15-18-00.json b/common/changes/office-ui-fabric-react/breadcrumb-resizegroup-refactor_2017-06-15-18-00.json
new file mode 100644
index 0000000000000..95978ee589450
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/breadcrumb-resizegroup-refactor_2017-06-15-18-00.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Breadcrumb: Switch resizing logic to resizeGroup",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.Props.ts b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.Props.ts
index e591df61afa48..1af740dade522 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.Props.ts
@@ -1,7 +1,7 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
-import { Breadcrumb } from './Breadcrumb';
+import { Breadcrumb, IBreadCrumbData } from './Breadcrumb';
 import { IRenderFunction } from '../../Utilities';
 
 export interface IBreadcrumb {
@@ -34,6 +34,12 @@ export interface IBreadcrumbProps extends React.Props<Breadcrumb> {
   /** Method to call when trying to render an item. */
   onRenderItem?: IRenderFunction<IBreadcrumbItem>;
 
+  /**
+   * Method to call when reducing the length of the breadcrumb.
+   * Return undefined to never reduce breadcrumb length
+   */
+  onReduceData?: (data: IBreadCrumbData) => IBreadCrumbData | undefined;
+
   /**
    * Aria label to place on the navigation landmark for breadcrumb
    */
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
index 25967ca1a609b..e914990ca2bae 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
@@ -3,76 +3,81 @@ import {
   BaseComponent,
   autobind,
   css,
-  getId,
   getRTL
 } from '../../Utilities';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
-import { ContextualMenu } from '../../ContextualMenu';
 import { Link } from '../../Link';
 import { Icon } from '../../Icon';
 import { IconButton } from '../../Button';
 import { IBreadcrumbProps, IBreadcrumbItem } from './Breadcrumb.Props';
 import { DirectionalHint } from '../../common/DirectionalHint';
+import { ResizeGroup } from '../../ResizeGroup';
 
 import * as stylesImport from './Breadcrumb.scss';
 const styles: any = stylesImport;
 
-export interface IBreadcrumbState {
-  isOverflowOpen: boolean;
-  overflowAnchor?: HTMLElement;
-  renderedItems?: IBreadcrumbItem[];
-  renderedOverflowItems?: IBreadcrumbItem[];
+export interface IBreadCrumbData {
+  props: IBreadcrumbProps;
+  renderedItems: IBreadcrumbItem[];
+  renderedOverflowItems: IBreadcrumbItem[];
 }
 
 const OVERFLOW_KEY = 'overflow';
-const OVERFLOW_WIDTH = 44;
 
-export class Breadcrumb extends BaseComponent<IBreadcrumbProps, IBreadcrumbState> {
+export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
   public static defaultProps: IBreadcrumbProps = {
     items: [],
     maxDisplayedItems: 999
   };
 
-  public refs: {
-    [key: string]: React.ReactInstance;
-    renderingArea: HTMLElement;
-  };
-
-  private _breadcrumbItemWidths: { [key: string]: number };
   private _id: string;
 
   constructor(props: IBreadcrumbProps) {
     super(props);
-
-    this._id = getId('Breadcrumb');
-    this.state = this._getStateFromProps(props);
   }
 
-  public componentDidMount() {
-    this._updateItemMeasurements();
-    this._updateRenderedItems();
-
-    this._events.on(window, 'resize', this._updateRenderedItems);
-  }
+  public render() {
+    let { onReduceData = this._onReduceData } = this.props;
+    let breadCrumbData: IBreadCrumbData = {
+      props: this.props,
+      renderedItems: this.props.items.slice(0, this.props.maxDisplayedItems),
+      renderedOverflowItems: this.props.items.slice(this.props.maxDisplayedItems + 1)
+    };
 
-  public componentWillReceiveProps(nextProps: IBreadcrumbProps) {
-    this.setState(this._getStateFromProps(nextProps));
-    this._breadcrumbItemWidths = null;
+    return (
+      <ResizeGroup
+        onRenderData={ this._onRenderBreadcrumb }
+        onReduceData={ onReduceData }
+        data={ breadCrumbData }
+      />
+    );
   }
 
-  public componentDidUpdate(prevProps: IBreadcrumbProps, prevStates: IBreadcrumbState) {
-    if (!this._breadcrumbItemWidths) {
-      this._updateItemMeasurements();
-      this._updateRenderedItems();
+  @autobind
+  private _onReduceData(data: IBreadCrumbData): IBreadCrumbData | undefined {
+    let { renderedItems, renderedOverflowItems } = data;
+    let movedItem = renderedItems[renderedItems.length - 1];
+    renderedItems = renderedItems.slice(0, -1);
+    renderedOverflowItems = [...renderedOverflowItems, movedItem];
+
+    if (movedItem !== undefined) {
+      return { ...data, renderedItems, renderedOverflowItems };
     }
   }
 
-  public render() {
-    let { className, ariaLabel } = this.props;
-    let { isOverflowOpen, overflowAnchor, renderedItems, renderedOverflowItems } = this.state;
-    let overflowMenuId = this._id + '-overflow';
-
-    let { onRenderItem = this._onRenderItem } = this.props;
+  @autobind
+  private _onRenderBreadcrumb(data: IBreadCrumbData) {
+    let { className, ariaLabel, items, onRenderItem = this._onRenderItem } = data.props;
+    let { renderedOverflowItems, renderedItems } = data;
+
+    let contextualItems = renderedOverflowItems.map(
+      (item, index) => ({
+        name: item.text,
+        key: item.key,
+        onClick: item.onClick ? this._onBreadcrumbClicked.bind(this, item) : null,
+        href: item.href
+      })
+    );
 
     return (
       <div
@@ -83,22 +88,25 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, IBreadcrumbState
       >
         <FocusZone direction={ FocusZoneDirection.horizontal } >
           <ol className={ css('ms-Breadcrumb-list', styles.list) }>
-            { renderedOverflowItems && renderedOverflowItems.length ? (
+            { renderedOverflowItems && renderedOverflowItems.length && (
               <li className={ css('ms-Breadcrumb-overflow', styles.overflow) } key={ OVERFLOW_KEY } ref={ OVERFLOW_KEY }>
                 <IconButton
                   className={ css('ms-Breadcrumb-overflowButton', styles.overflowButton) }
                   iconProps={ { iconName: 'more' } }
-                  onClick={ this._onOverflowClicked }
                   role='button'
                   aria-haspopup='true'
-                  aria-owns={ isOverflowOpen ? overflowMenuId : null }
+                  menuIconProps={ { iconName: null } }
+                  menuProps={ {
+                    items: contextualItems,
+                    directionalHint: DirectionalHint.bottomLeftEdge
+                  } }
                 />
                 <Icon
                   className={ css('ms-Breadcrumb-chevron', styles.chevron) }
                   iconName={ getRTL() ? 'ChevronLeft' : 'ChevronRight' }
                 />
               </li>
-            ) : (null) }
+            ) }
             { renderedItems.map(
               (item, index) => (
                 <li className={ css('ms-Breadcrumb-listItem', styles.listItem) } key={ item.key || String(index) } ref={ item.key || String(index) }>
@@ -110,22 +118,6 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, IBreadcrumbState
               )) }
           </ol>
         </FocusZone>
-        { isOverflowOpen ? (
-          <ContextualMenu
-            targetElement={ overflowAnchor }
-            isBeakVisible={ true }
-            items={ renderedOverflowItems.map(
-              (item, index) => ({
-                name: item.text,
-                key: item.key,
-                onClick: item.onClick ? this._onBreadcrumbClicked.bind(this, item) : null,
-                href: item.href
-              })
-            ) }
-            id={ overflowMenuId }
-            directionalHint={ DirectionalHint.bottomLeftEdge }
-            onDismiss={ this._onOverflowDismissed } />
-        ) : (null) }
       </div>
     );
   }
@@ -156,93 +148,10 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, IBreadcrumbState
     }
   }
 
-  @autobind
-  private _onOverflowClicked(ev: React.MouseEvent<HTMLButtonElement>) {
-    this.setState({
-      'isOverflowOpen': !this.state.isOverflowOpen,
-      'overflowAnchor': ev.currentTarget as HTMLElement
-    });
-  }
-
-  @autobind
-  private _onOverflowDismissed(ev: React.MouseEvent<HTMLElement>) {
-    this.setState({
-      'isOverflowOpen': false,
-      'overflowAnchor': null
-    });
-  }
-
   @autobind
   private _onBreadcrumbClicked(item: IBreadcrumbItem, ev: React.MouseEvent<HTMLElement>) {
     if (item.onClick) {
       item.onClick(ev, item);
     }
-    this.setState({
-      'isOverflowOpen': false
-    });
   }
-
-  private _updateItemMeasurements() {
-    let { items } = this.props;
-
-    if (!this._breadcrumbItemWidths) {
-      this._breadcrumbItemWidths = {};
-    }
-
-    for (let i = 0; i < items.length; i++) {
-      let item = items[i];
-
-      if (!this._breadcrumbItemWidths[item.key]) {
-        let el = this.refs[item.key] as HTMLElement;
-
-        this._breadcrumbItemWidths[item.key] = el.getBoundingClientRect().width;
-      }
-    }
-  }
-
-  private _updateRenderedItems() {
-    let { items, maxDisplayedItems } = this.props;
-    let renderingArea = this.refs.renderingArea;
-    let renderedItems = [];
-    let renderedOverflowItems = [].concat(items);
-    let consumedWidth = 0;
-
-    let style = window.getComputedStyle(renderingArea);
-    let availableWidth = renderingArea.clientWidth - parseInt(style.marginLeft, 10) - parseInt(style.marginRight, 10);
-
-    availableWidth -= OVERFLOW_WIDTH;
-
-    let i;
-    let minIndex = Math.max(0, renderedOverflowItems.length - maxDisplayedItems);
-
-    for (i = renderedOverflowItems.length - 1; i >= minIndex; i--) {
-      let item = renderedOverflowItems[i];
-      let itemWidth = this._breadcrumbItemWidths[item.key];
-
-      if ((consumedWidth + itemWidth) >= availableWidth) {
-        break;
-      } else {
-        consumedWidth += itemWidth;
-      }
-    }
-
-    renderedItems = renderedOverflowItems.splice(i + 1);
-
-    this.setState({
-      isOverflowOpen: this.state.isOverflowOpen,
-      overflowAnchor: this.state.overflowAnchor,
-      renderedItems: renderedItems,
-      renderedOverflowItems: renderedOverflowItems,
-    });
-  }
-
-  private _getStateFromProps(nextProps: IBreadcrumbProps) {
-    return {
-      isOverflowOpen: false,
-      overflowAnchor: null,
-      renderedItems: nextProps.items || [],
-      renderedOverflowItems: null
-    };
-  }
-
 }
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx
index 98158a5f58cae..c386afa82933b 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx
@@ -7,10 +7,14 @@ import {
 } from '@uifabric/example-app-base';
 
 import { BreadcrumbBasicExample } from './examples/Breadcrumb.Basic.Example';
+import { BreadcrumbStaticExample } from './examples/Breadcrumb.Static.Example';
 
 const BreadcrumbBasicExampleCode = require(
   '!raw-loader!office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx'
 ) as string;
+const BreadcrumbStaticExampleCode = require(
+  '!raw-loader!office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx'
+) as string;
 
 export class BreadcrumbPage extends React.Component<IComponentDemoPageProps, any> {
   public render() {
@@ -19,11 +23,18 @@ export class BreadcrumbPage extends React.Component<IComponentDemoPageProps, any
         title='Breadcrumb'
         componentName='BreadcrumbExample'
         exampleCards={
-          <ExampleCard
-            title='Simple breadcrumb'
-            code={ BreadcrumbBasicExampleCode }>
-            <BreadcrumbBasicExample />
-          </ExampleCard>
+          <div>
+            <ExampleCard
+              title='Simple breadcrumb'
+              code={ BreadcrumbBasicExampleCode }>
+              <BreadcrumbBasicExample />
+            </ExampleCard>
+            <ExampleCard
+              title='Static width'
+              code={ BreadcrumbStaticExampleCode }>
+              <BreadcrumbStaticExample />
+            </ExampleCard>
+          </div>
         }
         propertiesTables={
           <PropertiesTableSet
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
index 972ddeabe0f6f..bfb687cc0b565 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
@@ -28,8 +28,8 @@ export class BreadcrumbBasicExample extends React.Component<any, any> {
             { text: 'This is folder 4', 'key': 'f4', onClick: this._onBreadcrumbItemClicked },
             { text: 'This is folder 5', 'key': 'f5', onClick: this._onBreadcrumbItemClicked, isCurrentItem: true },
           ] }
-          maxDisplayedItems={ 3 } 
-          ariaLabel={'Website breadcrumb'} />
+          maxDisplayedItems={ 6 }
+          ariaLabel={ 'Website breadcrumb' } />
         <Breadcrumb
           items={ [
             { text: 'Files', 'key': 'Files', href: '#/examples/breadcrumb', onClick: this._onBreadcrumbItemClicked },
@@ -40,7 +40,7 @@ export class BreadcrumbBasicExample extends React.Component<any, any> {
             { text: 'This is link 5', 'key': 'l5', href: '#/examples/breadcrumb', onClick: this._onBreadcrumbItemClicked, isCurrentItem: true },
           ] }
           maxDisplayedItems={ 3 }
-          ariaLabel={'Website breadcrumb'} />
+          ariaLabel={ 'Website breadcrumb' } />
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx
new file mode 100644
index 0000000000000..370ecd765cbe0
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx
@@ -0,0 +1,44 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+import {
+  Breadcrumb, IBreadcrumbItem
+} from 'office-ui-fabric-react/lib/Breadcrumb';
+
+import {
+  autobind
+} from '../../../Utilities';
+
+import { Link } from 'office-ui-fabric-react/lib/Link';
+
+export class BreadcrumbStaticExample extends React.Component<any, any> {
+  constructor() {
+    super();
+  }
+
+  public render() {
+    return (
+      <div style={ { display: 'inline-block' } }>
+        <Breadcrumb
+          items={ [
+            { text: 'Files', 'key': 'Files', onClick: this._onBreadcrumbItemClicked },
+            { text: 'This is folder 1', 'key': 'f1', onClick: this._onBreadcrumbItemClicked },
+            { text: 'This is folder 2', 'key': 'f2', onClick: this._onBreadcrumbItemClicked },
+            { text: 'This is folder 3', 'key': 'f3', onClick: this._onBreadcrumbItemClicked },
+            { text: 'This is folder 4', 'key': 'f4', onClick: this._onBreadcrumbItemClicked },
+            { text: 'This is folder 5', 'key': 'f5', onClick: this._onBreadcrumbItemClicked, isCurrentItem: true },
+          ] }
+          // Returning undefined to OnReduceData tells the breadcrumb not to shrink
+          onReduceData={ (data) => undefined }
+          maxDisplayedItems={ 3 }
+          ariaLabel={ 'Website breadcrumb' } />
+      </div>
+    );
+  }
+
+  @autobind
+  private _onBreadcrumbItemClicked(ev: React.MouseEvent<HTMLElement>, item: IBreadcrumbItem) {
+    console.log(`Breadcrumb item with key "${item.key}" has been clicked.`);
+  }
+
+}
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 7df5a61c45cd6..70becadf431c6 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -139,6 +139,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         {
           'onClick': this._onToggleMenu,
           'aria-expanded': this.state.menuProps ? true : false,
+          'aria-owns': this.state.menuProps ? this._labelId + '-menu' : null,
           'aria-haspopup': true
         }
       );
@@ -319,6 +320,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     return (
       <ContextualMenu
         isBeakVisible={ true }
+        id={ this._labelId + '-menu' }
         directionalHint={ DirectionalHint.bottomLeftEdge }
         {...menuProps}
         className={ mergeStyles('ms-BaseButton-menuhost', menuProps.className) as string }

From f2fc34eb2f92b7d4241fdb4171e5f521f5b1730a Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Mon, 19 Jun 2017 14:53:11 -0700
Subject: [PATCH 0134/1641] New Component: ComboBox (#1920)

* Add ComboBox functionality

* Make a fix for IE where non-allowFreeform is showing the keypresses...

* Update the PR with code review feedback. Simplified the code a lot, decoupled the shared props/memebers from comboBox and Dropdown, and extended BaseAutoFill which allowed DynamicAutoFill to be removed

* Fixing some build warnings

* Update my example page to explicitly not use two mutually exclusive props

* The npm-shrinkwrap.json file automatically updated... commiting

* Had a bad copy paste, fixing up the incorrectly logic

* Removing the fontFamily aspect of the comboBox and utilizing the onRenderOption instead. The fontFamily aspect was too specific for the generic comboBox

* Update based on feedback

* Jspurlin jspurlin/combo box (#2)

* Enable no implicit any in the utilities package (#1970)

* Fix no implicit anys in utilities package.

* Rush change

* Reverse all shrinkwrap changes except the typings one.

* Fix bundle minification to exclude debug warnings. (#1973)

* Updating shrinkwrap, rush, and making minify build have production flag to remove debug code.

* Updates.

* removing lockfile.

* dropping to 7. Moving back to npm run build.

* Downgrading rush.

* Applying package updates.

* Website: Update dev.office.com header (#1966)

* Use Fabric Core 7.1.0 for the website

* Adjust position of caret's in header so that they spin around central axis

* Update to latest icon font from dev.office.com for header and move outside out :global{} to fix build issue

* Remove a u- prefix that was missed earlier

* Update dev.office.com header with the latest navigation links

* Add change file

* Make sure the quote rule is enabled for tsline (#1961)

* With responsive mode error (#1956)

* withResponsiveMode: Adding error handling around the case where window.innerWidth throws an exception

* adding change log file

* Create withResponsiveMode.tsx

* New Component: Stepper (#1759)

* First step at stepper implementation.

* Add first implementation of stepper.

* Add functionality to stepper

* Refine the Stepper class and add tests

* let's make sure to put focus back on the text field when submitting via enter

* Added documentation to Stepper.

* Add flexibility to current stepper implementation.

* Modified example implementations.

* Add aria-valuemax.

* Change Stepper to SpinButton.

* Add example with unit.

* Implement color scheme in the ContextualMenu control to enable alternative theming.

* Improvements to SpinButton.

* Fix increment function calls.

* Add new width optional parameter.

* Add label direction.

* Fix border.

* Add Position enum.

* `defaultValue` is now the deciding prop for using the default implementation or not.

* onBlur is now onValidate.

* Fix tests.

* Fix warnings.

* Add implementation for labelGap.

* Put some polish on the styling, added some icon support, and added some more example spinButtons

* Implement the bar and unit tests and component page

* Add the ability for the spinButton buttons to look pressed when spinning via keyboard

* Revert "Implement color scheme in the ContextualMenu control to enable alternative theming."

This reverts commit 4f830cd8c55269368e73bfc6d0cd69430776b977.

* Don't render an empty icon for an icon-less header menu item.

* Revert "Implement Document Title Bar"

* update some CSS for high contrast in ff and use css utility instead of concatenating string classnames

* Fix quotation issue

* Fix Spin Button properties table.

* Fix Spin Button example code

* Use iconProps instead of string

* Extracted `spinning` out of state

* Add autobind instead of manually binding private functions to this

* Change `+` syntax for more explicit `Number()`

* Remove unnecessary cast

* Fix typos

* `incrementButtonIcon` and `decrementButtonIcon` are now IIconProps

* Add KeyboardSpinDirection enum

* Fix test description

* Fix SpinButton tests

* Remove unused onChange callback from SpinButton

* Revert onChange

* Remove old Stepper.ts file

* Use module css instead of global

* Fix missing word in comment

* Callback functions now allow for void return (state to be updated outside)

* Use `_async` instead of window

* Fix minor rendering issue with browser zoom

* Rename `_spinning` to `_spinningByMouse` for clarity

* Fix tests

* Fix extra space before label

* Remove width outside of SpinButton component and fix styling

* Add more tests to SpinButton

* Fix SpinButton documentation

* Fix typo

* Fix AppDefinition for SpinButton and Spinner

* Add missing documentation to SpinButton title prop

* Various SpinButton fixes

* Fix SpinButton path for properties

* Fix SpinButton styling issues

* Remove labelGap property from SpinButton

* merge some changes

* merge changes

* merge

* Fix a new tslint warning after npm installing

* Fixing some casing warnings npm start was angry about

* Removing an extra line that got added with the last push

* Create SelectableOption.ts

* Create SelectableOption.ts

* Create ComboBox.Props.ts

* Create ComboBox.test.tsx

* Create ComboBox.Basic.Example.tsx

* Create Dropdown.Props.ts

* Fix the case sensitivity issue

* one more casing issue

* changing the reference of utilities in the test file

* Actually it look like it has to be pascalCase here

* ... really... what's going on with the casing here

* Address feedback from in person review with David

* A few minor updated to remove uneeded comment and unneeded try/finally in tests

* Fix up a typo and fix up to use consistent syntax on a few lines
---
 .../src/components/App/AppState.tsx           |    9 +-
 .../Components/ComboBoxComponentPage.tsx      |   33 +
 ...e-update-header_2017-06-09-19-15.json~HEAD |   11 +
 ...n~b0ee1f6c9e5f0d9b31c060d92998e0c43af504d4 |   11 +
 common/config/rush/npm-shrinkwrap.json        |   78 +-
 .../office-ui-fabric-react/src/ComboBox.ts    |    1 +
 .../src/SelectableOption.ts                   |    1 +
 .../src/VisualTestState.ts                    |    1 +
 .../src/components/ComboBox/ComboBox.Props.ts |   59 +
 .../src/components/ComboBox/ComboBox.scss     |  255 ++++
 .../src/components/ComboBox/ComboBox.test.tsx |  284 ++++
 .../src/components/ComboBox/ComboBox.tsx      | 1214 +++++++++++++++++
 .../ComboBox/ComboBox.visualtest.ts           |   29 +
 .../src/components/ComboBox/ComboBoxPage.tsx  |   59 +
 .../ComboBox/ComboBoxPage.visualtest.tsx      |   29 +
 .../examples/ComboBox.Basic.Example.scss      |   15 +
 .../examples/ComboBox.Basic.Example.tsx       |  234 ++++
 .../src/components/ComboBox/index.ts          |    2 +
 .../src/components/Dropdown/Dropdown.Props.ts |  124 +-
 .../src/components/Dropdown/Dropdown.tsx      |    5 +-
 .../pickers/AutoFill/BaseAutoFill.Props.ts    |   23 +
 .../pickers/AutoFill/BaseAutoFill.tsx         |   42 +-
 .../src/demo/AppDefinition.tsx                |    6 +
 packages/office-ui-fabric-react/src/index.ts  |    1 +
 .../SelectableDroppableText.Props.ts          |   93 ++
 .../SelectableOption.Props.ts                 |   35 +
 .../src/utilities/selectableOption/index.ts   |    2 +
 27 files changed, 2493 insertions(+), 163 deletions(-)
 create mode 100644 apps/fabric-website/src/pages/Components/ComboBoxComponentPage.tsx
 create mode 100644 common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json~HEAD
 create mode 100644 common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json~b0ee1f6c9e5f0d9b31c060d92998e0c43af504d4
 create mode 100644 packages/office-ui-fabric-react/src/ComboBox.ts
 create mode 100644 packages/office-ui-fabric-react/src/SelectableOption.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.visualtest.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.visualtest.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ComboBox/index.ts
 create mode 100644 packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.Props.ts
 create mode 100644 packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableOption.Props.ts
 create mode 100644 packages/office-ui-fabric-react/src/utilities/selectableOption/index.ts

diff --git a/apps/fabric-website/src/components/App/AppState.tsx b/apps/fabric-website/src/components/App/AppState.tsx
index f722bddac0cfe..0dd406fae4d74 100644
--- a/apps/fabric-website/src/components/App/AppState.tsx
+++ b/apps/fabric-website/src/components/App/AppState.tsx
@@ -129,6 +129,13 @@ export const AppState: IAppState = {
           component: () => <LoadingComponent title='ColorPicker' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/ColorPickerComponentPage').ColorPickerComponentPage))
         },
+        {
+          title: 'ComboBox',
+          url: '#/components/ComboBox',
+          component: () => <LoadingComponent title='ComboBox' />,
+          getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/ComboBoxComponentPage').ComboBoxComponentPage))
+
+        },
         {
           title: 'CommandBar',
           url: '#/components/commandbar',
@@ -401,4 +408,4 @@ export const AppState: IAppState = {
       getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Interstitials/FabricIOSPage').FabricIOSPage))
     }
   ]
-};
+};
\ No newline at end of file
diff --git a/apps/fabric-website/src/pages/Components/ComboBoxComponentPage.tsx b/apps/fabric-website/src/pages/Components/ComboBoxComponentPage.tsx
new file mode 100644
index 0000000000000..dd4467690c113
--- /dev/null
+++ b/apps/fabric-website/src/pages/Components/ComboBoxComponentPage.tsx
@@ -0,0 +1,33 @@
+import * as React from 'react';
+import { ComboBoxPage } from 'office-ui-fabric-react/lib/components/ComboBox/ComboBoxPage';
+import { PageHeader } from '../../components/PageHeader/PageHeader';
+import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+
+export class ComboBoxComponentPage extends React.Component<any, any> {
+  public render() {
+    return (
+      <div ref='pageElement'>
+        <ComponentPage>
+          <PageHeader pageTitle='ComboBox' backgroundColor='#038387'
+            links={
+              [
+                {
+                  'text': 'Overview',
+                  'location': 'Overview'
+                },
+                {
+                  'text': 'Variants',
+                  'location': 'Variants'
+                },
+                {
+                  'text': 'Implementation',
+                  'location': 'Implementation'
+                }
+              ]
+            } />
+          <ComboBoxPage isHeaderVisible={ false } />
+        </ComponentPage>
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json~HEAD b/common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json~HEAD
new file mode 100644
index 0000000000000..ca46d03d32883
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json~HEAD
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Fix issues with dev.office.com header",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "miwhea@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json~b0ee1f6c9e5f0d9b31c060d92998e0c43af504d4 b/common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json~b0ee1f6c9e5f0d9b31c060d92998e0c43af504d4
new file mode 100644
index 0000000000000..ca46d03d32883
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json~b0ee1f6c9e5f0d9b31c060d92998e0c43af504d4
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Fix issues with dev.office.com header",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "miwhea@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 3ee4a00cd0fa4..0067e2978da41 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -570,9 +570,9 @@
       "integrity": "sha1-DldYaol/ddjdDAKdKVtBapg4f5w=",
       "dependencies": {
         "@microsoft/api-extractor": {
-          "version": "2.0.7",
-          "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.0.7.tgz",
-          "integrity": "sha1-zmAg7skaKVy1JlmXu58gIqmBPWk="
+          "version": "2.0.8",
+          "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.0.8.tgz",
+          "integrity": "sha1-MbnfuwRtx2MYLgVQ+1shCD40nXA="
         },
         "@microsoft/gulp-core-build-sass": {
           "version": "3.1.2",
@@ -605,9 +605,9 @@
           "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
         },
         "clean-css": {
-          "version": "4.1.3",
-          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.3.tgz",
-          "integrity": "sha1-B8/omA7bINRV3cI6rc8eBMblCc4="
+          "version": "4.1.4",
+          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.4.tgz",
+          "integrity": "sha1-7siBHbJ0V+AHjYypIfqBty+oK/Q="
         },
         "configstore": {
           "version": "3.1.0",
@@ -1648,14 +1648,14 @@
       }
     },
     "@uifabric/styling": {
-      "version": "0.7.4",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.7.4.tgz",
-      "integrity": "sha512-MzIyq7vk6crRTWATfj8ryESGwZApt9RlFIScPkAFy8MBIvLhWP3Rc0H3/TrgjEYgIjDph+DybjmW/9aXlq3jLg=="
+      "version": "0.8.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.8.1.tgz",
+      "integrity": "sha512-7uldSHBNLP8dNfYg7W54WKTvLLqL9phUNkKUCxAIsXDpqx405ffk3QDVb2hos77Rc8bbNdujfk8IaXuUV/8Oyw=="
     },
     "@uifabric/utilities": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.2.0.tgz",
-      "integrity": "sha512-eB9YLGf1hDFXV0Uq8+FoaHi13aLOvDAVHFSnqoIMnlAa1Q+3bODmpifwGcxRiP8WzqhRKlZKt4boK6iF6uQnOg=="
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.3.0.tgz",
+      "integrity": "sha512-/4/xTLAJBtdYb+ohwWYPeusSiNlUCigPWlD5nkq+uAjGW/vkT/TDJXuCQasrb9QaV6wmgF6GDLzzZMykz5w0Tg=="
     },
     "abbrev": {
       "version": "1.0.9",
@@ -2302,9 +2302,9 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000684",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000684.tgz",
-      "integrity": "sha1-maywEYuP0f3WAaFeDA8t/BWoFoA="
+      "version": "1.0.30000686",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000686.tgz",
+      "integrity": "sha1-1VtHntbmQCwf0/H9j0bmlNhupGQ="
     },
     "capture-stack-trace": {
       "version": "1.0.0",
@@ -2443,9 +2443,16 @@
       "integrity": "sha1-4+JbIHrE5wGvch4staFnksrD3Fg="
     },
     "clone-deep": {
-      "version": "0.2.4",
-      "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-0.2.4.tgz",
-      "integrity": "sha1-TnPdCen7lxzDhnDF3O2cGJZIHMY="
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-0.3.0.tgz",
+      "integrity": "sha1-NIxhrpzb4O3+BT2R/0zFIdeQ7eg=",
+      "dependencies": {
+        "for-own": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/for-own/-/for-own-1.0.0.tgz",
+          "integrity": "sha1-xjMy9BXO3EsE2/5wz4NklMU8tEs="
+        }
+      }
     },
     "clone-stats": {
       "version": "0.0.1",
@@ -5551,14 +5558,14 @@
       "integrity": "sha1-1zvD/0SJQkCIGM5gm/P7DqfvTrc=",
       "dependencies": {
         "clean-css": {
-          "version": "4.1.3",
-          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.3.tgz",
-          "integrity": "sha1-B8/omA7bINRV3cI6rc8eBMblCc4="
+          "version": "4.1.4",
+          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.4.tgz",
+          "integrity": "sha1-7siBHbJ0V+AHjYypIfqBty+oK/Q="
         },
         "uglify-js": {
-          "version": "3.0.15",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.15.tgz",
-          "integrity": "sha1-qssyOoRrI0YCJw3q2KMkQaiAb0I="
+          "version": "3.0.17",
+          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.17.tgz",
+          "integrity": "sha1-0ijNVcLfmz0vU/FHVoy0zEpyzAY="
         }
       }
     },
@@ -7353,9 +7360,9 @@
       "integrity": "sha1-6mJvqUURirroSrsZc45KCLCHPx8="
     },
     "office-ui-fabric-react": {
-      "version": "4.5.1",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.5.1.tgz",
-      "integrity": "sha512-lPeE/wgI9C/ryKpaQGTQRvo/1txgoFs5/g6i5kBEMc41DDVj7ZMXW2kgPER6dtV9Ku1IYqcJSNwi/KP1a07KvA=="
+      "version": "4.7.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.7.0.tgz",
+      "integrity": "sha512-X/FHLjmUEgipp/BucZVFmw3x59DV3clKS5SDenFK9J4uQErHiXpS4OBRLs/gUgyxnrS5Xzu/CJk8hyp+I+LuEQ=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -8601,9 +8608,9 @@
       }
     },
     "sass-loader": {
-      "version": "6.0.5",
-      "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-6.0.5.tgz",
-      "integrity": "sha1-qEeRDzZEKqVsWYWHnVTrUZ4koyg=",
+      "version": "6.0.6",
+      "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-6.0.6.tgz",
+      "integrity": "sha512-c3/Zc+iW+qqDip6kXPYLEgsAu2lf4xz0EZDplB7EmSUMda12U1sGJPetH55B/j9eu0bTtKzKlNPWWyYC7wFNyQ==",
       "dependencies": {
         "async": {
           "version": "2.4.1",
@@ -8614,6 +8621,11 @@
           "version": "1.1.0",
           "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
           "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
+        },
+        "pify": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
+          "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY="
         }
       }
     },
@@ -9596,9 +9608,9 @@
       "integrity": "sha1-BMgamb3V3FImPqKdJMa/jUgYpLs="
     },
     "uglify-js": {
-      "version": "2.8.28",
-      "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.8.28.tgz",
-      "integrity": "sha512-WqKNbmNJKzIdIEQu/U2ytgGBbhCy2PVks94GoetczOAJ/zCgVu2CuO7gguI5KPFGPtUtI1dmPQl6h0D4cPzypA==",
+      "version": "2.8.29",
+      "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.8.29.tgz",
+      "integrity": "sha1-KcVzMUgFe7Th913zW3qcty5qWd0=",
       "dependencies": {
         "camelcase": {
           "version": "1.2.1",
diff --git a/packages/office-ui-fabric-react/src/ComboBox.ts b/packages/office-ui-fabric-react/src/ComboBox.ts
new file mode 100644
index 0000000000000..c9b81e057c5f2
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/ComboBox.ts
@@ -0,0 +1 @@
+export * from './components/ComboBox/index';
diff --git a/packages/office-ui-fabric-react/src/SelectableOption.ts b/packages/office-ui-fabric-react/src/SelectableOption.ts
new file mode 100644
index 0000000000000..ec2ae3d50cbd7
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/SelectableOption.ts
@@ -0,0 +1 @@
+export * from './utilities/selectableOption/index';
diff --git a/packages/office-ui-fabric-react/src/VisualTestState.ts b/packages/office-ui-fabric-react/src/VisualTestState.ts
index 9dde96a3b2871..e434f34dfe53a 100644
--- a/packages/office-ui-fabric-react/src/VisualTestState.ts
+++ b/packages/office-ui-fabric-react/src/VisualTestState.ts
@@ -8,6 +8,7 @@ export const VisualTestState: IVisualTestState = {
     './Button/ButtonPage.visualtest',
     './Checkbox/CheckboxPage.visualtest',
     './ChoiceGroup/ChoiceGroupPage.visualtest',
+    './ComboBox/ComboBoxPage.visualtest',
     './CommandBar/CommandBarPage.visualtest',
     './ContextualMenu/ContextualMenuPage.visualtest',
     './DetailsList/DetailsListPage.visualtest',
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
new file mode 100644
index 0000000000000..2a56e8860f64b
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
@@ -0,0 +1,59 @@
+import { IIconProps } from '../../Icon';
+import { ISelectableOption } from '../../utilities/selectableOption/SelectableOption.Props';
+import { ISelectableDroppableTextProps } from '../../utilities/selectableOption/SelectableDroppableText.Props';
+
+export interface IComboBox {
+  /**
+ * Sets focus to the input in the comboBox
+ * @returns True if focus could be set, false if no operation was taken.
+ */
+  focus(): boolean;
+}
+
+export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox> {
+  /**
+   * Optional callback to access the IComboBox interface. Use this instead of ref for accessing
+   * the public methods and properties of the component.
+   */
+  componentRef?: (component: IComboBox) => void;
+
+  /**
+   * Collection of options for this ComboBox
+   */
+  options?: ISelectableOption[];
+
+  /**
+   * Callback issues when either:
+   * 1) the selected option changes
+   * 2) a manually edited value is submitted. In this case there may not be a matched option if allowFreeform is also true
+   *    (and hence only value would be true, the other parameter would be null in this case)
+   */
+  onChanged?: (option?: ISelectableOption, index?: number, value?: string) => void;
+
+  /**
+   * Callback issued when the options should be resolved, if they have been updated or
+   * if they need to be passed in the first time
+   */
+  onResolveOptions?: (options: ISelectableOption[]) => ISelectableOption[] | PromiseLike<ISelectableOption[]>;
+
+  /**
+   * Whether the ComboBox is free form, meaning that the user input is not bound to provided items. Defaults to false.
+   */
+  allowFreeform?: boolean;
+
+  /**
+   * Whether the ComboBox auto completes. As the user is inputing text, it will be suggested potential matches from the list of items. If
+   * the combo box is expanded, this will also scroll to the suggested item, and give it a selected style. Defaults to false.
+   */
+  autoComplete?: boolean;
+
+  /**
+   * Value to show in the input, does not have to map to a combobox option
+   */
+  value?: string;
+
+  /**
+   * The IconProps to use for the button aspect of the combobox
+   */
+  buttonIconProps?: IIconProps;
+}
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.scss b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.scss
new file mode 100644
index 0000000000000..f0d015f3c55ad
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.scss
@@ -0,0 +1,255 @@
+@import '../../common/common';
+
+// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
+
+//
+// Office UI Fabric
+// --------------------------------------------------
+// ComboBox styles
+
+$ComboBox-selectedItem-bg: $ms-color-neutralQuaternaryAlt;
+$ComboBox-selectedItem-hover-bg: $ms-color-neutralLighter;
+$ComboBox-height: 32px;
+$ComboBox-caretDown-width: 32px;
+$ComboBox-item-height: 36px;
+
+// Mixin for high contrast mode link states
+@mixin highContrastListItemState {
+  @media screen and (-ms-high-contrast: active) {
+    background-color: $ms-color-contrastBlackSelected;
+    border-color: $ms-color-contrastBlackSelected;
+    color: $ms-color-black;
+
+    &:focus {
+      border-color: $ms-color-black;
+    }
+  }
+
+  @media screen and (-ms-high-contrast: black-on-white) {
+    background-color: $ms-color-contrastWhiteSelected;
+    border-color: $ms-color-contrastWhiteSelected;
+    color: $ms-color-white;
+  }
+
+  @include highContrastAdjust();
+}
+
+.root {
+  @include ms-normalize;
+  @include ms-font-m;
+  color: $ms-color-neutralPrimary;
+
+  margin-bottom: 10px;
+  position: relative;
+  outline: 0;
+  user-select: none;
+  background: $ms-color-white;
+  border: 1px solid $ms-color-neutralTertiaryAlt;
+  cursor: text ;
+  display: block;
+  height: $ComboBox-height;
+  line-height: $ComboBox-height - 2px; // height minus the border
+  @include padding(0, $ComboBox-caretDown-width, 0, 0);
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+
+
+
+  &:hover,
+  &.focused {
+    &.wrapper
+      {
+        border-color: $ms-color-themePrimary;
+
+        @media screen and (-ms-high-contrast: active) {
+          color: $ms-color-contrastBlackSelected;
+        }
+
+        @media screen and (-ms-high-contrast: black-on-white) {
+          color: $ms-color-contrastWhiteSelected;
+        }
+    }
+
+    &.readOnly {
+      .caretDown {
+        background-color: inherit;
+      }
+    }
+  }
+
+  &.wrapperForError {
+      border-color: $ms-color-error;
+  }
+
+  :global(.ms-Label) {
+    display: inline-block;
+    margin-bottom: 8px;
+  }
+}
+
+//== State: A disabled ComboBox
+.root.rootIsDisabled {
+  &.wrapper,
+  .input,
+  .caretDown {
+    background-color: $ms-color-neutralLighter;
+    border-color: $ms-color-neutralLighter;
+    color: $ms-color-neutralTertiary;
+    cursor: default;
+
+    @media screen and (-ms-high-contrast: active) {
+      border-color: $ms-color-contrastBlackDisabled;
+      color: $ms-color-contrastBlackDisabled;
+    }
+
+    @media screen and (-ms-high-contrast: black-on-white) {
+      border-color: $ms-color-contrastWhiteDisabled;
+      color: $ms-color-contrastWhiteDisabled;
+    }
+  }
+}
+
+.input {
+  box-sizing: border-box;
+  width: 100%;
+  height: 100%;
+  border: none;
+  outline: none;
+  font: inherit;
+  text-overflow: ellipsis;
+  padding-left: 12px;
+
+}
+
+.caretDown {
+  color: $ms-color-neutralDark;
+  font-size: $ms-icon-size-s;
+  position: absolute;
+  height: $ComboBox-height;
+  line-height: $ComboBox-height - 2px; // height minus the border
+  width: $ComboBox-caretDown-width;
+  text-align: center;
+  cursor: default;
+
+  &:hover{
+    background-color: $ms-color-neutralQuaternaryAlt;
+  }
+
+  &:active{
+    background-color: $ms-color-neutralTertiaryAlt;
+  }
+}
+
+.callout {
+  box-shadow: 0 0px 5px 0px rgba(0, 0, 0, 0.4);
+  border: 1px solid $ms-color-neutralLight;
+}
+
+.errorMessage{
+    color: $ms-color-error;
+  &::before {
+    content: '* ';
+  }
+}
+
+.items {
+  display: block;
+}
+
+// Container for the ComboBox items, displayed as a panel on small screens.
+.item {
+  background: transparent;
+  box-sizing: border-box;
+  cursor: pointer;
+  display: block;
+  width: 100%;
+  height: auto;
+  min-height: $ComboBox-item-height;
+  line-height: 20px;
+  padding: 5px 16px;
+  position: relative;
+  border: 1px solid transparent;
+  word-wrap: break-word;
+  overflow-wrap: break-word;
+  text-align: left;
+
+  @media screen and (-ms-high-contrast: active) {
+    border-color: $ms-color-black;
+  }
+
+  @media screen and (-ms-high-contrast: black-on-white) {
+    border-color: $ms-color-white;
+  }
+
+  &:hover {
+    background-color: $ComboBox-selectedItem-hover-bg;
+    color: $ms-color-black;
+
+    @include highContrastListItemState;
+  }
+
+  @include focus-border();
+
+  &:focus {
+    background-color: $ms-color-neutralLighter;
+  }
+
+  &:active {
+    background-color: $ComboBox-selectedItem-hover-bg;
+    color: $ms-color-black;
+  }
+
+  &.itemIsDisabled {
+    background: $ms-color-white;
+    color: $ms-color-neutralTertiary;
+    cursor: default;
+  }
+  :global(.ms-Button-flexContainer) {
+    justify-content: flex-start;
+  }
+}
+
+// A selected ComboBox item
+.item.itemIsSelected {
+  background-color: $ComboBox-selectedItem-bg;
+  color: $ms-color-black;
+
+  &:hover {
+    background-color: $ComboBox-selectedItem-bg;
+  }
+
+  @include focus-border();
+
+  @include highContrastListItemState;
+}
+
+.header {
+  @include ms-font-m;
+  font-weight: $ms-font-weight-semibold;
+  color: $ms-color-themePrimary;
+  background: none;
+  border: none;
+  height: $ComboBox-item-height;
+  line-height: $ComboBox-item-height;
+  cursor: default;
+  padding: 0px 16px;
+  user-select: none;
+  @include text-align(left);
+}
+
+.divider {
+  height: 1px;
+  background-color: $dividerColor;
+}
+
+.optionText {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  min-width: 0px;
+  max-width: 100%;
+  word-wrap: break-word;
+  overflow-wrap: break-word;
+  margin: 1px;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
new file mode 100644
index 0000000000000..e9be6876e1ad2
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
@@ -0,0 +1,284 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+/* tslint:enable:no-unused-variable */
+import * as ReactTestUtils from 'react-addons-test-utils';
+import { mount, shallow } from 'enzyme';
+import { KeyCodes } from '../../Utilities';
+let { expect } = chai;
+
+import { ComboBox } from './ComboBox';
+import { ISelectableOption } from '../../utilities/selectableOption/SelectableOption.Props';
+
+const DEFAULT_OPTIONS: ISelectableOption[] = [
+  { key: '1', text: '1' },
+  { key: '2', text: '2' },
+  { key: '3', text: '3' }
+];
+
+const DEFAULT_OPTIONS2: ISelectableOption[] = [
+  { key: '1', text: 'One' },
+  { key: '2', text: 'Foo' },
+  { key: '3', text: 'Bar' }
+];
+
+describe('ComboBox', () => {
+
+  it('Can flip between enabled and disabled.', () => {
+    let wrapper = shallow(
+      <ComboBox
+        label='testgroup'
+        options={ DEFAULT_OPTIONS }
+      />);
+    let comboBoxRoot = wrapper.find('.ms-ComboBox');
+
+    expect(comboBoxRoot.find('.is-disabled').length).equals(0, `shouldn't be disabled`);
+    expect(comboBoxRoot.find('[data-is-interactable=true]').length).equals(1, 'data-is-focusable="true"');
+
+    wrapper = shallow(
+      <ComboBox
+        disabled={ true }
+        label='testgroup'
+        options={ DEFAULT_OPTIONS }
+      />);
+    comboBoxRoot = wrapper.find('.ms-ComboBox');
+
+    expect(comboBoxRoot.find('.is-disabled').length).equals(1, `should be disabled`);
+    expect(comboBoxRoot.find('[data-is-interactable=false]').length).equals(1, 'data-is-focusable="false"');
+  });
+
+  it('Renders no selected item in default case', () => {
+
+    let wrapper = mount(
+      <ComboBox
+        label='testgroup'
+        options={ DEFAULT_OPTIONS }
+      />);
+    let comboBoxRoot = wrapper.find('.ms-ComboBox');
+    let inputElement = comboBoxRoot.find('[role="combobox"]');
+
+    expect(inputElement.text()).equals('');
+  });
+
+  it('Renders a selected item in uncontrolled case', () => {
+    let wrapper = mount(
+      <ComboBox
+        label='testgroup'
+        defaultSelectedKey='1'
+        options={ DEFAULT_OPTIONS }
+      />);
+    let comboBoxRoot = wrapper.find('.ms-ComboBox');
+    let inputElement = comboBoxRoot.find('input');
+
+    expect(inputElement.props().value).equals('1');
+  });
+
+  it('Renders a selected item in controlled case', () => {
+    let wrapper = mount(
+      <ComboBox
+        label='testgroup'
+        selectedKey='1'
+        options={ DEFAULT_OPTIONS }
+      />);
+    let comboBoxRoot = wrapper.find('.ms-ComboBox');
+    let inputElement = comboBoxRoot.find('input');
+
+    expect(inputElement.props().value).equals('1');
+  });
+
+  it('Renders a default value with options', () => {
+    let wrapper = mount(
+      <ComboBox
+        label='testgroup'
+        value='1'
+        options={ DEFAULT_OPTIONS }
+      />);
+    let comboBoxRoot = wrapper.find('.ms-ComboBox');
+    let inputElement = comboBoxRoot.find('input');
+
+    expect(inputElement.props().value).equals('1');
+  });
+
+  it('Renders a default value with no options', () => {
+    let wrapper = mount(
+      <ComboBox
+        label='testgroup'
+        value='1'
+      />);
+    let comboBoxRoot = wrapper.find('.ms-ComboBox');
+    let inputElement = comboBoxRoot.find('input');
+
+    expect(inputElement.props().value).equals('1');
+  });
+
+  it('Can change items in uncontrolled case', () => {
+    let comboBoxRoot;
+    let wrapper = mount(
+      <ComboBox
+        label='testgroup'
+        defaultSelectedKey='1'
+        options={ DEFAULT_OPTIONS }
+      />);
+    comboBoxRoot = wrapper.find('.ms-ComboBox');
+    let buttonElement = comboBoxRoot.find('button');
+    buttonElement.simulate('click');
+    let secondItemElement = wrapper.getDOMNode().ownerDocument.querySelector('.ms-ComboBox-item[data-index="1"]');
+    ReactTestUtils.Simulate.click(secondItemElement);
+    let inputElement = comboBoxRoot.find('input');
+    expect(inputElement.props().value).equals('2');
+  });
+
+  it('Can insert text in uncontrolled case with autoComplete and allowFreeform on', () => {
+    let comboBoxRoot;
+    let inputElement;
+    let wrapper = mount(
+      <ComboBox
+        label='testgroup'
+        defaultSelectedKey='1'
+        options={ DEFAULT_OPTIONS2 }
+        autoComplete={ true }
+        allowFreeform={ true }
+      />);
+    comboBoxRoot = wrapper.find('.ms-ComboBox');
+    inputElement = comboBoxRoot.find('input');
+    inputElement.simulate('change', { target: { value: 'f' } });
+    inputElement = comboBoxRoot.find('input');
+    expect(inputElement.props().value).equals('Foo');
+  });
+
+  it('Can insert text in uncontrolled case with autoComplete on and allowFreeform off', () => {
+    let comboBoxRoot;
+    let inputElement;
+    let wrapper = mount(
+      <ComboBox
+        label='testgroup'
+        defaultSelectedKey='1'
+        options={ DEFAULT_OPTIONS2 }
+        autoComplete={ true }
+        allowFreeform={ false }
+      />);
+    comboBoxRoot = wrapper.find('.ms-ComboBox');
+    inputElement = comboBoxRoot.find('input');
+    inputElement.simulate('change', { target: { value: 'f' } });
+    inputElement = comboBoxRoot.find('input');
+    expect(inputElement.props().value).equals('Foo');
+  });
+
+  it('Can insert text in uncontrolled case with autoComplete off and allowFreeform on', () => {
+    let comboBoxRoot;
+    let inputElement;
+    let wrapper = mount(
+      <ComboBox
+        label='testgroup'
+        defaultSelectedKey='1'
+        options={ DEFAULT_OPTIONS2 }
+        autoComplete={ false }
+        allowFreeform={ true }
+      />);
+    comboBoxRoot = wrapper.find('.ms-ComboBox');
+    inputElement = comboBoxRoot.find('input');
+    inputElement.simulate('change', { target: { value: 'f' } });
+    inputElement = comboBoxRoot.find('input');
+    expect(inputElement.props().value).equals('f');
+  });
+
+  it('Can insert text in uncontrolled case with autoComplete and allowFreeform off', () => {
+    let comboBoxRoot;
+    let inputElement;
+    let wrapper = mount(
+      <ComboBox
+        label='testgroup'
+        defaultSelectedKey='1'
+        options={ DEFAULT_OPTIONS2 }
+        autoComplete={ false }
+        allowFreeform={ false }
+      />);
+    comboBoxRoot = wrapper.find('.ms-ComboBox');
+    inputElement = comboBoxRoot.find('input');
+    inputElement.simulate('keydown', { which: 'f' });
+    inputElement = comboBoxRoot.find('input');
+    expect(inputElement.props().value).equals('One');
+  });
+
+  it('Can change selected option with keyboard', () => {
+    let comboBoxRoot;
+    let inputElement;
+    let wrapper = mount(
+      <ComboBox
+        label='testgroup'
+        defaultSelectedKey='1'
+        options={ DEFAULT_OPTIONS2 }
+      />);
+    comboBoxRoot = wrapper.find('.ms-ComboBox');
+    inputElement = comboBoxRoot.find('input');
+    inputElement.simulate('keydown', { which: KeyCodes.down });
+    inputElement = comboBoxRoot.find('input');
+    expect(inputElement.props().value).equals('Foo');
+  });
+
+  it('Cannot insert text while disabled', () => {
+    let comboBoxRoot;
+    let inputElement;
+    let wrapper = mount(
+      <ComboBox
+        label='testgroup'
+        defaultSelectedKey='1'
+        options={ DEFAULT_OPTIONS2 }
+        disabled={ true }
+      />);
+    comboBoxRoot = wrapper.find('.ms-ComboBox');
+    inputElement = comboBoxRoot.find('input');
+    inputElement.simulate('keydown', { which: KeyCodes.a });
+    inputElement = comboBoxRoot.find('input');
+    expect(inputElement.props().value).equals('One');
+  });
+
+  it('Cannot change selected option with keyboard while disabled', () => {
+    let comboBoxRoot;
+    let inputElement;
+    let wrapper = mount(
+      <ComboBox
+        label='testgroup'
+        defaultSelectedKey='1'
+        options={ DEFAULT_OPTIONS2 }
+        disabled={ true }
+      />);
+    comboBoxRoot = wrapper.find('.ms-ComboBox');
+    inputElement = comboBoxRoot.find('input');
+    inputElement.simulate('keydown', { which: KeyCodes.down });
+    inputElement = comboBoxRoot.find('input');
+    expect(inputElement.props().value).equals('One');
+  });
+
+  it('Cannot expand the menu when clicking on the input while disabled', () => {
+    let comboBoxRoot;
+    let inputElement;
+    let wrapper = mount(
+      <ComboBox
+        label='testgroup'
+        defaultSelectedKey='1'
+        options={ DEFAULT_OPTIONS2 }
+        disabled={ true }
+      />);
+    comboBoxRoot = wrapper.find('.ms-ComboBox');
+    inputElement = comboBoxRoot.find('input');
+    inputElement.simulate('click');
+    expect(comboBoxRoot.find('.is-opened').length).equals(0, `shouldn't be opened`);
+  });
+
+  it('Cannot expand the menu when clicking on the button while disabled', () => {
+    let comboBoxRoot;
+    let buttonElement;
+    let wrapper = mount(
+      <ComboBox
+        label='testgroup'
+        defaultSelectedKey='1'
+        options={ DEFAULT_OPTIONS2 }
+        disabled={ true }
+      />);
+    comboBoxRoot = wrapper.find('.ms-ComboBox');
+    buttonElement = comboBoxRoot.find('button');
+    buttonElement.simulate('click');
+    expect(comboBoxRoot.find('.is-opened').length).equals(0, `shouldn't be opened`);
+  });
+});
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
new file mode 100644
index 0000000000000..bc7e5e8748c47
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -0,0 +1,1214 @@
+import * as React from 'react';
+import { IComboBoxProps } from './ComboBox.Props';
+import { DirectionalHint } from '../../common/DirectionalHint';
+import { Callout } from '../../Callout';
+import { Label } from '../../Label';
+import {
+  CommandButton,
+  IconButton
+} from '../../Button';
+import { BaseAutoFill } from '../pickers/AutoFill/BaseAutoFill';
+import { IBaseAutoFillProps } from '../pickers/AutoFill/BaseAutoFill.Props';
+import {
+  autobind,
+  BaseComponent,
+  css,
+  divProperties,
+  findIndex,
+  getId,
+  getNativeProps,
+  KeyCodes
+} from '../../Utilities';
+import { ISelectableOption, SelectableOptionMenuItemType } from '../../utilities/selectableOption/SelectableOption.Props';
+import * as stylesImport from './ComboBox.scss';
+const styles: any = stylesImport;
+
+export interface IComboBoxState {
+
+  // The open state
+  isOpen?: boolean;
+
+  // The currently selected index (-1 if no index is selected)
+  selectedIndex?: number;
+
+  // The focused state of the comboBox
+  focused?: boolean;
+
+  // This value is used for the autocomplete hint value
+  suggestedDisplayValue?: string;
+
+  // The options currently available for the callout
+  currentOptions?: ISelectableOption[];
+
+  // when taking input, this will store the index the
+  // that the options input matches (-1 if no input or match)
+  currentPendingValueValidIndex?: number;
+
+  // when taking input, this will store
+  // the actual text that is being entered
+  currentPendingValue: string;
+}
+
+enum SearchDirection {
+  backward = -1,
+  none = 0,
+  forward = 1
+}
+
+export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
+
+  public static defaultProps = {
+    options: [],
+    allowFreeform: false,
+    autoComplete: true,
+    buttonIconProps: { iconName: 'chevronDown' }
+  };
+
+  public refs: {
+    [key: string]: React.ReactInstance,
+    root: HTMLElement
+  };
+
+  // The input aspect of the comboBox
+  private _comboBox: BaseAutoFill;
+
+  // The wrapping div of the input and button
+  private _comboBoxWrapper: HTMLDivElement;
+
+  // The callout element
+  private _comboBoxMenu: HTMLElement;
+
+  // The menu item element that is currently selected
+  private _selectedElement: HTMLElement;
+
+  // The base id for the comboBox
+  private _id: string;
+
+  // This is used to clear any pending autocomplete
+  // text (used when autocomplete is true and allowFreeform is false)
+  private readonly _readOnlyPendingAutoCompleteTimeout: number = 1000 /* ms */;
+
+  // After a character is inserted when autocomplete is true and
+  // allowFreeform is false, remember the task that will clear
+  // the pending string of characters
+  private _lastReadOnlyAutoCompleteChangeTimeoutId: number;
+
+  // Promise used when resolving the comboBox options
+  private _currentPromise: PromiseLike<ISelectableOption[]>;
+
+  // The current visible value sent to the auto fill on render
+  private _currentVisibleValue;
+
+  constructor(props?: IComboBoxProps) {
+    super(props);
+
+    this._warnMutuallyExclusive({
+      'defaultSelectedKey': 'selectedKey',
+      'value': 'defaultSelectedKey',
+      'selectedKey': 'value'
+    });
+
+    this._id = props.id || getId('ComboBox');
+
+    let selectedKey = props.defaultSelectedKey !== undefined ? props.defaultSelectedKey : props.selectedKey;
+    this._lastReadOnlyAutoCompleteChangeTimeoutId = -1;
+
+    let index: number = this._getSelectedIndex(props.options, selectedKey);
+
+    this.state = {
+      isOpen: false,
+      selectedIndex: index,
+      focused: false,
+      suggestedDisplayValue: '',
+      currentOptions: this.props.options,
+      currentPendingValueValidIndex: -1,
+      currentPendingValue: ''
+    };
+  }
+
+  public componentDidMount() {
+    // hook up resolving the options if needed on focus
+    this._events.on(this._comboBoxWrapper, 'focus', this._onResolveOptions, true);
+  }
+
+  public componentWillReceiveProps(newProps: IComboBoxProps) {
+    // In controlled component usage where selectedKey is provided, update the selectedIndex
+    // and currentOptions state if the key or options change
+    if (newProps.selectedKey !== undefined &&
+      (newProps.selectedKey !== this.props.selectedKey || newProps.options !== this.props.options)) {
+      let index: number = this._getSelectedIndex(newProps.options, newProps.selectedKey);
+      this.setState({
+        selectedIndex: index,
+        currentOptions: newProps.options
+      });
+    }
+  }
+
+  public componentDidUpdate(prevProps: IComboBoxProps, prevState: IComboBoxState) {
+    let {
+      allowFreeform
+    } = this.props;
+    let {
+      isOpen,
+      focused,
+      selectedIndex
+    } = this.state;
+
+    // If we are open, make sure the currently
+    // selected option is scrolled into view
+    if (isOpen) {
+      this._scrollIntoView();
+    }
+
+    // If we are open or we are focused but are not the activeElement,
+    // set focus on the input
+    if (isOpen || (focused && document.activeElement !== this._comboBox.inputElement)) {
+      this.focus();
+    }
+
+    // If we just opened/closed the menu OR
+    // updated the selectedIndex with the menu closed OR
+    // we are focused and are not allowing freeform
+    // we need to fix up focus and set selection
+    if (prevState.isOpen !== isOpen ||
+      (!isOpen && prevState.selectedIndex !== selectedIndex) ||
+      (!allowFreeform && focused)) {
+      this._select();
+    }
+  }
+
+  public componentWillUnmount() {
+    super.componentWillUnmount();
+
+    // remove the eventHanlder that was added in componentDidMount
+    this._events.off(this._comboBoxWrapper);
+  }
+
+  // Primary Render
+  public render() {
+    let id = this._id;
+    let {
+      className,
+      label,
+      disabled,
+      ariaLabel,
+      required,
+      errorMessage,
+      onRenderContainer = this._onRenderContainer,
+      allowFreeform,
+      autoComplete,
+      buttonIconProps
+    } = this.props;
+    let { isOpen, selectedIndex, focused, suggestedDisplayValue } = this.state;
+    this._currentVisibleValue = this._getVisibleValue();
+
+    let divProps = getNativeProps(this.props, divProperties);
+
+    return (
+      <div {...divProps } ref='root' className={ css('ms-ComboBox-container') }>
+        { label && (
+          <Label id={ id + '-label' } required={ required } htmlFor={ id }>{ label }</Label>
+        ) }
+        <div
+          ref={ this._resolveRef('_comboBoxWrapper') }
+          id={ id + 'wrapper' }
+          className={
+            css('ms-ComboBox', styles.wrapper,
+              (errorMessage && errorMessage.length > 0 ? styles.wrapperForError : null),
+              styles.root, className, {
+                'is-open': isOpen,
+                ['is-disabled ' + styles.rootIsDisabled]: disabled,
+                'is-required ': required,
+                [styles.focused]: focused,
+                [styles.readOnly]: !allowFreeform
+              }
+            )
+          } >
+          <BaseAutoFill
+            data-is-interactable={ !disabled }
+            ref={ this._resolveRef('_comboBox') }
+            id={ id + '-input' }
+            className={ css('ms-ComboBox-Input', styles.input) }
+            type='text'
+            key={ selectedIndex }
+            onFocus={ this._select }
+            onBlur={ this._onBlur }
+            onKeyDown={ this._onInputKeyDown }
+            onKeyUp={ this._onInputKeyUp }
+            onClick={ allowFreeform ? this.focus : this._onComboBoxClick }
+            onInputValueChange={ this._onInputChange }
+            aria-expanded={ isOpen }
+            aria-autocomplete={ (!disabled && autoComplete) }
+            role='combobox'
+            aria-readonly={ ((allowFreeform || disabled) ? null : 'true') }
+            readOnly={ disabled || !allowFreeform }
+            aria-labelledby={ (label && (id + '-label')) }
+            aria-label={ ((ariaLabel && !label) && ariaLabel) }
+            aria-describedby={ (id + '-option') }
+            aria-activedescendant={ (isOpen && selectedIndex >= 0 ? (id + '-list' + selectedIndex) : null) }
+            aria-disabled={ disabled }
+            aria-owns={ (id + '-list') }
+            spellCheck={ false }
+            defaultVisibleValue={ this._currentVisibleValue }
+            suggestedDisplayValue={ suggestedDisplayValue }
+            updateValueInWillReceiveProps={ this._onUpdateValueInAutoFillWillReceiveProps }
+            shouldSelectFullInputValueInComponentDidUpdate={ this._onShouldSelectFullInputValueInAutoFillComponentDidUpdate } />
+          <IconButton
+            className={ css('ms-ComboBox-Button', styles.caretDown) }
+            role='presentation'
+            aria-hidden='true'
+            tabIndex={ -1 }
+            onClick={ this._onComboBoxClick }
+            iconProps={ buttonIconProps }
+            disabled={ disabled } />
+        </div>
+
+        { isOpen && (
+          onRenderContainer({ ...this.props }, this._onRenderContainer)
+        ) }
+        {
+          errorMessage &&
+          <div
+            className={ css(styles.errorMessage) }>
+            { errorMessage }
+          </div>
+        }
+      </div>
+    );
+  }
+
+  /**
+   * Set focus on the input
+   */
+  @autobind
+  public focus() {
+    if (this._comboBox) {
+      this._comboBox.focus();
+    }
+  }
+
+  /**
+   * componentWillReceiveProps handler for the auto fill component
+   * Checks/updates the iput value to set, if needed
+   * @param {IBaseAutoFillProps} defaultVisibleValue - the defaultVisibleValue that got passed
+   *  in to the auto fill's componentWillReceiveProps
+   * @returns {string} - the updated value to set, if needed
+   */
+  @autobind
+  private _onUpdateValueInAutoFillWillReceiveProps(): string {
+    if (this._comboBox === null || this._comboBox === undefined) {
+      return null;
+    }
+
+    if (this._currentVisibleValue && this._currentVisibleValue !== '' && this._comboBox.value !== this._currentVisibleValue) {
+      return this._currentVisibleValue;
+    }
+
+    return this._comboBox.value;
+  }
+
+  /**
+   * componentDidUpdate handler for the auto fill component
+   *
+   * @param { string } defaultVisibleValue - the current defaultVisibleValue in the auto fill's componentDidUpdate
+   * @param { string } suggestedDisplayValue - the current suggestedDisplayValue in the auto fill's componentDidUpdate
+   * @returns {boolean} - should the full value of the input be selected?
+   * True if the defaultVisibleValue equals the suggestedDisplayValue, false otherwise
+   */
+  @autobind
+  private _onShouldSelectFullInputValueInAutoFillComponentDidUpdate(): boolean {
+    return this._currentVisibleValue === this.state.suggestedDisplayValue;
+  }
+
+  /**
+   * Get the correct value to pass to the input
+   * to show to the user based off of the current props and state
+   * @returns {string} the value to pass to the input
+   */
+  @autobind
+  private _getVisibleValue(): string {
+    let {
+      value,
+      allowFreeform,
+      autoComplete
+    } = this.props;
+    let {
+      selectedIndex,
+      currentPendingValueValidIndex,
+      currentOptions,
+      currentPendingValue,
+      suggestedDisplayValue
+    } = this.state;
+
+    // If the user passed is a value prop, use that
+    if (value) {
+      return value;
+    }
+
+    let index = selectedIndex;
+
+    if (allowFreeform) {
+
+      // If we are allowing freeform and autocomplete is also true
+      // and we've got a pending value that matches an option, remember
+      // the matched option's index
+      if (autoComplete && this._indexWithinBounds(currentOptions, currentPendingValueValidIndex)) {
+        index = currentPendingValueValidIndex;
+      }
+
+      // Since we are allowing freeform, if there is currently a nonempty pending value, use that
+      // otherwise use the index determined above (falling back to '' if we did not get a valid index)
+      return currentPendingValue !== '' ? currentPendingValue :
+        (this._indexWithinBounds(currentOptions, index) ? currentOptions[index].text : '');
+    } else {
+
+      // If we are not allowing freeform and have a
+      // valid index that matches the pending value,
+      // we know we will need some version of the pending value
+      if (this._indexWithinBounds(currentOptions, currentPendingValueValidIndex)) {
+
+        // If autoComplete is on, return the
+        // raw pending value, otherwise remember
+        // the matched option's index
+        if (autoComplete) {
+          return currentPendingValue;
+        }
+
+        index = currentPendingValueValidIndex;
+      }
+
+      // If we have a valid index then return the text value of that option,
+      // otherwise return the suggestedDisplayValue
+      return this._indexWithinBounds(currentOptions, index) ? currentOptions[index].text : suggestedDisplayValue;
+    }
+  }
+
+  /**
+   * Is the index within the bounds of the array?
+   * @param options - options to check if the index is valid for
+   * @param index - the index to check
+   * @returns {boolean} - true if the index is valid for the given options, false otherwise
+   */
+  private _indexWithinBounds(options: ISelectableOption[], index: number): boolean {
+    return index >= 0 && index < options.length;
+  }
+
+  /**
+   * Handler for typing changes on the input
+   * @param updatedValue - the newly changed value
+   */
+  @autobind
+  private _onInputChange(updatedValue: string) {
+    if (this.props.disabled) {
+      this._handleInputWhenDisabled(null /* event */);
+      return;
+    }
+
+    this.props.allowFreeform ?
+      this._processInputChangeWithFreeform(updatedValue) :
+      this._processInputChangeWithoutFreeform(updatedValue);
+  }
+
+  /**
+   * Process the new input's new value when the comboBox
+   * allows freeform entry
+   * @param updatedValue - the input's newly changed value
+   */
+  private _processInputChangeWithFreeform(updatedValue: string) {
+    let {
+      currentOptions
+    } = this.state;
+
+    // if the new value is empty, nothing needs to be done
+    if (updatedValue === '') {
+      return;
+    }
+
+    // Remember the original value and then,
+    // make the value lowercase for comparison
+    let originalUpdatedValue: string = updatedValue;
+    updatedValue = updatedValue.toLocaleLowerCase();
+
+    let newSuggestedDisplayValue = '';
+    let newCurrentPendingValueValidIndex = -1;
+
+    // If autoComplete is on, attempt to find a match from the available options
+    if (this.props.autoComplete) {
+
+      // If autoComplete is on, attempt to find a match where the text of an option starts with the updated value
+      let items = currentOptions.map((item, index) => { return { ...item, index }; }).filter((option) => option.itemType !== SelectableOptionMenuItemType.Header && option.itemType !== SelectableOptionMenuItemType.Divider).filter((option) => option.text.toLocaleLowerCase().indexOf(updatedValue) === 0);
+      if (items.length > 0) {
+        // If the user typed out the complete option text, we don't need any suggested display text anymore
+        newSuggestedDisplayValue = items[0].text.toLocaleLowerCase() !== updatedValue ? items[0].text : '';
+
+        // remember the index of the match we found
+        newCurrentPendingValueValidIndex = items[0].index;
+      }
+    } else {
+
+      // If autoComplete is off, attempt to find a match only when the value is exactly equal to the text of an option
+      let items = currentOptions.map((item, index) => { return { ...item, index }; }).filter((option) => option.itemType !== SelectableOptionMenuItemType.Header && option.itemType !== SelectableOptionMenuItemType.Divider).filter((option) => option.text.toLocaleLowerCase() === updatedValue);
+
+      // if we fould a match remember the index
+      if (items.length === 1) {
+        newCurrentPendingValueValidIndex = items[0].index;
+      }
+    }
+
+    // Set the updated state
+    this._setPendingInfo(originalUpdatedValue, newCurrentPendingValueValidIndex, newSuggestedDisplayValue);
+  }
+
+  /**
+   * Process the new input's new value when the comboBox
+   * does not allow freeform entry
+   * @param updatedValue - the input's newly changed value
+   */
+  private _processInputChangeWithoutFreeform(updatedValue: string) {
+    let {
+      currentPendingValue,
+      currentPendingValueValidIndex,
+      currentOptions,
+      selectedIndex
+    } = this.state;
+
+    if (this.props.autoComplete) {
+
+      // If autoComplete is on while allow freeform is off,
+      // we will remember the keypresses and build up a string to attempt to match
+      // as long as characters are typed within a the timeout span of each other,
+      // otherwise we will clear the string and start building a new one on the next keypress.
+      // Also, only do this processing if we have a non-empty value
+      if (updatedValue !== '') {
+
+        // If we have a pending autocomplete clearing task,
+        // we know that the user is typing with keypresses happening
+        // within the timeout of each other so remove the clearing task
+        // and continue building the pending value with the udpated value
+        if (this._lastReadOnlyAutoCompleteChangeTimeoutId > 0) {
+          this._async.clearTimeout(this._lastReadOnlyAutoCompleteChangeTimeoutId);
+          this._lastReadOnlyAutoCompleteChangeTimeoutId = -1;
+          updatedValue = currentPendingValue + updatedValue;
+        }
+
+        let originalUpdatedValue: string = updatedValue;
+        updatedValue = updatedValue.toLocaleLowerCase();
+
+        // If autoComplete is on, attempt to find a match where the text of an option starts with the updated value
+        let items = currentOptions.map((item, index) => { return { ...item, index }; }).filter((option) => option.itemType !== SelectableOptionMenuItemType.Header && option.itemType !== SelectableOptionMenuItemType.Divider).filter((option) => option.text.toLocaleLowerCase().indexOf(updatedValue) === 0);
+
+        // If we found a match, udpdate the state
+        if (items.length > 0) {
+          this._setPendingInfo(originalUpdatedValue, items[0].index, items[0].text);
+        }
+
+        // Schedule a timeout to clear the pending value after the timeout span
+        this._lastReadOnlyAutoCompleteChangeTimeoutId =
+          this._async.setTimeout(
+            () => { this._lastReadOnlyAutoCompleteChangeTimeoutId = -1; },
+            this._readOnlyPendingAutoCompleteTimeout
+          );
+        return;
+      }
+    }
+
+    // If we get here, either autoComplete is on or we did not find a match with autoComplete on.
+    // Remember we are not allowing freeform, so at this point, if we have a pending valid value index
+    // use that; otherwise use the selectedIndex
+    let index = currentPendingValueValidIndex >= 0 ? currentPendingValueValidIndex : selectedIndex;
+
+    // Since we are not allowing freeform, we need to
+    // set both the pending and suggested values/index
+    // to allow us to select all content in the input to
+    // give the illusion that we are readonly (e.g. freeform off)
+    this._setPendingInfoFromIndex(index);
+  }
+
+  /**
+   * Walk along the options starting at the index, stepping by the delta (positive or negative)
+   * looking for the next valid selectable index (e.g. skipping headings and dividers)
+   * @param index - the index to get the next selectable index from
+   * @param delta - optional delta to step by when finding the next index, defaults to 0
+   * @returns {number} - the next valid selectable index. If the new index is outside of the bounds,
+   * it will snap to the edge of the options array. If delta == 0 and the given index is not selectable
+   */
+  private _getNextSelectableIndex(index: number, searchDirection: SearchDirection): number {
+    let { currentOptions } = this.state;
+
+    let newIndex = index + searchDirection;
+
+    newIndex = Math.max(0, Math.min(currentOptions.length - 1, newIndex));
+
+    let option: ISelectableOption = currentOptions[newIndex];
+
+    // attempt to skip headers and dividers
+    if ((option.itemType === SelectableOptionMenuItemType.Header ||
+      option.itemType === SelectableOptionMenuItemType.Divider)) {
+
+      // Should we continue looking for an index to select?
+      if (searchDirection !== SearchDirection.none &&
+        ((newIndex !== 0 && searchDirection < SearchDirection.none) ||
+          (newIndex !== currentOptions.length - 1 && searchDirection > SearchDirection.none))) {
+        newIndex = this._getNextSelectableIndex(newIndex, searchDirection);
+      } else {
+        // If we cannot perform a useful search just return the index we were given
+        return index;
+      }
+    }
+
+    // We have the next valid selectable index, return it
+    return newIndex;
+  }
+
+  /**
+   * Set the selected index. Note, this is
+   * the "real" selected index, not the pending selected index
+   * @param index - the index to set (or the index to set from if a search direction is provided)
+   * @param searchDirection - the direction to search along the options from the given index
+   */
+  private _setSelectedIndex(index: number, searchDirection: SearchDirection = SearchDirection.none) {
+    let { onChanged } = this.props;
+    let { selectedIndex, currentOptions } = this.state;
+
+    // Find the next selectable index, if searchDirection is none
+    // we will get our starting index back
+    index = this._getNextSelectableIndex(index, searchDirection);
+
+    // Are we at a new index? If so, update the state, otherwise
+    // there is nothing to do
+    if (index !== selectedIndex) {
+      let option: ISelectableOption = currentOptions[index];
+
+      // Set the selected option
+      this.setState({
+        selectedIndex: index
+      });
+
+      // Did the creator give us an onChanged callback?
+      if (onChanged) {
+        onChanged(option, index);
+      }
+
+      // if we have a new selected index,
+      // clear all of the pending info
+      this._clearPendingInfo();
+    }
+  }
+
+  /**
+   * Focus (and select) the content of the input
+   * and set the focused state
+   */
+  @autobind
+  private _select() {
+    this._comboBox.inputElement.select();
+
+    if (!this.state.focused) {
+      this.setState({ focused: true });
+    }
+  }
+
+  /**
+   * Callback issued when the options should be resolved, if they have been updated or
+   * if they need to be passed in the first time. This only does work if an onResolveOptions
+   * callback was passed in
+   */
+  @autobind
+  private _onResolveOptions() {
+    if (this.props.onResolveOptions) {
+
+      // get the options
+      let newOptions = this.props.onResolveOptions({ ...this.state.currentOptions });
+
+      // Check to see if the returned value is an array, if it is update the state
+      // If the returned value is not an array then check to see if it's a promise or PromiseLike. If it is then resolve it asynchronously.
+      if (Array.isArray(newOptions)) {
+        this.setState({
+          currentOptions: newOptions
+        });
+      } else if (newOptions && newOptions.then) {
+
+        // Ensure that the promise will only use the callback if it was the most recent one
+        // and update the state when the promise returns
+        let promise: PromiseLike<ISelectableOption[]> = this._currentPromise = newOptions;
+        promise.then((newOptionsFromPromise: ISelectableOption[]) => {
+          if (promise === this._currentPromise) {
+            this.setState({
+              currentOptions: newOptionsFromPromise
+            });
+          }
+        });
+      }
+    }
+  }
+
+  /**
+   * OnBlur handler. Set the focused state to false
+   * and submit any pending value
+   */
+  @autobind
+  private _onBlur() {
+    if (this.state.focused) {
+      this.setState({ focused: false });
+      this._submitPendingValue();
+    }
+  }
+
+  /**
+   * Submit a pending value if there is one
+   */
+  private _submitPendingValue() {
+    let {
+      onChanged,
+      allowFreeform
+    } = this.props;
+    let {
+      currentPendingValue,
+      currentPendingValueValidIndex,
+      currentOptions
+    } = this.state;
+
+    // If we allow freeform and we have a pending value, we
+    // need to handle that
+    if (allowFreeform && currentPendingValue !== '') {
+
+      // Check to see if the user typed an exact match
+      if (currentPendingValueValidIndex >= 0) {
+        let pendingOptionText: string = currentOptions[currentPendingValueValidIndex].text.toLocaleLowerCase();
+
+        // By exact match, that means: our pending value is the same as the the pending option text OR
+        // the peding option starts with the pending value and we have an "autoComplete" selection
+        // where the total lenght is equal to pending option length; update the state
+        if (currentPendingValue.toLocaleLowerCase() === pendingOptionText ||
+          (pendingOptionText.indexOf(currentPendingValue.toLocaleLowerCase()) === 0 &&
+            this._comboBox.isValueSelected &&
+            currentPendingValue.length + (this._comboBox.selectionEnd - this._comboBox.selectionStart) === pendingOptionText.length)) {
+          this._setSelectedIndex(currentPendingValueValidIndex);
+          this._clearPendingInfo();
+          return;
+        }
+      }
+
+      // Create a new option
+      let newOption: ISelectableOption = { key: currentPendingValue, text: currentPendingValue };
+      let newOptions: ISelectableOption[] = [...currentOptions, newOption];
+      let newSelectedIndex: number = this._getSelectedIndex(newOptions, currentPendingValue);
+
+      this.setState({
+        currentOptions: newOptions,
+        selectedIndex: newSelectedIndex
+      });
+
+      if (onChanged) {
+        onChanged(null, null, currentPendingValue);
+      }
+    } else if (currentPendingValueValidIndex >= 0) {
+      // Since we are not allowing freeform, we must have a matching
+      // to be able to update state
+      this._setSelectedIndex(currentPendingValueValidIndex);
+    }
+
+    // Finally, clear the pending info
+    this._clearPendingInfo();
+  }
+
+  // Render Callout container and pass in list
+  @autobind
+  private _onRenderContainer(props: IComboBoxProps): JSX.Element {
+    let {
+      onRenderList = this._onRenderList,
+      calloutProps
+    } = props;
+
+    return (
+      <Callout
+        isBeakVisible={ false }
+        gapSpace={ 0 }
+        doNotLayer={ false }
+        directionalHint={ DirectionalHint.bottomLeftEdge }
+        directionalHintFixed={ true }
+        { ...calloutProps }
+        className={ css('ms-ComboBox-callout', styles.callout, calloutProps ? calloutProps.className : undefined) }
+        targetElement={ this._comboBoxWrapper }
+        onDismiss={ this._onDismiss }
+        setInitialFocus={ false }
+      >
+        <div ref={ this._resolveRef('_comboBoxMenu') } style={ { width: this._comboBoxWrapper.clientWidth - 2 } }>
+          { onRenderList({ ...props }, this._onRenderList) }
+        </div>
+      </Callout>
+    );
+  }
+
+  // Render List of items
+  @autobind
+  private _onRenderList(props: IComboBoxProps): JSX.Element {
+    let {
+      onRenderItem = this._onRenderItem
+    } = this.props;
+
+    let id = this._id;
+    let { selectedIndex } = this.state;
+
+    return (
+      <div
+        id={ id + '-list' }
+        className={ css('ms-ComboBox-items', styles.items) }
+        aria-labelledby={ id + '-label' }
+        role='listbox'
+      >
+        { this.state.currentOptions.map((item, index) => onRenderItem({ ...item, index }, this._onRenderItem)) }
+      </div>
+    );
+  }
+
+  // Render items
+  @autobind
+  private _onRenderItem(item: ISelectableOption): JSX.Element {
+    switch (item.itemType) {
+      case SelectableOptionMenuItemType.Divider:
+        return this._renderSeparator(item);
+      case SelectableOptionMenuItemType.Header:
+        return this._renderHeader(item);
+      default:
+        return this._renderOption(item);
+    }
+  }
+
+  // Render separator
+  private _renderSeparator(item: ISelectableOption): JSX.Element {
+    let { index, key } = item;
+    if (index > 0) {
+      return <div
+        role='separator'
+        key={ key }
+        className={ css('ms-ComboBox-divider', styles.divider) } />;
+    }
+    return null;
+  }
+
+  private _renderHeader(item: ISelectableOption): JSX.Element {
+    let { onRenderOption = this._onRenderOption } = this.props;
+    return (
+      <div key={ item.key } className={ css('ms-ComboBox-header', styles.header) } role='header'>
+        { onRenderOption(item, this._onRenderOption) }
+      </div>);
+  }
+
+  // Render menu item
+  @autobind
+  private _renderOption(item: ISelectableOption): JSX.Element {
+    let { onRenderOption = this._onRenderOption } = this.props;
+    let id = this._id;
+    let isSelected: boolean = this._isOptionSelected(item.index);
+    return (
+      <CommandButton
+        id={ id + '-list' + item.index }
+        key={ item.key }
+        data-index={ item.index }
+        className={ css(
+          'ms-ComboBox-item', styles.item, {
+            ['is-selected ' + styles.itemIsSelected]:
+            isSelected,
+            ['is-disabled ' + styles.itemIsDisabled]: this.props.disabled === true
+          }
+        ) }
+        onClick={ () => this._onItemClick(item.index) }
+        role='option'
+        aria-selected={ isSelected ? 'true' : 'false' }
+        ariaLabel={ item.text }
+      > { <span ref={ this._resolveRef(isSelected ? '_selectedElement' : '') }>
+        { onRenderOption(item, this._onRenderOption) }
+      </span>
+        }
+      </CommandButton>
+    );
+  }
+
+  /**
+   * Use the current valid pending index if it exists OR
+   * we do not have a valid index and we currently have a pending input value,
+   * otherwise use the selected index
+   * */
+  private _isOptionSelected(index: number): boolean {
+    let {
+      currentPendingValueValidIndex,
+      currentPendingValue,
+      selectedIndex
+    } = this.state;
+    return ((currentPendingValueValidIndex >= 0 || currentPendingValue !== '') ?
+      currentPendingValueValidIndex === index : selectedIndex === index);
+  }
+
+  /**
+   * Scroll the selected element into view
+   */
+  private _scrollIntoView() {
+    if (this._selectedElement) {
+      let alignToTop = true;
+      if (this._comboBoxMenu.offsetParent) {
+        let scrollableParentRect = this._comboBoxMenu.offsetParent.getBoundingClientRect();
+        let selectedElementRect = this._selectedElement.offsetParent.getBoundingClientRect();
+
+        if (scrollableParentRect.top + scrollableParentRect.height <= selectedElementRect.top) {
+          alignToTop = false;
+        }
+      }
+
+      this._selectedElement.offsetParent.scrollIntoView(alignToTop);
+    }
+  }
+
+  // Render content of item
+  @autobind
+  private _onRenderOption(item: ISelectableOption): JSX.Element {
+    return <span className={ css('ms-ComboBox-optionText', styles.optionText) }>{ item.text }</span>;
+  }
+
+  /**
+   * Click handler for the menu items
+   * to select the item and also close the menu
+   * @param index - the index of the item that was clicked
+   */
+  private _onItemClick(index) {
+    this._setSelectedIndex(index);
+    this.setState({
+      isOpen: false
+    });
+  }
+
+  /**
+   * Handles dismissing (cancelling) the menu
+   */
+  @autobind
+  private _onDismiss() {
+
+    // reset the selected index
+    // to the last valud state
+    this._resetSelectedIndex();
+
+    // close the menu and focus the input
+    this.setState({ isOpen: false });
+    this._comboBox.focus();
+  }
+
+  /**
+   * Get the index of the option that is marked as selected
+   * @param options - the comboBox options
+   * @param selectedKey - the known selected key to find
+   * @returns {number} - the index of the selected option, -1 if not found
+   */
+  private _getSelectedIndex(options: ISelectableOption[], selectedKey: string | number): number {
+    return findIndex(options, (option => (option.isSelected || option.selected || (selectedKey != null) && option.key === selectedKey)));
+  }
+
+  /**
+   * Reset the selected index by clearing the
+   * input (of any pending text), clearing the pending state,
+   * and setting the suggested display value to the last
+   * selected state text
+   */
+  private _resetSelectedIndex() {
+    let {
+      selectedIndex,
+      currentOptions
+    } = this.state;
+    this._comboBox.clear();
+    this._clearPendingInfo();
+
+    if (selectedIndex > 0 && selectedIndex < currentOptions.length) {
+      this.setState({
+        suggestedDisplayValue: currentOptions[selectedIndex].text
+      });
+    }
+  }
+
+  /**
+   * Clears the pending info state
+   */
+  private _clearPendingInfo() {
+    this._setPendingInfo('' /* suggestedDisplayValue */, -1 /* currentPendingValueValidIndex */, '' /* currentPendingValue */);
+  }
+
+  /**
+   * Set the pending info
+   * @param currentPendingValue - new pending value to set
+   * @param currentPendingValueValidIndex - new pending value index to set
+   * @param suggestedDisplayValue - new suggest display value to set
+   */
+  private _setPendingInfo(currentPendingValue: string, currentPendingValueValidIndex: number, suggestedDisplayValue) {
+    this.setState({
+      currentPendingValue: currentPendingValue,
+      currentPendingValueValidIndex: currentPendingValueValidIndex,
+      suggestedDisplayValue: suggestedDisplayValue
+    });
+  }
+
+  /**
+   * Set the pending info from the given index
+   * @param index - the index to set the pending info from
+   */
+  private _setPendingInfoFromIndex(index: number) {
+    let {
+      currentOptions
+    } = this.state;
+
+    if (index > 0 && index < currentOptions.length) {
+      let option = currentOptions[index];
+      this._setPendingInfo(option.text, index, option.text);
+    } else {
+      this._clearPendingInfo();
+    }
+
+  }
+
+  /**
+   * Sets either the pending info or the
+   * selected index depending of if the comboBox is open
+   * @param index - the index to search from
+   * @param searchDirection - the direction to search
+   */
+  private _setInfoForIndexAndDirection(index: number, searchDirection: SearchDirection) {
+    let {
+      isOpen,
+      selectedIndex
+    } = this.state;
+
+    if (isOpen) {
+      index = this._getNextSelectableIndex(index, searchDirection);
+      this._setPendingInfoFromIndex(index);
+    } else {
+      this._setSelectedIndex(selectedIndex, searchDirection);
+    }
+  }
+
+  /**
+   * Handle keydown on the input
+   * @param ev - The keyboard event that was fired
+   */
+  @autobind
+  private _onInputKeyDown(ev: React.KeyboardEvent<HTMLElement | BaseAutoFill>) {
+    let {
+      disabled,
+      allowFreeform,
+      autoComplete
+    } = this.props;
+    let {
+      isOpen,
+      currentPendingValueValidIndex,
+      selectedIndex,
+      currentOptions
+    } = this.state;
+
+    if (disabled) {
+      this._handleInputWhenDisabled(ev);
+      return;
+    }
+
+    let index = currentPendingValueValidIndex >= 0 ? currentPendingValueValidIndex : selectedIndex;
+
+    switch (ev.which) {
+      case KeyCodes.enter:
+        // On enter submit the pending value
+        this._submitPendingValue();
+
+        // if we are open or
+        // if we are not allowing freeform or
+        // our we have no pending value
+        // and no valid pending index
+        // flip the open state
+        if ((isOpen ||
+          ((!allowFreeform ||
+            this.state.currentPendingValue === undefined ||
+            this.state.currentPendingValue === null ||
+            this.state.currentPendingValue.length <= 0) &&
+            this.state.currentPendingValueValidIndex < 0))) {
+          this.setState({
+            isOpen: !isOpen
+          });
+        }
+
+        // Allow TAB to propigate
+        if (ev.which === KeyCodes.tab) {
+          return;
+        }
+        break;
+
+      case KeyCodes.tab:
+        // On enter submit the pending value
+        this._submitPendingValue();
+
+        // If we are not allowing freeform
+        // or the comboBox is open, flip the open state
+        if (isOpen) {
+          this.setState({
+            isOpen: !isOpen
+          });
+        }
+
+        // Allow TAB to propigate
+        return;
+
+      case KeyCodes.escape:
+        // reset the selected index
+        this._resetSelectedIndex();
+
+        // Close the menu if opened
+        if (isOpen) {
+          this.setState({
+            isOpen: false
+          });
+        }
+        break;
+
+      case KeyCodes.up:
+        // Go to the previous option
+        this._setInfoForIndexAndDirection(index, SearchDirection.backward);
+        break;
+
+      case KeyCodes.down:
+        // Expand the comboBox on ALT + DownArrow
+        if (ev.altKey || ev.metaKey) {
+          this.setState({ isOpen: true });
+        } else {
+          // Got to the next option
+          this._setInfoForIndexAndDirection(index, SearchDirection.forward);
+        }
+        break;
+
+      case KeyCodes.home:
+      case KeyCodes.end:
+        if (allowFreeform) {
+          return;
+        }
+
+        // Set the initial values to respond to HOME
+        // which goes to the first selectable option
+        index = -1;
+        let directionToSearch = SearchDirection.forward;
+
+        // If end, update the values to respond to END
+        // which goes to the last selectable option
+        if (ev.which === KeyCodes.end) {
+          index = currentOptions.length;
+          directionToSearch = SearchDirection.backward;
+        }
+
+        this._setInfoForIndexAndDirection(index, directionToSearch);
+        break;
+
+      case KeyCodes.space:
+        // event handled in _onComboBoxKeyUp
+        if (!allowFreeform && !autoComplete) {
+          break;
+        }
+
+      default:
+
+        // are we processing a function key? if so bail out
+        if (ev.which >= 112 /* F1 */ && ev.which <= 123 /* F12 */) {
+          return;
+        }
+
+        // If we get here and we got either and ALT key
+        // or meta key and we are current open, let's close the menu
+        if ((ev.altKey || ev.metaKey) && isOpen) {
+          this.setState({ isOpen: !isOpen });
+        }
+
+        // If we are not allowing freeform and
+        // allowing autoComplete, handle the input here
+        // since we have marked the input as readonly
+        if (!allowFreeform && autoComplete) {
+          this._onInputChange(String.fromCharCode(ev.which));
+          break;
+        }
+
+        // allow the key to propigate by default
+        return;
+    }
+
+    ev.stopPropagation();
+    ev.preventDefault();
+  }
+
+  /**
+   * Handle keyup on the input
+   * @param ev - the keyboard event that was fired
+   */
+  @autobind
+  private _onInputKeyUp(ev: React.KeyboardEvent<HTMLElement | BaseAutoFill>) {
+    let {
+      disabled,
+      allowFreeform,
+      autoComplete
+    } = this.props;
+
+    if (disabled) {
+      this._handleInputWhenDisabled(ev);
+      return;
+    }
+
+    switch (ev.which) {
+      case KeyCodes.space:
+        // If we are not allowing freeform and are not autoComplete
+        // make space expand/collapse the comboBox
+        // and allow the event to propagate
+        if (!allowFreeform && !autoComplete) {
+          this.setState({
+            isOpen: !this.state.isOpen
+          });
+          return;
+        }
+        break;
+
+      default:
+        return;
+    }
+
+    ev.stopPropagation();
+    ev.preventDefault();
+  }
+
+  /**
+   * Handle dismissing the menu and
+   * eating the required key event when disabled
+   * @param ev - the keyboard event that was fired
+   */
+  private _handleInputWhenDisabled(ev: React.KeyboardEvent<HTMLElement | BaseAutoFill>) {
+    // If we are disabled, close the menu (if needed)
+    // and eat all keystokes other than TAB or ESC
+    if (this.props.disabled) {
+      if (this.state.isOpen) {
+        this.setState({ isOpen: false });
+      }
+
+      // When disabled stop propagation and prevent default
+      // of the event unless we have a tab, escape, or function key
+      if (ev !== null &&
+        ev.which !== KeyCodes.tab &&
+        ev.which !== KeyCodes.escape &&
+        (ev.which < 112 /* F1 */ || ev.which > 123 /* F12 */)) {
+        ev.stopPropagation();
+        ev.preventDefault();
+      }
+    }
+  }
+
+  /**
+   * Click handler for the button of the comboBox
+   * and the input when not allowing freeform. This
+   * toggles the expand/collapse state of the comboBox (if enbled)
+   */
+  @autobind
+  private _onComboBoxClick() {
+    let { disabled } = this.props;
+    let { isOpen } = this.state;
+
+    if (!disabled) {
+      this.setState({
+        isOpen: !isOpen
+      });
+    }
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.visualtest.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.visualtest.ts
new file mode 100644
index 0000000000000..300231665fe21
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.visualtest.ts
@@ -0,0 +1,29 @@
+import { Casper } from '../../visualtest/PhantomCssInterface';
+import { baseUrl } from '../../common/VisualTest';
+import { defaultScreenshot, testRunner, mouseClickScreenshot, mouseMoveScreenshot } from '../../visualtest/RunVisualTest';
+import { IRunVisualTest } from '../../visualtest/IRunVisualTest';
+declare var casper: Casper;
+let componentIds: IRunVisualTest[] = [];
+
+componentIds.push(
+  {
+    selector: '.' + 'ms-ComboBox-Input',
+    fileName: 'comboBox_input',
+    imageSelector: '.' + 'ms-ComboBox-Container',
+    commands: [defaultScreenshot, mouseClickScreenshot, mouseMoveScreenshot]
+  },
+  {
+    selector: '.' + 'ms-ComboBox-Button',
+    fileName: 'comboBox_button',
+    imageSelector: '.' + 'ms-comboBox-Container',
+    commands: [defaultScreenshot, mouseClickScreenshot, mouseMoveScreenshot]
+  },
+);
+
+casper.
+  start(baseUrl + 'comboBox').
+  then(() => {
+    testRunner(componentIds);
+  });
+
+casper.run(() => { casper.test.done(); });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
new file mode 100644
index 0000000000000..2179418e30cd4
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
@@ -0,0 +1,59 @@
+import * as React from 'react';
+import {
+  ExampleCard,
+  IComponentDemoPageProps,
+  ComponentPage,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+import { ComboBoxBasicExample } from './examples/ComboBox.Basic.Example';
+
+const ComboBoxBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx') as string;
+
+export class ComboBoxPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render() {
+    return (
+      <ComponentPage
+        title='ComboBox'
+        componentName='ComboBoxExample'
+        exampleCards={
+          <ExampleCard title='ComboBox' code={ ComboBoxBasicExampleCode }>
+            <ComboBoxBasicExample />
+          </ExampleCard>
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts')
+            ] }
+          />
+        }
+        overview={
+          <div>
+            <p>
+              A ComboBox is a list in which the selected item is always visible, and the others are visible on demand by clicking a drop-down button or by typing in the input (unless allowFreeform and autoComplete are both false). They are used to simplify the design and make a choice within the UI. When closed, only the selected item is visible. When users click the drop-down button, all the options become visible. To change the value, users open the list and click another value or use the arrow keys (up and down) to select a new value. When collapsed if autoComplete and/or allowFreeform are true, the user can select a new value by typing.
+            </p>
+          </div>
+        }
+        bestPractices={
+          <div></div>
+        }
+        dos={
+          <div>
+            <ul>
+              <li>Use a ComboBox when there are multiple choices that can be collapsed under one title. Or if the list of items is long or when space is constrained.</li>
+              <li>ComboBoxs contain shortened statements or words.</li>
+              <li>Use a ComboBox when the selected option is more important than the alternatives (in contrast to radio buttons where all the choices are visible putting more emphasis on the other options).</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div></div>
+        }
+        related={
+          <a href='https://dev.office.com/fabric-js/Components/ComboBox/ComboBox.html'>Fabric JS</a>
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }>
+      </ComponentPage>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.visualtest.tsx
new file mode 100644
index 0000000000000..b7e35f4416d95
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.visualtest.tsx
@@ -0,0 +1,29 @@
+import { ComboBox } from './index';
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+export default class ComboBoxVPage extends React.Component<any, any> {
+  public render() {
+    return <div >
+      <ComboBox
+        defaultSelectedKey='C'
+        label='Basic uncontrolled example (allowFreeform: T, AutoComplete: T):'
+        id='Basicdrop1'
+        ariaLabel='Basic ComboBox example'
+        allowFreeform={ true }
+        autoComplete={ true }
+        options={
+          [
+            { key: 'A', text: 'Option a' },
+            { key: 'B', text: 'Option b' },
+            { key: 'C', text: 'Option c' },
+            { key: 'D', text: 'Option d' },
+            { key: 'E', text: 'Option e' },
+            { key: 'F', text: 'Option f' },
+            { key: 'G', text: 'Option g' },
+          ]
+        }
+      />
+    </div>;
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.scss b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.scss
new file mode 100644
index 0000000000000..f71fcb3e8911c
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.scss
@@ -0,0 +1,15 @@
+:global {
+  .ms-ComboBoxBasicExample {
+    max-width: 300px;
+  }
+  .ms-ComboBox-optionText {
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    min-width: 0px;
+    max-width: 100%;
+    word-wrap: break-word;
+    overflow-wrap: break-word;
+    margin: 1px;
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
new file mode 100644
index 0000000000000..dc221e04c6a93
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
@@ -0,0 +1,234 @@
+import * as React from 'react';
+import { ComboBox } from 'office-ui-fabric-react/lib/ComboBox';
+import './ComboBox.Basic.Example.scss';
+import {
+  assign,
+  autobind
+} from 'office-ui-fabric-react/lib/Utilities';
+import { ISelectableOption, SelectableOptionMenuItemType } from 'office-ui-fabric-react/lib/utilities/selectableOption/SelectableOption.Props';
+
+export class ComboBoxBasicExample extends React.Component<any, any> {
+  private _testOptions =
+  [{ key: 'Header', text: 'Theme Fonts', itemType: SelectableOptionMenuItemType.Header },
+  { key: 'A', text: 'Arial Black' },
+  { key: 'B', text: 'Time New Roman' },
+  { key: 'C', text: 'Comic Sans MS' },
+  { key: 'divider_2', text: '-', itemType: SelectableOptionMenuItemType.Divider },
+  { key: 'Header1', text: 'Other Options', itemType: SelectableOptionMenuItemType.Header },
+  { key: 'D', text: 'Option d' },
+  { key: 'E', text: 'Option e' },
+  { key: 'F', text: 'Option f' },
+  { key: 'G', text: 'Option g' },
+  { key: 'H', text: 'Option h' },
+  { key: 'I', text: 'Option i' },
+  { key: 'J', text: 'Option j' },
+  ];
+
+  private _fontMapping: { [key: string]: string } = {
+    ['Arial Black']: '"Arial Black", "Arial Black_MSFontService", sans-serif',
+    ['Time New Roman']: '"Times New Roman", "Times New Roman_MSFontService", serif',
+    ['Comic Sans MS']: '"Comic Sans MS", "Comic Sans MS_MSFontService", fantasy',
+    ['Calibri']: 'Calibri, Calibri_MSFontService, sans-serif'
+  };
+
+  constructor() {
+    super();
+    this.state = {
+      options: [],
+      selectedOptionKey: null,
+      value: 'Calibri'
+    };
+  }
+
+  public render() {
+    let { options, selectedOptionKey, value } = this.state;
+
+    return (
+      <div className='ms-ComboBoxBasicExample'>
+
+        <ComboBox
+          defaultSelectedKey='C'
+          label='Basic uncontrolled example (allowFreeform: T, AutoComplete: T):'
+          id='Basicdrop1'
+          ariaLabel='Basic ComboBox example'
+          allowFreeform={ true }
+          autoComplete={ true }
+          options={ this._testOptions }
+          onRenderOption={ this._onRenderFontOption }
+        />
+
+        <ComboBox
+          defaultSelectedKey='C'
+          label='Basic uncontrolled example (allowFreeform: T, AutoComplete: F):'
+          id='Basicdrop2'
+          ariaLabel='Basic ComboBox example'
+          allowFreeform={ true }
+          autoComplete={ false }
+          options={ this._testOptions }
+          onRenderOption={ this._onRenderFontOption }
+        />
+
+        <ComboBox
+          selectedKey='C'
+          label='Basic uncontrolled example (allowFreeform: F, AutoComplete: T):'
+          id='Basicdrop3'
+          ariaLabel='Basic ComboBox example'
+          allowFreeform={ false }
+          autoComplete={ true }
+          options={ this._testOptions }
+          onRenderOption={ this._onRenderFontOption }
+        />
+
+        <ComboBox
+          defaultSelectedKey='C'
+          label='Basic uncontrolled example (allowFreeform: F, AutoComplete: F):'
+          id='Basicdrop4'
+          ariaLabel='Basic ComboBox example'
+          allowFreeform={ false }
+          autoComplete={ false }
+          options={ this._testOptions }
+          onRenderOption={ this._onRenderFontOption }
+        />
+
+        <ComboBox
+          label='Basic uncontrolled example:'
+          id='Basicdrop5'
+          ariaLabel='Basic ComboBox example'
+          errorMessage='Error! Here is some text!'
+          options={ this._testOptions }
+          onRenderOption={ this._onRenderFontOption }
+        />
+
+        <ComboBox
+          label='Disabled uncontrolled example with defaultSelectedKey:'
+          defaultSelectedKey='D'
+          options={
+            [
+              { key: 'A', text: 'Option a' },
+              { key: 'B', text: 'Option b' },
+              { key: 'C', text: 'Option c' },
+              { key: 'D', text: 'Option d' },
+              { key: 'E', text: 'Option e' },
+              { key: 'F', text: 'Option f' },
+              { key: 'G', text: 'Option g' },
+            ]
+          }
+          disabled={ true }
+        />
+
+        { value ?
+          <ComboBox
+            label='Basic controlled example:'
+            id='Basicdrop5'
+            ariaLabel='Basic ComboBox example'
+            allowFreeform={ true }
+            autoComplete={ true }
+            options={ options }
+            onChanged={ this._onChanged }
+            onResolveOptions={ this._getOptions }
+            value={ value && value }
+            onRenderOption={ this._onRenderFontOption }
+          />
+          :
+          <ComboBox
+            selectedKey={ selectedOptionKey && selectedOptionKey }
+            label='Basic controlled example:'
+            id='Basicdrop5'
+            ariaLabel='Basic ComboBox example'
+            allowFreeform={ true }
+            autoComplete={ true }
+            options={ options }
+            onChanged={ this._onChanged }
+            onResolveOptions={ this._getOptions }
+            onRenderOption={ this._onRenderFontOption }
+          />
+        }
+
+      </div>
+
+    );
+  }
+
+  // Render content of item
+  @autobind
+  private _onRenderFontOption(item: ISelectableOption): JSX.Element {
+
+    if (item.itemType === SelectableOptionMenuItemType.Header ||
+      item.itemType === SelectableOptionMenuItemType.Divider) {
+      return <span className={ 'ms-ComboBox-optionText' }>{ item.text }</span>;
+    }
+
+    let fontFamily = this._fontMapping[item.text];
+
+    if (fontFamily === null || fontFamily === undefined) {
+      let newFontFamily: string = item.text;
+      if (newFontFamily.indexOf(' ') > -1) {
+        newFontFamily = '"' + newFontFamily + '"';
+      }
+
+      // add a default fallback font
+      newFontFamily += ',"Segoe UI",Tahoma,Sans-Serif';
+
+      this._fontMapping = assign({}, this._fontMapping, { [fontFamily]: newFontFamily });
+      fontFamily = newFontFamily;
+    }
+
+    return <span className={ 'ms-ComboBox-optionText' } style={ { fontFamily: fontFamily && fontFamily } }>{ item.text }</span>;
+  }
+
+  @autobind
+  private _getOptions(currentOptions: ISelectableOption[]): ISelectableOption[] {
+
+    if (this.state.options.length > 0) {
+      return this.state.options;
+    }
+
+    let newOptions =
+      [
+        { key: 'Header', text: 'Theme Fonts', itemType: SelectableOptionMenuItemType.Header },
+        { key: 'A', text: 'Arial Black', fontFamily: '"Arial Black", "Arial Black_MSFontService", sans-serif' },
+        { key: 'B', text: 'Time New Roman', fontFamily: '"Times New Roman", "Times New Roman_MSFontService", serif' },
+        { key: 'C', text: 'Comic Sans MS', fontFamily: '"Comic Sans MS", "Comic Sans MS_MSFontService", fantasy' },
+        { key: 'C1', text: 'Calibri', fontFamily: 'Calibri, Calibri_MSFontService, sans-serif' },
+        { key: 'divider_2', text: '-', itemType: SelectableOptionMenuItemType.Divider },
+        { key: 'Header1', text: 'Other Options', itemType: SelectableOptionMenuItemType.Header },
+        { key: 'D', text: 'Option d' },
+        { key: 'E', text: 'Option e' },
+        { key: 'F', text: 'Option f' },
+        { key: 'G', text: 'Option g' },
+        { key: 'H', text: 'Option h' },
+        { key: 'I', text: 'Option i' },
+        { key: 'J', text: 'Option j' }
+      ];
+    this.setState({
+      options: newOptions,
+      selectedOptionKey: 'C1',
+      value: null
+    });
+
+    return newOptions;
+  }
+
+  @autobind
+  private _onChanged(option: ISelectableOption, index: number, value: string) {
+    if (option !== null) {
+      this.setState({
+        selectedOptionKey: option.key,
+        value: null
+      });
+    } else if (index !== null && index >= 0 && index < this.state.options.length) {
+      this.setState({
+        selectedOptionKey: this.state.options[index].key,
+        value: null
+      });
+    } else if (value !== null) {
+      let newOption: ISelectableOption = { key: value, text: value };
+
+      this.setState({
+        options: [...this.state.options, newOption],
+        selectedOptionKey: newOption.key,
+        value: null
+      });
+    }
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/index.ts b/packages/office-ui-fabric-react/src/components/ComboBox/index.ts
new file mode 100644
index 0000000000000..fddc1b1ca5ba7
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/index.ts
@@ -0,0 +1,2 @@
+export * from './ComboBox';
+export * from './ComboBox.Props';
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
index a28fafc3d552f..2f62833c2eec0 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
@@ -1,66 +1,20 @@
-import * as React from 'react';
 import { IRenderFunction } from '../../Utilities';
 import { Dropdown } from './Dropdown';
-import { ICalloutProps } from '../../Callout';
+import { ISelectableOption } from '../../utilities/selectableOption/SelectableOption.Props';
+import { ISelectableDroppableTextProps } from '../../utilities/selectableOption/SelectableDroppableText.Props';
 
-export enum DropdownMenuItemType {
-  Normal = 0,
-  Divider = 1,
-  Header = 2
-}
+export { SelectableOptionMenuItemType as DropdownMenuItemType } from '../../utilities/selectableOption/SelectableOption.Props';
 
 export interface IDropdown {
 
 }
 
-export interface IDropdownProps extends React.Props<Dropdown> {
-  /**
-   * Optional callback to access the IDropdown interface. Use this instead of ref for accessing
-   * the public methods and properties of the component.
-   */
-  componentRef?: (component: IDropdown) => void;
-
-  /**
-   * Descriptive label for the Dropdown
-   */
-  label?: string;
-
+export interface IDropdownProps extends ISelectableDroppableTextProps<Dropdown> {
   /**
    * Input placeholder text. Displayed until option is selected.
    */
   placeHolder?: string;
 
-  /**
-  * Aria Label for the Dropdown for screen reader users.
-  */
-  ariaLabel?: string;
-
-  /**
-  * Id of the drop down
-  */
-  id?: string;
-
-  /**
-   * If provided, additional class name to provide on the root element.
-   */
-  className?: string;
-
-  /**
-   * The key that will be initially used to set a selected item.
-   */
-  defaultSelectedKey?: string | number;
-
-  /**
-   * The key of the selected item. If you provide this, you must maintain selection
-   * state by observing onChange events and passing a new value in when changed.
-   */
-  selectedKey?: string | number;
-
-  /**
-   * Collection of options for this Dropdown
-   */
-  options?: IDropdownOption[];
-
   /**
    * Callback issues when the selected option changes
    */
@@ -76,82 +30,14 @@ export interface IDropdownProps extends React.Props<Dropdown> {
    */
   onRenderTitle?: IRenderFunction<IDropdownOption>;
 
-  /**
-    * Optional custom renderer for the dropdown container
-    */
-  onRenderContainer?: IRenderFunction<IDropdownProps>;
-
-  /**
-    * Optional custom renderer for the dropdown list
-    */
-  onRenderList?: IRenderFunction<IDropdownProps>;
-
-  /**
-   * Optional custom renderer for the dropdown options
-   */
-  onRenderItem?: IRenderFunction<IDropdownOption>;
-
-  /**
-   * Optional custom renderer for the dropdown option content
-   */
-  onRenderOption?: IRenderFunction<IDropdownOption>;
-
-  /**
-   * Whether or not the Dropdown is disabled.
-   */
-  disabled?: boolean;
-
-  /**
-   * Whether or not the Dropdown is required.
-   */
-  required?: boolean;
-
-  /**
-   * Custom properties for Dropdown's Callout used to render options.
-   */
-  calloutProps?: ICalloutProps;
-
   /**
    * Deprecated at v0.52.0, use 'disabled' instead.
    * @deprecated
    */
   isDisabled?: boolean;
-
-  /**
-   * Descriptive label for the Dropdown Error Message
-   */
-  errorMessage?: string;
 }
 
-export interface IDropdownOption {
-  /**
-   * Arbitrary string associated with this option.
-   */
-  key: string | number;
-
-  /**
-   * Text to render for this option
-   */
-  text: string;
-
-  /**
-   * Text to render for this option
-   */
-  itemType?: DropdownMenuItemType;
-
-  /**
-   * Index for this option
-   */
-  index?: number;
-
-  /**
-   * The aria label for the dropdown option. If not present, the `text` will be used.
-   */
-  ariaLabel?: string;
-
-  /** If option is selected. */
-  selected?: boolean;
-
+export interface IDropdownOption extends ISelectableOption {
   /**
    * Data available to custom onRender functions.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index e818ad5583f0a..96f673c876046 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -17,6 +17,7 @@ import {
   findIndex,
   getId
 } from '../../Utilities';
+import { SelectableOptionMenuItemType } from '../../utilities/selectableOption/SelectableOption.Props';
 import * as stylesImport from './Dropdown.scss';
 const styles: any = stylesImport;
 
@@ -330,9 +331,9 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   @autobind
   private _onRenderItem(item: IDropdownOption): JSX.Element {
     switch (item.itemType) {
-      case DropdownMenuItemType.Divider:
+      case SelectableOptionMenuItemType.Divider:
         return this._renderSeparator(item);
-      case DropdownMenuItemType.Header:
+      case SelectableOptionMenuItemType.Header:
         return this._renderHeader(item);
       default:
         return this._renderOption(item);
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts
index ace79d62535cd..c214933ae77a5 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts
@@ -59,4 +59,27 @@ export interface IBaseAutoFillProps extends React.HTMLAttributes<HTMLInputElemen
    */
   enableAutoFillOnKeyPress?: KeyCodes[];
 
+  /**
+   * the default value to be visible
+   */
+  defaultVisibleValue?: string;
+
+  /**
+   * Handler for checking and updating the value if needed
+   *  in componentWillReceiveProps
+   *
+   * @param {IBaseAutoFillProps} defaultVisibleValue - the defaultVisibleValue that got passed
+   *  in to the auto fill's componentWillReceiveProps
+   * @returns {string} - the updated value to set, if needed
+   */
+  updateValueInWillReceiveProps?: () => string;
+
+  /**
+   * Handler for checking if the full value of the input should
+   * be seleced in componentDidUpdate
+   *
+   * @returns {boolean} - should the full value of the input be selected?
+   */
+  shouldSelectFullInputValueInComponentDidUpdate?: () => boolean;
+
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
index 0ee0b1865f67d..a05af2ce803e2 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
@@ -29,7 +29,7 @@ export class BaseAutoFill extends BaseComponent<IBaseAutoFillProps, IBaseAutoFil
     super(props);
     this._value = '';
     this.state = {
-      displayValue: ''
+      displayValue: props.defaultVisibleValue === null ? '' : props.defaultVisibleValue
     };
   }
 
@@ -67,6 +67,13 @@ export class BaseAutoFill extends BaseComponent<IBaseAutoFillProps, IBaseAutoFil
   }
 
   public componentWillReceiveProps(nextProps: IBaseAutoFillProps) {
+    if (this.props.updateValueInWillReceiveProps) {
+      let newValue: string = this.props.updateValueInWillReceiveProps();
+
+      if (newValue !== null) {
+        this._value = newValue;
+      }
+    }
     if (this._autoFillEnabled && this._doesTextStartWith(nextProps.suggestedDisplayValue, this._value)) {
       this.setState({ displayValue: nextProps.suggestedDisplayValue });
     }
@@ -74,14 +81,29 @@ export class BaseAutoFill extends BaseComponent<IBaseAutoFillProps, IBaseAutoFil
 
   public componentDidUpdate() {
     let value = this._value;
-    let { suggestedDisplayValue } = this.props;
+    let {
+      defaultVisibleValue,
+      suggestedDisplayValue,
+      shouldSelectFullInputValueInComponentDidUpdate
+    } = this.props;
     let differenceIndex = 0;
+
     if (this._autoFillEnabled && value && suggestedDisplayValue && this._doesTextStartWith(suggestedDisplayValue, value)) {
-      while (differenceIndex < value.length && value[differenceIndex].toLocaleLowerCase() === suggestedDisplayValue[differenceIndex].toLocaleLowerCase()) {
-        differenceIndex++;
+      let shouldSelectFullRange = false;
+
+      if (shouldSelectFullInputValueInComponentDidUpdate) {
+        shouldSelectFullRange = shouldSelectFullInputValueInComponentDidUpdate();
       }
-      if (differenceIndex > 0) {
-        this._inputElement.setSelectionRange(differenceIndex, suggestedDisplayValue.length, SELECTION_BACKWARD);
+
+      if (shouldSelectFullRange) {
+        this._inputElement.setSelectionRange(0, suggestedDisplayValue.length, SELECTION_BACKWARD);
+      } else {
+        while (differenceIndex < value.length && value[differenceIndex].toLocaleLowerCase() === suggestedDisplayValue[differenceIndex].toLocaleLowerCase()) {
+          differenceIndex++;
+        }
+        if (differenceIndex > 0) {
+          this._inputElement.setSelectionRange(differenceIndex, suggestedDisplayValue.length, SELECTION_BACKWARD);
+        }
       }
     }
   }
@@ -99,7 +121,7 @@ export class BaseAutoFill extends BaseComponent<IBaseAutoFillProps, IBaseAutoFil
       autoComplete={ 'off' }
       onChange={ this._onChange }
       onKeyDown={ this._onKeyDown }
-      onClick={ this._onClick }
+      onClick={ this.props.onClick ? this.props.onClick : this._onClick }
     />;
   }
 
@@ -121,7 +143,11 @@ export class BaseAutoFill extends BaseComponent<IBaseAutoFillProps, IBaseAutoFil
   }
 
   @autobind
-  private _onKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+  private _onKeyDown(ev: React.KeyboardEvent<HTMLInputElement>) {
+    if (this.props.onKeyDown) {
+      this.props.onKeyDown(ev);
+    }
+
     switch (ev.which) {
       case KeyCodes.backspace:
         this._autoFillEnabled = false;
diff --git a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
index 6a02d00c8537d..f7deda39eb3fe 100644
--- a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
+++ b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
@@ -52,6 +52,12 @@ export const AppDefinition: IAppDefinition = {
           name: 'ChoiceGroup',
           url: '#/examples/choicegroup'
         },
+        {
+          component: require<any>('../components/ComboBox/ComboBoxPage').ComboBoxPage,
+          key: 'ComboBox',
+          name: 'ComboBox',
+          url: '#/examples/ComboBox'
+        },
         {
           component: require<any>('../components/CommandBar/CommandBarPage').CommandBarPage,
           key: 'CommandBar',
diff --git a/packages/office-ui-fabric-react/src/index.ts b/packages/office-ui-fabric-react/src/index.ts
index 952bd1f6b4afa..7bc84c48df80f 100644
--- a/packages/office-ui-fabric-react/src/index.ts
+++ b/packages/office-ui-fabric-react/src/index.ts
@@ -10,6 +10,7 @@ export * from './Callout';
 export * from './Checkbox';
 export * from './ChoiceGroup';
 export * from './ColorPicker';
+export * from './ComboBox';
 export * from './CommandBar';
 export * from './ContextualMenu';
 export * from './DatePicker';
diff --git a/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.Props.ts b/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.Props.ts
new file mode 100644
index 0000000000000..633a04cd68d90
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.Props.ts
@@ -0,0 +1,93 @@
+import * as React from 'react';
+import { IRenderFunction } from '../../Utilities';
+import { ICalloutProps } from '../../Callout';
+import { ISelectableOption } from '../../utilities/selectableOption/SelectableOption.Props';
+
+export interface ISelectableDroppableTextProps<T> extends React.Props<T> {
+  /**
+  * Optional callback to access the ISelectableDroppableText interface. Use this instead of ref for accessing
+  * the public methods and properties of the component.
+  */
+  componentRef?: (component: T) => void;
+
+  /**
+   * Descriptive label for the ISelectableDroppableText
+   */
+  label?: string;
+
+  /**
+  * Aria Label for the ISelectableDroppableText for screen reader users.
+  */
+  ariaLabel?: string;
+
+  /**
+  * Id of the ISelectableDroppableText
+  */
+  id?: string;
+
+  /**
+   * If provided, additional class name to provide on the root element.
+   */
+  className?: string;
+
+  /**
+   * The key that will be initially used to set a selected item.
+   */
+  defaultSelectedKey?: string | number;
+
+  /**
+   * The key of the selected item. If you provide this, you must maintain selection
+   * state by observing onChange events and passing a new value in when changed.
+   */
+  selectedKey?: string | number;
+
+  /**
+   * Collection of options for this ISelectableDroppableText
+   */
+  options?: any;
+
+  /**
+   * Callback issues when the selected option changes
+   */
+  onChanged?: (option: ISelectableOption, index?: number) => void;
+
+  /**
+    * Optional custom renderer for the ISelectableDroppableText container
+    */
+  onRenderContainer?: IRenderFunction<ISelectableDroppableTextProps<T>>;
+
+  /**
+    * Optional custom renderer for the ISelectableDroppableText list
+    */
+  onRenderList?: IRenderFunction<ISelectableDroppableTextProps<T>>;
+
+  /**
+   * Optional custom renderer for the ISelectableDroppableText options
+   */
+  onRenderItem?: IRenderFunction<ISelectableOption>;
+
+  /**
+   * Optional custom renderer for the ISelectableDroppableText option content
+   */
+  onRenderOption?: IRenderFunction<ISelectableOption>;
+
+  /**
+   * Whether or not the ISelectableDroppableText is disabled.
+   */
+  disabled?: boolean;
+
+  /**
+   * Whether or not the ISelectableDroppableText is required.
+   */
+  required?: boolean;
+
+  /**
+   * Custom properties for ISelectableDroppableText's Callout used to render options.
+   */
+  calloutProps?: ICalloutProps;
+
+  /**
+   * Descriptive label for the ISelectableDroppableText Error Message
+   */
+  errorMessage?: string;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableOption.Props.ts b/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableOption.Props.ts
new file mode 100644
index 0000000000000..c58caa9c512ce
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableOption.Props.ts
@@ -0,0 +1,35 @@
+export interface ISelectableOption {
+  /**
+   * Arbitrary string associated with this option.
+   */
+  key: string | number;
+
+  /**
+   * Text to render for this option
+   */
+  text: string;
+
+  /**
+   * Text to render for this option
+   */
+  itemType?: SelectableOptionMenuItemType;
+
+  /**
+   * Index for this option
+   */
+  index?: number;
+
+  /**
+   * The aria label for the dropdown option. If not present, the `text` will be used.
+   */
+  ariaLabel?: string;
+
+  /** If option is selected. */
+  selected?: boolean;
+}
+
+export enum SelectableOptionMenuItemType {
+  Normal = 0,
+  Divider = 1,
+  Header = 2
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/selectableOption/index.ts b/packages/office-ui-fabric-react/src/utilities/selectableOption/index.ts
new file mode 100644
index 0000000000000..4c2fe6688b993
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/utilities/selectableOption/index.ts
@@ -0,0 +1,2 @@
+export * from './SelectableOption.Props';
+export * from './SelectableDroppableText.Props';
\ No newline at end of file

From 7632c115558dc8be5db22fdea8f6a1fc70ca1a48 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 20 Jun 2017 03:22:48 -0700
Subject: [PATCH 0135/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...resizegroup-refactor_2017-06-15-18-00.json | 11 -----------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++++-
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/CHANGELOG.json               |  6 ++++++
 packages/styling/CHANGELOG.md                 |  7 ++++++-
 packages/styling/package.json                 |  2 +-
 13 files changed, 48 insertions(+), 22 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/breadcrumb-resizegroup-refactor_2017-06-15-18-00.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 0629f6de44c06..f5823a77e8365 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.8.3 <5.0.0",
+    "office-ui-fabric-react": ">=4.9.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 53db4cb24d9e9..41febbeb19359 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.8.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.9.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index a014349f8be22..fa56c4f58bb4e 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.8.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.9.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 503930dede637..34b520ae76492 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.8.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.9.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/office-ui-fabric-react/breadcrumb-resizegroup-refactor_2017-06-15-18-00.json b/common/changes/office-ui-fabric-react/breadcrumb-resizegroup-refactor_2017-06-15-18-00.json
deleted file mode 100644
index 95978ee589450..0000000000000
--- a/common/changes/office-ui-fabric-react/breadcrumb-resizegroup-refactor_2017-06-15-18-00.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Breadcrumb: Switch resizing logic to resizeGroup",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 75df956651dd8..5d8fd1c48d9fa 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -40,7 +40,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.10.4 <1.0.0",
+    "@uifabric/styling": ">=0.10.5 <1.0.0",
     "@uifabric/utilities": ">=4.3.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index d96b006241481..76bcd729ea539 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.8.3 <5.0.0",
+    "office-ui-fabric-react": ">=4.9.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 8ac20a3aca0f2..4419659aaf90b 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.9.0",
+      "tag": "office-ui-fabric-react_v4.9.0",
+      "date": "Tue, 20 Jun 2017 10:22:47 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "1ca8cda27da8bf1243f2d794a917e8d6154ceade",
+            "comment": "Breadcrumb: Switch resizing logic to resizeGroup"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.10.4 <1.0.0` to `>=0.10.5 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.8.3",
       "tag": "office-ui-fabric-react_v4.8.3",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 4d024ead25d60..d52ea2c6b7307 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Sat, 17 Jun 2017 17:39:43 GMT and should not be manually modified.
+This log was last generated on Tue, 20 Jun 2017 10:22:47 GMT and should not be manually modified.
+
+## 4.9.0
+Tue, 20 Jun 2017 10:22:47 GMT
+
+### Minor changes
+
+- Breadcrumb: Switch resizing logic to resizeGroup
 
 ## 4.8.3
 Sat, 17 Jun 2017 17:39:43 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index ca23bf793754f..a3161117d28e9 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.8.3",
+  "version": "4.9.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.3.0 <5.0.0",
-    "@uifabric/styling": ">=0.10.4 <1.0.0",
+    "@uifabric/styling": ">=0.10.5 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index c0bfb84c006db..92480f849693a 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.10.5",
+      "tag": "@uifabric/styling_v0.10.5",
+      "date": "Tue, 20 Jun 2017 10:22:47 GMT",
+      "comments": {}
+    },
     {
       "version": "0.10.4",
       "tag": "@uifabric/styling_v0.10.4",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index f19122587e268..a82095869ab37 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Sat, 17 Jun 2017 17:39:43 GMT and should not be manually modified.
+This log was last generated on Tue, 20 Jun 2017 10:22:47 GMT and should not be manually modified.
+
+## 0.10.5
+Tue, 20 Jun 2017 10:22:47 GMT
+
+*Changes not tracked*
 
 ## 0.10.4
 Sat, 17 Jun 2017 17:39:43 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index be4586fe52d85..be03ac2af13a5 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.10.4",
+  "version": "0.10.5",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 230323c6b7d4972e8b04da6a4beb981b1c15396c Mon Sep 17 00:00:00 2001
From: dmarcey <demarcey@microsoft.com>
Date: Tue, 20 Jun 2017 13:52:40 -0400
Subject: [PATCH 0136/1641] Users/demarcey/move theme (#2022)

* Moving theme.ts from styling/src/utilities to styling/src/styles to prevent circular dependency.

* Adding change file.
---
 .../users-demarcey-moveTheme_2017-06-20-12-42.json    | 11 +++++++++++
 packages/styling/src/classNames/ColorClassNames.ts    |  3 ++-
 packages/styling/src/styles/getFocusStyle.ts          |  2 +-
 packages/styling/src/styles/index.ts                  |  6 ++++++
 packages/styling/src/{utilities => styles}/theme.ts   |  6 ++++--
 packages/styling/src/utilities/index.ts               |  6 ------
 6 files changed, 24 insertions(+), 10 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/users-demarcey-moveTheme_2017-06-20-12-42.json
 rename packages/styling/src/{utilities => styles}/theme.ts (97%)

diff --git a/common/changes/@uifabric/styling/users-demarcey-moveTheme_2017-06-20-12-42.json b/common/changes/@uifabric/styling/users-demarcey-moveTheme_2017-06-20-12-42.json
new file mode 100644
index 0000000000000..7694634c8c586
--- /dev/null
+++ b/common/changes/@uifabric/styling/users-demarcey-moveTheme_2017-06-20-12-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Fixing circular dependency between @uifabric/styling/utilities and @uifabric/styling/styles",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "demarcey@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/styling/src/classNames/ColorClassNames.ts b/packages/styling/src/classNames/ColorClassNames.ts
index 246b889dabc71..3b748ba837165 100644
--- a/packages/styling/src/classNames/ColorClassNames.ts
+++ b/packages/styling/src/classNames/ColorClassNames.ts
@@ -1,6 +1,7 @@
-import { getTheme, mergeStyles } from '../utilities/index';
+import { mergeStyles } from '../utilities/index';
 import { IRawStyle } from '../interfaces/index';
 import { DefaultPalette } from '../styles/DefaultPalette';
+import { getTheme } from '../styles/index';
 
 export interface IColorClassNames {
   themeDarker?: string;
diff --git a/packages/styling/src/styles/getFocusStyle.ts b/packages/styling/src/styles/getFocusStyle.ts
index 63acf529b0cfc..2f7f8addb3d05 100644
--- a/packages/styling/src/styles/getFocusStyle.ts
+++ b/packages/styling/src/styles/getFocusStyle.ts
@@ -1,6 +1,6 @@
 import { mergeStyles } from '../utilities/index';
 import { IProcessedStyle } from '../interfaces/index';
-import { ITheme } from '../utilities/theme';
+import { ITheme } from './theme';
 import { parent } from '../glamorExports';
 
 /**
diff --git a/packages/styling/src/styles/index.ts b/packages/styling/src/styles/index.ts
index e333bc0034c1e..6b342cfb72d7b 100644
--- a/packages/styling/src/styles/index.ts
+++ b/packages/styling/src/styles/index.ts
@@ -3,3 +3,9 @@ export { DefaultPalette } from './DefaultPalette';
 export { DefaultFontStyles, FontSizes, FontWeights } from './DefaultFontStyles';
 export { IconCodes } from './IconCodes';
 export { getFocusStyle } from './getFocusStyle';
+export {
+  ITheme,
+  getTheme,
+  loadTheme,
+  createTheme
+} from './theme';
diff --git a/packages/styling/src/utilities/theme.ts b/packages/styling/src/styles/theme.ts
similarity index 97%
rename from packages/styling/src/utilities/theme.ts
rename to packages/styling/src/styles/theme.ts
index 8bb63f8cd8613..ab121601ca8fb 100644
--- a/packages/styling/src/utilities/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -4,9 +4,11 @@ import {
   ISemanticColors
 } from '../interfaces/index';
 import {
-  DefaultPalette,
   DefaultFontStyles
-} from '../styles/index';
+} from './DefaultFontStyles';
+import {
+  DefaultPalette
+} from './DefaultPalette';
 import { Customizer, getWindow } from '@uifabric/utilities/lib/index';
 export interface ITheme {
   palette: IPalette;
diff --git a/packages/styling/src/utilities/index.ts b/packages/styling/src/utilities/index.ts
index 8264f9df8a775..26d203ec8ceea 100644
--- a/packages/styling/src/utilities/index.ts
+++ b/packages/styling/src/utilities/index.ts
@@ -1,9 +1,3 @@
-export {
-  ITheme,
-  getTheme,
-  loadTheme,
-  createTheme
-} from './theme';
 export {
   mergeStyles
 } from './mergeStyles';

From bff150fa91e87c31d8d433092b007ee604f22d8b Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Tue, 20 Jun 2017 11:45:52 -0700
Subject: [PATCH 0137/1641] createApp: Add support for overriding the default
 route (#2019)

* Add test app for example app base

* Add custom hook for home route

* Breaking change to make the API more intuitive. Removes unused parameter, reorganizes parameters based on expected popularity.

* Rush change
---
 .../create-app_2017-06-20-01-08.json          |  11 +
 .../styling/create-app_2017-06-20-01-08.json  |  11 +
 common/config/rush/npm-shrinkwrap.json        | 775 +++++++++++-------
 packages/example-app-base/index.html          |  19 +
 packages/example-app-base/package.json        |   9 +-
 packages/example-app-base/src/index.demo.tsx  |  21 +
 .../src/utilities/createApp.tsx               |  16 +-
 .../example-app-base/webpack.serve.config.js  |  48 ++
 packages/example-component/src/demoIndex.tsx  |   2 +-
 packages/styling/src/index.demo.tsx           |   2 +-
 10 files changed, 620 insertions(+), 294 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/create-app_2017-06-20-01-08.json
 create mode 100644 common/changes/@uifabric/styling/create-app_2017-06-20-01-08.json
 create mode 100644 packages/example-app-base/index.html
 create mode 100644 packages/example-app-base/src/index.demo.tsx
 create mode 100644 packages/example-app-base/webpack.serve.config.js

diff --git a/common/changes/@uifabric/example-app-base/create-app_2017-06-20-01-08.json b/common/changes/@uifabric/example-app-base/create-app_2017-06-20-01-08.json
new file mode 100644
index 0000000000000..c5b3aff04f61c
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/create-app_2017-06-20-01-08.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Add support for adding a default route in createApp. Remove unused hideChrome parameter.",
+      "type": "major"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/create-app_2017-06-20-01-08.json b/common/changes/@uifabric/styling/create-app_2017-06-20-01-08.json
new file mode 100644
index 0000000000000..efa0574335ca2
--- /dev/null
+++ b/common/changes/@uifabric/styling/create-app_2017-06-20-01-08.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Consume latest version of createApp ",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 0067e2978da41..f4908916778c3 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -73,14 +73,9 @@
           "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "sinon": {
           "version": "1.17.7",
@@ -102,7 +97,14 @@
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         },
         "supports-color": {
           "version": "3.2.3",
@@ -203,19 +205,21 @@
           "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         },
         "supports-color": {
           "version": "3.2.3",
@@ -435,9 +439,9 @@
           "integrity": "sha1-aHKCNTXGkuLCoBA4Jq/YLC4P8XU="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "resolve": {
           "version": "1.1.7",
@@ -449,11 +453,6 @@
           "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
           "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
         },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-        },
         "send": {
           "version": "0.13.2",
           "resolved": "https://registry.npmjs.org/send/-/send-0.13.2.tgz",
@@ -472,7 +471,14 @@
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         },
         "supports-color": {
           "version": "3.2.3",
@@ -570,9 +576,9 @@
       "integrity": "sha1-DldYaol/ddjdDAKdKVtBapg4f5w=",
       "dependencies": {
         "@microsoft/api-extractor": {
-          "version": "2.0.8",
-          "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.0.8.tgz",
-          "integrity": "sha1-MbnfuwRtx2MYLgVQ+1shCD40nXA="
+          "version": "2.0.9",
+          "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.0.9.tgz",
+          "integrity": "sha1-4h0HMRm29kzCz/E70bP5Z0H+yI4="
         },
         "@microsoft/gulp-core-build-sass": {
           "version": "3.1.2",
@@ -580,9 +586,9 @@
           "integrity": "sha1-msehN3WBLY3s1/BOQrfy1BKjnCc="
         },
         "@microsoft/gulp-core-build-typescript": {
-          "version": "3.1.1",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.1.1.tgz",
-          "integrity": "sha1-e3gdjlKeSQzz5hB5eh+7fuZx01s="
+          "version": "3.1.3",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.1.3.tgz",
+          "integrity": "sha1-cq1XPBA8eu5G+v4IRnCmmlXTHKo="
         },
         "ansi-align": {
           "version": "2.0.0",
@@ -711,18 +717,46 @@
     "@rush-temp/example-app-base": {
       "version": "file:projects\\example-app-base",
       "dependencies": {
+        "acorn": {
+          "version": "5.0.3",
+          "bundled": true
+        },
         "async": {
           "version": "0.9.2",
           "bundled": true
         },
+        "camelcase": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "constants-browserify": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "crypto-browserify": {
+          "version": "3.11.0",
+          "bundled": true
+        },
         "debug": {
           "version": "2.6.0",
           "bundled": true
         },
+        "enhanced-resolve": {
+          "version": "3.1.0",
+          "bundled": true
+        },
         "glob": {
           "version": "7.1.1",
           "bundled": true
         },
+        "https-browserify": {
+          "version": "0.0.1",
+          "bundled": true
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
+        },
         "mocha": {
           "version": "3.3.0",
           "bundled": true
@@ -731,6 +765,30 @@
           "version": "0.7.2",
           "bundled": true
         },
+        "node-libs-browser": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "os-browserify": {
+          "version": "0.2.1",
+          "bundled": true
+        },
+        "readable-stream": {
+          "version": "2.3.0",
+          "bundled": true,
+          "dependencies": {
+            "string_decoder": {
+              "version": "1.0.2",
+              "bundled": true,
+              "dependencies": {
+                "safe-buffer": {
+                  "version": "5.0.1",
+                  "bundled": true
+                }
+              }
+            }
+          }
+        },
         "source-map": {
           "version": "0.1.43",
           "bundled": true
@@ -739,9 +797,63 @@
           "version": "0.2.1",
           "bundled": true
         },
+        "stream-browserify": {
+          "version": "2.0.1",
+          "bundled": true
+        },
         "supports-color": {
           "version": "3.1.2",
           "bundled": true
+        },
+        "tapable": {
+          "version": "0.2.6",
+          "bundled": true
+        },
+        "timers-browserify": {
+          "version": "2.0.2",
+          "bundled": true
+        },
+        "url": {
+          "version": "0.11.0",
+          "bundled": true,
+          "dependencies": {
+            "punycode": {
+              "version": "1.3.2",
+              "bundled": true
+            }
+          }
+        },
+        "watchpack": {
+          "version": "1.3.1",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.4.1",
+              "bundled": true
+            }
+          }
+        },
+        "webpack": {
+          "version": "2.6.1",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.4.1",
+              "bundled": true
+            },
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
+        },
+        "yargs": {
+          "version": "6.6.0",
+          "bundled": true
+        },
+        "yargs-parser": {
+          "version": "4.2.1",
+          "bundled": true
         }
       }
     },
@@ -1421,14 +1533,14 @@
       "integrity": "sha1-2fb4WDaaiLvGnvQCOAgfLWu8hhQ="
     },
     "@types/express": {
-      "version": "4.0.35",
-      "resolved": "https://registry.npmjs.org/@types/express/-/express-4.0.35.tgz",
-      "integrity": "sha1-YmfHtgpR+sRzRns8SgLNHkQYBf4="
+      "version": "4.0.36",
+      "resolved": "https://registry.npmjs.org/@types/express/-/express-4.0.36.tgz",
+      "integrity": "sha512-bT9q2eqH/E72AGBQKT50dh6AXzheTqigGZ1GwDiwmx7vfHff0bZOrvUWjvGpNWPNkRmX1vDF6wonG6rlpBHb1A=="
     },
     "@types/express-serve-static-core": {
-      "version": "4.0.46",
-      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.0.46.tgz",
-      "integrity": "sha512-dtJos9GpTYqX/LBvpu8xHxOQTeAXEgFzZkQmcLgxj/ZbNv0v+cpM3A2ZAiOljgNAbHeguPivFn2wHbNYvLJVcA=="
+      "version": "4.0.48",
+      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.0.48.tgz",
+      "integrity": "sha512-+W+fHO/hUI6JX36H8FlgdMHU3Dk4a/Fn08fW5qdd7MjPP/wJlzq9fkCrgaH0gES8vohVeqwefHwPa4ylVKyYIg=="
     },
     "@types/finalhandler": {
       "version": "0.0.31",
@@ -1481,9 +1593,9 @@
       "integrity": "sha1-y1UumCbKPAjZ5lSd6ezY8VQX8G0="
     },
     "@types/mime": {
-      "version": "0.0.29",
-      "resolved": "https://registry.npmjs.org/@types/mime/-/mime-0.0.29.tgz",
-      "integrity": "sha1-+8/TMFc7kS71nu7hRgK/rOYwdUs="
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.0.tgz",
+      "integrity": "sha512-pZ3X4wf0T07Zcp383IJLTrPBDLo/s9DAQQ7QkDMLJpoDNosUkSRSkbXt8OExwWkK8OEPzwqzBz7XvBHofCXcsA=="
     },
     "@types/minimatch": {
       "version": "2.0.29",
@@ -1531,9 +1643,9 @@
       "integrity": "sha1-vShOV8hPEyXacCur/IKlMoGQwMU="
     },
     "@types/react": {
-      "version": "15.0.28",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.28.tgz",
-      "integrity": "sha512-B63xn08FhmOGoOwOw4QswI4sMrEMqRMpPtcLmqJeXAABcAD6qha9OcJ890yorRgf5B9pG0GR9u5gGyWSgsLVCQ=="
+      "version": "15.0.29",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.29.tgz",
+      "integrity": "sha512-EL5P9r/q2gIsXJYS0yT9csyfwIMVhs2hnrtevDgSaB86sRmWPFFxIkTuP8wisKRRO6869AVR6dqmuqzFIAIWkg=="
     },
     "@types/react-addons-test-utils": {
       "version": "0.14.18",
@@ -1648,9 +1760,9 @@
       }
     },
     "@uifabric/styling": {
-      "version": "0.8.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.8.1.tgz",
-      "integrity": "sha512-7uldSHBNLP8dNfYg7W54WKTvLLqL9phUNkKUCxAIsXDpqx405ffk3QDVb2hos77Rc8bbNdujfk8IaXuUV/8Oyw=="
+      "version": "0.10.4",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.10.4.tgz",
+      "integrity": "sha512-2UisFmjBwudR8TMqZ0NwyMydgemawpSISA+c4JnxF/4XsyrUKtexCb8b+2DbMWeKMS+JSbWdjHjlLGs8q/4zLw=="
     },
     "@uifabric/utilities": {
       "version": "4.3.0",
@@ -1770,19 +1882,21 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         }
       }
     },
@@ -1813,6 +1927,11 @@
       "resolved": "https://registry.npmjs.org/array-differ/-/array-differ-1.0.0.tgz",
       "integrity": "sha1-7/UuN1gknTO+QCuLuOVkuytdQDE="
     },
+    "array-each": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/array-each/-/array-each-1.0.1.tgz",
+      "integrity": "sha1-p5SvDAWrF1KEbudTofIRoFugxE8="
+    },
     "array-find-index": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/array-find-index/-/array-find-index-1.0.2.tgz",
@@ -1824,9 +1943,9 @@
       "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI="
     },
     "array-slice": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/array-slice/-/array-slice-0.2.3.tgz",
-      "integrity": "sha1-3Tz7gO15c6dRF82sabC5nshhhvU="
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/array-slice/-/array-slice-1.0.0.tgz",
+      "integrity": "sha1-5zA08A3MH0CHYAj9IP6ud71LfC8="
     },
     "array-union": {
       "version": "1.0.2",
@@ -2302,9 +2421,9 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000686",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000686.tgz",
-      "integrity": "sha1-1VtHntbmQCwf0/H9j0bmlNhupGQ="
+      "version": "1.0.30000692",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000692.tgz",
+      "integrity": "sha1-Pampk1OtvOoeFCuZ9g7MYhbfR6U="
     },
     "capture-stack-trace": {
       "version": "1.0.0",
@@ -2978,9 +3097,9 @@
       "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA="
     },
     "decomment": {
-      "version": "0.8.7",
-      "resolved": "https://registry.npmjs.org/decomment/-/decomment-0.8.7.tgz",
-      "integrity": "sha1-JI8hFvbOOo6N0bY+WzWrpcoFTKU="
+      "version": "0.8.8",
+      "resolved": "https://registry.npmjs.org/decomment/-/decomment-0.8.8.tgz",
+      "integrity": "sha512-xVbmniKld/kjjmoHjT0Ex35aa16zw29WEzSAflBcMawjqDtZlrR6wkSwYV0mwJYytDz8JEAYia5Pl8IJRXdWLg=="
     },
     "deep-eql": {
       "version": "0.1.3",
@@ -3176,19 +3295,21 @@
           "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         }
       }
     },
@@ -3427,9 +3548,9 @@
       }
     },
     "esprima": {
-      "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz",
-      "integrity": "sha1-/cpRzuYTOJXjyI1TXOSdv/YqRjM="
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.0.tgz",
+      "integrity": "sha512-oftTcaMu/EGrEIu904mWteKIv8vMuOgGYo7EhVJJN00R/EED9DCua/xxHRdYnKtcECzVg7xOWhflvJMnqcFZjw=="
     },
     "estraverse": {
       "version": "1.9.3",
@@ -3486,6 +3607,11 @@
       "resolved": "https://registry.npmjs.org/expand-braces/-/expand-braces-0.1.2.tgz",
       "integrity": "sha1-SIsdHSRRyz06axks/AMPRMWFX+o=",
       "dependencies": {
+        "array-slice": {
+          "version": "0.2.3",
+          "resolved": "https://registry.npmjs.org/array-slice/-/array-slice-0.2.3.tgz",
+          "integrity": "sha1-3Tz7gO15c6dRF82sabC5nshhhvU="
+        },
         "braces": {
           "version": "0.1.5",
           "resolved": "https://registry.npmjs.org/braces/-/braces-0.1.5.tgz",
@@ -3712,9 +3838,16 @@
       "integrity": "sha1-QAQ5Kee8YK3wt/SCfExudaDeyhI="
     },
     "fined": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/fined/-/fined-1.0.2.tgz",
-      "integrity": "sha1-WyhCS3YNdZiWC374SA3/itNmDpc="
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/fined/-/fined-1.1.0.tgz",
+      "integrity": "sha1-s33IRLdqL15wgeiE98CuNE8VNHY=",
+      "dependencies": {
+        "expand-tilde": {
+          "version": "2.0.2",
+          "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-2.0.2.tgz",
+          "integrity": "sha1-l+gBqgUt8CRU3kawK/YhZCzchQI="
+        }
+      }
     },
     "first-chunk-stream": {
       "version": "1.0.0",
@@ -4563,19 +4696,21 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         }
       }
     },
@@ -4622,19 +4757,21 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         },
         "vinyl": {
           "version": "1.2.0",
@@ -4659,19 +4796,21 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         }
       }
     },
@@ -5178,19 +5317,21 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         }
       }
     },
@@ -5328,19 +5469,21 @@
           "integrity": "sha1-cTfmmzKYuzQiR6G77jiByA4v14s="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         },
         "strip-bom": {
           "version": "2.0.0",
@@ -5514,19 +5657,21 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         }
       }
     },
@@ -5563,9 +5708,9 @@
           "integrity": "sha1-7siBHbJ0V+AHjYypIfqBty+oK/Q="
         },
         "uglify-js": {
-          "version": "3.0.17",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.17.tgz",
-          "integrity": "sha1-0ijNVcLfmz0vU/FHVoy0zEpyzAY="
+          "version": "3.0.18",
+          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.18.tgz",
+          "integrity": "sha512-0M/KeXO8bPYtlqnwIYpO4R6om1mrScMzPuWn2UPfUYOaowIhQmmFpL9Q5tlD18ulKLRKD12GQ0IiYDKJS/si1w=="
         }
       }
     },
@@ -5580,19 +5725,21 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         }
       }
     },
@@ -6115,7 +6262,14 @@
     "js-yaml": {
       "version": "3.8.4",
       "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.8.4.tgz",
-      "integrity": "sha1-UgtFZPhlc7qWZir4Woyvp7S1pvY="
+      "integrity": "sha1-UgtFZPhlc7qWZir4Woyvp7S1pvY=",
+      "dependencies": {
+        "esprima": {
+          "version": "3.1.3",
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz",
+          "integrity": "sha1-/cpRzuYTOJXjyI1TXOSdv/YqRjM="
+        }
+      }
     },
     "jsbn": {
       "version": "0.1.1",
@@ -6331,19 +6485,21 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         }
       }
     },
@@ -6546,11 +6702,6 @@
       "resolved": "https://registry.npmjs.org/lodash.assignin/-/lodash.assignin-4.2.0.tgz",
       "integrity": "sha1-uo31+4QesKPoBEIysOJjqNxqKKI="
     },
-    "lodash.assignwith": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/lodash.assignwith/-/lodash.assignwith-4.2.0.tgz",
-      "integrity": "sha1-EnqX8CrcQXUalU0ksN4X4QDgOOs="
-    },
     "lodash.bind": {
       "version": "4.2.1",
       "resolved": "https://registry.npmjs.org/lodash.bind/-/lodash.bind-4.2.1.tgz",
@@ -6628,11 +6779,6 @@
       "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz",
       "integrity": "sha1-eeTriMNqgSKvhvhEqpvNhRtfu1U="
     },
-    "lodash.isempty": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/lodash.isempty/-/lodash.isempty-4.4.0.tgz",
-      "integrity": "sha1-b4bL7di+TsmHvpqvM8loTbGzHn4="
-    },
     "lodash.isequal": {
       "version": "4.5.0",
       "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
@@ -6873,19 +7019,21 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         }
       }
     },
@@ -6910,19 +7058,21 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         }
       }
     },
@@ -7329,6 +7479,23 @@
         }
       }
     },
+    "object.defaults": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/object.defaults/-/object.defaults-1.1.0.tgz",
+      "integrity": "sha1-On+GgzS0B96gbaFtiNXNKeQ1/s8=",
+      "dependencies": {
+        "for-own": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/for-own/-/for-own-1.0.0.tgz",
+          "integrity": "sha1-xjMy9BXO3EsE2/5wz4NklMU8tEs="
+        },
+        "isobject": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.0.tgz",
+          "integrity": "sha1-OVZSF/NmF4nooKDAgNX35rxG4aA="
+        }
+      }
+    },
     "object.entries": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/object.entries/-/object.entries-1.0.4.tgz",
@@ -7360,9 +7527,9 @@
       "integrity": "sha1-6mJvqUURirroSrsZc45KCLCHPx8="
     },
     "office-ui-fabric-react": {
-      "version": "4.7.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.7.0.tgz",
-      "integrity": "sha512-X/FHLjmUEgipp/BucZVFmw3x59DV3clKS5SDenFK9J4uQErHiXpS4OBRLs/gUgyxnrS5Xzu/CJk8hyp+I+LuEQ=="
+      "version": "4.8.3",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.8.3.tgz",
+      "integrity": "sha512-iCKS3wRmzO8Avl7d9n0qBeUiwZQ+HXYFYev3h2uIzQSuUZtyokN2nM+BC70g+Ws5hIqYNnx+i1UApejflJdsJw=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -7508,19 +7675,21 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         }
       }
     },
@@ -8065,9 +8234,9 @@
       "integrity": "sha1-4mDHj2Fhzdmw5WzD4Khd4Xx6V74="
     },
     "promise": {
-      "version": "7.1.1",
-      "resolved": "https://registry.npmjs.org/promise/-/promise-7.1.1.tgz",
-      "integrity": "sha1-SJZUxpJha4qlWwck+oCbt9tJxb8="
+      "version": "7.3.1",
+      "resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz",
+      "integrity": "sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg=="
     },
     "prop-types": {
       "version": "15.5.10",
@@ -8267,19 +8436,21 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         }
       }
     },
@@ -8309,19 +8480,21 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         }
       }
     },
@@ -8340,7 +8513,14 @@
     "recast": {
       "version": "0.11.23",
       "resolved": "https://registry.npmjs.org/recast/-/recast-0.11.23.tgz",
-      "integrity": "sha1-RR/TAEqx5N+bTktmN2sqIZEkYtM="
+      "integrity": "sha1-RR/TAEqx5N+bTktmN2sqIZEkYtM=",
+      "dependencies": {
+        "esprima": {
+          "version": "3.1.3",
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz",
+          "integrity": "sha1-/cpRzuYTOJXjyI1TXOSdv/YqRjM="
+        }
+      }
     },
     "rechoir": {
       "version": "0.6.2",
@@ -8469,19 +8649,21 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         }
       }
     },
@@ -9050,16 +9232,9 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q==",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "string_decoder": {
           "version": "1.0.2",
@@ -9113,19 +9288,21 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         }
       }
     },
@@ -9160,19 +9337,21 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         }
       }
     },
@@ -9353,19 +9532,21 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         }
       }
     },
@@ -9645,9 +9826,21 @@
       "integrity": "sha1-bgkk1r2mta/jSeOabWMoUKD4grc="
     },
     "uglifyjs-webpack-plugin": {
-      "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-0.4.3.tgz",
-      "integrity": "sha1-pnKn1mVflN+n4JZw1IAw83zJMmc="
+      "version": "0.4.6",
+      "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-0.4.6.tgz",
+      "integrity": "sha1-uVH0q7a9YX5m9j64kUmOORdj4wk=",
+      "dependencies": {
+        "source-list-map": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-2.0.0.tgz",
+          "integrity": "sha512-I2UmuJSRr/T8jisiROLU3A3ltr+swpniSmNPI4Ml3ZCX6tVnDsuZzK7F2hl5jTqbZBWCEKlj5HRQiPExXLgE8A=="
+        },
+        "webpack-sources": {
+          "version": "1.0.1",
+          "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-1.0.1.tgz",
+          "integrity": "sha512-05tMxipUCwHqYaVS8xc7sYPTly8PzXayRCB4dTxLhWTqlKUiwH6ezmEe0OSreL1c30LAuA3Zqmc+uEBUGFJDjw=="
+        }
+      }
     },
     "uid-safe": {
       "version": "2.1.4",
@@ -9788,9 +9981,9 @@
       "integrity": "sha1-ApT7kiu5N1FTVBxPcJYjHyh8ivg="
     },
     "uuid": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.0.1.tgz",
-      "integrity": "sha1-ZUS7ot/ajBzxfmKaOjBeK7H+5sE="
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.1.0.tgz",
+      "integrity": "sha512-DIWtzUkw04M4k3bf1IcpS2tngXEL26YUD2M0tMDUpnUrz2hgzUBlD55a4FjdLGPvfHxS6uluGWvaVEqgBcVa+g=="
     },
     "v8flags": {
       "version": "2.1.1",
@@ -9984,22 +10177,24 @@
           "integrity": "sha1-Y/xMzuXS13Y9Jrv4YBB45sLgBE8="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q==",
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg==",
           "dependencies": {
             "string_decoder": {
               "version": "1.0.2",
               "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-              "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+              "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+              "dependencies": {
+                "safe-buffer": {
+                  "version": "5.0.1",
+                  "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+                  "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+                }
+              }
             }
           }
         },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-        },
         "stream-browserify": {
           "version": "2.0.1",
           "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz",
@@ -10272,14 +10467,9 @@
           "integrity": "sha1-Y/xMzuXS13Y9Jrv4YBB45sLgBE8="
         },
         "readable-stream": {
-          "version": "2.2.11",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-          "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q=="
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
+          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
         },
         "stream-browserify": {
           "version": "2.0.1",
@@ -10289,7 +10479,14 @@
         "string_decoder": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk="
+          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+            }
+          }
         },
         "supports-color": {
           "version": "3.2.3",
diff --git a/packages/example-app-base/index.html b/packages/example-app-base/index.html
new file mode 100644
index 0000000000000..c509dc8c9f8f0
--- /dev/null
+++ b/packages/example-app-base/index.html
@@ -0,0 +1,19 @@
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" user-scalable="no" />
+  <title>Examples App Base</title>
+</head>
+
+<body>
+  <div id="content"></div>
+
+  <!-- Dependencies -->
+  <script src="./node_modules/react/dist/react.js"></script>
+  <script src="./node_modules/react-dom/dist/react-dom.js"></script>
+
+  <!-- Main -->
+  <script src="demo.js"></script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 5d8fd1c48d9fa..46bef015ac773 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -12,6 +12,7 @@
   "scripts": {
     "build": "gulp",
     "clean": "gulp clean",
+    "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.serve.config.js --open",
     "test": "gulp"
   },
   "devDependencies": {
@@ -24,6 +25,7 @@
     "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
+    "css-loader": "^0.28.0",
     "enzyme": "^2.7.0",
     "es6-promise": "^4.1.0",
     "gulp": "~3.9.1",
@@ -32,8 +34,13 @@
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
     "react-dom": "^15.4.2",
+    "sass-loader": "^6.0.3",
+    "style-loader": "^0.17.0",
     "source-map-loader": "0.2.1",
-    "typescript": "2.2.2"
+    "ts-loader": "^2.1.0",
+    "typescript": "2.2.2",
+    "webpack-dev-server": "^2.4.1",
+    "webpack": "^2.4.1"
   },
   "peerDependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/packages/example-app-base/src/index.demo.tsx b/packages/example-app-base/src/index.demo.tsx
new file mode 100644
index 0000000000000..2e866dda89522
--- /dev/null
+++ b/packages/example-app-base/src/index.demo.tsx
@@ -0,0 +1,21 @@
+import * as React from 'react';
+import { createApp } from './utilities/createApp';
+import { examplesOf } from './utilities/examplesOf';
+
+createApp([
+  examplesOf('Example Group')
+    .add('Example 1', () => (
+      <div>Some content for Example 1</div>
+    ))
+    .add('Example 2', () => (
+      <div>Some content for Example 2</div>
+    ))
+    .add('Example 3', () => (
+      <div>Some content for Example 3</div>
+    ))
+    .add('Example 4', () => (
+      <div>Some content for Example 4</div>
+    ))
+],
+  () => <div>Example App Home</div>,
+  'Example App');
diff --git a/packages/example-app-base/src/utilities/createApp.tsx b/packages/example-app-base/src/utilities/createApp.tsx
index 49c502e3dbfc8..50fce71f5f165 100644
--- a/packages/example-app-base/src/utilities/createApp.tsx
+++ b/packages/example-app-base/src/utilities/createApp.tsx
@@ -9,7 +9,14 @@ import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
 
 import { ExampleGroup, IExample } from './examplesOf';
 
-export function createApp(examples: ExampleGroup | ExampleGroup[], hideChrome?: boolean, appTitle?: string, headerLinks?: IAppLink[]) {
+/**
+ * Creates a <div> on the page and renders a demo app for React components organized into example groups.
+ * @param examples A set of pages, organized into groups, that are used to demo React components.
+ * @param defaultRouteComponent A function that returns the contents that will be displayed on the home page.
+ * @param appTitle A title for the application that will be displayed in the header.
+ * @param headerLinks A set of links to put in the header of the application.
+ */
+export function createApp(examples: ExampleGroup | ExampleGroup[], defaultRouteComponent: () => JSX.Element = () => null, appTitle?: string, headerLinks?: IAppLink[]) {
   let rootElement: HTMLElement | null;
   let groups: ExampleGroup[] = !Array.isArray(examples) ? [examples] : examples;
 
@@ -19,7 +26,7 @@ export function createApp(examples: ExampleGroup | ExampleGroup[], hideChrome?:
 
     setBaseUrl('./dist/');
 
-    let routes = groups.map((group, groupIndex) => group.examples.map(
+    let routes: (JSX.Element | JSX.Element[])[] = groups.map((group, groupIndex) => group.examples.map(
       (example: IExample, index: number) => (
         <Route
           key={ example.key }
@@ -28,6 +35,11 @@ export function createApp(examples: ExampleGroup | ExampleGroup[], hideChrome?:
         />
       )));
 
+    // Add the default route
+    routes.push(
+      <Route key='default' component={ defaultRouteComponent } />
+    );
+
     let appDefinition = _getDefinition(groups);
 
     if (appTitle) {
diff --git a/packages/example-app-base/webpack.serve.config.js b/packages/example-app-base/webpack.serve.config.js
new file mode 100644
index 0000000000000..b12eac3dd6649
--- /dev/null
+++ b/packages/example-app-base/webpack.serve.config.js
@@ -0,0 +1,48 @@
+const path = require('path');
+
+module.exports = {
+  entry: './src/index.demo.tsx',
+
+  output: {
+    path: path.resolve(__dirname, 'dist'),
+    filename: 'demo.js',
+  },
+
+  externals: {
+    'react': 'React',
+    'react-dom': 'ReactDOM'
+  },
+
+  resolve: {
+    extensions: ['.js', '.ts', '.tsx']
+  },
+
+  devtool: 'source-map',
+
+  devServer: {
+    inline: true,
+    port: 4322
+  },
+
+  module: {
+    loaders: [
+      {
+        test: /\.tsx?$/,
+        loader: 'ts-loader',
+        exclude: [
+          /node_modules/
+        ]
+      },
+      {
+        test: /\.scss$/,
+        use: [{
+          loader: "style-loader" // creates style nodes from JS strings
+        }, {
+          loader: "css-loader" // translates CSS into CommonJS
+        }, {
+          loader: "sass-loader" // compiles Sass to CSS
+        }]
+      }
+    ]
+  },
+}
diff --git a/packages/example-component/src/demoIndex.tsx b/packages/example-component/src/demoIndex.tsx
index 28bc327387cfe..bd91f35e82ed9 100644
--- a/packages/example-component/src/demoIndex.tsx
+++ b/packages/example-component/src/demoIndex.tsx
@@ -24,4 +24,4 @@ createApp([
       <ExampleComponent style={ { background: 'red' } } />
     ))
 
-], false);
+]);
diff --git a/packages/styling/src/index.demo.tsx b/packages/styling/src/index.demo.tsx
index 9dabca304becf..fce4c88d67613 100644
--- a/packages/styling/src/index.demo.tsx
+++ b/packages/styling/src/index.demo.tsx
@@ -34,4 +34,4 @@ createApp([
     .add('Animations', () => (
       <AnimationPage />
     ))
-], false);
+]);

From 788a876ee11ad747121215edc9886699a24d0cc3 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 20 Jun 2017 15:23:21 -0700
Subject: [PATCH 0138/1641] Panel headertext aria (#1994)

* Panel: Fixed header ID

* Panel: Fixed header ID

* Added change file

* Fixed casing of id suffix

* Created panel header props and passed in headerTextID to panel so that even custom render will get ID

* Moved ID into PanelProps, adding ID to props before passing toonRender

* Passing through only ID, adding suffix string in onRender

* Switch from assign to spreads
---
 ...anel-headertext-aria_2017-06-14-21-49.json | 11 ++++++++
 .../src/components/Panel/Panel.Props.ts       |  7 ++++-
 .../src/components/Panel/Panel.tsx            | 28 +++++++++++--------
 3 files changed, 33 insertions(+), 13 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/panel-headertext-aria_2017-06-14-21-49.json

diff --git a/common/changes/office-ui-fabric-react/panel-headertext-aria_2017-06-14-21-49.json b/common/changes/office-ui-fabric-react/panel-headertext-aria_2017-06-14-21-49.json
new file mode 100644
index 0000000000000..f737483c7f623
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/panel-headertext-aria_2017-06-14-21-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Panel: Fixed header ID value",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.Props.ts b/packages/office-ui-fabric-react/src/components/Panel/Panel.Props.ts
index ddd9dc77fbe2c..70c474f9a245e 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.Props.ts
@@ -139,6 +139,11 @@ export interface IPanelProps extends React.Props<Panel> {
    * Custom renderer for content in the sticky footer
    */
   onRenderFooterContent?: IRenderFunction<IPanelProps>;
+
+  /**
+   * Internal ID passed to render functions.
+   */
+  componentId?: string;
 }
 
 export enum PanelType {
@@ -225,4 +230,4 @@ export enum PanelType {
    * XXLarge: 643px width, 40px Left/Right padding
    */
   custom = 7
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
index cdd44f517b81e..b6cc4176d536e 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
@@ -82,6 +82,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
       layerProps,
       type,
       customWidth,
+      headerClassName,
       onRenderNavigation = this._onRenderNavigation,
       onRenderHeader = this._onRenderHeader,
       onRenderBody = this._onRenderBody,
@@ -93,6 +94,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
     let isOnRightSide = isRTL ? isLeft : !isLeft;
     const headerTextId = id + '-headerText';
     const customWidthStyles = (type === PanelType.custom) ? { width: customWidth } : {};
+    const renderProps: IPanelProps = { ...this.props, componentId: id };
 
     if (!isOpen && !isAnimating) {
       return null;
@@ -158,12 +160,12 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
               firstFocusableSelector={ firstFocusableSelector }
             >
               <div className={ css('ms-Panel-commands') } data-is-visible={ true } >
-                { onRenderNavigation(this.props, this._onRenderNavigation) }
+                { onRenderNavigation(renderProps, this._onRenderNavigation) }
               </div>
               <div className={ css('ms-Panel-contentInner', styles.contentInner) } >
-                { onRenderHeader(this.props, this._onRenderHeader) }
-                { onRenderBody(this.props, this._onRenderBody) }
-                { onRenderFooter(this.props, this._onRenderFooter) }
+                { onRenderHeader(renderProps, this._onRenderHeader) }
+                { onRenderBody(renderProps, this._onRenderBody) }
+                { onRenderFooter(renderProps, this._onRenderFooter) }
               </div>
             </FocusTrapZone>
           </div>
@@ -200,8 +202,8 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
   }
 
   @autobind
-  private _onRenderNavigation(props): JSX.Element {
-    let {
+  private _onRenderNavigation(props: IPanelProps): JSX.Element {
+    const {
       closeButtonAriaLabel,
       hasCloseButton
     } = props;
@@ -218,16 +220,18 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
   }
 
   @autobind
-  private _onRenderHeader(props): JSX.Element {
-    let {
+  private _onRenderHeader(props: IPanelProps): JSX.Element {
+    const {
       headerText,
-      headerTextId,
+      componentId,
       headerClassName = '',
     } = props;
+
+    const { id } = this.state;
     return (
       headerText &&
       <div className={ css('ms-Panel-header', styles.header) }>
-        <p className={ css('ms-Panel-headerText', styles.headerText, headerClassName) } id={ headerTextId } role='heading'>
+        <p className={ css('ms-Panel-headerText', styles.headerText, headerClassName) } id={ componentId + '-headerText' } role='heading'>
           { headerText }
         </p>
       </div>
@@ -235,7 +239,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
   }
 
   @autobind
-  private _onRenderBody(props): JSX.Element {
+  private _onRenderBody(props: IPanelProps): JSX.Element {
     return (
       <div className={ css('ms-Panel-content', styles.content) } ref={ this._resolveRef('_content') }>
         { props.children }
@@ -244,7 +248,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
   }
 
   @autobind
-  private _onRenderFooter(props): JSX.Element {
+  private _onRenderFooter(props: IPanelProps): JSX.Element {
     let { isFooterSticky } = this.state;
     let { onRenderFooterContent = null } = this.props;
     return (

From 135c06a013468eb717fddab4ccabd6d63274fe4b Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 20 Jun 2017 15:52:31 -0700
Subject: [PATCH 0139/1641] Styling performance updates (#2026)

* Removing iconclass usage.

* Optimization in using icon dumb component.

* Update to rush install script to force install

* Updating the icon usage in textfield, tweaking the alignment of the error to use flex align-items center.

* Performance improvements across the board to reduce the re-registering of styles.

* Memoize icon.

* Addressing a number of issues with styling.

* Adding change files.

* Fixing casing in icons.

* Removing the classname. While it may be backwards compatible with fabric-core, it is not compatible with injecting the code in the children. The code is more efficient since we don't need to add another css class so i'm removing the class.
---
 apps/todo-app/src/components/TodoItem.tsx     |   2 +-
 .../styling/icons_2017-06-20-17-51.json       |  11 ++
 .../icons_2017-06-20-17-51.json               |  11 ++
 package.json                                  |   4 +-
 .../src/components/Breadcrumb/Breadcrumb.tsx  |  10 +-
 .../Button/BaseButton.classNames.ts           |  91 +++++++++++++
 .../src/components/Button/BaseButton.tsx      | 121 ++----------------
 .../src/components/Calendar/CalendarDay.tsx   |   4 +-
 .../src/components/Calendar/CalendarMonth.tsx |   8 +-
 .../src/components/Check/Check.tsx            |  16 +--
 .../src/components/ComboBox/ComboBox.tsx      |   2 +-
 .../src/components/CommandBar/CommandBar.tsx  |   4 +-
 .../CommandBar.Customization.Example.tsx      |   2 +-
 .../src/components/DatePicker/DatePicker.tsx  |   2 +-
 .../components/DetailsList/DetailsList.tsx    |  50 ++++----
 .../DocumentCard/DocumentCardActions.tsx      |   2 +-
 .../src/components/Dropdown/Dropdown.tsx      |   2 +-
 .../src/components/Fabric/Fabric.styles.ts    |  10 +-
 .../src/components/Fabric/Fabric.tsx          |  30 +++--
 .../src/components/Facepile/Facepile.tsx      |   2 +-
 .../src/components/Icon/Icon.styles.ts        |   9 +-
 .../src/components/Icon/Icon.tsx              |   8 +-
 .../List/examples/List.Basic.Example.tsx      |   2 +-
 .../src/components/Nav/Nav.tsx                |   6 +-
 .../src/components/TextField/TextField.scss   |   3 +-
 .../src/components/TextField/TextField.tsx    |   6 +-
 .../examples/TextField.Basic.Example.tsx      |   4 +-
 .../components/pickers/TagPicker/TagItem.tsx  |   2 +-
 .../styling/src/classNames/IconClassNames.ts  |  21 +--
 .../styling/src/utilities/buildClassMap.ts    |  28 +++-
 30 files changed, 260 insertions(+), 213 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/icons_2017-06-20-17-51.json
 create mode 100644 common/changes/office-ui-fabric-react/icons_2017-06-20-17-51.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts

diff --git a/apps/todo-app/src/components/TodoItem.tsx b/apps/todo-app/src/components/TodoItem.tsx
index 0108328a22443..f9ed464eb7a60 100644
--- a/apps/todo-app/src/components/TodoItem.tsx
+++ b/apps/todo-app/src/components/TodoItem.tsx
@@ -60,7 +60,7 @@ export default class TodoItem extends React.Component<ITodoItemProps, {}> {
             />
             <IconButton
               className={ styles.deleteButton }
-              iconProps={ { iconName: 'x' } }
+              iconProps={ { iconName: 'X' } }
               onClick={ this._onDelete }
               title={ strings.deleteItemTitle }
               ariaLabel={ strings.deleteItemAriaLabel }
diff --git a/common/changes/@uifabric/styling/icons_2017-06-20-17-51.json b/common/changes/@uifabric/styling/icons_2017-06-20-17-51.json
new file mode 100644
index 0000000000000..2e64b5548bce0
--- /dev/null
+++ b/common/changes/@uifabric/styling/icons_2017-06-20-17-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "General class exports now register on demand, resulting in less unneeded evaluation of classnames.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/icons_2017-06-20-17-51.json b/common/changes/office-ui-fabric-react/icons_2017-06-20-17-51.json
new file mode 100644
index 0000000000000..9703377b596e9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/icons_2017-06-20-17-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Icons: now with less redundant evaluation of styling, which improves render performance.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/package.json b/package.json
index 7a84505619937..899dcc1bdc1c5 100644
--- a/package.json
+++ b/package.json
@@ -8,7 +8,7 @@
     "url": "https://github.com/OfficeDev/office-ui-fabric-react"
   },
   "scripts": {
-    "_rushInstall": "node node_modules/@microsoft/rush/bin/rush install",
+    "_rushInstall": "node node_modules/@microsoft/rush/bin/rush install -c",
     "_rushBuild": "node node_modules/@microsoft/rush/bin/rush build --verbose",
     "_rushBuildToFabric": "node node_modules/@microsoft/rush/bin/rush build --to office-ui-fabric-react",
     "_rushRebuild": "node node_modules/@microsoft/rush/bin/rush rebuild --production --verbose",
@@ -28,4 +28,4 @@
     "gulp": "^3.9.1",
     "yargs": "^6.5.0"
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
index e914990ca2bae..2b2e2388b7e89 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
@@ -92,7 +92,7 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
               <li className={ css('ms-Breadcrumb-overflow', styles.overflow) } key={ OVERFLOW_KEY } ref={ OVERFLOW_KEY }>
                 <IconButton
                   className={ css('ms-Breadcrumb-overflowButton', styles.overflowButton) }
-                  iconProps={ { iconName: 'more' } }
+                  iconProps={ { iconName: 'More' } }
                   role='button'
                   aria-haspopup='true'
                   menuIconProps={ { iconName: null } }
@@ -101,10 +101,10 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
                     directionalHint: DirectionalHint.bottomLeftEdge
                   } }
                 />
-                <Icon
-                  className={ css('ms-Breadcrumb-chevron', styles.chevron) }
-                  iconName={ getRTL() ? 'ChevronLeft' : 'ChevronRight' }
-                />
+                { Icon({
+                  className: css('ms-Breadcrumb-chevron', styles.chevron),
+                  iconName: getRTL() ? 'ChevronLeft' : 'ChevronRight'
+                }) }
               </li>
             ) }
             { renderedItems.map(
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
new file mode 100644
index 0000000000000..623f29a17fcf0
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
@@ -0,0 +1,91 @@
+import { memoizeFunction } from '../../Utilities';
+import { mergeStyles } from '../../Styling';
+import { IButtonStyles } from './Button.Props';
+
+export interface IButtonClassNames {
+  root?: string;
+  flexContainer?: string;
+  icon?: string;
+  label?: string;
+  menuIcon?: string;
+  description?: string;
+  screenReaderText?: string;
+}
+
+export const getClassNames = memoizeFunction((
+  styles: IButtonStyles,
+  className: string,
+  variantClassName: string,
+  iconClassName: string,
+  disabled: boolean,
+  checked: boolean
+): IButtonClassNames => {
+  return {
+    root: mergeStyles(
+      className,
+      'ms-Button',
+      variantClassName,
+      styles.root,
+      checked && [
+        'is-checked',
+        styles.rootChecked
+      ],
+      disabled && [
+        'is-disabled',
+        styles.rootDisabled
+      ],
+      !disabled && {
+        ':hover': styles.rootHovered,
+        ':hover .ms-Button-description': styles.descriptionHovered,
+        ':active': styles.rootPressed,
+        ':active .ms-Button-description': styles.descriptionPressed
+      },
+      disabled && checked && [
+        styles.rootCheckedDisabled
+      ],
+      !disabled && checked && {
+        ':hover': styles.rootCheckedHovered,
+        ':active': styles.rootCheckedPressed
+      }
+    ) as string,
+
+    flexContainer: mergeStyles(
+      'ms-Button-flexContainer',
+      styles.flexContainer
+    ) as string,
+
+    icon: mergeStyles(
+      'ms-Button-icon',
+      iconClassName,
+      styles.icon,
+      checked && styles.iconChecked,
+      disabled && styles.iconDisabled,
+    ) as string,
+
+    label: mergeStyles(
+      'ms-Button-label',
+      styles.label,
+      checked && styles.labelChecked,
+      disabled && styles.labelDisabled,
+    ) as string,
+
+    menuIcon: mergeStyles(
+      'ms-Button-menuIcon',
+      styles.menuIcon,
+      checked && styles.menuIconChecked,
+      disabled && styles.menuIconDisabled
+    ) as string,
+
+    description: mergeStyles(
+      'ms-Button-description',
+      styles.description,
+      checked && styles.descriptionChecked,
+      disabled && styles.descriptionDisabled
+    ) as string,
+
+    screenReaderText: mergeStyles(
+      'ms-Button-screenReaderText',
+      styles.screenReaderText
+    ) as string
+  };
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 70becadf431c6..c3dff6f6d873e 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -7,14 +7,13 @@ import {
   autobind,
   buttonProperties,
   getId,
-  getNativeProps,
-  memoize
+  getNativeProps
 } from '../../Utilities';
-import { mergeStyles } from '../../Styling';
 import { Icon, IIconProps } from '../../Icon';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { ContextualMenu, IContextualMenuProps } from '../../ContextualMenu';
-import { IButtonProps, IButton, IButtonStyles } from './Button.Props';
+import { IButtonProps, IButton } from './Button.Props';
+import { IButtonClassNames, getClassNames } from './BaseButton.classNames';
 
 export interface IBaseButtonProps extends IButtonProps {
   baseClassName?: string;
@@ -25,16 +24,6 @@ export interface IBaseButtonState {
   menuProps?: IContextualMenuProps | null;
 }
 
-interface IButtonClassNames {
-  root?: string;
-  flexContainer?: string;
-  icon?: string;
-  label?: string;
-  menuIcon?: string;
-  description?: string;
-  screenReaderText?: string;
-}
-
 export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState> implements IButton {
 
   public static defaultProps = {
@@ -81,7 +70,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       variantClassName
          } = this.props;
 
-    this._classNames = this._getClassNames(
+    this._classNames = getClassNames(
       styles,
       className,
       variantClassName,
@@ -170,14 +159,12 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       onRenderMenuIcon = this._onRenderMenuIcon
     } = props;
 
-    const className = mergeStyles(baseClassName + '-flexContainer', styles.flexContainer);
-
     return React.createElement(
       tag,
       buttonProps,
       React.createElement(
         'div',
-        { className },
+        { className: this._classNames.flexContainer },
         onRenderIcon(props, this._onRenderIcon),
         onRenderText(props, this._onRenderText),
         onRenderDescription(props, this._onRenderDescription),
@@ -206,7 +193,10 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     }
 
     return iconProps && (
-      <Icon { ...iconProps } className={ this._classNames.icon } />
+      Icon({
+        ...iconProps,
+        className: this._classNames.icon
+      })
     );
   }
 
@@ -287,8 +277,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       checked,
       disabled,
       menuIconName,
-      menuIconProps,
-      styles
+      menuIconProps
        } = this.props;
 
     if (menuIconProps === undefined) {
@@ -301,14 +290,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       menuIconProps ?
         <Icon
           { ...menuIconProps }
-          className={
-            mergeStyles(
-              `${baseClassName}-icon`,
-              styles.menuIcon,
-              disabled && styles.menuIconDisabled,
-              !disabled && checked && styles.menuIconChecked,
-              menuIconProps.className
-            ) as string }
+          className={ this._classNames.icon }
         />
         :
         null
@@ -323,7 +305,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         id={ this._labelId + '-menu' }
         directionalHint={ DirectionalHint.bottomLeftEdge }
         {...menuProps}
-        className={ mergeStyles('ms-BaseButton-menuhost', menuProps.className) as string }
+        className={ 'ms-BaseButton-menuhost ' + menuProps.className }
         target={ this._buttonElement }
         labelElementId={ this._labelId }
         onDismiss={ this._onToggleMenu }
@@ -338,83 +320,4 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
 
     this.setState({ menuProps: currentMenuProps ? null : menuProps });
   }
-
-  @memoize
-  private _getClassNames(
-    styles: IButtonStyles,
-    className: string,
-    variantClassName: string,
-    iconClassName: string,
-    disabled: boolean,
-    checked: boolean
-    ): IButtonClassNames {
-    return {
-      root: mergeStyles(
-        className,
-        'ms-Button',
-        variantClassName,
-        styles.root,
-        checked && [
-          'is-checked',
-          styles.rootChecked
-        ],
-        disabled && [
-          'is-disabled',
-          styles.rootDisabled
-        ],
-        !disabled && {
-          ':hover': styles.rootHovered,
-          ':hover .ms-Button-description': styles.descriptionHovered,
-          ':active': styles.rootPressed,
-          ':active .ms-Button-description': styles.descriptionPressed
-        },
-        disabled && checked && [
-          styles.rootCheckedDisabled
-        ],
-        !disabled && checked && {
-          ':hover': styles.rootCheckedHovered,
-          ':active': styles.rootCheckedPressed
-        }
-      ) as string,
-
-      flexContainer: mergeStyles(
-        'ms-Button-flexContainer',
-        styles.flexContainer
-      ) as string,
-
-      icon: mergeStyles(
-        'ms-Button-icon',
-        iconClassName,
-        styles.icon,
-        checked && styles.iconChecked,
-        disabled && styles.iconDisabled,
-      ) as string,
-
-      label: mergeStyles(
-        'ms-Button-label',
-        styles.label,
-        checked && styles.labelChecked,
-        disabled && styles.labelDisabled,
-      ) as string,
-
-      menuIcon: mergeStyles(
-        'ms-Button-menuIcon',
-        styles.menuIcon,
-        checked && styles.menuIconChecked,
-        disabled && styles.menuIconDisabled
-      ) as string,
-
-      description: mergeStyles(
-        'ms-Button-description',
-        styles.description,
-        checked && styles.descriptionChecked,
-        disabled && styles.descriptionDisabled
-      ) as string,
-
-      screenReaderText: mergeStyles(
-        'ms-Button-screenReaderText',
-        styles.screenReaderText
-      ) as string
-    };
-  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index f924f5ff36312..afa4b3b830853 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -105,7 +105,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
               aria-label={ strings.prevMonthAriaLabel }
               role='button'
               tabIndex={ 0 }>
-              <Icon iconName={ getRTL() ? 'chevronRight' : 'chevronLeft' } />
+              <Icon iconName={ getRTL() ? 'ChevronRight' : 'ChevronLeft' } />
             </span >
             <span
               className={ css('ms-DatePicker-nextMonth js-nextMonth', styles.nextMonth) }
@@ -115,7 +115,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
               aria-label={ strings.nextMonthAriaLabel }
               role='button'
               tabIndex={ 0 }>
-              <Icon iconName={ getRTL() ? 'chevronLeft' : 'chevronRight' } />
+              <Icon iconName={ getRTL() ? 'ChevronLeft' : 'ChevronRight' } />
             </span >
           </div >
           <div className={ css('ms-DatePicker-headerToggleView js-showMonthPicker', styles.headerToggleView) } />
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
index df6ebe204a673..b73d3368967ee 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
@@ -53,7 +53,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
               aria-label={ strings.prevYearAriaLabel }
               role='button'
               tabIndex={ 0 }>
-              <Icon iconName={ getRTL() ? 'chevronRight' : 'chevronLeft' } />
+              <Icon iconName={ getRTL() ? 'ChevronRight' : 'ChevronLeft' } />
             </span>
             <span
               className={ css('ms-DatePicker-nextYear js-nextYear', styles.nextYear) }
@@ -62,7 +62,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
               aria-label={ strings.nextYearAriaLabel }
               role='button'
               tabIndex={ 0 }>
-              <Icon iconName={ getRTL() ? 'chevronLeft' : 'chevronRight' } />
+              <Icon iconName={ getRTL() ? 'ChevronLeft' : 'ChevronRight' } />
             </span>
           </div>
           <div className={ css('ms-DatePicker-currentYear js-showYearPicker', styles.currentYear) }>{ navigatedDate.getFullYear() }</div>
@@ -96,12 +96,12 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
   private _onSelectNextYear() {
     let { navigatedDate, onNavigateDate } = this.props;
     onNavigateDate(addYears(navigatedDate, 1), false);
-  };
+  }
 
   private _onSelectPrevYear() {
     let { navigatedDate, onNavigateDate } = this.props;
     onNavigateDate(addYears(navigatedDate, -1), false);
-  };
+  }
 
   private _onSelectMonth(newMonth: number) {
     let { navigatedDate, onNavigateDate } = this.props;
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.tsx b/packages/office-ui-fabric-react/src/components/Check/Check.tsx
index c8e409bc44aa9..26172924a8efa 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.tsx
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.tsx
@@ -39,14 +39,14 @@ export class Check extends BaseComponent<ICheckProps, {}> {
         styles.root,
         isChecked && ('is-checked ' + styles.rootIsChecked)
       ) }>
-        <Icon
-          className={ css('ms-Check-circle', styles.circle) }
-          iconName='circleRing'
-        />
-        <Icon
-          className={ css('ms-Check-check', styles.check) }
-          iconName='checkMark'
-        />
+        { Icon({
+          className: 'ms-Check-circle ' + styles.circle,
+          iconName: 'CircleRing'
+        }) }
+        { Icon({
+          className: 'ms-Check-check ' + styles.check,
+          iconName: 'CheckMark'
+        }) }
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index bc7e5e8748c47..6aa96b2d66c8b 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -61,7 +61,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     options: [],
     allowFreeform: false,
     autoComplete: true,
-    buttonIconProps: { iconName: 'chevronDown' }
+    buttonIconProps: { iconName: 'ChevronDown' }
   };
 
   public refs: {
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 4c7aed048d603..a44ef2853a265 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -94,7 +94,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
           <div className={ css(
             'ms-CommandBarSearch-iconWrapper ms-CommandBarSearch-iconSearchWrapper',
             styles.searchIconWrapper, styles.searchIconSearchWrapper) }>
-            <Icon iconName='search' />
+            { Icon({ iconName: 'Search' }) }
           </div>
           <div className={ css(
             'ms-CommandBarSearch-iconWrapper ms-CommandBarSearch-iconClearWrapper',
@@ -197,7 +197,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
               </span>
             ) }
             { hasSubmenuItems(item) ? (
-              <Icon className={ css('ms-CommandBarItem-chevronDown', styles.itemChevronDown) } iconName='chevronDown' />
+              <Icon className={ css('ms-CommandBarItem-chevronDown', styles.itemChevronDown) } iconName='ChevronDown' />
             ) : (null) }
           </button>;
         } else if (item.href) {
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
index 513d7e76737e2..9d9c5b616b0e5 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
@@ -75,7 +75,7 @@ export class CommandBarCustomizationExample extends React.Component<any, ISplitD
         ) } ref={ ref => this.container = ref }>
           <CommandButton
             className={ mainBtnClassName }
-            iconProps={ { iconName: 'add' } }
+            iconProps={ { iconName: 'Add' } }
             text='New' />
           <span className={ styles.splitter }>|</span>
           <CommandButton
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 05e0ea5bf1aa1..f1f82f0d30bfa 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -197,7 +197,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
             placeholder={ placeholder }
             borderless={ borderless }
             iconProps={ {
-              iconName: 'calendar',
+              iconName: 'Calendar',
               className: css(
                 label ? 'ms-DatePicker-event--with-label' : 'ms-DatePicker-event--without-label',
                 label ? styles.eventWithLabel : styles.eventWithoutLabel
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 1a38d8949dcd9..1f4bf8653dd06 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -68,15 +68,13 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     isHeaderVisible: true
   };
 
-  public refs: {
-    [key: string]: React.ReactInstance,
-    header: DetailsHeader,
-    root: HTMLElement,
-    groupedList: GroupedList,
-    list: List,
-    focusZone: FocusZone,
-    selectionZone: SelectionZone
-  };
+  // References
+  private _root: HTMLElement;
+  private _header: DetailsHeader;
+  private _groupedList: GroupedList;
+  private _list: List;
+  private _focusZone: FocusZone;
+  private _selectionZone: SelectionZone;
 
   private _selection: ISelection;
   private _activeRows: { [key: string]: DetailsRow };
@@ -258,7 +256,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       // If shouldApplyApplicationRole is true, role application will be applied to make arrow keys work
       // with JAWS.
       <div
-        ref='root'
+        ref={ this._resolveRef('_root') }
         className={ css('ms-DetailsList', styles.root, className, {
           'is-fixed': layoutMode === DetailsListLayoutMode.fixedColumns,
           ['is-horizontalConstrained ' + styles.rootIsHorizontalConstrained]: constrainMode === ConstrainMode.horizontalConstrained
@@ -275,7 +273,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
           <div onKeyDown={ this._onHeaderKeyDown } role='presentation'>
             { isHeaderVisible && (
               <DetailsHeader
-                ref='header'
+                ref={ this._resolveRef('_header') }
                 selectionMode={ selectionMode }
                 layoutMode={ layoutMode }
                 selection={ selection }
@@ -295,16 +293,16 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
               />
             ) }
           </div>
-          <div ref='contentContainer' onKeyDown={ this._onContentKeyDown } role='presentation'>
+          <div onKeyDown={ this._onContentKeyDown } role='presentation'>
             <FocusZone
-              ref='focusZone'
+              ref={ this._resolveRef('_focusZone') }
               className={ styles.focusZone }
               direction={ FocusZoneDirection.vertical }
               isInnerZoneKeystroke={ isRightArrow }
               onActiveElementChanged={ this._onActiveRowChanged }
             >
               <SelectionZone
-                ref='selectionZone'
+                ref={ this._resolveRef('_selectionZone') }
                 selection={ selection }
                 selectionPreservedOnEmptyClick={ selectionPreservedOnEmptyClick }
                 selectionMode={ selectionMode }
@@ -313,6 +311,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
               >
                 { groups ? (
                   <GroupedList
+                    ref={ this._resolveRef('_groupedList') }
                     groups={ groups }
                     groupProps={ groupProps }
                     items={ items }
@@ -324,15 +323,14 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
                     eventsToRegister={ rowElementEventMap }
                     listProps={ additionalListProps }
                     onGroupExpandStateChanged={ this._onGroupExpandStateChanged }
-                    ref='groupedList'
                   />
                 ) : (
                     <List
+                      ref={ this._resolveRef('_list') }
                       role='presentation'
                       items={ items }
                       onRenderCell={ (item, itemIndex) => this._onRenderCell(0, item, itemIndex) }
                       { ...additionalListProps }
-                      ref='list'
                     />
                   )
                 }
@@ -416,7 +414,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
 
   private _onHeaderKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
     if (ev.which === KeyCodes.down) {
-      if (this.refs.focusZone && this.refs.focusZone.focus()) {
+      if (this._focusZone && this._focusZone.focus()) {
         ev.preventDefault();
         ev.stopPropagation();
       }
@@ -425,7 +423,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
 
   private _onContentKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
     if (ev.which === KeyCodes.up) {
-      if (this.refs.header && this.refs.header.focus()) {
+      if (this._header && this._header.focus()) {
         ev.preventDefault();
         ev.stopPropagation();
       }
@@ -461,8 +459,8 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   private _setFocusToRowIfPending(row: DetailsRow) {
     let index = row.props.itemIndex;
     if (this._initialFocusedIndex !== undefined && index === this._initialFocusedIndex) {
-      if (this.refs.selectionZone) {
-        this.refs.selectionZone.ignoreNextFocus();
+      if (this._selectionZone) {
+        this._selectionZone.ignoreNextFocus();
       }
       this._async.setTimeout(() => {
         row.focus();
@@ -487,17 +485,17 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     this.setState({
       isCollapsed: collapsed
     });
-    if (this.refs.groupedList) {
-      this.refs.groupedList.toggleCollapseAll(collapsed);
+    if (this._groupedList) {
+      this._groupedList.toggleCollapseAll(collapsed);
     }
   }
 
   private _forceListUpdates() {
-    if (this.refs.groupedList) {
-      this.refs.groupedList.forceUpdate();
+    if (this._groupedList) {
+      this._groupedList.forceUpdate();
     }
-    if (this.refs.list) {
-      this.refs.list.forceUpdate();
+    if (this._list) {
+      this._list.forceUpdate();
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActions.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActions.tsx
index 5c62da9e55416..0b3dcf1744b48 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActions.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActions.tsx
@@ -23,7 +23,7 @@ export class DocumentCardActions extends BaseComponent<IDocumentCardActionsProps
 
         { views > 0 && (
           <div className={ css('ms-DocumentCardActions-views', styles.views) }>
-            <Icon iconName='view' />
+            <Icon iconName='View' />
             { views }
           </div>
         ) }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 96f673c876046..add999e84025e 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -164,7 +164,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
                 onRenderPlaceHolder(this.props, this._onRenderPlaceHolder)
             }
           </span>
-          <Icon className={ css('ms-Dropdown-caretDown', styles.caretDown) } iconName='chevronDown' />
+          <Icon className={ css('ms-Dropdown-caretDown', styles.caretDown) } iconName='ChevronDown' />
         </div>
         { isOpen && (
           onRenderContainer(this.props, this._onRenderContainer)
diff --git a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.styles.ts b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.styles.ts
index 555bb0c05c1e4..eeecff0bf733b 100644
--- a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.styles.ts
@@ -1,11 +1,11 @@
 
 import {
-  memoizeFunction,
+  memoizeFunction
 } from '../../Utilities';
 import {
   ITheme,
   IStyle,
-  getTheme
+  mergeStyles
 } from '../../Styling';
 
 const inheritFont = { fontFamily: 'inherit' };
@@ -15,16 +15,16 @@ export interface IFabricStyles {
 }
 
 export const getStyles = memoizeFunction((
-  theme: ITheme = getTheme()
+  theme: ITheme
 ): IFabricStyles => {
   return {
-    root: [
+    root: mergeStyles([
       theme.fonts.medium,
       {
         color: theme.palette.neutralPrimary,
         '& button': inheritFont,
         '& input': inheritFont
       }
-    ]
+    ])
   };
 });
diff --git a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
index 4bd15dbbd820c..18a64d757afb7 100644
--- a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
+++ b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
@@ -1,10 +1,14 @@
 import * as React from 'react';
 import {
   BaseComponent,
-  KeyCodes
+  KeyCodes,
+  customizable,
+  css,
+  getNativeProps,
+  divProperties
 } from '../../Utilities';
 import {
-  mergeStyles
+  ITheme
 } from '../../Styling';
 import { getStyles } from './Fabric.styles';
 
@@ -20,6 +24,9 @@ const DIRECTIONAL_KEY_CODES = [
   KeyCodes.pageDown
 ];
 
+export interface IFabricProps extends React.HTMLAttributes<HTMLDivElement> {
+  theme?: ITheme;
+}
 export interface IFabricState {
   isFocusVisible?: boolean;
 }
@@ -33,11 +40,9 @@ if (typeof (document) === 'object' && document.documentElement && !document.docu
   document.documentElement.setAttribute('dir', 'ltr');
 }
 
-export class Fabric extends BaseComponent<React.HTMLAttributes<HTMLDivElement>, IFabricState> {
-  public refs: {
-    [key: string]: React.ReactInstance;
-    root: HTMLElement;
-  };
+@customizable(['theme'])
+export class Fabric extends BaseComponent<IFabricProps, IFabricState> {
+  private _root: HTMLElement;
 
   constructor() {
     super();
@@ -54,17 +59,22 @@ export class Fabric extends BaseComponent<React.HTMLAttributes<HTMLDivElement>,
 
   public render() {
     const { isFocusVisible } = this.state;
-    const styles = getStyles();
+    const styles = getStyles(this.props.theme);
 
-    const rootClass = mergeStyles(
+    const rootClass = css(
       'ms-Fabric',
       styles.root,
       this.props.className,
       isFocusVisible && 'is-focusVisible'
     ) as string;
 
+    let divProps = getNativeProps(this.props, divProperties);
     return (
-      <div { ...this.props } className={ rootClass } ref='root' />
+      <div
+        { ...divProps }
+        className={ rootClass }
+        ref={ this._resolveRef('_root') }
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
index 138435550aa55..e1fc34ba31920 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
@@ -211,7 +211,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
         size={ personaSize }
         hidePersonaDetails={ true }
         onRenderInitials={ () => (
-          <Icon iconName='addFriend' />
+          <Icon iconName='AddFriend' />
         ) }
       />
     </BaseButton>;
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.styles.ts b/packages/office-ui-fabric-react/src/components/Icon/Icon.styles.ts
index f6596c5c48f4a..ae37d597b1a03 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.styles.ts
@@ -15,9 +15,12 @@ export const getStyles = memoizeFunction((
 ): IIconStyles => {
   let iconStyles = {
 
-    root: mergeStyles({
-      display: 'inline-block'
-    }),
+    root: mergeStyles([
+      theme.fonts.icon,
+      {
+        display: 'inline-block'
+      }
+    ]),
 
     imageContainer: mergeStyles({
       overflow: 'hidden'
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
index a5dc517b0d035..c748c92005d12 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
@@ -9,7 +9,7 @@ import {
   getNativeProps,
   htmlElementProperties
 } from '../../Utilities';
-import { IconClassNames } from '../../Styling';
+import { IconCodes } from '../../Styling';
 import { getStyles } from './Icon.styles';
 
 export function Icon(props: IIconProps): JSX.Element {
@@ -54,12 +54,12 @@ export function Icon(props: IIconProps): JSX.Element {
         className={
           css(
             'ms-Icon',
-            iconName && ('ms-Icon--' + iconName),
-            iconMemberName && IconClassNames[iconMemberName],
             styles.root,
             props.className
           ) }
-      />
+      >
+        { IconCodes[iconMemberName] }
+      </i>
     );
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx
index 0314f7d60dbb1..268b203c8eb37 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx
@@ -57,7 +57,7 @@ export class ListBasicExample extends React.Component<IListBasicExampleProps, an
               </div>
               <Icon
                 className='ms-ListBasicExample-chevron'
-                iconName={ getRTL() ? 'chevronLeft' : 'chevronRight' }
+                iconName={ getRTL() ? 'ChevronLeft' : 'ChevronRight' }
               />
             </div>
           ) }
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
index 97a3663c40215..0d9d64458581d 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
@@ -110,7 +110,7 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
         { link.iconClassName && (
           <Icon
             className={ css(link.iconClassName, styles.iconLink) }
-            iconName='iconLink'
+            iconName='IconLink'
           />
         ) }
         { this.props.onRenderLink(link) }
@@ -153,7 +153,7 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
           >
             <Icon
               className={ css('ms-Nav-chevron', styles.chevronIcon, link.isExpanded) }
-              iconName='chevronDown'
+              iconName='ChevronDown'
             />
           </button> : null
         ) }
@@ -204,7 +204,7 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
                 styles.chevronIcon,
                 isGroupExpanded && styles.chevronIsExpanded
               ) }
-              iconName='chevronDown'
+              iconName='ChevronDown'
             />
             { group.name }
           </button> : null)
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index 4d882f4d13197..2037e560cad1e 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -144,7 +144,6 @@ $field-error-color: $errorTextColor;
 }
 
 .errorIcon {
-  vertical-align: middle;
   font-size: $ms-font-size-m;
   @include margin-right(5px);
 }
@@ -254,6 +253,8 @@ $field-error-color: $errorTextColor;
   color: $field-error-color;
   margin: 0;
   padding-top: 5px;
+  display: flex;
+  align-items: center;
 }
 
 .invalid,
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index 27e54c5afcea0..2bb6a70eca5f9 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -172,9 +172,9 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
                 <DelayedRender>
                   <p
                     className={ css('ms-TextField-errorMessage', AnimationClassNames.slideDownIn20, styles.errorMessage) }
-                    data-automation-id='error-message'>
-                    <Icon iconName='error' className={ styles.errorIcon } />
-                    { errorMessage }
+                  >
+                    { Icon({ iconName: 'Error', className: styles.errorIcon }) }
+                    <span className={ styles.errorText } data-automation-id='error-message'>{ errorMessage }</span>
                   </p>
                 </DelayedRender>
               </div>
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
index b2d6bfd277d86..f0886edff4576 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
@@ -13,9 +13,9 @@ export class TextFieldBasicExample extends React.Component<any, any> {
         <TextField label='Disabled TextField' disabled={ true } placeholder='Placeholder text' />
         <TextField label='Required TextField' required={ true } />
         <TextField label='TextField with a placeholder' placeholder='Now I am a Placeholder' ariaLabel='Please enter text here' />
-        <TextField label='TextField with an icon' iconProps={ { iconName: 'calendar' } } />
+        <TextField label='TextField with an icon' iconProps={ { iconName: 'Calendar' } } />
         <TextField label='Textfield with an addon' addonString='https://' />
-        <TextField label='Multiline TextField' multiline rows={ 4 } iconProps={ { iconName: 'calendar' } } />
+        <TextField label='Multiline TextField' multiline rows={ 4 } iconProps={ { iconName: 'Calendar' } } />
         <TextField label='Multiline TextField Unresizable' multiline resizable={ false } />
         <TextField label='Multiline TextField with auto adjust height' multiline autoAdjustHeight />
         <TextField label='Underlined TextField' underlined />
diff --git a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx
index f7484731a7d6b..174f53d92ba89 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx
@@ -19,7 +19,7 @@ export const TagItem = (props: IPickerItemProps<ITag>) => (
     data-is-focusable={ true }>
     <span className={ css('ms-TagItem-text', styles.tagItemText) }>{ props.children }</span>
     <span className={ css('ms-TagItem-close', styles.tagItemClose) } onClick={ props.onRemoveItem }>
-      <Icon iconName='cancel' />
+      <Icon iconName='Cancel' />
     </span>
   </div>
 );
diff --git a/packages/styling/src/classNames/IconClassNames.ts b/packages/styling/src/classNames/IconClassNames.ts
index 3a4a421fcaa2f..fa0ed98f3caf4 100644
--- a/packages/styling/src/classNames/IconClassNames.ts
+++ b/packages/styling/src/classNames/IconClassNames.ts
@@ -10,17 +10,22 @@ export const IconClassNames: {[key in keyof typeof IconCodes]?: string } = {};
 
 // tslint:disable-next-line:forin
 for (const iconName in IconCodes) {
+  let className: string;
+
   Object.defineProperty(IconClassNames, iconName, {
     get: (): string => {
-      let className = mergeStyles(
-        DefaultFontStyles.icon,
-        {
-          ':before': {
-            // tslint:disable-next-line:no-any
-            content: `"${(IconCodes as any)[iconName]}"`
+      if (className === undefined) {
+        className = mergeStyles(
+          DefaultFontStyles.icon,
+          {
+            ':before': {
+              // tslint:disable-next-line:no-any
+              content: `"${(IconCodes as any)[iconName]}"`
+            }
           }
-        },
-      ).toString();
+        ).toString();
+      }
+
       return className;
     },
     enumerable: true,
diff --git a/packages/styling/src/utilities/buildClassMap.ts b/packages/styling/src/utilities/buildClassMap.ts
index f0d748ad10a8f..9ab4bc9c6f0d1 100644
--- a/packages/styling/src/utilities/buildClassMap.ts
+++ b/packages/styling/src/utilities/buildClassMap.ts
@@ -7,11 +7,25 @@ import { mergeStyles } from './mergeStyles';
  * @returns Map of property name to class name.
  */
 export function buildClassMap<T>(styles: T): {[key in keyof T]?: string } {
-  return Object
-    .keys(styles)
-    .reduce((classNames: {[key in keyof T]?: string }, className: string) => {
-      // tslint:disable-next-line:no-any
-      classNames[className] = mergeStyles((styles as any)[className]).toString();
-      return classNames;
-    }, {});
+  let classes: {[key in keyof T]?: string } = {};
+
+  for (let styleName in styles) {
+    if (styles.hasOwnProperty(styleName)) {
+      let className: string;
+
+      Object.defineProperty(classes, styleName, {
+        get: (): string => {
+          if (className === undefined) {
+            // tslint:disable-next-line:no-any
+            className = mergeStyles(styles[styleName] as any).toString();
+          }
+          return className;
+        },
+        enumerable: true,
+        configurable: true
+      });
+    }
+  }
+
+  return classes;
 }

From eaeab7908a35ea3e94de800dd87941a5963917ef Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 21 Jun 2017 00:45:41 +0000
Subject: [PATCH 0140/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 15 +++++++++++
 apps/fabric-website/CHANGELOG.md              |  7 ++++-
 apps/fabric-website/package.json              |  6 ++---
 .../create-app_2017-06-20-01-08.json          | 11 --------
 .../styling/create-app_2017-06-20-01-08.json  | 11 --------
 .../styling/icons_2017-06-20-17-51.json       | 11 --------
 ...s-demarcey-moveTheme_2017-06-20-12-42.json | 11 --------
 .../icons_2017-06-20-17-51.json               | 11 --------
 ...anel-headertext-aria_2017-06-14-21-49.json | 11 --------
 packages/example-app-base/CHANGELOG.json      | 19 +++++++++++++
 packages/example-app-base/CHANGELOG.md        |  9 ++++++-
 packages/example-app-base/package.json        |  4 +--
 packages/example-component/package.json       |  6 ++---
 .../office-ui-fabric-react/CHANGELOG.json     | 27 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 ++++++-
 packages/office-ui-fabric-react/package.json  |  6 ++---
 packages/styling/CHANGELOG.json               | 26 ++++++++++++++++++
 packages/styling/CHANGELOG.md                 | 14 +++++++++-
 packages/styling/package.json                 |  2 +-
 19 files changed, 135 insertions(+), 82 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/create-app_2017-06-20-01-08.json
 delete mode 100644 common/changes/@uifabric/styling/create-app_2017-06-20-01-08.json
 delete mode 100644 common/changes/@uifabric/styling/icons_2017-06-20-17-51.json
 delete mode 100644 common/changes/@uifabric/styling/users-demarcey-moveTheme_2017-06-20-12-42.json
 delete mode 100644 common/changes/office-ui-fabric-react/icons_2017-06-20-17-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/panel-headertext-aria_2017-06-14-21-49.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 7b6ca46321062..064ff783ac1d7 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,21 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.5.39",
+      "tag": "@uifabric/fabric-website_v4.5.39",
+      "date": "Wed, 21 Jun 2017 00:45:41 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `3.0.2` to `4.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.9.0 <5.0.0` to `>=4.9.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.5.38",
       "tag": "@uifabric/fabric-website_v4.5.38",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index a13c4cf69e3dd..c54f999a23c9f 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Wed, 14 Jun 2017 06:02:15 GMT and should not be manually modified.
+This log was last generated on Wed, 21 Jun 2017 00:45:41 GMT and should not be manually modified.
+
+## 4.5.39
+Wed, 21 Jun 2017 00:45:41 GMT
+
+*Changes not tracked*
 
 ## 4.5.38
 Wed, 14 Jun 2017 06:02:15 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index f5823a77e8365..997727215a5d2 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.5.38",
+  "version": "4.5.39",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,13 +47,13 @@
     "webpack-bundle-analyzer": "^2.2.1"
   },
   "dependencies": {
-    "@uifabric/example-app-base": "3.0.2",
+    "@uifabric/example-app-base": "4.0.0",
     "@uifabric/utilities": ">=4.3.0 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.9.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.9.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/create-app_2017-06-20-01-08.json b/common/changes/@uifabric/example-app-base/create-app_2017-06-20-01-08.json
deleted file mode 100644
index c5b3aff04f61c..0000000000000
--- a/common/changes/@uifabric/example-app-base/create-app_2017-06-20-01-08.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Add support for adding a default route in createApp. Remove unused hideChrome parameter.",
-      "type": "major"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/create-app_2017-06-20-01-08.json b/common/changes/@uifabric/styling/create-app_2017-06-20-01-08.json
deleted file mode 100644
index efa0574335ca2..0000000000000
--- a/common/changes/@uifabric/styling/create-app_2017-06-20-01-08.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Consume latest version of createApp ",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/icons_2017-06-20-17-51.json b/common/changes/@uifabric/styling/icons_2017-06-20-17-51.json
deleted file mode 100644
index 2e64b5548bce0..0000000000000
--- a/common/changes/@uifabric/styling/icons_2017-06-20-17-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "General class exports now register on demand, resulting in less unneeded evaluation of classnames.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/users-demarcey-moveTheme_2017-06-20-12-42.json b/common/changes/@uifabric/styling/users-demarcey-moveTheme_2017-06-20-12-42.json
deleted file mode 100644
index 7694634c8c586..0000000000000
--- a/common/changes/@uifabric/styling/users-demarcey-moveTheme_2017-06-20-12-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Fixing circular dependency between @uifabric/styling/utilities and @uifabric/styling/styles",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "demarcey@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/icons_2017-06-20-17-51.json b/common/changes/office-ui-fabric-react/icons_2017-06-20-17-51.json
deleted file mode 100644
index 9703377b596e9..0000000000000
--- a/common/changes/office-ui-fabric-react/icons_2017-06-20-17-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Icons: now with less redundant evaluation of styling, which improves render performance.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/panel-headertext-aria_2017-06-14-21-49.json b/common/changes/office-ui-fabric-react/panel-headertext-aria_2017-06-14-21-49.json
deleted file mode 100644
index f737483c7f623..0000000000000
--- a/common/changes/office-ui-fabric-react/panel-headertext-aria_2017-06-14-21-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Panel: Fixed header ID value",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 7bb0f4244dfb7..1703b0381868f 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "4.0.0",
+      "tag": "@uifabric/example-app-base_v4.0.0",
+      "date": "Wed, 21 Jun 2017 00:45:41 GMT",
+      "comments": {
+        "major": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "bff150fa91e87c31d8d433092b007ee604f22d8b",
+            "comment": "Add support for adding a default route in createApp. Remove unused hideChrome parameter."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.10.5 <1.0.0` to `>=0.11.0 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "3.0.2",
       "tag": "@uifabric/example-app-base_v3.0.2",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index d140a79363e3c..a67aead61ae89 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Wed, 14 Jun 2017 06:02:15 GMT and should not be manually modified.
+This log was last generated on Wed, 21 Jun 2017 00:45:41 GMT and should not be manually modified.
+
+## 4.0.0
+Wed, 21 Jun 2017 00:45:41 GMT
+
+### Breaking changes
+
+- Add support for adding a default route in createApp. Remove unused hideChrome parameter.
 
 ## 3.0.2
 Wed, 14 Jun 2017 06:02:15 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 46bef015ac773..ac2964359d6f6 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "3.0.2",
+  "version": "4.0.0",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,7 +47,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.10.5 <1.0.0",
+    "@uifabric/styling": ">=0.11.0 <1.0.0",
     "@uifabric/utilities": ">=4.3.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 76bcd729ea539..7226cc8258874 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-component",
-  "version": "1.0.35",
+  "version": "1.0.36",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -21,7 +21,7 @@
     "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "3.0.2",
+    "@uifabric/example-app-base": "4.0.0",
     "@uifabric/utilities": "4.3.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.9.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.9.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 4419659aaf90b..b15a066f94da0 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,33 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.9.1",
+      "tag": "office-ui-fabric-react_v4.9.1",
+      "date": "Wed, 21 Jun 2017 00:45:41 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "135c06a013468eb717fddab4ccabd6d63274fe4b",
+            "comment": "Icons: now with less redundant evaluation of styling, which improves render performance."
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "788a876ee11ad747121215edc9886699a24d0cc3",
+            "comment": "Panel: Fixed header ID value"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.10.5 <1.0.0` to `>=0.11.0 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `3.0.2` to `4.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.9.0",
       "tag": "office-ui-fabric-react_v4.9.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index d52ea2c6b7307..450e914c8a19d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 20 Jun 2017 10:22:47 GMT and should not be manually modified.
+This log was last generated on Wed, 21 Jun 2017 00:45:41 GMT and should not be manually modified.
+
+## 4.9.1
+Wed, 21 Jun 2017 00:45:41 GMT
+
+### Patches
+
+- Icons: now with less redundant evaluation of styling, which improves render performance.
+- Panel: Fixed header ID value
 
 ## 4.9.0
 Tue, 20 Jun 2017 10:22:47 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index a3161117d28e9..0beac4dc5a981 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.9.0",
+  "version": "4.9.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "^2.2.2",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "3.0.2",
+    "@uifabric/example-app-base": "4.0.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.3.0 <5.0.0",
-    "@uifabric/styling": ">=0.10.5 <1.0.0",
+    "@uifabric/styling": ">=0.11.0 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 92480f849693a..10cfa280719a7 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.11.0",
+      "tag": "@uifabric/styling_v0.11.0",
+      "date": "Wed, 21 Jun 2017 00:45:41 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "bff150fa91e87c31d8d433092b007ee604f22d8b",
+            "comment": "Consume latest version of createApp "
+          }
+        ],
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "135c06a013468eb717fddab4ccabd6d63274fe4b",
+            "comment": "General class exports now register on demand, resulting in less unneeded evaluation of classnames."
+          },
+          {
+            "author": "dmarcey <demarcey@microsoft.com>",
+            "commit": "230323c6b7d4972e8b04da6a4beb981b1c15396c",
+            "comment": "Fixing circular dependency between @uifabric/styling/utilities and @uifabric/styling/styles"
+          }
+        ]
+      }
+    },
     {
       "version": "0.10.5",
       "tag": "@uifabric/styling_v0.10.5",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index a82095869ab37..5f2285aa92533 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,18 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Tue, 20 Jun 2017 10:22:47 GMT and should not be manually modified.
+This log was last generated on Wed, 21 Jun 2017 00:45:41 GMT and should not be manually modified.
+
+## 0.11.0
+Wed, 21 Jun 2017 00:45:41 GMT
+
+### Minor changes
+
+- Consume latest version of createApp 
+
+### Patches
+
+- General class exports now register on demand, resulting in less unneeded evaluation of classnames.
+- Fixing circular dependency between @uifabric/styling/utilities and @uifabric/styling/styles
 
 ## 0.10.5
 Tue, 20 Jun 2017 10:22:47 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index be03ac2af13a5..eb8e9b488d15b 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.10.5",
+  "version": "0.11.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 221454482fd48138b0485715170c03c64fa1cef7 Mon Sep 17 00:00:00 2001
From: jijizz <liu_zhi8@hotmail.com>
Date: Tue, 20 Jun 2017 18:30:03 -0700
Subject: [PATCH 0141/1641] Zhiliu/instrument merge style (#2031)

* instrument styling

* lightweight performance measurement

* remove unnecessary code

* Update and rename performance.ts to perf.ts

* Update index.ts

* Rename perf.ts to FabricPerformance.ts

* Update mergeStyles.ts

* Update FabricPerformance.ts

* auto reset perf data every 3 minutes

* Update FabricPerformance.ts

* Update mergeStyles.ts

* change log

* Update zhiliu-instrumentMergeStyle_2017-06-21-00-57.json

* Update zhiliu-instrumentMergeStyle_2017-06-21-00-57.json
---
 ...instrumentMergeStyle_2017-06-21-00-57.json | 11 ++++
 ...instrumentMergeStyle_2017-06-21-00-57.json | 11 ++++
 packages/styling/src/utilities/mergeStyles.ts | 11 +++-
 packages/utilities/src/FabricPerformance.ts   | 62 +++++++++++++++++++
 packages/utilities/src/index.ts               |  3 +-
 5 files changed, 95 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/zhiliu-instrumentMergeStyle_2017-06-21-00-57.json
 create mode 100644 common/changes/@uifabric/utilities/zhiliu-instrumentMergeStyle_2017-06-21-00-57.json
 create mode 100644 packages/utilities/src/FabricPerformance.ts

diff --git a/common/changes/@uifabric/styling/zhiliu-instrumentMergeStyle_2017-06-21-00-57.json b/common/changes/@uifabric/styling/zhiliu-instrumentMergeStyle_2017-06-21-00-57.json
new file mode 100644
index 0000000000000..9f47bf25a7e1e
--- /dev/null
+++ b/common/changes/@uifabric/styling/zhiliu-instrumentMergeStyle_2017-06-21-00-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Instrumenting the performance of css registration.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "zhiliu@microsoft.com"
+}
diff --git a/common/changes/@uifabric/utilities/zhiliu-instrumentMergeStyle_2017-06-21-00-57.json b/common/changes/@uifabric/utilities/zhiliu-instrumentMergeStyle_2017-06-21-00-57.json
new file mode 100644
index 0000000000000..4c14fa41b31e6
--- /dev/null
+++ b/common/changes/@uifabric/utilities/zhiliu-instrumentMergeStyle_2017-06-21-00-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Add FabricPerformance utility to measure performance",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "zhiliu@microsoft.com"
+}
diff --git a/packages/styling/src/utilities/mergeStyles.ts b/packages/styling/src/utilities/mergeStyles.ts
index 869648ac51e6c..8312a21bb4206 100644
--- a/packages/styling/src/utilities/mergeStyles.ts
+++ b/packages/styling/src/utilities/mergeStyles.ts
@@ -1,5 +1,6 @@
 import { css, Rule } from 'glamor';
 import { IStyle, IProcessedStyle } from '../interfaces/index';
+import { FabricPerformance } from '@uifabric/utilities/lib/index';
 
 /**
  * Takes a collection of collection of styles, defined in various formats, and compresses them into
@@ -32,8 +33,14 @@ export function mergeStyles(...args: (IStyle | string)[]): IProcessedStyle | str
 
   _parseArgs(args);
 
-  const rulesObject: IStyle = rules.length ? css(...rules) : null;
-
+  let rulesObject: IStyle = null;
+  
+  if (rules.length) {
+    FabricPerformance.measure('glamor.css', () => {
+      rulesObject = css(...rules);
+    });
+  }
+  
   if (classes.length) {
     if (rulesObject) {
       classes.push(rulesObject.toString());
diff --git a/packages/utilities/src/FabricPerformance.ts b/packages/utilities/src/FabricPerformance.ts
new file mode 100644
index 0000000000000..45bc1238bd7df
--- /dev/null
+++ b/packages/utilities/src/FabricPerformance.ts
@@ -0,0 +1,62 @@
+import { Async } from './Async';
+
+export interface IPerfData {
+  duration: number;
+  timeStamp: number;
+}
+
+export interface IPerfMeasurement {
+  totalDuration: number;
+  count: number;
+  all: IPerfData[];
+}
+
+export interface IPerfSummary {
+  [key: string]: IPerfMeasurement;
+}
+
+const now: () => number = () => (typeof performance !== 'undefined' && !!performance.now) ? performance.now() : Date.now();
+
+const RESET_INTERVAL = 3 * 60 * 1000; // auto reset every 3 minutes
+
+export class FabricPerformance {
+  public static summary: IPerfSummary = {};
+  private static _async: Async = new Async();
+  private static _timeoutId: number;
+  /**
+   * Measures execution time of the given syncronous function. If the same logic is executed multiple times, 
+   * each individual measurement will be collected as well the overall numbers.
+   * @param name - The name of this measurement
+   * @param func - The logic to be measured for execution time
+   */
+  public static measure(name: string, func: () => void) {
+    const start = now();
+    func();
+    const end = now();
+    const measurement: IPerfMeasurement = FabricPerformance.summary[name] || {
+      totalDuration: 0,
+      count: 0,
+      all: []
+    };
+    const duration = end - start;
+    measurement.totalDuration += duration;
+    measurement.count++;
+    measurement.all.push({
+      duration: duration,
+      timeStamp: end
+    });
+    FabricPerformance.summary[name] = measurement;
+  }
+
+  public static reset() {
+    FabricPerformance.summary = {};
+    FabricPerformance._async.clearTimeout(FabricPerformance._timeoutId);
+    FabricPerformance.setPeriodicReset();
+  }
+
+  public static setPeriodicReset(): void {
+    FabricPerformance._timeoutId = FabricPerformance._async.setTimeout(() => FabricPerformance.reset(), RESET_INTERVAL);
+  };
+}
+
+FabricPerformance.setPeriodicReset();
diff --git a/packages/utilities/src/index.ts b/packages/utilities/src/index.ts
index 68694e0f80fe6..9d6c952e690b7 100644
--- a/packages/utilities/src/index.ts
+++ b/packages/utilities/src/index.ts
@@ -4,6 +4,7 @@ export * from './BaseComponent';
 export * from './Customizer';
 export * from './DelayedRender';
 export * from './EventGroup';
+export * from './FabricPerformance';
 export * from './IDisposable';
 export * from './IPoint';
 export * from './IRectangle';
@@ -28,4 +29,4 @@ export * from './rtl';
 export * from './scroll';
 export * from './string';
 export * from './warn';
-export * from './memoize';
\ No newline at end of file
+export * from './memoize';

From 8879a541eeb3157e135f9ebf49185e983e34a626 Mon Sep 17 00:00:00 2001
From: Fabric Build <miljo@microsoft.com>
Date: Wed, 21 Jun 2017 01:52:48 +0000
Subject: [PATCH 0142/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 ...instrumentMergeStyle_2017-06-21-00-57.json | 11 ------
 ...instrumentMergeStyle_2017-06-21-00-57.json | 11 ------
 packages/example-app-base/package.json        |  4 +--
 packages/example-component/package.json       |  4 +--
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/CHANGELOG.json               | 19 +++++++++++
 packages/styling/CHANGELOG.md                 |  9 ++++-
 packages/styling/package.json                 |  4 +--
 packages/utilities/CHANGELOG.json             | 14 ++++++++
 packages/utilities/CHANGELOG.md               |  9 ++++-
 packages/utilities/api/utilities.api.ts       | 34 +++++++++++++++++++
 packages/utilities/package.json               |  2 +-
 13 files changed, 93 insertions(+), 34 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/zhiliu-instrumentMergeStyle_2017-06-21-00-57.json
 delete mode 100644 common/changes/@uifabric/utilities/zhiliu-instrumentMergeStyle_2017-06-21-00-57.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 997727215a5d2..e85094857f0f2 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -48,7 +48,7 @@
   },
   "dependencies": {
     "@uifabric/example-app-base": "4.0.0",
-    "@uifabric/utilities": ">=4.3.0 <5.0.0",
+    "@uifabric/utilities": ">=4.4.0 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
diff --git a/common/changes/@uifabric/styling/zhiliu-instrumentMergeStyle_2017-06-21-00-57.json b/common/changes/@uifabric/styling/zhiliu-instrumentMergeStyle_2017-06-21-00-57.json
deleted file mode 100644
index 9f47bf25a7e1e..0000000000000
--- a/common/changes/@uifabric/styling/zhiliu-instrumentMergeStyle_2017-06-21-00-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Instrumenting the performance of css registration.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "zhiliu@microsoft.com"
-}
diff --git a/common/changes/@uifabric/utilities/zhiliu-instrumentMergeStyle_2017-06-21-00-57.json b/common/changes/@uifabric/utilities/zhiliu-instrumentMergeStyle_2017-06-21-00-57.json
deleted file mode 100644
index 4c14fa41b31e6..0000000000000
--- a/common/changes/@uifabric/utilities/zhiliu-instrumentMergeStyle_2017-06-21-00-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Add FabricPerformance utility to measure performance",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "zhiliu@microsoft.com"
-}
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index ac2964359d6f6..7cc79e2e1e8de 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -47,8 +47,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.11.0 <1.0.0",
-    "@uifabric/utilities": ">=4.3.0 <5.0.0",
+    "@uifabric/styling": ">=0.11.1 <1.0.0",
+    "@uifabric/utilities": ">=4.4.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.4.0 <5.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 7226cc8258874..f28060545149b 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-component",
-  "version": "1.0.36",
+  "version": "1.0.37",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -22,7 +22,7 @@
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
     "@uifabric/example-app-base": "4.0.0",
-    "@uifabric/utilities": "4.3.0",
+    "@uifabric/utilities": "4.4.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 0beac4dc5a981..990dafbf34de5 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -71,8 +71,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.3.0 <5.0.0",
-    "@uifabric/styling": ">=0.11.0 <1.0.0",
+    "@uifabric/utilities": ">=4.4.0 <5.0.0",
+    "@uifabric/styling": ">=0.11.1 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 10cfa280719a7..1f15a18252d77 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.11.1",
+      "tag": "@uifabric/styling_v0.11.1",
+      "date": "Wed, 21 Jun 2017 01:52:48 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "jijizz <liu_zhi8@hotmail.com>",
+            "commit": "221454482fd48138b0485715170c03c64fa1cef7",
+            "comment": "Instrumenting the performance of css registration."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.3.0 <5.0.0` to `>=4.4.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.11.0",
       "tag": "@uifabric/styling_v0.11.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 5f2285aa92533..31663a9c718ad 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Wed, 21 Jun 2017 00:45:41 GMT and should not be manually modified.
+This log was last generated on Wed, 21 Jun 2017 01:52:48 GMT and should not be manually modified.
+
+## 0.11.1
+Wed, 21 Jun 2017 01:52:48 GMT
+
+### Patches
+
+- Instrumenting the performance of css registration.
 
 ## 0.11.0
 Wed, 21 Jun 2017 00:45:41 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index eb8e9b488d15b..462d56c35bcaa 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.11.0",
+  "version": "0.11.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.3.0 <5.0.0",
+    "@uifabric/utilities": ">=4.4.0 <5.0.0",
     "tslib": "^1.6.0",
     "rtl-css-js": "^1.1.1",
     "glamor": "^2.20.24"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 8c48adb810024..dedbe087ed1c2 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.4.0",
+      "tag": "@uifabric/utilities_v4.4.0",
+      "date": "Wed, 21 Jun 2017 01:52:48 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "jijizz <liu_zhi8@hotmail.com>",
+            "commit": "221454482fd48138b0485715170c03c64fa1cef7",
+            "comment": "Add FabricPerformance utility to measure performance"
+          }
+        ]
+      }
+    },
     {
       "version": "4.3.0",
       "tag": "@uifabric/utilities_v4.3.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index d054b6d19bd92..6d3ea471ea4e8 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Wed, 14 Jun 2017 06:02:15 GMT and should not be manually modified.
+This log was last generated on Wed, 21 Jun 2017 01:52:48 GMT and should not be manually modified.
+
+## 4.4.0
+Wed, 21 Jun 2017 01:52:48 GMT
+
+### Minor changes
+
+- Add FabricPerformance utility to measure performance
 
 ## 4.3.0
 Wed, 14 Jun 2017 06:02:15 GMT
diff --git a/packages/utilities/api/utilities.api.ts b/packages/utilities/api/utilities.api.ts
index 1af43d6fdd144..3b3143145fe17 100644
--- a/packages/utilities/api/utilities.api.ts
+++ b/packages/utilities/api/utilities.api.ts
@@ -90,6 +90,16 @@ class EventGroup {
   public static isObserved(target: any, eventName: string): boolean;
 }
 
+// WARNING: measure has incomplete type information
+// WARNING: reset has incomplete type information
+// (undocumented)
+class FabricPerformance {
+  // (undocumented)
+  public static setPeriodicReset(): void;
+  // (undocumented)
+  public static summary: IPerfSummary;
+}
+
 // (undocumented)
 export function findIndex(array: any[], cb: (item: any, index?: number) => boolean): number;
 
@@ -239,6 +249,30 @@ interface IEventRecordsByName {
   [ eventName: string ]: IEventRecordList;
 }
 
+// (undocumented)
+interface IPerfData {
+  // (undocumented)
+  duration: number;
+  // (undocumented)
+  timeStamp: number;
+}
+
+// (undocumented)
+interface IPerfMeasurement {
+  // (undocumented)
+  all: IPerfData[];
+  // (undocumented)
+  count: number;
+  // (undocumented)
+  totalDuration: number;
+}
+
+// (undocumented)
+interface IPerfSummary {
+  // (undocumented)
+  [ key: string ]: IPerfMeasurement;
+}
+
 // (undocumented)
 interface IPoint {
   // (undocumented)
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 83c8bcc6f9dce..ffb5df29f7641 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.3.0",
+  "version": "4.4.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 55a2becd62e620acb62154da43fb4977fde9b4fc Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 20 Jun 2017 22:09:42 -0700
Subject: [PATCH 0143/1641] Create FABRIC_COMPONENT.md

---
 ghdocs/FABRIC_COMPONENT.md | 31 +++++++++++++++++++++++++++++++
 1 file changed, 31 insertions(+)
 create mode 100644 ghdocs/FABRIC_COMPONENT.md

diff --git a/ghdocs/FABRIC_COMPONENT.md b/ghdocs/FABRIC_COMPONENT.md
new file mode 100644
index 0000000000000..7ff2a976982ee
--- /dev/null
+++ b/ghdocs/FABRIC_COMPONENT.md
@@ -0,0 +1,31 @@
+# The Fabric component
+
+Consumers using Fabric components should be wrapping their content within the Fabric component. 
+
+```tsx
+import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
+import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+
+
+ReactDOM.render(
+  <Fabric>
+    <App/>
+  </Fabric>,
+  element);
+```
+
+* Note: The Fabric component will render a div, and will mix in div properties. You may use it as a replacement for a root div.
+
+The Fabric component is a root wrapper component which solves 2 problems:
+
+1. The default fontFamily css style is defined at this layer, allowing components within to inherit the default fontFamily. The class `ms-Fabric` defines this.
+
+2. The focus rectangle visibility is managed through the `is-focusVisible` css class.
+
+## Focus rectangle notes
+
+Focus rectangles around components should only be shown when the user presses tab or directional keys. When they press mouse buttons, focus rectangles should not be shown. To support this, we have implemented a root `Fabric` component that will conditionally add/remove an `is-focusVisible` class. Components rendering focus rectangles should conditionalize their visibility based on the `.ms-Fabric.is-focusVisible` parent selector.
+
+
+

From b8329b495cea05262b955d6d67f693877ab5643e Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 20 Jun 2017 22:11:08 -0700
Subject: [PATCH 0144/1641] Update FABRIC_COMPONENT.md

---
 ghdocs/FABRIC_COMPONENT.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/ghdocs/FABRIC_COMPONENT.md b/ghdocs/FABRIC_COMPONENT.md
index 7ff2a976982ee..9e19897182b41 100644
--- a/ghdocs/FABRIC_COMPONENT.md
+++ b/ghdocs/FABRIC_COMPONENT.md
@@ -25,7 +25,7 @@ The Fabric component is a root wrapper component which solves 2 problems:
 
 ## Focus rectangle notes
 
-Focus rectangles around components should only be shown when the user presses tab or directional keys. When they press mouse buttons, focus rectangles should not be shown. To support this, we have implemented a root `Fabric` component that will conditionally add/remove an `is-focusVisible` class. Components rendering focus rectangles should conditionalize their visibility based on the `.ms-Fabric.is-focusVisible` parent selector.
-
+Focus rectangles around components should only be shown when the user presses tab or directional keys. When they press mouse buttons, focus rectangles should not be shown. The `Fabric` component that will conditionally add/remove an `is-focusVisible` class, and components rendering focus rectangles should conditionalize their visibility based on the `.ms-Fabric.is-focusVisible` parent selector.
 
+This is abstracted in the scss include `focus-border()`.
 

From 2e9309fd851bb36a249a408a9955ed18fe87a320 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 21 Jun 2017 10:59:27 -0700
Subject: [PATCH 0145/1641] Breadcrumb bug fix (#2037)

* Breadcrumb: Fixed overflow logic and extra icon

* add change file

* Removed tooltip code

* Update Breadcrumb.tsx
---
 .../breadcrumb-bug-fix_2017-06-21-16-20.json          | 11 +++++++++++
 .../src/components/Breadcrumb/Breadcrumb.tsx          |  6 +++---
 2 files changed, 14 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/breadcrumb-bug-fix_2017-06-21-16-20.json

diff --git a/common/changes/office-ui-fabric-react/breadcrumb-bug-fix_2017-06-21-16-20.json b/common/changes/office-ui-fabric-react/breadcrumb-bug-fix_2017-06-21-16-20.json
new file mode 100644
index 0000000000000..df407393fa947
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/breadcrumb-bug-fix_2017-06-21-16-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Breadcrumb: Fixed overflow logic and extra icon",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
index 2b2e2388b7e89..a139fb4ffb12b 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
@@ -41,7 +41,7 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
     let breadCrumbData: IBreadCrumbData = {
       props: this.props,
       renderedItems: this.props.items.slice(0, this.props.maxDisplayedItems),
-      renderedOverflowItems: this.props.items.slice(this.props.maxDisplayedItems + 1)
+      renderedOverflowItems: this.props.items.slice(this.props.maxDisplayedItems)
     };
 
     return (
@@ -88,14 +88,14 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
       >
         <FocusZone direction={ FocusZoneDirection.horizontal } >
           <ol className={ css('ms-Breadcrumb-list', styles.list) }>
-            { renderedOverflowItems && renderedOverflowItems.length && (
+            { renderedOverflowItems && renderedOverflowItems.length !== 0 && (
               <li className={ css('ms-Breadcrumb-overflow', styles.overflow) } key={ OVERFLOW_KEY } ref={ OVERFLOW_KEY }>
                 <IconButton
                   className={ css('ms-Breadcrumb-overflowButton', styles.overflowButton) }
                   iconProps={ { iconName: 'More' } }
                   role='button'
                   aria-haspopup='true'
-                  menuIconProps={ { iconName: null } }
+                  menuIconProps={ null }
                   menuProps={ {
                     items: contextualItems,
                     directionalHint: DirectionalHint.bottomLeftEdge

From 9c69b33ffaa656ee95543d30c747a50b9bbf109b Mon Sep 17 00:00:00 2001
From: lindach167 <lindach@microsoft.com>
Date: Wed, 21 Jun 2017 11:21:31 -0700
Subject: [PATCH 0146/1641] Fix persona image so it does not cause DOM reflow
 (#2028)

* Add cover style as a Image prop

* Add comments

* Add change file

* Fix check
---
 .../lindach-ImageReflow_2017-06-20-18-25.json | 11 ++++
 .../src/components/Image/Image.Props.ts       | 22 ++++++++
 .../src/components/Image/Image.tsx            | 53 +++++++++----------
 .../src/components/Persona/Persona.tsx        |  3 +-
 4 files changed, 60 insertions(+), 29 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/lindach-ImageReflow_2017-06-20-18-25.json

diff --git a/common/changes/office-ui-fabric-react/lindach-ImageReflow_2017-06-20-18-25.json b/common/changes/office-ui-fabric-react/lindach-ImageReflow_2017-06-20-18-25.json
new file mode 100644
index 0000000000000..fe66a37f3f31b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/lindach-ImageReflow_2017-06-20-18-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix Persona control DOM reflow by passing ImageCoverStyle to Image control",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lindach@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.Props.ts b/packages/office-ui-fabric-react/src/components/Image/Image.Props.ts
index 1e8b7bd8b4ef9..cbfe6a4598cb0 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.Props.ts
@@ -54,6 +54,13 @@ export interface IImageProps extends React.HTMLAttributes<HTMLImageElement> {
    * The 'loadState' parameter indicates the current state of the Image.
    */
   onLoadingStateChange?: (loadState: ImageLoadState) => void;
+
+  /**
+   * Specified the cover style to be used for this image. If not
+   * specified, this will be dynamically calculated based on the
+   * aspect ratio for the image.
+   */
+  coverStyle?: ImageCoverStyle;
 }
 
 /**
@@ -85,6 +92,21 @@ export enum ImageFit {
   none = 3
 }
 
+/**
+ * The cover style to be used on the image
+ */
+export enum ImageCoverStyle {
+  /**
+   * The image will be shown at 100% height of container and the width will be scaled accordingly
+   */
+  landscape = 0,
+
+  /**
+   * The image will be shown at 100% width of container and the height will be scaled accordingly
+   */
+  portrait = 1
+}
+
 export enum ImageLoadState {
   /**
    * The image has not yet been loaded, and there is no error yet.
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.tsx
index 6cdf3ff068700..5d22995b2963a 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.tsx
@@ -8,7 +8,7 @@ import {
   getNativeProps,
   imageProperties
 } from '../../Utilities';
-import { IImageProps, ImageFit, ImageLoadState } from './Image.Props';
+import { IImageProps, ImageFit, ImageLoadState, ImageCoverStyle } from './Image.Props';
 import { AnimationClassNames } from '../../Styling';
 import * as stylesImport from './Image.scss';
 const styles: any = stylesImport;
@@ -17,14 +17,9 @@ export interface IImageState {
   loadState?: ImageLoadState;
 }
 
-export enum CoverStyle {
-  landscape = 0,
-  portrait = 1
-}
-
 export const CoverStyleMap = {
-  [CoverStyle.landscape]: 'ms-Image-image--landscape ' + styles.imageIsLandscape,
-  [CoverStyle.portrait]: 'ms-Image-image--portrait ' + styles.imageIsPortrait
+  [ImageCoverStyle.landscape]: 'ms-Image-image--landscape ' + styles.imageIsLandscape,
+  [ImageCoverStyle.portrait]: 'ms-Image-image--portrait ' + styles.imageIsPortrait
 };
 
 export const ImageFitMap = {
@@ -46,7 +41,7 @@ export class Image extends BaseComponent<IImageProps, IImageState> {
   // Make an initial assumption about the image layout until we can
   // check the rendered element. The value here only takes effect when
   // shouldStartVisible is true.
-  private _coverStyle: CoverStyle = CoverStyle.portrait;
+  private _coverStyle: ImageCoverStyle = ImageCoverStyle.portrait;
   private _imageElement: HTMLImageElement;
   private _frameElement: HTMLDivElement;
 
@@ -80,7 +75,7 @@ export class Image extends BaseComponent<IImageProps, IImageState> {
     let imageProps = getNativeProps(this.props, imageProperties, ['width', 'height']);
     let { src, alt, width, height, shouldFadeIn, className, imageFit, role, maximizeFrame } = this.props;
     let { loadState } = this.state;
-    let coverStyle = this._coverStyle;
+    let coverStyle = this.props.coverStyle !== undefined ? this.props.coverStyle : this._coverStyle;
     let loaded = loadState === ImageLoadState.loaded || (loadState === ImageLoadState.notLoaded && this.props.shouldStartVisible);
 
     // If image dimensions aren't specified, the natural size of the image is used.
@@ -166,26 +161,28 @@ export class Image extends BaseComponent<IImageProps, IImageState> {
 
   private _computeCoverStyle(props: IImageProps) {
     let { imageFit, width, height } = props;
-    if (imageFit === ImageFit.cover || imageFit === ImageFit.contain) {
-      if (this._imageElement) {
-        // Determine the desired ratio using the width and height props.
-        // If those props aren't available, measure measure the frame.
-        let desiredRatio;
-        if (!!width && !!height) {
-          desiredRatio = (width as number) / (height as number);
-        } else {
-          desiredRatio = this._frameElement.clientWidth / this._frameElement.clientHeight;
-        }
 
-        // Examine the source image to determine its original ratio.
-        let naturalRatio = this._imageElement.naturalWidth / this._imageElement.naturalHeight;
+    // Do not compute cover style if it was already specified in props
+    if ((imageFit === ImageFit.cover || imageFit === ImageFit.contain) &&
+      this.props.coverStyle === undefined &&
+      this._imageElement) {
+      // Determine the desired ratio using the width and height props.
+      // If those props aren't available, measure measure the frame.
+      let desiredRatio;
+      if (!!width && !!height) {
+        desiredRatio = (width as number) / (height as number);
+      } else {
+        desiredRatio = this._frameElement.clientWidth / this._frameElement.clientHeight;
+      }
 
-        // Should we crop from the top or the sides?
-        if (naturalRatio > desiredRatio) {
-          this._coverStyle = CoverStyle.landscape;
-        } else {
-          this._coverStyle = CoverStyle.portrait;
-        }
+      // Examine the source image to determine its original ratio.
+      let naturalRatio = this._imageElement.naturalWidth / this._imageElement.naturalHeight;
+
+      // Should we crop from the top or the sides?
+      if (naturalRatio > desiredRatio) {
+        this._coverStyle = ImageCoverStyle.landscape;
+      } else {
+        this._coverStyle = ImageCoverStyle.portrait;
       }
     }
   }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index eaf611f070c2a..5d07d19af7aa7 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -10,7 +10,7 @@ import {
   IRenderFunction
 } from '../../Utilities';
 import { Icon } from '../../Icon';
-import { Image, ImageFit, ImageLoadState } from '../../Image';
+import { Image, ImageFit, ImageLoadState, ImageCoverStyle } from '../../Image';
 import {
   IPersonaProps,
   PersonaInitialsColor,
@@ -159,6 +159,7 @@ export class Persona extends BaseComponent<IPersonaProps, IPersonaState> {
             <Image
               className={ css('ms-Persona-image', styles.image) }
               imageFit={ ImageFit.cover }
+              coverStyle={ ImageCoverStyle.portrait }
               src={ imageUrl }
               shouldFadeIn={ imageShouldFadeIn }
               shouldStartVisible={ imageShouldStartVisible }

From d55ef47bc6f05e163d39785b56d9557889c1ce41 Mon Sep 17 00:00:00 2001
From: Michael Loughry <miclo@microsoft.com>
Date: Wed, 21 Jun 2017 11:50:50 -0700
Subject: [PATCH 0147/1641] Dropdown: fix controlled component (#2040)

* Fix controlled component

* Add change file
---
 ...wn-fix-controlled-component_2017-06-21-17-20.json | 11 +++++++++++
 .../src/components/Dropdown/Dropdown.tsx             | 12 +++++++-----
 2 files changed, 18 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/dropdown-fix-controlled-component_2017-06-21-17-20.json

diff --git a/common/changes/office-ui-fabric-react/dropdown-fix-controlled-component_2017-06-21-17-20.json b/common/changes/office-ui-fabric-react/dropdown-fix-controlled-component_2017-06-21-17-20.json
new file mode 100644
index 0000000000000..8ca77dbeac66b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/dropdown-fix-controlled-component_2017-06-21-17-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: fixed bug that didn't allow operating Dropdown as a controlled component",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index add999e84025e..e56bc23511234 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -187,16 +187,18 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   public setSelectedIndex(index: number) {
-    let { onChanged, options } = this.props;
+    let { onChanged, options, selectedKey } = this.props;
     let { selectedIndex } = this.state;
 
     index = Math.max(0, Math.min(options.length - 1, index));
 
     if (index !== selectedIndex) {
-      // Set the selected option.
-      this.setState({
-        selectedIndex: index
-      });
+      if (selectedKey === undefined) {
+        // Set the selected option if this is an uncontrolled component
+        this.setState({
+          selectedIndex: index
+        });
+      }
 
       if (onChanged) {
         onChanged(options[index], index);

From 348ea5ded2c29f8c4a091f1e1198c916f748b92c Mon Sep 17 00:00:00 2001
From: Ben Truelove <betrue@microsoft.com>
Date: Wed, 21 Jun 2017 13:27:09 -0700
Subject: [PATCH 0148/1641] Check: Reduced size of background so blue does not
 extend outside of border. (#2041)

* Reduced size of background so blue does not extend outside of border.

* added change file
---
 .../betrue-selectionCheck_2017-06-21-18-54.json       | 11 +++++++++++
 .../src/components/Check/Check.scss                   |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/betrue-selectionCheck_2017-06-21-18-54.json

diff --git a/common/changes/office-ui-fabric-react/betrue-selectionCheck_2017-06-21-18-54.json b/common/changes/office-ui-fabric-react/betrue-selectionCheck_2017-06-21-18-54.json
new file mode 100644
index 0000000000000..25c0973621fe2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/betrue-selectionCheck_2017-06-21-18-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Check: reduced size of selection check background by 2px",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "betrue@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.scss b/packages/office-ui-fabric-react/src/components/Check/Check.scss
index 931fd907ac5d2..90c8d69079a17 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.scss
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.scss
@@ -11,8 +11,8 @@ $checkBoxHeight: 24px;
 
 .root {
   line-height: 1;
-  width: $checkBoxHeight;
-  height: $checkBoxHeight;
+  width: $checkBoxHeight - 2px;
+  height: $checkBoxHeight - 2px;
   vertical-align: top;
   position: relative;
   @include ms-user-select(none);

From d02c0cea8eadf7459cf5754de5db234330d24572 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 21 Jun 2017 15:49:21 -0700
Subject: [PATCH 0149/1641] Toggle fix form submit (#2042)

* Toggle: No longer triggers form submission

* Add change file
---
 ...ggle-fix-form-submit_2017-06-21-18-54.json | 11 ++++++++
 .../src/components/Toggle/Toggle.test.tsx     | 28 +++++++++++++++++--
 .../src/components/Toggle/Toggle.tsx          |  3 +-
 3 files changed, 39 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/toggle-fix-form-submit_2017-06-21-18-54.json

diff --git a/common/changes/office-ui-fabric-react/toggle-fix-form-submit_2017-06-21-18-54.json b/common/changes/office-ui-fabric-react/toggle-fix-form-submit_2017-06-21-18-54.json
new file mode 100644
index 0000000000000..1ea491bc64601
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/toggle-fix-form-submit_2017-06-21-18-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Toggle: No longer triggers form submission",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
index 25c5697478770..9e2d3e79bba88 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
@@ -1,10 +1,10 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
-
+import { mount } from 'enzyme';
 import * as ReactDOM from 'react-dom';
 import * as ReactTestUtils from 'react-addons-test-utils';
-
+import * as sinon from 'sinon';
 let { expect } = chai;
 
 import { Toggle } from './Toggle';
@@ -76,4 +76,28 @@ describe('Toggle', () => {
     expect(label).is.null;
   });
 
+  it(`doesn't trigger onSubmit when placed inside a form`, () => {
+    let component;
+    const onSubmit = sinon.spy();
+
+    const wrapper = mount(
+      <form action='#' onSubmit={ (e) => {
+        onSubmit();
+        e.preventDefault();
+      } }>
+        <Toggle
+          componentRef={ ref => component = ref }
+          label='Label'
+        />
+      </form>
+    );
+    let button: any = wrapper.find('button');
+    // simulate to change toggle state
+    button.simulate('click');
+    // click to force propegation to form wrapper https://github.com/airbnb/enzyme/issues/308#issuecomment-255630011
+    button.get(0).click();
+    expect((component as React.Component<any, any>).state.isChecked).to.equal(true);
+    expect(onSubmit.called).to.equal(false);
+  });
+
 });
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
index ef5afb7c12640..8abab557198cf 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
@@ -108,6 +108,7 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
         <div className={ classNames.container } >
           <button
             { ...toggleNativeProps }
+            type='button'
             className={ classNames.pill }
             ref={ (c): HTMLButtonElement => this._toggleButton = c }
             aria-disabled={ disabled }
@@ -221,6 +222,6 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
       ) as string,
 
     };
-  };
+  }
 
 }

From 68e504c830f880e0051493c74b83395d36db93b7 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 21 Jun 2017 15:49:49 -0700
Subject: [PATCH 0150/1641] Dialog: Rework deprecate logic to fix warnings
 (#2025)

* Dialog: Rework deprecate logic to fix warnings

* change file

* Fixed undefined checks on boolean and number values. Fixed deprecation notice on choicegroup example
---
 ...recation-warning-fix_2017-06-20-17-51.json | 11 +++
 .../src/components/Dialog/Dialog.test.tsx     | 72 +++++++++----------
 .../src/components/Dialog/Dialog.tsx          | 60 +++++++++-------
 .../Dialog/DialogPage.visualtest.tsx          |  2 +-
 .../Dialog/examples/Dialog.Basic.Example.tsx  |  2 +-
 .../examples/Dialog.Blocking.Example.tsx      |  2 +-
 .../examples/Dialog.LargeHeader.Example.tsx   |  2 +-
 7 files changed, 87 insertions(+), 64 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/modal-deprecation-warning-fix_2017-06-20-17-51.json

diff --git a/common/changes/office-ui-fabric-react/modal-deprecation-warning-fix_2017-06-20-17-51.json b/common/changes/office-ui-fabric-react/modal-deprecation-warning-fix_2017-06-20-17-51.json
new file mode 100644
index 0000000000000..db614112c6879
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/modal-deprecation-warning-fix_2017-06-20-17-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dialog: Reworked deprecation logic to fix warnings",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
index 99a610d17f0fa..d1c9932024311 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
@@ -5,7 +5,7 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 
 import {
-    setWarningCallback,
+  setWarningCallback,
 } from '@uifabric/utilities';
 
 let { expect } = chai;
@@ -15,52 +15,52 @@ import { Dialog } from './Dialog';
 // export function setWarningCallback(warningCallback: (message: string) => void): void;
 
 describe('Dialog', () => {
-    beforeEach(() => {
-        setWarningCallback(message => null);
-    });
-    afterEach(() => {
-        [].forEach.call(document.querySelectorAll('body > div'), div => div.parentNode.removeChild(div));
+  beforeEach(() => {
+    setWarningCallback(message => null);
+  });
+  afterEach(() => {
+    [].forEach.call(document.querySelectorAll('body > div'), div => div.parentNode.removeChild(div));
 
-        expect(document.querySelector('.ms-Dialog')).to.be.null;
-    });
+    expect(document.querySelector('.ms-Dialog')).to.be.null;
+  });
 
-    it('Fires dismissed after closing', () => {
-        let dismissedCalled = false;
+  it('Fires dismissed after closing', () => {
+    let dismissedCalled = false;
 
-        const handleDismissed = () => {
-            dismissedCalled = true;
-        };
+    const handleDismissed = () => {
+      dismissedCalled = true;
+    };
 
-        const div = document.createElement('div');
-        ReactDOM.render(<Dialog isOpen={true} onDismissed={handleDismissed} />, div);
-        ReactDOM.render(<Dialog isOpen={false} onDismissed={handleDismissed} />, div);
+    const div = document.createElement('div');
+    ReactDOM.render(<Dialog hidden={ false } onDismissed={ handleDismissed } />, div);
+    ReactDOM.render(<Dialog hidden={ true } onDismissed={ handleDismissed } />, div);
 
-        setTimeout(() => {
-            const dialog = document.querySelector('.ms-Dialog');
-            expect(dialog).to.be.null;
+    setTimeout(() => {
+      const dialog = document.querySelector('.ms-Dialog');
+      expect(dialog).to.be.null;
 
-            expect(dismissedCalled).to.be.true;
-        }, 400);
+      expect(dismissedCalled).to.be.true;
+    }, 400);
 
-    });
+  });
 
-    it('Fires dismissed after hidden', () => {
-        let dismissedCalled = false;
+  it('Fires dismissed after hidden', () => {
+    let dismissedCalled = false;
 
-        const handleDismissed = () => {
-            dismissedCalled = true;
-        };
+    const handleDismissed = () => {
+      dismissedCalled = true;
+    };
 
-        const div = document.createElement('div');
-        ReactDOM.render(<Dialog hidden={false} modalProps={{ onDismissed: handleDismissed }} />, div);
-        ReactDOM.render(<Dialog hidden={true} modalProps={{ onDismissed: handleDismissed }} />, div);
+    const div = document.createElement('div');
+    ReactDOM.render(<Dialog hidden={ false } modalProps={ { onDismissed: handleDismissed } } />, div);
+    ReactDOM.render(<Dialog hidden={ true } modalProps={ { onDismissed: handleDismissed } } />, div);
 
-        setTimeout(() => {
-            const dialog = document.querySelector('.ms-Dialog');
-            expect(dialog).to.be.null;
+    setTimeout(() => {
+      const dialog = document.querySelector('.ms-Dialog');
+      expect(dialog).to.be.null;
 
-            expect(dismissedCalled).to.be.true;
-        }, 400);
+      expect(dismissedCalled).to.be.true;
+    }, 400);
 
-    });
+  });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
index 50dd2cc15642c..4cf5837f49193 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
@@ -22,17 +22,18 @@ export interface IDialogState {
 export class Dialog extends BaseComponent<IDialogProps, IDialogState> {
 
   public static defaultProps: IDialogProps = {
-    modalProps: {},
-    dialogContentProps: {},
-    // deprecated props
-    isOpen: false,
-    type: DialogType.normal,
-    isDarkOverlay: true,
-    isBlocking: false,
-    className: '',
-    containerClassName: '',
-    contentClassName: '',
-    topButtonsProps: [],
+    modalProps: {
+      isDarkOverlay: true,
+      isBlocking: false,
+      className: '',
+      containerClassName: ''
+    },
+    dialogContentProps: {
+      type: DialogType.normal,
+      className: '',
+      topButtonsProps: [],
+    },
+    hidden: true,
   };
 
   constructor(props: IDialogProps) {
@@ -71,6 +72,7 @@ export class Dialog extends BaseComponent<IDialogProps, IDialogState> {
       isClickableOutsideFocusTrap,
       isDarkOverlay,
       isOpen,
+      className,
       onDismiss,
       onDismissed,
       onLayerDidMount,
@@ -94,29 +96,39 @@ export class Dialog extends BaseComponent<IDialogProps, IDialogState> {
         firstFocusableSelector={ firstFocusableSelector }
         forceFocusInsideTrap={ forceFocusInsideTrap }
         ignoreExternalFocusing={ ignoreExternalFocusing }
-        isBlocking={ isBlocking }
         isClickableOutsideFocusTrap={ isClickableOutsideFocusTrap }
-        isDarkOverlay={ isDarkOverlay }
-        isOpen={ hidden !== undefined ? !hidden : isOpen }
         onDismissed={ onDismissed }
         onLayerDidMount={ onLayerDidMount }
         responsiveMode={ responsiveMode }
         { ...modalProps }
-        className={ css('ms-Dialog', modalProps.className) }
-        containerClassName={ css(containerClassName, styles.main, modalProps.containerClassName) }
-        onDismiss={ modalProps.onDismiss || onDismiss }
-        subtitleAriaId={ this._getAriaLabelId(modalProps.subtitleAriaId ? modalProps.subtitleAriaId : ariaDescribedById, subText, id + '-subText') }
-        titleAriaId={ this._getAriaLabelId(modalProps.titleAriaId ? modalProps.titleAriaId : ariaLabelledById, title, id + '-title') }
+        isDarkOverlay={ isDarkOverlay !== undefined ? isDarkOverlay : modalProps.isDarkOverlay }
+        isBlocking={ isBlocking !== undefined ? isBlocking : modalProps.isBlocking }
+        isOpen={ isOpen !== undefined ? isOpen : !hidden }
+        className={ css('ms-Dialog', className ? className : modalProps.className) }
+        containerClassName={ css(styles.main, containerClassName ? containerClassName : modalProps.containerClassName) }
+        onDismiss={ onDismiss ? onDismiss : modalProps.onDismiss }
+        subtitleAriaId={
+          this._getAriaLabelId(
+            ariaDescribedById ? ariaDescribedById : modalProps.subtitleAriaId,
+            subText ? subText : modalProps.subtitleAriaId,
+            id + '-subText'
+          )
+        }
+        titleAriaId={
+          this._getAriaLabelId(
+            modalProps.titleAriaId ? modalProps.titleAriaId : ariaLabelledById,
+            title ? title : modalProps.titleAriaId,
+            id + '-title') }
       >
         <DialogContent
-          showCloseButton={ !isBlocking }
           title={ title }
           subText={ subText }
-          topButtonsProps={ topButtonsProps }
-          type={ type }
           {...dialogContentProps}
-          onDismiss={ dialogContentProps.onDismiss || onDismiss }
-          className={ css(contentClassName, dialogContentProps.className) }
+          showCloseButton={ isBlocking !== undefined ? !isBlocking : !modalProps.isBlocking }
+          topButtonsProps={ topButtonsProps ? topButtonsProps : dialogContentProps.topButtonsProps }
+          type={ type !== undefined ? type : dialogContentProps.type }
+          onDismiss={ onDismiss ? onDismiss : dialogContentProps.onDismiss }
+          className={ css(contentClassName ? contentClassName : dialogContentProps.className) }
         >
           { this.props.children }
         </DialogContent>
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.visualtest.tsx
index 2a9a22152d0a5..25b30cdc5c4d1 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.visualtest.tsx
@@ -7,7 +7,7 @@ export default class DialogVPage extends React.Component<any, any> {
   public render() {
     return <div>
       <Dialog
-        isOpen={ true }
+        hidden={ false }
         className='Dialog'
         title='All emails together'
         subText='Your Inbox has changed.'
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
index d07d1ed6c38c5..cf5568bab7b1d 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
@@ -55,7 +55,7 @@ export class DialogBasicExample extends React.Component<any, any> {
                 disabled: true
               }
             ] }
-            onChanged={ this._onChoiceChanged }
+            onChange={ this._onChoiceChanged }
           />
           { null /** You can also include null values as the result of conditionals */ }
           <DialogFooter>
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx
index 419fb167a47ea..61ad7bd88f397 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx
@@ -50,7 +50,7 @@ export class DialogBlockingExample extends React.Component<any, any> {
                 disabled: true
               }
             ] }
-            onChanged={ this._onChoiceChanged }
+            onChange={ this._onChoiceChanged }
           />
           <DialogFooter>
             <PrimaryButton onClick={ this._closeDialog.bind(this) } text='Save' />
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.LargeHeader.Example.tsx b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.LargeHeader.Example.tsx
index def21b76ce98f..def7282ae5432 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.LargeHeader.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.LargeHeader.Example.tsx
@@ -50,7 +50,7 @@ export class DialogLargeHeaderExample extends React.Component<any, any> {
                 disabled: true
               }
             ] }
-            onChanged={ this._onChoiceChanged }
+            onChange={ this._onChoiceChanged }
           />
           <DialogFooter>
             <PrimaryButton onClick={ this._closeDialog.bind(this) } text='Save' />

From 76cc7e2dcaa05bddf8c5106fc2e382d6d82aad7e Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 22 Jun 2017 10:13:03 +0000
Subject: [PATCH 0151/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...etrue-selectionCheck_2017-06-21-18-54.json | 11 -----
 .../breadcrumb-bug-fix_2017-06-21-16-20.json  | 11 -----
 ...controlled-component_2017-06-21-17-20.json | 11 -----
 .../lindach-ImageReflow_2017-06-20-18-25.json | 11 -----
 ...recation-warning-fix_2017-06-20-17-51.json | 11 -----
 ...ggle-fix-form-submit_2017-06-21-18-54.json | 11 -----
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 44 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 14 +++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/CHANGELOG.json               |  6 +++
 packages/styling/CHANGELOG.md                 |  7 ++-
 packages/styling/package.json                 |  2 +-
 18 files changed, 78 insertions(+), 77 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/betrue-selectionCheck_2017-06-21-18-54.json
 delete mode 100644 common/changes/office-ui-fabric-react/breadcrumb-bug-fix_2017-06-21-16-20.json
 delete mode 100644 common/changes/office-ui-fabric-react/dropdown-fix-controlled-component_2017-06-21-17-20.json
 delete mode 100644 common/changes/office-ui-fabric-react/lindach-ImageReflow_2017-06-20-18-25.json
 delete mode 100644 common/changes/office-ui-fabric-react/modal-deprecation-warning-fix_2017-06-20-17-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/toggle-fix-form-submit_2017-06-21-18-54.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index e85094857f0f2..88823b85d967c 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.9.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.9.2 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 41febbeb19359..f2b812e05a06c 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.9.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.9.2 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index fa56c4f58bb4e..0e6c097f8ede9 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.9.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.9.2 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 34b520ae76492..e9cb20fbc2445 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.9.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.9.2 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/office-ui-fabric-react/betrue-selectionCheck_2017-06-21-18-54.json b/common/changes/office-ui-fabric-react/betrue-selectionCheck_2017-06-21-18-54.json
deleted file mode 100644
index 25c0973621fe2..0000000000000
--- a/common/changes/office-ui-fabric-react/betrue-selectionCheck_2017-06-21-18-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Check: reduced size of selection check background by 2px",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "betrue@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/breadcrumb-bug-fix_2017-06-21-16-20.json b/common/changes/office-ui-fabric-react/breadcrumb-bug-fix_2017-06-21-16-20.json
deleted file mode 100644
index df407393fa947..0000000000000
--- a/common/changes/office-ui-fabric-react/breadcrumb-bug-fix_2017-06-21-16-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Breadcrumb: Fixed overflow logic and extra icon",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/dropdown-fix-controlled-component_2017-06-21-17-20.json b/common/changes/office-ui-fabric-react/dropdown-fix-controlled-component_2017-06-21-17-20.json
deleted file mode 100644
index 8ca77dbeac66b..0000000000000
--- a/common/changes/office-ui-fabric-react/dropdown-fix-controlled-component_2017-06-21-17-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: fixed bug that didn't allow operating Dropdown as a controlled component",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/lindach-ImageReflow_2017-06-20-18-25.json b/common/changes/office-ui-fabric-react/lindach-ImageReflow_2017-06-20-18-25.json
deleted file mode 100644
index fe66a37f3f31b..0000000000000
--- a/common/changes/office-ui-fabric-react/lindach-ImageReflow_2017-06-20-18-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix Persona control DOM reflow by passing ImageCoverStyle to Image control",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lindach@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/modal-deprecation-warning-fix_2017-06-20-17-51.json b/common/changes/office-ui-fabric-react/modal-deprecation-warning-fix_2017-06-20-17-51.json
deleted file mode 100644
index db614112c6879..0000000000000
--- a/common/changes/office-ui-fabric-react/modal-deprecation-warning-fix_2017-06-20-17-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dialog: Reworked deprecation logic to fix warnings",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/toggle-fix-form-submit_2017-06-21-18-54.json b/common/changes/office-ui-fabric-react/toggle-fix-form-submit_2017-06-21-18-54.json
deleted file mode 100644
index 1ea491bc64601..0000000000000
--- a/common/changes/office-ui-fabric-react/toggle-fix-form-submit_2017-06-21-18-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Toggle: No longer triggers form submission",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 7cc79e2e1e8de..cf34713d1ecef 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -47,7 +47,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.11.1 <1.0.0",
+    "@uifabric/styling": ">=0.11.2 <1.0.0",
     "@uifabric/utilities": ">=4.4.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index f28060545149b..abfb8986d4e6b 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.9.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.9.2 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index b15a066f94da0..65f1e14cb01e6 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,50 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.9.2",
+      "tag": "office-ui-fabric-react_v4.9.2",
+      "date": "Thu, 22 Jun 2017 10:13:03 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Ben Truelove <betrue@microsoft.com>",
+            "commit": "348ea5ded2c29f8c4a091f1e1198c916f748b92c",
+            "comment": "Check: reduced size of selection check background by 2px"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "2e9309fd851bb36a249a408a9955ed18fe87a320",
+            "comment": "Breadcrumb: Fixed overflow logic and extra icon"
+          },
+          {
+            "author": "Michael Loughry <miclo@microsoft.com>",
+            "commit": "d55ef47bc6f05e163d39785b56d9557889c1ce41",
+            "comment": "Dropdown: fixed bug that didn't allow operating Dropdown as a controlled component"
+          },
+          {
+            "author": "lindach167 <lindach@microsoft.com>",
+            "commit": "9c69b33ffaa656ee95543d30c747a50b9bbf109b",
+            "comment": "Fix Persona control DOM reflow by passing ImageCoverStyle to Image control"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "68e504c830f880e0051493c74b83395d36db93b7",
+            "comment": "Dialog: Reworked deprecation logic to fix warnings"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "d02c0cea8eadf7459cf5754de5db234330d24572",
+            "comment": "Toggle: No longer triggers form submission"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.11.1 <1.0.0` to `>=0.11.2 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.9.1",
       "tag": "office-ui-fabric-react_v4.9.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 450e914c8a19d..ef436eeb17b5e 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,18 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 21 Jun 2017 00:45:41 GMT and should not be manually modified.
+This log was last generated on Thu, 22 Jun 2017 10:13:03 GMT and should not be manually modified.
+
+## 4.9.2
+Thu, 22 Jun 2017 10:13:03 GMT
+
+### Patches
+
+- Check: reduced size of selection check background by 2px
+- Breadcrumb: Fixed overflow logic and extra icon
+- Dropdown: fixed bug that didn't allow operating Dropdown as a controlled component
+- Fix Persona control DOM reflow by passing ImageCoverStyle to Image control
+- Dialog: Reworked deprecation logic to fix warnings
+- Toggle: No longer triggers form submission
 
 ## 4.9.1
 Wed, 21 Jun 2017 00:45:41 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 990dafbf34de5..0f844571913da 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.9.1",
+  "version": "4.9.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.4.0 <5.0.0",
-    "@uifabric/styling": ">=0.11.1 <1.0.0",
+    "@uifabric/styling": ">=0.11.2 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 1f15a18252d77..5ec5164c5f512 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.11.2",
+      "tag": "@uifabric/styling_v0.11.2",
+      "date": "Thu, 22 Jun 2017 10:13:03 GMT",
+      "comments": {}
+    },
     {
       "version": "0.11.1",
       "tag": "@uifabric/styling_v0.11.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 31663a9c718ad..69f8096751ae1 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Wed, 21 Jun 2017 01:52:48 GMT and should not be manually modified.
+This log was last generated on Thu, 22 Jun 2017 10:13:03 GMT and should not be manually modified.
+
+## 0.11.2
+Thu, 22 Jun 2017 10:13:03 GMT
+
+*Changes not tracked*
 
 ## 0.11.1
 Wed, 21 Jun 2017 01:52:48 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 462d56c35bcaa..1a0955e89b531 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.11.1",
+  "version": "0.11.2",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 5054be87e371308937faf86b67eb9eb9de10ae1c Mon Sep 17 00:00:00 2001
From: antonlabunets <alabunets@gmail.com>
Date: Thu, 22 Jun 2017 10:21:05 -0700
Subject: [PATCH 0152/1641] Expose focus in ISearchBox (#2046)

* Expose focus in ISearchBox
---
 ...onla-searhbox-focusInterface_2017-06-22-01-13.json | 11 +++++++++++
 .../src/components/SearchBox/SearchBox.Props.ts       |  5 ++++-
 2 files changed, 15 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/antonla-searhbox-focusInterface_2017-06-22-01-13.json

diff --git a/common/changes/office-ui-fabric-react/antonla-searhbox-focusInterface_2017-06-22-01-13.json b/common/changes/office-ui-fabric-react/antonla-searhbox-focusInterface_2017-06-22-01-13.json
new file mode 100644
index 0000000000000..20af9fb0ed87d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/antonla-searhbox-focusInterface_2017-06-22-01-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Expose focus() on ISearchBox",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "antonla@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts
index bfb189ecdd9c4..8b06e793d2000 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts
@@ -2,7 +2,10 @@ import * as React from 'react';
 import { SearchBox } from './SearchBox';
 
 export interface ISearchBox {
-
+  /**
+   * Sets focus inside the search input box.
+   */
+  focus(): void;
 }
 
 export interface ISearchBoxProps extends React.Props<SearchBox> {

From 0d7e76729e12cf7983cf6ce25df9da8630ac1f4d Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 22 Jun 2017 11:42:13 -0700
Subject: [PATCH 0153/1641] ResizeGroup: Add dataDidRender prop that can be
 used to know what is actually rendered by a resizeGroup (#2009)

* Add onNewDataRendered

* Add some tests, tweak comments

* Rush change

* Change callback to dataDidRender and invoke it on every render.

* Update onNewDataRendered_2017-06-16-22-21.json
---
 .../onNewDataRendered_2017-06-16-22-21.json   | 11 +++++
 .../ResizeGroup/ResizeGroup.Props.ts          | 14 ++++++-
 .../ResizeGroup/ResizeGroup.test.tsx          | 40 ++++++++++++++++++-
 .../components/ResizeGroup/ResizeGroup.tsx    |  6 +++
 4 files changed, 67 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/onNewDataRendered_2017-06-16-22-21.json

diff --git a/common/changes/office-ui-fabric-react/onNewDataRendered_2017-06-16-22-21.json b/common/changes/office-ui-fabric-react/onNewDataRendered_2017-06-16-22-21.json
new file mode 100644
index 0000000000000..bc320e06d2379
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/onNewDataRendered_2017-06-16-22-21.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ResizeGroup: Add dataDidRender prop that can be used to know what is actually rendered by a resizeGroup",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts
index 0431ec2cb4a0c..d14adb008a311 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts
@@ -14,12 +14,14 @@ export interface IResizeGroupProps extends React.HTMLAttributes<ResizeGroup | HT
   componentRef?: (component: IResizeGroup) => void;
 
   /**
-   * Data to be passed to the onRenderData function
+   * Initial data to be passed to the onRenderData function. This data should represent what will be passed to the
+   * render function when the parent container of the ResizeGroup is at it's maximum supported width.
   */
   data?: any;
 
   /**
-   * Function to render the data
+   * Function to render the data. Called when rendering the contents to the screen and when
+   * rendering in a hidden div to measure the size of the contents.
   */
   onRenderData: (data: any) => JSX.Element;
 
@@ -29,4 +31,12 @@ export interface IResizeGroupProps extends React.HTMLAttributes<ResizeGroup | HT
    * an infinite render loop.
   */
   onReduceData: (prevData: any) => any;
+
+  /**
+   * Function to be called every time data is rendered. It provides the data that was actually rendered.
+   * A use case would be adding telemetry when a particular control is shown in an overflow well or
+   * dropped as a result of onReduceData or to count the number of renders that an implementation of
+   * onReduceData triggers.
+   */
+  dataDidRender?: (renderedData: any) => void;
 }
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
index 57b805e6e53be..52166beaf2b56 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
@@ -23,17 +23,20 @@ function getWrapperWithMocks(data: ITestScalingData = { scalingIndex: 5 },
   onReduceData: (data: ITestScalingData) => ITestScalingData = onReduceScalingData) {
   const onReduceDataSpy = sinon.spy(onReduceData);
   const onRenderDataSpy = sinon.spy();
+  const dataDidRenderSpy = sinon.spy();
 
   let wrapper = mount<IResizeGroupProps, IResizeGroupState>(<ResizeGroup
     data={ data }
     onReduceData={ onReduceDataSpy }
     onRenderData={ onRenderDataSpy }
+    dataDidRender={ dataDidRenderSpy }
   />);
 
   return {
     wrapper,
     onReduceDataSpy,
     onRenderDataSpy,
+    dataDidRenderSpy,
     ...getMeasurementMocks(wrapper)
   };
 }
@@ -114,19 +117,26 @@ describe('ResizeGroup', () => {
   it('remeasures if props are updated', () => {
     const onReduceData = sinon.spy();
     const onRenderData = sinon.spy();
+    const dataDidRender = sinon.spy();
 
     let wrapper = mount(<ResizeGroup
       data={ { a: 1 } }
       onReduceData={ onReduceData }
       onRenderData={ onRenderData }
+      dataDidRender={ dataDidRender }
     />);
 
+    let newData = { a: 2 };
     wrapper.setProps({
-      data: { a: 2 },
+      data: newData,
     });
 
     // onRenderData should get called to measure and to render when props are updated.
     expect(onRenderData.callCount).to.equal(4);
+
+    // it should call onNewDataRendered with new properties
+    expect(dataDidRender.callCount).to.equal(2);
+    expect(dataDidRender.getCall(1).args[0]).to.deep.equal(newData);
   });
 
   it('calls onReduceData when contents do not fit', () => {
@@ -298,8 +308,10 @@ describe('ResizeGroup', () => {
     let { wrapper,
       onReduceDataSpy,
       rootGetClientRectMock,
-      measuredGetClientRectMock } = getWrapperWithMocks(data, onReduceScalingData);
+      measuredGetClientRectMock,
+      dataDidRenderSpy } = getWrapperWithMocks(data, onReduceScalingData);
 
+    dataDidRenderSpy.reset();
     onReduceDataSpy.reset();
     measuredGetClientRectMock.reset();
     rootGetClientRectMock.reset();
@@ -318,6 +330,13 @@ describe('ResizeGroup', () => {
       renderedData: { scalingIndex: 5 },
       shouldMeasure: false
     });
+
+    // Each measure triggers a render, but the rendered contents only change after the measurement phase completes.
+    expect(dataDidRenderSpy.callCount).to.equal(4);
+    expect(dataDidRenderSpy.getCall(0).args[0]).to.deep.equal({ scalingIndex: 7 });
+    expect(dataDidRenderSpy.getCall(1).args[0]).to.deep.equal({ scalingIndex: 7 });
+    expect(dataDidRenderSpy.getCall(2).args[0]).to.deep.equal({ scalingIndex: 7 });
+    expect(dataDidRenderSpy.getCall(3).args[0]).to.deep.equal({ scalingIndex: 5 });
   });
 
   it('renders no more than twice when everything fits', () => {
@@ -394,4 +413,21 @@ describe('ResizeGroup', () => {
 
     expect(wrapper.state().renderedData).to.deep.equal(data);
   });
+
+  it('calls dataDidRender for the initial render', () => {
+    const initialData = { content: 7 };
+    const dataDidRender = sinon.spy();
+
+    const wrapper = mount<IResizeGroupProps, IResizeGroupState>(
+      <ResizeGroup
+        data={ initialData }
+        onReduceData={ onReduceScalingData }
+        onRenderData={ sinon.spy() }
+        dataDidRender={ dataDidRender }
+      />
+    );
+
+    expect(dataDidRender.callCount).to.equal(1);
+    expect(dataDidRender.getCall(0).args[0]).to.deep.equal(initialData);
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index 47c370d58dfe8..af9f7db63c567 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -89,6 +89,12 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
 
   public componentDidUpdate(prevProps: IResizeGroupProps) {
     this._measureItems();
+
+    if (this.state.renderedData) {
+      if (this.props.dataDidRender) {
+        this.props.dataDidRender(this.state.renderedData);
+      }
+    }
   }
 
   private _onResize() {

From 6c51b2e12823ec80e3727635b15b0ee83099c382 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Thu, 22 Jun 2017 14:21:39 -0700
Subject: [PATCH 0154/1641] Fix row focus handling for DetailsList (#2044)

* Fix row focus handling for DetailsList

* Fix resizing of column headers

* Update change output
---
 .../row-focus_2017-06-21-23-34.json           |  11 ++
 .../components/DetailsList/DetailsHeader.tsx  | 131 ++++++++++--------
 .../components/DetailsList/DetailsList.tsx    |  46 +++---
 .../src/components/DetailsList/DetailsRow.tsx |  24 +++-
 4 files changed, 124 insertions(+), 88 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/row-focus_2017-06-21-23-34.json

diff --git a/common/changes/office-ui-fabric-react/row-focus_2017-06-21-23-34.json b/common/changes/office-ui-fabric-react/row-focus_2017-06-21-23-34.json
new file mode 100644
index 0000000000000..7911fd8203e33
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/row-focus_2017-06-21-23-34.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix some focus issues in DetailsList",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index 9e2966169043f..14fad273ab689 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -25,7 +25,12 @@ const MOUSEDOWN_PRIMARY_BUTTON = 0; // for mouse down event we are using ev.butt
 const MOUSEMOVE_PRIMARY_BUTTON = 1; // for mouse move event we are using ev.buttons property, 1 means left button
 const INNER_PADDING = 16;
 
+export interface IDetailsHeader {
+  focus(): boolean;
+}
+
 export interface IDetailsHeaderProps extends React.Props<DetailsHeader> {
+  componentRef?: (component: IDetailsHeader) => void;
   columns: IColumn[];
   selection: ISelection;
   selectionMode: SelectionMode;
@@ -67,7 +72,7 @@ export interface IColumnResizeDetails {
   columnMinWidth: number;
 }
 
-export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHeaderState> {
+export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHeaderState> implements IDetailsHeader {
   public static defaultProps = {
     isSelectAllVisible: SelectAllVisibility.visible
   };
@@ -124,8 +129,6 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
       onRenderColumnHeaderTooltip = this._onRenderColumnHeaderTooltip
     } = this.props;
 
-    const ColumnHeaderTooltip = (props: ITooltipHostProps) => onRenderColumnHeaderTooltip(props, this._onRenderColumnHeaderTooltip);
-
     return (
       <FocusZone
         role='row'
@@ -151,18 +154,22 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
             <span
               aria-label={ ariaLabelForSelectionColumn }
             ></span>
-            <ColumnHeaderTooltip
-              hostClassName={ css(styles.checkTooltip) }
-              id={ `${this._id}-checkTooltip` }
-              setAriaDescribedBy={ false }
-              content={ ariaLabelForSelectAllCheckbox }>
-              <DetailsRowCheck
-                aria-describedby={ `${this._id}-checkTooltip` }
-                selected={ isAllSelected }
-                anySelected={ false }
-                canSelect={ true }
-              />
-            </ColumnHeaderTooltip>
+            {
+              onRenderColumnHeaderTooltip({
+                hostClassName: css(styles.checkTooltip),
+                id: `${this._id}-checkTooltip`,
+                setAriaDescribedBy: false,
+                content: ariaLabelForSelectAllCheckbox,
+                children: (
+                  <DetailsRowCheck
+                    aria-describedby={ `${this._id}-checkTooltip` }
+                    selected={ isAllSelected }
+                    anySelected={ false }
+                    canSelect={ true }
+                  />
+                )
+              }, this._onRenderColumnHeaderTooltip)
+            }
           </div>
         ) : null }
         { groupNestingDepth > 0 ? (
@@ -206,51 +213,55 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
                 data-automationid='ColumnsHeaderColumn'
                 data-item-key={ column.key }
               >
-                <ColumnHeaderTooltip
-                  hostClassName={ css(styles.cellTooltip) }
-                  id={ `${this._id}-${column.key}-tooltip` }
-                  setAriaDescribedBy={ false }
-                  content={ column.columnActionsMode !== ColumnActionsMode.disabled ? column.ariaLabel : '' }
-                >
-                  <span
-                    className={ css('ms-DetailsHeader-cellTitle', styles.cellTitle) }
-                    data-is-focusable={ column.columnActionsMode !== ColumnActionsMode.disabled }
-                    role={ column.columnActionsMode !== ColumnActionsMode.disabled ? 'button' : undefined }
-                    aria-describedby={ `${this._id}-${column.key}-tooltip` }
-                    onContextMenu={ this._onColumnContextMenu.bind(this, column) }
-                    onClick={ this._onColumnClick.bind(this, column) }
-                  >
-                    { column.isFiltered && (
-                      <Icon className={ styles.nearIcon } iconName='Filter' />
-                    ) }
-
-                    { column.isSorted && (
-                      <Icon className={ styles.nearIcon } iconName={ column.isSortedDescending ? 'SortDown' : 'SortUp' } />
-                    ) }
-
-                    { column.isGrouped && (
-                      <Icon className={ styles.nearIcon } iconName='GroupedDescending' />
-                    ) }
-
-                    <span
-                      aria-label={ column.isIconOnly ? column.name : undefined }
-                      className={ css('ms-DetailsHeader-cellName', styles.cellName) }
-                    >
-                      { (column.iconName || column.iconClassName) && (
-                        <Icon className={ css(styles.nearIcon, column.iconClassName) } iconName={ column.iconName } />
-                      ) }
-
-                      { !column.isIconOnly ? column.name : undefined }
-                    </span>
-
-                    { column.columnActionsMode === ColumnActionsMode.hasDropdown && !column.isIconOnly && (
-                      <Icon
-                        className={ css('ms-DetailsHeader-filterChevron', styles.filterChevron) }
-                        iconName='ChevronDown'
-                      />
-                    ) }
-                  </span>
-                </ColumnHeaderTooltip>
+                {
+                  onRenderColumnHeaderTooltip({
+                    hostClassName: css(styles.cellTooltip),
+                    id: `${this._id}-${column.key}-tooltip`,
+                    setAriaDescribedBy: false,
+                    content: column.columnActionsMode !== ColumnActionsMode.disabled ? column.ariaLabel : '',
+                    children: (
+                      <span
+                        className={ css('ms-DetailsHeader-cellTitle', styles.cellTitle) }
+                        data-is-focusable={ column.columnActionsMode !== ColumnActionsMode.disabled }
+                        role={ column.columnActionsMode !== ColumnActionsMode.disabled ? 'button' : undefined }
+                        aria-describedby={ `${this._id}-${column.key}-tooltip` }
+                        onContextMenu={ this._onColumnContextMenu.bind(this, column) }
+                        onClick={ this._onColumnClick.bind(this, column) }
+                      >
+                        { column.isFiltered && (
+                          <Icon className={ styles.nearIcon } iconName='Filter' />
+                        ) }
+
+                        { column.isSorted && (
+                          <Icon className={ styles.nearIcon } iconName={ column.isSortedDescending ? 'SortDown' : 'SortUp' } />
+                        ) }
+
+                        { column.isGrouped && (
+                          <Icon className={ styles.nearIcon } iconName='GroupedDescending' />
+                        ) }
+
+                        <span
+                          aria-label={ column.isIconOnly ? column.name : undefined }
+                          className={ css('ms-DetailsHeader-cellName', styles.cellName) }
+                        >
+                          { (column.iconName || column.iconClassName) && (
+                            <Icon className={ css(styles.nearIcon, column.iconClassName) } iconName={ column.iconName } />
+                          ) }
+
+                          { !column.isIconOnly ? column.name : undefined }
+                        </span>
+
+                        { column.columnActionsMode === ColumnActionsMode.hasDropdown && !column.isIconOnly && (
+                          <Icon
+                            className={ css('ms-DetailsHeader-filterChevron', styles.filterChevron) }
+                            iconName='ChevronDown'
+                          />
+                        ) }
+                      </span>
+
+                    )
+                  }, this._onRenderColumnHeaderTooltip)
+                }
               </div>,
               (column.isResizable) && this._renderColumnSizer(columnIndex)
             ]
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 1f4bf8653dd06..566f47b25d07b 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -21,7 +21,7 @@ import {
   IDetailsList,
   IDetailsListProps,
 } from '../DetailsList/DetailsList.Props';
-import { DetailsHeader, SelectAllVisibility, IDetailsHeaderProps } from '../DetailsList/DetailsHeader';
+import { DetailsHeader, IDetailsHeader, SelectAllVisibility, IDetailsHeaderProps } from '../DetailsList/DetailsHeader';
 import { DetailsRow, IDetailsRowProps } from '../DetailsList/DetailsRow';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import {
@@ -70,7 +70,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
 
   // References
   private _root: HTMLElement;
-  private _header: DetailsHeader;
+  private _header: IDetailsHeader;
   private _groupedList: GroupedList;
   private _list: List;
   private _focusZone: FocusZone;
@@ -250,8 +250,6 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       onRenderDetailsHeader = this._onRenderDetailsHeader
     } = this.props;
 
-    const DetailsHeader = (props: IDetailsHeaderProps) => onRenderDetailsHeader(props, this._onRenderDetailsHeader);
-
     return (
       // If shouldApplyApplicationRole is true, role application will be applied to make arrow keys work
       // with JAWS.
@@ -271,27 +269,25 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
           aria-colcount={ (selectAllVisibility !== SelectAllVisibility.none ? 1 : 0) + (adjustedColumns ? adjustedColumns.length : 0) }
           aria-readonly='true'>
           <div onKeyDown={ this._onHeaderKeyDown } role='presentation'>
-            { isHeaderVisible && (
-              <DetailsHeader
-                ref={ this._resolveRef('_header') }
-                selectionMode={ selectionMode }
-                layoutMode={ layoutMode }
-                selection={ selection }
-                columns={ adjustedColumns }
-                onColumnClick={ onColumnHeaderClick }
-                onColumnContextMenu={ onColumnHeaderContextMenu }
-                onColumnResized={ this._onColumnResized }
-                onColumnIsSizingChanged={ this._onColumnIsSizingChanged }
-                onColumnAutoResized={ this._onColumnAutoResized }
-                groupNestingDepth={ groupNestingDepth }
-                isAllCollapsed={ isCollapsed }
-                onToggleCollapseAll={ this._onToggleCollapse }
-                ariaLabel={ ariaLabelForListHeader }
-                ariaLabelForSelectAllCheckbox={ ariaLabelForSelectAllCheckbox }
-                ariaLabelForSelectionColumn={ ariaLabelForSelectionColumn }
-                selectAllVisibility={ selectAllVisibility }
-              />
-            ) }
+            { isHeaderVisible && onRenderDetailsHeader({
+              componentRef: this._resolveRef('_header'),
+              selectionMode: selectionMode,
+              layoutMode: layoutMode,
+              selection: selection,
+              columns: adjustedColumns,
+              onColumnClick: onColumnHeaderClick,
+              onColumnContextMenu: onColumnHeaderContextMenu,
+              onColumnResized: this._onColumnResized,
+              onColumnIsSizingChanged: this._onColumnIsSizingChanged,
+              onColumnAutoResized: this._onColumnAutoResized,
+              groupNestingDepth: groupNestingDepth,
+              isAllCollapsed: isCollapsed,
+              onToggleCollapseAll: this._onToggleCollapse,
+              ariaLabel: ariaLabelForListHeader,
+              ariaLabelForSelectAllCheckbox: ariaLabelForSelectAllCheckbox,
+              ariaLabelForSelectionColumn: ariaLabelForSelectionColumn,
+              selectAllVisibility: selectAllVisibility
+            }, this._onRenderDetailsHeader) }
           </div>
           <div onKeyDown={ this._onContentKeyDown } role='presentation'>
             <FocusZone
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index 2122c8a134c1c..4d7aab3c5a7ca 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import * as ReactDOM from 'react-dom';
 import {
   BaseComponent,
   IDisposable,
@@ -191,7 +192,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
       <FocusZone
         {...getNativeProps(this.props, divProperties) }
         direction={ FocusZoneDirection.horizontal }
-        ref='root'
+        ref={ this._onRootRef }
         role='row'
         aria-label={ ariaLabel }
         className={ css(
@@ -283,8 +284,12 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
   }
 
   public focus(): boolean {
-    if (this.refs.root) {
-      this.refs.root.focus();
+    const {
+      root
+    } = this.refs;
+
+    if (root) {
+      root.focus();
       return true;
     }
 
@@ -320,6 +325,19 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
     selection.toggleIndexSelected(this.props.itemIndex);
   }
 
+  private _onRootRef(root: FocusZone) {
+    const {
+      refs
+    } = this;
+
+    if (root) {
+      // Need to resolve the actual DOM node, not the component. The element itself will be used for drag/drop and focusing.
+      refs.root = ReactDOM.findDOMNode(root) as HTMLElement;
+    } else {
+      refs.root = undefined;
+    }
+  }
+
   private _getRowDragDropOptions(): IDragDropOptions {
     const {
       item,

From c9c4846ce428c96f4c63e34064c93529c9875982 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 22 Jun 2017 21:45:09 +0000
Subject: [PATCH 0155/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 ...rhbox-focusInterface_2017-06-22-01-13.json | 11 -------
 .../onNewDataRendered_2017-06-16-22-21.json   | 11 -------
 .../row-focus_2017-06-21-23-34.json           | 11 -------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 31 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 14 ++++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/CHANGELOG.json               |  6 ++++
 packages/styling/CHANGELOG.md                 |  7 ++++-
 packages/styling/package.json                 |  2 +-
 12 files changed, 62 insertions(+), 41 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/antonla-searhbox-focusInterface_2017-06-22-01-13.json
 delete mode 100644 common/changes/office-ui-fabric-react/onNewDataRendered_2017-06-16-22-21.json
 delete mode 100644 common/changes/office-ui-fabric-react/row-focus_2017-06-21-23-34.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 88823b85d967c..730cc68fea988 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.9.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.10.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/antonla-searhbox-focusInterface_2017-06-22-01-13.json b/common/changes/office-ui-fabric-react/antonla-searhbox-focusInterface_2017-06-22-01-13.json
deleted file mode 100644
index 20af9fb0ed87d..0000000000000
--- a/common/changes/office-ui-fabric-react/antonla-searhbox-focusInterface_2017-06-22-01-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Expose focus() on ISearchBox",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "antonla@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/onNewDataRendered_2017-06-16-22-21.json b/common/changes/office-ui-fabric-react/onNewDataRendered_2017-06-16-22-21.json
deleted file mode 100644
index bc320e06d2379..0000000000000
--- a/common/changes/office-ui-fabric-react/onNewDataRendered_2017-06-16-22-21.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ResizeGroup: Add dataDidRender prop that can be used to know what is actually rendered by a resizeGroup",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/row-focus_2017-06-21-23-34.json b/common/changes/office-ui-fabric-react/row-focus_2017-06-21-23-34.json
deleted file mode 100644
index 7911fd8203e33..0000000000000
--- a/common/changes/office-ui-fabric-react/row-focus_2017-06-21-23-34.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix some focus issues in DetailsList",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index cf34713d1ecef..a61b5119095b4 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -47,7 +47,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.11.2 <1.0.0",
+    "@uifabric/styling": ">=0.11.3 <1.0.0",
     "@uifabric/utilities": ">=4.4.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index abfb8986d4e6b..1fa35667d094b 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.9.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.10.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 65f1e14cb01e6..36da5a8e7ca5d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,37 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.10.0",
+      "tag": "office-ui-fabric-react_v4.10.0",
+      "date": "Thu, 22 Jun 2017 21:45:08 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "antonlabunets <alabunets@gmail.com>",
+            "commit": "5054be87e371308937faf86b67eb9eb9de10ae1c",
+            "comment": "Expose focus() on ISearchBox"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "0d7e76729e12cf7983cf6ce25df9da8630ac1f4d",
+            "comment": "ResizeGroup: Add dataDidRender prop that can be used to know what is actually rendered by a resizeGroup"
+          },
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "6c51b2e12823ec80e3727635b15b0ee83099c382",
+            "comment": "Fix some focus issues in DetailsList"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.11.2 <1.0.0` to `>=0.11.3 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.9.2",
       "tag": "office-ui-fabric-react_v4.9.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index ef436eeb17b5e..5bac3c95cf58b 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,18 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 22 Jun 2017 10:13:03 GMT and should not be manually modified.
+This log was last generated on Thu, 22 Jun 2017 21:45:08 GMT and should not be manually modified.
+
+## 4.10.0
+Thu, 22 Jun 2017 21:45:08 GMT
+
+### Minor changes
+
+- Expose focus() on ISearchBox
+
+### Patches
+
+- ResizeGroup: Add dataDidRender prop that can be used to know what is actually rendered by a resizeGroup
+- Fix some focus issues in DetailsList
 
 ## 4.9.2
 Thu, 22 Jun 2017 10:13:03 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 0f844571913da..80e374869d62d 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.9.2",
+  "version": "4.10.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.4.0 <5.0.0",
-    "@uifabric/styling": ">=0.11.2 <1.0.0",
+    "@uifabric/styling": ">=0.11.3 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 5ec5164c5f512..1e5644b57dff2 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.11.3",
+      "tag": "@uifabric/styling_v0.11.3",
+      "date": "Thu, 22 Jun 2017 21:45:08 GMT",
+      "comments": {}
+    },
     {
       "version": "0.11.2",
       "tag": "@uifabric/styling_v0.11.2",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 69f8096751ae1..b7f8449df2d9e 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 22 Jun 2017 10:13:03 GMT and should not be manually modified.
+This log was last generated on Thu, 22 Jun 2017 21:45:08 GMT and should not be manually modified.
+
+## 0.11.3
+Thu, 22 Jun 2017 21:45:08 GMT
+
+*Changes not tracked*
 
 ## 0.11.2
 Thu, 22 Jun 2017 10:13:03 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 1a0955e89b531..b87e391448092 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.11.2",
+  "version": "0.11.3",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 60d27e12f5d7ce5245256ee6e46eab416acec470 Mon Sep 17 00:00:00 2001
From: Anton Frolov <frolov.anton@gmail.com>
Date: Thu, 22 Jun 2017 20:43:44 -0700
Subject: [PATCH 0156/1641] Fix FocusZone to stop eating spacebars in textarea
 (#2054)

---
 .../fix-focuszone-textarea_2017-06-22-22-19.json      | 11 +++++++++++
 .../src/components/FocusZone/FocusZone.tsx            |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-focuszone-textarea_2017-06-22-22-19.json

diff --git a/common/changes/office-ui-fabric-react/fix-focuszone-textarea_2017-06-22-22-19.json b/common/changes/office-ui-fabric-react/fix-focuszone-textarea_2017-06-22-22-19.json
new file mode 100644
index 0000000000000..6634c7aff12c5
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-focuszone-textarea_2017-06-22-22-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix FocusZone stop eating spacebar presses in textarea fields",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "frolov.anton@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 32d87de74f354..ab452ea18e90f 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -367,7 +367,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     }
 
     do {
-      if (target.tagName === 'BUTTON' || target.tagName === 'A' || target.tagName === 'INPUT') {
+      if (target.tagName === 'BUTTON' || target.tagName === 'A' || target.tagName === 'INPUT' || target.tagName === 'TEXTAREA') {
         return false;
       }
 
@@ -700,7 +700,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   }
 
   private _isElementInput(element: HTMLElement): boolean {
-    if (element && element.tagName && element.tagName.toLowerCase() === 'input') {
+    if (element && element.tagName && (element.tagName.toLowerCase() === 'input' || element.tagName.toLowerCase() === 'textarea')) {
       return true;
     }
     return false;

From 93aa20fb61842df7f61d78d36eef123208b862fe Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 22 Jun 2017 20:44:21 -0700
Subject: [PATCH 0157/1641] Route: Make implicit any explicit (#2045)

* Fix implicit any in Route

* Rush change
---
 .../route-no-implicit-any_2017-06-22-00-10.json       | 11 +++++++++++
 .../src/utilities/router/Route.tsx                    |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/route-no-implicit-any_2017-06-22-00-10.json

diff --git a/common/changes/office-ui-fabric-react/route-no-implicit-any_2017-06-22-00-10.json b/common/changes/office-ui-fabric-react/route-no-implicit-any_2017-06-22-00-10.json
new file mode 100644
index 0000000000000..3693c3f75c3f2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/route-no-implicit-any_2017-06-22-00-10.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Route: Make implicit any explicit",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/router/Route.tsx b/packages/office-ui-fabric-react/src/utilities/router/Route.tsx
index 40869b7511511..bd234631b31d4 100644
--- a/packages/office-ui-fabric-react/src/utilities/router/Route.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/router/Route.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 export interface IRouteProps {
   path?: string;
   component?: React.Component<any, any>;
-  getComponent?: (cb) => void;
+  getComponent?: (cb: any) => void;
 }
 
 export class Route extends React.Component<any, any> {

From d549c8cbec3e5b82fbfcdf1d618be5dd770943d7 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 22 Jun 2017 21:00:00 -0700
Subject: [PATCH 0158/1641] Fixing build to not build production in ci.

---
 .travis.yml  | 2 +-
 package.json | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/.travis.yml b/.travis.yml
index 5907ae300a6e1..818c787046457 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -4,4 +4,4 @@ node_js:
 before_script:
   - npm install -g gulp
 script:
-  - npm run build
\ No newline at end of file
+  - npm run buildfast
\ No newline at end of file
diff --git a/package.json b/package.json
index 899dcc1bdc1c5..a8577c5ffc7a9 100644
--- a/package.json
+++ b/package.json
@@ -17,7 +17,7 @@
     "test": "npm run _rushBuild",
     "start": "cd packages && cd office-ui-fabric-react && npm start",
     "build": "npm run _rushRebuild",
-    "buildfast": "node scripts/selective-build.js",
+    "buildfast": "node rung _rushRebuildFast",
     "change": "node node_modules/@microsoft/rush/bin/rush change",
     "generate": "node node_modules/@microsoft/rush/bin/rush generate"
   },

From cf27c419d98df14d8974764d2e5798fcb6233ec1 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 22 Jun 2017 21:00:43 -0700
Subject: [PATCH 0159/1641] DetailsRow: Fixing some issues with the previous
 publish. (#2055)

* Fixing regressions spotted.

* Adding change file.
---
 .../fixes_2017-06-23-03-41.json               | 11 ++++++++
 .../src/components/DetailsList/DetailsRow.tsx | 28 +++++++++----------
 .../src/components/Image/Image.tsx            |  2 +-
 3 files changed, 25 insertions(+), 16 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fixes_2017-06-23-03-41.json

diff --git a/common/changes/office-ui-fabric-react/fixes_2017-06-23-03-41.json b/common/changes/office-ui-fabric-react/fixes_2017-06-23-03-41.json
new file mode 100644
index 0000000000000..3b5fc50cb1b43
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fixes_2017-06-23-03-41.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: Fixing regression in DetailsRow, and adding check in Image which was causing nullrefs.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index 4d7aab3c5a7ca..7ff28f2e25682 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -4,6 +4,7 @@ import {
   BaseComponent,
   IDisposable,
   assign,
+  autobind,
   css,
   shallowCompare,
   getNativeProps,
@@ -67,10 +68,10 @@ const DEFAULT_DROPPING_CSS_CLASS = 'is-dropping';
 export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState> {
   public refs: {
     [key: string]: React.ReactInstance,
-    root: HTMLElement,
     cellMeasurer: HTMLElement
   };
 
+  private _root: HTMLElement;
   private _hasSetFocus: boolean;
   private _droppingClassNames: string;
   private _hasMounted: boolean;
@@ -98,7 +99,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
     let { dragDropHelper } = this.props;
 
     if (dragDropHelper) {
-      this._dragDropSubscription = dragDropHelper.subscribe(this.refs.root, this._events, this._getRowDragDropOptions());
+      this._dragDropSubscription = dragDropHelper.subscribe(this._root, this._events, this._getRowDragDropOptions());
     }
 
     this._events.on(this.props.selection, SELECTION_CHANGE, this._onSelectionChanged);
@@ -124,7 +125,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
       }
 
       if (this.props.dragDropHelper) {
-        this._dragDropSubscription = this.props.dragDropHelper.subscribe(this.refs.root, this._events, this._getRowDragDropOptions());
+        this._dragDropSubscription = this.props.dragDropHelper.subscribe(this._root, this._events, this._getRowDragDropOptions());
       }
     }
 
@@ -285,11 +286,11 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
 
   public focus(): boolean {
     const {
-      root
-    } = this.refs;
+      _root
+    } = this;
 
-    if (root) {
-      root.focus();
+    if (_root) {
+      _root.focus();
       return true;
     }
 
@@ -325,16 +326,13 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
     selection.toggleIndexSelected(this.props.itemIndex);
   }
 
-  private _onRootRef(root: FocusZone) {
-    const {
-      refs
-    } = this;
-
-    if (root) {
+  @autobind
+  private _onRootRef(focusZone: FocusZone) {
+    if (focusZone) {
       // Need to resolve the actual DOM node, not the component. The element itself will be used for drag/drop and focusing.
-      refs.root = ReactDOM.findDOMNode(root) as HTMLElement;
+      this._root = ReactDOM.findDOMNode(focusZone) as HTMLElement;
     } else {
-      refs.root = undefined;
+      this._root = undefined;
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.tsx
index 5d22995b2963a..8071bec25e8b9 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.tsx
@@ -147,7 +147,7 @@ export class Image extends BaseComponent<IImageProps, IImageState> {
       // .complete, because .complete will also be set to true if the image breaks. However,
       // for some browsers, SVG images do not have a naturalWidth or naturalHeight, so fall back
       // to checking .complete for these images.
-      let isLoaded: boolean = src && (this._imageElement.naturalWidth > 0 && this._imageElement.naturalHeight > 0) ||
+      let isLoaded: boolean = src && this._imageElement && (this._imageElement.naturalWidth > 0 && this._imageElement.naturalHeight > 0) ||
         (this._imageElement.complete && Image._svgRegex.test(src));
 
       if (isLoaded) {

From 7d50f24ef0a2926f83f8e03ffba0889ad3deac1c Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 23 Jun 2017 04:12:23 +0000
Subject: [PATCH 0160/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...x-focuszone-textarea_2017-06-22-22-19.json | 11 -------
 .../fixes_2017-06-23-03-41.json               | 11 -------
 ...oute-no-implicit-any_2017-06-22-00-10.json | 11 -------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 29 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 11 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/CHANGELOG.json               |  6 ++++
 packages/styling/CHANGELOG.md                 |  7 ++++-
 packages/styling/package.json                 |  2 +-
 15 files changed, 60 insertions(+), 44 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/fix-focuszone-textarea_2017-06-22-22-19.json
 delete mode 100644 common/changes/office-ui-fabric-react/fixes_2017-06-23-03-41.json
 delete mode 100644 common/changes/office-ui-fabric-react/route-no-implicit-any_2017-06-22-00-10.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 730cc68fea988..3d548c81be704 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.10.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.10.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index f2b812e05a06c..83940eb751dc1 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.9.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.10.1 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 0e6c097f8ede9..af8c09a99713d 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.9.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.10.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index e9cb20fbc2445..9d5c97dcb44b0 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.9.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.10.1 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/office-ui-fabric-react/fix-focuszone-textarea_2017-06-22-22-19.json b/common/changes/office-ui-fabric-react/fix-focuszone-textarea_2017-06-22-22-19.json
deleted file mode 100644
index 6634c7aff12c5..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-focuszone-textarea_2017-06-22-22-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix FocusZone stop eating spacebar presses in textarea fields",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "frolov.anton@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fixes_2017-06-23-03-41.json b/common/changes/office-ui-fabric-react/fixes_2017-06-23-03-41.json
deleted file mode 100644
index 3b5fc50cb1b43..0000000000000
--- a/common/changes/office-ui-fabric-react/fixes_2017-06-23-03-41.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: Fixing regression in DetailsRow, and adding check in Image which was causing nullrefs.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/route-no-implicit-any_2017-06-22-00-10.json b/common/changes/office-ui-fabric-react/route-no-implicit-any_2017-06-22-00-10.json
deleted file mode 100644
index 3693c3f75c3f2..0000000000000
--- a/common/changes/office-ui-fabric-react/route-no-implicit-any_2017-06-22-00-10.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Route: Make implicit any explicit",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index a61b5119095b4..09b6d15937a0e 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -47,7 +47,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.11.3 <1.0.0",
+    "@uifabric/styling": ">=0.11.4 <1.0.0",
     "@uifabric/utilities": ">=4.4.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 1fa35667d094b..78aa5ebab6dae 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.10.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.10.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 36da5a8e7ca5d..a48bb1c492655 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,35 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.10.1",
+      "tag": "office-ui-fabric-react_v4.10.1",
+      "date": "Fri, 23 Jun 2017 04:12:23 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Anton Frolov <frolov.anton@gmail.com>",
+            "commit": "60d27e12f5d7ce5245256ee6e46eab416acec470",
+            "comment": "Fix FocusZone stop eating spacebar presses in textarea fields"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "cf27c419d98df14d8974764d2e5798fcb6233ec1",
+            "comment": "DetailsList: Fixing regression in DetailsRow, and adding check in Image which was causing nullrefs."
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "93aa20fb61842df7f61d78d36eef123208b862fe",
+            "comment": "Route: Make implicit any explicit"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.11.3 <1.0.0` to `>=0.11.4 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.10.0",
       "tag": "office-ui-fabric-react_v4.10.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 5bac3c95cf58b..2577badc38c38 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,15 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 22 Jun 2017 21:45:08 GMT and should not be manually modified.
+This log was last generated on Fri, 23 Jun 2017 04:12:23 GMT and should not be manually modified.
+
+## 4.10.1
+Fri, 23 Jun 2017 04:12:23 GMT
+
+### Patches
+
+- Fix FocusZone stop eating spacebar presses in textarea fields
+- DetailsList: Fixing regression in DetailsRow, and adding check in Image which was causing nullrefs.
+- Route: Make implicit any explicit
 
 ## 4.10.0
 Thu, 22 Jun 2017 21:45:08 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 80e374869d62d..1a91861434a0d 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.10.0",
+  "version": "4.10.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.4.0 <5.0.0",
-    "@uifabric/styling": ">=0.11.3 <1.0.0",
+    "@uifabric/styling": ">=0.11.4 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 1e5644b57dff2..92981c6872c35 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.11.4",
+      "tag": "@uifabric/styling_v0.11.4",
+      "date": "Fri, 23 Jun 2017 04:12:23 GMT",
+      "comments": {}
+    },
     {
       "version": "0.11.3",
       "tag": "@uifabric/styling_v0.11.3",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index b7f8449df2d9e..6d8e1ec50c9a2 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 22 Jun 2017 21:45:08 GMT and should not be manually modified.
+This log was last generated on Fri, 23 Jun 2017 04:12:23 GMT and should not be manually modified.
+
+## 0.11.4
+Fri, 23 Jun 2017 04:12:23 GMT
+
+*Changes not tracked*
 
 ## 0.11.3
 Thu, 22 Jun 2017 21:45:08 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index b87e391448092..9828994f1b30a 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.11.3",
+  "version": "0.11.4",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 1af8a2e93cfd958528ada2fb310877e029b08c52 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 23 Jun 2017 11:04:57 -0700
Subject: [PATCH 0161/1641] Fixing build.

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index a8577c5ffc7a9..b59b98924a273 100644
--- a/package.json
+++ b/package.json
@@ -17,7 +17,7 @@
     "test": "npm run _rushBuild",
     "start": "cd packages && cd office-ui-fabric-react && npm start",
     "build": "npm run _rushRebuild",
-    "buildfast": "node rung _rushRebuildFast",
+    "buildfast": "node run _rushRebuildFast",
     "change": "node node_modules/@microsoft/rush/bin/rush change",
     "generate": "node node_modules/@microsoft/rush/bin/rush generate"
   },

From 13d5925135cc4126fdcfab7d596a6294a482c589 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 23 Jun 2017 11:34:40 -0700
Subject: [PATCH 0162/1641] try #2.

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index b59b98924a273..12d6dd60ee579 100644
--- a/package.json
+++ b/package.json
@@ -17,7 +17,7 @@
     "test": "npm run _rushBuild",
     "start": "cd packages && cd office-ui-fabric-react && npm start",
     "build": "npm run _rushRebuild",
-    "buildfast": "node run _rushRebuildFast",
+    "buildfast": "npm run _rushRebuildFast",
     "change": "node node_modules/@microsoft/rush/bin/rush change",
     "generate": "node node_modules/@microsoft/rush/bin/rush generate"
   },

From 33ee0eb362bf3f0f33867c7cb89d2cb4c8e8dcf8 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 23 Jun 2017 12:13:22 -0700
Subject: [PATCH 0163/1641] Reducing build times.

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 12d6dd60ee579..54f8b3b87e056 100644
--- a/package.json
+++ b/package.json
@@ -17,7 +17,7 @@
     "test": "npm run _rushBuild",
     "start": "cd packages && cd office-ui-fabric-react && npm start",
     "build": "npm run _rushRebuild",
-    "buildfast": "npm run _rushRebuildFast",
+    "buildfast": "npm run _rushBuild",
     "change": "node node_modules/@microsoft/rush/bin/rush change",
     "generate": "node node_modules/@microsoft/rush/bin/rush generate"
   },

From f8d64a77b12c8bd0b3434a9187fa4b9906995eca Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 23 Jun 2017 12:48:38 -0700
Subject: [PATCH 0164/1641] Icon: adding data-icon-name attribute. (#2060)

* Adding a data-icon-name attribute to make the icons more identifiable in debugging and testing.

* no message
---
 .../icon-attr_2017-06-23-17-57.json                   | 11 +++++++++++
 .../src/components/Icon/Icon.tsx                      |  3 ++-
 2 files changed, 13 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/icon-attr_2017-06-23-17-57.json

diff --git a/common/changes/office-ui-fabric-react/icon-attr_2017-06-23-17-57.json b/common/changes/office-ui-fabric-react/icon-attr_2017-06-23-17-57.json
new file mode 100644
index 0000000000000..fd0eda3e21434
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/icon-attr_2017-06-23-17-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Icon: Adding `data-icon-name` attribute for debugging identification purposes.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
index c748c92005d12..15181a6dc5e10 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
@@ -48,7 +48,8 @@ export function Icon(props: IIconProps): JSX.Element {
         aria-label={ ariaLabel }
         { ...(ariaLabel ? {} : {
           role: 'presentation',
-          'aria-hidden': true
+          'aria-hidden': true,
+          'data-icon-name': iconName,
         }) }
         { ...getNativeProps(props, htmlElementProperties) }
         className={

From 48995f078bff4de92b727e94624948d8b3b5e7cf Mon Sep 17 00:00:00 2001
From: Christopher Schleiden <cschleiden@live.de>
Date: Fri, 23 Jun 2017 12:49:30 -0700
Subject: [PATCH 0165/1641] ResizeGroup and OverflowSet: Add to global export
 (#2059)

---
 packages/office-ui-fabric-react/src/index.ts | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/src/index.ts b/packages/office-ui-fabric-react/src/index.ts
index 7bc84c48df80f..16af66b8fe2fd 100644
--- a/packages/office-ui-fabric-react/src/index.ts
+++ b/packages/office-ui-fabric-react/src/index.ts
@@ -32,6 +32,7 @@ export * from './List';
 export * from './MessageBar';
 export * from './MarqueeSelection';
 export * from './Nav';
+export * from './OverflowSet';
 export * from './Overlay';
 export * from './Panel';
 export * from './Pickers';
@@ -39,6 +40,7 @@ export * from './Persona';
 export * from './Pivot';
 export * from './ProgressIndicator';
 export * from './Rating';
+export * from './ResizeGroup';
 export * from './SearchBox';
 export * from './Slider';
 export * from './SpinButton';
@@ -48,4 +50,4 @@ export * from './TeachingBubble';
 export * from './TextField';
 export * from './Toggle';
 export * from './Tooltip';
-export * from './Utilities';
\ No newline at end of file
+export * from './Utilities';

From 2fe7127912fb763444dfcf418e3f53791adbddbe Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 23 Jun 2017 20:02:00 +0000
Subject: [PATCH 0166/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 .../icon-attr_2017-06-23-17-57.json           | 11 -----------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++++-
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/CHANGELOG.json               |  6 ++++++
 packages/styling/CHANGELOG.md                 |  7 ++++++-
 packages/styling/package.json                 |  2 +-
 10 files changed, 45 insertions(+), 19 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/icon-attr_2017-06-23-17-57.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 3d548c81be704..00e9fd6f9b330 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.10.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.10.2 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/icon-attr_2017-06-23-17-57.json b/common/changes/office-ui-fabric-react/icon-attr_2017-06-23-17-57.json
deleted file mode 100644
index fd0eda3e21434..0000000000000
--- a/common/changes/office-ui-fabric-react/icon-attr_2017-06-23-17-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Icon: Adding `data-icon-name` attribute for debugging identification purposes.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 09b6d15937a0e..7cacbf6d62051 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -47,7 +47,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.11.4 <1.0.0",
+    "@uifabric/styling": ">=0.11.5 <1.0.0",
     "@uifabric/utilities": ">=4.4.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 78aa5ebab6dae..63a98f999dd1c 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.10.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.10.2 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index a48bb1c492655..80e576d406e44 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.10.2",
+      "tag": "office-ui-fabric-react_v4.10.2",
+      "date": "Fri, 23 Jun 2017 20:02:00 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "f8d64a77b12c8bd0b3434a9187fa4b9906995eca",
+            "comment": "Icon: Adding `data-icon-name` attribute for debugging identification purposes."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.11.4 <1.0.0` to `>=0.11.5 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.10.1",
       "tag": "office-ui-fabric-react_v4.10.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 2577badc38c38..ac21c897e8041 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 23 Jun 2017 04:12:23 GMT and should not be manually modified.
+This log was last generated on Fri, 23 Jun 2017 20:02:00 GMT and should not be manually modified.
+
+## 4.10.2
+Fri, 23 Jun 2017 20:02:00 GMT
+
+### Patches
+
+- Icon: Adding `data-icon-name` attribute for debugging identification purposes.
 
 ## 4.10.1
 Fri, 23 Jun 2017 04:12:23 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 1a91861434a0d..2853a2087b8d0 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.10.1",
+  "version": "4.10.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.4.0 <5.0.0",
-    "@uifabric/styling": ">=0.11.4 <1.0.0",
+    "@uifabric/styling": ">=0.11.5 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 92981c6872c35..fee1c7a4c8af9 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.11.5",
+      "tag": "@uifabric/styling_v0.11.5",
+      "date": "Fri, 23 Jun 2017 20:02:00 GMT",
+      "comments": {}
+    },
     {
       "version": "0.11.4",
       "tag": "@uifabric/styling_v0.11.4",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 6d8e1ec50c9a2..833bc7e1e61b2 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 23 Jun 2017 04:12:23 GMT and should not be manually modified.
+This log was last generated on Fri, 23 Jun 2017 20:02:00 GMT and should not be manually modified.
+
+## 0.11.5
+Fri, 23 Jun 2017 20:02:00 GMT
+
+*Changes not tracked*
 
 ## 0.11.4
 Fri, 23 Jun 2017 04:12:23 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 9828994f1b30a..cc144dbf6575a 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.11.4",
+  "version": "0.11.5",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 8e7c0dbb6bee06a7e289b6df7da934df425b9871 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Mon, 26 Jun 2017 12:05:19 -0700
Subject: [PATCH 0167/1641] Enable forceConsistentCasingInFileNames tsconfig
 option (#2062)

* Enable 'forceConsistentCasingInFileNames tsconfig option

* Also example-component

* Rush generate
---
 apps/component-demo/tsconfig.json                     |  1 +
 apps/fabric-website/tsconfig.json                     |  1 +
 apps/test-bundle-button/tsconfig.json                 |  1 +
 apps/todo-app/tsconfig.json                           |  1 +
 .../strict-casing_2017-06-23-22-51.json               | 11 +++++++++++
 .../strict-casing_2017-06-23-22-51.json               | 11 +++++++++++
 .../styling/strict-casing_2017-06-23-22-51.json       | 11 +++++++++++
 .../utilities/strict-casing_2017-06-23-22-51.json     | 11 +++++++++++
 .../strict-casing_2017-06-23-22-51.json               | 11 +++++++++++
 packages/example-app-base/tsconfig.json               |  1 +
 packages/example-component/tsconfig.json              |  1 +
 packages/office-ui-fabric-react/tsconfig.json         |  1 +
 packages/styling/tsconfig.json                        |  1 +
 packages/utilities/tsconfig.json                      |  1 +
 14 files changed, 64 insertions(+)
 create mode 100644 common/changes/@uifabric/example-app-base/strict-casing_2017-06-23-22-51.json
 create mode 100644 common/changes/@uifabric/fabric-website/strict-casing_2017-06-23-22-51.json
 create mode 100644 common/changes/@uifabric/styling/strict-casing_2017-06-23-22-51.json
 create mode 100644 common/changes/@uifabric/utilities/strict-casing_2017-06-23-22-51.json
 create mode 100644 common/changes/office-ui-fabric-react/strict-casing_2017-06-23-22-51.json

diff --git a/apps/component-demo/tsconfig.json b/apps/component-demo/tsconfig.json
index 1e3d6bfc4b7c1..c6eb73686d0ef 100644
--- a/apps/component-demo/tsconfig.json
+++ b/apps/component-demo/tsconfig.json
@@ -8,6 +8,7 @@
     "experimentalDecorators": true,
     "noEmitOnError": true,
     "importHelpers": true,
+    "forceConsistentCasingInFileNames": true,
     "moduleResolution": "node",
     "types": [
       "chai",
diff --git a/apps/fabric-website/tsconfig.json b/apps/fabric-website/tsconfig.json
index 08c937fedc784..da7a35839a57b 100644
--- a/apps/fabric-website/tsconfig.json
+++ b/apps/fabric-website/tsconfig.json
@@ -8,6 +8,7 @@
     "sourceMap": true,
     "experimentalDecorators": true,
     "importHelpers": true,
+    "forceConsistentCasingInFileNames": true,
     "moduleResolution": "node",
     "types": [
       "chai",
diff --git a/apps/test-bundle-button/tsconfig.json b/apps/test-bundle-button/tsconfig.json
index 47318b8078a1a..ae12d160c00f1 100644
--- a/apps/test-bundle-button/tsconfig.json
+++ b/apps/test-bundle-button/tsconfig.json
@@ -8,6 +8,7 @@
     "sourceMap": true,
     "experimentalDecorators": true,
     "importHelpers": true,
+    "forceConsistentCasingInFileNames": true,
     "moduleResolution": "node",
     "types": [
       "webpack-env"
diff --git a/apps/todo-app/tsconfig.json b/apps/todo-app/tsconfig.json
index fb81561129df0..5522ea6798234 100644
--- a/apps/todo-app/tsconfig.json
+++ b/apps/todo-app/tsconfig.json
@@ -6,6 +6,7 @@
     "declaration": true,
     "sourceMap": true,
     "experimentalDecorators": true,
+    "forceConsistentCasingInFileNames": true,
     "moduleResolution": "node",
     "types": [
       "chai",
diff --git a/common/changes/@uifabric/example-app-base/strict-casing_2017-06-23-22-51.json b/common/changes/@uifabric/example-app-base/strict-casing_2017-06-23-22-51.json
new file mode 100644
index 0000000000000..3bf746278d91f
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/strict-casing_2017-06-23-22-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Enable forceConsistentCasingInFileNames tsconfig option",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/strict-casing_2017-06-23-22-51.json b/common/changes/@uifabric/fabric-website/strict-casing_2017-06-23-22-51.json
new file mode 100644
index 0000000000000..2c588fdceb5e1
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/strict-casing_2017-06-23-22-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Enable forceConsistentCasingInFileNames tsconfig option",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/strict-casing_2017-06-23-22-51.json b/common/changes/@uifabric/styling/strict-casing_2017-06-23-22-51.json
new file mode 100644
index 0000000000000..ffd14d7a4cb20
--- /dev/null
+++ b/common/changes/@uifabric/styling/strict-casing_2017-06-23-22-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Enable forceConsistentCasingInFileNames tsconfig option",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/strict-casing_2017-06-23-22-51.json b/common/changes/@uifabric/utilities/strict-casing_2017-06-23-22-51.json
new file mode 100644
index 0000000000000..4e6fa7b525ddc
--- /dev/null
+++ b/common/changes/@uifabric/utilities/strict-casing_2017-06-23-22-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Enable forceConsistentCasingInFileNames tsconfig option",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/strict-casing_2017-06-23-22-51.json b/common/changes/office-ui-fabric-react/strict-casing_2017-06-23-22-51.json
new file mode 100644
index 0000000000000..4ea8e71fc67cb
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/strict-casing_2017-06-23-22-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Enable forceConsistentCasingInFileNames tsconfig option",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/tsconfig.json b/packages/example-app-base/tsconfig.json
index fce99fa3f7ac4..069b558a332e6 100644
--- a/packages/example-app-base/tsconfig.json
+++ b/packages/example-app-base/tsconfig.json
@@ -7,6 +7,7 @@
     "sourceMap": true,
     "experimentalDecorators": true,
     "importHelpers": true,
+    "forceConsistentCasingInFileNames": true,
     "moduleResolution": "node",
     "lib": [
       "es2017",
diff --git a/packages/example-component/tsconfig.json b/packages/example-component/tsconfig.json
index 66201a8633b19..b20ae504e0f73 100644
--- a/packages/example-component/tsconfig.json
+++ b/packages/example-component/tsconfig.json
@@ -7,6 +7,7 @@
     "strictNullChecks": true,
     "experimentalDecorators": true,
     "importHelpers": true,
+    "forceConsistentCasingInFileNames": true,
     "moduleResolution": "node",
     "sourceMap": true,
     "jsx": "react",
diff --git a/packages/office-ui-fabric-react/tsconfig.json b/packages/office-ui-fabric-react/tsconfig.json
index 45a6fd52e3110..4ea2d4723f78e 100644
--- a/packages/office-ui-fabric-react/tsconfig.json
+++ b/packages/office-ui-fabric-react/tsconfig.json
@@ -8,6 +8,7 @@
     "sourceMap": true,
     "experimentalDecorators": true,
     "importHelpers": true,
+    "forceConsistentCasingInFileNames": true,
     "moduleResolution": "node",
     "lib": [
       "es2017",
diff --git a/packages/styling/tsconfig.json b/packages/styling/tsconfig.json
index b5f031e44f513..1ef6a2633361f 100644
--- a/packages/styling/tsconfig.json
+++ b/packages/styling/tsconfig.json
@@ -10,6 +10,7 @@
     "importHelpers": true,
     "moduleResolution": "node",
     "noImplicitAny": false,
+    "forceConsistentCasingInFileNames": true,
     "lib": [
       "es2017",
       "dom"
diff --git a/packages/utilities/tsconfig.json b/packages/utilities/tsconfig.json
index 219a36c4719d8..5080d40bebda3 100644
--- a/packages/utilities/tsconfig.json
+++ b/packages/utilities/tsconfig.json
@@ -13,6 +13,7 @@
     "importHelpers": true,
     "noImplicitAny": true,
     "strictNullChecks": true,
+    "forceConsistentCasingInFileNames": true,
     "moduleResolution": "node",
     "types": [
       "chai",

From 002cd689e299ae5fb2ee99e16f12c85e74043e95 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Mon, 26 Jun 2017 12:27:00 -0700
Subject: [PATCH 0168/1641] OveflowSet: Type of setState is incompatible with
 latest @typings/react (#2061)

* Fix OverflowSet's type definition.

* Rush change
---
 .../oveflowset-type-fix_2017-06-23-21-29.json         | 11 +++++++++++
 .../src/components/OverflowSet/OverflowSet.tsx        |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/oveflowset-type-fix_2017-06-23-21-29.json

diff --git a/common/changes/office-ui-fabric-react/oveflowset-type-fix_2017-06-23-21-29.json b/common/changes/office-ui-fabric-react/oveflowset-type-fix_2017-06-23-21-29.json
new file mode 100644
index 0000000000000..b0c8e6c8aacc4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/oveflowset-type-fix_2017-06-23-21-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "OverflowSet: Fix type definition to be compatible with latest @types/react",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
index 0a017b32e9391..3c2c38c530b86 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
@@ -10,7 +10,7 @@ import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import * as stylesImport from './OverflowSet.scss';
 const styles: any = stylesImport;
 
-export class OverflowSet extends BaseComponent<IOverflowSetProps, null> {
+export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> {
 
   public render() {
     let {

From ab0403c92b9c1e6c2c138b8fe5e80684ff853857 Mon Sep 17 00:00:00 2001
From: rachelcl9 <chuli@microsoft.com>
Date: Mon, 26 Jun 2017 14:32:09 -0700
Subject: [PATCH 0169/1641] Commandbar: fix synchronous reflow caused by
 getBoundingClientRect (#2033)

* fix

* npm run change

* address comments

* uncomment test page

* use requestAnimationFrame instead of setTimeout
---
 .../chuli-cmdReflow_2017-06-21-00-15.json     | 11 +++++
 .../chuli-cmdReflow_2017-06-21-00-15.json     | 11 +++++
 .../chuli-cmdReflow_2017-06-21-00-15.json     | 11 +++++
 .../chuli-cmdReflow_2017-06-21-00-15.json     | 11 +++++
 .../chuli-cmdReflow_2017-06-21-00-15.json     | 11 +++++
 .../src/components/CommandBar/CommandBar.scss | 11 +++--
 .../src/components/CommandBar/CommandBar.tsx  | 23 +++++++----
 .../components/CommandBar/CommandBarPage.tsx  |  4 +-
 .../examples/CommandBar.Basic.Example.tsx     |  8 +++-
 .../components/CommandBar/examples/data.ts    | 41 +------------------
 10 files changed, 88 insertions(+), 54 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/chuli-cmdReflow_2017-06-21-00-15.json
 create mode 100644 common/changes/@uifabric/fabric-website/chuli-cmdReflow_2017-06-21-00-15.json
 create mode 100644 common/changes/@uifabric/styling/chuli-cmdReflow_2017-06-21-00-15.json
 create mode 100644 common/changes/@uifabric/utilities/chuli-cmdReflow_2017-06-21-00-15.json
 create mode 100644 common/changes/office-ui-fabric-react/chuli-cmdReflow_2017-06-21-00-15.json

diff --git a/common/changes/@uifabric/example-app-base/chuli-cmdReflow_2017-06-21-00-15.json b/common/changes/@uifabric/example-app-base/chuli-cmdReflow_2017-06-21-00-15.json
new file mode 100644
index 0000000000000..3b8ee8b03d813
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/chuli-cmdReflow_2017-06-21-00-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "chuli@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/chuli-cmdReflow_2017-06-21-00-15.json b/common/changes/@uifabric/fabric-website/chuli-cmdReflow_2017-06-21-00-15.json
new file mode 100644
index 0000000000000..b0bf92e85c458
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/chuli-cmdReflow_2017-06-21-00-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "chuli@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/chuli-cmdReflow_2017-06-21-00-15.json b/common/changes/@uifabric/styling/chuli-cmdReflow_2017-06-21-00-15.json
new file mode 100644
index 0000000000000..0068ffa5952a0
--- /dev/null
+++ b/common/changes/@uifabric/styling/chuli-cmdReflow_2017-06-21-00-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "chuli@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/chuli-cmdReflow_2017-06-21-00-15.json b/common/changes/@uifabric/utilities/chuli-cmdReflow_2017-06-21-00-15.json
new file mode 100644
index 0000000000000..a5730b6941584
--- /dev/null
+++ b/common/changes/@uifabric/utilities/chuli-cmdReflow_2017-06-21-00-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "chuli@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/chuli-cmdReflow_2017-06-21-00-15.json b/common/changes/office-ui-fabric-react/chuli-cmdReflow_2017-06-21-00-15.json
new file mode 100644
index 0000000000000..ff13c8bb59c68
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/chuli-cmdReflow_2017-06-21-00-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Commandbar: fix synchronous reflow ",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chuli@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss
index ff4e5b8c8d04f..e3cfabf5a42cc 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss
@@ -48,10 +48,14 @@ $SearchBox-sidePadding: 8px; // padding in input on left and right sides without
   user-select: none;
 }
 
+.container {
+  display: flex;
+}
+
 .primaryCommands {
-  position: absolute;
   overflow: hidden;
-  display: inline;
+  display: flex;
+  flex: 1 1 auto;
   vertical-align: top;
   line-height: $CommandBar-height;
   max-width: 100%;
@@ -59,7 +63,8 @@ $SearchBox-sidePadding: 8px; // padding in input on left and right sides without
 }
 
 .sideCommands {
-  position: absolute;
+  display: flex;
+  flex: 0 0 auto;
   @include ms-right(0px);
   @include text-align(right);
   @include padding-right(20px);
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index a44ef2853a265..99f03f4337028 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -64,9 +64,8 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
   }
 
   public componentDidMount() {
-    this._updateItemMeasurements();
-    this._updateRenderedItems();
-
+    // Asynchronously update command bar layout to eliminate forced synchronous reflow
+    this._asyncMeasure();
     this._events.on(window, 'resize', this._updateRenderedItems);
   }
 
@@ -77,8 +76,8 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
 
   public componentDidUpdate(prevProps: ICommandBarProps, prevStates: ICommandBarState) {
     if (!this._commandItemWidths) {
-      this._updateItemMeasurements();
-      this._updateRenderedItems();
+      // Asynchronously update command bar layout to eliminate forced synchronous reflow
+      this._asyncMeasure();
     }
   }
 
@@ -111,7 +110,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
     return (
       <div className={ css('ms-CommandBar', styles.root, className) } ref='commandBarRegion'>
         { searchBox }
-        <FocusZone ref='focusZone' direction={ FocusZoneDirection.horizontal } role='menubar' >
+        <FocusZone ref='focusZone' className={ styles.container } direction={ FocusZoneDirection.horizontal } role='menubar' >
           <div className={ css('ms-CommandBar-primaryCommands', styles.primaryCommands) } ref='commandSurface'>
             { renderedItems.map((item, index) => (
               this._renderItemInCommandBar(item, index, expandedMenuItemKey)
@@ -150,8 +149,9 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
             labelElementId={ expandedMenuId }
             onDismiss={ this._onContextMenuDismiss }
           />
-          ) : (null) }
-      </div>
+          ) : (null)
+        }
+      </div >
     );
   }
 
@@ -249,6 +249,13 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
     return <Icon { ...iconProps } className={ iconClassName } />;
   }
 
+  private _asyncMeasure() {
+    this._async.requestAnimationFrame(() => {
+      this._updateItemMeasurements();
+      this._updateRenderedItems();
+    });
+  }
+
   private _updateItemMeasurements() {
     // the generated width for overflow is 35 in chrome, 38 in IE, but the actual value is 41.5
     if (this.refs[OVERFLOW_KEY] || (this.props.overflowItems && this.props.overflowItems.length)) {
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx
index 05849079c1ad4..ccf27698d003b 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx
@@ -5,7 +5,7 @@ import {
   ComponentPage,
   PropertiesTableSet
 } from '@uifabric/example-app-base';
-import { items, farItems } from './examples/data';
+import { items, overflowItems, farItems } from './examples/data';
 import { CommandBarBasicExample } from './examples/CommandBar.Basic.Example';
 import { CommandBarNonFocusableItemsExample } from './examples/CommandBar.NonFocusable.Example';
 import { CommandBarCustomizationExample } from './examples/CommandBar.Customization.Example';
@@ -16,7 +16,7 @@ const CommandBarCustomizationExampleCode = require('!raw-loader!office-ui-fabric
 
 export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
-    let cmdBarParamsTextAndIcons: any = { items: items, farItems: farItems };
+    let cmdBarParamsTextAndIcons: any = { items, overflowItems, farItems };
 
     return (
       <ComponentPage
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
index 0e303ffd0a8c1..4506d99dbaf68 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
@@ -15,7 +15,7 @@ export class CommandBarBasicExample extends React.Component<any, any> {
   }
 
   public render() {
-    let { items, farItems } = this.props;
+    let { items, overflowItems, farItems } = this.props;
     let { isSearchBoxVisible: searchBoxVisible, areIconsVisible: iconsVisible, areNamesVisible: namesVisible } = this.state;
 
     let filteredItems = items.map(item => assign({}, item, {
@@ -23,6 +23,11 @@ export class CommandBarBasicExample extends React.Component<any, any> {
       icon: iconsVisible ? item.icon : ''
     }));
 
+    let filteredOverflowItems = overflowItems.map(item => assign({}, item, {
+      name: namesVisible ? item.name : '',
+      icon: iconsVisible ? item.icon : ''
+    }));
+
     let filteredFarItems = farItems.map(item => assign({}, item, {
       name: namesVisible ? item.name : '',
       icon: iconsVisible ? item.icon : ''
@@ -54,6 +59,7 @@ export class CommandBarBasicExample extends React.Component<any, any> {
           searchPlaceholderText='Search...'
           elipisisAriaLabel='More options'
           items={ filteredItems }
+          overflowItems={ filteredOverflowItems }
           farItems={ filteredFarItems }
         />
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/examples/data.ts b/packages/office-ui-fabric-react/src/components/CommandBar/examples/data.ts
index 125cc8d77f249..369732a5b4e55 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/examples/data.ts
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/examples/data.ts
@@ -40,24 +40,6 @@ export const items = [
     icon: 'Download',
     onClick: () => { return; }
   },
-  {
-    key: 'move',
-    name: 'Move to...',
-    icon: 'MoveToFolder',
-    onClick: () => { return; }
-  },
-  {
-    key: 'copy',
-    name: 'Copy to...',
-    icon: 'Copy',
-    onClick: () => { return; }
-  },
-  {
-    key: 'rename',
-    name: 'Rename...',
-    icon: 'Edit',
-    onClick: () => { return; }
-  },
   {
     key: 'disabled',
     name: 'Disabled...',
@@ -82,27 +64,6 @@ export const textOnlyItems = [
     key: 'download',
     name: 'Download',
     onClick: () => { return; }
-  },
-  {
-    key: 'move',
-    name: 'Move to...',
-    onClick: () => { return; }
-  },
-  {
-    key: 'copy',
-    name: 'Copy to...',
-    onClick: () => { return; }
-  },
-  {
-    key: 'rename',
-    name: 'Rename...',
-    onClick: () => { return; }
-  },
-  {
-    key: 'disabled',
-    name: 'Disabled...',
-    disabled: true,
-    onClick: () => { return; }
   }
 ];
 
@@ -167,8 +128,8 @@ export const overflowItems = [
     name: 'Rename...',
     icon: 'Edit'
   }
-
 ];
+
 export const farItems = [
   {
     key: 'sort',

From b00a2c9dfa0ac1c3f0f6dcb17cc72b783bede3cf Mon Sep 17 00:00:00 2001
From: John Lorenz <jcl47@duke.edu>
Date: Mon, 26 Jun 2017 16:50:58 -0700
Subject: [PATCH 0170/1641] Jolore/enhance calendar component (#2030)

* Enhancing calendar component to allow for turning off day picker (and leaving only month picker), highlighting today in the month picker

* adding change request file
---
 ...nceCalendarComponent_2017-06-20-20-20.json | 11 +++++++
 .../src/components/Calendar/Calendar.Props.ts | 12 +++++++
 .../src/components/Calendar/Calendar.scss     | 33 ++++++++++++++++++-
 .../src/components/Calendar/Calendar.tsx      | 18 ++++++----
 .../src/components/Calendar/CalendarMonth.tsx | 17 ++++++++--
 .../src/components/Calendar/CalendarPage.tsx  |  4 +++
 .../examples/Calendar.Inline.Example.tsx      |  6 +++-
 7 files changed, 91 insertions(+), 10 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jolore-EnhanceCalendarComponent_2017-06-20-20-20.json

diff --git a/common/changes/office-ui-fabric-react/jolore-EnhanceCalendarComponent_2017-06-20-20-20.json b/common/changes/office-ui-fabric-react/jolore-EnhanceCalendarComponent_2017-06-20-20-20.json
new file mode 100644
index 0000000000000..7c6f97a763eeb
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jolore-EnhanceCalendarComponent_2017-06-20-20-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Enhancing the calendar component to allow for turning off the day picker and highlighting the \"today\" month in the month picker. This will match the behavior of the Timestrip component in today's JSMVVM OWA Calendar.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jolore@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
index b8c5fa4f6b28c..8a1be7bb53a8e 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
@@ -34,6 +34,12 @@ export interface ICalendarProps extends React.Props<Calendar> {
    */
   isMonthPickerVisible?: boolean;
 
+  /**
+  * Whether the day picker is shown beside the month picker or hidden.
+  * @defaultvalue true
+  */
+  isDayPickerVisible?: boolean;
+
   /**
     * Value of today. If null, current time in client machine will be used.
     */
@@ -81,6 +87,12 @@ export interface ICalendarProps extends React.Props<Calendar> {
    * Localized strings to use in the Calendar
    */
   strings: ICalendarStrings;
+
+  /**
+  * Whether the month picker should highlight the current month
+  * @defaultvalue false
+  */
+  highlightCurrentMonth?: boolean;
 }
 
 export interface ICalendarStrings {
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
index 14f710630ef7d..da48e76eee211 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
@@ -386,7 +386,6 @@ $Calendar-dayPicker-margin: 10px;
     }
   }
 
-
   // Show the month picker, if enabled
   .pickerIsMonthPickerVisible {
     // Swap margin for padding so that the border extends the full height.
@@ -486,6 +485,34 @@ $Calendar-dayPicker-margin: 10px;
       }
     }
   }
+
+  // if only the month picker is visible, don't show day picker
+  .pickerOnlyMonthPickerVisible {
+    // Hide the day picking components.
+    .dayPicker,
+    .monthComponents {
+      display: none;
+    }
+
+    // Show the month picking components.
+    .monthPicker {
+      display: block;
+    }
+
+    .holder {
+      width: 296px;
+    }
+
+    .currentYear {
+      height: initial;
+      line-height: initial;
+    }
+
+    .yearComponents {
+      position: relative;
+      top: 0;
+    }
+  }
 }
 
 // On smaller screens the month button toggles to the picking months state.
@@ -530,3 +557,7 @@ $Calendar-dayPicker-margin: 10px;
 .navContainer {
   @include float('right')
 }
+
+.monthIsCurrentMonth {
+  background-color: $ms-color-themeLight;
+}
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index 824932fcc6bca..0aba298f0bae0 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -26,13 +26,15 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     onSelectDate: null,
     onDismiss: null,
     isMonthPickerVisible: true,
+    isDayPickerVisible: true,
     value: null,
     today: new Date(),
     firstDayOfWeek: DayOfWeek.Sunday,
     dateRangeType: DateRangeType.Day,
     autoNavigateOnSelection: false,
     showGoToToday: true,
-    strings: null
+    strings: null,
+    highlightCurrentMonth: false
   };
 
   public refs: {
@@ -81,7 +83,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
 
   public render() {
     let rootClass = 'ms-DatePicker';
-    let { firstDayOfWeek, dateRangeType, strings, isMonthPickerVisible, autoNavigateOnSelection, showGoToToday } = this.props;
+    let { firstDayOfWeek, dateRangeType, strings, isMonthPickerVisible, isDayPickerVisible, autoNavigateOnSelection, showGoToToday, highlightCurrentMonth } = this.props;
     let { selectedDate, navigatedDate } = this.state;
 
     return (
@@ -91,12 +93,13 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
           styles.picker,
           styles.pickerIsOpened,
           styles.pickerIsFocused,
-          isMonthPickerVisible && ('is-monthPickerVisible ' + styles.pickerIsMonthPickerVisible)
+          isMonthPickerVisible && isDayPickerVisible && ('is-monthPickerVisible ' + styles.pickerIsMonthPickerVisible),
+          isMonthPickerVisible && !isDayPickerVisible && ('is-onlymonthPickerVisible ' + styles.pickerOnlyMonthPickerVisible)
         ) } >
           <div className={ css('ms-DatePicker-holder ms-slideDownIn10', styles.holder) } onKeyDown={ this._onDatePickerPopupKeyDown }>
             <div className={ css('ms-DatePicker-frame', styles.frame) }>
               <div className={ css('ms-DatePicker-wrap', styles.wrap) }>
-                <CalendarDay
+                { isDayPickerVisible && <CalendarDay
                   selectedDate={ selectedDate }
                   navigatedDate={ navigatedDate }
                   today={ this.props.today }
@@ -108,11 +111,14 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   autoNavigateOnSelection={ autoNavigateOnSelection }
                   strings={ strings }
                   ref='dayPicker' />
+                }
 
                 { isMonthPickerVisible && <CalendarMonth
                   navigatedDate={ navigatedDate }
                   strings={ strings }
-                  onNavigateDate={ this._onNavigateDate } /> }
+                  onNavigateDate={ this._onNavigateDate }
+                  today={ this.props.today }
+                  highlightCurrentMonth={ highlightCurrentMonth } /> }
 
                 { showGoToToday &&
                   <span
@@ -206,7 +212,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
 
   @autobind
   private _handleEscKey(ev: React.KeyboardEvent<HTMLElement>) {
-    if (this.props.onDismiss() != null) {
+    if (this.props.onDismiss != null) {
       this.props.onDismiss();
     }
   }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
index b73d3368967ee..e49ee4e2bf67d 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
@@ -16,6 +16,8 @@ export interface ICalendarMonthProps {
   navigatedDate: Date;
   strings: ICalendarStrings;
   onNavigateDate: (date: Date, focusOnNavigatedDay: boolean) => void;
+  today?: Date;
+  highlightCurrentMonth: boolean;
 }
 
 export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
@@ -29,6 +31,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
       this._selectMonthCallbacks[index] = this._onSelectMonth.bind(this, index);
     });
 
+    this.isCurrentMonth = this.isCurrentMonth.bind(this);
     this._onSelectNextYear = this._onSelectNextYear.bind(this);
     this._onSelectPrevYear = this._onSelectPrevYear.bind(this);
     this._onSelectMonth = this._onSelectMonth.bind(this);
@@ -36,7 +39,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
 
   public render() {
 
-    let { navigatedDate, strings } = this.props;
+    let { navigatedDate, strings, today, highlightCurrentMonth } = this.props;
 
     return (
       <div className={ css('ms-DatePicker-monthPicker', styles.monthPicker) }>
@@ -72,7 +75,13 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
             { strings.shortMonths.map((month, index) =>
               <span
                 role='button'
-                className={ css('ms-DatePicker-monthOption', styles.monthOption) }
+                className={
+                  css('ms-DatePicker-monthOption',
+                    styles.monthOption,
+                    {
+                      ['ms-DatePicker-day--today ' + styles.monthIsCurrentMonth]: highlightCurrentMonth && this.isCurrentMonth(index, navigatedDate.getFullYear(), today)
+                    })
+                }
                 key={ index }
                 onClick={ this._selectMonthCallbacks[index] }
                 aria-label={ setMonth(navigatedDate, index).toLocaleString([], { month: 'long', year: 'numeric' }) }
@@ -87,6 +96,10 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
     );
   }
 
+  private isCurrentMonth(month: number, year: number, today: Date) {
+    return today.getFullYear() === year && today.getMonth() === month;
+  }
+
   private _onKeyDown(callback: () => void, ev: React.KeyboardEvent<HTMLElement>) {
     if (ev.which === KeyCodes.enter || ev.which === KeyCodes.space) {
       callback();
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
index 5ba0bc5a6b920..0a0ecdac7f1eb 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
@@ -36,6 +36,10 @@ export class CalendarPage extends React.Component<IComponentDemoPageProps, any>
               <CalendarInlineExample isMonthPickerVisible={ true } dateRangeType={ DateRangeType.Month } autoNavigateOnSelection={ true }
                 showGoToToday={ true } showNavigateButtons={ true } />
             </ExampleCard>
+            <ExampleCard title='Inline Calendar with month picker and no day picker' code={ CalendarInlineExampleCode }>
+              <CalendarInlineExample isMonthPickerVisible={ true } dateRangeType={ DateRangeType.Month } autoNavigateOnSelection={ false }
+                showGoToToday={ true } highlightCurrentMonth={ true } isDayPickerVisible={ false } />
+            </ExampleCard>
             <ExampleCard title='Calendar launched from a button' code={ CalendarButtonExampleCode }>
               <CalendarButtonExample />
             </ExampleCard>
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
index a4f6e5b9aa7b7..0a56acb432052 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
@@ -72,6 +72,8 @@ export interface ICalendarInlineExampleProps {
   autoNavigateOnSelection: boolean;
   showGoToToday: boolean;
   showNavigateButtons?: boolean;
+  highlightCurrentMonth?: boolean;
+  isDayPickerVisible?: boolean;
 }
 
 export class CalendarInlineExample extends React.Component<ICalendarInlineExampleProps, ICalendarInlineExampleState> {
@@ -91,7 +93,7 @@ export class CalendarInlineExample extends React.Component<ICalendarInlineExampl
 
   public render() {
     let divStyle: React.CSSProperties = {
-      height: '330px',
+      height: '340px',
       width: '400px'
     };
 
@@ -125,6 +127,8 @@ export class CalendarInlineExample extends React.Component<ICalendarInlineExampl
           value={ this.state.selectedDate }
           firstDayOfWeek={ DayOfWeek.Sunday }
           strings={ DayPickerStrings }
+          highlightCurrentMonth={ this.props.highlightCurrentMonth }
+          isDayPickerVisible={ this.props.isDayPickerVisible }
         >
         </Calendar>
         { this.props.showNavigateButtons &&

From f3203551b08875e9fc6bcf4ff937a1e1d7eda353 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 26 Jun 2017 17:59:36 -0700
Subject: [PATCH 0171/1641] Persona fix: cover is not being respected. (#2072)

* Adding a size to pixels map to ensure we pass in the desired image dimensions.

* Persona fix.

* Update Persona.tsx
---
 .../persona-fix_2017-06-26-23-05.json            | 11 +++++++++++
 .../src/components/Persona/Persona.tsx           | 16 ++++++++++++++--
 2 files changed, 25 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/persona-fix_2017-06-26-23-05.json

diff --git a/common/changes/office-ui-fabric-react/persona-fix_2017-06-26-23-05.json b/common/changes/office-ui-fabric-react/persona-fix_2017-06-26-23-05.json
new file mode 100644
index 0000000000000..57905773fb508
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/persona-fix_2017-06-26-23-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Persona: Fixing image sizing to cover correctly.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index 5d07d19af7aa7..5933004f3100f 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -10,7 +10,7 @@ import {
   IRenderFunction
 } from '../../Utilities';
 import { Icon } from '../../Icon';
-import { Image, ImageFit, ImageLoadState, ImageCoverStyle } from '../../Image';
+import { Image, ImageFit, ImageLoadState } from '../../Image';
 import {
   IPersonaProps,
   PersonaInitialsColor,
@@ -25,6 +25,17 @@ import {
 import * as stylesImport from './Persona.scss';
 const styles: any = stylesImport;
 
+const SIZE_TO_PIXELS = {
+  [PersonaSize.extraExtraSmall]: 24,
+  [PersonaSize.size28]: 28,
+  [PersonaSize.tiny]: 30,
+  [PersonaSize.extraSmall]: 32,
+  [PersonaSize.small]: 40,
+  [PersonaSize.regular]: 48,
+  [PersonaSize.large]: 72,
+  [PersonaSize.extraLarge]: 100
+};
+
 // The RGB color swatches
 const COLOR_SWATCHES_LOOKUP: PersonaInitialsColor[] = [
   PersonaInitialsColor.lightGreen,
@@ -159,8 +170,9 @@ export class Persona extends BaseComponent<IPersonaProps, IPersonaState> {
             <Image
               className={ css('ms-Persona-image', styles.image) }
               imageFit={ ImageFit.cover }
-              coverStyle={ ImageCoverStyle.portrait }
               src={ imageUrl }
+              width={ SIZE_TO_PIXELS[size] }
+              height={ SIZE_TO_PIXELS[size] }
               shouldFadeIn={ imageShouldFadeIn }
               shouldStartVisible={ imageShouldStartVisible }
               onLoadingStateChange={ this._onPhotoLoadingStateChange } />

From 87f3de51f7a5cf590abbc7079f69765aed87272e Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 26 Jun 2017 18:26:31 -0700
Subject: [PATCH 0172/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 25 ++++++++++
 apps/fabric-website/CHANGELOG.md              |  9 +++-
 apps/fabric-website/package.json              |  6 +--
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../chuli-cmdReflow_2017-06-21-00-15.json     | 11 -----
 .../strict-casing_2017-06-23-22-51.json       | 11 -----
 .../chuli-cmdReflow_2017-06-21-00-15.json     | 11 -----
 .../strict-casing_2017-06-23-22-51.json       | 11 -----
 .../chuli-cmdReflow_2017-06-21-00-15.json     | 11 -----
 .../strict-casing_2017-06-23-22-51.json       | 11 -----
 .../chuli-cmdReflow_2017-06-21-00-15.json     | 11 -----
 .../strict-casing_2017-06-23-22-51.json       | 11 -----
 .../chuli-cmdReflow_2017-06-21-00-15.json     | 11 -----
 ...nceCalendarComponent_2017-06-20-20-20.json | 11 -----
 .../oveflowset-type-fix_2017-06-23-21-29.json | 11 -----
 .../persona-fix_2017-06-26-23-05.json         | 11 -----
 .../strict-casing_2017-06-23-22-51.json       | 11 -----
 packages/example-app-base/CHANGELOG.json      | 22 +++++++++
 packages/example-app-base/CHANGELOG.md        |  9 +++-
 packages/example-app-base/package.json        |  6 +--
 packages/example-component/package.json       |  8 ++--
 .../office-ui-fabric-react/CHANGELOG.json     | 47 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 16 ++++++-
 packages/office-ui-fabric-react/package.json  |  8 ++--
 packages/styling/CHANGELOG.json               | 19 ++++++++
 packages/styling/CHANGELOG.md                 |  9 +++-
 packages/styling/package.json                 |  4 +-
 packages/utilities/CHANGELOG.json             | 14 ++++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  2 +-
 32 files changed, 194 insertions(+), 168 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/chuli-cmdReflow_2017-06-21-00-15.json
 delete mode 100644 common/changes/@uifabric/example-app-base/strict-casing_2017-06-23-22-51.json
 delete mode 100644 common/changes/@uifabric/fabric-website/chuli-cmdReflow_2017-06-21-00-15.json
 delete mode 100644 common/changes/@uifabric/fabric-website/strict-casing_2017-06-23-22-51.json
 delete mode 100644 common/changes/@uifabric/styling/chuli-cmdReflow_2017-06-21-00-15.json
 delete mode 100644 common/changes/@uifabric/styling/strict-casing_2017-06-23-22-51.json
 delete mode 100644 common/changes/@uifabric/utilities/chuli-cmdReflow_2017-06-21-00-15.json
 delete mode 100644 common/changes/@uifabric/utilities/strict-casing_2017-06-23-22-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/chuli-cmdReflow_2017-06-21-00-15.json
 delete mode 100644 common/changes/office-ui-fabric-react/jolore-EnhanceCalendarComponent_2017-06-20-20-20.json
 delete mode 100644 common/changes/office-ui-fabric-react/oveflowset-type-fix_2017-06-23-21-29.json
 delete mode 100644 common/changes/office-ui-fabric-react/persona-fix_2017-06-26-23-05.json
 delete mode 100644 common/changes/office-ui-fabric-react/strict-casing_2017-06-23-22-51.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 064ff783ac1d7..d51a674ebe1df 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,31 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.5.40",
+      "tag": "@uifabric/fabric-website_v4.5.40",
+      "date": "Tue, 27 Jun 2017 01:26:31 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "8e7c0dbb6bee06a7e289b6df7da934df425b9871",
+            "comment": "Enable forceConsistentCasingInFileNames tsconfig option"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `4.0.0` to `4.0.1`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.4.0 <5.0.0` to `>=4.4.1 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.10.2 <5.0.0` to `>=4.10.2 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.5.39",
       "tag": "@uifabric/fabric-website_v4.5.39",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index c54f999a23c9f..9f40766bdf6f7 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Wed, 21 Jun 2017 00:45:41 GMT and should not be manually modified.
+This log was last generated on Tue, 27 Jun 2017 01:26:31 GMT and should not be manually modified.
+
+## 4.5.40
+Tue, 27 Jun 2017 01:26:31 GMT
+
+### Patches
+
+- Enable forceConsistentCasingInFileNames tsconfig option
 
 ## 4.5.39
 Wed, 21 Jun 2017 00:45:41 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 00e9fd6f9b330..2de9bac701474 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.5.39",
+  "version": "4.5.40",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,8 +47,8 @@
     "webpack-bundle-analyzer": "^2.2.1"
   },
   "dependencies": {
-    "@uifabric/example-app-base": "4.0.0",
-    "@uifabric/utilities": ">=4.4.0 <5.0.0",
+    "@uifabric/example-app-base": "4.0.1",
+    "@uifabric/utilities": ">=4.4.1 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 83940eb751dc1..f8144830521e3 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.10.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.11.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index af8c09a99713d..789cc47a68e88 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.10.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.11.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 9d5c97dcb44b0..11fd60c17476d 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.10.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.11.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/@uifabric/example-app-base/chuli-cmdReflow_2017-06-21-00-15.json b/common/changes/@uifabric/example-app-base/chuli-cmdReflow_2017-06-21-00-15.json
deleted file mode 100644
index 3b8ee8b03d813..0000000000000
--- a/common/changes/@uifabric/example-app-base/chuli-cmdReflow_2017-06-21-00-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "chuli@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/strict-casing_2017-06-23-22-51.json b/common/changes/@uifabric/example-app-base/strict-casing_2017-06-23-22-51.json
deleted file mode 100644
index 3bf746278d91f..0000000000000
--- a/common/changes/@uifabric/example-app-base/strict-casing_2017-06-23-22-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Enable forceConsistentCasingInFileNames tsconfig option",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/chuli-cmdReflow_2017-06-21-00-15.json b/common/changes/@uifabric/fabric-website/chuli-cmdReflow_2017-06-21-00-15.json
deleted file mode 100644
index b0bf92e85c458..0000000000000
--- a/common/changes/@uifabric/fabric-website/chuli-cmdReflow_2017-06-21-00-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "chuli@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/strict-casing_2017-06-23-22-51.json b/common/changes/@uifabric/fabric-website/strict-casing_2017-06-23-22-51.json
deleted file mode 100644
index 2c588fdceb5e1..0000000000000
--- a/common/changes/@uifabric/fabric-website/strict-casing_2017-06-23-22-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Enable forceConsistentCasingInFileNames tsconfig option",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/chuli-cmdReflow_2017-06-21-00-15.json b/common/changes/@uifabric/styling/chuli-cmdReflow_2017-06-21-00-15.json
deleted file mode 100644
index 0068ffa5952a0..0000000000000
--- a/common/changes/@uifabric/styling/chuli-cmdReflow_2017-06-21-00-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "chuli@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/strict-casing_2017-06-23-22-51.json b/common/changes/@uifabric/styling/strict-casing_2017-06-23-22-51.json
deleted file mode 100644
index ffd14d7a4cb20..0000000000000
--- a/common/changes/@uifabric/styling/strict-casing_2017-06-23-22-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Enable forceConsistentCasingInFileNames tsconfig option",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/chuli-cmdReflow_2017-06-21-00-15.json b/common/changes/@uifabric/utilities/chuli-cmdReflow_2017-06-21-00-15.json
deleted file mode 100644
index a5730b6941584..0000000000000
--- a/common/changes/@uifabric/utilities/chuli-cmdReflow_2017-06-21-00-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "chuli@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/strict-casing_2017-06-23-22-51.json b/common/changes/@uifabric/utilities/strict-casing_2017-06-23-22-51.json
deleted file mode 100644
index 4e6fa7b525ddc..0000000000000
--- a/common/changes/@uifabric/utilities/strict-casing_2017-06-23-22-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Enable forceConsistentCasingInFileNames tsconfig option",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/chuli-cmdReflow_2017-06-21-00-15.json b/common/changes/office-ui-fabric-react/chuli-cmdReflow_2017-06-21-00-15.json
deleted file mode 100644
index ff13c8bb59c68..0000000000000
--- a/common/changes/office-ui-fabric-react/chuli-cmdReflow_2017-06-21-00-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Commandbar: fix synchronous reflow ",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chuli@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jolore-EnhanceCalendarComponent_2017-06-20-20-20.json b/common/changes/office-ui-fabric-react/jolore-EnhanceCalendarComponent_2017-06-20-20-20.json
deleted file mode 100644
index 7c6f97a763eeb..0000000000000
--- a/common/changes/office-ui-fabric-react/jolore-EnhanceCalendarComponent_2017-06-20-20-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Enhancing the calendar component to allow for turning off the day picker and highlighting the \"today\" month in the month picker. This will match the behavior of the Timestrip component in today's JSMVVM OWA Calendar.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jolore@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/oveflowset-type-fix_2017-06-23-21-29.json b/common/changes/office-ui-fabric-react/oveflowset-type-fix_2017-06-23-21-29.json
deleted file mode 100644
index b0c8e6c8aacc4..0000000000000
--- a/common/changes/office-ui-fabric-react/oveflowset-type-fix_2017-06-23-21-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "OverflowSet: Fix type definition to be compatible with latest @types/react",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/persona-fix_2017-06-26-23-05.json b/common/changes/office-ui-fabric-react/persona-fix_2017-06-26-23-05.json
deleted file mode 100644
index 57905773fb508..0000000000000
--- a/common/changes/office-ui-fabric-react/persona-fix_2017-06-26-23-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Persona: Fixing image sizing to cover correctly.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/strict-casing_2017-06-23-22-51.json b/common/changes/office-ui-fabric-react/strict-casing_2017-06-23-22-51.json
deleted file mode 100644
index 4ea8e71fc67cb..0000000000000
--- a/common/changes/office-ui-fabric-react/strict-casing_2017-06-23-22-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Enable forceConsistentCasingInFileNames tsconfig option",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 1703b0381868f..e2826d030cfa2 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "4.0.1",
+      "tag": "@uifabric/example-app-base_v4.0.1",
+      "date": "Tue, 27 Jun 2017 01:26:31 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "8e7c0dbb6bee06a7e289b6df7da934df425b9871",
+            "comment": "Enable forceConsistentCasingInFileNames tsconfig option"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.11.5 <1.0.0` to `>=0.11.6 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.4.0 <5.0.0` to `>=4.4.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.0.0",
       "tag": "@uifabric/example-app-base_v4.0.0",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index a67aead61ae89..35dbd8fff8b06 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Wed, 21 Jun 2017 00:45:41 GMT and should not be manually modified.
+This log was last generated on Tue, 27 Jun 2017 01:26:31 GMT and should not be manually modified.
+
+## 4.0.1
+Tue, 27 Jun 2017 01:26:31 GMT
+
+### Patches
+
+- Enable forceConsistentCasingInFileNames tsconfig option
 
 ## 4.0.0
 Wed, 21 Jun 2017 00:45:41 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 7cacbf6d62051..f82c7ab416f57 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "4.0.0",
+  "version": "4.0.1",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,8 +47,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.11.5 <1.0.0",
-    "@uifabric/utilities": ">=4.4.0 <5.0.0",
+    "@uifabric/styling": ">=0.11.6 <1.0.0",
+    "@uifabric/utilities": ">=4.4.1 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.4.0 <5.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 63a98f999dd1c..e3eb02ca6d4fb 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-component",
-  "version": "1.0.37",
+  "version": "1.0.38",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -21,8 +21,8 @@
     "@types/react-addons-test-utils": "^0.14.18",
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "4.0.0",
-    "@uifabric/utilities": "4.4.0",
+    "@uifabric/example-app-base": "4.0.1",
+    "@uifabric/utilities": "4.4.1",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.10.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.11.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 80e576d406e44..aff868c68a1cc 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,53 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.11.0",
+      "tag": "office-ui-fabric-react_v4.11.0",
+      "date": "Tue, 27 Jun 2017 01:26:31 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "rachelcl9 <chuli@microsoft.com>",
+            "commit": "ab0403c92b9c1e6c2c138b8fe5e80684ff853857",
+            "comment": "Commandbar: fix synchronous reflow "
+          },
+          {
+            "author": "John Lorenz <jcl47@duke.edu>",
+            "commit": "b00a2c9dfa0ac1c3f0f6dcb17cc72b783bede3cf",
+            "comment": "Enhancing the calendar component to allow for turning off the day picker and highlighting the \"today\" month in the month picker. This will match the behavior of the Timestrip component in today's JSMVVM OWA Calendar."
+          }
+        ],
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "002cd689e299ae5fb2ee99e16f12c85e74043e95",
+            "comment": "OverflowSet: Fix type definition to be compatible with latest @types/react"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "f3203551b08875e9fc6bcf4ff937a1e1d7eda353",
+            "comment": "Persona: Fixing image sizing to cover correctly."
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "8e7c0dbb6bee06a7e289b6df7da934df425b9871",
+            "comment": "Enable forceConsistentCasingInFileNames tsconfig option"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.4.0 <5.0.0` to `>=4.4.1 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.11.5 <1.0.0` to `>=0.11.6 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `4.0.0` to `4.0.1`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.10.2",
       "tag": "office-ui-fabric-react_v4.10.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index ac21c897e8041..fd1463b3f6114 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,20 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 23 Jun 2017 20:02:00 GMT and should not be manually modified.
+This log was last generated on Tue, 27 Jun 2017 01:26:31 GMT and should not be manually modified.
+
+## 4.11.0
+Tue, 27 Jun 2017 01:26:31 GMT
+
+### Minor changes
+
+- Commandbar: fix synchronous reflow 
+- Enhancing the calendar component to allow for turning off the day picker and highlighting the "today" month in the month picker. This will match the behavior of the Timestrip component in today's JSMVVM OWA Calendar.
+
+### Patches
+
+- OverflowSet: Fix type definition to be compatible with latest @types/react
+- Persona: Fixing image sizing to cover correctly.
+- Enable forceConsistentCasingInFileNames tsconfig option
 
 ## 4.10.2
 Fri, 23 Jun 2017 20:02:00 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 2853a2087b8d0..fdce55375204b 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.10.2",
+  "version": "4.11.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "^2.2.2",
     "@types/webpack-env": "^1.13.0",
-    "@uifabric/example-app-base": "4.0.0",
+    "@uifabric/example-app-base": "4.0.1",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -71,8 +71,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.4.0 <5.0.0",
-    "@uifabric/styling": ">=0.11.5 <1.0.0",
+    "@uifabric/utilities": ">=4.4.1 <5.0.0",
+    "@uifabric/styling": ">=0.11.6 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index fee1c7a4c8af9..43498156d9a16 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.11.6",
+      "tag": "@uifabric/styling_v0.11.6",
+      "date": "Tue, 27 Jun 2017 01:26:31 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "8e7c0dbb6bee06a7e289b6df7da934df425b9871",
+            "comment": "Enable forceConsistentCasingInFileNames tsconfig option"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.4.0 <5.0.0` to `>=4.4.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.11.5",
       "tag": "@uifabric/styling_v0.11.5",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 833bc7e1e61b2..7c73a2adad980 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 23 Jun 2017 20:02:00 GMT and should not be manually modified.
+This log was last generated on Tue, 27 Jun 2017 01:26:31 GMT and should not be manually modified.
+
+## 0.11.6
+Tue, 27 Jun 2017 01:26:31 GMT
+
+### Patches
+
+- Enable forceConsistentCasingInFileNames tsconfig option
 
 ## 0.11.5
 Fri, 23 Jun 2017 20:02:00 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index cc144dbf6575a..559f074c68118 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.11.5",
+  "version": "0.11.6",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.4.0 <5.0.0",
+    "@uifabric/utilities": ">=4.4.1 <5.0.0",
     "tslib": "^1.6.0",
     "rtl-css-js": "^1.1.1",
     "glamor": "^2.20.24"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index dedbe087ed1c2..b05f18cd8f7b3 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.4.1",
+      "tag": "@uifabric/utilities_v4.4.1",
+      "date": "Tue, 27 Jun 2017 01:26:31 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "8e7c0dbb6bee06a7e289b6df7da934df425b9871",
+            "comment": "Enable forceConsistentCasingInFileNames tsconfig option"
+          }
+        ]
+      }
+    },
     {
       "version": "4.4.0",
       "tag": "@uifabric/utilities_v4.4.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 6d3ea471ea4e8..021714f5dc979 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Wed, 21 Jun 2017 01:52:48 GMT and should not be manually modified.
+This log was last generated on Tue, 27 Jun 2017 01:26:31 GMT and should not be manually modified.
+
+## 4.4.1
+Tue, 27 Jun 2017 01:26:31 GMT
+
+### Patches
+
+- Enable forceConsistentCasingInFileNames tsconfig option
 
 ## 4.4.0
 Wed, 21 Jun 2017 01:52:48 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index ffb5df29f7641..2c0a87574d10d 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.4.0",
+  "version": "4.4.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From fc124a53f04aa8ef7f7d972d223796cbee64d982 Mon Sep 17 00:00:00 2001
From: "P.J. Swesey" <swese44@gmail.com>
Date: Tue, 27 Jun 2017 09:05:00 -0700
Subject: [PATCH 0173/1641] Adding alt text to Persona image (#2065)

* Adding alt text to Persona image

* change log

* Update persona-alt_2017-06-24-20-53.json
---
 .../persona-alt_2017-06-24-20-53.json         | 11 ++++++++++
 .../src/components/Persona/Persona.Props.ts   |  5 +++++
 .../src/components/Persona/Persona.test.tsx   | 21 +++++++++++++++----
 .../src/components/Persona/Persona.tsx        |  5 ++++-
 4 files changed, 37 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/persona-alt_2017-06-24-20-53.json

diff --git a/common/changes/office-ui-fabric-react/persona-alt_2017-06-24-20-53.json b/common/changes/office-ui-fabric-react/persona-alt_2017-06-24-20-53.json
new file mode 100644
index 0000000000000..e7aec57eb33a5
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/persona-alt_2017-06-24-20-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Persona: Adding image alt, defaulting to empty string",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "pjsw@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts b/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
index 5bacf9f2ff04e..33dc2eb0f727c 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
@@ -46,6 +46,11 @@ export interface IPersonaProps extends React.HTMLAttributes<Persona> {
    */
   imageUrl?: string;
 
+  /**
+   * Alt text for the image to use. Defaults to an empty string.
+   */
+  imageAlt?: string;
+
   /**
    * The user's initials to display in the image area when there is no image.
    * @defaultvalue [Derived from primaryText]
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
index 2328edc3783da..87b9a477cf58d 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
@@ -8,14 +8,16 @@ import * as chai from 'chai';
 import * as stylesImport from './Persona.scss';
 const styles: any = stylesImport;
 
+const testImage1x1 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQImWP4DwQACfsD/eNV8pwAAAAASUVORK5CYII=';
+
 const { expect } = chai;
 
 describe('Persona', () => {
-  describe('initials and colors', () => {
-    beforeEach(() => {
-      setRTL(false);
-    });
+  beforeEach(() => {
+    setRTL(false);
+  });
 
+  describe('initials and colors', () => {
     it('renders with expected initialsColor if none was provided', () => {
       const wrapper = shallow(<Persona primaryText='Kat Larrson' />);
       let result = wrapper.find('.' + styles.initialsIsRed);
@@ -75,4 +77,15 @@ describe('Persona', () => {
     });
   });
 
+  describe('image', () => {
+    it('renders empty alt text by default', () => {
+      const wrapper = shallow(<Persona primaryText='Kat Larrson' imageUrl={ testImage1x1 } />);
+      expect(wrapper.find('Image').props().alt).to.equal('');
+    });
+
+    it('renders its given alt text', () => {
+      const wrapper = shallow(<Persona primaryText='Kat Larrson' imageUrl={ testImage1x1 } imageAlt='ALT TEXT' />);
+      expect(wrapper.find('Image').props().alt).to.equal('ALT TEXT');
+    });
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index 5933004f3100f..106deeb12fa4c 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -65,7 +65,8 @@ export class Persona extends BaseComponent<IPersonaProps, IPersonaState> {
   public static defaultProps: IPersonaProps = {
     primaryText: '',
     size: PersonaSize.regular,
-    presence: PersonaPresence.none
+    presence: PersonaPresence.none,
+    imageAlt: ''
   };
 
   constructor(props: IPersonaProps) {
@@ -81,6 +82,7 @@ export class Persona extends BaseComponent<IPersonaProps, IPersonaState> {
       className,
       size,
       imageUrl,
+      imageAlt,
       initialsColor,
       presence,
       primaryText,
@@ -173,6 +175,7 @@ export class Persona extends BaseComponent<IPersonaProps, IPersonaState> {
               src={ imageUrl }
               width={ SIZE_TO_PIXELS[size] }
               height={ SIZE_TO_PIXELS[size] }
+              alt={ imageAlt }
               shouldFadeIn={ imageShouldFadeIn }
               shouldStartVisible={ imageShouldStartVisible }
               onLoadingStateChange={ this._onPhotoLoadingStateChange } />

From d926a37be578b72325d0cc89789d8f4625115902 Mon Sep 17 00:00:00 2001
From: Otto Streifel <ottost@microsoft.com>
Date: Tue, 27 Jun 2017 21:05:15 -0700
Subject: [PATCH 0174/1641] Allow focus parent (#2043)

---
 .../src/components/DetailsList/DetailsRow.tsx |  1 +
 .../components/FocusZone/FocusZone.Props.ts   |  3 ++
 .../src/components/FocusZone/FocusZone.tsx    | 14 +++++-----
 packages/utilities/api/utilities.api.ts       |  6 ++--
 packages/utilities/src/focus.ts               | 28 ++++++++++++-------
 5 files changed, 33 insertions(+), 19 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index 7ff28f2e25682..92c4d85b18ea2 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -216,6 +216,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
         data-automationid='DetailsRow'
         style={ { minWidth: viewport ? viewport.width : 0 } }
         aria-selected={ isSelected }
+        allowFocusRoot={ true }
       >
         { showCheckbox && (
           <div
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.Props.ts b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.Props.ts
index aee62c1a0a134..4227189dd4cf9 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.Props.ts
@@ -94,6 +94,9 @@ export interface IFocusZoneProps extends React.HTMLAttributes<HTMLElement | Focu
    * @returns True if focus should be set to the given element, false to avoid setting focus.
    */
   onBeforeFocus?: (childElement?: HTMLElement) => boolean;
+
+  /** Allow focus to move to root */
+  allowFocusRoot?: boolean;
 }
 
 export enum FocusZoneDirection {
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index ab452ea18e90f..288aff0fc457e 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -135,10 +135,10 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     if (!forceIntoFirstElement && this.refs.root.getAttribute(IS_FOCUSABLE_ATTRIBUTE) === 'true' && this._isInnerZone) {
       // The parent focus zone should take responsibility for focusing this element.
       return true;
-     } else if (this._activeElement && elementContains(this.refs.root, this._activeElement)
-        && isElementTabbable(this._activeElement)) {
-        this._activeElement.focus();
-        return true;
+    } else if (this._activeElement && elementContains(this.refs.root, this._activeElement)
+      && isElementTabbable(this._activeElement)) {
+      this._activeElement.focus();
+      return true;
     } else {
       const firstChild = this.refs.root.firstChild as HTMLElement;
 
@@ -439,8 +439,8 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
     do {
       element = isForward ?
-        getNextElement(this.refs.root, element) :
-        getPreviousElement(this.refs.root, element);
+        getNextElement(this.refs.root, element, undefined, undefined, undefined, undefined, true) :
+        getPreviousElement(this.refs.root, element, undefined, undefined, undefined, undefined, true);
 
       if (isBidirectional) {
         if (element) {
@@ -652,7 +652,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       }
     }
 
-    // If active element changes state to disabled, set it to null. 
+    // If active element changes state to disabled, set it to null.
     // Otherwise, we lose keyboard accessibility to other elements in focus zone.
     if (this._activeElement && !isElementTabbable(this._activeElement)) {
       this._activeElement = null;
diff --git a/packages/utilities/api/utilities.api.ts b/packages/utilities/api/utilities.api.ts
index 3b3143145fe17..463984175d645 100644
--- a/packages/utilities/api/utilities.api.ts
+++ b/packages/utilities/api/utilities.api.ts
@@ -135,7 +135,8 @@ export function getNextElement(rootElement: HTMLElement,
   checkNode?: boolean,
   suppressParentTraversal?: boolean,
   suppressChildTraversal?: boolean,
-  includeElementsInFocusZones?: boolean): HTMLElement | null;
+  includeElementsInFocusZones?: boolean,
+  allowFocusRoot?: boolean): HTMLElement | null;
 
 export function getParent(child: HTMLElement, allowVirtualParents: boolean = true): HTMLElement | null;
 
@@ -144,7 +145,8 @@ export function getPreviousElement(rootElement: HTMLElement,
   checkNode?: boolean,
   suppressParentTraversal?: boolean,
   traverseChildren?: boolean,
-  includeElementsInFocusZones?: boolean): HTMLElement | null;
+  includeElementsInFocusZones?: boolean,
+  allowFocusRoot?: boolean): HTMLElement | null;
 
 export function getRect(element: HTMLElement | Window | null): IRectangle | undefined;
 
diff --git a/packages/utilities/src/focus.ts b/packages/utilities/src/focus.ts
index bffe10bef6931..9f5c031e4971b 100644
--- a/packages/utilities/src/focus.ts
+++ b/packages/utilities/src/focus.ts
@@ -46,10 +46,11 @@ export function getPreviousElement(
   checkNode?: boolean,
   suppressParentTraversal?: boolean,
   traverseChildren?: boolean,
-  includeElementsInFocusZones?: boolean): HTMLElement | null {
+  includeElementsInFocusZones?: boolean,
+  allowFocusRoot?: boolean): HTMLElement | null {
 
   if (!currentElement ||
-    currentElement === rootElement) {
+    (!allowFocusRoot && currentElement === rootElement)) {
     return null;
   }
 
@@ -64,7 +65,8 @@ export function getPreviousElement(
       true,
       true,
       true,
-      includeElementsInFocusZones);
+      includeElementsInFocusZones,
+      allowFocusRoot);
 
     if (childMatch) {
       return childMatch;
@@ -83,7 +85,8 @@ export function getPreviousElement(
     true,
     true,
     true,
-    includeElementsInFocusZones);
+    includeElementsInFocusZones,
+    allowFocusRoot);
 
   if (siblingMatch) {
     return siblingMatch;
@@ -91,7 +94,8 @@ export function getPreviousElement(
 
   // Check its parent.
   if (!suppressParentTraversal) {
-    return getPreviousElement(rootElement, currentElement.parentElement, true, false, false, includeElementsInFocusZones);
+    return getPreviousElement(rootElement, currentElement.parentElement, true, false, false, includeElementsInFocusZones,
+      allowFocusRoot);
   }
 
   return null;
@@ -104,11 +108,12 @@ export function getNextElement(
   checkNode?: boolean,
   suppressParentTraversal?: boolean,
   suppressChildTraversal?: boolean,
-  includeElementsInFocusZones?: boolean): HTMLElement | null {
+  includeElementsInFocusZones?: boolean,
+  allowFocusRoot?: boolean): HTMLElement | null {
 
   if (
     !currentElement ||
-    (currentElement === rootElement && suppressChildTraversal)) {
+    (currentElement === rootElement && suppressChildTraversal && !allowFocusRoot)) {
     return null;
   }
 
@@ -128,7 +133,8 @@ export function getNextElement(
       true,
       true,
       false,
-      includeElementsInFocusZones);
+      includeElementsInFocusZones,
+      allowFocusRoot);
 
     if (childMatch) {
       return childMatch;
@@ -146,14 +152,16 @@ export function getNextElement(
     true,
     true,
     false,
-    includeElementsInFocusZones);
+    includeElementsInFocusZones,
+    allowFocusRoot);
 
   if (siblingMatch) {
     return siblingMatch;
   }
 
   if (!suppressParentTraversal) {
-    return getNextElement(rootElement, currentElement.parentElement, false, false, true, includeElementsInFocusZones);
+    return getNextElement(rootElement, currentElement.parentElement, false, false, true, includeElementsInFocusZones,
+      allowFocusRoot);
   }
 
   return null;

From bc5b41cc4894c6d41f2d17e5356eb0334fed6345 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 27 Jun 2017 21:05:59 -0700
Subject: [PATCH 0175/1641] MarqueeSelection: performance adjustments (#2077)

* Async marquee selection perf fix.

* Adding change file.

* Fixing log.
---
 .../marquee_2017-06-27-19-44.json             | 11 ++++++++
 .../MarqueeSelection/MarqueeSelection.tsx     | 28 +++++++++++++------
 .../MarqueeSelection.Basic.Example.scss       |  1 +
 3 files changed, 32 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/marquee_2017-06-27-19-44.json

diff --git a/common/changes/office-ui-fabric-react/marquee_2017-06-27-19-44.json b/common/changes/office-ui-fabric-react/marquee_2017-06-27-19-44.json
new file mode 100644
index 0000000000000..9abe5d98a4dea
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/marquee_2017-06-27-19-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "MarqueeSelection: now with better performance in Edge.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
index 92c5c9b16406a..e00ccb0d42861 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
@@ -137,13 +137,15 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
     if (isEnabled && !this._isDragStartInSelection(ev) && (!onShouldStartSelection || onShouldStartSelection(ev))) {
       if (this._scrollableSurface && ev.button === 0) {
         this._selectedIndicies = {};
-        this._events.on(window, 'mousemove', this._onMouseMove);
-        this._events.on(this._scrollableParent, 'scroll', this._onMouseMove);
+        this._events.on(window, 'mousemove', this._onAsyncMouseMove);
+        this._events.on(this._scrollableParent, 'scroll', this._onAsyncMouseMove);
         this._events.on(window, 'click', this._onMouseUp, true);
 
         this._autoScroll = new AutoScroll(this.refs.root);
         this._scrollTop = this._scrollableSurface.scrollTop;
         this._rootRect = this.refs.root.getBoundingClientRect();
+
+        this._onMouseMove(ev);
       }
     }
   }
@@ -157,7 +159,20 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
     };
   }
 
+  private _onAsyncMouseMove(ev: MouseEvent) {
+    this._async.requestAnimationFrame(() => {
+      this._onMouseMove(ev);
+    });
+
+    ev.stopPropagation();
+    ev.preventDefault();
+  }
+
   private _onMouseMove(ev: MouseEvent) {
+    if (!this._autoScroll) {
+      return;
+    }
+
     if (ev.clientX !== undefined) {
       this._lastMouseEvent = ev;
     }
@@ -189,14 +204,12 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
           height: Math.abs(constrainedPoint.y - this._dragOrigin.y)
         };
 
+        this._evaluateSelection(dragRect, rootRect);
+
         this.setState({ dragRect });
-        this._evaluateSelection(dragRect);
       }
     }
 
-    ev.stopPropagation();
-    ev.preventDefault();
-
     return false;
   }
 
@@ -250,14 +263,13 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
     return false;
   }
 
-  private _evaluateSelection(dragRect: IRectangle) {
+  private _evaluateSelection(dragRect: IRectangle, rootRect: IRectangle) {
     // Break early if we don't need to evaluate.
     if (!dragRect) {
       return;
     }
 
     let { selection } = this.props;
-    let rootRect = this._getRootRect();
     let allElements = this.refs.root.querySelectorAll('[data-selection-index]');
 
     if (!this._itemRectCache) {
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.scss b/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.scss
index 6dcd7edf9e26d..1b97f51657c24 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.scss
@@ -7,6 +7,7 @@
     margin: 0;
     padding: 10px;
     overflow: hidden;
+    user-select: none;
   }
 
   .ms-MarqueeSelectionBasicExample-photoCell {

From 65cba5c652fb0f968c4290df849ed9dbea52a86c Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 27 Jun 2017 21:12:08 -0700
Subject: [PATCH 0176/1641] Textfield: Fixed layout of underlined textfield
 with error (#2015)

* Textfield: Fixed layout of underlined textfield with error

* Change file
---
 ...ined-textfield-error_2017-06-19-15-55.json | 11 ++++++++++
 .../src/components/TextField/TextField.scss   | 11 ++++++----
 .../src/components/TextField/TextField.tsx    | 20 ++++++++++---------
 .../examples/TextField.Basic.Example.tsx      |  1 -
 .../TextField.ErrorMessage.Example.tsx        |  2 ++
 5 files changed, 31 insertions(+), 14 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/underlined-textfield-error_2017-06-19-15-55.json

diff --git a/common/changes/office-ui-fabric-react/underlined-textfield-error_2017-06-19-15-55.json b/common/changes/office-ui-fabric-react/underlined-textfield-error_2017-06-19-15-55.json
new file mode 100644
index 0000000000000..01ba5fb18a5eb
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/underlined-textfield-error_2017-06-19-15-55.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Textfield: Fixed layout of underlined textfield with error",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index 2037e560cad1e..ed89350e619b6 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -166,11 +166,7 @@ $field-error-color: $errorTextColor;
 
 //== Modifier: Single line (default), underlined
 .root.rootIsUnderlined {
-  border-bottom: 1px solid $field-border-color;
   border-width: 0px;
-  border-bottom-width: 1px;
-  display: flex;
-  width: 100%;
 
   &:hover:not(.rootIsDisabled) {
     border-color: $field-border-hover-color;
@@ -184,6 +180,12 @@ $field-error-color: $errorTextColor;
     }
   }
 
+  .wrapper {
+    display: flex;
+    border-bottom: 1px solid $field-border-color;
+    width: 100%;
+  }
+
   :global(.ms-Label) {
     font-size: $ms-font-size-m;
     @include ms-margin-right(8px);
@@ -195,6 +197,7 @@ $field-error-color: $errorTextColor;
   .fieldGroup {
     flex: 1 1 0px;
     border: 0;
+
     @include ms-text-align(left);
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index 2bb6a70eca5f9..d27ee3285f6dd 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -154,15 +154,17 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
 
     return (
       <div className={ textFieldClassName }>
-        { label && <Label htmlFor={ this._id }>{ label }</Label> }
-        <div className={ css(styles.fieldGroup, isFocused && styles.fieldGroupIsFocused, errorMessage && styles.invalid) }>
-          { (addonString !== undefined || this.props.onRenderAddon) && (
-            <div className={ css(styles.fieldAddon) }>
-              { onRenderAddon(this.props, this._onRenderAddon) }
-            </div>
-          ) }
-          { multiline ? this._renderTextArea() : this._renderInput() }
-          { (iconClass || iconProps) && <Icon className={ css(iconClass, styles.icon) } { ...iconProps } /> }
+        <div className={ css('ms-TextField-wrapper', styles.wrapper) }>
+          { label && <Label htmlFor={ this._id }>{ label }</Label> }
+          <div className={ css(styles.fieldGroup, isFocused && styles.fieldGroupIsFocused, errorMessage && styles.invalid) }>
+            { (addonString !== undefined || this.props.onRenderAddon) && (
+              <div className={ css(styles.fieldAddon) }>
+                { onRenderAddon(this.props, this._onRenderAddon) }
+              </div>
+            ) }
+            { multiline ? this._renderTextArea() : this._renderInput() }
+            { (iconClass || iconProps) && <Icon className={ css(iconClass, styles.icon) } { ...iconProps } /> }
+          </div>
         </div>
         { this._isDescriptionAvailable &&
           <span id={ this._descriptionId }>
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
index f0886edff4576..52c863591a7c1 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
@@ -8,7 +8,6 @@ export class TextFieldBasicExample extends React.Component<any, any> {
     return (
       <div>
         <TextField
-          addonString='https://'
           label='Default TextField' onChanged={ this._onChanged } />
         <TextField label='Disabled TextField' disabled={ true } placeholder='Placeholder text' />
         <TextField label='Required TextField' required={ true } />
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx
index 59893288e3691..d91edd68ef16a 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx
@@ -63,6 +63,8 @@ export class TextFieldErrorMessageExample extends React.Component<{}, {}> {
           onGetErrorMessage={ this._getErrorMessage }
           validateOnFocusOut
         />
+        <TextField label='Underlined TextField' underlined onGetErrorMessage={ this._getErrorMessage } />
+
         <TextField
           label='TextField that uses the errorMessage property to set an error state.'
           placeholder='This field always has an error.'

From 53f311e747fe0255cca631fe174c370d93424551 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Tue, 27 Jun 2017 23:36:58 -0700
Subject: [PATCH 0177/1641] Details focus (#2071)

* Final fix for focusing first item in DetailsList

* Update change output
---
 .../details-focus_2017-06-26-19-46.json           | 11 +++++++++++
 .../src/components/DetailsList/DetailsRow.tsx     | 15 ++++-----------
 .../src/components/FocusZone/FocusZone.tsx        | 11 +++++++++--
 3 files changed, 24 insertions(+), 13 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/details-focus_2017-06-26-19-46.json

diff --git a/common/changes/office-ui-fabric-react/details-focus_2017-06-26-19-46.json b/common/changes/office-ui-fabric-react/details-focus_2017-06-26-19-46.json
new file mode 100644
index 0000000000000..6cf7a501ce23f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/details-focus_2017-06-26-19-46.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixed focusing first item in DetailsList",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index 92c4d85b18ea2..b1adb31f56fd8 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -14,7 +14,7 @@ import { IColumn, CheckboxVisibility } from './DetailsList.Props';
 import { DetailsRowCheck, IDetailsRowCheckProps } from './DetailsRowCheck';
 import { GroupSpacer } from '../GroupedList/GroupSpacer';
 import { DetailsRowFields } from './DetailsRowFields';
-import { FocusZone, FocusZoneDirection } from '../../FocusZone';
+import { FocusZone, FocusZoneDirection, IFocusZone } from '../../FocusZone';
 import { ISelection, SelectionMode, SELECTION_CHANGE } from '../../utilities/selection/interfaces';
 import {
   IDragDropHelper,
@@ -72,6 +72,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
   };
 
   private _root: HTMLElement;
+  private _focusZone: IFocusZone;
   private _hasSetFocus: boolean;
   private _droppingClassNames: string;
   private _hasMounted: boolean;
@@ -194,6 +195,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
         {...getNativeProps(this.props, divProperties) }
         direction={ FocusZoneDirection.horizontal }
         ref={ this._onRootRef }
+        componentRef={ this._resolveRef('_focusZone') }
         role='row'
         aria-label={ ariaLabel }
         className={ css(
@@ -286,16 +288,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
   }
 
   public focus(): boolean {
-    const {
-      _root
-    } = this;
-
-    if (_root) {
-      _root.focus();
-      return true;
-    }
-
-    return false;
+    return !!this._focusZone && this._focusZone.focus();
   }
 
   protected _onRenderCheck(props: IDetailsRowCheckProps) {
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 288aff0fc457e..6bf4c4f42befe 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -133,8 +133,15 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
    */
   public focus(forceIntoFirstElement: boolean = false): boolean {
     if (!forceIntoFirstElement && this.refs.root.getAttribute(IS_FOCUSABLE_ATTRIBUTE) === 'true' && this._isInnerZone) {
-      // The parent focus zone should take responsibility for focusing this element.
-      return true;
+      const ownerZoneElement = this._getOwnerZone(this.refs.root);
+
+      if (ownerZoneElement !== this.refs.root) {
+        const ownerZone = _allInstances[ownerZoneElement.getAttribute(FOCUSZONE_ID_ATTRIBUTE)];
+
+        return !!ownerZone && ownerZone.focusElement(this.refs.root);
+      }
+
+      return false;
     } else if (this._activeElement && elementContains(this.refs.root, this._activeElement)
       && isElementTabbable(this._activeElement)) {
       this._activeElement.focus();

From d4f1919ea0fe31fe6e21bee983aca49c1905329f Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 28 Jun 2017 10:12:04 +0000
Subject: [PATCH 0178/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 .../details-focus_2017-06-26-19-46.json       | 11 ------
 .../marquee_2017-06-27-19-44.json             | 11 ------
 .../persona-alt_2017-06-24-20-53.json         | 11 ------
 ...ined-textfield-error_2017-06-19-15-55.json | 11 ------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 36 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 +++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/CHANGELOG.json               |  6 ++++
 packages/styling/CHANGELOG.md                 |  7 +++-
 packages/styling/package.json                 |  2 +-
 13 files changed, 68 insertions(+), 52 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/details-focus_2017-06-26-19-46.json
 delete mode 100644 common/changes/office-ui-fabric-react/marquee_2017-06-27-19-44.json
 delete mode 100644 common/changes/office-ui-fabric-react/persona-alt_2017-06-24-20-53.json
 delete mode 100644 common/changes/office-ui-fabric-react/underlined-textfield-error_2017-06-19-15-55.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 2de9bac701474..e77bcb00efbbd 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.10.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.12.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/details-focus_2017-06-26-19-46.json b/common/changes/office-ui-fabric-react/details-focus_2017-06-26-19-46.json
deleted file mode 100644
index 6cf7a501ce23f..0000000000000
--- a/common/changes/office-ui-fabric-react/details-focus_2017-06-26-19-46.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixed focusing first item in DetailsList",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/marquee_2017-06-27-19-44.json b/common/changes/office-ui-fabric-react/marquee_2017-06-27-19-44.json
deleted file mode 100644
index 9abe5d98a4dea..0000000000000
--- a/common/changes/office-ui-fabric-react/marquee_2017-06-27-19-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "MarqueeSelection: now with better performance in Edge.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/persona-alt_2017-06-24-20-53.json b/common/changes/office-ui-fabric-react/persona-alt_2017-06-24-20-53.json
deleted file mode 100644
index e7aec57eb33a5..0000000000000
--- a/common/changes/office-ui-fabric-react/persona-alt_2017-06-24-20-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Persona: Adding image alt, defaulting to empty string",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "pjsw@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/underlined-textfield-error_2017-06-19-15-55.json b/common/changes/office-ui-fabric-react/underlined-textfield-error_2017-06-19-15-55.json
deleted file mode 100644
index 01ba5fb18a5eb..0000000000000
--- a/common/changes/office-ui-fabric-react/underlined-textfield-error_2017-06-19-15-55.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Textfield: Fixed layout of underlined textfield with error",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index f82c7ab416f57..adb20d91424e1 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -47,7 +47,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.11.6 <1.0.0",
+    "@uifabric/styling": ">=0.11.7 <1.0.0",
     "@uifabric/utilities": ">=4.4.1 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index e3eb02ca6d4fb..52c23cdc9eca2 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.11.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.12.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index aff868c68a1cc..086cce4279e94 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,42 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.12.0",
+      "tag": "office-ui-fabric-react_v4.12.0",
+      "date": "Wed, 28 Jun 2017 10:12:04 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "53f311e747fe0255cca631fe174c370d93424551",
+            "comment": "Fixed focusing first item in DetailsList"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "bc5b41cc4894c6d41f2d17e5356eb0334fed6345",
+            "comment": "MarqueeSelection: now with better performance in Edge."
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "65cba5c652fb0f968c4290df849ed9dbea52a86c",
+            "comment": "Textfield: Fixed layout of underlined textfield with error"
+          }
+        ],
+        "minor": [
+          {
+            "author": "P.J. Swesey <swese44@gmail.com>",
+            "commit": "fc124a53f04aa8ef7f7d972d223796cbee64d982",
+            "comment": "Persona: Adding image alt, defaulting to empty string"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.11.6 <1.0.0` to `>=0.11.7 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.11.0",
       "tag": "office-ui-fabric-react_v4.11.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index fd1463b3f6114..d28f0f7edcba3 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 27 Jun 2017 01:26:31 GMT and should not be manually modified.
+This log was last generated on Wed, 28 Jun 2017 10:12:04 GMT and should not be manually modified.
+
+## 4.12.0
+Wed, 28 Jun 2017 10:12:04 GMT
+
+### Minor changes
+
+- Persona: Adding image alt, defaulting to empty string
+
+### Patches
+
+- Fixed focusing first item in DetailsList
+- MarqueeSelection: now with better performance in Edge.
+- Textfield: Fixed layout of underlined textfield with error
 
 ## 4.11.0
 Tue, 27 Jun 2017 01:26:31 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index fdce55375204b..7f72d1d064273 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.11.0",
+  "version": "4.12.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.4.1 <5.0.0",
-    "@uifabric/styling": ">=0.11.6 <1.0.0",
+    "@uifabric/styling": ">=0.11.7 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 43498156d9a16..e95b3b5886cd1 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.11.7",
+      "tag": "@uifabric/styling_v0.11.7",
+      "date": "Wed, 28 Jun 2017 10:12:04 GMT",
+      "comments": {}
+    },
     {
       "version": "0.11.6",
       "tag": "@uifabric/styling_v0.11.6",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 7c73a2adad980..c7aceece04680 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Tue, 27 Jun 2017 01:26:31 GMT and should not be manually modified.
+This log was last generated on Wed, 28 Jun 2017 10:12:04 GMT and should not be manually modified.
+
+## 0.11.7
+Wed, 28 Jun 2017 10:12:04 GMT
+
+*Changes not tracked*
 
 ## 0.11.6
 Tue, 27 Jun 2017 01:26:31 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 559f074c68118..592433ffd5eb5 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.11.6",
+  "version": "0.11.7",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 76601ad312613034f48799b43499de56c0e6863b Mon Sep 17 00:00:00 2001
From: Aniket Handa <atneik@users.noreply.github.com>
Date: Wed, 28 Jun 2017 08:42:46 -0700
Subject: [PATCH 0179/1641] Remove beak from CommandBar's menu in Large+ screen
 sizes (#2052)

* Remove beak

* Add rush change

* nit

* Have default beak logic in ContextualMenu instead

* Update ContextualMenu.tsx
---
 ...nihan-commadBar-callout-beak_2017-06-22-22-05.json | 11 +++++++++++
 ...nihan-commadBar-callout-beak_2017-06-22-22-05.json | 11 +++++++++++
 ...nihan-commadBar-callout-beak_2017-06-22-22-05.json | 11 +++++++++++
 ...nihan-commadBar-callout-beak_2017-06-22-22-05.json | 11 +++++++++++
 ...nihan-commadBar-callout-beak_2017-06-22-22-05.json | 11 +++++++++++
 .../src/components/Button/BaseButton.tsx              |  1 -
 .../src/components/Callout/Callout.Props.ts           |  2 +-
 .../src/components/CommandBar/CommandBar.tsx          |  1 -
 .../components/ContextualMenu/ContextualMenu.Props.ts |  4 ++--
 .../src/components/ContextualMenu/ContextualMenu.tsx  |  4 +++-
 10 files changed, 61 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/anihan-commadBar-callout-beak_2017-06-22-22-05.json
 create mode 100644 common/changes/@uifabric/fabric-website/anihan-commadBar-callout-beak_2017-06-22-22-05.json
 create mode 100644 common/changes/@uifabric/styling/anihan-commadBar-callout-beak_2017-06-22-22-05.json
 create mode 100644 common/changes/@uifabric/utilities/anihan-commadBar-callout-beak_2017-06-22-22-05.json
 create mode 100644 common/changes/office-ui-fabric-react/anihan-commadBar-callout-beak_2017-06-22-22-05.json

diff --git a/common/changes/@uifabric/example-app-base/anihan-commadBar-callout-beak_2017-06-22-22-05.json b/common/changes/@uifabric/example-app-base/anihan-commadBar-callout-beak_2017-06-22-22-05.json
new file mode 100644
index 0000000000000..fa53882beab0f
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/anihan-commadBar-callout-beak_2017-06-22-22-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "anihan@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/anihan-commadBar-callout-beak_2017-06-22-22-05.json b/common/changes/@uifabric/fabric-website/anihan-commadBar-callout-beak_2017-06-22-22-05.json
new file mode 100644
index 0000000000000..a7a946702dea0
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/anihan-commadBar-callout-beak_2017-06-22-22-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "anihan@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/anihan-commadBar-callout-beak_2017-06-22-22-05.json b/common/changes/@uifabric/styling/anihan-commadBar-callout-beak_2017-06-22-22-05.json
new file mode 100644
index 0000000000000..a97fc36c90b66
--- /dev/null
+++ b/common/changes/@uifabric/styling/anihan-commadBar-callout-beak_2017-06-22-22-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "anihan@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/anihan-commadBar-callout-beak_2017-06-22-22-05.json b/common/changes/@uifabric/utilities/anihan-commadBar-callout-beak_2017-06-22-22-05.json
new file mode 100644
index 0000000000000..faf4dbcc11174
--- /dev/null
+++ b/common/changes/@uifabric/utilities/anihan-commadBar-callout-beak_2017-06-22-22-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "anihan@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/anihan-commadBar-callout-beak_2017-06-22-22-05.json b/common/changes/office-ui-fabric-react/anihan-commadBar-callout-beak_2017-06-22-22-05.json
new file mode 100644
index 0000000000000..247b4ef2d79fd
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/anihan-commadBar-callout-beak_2017-06-22-22-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Remove beak from CommandBar's and BaseButton's contextual menu",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "anihan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index c3dff6f6d873e..ae06cd34bab72 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -301,7 +301,6 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   private _onRenderMenu(menuProps: IContextualMenuProps): JSX.Element {
     return (
       <ContextualMenu
-        isBeakVisible={ true }
         id={ this._labelId + '-menu' }
         directionalHint={ DirectionalHint.bottomLeftEdge }
         {...menuProps}
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts b/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
index e670a4c9d2fd9..a4393597c81f8 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
@@ -73,7 +73,7 @@ export interface ICalloutProps extends React.Props<Callout | CalloutContent> {
 
   /**
    * If true then the beak is visible. If false it will not be shown.
-   * @default false
+   * @default true
    */
   isBeakVisible?: boolean;
 
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 99f03f4337028..58cd3c0296cb4 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -142,7 +142,6 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
         { (contextualMenuProps) ?
           (<ContextualMenu
             className={ css('ms-CommandBar-menuHost') }
-            isBeakVisible={ true }
             directionalHint={ DirectionalHint.bottomAutoEdge }
             { ...contextualMenuProps }
             targetElement={ contextualMenuTarget }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
index 5b2d961b8da4a..f79b50fe5018a 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
@@ -8,6 +8,7 @@ import {
   IPoint,
   IRectangle
 } from '../../Utilities';
+import { IWithResponsiveModeState } from '../../utilities/decorators/withResponsiveMode';
 export { DirectionalHint } from '../../common/DirectionalHint';
 
 export enum ContextualMenuItemType {
@@ -20,7 +21,7 @@ export interface IContextualMenu {
 
 }
 
-export interface IContextualMenuProps extends React.Props<ContextualMenu> {
+export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWithResponsiveModeState {
   /**
    * Optional callback to access the IContextualMenu interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
@@ -82,7 +83,6 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu> {
 
   /**
    * If true then the beak is visible. If false it will not be shown.
-   * @default false
    */
   isBeakVisible?: boolean;
 
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index e926fb91054ba..f6fe27e6ff693 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -16,6 +16,7 @@ import {
   getDocument,
   getWindow
 } from '../../Utilities';
+import { withResponsiveMode, ResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
 import { Callout } from '../../Callout';
 import {
   Icon,
@@ -86,12 +87,12 @@ export function getSubmenuItems(item: IContextualMenuItem) {
   return item.subMenuProps ? item.subMenuProps.items : item.items;
 }
 
+@withResponsiveMode
 export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContextualMenuState> {
   // The default ContextualMenu properities have no items and beak, the default submenu direction is right and top.
   public static defaultProps = {
     items: [],
     shouldFocusOnMount: true,
-    isBeakVisible: false,
     gapSpace: 0,
     directionalHint: DirectionalHint.bottomAutoEdge,
     beakWidth: 16,
@@ -190,6 +191,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     let hasCheckmarks = !!(items && items.some(item => !!item.canCheck));
     const submenuProps = this.state.expandedMenuItemKey ? this._getSubmenuProps() : null;
 
+    isBeakVisible = isBeakVisible === undefined ? this.props.responsiveMode <= ResponsiveMode.medium : isBeakVisible;
     /**
      * When useTargetWidth is true, get the width of the target element and apply it for the context menu container
      */

From 31758bdedec783d4f74194713b2e0102529b70dd Mon Sep 17 00:00:00 2001
From: Boris Emorine <boris.emorine@gmail.com>
Date: Wed, 28 Jun 2017 14:30:24 -0700
Subject: [PATCH 0180/1641] SpinButton Minor Fixes (#2079)

* Implement color scheme in the ContextualMenu control to enable alternative theming.

* Implement the bar and unit tests and component page

* Revert "Implement color scheme in the ContextualMenu control to enable alternative theming."

This reverts commit 4f830cd8c55269368e73bfc6d0cd69430776b977.

* Don't render an empty icon for an icon-less header menu item.

* Revert "Implement Document Title Bar"

* Add delay before spinning

* Ensure functions have default implementations

* Add more tests for SpinButton

* Add change files
---
 ...mor-spinbutton-fixes_2017-06-28-21-09.json | 11 ++++
 ...mor-spinbutton-fixes_2017-06-28-21-09.json | 11 ++++
 ...mor-spinbutton-fixes_2017-06-28-21-09.json | 11 ++++
 ...mor-spinbutton-fixes_2017-06-28-21-09.json | 11 ++++
 ...mor-spinbutton-fixes_2017-06-28-21-09.json | 11 ++++
 .../components/SpinButton/SpinButton.test.tsx | 64 +++++++++++++++++++
 .../src/components/SpinButton/SpinButton.tsx  | 27 ++++----
 7 files changed, 133 insertions(+), 13 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/boemor-spinbutton-fixes_2017-06-28-21-09.json
 create mode 100644 common/changes/@uifabric/fabric-website/boemor-spinbutton-fixes_2017-06-28-21-09.json
 create mode 100644 common/changes/@uifabric/styling/boemor-spinbutton-fixes_2017-06-28-21-09.json
 create mode 100644 common/changes/@uifabric/utilities/boemor-spinbutton-fixes_2017-06-28-21-09.json
 create mode 100644 common/changes/office-ui-fabric-react/boemor-spinbutton-fixes_2017-06-28-21-09.json

diff --git a/common/changes/@uifabric/example-app-base/boemor-spinbutton-fixes_2017-06-28-21-09.json b/common/changes/@uifabric/example-app-base/boemor-spinbutton-fixes_2017-06-28-21-09.json
new file mode 100644
index 0000000000000..3d12a16377285
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/boemor-spinbutton-fixes_2017-06-28-21-09.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "boemor@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/boemor-spinbutton-fixes_2017-06-28-21-09.json b/common/changes/@uifabric/fabric-website/boemor-spinbutton-fixes_2017-06-28-21-09.json
new file mode 100644
index 0000000000000..308ec516e319d
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/boemor-spinbutton-fixes_2017-06-28-21-09.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "boemor@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/boemor-spinbutton-fixes_2017-06-28-21-09.json b/common/changes/@uifabric/styling/boemor-spinbutton-fixes_2017-06-28-21-09.json
new file mode 100644
index 0000000000000..02a1a60529f2b
--- /dev/null
+++ b/common/changes/@uifabric/styling/boemor-spinbutton-fixes_2017-06-28-21-09.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "boemor@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/boemor-spinbutton-fixes_2017-06-28-21-09.json b/common/changes/@uifabric/utilities/boemor-spinbutton-fixes_2017-06-28-21-09.json
new file mode 100644
index 0000000000000..9750319c49763
--- /dev/null
+++ b/common/changes/@uifabric/utilities/boemor-spinbutton-fixes_2017-06-28-21-09.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "boemor@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/boemor-spinbutton-fixes_2017-06-28-21-09.json b/common/changes/office-ui-fabric-react/boemor-spinbutton-fixes_2017-06-28-21-09.json
new file mode 100644
index 0000000000000..ad9661ba16ad8
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/boemor-spinbutton-fixes_2017-06-28-21-09.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "-SpinButton: Fix crash when not providing value nor defaultValue. - SpinButton: Add initial delay of 400ms when holding the up or down arrow before spinning",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "boemor@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
index 64d48a3cf5c17..55d284f31b3e6 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
@@ -508,6 +508,70 @@ describe('SpinButton', () => {
     expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(exampleNewValue));
   });
 
+  it('should use min as defaultvalue if neither value nor defaultValue are passed', () => {
+    const exampleLabelValue: string = 'SpinButton';
+    const exampleMinValue: number = 2;
+    const exampleMaxValue: number = 22;
+    const exampleDefaultValue: string = '12';
+    const exampleStepValue: number = 2;
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <SpinButton
+        label={ exampleLabelValue }
+        min={ exampleMinValue }
+        max={ exampleMaxValue }
+        step={ exampleStepValue }
+      />
+    );
+
+    // Assert on the input element.
+    const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
+
+    expect(inputDOM.value).to.equal(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(exampleMinValue));
+  });
+
+  it('should use 0 as defaultvalue if neither value, defaultValue nor min are passed', () => {
+    const exampleLabelValue: string = 'SpinButton';
+    const exampleDefaultValue: string = '12';
+    const exampleStepValue: number = 2;
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <SpinButton
+        label={ exampleLabelValue }
+      />
+    );
+
+    // Assert on the input element.
+    const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
+
+    expect(inputDOM.value).to.equal(String(0));
+    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(0));
+  });
+
+  it('should use the default onIncrement function when no value, defaultValue nor onIncrement function is passed', () => {
+    const exampleLabelValue: string = 'SpinButton';
+    const exampleDefaultValue: string = '12';
+    const exampleStepValue: number = 2;
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <SpinButton
+        label={ exampleLabelValue }
+      />
+    );
+
+    // Assert on the input element.
+    const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
+    const upButtonDOM: HTMLButtonElement = renderedDOM.getElementsByClassName('ms-UpButton')[0] as HTMLButtonElement;
+    ReactTestUtils.Simulate.mouseDown(upButtonDOM);
+    ReactTestUtils.Simulate.mouseUp(upButtonDOM);
+
+    expect(inputDOM.value).to.equal(String(1));
+    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(1));
+  });
+
   it('should stop spinning if text field is focused while actively spinning', () => {
     const exampleLabelValue: string = 'SpinButton';
     const exampleMinValue: number = 2;
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index 4e29fefbe90fb..159b3546758be 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -60,7 +60,8 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
   private _onDecrement?: (value: string) => string | void;
 
   private _currentStepFunctionHandle: number;
-  private _stepDelay = 100;
+  private _initialStepDelay = 400;
+  private _stepDelay = 75;
   private _formattedValidUnitOptions: string[] = [];
   private _arrowButtonStyle: React.CSSProperties = {
     icon: {
@@ -75,7 +76,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
       'value': 'defaultValue'
     });
 
-    let value = props.value || props.defaultValue || String(props.min);
+    let value = props.value || props.defaultValue || String(props.min) || '0';
     this._lastValidValue = value;
 
     this.state = {
@@ -88,14 +89,14 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
     this._inputId = getId('input');
     this._spinningByMouse = false;
 
-    if (props.defaultValue) {
-      this._onValidate = this._defaultOnValidate;
-      this._onIncrement = this._defaultOnIncrement;
-      this._onDecrement = this._defaultOnDecrement;
-    } else {
+    if (!props.defaultValue && props.value) {
       this._onValidate = props.onValidate;
       this._onIncrement = props.onIncrement;
       this._onDecrement = props.onDecrement;
+    } else {
+      this._onValidate = this._defaultOnValidate;
+      this._onIncrement = this._defaultOnIncrement;
+      this._onDecrement = this._defaultOnDecrement;
     }
 
     this.focus = this.focus.bind(this);
@@ -324,7 +325,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
    * @param stepFunction - function to use to step by
    */
   @autobind
-  private _updateValue(shouldSpin: boolean, stepFunction: (string) => string | void) {
+  private _updateValue(shouldSpin: boolean, stepDelay: number, stepFunction: (string) => string | void) {
     const newValue = stepFunction(this.state.value);
     if (newValue) {
       this._lastValidValue = newValue;
@@ -336,7 +337,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
     }
 
     if (shouldSpin) {
-      this._currentStepFunctionHandle = this._async.setTimeout(() => { this._updateValue(shouldSpin, stepFunction); }, this._stepDelay);
+      this._currentStepFunctionHandle = this._async.setTimeout(() => { this._updateValue(shouldSpin, this._stepDelay, stepFunction); }, stepDelay);
     }
   }
 
@@ -380,11 +381,11 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
     if (event.which === KeyCodes.up) {
 
       spinDirection = KeyboardSpinDirection.up;
-      this._updateValue(false /* shouldSpin */, this._onIncrement);
+      this._updateValue(false /* shouldSpin */, this._initialStepDelay, this._onIncrement);
     } else if (event.which === KeyCodes.down) {
 
       spinDirection = KeyboardSpinDirection.down;
-      this._updateValue(false /* shouldSpin */, this._onDecrement);
+      this._updateValue(false /* shouldSpin */, this._initialStepDelay, this._onDecrement);
     } else if (event.which === KeyCodes.enter) {
       event.currentTarget.blur();
       this.focus();
@@ -417,12 +418,12 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
 
   @autobind
   private _onIncrementMouseDown() {
-    this._updateValue(true /* shouldSpin */, this._onIncrement);
+    this._updateValue(true /* shouldSpin */, this._initialStepDelay, this._onIncrement);
   }
 
   @autobind
   private _onDecrementMouseDown() {
-    this._updateValue(true /* shouldSpin */, this._onDecrement);
+    this._updateValue(true /* shouldSpin */, this._initialStepDelay, this._onDecrement);
   }
 
 }
\ No newline at end of file

From 9468490bf9ae6b3185f8a5c2e40b439a93e5aeb6 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 28 Jun 2017 16:45:31 -0700
Subject: [PATCH 0181/1641] Ignoring visualtests and dist/css from the npm
 package.

---
 packages/office-ui-fabric-react/.npmignore | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/.npmignore b/packages/office-ui-fabric-react/.npmignore
index 4c286d0b2bc06..ab07adc6630a4 100644
--- a/packages/office-ui-fabric-react/.npmignore
+++ b/packages/office-ui-fabric-react/.npmignore
@@ -13,6 +13,7 @@ results
 *.build.log
 dist/*.stats.html
 dist/demo*.*
+dist/css
 gulpfile.js
 index.html
 jsconfig.json
@@ -26,4 +27,5 @@ tsd.json
 tslint.json
 typings
 webpack.config.js
-fabric-test*
\ No newline at end of file
+fabric-test*
+visualtests
\ No newline at end of file

From 5720ea897345a93668e50c9d5684359e5ecad48b Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 28 Jun 2017 17:01:41 -0700
Subject: [PATCH 0182/1641] Removing localstorage persistence from rtl helpers.
 (#2085)

* removing the localstorage persistence from rtl helper completely

* Adding change file.
---
 .../utilities/rtl-fix_2017-06-28-23-42.json   | 11 +++++
 packages/utilities/src/rtl.test.ts            |  8 ----
 packages/utilities/src/rtl.ts                 | 45 +++++--------------
 3 files changed, 21 insertions(+), 43 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/rtl-fix_2017-06-28-23-42.json

diff --git a/common/changes/@uifabric/utilities/rtl-fix_2017-06-28-23-42.json b/common/changes/@uifabric/utilities/rtl-fix_2017-06-28-23-42.json
new file mode 100644
index 0000000000000..096cf7185d9b5
--- /dev/null
+++ b/common/changes/@uifabric/utilities/rtl-fix_2017-06-28-23-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Removing localstorage persistence for rtl helpers.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/src/rtl.test.ts b/packages/utilities/src/rtl.test.ts
index d8fa693c97611..a41a5847db8ad 100644
--- a/packages/utilities/src/rtl.test.ts
+++ b/packages/utilities/src/rtl.test.ts
@@ -16,12 +16,4 @@ describe('rtl', () => {
     setSSR(false);
   });
 
-  it('can throw when setting a value on the server without setRTL called', () => {
-    setSSR(true);
-
-    setRTL(undefined);
-    expect(getRTL).throws();
-
-    setSSR(false);
-  });
 });
diff --git a/packages/utilities/src/rtl.ts b/packages/utilities/src/rtl.ts
index f5dbb976fffec..f031b8663827e 100644
--- a/packages/utilities/src/rtl.ts
+++ b/packages/utilities/src/rtl.ts
@@ -1,5 +1,5 @@
 import { KeyCodes } from './KeyCodes';
-import { getDocument, getWindow } from './dom';
+import { getDocument } from './dom';
 
 // Default to undefined so that we initialize on first read.
 let _isRTL: boolean | undefined;
@@ -8,52 +8,27 @@ let _isRTL: boolean | undefined;
  * Gets the rtl state of the page (returns true if in rtl.)
  */
 export function getRTL(): boolean {
-  if (_isRTL === undefined) {
-    let doc = getDocument();
-    let win = getWindow();
-
-    // tslint:disable-next-line:no-string-literal
-    if (win && win['localStorage']) {
-      let savedRTL = localStorage.getItem('isRTL');
+  let isRTL: boolean = _isRTL as boolean;
 
-      if (savedRTL !== null) {
-        _isRTL = savedRTL === '1';
-      }
-    }
-    if (_isRTL === undefined && doc) {
-      _isRTL = doc.documentElement.getAttribute('dir') === 'rtl';
-    }
+  if (isRTL === undefined) {
+    let doc = getDocument();
 
-    if (_isRTL !== undefined) {
-      setRTL(_isRTL, true);
-    } else {
-      throw new Error(
-        'getRTL was called in a server environment without setRTL being called first. ' +
-        'Call setRTL to set the correct direction first.'
-      );
+    if (doc && doc.documentElement) {
+      isRTL = doc.documentElement.getAttribute('dir') === 'rtl';
     }
   }
 
-  return _isRTL;
+  return isRTL;
 }
 
 /**
  * Sets the rtl state of the page (by adjusting the dir attribute of the html element.)
  */
-export function setRTL(isRTL: boolean | undefined, avoidPersisting = false) {
+export function setRTL(isRTL: boolean) {
   let doc = getDocument();
-  if (doc) {
-    doc.documentElement.setAttribute('dir', isRTL ? 'rtl' : 'ltr');
-  }
 
-  let win = getWindow();
-  // tslint:disable-next-line:no-string-literal
-  if (win && win['localStorage'] && !avoidPersisting) {
-    try {
-      localStorage.setItem('isRTL', isRTL ? '1' : '0');
-    } catch (e) {
-      /*  swallow the exception, because safari private mode does not have local storage */
-    }
+  if (doc && doc.documentElement) {
+    doc.documentElement.setAttribute('dir', isRTL ? 'rtl' : 'ltr');
   }
 
   _isRTL = isRTL;

From b291aa138ed25079eea76244e64384a2cdbafa4f Mon Sep 17 00:00:00 2001
From: "P.J. Swesey" <swese44@gmail.com>
Date: Wed, 28 Jun 2017 23:35:00 -0700
Subject: [PATCH 0183/1641] Orange (#2088)

* Persona: Fix orange initials rendered as green

* changes.json
---
 .../example-app-base/orange_2017-06-29-00-54.json     | 11 +++++++++++
 .../fabric-website/orange_2017-06-29-00-54.json       | 11 +++++++++++
 .../@uifabric/styling/orange_2017-06-29-00-54.json    | 11 +++++++++++
 .../@uifabric/utilities/orange_2017-06-29-00-54.json  | 11 +++++++++++
 .../orange_2017-06-29-00-54.json                      | 11 +++++++++++
 .../src/components/Persona/PersonaConsts.ts           |  2 +-
 6 files changed, 56 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/example-app-base/orange_2017-06-29-00-54.json
 create mode 100644 common/changes/@uifabric/fabric-website/orange_2017-06-29-00-54.json
 create mode 100644 common/changes/@uifabric/styling/orange_2017-06-29-00-54.json
 create mode 100644 common/changes/@uifabric/utilities/orange_2017-06-29-00-54.json
 create mode 100644 common/changes/office-ui-fabric-react/orange_2017-06-29-00-54.json

diff --git a/common/changes/@uifabric/example-app-base/orange_2017-06-29-00-54.json b/common/changes/@uifabric/example-app-base/orange_2017-06-29-00-54.json
new file mode 100644
index 0000000000000..bd9a91e89024f
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/orange_2017-06-29-00-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "pjsw@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/orange_2017-06-29-00-54.json b/common/changes/@uifabric/fabric-website/orange_2017-06-29-00-54.json
new file mode 100644
index 0000000000000..144a6a617811b
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/orange_2017-06-29-00-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "pjsw@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/orange_2017-06-29-00-54.json b/common/changes/@uifabric/styling/orange_2017-06-29-00-54.json
new file mode 100644
index 0000000000000..1c0c1b08ec5d5
--- /dev/null
+++ b/common/changes/@uifabric/styling/orange_2017-06-29-00-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "pjsw@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/orange_2017-06-29-00-54.json b/common/changes/@uifabric/utilities/orange_2017-06-29-00-54.json
new file mode 100644
index 0000000000000..4b89e9722e4b0
--- /dev/null
+++ b/common/changes/@uifabric/utilities/orange_2017-06-29-00-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "pjsw@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/orange_2017-06-29-00-54.json b/common/changes/office-ui-fabric-react/orange_2017-06-29-00-54.json
new file mode 100644
index 0000000000000..21ba404b15202
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/orange_2017-06-29-00-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Persona: Fix orange initials rendered as green",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "pjsw@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts b/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
index c797258be7950..12fd086d21ba7 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
@@ -39,7 +39,7 @@ export const PERSONA_INITIALS_COLOR = {
   [PersonaInitialsColor.magenta]: 'ms-Persona-initials--magenta ' + styles.initialsIsMagenta,
   [PersonaInitialsColor.purple]: 'ms-Persona-initials--purple ' + styles.initialsIsPurple,
   [PersonaInitialsColor.black]: 'ms-Persona-initials--black ' + styles.initialsIsBlack,
-  [PersonaInitialsColor.orange]: 'ms-Persona-initials--orange ' + styles.initialsIsGreen,
+  [PersonaInitialsColor.orange]: 'ms-Persona-initials--orange ' + styles.initialsIsOrange,
   [PersonaInitialsColor.red]: 'ms-Persona-initials--red ' + styles.initialsIsRed,
   [PersonaInitialsColor.darkRed]: 'ms-Persona-initials--darkRed ' + styles.initialsIsDarkRed
 };
\ No newline at end of file

From b3a079f797926a0eb196ca59cff840d912e54f1e Mon Sep 17 00:00:00 2001
From: akashperfect <akashperfect@gmail.com>
Date: Thu, 29 Jun 2017 12:05:35 +0530
Subject: [PATCH 0184/1641] Adding CSS to fix long words getting out of focus
 (#2089)

Adding css styling to break a long word added as subtext in Dialog box in order to break word over multiple lines instead of getting a horizontal bar or out of view.
---
 .../office-ui-fabric-react/src/components/Dialog/Dialog.scss     | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.scss b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.scss
index a0e44ffba3c64..aaebc582a2d50 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.scss
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.scss
@@ -80,6 +80,7 @@ $Dialog-default-max-width: 340px;
   color: $ms-color-neutralPrimary;
   font-weight: $ms-font-weight-semilight;
   line-height: 1.5;
+  word-wrap: break-word;
 }
 
 .actions {

From 21689eaf74f8513ae51854a7e1dadb90821ae9d8 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Wed, 28 Jun 2017 23:36:14 -0700
Subject: [PATCH 0185/1641] Jspurlin/combo box fix (#2086)

* Fix: Combobox: text move its position in Edge during up/down arrow #2020: https://github.com/OfficeDev/office-ui-fabric-react/issues/2020

The comboBox wrapper needs box-sizing: content-box

* actually, the box-sizing can be on root

* adding change files

* Remove incorrect change files
---
 .../jspurlin-ComboBoxFix_2017-06-29-00-03.json        | 11 +++++++++++
 .../jspurlin-ComboBoxFix_2017-06-29-00-03.json        | 11 +++++++++++
 .../jspurlin-ComboBoxFix_2017-06-29-00-03.json        | 11 +++++++++++
 .../jspurlin-ComboBoxFix_2017-06-29-00-03.json        | 11 +++++++++++
 .../jspurlin-ComboBoxFix_2017-06-29-00-03.json        | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.scss             |  3 +--
 6 files changed, 56 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/jspurlin-ComboBoxFix_2017-06-29-00-03.json
 create mode 100644 common/changes/@uifabric/fabric-website/jspurlin-ComboBoxFix_2017-06-29-00-03.json
 create mode 100644 common/changes/@uifabric/styling/jspurlin-ComboBoxFix_2017-06-29-00-03.json
 create mode 100644 common/changes/@uifabric/utilities/jspurlin-ComboBoxFix_2017-06-29-00-03.json
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxFix_2017-06-29-00-03.json

diff --git a/common/changes/@uifabric/example-app-base/jspurlin-ComboBoxFix_2017-06-29-00-03.json b/common/changes/@uifabric/example-app-base/jspurlin-ComboBoxFix_2017-06-29-00-03.json
new file mode 100644
index 0000000000000..f982888ed04aa
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/jspurlin-ComboBoxFix_2017-06-29-00-03.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/jspurlin-ComboBoxFix_2017-06-29-00-03.json b/common/changes/@uifabric/fabric-website/jspurlin-ComboBoxFix_2017-06-29-00-03.json
new file mode 100644
index 0000000000000..7d8a12b6371b6
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/jspurlin-ComboBoxFix_2017-06-29-00-03.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/jspurlin-ComboBoxFix_2017-06-29-00-03.json b/common/changes/@uifabric/styling/jspurlin-ComboBoxFix_2017-06-29-00-03.json
new file mode 100644
index 0000000000000..b97431956ffe2
--- /dev/null
+++ b/common/changes/@uifabric/styling/jspurlin-ComboBoxFix_2017-06-29-00-03.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/jspurlin-ComboBoxFix_2017-06-29-00-03.json b/common/changes/@uifabric/utilities/jspurlin-ComboBoxFix_2017-06-29-00-03.json
new file mode 100644
index 0000000000000..1623cfd4ac106
--- /dev/null
+++ b/common/changes/@uifabric/utilities/jspurlin-ComboBoxFix_2017-06-29-00-03.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxFix_2017-06-29-00-03.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxFix_2017-06-29-00-03.json
new file mode 100644
index 0000000000000..28e86cb4ed07a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxFix_2017-06-29-00-03.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix: Combobox: text move its position in Edge during up/down arrow #2020: https://github.com/OfficeDev/office-ui-fabric-react/issues/2020",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.scss b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.scss
index f0d015f3c55ad..625dc559ece14 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.scss
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.scss
@@ -53,8 +53,7 @@ $ComboBox-item-height: 36px;
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
-
-
+  box-sizing: content-box;
 
   &:hover,
   &.focused {

From 1ac5cc109ab14817cf1b968cb899997de4106b56 Mon Sep 17 00:00:00 2001
From: Joe Martella <martellaj@live.com>
Date: Wed, 28 Jun 2017 23:38:22 -0700
Subject: [PATCH 0186/1641] Force resolve picker on blur or delayed response
 (#2075)

* Force resolve picker on blur or delayed response.

* Adds change file.
---
 .../joem-people-picker_2017-06-27-14-50.json  | 11 ++++++++
 .../src/components/pickers/BasePicker.tsx     | 27 +++++++++++++++++--
 2 files changed, 36 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/joem-people-picker_2017-06-27-14-50.json

diff --git a/common/changes/office-ui-fabric-react/joem-people-picker_2017-06-27-14-50.json b/common/changes/office-ui-fabric-react/joem-people-picker_2017-06-27-14-50.json
new file mode 100644
index 0000000000000..2c150486519f6
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/joem-people-picker_2017-06-27-14-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Force resolve picker on blue or delayed response.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joem@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 8545af55d27e4..060a2e3c0f148 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -105,7 +105,8 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
         className={ css(
           'ms-BasePicker',
           className ? className : '') }
-        onKeyDown={ this.onKeyDown }>
+        onKeyDown={ this.onKeyDown }
+        onBlur={ this.onBlur } >
         <FocusZone
           ref={ this._resolveRef('focusZone') }
           direction={ FocusZoneDirection.bidirectional }
@@ -284,6 +285,16 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
       suggestedDisplayValue: itemValue,
       suggestionsVisible: this.input.value !== '' && this.input.inputElement === document.activeElement
     });
+
+    /**
+     * If user exits the input box before suggestions are returned,
+     * select the first result upon promise resolution, if a suggestion
+     * is available.
+     */
+    if (this.suggestionStore.hasSelectedSuggestion() &&
+      this.input.inputElement !== document.activeElement) {
+      this.addItemByIndex(0);
+    }
   }
 
   protected onChange() {
@@ -292,6 +303,17 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     }
   }
 
+  /**
+   * Select the first suggestion if one is available when user leaves
+   * the input area.
+   */
+  @autobind
+  protected onBlur() {
+    if (this.suggestionStore.hasSelectedSuggestion()) {
+      this.addItemByIndex(0);
+    }
+  }
+
   @autobind
   protected onInputChange(value: string) {
     this.updateValue(value);
@@ -514,7 +536,8 @@ export class BasePickerListBelow<T, P extends IBasePickerProps<T>> extends BaseP
       <div>
         <div ref={ this._resolveRef('root') }
           className={ css('ms-BasePicker', className ? className : '') }
-          onKeyDown={ this.onKeyDown }>
+          onKeyDown={ this.onKeyDown }
+          onBlur={ this.onBlur } >
           <SelectionZone selection={ this.selection }
             selectionMode={ SelectionMode.multiple }>
             <div className={ css('ms-BasePicker-text', styles.pickerText) }>

From 5fef97b42078fb19a1168127aa23acfee1b254aa Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 29 Jun 2017 10:13:16 +0000
Subject: [PATCH 0187/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...mmadBar-callout-beak_2017-06-22-22-05.json | 11 -----
 ...mor-spinbutton-fixes_2017-06-28-21-09.json | 11 -----
 ...jspurlin-ComboBoxFix_2017-06-29-00-03.json | 11 -----
 .../orange_2017-06-29-00-54.json              | 11 -----
 ...mmadBar-callout-beak_2017-06-22-22-05.json | 11 -----
 ...mor-spinbutton-fixes_2017-06-28-21-09.json | 11 -----
 ...jspurlin-ComboBoxFix_2017-06-29-00-03.json | 11 -----
 .../orange_2017-06-29-00-54.json              | 11 -----
 ...mmadBar-callout-beak_2017-06-22-22-05.json | 11 -----
 ...mor-spinbutton-fixes_2017-06-28-21-09.json | 11 -----
 ...jspurlin-ComboBoxFix_2017-06-29-00-03.json | 11 -----
 .../styling/orange_2017-06-29-00-54.json      | 11 -----
 ...mmadBar-callout-beak_2017-06-22-22-05.json | 11 -----
 ...mor-spinbutton-fixes_2017-06-28-21-09.json | 11 -----
 ...jspurlin-ComboBoxFix_2017-06-29-00-03.json | 11 -----
 .../utilities/orange_2017-06-29-00-54.json    | 11 -----
 .../utilities/rtl-fix_2017-06-28-23-42.json   | 11 -----
 ...mmadBar-callout-beak_2017-06-22-22-05.json | 11 -----
 ...mor-spinbutton-fixes_2017-06-28-21-09.json | 11 -----
 .../joem-people-picker_2017-06-27-14-50.json  | 11 -----
 ...jspurlin-ComboBoxFix_2017-06-29-00-03.json | 11 -----
 .../orange_2017-06-29-00-54.json              | 11 -----
 packages/example-app-base/package.json        |  4 +-
 packages/example-component/package.json       |  6 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 42 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 13 +++++-
 packages/office-ui-fabric-react/package.json  |  6 +--
 packages/styling/CHANGELOG.json               | 12 ++++++
 packages/styling/CHANGELOG.md                 |  7 +++-
 packages/styling/package.json                 |  4 +-
 packages/utilities/CHANGELOG.json             | 14 +++++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  2 +-
 37 files changed, 109 insertions(+), 260 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/anihan-commadBar-callout-beak_2017-06-22-22-05.json
 delete mode 100644 common/changes/@uifabric/example-app-base/boemor-spinbutton-fixes_2017-06-28-21-09.json
 delete mode 100644 common/changes/@uifabric/example-app-base/jspurlin-ComboBoxFix_2017-06-29-00-03.json
 delete mode 100644 common/changes/@uifabric/example-app-base/orange_2017-06-29-00-54.json
 delete mode 100644 common/changes/@uifabric/fabric-website/anihan-commadBar-callout-beak_2017-06-22-22-05.json
 delete mode 100644 common/changes/@uifabric/fabric-website/boemor-spinbutton-fixes_2017-06-28-21-09.json
 delete mode 100644 common/changes/@uifabric/fabric-website/jspurlin-ComboBoxFix_2017-06-29-00-03.json
 delete mode 100644 common/changes/@uifabric/fabric-website/orange_2017-06-29-00-54.json
 delete mode 100644 common/changes/@uifabric/styling/anihan-commadBar-callout-beak_2017-06-22-22-05.json
 delete mode 100644 common/changes/@uifabric/styling/boemor-spinbutton-fixes_2017-06-28-21-09.json
 delete mode 100644 common/changes/@uifabric/styling/jspurlin-ComboBoxFix_2017-06-29-00-03.json
 delete mode 100644 common/changes/@uifabric/styling/orange_2017-06-29-00-54.json
 delete mode 100644 common/changes/@uifabric/utilities/anihan-commadBar-callout-beak_2017-06-22-22-05.json
 delete mode 100644 common/changes/@uifabric/utilities/boemor-spinbutton-fixes_2017-06-28-21-09.json
 delete mode 100644 common/changes/@uifabric/utilities/jspurlin-ComboBoxFix_2017-06-29-00-03.json
 delete mode 100644 common/changes/@uifabric/utilities/orange_2017-06-29-00-54.json
 delete mode 100644 common/changes/@uifabric/utilities/rtl-fix_2017-06-28-23-42.json
 delete mode 100644 common/changes/office-ui-fabric-react/anihan-commadBar-callout-beak_2017-06-22-22-05.json
 delete mode 100644 common/changes/office-ui-fabric-react/boemor-spinbutton-fixes_2017-06-28-21-09.json
 delete mode 100644 common/changes/office-ui-fabric-react/joem-people-picker_2017-06-27-14-50.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxFix_2017-06-29-00-03.json
 delete mode 100644 common/changes/office-ui-fabric-react/orange_2017-06-29-00-54.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index e77bcb00efbbd..a357ebe5dce5b 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -48,7 +48,7 @@
   },
   "dependencies": {
     "@uifabric/example-app-base": "4.0.1",
-    "@uifabric/utilities": ">=4.4.1 <5.0.0",
+    "@uifabric/utilities": ">=4.4.2 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index f8144830521e3..c2bfd06c36986 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.11.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.12.1 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 789cc47a68e88..68645fc307a56 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.11.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.12.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 11fd60c17476d..2847151e6d852 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.11.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.12.1 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/@uifabric/example-app-base/anihan-commadBar-callout-beak_2017-06-22-22-05.json b/common/changes/@uifabric/example-app-base/anihan-commadBar-callout-beak_2017-06-22-22-05.json
deleted file mode 100644
index fa53882beab0f..0000000000000
--- a/common/changes/@uifabric/example-app-base/anihan-commadBar-callout-beak_2017-06-22-22-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "anihan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/boemor-spinbutton-fixes_2017-06-28-21-09.json b/common/changes/@uifabric/example-app-base/boemor-spinbutton-fixes_2017-06-28-21-09.json
deleted file mode 100644
index 3d12a16377285..0000000000000
--- a/common/changes/@uifabric/example-app-base/boemor-spinbutton-fixes_2017-06-28-21-09.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "boemor@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/jspurlin-ComboBoxFix_2017-06-29-00-03.json b/common/changes/@uifabric/example-app-base/jspurlin-ComboBoxFix_2017-06-29-00-03.json
deleted file mode 100644
index f982888ed04aa..0000000000000
--- a/common/changes/@uifabric/example-app-base/jspurlin-ComboBoxFix_2017-06-29-00-03.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/orange_2017-06-29-00-54.json b/common/changes/@uifabric/example-app-base/orange_2017-06-29-00-54.json
deleted file mode 100644
index bd9a91e89024f..0000000000000
--- a/common/changes/@uifabric/example-app-base/orange_2017-06-29-00-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "pjsw@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/anihan-commadBar-callout-beak_2017-06-22-22-05.json b/common/changes/@uifabric/fabric-website/anihan-commadBar-callout-beak_2017-06-22-22-05.json
deleted file mode 100644
index a7a946702dea0..0000000000000
--- a/common/changes/@uifabric/fabric-website/anihan-commadBar-callout-beak_2017-06-22-22-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "anihan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/boemor-spinbutton-fixes_2017-06-28-21-09.json b/common/changes/@uifabric/fabric-website/boemor-spinbutton-fixes_2017-06-28-21-09.json
deleted file mode 100644
index 308ec516e319d..0000000000000
--- a/common/changes/@uifabric/fabric-website/boemor-spinbutton-fixes_2017-06-28-21-09.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "boemor@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/jspurlin-ComboBoxFix_2017-06-29-00-03.json b/common/changes/@uifabric/fabric-website/jspurlin-ComboBoxFix_2017-06-29-00-03.json
deleted file mode 100644
index 7d8a12b6371b6..0000000000000
--- a/common/changes/@uifabric/fabric-website/jspurlin-ComboBoxFix_2017-06-29-00-03.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/orange_2017-06-29-00-54.json b/common/changes/@uifabric/fabric-website/orange_2017-06-29-00-54.json
deleted file mode 100644
index 144a6a617811b..0000000000000
--- a/common/changes/@uifabric/fabric-website/orange_2017-06-29-00-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "pjsw@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/anihan-commadBar-callout-beak_2017-06-22-22-05.json b/common/changes/@uifabric/styling/anihan-commadBar-callout-beak_2017-06-22-22-05.json
deleted file mode 100644
index a97fc36c90b66..0000000000000
--- a/common/changes/@uifabric/styling/anihan-commadBar-callout-beak_2017-06-22-22-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "anihan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/boemor-spinbutton-fixes_2017-06-28-21-09.json b/common/changes/@uifabric/styling/boemor-spinbutton-fixes_2017-06-28-21-09.json
deleted file mode 100644
index 02a1a60529f2b..0000000000000
--- a/common/changes/@uifabric/styling/boemor-spinbutton-fixes_2017-06-28-21-09.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "boemor@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/jspurlin-ComboBoxFix_2017-06-29-00-03.json b/common/changes/@uifabric/styling/jspurlin-ComboBoxFix_2017-06-29-00-03.json
deleted file mode 100644
index b97431956ffe2..0000000000000
--- a/common/changes/@uifabric/styling/jspurlin-ComboBoxFix_2017-06-29-00-03.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/orange_2017-06-29-00-54.json b/common/changes/@uifabric/styling/orange_2017-06-29-00-54.json
deleted file mode 100644
index 1c0c1b08ec5d5..0000000000000
--- a/common/changes/@uifabric/styling/orange_2017-06-29-00-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "pjsw@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/anihan-commadBar-callout-beak_2017-06-22-22-05.json b/common/changes/@uifabric/utilities/anihan-commadBar-callout-beak_2017-06-22-22-05.json
deleted file mode 100644
index faf4dbcc11174..0000000000000
--- a/common/changes/@uifabric/utilities/anihan-commadBar-callout-beak_2017-06-22-22-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "anihan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/boemor-spinbutton-fixes_2017-06-28-21-09.json b/common/changes/@uifabric/utilities/boemor-spinbutton-fixes_2017-06-28-21-09.json
deleted file mode 100644
index 9750319c49763..0000000000000
--- a/common/changes/@uifabric/utilities/boemor-spinbutton-fixes_2017-06-28-21-09.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "boemor@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/jspurlin-ComboBoxFix_2017-06-29-00-03.json b/common/changes/@uifabric/utilities/jspurlin-ComboBoxFix_2017-06-29-00-03.json
deleted file mode 100644
index 1623cfd4ac106..0000000000000
--- a/common/changes/@uifabric/utilities/jspurlin-ComboBoxFix_2017-06-29-00-03.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/orange_2017-06-29-00-54.json b/common/changes/@uifabric/utilities/orange_2017-06-29-00-54.json
deleted file mode 100644
index 4b89e9722e4b0..0000000000000
--- a/common/changes/@uifabric/utilities/orange_2017-06-29-00-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "pjsw@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/rtl-fix_2017-06-28-23-42.json b/common/changes/@uifabric/utilities/rtl-fix_2017-06-28-23-42.json
deleted file mode 100644
index 096cf7185d9b5..0000000000000
--- a/common/changes/@uifabric/utilities/rtl-fix_2017-06-28-23-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Removing localstorage persistence for rtl helpers.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/anihan-commadBar-callout-beak_2017-06-22-22-05.json b/common/changes/office-ui-fabric-react/anihan-commadBar-callout-beak_2017-06-22-22-05.json
deleted file mode 100644
index 247b4ef2d79fd..0000000000000
--- a/common/changes/office-ui-fabric-react/anihan-commadBar-callout-beak_2017-06-22-22-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Remove beak from CommandBar's and BaseButton's contextual menu",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "anihan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/boemor-spinbutton-fixes_2017-06-28-21-09.json b/common/changes/office-ui-fabric-react/boemor-spinbutton-fixes_2017-06-28-21-09.json
deleted file mode 100644
index ad9661ba16ad8..0000000000000
--- a/common/changes/office-ui-fabric-react/boemor-spinbutton-fixes_2017-06-28-21-09.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "-SpinButton: Fix crash when not providing value nor defaultValue. - SpinButton: Add initial delay of 400ms when holding the up or down arrow before spinning",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "boemor@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/joem-people-picker_2017-06-27-14-50.json b/common/changes/office-ui-fabric-react/joem-people-picker_2017-06-27-14-50.json
deleted file mode 100644
index 2c150486519f6..0000000000000
--- a/common/changes/office-ui-fabric-react/joem-people-picker_2017-06-27-14-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Force resolve picker on blue or delayed response.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joem@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxFix_2017-06-29-00-03.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxFix_2017-06-29-00-03.json
deleted file mode 100644
index 28e86cb4ed07a..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxFix_2017-06-29-00-03.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix: Combobox: text move its position in Edge during up/down arrow #2020: https://github.com/OfficeDev/office-ui-fabric-react/issues/2020",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/orange_2017-06-29-00-54.json b/common/changes/office-ui-fabric-react/orange_2017-06-29-00-54.json
deleted file mode 100644
index 21ba404b15202..0000000000000
--- a/common/changes/office-ui-fabric-react/orange_2017-06-29-00-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Persona: Fix orange initials rendered as green",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "pjsw@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index adb20d91424e1..956d49c276cdd 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -47,8 +47,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.11.7 <1.0.0",
-    "@uifabric/utilities": ">=4.4.1 <5.0.0",
+    "@uifabric/styling": ">=0.11.8 <1.0.0",
+    "@uifabric/utilities": ">=4.4.2 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.4.0 <5.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 52c23cdc9eca2..77ae78cce8e19 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-component",
-  "version": "1.0.38",
+  "version": "1.0.39",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -22,7 +22,7 @@
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
     "@uifabric/example-app-base": "4.0.1",
-    "@uifabric/utilities": "4.4.1",
+    "@uifabric/utilities": "4.4.2",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.12.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.12.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 086cce4279e94..9e51e8174d179 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,48 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.12.1",
+      "tag": "office-ui-fabric-react_v4.12.1",
+      "date": "Thu, 29 Jun 2017 10:13:16 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Aniket Handa <atneik@users.noreply.github.com>",
+            "commit": "76601ad312613034f48799b43499de56c0e6863b",
+            "comment": "Remove beak from CommandBar's and BaseButton's contextual menu"
+          },
+          {
+            "author": "Boris Emorine <boris.emorine@gmail.com>",
+            "commit": "31758bdedec783d4f74194713b2e0102529b70dd",
+            "comment": "-SpinButton: Fix crash when not providing value nor defaultValue. - SpinButton: Add initial delay of 400ms when holding the up or down arrow before spinning"
+          },
+          {
+            "author": "Joe Martella <martellaj@live.com>",
+            "commit": "1ac5cc109ab14817cf1b968cb899997de4106b56",
+            "comment": "Force resolve picker on blue or delayed response."
+          },
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "21689eaf74f8513ae51854a7e1dadb90821ae9d8",
+            "comment": "Fix: Combobox: text move its position in Edge during up/down arrow #2020: https://github.com/OfficeDev/office-ui-fabric-react/issues/2020"
+          },
+          {
+            "author": "P.J. Swesey <swese44@gmail.com>",
+            "commit": "b291aa138ed25079eea76244e64384a2cdbafa4f",
+            "comment": "Persona: Fix orange initials rendered as green"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.4.1 <5.0.0` to `>=4.4.2 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.11.7 <1.0.0` to `>=0.11.8 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.12.0",
       "tag": "office-ui-fabric-react_v4.12.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index d28f0f7edcba3..e3b34e72e1d3a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 28 Jun 2017 10:12:04 GMT and should not be manually modified.
+This log was last generated on Thu, 29 Jun 2017 10:13:16 GMT and should not be manually modified.
+
+## 4.12.1
+Thu, 29 Jun 2017 10:13:16 GMT
+
+### Patches
+
+- Remove beak from CommandBar's and BaseButton's contextual menu
+- -SpinButton: Fix crash when not providing value nor defaultValue. - SpinButton: Add initial delay of 400ms when holding the up or down arrow before spinning
+- Force resolve picker on blue or delayed response.
+- Fix: Combobox: text move its position in Edge during up/down arrow #2020: https://github.com/OfficeDev/office-ui-fabric-react/issues/2020
+- Persona: Fix orange initials rendered as green
 
 ## 4.12.0
 Wed, 28 Jun 2017 10:12:04 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 7f72d1d064273..bea2a1940be7a 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.12.0",
+  "version": "4.12.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -71,8 +71,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.4.1 <5.0.0",
-    "@uifabric/styling": ">=0.11.7 <1.0.0",
+    "@uifabric/utilities": ">=4.4.2 <5.0.0",
+    "@uifabric/styling": ">=0.11.8 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index e95b3b5886cd1..99a425209b2f4 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,18 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.11.8",
+      "tag": "@uifabric/styling_v0.11.8",
+      "date": "Thu, 29 Jun 2017 10:13:16 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.4.1 <5.0.0` to `>=4.4.2 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.11.7",
       "tag": "@uifabric/styling_v0.11.7",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index c7aceece04680..66031249db454 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Wed, 28 Jun 2017 10:12:04 GMT and should not be manually modified.
+This log was last generated on Thu, 29 Jun 2017 10:13:16 GMT and should not be manually modified.
+
+## 0.11.8
+Thu, 29 Jun 2017 10:13:16 GMT
+
+*Changes not tracked*
 
 ## 0.11.7
 Wed, 28 Jun 2017 10:12:04 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 592433ffd5eb5..7b136a3a0805e 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.11.7",
+  "version": "0.11.8",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.4.1 <5.0.0",
+    "@uifabric/utilities": ">=4.4.2 <5.0.0",
     "tslib": "^1.6.0",
     "rtl-css-js": "^1.1.1",
     "glamor": "^2.20.24"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index b05f18cd8f7b3..7212d17ed2fb7 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.4.2",
+      "tag": "@uifabric/utilities_v4.4.2",
+      "date": "Thu, 29 Jun 2017 10:13:16 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "5720ea897345a93668e50c9d5684359e5ecad48b",
+            "comment": "Removing localstorage persistence for rtl helpers."
+          }
+        ]
+      }
+    },
     {
       "version": "4.4.1",
       "tag": "@uifabric/utilities_v4.4.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 021714f5dc979..df88fac4fb77f 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Tue, 27 Jun 2017 01:26:31 GMT and should not be manually modified.
+This log was last generated on Thu, 29 Jun 2017 10:13:16 GMT and should not be manually modified.
+
+## 4.4.2
+Thu, 29 Jun 2017 10:13:16 GMT
+
+### Patches
+
+- Removing localstorage persistence for rtl helpers.
 
 ## 4.4.1
 Tue, 27 Jun 2017 01:26:31 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 2c0a87574d10d..3e38bfc2318d1 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.4.1",
+  "version": "4.4.2",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 1df26a8f1b5c02da41f36b1f4f20003ab20671d0 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Thu, 29 Jun 2017 06:51:19 -0700
Subject: [PATCH 0188/1641] New Component: Swatch Color Picker (#2063)

* Initial Commit of adding the color picker (SwatchPicker)

* commiting a new working copy so that I can pull the new combBox changes

* A few minor updates to make sure everything is at a good state

* Add new grid utility

* add a state class

* actually it should be an interface

* Update the path for the grid component

* Adding new functionality

* Committing some improvements that have been made along with the mucking but we are still in a good state

* Attempt to utilize the built in button functionality for the "menu" aspect of this component... didn't really work out since button wants to maintain its own onToggleMenu which the containing component can't get to and it causes the two states to potentially get out of sync... and hard to maintain

* Add the ability for a button to look like a menu button without having to pass in menuProps

* fix the styling for menu items and hook up the icon for menu items

* fix how the size of the set is being calculated

* clean up a little css

* add hover callback and disabled state. STILL NEED TO ADD DISABLED STYLING

* also, add the props

* Convert the color picker to use a contextual menu instead of a callout

* add initial hover/focused states and add an additional example

* combine a lot of the shared logic for clearing the colors

* added disabled functionality

* Add comments and remove an unneeded file

* rename to swatch color picker and move to it's own folder. NOTE, styling is busted at the moment

* trying to get the new demo page working...

* fix a typo to get the demo page to load

* fix the styling

* make the button not translate on active

* update the wrapping div so that it hugs the contents (ther was an issue in RTL)

* add menu item click behavior and fix a bug around clicking the button when we have live preview

* get unit tests written and looking good

* Addressing PR feedback

* Removed an unneeded check for setting the selectedIndex in componentWillReceiveProps

* Some updates from feedback to rename a few props in SwatchColorPicker and updated/remove a few variables from Grid

* adding one missed prop rename

* Update the callbacks to take an id as well as the color

* Update how the matrix is created for the grid and push getting the grid size up one function to remove a cross fuction variable

* Converting the rendering functions to components

* Move rendering of an option to a private component

* Make the use of undefined vs null consistent, moved toMatrix into untilities, and updated unit tests

* update the casing on the grid import path

* Pull setting of the option porops into an if check to make it more concise

* fix some spacing tslint errors

* Add documentation to private interfaces

* Fix a typo and change a bool compare ternary to use toString
---
 .../src/components/App/AppState.tsx           |   6 +
 .../SwatchColorPickerComponentPage.tsx        |  33 +
 ...in-SimpleColorPicker_2017-06-27-01-50.json |  11 +
 ...in-SimpleColorPicker_2017-06-27-01-50.json |  11 +
 ...in-SimpleColorPicker_2017-06-27-01-50.json |  11 +
 ...in-SimpleColorPicker_2017-06-27-01-50.json |  11 +
 ...in-SimpleColorPicker_2017-06-27-01-50.json |  11 +
 packages/office-ui-fabric-react/src/Grid.ts   |   1 +
 .../src/SwatchColorPicker.ts                  |   1 +
 .../src/components/Button/BaseButton.tsx      |   3 +-
 .../src/components/Button/Button.test.tsx     |  15 +
 .../ContextualMenu/ContextualMenu.Props.ts    |   1 -
 .../SwatchColorPicker.Props.ts                | 118 +++
 .../SwatchColorPicker/SwatchColorPicker.scss  | 151 ++++
 .../SwatchColorPicker.test.tsx                | 392 +++++++++
 .../SwatchColorPicker/SwatchColorPicker.tsx   | 768 ++++++++++++++++++
 .../SwatchColorPickerPage.tsx                 |  59 ++
 .../SwatchColorPicker.Basic.Example.tsx       | 193 +++++
 .../src/components/SwatchColorPicker/index.ts |   2 +
 .../src/demo/AppDefinition.tsx                |   6 +
 packages/office-ui-fabric-react/src/index.ts  |   1 +
 .../src/utilities/grid/Grid.Props.ts          |  27 +
 .../src/utilities/grid/Grid.test.tsx          |  64 ++
 .../src/utilities/grid/Grid.tsx               |  59 ++
 .../src/utilities/grid/index.ts               |   2 +
 packages/utilities/api/utilities.api.ts       |   2 +
 packages/utilities/src/array.ts               |  18 +
 27 files changed, 1975 insertions(+), 2 deletions(-)
 create mode 100644 apps/fabric-website/src/pages/Components/SwatchColorPickerComponentPage.tsx
 create mode 100644 common/changes/@uifabric/example-app-base/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
 create mode 100644 common/changes/@uifabric/fabric-website/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
 create mode 100644 common/changes/@uifabric/styling/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
 create mode 100644 common/changes/@uifabric/utilities/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
 create mode 100644 packages/office-ui-fabric-react/src/Grid.ts
 create mode 100644 packages/office-ui-fabric-react/src/SwatchColorPicker.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/SwatchColorPicker/index.ts
 create mode 100644 packages/office-ui-fabric-react/src/utilities/grid/Grid.Props.ts
 create mode 100644 packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx
 create mode 100644 packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
 create mode 100644 packages/office-ui-fabric-react/src/utilities/grid/index.ts

diff --git a/apps/fabric-website/src/components/App/AppState.tsx b/apps/fabric-website/src/components/App/AppState.tsx
index 0dd406fae4d74..e3ae19490d261 100644
--- a/apps/fabric-website/src/components/App/AppState.tsx
+++ b/apps/fabric-website/src/components/App/AppState.tsx
@@ -315,6 +315,12 @@ export const AppState: IAppState = {
           component: () => <LoadingComponent title='SpinButton' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/SpinButtonComponentPage').SpinButtonComponentPage))
         },
+        {
+          title: 'SwatchColorPicker',
+          url: '#/components/swatchcolorpicker',
+          component: () => <LoadingComponent title='SwatchColorPicker' />,
+          getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/SwatchColorPickerComponentPage').SwatchColorPickerComponentPage))
+        },
         {
           title: 'TextField',
           url: '#/components/textfield',
diff --git a/apps/fabric-website/src/pages/Components/SwatchColorPickerComponentPage.tsx b/apps/fabric-website/src/pages/Components/SwatchColorPickerComponentPage.tsx
new file mode 100644
index 0000000000000..df62880d5e7f6
--- /dev/null
+++ b/apps/fabric-website/src/pages/Components/SwatchColorPickerComponentPage.tsx
@@ -0,0 +1,33 @@
+import * as React from 'react';
+import { SwatchColorPickerPage } from 'office-ui-fabric-react/lib/components/SwatchColorPicker/SwatchColorPickerPage';
+import { PageHeader } from '../../components/PageHeader/PageHeader';
+import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+
+export class SwatchColorPickerComponentPage extends React.Component<any, any> {
+  public render() {
+    return (
+      <div ref='pageElement'>
+        <ComponentPage>
+          <PageHeader pageTitle='SwatchColorPicker' backgroundColor='#038387'
+            links={
+              [
+                {
+                  'text': 'Overview',
+                  'location': 'Overview'
+                },
+                {
+                  'text': 'Variants',
+                  'location': 'Variants'
+                },
+                {
+                  'text': 'Implementation',
+                  'location': 'Implementation'
+                }
+              ]
+            } />
+          <SwatchColorPickerPage isHeaderVisible={ false } />
+        </ComponentPage>
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/jspurlin-SimpleColorPicker_2017-06-27-01-50.json b/common/changes/@uifabric/example-app-base/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
new file mode 100644
index 0000000000000..f982888ed04aa
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/jspurlin-SimpleColorPicker_2017-06-27-01-50.json b/common/changes/@uifabric/fabric-website/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
new file mode 100644
index 0000000000000..7d8a12b6371b6
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/jspurlin-SimpleColorPicker_2017-06-27-01-50.json b/common/changes/@uifabric/styling/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
new file mode 100644
index 0000000000000..b97431956ffe2
--- /dev/null
+++ b/common/changes/@uifabric/styling/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/jspurlin-SimpleColorPicker_2017-06-27-01-50.json b/common/changes/@uifabric/utilities/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
new file mode 100644
index 0000000000000..91318d0b7f35d
--- /dev/null
+++ b/common/changes/@uifabric/utilities/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Adding a new Grid utility",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-SimpleColorPicker_2017-06-27-01-50.json b/common/changes/office-ui-fabric-react/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
new file mode 100644
index 0000000000000..2cb09d45030e2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Adding a new component: SwatchColorPicker",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/Grid.ts b/packages/office-ui-fabric-react/src/Grid.ts
new file mode 100644
index 0000000000000..504ca4c1d55f1
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/Grid.ts
@@ -0,0 +1 @@
+export * from './utilities/grid/index';
diff --git a/packages/office-ui-fabric-react/src/SwatchColorPicker.ts b/packages/office-ui-fabric-react/src/SwatchColorPicker.ts
new file mode 100644
index 0000000000000..5f24569fd03c2
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/SwatchColorPicker.ts
@@ -0,0 +1 @@
+export * from './components/SwatchColorPicker/index';
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index ae06cd34bab72..cebdea1c25ce8 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -149,6 +149,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       baseClassName,
       styles,
       menuIconName,
+      menuIconProps,
       menuProps,
       onRenderIcon = this._onRenderIcon,
       onRenderText = this._onRenderText,
@@ -170,7 +171,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         onRenderDescription(props, this._onRenderDescription),
         onRenderAriaDescription(props, this._onRenderAriaDescription),
         onRenderChildren(props, this._onRenderChildren),
-        (menuProps || menuIconName || this.props.onRenderMenuIcon) && onRenderMenuIcon(this.props, this._onRenderMenuIcon),
+        (menuProps || menuIconName || menuIconProps || this.props.onRenderMenuIcon) && onRenderMenuIcon(this.props, this._onRenderMenuIcon),
         this.state.menuProps && onRenderMenu(menuProps, this._onRenderMenu)
       ));
   }
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
index 44fe1a7137a8a..106151117e991 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
@@ -68,4 +68,19 @@ describe('DefaultButton', () => {
       expect(button.getAttribute('aria-haspopup')).to.equal(null);
     });
   });
+
+  describe('with menuIconProps', () => {
+    let button;
+
+    before(() => {
+      const wrapper = ReactTestUtils.renderIntoDocument<any>(
+        <DefaultButton menuIconProps={ { iconName: 'fontColor' } }>Hello</DefaultButton>
+      ) as DefaultButton;
+      button = ReactTestUtils.findRenderedDOMComponentWithTag(wrapper, 'button');
+    });
+
+    it('Contains the expected icon via menuIconProps', () => {
+      expect(button.querySelectorAll('[data-icon-name="fontColor"]').length).to.equal(1);
+    });
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
index f79b50fe5018a..e465f15dd4cb6 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
@@ -175,7 +175,6 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
    * Pass in custom callout props
    */
   calloutProps?: ICalloutProps;
-
 }
 
 export interface IContextualMenuItem {
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts
new file mode 100644
index 0000000000000..b271f870e00b9
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts
@@ -0,0 +1,118 @@
+import { IButtonProps } from '../../Button';
+
+export interface ISwatchColorPickerProps {
+
+  /**
+   * the number of columns for the swatch color picker
+   */
+  columnCount: number;
+
+  /**
+   * The id for the swatch color picker
+   */
+  id?: string;
+
+  /**
+   * The shape of the color cells, defaults to circle
+   */
+  cellShape?: 'circle' | 'square';
+
+  /**
+   * The id of color cell that is currently selected
+   */
+  selectedId?: string;
+
+  /**
+   * IButtonProps for the swatch color picker. If given the swatch color picker
+   * will render inside of a menu
+   */
+  menuButtonProps?: IButtonProps;
+
+  /**
+   * Should the icon color be updated to align
+   * with the selected color? Default is false
+   */
+  setSelectedColorForIcon?: boolean;
+
+  /**
+   * The color options that will be made available to the user
+   */
+  swatchColorPickerItems: ISwatchColorPickerItemProps[];
+
+  /**
+   * Callback issued when the user changes the color.
+   * Note, if no id or color is given, there is no selected cell
+   * (e.g. the user executed the currently selected cell to unselect it)
+   */
+  onColorChanged?: (id?: string, color?: string) => void;
+
+  /**
+ * Callback issued when the user click a menu item
+ */
+  onMenuItemClick?: (item: ISwatchColorPickerItemProps) => void;
+
+  /**
+   * Callback issued when the user hovers over a color cell.
+   * Note, if no id or color is given, cells are not longer being hovered
+   */
+  onCellHovered?: (id?: string, color?: string) => void;
+
+  /**
+   * Callback issued when the user focuses a color cell.
+   * Note, if no id or color is given, cells are not longer being focused
+   */
+  onCellFocused?: (id?: string, color?: string) => void;
+
+  /**
+   * Is this swatch color picker disabled?
+   */
+  disabled?: boolean;
+}
+
+export interface ISwatchColorPickerItemProps {
+
+  /**
+   * Arbitrary unique string associated with this option
+   */
+  id: string;
+
+  /**
+   * The label for this item.
+   * Visible text if this item is a header,
+   * tooltip if is this item is normal
+   */
+  label?: string;
+
+  /**
+   * The type of item this is
+   */
+  type: SwatchColorPickerItemType;
+
+  /**
+   * The CSS-compatible string to describe the color
+   */
+  color?: string;
+
+  /**
+   * Index for this option
+   */
+  index?: number;
+
+  /**
+   * The menu item button props. This value is only used if
+   * the type is MenuItem
+   */
+  menuItemButtonProps?: IButtonProps;
+
+  /**
+   * Is this individual item disabled?
+   */
+  disabled?: boolean;
+}
+
+export enum SwatchColorPickerItemType {
+  Cell = 0,
+  MenuItem = 1,
+  Divider = 2,
+  Header = 3
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
new file mode 100644
index 0000000000000..52556510b1b3b
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
@@ -0,0 +1,151 @@
+@import '../../common/common';
+
+.root {
+  position: relative;
+}
+
+.svg {
+  width: 20px;
+  height: 20px;
+  padding: 4px;
+}
+
+:global(.ms-Fabric.is-focusVisible) .cell {
+  &:focus,
+  &:focus::after {
+    border: none;
+  }
+}
+
+.wrapper {
+  display: inline-block;
+}
+
+.item {
+  @include ms-font-m;
+  @include focus-border();
+  @include text-align(left);
+  color: $menuTextColor;
+  position: relative;
+  box-sizing: border-box;
+  border: none;
+  width: 100%;
+  height: 36px;
+  line-height: 36px;
+  display: block;
+  cursor: pointer;
+  padding: 0px 6px;
+  flex-grow: 1;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  white-space: nowrap;
+
+  &:hover:not([disabled]) {
+    background: $menuBackgroundHoverColor;
+  }
+  &.disabled,
+  &[disabled] {
+    color: $menuTextDisabledColor;
+    cursor: default;
+    pointer-events: none;
+  }
+
+  :global(.is-focusVisible) &:focus {
+    background: $menuBackgroundHoverColor;
+  }
+}
+
+.cell {
+  padding: 0px;
+  overflow: visible;
+
+  &.cellIsSelected {
+    &:hover .svg,
+    &:active .svg {
+      box-shadow: 0 0 0 1px #969696;
+    }
+
+    & .svg {
+      &.circle {
+        border-radius: 100%;
+      }
+
+      width: 12px;
+      height: 12px;
+      border: 4px solid $ms-color-neutralTertiaryAlt;
+    }
+  }
+
+   &:focus .svg {
+      box-shadow: 0 0 0 1px #969696;
+   }
+
+  &:hover .svg,
+  &:focus .svg,
+  &:active .svg {
+    border: 4px solid $ms-color-neutralTertiaryAlt;
+    width: 12px;
+    height: 12px;
+  }
+
+  &:hover .svg.circle,
+  &:focus .svg.circle,
+  &:active .svg.circle {
+    border-radius: 100%;
+  }
+
+  &:active .svg {
+    border: 4px solid #969696;
+
+    // This is for a transform issue in IE
+    // where the edge of the SVG becomes hidden
+    // (e.g. the browser is not correctly listening to overflow: visible).
+    // Edge does the right thing and is not altered by this
+    -ms-transform: translate(-1px, -1px);
+  }
+
+    &.disabled,
+  &[disabled] {
+    color: $menuTextDisabledColor;
+    cursor: default;
+    pointer-events: none;
+    opacity: .3;
+  }
+}
+
+.swatchColorPickerContainer {
+  clear: both;
+  display: inline-block;
+  min-width: 180px;
+}
+
+.icon {
+  width: 16px;
+}
+
+.menuItem {
+  margin: 0px 4px;
+}
+
+.header {
+  color: $menuHeaderColor;
+  font-weight: $ms-font-weight-semibold;
+  white-space: nowrap;
+  background: none;
+  border: none;
+  height: 36px;
+  line-height: 36px;
+  cursor: default;
+  padding: 0px 16px;
+  user-select: none;
+  @include text-align(left);
+}
+
+.divider {
+  display: block;
+  height: 1px;
+  background-color: $menuDividerColor;
+  position: relative;
+}
+
+
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
new file mode 100644
index 0000000000000..e195eaf9c1db8
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
@@ -0,0 +1,392 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+/* tslint:enable:no-unused-variable */
+import * as ReactTestUtils from 'react-addons-test-utils';
+import { mount } from 'enzyme';
+import { KeyCodes } from '../../Utilities';
+import { SwatchColorPicker } from './SwatchColorPicker';
+import { ISwatchColorPickerItemProps, SwatchColorPickerItemType } from './SwatchColorPicker.Props';
+
+let { expect } = chai;
+
+const DEFAULT_OPTIONS: ISwatchColorPickerItemProps[] = [
+  { id: '0', label: 'Colors', type: SwatchColorPickerItemType.Header },
+  { id: 'd1', type: SwatchColorPickerItemType.Divider },
+  { id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00' },
+  { id: 'b', label: 'orange', type: SwatchColorPickerItemType.Cell, color: '#ffa500' },
+  { id: 'c', label: 'blue', type: SwatchColorPickerItemType.Cell, color: '#0000ff' },
+  { id: 'd', label: 'red', type: SwatchColorPickerItemType.Cell, color: '#ff0000' },
+  { id: 'e', type: SwatchColorPickerItemType.Divider },
+  { id: 'f', label: 'More Colors', type: SwatchColorPickerItemType.Header },
+  { id: 'd2', type: SwatchColorPickerItemType.Divider },
+  { id: 'g', label: 'green', type: SwatchColorPickerItemType.Cell, color: 'green' },
+  { id: 'h', label: 'orange', type: SwatchColorPickerItemType.Cell, color: 'orange' },
+  { id: 'i', label: 'blue', type: SwatchColorPickerItemType.Cell, color: 'blue' },
+  { id: 'j', label: 'red', type: SwatchColorPickerItemType.Cell, color: 'red' },
+  { id: 'k', label: 'black', type: SwatchColorPickerItemType.Cell, color: 'black' },
+  { id: 'l', label: 'grey', type: SwatchColorPickerItemType.Cell, color: 'grey' },
+  { id: 'm', label: 'purple', type: SwatchColorPickerItemType.Cell, color: 'purple' },
+  { id: 'n', label: 'yellow', type: SwatchColorPickerItemType.Cell, color: 'yellow' },
+  { id: 'o', type: SwatchColorPickerItemType.Divider },
+  { id: 'p', label: 'Find Colors', type: SwatchColorPickerItemType.MenuItem },
+  { id: 'q', label: 'Find More Colors', type: SwatchColorPickerItemType.MenuItem, menuItemButtonProps: { iconProps: { iconName: 'glasses' } } },
+  { id: 'r', label: '...More Colors...', type: SwatchColorPickerItemType.MenuItem },
+  { id: 's', label: 'Find Even More Colors', type: SwatchColorPickerItemType.MenuItem, menuItemButtonProps: { iconProps: { iconName: 'redEye' } } }
+];
+
+describe('SwatchColorPicker', () => {
+
+  it('Can render in full without being parented to a button', () => {
+    const wrapper = mount(
+      <SwatchColorPicker
+        swatchColorPickerItems={ DEFAULT_OPTIONS }
+        columnCount={ 4 }
+      />);
+    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
+    let menu = wrapper.getDOMNode().ownerDocument.querySelector('.ms-swatchColorPickerMenu');
+
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton').length).to.equal(0, 'should not have a button');
+    expect(menu).equal(null, 'should not have a menu ');
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerBodyContainer').length).to.equal(1, 'should have a swatch color picker body');
+  });
+
+  it('Can render collapsed behind a button', () => {
+    const wrapper = mount(
+      <SwatchColorPicker
+        menuButtonProps={ { iconProps: { iconName: 'fontColor' }, title: 'Font Color' } }
+        swatchColorPickerItems={ DEFAULT_OPTIONS }
+        columnCount={ 4 }
+      />);
+    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
+
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton').length).to.equal(1, 'should have a button');
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(0, 'not be expanded');
+  });
+
+  it('Can render collapsed behind a button and expand', () => {
+    const wrapper = mount(
+      <SwatchColorPicker
+        menuButtonProps={ { iconProps: { iconName: 'fontColor' }, title: 'Font Color' } }
+        swatchColorPickerItems={ DEFAULT_OPTIONS }
+        columnCount={ 4 }
+      />);
+    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
+
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton').length).to.equal(1, 'should have a button');
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(0, 'should not be expanded');
+
+    swatchColorPickerRoot.find('.ms-swatchColorPickerButton').simulate('click');
+
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton').length).to.equal(1, 'should have a button');
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(1, 'should be expanded');
+
+    let menu = wrapper.getDOMNode().ownerDocument.querySelector('.ms-swatchColorPickerMenu');
+
+    expect(menu).to.not.equal(null, 'should have a menu');
+    expect(menu.querySelectorAll('.ms-swatchColorPickerBodyContainer').length).to.equal(1, 'should have a swatch color picker body inside of the menu');
+  });
+
+  it('Can render the correct options when in a menu', () => {
+    const wrapper = mount(
+      <SwatchColorPicker
+        menuButtonProps={ { iconProps: { iconName: 'fontColor' }, title: 'Font Color' } }
+        swatchColorPickerItems={ DEFAULT_OPTIONS }
+        columnCount={ 4 }
+      />);
+    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
+
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton').length).to.equal(1, 'should have a button');
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(0, 'should not be expanded');
+
+    let button = swatchColorPickerRoot.find('.ms-swatchColorPickerButton');
+
+    expect(button).to.not.equal(null, 'should have a button');
+    button.simulate('click');
+
+    let menu = wrapper.getDOMNode().ownerDocument.querySelector('.ms-swatchColorPickerMenu');
+    expect(menu).to.not.equal(null, 'should have a menu');
+
+    let tableElements = menu.querySelectorAll('table[role="grid"]');
+    let tableRowElements = menu.querySelectorAll('tr[role="row"]');
+    let tableCellElements = menu.querySelectorAll('button[role="gridcell"]');
+    let headingElements = menu.querySelectorAll('[role="heading"]');
+    let dividerElements = menu.querySelectorAll('[role="separator"]');
+    let menuitems = menu.querySelectorAll('button[role="menuitem"]');
+    let buttons = menu.querySelectorAll('button[role="button"]');
+    let setSizeElements = menu.querySelectorAll('[aria-setsize]');
+
+    expect(menu.querySelectorAll('[role="menu"]').length).to.equal(1, 'should be one menu in the swatch color picker');
+    expect(tableElements.length).to.equal(2, 'should be two grids in the swatch color picker');
+    expect(tableElements[0].getAttribute('aria-posinset')).to.equal('1', 'first grid should have aria-posinset of 1');
+    expect(tableElements[1].getAttribute('aria-posinset')).to.equal('2', 'first grid should have aria-posinset of 2');
+    expect(tableRowElements.length).to.equal(3, 'should be three rows in the swatch color picker');
+    expect(tableRowElements[0].getElementsByTagName('td').length).to.equal(4, 'the first row should have four td elements');
+    expect(tableRowElements[1].getElementsByTagName('td').length).to.equal(4, 'the second row should have four td elements');
+    expect(tableRowElements[2].getElementsByTagName('td').length).to.equal(4, 'the third row should have four td elements');
+    expect(tableCellElements.length).to.equal(12, 'should be twelve grid cells in the swatch color picker');
+    expect(headingElements.length).to.equal(2, 'should be two headers in the swatch color picker');
+    expect(dividerElements.length).to.equal(4, 'should be four dividers in the swatch color picker');
+    expect(menuitems.length).to.equal(4, 'should be four menu items in the swatch color picker');
+    expect(menuitems[0].getAttribute('aria-posinset')).to.equal('3', 'first grid should have aria-posinset of 3');
+    expect(menuitems[1].getAttribute('aria-posinset')).to.equal('4', 'first grid should have aria-posinset of 4');
+    expect(menuitems[2].getAttribute('aria-posinset')).to.equal('5', 'first grid should have aria-posinset of 5');
+    expect(menuitems[3].getAttribute('aria-posinset')).to.equal('6', 'first grid should have aria-posinset of 6');
+    expect(setSizeElements.length).to.equal(6, 'should be six elements with aria-setsize in the swatch color picker');
+    expect(buttons.length).to.equal(0, 'should be zero role="button" elements in the swatch color picker');
+    expect(setSizeElements[0].getAttribute('aria-setsize')).to.equal('6', 'set size shoud be equal to six in the swatch color picker');
+  });
+
+  it('Can render the correct options when not in a menu', () => {
+    const wrapper = mount(
+      <SwatchColorPicker
+        swatchColorPickerItems={ DEFAULT_OPTIONS }
+        columnCount={ 4 }
+      />);
+    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
+    let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
+    let container = reactContainer.getDOMNode();
+    expect(container).to.not.equal(null, 'should have a container');
+
+    let tableElements = container.querySelectorAll('table[role="grid"]');
+    let tableRowElements = container.querySelectorAll('tr[role="row"]');
+    let tableCellElements = container.querySelectorAll('button[role="gridcell"]');
+    let headingElements = container.querySelectorAll('[role="heading"]');
+    let dividerElements = container.querySelectorAll('[role="separator"]');
+    let menuitems = container.querySelectorAll('button[role="menuitem"]');
+    let buttons = container.querySelectorAll('button[role="button"]');
+    let setSizeElements = container.querySelectorAll('[aria-setsize]');
+    let posInSetElements = container.querySelectorAll('[aria-posinset]');
+
+    expect(container.querySelectorAll('[role="menu"]').length).to.equal(0, 'should be zero menus in the swatch color picker');
+    expect(tableElements.length).to.equal(2, 'should be two grids in the swatch color picker');
+    expect(tableRowElements.length).to.equal(3, 'should be three rows in the swatch color picker');
+    expect(tableRowElements[0].getElementsByTagName('td').length).to.equal(4, 'the first row should have four td elements');
+    expect(tableRowElements[1].getElementsByTagName('td').length).to.equal(4, 'the second row should have four td elements');
+    expect(tableRowElements[2].getElementsByTagName('td').length).to.equal(4, 'the third row should have four td elements');
+    expect(tableCellElements.length).to.equal(12, 'should be twelve grid cells in the swatch color picker');
+    expect(headingElements.length).to.equal(2, 'should be two headers in the swatch color picker');
+    expect(dividerElements.length).to.equal(4, 'should be four dividers in the swatch color picker');
+    expect(menuitems.length).to.equal(0, 'should be zero menu items in the swatch color picker');
+    expect(buttons.length).to.equal(4, 'should be four buttons in the swatch color picker');
+    expect(setSizeElements.length).to.equal(0, 'should be zero elements with aria-setsize since we are not in a menu in the swatch color picker');
+    expect(posInSetElements.length).to.equal(0, 'should be zero elements with aria-posinset since we are not in a menu in the swatch color picker');
+  });
+
+  it('Cannot expand a disabled collapsed swatch color picker', () => {
+    const wrapper = mount(
+      <SwatchColorPicker
+        menuButtonProps={ { iconProps: { iconName: 'fontColor' }, title: 'Font Color' } }
+        swatchColorPickerItems={ DEFAULT_OPTIONS }
+        columnCount={ 4 }
+        disabled={ true }
+      />);
+    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
+
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton').length).to.equal(1, 'should have a button');
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(0, 'should not be expanded');
+
+    swatchColorPickerRoot.find('.ms-swatchColorPickerButton').simulate('click');
+
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(0, 'should be expanded');
+
+    swatchColorPickerRoot.find('.ms-swatchColorPickerButton').simulate('keydown', { which: KeyCodes.enter });
+
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(0, 'should be expanded');
+  });
+
+  it('Cannot execute a disabled cell in an expanded swatch color picker', () => {
+    let eventFireCounter = 0;
+    const wrapper = mount(
+      <SwatchColorPicker
+        menuButtonProps={ { iconProps: { iconName: 'fontColor' }, title: 'Font Color' } }
+        swatchColorPickerItems={ [{ id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00', disabled: true }] }
+        onColorChanged={ (color) => eventFireCounter++ }
+        columnCount={ 4 }
+      />);
+    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
+
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton').length).to.equal(1, 'should have a button');
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(0, 'should not be expanded');
+
+    swatchColorPickerRoot.find('.ms-swatchColorPickerButton').simulate('click');
+
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(1, 'should be expanded');
+
+    let menu = wrapper.getDOMNode().ownerDocument.querySelector('.ms-swatchColorPickerMenu');
+    expect(menu).to.not.equal(null, 'should have a menu');
+
+    let cell = menu.querySelector('button');
+    expect(cell).to.not.equal(null, 'should find a cell');
+
+    ReactTestUtils.Simulate.click(cell);
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(1, 'should still be expanded');
+
+    ReactTestUtils.Simulate.keyDown(cell, { which: KeyCodes.enter });
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(1, 'at the end the menu should still be expanded');
+
+    expect(eventFireCounter).to.equal(0, 'no color changed events were fired');
+  });
+
+  it('Cannot execute a disabled menu item in an expanded swatch color picker', () => {
+    let eventFireCounter = 0;
+    const wrapper = mount(
+      <SwatchColorPicker
+        menuButtonProps={ { iconProps: { iconName: 'fontColor' }, title: 'Font Color' } }
+        swatchColorPickerItems={ [{ id: 'a', label: 'green', type: SwatchColorPickerItemType.MenuItem, disabled: true }] }
+        onMenuItemClick={ (item) => eventFireCounter++ }
+        columnCount={ 4 }
+      />);
+    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
+
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton').length).to.equal(1, 'should have a button');
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(0, 'should not be expanded');
+
+    swatchColorPickerRoot.find('.ms-swatchColorPickerButton').simulate('click');
+
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(1, 'should be expanded');
+
+    let menu = wrapper.getDOMNode().ownerDocument.querySelector('.ms-swatchColorPickerMenu');
+    expect(menu).to.not.equal(null, 'should have a menu');
+
+    let cell = menu.querySelector('button');
+    expect(cell).to.not.equal(null, 'should find a cell');
+
+    ReactTestUtils.Simulate.click(cell);
+    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(1, 'should still be expanded');
+    expect(eventFireCounter).to.equal(0, 'no color changed events were fired');
+  });
+
+  it('Cannot execute a disabled cell in a non-collapsable swatch color picker', () => {
+    let eventFireCounter = 0;
+    const wrapper = mount(
+      <SwatchColorPicker
+        swatchColorPickerItems={ [{ id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00', disabled: true }] }
+        onColorChanged={ (color) => eventFireCounter++ }
+        columnCount={ 4 }
+      />);
+    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
+
+    let button = swatchColorPickerRoot.find('button');
+    expect(button).to.not.equal(null, 'should find a button');
+    button.simulate('click');
+    expect(eventFireCounter).to.equal(0, 'no color changed events were fired');
+  });
+
+  it('Cannot execute a disabled menu item in a non-collapsable swatch color picker', () => {
+    let eventFireCounter = 0;
+    const wrapper = mount(
+      <SwatchColorPicker
+        swatchColorPickerItems={ [{ id: 'a', label: 'green', type: SwatchColorPickerItemType.MenuItem, disabled: true }] }
+        onMenuItemClick={ (item) => eventFireCounter++ }
+        columnCount={ 4 }
+      />);
+    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
+
+    let button = swatchColorPickerRoot.find('button');
+    expect(button).to.not.equal(null, 'should find a button');
+    button.simulate('click');
+    expect(eventFireCounter).to.equal(0, 'no color changed events were fired');
+  });
+
+  it('Can execute a cell in non-collapsable swatch color picker ', () => {
+    let eventFireCounter = 0;
+    const wrapper = mount(
+      <SwatchColorPicker
+        swatchColorPickerItems={ [{ id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00' }] }
+        onColorChanged={ (color) => eventFireCounter++ }
+        columnCount={ 4 }
+      />);
+    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
+    let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
+    let container = reactContainer.getDOMNode();
+    expect(container).to.not.equal(null, 'should have a container');
+
+    let item = container.querySelector('[role="gridcell"]');
+    expect(item).to.not.equal(null, 'should find a item');
+
+    ReactTestUtils.Simulate.click(item);
+    expect(eventFireCounter).to.equal(1, 'one color changed events were fired');
+  });
+
+  it('Can execute a menu item in non-collapsable swatch color picker ', () => {
+    let eventFireCounter = 0;
+    const wrapper = mount(
+      <SwatchColorPicker
+        swatchColorPickerItems={ [{ id: 'a', label: 'green', type: SwatchColorPickerItemType.MenuItem }] }
+        onMenuItemClick={ (item) => eventFireCounter++ }
+        columnCount={ 4 }
+      />);
+    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
+    let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
+    let container = reactContainer.getDOMNode();
+    expect(container).to.not.equal(null, 'should have a container');
+
+    let item = container.querySelector('[role="button"]');
+    expect(item).to.not.equal(null, 'should find a item');
+
+    ReactTestUtils.Simulate.click(item);
+    expect(eventFireCounter).to.equal(1, 'one color changed events were fired');
+  });
+
+  it('Can fire the hover event on a cell in non-collapsable swatch color picker ', () => {
+    let eventFireCounter = 0;
+    const wrapper = mount(
+      <SwatchColorPicker
+        swatchColorPickerItems={ [{ id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00' }] }
+        onCellHovered={ (color) => eventFireCounter++ }
+        columnCount={ 4 }
+      />);
+    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
+    let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
+    let container = reactContainer.getDOMNode();
+    expect(container).to.not.equal(null, 'should have a container');
+
+    let cell = container.querySelector('[role="gridcell"]');
+    expect(cell).to.not.equal(null, 'should find a cell');
+
+    ReactTestUtils.Simulate.mouseEnter(cell);
+    expect(eventFireCounter).to.equal(1, 'one color changed events were fired');
+  });
+
+  it('Can fire the focus event on a cell in non-collapsable swatch color picker ', () => {
+    let eventFireCounter = 0;
+    const wrapper = mount(
+      <SwatchColorPicker
+        swatchColorPickerItems={ [{ id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00' }] }
+        onCellFocused={ (color) => eventFireCounter++ }
+        columnCount={ 4 }
+      />);
+    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
+    let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
+    let container = reactContainer.getDOMNode();
+    expect(container).to.not.equal(null, 'should have a container');
+
+    let cell = container.querySelector('[role="gridcell"]');
+    expect(cell).to.not.equal(null, 'should find a cell');
+
+    ReactTestUtils.Simulate.focus(cell);
+    expect(eventFireCounter).to.equal(1, 'one color changed events were fired');
+  });
+
+  it('Cannot fire a hover or focus event on a disabled cell in non-collapsable swatch color picker ', () => {
+    let eventFireCounter = 0;
+    const wrapper = mount(
+      <SwatchColorPicker
+        swatchColorPickerItems={ [{ id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00', disabled: true }] }
+        onCellFocused={ (color) => eventFireCounter++ }
+        onCellHovered={ (color) => eventFireCounter++ }
+        columnCount={ 4 }
+      />);
+    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
+    let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
+    let container = reactContainer.getDOMNode();
+    expect(container).to.not.equal(null, 'should have a container');
+
+    let cell = container.querySelector('[role="gridcell"]');
+    expect(cell).to.not.equal(null, 'should find a cell');
+    ReactTestUtils.Simulate.mouseEnter(cell);
+    ReactTestUtils.Simulate.focus(cell);
+    expect(eventFireCounter).to.equal(0, 'no color changed events were fired');
+  });
+});
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
new file mode 100644
index 0000000000000..6827cb492c7f7
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
@@ -0,0 +1,768 @@
+import * as React from 'react';
+import {
+  autobind,
+  BaseComponent,
+  css,
+  findIndex,
+  getId
+} from '../../Utilities';
+import {
+  ISwatchColorPickerProps,
+  ISwatchColorPickerItemProps,
+  SwatchColorPickerItemType
+} from './SwatchColorPicker.Props';
+import { DirectionalHint } from '../../ContextualMenu';
+import { getColorFromString } from '../../utilities/color/colors';
+import { Grid } from '../../utilities/grid/Grid';
+import { DefaultButton, CommandButton, IButtonProps } from '../../Button';
+import { Callout } from '../../Callout';
+import { FocusZone } from '../../FocusZone';
+import * as stylesImport from './SwatchColorPicker.scss';
+const styles: any = stylesImport;
+
+interface ISwatchColorPickerOptionProps {
+
+  /**
+   * The option that will be made available to the user
+   */
+  item: ISwatchColorPickerItemProps;
+
+  /**
+   * Arbitrary unique string associated with this option
+   */
+  id: string;
+
+  /**
+   * Optional, the position in the parent set for this item
+   */
+  posInSet?: number;
+
+  /**
+   * Optional, the size of the total parent set
+   */
+  setSize?: number;
+
+  /**
+   * Optional, if the this option should be diabled
+   */
+  disabled?: boolean;
+
+  /**
+   * Optional, the currently selectedIndex in the set of options
+   */
+  selectedIndex?: number;
+
+  /**
+   * The on click handler
+   */
+  onClick: (item: ISwatchColorPickerItemProps) => void;
+
+  /**
+   * Optional, the onHover handler
+   */
+  onHover?: (id?: string, color?: string) => void;
+
+  /**
+   * Optional, the onFocus handler
+   */
+  onFocus?: (id?: string, color?: string) => void;
+
+  /**
+   * The accessible role for this option
+   */
+  role?: string;
+
+  /**
+   * Optional, className(s) to apply
+   */
+  className?: string;
+
+  /**
+   * The shape for the option (only used for item type.Cell)
+   */
+  cellShape?: 'circle' | 'square';
+}
+
+const SwatchColorPickerOption: React.StatelessComponent<ISwatchColorPickerOptionProps> =
+  (props: ISwatchColorPickerOptionProps) => {
+    let {
+      item,
+      id,
+      posInSet,
+      setSize,
+      className,
+      role,
+      selectedIndex,
+      disabled,
+      cellShape,
+      onClick,
+      onHover,
+      onFocus
+    } = props;
+    return (
+      <CommandButton
+        { ...item.menuItemButtonProps }
+        id={ id + '-item' + item.index }
+        data-index={ item.index }
+        data-is-focusable={ true }
+        aria-posinset={ posInSet && posInSet }
+        aria-setsize={ setSize && setSize }
+        disabled={ disabled }
+        className={ css(className,
+          {
+            ['is-selected ' + styles.cellIsSelected]: (selectedIndex && selectedIndex === item.index),
+            ['is-disabled ' + styles.disabled]: disabled
+          }
+        ) }
+        onClick={ _onClick }
+        onMouseEnter={ _onMouseEnter }
+        onMouseLeave={ _onMouseLeave }
+        onFocus={ _onFocus }
+        role={ role }
+        aria-selected={ selectedIndex && (selectedIndex === item.index).toString() }
+        ariaLabel={ item.label && item.label }
+        title={ item.label && item.label }
+      >
+        { _onRenderOption() }
+      </CommandButton>
+    );
+
+    function _onClick() {
+      if (onClick && !disabled) {
+        onClick(item);
+      }
+    }
+
+    function _onMouseEnter() {
+      if (onHover && !disabled) {
+        onHover(item.id, item.color);
+      }
+    }
+
+    function _onMouseLeave() {
+      if (onHover && !disabled) {
+        onHover();
+      }
+    }
+
+    function _onFocus() {
+      if (onFocus && !disabled) {
+        onFocus(item.id, item.color);
+      }
+    }
+
+    /**
+     * Render the core of an cell or menu item
+     * @returns {JSX.Element} - Element representing the core of the item
+     */
+    function _onRenderOption(): JSX.Element {
+
+      // Menu items just need their label text
+      if (item.type !== SwatchColorPickerItemType.Cell) {
+        return <span className={ styles.menuItem } >{ item.label }</span>;
+      }
+
+      // Build an SVG for the cell with the given shape and color properties
+      return (
+        <svg className={ css(styles.svg, cellShape, cellShape === 'circle' ? styles.circle : '') } viewBox='0 0 20 20' fill={ getColorFromString(item.color).str } >
+          {
+            cellShape === 'circle' ?
+              <circle cx='50%' cy='50%' r='50%' /> :
+              <rect width='100%' height='100%' />
+          }
+        </svg>
+      );
+    }
+  };
+
+export interface ISwatchColorPickerState {
+  selectedIndex?: number;
+  expanded?: boolean;
+}
+
+export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, ISwatchColorPickerState> {
+
+  public static defaultProps = {
+    cellShape: 'circle',
+    updateButtonIconWithColor: false,
+    disabled: false
+  };
+
+  private _id: string;
+
+  private _buttonWrapper: HTMLDivElement;
+
+  constructor(props: ISwatchColorPickerProps) {
+    super(props);
+
+    this._id = props.id || getId('swatchColorPicker');
+
+    this.state = {
+      selectedIndex: props.selectedId && this._getSelectedIndex(props.swatchColorPickerItems, props.selectedId),
+      expanded: false
+    };
+  }
+
+  public componentWillReceiveProps(newProps: ISwatchColorPickerProps) {
+    let newSelectedIndex = newProps.selectedId && this._getSelectedIndex(newProps.swatchColorPickerItems, newProps.selectedId);
+
+    if (newSelectedIndex !== undefined &&
+      newSelectedIndex !== this.state.selectedIndex) {
+      this.setState({
+        selectedIndex: newSelectedIndex
+      });
+    }
+  }
+
+  public render() {
+    let { expanded } = this.state;
+    let { menuButtonProps,
+      disabled,
+      swatchColorPickerItems,
+      columnCount } = this.props;
+
+    // If we got button props, put the swatch color picker behind a button, otherwise
+    // render all of the items
+    let colorToSet = this._getSelectedColorToSet();
+    let renderElement = menuButtonProps !== undefined ?
+      <SwatchColorPickerMenuButton
+        { ...this.props }
+        color={ colorToSet }
+        onClick={ this._onButtonClick }
+        expanded={ this.state.expanded }
+        onRenderContainer={ this._onRenderContainer }
+        menuIconProps={ menuButtonProps.menuIconProps ?
+          menuButtonProps.menuIconProps :
+          { iconName: 'chevronDown' } }
+      /> :
+      <SwatchColorPickerBody
+        { ...this.props }
+        onRenderItems={ this._onRenderItems }
+      />;
+
+    return (
+      <div
+        ref={ this._resolveRef('_buttonWrapper') }
+        className={ css('ms-swatchColorPickerWrapper', styles.wrapper) }>
+        { renderElement }
+      </div>);
+  }
+
+  /**
+   * Get the selected item's index
+   * @param items - The items to search
+   * @param selectedId - The selected item's id to find
+   * @returns {number} - The index of the selected item's id, -1 if there was no match
+   */
+  private _getSelectedIndex(items: ISwatchColorPickerItemProps[], selectedId: string): number | undefined {
+    let selectedIndex = findIndex(items, (item => (item.id === selectedId)));
+    return selectedIndex >= 0 ? selectedIndex : undefined;
+  }
+
+  /**
+   * Gets the color for the selected index
+   * @returns {string} - The color for the selected index,
+   *   or undefined if: we are not updating the button icon with color,
+   *   there is not a valid selected index, or if we do not have a valid color
+   */
+  private _getSelectedColorToSet(): string | undefined {
+    let { selectedIndex } = this.state;
+    let {
+      swatchColorPickerItems,
+      setSelectedColorForIcon
+    } = this.props;
+
+    // Do we need to update the button with the selected
+    // item's color? If so, attempt to grab the color
+    if (setSelectedColorForIcon && selectedIndex !== undefined) {
+      let swatchColorPickerItem = swatchColorPickerItems[selectedIndex];
+      if (swatchColorPickerItem.type === SwatchColorPickerItemType.Cell) {
+        return swatchColorPickerItem.color;
+      }
+    }
+
+    return undefined;
+  }
+
+  /**
+   * Render all the items
+   * @param items - The swatch color picker items
+   * @returns {JSX.Element[]} - An array of all the items in the swatch color picker
+   */
+  @autobind
+  private _onRenderItems(items: ISwatchColorPickerItemProps[]): JSX.Element[] {
+
+    // This holds all of the element for the items
+    let elements: JSX.Element[] = [];
+
+    // The number of cells that were processed in the previous iteration of loop.
+    // This will be used to increase the index to the item after the last processed
+    // item
+    let numOfItemsInChunk = -1;
+
+    // If we have cell items and we are in a menu, get all the
+    // first executable items per chunk. Note, in this
+    // context each menuItem is in its own "chunk", only grouped
+    // cells are processed as a chunk. This helps with being able
+    // to determine the correct aria-posinset and aria-setsize values
+    let firstExecutableItemsPerChunk = this.props.menuButtonProps ?
+      this._getFirstExecutableItemsPerChunk() : undefined;
+
+    // Did we find any executable items? (e.g. should be calculate the set information)
+    let shouldGetSetInfo = (firstExecutableItemsPerChunk && firstExecutableItemsPerChunk.length > 0);
+
+    let setSize = shouldGetSetInfo ? firstExecutableItemsPerChunk.length : undefined;
+
+    // If any menuItem has an icon, all menu items need to be positined correctly so they align
+    let shouldAccountForIcon = (firstExecutableItemsPerChunk && findIndex(firstExecutableItemsPerChunk, (executableItem) => (executableItem.type === SwatchColorPickerItemType.MenuItem && executableItem.menuItemButtonProps)));
+
+    // Loop across the items processing them depending on their item type
+    let index = 0;
+    while (index < items.length) {
+      let item = items[index];
+      let posInSet = shouldGetSetInfo ? this._getPositionInSet(firstExecutableItemsPerChunk, item.id) : undefined;
+      switch (item.type) {
+        case SwatchColorPickerItemType.Divider:
+          elements.push(this._renderSeparator(item));
+          break;
+        case SwatchColorPickerItemType.Header:
+          elements.push(this._renderHeader(item));
+          break;
+        case SwatchColorPickerItemType.Cell:
+
+          // build all the cells in the chunk this cell
+          // exists within (this will process all of the
+          // consecutive cells until the next non-cell type
+          // is incountered (or if we reach the end of the items))
+          let chunkItems = this._getNextChunkOfCellItems(items.slice(index));
+
+          // Update the number of items in chunk
+          numOfItemsInChunk = chunkItems.length > 0 ? chunkItems.length : -1;
+
+          // Add the result to the array
+          elements.push(this._renderNextChunkOfCellItems(
+            chunkItems,
+            posInSet,
+            setSize));
+          break;
+        default:
+
+          // Does at least one of the menu items have an icon?
+          if (shouldAccountForIcon) {
+
+            // Make sure the width styling is the same by applying a consistent className
+            if (item.menuItemButtonProps) {
+              item.menuItemButtonProps = {
+                ...item.menuItemButtonProps,
+                iconProps: { ...item.menuItemButtonProps.iconProps, className: styles.icon }
+              };
+            } else {
+
+              // This menu item didn't have an icon so add a "spacer" icon to make the text
+              // content align. This aligns with how ContextualMenu achieves this alignmet
+              item.menuItemButtonProps = { ...item.menuItemButtonProps, iconProps: { iconName: 'customIcon', className: styles.icon } };
+            }
+          }
+          elements.push(this._renderOption(item, posInSet, setSize));
+      }
+
+      // Increase the index by the number of items in the just processed chunk,
+      // otherwise just increment the index
+      index += numOfItemsInChunk > 0 ? numOfItemsInChunk : 1;
+      numOfItemsInChunk = -1;
+    }
+
+    return elements;
+  }
+
+  /**
+   * Renders the next consecutive chunk of cells
+   * @param items - The items to process
+   * @param posInSet - Optional, the position in the set for this chunk
+   * @param setSize - Optional, the size of the total set
+   * @returns {JSX.Element} - The grid that represents the chunk
+   */
+  private _renderNextChunkOfCellItems(items: ISwatchColorPickerItemProps[], posInSet?: number, setSize?: number): JSX.Element {
+    return (
+      <Grid
+        key={ this._id + items[0].id + '-grid' }
+        items={ items }
+        columnCount={ this.props.columnCount }
+        onRenderItem={ this._renderOption }
+        positionInSet={ posInSet }
+        setSize={ setSize }
+      />
+    );
+  }
+
+  /**
+   * Get the position in set for the given id
+   * @param firstExecutableItemsPerChunk - The list of fist executable items per chunk
+   * @param itemId - The id of item to find the index of
+   * @returns {number} - The position in the set
+   */
+  private _getPositionInSet(firstExecutableItemsPerChunk: ISwatchColorPickerItemProps[], itemId: string): number | undefined {
+
+    // Find the index of the given id in the list of first executable items per chunk
+    let index = findIndex(firstExecutableItemsPerChunk, (executableItem) => (executableItem.id === itemId));
+
+    return index < 0 ? undefined : index + 1;
+  }
+
+  /**
+   * Gets the next chunk of consecutive cells starting a index zero.
+   * Note, index zero should be of type cell
+   * @param items - The list of items to process where index zero is the start of the chunk
+   * @returns {ISwatchColorPickerItemProps[]} - the array of consecutive cells starting at index zero
+   *   (and continuing to the first non-cell type or the end of the items)
+   */
+  private _getNextChunkOfCellItems(items: ISwatchColorPickerItemProps[]): ISwatchColorPickerItemProps[] {
+    let nextIndextAfterChunk = findIndex(items, (item => item.type !== SwatchColorPickerItemType.Cell));
+
+    // If we didn't find a non-cell item, we need to handle everything that is left
+    if (nextIndextAfterChunk < 0) {
+      return items;
+    }
+
+    // If we get here we found our chunk boundry
+    return items.slice(0 /* start */, nextIndextAfterChunk);
+  }
+
+  /**
+   * Get only the executable items (cells and menuItems)
+   * @returns {ISwatchColorPickerItemProps[]} - an array of the executable items
+   */
+  private _getFirstExecutableItemsPerChunk(): ISwatchColorPickerItemProps[] {
+
+    // Make sure every item has an index, then filter
+    // the results so that you only get the executable items,
+    // finally filter those items down to just the items that are
+    // either the start of a chunk or an menu item
+    return (
+      this.props.swatchColorPickerItems.map((item, index) => { return { ...item, index }; })
+        .filter(item => (item.type === SwatchColorPickerItemType.Cell || item.type === SwatchColorPickerItemType.MenuItem))
+        .filter((item, filteredIndex, items) => {
+          return (
+            filteredIndex === 0 ||
+            item.type === SwatchColorPickerItemType.MenuItem ||
+            (item.index - items[filteredIndex - 1].index !== 1)
+          );
+        }));
+  }
+
+  /**
+   * Render the separator
+   * @param item - The divider item to get the data to render from
+   * @returns {JSX.Element} - Element that represents the separator
+   */
+  private _renderSeparator(item: ISwatchColorPickerItemProps): JSX.Element {
+    return this._renderHeaderOrDivider(item, 'separator', styles.divider);
+  }
+
+  /**
+   * Render the header
+   * @param item - The header item to get the data to render from
+   * @returns {JSX.Element} - Element that represents the header
+   */
+  private _renderHeader(item: ISwatchColorPickerItemProps): JSX.Element {
+    return this._renderHeaderOrDivider(item, 'heading', styles.header);
+  }
+
+  /**
+   * Handle the rendering of the header/divider
+   * @param item - The item to get the data to render from
+   * @param role - The role of the element
+   * @param className - the className to use
+   * @returns {JSX.Element} - Element that represents the header
+   */
+  private _renderHeaderOrDivider(item: ISwatchColorPickerItemProps, role: string, className: string): JSX.Element {
+    return <div
+      role={ role }
+      key={ item.id }
+      className={ className }
+    >
+      { item.label && item.label }
+    </div>;
+  }
+
+  /**
+   * Render a cell or menu item
+   * @param item - The item to render
+   * @param posInSet - Optional, the position in the set of the item
+   * @param setSize - Optional, the total set size this item is in
+   * @returns {JSX.Element} - Element representing the item
+   */
+  @autobind
+  private _renderOption(item: ISwatchColorPickerItemProps, posInSet?: number, setSize?: number): JSX.Element {
+    let id = this._id;
+    let isCell = item.type === SwatchColorPickerItemType.Cell;
+    let optionProps;
+
+    if (isCell) {
+      optionProps = {
+        className: styles.cell,
+        onClick: this._onCellClick,
+        onHover: this.props.onCellHovered,
+        onFocus: this.props.onCellFocused,
+        role: 'gridcell',
+        selectedIndex: this.state.selectedIndex
+      };
+    } else {
+      optionProps = {
+        posInSet: posInSet && posInSet,
+        setSize: setSize && setSize,
+        className: styles.item,
+        onClick: this._onMenuItemClick,
+        onFocus: this._clearFocusColorOnMenuItem,
+        role: this.props.menuButtonProps ? 'menuitem' : 'button'
+      };
+    }
+
+    return (
+      <SwatchColorPickerOption
+        item={ item }
+        id={ this._id }
+        key={ id + item.id }
+        disabled={ this.props.disabled || item.disabled }
+        cellShape={ this.props.cellShape }
+        { ...optionProps }
+      />
+    );
+  }
+
+  /**
+   * Handle the click on a cell
+   * @param item - The cell that the click was fired against
+   */
+  @autobind
+  private _onCellClick(item: ISwatchColorPickerItemProps) {
+    if (this.props.disabled || item.disabled) {
+      return;
+    }
+
+    let index = item.index;
+
+    // If we have a valid index and it is not already
+    // selected, select it
+    if (index >= 0 && index !== this.state.selectedIndex) {
+      if (this.props.onColorChanged) {
+        this.props.onColorChanged(item.id, item.color);
+      }
+
+      this.setState({
+        selectedIndex: index,
+        expanded: false
+      });
+    } else if (index === this.state.selectedIndex) {
+
+      // The index that got the click was already selected,
+      // clear the selection
+      this._clearColors([this.props.onColorChanged, this.props.onCellHovered, this.props.onCellFocused]);
+
+      this.setState({
+        selectedIndex: undefined,
+        expanded: false
+      });
+    }
+  }
+
+  /**
+   * Handle the click on a menu item
+   * @param item - The menu item that the click was fired against
+   */
+  @autobind
+  private _onMenuItemClick(item: ISwatchColorPickerItemProps) {
+    if (this.props.disabled || item.disabled) {
+      return;
+    }
+
+    if (this.props.onMenuItemClick) {
+      this.props.onMenuItemClick(item);
+    }
+
+    // Make sure to clear any hover/focus colors
+    this._clearColors([this.props.onCellHovered, this.props.onCellFocused]);
+
+    this.setState({
+      expanded: false
+    });
+  }
+
+  /**
+   * Clear the colors by calling the given callbacks
+   * @param callbacks - The callbacks to handle the clear operation
+   */
+  private _clearColors(callbacks: ((id?: string, color?: string) => void)[]) {
+    callbacks.forEach((callback) => {
+      if (callback) {
+        callback();
+      }
+    });
+  }
+
+  /**
+   * Clear the focus color
+   * @param id - The id of the item
+   * @param color - The color for the item
+   */
+  @autobind
+  private _clearFocusColorOnMenuItem(id?: string, color?: string) {
+    this._clearColors([this.props.onCellFocused]);
+  }
+
+  /**
+   * onClick Handler for the button
+   */
+  @autobind
+  private _onButtonClick() {
+    if (this.props.disabled) {
+      return;
+    }
+
+    if (this.state.expanded) {
+      this._onDismiss();
+    }
+
+    this.setState({
+      expanded: this.props.disabled ? false : !this.state.expanded
+    });
+  }
+
+  /**
+   * Render the menu (callout) for when the swatch color picker
+   * is behind a button and is expanded
+   */
+  @autobind
+  private _onRenderContainer() {
+    return (
+      <Callout
+        isBeakVisible={ false }
+        gapSpace={ 0 }
+        doNotLayer={ false }
+        role={ 'menu' }
+        directionalHint={ DirectionalHint.bottomLeftEdge }
+        className={ css('ms-swatchColorPickerMenu', styles.swatchColorPickerContainer) }
+        targetElement={ this._buttonWrapper }
+        onDismiss={ this._onDismiss }
+        setInitialFocus={ true }>
+        <SwatchColorPickerBody
+          { ...this.props }
+          onRenderItems={ this._onRenderItems }
+        />
+      </Callout>
+    );
+  }
+
+  /**
+   * Handle dismissing the menu
+   */
+  @autobind
+  private _onDismiss() {
+    this._clearColors([this.props.onCellHovered, this.props.onCellFocused]);
+
+    this.setState({
+      expanded: false
+    });
+  }
+}
+
+interface IMenuButtonProps extends IButtonProps {
+  /**
+   * The CSS-compatible string to describe the color to set
+   * for the button
+   */
+  color?: string;
+
+  /**
+   * Is the menuButton expanded?
+   */
+  expanded: boolean;
+
+  /**
+   * Is the menuButton disabled>
+   */
+  disabled?: boolean;
+
+  /**
+   * OnClick handler
+   */
+  onClick: () => void;
+
+  /**
+   * Callback for rendering the expanded container
+   */
+  onRenderContainer: () => JSX.Element;
+
+  /**
+   * Optional, ButtonProps for the menuButton
+   */
+  menuButtonProps?: IButtonProps;
+}
+
+class SwatchColorPickerMenuButton extends BaseComponent<IMenuButtonProps, {}> {
+  public static defaultProps = {
+    expanded: false,
+    disabled: false
+  };
+
+  public render() {
+    let {
+      color,
+      expanded,
+      disabled,
+      onClick,
+      onRenderContainer,
+      menuIconProps,
+      menuButtonProps
+    } = this.props;
+    return (
+      <div>
+        <DefaultButton
+          { ...menuButtonProps }
+          style={ { color: color && color } }
+          className={
+            css('ms-swatchColorPickerButton',
+              {
+                'is-expanded': expanded
+              }
+            )
+          }
+          onClick={ onClick }
+          aria-haspopup={ true }
+          aria-expanded={ !disabled && expanded }
+          disabled={ disabled }
+          menuIconProps={ menuIconProps ?
+            menuIconProps :
+            { iconName: 'chevronDown' } }
+        />
+        { (!disabled && expanded) &&
+          onRenderContainer()
+        }
+      </div>
+    );
+  }
+}
+
+interface ISwatchColorPickerBodyProps {
+  swatchColorPickerItems: ISwatchColorPickerItemProps[];
+  columnCount: number;
+  onRenderItems: (items: ISwatchColorPickerItemProps[]) => JSX.Element[];
+}
+
+class SwatchColorPickerBody extends BaseComponent<ISwatchColorPickerBodyProps, {}> {
+  public render() {
+    let {
+      swatchColorPickerItems,
+      columnCount,
+      onRenderItems
+    } = this.props;
+    return (
+      <FocusZone
+        isCircularNavigation={ true }
+        className={ css('ms-swatchColorPickerBodyContainer', styles.swatchColorPickerContainer) }
+      >
+        { onRenderItems(swatchColorPickerItems.map((item, index) => { return { ...item, index }; })) }
+      </FocusZone>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx
new file mode 100644
index 0000000000000..db248d82ee604
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx
@@ -0,0 +1,59 @@
+import * as React from 'react';
+import {
+  ExampleCard,
+  IComponentDemoPageProps,
+  ComponentPage,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+import { SwatchColorPickerBasicExample } from './examples/SwatchColorPicker.Basic.Example';
+
+const SwatchColorPickerBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx') as string;
+
+export class SwatchColorPickerPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render() {
+    return (
+      <ComponentPage
+        title='SwatchColorPicker'
+        componentName='SwatchColorPickerExample'
+        exampleCards={
+          <ExampleCard title='SwatchColorPicker' code={ SwatchColorPickerBasicExampleCode }>
+            <SwatchColorPickerBasicExample />
+          </ExampleCard>
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts')
+            ] }
+          />
+        }
+        overview={
+          <div>
+            <p>
+              A SwatchColorPicker is a list of colors displayed as a grid as options for the user. It can be displayed by itself, with header and/or dividers, or as a button which expands to show the swatch color picker
+            </p>
+          </div>
+        }
+        dos={
+          <div>
+            <ul>
+              <li>Use a SwatchColorPicker when there are multiple finite choices that can be grouped and/or collapsed under one title.</li>
+              <li>SwatchColorPickers contain a grid of colors.</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul>
+              <li>Do not use a SwatchColorPicker when there are a a very large number of color choices. The best component for to that is a ColorPicker.</li>
+            </ul>
+          </div>
+        }
+        related={
+          <a href='https://dev.office.com/fabric-js/Components/SwatchColorPicker/SwatchColorPicker.html'>Fabric JS</a>
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }>
+      </ComponentPage>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
new file mode 100644
index 0000000000000..11a655f92cd70
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
@@ -0,0 +1,193 @@
+import * as React from 'react';
+import {
+  SwatchColorPicker,
+  SwatchColorPickerItemType
+} from 'office-ui-fabric-react/lib/SwatchColorPicker';
+
+export interface IBasicSwatchColorPickerExampleState {
+  color: string;
+  previewColor: string;
+}
+
+export class SwatchColorPickerBasicExample extends React.Component<any, IBasicSwatchColorPickerExampleState> {
+
+  private width: number = 4;
+
+  constructor(props: any) {
+    super(props);
+
+    this.state = {
+      color: null,
+      previewColor: null
+    };
+  }
+  public render() {
+
+    return (
+      <div>
+        <div>Simple swatch color picker:</div>
+        <SwatchColorPicker
+          columnCount={ 4 }
+          cellShape={ 'circle' }
+          swatchColorPickerItems={
+            [
+              { id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00' },
+              { id: 'b', label: 'orange', type: SwatchColorPickerItemType.Cell, color: '#ffa500' },
+              { id: 'c', label: 'blue', type: SwatchColorPickerItemType.Cell, color: '#0000ff' },
+              { id: 'd', label: 'red', type: SwatchColorPickerItemType.Cell, color: '#ff0000' }
+            ]
+          } />
+        <div style={ { height: '235px', position: 'relative' } }>
+          <div>Simple swatch color picker with multiple sections:</div>
+          <SwatchColorPicker
+            columnCount={ this.width }
+            cellShape={ 'circle' }
+            swatchColorPickerItems={
+              [
+                { id: '0', label: 'Colors', type: SwatchColorPickerItemType.Header },
+                { id: 'd1', type: SwatchColorPickerItemType.Divider },
+                { id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00' },
+                { id: 'b', label: 'orange', type: SwatchColorPickerItemType.Cell, color: '#ffa500' },
+                { id: 'c', label: 'blue', type: SwatchColorPickerItemType.Cell, color: '#0000ff' },
+                { id: 'd', label: 'red', type: SwatchColorPickerItemType.Cell, color: '#ff0000' },
+                { id: 'e', type: SwatchColorPickerItemType.Divider },
+                { id: 'f', label: 'More Colors', type: SwatchColorPickerItemType.Header },
+                { id: 'd2', type: SwatchColorPickerItemType.Divider },
+                { id: 'g', label: 'green', type: SwatchColorPickerItemType.Cell, color: 'green' },
+                { id: 'h', label: 'orange', type: SwatchColorPickerItemType.Cell, color: 'orange' },
+                { id: 'i', label: 'blue', type: SwatchColorPickerItemType.Cell, color: 'blue' },
+                { id: 'j', label: 'red', type: SwatchColorPickerItemType.Cell, color: 'red' },
+                { id: 'k', label: 'black', type: SwatchColorPickerItemType.Cell, color: 'black' },
+                { id: 'l', label: 'grey', type: SwatchColorPickerItemType.Cell, color: 'grey' },
+                { id: 'm', label: 'purple', type: SwatchColorPickerItemType.Cell, color: 'purple' },
+                { id: 'n', label: 'yellow', type: SwatchColorPickerItemType.Cell, color: 'yellow' }
+
+              ]
+            } />
+        </div>
+        <div>Simple expandable swatch color picker with multiple sections:</div>
+        <SwatchColorPicker
+          menuButtonProps={ { iconProps: { iconName: 'color' }, menuIconProps: { iconName: 'add' } } }
+          columnCount={ 4 }
+          cellShape={ 'square' }
+          swatchColorPickerItems={
+            [
+              { id: '0', label: 'Colors', type: SwatchColorPickerItemType.Header },
+              { id: 'd1', type: SwatchColorPickerItemType.Divider },
+              { id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00' },
+              { id: 'b', label: 'orange', type: SwatchColorPickerItemType.Cell, color: '#ffa500' },
+              { id: 'c', label: 'blue', type: SwatchColorPickerItemType.Cell, color: '#0000ff' },
+              { id: 'd', label: 'red', type: SwatchColorPickerItemType.Cell, color: '#ff0000' },
+              { id: 'e', type: SwatchColorPickerItemType.Divider },
+              { id: 'f', label: 'More Colors', type: SwatchColorPickerItemType.Header },
+              { id: 'd2', type: SwatchColorPickerItemType.Divider },
+              { id: 'g', label: 'green', type: SwatchColorPickerItemType.Cell, color: 'green' },
+              { id: 'h', label: 'orange', type: SwatchColorPickerItemType.Cell, color: 'orange' },
+              { id: 'i', label: 'blue', type: SwatchColorPickerItemType.Cell, color: 'blue' },
+              { id: 'j', label: 'red', type: SwatchColorPickerItemType.Cell, color: 'red' },
+              { id: 'k', type: SwatchColorPickerItemType.Divider },
+              { id: 'l', label: 'Find Colors', type: SwatchColorPickerItemType.MenuItem },
+              { id: 'm', label: 'Find More Colors', type: SwatchColorPickerItemType.MenuItem, menuItemButtonProps: { iconProps: { iconName: 'glasses' } } },
+              { id: 'n', label: '...More Colors...', type: SwatchColorPickerItemType.MenuItem },
+              { id: 'o', label: 'Find Even More Colors', type: SwatchColorPickerItemType.MenuItem, menuItemButtonProps: { iconProps: { iconName: 'redEye' } } }
+            ]
+          } />
+        <div>Simple expandable swatch color picker with multiple sections that updates it's icon color:</div>
+        <SwatchColorPicker
+          menuButtonProps={ { iconProps: { iconName: 'fontColor' }, title: 'Font Color' } }
+          setSelectedColorForIcon={ true }
+          columnCount={ 4 }
+          cellShape={ 'circle' }
+          swatchColorPickerItems={
+            [
+              { id: '0', label: 'Colors', type: SwatchColorPickerItemType.Header },
+              { id: 'd1', type: SwatchColorPickerItemType.Divider },
+              { id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00' },
+              { id: 'b', label: 'orange', type: SwatchColorPickerItemType.Cell, color: '#ffa500' },
+              { id: 'c', label: 'blue', type: SwatchColorPickerItemType.Cell, color: '#0000ff' },
+              { id: 'd', label: 'red', type: SwatchColorPickerItemType.Cell, color: '#ff0000' },
+              { id: 'e', type: SwatchColorPickerItemType.Divider },
+              { id: 'f', label: 'More Colors', type: SwatchColorPickerItemType.Header },
+              { id: 'd2', type: SwatchColorPickerItemType.Divider },
+              { id: 'g', label: 'green', type: SwatchColorPickerItemType.Cell, color: 'green' },
+              { id: 'h', label: 'orange', type: SwatchColorPickerItemType.Cell, color: 'orange' },
+              { id: 'i', label: 'blue', type: SwatchColorPickerItemType.Cell, color: 'blue' },
+              { id: 'j', label: 'red', type: SwatchColorPickerItemType.Cell, color: 'red' },
+              { id: 'k', label: 'black', type: SwatchColorPickerItemType.Cell, color: 'black' },
+              { id: 'l', label: 'grey', type: SwatchColorPickerItemType.Cell, color: 'grey' },
+              { id: 'm', label: 'purple', type: SwatchColorPickerItemType.Cell, color: 'purple' },
+              { id: 'n', label: 'yellow', type: SwatchColorPickerItemType.Cell, color: 'yellow' },
+              { id: 'o', label: 'Find More Colors', type: SwatchColorPickerItemType.MenuItem, menuItemButtonProps: { iconProps: { iconName: 'glasses' } } }
+            ]
+          } />
+        <div>Simple expandable swatch color picker with multiple sections that updates it's icon color and shows a preview color:</div>
+        <div style={ { color: this.state.previewColor ? this.state.previewColor : this.state.color ? this.state.color : null, fontSize: '24px' } } >Sample Text</div>
+        <SwatchColorPicker
+          menuButtonProps={ { iconProps: { iconName: 'fontColor' }, title: 'Font Color' } }
+          setSelectedColorForIcon={ true }
+          onCellHovered={ (id, color) => this.setState({ previewColor: color }) }
+          onCellFocused={ (id, color) => this.setState({ previewColor: color }) }
+          onColorChanged={ (id, newColor) => this.setState({ color: newColor }) }
+          onMenuItemClick={ (item) => item.label && alert(item.label + ' was clicked') }
+          columnCount={ 4 }
+          cellShape={ 'circle' }
+          swatchColorPickerItems={
+            [
+              { id: '0', label: 'Colors', type: SwatchColorPickerItemType.Header },
+              { id: 'd1', type: SwatchColorPickerItemType.Divider },
+              { id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00' },
+              { id: 'b', label: 'orange', type: SwatchColorPickerItemType.Cell, color: '#ffa500' },
+              { id: 'c', label: 'blue', type: SwatchColorPickerItemType.Cell, color: '#0000ff' },
+              { id: 'd', label: 'red', type: SwatchColorPickerItemType.Cell, color: '#ff0000' },
+              { id: 'e', type: SwatchColorPickerItemType.Divider },
+              { id: 'f', label: 'More Colors', type: SwatchColorPickerItemType.Header },
+              { id: 'd2', type: SwatchColorPickerItemType.Divider },
+              { id: 'g', label: 'green', type: SwatchColorPickerItemType.Cell, color: 'green' },
+              { id: 'h', label: 'orange', type: SwatchColorPickerItemType.Cell, color: 'orange' },
+              { id: 'i', label: 'blue', type: SwatchColorPickerItemType.Cell, color: 'blue' },
+              { id: 'j', label: 'red', type: SwatchColorPickerItemType.Cell, color: 'red' },
+              { id: 'k', label: 'black', type: SwatchColorPickerItemType.Cell, color: 'black' },
+              { id: 'l', label: 'grey', type: SwatchColorPickerItemType.Cell, color: 'grey' },
+              { id: 'm', label: 'purple', type: SwatchColorPickerItemType.Cell, color: 'purple' },
+              { id: 'n', label: 'yellow', type: SwatchColorPickerItemType.Cell, color: 'yellow' },
+              { id: 'o', label: 'Find More Colors', type: SwatchColorPickerItemType.MenuItem, menuItemButtonProps: { iconProps: { iconName: 'glasses' } } }
+
+            ]
+          } />
+        <div>Simple disabled swatch color picker:</div>
+        <SwatchColorPicker
+          menuButtonProps={ { iconProps: { iconName: 'fontColor' }, menuIconProps: { iconName: 'chevronDown' } } }
+          disabled={ true }
+          columnCount={ 4 }
+          cellShape={ 'square' }
+          swatchColorPickerItems={
+            [
+              { id: '0', label: 'Colors', type: SwatchColorPickerItemType.Header },
+              { id: 'd1', type: SwatchColorPickerItemType.Divider },
+              { id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00' },
+              { id: 'b', label: 'orange', type: SwatchColorPickerItemType.Cell, color: '#ffa500', disabled: true },
+              { id: 'c', label: 'blue', type: SwatchColorPickerItemType.Cell, color: '#0000ff' },
+              { id: 'd', label: 'red', type: SwatchColorPickerItemType.Cell, color: '#ff0000', disabled: true },
+            ]
+          } />
+        <div>Simple expandable swatch color picker with a few disabled items:</div>
+        <SwatchColorPicker
+          menuButtonProps={ { iconProps: { iconName: 'fontColor' }, menuIconProps: { iconName: 'chevronDown' } } }
+          columnCount={ 4 }
+          cellShape={ 'square' }
+          swatchColorPickerItems={
+            [
+              { id: '0', label: 'Colors', type: SwatchColorPickerItemType.Header },
+              { id: 'd1', type: SwatchColorPickerItemType.Divider },
+              { id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00' },
+              { id: 'b', label: 'orange', type: SwatchColorPickerItemType.Cell, color: '#ffa500', disabled: true },
+              { id: 'c', label: 'blue', type: SwatchColorPickerItemType.Cell, color: '#0000ff' },
+              { id: 'd', label: 'red', type: SwatchColorPickerItemType.Cell, color: '#ff0000', disabled: true },
+              { id: 'e', label: 'Find Colors', type: SwatchColorPickerItemType.MenuItem, menuItemButtonProps: { iconProps: { iconName: 'glasses' } }, disabled: true },
+              { id: 'f', label: 'Find More Colors', type: SwatchColorPickerItemType.MenuItem, menuItemButtonProps: { iconProps: { iconName: 'redEye' } } }
+            ]
+          } />
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/index.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/index.ts
new file mode 100644
index 0000000000000..bd4c0cd6256cd
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/index.ts
@@ -0,0 +1,2 @@
+export * from './SwatchColorPicker';
+export * from './SwatchColorPicker.Props';
diff --git a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
index f7deda39eb3fe..cd653b321a8d5 100644
--- a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
+++ b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
@@ -220,6 +220,12 @@ export const AppDefinition: IAppDefinition = {
           name: 'Spinner',
           url: '#/examples/spinner'
         },
+        {
+          component: require<any>('../components/SwatchColorPicker/SwatchColorPickerPage').SwatchColorPickerPage,
+          key: 'SwatchColorPicker',
+          name: 'SwatchColorPicker',
+          url: '#/examples/swatchcolorpicker'
+        },
         {
           component: require<any>('../components/TeachingBubble/TeachingBubblePage').TeachingBubblePage,
           key: 'TeachingBubble',
diff --git a/packages/office-ui-fabric-react/src/index.ts b/packages/office-ui-fabric-react/src/index.ts
index 16af66b8fe2fd..e218d95db4d97 100644
--- a/packages/office-ui-fabric-react/src/index.ts
+++ b/packages/office-ui-fabric-react/src/index.ts
@@ -46,6 +46,7 @@ export * from './Slider';
 export * from './SpinButton';
 export * from './Spinner';
 export * from './Styling';
+export * from './SwatchColorPicker';
 export * from './TeachingBubble';
 export * from './TextField';
 export * from './Toggle';
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.Props.ts b/packages/office-ui-fabric-react/src/utilities/grid/Grid.Props.ts
new file mode 100644
index 0000000000000..e1cd90834ce33
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.Props.ts
@@ -0,0 +1,27 @@
+export interface IGridProps {
+
+  /**
+   * The items to turn into a grid
+   */
+  items: any[];
+
+  /**
+   * The number of columns
+   */
+  columnCount: number;
+
+  /**
+   * Custom renderer for the individual items
+   */
+  onRenderItem: (item: any, index: number) => JSX.Element;
+
+  /**
+   * The optional position this grid is in the parent set (index in a parent menu, for example)
+   */
+  positionInSet?: number;
+
+  /**
+   * The optional size of the parent set (size of parent menu, for example)
+   */
+  setSize?: number;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx b/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx
new file mode 100644
index 0000000000000..b0b0e54b95dad
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx
@@ -0,0 +1,64 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+/* tslint:enable:no-unused-variable */
+import { Grid } from './Grid';
+import { DefaultButton } from '../../Button';
+import { shallow } from 'enzyme';
+
+let { expect } = chai;
+
+const DEFAULT_ITEMS: any[] = [
+  { id: 'a', text: '0,0' },
+  { id: 'b', text: '1,0' },
+  { id: 'c', text: '2,0' },
+  { id: 'd', text: '3,0' },
+  { id: 'e', text: '0,1' },
+  { id: 'f', text: '1,1' },
+  { id: 'g', text: '2,1' },
+  { id: 'h', text: '3,1' }
+];
+
+describe('Grid', () => {
+
+  it('Can render a grid with width of four', () => {
+    let wrapper = shallow(<Grid
+      items={ DEFAULT_ITEMS }
+      columnCount={ 4 }
+      onRenderItem={ (item: any, index: number) => { return <DefaultButton role='gridcell'>item.text</DefaultButton>; } }
+    />);
+    expect(wrapper.find('table[role="grid"]').length).to.equal(1, 'expect to have one table with role="grid"');
+    expect(wrapper.find('tr[role="row"]').length).to.equal(2, 'expect to have 2 rows with role="row"');
+    expect(wrapper.find('td [role="gridcell"]').length).to.equal(8, 'expect to have 8 cells with role="gridcell"');
+    expect(wrapper.find('[aria-posinset]').length).to.equal(0, 'expect to not have aria-posinset set');
+    expect(wrapper.find('[aria-setsize]').length).to.equal(0, 'expect to not have aria-setsize set');
+  });
+  it('Can render a grid with width of 2', () => {
+    let wrapper = shallow(<Grid
+      items={ DEFAULT_ITEMS }
+      columnCount={ 2 }
+      onRenderItem={ (item: any, index: number) => { return <DefaultButton role='gridcell'>item.text</DefaultButton>; } }
+    />);
+    expect(wrapper.find('table[role="grid"]').length).to.equal(1, 'expect to have one table with role="grid"');
+    expect(wrapper.find('tr[role="row"]').length).to.equal(4, 'expect to have 2 rows with role="row"');
+    expect(wrapper.find('td [role="gridcell"]').length).to.equal(8, 'expect to have 8 cells with role="gridcell"');
+    expect(wrapper.find('[aria-posinset]').length).to.equal(0, 'expect to not have aria-posinset set');
+    expect(wrapper.find('[aria-setsize]').length).to.equal(0, 'expect to not have aria-setsize set');
+  });
+  it('Can render a grid with posInSet and setSize', () => {
+    let wrapper = shallow(<Grid
+      items={ DEFAULT_ITEMS }
+      columnCount={ 2 }
+      onRenderItem={ (item: any, index: number) => { return <DefaultButton role='gridcell'>item.text</DefaultButton>; } }
+      positionInSet={ 1 }
+      setSize={ 2 }
+    />);
+    expect(wrapper.find('table[role="grid"]').length).to.equal(1, 'expect to have one table with role="grid"');
+    expect(wrapper.find('tr[role="row"]').length).to.equal(4, 'expect to have 2 rows with role="row"');
+    expect(wrapper.find('td [role="gridcell"]').length).to.equal(8, 'expect to have 8 cells with role="gridcell"');
+    expect(wrapper.find('[aria-posinset]').length).to.equal(1, 'expect to have aria-posinset set');
+    expect(wrapper.find('[aria-posinset]').html()).to.contain('aria-posinset="1"', 'expect aria-posinset to be 1');
+    expect(wrapper.find('[aria-setsize]').length).to.equal(1, 'expect to have aria-setsize set');
+    expect(wrapper.find('[aria-posinset]').html()).to.contain('aria-setsize="2"', 'expect aria-setsize to be 2');
+  });
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx b/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
new file mode 100644
index 0000000000000..3caad77bd91c0
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
@@ -0,0 +1,59 @@
+import * as React from 'react';
+import { BaseComponent, getId, toMatrix } from '../../Utilities';
+import { IGridProps } from './Grid.Props';
+
+export class Grid extends BaseComponent<IGridProps, {}> {
+
+  private _id;
+
+  constructor(props: IGridProps) {
+    super(props);
+    this._id = getId();
+  }
+
+  public render() {
+    let {
+      items,
+      columnCount,
+      onRenderItem,
+      positionInSet,
+      setSize
+    } = this.props;
+
+    // Array to store the cells in the correct row index
+    let rowsOfItems: any[][] = toMatrix(items, columnCount);
+
+    // Create the table/grid
+    return (
+      <table
+        id={ this._id }
+        role={ 'grid' }
+        aria-posinset={ positionInSet }
+        aria-setsize={ setSize }
+        style={ { padding: '2px', outline: 'none' } }>
+        <tbody>
+          {
+            rowsOfItems.map((rows: any[], rowIndex) => {
+              return (
+                <tr
+                  role={ 'row' }
+                  key={ this._id + '-' + rowIndex + '-row' }>
+                  { rows.map((cell) => {
+                    return (
+                      <td
+                        role={ 'presentation' }
+                        key={ this._id + '-' + cell.index + '-cell' }
+                        style={ { padding: '0px' } }>
+                        { onRenderItem(cell, cell.index) }
+                      </td>
+                    );
+                  }) }
+                </tr>
+              );
+            })
+          }
+        </tbody>
+      </table>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/index.ts b/packages/office-ui-fabric-react/src/utilities/grid/index.ts
new file mode 100644
index 0000000000000..9329c17be35ce
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/utilities/grid/index.ts
@@ -0,0 +1,2 @@
+export * from './Grid';
+export * from './Grid.Props';
\ No newline at end of file
diff --git a/packages/utilities/api/utilities.api.ts b/packages/utilities/api/utilities.api.ts
index 463984175d645..143ebc49fbe34 100644
--- a/packages/utilities/api/utilities.api.ts
+++ b/packages/utilities/api/utilities.api.ts
@@ -393,6 +393,8 @@ export function setMemoizeWeakMap(weakMap: any): void;
 
 export function setWarningCallback(warningCallback?: (message: string) => void): void;
 
+export function toMatrix < T >(items: T[], columnCount: number): T[][];
+
 export function unhoistMethods(source: any, methodNames: string[]): void;
 
 export function warn(message: string): void;
diff --git a/packages/utilities/src/array.ts b/packages/utilities/src/array.ts
index 59389c301ca0a..cd487b59b8c4e 100644
--- a/packages/utilities/src/array.ts
+++ b/packages/utilities/src/array.ts
@@ -20,3 +20,21 @@ export function createArray(size: number, getItem: (index?: number) => any) {
 
   return array;
 }
+
+/**
+ * Convert the given array to a matrix with columnCount number
+ * of columns
+ * @param items - The array to convert
+ * @param columnCount - The number of columns for the resulting matrix
+ * @returns {any[][]} - A matrix of items
+ */
+export function toMatrix<T>(items: T[], columnCount: number): T[][] {
+  return items.reduce((rows, currentValue, index) => {
+    if (index % columnCount === 0) {
+      rows.push([currentValue]);
+    } else {
+      rows[rows.length - 1].push(currentValue);
+    }
+    return rows;
+  }, [] as T[][]);
+}

From e14cbc6853a732e6393bf8a55e80154e55a3a96c Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 29 Jun 2017 08:08:23 -0700
Subject: [PATCH 0189/1641] Update TextField.Props.ts

---
 .../src/components/TextField/TextField.Props.ts                 | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts b/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts
index c2bd028ff60a7..d4f709035f9a6 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts
@@ -151,7 +151,7 @@ export interface ITextFieldProps extends React.HTMLAttributes<HTMLInputElement |
   deferredValidationTime?: number;
 
   /**
-   * Optional class anme that is added to the container of the component.
+   * Optional class name that is added to the container of the component.
    */
   className?: string;
 

From b13f997161fa7657464df6d2c89f4100cf5325ec Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Thu, 29 Jun 2017 08:51:07 -0700
Subject: [PATCH 0190/1641] ComboBox: Fix scrolling issue (#2092)

* Fix a scrollIntoView bug for expanded comboBoxes (Combobox: Can't select some options in controlled Combobox #2090)

* Removing extra/unneeded change files

* Update jspurlin-ComboBoxScrollIntoViewFix_--2090-_2017-06-29-13-27.json
---
 ...BoxScrollIntoViewFix_--2090-_2017-06-29-13-27.json | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.tsx              |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxScrollIntoViewFix_--2090-_2017-06-29-13-27.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxScrollIntoViewFix_--2090-_2017-06-29-13-27.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxScrollIntoViewFix_--2090-_2017-06-29-13-27.json
new file mode 100644
index 0000000000000..8553300467375
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxScrollIntoViewFix_--2090-_2017-06-29-13-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Fix a scrolling issue (#2090)",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 6aa96b2d66c8b..fea086c480db6 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -154,9 +154,9 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       selectedIndex
     } = this.state;
 
-    // If we are open, make sure the currently
+    // If we are newly open, make sure the currently
     // selected option is scrolled into view
-    if (isOpen) {
+    if (!prevState.isOpen && isOpen) {
       this._scrollIntoView();
     }
 

From e1795515b14b2dc26fce6901bae472ee81be5a27 Mon Sep 17 00:00:00 2001
From: Glen Chao <glenchao@outlook.com>
Date: Thu, 29 Jun 2017 12:53:20 -0700
Subject: [PATCH 0191/1641] Fix details list custom columns example (#2100)

* Fix onColumnClick function params mismatch

* Add change request file
---
 ...ailsListCustomColumnsExample_2017-06-29-19-29.json | 11 +++++++++++
 .../examples/DetailsList.CustomColumns.Example.tsx    |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/FixDetailsListCustomColumnsExample_2017-06-29-19-29.json

diff --git a/common/changes/office-ui-fabric-react/FixDetailsListCustomColumnsExample_2017-06-29-19-29.json b/common/changes/office-ui-fabric-react/FixDetailsListCustomColumnsExample_2017-06-29-19-29.json
new file mode 100644
index 0000000000000..431a6470c301d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/FixDetailsListCustomColumnsExample_2017-06-29-19-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add 'event' as first param for onColumnClick handler to match the param order.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "glenchao@outlook.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
index 33d0236ad9e63..af1f97fb5564a 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
@@ -46,7 +46,7 @@ export class DetailsListCustomColumnsExample extends React.Component<{}, IDetail
     );
   }
 
-  private _onColumnClick(column) {
+  private _onColumnClick(event, column) {
     let { sortedItems, columns } = this.state;
     let isSortedDescending = column.isSortedDescending;
 

From 33dc46bdd08c3e6020e74ef8f472435982dc75c0 Mon Sep 17 00:00:00 2001
From: Eddie Liu <leddie24@gmail.com>
Date: Thu, 29 Jun 2017 13:08:00 -0700
Subject: [PATCH 0192/1641] Dropdown/ContextualMenu: Adjust height of
 contextual menu and dropdown items (#2098)

* Adjust height of contextual menu and dropdown items to 32px from 36px.

* change file
---
 ...u-dropdown-contextual-height_2017-06-29-18-05.json | 11 +++++++++++
 .../src/components/ContextualMenu/ContextualMenu.scss |  2 +-
 .../src/components/Dropdown/Dropdown.scss             |  4 ++--
 3 files changed, 14 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-edwliu-dropdown-contextual-height_2017-06-29-18-05.json

diff --git a/common/changes/office-ui-fabric-react/v-edwliu-dropdown-contextual-height_2017-06-29-18-05.json b/common/changes/office-ui-fabric-react/v-edwliu-dropdown-contextual-height_2017-06-29-18-05.json
new file mode 100644
index 0000000000000..8686a40137967
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-edwliu-dropdown-contextual-height_2017-06-29-18-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown/ContextualMenu: Adjust height of items to 32px",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-edwliu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.scss b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.scss
index 57bdaf8546ef1..624f2f8905fc9 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.scss
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.scss
@@ -2,7 +2,7 @@
 
 
 
-$ContextualMenu-itemHeight: 36px;
+$ContextualMenu-itemHeight: 32px;
 $ContextualMenu-iconWidth: 14px;
 
 // component slots
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
index 8b0c1dd5cc9c8..c3ef234a0f696 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
@@ -10,7 +10,7 @@
 $Dropdown-selectedItem-bg: $ms-color-neutralQuaternaryAlt;
 $Dropdown-selectedItem-hover-bg: $ms-color-neutralLighter;
 $DropDown-height: 32px;
-$DropDown-item-height: 36px;
+$DropDown-item-height: 32px;
 
 // Mixin for high contrast mode link states
 @mixin highContrastListItemState {
@@ -203,7 +203,7 @@ $DropDown-item-height: 36px;
   height: auto;
   min-height: $DropDown-item-height;
   line-height: 20px;
-  padding: 5px 16px;
+  padding: 4px 16px;
   position: relative;
   border: 1px solid transparent;
   word-wrap: break-word;

From cc4513adf60d290214512c5e518dd9823a15acda Mon Sep 17 00:00:00 2001
From: Christopher Schleiden <cschleiden@live.de>
Date: Thu, 29 Jun 2017 13:23:50 -0700
Subject: [PATCH 0193/1641] Button: Revert font-weight change to semi-bold
 (#2095)

* Button: Revert font-weight change to semi-bold

* Remove trailing comma

* Add change file, fix build break
---
 .../cschleiden-patch-1_2017-06-29-18-03.json          | 11 +++++++++++
 .../Button/DefaultButton/DefaultButton.styles.ts      |  6 +++---
 2 files changed, 14 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/cschleiden-patch-1_2017-06-29-18-03.json

diff --git a/common/changes/office-ui-fabric-react/cschleiden-patch-1_2017-06-29-18-03.json b/common/changes/office-ui-fabric-react/cschleiden-patch-1_2017-06-29-18-03.json
new file mode 100644
index 0000000000000..bb4cb61afad9d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/cschleiden-patch-1_2017-06-29-18-03.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Button: Revert setting label font-weight to bold",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "cschleid@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
index 6a005bd8194d5..fd1a2b310bacc 100644
--- a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
@@ -1,7 +1,8 @@
 import { IButtonStyles } from '../Button.Props';
 import {
   ITheme,
-  mergeStyleSets
+  mergeStyleSets,
+  FontWeights
 } from '../../../Styling';
 import { memoizeFunction } from '../../../Utilities';
 import {
@@ -43,9 +44,8 @@ export const getStyles = memoizeFunction((
     },
 
     label: {
-      fontWeight: 'bold' // theme.fontWeights.semibold,
+      fontWeight: FontWeights.semibold
     }
-
   };
 
   return mergeStyleSets(baseButtonStyles, defaultButtonStyles, customStyles);

From b84938de8079d07a3d51eaf6becfedca5cae46bc Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 29 Jun 2017 20:48:32 +0000
Subject: [PATCH 0194/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  4 +-
 ...in-SimpleColorPicker_2017-06-27-01-50.json | 11 -----
 ...in-SimpleColorPicker_2017-06-27-01-50.json | 11 -----
 ...in-SimpleColorPicker_2017-06-27-01-50.json | 11 -----
 ...in-SimpleColorPicker_2017-06-27-01-50.json | 11 -----
 ...CustomColumnsExample_2017-06-29-19-29.json | 11 -----
 .../cschleiden-patch-1_2017-06-29-18-03.json  | 11 -----
 ...lIntoViewFix_--2090-_2017-06-29-13-27.json | 11 -----
 ...in-SimpleColorPicker_2017-06-27-01-50.json | 11 -----
 ...wn-contextual-height_2017-06-29-18-05.json | 11 -----
 packages/example-app-base/package.json        |  4 +-
 packages/example-component/package.json       |  6 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 44 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 16 ++++++-
 packages/office-ui-fabric-react/package.json  |  6 +--
 packages/styling/CHANGELOG.json               | 12 +++++
 packages/styling/CHANGELOG.md                 |  7 ++-
 packages/styling/package.json                 |  4 +-
 packages/utilities/CHANGELOG.json             | 14 ++++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  2 +-
 21 files changed, 112 insertions(+), 115 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
 delete mode 100644 common/changes/@uifabric/fabric-website/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
 delete mode 100644 common/changes/@uifabric/styling/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
 delete mode 100644 common/changes/@uifabric/utilities/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
 delete mode 100644 common/changes/office-ui-fabric-react/FixDetailsListCustomColumnsExample_2017-06-29-19-29.json
 delete mode 100644 common/changes/office-ui-fabric-react/cschleiden-patch-1_2017-06-29-18-03.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxScrollIntoViewFix_--2090-_2017-06-29-13-27.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-edwliu-dropdown-contextual-height_2017-06-29-18-05.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index a357ebe5dce5b..05dccac58f38e 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -48,12 +48,12 @@
   },
   "dependencies": {
     "@uifabric/example-app-base": "4.0.1",
-    "@uifabric/utilities": ">=4.4.2 <5.0.0",
+    "@uifabric/utilities": ">=4.5.0 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.12.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.12.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/jspurlin-SimpleColorPicker_2017-06-27-01-50.json b/common/changes/@uifabric/example-app-base/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
deleted file mode 100644
index f982888ed04aa..0000000000000
--- a/common/changes/@uifabric/example-app-base/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/jspurlin-SimpleColorPicker_2017-06-27-01-50.json b/common/changes/@uifabric/fabric-website/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
deleted file mode 100644
index 7d8a12b6371b6..0000000000000
--- a/common/changes/@uifabric/fabric-website/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/jspurlin-SimpleColorPicker_2017-06-27-01-50.json b/common/changes/@uifabric/styling/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
deleted file mode 100644
index b97431956ffe2..0000000000000
--- a/common/changes/@uifabric/styling/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/jspurlin-SimpleColorPicker_2017-06-27-01-50.json b/common/changes/@uifabric/utilities/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
deleted file mode 100644
index 91318d0b7f35d..0000000000000
--- a/common/changes/@uifabric/utilities/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Adding a new Grid utility",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/FixDetailsListCustomColumnsExample_2017-06-29-19-29.json b/common/changes/office-ui-fabric-react/FixDetailsListCustomColumnsExample_2017-06-29-19-29.json
deleted file mode 100644
index 431a6470c301d..0000000000000
--- a/common/changes/office-ui-fabric-react/FixDetailsListCustomColumnsExample_2017-06-29-19-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add 'event' as first param for onColumnClick handler to match the param order.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "glenchao@outlook.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/cschleiden-patch-1_2017-06-29-18-03.json b/common/changes/office-ui-fabric-react/cschleiden-patch-1_2017-06-29-18-03.json
deleted file mode 100644
index bb4cb61afad9d..0000000000000
--- a/common/changes/office-ui-fabric-react/cschleiden-patch-1_2017-06-29-18-03.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Button: Revert setting label font-weight to bold",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "cschleid@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxScrollIntoViewFix_--2090-_2017-06-29-13-27.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxScrollIntoViewFix_--2090-_2017-06-29-13-27.json
deleted file mode 100644
index 8553300467375..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxScrollIntoViewFix_--2090-_2017-06-29-13-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Fix a scrolling issue (#2090)",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/jspurlin-SimpleColorPicker_2017-06-27-01-50.json b/common/changes/office-ui-fabric-react/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
deleted file mode 100644
index 2cb09d45030e2..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-SimpleColorPicker_2017-06-27-01-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Adding a new component: SwatchColorPicker",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-edwliu-dropdown-contextual-height_2017-06-29-18-05.json b/common/changes/office-ui-fabric-react/v-edwliu-dropdown-contextual-height_2017-06-29-18-05.json
deleted file mode 100644
index 8686a40137967..0000000000000
--- a/common/changes/office-ui-fabric-react/v-edwliu-dropdown-contextual-height_2017-06-29-18-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown/ContextualMenu: Adjust height of items to 32px",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-edwliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 956d49c276cdd..754e214968119 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -47,8 +47,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.11.8 <1.0.0",
-    "@uifabric/utilities": ">=4.4.2 <5.0.0",
+    "@uifabric/styling": ">=0.11.9 <1.0.0",
+    "@uifabric/utilities": ">=4.5.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.4.0 <5.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 77ae78cce8e19..a5c52bef1e639 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-component",
-  "version": "1.0.39",
+  "version": "1.0.40",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -22,7 +22,7 @@
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
     "@uifabric/example-app-base": "4.0.1",
-    "@uifabric/utilities": "4.4.2",
+    "@uifabric/utilities": "4.5.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.12.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.13.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 9e51e8174d179..d3621dbc00902 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,50 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.13.0",
+      "tag": "office-ui-fabric-react_v4.13.0",
+      "date": "Thu, 29 Jun 2017 20:48:31 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christopher Schleiden <cschleiden@live.de>",
+            "commit": "cc4513adf60d290214512c5e518dd9823a15acda",
+            "comment": "Button: Revert setting label font-weight to bold"
+          },
+          {
+            "author": "Glen Chao <glenchao@outlook.com>",
+            "commit": "e1795515b14b2dc26fce6901bae472ee81be5a27",
+            "comment": "Add 'event' as first param for onColumnClick handler to match the param order."
+          },
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "b13f997161fa7657464df6d2c89f4100cf5325ec",
+            "comment": "ComboBox: Fix a scrolling issue (#2090)"
+          },
+          {
+            "author": "Eddie Liu <leddie24@gmail.com>",
+            "commit": "33dc46bdd08c3e6020e74ef8f472435982dc75c0",
+            "comment": "Dropdown/ContextualMenu: Adjust height of items to 32px"
+          }
+        ],
+        "minor": [
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "1df26a8f1b5c02da41f36b1f4f20003ab20671d0",
+            "comment": "Adding a new component: SwatchColorPicker"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.4.2 <5.0.0` to `>=4.5.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.11.8 <1.0.0` to `>=0.11.9 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.12.1",
       "tag": "office-ui-fabric-react_v4.12.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index e3b34e72e1d3a..96d53a4fdc686 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,20 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 29 Jun 2017 10:13:16 GMT and should not be manually modified.
+This log was last generated on Thu, 29 Jun 2017 20:48:31 GMT and should not be manually modified.
+
+## 4.13.0
+Thu, 29 Jun 2017 20:48:31 GMT
+
+### Minor changes
+
+- Adding a new component: SwatchColorPicker
+
+### Patches
+
+- Button: Revert setting label font-weight to bold
+- Add 'event' as first param for onColumnClick handler to match the param order.
+- ComboBox: Fix a scrolling issue (#2090)
+- Dropdown/ContextualMenu: Adjust height of items to 32px
 
 ## 4.12.1
 Thu, 29 Jun 2017 10:13:16 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index bea2a1940be7a..4cfc52fa99a7f 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.12.1",
+  "version": "4.13.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -71,8 +71,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.4.2 <5.0.0",
-    "@uifabric/styling": ">=0.11.8 <1.0.0",
+    "@uifabric/utilities": ">=4.5.0 <5.0.0",
+    "@uifabric/styling": ">=0.11.9 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 99a425209b2f4..62e2bf35cafb0 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,18 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.11.9",
+      "tag": "@uifabric/styling_v0.11.9",
+      "date": "Thu, 29 Jun 2017 20:48:31 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.4.2 <5.0.0` to `>=4.5.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.11.8",
       "tag": "@uifabric/styling_v0.11.8",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 66031249db454..48048932e40a3 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 29 Jun 2017 10:13:16 GMT and should not be manually modified.
+This log was last generated on Thu, 29 Jun 2017 20:48:31 GMT and should not be manually modified.
+
+## 0.11.9
+Thu, 29 Jun 2017 20:48:31 GMT
+
+*Changes not tracked*
 
 ## 0.11.8
 Thu, 29 Jun 2017 10:13:16 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 7b136a3a0805e..c3a6ebe1b7073 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.11.8",
+  "version": "0.11.9",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.4.2 <5.0.0",
+    "@uifabric/utilities": ">=4.5.0 <5.0.0",
     "tslib": "^1.6.0",
     "rtl-css-js": "^1.1.1",
     "glamor": "^2.20.24"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 7212d17ed2fb7..e3f1e27278c13 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.5.0",
+      "tag": "@uifabric/utilities_v4.5.0",
+      "date": "Thu, 29 Jun 2017 20:48:31 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "1df26a8f1b5c02da41f36b1f4f20003ab20671d0",
+            "comment": "Adding a new Grid utility"
+          }
+        ]
+      }
+    },
     {
       "version": "4.4.2",
       "tag": "@uifabric/utilities_v4.4.2",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index df88fac4fb77f..f910014300bc8 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Thu, 29 Jun 2017 10:13:16 GMT and should not be manually modified.
+This log was last generated on Thu, 29 Jun 2017 20:48:31 GMT and should not be manually modified.
+
+## 4.5.0
+Thu, 29 Jun 2017 20:48:31 GMT
+
+### Minor changes
+
+- Adding a new Grid utility
 
 ## 4.4.2
 Thu, 29 Jun 2017 10:13:16 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 3e38bfc2318d1..b015c00675458 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.4.2",
+  "version": "4.5.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 24a19bde23ec4ee1dc68c129e347ed5caa3589fa Mon Sep 17 00:00:00 2001
From: Ben Truelove <betrue@microsoft.com>
Date: Thu, 29 Jun 2017 17:16:13 -0700
Subject: [PATCH 0195/1641] Betrue/fix grouped list headers (#2083)

* Fixed interactive state colors, expand arrow sizing and position, size of headers.

* Fixed excess left padding on expand, by changing positioning of drop icon to absolute

* Simplified CSS to use Flex box, corrected some formatting.

* Added space before count in groupheader.tsx so there's a space between the group name and count.

* Adjusted title horizontal position

* Change list added.

* Corrected change list

* Removed incorrect change lists.

* Changed container name to GroupHeaderContainer per PR feedback.

* Removed left padding

* Used symmetrical CSS to add space betwixt title and count.
---
 ...ixGroupedListHeaders_2017-06-28-18-25.json | 11 +++++
 .../components/GroupedList/GroupHeader.scss   | 45 ++++++++++---------
 .../components/GroupedList/GroupHeader.tsx    |  4 +-
 .../components/GroupedList/GroupedList.scss   |  2 +-
 4 files changed, 38 insertions(+), 24 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/betrue-fixGroupedListHeaders_2017-06-28-18-25.json

diff --git a/common/changes/office-ui-fabric-react/betrue-fixGroupedListHeaders_2017-06-28-18-25.json b/common/changes/office-ui-fabric-react/betrue-fixGroupedListHeaders_2017-06-28-18-25.json
new file mode 100644
index 0000000000000..6f6fe17a880bd
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/betrue-fixGroupedListHeaders_2017-06-28-18-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixed spacing and vertical position of expand arrow, Added space between title and count, Changed to use flex box, Updated interactive state colors to use proper semantic slots",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "betrue@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss
index 031be8dada884..d98da3ae67c0d 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss
@@ -1,5 +1,12 @@
 @import '../../common/common';
 
+$rowHeight: 40px;
+
+// component slots
+$detailsList-item-hover-color: $listItemHoverColor;
+$detailsList-item-selected-color: $listItemSelectedColor;
+$detailsList-item-selected-hover-color: $listItemSelectedHoverColor;
+
 $groupHeader-ease-out-circ: cubic-bezier(0.075, 0.820, 0.165, 1.000);
 $groupHeader-ease-out-sine: cubic-bezier(0.390, 0.575, 0.565, 1.000);
 $groupHeader-ease-in-back: cubic-bezier(0.600, -0.280, 0.735, 0.045);
@@ -10,35 +17,33 @@ $groupHeader-ease-in-back: cubic-bezier(0.600, -0.280, 0.735, 0.045);
   @include focus-border();
 
   &:hover {
-    background: $ms-color-themeLighterAlt;
+    background: $detailsList-item-hover-color;
   }
   &.rootIsSelected {
-    background: $ms-color-themeLighter;
+    background: $detailsList-item-selected-color;
   }
   &.rootIsSelected:hover {
-    background: $ms-color-themeLight;
+    background: $detailsList-item-selected-hover-color;
   }
 }
 
+.groupHeaderContainer {
+  display: flex;
+  align-items: center;
+  height: $rowHeight;
+}
+
 .check,
 .expand {
   @include focus-border();
-  display: inline-block;
   cursor: default;
-  padding: 6px;
-  transform: translateY(50%);
-  margin-top: -12px;
-  box-sizing: border-box;
-  vertical-align: top;
   background: none;
   border: none;
-  font-size: $ms-icon-size-s;
-  top: 4px;
+  font-size: $ms-icon-size-l;
 }
 
 .check {
   opacity: 0;
-  margin-top: -10px;
 
   &:focus {
     opacity: 1;
@@ -52,16 +57,19 @@ $groupHeader-ease-in-back: cubic-bezier(0.600, -0.280, 0.735, 0.045);
 
 .title {
   @include ms-font-xl;
-  padding: 14px 6px;
-  display: inline-block;
   cursor: pointer;
   outline: 0;
 }
 
+.headerCount {
+  padding: 0px 4px;
+}
+
 .expand {
   width: 36px;
-  height: 40px;
+  height: $rowHeight;
   color: $ms-color-neutralSecondary;
+  padding-top: 4px;
 
   :global(.ms-Icon) {
     transform: rotate(-180deg);
@@ -75,11 +83,8 @@ $groupHeader-ease-in-back: cubic-bezier(0.600, -0.280, 0.735, 0.045);
 }
 
 .loading {
-  display: inline-block;
   visibility: hidden;
   opacity: 0;
-  padding: 0px 16px;
-  vertical-align: middle;
   transition: visibility $ms-animation-duration-3, opacity $ms-animation-duration-3;
 
   &.loadingIsVisible {
@@ -89,9 +94,7 @@ $groupHeader-ease-in-back: cubic-bezier(0.600, -0.280, 0.735, 0.045);
 }
 
 .dropIcon {
-  display: inline-block;
-  position: relative;
-  top: -16px;
+  position: absolute;
   @include ms-left(-26px);
   font-size: $ms-icon-size-l;
   color: $ms-color-neutralSecondaryAlt;
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
index 334c44bd1a741..6076567abe77f 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
@@ -71,7 +71,7 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
         aria-label={ group.ariaLabel || group.name }
         data-is-focusable={ true } >
 
-        <FocusZone direction={ FocusZoneDirection.horizontal }>
+        <FocusZone className={ styles.groupHeaderContainer } direction={ FocusZoneDirection.horizontal }>
 
           { isSelectionCheckVisible ? (
             <button
@@ -109,7 +109,7 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
               // so far. That's the reasons we need to use "+" to show we might have more items than count
               // indicates.
             }
-            <span>({ group.count }{ group.hasMoreData && '+' })</span>
+            <span className={ styles.headerCount }>({ group.count }{ group.hasMoreData && '+' })</span>
           </div>
 
           <div
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.scss b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.scss
index a5e20cbbede1b..b7e254c7bd67b 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.scss
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.scss
@@ -21,5 +21,5 @@ $groupList-ease-in-out-sine: cubic-bezier(0.445, 0.050, 0.550, 0.950);
 
 /* Set the min height for a row to 38px so even rendering empty cells takes that space. */
 .root :global(.ms-List-cell) {
-  min-height: 38px;
+  min-height: 36px;
 }
\ No newline at end of file

From b8952cc22a3d80c509609d5f08db580420b2e853 Mon Sep 17 00:00:00 2001
From: Michael Loughry <miclo@microsoft.com>
Date: Thu, 29 Jun 2017 17:42:31 -0700
Subject: [PATCH 0196/1641] Dialog: allow blocking close button (#2103)

* Allow dialogContentProps to override defaults

* Add change file

* Update Dialog.tsx
---
 ...-allow-blocking-close-button_2017-06-29-22-30.json | 11 +++++++++++
 .../src/components/Dialog/Dialog.tsx                  |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/dialog-allow-blocking-close-button_2017-06-29-22-30.json

diff --git a/common/changes/office-ui-fabric-react/dialog-allow-blocking-close-button_2017-06-29-22-30.json b/common/changes/office-ui-fabric-react/dialog-allow-blocking-close-button_2017-06-29-22-30.json
new file mode 100644
index 0000000000000..f9f74df8985ab
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/dialog-allow-blocking-close-button_2017-06-29-22-30.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dialog: allow values in dialogContentProps to override all default values",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
index 4cf5837f49193..ad2eb980d97c7 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
@@ -123,12 +123,12 @@ export class Dialog extends BaseComponent<IDialogProps, IDialogState> {
         <DialogContent
           title={ title }
           subText={ subText }
-          {...dialogContentProps}
           showCloseButton={ isBlocking !== undefined ? !isBlocking : !modalProps.isBlocking }
           topButtonsProps={ topButtonsProps ? topButtonsProps : dialogContentProps.topButtonsProps }
           type={ type !== undefined ? type : dialogContentProps.type }
           onDismiss={ onDismiss ? onDismiss : dialogContentProps.onDismiss }
           className={ css(contentClassName ? contentClassName : dialogContentProps.className) }
+          { ...dialogContentProps }
         >
           { this.props.children }
         </DialogContent>

From f477fbac0d81809c9d9335e8c817e53082a1ad30 Mon Sep 17 00:00:00 2001
From: aadhars <adhargithub@gmail.com>
Date: Fri, 30 Jun 2017 11:20:30 +0530
Subject: [PATCH 0197/1641] Changing the role of GroupedList from "grid" to
 "group"  (#1975)

* Changing the role of groupelist from grid to row

* Adding the change file

* changing double quote to single quote

* Taking care of Thomas PR comment
---
 .../users-adsurang-fixes_2017-06-12-10-04.json        | 11 +++++++++++
 .../src/components/GroupedList/GroupedList.tsx        |  2 +-
 .../src/components/GroupedList/GroupedListSection.tsx |  1 +
 3 files changed, 13 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-adsurang-fixes_2017-06-12-10-04.json

diff --git a/common/changes/office-ui-fabric-react/users-adsurang-fixes_2017-06-12-10-04.json b/common/changes/office-ui-fabric-react/users-adsurang-fixes_2017-06-12-10-04.json
new file mode 100644
index 0000000000000..df95a5eab26a9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-adsurang-fixes_2017-06-12-10-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "GroupedList: Role of groupedList changed from \"grid\" to \"group\"",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "adsurang@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
index 5adc6bedc4c7b..12fde5b413b97 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
@@ -89,7 +89,7 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
         className={ css('ms-GroupedList', styles.root, className) }
         data-automationid='GroupedList'
         data-is-scrollable='false'
-        role='grid'
+        role='presentation'
       >
         { !groups ?
           this._renderGroup(null, 0) : (
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
index 6bb1507475f6a..2c028f93795bb 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
@@ -191,6 +191,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
       <div
         ref='root'
         className={ css('ms-GroupedList-group', styles.group, this._getDroppingClassName()) }
+        role='presentation'
       >
         { onRenderGroupHeader(groupHeaderProps, this._onRenderGroupHeader) }
         {

From a1438aa1142f26b57b1d1c1cf78695c5878e9ca0 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 30 Jun 2017 03:23:15 -0700
Subject: [PATCH 0198/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...ixGroupedListHeaders_2017-06-28-18-25.json | 11 -------
 ...locking-close-button_2017-06-29-22-30.json | 11 -------
 ...users-adsurang-fixes_2017-06-12-10-04.json | 11 -------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 29 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 11 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/CHANGELOG.json               |  6 ++++
 packages/styling/CHANGELOG.md                 |  7 ++++-
 packages/styling/package.json                 |  2 +-
 15 files changed, 60 insertions(+), 44 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/betrue-fixGroupedListHeaders_2017-06-28-18-25.json
 delete mode 100644 common/changes/office-ui-fabric-react/dialog-allow-blocking-close-button_2017-06-29-22-30.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-adsurang-fixes_2017-06-12-10-04.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 05dccac58f38e..4c26d7027f48a 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.12.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.13.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index c2bfd06c36986..b03036c258faf 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.12.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.13.1 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 68645fc307a56..e6f5e54cb774f 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.12.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.13.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 2847151e6d852..b33a94c1fafa4 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.12.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.13.1 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/office-ui-fabric-react/betrue-fixGroupedListHeaders_2017-06-28-18-25.json b/common/changes/office-ui-fabric-react/betrue-fixGroupedListHeaders_2017-06-28-18-25.json
deleted file mode 100644
index 6f6fe17a880bd..0000000000000
--- a/common/changes/office-ui-fabric-react/betrue-fixGroupedListHeaders_2017-06-28-18-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixed spacing and vertical position of expand arrow, Added space between title and count, Changed to use flex box, Updated interactive state colors to use proper semantic slots",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "betrue@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/dialog-allow-blocking-close-button_2017-06-29-22-30.json b/common/changes/office-ui-fabric-react/dialog-allow-blocking-close-button_2017-06-29-22-30.json
deleted file mode 100644
index f9f74df8985ab..0000000000000
--- a/common/changes/office-ui-fabric-react/dialog-allow-blocking-close-button_2017-06-29-22-30.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dialog: allow values in dialogContentProps to override all default values",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-adsurang-fixes_2017-06-12-10-04.json b/common/changes/office-ui-fabric-react/users-adsurang-fixes_2017-06-12-10-04.json
deleted file mode 100644
index df95a5eab26a9..0000000000000
--- a/common/changes/office-ui-fabric-react/users-adsurang-fixes_2017-06-12-10-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "GroupedList: Role of groupedList changed from \"grid\" to \"group\"",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "adsurang@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 754e214968119..2cae6cf02f883 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -47,7 +47,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.11.9 <1.0.0",
+    "@uifabric/styling": ">=0.11.10 <1.0.0",
     "@uifabric/utilities": ">=4.5.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index a5c52bef1e639..6a58d93a367c9 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.13.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.13.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index d3621dbc00902..7e3fd7ad4829f 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,35 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.13.1",
+      "tag": "office-ui-fabric-react_v4.13.1",
+      "date": "Fri, 30 Jun 2017 10:23:15 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Ben Truelove <betrue@microsoft.com>",
+            "commit": "24a19bde23ec4ee1dc68c129e347ed5caa3589fa",
+            "comment": "Fixed spacing and vertical position of expand arrow, Added space between title and count, Changed to use flex box, Updated interactive state colors to use proper semantic slots"
+          },
+          {
+            "author": "Michael Loughry <miclo@microsoft.com>",
+            "commit": "b8952cc22a3d80c509609d5f08db580420b2e853",
+            "comment": "Dialog: allow values in dialogContentProps to override all default values"
+          },
+          {
+            "author": "aadhars <adhargithub@gmail.com>",
+            "commit": "f477fbac0d81809c9d9335e8c817e53082a1ad30",
+            "comment": "GroupedList: Role of groupedList changed from \"grid\" to \"group\""
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.11.9 <1.0.0` to `>=0.11.10 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.13.0",
       "tag": "office-ui-fabric-react_v4.13.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 96d53a4fdc686..84e9299ff8937 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,15 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 29 Jun 2017 20:48:31 GMT and should not be manually modified.
+This log was last generated on Fri, 30 Jun 2017 10:23:15 GMT and should not be manually modified.
+
+## 4.13.1
+Fri, 30 Jun 2017 10:23:15 GMT
+
+### Patches
+
+- Fixed spacing and vertical position of expand arrow, Added space between title and count, Changed to use flex box, Updated interactive state colors to use proper semantic slots
+- Dialog: allow values in dialogContentProps to override all default values
+- GroupedList: Role of groupedList changed from "grid" to "group"
 
 ## 4.13.0
 Thu, 29 Jun 2017 20:48:31 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 4cfc52fa99a7f..a8c4cf56b29ff 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.13.0",
+  "version": "4.13.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.5.0 <5.0.0",
-    "@uifabric/styling": ">=0.11.9 <1.0.0",
+    "@uifabric/styling": ">=0.11.10 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 62e2bf35cafb0..288e545421e3c 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.11.10",
+      "tag": "@uifabric/styling_v0.11.10",
+      "date": "Fri, 30 Jun 2017 10:23:15 GMT",
+      "comments": {}
+    },
     {
       "version": "0.11.9",
       "tag": "@uifabric/styling_v0.11.9",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 48048932e40a3..9fe22ae04bd2d 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 29 Jun 2017 20:48:31 GMT and should not be manually modified.
+This log was last generated on Fri, 30 Jun 2017 10:23:15 GMT and should not be manually modified.
+
+## 0.11.10
+Fri, 30 Jun 2017 10:23:15 GMT
+
+*Changes not tracked*
 
 ## 0.11.9
 Thu, 29 Jun 2017 20:48:31 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index c3a6ebe1b7073..cd8e68d21464a 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.11.9",
+  "version": "0.11.10",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 8f94339b01f2a1570768172ce399c8edfb5d9a6c Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Fri, 30 Jun 2017 09:28:52 -0700
Subject: [PATCH 0199/1641] MessageBar: Fixed padding regressions (#2101)

* MessageBar: Fixed padding regressions

* Added change file
---
 .../messagebar-padding-fix_2017-06-29-19-51.json      | 11 +++++++++++
 .../src/components/MessageBar/MessageBar.scss         | 10 ++--------
 2 files changed, 13 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/messagebar-padding-fix_2017-06-29-19-51.json

diff --git a/common/changes/office-ui-fabric-react/messagebar-padding-fix_2017-06-29-19-51.json b/common/changes/office-ui-fabric-react/messagebar-padding-fix_2017-06-29-19-51.json
new file mode 100644
index 0000000000000..297522e3c6afa
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/messagebar-padding-fix_2017-06-29-19-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "MessageBar: Fixed padding regressions with multiline and no actions ",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
index 1af10d4cb1df0..f019d33b8c82d 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
@@ -132,7 +132,7 @@
 }
 
 .actions {
-  padding: 12px 0px;
+  padding-top: 12px;
 }
 
 .innerTextPadding {
@@ -211,11 +211,9 @@
 
 // Multi line specific attributes
 .multiline {
+  @include padding(16px, 12px, 12px, 16px);
   .content {
-      padding-top: 16px;
       flex-direction: row;
-      @include padding-left(16px);
-
     .icon {
       @include padding-right(8px);
       font-family: 'FabricMDL2Icons';
@@ -226,10 +224,6 @@
     }
   }
 
-  .actions {
-    @include padding-right(12px);
-  }
-
   .dismissal {
     margin: 0px 12px;
   }

From ac69068d153fd9a2ea6f86131bec740e09389a0f Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Fri, 30 Jun 2017 09:29:14 -0700
Subject: [PATCH 0200/1641] Breadcrumb: Use flexbox for layout to support
 multiple button font-sizes (#2099)

* Breadcrumb: Use flexbox for layout to support multiple button font-sizes

* Add change file
---
 .../breadcrumb-flexbox_2017-06-29-18-43.json  | 11 ++++++++++
 .../src/components/Breadcrumb/Breadcrumb.scss | 21 +++++++------------
 2 files changed, 18 insertions(+), 14 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/breadcrumb-flexbox_2017-06-29-18-43.json

diff --git a/common/changes/office-ui-fabric-react/breadcrumb-flexbox_2017-06-29-18-43.json b/common/changes/office-ui-fabric-react/breadcrumb-flexbox_2017-06-29-18-43.json
new file mode 100644
index 0000000000000..6f6ee1eff90ec
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/breadcrumb-flexbox_2017-06-29-18-43.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Breadcrumb: Use flexbox for layout to better support multiple font sizes",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss
index 002fe3f67db82..1f1d8a4b56943 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss
@@ -22,22 +22,22 @@ $Breadcrumb-chevron-sm: 8px;
   white-space: nowrap;
   padding: 0;
   margin: 0;
+  display: flex;
+  align-items: stretch;
 }
 
 .chevron {
   font-size: $ms-font-size-s;
   color: $ms-color-neutralSecondary;
-  line-height: $ms-font-size-xxl;
 }
 
 .listItem {
   list-style-type: none;
-  vertical-align: top;
   margin: 0;
   padding: 0;
-  display: inline-block;
+  display: flex;
   position: relative;
-
+  align-items: center;
   &:last-of-type {
     .chevron {
       display: none;
@@ -48,28 +48,23 @@ $Breadcrumb-chevron-sm: 8px;
   .itemLink {
     @include ms-font-xl;
     color: $ms-color-neutralPrimary;
-    display: inline-block;
     padding: 0 8px;
     max-width: $Breadcrumb-itemMaxWidth;
     white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
-    vertical-align: top;
   }
 }
 
 .overflow {
-  display: inline-block;
   position: relative;
+  display: flex;
+  align-items: center;
 }
 
 .overflowButton {
   font-size: $Breadcrumb-overflowButtonSize;
-  display: inline-block;
-  vertical-align: top;
-  height: 28px;
-  line-height: 1;
-
+  height: 100%; // override button height
   &:hover {
     cursor: pointer;
     background-color: $ms-color-neutralLighter;
@@ -115,7 +110,6 @@ $Breadcrumb-chevron-sm: 8px;
 
   .chevron {
     font-size: $ms-font-size-mi;
-    line-height: $ms-font-size-l;
   }
 
   .overflowButton {
@@ -131,7 +125,6 @@ $Breadcrumb-chevron-sm: 8px;
 
   .chevron {
     font-size: $Breadcrumb-chevron-sm;
-    line-height: $ms-font-size-m;
   }
 
   .overflowButton {

From 10049afac0c0c94a0b609da5eaeb3b5a49554b1b Mon Sep 17 00:00:00 2001
From: Boris Emorine <boris.emorine@gmail.com>
Date: Fri, 30 Jun 2017 11:33:45 -0700
Subject: [PATCH 0201/1641] New Component: SplitButton (#1996)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Implement color scheme in the ContextualMenu control to enable alternative theming.

* Implement the bar and unit tests and component page

* Revert "Implement color scheme in the ContextualMenu control to enable alternative theming."

This reverts commit 4f830cd8c55269368e73bfc6d0cd69430776b977.

* Don't render an empty icon for an icon-less header menu item.

* Revert "Implement Document Title Bar"

* Add SplitButton

* Remove touch

* Remove unnecessary @autobind decorators

* Fix indentation

* Change booleans to `is…` format

* Separate SplitButton styling from BaseButton

* Fix nits

* Add tests for SplitButton

* Use `_isExpanded` function for menuProps check

* Fix styling
---
 .../src/components/Button/BaseButton.tsx      | 104 ++++++++-
 .../src/components/Button/Button.Props.ts     |   8 +-
 .../src/components/Button/Button.test.tsx     | 219 ++++++++++++++++++
 .../src/components/Button/ButtonPage.tsx      |   9 +
 .../CommandButton/CommandButton.styles.ts     |   7 +-
 .../CompoundButton/CompoundButton.styles.ts   |   7 +-
 .../DefaultButton/DefaultButton.styles.ts     |   7 +-
 .../Button/IconButton/IconButton.styles.ts    |   7 +-
 .../PrimaryButton/PrimaryButton.styles.ts     |   7 +-
 .../Button/SplitButton/SplitButton.Props.ts   |  41 ++++
 .../Button/SplitButton/SplitButton.styles.ts  |  60 +++++
 .../Button/examples/Button.Split.Example.tsx  |  81 +++++++
 12 files changed, 542 insertions(+), 15 deletions(-)
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.Props.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx

diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index cebdea1c25ce8..f51a59d7da0a0 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -7,12 +7,15 @@ import {
   autobind,
   buttonProperties,
   getId,
-  getNativeProps
+  getNativeProps,
+  KeyCodes,
+  css,
 } from '../../Utilities';
 import { Icon, IIconProps } from '../../Icon';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { ContextualMenu, IContextualMenuProps } from '../../ContextualMenu';
 import { IButtonProps, IButton } from './Button.Props';
+import { IconButton } from './IconButton/IconButton';
 import { IButtonClassNames, getClassNames } from './BaseButton.classNames';
 
 export interface IBaseButtonProps extends IButtonProps {
@@ -26,6 +29,14 @@ export interface IBaseButtonState {
 
 export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState> implements IButton {
 
+  private get _isSplitButton(): boolean {
+    return (!!this.props.menuProps && !!this.props.onClick);
+  }
+
+  private get _isExpanded(): boolean {
+    return !!this.state.menuProps;
+  }
+
   public static defaultProps = {
     baseClassName: 'ms-Button',
     classNames: {},
@@ -105,12 +116,15 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       ariaDescribedBy = null;
     }
 
+    const tabIndex = (this.props.tabIndex === undefined) ? (this._isSplitButton ? -1 : 0) : this.props.tabIndex;
+
     const buttonProps = assign(
       nativeProps,
       {
         className: this._classNames.root,
         ref: this._resolveRef('_buttonElement'),
         'disabled': disabled,
+        tabIndex: tabIndex,
         'aria-label': ariaLabel,
         'aria-labelledby': ariaLabel ? null : _labelId,
         'aria-describedby': ariaDescribedBy,
@@ -120,14 +134,16 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       }
     );
 
-    // Override onClick if contextualMenuItems passed in. Eventually allow _onToggleMenu to
-    // be assigned to split button click if onClick already has a value
-    if (this.props.menuProps) {
+    if (this._isSplitButton) {
+      return (
+        this._onRenderSplitButtonContent(tag, buttonProps)
+      );
+    } else if (this.props.menuProps) {
       assign(
         buttonProps,
         {
           'onClick': this._onToggleMenu,
-          'aria-expanded': this.state.menuProps ? true : false,
+          'aria-expanded': this._isExpanded,
           'aria-owns': this.state.menuProps ? this._labelId + '-menu' : null,
           'aria-haspopup': true
         }
@@ -171,7 +187,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         onRenderDescription(props, this._onRenderDescription),
         onRenderAriaDescription(props, this._onRenderAriaDescription),
         onRenderChildren(props, this._onRenderChildren),
-        (menuProps || menuIconName || menuIconProps || this.props.onRenderMenuIcon) && onRenderMenuIcon(this.props, this._onRenderMenuIcon),
+        !this._isSplitButton && (menuProps || menuIconName || menuIconProps || this.props.onRenderMenuIcon) && onRenderMenuIcon(this.props, this._onRenderMenuIcon),
         this.state.menuProps && onRenderMenu(menuProps, this._onRenderMenu)
       ));
   }
@@ -204,7 +220,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   @autobind
   private _onRenderText() {
     let {
-    children,
+      children,
       disabled,
       styles,
       text
@@ -320,4 +336,78 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
 
     this.setState({ menuProps: currentMenuProps ? null : menuProps });
   }
+
+  private _onRenderSplitButtonContent(tag: any, buttonProps: IButtonProps): JSX.Element {
+    const {
+      styles,
+      disabled
+    } = this.props;
+
+    return (
+      <div
+        aria-labelledby={ buttonProps.ariaLabel }
+        aria-disabled={ disabled }
+        aria-haspopup={ true }
+        aria-expanded={ this._isExpanded }
+        aria-pressed={ this.props.checked }
+        aria-describedby={ buttonProps.ariaDescription }
+        className={ css(disabled ? styles.splitButtonContainerDisabled : styles.splitButtonContainer) }
+        tabIndex={ 0 }
+        onKeyDown={ this.props.disabled ? null : this._onSplitButtonKeyDown }
+      >
+        <span aria-hidden={ true }>
+          { this._onRenderContent(tag, buttonProps) }
+          { this._onRenderSplitButtonMenuButton() }
+        </span>
+      </div >
+    );
+  }
+
+  private _onRenderSplitButtonMenuButton(): JSX.Element {
+    let {
+      menuIconName,
+      menuIconProps,
+      styles,
+      disabled
+    } = this.props;
+
+    if (menuIconProps === undefined) {
+      menuIconProps = {
+        iconName: menuIconName === undefined ? 'ChevronDown' : menuIconName
+      };
+    }
+
+    return (
+      <IconButton
+        tabIndex={ -1 }
+        styles={ {
+          root: disabled ? styles.splitButtonMenuButtonDisabled : styles.splitButtonMenuButton,
+          rootChecked: styles.splitButtonMenuButtonChecked,
+          icon: disabled ? styles.splitButtonMenuIconDisabled : styles.splitButtonMenuIcon
+        } }
+        checked={ this.props.checked }
+        disabled={ this.props.disabled }
+        onClick={ this._onToggleMenu }
+        menuProps={ null }
+        iconProps={ menuIconProps } />
+    );
+  }
+
+  @autobind
+  private _onSplitButtonKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+    switch (ev.which) {
+      case KeyCodes.enter:
+      case KeyCodes.space:
+        this.props.onClick(null);
+        return;
+    }
+
+    if (ev.altKey) {
+      switch (ev.which) {
+        case KeyCodes.down:
+          this._onToggleMenu();
+          return;
+      }
+    }
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
index 5fe44938302a6..6d5136f6cd50d 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
@@ -5,6 +5,7 @@ import { IRenderFunction } from '../../Utilities';
 import { IContextualMenuProps } from '../../ContextualMenu';
 import { IIconProps, IconName } from '../../Icon';
 import { IStyle, ITheme } from '../../Styling';
+import { ISplitButtonStyles } from './SplitButton/SplitButton.Props';
 
 export interface IButton {
   /**
@@ -34,7 +35,7 @@ export interface IButtonProps extends React.HTMLAttributes<HTMLButtonElement | H
   /**
    * Custom styling for individual elements within the button DOM.
    */
-  styles?: IButtonStyles;
+  styles?: ISplitButtonStyles;
 
   /**
    * Theme provided by HOC.
@@ -75,7 +76,7 @@ export interface IButtonProps extends React.HTMLAttributes<HTMLButtonElement | H
 
   /**
    * Props for button menu. Providing this will default to showing the menu icon. See menuIconProps for overriding
-   * how the default icon looks.
+   * how the default icon looks. Providing this in addition of onClick will render a SplitButton.
    */
   menuProps?: IContextualMenuProps;
 
@@ -293,7 +294,8 @@ export interface IButtonStyles {
   descriptionChecked?: IStyle;
 
   /**
-   * Style for the screen reader text.
+   * Style override for the screen reader text.
    */
   screenReaderText?: IStyle;
+
 }
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
index 106151117e991..f2219ac726bdf 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
@@ -5,10 +5,16 @@ import * as ReactDOM from 'react-dom';
 
 import * as ReactTestUtils from 'react-addons-test-utils';
 import { DefaultButton } from './DefaultButton/DefaultButton';
+import { KeyCodes } from '../../Utilities';
 
 let { expect } = chai;
 
 describe('DefaultButton', () => {
+  function renderIntoDocument(element: React.ReactElement<any>): HTMLElement {
+    const component = ReactTestUtils.renderIntoDocument(element);
+    const renderedDOM: Element = ReactDOM.findDOMNode(component as React.ReactInstance);
+    return renderedDOM as HTMLElement;
+  }
 
   it('can render without an onClick.', () => {
     const button = ReactTestUtils.renderIntoDocument<any>(
@@ -83,4 +89,217 @@ describe('DefaultButton', () => {
       expect(button.querySelectorAll('[data-icon-name="fontColor"]').length).to.equal(1);
     });
   });
+
+  it('Providing onClick and menuProps renders a SplitButton', () => {
+    const button = ReactTestUtils.renderIntoDocument<any>(
+      <DefaultButton
+        data-automation-id='test'
+        text='Create account'
+        onClick={ () => alert('Clicked') }
+        menuProps={ {
+          items: [
+            {
+              key: 'emailMessage',
+              name: 'Email message',
+              icon: 'Mail'
+            },
+            {
+              key: 'calendarEvent',
+              name: 'Calendar event',
+              icon: 'Calendar'
+            }
+          ]
+        } }
+      />
+    );
+    const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+    expect(renderedDOM.tagName).equal('DIV', 'A Button with a menuProps and an onClick renders as a SplitButton');
+  });
+
+  it('Tapping menu button of SplitButton expands menu', () => {
+    let didClick = false;
+    const button = ReactTestUtils.renderIntoDocument<any>(
+      <DefaultButton
+        data-automation-id='test'
+        text='Create account'
+        onClick={ () => alert('Clicked') }
+        menuProps={ {
+          items: [
+            {
+              key: 'emailMessage',
+              name: 'Email message',
+              icon: 'Mail'
+            },
+            {
+              key: 'calendarEvent',
+              name: 'Calendar event',
+              icon: 'Calendar'
+            }
+          ]
+        } }
+      />
+    );
+    const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+    const menuButtonDOM: HTMLButtonElement = renderedDOM.getElementsByClassName('ms-Button--icon')[0] as HTMLButtonElement;
+    ReactTestUtils.Simulate.click(menuButtonDOM);
+    expect(renderedDOM.getAttribute('aria-expanded')).to.equal('true');
+  });
+
+  it('Clicking SplitButton button triggers action', () => {
+    let didClick = false;
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <DefaultButton
+        data-automation-id='test'
+        text='Create account'
+        onClick={ () => { didClick = true; } }
+        menuProps={ {
+          items: [
+            {
+              key: 'emailMessage',
+              name: 'Email message',
+              icon: 'Mail'
+            },
+            {
+              key: 'calendarEvent',
+              name: 'Calendar event',
+              icon: 'Calendar'
+            }
+          ]
+        } }
+      />
+    );
+    const splitButtonDOM = ReactDOM.findDOMNode(renderedDOM as React.ReactInstance);
+    const menuButtonDOM: HTMLButtonElement = renderedDOM.getElementsByClassName('ms-Button--default')[0] as HTMLButtonElement;
+    ReactTestUtils.Simulate.click(menuButtonDOM);
+    expect(didClick).to.equal(true);
+  });
+
+  it('Pressing Enter on SplitButton triggers action', () => {
+    let didClick = false;
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <DefaultButton
+        data-automation-id='test'
+        text='Create account'
+        onClick={ () => { didClick = true; } }
+        menuProps={ {
+          items: [
+            {
+              key: 'emailMessage',
+              name: 'Email message',
+              icon: 'Mail'
+            },
+            {
+              key: 'calendarEvent',
+              name: 'Calendar event',
+              icon: 'Calendar'
+            }
+          ]
+        } }
+      />
+    );
+    const splitButtonDOM = ReactDOM.findDOMNode(renderedDOM as React.ReactInstance);
+    ReactTestUtils.Simulate.keyDown(splitButtonDOM,
+      {
+        which: KeyCodes.enter
+      });
+    expect(didClick).to.equal(true);
+  });
+
+  it('Pressing Alt+Down on SplitButton triggers menu', () => {
+    let didClick = false;
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <DefaultButton
+        data-automation-id='test'
+        text='Create account'
+        onClick={ () => { didClick = true; } }
+        menuProps={ {
+          items: [
+            {
+              key: 'emailMessage',
+              name: 'Email message',
+              icon: 'Mail'
+            },
+            {
+              key: 'calendarEvent',
+              name: 'Calendar event',
+              icon: 'Calendar'
+            }
+          ]
+        } }
+      />
+    );
+    const splitButtonDOM = ReactDOM.findDOMNode(renderedDOM as React.ReactInstance);
+    ReactTestUtils.Simulate.focus(splitButtonDOM);
+    ReactTestUtils.Simulate.keyDown(splitButtonDOM,
+      {
+        altKey: true,
+        which: KeyCodes.down
+      });
+    expect(renderedDOM.getAttribute('aria-expanded')).to.equal('true');
+  });
+
+  it('A disabled SplitButton does not respond to key presses', () => {
+    let didClick = false;
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <DefaultButton
+        disabled={ true }
+        data-automation-id='test'
+        text='Create account'
+        onClick={ () => { didClick = true; } }
+        menuProps={ {
+          items: [
+            {
+              key: 'emailMessage',
+              name: 'Email message',
+              icon: 'Mail'
+            },
+            {
+              key: 'calendarEvent',
+              name: 'Calendar event',
+              icon: 'Calendar'
+            }
+          ]
+        } }
+      />
+    );
+    const splitButtonDOM = ReactDOM.findDOMNode(renderedDOM as React.ReactInstance);
+    ReactTestUtils.Simulate.focus(splitButtonDOM);
+    ReactTestUtils.Simulate.keyDown(splitButtonDOM,
+      {
+        altKey: true,
+        which: KeyCodes.down
+      });
+    expect(renderedDOM.getAttribute('aria-expanded')).to.equal('false');
+  });
+
+  it('A disabled SplitButton does not respond to clicks', () => {
+    let didClick = false;
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <DefaultButton
+        disabled={ true }
+        data-automation-id='test'
+        text='Create account'
+        onClick={ () => { didClick = true; } }
+        menuProps={ {
+          items: [
+            {
+              key: 'emailMessage',
+              name: 'Email message',
+              icon: 'Mail'
+            },
+            {
+              key: 'calendarEvent',
+              name: 'Calendar event',
+              icon: 'Calendar'
+            }
+          ]
+        } }
+      />
+    );
+    const splitButtonDOM = ReactDOM.findDOMNode(renderedDOM as React.ReactInstance);
+    const menuButtonDOM: HTMLButtonElement = renderedDOM.getElementsByClassName('ms-Button--default')[0] as HTMLButtonElement;
+    ReactTestUtils.Simulate.click(menuButtonDOM);
+    expect(didClick).to.equal(false);
+  });
+
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
index 9028a194ff603..9330650c286c2 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
@@ -15,6 +15,7 @@ import { ButtonIconExample } from './examples/Button.Icon.Example';
 import { ButtonAnchorExample } from './examples/Button.Anchor.Example';
 import { ButtonScreenReaderExample } from './examples/Button.ScreenReader.Example';
 import { ButtonSwapExample } from './examples/Button.Swap.Example';
+import { ButtonSplitExample, ButtonSplitCustomExample } from './examples/Button.Split.Example';
 import './examples/Button.Basic.Example.scss';
 import { Link } from '../../Link';
 
@@ -27,6 +28,8 @@ const ButtonAnchorExampleCode = require('!raw-loader!office-ui-fabric-react/src/
 const ButtonScreenReaderExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx') as string;
 const ButtonContextualMenuExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.ContextualMenu.Example.tsx') as string;
 const ButtonSwapExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx') as string;
+const ButtonSplitExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx') as string;
+const ButtonSplitCustomExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx') as string;
 
 export interface IButtonDemoPageState {
   areButtonsDisabled?: boolean;
@@ -78,6 +81,12 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
             <ExampleCard title='Button Swap with Focus State' code={ ButtonSwapExampleCode }>
               <ButtonSwapExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
+            <ExampleCard title='SplitButton' code={ ButtonSplitExampleCode }>
+              <ButtonSplitExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
+            </ExampleCard>
+            <ExampleCard title='' code={ ButtonSplitExampleCode }>
+              <ButtonSplitCustomExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
+            </ExampleCard>
           </div>
         }
         propertiesTables={
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
index a76d988aa2900..21547a36c2f1b 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
@@ -1,4 +1,5 @@
 import { IButtonStyles } from '../Button.Props';
+import { ISplitButtonStyles } from '../SplitButton/SplitButton.Props';
 import {
   ITheme,
   mergeStyleSets
@@ -7,6 +8,9 @@ import { memoizeFunction } from '../../../Utilities';
 import {
   getStyles as getBaseButtonStyles
 } from '../BaseButton.styles';
+import {
+  getStyles as getSplitButtonStyles
+} from '../SplitButton/SplitButton.styles';
 
 const DEFAULT_BUTTON_HEIGHT = '40px';
 const DEFAULT_PADDING = '0 4px';
@@ -16,6 +20,7 @@ export const getStyles = memoizeFunction((
   customStyles?: IButtonStyles
 ): IButtonStyles => {
   let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
+  let splitButtonStyles: ISplitButtonStyles = getSplitButtonStyles(theme);
   let commandButtonStyles: IButtonStyles = {
     root: {
       borderWidth: '0',
@@ -64,5 +69,5 @@ export const getStyles = memoizeFunction((
 
   };
 
-  return mergeStyleSets(baseButtonStyles, commandButtonStyles, customStyles);
+  return mergeStyleSets(baseButtonStyles, commandButtonStyles, splitButtonStyles, customStyles);
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
index 41739edbd2731..27baba7ebd00b 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
@@ -1,4 +1,5 @@
 import { IButtonStyles } from '../Button.Props';
+import { ISplitButtonStyles } from '../SplitButton/SplitButton.Props';
 import {
   ITheme,
   mergeStyleSets
@@ -7,6 +8,9 @@ import { memoizeFunction } from '../../../Utilities';
 import {
   getStyles as getDefaultButtonStyles
 } from '../DefaultButton/DefaultButton.styles';
+import {
+  getStyles as getSplitButtonStyles
+} from '../SplitButton/SplitButton.styles';
 
 const DEFAULT_BUTTON_HEIGHT = '32px';
 const DEFAULT_BUTTON_MINWIDTH = '80px';
@@ -20,6 +24,7 @@ export const getStyles = memoizeFunction((
     theme,
     customStyles
   );
+  let splitButtonStyles: ISplitButtonStyles = getSplitButtonStyles(theme);
   let compoundButtonStyles: IButtonStyles = {
     root: {
       maxWidth: '280px',
@@ -66,5 +71,5 @@ export const getStyles = memoizeFunction((
 
   };
 
-  return mergeStyleSets(defaultButtonStyles, compoundButtonStyles, customStyles);
+  return mergeStyleSets(defaultButtonStyles, compoundButtonStyles, splitButtonStyles, customStyles);
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
index fd1a2b310bacc..afc4ffd8f0749 100644
--- a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
@@ -1,4 +1,5 @@
 import { IButtonStyles } from '../Button.Props';
+import { ISplitButtonStyles } from '../SplitButton/SplitButton.Props';
 import {
   ITheme,
   mergeStyleSets,
@@ -8,6 +9,9 @@ import { memoizeFunction } from '../../../Utilities';
 import {
   getStyles as getBaseButtonStyles
 } from '../BaseButton.styles';
+import {
+  getStyles as getSplitButtonStyles
+} from '../SplitButton/SplitButton.styles';
 
 const DEFAULT_BUTTON_HEIGHT = '32px';
 const DEFAULT_BUTTON_MINWIDTH = '80px';
@@ -20,6 +24,7 @@ export const getStyles = memoizeFunction((
   focusColor?: string
 ): IButtonStyles => {
   let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme, focusInset, focusColor);
+  let splitButtonStyles: ISplitButtonStyles = getSplitButtonStyles(theme);
   let defaultButtonStyles: IButtonStyles = {
     root: {
       minWidth: DEFAULT_BUTTON_MINWIDTH,
@@ -48,5 +53,5 @@ export const getStyles = memoizeFunction((
     }
   };
 
-  return mergeStyleSets(baseButtonStyles, defaultButtonStyles, customStyles);
+  return mergeStyleSets(baseButtonStyles, defaultButtonStyles, splitButtonStyles, customStyles);
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
index a445e6033afbb..4d564d02eb214 100644
--- a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
@@ -1,4 +1,5 @@
 import { IButtonStyles } from '../Button.Props';
+import { ISplitButtonStyles } from '../SplitButton/SplitButton.Props';
 import {
   ITheme,
   mergeStyleSets
@@ -7,6 +8,9 @@ import { memoizeFunction } from '../../../Utilities';
 import {
   getStyles as getBaseButtonStyles
 } from '../BaseButton.styles';
+import {
+  getStyles as getSplitButtonStyles
+} from '../SplitButton/SplitButton.styles';
 
 const DEFAULT_BUTTON_HEIGHT = '32px';
 const DEFAULT_PADDING = '0 4px';
@@ -16,6 +20,7 @@ export const getStyles = memoizeFunction((
   customStyles?: IButtonStyles
 ): IButtonStyles => {
   let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
+  let splitButtonStyles: ISplitButtonStyles = getSplitButtonStyles(theme);
   let iconButtonStyles: IButtonStyles = {
     root: {
       padding: '0 4px',
@@ -45,5 +50,5 @@ export const getStyles = memoizeFunction((
     }
   };
 
-  return mergeStyleSets(baseButtonStyles, iconButtonStyles, customStyles);
+  return mergeStyleSets(baseButtonStyles, iconButtonStyles, splitButtonStyles, customStyles);
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
index a5231558dcfb7..1de65d15a9a62 100644
--- a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
@@ -1,4 +1,5 @@
 import { IButtonStyles } from '../Button.Props';
+import { ISplitButtonStyles } from '../SplitButton/SplitButton.Props';
 import {
   ITheme,
   mergeStyleSets
@@ -7,12 +8,16 @@ import { memoizeFunction } from '../../../Utilities';
 import {
   getStyles as getDefaultButtonStyles
 } from '../DefaultButton/DefaultButton.styles';
+import {
+  getStyles as getSplitButtonStyles
+} from '../SplitButton/SplitButton.styles';
 
 export const getStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: IButtonStyles
 ): IButtonStyles => {
   let { palette } = theme;
+  let splitButtonStyles: ISplitButtonStyles = getSplitButtonStyles(theme);
   let defaultButtonStyles: IButtonStyles = getDefaultButtonStyles(
     theme,
     customStyles,
@@ -46,5 +51,5 @@ export const getStyles = memoizeFunction((
     }
   };
 
-  return mergeStyleSets(defaultButtonStyles, primaryButtonStyles, customStyles);
+  return mergeStyleSets(defaultButtonStyles, primaryButtonStyles, splitButtonStyles, customStyles);
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.Props.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.Props.ts
new file mode 100644
index 0000000000000..4c0fa760286f3
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.Props.ts
@@ -0,0 +1,41 @@
+import { Button } from '../Button';
+import { IStyle } from '../../../Styling';
+import { IButtonStyles } from '../Button.Props';
+
+export interface ISplitButtonStyles extends IButtonStyles {
+  /**
+     * Style override for the container div around a SplitButton element
+     */
+  splitButtonContainer?: IStyle;
+
+  /**
+   * Style override for the container div around a SplitButton element in a disabled state
+   */
+  splitButtonContainerDisabled?: IStyle;
+
+  /**
+   * Style override for the SplitButton menu button
+   */
+  splitButtonMenuButton?: IStyle;
+
+  /**
+   * Style override for the SplitButton menu button element in a disabled state.
+   */
+  splitButtonMenuButtonDisabled?: IStyle;
+
+  /**
+   * Style override for the SplitButton menu button element in a checked state
+   */
+  splitButtonMenuButtonChecked?: IStyle;
+
+  /**
+   * Style override for the SplitButton menu icon element
+   */
+  splitButtonMenuIcon?: IStyle;
+
+  /**
+   * Style override for the SplitButton menu icon element in a disabled state
+   */
+  splitButtonMenuIconDisabled?: IStyle;
+
+}
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
new file mode 100644
index 0000000000000..b7e1f63fd0758
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
@@ -0,0 +1,60 @@
+import { ISplitButtonStyles } from '../SplitButton/SplitButton.Props';
+import {
+  ITheme,
+  mergeStyleSets
+} from '../../../Styling';
+import { memoizeFunction } from '../../../Utilities';
+
+const DEFAULT_BUTTON_HEIGHT = '32px';
+const DEFAULT_PADDING = '0 4px';
+
+export const getStyles = memoizeFunction((
+  theme: ITheme,
+  customStyles?: ISplitButtonStyles
+): ISplitButtonStyles => {
+  let iconButtonStyles: ISplitButtonStyles = {
+    splitButtonContainer: {
+      position: 'absolute',
+      border: '1px solid transparent',
+      ':hover': {
+        border: '1px solid',
+        borderColor: theme.palette.neutralLight
+      },
+      ':focus': {
+        outline: 'none!important',
+        border: '1px solid',
+        borderColor: theme.palette.neutralDark
+      }
+    },
+
+    splitButtonContainerDisabled: {
+      position: 'absolute',
+    },
+
+    splitButtonMenuButton: {
+      backgroundColor: theme.palette.neutralLighter,
+      padding: '6px',
+      ':hover': {
+        backgroundColor: theme.palette.neutralLight
+      }
+    },
+
+    splitButtonMenuButtonDisabled: {
+      backgroundColor: theme.palette.neutralLighter,
+    },
+
+    splitButtonMenuIcon: {
+      color: theme.palette.neutralPrimary
+    },
+
+    splitButtonMenuIconDisabled: {
+      color: theme.palette.neutralTertiary
+    },
+
+    splitButtonMenuButtonChecked: {
+      backgroundColor: theme.palette.themePrimary,
+    },
+  };
+
+  return mergeStyleSets(iconButtonStyles, customStyles);
+});
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
new file mode 100644
index 0000000000000..2f244d5c8f3ca
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
@@ -0,0 +1,81 @@
+import * as React from 'react';
+import { DefaultButton, IconButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
+import { ISplitButtonStyles } from '../SplitButton/SplitButton.Props';
+import { Label } from 'office-ui-fabric-react/lib/Label';
+
+export class ButtonSplitExample extends React.Component<IButtonProps, {}> {
+  public constructor() {
+    super();
+  }
+
+  public render() {
+    let { disabled, checked } = this.props;
+
+    return (
+      <div>
+        <Label>Split button</Label>
+        <DefaultButton
+          data-automation-id='test'
+          disabled={ disabled }
+          checked={ checked }
+          text='Create account'
+          onClick={ () => alert('Clicked') }
+          menuProps={ {
+            items: [
+              {
+                key: 'emailMessage',
+                name: 'Email message',
+                icon: 'Mail'
+              },
+              {
+                key: 'calendarEvent',
+                name: 'Calendar event',
+                icon: 'Calendar'
+              }
+            ]
+          } }
+        />
+      </div>
+    );
+  }
+}
+
+export class ButtonSplitCustomExample extends React.Component<IButtonProps, {}> {
+  public constructor() {
+    super();
+  }
+
+  public render() {
+    let { disabled, checked } = this.props;
+    const style: ISplitButtonStyles = { splitButtonMenuButton: { backgroundColor: 'white', width: '10px' }, splitButtonMenuIcon: { fontSize: '7px' } };
+
+    return (
+      <div>
+        <Label>Custom Split button</Label>
+        <IconButton
+          data-automation-id='test'
+          disabled={ disabled }
+          checked={ checked }
+          iconProps={ { iconName: 'Emoji2' } }
+          text='Create account'
+          onClick={ () => alert('Clicked') }
+          styles={ style }
+          menuProps={ {
+            items: [
+              {
+                key: 'emailMessage',
+                name: 'Email message',
+                icon: 'Mail'
+              },
+              {
+                key: 'calendarEvent',
+                name: 'Calendar event',
+                icon: 'Calendar'
+              }
+            ]
+          } }
+        />
+      </div>
+    );
+  }
+}
\ No newline at end of file

From 8729d1e873367ac7a0f541a05878e0ef711927af Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 30 Jun 2017 12:21:22 -0700
Subject: [PATCH 0202/1641] Customizer: less React/utilities dependencies,
 better global state management. (#2105)

* This change removes the react dependency from styling, which I need to actually split some of the customizer code to get working. This also addresses the case where 2 copies of the Customizer get burned on the page. Now global settings get stored in GlobalSettings.

* Updating change requests.

* Updating some of the typing information. Moving ITheme to an interface file for consistency.

* Fixing a few more imports after validating we indeed did remove the react AMD ties from styling.
---
 .gitignore                                    |  2 +
 ...implified-customizer_2017-06-30-00-54.json | 11 +++
 ...implified-customizer_2017-06-30-00-54.json | 11 +++
 .../Button/CommandButton/CommandButton.tsx    |  3 +-
 .../Button/CompoundButton/CompoundButton.tsx  |  3 +-
 .../Button/DefaultButton/DefaultButton.tsx    |  3 +-
 .../Button/IconButton/IconButton.tsx          |  3 +-
 .../Button/PrimaryButton/PrimaryButton.tsx    |  4 +-
 packages/styling/src/glamorExports.ts         |  2 +-
 packages/styling/src/interfaces/ITheme.ts     |  9 ++
 packages/styling/src/interfaces/index.ts      |  1 +
 .../styling/src/styles/DefaultFontStyles.ts   |  9 +-
 packages/styling/src/styles/getFocusStyle.ts  |  3 +-
 packages/styling/src/styles/index.ts          |  2 +-
 packages/styling/src/styles/theme.ts          | 21 ++--
 packages/styling/src/utilities/mergeStyles.ts |  7 +-
 packages/styling/webpack.config.js            |  8 +-
 packages/utilities/api/utilities.api.ts       | 10 --
 packages/utilities/src/Customizer.tsx         | 46 ---------
 packages/utilities/src/FabricPerformance.ts   | 11 +--
 packages/utilities/src/GlobalSettings.ts      | 95 +++++++++++++++++++
 packages/utilities/src/customizable.test.tsx  |  3 +-
 packages/utilities/src/customizable.tsx       | 12 +--
 23 files changed, 173 insertions(+), 106 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/simplified-customizer_2017-06-30-00-54.json
 create mode 100644 common/changes/@uifabric/utilities/simplified-customizer_2017-06-30-00-54.json
 create mode 100644 packages/styling/src/interfaces/ITheme.ts
 create mode 100644 packages/utilities/src/GlobalSettings.ts

diff --git a/.gitignore b/.gitignore
index f44f968874ef5..46257cf4e56d7 100644
--- a/.gitignore
+++ b/.gitignore
@@ -111,3 +111,5 @@ gulp-cache
 
 # NPM debug logs
 npm-debug.log.*
+
+package-lock.json
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/simplified-customizer_2017-06-30-00-54.json b/common/changes/@uifabric/styling/simplified-customizer_2017-06-30-00-54.json
new file mode 100644
index 0000000000000..deeee3120854b
--- /dev/null
+++ b/common/changes/@uifabric/styling/simplified-customizer_2017-06-30-00-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Dependencies now use path based imports to various utilities to minimize the graph dependency.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/simplified-customizer_2017-06-30-00-54.json b/common/changes/@uifabric/utilities/simplified-customizer_2017-06-30-00-54.json
new file mode 100644
index 0000000000000..96cc49e1a9288
--- /dev/null
+++ b/common/changes/@uifabric/utilities/simplified-customizer_2017-06-30-00-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Customizer `setDefault` method moved to GlobalSettings `setValue` helper. This patches the customization code in 2 ways: 1. Multiple copies of the Customizer on the page will no longer create script errors complaining about missing themes, and 2. React is no longer pulled into the styling graph.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx
index bcf122cccf705..1a4507ba66b13 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx
@@ -1,10 +1,11 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
+import { ThemeSettingName } from '../../../Styling';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './CommandButton.styles';
 
-@customizable(['theme'])
+@customizable([ThemeSettingName])
 export class CommandButton extends BaseComponent<IButtonProps, {}> {
 
   /**
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
index caeb2f04d90e8..012ad5b60de50 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
@@ -1,10 +1,11 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
+import { ThemeSettingName } from '../../../Styling';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './CompoundButton.styles';
 
-@customizable(['theme'])
+@customizable([ThemeSettingName])
 export class CompoundButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Tell BaseComponent to bypass resolution of componentRef.
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
index 633370ddd8718..9a3f7e7d043b7 100644
--- a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
@@ -1,10 +1,11 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
+import { ThemeSettingName } from '../../../Styling';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './DefaultButton.styles';
 
-@customizable(['theme'])
+@customizable([ThemeSettingName])
 export class DefaultButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Tell BaseComponent to bypass resolution of componentRef.
diff --git a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
index f1ee410afcb22..79c2107019e50 100644
--- a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
@@ -1,10 +1,11 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
+import { ThemeSettingName } from '../../../Styling';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './IconButton.styles';
 
-@customizable(['theme'])
+@customizable([ThemeSettingName])
 export class IconButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Tell BaseComponent to bypass resolution of componentRef.
diff --git a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
index 6ef976a8f9484..376fcab34c308 100644
--- a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
@@ -1,10 +1,12 @@
 import * as React from 'react';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
+import { ThemeSettingName } from '../../../Styling';
 import { BaseButton } from '../BaseButton';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './PrimaryButton.styles';
 
-@customizable(['theme'])
+@customizable([ThemeSettingName])
+
 export class PrimaryButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Set this BaseComponent._resolveComponentRef to false, bypassing resolution of componentRef.
diff --git a/packages/styling/src/glamorExports.ts b/packages/styling/src/glamorExports.ts
index 32f01b6710deb..d6283c815832f 100644
--- a/packages/styling/src/glamorExports.ts
+++ b/packages/styling/src/glamorExports.ts
@@ -1,7 +1,7 @@
 import * as Glamor from 'glamor';
 import rtlify from 'rtl-css-js';
 import { IRawStyle, IProcessedStyle } from './interfaces/index';
-import { getRTL } from '@uifabric/utilities/lib/index';
+import { getRTL } from '@uifabric/utilities/lib/rtl';
 
 interface IGlamorRulePair {
   selector: string;
diff --git a/packages/styling/src/interfaces/ITheme.ts b/packages/styling/src/interfaces/ITheme.ts
new file mode 100644
index 0000000000000..0437c9b77214a
--- /dev/null
+++ b/packages/styling/src/interfaces/ITheme.ts
@@ -0,0 +1,9 @@
+import { IPalette } from './IPalette';
+import { IFontStyles } from './IFontStyles';
+import { ISemanticColors } from './ISemanticColors';
+
+export interface ITheme {
+  palette: IPalette;
+  fonts: IFontStyles;
+  semanticColors?: ISemanticColors;
+}
diff --git a/packages/styling/src/interfaces/index.ts b/packages/styling/src/interfaces/index.ts
index 6dbc8c420ce68..218951c85c719 100644
--- a/packages/styling/src/interfaces/index.ts
+++ b/packages/styling/src/interfaces/index.ts
@@ -5,3 +5,4 @@ export { IAnimationStyles } from './IAnimationStyles';
 export { IPalette } from './IPalette';
 export { ISemanticColors } from './ISemanticColors';
 export { IFontStyles } from './IFontStyles';
+export { ITheme } from './ITheme';
diff --git a/packages/styling/src/styles/DefaultFontStyles.ts b/packages/styling/src/styles/DefaultFontStyles.ts
index e74814b30848d..f1d6171366ce4 100644
--- a/packages/styling/src/styles/DefaultFontStyles.ts
+++ b/packages/styling/src/styles/DefaultFontStyles.ts
@@ -1,9 +1,6 @@
 import { IFontStyles, IRawStyle } from '../interfaces/index';
 import { fontFace } from '../glamorExports';
-import {
-  getLanguage,
-  getWindow
-} from '@uifabric/utilities/lib/index';
+import { getLanguage } from '@uifabric/utilities/lib/language';
 import { IFabricConfig } from '../interfaces/IFabricConfig';
 
 // Default urls.
@@ -203,10 +200,10 @@ function _registerDefaultFontFaces(): void {
  * Reads the fontBaseUrl from window.FabricConfig.fontBaseUrl or falls back to a default.
  */
 function _getFontBaseUrl(): string {
-  let win = getWindow();
+  let win: {} = typeof window !== 'undefined' ? window : undefined;
 
   // tslint:disable-next-line:no-string-literal no-any
-  let fabricConfig: IFabricConfig = win ? (win as any)['FabricConfig'] : undefined;
+  let fabricConfig: IFabricConfig = win ? win['FabricConfig'] : undefined;
 
   return (fabricConfig && fabricConfig.fontBaseUrl !== undefined) ? fabricConfig.fontBaseUrl : DefaultBaseUrl;
 }
diff --git a/packages/styling/src/styles/getFocusStyle.ts b/packages/styling/src/styles/getFocusStyle.ts
index 2f7f8addb3d05..5bd5f91e4da39 100644
--- a/packages/styling/src/styles/getFocusStyle.ts
+++ b/packages/styling/src/styles/getFocusStyle.ts
@@ -1,6 +1,5 @@
 import { mergeStyles } from '../utilities/index';
-import { IProcessedStyle } from '../interfaces/index';
-import { ITheme } from './theme';
+import { IProcessedStyle, ITheme } from '../interfaces/index';
 import { parent } from '../glamorExports';
 
 /**
diff --git a/packages/styling/src/styles/index.ts b/packages/styling/src/styles/index.ts
index 6b342cfb72d7b..881706017c0c9 100644
--- a/packages/styling/src/styles/index.ts
+++ b/packages/styling/src/styles/index.ts
@@ -4,7 +4,7 @@ export { DefaultFontStyles, FontSizes, FontWeights } from './DefaultFontStyles';
 export { IconCodes } from './IconCodes';
 export { getFocusStyle } from './getFocusStyle';
 export {
-  ITheme,
+  ThemeSettingName,
   getTheme,
   loadTheme,
   createTheme
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index ab121601ca8fb..9e9ca5e225d17 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -1,7 +1,7 @@
 import {
   IPalette,
-  IFontStyles,
-  ISemanticColors
+  ISemanticColors,
+  ITheme
 } from '../interfaces/index';
 import {
   DefaultFontStyles
@@ -9,21 +9,17 @@ import {
 import {
   DefaultPalette
 } from './DefaultPalette';
-import { Customizer, getWindow } from '@uifabric/utilities/lib/index';
-export interface ITheme {
-  palette: IPalette;
-  fonts: IFontStyles;
-  semanticColors?: ISemanticColors;
-}
 import { loadTheme as legacyLoadTheme } from '@microsoft/load-themed-styles';
-
+import { GlobalSettings } from '@uifabric/utilities/lib/GlobalSettings';
 let _theme: ITheme = {
   palette: DefaultPalette,
   semanticColors: _makeSemanticColorsFromPalette(DefaultPalette),
   fonts: DefaultFontStyles
 };
 
-let win = getWindow();
+export const ThemeSettingName = 'theme';
+
+let win = typeof window !== 'undefined' ? window : undefined;
 
 // tslint:disable:no-string-literal no-any
 if (win && (win as any)['FabricConfig'] && (win as any)['FabricConfig'].theme) {
@@ -31,7 +27,8 @@ if (win && (win as any)['FabricConfig'] && (win as any)['FabricConfig'].theme) {
 }
 // tslint:enable:no-string-literal no-any
 
-Customizer.setDefault('theme', _theme);
+// Set the default theme.
+GlobalSettings.setValue(ThemeSettingName, _theme);
 
 /**
  * Gets the theme object.
@@ -49,7 +46,7 @@ export function loadTheme(theme: Partial<ITheme>): void {
   // Load the legacy theme from the palette.
   legacyLoadTheme(_theme.palette as {});
 
-  Customizer.setDefault('theme', _theme);
+  GlobalSettings.setValue(ThemeSettingName, _theme);
 }
 
 /**
diff --git a/packages/styling/src/utilities/mergeStyles.ts b/packages/styling/src/utilities/mergeStyles.ts
index 8312a21bb4206..185dd7c3a20e3 100644
--- a/packages/styling/src/utilities/mergeStyles.ts
+++ b/packages/styling/src/utilities/mergeStyles.ts
@@ -1,6 +1,7 @@
 import { css, Rule } from 'glamor';
 import { IStyle, IProcessedStyle } from '../interfaces/index';
-import { FabricPerformance } from '@uifabric/utilities/lib/index';
+
+import { FabricPerformance } from '@uifabric/utilities/lib/FabricPerformance';
 
 /**
  * Takes a collection of collection of styles, defined in various formats, and compresses them into
@@ -34,13 +35,13 @@ export function mergeStyles(...args: (IStyle | string)[]): IProcessedStyle | str
   _parseArgs(args);
 
   let rulesObject: IStyle = null;
-  
+
   if (rules.length) {
     FabricPerformance.measure('glamor.css', () => {
       rulesObject = css(...rules);
     });
   }
-  
+
   if (classes.length) {
     if (rulesObject) {
       classes.push(rulesObject.toString());
diff --git a/packages/styling/webpack.config.js b/packages/styling/webpack.config.js
index d48d7a99462ef..f62169121828f 100644
--- a/packages/styling/webpack.config.js
+++ b/packages/styling/webpack.config.js
@@ -13,11 +13,6 @@ module.exports = {
     filename: BUNDLE_NAME + '.js',
   },
 
-  externals: {
-    'react': 'React',
-    'react-dom': 'ReactDOM'
-  },
-
   resolve: {
     alias: {
       '@uifabric/styling': path.join(__dirname, 'src')
@@ -58,7 +53,8 @@ module.exports = {
       analyzerMode: 'static',
       reportFilename: BUNDLE_NAME + '.stats.html',
       openAnalyzer: false,
-      generateStatsFile: true
+      generateStatsFile: true,
+      statsFilename: BUNDLE_NAME + '.stats.json'
     }),
     new webpack.ProvidePlugin({
       __extends: path.join(__dirname, './src', 'extends.ts')
diff --git a/packages/utilities/api/utilities.api.ts b/packages/utilities/api/utilities.api.ts
index 143ebc49fbe34..7bde26367834e 100644
--- a/packages/utilities/api/utilities.api.ts
+++ b/packages/utilities/api/utilities.api.ts
@@ -57,12 +57,8 @@ class BaseComponent<P extends IBaseProps, S> extends React.Component<P, S> {
 class Customizer extends BaseComponent<ICustomizerProps, ICustomizerState> {
   // (undocumented)
   constructor(props: any, context: any);
-  public static addChangeListener(onChanged: IChangeListener): void;
   // (undocumented)
   public getChildContext(): any;
-  public static getDefault(fieldName: string): any;
-  public static removeChangeListener(onChanged: IChangeListener): void;
-  public static setDefault(name: string, value: any): void;
 }
 
 // WARNING: defaultProps has incomplete type information
@@ -173,12 +169,6 @@ interface IBaseProps {
   componentRef?: any;
 }
 
-// (undocumented)
-interface IChangeListener {
-  // (undocumented)
-  (propName?: string): void;
-}
-
 // (undocumented)
 interface ICustomizerProps {
   // (undocumented)
diff --git a/packages/utilities/src/Customizer.tsx b/packages/utilities/src/Customizer.tsx
index e778b3feaa845..05ad4168cf576 100644
--- a/packages/utilities/src/Customizer.tsx
+++ b/packages/utilities/src/Customizer.tsx
@@ -14,13 +14,6 @@ export interface ICustomizerState {
   injectedProps?: ISettings;
 }
 
-export interface IChangeListener {
-  (propName?: string): void;
-}
-
-let _defaultValues: { [key: string]: any } = {};
-let _changeListeners: IChangeListener[] = [];
-
 /**
  * The Customizer component allows for default props to be mixed into components which
  * are decorated with the customizable() decorator. This enables injection scenarios like:
@@ -38,45 +31,6 @@ export class Customizer extends BaseComponent<ICustomizerProps, ICustomizerState
 
   public static childContextTypes = Customizer.contextTypes;
 
-  /**
-   * Sets a default value for the given field.
-   */
-  public static setDefault(name: string, value: any): void {
-    _defaultValues[name] = value;
-    Customizer._change(name);
-  }
-
-  /**
-   * Gets the current default value for a given field.
-   */
-  public static getDefault(fieldName: string): any {
-    return _defaultValues[fieldName];
-  }
-
-  /**
-   * Adds a change listener for when customizable defaults change.
-   */
-  public static addChangeListener(onChanged: IChangeListener): void {
-    _changeListeners.push(onChanged);
-  }
-
-  /**
-   * Removes a change listener that was added.
-   */
-  public static removeChangeListener(onChanged: IChangeListener): void {
-    let index = _changeListeners.indexOf(onChanged);
-
-    if (index >= 0) {
-      _changeListeners.splice(index, 1);
-    }
-  }
-
-  private static _change(propName: string) {
-    for (let onChanged of _changeListeners) {
-      onChanged(propName);
-    }
-  }
-
   constructor(props: any, context: any) {
     super(props);
 
diff --git a/packages/utilities/src/FabricPerformance.ts b/packages/utilities/src/FabricPerformance.ts
index 45bc1238bd7df..58e655fe244d2 100644
--- a/packages/utilities/src/FabricPerformance.ts
+++ b/packages/utilities/src/FabricPerformance.ts
@@ -1,5 +1,3 @@
-import { Async } from './Async';
-
 export interface IPerfData {
   duration: number;
   timeStamp: number;
@@ -21,10 +19,9 @@ const RESET_INTERVAL = 3 * 60 * 1000; // auto reset every 3 minutes
 
 export class FabricPerformance {
   public static summary: IPerfSummary = {};
-  private static _async: Async = new Async();
   private static _timeoutId: number;
   /**
-   * Measures execution time of the given syncronous function. If the same logic is executed multiple times, 
+   * Measures execution time of the given syncronous function. If the same logic is executed multiple times,
    * each individual measurement will be collected as well the overall numbers.
    * @param name - The name of this measurement
    * @param func - The logic to be measured for execution time
@@ -50,13 +47,13 @@ export class FabricPerformance {
 
   public static reset() {
     FabricPerformance.summary = {};
-    FabricPerformance._async.clearTimeout(FabricPerformance._timeoutId);
+    clearTimeout(FabricPerformance._timeoutId);
     FabricPerformance.setPeriodicReset();
   }
 
   public static setPeriodicReset(): void {
-    FabricPerformance._timeoutId = FabricPerformance._async.setTimeout(() => FabricPerformance.reset(), RESET_INTERVAL);
-  };
+    FabricPerformance._timeoutId = setTimeout(() => FabricPerformance.reset(), RESET_INTERVAL);
+  }
 }
 
 FabricPerformance.setPeriodicReset();
diff --git a/packages/utilities/src/GlobalSettings.ts b/packages/utilities/src/GlobalSettings.ts
new file mode 100644
index 0000000000000..199e2e052d87e
--- /dev/null
+++ b/packages/utilities/src/GlobalSettings.ts
@@ -0,0 +1,95 @@
+/**
+ * Storing global state in local module variables has issues when more than one copy
+ * if the module gets loaded on the page (due to a bundling error or simply by consuming
+ * a prebundled script.)
+ *
+ * This file contains helpers to deal with the getting and setting local state, and allows
+ * callers to get called back when it mutates.
+ */
+
+const GLOBAL_SETTINGS_PROP_NAME = '__globalSettings__';
+const CALLBACK_STATE_PROP_NAME = '__callbacks__';
+
+let _globalSettings: { [key: string]: any } = {};
+let _counter = 0;
+
+if (typeof window !== 'undefined') {
+  let win = window as any;
+
+  _globalSettings = win[GLOBAL_SETTINGS_PROP_NAME] = win[GLOBAL_SETTINGS_PROP_NAME] || {
+    [CALLBACK_STATE_PROP_NAME]: {}
+  };
+}
+
+const _callbacks = _globalSettings[CALLBACK_STATE_PROP_NAME];
+
+/**
+ * Change description used for change callbacks in GlobalSettings.
+ *
+ * @public
+ */
+export interface IChangeDescription {
+  key: string;
+  oldValue: any;
+  value: any;
+}
+
+/**
+ * Change event callback.
+ *
+ * @public
+ */
+export interface IChangeEventCallback {
+  __id__?: string;
+  (changeDescription?: IChangeDescription): void;
+}
+
+/**
+ * Global settings helper, which stores settings in the global (window) namespace.
+ * If window is not provided, it will store settings in module scope. Provides a
+ * way to observe changes as well when their values change.
+ *
+ * @public
+ */
+export class GlobalSettings {
+  public static getValue<T>(key: string): T {
+    return _globalSettings[key];
+  }
+
+  public static setValue<T>(key: string, value: T): void {
+    let oldValue = _globalSettings[key];
+
+    if (value !== oldValue) {
+      _globalSettings[key] = value;
+
+      let changeDescription = {
+        oldValue,
+        value,
+        key
+      };
+
+      for (let id in _callbacks) {
+        if (_callbacks.hasOwnProperty(id)) {
+          _callbacks[id](changeDescription);
+        }
+      }
+    }
+  }
+
+  public static addChangeListener(cb: IChangeEventCallback): void {
+    // Note: we use generated ids on the callbacks to create a map of the callbacks, which optimizes removal.
+    // (It's faster to delete a key than it is to look up the index of an object and splice an array.)
+    let id = cb.__id__;
+
+    if (!id) {
+      id = cb.__id__ = String(_counter++);
+    }
+
+    _callbacks[id] = cb;
+  }
+
+  public static removeChangeListener(cb: IChangeEventCallback): void {
+    delete _callbacks[cb.__id__ as string];
+  }
+
+}
diff --git a/packages/utilities/src/customizable.test.tsx b/packages/utilities/src/customizable.test.tsx
index 8ef656a1e5a5c..e54c4e5c621d4 100644
--- a/packages/utilities/src/customizable.test.tsx
+++ b/packages/utilities/src/customizable.test.tsx
@@ -2,6 +2,7 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom/server';
 import { customizable } from './customizable';
 import { Customizer } from './Customizer';
+import { GlobalSettings } from './GlobalSettings';
 
 let { expect } = chai;
 
@@ -17,7 +18,7 @@ class Foo extends React.Component<{ field: string; }, {}> {
 describe('customizable', () => {
 
   it('can inject customizations', () => {
-    Customizer.setDefault('name', 'defaultName');
+    GlobalSettings.setValue('name', 'defaultName');
 
     expect(ReactDOM.renderToStaticMarkup(<Foo field='name' />)).equals('<div>defaultName</div>');
     expect(ReactDOM.renderToStaticMarkup(<Foo field='name2' />)).equals('<div></div>');
diff --git a/packages/utilities/src/customizable.tsx b/packages/utilities/src/customizable.tsx
index a590468340c1a..5cf2e70bbe338 100644
--- a/packages/utilities/src/customizable.tsx
+++ b/packages/utilities/src/customizable.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import * as PropTypes from 'prop-types';
-import { Customizer } from './Customizer';
+import { GlobalSettings, IChangeDescription } from './GlobalSettings';
 
 export function customizable<P>(fields: string[]) {
   return function customizableFactory<P, S>(
@@ -18,11 +18,11 @@ export function customizable<P>(fields: string[]) {
       }
 
       public componentDidMount() {
-        Customizer.addChangeListener(this._onSettingChanged);
+        GlobalSettings.addChangeListener(this._onSettingChanged);
       }
 
       public componentWillUnmount() {
-        Customizer.removeChangeListener(this._onSettingChanged);
+        GlobalSettings.removeChangeListener(this._onSettingChanged);
       }
 
       public render() {
@@ -31,7 +31,7 @@ export function customizable<P>(fields: string[]) {
         for (let propName of fields) {
           (defaultProps as any)[propName] = (this.context.injectedProps) ?
             this.context.injectedProps[propName] :
-            Customizer.getDefault(propName);
+            GlobalSettings.getValue(propName);
         }
 
         return (
@@ -39,8 +39,8 @@ export function customizable<P>(fields: string[]) {
         );
       }
 
-      private _onSettingChanged(name: string) {
-        if (fields.indexOf(name) >= 0) {
+      private _onSettingChanged(change: IChangeDescription): void {
+        if (fields.indexOf(change.key) >= 0) {
           this.forceUpdate();
         }
       }

From 20e5559ad325465a6c1bdc3bbb879ce831adc9e9 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 30 Jun 2017 12:22:15 -0700
Subject: [PATCH 0203/1641] Update simplified-customizer_2017-06-30-00-54.json

---
 .../styling/simplified-customizer_2017-06-30-00-54.json       | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/common/changes/@uifabric/styling/simplified-customizer_2017-06-30-00-54.json b/common/changes/@uifabric/styling/simplified-customizer_2017-06-30-00-54.json
index deeee3120854b..19210252f45e8 100644
--- a/common/changes/@uifabric/styling/simplified-customizer_2017-06-30-00-54.json
+++ b/common/changes/@uifabric/styling/simplified-customizer_2017-06-30-00-54.json
@@ -3,9 +3,9 @@
     {
       "packageName": "@uifabric/styling",
       "comment": "Dependencies now use path based imports to various utilities to minimize the graph dependency.",
-      "type": "patch"
+      "type": "minor"
     }
   ],
   "packageName": "@uifabric/styling",
   "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
+}

From fe9c90f4775d85525dbca7d0663f5ece94196771 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 30 Jun 2017 19:44:26 +0000
Subject: [PATCH 0204/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  4 +--
 ...implified-customizer_2017-06-30-00-54.json | 11 --------
 ...implified-customizer_2017-06-30-00-54.json | 11 --------
 .../breadcrumb-flexbox_2017-06-29-18-43.json  | 11 --------
 ...ssagebar-padding-fix_2017-06-29-19-51.json | 11 --------
 packages/example-app-base/package.json        |  4 +--
 packages/example-component/package.json       |  6 ++---
 .../office-ui-fabric-react/CHANGELOG.json     | 27 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 ++++++-
 packages/office-ui-fabric-react/package.json  |  6 ++---
 packages/styling/CHANGELOG.json               | 19 +++++++++++++
 packages/styling/CHANGELOG.md                 |  9 ++++++-
 packages/styling/package.json                 |  4 +--
 packages/utilities/CHANGELOG.json             | 14 ++++++++++
 packages/utilities/CHANGELOG.md               |  9 ++++++-
 packages/utilities/package.json               |  2 +-
 16 files changed, 98 insertions(+), 60 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/simplified-customizer_2017-06-30-00-54.json
 delete mode 100644 common/changes/@uifabric/utilities/simplified-customizer_2017-06-30-00-54.json
 delete mode 100644 common/changes/office-ui-fabric-react/breadcrumb-flexbox_2017-06-29-18-43.json
 delete mode 100644 common/changes/office-ui-fabric-react/messagebar-padding-fix_2017-06-29-19-51.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 4c26d7027f48a..b5469ce661b67 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -48,12 +48,12 @@
   },
   "dependencies": {
     "@uifabric/example-app-base": "4.0.1",
-    "@uifabric/utilities": ">=4.5.0 <5.0.0",
+    "@uifabric/utilities": ">=4.6.0 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.13.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.13.2 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/simplified-customizer_2017-06-30-00-54.json b/common/changes/@uifabric/styling/simplified-customizer_2017-06-30-00-54.json
deleted file mode 100644
index 19210252f45e8..0000000000000
--- a/common/changes/@uifabric/styling/simplified-customizer_2017-06-30-00-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Dependencies now use path based imports to various utilities to minimize the graph dependency.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
diff --git a/common/changes/@uifabric/utilities/simplified-customizer_2017-06-30-00-54.json b/common/changes/@uifabric/utilities/simplified-customizer_2017-06-30-00-54.json
deleted file mode 100644
index 96cc49e1a9288..0000000000000
--- a/common/changes/@uifabric/utilities/simplified-customizer_2017-06-30-00-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Customizer `setDefault` method moved to GlobalSettings `setValue` helper. This patches the customization code in 2 ways: 1. Multiple copies of the Customizer on the page will no longer create script errors complaining about missing themes, and 2. React is no longer pulled into the styling graph.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/breadcrumb-flexbox_2017-06-29-18-43.json b/common/changes/office-ui-fabric-react/breadcrumb-flexbox_2017-06-29-18-43.json
deleted file mode 100644
index 6f6ee1eff90ec..0000000000000
--- a/common/changes/office-ui-fabric-react/breadcrumb-flexbox_2017-06-29-18-43.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Breadcrumb: Use flexbox for layout to better support multiple font sizes",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/messagebar-padding-fix_2017-06-29-19-51.json b/common/changes/office-ui-fabric-react/messagebar-padding-fix_2017-06-29-19-51.json
deleted file mode 100644
index 297522e3c6afa..0000000000000
--- a/common/changes/office-ui-fabric-react/messagebar-padding-fix_2017-06-29-19-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "MessageBar: Fixed padding regressions with multiline and no actions ",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 2cae6cf02f883..65eb61411818f 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -47,8 +47,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.11.10 <1.0.0",
-    "@uifabric/utilities": ">=4.5.0 <5.0.0",
+    "@uifabric/styling": ">=0.12.0 <1.0.0",
+    "@uifabric/utilities": ">=4.6.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.4.0 <5.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 6a58d93a367c9..b63a2f42d05a3 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-component",
-  "version": "1.0.40",
+  "version": "1.0.41",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -22,7 +22,7 @@
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
     "@uifabric/example-app-base": "4.0.1",
-    "@uifabric/utilities": "4.5.0",
+    "@uifabric/utilities": "4.6.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.13.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.13.2 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 7e3fd7ad4829f..f78f59512de76 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,33 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.13.2",
+      "tag": "office-ui-fabric-react_v4.13.2",
+      "date": "Fri, 30 Jun 2017 19:44:26 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "ac69068d153fd9a2ea6f86131bec740e09389a0f",
+            "comment": "Breadcrumb: Use flexbox for layout to better support multiple font sizes"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "8f94339b01f2a1570768172ce399c8edfb5d9a6c",
+            "comment": "MessageBar: Fixed padding regressions with multiline and no actions "
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.5.0 <5.0.0` to `>=4.6.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.11.10 <1.0.0` to `>=0.12.0 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.13.1",
       "tag": "office-ui-fabric-react_v4.13.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 84e9299ff8937..9a99fc848f6a5 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 30 Jun 2017 10:23:15 GMT and should not be manually modified.
+This log was last generated on Fri, 30 Jun 2017 19:44:26 GMT and should not be manually modified.
+
+## 4.13.2
+Fri, 30 Jun 2017 19:44:26 GMT
+
+### Patches
+
+- Breadcrumb: Use flexbox for layout to better support multiple font sizes
+- MessageBar: Fixed padding regressions with multiline and no actions 
 
 ## 4.13.1
 Fri, 30 Jun 2017 10:23:15 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index a8c4cf56b29ff..35053ce0129d7 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.13.1",
+  "version": "4.13.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -71,8 +71,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.5.0 <5.0.0",
-    "@uifabric/styling": ">=0.11.10 <1.0.0",
+    "@uifabric/utilities": ">=4.6.0 <5.0.0",
+    "@uifabric/styling": ">=0.12.0 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 288e545421e3c..e46594c76c546 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.12.0",
+      "tag": "@uifabric/styling_v0.12.0",
+      "date": "Fri, 30 Jun 2017 19:44:26 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "20e5559ad325465a6c1bdc3bbb879ce831adc9e9",
+            "comment": "Dependencies now use path based imports to various utilities to minimize the graph dependency."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.5.0 <5.0.0` to `>=4.6.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.11.10",
       "tag": "@uifabric/styling_v0.11.10",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 9fe22ae04bd2d..ecca7d903bacb 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 30 Jun 2017 10:23:15 GMT and should not be manually modified.
+This log was last generated on Fri, 30 Jun 2017 19:44:26 GMT and should not be manually modified.
+
+## 0.12.0
+Fri, 30 Jun 2017 19:44:26 GMT
+
+### Minor changes
+
+- Dependencies now use path based imports to various utilities to minimize the graph dependency.
 
 ## 0.11.10
 Fri, 30 Jun 2017 10:23:15 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index cd8e68d21464a..a28f128809310 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.11.10",
+  "version": "0.12.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.5.0 <5.0.0",
+    "@uifabric/utilities": ">=4.6.0 <5.0.0",
     "tslib": "^1.6.0",
     "rtl-css-js": "^1.1.1",
     "glamor": "^2.20.24"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index e3f1e27278c13..28d4603553d1f 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.6.0",
+      "tag": "@uifabric/utilities_v4.6.0",
+      "date": "Fri, 30 Jun 2017 19:44:26 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "8729d1e873367ac7a0f541a05878e0ef711927af",
+            "comment": "Customizer `setDefault` method moved to GlobalSettings `setValue` helper. This patches the customization code in 2 ways: 1. Multiple copies of the Customizer on the page will no longer create script errors complaining about missing themes, and 2. React is no longer pulled into the styling graph."
+          }
+        ]
+      }
+    },
     {
       "version": "4.5.0",
       "tag": "@uifabric/utilities_v4.5.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index f910014300bc8..a30827e0a8c4d 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Thu, 29 Jun 2017 20:48:31 GMT and should not be manually modified.
+This log was last generated on Fri, 30 Jun 2017 19:44:26 GMT and should not be manually modified.
+
+## 4.6.0
+Fri, 30 Jun 2017 19:44:26 GMT
+
+### Minor changes
+
+- Customizer `setDefault` method moved to GlobalSettings `setValue` helper. This patches the customization code in 2 ways: 1. Multiple copies of the Customizer on the page will no longer create script errors complaining about missing themes, and 2. React is no longer pulled into the styling graph.
 
 ## 4.5.0
 Thu, 29 Jun 2017 20:48:31 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index b015c00675458..176fd5a47f497 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.5.0",
+  "version": "4.6.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 75d138c97dc9cc06d648cb7c6f9314f7c7c1cea4 Mon Sep 17 00:00:00 2001
From: Nick Kirchem <nkirchem@users.noreply.github.com>
Date: Fri, 30 Jun 2017 16:34:19 -0400
Subject: [PATCH 0205/1641] GroupedList: Fixes bug causing Toggle or other
 button elements within a GroupedList to not render correctly (#2111)

* Fixes bug causing Toggle or other button elements within a GroupedList to not render correctly.

* Adds change file

* Update users-nickkirc-GroupedListButtonStyleFix_2017-06-30-20-05.json
---
 ...rc-GroupedListButtonStyleFix_2017-06-30-20-05.json | 11 +++++++++++
 .../src/components/GroupedList/GroupedList.scss       |  4 ----
 2 files changed, 11 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-nickkirc-GroupedListButtonStyleFix_2017-06-30-20-05.json

diff --git a/common/changes/office-ui-fabric-react/users-nickkirc-GroupedListButtonStyleFix_2017-06-30-20-05.json b/common/changes/office-ui-fabric-react/users-nickkirc-GroupedListButtonStyleFix_2017-06-30-20-05.json
new file mode 100644
index 0000000000000..5d84132154565
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-nickkirc-GroupedListButtonStyleFix_2017-06-30-20-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "GroupedList: Fixes a bug causing Toggle and other button elements within a GroupedList to not render correctly.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "nickkirc@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.scss b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.scss
index b7e254c7bd67b..d679d4c11a696 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.scss
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.scss
@@ -5,10 +5,6 @@ $groupList-ease-in-out-sine: cubic-bezier(0.445, 0.050, 0.550, 0.950);
 .root {
   position: relative;
   font-size: $ms-font-size-s;
-
-  BUTTON {
-    background-color: transparent;
-  }
 }
 
 .group {

From e073cd9849a289bbc39a4fd695848bd854d5f236 Mon Sep 17 00:00:00 2001
From: Ricky Patel <rickyp@microsoft.com>
Date: Fri, 30 Jun 2017 14:45:08 -0700
Subject: [PATCH 0206/1641] Rickyp/checkbox update (#1933)

* Changed checkbox code so it's easier to change the box size

* Added boxSide to allow changing if the checkbox is on the right or left

* Made the size of the checkbox !default for easier overriding

* Updated high contrast mode
---
 ...ickyp-checkboxUpdate_2017-06-05-20-41.json |  11 +
 .../src/components/Checkbox/Checkbox.Props.ts |   6 +
 .../src/components/Checkbox/Checkbox.scss     | 339 ++++++++++--------
 .../src/components/Checkbox/Checkbox.tsx      |  60 ++--
 .../examples/Checkbox.Basic.Example.tsx       |  24 +-
 5 files changed, 253 insertions(+), 187 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/rickyp-checkboxUpdate_2017-06-05-20-41.json

diff --git a/common/changes/office-ui-fabric-react/rickyp-checkboxUpdate_2017-06-05-20-41.json b/common/changes/office-ui-fabric-react/rickyp-checkboxUpdate_2017-06-05-20-41.json
new file mode 100644
index 0000000000000..b150f9615c7e4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/rickyp-checkboxUpdate_2017-06-05-20-41.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Changed the CSS for the checkbox so that it's easier to customize and center",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "rickyp@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
index 20033e76dd2a3..cd3d17d042df1 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
@@ -60,4 +60,10 @@ export interface ICheckboxProps extends React.HTMLAttributes<HTMLElement | HTMLI
    * precedence over the later.
    */
   inputProps?: React.HTMLAttributes<HTMLElement | HTMLInputElement>;
+
+  /**
+   * Allows you to set the checkbox to be at the before (start) or after (end) the label.
+   * @default 'start'
+   */
+  boxSide?: 'start' | 'end';
 }
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.scss b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.scss
index e3d7cba22b2e4..ca4f51d800653 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.scss
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.scss
@@ -6,216 +6,243 @@
 // Office UI Fabric
 // --------------------------------------------------
 // Checkbox styles
-
-$ms-checkbox-label-size: 20px;
+$ms-checkbox-label-size: 20px !default;
 $ms-checkbox-transition-duration: 200ms;
 $ms-checkbox-transition-timing: cubic-bezier(.4, 0, .23, 1);
-$ms-checkbox-highContrast-iconBoxSize: 16px;
+$ms-checkbox-highContrast-iconBoxSize: 16px !default;
 
-@mixin highContrast-border($active-color, $bw-color, $size: 2px) {
-  @media screen and (-ms-high-contrast: active) {
-    border: $size solid $active-color;
-  }
+// Default state
+.root {
+  overflow: hidden;
+  position: relative;
+  display: flex;
+  align-items: center;
 
-  @media screen and (-ms-high-contrast: black-on-white) {
-    border: $size solid $bw-color;
-  }
-}
+  &:hover,
+  &:active,
+  &:focus {
+    .checkbox {
+      @include ms-borderColor-neutralSecondaryAlt;
+      @media screen and (-ms-high-contrast: active) {
+        border-color: $ms-color-contrastWhiteDisabled;
+      }
 
-@mixin highContrast-color($active-color, $bw-color) {
-  @media screen and (-ms-high-contrast: active) {
-    color: $active-color;
-  }
+      @media screen and (-ms-high-contrast: black-on-white) {
+        border-color: $ms-color-contrastBlackDisabled;
+      }
+    }
+    .text {
+      @include ms-fontColor-black;
+      @media screen and (-ms-high-contrast: active) {
+        color: $ms-color-contrastWhiteDisabled;
+      }
 
-  @media screen and (-ms-high-contrast: black-on-white) {
-    color: $bw-color;
+      @media screen and (-ms-high-contrast: black-on-white) {
+        color: $ms-color-contrastBlackDisabled;
+      }
+    }
+  }
+  &.reversed {
+    > .label {
+        flex-direction: row-reverse;
+    }
   }
 }
 
-.root {
-  box-sizing: border-box;
-  color: $ms-color-neutralPrimary;
-  font-size: $ms-font-size-m;
-  font-weight: $ms-font-weight-regular;
-  min-height: 36px;
+.input {
+  position: absolute;
+  opacity: 0;
+}
+
+.label {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
   position: relative;
+  margin: 0 -4px;
 }
 
-.textLabel {
-  font-size: $ms-font-size-m;
-  @include padding(0, 0, 0, 26px);
-  display: inline-block;
-  font-size: $ms-font-size-m;
+:global(.ms-Fabric.is-focusVisible) .isInFocus .label {
+  outline: transparent;
+  &:after {
+    margin: 0 4px;
+    @include after-outline();
+  }
 }
 
-// The hidden input
-.input {
-  position: absolute;
-  opacity: 0;
-  top: 8px
+.box {
+  display: flex;
+  margin: 0 4px;
+  align-items: center;
+  justify-content: center;
+  flex: 0 0 $ms-checkbox-label-size;
+  height: $ms-checkbox-label-size;
 }
 
-// The checkbox square container
-.label::before {
-  content: '';
-  display: inline-block;
-  border: 1px solid $ms-color-neutralTertiary;
-  width: $ms-checkbox-label-size;
+.checkbox {
+  display: flex;
+  align-items: center;
+  justify-content: center;
   height: $ms-checkbox-label-size;
-  font-weight: normal;
-  position: absolute;
+  width: $ms-checkbox-label-size;
+  border: 1px solid transparent;
   box-sizing: border-box;
   transition-property: background, border, border-color;
   transition-duration: $ms-checkbox-transition-duration;
   transition-timing-function: $ms-checkbox-transition-timing;
-}
-
-// The check mark icon
-.label::after {
-  @include ms-Icon--CheckMark;
-  font-family: 'FabricMDL2Icons';
-  display: none;
-  position: absolute;
-  font-weight: 900;
-  background-color: transparent;
-  font-size: $ms-font-size-s-plus;
-  top: 0;
-  color: $ms-color-white;
-  line-height: $ms-checkbox-label-size;
-  width: $ms-checkbox-label-size;
-  text-align: center;
-}
+  /* incase the icon is bigger than the box */
+  overflow: hidden;
 
-// The checkbox label
-.label {
-  display: inline-block;
-  cursor: pointer;
-  margin-top: 8px;
-  position: relative;
-  vertical-align: top;
-  user-select: none;
-  min-width: $ms-checkbox-label-size;
-  min-height: $ms-checkbox-label-size;
-  line-height: $ms-checkbox-label-size;
-
-  &:hover {
-    &::before {
-      border-color: $ms-color-neutralSecondaryAlt;
-    }
+  @include ms-borderColor-neutralTertiary;
+  @media screen and (-ms-high-contrast: active) {
+    border-color: $ms-color-contrastBlackSelected;
+  }
 
-    .textLabel {
-      color: $ms-color-black;
-    }
+  @media screen and (-ms-high-contrast: black-on-white) {
+    border-color: $ms-color-contrastWhiteSelected;
   }
+}
 
-  &:focus {
-    &::before {
-      border-color: $ms-color-neutralSecondaryAlt;
-    }
+.checkmark {
+  opacity: 0;
+  flex: 0 0 auto;
+  @include ms-fontColor-white;
+}
 
-    &.labelIsDisabled::before {
-      border-color: $ms-color-neutralTertiaryAlt;
-    }
+.text {
+  flex: 1 0 auto;
+  margin: 0 4px;
+}
 
-    &.labelIsChecked::before {
-      border-color: $ms-color-themeDarkAlt;
-    }
-  }
+// Checked state
+.root.isChecked {
+  .checkbox {
+      @include ms-borderColor-themePrimary;
+      @include ms-bgColor-themePrimary;
+      border-width: 0px;
+      > .checkmark {
+          opacity: 1;
+      }
 
-  &:active {
-    &::before {
-      border-color: $ms-color-neutralSecondaryAlt;
-    }
+      @media screen and (-ms-high-contrast: active) {
+        height: $ms-checkbox-highContrast-iconBoxSize;
+        width: $ms-checkbox-highContrast-iconBoxSize;
+        border-width: 1px;
+        border-color: $ms-color-contrastBlackSelected;
+        background-color: $ms-color-contrastWhiteSelected;
+      }
 
-    .textLabel {
-      color: $ms-color-black;
-    }
+      @media screen and (-ms-high-contrast: black-on-white) {
+        height: $ms-checkbox-highContrast-iconBoxSize;
+        width: $ms-checkbox-highContrast-iconBoxSize;
+        border-width: 1px;
+        border-color: $ms-color-contrastBlackSelected;
+        background-color: $ms-color-contrastBlackSelected;
+      }
   }
+  &:hover,
+  &:active,
+  &:focus {
+    .checkbox {
+      @include ms-borderColor-themeDarkAlt;
+      @include ms-bgColor-themeDarkAlt;
 
-  //== State: A checkbox is checked
-  //
-  &.labelIsChecked {
-    &::before {
-      border: 1px solid $ms-color-themePrimary;
-      background-color: $ms-color-themePrimary;
+      @media screen and (-ms-high-contrast: active) {
+        border-color: $ms-color-contrastWhiteDisabled;
+        background-color: $ms-color-contrastWhiteDisabled;
+      }
 
-      @media screen and (-ms-high-contrast: active), (-ms-high-contrast: black-on-white) {
-        display: none;
+      @media screen and (-ms-high-contrast: black-on-white) {
+        border-color: $ms-color-contrastBlackDisabled;
+        background-color: $ms-color-contrastBlackDisabled;
       }
     }
+    .text {
+      @include ms-fontColor-black;
 
-    &::after {
-      display: block;
-
-      @media screen and (-ms-high-contrast: active), (-ms-high-contrast: black-on-white) {
-        height: $ms-checkbox-highContrast-iconBoxSize;
-        width: $ms-checkbox-highContrast-iconBoxSize;
-        line-height: $ms-checkbox-highContrast-iconBoxSize;
+      @media screen and (-ms-high-contrast: active) {
+        color: $ms-color-contrastWhiteDisabled;
       }
 
-      @include highContrast-border($ms-color-white, $ms-color-black);
+      @media screen and (-ms-high-contrast: black-on-white) {
+        color: $ms-color-contrastBlackDisabled;
+      }
     }
+  }
+}
+
+// Disabled state
+.root.isDisabled {
+  .checkbox {
+    @include ms-borderColor-neutralTertiaryAlt;
+    @include ms-bgColor-neutralTertiaryAlt;
+
+    @media screen and (-ms-high-contrast: active) {
+      border-color: $ms-color-contrastBlackDisabled;
+      background-color: $ms-color-contrastBlackDisabled;
+      > .checkmark {
+        @media screen and (-ms-high-contrast: active) {
+          color: $ms-color-contrastBlackDisabled;
+        }
 
-    &:not(.labelIsDisabled) {
-      &:hover,
-      &:focus {
-        &::before {
-          border-color: $ms-color-themeDarkAlt;
-          background-color: $ms-color-themeDarkAlt;
+        @media screen and (-ms-high-contrast: black-on-white) {
+          color: $ms-color-contrastWhiteDisabled;
         }
       }
     }
-  }
 
-  //== State: A disabled checkbox
-  //
-  &.labelIsDisabled {
-    cursor: default;
+    @media screen and (-ms-high-contrast: black-on-white) {
+      > .checkmark {
+        @media screen and (-ms-high-contrast: active) {
+          color: $ms-color-contrastBlackDisabled;
+        }
 
-    &::before {
-      background-color: $ms-color-neutralTertiaryAlt;
-      border-color: $ms-color-neutralTertiaryAlt;
-      color: $ms-color-neutralTertiaryAlt;
+        @media screen and (-ms-high-contrast: black-on-white) {
+          color: $ms-color-contrastWhiteDisabled;
+        }
+      }
+      background-color: $ms-color-contrastWhiteDisabled;
+      border-color: $ms-color-contrastWhiteDisabled;
     }
+  }
+  .text{
+    @include ms-fontColor-neutralTertiary;
 
-    &::after {
-      @include highContrast-border($ms-color-contrastBlackDisabled, $ms-color-contrastWhiteDisabled);
-      @include highContrast-color($ms-color-contrastBlackDisabled, $ms-color-contrastWhiteDisabled);
+    @media screen and (-ms-high-contrast: active) {
+      color: $ms-color-contrastBlackDisabled;
     }
 
-    .textLabel {
-      color: $ms-color-neutralTertiary;
-
-      @include highContrast-color($ms-color-contrastBlackDisabled, $ms-color-contrastWhiteDisabled);
+    @media screen and (-ms-high-contrast: black-on-white) {
+      color: $ms-color-contrastWhiteDisabled;
     }
   }
+  &:hover,
+  &:active,
+  &:focus {
+    .checkbox {
+      @include ms-borderColor-neutralTertiaryAlt;
+      @include ms-bgColor-neutralTertiaryAlt;
 
-    //== State: A checkbox in focus
-  //
-  &.labelIsInFocus {
-    &::before {
-      border-color: $ms-color-neutralSecondaryAlt;
-    }
+      @media screen and (-ms-high-contrast: active) {
+        border-color: $ms-color-contrastBlackDisabled;
+        background-color: $ms-color-contrastBlackDisabled;
+      }
 
-    &.labelIsDisabled::before {
-      border-color: $ms-color-neutralTertiaryAlt;
+      @media screen and (-ms-high-contrast: black-on-white) {
+        background-color: $ms-color-contrastWhiteDisabled;
+        border-color: $ms-color-contrastWhiteDisabled;
+      }
     }
+    .text {
+      @include ms-fontColor-neutralTertiary;
 
-    &.labelIsChecked::before {
-      border-color: $ms-color-themeDarkAlt;
-    }
-  }
-}
+      @media screen and (-ms-high-contrast: active) {
+        color: $ms-color-contrastBlackDisabled;
+      }
 
-:global(.ms-Fabric.is-focusVisible) .rootIsInFocus {
-  &::before {
-    content: '';
-    position: absolute;
-    top: 0px;
-    bottom: 0px;
-    left: 0;
-    right: 0;
-    border: 1px solid $focusedBorderColor;
-    @include highContrast-border($ms-color-white, $ms-color-black, 1px);
+      @media screen and (-ms-high-contrast: black-on-white) {
+        color: $ms-color-contrastWhiteDisabled;
+      }
+    }
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
index a03c435a1db94..1e948b2b9c6dc 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
@@ -5,6 +5,7 @@ import {
   css,
   getId
 } from '../../Utilities';
+import { Icon } from '../../Icon';
 import {
   ICheckbox,
   ICheckboxProps
@@ -22,13 +23,19 @@ export interface ICheckboxState {
 
 export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> implements ICheckbox {
   public static defaultProps: ICheckboxProps = {
+    boxSide: 'start'
   };
 
-  private _id: string;
   private _checkBox: HTMLInputElement;
+  private _id: string;
 
-  constructor(props: ICheckboxProps) {
-    super(props);
+  /**
+   * Initialize a new instance of the TopHeaderV2
+   * @param props Props for the component
+   * @param context Context or initial state for the base component.
+   */
+  constructor(props: ICheckboxProps, context?: any) {
+    super(props, context);
 
     this._warnMutuallyExclusive({
       'checked': 'defaultChecked'
@@ -41,7 +48,10 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
     };
   }
 
-  public render() {
+  /**
+   * Render the Checkbox based on passed props
+   */
+  public render(): JSX.Element {
     const {
       checked,
       className,
@@ -49,23 +59,22 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
       disabled,
       inputProps,
       label,
-      name
-    } = this.props;
+      name,
+      boxSide
+        } = this.props;
 
     const { isFocused } = this.state;
     const isChecked = checked === undefined ? this.state.isChecked : checked;
 
+    let rootClassName = css('ms-Checkbox', className, styles.root, {
+      ['reversed ' + styles.reversed]: boxSide !== 'start',
+      ['is-checked ' + styles.isChecked]: isChecked,
+      ['is-disabled ' + styles.isDisabled]: disabled,
+      ['is-inFocus ' + styles.isInFocus]: isFocused
+    });
+
     return (
-      <div
-        className={ css(
-          'ms-Checkbox',
-          styles.root,
-          className,
-          {
-            'is-inFocus': isFocused,
-            [styles.rootIsInFocus]: isFocused
-          }) }
-      >
+      <div className={ rootClassName } style={ this.props.style } >
         <input
           { ...inputProps }
           { ...(checked !== undefined && { checked }) }
@@ -81,18 +90,15 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
           onBlur={ this._onBlur }
           aria-checked={ isChecked }
         />
-        { this.props.children }
-        <label htmlFor={ this._id }
-          className={ css('ms-Checkbox-label', styles.label, {
-            ['is-checked ' + styles.labelIsChecked]: isChecked,
-            ['is-disabled ' + styles.labelIsDisabled]: disabled,
-            [styles.labelIsInFocus]: isFocused
-          })
-          }
-        >
-          { label && <span className={ styles.textLabel }>{ label }</span> }
+        <label className={ css('ms-Checkbox-label', styles.label) } htmlFor={ this._id }>
+          <span className={ css('box', styles.box) }>
+            <span className={ css('checkbox', styles.checkbox) }>
+              <Icon iconName='CheckMark' className={ styles.checkmark } />
+            </span>
+          </span>
+          { label && <span className={ css('text', styles.text) }>{ label }</span> }
         </label>
-      </div>
+      </div >
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
index 48577bdd8cfc5..77823c8810fa4 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
@@ -29,23 +29,39 @@ export class CheckboxBasicExample extends React.Component<{}, ICheckboxBasicExam
           inputProps={ {
             onFocus: () => { console.log('Uncontrolled checkbox is focused'); },
             onBlur: () => { console.log('Uncontrolled checkbox is blured'); }
-          } } />
+          } }
+          style={ { marginTop: 10 } }
+        />
 
         <Checkbox
           label='Uncontrolled checkbox with defaultChecked true'
           defaultChecked={ true }
-          onChange={ this._onCheckboxChange } />
+          onChange={ this._onCheckboxChange }
+          style={ { marginTop: 10 } }
+        />
 
         <Checkbox
           label='Disabled uncontrolled checkbox with defaultChecked true'
           disabled={ true }
           defaultChecked={ true }
-          onChange={ this._onCheckboxChange } />
+          onChange={ this._onCheckboxChange }
+          style={ { marginTop: 10 } }
+        />
 
         <Checkbox
           label='Controlled checkbox'
           checked={ isChecked }
-          onChange={ (ev, checked) => this.setState({ isChecked: checked }) } />
+          onChange={ (ev, checked) => {
+            this.setState({ isChecked: checked });
+          } }
+          style={ { marginTop: 10 } }
+        />
+
+        <Checkbox
+          label='Checkbox rendered with boxSide "end"'
+          boxSide='end'
+          style={ { marginTop: 10 } }
+        />
       </div>
     );
   }

From 8641c5b7144a9881413fa3bfa4c698ac47482ca2 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 3 Jul 2017 10:11:52 +0000
Subject: [PATCH 0207/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...ickyp-checkboxUpdate_2017-06-05-20-41.json | 11 --------
 ...edListButtonStyleFix_2017-06-30-20-05.json | 11 --------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 26 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 13 +++++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/CHANGELOG.json               |  6 +++++
 packages/styling/CHANGELOG.md                 |  7 ++++-
 packages/styling/package.json                 |  2 +-
 14 files changed, 59 insertions(+), 33 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/rickyp-checkboxUpdate_2017-06-05-20-41.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-nickkirc-GroupedListButtonStyleFix_2017-06-30-20-05.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index b5469ce661b67..5384b879892a6 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.13.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.14.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index b03036c258faf..a46b2db1330d4 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.13.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.14.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index e6f5e54cb774f..06142e17efc5f 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.13.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.14.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index b33a94c1fafa4..88da4f79ab9e3 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.13.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.14.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/office-ui-fabric-react/rickyp-checkboxUpdate_2017-06-05-20-41.json b/common/changes/office-ui-fabric-react/rickyp-checkboxUpdate_2017-06-05-20-41.json
deleted file mode 100644
index b150f9615c7e4..0000000000000
--- a/common/changes/office-ui-fabric-react/rickyp-checkboxUpdate_2017-06-05-20-41.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Changed the CSS for the checkbox so that it's easier to customize and center",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "rickyp@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-nickkirc-GroupedListButtonStyleFix_2017-06-30-20-05.json b/common/changes/office-ui-fabric-react/users-nickkirc-GroupedListButtonStyleFix_2017-06-30-20-05.json
deleted file mode 100644
index 5d84132154565..0000000000000
--- a/common/changes/office-ui-fabric-react/users-nickkirc-GroupedListButtonStyleFix_2017-06-30-20-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "GroupedList: Fixes a bug causing Toggle and other button elements within a GroupedList to not render correctly.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "nickkirc@microsoft.com"
-}
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 65eb61411818f..7845cc1c556d1 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -47,7 +47,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.12.0 <1.0.0",
+    "@uifabric/styling": ">=0.12.1 <1.0.0",
     "@uifabric/utilities": ">=4.6.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index b63a2f42d05a3..87f2c33d38125 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.13.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.14.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index f78f59512de76..10138af7346e8 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.14.0",
+      "tag": "office-ui-fabric-react_v4.14.0",
+      "date": "Mon, 03 Jul 2017 10:11:52 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Ricky Patel <rickyp@microsoft.com>",
+            "commit": "e073cd9849a289bbc39a4fd695848bd854d5f236",
+            "comment": "Changed the CSS for the checkbox so that it's easier to customize and center"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Nick Kirchem <nkirchem@users.noreply.github.com>",
+            "commit": "75d138c97dc9cc06d648cb7c6f9314f7c7c1cea4",
+            "comment": "GroupedList: Fixes a bug causing Toggle and other button elements within a GroupedList to not render correctly."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.12.0 <1.0.0` to `>=0.12.1 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.13.2",
       "tag": "office-ui-fabric-react_v4.13.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 9a99fc848f6a5..d011b29103a85 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 30 Jun 2017 19:44:26 GMT and should not be manually modified.
+This log was last generated on Mon, 03 Jul 2017 10:11:52 GMT and should not be manually modified.
+
+## 4.14.0
+Mon, 03 Jul 2017 10:11:52 GMT
+
+### Minor changes
+
+- Changed the CSS for the checkbox so that it's easier to customize and center
+
+### Patches
+
+- GroupedList: Fixes a bug causing Toggle and other button elements within a GroupedList to not render correctly.
 
 ## 4.13.2
 Fri, 30 Jun 2017 19:44:26 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 35053ce0129d7..104416c970357 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.13.2",
+  "version": "4.14.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.6.0 <5.0.0",
-    "@uifabric/styling": ">=0.12.0 <1.0.0",
+    "@uifabric/styling": ">=0.12.1 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index e46594c76c546..d8c476dced876 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.12.1",
+      "tag": "@uifabric/styling_v0.12.1",
+      "date": "Mon, 03 Jul 2017 10:11:52 GMT",
+      "comments": {}
+    },
     {
       "version": "0.12.0",
       "tag": "@uifabric/styling_v0.12.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index ecca7d903bacb..e5993c43bf93e 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 30 Jun 2017 19:44:26 GMT and should not be manually modified.
+This log was last generated on Mon, 03 Jul 2017 10:11:52 GMT and should not be manually modified.
+
+## 0.12.1
+Mon, 03 Jul 2017 10:11:52 GMT
+
+*Changes not tracked*
 
 ## 0.12.0
 Fri, 30 Jun 2017 19:44:26 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index a28f128809310..d65ad015ba952 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.12.0",
+  "version": "0.12.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From e28b459f1c5aa6bd33cc210c07f3f98f19083272 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Mon, 3 Jul 2017 11:59:00 -0700
Subject: [PATCH 0208/1641] Breadcrumb: Fixed maxItems logic to put correct
 items into overflow (#2109)

* Breadcrumb: Fixed maxItems logic to put correct items into overflow

* Change file

* Added test
---
 ...dcrumb-overflow-rder_2017-06-30-19-26.json | 11 +++++++++
 .../components/Breadcrumb/Breadcrumb.test.tsx | 24 ++++++++++++++++++-
 .../src/components/Breadcrumb/Breadcrumb.tsx  | 13 +++++-----
 3 files changed, 41 insertions(+), 7 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/breadcrumb-overflow-rder_2017-06-30-19-26.json

diff --git a/common/changes/office-ui-fabric-react/breadcrumb-overflow-rder_2017-06-30-19-26.json b/common/changes/office-ui-fabric-react/breadcrumb-overflow-rder_2017-06-30-19-26.json
new file mode 100644
index 0000000000000..8b3936ca1d778
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/breadcrumb-overflow-rder_2017-06-30-19-26.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Breadcrumb: Fixed maxItems logic to put correct items into overflow",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx
index f7c98cdf3981d..ce8d16a732bb8 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx
@@ -25,7 +25,7 @@ describe('Breadcrumb', () => {
     let component = ReactTestUtils.renderIntoDocument<Breadcrumb>(
       <Breadcrumb
         items={ items }
-        />
+      />
     );
 
     let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
@@ -35,4 +35,26 @@ describe('Breadcrumb', () => {
     expect(callbackValue).to.equal('TestKey');
   });
 
+  it('moves items to overflow in the correct order', () => {
+
+    const items: IBreadcrumbItem[] = [
+      { text: 'TestText1', key: 'TestKey1' },
+      { text: 'TestText2', key: 'TestKey2' },
+      { text: 'TestText3', key: 'TestKey3' },
+      { text: 'TestText4', key: 'TestKey4' }
+    ];
+
+    let component = ReactTestUtils.renderIntoDocument<Breadcrumb>(
+      <Breadcrumb
+        items={ items }
+        maxDisplayedItems={ 2 }
+      />
+    );
+
+    let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
+    let itemLink = renderedDOM.querySelectorAll('.ms-Breadcrumb-item');
+
+    expect(itemLink[0].textContent).to.equal('TestText3');
+  });
+
 });
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
index a139fb4ffb12b..9260f495510e5 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
@@ -37,11 +37,11 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
   }
 
   public render() {
-    let { onReduceData = this._onReduceData } = this.props;
-    let breadCrumbData: IBreadCrumbData = {
+    const { onReduceData = this._onReduceData, maxDisplayedItems, items } = this.props;
+    const breadCrumbData: IBreadCrumbData = {
       props: this.props,
-      renderedItems: this.props.items.slice(0, this.props.maxDisplayedItems),
-      renderedOverflowItems: this.props.items.slice(this.props.maxDisplayedItems)
+      renderedItems: items.slice(-maxDisplayedItems),
+      renderedOverflowItems: items.slice(0, -maxDisplayedItems)
     };
 
     return (
@@ -56,8 +56,9 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
   @autobind
   private _onReduceData(data: IBreadCrumbData): IBreadCrumbData | undefined {
     let { renderedItems, renderedOverflowItems } = data;
-    let movedItem = renderedItems[renderedItems.length - 1];
-    renderedItems = renderedItems.slice(0, -1);
+    let movedItem = renderedItems[0];
+    renderedItems = renderedItems.slice(1);
+
     renderedOverflowItems = [...renderedOverflowItems, movedItem];
 
     if (movedItem !== undefined) {

From 06fd7d44984cd0f1e9fcd3ed2d906de9767eddb4 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 4 Jul 2017 10:21:53 +0000
Subject: [PATCH 0209/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 ...dcrumb-overflow-rder_2017-06-30-19-26.json | 11 -----------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++++-
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/CHANGELOG.json               |  6 ++++++
 packages/styling/CHANGELOG.md                 |  7 ++++++-
 packages/styling/package.json                 |  2 +-
 10 files changed, 45 insertions(+), 19 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/breadcrumb-overflow-rder_2017-06-30-19-26.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 5384b879892a6..977db7222dd71 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.14.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.14.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/breadcrumb-overflow-rder_2017-06-30-19-26.json b/common/changes/office-ui-fabric-react/breadcrumb-overflow-rder_2017-06-30-19-26.json
deleted file mode 100644
index 8b3936ca1d778..0000000000000
--- a/common/changes/office-ui-fabric-react/breadcrumb-overflow-rder_2017-06-30-19-26.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Breadcrumb: Fixed maxItems logic to put correct items into overflow",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 7845cc1c556d1..b193184f90165 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -47,7 +47,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.12.1 <1.0.0",
+    "@uifabric/styling": ">=0.12.2 <1.0.0",
     "@uifabric/utilities": ">=4.6.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 87f2c33d38125..b490dddfe3cd4 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.14.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.14.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 10138af7346e8..bb24af80aef07 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.14.1",
+      "tag": "office-ui-fabric-react_v4.14.1",
+      "date": "Tue, 04 Jul 2017 10:21:53 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "e28b459f1c5aa6bd33cc210c07f3f98f19083272",
+            "comment": "Breadcrumb: Fixed maxItems logic to put correct items into overflow"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.12.1 <1.0.0` to `>=0.12.2 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.14.0",
       "tag": "office-ui-fabric-react_v4.14.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index d011b29103a85..c4fa07c2c3ea0 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 03 Jul 2017 10:11:52 GMT and should not be manually modified.
+This log was last generated on Tue, 04 Jul 2017 10:21:53 GMT and should not be manually modified.
+
+## 4.14.1
+Tue, 04 Jul 2017 10:21:53 GMT
+
+### Patches
+
+- Breadcrumb: Fixed maxItems logic to put correct items into overflow
 
 ## 4.14.0
 Mon, 03 Jul 2017 10:11:52 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 104416c970357..ad752081bd07f 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.14.0",
+  "version": "4.14.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.6.0 <5.0.0",
-    "@uifabric/styling": ">=0.12.1 <1.0.0",
+    "@uifabric/styling": ">=0.12.2 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index d8c476dced876..bb0cc21c67108 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.12.2",
+      "tag": "@uifabric/styling_v0.12.2",
+      "date": "Tue, 04 Jul 2017 10:21:53 GMT",
+      "comments": {}
+    },
     {
       "version": "0.12.1",
       "tag": "@uifabric/styling_v0.12.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index e5993c43bf93e..6edd73d643292 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Mon, 03 Jul 2017 10:11:52 GMT and should not be manually modified.
+This log was last generated on Tue, 04 Jul 2017 10:21:53 GMT and should not be manually modified.
+
+## 0.12.2
+Tue, 04 Jul 2017 10:21:53 GMT
+
+*Changes not tracked*
 
 ## 0.12.1
 Mon, 03 Jul 2017 10:11:52 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index d65ad015ba952..c945c2e39b8f4 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.12.1",
+  "version": "0.12.2",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 6ca067c7957ce4b8d7e85f32115dd4b77bb8ac1c Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Wed, 5 Jul 2017 11:51:30 -0400
Subject: [PATCH 0210/1641] ResizeGroup: Add caching support (#2112)

* Initial go at the cache key example

* Store items in state

* Add checked button code

* Add test that should pass when caching is implemented

* Cache measurements

* Add helper method for getting cached measurements

* Consume the cache for measured div, it will still measure the contianer.

* Don't remeasure the root on every render.

* Update the example to set a cache key.

* Unbreak window resize. Move measuredData out of state since we have a cache now.

* WIP rewrite

* getMeasuredWidth should take measured data as a parameter

* Get rid of resize logic

* Extract caching logic into objects that can be tested on it's own.

* Implement grow data

* Remove unused members.

* Pass in container width

* Get rid of _lastKnownContainerWidth

* Clean up the update container width usage.

* Add a set initialContainerWidth function

* Remove prop comparison in componentWillReceiveProps

* Consolidate duplicate lifecyle code.

* Remove setInitialContainerWidth

* more logic consolidation

* Update comment

* Delete all the tests.

* Add more comments

* Rename measurement cache

* Refactor.

* WIP refactor

* Add comments

* Formatting fix

* refactor shirnk/grow loops

* Add test

* testability refactor to allow easier injection of measurements

* Add more tests.

* More cache testing

* Add another cache test.

* Add tests for window resize

* Add legacy tests

* Make data required.

* Tewak example page to show more options

* Document cache key.

* Removing growData, not ready to merge that yet.

* Add comment on a test.

* Add comments

* Rush change.

* fix typo

* Destructure state in render.
---
 ...et-cache-key-no-grow_2017-06-30-20-42.json |  11 +
 ...et-cache-key-no-grow_2017-06-30-20-42.json |  11 +
 ...et-cache-key-no-grow_2017-06-30-20-42.json |  11 +
 ...et-cache-key-no-grow_2017-06-30-20-42.json |  11 +
 ...et-cache-key-no-grow_2017-06-30-20-42.json |  11 +
 .../ResizeGroup/ResizeGroup.Props.ts          |   8 +-
 .../ResizeGroup/ResizeGroup.test.tsx          | 634 +++++++-----------
 .../components/ResizeGroup/ResizeGroup.tsx    | 301 ++++++---
 .../ResizeGroup/ResizeGroupPage.tsx           |  51 +-
 .../examples/ResizeGroup.Example.scss         |   8 +
 .../ResizeGroup.OverflowSet.Example.tsx       | 112 +++-
 .../components/ResizeGroup/examples/data.ts   |  81 ---
 12 files changed, 675 insertions(+), 575 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
 create mode 100644 common/changes/@uifabric/fabric-website/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
 create mode 100644 common/changes/@uifabric/styling/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
 create mode 100644 common/changes/@uifabric/utilities/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
 create mode 100644 common/changes/office-ui-fabric-react/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
 delete mode 100644 packages/office-ui-fabric-react/src/components/ResizeGroup/examples/data.ts

diff --git a/common/changes/@uifabric/example-app-base/overflow-set-cache-key-no-grow_2017-06-30-20-42.json b/common/changes/@uifabric/example-app-base/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
new file mode 100644
index 0000000000000..8986a3dbd61f2
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "<christianjordangonzalez@gmail.com>"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/overflow-set-cache-key-no-grow_2017-06-30-20-42.json b/common/changes/@uifabric/fabric-website/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
new file mode 100644
index 0000000000000..fa5fca5c645eb
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "<christianjordangonzalez@gmail.com>"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/overflow-set-cache-key-no-grow_2017-06-30-20-42.json b/common/changes/@uifabric/styling/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
new file mode 100644
index 0000000000000..e6b8f7e62cafd
--- /dev/null
+++ b/common/changes/@uifabric/styling/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "<christianjordangonzalez@gmail.com>"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/overflow-set-cache-key-no-grow_2017-06-30-20-42.json b/common/changes/@uifabric/utilities/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
new file mode 100644
index 0000000000000..7eeb1bd3be6a9
--- /dev/null
+++ b/common/changes/@uifabric/utilities/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "<christianjordangonzalez@gmail.com>"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/overflow-set-cache-key-no-grow_2017-06-30-20-42.json b/common/changes/office-ui-fabric-react/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
new file mode 100644
index 0000000000000..aee85f4bef1c8
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ResizeGroup: Add support for caching",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "<christianjordangonzalez@gmail.com>"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts
index d14adb008a311..87e6dfd9263e2 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts
@@ -15,9 +15,11 @@ export interface IResizeGroupProps extends React.HTMLAttributes<ResizeGroup | HT
 
   /**
    * Initial data to be passed to the onRenderData function. This data should represent what will be passed to the
-   * render function when the parent container of the ResizeGroup is at it's maximum supported width.
+   * render function when the parent container of the ResizeGroup is at it's maximum supported width. A cacheKey property
+   * may optionally be included as part of the data. Two data objects with the same cacheKey will be assumed to take up the
+   * same width and will prevent measurements. The type of cacheKey is a string.
   */
-  data?: any;
+  data: any;
 
   /**
    * Function to render the data. Called when rendering the contents to the screen and when
@@ -26,7 +28,7 @@ export interface IResizeGroupProps extends React.HTMLAttributes<ResizeGroup | HT
   onRenderData: (data: any) => JSX.Element;
 
   /**
-   * Function to be performed on the data in order to make it fit into the given space.
+   * Function to be performed on the data in order to reduce its width and make it fit into the given space.
    * If there are no more scaling steps to apply, it should return undefined to prevent
    * an infinite render loop.
   */
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
index 52166beaf2b56..129f10410e304 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
@@ -1,13 +1,10 @@
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
-import { shallow, mount, ReactWrapper } from 'enzyme';
+import { shallow } from 'enzyme';
 import { expect } from 'chai';
-import { ResizeGroup, IResizeGroupState } from './ResizeGroup';
-import * as sinon from 'sinon';
-import * as stylesImport from './ResizeGroup.scss';
-import { injectWrapperMethod, setRenderSpy } from '@uifabric/utilities/lib/test/';
+import { ResizeGroup, IResizeGroupState, getNextResizeGroupStateProvider, getMeasurementCache } from './ResizeGroup';
 import { IResizeGroupProps } from './ResizeGroup.Props';
-const styles: any = stylesImport;
+import * as sinon from 'sinon';
 
 interface ITestScalingData {
   scalingIndex: number;
@@ -19,80 +16,15 @@ function onReduceScalingData(data: ITestScalingData): ITestScalingData {
   };
 }
 
-function getWrapperWithMocks(data: ITestScalingData = { scalingIndex: 5 },
-  onReduceData: (data: ITestScalingData) => ITestScalingData = onReduceScalingData) {
-  const onReduceDataSpy = sinon.spy(onReduceData);
-  const onRenderDataSpy = sinon.spy();
-  const dataDidRenderSpy = sinon.spy();
-
-  let wrapper = mount<IResizeGroupProps, IResizeGroupState>(<ResizeGroup
-    data={ data }
-    onReduceData={ onReduceDataSpy }
-    onRenderData={ onRenderDataSpy }
-    dataDidRender={ dataDidRenderSpy }
-  />);
-
-  return {
-    wrapper,
-    onReduceDataSpy,
-    onRenderDataSpy,
-    dataDidRenderSpy,
-    ...getMeasurementMocks(wrapper)
-  };
-}
-
-function getMeasurementMocks(wrapper: ReactWrapper<IResizeGroupProps, IResizeGroupState>) {
-  let rootGetClientRectMock = sinon.stub();
-  let measuredGetClientRectMock = sinon.stub();
-  rootGetClientRectMock.returns({ width: 0 });
-  measuredGetClientRectMock.returns({ width: 0 });
-
-  // Since measurement happens inside componentDidUpdate, we need to make sure
-  // that our mocks are attached to the DOM nodes before that code runs so that
-  // we can return fake measurements in our tests.
-  injectWrapperMethod(wrapper, 'componentDidUpdate', () => {
-    let measured = wrapper.find('.' + styles.measured);
-    if (measured.length > 0) {
-      measured.getDOMNode().getBoundingClientRect = measuredGetClientRectMock;
-    }
-
-    wrapper.getDOMNode().getBoundingClientRect = rootGetClientRectMock;
-  });
-
+function getRequiredResizeGroupProps() {
   return {
-    rootGetClientRectMock,
-    measuredGetClientRectMock
+    data: {},
+    onReduceData: sinon.stub(),
+    onRenderData: sinon.stub()
   };
 }
 
 describe('ResizeGroup', () => {
-  it('does not render ResizeGroup when no data is passed', () => {
-    const onReduceData = sinon.spy();
-    const onRenderData = sinon.spy();
-    const wrapper = shallow<IResizeGroupProps, IResizeGroupState>(
-      <ResizeGroup
-        onReduceData={ onReduceData }
-        onRenderData={ onRenderData }
-      />
-    );
-
-    expect(onRenderData.called).to.equal(false);
-  });
-
-  it('does not render ResizeGroup when empty data is passed', () => {
-    const onReduceData = sinon.spy();
-    const onRenderData = sinon.spy();
-    const wrapper = shallow<IResizeGroupProps, IResizeGroupState>(
-      <ResizeGroup
-        data={ {} }
-        onReduceData={ onReduceData }
-        onRenderData={ onRenderData }
-      />
-    );
-
-    expect(onRenderData.called).to.equal(false);
-  });
-
   it('renders the result of onRenderData', () => {
     const initialData = { content: 5 };
     const renderedDataId = 'onRenderDataId';
@@ -106,328 +38,282 @@ describe('ResizeGroup', () => {
       />
     );
 
-    expect(wrapper.containsMatchingElement(onRenderData(initialData))).to.be.true;
-
-    // Updating the renderedData state should also render new data
-    const nextData = { content: 5 };
-    wrapper.setState({ renderedData: nextData });
-    expect(wrapper.containsMatchingElement(onRenderData(nextData)));
-  });
-
-  it('remeasures if props are updated', () => {
-    const onReduceData = sinon.spy();
-    const onRenderData = sinon.spy();
-    const dataDidRender = sinon.spy();
-
-    let wrapper = mount(<ResizeGroup
-      data={ { a: 1 } }
-      onReduceData={ onReduceData }
-      onRenderData={ onRenderData }
-      dataDidRender={ dataDidRender }
-    />);
-
-    let newData = { a: 2 };
-    wrapper.setProps({
-      data: newData,
-    });
-
-    // onRenderData should get called to measure and to render when props are updated.
-    expect(onRenderData.callCount).to.equal(4);
-
-    // it should call onNewDataRendered with new properties
-    expect(dataDidRender.callCount).to.equal(2);
-    expect(dataDidRender.getCall(1).args[0]).to.deep.equal(newData);
-  });
-
-  it('calls onReduceData when contents do not fit', () => {
-    let { wrapper, onReduceDataSpy, rootGetClientRectMock, measuredGetClientRectMock } = getWrapperWithMocks();
-
-    onReduceDataSpy.reset();
-    rootGetClientRectMock.returns({ width: 50 });
-    measuredGetClientRectMock.onFirstCall().returns({ width: 75 });
-    measuredGetClientRectMock.onSecondCall().returns({ width: 40 });
-
-    wrapper.setState({ shouldMeasure: true });
-
-    expect(onReduceDataSpy.callCount).to.equal(1);
-  });
-
-  it('measures after a window resize that grows the container', () => {
-    let { onReduceDataSpy, rootGetClientRectMock, measuredGetClientRectMock, wrapper } = getWrapperWithMocks();
-
-    // Initial render with measurements
-    rootGetClientRectMock.returns({ width: 200 });
-    measuredGetClientRectMock.returns({ width: 100 });
-    wrapper.setState({ shouldMeasure: true });
-
-    onReduceDataSpy.reset();
-    rootGetClientRectMock.reset();
-    measuredGetClientRectMock.reset();
-
-    rootGetClientRectMock.returns({ width: 250 });
-    measuredGetClientRectMock.returns({ width: 100 });
-
-    let renderSpy = setRenderSpy(wrapper);
-    window.dispatchEvent(new Event('resize'));
-
-    expect(rootGetClientRectMock.callCount).to.equal(2);
-    expect(measuredGetClientRectMock.callCount).to.equal(1);
-
-    // Don't call onReduceData because everything fits.
-    expect(onReduceDataSpy.callCount).to.equal(0);
-    expect(renderSpy.callCount).to.equal(2);
+    expect(wrapper.containsMatchingElement(onRenderData(initialData))).to.equal(true);
   });
 
-  it('does not render after a window resize that shrinks the container and everything still fits', () => {
-    let { onReduceDataSpy, rootGetClientRectMock, measuredGetClientRectMock, wrapper } = getWrapperWithMocks();
-
-    // Initial render with measurements
-    rootGetClientRectMock.returns({ width: 200 });
-    measuredGetClientRectMock.returns({ width: 100 });
-    wrapper.setState({ shouldMeasure: true });
-
-    onReduceDataSpy.reset();
-    rootGetClientRectMock.reset();
-    measuredGetClientRectMock.reset();
-
-    rootGetClientRectMock.returns({ width: 150 });
-    measuredGetClientRectMock.returns({ width: 100 });
+  describe('getNextResizeGroupStateProvider', () => {
+    it('does not provide a new state when there is no container width provided or data to measure', () => {
+      const resizeGroupProps = getRequiredResizeGroupProps();
+      const resizeGroupState: IResizeGroupState = {};
+      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getMeasuredElementWidthStub = sinon.stub();
 
-    let renderSpy = setRenderSpy(wrapper);
-    window.dispatchEvent(new Event('resize'));
+      let result = getNextResizeGroupState(resizeGroupProps,
+        resizeGroupState,
+        getMeasuredElementWidthStub);
 
-    expect(rootGetClientRectMock.callCount).to.equal(1);
-    expect(measuredGetClientRectMock.callCount).to.equal(0);
-
-    // Don't call onReduceData or render because everything already fits.
-    expect(onReduceDataSpy.callCount).to.equal(0);
-    expect(renderSpy.callCount).to.equal(0);
-  });
-
-  it('does render after a window resize that shrinks the container and things do not fit', () => {
-    let { onReduceDataSpy, rootGetClientRectMock, measuredGetClientRectMock, wrapper } = getWrapperWithMocks();
-
-    // Initial render with measurements
-    rootGetClientRectMock.returns({ width: 200 });
-    measuredGetClientRectMock.returns({ width: 100 });
-    wrapper.setState({ shouldMeasure: true });
-
-    onReduceDataSpy.reset();
-    rootGetClientRectMock.reset();
-    measuredGetClientRectMock.reset();
-
-    // Simulate a resize where the contents don't fit after a resize, but they fit
-    // after calling onReduceData once.
-    rootGetClientRectMock.returns({ width: 50 });
-    measuredGetClientRectMock.onFirstCall().returns({ width: 100 });
-    measuredGetClientRectMock.onSecondCall().returns({ width: 40 });
-
-    let renderSpy = setRenderSpy(wrapper);
-    window.dispatchEvent(new Event('resize'));
-
-    expect(onReduceDataSpy.callCount).to.equal(1);
-
-    // Renders:
-    // 1. Measures the contents and determines it does not fit
-    // 2. Measures reduced contents and determines it does fit
-    // 3. Removes the measured div and updates the rendered view
-    expect(renderSpy.callCount).to.equal(3);
-  });
-
-  it('starts scaling from the initial data when the container grows', () => {
-    let data = { scalingIndex: 10 };
-
-    let { wrapper,
-      onReduceDataSpy,
-      rootGetClientRectMock,
-      measuredGetClientRectMock } = getWrapperWithMocks(data, onReduceScalingData);
-
-    // Simulate a few scale down calls.
-    rootGetClientRectMock.returns({ width: 200 });
-    measuredGetClientRectMock.onFirstCall().returns({ width: 300 });
-    measuredGetClientRectMock.onSecondCall().returns({ width: 250 });
-    measuredGetClientRectMock.onThirdCall().returns({ width: 150 });
-    wrapper.setState({ shouldMeasure: true });
-
-    expect(wrapper.state().renderedData.scalingIndex).to.equal(8);
-
-    onReduceDataSpy.reset();
-    rootGetClientRectMock.reset();
-    measuredGetClientRectMock.reset();
-
-    // Simulate a resize where the container grows
-    rootGetClientRectMock.returns({ width: 300 });
-    measuredGetClientRectMock.returns({ width: 150 });
-
-    window.dispatchEvent(new Event('resize'));
-
-    // The contents fit, so there should be no call to onReduceData
-    expect(onReduceDataSpy.callCount).to.equal(0);
-
-    // The internal state should match that of the initial data
-    expect(wrapper.state().renderedData.scalingIndex).to.equal(10);
-  });
-
-  it('continues scaling from the last rendered data when the container shrinks', () => {
-    let data = { scalingIndex: 10 };
-
-    let { wrapper,
-      onReduceDataSpy,
-      rootGetClientRectMock,
-      measuredGetClientRectMock } = getWrapperWithMocks(data, onReduceScalingData);
-
-    // Simulate a few scale down calls.
-    rootGetClientRectMock.returns({ width: 200 });
-    measuredGetClientRectMock.onFirstCall().returns({ width: 300 });
-    measuredGetClientRectMock.onSecondCall().returns({ width: 250 });
-    measuredGetClientRectMock.onThirdCall().returns({ width: 150 });
-    wrapper.setState({ shouldMeasure: true });
-
-    expect(wrapper.state().renderedData.scalingIndex).to.equal(8);
-
-    onReduceDataSpy.reset();
-    rootGetClientRectMock.reset();
-    measuredGetClientRectMock.reset();
-
-    // Simulate a resize where the container shrinks and the contents don't fit
-    // The contents will then fit after a call to onReduceData
-    rootGetClientRectMock.returns({ width: 100 });
-    measuredGetClientRectMock.onFirstCall().returns({ width: 150 });
-    measuredGetClientRectMock.onSecondCall().returns({ width: 50 });
-
-    window.dispatchEvent(new Event('resize'));
-
-    expect(onReduceDataSpy.callCount).to.equal(1);
-    expect(onReduceDataSpy.getCall(0).args[0]).to.deep.equal({ scalingIndex: 8 });
-    expect(wrapper.state().renderedData.scalingIndex).to.equal(7);
-  });
-
-  it('continues to shrink until everything fits', () => {
-    let data = { scalingIndex: 7 };
-
-    let { wrapper,
-      onReduceDataSpy,
-      rootGetClientRectMock,
-      measuredGetClientRectMock,
-      dataDidRenderSpy } = getWrapperWithMocks(data, onReduceScalingData);
-
-    dataDidRenderSpy.reset();
-    onReduceDataSpy.reset();
-    measuredGetClientRectMock.reset();
-    rootGetClientRectMock.reset();
-    rootGetClientRectMock.returns({ width: 50 });
-    measuredGetClientRectMock.onFirstCall().returns({ width: 100 });
-    measuredGetClientRectMock.onSecondCall().returns({ width: 80 });
-    measuredGetClientRectMock.onThirdCall().returns({ width: 40 });
-
-    wrapper.setState({ shouldMeasure: true });
-
-    expect(onReduceDataSpy.callCount).to.equal(2);
-    expect(onReduceDataSpy.getCall(0).args[0]).to.deep.equal(data);
-    expect(onReduceDataSpy.getCall(1).args[0]).to.deep.equal({ scalingIndex: 6 });
-    expect(wrapper.state()).to.deep.equal({
-      measuredData: data,
-      renderedData: { scalingIndex: 5 },
-      shouldMeasure: false
+      expect(result).to.equal(undefined);
+      expect(getMeasuredElementWidthStub.callCount).to.equal(0);
+    });
+    it('sets the renderedData when the contents fit', () => {
+      const dataToMeasure = { foo: 'bar' };
+      const resizeGroupProps = getRequiredResizeGroupProps();
+      const resizeGroupState: IResizeGroupState = { dataToMeasure };
+      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getMeasuredElementWidthStub = sinon.stub();
+      getMeasuredElementWidthStub.returns(25);
+
+      let result = getNextResizeGroupState(resizeGroupProps,
+        resizeGroupState,
+        getMeasuredElementWidthStub,
+        50);
+
+      expect(result).to.deep.equal({
+        renderedData: dataToMeasure,
+        measureContainer: false,
+        dataToMeasure: undefined,
+      });
+      expect(getMeasuredElementWidthStub.callCount).to.equal(1);
+    });
+    it('calls onReduceData and sets the next measuredData when contents do not fit', () => {
+      const dataToMeasure = { index: 5 };
+      const resizeGroupProps = getRequiredResizeGroupProps();
+      const resizeGroupState: IResizeGroupState = { dataToMeasure };
+      resizeGroupProps.onReduceData.returns({ index: 4 });
+      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getMeasuredElementWidthStub = sinon.stub();
+      getMeasuredElementWidthStub.returns(25);
+
+      let result = getNextResizeGroupState(resizeGroupProps,
+        resizeGroupState,
+        getMeasuredElementWidthStub,
+        10);
+
+      expect(result).to.deep.equal({
+        measureContainer: false,
+        dataToMeasure: { index: 4 },
+      });
+      expect(getMeasuredElementWidthStub.callCount).to.equal(1);
+    });
+    it('does not call getmeasuredElementBounds when the data has already been cached', () => {
+      const dataToMeasure = { index: 5, cacheKey: 'foo' };
+
+      let measurementCache = getMeasurementCache();
+      measurementCache.addMeasurementToCache(dataToMeasure, 40);
+      const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache);
+
+      const resizeGroupProps = getRequiredResizeGroupProps();
+      const resizeGroupState: IResizeGroupState = { dataToMeasure };
+      const measuredElementWidthStub = sinon.stub();
+
+      let result = getNextResizeGroupState(resizeGroupProps,
+        resizeGroupState,
+        measuredElementWidthStub,
+        100);
+
+      expect(result).to.deep.equal({
+        renderedData: dataToMeasure,
+        measureContainer: false,
+        dataToMeasure: undefined,
+      });
+      expect(measuredElementWidthStub.callCount).to.equal(0);
     });
 
-    // Each measure triggers a render, but the rendered contents only change after the measurement phase completes.
-    expect(dataDidRenderSpy.callCount).to.equal(4);
-    expect(dataDidRenderSpy.getCall(0).args[0]).to.deep.equal({ scalingIndex: 7 });
-    expect(dataDidRenderSpy.getCall(1).args[0]).to.deep.equal({ scalingIndex: 7 });
-    expect(dataDidRenderSpy.getCall(2).args[0]).to.deep.equal({ scalingIndex: 7 });
-    expect(dataDidRenderSpy.getCall(3).args[0]).to.deep.equal({ scalingIndex: 5 });
-  });
+    it('calls onReduceData multiple times when everything is in the cache', () => {
+      const dataArray = [{ cacheKey: '5' },
+      { cacheKey: '4' },
+      { cacheKey: '3' }];
+
+      let measurementCache = getMeasurementCache();
+      measurementCache.addMeasurementToCache(dataArray[0], 50);
+      measurementCache.addMeasurementToCache(dataArray[1], 40);
+      measurementCache.addMeasurementToCache(dataArray[2], 5);
+      const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache);
+
+      const resizeGroupProps = getRequiredResizeGroupProps();
+      resizeGroupProps.onReduceData.onFirstCall().returns(dataArray[1]);
+      resizeGroupProps.onReduceData.onSecondCall().returns(dataArray[2]);
+
+      const resizeGroupState: IResizeGroupState = { dataToMeasure: dataArray[0] };
+      const measuredElementWidthStub = sinon.stub();
+
+      let result = getNextResizeGroupState(resizeGroupProps,
+        resizeGroupState,
+        measuredElementWidthStub,
+        10);
+
+      expect(result).to.deep.equal({
+        renderedData: dataArray[2],
+        measureContainer: false,
+        dataToMeasure: undefined,
+      });
+      expect(measuredElementWidthStub.callCount).to.equal(0);
+    });
 
-  it('renders no more than twice when everything fits', () => {
-    let { wrapper, rootGetClientRectMock, measuredGetClientRectMock } = getWrapperWithMocks();
+    it('sets dataToMeasure when the current data is in the cache but the onReduceData is not in the cache', () => {
+      const dataArray = [{ cacheKey: '5' },
+      { cacheKey: '4' }];
 
-    rootGetClientRectMock.returns({ width: 100 });
-    measuredGetClientRectMock.returns({ width: 75 });
+      let measurementCache = getMeasurementCache();
+      measurementCache.addMeasurementToCache(dataArray[0], 50);
+      const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache);
 
-    let onRenderSpy = setRenderSpy(wrapper);
+      const resizeGroupProps = getRequiredResizeGroupProps();
+      resizeGroupProps.onReduceData.onFirstCall().returns(dataArray[1]);
 
-    wrapper.setState({ shouldMeasure: true });
+      const resizeGroupState: IResizeGroupState = { dataToMeasure: dataArray[0] };
+      const measuredElementWidthStub = sinon.stub();
 
-    // There are 2 renders. The first does a measure and a layout, the second removes the measured.
-    // Ideally, this can be optimized so that there is only 1 render, but this
-    // test makes sure it doesn't get worse than this.
-    expect(onRenderSpy.callCount).to.equal(2);
-  });
+      let result = getNextResizeGroupState(resizeGroupProps,
+        resizeGroupState,
+        measuredElementWidthStub,
+        10);
 
-  it('does not call onReduceData again when it returns undefined', () => {
-    let mockData = { data: 'foo' };
-    let onReduceDataStub = sinon.stub();
-    onReduceDataStub.returns({});
-    const onRenderDataMock = sinon.spy();
-
-    let wrapper = mount<IResizeGroupProps, IResizeGroupState>(<ResizeGroup
-      data={ mockData }
-      onReduceData={ onReduceDataStub }
-      onRenderData={ onRenderDataMock }
-    />);
-
-    let { rootGetClientRectMock, measuredGetClientRectMock } = getMeasurementMocks(wrapper);
-
-    rootGetClientRectMock.returns({ width: 50 });
-    measuredGetClientRectMock.returns({ width: 75 });
-
-    let onRenderSpy = setRenderSpy(wrapper);
-    // This test will always return that the measured contents don't fit in the root
-    // The first onReduceData call returns some data, the second returns undefined.
-    // There should not be additional calls to onReduceData after undefined is returned.
-    onReduceDataStub.reset();
-    onReduceDataStub.onFirstCall().returns(mockData);
-    onReduceDataStub.onSecondCall().returns(undefined);
-
-    wrapper.setState({
-      shouldMeasure: true
+      expect(result).to.deep.equal({
+        dataToMeasure: dataArray[1],
+        measureContainer: false,
+      });
+      expect(measuredElementWidthStub.callCount).to.equal(0);
     });
 
-    // We'll render 3 times after attaching the render spy.
-    // 1. Initial render from setting shouldMeasure
-    // 2. Second render after reducing the data
-    // 3. Third render to remove the measuring div after onReduce returns undefined
-    expect(onRenderSpy.callCount).to.equal(3);
-    expect(onReduceDataStub.callCount).to.equal(2);
-    expect(wrapper.state().shouldMeasure).to.equal(false);
-  });
+    it('renders the last measured data if onReduceData returns undefined', () => {
+      const dataToMeasure = { index: 5 };
+      const resizeGroupProps = getRequiredResizeGroupProps();
 
-  it('initially renders content even if it does not fit', () => {
-    let data = { scalingIndex: 5 };
+      const resizeGroupState: IResizeGroupState = { dataToMeasure };
+      resizeGroupProps.onReduceData.returns(undefined);
 
-    // Simulate an onReduce data that has no more scaling operations
-    let onReduceData = (_) => undefined;
+      const getNextResizeGroupState = getNextResizeGroupStateProvider();
 
-    let { rootGetClientRectMock, measuredGetClientRectMock, wrapper } = getWrapperWithMocks(data, onReduceData);
+      const getMeasuredElementWidthStub = sinon.stub();
+      getMeasuredElementWidthStub.returns(25);
 
-    // Make sure the content never fits
-    rootGetClientRectMock.returns({ width: 27 });
-    measuredGetClientRectMock.returns({ width: 52 });
+      let result = getNextResizeGroupState(resizeGroupProps,
+        resizeGroupState,
+        getMeasuredElementWidthStub,
+        10);
 
-    // Reset the internal rendered state of the component
-    wrapper.setState({
-      shouldMeasure: true,
-      renderedData: null
+      expect(result).to.deep.equal({
+        dataToMeasure: undefined,
+        renderedData: dataToMeasure,
+        measureContainer: false
+      });
+      expect(getMeasuredElementWidthStub.callCount).to.equal(1);
     });
 
-    expect(wrapper.state().renderedData).to.deep.equal(data);
-  });
+    it('renders the last measured data in the cache if onReduceData returns undefined', () => {
+      const dataArray = [{ cacheKey: '5' },
+      { cacheKey: '4' }];
+
+      let measurementCache = getMeasurementCache();
+      measurementCache.addMeasurementToCache(dataArray[0], 50);
+      measurementCache.addMeasurementToCache(dataArray[1], 40);
+      const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache);
+
+      const resizeGroupProps = getRequiredResizeGroupProps();
+      resizeGroupProps.onReduceData.onFirstCall().returns(dataArray[1]);
+      resizeGroupProps.onReduceData.onSecondCall().returns(undefined);
+
+      const resizeGroupState: IResizeGroupState = { dataToMeasure: dataArray[0] };
+      const measuredElementWidthStub = sinon.stub();
+
+      let result = getNextResizeGroupState(resizeGroupProps,
+        resizeGroupState,
+        measuredElementWidthStub,
+        10);
+
+      expect(result).to.deep.equal({
+        dataToMeasure: undefined,
+        renderedData: dataArray[1],
+        measureContainer: false
+      });
+      expect(measuredElementWidthStub.callCount).to.equal(0);
+    });
 
-  it('calls dataDidRender for the initial render', () => {
-    const initialData = { content: 7 };
-    const dataDidRender = sinon.spy();
+    it('does not crash when the container size is set and there is no dataToMeasure', () => {
+      const dataToMeasure = { foo: 'bar' };
+      const resizeGroupProps = getRequiredResizeGroupProps();
+      const resizeGroupState: IResizeGroupState = { dataToMeasure };
+      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getMeasuredElementWidthStub = sinon.stub();
+
+      let result = getNextResizeGroupState(resizeGroupProps,
+        {},
+        getMeasuredElementWidthStub,
+        50);
+
+      expect(result).to.deep.equal({
+        measureContainer: false,
+      });
+      expect(getMeasuredElementWidthStub.callCount).to.equal(0);
+    });
 
-    const wrapper = mount<IResizeGroupProps, IResizeGroupState>(
-      <ResizeGroup
-        data={ initialData }
-        onReduceData={ onReduceScalingData }
-        onRenderData={ sinon.spy() }
-        dataDidRender={ dataDidRender }
-      />
-    );
+    it('makes sure the contents still fit when the container width decreases', () => {
+      const initialWidth = 50;
+      const reducedWidth = 40;
+      const renderedData = { foo: 'bar' };
+      const resizeGroupProps = getRequiredResizeGroupProps();
+      const resizeGroupState: IResizeGroupState = { renderedData };
+      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getMeasuredElementWidthStub = sinon.stub();
+
+      // Set the initial window width
+      getNextResizeGroupState(resizeGroupProps,
+        {},
+        undefined,
+        initialWidth);
+
+      // Pass in a state that reflects some rendered data
+      let currentState = {
+        renderedData: renderedData
+      };
+
+      let result = getNextResizeGroupState(resizeGroupProps,
+        currentState,
+        getMeasuredElementWidthStub,
+        reducedWidth);
+
+      // Important to note that we do not start scaling from the initial data,
+      // we continue from the last rendered data.
+      expect(result).to.deep.equal({
+        renderedData: renderedData,
+        dataToMeasure: renderedData,
+        measureContainer: false
+      });
+      expect(getMeasuredElementWidthStub.callCount).to.equal(0);
+    });
 
-    expect(dataDidRender.callCount).to.equal(1);
-    expect(dataDidRender.getCall(0).args[0]).to.deep.equal(initialData);
+    it('starts from the beginning when the container width increases', () => {
+      const initialWidth = 50;
+      const increasedWidth = 60;
+      const renderedData = { foo: 'bar' };
+      const resizeGroupProps = { ...getRequiredResizeGroupProps(), data: { foo: 'initialData' } };
+      const resizeGroupState: IResizeGroupState = { renderedData };
+      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getMeasuredElementWidthStub = sinon.stub();
+
+      // Set the initial window width
+      getNextResizeGroupState(resizeGroupProps,
+        {},
+        undefined,
+        initialWidth);
+
+      // Pass in a state that reflects some rendered data
+      let currentState = {
+        renderedData: renderedData
+      };
+
+      let result = getNextResizeGroupState(resizeGroupProps,
+        currentState,
+        getMeasuredElementWidthStub,
+        increasedWidth);
+
+      expect(result).to.deep.equal({
+        renderedData: renderedData,
+        dataToMeasure: resizeGroupProps.data,
+        measureContainer: false
+      });
+      expect(getMeasuredElementWidthStub.callCount).to.equal(0);
+    });
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index af9f7db63c567..dc846de854181 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -10,75 +10,202 @@ const RESIZE_DELAY = 16;
 
 export interface IResizeGroupState {
 
-  /**
-   * Current set of data being measured to determine fit
-  */
-  measuredData: any;
-
   /**
    * Final data used to render proper sized component
   */
   renderedData?: any;
 
   /**
-   * A flag to determine if a new measurement should be made upon state change
-  */
-  shouldMeasure?: boolean;
+   * Data to render in a hidden div for measurement
+   */
+  dataToMeasure?: any;
+
+  /**
+   * Set to true when the content container might have new dimensions and should
+   * be remeasured.
+   */
+  measureContainer?: boolean;
 }
 
-export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupState> {
+/**
+ * Returns a simple object is able to store measurements with a given key.
+ */
+export const getMeasurementCache = () => {
+  const measurementsCache: { [key: string]: number } = {};
 
-  public static defaultProps = {
-    data: {}
+  return {
+    /**
+     * Checks if the provided data has a cacheKey. If it has a cacheKey and there is a
+     * corresponding entry in the measurementsCache, then it will return that value.
+     * Returns undefined otherwise.
+     */
+    getCachedMeasurement: (data: any): number | undefined => {
+      if (data && data.cacheKey && measurementsCache.hasOwnProperty(data.cacheKey)) {
+        return measurementsCache[data.cacheKey];
+      }
+
+      return undefined;
+    },
+    /**
+     * Should be called whenever there is a new measurement associated with a given data object.
+     * If the data has a cacheKey, store that measurement in the measurementsCache.
+     */
+    addMeasurementToCache: (data: any, measurement: number): void => {
+      if (data.cacheKey) {
+        measurementsCache[data.cacheKey] = measurement;
+      }
+    }
   };
+};
 
-  private _root: HTMLElement;
-  private _measured: HTMLElement;
-  private _lastKnownRootWidth: number | undefined = undefined;
-  private _lastKnownMeasuredWidth: number | undefined = undefined;
+/**
+ * Returns a function that is able to compute the next state for the ResizeGroup given the current
+ * state and any measurement updates.
+ */
+export const getNextResizeGroupStateProvider = (measurementCache = getMeasurementCache()) => {
+  const _measurementCache = measurementCache;
+  let _containerWidth: number | undefined;
 
-  constructor(props: IResizeGroupProps) {
-    super(props);
-    this.state = {
-      shouldMeasure: true,
-      renderedData: null,
-      measuredData: { ...this.props.data },
-    };
+  /**
+   * Gets the width of the data rendered in a hidden div.
+   * @param measuredData - The data corresponding to the measurement we wish to take.
+   * @param getElementToMeasureWidth - A function that returns the measurement of the rendered data. Only called when the measurement
+   * is not in the cache.
+   */
+  function _getMeasuredWidth(measuredData: any, getElementToMeasureWidth: () => number): number {
+    let cachedWidth = _measurementCache.getCachedMeasurement(measuredData);
+    if (cachedWidth !== undefined) {
+      return cachedWidth;
+    }
+
+    let measuredWidth = getElementToMeasureWidth();
+    _measurementCache.addMeasurementToCache(measuredData, measuredWidth);
+    return measuredWidth;
   }
 
-  public componentWillReceiveProps(nextProps: IResizeGroupProps) {
-    if (this.props.data !== nextProps.data) {
-      this.setState({
-        shouldMeasure: true,
-        renderedData: null,
-        measuredData: { ...nextProps.data }
-      });
+  /**
+   * Will get the next IResizeGroupState based on the current data while trying to shrink contents
+   * to fit in the container.
+   * @param data - The initial data point to start measuring.
+   * @param onReduceData - Function that transforms the data into something that should render with less width.
+   * @param getElementToMeasureWidth - A function that returns the measurement of the rendered data. Only called when the measurement
+   * is not in the cache.
+   */
+  function _shrinkContentsUntilTheyFit(data: any,
+    onReduceData: (prevData: any) => any,
+    getElementToMeasureWidth: () => number): IResizeGroupState {
+    let dataToMeasure = data;
+    let measuredWidth = _getMeasuredWidth(data, getElementToMeasureWidth);
+
+    while (measuredWidth > _containerWidth) {
+      let nextMeasuredData = onReduceData(dataToMeasure);
+
+      // We don't want to get stuck in an infinite render loop when there are no more
+      // scaling steps, so implementations of onReduceData should return undefined when
+      // there are no more scaling states to apply.
+      if (nextMeasuredData === undefined) {
+        return {
+          renderedData: dataToMeasure,
+          dataToMeasure: undefined
+        };
+      }
+
+      measuredWidth = _measurementCache.getCachedMeasurement(nextMeasuredData);
+
+      // If the measurement isn't in the cache, we need to rerender with some data in a hidden div
+      if (measuredWidth === undefined) {
+        return {
+          dataToMeasure: nextMeasuredData
+        };
+      }
+
+      dataToMeasure = nextMeasuredData;
     }
+
+    return {
+      renderedData: dataToMeasure,
+      dataToMeasure: undefined
+    };
   }
 
-  public componentDidMount() {
-    this._measureItems();
-    this._events.on(window, 'resize', this._async.debounce(this._onResize, RESIZE_DELAY, { leading: true }));
+  /**
+   * Handles an update to the container width. Should only be called when we knew the previous container width.
+   * @param newWidth - The new width of the container.
+   * @param fullWidthData - The initial data passed in as a prop to resizeGroup.
+   * @param renderedData - The data that was rendered prior to the container size changing.
+   */
+  function _updateContainerWidth(newWidth: number, fullWidthData: any, renderedData: any): IResizeGroupState {
+    let nextState: IResizeGroupState;
+    if (newWidth > _containerWidth) {
+      nextState = {
+        dataToMeasure: fullWidthData
+      };
+    } else {
+      nextState = {
+        dataToMeasure: renderedData
+      };
+    }
+    _containerWidth = newWidth;
+    return { ...nextState, measureContainer: false };
   }
 
-  public componentWillUnmount() {
-    this._lastKnownRootWidth = undefined;
-    this._lastKnownMeasuredWidth = undefined;
+  return (props: IResizeGroupProps,
+    currentState: IResizeGroupState,
+    getElementToMeasureWidth: () => number,
+    newContainerWidth?: number): IResizeGroupState | undefined => {
+    // If there is no new container width or data to measure, there is no need for a new state update
+    if (newContainerWidth === undefined && currentState.dataToMeasure === undefined) {
+      return undefined;
+    }
+
+    if (newContainerWidth) {
+      // If we know what the last container size was and we rendered data at that width, we can do an optimized render
+      if (_containerWidth && currentState.renderedData) {
+        return { ...currentState, ..._updateContainerWidth(newContainerWidth, props.data, currentState.renderedData) };
+      }
+
+      // If we are just setting the container width for the first time, we can't do any optimizations
+      _containerWidth = newContainerWidth;
+    }
+
+    let nextState: IResizeGroupState = {
+      ...currentState,
+      measureContainer: false
+    };
+
+    if (currentState.dataToMeasure) {
+      nextState = {
+        ...nextState,
+        ..._shrinkContentsUntilTheyFit(currentState.dataToMeasure, props.onReduceData, getElementToMeasureWidth)
+      };
+    }
+
+    return nextState;
+  };
+};
+
+export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupState> {
+  private _getNextResizeGroupState = getNextResizeGroupStateProvider();
+  private _root: HTMLElement;
+  private _measured: HTMLElement;
+
+  constructor(props: IResizeGroupProps) {
+    super(props);
+    this.state = {
+      dataToMeasure: { ...this.props.data },
+      measureContainer: true,
+    };
   }
 
   public render() {
     const { onRenderData, data } = this.props;
-    const { shouldMeasure, renderedData, measuredData } = this.state;
-
-    if (Object.keys(data).length === 0) {
-      return null;
-    }
+    const { dataToMeasure, renderedData } = this.state;
 
     return (
       <div className={ css('ms-ResizeGroup') } ref={ this._resolveRef('_root') }>
-        { shouldMeasure && (
+        { dataToMeasure && (
           <div className={ css(styles.measured) } ref={ this._resolveRef('_measured') }>
-            { onRenderData(measuredData) }
+            { onRenderData(dataToMeasure) }
           </div>
         ) }
 
@@ -87,80 +214,46 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
     );
   }
 
-  public componentDidUpdate(prevProps: IResizeGroupProps) {
-    this._measureItems();
+  public componentDidMount() {
+    this._afterComponentRendered();
+    this._events.on(window, 'resize', this._async.debounce(this._onResize, RESIZE_DELAY, { leading: true }));
+  }
 
+  public componentWillReceiveProps(nextProps: IResizeGroupProps) {
+    this.setState({
+      dataToMeasure: { ...nextProps.data },
+      renderedData: undefined,
+      measureContainer: true // Receiving new props means the parent might rerender and the root width might change
+    });
+  }
+
+  public componentDidUpdate(prevProps: IResizeGroupProps) {
     if (this.state.renderedData) {
       if (this.props.dataDidRender) {
         this.props.dataDidRender(this.state.renderedData);
       }
     }
+    this._afterComponentRendered();
   }
 
-  private _onResize() {
-    let shouldMeasure = true;
-    let nextMeasuredData = this.state.measuredData;
-
-    if (this._root && this._lastKnownRootWidth && this._lastKnownMeasuredWidth) {
-      // If we have some cached measurements, let's see if we can skip rendering
-      let containerWidth = this._root.getBoundingClientRect().width;
-
-      if (containerWidth <= this._lastKnownRootWidth) {
-        // If the container shrank as a result of this resize, we can do an optimized rerender.
-        if (this._lastKnownMeasuredWidth <= containerWidth) {
-          // If the contents still fit within the container, don't trigger a remeasure.
-          this._lastKnownRootWidth = containerWidth;
-          shouldMeasure = false;
-        } else {
-          // If the container shrank and the contents don't fit, we can trigger a measurement
-          // pass starting from the current value of rendered data.
-          nextMeasuredData = this.state.renderedData;
-        }
-      }
+  private _afterComponentRendered() {
+    let containerWidth = undefined;
+    if (this.state.measureContainer) {
+      containerWidth = this._root.getBoundingClientRect().width;
     }
+    let nextState = this._getNextResizeGroupState(this.props,
+      this.state,
+      () => this._measured.getBoundingClientRect().width,
+      containerWidth);
 
-    if (shouldMeasure) {
-      this.setState({
-        shouldMeasure: true,
-        measuredData: nextMeasuredData
-      });
+    if (nextState) {
+      this.setState(nextState);
     }
   }
 
-  private _setStateToDoneMeasuring() {
-    this.setState((prevState, props) => {
-      return {
-        renderedData: prevState.measuredData,
-        measuredData: { ...this.props.data },
-        shouldMeasure: false
-      };
-    });
-  }
-
-  private _measureItems() {
-    const { data, onReduceData } = this.props;
-    const { shouldMeasure } = this.state;
-
-    if (shouldMeasure && Object.keys(data).length !== 0 && this._root && this._measured) {
-      const containerWidth = this._lastKnownRootWidth = this._root.getBoundingClientRect().width;
-      const measuredWidth = this._lastKnownMeasuredWidth = this._measured.getBoundingClientRect().width;
-      if ((measuredWidth > containerWidth)) {
-        let nextMeasuredData = onReduceData(this.state.measuredData);
-
-        // We don't want to get stuck in an infinite render loop when there are no more
-        // scaling steps, so implementations of onReduceData should return undefined when
-        // there are no more scaling states to apply.
-        if (nextMeasuredData !== undefined) {
-          this.setState({
-            measuredData: nextMeasuredData,
-          });
-        } else {
-          this._setStateToDoneMeasuring();
-        }
-
-      } else {
-        this._setStateToDoneMeasuring();
-      }
+  private _onResize() {
+    if (this._root) {
+      this.setState({ measureContainer: true });
     }
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
index 60e0baeef4619..21063932a4215 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
@@ -32,8 +32,55 @@ export class ResizeGroupPage extends React.Component<any, any> {
         }
         overview={
           <div>
-            <Link target='_blank' href='http://dev.office.com/fabric/components/ResizeGroup'>ResizeGroup</Link>
-            <span> supplement content associated with a specific UI component.</span>
+            <span>
+              <p>
+                ResizeGroup is a React component that can be used to help fit the right amount of content within a container. The consumer
+                of the ResizeGroup provides some initial data, a reduce function, and a render function. The render function is responsible
+                for populating the contents of a the container when given some data. The initial data should represent the data that should
+                be rendered when the ResizeGroup has infinite width. If the contents returned by the render function do not fit within the
+                ResizeGroup, the reduce function is called to get a version of the data whose rendered width should be smaller than the data
+                that was just rendered.
+              </p>
+              <p>
+                An example scenario is shown below, where controls that do not fit on screen are rendered in an overflow menu. The data in
+                this situation is a list of 'primary' controls that are rendered on the top level and a set of overflow controls rendered in
+                the overflow menu. The initial data in this case has all the controls in the primary set. The implementation of onReduceData
+                moves a control from the overflow well into the primary control set.
+              </p>
+              <p>
+                This component queries the DOM for the dimensions of elements. Too many of these dimension queries will negatively affect
+                the performance of the component and could cause poor interactive performance on websites. One way to reduce the number of
+                measurements performed by the component is to provide a cacheKey in the initial data and in the return value of
+                onReduceData. Two data objects with the same cacheKey are assumed to have the same width, resulting in measurements being
+                skipped for that data object. In the controls with an overflow example, the cacheKey is simply the concatenation of the
+                keys of the controls that appear in the top level.
+              </p>
+            </span>
+          </div>
+        }
+        dos={
+          <div>
+            <ul>
+              <li>
+                Ensure the width of the parent of this component has a fixed width that does not depend on the dimensions of it's children.
+                Failure to do so may result in ResizeGroup attempting to fill a width of 0px.
+              </li>
+              <li>
+                Ensure that result of rendering the data returned by onReduceData is actually smaller than the previous data.
+              </li>
+              <li>
+                Include a cacheKey in your data to improve performance. Two objects with the same cacheKey are assumed to have the same
+                width, so the ResizeGroup will only store one measurement per resize group.g
+               </li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul>
+              <li>Do any DOM measurements inside your onReduce function as this will degrade performance</li>
+              <li>Provide too many different return values for onReduce, it will degrade performance</li>
+            </ul>
           </div>
         }
       />
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.Example.scss b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.Example.scss
index 258a38f55a8b6..04567e190c5da 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.Example.scss
@@ -11,4 +11,12 @@
   button {
     margin-right: 20px;
   }
+}
+
+.settingsGroup {
+  padding-top: 20px;
+}
+
+.itemCountDropdown {
+  width: 180px;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
index abfbd6927443f..5aa17de566a8f 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
@@ -1,36 +1,92 @@
 import * as React from 'react';
-import { BaseComponent } from 'office-ui-fabric-react/lib/Utilities';
+import { BaseComponent, autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton, PrimaryButton } from 'office-ui-fabric-react/lib/Button';
 import { ResizeGroup } from 'office-ui-fabric-react/lib/ResizeGroup';
 import { OverflowSet } from '../../OverflowSet';
+import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
+import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { Dropdown, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
 
 import * as stylesImport from './ResizeGroup.Example.scss';
 const styles: any = stylesImport;
 
-import { data } from './data';
+export interface IOverflowData {
+  primary: IContextualMenuItem[];
+  overflow: IContextualMenuItem[];
+  cacheKey?: string;
+}
 
-export class ResizeGroupOverflowSetExample extends BaseComponent<any, any> {
+function generateData(count: number, cachingEnabled: boolean, checked: boolean): IOverflowData {
+  const icons = ['Add', 'Share', 'Upload'];
+  let dataItems = [];
+  let cacheKey = '';
+  for (let index = 0; index < count; index++) {
+    let item = {
+      key: `item${index}`,
+      name: `Item ${index}`,
+      icon: icons[index % icons.length],
+      checked: checked
+    };
+
+    cacheKey = cacheKey + item.key;
+    dataItems.push(item);
+  }
+
+  let result = {
+    primary: dataItems,
+    overflow: []
+  };
+
+  if (cachingEnabled) {
+    result = { ...result, cacheKey };
+  }
+
+  return result;
+}
+
+export interface IResizeGroupOverflowSetExampleState {
+  short: boolean;
+  numberOfItems: number;
+  buttonsChecked: boolean;
+  cachingEnabled: boolean;
+}
+
+function computeCacheKey(primaryControls: IContextualMenuItem[]): string {
+  return primaryControls.reduce((acc, current) => acc + current.key, '');
+}
+
+export class ResizeGroupOverflowSetExample extends BaseComponent<any, IResizeGroupOverflowSetExampleState> {
 
   constructor(props) {
     super(props);
     this.state = {
-      short: false
+      short: false,
+      buttonsChecked: false,
+      cachingEnabled: false,
+      numberOfItems: 20
     };
   }
 
   public render() {
+    let { numberOfItems, cachingEnabled, buttonsChecked, short } = this.state;
+    let dataToRender = generateData(numberOfItems, cachingEnabled, buttonsChecked);
     return (
-      <div className={ this.state.short ? styles.resizeIsShort : 'notResized' }>
+      <div className={ short ? styles.resizeIsShort : 'notResized' }>
         <ResizeGroup
-          data={ data }
-          onReduceData={ (currentdata) => {
-            if (currentdata.primary.length === 0) {
+          data={ dataToRender }
+          onReduceData={ (currentData) => {
+            if (currentData.primary.length === 0) {
               return undefined;
             }
 
-            let overflow = currentdata.overflow.concat(currentdata.primary.slice(-1));
-            let primary = currentdata.primary.slice(0, -1);
-            return { primary, overflow };
+            let overflow = [...currentData.primary.slice(-1), ...currentData.overflow];
+            let primary = currentData.primary.slice(0, -1);
+
+            let cacheKey = undefined;
+            if (cachingEnabled) {
+              cacheKey = computeCacheKey(primary);
+            }
+            return { primary, overflow, cacheKey };
           } }
           onRenderData={ (data) => {
             return (
@@ -43,6 +99,7 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<any, any> {
                       text={ item.name }
                       iconProps={ { iconName: item.icon } }
                       onClick={ item.onClick }
+                      checked={ item.checked }
                     />
                   );
                 } }
@@ -57,7 +114,40 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<any, any> {
             );
           } }
         />
+        <div className={ styles.settingsGroup }>
+          <Checkbox label='Enable caching' onChange={ this.onCachingEnabledChanged } checked={ cachingEnabled } />
+          <Checkbox label='Buttons checked' onChange={ this.onButtonsCheckedChanged } checked={ buttonsChecked } />
+          <div className={ styles.itemCountDropdown } >
+            <Dropdown
+              label='Number of items to render'
+              selectedKey={ numberOfItems.toString() }
+              onChanged={ this.onNumberOfItemsChanged }
+              options={
+                [{ key: '20', text: '20' },
+                { key: '30', text: '30' },
+                { key: '40', text: '40' },
+                { key: '50', text: '50' },
+                { key: '75', text: '75' },
+                { key: '100', text: '100' },
+                { key: '200', text: '200' }] } />
+          </div>
+        </div>
       </div>
     );
   }
+
+  @autobind
+  private onCachingEnabledChanged(_, checked: boolean) {
+    this.setState({ cachingEnabled: checked });
+  }
+
+  @autobind
+  private onButtonsCheckedChanged(_, checked: boolean) {
+    this.setState({ buttonsChecked: checked });
+  }
+
+  @autobind
+  private onNumberOfItemsChanged(option: IDropdownOption) {
+    this.setState({ numberOfItems: parseInt(option.text, 10) });
+  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/data.ts b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/data.ts
deleted file mode 100644
index 7c93e1ad2504d..0000000000000
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/data.ts
+++ /dev/null
@@ -1,81 +0,0 @@
-export const data = {
-  primary: [
-    {
-      key: 'newItem',
-      name: 'New',
-      icon: 'Add',
-      ariaLabel: 'New. Use left and right arrow keys to navigate',
-      onClick: () => { return; },
-    },
-    {
-      key: 'upload',
-      name: 'Upload',
-      icon: 'Upload',
-      onClick: () => { return; },
-    },
-    {
-      key: 'share',
-      name: 'Share',
-      icon: 'Share',
-      onClick: () => { return; }
-    },
-    {
-      key: 'newItem2',
-      name: 'New',
-      icon: 'Add',
-      ariaLabel: 'New. Use left and right arrow keys to navigate',
-      onClick: () => { return; },
-    },
-    {
-      key: 'upload2',
-      name: 'Upload',
-      icon: 'Upload',
-      onClick: () => { return; },
-    },
-    {
-      key: 'share2',
-      name: 'Share',
-      icon: 'Share',
-      onClick: () => { return; }
-    },
-    {
-      key: 'newItem3',
-      name: 'New',
-      icon: 'Add',
-      ariaLabel: 'New. Use left and right arrow keys to navigate',
-      onClick: () => { return; },
-    },
-    {
-      key: 'upload3',
-      name: 'Upload',
-      icon: 'Upload',
-      onClick: () => { return; },
-    },
-    {
-      key: 'share3',
-      name: 'Share',
-      icon: 'Share',
-      onClick: () => { return; }
-    },
-    {
-      key: 'newItem4',
-      name: 'New',
-      icon: 'Add',
-      ariaLabel: 'New. Use left and right arrow keys to navigate',
-      onClick: () => { return; },
-    },
-    {
-      key: 'upload4',
-      name: 'Upload',
-      icon: 'Upload',
-      onClick: () => { return; },
-    },
-    {
-      key: 'share4',
-      name: 'Share',
-      icon: 'Share',
-      onClick: () => { return; }
-    }
-  ],
-  overflow: []
-};

From 8555ad54c2b4ec7f0e58ebc6ab0032df7a44002b Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 5 Jul 2017 08:54:52 -0700
Subject: [PATCH 0211/1641] Toggle: Fixed aria-label that was missing from
 button (#2123)

* Toggle: Fixed aria-label that was missing from button

* Change file
---
 .../toggle-aria-label_2017-07-03-16-50.json         | 11 +++++++++++
 .../src/components/Toggle/Toggle.test.tsx           | 13 +++++++++++++
 .../src/components/Toggle/Toggle.tsx                |  1 +
 3 files changed, 25 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/toggle-aria-label_2017-07-03-16-50.json

diff --git a/common/changes/office-ui-fabric-react/toggle-aria-label_2017-07-03-16-50.json b/common/changes/office-ui-fabric-react/toggle-aria-label_2017-07-03-16-50.json
new file mode 100644
index 0000000000000..15f42a2353f87
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/toggle-aria-label_2017-07-03-16-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Toggle: Fixed aria-label that was missing from button",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
index 9e2d3e79bba88..d49d6ea68338f 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
@@ -23,6 +23,19 @@ describe('Toggle', () => {
     expect(labelElement.textContent).to.equal('Label');
   });
 
+  it('renders aria-label', () => {
+    let component = ReactTestUtils.renderIntoDocument(
+      <Toggle
+        label='Label'
+        offAriaLabel='offLabel'
+      />
+    );
+    let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
+    let labelElement = renderedDOM.querySelector('button');
+
+    expect(labelElement.getAttribute('aria-label')).to.equal('offLabel');
+  });
+
   it('can call the callback on a change of toggle', () => {
     let isToggledValue;
     let callback = (isToggled) => {
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
index 8abab557198cf..948b0dc643488 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
@@ -113,6 +113,7 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
             ref={ (c): HTMLButtonElement => this._toggleButton = c }
             aria-disabled={ disabled }
             aria-pressed={ isChecked }
+            aria-label={ ariaLabel }
             id={ this._id }
             onChange={ () => { /* no-op */ } }
             disabled={ disabled }

From d9683d319f2e66ab294212682bdb4abdbb32107d Mon Sep 17 00:00:00 2001
From: Marena Richardson <marena.richardson@gmail.com>
Date: Wed, 5 Jul 2017 13:58:59 -0700
Subject: [PATCH 0212/1641] Fix details row cell size (#2137)

* Make details row use flex box

* change file
---
 .../fix-details-row-cell-size_2017-07-05-18-22.json   | 11 +++++++++++
 .../src/components/DetailsList/DetailsRow.scss        |  5 +++--
 2 files changed, 14 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-details-row-cell-size_2017-07-05-18-22.json

diff --git a/common/changes/office-ui-fabric-react/fix-details-row-cell-size_2017-07-05-18-22.json b/common/changes/office-ui-fabric-react/fix-details-row-cell-size_2017-07-05-18-22.json
new file mode 100644
index 0000000000000..23ae10a2f7445
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-details-row-cell-size_2017-07-05-18-22.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Make details row cells use flex box and stretch to total row height.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "maricha@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
index a9b36006dcee6..88ebc8c162ec6 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
@@ -11,7 +11,7 @@ $detailsList-item-selected-hover-color: $listItemSelectedHoverColor;
 .root {
   @include focus-border();
 
-  display: inline-block;
+  display: flex;
   min-width: 100%;
   min-height: $rowHeight;
   margin: 1px 0;
@@ -74,7 +74,8 @@ $detailsList-item-selected-hover-color: $listItemSelectedHoverColor;
 }
 
 .fields {
-  display: inline-block;
+  display: flex;
+  align-items: stretch;
 }
 
 .cellMeasurer .cell {

From 44951ccc9715a43f363c79a33ed1c1a4f320d69c Mon Sep 17 00:00:00 2001
From: Eddie Liu <leddie24@gmail.com>
Date: Wed, 5 Jul 2017 14:38:11 -0700
Subject: [PATCH 0213/1641] CommandBar: Remove margin from command bar items
 (#2102)

* Remove margin from command bar items

* Change file
---
 ...dwliu-commandbar-item-margin_2017-06-29-20-26.json | 11 +++++++++++
 .../src/components/CommandBar/CommandBar.scss         |  1 -
 2 files changed, 11 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-edwliu-commandbar-item-margin_2017-06-29-20-26.json

diff --git a/common/changes/office-ui-fabric-react/v-edwliu-commandbar-item-margin_2017-06-29-20-26.json b/common/changes/office-ui-fabric-react/v-edwliu-commandbar-item-margin_2017-06-29-20-26.json
new file mode 100644
index 0000000000000..68c64bef96f84
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-edwliu-commandbar-item-margin_2017-06-29-20-26.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "CommandBar: Remove margin from command bar items",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-edwliu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss
index e3cfabf5a42cc..84d0af8002b9e 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss
@@ -77,7 +77,6 @@ $SearchBox-sidePadding: 8px; // padding in input on left and right sides without
   height: $CommandBarItem-height;
   outline: transparent;
   vertical-align: top;
-  margin: 0 4px;
 
   &:hover {
     background-color: $ms-color-neutralLight;

From 6f272bbaf04d106c990637f78cb38ec84fa00ed7 Mon Sep 17 00:00:00 2001
From: Aniket Handa <atneik@users.noreply.github.com>
Date: Wed, 5 Jul 2017 16:21:48 -0700
Subject: [PATCH 0214/1641] New Component: HoverCard (#2047)

* Init

* Use glamour

* Add onRender methods

* Update event handling

* Fix click open

* Init Animation

* RTL and perf

* Cleanup and move some styles to example

* Tslint, theme fixes

* Demo fixes

* nit

* Add rush change

* Fix scrolling issues

* Add sticky behavior

* Polish scroll and shadows

* Nits

* Move mode state to Host, renames

* Tslint fixes

* Update props name and comments
---
 .../anihan-hover-card_2017-06-22-01-39.json   |  11 ++
 .../anihan-hover-card_2017-06-22-01-39.json   |  11 ++
 .../anihan-hover-card_2017-06-22-01-39.json   |  11 ++
 .../anihan-hover-card_2017-06-22-01-39.json   |  11 ++
 .../anihan-hover-card_2017-06-22-01-39.json   |  11 ++
 .../office-ui-fabric-react/src/HoverCard.ts   |   1 +
 .../src/components/Callout/Callout.Props.ts   |   6 +
 .../src/components/Callout/Callout.scss       |   4 +
 .../src/components/Callout/CalloutContent.tsx |  35 +++-
 .../HoverCard/ExpandingCard.Props.ts          | 106 +++++++++++++
 .../HoverCard/ExpandingCard.styles.ts         |  47 ++++++
 .../components/HoverCard/ExpandingCard.tsx    | 142 +++++++++++++++++
 .../components/HoverCard/HoverCard.Props.ts   |  72 +++++++++
 .../components/HoverCard/HoverCard.styles.ts  |  16 ++
 .../src/components/HoverCard/HoverCard.tsx    | 149 ++++++++++++++++++
 .../components/HoverCard/HoverCardPage.scss   |   6 +
 .../components/HoverCard/HoverCardPage.tsx    |  45 ++++++
 .../examples/HoverCard.Basic.Example.tsx      |  96 +++++++++++
 .../HoverCard/examples/HoverCard.Example.scss |  19 +++
 .../src/components/HoverCard/index.ts         |   5 +
 .../src/demo/AppDefinition.tsx                |   8 +-
 packages/office-ui-fabric-react/src/index.ts  |   1 +
 22 files changed, 809 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/anihan-hover-card_2017-06-22-01-39.json
 create mode 100644 common/changes/@uifabric/fabric-website/anihan-hover-card_2017-06-22-01-39.json
 create mode 100644 common/changes/@uifabric/styling/anihan-hover-card_2017-06-22-01-39.json
 create mode 100644 common/changes/@uifabric/utilities/anihan-hover-card_2017-06-22-01-39.json
 create mode 100644 common/changes/office-ui-fabric-react/anihan-hover-card_2017-06-22-01-39.json
 create mode 100644 packages/office-ui-fabric-react/src/HoverCard.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.styles.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Example.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/HoverCard/index.ts

diff --git a/common/changes/@uifabric/example-app-base/anihan-hover-card_2017-06-22-01-39.json b/common/changes/@uifabric/example-app-base/anihan-hover-card_2017-06-22-01-39.json
new file mode 100644
index 0000000000000..fa53882beab0f
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/anihan-hover-card_2017-06-22-01-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "anihan@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/anihan-hover-card_2017-06-22-01-39.json b/common/changes/@uifabric/fabric-website/anihan-hover-card_2017-06-22-01-39.json
new file mode 100644
index 0000000000000..a7a946702dea0
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/anihan-hover-card_2017-06-22-01-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "anihan@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/anihan-hover-card_2017-06-22-01-39.json b/common/changes/@uifabric/styling/anihan-hover-card_2017-06-22-01-39.json
new file mode 100644
index 0000000000000..a97fc36c90b66
--- /dev/null
+++ b/common/changes/@uifabric/styling/anihan-hover-card_2017-06-22-01-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "anihan@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/anihan-hover-card_2017-06-22-01-39.json b/common/changes/@uifabric/utilities/anihan-hover-card_2017-06-22-01-39.json
new file mode 100644
index 0000000000000..faf4dbcc11174
--- /dev/null
+++ b/common/changes/@uifabric/utilities/anihan-hover-card_2017-06-22-01-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "anihan@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/anihan-hover-card_2017-06-22-01-39.json b/common/changes/office-ui-fabric-react/anihan-hover-card_2017-06-22-01-39.json
new file mode 100644
index 0000000000000..05e8c01918099
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/anihan-hover-card_2017-06-22-01-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add new component: HoverCard",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "anihan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/HoverCard.ts b/packages/office-ui-fabric-react/src/HoverCard.ts
new file mode 100644
index 0000000000000..d0dc0fe5a2b4c
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/HoverCard.ts
@@ -0,0 +1 @@
+export * from './components/HoverCard/index';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts b/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
index a4393597c81f8..8d4c841174ac5 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
@@ -143,6 +143,12 @@ export interface ICalloutProps extends React.Props<Callout | CalloutContent> {
    */
   directionalHintFixed?: boolean;
 
+  /**
+   * Specify the final height of the content.
+   * To be used when expanding the content dynamically so that callout can adjust its position.
+   */
+  finalHeight?: number;
+
   /**
    * If true then the callout will attempt to focus the first focusable element that it contains.
    * If it doesn't find an element, no focus will be set and the method will return false.
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
index 6c1efa75ecaea..937eff9c7a5e0 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
@@ -47,6 +47,10 @@ $Callout-smallbeak-slant-width: 16px;
   position: relative;
 }
 
+.overFlowYHidden {
+  overflow-y: hidden;
+}
+
 .beak {
   @include calloutBeak;
 }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index 7beb3ac258198..921643b7ac382 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -29,6 +29,7 @@ export interface ICalloutState {
   positions?: IPositionInfo;
   slideDirectionalClassName?: string;
   calloutElementRect?: ClientRect;
+  heightOffset?: number;
 }
 
 export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState> {
@@ -50,6 +51,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
   private _maxHeight: number;
   private _positionAttempts: number;
   private _target: HTMLElement | MouseEvent;
+  private _setHeightOffsetTimer: number;
 
   constructor(props: ICalloutProps) {
     super(props);
@@ -60,7 +62,8 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
     this.state = {
       positions: null,
       slideDirectionalClassName: null,
-      calloutElementRect: null
+      calloutElementRect: null,
+      heightOffset: 0
     };
     this._positionAttempts = 0;
   }
@@ -85,6 +88,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       this._maxHeight = undefined;
     }
   }
+
   public componentDidMount() {
     this._onComponentDidMount();
   }
@@ -106,6 +110,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       beakStyle,
       children,
       beakWidth,
+      finalHeight,
       backgroundColor } = this.props;
     let { positions } = this.state;
     let beakStyleWidth = beakWidth;
@@ -128,7 +133,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       ? AnimationClassNames[positions.directionalClassName]
       : '';
 
-    let contentMaxHeight: number = this._getMaxHeight();
+    let contentMaxHeight: number = this._getMaxHeight() + this.state.heightOffset;
     let beakVisible: boolean = isBeakVisible && (!!targetElement || !!target);
     let content = (
       <div
@@ -160,7 +165,9 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
             ariaLabel={ ariaLabel }
             ariaDescribedBy={ ariaDescribedBy }
             ariaLabelledBy={ ariaLabelledBy }
-            className={ css('ms-Callout-main', styles.main) }
+            className={ css('ms-Callout-main', styles.main, {
+              [styles.overFlowYHidden]: finalHeight
+            }) }
             onDismiss={ this.dismiss }
             shouldRestoreFocus={ true }
             style={ { maxHeight: contentMaxHeight, backgroundColor: backgroundColor } }>
@@ -229,6 +236,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
     }
 
     this._updatePosition();
+    this._setHeightOffsetEveryFrame();
   }
 
   private _updatePosition() {
@@ -336,4 +344,25 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       this._targetWindow = getWindow();
     }
   }
+
+  private _setHeightOffsetEveryFrame(): void {
+    if (this._calloutElement && this.props.finalHeight) {
+      this._setHeightOffsetTimer = this._async.requestAnimationFrame(() => {
+        const calloutMainElem = this._calloutElement.firstChild as HTMLElement;
+        const cardScrollHeight: number = calloutMainElem.scrollHeight;
+        const cardCurrHeight: number = calloutMainElem.offsetHeight;
+        const scrollDiff: number = cardScrollHeight - cardCurrHeight;
+
+        this.setState({
+          heightOffset: this.state.heightOffset + scrollDiff
+        });
+
+        if (calloutMainElem.offsetHeight < this.props.finalHeight) {
+          this._setHeightOffsetEveryFrame();
+        } else {
+          this._async.cancelAnimationFrame(this._setHeightOffsetTimer);
+        }
+      });
+    }
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts
new file mode 100644
index 0000000000000..f8c975ad3220b
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts
@@ -0,0 +1,106 @@
+import * as React from 'react';
+import { ExpandingCard } from './ExpandingCard';
+import { IRenderFunction } from '../../Utilities';
+import { IStyle, ITheme } from '../../Styling';
+
+export interface IExpandingCard {
+
+}
+
+/**
+ * ExpandingCard component props.
+ */
+export interface IExpandingCardProps extends React.HTMLAttributes<HTMLDivElement | ExpandingCard> {
+  /**
+   * Optional callback to access the IExpandingCard interface. Use this instead of ref for accessing
+   * the public methods and properties of the component.
+   */
+  componentRef?: (component: IExpandingCard) => void;
+
+  /**
+   *  Item to be returned with onRender functions
+   */
+  renderData?: any;
+
+  /**
+   *  Render function to populate compact content area
+   */
+  onRenderCompactCard: IRenderFunction<IExpandingCardProps>;
+
+  /**
+   *  Render function to populate expanded content area
+   */
+  onRenderExpandedCard?: IRenderFunction<IExpandingCardProps>;
+
+  /**
+   * Element to anchor the ExpandingCard to.
+   */
+  targetElement?: HTMLElement;
+
+  /**
+   * Callback upon focus or mouse enter event
+   */
+  onEnter?: (ev?: any) => void;
+
+  /**
+   * Callback upon blur or mouse leave event
+   */
+  onLeave?: (ev?: any) => void;
+
+  /**
+   * Height of compact card
+   * @default 156
+   */
+  compactCardHeight?: number;
+
+  /**
+   * Height of expanded card
+   * @default 384
+   */
+  expandedCardHeight?: number;
+
+  /**
+   * Use to open the card in expanded format and not wait for the delay
+   * @default ExpandingCardMode.compact
+   */
+  mode?: ExpandingCardMode;
+
+  /**
+   * Theme provided by HOC.
+   */
+  theme?: ITheme;
+
+  /**
+   * Custom styles for this component
+   */
+  styles?: IExpandingCardStyles;
+}
+
+export enum ExpandingCardMode {
+  /**
+   * To have top compact card only
+   */
+  compact = 0,
+
+  /**
+   * To have both top compact and bottom expanded card
+   */
+  expanded = 1
+}
+
+export interface IExpandingCardStyles {
+  /**
+   * Style for the root element in the default enabled, non-toggled state.
+   */
+  root?: IStyle;
+
+  /**
+   * Style for the main card element.
+   */
+  compactCard?: IStyle;
+
+  /**
+   * Base Style for the expanded card content
+   */
+  expandedCard?: IStyle;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
new file mode 100644
index 0000000000000..323207a8c291a
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
@@ -0,0 +1,47 @@
+import { IExpandingCardStyles } from './ExpandingCard.Props';
+import { memoizeFunction } from '../../Utilities';
+import {
+  mergeStyleSets,
+  after,
+  ITheme
+} from '../../Styling';
+
+export const getStyles = memoizeFunction((
+  theme: ITheme,
+  customStyles?: IExpandingCardStyles
+): IExpandingCardStyles => {
+
+  const styles: IExpandingCardStyles = {
+    root: {
+      width: '340px',
+      'pointer-events': 'none',
+      '.ms-Callout': {
+        'box-shadow': '0 0 20px rgba(0, 0, 0, .2)',
+        border: 'none'
+      }
+    },
+    compactCard: [
+      {
+        'pointer-events': 'auto',
+        position: 'relative'
+      },
+      after({
+        content: '""',
+        position: 'absolute',
+        bottom: '0',
+        left: '0',
+        right: '0',
+        height: '1px',
+        'background-color': theme.palette.neutralLighter
+      })
+    ],
+    expandedCard: {
+      height: '0',
+      'overflow-y': 'hidden',
+      'pointer-events': 'auto',
+      transition: 'height 0.467s cubic-bezier(0.5, 0, 0, 1)'
+    }
+  };
+
+  return mergeStyleSets(styles, customStyles);
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
new file mode 100644
index 0000000000000..ce2ca65da85b2
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
@@ -0,0 +1,142 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+import {
+  BaseComponent,
+  css,
+  getNativeProps,
+  divProperties,
+  customizable,
+  autobind,
+  getRTL
+} from '../../Utilities';
+import { IExpandingCardProps, IExpandingCardStyles, ExpandingCardMode } from './ExpandingCard.Props';
+import { Callout, ICallout } from '../../Callout';
+import { DirectionalHint } from '../../common/DirectionalHint';
+import { AnimationClassNames, mergeStyles } from '../../Styling';
+
+import { getStyles } from './ExpandingCard.styles';
+
+export interface IExpandingCardState {
+  firstFrameRendered: boolean;
+  needsScroll: boolean;
+}
+
+@customizable(['theme'])
+export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpandingCardState> {
+  public static defaultProps = {
+    compactCardHeight: 156,
+    expandedCardHeight: 384
+  };
+
+  private _styles: IExpandingCardStyles;
+  private _callout: ICallout;
+  private _expandedElem: HTMLDivElement;
+
+  constructor(props: IExpandingCardProps) {
+    super(props);
+
+    this.state = {
+      firstFrameRendered: false,
+      needsScroll: false
+    };
+  }
+
+  public componentDidMount() {
+    if (this._expandedElem && this._expandedElem.scrollHeight >= this.props.expandedCardHeight) {
+      this.setState({
+        needsScroll: true
+      });
+    }
+  }
+
+  public componentWillUnmount() {
+    this._async.dispose();
+  }
+
+  public render() {
+    const {
+      targetElement,
+      id,
+      theme,
+      styles: customStyles,
+      onRenderCompactCard,
+      onRenderExpandedCard,
+      compactCardHeight,
+      expandedCardHeight
+    } = this.props;
+    this._styles = getStyles(theme, customStyles);
+
+    return (
+      <Callout
+        { ...getNativeProps(this.props, divProperties) }
+        componentRef={ this._resolveRef('_callout') }
+        className={ css(
+          AnimationClassNames.scaleUpIn100,
+          this._styles.root
+        ) }
+        targetElement={ targetElement }
+        isBeakVisible={ false }
+        directionalHint={ getRTL() ? DirectionalHint.bottomRightEdge : DirectionalHint.bottomLeftEdge }
+        directionalHintFixed={ true }
+        finalHeight={ compactCardHeight + expandedCardHeight }
+        minPagePadding={ 24 }
+      >
+        <div
+          onFocusCapture={ this.props.onEnter }
+          onBlurCapture={ this.props.onLeave }
+          onMouseEnter={ this.props.onEnter }
+          onMouseLeave={ this.props.onLeave }
+        >
+          { this._onRenderCompactCard() }
+          { this._onRenderExpandedCard() }
+        </div>
+      </Callout >
+    );
+  }
+
+  @autobind
+  private _onRenderCompactCard(): JSX.Element {
+    return (
+      <div className={ mergeStyles(this._styles.compactCard, { height: this.props.compactCardHeight + 'px' }) as string }>
+        { this.props.onRenderCompactCard(this.props.renderData) }
+      </div>
+    );
+  }
+
+  @autobind
+  private _onRenderExpandedCard(): JSX.Element {
+    // firstFrameRendered helps in initially setting height of expanded card to 0, even if
+    // mode prop is set to ExpandingCardMode.expanded on first render. This is to make sure transition animation takes place.
+    this._async.requestAnimationFrame(() => {
+      this.setState({
+        firstFrameRendered: true
+      });
+    });
+
+    return (
+      <div className={ mergeStyles(
+        this._styles.expandedCard,
+        this.props.mode === ExpandingCardMode.expanded && this.state.firstFrameRendered && { height: this.props.expandedCardHeight + 'px' },
+        this.state.needsScroll && { 'overflow-y': 'auto' }
+      ) as string }
+        ref={ this._resolveRef('_expandedElem') }
+      >
+        { this.props.onRenderExpandedCard && this.props.onRenderExpandedCard(this.props.renderData) }
+      </div>
+    );
+  }
+
+  @autobind
+  private _checkNeedsScroll(): void {
+    if (this._expandedElem) {
+      this._async.requestAnimationFrame(() => {
+        if (this._expandedElem.scrollHeight >= this.props.expandedCardHeight) {
+          this.setState({
+            needsScroll: true
+          });
+        }
+      });
+    }
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts
new file mode 100644
index 0000000000000..ec615b983c76c
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts
@@ -0,0 +1,72 @@
+import * as React from 'react';
+import { HoverCard } from './HoverCard';
+import { IExpandingCardProps } from './ExpandingCard.Props';
+import { IStyle } from '../../Styling';
+
+export interface IHoverCard {
+
+}
+
+/**
+ * HoverCard component props.
+ */
+export interface IHoverCardProps extends React.HTMLAttributes<HTMLDivElement | HoverCard> {
+  /**
+   * Optional callback to access the IHoverCardHost interface. Use this instead of ref for accessing
+   * the public methods and properties of the component.
+   */
+  componentRef?: (component: IHoverCard) => void;
+
+  /**
+   * Additional properties to pass through for HoverCard, reference detail properties in IHoverCardProps
+   */
+  expandingCardProps?: IExpandingCardProps;
+
+  /**
+   * Whether or not to mark the container as described by the hover card.
+   * If not specified, the caller should mark as element as described by the hover card id.
+   */
+  setAriaDescribedBy?: boolean;
+
+  /**
+   * Length of compact card delay
+   * @default 500
+   */
+  cardOpenDelay?: number;
+
+  /**
+   * Length of card dismiss delay. A min number is necessary for pointer to hop between target and card
+   * @default 100
+   */
+  cardDismissDelay?: number;
+
+  /**
+   * Time in ms when expanded card should open after compact card
+   * @default 1000
+   */
+  expandedCardOpenDelay?: number;
+
+  /**
+   * If true disables Card dismiss upon mouse leave, so that card sticks around.
+   * @default false
+   */
+  sticky?: boolean;
+
+  /**
+   * Enables instant open of the full card upon click
+   * @default false
+   */
+  instantOpenOnClick?: boolean;
+
+  /**
+   * Custom styles for this component
+   */
+  styles?: IHoverCardStyles;
+}
+
+export interface IHoverCardStyles {
+  /**
+   * Style for the host element in the default enabled, non-toggled state.
+   */
+  host?: IStyle;
+}
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.styles.ts b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.styles.ts
new file mode 100644
index 0000000000000..f8f518756e881
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.styles.ts
@@ -0,0 +1,16 @@
+import { IHoverCardStyles } from './HoverCard.Props';
+import { memoizeFunction } from '../../Utilities';
+import {
+  mergeStyleSets
+} from '../../Styling';
+
+export const getStyles = memoizeFunction((
+  customStyles?: IHoverCardStyles
+): IHoverCardStyles => {
+
+  const styles: IHoverCardStyles = {
+    host: {}
+  };
+
+  return mergeStyleSets(styles, customStyles);
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
new file mode 100644
index 0000000000000..4dd365ece2ed7
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
@@ -0,0 +1,149 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+import {
+  BaseComponent,
+  autobind,
+  css,
+  divProperties,
+  getNativeProps,
+  getId
+} from '../../Utilities';
+import { IHoverCardProps, IHoverCardStyles } from './HoverCard.Props';
+import { ExpandingCard } from './ExpandingCard';
+import { ExpandingCardMode } from './ExpandingCard.Props';
+
+import { getStyles } from './HoverCard.styles';
+
+export interface IHoverCardState {
+  isHoverCardVisible: boolean;
+  mode: ExpandingCardMode;
+}
+
+export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
+  public static defaultProps = {
+    cardOpenDelay: 500,
+    cardDismissDelay: 100,
+    expandedCardOpenDelay: 1000,
+    instantOpenOnClick: false
+  };
+
+  // The wrapping div that gets the hover events
+  private _hoverCard: HTMLElement;
+  private _dismissTimerId: number;
+  private _openTimerId: number;
+
+  private _styles: IHoverCardStyles;
+
+  // Constructor
+  constructor(props: IHoverCardProps) {
+    super(props);
+
+    this.state = {
+      isHoverCardVisible: false,
+      mode: ExpandingCardMode.compact
+    };
+  }
+
+  public componentWillUpdate(newProps: IHoverCardProps, newState: IHoverCardState) {
+    if (newState.isHoverCardVisible !== this.state.isHoverCardVisible) {
+      if (newState.isHoverCardVisible) {
+        this._async.setTimeout(() => {
+          this.setState({
+            mode: ExpandingCardMode.expanded
+          });
+        }, this.props.expandedCardOpenDelay);
+      } else {
+        this.setState({
+          mode: ExpandingCardMode.compact
+        });
+      }
+    }
+  }
+
+  // Render
+  public render() {
+    const {
+      expandingCardProps,
+      children,
+      id,
+      instantOpenOnClick,
+      setAriaDescribedBy = true,
+      styles: customStyles
+    } = this.props;
+    const { isHoverCardVisible, mode } = this.state;
+    const hoverCardId = id || getId('hoverCard');
+
+    this._styles = getStyles(customStyles);
+
+    return (
+      <div
+        className={ css(this._styles.host) }
+        ref={ this._resolveRef('_hoverCard') }
+        onFocusCapture={ this._cardOpen }
+        onBlurCapture={ this._cardDismiss }
+        onMouseEnter={ this._cardOpen }
+        onMouseLeave={ this._cardDismiss }
+        onClick={ instantOpenOnClick && this._instantOpenExpanded }
+        aria-describedby={ setAriaDescribedBy && isHoverCardVisible ? hoverCardId : undefined }
+      >
+        { children }
+        { isHoverCardVisible &&
+          <ExpandingCard
+            { ...getNativeProps(this.props, divProperties) }
+            id={ hoverCardId }
+            targetElement={ this._getTargetElement() }
+            onEnter={ this._cardOpen }
+            onLeave={ this._cardDismiss }
+            mode={ mode }
+            { ...expandingCardProps }
+          />
+        }
+      </div>
+    );
+  }
+
+  private _getTargetElement(): HTMLElement {
+    return this._hoverCard;
+  }
+
+  // Show HoverCard
+  @autobind
+  private _cardOpen(ev: any) {
+    this._async.clearTimeout(this._dismissTimerId);
+
+    this._openTimerId = this._async.setTimeout(() => {
+      if (!this.state.isHoverCardVisible) {
+        this.setState({
+          isHoverCardVisible: true,
+          mode: ExpandingCardMode.compact
+        });
+      }
+    }, this.props.cardOpenDelay);
+  }
+
+  // Hide HoverCard
+  @autobind
+  private _cardDismiss(ev: React.MouseEvent<HTMLDivElement> | React.FocusEvent<HTMLDivElement>) {
+    const eventType = ev.type;
+    this._async.clearTimeout(this._openTimerId);
+
+    this._dismissTimerId = this._async.setTimeout(() => {
+      if (!(this.props.sticky && eventType === 'mouseleave')) {
+        this.setState({
+          isHoverCardVisible: false,
+          mode: ExpandingCardMode.compact
+        });
+      }
+    }, this.props.cardDismissDelay);
+  }
+
+  // Instant Open the card in Expanded mode
+  @autobind
+  private _instantOpenExpanded(ev) {
+    this.setState({
+      isHoverCardVisible: true,
+      mode: ExpandingCardMode.expanded
+    });
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.scss b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.scss
new file mode 100644
index 0000000000000..c793416686da3
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.scss
@@ -0,0 +1,6 @@
+:global {
+  .ms-HoverCardExample {
+    margin-top: 30px;
+    text-align: center;
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx
new file mode 100644
index 0000000000000..d058d93f6694c
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx
@@ -0,0 +1,45 @@
+import * as React from 'react';
+import { Link } from 'office-ui-fabric-react/lib/Link';
+import { LayerHost } from 'office-ui-fabric-react/lib/Layer';
+import {
+  ExampleCard,
+  ComponentPage,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+import { HoverCardBasicExample } from './examples/HoverCard.Basic.Example';
+
+import './HoverCardPage.scss';
+
+const HoverCardBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx') as string;
+
+export class HoverCardPage extends React.Component<any, any> {
+  public render() {
+    return (
+      <ComponentPage
+        title='HoverCard'
+        componentName='HoverCardExample'
+        exampleCards={
+          <LayerHost>
+            <ExampleCard title='HoverCard' code={ HoverCardBasicExampleCode }>
+              <HoverCardBasicExample />
+            </ExampleCard>
+          </LayerHost>
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts'),
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts')
+            ] }
+          />
+        }
+        overview={
+          <div>
+            <Link target='_blank' href='http://dev.office.com/fabric/components/HoverCard'>HoverCards</Link>
+            <span> supplement content associated with a specific data element.</span>
+          </div>
+        }
+      />
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx
new file mode 100644
index 0000000000000..887d787cc9843
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx
@@ -0,0 +1,96 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+import { BaseComponent, IRenderFunction } from 'office-ui-fabric-react/lib/Utilities';
+import {
+  HoverCard,
+  IExpandingCardProps
+} from 'office-ui-fabric-react/lib/HoverCard';
+import { DetailsList, buildColumns, IColumn } from 'office-ui-fabric-react/lib/DetailsList';
+import { autobind, css } from 'office-ui-fabric-react/lib/Utilities';
+import { createListItems } from '@uifabric/example-app-base';
+import './HoverCard.Example.scss';
+
+let _items: any[];
+
+export interface IHoverCardExampleState {
+  items?: any[];
+  columns?: IColumn[];
+}
+
+export class HoverCardBasicExample extends BaseComponent<{}, IHoverCardExampleState> {
+
+  constructor(props: {}) {
+    super(props);
+
+    _items = _items || createListItems(10);
+
+    this.state = {
+      items: _items,
+      columns: _buildColumns()
+    };
+  }
+
+  public render() {
+    let { items, columns } = this.state;
+
+    return (
+      <div>
+        <p> Hover over location of a row item to see the card </p>
+        <DetailsList
+          setKey='hoverSet'
+          items={ items }
+          columns={ columns }
+          onRenderItemColumn={ this._onRenderItemColumn }
+        />
+      </div>
+    );
+  }
+
+  @autobind
+  private _onRenderItemColumn(item, index, column) {
+    const expandingCardProps: IExpandingCardProps = {
+      onRenderCompactCard: this._onRenderCompactCard,
+      onRenderExpandedCard: this._onRenderExpandedCard,
+      renderData: item
+    };
+
+    if (column.key === 'location') {
+      return (
+        <HoverCard id='myID1' expandingCardProps={ expandingCardProps } instantOpenOnClick={ true }>
+          <div className='HoverCard-item'>
+            { item.location }
+          </div>
+        </HoverCard>
+      );
+    }
+
+    return item[column.key];
+  }
+
+  @autobind
+  private _onRenderCompactCard(item: any): JSX.Element {
+    return (
+      <div className='hoverCardExample-compactCard'>
+        <a target='_blank' href={ `http://wikipedia.org/wiki/${item.location}` }>
+          { item.location }
+        </a>
+      </div>
+    );
+  }
+
+  @autobind
+  private _onRenderExpandedCard(item: any): JSX.Element {
+    return (
+      <div className='hoverCardExample-expandedCard'>
+        { item.description }
+        { item.description }
+        { item.description }
+      </div>
+    );
+  }
+}
+
+function _buildColumns() {
+  return buildColumns(_items).filter(column => column.name === 'location' || column.name === 'key');
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Example.scss b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Example.scss
new file mode 100644
index 0000000000000..4b280c5c4b491
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Example.scss
@@ -0,0 +1,19 @@
+@import '../../../common/common';
+
+:global {
+  .hoverCardExample-compactCard {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
+  }
+
+  .hoverCardExample-expandedCard {
+    padding: 16px 24px;
+  }
+
+  .HoverCard-item:hover {
+    text-decoration: underline;
+    cursor: pointer;
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/index.ts b/packages/office-ui-fabric-react/src/components/HoverCard/index.ts
new file mode 100644
index 0000000000000..6d84f0dc08289
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/index.ts
@@ -0,0 +1,5 @@
+export * from './ExpandingCard';
+export * from './ExpandingCard.Props';
+export * from './HoverCard';
+export * from './HoverCard.Props';
+export * from '../../common/DirectionalHint';
diff --git a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
index cd653b321a8d5..e7efd27fe50aa 100644
--- a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
+++ b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
@@ -106,6 +106,12 @@ export const AppDefinition: IAppDefinition = {
           name: 'Facepile',
           url: '#/examples/facepile'
         },
+        {
+          component: require<any>('../components/HoverCard/HoverCardPage').HoverCardPage,
+          key: 'HoverCard',
+          name: 'HoverCard',
+          url: '#/examples/hovercard'
+        },
         {
           component: require<any>('../components/Icon/IconPage').IconPage,
           key: 'Icon',
@@ -348,4 +354,4 @@ export const AppDefinition: IAppDefinition = {
 
 };
 
-export const App = (props) => <AppBase appDefinition={ AppDefinition } { ...props } />;
+export const App = (props) => <AppBase appDefinition={ AppDefinition } { ...props } />;
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/index.ts b/packages/office-ui-fabric-react/src/index.ts
index e218d95db4d97..0cbad5c4ebf86 100644
--- a/packages/office-ui-fabric-react/src/index.ts
+++ b/packages/office-ui-fabric-react/src/index.ts
@@ -23,6 +23,7 @@ export * from './Facepile';
 export * from './FocusTrapZone';
 export * from './FocusZone';
 export * from './GroupedList';
+export * from './HoverCard';
 export * from './Icon';
 export * from './Image';
 export * from './Label';

From 8f7558c34ba8eece6830b3dba53f79f29af97a87 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 5 Jul 2017 17:19:30 -0700
Subject: [PATCH 0215/1641] Exporting GlobalSettings from utilities (#2136)

* Need to export global settings.

* Adding change file.
---
 .../export-global-settings_2017-07-05-16-58.json      | 11 +++++++++++
 packages/utilities/src/index.ts                       |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/@uifabric/utilities/export-global-settings_2017-07-05-16-58.json

diff --git a/common/changes/@uifabric/utilities/export-global-settings_2017-07-05-16-58.json b/common/changes/@uifabric/utilities/export-global-settings_2017-07-05-16-58.json
new file mode 100644
index 0000000000000..cf2703906ad03
--- /dev/null
+++ b/common/changes/@uifabric/utilities/export-global-settings_2017-07-05-16-58.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Adding export for GlobalSettings object.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/src/index.ts b/packages/utilities/src/index.ts
index 9d6c952e690b7..9094c0cc70619 100644
--- a/packages/utilities/src/index.ts
+++ b/packages/utilities/src/index.ts
@@ -5,6 +5,7 @@ export * from './Customizer';
 export * from './DelayedRender';
 export * from './EventGroup';
 export * from './FabricPerformance';
+export * from './GlobalSettings';
 export * from './IDisposable';
 export * from './IPoint';
 export * from './IRectangle';

From 079b05cbd4325f5b49b5f92d1023434e2e7586d8 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 6 Jul 2017 10:11:47 +0000
Subject: [PATCH 0216/1641] Applying package updates.

---
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../anihan-hover-card_2017-06-22-01-39.json   | 11 -----
 ...et-cache-key-no-grow_2017-06-30-20-42.json | 11 -----
 .../anihan-hover-card_2017-06-22-01-39.json   | 11 -----
 ...et-cache-key-no-grow_2017-06-30-20-42.json | 11 -----
 .../anihan-hover-card_2017-06-22-01-39.json   | 11 -----
 ...et-cache-key-no-grow_2017-06-30-20-42.json | 11 -----
 .../anihan-hover-card_2017-06-22-01-39.json   | 11 -----
 ...port-global-settings_2017-07-05-16-58.json | 11 -----
 ...et-cache-key-no-grow_2017-06-30-20-42.json | 11 -----
 .../anihan-hover-card_2017-06-22-01-39.json   | 11 -----
 ...etails-row-cell-size_2017-07-05-18-22.json | 11 -----
 ...et-cache-key-no-grow_2017-06-30-20-42.json | 11 -----
 .../toggle-aria-label_2017-07-03-16-50.json   | 11 -----
 ...mmandbar-item-margin_2017-06-29-20-26.json | 11 -----
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  4 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 44 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 16 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/CHANGELOG.json               | 12 +++++
 packages/styling/CHANGELOG.md                 |  7 ++-
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 ++++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/api/utilities.api.ts       | 30 +++++++++++++
 packages/utilities/package.json               |  2 +-
 29 files changed, 139 insertions(+), 167 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/anihan-hover-card_2017-06-22-01-39.json
 delete mode 100644 common/changes/@uifabric/example-app-base/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
 delete mode 100644 common/changes/@uifabric/fabric-website/anihan-hover-card_2017-06-22-01-39.json
 delete mode 100644 common/changes/@uifabric/fabric-website/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
 delete mode 100644 common/changes/@uifabric/styling/anihan-hover-card_2017-06-22-01-39.json
 delete mode 100644 common/changes/@uifabric/styling/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
 delete mode 100644 common/changes/@uifabric/utilities/anihan-hover-card_2017-06-22-01-39.json
 delete mode 100644 common/changes/@uifabric/utilities/export-global-settings_2017-07-05-16-58.json
 delete mode 100644 common/changes/@uifabric/utilities/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
 delete mode 100644 common/changes/office-ui-fabric-react/anihan-hover-card_2017-06-22-01-39.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-details-row-cell-size_2017-07-05-18-22.json
 delete mode 100644 common/changes/office-ui-fabric-react/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
 delete mode 100644 common/changes/office-ui-fabric-react/toggle-aria-label_2017-07-03-16-50.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-edwliu-commandbar-item-margin_2017-06-29-20-26.json

diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index a46b2db1330d4..546f5f5f2a0cf 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "^2.2.39",
     "@types/webpack-env": "^1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.14.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.15.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 06142e17efc5f..9d00f2724599c 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.14.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.15.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 88da4f79ab9e3..d28a8ded05bd8 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.14.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.15.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/@uifabric/example-app-base/anihan-hover-card_2017-06-22-01-39.json b/common/changes/@uifabric/example-app-base/anihan-hover-card_2017-06-22-01-39.json
deleted file mode 100644
index fa53882beab0f..0000000000000
--- a/common/changes/@uifabric/example-app-base/anihan-hover-card_2017-06-22-01-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "anihan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/overflow-set-cache-key-no-grow_2017-06-30-20-42.json b/common/changes/@uifabric/example-app-base/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
deleted file mode 100644
index 8986a3dbd61f2..0000000000000
--- a/common/changes/@uifabric/example-app-base/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "<christianjordangonzalez@gmail.com>"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/anihan-hover-card_2017-06-22-01-39.json b/common/changes/@uifabric/fabric-website/anihan-hover-card_2017-06-22-01-39.json
deleted file mode 100644
index a7a946702dea0..0000000000000
--- a/common/changes/@uifabric/fabric-website/anihan-hover-card_2017-06-22-01-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "anihan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/overflow-set-cache-key-no-grow_2017-06-30-20-42.json b/common/changes/@uifabric/fabric-website/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
deleted file mode 100644
index fa5fca5c645eb..0000000000000
--- a/common/changes/@uifabric/fabric-website/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "<christianjordangonzalez@gmail.com>"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/anihan-hover-card_2017-06-22-01-39.json b/common/changes/@uifabric/styling/anihan-hover-card_2017-06-22-01-39.json
deleted file mode 100644
index a97fc36c90b66..0000000000000
--- a/common/changes/@uifabric/styling/anihan-hover-card_2017-06-22-01-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "anihan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/overflow-set-cache-key-no-grow_2017-06-30-20-42.json b/common/changes/@uifabric/styling/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
deleted file mode 100644
index e6b8f7e62cafd..0000000000000
--- a/common/changes/@uifabric/styling/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "<christianjordangonzalez@gmail.com>"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/anihan-hover-card_2017-06-22-01-39.json b/common/changes/@uifabric/utilities/anihan-hover-card_2017-06-22-01-39.json
deleted file mode 100644
index faf4dbcc11174..0000000000000
--- a/common/changes/@uifabric/utilities/anihan-hover-card_2017-06-22-01-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "anihan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/export-global-settings_2017-07-05-16-58.json b/common/changes/@uifabric/utilities/export-global-settings_2017-07-05-16-58.json
deleted file mode 100644
index cf2703906ad03..0000000000000
--- a/common/changes/@uifabric/utilities/export-global-settings_2017-07-05-16-58.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Adding export for GlobalSettings object.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/overflow-set-cache-key-no-grow_2017-06-30-20-42.json b/common/changes/@uifabric/utilities/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
deleted file mode 100644
index 7eeb1bd3be6a9..0000000000000
--- a/common/changes/@uifabric/utilities/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "<christianjordangonzalez@gmail.com>"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/anihan-hover-card_2017-06-22-01-39.json b/common/changes/office-ui-fabric-react/anihan-hover-card_2017-06-22-01-39.json
deleted file mode 100644
index 05e8c01918099..0000000000000
--- a/common/changes/office-ui-fabric-react/anihan-hover-card_2017-06-22-01-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add new component: HoverCard",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "anihan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-details-row-cell-size_2017-07-05-18-22.json b/common/changes/office-ui-fabric-react/fix-details-row-cell-size_2017-07-05-18-22.json
deleted file mode 100644
index 23ae10a2f7445..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-details-row-cell-size_2017-07-05-18-22.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Make details row cells use flex box and stretch to total row height.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "maricha@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/overflow-set-cache-key-no-grow_2017-06-30-20-42.json b/common/changes/office-ui-fabric-react/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
deleted file mode 100644
index aee85f4bef1c8..0000000000000
--- a/common/changes/office-ui-fabric-react/overflow-set-cache-key-no-grow_2017-06-30-20-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ResizeGroup: Add support for caching",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "<christianjordangonzalez@gmail.com>"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/toggle-aria-label_2017-07-03-16-50.json b/common/changes/office-ui-fabric-react/toggle-aria-label_2017-07-03-16-50.json
deleted file mode 100644
index 15f42a2353f87..0000000000000
--- a/common/changes/office-ui-fabric-react/toggle-aria-label_2017-07-03-16-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Toggle: Fixed aria-label that was missing from button",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-edwliu-commandbar-item-margin_2017-06-29-20-26.json b/common/changes/office-ui-fabric-react/v-edwliu-commandbar-item-margin_2017-06-29-20-26.json
deleted file mode 100644
index 68c64bef96f84..0000000000000
--- a/common/changes/office-ui-fabric-react/v-edwliu-commandbar-item-margin_2017-06-29-20-26.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "CommandBar: Remove margin from command bar items",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-edwliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index b193184f90165..6072cba88df7b 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -47,7 +47,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.12.2 <1.0.0",
+    "@uifabric/styling": ">=0.12.3 <1.0.0",
     "@uifabric/utilities": ">=4.6.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index b490dddfe3cd4..3924e345ca83b 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -22,7 +22,7 @@
     "@types/react-dom": "^15.5.0",
     "@types/webpack-env": "^1.13.0",
     "@uifabric/example-app-base": "4.0.1",
-    "@uifabric/utilities": "4.6.0",
+    "@uifabric/utilities": "4.7.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.14.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.15.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index bb24af80aef07..a0d259320dd89 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,50 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.15.0",
+      "tag": "office-ui-fabric-react_v4.15.0",
+      "date": "Thu, 06 Jul 2017 10:11:47 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Aniket Handa <atneik@users.noreply.github.com>",
+            "commit": "6f272bbaf04d106c990637f78cb38ec84fa00ed7",
+            "comment": "Add new component: HoverCard"
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "6ca067c7957ce4b8d7e85f32115dd4b77bb8ac1c",
+            "comment": "ResizeGroup: Add support for caching"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Marena Richardson <marena.richardson@gmail.com>",
+            "commit": "d9683d319f2e66ab294212682bdb4abdbb32107d",
+            "comment": "Make details row cells use flex box and stretch to total row height."
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "8555ad54c2b4ec7f0e58ebc6ab0032df7a44002b",
+            "comment": "Toggle: Fixed aria-label that was missing from button"
+          },
+          {
+            "author": "Eddie Liu <leddie24@gmail.com>",
+            "commit": "44951ccc9715a43f363c79a33ed1c1a4f320d69c",
+            "comment": "CommandBar: Remove margin from command bar items"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.6.0 <5.0.0` to `>=4.6.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.12.2 <1.0.0` to `>=0.12.3 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.14.1",
       "tag": "office-ui-fabric-react_v4.14.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index c4fa07c2c3ea0..aa8511b012225 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,20 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 04 Jul 2017 10:21:53 GMT and should not be manually modified.
+This log was last generated on Thu, 06 Jul 2017 10:11:47 GMT and should not be manually modified.
+
+## 4.15.0
+Thu, 06 Jul 2017 10:11:47 GMT
+
+### Minor changes
+
+- Add new component: HoverCard
+- ResizeGroup: Add support for caching
+
+### Patches
+
+- Make details row cells use flex box and stretch to total row height.
+- Toggle: Fixed aria-label that was missing from button
+- CommandBar: Remove margin from command bar items
 
 ## 4.14.1
 Tue, 04 Jul 2017 10:21:53 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index ad752081bd07f..4c95f1648a7aa 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.14.1",
+  "version": "4.15.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.6.0 <5.0.0",
-    "@uifabric/styling": ">=0.12.2 <1.0.0",
+    "@uifabric/styling": ">=0.12.3 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index bb0cc21c67108..3873a26b0ff9a 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,18 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.12.3",
+      "tag": "@uifabric/styling_v0.12.3",
+      "date": "Thu, 06 Jul 2017 10:11:47 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.6.0 <5.0.0` to `>=4.6.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.12.2",
       "tag": "@uifabric/styling_v0.12.2",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 6edd73d643292..0a1b4b60158a1 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Tue, 04 Jul 2017 10:21:53 GMT and should not be manually modified.
+This log was last generated on Thu, 06 Jul 2017 10:11:47 GMT and should not be manually modified.
+
+## 0.12.3
+Thu, 06 Jul 2017 10:11:47 GMT
+
+*Changes not tracked*
 
 ## 0.12.2
 Tue, 04 Jul 2017 10:21:53 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index c945c2e39b8f4..9664ec49bcbcd 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.12.2",
+  "version": "0.12.3",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 28d4603553d1f..456e38c30e0c2 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.7.0",
+      "tag": "@uifabric/utilities_v4.7.0",
+      "date": "Thu, 06 Jul 2017 10:11:47 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "8f7558c34ba8eece6830b3dba53f79f29af97a87",
+            "comment": "Adding export for GlobalSettings object."
+          }
+        ]
+      }
+    },
     {
       "version": "4.6.0",
       "tag": "@uifabric/utilities_v4.6.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index a30827e0a8c4d..14b2eb14f009b 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Fri, 30 Jun 2017 19:44:26 GMT and should not be manually modified.
+This log was last generated on Thu, 06 Jul 2017 10:11:47 GMT and should not be manually modified.
+
+## 4.7.0
+Thu, 06 Jul 2017 10:11:47 GMT
+
+### Minor changes
+
+- Adding export for GlobalSettings object.
 
 ## 4.6.0
 Fri, 30 Jun 2017 19:44:26 GMT
diff --git a/packages/utilities/api/utilities.api.ts b/packages/utilities/api/utilities.api.ts
index 7bde26367834e..3e079867434c4 100644
--- a/packages/utilities/api/utilities.api.ts
+++ b/packages/utilities/api/utilities.api.ts
@@ -155,6 +155,18 @@ export function getScrollbarWidth(): number;
 // (undocumented)
 export function getVirtualParent(child: HTMLElement): HTMLElement | undefined;
 
+// @public
+class GlobalSettings {
+  // (undocumented)
+  public static addChangeListener(cb: IChangeEventCallback): void;
+  // (undocumented)
+  public static getValue < T >(key: string): T;
+  // (undocumented)
+  public static removeChangeListener(cb: IChangeEventCallback): void;
+  // (undocumented)
+  public static setValue < T >(key: string, value: T): void;
+}
+
 export function hasHorizontalOverflow(element: HTMLElement): boolean;
 
 export function hasOverflow(element: HTMLElement): boolean;
@@ -169,6 +181,24 @@ interface IBaseProps {
   componentRef?: any;
 }
 
+// @public
+interface IChangeDescription {
+  // (undocumented)
+  key: string;
+  // (undocumented)
+  oldValue: any;
+  // (undocumented)
+  value: any;
+}
+
+// @public
+interface IChangeEventCallback {
+  // (undocumented)
+  ___id__?: string;
+  // (undocumented)
+  (changeDescription?: IChangeDescription): void;
+}
+
 // (undocumented)
 interface ICustomizerProps {
   // (undocumented)
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 176fd5a47f497..e75750629b425 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.6.0",
+  "version": "4.7.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 42587fd0ba26b9efade415cc5cc60103fbe2f980 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 6 Jul 2017 11:45:00 -0400
Subject: [PATCH 0217/1641] Styling: Enable strict null checks in the styling
 package (#2082)

* Make IAnimationTileStyles required

* Fix mergeStyles

* Enable strict null checks

* Rush change.

* Undo IFontStyles.ts change.

* Fix defaultfontstyles.ts issue
---
 .../styling-strict-null_2017-06-28-14-07.json  | 11 +++++++++++
 .../AnimationTile/AnimationTile.styles.ts      | 18 +++++++++---------
 .../styling/src/styles/DefaultFontStyles.ts    |  4 ++--
 packages/styling/src/styles/getFocusStyle.ts   |  2 +-
 packages/styling/src/utilities/mergeStyles.ts  | 10 +++++-----
 packages/styling/tsconfig.json                 |  1 +
 6 files changed, 29 insertions(+), 17 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/styling-strict-null_2017-06-28-14-07.json

diff --git a/common/changes/@uifabric/styling/styling-strict-null_2017-06-28-14-07.json b/common/changes/@uifabric/styling/styling-strict-null_2017-06-28-14-07.json
new file mode 100644
index 0000000000000..42c9f3d57c185
--- /dev/null
+++ b/common/changes/@uifabric/styling/styling-strict-null_2017-06-28-14-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Enable strict null checks in the styling package",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "<christianjordangonzalez@gmail.com>"
+}
\ No newline at end of file
diff --git a/packages/styling/src/examples/AnimationTile/AnimationTile.styles.ts b/packages/styling/src/examples/AnimationTile/AnimationTile.styles.ts
index 733c5592d9c81..eb09c5f655678 100644
--- a/packages/styling/src/examples/AnimationTile/AnimationTile.styles.ts
+++ b/packages/styling/src/examples/AnimationTile/AnimationTile.styles.ts
@@ -6,15 +6,15 @@ import {
 } from '@uifabric/styling';
 
 export interface IAnimationTileStyles {
-  root?: IStyle;
-  title?: IStyle;
-  container?: IStyle;
-  animationBox?: IStyle;
-  isLeft?: IStyle;
-  isRight?: IStyle;
-  isTop?: IStyle;
-  isBottom?: IStyle;
-  isIn?: IStyle;
+  root: IStyle;
+  title: IStyle;
+  container: IStyle;
+  animationBox: IStyle;
+  isLeft: IStyle;
+  isRight: IStyle;
+  isTop: IStyle;
+  isBottom: IStyle;
+  isIn: IStyle;
 }
 
 export function getStyles(theme: ITheme = getTheme()): IAnimationTileStyles {
diff --git a/packages/styling/src/styles/DefaultFontStyles.ts b/packages/styling/src/styles/DefaultFontStyles.ts
index f1d6171366ce4..c1b46d9bb7ea9 100644
--- a/packages/styling/src/styles/DefaultFontStyles.ts
+++ b/packages/styling/src/styles/DefaultFontStyles.ts
@@ -114,7 +114,7 @@ function _getFontFamily(): string {
   let fontFamily = FontFamilyWestEuropean;
 
   for (let lang in LanguageToFontMap) {
-    if (LanguageToFontMap.hasOwnProperty(lang) && lang.indexOf(language) === 0) {
+    if (LanguageToFontMap.hasOwnProperty(lang) && language && lang.indexOf(language) === 0) {
       // tslint:disable-next-line:no-any
       fontFamily = (LanguageToFontMap as any)[lang];
       break;
@@ -200,7 +200,7 @@ function _registerDefaultFontFaces(): void {
  * Reads the fontBaseUrl from window.FabricConfig.fontBaseUrl or falls back to a default.
  */
 function _getFontBaseUrl(): string {
-  let win: {} = typeof window !== 'undefined' ? window : undefined;
+  let win = typeof window !== 'undefined' ? window : undefined;
 
   // tslint:disable-next-line:no-string-literal no-any
   let fabricConfig: IFabricConfig = win ? win['FabricConfig'] : undefined;
diff --git a/packages/styling/src/styles/getFocusStyle.ts b/packages/styling/src/styles/getFocusStyle.ts
index 5bd5f91e4da39..16b2859670824 100644
--- a/packages/styling/src/styles/getFocusStyle.ts
+++ b/packages/styling/src/styles/getFocusStyle.ts
@@ -15,7 +15,7 @@ import { parent } from '../glamorExports';
 export function getFocusStyle(
   theme: ITheme,
   inset: string = '0',
-  color: string = theme.palette.neutralSecondary,
+  color: string | undefined = theme.palette.neutralSecondary,
   position: 'relative' | 'absolute' = 'relative'
 ): IProcessedStyle {
   return mergeStyles(
diff --git a/packages/styling/src/utilities/mergeStyles.ts b/packages/styling/src/utilities/mergeStyles.ts
index 185dd7c3a20e3..a74e67bdd30cb 100644
--- a/packages/styling/src/utilities/mergeStyles.ts
+++ b/packages/styling/src/utilities/mergeStyles.ts
@@ -14,11 +14,11 @@ import { FabricPerformance } from '@uifabric/utilities/lib/FabricPerformance';
  * @param {(...(IStyle | string)[])} args
  * @returns {IStyle}
  */
-export function mergeStyles(...args: (IStyle | string)[]): IProcessedStyle | string {
+export function mergeStyles(...args: (IStyle | string | null | undefined)[]): IProcessedStyle | string {
   const classes: string[] = [];
   const rules: Rule[] = [];
 
-  function _parseArgs(theArgs: (IStyle | string)[]): void {
+  function _parseArgs(theArgs: (IStyle | string | null | undefined)[]): void {
     for (const arg of theArgs) {
       if (arg) {
         if (typeof arg === 'string') {
@@ -34,7 +34,7 @@ export function mergeStyles(...args: (IStyle | string)[]): IProcessedStyle | str
 
   _parseArgs(args);
 
-  let rulesObject: IStyle = null;
+  let rulesObject: IStyle | null = null;
 
   if (rules.length) {
     FabricPerformance.measure('glamor.css', () => {
@@ -44,10 +44,10 @@ export function mergeStyles(...args: (IStyle | string)[]): IProcessedStyle | str
 
   if (classes.length) {
     if (rulesObject) {
-      classes.push(rulesObject.toString());
+      classes.push((rulesObject as IStyle).toString());
     }
     return classes.join(' ');
   }
 
-  return rulesObject;
+  return rulesObject || {};
 }
diff --git a/packages/styling/tsconfig.json b/packages/styling/tsconfig.json
index 1ef6a2633361f..b3619a4010871 100644
--- a/packages/styling/tsconfig.json
+++ b/packages/styling/tsconfig.json
@@ -10,6 +10,7 @@
     "importHelpers": true,
     "moduleResolution": "node",
     "noImplicitAny": false,
+    "strictNullChecks": true,
     "forceConsistentCasingInFileNames": true,
     "lib": [
       "es2017",

From cb36fd1e4faf361301f4c603f3f8b416e7adf98c Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 6 Jul 2017 10:37:38 -0700
Subject: [PATCH 0218/1641] Styling license file was missing.

---
 packages/styling/LICENSE | 15 +++++++++++++++
 1 file changed, 15 insertions(+)
 create mode 100644 packages/styling/LICENSE

diff --git a/packages/styling/LICENSE b/packages/styling/LICENSE
new file mode 100644
index 0000000000000..d29ec4fa050ac
--- /dev/null
+++ b/packages/styling/LICENSE
@@ -0,0 +1,15 @@
+Office UI Fabric React - styling
+
+Copyright (c) Microsoft Corporation
+
+All rights reserved.
+
+MIT License
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the ""Software""), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED *AS IS*, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
+Note: Usage of the fonts and icons referenced in Office UI Fabric is subject to the terms listed at http://aka.ms/fabric-assets-license
\ No newline at end of file

From dae9df0a1345d7ddc4e92c04037bec52ab2cace1 Mon Sep 17 00:00:00 2001
From: CmonsterC <CmonsterC@users.noreply.github.com>
Date: Thu, 6 Jul 2017 12:18:37 -0700
Subject: [PATCH 0219/1641] GroupedList Add new prop to ignore the collapse
 button on the column name bar when there's custom group header (#2097)

* add props

* add change file

* Test

* Revert test

* Refactor collapse all to use enum and propagate

* Revert changes to examples

* Clean up

* Fix tslint errors

* Update users-chench-ignorechevron_2017-06-29-18-00.json

* Address feedback

* Add default props and change detailsrow

* Fix isSelectAllVisible to selectAllVisibility in details header default props
---
 .../users-chench-ignorechevron_2017-06-29-18-00.json  | 11 +++++++++++
 .../src/components/DetailsList/DetailsHeader.tsx      |  7 +++++--
 .../src/components/DetailsList/DetailsList.tsx        |  8 ++++++--
 .../src/components/DetailsList/DetailsRow.tsx         |  4 +++-
 .../src/components/GroupedList/GroupedList.Props.ts   | 11 +++++++++++
 5 files changed, 36 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-chench-ignorechevron_2017-06-29-18-00.json

diff --git a/common/changes/office-ui-fabric-react/users-chench-ignorechevron_2017-06-29-18-00.json b/common/changes/office-ui-fabric-react/users-chench-ignorechevron_2017-06-29-18-00.json
new file mode 100644
index 0000000000000..da142146a2ed1
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-chench-ignorechevron_2017-06-29-18-00.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "GroupedList: Add a new prop to ignore the collapse button on the column name bar when there's custom group header",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chench@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index 14fad273ab689..2ea029b33951d 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -14,6 +14,7 @@ import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { Icon } from '../../Icon';
 import { Layer } from '../../Layer';
 import { GroupSpacer } from '../GroupedList/GroupSpacer';
+import { CollapseAllVisibility } from '../GroupedList';
 import { DetailsRowCheck } from './DetailsRowCheck';
 import { ITooltipHostProps } from '../../Tooltip';
 import * as checkStyles from './DetailsRowCheck.scss';
@@ -42,6 +43,7 @@ export interface IDetailsHeaderProps extends React.Props<DetailsHeader> {
   onColumnContextMenu?: (column: IColumn, ev: React.MouseEvent<HTMLElement>) => void;
   onRenderColumnHeaderTooltip?: IRenderFunction<ITooltipHostProps>;
   groupNestingDepth?: number;
+  collapseAllVisibility?: CollapseAllVisibility;
   isAllCollapsed?: boolean;
   onToggleCollapseAll?: (isAllCollapsed: boolean) => void;
   /** ariaLabel for the entire header */
@@ -74,7 +76,8 @@ export interface IColumnResizeDetails {
 
 export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHeaderState> implements IDetailsHeader {
   public static defaultProps = {
-    isSelectAllVisible: SelectAllVisibility.visible
+    selectAllVisibility: SelectAllVisibility.visible,
+    collapseAllVisibility: CollapseAllVisibility.visible
   };
 
   public refs: {
@@ -172,7 +175,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
             }
           </div>
         ) : null }
-        { groupNestingDepth > 0 ? (
+        { groupNestingDepth > 0 && this.props.collapseAllVisibility === CollapseAllVisibility.visible ? (
           <div
             className={ css('ms-DetailsHeader-cell', styles.cell) }
             onClick={ this._onToggleCollapseAll }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 566f47b25d07b..6a35ed1e8c2e1 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -286,7 +286,8 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
               ariaLabel: ariaLabelForListHeader,
               ariaLabelForSelectAllCheckbox: ariaLabelForSelectAllCheckbox,
               ariaLabelForSelectionColumn: ariaLabelForSelectionColumn,
-              selectAllVisibility: selectAllVisibility
+              selectAllVisibility: selectAllVisibility,
+              collapseAllVisibility: groupProps && groupProps.collapseAllVisibility
             }, this._onRenderDetailsHeader) }
           </div>
           <div onKeyDown={ this._onContentKeyDown } role='presentation'>
@@ -364,8 +365,10 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       viewport,
       checkboxVisibility,
       getRowAriaLabel,
-      checkButtonAriaLabel
+      checkButtonAriaLabel,
+      groupProps
     } = this.props;
+    let collapseAllVisibility = groupProps && groupProps.collapseAllVisibility;
     let selection = this._selection;
     let dragDropHelper = this._dragDropHelper;
     let {
@@ -395,6 +398,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       dragDropHelper: dragDropHelper,
       viewport: viewport,
       checkboxVisibility: checkboxVisibility,
+      collapseAllVisibility: collapseAllVisibility,
       getRowAriaLabel: getRowAriaLabel,
       checkButtonAriaLabel: checkButtonAriaLabel
     }, this._onRenderRow);
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index b1adb31f56fd8..38d794bc2aba4 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -16,6 +16,7 @@ import { GroupSpacer } from '../GroupedList/GroupSpacer';
 import { DetailsRowFields } from './DetailsRowFields';
 import { FocusZone, FocusZoneDirection, IFocusZone } from '../../FocusZone';
 import { ISelection, SelectionMode, SELECTION_CHANGE } from '../../utilities/selection/interfaces';
+import { CollapseAllVisibility } from '../GroupedList';
 import {
   IDragDropHelper,
   IDragDropEvents,
@@ -43,6 +44,7 @@ export interface IDetailsRowProps extends React.Props<DetailsRow> {
   groupNestingDepth?: number;
   viewport?: IViewport;
   checkboxVisibility?: CheckboxVisibility;
+  collapseAllVisibility?: CollapseAllVisibility;
   getRowAriaLabel?: (item: any) => string;
   checkButtonAriaLabel?: string;
 }
@@ -235,7 +237,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
           </div>
         ) }
 
-        { GroupSpacer({ count: groupNestingDepth }) }
+        { GroupSpacer({ count: groupNestingDepth - (this.props.collapseAllVisibility === CollapseAllVisibility.hidden ? 1 : 0) }) }
 
         { item && (
           <DetailsRowFields
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts
index 862405f98e39f..b47b95abfec34 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts
@@ -17,6 +17,11 @@ import {
 } from '../../utilities/selection/index';
 import { IViewport } from '../../utilities/decorators/withViewport';
 
+export enum CollapseAllVisibility {
+  hidden = 0,
+  visible = 1
+}
+
 export interface IGroupedList {
   /**
    * Ensures that the list content is updated. Call this in cases where the list prop updates don't change, but the list
@@ -177,6 +182,12 @@ export interface IGroupRenderProps {
    * Override which allows the caller to provider a customer footer.
    */
   onRenderFooter?: IRenderFunction<IGroupDividerProps>;
+
+  /**
+   * Flag to indicate whether to ignore the collapsing icon on header.
+   * @default CheckboxVisibility.visible
+   */
+  collapseAllVisibility?: CollapseAllVisibility;
 }
 
 export interface IGroupDividerProps {

From 739afaec20093f1bb14ceb844c859a881cba6dd0 Mon Sep 17 00:00:00 2001
From: aadhars <adhargithub@gmail.com>
Date: Fri, 7 Jul 2017 01:53:18 +0530
Subject: [PATCH 0220/1641] [Anchor Button] Treating anchor button as Primary
 button when disabled (#2127)

* Making anchor buttons as normal button when disabled

* Adding change file

* Update users-adsurang-bugfixes4_2017-07-03-19-25.json
---
 .../users-adsurang-bugfixes4_2017-07-03-19-25.json    | 11 +++++++++++
 .../src/components/Button/BaseButton.tsx              |  4 +++-
 2 files changed, 14 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-adsurang-bugfixes4_2017-07-03-19-25.json

diff --git a/common/changes/office-ui-fabric-react/users-adsurang-bugfixes4_2017-07-03-19-25.json b/common/changes/office-ui-fabric-react/users-adsurang-bugfixes4_2017-07-03-19-25.json
new file mode 100644
index 0000000000000..402ce49328666
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-adsurang-bugfixes4_2017-07-03-19-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Buttons: disabled buttons with hrefs now render as BUTTON elements instead of A tags, since BUTTON can support the disabled flag.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "adsurang@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index f51a59d7da0a0..43bb828d75e88 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -91,7 +91,9 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     );
 
     const { _ariaDescriptionId, _labelId, _descriptionId } = this;
-    const renderAsAnchor: boolean = !!href;
+    // Anchor tag cannot be disabled hence in disabled state rendering
+    // anchor button as normal button
+    const renderAsAnchor: boolean = !disabled && !!href;
     const tag = renderAsAnchor ? 'a' : 'button';
     const nativeProps = getNativeProps(
       assign(

From 8739efafc90df5f7c51da305189b2cdc131c66e0 Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Thu, 6 Jul 2017 14:59:27 -0700
Subject: [PATCH 0221/1641] Remove optionals from styling interfaces (#2142)

* improve interface

* add todo

* change file

* Update phkuo-themingClasses_2017-07-05-22-20.json

* make palette also optional

* fix todo

* use more of the default styles

* Update ITheme.ts
---
 ...phkuo-themingClasses_2017-07-05-22-20.json | 11 +++
 packages/styling/src/interfaces/IPalette.ts   | 92 +++++++++----------
 .../styling/src/interfaces/ISemanticColors.ts | 50 +++++-----
 packages/styling/src/interfaces/ITheme.ts     |  8 +-
 packages/styling/src/interfaces/index.ts      |  2 +-
 packages/styling/src/styles/theme.ts          | 20 ++--
 6 files changed, 102 insertions(+), 81 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/phkuo-themingClasses_2017-07-05-22-20.json

diff --git a/common/changes/@uifabric/styling/phkuo-themingClasses_2017-07-05-22-20.json b/common/changes/@uifabric/styling/phkuo-themingClasses_2017-07-05-22-20.json
new file mode 100644
index 0000000000000..2b1a4bebcc85a
--- /dev/null
+++ b/common/changes/@uifabric/styling/phkuo-themingClasses_2017-07-05-22-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Styling package: remove optionals from interfaces, since consumers can now use partial interfaces to define overrides.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "phkuo@microsoft.com"
+}
diff --git a/packages/styling/src/interfaces/IPalette.ts b/packages/styling/src/interfaces/IPalette.ts
index 73dc4e77fc4a2..611f1810648c6 100644
--- a/packages/styling/src/interfaces/IPalette.ts
+++ b/packages/styling/src/interfaces/IPalette.ts
@@ -5,230 +5,230 @@ export interface IPalette {
   /**
    * Color code for themeDarker.
    */
-  themeDarker?: string;
+  themeDarker: string;
 
   /**
    * Color code for themeDark.
    */
-  themeDark?: string;
+  themeDark: string;
 
   /**
    * Color code for themeDarkAlt.
    */
-  themeDarkAlt?: string;
+  themeDarkAlt: string;
 
   /**
    * Color code for themePrimary.
    */
-  themePrimary?: string;
+  themePrimary: string;
 
   /**
    * Color code for themeSecondary.
    */
-  themeSecondary?: string;
+  themeSecondary: string;
 
   /**
    * Color code for themeTertiary.
    */
-  themeTertiary?: string;
+  themeTertiary: string;
 
   /**
    * Color code for themeLight.
    */
-  themeLight?: string;
+  themeLight: string;
 
   /**
    * Color code for themeLighter.
    */
-  themeLighter?: string;
+  themeLighter: string;
 
   /**
    * Color code for themeLighterAlt.
    */
-  themeLighterAlt?: string;
+  themeLighterAlt: string;
 
   /**
    * Color code for black.
    */
-  black?: string;
+  black: string;
 
   /**
    * Color code for blackTranslucent40.
    */
-  blackTranslucent40?: string;
+  blackTranslucent40: string;
 
   /**
    * Color code for neutralDark.
    */
-  neutralDark?: string;
+  neutralDark: string;
 
   /**
    * Color code for neutralPrimary.
    */
-  neutralPrimary?: string;
+  neutralPrimary: string;
 
   /**
    * Color code for neutralPrimaryAlt.
    */
-  neutralPrimaryAlt?: string;
+  neutralPrimaryAlt: string;
 
   /**
    * Color code for neutralSecondary.
    */
-  neutralSecondary?: string;
+  neutralSecondary: string;
 
   /**
    * Color code for neutralTertiary.
    */
-  neutralTertiary?: string;
+  neutralTertiary: string;
 
   /**
    * Color code for neutralTertiaryAlt.
    */
-  neutralTertiaryAlt?: string;
+  neutralTertiaryAlt: string;
 
   /**
    * Color code for neutralQuaternary.
    */
-  neutralQuaternary?: string;
+  neutralQuaternary: string;
 
   /**
    * Color code for neutralQuaternaryAlt.
    */
-  neutralQuaternaryAlt?: string;
+  neutralQuaternaryAlt: string;
 
   /**
    * Color code for neutralLight.
    */
-  neutralLight?: string;
+  neutralLight: string;
 
   /**
    * Color code for neutralLighter.
    */
-  neutralLighter?: string;
+  neutralLighter: string;
 
   /**
    * Color code for neutralLighterAlt.
    */
-  neutralLighterAlt?: string;
+  neutralLighterAlt: string;
 
   /**
    * Color code for white.
    */
-  white?: string;
+  white: string;
 
   /**
    * Color code for yellow.
    */
-  yellow?: string;
+  yellow: string;
 
   /**
    * Color code for yellowLight.
    */
-  yellowLight?: string;
+  yellowLight: string;
 
   /**
    * Color code for orange.
    */
-  orange?: string;
+  orange: string;
 
   /**
    * Color code for orangeLight.
    */
-  orangeLight?: string;
+  orangeLight: string;
 
   /**
    * Color code for orangeLighter.
    */
-  orangeLighter?: string;
+  orangeLighter: string;
 
   /**
    * Color code for redDark.
    */
-  redDark?: string;
+  redDark: string;
 
   /**
    * Color code for red.
    */
-  red?: string;
+  red: string;
 
   /**
    * Color code for magentaDark.
    */
-  magentaDark?: string;
+  magentaDark: string;
 
   /**
    * Color code for magenta.
    */
-  magenta?: string;
+  magenta: string;
 
   /**
    * Color code for magentaLight.
    */
-  magentaLight?: string;
+  magentaLight: string;
 
   /**
    * Color code for purpleDark.
    */
-  purpleDark?: string;
+  purpleDark: string;
 
   /**
    * Color code for purple.
    */
-  purple?: string;
+  purple: string;
 
   /**
    * Color code for purpleLight.
    */
-  purpleLight?: string;
+  purpleLight: string;
 
   /**
    * Color code for blueDark.
    */
-  blueDark?: string;
+  blueDark: string;
 
   /**
    * Color code for blueMid.
    */
-  blueMid?: string;
+  blueMid: string;
 
   /**
    * Color code for blue.
    */
-  blue?: string;
+  blue: string;
 
   /**
    * Color code for blueLight.
    */
-  blueLight?: string;
+  blueLight: string;
 
   /**
    * Color code for tealDark.
    */
-  tealDark?: string;
+  tealDark: string;
 
   /**
    * Color code for teal.
    */
-  teal?: string;
+  teal: string;
 
   /**
    * Color code for tealLight.
    */
-  tealLight?: string;
+  tealLight: string;
 
   /**
    * Color code for greenDark.
    */
-  greenDark?: string;
+  greenDark: string;
 
   /**
    * Color code for green.
    */
-  green?: string;
+  green: string;
 
   /**
    * Color code for greenLight.
    */
-  greenLight?: string;
+  greenLight: string;
 }
diff --git a/packages/styling/src/interfaces/ISemanticColors.ts b/packages/styling/src/interfaces/ISemanticColors.ts
index 2a58cf069e4ff..c7d5b3d17f999 100644
--- a/packages/styling/src/interfaces/ISemanticColors.ts
+++ b/packages/styling/src/interfaces/ISemanticColors.ts
@@ -41,131 +41,131 @@ export interface ISemanticColors {
   /**
    * The default color for backgrounds.
    */
-  bodyBackground?: string;
+  bodyBackground: string;
 
   /**
    * The default color for text.
    */
-  bodyText?: string;
+  bodyText: string;
 
   /**
    * De-emphasized text; e.g. metadata, captions, placeholder text.
    */
-  bodySubtext?: string;
+  bodySubtext: string;
 
   /**
    * Divider lines; e.g. lines that separate sections in a menu, an <HR> element.
    */
-  bodyDivider?: string;
+  bodyDivider: string;
 
   /**
    * The default color for backgrounds of disabled controls; e.g. disabled text field.
    */
-  disabledBackground?: string;
+  disabledBackground: string;
 
   /**
    * The default color for disabled text; e.g. user input inside a disabled text field.
    */
-  disabledText?: string;
+  disabledText: string;
 
   /**
    * Disabled de-emphasized text; e.g. placeholder text inside disabled input field.
    */
-  disabledSubtext?: string;
+  disabledSubtext: string;
 
   /**
    * The color of the outline around focused controls that don't already have a border; e.g. menu items
    */
-  focusBorder?: string;
+  focusBorder: string;
 
   // Invariants - slots that rarely change color theme-to-theme because the color has meaning
   /**
    * The background for errors, if necessary, or highlighting the section of the page where the error is present.
    */
-  errorBackground?: string;
+  errorBackground: string;
   /**
    * The default color of error text.
    */
-  errorText?: string;
+  errorText: string;
 
   // Input controls slots (text fields, checkboxes, radios...)
 
   /**
    * The border of an input control in its resting, unchecked state; e.g. the box of an unchecked checkbox.
    */
-  inputBorder?: string;
+  inputBorder: string;
   /**
    * The border color of a hovered input control.
    */
-  inputBorderHovered?: string;
+  inputBorderHovered: string;
 
   /**
    * The background of a checked control; e.g. checked radio button's dot, checked toggle's background.
    */
-  inputBackgroundChecked?: string;
+  inputBackgroundChecked: string;
 
   /**
    * The background of a checked and hovered control; e.g. checked checkbox's background color on hover.
    */
-  inputBackgroundCheckedHovered?: string;
+  inputBackgroundCheckedHovered: string;
 
   /**
    * The foreground of a checked control; e.g. checked checkbox's checkmark color, checked toggle's thumb color,
    * radio button's background color around the dot.
    */
-  inputForegroundChecked?: string;
+  inputForegroundChecked: string;
 
   /**
    * The alternate focus border color for elements that already have a border; e.g. text field borders on focus.
    */
-  inputFocusBorderAlt?: string;
+  inputFocusBorderAlt: string;
 
   // Menus, popups, etc
 
   /**
    * The background of a hovered menu item.
    */
-  menuItemBackgroundHovered?: string;
+  menuItemBackgroundHovered: string;
 
   /**
    * The background of checked menu item; e.g. a menu item whose submenu is open, a selected dropdown item.
    */
-  menuItemBackgroundChecked?: string;
+  menuItemBackgroundChecked: string;
 
   /**
    * The default colors of icons in menus.
    */
-  menuIcon?: string;
+  menuIcon: string;
 
   /**
    * The headers in menus that denote title of a section.
    */
-  menuHeader?: string;
+  menuHeader: string;
 
   // Lists
 
   /**
    * The background color for the entire list.
    */
-  listBackground?: string;
+  listBackground: string;
 
   /**
    * The default text color for list item titles and text in column fields.
    */
-  listTextColor?: string;
+  listTextColor: string;
 
   /**
    * The background color of a hovered list item.
    */
-  listItemBackgroundHovered?: string;
+  listItemBackgroundHovered: string;
 
   /**
    * The background color of a checked list item.
    */
-  listItemBackgroundChecked?: string;
+  listItemBackgroundChecked: string;
 
   /**
    * The background color of a checked and hovered list item.
    */
-  listItemBackgroundCheckedHovered?: string;
+  listItemBackgroundCheckedHovered: string;
 }
\ No newline at end of file
diff --git a/packages/styling/src/interfaces/ITheme.ts b/packages/styling/src/interfaces/ITheme.ts
index 0437c9b77214a..90fb34dbac2d6 100644
--- a/packages/styling/src/interfaces/ITheme.ts
+++ b/packages/styling/src/interfaces/ITheme.ts
@@ -5,5 +5,11 @@ import { ISemanticColors } from './ISemanticColors';
 export interface ITheme {
   palette: IPalette;
   fonts: IFontStyles;
-  semanticColors?: ISemanticColors;
+  semanticColors: ISemanticColors;
+}
+
+export interface IPartialTheme {
+  palette?: Partial<IPalette>;
+  fonts?: Partial<IFontStyles>;
+  semanticColors?: Partial<ISemanticColors>;
 }
diff --git a/packages/styling/src/interfaces/index.ts b/packages/styling/src/interfaces/index.ts
index 218951c85c719..e80c7d3d1ce69 100644
--- a/packages/styling/src/interfaces/index.ts
+++ b/packages/styling/src/interfaces/index.ts
@@ -5,4 +5,4 @@ export { IAnimationStyles } from './IAnimationStyles';
 export { IPalette } from './IPalette';
 export { ISemanticColors } from './ISemanticColors';
 export { IFontStyles } from './IFontStyles';
-export { ITheme } from './ITheme';
+export { ITheme, IPartialTheme } from './ITheme';
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index 9e9ca5e225d17..7f059854f356d 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -1,7 +1,9 @@
+import { GlobalSettings } from '@uifabric/utilities/lib/GlobalSettings';
 import {
   IPalette,
   ISemanticColors,
-  ITheme
+  ITheme,
+  IPartialTheme
 } from '../interfaces/index';
 import {
   DefaultFontStyles
@@ -10,7 +12,7 @@ import {
   DefaultPalette
 } from './DefaultPalette';
 import { loadTheme as legacyLoadTheme } from '@microsoft/load-themed-styles';
-import { GlobalSettings } from '@uifabric/utilities/lib/GlobalSettings';
+
 let _theme: ITheme = {
   palette: DefaultPalette,
   semanticColors: _makeSemanticColorsFromPalette(DefaultPalette),
@@ -38,27 +40,29 @@ export function getTheme(): ITheme {
 }
 
 /**
- * Loads the default global theme definition.
+ * Applies the theme, while filling in missing slots.
  */
-export function loadTheme(theme: Partial<ITheme>): void {
+export function loadTheme(theme: IPartialTheme): ITheme {
   _theme = createTheme(theme);
 
   // Load the legacy theme from the palette.
   legacyLoadTheme(_theme.palette as {});
 
   GlobalSettings.setValue(ThemeSettingName, _theme);
+
+  return _theme;
 }
 
 /**
  * Creates a custom theme definition which can be used with the Customizer.
  */
-export function createTheme(theme: Partial<ITheme>): ITheme {
-  let newPalette = { ..._theme.palette, ...theme.palette };
+export function createTheme(theme: IPartialTheme): ITheme {
+  let newPalette = { ...DefaultPalette, ...theme.palette };
 
   return {
     palette: newPalette,
     fonts: {
-      ..._theme.fonts,
+      ...DefaultFontStyles,
       ...theme.fonts
     },
     semanticColors: { ..._makeSemanticColorsFromPalette(newPalette), ...theme.semanticColors }
@@ -80,7 +84,7 @@ function _makeSemanticColorsFromPalette(p: IPalette): ISemanticColors {
 
     focusBorder: p.black,
 
-    // errorBackground: todo,
+    errorBackground: '#fde7e9',
     errorText: p.redDark,
 
     inputBorder: p.neutralTertiary,

From ceb8ef4254a0b21d34417d12162315da4633ee00 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 7 Jul 2017 10:11:38 +0000
Subject: [PATCH 0222/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 ...phkuo-themingClasses_2017-07-05-22-20.json | 11 --------
 .../styling-strict-null_2017-06-28-14-07.json | 11 --------
 ...s-adsurang-bugfixes4_2017-07-03-19-25.json | 11 --------
 ...chench-ignorechevron_2017-06-29-18-00.json | 11 --------
 packages/example-app-base/package.json        |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 26 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 13 +++++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/CHANGELOG.json               | 21 +++++++++++++++
 packages/styling/CHANGELOG.md                 | 13 +++++++++-
 packages/styling/package.json                 |  2 +-
 12 files changed, 76 insertions(+), 51 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/phkuo-themingClasses_2017-07-05-22-20.json
 delete mode 100644 common/changes/@uifabric/styling/styling-strict-null_2017-06-28-14-07.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-adsurang-bugfixes4_2017-07-03-19-25.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-chench-ignorechevron_2017-06-29-18-00.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 977db7222dd71..4e936383f912b 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.14.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.16.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/phkuo-themingClasses_2017-07-05-22-20.json b/common/changes/@uifabric/styling/phkuo-themingClasses_2017-07-05-22-20.json
deleted file mode 100644
index 2b1a4bebcc85a..0000000000000
--- a/common/changes/@uifabric/styling/phkuo-themingClasses_2017-07-05-22-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Styling package: remove optionals from interfaces, since consumers can now use partial interfaces to define overrides.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "phkuo@microsoft.com"
-}
diff --git a/common/changes/@uifabric/styling/styling-strict-null_2017-06-28-14-07.json b/common/changes/@uifabric/styling/styling-strict-null_2017-06-28-14-07.json
deleted file mode 100644
index 42c9f3d57c185..0000000000000
--- a/common/changes/@uifabric/styling/styling-strict-null_2017-06-28-14-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Enable strict null checks in the styling package",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "<christianjordangonzalez@gmail.com>"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-adsurang-bugfixes4_2017-07-03-19-25.json b/common/changes/office-ui-fabric-react/users-adsurang-bugfixes4_2017-07-03-19-25.json
deleted file mode 100644
index 402ce49328666..0000000000000
--- a/common/changes/office-ui-fabric-react/users-adsurang-bugfixes4_2017-07-03-19-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Buttons: disabled buttons with hrefs now render as BUTTON elements instead of A tags, since BUTTON can support the disabled flag.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "adsurang@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/users-chench-ignorechevron_2017-06-29-18-00.json b/common/changes/office-ui-fabric-react/users-chench-ignorechevron_2017-06-29-18-00.json
deleted file mode 100644
index da142146a2ed1..0000000000000
--- a/common/changes/office-ui-fabric-react/users-chench-ignorechevron_2017-06-29-18-00.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "GroupedList: Add a new prop to ignore the collapse button on the column name bar when there's custom group header",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chench@microsoft.com"
-}
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 6072cba88df7b..88cbd42c37de0 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -47,7 +47,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.12.3 <1.0.0",
+    "@uifabric/styling": ">=0.13.0 <1.0.0",
     "@uifabric/utilities": ">=4.6.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index a0d259320dd89..5533d434c0a59 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.16.0",
+      "tag": "office-ui-fabric-react_v4.16.0",
+      "date": "Fri, 07 Jul 2017 10:11:38 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "aadhars <adhargithub@gmail.com>",
+            "commit": "739afaec20093f1bb14ceb844c859a881cba6dd0",
+            "comment": "Buttons: disabled buttons with hrefs now render as BUTTON elements instead of A tags, since BUTTON can support the disabled flag."
+          }
+        ],
+        "minor": [
+          {
+            "author": "CmonsterC <CmonsterC@users.noreply.github.com>",
+            "commit": "dae9df0a1345d7ddc4e92c04037bec52ab2cace1",
+            "comment": "GroupedList: Add a new prop to ignore the collapse button on the column name bar when there's custom group header"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.12.3 <1.0.0` to `>=0.13.0 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.15.0",
       "tag": "office-ui-fabric-react_v4.15.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index aa8511b012225..490ba98bec7c3 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 06 Jul 2017 10:11:47 GMT and should not be manually modified.
+This log was last generated on Fri, 07 Jul 2017 10:11:38 GMT and should not be manually modified.
+
+## 4.16.0
+Fri, 07 Jul 2017 10:11:38 GMT
+
+### Minor changes
+
+- GroupedList: Add a new prop to ignore the collapse button on the column name bar when there's custom group header
+
+### Patches
+
+- Buttons: disabled buttons with hrefs now render as BUTTON elements instead of A tags, since BUTTON can support the disabled flag.
 
 ## 4.15.0
 Thu, 06 Jul 2017 10:11:47 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 4c95f1648a7aa..dce3575c7ccd6 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.15.0",
+  "version": "4.16.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.6.0 <5.0.0",
-    "@uifabric/styling": ">=0.12.3 <1.0.0",
+    "@uifabric/styling": ">=0.13.0 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 3873a26b0ff9a..e2d14768a3a59 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,27 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.13.0",
+      "tag": "@uifabric/styling_v0.13.0",
+      "date": "Fri, 07 Jul 2017 10:11:38 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "8739efafc90df5f7c51da305189b2cdc131c66e0",
+            "comment": "Styling package: remove optionals from interfaces, since consumers can now use partial interfaces to define overrides."
+          }
+        ],
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "42587fd0ba26b9efade415cc5cc60103fbe2f980",
+            "comment": "Enable strict null checks in the styling package"
+          }
+        ]
+      }
+    },
     {
       "version": "0.12.3",
       "tag": "@uifabric/styling_v0.12.3",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 0a1b4b60158a1..9ee8f1cf26489 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 06 Jul 2017 10:11:47 GMT and should not be manually modified.
+This log was last generated on Fri, 07 Jul 2017 10:11:38 GMT and should not be manually modified.
+
+## 0.13.0
+Fri, 07 Jul 2017 10:11:38 GMT
+
+### Minor changes
+
+- Styling package: remove optionals from interfaces, since consumers can now use partial interfaces to define overrides.
+
+### Patches
+
+- Enable strict null checks in the styling package
 
 ## 0.12.3
 Thu, 06 Jul 2017 10:11:47 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 9664ec49bcbcd..0a87a67baa22f 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.12.3",
+  "version": "0.13.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 3df78de25c03bf92d299e9f544950593001861eb Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 7 Jul 2017 20:11:53 -0700
Subject: [PATCH 0223/1641] AMD fix, @types fix, small FocusZone fix (#2162)

* Fixing all @types to be locked to avoid generate failing to build. (Found that some newer typings can't be consumed until we bump typescript.) Fixed comments, to make api-extractor happier. Fixed an amd import.

* Change files.

* Reverting a break in focus management committed previous by https://github.com/OfficeDev/office-ui-fabric-react/pull/2043/files
---
 apps/component-demo/package.json              |   16 +-
 apps/fabric-website/package.json              |   16 +-
 apps/ssr-tests/package.json                   |    8 +-
 apps/test-bundle-button/package.json          |   10 +-
 apps/todo-app/package.json                    |   14 +-
 .../package-updates_2017-07-08-02-13.json     |   11 +
 .../package-updates_2017-07-08-02-13.json     |   11 +
 .../package-updates_2017-07-08-02-13.json     |   11 +
 .../package-updates_2017-07-08-02-13.json     |   11 +
 .../package-updates_2017-07-08-02-13.json     |   11 +
 common/config/rush/npm-shrinkwrap.json        | 1463 ++++++++++-------
 packages/example-app-base/package.json        |   14 +-
 packages/example-component/package.json       |   14 +-
 packages/office-ui-fabric-react/package.json  |   18 +-
 .../src/components/DetailsList/DetailsRow.tsx |    2 +-
 .../src/components/FocusZone/FocusZone.tsx    |    4 +-
 packages/styling/package.json                 |   14 +-
 packages/utilities/api/utilities.api.ts       |  121 +-
 packages/utilities/package.json               |   18 +-
 packages/utilities/src/Async.ts               |    9 +-
 packages/utilities/src/AutoScroll.ts          |    2 +
 packages/utilities/src/BaseComponent.ts       |   12 +
 packages/utilities/src/Customizer.tsx         |   17 +
 packages/utilities/src/DelayedRender.tsx      |   12 +
 packages/utilities/src/EventGroup.ts          |   23 +
 packages/utilities/src/FabricPerformance.ts   |   20 +
 packages/utilities/src/IDisposable.ts         |    5 +
 packages/utilities/src/IPoint.ts              |    5 +
 packages/utilities/src/IRectangle.ts          |    5 +
 packages/utilities/src/IRenderFunction.ts     |    5 +
 packages/utilities/src/KeyCodes.ts            |    7 +-
 packages/utilities/src/Rectangle.ts           |    5 +
 packages/utilities/src/array.ts               |   23 +-
 packages/utilities/src/css.ts                 |   21 +-
 packages/utilities/src/dom.ts                 |   25 +-
 packages/utilities/src/focus.ts               |   49 +-
 packages/utilities/src/hoist.ts               |    2 +
 packages/utilities/src/initials.ts            |    6 +-
 packages/utilities/src/language.ts            |    4 +
 packages/utilities/src/math.ts                |    6 +-
 packages/utilities/src/memoize.ts             |   14 +-
 packages/utilities/src/object.ts              |   14 +-
 packages/utilities/src/overflow.ts            |    3 +
 packages/utilities/src/properties.ts          |   48 +
 packages/utilities/src/rtl.ts                 |    6 +
 packages/utilities/src/scroll.ts              |   25 +-
 packages/utilities/src/string.ts              |    9 +-
 packages/utilities/src/warn.ts                |    5 +
 48 files changed, 1459 insertions(+), 715 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/package-updates_2017-07-08-02-13.json
 create mode 100644 common/changes/@uifabric/fabric-website/package-updates_2017-07-08-02-13.json
 create mode 100644 common/changes/@uifabric/styling/package-updates_2017-07-08-02-13.json
 create mode 100644 common/changes/@uifabric/utilities/package-updates_2017-07-08-02-13.json
 create mode 100644 common/changes/office-ui-fabric-react/package-updates_2017-07-08-02-13.json

diff --git a/apps/component-demo/package.json b/apps/component-demo/package.json
index 0ebe664ee7b8e..fbc6129ce1a70 100644
--- a/apps/component-demo/package.json
+++ b/apps/component-demo/package.json
@@ -13,15 +13,15 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": ">=1.2.2 <2.0.0",
-    "@types/chai": "^3.4.35",
+    "@types/chai": "3.4.35",
     "@types/es6-promise": "^0.0.32",
-    "@types/immutability-helper": "^2.0.15",
-    "@types/mocha": "^2.2.32",
-    "@types/node": "^6.0.45",
-    "@types/react": "^15.0.16",
-    "@types/react-addons-test-utils": "^0.14.17",
-    "@types/react-dom": "^0.14.23",
-    "@types/webpack-env": "^1.13.0",
+    "@types/immutability-helper": "2.0.15",
+    "@types/mocha": "2.2.32",
+    "@types/node": "6.0.45",
+    "@types/react": "15.0.29",
+    "@types/react-addons-test-utils": "0.14.17",
+    "@types/react-dom": "0.14.23",
+    "@types/webpack-env": "1.13.0",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 4e936383f912b..b4d00b1a9cd0f 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -17,14 +17,14 @@
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
-    "@types/chai": "^3.4.35",
-    "@types/enzyme": "^2.7.5",
+    "@types/chai": "3.4.35",
+    "@types/enzyme": "2.8.0",
     "@types/es6-promise": "^0.0.32",
-    "@types/mocha": "^2.2.39",
-    "@types/react": "^15.0.16",
-    "@types/react-addons-test-utils": "^0.14.17",
-    "@types/react-dom": "^15.5.0",
-    "@types/webpack-env": "^1.13.0",
+    "@types/mocha": "2.2.39",
+    "@types/react": "15.0.29",
+    "@types/react-addons-test-utils": "0.14.17",
+    "@types/react-dom": "15.5.0",
+    "@types/webpack-env": "1.13.0",
     "es6-promise": "^4.1.0",
     "git-rev": "0.2.1",
     "gulp": "~3.9.1",
@@ -47,7 +47,7 @@
     "webpack-bundle-analyzer": "^2.2.1"
   },
   "dependencies": {
-    "@uifabric/example-app-base": "4.0.1",
+    "@uifabric/example-app-base": ">=4.0.1 <5.0.0",
     "@uifabric/utilities": ">=4.6.0 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 546f5f5f2a0cf..d50e17e12074d 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -17,11 +17,11 @@
   "license": "MIT",
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@types/chai": "^3.4.35",
-    "@types/enzyme": "^2.7.5",
+    "@types/chai": "3.4.35",
+    "@types/enzyme": "2.8.0",
     "@types/es6-promise": "^0.0.32",
-    "@types/mocha": "^2.2.39",
-    "@types/webpack-env": "^1.13.0",
+    "@types/mocha": "2.2.39",
+    "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
     "office-ui-fabric-react": ">=4.15.0 <5.0.0",
     "raw-loader": "^0.5.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 9d00f2724599c..6377602150f5b 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -18,11 +18,11 @@
   },
   "devDependencies": {
     "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
-    "@types/react": "^15.0.25",
-    "@types/react-addons-test-utils": "^0.14.18",
-    "@types/react-dom": "^15.5.0",
-    "@types/webpack-env": "^1.13.0",
-    "@types/prop-types": "^15.5.1",
+    "@types/react": "15.0.29",
+    "@types/react-addons-test-utils": "0.14.18",
+    "@types/react-dom": "15.5.0",
+    "@types/webpack-env": "1.13.0",
+    "@types/prop-types": "15.5.1",
     "source-map-loader": "^0.2.1",
     "ts-loader": "^2.0.1",
     "typescript": "2.2.2",
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index d28a8ded05bd8..1e9936aa48bb9 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -11,14 +11,14 @@
   },
   "devDependencies": {
     "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
-    "@types/chai": "^3.4.35",
-    "@types/enzyme": "^2.7.5",
+    "@types/chai": "3.4.35",
+    "@types/enzyme": "2.8.0",
     "@types/es6-promise": "^0.0.32",
-    "@types/mocha": "^2.2.39",
-    "@types/react": "^15.0.25",
-    "@types/react-addons-test-utils": "^0.14.18",
-    "@types/react-dom": "^15.5.0",
-    "@types/webpack-env": "^1.13.0",
+    "@types/mocha": "2.2.39",
+    "@types/react": "15.0.29",
+    "@types/react-addons-test-utils": "0.14.18",
+    "@types/react-dom": "15.5.0",
+    "@types/webpack-env": "1.13.0",
     "react-addons-test-utils": "^15.4.2"
   },
   "dependencies": {
diff --git a/common/changes/@uifabric/example-app-base/package-updates_2017-07-08-02-13.json b/common/changes/@uifabric/example-app-base/package-updates_2017-07-08-02-13.json
new file mode 100644
index 0000000000000..66f2ffab0e628
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/package-updates_2017-07-08-02-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Updating dev dependencies.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "dzearing@hotmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/package-updates_2017-07-08-02-13.json b/common/changes/@uifabric/fabric-website/package-updates_2017-07-08-02-13.json
new file mode 100644
index 0000000000000..0de1a97a712d2
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/package-updates_2017-07-08-02-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Updating dev dependencies.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "dzearing@hotmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/package-updates_2017-07-08-02-13.json b/common/changes/@uifabric/styling/package-updates_2017-07-08-02-13.json
new file mode 100644
index 0000000000000..f14dd446fc58d
--- /dev/null
+++ b/common/changes/@uifabric/styling/package-updates_2017-07-08-02-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Updating dev dependencies.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@hotmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/package-updates_2017-07-08-02-13.json b/common/changes/@uifabric/utilities/package-updates_2017-07-08-02-13.json
new file mode 100644
index 0000000000000..460cba3194fb8
--- /dev/null
+++ b/common/changes/@uifabric/utilities/package-updates_2017-07-08-02-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Updating library comments.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@hotmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/package-updates_2017-07-08-02-13.json b/common/changes/office-ui-fabric-react/package-updates_2017-07-08-02-13.json
new file mode 100644
index 0000000000000..a16be0ce11673
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/package-updates_2017-07-08-02-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixing an import breaking AMD modules related to GroupedList.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@hotmail.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index f4908916778c3..7a37640dea062 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -9,9 +9,9 @@
       "integrity": "sha1-aBrxRDx7s/3xnRnPqvdd2QoD2dI="
     },
     "@microsoft/gulp-core-build": {
-      "version": "2.5.3",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.5.3.tgz",
-      "integrity": "sha1-26R2Li/7oxiYdlmTx3d7AVk8/rc=",
+      "version": "2.6.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.6.0.tgz",
+      "integrity": "sha1-8eDlC2STVFDb3hhTbphMu4Qvs2g=",
       "dependencies": {
         "@types/chai": {
           "version": "3.4.34",
@@ -31,9 +31,9 @@
       }
     },
     "@microsoft/gulp-core-build-karma": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-karma/-/gulp-core-build-karma-2.2.2.tgz",
-      "integrity": "sha1-L910uWl7x2VZjGwrOCxR9XBhSmg=",
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-karma/-/gulp-core-build-karma-2.3.0.tgz",
+      "integrity": "sha1-ypHU5TqdX/kyFja3h9oyDi2lr48=",
       "dependencies": {
         "camelcase": {
           "version": "1.2.1",
@@ -73,9 +73,9 @@
           "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "sinon": {
           "version": "1.17.7",
@@ -95,16 +95,9 @@
           "integrity": "sha1-Qyqbv9Uab8AHmPTSUmqCnAYGh6w="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -175,9 +168,9 @@
       }
     },
     "@microsoft/gulp-core-build-webpack": {
-      "version": "1.1.6",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-webpack/-/gulp-core-build-webpack-1.1.6.tgz",
-      "integrity": "sha1-OloimWPldBfH8WPd99iNfPdm8uA=",
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-webpack/-/gulp-core-build-webpack-1.2.0.tgz",
+      "integrity": "sha1-YJabs2KtyW/0KziCN+b59Hi7mOI=",
       "dependencies": {
         "camelcase": {
           "version": "1.2.1",
@@ -205,21 +198,14 @@
           "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -439,9 +425,9 @@
           "integrity": "sha1-aHKCNTXGkuLCoBA4Jq/YLC4P8XU="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "resolve": {
           "version": "1.1.7",
@@ -469,16 +455,9 @@
           "integrity": "sha1-3e1FzBglbVHtQK7BQkidXGECbSg="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -571,30 +550,35 @@
       "integrity": "sha1-Qqwrj4yx79VSDd209FGZcBLLgwA="
     },
     "@microsoft/web-library-build": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/@microsoft/web-library-build/-/web-library-build-3.0.2.tgz",
-      "integrity": "sha1-DldYaol/ddjdDAKdKVtBapg4f5w=",
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/web-library-build/-/web-library-build-3.1.0.tgz",
+      "integrity": "sha1-FPDBDM3dZeoNDBZOlMf0Sn7BW0I=",
       "dependencies": {
         "@microsoft/api-extractor": {
-          "version": "2.0.9",
-          "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.0.9.tgz",
-          "integrity": "sha1-4h0HMRm29kzCz/E70bP5Z0H+yI4="
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.2.0.tgz",
+          "integrity": "sha1-pWap7SVj1TlhR3NFGfXdig/Bz9w="
         },
         "@microsoft/gulp-core-build-sass": {
-          "version": "3.1.2",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.1.2.tgz",
-          "integrity": "sha1-msehN3WBLY3s1/BOQrfy1BKjnCc="
+          "version": "3.2.0",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.2.0.tgz",
+          "integrity": "sha1-KjGubAzpx/RC6KB21FGW+xVaRGo="
         },
         "@microsoft/gulp-core-build-typescript": {
-          "version": "3.1.3",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.1.3.tgz",
-          "integrity": "sha1-cq1XPBA8eu5G+v4IRnCmmlXTHKo="
+          "version": "3.2.0",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.2.0.tgz",
+          "integrity": "sha1-Ex5ztJ8Y2kUbjbOWR+mI0JRFSrw="
         },
         "ansi-align": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-2.0.0.tgz",
           "integrity": "sha1-w2rsy6VjuJzrVW82kPCx2eNUf38="
         },
+        "ansi-regex": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg="
+        },
         "autoprefixer": {
           "version": "6.3.7",
           "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz",
@@ -611,9 +595,9 @@
           "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
         },
         "clean-css": {
-          "version": "4.1.4",
-          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.4.tgz",
-          "integrity": "sha1-7siBHbJ0V+AHjYypIfqBty+oK/Q="
+          "version": "4.1.5",
+          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.5.tgz",
+          "integrity": "sha1-0JqHoCpTdRF1iXlq52oGPKzbVBo="
         },
         "configstore": {
           "version": "3.1.0",
@@ -678,9 +662,14 @@
           "integrity": "sha1-d6WLt3uhtDkrJwwLWYUv116JqLQ="
         },
         "string-width": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.0.0.tgz",
-          "integrity": "sha1-Y1xUNsxypuDDh87KJ41OLuxSaH4="
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.0.tgz",
+          "integrity": "sha1-AwZkVh/BRslCPsfZeP4kV0N/5tA="
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8="
         },
         "timed-out": {
           "version": "4.0.1",
@@ -721,6 +710,10 @@
           "version": "5.0.3",
           "bundled": true
         },
+        "ajv": {
+          "version": "5.2.0",
+          "bundled": true
+        },
         "async": {
           "version": "0.9.2",
           "bundled": true
@@ -729,6 +722,10 @@
           "version": "3.0.0",
           "bundled": true
         },
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
         "constants-browserify": {
           "version": "1.0.0",
           "bundled": true
@@ -741,6 +738,10 @@
           "version": "2.6.0",
           "bundled": true
         },
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
+        },
         "enhanced-resolve": {
           "version": "3.1.0",
           "bundled": true
@@ -757,6 +758,10 @@
           "version": "1.0.0",
           "bundled": true
         },
+        "loader-utils": {
+          "version": "0.2.17",
+          "bundled": true
+        },
         "mocha": {
           "version": "3.3.0",
           "bundled": true
@@ -837,10 +842,18 @@
           "version": "2.6.1",
           "bundled": true,
           "dependencies": {
+            "ajv": {
+              "version": "4.11.8",
+              "bundled": true
+            },
             "async": {
               "version": "2.4.1",
               "bundled": true
             },
+            "loader-utils": {
+              "version": "0.2.17",
+              "bundled": true
+            },
             "source-map": {
               "version": "0.5.6",
               "bundled": true
@@ -864,6 +877,10 @@
           "version": "5.0.3",
           "bundled": true
         },
+        "ajv": {
+          "version": "5.2.0",
+          "bundled": true
+        },
         "async": {
           "version": "2.4.1",
           "bundled": true
@@ -872,6 +889,10 @@
           "version": "3.0.0",
           "bundled": true
         },
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
         "constants-browserify": {
           "version": "1.0.0",
           "bundled": true
@@ -884,6 +905,10 @@
           "version": "2.6.0",
           "bundled": true
         },
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
+        },
         "enhanced-resolve": {
           "version": "3.1.0",
           "bundled": true
@@ -900,6 +925,10 @@
           "version": "1.0.0",
           "bundled": true
         },
+        "loader-utils": {
+          "version": "1.1.0",
+          "bundled": true
+        },
         "mocha": {
           "version": "3.4.2",
           "bundled": true
@@ -962,7 +991,17 @@
         },
         "webpack": {
           "version": "2.6.1",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "ajv": {
+              "version": "4.11.8",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "0.2.17",
+              "bundled": true
+            }
+          }
         },
         "yargs": {
           "version": "6.6.0",
@@ -977,14 +1016,30 @@
     "@rush-temp/fabric-website": {
       "version": "file:projects\\fabric-website",
       "dependencies": {
+        "@types/react": {
+          "version": "15.0.29",
+          "bundled": true
+        },
+        "@types/react-addons-test-utils": {
+          "version": "0.14.17",
+          "bundled": true
+        },
         "async": {
           "version": "0.9.2",
           "bundled": true
         },
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
         "debug": {
           "version": "2.6.0",
           "bundled": true
         },
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
+        },
         "glob": {
           "version": "7.1.1",
           "bundled": true
@@ -993,6 +1048,10 @@
           "version": "9.11.0",
           "bundled": true
         },
+        "loader-utils": {
+          "version": "0.2.17",
+          "bundled": true
+        },
         "mocha": {
           "version": "3.3.0",
           "bundled": true
@@ -1022,6 +1081,10 @@
           "version": "5.0.3",
           "bundled": true
         },
+        "ajv": {
+          "version": "5.2.0",
+          "bundled": true
+        },
         "async": {
           "version": "0.9.2",
           "bundled": true
@@ -1030,6 +1093,10 @@
           "version": "3.0.0",
           "bundled": true
         },
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
         "constants-browserify": {
           "version": "1.0.0",
           "bundled": true
@@ -1042,6 +1109,10 @@
           "version": "2.6.0",
           "bundled": true
         },
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
+        },
         "enhanced-resolve": {
           "version": "3.1.0",
           "bundled": true
@@ -1058,6 +1129,10 @@
           "version": "1.0.0",
           "bundled": true
         },
+        "loader-utils": {
+          "version": "0.2.17",
+          "bundled": true
+        },
         "mocha": {
           "version": "3.4.2",
           "bundled": true
@@ -1136,10 +1211,18 @@
           "version": "2.6.1",
           "bundled": true,
           "dependencies": {
+            "ajv": {
+              "version": "4.11.8",
+              "bundled": true
+            },
             "async": {
               "version": "2.4.1",
               "bundled": true
             },
+            "loader-utils": {
+              "version": "0.2.17",
+              "bundled": true
+            },
             "source-map": {
               "version": "0.5.6",
               "bundled": true
@@ -1166,6 +1249,10 @@
           "version": "5.0.3",
           "bundled": true
         },
+        "ajv": {
+          "version": "5.2.0",
+          "bundled": true
+        },
         "async": {
           "version": "2.4.1",
           "bundled": true
@@ -1174,6 +1261,10 @@
           "version": "3.0.0",
           "bundled": true
         },
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
         "constants-browserify": {
           "version": "1.0.0",
           "bundled": true
@@ -1186,6 +1277,10 @@
           "version": "2.6.0",
           "bundled": true
         },
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
+        },
         "enhanced-resolve": {
           "version": "3.1.0",
           "bundled": true
@@ -1202,6 +1297,10 @@
           "version": "1.0.0",
           "bundled": true
         },
+        "loader-utils": {
+          "version": "1.1.0",
+          "bundled": true
+        },
         "mocha": {
           "version": "3.3.0",
           "bundled": true
@@ -1264,7 +1363,17 @@
         },
         "webpack": {
           "version": "2.6.1",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "ajv": {
+              "version": "4.11.8",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "0.2.17",
+              "bundled": true
+            }
+          }
         },
         "yargs": {
           "version": "6.6.0",
@@ -1287,6 +1396,10 @@
           "version": "5.0.3",
           "bundled": true
         },
+        "ajv": {
+          "version": "5.2.0",
+          "bundled": true
+        },
         "async": {
           "version": "0.9.2",
           "bundled": true
@@ -1295,6 +1408,10 @@
           "version": "3.0.0",
           "bundled": true
         },
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
         "constants-browserify": {
           "version": "1.0.0",
           "bundled": true
@@ -1307,6 +1424,10 @@
           "version": "2.6.0",
           "bundled": true
         },
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
+        },
         "enhanced-resolve": {
           "version": "3.1.0",
           "bundled": true
@@ -1323,6 +1444,10 @@
           "version": "1.0.0",
           "bundled": true
         },
+        "loader-utils": {
+          "version": "0.2.17",
+          "bundled": true
+        },
         "mocha": {
           "version": "3.4.2",
           "bundled": true
@@ -1405,10 +1530,18 @@
           "version": "2.6.1",
           "bundled": true,
           "dependencies": {
+            "ajv": {
+              "version": "4.11.8",
+              "bundled": true
+            },
             "async": {
               "version": "2.4.1",
               "bundled": true
             },
+            "loader-utils": {
+              "version": "0.2.17",
+              "bundled": true
+            },
             "source-map": {
               "version": "0.5.6",
               "bundled": true
@@ -1428,10 +1561,72 @@
     "@rush-temp/test-bundle-button": {
       "version": "file:projects\\test-bundle-button",
       "dependencies": {
+        "acorn": {
+          "version": "5.0.3",
+          "bundled": true
+        },
+        "ajv": {
+          "version": "5.2.0",
+          "bundled": true
+        },
+        "ajv-keywords": {
+          "version": "1.5.1",
+          "bundled": true
+        },
         "async": {
           "version": "0.9.2",
           "bundled": true
         },
+        "camelcase": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "constants-browserify": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "crypto-browserify": {
+          "version": "3.11.0",
+          "bundled": true
+        },
+        "enhanced-resolve": {
+          "version": "3.1.0",
+          "bundled": true
+        },
+        "https-browserify": {
+          "version": "0.0.1",
+          "bundled": true
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "loader-utils": {
+          "version": "0.2.17",
+          "bundled": true
+        },
+        "node-libs-browser": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "os-browserify": {
+          "version": "0.2.1",
+          "bundled": true
+        },
+        "readable-stream": {
+          "version": "2.3.2",
+          "bundled": true,
+          "dependencies": {
+            "string_decoder": {
+              "version": "1.0.3",
+              "bundled": true
+            }
+          }
+        },
+        "source-list-map": {
+          "version": "1.1.2",
+          "bundled": true
+        },
         "source-map": {
           "version": "0.1.43",
           "bundled": true
@@ -1439,6 +1634,100 @@
         "source-map-loader": {
           "version": "0.2.1",
           "bundled": true
+        },
+        "stream-browserify": {
+          "version": "2.0.1",
+          "bundled": true
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "bundled": true
+        },
+        "tapable": {
+          "version": "0.2.6",
+          "bundled": true
+        },
+        "timers-browserify": {
+          "version": "2.0.2",
+          "bundled": true
+        },
+        "url": {
+          "version": "0.11.0",
+          "bundled": true,
+          "dependencies": {
+            "punycode": {
+              "version": "1.3.2",
+              "bundled": true
+            }
+          }
+        },
+        "watchpack": {
+          "version": "1.3.1",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.4.1",
+              "bundled": true
+            }
+          }
+        },
+        "webpack": {
+          "version": "2.6.1",
+          "bundled": true,
+          "dependencies": {
+            "ajv": {
+              "version": "4.11.8",
+              "bundled": true
+            },
+            "ajv-keywords": {
+              "version": "1.5.1",
+              "bundled": true
+            },
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "0.2.17",
+              "bundled": true
+            },
+            "source-list-map": {
+              "version": "2.0.0",
+              "bundled": true
+            },
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            },
+            "webpack-sources": {
+              "version": "0.2.3",
+              "bundled": true,
+              "dependencies": {
+                "source-list-map": {
+                  "version": "1.1.2",
+                  "bundled": true
+                }
+              }
+            }
+          }
+        },
+        "webpack-sources": {
+          "version": "0.2.3",
+          "bundled": true,
+          "dependencies": {
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
+        },
+        "yargs": {
+          "version": "6.6.0",
+          "bundled": true
+        },
+        "yargs-parser": {
+          "version": "4.2.1",
+          "bundled": true
         }
       }
     },
@@ -1452,14 +1741,26 @@
           "version": "0.9.2",
           "bundled": true
         },
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
         "debug": {
           "version": "2.6.0",
           "bundled": true
         },
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
+        },
         "glob": {
           "version": "7.1.1",
           "bundled": true
         },
+        "loader-utils": {
+          "version": "0.2.17",
+          "bundled": true
+        },
         "mocha": {
           "version": "3.3.0",
           "bundled": true
@@ -1488,14 +1789,14 @@
       "integrity": "sha1-89DV2i7Ie1FOMNs/+aAYh7VhnCk="
     },
     "@types/bluebird": {
-      "version": "3.5.5",
-      "resolved": "https://registry.npmjs.org/@types/bluebird/-/bluebird-3.5.5.tgz",
-      "integrity": "sha512-aBVzCAzfyApU0gg36QgCpJixGtYwuQ4djrn11J+DTB5vE4OmBPuZiulgTCA9ByULgVAyNV2CTpjjvZmxzukSLw=="
+      "version": "3.5.8",
+      "resolved": "https://registry.npmjs.org/@types/bluebird/-/bluebird-3.5.8.tgz",
+      "integrity": "sha512-rBfrD56OxaqVjghtVqp2EEX0ieHkRk6IefDVrQXIVGvlhDOEBTvZff4Q02uo84ukVkH4k5eB1cPKGDM2NlFL8A=="
     },
     "@types/chai": {
-      "version": "3.5.2",
-      "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.5.2.tgz",
-      "integrity": "sha1-wRzSgX06QBt7oPWkIPNcVhObHB4="
+      "version": "3.4.35",
+      "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.35.tgz",
+      "integrity": "sha1-6NZfg0ktKUT4FvxiB0GCHCioyQA="
     },
     "@types/chalk": {
       "version": "0.4.31",
@@ -1503,9 +1804,9 @@
       "integrity": "sha1-ox10JBprHtu5c8822XooloNKUfk="
     },
     "@types/cheerio": {
-      "version": "0.22.1",
-      "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.1.tgz",
-      "integrity": "sha1-dAxM2MTT8wdPg7mrYucR6sLHZM4="
+      "version": "0.22.2",
+      "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.2.tgz",
+      "integrity": "sha512-7YJQbllem83umRzZ+ry6RZFAbBWNoHvbiW6tE5VEAJIoX6F22hrKrBw3ibRvHm2zPnOhZGrZJusAbp1zZKcLzQ=="
     },
     "@types/colors": {
       "version": "1.1.1",
@@ -1538,9 +1839,9 @@
       "integrity": "sha512-bT9q2eqH/E72AGBQKT50dh6AXzheTqigGZ1GwDiwmx7vfHff0bZOrvUWjvGpNWPNkRmX1vDF6wonG6rlpBHb1A=="
     },
     "@types/express-serve-static-core": {
-      "version": "4.0.48",
-      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.0.48.tgz",
-      "integrity": "sha512-+W+fHO/hUI6JX36H8FlgdMHU3Dk4a/Fn08fW5qdd7MjPP/wJlzq9fkCrgaH0gES8vohVeqwefHwPa4ylVKyYIg=="
+      "version": "4.0.49",
+      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.0.49.tgz",
+      "integrity": "sha512-b7mVHoURu1xaP/V6xw1sYwyv9V0EZ7euyi+sdnbnTZxEkAh4/hzPsI6Eflq+ZzHQ/Tgl7l16Jz+0oz8F46MLnA=="
     },
     "@types/finalhandler": {
       "version": "0.0.31",
@@ -1593,9 +1894,9 @@
       "integrity": "sha1-y1UumCbKPAjZ5lSd6ezY8VQX8G0="
     },
     "@types/mime": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.0.tgz",
-      "integrity": "sha512-pZ3X4wf0T07Zcp383IJLTrPBDLo/s9DAQQ7QkDMLJpoDNosUkSRSkbXt8OExwWkK8OEPzwqzBz7XvBHofCXcsA=="
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.1.tgz",
+      "integrity": "sha512-rek8twk9C58gHYqIrUlJsx8NQMhlxqHzln9Z9ODqiNgv3/s+ZwIrfr+djqzsnVM12xe9hL98iJ20lj2RvCBv6A=="
     },
     "@types/minimatch": {
       "version": "2.0.29",
@@ -1608,9 +1909,9 @@
       "integrity": "sha1-fyrX7FX5FEgvybHsS7GuYCjUYGY="
     },
     "@types/mocha": {
-      "version": "2.2.41",
-      "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.41.tgz",
-      "integrity": "sha1-4nzwgXFT658nE7LT9saPHhw8pgg="
+      "version": "2.2.39",
+      "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.39.tgz",
+      "integrity": "sha1-9o1j24tpw46VWLQHNSXPlsT3qCk="
     },
     "@types/node": {
       "version": "6.0.62",
@@ -1683,9 +1984,9 @@
       "integrity": "sha1-FUVt6NmNa0z/Mb5savdJKuY/Uho="
     },
     "@types/sinon": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/@types/sinon/-/sinon-2.3.1.tgz",
-      "integrity": "sha512-WXpK6gOice0sdhfrAtRaDNtg0E0e04MRuCKYuqtCmc8O1P9P+ia3Z5zuMf4cDVB27s9w4UjjML5/6vjkiI2gNA=="
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/@types/sinon/-/sinon-2.2.2.tgz",
+      "integrity": "sha1-qA2khougisysvOTTcnbzXhugpS8="
     },
     "@types/source-map": {
       "version": "0.5.0",
@@ -1760,14 +2061,14 @@
       }
     },
     "@uifabric/styling": {
-      "version": "0.10.4",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.10.4.tgz",
-      "integrity": "sha512-2UisFmjBwudR8TMqZ0NwyMydgemawpSISA+c4JnxF/4XsyrUKtexCb8b+2DbMWeKMS+JSbWdjHjlLGs8q/4zLw=="
+      "version": "0.13.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.13.0.tgz",
+      "integrity": "sha512-+E9ZW1UXBkFmL5ozw7ltsqFZNsykuuk0kW/aVKQcaNna5xlz6f3WRGhVveqIgTnE7Hdnpyf3Hj0/8qKp+R1eYg=="
     },
     "@uifabric/utilities": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.3.0.tgz",
-      "integrity": "sha512-/4/xTLAJBtdYb+ohwWYPeusSiNlUCigPWlD5nkq+uAjGW/vkT/TDJXuCQasrb9QaV6wmgF6GDLzzZMykz5w0Tg=="
+      "version": "4.7.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.7.0.tgz",
+      "integrity": "sha512-M5P7QmTcpRsi9jsXKL3IxTfTYd8EY+TeQxyOy32kmUiHNOD+2CteUohji7qzAqeMxkoktFU1j7iPTHCzPnQdEg=="
     },
     "abbrev": {
       "version": "1.0.9",
@@ -1882,21 +2183,14 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         }
       }
     },
@@ -1918,9 +2212,9 @@
       "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8="
     },
     "arr-flatten": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.0.3.tgz",
-      "integrity": "sha1-onTthawIhJtr14R8RYB0XcUa37E="
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.1.0.tgz",
+      "integrity": "sha512-L3hKV5R/p5o81R7O02IGnwpDmkp6E982XhtbuwSe3O4qOtMMMtodicASA1Cny2U+aCXcNpml+m4dPsvsJ3jatg=="
     },
     "array-differ": {
       "version": "1.0.0",
@@ -2055,9 +2349,9 @@
       "integrity": "sha1-QsV7ty1vM+u3jS2VTds99Jp1sro=",
       "dependencies": {
         "async": {
-          "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
-          "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c="
+          "version": "2.5.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
+          "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw=="
         },
         "caseless": {
           "version": "0.11.0",
@@ -2164,9 +2458,9 @@
       "integrity": "sha1-c5JncZI7Whl0etZmqlzUv5xunOg="
     },
     "base64-js": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.2.0.tgz",
-      "integrity": "sha1-o5mS1yNYSBGYK+XikLtqU9hnAPE="
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.2.1.tgz",
+      "integrity": "sha512-dwVUVIXsBZXwTuwnXI9RK8sBmgq09NDHzyR9SAph9eqk76gKK2JSQmZARC2zRC81JC2QTtxD0ARU5qTS25gIGw=="
     },
     "base64-url": {
       "version": "1.2.1",
@@ -2262,15 +2556,27 @@
       "integrity": "sha1-eRQg1/VR7qKJdFOop3ZT+WYG1nw="
     },
     "bn.js": {
-      "version": "4.11.6",
-      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.6.tgz",
-      "integrity": "sha1-UzRK2xRhehP26N0s4okF0cC6MhU="
+      "version": "4.11.7",
+      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.7.tgz",
+      "integrity": "sha512-LxFiV5mefv0ley0SzqkOPR1bC4EbpPx8LkOz5vMe/Yi15t5hzwgO/G+tc7wOtL4PZTYjwHu8JnEiSLumuSjSfA=="
     },
     "body-parser": {
       "version": "1.17.2",
       "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.17.2.tgz",
       "integrity": "sha1-+IkqvI+eYn1Crtr7yma/WrmRBO4="
     },
+    "bonjour": {
+      "version": "3.5.0",
+      "resolved": "https://registry.npmjs.org/bonjour/-/bonjour-3.5.0.tgz",
+      "integrity": "sha1-jokKGD2O6aI5OzhExpGkK897yfU=",
+      "dependencies": {
+        "array-flatten": {
+          "version": "2.1.1",
+          "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-2.1.1.tgz",
+          "integrity": "sha1-Qmu52oQJDBg42BLIFQryCoMx4pY="
+        }
+      }
+    },
     "boolbase": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
@@ -2365,6 +2671,11 @@
         }
       }
     },
+    "buffer-indexof": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/buffer-indexof/-/buffer-indexof-1.1.0.tgz",
+      "integrity": "sha1-9U9kfE9OJSKLqmVqLlfkPV8nCYI="
+    },
     "buffer-xor": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/buffer-xor/-/buffer-xor-1.0.3.tgz",
@@ -2421,9 +2732,9 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000692",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000692.tgz",
-      "integrity": "sha1-Pampk1OtvOoeFCuZ9g7MYhbfR6U="
+      "version": "1.0.30000697",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000697.tgz",
+      "integrity": "sha1-IM5qnO7vTvShXcjoDy6PuQSejXc="
     },
     "capture-stack-trace": {
       "version": "1.0.0",
@@ -2488,9 +2799,9 @@
       "integrity": "sha1-eY5ol3gVHIB2tLNg5e3SjNortGg="
     },
     "cipher-base": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/cipher-base/-/cipher-base-1.0.3.tgz",
-      "integrity": "sha1-7qvxlEGc6QDaMBjCB9IS8qbfCgc="
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/cipher-base/-/cipher-base-1.0.4.tgz",
+      "integrity": "sha512-Kkht5ye6ZGmwv40uUDZztayT2ThLQGfnj/T71N/XzeZeo3nf8foyW7zGTsPYkEya3m5f3cAypH+qe7YOrM1U2Q=="
     },
     "clap": {
       "version": "1.2.0",
@@ -2589,9 +2900,9 @@
       "integrity": "sha1-bqa989hTrlTMuOR7+gvz+QMfsYQ="
     },
     "coa": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/coa/-/coa-1.0.3.tgz",
-      "integrity": "sha1-G1Sl4dz3fJkEVdTe6pjFZEFtyJM="
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/coa/-/coa-1.0.4.tgz",
+      "integrity": "sha1-qe8VNmDWqGqL3sAomlxoTSF0Mv0="
     },
     "code-point-at": {
       "version": "1.1.0",
@@ -2639,9 +2950,9 @@
       "integrity": "sha1-k4NwpXtKUd6ix3wV1cX9+JUWQAk="
     },
     "commander": {
-      "version": "2.9.0",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
-      "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q="
+      "version": "2.11.0",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-2.11.0.tgz",
+      "integrity": "sha512-b0553uYA5YAEGgyYIGYROzKQ7X5RAqedkfjiZxwi0kL1g3bOaBNNZfYkzt/CL0umgD5wc9Jec2FbB98CjkMRvQ=="
     },
     "commoner": {
       "version": "0.10.8",
@@ -3113,6 +3424,11 @@
         }
       }
     },
+    "deep-equal": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/deep-equal/-/deep-equal-1.0.1.tgz",
+      "integrity": "sha1-9dJgKStmDghO/0zbyfCK0yR0SLU="
+    },
     "deep-extend": {
       "version": "0.4.2",
       "resolved": "https://registry.npmjs.org/deep-extend/-/deep-extend-0.4.2.tgz",
@@ -3208,15 +3524,30 @@
       "integrity": "sha1-gGZJMmzqp8qjMG112YXqJ0i6kTw="
     },
     "diff": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/diff/-/diff-3.2.0.tgz",
-      "integrity": "sha1-yc45Okt8vQsFinJck98pkCeGj/k="
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/diff/-/diff-3.3.0.tgz",
+      "integrity": "sha512-w0XZubFWn0Adlsapj9EAWX0FqWdO4tz8kc3RiYdWLh4k/V8PTb6i0SMgXt0vRM3zyKnT8tKO7mUlieRQHIjMNg=="
     },
     "diffie-hellman": {
       "version": "5.0.2",
       "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.2.tgz",
       "integrity": "sha1-tYNXOScM/ias9jIJn97SoH8gnl4="
     },
+    "dns-equal": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/dns-equal/-/dns-equal-1.0.0.tgz",
+      "integrity": "sha1-s55/HabrCnW6nBcySzR1PEfgZU0="
+    },
+    "dns-packet": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.1.1.tgz",
+      "integrity": "sha1-I2nUUDivBF84mOb6VoYq7T9AKWw="
+    },
+    "dns-txt": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/dns-txt/-/dns-txt-2.0.2.tgz",
+      "integrity": "sha1-uR2Ab10nGI5Ks+fRB9iBocxGQrY="
+    },
     "dom-serialize": {
       "version": "2.2.1",
       "resolved": "https://registry.npmjs.org/dom-serialize/-/dom-serialize-2.2.1.tgz",
@@ -3295,21 +3626,14 @@
           "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         }
       }
     },
@@ -3330,9 +3654,9 @@
       "integrity": "sha1-R5Y2v6P+Ox3r1SCH8KyyBLTxnIg="
     },
     "electron-to-chromium": {
-      "version": "1.3.14",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.14.tgz",
-      "integrity": "sha1-ZK8Pnv08PGrNV9cfg7Scp+6cS0M="
+      "version": "1.3.15",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.15.tgz",
+      "integrity": "sha1-CDl5NIkcvPrrvRi4KpW1pIETg2k="
     },
     "elliptic": {
       "version": "6.4.0",
@@ -3500,9 +3824,9 @@
       "integrity": "sha1-jjGcnwRTv1ddN0lAplWSDlnKVRI="
     },
     "es6-promise": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.0.tgz",
-      "integrity": "sha1-3aA8qPn4m8WX5omEKSnee6jOvfA="
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.1.tgz",
+      "integrity": "sha512-OaU1hHjgJf+b0NzsxCg7NdIYERD6Hy/PEmFLTjw+b65scuisG3Kt4QoTvJ66BBkPZ581gr0kpoVzKnxniM8nng=="
     },
     "es6-symbol": {
       "version": "3.1.1",
@@ -4696,21 +5020,14 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         }
       }
     },
@@ -4757,21 +5074,14 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         },
         "vinyl": {
           "version": "1.2.0",
@@ -4796,21 +5106,14 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         }
       }
     },
@@ -5213,9 +5516,9 @@
       "integrity": "sha1-Hu0Vyz5BQw0AH5qUVg+/1Pihd1k=",
       "dependencies": {
         "async": {
-          "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
-          "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c=",
+          "version": "2.5.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
+          "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw==",
           "dependencies": {
             "lodash": {
               "version": "4.17.4",
@@ -5317,21 +5620,14 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         }
       }
     },
@@ -5469,21 +5765,14 @@
           "integrity": "sha1-cTfmmzKYuzQiR6G77jiByA4v14s="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         },
         "strip-bom": {
           "version": "2.0.0",
@@ -5602,9 +5891,9 @@
       "integrity": "sha1-ZuodhW206KVHDK32/OI65SRO8uE="
     },
     "hash.js": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/hash.js/-/hash.js-1.0.3.tgz",
-      "integrity": "sha1-EzL/ABVsCg/92CNgE9B7d6BFFXM="
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/hash.js/-/hash.js-1.1.3.tgz",
+      "integrity": "sha512-/UETyP0W22QILqS+6HowevwhEFJ3MBJnwTf75Qob9Wz9t0DPuisL8kW8YZMK62dHAKE1c1p+gY1TtOLY+USEHA=="
     },
     "hasha": {
       "version": "2.2.0",
@@ -5642,9 +5931,9 @@
       "integrity": "sha1-TCu8inWJmP7r9e1oWA921GdotLw="
     },
     "hosted-git-info": {
-      "version": "2.4.2",
-      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.4.2.tgz",
-      "integrity": "sha1-AHa59GonBQbduq6lZJaJdGBhKmc="
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.5.0.tgz",
+      "integrity": "sha512-pNgbURSuab90KbTqvRPsseaTxOJCZBD0a7t+haSN33piP9cCM4l0CqdzAif2hUqm716UovKB2ROmiabGAKVXyg=="
     },
     "hpack.js": {
       "version": "2.1.6",
@@ -5657,21 +5946,14 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         }
       }
     },
@@ -5703,14 +5985,19 @@
       "integrity": "sha1-1zvD/0SJQkCIGM5gm/P7DqfvTrc=",
       "dependencies": {
         "clean-css": {
-          "version": "4.1.4",
-          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.4.tgz",
-          "integrity": "sha1-7siBHbJ0V+AHjYypIfqBty+oK/Q="
+          "version": "4.1.5",
+          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.5.tgz",
+          "integrity": "sha1-0JqHoCpTdRF1iXlq52oGPKzbVBo="
+        },
+        "commander": {
+          "version": "2.9.0",
+          "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
+          "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q="
         },
         "uglify-js": {
-          "version": "3.0.18",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.18.tgz",
-          "integrity": "sha512-0M/KeXO8bPYtlqnwIYpO4R6om1mrScMzPuWn2UPfUYOaowIhQmmFpL9Q5tlD18ulKLRKD12GQ0IiYDKJS/si1w=="
+          "version": "3.0.23",
+          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.23.tgz",
+          "integrity": "sha512-miLHbO2QcdQGxL/q1wLcUr6TGIRHhMnpKyywUbAdZRkJMqCeZCDmBsgYu1Wlj26xHBXN+sU5tHaWh38QsN208g=="
         }
       }
     },
@@ -5725,21 +6012,14 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         }
       }
     },
@@ -5810,15 +6090,30 @@
       "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-2.1.0.tgz",
       "integrity": "sha1-g/Cg7DeL8yRheLbCrZE28TWxyWI=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.1.0.tgz",
+          "integrity": "sha1-CcIC1ckX7CMYjKpcnLkXnNlUd1A="
+        },
+        "chalk": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.0.1.tgz",
+          "integrity": "sha512-Mp+FXEI+FrwY/XYV45b2YD3E8i3HwnEAoFcM0qlZzq/RZ9RwWitt2Y/c7cqRAz70U7hfekqx6qNYthuKFO6K0g=="
+        },
+        "has-flag": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
+          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
+        },
         "postcss": {
-          "version": "6.0.2",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.2.tgz",
-          "integrity": "sha1-XE/qWJ8Kw7AMqnWxy8OihBlbfl0="
+          "version": "6.0.6",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.6.tgz",
+          "integrity": "sha1-u6TVjohPx4yEDRU54Q7dqruPc70="
         },
         "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "version": "4.2.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.0.tgz",
+          "integrity": "sha512-Ts0Mu/A1S1aZxEJNG88I4Oc9rcZSBFNac5e27yh4j2mqbhZSSzR1Ah79EYwSn9Zuh7lrlGD2cVGzw1RKGzyLSg=="
         }
       }
     },
@@ -5828,9 +6123,9 @@
       "integrity": "sha1-vjPUCsEO8ZJnAfbwii2G+/0a0+Q="
     },
     "immutability-helper": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.2.2.tgz",
-      "integrity": "sha1-5+nacos94vrTSiFvQVezJtvMyJI="
+      "version": "2.2.3",
+      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.2.3.tgz",
+      "integrity": "sha1-aBoOyboqJDuYmFZOOWI8g9nOGYU="
     },
     "import-lazy": {
       "version": "2.1.0",
@@ -5894,6 +6189,11 @@
         }
       }
     },
+    "internal-ip": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/internal-ip/-/internal-ip-1.2.0.tgz",
+      "integrity": "sha1-rp+/k7mEh4eF1QqN4bNWlWBYz1w="
+    },
     "interpret": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.0.3.tgz",
@@ -5909,15 +6209,20 @@
       "resolved": "https://registry.npmjs.org/invert-kv/-/invert-kv-1.0.0.tgz",
       "integrity": "sha1-EEqOSqym09jNFXqO+L+rLXo//bY="
     },
+    "ip": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/ip/-/ip-1.1.5.tgz",
+      "integrity": "sha1-vd7XARQpCCjAoDnnLvJfWq7ENUo="
+    },
     "ipaddr.js": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.3.0.tgz",
       "integrity": "sha1-HgOlL9rYOou7KyXL9JmLTP/NPew="
     },
     "irregular-plurals": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/irregular-plurals/-/irregular-plurals-1.2.0.tgz",
-      "integrity": "sha1-OPKZg0uowAwwvpxVThNyaXUv86w="
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/irregular-plurals/-/irregular-plurals-1.3.0.tgz",
+      "integrity": "sha512-njf5A+Mxb3kojuHd1DzISjjIl+XhyzovXEOyPPSzdQozq/Lf2tN27mOrAAsxEPZxpn6I4MGzs1oo9TxXxPFpaA=="
     },
     "is": {
       "version": "3.2.1",
@@ -6050,9 +6355,9 @@
       "integrity": "sha1-wVvz5LZrYtcu+vKSWEhmPsvGGbY=",
       "dependencies": {
         "isobject": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.0.tgz",
-          "integrity": "sha1-OVZSF/NmF4nooKDAgNX35rxG4aA="
+          "version": "3.0.1",
+          "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.1.tgz",
+          "integrity": "sha1-TkMekrEalzFjaqH5yNHMvP2reN8="
         }
       }
     },
@@ -6227,23 +6532,6 @@
       "resolved": "https://registry.npmjs.org/istextorbinary/-/istextorbinary-1.0.2.tgz",
       "integrity": "sha1-rOGTVNGpoBc+/rEITOD4ewrX3s8="
     },
-    "jade": {
-      "version": "0.26.3",
-      "resolved": "https://registry.npmjs.org/jade/-/jade-0.26.3.tgz",
-      "integrity": "sha1-jxDXl32NefL2/4YqgbBRPMslaGw=",
-      "dependencies": {
-        "commander": {
-          "version": "0.6.1",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-0.6.1.tgz",
-          "integrity": "sha1-+mihT2qUXVTbvlDYzbMyDp47GgY="
-        },
-        "mkdirp": {
-          "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.3.0.tgz",
-          "integrity": "sha1-G79asbqCevI1dRQ0kEJkVfSB/h4="
-        }
-      }
-    },
     "jju": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/jju/-/jju-1.3.0.tgz",
@@ -6255,9 +6543,9 @@
       "integrity": "sha1-8OgK4DmkvWVLXygfyT8EqRSn/M4="
     },
     "js-tokens": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.1.tgz",
-      "integrity": "sha1-COnxMkhKLEWjCQfp3E1VZ7fxFNc="
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.2.tgz",
+      "integrity": "sha1-mGbfOVECEw449/mWvOtlRDIJwls="
     },
     "js-yaml": {
       "version": "3.8.4",
@@ -6423,9 +6711,9 @@
       }
     },
     "karma-webpack": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/karma-webpack/-/karma-webpack-2.0.3.tgz",
-      "integrity": "sha1-Oc6/XKJYATmyf5rmm3iBa5yC+uY=",
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/karma-webpack/-/karma-webpack-2.0.4.tgz",
+      "integrity": "sha1-Pi1PSLqUqHjhxmu44a5hKJh6F1s=",
       "dependencies": {
         "async": {
           "version": "0.9.2",
@@ -6485,21 +6773,14 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         }
       }
     },
@@ -7019,21 +7300,14 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         }
       }
     },
@@ -7058,21 +7332,14 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         }
       }
     },
@@ -7168,49 +7435,39 @@
       }
     },
     "mocha": {
-      "version": "2.5.3",
-      "resolved": "https://registry.npmjs.org/mocha/-/mocha-2.5.3.tgz",
-      "integrity": "sha1-FhvlvetJZ3HrmzV0UFC2IrWu/Fg=",
+      "version": "3.4.2",
+      "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.4.2.tgz",
+      "integrity": "sha1-0O9NMyEm2/GNDWQMmzgt1IvpdZQ=",
       "dependencies": {
         "commander": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-2.3.0.tgz",
-          "integrity": "sha1-/UMOiJgy7DU7ms0d4hfBHLPu+HM="
+          "version": "2.9.0",
+          "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
+          "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q="
         },
         "debug": {
-          "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
+          "version": "2.6.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz",
+          "integrity": "sha1-vFlryr52F/Edn6FTYe3tVgi4SZs="
         },
         "diff": {
-          "version": "1.4.0",
-          "resolved": "https://registry.npmjs.org/diff/-/diff-1.4.0.tgz",
-          "integrity": "sha1-fyjS657nsVqX79ic5j3P2qPMur8="
-        },
-        "escape-string-regexp": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.2.tgz",
-          "integrity": "sha1-Tbwv5nTnGUnK8/smlc5/LcHZqNE="
+          "version": "3.2.0",
+          "resolved": "https://registry.npmjs.org/diff/-/diff-3.2.0.tgz",
+          "integrity": "sha1-yc45Okt8vQsFinJck98pkCeGj/k="
         },
         "glob": {
-          "version": "3.2.11",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-3.2.11.tgz",
-          "integrity": "sha1-Spc/Y1uRkPcV0QmH1cAP0oFevj0="
-        },
-        "minimatch": {
-          "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.3.0.tgz",
-          "integrity": "sha1-J12O2qxPG7MyZHIInnlJyDlGmd0="
+          "version": "7.1.1",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz",
+          "integrity": "sha1-gFIR3wT6rxxjo2ADBs31reULLsg="
         },
         "ms": {
-          "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+          "version": "0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
+          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
         },
         "supports-color": {
-          "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-1.2.0.tgz",
-          "integrity": "sha1-/x7R5hFp0Gs88tWI4YixjYhH4X4="
+          "version": "3.1.2",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz",
+          "integrity": "sha1-cqJiiU2dQIuVbKBf83su2KbiotU="
         }
       }
     },
@@ -7280,6 +7537,16 @@
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
       "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
     },
+    "multicast-dns": {
+      "version": "6.1.1",
+      "resolved": "https://registry.npmjs.org/multicast-dns/-/multicast-dns-6.1.1.tgz",
+      "integrity": "sha1-bn3oalcIcqsXBYrepxYLvsqBTd4="
+    },
+    "multicast-dns-service-types": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/multicast-dns-service-types/-/multicast-dns-service-types-1.1.0.tgz",
+      "integrity": "sha1-iZ8R2WhuXgXLkbNdXw5jt3PPyQE="
+    },
     "multiparty": {
       "version": "3.3.2",
       "resolved": "https://registry.npmjs.org/multiparty/-/multiparty-3.3.2.tgz",
@@ -7326,9 +7593,9 @@
       "integrity": "sha1-euuhxzpSGEJlVUt9wDuvcg34AIE="
     },
     "node-emoji": {
-      "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/node-emoji/-/node-emoji-1.5.1.tgz",
-      "integrity": "sha1-/ZGOQSdpv4xEgFEjgjOECyr/FqE="
+      "version": "1.6.1",
+      "resolved": "https://registry.npmjs.org/node-emoji/-/node-emoji-1.6.1.tgz",
+      "integrity": "sha512-cMmAHLDT/QHCSuHBL3vQ8qXwFypx/3zN1sForcR65OM8FbC+LKefUCI29NAik4Crpiv2byyWj1SWZRlNBtbi2g=="
     },
     "node-fetch": {
       "version": "1.7.1",
@@ -7398,9 +7665,9 @@
       "integrity": "sha1-xkZdvwirzU2zWTF/eaxopkayj/k="
     },
     "normalize-package-data": {
-      "version": "2.3.8",
-      "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.3.8.tgz",
-      "integrity": "sha1-2Bntoqne29H/pWPqQHHZNngilbs="
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.4.0.tgz",
+      "integrity": "sha512-9jjUFbTPfEy3R/ad/2oNbKtW9Hgovl5O1FvFWKkKblNXoN/Oou6+9+KKohPK13Yc3/TyunyWhJp6gvRNR/PPAw=="
     },
     "normalize-path": {
       "version": "2.1.1",
@@ -7423,9 +7690,9 @@
       "integrity": "sha1-9cMr9ZX+ga6Sfa7FLoL4sACsPI8="
     },
     "npmlog": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.0.tgz",
-      "integrity": "sha512-ocolIkZYZt8UveuiDS0yAkkIjid1o7lPG8cYm05yNYzBn8ykQtaiPMEGp8fY9tKdDgm8okpdKzkvu1y9hUYugA=="
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.2.tgz",
+      "integrity": "sha512-2uUqazuKlTaSI/dC8AzicUck7+IrEaOnN/e0jd3Xtt1KcGpwx30v50mL7oPyr/h9bL3E4aZccVwpwP+5W9Vjkg=="
     },
     "nth-check": {
       "version": "1.0.1",
@@ -7490,9 +7757,9 @@
           "integrity": "sha1-xjMy9BXO3EsE2/5wz4NklMU8tEs="
         },
         "isobject": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.0.tgz",
-          "integrity": "sha1-OVZSF/NmF4nooKDAgNX35rxG4aA="
+          "version": "3.0.1",
+          "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.1.tgz",
+          "integrity": "sha1-TkMekrEalzFjaqH5yNHMvP2reN8="
         }
       }
     },
@@ -7527,9 +7794,9 @@
       "integrity": "sha1-6mJvqUURirroSrsZc45KCLCHPx8="
     },
     "office-ui-fabric-react": {
-      "version": "4.8.3",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.8.3.tgz",
-      "integrity": "sha512-iCKS3wRmzO8Avl7d9n0qBeUiwZQ+HXYFYev3h2uIzQSuUZtyokN2nM+BC70g+Ws5hIqYNnx+i1UApejflJdsJw=="
+      "version": "4.16.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.16.0.tgz",
+      "integrity": "sha512-QIALhZcdc2R0TBu29xMgZZCUKCuhE/eRFaQpyNysNAfrL1HBl1U2LlHbhnc0wkxPd+InPjVHKHjEYOPJ7irsjQ=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -7654,6 +7921,11 @@
       "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.4.tgz",
       "integrity": "sha1-Qv5tWVPfBsgGS+bxdsPQWqqjRkQ="
     },
+    "p-map": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/p-map/-/p-map-1.1.1.tgz",
+      "integrity": "sha1-BfXkrpegaDcbwqXMhr+9vBnErno="
+    },
     "package-json": {
       "version": "2.4.0",
       "resolved": "https://registry.npmjs.org/package-json/-/package-json-2.4.0.tgz",
@@ -7675,21 +7947,14 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         }
       }
     },
@@ -8075,15 +8340,30 @@
       "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-1.1.0.tgz",
       "integrity": "sha1-thTJcgvmgW6u41+zpfqh26agXds=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.1.0.tgz",
+          "integrity": "sha1-CcIC1ckX7CMYjKpcnLkXnNlUd1A="
+        },
+        "chalk": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.0.1.tgz",
+          "integrity": "sha512-Mp+FXEI+FrwY/XYV45b2YD3E8i3HwnEAoFcM0qlZzq/RZ9RwWitt2Y/c7cqRAz70U7hfekqx6qNYthuKFO6K0g=="
+        },
+        "has-flag": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
+          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
+        },
         "postcss": {
-          "version": "6.0.2",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.2.tgz",
-          "integrity": "sha1-XE/qWJ8Kw7AMqnWxy8OihBlbfl0="
+          "version": "6.0.6",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.6.tgz",
+          "integrity": "sha1-u6TVjohPx4yEDRU54Q7dqruPc70="
         },
         "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "version": "4.2.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.0.tgz",
+          "integrity": "sha512-Ts0Mu/A1S1aZxEJNG88I4Oc9rcZSBFNac5e27yh4j2mqbhZSSzR1Ah79EYwSn9Zuh7lrlGD2cVGzw1RKGzyLSg=="
         }
       }
     },
@@ -8092,15 +8372,30 @@
       "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-1.2.0.tgz",
       "integrity": "sha1-99gMOYxaOT+nlkRmvRlQCn1hwGk=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.1.0.tgz",
+          "integrity": "sha1-CcIC1ckX7CMYjKpcnLkXnNlUd1A="
+        },
+        "chalk": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.0.1.tgz",
+          "integrity": "sha512-Mp+FXEI+FrwY/XYV45b2YD3E8i3HwnEAoFcM0qlZzq/RZ9RwWitt2Y/c7cqRAz70U7hfekqx6qNYthuKFO6K0g=="
+        },
+        "has-flag": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
+          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
+        },
         "postcss": {
-          "version": "6.0.2",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.2.tgz",
-          "integrity": "sha1-XE/qWJ8Kw7AMqnWxy8OihBlbfl0="
+          "version": "6.0.6",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.6.tgz",
+          "integrity": "sha1-u6TVjohPx4yEDRU54Q7dqruPc70="
         },
         "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "version": "4.2.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.0.tgz",
+          "integrity": "sha512-Ts0Mu/A1S1aZxEJNG88I4Oc9rcZSBFNac5e27yh4j2mqbhZSSzR1Ah79EYwSn9Zuh7lrlGD2cVGzw1RKGzyLSg=="
         }
       }
     },
@@ -8109,15 +8404,30 @@
       "resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-1.1.0.tgz",
       "integrity": "sha1-1upkmUx5+XtipytCb75gVqGUu5A=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.1.0.tgz",
+          "integrity": "sha1-CcIC1ckX7CMYjKpcnLkXnNlUd1A="
+        },
+        "chalk": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.0.1.tgz",
+          "integrity": "sha512-Mp+FXEI+FrwY/XYV45b2YD3E8i3HwnEAoFcM0qlZzq/RZ9RwWitt2Y/c7cqRAz70U7hfekqx6qNYthuKFO6K0g=="
+        },
+        "has-flag": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
+          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
+        },
         "postcss": {
-          "version": "6.0.2",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.2.tgz",
-          "integrity": "sha1-XE/qWJ8Kw7AMqnWxy8OihBlbfl0="
+          "version": "6.0.6",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.6.tgz",
+          "integrity": "sha1-u6TVjohPx4yEDRU54Q7dqruPc70="
         },
         "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "version": "4.2.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.0.tgz",
+          "integrity": "sha512-Ts0Mu/A1S1aZxEJNG88I4Oc9rcZSBFNac5e27yh4j2mqbhZSSzR1Ah79EYwSn9Zuh7lrlGD2cVGzw1RKGzyLSg=="
         }
       }
     },
@@ -8126,15 +8436,30 @@
       "resolved": "https://registry.npmjs.org/postcss-modules-values/-/postcss-modules-values-1.3.0.tgz",
       "integrity": "sha1-7P+p1+GSUYOJ9CrQ6D9yrsRW6iA=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.1.0.tgz",
+          "integrity": "sha1-CcIC1ckX7CMYjKpcnLkXnNlUd1A="
+        },
+        "chalk": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.0.1.tgz",
+          "integrity": "sha512-Mp+FXEI+FrwY/XYV45b2YD3E8i3HwnEAoFcM0qlZzq/RZ9RwWitt2Y/c7cqRAz70U7hfekqx6qNYthuKFO6K0g=="
+        },
+        "has-flag": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
+          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
+        },
         "postcss": {
-          "version": "6.0.2",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.2.tgz",
-          "integrity": "sha1-XE/qWJ8Kw7AMqnWxy8OihBlbfl0="
+          "version": "6.0.6",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.6.tgz",
+          "integrity": "sha1-u6TVjohPx4yEDRU54Q7dqruPc70="
         },
         "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "version": "4.2.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.0.tgz",
+          "integrity": "sha512-Ts0Mu/A1S1aZxEJNG88I4Oc9rcZSBFNac5e27yh4j2mqbhZSSzR1Ah79EYwSn9Zuh7lrlGD2cVGzw1RKGzyLSg=="
         }
       }
     },
@@ -8436,21 +8761,14 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         }
       }
     },
@@ -8480,21 +8798,14 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         }
       }
     },
@@ -8649,21 +8960,14 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         }
       }
     },
@@ -8758,9 +9062,9 @@
       "integrity": "sha1-Gc5QLKVyZl87ZHsQk5+X/RYV8QI="
     },
     "safe-buffer": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.0.tgz",
-      "integrity": "sha512-aSLEDudu6OoRr/2rU609gRmnYboRLxgDG1z9o2Q0os7236FwvcqIOO8r8U5JUEwivZOhDaKlFO4SbPTJYyBEyQ=="
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.1.tgz",
+      "integrity": "sha512-kKvNJn6Mm93gAczWVJg7wH+wGYWNrDHdWvpUmHyEsgCtIwwo3bqPtV4tR5tuPaUhTOo/kvhVwd8XwwOllGYkbg=="
     },
     "samsam": {
       "version": "1.1.2",
@@ -8795,9 +9099,9 @@
       "integrity": "sha512-c3/Zc+iW+qqDip6kXPYLEgsAu2lf4xz0EZDplB7EmSUMda12U1sGJPetH55B/j9eu0bTtKzKlNPWWyYC7wFNyQ==",
       "dependencies": {
         "async": {
-          "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
-          "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c="
+          "version": "2.5.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
+          "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw=="
         },
         "loader-utils": {
           "version": "1.1.0",
@@ -8838,6 +9142,18 @@
       "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz",
       "integrity": "sha1-Yl2GWPhlr0Psliv8N2o3NZpJlMo="
     },
+    "selfsigned": {
+      "version": "1.9.1",
+      "resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-1.9.1.tgz",
+      "integrity": "sha1-zdpEktcNSGVw+HxlVGAjVY4d+lo=",
+      "dependencies": {
+        "node-forge": {
+          "version": "0.6.33",
+          "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.6.33.tgz",
+          "integrity": "sha1-RjgRh59XPUUVWtap9D3ClujoXrw="
+        }
+      }
+    },
     "semver": {
       "version": "5.3.0",
       "resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz",
@@ -9232,21 +9548,14 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         }
       }
     },
@@ -9288,21 +9597,14 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         }
       }
     },
@@ -9337,21 +9639,14 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         }
       }
     },
@@ -9470,9 +9765,9 @@
           "integrity": "sha1-XJZ93YN6m/3KXy3oQlOr6KHAO4A="
         },
         "sax": {
-          "version": "1.2.2",
-          "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.2.tgz",
-          "integrity": "sha1-/YYxojvHgmvvXYcb24c3jJVkeCg="
+          "version": "1.2.4",
+          "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz",
+          "integrity": "sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw=="
         }
       }
     },
@@ -9532,21 +9827,14 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         }
       }
     },
@@ -9560,6 +9848,11 @@
       "resolved": "https://registry.npmjs.org/through2-filter/-/through2-filter-2.0.0.tgz",
       "integrity": "sha1-YLxVoNrLdghdsfna6Zq0P4PWIuw="
     },
+    "thunky": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/thunky/-/thunky-0.1.0.tgz",
+      "integrity": "sha1-vzAUaCTituZ7Dy16Ssi+smkIaE4="
+    },
     "tildify": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/tildify/-/tildify-1.2.0.tgz",
@@ -9661,11 +9954,6 @@
       "resolved": "https://registry.npmjs.org/to-arraybuffer/-/to-arraybuffer-1.0.1.tgz",
       "integrity": "sha1-fSKbH8xjfkZsoIEYCDanqr/4P0M="
     },
-    "to-iso-string": {
-      "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/to-iso-string/-/to-iso-string-0.0.2.tgz",
-      "integrity": "sha1-TcGeZk38y+Jb2NtQiwDG2hWCVdE="
-    },
     "tough-cookie": {
       "version": "2.3.2",
       "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.2.tgz",
@@ -9682,14 +9970,14 @@
       "integrity": "sha1-jbAWIuh35RuDFAyu58gIZK05DII="
     },
     "ts-loader": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/ts-loader/-/ts-loader-2.1.0.tgz",
-      "integrity": "sha1-Wo78xccsBvxJ1putachWF8YZT3c=",
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/ts-loader/-/ts-loader-2.2.2.tgz",
+      "integrity": "sha512-HiusedxruMeHN1/BzpijS/rXSdup2P/IopamX235tLS3OuPU+eSXNyN3YgbHKzYEe71YkUhnm7X+VY4oOAGLtg==",
       "dependencies": {
         "enhanced-resolve": {
-          "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz",
-          "integrity": "sha1-n0tib1dyRe3PSyrYPYbhf09CHew="
+          "version": "3.3.0",
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.3.0.tgz",
+          "integrity": "sha512-2qbxE7ek3YxPJ1ML6V+satHkzHpJQKWkRHmRx6mfAoW59yP8YH8BFplbegSP+u2hBd6B6KCOpvJQ3dZAP+hkpg=="
         },
         "loader-utils": {
           "version": "1.1.0",
@@ -9784,9 +10072,9 @@
       "integrity": "sha1-YGAiUIR5tV/6NotY/uljoD39eww="
     },
     "ua-parser-js": {
-      "version": "0.7.12",
-      "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.12.tgz",
-      "integrity": "sha1-BMgamb3V3FImPqKdJMa/jUgYpLs="
+      "version": "0.7.13",
+      "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.13.tgz",
+      "integrity": "sha1-zZ3S+GSTs/RNvu7zeA/adMXuFL4="
     },
     "uglify-js": {
       "version": "2.8.29",
@@ -9947,9 +10235,9 @@
       "integrity": "sha1-K1viOjK2Onyd640PKNSFcko98ZA="
     },
     "useragent": {
-      "version": "2.1.13",
-      "resolved": "https://registry.npmjs.org/useragent/-/useragent-2.1.13.tgz",
-      "integrity": "sha1-u6Q+iqJNXOuDwpN0c+EC4h33TBA=",
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/useragent/-/useragent-2.2.0.tgz",
+      "integrity": "sha1-74X0GQPP0F4rqMEa5hJJx6a79mM=",
       "dependencies": {
         "lru-cache": {
           "version": "2.2.4",
@@ -10072,6 +10360,11 @@
       "resolved": "https://registry.npmjs.org/vinyl-ftp/-/vinyl-ftp-0.6.0.tgz",
       "integrity": "sha1-L7Q+xNWKLkwGtAblac7ps6pd+Mo=",
       "dependencies": {
+        "clone": {
+          "version": "2.1.1",
+          "resolved": "https://registry.npmjs.org/clone/-/clone-2.1.1.tgz",
+          "integrity": "sha1-0hfR6WERjjrJpLi7oyhVU79kfNs="
+        },
         "clone-stats": {
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-1.0.0.tgz",
@@ -10083,9 +10376,9 @@
           "integrity": "sha1-3mMSg3P8v3w8z6TeWkgMRaZ5WOs="
         },
         "vinyl": {
-          "version": "2.0.2",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-2.0.2.tgz",
-          "integrity": "sha1-CjcT2NTpIhxY8QyhbAEWyeJe2nw="
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-2.1.0.tgz",
+          "integrity": "sha1-Ah+cLPlR1rk5lDyJ617lrdT9kkw="
         }
       }
     },
@@ -10132,9 +10425,9 @@
           "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c="
         },
         "async": {
-          "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.4.1.tgz",
-          "integrity": "sha1-YqVrJ5yYoR0JhwlqAcw+6463u9c="
+          "version": "2.5.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
+          "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw=="
         },
         "camelcase": {
           "version": "3.0.0",
@@ -10152,9 +10445,9 @@
           "integrity": "sha1-NlKgkGq5sqfgw85mpAjpV6JIVSI="
         },
         "enhanced-resolve": {
-          "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.1.0.tgz",
-          "integrity": "sha1-n0tib1dyRe3PSyrYPYbhf09CHew="
+          "version": "3.3.0",
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.3.0.tgz",
+          "integrity": "sha512-2qbxE7ek3YxPJ1ML6V+satHkzHpJQKWkRHmRx6mfAoW59yP8YH8BFplbegSP+u2hBd6B6KCOpvJQ3dZAP+hkpg=="
         },
         "https-browserify": {
           "version": "0.0.1",
@@ -10177,21 +10470,14 @@
           "integrity": "sha1-Y/xMzuXS13Y9Jrv4YBB45sLgBE8="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg==",
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ==",
           "dependencies": {
             "string_decoder": {
-              "version": "1.0.2",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-              "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-              "dependencies": {
-                "safe-buffer": {
-                  "version": "5.0.1",
-                  "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-                  "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-                }
-              }
+              "version": "1.0.3",
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+              "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
             }
           }
         },
@@ -10255,9 +10541,9 @@
       "integrity": "sha1-i2JAwpqdY7xy8J2SD7BQrbzOn+g=",
       "dependencies": {
         "acorn": {
-          "version": "5.0.3",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.0.3.tgz",
-          "integrity": "sha1-xGDfCEkUY/AozLguqzcwvwEIez0="
+          "version": "5.1.1",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.1.1.tgz",
+          "integrity": "sha512-vOk6uEMctu0vQrvuSqFdJyqj1Q0S5VTDL79qtjo+DhRr+1mmaD+tluFSCZqhvi/JUhXSzoZN2BhtstaPEeE8cw=="
         },
         "etag": {
           "version": "1.8.0",
@@ -10324,20 +10610,42 @@
       }
     },
     "webpack-dev-middleware": {
-      "version": "1.10.2",
-      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-1.10.2.tgz",
-      "integrity": "sha1-LiUs4d+wINvaHMs33ybzCrAU29E="
+      "version": "1.11.0",
+      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-1.11.0.tgz",
+      "integrity": "sha1-CWkdCXOjCtH4Ksc6EuIIfwpHVPk="
     },
     "webpack-dev-server": {
-      "version": "2.4.5",
-      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.4.5.tgz",
-      "integrity": "sha1-MThM6BE2vhCAtLTN4OubkOVO5s8=",
+      "version": "2.5.1",
+      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.5.1.tgz",
+      "integrity": "sha1-oC5yaoe7YD211xq7fW0mSb8Qx2k=",
       "dependencies": {
         "camelcase": {
           "version": "3.0.0",
           "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
           "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
         },
+        "del": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/del/-/del-3.0.0.tgz",
+          "integrity": "sha1-U+z2mf/LyzljdpGrE7rxYIGXZuU="
+        },
+        "globby": {
+          "version": "6.1.0",
+          "resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
+          "integrity": "sha1-9abXDoOV4hyFj7BInWTfAkJNUGw=",
+          "dependencies": {
+            "pify": {
+              "version": "2.3.0",
+              "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+              "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
+            }
+          }
+        },
+        "pify": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
+          "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY="
+        },
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
@@ -10467,9 +10775,9 @@
           "integrity": "sha1-Y/xMzuXS13Y9Jrv4YBB45sLgBE8="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.0.tgz",
-          "integrity": "sha512-c7KMXGd4b48nN3OJ1U9qOsn6pXNzf6kLd3kdZCkg2sxAcoiufInqF0XckwEnlrcwuaYwonlNK8GQUIOC/WC7sg=="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
         "stream-browserify": {
           "version": "2.0.1",
@@ -10477,16 +10785,9 @@
           "integrity": "sha1-ZiZu5fm9uZQKTkUUyvtDu3Hlyds="
         },
         "string_decoder": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-          "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-              "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-            }
-          }
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         },
         "supports-color": {
           "version": "3.2.3",
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 88cbd42c37de0..de4dc972bc1e6 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -17,14 +17,14 @@
   },
   "devDependencies": {
     "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
-    "@types/chai": "^3.4.35",
-    "@types/enzyme": "^2.7.5",
+    "@types/chai": "3.4.35",
+    "@types/enzyme": "2.8.0",
     "@types/es6-promise": "^0.0.32",
-    "@types/mocha": "^2.2.39",
-    "@types/react": "^15.0.25",
-    "@types/react-addons-test-utils": "^0.14.18",
-    "@types/react-dom": "^15.5.0",
-    "@types/webpack-env": "^1.13.0",
+    "@types/mocha": "2.2.39",
+    "@types/react": "15.0.29",
+    "@types/react-addons-test-utils": "0.14.18",
+    "@types/react-dom": "15.5.0",
+    "@types/webpack-env": "1.13.0",
     "css-loader": "^0.28.0",
     "enzyme": "^2.7.0",
     "es6-promise": "^4.1.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 3924e345ca83b..cef46e0439b17 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -13,14 +13,14 @@
   "devDependencies": {
     "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@types/chai": "^3.4.35",
-    "@types/enzyme": "^2.7.5",
+    "@types/chai": "3.4.35",
+    "@types/enzyme": "2.8.0",
     "@types/es6-promise": "^0.0.32",
-    "@types/mocha": "^2.2.39",
-    "@types/react": "^15.0.25",
-    "@types/react-addons-test-utils": "^0.14.18",
-    "@types/react-dom": "^15.5.0",
-    "@types/webpack-env": "^1.13.0",
+    "@types/mocha": "2.2.39",
+    "@types/react": "15.0.29",
+    "@types/react-addons-test-utils": "0.14.18",
+    "@types/react-dom": "15.5.0",
+    "@types/webpack-env": "1.13.0",
     "@uifabric/example-app-base": "4.0.1",
     "@uifabric/utilities": "4.7.0",
     "autoprefixer": "^6.7.6",
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index dce3575c7ccd6..8bc79ef4a5f18 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -18,17 +18,17 @@
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
-    "@types/chai": "^3.4.35",
-    "@types/enzyme": "^2.7.5",
+    "@types/chai": "3.4.35",
+    "@types/enzyme": "2.8.0",
     "@types/es6-promise": "^0.0.32",
-    "@types/mocha": "^2.2.39",
-    "@types/prop-types": "^15.5.1",
-    "@types/react": "^15.0.25",
-    "@types/react-addons-test-utils": "^0.14.18",
-    "@types/react-dom": "^15.5.0",
+    "@types/mocha": "2.2.39",
+    "@types/prop-types": "15.5.1",
+    "@types/react": "15.0.29",
+    "@types/react-addons-test-utils": "0.14.18",
+    "@types/react-dom": "15.5.0",
     "@types/resemblejs": "~1.3.28",
-    "@types/sinon": "^2.2.2",
-    "@types/webpack-env": "^1.13.0",
+    "@types/sinon": "2.2.2",
+    "@types/webpack-env": "1.13.0",
     "@uifabric/example-app-base": "4.0.1",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index 38d794bc2aba4..8198c4964fbf3 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -16,7 +16,7 @@ import { GroupSpacer } from '../GroupedList/GroupSpacer';
 import { DetailsRowFields } from './DetailsRowFields';
 import { FocusZone, FocusZoneDirection, IFocusZone } from '../../FocusZone';
 import { ISelection, SelectionMode, SELECTION_CHANGE } from '../../utilities/selection/interfaces';
-import { CollapseAllVisibility } from '../GroupedList';
+import { CollapseAllVisibility } from '../../GroupedList';
 import {
   IDragDropHelper,
   IDragDropEvents,
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 6bf4c4f42befe..af9d290053c0b 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -446,8 +446,8 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
     do {
       element = isForward ?
-        getNextElement(this.refs.root, element, undefined, undefined, undefined, undefined, true) :
-        getPreviousElement(this.refs.root, element, undefined, undefined, undefined, undefined, true);
+        getNextElement(this.refs.root, element) :
+        getPreviousElement(this.refs.root, element);
 
       if (isBidirectional) {
         if (element) {
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 0a87a67baa22f..32ab02798ada4 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -13,13 +13,13 @@
     "@microsoft/sp-build-web": "~1.0.0",
     "@microsoft/sp-module-interfaces": "~1.0.0",
     "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
-    "@types/chai": "^3.4.35",
-    "@types/enzyme": "^2.7.5",
-    "@types/mocha": "^2.2.39",
-    "@types/react": "^15.0.25",
-    "@types/react-addons-test-utils": "^0.14.18",
-    "@types/react-dom": "^15.5.0",
-    "@types/webpack-env": "^1.13.0",
+    "@types/chai": "3.4.35",
+    "@types/enzyme": "2.8.0",
+    "@types/mocha": "2.2.39",
+    "@types/react": "15.0.29",
+    "@types/react-addons-test-utils": "0.14.18",
+    "@types/react-dom": "15.5.0",
+    "@types/webpack-env": "1.13.0",
     "@uifabric/example-app-base": ">=1.3.12 <2.0.0",
     "chai": "^3.5.0",
     "enzyme": "^2.7.0",
diff --git a/packages/utilities/api/utilities.api.ts b/packages/utilities/api/utilities.api.ts
index 3e079867434c4..1ee306fd0d1a3 100644
--- a/packages/utilities/api/utilities.api.ts
+++ b/packages/utilities/api/utilities.api.ts
@@ -1,3 +1,4 @@
+// @public
 export function assign(target: any, ...args: any[]): any;
 
 // WARNING: dispose has incomplete type information
@@ -5,9 +6,8 @@ export function assign(target: any, ...args: any[]): any;
 // WARNING: clearInterval has incomplete type information
 // WARNING: cancelAnimationFrame has incomplete type information
 // WARNING: _logError has incomplete type information
-// (undocumented)
+// @public
 class Async {
-  // (undocumented)
   constructor(parent?: any, onError?: (e: any) => void);
   public clearTimeout(id: number): void;
   public debounce < T extends Function >(func: T, wait?: number, options?: {
@@ -27,8 +27,8 @@ class Async {
 }
 
 // WARNING: dispose has incomplete type information
+// @public
 class AutoScroll {
-  // (undocumented)
   constructor(element: HTMLElement);
 }
 
@@ -39,7 +39,7 @@ class AutoScroll {
 // WARNING: _updateComponentRef has incomplete type information
 // WARNING: _warnDeprecations has incomplete type information
 // WARNING: _warnMutuallyExclusive has incomplete type information
-// (undocumented)
+// @public
 class BaseComponent<P extends IBaseProps, S> extends React.Component<P, S> {
   constructor(props?: P, context?: any);
   protected readonly _async: Async;
@@ -50,12 +50,15 @@ class BaseComponent<P extends IBaseProps, S> extends React.Component<P, S> {
   public static onError: ((errorMessage?: string, ex?: any) => void);
 }
 
+// @public
+export function createArray(size: number, getItem?: (index?: number) => any): any[];
+
 // WARNING: contextTypes has incomplete type information
 // WARNING: childContextTypes has incomplete type information
 // WARNING: componentWillReceiveProps has incomplete type information
 // WARNING: render has incomplete type information
+// @public
 class Customizer extends BaseComponent<ICustomizerProps, ICustomizerState> {
-  // (undocumented)
   constructor(props: any, context: any);
   // (undocumented)
   public getChildContext(): any;
@@ -65,11 +68,12 @@ class Customizer extends BaseComponent<ICustomizerProps, ICustomizerState> {
 // WARNING: componentDidMount has incomplete type information
 // WARNING: componentWillUnmount has incomplete type information
 // WARNING: render has incomplete type information
+// @public
 class DelayedRender extends React.Component<IDelayedRenderProps, IDelayedRenderState> {
-  // (undocumented)
   constructor(props: IDelayedRenderProps);
 }
 
+// @public
 export function elementContains(parent: HTMLElement | null, child: HTMLElement | null, allowVirtualParents: boolean = true): boolean;
 
 // WARNING: raise has incomplete type information
@@ -79,6 +83,7 @@ export function elementContains(parent: HTMLElement | null, child: HTMLElement |
 // WARNING: on has incomplete type information
 // WARNING: off has incomplete type information
 // WARNING: declare has incomplete type information
+// @public
 class EventGroup {
   public constructor(parent: any);
   public static isDeclared(target: any, eventName: string): boolean;
@@ -88,7 +93,7 @@ class EventGroup {
 
 // WARNING: measure has incomplete type information
 // WARNING: reset has incomplete type information
-// (undocumented)
+// @public
 class FabricPerformance {
   // (undocumented)
   public static setPeriodicReset(): void;
@@ -96,36 +101,44 @@ class FabricPerformance {
   public static summary: IPerfSummary;
 }
 
-// (undocumented)
+// @public
 export function findIndex(array: any[], cb: (item: any, index?: number) => boolean): number;
 
+// @public
 export function findScrollableParent(startingElement: HTMLElement): HTMLElement | null;
 
+// @public
 export function focusFirstChild(rootElement: HTMLElement): boolean;
 
+// @public
 export function format(s: string, ...values: any[]): string;
 
-// (undocumented)
+// @public
 export function getDistanceBetweenPoints(point1: IPoint, point2: IPoint): number;
 
-// (undocumented)
+// @public
 export function getFirstFocusable(rootElement: HTMLElement,
   currentElement: HTMLElement,
   includeElementsInFocusZones?: boolean): HTMLElement | null;
 
+// @public
 export function getId(prefix?: string): string;
 
+// @public
 export function getInitials(displayName: string | undefined | null, isRtl: boolean): string;
 
+// @public
 export function getLanguage(): string | null;
 
-// (undocumented)
+// @public
 export function getLastFocusable(rootElement: HTMLElement,
   currentElement: HTMLElement,
   includeElementsInFocusZones?: boolean): HTMLElement | null;
 
+// @public
 export function getNativeProps < T >(props: any, allowedPropNames: string[], excludedPropNames?: string[]): T;
 
+// @public
 export function getNextElement(rootElement: HTMLElement,
   currentElement: HTMLElement | null,
   checkNode?: boolean,
@@ -134,8 +147,10 @@ export function getNextElement(rootElement: HTMLElement,
   includeElementsInFocusZones?: boolean,
   allowFocusRoot?: boolean): HTMLElement | null;
 
+// @public
 export function getParent(child: HTMLElement, allowVirtualParents: boolean = true): HTMLElement | null;
 
+// @public
 export function getPreviousElement(rootElement: HTMLElement,
   currentElement: HTMLElement | null,
   checkNode?: boolean,
@@ -144,15 +159,19 @@ export function getPreviousElement(rootElement: HTMLElement,
   includeElementsInFocusZones?: boolean,
   allowFocusRoot?: boolean): HTMLElement | null;
 
+// @public
 export function getRect(element: HTMLElement | Window | null): IRectangle | undefined;
 
+// @public
 export function getRTL(): boolean;
 
+// @public
 export function getRTLSafeKeyCode(key: number): number;
 
+// @public
 export function getScrollbarWidth(): number;
 
-// (undocumented)
+// @public
 export function getVirtualParent(child: HTMLElement): HTMLElement | undefined;
 
 // @public
@@ -167,15 +186,19 @@ class GlobalSettings {
   public static setValue < T >(key: string, value: T): void;
 }
 
+// @public
 export function hasHorizontalOverflow(element: HTMLElement): boolean;
 
+// @public
 export function hasOverflow(element: HTMLElement): boolean;
 
+// @public
 export function hasVerticalOverflow(element: HTMLElement): boolean;
 
+// @public
 export function hoistMethods(destination: any, source: any, exclusions: string[] = REACT_LIFECYCLE_EXCLUSIONS): string[];
 
-// (undocumented)
+// @public
 interface IBaseProps {
   // (undocumented)
   componentRef?: any;
@@ -199,47 +222,52 @@ interface IChangeEventCallback {
   (changeDescription?: IChangeDescription): void;
 }
 
-// (undocumented)
+// @public
 interface ICustomizerProps {
   // (undocumented)
   settings: ISettings;
 }
 
-// (undocumented)
+// WARNING: Because this definition is explicitly marked as @internal, an underscore prefix ("_") should be added to its name
+// @internal
 interface ICustomizerState {
   // (undocumented)
   injectedProps?: ISettings;
 }
 
-// (undocumented)
+// WARNING: Because this definition is explicitly marked as @internal, an underscore prefix ("_") should be added to its name
+// @internal
 interface IDeclaredEventsByName {
   // (undocumented)
   [ eventName: string ]: boolean;
 }
 
-// (undocumented)
+// @public
 interface IDelayedRenderProps extends React.Props<any> {
   delay?: number;
 }
 
-// (undocumented)
+// WARNING: Because this definition is explicitly marked as @internal, an underscore prefix ("_") should be added to its name
+// @internal
 interface IDelayedRenderState {
   isRendered: boolean;
 }
 
-// (undocumented)
+// WARNING: Because this definition is explicitly marked as @internal, an underscore prefix ("_") should be added to its name
+// @internal
 interface IDictionary {
   // (undocumented)
   [ className: string ]: boolean;
 }
 
-// (undocumented)
+// @public
 interface IDisposable {
   // (undocumented)
   dispose: () => void;
 }
 
-// (undocumented)
+// WARNING: Because this definition is explicitly marked as @internal, an underscore prefix ("_") should be added to its name
+// @internal
 interface IEventRecord {
   // (undocumented)
   callback: (args?: any) => void;
@@ -257,7 +285,8 @@ interface IEventRecord {
   useCapture: boolean;
 }
 
-// (undocumented)
+// WARNING: Because this definition is explicitly marked as @internal, an underscore prefix ("_") should be added to its name
+// @internal
 interface IEventRecordList {
   // (undocumented)
   [ id: string ]: IEventRecord[] | number;
@@ -265,13 +294,15 @@ interface IEventRecordList {
   count: number;
 }
 
-// (undocumented)
+// WARNING: Because this definition is explicitly marked as @internal, an underscore prefix ("_") should be added to its name
+// @internal
 interface IEventRecordsByName {
   // (undocumented)
   [ eventName: string ]: IEventRecordList;
 }
 
-// (undocumented)
+// WARNING: Because this definition is explicitly marked as @internal, an underscore prefix ("_") should be added to its name
+// @internal
 interface IPerfData {
   // (undocumented)
   duration: number;
@@ -279,7 +310,8 @@ interface IPerfData {
   timeStamp: number;
 }
 
-// (undocumented)
+// WARNING: Because this definition is explicitly marked as @internal, an underscore prefix ("_") should be added to its name
+// @internal
 interface IPerfMeasurement {
   // (undocumented)
   all: IPerfData[];
@@ -289,13 +321,14 @@ interface IPerfMeasurement {
   totalDuration: number;
 }
 
-// (undocumented)
+// WARNING: Because this definition is explicitly marked as @internal, an underscore prefix ("_") should be added to its name
+// @internal
 interface IPerfSummary {
   // (undocumented)
   [ key: string ]: IPerfMeasurement;
 }
 
-// (undocumented)
+// @public
 interface IPoint {
   // (undocumented)
   x: number;
@@ -303,7 +336,7 @@ interface IPoint {
   y: number;
 }
 
-// (undocumented)
+// @public
 interface IRectangle {
   // (undocumented)
   bottom?: number;
@@ -319,37 +352,39 @@ interface IRectangle {
   width: number;
 }
 
-// (undocumented)
+// @public
 interface IRenderFunction<P> {
   // (undocumented)
   (props?: P, defaultRender?: (props?: P) => JSX.Element | null): JSX.Element | null;
 }
 
-// (undocumented)
+// @public
 export function isElementFocusSubZone(element?: HTMLElement): boolean;
 
-// (undocumented)
+// @public
 export function isElementFocusZone(element?: HTMLElement): boolean;
 
-// (undocumented)
+// @public
 export function isElementTabbable(element: HTMLElement): boolean;
 
-// (undocumented)
+// @public
 export function isElementVisible(element: HTMLElement | undefined | null): boolean;
 
-// (undocumented)
+// WARNING: Because this definition is explicitly marked as @internal, an underscore prefix ("_") should be added to its name
+// @internal
 interface ISerializableObject {
   // (undocumented)
   toString?: () => string;
 }
 
-// (undocumented)
+// WARNING: Because this definition is explicitly marked as @internal, an underscore prefix ("_") should be added to its name
+// @internal
 interface ISettings {
   // (undocumented)
   [ key: string ]: any;
 }
 
-// (undocumented)
+// @public
 enum KeyCodes {
   // (undocumented)
   a = 65,
@@ -387,14 +422,15 @@ enum KeyCodes {
   up = 38
 }
 
+// @public
 export function memoizeFunction < T extends (...args: any[]) => RET_TYPE, RET_TYPE >(cb: T,
   maxCacheSize: number = 100): T;
 
+// @public
 export function nullRender(): JSX.Element | null;
 
-// (undocumented)
+// @public
 class Rectangle {
-  // (undocumented)
   constructor(left: number = 0, right: number = 0, top: number = 0, bottom: number = 0);
   // (undocumented)
   public bottom: number;
@@ -409,25 +445,32 @@ class Rectangle {
   readonly width: number;
 }
 
+// WARNING: Because this definition is explicitly marked as @internal, an underscore prefix ("_") should be added to its name
+// @internal
 export function setMemoizeWeakMap(weakMap: any): void;
 
+// @public
 export function setWarningCallback(warningCallback?: (message: string) => void): void;
 
+// @public
 export function toMatrix < T >(items: T[], columnCount: number): T[][];
 
+// @public
 export function unhoistMethods(source: any, methodNames: string[]): void;
 
+// @public
 export function warn(message: string): void;
 
+// @public
 export function warnDeprecations < P >(componentName: string,
   props: P,
   deprecationMap: ISettingsMap<P>): void;
 
+// @public
 export function warnMutuallyExclusive < P >(componentName: string,
   props: P,
   exclusiveMap: ISettingsMap<P>): void;
 
-// WARNING: createArray has incomplete type information
 // WARNING: autobind has incomplete type information
 // WARNING: Unsupported export: ICssInput
 // WARNING: css has incomplete type information
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index e75750629b425..d88d036bf278a 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -17,17 +17,17 @@
   },
   "devDependencies": {
     "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
-    "@types/chai": "^3.4.35",
-    "@types/enzyme": "^2.7.5",
+    "@types/chai": "3.4.35",
+    "@types/enzyme": "2.8.0",
     "@types/es6-promise": "^0.0.32",
     "@types/es6-weak-map": "1.2.0",
-    "@types/mocha": "^2.2.39",
-    "@types/prop-types": "^15.5.1",
-    "@types/react": "^15.0.25",
-    "@types/react-addons-test-utils": "^0.14.18",
-    "@types/react-dom": "^15.5.0",
-    "@types/sinon": "^2.2.2",
-    "@types/webpack-env": "^1.13.0",
+    "@types/mocha": "2.2.39",
+    "@types/prop-types": "15.5.1",
+    "@types/react": "15.0.29",
+    "@types/react-addons-test-utils": "0.14.18",
+    "@types/react-dom": "15.5.0",
+    "@types/sinon": "2.2.2",
+    "@types/webpack-env": "1.13.0",
     "enzyme": "^2.7.0",
     "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
diff --git a/packages/utilities/src/Async.ts b/packages/utilities/src/Async.ts
index 1aa995bc28da2..0bdaf69607a33 100644
--- a/packages/utilities/src/Async.ts
+++ b/packages/utilities/src/Async.ts
@@ -1,14 +1,15 @@
+declare function setTimeout(cb: Function, delay: number): number;
+declare function setInterval(cb: Function, delay: number): number;
+
 /**
  * Bugs often appear in async code when stuff gets disposed, but async operations don't get canceled.
  * This Async helper class solves these issues by tying async code to the lifetime of a disposable object.
  *
  * Usage: Anything class extending from BaseModel can access this helper via this.async. Otherwise create a
  * new instance of the class and remember to call dispose() during your code's dispose handler.
+ *
+ * @public
  */
-
-declare function setTimeout(cb: Function, delay: number): number;
-declare function setInterval(cb: Function, delay: number): number;
-
 export class Async {
   private _timeoutIds: any = null;
   private _immediateIds: any = null;
diff --git a/packages/utilities/src/AutoScroll.ts b/packages/utilities/src/AutoScroll.ts
index 40475a6f3b709..67026b12af230 100644
--- a/packages/utilities/src/AutoScroll.ts
+++ b/packages/utilities/src/AutoScroll.ts
@@ -14,6 +14,8 @@ const MAX_SCROLL_VELOCITY = 15;
  * up/down depending on how close the mouse is to the top/bottom of the container.
  *
  * Once you don't want autoscroll any more, just dispose the helper and it will unhook events.
+ *
+ * @public
  */
 export class AutoScroll {
   private _events: EventGroup;
diff --git a/packages/utilities/src/BaseComponent.ts b/packages/utilities/src/BaseComponent.ts
index b4903ecd68c79..cdaabf63843b5 100644
--- a/packages/utilities/src/BaseComponent.ts
+++ b/packages/utilities/src/BaseComponent.ts
@@ -4,10 +4,20 @@ import { EventGroup } from './EventGroup';
 import { IDisposable } from './IDisposable';
 import { warnDeprecations, warnMutuallyExclusive, ISettingsMap } from './warn';
 
+/**
+ * BaseProps interface.
+ *
+ * @public
+ */
 export interface IBaseProps {
   componentRef?: any;
 }
 
+/**
+ * BaseComponent class, which provides basic helpers for all components.
+ *
+ * @public
+ */
 export class BaseComponent<P extends IBaseProps, S> extends React.Component<P, S> {
   /**
    * External consumers should override BaseComponent.onError to hook into error messages that occur from
@@ -239,5 +249,7 @@ BaseComponent.onError = (errorMessage) => {
 
 /**
  * Simple constant function for returning null, used to render empty templates in JSX.
+ *
+ * @public
  */
 export function nullRender(): JSX.Element | null { return null; }
diff --git a/packages/utilities/src/Customizer.tsx b/packages/utilities/src/Customizer.tsx
index 05ad4168cf576..d8bdbc03e1ea1 100644
--- a/packages/utilities/src/Customizer.tsx
+++ b/packages/utilities/src/Customizer.tsx
@@ -2,14 +2,29 @@ import * as React from 'react';
 import * as PropTypes from 'prop-types';
 import { BaseComponent } from './BaseComponent';
 
+/**
+ * Settings interface.
+ *
+ * @internal
+ */
 export interface ISettings {
   [key: string]: any;
 }
 
+/**
+ * Customizer component props.
+ *
+ * @public
+ */
 export interface ICustomizerProps {
   settings: ISettings;
 }
 
+/**
+ * Customizer component state.
+ *
+ * @internal
+ */
 export interface ICustomizerState {
   injectedProps?: ISettings;
 }
@@ -23,6 +38,8 @@ export interface ICustomizerState {
  *
  * Props are provided via the settings prop, which should be a json map which contains 1 or more
  * name/value pairs representing injectable props.
+ *
+ * @public
  */
 export class Customizer extends BaseComponent<ICustomizerProps, ICustomizerState> {
   public static contextTypes = {
diff --git a/packages/utilities/src/DelayedRender.tsx b/packages/utilities/src/DelayedRender.tsx
index 1e151ff49c87b..870cf3f3ec0ba 100644
--- a/packages/utilities/src/DelayedRender.tsx
+++ b/packages/utilities/src/DelayedRender.tsx
@@ -1,5 +1,10 @@
 import * as React from 'react';
 
+/**
+ * DelayedRender component props.
+ *
+ * @public
+ */
 export interface IDelayedRenderProps extends React.Props<any> {
   /**
    * Number of milliseconds to delay rendering children.
@@ -7,6 +12,11 @@ export interface IDelayedRenderProps extends React.Props<any> {
   delay?: number;
 }
 
+/**
+ * DelayedRender component state.
+ *
+ * @internal
+ */
 export interface IDelayedRenderState {
   /**
    * Whether the component is rendered or not.
@@ -18,6 +28,8 @@ export interface IDelayedRenderState {
  * Utility component for delaying the render of a child component after a given delay. This component
  * requires a single child component; don't pass in many components. Wrap multiple components in a DIV
  * if necessary.
+ *
+ * @public
  */
 export class DelayedRender extends React.Component<IDelayedRenderProps, IDelayedRenderState> {
   public static defaultProps = {
diff --git a/packages/utilities/src/EventGroup.ts b/packages/utilities/src/EventGroup.ts
index f5d75ddc7855e..ff8d69ae810b8 100644
--- a/packages/utilities/src/EventGroup.ts
+++ b/packages/utilities/src/EventGroup.ts
@@ -1,5 +1,10 @@
 /* tslint:disable:no-string-literal */
 
+/**
+ * EventRecord interface.
+ *
+ * @internal
+ */
 export interface IEventRecord {
   target: any;
   eventName: string;
@@ -10,15 +15,30 @@ export interface IEventRecord {
   useCapture: boolean;
 }
 
+/**
+ * EventRecordsByName interface.
+ *
+ * @internal
+ */
 export interface IEventRecordsByName {
   [eventName: string]: IEventRecordList;
 }
 
+/**
+ * EventRecordList interface.
+ *
+ * @internal
+ */
 export interface IEventRecordList {
   [id: string]: IEventRecord[] | number;
   count: number;
 }
 
+/**
+ * DeclaredEventsByName interface.
+ *
+ * @internal
+ */
 export interface IDeclaredEventsByName {
   [eventName: string]: boolean;
 }
@@ -30,6 +50,8 @@ export interface IDeclaredEventsByName {
  *  HTMLElement, the event gets raised and is handled by the browser. Otherwise, it gets
  *  handled here in EventGroup, and the handler is called in the context of the parent
  *  (which is passed in in the constructor).
+ *
+ * @public
  */
 export class EventGroup {
   private static _uniqueId = 0;
@@ -42,6 +64,7 @@ export class EventGroup {
    *  Events raised here by default have bubbling set to false and cancelable set to true.
    *  This applies also to built-in events being raised manually here on HTMLElements,
    *  which may lead to unexpected behavior if it differs from the defaults.
+   *
    */
   public static raise(
     target: any,
diff --git a/packages/utilities/src/FabricPerformance.ts b/packages/utilities/src/FabricPerformance.ts
index 58e655fe244d2..f315ef27661af 100644
--- a/packages/utilities/src/FabricPerformance.ts
+++ b/packages/utilities/src/FabricPerformance.ts
@@ -1,14 +1,29 @@
+/**
+ * PerfData interface.
+ *
+ * @internal
+ */
 export interface IPerfData {
   duration: number;
   timeStamp: number;
 }
 
+/**
+ * PerfMeasurement interface.
+ *
+ * @internal
+ */
 export interface IPerfMeasurement {
   totalDuration: number;
   count: number;
   all: IPerfData[];
 }
 
+/**
+ * PerfSummary interface.
+ *
+ * @internal
+ */
 export interface IPerfSummary {
   [key: string]: IPerfMeasurement;
 }
@@ -17,6 +32,11 @@ const now: () => number = () => (typeof performance !== 'undefined' && !!perform
 
 const RESET_INTERVAL = 3 * 60 * 1000; // auto reset every 3 minutes
 
+/**
+ * Performance helper class for measuring things.
+ *
+ * @public
+ */
 export class FabricPerformance {
   public static summary: IPerfSummary = {};
   private static _timeoutId: number;
diff --git a/packages/utilities/src/IDisposable.ts b/packages/utilities/src/IDisposable.ts
index f896655a0e9f3..c15809ce3a81c 100644
--- a/packages/utilities/src/IDisposable.ts
+++ b/packages/utilities/src/IDisposable.ts
@@ -1,3 +1,8 @@
+/**
+ * Disposable interface.
+ *
+ * @public
+ */
 export interface IDisposable {
   dispose: () => void;
 }
diff --git a/packages/utilities/src/IPoint.ts b/packages/utilities/src/IPoint.ts
index 79f682edcb744..f5b0c51a40e1a 100644
--- a/packages/utilities/src/IPoint.ts
+++ b/packages/utilities/src/IPoint.ts
@@ -1,3 +1,8 @@
+/**
+ * Point interface.
+ *
+ * @public
+ */
 export interface IPoint {
   x: number;
   y: number;
diff --git a/packages/utilities/src/IRectangle.ts b/packages/utilities/src/IRectangle.ts
index b13b19a8b303f..19b0dbb4c98f1 100644
--- a/packages/utilities/src/IRectangle.ts
+++ b/packages/utilities/src/IRectangle.ts
@@ -1,3 +1,8 @@
+/**
+ * Rectangle interface.
+ *
+ * @public
+ */
 export interface IRectangle {
   left: number;
   top: number;
diff --git a/packages/utilities/src/IRenderFunction.ts b/packages/utilities/src/IRenderFunction.ts
index 86e438c46363c..96cfa1b325602 100644
--- a/packages/utilities/src/IRenderFunction.ts
+++ b/packages/utilities/src/IRenderFunction.ts
@@ -1,3 +1,8 @@
+/**
+ * Render function interface for providing overrideable render callbacks.
+ *
+ * @public
+ */
 export interface IRenderFunction<P> {
   (props?: P, defaultRender?: (props?: P) => JSX.Element | null): JSX.Element | null;
 }
diff --git a/packages/utilities/src/KeyCodes.ts b/packages/utilities/src/KeyCodes.ts
index 68b046cb44def..486a7e4ddd287 100644
--- a/packages/utilities/src/KeyCodes.ts
+++ b/packages/utilities/src/KeyCodes.ts
@@ -1,4 +1,9 @@
-export enum KeyCodes {
+/**
+ * Const enum for keycodes.
+ *
+ * @public
+ */
+export const enum KeyCodes {
   a = 65,
   backspace = 8,
   comma = 188,
diff --git a/packages/utilities/src/Rectangle.ts b/packages/utilities/src/Rectangle.ts
index d5b3762321d19..9cddefcddebf4 100644
--- a/packages/utilities/src/Rectangle.ts
+++ b/packages/utilities/src/Rectangle.ts
@@ -1,3 +1,8 @@
+/**
+ * Rectangle helper class.
+ *
+ * @public
+ */
 export class Rectangle {
   public top: number;
   public bottom: number;
diff --git a/packages/utilities/src/array.ts b/packages/utilities/src/array.ts
index cd487b59b8c4e..812d8d2f0170b 100644
--- a/packages/utilities/src/array.ts
+++ b/packages/utilities/src/array.ts
@@ -1,3 +1,11 @@
+/**
+ * Helper to find the index of an item within an array, using a callback to
+ * determine the match.
+ *
+ * @public
+ * @param array - Array to search.
+ * @param cb - Callback which returns true on matches.
+ */
 export function findIndex(array: any[], cb: (item: any, index?: number) => boolean): number {
   let index = -1;
 
@@ -11,11 +19,18 @@ export function findIndex(array: any[], cb: (item: any, index?: number) => boole
   return index;
 }
 
-export function createArray(size: number, getItem: (index?: number) => any) {
+/**
+ * Creates an array of a given size and helper method to populate.
+ *
+ * @public
+ * @param size - Size of array.
+ * @param getItem - Callback to populate given cell index.
+ */
+export function createArray(size: number, getItem?: (index?: number) => any): any[] {
   let array = [];
 
   for (let i = 0; i < size; i++) {
-    array.push(getItem(i));
+    array.push(getItem ? getItem(i) : null);
   }
 
   return array;
@@ -23,7 +38,9 @@ export function createArray(size: number, getItem: (index?: number) => any) {
 
 /**
  * Convert the given array to a matrix with columnCount number
- * of columns
+ * of columns.
+ *
+ * @public
  * @param items - The array to convert
  * @param columnCount - The number of columns for the resulting matrix
  * @returns {any[][]} - A matrix of items
diff --git a/packages/utilities/src/css.ts b/packages/utilities/src/css.ts
index e16c39e8d1e07..1051e52c23441 100644
--- a/packages/utilities/src/css.ts
+++ b/packages/utilities/src/css.ts
@@ -1,14 +1,33 @@
-
+/**
+ * Dictionary of booleans.
+ *
+ * @internal
+ */
 export interface IDictionary {
   [className: string]: boolean;
 }
 
+/**
+ * Serializable object.
+ *
+ * @internal
+ */
 export interface ISerializableObject {
   toString?: () => string;
 }
 
+/**
+ * css input type.
+ *
+ * @internal
+ */
 export type ICssInput = string | ISerializableObject | IDictionary | null | undefined | boolean;
 
+/**
+ * Concatination helper, which can merge class names together. Skips over falsey values.
+ *
+ * @public
+ */
 export function css(...args: ICssInput[]) {
   let classes = [];
 
diff --git a/packages/utilities/src/dom.ts b/packages/utilities/src/dom.ts
index c87ad16e26b6e..84b7bad3bb49b 100644
--- a/packages/utilities/src/dom.ts
+++ b/packages/utilities/src/dom.ts
@@ -14,6 +14,8 @@ interface IVirtualElement extends HTMLElement {
 /**
  * Sets the virtual parent of an element.
  * Pass `undefined` as the `parent` to clear the virtual parent.
+ *
+ * @public
  */
 export function setVirtualParent(child: HTMLElement, parent: HTMLElement) {
   let virtualChild = <IVirtualElement>child;
@@ -49,6 +51,11 @@ export function setVirtualParent(child: HTMLElement, parent: HTMLElement) {
   }
 }
 
+/**
+ * Gets the virtual parent given the child element, if it exists.
+ *
+ * @public
+ */
 export function getVirtualParent(child: HTMLElement): HTMLElement | undefined {
   let parent: HTMLElement | undefined;
 
@@ -63,6 +70,8 @@ export function getVirtualParent(child: HTMLElement): HTMLElement | undefined {
  * Gets the element which is the parent of a given element.
  * If `allowVirtuaParents` is `true`, this method prefers the virtual parent over
  * real DOM parent when present.
+ *
+ * @public
  */
 export function getParent(child: HTMLElement, allowVirtualParents: boolean = true): HTMLElement | null {
   return child && (
@@ -75,6 +84,8 @@ export function getParent(child: HTMLElement, allowVirtualParents: boolean = tru
  * Determines whether or not a parent element contains a given child element.
  * If `allowVirtualParents` is true, this method may return `true` if the child
  * has the parent in its virtual element hierarchy.
+ *
+ * @public
  */
 export function elementContains(parent: HTMLElement | null, child: HTMLElement | null, allowVirtualParents: boolean = true): boolean {
   let isContained = false;
@@ -105,12 +116,18 @@ let _isSSR = false;
 
 /**
  * Helper to set ssr mode to simulate no window object returned from getWindow helper.
+ *
+ * @public
  */
 export function setSSR(isEnabled: boolean) {
   _isSSR = isEnabled;
 }
 
-/** Helper to get the window object. */
+/**
+ * Helper to get the window object.
+ *
+ * @public
+ */
 export function getWindow(rootElement?: HTMLElement) {
   if (_isSSR || typeof window === 'undefined') {
     return undefined;
@@ -127,6 +144,8 @@ export function getWindow(rootElement?: HTMLElement) {
 
 /**
  * Helper to get the document object.
+ *
+ * @public
  */
 export function getDocument(rootElement?: HTMLElement) {
   if (_isSSR || typeof document === 'undefined') {
@@ -138,6 +157,8 @@ export function getDocument(rootElement?: HTMLElement) {
 
 /**
  * Helper to get bounding client rect, works with window.
+ *
+ * @public
  */
 export function getRect(element: HTMLElement | Window | null): IRectangle | undefined {
   let rect: IRectangle | undefined;
@@ -162,6 +183,8 @@ export function getRect(element: HTMLElement | Window | null): IRectangle | unde
 
 /**
  * Determines whether or not an element has the virtual hierarchy extension.
+ *
+ * @public
  */
 function isVirtualElement(element: HTMLElement | IVirtualElement): element is IVirtualElement {
   return element && !!(<IVirtualElement>element)._virtual;
diff --git a/packages/utilities/src/focus.ts b/packages/utilities/src/focus.ts
index 9f5c031e4971b..f55feb6e53062 100644
--- a/packages/utilities/src/focus.ts
+++ b/packages/utilities/src/focus.ts
@@ -7,6 +7,11 @@ const IS_VISIBLE_ATTRIBUTE = 'data-is-visible';
 const FOCUSZONE_ID_ATTRIBUTE = 'data-focuszone-id';
 const FOCUSZONE_SUB_ATTRIBUTE = 'data-is-sub-focuszone';
 
+/**
+ * Gets the first focusable element.
+ *
+ * @public
+ */
 export function getFirstFocusable(
   rootElement: HTMLElement,
   currentElement: HTMLElement,
@@ -15,6 +20,11 @@ export function getFirstFocusable(
   return getNextElement(rootElement, currentElement, true, false, false, includeElementsInFocusZones);
 }
 
+/**
+ * Gets the last focusable element.
+ *
+ * @public
+ */
 export function getLastFocusable(
   rootElement: HTMLElement,
   currentElement: HTMLElement,
@@ -25,6 +35,8 @@ export function getLastFocusable(
 
 /**
  * Attempts to focus the first focusable element that is a child or child's child of the rootElement.
+ *
+ * @public
  * @param rootElement - Element to start the search for a focusable child.
  * @returns True if focus was set, false if it was not.
  */
@@ -39,7 +51,11 @@ export function focusFirstChild(
   return false;
 }
 
-/** Traverse to find the previous element. */
+/**
+ * Traverse to find the previous element.
+ *
+ * @public
+ */
 export function getPreviousElement(
   rootElement: HTMLElement,
   currentElement: HTMLElement | null,
@@ -101,7 +117,11 @@ export function getPreviousElement(
   return null;
 }
 
-/** Traverse to find the next focusable element. */
+/**
+ * Traverse to find the next focusable element.
+ *
+ * @public
+ */
 export function getNextElement(
   rootElement: HTMLElement,
   currentElement: HTMLElement | null,
@@ -167,6 +187,11 @@ export function getNextElement(
   return null;
 }
 
+/**
+ * Determines if an element is visible.
+ *
+ * @public
+ */
 export function isElementVisible(element: HTMLElement | undefined | null): boolean {
   // If the element is not valid, return false.
   if (!element || !element.getAttribute) {
@@ -186,6 +211,11 @@ export function isElementVisible(element: HTMLElement | undefined | null): boole
     (element as any).isVisible === true); // used as a workaround for testing.
 }
 
+/**
+ * Determines if an element can receive focus.
+ *
+ * @public
+ */
 export function isElementTabbable(element: HTMLElement): boolean {
 
   // If this element is null or is disabled, it is not considered tabbable.
@@ -220,14 +250,29 @@ export function isElementTabbable(element: HTMLElement): boolean {
     ));
 }
 
+/**
+ * Determines if a given element is a focus zone.
+ *
+ * @public
+ */
 export function isElementFocusZone(element?: HTMLElement): boolean {
   return !!(element && element.getAttribute && !!element.getAttribute(FOCUSZONE_ID_ATTRIBUTE));
 }
 
+/**
+ * Determines if a given element is a focus sub zone.
+ *
+ * @public
+ */
 export function isElementFocusSubZone(element?: HTMLElement): boolean {
   return !!(element && element.getAttribute && element.getAttribute(FOCUSZONE_SUB_ATTRIBUTE) === 'true');
 }
 
+/**
+ * Determines if an element, or any of its children, contain focus.
+ *
+ * @public
+ */
 export function doesElementContainFocus(element: HTMLElement) {
   let document = getDocument(element);
   let currentActiveElement: HTMLElement | undefined = document && document.activeElement as HTMLElement;
diff --git a/packages/utilities/src/hoist.ts b/packages/utilities/src/hoist.ts
index 9724aee142783..3e2ffeb0788c8 100644
--- a/packages/utilities/src/hoist.ts
+++ b/packages/utilities/src/hoist.ts
@@ -13,6 +13,7 @@ const REACT_LIFECYCLE_EXCLUSIONS = [
 /**
  * Allows you to hoist methods, except those in an exclusion set from a source object into a destination object.
  *
+ * @public
  * @param destination - The instance of the object to hoist the methods onto.
  * @param source - The instance of the object where the methods are hoisted from.
  * @param exclusions - (Optional) What methods to exclude from being hoisted.
@@ -39,6 +40,7 @@ export function hoistMethods(destination: any, source: any, exclusions: string[]
 /**
  * Provides a method for convenience to unhoist hoisted methods.
  *
+ * @public
  * @param source - The source object upon which methods were hoisted.
  * @param methodNames - An array of method names to unhoist.
  */
diff --git a/packages/utilities/src/initials.ts b/packages/utilities/src/initials.ts
index 52375a31af6af..5d20fb2dab328 100644
--- a/packages/utilities/src/initials.ts
+++ b/packages/utilities/src/initials.ts
@@ -49,7 +49,11 @@ function cleanupDisplayName(displayName: string): string {
   return displayName;
 }
 
-/** Get (up to 2 characters) initials based on display name of the persona. */
+/**
+ * Get (up to 2 characters) initials based on display name of the persona.
+ *
+ * @public
+ */
 export function getInitials(displayName: string | undefined | null, isRtl: boolean): string {
   if (displayName == null) {
     return '';
diff --git a/packages/utilities/src/language.ts b/packages/utilities/src/language.ts
index 47796ae6c8d7b..380f031d2f8e8 100644
--- a/packages/utilities/src/language.ts
+++ b/packages/utilities/src/language.ts
@@ -5,6 +5,8 @@ let _language: string | null;
 
 /**
  * Gets the rtl state of the page (returns true if in rtl.)
+ *
+ * @public
  */
 export function getLanguage(): string | null {
   if (_language === undefined) {
@@ -34,6 +36,8 @@ export function getLanguage(): string | null {
 
 /**
  * Sets the rtl state of the page (by adjusting the dir attribute of the html element.)
+ *
+ * @public
  */
 export function setLanguage(language: string, avoidPersisting = false): void {
   let doc = getDocument();
diff --git a/packages/utilities/src/math.ts b/packages/utilities/src/math.ts
index 66b17ce754a99..c0449cb83a1b1 100644
--- a/packages/utilities/src/math.ts
+++ b/packages/utilities/src/math.ts
@@ -1,5 +1,9 @@
 import { IPoint } from './IPoint';
-
+/**
+ * Determines the distance between two points.
+ *
+ * @public
+ */
 export function getDistanceBetweenPoints(point1: IPoint, point2: IPoint): number {
   let distance = Math.sqrt(Math.pow(point1.x - point2.x, 2) + Math.pow(point1.y - point2.y, 2));
 
diff --git a/packages/utilities/src/memoize.ts b/packages/utilities/src/memoize.ts
index 765fde6bb5e64..47c453c7a0c20 100644
--- a/packages/utilities/src/memoize.ts
+++ b/packages/utilities/src/memoize.ts
@@ -13,11 +13,22 @@ interface IMemoizeNode {
   value?: any;
 }
 
-/** Test utility for providing a custom weakmap. */
+/**
+ *  Test utility for providing a custom weakmap.
+ *
+ * @internal
+ * */
 export function setMemoizeWeakMap(weakMap: any): void {
   _weakMap = weakMap;
 }
 
+/**
+ * Memoize decorator to be used on class methods. Note that the "this" reference
+ * will be inaccessible within a memoized method, given that a cached method's this
+ * would not be instance specific.
+ *
+ * @public
+ */
 export function memoize<T extends Function>(
   target: any,
   key: string,
@@ -46,6 +57,7 @@ export function memoize<T extends Function>(
  * unintendedly called with unique objects. Without a reset, the cache could grow infinitely, so we safeguard
  * by resetting. To override this behavior, pass a value of 0 to the maxCacheSize parameter.
  *
+ * @public
  * @param cb - The function to memoize.
  * @param maxCacheSize - Max results to cache. If the cache exceeds this value, it will reset on the next call.
  * @returns A memoized version of the function.
diff --git a/packages/utilities/src/object.ts b/packages/utilities/src/object.ts
index 339700c34969f..dce39525a9b5e 100644
--- a/packages/utilities/src/object.ts
+++ b/packages/utilities/src/object.ts
@@ -21,7 +21,11 @@ function checkProperties(a: any, b: any) {
   return true;
 }
 
-// Compare a to b and b to a
+/**
+ * Compares a to b and b to a.
+ *
+ * @public
+ */
 export function shallowCompare(a: any, b: any) {
   return checkProperties(a, b) && checkProperties(b, a);
 }
@@ -31,6 +35,7 @@ export function shallowCompare(a: any, b: any) {
  * objects as arguments and they will be merged sequentially into the target. Note that this will
  * shallow merge; it will not create new cloned values for target members.
  *
+ * @public
  * @param target - Target object to merge following object arguments into.
  * @param args - One or more objects that will be mixed into the target in the order they are provided.
  * @returns Resulting merged target.
@@ -45,6 +50,7 @@ export function assign(target: any, ...args: any[]): any {
  * or "properties that start with data-". Note that this will shallow merge; it will not create new cloned
  * values for target members.
  *
+ * @public
  * @param isAllowed - Callback to determine if the given propName is allowed in the result.
  * @param target - Target object to merge following object arguments into.
  * @param args - One or more objects that will be mixed into the target in the order they are provided.
@@ -67,7 +73,11 @@ export function filteredAssign(isAllowed: (propName: string) => boolean, target:
   return target;
 }
 
-/** Generates a unique id in the global scope (this spans across duplicate copies of the same library.) */
+/**
+ * Generates a unique id in the global scope (this spans across duplicate copies of the same library.)
+ *
+ * @public
+ */
 export function getId(prefix?: string): string {
   let index = _global[CURRENT_ID_PROPERTY]++;
 
diff --git a/packages/utilities/src/overflow.ts b/packages/utilities/src/overflow.ts
index f8e10abed83e8..f250dd7f8b3d5 100644
--- a/packages/utilities/src/overflow.ts
+++ b/packages/utilities/src/overflow.ts
@@ -1,6 +1,7 @@
 /**
  * Detects whether an element's content has horizontal overflow
  *
+ * @public
  * @param element - Element to check for overflow
  * @returns True if element's content overflows
  */
@@ -11,6 +12,7 @@ export function hasHorizontalOverflow(element: HTMLElement): boolean {
 /**
  * Detects whether an element's content has vertical overflow
  *
+ * @public
  * @param element - Element to check for overflow
  * @returns True if element's content overflows
  */
@@ -21,6 +23,7 @@ export function hasVerticalOverflow(element: HTMLElement): boolean {
 /**
  * Detects whether an element's content has overflow in any direction
  *
+ * @public
  * @param element - Element to check for overflow
  * @returns True if element's content overflows
  */
diff --git a/packages/utilities/src/properties.ts b/packages/utilities/src/properties.ts
index 3b8f09af6fba8..18c86ec22f3da 100644
--- a/packages/utilities/src/properties.ts
+++ b/packages/utilities/src/properties.ts
@@ -1,4 +1,10 @@
 import { filteredAssign } from './object';
+
+/**
+ * An array of events that are allowed on every html element type.
+ *
+ * @public
+ */
 export const baseElementEvents = [
   'onCopy',
   'onCut',
@@ -71,6 +77,11 @@ export const baseElementEvents = [
   'onWheel'
 ];
 
+/**
+ * An array of element attributes which are allowed on every html element type.
+ *
+ * @public
+ */
 export const baseElementProperties = [
   'defaultChecked',
   'defaultValue',
@@ -192,23 +203,58 @@ export const baseElementProperties = [
   'wrap'
 ];
 
+/**
+ * An array of HTML element properties and events.
+ *
+ * @public
+ */
 export const htmlElementProperties = baseElementProperties.concat(baseElementEvents);
 
+/**
+ * An array of A tag properties and events.
+ *
+ * @public
+ */
 export const anchorProperties = htmlElementProperties.concat([
   'href',
   'target'
 ]);
 
+/**
+ * An array of BUTTON tag properties and events.
+ *
+ * @public
+ */
 export const buttonProperties = htmlElementProperties.concat([
   'disabled'
 ]);
 
+/**
+ * An array of DIV tag properties and events.
+ *
+ * @public
+ */
 export const divProperties = htmlElementProperties.concat(['align', 'noWrap']);
 
+/**
+ * An array of INPUT tag properties and events.
+ *
+ * @public
+ */
 export const inputProperties = buttonProperties;
 
+/**
+ * An array of TEXTAREA tag properties and events.
+ *
+ * @public
+ */
 export const textAreaProperties = buttonProperties;
 
+/**
+ * An array of IMAGE tag properties and events.
+ *
+ * @public
+ */
 export const imageProperties = divProperties;
 
 /**
@@ -219,6 +265,8 @@ export const imageProperties = divProperties;
  * non-native props should be applied second. This will prevent getNativeProps from overriding your custom props.
  * For example, if props passed to getNativeProps has an onClick function and getNativeProps is added to
  * the component after an onClick function is added, then the getNativeProps onClick will override it.
+ *
+ * @public
  * @param props - The unfiltered input props
  * @param allowedPropsNames-  The array of allowed propnames.
  * @returns The filtered props
diff --git a/packages/utilities/src/rtl.ts b/packages/utilities/src/rtl.ts
index f031b8663827e..6c71dfcdc71f2 100644
--- a/packages/utilities/src/rtl.ts
+++ b/packages/utilities/src/rtl.ts
@@ -6,6 +6,8 @@ let _isRTL: boolean | undefined;
 
 /**
  * Gets the rtl state of the page (returns true if in rtl.)
+ *
+ * @public
  */
 export function getRTL(): boolean {
   let isRTL: boolean = _isRTL as boolean;
@@ -23,6 +25,8 @@ export function getRTL(): boolean {
 
 /**
  * Sets the rtl state of the page (by adjusting the dir attribute of the html element.)
+ *
+ * @public
  */
 export function setRTL(isRTL: boolean) {
   let doc = getDocument();
@@ -36,6 +40,8 @@ export function setRTL(isRTL: boolean) {
 
 /**
  * Returns the given key, but flips right/left arrows if necessary.
+ *
+ * @public
  */
 export function getRTLSafeKeyCode(key: number): number {
   if (getRTL()) {
diff --git a/packages/utilities/src/scroll.ts b/packages/utilities/src/scroll.ts
index 763a190ed8ac5..2d4edddf61c5d 100644
--- a/packages/utilities/src/scroll.ts
+++ b/packages/utilities/src/scroll.ts
@@ -4,8 +4,20 @@ import styles from './scroll.scss';
 let _scrollbarWidth: number;
 let _bodyScrollDisabledCount = 0;
 
+/**
+ * Placing this attribute on scrollable divs optimizes detection to know
+ * if the div is scrollable or not (given we can avoid expensive operations
+ * like getComputedStyle.)
+ *
+ * @public
+ */
 export const DATA_IS_SCROLLABLE_ATTRIBUTE = 'data-is-scrollable';
 
+/**
+ * Disables the body scrolling.
+ *
+ * @public
+ */
 export function disableBodyScroll() {
   let doc = getDocument();
 
@@ -16,6 +28,11 @@ export function disableBodyScroll() {
   _bodyScrollDisabledCount++;
 }
 
+/**
+ * Enables the body scrolling.
+ *
+ * @public
+ */
 export function enableBodyScroll() {
   if (_bodyScrollDisabledCount > 0) {
     let doc = getDocument();
@@ -28,7 +45,11 @@ export function enableBodyScroll() {
   }
 }
 
-/** Calculates the width of a scrollbar for the browser/os. */
+/**
+ * Calculates the width of a scrollbar for the browser/os.
+ *
+ * @public
+ */
 export function getScrollbarWidth(): number {
   if (_scrollbarWidth === undefined) {
     let scrollDiv: HTMLElement = document.createElement('div');
@@ -51,6 +72,8 @@ export function getScrollbarWidth(): number {
 /**
  * Traverses up the DOM for the element with the data-is-scrollable=true attribute, or returns
  * document.body.
+ *
+ * @public
  */
 export function findScrollableParent(startingElement: HTMLElement): HTMLElement | null {
   let el: HTMLElement | null = startingElement;
diff --git a/packages/utilities/src/string.ts b/packages/utilities/src/string.ts
index 0de594d55bdfc..2a6ec2c8eed96 100644
--- a/packages/utilities/src/string.ts
+++ b/packages/utilities/src/string.ts
@@ -5,10 +5,13 @@ const FORMAT_ARGS_REGEX = /[\{\}]/g;
 const FORMAT_REGEX = /\{\d+\}/g;
 
 /**
- * String Format is like C# string format.
- * Usage Example: "hello {0}!".format("mike") will return "hello mike!"
- * Calling format on a string with less arguments than specified in the format is invalid
+ * String format method, used for scenarios where at runtime you
+ * need to evaluate a formatted string given a tokenized string. This
+ * usually only is needed in localization scenarios.
+
  * Example "I love {0} every {1}".format("CXP") will result in a Debug Exception.
+ *
+ * @public
  */
 export function format(s: string, ...values: any[]): string {
   'use strict';
diff --git a/packages/utilities/src/warn.ts b/packages/utilities/src/warn.ts
index 077a71299a836..b08e004e0d19c 100644
--- a/packages/utilities/src/warn.ts
+++ b/packages/utilities/src/warn.ts
@@ -7,6 +7,7 @@ export type ISettingsMap<T> = {
 /**
  * Warns when a deprecated props are being used.
  *
+ * @public
  * @param componentName - The name of the component being used.
  * @param props - The props passed into the component.
  * @param deprecationMap - The map of deprecations, where key is the prop name and the value is
@@ -33,6 +34,7 @@ export function warnDeprecations<P>(
 /**
  * Warns when two props which are mutually exclusive are both being used.
  *
+ * @public
  * @param componentName - The name of the component being used.
  * @param props - The props passed into the component.
  * @param exclusiveMap - A map where the key is a parameter, and the value is the other parameter.
@@ -56,6 +58,8 @@ export function warnMutuallyExclusive<P>(
 
 /**
  * Sends a warning to console, if the api is present.
+ *
+ * @public
  * @param message - Warning message.
  */
 export function warn(message: string): void {
@@ -68,6 +72,7 @@ export function warn(message: string): void {
  * Configures the warning callback. Passing in undefined will reset it to use the default
  * console.warn function.
  *
+ * @public
  * @param warningCallback - Callback to override the generated warnings.
  */
 export function setWarningCallback(warningCallback?: (message: string) => void): void {

From 1d2e6b2d934ebb950050a1b0619b3421770fe2a6 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Sat, 8 Jul 2017 03:34:36 +0000
Subject: [PATCH 0224/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 25 +++++++++++++++++++
 apps/fabric-website/CHANGELOG.md              |  9 ++++++-
 apps/fabric-website/package.json              |  6 ++---
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../package-updates_2017-07-08-02-13.json     | 11 --------
 .../package-updates_2017-07-08-02-13.json     | 11 --------
 .../package-updates_2017-07-08-02-13.json     | 11 --------
 .../package-updates_2017-07-08-02-13.json     | 11 --------
 .../package-updates_2017-07-08-02-13.json     | 11 --------
 packages/example-app-base/CHANGELOG.json      | 22 ++++++++++++++++
 packages/example-app-base/CHANGELOG.md        |  9 ++++++-
 packages/example-app-base/package.json        |  6 ++---
 packages/example-component/package.json       |  8 +++---
 .../office-ui-fabric-react/CHANGELOG.json     | 25 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++-
 packages/office-ui-fabric-react/package.json  |  8 +++---
 packages/styling/CHANGELOG.json               | 19 ++++++++++++++
 packages/styling/CHANGELOG.md                 |  9 ++++++-
 packages/styling/package.json                 |  4 +--
 packages/utilities/CHANGELOG.json             | 14 +++++++++++
 packages/utilities/CHANGELOG.md               |  9 ++++++-
 packages/utilities/package.json               |  2 +-
 24 files changed, 165 insertions(+), 80 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/package-updates_2017-07-08-02-13.json
 delete mode 100644 common/changes/@uifabric/fabric-website/package-updates_2017-07-08-02-13.json
 delete mode 100644 common/changes/@uifabric/styling/package-updates_2017-07-08-02-13.json
 delete mode 100644 common/changes/@uifabric/utilities/package-updates_2017-07-08-02-13.json
 delete mode 100644 common/changes/office-ui-fabric-react/package-updates_2017-07-08-02-13.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index d51a674ebe1df..96d31e07b4713 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,31 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.5.41",
+      "tag": "@uifabric/fabric-website_v4.5.41",
+      "date": "Sat, 08 Jul 2017 03:34:35 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "3df78de25c03bf92d299e9f544950593001861eb",
+            "comment": "Updating dev dependencies."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=4.0.1 <5.0.0` to `>=4.0.2 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.6.0 <5.0.0` to `>=4.7.1 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.16.0 <5.0.0` to `>=4.16.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.5.40",
       "tag": "@uifabric/fabric-website_v4.5.40",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 9f40766bdf6f7..0d79fd203685a 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Tue, 27 Jun 2017 01:26:31 GMT and should not be manually modified.
+This log was last generated on Sat, 08 Jul 2017 03:34:35 GMT and should not be manually modified.
+
+## 4.5.41
+Sat, 08 Jul 2017 03:34:35 GMT
+
+### Patches
+
+- Updating dev dependencies.
 
 ## 4.5.40
 Tue, 27 Jun 2017 01:26:31 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index b4d00b1a9cd0f..c605ffc0b17dc 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.5.40",
+  "version": "4.5.41",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,8 +47,8 @@
     "webpack-bundle-analyzer": "^2.2.1"
   },
   "dependencies": {
-    "@uifabric/example-app-base": ">=4.0.1 <5.0.0",
-    "@uifabric/utilities": ">=4.6.0 <5.0.0",
+    "@uifabric/example-app-base": ">=4.0.2 <5.0.0",
+    "@uifabric/utilities": ">=4.7.1 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index d50e17e12074d..663a3431678f1 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.15.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.16.1 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 6377602150f5b..65ab683a39d11 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.15.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.16.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 1e9936aa48bb9..7b4c7c1ab20b0 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.15.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.16.1 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/@uifabric/example-app-base/package-updates_2017-07-08-02-13.json b/common/changes/@uifabric/example-app-base/package-updates_2017-07-08-02-13.json
deleted file mode 100644
index 66f2ffab0e628..0000000000000
--- a/common/changes/@uifabric/example-app-base/package-updates_2017-07-08-02-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Updating dev dependencies.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "dzearing@hotmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/package-updates_2017-07-08-02-13.json b/common/changes/@uifabric/fabric-website/package-updates_2017-07-08-02-13.json
deleted file mode 100644
index 0de1a97a712d2..0000000000000
--- a/common/changes/@uifabric/fabric-website/package-updates_2017-07-08-02-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Updating dev dependencies.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "dzearing@hotmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/package-updates_2017-07-08-02-13.json b/common/changes/@uifabric/styling/package-updates_2017-07-08-02-13.json
deleted file mode 100644
index f14dd446fc58d..0000000000000
--- a/common/changes/@uifabric/styling/package-updates_2017-07-08-02-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Updating dev dependencies.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@hotmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/package-updates_2017-07-08-02-13.json b/common/changes/@uifabric/utilities/package-updates_2017-07-08-02-13.json
deleted file mode 100644
index 460cba3194fb8..0000000000000
--- a/common/changes/@uifabric/utilities/package-updates_2017-07-08-02-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Updating library comments.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@hotmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/package-updates_2017-07-08-02-13.json b/common/changes/office-ui-fabric-react/package-updates_2017-07-08-02-13.json
deleted file mode 100644
index a16be0ce11673..0000000000000
--- a/common/changes/office-ui-fabric-react/package-updates_2017-07-08-02-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixing an import breaking AMD modules related to GroupedList.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@hotmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index e2826d030cfa2..d45890df8e3d0 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "4.0.2",
+      "tag": "@uifabric/example-app-base_v4.0.2",
+      "date": "Sat, 08 Jul 2017 03:34:35 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "3df78de25c03bf92d299e9f544950593001861eb",
+            "comment": "Updating dev dependencies."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.13.0 <1.0.0` to `>=0.13.1 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.6.0 <5.0.0` to `>=4.7.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.0.1",
       "tag": "@uifabric/example-app-base_v4.0.1",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index 35dbd8fff8b06..1c71080fed9f1 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Tue, 27 Jun 2017 01:26:31 GMT and should not be manually modified.
+This log was last generated on Sat, 08 Jul 2017 03:34:35 GMT and should not be manually modified.
+
+## 4.0.2
+Sat, 08 Jul 2017 03:34:35 GMT
+
+### Patches
+
+- Updating dev dependencies.
 
 ## 4.0.1
 Tue, 27 Jun 2017 01:26:31 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index de4dc972bc1e6..240df340971af 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "4.0.1",
+  "version": "4.0.2",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,8 +47,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.13.0 <1.0.0",
-    "@uifabric/utilities": ">=4.6.0 <5.0.0",
+    "@uifabric/styling": ">=0.13.1 <1.0.0",
+    "@uifabric/utilities": ">=4.7.1 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.4.0 <5.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index cef46e0439b17..ff32adbe5a26d 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-component",
-  "version": "1.0.41",
+  "version": "1.0.42",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -21,8 +21,8 @@
     "@types/react-addons-test-utils": "0.14.18",
     "@types/react-dom": "15.5.0",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": "4.0.1",
-    "@uifabric/utilities": "4.7.0",
+    "@uifabric/example-app-base": "4.0.2",
+    "@uifabric/utilities": "4.7.1",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.15.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.16.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 5533d434c0a59..388a626df6e7b 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,31 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.16.1",
+      "tag": "office-ui-fabric-react_v4.16.1",
+      "date": "Sat, 08 Jul 2017 03:34:35 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "3df78de25c03bf92d299e9f544950593001861eb",
+            "comment": "Fixing an import breaking AMD modules related to GroupedList."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.6.0 <5.0.0` to `>=4.7.1 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.13.0 <1.0.0` to `>=0.13.1 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `4.0.1` to `4.0.2`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.16.0",
       "tag": "office-ui-fabric-react_v4.16.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 490ba98bec7c3..da26421e7430b 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 07 Jul 2017 10:11:38 GMT and should not be manually modified.
+This log was last generated on Sat, 08 Jul 2017 03:34:35 GMT and should not be manually modified.
+
+## 4.16.1
+Sat, 08 Jul 2017 03:34:35 GMT
+
+### Patches
+
+- Fixing an import breaking AMD modules related to GroupedList.
 
 ## 4.16.0
 Fri, 07 Jul 2017 10:11:38 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 8bc79ef4a5f18..9b92efe8b17c6 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.16.0",
+  "version": "4.16.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": "4.0.1",
+    "@uifabric/example-app-base": "4.0.2",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -71,8 +71,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.6.0 <5.0.0",
-    "@uifabric/styling": ">=0.13.0 <1.0.0",
+    "@uifabric/utilities": ">=4.7.1 <5.0.0",
+    "@uifabric/styling": ">=0.13.1 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index e2d14768a3a59..8dad78fbfe2fb 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.13.1",
+      "tag": "@uifabric/styling_v0.13.1",
+      "date": "Sat, 08 Jul 2017 03:34:35 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "3df78de25c03bf92d299e9f544950593001861eb",
+            "comment": "Updating dev dependencies."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.6.0 <5.0.0` to `>=4.7.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.13.0",
       "tag": "@uifabric/styling_v0.13.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 9ee8f1cf26489..d35f5c0484197 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 07 Jul 2017 10:11:38 GMT and should not be manually modified.
+This log was last generated on Sat, 08 Jul 2017 03:34:35 GMT and should not be manually modified.
+
+## 0.13.1
+Sat, 08 Jul 2017 03:34:35 GMT
+
+### Patches
+
+- Updating dev dependencies.
 
 ## 0.13.0
 Fri, 07 Jul 2017 10:11:38 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 32ab02798ada4..51ded0942d64f 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.13.0",
+  "version": "0.13.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.6.0 <5.0.0",
+    "@uifabric/utilities": ">=4.7.1 <5.0.0",
     "tslib": "^1.6.0",
     "rtl-css-js": "^1.1.1",
     "glamor": "^2.20.24"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 456e38c30e0c2..205799a416fcb 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.7.1",
+      "tag": "@uifabric/utilities_v4.7.1",
+      "date": "Sat, 08 Jul 2017 03:34:35 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "3df78de25c03bf92d299e9f544950593001861eb",
+            "comment": "Updating library comments."
+          }
+        ]
+      }
+    },
     {
       "version": "4.7.0",
       "tag": "@uifabric/utilities_v4.7.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 14b2eb14f009b..26aaaca762827 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Thu, 06 Jul 2017 10:11:47 GMT and should not be manually modified.
+This log was last generated on Sat, 08 Jul 2017 03:34:35 GMT and should not be manually modified.
+
+## 4.7.1
+Sat, 08 Jul 2017 03:34:35 GMT
+
+### Patches
+
+- Updating library comments.
 
 ## 4.7.0
 Thu, 06 Jul 2017 10:11:47 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index d88d036bf278a..27e323158e49d 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.7.0",
+  "version": "4.7.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From c9315f27692fdb73fcc159fd097429fe7441d316 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 7 Jul 2017 22:36:22 -0700
Subject: [PATCH 0225/1641] Amd import (#2163)

* another import.

* Adding patch file.
---
 .../amd-import_2017-07-08-05-35.json                  | 11 +++++++++++
 .../src/components/DetailsList/DetailsHeader.tsx      |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/amd-import_2017-07-08-05-35.json

diff --git a/common/changes/office-ui-fabric-react/amd-import_2017-07-08-05-35.json b/common/changes/office-ui-fabric-react/amd-import_2017-07-08-05-35.json
new file mode 100644
index 0000000000000..6f954b83c2519
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/amd-import_2017-07-08-05-35.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "AMD fix for GroupedList.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@hotmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index 2ea029b33951d..261b79263aa0d 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -14,7 +14,7 @@ import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { Icon } from '../../Icon';
 import { Layer } from '../../Layer';
 import { GroupSpacer } from '../GroupedList/GroupSpacer';
-import { CollapseAllVisibility } from '../GroupedList';
+import { CollapseAllVisibility } from '../../GroupedList';
 import { DetailsRowCheck } from './DetailsRowCheck';
 import { ITooltipHostProps } from '../../Tooltip';
 import * as checkStyles from './DetailsRowCheck.scss';

From e1ea7dfc2971a859abf3446f6fdcd99fda744a2d Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 7 Jul 2017 22:59:28 -0700
Subject: [PATCH 0226/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 .../amd-import_2017-07-08-05-35.json          | 11 -----------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++++-
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/CHANGELOG.json               |  6 ++++++
 packages/styling/CHANGELOG.md                 |  7 ++++++-
 packages/styling/package.json                 |  2 +-
 10 files changed, 45 insertions(+), 19 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/amd-import_2017-07-08-05-35.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index c605ffc0b17dc..d5deef136ed30 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.16.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.16.2 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/amd-import_2017-07-08-05-35.json b/common/changes/office-ui-fabric-react/amd-import_2017-07-08-05-35.json
deleted file mode 100644
index 6f954b83c2519..0000000000000
--- a/common/changes/office-ui-fabric-react/amd-import_2017-07-08-05-35.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "AMD fix for GroupedList.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@hotmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 240df340971af..a1ba7254ec4f1 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -47,7 +47,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.13.1 <1.0.0",
+    "@uifabric/styling": ">=0.13.2 <1.0.0",
     "@uifabric/utilities": ">=4.7.1 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index ff32adbe5a26d..78dc10dd89fe7 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.16.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.16.2 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 388a626df6e7b..4ad4abd75e779 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.16.2",
+      "tag": "office-ui-fabric-react_v4.16.2",
+      "date": "Sat, 08 Jul 2017 05:59:27 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "c9315f27692fdb73fcc159fd097429fe7441d316",
+            "comment": "AMD fix for GroupedList."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.13.1 <1.0.0` to `>=0.13.2 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.16.1",
       "tag": "office-ui-fabric-react_v4.16.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index da26421e7430b..895112193812c 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Sat, 08 Jul 2017 03:34:35 GMT and should not be manually modified.
+This log was last generated on Sat, 08 Jul 2017 05:59:28 GMT and should not be manually modified.
+
+## 4.16.2
+Sat, 08 Jul 2017 05:59:27 GMT
+
+### Patches
+
+- AMD fix for GroupedList.
 
 ## 4.16.1
 Sat, 08 Jul 2017 03:34:35 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 9b92efe8b17c6..620544251ed0f 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.16.1",
+  "version": "4.16.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.7.1 <5.0.0",
-    "@uifabric/styling": ">=0.13.1 <1.0.0",
+    "@uifabric/styling": ">=0.13.2 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 8dad78fbfe2fb..1aab38805c83a 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.13.2",
+      "tag": "@uifabric/styling_v0.13.2",
+      "date": "Sat, 08 Jul 2017 05:59:28 GMT",
+      "comments": {}
+    },
     {
       "version": "0.13.1",
       "tag": "@uifabric/styling_v0.13.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index d35f5c0484197..c08b155d9e873 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Sat, 08 Jul 2017 03:34:35 GMT and should not be manually modified.
+This log was last generated on Sat, 08 Jul 2017 05:59:28 GMT and should not be manually modified.
+
+## 0.13.2
+Sat, 08 Jul 2017 05:59:28 GMT
+
+*Changes not tracked*
 
 ## 0.13.1
 Sat, 08 Jul 2017 03:34:35 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 51ded0942d64f..5ee58b233881b 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.13.1",
+  "version": "0.13.2",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From ab075c152e4acf2a6458889ba1f093ecff221c06 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Sun, 9 Jul 2017 13:34:35 -0700
Subject: [PATCH 0227/1641] Added onRenderLabel and set label to truncate if
 too long (#2148)

* Added onRenderLabel and set label to truncate if too long

* Change file

* Update choicegroup-custom-label_2017-07-06-18-14.json
---
 ...cegroup-custom-label_2017-07-06-18-14.json | 11 ++++++++++
 .../ChoiceGroup/ChoiceGroup.Props.ts          |  5 +++++
 .../components/ChoiceGroup/ChoiceGroup.scss   |  6 +++--
 .../components/ChoiceGroup/ChoiceGroup.tsx    | 22 ++++++++++++++-----
 4 files changed, 36 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/choicegroup-custom-label_2017-07-06-18-14.json

diff --git a/common/changes/office-ui-fabric-react/choicegroup-custom-label_2017-07-06-18-14.json b/common/changes/office-ui-fabric-react/choicegroup-custom-label_2017-07-06-18-14.json
new file mode 100644
index 0000000000000..1431f46fceb64
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/choicegroup-custom-label_2017-07-06-18-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ChoiceGroup: Allow image/icon labels to truncate when larger than parent. Provided onRenderLabel to add Tooltip or other decorations",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts
index c7ed0d8159471..6e5b2a97066ad 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts
@@ -62,6 +62,11 @@ export interface IChoiceGroupOption {
    */
   onRenderField?: IRenderFunction<IChoiceGroupOption>;
 
+  /**
+   * Optional override of option render
+   */
+  onRenderLabel?: (IChoiceGroupOption) => JSX.Element;
+
   /**
    * The Icon component props for choice field
    */
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
index 3311805c3ea72..23e36feed1b8b 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
@@ -258,12 +258,14 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
 
     .labelWrapper {
       $lineHeight: 16px;
-      display: inline-block;
+      display: block;
       position: relative;
       margin: 4px 0 0 0;
       height: $lineHeight * 2;
       line-height: $lineHeight;
-      overflow-y: hidden;
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
       @include ms-font-m;
 
       :global(.ms-Label) {
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
index 8c36e1b5a6918..3877fbc31efed 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
@@ -75,14 +75,18 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
           ) }
 
           { options.map((option: IChoiceGroupOption) => {
-            let { onRenderField = this._onRenderField } = option;
+            let {
+              onRenderField = this._onRenderField,
+              onRenderLabel = this._onRenderLabel
+            } = option;
 
             // Merge internal props into option
             assign(option, {
               checked: option.key === keyChecked,
               disabled: option.disabled || this.props.disabled,
               id: `${this._id}-${option.key}`,
-              labelId: `${this._labelId}-${option.key}`
+              labelId: `${this._labelId}-${option.key}`,
+              onRenderLabel
             });
 
             return (
@@ -140,6 +144,8 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
 
   private _onRenderField(option: IChoiceGroupOption) {
 
+    let { onRenderLabel } = option;
+
     return (
       <label
         htmlFor={ option.id }
@@ -195,16 +201,20 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
           option.imageSrc || option.iconProps
             ? (
               <div className={ css('ms-ChoiceField-labelWrapper', styles.labelWrapper) }>
-                <span id={ option.labelId } className='ms-Label'>{ option.text }</span>
+                { onRenderLabel(option) }
               </div>
-            ) : (
-              <span id={ option.labelId } className='ms-Label'>{ option.text }</span>
-            )
+            ) : onRenderLabel(option)
         }
       </label>
     );
   }
 
+  private _onRenderLabel(option: IChoiceGroupOption): JSX.Element {
+    return (
+      <span id={ option.labelId } className='ms-Label'>{ option.text }</span>
+    );
+  }
+
   private _onChange(option: IChoiceGroupOption, evt: React.FormEvent<HTMLInputElement>) {
     let { onChanged, onChange, selectedKey } = this.props;
 

From 6fc50dda4685695ec7b57a942fed2ac50c9a6e67 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 10 Jul 2017 10:22:21 +0000
Subject: [PATCH 0228/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...cegroup-custom-label_2017-07-06-18-14.json | 11 -----------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++++-
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/CHANGELOG.json               |  6 ++++++
 packages/styling/CHANGELOG.md                 |  7 ++++++-
 packages/styling/package.json                 |  2 +-
 13 files changed, 48 insertions(+), 22 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/choicegroup-custom-label_2017-07-06-18-14.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index d5deef136ed30..1665fcfda306e 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.16.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.17.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 663a3431678f1..2924c3bf55e17 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.16.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.17.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 65ab683a39d11..24cd8c6143be6 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.16.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.17.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 7b4c7c1ab20b0..475b094a7f894 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.16.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.17.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/office-ui-fabric-react/choicegroup-custom-label_2017-07-06-18-14.json b/common/changes/office-ui-fabric-react/choicegroup-custom-label_2017-07-06-18-14.json
deleted file mode 100644
index 1431f46fceb64..0000000000000
--- a/common/changes/office-ui-fabric-react/choicegroup-custom-label_2017-07-06-18-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ChoiceGroup: Allow image/icon labels to truncate when larger than parent. Provided onRenderLabel to add Tooltip or other decorations",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index a1ba7254ec4f1..99ab57bfceb8d 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -47,7 +47,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.13.2 <1.0.0",
+    "@uifabric/styling": ">=0.13.3 <1.0.0",
     "@uifabric/utilities": ">=4.7.1 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 78dc10dd89fe7..3cad646b09968 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.16.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.17.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 4ad4abd75e779..df9154e5a3801 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.17.0",
+      "tag": "office-ui-fabric-react_v4.17.0",
+      "date": "Mon, 10 Jul 2017 10:22:21 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "ab075c152e4acf2a6458889ba1f093ecff221c06",
+            "comment": "ChoiceGroup: Allow image/icon labels to truncate when larger than parent. Provided onRenderLabel to add Tooltip or other decorations"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.13.2 <1.0.0` to `>=0.13.3 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.16.2",
       "tag": "office-ui-fabric-react_v4.16.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 895112193812c..931a2a639274d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Sat, 08 Jul 2017 05:59:28 GMT and should not be manually modified.
+This log was last generated on Mon, 10 Jul 2017 10:22:21 GMT and should not be manually modified.
+
+## 4.17.0
+Mon, 10 Jul 2017 10:22:21 GMT
+
+### Minor changes
+
+- ChoiceGroup: Allow image/icon labels to truncate when larger than parent. Provided onRenderLabel to add Tooltip or other decorations
 
 ## 4.16.2
 Sat, 08 Jul 2017 05:59:27 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 620544251ed0f..6a80230c0d801 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.16.2",
+  "version": "4.17.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.7.1 <5.0.0",
-    "@uifabric/styling": ">=0.13.2 <1.0.0",
+    "@uifabric/styling": ">=0.13.3 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 1aab38805c83a..a4ae24180c89a 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.13.3",
+      "tag": "@uifabric/styling_v0.13.3",
+      "date": "Mon, 10 Jul 2017 10:22:21 GMT",
+      "comments": {}
+    },
     {
       "version": "0.13.2",
       "tag": "@uifabric/styling_v0.13.2",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index c08b155d9e873..f1804c45fa11e 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Sat, 08 Jul 2017 05:59:28 GMT and should not be manually modified.
+This log was last generated on Mon, 10 Jul 2017 10:22:21 GMT and should not be manually modified.
+
+## 0.13.3
+Mon, 10 Jul 2017 10:22:21 GMT
+
+*Changes not tracked*
 
 ## 0.13.2
 Sat, 08 Jul 2017 05:59:28 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 5ee58b233881b..492fc88e7701c 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.13.2",
+  "version": "0.13.3",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 4fa3fe634eeabd99a38cd9eccc57e723c1dfd73f Mon Sep 17 00:00:00 2001
From: Ankit Khokhar <ankitkhokhar@iitrpr.ac.in>
Date: Mon, 10 Jul 2017 21:54:15 +0530
Subject: [PATCH 0229/1641] fix button duplicate aria-disabled for disabled
 buttons (#2167)

* ARIA disabled duplicate removed

* Created change file
---
 ...xButtonDuplicateARIADisabled_2017-07-10-06-48.json | 11 +++++++++++
 .../src/components/Button/BaseButton.tsx              |  1 -
 2 files changed, 11 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-ankhokha-FixButtonDuplicateARIADisabled_2017-07-10-06-48.json

diff --git a/common/changes/office-ui-fabric-react/users-ankhokha-FixButtonDuplicateARIADisabled_2017-07-10-06-48.json b/common/changes/office-ui-fabric-react/users-ankhokha-FixButtonDuplicateARIADisabled_2017-07-10-06-48.json
new file mode 100644
index 0000000000000..7bf0e475b0dc5
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-ankhokha-FixButtonDuplicateARIADisabled_2017-07-10-06-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Removed ARIA disabled from button, as already handled by button HTML attribute",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "ankhokha@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 43bb828d75e88..b62602e2916a9 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -130,7 +130,6 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         'aria-label': ariaLabel,
         'aria-labelledby': ariaLabel ? null : _labelId,
         'aria-describedby': ariaDescribedBy,
-        'aria-disabled': disabled,
         'data-is-focusable': (this.props['data-is-focusable'] === false || disabled) ? false : true,
         'aria-pressed': checked
       }

From 31a91422060ffcb1f0f71015d0e95af8e9c8ffcb Mon Sep 17 00:00:00 2001
From: Marena Richardson <marena.richardson@gmail.com>
Date: Mon, 10 Jul 2017 09:24:31 -0700
Subject: [PATCH 0230/1641] Fix spacing between cells (#2160)

* Fix spacing between cells

* Change file
---
 ...ng-between-details-row-cells_2017-07-07-21-07.json | 11 +++++++++++
 .../src/components/DetailsList/DetailsRow.scss        |  1 -
 2 files changed, 11 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-spacing-between-details-row-cells_2017-07-07-21-07.json

diff --git a/common/changes/office-ui-fabric-react/fix-spacing-between-details-row-cells_2017-07-07-21-07.json b/common/changes/office-ui-fabric-react/fix-spacing-between-details-row-cells_2017-07-07-21-07.json
new file mode 100644
index 0000000000000..5c06f2eee337c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-spacing-between-details-row-cells_2017-07-07-21-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Remove unnecessary line height",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "maricha@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
index 88ebc8c162ec6..9364287b42d45 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
@@ -24,7 +24,6 @@ $detailsList-item-selected-hover-color: $listItemSelectedHoverColor;
   border: none;
   @include text-align(left);
   vertical-align: top;
-  line-height: $rowHeight - ($rowVerticalPadding * 2);
 
   &:hover {
     background: $detailsList-item-hover-color;

From 61ad518bc8eaba0025697058fcc588c894f292d5 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 10 Jul 2017 11:49:45 -0700
Subject: [PATCH 0231/1641] Checkbox: Don't use non-prefixed class names.
 (#2173)

* Reverting broken checkbox classes.

* Adding change file.
---
 .../checkbox-fix_2017-07-10-18-47.json                | 11 +++++++++++
 .../src/components/Checkbox/Checkbox.tsx              |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/checkbox-fix_2017-07-10-18-47.json

diff --git a/common/changes/office-ui-fabric-react/checkbox-fix_2017-07-10-18-47.json b/common/changes/office-ui-fabric-react/checkbox-fix_2017-07-10-18-47.json
new file mode 100644
index 0000000000000..6fac29b84358b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/checkbox-fix_2017-07-10-18-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Checkbox: reverting global class names to use ms-Checkbox-* prefixed values.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
index 1e948b2b9c6dc..bce242a3e119e 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
@@ -91,8 +91,8 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
           aria-checked={ isChecked }
         />
         <label className={ css('ms-Checkbox-label', styles.label) } htmlFor={ this._id }>
-          <span className={ css('box', styles.box) }>
-            <span className={ css('checkbox', styles.checkbox) }>
+          <span className={ css('ms-Checkbox-box', styles.box) }>
+            <span className={ css('ms-Checkbox-checkbox', styles.checkbox) }>
               <Icon iconName='CheckMark' className={ styles.checkmark } />
             </span>
           </span>

From e4ce62f14ce5de55d26c0afae024dc3087893567 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 10 Jul 2017 11:52:13 -0700
Subject: [PATCH 0232/1641] Removing recent change to suppress css folder.

---
 packages/office-ui-fabric-react/.npmignore | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/.npmignore b/packages/office-ui-fabric-react/.npmignore
index ab07adc6630a4..6c28b2fcf1c04 100644
--- a/packages/office-ui-fabric-react/.npmignore
+++ b/packages/office-ui-fabric-react/.npmignore
@@ -13,7 +13,6 @@ results
 *.build.log
 dist/*.stats.html
 dist/demo*.*
-dist/css
 gulpfile.js
 index.html
 jsconfig.json

From d4a0bc167f671687933a15dd4160fe96c2a89e01 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 10 Jul 2017 19:18:56 +0000
Subject: [PATCH 0233/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 .../checkbox-fix_2017-07-10-18-47.json        | 11 -------
 ...en-details-row-cells_2017-07-07-21-07.json | 11 -------
 ...uplicateARIADisabled_2017-07-10-06-48.json | 11 -------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 29 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 11 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/CHANGELOG.json               |  6 ++++
 packages/styling/CHANGELOG.md                 |  7 ++++-
 packages/styling/package.json                 |  2 +-
 12 files changed, 57 insertions(+), 41 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/checkbox-fix_2017-07-10-18-47.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-spacing-between-details-row-cells_2017-07-07-21-07.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-ankhokha-FixButtonDuplicateARIADisabled_2017-07-10-06-48.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 1665fcfda306e..43ebd9a6a5a47 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.17.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.17.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/checkbox-fix_2017-07-10-18-47.json b/common/changes/office-ui-fabric-react/checkbox-fix_2017-07-10-18-47.json
deleted file mode 100644
index 6fac29b84358b..0000000000000
--- a/common/changes/office-ui-fabric-react/checkbox-fix_2017-07-10-18-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Checkbox: reverting global class names to use ms-Checkbox-* prefixed values.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-spacing-between-details-row-cells_2017-07-07-21-07.json b/common/changes/office-ui-fabric-react/fix-spacing-between-details-row-cells_2017-07-07-21-07.json
deleted file mode 100644
index 5c06f2eee337c..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-spacing-between-details-row-cells_2017-07-07-21-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Remove unnecessary line height",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "maricha@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-ankhokha-FixButtonDuplicateARIADisabled_2017-07-10-06-48.json b/common/changes/office-ui-fabric-react/users-ankhokha-FixButtonDuplicateARIADisabled_2017-07-10-06-48.json
deleted file mode 100644
index 7bf0e475b0dc5..0000000000000
--- a/common/changes/office-ui-fabric-react/users-ankhokha-FixButtonDuplicateARIADisabled_2017-07-10-06-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Removed ARIA disabled from button, as already handled by button HTML attribute",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "ankhokha@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 99ab57bfceb8d..71b2e075b6cb6 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -47,7 +47,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.13.3 <1.0.0",
+    "@uifabric/styling": ">=0.13.4 <1.0.0",
     "@uifabric/utilities": ">=4.7.1 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 3cad646b09968..58af265321c8b 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.17.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.17.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index df9154e5a3801..bfbbbe2cc83f1 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,35 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.17.1",
+      "tag": "office-ui-fabric-react_v4.17.1",
+      "date": "Mon, 10 Jul 2017 19:18:55 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "61ad518bc8eaba0025697058fcc588c894f292d5",
+            "comment": "Checkbox: reverting global class names to use ms-Checkbox-* prefixed values."
+          },
+          {
+            "author": "Marena Richardson <marena.richardson@gmail.com>",
+            "commit": "31a91422060ffcb1f0f71015d0e95af8e9c8ffcb",
+            "comment": "Remove unnecessary line height"
+          },
+          {
+            "author": "Ankit Khokhar <ankitkhokhar@iitrpr.ac.in>",
+            "commit": "4fa3fe634eeabd99a38cd9eccc57e723c1dfd73f",
+            "comment": "Removed ARIA disabled from button, as already handled by button HTML attribute"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.13.3 <1.0.0` to `>=0.13.4 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.17.0",
       "tag": "office-ui-fabric-react_v4.17.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 931a2a639274d..cc8baf5a1c561 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,15 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 10 Jul 2017 10:22:21 GMT and should not be manually modified.
+This log was last generated on Mon, 10 Jul 2017 19:18:55 GMT and should not be manually modified.
+
+## 4.17.1
+Mon, 10 Jul 2017 19:18:55 GMT
+
+### Patches
+
+- Checkbox: reverting global class names to use ms-Checkbox-* prefixed values.
+- Remove unnecessary line height
+- Removed ARIA disabled from button, as already handled by button HTML attribute
 
 ## 4.17.0
 Mon, 10 Jul 2017 10:22:21 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 6a80230c0d801..182bc21341997 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.17.0",
+  "version": "4.17.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.7.1 <5.0.0",
-    "@uifabric/styling": ">=0.13.3 <1.0.0",
+    "@uifabric/styling": ">=0.13.4 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index a4ae24180c89a..7786676a1f873 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.13.4",
+      "tag": "@uifabric/styling_v0.13.4",
+      "date": "Mon, 10 Jul 2017 19:18:55 GMT",
+      "comments": {}
+    },
     {
       "version": "0.13.3",
       "tag": "@uifabric/styling_v0.13.3",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index f1804c45fa11e..7701877fb128f 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Mon, 10 Jul 2017 10:22:21 GMT and should not be manually modified.
+This log was last generated on Mon, 10 Jul 2017 19:18:55 GMT and should not be manually modified.
+
+## 0.13.4
+Mon, 10 Jul 2017 19:18:55 GMT
+
+*Changes not tracked*
 
 ## 0.13.3
 Mon, 10 Jul 2017 10:22:21 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 492fc88e7701c..71f8322d3f7cd 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.13.3",
+  "version": "0.13.4",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 27eddf24f95cee9af7f38aac881899cedd2871bb Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Mon, 10 Jul 2017 15:34:37 -0700
Subject: [PATCH 0234/1641] Fix missing interface notification (#2151)

* Returning null if properties.length is zero

* change file
---
 ...terface-notification_2017-07-06-21-17.json | 11 ++++++++++
 .../PropertiesTable/PropertiesTable.tsx       | 22 +++++++++----------
 2 files changed, 22 insertions(+), 11 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/fix-missing-interface-notification_2017-07-06-21-17.json

diff --git a/common/changes/@uifabric/example-app-base/fix-missing-interface-notification_2017-07-06-21-17.json b/common/changes/@uifabric/example-app-base/fix-missing-interface-notification_2017-07-06-21-17.json
new file mode 100644
index 0000000000000..1629a24bc6486
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/fix-missing-interface-notification_2017-07-06-21-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Website: Stop displaying \"missing properties\" notification if props includes empty interface",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx b/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx
index 2e469fb8a8fb1..323f81bd83539 100644
--- a/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx
+++ b/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx
@@ -114,20 +114,20 @@ export class PropertiesTable extends React.Component<IPropertiesTableProps, any>
     let { title } = this.props;
     let { properties, isEnum, groups } = this.state;
 
+    if (properties.length === 0) {
+      return null;
+    }
+
     return (
       <div className='PropertiesTable'>
         <h2 className={ FontClassNames.xLarge }>{ title }</h2>
-        { (properties && properties.length) ? (
-          <DetailsList
-            selectionMode={ SelectionMode.none }
-            layoutMode={ DetailsListLayoutMode.justified }
-            items={ properties }
-            groups={ groups }
-            columns={ isEnum ? ENUM_COLUMNS : DEFAULT_COLUMNS }
-          />
-        ) : (
-            <div className='PropertiesTable-noProperties'>This component is missing properties. Please provide properties or remove the table from the example.</div>
-          ) }
+        <DetailsList
+          selectionMode={ SelectionMode.none }
+          layoutMode={ DetailsListLayoutMode.justified }
+          items={ properties }
+          groups={ groups }
+          columns={ isEnum ? ENUM_COLUMNS : DEFAULT_COLUMNS }
+        />
       </div>
     );
   }

From 9122d86315ac4048e0ad7895967ef4b2fa10dc90 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 11 Jul 2017 10:14:04 +0000
Subject: [PATCH 0235/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 ...terface-notification_2017-07-06-21-17.json | 11 -----------
 packages/example-app-base/CHANGELOG.json      | 19 +++++++++++++++++++
 packages/example-app-base/CHANGELOG.md        |  9 ++++++++-
 packages/example-app-base/package.json        |  4 ++--
 packages/example-component/package.json       |  4 ++--
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/CHANGELOG.json               |  6 ++++++
 packages/styling/CHANGELOG.md                 |  7 ++++++-
 packages/styling/package.json                 |  2 +-
 10 files changed, 47 insertions(+), 21 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/fix-missing-interface-notification_2017-07-06-21-17.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 43ebd9a6a5a47..2a857fdfd68c0 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -47,7 +47,7 @@
     "webpack-bundle-analyzer": "^2.2.1"
   },
   "dependencies": {
-    "@uifabric/example-app-base": ">=4.0.2 <5.0.0",
+    "@uifabric/example-app-base": ">=4.0.3 <5.0.0",
     "@uifabric/utilities": ">=4.7.1 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
diff --git a/common/changes/@uifabric/example-app-base/fix-missing-interface-notification_2017-07-06-21-17.json b/common/changes/@uifabric/example-app-base/fix-missing-interface-notification_2017-07-06-21-17.json
deleted file mode 100644
index 1629a24bc6486..0000000000000
--- a/common/changes/@uifabric/example-app-base/fix-missing-interface-notification_2017-07-06-21-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Website: Stop displaying \"missing properties\" notification if props includes empty interface",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index d45890df8e3d0..f9f93a5377071 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "4.0.3",
+      "tag": "@uifabric/example-app-base_v4.0.3",
+      "date": "Tue, 11 Jul 2017 10:14:04 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "27eddf24f95cee9af7f38aac881899cedd2871bb",
+            "comment": "Website: Stop displaying \"missing properties\" notification if props includes empty interface"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.13.4 <1.0.0` to `>=0.13.5 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.0.2",
       "tag": "@uifabric/example-app-base_v4.0.2",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index 1c71080fed9f1..d5c5748ec3d23 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Sat, 08 Jul 2017 03:34:35 GMT and should not be manually modified.
+This log was last generated on Tue, 11 Jul 2017 10:14:04 GMT and should not be manually modified.
+
+## 4.0.3
+Tue, 11 Jul 2017 10:14:04 GMT
+
+### Patches
+
+- Website: Stop displaying "missing properties" notification if props includes empty interface
 
 ## 4.0.2
 Sat, 08 Jul 2017 03:34:35 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 71b2e075b6cb6..0703e53d05c6d 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "4.0.2",
+  "version": "4.0.3",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,7 +47,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.13.4 <1.0.0",
+    "@uifabric/styling": ">=0.13.5 <1.0.0",
     "@uifabric/utilities": ">=4.7.1 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 58af265321c8b..dcd549e6a649e 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-component",
-  "version": "1.0.42",
+  "version": "1.0.43",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -21,7 +21,7 @@
     "@types/react-addons-test-utils": "0.14.18",
     "@types/react-dom": "15.5.0",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": "4.0.2",
+    "@uifabric/example-app-base": "4.0.3",
     "@uifabric/utilities": "4.7.1",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 182bc21341997..89b48ab3d4f93 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -29,7 +29,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": "4.0.2",
+    "@uifabric/example-app-base": "4.0.3",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.7.1 <5.0.0",
-    "@uifabric/styling": ">=0.13.4 <1.0.0",
+    "@uifabric/styling": ">=0.13.5 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 7786676a1f873..af34fd7708360 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.13.5",
+      "tag": "@uifabric/styling_v0.13.5",
+      "date": "Tue, 11 Jul 2017 10:14:04 GMT",
+      "comments": {}
+    },
     {
       "version": "0.13.4",
       "tag": "@uifabric/styling_v0.13.4",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 7701877fb128f..0cb8a8f48c8a6 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Mon, 10 Jul 2017 19:18:55 GMT and should not be manually modified.
+This log was last generated on Tue, 11 Jul 2017 10:14:04 GMT and should not be manually modified.
+
+## 0.13.5
+Tue, 11 Jul 2017 10:14:04 GMT
+
+*Changes not tracked*
 
 ## 0.13.4
 Mon, 10 Jul 2017 19:18:55 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 71f8322d3f7cd..658bf0d8af19d 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.13.4",
+  "version": "0.13.5",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 5929d059746f0016ab140846652d760af36fdbda Mon Sep 17 00:00:00 2001
From: Liaoliang Ye <supersingerman@126.com>
Date: Tue, 11 Jul 2017 15:52:30 +0000
Subject: [PATCH 0236/1641] Expose interface and enum in selectableOption for
 combobox (#2106)

* Expose interface and enum in selectableOption for combobox

* run rush change

* Export from ComboBox directly

* Export property interfaces

* Fix type, export enum from index
---
 ...ableOptionInterfaces_2017-06-30-08-23.json | 11 ++++++
 .../src/components/ComboBox/ComboBox.Props.ts | 15 ++++----
 .../src/components/ComboBox/ComboBox.test.tsx |  6 ++--
 .../src/components/ComboBox/ComboBox.tsx      | 34 +++++++++----------
 .../examples/ComboBox.Basic.Example.tsx       | 15 ++++----
 .../src/components/ComboBox/index.ts          |  1 +
 6 files changed, 50 insertions(+), 32 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/liaye-Combobox-ExposeSelectableOptionInterfaces_2017-06-30-08-23.json

diff --git a/common/changes/office-ui-fabric-react/liaye-Combobox-ExposeSelectableOptionInterfaces_2017-06-30-08-23.json b/common/changes/office-ui-fabric-react/liaye-Combobox-ExposeSelectableOptionInterfaces_2017-06-30-08-23.json
new file mode 100644
index 0000000000000..c3b629f2e5e95
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/liaye-Combobox-ExposeSelectableOptionInterfaces_2017-06-30-08-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Expose APIs of selectableOptions since they're required APIs for ComboBox component",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "liaye@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
index 2a56e8860f64b..e3e642e4d2f46 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
@@ -4,12 +4,15 @@ import { ISelectableDroppableTextProps } from '../../utilities/selectableOption/
 
 export interface IComboBox {
   /**
- * Sets focus to the input in the comboBox
- * @returns True if focus could be set, false if no operation was taken.
- */
+   * Sets focus to the input in the comboBox
+   * @returns True if focus could be set, false if no operation was taken.
+   */
   focus(): boolean;
 }
 
+export interface IComboBoxOption extends ISelectableOption {
+}
+
 export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox> {
   /**
    * Optional callback to access the IComboBox interface. Use this instead of ref for accessing
@@ -20,7 +23,7 @@ export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox>
   /**
    * Collection of options for this ComboBox
    */
-  options?: ISelectableOption[];
+  options?: IComboBoxOption[];
 
   /**
    * Callback issues when either:
@@ -28,13 +31,13 @@ export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox>
    * 2) a manually edited value is submitted. In this case there may not be a matched option if allowFreeform is also true
    *    (and hence only value would be true, the other parameter would be null in this case)
    */
-  onChanged?: (option?: ISelectableOption, index?: number, value?: string) => void;
+  onChanged?: (option?: IComboBoxOption, index?: number, value?: string) => void;
 
   /**
    * Callback issued when the options should be resolved, if they have been updated or
    * if they need to be passed in the first time
    */
-  onResolveOptions?: (options: ISelectableOption[]) => ISelectableOption[] | PromiseLike<ISelectableOption[]>;
+  onResolveOptions?: (options: IComboBoxOption[]) => IComboBoxOption[] | PromiseLike<IComboBoxOption[]>;
 
   /**
    * Whether the ComboBox is free form, meaning that the user input is not bound to provided items. Defaults to false.
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
index e9be6876e1ad2..f57ea34b59ea8 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
@@ -8,15 +8,15 @@ import { KeyCodes } from '../../Utilities';
 let { expect } = chai;
 
 import { ComboBox } from './ComboBox';
-import { ISelectableOption } from '../../utilities/selectableOption/SelectableOption.Props';
+import { IComboBoxOption } from './ComboBox.Props';
 
-const DEFAULT_OPTIONS: ISelectableOption[] = [
+const DEFAULT_OPTIONS: IComboBoxOption[] = [
   { key: '1', text: '1' },
   { key: '2', text: '2' },
   { key: '3', text: '3' }
 ];
 
-const DEFAULT_OPTIONS2: ISelectableOption[] = [
+const DEFAULT_OPTIONS2: IComboBoxOption[] = [
   { key: '1', text: 'One' },
   { key: '2', text: 'Foo' },
   { key: '3', text: 'Bar' }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index fea086c480db6..a1b6b03cd1429 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { IComboBoxProps } from './ComboBox.Props';
+import { IComboBoxOption, IComboBoxProps } from './ComboBox.Props';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { Callout } from '../../Callout';
 import { Label } from '../../Label';
@@ -19,7 +19,7 @@ import {
   getNativeProps,
   KeyCodes
 } from '../../Utilities';
-import { ISelectableOption, SelectableOptionMenuItemType } from '../../utilities/selectableOption/SelectableOption.Props';
+import { SelectableOptionMenuItemType } from '../../utilities/selectableOption/SelectableOption.Props';
 import * as stylesImport from './ComboBox.scss';
 const styles: any = stylesImport;
 
@@ -38,7 +38,7 @@ export interface IComboBoxState {
   suggestedDisplayValue?: string;
 
   // The options currently available for the callout
-  currentOptions?: ISelectableOption[];
+  currentOptions?: IComboBoxOption[];
 
   // when taking input, this will store the index the
   // that the options input matches (-1 if no input or match)
@@ -94,7 +94,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   private _lastReadOnlyAutoCompleteChangeTimeoutId: number;
 
   // Promise used when resolving the comboBox options
-  private _currentPromise: PromiseLike<ISelectableOption[]>;
+  private _currentPromise: PromiseLike<IComboBoxOption[]>;
 
   // The current visible value sent to the auto fill on render
   private _currentVisibleValue;
@@ -389,7 +389,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * @param index - the index to check
    * @returns {boolean} - true if the index is valid for the given options, false otherwise
    */
-  private _indexWithinBounds(options: ISelectableOption[], index: number): boolean {
+  private _indexWithinBounds(options: IComboBoxOption[], index: number): boolean {
     return index >= 0 && index < options.length;
   }
 
@@ -539,7 +539,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
     newIndex = Math.max(0, Math.min(currentOptions.length - 1, newIndex));
 
-    let option: ISelectableOption = currentOptions[newIndex];
+    let option: IComboBoxOption = currentOptions[newIndex];
 
     // attempt to skip headers and dividers
     if ((option.itemType === SelectableOptionMenuItemType.Header ||
@@ -577,7 +577,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     // Are we at a new index? If so, update the state, otherwise
     // there is nothing to do
     if (index !== selectedIndex) {
-      let option: ISelectableOption = currentOptions[index];
+      let option: IComboBoxOption = currentOptions[index];
 
       // Set the selected option
       this.setState({
@@ -630,8 +630,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
         // Ensure that the promise will only use the callback if it was the most recent one
         // and update the state when the promise returns
-        let promise: PromiseLike<ISelectableOption[]> = this._currentPromise = newOptions;
-        promise.then((newOptionsFromPromise: ISelectableOption[]) => {
+        let promise: PromiseLike<IComboBoxOption[]> = this._currentPromise = newOptions;
+        promise.then((newOptionsFromPromise: IComboBoxOption[]) => {
           if (promise === this._currentPromise) {
             this.setState({
               currentOptions: newOptionsFromPromise
@@ -690,8 +690,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       }
 
       // Create a new option
-      let newOption: ISelectableOption = { key: currentPendingValue, text: currentPendingValue };
-      let newOptions: ISelectableOption[] = [...currentOptions, newOption];
+      let newOption: IComboBoxOption = { key: currentPendingValue, text: currentPendingValue };
+      let newOptions: IComboBoxOption[] = [...currentOptions, newOption];
       let newSelectedIndex: number = this._getSelectedIndex(newOptions, currentPendingValue);
 
       this.setState({
@@ -764,7 +764,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
   // Render items
   @autobind
-  private _onRenderItem(item: ISelectableOption): JSX.Element {
+  private _onRenderItem(item: IComboBoxOption): JSX.Element {
     switch (item.itemType) {
       case SelectableOptionMenuItemType.Divider:
         return this._renderSeparator(item);
@@ -776,7 +776,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   }
 
   // Render separator
-  private _renderSeparator(item: ISelectableOption): JSX.Element {
+  private _renderSeparator(item: IComboBoxOption): JSX.Element {
     let { index, key } = item;
     if (index > 0) {
       return <div
@@ -787,7 +787,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     return null;
   }
 
-  private _renderHeader(item: ISelectableOption): JSX.Element {
+  private _renderHeader(item: IComboBoxOption): JSX.Element {
     let { onRenderOption = this._onRenderOption } = this.props;
     return (
       <div key={ item.key } className={ css('ms-ComboBox-header', styles.header) } role='header'>
@@ -797,7 +797,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
   // Render menu item
   @autobind
-  private _renderOption(item: ISelectableOption): JSX.Element {
+  private _renderOption(item: IComboBoxOption): JSX.Element {
     let { onRenderOption = this._onRenderOption } = this.props;
     let id = this._id;
     let isSelected: boolean = this._isOptionSelected(item.index);
@@ -861,7 +861,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
   // Render content of item
   @autobind
-  private _onRenderOption(item: ISelectableOption): JSX.Element {
+  private _onRenderOption(item: IComboBoxOption): JSX.Element {
     return <span className={ css('ms-ComboBox-optionText', styles.optionText) }>{ item.text }</span>;
   }
 
@@ -898,7 +898,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * @param selectedKey - the known selected key to find
    * @returns {number} - the index of the selected option, -1 if not found
    */
-  private _getSelectedIndex(options: ISelectableOption[], selectedKey: string | number): number {
+  private _getSelectedIndex(options: IComboBoxOption[], selectedKey: string | number): number {
     return findIndex(options, (option => (option.isSelected || option.selected || (selectedKey != null) && option.key === selectedKey)));
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
index dc221e04c6a93..2e1ad7ccb7416 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
@@ -1,11 +1,14 @@
 import * as React from 'react';
-import { ComboBox } from 'office-ui-fabric-react/lib/ComboBox';
+import {
+  ComboBox,
+  IComboBoxOption
+} from 'office-ui-fabric-react/lib/ComboBox';
 import './ComboBox.Basic.Example.scss';
 import {
   assign,
   autobind
 } from 'office-ui-fabric-react/lib/Utilities';
-import { ISelectableOption, SelectableOptionMenuItemType } from 'office-ui-fabric-react/lib/utilities/selectableOption/SelectableOption.Props';
+import { SelectableOptionMenuItemType } from 'office-ui-fabric-react/lib/utilities/selectableOption/SelectableOption.Props';
 
 export class ComboBoxBasicExample extends React.Component<any, any> {
   private _testOptions =
@@ -151,7 +154,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
 
   // Render content of item
   @autobind
-  private _onRenderFontOption(item: ISelectableOption): JSX.Element {
+  private _onRenderFontOption(item: IComboBoxOption): JSX.Element {
 
     if (item.itemType === SelectableOptionMenuItemType.Header ||
       item.itemType === SelectableOptionMenuItemType.Divider) {
@@ -177,7 +180,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
   }
 
   @autobind
-  private _getOptions(currentOptions: ISelectableOption[]): ISelectableOption[] {
+  private _getOptions(currentOptions: IComboBoxOption[]): IComboBoxOption[] {
 
     if (this.state.options.length > 0) {
       return this.state.options;
@@ -210,7 +213,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
   }
 
   @autobind
-  private _onChanged(option: ISelectableOption, index: number, value: string) {
+  private _onChanged(option: IComboBoxOption, index: number, value: string) {
     if (option !== null) {
       this.setState({
         selectedOptionKey: option.key,
@@ -222,7 +225,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
         value: null
       });
     } else if (value !== null) {
-      let newOption: ISelectableOption = { key: value, text: value };
+      let newOption: IComboBoxOption = { key: value, text: value };
 
       this.setState({
         options: [...this.state.options, newOption],
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/index.ts b/packages/office-ui-fabric-react/src/components/ComboBox/index.ts
index fddc1b1ca5ba7..96a5a7b2b47b8 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/index.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/index.ts
@@ -1,2 +1,3 @@
+export { SelectableOptionMenuItemType } from '../../utilities/selectableOption/SelectableOption.Props';
 export * from './ComboBox';
 export * from './ComboBox.Props';

From ce314d75b908fa19e7e38fdf9c52c8312f9727c0 Mon Sep 17 00:00:00 2001
From: Boris Emorine <boris.emorine@gmail.com>
Date: Tue, 11 Jul 2017 11:17:33 -0700
Subject: [PATCH 0237/1641] SplitButton Minor Fixes (#2143)

Fixes minor styling issues with SplitButton.
Add a new splitButton boolean property to ensure that we want to render the button as a SplitButton.
---
 ...emor-splitbutton-fix_2017-07-06-18-06.json | 11 ++++++
 .../src/components/Button/BaseButton.tsx      | 13 +++++--
 .../src/components/Button/Button.Props.ts     |  7 +++-
 .../src/components/Button/Button.test.tsx     | 35 ++++++++++++++++++-
 .../Button/SplitButton/SplitButton.styles.ts  |  6 ++--
 .../Button/examples/Button.Split.Example.tsx  |  2 ++
 packages/utilities/api/utilities.api.ts       |  8 +++++
 packages/utilities/src/BaseComponent.ts       | 14 +++++++-
 packages/utilities/src/warn.test.ts           | 22 +++++++++++-
 packages/utilities/src/warn.ts                | 28 +++++++++++++++
 10 files changed, 137 insertions(+), 9 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/boemor-splitbutton-fix_2017-07-06-18-06.json

diff --git a/common/changes/office-ui-fabric-react/boemor-splitbutton-fix_2017-07-06-18-06.json b/common/changes/office-ui-fabric-react/boemor-splitbutton-fix_2017-07-06-18-06.json
new file mode 100644
index 0000000000000..aabad0c877a46
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/boemor-splitbutton-fix_2017-07-06-18-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix styling issues with SplitButton. Add new split boolean property to Button.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "boemor@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index b62602e2916a9..abcb72c34982e 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -30,7 +30,7 @@ export interface IBaseButtonState {
 export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState> implements IButton {
 
   private get _isSplitButton(): boolean {
-    return (!!this.props.menuProps && !!this.props.onClick);
+    return (!!this.props.menuProps && !!this.props.onClick) && this.props.split === true;
   }
 
   private get _isExpanded(): boolean {
@@ -40,7 +40,8 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   public static defaultProps = {
     baseClassName: 'ms-Button',
     classNames: {},
-    styles: {}
+    styles: {},
+    split: false
   };
 
   private _buttonElement: HTMLElement;
@@ -52,6 +53,12 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   constructor(props: IBaseButtonProps, rootClassName: string) {
     super(props);
 
+    this._warnConditionallyRequiredProps(
+      ['menuProps', 'onClick'],
+      'split',
+      this.props.split
+    );
+
     this._warnDeprecations({
       rootProps: null,
       icon: 'iconProps',
@@ -356,7 +363,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         tabIndex={ 0 }
         onKeyDown={ this.props.disabled ? null : this._onSplitButtonKeyDown }
       >
-        <span aria-hidden={ true }>
+        <span aria-hidden={ true } style={ { 'display': 'flex' } }>
           { this._onRenderContent(tag, buttonProps) }
           { this._onRenderSplitButtonMenuButton() }
         </span>
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
index 6d5136f6cd50d..268d1ce54e80f 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
@@ -76,10 +76,15 @@ export interface IButtonProps extends React.HTMLAttributes<HTMLButtonElement | H
 
   /**
    * Props for button menu. Providing this will default to showing the menu icon. See menuIconProps for overriding
-   * how the default icon looks. Providing this in addition of onClick will render a SplitButton.
+   * how the default icon looks. Providing this in addition of onClick and setting the split property to true will render a SplitButton.
    */
   menuProps?: IContextualMenuProps;
 
+  /**
+   * If set to true, and if menuProps and onClick are provided, the button will render as a SplitButton. Defaults to false.
+   */
+  split?: boolean;
+
   /**
    * The props for the icon shown when providing a menu dropdown.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
index f2219ac726bdf..4bcc7532c4217 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
@@ -90,7 +90,7 @@ describe('DefaultButton', () => {
     });
   });
 
-  it('Providing onClick and menuProps renders a SplitButton', () => {
+  it('Providing onClick and menuProps does not render a SplitButton', () => {
     const button = ReactTestUtils.renderIntoDocument<any>(
       <DefaultButton
         data-automation-id='test'
@@ -113,6 +113,33 @@ describe('DefaultButton', () => {
       />
     );
     const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+    expect(renderedDOM.tagName).not.equal('DIV', 'A Button with a menuProps and an onClick renders as a SplitButton');
+  });
+
+  it('Providing onClick, menuProps and setting splitButton to true renders a SplitButton', () => {
+    const button = ReactTestUtils.renderIntoDocument<any>(
+      <DefaultButton
+        data-automation-id='test'
+        text='Create account'
+        split={ true }
+        onClick={ () => alert('Clicked') }
+        menuProps={ {
+          items: [
+            {
+              key: 'emailMessage',
+              name: 'Email message',
+              icon: 'Mail'
+            },
+            {
+              key: 'calendarEvent',
+              name: 'Calendar event',
+              icon: 'Calendar'
+            }
+          ]
+        } }
+      />
+    );
+    const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
     expect(renderedDOM.tagName).equal('DIV', 'A Button with a menuProps and an onClick renders as a SplitButton');
   });
 
@@ -122,6 +149,7 @@ describe('DefaultButton', () => {
       <DefaultButton
         data-automation-id='test'
         text='Create account'
+        split={ true }
         onClick={ () => alert('Clicked') }
         menuProps={ {
           items: [
@@ -151,6 +179,7 @@ describe('DefaultButton', () => {
       <DefaultButton
         data-automation-id='test'
         text='Create account'
+        split={ true }
         onClick={ () => { didClick = true; } }
         menuProps={ {
           items: [
@@ -180,6 +209,7 @@ describe('DefaultButton', () => {
       <DefaultButton
         data-automation-id='test'
         text='Create account'
+        split={ true }
         onClick={ () => { didClick = true; } }
         menuProps={ {
           items: [
@@ -211,6 +241,7 @@ describe('DefaultButton', () => {
       <DefaultButton
         data-automation-id='test'
         text='Create account'
+        split={ true }
         onClick={ () => { didClick = true; } }
         menuProps={ {
           items: [
@@ -245,6 +276,7 @@ describe('DefaultButton', () => {
         disabled={ true }
         data-automation-id='test'
         text='Create account'
+        split={ true }
         onClick={ () => { didClick = true; } }
         menuProps={ {
           items: [
@@ -279,6 +311,7 @@ describe('DefaultButton', () => {
         disabled={ true }
         data-automation-id='test'
         text='Create account'
+        split={ true }
         onClick={ () => { didClick = true; } }
         menuProps={ {
           items: [
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
index b7e1f63fd0758..8e7a25dcbf9fa 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
@@ -14,7 +14,8 @@ export const getStyles = memoizeFunction((
 ): ISplitButtonStyles => {
   let iconButtonStyles: ISplitButtonStyles = {
     splitButtonContainer: {
-      position: 'absolute',
+      position: 'relative',
+      display: 'inline-block',
       border: '1px solid transparent',
       ':hover': {
         border: '1px solid',
@@ -34,9 +35,10 @@ export const getStyles = memoizeFunction((
     splitButtonMenuButton: {
       backgroundColor: theme.palette.neutralLighter,
       padding: '6px',
+      height: 'auto',
       ':hover': {
         backgroundColor: theme.palette.neutralLight
-      }
+      },
     },
 
     splitButtonMenuButtonDisabled: {
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
index 2f244d5c8f3ca..d83cbb50c1001 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
@@ -20,6 +20,7 @@ export class ButtonSplitExample extends React.Component<IButtonProps, {}> {
           checked={ checked }
           text='Create account'
           onClick={ () => alert('Clicked') }
+          split={ true }
           menuProps={ {
             items: [
               {
@@ -59,6 +60,7 @@ export class ButtonSplitCustomExample extends React.Component<IButtonProps, {}>
           iconProps={ { iconName: 'Emoji2' } }
           text='Create account'
           onClick={ () => alert('Clicked') }
+          split={ true }
           styles={ style }
           menuProps={ {
             items: [
diff --git a/packages/utilities/api/utilities.api.ts b/packages/utilities/api/utilities.api.ts
index 1ee306fd0d1a3..1df8642e9109a 100644
--- a/packages/utilities/api/utilities.api.ts
+++ b/packages/utilities/api/utilities.api.ts
@@ -47,6 +47,7 @@ class BaseComponent<P extends IBaseProps, S> extends React.Component<P, S> {
   protected readonly _events: EventGroup;
   protected _resolveRef(refName: string): (ref: any) => any;
   protected _shouldUpdateComponentRef: boolean;
+  protected _warnConditionallyRequiredProps(requiredProps: string[], conditionalPropName: string, condition: boolean): void;
   public static onError: ((errorMessage?: string, ex?: any) => void);
 }
 
@@ -461,6 +462,13 @@ export function unhoistMethods(source: any, methodNames: string[]): void;
 // @public
 export function warn(message: string): void;
 
+// @public
+export function warnConditionallyRequiredProps < P >(componentName: string,
+  props: P,
+  requiredProps: string[],
+  conditionalPropName: string,
+  condition: boolean): void;
+
 // @public
 export function warnDeprecations < P >(componentName: string,
   props: P,
diff --git a/packages/utilities/src/BaseComponent.ts b/packages/utilities/src/BaseComponent.ts
index cdaabf63843b5..d96ede877ff6c 100644
--- a/packages/utilities/src/BaseComponent.ts
+++ b/packages/utilities/src/BaseComponent.ts
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { Async } from './Async';
 import { EventGroup } from './EventGroup';
 import { IDisposable } from './IDisposable';
-import { warnDeprecations, warnMutuallyExclusive, ISettingsMap } from './warn';
+import { warnDeprecations, warnMutuallyExclusive, warnConditionallyRequiredProps, ISettingsMap } from './warn';
 
 /**
  * BaseProps interface.
@@ -201,6 +201,18 @@ export class BaseComponent<P extends IBaseProps, S> extends React.Component<P, S
   protected _warnMutuallyExclusive(mutuallyExclusiveMap: ISettingsMap<P>) {
     warnMutuallyExclusive(this.className, this.props, mutuallyExclusiveMap);
   }
+
+  /**
+   * Warns when props are required if a condition is met.
+   *
+   * @param requiredProps - The name of the props that are required when the condition is met.
+   * @param conditionalPropName - The name of the prop that the condition is based on.
+   * @param condition - Whether the condition is met.
+   */
+  protected _warnConditionallyRequiredProps(requiredProps: string[], conditionalPropName: string, condition: boolean): void {
+    warnConditionallyRequiredProps(this.className, this.props, requiredProps, conditionalPropName, condition);
+  }
+
 }
 
 /**
diff --git a/packages/utilities/src/warn.test.ts b/packages/utilities/src/warn.test.ts
index 23e7915a978b6..250eafe9c2dc5 100644
--- a/packages/utilities/src/warn.test.ts
+++ b/packages/utilities/src/warn.test.ts
@@ -1,7 +1,8 @@
 import {
   setWarningCallback,
   warnDeprecations,
-  warnMutuallyExclusive
+  warnMutuallyExclusive,
+  warnConditionallyRequiredProps
 } from './warn';
 import { expect } from 'chai';
 
@@ -49,3 +50,22 @@ describe('warnMutuallyExclusive', () => {
     expect(_lastWarning).equals(`Foo property 'foo' is mutually exclusive with 'bar'. Use one or the other.`);
   });
 });
+
+describe('warnConditionallyRequiredProps', () => {
+  beforeEach(() => {
+    _lastWarning = undefined;
+    setWarningCallback(message => _lastWarning = message);
+  });
+
+  afterEach(() => setWarningCallback(undefined));
+
+  it('does not warn when unnecessary', () => {
+    warnConditionallyRequiredProps('Foo', { Foo: 1, Bar: 1 }, ['Foo', 'Bar'], 'Foo', 'foo' === 'foo');
+    expect(_lastWarning).equals(undefined);
+  });
+
+  it('can warn on required props', () => {
+    warnConditionallyRequiredProps('Foo', { Foo: 1, bar: 1 }, ['Foo', 'Bar'], 'Foo', 'foo' === 'foo');
+    expect(_lastWarning).equals(`Foo property 'Bar' is required when 'Foo' is used.'`);
+  });
+});
diff --git a/packages/utilities/src/warn.ts b/packages/utilities/src/warn.ts
index b08e004e0d19c..c5281bd8fb991 100644
--- a/packages/utilities/src/warn.ts
+++ b/packages/utilities/src/warn.ts
@@ -56,6 +56,34 @@ export function warnMutuallyExclusive<P>(
   }
 }
 
+/**
+ * Warns when props are required if a condition is met.
+ *
+ * @public
+ * @param componentName - The name of the component being used.
+ * @param props - The props passed into the component.
+ * @param requiredProps - The name of the props that are required when the condition is met.
+ * @param conditionalPropName - The name of the prop that the condition is based on.
+ * @param condition - Whether the condition is met.
+*/
+export function warnConditionallyRequiredProps<P>(
+  componentName: string,
+  props: P,
+  requiredProps: string[],
+  conditionalPropName: string,
+  condition: boolean): void {
+
+  if (condition === true) {
+    for (const requiredPropName of requiredProps) {
+      if (!(requiredPropName in props)) {
+        _warningCallback(
+          `${componentName} property '${requiredPropName}' is required when '${conditionalPropName}' is used.'`
+        );
+      }
+    }
+  }
+}
+
 /**
  * Sends a warning to console, if the api is present.
  *

From c4bb4fb265f4c40620110700b78186311e8b8063 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Tue, 11 Jul 2017 13:47:09 -0700
Subject: [PATCH 0238/1641] Enable 'noImplicitAny' in office-ui-fabric-react
 (#2159)

* fix visual test root, selection interfaces.

* Fix router

* fix positioning

* No implicit any on colors.ts

* Fix people picker

* Fix text field test

* Fix List issues

* Fix index.tsx and groupedlistsections.tsx

* Fix dropdown

* Fix detailslist.basic.example.tsx

* Fix details list examples

* Fix some examples

* More fixes

* More fixes

* More fixes

* More fixes

* More fixes

* More fixes

* More fixes

* Fix remaining issues, enable tsconfig

* Rush change

* fix onrenderLabel type definition
---
 ...oufr-no-implicit-any_2017-07-07-15-08.json | 11 ++++++++++
 ...oufr-no-implicit-any_2017-07-07-15-08.json | 11 ++++++++++
 ...oufr-no-implicit-any_2017-07-07-15-08.json | 11 ++++++++++
 ...oufr-no-implicit-any_2017-07-07-15-08.json | 11 ++++++++++
 .../src/VisualTestRoot.tsx                    | 16 +++++++-------
 .../src/common/ConnectedHost.tsx              |  4 ++--
 .../src/common/connect.test.tsx               |  2 +-
 .../src/common/connect.tsx                    |  4 ++--
 .../src/components/Button/BaseButton.tsx      |  6 ++---
 .../src/components/Button/Button.test.tsx     |  8 +++----
 .../src/components/Calendar/CalendarDay.tsx   |  9 ++++----
 .../src/components/Callout/CalloutContent.tsx |  2 +-
 .../examples/Callout.Cover.Example.tsx        |  2 +-
 .../examples/Callout.Directional.Example.tsx  |  2 +-
 .../ChoiceGroup/ChoiceGroup.Props.ts          |  2 +-
 .../components/ChoiceGroup/ChoiceGroup.tsx    |  2 +-
 .../src/components/ComboBox/ComboBox.tsx      |  8 +++----
 .../src/components/CommandBar/CommandBar.tsx  |  8 +++----
 .../examples/CommandBar.Basic.Example.tsx     |  6 ++---
 .../CommandBar.Customization.Example.tsx      |  8 +++----
 .../ContextualMenu/ContextualMenu.tsx         |  4 ++--
 .../ContextualMenu.Customization.Example.tsx  |  2 +-
 .../ContextualMenu.Directional.Example.tsx    |  2 +-
 .../examples/DatePicker.Basic.Example.tsx     |  2 +-
 .../components/DetailsList/DetailsHeader.tsx  |  4 ++--
 .../src/components/DetailsList/DetailsRow.tsx |  2 +-
 .../DetailsList/DetailsRowFields.tsx          |  2 +-
 .../examples/DetailsList.Advanced.Example.tsx |  8 +++----
 .../examples/DetailsList.Basic.Example.tsx    |  2 +-
 .../DetailsList.CustomColumns.Example.tsx     |  4 ++--
 .../DetailsList.CustomRows.Example.tsx        |  9 ++++----
 .../examples/DetailsList.DragDrop.Example.tsx |  8 +++----
 .../examples/DetailsList.Grouped.Example.tsx  |  2 +-
 .../DetailsList.NavigatingFocus.Example.tsx   | 11 +++++++---
 .../src/components/Dialog/Dialog.test.tsx     |  2 +-
 .../src/components/Dropdown/Dropdown.tsx      | 10 ++++-----
 .../examples/Dropdown.Basic.Example.tsx       |  2 +-
 .../FocusTrapZone/FocusTrapZone.tsx           |  2 +-
 .../FocusTrapZone.Box.Click.Example.tsx       |  2 +-
 .../examples/FocusTrapZone.Box.Example.tsx    |  2 +-
 ...pZone.Box.FocusOnCustomElement.Example.tsx |  2 +-
 .../components/FocusZone/FocusZone.test.tsx   | 10 ++++-----
 .../src/components/FocusZone/FocusZone.tsx    |  2 +-
 .../components/GroupedList/GroupHeader.tsx    |  2 +-
 .../components/GroupedList/GroupedList.tsx    |  6 ++---
 .../GroupedList/GroupedListSection.tsx        |  7 +++---
 .../src/components/HoverCard/HoverCard.tsx    |  2 +-
 .../examples/HoverCard.Basic.Example.tsx      |  2 +-
 .../src/components/Icon/Icon.tsx              |  2 +-
 .../src/components/Layer/Layer.tsx            |  2 +-
 .../src/components/List/List.tsx              | 16 +++++++-------
 .../src/components/List/ListPage.tsx          |  2 +-
 .../List/examples/List.Grid.Example.tsx       |  7 +++---
 .../List/examples/List.Scrolling.Example.tsx  |  2 +-
 .../src/components/Nav/Nav.tsx                |  2 +-
 .../examples/Nav.FabricDemoApp.Example.tsx    |  2 +-
 .../examples/OverflowSet.Custom.Example.tsx   |  2 +-
 .../Pivot/examples/Pivot.Remove.Example.tsx   |  2 +-
 .../ResizeGroup/ResizeGroup.test.tsx          |  2 +-
 .../ResizeGroup.OverflowSet.Example.tsx       | 10 ++++-----
 .../src/components/Slider/Slider.test.tsx     |  2 +-
 .../src/components/Slider/Slider.tsx          |  2 +-
 .../src/components/SpinButton/SpinButton.tsx  |  2 +-
 .../components/TextField/TextField.test.tsx   | 10 ++++-----
 .../src/components/TextField/TextField.tsx    |  4 ++--
 .../TextField/examples/NumberTextField.tsx    |  2 +-
 .../examples/TextField.Basic.Example.tsx      |  2 +-
 .../src/components/Theme/ThemePage.tsx        |  4 ++--
 .../src/components/Toggle/Toggle.test.tsx     |  2 +-
 .../components/pickers/BasePicker.test.tsx    |  4 ++--
 .../src/components/pickers/BasePicker.tsx     |  4 ++--
 .../pickers/PeoplePicker/PeoplePicker.tsx     | 15 +++++++------
 .../examples/PeoplePicker.Types.Example.tsx   |  2 +-
 .../pickers/Suggestions/Suggestions.tsx       |  2 +-
 .../pickers/TagPicker/TagPicker.tsx           |  3 ++-
 .../examples/Picker.CustomResult.Example.tsx  |  5 +++--
 .../src/demo/AppDefinition.tsx                |  4 ++--
 .../office-ui-fabric-react/src/demo/index.tsx |  6 ++---
 .../src/utilities/color/colors.ts             | 16 +++++++-------
 .../decorators/withContainsFocus.tsx          |  6 ++---
 .../src/utilities/grid/Grid.tsx               |  2 +-
 .../src/utilities/positioning.ts              | 10 ++++-----
 .../src/utilities/router/Router.tsx           |  6 ++---
 .../selection/SelectionZone.test.tsx          |  2 +-
 .../src/utilities/selection/SelectionZone.tsx |  2 +-
 .../src/utilities/selection/interfaces.ts     | 22 +++++++++----------
 packages/office-ui-fabric-react/tsconfig.json |  1 +
 87 files changed, 246 insertions(+), 195 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/oufr-no-implicit-any_2017-07-07-15-08.json
 create mode 100644 common/changes/@uifabric/fabric-website/oufr-no-implicit-any_2017-07-07-15-08.json
 create mode 100644 common/changes/@uifabric/styling/oufr-no-implicit-any_2017-07-07-15-08.json
 create mode 100644 common/changes/office-ui-fabric-react/oufr-no-implicit-any_2017-07-07-15-08.json

diff --git a/common/changes/@uifabric/example-app-base/oufr-no-implicit-any_2017-07-07-15-08.json b/common/changes/@uifabric/example-app-base/oufr-no-implicit-any_2017-07-07-15-08.json
new file mode 100644
index 0000000000000..8986a3dbd61f2
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/oufr-no-implicit-any_2017-07-07-15-08.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "<christianjordangonzalez@gmail.com>"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/oufr-no-implicit-any_2017-07-07-15-08.json b/common/changes/@uifabric/fabric-website/oufr-no-implicit-any_2017-07-07-15-08.json
new file mode 100644
index 0000000000000..fa5fca5c645eb
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/oufr-no-implicit-any_2017-07-07-15-08.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "<christianjordangonzalez@gmail.com>"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/oufr-no-implicit-any_2017-07-07-15-08.json b/common/changes/@uifabric/styling/oufr-no-implicit-any_2017-07-07-15-08.json
new file mode 100644
index 0000000000000..e6b8f7e62cafd
--- /dev/null
+++ b/common/changes/@uifabric/styling/oufr-no-implicit-any_2017-07-07-15-08.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "<christianjordangonzalez@gmail.com>"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/oufr-no-implicit-any_2017-07-07-15-08.json b/common/changes/office-ui-fabric-react/oufr-no-implicit-any_2017-07-07-15-08.json
new file mode 100644
index 0000000000000..dc4f783256546
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/oufr-no-implicit-any_2017-07-07-15-08.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Enable noImplicitAny",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "<christianjordangonzalez@gmail.com>"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/VisualTestRoot.tsx b/packages/office-ui-fabric-react/src/VisualTestRoot.tsx
index 1679579cc7fba..985f0c5b81de9 100644
--- a/packages/office-ui-fabric-react/src/VisualTestRoot.tsx
+++ b/packages/office-ui-fabric-react/src/VisualTestRoot.tsx
@@ -8,9 +8,9 @@ import { setBaseUrl } from './Utilities';
 
 setBaseUrl('./dist/');
 
-let rootElement;
+let rootElement: HTMLElement;
 let currentBreakpoint;
-let scrollDistance;
+let scrollDistance: number;
 let requireContext = require.context('./components', true, /Page.visualtest$/);
 
 // This is mostly taken from the react-website project.
@@ -27,11 +27,11 @@ function _routerDidMount() {
   }
 }
 
-function _hasAnchorLink(path) {
+function _hasAnchorLink(path: string) {
   return (path.match(/#/g) || []).length > 1;
 }
 
-function _extractAnchorLink(path) {
+function _extractAnchorLink(path: string) {
   let split = path.split('#');
   let cleanedSplit = split.filter((value) => {
     if (value === '') {
@@ -57,8 +57,8 @@ function _onLoad() {
     rootElement);
 }
 
-function _getAppRoutes() {
-  let routes = [];
+function _getAppRoutes(): JSX.Element[] {
+  let routes: JSX.Element[] = [];
 
   // Create a route for each top level page, and all of its sub pages
   VisualTestState.componentPath.forEach((path, pathIndex) => {
@@ -74,8 +74,8 @@ function _getAppRoutes() {
   return routes;
 }
 
-function getPath(path) {
-  return (cb => require.ensure([], () => cb((requireContext(path) as any).default)));
+function getPath(path: string) {
+  return ((cb: any) => require.ensure([], () => cb((requireContext(path) as any).default)));
 }
 
 function _onUnload() {
diff --git a/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx b/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx
index 38df9704d75e9..f42f4b07d4fcb 100644
--- a/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx
+++ b/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx
@@ -73,11 +73,11 @@ export class ConnectedHost extends BaseComponent<IConnectedHostProps, IConnected
     this._isMounted = false;
   }
 
-  public componentWillReceiveProps(newProps) {
+  public componentWillReceiveProps(newProps: IConnectedHostProps) {
     this._updateProps(newProps);
   }
 
-  public shouldComponentUpdate(newProps: IConnectedHostProps, newState) {
+  public shouldComponentUpdate(newProps: IConnectedHostProps, newState: IConnectedHostState) {
     let inputPropsHaveChanged = !shallowCompare(this.props.componentProps, newProps.componentProps);
     let computedPropsHaveChanged = !shallowCompare(this.state.props, newState.props);
     let shouldUpdate = inputPropsHaveChanged || computedPropsHaveChanged;
diff --git a/packages/office-ui-fabric-react/src/common/connect.test.tsx b/packages/office-ui-fabric-react/src/common/connect.test.tsx
index 1275e1ddd6d99..dce7d1beee73f 100644
--- a/packages/office-ui-fabric-react/src/common/connect.test.tsx
+++ b/packages/office-ui-fabric-react/src/common/connect.test.tsx
@@ -40,7 +40,7 @@ class AddStore extends BaseStore implements ISubscribable {
 class HelloStore extends BaseStore implements IHelloStore {
   public message: string = '';
 
-  public say(message) {
+  public say(message: string) {
     this.message = message;
     this.emitChange();
   }
diff --git a/packages/office-ui-fabric-react/src/common/connect.tsx b/packages/office-ui-fabric-react/src/common/connect.tsx
index bb196b52f4777..38e860666c47c 100644
--- a/packages/office-ui-fabric-react/src/common/connect.tsx
+++ b/packages/office-ui-fabric-react/src/common/connect.tsx
@@ -5,7 +5,7 @@ import { IStoreKey } from './storeKey';
 export function connect<ORIGINAL_PROPS, NEW_PROPS>(
   component: React.ComponentClass<ORIGINAL_PROPS> | React.StatelessComponent<ORIGINAL_PROPS>,
   storesToSubscribe: IStoreKey<any>[],
-  getProps: (props: ORIGINAL_PROPS, ...stores) => NEW_PROPS
+  getProps: (props: ORIGINAL_PROPS, ...stores: any[]) => NEW_PROPS
 ): React.StatelessComponent<NEW_PROPS> {
 
   return (props: NEW_PROPS) => (
@@ -14,6 +14,6 @@ export function connect<ORIGINAL_PROPS, NEW_PROPS>(
       componentProps={ props }
       getProps={ getProps }
       storesToSubscribe={ storesToSubscribe }
-      />
+    />
   );
 }
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index abcb72c34982e..3059694014a0a 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -119,8 +119,8 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       ariaDescribedBy = _ariaDescriptionId;
     } else if (description) {
       ariaDescribedBy = _descriptionId;
-    } else if (nativeProps['aria-describedby']) {
-      ariaDescribedBy = nativeProps['aria-describedby'];
+    } else if ((nativeProps as any)['aria-describedby']) {
+      ariaDescribedBy = (nativeProps as any)['aria-describedby'];
     } else {
       ariaDescribedBy = null;
     }
@@ -137,7 +137,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         'aria-label': ariaLabel,
         'aria-labelledby': ariaLabel ? null : _labelId,
         'aria-describedby': ariaDescribedBy,
-        'data-is-focusable': (this.props['data-is-focusable'] === false || disabled) ? false : true,
+        'data-is-focusable': ((this.props as any)['data-is-focusable'] === false || disabled) ? false : true,
         'aria-pressed': checked
       }
     );
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
index 4bcc7532c4217..3402e3ae6a146 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
@@ -26,7 +26,7 @@ describe('DefaultButton', () => {
   });
 
   it('can render with an onClick.', () => {
-    let onClick = () => null;
+    let onClick: () => null = () => null;
 
     const button = ReactTestUtils.renderIntoDocument<any>(
       <DefaultButton onClick={ onClick }>Hello</DefaultButton>
@@ -46,7 +46,7 @@ describe('DefaultButton', () => {
   });
 
   describe('with menuProps', () => {
-    let button;
+    let button: Element;
 
     before(() => {
       const wrapper = ReactTestUtils.renderIntoDocument<any>(
@@ -61,7 +61,7 @@ describe('DefaultButton', () => {
   });
 
   describe('without menuProps', () => {
-    let button;
+    let button: Element;
 
     before(() => {
       const wrapper = ReactTestUtils.renderIntoDocument<any>(
@@ -76,7 +76,7 @@ describe('DefaultButton', () => {
   });
 
   describe('with menuIconProps', () => {
-    let button;
+    let button: Element;
 
     before(() => {
       const wrapper = ReactTestUtils.renderIntoDocument<any>(
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index afa4b3b830853..7d08de397505b 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -253,8 +253,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
     let { navigatedDate, selectedDate, dateRangeType, firstDayOfWeek, today } = propsToUse;
     let date = new Date(navigatedDate.getFullYear(), navigatedDate.getMonth(), 1);
     let todaysDate = today || new Date();
-    let weeks = [];
-    let week;
+    let weeks: IDayInfo[][] = [];
 
     // Cycle the date backwards to get to the first day of the week.
     while (date.getDay() !== firstDayOfWeek) {
@@ -267,15 +266,15 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
     let selectedDates = getDateRangeArray(selectedDate, dateRangeType, firstDayOfWeek);
 
     for (let weekIndex = 0; !isAllDaysOfWeekOutOfMonth; weekIndex++) {
-      week = [];
+      let week: IDayInfo[] = [];
 
       isAllDaysOfWeekOutOfMonth = true;
 
       for (let dayIndex = 0; dayIndex < DAYS_IN_WEEK; dayIndex++) {
         let originalDate = new Date(date.toString());
-        let dayInfo = {
+        let dayInfo: IDayInfo = {
           key: date.toString(),
-          date: date.getDate(),
+          date: date.getDate().toString(),
           originalDate: originalDate,
           isInMonth: date.getMonth() === navigatedDate.getMonth(),
           isToday: compareDates(todaysDate, date),
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index 921643b7ac382..0142e060f6757 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -130,7 +130,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
     };
 
     let directionalClassName = (positions && positions.directionalClassName)
-      ? AnimationClassNames[positions.directionalClassName]
+      ? (AnimationClassNames as any)[positions.directionalClassName]
       : '';
 
     let contentMaxHeight: number = this._getMaxHeight() + this.state.heightOffset;
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
index 3069fe6bdd829..3d427be6c5f16 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
@@ -101,7 +101,7 @@ export class CalloutCoverExample extends React.Component<any, ICalloutCoverExamp
 
   private _onDirectionalChanged(option: IDropdownOption) {
     this.setState({
-      directionalHint: DirectionalHint[option.key]
+      directionalHint: (DirectionalHint as any)[option.key]
     });
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
index 820ba1fa8df2f..668b8bf97ab13 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
@@ -129,7 +129,7 @@ export class CalloutDirectionalExample extends React.Component<any, ICalloutDire
   @autobind
   private _onDirectionalChanged(option: IDropdownOption) {
     this.setState({
-      directionalHint: DirectionalHint[option.key]
+      directionalHint: (DirectionalHint as any)[option.key]
     });
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts
index 6e5b2a97066ad..04793eedd07fb 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts
@@ -65,7 +65,7 @@ export interface IChoiceGroupOption {
   /**
    * Optional override of option render
    */
-  onRenderLabel?: (IChoiceGroupOption) => JSX.Element;
+  onRenderLabel?: (option: IChoiceGroupOption) => JSX.Element;
 
   /**
    * The Icon component props for choice field
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
index 3877fbc31efed..d49580854b713 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
@@ -20,7 +20,7 @@ export interface IChoiceGroupState {
 }
 
 export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupState> {
-  public static defaultProps = {
+  public static defaultProps: IChoiceGroupProps = {
     options: []
   };
 
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index a1b6b03cd1429..18e97e90376f5 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -57,7 +57,7 @@ enum SearchDirection {
 
 export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
-  public static defaultProps = {
+  public static defaultProps: IComboBoxProps = {
     options: [],
     allowFreeform: false,
     autoComplete: true,
@@ -97,7 +97,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   private _currentPromise: PromiseLike<IComboBoxOption[]>;
 
   // The current visible value sent to the auto fill on render
-  private _currentVisibleValue;
+  private _currentVisibleValue: string;
 
   constructor(props?: IComboBoxProps) {
     super(props);
@@ -870,7 +870,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * to select the item and also close the menu
    * @param index - the index of the item that was clicked
    */
-  private _onItemClick(index) {
+  private _onItemClick(index: number) {
     this._setSelectedIndex(index);
     this.setState({
       isOpen: false
@@ -936,7 +936,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * @param currentPendingValueValidIndex - new pending value index to set
    * @param suggestedDisplayValue - new suggest display value to set
    */
-  private _setPendingInfo(currentPendingValue: string, currentPendingValueValidIndex: number, suggestedDisplayValue) {
+  private _setPendingInfo(currentPendingValue: string, currentPendingValueValidIndex: number, suggestedDisplayValue: string) {
     this.setState({
       currentPendingValue: currentPendingValue,
       currentPendingValueValidIndex: currentPendingValueValidIndex,
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 58cd3c0296cb4..3cd26b5c51e35 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -36,7 +36,7 @@ export interface ICommandBarState {
 }
 
 export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState> implements ICommandBar {
-  public static defaultProps = {
+  public static defaultProps: ICommandBarProps = {
     items: [],
     overflowItems: [],
     farItems: []
@@ -334,7 +334,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
     });
   }
 
-  private _onItemClick(ev, item) {
+  private _onItemClick(ev: React.MouseEvent<HTMLButtonElement>, item: IContextualMenuItem) {
     if (item.key === this.state.expandedMenuItemKey || !hasSubmenuItems(item)) {
       this._onContextMenuDismiss();
     } else {
@@ -351,7 +351,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
   }
 
   @autobind
-  private _onOverflowClick(ev) {
+  private _onOverflowClick(ev: React.MouseEvent<HTMLButtonElement>) {
     if (this.state.expandedMenuItemKey === OVERFLOW_KEY) {
       this._onContextMenuDismiss();
     } else {
@@ -384,7 +384,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
     }
   }
 
-  private _getStateFromProps(nextProps: ICommandBarProps) {
+  private _getStateFromProps(nextProps: ICommandBarProps): ICommandBarState {
     return {
       renderedItems: nextProps.items || [],
       renderedOverflowItems: null,
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
index 4506d99dbaf68..30359948d8d4f 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
@@ -18,17 +18,17 @@ export class CommandBarBasicExample extends React.Component<any, any> {
     let { items, overflowItems, farItems } = this.props;
     let { isSearchBoxVisible: searchBoxVisible, areIconsVisible: iconsVisible, areNamesVisible: namesVisible } = this.state;
 
-    let filteredItems = items.map(item => assign({}, item, {
+    let filteredItems = items.map((item: any) => assign({}, item, {
       name: namesVisible ? item.name : '',
       icon: iconsVisible ? item.icon : ''
     }));
 
-    let filteredOverflowItems = overflowItems.map(item => assign({}, item, {
+    let filteredOverflowItems = overflowItems.map((item: any) => assign({}, item, {
       name: namesVisible ? item.name : '',
       icon: iconsVisible ? item.icon : ''
     }));
 
-    let filteredFarItems = farItems.map(item => assign({}, item, {
+    let filteredFarItems = farItems.map((item: any) => assign({}, item, {
       name: namesVisible ? item.name : '',
       icon: iconsVisible ? item.icon : ''
     }));
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
index 9d9c5b616b0e5..b5ced85cb4061 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
@@ -9,10 +9,10 @@ export interface ISplitDropDownButtonState {
   isContextMenuShown: boolean;
 }
 
-export class CommandBarCustomizationExample extends React.Component<any, ISplitDropDownButtonState> {
+export class CommandBarCustomizationExample extends React.Component<{}, ISplitDropDownButtonState> {
   private container: HTMLElement;
 
-  constructor(props) {
+  constructor(props: {}) {
     super(props);
     this.state = { isContextMenuShown: false };
   }
@@ -91,13 +91,13 @@ export class CommandBarCustomizationExample extends React.Component<any, ISplitD
   }
 
   @autobind
-  private onClickChevron(ev) {
+  private onClickChevron(ev: any) {
     ev.stopPropagation();
     this.toggleDropDownMenuShown(ev);
   }
 
   @autobind
-  private toggleDropDownMenuShown(ev) {
+  private toggleDropDownMenuShown(ev: any) {
     this.setState({
       isContextMenuShown: !this.state.isContextMenuShown
     });
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index f6fe27e6ff693..38cdf974962a7 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -90,7 +90,7 @@ export function getSubmenuItems(item: IContextualMenuItem) {
 @withResponsiveMode
 export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContextualMenuState> {
   // The default ContextualMenu properities have no items and beak, the default submenu direction is right and top.
-  public static defaultProps = {
+  public static defaultProps: IContextualMenuProps = {
     items: [],
     shouldFocusOnMount: true,
     gapSpace: 0,
@@ -164,7 +164,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     this._async.dispose();
   }
 
-  public render() {
+  public render(): JSX.Element | null {
     let { className,
       items,
       isBeakVisible,
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
index 908b5822f75eb..d58dc19b60f3a 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
@@ -234,7 +234,7 @@ export class ContextualMenuCustomizationExample extends React.Component<any, ICo
     return (
       <ul className='ms-ContextualMenu-customizationExample-categoriesList'>
         <li className='ms-ContextualMenu-item'>
-          { item.categoryList.map(category =>
+          { item.categoryList.map((category: any) =>
             <button className='ms-ContextualMenu-link' role='menuitem'>
               <div>
                 <span
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
index ddb34c2708f86..817e89f9252d8 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
@@ -193,7 +193,7 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
   @autobind
   private _onDirectionalChanged(option: IDropdownOption) {
     this.setState({
-      directionalHint: DirectionalHint[option.key]
+      directionalHint: (DirectionalHint as any)[option.key]
     });
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx
index 77519aa3208d3..2203a8656167b 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx
@@ -120,7 +120,7 @@ export class DatePickerBasicExample extends React.Component<any, IDatePickerBasi
 
   private _onDropdownChanged(option: IDropdownOption) {
     this.setState({
-      firstDayOfWeek: DayOfWeek[option.key]
+      firstDayOfWeek: (DayOfWeek as any)[option.key]
     });
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index 261b79263aa0d..7ccc65d693818 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -114,7 +114,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
     this._events.on(rootElement, 'keydown', this._onRootKeyDown);
   }
 
-  public componentWillReceiveProps(newProps) {
+  public componentWillReceiveProps(newProps: IDetailsHeaderProps) {
     let { groupNestingDepth } = this.state;
 
     if (newProps.groupNestingDepth !== groupNestingDepth) {
@@ -530,7 +530,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
     }
   }
 
-  private _onColumnClick(column, ev) {
+  private _onColumnClick(column: IColumn, ev: React.MouseEvent<HTMLElement>) {
     let { onColumnClick } = this.props;
 
     if (column.onColumnClick) {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index 8198c4964fbf3..34b27bb3c1ab5 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -80,7 +80,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
   private _hasMounted: boolean;
   private _dragDropSubscription: IDisposable;
 
-  constructor(props) {
+  constructor(props: IDetailsRowProps) {
     super(props);
 
     this.state = {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
index 696dd514860ff..f76804a637ee6 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
@@ -75,7 +75,7 @@ export class DetailsRowFields extends BaseComponent<IDetailsRowFieldsProps, IDet
     };
   }
 
-  private _getCellText(item, column) {
+  private _getCellText(item: any, column: IColumn) {
     let value = (item && column && column.fieldName) ? item[column.fieldName] : '';
 
     if (value === null || value === undefined) {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
index 20d8c7323ef6d..c572ae56dfb34 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
@@ -29,7 +29,7 @@ const PAGING_SIZE = 10;
 const PAGING_DELAY = 5000;
 const ITEMS_COUNT = 5000;
 
-let _items;
+let _items: any;
 
 export interface IDetailsListAdvancedExampleState {
   canResizeColumns?: boolean;
@@ -153,7 +153,7 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
     );
   }
 
-  private _onDataMiss(index) {
+  private _onDataMiss(index: number) {
     index = Math.floor(index / PAGING_SIZE) * PAGING_SIZE;
 
     if (!this._isFetchingItems) {
@@ -476,7 +476,7 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
 
   @autobind
   private _onSortColumn(key: string, isSortedDescending: boolean) {
-    let sortedItems = _items.slice(0).sort((a, b) => (isSortedDescending ? a[key] < b[key] : a[key] > b[key]) ? 1 : -1);
+    let sortedItems = _items.slice(0).sort((a: any, b: any) => (isSortedDescending ? a[key] < b[key] : a[key] > b[key]) ? 1 : -1);
 
     this.setState({
       items: sortedItems,
@@ -525,7 +525,7 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
   }
 
   private _groupByKey(groups: IGroup[], items: any[], key: string): any[] {
-    let groupedItems = [];
+    let groupedItems: any[] = [];
     if (groups) {
       groups.forEach((group: IGroup) => {
         if (group.children && group.children.length > 0) {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
index ca7524751ca11..5580772c21e27 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
@@ -18,7 +18,7 @@ import {
 } from 'office-ui-fabric-react/lib/Tooltip';
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
 
-let _items = [];
+let _items: any[] = [];
 
 let _columns: IColumn[] = [
   {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
index af1f97fb5564a..5b19a669cc067 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
@@ -46,7 +46,7 @@ export class DetailsListCustomColumnsExample extends React.Component<{}, IDetail
     );
   }
 
-  private _onColumnClick(event, column) {
+  private _onColumnClick(event: React.MouseEvent<HTMLElement>, column: IColumn) {
     let { sortedItems, columns } = this.state;
     let isSortedDescending = column.isSortedDescending;
 
@@ -95,7 +95,7 @@ function _buildColumns() {
   return columns;
 }
 
-function _renderItemColumn(item, index, column) {
+function _renderItemColumn(item: any, index: number, column: IColumn) {
   let fieldContent = item[column.fieldName];
 
   switch (column.key) {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomRows.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomRows.Example.tsx
index 1ff86c6b11b0d..4fd738561e89d 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomRows.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomRows.Example.tsx
@@ -1,7 +1,7 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
-import { DetailsList, DetailsRow } from 'office-ui-fabric-react/lib/DetailsList';
+import { DetailsList, DetailsRow, IDetailsRowProps, IDetailsRowCheckProps } from 'office-ui-fabric-react/lib/DetailsList';
 import { autobind, css } from 'office-ui-fabric-react/lib/Utilities';
 import { createListItems } from '@uifabric/example-app-base';
 import './DetailsListExample.scss';
@@ -26,18 +26,18 @@ export class DetailsListCustomRowsExample extends React.Component<any, any> {
   }
 
   @autobind
-  private _onRenderRow(props) {
+  private _onRenderRow(props: IDetailsRowProps) {
     return (
       <DetailsRow
         { ...props}
         onRenderCheck={ this._onRenderCheck }
-        aria-busy={ false } 
+        aria-busy={ false }
       />
     );
   }
 
   @autobind
-  private _onRenderCheck(props) {
+  private _onRenderCheck(props: IDetailsRowCheckProps) {
     return (
       <div
         className={ css(
@@ -47,7 +47,6 @@ export class DetailsListCustomRowsExample extends React.Component<any, any> {
         role='button'
         aria-pressed={ props.isSelected }
         data-selection-toggle={ true }
-        aria-label={ props.ariaLabel }
       >
         <input
           type='checkbox'
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx
index eedcf431e3fd7..4d46418f984aa 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx
@@ -4,7 +4,7 @@ import * as React from 'react';
 import { Link } from 'office-ui-fabric-react/lib/Link';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
 import { DetailsList, Selection } from 'office-ui-fabric-react/lib/DetailsList';
-import { IDetailsRowProps, DetailsRow } from 'office-ui-fabric-react/lib/DetailsList';
+import { IDetailsRowProps, DetailsRow, IColumn } from 'office-ui-fabric-react/lib/DetailsList';
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
 import {
   IDragDropHelper,
@@ -76,7 +76,7 @@ export class DetailsListDragDropExample extends React.Component<any, any> {
     };
   }
 
-  private _onRenderItemColumn(item, index, column) {
+  private _onRenderItemColumn(item: any, index: number, column: IColumn) {
     if (column.key === 'name') {
       return <Link data-selection-invoke={ true }>{ item[column.key] }</Link>;
     }
@@ -84,10 +84,10 @@ export class DetailsListDragDropExample extends React.Component<any, any> {
     return item[column.key];
   }
 
-  private _insertBeforeItem(item) {
+  private _insertBeforeItem(item: any) {
     let draggedItems = this._selection.isIndexSelected(_draggedIndex) ? this._selection.getSelection() : [_draggedItem];
 
-    let items: any[] = this.state.items.filter((i) => draggedItems.indexOf(i) === -1);
+    let items: any[] = this.state.items.filter((i: number) => draggedItems.indexOf(i) === -1);
     let insertIndex = items.indexOf(item);
 
     // if dragging/dropping on itself, index will be 0.
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
index c40ed1432c4f7..3fb913e2a7463 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
@@ -50,7 +50,7 @@ let _items = [
   }
 ];
 
-function groupBy(items, fieldName) {
+function groupBy(items: any[], fieldName: string) {
   let groups = items.reduce((currentGroups, currentItem, index) => {
     let lastGroup = currentGroups[currentGroups.length - 1];
     let fieldValue = currentItem[fieldName];
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
index c957939dbac75..d16220435a6a6 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
@@ -3,8 +3,13 @@ import { DetailsList, IColumn } from 'office-ui-fabric-react/lib/DetailsList';
 import { Link } from 'office-ui-fabric-react/lib/Link';
 import './DetailsListExample.scss';
 
-export class DetailsListNavigatingFocusExample extends React.Component<any, any> {
-  public state = {
+export interface IDetailsListNavigatingFocusExampleState {
+  items: any;
+  initialFocusedIndex?: number;
+}
+
+export class DetailsListNavigatingFocusExample extends React.Component<{}, IDetailsListNavigatingFocusExampleState> {
+  public state: IDetailsListNavigatingFocusExampleState = {
     items: generateItems(''),
     initialFocusedIndex: undefined,
   };
@@ -44,5 +49,5 @@ export class DetailsListNavigatingFocusExample extends React.Component<any, any>
 }
 
 function generateItems(parent: string) {
-  return Array.prototype.map.call('abcdefghi', name => parent + name);
+  return Array.prototype.map.call('abcdefghi', (name: string) => parent + name);
 }
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
index d1c9932024311..e9fe1aa4ea6b8 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
@@ -19,7 +19,7 @@ describe('Dialog', () => {
     setWarningCallback(message => null);
   });
   afterEach(() => {
-    [].forEach.call(document.querySelectorAll('body > div'), div => div.parentNode.removeChild(div));
+    [].forEach.call(document.querySelectorAll('body > div'), (div: any) => div.parentNode.removeChild(div));
 
     expect(document.querySelector('.ms-Dialog')).to.be.null;
   });
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index e56bc23511234..5f74b140aaf53 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -35,7 +35,7 @@ export interface IDropdownState {
 export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownState> {
 
   public static defaultProps = {
-    options: []
+    options: [] as any[]
   };
 
   private static Option: string = 'option';
@@ -52,7 +52,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   private _id: string;
 
   constructor(props?: IDropdownProps) {
-    props.options.forEach((option) => {
+    props.options.forEach((option: any) => {
       if (!option.itemType) {
         option.itemType = DropdownMenuItemType.Normal;
       }
@@ -255,7 +255,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
 
   // Render placeHolder text in dropdown input
   @autobind
-  private _onRenderPlaceHolder(props): JSX.Element {
+  private _onRenderPlaceHolder(props: IDropdownProps): JSX.Element {
     if (!props.placeHolder) {
       return null;
     }
@@ -324,7 +324,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
         onKeyDown={ this._onZoneKeyDown }
         role='listbox'
       >
-        { this.props.options.map((item, index) => onRenderItem({ ...item, index }, this._onRenderItem)) }
+        { this.props.options.map((item: any, index: number) => onRenderItem({ ...item, index }, this._onRenderItem)) }
       </FocusZone>
     );
   }
@@ -402,7 +402,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     this._focusZone.focus();
   }
 
-  private _onItemClick(index) {
+  private _onItemClick(index: number) {
     this.setSelectedIndex(index);
     this.setState({
       isOpen: false
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
index 80f547866832b..5fd6eb9a10c31 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
@@ -81,7 +81,7 @@ export class DropdownBasicExample extends React.Component<any, any> {
     );
   }
 
-  public makeList(items) {
+  public makeList(items: any) {
     let list = [];
     for (let i = 0; i < items; i++) {
       list.push({ key: i, text: 'Option ' + i });
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
index 713575c3db854..50579564e83ba 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
@@ -113,7 +113,7 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
       _firstFocusableChild = getNextElement(root, root.firstChild as HTMLElement, true, false, false, true);
     }
     if (_firstFocusableChild) {
-      _firstFocusableChild.focus();
+      (_firstFocusableChild as any).focus();
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
index 2ed81f1d67da1..13c7f83d7376b 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
@@ -17,7 +17,7 @@ export interface IBoxNoClickExampleExampleState {
 export default class BoxNoClickExample extends React.Component<React.HTMLAttributes<HTMLDivElement>, IBoxNoClickExampleExampleState> {
   private _toggle: IToggle;
 
-  constructor(props) {
+  constructor(props: React.HTMLAttributes<HTMLDivElement>) {
     super(props);
 
     this.state = {
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
index 67eebef037b29..15569205edf38 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
@@ -17,7 +17,7 @@ export interface IBoxExampleExampleState {
 export default class BoxExample extends React.Component<React.HTMLAttributes<HTMLDivElement>, IBoxExampleExampleState> {
   private _toggle: IToggle;
 
-  constructor(props) {
+  constructor(props: React.HTMLAttributes<HTMLDivElement>) {
     super(props);
 
     this.state = {
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
index 0cabce5b0b161..c70c395419f5f 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
@@ -16,7 +16,7 @@ export interface IBoxExampleExampleState {
 export default class BoxExample extends React.Component<React.HTMLAttributes<HTMLDivElement>, IBoxExampleExampleState> {
   private _toggle: IToggle;
 
-  constructor(props) {
+  constructor(props: React.HTMLAttributes<HTMLDivElement>) {
     super(props);
 
     this.state = {
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
index 4483b1b6eca10..69861daf241b4 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
@@ -14,7 +14,7 @@ import { assert } from 'chai';
 describe('FocusZone', () => {
   let lastFocusedElement: HTMLElement;
 
-  function _onFocus(ev) {
+  function _onFocus(ev: any) {
     lastFocusedElement = ev.target;
   }
 
@@ -592,13 +592,13 @@ describe('FocusZone', () => {
 
   it('Focus first tabbable element, when active elemet is dynamically disabled', () => {
     let focusZone: FocusZone = null;
-    let buttonA, buttonB = null;
+    let buttonA: any, buttonB = null;
     const component = ReactTestUtils.renderIntoDocument(
       <div { ...{ onFocusCapture: _onFocus } }>
         <textarea className='t'></textarea>
-        <FocusZone ref={(focus) => { focusZone = focus; }}>
-          <button className='a' ref={(button) => { buttonA = button; }}>a</button>
-          <button className='b' ref={(button) => { buttonB = button; }}>b</button>
+        <FocusZone ref={ (focus) => { focusZone = focus; } }>
+          <button className='a' ref={ (button) => { buttonA = button; } }>a</button>
+          <button className='b' ref={ (button) => { buttonB = button; } }>b</button>
         </FocusZone>
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index af9d290053c0b..1bbb6c01c7b8f 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -56,7 +56,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   private _focusAlignment: IPoint;
   private _isInnerZone: boolean;
 
-  constructor(props) {
+  constructor(props: IFocusZoneProps) {
     super(props);
 
     this._warnDeprecations({ rootProps: null });
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
index 6076567abe77f..4d73d9e1af0ac 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
@@ -29,7 +29,7 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
     };
   }
 
-  public componentWillReceiveProps(newProps) {
+  public componentWillReceiveProps(newProps: any) {
     if (newProps.group) {
       let newCollapsed = newProps.group.isCollapsed;
       let isGroupLoading = newProps.headerProps && newProps.headerProps.isGroupLoading;
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
index 12fde5b413b97..1a2e191164fdb 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
@@ -54,7 +54,7 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
     };
   }
 
-  public componentWillReceiveProps(newProps) {
+  public componentWillReceiveProps(newProps: IGroupedListProps) {
     let {
       groups,
       selectionMode
@@ -131,7 +131,7 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
   }
 
   @autobind
-  private _renderGroup(group, groupIndex) {
+  private _renderGroup(group: any, groupIndex: number) {
     let {
       dragDropEvents,
       dragDropHelper,
@@ -259,7 +259,7 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
     }
   }
 
-  private _computeIsSomeGroupExpanded(groups: IGroup[]) {
+  private _computeIsSomeGroupExpanded(groups: IGroup[]): boolean {
     return groups && groups.some(group => group.children ? this._computeIsSomeGroupExpanded(group.children) : !group.isCollapsed);
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
index 2c028f93795bb..234b2a2af3c16 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
@@ -158,7 +158,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
     }
   }
 
-  public render() {
+  public render(): JSX.Element {
     let {
       getGroupItemLimit,
       group,
@@ -289,7 +289,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
   }
 
   @autobind
-  private _renderSubGroup(subGroup, subGroupIndex) {
+  private _renderSubGroup(subGroup: any, subGroupIndex: number) {
     let {
       dragDropEvents,
       dragDropHelper,
@@ -333,7 +333,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
     ) : null;
   }
 
-  private _getGroupKey(group, index) {
+  private _getGroupKey(group: any, index: number) {
     return 'group-' + ((group && group.key) ? group.key : String(group.level) + String(index));
   }
 
@@ -349,7 +349,6 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
       context: { data: group, index: groupIndex, isGroup: true },
       canDrag: () => false, // cannot drag groups
       canDrop: dragDropEvents.canDrop,
-      onDragStart: null,
       updateDropState: this._updateDroppingState
     };
     return options;
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
index 4dd365ece2ed7..c5ae340d9b77f 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
@@ -140,7 +140,7 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
 
   // Instant Open the card in Expanded mode
   @autobind
-  private _instantOpenExpanded(ev) {
+  private _instantOpenExpanded(ev: React.MouseEvent<HTMLDivElement>) {
     this.setState({
       isHoverCardVisible: true,
       mode: ExpandingCardMode.expanded
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx
index 887d787cc9843..0b33539199d5e 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx
@@ -48,7 +48,7 @@ export class HoverCardBasicExample extends BaseComponent<{}, IHoverCardExampleSt
   }
 
   @autobind
-  private _onRenderItemColumn(item, index, column) {
+  private _onRenderItemColumn(item: any, index: number, column: IColumn) {
     const expandingCardProps: IExpandingCardProps = {
       onRenderCompactCard: this._onRenderCompactCard,
       onRenderExpandedCard: this._onRenderExpandedCard,
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
index 15181a6dc5e10..e473681b32087 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
@@ -59,7 +59,7 @@ export function Icon(props: IIconProps): JSX.Element {
             props.className
           ) }
       >
-        { IconCodes[iconMemberName] }
+        { (IconCodes as any)[iconMemberName] }
       </i>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx b/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx
index 6d6c99b6660ac..523f11ec9f5f5 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx
@@ -13,7 +13,7 @@ let _layersByHostId: { [hostId: string]: Layer[] } = {};
 
 export class Layer extends BaseComponent<ILayerProps, {}> {
 
-  public static defaultProps = {
+  public static defaultProps: ILayerProps = {
     onLayerDidMount: () => undefined,
     onLayerWillUnmount: () => undefined
   };
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index 2b8ccde568445..5a90a84de1222 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -64,7 +64,7 @@ const _measureScrollRect = _measurePageRect;
 export class List extends BaseComponent<IListProps, IListState> implements IList {
   public static defaultProps = {
     startIndex: 0,
-    onRenderCell: (item, index, containsFocus) => (<div>{ (item && item.name) || '' }</div>),
+    onRenderCell: (item: any, index: number, containsFocus: boolean) => (<div>{ (item && item.name) || '' }</div>),
     renderedWindowsAhead: DEFAULT_RENDERED_WINDOWS_AHEAD,
     renderedWindowsBehind: DEFAULT_RENDERED_WINDOWS_BEHIND
   };
@@ -345,7 +345,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   }
 
   /** Generate the style object for the page. */
-  private _getPageStyle(page) {
+  private _getPageStyle(page: IPage) {
     let style;
     let { getPageStyle } = this.props;
 
@@ -362,7 +362,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   }
 
   /** Track the last item index focused so that we ensure we keep it rendered. */
-  private _onFocus(ev) {
+  private _onFocus(ev: any) {
     let target = ev.target as HTMLElement;
 
     while (target !== this.refs.surface) {
@@ -476,7 +476,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       let page = oldPages[i];
 
       if (page.items) {
-        renderedIndexes[page.startIndex] = page;
+        (renderedIndexes as any)[page.startIndex] = page;
       }
     }
 
@@ -486,17 +486,17 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       if (page.items) {
         heightChanged = this._measurePage(page) || heightChanged;
 
-        if (!renderedIndexes[page.startIndex]) {
+        if (!(renderedIndexes as any)[page.startIndex]) {
           this._onPageAdded(page);
         } else {
-          delete renderedIndexes[page.startIndex];
+          delete (renderedIndexes as any)[page.startIndex];
         }
       }
     }
 
     for (let index in renderedIndexes) {
       if (renderedIndexes.hasOwnProperty(index)) {
-        this._onPageRemoved(renderedIndexes[index]);
+        this._onPageRemoved((renderedIndexes as any)[index]);
       }
     }
 
@@ -749,7 +749,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   }
 }
 
-function _expandRect(rect, pagesBefore, pagesAfter): IRectangle {
+function _expandRect(rect: IRectangle, pagesBefore: number, pagesAfter: number): IRectangle {
   const top = rect.top - (pagesBefore * rect.height);
   const height = rect.height + ((pagesBefore + pagesAfter) * rect.height);
 
diff --git a/packages/office-ui-fabric-react/src/components/List/ListPage.tsx b/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
index 6bf72d363dfe1..d22c223ddcd2d 100644
--- a/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
@@ -14,7 +14,7 @@ const ListBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/com
 const ListGridExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx') as string;
 const ListScrollingExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx') as string;
 
-let _cachedItems;
+let _cachedItems: any;
 
 export class ListPage extends React.Component<IComponentDemoPageProps, {}> {
   constructor() {
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx b/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx
index abab35db47cf4..871d6e0ffa571 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx
@@ -2,6 +2,7 @@ import * as React from 'react';
 import { FocusZone } from 'office-ui-fabric-react/lib/FocusZone';
 import { List } from 'office-ui-fabric-react/lib/List';
 import './List.Grid.Example.scss';
+import { IRectangle } from '../../../Utilities';
 
 export interface IListGridExampleProps {
   items: any[];
@@ -11,7 +12,7 @@ const ROWS_PER_PAGE = 3;
 const MAX_ROW_HEIGHT = 250;
 
 export class ListGridExample extends React.Component<IListGridExampleProps, any> {
-  private _positions;
+  private _positions: any;
   private _columnCount: number;
   private _columnWidth: number;
   private _rowHeight: number;
@@ -55,7 +56,7 @@ export class ListGridExample extends React.Component<IListGridExampleProps, any>
     );
   }
 
-  private _getItemCountForPage(itemIndex: number, surfaceRect) {
+  private _getItemCountForPage(itemIndex: number, surfaceRect: IRectangle) {
     if (itemIndex === 0) {
       this._columnCount = Math.ceil(surfaceRect.width / MAX_ROW_HEIGHT);
       this._columnWidth = Math.floor(surfaceRect.width / this._columnCount);
@@ -65,7 +66,7 @@ export class ListGridExample extends React.Component<IListGridExampleProps, any>
     return this._columnCount * ROWS_PER_PAGE;
   }
 
-  private _getPageHeight(itemIndex: number, surfaceRect) {
+  private _getPageHeight(itemIndex: number, surfaceRect: IRectangle) {
     return this._rowHeight * ROWS_PER_PAGE;
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx b/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx
index c67c04cdfde9a..0c728744d0863 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx
@@ -27,7 +27,7 @@ const numberOfItemsOnPage = 10;
 export class ListScrollingExample extends React.Component<IListScrollingExampleProps, IListScrollingExampleState> {
   private _list: List;
 
-  constructor(props) {
+  constructor(props: IListScrollingExampleProps) {
     super(props);
 
     this.state = {
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
index 0d9d64458581d..0759afdb7cb61 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
@@ -25,7 +25,7 @@ const _indentWithExpandButton: number = 28;
 const _indentNoExpandButton: number = 20;
 
 // global var used in _isLinkSelectedKey
-let _urlResolver;
+let _urlResolver: HTMLAnchorElement | undefined;
 
 export interface INavState {
   isGroupCollapsed?: { [key: string]: boolean };
diff --git a/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.FabricDemoApp.Example.tsx b/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.FabricDemoApp.Example.tsx
index 4b38007b58de1..806fae76b295a 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.FabricDemoApp.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.FabricDemoApp.Example.tsx
@@ -6,7 +6,7 @@ import { Nav } from 'office-ui-fabric-react/lib/Nav';
 export class NavFabricDemoAppExample extends React.Component<any, any> {
   public render() {
     return (
-      <Nav groups={ AppDefinition.examplePages } onRenderLink={ (link) => ([
+      <Nav groups={ AppDefinition.examplePages } onRenderLink={ (link: any) => ([
         <span key={ 1 } className='Nav-linkText'>{ link.name }</span>,
         (link.status !== undefined ?
           <span key={ 2 } className={ 'Nav-linkFlair ' + 'is-state' + link.status } >{ ExampleStatus[link.status] }</span> :
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx
index 06bb9575ff07d..e976fd6aaaedb 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx
@@ -19,7 +19,7 @@ export class OverflowSetCustomExample extends BaseComponent<any, any> {
         items={ [
           {
             key: 'search',
-            'onRender': (item) => {
+            onRender: (item: any) => {
               return (
                 <SearchBox
                   labelText='Search'
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.Remove.Example.tsx b/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.Remove.Example.tsx
index b8130a39c9afc..c00203e74239c 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.Remove.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.Remove.Example.tsx
@@ -14,7 +14,7 @@ export interface IPivotOnChangeExampleState {
 }
 
 export class PivotRemoveExample extends React.Component<any, IPivotOnChangeExampleState> {
-  private _shouldShowFirstPivotItem;
+  private _shouldShowFirstPivotItem: boolean;
 
   constructor(props: any) {
     super(props);
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
index 129f10410e304..138cd6e28e2ba 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
@@ -28,7 +28,7 @@ describe('ResizeGroup', () => {
   it('renders the result of onRenderData', () => {
     const initialData = { content: 5 };
     const renderedDataId = 'onRenderDataId';
-    const onRenderData = (data) => <div id={ renderedDataId }> Rendered data: { data.content }</div >;
+    const onRenderData = (data: any) => <div id={ renderedDataId }> Rendered data: { data.content }</div >;
 
     const wrapper = shallow<IResizeGroupProps, IResizeGroupState>(
       <ResizeGroup
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
index 5aa17de566a8f..25cb160d78de9 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
@@ -34,7 +34,7 @@ function generateData(count: number, cachingEnabled: boolean, checked: boolean):
 
   let result = {
     primary: dataItems,
-    overflow: []
+    overflow: [] as any[]
   };
 
   if (cachingEnabled) {
@@ -55,9 +55,9 @@ function computeCacheKey(primaryControls: IContextualMenuItem[]): string {
   return primaryControls.reduce((acc, current) => acc + current.key, '');
 }
 
-export class ResizeGroupOverflowSetExample extends BaseComponent<any, IResizeGroupOverflowSetExampleState> {
+export class ResizeGroupOverflowSetExample extends BaseComponent<{}, IResizeGroupOverflowSetExampleState> {
 
-  constructor(props) {
+  constructor(props: {}) {
     super(props);
     this.state = {
       short: false,
@@ -137,12 +137,12 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<any, IResizeGro
   }
 
   @autobind
-  private onCachingEnabledChanged(_, checked: boolean) {
+  private onCachingEnabledChanged(_: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean) {
     this.setState({ cachingEnabled: checked });
   }
 
   @autobind
-  private onButtonsCheckedChanged(_, checked: boolean) {
+  private onButtonsCheckedChanged(_: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean) {
     this.setState({ buttonsChecked: checked });
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
index efc0cc1abc42c..a2fd4085a2a56 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
@@ -24,7 +24,7 @@ describe('Slider', () => {
 
   it('can slide to default min/max and execute onChange', () => {
     let changedValue;
-    let onChange = (val) => {
+    let onChange = (val: any) => {
       changedValue = val;
     };
     let component = ReactTestUtils.renderIntoDocument<React.ReactInstance>(
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
index b5feb1d08f273..9dbeba4e03816 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
@@ -207,7 +207,7 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     }
   }
 
-  private _updateValue(value, renderedValue) {
+  private _updateValue(value: number, renderedValue: number) {
     let valueChanged = value !== this.state.value;
 
     this.setState({
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index 159b3546758be..10626ab666ffd 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -325,7 +325,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
    * @param stepFunction - function to use to step by
    */
   @autobind
-  private _updateValue(shouldSpin: boolean, stepDelay: number, stepFunction: (string) => string | void) {
+  private _updateValue(shouldSpin: boolean, stepDelay: number, stepFunction: (string: string) => string | void) {
     const newValue = stepFunction(this.state.value);
     if (newValue) {
       this._lastValidValue = newValue;
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
index b27e7059fc022..6c5c092b8a62d 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
@@ -213,7 +213,7 @@ describe('TextField', () => {
 
     it('should trigger validation only on focus', () => {
       let validationCallCount = 0;
-      let validatorSpy = value => {
+      let validatorSpy = (value: string) => {
         validationCallCount++;
         return value.length > 3 ? errorMessage : '';
       };
@@ -236,7 +236,7 @@ describe('TextField', () => {
 
     it('should trigger validation only on blur', () => {
       let validationCallCount = 0;
-      let validatorSpy = value => {
+      let validatorSpy = (value: string) => {
         validationCallCount++;
         return value.length > 3 ? errorMessage : '';
       };
@@ -260,7 +260,7 @@ describe('TextField', () => {
 
     it('should trigger validation on both blur and focus', () => {
       let validationCallCount = 0;
-      let validatorSpy = value => {
+      let validatorSpy = (value: string) => {
         validationCallCount++;
         return value.length > 3 ? errorMessage : '';
       };
@@ -287,7 +287,7 @@ describe('TextField', () => {
 
     it('should not trigger validation on component mount', () => {
       let validationCallCount = 0;
-      let validatorSpy = value => {
+      let validatorSpy = (value: string) => {
         validationCallCount++;
         return '';
       };
@@ -326,7 +326,7 @@ describe('TextField', () => {
 
   it('should call onChanged handler for input change', () => {
     let callCount = 0;
-    let onChangedSpy = value => { callCount++; };
+    let onChangedSpy = (value: string) => { callCount++; };
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <TextField
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index d27ee3285f6dd..d3455638e257b 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -52,8 +52,8 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
   private _delayedValidate: (value: string) => void;
   private _isMounted: boolean;
   private _lastValidation: number;
-  private _latestValue;
-  private _latestValidateValue;
+  private _latestValue: string;
+  private _latestValidateValue: string;
   private _isDescriptionAvailable: boolean;
   private _textElement: HTMLInputElement | HTMLTextAreaElement;
 
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/NumberTextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/NumberTextField.tsx
index 83dc9e4832bf2..83de40a3c28fb 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/NumberTextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/NumberTextField.tsx
@@ -13,7 +13,7 @@ export interface INumberTextFieldState {
 }
 
 export class NumberTextField extends React.Component<INumberTextFieldProps, INumberTextFieldState> {
-  constructor(props) {
+  constructor(props: INumberTextFieldProps) {
     super(props);
 
     this._restore = this._restore.bind(this);
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
index 52c863591a7c1..fb14814e5ef94 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
@@ -26,7 +26,7 @@ export class TextFieldBasicExample extends React.Component<any, any> {
   }
 
   @autobind
-  private _onChanged(text) {
+  private _onChanged(text: string) {
     console.log(text);
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
index b565083304bd1..b4af8e828feed 100644
--- a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
@@ -25,7 +25,7 @@ export class ThemePage extends React.Component<any, any> {
       colors: Object.keys(defaultTheme).map(variableName => ({
         key: variableName,
         name: variableName,
-        value: defaultTheme[variableName],
+        value: (defaultTheme as any)[variableName],
         description: '',
         colorPickerProps: null
       }))
@@ -122,7 +122,7 @@ export class ThemePage extends React.Component<any, any> {
     for (let i = 0; i < colors.length; i++) {
       let themeColor = colors[i];
 
-      palette[themeColor.key] = themeColor.value;
+      (palette as any)[themeColor.key] = themeColor.value;
     }
 
     loadTheme({ palette });
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
index d49d6ea68338f..9f5f6f9eabbfe 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
@@ -38,7 +38,7 @@ describe('Toggle', () => {
 
   it('can call the callback on a change of toggle', () => {
     let isToggledValue;
-    let callback = (isToggled) => {
+    let callback = (isToggled: boolean) => {
       isToggledValue = isToggled;
     };
     let component;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
index 2ee21cc8c1e05..b9570b71a8d80 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
@@ -31,11 +31,11 @@ function onResolveSuggestions(text: string): ITag[] {
   ].filter(tag => tag.toLowerCase().indexOf(text.toLowerCase()) === 0).map(item => ({ key: item, name: item }));
 }
 
-const basicRenderer = (props) => {
+const basicRenderer = (props: IPickerItemProps<{ key: string, name: string }>) => {
   return <div> { props.item.name } </div>;
 };
 
-const basicSuggestionRenderer = (props) => {
+const basicSuggestionRenderer = (props: ISimple) => {
   return <div> { props.name } </div>;
 };
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 060a2e3c0f148..39c3f3c190678 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -168,7 +168,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   protected renderItems(): JSX.Element[] {
     let { onRenderItem } = this.props;
     let { items } = this.state;
-    return items.map((item, index) => onRenderItem({
+    return items.map((item: any, index: number) => onRenderItem({
       item,
       index,
       key: item.key ? item.key : index,
@@ -479,7 +479,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   @autobind
   protected removeItems(itemsToRemove: any[]) {
     let { items } = this.state;
-    let newItems: T[] = items.filter(item => itemsToRemove.indexOf(item) === -1);
+    let newItems: T[] = items.filter((item: any) => itemsToRemove.indexOf(item) === -1);
     let firstItemToRemove = this.selection.getSelection()[0];
     let index: number = items.indexOf(firstItemToRemove);
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.tsx
index 3b71c47ac908b..e18c98abce90c 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.tsx
@@ -2,11 +2,12 @@
 import * as React from 'react';
 /* tslint:enable */
 import { BasePicker, BasePickerListBelow } from '../BasePicker';
-import { IBasePickerProps } from '../BasePicker.Props';
+import { IBasePickerProps, IBasePickerSuggestionsProps } from '../BasePicker.Props';
 import { SelectedItemDefault } from './PeoplePickerItems/SelectedItemDefault';
 import { IPersonaProps } from '../../../Persona';
 import { SuggestionItemSmall, SuggestionItemNormal } from './PeoplePickerItems/SuggestionItemDefault';
 import './PeoplePicker.scss';
+import { IPeoplePickerItemProps } from './PeoplePickerItems/PeoplePickerItem.Props';
 
 export interface IPeoplePickerProps extends IBasePickerProps<IPersonaProps> {
 }
@@ -22,8 +23,8 @@ export class MemberListPeoplePicker extends BasePickerListBelow<IPersonaProps, I
  */
 export class NormalPeoplePicker extends BasePeoplePicker {
   public static defaultProps = {
-    onRenderItem: (props) => <SelectedItemDefault {...props} />,
-    onRenderSuggestionsItem: (props, itemProps?) => SuggestionItemNormal({ ...props }, { ...itemProps })
+    onRenderItem: (props: IPeoplePickerItemProps) => <SelectedItemDefault {...props} />,
+    onRenderSuggestionsItem: (props: IPersonaProps, itemProps?: IBasePickerSuggestionsProps) => SuggestionItemNormal({ ...props }, { ...itemProps })
   };
 }
 
@@ -32,8 +33,8 @@ export class NormalPeoplePicker extends BasePeoplePicker {
 */
 export class CompactPeoplePicker extends BasePeoplePicker {
   public static defaultProps = {
-    onRenderItem: (props) => <SelectedItemDefault {...props} />,
-    onRenderSuggestionsItem: (props, itemProps?) => SuggestionItemSmall({ ...props }, { ...itemProps })
+    onRenderItem: (props: IPeoplePickerItemProps) => <SelectedItemDefault {...props} />,
+    onRenderSuggestionsItem: (props: IPersonaProps, itemProps?: IBasePickerSuggestionsProps) => SuggestionItemSmall({ ...props }, { ...itemProps })
   };
 }
 
@@ -42,7 +43,7 @@ export class CompactPeoplePicker extends BasePeoplePicker {
  */
 export class ListPeoplePicker extends MemberListPeoplePicker {
   public static defaultProps = {
-    onRenderItem: (props) => <SelectedItemDefault {...props} />,
-    onRenderSuggestionsItem: (props, itemProps?) => SuggestionItemNormal({ ...props }, { ...itemProps })
+    onRenderItem: (props: IPeoplePickerItemProps) => <SelectedItemDefault {...props} />,
+    onRenderSuggestionsItem: (props: IPersonaProps, itemProps?: IBasePickerSuggestionsProps) => SuggestionItemNormal({ ...props }, { ...itemProps })
   };
 }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index 691553e1fa1e2..71d581ab9c89a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -47,7 +47,7 @@ const limitedSearchSuggestionProps: IBasePickerSuggestionsProps = assign(limited
 export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerExampleState> {
   constructor() {
     super();
-    let peopleList = [];
+    let peopleList: IPersonaWithMenu[] = [];
     people.forEach((persona: IPersonaProps) => {
       let target: IPersonaWithMenu = {};
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index 9240d9ebdc4f5..de70b8732cd9f 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -177,7 +177,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
         { suggestions.map((suggestion, index) =>
           <div ref={ this._resolveRef(suggestion.selected ? '_selectedElement' : '') }
             // tslint:disable-next-line:no-string-literal
-            key={ suggestion.item['key'] ? suggestion.item['key'] : index }
+            key={ (suggestion.item as any)['key'] ? (suggestion.item as any)['key'] : index }
             id={ 'sug-' + index }
             role='menuitem'>
             <TypedSuggestionsItem
diff --git a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagPicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagPicker.tsx
index 0534e1ab675c3..a262acb467109 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagPicker.tsx
@@ -8,6 +8,7 @@ import {
 import { BasePicker } from '../BasePicker';
 import { IBasePickerProps } from '../BasePicker.Props';
 import { TagItem } from './TagItem';
+import { IPickerItemProps } from '../PickerItem.Props';
 import * as stylesImport from './TagItem.scss';
 const styles: any = stylesImport;
 
@@ -21,7 +22,7 @@ export interface ITagPickerProps extends IBasePickerProps<ITag> {
 
 export class TagPicker extends BasePicker<ITag, ITagPickerProps> {
   protected static defaultProps = {
-    onRenderItem: (props) => { return <TagItem { ...props }>{ props.item.name }</TagItem>; },
+    onRenderItem: (props: IPickerItemProps<ITag>) => { return <TagItem { ...props }>{ props.item.name }</TagItem>; },
     onRenderSuggestionsItem: (props: ITag) => <div className={ css('ms-TagItem-TextOverflow', styles.tagItemTextOverflow) }> { props.name } </div>
   };
 }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
index 0b27ee23511d9..89e43087f45a6 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
@@ -27,6 +27,7 @@ import {
 } from 'office-ui-fabric-react/lib/Pickers';
 import './Picker.CustomResult.Example.scss';
 import { TestImages } from '../../../common/TestImages';
+import {IButtonProps} from 'office-ui-fabric-react/lib/Button';
 
 export interface IPeoplePickerExampleState {
   contextualMenuVisible?: boolean;
@@ -291,8 +292,8 @@ export const SelectedDocumentItem: (documentProps: IPickerItemProps<IFullDocumen
     documentActivityProps,
     documentTitleProps
   } = documentProps.item;
-  let actions = [];
-  documentActionsProps.actions.forEach((action) => actions.push(action));
+  let actions: IButtonProps[] = [];
+  documentActionsProps.actions.forEach((action: IButtonProps) => actions.push(action));
   actions.push({
     icon: 'Cancel', onClick: (ev: any) => { documentProps.onRemoveItem(); }
   });
diff --git a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
index e7efd27fe50aa..afc1d2e6fdcd5 100644
--- a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
+++ b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { App as AppBase, IAppDefinition } from '@uifabric/example-app-base';
+import { App as AppBase, IAppDefinition, IAppProps } from '@uifabric/example-app-base';
 import { DetailsListBasicExample } from '../components/DetailsList/examples/DetailsList.Basic.Example';
 
 export const AppDefinition: IAppDefinition = {
@@ -354,4 +354,4 @@ export const AppDefinition: IAppDefinition = {
 
 };
 
-export const App = (props) => <AppBase appDefinition={ AppDefinition } { ...props } />;
\ No newline at end of file
+export const App = (props: IAppProps) => <AppBase appDefinition={ AppDefinition } { ...props } />;
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/demo/index.tsx b/packages/office-ui-fabric-react/src/demo/index.tsx
index 351463852178c..40de2cf23b284 100644
--- a/packages/office-ui-fabric-react/src/demo/index.tsx
+++ b/packages/office-ui-fabric-react/src/demo/index.tsx
@@ -13,10 +13,10 @@ import './ColorStyles.scss';
 
 setBaseUrl('./dist/');
 
-let rootElement;
+let rootElement: HTMLElement | undefined;
 
 // Return the anchor link from the URL without the hash
-function _extractAnchorLink(path) {
+function _extractAnchorLink(path: string) {
   let index = path.lastIndexOf('#');
   if (index >= 0) {
     path = path.substr(index + 1, path.length - index);
@@ -45,7 +45,7 @@ function _onLoad() {
 
 function _getRoutes() {
   let routes = AppDefinition.testPages.map(page => <Route key={ page.key } path={ page.url } component={ page.component } />);
-  let appRoutes = [];
+  let appRoutes: JSX.Element[] = [];
 
   AppDefinition.examplePages.forEach(group => {
     group.links
diff --git a/packages/office-ui-fabric-react/src/utilities/color/colors.ts b/packages/office-ui-fabric-react/src/utilities/color/colors.ts
index 26752b7033b11..07870e9869a07 100644
--- a/packages/office-ui-fabric-react/src/utilities/color/colors.ts
+++ b/packages/office-ui-fabric-react/src/utilities/color/colors.ts
@@ -241,8 +241,8 @@ function _numberToPaddedHex(num: number) {
   return hex.length === 1 ? '0' + hex : hex;
 }
 
-function _named(str) {
-  const c = COLOR_VALUES[str.toLowerCase()];
+function _named(str: string) {
+  const c = (COLOR_VALUES as any)[str.toLowerCase()];
 
   if (c) {
     return {
@@ -254,7 +254,7 @@ function _named(str) {
   }
 }
 
-function _rgb(str) {
+function _rgb(str: string) {
   if (0 === str.indexOf('rgb(')) {
     str = str.match(/rgb\(([^)]+)\)/)[1];
 
@@ -269,7 +269,7 @@ function _rgb(str) {
   }
 }
 
-function _rgba(str) {
+function _rgba(str: string) {
   if (str.indexOf('rgba(') === 0) {
     str = str.match(/rgba\(([^)]+)\)/)[1];
 
@@ -284,7 +284,7 @@ function _rgba(str) {
   }
 }
 
-function _hex6(str) {
+function _hex6(str: string) {
   if ('#' === str[0] && 7 === str.length) {
     return {
       r: parseInt(str.slice(1, 3), 16),
@@ -295,7 +295,7 @@ function _hex6(str) {
   }
 }
 
-function _hex3(str) {
+function _hex3(str: string) {
   if ('#' === str[0] && 4 === str.length) {
     return {
       r: parseInt(str[1] + str[1], 16),
@@ -306,7 +306,7 @@ function _hex3(str) {
   }
 }
 
-function _hsl(str) {
+function _hsl(str: string) {
   if (str.indexOf('hsl(') === 0) {
     str = str.match(/hsl\(([^)]+)\)/)[1];
     const parts = str.split(/ *, */);
@@ -322,7 +322,7 @@ function _hsl(str) {
   }
 }
 
-function _hsla(str) {
+function _hsla(str: string) {
   if (str.indexOf('hsla(') === 0) {
     str = str.match(/hsla\(([^)]+)\)/)[1];
 
diff --git a/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx b/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx
index bbcb39e06d28c..bfd0c0042f8b6 100644
--- a/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx
@@ -3,7 +3,7 @@ import { BaseDecorator } from './BaseDecorator';
 
 export function withContainsFocus<P extends { containsFocus?: boolean }, S>(ComposedComponent: (new (props: P, ...args: any[]) => (React.Component<P, S>))): any {
 
-  return class WithContainsFocusComponent extends BaseDecorator<P & { containsFocus?}, { containsFocus?: boolean }> {
+  return class WithContainsFocusComponent extends BaseDecorator<P & { containsFocus?: boolean }, { containsFocus?: boolean }> {
     public refs: {
       [key: string]: React.ReactInstance,
     };
@@ -44,12 +44,12 @@ export function withContainsFocus<P extends { containsFocus?: boolean }, S>(Comp
       this._composedComponentInstance.forceUpdate();
     }
 
-    private _handleFocus(ev) {
+    private _handleFocus(ev: React.FocusEvent<HTMLDivElement>) {
       this._newContainsFocus = true;
       this._delayedSetContainsFocus();
     }
 
-    private _handleBlur(ev) {
+    private _handleBlur(ev: React.FocusEvent<HTMLDivElement>) {
       this._newContainsFocus = false;
       this._delayedSetContainsFocus();
     }
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx b/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
index 3caad77bd91c0..e14bfa4988ad9 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
@@ -4,7 +4,7 @@ import { IGridProps } from './Grid.Props';
 
 export class Grid extends BaseComponent<IGridProps, {}> {
 
-  private _id;
+  private _id: string;
 
   constructor(props: IGridProps) {
     super(props);
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning.ts b/packages/office-ui-fabric-react/src/utilities/positioning.ts
index b3b857cfd435e..cd32f7eb7be1a 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning.ts
@@ -269,7 +269,7 @@ export module positioningFunctions {
       let outOfBounds: RectangleEdge[] = _getOutOfBoundsEdges(targetRectangle, bounds);
 
       for (let direction of outOfBounds) {
-        targetRectangle[RectangleEdge[direction]] = bounds[RectangleEdge[direction]];
+        (targetRectangle as any)[RectangleEdge[direction]] = (bounds as any)[RectangleEdge[direction]];
       }
     }
 
@@ -301,7 +301,7 @@ export module positioningFunctions {
       let outOfBounds: RectangleEdge[] = _getOutOfBoundsEdges(targetRectangle, bounds);
 
       for (let direction of outOfBounds) {
-        targetRectangle[RectangleEdge[direction]] = bounds[RectangleEdge[direction]];
+        (targetRectangle as any)[RectangleEdge[direction]] = (bounds as any)[RectangleEdge[direction]];
       }
     }
 
@@ -379,7 +379,7 @@ export module positioningFunctions {
     for (let direction of outOfBounds) {
       callout.calloutRectangle = _alignEdgeToCoordinate(
         callout.calloutRectangle,
-        boundingRectangle[RectangleEdge[direction]],
+        (boundingRectangle as any)[RectangleEdge[direction]],
         direction);
       let adjustedPercent: number = _recalculateMatchingPercents(
         callout.calloutRectangle,
@@ -662,7 +662,7 @@ export module positioningFunctions {
         } else {
           x = point.x;
         }
-        return { x: x, y: rect[RectangleEdge[edge]] };
+        return { x: x, y: (rect as any)[RectangleEdge[edge]] };
       case RectangleEdge.left:
       case RectangleEdge.right:
         let y: number;
@@ -674,7 +674,7 @@ export module positioningFunctions {
         } else {
           y = point.y;
         }
-        return { x: rect[RectangleEdge[edge]], y: y };
+        return { x: (rect as any)[RectangleEdge[edge]], y: y };
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/utilities/router/Router.tsx b/packages/office-ui-fabric-react/src/utilities/router/Router.tsx
index 17416f14a7389..5b57987470a15 100644
--- a/packages/office-ui-fabric-react/src/utilities/router/Router.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/router/Router.tsx
@@ -31,7 +31,7 @@ export class Router extends BaseComponent<IRouterProps, {}> {
     return path;
   }
 
-  private _resolveRoute(path?: string, children?: React.ReactNode) {
+  private _resolveRoute(path?: string, children?: React.ReactNode): React.DOMElement<{ key: any }, Element> | null {
     path = path || this._getPath();
     children = children || this.props.children;
 
@@ -49,7 +49,7 @@ export class Router extends BaseComponent<IRouterProps, {}> {
           if (getComponent.component) {
             component = getComponent.component;
           } else {
-            getComponent((resolved) => {
+            getComponent((resolved: any) => {
               component = getComponent.component = resolved;
 
               if (asynchronouslyResolved) {
@@ -81,7 +81,7 @@ export class Router extends BaseComponent<IRouterProps, {}> {
 
 }
 
-function _match(currentPath, child): boolean {
+function _match(currentPath: string, child: any): boolean {
   if (child.props) {
     let { path } = child.props;
 
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
index 30d6f1a936c8c..bd70d9ea66f65 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
@@ -228,7 +228,7 @@ describe('SelectionZone', () => {
   });
 });
 
-function _simulateClick(el, eventData?: ReactTestUtils.SyntheticEventData) {
+function _simulateClick(el: Element, eventData?: ReactTestUtils.SyntheticEventData) {
   ReactTestUtils.Simulate.mouseDown(el, eventData);
   ReactTestUtils.Simulate.focus(el, eventData);
   ReactTestUtils.Simulate.click(el, eventData);
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
index 78237beffa8db..9fde207de74b0 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
@@ -110,7 +110,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   }
 
   @autobind
-  private _onMouseDownCapture(ev) {
+  private _onMouseDownCapture(ev: any) {
     if (document.activeElement !== ev.target && !elementContains(document.activeElement as HTMLElement, ev.target)) {
       this.ignoreNextFocus();
     }
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/interfaces.ts b/packages/office-ui-fabric-react/src/utilities/selection/interfaces.ts
index 72be9be11bea3..0996f2a3c542e 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/interfaces.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selection/interfaces.ts
@@ -15,11 +15,11 @@ export interface ISelection {
   canSelectItem?: (item: IObjectWithKey) => boolean;
 
   // Obesrvable methods.
-  setChangeEvents(isEnabled: boolean, suppressChange?: boolean);
+  setChangeEvents(isEnabled: boolean, suppressChange?: boolean): void;
 
   // Initialization methods.
 
-  setItems(items: IObjectWithKey[], shouldClear: boolean);
+  setItems(items: IObjectWithKey[], shouldClear: boolean): void;
   getItems(): IObjectWithKey[];
 
   // Read selection methods.
@@ -34,21 +34,21 @@ export interface ISelection {
 
   // Write selection methods.
 
-  setAllSelected(isAllSelected: boolean);
-  setKeySelected(key: string, isSelected: boolean, shouldAnchor: boolean);
-  setIndexSelected(index: number, isSelected: boolean, shouldAnchor: boolean);
+  setAllSelected(isAllSelected: boolean): void;
+  setKeySelected(key: string, isSelected: boolean, shouldAnchor: boolean): void;
+  setIndexSelected(index: number, isSelected: boolean, shouldAnchor: boolean): void;
 
   // Write range selection methods.
 
-  selectToKey(key: string, clearSelection?: boolean);
-  selectToIndex(index: number, clearSelection?: boolean);
+  selectToKey(key: string, clearSelection?: boolean): void;
+  selectToIndex(index: number, clearSelection?: boolean): void;
 
   // Toggle helpers.
 
-  toggleAllSelected();
-  toggleKeySelected(key: string);
-  toggleIndexSelected(index: number);
-  toggleRangeSelected(fromIndex: number, count: number);
+  toggleAllSelected(): void;
+  toggleKeySelected(key: string): void;
+  toggleIndexSelected(index: number): void;
+  toggleRangeSelected(fromIndex: number, count: number): void;
 }
 
 export interface ISelectionLayout {
diff --git a/packages/office-ui-fabric-react/tsconfig.json b/packages/office-ui-fabric-react/tsconfig.json
index 4ea2d4723f78e..8b53e96ac36e8 100644
--- a/packages/office-ui-fabric-react/tsconfig.json
+++ b/packages/office-ui-fabric-react/tsconfig.json
@@ -9,6 +9,7 @@
     "experimentalDecorators": true,
     "importHelpers": true,
     "forceConsistentCasingInFileNames": true,
+    "noImplicitAny": true,
     "moduleResolution": "node",
     "lib": [
       "es2017",

From d95d6dd57c0c08374620d05b3a24f19f332ee2bc Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 11 Jul 2017 13:55:48 -0700
Subject: [PATCH 0239/1641] MessageBar: Fixed collapsing text in multiline
 (#2124)

* MessageBar: Fixed collapsing text in multiline

* change file
---
 ...extfield-short-text-collapse_2017-07-03-17-23.json | 11 +++++++++++
 .../src/components/MessageBar/MessageBar.scss         |  7 +++----
 2 files changed, 14 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/textfield-short-text-collapse_2017-07-03-17-23.json

diff --git a/common/changes/office-ui-fabric-react/textfield-short-text-collapse_2017-07-03-17-23.json b/common/changes/office-ui-fabric-react/textfield-short-text-collapse_2017-07-03-17-23.json
new file mode 100644
index 0000000000000..f303717781e5e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/textfield-short-text-collapse_2017-07-03-17-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "MessageBar: Fixed collapsing text in multiline",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
index f019d33b8c82d..3870b25a69063 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
@@ -48,6 +48,7 @@
   @include ms-font-s;
   min-width: 0;
   display: flex;
+  flex-grow: 1;
 }
 
 
@@ -179,9 +180,7 @@
   @include focus-border();
   @include right(0);
   max-height: 16px;
-  min-width: 0;
-  position: absolute;
-  top: 0;
+  flex-shrink: 0;
 }
 
 .dismissalOneline {
@@ -225,7 +224,7 @@
   }
 
   .dismissal {
-    margin: 0px 12px;
+    margin: 0;
   }
 }
 

From aa1b5ca49558b625ff73d3c4253fc13f53062365 Mon Sep 17 00:00:00 2001
From: Mike Wheaton <miwhea@microsoft.com>
Date: Tue, 11 Jul 2017 15:32:38 -0700
Subject: [PATCH 0240/1641] DocumentCard: Deprecate accentColor prop, reduce
 thickness of divider line (#2179)

* Reduce divider border thickness from 2px to 1px. It's no longer necessary on the Compact variant, as this already has a border all the way around

* Deprecate the accentColor props. Remove from components and examples

* Add change file

* Revert "Deprecate the accentColor props. Remove from components and examples"

This reverts commit 60502e526d8648488608c37187ebd5fd7545fa00.

* Deprecate accentColor. Remove from visual test and examples

* Warn that accentColor is deprecated
---
 ...ntcard-design-updates_2017-07-11-20-48.json | 11 +++++++++++
 .../DocumentCard/DocumentCard.Props.ts         |  6 ++++++
 .../components/DocumentCard/DocumentCard.scss  |  7 +++----
 .../components/DocumentCard/DocumentCard.tsx   |  8 ++++++++
 .../DocumentCardPage.visualtest.tsx            |  3 +--
 .../examples/DocumentCard.Basic.Example.tsx    |  3 +--
 .../examples/DocumentCard.Compact.Example.tsx  |  4 ++--
 .../examples/DocumentCard.Complete.Example.tsx | 18 ++++++------------
 8 files changed, 38 insertions(+), 22 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/miwhea-documentcard-design-updates_2017-07-11-20-48.json

diff --git a/common/changes/office-ui-fabric-react/miwhea-documentcard-design-updates_2017-07-11-20-48.json b/common/changes/office-ui-fabric-react/miwhea-documentcard-design-updates_2017-07-11-20-48.json
new file mode 100644
index 0000000000000..a59bbb63bb219
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/miwhea-documentcard-design-updates_2017-07-11-20-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DocumentCard: Deprecate accentColor prop, reduce thickness of divider line",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mike@mikewheaton.ca"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.Props.ts b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.Props.ts
index f3335fdd9d27b..3406e3559ca71 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.Props.ts
@@ -45,6 +45,9 @@ export interface IDocumentCardProps extends React.Props<DocumentCard> {
   /**
    * Hex color value of the line below the card, which should correspond to the document type.
    * This should only be supplied when using the 'compact' card layout.
+   *
+   * Deprecated at v4.17.1, to be removed at >= v5.0.0.
+   * @deprecated
    */
   accentColor?: string;
 }
@@ -118,6 +121,9 @@ export interface IDocumentCardPreviewImage {
 
   /**
    * Hex color value of the line below the preview, which should correspond to the document type.
+   *
+   * Deprecated at v4.17.1, to be removed at >= v5.0.0.
+   * @deprecated
    */
   accentColor?: string;
 }
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.scss b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.scss
index f76099f814a85..47ee4fb136e51 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.scss
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.scss
@@ -35,7 +35,6 @@
 
 // Modifier: Compact layout
 .rootIsCompact {
-  border-bottom: 2px solid $ms-color-neutralTertiary; // Default border color
   display: flex;
   max-width: 480px;
   height: 109px;
@@ -45,9 +44,9 @@
     flex: 1;
     justify-content: space-between;
   }
-  // Remove the usual accent color from the preview
+
   .preview {
-    border-bottom: none;
+    border-bottom: none;   // Remove the usual border from the preview
     max-height: 106px;
     max-width: 144px;
 
@@ -210,7 +209,7 @@ $ms-DocumentCardActivity-personaTextGutter: 8px;
 
 /** Preview **/
 .preview {
-  border-bottom: 2px solid $ms-color-neutralTertiary; // Default border color
+  border-bottom: 1px solid $ms-color-neutralLight;
   position: relative;
   background-color: $ms-color-neutralLighterAlt;
   overflow: hidden;
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx
index d25954e1d2006..9c82c4e25b639 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx
@@ -14,6 +14,14 @@ export class DocumentCard extends BaseComponent<IDocumentCardProps, any> {
     type: DocumentCardType.normal
   };
 
+  constructor(props: IDocumentCardProps) {
+    super(props);
+
+    this._warnDeprecations({
+      accentColor: null
+    });
+  }
+
   public render() {
     let { onClick, onClickHref, children, className, type, accentColor } = this.props;
     let actionable = (onClick || onClickHref) ? true : false;
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.visualtest.tsx
index be334c3ff5af4..3f13332956c58 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.visualtest.tsx
@@ -11,8 +11,7 @@ export default class DocumentCardVPage extends React.Component<any, any> {
           previewImageSrc: 'dist/document-preview.png',
           iconSrc: 'dist/icon-ppt.png',
           width: 318,
-          height: 196,
-          accentColor: '#ce4b1f'
+          height: 196
         }
       ],
     };
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Basic.Example.tsx
index c50dbbbb4b7fa..a592fe6ea3632 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Basic.Example.tsx
@@ -20,8 +20,7 @@ export class DocumentCardBasicExample extends React.Component<any, any> {
           iconSrc: TestImages.iconPpt,
           imageFit: ImageFit.cover,
           width: 318,
-          height: 196,
-          accentColor: '#ce4b1f'
+          height: 196
         }
       ],
     };
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Compact.Example.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Compact.Example.tsx
index a98b45285dc35..aa96a31784aa0 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Compact.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Compact.Example.tsx
@@ -47,7 +47,7 @@ export class DocumentCardCompactExample extends React.Component<any, any> {
 
     return (
       <div>
-        <DocumentCard type={ DocumentCardType.compact } onClickHref='http://bing.com' accentColor='#ce4b1f'>
+        <DocumentCard type={ DocumentCardType.compact } onClickHref='http://bing.com'>
           <DocumentCardPreview { ...previewProps } />
           <div className='ms-DocumentCard-details'>
             <DocumentCardTitle
@@ -64,7 +64,7 @@ export class DocumentCardCompactExample extends React.Component<any, any> {
           </div>
         </DocumentCard>
         <p />
-        <DocumentCard type={ DocumentCardType.compact } onClickHref='http://bing.com' accentColor='#ce4b1f'>
+        <DocumentCard type={ DocumentCardType.compact } onClickHref='http://bing.com'>
           <DocumentCardPreview previewImages={ [previewProps.previewImages[0]] } />
           <div className='ms-DocumentCard-details'>
             <DocumentCardTitle
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx
index 950e80de3fad8..cec92786b2ad3 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx
@@ -23,8 +23,7 @@ export class DocumentCardCompleteExample extends React.Component<any, any> {
           iconSrc: TestImages.iconPpt,
           imageFit: ImageFit.cover,
           width: 318,
-          height: 196,
-          accentColor: '#ce4b1f'
+          height: 196
         },
         {
           name: 'New Contoso Collaboration for Conference Presentation Draft',
@@ -33,8 +32,7 @@ export class DocumentCardCompleteExample extends React.Component<any, any> {
           iconSrc: TestImages.iconPpt,
           imageFit: ImageFit.cover,
           width: 318,
-          height: 196,
-          accentColor: '#ce4b1f'
+          height: 196
         },
         {
           name: 'Spec Sheet for design',
@@ -43,8 +41,7 @@ export class DocumentCardCompleteExample extends React.Component<any, any> {
           iconSrc: TestImages.iconPpt,
           imageFit: ImageFit.cover,
           width: 318,
-          height: 196,
-          accentColor: '#ce4b1f'
+          height: 196
         },
         {
           name: 'Contoso Marketing Presentation',
@@ -53,8 +50,7 @@ export class DocumentCardCompleteExample extends React.Component<any, any> {
           iconSrc: TestImages.iconPpt,
           imageFit: ImageFit.cover,
           width: 318,
-          height: 196,
-          accentColor: '#ce4b1f'
+          height: 196
         },
         {
           name: 'Notes from Ignite conference',
@@ -63,8 +59,7 @@ export class DocumentCardCompleteExample extends React.Component<any, any> {
           iconSrc: TestImages.iconPpt,
           imageFit: ImageFit.cover,
           width: 318,
-          height: 196,
-          accentColor: '#ce4b1f'
+          height: 196
         },
         {
           name: 'FY17 Cost Projections',
@@ -73,8 +68,7 @@ export class DocumentCardCompleteExample extends React.Component<any, any> {
           iconSrc: TestImages.iconPpt,
           imageFit: ImageFit.cover,
           width: 318,
-          height: 196,
-          accentColor: '#ce4b1f'
+          height: 196
         }
       ],
 

From 722fb269de899788e6a5acf60f5c4f0727aaa0bc Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Tue, 11 Jul 2017 15:48:31 -0700
Subject: [PATCH 0241/1641] Adding ActivityItem component (#2161)

* Initial commit of the rough bones of the activity item.

* Made basic comment activity layout.

* Adding get class name method.

* Adding default activity type icons

* Moving activity description to a separate component.

* Making names, folders, and filenames render from a function instead of repeating long ternary operators.

* Adding customizable renderers for every element and customizable onClicks for every link.

* Fixing tslint errors.

* Basic support for compact activity items

* Rough support for multiple personas in compact layout.

* Improving positioning of multi-personas in compact activity layout.

* Removing most default behavior in favor of just rendering arrays of text/jsx.

* Fixing tslint issues

* Replacing People and onRenderIcon with a single iconContents property

* Updating examples to use in devlinks before removing them for PR.

* Removing activity item examples.

* Rush change

* Cleaning up pull request.

* Changing timeStamp to use an IRenderFunction.

* Making activity description and comments IRenderFunctions

* Splitting iconContents into separate a persona list and icon renderer.

* Making activityTypeIcon class always used and not interfere with personas/compact layout.

* Removing empty divs when they have no content.

* Fixing lint issues.

* TSLint fixes.
---
 ...krbrow-activity-item_2017-07-07-23-03.json |  11 ++
 .../ActivityItem/ActivityItem.Props.ts        | 129 +++++++++++++
 .../ActivityItem/ActivityItem.styles.ts       | 116 ++++++++++++
 .../components/ActivityItem/ActivityItem.tsx  | 170 ++++++++++++++++++
 .../src/components/ActivityItem/index.ts      |   2 +
 .../src/components/Persona/Persona.Props.ts   |   3 +-
 .../src/components/Persona/Persona.scss       |  51 ++++++
 .../src/components/Persona/PersonaConsts.ts   |   3 +-
 8 files changed, 483 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-activity-item_2017-07-07-23-03.json
 create mode 100644 packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.Props.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ActivityItem/index.ts

diff --git a/common/changes/office-ui-fabric-react/v-krbrow-activity-item_2017-07-07-23-03.json b/common/changes/office-ui-fabric-react/v-krbrow-activity-item_2017-07-07-23-03.json
new file mode 100644
index 0000000000000..8dc581d596631
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-activity-item_2017-07-07-23-03.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Adding ActivityItem component.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.Props.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.Props.ts
new file mode 100644
index 0000000000000..e1e7875fa0818
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.Props.ts
@@ -0,0 +1,129 @@
+import * as React from 'react';
+import { IStyle } from '../../Styling';
+import { IRenderFunction } from '../../Utilities';
+import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
+
+// Please keep alphabetized
+export interface IActivityItemProps extends React.HTMLAttributes<HTMLElement> {
+  /**
+   * Text describing the activity that occurred and naming the people involved in it.
+   */
+  activityDescriptionText?: string;
+
+  /**
+   * If onRenderIcon is not, then the persona props in this array will be used as the icon for the this activity item.
+   */
+  activityPersonas?: Array<IPersonaProps>;
+
+  /**
+   * Text of comments or @mention messages.
+   */
+  commentText?: string;
+
+  /**
+   * Indicated if the compact styling should be used.
+   */
+  isCompact?: boolean;
+
+  /**
+   * A renderer for the description of the current activity.
+   */
+  onRenderActivityDescription?: IRenderFunction<IActivityItemProps>;
+
+  /**
+   * A renderer that adds the text of a comment below the activity description.
+   */
+  onRenderComments?: IRenderFunction<IActivityItemProps>;
+
+  /**
+   * A renderer to create the icon next to the activity item.
+   */
+  onRenderIcon?: IRenderFunction<IActivityItemProps>;
+
+  /**
+   * A renderer adds a time stamp. If not included, timeStamp is shown as plain text below the activity.
+   */
+  onRenderTimeStamp?: IRenderFunction<IActivityItemProps>;
+
+  /**
+   * Optional styling for the elements within the Activity Item.
+   */
+  styles?: IActivityItemStyles;
+
+  /**
+   * Text shown as a timestamp on this activity. If not included, no timestamp is shown.
+   */
+  timeStamp?: string;
+}
+
+export interface IActivityItemStyles {
+  /**
+   * Styles applied to the root activity item container.
+   */
+  root?: IStyle;
+
+  /**
+   * Styles applied to the main container of the activity's description.
+   */
+  activityContent?: IStyle;
+
+  /**
+   * Styles applied to the persona of the user that did this activity.
+   */
+  activityPersona?: IStyle;
+
+  /**
+   * Styles applied to the activity's description.
+   */
+  activityText?: IStyle;
+
+  /**
+   * Styles applied to the icon indicating the type of the activity. Only shown when personas are unavailable.
+   */
+  activityTypeIcon?: IStyle;
+
+  /**
+   * Styles applied to the text of comments.
+   */
+  commentText?: IStyle;
+
+  /**
+   * Styles applied to personas when two users are involved in a single activity.
+   */
+  doublePersona?: IStyle;
+
+  /**
+   * Styles applied to root in the compact variant.
+   */
+  isCompactRoot?: IStyle;
+
+  /**
+   * Styles applied to personas and icons in the compact variant.
+   */
+  isCompactIcon?: IStyle;
+
+  /**
+   * Styles applied to main text container in the compact variant.
+   */
+  isCompactContent?: IStyle;
+
+  /**
+   * Styles applied to personas in the compact variant.
+   */
+  isCompactPersona?: IStyle;
+
+  /**
+   * Styles applied to a wrapper around personas in the compact variant.
+   */
+  isCompactPersonaContainer?: IStyle;
+
+  /**
+   * Styles applied to the container of the persona image or activity type icon.
+   */
+  personaContainer?: IStyle;
+
+  /**
+   * Styles applied to the timestamp at the end of each activity item.
+   */
+  timeStamp?: IStyle;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
new file mode 100644
index 0000000000000..c944694335fe7
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
@@ -0,0 +1,116 @@
+import {
+  mergeStyleSets,
+  ITheme,
+  getTheme
+} from '../../Styling';
+import {
+  memoizeFunction
+} from '../../Utilities';
+import { IActivityItemStyles } from './ActivityItem.Props';
+
+const DEFAULT_PERSONA_SIZE = '32px';
+const COMPACT_PERSONA_SIZE = '16px';
+const DEFAULT_ICON_SIZE = '24px';
+const COMPACT_ICON_SIZE = '13px';
+
+export const getStyles = memoizeFunction((
+  theme: ITheme = getTheme(),
+  customStyles: IActivityItemStyles = undefined
+): IActivityItemStyles => {
+  let ActivityItemStyles = {
+
+    root: [
+      theme.fonts.small,
+      {
+        display: 'flex',
+        justifyContent: 'flex-start',
+        alignItems: 'flex-start',
+        lineHeight: '17px',
+        boxSizing: 'border-box',
+        color: theme.palette.neutralSecondary
+      }
+    ],
+
+    isCompactRoot: {
+      alignItems: 'center'
+    },
+
+    personaContainer: {
+      display: 'flex',
+      flexWrap: 'wrap',
+      minWidth: DEFAULT_PERSONA_SIZE,
+      width: DEFAULT_PERSONA_SIZE,
+      height: DEFAULT_PERSONA_SIZE
+    },
+
+    isCompactPersonaContainer: {
+      display: 'inline-flex',
+      flexWrap: 'nowrap',
+      flexBasis: 'auto',
+      height: COMPACT_PERSONA_SIZE,
+      width: 'auto',
+      minWidth: '0',
+      paddingRight: '6px'
+    },
+
+    activityTypeIcon: {
+      height: DEFAULT_PERSONA_SIZE,
+      fontSize: DEFAULT_ICON_SIZE,
+      lineHeight: DEFAULT_ICON_SIZE,
+    },
+
+    isCompactIcon: {
+      height: COMPACT_PERSONA_SIZE,
+      fontSize: COMPACT_ICON_SIZE,
+      lineHeight: COMPACT_ICON_SIZE,
+      color: theme.palette.themePrimary
+    },
+
+    activityPersona: {
+      display: 'block'
+    },
+
+    doublePersona: {
+      '&:first-child': {
+        alignSelf: 'flex-end'
+      }
+    },
+
+    isCompactPersona: {
+      display: 'inline-block',
+      width: '8px',
+      minWidth: '8px',
+      overflow: 'visible'
+    },
+
+    activityContent: {
+      padding: '0 8px'
+    },
+
+    activityText: {
+      display: 'inline'
+    },
+
+    isCompactContent: {
+      flex: '1',
+      padding: '0 4px',
+      whiteSpace: 'nowrap',
+      textOverflow: 'ellipsis',
+      overflowX: 'hidden'
+    },
+
+    commentText: {
+      color: theme.palette.neutralPrimary
+    },
+
+    timeStamp: [
+      theme.fonts.tiny,
+      {
+        fontWeight: '400',
+        color: theme.palette.neutralSecondary
+      }
+    ]
+  };
+
+  return mergeStyleSets(ActivityItemStyles, customStyles);
+});
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
new file mode 100644
index 0000000000000..a1ecd941df1fb
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
@@ -0,0 +1,170 @@
+/* tslint:disable */
+import * as React from 'react';
+/* tslint:enable */
+
+import { autobind, BaseComponent, memoize } from '../../Utilities';
+import { IActivityItemProps, IActivityItemStyles } from './ActivityItem.Props';
+import { mergeStyles } from '../../Styling';
+import { getStyles } from './ActivityItem.styles';
+import { Persona, PersonaSize } from 'office-ui-fabric-react/lib/Persona';
+import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
+
+export interface IActivityItemClassNames {
+  root?: string;
+  activityContent?: string;
+  activityText?: string;
+  personaContainer?: string;
+  activityPersona?: string;
+  activityTypeIcon?: string;
+  commentText?: string;
+  timeStamp?: string;
+}
+
+export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
+  private _classNames: IActivityItemClassNames;
+  private _styles: IActivityItemStyles;
+
+  constructor(props: IActivityItemProps) {
+    super(props);
+  }
+
+  public render() {
+    let {
+      className,
+      onRenderIcon = this._onRenderIcon,
+      onRenderActivityDescription = this._onRenderActivityDescription,
+      onRenderComments = this._onRenderComments,
+      onRenderTimeStamp = this._onRenderTimeStamp,
+      styles: customStyles,
+    } = this.props;
+
+    this._styles = getStyles(undefined, customStyles);
+    this._classNames = this._getClassNames(
+      this._styles,
+      this.props.className,
+      this.props.activityPersonas,
+      this.props.isCompact
+    );
+
+    return (
+      <div className={ this._classNames.root } style={ this.props.style } >
+
+        { (this.props.onRenderIcon || this.props.activityPersonas) &&
+          <div className={ this._classNames.activityTypeIcon }>
+            { onRenderIcon(this.props, this._onRenderIcon) }
+          </div>
+        }
+
+        <div className={ this._classNames.activityContent }>
+          { onRenderActivityDescription(this.props, this._onRenderActivityDescription) }
+          { onRenderComments(this.props, this._onRenderComments) }
+          { onRenderTimeStamp(this.props, this._onRenderTimeStamp) }
+        </div>
+
+      </div>
+    );
+  }
+
+  @autobind
+  private _onRenderIcon(props: IActivityItemProps): JSX.Element {
+    if (props.activityPersonas) {
+      return this._onRenderPersonaArray(props);
+    }
+  }
+
+  @autobind
+  private _onRenderActivityDescription(props: IActivityItemProps): JSX.Element {
+    if (props.activityDescriptionText) {
+      return (<span className={ this._classNames.activityText }>{ props.activityDescriptionText }</span>);
+    }
+  }
+
+  @autobind
+  private _onRenderComments(props: IActivityItemProps): JSX.Element {
+    if (!props.isCompact && props.commentText) {
+      return (<div className={ this._classNames.commentText }>{ props.commentText }</div>);
+    }
+  }
+
+  @autobind
+  private _onRenderTimeStamp(props: IActivityItemProps): JSX.Element {
+    if (!props.isCompact && props.timeStamp) {
+      return (<div className={ this._classNames.timeStamp }>{ props.timeStamp }</div>);
+    }
+  }
+
+  // If activityPersonas is an array of persona props, build the persona cluster element.
+  @autobind
+  private _onRenderPersonaArray(props: IActivityItemProps): JSX.Element {
+    let personaElement: JSX.Element;
+    let activityPersonas: Array<IPersonaProps & { key?: string | number }> = props.activityPersonas;
+    if (activityPersonas[0].imageUrl || activityPersonas[0].imageInitials) {
+      let personaList: Array<JSX.Element> = [];
+      let showSize16Personas = (activityPersonas.length > 1 || props.isCompact);
+      let personaLimit = props.isCompact ? 3 : 4;
+      activityPersonas.filter((person, index) => index < personaLimit).forEach((person, index) => {
+        personaList.push(
+          <Persona
+            {...person}
+            // tslint:disable-next-line:no-string-literal
+            key={ person['key'] ? person['key'] : index }
+            className={ this._classNames.activityPersona }
+            size={ showSize16Personas ? PersonaSize.size16 : PersonaSize.extraSmall }
+            hidePersonaDetails={ true }
+            style={
+              props.isCompact && {
+                display: 'inline-block',
+                width: '8px',
+                minWidth: '8px',
+                overflow: 'visible'
+              }
+            } />
+        );
+      });
+      personaElement = <div className={ this._classNames.personaContainer }>{ personaList }</div>;
+    }
+    return personaElement;
+  }
+
+  // Determine what classNames each element needs
+  @memoize
+  private _getClassNames(styles: IActivityItemStyles, className: string, activityPersonas: Array<IPersonaProps>, isCompact: boolean): IActivityItemClassNames {
+    return {
+      root: mergeStyles(
+        'ms-ActivityItem',
+        styles.root,
+        className,
+        isCompact && styles.isCompactRoot
+      ) as string,
+
+      personaContainer: mergeStyles(
+        'ms-ActivityItem-personaContainer',
+        styles.personaContainer,
+        isCompact && styles.isCompactPersonaContainer
+      ) as string,
+
+      activityPersona: mergeStyles(
+        'ms-ActivityItem-activityPersona',
+        styles.activityPersona,
+        isCompact && styles.isCompactPersona,
+        !isCompact && activityPersonas && activityPersonas.length === 2 && styles.doublePersona
+      ) as string,
+
+      activityTypeIcon: mergeStyles(
+        'ms-ActivityItem-activityTypeIcon',
+        styles.activityTypeIcon,
+        isCompact && styles.isCompactIcon
+      ) as string,
+
+      activityContent: mergeStyles(
+        'ms-ActivityItem-activityContent',
+        styles.activityContent,
+        isCompact && styles.isCompactContent
+      ) as string,
+
+      activityText: mergeStyles('ms-ActivityItem-activityText', styles.activityText) as string,
+      commentText: mergeStyles('ms-ActivityItem-commentText', styles.commentText) as string,
+      timeStamp: mergeStyles('ms-ActivityItem-timeStamp', styles.timeStamp) as string
+    };
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/index.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/index.ts
new file mode 100644
index 0000000000000..717703d384051
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/index.ts
@@ -0,0 +1,2 @@
+export * from './ActivityItem';
+export * from './ActivityItem.Props';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts b/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
index 33dc2eb0f727c..6100112cf6cdb 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
@@ -128,7 +128,8 @@ export enum PersonaSize {
   regular = 4,
   large = 5,
   extraLarge = 6,
-  size28 = 7
+  size28 = 7,
+  size16 = 8
 }
 
 export enum PersonaPresence {
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
index b39eb94147d60..e06f8f0b18cfd 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
@@ -43,6 +43,7 @@ $ms-color-presence-busy-average:       #D93B3B;
 
 // Persona Sizes
 $ms-Persona-sizeTiny: 30px;
+$ms-Persona-size16:  16px;
 $ms-Persona-sizeXxs:  24px;
 $ms-Persona-size28:  28px;
 $ms-Persona-sizeXs:   32px;
@@ -328,6 +329,56 @@ $ms-Persona-presenceSizeXl: 28px;
   }
 }
 
+//== Modifier: 16px Persona
+//
+.root.rootIs16 {
+  height: $ms-Persona-size16;
+  min-width: $ms-Persona-size16;
+  overflow: hidden;
+
+  .imageArea {
+    box-shadow: 0 0 0 2px $ms-color-white;
+  }
+
+  .imageArea,
+  .image {
+    flex: 0 0 $ms-Persona-size16;
+    height: $ms-Persona-size16;
+    width: $ms-Persona-size16;
+  }
+
+  .placeholder {
+    font-size: 18px;
+    top: 4px;
+  }
+
+  .initials {
+    font-size: $ms-font-size-xs;
+    height: $ms-Persona-size16;
+    line-height: $ms-Persona-size16;
+  }
+
+  .presence {
+    height: $ms-Persona-presenceSizeXxs;
+    width: $ms-Persona-presenceSizeXxs;
+    border: 2px solid $ms-color-white;
+    @include ms-left(20px);
+  }
+
+  .presenceIcon {
+    font-size: 6px;
+    line-height: 9px;
+  }
+
+  .primaryText {
+    font-size: $ms-font-size-m;
+    line-height: $ms-Persona-size28;
+  }
+
+  .secondaryText {
+    display: none;
+  }
+}
 
 //== Modifier: Extra Small Persona
 //
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts b/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
index 12fd086d21ba7..6b2278f34428b 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
@@ -14,7 +14,8 @@ export const PERSONA_SIZE = {
   [PersonaSize.regular]: '',
   [PersonaSize.large]: 'ms-Persona--lg ' + styles.rootIsLarge,
   [PersonaSize.extraLarge]: 'ms-Persona--xl ' + styles.rootIsExtraLarge,
-  [PersonaSize.size28]: 'ms-Persona--28 ' + styles.rootIs28
+  [PersonaSize.size28]: 'ms-Persona--28 ' + styles.rootIs28,
+  [PersonaSize.size16]: 'ms-Persona--16 ' + styles.rootIs16
 };
 
 export const PERSONA_PRESENCE = {

From 2bd3f54840dfb665f6fdbe88408a4dd2c91b8979 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Tue, 11 Jul 2017 15:58:05 -0700
Subject: [PATCH 0242/1641] Example-App-Base: Enable strictNullChecks (#2147)

* Add types for highlight.js

* fix some no implict anys

* use register language @types

* Enable strict null checks in example app base

* Rush change

* Update package.json
---
 .../example-app-strict_2017-07-06-16-04.json  | 11 ++++++++++
 common/config/rush/npm-shrinkwrap.json        |  5 +++++
 packages/example-app-base/package.json        |  5 +++--
 .../src/components/App/App.tsx                | 10 ++++++---
 .../ComponentPage/ComponentPage.tsx           |  8 +++----
 .../src/components/Header/Header.tsx          | 12 +++++++----
 .../src/components/Highlight/Highlight.tsx    |  4 ++--
 .../PropertiesTable/PropertiesTable.tsx       |  6 +++---
 .../PropertiesTable/PropertiesTableSet.tsx    |  2 +-
 .../src/utilities/createApp.tsx               |  6 +++---
 .../example-app-base/src/utilities/data.ts    | 21 ++++++++++---------
 .../src/utilities/debugging.ts                | 10 ++++-----
 .../src/utilities/parser/BaseParser.ts        |  6 +++---
 .../src/utilities/parser/EnumParserHelper.ts  |  6 +++---
 .../utilities/parser/InterfaceParserHelper.ts |  6 +++---
 .../src/utilities/parser/Parse.ts             |  6 ++----
 packages/example-app-base/tsconfig.json       |  2 ++
 17 files changed, 76 insertions(+), 50 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/example-app-strict_2017-07-06-16-04.json

diff --git a/common/changes/@uifabric/example-app-base/example-app-strict_2017-07-06-16-04.json b/common/changes/@uifabric/example-app-base/example-app-strict_2017-07-06-16-04.json
new file mode 100644
index 0000000000000..6e5f07d1108eb
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/example-app-strict_2017-07-06-16-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Fix implicit anys, enable strict null checks",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "<christianjordangonzalez@gmail.com>"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 7a37640dea062..7b86924e4804e 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -1873,6 +1873,11 @@
       "resolved": "https://registry.npmjs.org/@types/gulp-util/-/gulp-util-3.0.30.tgz",
       "integrity": "sha1-TF9lg6IWCBOWZ+OsVrBbxn7PqPs="
     },
+    "@types/highlight.js": {
+      "version": "9.1.9",
+      "resolved": "https://registry.npmjs.org/@types/highlight.js/-/highlight.js-9.1.9.tgz",
+      "integrity": "sha1-7WM2lV6vIzt163kjubHzc9BF7wE="
+    },
     "@types/karma": {
       "version": "0.13.33",
       "resolved": "https://registry.npmjs.org/@types/karma/-/karma-0.13.33.tgz",
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 0703e53d05c6d..d0f223dc1ff81 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -19,7 +19,8 @@
     "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
     "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.0",
-    "@types/es6-promise": "^0.0.32",
+    "@types/es6-promise": "0.0.32",
+    "@types/highlight.js": "9.1.9",
     "@types/mocha": "2.2.39",
     "@types/react": "15.0.29",
     "@types/react-addons-test-utils": "0.14.18",
@@ -54,4 +55,4 @@
     "office-ui-fabric-react": ">=4.4.0 <5.0.0",
     "tslib": "^1.6.0"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/example-app-base/src/components/App/App.tsx b/packages/example-app-base/src/components/App/App.tsx
index 91bab92df3602..79644bcc263d1 100644
--- a/packages/example-app-base/src/components/App/App.tsx
+++ b/packages/example-app-base/src/components/App/App.tsx
@@ -35,7 +35,7 @@ export interface IAppDefinition {
 
 export interface IAppProps extends React.Props<App> {
   responsiveMode?: ResponsiveMode;
-  appDefinition?: IAppDefinition;
+  appDefinition: IAppDefinition;
 }
 
 export interface IAppState {
@@ -57,11 +57,15 @@ export class App extends React.Component<IAppProps, any> {
   }
 
   public render() {
-    let { responsiveMode, appDefinition } = this.props;
+    let { appDefinition, responsiveMode } = this.props;
     let { isMenuVisible } = this.state;
 
+    if (responsiveMode === undefined) {
+      responsiveMode = ResponsiveMode.large;
+    }
+
     let navPanel = (
-      <Nav groups={ appDefinition.examplePages } onLinkClick={ this._onLinkClick } onRenderLink={ (link) => ([
+      <Nav groups={ appDefinition.examplePages } onLinkClick={ this._onLinkClick } onRenderLink={ (link: INavLink) => ([
         <span key={ 1 } className='Nav-linkText'>{ link.name }</span>,
         (link.status !== undefined ?
           <span key={ 2 } className={ 'Nav-linkFlair ' + 'is-state' + link.status } >{ ExampleStatus[link.status] }</span> :
diff --git a/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx b/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
index aecb45b95df46..422a8a4d35455 100644
--- a/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
+++ b/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
@@ -70,7 +70,7 @@ export class ComponentPage extends React.Component<IComponentPageProps, {}> {
     );
   }
 
-  private _pageHeader(): JSX.Element {
+  private _pageHeader(): JSX.Element | undefined {
     if (this.props.isHeaderVisible) {
       return (
         <div className='ComponentPage-header'>
@@ -113,7 +113,7 @@ export class ComponentPage extends React.Component<IComponentPageProps, {}> {
     );
   }
 
-  private _getRelatedComponents(): JSX.Element {
+  private _getRelatedComponents(): JSX.Element | undefined {
     if (this.props.related) {
       return (
         <div className='ComponentPage-related'>
@@ -124,7 +124,7 @@ export class ComponentPage extends React.Component<IComponentPageProps, {}> {
     }
   }
 
-  private _getPropertiesTable(): JSX.Element {
+  private _getPropertiesTable(): JSX.Element | undefined {
     if (this.props.propertiesTables) {
       return (
         <div className='ComponentPage-implementationSection'>
@@ -135,7 +135,7 @@ export class ComponentPage extends React.Component<IComponentPageProps, {}> {
     }
   }
 
-  private _getDosAndDonts(): JSX.Element {
+  private _getDosAndDonts(): JSX.Element | undefined {
     let dosAndDonts: Array<JSX.Element> = [];
 
     if (this.props.bestPractices) {
diff --git a/packages/example-app-base/src/components/Header/Header.tsx b/packages/example-app-base/src/components/Header/Header.tsx
index 814667d8644f4..716d2bc1ea83c 100644
--- a/packages/example-app-base/src/components/Header/Header.tsx
+++ b/packages/example-app-base/src/components/Header/Header.tsx
@@ -40,7 +40,7 @@ export class Header extends React.Component<IHeaderProps, IHeaderState> {
     this._onMenuClick = this._onMenuClick.bind(this);
 
     this.state = {
-      contextMenu: null,
+      contextMenu: undefined,
       isRTLEnabled: getRTL()
     };
   }
@@ -49,6 +49,10 @@ export class Header extends React.Component<IHeaderProps, IHeaderState> {
     let { title, sideLinks, responsiveMode } = this.props;
     let { contextMenu } = this.state;
 
+    if (responsiveMode === undefined) {
+      responsiveMode = ResponsiveMode.large;
+    }
+
     // In medium and below scenarios, hide the side links.
     if (responsiveMode <= ResponsiveMode.large) {
       sideLinks = [];
@@ -103,7 +107,7 @@ export class Header extends React.Component<IHeaderProps, IHeaderState> {
     let { contextMenu } = this.state;
 
     this.setState({
-      contextMenu: contextMenu ? null : {
+      contextMenu: contextMenu ? undefined : {
         target: ev.currentTarget as HTMLElement,
         items: this._getOptionMenuItems()
       }
@@ -126,13 +130,13 @@ export class Header extends React.Component<IHeaderProps, IHeaderState> {
 
     this.setState({
       isRTLEnabled: !isRTLEnabled,
-      contextMenu: null
+      contextMenu: undefined
     });
   }
 
   private _onDismiss() {
     this.setState({
-      contextMenu: null
+      contextMenu: undefined
     });
   }
 }
diff --git a/packages/example-app-base/src/components/Highlight/Highlight.tsx b/packages/example-app-base/src/components/Highlight/Highlight.tsx
index 69d177046e47c..da2f5a2b7d8e0 100644
--- a/packages/example-app-base/src/components/Highlight/Highlight.tsx
+++ b/packages/example-app-base/src/components/Highlight/Highlight.tsx
@@ -1,9 +1,9 @@
 import * as React from 'react';
-import * as hljs from 'highlight.js/lib/highlight';
+import { registerLanguage } from 'highlight.js';
 import * as javascript from 'highlight.js/lib/languages/javascript';
 import { BaseComponent } from 'office-ui-fabric-react/lib/Utilities';
 
-hljs.registerLanguage('javascript', javascript);
+registerLanguage('javascript', javascript);
 
 export class Highlight extends BaseComponent<React.HTMLAttributes<HTMLDivElement>, {}> {
   private _codeElement: HTMLElement;
diff --git a/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx b/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx
index 323f81bd83539..d23364b774ec5 100644
--- a/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx
+++ b/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx
@@ -97,7 +97,7 @@ export class PropertiesTable extends React.Component<IPropertiesTableProps, any>
       ))
       .map((prop, index) => assign({}, prop, { key: index }));
 
-    let groups = null;
+    let groups: IGroup[] | null = null;
 
     if (!props.renderAsEnum) {
       groups = this._getGroups(properties);
@@ -143,8 +143,8 @@ export class PropertiesTable extends React.Component<IPropertiesTableProps, any>
     return groups;
   }
 
-  private _tryAddGroup(props, typeToCompare: InterfacePropertyType, name: string, index: number, allGroups): number {
-    let group: IGroup;
+  private _tryAddGroup(props: IInterfaceProperty[], typeToCompare: InterfacePropertyType, name: string, index: number, allGroups: IGroup[]): number {
+    let group: IGroup | undefined = undefined;
 
     while (index < props.length) {
       let prop = props[index];
diff --git a/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.tsx b/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.tsx
index 6c8b24e2bae6b..2f627c710630a 100644
--- a/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.tsx
+++ b/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.tsx
@@ -16,7 +16,7 @@ export class PropertiesTableSet extends React.Component<IPropertiesTableSetProps
   constructor(props: IPropertiesTableSetProps) {
     super(props);
     let { componentName, componentPath, sources } = props;
-    let src;
+    let src: any;
     let properties: IProperty[] = [];
 
     if (sources) {
diff --git a/packages/example-app-base/src/utilities/createApp.tsx b/packages/example-app-base/src/utilities/createApp.tsx
index 50fce71f5f165..7e3b4fefaeff0 100644
--- a/packages/example-app-base/src/utilities/createApp.tsx
+++ b/packages/example-app-base/src/utilities/createApp.tsx
@@ -16,7 +16,7 @@ import { ExampleGroup, IExample } from './examplesOf';
  * @param appTitle A title for the application that will be displayed in the header.
  * @param headerLinks A set of links to put in the header of the application.
  */
-export function createApp(examples: ExampleGroup | ExampleGroup[], defaultRouteComponent: () => JSX.Element = () => null, appTitle?: string, headerLinks?: IAppLink[]) {
+export function createApp(examples: ExampleGroup | ExampleGroup[], defaultRouteComponent: () => (JSX.Element | null) = () => null, appTitle?: string, headerLinks?: IAppLink[]) {
   let rootElement: HTMLElement | null;
   let groups: ExampleGroup[] = !Array.isArray(examples) ? [examples] : examples;
 
@@ -53,10 +53,10 @@ export function createApp(examples: ExampleGroup | ExampleGroup[], defaultRouteC
     ReactDOM.render(
       <Fabric>
         <Router>
-          <Route key='minimal' path='?minimal' component={ (props) => <div { ...props } /> }>
+          <Route key='minimal' path='?minimal' component={ (props: any) => <div { ...props } /> }>
             { routes }
           </Route>
-          <Route key={ 'app' } component={ (props) => <App appDefinition={ appDefinition } { ...props } /> }>
+          <Route key={ 'app' } component={ (props: any) => <App appDefinition={ appDefinition } { ...props } /> }>
             { routes }
           </Route>
         </Router>
diff --git a/packages/example-app-base/src/utilities/data.ts b/packages/example-app-base/src/utilities/data.ts
index 5b8071ccc071d..7a9e6c07bbd52 100644
--- a/packages/example-app-base/src/utilities/data.ts
+++ b/packages/example-app-base/src/utilities/data.ts
@@ -5,17 +5,17 @@ const LOREM_IPSUM = ('Lorem ipsum dolor sit amet, consectetur adipiscing elit, s
   'mollit anim id est laborum').split(' ');
 
 const DATA = {
-  'color' : [ 'red', 'blue', 'green', 'yellow' ],
-  'shape' : [ 'circle', 'square', 'triangle' ],
-  'location' : [ 'Seattle', 'New York', 'Chicago', 'Los Angeles', 'Portland' ]
+  'color': ['red', 'blue', 'green', 'yellow'],
+  'shape': ['circle', 'square', 'triangle'],
+  'location': ['Seattle', 'New York', 'Chicago', 'Los Angeles', 'Portland']
 };
 
 export function createListItems(count: number, startIndex = 0): any {
-  return Array.apply(null, Array(count)).map((item, index) => {
+  return Array.apply(null, Array(count)).map((item: any, index: number) => {
     let size = 150 + Math.round(Math.random() * 100);
 
     return {
-      thumbnail: `//placehold.it/${ size }x${ size }`,
+      thumbnail: `//placehold.it/${size}x${size}`,
       key: 'item-' + (index + startIndex) + ' ' + lorem(4),
       name: lorem(5),
       description: lorem(10 + Math.round(Math.random() * 50)),
@@ -30,11 +30,12 @@ export function createListItems(count: number, startIndex = 0): any {
 
 export function createGroups(
   groupCount: number, groupDepth: number, startIndex: number,
-  itemsPerGroup: number, level?: number, key?: string) {
-  key = key ? key + '-' : '';
-  level = level ? level : 0;
+  itemsPerGroup: number, level: number = 0, key: string = '') {
+  if (key !== '') {
+    key = key + '-';
+  }
   let count = Math.pow(itemsPerGroup, groupDepth);
-  return Array.apply(null, Array(groupCount)).map((value, index) => {
+  return Array.apply(null, Array(groupCount)).map((value: any, index: number) => {
     return {
       count: count,
       key: 'group' + key + index,
@@ -50,7 +51,7 @@ export function createGroups(
 
 export function lorem(wordCount: number): string {
   return Array.apply(null, Array(wordCount))
-    .map(item => _randWord(LOREM_IPSUM))
+    .map((item: any) => _randWord(LOREM_IPSUM))
     .join(' ');
 }
 
diff --git a/packages/example-app-base/src/utilities/debugging.ts b/packages/example-app-base/src/utilities/debugging.ts
index cac65b2a0748c..4f515dced4852 100644
--- a/packages/example-app-base/src/utilities/debugging.ts
+++ b/packages/example-app-base/src/utilities/debugging.ts
@@ -3,7 +3,7 @@ import { beep } from './beep';
 export function instrumentMethod(target: any, methodName: string) {
   const originalMethod = target[methodName];
 
-  target[methodName] = function() {
+  target[methodName] = function () {
     beep();
 
     let startTime = performance.now();
@@ -12,11 +12,11 @@ export function instrumentMethod(target: any, methodName: string) {
 
     /* tslint:disable:no-console */
     if (duration <= 1) {
-      console.log(`${ methodName } called`, getStackTrace());
+      console.log(`${methodName} called`, getStackTrace());
     } else if (duration <= 10) {
-      console.warn(`${ methodName } called, took ${ Math.round(duration * 1000) / 1000 }ms`, getStackTrace());
+      console.warn(`${methodName} called, took ${Math.round(duration * 1000) / 1000}ms`, getStackTrace());
     } else {
-      console.error(`${ methodName } called, took ${ Math.round(duration * 1000) / 1000 }ms`, getStackTrace());
+      console.error(`${methodName} called, took ${Math.round(duration * 1000) / 1000}ms`, getStackTrace());
     }
     /* tslint:enable:no-console */
 
@@ -30,7 +30,7 @@ export function getStackTrace() {
   };
 
   /* tslint:disable:no-string-literal */
-  const captureStackTrace = Error['captureStackTrace'];
+  const captureStackTrace = (Error as any)['captureStackTrace'];
   /* tslint:enable:no-string-literal */
 
   if (captureStackTrace) {
diff --git a/packages/example-app-base/src/utilities/parser/BaseParser.ts b/packages/example-app-base/src/utilities/parser/BaseParser.ts
index 093eec23d90f7..c8f0d9739397e 100644
--- a/packages/example-app-base/src/utilities/parser/BaseParser.ts
+++ b/packages/example-app-base/src/utilities/parser/BaseParser.ts
@@ -12,7 +12,7 @@ export class BaseParser {
     this._strLength = _str.length;
   }
 
-  protected eat(match: string): string {
+  protected eat(match: string): string | undefined {
     if (this._str.charAt(this._currLocation) === match) {
       return this._str.charAt(this._currLocation++);
     }
@@ -52,7 +52,7 @@ export class BaseParser {
     return this._str.substr(this._currLocation - i, i);
   }
 
-  protected eatWord(word: string): string {
+  protected eatWord(word: string): string | undefined {
     let len = word.length;
 
     if (this.peekAhead(len) === word) {
@@ -95,7 +95,7 @@ export class BaseParser {
    * @protected
    * @returns {string} The token that was advanced over, or undefined if it wasn't possible to advance.
    */
-  protected next(): string {
+  protected next(): string | undefined {
     if (this.hasNext()) {
       return this._str.charAt(this._currLocation++);
     }
diff --git a/packages/example-app-base/src/utilities/parser/EnumParserHelper.ts b/packages/example-app-base/src/utilities/parser/EnumParserHelper.ts
index 369661dbd06ee..fdb8538680612 100644
--- a/packages/example-app-base/src/utilities/parser/EnumParserHelper.ts
+++ b/packages/example-app-base/src/utilities/parser/EnumParserHelper.ts
@@ -23,11 +23,11 @@ export class EnumParserHelper extends BaseParser {
     super(str);
   }
 
-  public parse(): Array<IEnumProperty> {
-    let bank: Array<string> = [];
+  public parse(): IEnumProperty[] {
+    let bank: string[] = [];
     let comment = '';
     let identifierName = '';
-    let returnResult = [];
+    let returnResult: IEnumProperty[] = [];
     let noClosingSymbolAsterixPrereq = false;
 
     this.eatUntil(/\{/);
diff --git a/packages/example-app-base/src/utilities/parser/InterfaceParserHelper.ts b/packages/example-app-base/src/utilities/parser/InterfaceParserHelper.ts
index a287087c67dea..ea8671cfb8d85 100644
--- a/packages/example-app-base/src/utilities/parser/InterfaceParserHelper.ts
+++ b/packages/example-app-base/src/utilities/parser/InterfaceParserHelper.ts
@@ -27,12 +27,12 @@ export class InterfaceParserHelper extends BaseParser {
     super(str);
   }
 
-  public parse(): Array<IInterfaceProperty> {
-    let bank: Array<string> = [];
+  public parse(): IInterfaceProperty[] {
+    let bank: (string | undefined)[] = [];
     let comment = '';
     let identifierName = '';
     let type = '';
-    let returnResult = [];
+    let returnResult: IInterfaceProperty[] = [];
     let defaultValue = '';
     let isDeprecated = false;
     let deprecatedMessage = '';
diff --git a/packages/example-app-base/src/utilities/parser/Parse.ts b/packages/example-app-base/src/utilities/parser/Parse.ts
index 97966ac4a32d7..e8c25e5693be0 100644
--- a/packages/example-app-base/src/utilities/parser/Parse.ts
+++ b/packages/example-app-base/src/utilities/parser/Parse.ts
@@ -21,7 +21,7 @@ import { EnumParserHelper } from './EnumParserHelper';
  */
 export function parse(source: string, propsInterfaceOrEnumName?: string): IProperty[] {
   let props: IProperty[] = [];
-  let regex: RegExp = null;
+  let regex: RegExp | null = null;
   let parseInfo;
 
   let propertyNameSuffix = (type: string) => type === 'interface' ? ' interface' : ' enum';
@@ -41,7 +41,7 @@ export function parse(source: string, propsInterfaceOrEnumName?: string): IPrope
     }
   } else {
     regex = new RegExp(`export (interface|enum) (\\S*?)(?: extends .*?)? \\{(.*[\\r\\n]*)*?\\}`, 'g');
-    let regexResult: RegExpExecArray;
+    let regexResult: RegExpExecArray | null;
     let results: Array<IProperty> = [];
     while ((regexResult = regex.exec(source)) !== null) {
       parseInfo = _parseEnumOrInterface(regexResult);
@@ -64,11 +64,9 @@ function _parseEnumOrInterface(regexResult: RegExpExecArray) {
   if (regexResult[1] === 'interface') {
     let parser = new InterfaceParserHelper(regexResult[0]);
     parseInfo = parser.parse();
-    parser = null;
   } else {
     let parser = new EnumParserHelper(regexResult[0]);
     parseInfo = parser.parse();
-    parser = null;
   }
   return parseInfo;
 }
diff --git a/packages/example-app-base/tsconfig.json b/packages/example-app-base/tsconfig.json
index 069b558a332e6..77bb1c4318a09 100644
--- a/packages/example-app-base/tsconfig.json
+++ b/packages/example-app-base/tsconfig.json
@@ -8,6 +8,8 @@
     "experimentalDecorators": true,
     "importHelpers": true,
     "forceConsistentCasingInFileNames": true,
+    "noImplicitAny": false,
+    "strictNullChecks": true,
     "moduleResolution": "node",
     "lib": [
       "es2017",

From 73a4ebc5ae382eb50a4a3f3a2048066748358471 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 11 Jul 2017 18:02:43 -0700
Subject: [PATCH 0243/1641] Addressing TypeScript 2.4.1 complaints. (#2186)

* Updates for ts 2.4.1 compatibility.

* Adding change files.

* Optional id.
---
 .../fix-ts-issues_2017-07-12-00-20.json               | 11 +++++++++++
 .../styling/fix-ts-issues_2017-07-12-00-20.json       | 11 +++++++++++
 .../utilities/fix-ts-issues_2017-07-12-00-20.json     | 11 +++++++++++
 .../fix-ts-issues_2017-07-12-00-20.json               | 11 +++++++++++
 .../src/components/Highlight/Highlight.tsx            |  6 +++++-
 .../src/components/DetailsList/DetailsRow.tsx         |  1 +
 .../src/components/Layer/LayerHost.Props.ts           |  2 +-
 .../src/components/Layer/LayerHost.tsx                |  3 ++-
 .../src/utilities/selection/SelectionZone.tsx         |  1 +
 .../src/examples/AnimationTile/AnimationTile.tsx      |  1 +
 packages/utilities/api/utilities.api.ts               |  2 ++
 packages/utilities/src/BaseComponent.ts               |  4 ----
 packages/utilities/src/Customizer.tsx                 |  2 ++
 13 files changed, 59 insertions(+), 7 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/fix-ts-issues_2017-07-12-00-20.json
 create mode 100644 common/changes/@uifabric/styling/fix-ts-issues_2017-07-12-00-20.json
 create mode 100644 common/changes/@uifabric/utilities/fix-ts-issues_2017-07-12-00-20.json
 create mode 100644 common/changes/office-ui-fabric-react/fix-ts-issues_2017-07-12-00-20.json

diff --git a/common/changes/@uifabric/example-app-base/fix-ts-issues_2017-07-12-00-20.json b/common/changes/@uifabric/example-app-base/fix-ts-issues_2017-07-12-00-20.json
new file mode 100644
index 0000000000000..bbf072bdb1d37
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/fix-ts-issues_2017-07-12-00-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Fixing typings for TypeScript 2.4.1 compatibility.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/fix-ts-issues_2017-07-12-00-20.json b/common/changes/@uifabric/styling/fix-ts-issues_2017-07-12-00-20.json
new file mode 100644
index 0000000000000..d5b1592627f11
--- /dev/null
+++ b/common/changes/@uifabric/styling/fix-ts-issues_2017-07-12-00-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Fixing typings for TypeScript 2.4.1 compatibility.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/fix-ts-issues_2017-07-12-00-20.json b/common/changes/@uifabric/utilities/fix-ts-issues_2017-07-12-00-20.json
new file mode 100644
index 0000000000000..ea0960809d351
--- /dev/null
+++ b/common/changes/@uifabric/utilities/fix-ts-issues_2017-07-12-00-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Fixing typings for TypeScript 2.4.1 compatibility.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-ts-issues_2017-07-12-00-20.json b/common/changes/office-ui-fabric-react/fix-ts-issues_2017-07-12-00-20.json
new file mode 100644
index 0000000000000..5596ea6defcc8
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-ts-issues_2017-07-12-00-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixing typings for TypeScript 2.4.1 compatibility.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/src/components/Highlight/Highlight.tsx b/packages/example-app-base/src/components/Highlight/Highlight.tsx
index da2f5a2b7d8e0..5b10e5ed68d25 100644
--- a/packages/example-app-base/src/components/Highlight/Highlight.tsx
+++ b/packages/example-app-base/src/components/Highlight/Highlight.tsx
@@ -5,7 +5,11 @@ import { BaseComponent } from 'office-ui-fabric-react/lib/Utilities';
 
 registerLanguage('javascript', javascript);
 
-export class Highlight extends BaseComponent<React.HTMLAttributes<HTMLDivElement>, {}> {
+export interface IHighlightProps extends React.HTMLAttributes<HTMLDivElement> {
+  componentRef?: () => void;
+}
+
+export class Highlight extends BaseComponent<IHighlightProps, {}> {
   private _codeElement: HTMLElement;
 
   public render() {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index 34b27bb3c1ab5..ad7ca80e0b84d 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -29,6 +29,7 @@ import { AnimationClassNames } from '../../Styling';
 import * as checkStyles from './DetailsRowCheck.scss';
 
 export interface IDetailsRowProps extends React.Props<DetailsRow> {
+  componentRef?: () => void;
   item: any;
   itemIndex: number;
   columns: IColumn[];
diff --git a/packages/office-ui-fabric-react/src/components/Layer/LayerHost.Props.ts b/packages/office-ui-fabric-react/src/components/Layer/LayerHost.Props.ts
index 9f1f2b74ac945..2b87417a7e269 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/LayerHost.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Layer/LayerHost.Props.ts
@@ -14,5 +14,5 @@ export interface ILayerHostProps extends React.HTMLAttributes<HTMLElement> {
   /**
    * Defines the id for the layer host that Layers can target (using the hostId property.)
    */
-  id: string;
+  id?: string;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Layer/LayerHost.tsx b/packages/office-ui-fabric-react/src/components/Layer/LayerHost.tsx
index fee19b2a81252..3f8b26eb8215f 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/LayerHost.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/LayerHost.tsx
@@ -6,8 +6,9 @@ import {
 import {
   Layer
 } from './Layer';
+import { ILayerHostProps } from './LayerHost.Props';
 
-export class LayerHost extends BaseComponent<React.HTMLAttributes<HTMLElement>, {}> {
+export class LayerHost extends BaseComponent<ILayerHostProps, {}> {
 
   public shouldComponentUpdate() {
     return false;
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
index 9fde207de74b0..8bc4881f3c40c 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
@@ -40,6 +40,7 @@ const SELECTION_INVOKE_ATTRIBUTE_NAME = 'data-selection-invoke';
 const SELECTALL_TOGGLE_ALL_ATTRIBUTE_NAME = 'data-selection-all-toggle';
 
 export interface ISelectionZoneProps extends React.Props<SelectionZone> {
+  componentRef?: () => void;
   selection: ISelection;
   layout?: ISelectionLayout;
   selectionMode?: SelectionMode;
diff --git a/packages/styling/src/examples/AnimationTile/AnimationTile.tsx b/packages/styling/src/examples/AnimationTile/AnimationTile.tsx
index 545bcf46b3603..fa69006d84fc7 100644
--- a/packages/styling/src/examples/AnimationTile/AnimationTile.tsx
+++ b/packages/styling/src/examples/AnimationTile/AnimationTile.tsx
@@ -8,6 +8,7 @@ import {
 import { IAnimationTileStyles, getStyles } from './AnimationTile.styles';
 
 export interface IAnimationTileProps {
+  componentRef?: () => void;
   name: string;
 }
 
diff --git a/packages/utilities/api/utilities.api.ts b/packages/utilities/api/utilities.api.ts
index 1df8642e9109a..6679ce45a2025 100644
--- a/packages/utilities/api/utilities.api.ts
+++ b/packages/utilities/api/utilities.api.ts
@@ -225,6 +225,8 @@ interface IChangeEventCallback {
 
 // @public
 interface ICustomizerProps {
+  // (undocumented)
+  componentRef?: () => void;
   // (undocumented)
   settings: ISettings;
 }
diff --git a/packages/utilities/src/BaseComponent.ts b/packages/utilities/src/BaseComponent.ts
index d96ede877ff6c..351a355d27c90 100644
--- a/packages/utilities/src/BaseComponent.ts
+++ b/packages/utilities/src/BaseComponent.ts
@@ -46,10 +46,6 @@ export class BaseComponent<P extends IBaseProps, S> extends React.Component<P, S
   constructor(props?: P, context?: any) {
     super(props, context);
 
-    if (props) {
-      this.props = props;
-    }
-
     this._shouldUpdateComponentRef = true;
 
     _makeAllSafe(this, BaseComponent.prototype, [
diff --git a/packages/utilities/src/Customizer.tsx b/packages/utilities/src/Customizer.tsx
index d8bdbc03e1ea1..010603decfc39 100644
--- a/packages/utilities/src/Customizer.tsx
+++ b/packages/utilities/src/Customizer.tsx
@@ -17,6 +17,8 @@ export interface ISettings {
  * @public
  */
 export interface ICustomizerProps {
+  componentRef?: () => void;
+
   settings: ISettings;
 }
 

From d4ff884080518d4cc381eba66a0ffc75f776d2e5 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 12 Jul 2017 01:49:50 +0000
Subject: [PATCH 0244/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  4 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../example-app-strict_2017-07-06-16-04.json  | 11 ----
 .../fix-ts-issues_2017-07-12-00-20.json       | 11 ----
 ...oufr-no-implicit-any_2017-07-07-15-08.json | 11 ----
 ...oufr-no-implicit-any_2017-07-07-15-08.json | 11 ----
 .../fix-ts-issues_2017-07-12-00-20.json       | 11 ----
 ...oufr-no-implicit-any_2017-07-07-15-08.json | 11 ----
 .../fix-ts-issues_2017-07-12-00-20.json       | 11 ----
 ...emor-splitbutton-fix_2017-07-06-18-06.json | 11 ----
 .../fix-ts-issues_2017-07-12-00-20.json       | 11 ----
 ...ableOptionInterfaces_2017-06-30-08-23.json | 11 ----
 ...tcard-design-updates_2017-07-11-20-48.json | 11 ----
 ...oufr-no-implicit-any_2017-07-07-15-08.json | 11 ----
 ...-short-text-collapse_2017-07-03-17-23.json | 11 ----
 ...krbrow-activity-item_2017-07-07-23-03.json | 11 ----
 packages/example-app-base/CHANGELOG.json      | 29 ++++++++++
 packages/example-app-base/CHANGELOG.md        | 13 ++++-
 packages/example-app-base/package.json        |  8 +--
 packages/example-component/package.json       |  8 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 57 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 18 +++++-
 packages/office-ui-fabric-react/package.json  |  8 +--
 packages/styling/CHANGELOG.json               | 19 +++++++
 packages/styling/CHANGELOG.md                 |  9 ++-
 packages/styling/package.json                 |  4 +-
 packages/utilities/CHANGELOG.json             | 14 +++++
 packages/utilities/CHANGELOG.md               |  9 ++-
 packages/utilities/package.json               |  2 +-
 31 files changed, 184 insertions(+), 178 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/example-app-strict_2017-07-06-16-04.json
 delete mode 100644 common/changes/@uifabric/example-app-base/fix-ts-issues_2017-07-12-00-20.json
 delete mode 100644 common/changes/@uifabric/example-app-base/oufr-no-implicit-any_2017-07-07-15-08.json
 delete mode 100644 common/changes/@uifabric/fabric-website/oufr-no-implicit-any_2017-07-07-15-08.json
 delete mode 100644 common/changes/@uifabric/styling/fix-ts-issues_2017-07-12-00-20.json
 delete mode 100644 common/changes/@uifabric/styling/oufr-no-implicit-any_2017-07-07-15-08.json
 delete mode 100644 common/changes/@uifabric/utilities/fix-ts-issues_2017-07-12-00-20.json
 delete mode 100644 common/changes/office-ui-fabric-react/boemor-splitbutton-fix_2017-07-06-18-06.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-ts-issues_2017-07-12-00-20.json
 delete mode 100644 common/changes/office-ui-fabric-react/liaye-Combobox-ExposeSelectableOptionInterfaces_2017-06-30-08-23.json
 delete mode 100644 common/changes/office-ui-fabric-react/miwhea-documentcard-design-updates_2017-07-11-20-48.json
 delete mode 100644 common/changes/office-ui-fabric-react/oufr-no-implicit-any_2017-07-07-15-08.json
 delete mode 100644 common/changes/office-ui-fabric-react/textfield-short-text-collapse_2017-07-03-17-23.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-activity-item_2017-07-07-23-03.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 2a857fdfd68c0..eb02975026aca 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -47,8 +47,8 @@
     "webpack-bundle-analyzer": "^2.2.1"
   },
   "dependencies": {
-    "@uifabric/example-app-base": ">=4.0.3 <5.0.0",
-    "@uifabric/utilities": ">=4.7.1 <5.0.0",
+    "@uifabric/example-app-base": ">=4.1.0 <5.0.0",
+    "@uifabric/utilities": ">=4.7.2 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 2924c3bf55e17..4e5cd0e2d4321 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.17.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.18.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 24cd8c6143be6..062a31e5c1a3a 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.17.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.18.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 475b094a7f894..e03eaf19bcd13 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.17.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.18.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/@uifabric/example-app-base/example-app-strict_2017-07-06-16-04.json b/common/changes/@uifabric/example-app-base/example-app-strict_2017-07-06-16-04.json
deleted file mode 100644
index 6e5f07d1108eb..0000000000000
--- a/common/changes/@uifabric/example-app-base/example-app-strict_2017-07-06-16-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Fix implicit anys, enable strict null checks",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "<christianjordangonzalez@gmail.com>"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/fix-ts-issues_2017-07-12-00-20.json b/common/changes/@uifabric/example-app-base/fix-ts-issues_2017-07-12-00-20.json
deleted file mode 100644
index bbf072bdb1d37..0000000000000
--- a/common/changes/@uifabric/example-app-base/fix-ts-issues_2017-07-12-00-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Fixing typings for TypeScript 2.4.1 compatibility.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/oufr-no-implicit-any_2017-07-07-15-08.json b/common/changes/@uifabric/example-app-base/oufr-no-implicit-any_2017-07-07-15-08.json
deleted file mode 100644
index 8986a3dbd61f2..0000000000000
--- a/common/changes/@uifabric/example-app-base/oufr-no-implicit-any_2017-07-07-15-08.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "<christianjordangonzalez@gmail.com>"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/oufr-no-implicit-any_2017-07-07-15-08.json b/common/changes/@uifabric/fabric-website/oufr-no-implicit-any_2017-07-07-15-08.json
deleted file mode 100644
index fa5fca5c645eb..0000000000000
--- a/common/changes/@uifabric/fabric-website/oufr-no-implicit-any_2017-07-07-15-08.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "<christianjordangonzalez@gmail.com>"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/fix-ts-issues_2017-07-12-00-20.json b/common/changes/@uifabric/styling/fix-ts-issues_2017-07-12-00-20.json
deleted file mode 100644
index d5b1592627f11..0000000000000
--- a/common/changes/@uifabric/styling/fix-ts-issues_2017-07-12-00-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Fixing typings for TypeScript 2.4.1 compatibility.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/oufr-no-implicit-any_2017-07-07-15-08.json b/common/changes/@uifabric/styling/oufr-no-implicit-any_2017-07-07-15-08.json
deleted file mode 100644
index e6b8f7e62cafd..0000000000000
--- a/common/changes/@uifabric/styling/oufr-no-implicit-any_2017-07-07-15-08.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "<christianjordangonzalez@gmail.com>"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/fix-ts-issues_2017-07-12-00-20.json b/common/changes/@uifabric/utilities/fix-ts-issues_2017-07-12-00-20.json
deleted file mode 100644
index ea0960809d351..0000000000000
--- a/common/changes/@uifabric/utilities/fix-ts-issues_2017-07-12-00-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Fixing typings for TypeScript 2.4.1 compatibility.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/boemor-splitbutton-fix_2017-07-06-18-06.json b/common/changes/office-ui-fabric-react/boemor-splitbutton-fix_2017-07-06-18-06.json
deleted file mode 100644
index aabad0c877a46..0000000000000
--- a/common/changes/office-ui-fabric-react/boemor-splitbutton-fix_2017-07-06-18-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix styling issues with SplitButton. Add new split boolean property to Button.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "boemor@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-ts-issues_2017-07-12-00-20.json b/common/changes/office-ui-fabric-react/fix-ts-issues_2017-07-12-00-20.json
deleted file mode 100644
index 5596ea6defcc8..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-ts-issues_2017-07-12-00-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixing typings for TypeScript 2.4.1 compatibility.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/liaye-Combobox-ExposeSelectableOptionInterfaces_2017-06-30-08-23.json b/common/changes/office-ui-fabric-react/liaye-Combobox-ExposeSelectableOptionInterfaces_2017-06-30-08-23.json
deleted file mode 100644
index c3b629f2e5e95..0000000000000
--- a/common/changes/office-ui-fabric-react/liaye-Combobox-ExposeSelectableOptionInterfaces_2017-06-30-08-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Expose APIs of selectableOptions since they're required APIs for ComboBox component",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "liaye@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/miwhea-documentcard-design-updates_2017-07-11-20-48.json b/common/changes/office-ui-fabric-react/miwhea-documentcard-design-updates_2017-07-11-20-48.json
deleted file mode 100644
index a59bbb63bb219..0000000000000
--- a/common/changes/office-ui-fabric-react/miwhea-documentcard-design-updates_2017-07-11-20-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DocumentCard: Deprecate accentColor prop, reduce thickness of divider line",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mike@mikewheaton.ca"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/oufr-no-implicit-any_2017-07-07-15-08.json b/common/changes/office-ui-fabric-react/oufr-no-implicit-any_2017-07-07-15-08.json
deleted file mode 100644
index dc4f783256546..0000000000000
--- a/common/changes/office-ui-fabric-react/oufr-no-implicit-any_2017-07-07-15-08.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Enable noImplicitAny",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "<christianjordangonzalez@gmail.com>"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/textfield-short-text-collapse_2017-07-03-17-23.json b/common/changes/office-ui-fabric-react/textfield-short-text-collapse_2017-07-03-17-23.json
deleted file mode 100644
index f303717781e5e..0000000000000
--- a/common/changes/office-ui-fabric-react/textfield-short-text-collapse_2017-07-03-17-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "MessageBar: Fixed collapsing text in multiline",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-activity-item_2017-07-07-23-03.json b/common/changes/office-ui-fabric-react/v-krbrow-activity-item_2017-07-07-23-03.json
deleted file mode 100644
index 8dc581d596631..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-activity-item_2017-07-07-23-03.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Adding ActivityItem component.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index f9f93a5377071..53b2c3f0bb360 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,35 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "4.1.0",
+      "tag": "@uifabric/example-app-base_v4.1.0",
+      "date": "Wed, 12 Jul 2017 01:49:50 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "2bd3f54840dfb665f6fdbe88408a4dd2c91b8979",
+            "comment": "Fix implicit anys, enable strict null checks"
+          }
+        ],
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "73a4ebc5ae382eb50a4a3f3a2048066748358471",
+            "comment": "Fixing typings for TypeScript 2.4.1 compatibility."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.13.5 <1.0.0` to `>=0.13.6 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.7.1 <5.0.0` to `>=4.7.2 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.0.3",
       "tag": "@uifabric/example-app-base_v4.0.3",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index d5c5748ec3d23..47461f33ff4f8 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Tue, 11 Jul 2017 10:14:04 GMT and should not be manually modified.
+This log was last generated on Wed, 12 Jul 2017 01:49:50 GMT and should not be manually modified.
+
+## 4.1.0
+Wed, 12 Jul 2017 01:49:50 GMT
+
+### Minor changes
+
+- Fix implicit anys, enable strict null checks
+
+### Patches
+
+- Fixing typings for TypeScript 2.4.1 compatibility.
 
 ## 4.0.3
 Tue, 11 Jul 2017 10:14:04 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index d0f223dc1ff81..96382d489558b 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "4.0.3",
+  "version": "4.1.0",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -48,11 +48,11 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.13.5 <1.0.0",
-    "@uifabric/utilities": ">=4.7.1 <5.0.0",
+    "@uifabric/styling": ">=0.13.6 <1.0.0",
+    "@uifabric/utilities": ">=4.7.2 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.4.0 <5.0.0",
     "tslib": "^1.6.0"
   }
-}
+}
\ No newline at end of file
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index dcd549e6a649e..6a6e4016f6084 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-component",
-  "version": "1.0.43",
+  "version": "1.0.44",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -21,8 +21,8 @@
     "@types/react-addons-test-utils": "0.14.18",
     "@types/react-dom": "15.5.0",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": "4.0.3",
-    "@uifabric/utilities": "4.7.1",
+    "@uifabric/example-app-base": "4.1.0",
+    "@uifabric/utilities": "4.7.2",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.17.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.18.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index bfbbbe2cc83f1..9555669c7e1f4 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,63 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.18.0",
+      "tag": "office-ui-fabric-react_v4.18.0",
+      "date": "Wed, 12 Jul 2017 01:49:50 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Boris Emorine <boris.emorine@gmail.com>",
+            "commit": "ce314d75b908fa19e7e38fdf9c52c8312f9727c0",
+            "comment": "Fix styling issues with SplitButton. Add new split boolean property to Button."
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "73a4ebc5ae382eb50a4a3f3a2048066748358471",
+            "comment": "Fixing typings for TypeScript 2.4.1 compatibility."
+          },
+          {
+            "author": "Mike Wheaton <miwhea@microsoft.com>",
+            "commit": "aa1b5ca49558b625ff73d3c4253fc13f53062365",
+            "comment": "DocumentCard: Deprecate accentColor prop, reduce thickness of divider line"
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "c4bb4fb265f4c40620110700b78186311e8b8063",
+            "comment": "Enable noImplicitAny"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "d95d6dd57c0c08374620d05b3a24f19f332ee2bc",
+            "comment": "MessageBar: Fixed collapsing text in multiline"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Liaoliang Ye <supersingerman@126.com>",
+            "commit": "5929d059746f0016ab140846652d760af36fdbda",
+            "comment": "Expose APIs of selectableOptions since they're required APIs for ComboBox component"
+          },
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "722fb269de899788e6a5acf60f5c4f0727aaa0bc",
+            "comment": "Adding ActivityItem component."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.7.1 <5.0.0` to `>=4.7.2 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.13.5 <1.0.0` to `>=0.13.6 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `4.0.3` to `4.1.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.17.1",
       "tag": "office-ui-fabric-react_v4.17.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index cc8baf5a1c561..9efa1bb81699a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,22 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 10 Jul 2017 19:18:55 GMT and should not be manually modified.
+This log was last generated on Wed, 12 Jul 2017 01:49:50 GMT and should not be manually modified.
+
+## 4.18.0
+Wed, 12 Jul 2017 01:49:50 GMT
+
+### Minor changes
+
+- Expose APIs of selectableOptions since they're required APIs for ComboBox component
+- Adding ActivityItem component.
+
+### Patches
+
+- Fix styling issues with SplitButton. Add new split boolean property to Button.
+- Fixing typings for TypeScript 2.4.1 compatibility.
+- DocumentCard: Deprecate accentColor prop, reduce thickness of divider line
+- Enable noImplicitAny
+- MessageBar: Fixed collapsing text in multiline
 
 ## 4.17.1
 Mon, 10 Jul 2017 19:18:55 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 89b48ab3d4f93..495afabc0d9c8 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.17.1",
+  "version": "4.18.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": "4.0.3",
+    "@uifabric/example-app-base": "4.1.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -71,8 +71,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.7.1 <5.0.0",
-    "@uifabric/styling": ">=0.13.5 <1.0.0",
+    "@uifabric/utilities": ">=4.7.2 <5.0.0",
+    "@uifabric/styling": ">=0.13.6 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index af34fd7708360..fd3b19b96e23d 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.13.6",
+      "tag": "@uifabric/styling_v0.13.6",
+      "date": "Wed, 12 Jul 2017 01:49:50 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "73a4ebc5ae382eb50a4a3f3a2048066748358471",
+            "comment": "Fixing typings for TypeScript 2.4.1 compatibility."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.7.1 <5.0.0` to `>=4.7.2 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.13.5",
       "tag": "@uifabric/styling_v0.13.5",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 0cb8a8f48c8a6..fe57f7fd142b8 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Tue, 11 Jul 2017 10:14:04 GMT and should not be manually modified.
+This log was last generated on Wed, 12 Jul 2017 01:49:50 GMT and should not be manually modified.
+
+## 0.13.6
+Wed, 12 Jul 2017 01:49:50 GMT
+
+### Patches
+
+- Fixing typings for TypeScript 2.4.1 compatibility.
 
 ## 0.13.5
 Tue, 11 Jul 2017 10:14:04 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 658bf0d8af19d..8bf12b8c7fb53 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.13.5",
+  "version": "0.13.6",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.7.1 <5.0.0",
+    "@uifabric/utilities": ">=4.7.2 <5.0.0",
     "tslib": "^1.6.0",
     "rtl-css-js": "^1.1.1",
     "glamor": "^2.20.24"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 205799a416fcb..06fc93cbdf753 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.7.2",
+      "tag": "@uifabric/utilities_v4.7.2",
+      "date": "Wed, 12 Jul 2017 01:49:50 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "73a4ebc5ae382eb50a4a3f3a2048066748358471",
+            "comment": "Fixing typings for TypeScript 2.4.1 compatibility."
+          }
+        ]
+      }
+    },
     {
       "version": "4.7.1",
       "tag": "@uifabric/utilities_v4.7.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 26aaaca762827..6df089d4a4c3d 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Sat, 08 Jul 2017 03:34:35 GMT and should not be manually modified.
+This log was last generated on Wed, 12 Jul 2017 01:49:50 GMT and should not be manually modified.
+
+## 4.7.2
+Wed, 12 Jul 2017 01:49:50 GMT
+
+### Patches
+
+- Fixing typings for TypeScript 2.4.1 compatibility.
 
 ## 4.7.1
 Sat, 08 Jul 2017 03:34:35 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 27e323158e49d..cfdd6b50e2d33 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.7.1",
+  "version": "4.7.2",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From ecac3cb1e22c64da7a846cbbe6c8a0a8ef0bd47b Mon Sep 17 00:00:00 2001
From: Christopher Schleiden <cschleiden@live.de>
Date: Wed, 12 Jul 2017 10:53:31 -0700
Subject: [PATCH 0245/1641] DetailsList: Allow passing props to List (#2190)

* DetailsList: Add list props

* Add change file
---
 .../users-cschleid-addListProps_2017-07-12-15-01.json | 11 +++++++++++
 .../src/components/DetailsList/DetailsList.Props.ts   |  4 ++++
 .../src/components/DetailsList/DetailsList.tsx        | 10 ++++++----
 3 files changed, 21 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-cschleid-addListProps_2017-07-12-15-01.json

diff --git a/common/changes/office-ui-fabric-react/users-cschleid-addListProps_2017-07-12-15-01.json b/common/changes/office-ui-fabric-react/users-cschleid-addListProps_2017-07-12-15-01.json
new file mode 100644
index 0000000000000..9dab86d99429d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-cschleid-addListProps_2017-07-12-15-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: Allow passing props to underlying List",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "cschleid@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
index 0f78c64ff890d..3b09a23cf684b 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
@@ -17,6 +17,7 @@ import {
 import { IDetailsRowProps } from '../DetailsList/DetailsRow';
 import { IDetailsHeaderProps } from './DetailsHeader';
 import { IViewport } from '../../utilities/decorators/withViewport';
+import { IListProps } from '../List/index';
 
 export { IDetailsHeaderProps };
 
@@ -42,6 +43,9 @@ export interface IDetailsListProps extends React.Props<DetailsList> {
   /** The items to render. */
   items: any[];
 
+  /** Optional properties to pass through to the list components being rendered. */
+  listProps?: IListProps;
+
   /**
    * Optional default focused index to set focus to once the items have rendered and the index exists.
    */
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 6a35ed1e8c2e1..464f78d071d67 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -34,7 +34,7 @@ import {
 
 import { DragDropHelper } from '../../utilities/dragdrop/DragDropHelper';
 import { GroupedList } from '../../GroupedList';
-import { List } from '../../List';
+import { List, IListProps } from '../../List';
 import { withViewport } from '../../utilities/decorators/withViewport';
 
 const styles: any = stylesImport;
@@ -209,7 +209,8 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       ariaLabelForGrid,
       rowElementEventMap,
       shouldApplyApplicationRole = false,
-      getKey
+      getKey,
+      listProps
     } = this.props;
     let {
       adjustedColumns,
@@ -223,10 +224,11 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       _dragDropHelper: dragDropHelper
     } = this;
     let groupNestingDepth = this._getGroupNestingDepth();
-    let additionalListProps = {
+    const additionalListProps: IListProps = {
       renderedWindowsAhead: isSizing ? 0 : DEFAULT_RENDERED_WINDOWS_AHEAD,
       renderedWindowsBehind: isSizing ? 0 : DEFAULT_RENDERED_WINDOWS_BEHIND,
-      getKey
+      getKey,
+      ...listProps
     };
     let selectAllVisibility = SelectAllVisibility.none; // for SelectionMode.none
     if (selectionMode === SelectionMode.single) {

From 9ce99671d04ee11c943ae613be66603d4eb0a1d3 Mon Sep 17 00:00:00 2001
From: Christopher Schleiden <cschleiden@live.de>
Date: Wed, 12 Jul 2017 11:44:52 -0700
Subject: [PATCH 0246/1641] List: Only draw single window when receiving new
 items (#2191)

* List: Only draw single window when receiving new items

* Add change file
---
 ...sers-cschleid-listRedraw_2017-07-12-16-01.json | 11 +++++++++++
 .../src/components/List/List.tsx                  | 15 +++++++++++++--
 2 files changed, 24 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-cschleid-listRedraw_2017-07-12-16-01.json

diff --git a/common/changes/office-ui-fabric-react/users-cschleid-listRedraw_2017-07-12-16-01.json b/common/changes/office-ui-fabric-react/users-cschleid-listRedraw_2017-07-12-16-01.json
new file mode 100644
index 0000000000000..6685a68d25f38
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-cschleid-listRedraw_2017-07-12-16-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "List: Only draw a single window when receiving new items",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "cschleid@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index 5a90a84de1222..aeaaa5d869951 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -245,6 +245,11 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       newProps.renderCount !== this.props.renderCount ||
       newProps.startIndex !== this.props.startIndex) {
 
+      // We have received new items so we want to make sure that initially we only render a single window to
+      // fill the currently visible rect, and then later render additional windows.
+      this._resetRequiredWindows();
+      this._requiredRect = null;
+
       this._measureVersion++;
       this._updatePages(newProps);
     }
@@ -301,6 +306,8 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       pageElements.push(this._renderPage(pages[i]));
     }
 
+    // console.log(`Page elements ${pageElements.length}`);
+
     return (
       <div ref='root' { ...divProps } role={ role } className={ css('ms-List', className) } >
         <div ref='surface' className='ms-List-surface' role='presentation'>
@@ -382,6 +389,10 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
    * we will call onAsyncIdle which will reset it back to it's correct value.
    */
   private _onScroll() {
+    this._resetRequiredWindows();
+  }
+
+  private _resetRequiredWindows() {
     this._requiredWindowsAhead = 0;
     this._requiredWindowsBehind = 0;
   }
@@ -547,7 +558,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   private _onPageAdded(page: IPage) {
     let { onPageAdded } = this.props;
 
-    // console.log('page added', page.startIndex, this.state.pages.map(page=>page.key).join(', '));
+    // console.log('page added', page.startIndex, this.state.pages.map(page => page.key).join(', '));
 
     if (onPageAdded) {
       onPageAdded(page);
@@ -558,7 +569,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   private _onPageRemoved(page: IPage) {
     let { onPageRemoved } = this.props;
 
-    // console.log('  --- page removed', page.startIndex, this.state.pages.map(page=>page.key).join(', '));
+    // console.log('  --- page removed', page.startIndex, this.state.pages.map(page => page.key).join(', '));
 
     if (onPageRemoved) {
       onPageRemoved(page);

From 16c3d9e638778fbda2e9c3d4c94fa7551fe4a67d Mon Sep 17 00:00:00 2001
From: Aniket Handa <atneik@users.noreply.github.com>
Date: Wed, 12 Jul 2017 14:04:03 -0700
Subject: [PATCH 0247/1641] Add variant of Callout with no shadow on one edge
 (#2174)

* init

* Use CalloutLinkType instead of isBeakVisible

* Add rush change

* Radix fix
---
 ...mmandBar-menu-shadow_2017-07-10-23-32.json | 11 +++++
 ...mmandBar-menu-shadow_2017-07-10-23-32.json | 11 +++++
 ...mmandBar-menu-shadow_2017-07-10-23-32.json | 11 +++++
 ...mmandBar-menu-shadow_2017-07-10-23-32.json | 11 +++++
 ...mmandBar-menu-shadow_2017-07-10-23-32.json | 11 +++++
 .../src/components/Button/BaseButton.tsx      |  2 +
 .../src/components/Callout/Callout.Props.ts   | 12 ++++--
 .../src/components/Callout/Callout.scss       | 14 ++++++-
 .../src/components/Callout/CalloutContent.tsx | 32 ++++++++++++---
 .../examples/Callout.Cover.Example.tsx        |  4 +-
 .../examples/Callout.Directional.Example.tsx  | 40 ++++++++++++++-----
 .../src/components/Callout/index.ts           |  1 +
 .../src/components/ComboBox/ComboBox.tsx      |  3 +-
 .../src/components/CommandBar/CommandBar.tsx  |  2 +
 .../src/components/Dropdown/Dropdown.scss     |  2 -
 .../src/components/Dropdown/Dropdown.tsx      |  3 +-
 .../SwatchColorPicker/SwatchColorPicker.tsx   |  3 +-
 .../src/utilities/positioning.ts              | 39 ++++++++++++++----
 18 files changed, 177 insertions(+), 35 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
 create mode 100644 common/changes/@uifabric/fabric-website/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
 create mode 100644 common/changes/@uifabric/styling/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
 create mode 100644 common/changes/@uifabric/utilities/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
 create mode 100644 common/changes/office-ui-fabric-react/anihan-commandBar-menu-shadow_2017-07-10-23-32.json

diff --git a/common/changes/@uifabric/example-app-base/anihan-commandBar-menu-shadow_2017-07-10-23-32.json b/common/changes/@uifabric/example-app-base/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
new file mode 100644
index 0000000000000..fa53882beab0f
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "anihan@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/anihan-commandBar-menu-shadow_2017-07-10-23-32.json b/common/changes/@uifabric/fabric-website/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
new file mode 100644
index 0000000000000..a7a946702dea0
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "anihan@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/anihan-commandBar-menu-shadow_2017-07-10-23-32.json b/common/changes/@uifabric/styling/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
new file mode 100644
index 0000000000000..a97fc36c90b66
--- /dev/null
+++ b/common/changes/@uifabric/styling/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "anihan@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/anihan-commandBar-menu-shadow_2017-07-10-23-32.json b/common/changes/@uifabric/utilities/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
new file mode 100644
index 0000000000000..faf4dbcc11174
--- /dev/null
+++ b/common/changes/@uifabric/utilities/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "anihan@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/anihan-commandBar-menu-shadow_2017-07-10-23-32.json b/common/changes/office-ui-fabric-react/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
new file mode 100644
index 0000000000000..a5455ad0d3b18
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add variant of Callout with no shadow on one edge",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "anihan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 3059694014a0a..580c085362e5e 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -14,6 +14,7 @@ import {
 import { Icon, IIconProps } from '../../Icon';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { ContextualMenu, IContextualMenuProps } from '../../ContextualMenu';
+import { CalloutLinkType } from '../../Callout';
 import { IButtonProps, IButton } from './Button.Props';
 import { IconButton } from './IconButton/IconButton';
 import { IButtonClassNames, getClassNames } from './BaseButton.classNames';
@@ -333,6 +334,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         target={ this._buttonElement }
         labelElementId={ this._labelId }
         onDismiss={ this._onToggleMenu }
+        calloutProps={ { linkType: CalloutLinkType.attached } }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts b/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
index 8d4c841174ac5..107c4a3a07919 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
@@ -6,6 +6,7 @@ import {
   IPoint,
   IRectangle
 } from '../../Utilities';
+import { CalloutLinkType } from '../../utilities/positioning';
 
 export interface ICallout {
 
@@ -72,10 +73,9 @@ export interface ICalloutProps extends React.Props<Callout | CalloutContent> {
   targetPoint?: IPoint;
 
   /**
-   * If true then the beak is visible. If false it will not be shown.
-   * @default true
+   * To specify the link type between the callout and target. Such as a Beak, etc.
    */
-  isBeakVisible?: boolean;
+  linkType?: CalloutLinkType;
 
   /**
    * If true then the onClose will not not dismiss on scroll
@@ -158,6 +158,12 @@ export interface ICalloutProps extends React.Props<Callout | CalloutContent> {
    */
   setInitialFocus?: boolean;
 
+  /**
+   * Deprecated. If true then the beak is visible. If false it will not be shown. Use linkType instead.
+   * @deprecated @default true
+   */
+  isBeakVisible?: boolean;
+
   /**
     * Deprecated at v0.59.1, to be removed at >= v1.0.0. Pass in a beakWidth to dictate size.
     * @deprecated
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
index 937eff9c7a5e0..85de5e8ecd68b 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
@@ -9,6 +9,7 @@
 
 $Callout-beak-slant-width: 28px;
 $Callout-smallbeak-slant-width: 16px;
+$Callout-shadow-spread-margin: 5px;
 
 @mixin calloutBeak {
   position: absolute;
@@ -22,7 +23,7 @@ $Callout-smallbeak-slant-width: 16px;
 }
 
 .root {
-  @include ms-drop-shadow(0,0, 5px, 0px);
+  @include ms-drop-shadow(0,0, #{ $Callout-shadow-spread-margin }, 0px);
   position: absolute;
   border: 1px solid $ms-color-neutralLight;
   box-sizing: border-box;
@@ -33,6 +34,11 @@ $Callout-smallbeak-slant-width: 16px;
   @media screen and (-ms-high-contrast: black-on-white) {
     border: 1px solid $ms-color-black;
   }
+  &.rootIsAttached {
+    box-shadow: none;
+    border: none;
+    overflow: hidden;
+  }
 }
 
 .container {
@@ -45,6 +51,12 @@ $Callout-smallbeak-slant-width: 16px;
   overflow-x: hidden;
   overflow-y: auto;
   position: relative;
+
+  &.mainIsAttached {
+    margin: $Callout-shadow-spread-margin;
+    @include ms-drop-shadow(0,0, #{ $Callout-shadow-spread-margin }, 0px);
+    border: 1px solid $ms-color-neutralLight;
+  }
 }
 
 .overFlowYHidden {
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index 0142e060f6757..2365d6be5b385 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -14,7 +14,7 @@ import {
   getWindow,
   getDocument
 } from '../../Utilities';
-import { getRelativePositions, IPositionInfo, IPositionProps, getMaxHeight } from '../../utilities/positioning';
+import { getRelativePositions, IPositionInfo, IPositionProps, getMaxHeight, RectangleEdge, CalloutLinkType } from '../../utilities/positioning';
 import { Popup } from '../../Popup';
 import * as stylesImport from './Callout.scss';
 import { AnimationClassNames } from '../../Styling';
@@ -24,6 +24,7 @@ const styles: any = stylesImport;
 const BEAK_ORIGIN_POSITION = { top: 0, left: 0 };
 const OFF_SCREEN_STYLE = { opacity: 0 };
 const BORDER_WIDTH: number = 1;
+const SHADOW_SPREAD_MARGIN: number = 5; // keep in sync with scss variable
 
 export interface ICalloutState {
   positions?: IPositionInfo;
@@ -111,6 +112,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       children,
       beakWidth,
       finalHeight,
+      linkType,
       backgroundColor } = this.props;
     let { positions } = this.state;
     let beakStyleWidth = beakWidth;
@@ -129,12 +131,22 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       backgroundColor: backgroundColor,
     };
 
+    let isAttached = linkType === CalloutLinkType.attached;
+
+    let attachedStyle: React.CSSProperties = isAttached && positions && {
+      marginTop: positions.rectangleEdge === RectangleEdge.bottom ? 0 : SHADOW_SPREAD_MARGIN,
+      marginBottom: positions.rectangleEdge === RectangleEdge.top ? 0 : SHADOW_SPREAD_MARGIN,
+      marginLeft: positions.rectangleEdge === RectangleEdge.right ? 0 : SHADOW_SPREAD_MARGIN,
+      marginRight: positions.rectangleEdge === RectangleEdge.left ? 0 : SHADOW_SPREAD_MARGIN
+    };
+
     let directionalClassName = (positions && positions.directionalClassName)
       ? (AnimationClassNames as any)[positions.directionalClassName]
       : '';
 
     let contentMaxHeight: number = this._getMaxHeight() + this.state.heightOffset;
-    let beakVisible: boolean = isBeakVisible && (!!targetElement || !!target);
+    // Temporary as isBeakVisible is deprecated.
+    let beakVisible: boolean = (linkType !== undefined ? linkType === CalloutLinkType.beak : isBeakVisible) && (!!targetElement || !!target);
     let content = (
       <div
         ref={ this._resolveRef('_hostElement') }
@@ -145,6 +157,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
             css(
               'ms-Callout',
               styles.root,
+              isAttached && styles.rootIsAttached,
               className,
               directionalClassName
             ) }
@@ -165,12 +178,12 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
             ariaLabel={ ariaLabel }
             ariaDescribedBy={ ariaDescribedBy }
             ariaLabelledBy={ ariaLabelledBy }
-            className={ css('ms-Callout-main', styles.main, {
+            className={ css('ms-Callout-main', styles.main, isAttached && styles.mainIsAttached, {
               [styles.overFlowYHidden]: finalHeight
             }) }
             onDismiss={ this.dismiss }
             shouldRestoreFocus={ true }
-            style={ { maxHeight: contentMaxHeight, backgroundColor: backgroundColor } }>
+            style={ Object.assign({ maxHeight: contentMaxHeight, backgroundColor: backgroundColor }, attachedStyle) }>
             { children }
           </Popup>
         </div>
@@ -255,6 +268,13 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
         currentProps.target = this._target;
       }
       let newPositions: IPositionInfo = getRelativePositions(currentProps, hostElement, calloutElement);
+      if (this.props.linkType === CalloutLinkType.attached) {
+        if (newPositions.rectangleEdge === RectangleEdge.left) {
+          newPositions.calloutPosition.left += SHADOW_SPREAD_MARGIN;
+        } else {
+          newPositions.calloutPosition.left -= SHADOW_SPREAD_MARGIN;
+        }
+      }
 
       // Set the new position only when the positions are not exists or one of the new callout positions are different.
       // The position should not change if the position is within 2 decimal places.
@@ -298,7 +318,9 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
   private _getMaxHeight(): number {
     if (!this._maxHeight) {
       if (this.props.directionalHintFixed && this._target) {
-        let beakWidth = this.props.isBeakVisible ? this.props.beakWidth : 0;
+        let beakWidth = (this.props.linkType !== undefined ? this.props.linkType === CalloutLinkType.beak : this.props.isBeakVisible)
+          ? this.props.beakWidth
+          : 0;
         let gapSpace = this.props.gapSpace ? this.props.gapSpace : 0;
         this._maxHeight = getMaxHeight(this._target, this.props.directionalHint, beakWidth + gapSpace, this._getBounds());
       } else {
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
index 3d427be6c5f16..19dc0a5e46517 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import './CalloutExample.scss';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
-import { Callout, DirectionalHint } from 'office-ui-fabric-react/lib/Callout';
+import { Callout, DirectionalHint, CalloutLinkType } from 'office-ui-fabric-react/lib/Callout';
 import { Dropdown, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
 
 export interface ICalloutCoverExampleState {
@@ -67,7 +67,7 @@ export class CalloutCoverExample extends React.Component<any, ICalloutCoverExamp
             targetElement={ this._menuButtonElement }
             directionalHint={ directionalHint }
             coverTarget={ true }
-            isBeakVisible={ false }
+            linkType={ CalloutLinkType.none }
             gapSpace={ 0 }
           >
             <div className='ms-CalloutExample-header'>
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
index 668b8bf97ab13..466a8eaf18c25 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
@@ -1,8 +1,8 @@
 import * as React from 'react';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
-import { Callout, DirectionalHint } from 'office-ui-fabric-react/lib/Callout';
+import { Callout, DirectionalHint, CalloutLinkType } from 'office-ui-fabric-react/lib/Callout';
 import { Dropdown, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
-import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
+import { ChoiceGroup, IChoiceGroupOption } from 'office-ui-fabric-react/lib/ChoiceGroup';
 import { Slider } from 'office-ui-fabric-react/lib/Slider';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import './CalloutExample.scss';
@@ -10,7 +10,7 @@ import './CalloutExample.scss';
 export interface ICalloutDirectionalExampleState {
   isCalloutVisible?: boolean;
   directionalHint?: DirectionalHint;
-  isBeakVisible?: boolean;
+  linkType?: CalloutLinkType;
   gapSpace?: number;
   beakWidth?: number;
 }
@@ -39,25 +39,43 @@ export class CalloutDirectionalExample extends React.Component<any, ICalloutDire
 
     this.state = {
       isCalloutVisible: false,
-      isBeakVisible: true,
+      linkType: CalloutLinkType.beak,
       directionalHint: DirectionalHint.bottomLeftEdge
     };
   }
 
   public render() {
-    let { isCalloutVisible, isBeakVisible, directionalHint, gapSpace, beakWidth } = this.state;
+    let { isCalloutVisible, linkType, directionalHint, gapSpace, beakWidth } = this.state;
     //  ms-Callout-smallbeak is used in this directional example to reflect all the positions. Large beak will disable some position to avoid beak over the callout edge.
     return (
       <div className='ms-CalloutExample'>
         <div className='ms-CalloutExample-configArea'>
-          <Checkbox label='Show beak' checked={ isBeakVisible } onChange={ this._onShowBeakChange } />
+          <ChoiceGroup
+            label='Link type'
+            selectedKey={ linkType.toString() }
+            options={ [
+              {
+                key: CalloutLinkType.none.toString(),
+                text: 'None'
+              },
+              {
+                key: CalloutLinkType.beak.toString(),
+                text: 'Beak'
+              },
+              {
+                key: CalloutLinkType.attached.toString(),
+                text: 'Attached'
+              }
+            ] }
+            onChange={ this._onShowBeakChange }
+          />
           <Slider
             max={ 30 }
             label='Gap Space'
             min={ 0 }
             defaultValue={ 0 }
             onChange={ this._onGapSlider } />
-          { isBeakVisible &&
+          { linkType === CalloutLinkType.beak &&
             (<Slider
               max={ 50 }
               label='Beak Width'
@@ -81,7 +99,7 @@ export class CalloutDirectionalExample extends React.Component<any, ICalloutDire
             className='ms-CalloutExample-callout'
             gapSpace={ gapSpace }
             targetElement={ this._menuButtonElement }
-            isBeakVisible={ isBeakVisible }
+            linkType={ linkType }
             beakWidth={ beakWidth }
             onDismiss={ this._onCalloutDismiss }
             directionalHint={ directionalHint }
@@ -119,10 +137,10 @@ export class CalloutDirectionalExample extends React.Component<any, ICalloutDire
   }
 
   @autobind
-  private _onShowBeakChange(ev: React.FormEvent<HTMLElement>, isVisible: boolean) {
+  private _onShowBeakChange(ev: React.FormEvent<HTMLElement>, option: IChoiceGroupOption) {
     this.setState({
-      isBeakVisible: isVisible,
-      beakWidth: 10
+      linkType: parseInt(option.key, 10),
+      beakWidth: parseInt(option.key, 10) === CalloutLinkType.beak ? 16 : 0
     });
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Callout/index.ts b/packages/office-ui-fabric-react/src/components/Callout/index.ts
index 0f37e86477559..177c89bc6ab46 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/index.ts
@@ -1,3 +1,4 @@
 export * from './Callout';
 export * from './Callout.Props';
 export * from '../../common/DirectionalHint';
+export * from '../../utilities/positioning';
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 18e97e90376f5..03b0d14a9dd03 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { IComboBoxOption, IComboBoxProps } from './ComboBox.Props';
 import { DirectionalHint } from '../../common/DirectionalHint';
-import { Callout } from '../../Callout';
+import { Callout, CalloutLinkType } from '../../Callout';
 import { Label } from '../../Label';
 import {
   CommandButton,
@@ -732,6 +732,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         targetElement={ this._comboBoxWrapper }
         onDismiss={ this._onDismiss }
         setInitialFocus={ false }
+        linkType={ CalloutLinkType.attached }
       >
         <div ref={ this._resolveRef('_comboBoxMenu') } style={ { width: this._comboBoxWrapper.clientWidth - 2 } }>
           { onRenderList({ ...props }, this._onRenderList) }
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 3cd26b5c51e35..7a45d6d5d7c9c 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -12,6 +12,7 @@ import {
 import { ICommandBar, ICommandBarProps } from './CommandBar.Props';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { ContextualMenu, IContextualMenuProps, IContextualMenuItem, hasSubmenuItems } from '../../ContextualMenu';
+import { CalloutLinkType } from '../../Callout';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import {
   Icon,
@@ -147,6 +148,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
             targetElement={ contextualMenuTarget }
             labelElementId={ expandedMenuId }
             onDismiss={ this._onContextMenuDismiss }
+            calloutProps={ { linkType: CalloutLinkType.attached } }
           />
           ) : (null)
         }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
index c3ef234a0f696..09085c4740d69 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
@@ -178,8 +178,6 @@ $DropDown-item-height: 32px;
   }
 
 .callout {
-  box-shadow: 0 0px 5px 0px rgba(0, 0, 0, 0.4);
-  border: 1px solid $ms-color-neutralLight;
 }
 
 .errorMessage{
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 5f74b140aaf53..07b567f6b6c9f 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { IDropdownProps, IDropdownOption, DropdownMenuItemType } from './Dropdown.Props';
 import { DirectionalHint } from '../../common/DirectionalHint';
-import { Callout } from '../../Callout';
+import { Callout, CalloutLinkType } from '../../Callout';
 import { Label } from '../../Label';
 import { CommandButton } from '../../Button';
 import { Panel } from '../../Panel';
@@ -295,6 +295,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
           targetElement={ this._dropDown }
           onDismiss={ this._onDismiss }
           onPositioned={ this._onPositioned }
+          linkType={ CalloutLinkType.attached }
         >
           <div style={ { width: this._dropDown.clientWidth - 2 } }>
             { onRenderList(props, this._onRenderList) }
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
index 6827cb492c7f7..151e21ae1979b 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
@@ -15,7 +15,7 @@ import { DirectionalHint } from '../../ContextualMenu';
 import { getColorFromString } from '../../utilities/color/colors';
 import { Grid } from '../../utilities/grid/Grid';
 import { DefaultButton, CommandButton, IButtonProps } from '../../Button';
-import { Callout } from '../../Callout';
+import { Callout, CalloutLinkType } from '../../Callout';
 import { FocusZone } from '../../FocusZone';
 import * as stylesImport from './SwatchColorPicker.scss';
 const styles: any = stylesImport;
@@ -644,6 +644,7 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
         className={ css('ms-swatchColorPickerMenu', styles.swatchColorPickerContainer) }
         targetElement={ this._buttonWrapper }
         onDismiss={ this._onDismiss }
+        linkType={ CalloutLinkType.attached }
         setInitialFocus={ true }>
         <SwatchColorPickerBody
           { ...this.props }
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning.ts b/packages/office-ui-fabric-react/src/utilities/positioning.ts
index cd32f7eb7be1a..91d2af19edfdd 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning.ts
@@ -3,7 +3,8 @@ import {
   IRectangle,
   assign,
   getScrollbarWidth,
-  Rectangle
+  Rectangle,
+  IPoint
 } from '../Utilities';
 
 export enum RectangleEdge {
@@ -20,6 +21,23 @@ export enum Position {
   end = 3
 }
 
+export enum CalloutLinkType {
+  /**
+   * Default behavior. To show shadows on all sides
+   */
+  none = 0,
+
+  /**
+   * To show a beak between the target and the Callout
+   */
+  beak = 1,
+
+  /**
+   * To remove shadow on one side of the component, so that it appears attached to the target
+   */
+  attached = 2
+}
+
 let SLIDE_ANIMATIONS: { [key: number]: string; } = {
   [RectangleEdge.top]: 'slideUpIn20',
   [RectangleEdge.bottom]: 'slideDownIn20',
@@ -69,9 +87,16 @@ export interface IPositionProps {
    */
   targetPoint?: IPoint;
 
-  /** If true then the beak is visible. If false it will not be shown. */
+  /** If true then the beak is visible. If false it will not be shown.
+   * @deprecated
+  */
   isBeakVisible?: boolean;
 
+  /**
+   * To specify the link type between the callout and target. Such as a Beak, etc.
+   */
+  linkType: CalloutLinkType;
+
   /**
    * If true the position returned will have the menu element cover the target.
    * If false then it will position next to the target;
@@ -90,14 +115,10 @@ export interface IPositionInfo {
   calloutPosition: { top: number, left: number };
   beakPosition: { top: number, left: number, display: string };
   directionalClassName: string;
+  rectangleEdge: RectangleEdge;
   submenuDirection: DirectionalHint;
 }
 
-export interface IPoint {
-  x: number;
-  y: number;
-}
-
 export class PositionData {
   public calloutDirection: RectangleEdge;
   public targetDirection: RectangleEdge;
@@ -160,7 +181,8 @@ export function getRelativePositions(
   props: IPositionProps,
   hostElement: HTMLElement,
   calloutElement: HTMLElement): IPositionInfo {
-  let beakWidth: number = !props.isBeakVisible ? 0 : props.beakWidth;
+  // Temporary as isBeakVisible is deprecated.
+  let beakWidth: number = (props.linkType ? props.linkType === CalloutLinkType.beak : props.isBeakVisible) ? props.beakWidth : 0;
   let borderWidth: number = positioningFunctions._getBorderSize(calloutElement);
   let gap: number = positioningFunctions._calculateActualBeakWidthInPixels(beakWidth) / 2 + (props.gapSpace ? props.gapSpace : 0);
   let boundingRect: Rectangle = props.bounds ?
@@ -192,6 +214,7 @@ export function getRelativePositions(
     calloutPosition: { top: finalizedCallout.top, left: finalizedCallout.left },
     beakPosition: { top: beakPositioned.top, left: beakPositioned.left, display: 'block' },
     directionalClassName: SLIDE_ANIMATIONS[positionedCallout.targetEdge],
+    rectangleEdge: positionedCallout.targetEdge,
     submenuDirection: positionedCallout.calloutEdge === RectangleEdge.right ? DirectionalHint.leftBottomEdge : DirectionalHint.rightBottomEdge
   };
 }

From 894d72c05d1ca0dea6cf22d1bde17d6e9edc4147 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 12 Jul 2017 14:08:21 -0700
Subject: [PATCH 0248/1641] More TypeScript 2.4.1 fixes. (#2194)

* Fixing all TypeScript 2.4.1 issues in oufr, tested by linking referencing top level import, and building from a ts 2.4.1 instance.

* Adding change file.

* Fixing issues.
---
 .../ts241-fixes_2017-07-12-19-08.json         | 11 +++++++
 .../src/common/ConnectedHost.tsx              |  1 +
 .../src/common/StoreHost.tsx                  |  1 +
 .../ActivityItem/ActivityItem.Props.ts        |  5 ++++
 .../src/components/Button/BaseButton.tsx      |  2 +-
 .../src/components/Calendar/CalendarDay.tsx   |  3 +-
 .../src/components/Calendar/CalendarMonth.tsx |  3 +-
 .../src/components/Check/Check.tsx            |  5 ++++
 .../ColorPicker/ColorPicker.Props.ts          |  5 ++++
 .../components/ColorPicker/ColorRectangle.tsx |  1 +
 .../components/ColorPicker/ColorSlider.tsx    |  1 +
 .../src/components/ComboBox/ComboBox.tsx      |  6 ++--
 .../DetailsList/DetailsRowFields.tsx          |  1 +
 .../components/Dialog/DialogContent.Props.ts  | 16 ++++++----
 .../DocumentCard/DocumentCard.Props.ts        | 30 +++++++++++++++++++
 .../src/components/Dropdown/Dropdown.Props.ts |  8 +++--
 .../src/components/Fabric/Fabric.tsx          |  1 +
 .../GroupedList/GroupedList.Props.ts          |  6 +++-
 .../GroupedList/GroupedListSection.tsx        |  5 ++++
 .../OverflowSet/OverflowSet.Props.ts          |  6 ++++
 .../components/OverflowSet/OverflowSet.tsx    |  4 +--
 .../src/components/Pivot/PivotItem.Props.ts   |  5 ++++
 .../ResizeGroup.OverflowSet.Example.tsx       |  2 +-
 .../components/SpinButton/SpinButton.Props.ts | 26 +++++++++++-----
 .../src/components/SpinButton/SpinButton.tsx  |  9 +++++-
 .../SwatchColorPicker.Props.ts                |  6 ++++
 .../SwatchColorPicker/SwatchColorPicker.tsx   |  4 ++-
 .../pickers/AutoFill/BaseAutoFill.Props.ts    |  5 ++++
 .../components/pickers/BasePicker.Props.ts    |  2 ++
 .../components/pickers/PickerItem.Props.ts    |  1 +
 .../pickers/Suggestions/Suggestions.Props.ts  |  6 ++++
 .../examples/Picker.CustomResult.Example.tsx  |  4 +--
 .../src/utilities/grid/Grid.Props.ts          |  4 +++
 .../src/utilities/router/Router.tsx           | 11 +++++--
 34 files changed, 173 insertions(+), 33 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/ts241-fixes_2017-07-12-19-08.json

diff --git a/common/changes/office-ui-fabric-react/ts241-fixes_2017-07-12-19-08.json b/common/changes/office-ui-fabric-react/ts241-fixes_2017-07-12-19-08.json
new file mode 100644
index 0000000000000..0c633249d5703
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/ts241-fixes_2017-07-12-19-08.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Addressing remaining TS 2.4.1 errors.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx b/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx
index f42f4b07d4fcb..7490bc2573fc4 100644
--- a/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx
+++ b/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx
@@ -9,6 +9,7 @@ import { StoreSet } from './StoreSet';
 let _changedComponents: ConnectedHost[];
 
 export interface IConnectedHostProps {
+  componentRef?: () => void;
   componentProps: any;
   storesToSubscribe: IStoreKey<any>[];
   component: any;
diff --git a/packages/office-ui-fabric-react/src/common/StoreHost.tsx b/packages/office-ui-fabric-react/src/common/StoreHost.tsx
index 89c6993788d36..ccb009a7be128 100644
--- a/packages/office-ui-fabric-react/src/common/StoreHost.tsx
+++ b/packages/office-ui-fabric-react/src/common/StoreHost.tsx
@@ -4,6 +4,7 @@ import { StoreSet } from './StoreSet';
 import { BaseComponent } from '../Utilities';
 
 export interface IStoreHostProps extends React.Props<StoreHost> {
+  componentRef?: () => void;
   stores?: StoreSet;
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.Props.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.Props.ts
index e1e7875fa0818..32f17fd885008 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.Props.ts
@@ -20,6 +20,11 @@ export interface IActivityItemProps extends React.HTMLAttributes<HTMLElement> {
    */
   commentText?: string;
 
+  /**
+   * Gets ref to component interface.
+   */
+  componentRef?: () => void;
+
   /**
    * Indicated if the compact styling should be used.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 580c085362e5e..e4b7922fbf31c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -189,7 +189,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       tag,
       buttonProps,
       React.createElement(
-        'div',
+        'div' as any,
         { className: this._classNames.flexContainer },
         onRenderIcon(props, this._onRenderIcon),
         onRenderText(props, this._onRenderText),
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index 7d08de397505b..be54d5c6e9a8b 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -37,7 +37,8 @@ export interface IDayInfo {
   onSelected: () => void;
 }
 
-export interface ICalendarDayProps {
+export interface ICalendarDayProps extends React.Props<CalendarDay> {
+  componentRef?: () => void;
   strings: ICalendarStrings;
   selectedDate: Date;
   navigatedDate: Date;
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
index e49ee4e2bf67d..417df1cf8ce5d 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
@@ -12,7 +12,8 @@ import { Icon } from '../../Icon';
 import * as stylesImport from './Calendar.scss';
 const styles: any = stylesImport;
 
-export interface ICalendarMonthProps {
+export interface ICalendarMonthProps extends React.Props<CalendarMonth> {
+  componentRef?: () => void;
   navigatedDate: Date;
   strings: ICalendarStrings;
   onNavigateDate: (date: Date, focusOnNavigatedDay: boolean) => void;
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.tsx b/packages/office-ui-fabric-react/src/components/Check/Check.tsx
index 26172924a8efa..921e20bc707f7 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.tsx
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.tsx
@@ -5,6 +5,11 @@ import * as stylesImport from './Check.scss';
 const styles: any = stylesImport;
 
 export interface ICheckProps extends React.Props<Check> {
+  /**
+   * Gets the component ref.
+   */
+  componentRef?: () => void;
+
   /**
    * Whether or not this menu item is currently checked.
    * @defaultvalue false
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts
index 3d60d34afa732..d3368bc4f42c3 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts
@@ -1,4 +1,9 @@
 export interface IColorPickerProps {
+  /**
+   * Gets the component ref.
+   */
+  componentRef?: () => void;
+
   /**
    * The CSS-compatible string to describe the color
    */
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx
index 2758179179a3e..debafb5d49b64 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx
@@ -16,6 +16,7 @@ import * as stylesImport from './ColorPicker.scss';
 const styles: any = stylesImport;
 
 export interface IColorRectangleProps {
+  componentRef?: () => void;
   color: IColor;
   minSize?: number;
 
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
index 60a68a061bb0a..15e4b09961130 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
@@ -8,6 +8,7 @@ import * as stylesImport from './ColorPicker.scss';
 const styles: any = stylesImport;
 
 export interface IColorSliderProps {
+  componentRef?: () => void;
   minValue?: number;
   maxValue?: number;
   value?: number;
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 03b0d14a9dd03..56f1ae8c9f02c 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -264,7 +264,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         </div>
 
         { isOpen && (
-          onRenderContainer({ ...this.props }, this._onRenderContainer)
+          onRenderContainer({ ...this.props as any }, this._onRenderContainer)
         ) }
         {
           errorMessage &&
@@ -735,7 +735,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         linkType={ CalloutLinkType.attached }
       >
         <div ref={ this._resolveRef('_comboBoxMenu') } style={ { width: this._comboBoxWrapper.clientWidth - 2 } }>
-          { onRenderList({ ...props }, this._onRenderList) }
+          { onRenderList({ ...props as any }, this._onRenderList) }
         </div>
       </Callout>
     );
@@ -1030,7 +1030,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         }
 
         // Allow TAB to propigate
-        if (ev.which === KeyCodes.tab) {
+        if (ev.which as number === KeyCodes.tab) {
           return;
         }
         break;
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
index f76804a637ee6..9cf13667d6d5c 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
@@ -7,6 +7,7 @@ const styles: any = stylesImport;
 const INNER_PADDING = 16; // Account for padding around the cell.
 
 export interface IDetailsRowFieldsProps {
+  componentRef?: () => void;
   item: any;
   itemIndex: number;
   columnStartIndex: number;
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.Props.ts b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.Props.ts
index 65c633ccc28ee..1c2f96797eaa5 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.Props.ts
@@ -1,18 +1,19 @@
 import * as React from 'react';
 import { DialogContent } from './DialogContent';
 import { IButtonProps } from '../Button/Button.Props';
+import { ResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
 
 export interface IDialogContent {
 
 }
 
 export interface IDialogContentProps extends React.Props<DialogContent> {
-   /**
-   * Optional callback to access the IDialogContent interface. Use this instead of ref for accessing
-   * the public methods and properties of the component.
-   */
+  /**
+  * Optional callback to access the IDialogContent interface. Use this instead of ref for accessing
+  * the public methods and properties of the component.
+  */
   componentRef?: (component: IDialogContent) => void;
-  
+
   /**
   * Show an 'x' close button in the upper-right corner
   */
@@ -43,6 +44,11 @@ export interface IDialogContentProps extends React.Props<DialogContent> {
   */
   title?: string;
 
+  /**
+   * Responsive mode passed in from decorator.
+   */
+  responsiveMode?: ResponsiveMode;
+
   /**
    * Label to be passed to to aria-label of close button
    * @default Close
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.Props.ts b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.Props.ts
index 3406e3559ca71..e7b8fa3a54d7f 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.Props.ts
@@ -64,6 +64,11 @@ export enum DocumentCardType {
 }
 
 export interface IDocumentCardPreviewProps extends React.Props<DocumentCardPreview> {
+  /**
+   * Gets the component ref.
+   */
+  componentRef?: () => void;
+
   /**
    * One or more preview images to display.
    */
@@ -77,6 +82,11 @@ export interface IDocumentCardPreviewProps extends React.Props<DocumentCardPrevi
 }
 
 export interface IDocumentCardPreviewImage {
+  /**
+   * Gets the component ref.
+   */
+  componentRef?: () => void;
+
   /**
    * File name for the document this preview represents.
    */
@@ -129,6 +139,11 @@ export interface IDocumentCardPreviewImage {
 }
 
 export interface IDocumentCardTitleProps extends React.Props<DocumentCardTitle> {
+  /**
+   * Gets the component ref.
+   */
+  componentRef?: () => void;
+
   /**
    * Title text. If the card represents more than one document, this should be the title of one document and a "+X" string. For example, a collection of four documents would have a string of "Document.docx +3".
    */
@@ -142,6 +157,11 @@ export interface IDocumentCardTitleProps extends React.Props<DocumentCardTitle>
 }
 
 export interface IDocumentCardLocationProps extends React.Props<DocumentCardLocation> {
+  /**
+   * Gets the component ref.
+   */
+  componentRef?: () => void;
+
   /**
    * Text for the location of the document.
    */
@@ -164,6 +184,11 @@ export interface IDocumentCardLocationProps extends React.Props<DocumentCardLoca
 }
 
 export interface IDocumentCardActivityProps extends React.Props<DocumentCardActivity> {
+  /**
+   * Gets the component ref.
+   */
+  componentRef?: () => void;
+
   /**
    * Describes the activity that has taken place, such as "Created Feb 23, 2016".
    */
@@ -199,6 +224,11 @@ export interface IDocumentCardActivityPerson {
 }
 
 export interface IDocumentCardActionsProps extends React.Props<DocumentCardActions> {
+  /**
+   * Gets the component ref.
+   */
+  componentRef?: () => void;
+
   /**
    * The actions available for this document.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
index 2f62833c2eec0..11c2d20410deb 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
@@ -1,15 +1,15 @@
 import { IRenderFunction } from '../../Utilities';
-import { Dropdown } from './Dropdown';
 import { ISelectableOption } from '../../utilities/selectableOption/SelectableOption.Props';
 import { ISelectableDroppableTextProps } from '../../utilities/selectableOption/SelectableDroppableText.Props';
+import { ResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
 
 export { SelectableOptionMenuItemType as DropdownMenuItemType } from '../../utilities/selectableOption/SelectableOption.Props';
 
 export interface IDropdown {
-
+  focus: () => void;
 }
 
-export interface IDropdownProps extends ISelectableDroppableTextProps<Dropdown> {
+export interface IDropdownProps extends ISelectableDroppableTextProps<IDropdown> {
   /**
    * Input placeholder text. Displayed until option is selected.
    */
@@ -30,6 +30,8 @@ export interface IDropdownProps extends ISelectableDroppableTextProps<Dropdown>
    */
   onRenderTitle?: IRenderFunction<IDropdownOption>;
 
+  responsiveMode?: ResponsiveMode;
+
   /**
    * Deprecated at v0.52.0, use 'disabled' instead.
    * @deprecated
diff --git a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
index 18a64d757afb7..c18992650456c 100644
--- a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
+++ b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
@@ -25,6 +25,7 @@ const DIRECTIONAL_KEY_CODES = [
 ];
 
 export interface IFabricProps extends React.HTMLAttributes<HTMLDivElement> {
+  componentRef?: () => void;
   theme?: ITheme;
 }
 export interface IFabricState {
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts
index b47b95abfec34..5d1b137bbc5b1 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts
@@ -41,7 +41,7 @@ export interface IGroupedListProps extends React.Props<GroupedList> {
    * Optional callback to access the IGroupedList interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IGroupedList) => void;
+  componentRef?: (component?: IGroupedList) => void;
 
   /** Optional class name to add to the root element. */
   className?: string;
@@ -158,6 +158,7 @@ export interface IGroup {
 }
 
 export interface IGroupRenderProps {
+
   /** Boolean indicating if all groups are in collapsed state. */
   isAllGroupsCollapsed?: boolean;
 
@@ -191,6 +192,9 @@ export interface IGroupRenderProps {
 }
 
 export interface IGroupDividerProps {
+
+  componentRef?: () => void;
+
   /** Callback to determine if a group has missing items and needs to load them from the server. */
   isGroupLoading?: (group: IGroup) => boolean;
 
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
index 234b2a2af3c16..a5fcfddd1ce6c 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
@@ -38,6 +38,11 @@ import * as stylesImport from './GroupedList.scss';
 const styles: any = stylesImport;
 
 export interface IGroupedListSectionProps extends React.Props<GroupedListSection> {
+  /**
+   * Gets the component ref.
+   */
+  componentRef?: () => void;
+
   /** Map of callback functions related to drag and drop functionality. */
   dragDropEvents?: IDragDropEvents;
 
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.Props.ts b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.Props.ts
index 37f02d13e09e9..d039efdfb5234 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.Props.ts
@@ -3,7 +3,13 @@ import { OverflowSet } from './OverflowSet';
 import { IRenderFunction } from '../../Utilities';
 import { IObjectWithKey } from '../../Selection';
 
+export interface IOverflowSet { }
+
 export interface IOverflowSetProps extends React.Props<OverflowSet> {
+  /**
+   * Gets the component ref.
+   */
+  componentRef?: (ref?: IOverflowSet) => void;
 
   /**
    * An array of items to be rendered by your onRenderItem function in the primary content area
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
index 3c2c38c530b86..cc1080d897741 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
@@ -4,13 +4,13 @@ import {
   autobind,
   BaseComponent
 } from '../../Utilities';
-import { IOverflowSetProps } from './OverflowSet.Props';
+import { IOverflowSet, IOverflowSetProps } from './OverflowSet.Props';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 
 import * as stylesImport from './OverflowSet.scss';
 const styles: any = stylesImport;
 
-export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> {
+export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> implements IOverflowSet {
 
   public render() {
     let {
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/PivotItem.Props.ts b/packages/office-ui-fabric-react/src/components/Pivot/PivotItem.Props.ts
index d6af8306cbe72..616ca5f694a8f 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/PivotItem.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Pivot/PivotItem.Props.ts
@@ -2,6 +2,11 @@ import * as React from 'react';
 import { IRenderFunction } from '../../Utilities';
 
 export interface IPivotItemProps extends React.HTMLAttributes<HTMLDivElement> {
+  /**
+   * Gets the component ref.
+   */
+  componentRef?: () => void;
+
   /**
    * The text displayed of each pivot link.
    */
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
index 25cb160d78de9..8cbe995c0ed61 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
@@ -32,7 +32,7 @@ function generateData(count: number, cachingEnabled: boolean, checked: boolean):
     dataItems.push(item);
   }
 
-  let result = {
+  let result: IOverflowData = {
     primary: dataItems,
     overflow: [] as any[]
   };
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts
index ac8a3233a54d5..00d25d503c782 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts
@@ -1,8 +1,26 @@
 import { Position } from '../../utilities/positioning';
 import { IIconProps } from '../../Icon';
 
+export interface ISpinButton {
+  /**
+   * The value of the SpinButton. Use this if you intend to pass in a new value as a result of onChange events.
+   * This value is mutually exclusive to defaultValue. Use one or the other.
+   */
+  value?: string;
+
+  /**
+   * Sets focus to the spin button.
+   */
+  focus: () => void;
+}
+
 export interface ISpinButtonProps {
 
+  /**
+   * Gets the component ref.
+   */
+  componentRef?: (component?: ISpinButton) => void;
+
   /**
    * The initial value of the SpinButton. Use this if you intend for the SpinButton to be an uncontrolled component.
    * This value is mutually exclusive to value. Use one or the other.
@@ -97,11 +115,3 @@ export interface ISpinButtonProps {
    */
   decrementButtonIcon?: IIconProps;
 }
-
-export interface ISpinButton {
-  /**
-   * The value of the SpinButton. Use this if you intend to pass in a new value as a result of onChange events.
-   * This value is mutually exclusive to defaultValue. Use one or the other.
-   */
-  value?: string;
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index 10626ab666ffd..2ba55b61be8fd 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -63,7 +63,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
   private _initialStepDelay = 400;
   private _stepDelay = 75;
   private _formattedValidUnitOptions: string[] = [];
-  private _arrowButtonStyle: React.CSSProperties = {
+  private _arrowButtonStyle = {
     icon: {
       fontSize: '6px',
     }
@@ -225,6 +225,13 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
     this._input.select();
   }
 
+  /**
+   * Gets the value of the spin button.
+   */
+  public get value(): string {
+    return this.props.value === undefined ? this.state.value : this.props.value;
+  }
+
   /**
    * Validate function to use if one is not passed in
    */
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts
index b271f870e00b9..52ec51088b3a9 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts
@@ -1,6 +1,12 @@
 import { IButtonProps } from '../../Button';
 
+export interface ISwatchColorPicker { }
+
 export interface ISwatchColorPickerProps {
+  /**
+   * Gets the component ref.
+   */
+  componentRef?: (componentRef?: ISwatchColorPicker) => void;
 
   /**
    * the number of columns for the swatch color picker
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
index 151e21ae1979b..706d489a1e1ce 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
@@ -7,6 +7,7 @@ import {
   getId
 } from '../../Utilities';
 import {
+  ISwatchColorPicker,
   ISwatchColorPickerProps,
   ISwatchColorPickerItemProps,
   SwatchColorPickerItemType
@@ -180,7 +181,7 @@ export interface ISwatchColorPickerState {
   expanded?: boolean;
 }
 
-export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, ISwatchColorPickerState> {
+export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, ISwatchColorPickerState> implements ISwatchColorPicker {
 
   public static defaultProps = {
     cellShape: 'circle',
@@ -745,6 +746,7 @@ class SwatchColorPickerMenuButton extends BaseComponent<IMenuButtonProps, {}> {
 }
 
 interface ISwatchColorPickerBodyProps {
+  componentRef?: () => void;
   swatchColorPickerItems: ISwatchColorPickerItemProps[];
   columnCount: number;
   onRenderItems: (items: ISwatchColorPickerItemProps[]) => JSX.Element[];
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts
index c214933ae77a5..017db4af63e93 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts
@@ -41,6 +41,11 @@ export interface IBaseAutoFill {
 }
 
 export interface IBaseAutoFillProps extends React.HTMLAttributes<HTMLInputElement | BaseAutoFill> {
+  /**
+   * Gets the compoonent ref.
+   */
+  componentRef?: (componentRef?: IBaseAutoFill) => void;
+
   /**
    * The suggested autofill value that will display.
    */
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
index 693088670e7ea..905efca683094 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
@@ -7,6 +7,8 @@ import { IRenderFunction } from '../../Utilities';
 // and searched for by the people picker. For example, if the picker is
 // displaying persona's than type T could either be of Persona or Ipersona props
 export interface IBasePickerProps<T> extends React.Props<any> {
+  componentRef?: () => void;
+
   /**
    * Function that specifies how the selected item will appear.
    */
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PickerItem.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/PickerItem.Props.ts
index c87fa68f3f88c..5910583e5afe6 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PickerItem.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/PickerItem.Props.ts
@@ -1,5 +1,6 @@
 import * as React from 'react';
 export interface IPickerItemProps<T> extends React.HTMLAttributes<HTMLElement> {
+  componentRef?: () => void;
   item: T;
   index: number;
   selected?: boolean;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts
index d019d72fc038c..6ddfe094f7bf2 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts
@@ -4,6 +4,11 @@ import { IRenderFunction } from '../../../Utilities';
 import { IPersonaProps } from '../../Persona/Persona.Props';
 
 export interface ISuggestionsProps<T> extends React.Props<any> {
+  /**
+   * Gets the component ref.
+   */
+  componentRef?: () => void;
+
   /**
    * How the suggestion should look in the suggestion list.
    */
@@ -104,6 +109,7 @@ export interface ISuggestionsProps<T> extends React.Props<any> {
 }
 
 export interface ISuggestionItemProps<T> {
+  componentRef?: () => void;
   suggestionModel: ISuggestionModel<T>;
   RenderSuggestion: (item: T, suggestionItemProps?: ISuggestionItemProps<T>) => JSX.Element;
   onClick: (ev: React.MouseEvent<HTMLButtonElement>) => void;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
index 89e43087f45a6..36684da471eb7 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
@@ -27,7 +27,7 @@ import {
 } from 'office-ui-fabric-react/lib/Pickers';
 import './Picker.CustomResult.Example.scss';
 import { TestImages } from '../../../common/TestImages';
-import {IButtonProps} from 'office-ui-fabric-react/lib/Button';
+import { IButtonProps } from 'office-ui-fabric-react/lib/Button';
 
 export interface IPeoplePickerExampleState {
   contextualMenuVisible?: boolean;
@@ -325,7 +325,7 @@ export class PickerCustomResultExample extends React.Component<any, IPeoplePicke
       <div>
         <Checkbox label='Disable Document Picker' checked={ this.state.isPickerDisabled } onChange={ this._onDisabledButtonClick.bind(this) } />
         <DocumentPicker
-          onRenderSuggestionsItem={ SuggestedBigItem }
+          onRenderSuggestionsItem={ SuggestedBigItem as any }
           onResolveSuggestions={ this._onFilterChanged }
           onRenderItem={ SelectedDocumentItem }
           getTextFromItem={ (props: any) => props.documentTitleProps.title }
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.Props.ts b/packages/office-ui-fabric-react/src/utilities/grid/Grid.Props.ts
index e1cd90834ce33..f222e96698945 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.Props.ts
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.Props.ts
@@ -1,4 +1,8 @@
 export interface IGridProps {
+  /**
+   * Gets the component ref.
+   */
+  componentRef?: () => void;
 
   /**
    * The items to turn into a grid
diff --git a/packages/office-ui-fabric-react/src/utilities/router/Router.tsx b/packages/office-ui-fabric-react/src/utilities/router/Router.tsx
index 5b57987470a15..8b8f683d7576a 100644
--- a/packages/office-ui-fabric-react/src/utilities/router/Router.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/router/Router.tsx
@@ -2,6 +2,11 @@ import * as React from 'react';
 import { BaseComponent } from '../../Utilities';
 
 export interface IRouterProps {
+  /**
+   * Gets the component ref.
+   */
+  componentRef?: () => void;
+
   replaceState?: boolean;
   children?: React.ReactElement<any>[];
   onNewRouteLoaded?: () => void;
@@ -31,7 +36,7 @@ export class Router extends BaseComponent<IRouterProps, {}> {
     return path;
   }
 
-  private _resolveRoute(path?: string, children?: React.ReactNode): React.DOMElement<{ key: any }, Element> | null {
+  private _resolveRoute(path?: string, children?: React.ReactNode): React.DOMElement<any, Element> | null {
     path = path || this._getPath();
     children = children || this.props.children;
 
@@ -65,9 +70,9 @@ export class Router extends BaseComponent<IRouterProps, {}> {
           let componentChildren = this._resolveRoute(path, route.props.children || []);
 
           if (componentChildren) {
-            return React.createElement(component, { key: route.key }, componentChildren);
+            return React.createElement(component, { key: route.key }, componentChildren) as React.DOMElement<any, any>;
           } else {
-            return React.createElement(component, { key: route.key });
+            return React.createElement(component, { key: route.key }) as React.DOMElement<any, any>;
           }
         } else if (getComponent) {
           // We are asynchronously fetching this component.

From 253b23f0aa42bcc62ad8f861953c3bc0f0343c81 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Wed, 12 Jul 2017 14:12:14 -0700
Subject: [PATCH 0249/1641] Fix crash in highlight component (#2196)

* Use hljs from the import

* Rush change
---
 .../fix-highlight_2017-07-12-20-44.json               | 11 +++++++++++
 .../src/components/Highlight/Highlight.tsx            |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/fix-highlight_2017-07-12-20-44.json

diff --git a/common/changes/@uifabric/example-app-base/fix-highlight_2017-07-12-20-44.json b/common/changes/@uifabric/example-app-base/fix-highlight_2017-07-12-20-44.json
new file mode 100644
index 0000000000000..de352bae7dd2c
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/fix-highlight_2017-07-12-20-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Highlight: Use correct import for highlightBlock",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/src/components/Highlight/Highlight.tsx b/packages/example-app-base/src/components/Highlight/Highlight.tsx
index 5b10e5ed68d25..ad183cccb2d4e 100644
--- a/packages/example-app-base/src/components/Highlight/Highlight.tsx
+++ b/packages/example-app-base/src/components/Highlight/Highlight.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { registerLanguage } from 'highlight.js';
+import { registerLanguage, highlightBlock } from 'highlight.js';
 import * as javascript from 'highlight.js/lib/languages/javascript';
 import { BaseComponent } from 'office-ui-fabric-react/lib/Utilities';
 
@@ -30,6 +30,6 @@ export class Highlight extends BaseComponent<IHighlightProps, {}> {
   }
 
   public componentDidMount() {
-    hljs.highlightBlock(this._codeElement);
+    highlightBlock(this._codeElement);
   }
 }

From f6dbb240e3b716c9c1cc3f649fed403d1552c2b9 Mon Sep 17 00:00:00 2001
From: aadhars <adhargithub@gmail.com>
Date: Thu, 13 Jul 2017 03:08:51 +0530
Subject: [PATCH 0250/1641] [ChoiceGroup] Fixing null reference exception
 caused by imageSize (#2172)

* Fixinng null reference exception caused when imageSzie is not specified

* change files
---
 ...s-adsurang-dropdownscrollfix_2017-07-10-18-18.json | 11 +++++++++++
 ...s-adsurang-dropdownscrollfix_2017-07-10-18-18.json | 11 +++++++++++
 ...s-adsurang-dropdownscrollfix_2017-07-10-18-18.json | 11 +++++++++++
 ...s-adsurang-dropdownscrollfix_2017-07-10-18-18.json | 11 +++++++++++
 .../src/components/ChoiceGroup/ChoiceGroup.tsx        |  8 ++++----
 5 files changed, 48 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
 create mode 100644 common/changes/@uifabric/fabric-website/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
 create mode 100644 common/changes/@uifabric/styling/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
 create mode 100644 common/changes/office-ui-fabric-react/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json

diff --git a/common/changes/@uifabric/example-app-base/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json b/common/changes/@uifabric/example-app-base/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
new file mode 100644
index 0000000000000..7d80e8e887db5
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "adsurang@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json b/common/changes/@uifabric/fabric-website/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
new file mode 100644
index 0000000000000..f3ff20e3759a2
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "adsurang@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json b/common/changes/@uifabric/styling/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
new file mode 100644
index 0000000000000..862f25c73e009
--- /dev/null
+++ b/common/changes/@uifabric/styling/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "adsurang@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json b/common/changes/office-ui-fabric-react/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
new file mode 100644
index 0000000000000..4e1f46bf09145
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixing null reference exception caused if user does not specify imageSize along with imageSrc in choiceGroup",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "adsurang@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
index d49580854b713..85341dde30d90 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
@@ -168,8 +168,8 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
               >
                 <Image
                   src={ option.imageSrc }
-                  width={ option.imageSize.width }
-                  height={ option.imageSize.height }
+                  width={ option.imageSize ? option.imageSize.width : null }
+                  height={ option.imageSize ? option.imageSize.height : null }
                 />
               </div>
               <div className={ css(
@@ -181,8 +181,8 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
               >
                 <Image
                   src={ option.selectedImageSrc }
-                  width={ option.imageSize.width }
-                  height={ option.imageSize.height }
+                  width={ option.imageSize ? option.imageSize.width : null }
+                  height={ option.imageSize ? option.imageSize.height : null }
                 />
               </div>
             </div>

From 677439867bfa02aa45d0f05ee2054bbcab797378 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 12 Jul 2017 16:28:12 -0700
Subject: [PATCH 0251/1641] Tooltip on render fix (#2192)

* TooltipHost: Fixed check which kept onRenderContent from working

* Change file
---
 ...tooltip-onRender-fix_2017-07-12-16-53.json | 11 ++++++++
 .../src/components/Tooltip/TooltipHost.tsx    | 27 +++++++++----------
 2 files changed, 24 insertions(+), 14 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/tooltip-onRender-fix_2017-07-12-16-53.json

diff --git a/common/changes/office-ui-fabric-react/tooltip-onRender-fix_2017-07-12-16-53.json b/common/changes/office-ui-fabric-react/tooltip-onRender-fix_2017-07-12-16-53.json
new file mode 100644
index 0000000000000..7c39d9b6aba51
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/tooltip-onRender-fix_2017-07-12-16-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "TooltipHost: Fixed check which kept onRenderContent from working",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
index c15a6b9bafa99..6d5054b7580f3 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
@@ -65,20 +65,19 @@ export class TooltipHost extends BaseComponent<ITooltipHostProps, ITooltipHostSt
         aria-describedby={ setAriaDescribedBy && isTooltipVisible && content ? tooltipId : undefined }
       >
         { children }
-        { isTooltipVisible &&
-          content ? (
-            <Tooltip
-              { ...tooltipProps }
-              id={ tooltipId }
-              delay={ delay }
-              content={ content }
-              targetElement={ this._getTargetElement() }
-              directionalHint={ directionalHint }
-              calloutProps={ assign(calloutProps, { onDismiss: this._onTooltipCallOutDismiss }) }
-              { ...getNativeProps(this.props, divProperties) }
-            >
-            </Tooltip>
-          ) : undefined }
+        { isTooltipVisible && (
+          <Tooltip
+            id={ tooltipId }
+            delay={ delay }
+            content={ content }
+            targetElement={ this._getTargetElement() }
+            directionalHint={ directionalHint }
+            calloutProps={ assign(calloutProps, { onDismiss: this._onTooltipCallOutDismiss }) }
+            { ...getNativeProps(this.props, divProperties) }
+            { ...tooltipProps }
+          >
+          </Tooltip>
+        ) }
       </div>
     );
   }

From 8e840fc5f1285df4a52d24cf37cbf43a9956a4d0 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 12 Jul 2017 17:06:22 -0700
Subject: [PATCH 0252/1641] Adding --production to rush build, until we can fix
 gcb-karma.

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 54f8b3b87e056..66cf8d895b0bb 100644
--- a/package.json
+++ b/package.json
@@ -9,7 +9,7 @@
   },
   "scripts": {
     "_rushInstall": "node node_modules/@microsoft/rush/bin/rush install -c",
-    "_rushBuild": "node node_modules/@microsoft/rush/bin/rush build --verbose",
+    "_rushBuild": "node node_modules/@microsoft/rush/bin/rush build --verbose --production",
     "_rushBuildToFabric": "node node_modules/@microsoft/rush/bin/rush build --to office-ui-fabric-react",
     "_rushRebuild": "node node_modules/@microsoft/rush/bin/rush rebuild --production --verbose",
     "_rushRebuildFast": "node node_modules/@microsoft/rush/bin/rush rebuild --verbose",

From 7e875273917cf6e8366e09edd69d7f2f38c43638 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 12 Jul 2017 19:32:09 -0700
Subject: [PATCH 0253/1641] Revert "Add variant of Callout with no shadow on
 one edge (#2174)" (#2201)

This reverts commit 16c3d9e638778fbda2e9c3d4c94fa7551fe4a67d.
---
 ...mmandBar-menu-shadow_2017-07-10-23-32.json | 11 -----
 ...mmandBar-menu-shadow_2017-07-10-23-32.json | 11 -----
 ...mmandBar-menu-shadow_2017-07-10-23-32.json | 11 -----
 ...mmandBar-menu-shadow_2017-07-10-23-32.json | 11 -----
 ...mmandBar-menu-shadow_2017-07-10-23-32.json | 11 -----
 .../src/components/Button/BaseButton.tsx      |  2 -
 .../src/components/Callout/Callout.Props.ts   | 12 ++----
 .../src/components/Callout/Callout.scss       | 14 +------
 .../src/components/Callout/CalloutContent.tsx | 32 +++------------
 .../examples/Callout.Cover.Example.tsx        |  4 +-
 .../examples/Callout.Directional.Example.tsx  | 40 +++++--------------
 .../src/components/Callout/index.ts           |  1 -
 .../src/components/ComboBox/ComboBox.tsx      |  3 +-
 .../src/components/CommandBar/CommandBar.tsx  |  2 -
 .../src/components/Dropdown/Dropdown.scss     |  2 +
 .../src/components/Dropdown/Dropdown.tsx      |  3 +-
 .../SwatchColorPicker/SwatchColorPicker.tsx   |  3 +-
 .../src/utilities/positioning.ts              | 39 ++++--------------
 18 files changed, 35 insertions(+), 177 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
 delete mode 100644 common/changes/@uifabric/fabric-website/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
 delete mode 100644 common/changes/@uifabric/styling/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
 delete mode 100644 common/changes/@uifabric/utilities/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
 delete mode 100644 common/changes/office-ui-fabric-react/anihan-commandBar-menu-shadow_2017-07-10-23-32.json

diff --git a/common/changes/@uifabric/example-app-base/anihan-commandBar-menu-shadow_2017-07-10-23-32.json b/common/changes/@uifabric/example-app-base/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
deleted file mode 100644
index fa53882beab0f..0000000000000
--- a/common/changes/@uifabric/example-app-base/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "anihan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/anihan-commandBar-menu-shadow_2017-07-10-23-32.json b/common/changes/@uifabric/fabric-website/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
deleted file mode 100644
index a7a946702dea0..0000000000000
--- a/common/changes/@uifabric/fabric-website/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "anihan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/anihan-commandBar-menu-shadow_2017-07-10-23-32.json b/common/changes/@uifabric/styling/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
deleted file mode 100644
index a97fc36c90b66..0000000000000
--- a/common/changes/@uifabric/styling/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "anihan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/anihan-commandBar-menu-shadow_2017-07-10-23-32.json b/common/changes/@uifabric/utilities/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
deleted file mode 100644
index faf4dbcc11174..0000000000000
--- a/common/changes/@uifabric/utilities/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "anihan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/anihan-commandBar-menu-shadow_2017-07-10-23-32.json b/common/changes/office-ui-fabric-react/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
deleted file mode 100644
index a5455ad0d3b18..0000000000000
--- a/common/changes/office-ui-fabric-react/anihan-commandBar-menu-shadow_2017-07-10-23-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add variant of Callout with no shadow on one edge",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "anihan@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index e4b7922fbf31c..470a0a6ec1399 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -14,7 +14,6 @@ import {
 import { Icon, IIconProps } from '../../Icon';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { ContextualMenu, IContextualMenuProps } from '../../ContextualMenu';
-import { CalloutLinkType } from '../../Callout';
 import { IButtonProps, IButton } from './Button.Props';
 import { IconButton } from './IconButton/IconButton';
 import { IButtonClassNames, getClassNames } from './BaseButton.classNames';
@@ -334,7 +333,6 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         target={ this._buttonElement }
         labelElementId={ this._labelId }
         onDismiss={ this._onToggleMenu }
-        calloutProps={ { linkType: CalloutLinkType.attached } }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts b/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
index 107c4a3a07919..8d4c841174ac5 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
@@ -6,7 +6,6 @@ import {
   IPoint,
   IRectangle
 } from '../../Utilities';
-import { CalloutLinkType } from '../../utilities/positioning';
 
 export interface ICallout {
 
@@ -73,9 +72,10 @@ export interface ICalloutProps extends React.Props<Callout | CalloutContent> {
   targetPoint?: IPoint;
 
   /**
-   * To specify the link type between the callout and target. Such as a Beak, etc.
+   * If true then the beak is visible. If false it will not be shown.
+   * @default true
    */
-  linkType?: CalloutLinkType;
+  isBeakVisible?: boolean;
 
   /**
    * If true then the onClose will not not dismiss on scroll
@@ -158,12 +158,6 @@ export interface ICalloutProps extends React.Props<Callout | CalloutContent> {
    */
   setInitialFocus?: boolean;
 
-  /**
-   * Deprecated. If true then the beak is visible. If false it will not be shown. Use linkType instead.
-   * @deprecated @default true
-   */
-  isBeakVisible?: boolean;
-
   /**
     * Deprecated at v0.59.1, to be removed at >= v1.0.0. Pass in a beakWidth to dictate size.
     * @deprecated
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
index 85de5e8ecd68b..937eff9c7a5e0 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
@@ -9,7 +9,6 @@
 
 $Callout-beak-slant-width: 28px;
 $Callout-smallbeak-slant-width: 16px;
-$Callout-shadow-spread-margin: 5px;
 
 @mixin calloutBeak {
   position: absolute;
@@ -23,7 +22,7 @@ $Callout-shadow-spread-margin: 5px;
 }
 
 .root {
-  @include ms-drop-shadow(0,0, #{ $Callout-shadow-spread-margin }, 0px);
+  @include ms-drop-shadow(0,0, 5px, 0px);
   position: absolute;
   border: 1px solid $ms-color-neutralLight;
   box-sizing: border-box;
@@ -34,11 +33,6 @@ $Callout-shadow-spread-margin: 5px;
   @media screen and (-ms-high-contrast: black-on-white) {
     border: 1px solid $ms-color-black;
   }
-  &.rootIsAttached {
-    box-shadow: none;
-    border: none;
-    overflow: hidden;
-  }
 }
 
 .container {
@@ -51,12 +45,6 @@ $Callout-shadow-spread-margin: 5px;
   overflow-x: hidden;
   overflow-y: auto;
   position: relative;
-
-  &.mainIsAttached {
-    margin: $Callout-shadow-spread-margin;
-    @include ms-drop-shadow(0,0, #{ $Callout-shadow-spread-margin }, 0px);
-    border: 1px solid $ms-color-neutralLight;
-  }
 }
 
 .overFlowYHidden {
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index 2365d6be5b385..0142e060f6757 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -14,7 +14,7 @@ import {
   getWindow,
   getDocument
 } from '../../Utilities';
-import { getRelativePositions, IPositionInfo, IPositionProps, getMaxHeight, RectangleEdge, CalloutLinkType } from '../../utilities/positioning';
+import { getRelativePositions, IPositionInfo, IPositionProps, getMaxHeight } from '../../utilities/positioning';
 import { Popup } from '../../Popup';
 import * as stylesImport from './Callout.scss';
 import { AnimationClassNames } from '../../Styling';
@@ -24,7 +24,6 @@ const styles: any = stylesImport;
 const BEAK_ORIGIN_POSITION = { top: 0, left: 0 };
 const OFF_SCREEN_STYLE = { opacity: 0 };
 const BORDER_WIDTH: number = 1;
-const SHADOW_SPREAD_MARGIN: number = 5; // keep in sync with scss variable
 
 export interface ICalloutState {
   positions?: IPositionInfo;
@@ -112,7 +111,6 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       children,
       beakWidth,
       finalHeight,
-      linkType,
       backgroundColor } = this.props;
     let { positions } = this.state;
     let beakStyleWidth = beakWidth;
@@ -131,22 +129,12 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       backgroundColor: backgroundColor,
     };
 
-    let isAttached = linkType === CalloutLinkType.attached;
-
-    let attachedStyle: React.CSSProperties = isAttached && positions && {
-      marginTop: positions.rectangleEdge === RectangleEdge.bottom ? 0 : SHADOW_SPREAD_MARGIN,
-      marginBottom: positions.rectangleEdge === RectangleEdge.top ? 0 : SHADOW_SPREAD_MARGIN,
-      marginLeft: positions.rectangleEdge === RectangleEdge.right ? 0 : SHADOW_SPREAD_MARGIN,
-      marginRight: positions.rectangleEdge === RectangleEdge.left ? 0 : SHADOW_SPREAD_MARGIN
-    };
-
     let directionalClassName = (positions && positions.directionalClassName)
       ? (AnimationClassNames as any)[positions.directionalClassName]
       : '';
 
     let contentMaxHeight: number = this._getMaxHeight() + this.state.heightOffset;
-    // Temporary as isBeakVisible is deprecated.
-    let beakVisible: boolean = (linkType !== undefined ? linkType === CalloutLinkType.beak : isBeakVisible) && (!!targetElement || !!target);
+    let beakVisible: boolean = isBeakVisible && (!!targetElement || !!target);
     let content = (
       <div
         ref={ this._resolveRef('_hostElement') }
@@ -157,7 +145,6 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
             css(
               'ms-Callout',
               styles.root,
-              isAttached && styles.rootIsAttached,
               className,
               directionalClassName
             ) }
@@ -178,12 +165,12 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
             ariaLabel={ ariaLabel }
             ariaDescribedBy={ ariaDescribedBy }
             ariaLabelledBy={ ariaLabelledBy }
-            className={ css('ms-Callout-main', styles.main, isAttached && styles.mainIsAttached, {
+            className={ css('ms-Callout-main', styles.main, {
               [styles.overFlowYHidden]: finalHeight
             }) }
             onDismiss={ this.dismiss }
             shouldRestoreFocus={ true }
-            style={ Object.assign({ maxHeight: contentMaxHeight, backgroundColor: backgroundColor }, attachedStyle) }>
+            style={ { maxHeight: contentMaxHeight, backgroundColor: backgroundColor } }>
             { children }
           </Popup>
         </div>
@@ -268,13 +255,6 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
         currentProps.target = this._target;
       }
       let newPositions: IPositionInfo = getRelativePositions(currentProps, hostElement, calloutElement);
-      if (this.props.linkType === CalloutLinkType.attached) {
-        if (newPositions.rectangleEdge === RectangleEdge.left) {
-          newPositions.calloutPosition.left += SHADOW_SPREAD_MARGIN;
-        } else {
-          newPositions.calloutPosition.left -= SHADOW_SPREAD_MARGIN;
-        }
-      }
 
       // Set the new position only when the positions are not exists or one of the new callout positions are different.
       // The position should not change if the position is within 2 decimal places.
@@ -318,9 +298,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
   private _getMaxHeight(): number {
     if (!this._maxHeight) {
       if (this.props.directionalHintFixed && this._target) {
-        let beakWidth = (this.props.linkType !== undefined ? this.props.linkType === CalloutLinkType.beak : this.props.isBeakVisible)
-          ? this.props.beakWidth
-          : 0;
+        let beakWidth = this.props.isBeakVisible ? this.props.beakWidth : 0;
         let gapSpace = this.props.gapSpace ? this.props.gapSpace : 0;
         this._maxHeight = getMaxHeight(this._target, this.props.directionalHint, beakWidth + gapSpace, this._getBounds());
       } else {
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
index 19dc0a5e46517..3d427be6c5f16 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import './CalloutExample.scss';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
-import { Callout, DirectionalHint, CalloutLinkType } from 'office-ui-fabric-react/lib/Callout';
+import { Callout, DirectionalHint } from 'office-ui-fabric-react/lib/Callout';
 import { Dropdown, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
 
 export interface ICalloutCoverExampleState {
@@ -67,7 +67,7 @@ export class CalloutCoverExample extends React.Component<any, ICalloutCoverExamp
             targetElement={ this._menuButtonElement }
             directionalHint={ directionalHint }
             coverTarget={ true }
-            linkType={ CalloutLinkType.none }
+            isBeakVisible={ false }
             gapSpace={ 0 }
           >
             <div className='ms-CalloutExample-header'>
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
index 466a8eaf18c25..668b8bf97ab13 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
@@ -1,8 +1,8 @@
 import * as React from 'react';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
-import { Callout, DirectionalHint, CalloutLinkType } from 'office-ui-fabric-react/lib/Callout';
+import { Callout, DirectionalHint } from 'office-ui-fabric-react/lib/Callout';
 import { Dropdown, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
-import { ChoiceGroup, IChoiceGroupOption } from 'office-ui-fabric-react/lib/ChoiceGroup';
+import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { Slider } from 'office-ui-fabric-react/lib/Slider';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import './CalloutExample.scss';
@@ -10,7 +10,7 @@ import './CalloutExample.scss';
 export interface ICalloutDirectionalExampleState {
   isCalloutVisible?: boolean;
   directionalHint?: DirectionalHint;
-  linkType?: CalloutLinkType;
+  isBeakVisible?: boolean;
   gapSpace?: number;
   beakWidth?: number;
 }
@@ -39,43 +39,25 @@ export class CalloutDirectionalExample extends React.Component<any, ICalloutDire
 
     this.state = {
       isCalloutVisible: false,
-      linkType: CalloutLinkType.beak,
+      isBeakVisible: true,
       directionalHint: DirectionalHint.bottomLeftEdge
     };
   }
 
   public render() {
-    let { isCalloutVisible, linkType, directionalHint, gapSpace, beakWidth } = this.state;
+    let { isCalloutVisible, isBeakVisible, directionalHint, gapSpace, beakWidth } = this.state;
     //  ms-Callout-smallbeak is used in this directional example to reflect all the positions. Large beak will disable some position to avoid beak over the callout edge.
     return (
       <div className='ms-CalloutExample'>
         <div className='ms-CalloutExample-configArea'>
-          <ChoiceGroup
-            label='Link type'
-            selectedKey={ linkType.toString() }
-            options={ [
-              {
-                key: CalloutLinkType.none.toString(),
-                text: 'None'
-              },
-              {
-                key: CalloutLinkType.beak.toString(),
-                text: 'Beak'
-              },
-              {
-                key: CalloutLinkType.attached.toString(),
-                text: 'Attached'
-              }
-            ] }
-            onChange={ this._onShowBeakChange }
-          />
+          <Checkbox label='Show beak' checked={ isBeakVisible } onChange={ this._onShowBeakChange } />
           <Slider
             max={ 30 }
             label='Gap Space'
             min={ 0 }
             defaultValue={ 0 }
             onChange={ this._onGapSlider } />
-          { linkType === CalloutLinkType.beak &&
+          { isBeakVisible &&
             (<Slider
               max={ 50 }
               label='Beak Width'
@@ -99,7 +81,7 @@ export class CalloutDirectionalExample extends React.Component<any, ICalloutDire
             className='ms-CalloutExample-callout'
             gapSpace={ gapSpace }
             targetElement={ this._menuButtonElement }
-            linkType={ linkType }
+            isBeakVisible={ isBeakVisible }
             beakWidth={ beakWidth }
             onDismiss={ this._onCalloutDismiss }
             directionalHint={ directionalHint }
@@ -137,10 +119,10 @@ export class CalloutDirectionalExample extends React.Component<any, ICalloutDire
   }
 
   @autobind
-  private _onShowBeakChange(ev: React.FormEvent<HTMLElement>, option: IChoiceGroupOption) {
+  private _onShowBeakChange(ev: React.FormEvent<HTMLElement>, isVisible: boolean) {
     this.setState({
-      linkType: parseInt(option.key, 10),
-      beakWidth: parseInt(option.key, 10) === CalloutLinkType.beak ? 16 : 0
+      isBeakVisible: isVisible,
+      beakWidth: 10
     });
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Callout/index.ts b/packages/office-ui-fabric-react/src/components/Callout/index.ts
index 177c89bc6ab46..0f37e86477559 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/index.ts
@@ -1,4 +1,3 @@
 export * from './Callout';
 export * from './Callout.Props';
 export * from '../../common/DirectionalHint';
-export * from '../../utilities/positioning';
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 56f1ae8c9f02c..51aa4922ba3cd 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { IComboBoxOption, IComboBoxProps } from './ComboBox.Props';
 import { DirectionalHint } from '../../common/DirectionalHint';
-import { Callout, CalloutLinkType } from '../../Callout';
+import { Callout } from '../../Callout';
 import { Label } from '../../Label';
 import {
   CommandButton,
@@ -732,7 +732,6 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         targetElement={ this._comboBoxWrapper }
         onDismiss={ this._onDismiss }
         setInitialFocus={ false }
-        linkType={ CalloutLinkType.attached }
       >
         <div ref={ this._resolveRef('_comboBoxMenu') } style={ { width: this._comboBoxWrapper.clientWidth - 2 } }>
           { onRenderList({ ...props as any }, this._onRenderList) }
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 7a45d6d5d7c9c..3cd26b5c51e35 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -12,7 +12,6 @@ import {
 import { ICommandBar, ICommandBarProps } from './CommandBar.Props';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { ContextualMenu, IContextualMenuProps, IContextualMenuItem, hasSubmenuItems } from '../../ContextualMenu';
-import { CalloutLinkType } from '../../Callout';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import {
   Icon,
@@ -148,7 +147,6 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
             targetElement={ contextualMenuTarget }
             labelElementId={ expandedMenuId }
             onDismiss={ this._onContextMenuDismiss }
-            calloutProps={ { linkType: CalloutLinkType.attached } }
           />
           ) : (null)
         }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
index 09085c4740d69..c3ef234a0f696 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
@@ -178,6 +178,8 @@ $DropDown-item-height: 32px;
   }
 
 .callout {
+  box-shadow: 0 0px 5px 0px rgba(0, 0, 0, 0.4);
+  border: 1px solid $ms-color-neutralLight;
 }
 
 .errorMessage{
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 07b567f6b6c9f..5f74b140aaf53 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { IDropdownProps, IDropdownOption, DropdownMenuItemType } from './Dropdown.Props';
 import { DirectionalHint } from '../../common/DirectionalHint';
-import { Callout, CalloutLinkType } from '../../Callout';
+import { Callout } from '../../Callout';
 import { Label } from '../../Label';
 import { CommandButton } from '../../Button';
 import { Panel } from '../../Panel';
@@ -295,7 +295,6 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
           targetElement={ this._dropDown }
           onDismiss={ this._onDismiss }
           onPositioned={ this._onPositioned }
-          linkType={ CalloutLinkType.attached }
         >
           <div style={ { width: this._dropDown.clientWidth - 2 } }>
             { onRenderList(props, this._onRenderList) }
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
index 706d489a1e1ce..49cb9efb58571 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
@@ -16,7 +16,7 @@ import { DirectionalHint } from '../../ContextualMenu';
 import { getColorFromString } from '../../utilities/color/colors';
 import { Grid } from '../../utilities/grid/Grid';
 import { DefaultButton, CommandButton, IButtonProps } from '../../Button';
-import { Callout, CalloutLinkType } from '../../Callout';
+import { Callout } from '../../Callout';
 import { FocusZone } from '../../FocusZone';
 import * as stylesImport from './SwatchColorPicker.scss';
 const styles: any = stylesImport;
@@ -645,7 +645,6 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
         className={ css('ms-swatchColorPickerMenu', styles.swatchColorPickerContainer) }
         targetElement={ this._buttonWrapper }
         onDismiss={ this._onDismiss }
-        linkType={ CalloutLinkType.attached }
         setInitialFocus={ true }>
         <SwatchColorPickerBody
           { ...this.props }
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning.ts b/packages/office-ui-fabric-react/src/utilities/positioning.ts
index 91d2af19edfdd..cd32f7eb7be1a 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning.ts
@@ -3,8 +3,7 @@ import {
   IRectangle,
   assign,
   getScrollbarWidth,
-  Rectangle,
-  IPoint
+  Rectangle
 } from '../Utilities';
 
 export enum RectangleEdge {
@@ -21,23 +20,6 @@ export enum Position {
   end = 3
 }
 
-export enum CalloutLinkType {
-  /**
-   * Default behavior. To show shadows on all sides
-   */
-  none = 0,
-
-  /**
-   * To show a beak between the target and the Callout
-   */
-  beak = 1,
-
-  /**
-   * To remove shadow on one side of the component, so that it appears attached to the target
-   */
-  attached = 2
-}
-
 let SLIDE_ANIMATIONS: { [key: number]: string; } = {
   [RectangleEdge.top]: 'slideUpIn20',
   [RectangleEdge.bottom]: 'slideDownIn20',
@@ -87,16 +69,9 @@ export interface IPositionProps {
    */
   targetPoint?: IPoint;
 
-  /** If true then the beak is visible. If false it will not be shown.
-   * @deprecated
-  */
+  /** If true then the beak is visible. If false it will not be shown. */
   isBeakVisible?: boolean;
 
-  /**
-   * To specify the link type between the callout and target. Such as a Beak, etc.
-   */
-  linkType: CalloutLinkType;
-
   /**
    * If true the position returned will have the menu element cover the target.
    * If false then it will position next to the target;
@@ -115,10 +90,14 @@ export interface IPositionInfo {
   calloutPosition: { top: number, left: number };
   beakPosition: { top: number, left: number, display: string };
   directionalClassName: string;
-  rectangleEdge: RectangleEdge;
   submenuDirection: DirectionalHint;
 }
 
+export interface IPoint {
+  x: number;
+  y: number;
+}
+
 export class PositionData {
   public calloutDirection: RectangleEdge;
   public targetDirection: RectangleEdge;
@@ -181,8 +160,7 @@ export function getRelativePositions(
   props: IPositionProps,
   hostElement: HTMLElement,
   calloutElement: HTMLElement): IPositionInfo {
-  // Temporary as isBeakVisible is deprecated.
-  let beakWidth: number = (props.linkType ? props.linkType === CalloutLinkType.beak : props.isBeakVisible) ? props.beakWidth : 0;
+  let beakWidth: number = !props.isBeakVisible ? 0 : props.beakWidth;
   let borderWidth: number = positioningFunctions._getBorderSize(calloutElement);
   let gap: number = positioningFunctions._calculateActualBeakWidthInPixels(beakWidth) / 2 + (props.gapSpace ? props.gapSpace : 0);
   let boundingRect: Rectangle = props.bounds ?
@@ -214,7 +192,6 @@ export function getRelativePositions(
     calloutPosition: { top: finalizedCallout.top, left: finalizedCallout.left },
     beakPosition: { top: beakPositioned.top, left: beakPositioned.left, display: 'block' },
     directionalClassName: SLIDE_ANIMATIONS[positionedCallout.targetEdge],
-    rectangleEdge: positionedCallout.targetEdge,
     submenuDirection: positionedCallout.calloutEdge === RectangleEdge.right ? DirectionalHint.leftBottomEdge : DirectionalHint.rightBottomEdge
   };
 }

From c6ee445cc92711e4fb2e3078e84502ff79fcf6d6 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 13 Jul 2017 02:58:02 +0000
Subject: [PATCH 0254/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  4 +-
 .../fix-highlight_2017-07-12-20-44.json       | 11 -----
 ...ng-dropdownscrollfix_2017-07-10-18-18.json | 11 -----
 ...ng-dropdownscrollfix_2017-07-10-18-18.json | 11 -----
 ...ng-dropdownscrollfix_2017-07-10-18-18.json | 11 -----
 ...tooltip-onRender-fix_2017-07-12-16-53.json | 11 -----
 .../ts241-fixes_2017-07-12-19-08.json         | 11 -----
 ...ng-dropdownscrollfix_2017-07-10-18-18.json | 11 -----
 ...schleid-addListProps_2017-07-12-15-01.json | 11 -----
 ...-cschleid-listRedraw_2017-07-12-16-01.json | 11 -----
 packages/example-app-base/CHANGELOG.json      | 19 ++++++++
 packages/example-app-base/CHANGELOG.md        |  9 +++-
 packages/example-app-base/package.json        |  4 +-
 packages/example-component/package.json       |  4 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 44 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 16 ++++++-
 packages/office-ui-fabric-react/package.json  |  6 +--
 packages/styling/CHANGELOG.json               |  6 +++
 packages/styling/CHANGELOG.md                 |  7 ++-
 packages/styling/package.json                 |  2 +-
 20 files changed, 108 insertions(+), 112 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/fix-highlight_2017-07-12-20-44.json
 delete mode 100644 common/changes/@uifabric/example-app-base/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
 delete mode 100644 common/changes/@uifabric/fabric-website/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
 delete mode 100644 common/changes/@uifabric/styling/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
 delete mode 100644 common/changes/office-ui-fabric-react/tooltip-onRender-fix_2017-07-12-16-53.json
 delete mode 100644 common/changes/office-ui-fabric-react/ts241-fixes_2017-07-12-19-08.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-cschleid-addListProps_2017-07-12-15-01.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-cschleid-listRedraw_2017-07-12-16-01.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index eb02975026aca..411788c020cab 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -47,13 +47,13 @@
     "webpack-bundle-analyzer": "^2.2.1"
   },
   "dependencies": {
-    "@uifabric/example-app-base": ">=4.1.0 <5.0.0",
+    "@uifabric/example-app-base": ">=4.1.1 <5.0.0",
     "@uifabric/utilities": ">=4.7.2 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.17.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.18.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/fix-highlight_2017-07-12-20-44.json b/common/changes/@uifabric/example-app-base/fix-highlight_2017-07-12-20-44.json
deleted file mode 100644
index de352bae7dd2c..0000000000000
--- a/common/changes/@uifabric/example-app-base/fix-highlight_2017-07-12-20-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Highlight: Use correct import for highlightBlock",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json b/common/changes/@uifabric/example-app-base/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
deleted file mode 100644
index 7d80e8e887db5..0000000000000
--- a/common/changes/@uifabric/example-app-base/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "adsurang@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json b/common/changes/@uifabric/fabric-website/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
deleted file mode 100644
index f3ff20e3759a2..0000000000000
--- a/common/changes/@uifabric/fabric-website/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "adsurang@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json b/common/changes/@uifabric/styling/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
deleted file mode 100644
index 862f25c73e009..0000000000000
--- a/common/changes/@uifabric/styling/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "adsurang@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/tooltip-onRender-fix_2017-07-12-16-53.json b/common/changes/office-ui-fabric-react/tooltip-onRender-fix_2017-07-12-16-53.json
deleted file mode 100644
index 7c39d9b6aba51..0000000000000
--- a/common/changes/office-ui-fabric-react/tooltip-onRender-fix_2017-07-12-16-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "TooltipHost: Fixed check which kept onRenderContent from working",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/ts241-fixes_2017-07-12-19-08.json b/common/changes/office-ui-fabric-react/ts241-fixes_2017-07-12-19-08.json
deleted file mode 100644
index 0c633249d5703..0000000000000
--- a/common/changes/office-ui-fabric-react/ts241-fixes_2017-07-12-19-08.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Addressing remaining TS 2.4.1 errors.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json b/common/changes/office-ui-fabric-react/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
deleted file mode 100644
index 4e1f46bf09145..0000000000000
--- a/common/changes/office-ui-fabric-react/users-adsurang-dropdownscrollfix_2017-07-10-18-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixing null reference exception caused if user does not specify imageSize along with imageSrc in choiceGroup",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "adsurang@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-cschleid-addListProps_2017-07-12-15-01.json b/common/changes/office-ui-fabric-react/users-cschleid-addListProps_2017-07-12-15-01.json
deleted file mode 100644
index 9dab86d99429d..0000000000000
--- a/common/changes/office-ui-fabric-react/users-cschleid-addListProps_2017-07-12-15-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: Allow passing props to underlying List",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "cschleid@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-cschleid-listRedraw_2017-07-12-16-01.json b/common/changes/office-ui-fabric-react/users-cschleid-listRedraw_2017-07-12-16-01.json
deleted file mode 100644
index 6685a68d25f38..0000000000000
--- a/common/changes/office-ui-fabric-react/users-cschleid-listRedraw_2017-07-12-16-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "List: Only draw a single window when receiving new items",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "cschleid@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 53b2c3f0bb360..9a1ba62b2d7ae 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "4.1.1",
+      "tag": "@uifabric/example-app-base_v4.1.1",
+      "date": "Thu, 13 Jul 2017 02:58:02 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "253b23f0aa42bcc62ad8f861953c3bc0f0343c81",
+            "comment": "Highlight: Use correct import for highlightBlock"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.13.6 <1.0.0` to `>=0.13.7 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.1.0",
       "tag": "@uifabric/example-app-base_v4.1.0",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index 47461f33ff4f8..ca856b3b7960f 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Wed, 12 Jul 2017 01:49:50 GMT and should not be manually modified.
+This log was last generated on Thu, 13 Jul 2017 02:58:02 GMT and should not be manually modified.
+
+## 4.1.1
+Thu, 13 Jul 2017 02:58:02 GMT
+
+### Patches
+
+- Highlight: Use correct import for highlightBlock
 
 ## 4.1.0
 Wed, 12 Jul 2017 01:49:50 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 96382d489558b..2396fe1cb27ef 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "4.1.0",
+  "version": "4.1.1",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -48,7 +48,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.13.6 <1.0.0",
+    "@uifabric/styling": ">=0.13.7 <1.0.0",
     "@uifabric/utilities": ">=4.7.2 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 6a6e4016f6084..615d3b1b14004 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -21,7 +21,7 @@
     "@types/react-addons-test-utils": "0.14.18",
     "@types/react-dom": "15.5.0",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": "4.1.0",
+    "@uifabric/example-app-base": "4.1.1",
     "@uifabric/utilities": "4.7.2",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.18.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.19.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 9555669c7e1f4..d924f6747cda1 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,50 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.19.0",
+      "tag": "office-ui-fabric-react_v4.19.0",
+      "date": "Thu, 13 Jul 2017 02:58:02 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "677439867bfa02aa45d0f05ee2054bbcab797378",
+            "comment": "TooltipHost: Fixed check which kept onRenderContent from working"
+          },
+          {
+            "author": "aadhars <adhargithub@gmail.com>",
+            "commit": "f6dbb240e3b716c9c1cc3f649fed403d1552c2b9",
+            "comment": "Fixing null reference exception caused if user does not specify imageSize along with imageSrc in choiceGroup"
+          },
+          {
+            "author": "Christopher Schleiden <cschleiden@live.de>",
+            "commit": "9ce99671d04ee11c943ae613be66603d4eb0a1d3",
+            "comment": "List: Only draw a single window when receiving new items"
+          }
+        ],
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "894d72c05d1ca0dea6cf22d1bde17d6e9edc4147",
+            "comment": "Addressing remaining TS 2.4.1 errors."
+          },
+          {
+            "author": "Christopher Schleiden <cschleiden@live.de>",
+            "commit": "ecac3cb1e22c64da7a846cbbe6c8a0a8ef0bd47b",
+            "comment": "DetailsList: Allow passing props to underlying List"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.13.6 <1.0.0` to `>=0.13.7 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `4.1.0` to `4.1.1`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.18.0",
       "tag": "office-ui-fabric-react_v4.18.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 9efa1bb81699a..c94770d9d86d7 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,20 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 12 Jul 2017 01:49:50 GMT and should not be manually modified.
+This log was last generated on Thu, 13 Jul 2017 02:58:02 GMT and should not be manually modified.
+
+## 4.19.0
+Thu, 13 Jul 2017 02:58:02 GMT
+
+### Minor changes
+
+- Addressing remaining TS 2.4.1 errors.
+- DetailsList: Allow passing props to underlying List
+
+### Patches
+
+- TooltipHost: Fixed check which kept onRenderContent from working
+- Fixing null reference exception caused if user does not specify imageSize along with imageSrc in choiceGroup
+- List: Only draw a single window when receiving new items
 
 ## 4.18.0
 Wed, 12 Jul 2017 01:49:50 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 495afabc0d9c8..b8070558b4d69 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.18.0",
+  "version": "4.19.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": "4.1.0",
+    "@uifabric/example-app-base": "4.1.1",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.7.2 <5.0.0",
-    "@uifabric/styling": ">=0.13.6 <1.0.0",
+    "@uifabric/styling": ">=0.13.7 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index fd3b19b96e23d..438e2c93cf5c3 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.13.7",
+      "tag": "@uifabric/styling_v0.13.7",
+      "date": "Thu, 13 Jul 2017 02:58:02 GMT",
+      "comments": {}
+    },
     {
       "version": "0.13.6",
       "tag": "@uifabric/styling_v0.13.6",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index fe57f7fd142b8..c6d8748c02cda 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Wed, 12 Jul 2017 01:49:50 GMT and should not be manually modified.
+This log was last generated on Thu, 13 Jul 2017 02:58:02 GMT and should not be manually modified.
+
+## 0.13.7
+Thu, 13 Jul 2017 02:58:02 GMT
+
+*Changes not tracked*
 
 ## 0.13.6
 Wed, 12 Jul 2017 01:49:50 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 8bf12b8c7fb53..f1e613bd66306 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.13.6",
+  "version": "0.13.7",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 8ac8f0da64e88b10c1036296cf798da1e5657a9b Mon Sep 17 00:00:00 2001
From: Michael Loughry <miclo@microsoft.com>
Date: Wed, 12 Jul 2017 20:32:06 -0700
Subject: [PATCH 0255/1641] Only initialize default theme once (#2204)

* Only initialize the theme once

* Add change file
---
 ...yling-init-theme-once_2017-07-13-02-42.json | 11 +++++++++++
 packages/styling/src/styles/theme.ts           | 18 ++++++++++--------
 2 files changed, 21 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/styling-init-theme-once_2017-07-13-02-42.json

diff --git a/common/changes/@uifabric/styling/styling-init-theme-once_2017-07-13-02-42.json b/common/changes/@uifabric/styling/styling-init-theme-once_2017-07-13-02-42.json
new file mode 100644
index 0000000000000..773ad3029bf26
--- /dev/null
+++ b/common/changes/@uifabric/styling/styling-init-theme-once_2017-07-13-02-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Only initialize the default theme once, even if multiple instances of @uifabric/styling are executed.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index 7f059854f356d..56297804a335b 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -21,16 +21,18 @@ let _theme: ITheme = {
 
 export const ThemeSettingName = 'theme';
 
-let win = typeof window !== 'undefined' ? window : undefined;
+if (!GlobalSettings.getValue(ThemeSettingName)) {
+  let win = typeof window !== 'undefined' ? window : undefined;
 
-// tslint:disable:no-string-literal no-any
-if (win && (win as any)['FabricConfig'] && (win as any)['FabricConfig'].theme) {
-  _theme = createTheme((win as any)['FabricConfig'].theme);
-}
-// tslint:enable:no-string-literal no-any
+  // tslint:disable:no-string-literal no-any
+  if (win && (win as any)['FabricConfig'] && (win as any)['FabricConfig'].theme) {
+    _theme = createTheme((win as any)['FabricConfig'].theme);
+  }
+  // tslint:enable:no-string-literal no-any
 
-// Set the default theme.
-GlobalSettings.setValue(ThemeSettingName, _theme);
+  // Set the default theme.
+  GlobalSettings.setValue(ThemeSettingName, _theme);
+}
 
 /**
  * Gets the theme object.

From fb4ba5b9961a639830e53f09fe8015223c68e1a0 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 13 Jul 2017 10:21:52 +0000
Subject: [PATCH 0256/1641] Applying package updates.

---
 .../styling-init-theme-once_2017-07-13-02-42.json  | 11 -----------
 packages/example-app-base/package.json             |  2 +-
 packages/office-ui-fabric-react/package.json       |  2 +-
 packages/styling/CHANGELOG.json                    | 14 ++++++++++++++
 packages/styling/CHANGELOG.md                      |  9 ++++++++-
 packages/styling/package.json                      |  2 +-
 6 files changed, 25 insertions(+), 15 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/styling-init-theme-once_2017-07-13-02-42.json

diff --git a/common/changes/@uifabric/styling/styling-init-theme-once_2017-07-13-02-42.json b/common/changes/@uifabric/styling/styling-init-theme-once_2017-07-13-02-42.json
deleted file mode 100644
index 773ad3029bf26..0000000000000
--- a/common/changes/@uifabric/styling/styling-init-theme-once_2017-07-13-02-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Only initialize the default theme once, even if multiple instances of @uifabric/styling are executed.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 2396fe1cb27ef..9f59f7241fb4a 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -48,7 +48,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.13.7 <1.0.0",
+    "@uifabric/styling": ">=0.13.8 <1.0.0",
     "@uifabric/utilities": ">=4.7.2 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index b8070558b4d69..9bb0bdd628c43 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.7.2 <5.0.0",
-    "@uifabric/styling": ">=0.13.7 <1.0.0",
+    "@uifabric/styling": ">=0.13.8 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 438e2c93cf5c3..5a10fae7758e6 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.13.8",
+      "tag": "@uifabric/styling_v0.13.8",
+      "date": "Thu, 13 Jul 2017 10:21:52 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Michael Loughry <miclo@microsoft.com>",
+            "commit": "8ac8f0da64e88b10c1036296cf798da1e5657a9b",
+            "comment": "Only initialize the default theme once, even if multiple instances of @uifabric/styling are executed."
+          }
+        ]
+      }
+    },
     {
       "version": "0.13.7",
       "tag": "@uifabric/styling_v0.13.7",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index c6d8748c02cda..826720412b01f 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 13 Jul 2017 02:58:02 GMT and should not be manually modified.
+This log was last generated on Thu, 13 Jul 2017 10:21:52 GMT and should not be manually modified.
+
+## 0.13.8
+Thu, 13 Jul 2017 10:21:52 GMT
+
+### Patches
+
+- Only initialize the default theme once, even if multiple instances of @uifabric/styling are executed.
 
 ## 0.13.7
 Thu, 13 Jul 2017 02:58:02 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index f1e613bd66306..d0351b0cdd65b 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.13.7",
+  "version": "0.13.8",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 46e69e5a4e0d85230aa326c3aaff330c94aa042e Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Thu, 13 Jul 2017 11:13:09 -0700
Subject: [PATCH 0257/1641] PeoplePicker: Adding custom validator and styling
 adjustment (#2070)

* Fixed two-line persona truncating, selected item spacing, suggested item coloration, and high contrast support.

* Making delete handle removing suggestions or selected items.

* Adjusting presence position, hiding very small presence icons, fixing duplicated key bug.

* Fix small blocked presence icon and text-overflow behavior.

* Adding validation error styling to persona pills

* Added customizable validation fuction to people picker and styles for invalid persona pills.

* Adding selected+error persona pill styling and ran rush change.

* Changing coloration of pills that are both selected and errors

* Reducing persona pill padding and improving selected+error pill styling.

* Using getInitials utiliity in arbitrary text personas.

* Making generic item creation a customizable prop. Renaming ValidationState enum. Minor styling improvement for tag picker.

* Fixing build issues.
---
 ...eople-picker-styling_2017-06-26-19-15.json | 11 +++
 .../src/components/Callout/Callout.scss       |  1 -
 .../src/components/Persona/Persona.scss       | 42 +++++++---
 .../components/pickers/BasePicker.Props.ts    | 17 +++-
 .../src/components/pickers/BasePicker.scss    |  3 +-
 .../src/components/pickers/BasePicker.tsx     | 14 +++-
 .../pickers/PeoplePicker/PeoplePicker.tsx     | 27 ++++++-
 .../PeoplePickerItem.Props.ts                 |  3 +-
 .../PeoplePickerItems/PickerItemsDefault.scss | 41 +++++++++-
 .../PeoplePickerItems/SelectedItemDefault.tsx | 12 ++-
 .../examples/PeoplePicker.Types.Example.tsx   | 18 ++++-
 .../examples/PeoplePickerExampleData.ts       | 81 +++++++++----------
 .../pickers/Suggestions/Suggestions.scss      | 26 +++++-
 .../pickers/Suggestions/Suggestions.tsx       |  2 +-
 .../Suggestions/SuggestionsController.ts      |  7 +-
 15 files changed, 232 insertions(+), 73 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-people-picker-styling_2017-06-26-19-15.json

diff --git a/common/changes/office-ui-fabric-react/v-krbrow-people-picker-styling_2017-06-26-19-15.json b/common/changes/office-ui-fabric-react/v-krbrow-people-picker-styling_2017-06-26-19-15.json
new file mode 100644
index 0000000000000..ec59aceac5985
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-people-picker-styling_2017-06-26-19-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "PeoplePicker: adding a custom validator prop",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
index 937eff9c7a5e0..028a6ba7a56a5 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
@@ -24,7 +24,6 @@ $Callout-smallbeak-slant-width: 16px;
 .root {
   @include ms-drop-shadow(0,0, 5px, 0px);
   position: absolute;
-  border: 1px solid $ms-color-neutralLight;
   box-sizing: border-box;
 
   @media screen and (-ms-high-contrast: active) {
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
index e06f8f0b18cfd..f81fb09ed3f87 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
@@ -383,8 +383,8 @@ $ms-Persona-presenceSizeXl: 28px;
 //== Modifier: Extra Small Persona
 //
 .root.rootIsExtraExtraSmall {
-  height: $ms-Persona-sizeXxs;
-  min-width: $ms-Persona-sizeXxs;
+  height: $ms-Persona-sizeXs;
+  min-width: $ms-Persona-sizeXs;
 
   .imageArea,
   .image {
@@ -408,17 +408,24 @@ $ms-Persona-presenceSizeXl: 28px;
     height: $ms-Persona-presenceSizeXxs;
     width: $ms-Persona-presenceSizeXxs;
     border: 2px solid $ms-color-white;
-    @include ms-left(16px);
+    @include ms-left(14px);
+    top: 18px;
+
+    &:after {
+      display: none;
+    }
   }
 
   .presenceIcon {
-    font-size: 6px;
-    line-height: 9px;
+    display: none;
+  }
+
+  .details {
+    padding: 0 8px;
   }
 
   .primaryText {
     font-size: $ms-font-size-m;
-    line-height: $ms-Persona-sizeXxs;
   }
 
   .secondaryText {
@@ -433,6 +440,7 @@ $ms-Persona-presenceSizeXl: 28px;
       display: block;
       height: 16px;
       line-height: 16px;
+      overflow-x: hidden;
     }
   }
 }
@@ -468,16 +476,23 @@ $ms-Persona-presenceSizeXl: 28px;
     width: $ms-Persona-presenceSizeXxs;
     border: 2px solid $ms-color-white;
     @include ms-left(20px);
+    top: 18px;
+
+    &:after {
+      display: none;
+    }
   }
 
   .presenceIcon {
-    font-size: 6px;
-    line-height: 9px;
+    display: none;
+  }
+
+  .details {
+    padding: 0 8px;
   }
 
   .primaryText {
     font-size: $ms-font-size-m;
-    line-height: $ms-Persona-size28;
   }
 
   .secondaryText {
@@ -492,6 +507,7 @@ $ms-Persona-presenceSizeXl: 28px;
       display: block;
       line-height: 16px;
       height: 16px;
+      overflow-x: hidden;
     }
   }
 }
@@ -525,9 +541,12 @@ $ms-Persona-presenceSizeXl: 28px;
     @include ms-left(19px);
   }
 
+  .details {
+    padding: 0 8px;
+  }
+
   .primaryText {
     font-size: $ms-font-size-m;
-    line-height: $ms-Persona-sizeXs;
   }
 
   .secondaryText {
@@ -540,6 +559,7 @@ $ms-Persona-presenceSizeXl: 28px;
       display: block;
       height: 16px;
       line-height: 16px;
+      overflow-x: hidden;
     }
   }
 }
@@ -879,4 +899,4 @@ $ms-Persona-presenceSizeXl: 28px;
       box-shadow: 0 0 0 1px $ms-color-black inset;
     }
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
index 905efca683094..0fec49eba42e7 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
@@ -2,6 +2,7 @@ import * as React from 'react';
 import { IPickerItemProps } from './PickerItem.Props';
 import { IPersonaProps } from '../Persona/Persona.Props';
 import { IRenderFunction } from '../../Utilities';
+import { ISuggestionModel } from './Suggestions/SuggestionsController';
 
 // Type T is the type of the item that is displayed
 // and searched for by the people picker. For example, if the picker is
@@ -60,7 +61,11 @@ export interface IBasePickerProps<T> extends React.Props<any> {
    */
   onRemoveSuggestion?: (item: IPersonaProps) => void;
   /**
-   * The text to display while searching for more results in a limited sugesstions list
+   * A function used to validate if raw text entered into the well can be added into the selected items list
+   */
+  onValidateInput?: (input: string) => ValidationState;
+  /**
+   * The text to display while searching for more results in a limited suggestions list
    */
   searchingText?: ((props: { input: string }) => string) | string;
   /**
@@ -68,6 +73,10 @@ export interface IBasePickerProps<T> extends React.Props<any> {
    * @default false
    */
   disabled?: boolean;
+  /**
+   * Function that specifies how arbitrary text entered into the well is handled.
+   */
+  createGenericItem?: (input: string, ValidationState: ValidationState) => ISuggestionModel<T>;
 }
 
 export interface IBasePickerSuggestionsProps {
@@ -127,4 +136,10 @@ export interface IBasePickerSuggestionsProps {
    * Indicates whether to show a button with each suggestion to remove that suggestion.
    */
   showRemoveButtons?: boolean;
+}
+
+export enum ValidationState {
+  valid,
+  warning,
+  invalid
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.scss b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.scss
index 2743580d4f0cf..db022bd9c2ad8 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.scss
@@ -3,6 +3,7 @@
 .pickerText {
   display: flex;
   flex-wrap: wrap;
+  align-items: center;
   box-sizing: border-box;
   border: 1px solid $ms-color-neutralLight;
   min-width: 180px;
@@ -18,7 +19,7 @@
 }
 
 .pickerInput {
-  height: 26px;
+  height: 34px;
   border: none;
   flex-grow: 1;
   outline: none;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 39c3f3c190678..441853d224cbd 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -12,7 +12,7 @@ import { Selection, SelectionZone, SelectionMode } from '../../utilities/selecti
 import { Suggestions } from './Suggestions/Suggestions';
 import { ISuggestionsProps } from './Suggestions/Suggestions.Props';
 import { SuggestionsController } from './Suggestions/SuggestionsController';
-import { IBasePickerProps } from './BasePicker.Props';
+import { IBasePickerProps, ValidationState } from './BasePicker.Props';
 import { BaseAutoFill } from './AutoFill/BaseAutoFill';
 import { IPickerItemProps } from './PickerItem.Props';
 import { IPersonaProps } from '../Persona/Persona.Props';
@@ -372,6 +372,8 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
           this.completeSuggestion();
           ev.preventDefault();
           ev.stopPropagation();
+        } else {
+          this._onValidateInput();
         }
 
         break;
@@ -387,6 +389,8 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
           }
           this.suggestionStore.removeSuggestion(this.suggestionStore.currentIndex);
           this.forceUpdate();
+        } else {
+          this.onBackspace(ev);
         }
         break;
 
@@ -514,6 +518,14 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     return false;
   }
 
+  private _onValidateInput() {
+    if (this.props.onValidateInput && this.props.onValidateInput(this.input.value) !== ValidationState.invalid && this.props.createGenericItem) {
+      let itemToConvert = this.props.createGenericItem(this.input.value, this.props.onValidateInput(this.input.value));
+      this.suggestionStore.createGenericSuggestion(itemToConvert);
+      this.completeSuggestion();
+    }
+  }
+
   private _getTextFromItem(item: T, currentValue?: string): string {
     if (this.props.getTextFromItem) {
       return this.props.getTextFromItem(item, currentValue);
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.tsx
index e18c98abce90c..2f97df1969f25 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.tsx
@@ -1,8 +1,9 @@
 /* tslint:disable */
 import * as React from 'react';
 /* tslint:enable */
+import { getRTL, getInitials } from '../../../Utilities';
 import { BasePicker, BasePickerListBelow } from '../BasePicker';
-import { IBasePickerProps, IBasePickerSuggestionsProps } from '../BasePicker.Props';
+import { IBasePickerProps, IBasePickerSuggestionsProps, ValidationState } from '../BasePicker.Props';
 import { SelectedItemDefault } from './PeoplePickerItems/SelectedItemDefault';
 import { IPersonaProps } from '../../../Persona';
 import { SuggestionItemSmall, SuggestionItemNormal } from './PeoplePickerItems/SuggestionItemDefault';
@@ -24,7 +25,8 @@ export class MemberListPeoplePicker extends BasePickerListBelow<IPersonaProps, I
 export class NormalPeoplePicker extends BasePeoplePicker {
   public static defaultProps = {
     onRenderItem: (props: IPeoplePickerItemProps) => <SelectedItemDefault {...props} />,
-    onRenderSuggestionsItem: (props: IPersonaProps, itemProps?: IBasePickerSuggestionsProps) => SuggestionItemNormal({ ...props }, { ...itemProps })
+    onRenderSuggestionsItem: (props: IPersonaProps, itemProps?: IBasePickerSuggestionsProps) => SuggestionItemNormal({ ...props }, { ...itemProps }),
+    createGenericItem: createGenericItem
   };
 }
 
@@ -34,7 +36,8 @@ export class NormalPeoplePicker extends BasePeoplePicker {
 export class CompactPeoplePicker extends BasePeoplePicker {
   public static defaultProps = {
     onRenderItem: (props: IPeoplePickerItemProps) => <SelectedItemDefault {...props} />,
-    onRenderSuggestionsItem: (props: IPersonaProps, itemProps?: IBasePickerSuggestionsProps) => SuggestionItemSmall({ ...props }, { ...itemProps })
+    onRenderSuggestionsItem: (props: IPersonaProps, itemProps?: IBasePickerSuggestionsProps) => SuggestionItemSmall({ ...props }, { ...itemProps }),
+    createGenericItem: createGenericItem
   };
 }
 
@@ -44,6 +47,22 @@ export class CompactPeoplePicker extends BasePeoplePicker {
 export class ListPeoplePicker extends MemberListPeoplePicker {
   public static defaultProps = {
     onRenderItem: (props: IPeoplePickerItemProps) => <SelectedItemDefault {...props} />,
-    onRenderSuggestionsItem: (props: IPersonaProps, itemProps?: IBasePickerSuggestionsProps) => SuggestionItemNormal({ ...props }, { ...itemProps })
+    onRenderSuggestionsItem: (props: IPersonaProps, itemProps?: IBasePickerSuggestionsProps) => SuggestionItemNormal({ ...props }, { ...itemProps }),
+    createGenericItem: createGenericItem
   };
 }
+
+export function createGenericItem(name: string, currentValidationState: ValidationState) {
+  let personaToConvert = {
+    key: name,
+    primaryText: name,
+    imageInitials: '!',
+    ValidationState: currentValidationState
+  };
+
+  if (currentValidationState !== ValidationState.warning) {
+    personaToConvert.imageInitials = getInitials(name, getRTL());
+  }
+
+  return personaToConvert;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.Props.ts
index bc7e75f63f30c..525347b2db0a8 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.Props.ts
@@ -1,7 +1,8 @@
 import { IPersonaProps } from '../../../../Persona';
 import { IPickerItemProps } from '../../PickerItem.Props';
 import { IContextualMenuItem } from '../../../../ContextualMenu';
-export interface IPeoplePickerItemProps extends IPickerItemProps <IPersonaProps> {
+import { ValidationState } from '../../BasePicker.Props';
+export interface IPeoplePickerItemProps extends IPickerItemProps<IPersonaProps & { ValidationState: ValidationState }> {
 }
 
 export interface IPeoplePickerItemWithMenuProps extends IPickerItemProps<IPersonaWithMenu> {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
index d4fad07ee1435..c1aad4738c3c4 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
@@ -1,12 +1,12 @@
 @import '../../../../common/common';
 
 .personaContainer {
-  @include focus-border();
+  @include focus-border(-2px);
   border-radius: 15px;
   display: inline-flex;
   align-items: center;
   background: $ms-color-neutralLighter;
-  margin: 1px 2px;
+  margin: 4px;
   cursor: default;
   user-select: none;
   max-width: 300px;
@@ -38,6 +38,43 @@
         background: $ms-color-themeDark;
       }
     }
+
+    @media screen and (-ms-high-contrast: active) {
+      border: 1px solid $ms-color-themePrimary;
+    }
+  }
+
+  &.validationError {
+    // Setting global values here to override persona's normal behavior in the error version
+    :global(.ms-Persona-primaryText) {
+      color: $ms-color-redDark;
+      border-bottom: 2px dotted $ms-color-redDark;
+    }
+
+    :global(.ms-Persona-initials) {
+      font-size: 20px;
+    }
+
+    &.personaContainerIsSelected {
+      background: $ms-color-redDark;
+
+      :global(.ms-Persona-primaryText) {
+        color: $ms-color-white;
+        border-bottom: 2px dotted $ms-color-white;
+      }
+
+      .removeButton:hover {
+        background: $ms-color-red;
+      }
+    }
+  }
+
+  @media screen and (-ms-high-contrast: active) {
+    border: 1px solid $ms-color-white;
+  }
+
+  @media screen and (-ms-high-contrast: black-on-white) {
+    border: 1px solid $ms-color-black;
   }
 
   .itemContent {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
index f9c158853a90d..8c54f8e6ffaba 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
@@ -4,6 +4,7 @@ import * as React from 'react';
 import { css } from '../../../../Utilities';
 import { Persona, PersonaSize, PersonaPresence } from '../../../../Persona';
 import { IPeoplePickerItemProps } from './PeoplePickerItem.Props';
+import { ValidationState } from '../../BasePicker.Props';
 import { IconButton } from '../../../../Button';
 import * as stylesImport from './PickerItemsDefault.scss';
 const styles: any = stylesImport;
@@ -17,9 +18,12 @@ export const SelectedItemDefault: (props: IPeoplePickerItemProps) => JSX.Element
   } = peoplePickerItemProps;
   return (
     <div
-      className={ css('ms-PickerPersona-container', styles.personaContainer, {
-        ['is-selected ' + styles.personaContainerIsSelected]: selected
-      }) }
+      className={ css(
+        'ms-PickerPersona-container',
+        styles.personaContainer,
+        { ['is-selected ' + styles.personaContainerIsSelected]: selected },
+        { ['is-invalid ' + styles.validationError]: item.ValidationState === ValidationState.warning }
+      ) }
       data-is-focusable={ true }
       data-selection-index={ index } >
       <div className={ css('ms-PickerItem-content', styles.itemContent) } >
@@ -31,7 +35,7 @@ export const SelectedItemDefault: (props: IPeoplePickerItemProps) => JSX.Element
       </div>
       <IconButton
         onClick={ () => { if (onRemoveItem) { onRemoveItem(); } } }
-        iconProps={ { iconName: 'Cancel' } }
+        iconProps={ { iconName: 'Cancel', style: { fontSize: '12px' } } }
         className={ css('ms-PickerItem-removeButton', styles.removeButton) }
         data-is-focusable={ false }
       />
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index 71d581ab9c89a..f3a1132fa8fab 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -14,7 +14,8 @@ import {
   CompactPeoplePicker,
   IBasePickerSuggestionsProps,
   ListPeoplePicker,
-  NormalPeoplePicker
+  NormalPeoplePicker,
+  ValidationState
 } from 'office-ui-fabric-react/lib/Pickers';
 import { IPersonaWithMenu } from 'office-ui-fabric-react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.Props';
 import { people, mostRecentlyUsed } from './PeoplePickerExampleData';
@@ -118,6 +119,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
         pickerSuggestionsProps={ suggestionProps }
         key={ 'list' }
         onRemoveSuggestion={ this._onRemoveSuggestion }
+        onValidateInput={ this._validateInput }
       />
     );
   }
@@ -132,6 +134,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
         className={ 'ms-PeoplePicker' }
         key={ 'normal' }
         onRemoveSuggestion={ this._onRemoveSuggestion }
+        onValidateInput={ this._validateInput }
       />
     );
   }
@@ -145,6 +148,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
         pickerSuggestionsProps={ suggestionProps }
         className={ 'ms-PeoplePicker' }
         onRemoveSuggestion={ this._onRemoveSuggestion }
+        onValidateInput={ this._validateInput }
       />
     );
   }
@@ -160,6 +164,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
         key={ 'list' }
         pickerSuggestionsProps={ suggestionProps }
         onRemoveSuggestion={ this._onRemoveSuggestion }
+        onValidateInput={ this._validateInput }
       />
     );
   }
@@ -282,4 +287,15 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     this.setState({ currentPicker: option.key });
   }
 
+  @autobind
+  private _validateInput(input: string) {
+    if (input.indexOf('@') !== -1) {
+      return ValidationState.valid;
+    } else if (input.length > 1) {
+      return ValidationState.warning;
+    } else {
+      return ValidationState.invalid;
+    }
+  }
+
 }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePickerExampleData.ts b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePickerExampleData.ts
index 9b250ada4ee1a..1902d08d53848 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePickerExampleData.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePickerExampleData.ts
@@ -3,8 +3,7 @@ import { TestImages } from '../../../../common/TestImages';
 
 export const people: (IPersonaProps & { key: string | number })[] = [
   {
-    key: 0,
-
+    key: 1,
     imageUrl: TestImages.personaFemale,
     imageInitials: 'PV',
     primaryText: 'Annie Lindqvist',
@@ -14,7 +13,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.online
   },
   {
-    key: 1,
+    key: 2,
     imageUrl: TestImages.personaMale,
     imageInitials: 'AR',
     primaryText: 'Aaron Reid',
@@ -24,7 +23,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.busy
   },
   {
-    key: 2,
+    key: 3,
     imageUrl: TestImages.personaMale,
     imageInitials: 'AL',
     primaryText: 'Alex Lundberg',
@@ -34,7 +33,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.dnd
   },
   {
-    key: 3,
+    key: 4,
     imageUrl: TestImages.personaMale,
     imageInitials: 'RK',
     primaryText: 'Roko Kolar',
@@ -44,7 +43,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.offline
   },
   {
-    key: 4,
+    key: 5,
     imageUrl: TestImages.personaMale,
     imageInitials: 'CB',
     primaryText: 'Christian Bergqvist',
@@ -54,7 +53,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.online
   },
   {
-    key: 5,
+    key: 6,
     imageUrl: TestImages.personaFemale,
     imageInitials: 'VL',
     primaryText: 'Valentina Lovric',
@@ -64,7 +63,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.online
   },
   {
-    key: 6,
+    key: 7,
     imageUrl: TestImages.personaMale,
     imageInitials: 'MS',
     primaryText: 'Maor Sharett',
@@ -74,7 +73,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.away
   },
   {
-    key: 7,
+    key: 8,
     imageUrl: TestImages.personaFemale,
     imageInitials: 'PV',
     primaryText: 'Anny Lindqvist',
@@ -84,7 +83,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.busy
   },
   {
-    key: 8,
+    key: 9,
     imageUrl: TestImages.personaMale,
     imageInitials: 'AR',
     primaryText: 'Aron Reid',
@@ -94,7 +93,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.dnd
   },
   {
-    key: 9,
+    key: 10,
     imageUrl: TestImages.personaMale,
     imageInitials: 'AL',
     primaryText: 'Alix Lundberg',
@@ -104,7 +103,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.offline
   },
   {
-    key: 10,
+    key: 11,
     imageUrl: TestImages.personaMale,
     imageInitials: 'RK',
     primaryText: 'Roko Kular',
@@ -115,7 +114,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
 
   },
   {
-    key: 11,
+    key: 12,
     imageUrl: TestImages.personaMale,
     imageInitials: 'CB',
     primaryText: 'Christian Bergqvest',
@@ -125,7 +124,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.busy
   },
   {
-    key: 12,
+    key: 13,
     imageUrl: TestImages.personaFemale,
     imageInitials: 'VL',
     primaryText: 'Valintina Lovric',
@@ -135,7 +134,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.busy
   },
   {
-    key: 13,
+    key: 14,
     imageUrl: TestImages.personaMale,
     imageInitials: 'MS',
     primaryText: 'Maor Sharet',
@@ -145,7 +144,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.blocked
   },
   {
-    key: 14,
+    key: 15,
     imageUrl: TestImages.personaFemale,
     imageInitials: 'VL',
     primaryText: 'Anny Lindqvest',
@@ -155,7 +154,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.blocked
   },
   {
-    key: 15,
+    key: 16,
     imageUrl: TestImages.personaMale,
     imageInitials: 'MS',
     primaryText: 'Alix Lunberg',
@@ -165,7 +164,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.away
   },
   {
-    key: 16,
+    key: 17,
     imageUrl: TestImages.personaFemale,
     imageInitials: 'VL',
     primaryText: 'Annie Lindqvest',
@@ -175,7 +174,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.online
   },
   {
-    key: 17,
+    key: 18,
     imageUrl: TestImages.personaMale,
     imageInitials: 'MS',
     primaryText: 'Alixander Lundberg',
@@ -185,7 +184,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.offline
   },
   {
-    key: 18,
+    key: 19,
     imageUrl: TestImages.personaFemale,
     imageInitials: 'VL',
     primaryText: 'Anny Lundqvist',
@@ -195,7 +194,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.away
   },
   {
-    key: 19,
+    key: 20,
     imageUrl: TestImages.personaMale,
     imageInitials: 'MS',
     primaryText: 'Maor Shorett',
@@ -205,7 +204,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.blocked
   },
   {
-    key: 20,
+    key: 21,
     imageUrl: TestImages.personaFemale,
     imageInitials: 'VL',
     primaryText: 'Valentina Lovrics',
@@ -215,7 +214,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.online
   },
   {
-    key: 21,
+    key: 22,
     imageUrl: TestImages.personaMale,
     imageInitials: 'MS',
     primaryText: 'Maor Sharet',
@@ -225,7 +224,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.online
   },
   {
-    key: 22,
+    key: 23,
     imageUrl: TestImages.personaFemale,
     imageInitials: 'VL',
     primaryText: 'Valentina Lovrecs',
@@ -235,7 +234,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.blocked
   },
   {
-    key: 23,
+    key: 24,
     imageUrl: TestImages.personaMale,
     imageInitials: 'MS',
     primaryText: 'Maor Sharitt',
@@ -245,7 +244,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.offline
   },
   {
-    key: 24,
+    key: 25,
     imageUrl: './images/persona-male.png',
     imageInitials: 'MS',
     primaryText: 'Maor Shariett',
@@ -255,7 +254,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.online
   },
   {
-    key: 25,
+    key: 26,
     imageUrl: './images/persona-female.png',
     imageInitials: 'AL',
     primaryText: 'Alix Lundburg',
@@ -265,7 +264,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.away
   },
   {
-    key: 26,
+    key: 27,
     imageUrl: './images/persona-female.png',
     imageInitials: 'VL',
     primaryText: 'Valantena Lovric',
@@ -275,7 +274,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.busy
   },
   {
-    key: 27,
+    key: 28,
     imageUrl: './images/persona-female.png',
     imageInitials: 'VL',
     primaryText: 'Velatine Lourvric',
@@ -285,7 +284,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.online
   },
   {
-    key: 28,
+    key: 29,
     imageUrl: './images/persona-female.png',
     imageInitials: 'VL',
     primaryText: 'Valentyna Lovrique',
@@ -295,7 +294,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.busy
   },
   {
-    key: 29,
+    key: 30,
     imageUrl: './images/persona-female.png',
     imageInitials: 'AL',
     primaryText: 'Annie Lindquest',
@@ -305,7 +304,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.dnd
   },
   {
-    key: 30,
+    key: 31,
     imageUrl: './images/persona-female.png',
     imageInitials: 'AL',
     primaryText: 'Anne Lindquist',
@@ -315,7 +314,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.blocked
   },
   {
-    key: 31,
+    key: 32,
     imageUrl: './images/persona-female.png',
     imageInitials: 'AL',
     primaryText: 'Ann Lindqiest',
@@ -325,7 +324,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.online
   },
   {
-    key: 32,
+    key: 33,
     imageUrl: './images/persona-male.png',
     imageInitials: 'AR',
     primaryText: 'Aron Reid',
@@ -335,7 +334,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.away
   },
   {
-    key: 33,
+    key: 34,
     imageUrl: './images/persona-male.png',
     imageInitials: 'AR',
     primaryText: 'Aaron Reed',
@@ -345,7 +344,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.offline
   },
   {
-    key: 34,
+    key: 35,
     imageUrl: './images/persona-female.png',
     imageInitials: 'AL',
     primaryText: 'Alix Lindberg',
@@ -355,7 +354,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.busy
   },
   {
-    key: 35,
+    key: 36,
     imageUrl: './images/persona-male.png',
     imageInitials: 'AL',
     primaryText: 'Alan Lindberg',
@@ -365,7 +364,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.busy
   },
   {
-    key: 36,
+    key: 37,
     imageUrl: './images/persona-male.png',
     imageInitials: 'MS',
     primaryText: 'Maor Sharit',
@@ -375,7 +374,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.offline
   },
   {
-    key: 37,
+    key: 38,
     imageUrl: './images/persona-male.png',
     imageInitials: 'MS',
     primaryText: 'Maorr Sherit',
@@ -385,7 +384,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.online
   },
   {
-    key: 38,
+    key: 39,
     imageUrl: './images/persona-male.png',
     imageInitials: 'AL',
     primaryText: 'Alex Lindbirg',
@@ -395,7 +394,7 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     presence: PersonaPresence.dnd
   },
   {
-    key: 39,
+    key: 40,
     imageUrl: './images/persona-male.png',
     imageInitials: 'AL',
     primaryText: 'Alex Lindbarg',
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
index aae4537a84e4a..833b485a75892 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
@@ -12,7 +12,11 @@
   position: relative;
 
   &:hover {
-    background: $ms-color-neutralLight;
+    background: $ms-color-neutralLighter;
+
+    .closeButton {
+      display: block;
+    }
   }
 
   &.suggestionsItemIsSuggested {
@@ -22,13 +26,30 @@
       background: $ms-color-neutralTertiaryAlt;
     }
 
+    @media screen and (-ms-high-contrast: active) {
+      border: 1px solid $ms-color-white;
+    }
+
+    @media screen and (-ms-high-contrast: black-on-white) {
+      border: 1px solid $ms-color-black;
+    }
+
     .closeButton {
       &:hover {
         background: $ms-color-neutralTertiary;
-        color: $ms-color-black;
+        color: $ms-color-neutralPrimary;
       }
     }
   }
+
+  .closeButton {
+    display: none;
+    color: $ms-color-neutralSecondary;
+
+    &:hover {
+      background: $ms-color-neutralLight;
+    }
+  }
 }
 
 .searchMoreButton {
@@ -66,7 +87,6 @@
   padding: 0 12px;
   color: $ms-color-themePrimary;
   font-size: $ms-font-size-s;
-  text-transform: uppercase;
   line-height: 40px;
   border-bottom: 1px solid $ms-color-neutralLight;
 }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index de70b8732cd9f..ee310ff48012a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -41,7 +41,7 @@ export class SuggestionsItem<T> extends BaseComponent<ISuggestionItemProps<T>, {
         </CommandButton>
         { this.props.showRemoveButton ? (
           <IconButton
-            iconProps={ { iconName: 'Cancel' } }
+            iconProps={ { iconName: 'Cancel', style: { fontSize: '12px' } } }
             title='Remove'
             ariaLabel='Remove'
             onClick={ onRemoveItem }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
index cb701e7e692bb..5c477c7ff4601 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
@@ -81,7 +81,12 @@ export class SuggestionsController<T> {
     this.suggestions.splice(index, 1);
   }
 
-  private _convertSuggestionsToSuggestionItems(suggestions: any[]): ISuggestionModel<T>[] {
+  public createGenericSuggestion(itemToConvert: ISuggestionModel<T>) {
+    let itemToAdd = this._convertSuggestionsToSuggestionItems([itemToConvert])[0];
+    this.currentSuggestion = itemToAdd;
+  }
+
+  public _convertSuggestionsToSuggestionItems(suggestions: any[]): ISuggestionModel<T>[] {
     let converted: ISuggestionModel<T>[] = [];
     suggestions.forEach((suggestion: any) => converted.push({ item: suggestion, selected: false }));
     return converted;

From 1200d471c740de9b9a3c8b1e1257048f1cbcfb3f Mon Sep 17 00:00:00 2001
From: Eddie Liu <leddie24@gmail.com>
Date: Thu, 13 Jul 2017 13:09:23 -0700
Subject: [PATCH 0258/1641] DetailList: Add compact mode, add column padding
 prop, style fixes (#1806)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Add compact example

* add compact prop to detailslist

* Add documents example, WIP

* Finish document example

* Add isPadded prop to IColumn, fix colors for DetailsList states, fix height on compact mode, add toggle for Documents Example compact mode

* update border colors

* Fix colors for different states

* Update header cell font color

* Fix linting errors

* Remove row border in compact mode
Move sort icon to right side
set background color for header cell to white
set font weight and font size for check mark

* Removed unused var

* Fix DetailsHeader border bottom not showing.  Remove unnecessary compact var in render for DetailsRowFields.  Add comments for DetailsRow.scss.

* Add change file

* Fix colors

* Add disabledForegroundColor back in semanticcolors

* Update change file

* Fix colors vars for detailsrow

* Remove unnecessary margin-top, fix variable names for colors

* Change z-indexes

* Add height animation, remove nearIcon class on Icon header cell, fix vertical alignment of icon

* Fix indentation

* Removing z-indexes (need to check with Chris to see if this is acceptable)

* Fix border colors.  Add pseudo element for selected rows to have border top.  Remove border top for first row so header border isn’t covered.

* Fix styles from merge conflicts

* Add ms- prefix for mixins

* Remove column attribute for isGrouped isFiltered

* Remove height transition

* Fix file icon vertical alignment.  Fix 4px margin left

* Remove line height from compact.  Adjust padding so check is centered vertically

* Change isPadded to use ms-padding-right instead of margin.  Fix row width calculation.

* Adjust ISPADDED_WIDTH, change DetailsRowCheck left/right padding to fix 2px overflow bug.

* Fix icon only header

* 3px 3px to 3px

* Fix typings
---
 ...-detailslist-compact_2017-05-16-21-45.json |  10 +
 package.json                                  |   2 +-
 .../src/components/Check/Check.scss           |   2 +-
 .../components/DetailsList/DetailsHeader.scss |  38 +-
 .../components/DetailsList/DetailsHeader.tsx  |  31 +-
 .../DetailsList/DetailsList.Props.ts          | 768 +++++++++---------
 .../components/DetailsList/DetailsList.scss   |   6 +
 .../components/DetailsList/DetailsList.tsx    |  10 +-
 .../DetailsList/DetailsListPage.tsx           |  12 +
 .../components/DetailsList/DetailsRow.scss    | 154 +++-
 .../src/components/DetailsList/DetailsRow.tsx |   1 +
 .../DetailsList/DetailsRowCheck.scss          |   2 +-
 .../DetailsList/DetailsRowFields.tsx          |   6 +-
 .../examples/DetailsList.Compact.Example.tsx  | 102 +++
 .../DetailsList.Documents.Example.tsx         | 319 ++++++++
 .../examples/DetailsListExample.scss          |  27 +
 .../MarqueeSelection/MarqueeSelection.scss    |   1 +
 17 files changed, 1062 insertions(+), 429 deletions(-)
 create mode 100644 common/changes/v-edwliu-detailslist-compact_2017-05-16-21-45.json
 create mode 100644 packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Compact.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx

diff --git a/common/changes/v-edwliu-detailslist-compact_2017-05-16-21-45.json b/common/changes/v-edwliu-detailslist-compact_2017-05-16-21-45.json
new file mode 100644
index 0000000000000..74b1e12621574
--- /dev/null
+++ b/common/changes/v-edwliu-detailslist-compact_2017-05-16-21-45.json
@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: Add compact mode to component, add column padding, fix styling and Check component sizing",
+      "type": "minor"
+    }
+  ],
+  "email": "v-edwliu@microsoft.com"
+}
\ No newline at end of file
diff --git a/package.json b/package.json
index 66cf8d895b0bb..31d99d924a979 100644
--- a/package.json
+++ b/package.json
@@ -28,4 +28,4 @@
     "gulp": "^3.9.1",
     "yargs": "^6.5.0"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.scss b/packages/office-ui-fabric-react/src/components/Check/Check.scss
index 90c8d69079a17..9976af48d1b8c 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.scss
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.scss
@@ -7,7 +7,7 @@
 // --------------------------------------------------
 // Check styles
 
-$checkBoxHeight: 24px;
+$checkBoxHeight: 16px;
 
 .root {
   line-height: 1;
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
index 64dd09b99da58..b7b713d95f472 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
@@ -1,13 +1,17 @@
 @import '../../common/common';
 
 $iconForegroundColor: $ms-color-neutralSecondary;
-$actionableHeaderForegroundColor: $ms-color-neutralSecondary;
+$headerForegroundColor: $ms-color-neutralPrimary;
+$headerBackgroundColor: $ms-color-white;
 $dropdownChevronForegroundColor: $ms-color-neutralTertiary;
-$rowHeight: 36px;
+$rowHeight: 32px;
 $resizerColor: $ms-color-neutralTertiaryAlt;
+$cellPadding: 8px;
+$isPaddedMargin: 24px;
 
 .root {
   display: inline-block;
+  position: relative;
   min-width: 100%;
   vertical-align: top;
   height: $rowHeight;
@@ -25,34 +29,36 @@ $resizerColor: $ms-color-neutralTertiaryAlt;
   }
 }
 
+.cellWrapperPadded {
+  @include ms-padding-right($isPaddedMargin + $cellPadding);
+}
+
 .cell {
   @include ms-font-s;
-  background: transparent;
-  color: $disabledForegroundColor;
+  background: $headerBackgroundColor;
+  color: $headerForegroundColor;
   @include focus-border();
-  font-weight: $ms-font-weight-regular;
   position: relative;
   display: inline-block;
   box-sizing: border-box;
-  padding: 0 8px;
+  padding: 0 $cellPadding;
   border: none;
   line-height: inherit;
   margin: 0;
-  @include text-align(left);
+  @include ms-text-align(left);
   height: $rowHeight;
   vertical-align: top;
   white-space: nowrap;
   text-overflow: ellipsis;
-  @include text-align(left);
+  @include ms-text-align(left);
 
   &.cellIsCheck {
     position: relative;
-    padding: 0;
+    padding: 6px 8px;
     margin: 0;
   }
 
   &.cellIsActionable {
-    color: $actionableHeaderForegroundColor;
 
     &:hover {
       color: $ms-color-neutralPrimary;
@@ -120,10 +126,16 @@ $resizerColor: $ms-color-neutralTertiaryAlt;
   }
 }
 
-.cell .nearIcon {
+.iconOnlyHeader {
+  .nearIcon {
+    @include ms-padding-left(0);
+  }
+}
+
+.nearIcon {
   color: $iconForegroundColor;
   opacity: 1;
-  @include padding-right(4px);
+  @include ms-padding-left(8px);
 }
 
 .cell .filterChevron {
@@ -167,5 +179,5 @@ $resizerColor: $ms-color-neutralTertiaryAlt;
 }
 
 .cell .collapseButton {
-  @include padding-right(0);
+  @include ms-padding-right(0);
 }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index 7ccc65d693818..d7bfc9bb843e1 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -25,6 +25,7 @@ const styles: any = stylesImport;
 const MOUSEDOWN_PRIMARY_BUTTON = 0; // for mouse down event we are using ev.button property, 0 means left button
 const MOUSEMOVE_PRIMARY_BUTTON = 1; // for mouse move event we are using ev.buttons property, 1 means left button
 const INNER_PADDING = 16;
+const ISPADDED_WIDTH = 24;
 
 export interface IDetailsHeader {
   focus(): boolean;
@@ -209,9 +210,10 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
                   column.headerClassName, {
                     ['is-actionable ' + styles.cellIsActionable]: column.columnActionsMode !== ColumnActionsMode.disabled,
                     ['is-empty ' + styles.cellIsEmpty]: !column.name,
-                    'is-icon-visible': column.isSorted || column.isGrouped || column.isFiltered
+                    'is-icon-visible': column.isSorted || column.isGrouped || column.isFiltered,
+                    [styles.cellWrapperPadded]: column.isPadded
                   }) }
-                style={ { width: column.calculatedWidth + INNER_PADDING } }
+                style={ { width: column.calculatedWidth + INNER_PADDING + (column.isPadded ? ISPADDED_WIDTH : 0) } }
                 aria-haspopup={ column.columnActionsMode === ColumnActionsMode.hasDropdown }
                 data-automationid='ColumnsHeaderColumn'
                 data-item-key={ column.key }
@@ -231,6 +233,20 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
                         onContextMenu={ this._onColumnContextMenu.bind(this, column) }
                         onClick={ this._onColumnClick.bind(this, column) }
                       >
+                        <span
+                          aria-label={ column.isIconOnly ? column.name : undefined }
+                          className={ css('ms-DetailsHeader-cellName',
+                            styles.cellName, {
+                              [styles.iconOnlyHeader]: column.isIconOnly
+                            }) }
+                        >
+                          { (column.iconName || column.iconClassName) && (
+                            <Icon className={ css(styles.nearIcon, column.iconClassName) } iconName={ column.iconName } />
+                          ) }
+
+                          { !column.isIconOnly ? column.name : undefined }
+                        </span>
+
                         { column.isFiltered && (
                           <Icon className={ styles.nearIcon } iconName='Filter' />
                         ) }
@@ -243,17 +259,6 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
                           <Icon className={ styles.nearIcon } iconName='GroupedDescending' />
                         ) }
 
-                        <span
-                          aria-label={ column.isIconOnly ? column.name : undefined }
-                          className={ css('ms-DetailsHeader-cellName', styles.cellName) }
-                        >
-                          { (column.iconName || column.iconClassName) && (
-                            <Icon className={ css(styles.nearIcon, column.iconClassName) } iconName={ column.iconName } />
-                          ) }
-
-                          { !column.isIconOnly ? column.name : undefined }
-                        </span>
-
                         { column.columnActionsMode === ColumnActionsMode.hasDropdown && !column.isIconOnly && (
                           <Icon
                             className={ css('ms-DetailsHeader-filterChevron', styles.filterChevron) }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
index 3b09a23cf684b..6b191774fe684 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
@@ -1,380 +1,388 @@
-import * as React from 'react';
-import { DetailsList } from './DetailsList';
-import {
-  ISelection,
-  SelectionMode
-} from '../../utilities/selection/index';
-import { IRenderFunction } from '../../Utilities';
-import {
-  IDragDropEvents,
-  IDragDropContext,
-} from './../../utilities/dragdrop/index';
-import { IconName } from '../../Icon';
-import {
-  IGroup,
-  IGroupRenderProps
-} from '../GroupedList/index';
-import { IDetailsRowProps } from '../DetailsList/DetailsRow';
-import { IDetailsHeaderProps } from './DetailsHeader';
-import { IViewport } from '../../utilities/decorators/withViewport';
-import { IListProps } from '../List/index';
-
-export { IDetailsHeaderProps };
-
-export interface IDetailsList {
-  /**
-   * Ensures that the list content is updated. Call this in cases where the list prop updates don't change, but the list
-   * still needs to be re-evaluated. For example, if a sizer bar is adjusted and causes the list width to change, you can
-   * call this to force a re-evaluation. Be aware that this can be an expensive operation and should be done sparingly.
-   */
-  forceUpdate: () => void;
-}
-
-export interface IDetailsListProps extends React.Props<DetailsList> {
-  /**
-   * Optional callback to access the IDetailsList interface. Use this instead of ref for accessing
-   * the public methods and properties of the component.
-   */
-  componentRef?: (component: IDetailsList) => void;
-
-  /** A key that uniquely identifies the given items. If provided, the selection will be reset when the key changes. */
-  setKey?: string;
-
-  /** The items to render. */
-  items: any[];
-
-  /** Optional properties to pass through to the list components being rendered. */
-  listProps?: IListProps;
-
-  /**
-   * Optional default focused index to set focus to once the items have rendered and the index exists.
-   */
-  initialFocusedIndex?: number;
-
-  /** Optional class name to add to the root element. */
-  className?: string;
-
-  /** Optional grouping instructions. The definition for IGroup can be found under the GroupedList component. */
-  groups?: IGroup[];
-
-  /** Optional override properties to render groups. The definition for IGroupRenderProps can be found under the GroupedList component. */
-  groupProps?: IGroupRenderProps;
-
-  /** Optional selection model to track selection state.  */
-  selection?: ISelection;
-
-  /** Controls how/if the details list manages selection. */
-  selectionMode?: SelectionMode;
-
-  /**
-   * By default, selection is cleared when clicking on an empty (non-focusable) section of the screen. Setting this value to true
-   * overrides that behavior and maintains selection.
-   * @default false
-   **/
-  selectionPreservedOnEmptyClick?: boolean;
-
-  /** Controls how the columns are adjusted. */
-  layoutMode?: DetailsListLayoutMode;
-
-  /**
-   * Controls the visibility of selection check box.
-   * @default CheckboxVisibility.onHover
-   */
-  checkboxVisibility?: CheckboxVisibility;
-
-  /**
-   * Controls the visibility of the details header.
-   * @default true
-   */
-  isHeaderVisible?: boolean;
-
-  /** Given column defitions. If none are provided, default columns will be created based on the item's properties. */
-  columns?: IColumn[];
-
-  /** Controls how the list contrains overflow. */
-  constrainMode?: ConstrainMode;
-
-  /** Event names and corresponding callbacks that will be registered to rendered row elements. */
-  rowElementEventMap?: { eventName: string, callback: (context: IDragDropContext, event?: any) => void }[];
-
-  /** Callback for when the details list has been updated. Useful for telemetry tracking externally. */
-  onDidUpdate?: (detailsList?: DetailsList) => any;
-
-  /** Callback for when a given row has been mounted. Useful for identifying when a row has been rendered on the page. */
-  onRowDidMount?: (item?: any, index?: number) => void;
-
-  /** Callback for when a given row has been mounted. Useful for identifying when a row has been removed from the page. */
-  onRowWillUnmount?: (item?: any, index?: number) => void;
-
-  /** Callback for when the user clicks on the column header. */
-  onColumnHeaderClick?: (ev?: React.MouseEvent<HTMLElement>, column?: IColumn) => void;
-
-  /** Callback for when the user asks for a contextual menu (usually via right click) from a column header. */
-  onColumnHeaderContextMenu?: (column?: IColumn, ev?: React.MouseEvent<HTMLElement>) => void;
-
-  /** Callback fired on column resize */
-  onColumnResize?: (column?: IColumn, newWidth?: number) => void;
-
-  /** Callback for when a given row has been invoked (by pressing enter while it is selected.) */
-  onItemInvoked?: (item?: any, index?: number, ev?: Event) => void;
-
-  /** Callback for when the context menu of an item has been accessed. */
-  onItemContextMenu?: (item?: any, index?: number, ev?: Event) => void;
-
-  /**
-   *  If provided, will allow the caller to override the default row rendering.
-   */
-  onRenderRow?: IRenderFunction<IDetailsRowProps>;
-
-  /**
-   * If provided, will be the "default" item column renderer method. This affects cells within the rows; not the rows themselves.
-   * If a column definition provides its own onRender method, that will be used instead of this.
-   */
-  onRenderItemColumn?: (item?: any, index?: number, column?: IColumn) => any;
-
-  /** Map of callback functions related to drag and drop functionality. */
-  dragDropEvents?: IDragDropEvents;
-
-  /** Callback for what to render when the item is missing. */
-  onRenderMissingItem?: (index?: number) => React.ReactNode;
-
-  /**
-   * An override to render the details header.
-   */
-  onRenderDetailsHeader?: IRenderFunction<IDetailsHeaderProps>;
-
-  /** Viewport, provided by the withViewport decorator. */
-  viewport?: IViewport;
-
-  /** Callback for when an item in the list becomes active by clicking anywhere inside the row or navigating to it with keyboard. */
-  onActiveItemChanged?: (item?: any, index?: number, ev?: React.FocusEvent<HTMLElement>) => void;
-
-  /** The aria-label attribute to stamp out on the list header */
-  ariaLabelForListHeader?: string;
-
-  /** The aria-label attribute to stamp out on select all checkbox for the list */
-  ariaLabelForSelectAllCheckbox?: string;
-
-  /**
-   * An ARIA label for the name of the selection column, for localization.
-   */
-  ariaLabelForSelectionColumn?: string;
-
-  /** Optional callback to get the aria-label string for a given item. */
-  getRowAriaLabel?: (item: any) => string;
-
-  /** Optional callback to get the item key, to be used in the selection and on render. */
-  getKey?: (item: any, index?: number) => string;
-
-  /** A text summary of the table set via aria-label. */
-  ariaLabel?: string;
-
-  /** Check button aria label for details list. */
-  checkButtonAriaLabel?: string;
-
-  /** Aria label for grid in details list. */
-  ariaLabelForGrid?: string;
-
-  /** Boolean value to indicate if the role application should be applied on details list. Set to false by default */
-  shouldApplyApplicationRole?: boolean;
-
-  /**
-   * The minimum mouse move distance to interpret the action as drag event.
-   * @defaultValue 5
-   */
-  minimumPixelsForDrag?: number;
-}
-
-export interface IColumn {
-  /**
-   * A unique key for identifying the column.
-   */
-  key: string;
-
-  /**
-   * Name to render on the column header.
-   */
-  name: string;
-
-  /**
-   * The field to pull the text value from for the column. This can be null if a custom
-   * onRender method is provided.
-   */
-  fieldName: string;
-
-  /**
-   * An optional class name to stick on the column cell within each row.
-   */
-  className?: string;
-
-  /**
-   * Minimum width for the column.
-   */
-  minWidth: number;
-
-  /**
-   * Optional accessibility label (aria-label) attribute that will be stamped on to the element.
-   * If none is specified, the arai-label attribute will contain the column name
-   */
-  ariaLabel?: string;
-
-  /**
-   * Optional flag on whether the column is a header for the given row. There should be only one column with
-   * row header set to true.
-   * @default false
-   */
-  isRowHeader?: boolean;
-
-  /**
-   * Maximum width for the column, if stretching is allowed in justified scenarios.
-   */
-  maxWidth?: number;
-
-  /**
-   * Defines how the column's header should render.
-   * @default ColumnActionsMode.clickable */
-  columnActionsMode?: ColumnActionsMode;
-
-  /**
-   * Optional iconName to use for the column header.
-   */
-  iconName?: IconName;
-
-  /**
-   * Whether or not only the icon is used in the column header.
-   * Set this to true so the column name and dropdown chevron are not displayed.
-   */
-  isIconOnly?: boolean;
-
-  /**
-   * Class name to add to the Icon component.
-   */
-  iconClassName?: string;
-
-  /**
-   * If specified will allow the column to be collapsed when rendered in justified layout.
-   */
-  isCollapsable?: boolean;
-
-  /**
-   * Determines if the column is currently sorted. Renders a sort arrow in the column header.
-   */
-  isSorted?: boolean;
-
-  /**
-   * Determines if the arrow is pointed down (descending) or up.
-   */
-  isSortedDescending?: boolean;
-
-  /**
-   * Determines if the column can be resized.
-   */
-  isResizable?: boolean;
-
-  /**
-   * Determines if the column can render multi-line text.
-   */
-  isMultiline?: boolean;
-
-  /**
-   * If provided uses this method to render custom cell content, rather than the default text rendering.
-   */
-  onRender?: (item?: any, index?: number, column?: IColumn) => any;
-
-  /**
-   * Determines if the column is filtered, and if so shows a filter icon.
-   */
-  isFiltered?: boolean;
-
-  /**
-   * If provided, will be executed when the user clicks on the column header.
-   */
-  onColumnClick?: (ev?: React.MouseEvent<HTMLElement>, column?: IColumn) => any;
-
-  /**
-   * If provided, will be executed when the user accesses the contextmenu on a column header.
-   */
-  onColumnContextMenu?: (column?: IColumn, ev?: React.MouseEvent<HTMLElement>) => any;
-
-  /**
-   * If set will show a grouped icon next to the column header name.
-   */
-  isGrouped?: boolean;
-
-  /**
-   * Arbitrary data passthrough which can be used by the caller.
-   */
-  data?: any;
-
-  /**
-   * Internal only value.
-   */
-  calculatedWidth?: number;
-
-  /**
-   * An optional class name to stick on the column cell within each header.
-   */
-  headerClassName?: string;
-}
-
-/**
- * Enum to describe how a particular column header behaves.... This enum is used to
- * to specify the property IColumn:columnActionsMode.
- * If IColumn:columnActionsMode is undefined, then it's equivalent to ColumnActionsMode.clickable
- */
-export enum ColumnActionsMode {
-  /**
-   * Renders the column header as disabled.
-   */
-  disabled = 0,
-
-  /**
-   * Renders the column header is clickable.
-   */
-  clickable = 1,
-
-  /**
-   * Renders the column header ias clickable and displays the dropdown cheveron.
-   */
-  hasDropdown = 2
-}
-
-export enum ConstrainMode {
-  /** If specified, lets the content grow which allows the page to manage scrolling. */
-  unconstrained = 0,
-
-  /**
-   * If specified, constrains the list to the given layout space.
-   */
-  horizontalConstrained = 1
-}
-
-export enum DetailsListLayoutMode {
-  /**
-   * Lets the user resize columns and makes not attempt to fit them.
-   */
-  fixedColumns = 0,
-
-  /**
-   * Manages which columns are visible, tries to size them according to their min/max rules and drops
-   * off columns that can't fit and have isCollapsable set.
-   */
-  justified = 1
-}
-
-export enum CheckboxVisibility {
-  /**
-   * Visible on hover.
-   */
-  onHover = 0,
-
-  /**
-   * Visible always.
-   */
-  always = 1,
-
-  /**
-   * Hide checkboxes.
-   */
-  hidden = 2
-}
+import * as React from 'react';
+import { DetailsList } from './DetailsList';
+import {
+  ISelection,
+  SelectionMode
+} from '../../utilities/selection/index';
+import { IRenderFunction } from '../../Utilities';
+import {
+  IDragDropEvents,
+  IDragDropContext,
+} from './../../utilities/dragdrop/index';
+import { IconName } from '../../Icon';
+import {
+  IGroup,
+  IGroupRenderProps
+} from '../GroupedList/index';
+import { IDetailsRowProps } from '../DetailsList/DetailsRow';
+import { IDetailsHeaderProps } from './DetailsHeader';
+import { IViewport } from '../../utilities/decorators/withViewport';
+import { IListProps } from '../List/index';
+
+export { IDetailsHeaderProps };
+
+export interface IDetailsList {
+  /**
+   * Ensures that the list content is updated. Call this in cases where the list prop updates don't change, but the list
+   * still needs to be re-evaluated. For example, if a sizer bar is adjusted and causes the list width to change, you can
+   * call this to force a re-evaluation. Be aware that this can be an expensive operation and should be done sparingly.
+   */
+  forceUpdate: () => void;
+}
+
+export interface IDetailsListProps extends React.Props<DetailsList> {
+  /**
+   * Optional callback to access the IDetailsList interface. Use this instead of ref for accessing
+   * the public methods and properties of the component.
+   */
+  componentRef?: (component: IDetailsList) => void;
+
+  /** A key that uniquely identifies the given items. If provided, the selection will be reset when the key changes. */
+  setKey?: string;
+
+  /** The items to render. */
+  items: any[];
+
+  /** Optional properties to pass through to the list components being rendered. */
+  listProps?: IListProps;
+
+  /**
+   * Optional default focused index to set focus to once the items have rendered and the index exists.
+   */
+  initialFocusedIndex?: number;
+
+  /** Optional class name to add to the root element. */
+  className?: string;
+
+  /** Optional grouping instructions. The definition for IGroup can be found under the GroupedList component. */
+  groups?: IGroup[];
+
+  /** Optional override properties to render groups. The definition for IGroupRenderProps can be found under the GroupedList component. */
+  groupProps?: IGroupRenderProps;
+
+  /** Optional selection model to track selection state.  */
+  selection?: ISelection;
+
+  /** Controls how/if the details list manages selection. */
+  selectionMode?: SelectionMode;
+
+  /**
+   * By default, selection is cleared when clicking on an empty (non-focusable) section of the screen. Setting this value to true
+   * overrides that behavior and maintains selection.
+   * @default false
+   **/
+  selectionPreservedOnEmptyClick?: boolean;
+
+  /** Controls how the columns are adjusted. */
+  layoutMode?: DetailsListLayoutMode;
+
+  /**
+   * Controls the visibility of selection check box.
+   * @default CheckboxVisibility.onHover
+   */
+  checkboxVisibility?: CheckboxVisibility;
+
+  /**
+   * Controls the visibility of the details header.
+   * @default true
+   */
+  isHeaderVisible?: boolean;
+
+  /** Given column defitions. If none are provided, default columns will be created based on the item's properties. */
+  columns?: IColumn[];
+
+  /** Controls how the list contrains overflow. */
+  constrainMode?: ConstrainMode;
+
+  /** Event names and corresponding callbacks that will be registered to rendered row elements. */
+  rowElementEventMap?: { eventName: string, callback: (context: IDragDropContext, event?: any) => void }[];
+
+  /** Callback for when the details list has been updated. Useful for telemetry tracking externally. */
+  onDidUpdate?: (detailsList?: DetailsList) => any;
+
+  /** Callback for when a given row has been mounted. Useful for identifying when a row has been rendered on the page. */
+  onRowDidMount?: (item?: any, index?: number) => void;
+
+  /** Callback for when a given row has been mounted. Useful for identifying when a row has been removed from the page. */
+  onRowWillUnmount?: (item?: any, index?: number) => void;
+
+  /** Callback for when the user clicks on the column header. */
+  onColumnHeaderClick?: (ev?: React.MouseEvent<HTMLElement>, column?: IColumn) => void;
+
+  /** Callback for when the user asks for a contextual menu (usually via right click) from a column header. */
+  onColumnHeaderContextMenu?: (column?: IColumn, ev?: React.MouseEvent<HTMLElement>) => void;
+
+  /** Callback fired on column resize */
+  onColumnResize?: (column?: IColumn, newWidth?: number) => void;
+
+  /** Callback for when a given row has been invoked (by pressing enter while it is selected.) */
+  onItemInvoked?: (item?: any, index?: number, ev?: Event) => void;
+
+  /** Callback for when the context menu of an item has been accessed. */
+  onItemContextMenu?: (item?: any, index?: number, ev?: Event) => void;
+
+  /**
+   *  If provided, will allow the caller to override the default row rendering.
+   */
+  onRenderRow?: IRenderFunction<IDetailsRowProps>;
+
+  /**
+   * If provided, will be the "default" item column renderer method. This affects cells within the rows; not the rows themselves.
+   * If a column definition provides its own onRender method, that will be used instead of this.
+   */
+  onRenderItemColumn?: (item?: any, index?: number, column?: IColumn) => any;
+
+  /** Map of callback functions related to drag and drop functionality. */
+  dragDropEvents?: IDragDropEvents;
+
+  /** Callback for what to render when the item is missing. */
+  onRenderMissingItem?: (index?: number) => React.ReactNode;
+
+  /**
+   * An override to render the details header.
+   */
+  onRenderDetailsHeader?: IRenderFunction<IDetailsHeaderProps>;
+
+  /** Viewport, provided by the withViewport decorator. */
+  viewport?: IViewport;
+
+  /** Callback for when an item in the list becomes active by clicking anywhere inside the row or navigating to it with keyboard. */
+  onActiveItemChanged?: (item?: any, index?: number, ev?: React.FocusEvent<HTMLElement>) => void;
+
+  /** The aria-label attribute to stamp out on the list header */
+  ariaLabelForListHeader?: string;
+
+  /** The aria-label attribute to stamp out on select all checkbox for the list */
+  ariaLabelForSelectAllCheckbox?: string;
+
+  /**
+   * An ARIA label for the name of the selection column, for localization.
+   */
+  ariaLabelForSelectionColumn?: string;
+
+  /** Optional callback to get the aria-label string for a given item. */
+  getRowAriaLabel?: (item: any) => string;
+
+  /** Optional callback to get the item key, to be used in the selection and on render. */
+  getKey?: (item: any, index?: number) => string;
+
+  /** A text summary of the table set via aria-label. */
+  ariaLabel?: string;
+
+  /** Check button aria label for details list. */
+  checkButtonAriaLabel?: string;
+
+  /** Aria label for grid in details list. */
+  ariaLabelForGrid?: string;
+
+  /** Boolean value to indicate if the role application should be applied on details list. Set to false by default */
+  shouldApplyApplicationRole?: boolean;
+
+  /**
+   * The minimum mouse move distance to interpret the action as drag event.
+   * @defaultValue 5
+   */
+  minimumPixelsForDrag?: number;
+
+  /** Boolean value to indicate if the component should render in compact mode. Set to false by default */
+  compact?: boolean;
+}
+
+export interface IColumn {
+  /**
+   * A unique key for identifying the column.
+   */
+  key: string;
+
+  /**
+   * Name to render on the column header.
+   */
+  name: string;
+
+  /**
+   * The field to pull the text value from for the column. This can be null if a custom
+   * onRender method is provided.
+   */
+  fieldName: string;
+
+  /**
+   * An optional class name to stick on the column cell within each row.
+   */
+  className?: string;
+
+  /**
+   * Minimum width for the column.
+   */
+  minWidth: number;
+
+  /**
+   * Optional accessibility label (aria-label) attribute that will be stamped on to the element.
+   * If none is specified, the arai-label attribute will contain the column name
+   */
+  ariaLabel?: string;
+
+  /**
+   * Optional flag on whether the column is a header for the given row. There should be only one column with
+   * row header set to true.
+   * @default false
+   */
+  isRowHeader?: boolean;
+
+  /**
+   * Maximum width for the column, if stretching is allowed in justified scenarios.
+   */
+  maxWidth?: number;
+
+  /**
+   * Defines how the column's header should render.
+   * @default ColumnActionsMode.clickable */
+  columnActionsMode?: ColumnActionsMode;
+
+  /**
+   * Optional iconName to use for the column header.
+   */
+  iconName?: IconName;
+
+  /**
+   * Whether or not only the icon is used in the column header.
+   * Set this to true so the column name and dropdown chevron are not displayed.
+   */
+  isIconOnly?: boolean;
+
+  /**
+   * Class name to add to the Icon component.
+   */
+  iconClassName?: string;
+
+  /**
+   * If specified will allow the column to be collapsed when rendered in justified layout.
+   */
+  isCollapsable?: boolean;
+
+  /**
+   * Determines if the column is currently sorted. Renders a sort arrow in the column header.
+   */
+  isSorted?: boolean;
+
+  /**
+   * Determines if the arrow is pointed down (descending) or up.
+   */
+  isSortedDescending?: boolean;
+
+  /**
+   * Determines if the column can be resized.
+   */
+  isResizable?: boolean;
+
+  /**
+   * Determines if the column can render multi-line text.
+   */
+  isMultiline?: boolean;
+
+  /**
+   * If provided uses this method to render custom cell content, rather than the default text rendering.
+   */
+  onRender?: (item?: any, index?: number, column?: IColumn) => any;
+
+  /**
+   * Determines if the column is filtered, and if so shows a filter icon.
+   */
+  isFiltered?: boolean;
+
+  /**
+   * If provided, will be executed when the user clicks on the column header.
+   */
+  onColumnClick?: (ev?: React.MouseEvent<HTMLElement>, column?: IColumn) => any;
+
+  /**
+   * If provided, will be executed when the user accesses the contextmenu on a column header.
+   */
+  onColumnContextMenu?: (column?: IColumn, ev?: React.MouseEvent<HTMLElement>) => any;
+
+  /**
+   * If set will show a grouped icon next to the column header name.
+   */
+  isGrouped?: boolean;
+
+  /**
+   * Arbitrary data passthrough which can be used by the caller.
+   */
+  data?: any;
+
+  /**
+   * Internal only value.
+   */
+  calculatedWidth?: number;
+
+  /**
+   * An optional class name to stick on the column cell within each header.
+   */
+  headerClassName?: string;
+
+  /**
+  * If set, will add additional LTR padding-right to column and cells.
+  */
+  isPadded?: boolean;
+}
+
+/**
+ * Enum to describe how a particular column header behaves.... This enum is used to
+ * to specify the property IColumn:columnActionsMode.
+ * If IColumn:columnActionsMode is undefined, then it's equivalent to ColumnActionsMode.clickable
+ */
+export enum ColumnActionsMode {
+  /**
+   * Renders the column header as disabled.
+   */
+  disabled = 0,
+
+  /**
+   * Renders the column header is clickable.
+   */
+  clickable = 1,
+
+  /**
+   * Renders the column header ias clickable and displays the dropdown cheveron.
+   */
+  hasDropdown = 2
+}
+
+export enum ConstrainMode {
+  /** If specified, lets the content grow which allows the page to manage scrolling. */
+  unconstrained = 0,
+
+  /**
+   * If specified, constrains the list to the given layout space.
+   */
+  horizontalConstrained = 1
+}
+
+export enum DetailsListLayoutMode {
+  /**
+   * Lets the user resize columns and makes not attempt to fit them.
+   */
+  fixedColumns = 0,
+
+  /**
+   * Manages which columns are visible, tries to size them according to their min/max rules and drops
+   * off columns that can't fit and have isCollapsable set.
+   */
+  justified = 1
+}
+
+export enum CheckboxVisibility {
+  /**
+   * Visible on hover.
+   */
+  onHover = 0,
+
+  /**
+   * Visible always.
+   */
+  always = 1,
+
+  /**
+   * Hide checkboxes.
+   */
+  hidden = 2
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.scss
index 24d86ee5d0d66..549eafd42f27c 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.scss
@@ -29,3 +29,9 @@ $detailsList-text-color: $listTextColor;
   min-height: 38px;
   word-break: break-word;
 }
+
+.rootCompact {
+  :global(.ms-List-cell) {
+    min-height: 32px;
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 464f78d071d67..e0c7745b0530a 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -54,6 +54,7 @@ const MIN_COLUMN_WIDTH = 100; // this is the global min width
 const CHECKBOX_WIDTH = 36;
 const GROUP_EXPAND_WIDTH = 36;
 const DEFAULT_INNER_PADDING = 16;
+const ISPADDED_WIDTH = 24;
 
 const DEFAULT_RENDERED_WINDOWS_AHEAD = 2;
 const DEFAULT_RENDERED_WINDOWS_BEHIND = 2;
@@ -193,6 +194,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       ariaLabelForSelectionColumn,
       className,
       checkboxVisibility,
+      compact,
       constrainMode,
       dragDropEvents,
       groups,
@@ -259,7 +261,9 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
         ref={ this._resolveRef('_root') }
         className={ css('ms-DetailsList', styles.root, className, {
           'is-fixed': layoutMode === DetailsListLayoutMode.fixedColumns,
-          ['is-horizontalConstrained ' + styles.rootIsHorizontalConstrained]: constrainMode === ConstrainMode.horizontalConstrained
+          ['is-horizontalConstrained ' + styles.rootIsHorizontalConstrained]: constrainMode === ConstrainMode.horizontalConstrained,
+          'ms-DetailsList--Compact': compact,
+          [styles.rootCompact]: compact
         }) }
         data-automationid='DetailsList'
         data-is-scrollable='false'
@@ -358,6 +362,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
 
   private _onRenderCell(nestingDepth: number, item: any, index: number): React.ReactNode {
     let {
+      compact,
       dragDropEvents,
       rowElementEventMap: eventsToRegister,
       onRenderMissingItem,
@@ -388,6 +393,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     return onRenderRow({
       item: item,
       itemIndex: index,
+      compact: compact,
       columns: columns,
       groupNestingDepth: nestingDepth,
       selectionMode: selectionMode,
@@ -589,7 +595,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
           calculatedWidth: column.minWidth || MIN_COLUMN_WIDTH
         });
 
-      totalWidth += newColumn.calculatedWidth + (i > 0 ? DEFAULT_INNER_PADDING : 0);
+      totalWidth += newColumn.calculatedWidth + (i > 0 ? DEFAULT_INNER_PADDING : 0) + (column.isPadded ? ISPADDED_WIDTH : 0);
 
       return newColumn;
     });
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
index 6b555ce321c1d..651c776a8fd29 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
@@ -9,6 +9,9 @@ import {
 import { DetailsListBasicExample } from './examples/DetailsList.Basic.Example';
 const DetailsListBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx') as string;
 
+import { DetailsListCompactExample } from './examples/DetailsList.Compact.Example';
+const DetailsListCompactExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Compact.Example.tsx') as string;
+
 import { DetailsListCustomColumnsExample } from './examples/DetailsList.CustomColumns.Example';
 const DetailsListCustomColumnsExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx') as string;
 
@@ -27,6 +30,9 @@ const DetailsListGroupedExampleCode = require('!raw-loader!office-ui-fabric-reac
 import { DetailsListDragDropExample } from './examples/DetailsList.DragDrop.Example';
 const DetailsListDragDropExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx') as string;
 
+import { DetailsListDocumentsExample } from './examples/DetailsList.Documents.Example';
+const DetailsListDocumentsExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx') as string;
+
 import { DetailsListNavigatingFocusExample } from './examples/DetailsList.NavigatingFocus.Example';
 const DetailsListNavigatingFocusExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx') as string;
 
@@ -38,9 +44,15 @@ export class DetailsListPage extends React.Component<IComponentDemoPageProps, {}
         componentName='DetailsListExample'
         exampleCards={
           <div>
+            <ExampleCard title='Document DetailsList with 500 items, sorting, filtering, marquee selection' isOptIn={ true } code={ DetailsListDocumentsExampleCode }>
+              <DetailsListDocumentsExample />
+            </ExampleCard>
             <ExampleCard title='Simple DetailsList with 500 items, filtering, marquee selection' isOptIn={ true } code={ DetailsListBasicExampleCode }>
               <DetailsListBasicExample />
             </ExampleCard>
+            <ExampleCard title='Compact DetailsList with 500 items, filtering, marquee selection' isOptIn={ true } code={ DetailsListCompactExampleCode }>
+              <DetailsListCompactExample />
+            </ExampleCard>
             <ExampleCard title='Simple Grouped DetailsList' isOptIn={ true } code={ DetailsListGroupedExampleCode }>
               <DetailsListGroupedExample />
             </ExampleCard>
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
index 9364287b42d45..348d3c85f0c64 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
@@ -1,40 +1,145 @@
 @import '../../common/common';
 
-$rowHeight: 36px;
-$rowVerticalPadding: 10px;
+$rowHeight: 42px;
+$compactRowHeight: 32px;
+$rowVerticalPadding: 11px;
+$rowHorizontalPadding: 8px;
+$compactRowVerticalPadding: 6px;
+$isPaddedMargin: 24px;
+
+
+/* DetailsList Colors */
+// Default
+$detailsList-item-default-header-text-color: $ms-color-neutralPrimary;
+$detailsList-item-default-meta-text-color: $ms-color-neutralSecondaryAlt;
+$detailsList-item-default-background-color: $ms-color-white;
+
+// Hover
+$detailsList-item-hover-text-color: $ms-color-neutralPrimary;
+$detailsList-item-hover-meta-text-color: $ms-color-neutralSecondary;
+$detailsList-item-hover-color-background: $ms-color-neutralLighter;
+
+// Selected
+$detailsList-item-selected-text-color: $ms-color-neutralDark;
+$detailsList-item-selected-meta-text-color: $ms-color-neutralPrimary;
+$detailsList-item-selected-background-color: $ms-color-neutralLight;
+
+// Selected Hover
+$detailsList-item-selected-hover-text-color: $ms-color-black;
+$detailsList-item-selected-hover-meta-text-color: $ms-color-neutralDark;
+$detailsList-item-selected-hover-background-color: $ms-color-neutralQuaternaryAlt;
+
+// Focus
+$detailsList-item-focus-header-text-color: $ms-color-black;
+$detailsList-item-focus-background-color: $ms-color-neutralQuaternaryAlt;
+$detailsList-item-focus-meta-text-color: $ms-color-neutralDark;
+
+
+// Compact mode rules
+:global(.ms-DetailsList--Compact) {
+  .root {
+    min-height: $compactRowHeight;
+    border: 0;
+  }
+
+  .cell {
+    min-height: $compactRowHeight;
+    padding: $compactRowVerticalPadding $rowHorizontalPadding;
+  }
 
-// component slots
-$detailsList-item-hover-color: $listItemHoverColor;
-$detailsList-item-selected-color: $listItemSelectedColor;
-$detailsList-item-selected-hover-color: $listItemSelectedHoverColor;
+  .check {
+    padding: $rowHorizontalPadding;
+  }
+}
+
+:global(.ms-List-cell:first-child) {
+  .root {
+    // Don't show border-top for first row's pseudo element
+    &:before {
+      display: none;
+    }
+  }
+}
 
+// Default state
 .root {
-  @include focus-border();
+  @include focus-border(0, $ms-color-neutralSecondary);
 
+  border-bottom: 1px solid $ms-color-neutralLighter;
+  background: $detailsList-item-default-background-color;
+  color: $detailsList-item-default-meta-text-color;
   display: flex;
   min-width: 100%;
   min-height: $rowHeight;
-  margin: 1px 0;
-  vertical-align: top;
   white-space: nowrap;
   padding: 0;
   box-sizing: border-box;
 
-  background: none;
-  border: none;
-  @include text-align(left);
+  @include ms-text-align(left);
   vertical-align: top;
 
+  // Default State hover
   &:hover {
-    background: $detailsList-item-hover-color;
+    background: $detailsList-item-hover-color-background;
+    color: $detailsList-item-hover-meta-text-color;
   }
 }
 
+// Selected State
 .rootIsSelected {
-  background: $detailsList-item-selected-color;
+  @include focus-border(0, $ms-color-themePrimary);
+
+  color: $detailsList-item-selected-meta-text-color;
+  background: $detailsList-item-selected-background-color;
+  border-bottom: 1px solid $ms-color-white;
+
+  .cell {
+    // Selected State Header cell
+    &.isRowHeader {
+      color: $detailsList-item-selected-text-color;
+    }
+  }
+
+  &:before {
+    position: absolute;
+    display: block;
+    top: -1px;
+    height: 1px;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    content: '';
+    border-top: 1px solid $ms-color-white;
+  }
 
+  // Selected State hover
   &:hover {
-    background: $detailsList-item-selected-hover-color;
+    background: $detailsList-item-selected-hover-background-color;
+
+    // Selected State hover meta cell
+    .cell {
+      color: $detailsList-item-selected-hover-meta-text-color;
+
+      // Selected State hover Header cell
+      &.isRowHeader {
+        color: $detailsList-item-selected-hover-text-color;
+      }
+    }
+  }
+
+  // Focus state
+  &:focus {
+    background: $detailsList-item-focus-background-color;
+
+    // Selected State hover meta cell
+    .cell {
+      color: $detailsList-item-focus-meta-text-color;
+
+      // Row header cell
+      &.isRowHeader {
+        color: $detailsList-item-focus-header-text-color;
+      }
+    }
   }
 }
 
@@ -43,13 +148,14 @@ $detailsList-item-selected-hover-color: $listItemSelectedHoverColor;
   cursor: default;
 }
 
+// Default cell state
 .cell {
   @include focus-border();
 
   display: inline-block;
   position: relative;
   box-sizing: border-box;
-  padding: $rowVerticalPadding 8px;
+  padding: $rowVerticalPadding $rowHorizontalPadding;
   min-height: $rowHeight;
   vertical-align: top;
   white-space: nowrap;
@@ -60,6 +166,20 @@ $detailsList-item-selected-hover-color: $listItemSelectedHoverColor;
     max-width: 100%;
   }
 
+  // Default header cell state
+  &.isRowHeader {
+    color: $detailsList-item-default-header-text-color;
+    font-size: $ms-font-size-m;
+  }
+
+  [data-is-focusable=true] {
+    @include focus-border(0, $ms-color-neutralSecondary);
+  }
+}
+
+.isPadded {
+  @include ms-padding-right($isPaddedMargin + $rowHorizontalPadding);
+
   &.checkCell {
     padding: 0;
     margin: 0;
@@ -80,4 +200,4 @@ $detailsList-item-selected-hover-color: $listItemSelectedHoverColor;
 .cellMeasurer .cell {
   overflow: visible;
   white-space: nowrap;
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index ad7ca80e0b84d..d459fabf28998 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -33,6 +33,7 @@ export interface IDetailsRowProps extends React.Props<DetailsRow> {
   item: any;
   itemIndex: number;
   columns: IColumn[];
+  compact?: boolean;
   selectionMode: SelectionMode;
   selection: ISelection;
   eventsToRegister?: { eventName: string, callback: (item?: any, index?: number, event?: any) => void }[];
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
index 71a9fb6ae4069..8cd89296951e9 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
@@ -18,7 +18,7 @@
 }
 
 button.check {
-  padding: 6px;
+  padding: 3px;
 }
 
 .owner {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
index 9cf13667d6d5c..76b256c652920 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
@@ -5,6 +5,7 @@ import * as stylesImport from './DetailsRow.scss';
 const styles: any = stylesImport;
 
 const INNER_PADDING = 16; // Account for padding around the cell.
+const ISPADDED_WIDTH = 24;
 
 export interface IDetailsRowFieldsProps {
   componentRef?: () => void;
@@ -12,6 +13,7 @@ export interface IDetailsRowFieldsProps {
   itemIndex: number;
   columnStartIndex: number;
   columns: IColumn[];
+  compact?: boolean;
   onRenderItemColumn?: (item?: any, index?: number, column?: IColumn) => any;
 }
 
@@ -46,9 +48,11 @@ export class DetailsRowFields extends BaseComponent<IDetailsRowFieldsProps, IDet
             aria-colindex={ columnIndex + columnStartIndex }
             className={ css('ms-DetailsRow-cell', styles.cell, column.className, {
               'is-multiline': column.isMultiline,
+              [styles.isRowHeader]: column.isRowHeader,
+              [styles.isPadded]: column.isPadded,
               [styles.isMultiline]: column.isMultiline
             }) }
-            style={ { width: column.calculatedWidth + INNER_PADDING } }
+            style={ { width: column.calculatedWidth + INNER_PADDING + (column.isPadded ? ISPADDED_WIDTH : 0) } }
             data-automationid='DetailsRowCell'
             data-automation-key={ column.key }>
             { cellContent[columnIndex] }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Compact.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Compact.Example.tsx
new file mode 100644
index 0000000000000..3daf6e2e9c595
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Compact.Example.tsx
@@ -0,0 +1,102 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+import { TextField } from 'office-ui-fabric-react/lib/TextField';
+import {
+  DetailsList,
+  DetailsListLayoutMode,
+  Selection
+} from 'office-ui-fabric-react/lib/DetailsList';
+import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
+
+let _items: {
+  key: number,
+  name: string,
+  value: number
+}[] = [];
+
+let _columns = [
+  {
+    key: 'column1',
+    name: 'Name',
+    fieldName: 'name',
+    minWidth: 100,
+    maxWidth: 200,
+    isResizable: true
+  },
+  {
+    key: 'column2',
+    name: 'Value',
+    fieldName: 'value',
+    minWidth: 100,
+    maxWidth: 200,
+    isResizable: true
+  },
+];
+
+export class DetailsListCompactExample extends React.Component<any, any> {
+  private _selection: Selection;
+
+  constructor() {
+    super();
+
+    // Populate with items for demos.
+    if (_items.length === 0) {
+      for (let i = 0; i < 200; i++) {
+        _items.push({
+          key: i,
+          name: 'Item ' + i,
+          value: i
+        });
+      }
+    }
+
+    this._selection = new Selection({
+      onSelectionChanged: () => this.setState({ selectionDetails: this._getSelectionDetails() })
+    });
+
+    this.state = {
+      items: _items,
+      selectionDetails: this._getSelectionDetails()
+    };
+  }
+
+  public render() {
+    let { items, selectionDetails } = this.state;
+
+    return (
+      <div>
+        <div>{ selectionDetails }</div>
+        <TextField
+          label='Filter by name:'
+          onChanged={ text => this.setState({ items: text ? _items.filter(i => i.name.toLowerCase().indexOf(text) > -1) : _items }) }
+        />
+        <MarqueeSelection selection={ this._selection }>
+          <DetailsList
+            items={ items }
+            columns={ _columns }
+            setKey='set'
+            layoutMode={ DetailsListLayoutMode.fixedColumns }
+            selection={ this._selection }
+            selectionPreservedOnEmptyClick={ true }
+            onItemInvoked={ (item) => alert(`Item invoked: ${item.name}`) }
+            compact={ true }
+          />
+        </MarqueeSelection>
+      </div>
+    );
+  }
+
+  private _getSelectionDetails(): string {
+    let selectionCount = this._selection.getSelectedCount();
+
+    switch (selectionCount) {
+      case 0:
+        return 'No items selected';
+      case 1:
+        return '1 item selected: ' + (this._selection.getSelection()[0] as any).name;
+      default:
+        return `${selectionCount} items selected`;
+    }
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
new file mode 100644
index 0000000000000..8a44b89ca6e81
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
@@ -0,0 +1,319 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+import { TextField } from 'office-ui-fabric-react/lib/TextField';
+import { Toggle } from 'office-ui-fabric-react/lib/Toggle';
+import {
+  DetailsList,
+  DetailsListLayoutMode,
+  Selection,
+  IColumn
+} from 'office-ui-fabric-react/lib/DetailsList';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { Icon } from 'office-ui-fabric-react/lib/Icon';
+import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
+import { lorem } from '@uifabric/example-app-base';
+import './DetailsListExample.scss';
+
+let _items: IDocument[] = [];
+
+const fileIcons: { name: string; }[] = [
+  { 'name': 'accdb' },
+  { 'name': 'csv' },
+  { 'name': 'docx' },
+  { 'name': 'dotx' },
+  { 'name': 'mpp' },
+  { 'name': 'mpt' },
+  { 'name': 'odp' },
+  { 'name': 'ods' },
+  { 'name': 'odt' },
+  { 'name': 'one' },
+  { 'name': 'onepkg' },
+  { 'name': 'onetoc' },
+  { 'name': 'potx' },
+  { 'name': 'ppsx' },
+  { 'name': 'pptx' },
+  { 'name': 'pub' },
+  { 'name': 'vsdx' },
+  { 'name': 'vssx' },
+  { 'name': 'vstx' },
+  { 'name': 'xls' },
+  { 'name': 'xlsx' },
+  { 'name': 'xltx' },
+  { 'name': 'xsn' }
+];
+
+export interface IDetailsListDocumentsExampleState {
+  columns: IColumn[];
+  items: IDocument[];
+  selectionDetails: string;
+  isCompactMode: boolean;
+}
+
+export interface IDocument {
+  [key: string]: any;
+  name: string;
+  value: string;
+  iconName: string;
+  modifiedBy: string;
+  dateModified: string;
+  dateModifiedValue: number;
+  fileSize: string;
+  fileSizeRaw: number;
+}
+
+export class DetailsListDocumentsExample extends React.Component<any, IDetailsListDocumentsExampleState> {
+  private _selection: Selection;
+
+  constructor(props: any) {
+    super(props);
+
+    //  Populate with items for demos.
+    if (_items.length === 0) {
+      for (let i = 0; i < 500; i++) {
+        const randomDate = this._randomDate(new Date(2012, 0, 1), new Date());
+        const randomFileSize = this._randomFileSize();
+        const randomFileType = this._randomFileIcon();
+        let fileName: string = lorem(2).replace(/\W/g, '');
+        let userName: string = lorem(2).replace(/[^a-zA-Z ]/g, '');
+        fileName = fileName.charAt(0).toUpperCase() + fileName.slice(1).concat(`.${randomFileType.docType}`);
+        userName = userName.split(' ').map((name: string) => name.charAt(0).toUpperCase() + name.slice(1)).join(' ');
+        _items.push({
+          name: fileName,
+          value: fileName,
+          iconName: randomFileType.url,
+          modifiedBy: userName,
+          dateModified: randomDate.dateFormatted,
+          dateModifiedValue: randomDate.value,
+          fileSize: randomFileSize.value,
+          fileSizeRaw: randomFileSize.rawSize
+        });
+      }
+      _items = this._sortItems(_items, 'name');
+    }
+
+    const _columns: IColumn[] = [
+      {
+        key: 'column1',
+        name: 'File Type',
+        headerClassName: 'DetailsListExample-header--FileIcon',
+        className: 'DetailsListExample-cell--FileIcon',
+        iconClassName: 'DetailsListExample-Header-FileTypeIcon',
+        iconName: 'Page',
+        isIconOnly: true,
+        fieldName: 'name',
+        minWidth: 16,
+        maxWidth: 16,
+        onRender: (item: IDocument) => {
+          return (
+            <img
+              src={ item.iconName }
+              className={ 'DetailsListExample-documentIconImage' } />
+          );
+        }
+      },
+      {
+        key: 'column2',
+        name: 'Name',
+        fieldName: 'name',
+        minWidth: 210,
+        maxWidth: 350,
+        isRowHeader: true,
+        isResizable: true,
+        isSorted: true,
+        isSortedDescending: false,
+        onColumnClick: this._onColumnClick,
+        data: 'string',
+        isPadded: true
+      },
+      {
+        key: 'column3',
+        name: 'Date Modified',
+        fieldName: 'dateModifiedValue',
+        minWidth: 70,
+        maxWidth: 90,
+        isResizable: true,
+        onColumnClick: this._onColumnClick,
+        data: 'number',
+        onRender: (item: IDocument) => {
+          return (
+            <span
+              data-is-focusable={ true }>
+              { item.dateModified }
+            </span>
+          );
+        },
+        isPadded: true
+      },
+      {
+        key: 'column4',
+        name: 'Modified By',
+        fieldName: 'modifiedBy',
+        minWidth: 70,
+        maxWidth: 90,
+        isResizable: true,
+        data: 'string',
+        onColumnClick: this._onColumnClick,
+        onRender: (item: IDocument) => {
+          return (
+            <span
+              data-is-focusable={ true }>
+              { item.modifiedBy }
+            </span>
+          );
+        },
+        isPadded: true
+      },
+      {
+        key: 'column5',
+        name: 'File Size',
+        fieldName: 'fileSizeRaw',
+        minWidth: 70,
+        maxWidth: 90,
+        isResizable: true,
+        data: 'number',
+        onColumnClick: this._onColumnClick,
+        onRender: (item: IDocument) => {
+          return (
+            <span
+              data-is-focusable={ true }>
+              { item.fileSize }
+            </span>
+          );
+        }
+      },
+    ];
+
+    this._selection = new Selection({
+      onSelectionChanged: () => this.setState({ selectionDetails: this._getSelectionDetails() })
+    });
+
+    this.state = {
+      items: _items,
+      columns: _columns,
+      selectionDetails: this._getSelectionDetails(),
+      isCompactMode: false
+    };
+  }
+
+  public render() {
+    let { columns, isCompactMode, items, selectionDetails } = this.state;
+
+    return (
+      <div>
+        <Toggle
+          label='Enable Compact Mode'
+          checked={ isCompactMode }
+          onChanged={ checked => this.setState({ isCompactMode: checked }) }
+          onText='Compact'
+          offText='Normal'
+        />
+        <div>{ selectionDetails }</div>
+        <TextField
+          label='Filter by name:'
+          onChanged={ text => this.setState({ items: text ? _items.filter(i => i.name.toLowerCase().indexOf(text) > -1) : _items }) }
+        />
+        <MarqueeSelection selection={ this._selection }>
+          <DetailsList
+            items={ items }
+            compact={ isCompactMode }
+            columns={ columns }
+            setKey='set'
+            layoutMode={ DetailsListLayoutMode.justified }
+            isHeaderVisible={ true }
+            selection={ this._selection }
+            selectionPreservedOnEmptyClick={ true }
+            onItemInvoked={ (item) => alert(`Item invoked: ${item.name}`) }
+          />
+        </MarqueeSelection>
+      </div>
+    );
+  }
+
+  private _randomDate(start: Date, end: Date): { value: number; dateFormatted: string; } {
+    const date: Date = new Date(start.getTime() + Math.random() * (end.getTime() - start.getTime()));
+    const dateData = {
+      value: date.valueOf(),
+      dateFormatted: date.toLocaleDateString()
+    };
+    return dateData;
+  }
+
+  private _randomFileIcon(): { docType: string; url: string; } {
+    const docType: string = fileIcons[Math.floor(Math.random() * fileIcons.length) + 0].name;
+    return {
+      docType,
+      url: `https://static2.sharepointonline.com/files/fabric/assets/brand-icons/document/svg/${docType}_16x1.svg`
+    };
+  }
+
+  private _randomFileSize(): { value: string; rawSize: number; } {
+    const fileSize: number = Math.floor(Math.random() * 100) + 30;
+    return {
+      value: `${fileSize} KB`,
+      rawSize: fileSize
+    };
+  }
+
+  private _getSelectionDetails(): string {
+    let selectionCount = this._selection.getSelectedCount();
+
+    switch (selectionCount) {
+      case 0:
+        return 'No items selected';
+      case 1:
+        return '1 item selected: ' + (this._selection.getSelection()[0] as any).name;
+      default:
+        return `${selectionCount} items selected`;
+    }
+  }
+
+  @autobind
+  private _onColumnClick(ev: React.MouseEvent<HTMLElement>, column: IColumn) {
+    const { columns, items } = this.state;
+    let newItems: IDocument[] = items.slice();
+    let newColumns: IColumn[] = columns.slice();
+    let currColumn: IColumn = newColumns.filter((currCol: IColumn, idx: number) => {
+      return column.key === currCol.key;
+    })[0];
+    newColumns.forEach((newCol: IColumn) => {
+      if (newCol === currColumn) {
+        currColumn.isSortedDescending = !currColumn.isSortedDescending;
+        currColumn.isSorted = true;
+      } else {
+        newCol.isSorted = false;
+        newCol.isSortedDescending = true;
+      }
+    });
+    newItems = this._sortItems(newItems, currColumn.fieldName, currColumn.isSortedDescending);
+    this.setState({
+      columns: newColumns,
+      items: newItems
+    });
+  }
+
+  @autobind
+  private _sortItems(items: IDocument[], sortBy: string, descending = false): IDocument[] {
+    if (descending) {
+      return items.sort((a: IDocument, b: IDocument) => {
+        if (a[sortBy] < b[sortBy]) {
+          return 1;
+        }
+        if (a[sortBy] > b[sortBy]) {
+          return -1;
+        }
+        return 0;
+      });
+    } else {
+      return items.sort((a: IDocument, b: IDocument) => {
+        if (a[sortBy] < b[sortBy]) {
+          return -1;
+        }
+        if (a[sortBy] > b[sortBy]) {
+          return 1;
+        }
+        return 0;
+      });
+    }
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsListExample.scss b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsListExample.scss
index bc475e79808a1..b4eb68cf7326d 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsListExample.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsListExample.scss
@@ -30,4 +30,31 @@
   .DetailsListExample-customHeaderLink {
     margin: 0 8px;
   }
+
+  .DetailsListExample-header--FileIcon {
+    .DetailsListExample-Header-FileTypeIcon {
+      padding: 0;
+      font-size: 16px;
+    }
+  }
+
+  .DetailsListExample-cell--FileIcon {
+    overflow: visible;
+    text-align: center;
+
+    &:before {
+      content: '.';
+      display: inline-block;
+      vertical-align: middle;
+      height: 100%;
+      width: 0px;
+      visibility: hidden;
+    }
+  }
+
+  .DetailsListExample-documentIconImage {
+    vertical-align: middle;
+    max-height: 16px;
+    max-width: 16px;
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.scss b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.scss
index 4615fbd8695a3..515dad1022c3e 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.scss
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.scss
@@ -19,6 +19,7 @@
   box-sizing: border-box;
   border: 1px solid $ms-color-themePrimary;
   pointer-events: none;
+  z-index: $ms-zIndex-front;
 }
 
 .boxFill {

From 670c5aa7286b14cbb9c1782675fee93d8d71e84a Mon Sep 17 00:00:00 2001
From: John Miller <rubixws@gmail.com>
Date: Thu, 13 Jul 2017 15:53:44 -0700
Subject: [PATCH 0259/1641] Adding --production flag to the build script
 (#2207)

* Adding --production flag to the build script

* Reverting newline
---
 apps/fabric-website/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 411788c020cab..c1c2022823d74 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -9,7 +9,7 @@
     "url": "https://github.com/OfficeDev/office-ui-fabric-react"
   },
   "scripts": {
-    "build": "gulp",
+    "build": "gulp --production",
     "clean": "gulp clean",
     "start": "gulp serve"
   },

From 5fef7e125450859c0fd8162221dc0999dbd0b800 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 13 Jul 2017 18:35:18 -0700
Subject: [PATCH 0260/1641] ResizeGroup: Make sure measurements happen
 asynchronously in a RequestAnimationFrame (#2199)

* Do measurements in a RAF request in resizeGroup

* rush change
---
 .../resize-group-raf_2017-07-12-21-28.json    | 11 +++++++++
 .../components/ResizeGroup/ResizeGroup.tsx    | 24 ++++++++++---------
 2 files changed, 24 insertions(+), 11 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/resize-group-raf_2017-07-12-21-28.json

diff --git a/common/changes/office-ui-fabric-react/resize-group-raf_2017-07-12-21-28.json b/common/changes/office-ui-fabric-react/resize-group-raf_2017-07-12-21-28.json
new file mode 100644
index 0000000000000..3c8f6a221bbe0
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/resize-group-raf_2017-07-12-21-28.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ResizeGroup: Do measurements inside requestAnimationFrame",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index dc846de854181..f2141728c2104 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -237,18 +237,20 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
   }
 
   private _afterComponentRendered() {
-    let containerWidth = undefined;
-    if (this.state.measureContainer) {
-      containerWidth = this._root.getBoundingClientRect().width;
-    }
-    let nextState = this._getNextResizeGroupState(this.props,
-      this.state,
-      () => this._measured.getBoundingClientRect().width,
-      containerWidth);
+    this._async.requestAnimationFrame(() => {
+      let containerWidth = undefined;
+      if (this.state.measureContainer) {
+        containerWidth = this._root.getBoundingClientRect().width;
+      }
+      let nextState = this._getNextResizeGroupState(this.props,
+        this.state,
+        () => this._measured.getBoundingClientRect().width,
+        containerWidth);
 
-    if (nextState) {
-      this.setState(nextState);
-    }
+      if (nextState) {
+        this.setState(nextState);
+      }
+    });
   }
 
   private _onResize() {

From 115fbf867fdcabe92419f2735fdf1d6c34241508 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 14 Jul 2017 10:24:03 -0700
Subject: [PATCH 0261/1641] Update rush. (#2213)

---
 package.json | 4 ++--
 rush.json    | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/package.json b/package.json
index 31d99d924a979..2d2155069e67e 100644
--- a/package.json
+++ b/package.json
@@ -23,9 +23,9 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@microsoft/rush": "3.0.7",
+    "@microsoft/rush": "3.0.11",
     "github": "^7.0.0",
     "gulp": "^3.9.1",
     "yargs": "^6.5.0"
   }
-}
+}
\ No newline at end of file
diff --git a/rush.json b/rush.json
index 82d8eb5ad17b6..034b3da289781 100644
--- a/rush.json
+++ b/rush.json
@@ -1,6 +1,6 @@
 {
   "npmVersion": "5.0.3",
-  "rushMinimumVersion": "3.0.7",
+  "rushMinimumVersion": "3.0.11",
   "nodeSupportedVersionRange": ">=6.9.0 <9.0.0",
   "projectFolderMinDepth": 1,
   "projectFolderMaxDepth": 999,

From 41cc73539a15a887d7935e516405135318c4c28b Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 14 Jul 2017 17:34:53 +0000
Subject: [PATCH 0262/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../resize-group-raf_2017-07-12-21-28.json    | 11 -------
 ...eople-picker-styling_2017-06-26-19-15.json | 11 -------
 ...-detailslist-compact_2017-05-16-21-45.json | 10 ------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 31 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 14 ++++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/CHANGELOG.json               |  6 ++++
 packages/styling/CHANGELOG.md                 |  7 ++++-
 packages/styling/package.json                 |  2 +-
 15 files changed, 65 insertions(+), 43 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/resize-group-raf_2017-07-12-21-28.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-people-picker-styling_2017-06-26-19-15.json
 delete mode 100644 common/changes/v-edwliu-detailslist-compact_2017-05-16-21-45.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index c1c2022823d74..1d291e5b83e1d 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.18.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.20.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 4e5cd0e2d4321..f90a03633957f 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.18.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.20.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 062a31e5c1a3a..191a8f63c2b3d 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.18.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.20.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index e03eaf19bcd13..2bdb0b0e948f2 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.18.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.20.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/office-ui-fabric-react/resize-group-raf_2017-07-12-21-28.json b/common/changes/office-ui-fabric-react/resize-group-raf_2017-07-12-21-28.json
deleted file mode 100644
index 3c8f6a221bbe0..0000000000000
--- a/common/changes/office-ui-fabric-react/resize-group-raf_2017-07-12-21-28.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ResizeGroup: Do measurements inside requestAnimationFrame",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-people-picker-styling_2017-06-26-19-15.json b/common/changes/office-ui-fabric-react/v-krbrow-people-picker-styling_2017-06-26-19-15.json
deleted file mode 100644
index ec59aceac5985..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-people-picker-styling_2017-06-26-19-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "PeoplePicker: adding a custom validator prop",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/v-edwliu-detailslist-compact_2017-05-16-21-45.json b/common/changes/v-edwliu-detailslist-compact_2017-05-16-21-45.json
deleted file mode 100644
index 74b1e12621574..0000000000000
--- a/common/changes/v-edwliu-detailslist-compact_2017-05-16-21-45.json
+++ /dev/null
@@ -1,10 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: Add compact mode to component, add column padding, fix styling and Check component sizing",
-      "type": "minor"
-    }
-  ],
-  "email": "v-edwliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 9f59f7241fb4a..7d8c8ead3df7b 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -48,7 +48,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.13.8 <1.0.0",
+    "@uifabric/styling": ">=0.13.9 <1.0.0",
     "@uifabric/utilities": ">=4.7.2 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 615d3b1b14004..26bfa4f2ab477 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.19.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.20.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index d924f6747cda1..977997b099f3d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,37 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.20.0",
+      "tag": "office-ui-fabric-react_v4.20.0",
+      "date": "Fri, 14 Jul 2017 17:34:53 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "5fef7e125450859c0fd8162221dc0999dbd0b800",
+            "comment": "ResizeGroup: Do measurements inside requestAnimationFrame"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "46e69e5a4e0d85230aa326c3aaff330c94aa042e",
+            "comment": "PeoplePicker: adding a custom validator prop"
+          },
+          {
+            "author": "Eddie Liu <leddie24@gmail.com>",
+            "commit": "1200d471c740de9b9a3c8b1e1257048f1cbcfb3f",
+            "comment": "DetailsList: Add compact mode to component, add column padding, fix styling and Check component sizing"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.13.8 <1.0.0` to `>=0.13.9 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.19.0",
       "tag": "office-ui-fabric-react_v4.19.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index c94770d9d86d7..80278d60ab4a4 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,18 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 13 Jul 2017 02:58:02 GMT and should not be manually modified.
+This log was last generated on Fri, 14 Jul 2017 17:34:53 GMT and should not be manually modified.
+
+## 4.20.0
+Fri, 14 Jul 2017 17:34:53 GMT
+
+### Minor changes
+
+- PeoplePicker: adding a custom validator prop
+- DetailsList: Add compact mode to component, add column padding, fix styling and Check component sizing
+
+### Patches
+
+- ResizeGroup: Do measurements inside requestAnimationFrame
 
 ## 4.19.0
 Thu, 13 Jul 2017 02:58:02 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 9bb0bdd628c43..866699fa56f10 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.19.0",
+  "version": "4.20.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.7.2 <5.0.0",
-    "@uifabric/styling": ">=0.13.8 <1.0.0",
+    "@uifabric/styling": ">=0.13.9 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 5a10fae7758e6..27ef16715f380 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.13.9",
+      "tag": "@uifabric/styling_v0.13.9",
+      "date": "Fri, 14 Jul 2017 17:34:53 GMT",
+      "comments": {}
+    },
     {
       "version": "0.13.8",
       "tag": "@uifabric/styling_v0.13.8",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 826720412b01f..3fb516be830f8 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 13 Jul 2017 10:21:52 GMT and should not be manually modified.
+This log was last generated on Fri, 14 Jul 2017 17:34:53 GMT and should not be manually modified.
+
+## 0.13.9
+Fri, 14 Jul 2017 17:34:53 GMT
+
+*Changes not tracked*
 
 ## 0.13.8
 Thu, 13 Jul 2017 10:21:52 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index d0351b0cdd65b..74502684b359c 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.13.8",
+  "version": "0.13.9",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 241b0d25bbbedb8702ac7ae3ec995cbe9767bd54 Mon Sep 17 00:00:00 2001
From: John Lorenz <jcl47@duke.edu>
Date: Fri, 14 Jul 2017 13:27:31 -0700
Subject: [PATCH 0263/1641] Fixing month-only picker (#2200)

* fixing navigation when only month picker is visible

* out of order lines

* undoing a newline change

* adding change file
---
 .../master_2017-07-14-18-37.json              | 11 ++++++++++
 .../src/components/Calendar/Calendar.tsx      | 22 ++++++++++++++-----
 .../src/components/Calendar/CalendarMonth.tsx | 13 +++++++++++
 3 files changed, 41 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/master_2017-07-14-18-37.json

diff --git a/common/changes/office-ui-fabric-react/master_2017-07-14-18-37.json b/common/changes/office-ui-fabric-react/master_2017-07-14-18-37.json
new file mode 100644
index 0000000000000..d8403c5609758
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2017-07-14-18-37.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Last pull request added the option to display the month picker by itself without the day picker, but selecting the month picker was not calling selectDate. This should fix that.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jolore@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index 0aba298f0bae0..cd7faba2eb80a 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -41,6 +41,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     [key: string]: React.ReactInstance;
     root: HTMLElement;
     dayPicker: CalendarDay;
+    monthPicker: CalendarMonth;
   };
 
   private _focusOnUpdate: boolean;
@@ -76,7 +77,12 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
 
   public componentDidUpdate() {
     if (this._focusOnUpdate) {
-      this.refs.dayPicker.focus();
+      // if the day picker is shown, focus on it
+      if (this.refs.dayPicker) {
+        this.refs.dayPicker.focus();
+      } else if (this.refs.monthPicker) {
+        this.refs.monthPicker.focus();
+      }
       this._focusOnUpdate = false;
     }
   }
@@ -118,7 +124,8 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   strings={ strings }
                   onNavigateDate={ this._onNavigateDate }
                   today={ this.props.today }
-                  highlightCurrentMonth={ highlightCurrentMonth } /> }
+                  highlightCurrentMonth={ highlightCurrentMonth }
+                  ref='monthPicker' /> }
 
                 { showGoToToday &&
                   <span
@@ -153,12 +160,17 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
 
   @autobind
   private _onNavigateDate(date: Date, focusOnNavigatedDay: boolean) {
-    this._navigateDay(date);
-    this._focusOnUpdate = focusOnNavigatedDay;
+    if (this.props.isDayPickerVisible) {
+      this._navigateDay(date);
+      this._focusOnUpdate = focusOnNavigatedDay;
+    } else {
+      // if only the month picker is shown, select the chosen month
+      this._onSelectDate(date);
+    }
   }
 
   @autobind
-  private _onSelectDate(date: Date, selectedDateRangeArray: Date[]) {
+  private _onSelectDate(date: Date, selectedDateRangeArray?: Date[]) {
     let { onSelectDate } = this.props;
 
     this.setState({
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
index 417df1cf8ce5d..c89d49711cdb0 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
@@ -22,6 +22,11 @@ export interface ICalendarMonthProps extends React.Props<CalendarMonth> {
 }
 
 export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
+  public refs: {
+    [key: string]: React.ReactInstance;
+    navigatedMonth: HTMLElement;
+  };
+
   private _selectMonthCallbacks: (() => void)[];
 
   public constructor(props: ICalendarMonthProps) {
@@ -87,6 +92,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
                 onClick={ this._selectMonthCallbacks[index] }
                 aria-label={ setMonth(navigatedDate, index).toLocaleString([], { month: 'long', year: 'numeric' }) }
                 data-is-focusable={ true }
+                ref={ navigatedDate.getMonth() === index ? 'navigatedMonth' : null }
               >
                 { month }
               </span>
@@ -97,6 +103,13 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
     );
   }
 
+  public focus() {
+    if (this.refs.navigatedMonth) {
+      this.refs.navigatedMonth.tabIndex = 0;
+      this.refs.navigatedMonth.focus();
+    }
+  }
+
   private isCurrentMonth(month: number, year: number, today: Date) {
     return today.getFullYear() === year && today.getMonth() === month;
   }

From 492c1840d6b7ae8ee5487d083eb3ee1c73ad4874 Mon Sep 17 00:00:00 2001
From: Ryan Delaney <rrdelaney@outlook.com>
Date: Fri, 14 Jul 2017 14:53:09 -0700
Subject: [PATCH 0264/1641] Allow rendering of deeply nested links (#2138)

* Allow rendering of deeply nested links

* Allow rendering of deeply nested links

* Add change file

* Update for RTL

* Use _indentationSize instead of 14
---
 .../master_2017-07-06-01-18.json                      | 11 +++++++++++
 .../office-ui-fabric-react/src/components/Nav/Nav.tsx |  5 ++++-
 2 files changed, 15 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/master_2017-07-06-01-18.json

diff --git a/common/changes/office-ui-fabric-react/master_2017-07-06-01-18.json b/common/changes/office-ui-fabric-react/master_2017-07-06-01-18.json
new file mode 100644
index 0000000000000..0939a88028e80
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2017-07-06-01-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Allow deeply nested links to render in Nav",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "rydelan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
index 0759afdb7cb61..33494cfdd98f4 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
@@ -135,6 +135,8 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
 
   private _renderCompositeLink(link: INavLink, linkIndex: number, nestingLevel: number): React.ReactElement<{}> {
     const isLinkSelected: boolean = this._isLinkSelected(link);
+    const isRtl: boolean = getRTL();
+    const paddingBefore: string = `${_indentationSize * nestingLevel}px`;
 
     return (
       <div key={ link.key || linkIndex }
@@ -144,8 +146,9 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
           [styles.compositeLinkIsExpanded]: link.isExpanded,
           [styles.compositeLinkIsSelected]: isLinkSelected
         }) }>
-        { (nestingLevel === 0 && link.links && link.links.length > 0 ?
+        { (link.links && link.links.length > 0 ?
           <button
+            style={ { [isRtl ? 'marginRight' : 'marginLeft']: paddingBefore } }
             className={ css('ms-Nav-chevronButton ms-Nav-chevronButton--link', styles.chevronButton, styles.chevronButtonLink) }
             onClick={ this._onLinkExpandClicked.bind(this, link) }
             aria-label={ this.props.expandButtonAriaLabel }

From 21c744979934285a8759d93ce8cd8748a16053a5 Mon Sep 17 00:00:00 2001
From: ycoco <ycocococo6256@gmail.com>
Date: Fri, 14 Jul 2017 15:13:12 -0700
Subject: [PATCH 0265/1641] Coco/dropdownon blur (#2141)

* pr

* onblur dropdown

* onblur for dropdown

* rush change

* resolve code review suggestions

* fix comments

* fix comment

* Update coco-dropdownonBlur_2017-07-05-22-15.json
---
 .../coco-dropdownonBlur_2017-07-05-22-15.json | 11 +++++
 .../src/components/ComboBox/ComboBox.Props.ts |  2 +-
 .../src/components/ComboBox/ComboBox.test.tsx |  8 ++--
 .../src/components/ComboBox/ComboBox.tsx      | 18 ++++----
 .../ComboBox/ComboBoxPage.visualtest.tsx      |  2 +-
 .../examples/ComboBox.Basic.Example.tsx       | 12 ++---
 .../src/components/Dropdown/Dropdown.Props.ts |  2 +-
 .../src/components/Dropdown/Dropdown.tsx      | 45 ++++++++++++++++---
 .../SelectableDroppableText.Props.ts          |  2 +-
 9 files changed, 72 insertions(+), 30 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/coco-dropdownonBlur_2017-07-05-22-15.json

diff --git a/common/changes/office-ui-fabric-react/coco-dropdownonBlur_2017-07-05-22-15.json b/common/changes/office-ui-fabric-react/coco-dropdownonBlur_2017-07-05-22-15.json
new file mode 100644
index 0000000000000..29de35d9a0f25
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/coco-dropdownonBlur_2017-07-05-22-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: props have been adjusted to inherit from HTMLAttributes to allow fo props like onBlur to be mixed in. Note that this has forced the `autoComplete` prop to be changed to a string.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "t-yikche@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
index e3e642e4d2f46..57afc6a5dd0ee 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
@@ -48,7 +48,7 @@ export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox>
    * Whether the ComboBox auto completes. As the user is inputing text, it will be suggested potential matches from the list of items. If
    * the combo box is expanded, this will also scroll to the suggested item, and give it a selected style. Defaults to false.
    */
-  autoComplete?: boolean;
+  autoComplete?: string;
 
   /**
    * Value to show in the input, does not have to map to a combobox option
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
index f57ea34b59ea8..73241b5fdb514 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
@@ -136,7 +136,7 @@ describe('ComboBox', () => {
         label='testgroup'
         defaultSelectedKey='1'
         options={ DEFAULT_OPTIONS2 }
-        autoComplete={ true }
+        autoComplete='on'
         allowFreeform={ true }
       />);
     comboBoxRoot = wrapper.find('.ms-ComboBox');
@@ -154,7 +154,7 @@ describe('ComboBox', () => {
         label='testgroup'
         defaultSelectedKey='1'
         options={ DEFAULT_OPTIONS2 }
-        autoComplete={ true }
+        autoComplete='on'
         allowFreeform={ false }
       />);
     comboBoxRoot = wrapper.find('.ms-ComboBox');
@@ -172,7 +172,7 @@ describe('ComboBox', () => {
         label='testgroup'
         defaultSelectedKey='1'
         options={ DEFAULT_OPTIONS2 }
-        autoComplete={ false }
+        autoComplete='off'
         allowFreeform={ true }
       />);
     comboBoxRoot = wrapper.find('.ms-ComboBox');
@@ -190,7 +190,7 @@ describe('ComboBox', () => {
         label='testgroup'
         defaultSelectedKey='1'
         options={ DEFAULT_OPTIONS2 }
-        autoComplete={ false }
+        autoComplete='off'
         allowFreeform={ false }
       />);
     comboBoxRoot = wrapper.find('.ms-ComboBox');
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 51aa4922ba3cd..d4bf86790dc92 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -60,7 +60,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   public static defaultProps: IComboBoxProps = {
     options: [],
     allowFreeform: false,
-    autoComplete: true,
+    autoComplete: 'on',
     buttonIconProps: { iconName: 'ChevronDown' }
   };
 
@@ -238,7 +238,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
             onClick={ allowFreeform ? this.focus : this._onComboBoxClick }
             onInputValueChange={ this._onInputChange }
             aria-expanded={ isOpen }
-            aria-autocomplete={ (!disabled && autoComplete) }
+            aria-autocomplete={ (!disabled && autoComplete === 'on') }
             role='combobox'
             aria-readonly={ ((allowFreeform || disabled) ? null : 'true') }
             readOnly={ disabled || !allowFreeform }
@@ -352,7 +352,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       // If we are allowing freeform and autocomplete is also true
       // and we've got a pending value that matches an option, remember
       // the matched option's index
-      if (autoComplete && this._indexWithinBounds(currentOptions, currentPendingValueValidIndex)) {
+      if (autoComplete === 'on' && this._indexWithinBounds(currentOptions, currentPendingValueValidIndex)) {
         index = currentPendingValueValidIndex;
       }
 
@@ -370,7 +370,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         // If autoComplete is on, return the
         // raw pending value, otherwise remember
         // the matched option's index
-        if (autoComplete) {
+        if (autoComplete === 'on') {
           return currentPendingValue;
         }
 
@@ -433,7 +433,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     let newCurrentPendingValueValidIndex = -1;
 
     // If autoComplete is on, attempt to find a match from the available options
-    if (this.props.autoComplete) {
+    if (this.props.autoComplete === 'on') {
 
       // If autoComplete is on, attempt to find a match where the text of an option starts with the updated value
       let items = currentOptions.map((item, index) => { return { ...item, index }; }).filter((option) => option.itemType !== SelectableOptionMenuItemType.Header && option.itemType !== SelectableOptionMenuItemType.Divider).filter((option) => option.text.toLocaleLowerCase().indexOf(updatedValue) === 0);
@@ -472,7 +472,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       selectedIndex
     } = this.state;
 
-    if (this.props.autoComplete) {
+    if (this.props.autoComplete === 'on') {
 
       // If autoComplete is on while allow freeform is off,
       // we will remember the keypresses and build up a string to attempt to match
@@ -1099,7 +1099,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
       case KeyCodes.space:
         // event handled in _onComboBoxKeyUp
-        if (!allowFreeform && !autoComplete) {
+        if (!allowFreeform && autoComplete === 'off') {
           break;
         }
 
@@ -1119,7 +1119,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         // If we are not allowing freeform and
         // allowing autoComplete, handle the input here
         // since we have marked the input as readonly
-        if (!allowFreeform && autoComplete) {
+        if (!allowFreeform && autoComplete === 'on') {
           this._onInputChange(String.fromCharCode(ev.which));
           break;
         }
@@ -1154,7 +1154,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         // If we are not allowing freeform and are not autoComplete
         // make space expand/collapse the comboBox
         // and allow the event to propagate
-        if (!allowFreeform && !autoComplete) {
+        if (!allowFreeform && autoComplete === 'off') {
           this.setState({
             isOpen: !this.state.isOpen
           });
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.visualtest.tsx
index b7e35f4416d95..c95f82094d94f 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.visualtest.tsx
@@ -11,7 +11,7 @@ export default class ComboBoxVPage extends React.Component<any, any> {
         id='Basicdrop1'
         ariaLabel='Basic ComboBox example'
         allowFreeform={ true }
-        autoComplete={ true }
+        autoComplete='on'
         options={
           [
             { key: 'A', text: 'Option a' },
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
index 2e1ad7ccb7416..a41d39c44b1d5 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
@@ -55,7 +55,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
           id='Basicdrop1'
           ariaLabel='Basic ComboBox example'
           allowFreeform={ true }
-          autoComplete={ true }
+          autoComplete='on'
           options={ this._testOptions }
           onRenderOption={ this._onRenderFontOption }
         />
@@ -66,7 +66,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
           id='Basicdrop2'
           ariaLabel='Basic ComboBox example'
           allowFreeform={ true }
-          autoComplete={ false }
+          autoComplete='off'
           options={ this._testOptions }
           onRenderOption={ this._onRenderFontOption }
         />
@@ -77,7 +77,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
           id='Basicdrop3'
           ariaLabel='Basic ComboBox example'
           allowFreeform={ false }
-          autoComplete={ true }
+          autoComplete='on'
           options={ this._testOptions }
           onRenderOption={ this._onRenderFontOption }
         />
@@ -88,7 +88,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
           id='Basicdrop4'
           ariaLabel='Basic ComboBox example'
           allowFreeform={ false }
-          autoComplete={ false }
+          autoComplete='off'
           options={ this._testOptions }
           onRenderOption={ this._onRenderFontOption }
         />
@@ -125,7 +125,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
             id='Basicdrop5'
             ariaLabel='Basic ComboBox example'
             allowFreeform={ true }
-            autoComplete={ true }
+            autoComplete='on'
             options={ options }
             onChanged={ this._onChanged }
             onResolveOptions={ this._getOptions }
@@ -139,7 +139,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
             id='Basicdrop5'
             ariaLabel='Basic ComboBox example'
             allowFreeform={ true }
-            autoComplete={ true }
+            autoComplete='on'
             options={ options }
             onChanged={ this._onChanged }
             onResolveOptions={ this._getOptions }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
index 11c2d20410deb..962f1f2ad6c82 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
@@ -9,7 +9,7 @@ export interface IDropdown {
   focus: () => void;
 }
 
-export interface IDropdownProps extends ISelectableDroppableTextProps<IDropdown> {
+export interface IDropdownProps extends ISelectableDroppableTextProps<HTMLDivElement> {
   /**
    * Input placeholder text. Displayed until option is selected.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 5f74b140aaf53..0a033bca84a36 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -15,7 +15,9 @@ import {
   autobind,
   css,
   findIndex,
-  getId
+  getId,
+  getNativeProps,
+  divProperties
 } from '../../Utilities';
 import { SelectableOptionMenuItemType } from '../../utilities/selectableOption/SelectableOption.Props';
 import * as stylesImport from './Dropdown.scss';
@@ -112,6 +114,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     } = this.props;
     let { isOpen, selectedIndex } = this.state;
     let selectedOption = options[selectedIndex];
+    let divProps = getNativeProps(this.props, divProperties);
 
     // Remove this deprecation workaround at 1.0.0
     if (isDisabled !== undefined) {
@@ -133,9 +136,6 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
             'is-required ': required,
           }) }
           tabIndex={ disabled ? -1 : 0 }
-          onKeyDown={ this._onDropdownKeyDown }
-          onKeyUp={ this._onDropdownKeyUp }
-          onClick={ this._onDropdownClick }
           aria-expanded={ isOpen ? 'true' : 'false' }
           role='combobox'
           aria-live={ disabled || isOpen ? 'off' : 'assertive' }
@@ -144,6 +144,11 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
           aria-activedescendant={ isOpen && selectedIndex >= 0 ? (this._id + '-list' + selectedIndex) : null }
           aria-disabled={ disabled }
           aria-owns={ isOpen ? id + '-list' : null }
+          { ...divProps }
+          onBlur={ this._onDropdownBlur }
+          onKeyDown={ this._onDropdownKeyDown }
+          onKeyUp={ this._onDropdownKeyUp }
+          onClick={ this._onDropdownClick }
         >
           <span
             id={ id + '-option' }
@@ -420,7 +425,21 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   @autobind
-  private _onDropdownKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+  private _onDropdownBlur(ev: React.FocusEvent<HTMLDivElement>) {
+    if (this.state.isOpen) {
+      // Do not onBlur when the callout is opened
+      return;
+    }
+  }
+
+  @autobind
+  private _onDropdownKeyDown(ev: React.KeyboardEvent<HTMLDivElement>) {
+    if (this.props.onKeyDown) {
+      this.props.onKeyDown(ev);
+      if (ev.preventDefault) {
+        return;
+      }
+    }
     let newIndex: number;
     const { selectedIndex } = this.state;
 
@@ -476,7 +495,13 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   @autobind
-  private _onDropdownKeyUp(ev: React.KeyboardEvent<HTMLElement>) {
+  private _onDropdownKeyUp(ev: React.KeyboardEvent<HTMLDivElement>) {
+    if (this.props.onKeyUp) {
+      this.props.onKeyUp(ev);
+      if (ev.preventDefault) {
+        return;
+      }
+    }
     switch (ev.which) {
       case KeyCodes.space:
         this.setState({
@@ -521,7 +546,13 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   @autobind
-  private _onDropdownClick() {
+  private _onDropdownClick(ev: React.MouseEvent<HTMLDivElement>) {
+    if (this.props.onClick) {
+      this.props.onClick(ev);
+      if (ev.preventDefault) {
+        return;
+      }
+    }
     let { disabled, isDisabled } = this.props;
     let { isOpen } = this.state;
 
diff --git a/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.Props.ts b/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.Props.ts
index 633a04cd68d90..bb2883337c923 100644
--- a/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.Props.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.Props.ts
@@ -3,7 +3,7 @@ import { IRenderFunction } from '../../Utilities';
 import { ICalloutProps } from '../../Callout';
 import { ISelectableOption } from '../../utilities/selectableOption/SelectableOption.Props';
 
-export interface ISelectableDroppableTextProps<T> extends React.Props<T> {
+export interface ISelectableDroppableTextProps<T> extends React.HTMLAttributes<T> {
   /**
   * Optional callback to access the ISelectableDroppableText interface. Use this instead of ref for accessing
   * the public methods and properties of the component.

From adaee4e1abe3a0ee70a4bdc01804aaca57f1d0c4 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Fri, 14 Jul 2017 15:15:46 -0700
Subject: [PATCH 0266/1641] Jspurlin/ combo box keyboard scolling fix (#2209)

* Fix issue where the currently pending element isn't scrolled into view (e.g. when keyboarding through the options)

* add change file

* update the comment to start with the component name
---
 ..._ComboBoxKeyboardScollingFix_2017-07-13-23-16.json | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.tsx              | 11 +++++++----
 2 files changed, 18 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-_ComboBoxKeyboardScollingFix_2017-07-13-23-16.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-_ComboBoxKeyboardScollingFix_2017-07-13-23-16.json b/common/changes/office-ui-fabric-react/jspurlin-_ComboBoxKeyboardScollingFix_2017-07-13-23-16.json
new file mode 100644
index 0000000000000..25c9e88263cba
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-_ComboBoxKeyboardScollingFix_2017-07-13-23-16.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Fix a keyboard scrolling issue where the pending option would not be scrolled into view",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index d4bf86790dc92..95b4ea94ad1e2 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -151,12 +151,15 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     let {
       isOpen,
       focused,
-      selectedIndex
+      selectedIndex,
+      currentPendingValueValidIndex
     } = this.state;
 
-    // If we are newly open, make sure the currently
-    // selected option is scrolled into view
-    if (!prevState.isOpen && isOpen) {
+    // If we are newly open or are open and the pending valid index changed,
+    // make sure the currently selected/pending option is scrolled into view
+    if (isOpen &&
+      (!prevState.isOpen ||
+        prevState.currentPendingValueValidIndex !== currentPendingValueValidIndex)) {
       this._scrollIntoView();
     }
 

From aad11c124b5c4715ef39dc2aa7ac64b7b58e543f Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 17 Jul 2017 10:22:39 +0000
Subject: [PATCH 0267/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 .../coco-dropdownonBlur_2017-07-05-22-15.json | 11 ------
 ...xKeyboardScollingFix_2017-07-13-23-16.json | 11 ------
 .../master_2017-07-06-01-18.json              | 11 ------
 .../master_2017-07-14-18-37.json              | 11 ------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 36 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 +++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/CHANGELOG.json               |  6 ++++
 packages/styling/CHANGELOG.md                 |  7 +++-
 packages/styling/package.json                 |  2 +-
 13 files changed, 68 insertions(+), 52 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/coco-dropdownonBlur_2017-07-05-22-15.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-_ComboBoxKeyboardScollingFix_2017-07-13-23-16.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2017-07-06-01-18.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2017-07-14-18-37.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 1d291e5b83e1d..9e063ffb60524 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.20.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.21.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/coco-dropdownonBlur_2017-07-05-22-15.json b/common/changes/office-ui-fabric-react/coco-dropdownonBlur_2017-07-05-22-15.json
deleted file mode 100644
index 29de35d9a0f25..0000000000000
--- a/common/changes/office-ui-fabric-react/coco-dropdownonBlur_2017-07-05-22-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: props have been adjusted to inherit from HTMLAttributes to allow fo props like onBlur to be mixed in. Note that this has forced the `autoComplete` prop to be changed to a string.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "t-yikche@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/jspurlin-_ComboBoxKeyboardScollingFix_2017-07-13-23-16.json b/common/changes/office-ui-fabric-react/jspurlin-_ComboBoxKeyboardScollingFix_2017-07-13-23-16.json
deleted file mode 100644
index 25c9e88263cba..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-_ComboBoxKeyboardScollingFix_2017-07-13-23-16.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Fix a keyboard scrolling issue where the pending option would not be scrolled into view",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2017-07-06-01-18.json b/common/changes/office-ui-fabric-react/master_2017-07-06-01-18.json
deleted file mode 100644
index 0939a88028e80..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2017-07-06-01-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Allow deeply nested links to render in Nav",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "rydelan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2017-07-14-18-37.json b/common/changes/office-ui-fabric-react/master_2017-07-14-18-37.json
deleted file mode 100644
index d8403c5609758..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2017-07-14-18-37.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Last pull request added the option to display the month picker by itself without the day picker, but selecting the month picker was not calling selectDate. This should fix that.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jolore@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 7d8c8ead3df7b..bb8a5c4f8cebd 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -48,7 +48,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.13.9 <1.0.0",
+    "@uifabric/styling": ">=0.13.10 <1.0.0",
     "@uifabric/utilities": ">=4.7.2 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 26bfa4f2ab477..78f6ed103be34 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.20.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.21.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 977997b099f3d..f6e20768b7c6f 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,42 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.21.0",
+      "tag": "office-ui-fabric-react_v4.21.0",
+      "date": "Mon, 17 Jul 2017 10:22:38 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "ycoco <ycocococo6256@gmail.com>",
+            "commit": "21c744979934285a8759d93ce8cd8748a16053a5",
+            "comment": "ComboBox: props have been adjusted to inherit from HTMLAttributes to allow fo props like onBlur to be mixed in. Note that this has forced the `autoComplete` prop to be changed to a string."
+          }
+        ],
+        "patch": [
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "adaee4e1abe3a0ee70a4bdc01804aaca57f1d0c4",
+            "comment": "ComboBox: Fix a keyboard scrolling issue where the pending option would not be scrolled into view"
+          },
+          {
+            "author": "Ryan Delaney <rrdelaney@outlook.com>",
+            "commit": "492c1840d6b7ae8ee5487d083eb3ee1c73ad4874",
+            "comment": "Allow deeply nested links to render in Nav"
+          },
+          {
+            "author": "John Lorenz <jcl47@duke.edu>",
+            "commit": "241b0d25bbbedb8702ac7ae3ec995cbe9767bd54",
+            "comment": "Last pull request added the option to display the month picker by itself without the day picker, but selecting the month picker was not calling selectDate. This should fix that."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.13.9 <1.0.0` to `>=0.13.10 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.20.0",
       "tag": "office-ui-fabric-react_v4.20.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 80278d60ab4a4..3fa5c0fd410a3 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 14 Jul 2017 17:34:53 GMT and should not be manually modified.
+This log was last generated on Mon, 17 Jul 2017 10:22:38 GMT and should not be manually modified.
+
+## 4.21.0
+Mon, 17 Jul 2017 10:22:38 GMT
+
+### Minor changes
+
+- ComboBox: props have been adjusted to inherit from HTMLAttributes to allow fo props like onBlur to be mixed in. Note that this has forced the `autoComplete` prop to be changed to a string.
+
+### Patches
+
+- ComboBox: Fix a keyboard scrolling issue where the pending option would not be scrolled into view
+- Allow deeply nested links to render in Nav
+- Last pull request added the option to display the month picker by itself without the day picker, but selecting the month picker was not calling selectDate. This should fix that.
 
 ## 4.20.0
 Fri, 14 Jul 2017 17:34:53 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 866699fa56f10..7f4b70215da4f 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.20.0",
+  "version": "4.21.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.7.2 <5.0.0",
-    "@uifabric/styling": ">=0.13.9 <1.0.0",
+    "@uifabric/styling": ">=0.13.10 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 27ef16715f380..c5ca4f32b3405 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.13.10",
+      "tag": "@uifabric/styling_v0.13.10",
+      "date": "Mon, 17 Jul 2017 10:22:38 GMT",
+      "comments": {}
+    },
     {
       "version": "0.13.9",
       "tag": "@uifabric/styling_v0.13.9",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 3fb516be830f8..cf2007fe0dca9 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 14 Jul 2017 17:34:53 GMT and should not be manually modified.
+This log was last generated on Mon, 17 Jul 2017 10:22:38 GMT and should not be manually modified.
+
+## 0.13.10
+Mon, 17 Jul 2017 10:22:38 GMT
+
+*Changes not tracked*
 
 ## 0.13.9
 Fri, 14 Jul 2017 17:34:53 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 74502684b359c..6651bd6dccb93 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.13.9",
+  "version": "0.13.10",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 267ed2d0b9466d29c173982bcfc897c92ef72525 Mon Sep 17 00:00:00 2001
From: Joe Martella <martellaj@live.com>
Date: Mon, 17 Jul 2017 10:57:06 -0700
Subject: [PATCH 0268/1641] Fixing onBlur prevents onSuggestionClick (with
 change file) (#2222)

* fixed onBlur prevents onSuggestionClick #2187

* removing onBlur from BasePickerListBelow #2187

* fixing selecting on escape #2187

* Adds change file

* Update master_2017-07-17-17-45.json
---
 .../master_2017-07-17-17-45.json              | 11 +++++++++
 .../src/components/pickers/BasePicker.tsx     | 24 +++++++------------
 2 files changed, 19 insertions(+), 16 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/master_2017-07-17-17-45.json

diff --git a/common/changes/office-ui-fabric-react/master_2017-07-17-17-45.json b/common/changes/office-ui-fabric-react/master_2017-07-17-17-45.json
new file mode 100644
index 0000000000000..345ab175299a7
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2017-07-17-17-45.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "BasePicker: Removes onBlur to fix onSuggestionClick prevention and adds onBlur functionality to dismissSuggestions.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joem@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 441853d224cbd..c81dbf1164a3b 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -81,6 +81,10 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   @autobind
   public dismissSuggestions() {
+    // Select the first suggestion if one is available when user leaves.
+    if (this.suggestionStore.hasSelectedSuggestion() && this.state.suggestionsVisible) {
+      this.addItemByIndex(0);
+    }
     this.setState({ suggestionsVisible: false });
   }
 
@@ -105,8 +109,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
         className={ css(
           'ms-BasePicker',
           className ? className : '') }
-        onKeyDown={ this.onKeyDown }
-        onBlur={ this.onBlur } >
+        onKeyDown={ this.onKeyDown } >
         <FocusZone
           ref={ this._resolveRef('focusZone') }
           direction={ FocusZoneDirection.bidirectional }
@@ -303,17 +306,6 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     }
   }
 
-  /**
-   * Select the first suggestion if one is available when user leaves
-   * the input area.
-   */
-  @autobind
-  protected onBlur() {
-    if (this.suggestionStore.hasSelectedSuggestion()) {
-      this.addItemByIndex(0);
-    }
-  }
-
   @autobind
   protected onInputChange(value: string) {
     this.updateValue(value);
@@ -326,6 +318,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   @autobind
   protected onSuggestionClick(ev: React.MouseEvent<HTMLElement>, item: any, index: number) {
     this.addItemByIndex(index);
+    this.setState({ suggestionsVisible: false });
   }
 
   @autobind
@@ -360,7 +353,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     switch (ev.which) {
       case KeyCodes.escape:
         if (this.state.suggestionsVisible) {
-          this.dismissSuggestions();
+          this.setState({ suggestionsVisible: false });
           ev.preventDefault();
           ev.stopPropagation();
         }
@@ -548,8 +541,7 @@ export class BasePickerListBelow<T, P extends IBasePickerProps<T>> extends BaseP
       <div>
         <div ref={ this._resolveRef('root') }
           className={ css('ms-BasePicker', className ? className : '') }
-          onKeyDown={ this.onKeyDown }
-          onBlur={ this.onBlur } >
+          onKeyDown={ this.onKeyDown } >
           <SelectionZone selection={ this.selection }
             selectionMode={ SelectionMode.multiple }>
             <div className={ css('ms-BasePicker-text', styles.pickerText) }>

From b93fc355feb78400a4b18801d6e5c67fff188430 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 17 Jul 2017 18:38:01 +0000
Subject: [PATCH 0269/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../master_2017-07-17-17-45.json              | 11 -----------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++++-
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/CHANGELOG.json               |  6 ++++++
 packages/styling/CHANGELOG.md                 |  7 ++++++-
 packages/styling/package.json                 |  2 +-
 13 files changed, 48 insertions(+), 22 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/master_2017-07-17-17-45.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 9e063ffb60524..e2c56977267a6 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.21.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.21.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index f90a03633957f..3abce8e744b54 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.20.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.21.1 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 191a8f63c2b3d..cead0a1125f84 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.20.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.21.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 2bdb0b0e948f2..e8d3d094b8341 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.20.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.21.1 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/office-ui-fabric-react/master_2017-07-17-17-45.json b/common/changes/office-ui-fabric-react/master_2017-07-17-17-45.json
deleted file mode 100644
index 345ab175299a7..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2017-07-17-17-45.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "BasePicker: Removes onBlur to fix onSuggestionClick prevention and adds onBlur functionality to dismissSuggestions.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joem@microsoft.com"
-}
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index bb8a5c4f8cebd..61b456532d073 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -48,7 +48,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.13.10 <1.0.0",
+    "@uifabric/styling": ">=0.13.11 <1.0.0",
     "@uifabric/utilities": ">=4.7.2 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 78f6ed103be34..40fdcc1bd2d4c 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.21.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.21.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index f6e20768b7c6f..ea3cc019b9fb9 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.21.1",
+      "tag": "office-ui-fabric-react_v4.21.1",
+      "date": "Mon, 17 Jul 2017 18:38:01 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Joe Martella <martellaj@live.com>",
+            "commit": "267ed2d0b9466d29c173982bcfc897c92ef72525",
+            "comment": "BasePicker: Removes onBlur to fix onSuggestionClick prevention and adds onBlur functionality to dismissSuggestions."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.13.10 <1.0.0` to `>=0.13.11 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.21.0",
       "tag": "office-ui-fabric-react_v4.21.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 3fa5c0fd410a3..d4df1ec8ad55d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 17 Jul 2017 10:22:38 GMT and should not be manually modified.
+This log was last generated on Mon, 17 Jul 2017 18:38:01 GMT and should not be manually modified.
+
+## 4.21.1
+Mon, 17 Jul 2017 18:38:01 GMT
+
+### Patches
+
+- BasePicker: Removes onBlur to fix onSuggestionClick prevention and adds onBlur functionality to dismissSuggestions.
 
 ## 4.21.0
 Mon, 17 Jul 2017 10:22:38 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 7f4b70215da4f..d466faef72a46 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.21.0",
+  "version": "4.21.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.7.2 <5.0.0",
-    "@uifabric/styling": ">=0.13.10 <1.0.0",
+    "@uifabric/styling": ">=0.13.11 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index c5ca4f32b3405..49b0b4968bb1e 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.13.11",
+      "tag": "@uifabric/styling_v0.13.11",
+      "date": "Mon, 17 Jul 2017 18:38:01 GMT",
+      "comments": {}
+    },
     {
       "version": "0.13.10",
       "tag": "@uifabric/styling_v0.13.10",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index cf2007fe0dca9..976fbe762be51 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Mon, 17 Jul 2017 10:22:38 GMT and should not be manually modified.
+This log was last generated on Mon, 17 Jul 2017 18:38:01 GMT and should not be manually modified.
+
+## 0.13.11
+Mon, 17 Jul 2017 18:38:01 GMT
+
+*Changes not tracked*
 
 ## 0.13.10
 Mon, 17 Jul 2017 10:22:38 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 6651bd6dccb93..753ec28dda5e0 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.13.10",
+  "version": "0.13.11",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 074fabb6f0ffd52598947d9dda563d4dd8113ee7 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Mon, 17 Jul 2017 15:18:43 -0700
Subject: [PATCH 0270/1641] Start fixing errors when enabling
 'strictNullChecks' in office-ui-fabric-react (#2210)

* Fix runvisualtests

* Fix SelectionZone.

* Fix Selection.Basic.Example.ts

* Fixes

* FIx tslint error

* Fix withViewPort

* Fix selection.ts

* Fix dragdrophelper

* Add assertNever to utilities package

* Fix DateMath

* Fix color.ts

* Fix positioning tests

* Fix toggle and basepicker

* Fix textfield

* Fix swatch color picker

* Fix combo box

* Fix people picker examples

* Fixes in suggestions

* Picker

* Fix SuggestionItemDefault.

* Fix spinbutton

* Fix slider

* Fix Pivot.

* Fix persona

* Fix List.Scrolling.Example

* Fix marqueeSelection

* Fix List.tsx

* Rush change

* Add options to combo box test

* fix build

* Update assertNever.ts

* Update SpinButton.tsx
---
 .../oufr-strict-null_2017-07-14-01-46.json    | 11 ++++
 .../oufr-strict-null_2017-07-14-01-46.json    | 11 ++++
 .../oufr-strict-null_2017-07-14-01-46.json    | 11 ++++
 .../oufr-strict-null_2017-07-14-01-46.json    | 11 ++++
 .../oufr-strict-null_2017-07-14-01-46.json    | 11 ++++
 .../src/components/ComboBox/ComboBox.Props.ts |  2 +-
 .../src/components/ComboBox/ComboBox.test.tsx |  1 +
 .../src/components/ComboBox/ComboBox.tsx      | 49 ++++++++-------
 .../src/components/List/List.tsx              | 62 +++++++++----------
 .../List/examples/List.Scrolling.Example.tsx  |  4 +-
 .../MarqueeSelection/MarqueeSelection.tsx     | 45 +++++++-------
 .../src/components/Persona/Persona.tsx        | 10 +--
 .../src/components/Pivot/Pivot.tsx            | 18 +++---
 .../src/components/Slider/Slider.Props.ts     |  2 +-
 .../src/components/Slider/Slider.tsx          | 36 +++++------
 .../src/components/SpinButton/SpinButton.tsx  | 30 ++++-----
 .../SwatchColorPicker.test.tsx                | 22 +++----
 .../SwatchColorPicker/SwatchColorPicker.tsx   | 31 ++++++----
 .../components/TextField/TextField.Props.ts   |  6 +-
 .../src/components/TextField/TextField.tsx    | 22 +++----
 .../src/components/Toggle/Toggle.test.tsx     | 14 ++---
 .../pickers/AutoFill/BaseAutoFill.Props.ts    |  2 +-
 .../src/components/pickers/BasePicker.tsx     | 11 ++--
 .../SuggestionItemDefault.tsx                 |  4 +-
 .../examples/PeoplePicker.Types.Example.tsx   | 15 ++---
 .../pickers/Suggestions/Suggestions.tsx       | 11 ++--
 .../examples/Picker.CustomResult.Example.tsx  | 31 ++++++----
 .../src/utilities/color/colors.ts             | 18 +++---
 .../src/utilities/dateMath/DateMath.ts        |  5 +-
 .../src/utilities/decorators/withViewport.tsx |  6 +-
 .../src/utilities/dragdrop/DragDropHelper.tsx | 31 +++++-----
 .../src/utilities/positioning.test.ts         |  8 +--
 .../src/utilities/positioning.ts              | 19 +++---
 .../src/utilities/selection/Selection.ts      |  6 +-
 .../selection/SelectionZone.test.tsx          | 20 +++---
 .../src/utilities/selection/SelectionZone.tsx | 20 +++---
 .../examples/Selection.Basic.Example.tsx      | 10 ++-
 .../src/visualtest/RunVisualTest.ts           | 26 ++++----
 packages/utilities/api/utilities.api.ts       |  2 +
 packages/utilities/src/assertNever.ts         |  8 +++
 packages/utilities/src/index.ts               |  1 +
 41 files changed, 383 insertions(+), 280 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/oufr-strict-null_2017-07-14-01-46.json
 create mode 100644 common/changes/@uifabric/fabric-website/oufr-strict-null_2017-07-14-01-46.json
 create mode 100644 common/changes/@uifabric/styling/oufr-strict-null_2017-07-14-01-46.json
 create mode 100644 common/changes/@uifabric/utilities/oufr-strict-null_2017-07-14-01-46.json
 create mode 100644 common/changes/office-ui-fabric-react/oufr-strict-null_2017-07-14-01-46.json
 create mode 100644 packages/utilities/src/assertNever.ts

diff --git a/common/changes/@uifabric/example-app-base/oufr-strict-null_2017-07-14-01-46.json b/common/changes/@uifabric/example-app-base/oufr-strict-null_2017-07-14-01-46.json
new file mode 100644
index 0000000000000..e807ce07d1d8c
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/oufr-strict-null_2017-07-14-01-46.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/oufr-strict-null_2017-07-14-01-46.json b/common/changes/@uifabric/fabric-website/oufr-strict-null_2017-07-14-01-46.json
new file mode 100644
index 0000000000000..cbeaf5c6e2864
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/oufr-strict-null_2017-07-14-01-46.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/oufr-strict-null_2017-07-14-01-46.json b/common/changes/@uifabric/styling/oufr-strict-null_2017-07-14-01-46.json
new file mode 100644
index 0000000000000..10861b0091cd0
--- /dev/null
+++ b/common/changes/@uifabric/styling/oufr-strict-null_2017-07-14-01-46.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/oufr-strict-null_2017-07-14-01-46.json b/common/changes/@uifabric/utilities/oufr-strict-null_2017-07-14-01-46.json
new file mode 100644
index 0000000000000..45754156d2dff
--- /dev/null
+++ b/common/changes/@uifabric/utilities/oufr-strict-null_2017-07-14-01-46.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Add assertNever function for exhaustive null checking",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/oufr-strict-null_2017-07-14-01-46.json b/common/changes/office-ui-fabric-react/oufr-strict-null_2017-07-14-01-46.json
new file mode 100644
index 0000000000000..fb11f585dd89c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/oufr-strict-null_2017-07-14-01-46.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Start fixing some strictNullCheck errors",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
index 57afc6a5dd0ee..0560abf396eb6 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
@@ -23,7 +23,7 @@ export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox>
   /**
    * Collection of options for this ComboBox
    */
-  options?: IComboBoxOption[];
+  options: IComboBoxOption[];
 
   /**
    * Callback issues when either:
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
index 73241b5fdb514..2b1592439a062 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
@@ -103,6 +103,7 @@ describe('ComboBox', () => {
     let wrapper = mount(
       <ComboBox
         label='testgroup'
+        options={ [] }
         value='1'
       />);
     let comboBoxRoot = wrapper.find('.ms-ComboBox');
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 95b4ea94ad1e2..17e1b6b1eb7a0 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -29,7 +29,7 @@ export interface IComboBoxState {
   isOpen?: boolean;
 
   // The currently selected index (-1 if no index is selected)
-  selectedIndex?: number;
+  selectedIndex: number;
 
   // The focused state of the comboBox
   focused?: boolean;
@@ -38,11 +38,11 @@ export interface IComboBoxState {
   suggestedDisplayValue?: string;
 
   // The options currently available for the callout
-  currentOptions?: IComboBoxOption[];
+  currentOptions: IComboBoxOption[];
 
   // when taking input, this will store the index the
   // that the options input matches (-1 if no input or match)
-  currentPendingValueValidIndex?: number;
+  currentPendingValueValidIndex: number;
 
   // when taking input, this will store
   // the actual text that is being entered
@@ -97,9 +97,9 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   private _currentPromise: PromiseLike<IComboBoxOption[]>;
 
   // The current visible value sent to the auto fill on render
-  private _currentVisibleValue: string;
+  private _currentVisibleValue: string | undefined;
 
-  constructor(props?: IComboBoxProps) {
+  constructor(props: IComboBoxProps) {
     super(props);
 
     this._warnMutuallyExclusive({
@@ -113,7 +113,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     let selectedKey = props.defaultSelectedKey !== undefined ? props.defaultSelectedKey : props.selectedKey;
     this._lastReadOnlyAutoCompleteChangeTimeoutId = -1;
 
-    let index: number = this._getSelectedIndex(props.options, selectedKey);
+    let index: number = this._getSelectedIndex(props.options!, selectedKey!);
 
     this.state = {
       isOpen: false,
@@ -136,7 +136,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     // and currentOptions state if the key or options change
     if (newProps.selectedKey !== undefined &&
       (newProps.selectedKey !== this.props.selectedKey || newProps.options !== this.props.options)) {
-      let index: number = this._getSelectedIndex(newProps.options, newProps.selectedKey);
+      let index: number = this._getSelectedIndex(newProps.options!, newProps.selectedKey);
       this.setState({
         selectedIndex: index,
         currentOptions: newProps.options
@@ -219,10 +219,10 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
             css('ms-ComboBox', styles.wrapper,
               (errorMessage && errorMessage.length > 0 ? styles.wrapperForError : null),
               styles.root, className, {
-                'is-open': isOpen,
-                ['is-disabled ' + styles.rootIsDisabled]: disabled,
-                'is-required ': required,
-                [styles.focused]: focused,
+                'is-open': !!isOpen,
+                ['is-disabled ' + styles.rootIsDisabled]: !!disabled,
+                'is-required ': !!required,
+                [styles.focused]: !!focused,
                 [styles.readOnly]: !allowFreeform
               }
             )
@@ -248,7 +248,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
             aria-labelledby={ (label && (id + '-label')) }
             aria-label={ ((ariaLabel && !label) && ariaLabel) }
             aria-describedby={ (id + '-option') }
-            aria-activedescendant={ (isOpen && selectedIndex >= 0 ? (id + '-list' + selectedIndex) : null) }
+            aria-activedescendant={ (isOpen && (selectedIndex as number) >= 0 ? (id + '-list' + selectedIndex) : null) }
             aria-disabled={ disabled }
             aria-owns={ (id + '-list') }
             spellCheck={ false }
@@ -298,7 +298,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * @returns {string} - the updated value to set, if needed
    */
   @autobind
-  private _onUpdateValueInAutoFillWillReceiveProps(): string {
+  private _onUpdateValueInAutoFillWillReceiveProps(): string | null {
     if (this._comboBox === null || this._comboBox === undefined) {
       return null;
     }
@@ -329,7 +329,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * @returns {string} the value to pass to the input
    */
   @autobind
-  private _getVisibleValue(): string {
+  private _getVisibleValue(): string | undefined {
     let {
       value,
       allowFreeform,
@@ -392,7 +392,10 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * @param index - the index to check
    * @returns {boolean} - true if the index is valid for the given options, false otherwise
    */
-  private _indexWithinBounds(options: IComboBoxOption[], index: number): boolean {
+  private _indexWithinBounds(options: IComboBoxOption[] | undefined, index: number): boolean {
+    if (!options) {
+      return false;
+    }
     return index >= 0 && index < options.length;
   }
 
@@ -703,7 +706,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       });
 
       if (onChanged) {
-        onChanged(null, null, currentPendingValue);
+        onChanged(undefined, undefined, currentPendingValue);
       }
     } else if (currentPendingValueValidIndex >= 0) {
       // Since we are not allowing freeform, we must have a matching
@@ -767,7 +770,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
   // Render items
   @autobind
-  private _onRenderItem(item: IComboBoxOption): JSX.Element {
+  private _onRenderItem(item: IComboBoxOption): JSX.Element | null {
     switch (item.itemType) {
       case SelectableOptionMenuItemType.Divider:
         return this._renderSeparator(item);
@@ -779,9 +782,9 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   }
 
   // Render separator
-  private _renderSeparator(item: IComboBoxOption): JSX.Element {
+  private _renderSeparator(item: IComboBoxOption): JSX.Element | null {
     let { index, key } = item;
-    if (index > 0) {
+    if (index && index > 0) {
       return <div
         role='separator'
         key={ key }
@@ -833,7 +836,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * we do not have a valid index and we currently have a pending input value,
    * otherwise use the selected index
    * */
-  private _isOptionSelected(index: number): boolean {
+  private _isOptionSelected(index: number | undefined): boolean {
     let {
       currentPendingValueValidIndex,
       currentPendingValue,
@@ -873,8 +876,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * to select the item and also close the menu
    * @param index - the index of the item that was clicked
    */
-  private _onItemClick(index: number) {
-    this._setSelectedIndex(index);
+  private _onItemClick(index: number | undefined) {
+    this._setSelectedIndex(index as number);
     this.setState({
       isOpen: false
     });
@@ -1178,7 +1181,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * eating the required key event when disabled
    * @param ev - the keyboard event that was fired
    */
-  private _handleInputWhenDisabled(ev: React.KeyboardEvent<HTMLElement | BaseAutoFill>) {
+  private _handleInputWhenDisabled(ev: React.KeyboardEvent<HTMLElement | BaseAutoFill> | null) {
     // If we are disabled, close the menu (if needed)
     // and eat all keystokes other than TAB or ESC
     if (this.props.disabled) {
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index aeaaa5d869951..9d88e6474f083 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -92,13 +92,13 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   private _surfaceRect: IRectangle;
 
   // The visible rect that we're required to render given the current list state.
-  private _requiredRect: IRectangle;
+  private _requiredRect: IRectangle | null;
 
   // The visible rect that we're allowed to keep rendered. Pages outside of this rect will be removed.
   private _allowedRect: IRectangle;
 
   // materialized rect around visible items, relative to surface
-  private _materializedRect: IRectangle;
+  private _materializedRect: IRectangle | null;
 
   private _requiredWindowsAhead: number;
   private _requiredWindowsBehind: number;
@@ -161,7 +161,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
    * @param measureItem Optional callback to measure the height of an individual item
    */
   public scrollToIndex(index: number, measureItem?: (itemIndex: number) => number): void {
-    const { startIndex } = this.props;
+    const startIndex = this.props.startIndex as number;
     const renderCount = this._getRenderCount();
     const endIndex = startIndex + renderCount;
 
@@ -230,7 +230,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
 
     this._updatePages();
     this._measureVersion++;
-    this._scrollElement = findScrollableParent(this.refs.root);
+    this._scrollElement = findScrollableParent(this.refs.root) as HTMLElement;
 
     this._events.on(window, 'resize', this._onAsyncResize);
     this._events.on(this.refs.root, 'focus', this._onFocus, true);
@@ -266,10 +266,10 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       newProps.renderedWindowsAhead === renderedWindowsAhead,
       newProps.renderedWindowsBehind === renderedWindowsBehind,
       newProps.items === this.props.items &&
-      oldPages.length === newPages.length) {
-      for (let i = 0; i < oldPages.length; i++) {
-        let oldPage = oldPages[i];
-        let newPage = newPages[i];
+      oldPages!.length === newPages!.length) {
+      for (let i = 0; i < oldPages!.length; i++) {
+        let oldPage = oldPages![i];
+        let newPage = newPages![i];
 
         if ((oldPage.key !== newPage.key ||
           oldPage.itemCount !== newPage.itemCount)) {
@@ -302,8 +302,8 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     // assign list if no role
     role = (role === undefined) ? 'list' : role;
 
-    for (let i = 0; i < pages.length; i++) {
-      pageElements.push(this._renderPage(pages[i]));
+    for (let i = 0; i < pages!.length; i++) {
+      pageElements.push(this._renderPage(pages![i]));
     }
 
     // console.log(`Page elements ${pageElements.length}`);
@@ -339,7 +339,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
 
       cells.push(
         <div role={ role } className='ms-List-cell' key={ itemKey } data-list-index={ i + page.startIndex } data-automationid='ListCell'>
-          { onRenderCell(item, page.startIndex + i) }
+          { onRenderCell!(item, page.startIndex + i) }
         </div>
       );
     }
@@ -380,7 +380,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
         break;
       }
 
-      target = getParent(target);
+      target = getParent(target) as HTMLElement;
     }
   }
 
@@ -404,7 +404,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     this._updateRenderRects();
 
     // Only update pages when the visible rect falls outside of the materialized rect.
-    if (!this._materializedRect || !_isContainedWithin(this._requiredRect, this._materializedRect)) {
+    if (!this._materializedRect || !_isContainedWithin(this._requiredRect as IRectangle, this._materializedRect)) {
       this._updatePages();
     } else {
       // console.log('requiredRect contained in materialized', this._requiredRect, this._materializedRect);
@@ -421,8 +421,8 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       _requiredWindowsAhead: requiredWindowsAhead,
       _requiredWindowsBehind: requiredWindowsBehind
     } = this;
-    const windowsAhead = Math.min(renderedWindowsAhead, requiredWindowsAhead + 1);
-    const windowsBehind = Math.min(renderedWindowsBehind, requiredWindowsBehind + 1);
+    const windowsAhead = Math.min(renderedWindowsAhead as number, requiredWindowsAhead + 1);
+    const windowsBehind = Math.min(renderedWindowsBehind as number, requiredWindowsBehind + 1);
 
     if (windowsAhead !== requiredWindowsAhead || windowsBehind !== requiredWindowsBehind) {
 
@@ -434,7 +434,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       this._updatePages();
     }
 
-    if (renderedWindowsAhead > windowsAhead || renderedWindowsBehind > windowsBehind) {
+    if (renderedWindowsAhead! > windowsAhead || renderedWindowsBehind! > windowsBehind) {
       // Async increment on next tick.
       this._onAsyncIdle();
     }
@@ -455,12 +455,12 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       this._updateRenderRects(props);
     }
 
-    let newListState = this._buildPages(items, startIndex, renderCount);
+    let newListState = this._buildPages(items as any[], startIndex as number, renderCount);
     let oldListPages = this.state.pages;
 
     this.setState(newListState, () => {
       // If measured version is invalid since we've updated the DOM
-      const heightsChanged = this._updatePageMeasurements(oldListPages, newListState.pages);
+      const heightsChanged = this._updatePageMeasurements(oldListPages as IPage[], newListState.pages as IPage[]);
 
       // On first render, we should re-measure so that we don't get a visual glitch.
       if (heightsChanged) {
@@ -597,9 +597,9 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       let pageHeight = this._getPageHeight(itemIndex, itemsPerPage, this._surfaceRect);
       let pageBottom = pageTop + pageHeight - 1;
 
-      let isPageRendered = findIndex(this.state.pages, (page) => page.items && page.startIndex === itemIndex) > -1;
-      let isPageInAllowedRange = pageBottom >= this._allowedRect.top && pageTop <= this._allowedRect.bottom;
-      let isPageInRequiredRange = pageBottom >= this._requiredRect.top && pageTop <= this._requiredRect.bottom;
+      let isPageRendered = findIndex(this.state.pages as IPage[], (page) => page.items && page.startIndex === itemIndex) > -1;
+      let isPageInAllowedRange = pageBottom >= this._allowedRect.top && pageTop <= this._allowedRect.bottom!;
+      let isPageInRequiredRange = pageBottom >= this._requiredRect!.top && pageTop <= this._requiredRect!.bottom!;
       let isPageVisible = !isFirstRender && (isPageInRequiredRange || (isPageInAllowedRange && isPageRendered));
       let isPageFocused = focusedIndex >= itemIndex && focusedIndex < (itemIndex + itemsPerPage);
       let isFirstPage = itemIndex === startIndex;
@@ -680,7 +680,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     return itemsPerPage ? itemsPerPage : DEFAULT_ITEMS_PER_PAGE;
   }
 
-  private _createPage(pageKey: string, items: any[], startIndex?: number, count?: number, style?: any): IPage {
+  private _createPage(pageKey: string | null, items: any[] | null, startIndex?: number, count?: number, style?: any): IPage {
     pageKey = pageKey || ('page-' + startIndex);
 
     // Fill undefined cells because array.map will ignore undefined cells.
@@ -694,7 +694,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       key: pageKey,
       startIndex: startIndex === undefined ? -1 : startIndex,
       itemCount: (count === undefined) ? (items ? items.length : 0) : count,
-      items: items,
+      items: items as any[],
       style: style || {},
       top: 0,
       height: 0
@@ -704,7 +704,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   private _getRenderCount(props?: IListProps): number {
     let { items, startIndex, renderCount } = props || this.props;
 
-    return (renderCount === undefined ? (items ? items.length - startIndex : 0) : renderCount);
+    return (renderCount === undefined ? (items ? items.length - startIndex! : 0) : renderCount);
   }
 
   /** Calculate the visible rect within the list where top: 0 and left: 0 is the top/left of the list. */
@@ -756,7 +756,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
 
     // The required/allowed rects are adjusted versions of the visible rect.
     this._requiredRect = _expandRect(visibleRect, this._requiredWindowsBehind, this._requiredWindowsAhead);
-    this._allowedRect = _expandRect(visibleRect, renderedWindowsBehind, renderedWindowsAhead);
+    this._allowedRect = _expandRect(visibleRect, renderedWindowsBehind!, renderedWindowsAhead!);
   }
 }
 
@@ -778,17 +778,17 @@ function _isContainedWithin(innerRect: IRectangle, outerRect: IRectangle): boole
   return (
     innerRect.top >= outerRect.top &&
     innerRect.left >= outerRect.left &&
-    innerRect.bottom <= outerRect.bottom &&
-    innerRect.right <= outerRect.right);
+    innerRect.bottom! <= outerRect.bottom! &&
+    innerRect.right! <= outerRect.right!);
 }
 
 function _mergeRect(targetRect: IRectangle, newRect: IRectangle): IRectangle {
   targetRect.top = (newRect.top < targetRect.top || targetRect.top === -1) ? newRect.top : targetRect.top;
   targetRect.left = (newRect.left < targetRect.left || targetRect.left === -1) ? newRect.left : targetRect.left;
-  targetRect.bottom = (newRect.bottom > targetRect.bottom || targetRect.bottom === -1) ? newRect.bottom : targetRect.bottom;
-  targetRect.right = (newRect.right > targetRect.right || targetRect.right === -1) ? newRect.right : targetRect.right;
-  targetRect.width = targetRect.right - targetRect.left + 1;
-  targetRect.height = targetRect.bottom - targetRect.top + 1;
+  targetRect.bottom = (newRect.bottom! > targetRect.bottom! || targetRect.bottom === -1) ? newRect.bottom : targetRect.bottom;
+  targetRect.right = (newRect.right! > targetRect.right! || targetRect.right === -1) ? newRect.right : targetRect.right;
+  targetRect.width = targetRect.right! - targetRect.left + 1;
+  targetRect.height = targetRect.bottom! - targetRect.top + 1;
 
   return targetRect;
 }
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx b/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx
index 0c728744d0863..85c1cebbb36e2 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx
@@ -58,7 +58,7 @@ export class ListScrollingExample extends React.Component<IListScrollingExampleP
           <List
             ref={ this._resolveList }
             items={ items }
-            getPageHeight={ (idx) => {
+            getPageHeight={ (idx: number) => {
               let h = 0;
               for (let i = idx; i < idx + numberOfItemsOnPage; ++i) {
                 const isEvenRow = i % 2 === 0;
@@ -67,7 +67,7 @@ export class ListScrollingExample extends React.Component<IListScrollingExampleP
               }
               return h;
             } }
-            onRenderCell={ (item, index) => (
+            onRenderCell={ (item, index: number) => (
               <div className='ms-ListScrollingExample-itemCell' data-is-focusable={ true }>
                 <div className={ css('ms-ListScrollingExample-itemContent', {
                   'ms-ListScrollingExample-itemContent-even': index % 2 === 0,
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
index e00ccb0d42861..764ebf533ad83 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
@@ -41,12 +41,12 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
     root: HTMLElement;
   };
 
-  private _dragOrigin: IPoint;
+  private _dragOrigin: IPoint | undefined;
   private _rootRect: IRectangle;
-  private _lastMouseEvent: MouseEvent;
-  private _autoScroll: AutoScroll;
-  private _selectedIndicies: { [key: string]: boolean };
-  private _itemRectCache: { [key: string]: IRectangle };
+  private _lastMouseEvent: MouseEvent | undefined;
+  private _autoScroll: AutoScroll | undefined;
+  private _selectedIndicies: { [key: string]: boolean } | undefined;
+  private _itemRectCache: { [key: string]: IRectangle } | undefined;
   private _scrollableParent: HTMLElement;
   private _scrollableSurface: HTMLElement;
   private _scrollTop: number;
@@ -60,7 +60,7 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
   }
 
   public componentDidMount() {
-    this._scrollableParent = findScrollableParent(this.refs.root);
+    this._scrollableParent = findScrollableParent(this.refs.root) as HTMLElement;
     this._scrollableSurface = this._scrollableParent === window as any ? document.body : this._scrollableParent;
     // When scroll events come from window, we need to read scrollTop values from the body.
 
@@ -83,7 +83,7 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
     return (
       <div
         { ...rootProps }
-        className={ css('ms-MarqueeSelection', styles.root, rootProps.className) }
+        className={ css('ms-MarqueeSelection', styles.root, rootProps && rootProps.className) }
         ref='root'
       >
         { children }
@@ -190,11 +190,11 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
       if (this.state.dragRect || getDistanceBetweenPoints(this._dragOrigin, currentPoint) > MIN_DRAG_DISTANCE) {
         // We need to constrain the current point to the rootRect boundaries.
         let constrainedPoint = this.props.isDraggingConstrainedToRoot ? {
-          x: Math.max(0, Math.min(rootRect.width, this._lastMouseEvent.clientX - rootRect.left)),
-          y: Math.max(0, Math.min(rootRect.height, this._lastMouseEvent.clientY - rootRect.top))
+          x: Math.max(0, Math.min(rootRect.width, this._lastMouseEvent!.clientX - rootRect.left)),
+          y: Math.max(0, Math.min(rootRect.height, this._lastMouseEvent!.clientY - rootRect.top))
         } : {
-            x: this._lastMouseEvent.clientX - rootRect.left,
-            y: this._lastMouseEvent.clientY - rootRect.top
+            x: this._lastMouseEvent!.clientX - rootRect.left,
+            y: this._lastMouseEvent!.clientY - rootRect.top
           };
 
         let dragRect = {
@@ -217,7 +217,10 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
     this._events.off(window);
     this._events.off(this._scrollableParent, 'scroll');
 
-    this._autoScroll.dispose();
+    if (this._autoScroll) {
+      this._autoScroll.dispose();
+    }
+
     this._autoScroll = this._dragOrigin = this._lastMouseEvent = this._selectedIndicies = this._itemRectCache = undefined;
 
     if (this.state.dragRect) {
@@ -233,9 +236,9 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
 
   private _isPointInRectangle(rectangle: IRectangle, point: IPoint): boolean {
     return rectangle.top < point.y &&
-      rectangle.bottom > point.y &&
+      rectangle.bottom! > point.y &&
       rectangle.left < point.x &&
-      rectangle.right > point.x;
+      rectangle.right! > point.x;
   }
 
   /**
@@ -282,7 +285,7 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
 
     for (let i = 0; i < allElements.length; i++) {
       let element = allElements[i];
-      let index = element.getAttribute('data-selection-index');
+      let index = element.getAttribute('data-selection-index') as string;
 
       // Pull the memoized rectangle for the item, or the get the rect and memoize.
       let itemRect = this._itemRectCache[index];
@@ -307,18 +310,18 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
 
       if (
         itemRect.top < (dragRect.top + dragRect.height) &&
-        itemRect.bottom > dragRect.top &&
+        itemRect.bottom! > dragRect.top &&
         itemRect.left < (dragRect.left + dragRect.width) &&
-        itemRect.right > dragRect.left
+        itemRect.right! > dragRect.left
       ) {
-        this._selectedIndicies[index] = true;
+        this._selectedIndicies![index] = true;
       } else {
-        delete this._selectedIndicies[index];
+        delete this._selectedIndicies![index];
       }
     }
 
-    for (let index in this._selectedIndicies) {
-      if (this._selectedIndicies.hasOwnProperty(index)) {
+    for (let index in this._selectedIndicies!) {
+      if (this._selectedIndicies!.hasOwnProperty(index)) {
         selection.setIndexSelected(Number(index), true, false);
       }
     }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index 106deeb12fa4c..db0a29fe2f304 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -80,7 +80,6 @@ export class Persona extends BaseComponent<IPersonaProps, IPersonaState> {
   public render() {
     let {
       className,
-      size,
       imageUrl,
       imageAlt,
       initialsColor,
@@ -98,12 +97,13 @@ export class Persona extends BaseComponent<IPersonaProps, IPersonaState> {
       onRenderOptionalText,
       imageShouldStartVisible
     } = this.props;
+    let size = this.props.size as PersonaSize;
 
     initialsColor = initialsColor !== undefined && initialsColor !== null ? initialsColor : this._getColorFromName(primaryText);
 
     let presenceElement = null;
     if (presence !== PersonaPresence.none) {
-      let userPresence = PersonaPresence[presence],
+      let userPresence = PersonaPresence[presence as PersonaPresence],
         statusIcon = null;
       switch (userPresence) {
         case 'online':
@@ -150,7 +150,7 @@ export class Persona extends BaseComponent<IPersonaProps, IPersonaState> {
     return (
       <div
         { ...divProps }
-        className={ css('ms-Persona', styles.root, className, PERSONA_SIZE[size], PERSONA_PRESENCE[presence], this.props.showSecondaryText ? styles.showSecondaryText : '') }
+        className={ css('ms-Persona', styles.root, className, PERSONA_SIZE[size], PERSONA_PRESENCE[presence as PersonaPresence], this.props.showSecondaryText ? styles.showSecondaryText : '') }
       >
         { size !== PersonaSize.tiny && (
           <div className={ css('ms-Persona-imageArea', styles.imageArea) }>
@@ -188,7 +188,7 @@ export class Persona extends BaseComponent<IPersonaProps, IPersonaState> {
   }
 
   @autobind
-  private _renderElement(text: string, className: string, render?: IRenderFunction<IPersonaProps>): JSX.Element {
+  private _renderElement(text: string | undefined, className: string, render?: IRenderFunction<IPersonaProps>): JSX.Element {
     return (
       <div className={ className }>
         { render ? render(this.props) : text }
@@ -212,7 +212,7 @@ export class Persona extends BaseComponent<IPersonaProps, IPersonaState> {
     );
   }
 
-  private _getColorFromName(displayName: string): PersonaInitialsColor {
+  private _getColorFromName(displayName: string | undefined): PersonaInitialsColor {
     let color = PersonaInitialsColor.blue;
     if (!displayName) {
       return color;
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
index 8e25ec01a49c8..3b83bb52a2d4e 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
@@ -53,17 +53,17 @@ export class Pivot extends BaseComponent<IPivotProps, IPivotState> {
     if (props.initialSelectedKey) {
       selectedKey = props.initialSelectedKey;
     } else if (props.initialSelectedIndex) {
-      selectedKey = links[props.initialSelectedIndex].itemKey;
+      selectedKey = links[props.initialSelectedIndex].itemKey as string;
     } else if (props.selectedKey) {
       selectedKey = props.selectedKey;
     } else if (links.length) {
-      selectedKey = links[0].itemKey;
+      selectedKey = links[0].itemKey as string;
     }
 
     this.state = {
       links,
-      selectedKey,
-      selectedTabId: this._keyToTabIds[selectedKey],
+      selectedKey: selectedKey!,
+      selectedTabId: this._keyToTabIds[selectedKey!],
     } as IPivotState;
 
     this._renderLink = this._renderLink.bind(this);
@@ -73,7 +73,7 @@ export class Pivot extends BaseComponent<IPivotProps, IPivotState> {
     const links: IPivotItemProps[] = this._getPivotLinks(nextProps);
 
     this.setState((prevState, props) => {
-      let selectedKey: string;
+      let selectedKey: string | undefined;
       if (this._isKeyValid(nextProps.selectedKey)) {
         selectedKey = nextProps.selectedKey;
       } else if (this._isKeyValid(prevState.selectedKey)) {
@@ -85,7 +85,7 @@ export class Pivot extends BaseComponent<IPivotProps, IPivotState> {
       return {
         links: links,
         selectedKey,
-        selectedTabId: this._keyToTabIds[selectedKey],
+        selectedTabId: this._keyToTabIds[selectedKey as string],
       } as IPivotState;
     });
   }
@@ -121,9 +121,9 @@ export class Pivot extends BaseComponent<IPivotProps, IPivotState> {
   @autobind
   private _renderLink(link: IPivotItemProps) {
     const { itemKey } = link;
-    const tabId = this._keyToTabIds[itemKey];
+    const tabId = this._keyToTabIds[itemKey as string];
     const { onRenderItemLink } = link;
-    let linkContent: JSX.Element | false;
+    let linkContent: JSX.Element | null;
 
     if (onRenderItemLink) {
       linkContent = onRenderItemLink(link, this._renderLinkContent);
@@ -232,7 +232,7 @@ export class Pivot extends BaseComponent<IPivotProps, IPivotState> {
   /**
    * whether the key exists in the pivot items.
    */
-  private _isKeyValid(itemKey: string) {
+  private _isKeyValid(itemKey: string | undefined) {
     return itemKey !== undefined && this._keyToIndexMapping[itemKey] !== undefined;
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.Props.ts b/packages/office-ui-fabric-react/src/components/Slider/Slider.Props.ts
index 9ef3df689a999..0335797db4947 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.Props.ts
@@ -1,7 +1,7 @@
 import * as React from 'react';
 
 export interface ISlider {
-  value: number;
+  value: number | undefined;
 
   focus: () => void;
 }
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
index 9dbeba4e03816..24167c87bef42 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
@@ -42,7 +42,7 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
 
   private _id: string;
 
-  constructor(props?: ISliderProps) {
+  constructor(props: ISliderProps) {
     super(props);
 
     this._warnMutuallyExclusive({
@@ -65,7 +65,7 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
   public componentWillReceiveProps(newProps: ISliderProps): void {
 
     if (newProps.value !== undefined) {
-      let value = Math.max(newProps.min, Math.min(newProps.max, newProps.value));
+      let value = Math.max(newProps.min as number, Math.min(newProps.max as number, newProps.value));
 
       this.setState({
         value: value,
@@ -86,7 +86,7 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
       buttonProps
     } = this.props;
     const { value, renderedValue } = this.state;
-    const thumbOffsetPercent: number = (renderedValue - min) / (max - min) * 100;
+    const thumbOffsetPercent: number = (renderedValue! - min!) / (max! - min!) * 100;
 
     const onMouseDownProp: {} = disabled ? {} : { onMouseDown: this._onMouseDownOrTouchStart };
     const onTouchStartProp: {} = disabled ? {} : { onTouchStart: this._onMouseDownOrTouchStart };
@@ -113,8 +113,8 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
             { ...onTouchStartProp }
             { ...onKeyDownProp }
             { ...buttonProps }
-            className={ css('ms-Slider-slideBox', styles.slideBox, buttonProps.className, {
-              'ms-Slider-showValue': showValue,
+            className={ css('ms-Slider-slideBox', styles.slideBox, buttonProps!.className, {
+              'ms-Slider-showValue': !!showValue,
               ['ms-Slider-showTransitions ' + styles.showTransitions]: (renderedValue === value)
             }) }
             id={ this._id }
@@ -150,7 +150,7 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     }
   }
 
-  public get value(): number {
+  public get value(): number | undefined {
     return this.state.value;
   }
 
@@ -170,7 +170,7 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
   @autobind
   private _onMouseMoveOrTouchMove(event: MouseEvent | TouchEvent, suppressEventCancelation?: boolean): void {
     const { max, min, step } = this.props;
-    const steps: number = (max - min) / step;
+    const steps: number = (max! - min!) / step!;
     const sliderPositionRect: ClientRect = this.refs.sliderLine.getBoundingClientRect();
     const sliderLength: number = sliderPositionRect.width;
     const stepLength: number = sliderLength / steps;
@@ -190,13 +190,13 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     let renderedValue: number;
 
     // The value shouldn't be bigger than max or be smaller than min.
-    if (currentSteps > Math.floor(steps)) {
-      renderedValue = currentValue = max;
-    } else if (currentSteps < 0) {
-      renderedValue = currentValue = min;
+    if (currentSteps! > Math.floor(steps)) {
+      renderedValue = currentValue = max as number;
+    } else if (currentSteps! < 0) {
+      renderedValue = currentValue = min as number;
     } else {
-      renderedValue = min + step * currentSteps;
-      currentValue = min + step * Math.round(currentSteps);
+      renderedValue = min! + step! * currentSteps!;
+      currentValue = min! + step! * Math.round(currentSteps!);
     }
 
     this._updateValue(currentValue, renderedValue);
@@ -215,7 +215,7 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
       renderedValue
     }, () => {
       if (valueChanged && this.props.onChange) {
-        this.props.onChange(this.state.value);
+        this.props.onChange(this.state.value as number);
       }
     });
   }
@@ -233,15 +233,15 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
 
   @autobind
   private _onKeyDown(event: KeyboardEvent): void {
-    let value: number = this.state.value;
+    let value: number | undefined = this.state.value;
     const { max, min, step } = this.props;
 
-    let diff: number = 0;
+    let diff: number | undefined = 0;
 
     switch (event.which) {
       case getRTLSafeKeyCode(KeyCodes.left):
       case KeyCodes.down:
-        diff = -step;
+        diff = -(step as number);
         break;
       case getRTLSafeKeyCode(KeyCodes.right):
       case KeyCodes.up:
@@ -260,7 +260,7 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
         return;
     }
 
-    const newValue: number = Math.min(max, Math.max(min, value + diff));
+    const newValue: number = Math.min(max as number, Math.max(min as number, value! + diff!));
 
     this._updateValue(newValue, newValue);
 
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index 2ba55b61be8fd..0a09301c5f06d 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -44,7 +44,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
     max: 100,
     disabled: false,
     labelPosition: Position.start,
-    label: null,
+    label: '',
     incrementButtonIcon: { iconName: 'ChevronUpSmall' },
     decrementButtonIcon: { iconName: 'ChevronDownSmall' }
   };
@@ -52,7 +52,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
   private _input: HTMLInputElement;
   private _inputId: string;
   private _labelId: string;
-  private _lastValidValue: string;
+  private _lastValidValue: string | undefined;
   private _spinningByMouse: boolean;
 
   private _onValidate?: (value: string) => string | void;
@@ -109,7 +109,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
     this._lastValidValue = this.state.value;
     let value: string = newProps.value ? newProps.value : String(newProps.min);
     if (newProps.defaultValue) {
-      value = String(Math.max(newProps.min, Math.min(newProps.max, Number(newProps.defaultValue))));
+      value = String(Math.max(newProps.min as number, Math.min(newProps.max as number, Number(newProps.defaultValue))));
     }
 
     this.setState({
@@ -138,7 +138,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
 
     return (
       <div className={ styles.SpinButtonContainer }>
-        { labelPosition !== Position.bottom && <div className={ css(styles.labelWrapper, this._getClassNameForLabelPosition(labelPosition)) }>
+        { labelPosition !== Position.bottom && <div className={ css(styles.labelWrapper, this._getClassNameForLabelPosition(labelPosition as Position)) }>
           { iconProps && <Icon iconName={ iconProps.iconName } className={ css(styles.SpinButtonIcon) } aria-hidden='true'></Icon> }
           { label &&
             <Label
@@ -228,7 +228,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
   /**
    * Gets the value of the spin button.
    */
-  public get value(): string {
+  public get value(): string | undefined {
     return this.props.value === undefined ? this.state.value : this.props.value;
   }
 
@@ -239,7 +239,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
     if (isNaN(Number(value))) {
       return this._lastValidValue;
     }
-    const newValue = Math.min(this.props.max, Math.max(this.props.min, Number(value)));
+    const newValue = Math.min(this.props.max as number, Math.max(this.props.min as number, Number(value)));
     return String(newValue);
   }
 
@@ -247,7 +247,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
    * Increment function to use if one is not passed in
    */
   private _defaultOnIncrement = (value: string) => {
-    let newValue = Math.min(Number(value) + this.props.step, this.props.max);
+    let newValue = Math.min(Number(value) + (this.props.step as number), this.props.max as number);
     return String(newValue);
   }
 
@@ -255,7 +255,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
    * Increment function to use if one is not passed in
    */
   private _defaultOnDecrement = (value: string) => {
-    let newValue = Math.max(Number(value) - this.props.step, this.props.min);
+    let newValue = Math.max(Number(value) - (this.props.step as number), this.props.min as number);
     return String(newValue);
   }
 
@@ -302,7 +302,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
     const element: HTMLInputElement = event.target as HTMLInputElement;
     const value: string = element.value;
     if (this.state.value) {
-      const newValue = this._onValidate(value);
+      const newValue = this._onValidate!(value);
       if (newValue) {
         this._lastValidValue = newValue;
         this.setState({ value: newValue });
@@ -333,7 +333,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
    */
   @autobind
   private _updateValue(shouldSpin: boolean, stepDelay: number, stepFunction: (string: string) => string | void) {
-    const newValue = stepFunction(this.state.value);
+    const newValue = stepFunction(this.state.value as string);
     if (newValue) {
       this._lastValidValue = newValue;
       this.setState({ value: newValue });
@@ -388,11 +388,11 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
     if (event.which === KeyCodes.up) {
 
       spinDirection = KeyboardSpinDirection.up;
-      this._updateValue(false /* shouldSpin */, this._initialStepDelay, this._onIncrement);
+      this._updateValue(false /* shouldSpin */, this._initialStepDelay, this._onIncrement!);
     } else if (event.which === KeyCodes.down) {
 
       spinDirection = KeyboardSpinDirection.down;
-      this._updateValue(false /* shouldSpin */, this._initialStepDelay, this._onDecrement);
+      this._updateValue(false /* shouldSpin */, this._initialStepDelay, this._onDecrement!);
     } else if (event.which === KeyCodes.enter) {
       event.currentTarget.blur();
       this.focus();
@@ -425,12 +425,12 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
 
   @autobind
   private _onIncrementMouseDown() {
-    this._updateValue(true /* shouldSpin */, this._initialStepDelay, this._onIncrement);
+    this._updateValue(true /* shouldSpin */, this._initialStepDelay, this._onIncrement!);
   }
 
   @autobind
   private _onDecrementMouseDown() {
-    this._updateValue(true /* shouldSpin */, this._initialStepDelay, this._onDecrement);
+    this._updateValue(true /* shouldSpin */, this._initialStepDelay, this._onDecrement!);
   }
 
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
index e195eaf9c1db8..40b43fb3af08d 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
@@ -84,7 +84,7 @@ describe('SwatchColorPicker', () => {
     let menu = wrapper.getDOMNode().ownerDocument.querySelector('.ms-swatchColorPickerMenu');
 
     expect(menu).to.not.equal(null, 'should have a menu');
-    expect(menu.querySelectorAll('.ms-swatchColorPickerBodyContainer').length).to.equal(1, 'should have a swatch color picker body inside of the menu');
+    expect(menu!.querySelectorAll('.ms-swatchColorPickerBodyContainer').length).to.equal(1, 'should have a swatch color picker body inside of the menu');
   });
 
   it('Can render the correct options when in a menu', () => {
@@ -104,7 +104,7 @@ describe('SwatchColorPicker', () => {
     expect(button).to.not.equal(null, 'should have a button');
     button.simulate('click');
 
-    let menu = wrapper.getDOMNode().ownerDocument.querySelector('.ms-swatchColorPickerMenu');
+    let menu = wrapper.getDOMNode().ownerDocument.querySelector('.ms-swatchColorPickerMenu') as Element;
     expect(menu).to.not.equal(null, 'should have a menu');
 
     let tableElements = menu.querySelectorAll('table[role="grid"]');
@@ -213,10 +213,10 @@ describe('SwatchColorPicker', () => {
 
     expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(1, 'should be expanded');
 
-    let menu = wrapper.getDOMNode().ownerDocument.querySelector('.ms-swatchColorPickerMenu');
+    let menu = wrapper.getDOMNode().ownerDocument.querySelector('.ms-swatchColorPickerMenu') as Element;
     expect(menu).to.not.equal(null, 'should have a menu');
 
-    let cell = menu.querySelector('button');
+    let cell = menu.querySelector('button') as HTMLButtonElement;
     expect(cell).to.not.equal(null, 'should find a cell');
 
     ReactTestUtils.Simulate.click(cell);
@@ -246,10 +246,10 @@ describe('SwatchColorPicker', () => {
 
     expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(1, 'should be expanded');
 
-    let menu = wrapper.getDOMNode().ownerDocument.querySelector('.ms-swatchColorPickerMenu');
+    let menu = wrapper.getDOMNode().ownerDocument.querySelector('.ms-swatchColorPickerMenu') as Element;
     expect(menu).to.not.equal(null, 'should have a menu');
 
-    let cell = menu.querySelector('button');
+    let cell = menu.querySelector('button') as HTMLButtonElement;
     expect(cell).to.not.equal(null, 'should find a cell');
 
     ReactTestUtils.Simulate.click(cell);
@@ -302,7 +302,7 @@ describe('SwatchColorPicker', () => {
     let container = reactContainer.getDOMNode();
     expect(container).to.not.equal(null, 'should have a container');
 
-    let item = container.querySelector('[role="gridcell"]');
+    let item = container.querySelector('[role="gridcell"]') as Element;
     expect(item).to.not.equal(null, 'should find a item');
 
     ReactTestUtils.Simulate.click(item);
@@ -322,7 +322,7 @@ describe('SwatchColorPicker', () => {
     let container = reactContainer.getDOMNode();
     expect(container).to.not.equal(null, 'should have a container');
 
-    let item = container.querySelector('[role="button"]');
+    let item = container.querySelector('[role="button"]') as Element;
     expect(item).to.not.equal(null, 'should find a item');
 
     ReactTestUtils.Simulate.click(item);
@@ -342,7 +342,7 @@ describe('SwatchColorPicker', () => {
     let container = reactContainer.getDOMNode();
     expect(container).to.not.equal(null, 'should have a container');
 
-    let cell = container.querySelector('[role="gridcell"]');
+    let cell = container.querySelector('[role="gridcell"]') as Element;
     expect(cell).to.not.equal(null, 'should find a cell');
 
     ReactTestUtils.Simulate.mouseEnter(cell);
@@ -362,7 +362,7 @@ describe('SwatchColorPicker', () => {
     let container = reactContainer.getDOMNode();
     expect(container).to.not.equal(null, 'should have a container');
 
-    let cell = container.querySelector('[role="gridcell"]');
+    let cell = container.querySelector('[role="gridcell"]') as Element;
     expect(cell).to.not.equal(null, 'should find a cell');
 
     ReactTestUtils.Simulate.focus(cell);
@@ -383,7 +383,7 @@ describe('SwatchColorPicker', () => {
     let container = reactContainer.getDOMNode();
     expect(container).to.not.equal(null, 'should have a container');
 
-    let cell = container.querySelector('[role="gridcell"]');
+    let cell = container.querySelector('[role="gridcell"]') as Element;
     expect(cell).to.not.equal(null, 'should find a cell');
     ReactTestUtils.Simulate.mouseEnter(cell);
     ReactTestUtils.Simulate.focus(cell);
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
index 49cb9efb58571..82640975513ae 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
@@ -165,7 +165,7 @@ const SwatchColorPickerOption: React.StatelessComponent<ISwatchColorPickerOption
 
       // Build an SVG for the cell with the given shape and color properties
       return (
-        <svg className={ css(styles.svg, cellShape, cellShape === 'circle' ? styles.circle : '') } viewBox='0 0 20 20' fill={ getColorFromString(item.color).str } >
+        <svg className={ css(styles.svg, cellShape, cellShape === 'circle' ? styles.circle : '') } viewBox='0 0 20 20' fill={ getColorFromString(item.color as string).str } >
           {
             cellShape === 'circle' ?
               <circle cx='50%' cy='50%' r='50%' /> :
@@ -198,14 +198,23 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
 
     this._id = props.id || getId('swatchColorPicker');
 
+    let selectedIndex: number | undefined;
+    if (props.selectedId) {
+      selectedIndex = this._getSelectedIndex(props.swatchColorPickerItems, props.selectedId);
+    }
+
     this.state = {
-      selectedIndex: props.selectedId && this._getSelectedIndex(props.swatchColorPickerItems, props.selectedId),
+      selectedIndex,
       expanded: false
     };
   }
 
   public componentWillReceiveProps(newProps: ISwatchColorPickerProps) {
-    let newSelectedIndex = newProps.selectedId && this._getSelectedIndex(newProps.swatchColorPickerItems, newProps.selectedId);
+    let newSelectedIndex;
+
+    if (newProps.selectedId) {
+      newSelectedIndex = this._getSelectedIndex(newProps.swatchColorPickerItems, newProps.selectedId);
+    }
 
     if (newSelectedIndex !== undefined &&
       newSelectedIndex !== this.state.selectedIndex) {
@@ -230,7 +239,7 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
         { ...this.props }
         color={ colorToSet }
         onClick={ this._onButtonClick }
-        expanded={ this.state.expanded }
+        expanded={ !!this.state.expanded }
         onRenderContainer={ this._onRenderContainer }
         menuIconProps={ menuButtonProps.menuIconProps ?
           menuButtonProps.menuIconProps :
@@ -306,8 +315,8 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
     // context each menuItem is in its own "chunk", only grouped
     // cells are processed as a chunk. This helps with being able
     // to determine the correct aria-posinset and aria-setsize values
-    let firstExecutableItemsPerChunk = this.props.menuButtonProps ?
-      this._getFirstExecutableItemsPerChunk() : undefined;
+    let firstExecutableItemsPerChunk = (this.props.menuButtonProps ?
+      this._getFirstExecutableItemsPerChunk() : undefined) as ISwatchColorPickerItemProps[];
 
     // Did we find any executable items? (e.g. should be calculate the set information)
     let shouldGetSetInfo = (firstExecutableItemsPerChunk && firstExecutableItemsPerChunk.length > 0);
@@ -541,7 +550,7 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
       return;
     }
 
-    let index = item.index;
+    let index = item.index as number;
 
     // If we have a valid index and it is not already
     // selected, select it
@@ -558,7 +567,7 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
 
       // The index that got the click was already selected,
       // clear the selection
-      this._clearColors([this.props.onColorChanged, this.props.onCellHovered, this.props.onCellFocused]);
+      this._clearColors([this.props.onColorChanged!, this.props.onCellHovered!, this.props.onCellFocused!]);
 
       this.setState({
         selectedIndex: undefined,
@@ -582,7 +591,7 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
     }
 
     // Make sure to clear any hover/focus colors
-    this._clearColors([this.props.onCellHovered, this.props.onCellFocused]);
+    this._clearColors([this.props.onCellHovered!, this.props.onCellFocused!]);
 
     this.setState({
       expanded: false
@@ -608,7 +617,7 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
    */
   @autobind
   private _clearFocusColorOnMenuItem(id?: string, color?: string) {
-    this._clearColors([this.props.onCellFocused]);
+    this._clearColors([this.props.onCellFocused!]);
   }
 
   /**
@@ -659,7 +668,7 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
    */
   @autobind
   private _onDismiss() {
-    this._clearColors([this.props.onCellHovered, this.props.onCellFocused]);
+    this._clearColors([this.props.onCellHovered!, this.props.onCellFocused!]);
 
     this.setState({
       expanded: false
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts b/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts
index d4f709035f9a6..c0bdcdc4a72c1 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts
@@ -4,7 +4,7 @@ import { IIconProps } from '../../Icon';
 
 export interface ITextField {
   /** Gets the current value of the input. */
-  value: string;
+  value: string | undefined;
 
   /** Sets focus to the input. */
   focus: () => void;
@@ -127,7 +127,7 @@ export interface ITextFieldProps extends React.HTMLAttributes<HTMLInputElement |
   /**
    * Callback for the onNotifyValidationResult event.
    */
-  onNotifyValidationResult?: (errorMessage: string, value: string) => void;
+  onNotifyValidationResult?: (errorMessage: string, value: string | undefined) => void;
 
   /**
    * The method is used to get the validation error message and determine whether the input value is valid or not.
@@ -142,7 +142,7 @@ export interface ITextFieldProps extends React.HTMLAttributes<HTMLInputElement |
    *   - The rejected, the value is thrown away.
    *
    */
-  onGetErrorMessage?: (value: string) => string | PromiseLike<string>;
+  onGetErrorMessage?: (value: string) => string | PromiseLike<string> | undefined;
 
   /**
    * Text field will start to validate after users stop typing for `deferredValidationTime` milliseconds.
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index d3455638e257b..f92b13f159821 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -53,9 +53,9 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
   private _isMounted: boolean;
   private _lastValidation: number;
   private _latestValue: string;
-  private _latestValidateValue: string;
+  private _latestValidateValue: string | undefined;
   private _isDescriptionAvailable: boolean;
-  private _textElement: HTMLInputElement | HTMLTextAreaElement;
+  private _textElement: HTMLTextAreaElement;
 
   public constructor(props: ITextFieldProps) {
     super(props);
@@ -89,7 +89,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
   /**
    * Gets the current value of the text field.
    */
-  public get value(): string {
+  public get value(): string | undefined {
     return this.state.value;
   }
 
@@ -140,7 +140,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
       onRenderAddon = this._onRenderAddon
     } = this.props;
     let { isFocused } = this.state;
-    const errorMessage: string = this._errorMessage;
+    const errorMessage = this._errorMessage;
     this._isDescriptionAvailable = Boolean(description || errorMessage);
 
     const textFieldClassName = css('ms-TextField', styles.root, className, {
@@ -264,7 +264,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
   }
 
   private _getTextElementClassName(): string {
-    const errorMessage: string = this._errorMessage;
+    const errorMessage = this._errorMessage;
     let textFieldClassName: string;
 
     if (this.props.multiline && !this.props.resizable) {
@@ -278,7 +278,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
     });
   }
 
-  private get _errorMessage(): string {
+  private get _errorMessage(): string | undefined {
     let { errorMessage } = this.state;
     if (!errorMessage) {
       errorMessage = this.props.errorMessage;
@@ -357,19 +357,19 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
       this._delayedValidate(value);
     }
 
-    const { onBeforeChange } = this.props;
+    const onBeforeChange = this.props.onBeforeChange as (newValue: any) => void;
     onBeforeChange(value);
   }
 
-  private _validate(value: string): void {
+  private _validate(value: string | undefined): void {
     // In case of _validate called multi-times during executing validate logic with promise return.
     if (this._latestValidateValue === value) {
       return;
     }
 
     this._latestValidateValue = value;
-    let { onGetErrorMessage } = this.props;
-    let result: string | PromiseLike<string> = onGetErrorMessage(value || '');
+    let onGetErrorMessage = this.props.onGetErrorMessage as (value: string) => string | PromiseLike<string> | undefined;
+    let result = onGetErrorMessage(value || '');
 
     if (result !== undefined) {
       if (typeof result === 'string') {
@@ -392,7 +392,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
     }
   }
 
-  private _notifyAfterValidate(value: string, errorMessage: string): void {
+  private _notifyAfterValidate(value: string | undefined, errorMessage: string): void {
     if (this._isMounted &&
       value === this.state.value &&
       this.props.onNotifyValidationResult) {
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
index 9f5f6f9eabbfe..c470125009a67 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
@@ -18,7 +18,7 @@ describe('Toggle', () => {
       />
     );
     let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
-    let labelElement = renderedDOM.querySelector('.ms-Toggle-label');
+    let labelElement = renderedDOM.querySelector('.ms-Toggle-label') as Element;
 
     expect(labelElement.textContent).to.equal('Label');
   });
@@ -31,7 +31,7 @@ describe('Toggle', () => {
       />
     );
     let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
-    let labelElement = renderedDOM.querySelector('button');
+    let labelElement = renderedDOM.querySelector('button') as Element;
 
     expect(labelElement.getAttribute('aria-label')).to.equal('offLabel');
   });
@@ -41,7 +41,7 @@ describe('Toggle', () => {
     let callback = (isToggled: boolean) => {
       isToggledValue = isToggled;
     };
-    let component;
+    let component: any;
 
     ReactTestUtils.renderIntoDocument<React.ReactInstance>(
       <Toggle
@@ -51,7 +51,7 @@ describe('Toggle', () => {
       />
     );
     let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
-    let button = renderedDOM.querySelector('button');
+    let button = renderedDOM.querySelector('button') as HTMLButtonElement;
 
     ReactTestUtils.Simulate.click(button);
     expect(isToggledValue).to.equal(true);
@@ -59,7 +59,7 @@ describe('Toggle', () => {
   });
 
   it(`doesn't update the state if the user provides checked`, () => {
-    let component;
+    let component: any;
 
     ReactTestUtils.renderIntoDocument(
       <Toggle
@@ -69,7 +69,7 @@ describe('Toggle', () => {
       />
     );
     let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
-    let button = renderedDOM.querySelector('button');
+    let button = renderedDOM.querySelector('button') as HTMLButtonElement;
 
     ReactTestUtils.Simulate.click(button);
 
@@ -90,7 +90,7 @@ describe('Toggle', () => {
   });
 
   it(`doesn't trigger onSubmit when placed inside a form`, () => {
-    let component;
+    let component: any;
     const onSubmit = sinon.spy();
 
     const wrapper = mount(
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts
index 017db4af63e93..6d40f12abfd77 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts
@@ -77,7 +77,7 @@ export interface IBaseAutoFillProps extends React.HTMLAttributes<HTMLInputElemen
    *  in to the auto fill's componentWillReceiveProps
    * @returns {string} - the updated value to set, if needed
    */
-  updateValueInWillReceiveProps?: () => string;
+  updateValueInWillReceiveProps?: () => string | null;
 
   /**
    * Handler for checking if the full value of the input should
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index c81dbf1164a3b..bab321bfd4b4b 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -41,7 +41,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   protected suggestionStore: SuggestionsController<T>;
   protected SuggestionOfProperType = Suggestions as new (props: ISuggestionsProps<T>) => Suggestions<T>;
-  protected loadingTimer: number;
+  protected loadingTimer: number | undefined;
   protected currentPromise: PromiseLike<any>;
 
   constructor(basePickerProps: P) {
@@ -141,7 +141,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     );
   }
 
-  protected renderSuggestions(): JSX.Element {
+  protected renderSuggestions(): JSX.Element | null {
     let TypedSuggestion = this.SuggestionOfProperType;
     return this.state.suggestionsVisible ? (
       <Callout
@@ -169,7 +169,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   }
 
   protected renderItems(): JSX.Element[] {
-    let { onRenderItem } = this.props;
+    let onRenderItem = this.props.onRenderItem as (props: IPickerItemProps<T>) => JSX.Element;
     let { items } = this.state;
     return items.map((item: any, index: number) => onRenderItem({
       item,
@@ -213,7 +213,8 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   }
 
   protected onEmptyInputFocus() {
-    let suggestions: T[] | PromiseLike<T[]> = this.props.onEmptyInputFocus(this.state.items);
+    let onEmptyInputFocus = this.props.onEmptyInputFocus as (selectedItems?: T[]) => T[] | PromiseLike<T[]>;
+    let suggestions: T[] | PromiseLike<T[]> = onEmptyInputFocus(this.state.items);
     this.updateSuggestionsList(suggestions);
   }
 
@@ -277,7 +278,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   protected resolveNewValue(updatedValue: string, suggestions: T[]) {
     this.suggestionStore.updateSuggestions(suggestions, 0);
-    let itemValue: string = undefined;
+    let itemValue: string | undefined = undefined;
 
     if (this.suggestionStore.currentSuggestion) {
       itemValue = this._getTextFromItem(this.suggestionStore.currentSuggestion.item, updatedValue);
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
index 3843ee5c1abe1..c0843534f3be5 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
@@ -8,7 +8,7 @@ import * as stylesImport from '../PeoplePicker.scss';
 const styles: any = stylesImport;
 
 export const SuggestionItemNormal: (persona: IPersonaProps, suggestionProps?: IBasePickerSuggestionsProps) => JSX.Element = (personaProps: IPersonaProps, suggestionItemProps?: ISuggestionItemProps<any>) => {
-  let { onRemoveItem, onClick, showRemoveButton } = suggestionItemProps;
+  let { onRemoveItem, onClick, showRemoveButton } = suggestionItemProps!;
   return (
     <div className={ css('ms-PeoplePicker-personaContent', styles.peoplePickerPersonaContent) }>
       <Persona
@@ -23,7 +23,7 @@ export const SuggestionItemNormal: (persona: IPersonaProps, suggestionProps?: IB
 };
 
 export const SuggestionItemSmall: (persona: IPersonaProps, suggestionProps?: IBasePickerSuggestionsProps) => JSX.Element = (personaProps: IPersonaProps, suggestionItemProps?: ISuggestionItemProps<any>) => {
-  let { onRemoveItem, onClick } = suggestionItemProps;
+  let { onRemoveItem, onClick } = suggestionItemProps!;
   return (
     <div className={ css('ms-PeoplePicker-personaContent', styles.peoplePickerPersonaContent) }>
       <Persona
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index f3a1132fa8fab..e662c04317cd9 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -65,7 +65,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
   }
 
   public render() {
-    let currentPicker: JSX.Element;
+    let currentPicker: JSX.Element | undefined = undefined;
 
     switch (this.state.currentPicker) {
       case 1:
@@ -83,6 +83,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
       case 5:
         currentPicker = this._renderLimitedSearch();
         break;
+      default:
     }
 
     return (
@@ -114,7 +115,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
       <ListPeoplePicker
         onResolveSuggestions={ this._onFilterChanged }
         onEmptyInputFocus={ this._returnMostRecentlyUsed }
-        getTextFromItem={ (persona: IPersonaProps) => persona.primaryText }
+        getTextFromItem={ (persona: IPersonaProps) => persona.primaryText as string }
         className={ 'ms-PeoplePicker' }
         pickerSuggestionsProps={ suggestionProps }
         key={ 'list' }
@@ -129,7 +130,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
       <NormalPeoplePicker
         onResolveSuggestions={ this._onFilterChanged }
         onEmptyInputFocus={ this._returnMostRecentlyUsed }
-        getTextFromItem={ (persona: IPersonaProps) => persona.primaryText }
+        getTextFromItem={ (persona: IPersonaProps) => persona.primaryText as string }
         pickerSuggestionsProps={ suggestionProps }
         className={ 'ms-PeoplePicker' }
         key={ 'normal' }
@@ -144,7 +145,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
       <CompactPeoplePicker
         onResolveSuggestions={ this._onFilterChanged }
         onEmptyInputFocus={ this._returnMostRecentlyUsed }
-        getTextFromItem={ (persona: IPersonaProps) => persona.primaryText }
+        getTextFromItem={ (persona: IPersonaProps) => persona.primaryText as string }
         pickerSuggestionsProps={ suggestionProps }
         className={ 'ms-PeoplePicker' }
         onRemoveSuggestion={ this._onRemoveSuggestion }
@@ -158,7 +159,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
       <CompactPeoplePicker
         onResolveSuggestions={ this._onFilterChanged }
         onEmptyInputFocus={ this._returnMostRecentlyUsed }
-        getTextFromItem={ (persona: IPersonaProps) => persona.primaryText }
+        getTextFromItem={ (persona: IPersonaProps) => persona.primaryText as string }
         className={ 'ms-PeoplePicker' }
         defaultSelectedItems={ people.splice(0, 3) }
         key={ 'list' }
@@ -177,7 +178,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
       <CompactPeoplePicker
         onResolveSuggestions={ this._onFilterChangedWithLimit }
         onEmptyInputFocus={ this._returnMostRecentlyUsedWithLimit }
-        getTextFromItem={ (persona: IPersonaProps) => persona.primaryText }
+        getTextFromItem={ (persona: IPersonaProps) => persona.primaryText as string }
         className={ 'ms-PeoplePicker' }
         onGetMoreResults={ this._onFilterChanged }
         pickerSuggestionsProps={ limitedSearchSuggestionProps }
@@ -262,7 +263,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
   }
 
   private _filterPersonasByText(filterText: string): IPersonaProps[] {
-    return this.state.peopleList.filter(item => this._doesTextStartWith(item.primaryText, filterText));
+    return this.state.peopleList.filter(item => this._doesTextStartWith(item.primaryText as string, filterText));
   }
 
   private _doesTextStartWith(text: string, filterText: string): boolean {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index ee310ff48012a..421f10f65db1b 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -90,7 +90,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
       showRemoveButtons,
     } = this.props;
 
-    let noResults: () => JSX.Element = () => {
+    let noResults = () => {
       return noResultsFoundText ?
         <div className={ css('ms-Suggestions-none', styles.suggestionsNone) }>
           { noResultsFoundText }
@@ -98,7 +98,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
     };
 
     let headerText = isMostRecentlyUsedVisible && mostRecentlyUsedHeaderText ? mostRecentlyUsedHeaderText : null;
-    let footerTitle = (suggestions.length >= resultsMaximumNumber) ? resultsFooterFull : resultsFooter;
+    let footerTitle = (suggestions.length >= (resultsMaximumNumber as number)) ? resultsFooterFull : resultsFooter;
     return (
       <div className={ css(
         'ms-Suggestions',
@@ -114,7 +114,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
             label={ loadingText }
           />) }
         { (!suggestions || !suggestions.length) && !isLoading ?
-          (onRenderNoResultFound ? onRenderNoResultFound(null, noResults) : noResults()) :
+          (onRenderNoResultFound ? onRenderNoResultFound(undefined, noResults) : noResults()) :
           this._renderSuggestions()
         }
         { searchForMoreText && moreSuggestionsAvailable && (
@@ -136,7 +136,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
         {
           !moreSuggestionsAvailable && !isMostRecentlyUsedVisible && !isSearching ?
             (<div className={ css('ms-Suggestions-title', styles.suggestionsTitle) }>
-              { footerTitle(this.props) }
+              { footerTitle && footerTitle(this.props) }
             </div>) : (null)
         }
       </div>
@@ -188,7 +188,8 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
               className={ suggestionsItemClassName }
               showRemoveButton={ showRemoveButtons }
               onRemoveItem={ (ev: React.MouseEvent<HTMLElement>) => {
-                this.props.onSuggestionRemove(ev, suggestion.item, index);
+                let onSuggestionRemove = this.props.onSuggestionRemove!;
+                onSuggestionRemove(ev, suggestion.item, index);
                 ev.stopPropagation();
               }
               }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
index 36684da471eb7..48b60be1f6418 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
@@ -266,7 +266,7 @@ const data: IFullDocumentCardProps[] = [
 ];
 
 export const SuggestedDocumentItem: (documentProps: IFullDocumentCardProps) => JSX.Element = (documentProps: IFullDocumentCardProps) => {
-  return (<div> { documentProps.documentTitleProps.title } </div>);
+  return (<div> { documentProps.documentTitleProps && documentProps.documentTitleProps.title } </div>);
 };
 
 export const SuggestedBigItem: (documentProps: IFullDocumentCardProps, itemProps: ISuggestionItemProps<any>) => JSX.Element = (documentProps: IFullDocumentCardProps, itemProps: ISuggestionItemProps<any>) => {
@@ -279,8 +279,8 @@ export const SuggestedBigItem: (documentProps: IFullDocumentCardProps, itemProps
   } = itemProps;
   return (
     <Persona
-      imageUrl={ documentPreviewProps.previewImages[0].previewImageSrc }
-      primaryText={ documentTitleProps.title }
+      imageUrl={ documentPreviewProps && documentPreviewProps.previewImages[0].previewImageSrc }
+      primaryText={ documentTitleProps && documentTitleProps.title }
       size={ PersonaSize.small } />
   );
 };
@@ -293,19 +293,25 @@ export const SelectedDocumentItem: (documentProps: IPickerItemProps<IFullDocumen
     documentTitleProps
   } = documentProps.item;
   let actions: IButtonProps[] = [];
-  documentActionsProps.actions.forEach((action: IButtonProps) => actions.push(action));
-  actions.push({
-    icon: 'Cancel', onClick: (ev: any) => { documentProps.onRemoveItem(); }
-  });
+  if (documentActionsProps) {
+    documentActionsProps.actions.forEach((action: IButtonProps) => actions.push(action));
+    actions.push({
+      icon: 'Cancel', onClick: (ev: any) => {
+        if (documentProps.onRemoveItem) {
+          documentProps.onRemoveItem();
+        }
+      }
+    });
+  }
 
   return (
     <DocumentCard
       onClick={ () => { console.log('You clicked the card.'); } }
     >
-      <DocumentCardPreview { ...documentPreviewProps } />
+      <DocumentCardPreview { ...(documentPreviewProps as IDocumentCardPreviewProps) } />
       <DocumentCardLocation location='Marketing Documents' locationHref='http://microsoft.com' ariaLabel='Location, Marketing Documents' />
-      <DocumentCardTitle { ...documentTitleProps } />
-      <DocumentCardActivity { ...documentActivityProps } />
+      <DocumentCardTitle { ...(documentTitleProps as IDocumentCardTitleProps) } />
+      <DocumentCardActivity { ...(documentActivityProps as IDocumentCardActivityProps) } />
       <DocumentCardActions actions={ actions } />
     </DocumentCard>
   );
@@ -349,14 +355,15 @@ export class PickerCustomResultExample extends React.Component<any, IPeoplePicke
   }
 
   private _onFilterChanged(filterText: string, items: IFullDocumentCardProps[]) {
-    return filterText ? data.filter(item => item.documentTitleProps.title.toLowerCase().indexOf(filterText.toLowerCase()) === 0).filter(item => !this._listContainsDocument(item, items)) : [];
+    return filterText ? data.filter(item => item.documentTitleProps && item.documentTitleProps.title.toLowerCase().indexOf(filterText.toLowerCase()) === 0).filter(item => !this._listContainsDocument(item, items)) : [];
   }
 
   private _listContainsDocument(document: IFullDocumentCardProps, items: IFullDocumentCardProps[]) {
     if (!items || !items.length || items.length === 0) {
       return false;
     }
-    return items.filter(item => item.documentTitleProps.title === document.documentTitleProps.title).length > 0;
+    let documentTitle = document.documentTitleProps && document.documentTitleProps.title;
+    return items.filter(item => (item.documentTitleProps && item.documentTitleProps.title) === documentTitle).length > 0;
   }
 }
 
diff --git a/packages/office-ui-fabric-react/src/utilities/color/colors.ts b/packages/office-ui-fabric-react/src/utilities/color/colors.ts
index 07870e9869a07..7e8a86003531f 100644
--- a/packages/office-ui-fabric-react/src/utilities/color/colors.ts
+++ b/packages/office-ui-fabric-react/src/utilities/color/colors.ts
@@ -25,13 +25,13 @@ export interface IColor extends IRGB, IHSV {
 }
 
 export function cssColor(color: string): IRGB {
-  return _named(color)
+  return (_named(color)
     || _hex3(color)
     || _hex6(color)
     || _rgb(color)
     || _rgba(color)
     || _hsl(color)
-    || _hsla(color);
+    || _hsla(color) as IRGB);
 }
 
 export function rgb2hex(r: number, g: number, b: number): string {
@@ -49,7 +49,7 @@ export function hsv2hex(h: number, s: number, v: number): string {
 }
 
 export function rgb2hsv(r: number, g: number, b: number): IHSV {
-  let h;
+  let h = NaN;
   let s;
   let v;
   const max = Math.max(r, g, b);
@@ -206,7 +206,7 @@ export function updateSV(color: IColor, s: number, v: number): IColor {
     hex: hex,
     r: r,
     s: s,
-    str: (color.a === 100) ? `#${hex}` : `rgba(${r}, ${g}, ${b}, ${color.a / 100})`,
+    str: (color.a === 100) ? `#${hex}` : `rgba(${r}, ${g}, ${b}, ${(color.a as number) / 100})`,
     v: v
   };
 }
@@ -223,7 +223,7 @@ export function updateH(color: IColor, h: number): IColor {
     hex: hex,
     r: r,
     s: color.s,
-    str: (color.a === 100) ? `#${hex}` : `rgba(${r}, ${g}, ${b}, ${color.a / 100})`,
+    str: (color.a === 100) ? `#${hex}` : `rgba(${r}, ${g}, ${b}, ${(color.a as number) / 100})`,
     v: color.v
   };
 }
@@ -256,7 +256,7 @@ function _named(str: string) {
 
 function _rgb(str: string) {
   if (0 === str.indexOf('rgb(')) {
-    str = str.match(/rgb\(([^)]+)\)/)[1];
+    str = (str.match(/rgb\(([^)]+)\)/)!)[1];
 
     const parts = str.split(/ *, */).map(Number);
 
@@ -271,7 +271,7 @@ function _rgb(str: string) {
 
 function _rgba(str: string) {
   if (str.indexOf('rgba(') === 0) {
-    str = str.match(/rgba\(([^)]+)\)/)[1];
+    str = (str.match(/rgba\(([^)]+)\)/)!)[1];
 
     const parts = str.split(/ *, */).map(Number);
 
@@ -308,7 +308,7 @@ function _hex3(str: string) {
 
 function _hsl(str: string) {
   if (str.indexOf('hsl(') === 0) {
-    str = str.match(/hsl\(([^)]+)\)/)[1];
+    str = (str.match(/hsl\(([^)]+)\)/)!)[1];
     const parts = str.split(/ *, */);
 
     const h = parseInt(parts[0], 10);
@@ -324,7 +324,7 @@ function _hsl(str: string) {
 
 function _hsla(str: string) {
   if (str.indexOf('hsla(') === 0) {
-    str = str.match(/hsla\(([^)]+)\)/)[1];
+    str = (str.match(/hsla\(([^)]+)\)/)!)[1];
 
     const parts = str.split(/ *, */);
     const h = parseInt(parts[0], 10);
diff --git a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
index 0f667c0bf77e7..dc558d624e91c 100644
--- a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
+++ b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
@@ -1,4 +1,5 @@
 import { DayOfWeek, DateRangeType } from '../dateValues/DateValues';
+import { assertNever } from '../../Utilities';
 
 const DAYS_IN_WEEK = 7;
 const MONTHS_IN_YEAR = 12;
@@ -117,7 +118,7 @@ export function compareDatePart(date1: Date, date2: Date): Number {
  */
 export function getDateRangeArray(date: Date, dateRangeType: DateRangeType, firstDayOfWeek: DayOfWeek): Date[] {
   let datesArray = new Array<Date>();
-  let startDate = null;
+  let startDate: Date;
   let endDate = null;
 
   switch (dateRangeType) {
@@ -135,6 +136,8 @@ export function getDateRangeArray(date: Date, dateRangeType: DateRangeType, firs
       startDate = new Date(date.getFullYear(), date.getMonth(), 1);
       endDate = addMonths(startDate, 1);
       break;
+    default:
+      return assertNever(dateRangeType);
   }
 
   // Populate the dates array with the dates in range
diff --git a/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx b/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx
index f4266b47fbb00..149367a81d329 100644
--- a/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx
@@ -89,10 +89,10 @@ export function withViewport<P extends { viewport?: IViewport }, S>(ComposedComp
       };
 
       let isSizeChanged = (
-        clientRect.width !== viewport.width ||
-        scrollRect.height !== viewport.height);
+        (clientRect && clientRect.width) !== viewport.width ||
+        (scrollRect && scrollRect.height) !== viewport.height);
 
-      if (isSizeChanged && this._resizeAttempts < MAX_RESIZE_ATTEMPTS) {
+      if (isSizeChanged && this._resizeAttempts < MAX_RESIZE_ATTEMPTS && clientRect && scrollRect) {
         this._resizeAttempts++;
         this.setState({
           viewport: {
diff --git a/packages/office-ui-fabric-react/src/utilities/dragdrop/DragDropHelper.tsx b/packages/office-ui-fabric-react/src/utilities/dragdrop/DragDropHelper.tsx
index ca8337c617487..0f56b7d7da29a 100644
--- a/packages/office-ui-fabric-react/src/utilities/dragdrop/DragDropHelper.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/dragdrop/DragDropHelper.tsx
@@ -30,7 +30,7 @@ export class DragDropHelper implements IDragDropHelper {
     dataTransfer?: DataTransfer;
     dropTarget?: IDragDropTarget;
     dragTarget?: IDragDropTarget;
-  };
+  } | null;
   private _selection: ISelection;
   private _activeTargets: {
     [key: string]: {
@@ -302,16 +302,19 @@ export class DragDropHelper implements IDragDropHelper {
         // the inner target (folder), we first set dropTarget to the inner element. But the same event is bubbled to the
         // outer target too, and we need to prevent the outer one from taking over.
         // So, check if the last dropTarget is not a child of the current.
-        if (this._dragData.dropTarget &&
-          this._dragData.dropTarget.key !== key &&
-          !this._isChild(root, this._dragData.dropTarget.root)) {
-          EventGroup.raise(this._dragData.dropTarget.root, 'dragleave');
-          this._dragData.dropTarget = null;
-        }
 
-        if (!this._dragData.dropTarget) {
-          EventGroup.raise(root, 'dragenter');
-          this._dragData.dropTarget = target;
+        if (this._dragData) {
+          if (this._dragData.dropTarget &&
+            this._dragData.dropTarget.key !== key &&
+            !this._isChild(root, this._dragData.dropTarget.root)) {
+            EventGroup.raise(this._dragData.dropTarget.root, 'dragleave');
+            this._dragData.dropTarget = undefined;
+          }
+
+          if (!this._dragData.dropTarget) {
+            EventGroup.raise(root, 'dragenter');
+            this._dragData.dropTarget = target;
+          }
         }
       }
     } else if (this._dragData) {
@@ -337,7 +340,7 @@ export class DragDropHelper implements IDragDropHelper {
     if (this._isDragging) {
       if (this._dragData && this._dragData.dropTarget && this._dragData.dropTarget.key === target.key) {
         EventGroup.raise(target.root, 'dragleave');
-        this._dragData.dropTarget = null;
+        this._dragData.dropTarget = undefined;
       }
     }
   }
@@ -388,13 +391,13 @@ export class DragDropHelper implements IDragDropHelper {
 
   private _isDraggable(target: IDragDropTarget): boolean {
     let { options } = target;
-    return options.canDrag && options.canDrag(options.context.data);
+    return !!(options.canDrag && options.canDrag(options.context.data));
   }
 
   private _isDroppable(target: IDragDropTarget): boolean {
     // TODO: take the drag item into consideration to prevent dragging an item into the same group
     let { options } = target;
-    let dragContext = this._dragData && this._dragData.dragTarget ? this._dragData.dragTarget.options.context : null;
-    return options.canDrop && options.canDrop(options.context, dragContext);
+    let dragContext = this._dragData && this._dragData.dragTarget ? this._dragData.dragTarget.options.context : undefined;
+    return !!(options.canDrop && options.canDrop(options.context, dragContext));
   }
 }
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning.test.ts b/packages/office-ui-fabric-react/src/utilities/positioning.test.ts
index 48bec46671c9a..8561cd8b5d9ad 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning.test.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning.test.ts
@@ -3,7 +3,7 @@ import { positioningFunctions, RectangleEdge } from './positioning';
 import { DirectionalHint } from '../common/DirectionalHint';
 interface ITestValidation {
   callout: Rectangle;
-  beak: Rectangle;
+  beak: Rectangle | null;
 }
 
 interface ITestValues {
@@ -20,7 +20,7 @@ function stringifyResults(expected: any, actual: any) {
 }
 
 function positionCalloutTest(testValues: ITestValues, alignment: DirectionalHint, validate: ITestValidation) {
-  let {callout, target, bounds, beakWidth} = testValues;
+  let { callout, target, bounds, beakWidth } = testValues;
   let gap: number = positioningFunctions._calculateActualBeakWidthInPixels(beakWidth) / 2;
   let result: positioningFunctions.ICallout = positioningFunctions._positionCalloutWithinBounds(callout, target, bounds, positioningFunctions._getPositionData(alignment, target, bounds), gap);
 
@@ -28,11 +28,11 @@ function positionCalloutTest(testValues: ITestValues, alignment: DirectionalHint
 
   assert(result.calloutRectangle.equals(validate.callout), 'Callout not alligned with target ' + stringifyResults(validate.callout, result.calloutRectangle));
 
-  assert(beak.equals(validate.beak), 'Beak is improperly positioned. ' + stringifyResults(validate.beak, beak));
+  assert(beak.equals(validate.beak as Rectangle), 'Beak is improperly positioned. ' + stringifyResults(validate.beak, beak));
 }
 
 function validateNoBeakTest(testValues: ITestValues, alignment: DirectionalHint, validate: ITestValidation) {
-  let {callout, target, bounds, beakWidth} = testValues;
+  let { callout, target, bounds, beakWidth } = testValues;
   let result: positioningFunctions.ICallout = positioningFunctions._positionCalloutWithinBounds(callout, target, bounds, positioningFunctions._getPositionData(alignment, target, bounds), beakWidth);
 
   assert(result.calloutRectangle.equals(validate.callout), 'No Beak: Callout not alligned with target ' + stringifyResults(validate.callout, result.calloutRectangle));
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning.ts b/packages/office-ui-fabric-react/src/utilities/positioning.ts
index cd32f7eb7be1a..475223da15a84 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning.ts
@@ -160,7 +160,7 @@ export function getRelativePositions(
   props: IPositionProps,
   hostElement: HTMLElement,
   calloutElement: HTMLElement): IPositionInfo {
-  let beakWidth: number = !props.isBeakVisible ? 0 : props.beakWidth;
+  let beakWidth: number = !props.isBeakVisible ? 0 : (props.beakWidth || 0);
   let borderWidth: number = positioningFunctions._getBorderSize(calloutElement);
   let gap: number = positioningFunctions._calculateActualBeakWidthInPixels(beakWidth) / 2 + (props.gapSpace ? props.gapSpace : 0);
   let boundingRect: Rectangle = props.bounds ?
@@ -173,7 +173,7 @@ export function getRelativePositions(
     props.targetPoint,
     props.useTargetPoint);
   let positionData: PositionData = positioningFunctions._getPositionData(
-    props.directionalHint,
+    props.directionalHint as DirectionalHint,
     targetRect,
     boundingRect,
     props.coverTarget);
@@ -283,7 +283,8 @@ export module positioningFunctions {
       if (targetPoint) {
         targetRectangle = new Rectangle(targetPoint.x, targetPoint.x, targetPoint.y, targetPoint.y);
       } else {
-        targetRectangle = new Rectangle(ev.clientX, ev.clientX, ev.clientY, ev.clientY);
+        let event = ev as MouseEvent;
+        targetRectangle = new Rectangle(event.clientX, event.clientX, event.clientY, event.clientY);
       }
     } else {
       if (!targetElement) {
@@ -414,7 +415,7 @@ export module positioningFunctions {
 
   export function _finalizeBeakPosition(beakRectangle: Rectangle, callout: ICallout, estimatedTargetPoint: IPoint, border: number): Rectangle {
     let beakPixelSize: number = _calculateActualBeakWidthInPixels(beakRectangle.width) / 2;
-    let innerRect: Rectangle = null;
+    let innerRect: Rectangle | null = null;
     let beakPoint: IPoint = { x: beakRectangle.width / 2, y: beakRectangle.width / 2 };
 
     if (callout.calloutEdge === RectangleEdge.bottom || callout.calloutEdge === RectangleEdge.top) {
@@ -686,11 +687,11 @@ export module positioningFunctions {
   }
 
   export function _getBorderSize(element: HTMLElement): number {
-    let styles: CSSStyleDeclaration = getComputedStyle(element, null);
-    let topBorder: number = parseFloat(styles.borderTopWidth);
-    let bottomBorder: number = parseFloat(styles.borderBottomWidth);
-    let leftBorder: number = parseFloat(styles.borderLeftWidth);
-    let rightBorder: number = parseFloat(styles.borderRightWidth);
+    let styles: CSSStyleDeclaration = getComputedStyle(element, undefined);
+    let topBorder: number = parseFloat(styles.borderTopWidth || '');
+    let bottomBorder: number = parseFloat(styles.borderBottomWidth || '');
+    let leftBorder: number = parseFloat(styles.borderLeftWidth || '');
+    let rightBorder: number = parseFloat(styles.borderRightWidth || '');
 
     // If any of the borders are NaN default to 0
     if (isNaN(topBorder) || isNaN(bottomBorder) || isNaN(leftBorder) || isNaN(rightBorder)) {
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts b/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
index eb166dd28ebbe..55be785d3074a 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
@@ -14,13 +14,13 @@ export class Selection implements ISelection {
 
   private _changeEventSuppressionCount: number;
   private _items: IObjectWithKey[];
-  private _selectedItems: IObjectWithKey[];
+  private _selectedItems: IObjectWithKey[] | null;
   private _isAllSelected: boolean;
   private _exemptedIndices: { [index: string]: boolean };
   private _exemptedCount: number;
   private _keyToIndexMap: { [key: string]: number };
   private _anchoredIndex: number;
-  private _onSelectionChanged: () => void;
+  private _onSelectionChanged: (() => void) | undefined;
   private _hasChanged: boolean;
   private _unselectableIndices: { [index: string]: boolean };
   private _unselectableCount: number;
@@ -31,7 +31,7 @@ export class Selection implements ISelection {
       getKey,
       canSelectItem = (item: IObjectWithKey) => { return true; }
     } = options;
-    this.getKey = getKey || ((item: IObjectWithKey, index?: number) => (item ? item.key : String(index)));
+    this.getKey = getKey || ((item: IObjectWithKey, index?: number) => ((item && item.key) ? item.key : String(index)));
 
     this._changeEventSuppressionCount = 0;
     this._exemptedCount = 0;
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
index bd70d9ea66f65..a07ca5f841d67 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
@@ -59,16 +59,16 @@ function _initializeSelection(selectionMode = SelectionMode.multiple) {
   );
 
   _componentElement = ReactDOM.findDOMNode(_selectionZone);
-  _toggleAll = _componentElement.querySelector('#toggleAll');
-  _surface0 = _componentElement.querySelector('#surface0');
-  _invoke0 = _componentElement.querySelector('#invoke0');
-  _toggle0 = _componentElement.querySelector('#toggle0');
-  _surface1 = _componentElement.querySelector('#surface1');
-  _invoke1 = _componentElement.querySelector('#invoke1');
-  _toggle1 = _componentElement.querySelector('#toggle1');
-  _invoke2 = _componentElement.querySelector('#invoke2');
-  _toggle2 = _componentElement.querySelector('#toggle2');
-  _surface3 = _componentElement.querySelector('#surface3');
+  _toggleAll = _componentElement.querySelector('#toggleAll')!;
+  _surface0 = _componentElement.querySelector('#surface0')!;
+  _invoke0 = _componentElement.querySelector('#invoke0')!;
+  _toggle0 = _componentElement.querySelector('#toggle0')!;
+  _surface1 = _componentElement.querySelector('#surface1')!;
+  _invoke1 = _componentElement.querySelector('#invoke1')!;
+  _toggle1 = _componentElement.querySelector('#toggle1')!;
+  _invoke2 = _componentElement.querySelector('#invoke2')!;
+  _toggle2 = _componentElement.querySelector('#toggle2')!;
+  _surface3 = _componentElement.querySelector('#surface3')!;
 
   _onItemInvokeCalled = 0;
   _lastItemInvoked = undefined;
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
index 8bc4881f3c40c..2ce61c919873f 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
@@ -168,7 +168,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
         }
       }
 
-      target = getParent(target);
+      target = getParent(target) as HTMLElement;
     }
   }
 
@@ -207,7 +207,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
         }
       }
 
-      target = getParent(target);
+      target = getParent(target) as HTMLElement;
     }
   }
 
@@ -232,7 +232,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
       if (this._hasAttribute(target, SELECTION_DISABLED_ATTRIBUTE_NAME)) {
         return true;
       }
-      target = getParent(target);
+      target = getParent(target) as HTMLElement;
     }
 
     return false;
@@ -266,10 +266,10 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
           break;
         }
 
-        target = getParent(target);
+        target = getParent(target) as HTMLElement;
       }
 
-      target = getParent(target);
+      target = getParent(target) as HTMLElement;
     }
   }
 
@@ -337,7 +337,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
           break;
         }
 
-        target = getParent(target);
+        target = getParent(target) as HTMLElement;
       }
     }
 
@@ -445,7 +445,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     this._isMetaPressed = ev.metaKey;
   }
 
-  private _findItemRoot(target: HTMLElement): HTMLElement {
+  private _findItemRoot(target: HTMLElement): HTMLElement | undefined {
     let { selection } = this.props;
 
     while (target !== this.refs.root) {
@@ -456,7 +456,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
         break;
       }
 
-      target = getParent(target);
+      target = getParent(target) as HTMLElement;
     }
 
     if (target === this.refs.root) {
@@ -475,7 +475,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
 
     while (!isToggle && element !== this.refs.root) {
       isToggle = element.getAttribute(attributeName) === 'true';
-      element = getParent(element);
+      element = getParent(element) as HTMLElement;
     }
 
     return isToggle;
@@ -494,7 +494,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
           return false;
         }
 
-        element = getParent(element);
+        element = getParent(element) as HTMLElement;
       }
     }
 
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx b/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
index 97859f7c177f7..09086313a0b40 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
@@ -17,8 +17,8 @@ import './Selection.Example.scss';
 const ITEM_COUNT = 100;
 
 export interface ISelectionBasicExampleState {
-  items?: any[];
-  selection?: ISelection;
+  items: any[];
+  selection: ISelection;
   selectionMode?: SelectionMode;
   canSelect?: string;
 }
@@ -190,7 +190,11 @@ export class SelectionBasicExample extends React.Component<any, ISelectionBasicE
 export class SelectionItemExample extends React.Component<ISelectionItemExampleProps, {}> {
   public render() {
     let { item, itemIndex, selection, selectionMode } = this.props;
-    let isSelected = selection.isIndexSelected(itemIndex);
+    let isSelected = false;
+
+    if (selection && itemIndex) {
+      selection.isIndexSelected(itemIndex);
+    }
 
     return (
       <div className='ms-SelectionItemExample' data-selection-index={ itemIndex }>
diff --git a/packages/office-ui-fabric-react/src/visualtest/RunVisualTest.ts b/packages/office-ui-fabric-react/src/visualtest/RunVisualTest.ts
index 113f5e888e046..8ba75fcad103b 100644
--- a/packages/office-ui-fabric-react/src/visualtest/RunVisualTest.ts
+++ b/packages/office-ui-fabric-react/src/visualtest/RunVisualTest.ts
@@ -5,58 +5,58 @@ declare var phantomcss: IPhantomCSS;
 declare var casper: Casper;
 
 export function defaultScreenshot(params: IRunVisualTest) {
-  params.imageSelector = params.imageSelector || params.selector;
+  let imageSelector = params.imageSelector || params.selector;
 
   casper.then(() => {
-    phantomcss.screenshot(params.imageSelector, params.fileName + '_default');
+    phantomcss.screenshot(imageSelector, params.fileName + '_default');
   });
   if (params.childParams) {
     params.childParams.commands.forEach(commandList => {
-      commandList(params.childParams);
+      commandList(params.childParams!);
     });
   }
 }
 
 export function mouseMoveScreenshot(params: IRunVisualTest) {
-  params.imageSelector = params.imageSelector || params.selector;
+  let imageSelector = params.imageSelector || params.selector;
 
   casper.then(function () {
     this.mouse.move(params.selector);
-    phantomcss.screenshot(params.imageSelector, params.fileName + '_mouseMove');
+    phantomcss.screenshot(imageSelector, params.fileName + '_mouseMove');
   });
   if (params.childParams) {
     params.childParams.commands.forEach(commandList => {
-      commandList(params.childParams);
+      commandList(params.childParams!);
     });
   }
 }
 
 export function mouseDownScreenshot(params: IRunVisualTest) {
-  params.imageSelector = params.imageSelector || params.selector;
+  let imageSelector = params.imageSelector || params.selector;
 
   casper.then(function () {
     this.mouse.down(params.selector);
-    phantomcss.screenshot(params.imageSelector, params.fileName + '_mouseDown');
+    phantomcss.screenshot(imageSelector, params.fileName + '_mouseDown');
   });
   if (params.childParams) {
     params.childParams.commands.forEach(commandList => {
-      commandList(params.childParams);
+      commandList(params.childParams!);
     });
   }
 }
 export function mouseClickScreenshot(params: IRunVisualTest) {
-  params.imageSelector = params.imageSelector || params.selector;
+  let imageSelector = params.imageSelector || params.selector;
 
   casper.then(function () {
     this.click(params.selector);
-    phantomcss.screenshot(params.imageSelector, params.fileName + '_mouseClick');
+    phantomcss.screenshot(imageSelector, params.fileName + '_mouseClick');
   });
   casper.then(function () {
     this.click(params.selector);
   });
   if (params.childParams) {
     params.childParams.commands.forEach(commandList => {
-      commandList(params.childParams);
+      commandList(params.childParams!);
     });
   }
 }
@@ -69,7 +69,7 @@ export function mouseSingleClickScreenshot(params: IRunVisualTest) {
   });
   if (params.childParams) {
     params.childParams.commands.forEach(commandList => {
-      commandList(params.childParams);
+      commandList(params.childParams!);
     });
   }
 }
diff --git a/packages/utilities/api/utilities.api.ts b/packages/utilities/api/utilities.api.ts
index 6679ce45a2025..b01be0aacbccb 100644
--- a/packages/utilities/api/utilities.api.ts
+++ b/packages/utilities/api/utilities.api.ts
@@ -1,3 +1,5 @@
+export function assertNever(x: never): never;
+
 // @public
 export function assign(target: any, ...args: any[]): any;
 
diff --git a/packages/utilities/src/assertNever.ts b/packages/utilities/src/assertNever.ts
new file mode 100644
index 0000000000000..b848dcebd6b7c
--- /dev/null
+++ b/packages/utilities/src/assertNever.ts
@@ -0,0 +1,8 @@
+/**
+ * AssertNever is a utility function that can be used for exhaustiveness checks in switch statements.
+ *
+ * @public
+ */
+export function assertNever(x: never): never {
+  throw new Error('Unexpected object: ' + x);
+}
diff --git a/packages/utilities/src/index.ts b/packages/utilities/src/index.ts
index 9094c0cc70619..a908e44991390 100644
--- a/packages/utilities/src/index.ts
+++ b/packages/utilities/src/index.ts
@@ -13,6 +13,7 @@ export * from './IRenderFunction';
 export * from './KeyCodes';
 export * from './Rectangle';
 export * from './array';
+export * from './assertNever';
 export * from './autobind';
 export * from './css';
 export * from './customizable';

From a93a3a3fc9ef425df4bc6fb990125c0770b97374 Mon Sep 17 00:00:00 2001
From: Eddie Liu <leddie24@gmail.com>
Date: Mon, 17 Jul 2017 15:44:52 -0700
Subject: [PATCH 0271/1641] Dropdown: Change order of native props so className
 prop will overwrite properly (#2223)

* Change order of nativeProps so className prop will overwrite properly.

* Add change file

* Change className so it's below divProps
---
 .../v-edwliu-dropdown-classfix_2017-07-17-18-42.json  | 11 +++++++++++
 .../src/components/Dropdown/Dropdown.tsx              | 10 +++++-----
 2 files changed, 16 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-edwliu-dropdown-classfix_2017-07-17-18-42.json

diff --git a/common/changes/office-ui-fabric-react/v-edwliu-dropdown-classfix_2017-07-17-18-42.json b/common/changes/office-ui-fabric-react/v-edwliu-dropdown-classfix_2017-07-17-18-42.json
new file mode 100644
index 0000000000000..c91d56d5754d9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-edwliu-dropdown-classfix_2017-07-17-18-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: List native props at top of div element",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-edwliu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 0a033bca84a36..5958302bc51cb 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -130,11 +130,6 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
           data-is-focusable={ !disabled }
           ref={ this._resolveRef('_dropDown') }
           id={ id }
-          className={ css('ms-Dropdown', styles.root, className, {
-            'is-open': isOpen,
-            ['is-disabled ' + styles.rootIsDisabled]: disabled,
-            'is-required ': required,
-          }) }
           tabIndex={ disabled ? -1 : 0 }
           aria-expanded={ isOpen ? 'true' : 'false' }
           role='combobox'
@@ -145,6 +140,11 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
           aria-disabled={ disabled }
           aria-owns={ isOpen ? id + '-list' : null }
           { ...divProps }
+          className={ css('ms-Dropdown', styles.root, className, {
+            'is-open': isOpen,
+            ['is-disabled ' + styles.rootIsDisabled]: disabled,
+            'is-required ': required,
+          }) }
           onBlur={ this._onDropdownBlur }
           onKeyDown={ this._onDropdownKeyDown }
           onKeyUp={ this._onDropdownKeyUp }

From da9fc82e21b99e350ef090d15d26e06de61753ec Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 18 Jul 2017 10:11:42 -0700
Subject: [PATCH 0272/1641] Standard button styles (#2238)

* DefaultButton: Make styles match xd file

* Change file
---
 .../standard-button-styles_2017-07-18-16-21.json      | 11 +++++++++++
 .../Button/DefaultButton/DefaultButton.styles.ts      |  8 ++++----
 2 files changed, 15 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/standard-button-styles_2017-07-18-16-21.json

diff --git a/common/changes/office-ui-fabric-react/standard-button-styles_2017-07-18-16-21.json b/common/changes/office-ui-fabric-react/standard-button-styles_2017-07-18-16-21.json
new file mode 100644
index 0000000000000..dd3d67464d354
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/standard-button-styles_2017-07-18-16-21.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DefaultButton: Make styles match design",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
index afc4ffd8f0749..a1671ac2ddb66 100644
--- a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
@@ -39,13 +39,13 @@ export const getStyles = memoizeFunction((
     },
 
     rootPressed: {
-      backgroundColor: theme.palette.themePrimary,
-      color: theme.palette.white
+      backgroundColor: theme.palette.neutralTertiaryAlt,
+      color: theme.palette.neutralDark
     },
 
     rootChecked: {
-      backgroundColor: theme.palette.themePrimary,
-      color: theme.palette.white
+      backgroundColor: theme.palette.neutralTertiaryAlt,
+      color: theme.palette.neutralDark
     },
 
     label: {

From 808742dffd5378cd908cc4ed1bebc175a3702dff Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 18 Jul 2017 10:36:22 -0700
Subject: [PATCH 0273/1641] Breadcrumb: added tooltip for truncated items
 (#2170)

* Removed redundant onRender function and added a tooltip

* Added change file
---
 .../breadcrumb-tooltip_2017-07-10-17-24.json  | 11 +++++++++
 .../src/components/Breadcrumb/Breadcrumb.tsx  | 24 ++++++++++++-------
 .../examples/Breadcrumb.Basic.Example.tsx     |  2 +-
 3 files changed, 27 insertions(+), 10 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/breadcrumb-tooltip_2017-07-10-17-24.json

diff --git a/common/changes/office-ui-fabric-react/breadcrumb-tooltip_2017-07-10-17-24.json b/common/changes/office-ui-fabric-react/breadcrumb-tooltip_2017-07-10-17-24.json
new file mode 100644
index 0000000000000..64d3c994c7c89
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/breadcrumb-tooltip_2017-07-10-17-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Breadcrumb: Uses tooltip when breadcrumb text is truncated",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
index 9260f495510e5..bb5ab6be3a14b 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
@@ -12,6 +12,7 @@ import { IconButton } from '../../Button';
 import { IBreadcrumbProps, IBreadcrumbItem } from './Breadcrumb.Props';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { ResizeGroup } from '../../ResizeGroup';
+import { TooltipHost, TooltipOverflowMode } from '../../Tooltip';
 
 import * as stylesImport from './Breadcrumb.scss';
 const styles: any = stylesImport;
@@ -111,7 +112,7 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
             { renderedItems.map(
               (item, index) => (
                 <li className={ css('ms-Breadcrumb-listItem', styles.listItem) } key={ item.key || String(index) } ref={ item.key || String(index) }>
-                  { onRenderItem(item, this._defaultRenderItem) }
+                  { onRenderItem(item, this._onRenderItem) }
                   <Icon
                     className={ css('ms-Breadcrumb-chevron', styles.chevron) }
                     iconName={ getRTL() ? 'ChevronLeft' : 'ChevronRight' } />
@@ -124,12 +125,7 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
   }
 
   @autobind
-  private _onRenderItem(item: IBreadcrumbItem, defaultRender?: (item?: IBreadcrumbItem) => JSX.Element): JSX.Element {
-    return this._defaultRenderItem(item);
-  }
-
-  @autobind
-  private _defaultRenderItem(item: IBreadcrumbItem) {
+  private _onRenderItem(item: IBreadcrumbItem) {
     if (item.onClick || item.href) {
       return (
         <Link
@@ -137,13 +133,23 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
           href={ item.href }
           aria-current={ item.isCurrentItem ? 'page' : null }
           onClick={ this._onBreadcrumbClicked.bind(this, item) }>
-          { item.text }
+          <TooltipHost
+            content={ item.text }
+            overflowMode={ TooltipOverflowMode.Parent }
+          >
+            { item.text }
+          </TooltipHost>
         </Link>
       );
     } else {
       return (
         <span className={ css('ms-Breadcrumb-item', styles.item) }>
-          { item.text }
+          <TooltipHost
+            content={ item.text }
+            overflowMode={ TooltipOverflowMode.Parent }
+          >
+            { item.text }
+          </TooltipHost>
         </span>
       );
     }
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
index bfb687cc0b565..b92d7ea2152b8 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
@@ -35,7 +35,7 @@ export class BreadcrumbBasicExample extends React.Component<any, any> {
             { text: 'Files', 'key': 'Files', href: '#/examples/breadcrumb', onClick: this._onBreadcrumbItemClicked },
             { text: 'This is link 1', 'key': 'l1', href: '#/examples/breadcrumb', onClick: this._onBreadcrumbItemClicked },
             { text: 'This is link 2', 'key': 'l2', href: '#/examples/breadcrumb', onClick: this._onBreadcrumbItemClicked },
-            { text: 'This is link 3', 'key': 'l3', href: '#/examples/breadcrumb', onClick: this._onBreadcrumbItemClicked },
+            { text: 'This is link 3 with a long name', 'key': 'l3', href: '#/examples/breadcrumb', onClick: this._onBreadcrumbItemClicked },
             { text: 'This is link 4', 'key': 'l4', href: '#/examples/breadcrumb', onClick: this._onBreadcrumbItemClicked },
             { text: 'This is link 5', 'key': 'l5', href: '#/examples/breadcrumb', onClick: this._onBreadcrumbItemClicked, isCurrentItem: true },
           ] }

From 860612ba4e1e14317d9800109235f0aec6d4cd16 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 18 Jul 2017 11:09:18 -0700
Subject: [PATCH 0274/1641] Updating build to output gzip size of minified
 bundle. (#2239)

---
 apps/test-bundle-button/check-size.js  |  12 ++
 apps/test-bundle-button/package.json   |   4 +-
 common/config/rush/npm-shrinkwrap.json | 217 ++++++++++++++-----------
 3 files changed, 141 insertions(+), 92 deletions(-)
 create mode 100644 apps/test-bundle-button/check-size.js

diff --git a/apps/test-bundle-button/check-size.js b/apps/test-bundle-button/check-size.js
new file mode 100644
index 0000000000000..de7ae65302aec
--- /dev/null
+++ b/apps/test-bundle-button/check-size.js
@@ -0,0 +1,12 @@
+let gzipSize = require('gzip-size');
+let fs = require('fs');
+let files = [
+  'dist/test-bundle-button.js'
+];
+
+for (let file of files) {
+  let content = fs.readFileSync(file, 'utf8');
+  let size = gzipSize.sync(content);
+
+  console.log(`${file} - min: ${content.length} bytes, gzip: ${size} bytes`);
+}
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index cead0a1125f84..2e5e01cf744fc 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -11,8 +11,9 @@
   },
   "license": "MIT",
   "scripts": {
+    "_checksize": "node check-size.js",
     "_bundle": "node node_modules/webpack/bin/webpack --config webpack.config.js && echo Done",
-    "build": "npm run _bundle",
+    "build": "npm run _bundle && npm run _checksize",
     "clean": "",
     "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.serve.config.js --open"
   },
@@ -23,6 +24,7 @@
     "@types/react-dom": "15.5.0",
     "@types/webpack-env": "1.13.0",
     "@types/prop-types": "15.5.1",
+    "gzip-size": "^3.0.0",
     "source-map-loader": "^0.2.1",
     "ts-loader": "^2.0.1",
     "typescript": "2.2.2",
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 7b86924e4804e..8fa9cfbc73632 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -9,9 +9,9 @@
       "integrity": "sha1-aBrxRDx7s/3xnRnPqvdd2QoD2dI="
     },
     "@microsoft/gulp-core-build": {
-      "version": "2.6.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.6.0.tgz",
-      "integrity": "sha1-8eDlC2STVFDb3hhTbphMu4Qvs2g=",
+      "version": "2.7.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.7.0.tgz",
+      "integrity": "sha1-MF8vNfBTdvZ+Qg+6LfemEHW7qB0=",
       "dependencies": {
         "@types/chai": {
           "version": "3.4.34",
@@ -579,15 +579,27 @@
           "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
           "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg="
         },
+        "ansi-styles": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.1.0.tgz",
+          "integrity": "sha1-CcIC1ckX7CMYjKpcnLkXnNlUd1A="
+        },
         "autoprefixer": {
           "version": "6.3.7",
           "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz",
           "integrity": "sha1-jt8xZt2f1hFlM2Ysi7NqA8DvyHQ="
         },
         "boxen": {
-          "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/boxen/-/boxen-1.1.0.tgz",
-          "integrity": "sha1-sbad1SIwXoB6md7ud329blFnsQI="
+          "version": "1.2.0",
+          "resolved": "https://registry.npmjs.org/boxen/-/boxen-1.2.0.tgz",
+          "integrity": "sha512-tfKK3nq0qXXOxvXEYW1k1XNRrDuQzO2oFPvLD3Fs1I58n0leuTNlftBmu3seUCyZvDfiqgRaxlqZs9WJAbSA7g==",
+          "dependencies": {
+            "chalk": {
+              "version": "2.0.1",
+              "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.0.1.tgz",
+              "integrity": "sha512-Mp+FXEI+FrwY/XYV45b2YD3E8i3HwnEAoFcM0qlZzq/RZ9RwWitt2Y/c7cqRAz70U7hfekqx6qNYthuKFO6K0g=="
+            }
+          }
         },
         "camelcase": {
           "version": "4.1.0",
@@ -595,9 +607,9 @@
           "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
         },
         "clean-css": {
-          "version": "4.1.5",
-          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.5.tgz",
-          "integrity": "sha1-0JqHoCpTdRF1iXlq52oGPKzbVBo="
+          "version": "4.1.7",
+          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.7.tgz",
+          "integrity": "sha1-ua6k+FZ5iJzz6ui0A0nsTr390DI="
         },
         "configstore": {
           "version": "3.1.0",
@@ -641,6 +653,11 @@
           "resolved": "https://registry.npmjs.org/gulp-sass/-/gulp-sass-3.1.0.tgz",
           "integrity": "sha1-U9xLaKH13f5EJKtMJHZVJpqLdLc="
         },
+        "has-flag": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
+          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
+        },
         "is-fullwidth-code-point": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
@@ -671,6 +688,11 @@
           "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
           "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8="
         },
+        "supports-color": {
+          "version": "4.2.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.0.tgz",
+          "integrity": "sha512-Ts0Mu/A1S1aZxEJNG88I4Oc9rcZSBFNac5e27yh4j2mqbhZSSzR1Ah79EYwSn9Zuh7lrlGD2cVGzw1RKGzyLSg=="
+        },
         "timed-out": {
           "version": "4.0.1",
           "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-4.0.1.tgz",
@@ -2066,14 +2088,14 @@
       }
     },
     "@uifabric/styling": {
-      "version": "0.13.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.13.0.tgz",
-      "integrity": "sha512-+E9ZW1UXBkFmL5ozw7ltsqFZNsykuuk0kW/aVKQcaNna5xlz6f3WRGhVveqIgTnE7Hdnpyf3Hj0/8qKp+R1eYg=="
+      "version": "0.13.9",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.13.9.tgz",
+      "integrity": "sha512-IADXPPUif+hvzqb4cM9I1Wybt0epv5c1kntzi9d1d51NXO/rTptnOGCVLJQom2AhIMtWGkGWSBfGYzBze0dWog=="
     },
     "@uifabric/utilities": {
-      "version": "4.7.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.7.0.tgz",
-      "integrity": "sha512-M5P7QmTcpRsi9jsXKL3IxTfTYd8EY+TeQxyOy32kmUiHNOD+2CteUohji7qzAqeMxkoktFU1j7iPTHCzPnQdEg=="
+      "version": "4.7.2",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.7.2.tgz",
+      "integrity": "sha512-f5nhpmOrohoAh7VhHcKnF1+0WI+Cjg+rfXFoRy6RPIAbf3/jH2OcKPtqSVqWb0PaQFlgffNXHvH7eEb2+qRX8g=="
     },
     "abbrev": {
       "version": "1.0.9",
@@ -2272,9 +2294,9 @@
       "integrity": "sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0="
     },
     "asap": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.5.tgz",
-      "integrity": "sha1-UidltQw1EEkOUtfc/ghe+bqWlY8="
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz",
+      "integrity": "sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY="
     },
     "asn1": {
       "version": "0.2.3",
@@ -2737,9 +2759,9 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000697",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000697.tgz",
-      "integrity": "sha1-IM5qnO7vTvShXcjoDy6PuQSejXc="
+      "version": "1.0.30000701",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000701.tgz",
+      "integrity": "sha1-LjKwaZO/Pb2QtD2T8E4m0Rr93Lo="
     },
     "capture-stack-trace": {
       "version": "1.0.0",
@@ -2814,9 +2836,9 @@
       "integrity": "sha1-WckP4+E3EEdG/xlGmiemNP9oyFc="
     },
     "clean-css": {
-      "version": "3.4.27",
-      "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-3.4.27.tgz",
-      "integrity": "sha1-re91sxwWD/pdcvTeZ5ZuJmDBolU=",
+      "version": "3.4.28",
+      "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-3.4.28.tgz",
+      "integrity": "sha1-vxlF6C/ICPVWlebd6uwBQA79A/8=",
       "dependencies": {
         "commander": {
           "version": "2.8.1",
@@ -3227,18 +3249,6 @@
         }
       }
     },
-    "cross-spawn-async": {
-      "version": "2.2.5",
-      "resolved": "https://registry.npmjs.org/cross-spawn-async/-/cross-spawn-async-2.2.5.tgz",
-      "integrity": "sha1-hF/wwINKPe2dFg2sptOQkGuyiMw=",
-      "dependencies": {
-        "lru-cache": {
-          "version": "4.1.1",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.1.tgz",
-          "integrity": "sha512-q4spe4KTfsAS1SUHLO0wz8Qiyf1+vMIAgpRYioFYDMNqKfHQbg+AVDH3i4fvpl71/P1L0dBl+fQi+P37UYf0ew=="
-        }
-      }
-    },
     "crypt": {
       "version": "0.0.2",
       "resolved": "https://registry.npmjs.org/crypt/-/crypt-0.0.2.tgz",
@@ -3814,9 +3824,9 @@
       "integrity": "sha1-RTVSSKiJeQNLZ5Lhm7gfK3l13Q0="
     },
     "es5-ext": {
-      "version": "0.10.23",
-      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.23.tgz",
-      "integrity": "sha1-dXi1G+l0IHpUh4IbVlOMIk5Oezg="
+      "version": "0.10.24",
+      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.24.tgz",
+      "integrity": "sha1-pVh3yZJLwMjZvTwsvhdJWsFwmxQ="
     },
     "es6-collections": {
       "version": "0.5.6",
@@ -3922,9 +3932,21 @@
       "integrity": "sha1-SXtmrZ/vZc18CKYYCCS6FHa2blM="
     },
     "execa": {
-      "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/execa/-/execa-0.4.0.tgz",
-      "integrity": "sha1-TrZGejaglfq7KXD/nV4/t7zm68M="
+      "version": "0.7.0",
+      "resolved": "https://registry.npmjs.org/execa/-/execa-0.7.0.tgz",
+      "integrity": "sha1-lEvs00zEHuMqY6n68nrVpl/Fl3c=",
+      "dependencies": {
+        "cross-spawn": {
+          "version": "5.1.0",
+          "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-5.1.0.tgz",
+          "integrity": "sha1-6L0O/uWPz/b4+UUQoKVUu/ojVEk="
+        },
+        "lru-cache": {
+          "version": "4.1.1",
+          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.1.tgz",
+          "integrity": "sha512-q4spe4KTfsAS1SUHLO0wz8Qiyf1+vMIAgpRYioFYDMNqKfHQbg+AVDH3i4fvpl71/P1L0dBl+fQi+P37UYf0ew=="
+        }
+      }
     },
     "exit-hook": {
       "version": "1.1.1",
@@ -4817,9 +4839,9 @@
       "integrity": "sha1-FhdnFMgBeY5Ojyz391KUZ7tKV3E="
     },
     "function.prototype.name": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.0.0.tgz",
-      "integrity": "sha1-X1I8pk5JGl+Vq6gMweORCAoUSC4="
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.0.1.tgz",
+      "integrity": "sha512-yPTD33NazY14aRlTORxhFf8gTrNmnxmAGaw2Ge36m4ThRN7HauJU8hESMQQXixdJbnaO43c3MgMoZXP/QqGnTw=="
     },
     "gauge": {
       "version": "2.7.4",
@@ -5990,9 +6012,9 @@
       "integrity": "sha1-1zvD/0SJQkCIGM5gm/P7DqfvTrc=",
       "dependencies": {
         "clean-css": {
-          "version": "4.1.5",
-          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.5.tgz",
-          "integrity": "sha1-0JqHoCpTdRF1iXlq52oGPKzbVBo="
+          "version": "4.1.7",
+          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.7.tgz",
+          "integrity": "sha1-ua6k+FZ5iJzz6ui0A0nsTr390DI="
         },
         "commander": {
           "version": "2.9.0",
@@ -6000,9 +6022,9 @@
           "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q="
         },
         "uglify-js": {
-          "version": "3.0.23",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.23.tgz",
-          "integrity": "sha512-miLHbO2QcdQGxL/q1wLcUr6TGIRHhMnpKyywUbAdZRkJMqCeZCDmBsgYu1Wlj26xHBXN+sU5tHaWh38QsN208g=="
+          "version": "3.0.24",
+          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.24.tgz",
+          "integrity": "sha512-IZ7l7MU2j7LIuz6IAFWBOk1dbuQ0QVQsKLffpNPKXuL8NYcFBBQ5QkvMAtfL1+oaBW16344DY4sA26GI9cXzlA=="
         }
       }
     },
@@ -6128,9 +6150,9 @@
       "integrity": "sha1-vjPUCsEO8ZJnAfbwii2G+/0a0+Q="
     },
     "immutability-helper": {
-      "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.2.3.tgz",
-      "integrity": "sha1-aBoOyboqJDuYmFZOOWI8g9nOGYU="
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.3.0.tgz",
+      "integrity": "sha1-6Jd0HB2ilUGoYeoWvb+QkmXi61U="
     },
     "import-lazy": {
       "version": "2.1.0",
@@ -6355,9 +6377,9 @@
       "integrity": "sha1-caUMhCnfync8kqOQpKA7OfzVHT4="
     },
     "is-plain-object": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.3.tgz",
-      "integrity": "sha1-wVvz5LZrYtcu+vKSWEhmPsvGGbY=",
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.4.tgz",
+      "integrity": "sha512-h5PpgXkWitc38BBMYawTYMWJHFZJVnBquFE57xFpjB8pJFiF6gZ+bU+WyI/yqXiFR5mdLsgYNaPe8uao6Uv9Og==",
       "dependencies": {
         "isobject": {
           "version": "3.0.1",
@@ -6553,16 +6575,9 @@
       "integrity": "sha1-mGbfOVECEw449/mWvOtlRDIJwls="
     },
     "js-yaml": {
-      "version": "3.8.4",
-      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.8.4.tgz",
-      "integrity": "sha1-UgtFZPhlc7qWZir4Woyvp7S1pvY=",
-      "dependencies": {
-        "esprima": {
-          "version": "3.1.3",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz",
-          "integrity": "sha1-/cpRzuYTOJXjyI1TXOSdv/YqRjM="
-        }
-      }
+      "version": "3.9.0",
+      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.9.0.tgz",
+      "integrity": "sha512-0LoUNELX4S+iofCT8f4uEHIiRBR+c2AINyC8qRWfC6QNruLtxVZRJaPcu/xwMgFIgDxF25tGHaDjvxzJCNE9yw=="
     },
     "jsbn": {
       "version": "0.1.1",
@@ -7165,6 +7180,11 @@
       "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-3.1.1.tgz",
       "integrity": "sha1-+zB4RHU7Zrnxr6VOJix0UwfbqOU="
     },
+    "lodash.toarray": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/lodash.toarray/-/lodash.toarray-4.4.0.tgz",
+      "integrity": "sha1-JMS/zWsvuji/0FlNsRedjptlZWE="
+    },
     "lodash.uniq": {
       "version": "4.5.0",
       "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz",
@@ -7598,9 +7618,9 @@
       "integrity": "sha1-euuhxzpSGEJlVUt9wDuvcg34AIE="
     },
     "node-emoji": {
-      "version": "1.6.1",
-      "resolved": "https://registry.npmjs.org/node-emoji/-/node-emoji-1.6.1.tgz",
-      "integrity": "sha512-cMmAHLDT/QHCSuHBL3vQ8qXwFypx/3zN1sForcR65OM8FbC+LKefUCI29NAik4Crpiv2byyWj1SWZRlNBtbi2g=="
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/node-emoji/-/node-emoji-1.7.0.tgz",
+      "integrity": "sha512-dYx345sjhPJUpWaVQKjP0/43y+nTcfBRTZfSciM3ZEbRGaU/9AKaHBPf7AJ9vOKcK0W3v67AgI4m4oo02NLHhQ=="
     },
     "node-fetch": {
       "version": "1.7.1",
@@ -7690,9 +7710,9 @@
       "integrity": "sha1-LMDWazHqIwNkWENuNiDYWVTGbDw="
     },
     "npm-run-path": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-1.0.0.tgz",
-      "integrity": "sha1-9cMr9ZX+ga6Sfa7FLoL4sACsPI8="
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-2.0.2.tgz",
+      "integrity": "sha1-NakjLfo11wZ7TLLd8jV7GHFTbF8="
     },
     "npmlog": {
       "version": "4.1.2",
@@ -7799,9 +7819,9 @@
       "integrity": "sha1-6mJvqUURirroSrsZc45KCLCHPx8="
     },
     "office-ui-fabric-react": {
-      "version": "4.16.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.16.0.tgz",
-      "integrity": "sha512-QIALhZcdc2R0TBu29xMgZZCUKCuhE/eRFaQpyNysNAfrL1HBl1U2LlHbhnc0wkxPd+InPjVHKHjEYOPJ7irsjQ=="
+      "version": "4.20.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.20.0.tgz",
+      "integrity": "sha512-ljajwhHLp79i0MoVLydpIyEO3AI8ozWDkLAYqrYSYgAoKBlms6Zo8jEJHSaJAhzD5kLnTxocXKpMmoqKsgoLaQ=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -7926,6 +7946,11 @@
       "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.4.tgz",
       "integrity": "sha1-Qv5tWVPfBsgGS+bxdsPQWqqjRkQ="
     },
+    "p-finally": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/p-finally/-/p-finally-1.0.0.tgz",
+      "integrity": "sha1-P7z7FbiZpEEjs0ttzBi3JDNqLK4="
+    },
     "p-map": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/p-map/-/p-map-1.1.1.tgz",
@@ -8046,9 +8071,9 @@
       "integrity": "sha1-NlQX3t5EQw0cEa9hAn+s8HS9/FM="
     },
     "path-key": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/path-key/-/path-key-1.0.0.tgz",
-      "integrity": "sha1-XVPVeAGWRsDWiADbThRua9wqx68="
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/path-key/-/path-key-2.0.1.tgz",
+      "integrity": "sha1-QRyttXTFoUDTpLGRDUDYDMn0C0A="
     },
     "path-parse": {
       "version": "1.0.5",
@@ -9304,6 +9329,16 @@
         }
       }
     },
+    "shebang-command": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-1.2.0.tgz",
+      "integrity": "sha1-RKrGW2lbAzmJaMOfNj/uXer98eo="
+    },
+    "shebang-regex": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-1.0.0.tgz",
+      "integrity": "sha1-2kL0l0DAtC2yypcoVxyxkMmO/qM="
+    },
     "shellwords": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/shellwords/-/shellwords-0.1.0.tgz",
@@ -9792,9 +9827,9 @@
       "integrity": "sha1-jk0qJWwOIYXGsYrWlK7JaLg8sdE="
     },
     "term-size": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/term-size/-/term-size-0.1.1.tgz",
-      "integrity": "sha1-hzYLljlsq1dgljcUzaDQy+7K2co="
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/term-size/-/term-size-1.2.0.tgz",
+      "integrity": "sha1-RYuDiH8oj8Vtb/+/rSYuJmOO+mk="
     },
     "ternary-stream": {
       "version": "2.0.1",
@@ -10240,9 +10275,9 @@
       "integrity": "sha1-K1viOjK2Onyd640PKNSFcko98ZA="
     },
     "useragent": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/useragent/-/useragent-2.2.0.tgz",
-      "integrity": "sha1-74X0GQPP0F4rqMEa5hJJx6a79mM=",
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/useragent/-/useragent-2.2.1.tgz",
+      "integrity": "sha1-z1k+9PLRdYdei7ZY6pLhik/QbY4=",
       "dependencies": {
         "lru-cache": {
           "version": "2.2.4",
@@ -10445,9 +10480,9 @@
           "integrity": "sha1-wguW2MYXdIqvHBYCF2DNJ/y4y3U="
         },
         "crypto-browserify": {
-          "version": "3.11.0",
-          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.0.tgz",
-          "integrity": "sha1-NlKgkGq5sqfgw85mpAjpV6JIVSI="
+          "version": "3.11.1",
+          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.1.tgz",
+          "integrity": "sha512-Na7ZlwCOqoaW5RwUK1WpXws2kv8mNhWdTlzob0UXulk6G9BDbyiJaGTYBIX61Ozn9l1EPPJpICZb4DaOpT9NlQ=="
         },
         "enhanced-resolve": {
           "version": "3.3.0",
@@ -10541,9 +10576,9 @@
       }
     },
     "webpack-bundle-analyzer": {
-      "version": "2.8.2",
-      "resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.8.2.tgz",
-      "integrity": "sha1-i2JAwpqdY7xy8J2SD7BQrbzOn+g=",
+      "version": "2.8.3",
+      "resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.8.3.tgz",
+      "integrity": "sha512-kDnp1ejbZzmocvUbsjS+ymW9rcD01LzgFKOX4ArgtiSyro3i2ywIM1Thr2Z0MUtauZQw8C5cUdeUXOlvcBFduA==",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",

From 9440c73f17ce503100d8f908db0d44a5adac5b0a Mon Sep 17 00:00:00 2001
From: Kushal Yarlagadda <whykushal93@gmail.com>
Date: Tue, 18 Jul 2017 15:10:17 -0700
Subject: [PATCH 0275/1641] Moving Checkbox component to use the Glamor-based
 styling package. (#2202)

* Initial commit - Checkbox uses Glamor-based styling.
-Fonts and High-contrast still to come.

* Some more styling updates
-> Label when disabled should not have a pointer cursor
-> Added the transition function for the background color to appear in the checkbox
-> Removed a syntax error.

* Correcting class names

* These styles need to be removed. These styles result in a bug because absolutely positioned flex-items have some weird behavior in IE & Firefox

* Some changes to make the reverse order of check box render correctly. This seems to work in all browsers we support for now

* Focus styles for checkbox. To be refactored.

* Refactoring the focusing function in Checkbox and generalizing it.
This is different from the previous one because this needs a class on the ancestor to determine that the current element needs an outline in its style.

* High contrast styles for Checkbox

* Updating contrast styles. Making contrast be the most basic so that it is easy improve in the future.
-> Previously, we had contrast styles for Hover etc., which I have removed for now.

* Adding comments for the CheckboxStyles, tslint corrections, and adding a few more styles.

* High contrast for Firefox

* Deleting files that are no longer necessary.

* Using a button to get around using all the high contrast styles. Now we only use high contrast styles for showing disabled text !!

* Reverting the button change that was made in pursuit of high contrast styles that would comes for free in browsers.
The button was very difficult to integrate in terms of click events.

* Addressing comments
-Changed color names to reflect sematic color naming rules
-Removed unnecessary positioning style rules
-

* Making label position relative for the focus border of the pseudo :after element.

* Reverting background color change.

* replacing the root element with a button
-removing the input checkbox
-this will give us default hc styles in firefox.
-The button has all required aria attriubtes to act as a checkbox.

* More changes as requested in the comments.

* Bringing back onFocus, onBlur, some more styling corrections.

* Removing lines that are not necessary.

* Removing more unnecessary code

* This is needed for the controlled checkbox, when it updates.

* Correcting checkmark font color when disabled
---
 .../src/components/Checkbox/Checkbox.Props.ts | 103 ++++++++
 .../src/components/Checkbox/Checkbox.scss     | 248 ------------------
 .../components/Checkbox/Checkbox.styles.ts    | 125 +++++++++
 .../src/components/Checkbox/Checkbox.tsx      | 185 +++++++++----
 .../examples/Checkbox.Basic.Example.tsx       |  19 +-
 packages/styling/src/styles/DefaultPalette.ts |   2 +-
 packages/styling/src/styles/getFocusStyle.ts  |   2 +-
 packages/utilities/api/utilities.api.ts       |   1 +
 8 files changed, 379 insertions(+), 306 deletions(-)
 delete mode 100644 packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts

diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
index cd3d17d042df1..c6a25ae4995e7 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { IStyle, ITheme } from '../../Styling';
 
 /**
  * Checkbox class interface.
@@ -66,4 +67,106 @@ export interface ICheckboxProps extends React.HTMLAttributes<HTMLElement | HTMLI
    * @default 'start'
    */
   boxSide?: 'start' | 'end';
+
+  /**
+   * Theme provided by HOC.
+   */
+  theme?: ITheme;
+
+  /**
+   * Custom styles for this component
+   */
+  styles?: ICheckboxStyles;
 }
+
+export interface ICheckboxStyles {
+  /**
+   * Style for the root element (a button) of the checkbox component in the default enabled/unchecked state.
+   */
+  root?: IStyle;
+
+  /**
+   * Style for the label part (contains the customized checkbox + text) when enabled.
+   */
+  label?: IStyle;
+
+  /**
+   * Style for the label when reversed
+   */
+  labelReversed?: IStyle;
+
+  /**
+   * Style override for the label part when disabled.
+   */
+  labelDisabled?: IStyle;
+
+  /**
+   * Style for the box (container for the actual checkbox).
+   */
+  box?: IStyle;
+
+  /**
+   * Style for checkbox in its default unchecked/enabled state.
+   */
+  checkbox?: IStyle;
+
+  /**
+   * Style override for checkbox when enabled/unchecked/hovered.
+   */
+  checkboxHovered?: IStyle;
+
+  /**
+   * Style override for checkbox when enabled/checked.
+   */
+  checkboxChecked?: IStyle;
+
+  /**
+   * Style override for checkbox when enabled/checked/hovered.
+   */
+  checkboxCheckedHovered?: IStyle;
+
+  /**
+   * Style override for checkbox when disabled/unchecked.
+   */
+  checkboxDisabled?: IStyle;
+
+  /**
+   * Style override for checkbox when disabled/checked.
+   */
+  checkboxCheckedDisabled?: IStyle;
+
+  /**
+   * Style for the checkmark in the default enabled/unchecked state.
+   */
+  checkmark?: IStyle;
+
+  /**
+   * Style override for the checkmark when enabled/checked.
+   */
+  checkmarkChecked?: IStyle;
+
+  /**
+   * Style override for checkmark when disabled/unchecked.
+   */
+  checkmarkDisabled?: IStyle;
+
+  /**
+ * Style override for checkmark when disabled/checked.
+ */
+  checkmarkCheckedDisabled?: IStyle;
+
+  /**
+   * Style for text appearing with the checkbox in its default enabled state.
+   */
+  text?: IStyle;
+
+  /**
+   * Style override for text appearing with the checkbox when enabled/hovered.
+   */
+  textHovered?: IStyle;
+
+  /**
+   * Style override for text appearing with the checkbox when disabled.
+   */
+  textDisabled?: IStyle;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.scss b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.scss
deleted file mode 100644
index ca4f51d800653..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.scss
+++ /dev/null
@@ -1,248 +0,0 @@
-@import '../../common/common';
-
-// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
-
-//
-// Office UI Fabric
-// --------------------------------------------------
-// Checkbox styles
-$ms-checkbox-label-size: 20px !default;
-$ms-checkbox-transition-duration: 200ms;
-$ms-checkbox-transition-timing: cubic-bezier(.4, 0, .23, 1);
-$ms-checkbox-highContrast-iconBoxSize: 16px !default;
-
-// Default state
-.root {
-  overflow: hidden;
-  position: relative;
-  display: flex;
-  align-items: center;
-
-  &:hover,
-  &:active,
-  &:focus {
-    .checkbox {
-      @include ms-borderColor-neutralSecondaryAlt;
-      @media screen and (-ms-high-contrast: active) {
-        border-color: $ms-color-contrastWhiteDisabled;
-      }
-
-      @media screen and (-ms-high-contrast: black-on-white) {
-        border-color: $ms-color-contrastBlackDisabled;
-      }
-    }
-    .text {
-      @include ms-fontColor-black;
-      @media screen and (-ms-high-contrast: active) {
-        color: $ms-color-contrastWhiteDisabled;
-      }
-
-      @media screen and (-ms-high-contrast: black-on-white) {
-        color: $ms-color-contrastBlackDisabled;
-      }
-    }
-  }
-  &.reversed {
-    > .label {
-        flex-direction: row-reverse;
-    }
-  }
-}
-
-.input {
-  position: absolute;
-  opacity: 0;
-}
-
-.label {
-  display: flex;
-  align-items: center;
-  cursor: pointer;
-  position: relative;
-  margin: 0 -4px;
-}
-
-:global(.ms-Fabric.is-focusVisible) .isInFocus .label {
-  outline: transparent;
-  &:after {
-    margin: 0 4px;
-    @include after-outline();
-  }
-}
-
-.box {
-  display: flex;
-  margin: 0 4px;
-  align-items: center;
-  justify-content: center;
-  flex: 0 0 $ms-checkbox-label-size;
-  height: $ms-checkbox-label-size;
-}
-
-.checkbox {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  height: $ms-checkbox-label-size;
-  width: $ms-checkbox-label-size;
-  border: 1px solid transparent;
-  box-sizing: border-box;
-  transition-property: background, border, border-color;
-  transition-duration: $ms-checkbox-transition-duration;
-  transition-timing-function: $ms-checkbox-transition-timing;
-  /* incase the icon is bigger than the box */
-  overflow: hidden;
-
-  @include ms-borderColor-neutralTertiary;
-  @media screen and (-ms-high-contrast: active) {
-    border-color: $ms-color-contrastBlackSelected;
-  }
-
-  @media screen and (-ms-high-contrast: black-on-white) {
-    border-color: $ms-color-contrastWhiteSelected;
-  }
-}
-
-.checkmark {
-  opacity: 0;
-  flex: 0 0 auto;
-  @include ms-fontColor-white;
-}
-
-.text {
-  flex: 1 0 auto;
-  margin: 0 4px;
-}
-
-// Checked state
-.root.isChecked {
-  .checkbox {
-      @include ms-borderColor-themePrimary;
-      @include ms-bgColor-themePrimary;
-      border-width: 0px;
-      > .checkmark {
-          opacity: 1;
-      }
-
-      @media screen and (-ms-high-contrast: active) {
-        height: $ms-checkbox-highContrast-iconBoxSize;
-        width: $ms-checkbox-highContrast-iconBoxSize;
-        border-width: 1px;
-        border-color: $ms-color-contrastBlackSelected;
-        background-color: $ms-color-contrastWhiteSelected;
-      }
-
-      @media screen and (-ms-high-contrast: black-on-white) {
-        height: $ms-checkbox-highContrast-iconBoxSize;
-        width: $ms-checkbox-highContrast-iconBoxSize;
-        border-width: 1px;
-        border-color: $ms-color-contrastBlackSelected;
-        background-color: $ms-color-contrastBlackSelected;
-      }
-  }
-  &:hover,
-  &:active,
-  &:focus {
-    .checkbox {
-      @include ms-borderColor-themeDarkAlt;
-      @include ms-bgColor-themeDarkAlt;
-
-      @media screen and (-ms-high-contrast: active) {
-        border-color: $ms-color-contrastWhiteDisabled;
-        background-color: $ms-color-contrastWhiteDisabled;
-      }
-
-      @media screen and (-ms-high-contrast: black-on-white) {
-        border-color: $ms-color-contrastBlackDisabled;
-        background-color: $ms-color-contrastBlackDisabled;
-      }
-    }
-    .text {
-      @include ms-fontColor-black;
-
-      @media screen and (-ms-high-contrast: active) {
-        color: $ms-color-contrastWhiteDisabled;
-      }
-
-      @media screen and (-ms-high-contrast: black-on-white) {
-        color: $ms-color-contrastBlackDisabled;
-      }
-    }
-  }
-}
-
-// Disabled state
-.root.isDisabled {
-  .checkbox {
-    @include ms-borderColor-neutralTertiaryAlt;
-    @include ms-bgColor-neutralTertiaryAlt;
-
-    @media screen and (-ms-high-contrast: active) {
-      border-color: $ms-color-contrastBlackDisabled;
-      background-color: $ms-color-contrastBlackDisabled;
-      > .checkmark {
-        @media screen and (-ms-high-contrast: active) {
-          color: $ms-color-contrastBlackDisabled;
-        }
-
-        @media screen and (-ms-high-contrast: black-on-white) {
-          color: $ms-color-contrastWhiteDisabled;
-        }
-      }
-    }
-
-    @media screen and (-ms-high-contrast: black-on-white) {
-      > .checkmark {
-        @media screen and (-ms-high-contrast: active) {
-          color: $ms-color-contrastBlackDisabled;
-        }
-
-        @media screen and (-ms-high-contrast: black-on-white) {
-          color: $ms-color-contrastWhiteDisabled;
-        }
-      }
-      background-color: $ms-color-contrastWhiteDisabled;
-      border-color: $ms-color-contrastWhiteDisabled;
-    }
-  }
-  .text{
-    @include ms-fontColor-neutralTertiary;
-
-    @media screen and (-ms-high-contrast: active) {
-      color: $ms-color-contrastBlackDisabled;
-    }
-
-    @media screen and (-ms-high-contrast: black-on-white) {
-      color: $ms-color-contrastWhiteDisabled;
-    }
-  }
-  &:hover,
-  &:active,
-  &:focus {
-    .checkbox {
-      @include ms-borderColor-neutralTertiaryAlt;
-      @include ms-bgColor-neutralTertiaryAlt;
-
-      @media screen and (-ms-high-contrast: active) {
-        border-color: $ms-color-contrastBlackDisabled;
-        background-color: $ms-color-contrastBlackDisabled;
-      }
-
-      @media screen and (-ms-high-contrast: black-on-white) {
-        background-color: $ms-color-contrastWhiteDisabled;
-        border-color: $ms-color-contrastWhiteDisabled;
-      }
-    }
-    .text {
-      @include ms-fontColor-neutralTertiary;
-
-      @media screen and (-ms-high-contrast: active) {
-        color: $ms-color-contrastBlackDisabled;
-      }
-
-      @media screen and (-ms-high-contrast: black-on-white) {
-        color: $ms-color-contrastWhiteDisabled;
-      }
-    }
-  }
-}
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
new file mode 100644
index 0000000000000..b75b524567227
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
@@ -0,0 +1,125 @@
+import { ICheckboxStyles } from './Checkbox.Props';
+import {
+  ITheme,
+  mergeStyleSets,
+  getFocusStyle
+} from '../../Styling';
+import { memoizeFunction } from '../../Utilities';
+
+const MS_CHECKBOX_LABEL_SIZE = '20px';
+const MS_CHECKBOX_TRANSITION_DURATION = '200ms';
+const MS_CHECKBOX_TRANSITION_TIMING = 'cubic-bezier(.4, 0, .23, 1)';
+
+export const getStyles = memoizeFunction((
+  theme: ITheme,
+  customStyles?: ICheckboxStyles
+): ICheckboxStyles => {
+  const { semanticColors, palette } = theme;
+  const checkmarkFontColor = semanticColors.inputForegroundChecked;
+  const checkmarkFontColorCheckedDisabled = semanticColors.disabledBackground;
+  const checkboxBorderColor = semanticColors.inputBorder;
+  const checkboxBorderHoveredColor = semanticColors.inputBorderHovered;
+  const checkboxBackgroundChecked = semanticColors.inputBackgroundChecked;
+  const checkboxBackgroundCheckedHovered = semanticColors.inputBackgroundCheckedHovered;
+  const checkboxBackgroundDisabled = semanticColors.disabledText;
+  const checkboxTextColorDisabled = semanticColors.disabledText;
+
+  const styles: ICheckboxStyles = {
+    root: [
+      getFocusStyle(theme),
+      {
+        padding: '0',
+        border: 'none',
+        background: 'none',
+        margin: '0',
+        outline: 'none',
+        display: 'block',
+        cursor: 'pointer',
+
+        // This is to hide the label's overflow because of the negative margin.
+        overflow: 'hidden'
+      }
+    ],
+    label: {
+      display: 'inline-flex',
+      alignItems: 'center',
+      cursor: 'pointer',
+
+      // The negative margin is in place to correct for the margin of the box
+      margin: '0 -4px',
+      position: 'relative',
+      userSelect: 'none'
+    },
+    labelReversed: {
+      flexDirection: 'row-reverse',
+      justifyContent: 'flex-end'
+    },
+    labelDisabled: {
+      cursor: 'default'
+    },
+    box: {
+      display: 'flex',
+      margin: '0 4px',
+      alignItems: 'center',
+      justifyContent: 'center',
+      flex: '0 0 ' + MS_CHECKBOX_LABEL_SIZE,
+      height: MS_CHECKBOX_LABEL_SIZE,
+    },
+    checkbox: {
+      display: 'flex',
+      alignItems: 'center',
+      justifyContent: 'center',
+      height: MS_CHECKBOX_LABEL_SIZE,
+      width: MS_CHECKBOX_LABEL_SIZE,
+      borderWidth: '1px',
+      borderStyle: 'solid',
+      borderColor: checkboxBorderColor,
+      boxSizing: 'border-box',
+      transitionProperty: 'background, border, border-color',
+      transitionDuration: MS_CHECKBOX_TRANSITION_DURATION,
+      transitionTimingFunction: MS_CHECKBOX_TRANSITION_TIMING,
+
+      /* incase the icon is bigger than the box */
+      overflow: 'hidden',
+    },
+    checkboxHovered: {
+      borderColor: checkboxBorderHoveredColor,
+    },
+    checkboxChecked: {
+      background: checkboxBackgroundChecked,
+    },
+    checkboxCheckedHovered: {
+      background: checkboxBackgroundCheckedHovered,
+    },
+    checkboxDisabled: {
+      background: checkboxBackgroundDisabled,
+    },
+    checkboxCheckedDisabled: {
+      background: checkboxBackgroundDisabled,
+    },
+    checkmark: {
+      opacity: '0',
+      color: checkmarkFontColor
+    },
+    checkmarkChecked: {
+      opacity: '1'
+    },
+    checkmarkDisabled: {
+    },
+    checkmarkCheckedDisabled: {
+      opacity: '1',
+      color: checkmarkFontColorCheckedDisabled,
+    },
+    text: {
+      margin: '0 4px'
+    },
+    textHovered: {
+      color: palette.black,
+    },
+    textDisabled: {
+      color: checkboxTextColorDisabled,   // ms-fontColor-neutralTertiary
+    }
+  };
+
+  return mergeStyleSets(styles, customStyles);
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
index bce242a3e119e..0f4af104dbcfd 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
@@ -2,25 +2,39 @@ import * as React from 'react';
 import {
   BaseComponent,
   autobind,
-  css,
-  getId
+  getId,
+  memoize
 } from '../../Utilities';
 import { Icon } from '../../Icon';
 import {
   ICheckbox,
-  ICheckboxProps
+  ICheckboxProps,
+  ICheckboxStyles
 } from './Checkbox.Props';
-import * as stylesImport from './Checkbox.scss';
-const styles: any = stylesImport;
+import {
+  customizable
+} from '../../Utilities';
+import {
+  mergeStyles
+} from '../../Styling';
 
-export interface ICheckboxState {
-  /** Is true when the control has focus. */
-  isFocused?: boolean;
+import { getStyles } from './Checkbox.styles';
 
+export interface ICheckboxState {
   /** Is true when Uncontrolled control is checked. */
   isChecked?: boolean;
 }
 
+interface ICheckboxClassNames {
+  root: string;
+  label: string;
+  box: string;
+  checkbox: string;
+  checkmark: string;
+  text: string;
+}
+
+@customizable(['theme'])
 export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> implements ICheckbox {
   public static defaultProps: ICheckboxProps = {
     boxSide: 'start'
@@ -43,11 +57,18 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
 
     this._id = getId('checkbox-');
     this.state = {
-      isFocused: false,
       isChecked: !!(props.checked !== undefined ? props.checked : props.defaultChecked)
     };
   }
 
+  public componentWillReceiveProps(newProps: ICheckboxProps) {
+    if (newProps.checked !== undefined) {
+      this.setState({
+        isChecked: !!newProps.checked // convert null to false
+      });
+    }
+  }
+
   /**
    * Render the Checkbox based on passed props
    */
@@ -60,50 +81,53 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
       inputProps,
       label,
       name,
-      boxSide
+      boxSide,
+      theme,
+      styles: customStyles,
         } = this.props;
 
-    const { isFocused } = this.state;
     const isChecked = checked === undefined ? this.state.isChecked : checked;
+    const isReversed = boxSide !== 'start' ? true : false;
 
-    let rootClassName = css('ms-Checkbox', className, styles.root, {
-      ['reversed ' + styles.reversed]: boxSide !== 'start',
-      ['is-checked ' + styles.isChecked]: isChecked,
-      ['is-disabled ' + styles.isDisabled]: disabled,
-      ['is-inFocus ' + styles.isInFocus]: isFocused
-    });
+    const classNames = this._getClassNames(
+      getStyles(theme, customStyles),
+      className,
+      disabled,
+      isChecked,
+      isReversed
+    );
 
     return (
-      <div className={ rootClassName } style={ this.props.style } >
-        <input
-          { ...inputProps }
-          { ...(checked !== undefined && { checked }) }
-          { ...(defaultChecked !== undefined && { defaultChecked }) }
-          disabled={ disabled }
-          ref={ this._resolveRef('_checkBox') }
-          id={ this._id }
-          name={ name || this._id }
-          className={ css('ms-Checkbox-input', styles.input) }
-          type='checkbox'
-          onChange={ this._onChange }
-          onFocus={ this._onFocus }
-          onBlur={ this._onBlur }
-          aria-checked={ isChecked }
-        />
-        <label className={ css('ms-Checkbox-label', styles.label) } htmlFor={ this._id }>
-          <span className={ css('ms-Checkbox-box', styles.box) }>
-            <span className={ css('ms-Checkbox-checkbox', styles.checkbox) }>
-              <Icon iconName='CheckMark' className={ styles.checkmark } />
-            </span>
-          </span>
-          { label && <span className={ css('text', styles.text) }>{ label }</span> }
+      <button
+        { ...inputProps }
+        { ...(checked !== undefined && { checked }) }
+        { ...(defaultChecked !== undefined && { defaultChecked }) }
+        disabled={ disabled }
+        ref={ this._resolveRef('_checkBox') }
+        name={ name }
+        id={ this._id }
+        role='checkbox'
+        className={ classNames.root }
+        onClick={ this._onClick }
+        onFocus={ this._onFocus }
+        onBlur={ this._onBlur }
+        aria-checked={ isChecked }
+        aria-disabled={ disabled }
+      >
+        <label className={ classNames.label } htmlFor={ this._id } >
+          <div className={ classNames.box }>
+            <div className={ classNames.checkbox }>
+              <Icon iconName='CheckMark' className={ classNames.checkmark } />
+            </div>
+          </div>
+          { label && <span className={ classNames.text }>{ label }</span> }
         </label>
-      </div >
+      </button>
     );
   }
 
   public get checked(): boolean {
-    return this._checkBox ? this._checkBox.checked : false;
+    return this.state.isChecked;
   }
 
   public focus(): void {
@@ -119,8 +143,6 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
     if (inputProps && inputProps.onFocus) {
       inputProps.onFocus(ev);
     }
-
-    this.setState({ isFocused: true });
   }
 
   @autobind
@@ -130,21 +152,84 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
     if (inputProps && inputProps.onBlur) {
       inputProps.onBlur(ev);
     }
-
-    this.setState({ isFocused: false });
   }
 
   @autobind
-  private _onChange(ev: React.FormEvent<HTMLInputElement>) {
+  private _onClick(ev: React.FormEvent<HTMLButtonElement>) {
     const { onChange } = this.props;
-    const isChecked = (ev.target as HTMLInputElement).checked;
+    let { isChecked } = this.state;
 
     if (onChange) {
-      onChange(ev, isChecked);
+      onChange(ev, !isChecked);
     }
 
     if (this.props.checked === undefined) {
-      this.setState({ isChecked: isChecked });
+      this.setState({ isChecked: !isChecked });
     }
   }
+
+  @memoize
+  private _getClassNames(
+    styles: ICheckboxStyles,
+    className: string,
+    disabled: boolean,
+    isChecked: boolean,
+    isReversed: boolean
+    ): ICheckboxClassNames {
+    return {
+      root: mergeStyles(
+        'ms-Checkbox',
+        isReversed && 'reversed',
+        isChecked && 'is-checked',
+        !disabled && 'is-enabled',
+        disabled && 'is-disabled',
+        className,
+        styles.root,
+        !disabled && [
+          !isChecked && {
+            ':hover .ms-Checkbox-checkbox': styles.checkboxHovered
+          },
+          isChecked && {
+            ':hover .ms-Checkbox-checkbox': styles.checkboxCheckedHovered
+          },
+          {
+            ':hover .ms-Checkbox-text': styles.textHovered
+          }
+        ]
+      ) as string,
+
+      label: mergeStyles(
+        'ms-Checkbox-label',
+        styles.label,
+        isReversed && styles.labelReversed,
+        disabled && styles.labelDisabled
+      ) as string,
+
+      box: mergeStyles(
+        'ms-Checkbox-box',
+        styles.box
+      ) as string,
+
+      checkbox: mergeStyles(
+        'ms-Checkbox-checkbox',
+        styles.checkbox,
+        !disabled && isChecked && styles.checkboxChecked,
+        disabled && !isChecked && styles.checkboxDisabled,
+        disabled && isChecked && styles.checkboxCheckedDisabled,
+      ) as string,
+
+      checkmark: mergeStyles(
+        styles.checkmark,
+        !disabled && isChecked && styles.checkmarkChecked,
+        disabled && !isChecked && styles.checkmarkDisabled,
+        disabled && isChecked && styles.checkmarkCheckedDisabled,
+      ) as string,
+
+      text: mergeStyles(
+        'ms-Checkbox-text',
+        styles.text,
+        disabled && styles.textDisabled
+      ) as string,
+    };
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
index 77823c8810fa4..0bb91ed420227 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import {
-  Checkbox
+  Checkbox,
+  ICheckboxStyles
 } from 'office-ui-fabric-react/lib/Checkbox';
 
 export interface ICheckboxBasicExampleState {
@@ -21,6 +22,12 @@ export class CheckboxBasicExample extends React.Component<{}, ICheckboxBasicExam
   public render() {
     let { isChecked } = this.state;
 
+    let styles: ICheckboxStyles = {
+      root: {
+        marginTop: '10'
+      }
+    };
+
     return (
       <div>
         <Checkbox
@@ -30,14 +37,14 @@ export class CheckboxBasicExample extends React.Component<{}, ICheckboxBasicExam
             onFocus: () => { console.log('Uncontrolled checkbox is focused'); },
             onBlur: () => { console.log('Uncontrolled checkbox is blured'); }
           } }
-          style={ { marginTop: 10 } }
+          styles={ styles }
         />
 
         <Checkbox
           label='Uncontrolled checkbox with defaultChecked true'
           defaultChecked={ true }
           onChange={ this._onCheckboxChange }
-          style={ { marginTop: 10 } }
+          styles={ styles }
         />
 
         <Checkbox
@@ -45,7 +52,7 @@ export class CheckboxBasicExample extends React.Component<{}, ICheckboxBasicExam
           disabled={ true }
           defaultChecked={ true }
           onChange={ this._onCheckboxChange }
-          style={ { marginTop: 10 } }
+          styles={ styles }
         />
 
         <Checkbox
@@ -54,13 +61,13 @@ export class CheckboxBasicExample extends React.Component<{}, ICheckboxBasicExam
           onChange={ (ev, checked) => {
             this.setState({ isChecked: checked });
           } }
-          style={ { marginTop: 10 } }
+          styles={ styles }
         />
 
         <Checkbox
           label='Checkbox rendered with boxSide "end"'
           boxSide='end'
-          style={ { marginTop: 10 } }
+          styles={ styles }
         />
       </div>
     );
diff --git a/packages/styling/src/styles/DefaultPalette.ts b/packages/styling/src/styles/DefaultPalette.ts
index 68adf43165d02..3c0ab6500a1fa 100644
--- a/packages/styling/src/styles/DefaultPalette.ts
+++ b/packages/styling/src/styles/DefaultPalette.ts
@@ -46,5 +46,5 @@ export const DefaultPalette: IPalette = {
   tealLight: '#00b294',
   greenDark: '#004b1c',
   green: '#107c10',
-  greenLight: '#bad80a'
+  greenLight: '#bad80a',
 };
diff --git a/packages/styling/src/styles/getFocusStyle.ts b/packages/styling/src/styles/getFocusStyle.ts
index 16b2859670824..521911ec04a77 100644
--- a/packages/styling/src/styles/getFocusStyle.ts
+++ b/packages/styling/src/styles/getFocusStyle.ts
@@ -35,4 +35,4 @@ export function getFocusStyle(
       }
     })
   );
-}
+}
\ No newline at end of file
diff --git a/packages/utilities/api/utilities.api.ts b/packages/utilities/api/utilities.api.ts
index b01be0aacbccb..148a933912c03 100644
--- a/packages/utilities/api/utilities.api.ts
+++ b/packages/utilities/api/utilities.api.ts
@@ -1,3 +1,4 @@
+// @public
 export function assertNever(x: never): never;
 
 // @public

From d21643832d11a6a6e2a7484a53de72a99665ad67 Mon Sep 17 00:00:00 2001
From: Eddie Liu <leddie24@gmail.com>
Date: Tue, 18 Jul 2017 16:31:36 -0700
Subject: [PATCH 0276/1641] DetailsList: Adjust Checkmark to use
 StatusCircleCheckmark Icon (#2244)

* - Add font file versioning for mdl2 icon file.
- Change Check to use StatusCirceCheckmark icon.
- Adjust Checkmark position and font size.

* Add change files
---
 ...edwliu-detailslist-checkmark_2017-07-18-21-46.json | 11 +++++++++++
 ...edwliu-detailslist-checkmark_2017-07-18-21-46.json | 11 +++++++++++
 .../src/components/Check/Check.scss                   |  8 +++++---
 .../src/components/Check/Check.tsx                    |  2 +-
 .../selection/examples/Selection.Example.scss         |  2 +-
 packages/styling/src/styles/DefaultFontStyles.ts      |  4 +++-
 packages/styling/src/styles/IconCodes.ts              |  4 ++++
 7 files changed, 36 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/v-edwliu-detailslist-checkmark_2017-07-18-21-46.json
 create mode 100644 common/changes/office-ui-fabric-react/v-edwliu-detailslist-checkmark_2017-07-18-21-46.json

diff --git a/common/changes/@uifabric/styling/v-edwliu-detailslist-checkmark_2017-07-18-21-46.json b/common/changes/@uifabric/styling/v-edwliu-detailslist-checkmark_2017-07-18-21-46.json
new file mode 100644
index 0000000000000..f7ab67288bc10
--- /dev/null
+++ b/common/changes/@uifabric/styling/v-edwliu-detailslist-checkmark_2017-07-18-21-46.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Add statusCircleCheckmark to IconCodes.ts.  Add font file version to icon url in DefaultFontStyles.ts.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "v-edwliu@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-edwliu-detailslist-checkmark_2017-07-18-21-46.json b/common/changes/office-ui-fabric-react/v-edwliu-detailslist-checkmark_2017-07-18-21-46.json
new file mode 100644
index 0000000000000..d18ef876e5981
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-edwliu-detailslist-checkmark_2017-07-18-21-46.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: Adjust checkmark icon to use StatusCircleCheckmark icon",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-edwliu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.scss b/packages/office-ui-fabric-react/src/components/Check/Check.scss
index 9976af48d1b8c..8469f5272c24d 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.scss
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.scss
@@ -35,13 +35,13 @@ $checkBoxHeight: 16px;
   position: absolute;
   height: $checkBoxHeight;
   width: $checkBoxHeight;
-  left: 50%;
-  top: 50%;
   transform: translate(-50%, -50%);
   font-size: $checkBoxHeight;
 }
 
 .circle {
+  top: 50%;
+  left: 50%;
   color: $ms-color-neutralTertiaryAlt;
 }
 
@@ -53,7 +53,9 @@ $checkBoxHeight: 16px;
   width: auto;
   height: auto;
   color: $ms-color-neutralTertiaryAlt;
-  font-size: 12px;
+  font-size: 16px;
+  top: 40%;
+  left: 53%;
 }
 
 .rootIsChecked .check {
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.tsx b/packages/office-ui-fabric-react/src/components/Check/Check.tsx
index 921e20bc707f7..2fef18f5a634d 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.tsx
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.tsx
@@ -50,7 +50,7 @@ export class Check extends BaseComponent<ICheckProps, {}> {
         }) }
         { Icon({
           className: 'ms-Check-check ' + styles.check,
-          iconName: 'CheckMark'
+          iconName: 'StatusCircleCheckmark'
         }) }
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Example.scss b/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Example.scss
index 317cdb7618fae..c5570d48b9791 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Example.scss
+++ b/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Example.scss
@@ -4,7 +4,7 @@
   .ms-SelectionItemExample-check {
     display: inline-block;
     cursor: default;
-    padding: 8px;
+    padding: 11px 8px;
     box-sizing: border-box;
     vertical-align: top;
     background: none;
diff --git a/packages/styling/src/styles/DefaultFontStyles.ts b/packages/styling/src/styles/DefaultFontStyles.ts
index c1b46d9bb7ea9..0505cf12a549f 100644
--- a/packages/styling/src/styles/DefaultFontStyles.ts
+++ b/packages/styling/src/styles/DefaultFontStyles.ts
@@ -64,6 +64,8 @@ const LanguageToFontMap = {
   'zh-hant': FontFamilyChineseTraditional,
 };
 
+const FontFileVersion = 2.35;
+
 // Standard font sizes.
 export namespace FontSizes {
   export const mini = '10px';
@@ -192,7 +194,7 @@ function _registerDefaultFontFaces(): void {
     _registerFontFace('Leelawadee UI Web', `${fontUrl}/leelawadeeui-thai/leelawadeeui-bold`, FontWeights.semibold);
 
     // Register icon urls.
-    _registerFontFace('FabricMDL2Icons', `${iconUrl}/fabricmdl2icons`, FontWeights.regular);
+    _registerFontFace('FabricMDL2Icons', `${iconUrl}/fabricmdl2icons-${FontFileVersion}`, FontWeights.regular);
   }
 }
 
diff --git a/packages/styling/src/styles/IconCodes.ts b/packages/styling/src/styles/IconCodes.ts
index 1461a370e495b..7e451d58efab8 100644
--- a/packages/styling/src/styles/IconCodes.ts
+++ b/packages/styling/src/styles/IconCodes.ts
@@ -2419,6 +2419,10 @@ export const IconCodes = {
    * Icon code with the value '\uEF78'.
    */
   starburst: '\uEF78',
+  /**
+   * Icon code with the value '\uF13E'.
+   */
+  statusCircleCheckmark: '\uF13E',
   /**
    * Icon code with the value '\uEB90'.
    */

From f20603f91695cb47ffa24edfaeaa4d7cf4eea229 Mon Sep 17 00:00:00 2001
From: Kier Borromeo <seraphipod@gmail.com>
Date: Wed, 19 Jul 2017 22:34:55 +0800
Subject: [PATCH 0277/1641] Fix link to dialog (#2251)

---
 .../office-ui-fabric-react/src/components/Modal/ModalPage.tsx   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/src/components/Modal/ModalPage.tsx b/packages/office-ui-fabric-react/src/components/Modal/ModalPage.tsx
index 139561833f791..6e8ff3941cc4d 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/ModalPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Modal/ModalPage.tsx
@@ -36,7 +36,7 @@ export class ModalPage extends React.Component<IComponentDemoPageProps, {}> {
               Modals are temporary, modal UI overlay that generally provide contextual app information or require user confirmation/input, or can be used to advertise new app features. In some cases, Modals block interactions with the web page or application until being explicitly dismissed. They are can be used for lightweight creation or edit tasks and simple management tasks, or for hosting heavier temporary content.
             </p>
             <p>
-              For usage requiring a quick choice from the user, <Link href='#/examples/dialog'>Dialog</Link> may be a more appropriate control.
+              For usage requiring a quick choice from the user, <Link href='#/components/dialog'>Dialog</Link> may be a more appropriate control.
             </p>
           </div>
         }

From ae602de38bdd5268ac61138064ecf3f3dbaccd03 Mon Sep 17 00:00:00 2001
From: Trevor Gau <trevorsg@gmail.com>
Date: Wed, 19 Jul 2017 12:20:43 -0400
Subject: [PATCH 0278/1641] Fix CommandBar rendering commandText span when no
 item name is given: #2233. (#2235)

---
 .../commandtextfix_2017-07-18-15-14.json              | 11 +++++++++++
 .../src/components/CommandBar/CommandBar.tsx          | 11 +++++++++--
 2 files changed, 20 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/commandtextfix_2017-07-18-15-14.json

diff --git a/common/changes/office-ui-fabric-react/commandtextfix_2017-07-18-15-14.json b/common/changes/office-ui-fabric-react/commandtextfix_2017-07-18-15-14.json
new file mode 100644
index 0000000000000..6a05264ffa709
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/commandtextfix_2017-07-18-15-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix CommandBar rendering commandText span when no item name is given: #2233.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "trgau@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 3cd26b5c51e35..f43ba89ab15d9 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -228,8 +228,15 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
             aria-haspopup={ hasSubmenuItems(item) }
           >
             { (hasIcon) ? this._renderIcon(item) : (null) }
-            <span className={ css(
-              'ms-CommandBarItem-commandText', styles.itemCommandText) } aria-hidden='true' role='presentation'>{ item.name }</span>
+            { (!!item.name) && (
+              <span
+                className={ css('ms-CommandBarItem-commandText', styles.itemCommandText) }
+                aria-hidden='true'
+                role='presentation'
+              >
+                { item.name }
+              </span>
+            ) }
           </div>;
         }
       })() }

From 392037a0c018c26c814327950bb698f7e86d56c1 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 19 Jul 2017 21:40:34 +0000
Subject: [PATCH 0279/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 .../oufr-strict-null_2017-07-14-01-46.json    | 11 -----
 .../oufr-strict-null_2017-07-14-01-46.json    | 11 -----
 .../oufr-strict-null_2017-07-14-01-46.json    | 11 -----
 ...etailslist-checkmark_2017-07-18-21-46.json | 11 -----
 .../oufr-strict-null_2017-07-14-01-46.json    | 11 -----
 .../breadcrumb-tooltip_2017-07-10-17-24.json  | 11 -----
 .../commandtextfix_2017-07-18-15-14.json      | 11 -----
 .../oufr-strict-null_2017-07-14-01-46.json    | 11 -----
 ...andard-button-styles_2017-07-18-16-21.json | 11 -----
 ...etailslist-checkmark_2017-07-18-21-46.json | 11 -----
 ...iu-dropdown-classfix_2017-07-17-18-42.json | 11 -----
 packages/example-app-base/package.json        |  4 +-
 packages/example-component/package.json       |  6 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 47 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 14 +++++-
 packages/office-ui-fabric-react/package.json  |  6 +--
 packages/styling/CHANGELOG.json               | 19 ++++++++
 packages/styling/CHANGELOG.md                 |  9 +++-
 packages/styling/package.json                 |  4 +-
 packages/utilities/CHANGELOG.json             | 14 ++++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  2 +-
 23 files changed, 121 insertions(+), 136 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/oufr-strict-null_2017-07-14-01-46.json
 delete mode 100644 common/changes/@uifabric/fabric-website/oufr-strict-null_2017-07-14-01-46.json
 delete mode 100644 common/changes/@uifabric/styling/oufr-strict-null_2017-07-14-01-46.json
 delete mode 100644 common/changes/@uifabric/styling/v-edwliu-detailslist-checkmark_2017-07-18-21-46.json
 delete mode 100644 common/changes/@uifabric/utilities/oufr-strict-null_2017-07-14-01-46.json
 delete mode 100644 common/changes/office-ui-fabric-react/breadcrumb-tooltip_2017-07-10-17-24.json
 delete mode 100644 common/changes/office-ui-fabric-react/commandtextfix_2017-07-18-15-14.json
 delete mode 100644 common/changes/office-ui-fabric-react/oufr-strict-null_2017-07-14-01-46.json
 delete mode 100644 common/changes/office-ui-fabric-react/standard-button-styles_2017-07-18-16-21.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-edwliu-detailslist-checkmark_2017-07-18-21-46.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-edwliu-dropdown-classfix_2017-07-17-18-42.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index e2c56977267a6..81eb66ed71758 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -48,7 +48,7 @@
   },
   "dependencies": {
     "@uifabric/example-app-base": ">=4.1.1 <5.0.0",
-    "@uifabric/utilities": ">=4.7.2 <5.0.0",
+    "@uifabric/utilities": ">=4.8.0 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
diff --git a/common/changes/@uifabric/example-app-base/oufr-strict-null_2017-07-14-01-46.json b/common/changes/@uifabric/example-app-base/oufr-strict-null_2017-07-14-01-46.json
deleted file mode 100644
index e807ce07d1d8c..0000000000000
--- a/common/changes/@uifabric/example-app-base/oufr-strict-null_2017-07-14-01-46.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/oufr-strict-null_2017-07-14-01-46.json b/common/changes/@uifabric/fabric-website/oufr-strict-null_2017-07-14-01-46.json
deleted file mode 100644
index cbeaf5c6e2864..0000000000000
--- a/common/changes/@uifabric/fabric-website/oufr-strict-null_2017-07-14-01-46.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/oufr-strict-null_2017-07-14-01-46.json b/common/changes/@uifabric/styling/oufr-strict-null_2017-07-14-01-46.json
deleted file mode 100644
index 10861b0091cd0..0000000000000
--- a/common/changes/@uifabric/styling/oufr-strict-null_2017-07-14-01-46.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/v-edwliu-detailslist-checkmark_2017-07-18-21-46.json b/common/changes/@uifabric/styling/v-edwliu-detailslist-checkmark_2017-07-18-21-46.json
deleted file mode 100644
index f7ab67288bc10..0000000000000
--- a/common/changes/@uifabric/styling/v-edwliu-detailslist-checkmark_2017-07-18-21-46.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Add statusCircleCheckmark to IconCodes.ts.  Add font file version to icon url in DefaultFontStyles.ts.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "v-edwliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/oufr-strict-null_2017-07-14-01-46.json b/common/changes/@uifabric/utilities/oufr-strict-null_2017-07-14-01-46.json
deleted file mode 100644
index 45754156d2dff..0000000000000
--- a/common/changes/@uifabric/utilities/oufr-strict-null_2017-07-14-01-46.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Add assertNever function for exhaustive null checking",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/breadcrumb-tooltip_2017-07-10-17-24.json b/common/changes/office-ui-fabric-react/breadcrumb-tooltip_2017-07-10-17-24.json
deleted file mode 100644
index 64d3c994c7c89..0000000000000
--- a/common/changes/office-ui-fabric-react/breadcrumb-tooltip_2017-07-10-17-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Breadcrumb: Uses tooltip when breadcrumb text is truncated",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/commandtextfix_2017-07-18-15-14.json b/common/changes/office-ui-fabric-react/commandtextfix_2017-07-18-15-14.json
deleted file mode 100644
index 6a05264ffa709..0000000000000
--- a/common/changes/office-ui-fabric-react/commandtextfix_2017-07-18-15-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix CommandBar rendering commandText span when no item name is given: #2233.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "trgau@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/oufr-strict-null_2017-07-14-01-46.json b/common/changes/office-ui-fabric-react/oufr-strict-null_2017-07-14-01-46.json
deleted file mode 100644
index fb11f585dd89c..0000000000000
--- a/common/changes/office-ui-fabric-react/oufr-strict-null_2017-07-14-01-46.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Start fixing some strictNullCheck errors",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/standard-button-styles_2017-07-18-16-21.json b/common/changes/office-ui-fabric-react/standard-button-styles_2017-07-18-16-21.json
deleted file mode 100644
index dd3d67464d354..0000000000000
--- a/common/changes/office-ui-fabric-react/standard-button-styles_2017-07-18-16-21.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DefaultButton: Make styles match design",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-edwliu-detailslist-checkmark_2017-07-18-21-46.json b/common/changes/office-ui-fabric-react/v-edwliu-detailslist-checkmark_2017-07-18-21-46.json
deleted file mode 100644
index d18ef876e5981..0000000000000
--- a/common/changes/office-ui-fabric-react/v-edwliu-detailslist-checkmark_2017-07-18-21-46.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: Adjust checkmark icon to use StatusCircleCheckmark icon",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-edwliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-edwliu-dropdown-classfix_2017-07-17-18-42.json b/common/changes/office-ui-fabric-react/v-edwliu-dropdown-classfix_2017-07-17-18-42.json
deleted file mode 100644
index c91d56d5754d9..0000000000000
--- a/common/changes/office-ui-fabric-react/v-edwliu-dropdown-classfix_2017-07-17-18-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: List native props at top of div element",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-edwliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 61b456532d073..fcf3a05764b7f 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -48,8 +48,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.13.11 <1.0.0",
-    "@uifabric/utilities": ">=4.7.2 <5.0.0",
+    "@uifabric/styling": ">=0.13.12 <1.0.0",
+    "@uifabric/utilities": ">=4.8.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.4.0 <5.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 40fdcc1bd2d4c..0d0322256942d 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-component",
-  "version": "1.0.44",
+  "version": "1.0.45",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -22,7 +22,7 @@
     "@types/react-dom": "15.5.0",
     "@types/webpack-env": "1.13.0",
     "@uifabric/example-app-base": "4.1.1",
-    "@uifabric/utilities": "4.7.2",
+    "@uifabric/utilities": "4.8.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.21.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.21.2 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index ea3cc019b9fb9..c182f377b488a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,53 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.21.2",
+      "tag": "office-ui-fabric-react_v4.21.2",
+      "date": "Wed, 19 Jul 2017 21:40:34 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "808742dffd5378cd908cc4ed1bebc175a3702dff",
+            "comment": "Breadcrumb: Uses tooltip when breadcrumb text is truncated"
+          },
+          {
+            "author": "Trevor Gau <trevorsg@gmail.com>",
+            "commit": "ae602de38bdd5268ac61138064ecf3f3dbaccd03",
+            "comment": "Fix CommandBar rendering commandText span when no item name is given: #2233."
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "074fabb6f0ffd52598947d9dda563d4dd8113ee7",
+            "comment": "Start fixing some strictNullCheck errors"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "da9fc82e21b99e350ef090d15d26e06de61753ec",
+            "comment": "DefaultButton: Make styles match design"
+          },
+          {
+            "author": "Eddie Liu <leddie24@gmail.com>",
+            "commit": "d21643832d11a6a6e2a7484a53de72a99665ad67",
+            "comment": "DetailsList: Adjust checkmark icon to use StatusCircleCheckmark icon"
+          },
+          {
+            "author": "Eddie Liu <leddie24@gmail.com>",
+            "commit": "a93a3a3fc9ef425df4bc6fb990125c0770b97374",
+            "comment": "Dropdown: List native props at top of div element"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.7.2 <5.0.0` to `>=4.8.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.13.11 <1.0.0` to `>=0.13.12 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.21.1",
       "tag": "office-ui-fabric-react_v4.21.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index d4df1ec8ad55d..5ec940221e27f 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,18 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 17 Jul 2017 18:38:01 GMT and should not be manually modified.
+This log was last generated on Wed, 19 Jul 2017 21:40:34 GMT and should not be manually modified.
+
+## 4.21.2
+Wed, 19 Jul 2017 21:40:34 GMT
+
+### Patches
+
+- Breadcrumb: Uses tooltip when breadcrumb text is truncated
+- Fix CommandBar rendering commandText span when no item name is given: #2233.
+- Start fixing some strictNullCheck errors
+- DefaultButton: Make styles match design
+- DetailsList: Adjust checkmark icon to use StatusCircleCheckmark icon
+- Dropdown: List native props at top of div element
 
 ## 4.21.1
 Mon, 17 Jul 2017 18:38:01 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index d466faef72a46..2162eedd29d6f 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.21.1",
+  "version": "4.21.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -71,8 +71,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.7.2 <5.0.0",
-    "@uifabric/styling": ">=0.13.11 <1.0.0",
+    "@uifabric/utilities": ">=4.8.0 <5.0.0",
+    "@uifabric/styling": ">=0.13.12 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 49b0b4968bb1e..f154b65523525 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.13.12",
+      "tag": "@uifabric/styling_v0.13.12",
+      "date": "Wed, 19 Jul 2017 21:40:34 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Eddie Liu <leddie24@gmail.com>",
+            "commit": "d21643832d11a6a6e2a7484a53de72a99665ad67",
+            "comment": "Add statusCircleCheckmark to IconCodes.ts.  Add font file version to icon url in DefaultFontStyles.ts."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.7.2 <5.0.0` to `>=4.8.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.13.11",
       "tag": "@uifabric/styling_v0.13.11",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 976fbe762be51..d9a3ad377d93c 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Mon, 17 Jul 2017 18:38:01 GMT and should not be manually modified.
+This log was last generated on Wed, 19 Jul 2017 21:40:34 GMT and should not be manually modified.
+
+## 0.13.12
+Wed, 19 Jul 2017 21:40:34 GMT
+
+### Patches
+
+- Add statusCircleCheckmark to IconCodes.ts.  Add font file version to icon url in DefaultFontStyles.ts.
 
 ## 0.13.11
 Mon, 17 Jul 2017 18:38:01 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 753ec28dda5e0..e46891cfbae24 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.13.11",
+  "version": "0.13.12",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.7.2 <5.0.0",
+    "@uifabric/utilities": ">=4.8.0 <5.0.0",
     "tslib": "^1.6.0",
     "rtl-css-js": "^1.1.1",
     "glamor": "^2.20.24"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 06fc93cbdf753..0002bc7e3ab9e 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.8.0",
+      "tag": "@uifabric/utilities_v4.8.0",
+      "date": "Wed, 19 Jul 2017 21:40:34 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "074fabb6f0ffd52598947d9dda563d4dd8113ee7",
+            "comment": "Add assertNever function for exhaustive null checking"
+          }
+        ]
+      }
+    },
     {
       "version": "4.7.2",
       "tag": "@uifabric/utilities_v4.7.2",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 6df089d4a4c3d..c43986328304a 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Wed, 12 Jul 2017 01:49:50 GMT and should not be manually modified.
+This log was last generated on Wed, 19 Jul 2017 21:40:34 GMT and should not be manually modified.
+
+## 4.8.0
+Wed, 19 Jul 2017 21:40:34 GMT
+
+### Minor changes
+
+- Add assertNever function for exhaustive null checking
 
 ## 4.7.2
 Wed, 12 Jul 2017 01:49:50 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index cfdd6b50e2d33..0e07696d4b52f 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.7.2",
+  "version": "4.8.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From db6b2fa0a54f623f0bd659938c7193c31ba3bbde Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Wed, 19 Jul 2017 15:55:53 -0700
Subject: [PATCH 0280/1641] Checkbox: remove unnecessary styles and element
 (#2249)

* cleanup

* match original styling

* add change file

* fix reversed case
---
 .../phkuo-checkboxCleanup_2017-07-19-01-22.json | 11 +++++++++++
 .../src/components/Checkbox/Checkbox.Props.ts   |  5 -----
 .../src/components/Checkbox/Checkbox.styles.ts  | 17 ++---------------
 .../src/components/Checkbox/Checkbox.tsx        | 12 ++----------
 4 files changed, 15 insertions(+), 30 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/phkuo-checkboxCleanup_2017-07-19-01-22.json

diff --git a/common/changes/office-ui-fabric-react/phkuo-checkboxCleanup_2017-07-19-01-22.json b/common/changes/office-ui-fabric-react/phkuo-checkboxCleanup_2017-07-19-01-22.json
new file mode 100644
index 0000000000000..942461497a4e8
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/phkuo-checkboxCleanup_2017-07-19-01-22.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Checkbox: remove unnecessary styles and element",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
index c6a25ae4995e7..0ff7fe49d2cca 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
@@ -100,11 +100,6 @@ export interface ICheckboxStyles {
    */
   labelDisabled?: IStyle;
 
-  /**
-   * Style for the box (container for the actual checkbox).
-   */
-  box?: IStyle;
-
   /**
    * Style for checkbox in its default unchecked/enabled state.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
index b75b524567227..335b286d9e2b4 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
@@ -35,18 +35,12 @@ export const getStyles = memoizeFunction((
         outline: 'none',
         display: 'block',
         cursor: 'pointer',
-
-        // This is to hide the label's overflow because of the negative margin.
-        overflow: 'hidden'
       }
     ],
     label: {
       display: 'inline-flex',
       alignItems: 'center',
       cursor: 'pointer',
-
-      // The negative margin is in place to correct for the margin of the box
-      margin: '0 -4px',
       position: 'relative',
       userSelect: 'none'
     },
@@ -57,14 +51,6 @@ export const getStyles = memoizeFunction((
     labelDisabled: {
       cursor: 'default'
     },
-    box: {
-      display: 'flex',
-      margin: '0 4px',
-      alignItems: 'center',
-      justifyContent: 'center',
-      flex: '0 0 ' + MS_CHECKBOX_LABEL_SIZE,
-      height: MS_CHECKBOX_LABEL_SIZE,
-    },
     checkbox: {
       display: 'flex',
       alignItems: 'center',
@@ -74,6 +60,7 @@ export const getStyles = memoizeFunction((
       borderWidth: '1px',
       borderStyle: 'solid',
       borderColor: checkboxBorderColor,
+      marginRight: '8px',
       boxSizing: 'border-box',
       transitionProperty: 'background, border, border-color',
       transitionDuration: MS_CHECKBOX_TRANSITION_DURATION,
@@ -111,7 +98,7 @@ export const getStyles = memoizeFunction((
       color: checkmarkFontColorCheckedDisabled,
     },
     text: {
-      margin: '0 4px'
+      marginRight: '8px'
     },
     textHovered: {
       color: palette.black,
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
index 0f4af104dbcfd..8e8c2102d5d2d 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
@@ -28,7 +28,6 @@ export interface ICheckboxState {
 interface ICheckboxClassNames {
   root: string;
   label: string;
-  box: string;
   checkbox: string;
   checkmark: string;
   text: string;
@@ -115,10 +114,8 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
         aria-disabled={ disabled }
       >
         <label className={ classNames.label } htmlFor={ this._id } >
-          <div className={ classNames.box }>
-            <div className={ classNames.checkbox }>
-              <Icon iconName='CheckMark' className={ classNames.checkmark } />
-            </div>
+          <div className={ classNames.checkbox }>
+            <Icon iconName='CheckMark' className={ classNames.checkmark } />
           </div>
           { label && <span className={ classNames.text }>{ label }</span> }
         </label>
@@ -205,11 +202,6 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
         disabled && styles.labelDisabled
       ) as string,
 
-      box: mergeStyles(
-        'ms-Checkbox-box',
-        styles.box
-      ) as string,
-
       checkbox: mergeStyles(
         'ms-Checkbox-checkbox',
         styles.checkbox,

From 85bd583f0009bdbc395702dc7c61f6cccad36e92 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Wed, 19 Jul 2017 16:28:25 -0700
Subject: [PATCH 0281/1641] Jspurlin/swatch color picker box sizing fix (#2236)

* SwatchColorPicker: Fix box-sizing styling that recently regressed

* Add change file
---
 ...watchColorPickerBoxSizingFix_2017-07-18-15-53.json | 11 +++++++++++
 .../SwatchColorPicker/SwatchColorPicker.scss          |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerBoxSizingFix_2017-07-18-15-53.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerBoxSizingFix_2017-07-18-15-53.json b/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerBoxSizingFix_2017-07-18-15-53.json
new file mode 100644
index 0000000000000..69e52470b36d1
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerBoxSizingFix_2017-07-18-15-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SwatchColorPicker: Fix a recent regression in box-sizing seen on the external site for the swatchColorPicker",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
index 52556510b1b3b..4ac8360a315d2 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
@@ -8,6 +8,7 @@
   width: 20px;
   height: 20px;
   padding: 4px;
+  box-sizing: content-box;
 }
 
 :global(.ms-Fabric.is-focusVisible) .cell {

From d941ab196ad982207a1142c8f6649216c2d74659 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 20 Jul 2017 10:11:23 +0000
Subject: [PATCH 0282/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...orPickerBoxSizingFix_2017-07-18-15-53.json | 11 ---------
 ...hkuo-checkboxCleanup_2017-07-19-01-22.json | 11 ---------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 24 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++++-
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/CHANGELOG.json               |  6 +++++
 packages/styling/CHANGELOG.md                 |  7 +++++-
 packages/styling/package.json                 |  2 +-
 14 files changed, 54 insertions(+), 33 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerBoxSizingFix_2017-07-18-15-53.json
 delete mode 100644 common/changes/office-ui-fabric-react/phkuo-checkboxCleanup_2017-07-19-01-22.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 81eb66ed71758..b73dd964e1ece 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.21.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.21.3 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 3abce8e744b54..80709b255b25d 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.21.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.21.3 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 2e5e01cf744fc..e4aa5bc4fd8f7 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -35,7 +35,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.21.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.21.3 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index e8d3d094b8341..dedf27e7ef17d 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.21.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.21.3 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerBoxSizingFix_2017-07-18-15-53.json b/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerBoxSizingFix_2017-07-18-15-53.json
deleted file mode 100644
index 69e52470b36d1..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerBoxSizingFix_2017-07-18-15-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SwatchColorPicker: Fix a recent regression in box-sizing seen on the external site for the swatchColorPicker",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/phkuo-checkboxCleanup_2017-07-19-01-22.json b/common/changes/office-ui-fabric-react/phkuo-checkboxCleanup_2017-07-19-01-22.json
deleted file mode 100644
index 942461497a4e8..0000000000000
--- a/common/changes/office-ui-fabric-react/phkuo-checkboxCleanup_2017-07-19-01-22.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Checkbox: remove unnecessary styles and element",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index fcf3a05764b7f..3fd960c3527e4 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -48,7 +48,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.13.12 <1.0.0",
+    "@uifabric/styling": ">=0.13.13 <1.0.0",
     "@uifabric/utilities": ">=4.8.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 0d0322256942d..1ec1ff716a2a3 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.21.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.21.3 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index c182f377b488a..78358797c1ec7 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.21.3",
+      "tag": "office-ui-fabric-react_v4.21.3",
+      "date": "Thu, 20 Jul 2017 10:11:23 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "85bd583f0009bdbc395702dc7c61f6cccad36e92",
+            "comment": "SwatchColorPicker: Fix a recent regression in box-sizing seen on the external site for the swatchColorPicker"
+          },
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "db6b2fa0a54f623f0bd659938c7193c31ba3bbde",
+            "comment": "Checkbox: remove unnecessary styles and element"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.13.12 <1.0.0` to `>=0.13.13 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.21.2",
       "tag": "office-ui-fabric-react_v4.21.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 5ec940221e27f..866db4efd87f9 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 19 Jul 2017 21:40:34 GMT and should not be manually modified.
+This log was last generated on Thu, 20 Jul 2017 10:11:23 GMT and should not be manually modified.
+
+## 4.21.3
+Thu, 20 Jul 2017 10:11:23 GMT
+
+### Patches
+
+- SwatchColorPicker: Fix a recent regression in box-sizing seen on the external site for the swatchColorPicker
+- Checkbox: remove unnecessary styles and element
 
 ## 4.21.2
 Wed, 19 Jul 2017 21:40:34 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 2162eedd29d6f..9c2e594c0d578 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.21.2",
+  "version": "4.21.3",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.8.0 <5.0.0",
-    "@uifabric/styling": ">=0.13.12 <1.0.0",
+    "@uifabric/styling": ">=0.13.13 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index f154b65523525..5fd244095f980 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.13.13",
+      "tag": "@uifabric/styling_v0.13.13",
+      "date": "Thu, 20 Jul 2017 10:11:23 GMT",
+      "comments": {}
+    },
     {
       "version": "0.13.12",
       "tag": "@uifabric/styling_v0.13.12",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index d9a3ad377d93c..7f1e44f521caf 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Wed, 19 Jul 2017 21:40:34 GMT and should not be manually modified.
+This log was last generated on Thu, 20 Jul 2017 10:11:23 GMT and should not be manually modified.
+
+## 0.13.13
+Thu, 20 Jul 2017 10:11:23 GMT
+
+*Changes not tracked*
 
 ## 0.13.12
 Wed, 19 Jul 2017 21:40:34 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index e46891cfbae24..79176aa43a797 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.13.12",
+  "version": "0.13.13",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 91323c55902c278e73a13118fc3cd2d7dc00da62 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Thu, 20 Jul 2017 08:09:39 -0700
Subject: [PATCH 0283/1641] Textfield disabled (#2255)

* Textfield: Fixed regression in disabled styles

* Added change file
---
 .../textfield-disabled_2017-07-19-16-10.json          | 11 +++++++++++
 .../src/components/TextField/TextField.scss           |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/textfield-disabled_2017-07-19-16-10.json

diff --git a/common/changes/office-ui-fabric-react/textfield-disabled_2017-07-19-16-10.json b/common/changes/office-ui-fabric-react/textfield-disabled_2017-07-19-16-10.json
new file mode 100644
index 0000000000000..7a7a2b54a068b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/textfield-disabled_2017-07-19-16-10.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Textfield: Fixed regression in disabled styles",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index ed89350e619b6..b183b8c05a4ad 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -56,7 +56,7 @@ $field-error-color: $errorTextColor;
     border-color: $field-border-focus-color;
   }
 
-  .rootIsDisabled > & {
+  .rootIsDisabled & {
     background-color: $field-background-disabled-color;
     border-color: $field-border-disabled-color;
     pointer-events: none;

From 0a145b00965c9aefabc1aa6648b36f53281691fb Mon Sep 17 00:00:00 2001
From: antonlabunets <alabunets@gmail.com>
Date: Thu, 20 Jul 2017 08:16:56 -0700
Subject: [PATCH 0284/1641] Adding multi-column icons to the styling Icon map
 (#2240)

* Manually add multi-column related icons

* Adding multi-column icons to map

* Fixing single column copy-paste

* Clarifying the change
---
 ...ntonla-iconCodes-multiColumn_2017-07-18-18-15.json | 11 +++++++++++
 packages/styling/src/styles/IconCodes.ts              |  9 ++++++++-
 2 files changed, 19 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/styling/antonla-iconCodes-multiColumn_2017-07-18-18-15.json

diff --git a/common/changes/@uifabric/styling/antonla-iconCodes-multiColumn_2017-07-18-18-15.json b/common/changes/@uifabric/styling/antonla-iconCodes-multiColumn_2017-07-18-18-15.json
new file mode 100644
index 0000000000000..319124db5eaa6
--- /dev/null
+++ b/common/changes/@uifabric/styling/antonla-iconCodes-multiColumn_2017-07-18-18-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Adding multi-column mapping to the icon map to be available in the ChoiceGroup",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "antonla@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/styling/src/styles/IconCodes.ts b/packages/styling/src/styles/IconCodes.ts
index 7e451d58efab8..334b86bada74f 100644
--- a/packages/styling/src/styles/IconCodes.ts
+++ b/packages/styling/src/styles/IconCodes.ts
@@ -2830,5 +2830,12 @@ export const IconCodes = {
   /**
    * Icon code with the value '\uE71F'.
    */
-  zoomOut: '\uE71F'
+  zoomOut: '\uE71F',
+
+  // Manual additions for multi-column icons
+  singleColumn: '\uF1D3',
+  doubleColumn: '\uF1D4',
+  tripleColumn: '\uF1D5',
+  columnLeftTwoThirds: '\uF1D6',
+  columnRightTwoThirds: '\uF1D7',
 };

From 305a3e76f8f9fae6b6ff1f7ceeb659b963f840f1 Mon Sep 17 00:00:00 2001
From: Peter Jahn <pejahn@microsoft.com>
Date: Thu, 20 Jul 2017 08:18:07 -0700
Subject: [PATCH 0285/1641] Fabric site: Fix link to Color Accessibility PDF
 (#2260)

* Remove erroneous usage of baseUrl to fix link to color accessibility guide

* Add rush change
---
 .../src/pages/Styles/ColorsPage/ColorsPage.tsx        |  2 +-
 .../jahnp-site-fixes_2017-07-20-05-22.json            | 11 +++++++++++
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/fabric-website/jahnp-site-fixes_2017-07-20-05-22.json

diff --git a/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx b/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
index 8cd67a1e6c89e..9303d8fa1a84c 100644
--- a/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
@@ -38,7 +38,7 @@ export class ColorsPage extends React.Component<any, any> {
         />
         <div className={ pageStyles.u_maxTextWidth }>
           <h2 id='Overview'>Overview</h2>
-          <p>Fabric includes 9 theme colors and 11 neutral colors. Each has helper classes for text, background, border, and hover states. When selecting colors, refer to the <a href={ baseURL + 'https://static2.sharepointonline.com/files/fabric/fabric-website/files/coloraccessibility_29sep2016.pdf' }>color accessibility guidance (PDF)</a> to ensure that your text can be ready by everyone.</p>
+          <p>Fabric includes 9 theme colors and 11 neutral colors. Each has helper classes for text, background, border, and hover states. When selecting colors, refer to the <a href={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/files/coloraccessibility_29sep2016.pdf' }>color accessibility guidance (PDF)</a> to ensure that your text can be ready by everyone.</p>
         </div>
         <h2 id='implementation'>Implementation</h2>
         <p>Colors can be applied to text, backgrounds, or borders using the following class name conventions:</p>
diff --git a/common/changes/@uifabric/fabric-website/jahnp-site-fixes_2017-07-20-05-22.json b/common/changes/@uifabric/fabric-website/jahnp-site-fixes_2017-07-20-05-22.json
new file mode 100644
index 0000000000000..6c634a24b4fad
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/jahnp-site-fixes_2017-07-20-05-22.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Remove erroneous usage of baseUrl to fix link to color accessibility guide",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "pejahn@microsoft.com"
+}
\ No newline at end of file

From 06ef248801b5a43513c86ce7cc3f06696cb43397 Mon Sep 17 00:00:00 2001
From: Aadhar Surange <adhargithub@gmail.com>
Date: Thu, 20 Jul 2017 20:48:38 +0530
Subject: [PATCH 0286/1641] Fixing disable of tag items when tag picker is
 disabled (#2219)

* Fixing deletion of tag item when tagpicker is disabled

* Change files
---
 .../users-adsurang-15julyfixes_2017-07-15-07-24.json  | 11 +++++++++++
 .../users-adsurang-15julyfixes_2017-07-15-07-24.json  | 11 +++++++++++
 .../users-adsurang-15julyfixes_2017-07-15-07-24.json  | 11 +++++++++++
 .../users-adsurang-15julyfixes_2017-07-15-07-24.json  | 11 +++++++++++
 .../users-adsurang-15julyfixes_2017-07-15-07-24.json  | 11 +++++++++++
 .../src/components/pickers/BasePicker.tsx             |  3 +++
 .../src/components/pickers/TagPicker/TagItem.tsx      | 10 ++++++----
 7 files changed, 64 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/users-adsurang-15julyfixes_2017-07-15-07-24.json
 create mode 100644 common/changes/@uifabric/fabric-website/users-adsurang-15julyfixes_2017-07-15-07-24.json
 create mode 100644 common/changes/@uifabric/styling/users-adsurang-15julyfixes_2017-07-15-07-24.json
 create mode 100644 common/changes/@uifabric/utilities/users-adsurang-15julyfixes_2017-07-15-07-24.json
 create mode 100644 common/changes/office-ui-fabric-react/users-adsurang-15julyfixes_2017-07-15-07-24.json

diff --git a/common/changes/@uifabric/example-app-base/users-adsurang-15julyfixes_2017-07-15-07-24.json b/common/changes/@uifabric/example-app-base/users-adsurang-15julyfixes_2017-07-15-07-24.json
new file mode 100644
index 0000000000000..7d80e8e887db5
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/users-adsurang-15julyfixes_2017-07-15-07-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "adsurang@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/users-adsurang-15julyfixes_2017-07-15-07-24.json b/common/changes/@uifabric/fabric-website/users-adsurang-15julyfixes_2017-07-15-07-24.json
new file mode 100644
index 0000000000000..f3ff20e3759a2
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/users-adsurang-15julyfixes_2017-07-15-07-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "adsurang@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/users-adsurang-15julyfixes_2017-07-15-07-24.json b/common/changes/@uifabric/styling/users-adsurang-15julyfixes_2017-07-15-07-24.json
new file mode 100644
index 0000000000000..862f25c73e009
--- /dev/null
+++ b/common/changes/@uifabric/styling/users-adsurang-15julyfixes_2017-07-15-07-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "adsurang@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/users-adsurang-15julyfixes_2017-07-15-07-24.json b/common/changes/@uifabric/utilities/users-adsurang-15julyfixes_2017-07-15-07-24.json
new file mode 100644
index 0000000000000..b7a21e19e9cff
--- /dev/null
+++ b/common/changes/@uifabric/utilities/users-adsurang-15julyfixes_2017-07-15-07-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "adsurang@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-adsurang-15julyfixes_2017-07-15-07-24.json b/common/changes/office-ui-fabric-react/users-adsurang-15julyfixes_2017-07-15-07-24.json
new file mode 100644
index 0000000000000..90aa6b4e2f8bc
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-adsurang-15julyfixes_2017-07-15-07-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixed deletion of tag item when tag picker is disabled",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "adsurang@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index bab321bfd4b4b..c96ffde07e58a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -169,7 +169,9 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   }
 
   protected renderItems(): JSX.Element[] {
+    let { disabled } = this.props;
     let onRenderItem = this.props.onRenderItem as (props: IPickerItemProps<T>) => JSX.Element;
+
     let { items } = this.state;
     return items.map((item: any, index: number) => onRenderItem({
       item,
@@ -177,6 +179,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
       key: item.key ? item.key : index,
       selected: this.selection.isIndexSelected(index),
       onRemoveItem: () => this.removeItem(item),
+      disabled: disabled,
       onItemChange: this.onItemChange
     }));
   }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx
index 174f53d92ba89..6df597b1f33ea 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx
@@ -16,10 +16,12 @@ export const TagItem = (props: IPickerItemProps<ITag>) => (
       props.selected && styles.isSelected) }
     key={ props.index }
     data-selection-index={ props.index }
-    data-is-focusable={ true }>
+    data-is-focusable={ !props.disabled && true }>
     <span className={ css('ms-TagItem-text', styles.tagItemText) }>{ props.children }</span>
-    <span className={ css('ms-TagItem-close', styles.tagItemClose) } onClick={ props.onRemoveItem }>
-      <Icon iconName='Cancel' />
-    </span>
+    { !props.disabled &&
+      <span className={ css('ms-TagItem-close', styles.tagItemClose) } onClick={ props.onRemoveItem }>
+        <Icon iconName='Cancel' />
+      </span>
+    }
   </div>
 );

From dcec97d5dd145a80baee3fd80c715286e1597d0a Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 20 Jul 2017 08:58:57 -0700
Subject: [PATCH 0287/1641] ResizeGroup: Use scrollWidth instead of clientWidth
 for measuring hidden div (#2248)

* Use scroll width instead of client width for measuring hidden div.

* Rush change
---
 .../use-scroll-width_2017-07-18-23-50.json            | 11 +++++++++++
 .../src/components/ResizeGroup/ResizeGroup.tsx        |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/use-scroll-width_2017-07-18-23-50.json

diff --git a/common/changes/office-ui-fabric-react/use-scroll-width_2017-07-18-23-50.json b/common/changes/office-ui-fabric-react/use-scroll-width_2017-07-18-23-50.json
new file mode 100644
index 0000000000000..2bcf64bceaf0e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/use-scroll-width_2017-07-18-23-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ResizeGroup: Use scrollWidth instead of clientWidth for measuring hidden div",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index f2141728c2104..79dee7d4c4500 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -244,7 +244,7 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
       }
       let nextState = this._getNextResizeGroupState(this.props,
         this.state,
-        () => this._measured.getBoundingClientRect().width,
+        () => this._measured.scrollWidth,
         containerWidth);
 
       if (nextState) {

From cfafb77d4f1f1eca7e94799bb3ab88734057717a Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Thu, 20 Jul 2017 10:18:45 -0700
Subject: [PATCH 0288/1641] Update README.md (#2264)

This pre-release comment is quite out of date, and roadmap information is no longer current.
---
 README.md | 25 -------------------------
 1 file changed, 25 deletions(-)

diff --git a/README.md b/README.md
index 558795d769ab5..e756a17d914c4 100644
--- a/README.md
+++ b/README.md
@@ -7,8 +7,6 @@
 
 Fabric React is a responsive, mobile-first collection of robust components designed to make it quick and simple for you to create web experiences using the Office Design Language.
 
-**This project is in a pre-release state**, so we encourage you to check out the [Roadmap](#roadmap) to see what we're working towards and what this means for your usage of the control library.
-
 ## Contents
 
 - [View the docs](#view-the-docs)
@@ -107,29 +105,6 @@ For testing see our [testing documentation](https://github.com/OfficeDev/office-
 
 For advanced usage including info about module vs. path-based imports, using an AMD bundler like Require, and deployment features, see our [advanced documentation](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/ADVANCED.md).
 
-
-## Roadmap
-
-The Fabric React project is currently in a **pre-v1 state** which means that we're working hard on achieving our v1 - a set of powerful and easy to use components built to the Office Design Language that are used *in production*. We will be actively working on this set as teams across Office and Office 365 contribute, evolve, and use these components in their own products.
-
-Given the early state of the project, all things are subject to change and some components may be more stable/usable than others. Use at your own risk!
-
-Our goal is to build out the components to be:
-- Well documented
-- Have clear contracts
-- Keyboard accessible
-- Screen reader friendly
-- RTL friendly
-- Support high contrast mode
-- Generally bug-free
-
-We hope to develop more concrete goals for the project's components in the future with a primary focus on explaining which components are used in production. Stay tuned to learn more.
-
-## Trello board
-
-Fabric React contains a variety of components that are a part of the Office / Office 365 design language. If you're not seeing a component here that you'd like, first check out the [Fabric React Requests Trello board](https://trello.com/b/hBP8XdvR/office-ui-fabric-react-requests) and upvote it there (if it exists), or file an [issue on Fabric React's issue tracker](https://github.com/OfficeDev/office-ui-fabric-react/issues) to kick off a new request.
-
-
 ## Browser support
 
 Fabric React supports many commonly used browsers. See the [browser support doc](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/BROWSERSUPPORT.md) for more information.

From 294b4174faf5455edc3526eba337b40a847fc10e Mon Sep 17 00:00:00 2001
From: Trevor Gau <trevorsg@gmail.com>
Date: Thu, 20 Jul 2017 16:35:21 -0400
Subject: [PATCH 0289/1641] Do not redundantly set aria-label on command bar
 items. #2266 (#2267)

---
 .../office-ui-fabric-react/2017-07-20-20-08.json      | 11 +++++++++++
 .../src/components/CommandBar/CommandBar.tsx          |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/2017-07-20-20-08.json

diff --git a/common/changes/office-ui-fabric-react/2017-07-20-20-08.json b/common/changes/office-ui-fabric-react/2017-07-20-20-08.json
new file mode 100644
index 0000000000000..819475657f4c3
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/2017-07-20-20-08.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Do not redundantly set aria-label on command bar items. ",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "trgau@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index f43ba89ab15d9..bccacc77a92d2 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -185,7 +185,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
             data-command-key={ index }
             aria-haspopup={ hasSubmenuItems(item) }
             role='menuitem'
-            aria-label={ item.ariaLabel || item.name }
+            aria-label={ item.ariaLabel }
           >
             { (hasIcon) ? this._renderIcon(item) : (null) }
             { (!!item.name) && (
@@ -208,7 +208,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
             data-command-key={ index }
             aria-haspopup={ hasSubmenuItems(item) }
             role='menuitem'
-            aria-label={ item.ariaLabel || item.name }
+            aria-label={ item.ariaLabel }
           >
             { (hasIcon) ? this._renderIcon(item) : (null) }
             { (!!item.name) && (

From 5ed43acad253c587e75fa009bff308bbcd561775 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Thu, 20 Jul 2017 13:50:45 -0700
Subject: [PATCH 0290/1641] Update Dropdown.Basic.Example.tsx

---
 .../components/Dropdown/examples/Dropdown.Basic.Example.tsx    | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
index 5fd6eb9a10c31..bb0867cd11960 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
-import { Dropdown } from 'office-ui-fabric-react/lib/Dropdown';
+import { Dropdown, DropdownMenuItemType } from 'office-ui-fabric-react/lib/Dropdown';
 import './Dropdown.Basic.Example.scss';
-import { DropdownMenuItemType } from './../Dropdown.Props';
 
 export class DropdownBasicExample extends React.Component<any, any> {
   constructor() {

From e23f7f865699374df1d8f5de0f553ee1559b3f8f Mon Sep 17 00:00:00 2001
From: Alex Bettadapur <alexbettadapur@gmail.com>
Date: Thu, 20 Jul 2017 14:18:36 -0700
Subject: [PATCH 0291/1641] Fix filteredAssign function so it does not throw
 with a null isAllowed parameter (#2269)

* save

* Add change file
---
 .../utilities/filteredAssignBug_2017-07-20-21-02.json | 11 +++++++++++
 packages/utilities/src/object.ts                      |  6 ++++--
 2 files changed, 15 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/filteredAssignBug_2017-07-20-21-02.json

diff --git a/common/changes/@uifabric/utilities/filteredAssignBug_2017-07-20-21-02.json b/common/changes/@uifabric/utilities/filteredAssignBug_2017-07-20-21-02.json
new file mode 100644
index 0000000000000..93ecab3b18ce5
--- /dev/null
+++ b/common/changes/@uifabric/utilities/filteredAssignBug_2017-07-20-21-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Fixing filteredAssign function",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "alebet@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/src/object.ts b/packages/utilities/src/object.ts
index dce39525a9b5e..a133c2c78bea3 100644
--- a/packages/utilities/src/object.ts
+++ b/packages/utilities/src/object.ts
@@ -62,8 +62,10 @@ export function filteredAssign(isAllowed: (propName: string) => boolean, target:
   for (let sourceObject of args) {
     if (sourceObject) {
       for (let propName in sourceObject) {
-        if (sourceObject.hasOwnProperty(propName) &&
-          !isAllowed || isAllowed(propName)) {
+        if (
+          sourceObject.hasOwnProperty(propName) &&
+          (!isAllowed || isAllowed(propName))
+        ) {
           target[propName] = sourceObject[propName];
         }
       }

From d5af8b6edae526651fcc1b2905a1119ef1408103 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 20 Jul 2017 17:10:49 -0700
Subject: [PATCH 0292/1641] More strictNullCheck fixes in
 office-ui-fabric-react (#2226)

* Fix runvisualtests

* Fix SelectionZone.

* Fix Selection.Basic.Example.ts

* Fixes

* FIx tslint error

* Fix withViewPort

* Fix selection.ts

* Fix dragdrophelper

* Add assertNever to utilities package

* Fix DateMath

* Fix color.ts

* Fix positioning tests

* Fix toggle and basepicker

* Fix textfield

* Fix swatch color picker

* Fix combo box

* Fix people picker examples

* Fixes in suggestions

* Picker

* Fix SuggestionItemDefault.

* Fix spinbutton

* Fix slider

* Fix Pivot.

* Fix persona

* Fix List.Scrolling.Example

* Fix marqueeSelection

* Fix List.tsx

* Rush change

* Add options to combo box test

* fix build

* Update assertNever.ts

* Fix nav and layer

* Fix image.test

* Fix Rating, TextFIeld, ExpandingCard

* Fix GroupedListSection and GroupHeader

* FocusZone, GroupedList fixes

* withViewPort, PeoplePicker fixes

* Fix dropdown

* Dropdown.test fixes

* Fix Modal.tsx

* More fixes

* Fix Dialog.tsx

* Fix facepile

* Fix detailsrow, details list

* Fix merge issue.

* Fix Details list

* rush change
---
 .../oufr-strict-null-2_2017-07-17-23-47.json  | 11 ++++
 .../oufr-strict-null-2_2017-07-17-23-47.json  | 11 ++++
 .../oufr-strict-null-2_2017-07-17-23-47.json  | 11 ++++
 .../oufr-strict-null-2_2017-07-17-23-47.json  | 11 ++++
 .../oufr-strict-null-2_2017-07-17-23-47.json  | 11 ++++
 .../components/DetailsList/DetailsList.tsx    | 43 +++++++--------
 .../src/components/DetailsList/DetailsRow.tsx | 35 ++++++------
 .../examples/DetailsList.Advanced.Example.tsx | 32 +++++------
 .../DetailsList.CustomColumns.Example.tsx     |  8 +--
 ...DetailsList.CustomGroupHeaders.Example.tsx | 12 ++---
 .../src/components/Dialog/Dialog.tsx          | 28 +++++-----
 .../src/components/Dropdown/Dropdown.test.tsx | 22 ++++----
 .../src/components/Dropdown/Dropdown.tsx      | 20 +++----
 .../src/components/Facepile/Facepile.tsx      | 12 ++---
 .../src/components/FocusZone/FocusZone.tsx    | 54 +++++++++----------
 .../components/GroupedList/GroupHeader.tsx    | 24 +++++----
 .../components/GroupedList/GroupedList.tsx    | 14 ++---
 .../GroupedList/GroupedListSection.tsx        | 16 +++---
 .../components/HoverCard/ExpandingCard.tsx    |  8 +--
 .../src/components/Image/Image.test.tsx       | 20 +++----
 .../src/components/Layer/Layer.tsx            | 12 ++---
 .../src/components/Modal/Modal.tsx            | 11 ++--
 .../src/components/Nav/Nav.Props.ts           |  4 +-
 .../src/components/Nav/Nav.tsx                | 16 +++---
 .../src/components/Rating/Rating.tsx          | 10 ++--
 .../src/components/Slider/Slider.test.tsx     | 10 ++--
 .../components/TextField/TextField.test.tsx   |  8 +--
 .../src/components/Toggle/Toggle.styles.ts    |  2 +-
 .../SelectedItemWithMenu.tsx                  |  2 +-
 .../src/utilities/decorators/withViewport.tsx |  6 +--
 30 files changed, 273 insertions(+), 211 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/oufr-strict-null-2_2017-07-17-23-47.json
 create mode 100644 common/changes/@uifabric/fabric-website/oufr-strict-null-2_2017-07-17-23-47.json
 create mode 100644 common/changes/@uifabric/styling/oufr-strict-null-2_2017-07-17-23-47.json
 create mode 100644 common/changes/@uifabric/utilities/oufr-strict-null-2_2017-07-17-23-47.json
 create mode 100644 common/changes/office-ui-fabric-react/oufr-strict-null-2_2017-07-17-23-47.json

diff --git a/common/changes/@uifabric/example-app-base/oufr-strict-null-2_2017-07-17-23-47.json b/common/changes/@uifabric/example-app-base/oufr-strict-null-2_2017-07-17-23-47.json
new file mode 100644
index 0000000000000..e807ce07d1d8c
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/oufr-strict-null-2_2017-07-17-23-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/oufr-strict-null-2_2017-07-17-23-47.json b/common/changes/@uifabric/fabric-website/oufr-strict-null-2_2017-07-17-23-47.json
new file mode 100644
index 0000000000000..cbeaf5c6e2864
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/oufr-strict-null-2_2017-07-17-23-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/oufr-strict-null-2_2017-07-17-23-47.json b/common/changes/@uifabric/styling/oufr-strict-null-2_2017-07-17-23-47.json
new file mode 100644
index 0000000000000..10861b0091cd0
--- /dev/null
+++ b/common/changes/@uifabric/styling/oufr-strict-null-2_2017-07-17-23-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/oufr-strict-null-2_2017-07-17-23-47.json b/common/changes/@uifabric/utilities/oufr-strict-null-2_2017-07-17-23-47.json
new file mode 100644
index 0000000000000..215b2a26b2777
--- /dev/null
+++ b/common/changes/@uifabric/utilities/oufr-strict-null-2_2017-07-17-23-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/oufr-strict-null-2_2017-07-17-23-47.json b/common/changes/office-ui-fabric-react/oufr-strict-null-2_2017-07-17-23-47.json
new file mode 100644
index 0000000000000..fe318ba1c3402
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/oufr-strict-null-2_2017-07-17-23-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "More strict null check fixes in office-ui-fabric-react",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index e0c7745b0530a..b4f8a3f9a237b 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -79,8 +79,8 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
 
   private _selection: ISelection;
   private _activeRows: { [key: string]: DetailsRow };
-  private _dragDropHelper: DragDropHelper;
-  private _initialFocusedIndex: number;
+  private _dragDropHelper: DragDropHelper | null;
+  private _initialFocusedIndex: number | undefined;
 
   private _columnOverrides: {
     [key: string]: IColumn;
@@ -113,7 +113,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       isSomeGroupExpanded: props.groupProps && !props.groupProps.isAllGroupsCollapsed
     };
 
-    this._selection = props.selection || new Selection({ onSelectionChanged: null, getKey: props.getKey });
+    this._selection = props.selection || new Selection({ onSelectionChanged: undefined, getKey: props.getKey });
     this._selection.setItems(props.items as IObjectWithKey[], false);
     this._dragDropHelper = props.dragDropEvents ? new DragDropHelper({
       selection: this._selection,
@@ -171,7 +171,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     if (
       newProps.checkboxVisibility !== checkboxVisibility ||
       newProps.columns !== columns ||
-      newProps.viewport.width !== viewport.width
+      newProps.viewport!.width !== viewport!.width
     ) {
       shouldForceUpdates = true;
     }
@@ -262,8 +262,8 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
         className={ css('ms-DetailsList', styles.root, className, {
           'is-fixed': layoutMode === DetailsListLayoutMode.fixedColumns,
           ['is-horizontalConstrained ' + styles.rootIsHorizontalConstrained]: constrainMode === ConstrainMode.horizontalConstrained,
-          'ms-DetailsList--Compact': compact,
-          [styles.rootCompact]: compact
+          'ms-DetailsList--Compact': !!compact,
+          [styles.rootCompact]: !!compact
         }) }
         data-automationid='DetailsList'
         data-is-scrollable='false'
@@ -277,10 +277,10 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
           <div onKeyDown={ this._onHeaderKeyDown } role='presentation'>
             { isHeaderVisible && onRenderDetailsHeader({
               componentRef: this._resolveRef('_header'),
-              selectionMode: selectionMode,
-              layoutMode: layoutMode,
+              selectionMode: selectionMode!,
+              layoutMode: layoutMode!,
               selection: selection,
-              columns: adjustedColumns,
+              columns: adjustedColumns as IColumn[],
               onColumnClick: onColumnHeaderClick,
               onColumnContextMenu: onColumnHeaderContextMenu,
               onColumnResized: this._onColumnResized,
@@ -322,7 +322,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
                     selection={ selection }
                     selectionMode={ selectionMode }
                     dragDropEvents={ dragDropEvents }
-                    dragDropHelper={ dragDropHelper }
+                    dragDropHelper={ dragDropHelper as DragDropHelper }
                     eventsToRegister={ rowElementEventMap }
                     listProps={ additionalListProps }
                     onGroupExpandStateChanged={ this._onGroupExpandStateChanged }
@@ -332,7 +332,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
                       ref={ this._resolveRef('_list') }
                       role='presentation'
                       items={ items }
-                      onRenderCell={ (item, itemIndex) => this._onRenderCell(0, item, itemIndex) }
+                      onRenderCell={ (item, itemIndex) => this._onRenderCell(0, item, itemIndex as number) }
                       { ...additionalListProps }
                     />
                   )
@@ -394,16 +394,16 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       item: item,
       itemIndex: index,
       compact: compact,
-      columns: columns,
+      columns: columns as IColumn[],
       groupNestingDepth: nestingDepth,
-      selectionMode: selectionMode,
+      selectionMode: selectionMode!,
       selection: selection,
       onDidMount: this._onRowDidMount,
       onWillUnmount: this._onRowWillUnmount,
       onRenderItemColumn: onRenderItemColumn,
       eventsToRegister: eventsToRegister,
       dragDropEvents: dragDropEvents,
-      dragDropHelper: dragDropHelper,
+      dragDropHelper: dragDropHelper!,
       viewport: viewport,
       checkboxVisibility: checkboxVisibility,
       collapseAllVisibility: collapseAllVisibility,
@@ -509,7 +509,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
 
   private _adjustColumns(newProps: IDetailsListProps, forceUpdate?: boolean, layoutMode?: DetailsListLayoutMode) {
     let adjustedColumns = this._getAdjustedColumns(newProps, forceUpdate, layoutMode);
-    let { viewport: { width: viewportWidth } } = this.props;
+    let { width: viewportWidth } = this.props.viewport!;
 
     if (adjustedColumns) {
       this.setState({
@@ -521,8 +521,9 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   }
 
   /** Returns adjusted columns, given the viewport size and layout mode. */
-  private _getAdjustedColumns(newProps: IDetailsListProps, forceUpdate?: boolean, layoutMode?: DetailsListLayoutMode): IColumn[] {
-    let { columns: newColumns, items: newItems, viewport: { width: viewportWidth }, selectionMode } = newProps;
+  private _getAdjustedColumns(newProps: IDetailsListProps, forceUpdate?: boolean, layoutMode?: DetailsListLayoutMode): IColumn[] | undefined {
+    let { columns: newColumns, items: newItems, selectionMode } = newProps;
+    let { width: viewportWidth } = newProps.viewport!;
 
     if (layoutMode === undefined) {
       layoutMode = newProps.layoutMode;
@@ -537,10 +538,10 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
         lastWidth === viewportWidth &&
         lastSelectionMode === selectionMode &&
         (!columns || newColumns === columns)) {
-        return;
+        return undefined;
       }
     } else {
-      viewportWidth = this.props.viewport.width;
+      viewportWidth = this.props.viewport!.width;
     }
 
     newColumns = newColumns || buildColumns(newItems, true);
@@ -607,7 +608,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       let column = adjustedColumns[lastIndex];
 
       if (column.isCollapsable) {
-        totalWidth -= column.calculatedWidth + DEFAULT_INNER_PADDING;
+        totalWidth -= column.calculatedWidth! + DEFAULT_INNER_PADDING;
         adjustedColumns.splice(lastIndex, 1);
       }
       lastIndex--;
@@ -626,7 +627,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
         increment = spaceLeft;
       }
 
-      column.calculatedWidth += increment;
+      column.calculatedWidth = (column.calculatedWidth as number) + increment;
       totalWidth += increment;
     }
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index d459fabf28998..7574b967fa612 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -75,7 +75,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
     cellMeasurer: HTMLElement
   };
 
-  private _root: HTMLElement;
+  private _root: HTMLElement | undefined;
   private _focusZone: IFocusZone;
   private _hasSetFocus: boolean;
   private _droppingClassNames: string;
@@ -87,7 +87,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
 
     this.state = {
       selectionState: this._getSelectionState(props),
-      columnMeasureInfo: null,
+      columnMeasureInfo: undefined,
       isDropping: false,
       groupNestingDepth: props.groupNestingDepth
     };
@@ -104,7 +104,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
     let { dragDropHelper } = this.props;
 
     if (dragDropHelper) {
-      this._dragDropSubscription = dragDropHelper.subscribe(this._root, this._events, this._getRowDragDropOptions());
+      this._dragDropSubscription = dragDropHelper.subscribe(this._root as HTMLElement, this._events, this._getRowDragDropOptions());
     }
 
     this._events.on(this.props.selection, SELECTION_CHANGE, this._onSelectionChanged);
@@ -130,7 +130,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
       }
 
       if (this.props.dragDropHelper) {
-        this._dragDropSubscription = this.props.dragDropHelper.subscribe(this._root, this._events, this._getRowDragDropOptions());
+        this._dragDropSubscription = this.props.dragDropHelper.subscribe(this._root as HTMLElement, this._events, this._getRowDragDropOptions());
       }
     }
 
@@ -140,7 +140,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
       columnMeasureInfo.onMeasureDone(newWidth);
 
       this.setState({
-        columnMeasureInfo: null
+        columnMeasureInfo: undefined
       });
     }
 
@@ -186,11 +186,12 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
       checkButtonAriaLabel,
       selection
     } = this.props;
-    const { selectionState: { isSelected, anySelected }, columnMeasureInfo, isDropping, groupNestingDepth } = this.state;
+    const { columnMeasureInfo, isDropping, groupNestingDepth } = this.state;
+    const { isSelected, anySelected } = this.state.selectionState as IDetailsRowSelectionState;
     const isDraggable = Boolean(dragDropEvents && dragDropEvents.canDrag && dragDropEvents.canDrag(item));
     const droppingClassName = isDropping ? (this._droppingClassNames ? this._droppingClassNames : DEFAULT_DROPPING_CSS_CLASS) : '';
     const ariaLabel = getRowAriaLabel ? getRowAriaLabel(item) : null;
-    const canSelect = selection.canSelectItem(item);
+    const canSelect = selection.canSelectItem!(item);
     const isContentUnselectable = selectionMode === SelectionMode.multiple;
     const showCheckbox = selectionMode !== SelectionMode.none && checkboxVisibility !== CheckboxVisibility.hidden;
 
@@ -239,7 +240,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
           </div>
         ) }
 
-        { GroupSpacer({ count: groupNestingDepth - (this.props.collapseAllVisibility === CollapseAllVisibility.hidden ? 1 : 0) }) }
+        { GroupSpacer({ count: groupNestingDepth! - (this.props.collapseAllVisibility === CollapseAllVisibility.hidden ? 1 : 0) }) }
 
         { item && (
           <DetailsRowFields
@@ -345,12 +346,12 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
       eventMap: eventsToRegister,
       selectionIndex: itemIndex,
       context: { data: item, index: itemIndex },
-      canDrag: dragDropEvents.canDrag,
-      canDrop: dragDropEvents.canDrop,
-      onDragStart: dragDropEvents.onDragStart,
+      canDrag: dragDropEvents!.canDrag,
+      canDrop: dragDropEvents!.canDrop,
+      onDragStart: dragDropEvents!.onDragStart,
       updateDropState: this._updateDroppingState,
-      onDrop: dragDropEvents.onDrop,
-      onDragEnd: dragDropEvents.onDragEnd,
+      onDrop: dragDropEvents!.onDrop,
+      onDragEnd: dragDropEvents!.onDragEnd,
     };
 
     return options;
@@ -373,12 +374,12 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
     let { dragDropEvents, item } = this.props;
 
     if (!newValue) {
-      if (dragDropEvents.onDragLeave) {
-        dragDropEvents.onDragLeave(item, event);
+      if (dragDropEvents!.onDragLeave) {
+        dragDropEvents!.onDragLeave!(item, event);
       }
     } else {
-      if (dragDropEvents.onDragEnter) {
-        this._droppingClassNames = dragDropEvents.onDragEnter(item, event);
+      if (dragDropEvents!.onDragEnter) {
+        this._droppingClassNames = dragDropEvents!.onDragEnter!(item, event);
       }
     }
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
index c572ae56dfb34..0c3a00cd2ed0e 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
@@ -69,7 +69,7 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
 
     this.state = {
       items: _items,
-      groups: null,
+      groups: undefined,
       groupItemLimit: DEFAULT_ITEM_LIMIT,
       layoutMode: LayoutMode.justified,
       constrainMode: ConstrainMode.horizontalConstrained,
@@ -77,7 +77,7 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
       canResizeColumns: true,
       checkboxVisibility: CheckboxVisibility.onHover,
       columns: this._buildColumns(_items, true, this._onColumnClick, '', undefined, undefined, this._onColumnContextMenu),
-      contextualMenuProps: null,
+      contextualMenuProps: undefined,
       sortedColumnKey: 'name',
       isSortedDescending: false,
       isLazyLoaded: false,
@@ -103,9 +103,9 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
     let groupProps = {
       getGroupItemLimit: (group: IGroup) => {
         if (group) {
-          return group.isShowingAll ? group.count : Math.min(group.count, groupItemLimit);
+          return group.isShowingAll ? group.count : Math.min(group.count, groupItemLimit as number);
         } else {
-          return items.length;
+          return items!.length;
         }
       },
       footerProps: {
@@ -126,7 +126,7 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
         <DetailsList
           ref='list'
           setKey='items'
-          items={ items }
+          items={ items as any[] }
           groups={ groups }
           columns={ columns }
           checkboxVisibility={ checkboxVisibility }
@@ -141,7 +141,7 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
           ariaLabelForSelectAllCheckbox='Toggle selection for all items'
           ariaLabelForSelectionColumn='Toggle selection'
           onRenderMissingItem={ (index) => {
-            this._onDataMiss(index);
+            this._onDataMiss(index as number);
             return null;
           } }
         />
@@ -162,7 +162,7 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
 
       setTimeout(() => {
         this._isFetchingItems = false;
-        let itemsCopy = [].concat(this.state.items);
+        let itemsCopy = ([] as any[]).concat(this.state.items);
 
         itemsCopy.splice.apply(itemsCopy, [index, PAGING_SIZE].concat(_items.slice(index, index + PAGING_SIZE)));
 
@@ -193,7 +193,7 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
 
     this.setState({
       canResizeColumns: canResizeColumns,
-      columns: this._buildColumns(items, canResizeColumns, this._onColumnClick, sortedColumnKey, isSortedDescending)
+      columns: this._buildColumns(items as any[], canResizeColumns, this._onColumnClick, sortedColumnKey, isSortedDescending)
     });
   }
 
@@ -470,7 +470,7 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
   @autobind
   private _onContextualMenuDismissed() {
     this.setState({
-      contextualMenuProps: null
+      contextualMenuProps: undefined
     });
   }
 
@@ -480,7 +480,7 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
 
     this.setState({
       items: sortedItems,
-      groups: null,
+      groups: undefined,
       columns: this._buildColumns(
         sortedItems,
         true,
@@ -500,19 +500,19 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
     let { sortedColumnKey, isSortedDescending, groups, items, columns } = this.state;
 
     if (isGrouped) { // ungroup
-      this._onSortColumn(sortedColumnKey, isSortedDescending);
+      this._onSortColumn(sortedColumnKey as string, !!isSortedDescending);
     } else {
       let groupedItems = [];
       let newGroups = null;
       if (groups) {
         newGroups = groups.concat([]);
-        groupedItems = this._groupByKey(newGroups, items, key);
+        groupedItems = this._groupByKey(newGroups, items as any[], key);
       } else {
-        groupedItems = this._groupItems(items, key);
+        groupedItems = this._groupItems(items as any[], key);
         newGroups = this._getGroups(groupedItems, key);
       }
 
-      let newColumns = columns;
+      let newColumns = columns as IColumn[];
       newColumns.filter(matchColumn => matchColumn.key === key).forEach((groupedColumn: IColumn) => {
         groupedColumn.isGrouped = true;
       });
@@ -557,7 +557,7 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
           name: key + ': ' + item[key],
           startIndex: parentGroup ? parentGroup.startIndex + index : index,
           count: 1,
-          level: parentGroup ? parentGroup.level + 1 : 0
+          level: parentGroup ? parentGroup.level! + 1 : 0
         });
       } else {
         currentGroup.count++;
@@ -587,7 +587,7 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
   @autobind
   private _onDeleteRow() {
     this.setState({
-      items: this.state.items.slice(1)
+      items: this.state.items!.slice(1)
     });
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
index 5b19a669cc067..ec21a419e209e 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
@@ -36,13 +36,13 @@ export class DetailsListCustomColumnsExample extends React.Component<{}, IDetail
 
     return (
       <DetailsList
-        items={ sortedItems }
+        items={ sortedItems as any[] }
         setKey='set'
         columns={ columns }
         onRenderItemColumn={ _renderItemColumn }
         onColumnHeaderClick={ this._onColumnClick.bind(this) }
         onItemInvoked={ (item, index) => alert(`Item ${item.name} at index ${index} has been invoked.`) }
-        onColumnHeaderContextMenu={ (column, ev) => console.log(`column ${column.key} contextmenu opened.`) } />
+        onColumnHeaderContextMenu={ (column, ev) => console.log(`column ${column!.key} contextmenu opened.`) } />
     );
   }
 
@@ -56,7 +56,7 @@ export class DetailsListCustomColumnsExample extends React.Component<{}, IDetail
     }
 
     // Sort the items.
-    sortedItems = sortedItems.concat([]).sort((a, b) => {
+    sortedItems = sortedItems!.concat([]).sort((a, b) => {
       let firstValue = a[column.fieldName];
       let secondValue = b[column.fieldName];
 
@@ -70,7 +70,7 @@ export class DetailsListCustomColumnsExample extends React.Component<{}, IDetail
     // Reset the items and columns to match the state.
     this.setState({
       sortedItems: sortedItems,
-      columns: columns.map(col => {
+      columns: columns!.map(col => {
         col.isSorted = (col.key === column.key);
 
         if (col.isSorted) {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomGroupHeaders.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomGroupHeaders.Example.tsx
index 2c0813c4dc925..d60077bdfdd1f 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomGroupHeaders.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomGroupHeaders.Example.tsx
@@ -29,24 +29,24 @@ export class DetailsListCustomGroupHeadersExample extends React.Component<any, a
           groupProps={ {
             onRenderHeader: props => (
               <div className='DetailsListExample-customHeader'>
-                <div className='DetailsListExample-customHeaderTitle'>{ `I am a custom header for: ${props.group.name}` }</div>
+                <div className='DetailsListExample-customHeaderTitle'>{ `I am a custom header for: ${props!.group!.name}` }</div>
                 <div className='DetailsListExample-customHeaderLinkSet'>
                   <Link
                     className='DetailsListExample-customHeaderLink'
-                    onClick={ () => props.onToggleSelectGroup(props.group) }>
-                    { props.isSelected ? 'Remove selection' : 'Select group' }
+                    onClick={ () => props!.onToggleSelectGroup!(props!.group!) }>
+                    { props!.isSelected ? 'Remove selection' : 'Select group' }
                   </Link>
                   <Link
                     className='DetailsListExample-customHeaderLink'
-                    onClick={ () => props.onToggleCollapse(props.group) }>
-                    { props.group.isCollapsed ? 'Expand group' : 'Collapse group' }
+                    onClick={ () => props!.onToggleCollapse!(props!.group!) }>
+                    { props!.group!.isCollapsed ? 'Expand group' : 'Collapse group' }
                   </Link>
                 </div>
               </div>
             ),
             onRenderFooter: props => (
               <div className='DetailsListExample-customHeader'>
-                <div className='DetailsListExample-customHeaderTitle'>{ `I'm a custom footer for: ${props.group.name}` }</div>
+                <div className='DetailsListExample-customHeaderTitle'>{ `I'm a custom footer for: ${props!.group!.name}` }</div>
               </div>
             )
           } }
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
index ad2eb980d97c7..942d3eabc6c30 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
@@ -101,33 +101,33 @@ export class Dialog extends BaseComponent<IDialogProps, IDialogState> {
         onLayerDidMount={ onLayerDidMount }
         responsiveMode={ responsiveMode }
         { ...modalProps }
-        isDarkOverlay={ isDarkOverlay !== undefined ? isDarkOverlay : modalProps.isDarkOverlay }
-        isBlocking={ isBlocking !== undefined ? isBlocking : modalProps.isBlocking }
+        isDarkOverlay={ isDarkOverlay !== undefined ? isDarkOverlay : modalProps!.isDarkOverlay }
+        isBlocking={ isBlocking !== undefined ? isBlocking : modalProps!.isBlocking }
         isOpen={ isOpen !== undefined ? isOpen : !hidden }
-        className={ css('ms-Dialog', className ? className : modalProps.className) }
-        containerClassName={ css(styles.main, containerClassName ? containerClassName : modalProps.containerClassName) }
-        onDismiss={ onDismiss ? onDismiss : modalProps.onDismiss }
+        className={ css('ms-Dialog', className ? className : modalProps!.className) }
+        containerClassName={ css(styles.main, containerClassName ? containerClassName : modalProps!.containerClassName) }
+        onDismiss={ onDismiss ? onDismiss : modalProps!.onDismiss }
         subtitleAriaId={
           this._getAriaLabelId(
-            ariaDescribedById ? ariaDescribedById : modalProps.subtitleAriaId,
-            subText ? subText : modalProps.subtitleAriaId,
+            (ariaDescribedById ? ariaDescribedById : modalProps!.subtitleAriaId) as string,
+            (subText ? subText : modalProps!.subtitleAriaId) as string,
             id + '-subText'
           )
         }
         titleAriaId={
           this._getAriaLabelId(
-            modalProps.titleAriaId ? modalProps.titleAriaId : ariaLabelledById,
-            title ? title : modalProps.titleAriaId,
+            (modalProps!.titleAriaId ? modalProps!.titleAriaId : ariaLabelledById) as string,
+            (title ? title : modalProps!.titleAriaId) as string,
             id + '-title') }
       >
         <DialogContent
           title={ title }
           subText={ subText }
-          showCloseButton={ isBlocking !== undefined ? !isBlocking : !modalProps.isBlocking }
-          topButtonsProps={ topButtonsProps ? topButtonsProps : dialogContentProps.topButtonsProps }
-          type={ type !== undefined ? type : dialogContentProps.type }
-          onDismiss={ onDismiss ? onDismiss : dialogContentProps.onDismiss }
-          className={ css(contentClassName ? contentClassName : dialogContentProps.className) }
+          showCloseButton={ isBlocking !== undefined ? !isBlocking : !modalProps!.isBlocking }
+          topButtonsProps={ topButtonsProps ? topButtonsProps : dialogContentProps!.topButtonsProps }
+          type={ type !== undefined ? type : dialogContentProps!.type }
+          onDismiss={ onDismiss ? onDismiss : dialogContentProps!.onDismiss }
+          className={ css(contentClassName ? contentClassName : dialogContentProps!.className) }
           { ...dialogContentProps }
         >
           { this.props.children }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
index 1e454c719dd8d..f735e8bd97393 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
@@ -62,7 +62,7 @@ describe('Dropdown', () => {
       />,
       container);
     let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title');
+    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
     expect(titleElement.textContent).equals('');
   });
@@ -78,7 +78,7 @@ describe('Dropdown', () => {
       />,
       container);
     let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title');
+    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
     expect(titleElement.textContent).equals('1');
   });
@@ -94,14 +94,14 @@ describe('Dropdown', () => {
       />,
       container);
     let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title');
+    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
     expect(titleElement.textContent).equals('1');
   });
 
   it('Can change items in uncontrolled case', () => {
     let container = document.createElement('div');
-    let dropdownRoot;
+    let dropdownRoot: HTMLElement | undefined;
 
     document.body.appendChild(container);
 
@@ -117,11 +117,11 @@ describe('Dropdown', () => {
 
       ReactTestUtils.Simulate.click(dropdownRoot);
 
-      let secondItemElement = document.querySelector('.ms-Dropdown-item[data-index="2"]');
+      let secondItemElement = document.querySelector('.ms-Dropdown-item[data-index="2"]') as HTMLElement;
       ReactTestUtils.Simulate.click(secondItemElement);
     }
     finally {
-      expect(dropdownRoot.querySelector('.ms-Dropdown-title').textContent).equals('2');
+      expect(dropdownRoot!.querySelector('.ms-Dropdown-title')!.textContent).equals('2');
     }
   });
 
@@ -137,7 +137,7 @@ describe('Dropdown', () => {
     let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
     ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
 
-    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title');
+    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
     expect(titleElement.textContent).equals('1');
   });
 
@@ -153,7 +153,7 @@ describe('Dropdown', () => {
     let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
     ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.home });
 
-    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title');
+    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
     expect(titleElement.textContent).equals('1');
   });
 
@@ -169,7 +169,7 @@ describe('Dropdown', () => {
     let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
     ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.end });
 
-    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title');
+    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
     expect(titleElement.textContent).equals('6');
   });
 
@@ -188,13 +188,13 @@ describe('Dropdown', () => {
     dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
 
     ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
-    titleElement = dropdownRoot.querySelector('.ms-Dropdown-title');
+    titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
     expect(titleElement.textContent).equals('1');
 
     ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
     ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
     ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
-    titleElement = dropdownRoot.querySelector('.ms-Dropdown-title');
+    titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
     expect(titleElement.textContent).equals('4');
   });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 5958302bc51cb..cac5de0df9210 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -53,7 +53,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   private _dropdownLabel: HTMLElement;
   private _id: string;
 
-  constructor(props?: IDropdownProps) {
+  constructor(props: IDropdownProps) {
     props.options.forEach((option: any) => {
       if (!option.itemType) {
         option.itemType = DropdownMenuItemType.Normal;
@@ -75,7 +75,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
 
     this.state = {
       isOpen: false,
-      selectedIndex: this._getSelectedIndex(props.options, selectedKey)
+      selectedIndex: this._getSelectedIndex(props.options, selectedKey!)
     };
   }
 
@@ -113,7 +113,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
       onRenderPlaceHolder = this._onRenderPlaceHolder
     } = this.props;
     let { isOpen, selectedIndex } = this.state;
-    let selectedOption = options[selectedIndex];
+    let selectedOption = options[selectedIndex as number];
     let divProps = getNativeProps(this.props, divProperties);
 
     // Remove this deprecation workaround at 1.0.0
@@ -136,7 +136,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
           aria-live={ disabled || isOpen ? 'off' : 'assertive' }
           aria-label={ ariaLabel || label }
           aria-describedby={ id + '-option' }
-          aria-activedescendant={ isOpen && selectedIndex >= 0 ? (this._id + '-list' + selectedIndex) : null }
+          aria-activedescendant={ isOpen && selectedIndex! >= 0 ? (this._id + '-list' + selectedIndex) : null }
           aria-disabled={ disabled }
           aria-owns={ isOpen ? id + '-list' : null }
           { ...divProps }
@@ -260,7 +260,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
 
   // Render placeHolder text in dropdown input
   @autobind
-  private _onRenderPlaceHolder(props: IDropdownProps): JSX.Element {
+  private _onRenderPlaceHolder(props: IDropdownProps): JSX.Element | null {
     if (!props.placeHolder) {
       return null;
     }
@@ -276,7 +276,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
       calloutProps
     } = this.props;
 
-    let isSmall = responsiveMode <= ResponsiveMode.medium;
+    let isSmall = responsiveMode! <= ResponsiveMode.medium;
 
     return (
       isSmall ?
@@ -336,7 +336,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
 
   // Render items
   @autobind
-  private _onRenderItem(item: IDropdownOption): JSX.Element {
+  private _onRenderItem(item: IDropdownOption): JSX.Element | null {
     switch (item.itemType) {
       case SelectableOptionMenuItemType.Divider:
         return this._renderSeparator(item);
@@ -348,9 +348,9 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   // Render separator
-  private _renderSeparator(item: IDropdownOption): JSX.Element {
+  private _renderSeparator(item: IDropdownOption): JSX.Element | null {
     let { index, key } = item;
-    if (index > 0) {
+    if (index! > 0) {
       return <div
         role='separator'
         key={ key }
@@ -387,7 +387,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
             ['is-disabled ' + styles.itemIsDisabled]: this.props.disabled === true
           }
         ) }
-        onClick={ () => this._onItemClick(item.index) }
+        onClick={ () => this._onItemClick(item.index!) }
         role='option'
         aria-selected={ this.state.selectedIndex === item.index ? 'true' : 'false' }
         ariaLabel={ item.ariaLabel || item.text }
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
index e1fc34ba31920..5a0e031fbcddf 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
@@ -55,7 +55,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
       personas,
       showAddButton
     } = this.props;
-    let numPersonasToShow: number = Math.min(personas.length, maxDisplayablePersonas);
+    let numPersonasToShow: number = Math.min(personas.length, maxDisplayablePersonas as number);
 
     // Added for deprecating chevronButtonProps.  Can remove after v1.0
     if (chevronButtonProps && !overflowButtonProps) {
@@ -145,7 +145,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
     </div>;
   }
 
-  private _getOverflowElement(numPersonasToShow: number): JSX.Element {
+  private _getOverflowElement(numPersonasToShow: number): JSX.Element | null {
     switch (this.props.overflowButtonType) {
       case OverflowButtonType.descriptive:
         return this._getDescriptiveOverflowElement(numPersonasToShow);
@@ -158,7 +158,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
     }
   }
 
-  private _getDescriptiveOverflowElement(numPersonasToShow: number): JSX.Element {
+  private _getDescriptiveOverflowElement(numPersonasToShow: number): JSX.Element | null {
     let { overflowButtonProps, personas, personaSize } = this.props;
     let numPersonasNotPictured: number = personas.length - numPersonasToShow;
 
@@ -218,9 +218,9 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
   }
 
   private _onPersonaClick(persona: IFacepilePersona, ev?: React.MouseEvent<HTMLElement>): void {
-    persona.onClick(ev, persona);
-    ev.preventDefault();
-    ev.stopPropagation();
+    persona.onClick!(ev, persona);
+    ev!.preventDefault();
+    ev!.stopPropagation();
   }
 
   private _onPersonaMouseMove(persona: IFacepilePersona, ev?: React.MouseEvent<HTMLElement>): void {
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 1bbb6c01c7b8f..b9098e1fd08de 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -52,14 +52,14 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   };
 
   private _id: string;
-  private _activeElement: HTMLElement;
+  private _activeElement: HTMLElement | null;
   private _focusAlignment: IPoint;
   private _isInnerZone: boolean;
 
   constructor(props: IFocusZoneProps) {
     super(props);
 
-    this._warnDeprecations({ rootProps: null });
+    this._warnDeprecations({ rootProps: undefined });
 
     this._id = getId('FocusZone');
     _allInstances[this._id] = this;
@@ -95,7 +95,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     this._updateTabIndexes();
 
     if (this.props.defaultActiveElement) {
-      this._activeElement = getDocument().querySelector(this.props.defaultActiveElement) as HTMLElement;
+      this._activeElement = getDocument()!.querySelector(this.props.defaultActiveElement) as HTMLElement;
       this.focus();
     }
   }
@@ -136,7 +136,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       const ownerZoneElement = this._getOwnerZone(this.refs.root);
 
       if (ownerZoneElement !== this.refs.root) {
-        const ownerZone = _allInstances[ownerZoneElement.getAttribute(FOCUSZONE_ID_ATTRIBUTE)];
+        const ownerZone = _allInstances[ownerZoneElement.getAttribute(FOCUSZONE_ID_ATTRIBUTE) as string];
 
         return !!ownerZone && ownerZone.focusElement(this.refs.root);
       }
@@ -149,7 +149,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     } else {
       const firstChild = this.refs.root.firstChild as HTMLElement;
 
-      return this.focusElement(getNextElement(this.refs.root, firstChild, true));
+      return this.focusElement(getNextElement(this.refs.root, firstChild, true) as HTMLElement);
     }
   }
 
@@ -210,11 +210,11 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
           this._activeElement = parentElement;
           break;
         }
-        parentElement = getParent(parentElement);
+        parentElement = getParent(parentElement) as HTMLElement;
       }
     }
     if (onActiveElementChanged) {
-      onActiveElementChanged(this._activeElement, ev);
+      onActiveElementChanged(this._activeElement as HTMLElement, ev);
     }
   }
 
@@ -240,11 +240,11 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
     while (target && target !== this.refs.root) {
       path.push(target);
-      target = getParent(target);
+      target = getParent(target) as HTMLElement;
     }
 
     while (path.length) {
-      target = path.pop();
+      target = path.pop() as HTMLElement;
 
       if (target && isElementTabbable(target)) {
         target.tabIndex = 0;
@@ -296,7 +296,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
           return;
         }
       } else if (isElementFocusSubZone(ev.target as HTMLElement)) {
-        if (!this.focusElement(getNextElement(ev.target as HTMLElement, (ev.target as HTMLElement).firstChild as HTMLElement, true))) {
+        if (!this.focusElement(getNextElement(ev.target as HTMLElement, (ev.target as HTMLElement).firstChild as HTMLElement, true) as HTMLElement)) {
           return;
         }
       } else {
@@ -338,14 +338,14 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
         case KeyCodes.home:
           const firstChild = this.refs.root.firstChild as HTMLElement;
-          if (this.focusElement(getNextElement(this.refs.root, firstChild, true))) {
+          if (this.focusElement(getNextElement(this.refs.root, firstChild, true) as HTMLElement)) {
             break;
           }
           return;
 
         case KeyCodes.end:
           const lastChild = this.refs.root.lastChild as HTMLElement;
-          if (this.focusElement(getPreviousElement(this.refs.root, lastChild, true, true, true))) {
+          if (this.focusElement(getPreviousElement(this.refs.root, lastChild, true, true, true) as HTMLElement)) {
             break;
           }
           return;
@@ -387,7 +387,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
         return true;
       }
 
-      target = getParent(target);
+      target = getParent(target) as HTMLElement;
     } while (target !== this.refs.root);
 
     return false;
@@ -396,18 +396,18 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   /**
    * Traverse to find first child zone.
    */
-  private _getFirstInnerZone(rootElement?: HTMLElement): FocusZone {
+  private _getFirstInnerZone(rootElement?: HTMLElement): FocusZone | null {
     rootElement = rootElement || this._activeElement || this.refs.root;
 
     if (isElementFocusZone(rootElement)) {
-      return _allInstances[rootElement.getAttribute(FOCUSZONE_ID_ATTRIBUTE)];
+      return _allInstances[rootElement.getAttribute(FOCUSZONE_ID_ATTRIBUTE) as string];
     }
 
     let child: HTMLElement = rootElement.firstElementChild as HTMLElement;
 
     while (child) {
       if (isElementFocusZone(child)) {
-        return _allInstances[child.getAttribute(FOCUSZONE_ID_ATTRIBUTE)];
+        return _allInstances[child.getAttribute(FOCUSZONE_ID_ATTRIBUTE) as string];
       }
       let match = this._getFirstInnerZone(child);
 
@@ -428,7 +428,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
     let element = this._activeElement;
     let candidateDistance = -1;
-    let candidateElement: HTMLElement;
+    let candidateElement: HTMLElement | undefined = undefined;
     let changedFocus = false;
     let isBidirectional = this.props.direction === FocusZoneDirection.bidirectional;
 
@@ -445,14 +445,14 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     const activeRect = isBidirectional ? element.getBoundingClientRect() : null;
 
     do {
-      element = isForward ?
+      element = (isForward ?
         getNextElement(this.refs.root, element) :
-        getPreviousElement(this.refs.root, element);
+        getPreviousElement(this.refs.root, element)) as HTMLElement;
 
       if (isBidirectional) {
         if (element) {
           const targetRect = element.getBoundingClientRect();
-          const elementDistance = getDistanceFromCenter(activeRect, targetRect);
+          const elementDistance = getDistanceFromCenter(activeRect as ClientRect, targetRect);
 
           if (elementDistance === -1 && candidateDistance === -1) {
             candidateElement = element;
@@ -481,9 +481,9 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       this.focusElement(candidateElement);
     } else if (this.props.isCircularNavigation) {
       if (isForward) {
-        return this.focusElement(getNextElement(this.refs.root, this.refs.root.firstElementChild as HTMLElement, true));
+        return this.focusElement(getNextElement(this.refs.root, this.refs.root.firstElementChild as HTMLElement, true) as HTMLElement);
       } else {
-        return this.focusElement(getPreviousElement(this.refs.root, this.refs.root.lastElementChild as HTMLElement, true, true, true));
+        return this.focusElement(getPreviousElement(this.refs.root, this.refs.root.lastElementChild as HTMLElement, true, true, true) as HTMLElement);
       }
     }
 
@@ -519,7 +519,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
       return distance;
     })) {
-      this._setFocusAlignment(this._activeElement, false, true);
+      this._setFocusAlignment(this._activeElement as HTMLElement, false, true);
       return true;
     }
 
@@ -556,7 +556,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
       return distance;
     })) {
-      this._setFocusAlignment(this._activeElement, false, true);
+      this._setFocusAlignment(this._activeElement as HTMLElement, false, true);
       return true;
     }
 
@@ -580,7 +580,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
       return distance;
     })) {
-      this._setFocusAlignment(this._activeElement, true, false);
+      this._setFocusAlignment(this._activeElement as HTMLElement, true, false);
       return true;
     }
 
@@ -604,7 +604,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
       return distance;
     })) {
-      this._setFocusAlignment(this._activeElement, true, false);
+      this._setFocusAlignment(this._activeElement as HTMLElement, true, false);
       return true;
     }
 
@@ -638,7 +638,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   }
 
   private _getOwnerZone(element?: HTMLElement): HTMLElement {
-    let parentElement = getParent(element);
+    let parentElement = getParent(element as HTMLElement);
 
     while (parentElement && parentElement !== this.refs.root && parentElement !== document.body) {
       if (isElementFocusZone(parentElement)) {
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
index 4d73d9e1af0ac..ee737ad3d8b8c 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
@@ -24,7 +24,7 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
     super(props);
 
     this.state = {
-      isCollapsed: this.props.group && this.props.group.isCollapsed,
+      isCollapsed: (this.props.group && this.props.group.isCollapsed) as boolean,
       isLoadingVisible: false
     };
   }
@@ -42,7 +42,7 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
     }
   }
 
-  public render() {
+  public render(): JSX.Element | null {
     let {
       group,
       groupLevel,
@@ -61,7 +61,11 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
     let canSelectGroup = selectionMode === SelectionMode.multiple;
     let isSelectionCheckVisible = canSelectGroup && (isCollapsedGroupSelectVisible || !(group && group.isCollapsed));
     let currentlySelected = isSelected || selected;
-    return group && (
+
+    if (!group) {
+      return null;
+    }
+    return (
       <div
         className={ css('ms-GroupHeader', styles.root, {
           ['is-selected ' + styles.rootIsSelected]: currentlySelected
@@ -84,7 +88,7 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
           ) : (selectionMode !== SelectionMode.none ? GroupSpacer({ count: 1 }) : null)
           }
 
-          { GroupSpacer({ count: groupLevel }) }
+          { GroupSpacer({ count: groupLevel as number }) }
 
           <div className={ css('ms-GroupHeader-dropIcon', styles.dropIcon) }>
             <Icon iconName='Tag' />
@@ -133,14 +137,14 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
     let { isCollapsed } = this.state;
 
     let newCollapsed = !isCollapsed;
-    let newLoadingVisible = !newCollapsed && isGroupLoading && isGroupLoading(group);
+    let newLoadingVisible = !newCollapsed && isGroupLoading && isGroupLoading(group!);
 
     this.setState({
       isCollapsed: newCollapsed,
-      isLoadingVisible: newLoadingVisible
+      isLoadingVisible: newLoadingVisible as boolean
     });
     if (onToggleCollapse) {
-      onToggleCollapse(group);
+      onToggleCollapse(group!);
     }
 
     ev.stopPropagation();
@@ -152,7 +156,7 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
     let { onToggleSelectGroup, group } = this.props;
 
     if (onToggleSelectGroup) {
-      onToggleSelectGroup(group);
+      onToggleSelectGroup(group!);
     }
 
     ev.preventDefault();
@@ -164,9 +168,9 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
     let { group, onGroupHeaderClick, onToggleSelectGroup } = this.props;
 
     if (onGroupHeaderClick) {
-      onGroupHeaderClick(group);
+      onGroupHeaderClick(group!);
     } else if (onToggleSelectGroup) {
-      onToggleSelectGroup(group);
+      onToggleSelectGroup(group!);
     }
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
index 1a2e191164fdb..f04705dd73e8b 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
@@ -152,8 +152,8 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
       onToggleSummarize: this._onToggleSummarize
     };
 
-    let headerProps = assign({}, groupProps.headerProps, dividerProps);
-    let footerProps = assign({}, groupProps.footerProps, dividerProps);
+    let headerProps = assign({}, groupProps!.headerProps, dividerProps);
+    let footerProps = assign({}, groupProps!.footerProps, dividerProps);
     let groupNestingDepth = this._getGroupNestingDepth();
 
     return (!group || group.count > 0) ? (
@@ -172,8 +172,8 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
         listProps={ listProps }
         items={ items }
         onRenderCell={ onRenderCell }
-        onRenderGroupHeader={ groupProps.onRenderHeader }
-        onRenderGroupFooter={ groupProps.onRenderFooter }
+        onRenderGroupHeader={ groupProps!.onRenderHeader }
+        onRenderGroupFooter={ groupProps!.onRenderFooter }
         selectionMode={ selectionMode }
         selection={ selection }
         viewport={ viewport }
@@ -217,7 +217,7 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
   @autobind
   private _onToggleSelectGroup(group: IGroup) {
     if (group) {
-      this.props.selection.toggleRangeSelected(group.startIndex, group.count);
+      this.props.selection!.toggleRangeSelected(group.startIndex, group.count);
     }
   }
 
@@ -259,8 +259,8 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
     }
   }
 
-  private _computeIsSomeGroupExpanded(groups: IGroup[]): boolean {
-    return groups && groups.some(group => group.children ? this._computeIsSomeGroupExpanded(group.children) : !group.isCollapsed);
+  private _computeIsSomeGroupExpanded(groups: IGroup[] | undefined): boolean {
+    return !!(groups && groups.some(group => group.children ? this._computeIsSomeGroupExpanded(group.children) : !group.isCollapsed));
   }
 
   private _updateIsSomeGroupExpanded() {
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
index a5fcfddd1ce6c..a22908d440e1f 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
@@ -207,7 +207,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
                 (
                   <List
                     ref='list'
-                    items={ group.children }
+                    items={ group!.children }
                     onRenderCell={ this._renderSubGroup }
                     getItemCountForPage={ () => 1 }
                   />
@@ -263,7 +263,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
 
   private _onSelectionChange() {
     let { group, selection } = this.props;
-    let isSelected = selection.isRangeSelected(group.startIndex, group.count);
+    let isSelected = selection!.isRangeSelected(group!.startIndex, group!.count);
 
     if (isSelected !== this.state.isSelected) {
       this.setState({ isSelected });
@@ -353,10 +353,10 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
       selectionIndex: -1,
       context: { data: group, index: groupIndex, isGroup: true },
       canDrag: () => false, // cannot drag groups
-      canDrop: dragDropEvents.canDrop,
+      canDrop: dragDropEvents!.canDrop,
       updateDropState: this._updateDroppingState
     };
-    return options;
+    return options as IDragDropOptions;
   }
 
   /**
@@ -372,12 +372,12 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
     let { dragDropEvents } = this.props;
 
     if (!isDropping) {
-      if (dragDropEvents.onDragLeave) {
-        dragDropEvents.onDragLeave(event, null);
+      if (dragDropEvents && dragDropEvents.onDragLeave) {
+        dragDropEvents.onDragLeave!(event, undefined);
       }
     } else {
-      if (dragDropEvents.onDragEnter) {
-        dragDropEvents.onDragEnter(event, null);
+      if (dragDropEvents && dragDropEvents.onDragEnter) {
+        dragDropEvents.onDragEnter(event, undefined);
       }
     }
 
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
index ce2ca65da85b2..5dbea36a444db 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
@@ -43,7 +43,7 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
   }
 
   public componentDidMount() {
-    if (this._expandedElem && this._expandedElem.scrollHeight >= this.props.expandedCardHeight) {
+    if (this._expandedElem && this._expandedElem.scrollHeight >= (this.props.expandedCardHeight as number)) {
       this.setState({
         needsScroll: true
       });
@@ -65,7 +65,7 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
       compactCardHeight,
       expandedCardHeight
     } = this.props;
-    this._styles = getStyles(theme, customStyles);
+    this._styles = getStyles(theme!, customStyles);
 
     return (
       <Callout
@@ -79,7 +79,7 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
         isBeakVisible={ false }
         directionalHint={ getRTL() ? DirectionalHint.bottomRightEdge : DirectionalHint.bottomLeftEdge }
         directionalHintFixed={ true }
-        finalHeight={ compactCardHeight + expandedCardHeight }
+        finalHeight={ compactCardHeight! + expandedCardHeight! }
         minPagePadding={ 24 }
       >
         <div
@@ -131,7 +131,7 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
   private _checkNeedsScroll(): void {
     if (this._expandedElem) {
       this._async.requestAnimationFrame(() => {
-        if (this._expandedElem.scrollHeight >= this.props.expandedCardHeight) {
+        if (this._expandedElem.scrollHeight >= this.props.expandedCardHeight!) {
           this.setState({
             needsScroll: true
           });
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
index edf0608110514..d6f4d09151263 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
@@ -26,7 +26,7 @@ describe('Image', () => {
         onLoad={ () => {
           done();
         } }
-        />
+      />
     );
   });
 
@@ -34,7 +34,7 @@ describe('Image', () => {
     let root = document.createElement('div');
     let onLoadingStateChange = (loadState: ImageLoadState) => {
       if (loadState === ImageLoadState.loaded) {
-        let image = document.querySelector('.ms-Image.is-portraitFrame .ms-Image-image');
+        let image = document.querySelector('.ms-Image.is-portraitFrame .ms-Image-image') as Element;
         try {
           expect(image.className).to.contain('ms-Image-image--landscape');
         } catch (e) { done(e); }
@@ -50,7 +50,7 @@ describe('Image', () => {
         imageFit={ ImageFit.cover }
         className='is-portraitFrame'
         onLoadingStateChange={ onLoadingStateChange }
-        />, root
+      />, root
     );
   });
 
@@ -58,7 +58,7 @@ describe('Image', () => {
     let root = document.createElement('div');
     let onLoadingStateChange = (loadState: ImageLoadState) => {
       if (loadState === ImageLoadState.loaded) {
-        let image = document.querySelector('.ms-Image.is-landscapeFrame .ms-Image-image');
+        let image = document.querySelector('.ms-Image.is-landscapeFrame .ms-Image-image') as Element;
         try {
           expect(image.className).to.contain('ms-Image-image--portrait');
         } catch (e) { done(e); }
@@ -74,7 +74,7 @@ describe('Image', () => {
         imageFit={ ImageFit.cover }
         className='is-landscapeFrame'
         onLoadingStateChange={ onLoadingStateChange }
-        />, root
+      />, root
     );
   });
 
@@ -82,7 +82,7 @@ describe('Image', () => {
     let root = document.createElement('div');
     let onLoadingStateChange = (loadState: ImageLoadState) => {
       if (loadState === ImageLoadState.loaded) {
-        let image = document.querySelector('.ms-Image.is-frameMaximizedPortrait .ms-Image-image');
+        let image = document.querySelector('.ms-Image.is-frameMaximizedPortrait .ms-Image-image') as Element;
         try {
           expect(image.className).to.contain('ms-Image-image--portrait');
         } catch (e) { done(e); }
@@ -98,7 +98,7 @@ describe('Image', () => {
           maximizeFrame
           src={ testImage1x1 }
           onLoadingStateChange={ onLoadingStateChange }
-          />
+        />
       </div>, root
     );
   });
@@ -107,7 +107,7 @@ describe('Image', () => {
     let root = document.createElement('div');
     let onLoadingStateChange = (loadState: ImageLoadState) => {
       if (loadState === ImageLoadState.loaded) {
-        let image = document.querySelector('.ms-Image.is-frameMaximizedLandscape .ms-Image-image');
+        let image = document.querySelector('.ms-Image.is-frameMaximizedLandscape .ms-Image-image') as Element;
         try {
           expect(image.className).to.contain('ms-Image-image--landscape');
         } catch (e) { done(e); }
@@ -123,7 +123,7 @@ describe('Image', () => {
           className='is-frameMaximizedLandscape'
           onLoadingStateChange={ onLoadingStateChange }
           maximizeFrame
-          />
+        />
       </div>, root
     );
   });
@@ -135,7 +135,7 @@ describe('Image', () => {
         onError={ () => {
           done();
         } }
-        />
+      />
     );
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx b/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx
index 523f11ec9f5f5..3a16f726cd7d4 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx
@@ -20,7 +20,7 @@ export class Layer extends BaseComponent<ILayerProps, {}> {
 
   private _rootElement: HTMLElement;
   private _host: Node;
-  private _layerElement: HTMLElement;
+  private _layerElement: HTMLElement | undefined;
   private _hasMounted: boolean;
   /**
    * Used for notifying applicable Layers that a host is available/unavailable and to re-evaluate Layers that
@@ -74,7 +74,7 @@ export class Layer extends BaseComponent<ILayerProps, {}> {
       this._host = host;
 
       if (!this._layerElement) {
-        let doc = getDocument(this._rootElement);
+        let doc = getDocument(this._rootElement) as Document;
 
         this._layerElement = doc.createElement('div');
         this._layerElement.className = css('ms-Layer', {
@@ -101,7 +101,7 @@ export class Layer extends BaseComponent<ILayerProps, {}> {
               this.props.onLayerMounted();
             }
 
-            this.props.onLayerDidMount();
+            this.props.onLayerDidMount!();
           }
         });
     }
@@ -118,7 +118,7 @@ export class Layer extends BaseComponent<ILayerProps, {}> {
 
   private _removeLayerElement() {
     if (this._layerElement) {
-      this.props.onLayerWillUnmount();
+      this.props.onLayerWillUnmount!();
 
       ReactDOM.unmountComponentAtNode(this._layerElement);
       let parentNode = this._layerElement.parentNode;
@@ -132,10 +132,10 @@ export class Layer extends BaseComponent<ILayerProps, {}> {
 
   private _getHost(): Node {
     let { hostId } = this.props;
-    let doc = getDocument(this._rootElement);
+    let doc = getDocument(this._rootElement) as Document;
 
     if (hostId) {
-      return doc.getElementById(hostId);
+      return doc.getElementById(hostId) as Node;
     } else {
       return doc.body;
     }
diff --git a/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx b/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
index 3f448eedc018d..64dab54fd3762 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
+++ b/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
@@ -79,7 +79,7 @@ export class Modal extends BaseComponent<IModalProps, IDialogState> {
     }
   }
 
-  public render() {
+  public render(): JSX.Element | null {
     let {
       elementToFocusOnDismiss,
       firstFocusableSelector,
@@ -97,8 +97,8 @@ export class Modal extends BaseComponent<IModalProps, IDialogState> {
     let { id, isOpen, isVisible } = this.state;
 
     const modalClassName = css('ms-Modal', styles.root, this.props.className, {
-      ['is-open']: isOpen,
-      [styles.rootIsVisible]: isVisible,
+      ['is-open']: !!isOpen,
+      [styles.rootIsVisible]: !!isVisible,
     });
 
     if (!isOpen) {
@@ -106,7 +106,7 @@ export class Modal extends BaseComponent<IModalProps, IDialogState> {
     }
 
     // @temp tuatology - Will adjust this to be a panel at certain breakpoints
-    if (responsiveMode >= ResponsiveMode.small) {
+    if (responsiveMode! >= ResponsiveMode.small) {
       return (
         <Layer onLayerDidMount={ onLayerDidMount }>
           <Popup
@@ -116,7 +116,7 @@ export class Modal extends BaseComponent<IModalProps, IDialogState> {
             onDismiss={ onDismiss }
           >
             <div className={ modalClassName }>
-              <Overlay isDarkThemed={ isDarkOverlay } onClick={ isBlocking ? null : onDismiss } />
+              <Overlay isDarkThemed={ isDarkOverlay } onClick={ isBlocking ? undefined : (onDismiss as any) } />
               <FocusTrapZone
                 className={ css('ms-Dialog-main', styles.main, this.props.containerClassName) }
                 elementToFocusOnDismiss={ elementToFocusOnDismiss }
@@ -131,6 +131,7 @@ export class Modal extends BaseComponent<IModalProps, IDialogState> {
         </Layer>
       );
     }
+    return null;
   }
 
   // Watch for completed animations and set the state
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.Props.ts b/packages/office-ui-fabric-react/src/components/Nav/Nav.Props.ts
index 5d090e1ce032c..ec1a7656f27b3 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.Props.ts
@@ -7,7 +7,7 @@ export interface INav {
    * that in order for Nav to properly understand which key is selected all NavItems in
    * all groups of the Nav must have populated key properties.
    */
-  selectedKey: string;
+  selectedKey: string | undefined;
 }
 
 export interface INavProps {
@@ -20,7 +20,7 @@ export interface INavProps {
   /**
    * A collection of link groups to display in the navigation bar
    */
-  groups: INavLinkGroup[];
+  groups: INavLinkGroup[] | null;
 
   /**
    * Optional class name to allow styling.
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
index 33494cfdd98f4..5bea6c99fad48 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
@@ -53,7 +53,7 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
     this._hasExpandButton = false;
   }
 
-  public render(): React.ReactElement<{}> {
+  public render(): JSX.Element | null {
     const { groups, className, isOnTop } = this.props;
 
     if (!groups) {
@@ -86,7 +86,7 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
     );
   }
 
-  public get selectedKey(): string {
+  public get selectedKey(): string | undefined {
     return this.state.selectedKey;
   }
 
@@ -113,7 +113,7 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
             iconName='IconLink'
           />
         ) }
-        { this.props.onRenderLink(link) }
+        { this.props.onRenderLink!(link) }
       </a>
     );
   }
@@ -141,9 +141,9 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
     return (
       <div key={ link.key || linkIndex }
         className={ css('ms-Nav-compositeLink', styles.compositeLink, {
-          ' is-expanded': link.isExpanded,
+          ' is-expanded': !!link.isExpanded,
           'is-selected': isLinkSelected,
-          [styles.compositeLinkIsExpanded]: link.isExpanded,
+          [styles.compositeLinkIsExpanded]: !!link.isExpanded,
           [styles.compositeLinkIsSelected]: isLinkSelected
         }) }>
         { (link.links && link.links.length > 0 ?
@@ -174,7 +174,7 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
     );
   }
 
-  private _renderLinks(links: INavLink[], nestingLevel: number): React.ReactElement<{}> {
+  private _renderLinks(links: INavLink[] | undefined, nestingLevel: number): React.ReactElement<{}> | null {
     if (!links || !links.length) {
       return null;
     }
@@ -189,7 +189,7 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
   }
 
   private _renderGroup(group: INavLinkGroup, groupIndex: number): React.ReactElement<{}> {
-    const isGroupExpanded: boolean = !this.state.isGroupCollapsed[group.name];
+    const isGroupExpanded: boolean = !this.state.isGroupCollapsed![group.name as string];
 
     return (
       <div key={ groupIndex } className={ css('ms-Nav-group', styles.group, {
@@ -222,7 +222,7 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
   private _onGroupHeaderClicked(groupKey: string, ev: React.MouseEvent<HTMLElement>): void {
     let { isGroupCollapsed } = this.state;
 
-    isGroupCollapsed[groupKey] = !isGroupCollapsed[groupKey];
+    isGroupCollapsed![groupKey] = !isGroupCollapsed![groupKey];
     this.setState({ isGroupCollapsed: isGroupCollapsed });
 
     ev.preventDefault();
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx b/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
index 93f2e998d144b..64d043c9532ff 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
@@ -10,8 +10,8 @@ import * as stylesImport from './Rating.scss';
 const styles: any = stylesImport;
 
 export interface IRatingState {
-  rating: number;
-  focusedRating: number;
+  rating: number | null | undefined;
+  focusedRating: number | null;
 }
 
 export class Rating extends BaseComponent<IRatingProps, IRatingState> {
@@ -45,7 +45,7 @@ export class Rating extends BaseComponent<IRatingProps, IRatingState> {
 
   public render() {
     let stars: JSX.Element[] = [];
-    for (let i = this.props.min; i <= this.props.max; ++i) {
+    for (let i = this.props.min as number; i <= (this.props.max as number); ++i) {
       stars.push(this._renderStar(i));
     }
 
@@ -62,7 +62,7 @@ export class Rating extends BaseComponent<IRatingProps, IRatingState> {
     const inputId = `${this._id}-${rating}`;
 
     return <div className={ css('ms-Rating-star', styles.star, {
-      ['is-selected ' + styles.starIsSelected]: rating <= this.state.rating,
+      ['is-selected ' + styles.starIsSelected]: rating <= (this.state.rating as number),
       ['is-inFocus ' + styles.starIsInFocus]: rating === this.state.focusedRating,
       ['is-disabled ' + styles.starIsDisabled]: this.props.disabled
     }) } key={ rating }>
@@ -141,6 +141,6 @@ export class Rating extends BaseComponent<IRatingProps, IRatingState> {
   private _getClampedRating(rating: number): number {
     rating = Math.floor(rating);
 
-    return Math.min(Math.max(rating, this.props.min), this.props.max);
+    return Math.min(Math.max(rating, this.props.min as number), this.props.max as number);
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
index a2fd4085a2a56..0359a3dbb2b25 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
@@ -17,7 +17,7 @@ describe('Slider', () => {
       <Slider label='slider' />
     );
     let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
-    let labelElement = renderedDOM.querySelector('.ms-Label');
+    let labelElement = renderedDOM.querySelector('.ms-Label') as HTMLElement;
 
     expect(labelElement.textContent).to.equal('slider');
   });
@@ -34,8 +34,8 @@ describe('Slider', () => {
     );
 
     let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
-    let sliderLine = renderedDOM.querySelector('.ms-Slider-line');
-    let sliderThumb = renderedDOM.querySelector('.ms-Slider-slideBox');
+    let sliderLine = renderedDOM.querySelector('.ms-Slider-line') as HTMLElement;
+    let sliderThumb = renderedDOM.querySelector('.ms-Slider-slideBox') as HTMLElement;
 
     sliderLine.getBoundingClientRect = () => ({
       left: 0,
@@ -81,11 +81,11 @@ describe('Slider', () => {
   });
 
   it('can read the current value', () => {
-    let slider: ISlider;
+    let slider: ISlider | undefined;
 
     let component = ReactTestUtils.renderIntoDocument(
       <Slider label='slider' defaultValue={ 12 } min={ 0 } max={ 100 } componentRef={ s => slider = s } />
     );
-    expect(slider.value).equals(12);
+    expect(slider!.value).equals(12);
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
index 6c5c092b8a62d..7803c43140618 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
@@ -173,7 +173,7 @@ describe('TextField', () => {
     });
 
     it('should not render error message when no value is provided', () => {
-      let actualValue: string = undefined;
+      let actualValue: string | undefined = undefined;
 
       const renderedDOM: HTMLElement = renderIntoDocument(
         <TextField
@@ -310,7 +310,7 @@ describe('TextField', () => {
       />
     );
 
-    expect(renderedDOM.querySelector('input').value).equals('initial value');
+    expect(renderedDOM.querySelector('input')!.value).equals('initial value');
   });
 
   it('can render a default value as a textarea', () => {
@@ -321,7 +321,7 @@ describe('TextField', () => {
       />
     );
 
-    expect(renderedDOM.querySelector('textarea').value).equals('initial value');
+    expect(renderedDOM.querySelector('textarea')!.value).equals('initial value');
   });
 
   it('should call onChanged handler for input change', () => {
@@ -365,6 +365,6 @@ describe('TextField', () => {
       />
     );
 
-    textField.setSelectionRange(0, initialValue.length);
+    textField!.setSelectionRange(0, initialValue.length);
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts
index 14b6eb3e45ea1..63bf000c89607 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts
@@ -121,5 +121,5 @@ export const getStyles = memoizeFunction((
 
   };
 
-  return mergeStyleSets(styles, customStyles);
+  return mergeStyleSets(styles, customStyles) as IToggleStyles;
 });
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
index 6c660d7bb106a..6d797b6370c76 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
@@ -55,7 +55,7 @@ export class SelectedItemWithMenu extends BaseComponent<IPeoplePickerItemWithMen
           </div>
           { this.state.contextualMenuVisible ? (
             <ContextualMenu
-              items={ item.menuItems }
+              items={ item.menuItems! }
               shouldFocusOnMount={ true }
               targetElement={ this.refs.ellipsisRef }
               onDismiss={ this._onCloseContextualMenu }
diff --git a/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx b/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx
index 149367a81d329..01241f197ad69 100644
--- a/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx
@@ -56,7 +56,7 @@ export function withViewport<P extends { viewport?: IViewport }, S>(ComposedComp
 
     public render() {
       let { viewport } = this.state;
-      let isViewportVisible = viewport.width > 0 && viewport.height > 0;
+      let isViewportVisible = viewport!.width > 0 && viewport!.height > 0;
 
       return (
         <div className='ms-Viewport' ref='root' style={ { minWidth: 1, minHeight: 1 } }>
@@ -89,8 +89,8 @@ export function withViewport<P extends { viewport?: IViewport }, S>(ComposedComp
       };
 
       let isSizeChanged = (
-        (clientRect && clientRect.width) !== viewport.width ||
-        (scrollRect && scrollRect.height) !== viewport.height);
+        (clientRect && clientRect.width) !== viewport!.width ||
+        (scrollRect && scrollRect.height) !== viewport!.height);
 
       if (isSizeChanged && this._resizeAttempts < MAX_RESIZE_ATTEMPTS && clientRect && scrollRect) {
         this._resizeAttempts++;

From 6900fc6013e77eb6cd7268358aa64f9c9b46edd6 Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Thu, 20 Jul 2017 17:34:20 -0700
Subject: [PATCH 0293/1641] Theming: fix color mapping for
 listItemBackgroundChecked (#2273)

* fix color slot

* change file
---
 .../@uifabric/styling/phkuo-fix_2017-07-20-22-59.json | 11 +++++++++++
 packages/styling/src/styles/theme.ts                  |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/styling/phkuo-fix_2017-07-20-22-59.json

diff --git a/common/changes/@uifabric/styling/phkuo-fix_2017-07-20-22-59.json b/common/changes/@uifabric/styling/phkuo-fix_2017-07-20-22-59.json
new file mode 100644
index 0000000000000..e9dd91ccb1c8a
--- /dev/null
+++ b/common/changes/@uifabric/styling/phkuo-fix_2017-07-20-22-59.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Theming: fix color mapping for listItemBackgroundChecked",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index 56297804a335b..7b6ebcb04641b 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -104,7 +104,7 @@ function _makeSemanticColorsFromPalette(p: IPalette): ISemanticColors {
     listBackground: p.white,
     listTextColor: p.neutralPrimary,
     listItemBackgroundHovered: p.neutralLighter,
-    listItemBackgroundChecked: p.neutralQuaternary,
+    listItemBackgroundChecked: p.neutralLight,
     listItemBackgroundCheckedHovered: p.neutralQuaternaryAlt
   };
 }

From b7967485ce2590ce5ba5ce4fa86f3a35bdc1cbdb Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 21 Jul 2017 10:21:45 +0000
Subject: [PATCH 0294/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 22 ++++++++++
 apps/fabric-website/CHANGELOG.md              |  9 +++-
 apps/fabric-website/package.json              |  4 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../oufr-strict-null-2_2017-07-17-23-47.json  | 11 -----
 ...adsurang-15julyfixes_2017-07-15-07-24.json | 11 -----
 .../jahnp-site-fixes_2017-07-20-05-22.json    | 11 -----
 .../oufr-strict-null-2_2017-07-17-23-47.json  | 11 -----
 ...adsurang-15julyfixes_2017-07-15-07-24.json | 11 -----
 ...conCodes-multiColumn_2017-07-18-18-15.json | 11 -----
 .../oufr-strict-null-2_2017-07-17-23-47.json  | 11 -----
 .../styling/phkuo-fix_2017-07-20-22-59.json   | 11 -----
 ...adsurang-15julyfixes_2017-07-15-07-24.json | 11 -----
 .../filteredAssignBug_2017-07-20-21-02.json   | 11 -----
 .../oufr-strict-null-2_2017-07-17-23-47.json  | 11 -----
 ...adsurang-15julyfixes_2017-07-15-07-24.json | 11 -----
 .../2017-07-20-20-08.json                     | 11 -----
 .../oufr-strict-null-2_2017-07-17-23-47.json  | 11 -----
 .../textfield-disabled_2017-07-19-16-10.json  | 11 -----
 .../use-scroll-width_2017-07-18-23-50.json    | 11 -----
 ...adsurang-15julyfixes_2017-07-15-07-24.json | 11 -----
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  4 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 42 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 13 +++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/CHANGELOG.json               | 24 +++++++++++
 packages/styling/CHANGELOG.md                 | 10 ++++-
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 +++++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  2 +-
 34 files changed, 151 insertions(+), 203 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/oufr-strict-null-2_2017-07-17-23-47.json
 delete mode 100644 common/changes/@uifabric/example-app-base/users-adsurang-15julyfixes_2017-07-15-07-24.json
 delete mode 100644 common/changes/@uifabric/fabric-website/jahnp-site-fixes_2017-07-20-05-22.json
 delete mode 100644 common/changes/@uifabric/fabric-website/oufr-strict-null-2_2017-07-17-23-47.json
 delete mode 100644 common/changes/@uifabric/fabric-website/users-adsurang-15julyfixes_2017-07-15-07-24.json
 delete mode 100644 common/changes/@uifabric/styling/antonla-iconCodes-multiColumn_2017-07-18-18-15.json
 delete mode 100644 common/changes/@uifabric/styling/oufr-strict-null-2_2017-07-17-23-47.json
 delete mode 100644 common/changes/@uifabric/styling/phkuo-fix_2017-07-20-22-59.json
 delete mode 100644 common/changes/@uifabric/styling/users-adsurang-15julyfixes_2017-07-15-07-24.json
 delete mode 100644 common/changes/@uifabric/utilities/filteredAssignBug_2017-07-20-21-02.json
 delete mode 100644 common/changes/@uifabric/utilities/oufr-strict-null-2_2017-07-17-23-47.json
 delete mode 100644 common/changes/@uifabric/utilities/users-adsurang-15julyfixes_2017-07-15-07-24.json
 delete mode 100644 common/changes/office-ui-fabric-react/2017-07-20-20-08.json
 delete mode 100644 common/changes/office-ui-fabric-react/oufr-strict-null-2_2017-07-17-23-47.json
 delete mode 100644 common/changes/office-ui-fabric-react/textfield-disabled_2017-07-19-16-10.json
 delete mode 100644 common/changes/office-ui-fabric-react/use-scroll-width_2017-07-18-23-50.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-adsurang-15julyfixes_2017-07-15-07-24.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 96d31e07b4713..de0fbc1e0308f 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.5.42",
+      "tag": "@uifabric/fabric-website_v4.5.42",
+      "date": "Fri, 21 Jul 2017 10:21:45 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Peter Jahn <pejahn@microsoft.com>",
+            "commit": "305a3e76f8f9fae6b6ff1f7ceeb659b963f840f1",
+            "comment": "Remove erroneous usage of baseUrl to fix link to color accessibility guide"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.8.0 <5.0.0` to `>=4.8.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.21.3 <5.0.0` to `>=4.21.4 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.5.41",
       "tag": "@uifabric/fabric-website_v4.5.41",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 0d79fd203685a..72279033a073c 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Sat, 08 Jul 2017 03:34:35 GMT and should not be manually modified.
+This log was last generated on Fri, 21 Jul 2017 10:21:45 GMT and should not be manually modified.
+
+## 4.5.42
+Fri, 21 Jul 2017 10:21:45 GMT
+
+### Patches
+
+- Remove erroneous usage of baseUrl to fix link to color accessibility guide
 
 ## 4.5.41
 Sat, 08 Jul 2017 03:34:35 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index b73dd964e1ece..e563229d7f766 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.5.41",
+  "version": "4.5.42",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.21.3 <5.0.0",
+    "office-ui-fabric-react": ">=4.21.4 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 80709b255b25d..6f9086159d8c3 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.21.3 <5.0.0",
+    "office-ui-fabric-react": ">=4.21.4 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index e4aa5bc4fd8f7..761ab5ed0a489 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -35,7 +35,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.21.3 <5.0.0",
+    "office-ui-fabric-react": ">=4.21.4 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index dedf27e7ef17d..df7b1e05f0a6d 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.21.3 <5.0.0",
+    "office-ui-fabric-react": ">=4.21.4 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/@uifabric/example-app-base/oufr-strict-null-2_2017-07-17-23-47.json b/common/changes/@uifabric/example-app-base/oufr-strict-null-2_2017-07-17-23-47.json
deleted file mode 100644
index e807ce07d1d8c..0000000000000
--- a/common/changes/@uifabric/example-app-base/oufr-strict-null-2_2017-07-17-23-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/users-adsurang-15julyfixes_2017-07-15-07-24.json b/common/changes/@uifabric/example-app-base/users-adsurang-15julyfixes_2017-07-15-07-24.json
deleted file mode 100644
index 7d80e8e887db5..0000000000000
--- a/common/changes/@uifabric/example-app-base/users-adsurang-15julyfixes_2017-07-15-07-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "adsurang@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/jahnp-site-fixes_2017-07-20-05-22.json b/common/changes/@uifabric/fabric-website/jahnp-site-fixes_2017-07-20-05-22.json
deleted file mode 100644
index 6c634a24b4fad..0000000000000
--- a/common/changes/@uifabric/fabric-website/jahnp-site-fixes_2017-07-20-05-22.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Remove erroneous usage of baseUrl to fix link to color accessibility guide",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "pejahn@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/oufr-strict-null-2_2017-07-17-23-47.json b/common/changes/@uifabric/fabric-website/oufr-strict-null-2_2017-07-17-23-47.json
deleted file mode 100644
index cbeaf5c6e2864..0000000000000
--- a/common/changes/@uifabric/fabric-website/oufr-strict-null-2_2017-07-17-23-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/users-adsurang-15julyfixes_2017-07-15-07-24.json b/common/changes/@uifabric/fabric-website/users-adsurang-15julyfixes_2017-07-15-07-24.json
deleted file mode 100644
index f3ff20e3759a2..0000000000000
--- a/common/changes/@uifabric/fabric-website/users-adsurang-15julyfixes_2017-07-15-07-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "adsurang@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/antonla-iconCodes-multiColumn_2017-07-18-18-15.json b/common/changes/@uifabric/styling/antonla-iconCodes-multiColumn_2017-07-18-18-15.json
deleted file mode 100644
index 319124db5eaa6..0000000000000
--- a/common/changes/@uifabric/styling/antonla-iconCodes-multiColumn_2017-07-18-18-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Adding multi-column mapping to the icon map to be available in the ChoiceGroup",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "antonla@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/oufr-strict-null-2_2017-07-17-23-47.json b/common/changes/@uifabric/styling/oufr-strict-null-2_2017-07-17-23-47.json
deleted file mode 100644
index 10861b0091cd0..0000000000000
--- a/common/changes/@uifabric/styling/oufr-strict-null-2_2017-07-17-23-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/phkuo-fix_2017-07-20-22-59.json b/common/changes/@uifabric/styling/phkuo-fix_2017-07-20-22-59.json
deleted file mode 100644
index e9dd91ccb1c8a..0000000000000
--- a/common/changes/@uifabric/styling/phkuo-fix_2017-07-20-22-59.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Theming: fix color mapping for listItemBackgroundChecked",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/users-adsurang-15julyfixes_2017-07-15-07-24.json b/common/changes/@uifabric/styling/users-adsurang-15julyfixes_2017-07-15-07-24.json
deleted file mode 100644
index 862f25c73e009..0000000000000
--- a/common/changes/@uifabric/styling/users-adsurang-15julyfixes_2017-07-15-07-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "adsurang@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/filteredAssignBug_2017-07-20-21-02.json b/common/changes/@uifabric/utilities/filteredAssignBug_2017-07-20-21-02.json
deleted file mode 100644
index 93ecab3b18ce5..0000000000000
--- a/common/changes/@uifabric/utilities/filteredAssignBug_2017-07-20-21-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Fixing filteredAssign function",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "alebet@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/oufr-strict-null-2_2017-07-17-23-47.json b/common/changes/@uifabric/utilities/oufr-strict-null-2_2017-07-17-23-47.json
deleted file mode 100644
index 215b2a26b2777..0000000000000
--- a/common/changes/@uifabric/utilities/oufr-strict-null-2_2017-07-17-23-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/users-adsurang-15julyfixes_2017-07-15-07-24.json b/common/changes/@uifabric/utilities/users-adsurang-15julyfixes_2017-07-15-07-24.json
deleted file mode 100644
index b7a21e19e9cff..0000000000000
--- a/common/changes/@uifabric/utilities/users-adsurang-15julyfixes_2017-07-15-07-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "adsurang@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/2017-07-20-20-08.json b/common/changes/office-ui-fabric-react/2017-07-20-20-08.json
deleted file mode 100644
index 819475657f4c3..0000000000000
--- a/common/changes/office-ui-fabric-react/2017-07-20-20-08.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Do not redundantly set aria-label on command bar items. ",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "trgau@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/oufr-strict-null-2_2017-07-17-23-47.json b/common/changes/office-ui-fabric-react/oufr-strict-null-2_2017-07-17-23-47.json
deleted file mode 100644
index fe318ba1c3402..0000000000000
--- a/common/changes/office-ui-fabric-react/oufr-strict-null-2_2017-07-17-23-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "More strict null check fixes in office-ui-fabric-react",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/textfield-disabled_2017-07-19-16-10.json b/common/changes/office-ui-fabric-react/textfield-disabled_2017-07-19-16-10.json
deleted file mode 100644
index 7a7a2b54a068b..0000000000000
--- a/common/changes/office-ui-fabric-react/textfield-disabled_2017-07-19-16-10.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Textfield: Fixed regression in disabled styles",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/use-scroll-width_2017-07-18-23-50.json b/common/changes/office-ui-fabric-react/use-scroll-width_2017-07-18-23-50.json
deleted file mode 100644
index 2bcf64bceaf0e..0000000000000
--- a/common/changes/office-ui-fabric-react/use-scroll-width_2017-07-18-23-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ResizeGroup: Use scrollWidth instead of clientWidth for measuring hidden div",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-adsurang-15julyfixes_2017-07-15-07-24.json b/common/changes/office-ui-fabric-react/users-adsurang-15julyfixes_2017-07-15-07-24.json
deleted file mode 100644
index 90aa6b4e2f8bc..0000000000000
--- a/common/changes/office-ui-fabric-react/users-adsurang-15julyfixes_2017-07-15-07-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixed deletion of tag item when tag picker is disabled",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "adsurang@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 3fd960c3527e4..e8307064d618b 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -48,7 +48,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.13.13 <1.0.0",
+    "@uifabric/styling": ">=0.13.14 <1.0.0",
     "@uifabric/utilities": ">=4.8.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 1ec1ff716a2a3..c143b35472e47 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -22,7 +22,7 @@
     "@types/react-dom": "15.5.0",
     "@types/webpack-env": "1.13.0",
     "@uifabric/example-app-base": "4.1.1",
-    "@uifabric/utilities": "4.8.0",
+    "@uifabric/utilities": "4.8.1",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.21.3 <5.0.0",
+    "office-ui-fabric-react": ">=4.21.4 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 78358797c1ec7..cafca7032938d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,48 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.21.4",
+      "tag": "office-ui-fabric-react_v4.21.4",
+      "date": "Fri, 21 Jul 2017 10:21:45 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Trevor Gau <trevorsg@gmail.com>",
+            "commit": "294b4174faf5455edc3526eba337b40a847fc10e",
+            "comment": "Do not redundantly set aria-label on command bar items. "
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "d5af8b6edae526651fcc1b2905a1119ef1408103",
+            "comment": "More strict null check fixes in office-ui-fabric-react"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "91323c55902c278e73a13118fc3cd2d7dc00da62",
+            "comment": "Textfield: Fixed regression in disabled styles"
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "dcec97d5dd145a80baee3fd80c715286e1597d0a",
+            "comment": "ResizeGroup: Use scrollWidth instead of clientWidth for measuring hidden div"
+          },
+          {
+            "author": "Aadhar Surange <adhargithub@gmail.com>",
+            "commit": "06ef248801b5a43513c86ce7cc3f06696cb43397",
+            "comment": "Fixed deletion of tag item when tag picker is disabled"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.8.0 <5.0.0` to `>=4.8.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.13.13 <1.0.0` to `>=0.13.14 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.21.3",
       "tag": "office-ui-fabric-react_v4.21.3",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 866db4efd87f9..da372d8a2f79a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 20 Jul 2017 10:11:23 GMT and should not be manually modified.
+This log was last generated on Fri, 21 Jul 2017 10:21:45 GMT and should not be manually modified.
+
+## 4.21.4
+Fri, 21 Jul 2017 10:21:45 GMT
+
+### Patches
+
+- Do not redundantly set aria-label on command bar items. 
+- More strict null check fixes in office-ui-fabric-react
+- Textfield: Fixed regression in disabled styles
+- ResizeGroup: Use scrollWidth instead of clientWidth for measuring hidden div
+- Fixed deletion of tag item when tag picker is disabled
 
 ## 4.21.3
 Thu, 20 Jul 2017 10:11:23 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 9c2e594c0d578..ca498fa0c348b 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.21.3",
+  "version": "4.21.4",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.8.0 <5.0.0",
-    "@uifabric/styling": ">=0.13.13 <1.0.0",
+    "@uifabric/styling": ">=0.13.14 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 5fd244095f980..2203bde0072f9 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.13.14",
+      "tag": "@uifabric/styling_v0.13.14",
+      "date": "Fri, 21 Jul 2017 10:21:45 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "antonlabunets <alabunets@gmail.com>",
+            "commit": "0a145b00965c9aefabc1aa6648b36f53281691fb",
+            "comment": "Adding multi-column mapping to the icon map to be available in the ChoiceGroup"
+          },
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "6900fc6013e77eb6cd7268358aa64f9c9b46edd6",
+            "comment": "Theming: fix color mapping for listItemBackgroundChecked"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.8.0 <5.0.0` to `>=4.8.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.13.13",
       "tag": "@uifabric/styling_v0.13.13",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 7f1e44f521caf..f9f8804d74432 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 20 Jul 2017 10:11:23 GMT and should not be manually modified.
+This log was last generated on Fri, 21 Jul 2017 10:21:45 GMT and should not be manually modified.
+
+## 0.13.14
+Fri, 21 Jul 2017 10:21:45 GMT
+
+### Patches
+
+- Adding multi-column mapping to the icon map to be available in the ChoiceGroup
+- Theming: fix color mapping for listItemBackgroundChecked
 
 ## 0.13.13
 Thu, 20 Jul 2017 10:11:23 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 79176aa43a797..a869e9ee08161 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.13.13",
+  "version": "0.13.14",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 0002bc7e3ab9e..a399f58e12f9f 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.8.1",
+      "tag": "@uifabric/utilities_v4.8.1",
+      "date": "Fri, 21 Jul 2017 10:21:45 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Alex Bettadapur <alexbettadapur@gmail.com>",
+            "commit": "e23f7f865699374df1d8f5de0f553ee1559b3f8f",
+            "comment": "Fixing filteredAssign function"
+          }
+        ]
+      }
+    },
     {
       "version": "4.8.0",
       "tag": "@uifabric/utilities_v4.8.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index c43986328304a..ec95745b7937e 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Wed, 19 Jul 2017 21:40:34 GMT and should not be manually modified.
+This log was last generated on Fri, 21 Jul 2017 10:21:45 GMT and should not be manually modified.
+
+## 4.8.1
+Fri, 21 Jul 2017 10:21:45 GMT
+
+### Patches
+
+- Fixing filteredAssign function
 
 ## 4.8.0
 Wed, 19 Jul 2017 21:40:34 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 0e07696d4b52f..84909f986ad84 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.8.0",
+  "version": "4.8.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 67d167f3d9400b3f38c0106a78f91a67a6eabb5e Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Fri, 21 Jul 2017 10:31:34 -0700
Subject: [PATCH 0295/1641] ResizeGroup: Add support for onGrowData (#2258)

* Add support for onGrowData

* Add test for resize direction grow and there is no ongrowdata

* Add test for onGrowData

* Add test to make sure onGrowData switches to shrink direction after contents do not fit.

* Add test for onGrowData returning undefined

* Add test for window resize and onGrowData

* Add tests for caching,.

* Update examples

* Fix bug, add test for initial render

* Rush change. Fix comment
---
 .../grow-data_2017-07-19-20-52.json           |  11 +
 .../ResizeGroup/ResizeGroup.Props.ts          |  11 +-
 .../ResizeGroup/ResizeGroup.test.tsx          | 283 +++++++++++++++++-
 .../components/ResizeGroup/ResizeGroup.tsx    |  97 +++++-
 .../ResizeGroup/ResizeGroupPage.tsx           |   5 +-
 .../ResizeGroup.OverflowSet.Example.tsx       |  58 +++-
 6 files changed, 421 insertions(+), 44 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/grow-data_2017-07-19-20-52.json

diff --git a/common/changes/office-ui-fabric-react/grow-data_2017-07-19-20-52.json b/common/changes/office-ui-fabric-react/grow-data_2017-07-19-20-52.json
new file mode 100644
index 0000000000000..0b1a088e3c573
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/grow-data_2017-07-19-20-52.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ResizeGroup: Add support for onGrowData",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts
index 87e6dfd9263e2..dd3c8d0bce440 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts
@@ -14,8 +14,8 @@ export interface IResizeGroupProps extends React.HTMLAttributes<ResizeGroup | HT
   componentRef?: (component: IResizeGroup) => void;
 
   /**
-   * Initial data to be passed to the onRenderData function. This data should represent what will be passed to the
-   * render function when the parent container of the ResizeGroup is at it's maximum supported width. A cacheKey property
+   * Initial data to be passed to the onRenderData function. When there is no onGrowData provided, this data should represent what should
+   * be passed to the render function when the parent container of the ResizeGroup is at it's maximum supported width. A cacheKey property
    * may optionally be included as part of the data. Two data objects with the same cacheKey will be assumed to take up the
    * same width and will prevent measurements. The type of cacheKey is a string.
   */
@@ -34,6 +34,13 @@ export interface IResizeGroupProps extends React.HTMLAttributes<ResizeGroup | HT
   */
   onReduceData: (prevData: any) => any;
 
+  /**
+   * Function to be performed on the data in order to increase its width. It is called in scenarios where the
+   * container has more room than the previous render and we may be able to fit more content. If there are no more
+   * scaling operations to perform on teh data, it should return undefined to prevent an infinite render loop.
+  */
+  onGrowData?: (prevData: any) => any;
+
   /**
    * Function to be called every time data is rendered. It provides the data that was actually rendered.
    * A use case would be adding telemetry when a particular control is shown in an overflow well or
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
index 138cd6e28e2ba..9caf060bb0271 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
@@ -55,10 +55,11 @@ describe('ResizeGroup', () => {
       expect(result).to.equal(undefined);
       expect(getMeasuredElementWidthStub.callCount).to.equal(0);
     });
+
     it('sets the renderedData when the contents fit', () => {
       const dataToMeasure = { foo: 'bar' };
       const resizeGroupProps = getRequiredResizeGroupProps();
-      const resizeGroupState: IResizeGroupState = { dataToMeasure };
+      const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'shrink' };
       const getNextResizeGroupState = getNextResizeGroupStateProvider();
       const getMeasuredElementWidthStub = sinon.stub();
       getMeasuredElementWidthStub.returns(25);
@@ -72,13 +73,15 @@ describe('ResizeGroup', () => {
         renderedData: dataToMeasure,
         measureContainer: false,
         dataToMeasure: undefined,
+        resizeDirection: undefined
       });
       expect(getMeasuredElementWidthStub.callCount).to.equal(1);
     });
+
     it('calls onReduceData and sets the next measuredData when contents do not fit', () => {
       const dataToMeasure = { index: 5 };
       const resizeGroupProps = getRequiredResizeGroupProps();
-      const resizeGroupState: IResizeGroupState = { dataToMeasure };
+      const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'shrink' };
       resizeGroupProps.onReduceData.returns({ index: 4 });
       const getNextResizeGroupState = getNextResizeGroupStateProvider();
       const getMeasuredElementWidthStub = sinon.stub();
@@ -92,10 +95,12 @@ describe('ResizeGroup', () => {
       expect(result).to.deep.equal({
         measureContainer: false,
         dataToMeasure: { index: 4 },
+        resizeDirection: 'shrink'
       });
       expect(getMeasuredElementWidthStub.callCount).to.equal(1);
     });
-    it('does not call getmeasuredElementBounds when the data has already been cached', () => {
+
+    it('does not call getMeasuredElementBounds when the data has already been cached', () => {
       const dataToMeasure = { index: 5, cacheKey: 'foo' };
 
       let measurementCache = getMeasurementCache();
@@ -103,7 +108,7 @@ describe('ResizeGroup', () => {
       const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache);
 
       const resizeGroupProps = getRequiredResizeGroupProps();
-      const resizeGroupState: IResizeGroupState = { dataToMeasure };
+      const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'shrink' };
       const measuredElementWidthStub = sinon.stub();
 
       let result = getNextResizeGroupState(resizeGroupProps,
@@ -115,6 +120,7 @@ describe('ResizeGroup', () => {
         renderedData: dataToMeasure,
         measureContainer: false,
         dataToMeasure: undefined,
+        resizeDirection: undefined
       });
       expect(measuredElementWidthStub.callCount).to.equal(0);
     });
@@ -134,7 +140,7 @@ describe('ResizeGroup', () => {
       resizeGroupProps.onReduceData.onFirstCall().returns(dataArray[1]);
       resizeGroupProps.onReduceData.onSecondCall().returns(dataArray[2]);
 
-      const resizeGroupState: IResizeGroupState = { dataToMeasure: dataArray[0] };
+      const resizeGroupState: IResizeGroupState = { dataToMeasure: dataArray[0], resizeDirection: 'shrink' };
       const measuredElementWidthStub = sinon.stub();
 
       let result = getNextResizeGroupState(resizeGroupProps,
@@ -146,11 +152,12 @@ describe('ResizeGroup', () => {
         renderedData: dataArray[2],
         measureContainer: false,
         dataToMeasure: undefined,
+        resizeDirection: undefined
       });
       expect(measuredElementWidthStub.callCount).to.equal(0);
     });
 
-    it('sets dataToMeasure when the current data is in the cache but the onReduceData is not in the cache', () => {
+    it('sets dataToMeasure when the current data is in the cache but the onReduceData result is not in the cache', () => {
       const dataArray = [{ cacheKey: '5' },
       { cacheKey: '4' }];
 
@@ -161,7 +168,7 @@ describe('ResizeGroup', () => {
       const resizeGroupProps = getRequiredResizeGroupProps();
       resizeGroupProps.onReduceData.onFirstCall().returns(dataArray[1]);
 
-      const resizeGroupState: IResizeGroupState = { dataToMeasure: dataArray[0] };
+      const resizeGroupState: IResizeGroupState = { dataToMeasure: dataArray[0], resizeDirection: 'shrink' };
       const measuredElementWidthStub = sinon.stub();
 
       let result = getNextResizeGroupState(resizeGroupProps,
@@ -172,6 +179,7 @@ describe('ResizeGroup', () => {
       expect(result).to.deep.equal({
         dataToMeasure: dataArray[1],
         measureContainer: false,
+        resizeDirection: 'shrink'
       });
       expect(measuredElementWidthStub.callCount).to.equal(0);
     });
@@ -180,7 +188,7 @@ describe('ResizeGroup', () => {
       const dataToMeasure = { index: 5 };
       const resizeGroupProps = getRequiredResizeGroupProps();
 
-      const resizeGroupState: IResizeGroupState = { dataToMeasure };
+      const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'shrink' };
       resizeGroupProps.onReduceData.returns(undefined);
 
       const getNextResizeGroupState = getNextResizeGroupStateProvider();
@@ -196,7 +204,8 @@ describe('ResizeGroup', () => {
       expect(result).to.deep.equal({
         dataToMeasure: undefined,
         renderedData: dataToMeasure,
-        measureContainer: false
+        measureContainer: false,
+        resizeDirection: undefined
       });
       expect(getMeasuredElementWidthStub.callCount).to.equal(1);
     });
@@ -214,7 +223,7 @@ describe('ResizeGroup', () => {
       resizeGroupProps.onReduceData.onFirstCall().returns(dataArray[1]);
       resizeGroupProps.onReduceData.onSecondCall().returns(undefined);
 
-      const resizeGroupState: IResizeGroupState = { dataToMeasure: dataArray[0] };
+      const resizeGroupState: IResizeGroupState = { dataToMeasure: dataArray[0], resizeDirection: 'shrink' };
       const measuredElementWidthStub = sinon.stub();
 
       let result = getNextResizeGroupState(resizeGroupProps,
@@ -225,7 +234,8 @@ describe('ResizeGroup', () => {
       expect(result).to.deep.equal({
         dataToMeasure: undefined,
         renderedData: dataArray[1],
-        measureContainer: false
+        measureContainer: false,
+        resizeDirection: undefined,
       });
       expect(measuredElementWidthStub.callCount).to.equal(0);
     });
@@ -233,7 +243,7 @@ describe('ResizeGroup', () => {
     it('does not crash when the container size is set and there is no dataToMeasure', () => {
       const dataToMeasure = { foo: 'bar' };
       const resizeGroupProps = getRequiredResizeGroupProps();
-      const resizeGroupState: IResizeGroupState = { dataToMeasure };
+      const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'shrink', };
       const getNextResizeGroupState = getNextResizeGroupStateProvider();
       const getMeasuredElementWidthStub = sinon.stub();
 
@@ -253,7 +263,6 @@ describe('ResizeGroup', () => {
       const reducedWidth = 40;
       const renderedData = { foo: 'bar' };
       const resizeGroupProps = getRequiredResizeGroupProps();
-      const resizeGroupState: IResizeGroupState = { renderedData };
       const getNextResizeGroupState = getNextResizeGroupStateProvider();
       const getMeasuredElementWidthStub = sinon.stub();
 
@@ -278,17 +287,17 @@ describe('ResizeGroup', () => {
       expect(result).to.deep.equal({
         renderedData: renderedData,
         dataToMeasure: renderedData,
-        measureContainer: false
+        measureContainer: false,
+        resizeDirection: 'shrink'
       });
       expect(getMeasuredElementWidthStub.callCount).to.equal(0);
     });
 
-    it('starts from the beginning when the container width increases', () => {
+    it('starts from the beginning when the container width increases and there is no onGrowData', () => {
       const initialWidth = 50;
       const increasedWidth = 60;
       const renderedData = { foo: 'bar' };
       const resizeGroupProps = { ...getRequiredResizeGroupProps(), data: { foo: 'initialData' } };
-      const resizeGroupState: IResizeGroupState = { renderedData };
       const getNextResizeGroupState = getNextResizeGroupStateProvider();
       const getMeasuredElementWidthStub = sinon.stub();
 
@@ -311,9 +320,251 @@ describe('ResizeGroup', () => {
       expect(result).to.deep.equal({
         renderedData: renderedData,
         dataToMeasure: resizeGroupProps.data,
+        resizeDirection: 'shrink',
+        measureContainer: false
+      });
+      expect(getMeasuredElementWidthStub.callCount).to.equal(0);
+    });
+
+    it('renders contents when the resizeDirection is grow, there is no onGrowData, and the contents fit', () => {
+      const dataToMeasure = { foo: 'bar' };
+      const resizeGroupProps = getRequiredResizeGroupProps();
+      const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'grow' };
+      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getMeasuredElementWidthStub = sinon.stub();
+      getMeasuredElementWidthStub.returns(25);
+
+      let result = getNextResizeGroupState(resizeGroupProps,
+        resizeGroupState,
+        getMeasuredElementWidthStub,
+        50);
+
+      expect(result).to.deep.equal({
+        renderedData: dataToMeasure,
+        measureContainer: false,
+        dataToMeasure: undefined,
+        resizeDirection: undefined
+      });
+      expect(getMeasuredElementWidthStub.callCount).to.equal(1);
+    });
+
+    it('sets the resize direction to shrink when the resizeDirection is grow, contents do not fit, and there is no onGrowData', () => {
+      const dataToMeasure = { index: 8 };
+      const resizeGroupProps = getRequiredResizeGroupProps();
+      resizeGroupProps.onReduceData.returns({ index: 7 });
+      const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'grow' };
+      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getMeasuredElementWidthStub = sinon.stub();
+      getMeasuredElementWidthStub.returns(100);
+
+      let result = getNextResizeGroupState(resizeGroupProps,
+        resizeGroupState,
+        getMeasuredElementWidthStub,
+        72);
+
+      expect(result).to.deep.equal({
+        measureContainer: false,
+        dataToMeasure: { index: 7 },
+        resizeDirection: 'shrink'
+      });
+      expect(getMeasuredElementWidthStub.callCount).to.equal(1);
+      expect(resizeGroupProps.onReduceData.callCount).to.equal(1);
+    });
+
+    it('measures the next state when the resizeDirection is grow and the dataToMeasure fits', () => {
+      const dataToMeasure = { index: 1 };
+      const onGrowData = sinon.stub();
+      onGrowData.returns({ index: 2 });
+      const resizeGroupProps = { ...getRequiredResizeGroupProps(), onGrowData };
+      const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'grow' };
+      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getMeasuredElementWidthStub = sinon.stub();
+      getMeasuredElementWidthStub.returns(25);
+
+      let result = getNextResizeGroupState(resizeGroupProps,
+        resizeGroupState,
+        getMeasuredElementWidthStub,
+        50);
+
+      expect(result).to.deep.equal({
+        measureContainer: false,
+        dataToMeasure: { index: 2 },
+        resizeDirection: 'grow'
+      });
+      expect(getMeasuredElementWidthStub.callCount).to.equal(1);
+      expect(onGrowData.callCount).to.equal(1);
+    });
+
+    it('sets the resizeDirection to shrink after determining contents do not fit when the resize direction is grow', () => {
+      const dataToMeasure = { index: 1 };
+      const onGrowData = sinon.stub();
+      const resizeGroupProps = { ...getRequiredResizeGroupProps(), onGrowData };
+      const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'grow' };
+      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getMeasuredElementWidthStub = sinon.stub();
+      getMeasuredElementWidthStub.returns(75);
+
+      let result = getNextResizeGroupState(resizeGroupProps,
+        resizeGroupState,
+        getMeasuredElementWidthStub,
+        40);
+
+      expect(result).to.deep.equal({
+        measureContainer: false,
+        dataToMeasure,
+        resizeDirection: 'shrink'
+      });
+      expect(getMeasuredElementWidthStub.callCount).to.equal(1);
+      expect(onGrowData.callCount).to.equal(0);
+      expect(resizeGroupProps.onReduceData.callCount).to.equal(0);
+    });
+
+    it('renders the last measured contents when onGrowData returns undefined', () => {
+      const dataToMeasure = { index: 1 };
+      const onGrowData = sinon.stub();
+      onGrowData.returns(undefined);
+      const resizeGroupProps = { ...getRequiredResizeGroupProps(), onGrowData };
+      const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'grow' };
+      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getMeasuredElementWidthStub = sinon.stub();
+      getMeasuredElementWidthStub.returns(25);
+
+      let result = getNextResizeGroupState(resizeGroupProps,
+        resizeGroupState,
+        getMeasuredElementWidthStub,
+        40);
+
+      expect(result).to.deep.equal({
+        measureContainer: false,
+        dataToMeasure: undefined,
+        renderedData: dataToMeasure,
+        resizeDirection: undefined
+      });
+      expect(getMeasuredElementWidthStub.callCount).to.equal(1);
+      expect(onGrowData.callCount).to.equal(1);
+      expect(resizeGroupProps.onReduceData.callCount).to.equal(0);
+    });
+
+    it('calls onGrowData when the container width increases and onGrowData is provided', () => {
+      const initialWidth = 50;
+      const increasedWidth = 60;
+      const renderedData = { index: 3 };
+      const onGrowData = sinon.stub();
+      onGrowData.returns({ index: 4 });
+      const resizeGroupProps = { ...getRequiredResizeGroupProps(), data: { foo: 'initialData' }, onGrowData };
+      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getMeasuredElementWidthStub = sinon.stub();
+
+      // Set the initial window width
+      getNextResizeGroupState(resizeGroupProps,
+        {},
+        undefined,
+        initialWidth);
+
+      // Pass in a state that reflects some rendered data
+      let currentState = {
+        renderedData: renderedData
+      };
+
+      let result = getNextResizeGroupState(resizeGroupProps,
+        currentState,
+        getMeasuredElementWidthStub,
+        increasedWidth);
+
+      expect(result).to.deep.equal({
+        renderedData: renderedData,
+        dataToMeasure: { index: 4 },
+        resizeDirection: 'grow',
         measureContainer: false
       });
       expect(getMeasuredElementWidthStub.callCount).to.equal(0);
+      expect(onGrowData.callCount).to.equal(1);
+    });
+
+    it('does not call getMeasuredElementBounds when the data has already been cached in the grow resizeDirection', () => {
+      const dataToMeasure = { index: 5, cacheKey: 'foo' };
+
+      const measurementCache = getMeasurementCache();
+      measurementCache.addMeasurementToCache(dataToMeasure, 40);
+      const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache);
+
+      const onGrowData = sinon.stub();
+      const resizeGroupProps = { ...getRequiredResizeGroupProps(), onGrowData };
+      const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'grow' };
+      const measuredElementWidthStub = sinon.stub();
+
+      let result = getNextResizeGroupState(resizeGroupProps,
+        resizeGroupState,
+        measuredElementWidthStub,
+        100);
+
+      expect(result).to.deep.equal({
+        renderedData: dataToMeasure,
+        measureContainer: false,
+        dataToMeasure: undefined,
+        resizeDirection: undefined
+      });
+      expect(measuredElementWidthStub.callCount).to.equal(0);
+    });
+
+    it('calls onGrowData multiple times when everything is in the cache in the grow resizeDirection', () => {
+      const dataArray = [{ cacheKey: '5' },
+      { cacheKey: '6' },
+      { cacheKey: '7' }];
+
+      const measurementCache = getMeasurementCache();
+      measurementCache.addMeasurementToCache(dataArray[0], 50);
+      measurementCache.addMeasurementToCache(dataArray[1], 70);
+      measurementCache.addMeasurementToCache(dataArray[2], 150);
+      const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache);
+
+      const onGrowData = sinon.stub();
+      onGrowData.onFirstCall().returns(dataArray[1]);
+      onGrowData.onSecondCall().returns(dataArray[2]);
+      const resizeGroupProps = { ...getRequiredResizeGroupProps(), onGrowData };
+
+      const resizeGroupState: IResizeGroupState = { dataToMeasure: dataArray[0], resizeDirection: 'grow' };
+      const measuredElementWidthStub = sinon.stub();
+
+      let result = getNextResizeGroupState(resizeGroupProps,
+        resizeGroupState,
+        measuredElementWidthStub,
+        100);
+
+      expect(result).to.deep.equal({
+        measureContainer: false,
+        dataToMeasure: dataArray[2],
+        resizeDirection: 'shrink'
+      });
+      expect(measuredElementWidthStub.callCount).to.equal(0);
+    });
+
+    it('sets dataToMeasure when the current data is in the cache but the onGrowData result is not in the cache in the grow resizeDirection', () => {
+      const dataArray = [{ cacheKey: '5' },
+      { cacheKey: '6' }];
+
+      let measurementCache = getMeasurementCache();
+      measurementCache.addMeasurementToCache(dataArray[0], 40);
+      const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache);
+
+      const onGrowData = sinon.stub();
+      onGrowData.onFirstCall().returns(dataArray[1]);
+      const resizeGroupProps = { ...getRequiredResizeGroupProps(), onGrowData };
+
+      const resizeGroupState: IResizeGroupState = { dataToMeasure: dataArray[0], resizeDirection: 'grow' };
+      const measuredElementWidthStub = sinon.stub();
+
+      let result = getNextResizeGroupState(resizeGroupProps,
+        resizeGroupState,
+        measuredElementWidthStub,
+        100);
+
+      expect(result).to.deep.equal({
+        dataToMeasure: dataArray[1],
+        measureContainer: false,
+        resizeDirection: 'grow'
+      });
+      expect(measuredElementWidthStub.callCount).to.equal(0);
     });
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index 79dee7d4c4500..f8c8f35ec2ba2 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -25,6 +25,15 @@ export interface IResizeGroupState {
    * be remeasured.
    */
   measureContainer?: boolean;
+
+  /**
+   * Are we resizing to accommodate having more or less available space?
+   * The 'grow' direction is when the container may have more room than the last render,
+   * such as when a window resize occurs. This means we will try to fit more content in the window.
+   * The 'shrink' direction is when the contents don't fit in the container and we need
+   * to find a transformation of the data that makes everything fit.
+   */
+  resizeDirection?: 'grow' | 'shrink';
 }
 
 /**
@@ -106,6 +115,7 @@ export const getNextResizeGroupStateProvider = (measurementCache = getMeasuremen
       if (nextMeasuredData === undefined) {
         return {
           renderedData: dataToMeasure,
+          resizeDirection: undefined,
           dataToMeasure: undefined
         };
       }
@@ -115,7 +125,8 @@ export const getNextResizeGroupStateProvider = (measurementCache = getMeasuremen
       // If the measurement isn't in the cache, we need to rerender with some data in a hidden div
       if (measuredWidth === undefined) {
         return {
-          dataToMeasure: nextMeasuredData
+          dataToMeasure: nextMeasuredData,
+          resizeDirection: 'shrink'
         };
       }
 
@@ -124,24 +135,81 @@ export const getNextResizeGroupStateProvider = (measurementCache = getMeasuremen
 
     return {
       renderedData: dataToMeasure,
+      resizeDirection: undefined,
       dataToMeasure: undefined
     };
   }
 
+  /**
+   * This function should be called when the state changes in a manner that might allow for more content to fit
+   * on the screen, such as the window width growing.
+   * @param data - The initial data point to start measuring.
+   * @param onGrowData - Function that transforms the data into something that may take up more space when rendering.
+   * @param getElementToMeasureWidth - A function that returns the measurement of the rendered data. Only called when the measurement
+   * is not in the cache.
+   */
+  function _growDataUntilItDoesNotFit(data: any,
+    onGrowData: (prevData: any) => any,
+    getElementToMeasureWidth: () => number): IResizeGroupState {
+    let dataToMeasure = data;
+    let measuredWidth = _getMeasuredWidth(data, getElementToMeasureWidth);
+
+    while (measuredWidth < _containerWidth) {
+      let nextMeasuredData = onGrowData(dataToMeasure);
+
+      // We don't want to get stuck in an infinite render loop when there are no more
+      // scaling steps, so implementations of onGrowData should return undefined when
+      // there are no more scaling states to apply.
+      if (nextMeasuredData === undefined) {
+        return {
+          renderedData: dataToMeasure,
+          resizeDirection: undefined,
+          dataToMeasure: undefined
+        };
+      }
+
+      measuredWidth = _measurementCache.getCachedMeasurement(nextMeasuredData);
+      // If the measurement isn't in the cache, we need to rerender with some data in a hidden div
+      if (measuredWidth === undefined) {
+        return {
+          dataToMeasure: nextMeasuredData
+        };
+      }
+
+      dataToMeasure = nextMeasuredData;
+    }
+
+    // Once the loop is done, we should now shrink until the contents fit.
+    return {
+      dataToMeasure,
+      resizeDirection: 'shrink'
+    };
+  }
+
   /**
    * Handles an update to the container width. Should only be called when we knew the previous container width.
    * @param newWidth - The new width of the container.
    * @param fullWidthData - The initial data passed in as a prop to resizeGroup.
    * @param renderedData - The data that was rendered prior to the container size changing.
+   * @param onGrowData - Set to true if the Resize group has an onGrowData function.
    */
-  function _updateContainerWidth(newWidth: number, fullWidthData: any, renderedData: any): IResizeGroupState {
+  function _updateContainerWidth(newWidth: number, fullWidthData: any, renderedData: any, onGrowData?: (prevData: any) => any): IResizeGroupState {
     let nextState: IResizeGroupState;
     if (newWidth > _containerWidth) {
-      nextState = {
-        dataToMeasure: fullWidthData
-      };
+      if (onGrowData) {
+        nextState = {
+          resizeDirection: 'grow',
+          dataToMeasure: onGrowData(renderedData)
+        };
+      } else {
+        nextState = {
+          resizeDirection: 'shrink',
+          dataToMeasure: fullWidthData
+        };
+      }
     } else {
       nextState = {
+        resizeDirection: 'shrink',
         dataToMeasure: renderedData
       };
     }
@@ -161,7 +229,7 @@ export const getNextResizeGroupStateProvider = (measurementCache = getMeasuremen
     if (newContainerWidth) {
       // If we know what the last container size was and we rendered data at that width, we can do an optimized render
       if (_containerWidth && currentState.renderedData) {
-        return { ...currentState, ..._updateContainerWidth(newContainerWidth, props.data, currentState.renderedData) };
+        return { ...currentState, ..._updateContainerWidth(newContainerWidth, props.data, currentState.renderedData, props.onGrowData) };
       }
 
       // If we are just setting the container width for the first time, we can't do any optimizations
@@ -174,10 +242,17 @@ export const getNextResizeGroupStateProvider = (measurementCache = getMeasuremen
     };
 
     if (currentState.dataToMeasure) {
-      nextState = {
-        ...nextState,
-        ..._shrinkContentsUntilTheyFit(currentState.dataToMeasure, props.onReduceData, getElementToMeasureWidth)
-      };
+      if (currentState.resizeDirection === 'grow' && props.onGrowData) {
+        nextState = {
+          ...nextState,
+          ..._growDataUntilItDoesNotFit(currentState.dataToMeasure, props.onGrowData, getElementToMeasureWidth)
+        };
+      } else {
+        nextState = {
+          ...nextState,
+          ..._shrinkContentsUntilTheyFit(currentState.dataToMeasure, props.onReduceData, getElementToMeasureWidth)
+        };
+      }
     }
 
     return nextState;
@@ -193,6 +268,7 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
     super(props);
     this.state = {
       dataToMeasure: { ...this.props.data },
+      resizeDirection: 'grow',
       measureContainer: true,
     };
   }
@@ -222,6 +298,7 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
   public componentWillReceiveProps(nextProps: IResizeGroupProps) {
     this.setState({
       dataToMeasure: { ...nextProps.data },
+      resizeDirection: 'grow',
       renderedData: undefined,
       measureContainer: true // Receiving new props means the parent might rerender and the root width might change
     });
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
index 21063932a4215..c5d395e5d0cc1 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
@@ -70,7 +70,10 @@ export class ResizeGroupPage extends React.Component<any, any> {
               </li>
               <li>
                 Include a cacheKey in your data to improve performance. Two objects with the same cacheKey are assumed to have the same
-                width, so the ResizeGroup will only store one measurement per resize group.g
+                width, so the ResizeGroup will only store one measurement per resize group.
+               </li>
+              <li>
+                Implement onGrowData for improved performance when the container for the resize group increases in size.
                </li>
             </ul>
           </div>
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
index 8cbe995c0ed61..02e2c2c009b1b 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
@@ -49,6 +49,7 @@ export interface IResizeGroupOverflowSetExampleState {
   numberOfItems: number;
   buttonsChecked: boolean;
   cachingEnabled: boolean;
+  onGrowDataEnabled: boolean;
 }
 
 function computeCacheKey(primaryControls: IContextualMenuItem[]): string {
@@ -63,31 +64,20 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<{}, IResizeGrou
       short: false,
       buttonsChecked: false,
       cachingEnabled: false,
+      onGrowDataEnabled: false,
       numberOfItems: 20
     };
   }
 
   public render() {
-    let { numberOfItems, cachingEnabled, buttonsChecked, short } = this.state;
+    let { numberOfItems, cachingEnabled, buttonsChecked, short, onGrowDataEnabled } = this.state;
     let dataToRender = generateData(numberOfItems, cachingEnabled, buttonsChecked);
     return (
       <div className={ short ? styles.resizeIsShort : 'notResized' }>
         <ResizeGroup
           data={ dataToRender }
-          onReduceData={ (currentData) => {
-            if (currentData.primary.length === 0) {
-              return undefined;
-            }
-
-            let overflow = [...currentData.primary.slice(-1), ...currentData.overflow];
-            let primary = currentData.primary.slice(0, -1);
-
-            let cacheKey = undefined;
-            if (cachingEnabled) {
-              cacheKey = computeCacheKey(primary);
-            }
-            return { primary, overflow, cacheKey };
-          } }
+          onReduceData={ this.onReduceData }
+          onGrowData={ onGrowDataEnabled ? this.onGrowData : undefined }
           onRenderData={ (data) => {
             return (
               <OverflowSet
@@ -116,6 +106,7 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<{}, IResizeGrou
         />
         <div className={ styles.settingsGroup }>
           <Checkbox label='Enable caching' onChange={ this.onCachingEnabledChanged } checked={ cachingEnabled } />
+          <Checkbox label='Set onGrowData' onChange={ this.onGrowDataEnabledChanged } checked={ onGrowDataEnabled } />
           <Checkbox label='Buttons checked' onChange={ this.onButtonsCheckedChanged } checked={ buttonsChecked } />
           <div className={ styles.itemCountDropdown } >
             <Dropdown
@@ -136,11 +127,48 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<{}, IResizeGrou
     );
   }
 
+  @autobind
+  private onReduceData(currentData: any): any {
+    if (currentData.primary.length === 0) {
+      return undefined;
+    }
+
+    let overflow = [...currentData.primary.slice(-1), ...currentData.overflow];
+    let primary = currentData.primary.slice(0, -1);
+
+    let cacheKey = undefined;
+    if (this.state.cachingEnabled) {
+      cacheKey = computeCacheKey(primary);
+    }
+    return { primary, overflow, cacheKey };
+  }
+
+  @autobind
+  private onGrowData(currentData: any): any {
+    if (currentData.overflow.length === 0) {
+      return undefined;
+    }
+
+    let overflow = currentData.overflow.slice(1);
+    let primary = [...currentData.primary, ...currentData.overflow.slice(0, 1)];
+
+    let cacheKey = undefined;
+    if (this.state.cachingEnabled) {
+      cacheKey = computeCacheKey(primary);
+    }
+    return { primary, overflow, cacheKey };
+  }
+
   @autobind
   private onCachingEnabledChanged(_: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean) {
     this.setState({ cachingEnabled: checked });
   }
 
+  @autobind
+  private onGrowDataEnabledChanged(_: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean) {
+    this.setState({ onGrowDataEnabled: checked });
+  }
+
   @autobind
   private onButtonsCheckedChanged(_: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean) {
     this.setState({ buttonsChecked: checked });

From 3d593e67d11ce99ef269ce5a7e207aa9399ddd48 Mon Sep 17 00:00:00 2001
From: petdun2519 <peterdunlop2519@gmail.com>
Date: Fri, 21 Jul 2017 12:43:25 -0700
Subject: [PATCH 0296/1641] Dropdown: Updated keydown handler on dropdown to
 respond to normal items (#2272)

* making new branch for PR cleanness

* Update users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
---
 ...-fixDropdownKeyboardBehavior_2017-07-18-19-47.json | 11 +++++++++++
 ...-fixDropdownKeyboardBehavior_2017-07-18-19-47.json | 11 +++++++++++
 ...-fixDropdownKeyboardBehavior_2017-07-18-19-47.json | 11 +++++++++++
 ...-fixDropdownKeyboardBehavior_2017-07-18-19-47.json | 11 +++++++++++
 ...-fixDropdownKeyboardBehavior_2017-07-18-19-47.json | 11 +++++++++++
 .../src/components/Dropdown/Dropdown.tsx              |  2 +-
 6 files changed, 56 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/example-app-base/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
 create mode 100644 common/changes/@uifabric/fabric-website/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
 create mode 100644 common/changes/@uifabric/styling/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
 create mode 100644 common/changes/@uifabric/utilities/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
 create mode 100644 common/changes/office-ui-fabric-react/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json

diff --git a/common/changes/@uifabric/example-app-base/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json b/common/changes/@uifabric/example-app-base/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
new file mode 100644
index 0000000000000..344f9222761bf
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "peterdunlop2519@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json b/common/changes/@uifabric/fabric-website/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
new file mode 100644
index 0000000000000..e641b8932ad45
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "peterdunlop2519@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json b/common/changes/@uifabric/styling/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
new file mode 100644
index 0000000000000..51e4e878a0f01
--- /dev/null
+++ b/common/changes/@uifabric/styling/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "peterdunlop2519@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json b/common/changes/@uifabric/utilities/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
new file mode 100644
index 0000000000000..6cb6c52a405f3
--- /dev/null
+++ b/common/changes/@uifabric/utilities/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "peterdunlop2519@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json b/common/changes/office-ui-fabric-react/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
new file mode 100644
index 0000000000000..d489517009d99
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: Updated keydown handler to respond correctly to normal dropdown items",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "peterdunlop2519@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index cac5de0df9210..0d83b36875701 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -235,7 +235,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     }
     let stepCounter = 0;
     // If current index is a header or divider, increment by step
-    while (options[index].itemType !== DropdownMenuItemType.Normal) {
+    while (options[index].itemType === DropdownMenuItemType.Header || options[index].itemType === DropdownMenuItemType.Divider) {
       // If stepCounter exceeds length of options, then return selectedIndex (-1)
       if (stepCounter >= options.length) {
         return selectedIndex;

From 5c9d10ee2cb1e4ccc82d5f03dccb02bf1276a23e Mon Sep 17 00:00:00 2001
From: Joe Martella <martellaj@live.com>
Date: Fri, 21 Jul 2017 14:21:43 -0700
Subject: [PATCH 0297/1641] [PeoplePicker] Accessibility fixes (#2286)

* Adds "removeButtonAriaLabel" to BasePicker props

* Adds status that suggestions are available in picker

* Adds change file

* Extracts new prop with destructuring

* Removes unneccessary default value
---
 .../joem-picker-a11y_2017-07-21-20-24.json            | 11 +++++++++++
 .../src/components/pickers/BasePicker.Props.ts        |  9 +++++++++
 .../src/components/pickers/BasePicker.tsx             |  5 +++--
 .../PeoplePickerItems/SelectedItemDefault.tsx         |  4 +++-
 .../PeoplePickerItems/SelectedItemWithMenu.tsx        |  4 +++-
 .../examples/PeoplePicker.Types.Example.tsx           |  4 +++-
 .../src/components/pickers/PickerItem.Props.ts        |  1 +
 .../pickers/Suggestions/Suggestions.Props.ts          |  4 ++++
 .../components/pickers/Suggestions/Suggestions.scss   | 11 +++++++++++
 .../components/pickers/Suggestions/Suggestions.tsx    |  7 +++++++
 10 files changed, 55 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/joem-picker-a11y_2017-07-21-20-24.json

diff --git a/common/changes/office-ui-fabric-react/joem-picker-a11y_2017-07-21-20-24.json b/common/changes/office-ui-fabric-react/joem-picker-a11y_2017-07-21-20-24.json
new file mode 100644
index 0000000000000..e41283e18ec82
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/joem-picker-a11y_2017-07-21-20-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Accessibility fixes for PeoplePicker",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joem@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
index 0fec49eba42e7..7ea9db0c283d3 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
@@ -77,6 +77,11 @@ export interface IBasePickerProps<T> extends React.Props<any> {
    * Function that specifies how arbitrary text entered into the well is handled.
    */
   createGenericItem?: (input: string, ValidationState: ValidationState) => ISuggestionModel<T>;
+  /**
+   * Aria label for the "X" button in the selected item component.
+   * @default ''
+   */
+  removeButtonAriaLabel?: string;
 }
 
 export interface IBasePickerSuggestionsProps {
@@ -136,6 +141,10 @@ export interface IBasePickerSuggestionsProps {
    * Indicates whether to show a button with each suggestion to remove that suggestion.
    */
   showRemoveButtons?: boolean;
+  /**
+   * Screen reader message to read when there are suggestions available.
+   */
+  suggestionsAvailableAlertText?: string;
 }
 
 export enum ValidationState {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index c96ffde07e58a..5807ea4feac6e 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -169,7 +169,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   }
 
   protected renderItems(): JSX.Element[] {
-    let { disabled } = this.props;
+    let { disabled, removeButtonAriaLabel } = this.props;
     let onRenderItem = this.props.onRenderItem as (props: IPickerItemProps<T>) => JSX.Element;
 
     let { items } = this.state;
@@ -180,7 +180,8 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
       selected: this.selection.isIndexSelected(index),
       onRemoveItem: () => this.removeItem(item),
       disabled: disabled,
-      onItemChange: this.onItemChange
+      onItemChange: this.onItemChange,
+      removeButtonAriaLabel: removeButtonAriaLabel
     }));
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
index 8c54f8e6ffaba..aaeb0f2b6035f 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
@@ -14,7 +14,8 @@ export const SelectedItemDefault: (props: IPeoplePickerItemProps) => JSX.Element
     item,
     onRemoveItem,
     index,
-    selected
+    selected,
+    removeButtonAriaLabel
   } = peoplePickerItemProps;
   return (
     <div
@@ -38,6 +39,7 @@ export const SelectedItemDefault: (props: IPeoplePickerItemProps) => JSX.Element
         iconProps={ { iconName: 'Cancel', style: { fontSize: '12px' } } }
         className={ css('ms-PickerItem-removeButton', styles.removeButton) }
         data-is-focusable={ false }
+        ariaLabel={ removeButtonAriaLabel }
       />
     </div >
   );
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
index 6d797b6370c76..f57d309270656 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
@@ -30,7 +30,8 @@ export class SelectedItemWithMenu extends BaseComponent<IPeoplePickerItemWithMen
   public render() {
     let {
       item,
-      onRemoveItem
+      onRemoveItem,
+      removeButtonAriaLabel
     } = this.props;
     return (
       <div data-is-focusable={ true } className={ css('ms-PickerItem-container', styles.itemContainer) }>
@@ -51,6 +52,7 @@ export class SelectedItemWithMenu extends BaseComponent<IPeoplePickerItemWithMen
             <IconButton
               iconProps={ { iconName: 'Cancel' } }
               onClick={ onRemoveItem }
+              ariaLabel={ removeButtonAriaLabel }
             />
           </div>
           { this.state.contextualMenuVisible ? (
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index e662c04317cd9..f10dbc74deaa4 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -34,7 +34,8 @@ const suggestionProps: IBasePickerSuggestionsProps = {
   mostRecentlyUsedHeaderText: 'Suggested Contacts',
   noResultsFoundText: 'No results found',
   loadingText: 'Loading',
-  showRemoveButtons: true
+  showRemoveButtons: true,
+  suggestionsAvailableAlertText: 'Suggestions available'
 };
 
 const limitedSearchAdditionalProps: IBasePickerSuggestionsProps = {
@@ -136,6 +137,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
         key={ 'normal' }
         onRemoveSuggestion={ this._onRemoveSuggestion }
         onValidateInput={ this._validateInput }
+        removeButtonAriaLabel={ 'Remove' }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PickerItem.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/PickerItem.Props.ts
index 5910583e5afe6..3a820116763d5 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PickerItem.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/PickerItem.Props.ts
@@ -11,4 +11,5 @@ export interface IPickerItemProps<T> extends React.HTMLAttributes<HTMLElement> {
    */
   onItemChange?: (item: T, index: number) => void;
   key?: string | number;
+  removeButtonAriaLabel?: string;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts
index 6ddfe094f7bf2..148f3ee1c5d9f 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts
@@ -106,6 +106,10 @@ export interface ISuggestionsProps<T> extends React.Props<any> {
    * Indicates whether to show a button with each suggestion to remove that suggestion.
    */
   showRemoveButtons?: boolean;
+  /**
+   * Screen reader message to read when there are suggestions available.
+   */
+  suggestionsAvailableAlertText?: string;
 }
 
 export interface ISuggestionItemProps<T> {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
index 833b485a75892..8de508748329b 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
@@ -138,4 +138,15 @@
     background: $ms-color-neutralTertiaryAlt;
     color: $ms-color-neutralDark;
   }
+}
+
+.suggestionsAvailable {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0,0,0,0);
+  border: 0;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index 421f10f65db1b..55a1424a031bd 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -88,6 +88,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
       resultsFooter,
       isResultsFooterVisible,
       showRemoveButtons,
+      suggestionsAvailableAlertText
     } = this.props;
 
     let noResults = () => {
@@ -139,6 +140,12 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
               { footerTitle && footerTitle(this.props) }
             </div>) : (null)
         }
+        { (!isLoading && !isSearching && suggestions && suggestions.length > 0 && suggestionsAvailableAlertText) ?
+          (<span
+            role='alert'
+            className={ css('ms-Suggestions-suggestionsAvailable', styles.suggestionsAvailable) }>{ suggestionsAvailableAlertText }
+          </span>) : (null)
+        }
       </div>
     );
   }

From 5933799d69801712dffcf665ac73231a6a2e2357 Mon Sep 17 00:00:00 2001
From: Trevor Gau <trevorsg@gmail.com>
Date: Fri, 21 Jul 2017 18:31:44 -0400
Subject: [PATCH 0298/1641] Fix application of aria properties on BaseButton.
 #2270 (#2275)

* Fix application of aria properties on BaseButton. #2270

* Add aria property tests to Button.
---
 .../2017-07-21-14-26.json                     | 11 +++
 .../src/components/Button/BaseButton.tsx      | 19 ++++-
 .../src/components/Button/Button.test.tsx     | 81 +++++++++++++++++++
 3 files changed, 109 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/2017-07-21-14-26.json

diff --git a/common/changes/office-ui-fabric-react/2017-07-21-14-26.json b/common/changes/office-ui-fabric-react/2017-07-21-14-26.json
new file mode 100644
index 0000000000000..f813d2b97d936
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/2017-07-21-14-26.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix application of aria properties on BaseButton.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "trgau@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 470a0a6ec1399..3193563a103a3 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -84,6 +84,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       href,
       iconProps,
       styles,
+      text,
       checked,
       variantClassName
          } = this.props;
@@ -111,10 +112,10 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       [
         'disabled' // Let disabled buttons be focused and styled as disabled.
       ]);
+
     // Check for ariaDescription, description or aria-describedby in the native props to determine source of aria-describedby
     // otherwise default to null.
     let ariaDescribedBy;
-
     if (ariaDescription) {
       ariaDescribedBy = _ariaDescriptionId;
     } else if (description) {
@@ -125,6 +126,20 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       ariaDescribedBy = null;
     }
 
+    // If an explicit ariaLabel is given, use that as the label and we're done.
+    // If an explicit aria-labelledby is given, use that and we're done.
+    // If any kind of description is given (which will end up as an aria-describedby attribute),
+    // set the labelledby element. Otherwise, the button is labeled implicitly by the descendent
+    // text on the button (if it exists). Never set both aria-label and aria-labelledby.
+    let ariaLabelledBy = null;
+    if (!ariaLabel) {
+      if ((nativeProps as any)['aria-labelledby']) {
+        ariaLabelledBy = (nativeProps as any)['aria-labelledby'];
+      } else if (ariaDescribedBy) {
+        ariaLabelledBy = text ? _labelId : null;
+      }
+    }
+
     const tabIndex = (this.props.tabIndex === undefined) ? (this._isSplitButton ? -1 : 0) : this.props.tabIndex;
 
     const buttonProps = assign(
@@ -135,7 +150,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         'disabled': disabled,
         tabIndex: tabIndex,
         'aria-label': ariaLabel,
-        'aria-labelledby': ariaLabel ? null : _labelId,
+        'aria-labelledby': ariaLabelledBy,
         'aria-describedby': ariaDescribedBy,
         'data-is-focusable': ((this.props as any)['data-is-focusable'] === false || disabled) ? false : true,
         'aria-pressed': checked
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
index 3402e3ae6a146..53fd89a7b1ab2 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
@@ -5,7 +5,10 @@ import * as ReactDOM from 'react-dom';
 
 import * as ReactTestUtils from 'react-addons-test-utils';
 import { DefaultButton } from './DefaultButton/DefaultButton';
+import { IconButton } from './IconButton/IconButton';
+import { CompoundButton } from './CompoundButton/CompoundButton';
 import { KeyCodes } from '../../Utilities';
+// import { IconButton } from "src";
 
 let { expect } = chai;
 
@@ -45,6 +48,84 @@ describe('DefaultButton', () => {
     expect(renderedDOM.tagName).equals('A', 'A Button with an href renders as an anchor');
   });
 
+  it('applies the correct aria attributes', () => {
+    let button, renderedDOM;
+    button = ReactTestUtils.renderIntoDocument<any>(
+      <DefaultButton
+        href='http://www.microsoft.com'
+        target='_blank'>
+        Hello
+      </DefaultButton>
+    );
+    renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+    expect(renderedDOM.getAttribute('aria-label') === null);
+    expect(renderedDOM.getAttribute('aria-labelledby') === null);
+    expect(renderedDOM.getAttribute('aria-describedby') === null);
+
+    button = ReactTestUtils.renderIntoDocument<any>(
+      <DefaultButton
+        href='http://www.microsoft.com'
+        target='_blank'
+        aria-label='MyLabel'>
+        Hello
+      </DefaultButton>
+    );
+    renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+    expect(renderedDOM.getAttribute('aria-label') === 'MyLabel');
+    expect(renderedDOM.getAttribute('aria-labelledby') === null);
+    expect(renderedDOM.getAttribute('aria-describedby') === null);
+
+    button = ReactTestUtils.renderIntoDocument<any>(
+      <DefaultButton
+        href='http://www.microsoft.com'
+        target='_blank'
+        aria-labelledby='someid'>
+        Hello
+      </DefaultButton>
+    );
+    renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+    expect(renderedDOM.getAttribute('aria-label') === 'MyLabel');
+    expect(renderedDOM.getAttribute('aria-labelledby') === 'someid');
+    expect(renderedDOM.getAttribute('aria-describedby') === null);
+
+    button = ReactTestUtils.renderIntoDocument<any>(
+      <DefaultButton
+        href='http://www.microsoft.com'
+        target='_blank'
+        ariaDescription='This description is not visible'
+        styles={{screenReaderText: 'some-screenreader-class'}}>
+        Hello
+      </DefaultButton>
+    );
+    renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+    expect(renderedDOM.getAttribute('aria-label') === null);
+    expect(renderedDOM.getAttribute('aria-labelledby') === renderedDOM.querySelector(`.ms-Button-label`).id);
+    expect(renderedDOM.getAttribute('aria-describedby') === renderedDOM.querySelector('.some-screenreader-class').id);
+
+    button = ReactTestUtils.renderIntoDocument<any>(
+      <IconButton
+        iconProps={{ iconName: 'Emoji2' }}
+        ariaDescription='Description on icon button'
+        styles={{screenReaderText: 'some-screenreader-class'}} />
+    );
+    renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+    expect(renderedDOM.getAttribute('aria-label') === null);
+    expect(renderedDOM.getAttribute('aria-labelledby') === null);
+    expect(renderedDOM.getAttribute('aria-describedby') === renderedDOM.querySelector('.some-screenreader-class').id);
+
+    button = ReactTestUtils.renderIntoDocument<any>(
+      <CompoundButton
+        description='Some awesome description'
+        ariaDescription='Description on icon button'>
+        And this is the label
+      </CompoundButton>
+    );
+    renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+    expect(renderedDOM.getAttribute('aria-label') === null);
+    expect(renderedDOM.getAttribute('aria-labelledby') === renderedDOM.querySelector('.ms-Button-label').id);
+    expect(renderedDOM.getAttribute('aria-describedby') === renderedDOM.querySelector('.ms-Button-description').id);
+  });
+
   describe('with menuProps', () => {
     let button: Element;
 

From f24070ef5b3a3173cfde2ee25cdb7b150a668ca7 Mon Sep 17 00:00:00 2001
From: Michael Loughry <miclo@microsoft.com>
Date: Sun, 23 Jul 2017 16:28:30 -0700
Subject: [PATCH 0299/1641] Mirror DirectionalHints in RTL layouts (#2283)

* Mirror DirectionalHint in RTL

* Add change file

* Address PR feedback
---
 ...l-hint-mirror-in-rtl_2017-07-21-19-17.json | 11 +++++
 .../src/components/Callout/Callout.Props.ts   |  8 +++-
 .../ContextualMenu/ContextualMenu.Props.ts    |  6 +++
 .../ContextualMenu/ContextualMenu.tsx         |  2 +
 .../ContextualMenu.Directional.Example.tsx    | 43 ++++++++++++++++++-
 .../src/components/Tooltip/Tooltip.Props.ts   |  6 +++
 .../src/components/Tooltip/Tooltip.tsx        |  4 +-
 .../components/Tooltip/TooltipHost.Props.ts   |  6 +++
 .../src/components/Tooltip/TooltipHost.tsx    |  2 +
 .../src/utilities/positioning.ts              | 38 +++++++++++++++-
 10 files changed, 120 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/directional-hint-mirror-in-rtl_2017-07-21-19-17.json

diff --git a/common/changes/office-ui-fabric-react/directional-hint-mirror-in-rtl_2017-07-21-19-17.json b/common/changes/office-ui-fabric-react/directional-hint-mirror-in-rtl_2017-07-21-19-17.json
new file mode 100644
index 0000000000000..e779011aec9c0
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/directional-hint-mirror-in-rtl_2017-07-21-19-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Callout/ContextualMenu/Tooltip: we now mirror DirectionalHints in RTL layouts by default. To override this behavior, specify `directionalHintForRtl`",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts b/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
index 8d4c841174ac5..3d07c42c77993 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
@@ -4,7 +4,7 @@ import { CalloutContent } from './CalloutContent';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import {
   IPoint,
-  IRectangle
+  IRectangle,
 } from '../../Utilities';
 
 export interface ICallout {
@@ -31,6 +31,12 @@ export interface ICalloutProps extends React.Props<Callout | CalloutContent> {
    */
   directionalHint?: DirectionalHint;
 
+  /**
+   * How the element should be positioned in RTL layouts.
+   * If not specified, a mirror of `directionalHint` will be used instead
+   */
+  directionalHintForRTL?: DirectionalHint;
+
   /**
    * The gap between the Callout and the target
    * @default 0
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
index e465f15dd4cb6..dd2d8390a2a6f 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
@@ -47,6 +47,12 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
    */
   directionalHint?: DirectionalHint;
 
+  /**
+   * How the element should be positioned in RTL layouts.
+   * If not specified, a mirror of `directionalHint` will be used instead
+   */
+  directionalHintForRTL?: DirectionalHint;
+
   /**
    * The gap between the ContextualMenu and the target
    * @default 0
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 38cdf974962a7..9870d01935d86 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -175,6 +175,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       useTargetPoint,
       beakWidth,
       directionalHint,
+      directionalHintForRTL,
       gapSpace,
       coverTarget,
       ariaLabel,
@@ -216,6 +217,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
           isBeakVisible={ isBeakVisible }
           beakWidth={ beakWidth }
           directionalHint={ directionalHint }
+          directionalHintForRTL={ directionalHintForRTL }
           gapSpace={ gapSpace }
           coverTarget={ coverTarget }
           doNotLayer={ doNotLayer }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
index 817e89f9252d8..da10033a85e32 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
@@ -5,12 +5,14 @@ import { ContextualMenu, DirectionalHint, ContextualMenuItemType } from 'office-
 import { Dropdown, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
 import { Slider } from 'office-ui-fabric-react/lib/Slider';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { autobind, getRTL } from 'office-ui-fabric-react/lib/Utilities';
 import './ContextualMenuExample.scss';
 
 export interface IContextualMenuDirectionalExampleState {
   isContextualMenuVisible?: boolean;
   directionalHint?: DirectionalHint;
+  directionalHintForRTL?: DirectionalHint;
+  useDirectionalHintForRtl?: boolean;
   isBeakVisible?: boolean;
   gapSpace?: number;
   beakWidth?: number;
@@ -48,6 +50,8 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
       isContextualMenuVisible: false,
       isBeakVisible: false,
       directionalHint: DirectionalHint.bottomLeftEdge,
+      directionalHintForRTL: DirectionalHint.bottomLeftEdge,
+      useDirectionalHintForRtl: false,
       gapSpace: 0,
       beakWidth: 10,
       edgeFixed: false
@@ -55,7 +59,16 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
   }
 
   public render() {
-    let { isContextualMenuVisible, isBeakVisible, directionalHint, gapSpace, beakWidth, edgeFixed } = this.state;
+    let {
+      beakWidth,
+      directionalHint,
+      directionalHintForRTL,
+      edgeFixed,
+      gapSpace,
+      isBeakVisible,
+      isContextualMenuVisible,
+      useDirectionalHintForRtl
+    } = this.state;
 
     return (
       <div className='ms-ContextualMenuDirectionalExample'>
@@ -80,6 +93,17 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
             selectedKey={ DirectionalHint[directionalHint] }
             options={ DIRECTION_OPTIONS }
             onChanged={ this._onDirectionalChanged } />
+          { getRTL() &&
+            <Checkbox label='Use RTL directional hint' checked={ useDirectionalHintForRtl } onChange={ this._onUseRtlHintChange } />
+          }
+          { getRTL() &&
+            <Dropdown
+              label='Directional hint for RTL'
+              selectedKey={ DirectionalHint[directionalHintForRTL] }
+              options={ DIRECTION_OPTIONS }
+              onChanged={ this._onDirectionalRtlChanged }
+              disabled={ !useDirectionalHintForRtl } />
+          }
         </div>
         <div className='ms-ContextualMenuDirectionalExample-buttonArea' ref='menuButton'>
           <DefaultButton
@@ -92,6 +116,7 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
             target={ this.refs.menuButton }
             isBeakVisible={ isBeakVisible }
             directionalHint={ directionalHint }
+            directionalHintForRTL={ useDirectionalHintForRtl ? directionalHintForRTL : undefined }
             gapSpace={ gapSpace }
             beakWidth={ beakWidth }
             directionalHintFixed={ edgeFixed }
@@ -183,6 +208,13 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
     });
   }
 
+  @autobind
+  private _onUseRtlHintChange(ev: React.FormEvent<HTMLElement>, isVisible: boolean) {
+    this.setState({
+      useDirectionalHintForRtl: isVisible
+    });
+  }
+
   @autobind
   private _onShowMenuClicked() {
     this.setState({
@@ -197,6 +229,13 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
     });
   }
 
+  @autobind
+  private _onDirectionalRtlChanged(option: IDropdownOption) {
+    this.setState({
+      directionalHintForRTL: (DirectionalHint as any)[option.key]
+    });
+  }
+
   @autobind
   private _onGapSlider(value: number) {
     this.setState({
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.Props.ts b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.Props.ts
index 97d95ce2f9390..7a1934fcab13c 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.Props.ts
@@ -49,6 +49,12 @@ export interface ITooltipProps extends React.HTMLAttributes<HTMLDivElement | Too
    * @default DirectionalHint.topCenter
    */
   directionalHint?: DirectionalHint;
+
+  /**
+   * How the element should be positioned in RTL layouts.
+   * If not specified, a mirror of `directionalHint` will be used instead
+   */
+  directionalHintForRTL?: DirectionalHint;
 }
 
 export enum TooltipDelay {
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
index 1c62b89be24c8..c84e5b3316ef8 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
@@ -35,10 +35,11 @@ export class Tooltip extends BaseComponent<ITooltipProps, any> {
       content,
       calloutProps,
       directionalHint,
+      directionalHintForRTL,
       delay,
       id,
       onRenderContent = this._onRenderContent
-    } = this.props;
+  } = this.props;
 
     return (
       <Callout
@@ -51,6 +52,7 @@ export class Tooltip extends BaseComponent<ITooltipProps, any> {
         ) }
         targetElement={ targetElement }
         directionalHint={ directionalHint }
+        directionalHintForRTL={ directionalHintForRTL }
         {...calloutProps}
         { ...getNativeProps(this.props, divProperties) }
       >
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.Props.ts b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.Props.ts
index d82e435f430b3..6c13079b0a628 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.Props.ts
@@ -59,6 +59,12 @@ export interface ITooltipHostProps extends React.HTMLAttributes<HTMLDivElement |
    */
   directionalHint?: DirectionalHint;
 
+  /**
+   * How the element should be positioned in RTL layouts.
+   * If not specified, a mirror of `directionalHint` will be used instead
+   */
+  directionalHintForRTL?: DirectionalHint;
+
   /**
    * Only show if there is overflow. If set, the tooltip hosts observes  and only shows the tooltip if this element has overflow.
    * It also uses the parent as target element for the tooltip.
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
index 6d5054b7580f3..802fcb0c2307e 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
@@ -47,6 +47,7 @@ export class TooltipHost extends BaseComponent<ITooltipHostProps, ITooltipHostSt
       content,
       children,
       directionalHint,
+      directionalHintForRTL,
       delay,
       id,
       setAriaDescribedBy = true,
@@ -72,6 +73,7 @@ export class TooltipHost extends BaseComponent<ITooltipHostProps, ITooltipHostSt
             content={ content }
             targetElement={ this._getTargetElement() }
             directionalHint={ directionalHint }
+            directionalHintForRTL={ directionalHintForRTL }
             calloutProps={ assign(calloutProps, { onDismiss: this._onTooltipCallOutDismiss }) }
             { ...getNativeProps(this.props, divProperties) }
             { ...tooltipProps }
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning.ts b/packages/office-ui-fabric-react/src/utilities/positioning.ts
index 475223da15a84..c46696d36b451 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning.ts
@@ -3,7 +3,8 @@ import {
   IRectangle,
   assign,
   getScrollbarWidth,
-  Rectangle
+  Rectangle,
+  getRTL,
 } from '../Utilities';
 
 export enum RectangleEdge {
@@ -39,6 +40,12 @@ export interface IPositionProps {
   /** how the element should be positioned */
   directionalHint?: DirectionalHint;
 
+  /**
+   * How the element should be positioned in RTL layouts.
+   * If not specified, a mirror of `directionalHint` will be used instead
+   */
+  directionalHintForRTL?: DirectionalHint;
+
   /** The gap between the callout and the target */
   gapSpace?: number;
 
@@ -116,6 +123,22 @@ export class PositionData {
   }
 }
 
+let MirrorDirectionalHintDictionary: { [key: number]: DirectionalHint } = {
+  [DirectionalHint.topLeftEdge]: DirectionalHint.topRightEdge,
+  [DirectionalHint.topCenter]: DirectionalHint.topCenter,
+  [DirectionalHint.topRightEdge]: DirectionalHint.topLeftEdge,
+  [DirectionalHint.topAutoEdge]: DirectionalHint.topAutoEdge,
+  [DirectionalHint.bottomLeftEdge]: DirectionalHint.bottomRightEdge,
+  [DirectionalHint.bottomCenter]: DirectionalHint.bottomCenter,
+  [DirectionalHint.bottomRightEdge]: DirectionalHint.bottomLeftEdge,
+  [DirectionalHint.bottomAutoEdge]: DirectionalHint.bottomAutoEdge,
+  [DirectionalHint.leftTopEdge]: DirectionalHint.rightTopEdge,
+  [DirectionalHint.leftCenter]: DirectionalHint.rightCenter,
+  [DirectionalHint.leftBottomEdge]: DirectionalHint.rightBottomEdge,
+  [DirectionalHint.rightTopEdge]: DirectionalHint.leftTopEdge,
+  [DirectionalHint.rightCenter]: DirectionalHint.leftCenter,
+  [DirectionalHint.rightBottomEdge]: DirectionalHint.leftBottomEdge,
+};
 // Currently the beakPercent is set to 50 for all positions meaning that it should tend to the center of the target
 let DirectionalDictionary: { [key: number]: PositionData } = {
   [DirectionalHint.topLeftEdge]: new PositionData(RectangleEdge.bottom, RectangleEdge.top, 0, 0, 50, false),
@@ -156,6 +179,17 @@ let OppositeEdgeDictionary: { [key: number]: number } = {
   [RectangleEdge.right]: RectangleEdge.left,
   [RectangleEdge.left]: RectangleEdge.right,
 };
+
+function getDirectionalHintForLayout(props: IPositionProps): DirectionalHint {
+  if (getRTL()) {
+    return props.directionalHintForRTL !== undefined ?
+      props.directionalHintForRTL :
+      MirrorDirectionalHintDictionary[props.directionalHint];
+  } else {
+    return props.directionalHint;
+  }
+}
+
 export function getRelativePositions(
   props: IPositionProps,
   hostElement: HTMLElement,
@@ -173,7 +207,7 @@ export function getRelativePositions(
     props.targetPoint,
     props.useTargetPoint);
   let positionData: PositionData = positioningFunctions._getPositionData(
-    props.directionalHint as DirectionalHint,
+    getDirectionalHintForLayout(props),
     targetRect,
     boundingRect,
     props.coverTarget);

From 4470172809fd8eea62bbc3177a7945908d70383c Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 24 Jul 2017 03:24:31 -0700
Subject: [PATCH 0300/1641] Applying package updates.

---
 ...downKeyboardBehavior_2017-07-18-19-47.json | 11 -----
 ...downKeyboardBehavior_2017-07-18-19-47.json | 11 -----
 ...downKeyboardBehavior_2017-07-18-19-47.json | 11 -----
 ...downKeyboardBehavior_2017-07-18-19-47.json | 11 -----
 .../2017-07-21-14-26.json                     | 11 -----
 ...l-hint-mirror-in-rtl_2017-07-21-19-17.json | 11 -----
 .../grow-data_2017-07-19-20-52.json           | 11 -----
 .../joem-picker-a11y_2017-07-21-20-24.json    | 11 -----
 ...downKeyboardBehavior_2017-07-18-19-47.json | 11 -----
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 41 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 16 +++++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/CHANGELOG.json               |  6 +++
 packages/styling/CHANGELOG.md                 |  7 +++-
 packages/styling/package.json                 |  2 +-
 17 files changed, 73 insertions(+), 106 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
 delete mode 100644 common/changes/@uifabric/fabric-website/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
 delete mode 100644 common/changes/@uifabric/styling/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
 delete mode 100644 common/changes/@uifabric/utilities/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
 delete mode 100644 common/changes/office-ui-fabric-react/2017-07-21-14-26.json
 delete mode 100644 common/changes/office-ui-fabric-react/directional-hint-mirror-in-rtl_2017-07-21-19-17.json
 delete mode 100644 common/changes/office-ui-fabric-react/grow-data_2017-07-19-20-52.json
 delete mode 100644 common/changes/office-ui-fabric-react/joem-picker-a11y_2017-07-21-20-24.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json

diff --git a/common/changes/@uifabric/example-app-base/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json b/common/changes/@uifabric/example-app-base/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
deleted file mode 100644
index 344f9222761bf..0000000000000
--- a/common/changes/@uifabric/example-app-base/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "peterdunlop2519@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json b/common/changes/@uifabric/fabric-website/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
deleted file mode 100644
index e641b8932ad45..0000000000000
--- a/common/changes/@uifabric/fabric-website/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "peterdunlop2519@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json b/common/changes/@uifabric/styling/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
deleted file mode 100644
index 51e4e878a0f01..0000000000000
--- a/common/changes/@uifabric/styling/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "peterdunlop2519@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json b/common/changes/@uifabric/utilities/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
deleted file mode 100644
index 6cb6c52a405f3..0000000000000
--- a/common/changes/@uifabric/utilities/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "peterdunlop2519@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/2017-07-21-14-26.json b/common/changes/office-ui-fabric-react/2017-07-21-14-26.json
deleted file mode 100644
index f813d2b97d936..0000000000000
--- a/common/changes/office-ui-fabric-react/2017-07-21-14-26.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix application of aria properties on BaseButton.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "trgau@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/directional-hint-mirror-in-rtl_2017-07-21-19-17.json b/common/changes/office-ui-fabric-react/directional-hint-mirror-in-rtl_2017-07-21-19-17.json
deleted file mode 100644
index e779011aec9c0..0000000000000
--- a/common/changes/office-ui-fabric-react/directional-hint-mirror-in-rtl_2017-07-21-19-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Callout/ContextualMenu/Tooltip: we now mirror DirectionalHints in RTL layouts by default. To override this behavior, specify `directionalHintForRtl`",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/grow-data_2017-07-19-20-52.json b/common/changes/office-ui-fabric-react/grow-data_2017-07-19-20-52.json
deleted file mode 100644
index 0b1a088e3c573..0000000000000
--- a/common/changes/office-ui-fabric-react/grow-data_2017-07-19-20-52.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ResizeGroup: Add support for onGrowData",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/joem-picker-a11y_2017-07-21-20-24.json b/common/changes/office-ui-fabric-react/joem-picker-a11y_2017-07-21-20-24.json
deleted file mode 100644
index e41283e18ec82..0000000000000
--- a/common/changes/office-ui-fabric-react/joem-picker-a11y_2017-07-21-20-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Accessibility fixes for PeoplePicker",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joem@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json b/common/changes/office-ui-fabric-react/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
deleted file mode 100644
index d489517009d99..0000000000000
--- a/common/changes/office-ui-fabric-react/users-petdun-fixDropdownKeyboardBehavior_2017-07-18-19-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: Updated keydown handler to respond correctly to normal dropdown items",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "peterdunlop2519@gmail.com"
-}
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index e8307064d618b..010e6df704776 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -48,7 +48,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.13.14 <1.0.0",
+    "@uifabric/styling": ">=0.13.15 <1.0.0",
     "@uifabric/utilities": ">=4.8.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index c143b35472e47..066d0bb451c4e 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.21.4 <5.0.0",
+    "office-ui-fabric-react": ">=4.22.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index cafca7032938d..a1dbf86b9d128 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,47 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.22.0",
+      "tag": "office-ui-fabric-react_v4.22.0",
+      "date": "Mon, 24 Jul 2017 10:24:30 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Trevor Gau <trevorsg@gmail.com>",
+            "commit": "5933799d69801712dffcf665ac73231a6a2e2357",
+            "comment": "Fix application of aria properties on BaseButton."
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "67d167f3d9400b3f38c0106a78f91a67a6eabb5e",
+            "comment": "ResizeGroup: Add support for onGrowData"
+          },
+          {
+            "author": "Joe Martella <martellaj@live.com>",
+            "commit": "5c9d10ee2cb1e4ccc82d5f03dccb02bf1276a23e",
+            "comment": "Accessibility fixes for PeoplePicker"
+          },
+          {
+            "author": "petdun2519 <peterdunlop2519@gmail.com>",
+            "commit": "3d593e67d11ce99ef269ce5a7e207aa9399ddd48",
+            "comment": "Dropdown: Updated keydown handler to respond correctly to normal dropdown items"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Michael Loughry <miclo@microsoft.com>",
+            "commit": "f24070ef5b3a3173cfde2ee25cdb7b150a668ca7",
+            "comment": "Callout/ContextualMenu/Tooltip: we now mirror DirectionalHints in RTL layouts by default. To override this behavior, specify `directionalHintForRtl`"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.13.14 <1.0.0` to `>=0.13.15 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.21.4",
       "tag": "office-ui-fabric-react_v4.21.4",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index da372d8a2f79a..0431b551836bc 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,20 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 21 Jul 2017 10:21:45 GMT and should not be manually modified.
+This log was last generated on Mon, 24 Jul 2017 10:24:31 GMT and should not be manually modified.
+
+## 4.22.0
+Mon, 24 Jul 2017 10:24:30 GMT
+
+### Minor changes
+
+- Callout/ContextualMenu/Tooltip: we now mirror DirectionalHints in RTL layouts by default. To override this behavior, specify `directionalHintForRtl`
+
+### Patches
+
+- Fix application of aria properties on BaseButton.
+- ResizeGroup: Add support for onGrowData
+- Accessibility fixes for PeoplePicker
+- Dropdown: Updated keydown handler to respond correctly to normal dropdown items
 
 ## 4.21.4
 Fri, 21 Jul 2017 10:21:45 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index ca498fa0c348b..4c703d52afa62 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.21.4",
+  "version": "4.22.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.8.0 <5.0.0",
-    "@uifabric/styling": ">=0.13.14 <1.0.0",
+    "@uifabric/styling": ">=0.13.15 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 2203bde0072f9..0b4527284846d 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.13.15",
+      "tag": "@uifabric/styling_v0.13.15",
+      "date": "Mon, 24 Jul 2017 10:24:30 GMT",
+      "comments": {}
+    },
     {
       "version": "0.13.14",
       "tag": "@uifabric/styling_v0.13.14",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index f9f8804d74432..912bf894a3aed 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 21 Jul 2017 10:21:45 GMT and should not be manually modified.
+This log was last generated on Mon, 24 Jul 2017 10:24:30 GMT and should not be manually modified.
+
+## 0.13.15
+Mon, 24 Jul 2017 10:24:30 GMT
+
+*Changes not tracked*
 
 ## 0.13.14
 Fri, 21 Jul 2017 10:21:45 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index a869e9ee08161..84cc2052f7d85 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.13.14",
+  "version": "0.13.15",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From ba082351b1f8c94015002bde8f3f1fdbe60241c9 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Mon, 24 Jul 2017 08:51:52 -0700
Subject: [PATCH 0301/1641] Textfield: Removed icon pointer events so that any
 click is click in textfield (#2234)

* Textfield: Removed icon pointer events so that any click is click in textfield

* Change file
---
 .../textfield-icon-click_2017-07-18-15-06.json        | 11 +++++++++++
 .../src/components/TextField/TextField.scss           |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/textfield-icon-click_2017-07-18-15-06.json

diff --git a/common/changes/office-ui-fabric-react/textfield-icon-click_2017-07-18-15-06.json b/common/changes/office-ui-fabric-react/textfield-icon-click_2017-07-18-15-06.json
new file mode 100644
index 0000000000000..26c913d3bb26a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/textfield-icon-click_2017-07-18-15-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Textfield: Removed icon pointer events so that any click is click in textfield",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index b183b8c05a4ad..2e260640a71e9 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -149,6 +149,7 @@ $field-error-color: $errorTextColor;
 }
 
 .icon {
+  pointer-events: none;
   position: absolute;
   bottom: 8px;
   @include right(8px);

From 7ea94b40b14cd1928f477193867672fd5f422f14 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Mon, 24 Jul 2017 10:13:08 -0700
Subject: [PATCH 0302/1641] Button: Support expanded styles for contextual
 buttons (#2282)

* Button: Support expanded style state triggered by opened menu

* Change file

* FIxed split button expanded styles
---
 .../contextual-button-styles_2017-07-21-18-33.json | 11 +++++++++++
 .../src/components/Button/BaseButton.classNames.ts |  9 +++++++--
 .../src/components/Button/BaseButton.tsx           | 14 ++++++++++++--
 .../src/components/Button/Button.Props.ts          |  5 +++++
 .../Button/CommandButton/CommandButton.styles.ts   |  4 ++++
 .../Button/DefaultButton/DefaultButton.styles.ts   |  5 +++++
 .../Button/IconButton/IconButton.styles.ts         |  4 ++++
 .../Button/PrimaryButton/PrimaryButton.styles.ts   |  5 +++++
 .../Button/SplitButton/SplitButton.Props.ts        |  5 +++++
 .../Button/SplitButton/SplitButton.styles.ts       |  4 ++++
 10 files changed, 62 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/contextual-button-styles_2017-07-21-18-33.json

diff --git a/common/changes/office-ui-fabric-react/contextual-button-styles_2017-07-21-18-33.json b/common/changes/office-ui-fabric-react/contextual-button-styles_2017-07-21-18-33.json
new file mode 100644
index 0000000000000..a2ba04b2826ab
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/contextual-button-styles_2017-07-21-18-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Button: Support expanded style state triggered by opened menu",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
index 623f29a17fcf0..879f6073b136c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
@@ -18,7 +18,8 @@ export const getClassNames = memoizeFunction((
   variantClassName: string,
   iconClassName: string,
   disabled: boolean,
-  checked: boolean
+  checked: boolean,
+  expanded: boolean
 ): IButtonClassNames => {
   return {
     root: mergeStyles(
@@ -30,11 +31,15 @@ export const getClassNames = memoizeFunction((
         'is-checked',
         styles.rootChecked
       ],
+      expanded && [
+        'is-expanded',
+        styles.rootExpanded
+      ],
       disabled && [
         'is-disabled',
         styles.rootDisabled
       ],
-      !disabled && {
+      !disabled && !expanded && {
         ':hover': styles.rootHovered,
         ':hover .ms-Button-description': styles.descriptionHovered,
         ':active': styles.rootPressed,
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 3193563a103a3..6d0f4c3d87b36 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -11,6 +11,7 @@ import {
   KeyCodes,
   css,
 } from '../../Utilities';
+import { mergeStyles } from '../../Styling';
 import { Icon, IIconProps } from '../../Icon';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { ContextualMenu, IContextualMenuProps } from '../../ContextualMenu';
@@ -95,7 +96,8 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       variantClassName,
       iconProps && iconProps.className,
       disabled,
-      checked
+      checked,
+      this.state.menuProps != null && !this.props.split
     );
 
     const { _ariaDescriptionId, _labelId, _descriptionId } = this;
@@ -404,7 +406,15 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       <IconButton
         tabIndex={ -1 }
         styles={ {
-          root: disabled ? styles.splitButtonMenuButtonDisabled : styles.splitButtonMenuButton,
+          root: mergeStyles(
+            styles.splitButtonMenuButton,
+            !!this.state.menuProps && [
+              styles.splitButtonMenuButtonExpanded
+            ],
+            disabled && [
+              styles.splitButtonMenuButtonDisabled
+            ],
+          ) as string,
           rootChecked: styles.splitButtonMenuButtonChecked,
           icon: disabled ? styles.splitButtonMenuIconDisabled : styles.splitButtonMenuIcon
         } }
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
index 268d1ce54e80f..5fc65eef46ddd 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
@@ -208,6 +208,11 @@ export interface IButtonStyles {
    */
   rootPressed?: IStyle;
 
+  /**
+   * Style override applied to the root on when menu is expanded in the default, enabled, non-toggled state.
+   */
+  rootExpanded?: IStyle;
+
   /**
    * Style override applied to the root on hover in a checked, enabled state
    */
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
index 21547a36c2f1b..37e191fa30727 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
@@ -47,6 +47,10 @@ export const getStyles = memoizeFunction((
       backgroundColor: theme.palette.neutralTertiaryAlt,
     },
 
+    rootExpanded: {
+      color: theme.palette.themePrimary
+    },
+
     rootCheckedHovered: {
       backgroundColor: theme.palette.neutralLight
     },
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
index a1671ac2ddb66..49835edf84781 100644
--- a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
@@ -43,6 +43,11 @@ export const getStyles = memoizeFunction((
       color: theme.palette.neutralDark
     },
 
+    rootExpanded: {
+      backgroundColor: theme.palette.neutralTertiaryAlt,
+      color: theme.palette.neutralDark
+    },
+
     rootChecked: {
       backgroundColor: theme.palette.neutralTertiaryAlt,
       color: theme.palette.neutralDark
diff --git a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
index 4d564d02eb214..ab98f5e3cb7c2 100644
--- a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
@@ -37,6 +37,10 @@ export const getStyles = memoizeFunction((
       color: theme.palette.themePrimary
     },
 
+    rootExpanded: {
+      color: theme.palette.themePrimary
+    },
+
     rootChecked: {
       backgroundColor: theme.palette.neutralTertiaryAlt,
     },
diff --git a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
index 1de65d15a9a62..793c8d117a121 100644
--- a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
@@ -40,6 +40,11 @@ export const getStyles = memoizeFunction((
       color: palette.white
     },
 
+    rootExpanded: {
+      backgroundColor: palette.themePrimary,
+      color: palette.white
+    },
+
     rootChecked: {
       backgroundColor: palette.themeDark,
       color: palette.white,
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.Props.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.Props.ts
index 4c0fa760286f3..2bf9e52f4e9bb 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.Props.ts
@@ -28,6 +28,11 @@ export interface ISplitButtonStyles extends IButtonStyles {
    */
   splitButtonMenuButtonChecked?: IStyle;
 
+  /**
+   * Style override for the SplitButton menu button element in an expanded state
+   */
+  splitButtonMenuButtonExpanded?: IStyle;
+
   /**
    * Style override for the SplitButton menu icon element
    */
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
index 8e7a25dcbf9fa..d2428e8a6bdd4 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
@@ -56,6 +56,10 @@ export const getStyles = memoizeFunction((
     splitButtonMenuButtonChecked: {
       backgroundColor: theme.palette.themePrimary,
     },
+
+    splitButtonMenuButtonExpanded: {
+      backgroundColor: theme.palette.neutralLight,
+    },
   };
 
   return mergeStyleSets(iconButtonStyles, customStyles);

From 1fa13c6d69f2da24b26e429b009498ecb2e39037 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 24 Jul 2017 10:42:41 -0700
Subject: [PATCH 0303/1641] TextField/Fabric component: font fot TEXTAREA
 elements now inherits font family. (#2292)

* Updating multiple line text field font styling.

* Adding change file.
---
 .../multiline-textfield-font_2017-07-24-17-37.json    | 11 +++++++++++
 .../src/components/Fabric/Fabric.styles.ts            |  3 ++-
 2 files changed, 13 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/multiline-textfield-font_2017-07-24-17-37.json

diff --git a/common/changes/office-ui-fabric-react/multiline-textfield-font_2017-07-24-17-37.json b/common/changes/office-ui-fabric-react/multiline-textfield-font_2017-07-24-17-37.json
new file mode 100644
index 0000000000000..11fc0786209bd
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/multiline-textfield-font_2017-07-24-17-37.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "TextField: multiline variant font now correct, assuming the Fabric component wraps the application. A new selector was added which will force TEXTAREA elements to inherit the font.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.styles.ts b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.styles.ts
index eeecff0bf733b..d0e1ce5101ce6 100644
--- a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.styles.ts
@@ -23,7 +23,8 @@ export const getStyles = memoizeFunction((
       {
         color: theme.palette.neutralPrimary,
         '& button': inheritFont,
-        '& input': inheritFont
+        '& input': inheritFont,
+        '& textarea': inheritFont
       }
     ])
   };

From ffc20614209c84c6f2643de13b5e1edd1afc992e Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Mon, 24 Jul 2017 10:45:16 -0700
Subject: [PATCH 0304/1641] Changed realsenotes prerelease to false (#2271)

---
 scripts/updateReleaseNotes.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/scripts/updateReleaseNotes.js b/scripts/updateReleaseNotes.js
index 5f4c0f2cfa771..d89bfa30a35a2 100644
--- a/scripts/updateReleaseNotes.js
+++ b/scripts/updateReleaseNotes.js
@@ -190,7 +190,7 @@ function updateReleaseNotes(shouldPatchChangelog) {
           "name": `${entry.name} v${entry.version}`,
           "body": entry.body,
           "draft": false,
-          "prerelease": true
+          "prerelease": false
         });
 
         if (!hasBeenReleased) {

From c1e83a4109dda4cae3986bb38c77dfb724574287 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Mon, 24 Jul 2017 10:46:38 -0700
Subject: [PATCH 0305/1641] Textfield borderless highcontrast (#2257)

* Textfield: Fixed high contrast border and textarea font family

* Add change file

* Updated some theme colors to match designer spec
---
 ...ield-borderless-highcontrast_2017-07-19-16-43.json | 11 +++++++++++
 .../src/common/_semanticColorVariables.scss           |  4 ++--
 .../src/components/TextField/TextField.scss           |  3 ++-
 3 files changed, 15 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/textfield-borderless-highcontrast_2017-07-19-16-43.json

diff --git a/common/changes/office-ui-fabric-react/textfield-borderless-highcontrast_2017-07-19-16-43.json b/common/changes/office-ui-fabric-react/textfield-borderless-highcontrast_2017-07-19-16-43.json
new file mode 100644
index 0000000000000..cf3ec8a231c1d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/textfield-borderless-highcontrast_2017-07-19-16-43.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Textfield: Fixed high contrast border and textarea font family",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss b/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
index a23209fb32e17..f2e3e1af322a9 100644
--- a/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
+++ b/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
@@ -50,8 +50,8 @@ $errorTextColor: $ms-color-redDark;
 $fieldBackgroundColor: $ms-color-white;
 $fieldTextColor: $ms-color-neutralPrimary;
 
-$fieldBorderColor: $ms-color-neutralTertiaryAlt;
-$fieldBorderHoverColor: $ms-color-neutralSecondaryAlt;
+$fieldBorderColor: $ms-color-neutralTertiary;
+$fieldBorderHoverColor: $ms-color-neutralDark;
 $fieldBorderFocusColor: $ms-color-themePrimary;
 
 $fieldPlaceholderColor: $ms-color-neutralTertiary;
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index 2e260640a71e9..d20c63bf7ec52 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -163,6 +163,7 @@ $field-error-color: $errorTextColor;
 
 .rootIsBorderless .fieldGroup {
   border-color: transparent;
+  border-width: 0;
 }
 
 //== Modifier: Single line (default), underlined
@@ -197,7 +198,7 @@ $field-error-color: $errorTextColor;
 
   .fieldGroup {
     flex: 1 1 0px;
-    border: 0;
+    border-width: 0;
 
     @include ms-text-align(left);
   }

From 7932a0ee52e0beaa59ecdb6bac293ece52b28e23 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Mon, 24 Jul 2017 10:48:15 -0700
Subject: [PATCH 0306/1641] ResizeGroup: Don't show a scrollbar while measuring
 the hidden div (#2293)

* Get rid of the scrollbar on ResizeGroup by using position fixed instead of position absolute for the hidden div.

* Rush change
---
 .../no-scrollbar_2017-07-24-05-19.json                | 11 +++++++++++
 .../src/components/ResizeGroup/ResizeGroup.scss       |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/no-scrollbar_2017-07-24-05-19.json

diff --git a/common/changes/office-ui-fabric-react/no-scrollbar_2017-07-24-05-19.json b/common/changes/office-ui-fabric-react/no-scrollbar_2017-07-24-05-19.json
new file mode 100644
index 0000000000000..8e3b46b1d3e20
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/no-scrollbar_2017-07-24-05-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ResizeGroup: Don't show a scrollbar while measuring the hidden div",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "<christianjordangonzalez@gmail.com>"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.scss b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.scss
index 2c5202ab054c5..01306c7f803c7 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.scss
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.scss
@@ -6,6 +6,6 @@
 }
 
 .measured {
-  position: absolute;
+  position: fixed;
   visibility: hidden;
 }
\ No newline at end of file

From 93603fc44d599a97603cba36b07384f3e99507a3 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Mon, 24 Jul 2017 12:29:44 -0700
Subject: [PATCH 0307/1641] ResizeGroup: Prevent flashing when passing in new
 props (#2294)

* Prevent flashing that happens when new props in are passed to ResizeGroup

* Rush change
---
 .../no-flashing_2017-07-24-18-26.json         | 11 +++++
 .../ResizeGroup/ResizeGroup.test.tsx          | 40 +++++++++++++++++++
 .../components/ResizeGroup/ResizeGroup.tsx    |  3 +-
 3 files changed, 52 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/no-flashing_2017-07-24-18-26.json

diff --git a/common/changes/office-ui-fabric-react/no-flashing_2017-07-24-18-26.json b/common/changes/office-ui-fabric-react/no-flashing_2017-07-24-18-26.json
new file mode 100644
index 0000000000000..7ba1ec69f85f2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/no-flashing_2017-07-24-18-26.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ResizeGroup: Prevent flashing when passing in new props",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "<christianjordangonzalez@gmail.com>"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
index 9caf060bb0271..a6772f24a7b89 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
@@ -567,4 +567,44 @@ describe('ResizeGroup', () => {
       expect(measuredElementWidthStub.callCount).to.equal(0);
     });
   });
+
+  it('does not clear out the rendered contents when setting a new dataToMeasure', () => {
+    const initialWidth = 50;
+    const renderedData = { index: 4 };
+    const resizeGroupProps = getRequiredResizeGroupProps();
+    const getNextResizeGroupState = getNextResizeGroupStateProvider();
+    const getMeasuredElementWidthStub = sinon.stub();
+    getMeasuredElementWidthStub.returns(100);
+
+    // Set the initial window width
+    getNextResizeGroupState(resizeGroupProps,
+      {},
+      undefined,
+      initialWidth);
+
+    // Pass in a state that reflects some rendered data
+    let currentState: IResizeGroupState = {
+      renderedData: renderedData,
+      dataToMeasure: { index: 8 },
+      resizeDirection: 'grow'
+    };
+
+    resizeGroupProps.onReduceData.returns({ index: 7 });
+
+    let result = getNextResizeGroupState(resizeGroupProps,
+      currentState,
+      getMeasuredElementWidthStub,
+      initialWidth);
+
+    // Important to note that we do not start scaling from the initial data,
+    // we continue from the last rendered data.
+    expect(result).to.deep.equal({
+      renderedData: renderedData,
+      dataToMeasure: { index: 7 },
+      measureContainer: false,
+      resizeDirection: 'shrink'
+    });
+    expect(getMeasuredElementWidthStub.callCount).to.equal(1);
+    expect(resizeGroupProps.onReduceData.callCount).to.equal(1);
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index f8c8f35ec2ba2..670638ed6fb7a 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -228,7 +228,7 @@ export const getNextResizeGroupStateProvider = (measurementCache = getMeasuremen
 
     if (newContainerWidth) {
       // If we know what the last container size was and we rendered data at that width, we can do an optimized render
-      if (_containerWidth && currentState.renderedData) {
+      if (_containerWidth && currentState.renderedData && !currentState.dataToMeasure) {
         return { ...currentState, ..._updateContainerWidth(newContainerWidth, props.data, currentState.renderedData, props.onGrowData) };
       }
 
@@ -299,7 +299,6 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
     this.setState({
       dataToMeasure: { ...nextProps.data },
       resizeDirection: 'grow',
-      renderedData: undefined,
       measureContainer: true // Receiving new props means the parent might rerender and the root width might change
     });
   }

From 21e9f3cb32e33e534faa8929d1301bd2adc8de8e Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Mon, 24 Jul 2017 14:33:43 -0700
Subject: [PATCH 0308/1641] Checkbox label size (#2296)

* Explicitely set checkbox label font size

* change file
---
 .../checkbox-label-size_2017-07-24-20-52.json         | 11 +++++++++++
 .../src/components/Checkbox/Checkbox.styles.ts        |  6 ++++--
 2 files changed, 15 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/checkbox-label-size_2017-07-24-20-52.json

diff --git a/common/changes/office-ui-fabric-react/checkbox-label-size_2017-07-24-20-52.json b/common/changes/office-ui-fabric-react/checkbox-label-size_2017-07-24-20-52.json
new file mode 100644
index 0000000000000..42b09a8e7fba1
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/checkbox-label-size_2017-07-24-20-52.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Checkbox: Fixed label font size",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
index 335b286d9e2b4..e27e1bcc0fc03 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
@@ -2,7 +2,8 @@ import { ICheckboxStyles } from './Checkbox.Props';
 import {
   ITheme,
   mergeStyleSets,
-  getFocusStyle
+  getFocusStyle,
+  FontSizes
 } from '../../Styling';
 import { memoizeFunction } from '../../Utilities';
 
@@ -98,7 +99,8 @@ export const getStyles = memoizeFunction((
       color: checkmarkFontColorCheckedDisabled,
     },
     text: {
-      marginRight: '8px'
+      marginRight: '8px',
+      fontSize: FontSizes.medium
     },
     textHovered: {
       color: palette.black,

From 2a9661c8fa1a8c1152a7bbd83a774e55a2f0e15b Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 25 Jul 2017 10:22:36 +0000
Subject: [PATCH 0309/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../checkbox-label-size_2017-07-24-20-52.json | 11 ----
 ...extual-button-styles_2017-07-21-18-33.json | 11 ----
 ...iline-textfield-font_2017-07-24-17-37.json | 11 ----
 .../no-flashing_2017-07-24-18-26.json         | 11 ----
 .../no-scrollbar_2017-07-24-05-19.json        | 11 ----
 ...derless-highcontrast_2017-07-19-16-43.json | 11 ----
 ...textfield-icon-click_2017-07-18-15-06.json | 11 ----
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 51 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 18 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/CHANGELOG.json               |  6 +++
 packages/styling/CHANGELOG.md                 |  7 ++-
 packages/styling/package.json                 |  2 +-
 19 files changed, 89 insertions(+), 88 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/checkbox-label-size_2017-07-24-20-52.json
 delete mode 100644 common/changes/office-ui-fabric-react/contextual-button-styles_2017-07-21-18-33.json
 delete mode 100644 common/changes/office-ui-fabric-react/multiline-textfield-font_2017-07-24-17-37.json
 delete mode 100644 common/changes/office-ui-fabric-react/no-flashing_2017-07-24-18-26.json
 delete mode 100644 common/changes/office-ui-fabric-react/no-scrollbar_2017-07-24-05-19.json
 delete mode 100644 common/changes/office-ui-fabric-react/textfield-borderless-highcontrast_2017-07-19-16-43.json
 delete mode 100644 common/changes/office-ui-fabric-react/textfield-icon-click_2017-07-18-15-06.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index e563229d7f766..c3a5c74f22100 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.21.4 <5.0.0",
+    "office-ui-fabric-react": ">=4.23.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 6f9086159d8c3..1c7f0ab413030 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.21.4 <5.0.0",
+    "office-ui-fabric-react": ">=4.23.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 761ab5ed0a489..1483e9134d37f 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -35,7 +35,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.21.4 <5.0.0",
+    "office-ui-fabric-react": ">=4.23.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index df7b1e05f0a6d..8cc030d4b0e4d 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.21.4 <5.0.0",
+    "office-ui-fabric-react": ">=4.23.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/office-ui-fabric-react/checkbox-label-size_2017-07-24-20-52.json b/common/changes/office-ui-fabric-react/checkbox-label-size_2017-07-24-20-52.json
deleted file mode 100644
index 42b09a8e7fba1..0000000000000
--- a/common/changes/office-ui-fabric-react/checkbox-label-size_2017-07-24-20-52.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Checkbox: Fixed label font size",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/contextual-button-styles_2017-07-21-18-33.json b/common/changes/office-ui-fabric-react/contextual-button-styles_2017-07-21-18-33.json
deleted file mode 100644
index a2ba04b2826ab..0000000000000
--- a/common/changes/office-ui-fabric-react/contextual-button-styles_2017-07-21-18-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Button: Support expanded style state triggered by opened menu",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/multiline-textfield-font_2017-07-24-17-37.json b/common/changes/office-ui-fabric-react/multiline-textfield-font_2017-07-24-17-37.json
deleted file mode 100644
index 11fc0786209bd..0000000000000
--- a/common/changes/office-ui-fabric-react/multiline-textfield-font_2017-07-24-17-37.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "TextField: multiline variant font now correct, assuming the Fabric component wraps the application. A new selector was added which will force TEXTAREA elements to inherit the font.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/no-flashing_2017-07-24-18-26.json b/common/changes/office-ui-fabric-react/no-flashing_2017-07-24-18-26.json
deleted file mode 100644
index 7ba1ec69f85f2..0000000000000
--- a/common/changes/office-ui-fabric-react/no-flashing_2017-07-24-18-26.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ResizeGroup: Prevent flashing when passing in new props",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "<christianjordangonzalez@gmail.com>"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/no-scrollbar_2017-07-24-05-19.json b/common/changes/office-ui-fabric-react/no-scrollbar_2017-07-24-05-19.json
deleted file mode 100644
index 8e3b46b1d3e20..0000000000000
--- a/common/changes/office-ui-fabric-react/no-scrollbar_2017-07-24-05-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ResizeGroup: Don't show a scrollbar while measuring the hidden div",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "<christianjordangonzalez@gmail.com>"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/textfield-borderless-highcontrast_2017-07-19-16-43.json b/common/changes/office-ui-fabric-react/textfield-borderless-highcontrast_2017-07-19-16-43.json
deleted file mode 100644
index cf3ec8a231c1d..0000000000000
--- a/common/changes/office-ui-fabric-react/textfield-borderless-highcontrast_2017-07-19-16-43.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Textfield: Fixed high contrast border and textarea font family",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/textfield-icon-click_2017-07-18-15-06.json b/common/changes/office-ui-fabric-react/textfield-icon-click_2017-07-18-15-06.json
deleted file mode 100644
index 26c913d3bb26a..0000000000000
--- a/common/changes/office-ui-fabric-react/textfield-icon-click_2017-07-18-15-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Textfield: Removed icon pointer events so that any click is click in textfield",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 010e6df704776..de0a67c389c16 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -48,7 +48,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.13.15 <1.0.0",
+    "@uifabric/styling": ">=0.13.16 <1.0.0",
     "@uifabric/utilities": ">=4.8.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 066d0bb451c4e..4e5e197da63d2 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.22.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.23.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index a1dbf86b9d128..71a6fc55b928a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,57 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.23.0",
+      "tag": "office-ui-fabric-react_v4.23.0",
+      "date": "Tue, 25 Jul 2017 10:22:35 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "21e9f3cb32e33e534faa8929d1301bd2adc8de8e",
+            "comment": "Checkbox: Fixed label font size"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "1fa13c6d69f2da24b26e429b009498ecb2e39037",
+            "comment": "TextField: multiline variant font now correct, assuming the Fabric component wraps the application. A new selector was added which will force TEXTAREA elements to inherit the font."
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "93603fc44d599a97603cba36b07384f3e99507a3",
+            "comment": "ResizeGroup: Prevent flashing when passing in new props"
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "7932a0ee52e0beaa59ecdb6bac293ece52b28e23",
+            "comment": "ResizeGroup: Don't show a scrollbar while measuring the hidden div"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "c1e83a4109dda4cae3986bb38c77dfb724574287",
+            "comment": "Textfield: Fixed high contrast border and textarea font family"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "ba082351b1f8c94015002bde8f3f1fdbe60241c9",
+            "comment": "Textfield: Removed icon pointer events so that any click is click in textfield"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "7ea94b40b14cd1928f477193867672fd5f422f14",
+            "comment": "Button: Support expanded style state triggered by opened menu"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.13.15 <1.0.0` to `>=0.13.16 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.22.0",
       "tag": "office-ui-fabric-react_v4.22.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 0431b551836bc..e9b3a89e1012c 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,22 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 24 Jul 2017 10:24:31 GMT and should not be manually modified.
+This log was last generated on Tue, 25 Jul 2017 10:22:35 GMT and should not be manually modified.
+
+## 4.23.0
+Tue, 25 Jul 2017 10:22:35 GMT
+
+### Minor changes
+
+- Button: Support expanded style state triggered by opened menu
+
+### Patches
+
+- Checkbox: Fixed label font size
+- TextField: multiline variant font now correct, assuming the Fabric component wraps the application. A new selector was added which will force TEXTAREA elements to inherit the font.
+- ResizeGroup: Prevent flashing when passing in new props
+- ResizeGroup: Don't show a scrollbar while measuring the hidden div
+- Textfield: Fixed high contrast border and textarea font family
+- Textfield: Removed icon pointer events so that any click is click in textfield
 
 ## 4.22.0
 Mon, 24 Jul 2017 10:24:30 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 4c703d52afa62..c3aceb4341b2c 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.22.0",
+  "version": "4.23.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.8.0 <5.0.0",
-    "@uifabric/styling": ">=0.13.15 <1.0.0",
+    "@uifabric/styling": ">=0.13.16 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 0b4527284846d..093fb54f8018b 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.13.16",
+      "tag": "@uifabric/styling_v0.13.16",
+      "date": "Tue, 25 Jul 2017 10:22:35 GMT",
+      "comments": {}
+    },
     {
       "version": "0.13.15",
       "tag": "@uifabric/styling_v0.13.15",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 912bf894a3aed..02ee5d64e5e1c 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Mon, 24 Jul 2017 10:24:30 GMT and should not be manually modified.
+This log was last generated on Tue, 25 Jul 2017 10:22:35 GMT and should not be manually modified.
+
+## 0.13.16
+Tue, 25 Jul 2017 10:22:35 GMT
+
+*Changes not tracked*
 
 ## 0.13.15
 Mon, 24 Jul 2017 10:24:30 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 84cc2052f7d85..5defbbc2bb398 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.13.15",
+  "version": "0.13.16",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From b711509d4a7e73d3a89734afd3358f72805b8550 Mon Sep 17 00:00:00 2001
From: veloiya <30428533+veloiya@users.noreply.github.com>
Date: Wed, 26 Jul 2017 23:59:25 +0530
Subject: [PATCH 0310/1641] Commandbar - Accessibility fix for expand behavior
 (#2307)

* Fixing accessibility bug

* change log

* change log
---
 .../users-veloiya-Bug1040384_2017-07-25-12-15.json    | 11 +++++++++++
 .../src/components/CommandBar/CommandBar.tsx          |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/users-veloiya-Bug1040384_2017-07-25-12-15.json

diff --git a/common/changes/office-ui-fabric-react/users-veloiya-Bug1040384_2017-07-25-12-15.json b/common/changes/office-ui-fabric-react/users-veloiya-Bug1040384_2017-07-25-12-15.json
new file mode 100644
index 0000000000000..9a099906ce067
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-veloiya-Bug1040384_2017-07-25-12-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "CommandBar: Accessibility fix for expand behavior",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "veloiya@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index bccacc77a92d2..bad0660501fca 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -184,6 +184,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
             onClick={ (ev) => this._onItemClick(ev, item) }
             data-command-key={ index }
             aria-haspopup={ hasSubmenuItems(item) }
+            aria-expanded={ hasSubmenuItems(item) ? expandedMenuItemKey === item.key : undefined }
             role='menuitem'
             aria-label={ item.ariaLabel }
           >

From 63752842b2b67d1d15d473f8c0b32e9a3d96e155 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 26 Jul 2017 12:45:01 -0700
Subject: [PATCH 0311/1641] updated panel docs

---
 .../office-ui-fabric-react/src/components/Panel/PanelPage.tsx   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx b/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
index fcbc72a76ca46..7c75e4020d70b 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
@@ -107,7 +107,7 @@ export class PanelPage extends React.Component<IComponentDemoPageProps, {}> {
         donts={
           <div>
             <ul>
-              <li>Use for experiences where the user needs to interact with the app view. Use a Pane (which pushes content, doesn’t use an overlay, and sits on the same z-index as the rest of the UI) instead.</li>
+              <li>Use for experiences where the user needs to interact with the app view.</li>
             </ul>
           </div>
         }

From df7a230735c92a73935bbdf97cfb6f2fcae9af45 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 26 Jul 2017 12:49:35 -0700
Subject: [PATCH 0312/1641] Icon update 2.38 (#2309)

* Updated icons to v 2.38

* Change files

* Updated changefile
---
 .../icon-update-2.38_2017-07-26-18-00.json    | 11 +++
 .../icon-update-2.38_2017-07-26-18-00.json    | 11 +++
 .../src/components/Icon/IconName.ts           | 25 ++++-
 .../styling/src/styles/DefaultFontStyles.ts   |  2 +-
 packages/styling/src/styles/IconCodes.ts      | 92 +++++++++++++++++++
 5 files changed, 139 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/icon-update-2.38_2017-07-26-18-00.json
 create mode 100644 common/changes/office-ui-fabric-react/icon-update-2.38_2017-07-26-18-00.json

diff --git a/common/changes/@uifabric/styling/icon-update-2.38_2017-07-26-18-00.json b/common/changes/@uifabric/styling/icon-update-2.38_2017-07-26-18-00.json
new file mode 100644
index 0000000000000..bc0fb216e7658
--- /dev/null
+++ b/common/changes/@uifabric/styling/icon-update-2.38_2017-07-26-18-00.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "Icons: Added new icons from 2.38",
+      "packageName": "@uifabric/styling",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/icon-update-2.38_2017-07-26-18-00.json b/common/changes/office-ui-fabric-react/icon-update-2.38_2017-07-26-18-00.json
new file mode 100644
index 0000000000000..3897ac110fb2c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/icon-update-2.38_2017-07-26-18-00.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Icons: Added new icons from 2.38",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Icon/IconName.ts b/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
index 51f9ef149c5c2..884362e1926db 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
@@ -887,4 +887,27 @@ export type IconName =
   'YammerLogo' |
   'Zoom' |
   'ZoomIn' |
-  'ZoomOut';
\ No newline at end of file
+  'ZoomOut' |
+  'FilterSolid' |
+  'GridViewSmall' |
+  'GridViewMedium' |
+  'GridViewLarge' |
+  'ThisPc' |
+  'MailUndelivered' |
+  'MailTentative' |
+  'MailTentativeMirrored' |
+  'MailReminder' |
+  'IRMReply' |
+  'IRMReplyMirrored' |
+  'IRMForward' |
+  'IRMForwardMirrored' |
+  'ReceiptUndelivered' |
+  'ReceiptTentative' |
+  'ReceiptTentativeMirrored' |
+  'Inbox' |
+  'VoicemailRM' |
+  'EventAccepted' |
+  'EventTentative' |
+  'EventTentativeMirrored' |
+  'EventDeclined'
+  ;
\ No newline at end of file
diff --git a/packages/styling/src/styles/DefaultFontStyles.ts b/packages/styling/src/styles/DefaultFontStyles.ts
index 0505cf12a549f..627d1476bf476 100644
--- a/packages/styling/src/styles/DefaultFontStyles.ts
+++ b/packages/styling/src/styles/DefaultFontStyles.ts
@@ -64,7 +64,7 @@ const LanguageToFontMap = {
   'zh-hant': FontFamilyChineseTraditional,
 };
 
-const FontFileVersion = 2.35;
+const FontFileVersion = 2.38;
 
 // Standard font sizes.
 export namespace FontSizes {
diff --git a/packages/styling/src/styles/IconCodes.ts b/packages/styling/src/styles/IconCodes.ts
index 334b86bada74f..7e3d294881562 100644
--- a/packages/styling/src/styles/IconCodes.ts
+++ b/packages/styling/src/styles/IconCodes.ts
@@ -2838,4 +2838,96 @@ export const IconCodes = {
   tripleColumn: '\uF1D5',
   columnLeftTwoThirds: '\uF1D6',
   columnRightTwoThirds: '\uF1D7',
+
+  // 2.38 Additions
+
+  /**
+   * Icon code with the value '\uF412'.
+   */
+  filterSolid: '\uF412',
+  /**
+   * Icon code with the value '\uF232'.
+   */
+  gridViewSmall: '\uF232',
+  /**
+   * Icon code with the value '\uF233'.
+   */
+  gridViewMedium: '\uF233',
+  /**
+   * Icon code with the value '\uF234'.
+   */
+  gridViewLarge: '\uF234',
+  /**
+   * Icon code with the value '\uEC4E'.
+   */
+  thisPc: '\uEC4E',
+  /**
+   * Icon code with the value '\uF415'.
+   */
+  mailUndelivered: '\uF415',
+  /**
+   * Icon code with value '\uF416'.
+   */
+  mailTentative: '\uF416',
+  /**
+   * Icon code with value '\uF417'.
+   */
+  mailTentativeMirrored: '\uF417',
+  /**
+   * Icon code with value '\uf418'.
+   */
+  mailReminder: '\uf418',
+  /**
+   * Icon code with value '\uF41D'.
+   */
+  irmReply: '\uF41D',
+  /**
+   * Icon code with value '\uF41E'.
+   */
+  irmReplyMirrored: '\uF41E',
+  /**
+   * Icon code with value '\uF41F'.
+   */
+  irmForward: '\uF41F',
+  /**
+   * Icon code with value '\uF420'.
+   */
+  irmForwardMirrored: '\uF420',
+  /**
+   * Icon code with value '\uF419'.
+   */
+  receiptUndelivered: '\uF419',
+  /**
+   * Icon code with value '\uF41A'.
+   */
+  receiptTentative: '\uF41A',
+  /**
+   * Icon code with value '\uF41B'.
+   */
+  receiptTentativeMirrored: '\uF41B',
+  /**
+   * Icon code with value '\uF41C'.
+   */
+  inbox: '\uF41C',
+  /**
+   * Icon code with value '\uF421'.
+   */
+  voicemailRM: '\uF421',
+  /**
+   * Icon code with value '\uF422'.
+   */
+  eventAccepted: '\uF422',
+  /**
+   * Icon code with value '\uF423'.
+   */
+  eventTentative: '\uF423',
+  /**
+   * Icon code with value '\uF424'.
+   */
+  eventTentativeMirrored: '\uF424',
+  /**
+   * Icon code with value '\uF425'.
+   */
+  eventDeclined: '\uF425',
+
 };

From 6c84d750f0c2446449368200e23c2aede7ab04f5 Mon Sep 17 00:00:00 2001
From: Joe Martella <martellaj@live.com>
Date: Wed, 26 Jul 2017 17:14:18 -0700
Subject: [PATCH 0313/1641] [BasePicker] Adds prop to process selection (#2312)

* Adds "onItemSelected" prop to BasePicker

* Adds change file

* Removes unnecessary "key" prop from example component
---
 ...er-process-selection_2017-07-26-23-47.json | 11 ++++++++
 .../components/pickers/BasePicker.Props.ts    |  4 +++
 .../src/components/pickers/BasePicker.tsx     | 16 +++++++++--
 .../examples/PeoplePicker.Types.Example.tsx   | 28 ++++++++++++++++++-
 4 files changed, 56 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/joem-peoplepicker-process-selection_2017-07-26-23-47.json

diff --git a/common/changes/office-ui-fabric-react/joem-peoplepicker-process-selection_2017-07-26-23-47.json b/common/changes/office-ui-fabric-react/joem-peoplepicker-process-selection_2017-07-26-23-47.json
new file mode 100644
index 0000000000000..75882cf448da1
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/joem-peoplepicker-process-selection_2017-07-26-23-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Adds prop to process selection in BasePicker",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joem@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
index 7ea9db0c283d3..806b754e4dfa6 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
@@ -82,6 +82,10 @@ export interface IBasePickerProps<T> extends React.Props<any> {
    * @default ''
    */
   removeButtonAriaLabel?: string;
+  /**
+   * A callback to process a selection after the user selects something from the picker.
+   */
+  onItemSelected?: (selectedItem?: T) => T | PromiseLike<T>;
 }
 
 export interface IBasePickerSuggestionsProps {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 5807ea4feac6e..0fbd0d4bb2970 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -463,8 +463,20 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   @autobind
   protected addItem(item: T) {
-    let newItems: T[] = this.state.items.concat([item]);
-    this.setState({ items: newItems }, () => this.onChange());
+    let processedItem: T | PromiseLike<T> = this.props.onItemSelected ? this.props.onItemSelected(item) : item;
+
+    let processedItemObject: T = processedItem as T;
+    let processedItemPromiseLike: PromiseLike<T> = processedItem as PromiseLike<T>;
+
+    if (processedItemPromiseLike && processedItemPromiseLike.then) {
+      processedItemPromiseLike.then((resolvedProcessedItem: T) => {
+        let newItems: T[] = this.state.items.concat([resolvedProcessedItem]);
+        this.setState({ items: newItems }, () => this.onChange());
+      });
+    } else {
+      let newItems: T[] = this.state.items.concat([processedItemObject]);
+      this.setState({ items: newItems }, () => this.onChange());
+    }
   }
 
   @autobind
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index f10dbc74deaa4..6df5d056239f9 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -84,6 +84,8 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
       case 5:
         currentPicker = this._renderLimitedSearch();
         break;
+      case 6:
+        currentPicker = this._renderProcessSelectionPicker();
       default:
     }
 
@@ -97,7 +99,8 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
               { key: 2, text: 'Compact' },
               { key: 3, text: 'Members List' },
               { key: 4, text: 'Preselected Items' },
-              { key: 5, text: 'Limit Search' }
+              { key: 5, text: 'Limit Search' },
+              { key: 6, text: 'Process Selection' }
             ] }
             selectedKey={ this.state.currentPicker }
             onChanged={ this._dropDownSelected }
@@ -189,6 +192,22 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     );
   }
 
+  public _renderProcessSelectionPicker() {
+    return (
+      <NormalPeoplePicker
+        onResolveSuggestions={ this._onFilterChanged }
+        onEmptyInputFocus={ this._returnMostRecentlyUsed }
+        getTextFromItem={ (persona: IPersonaProps) => persona.primaryText as string }
+        pickerSuggestionsProps={ suggestionProps }
+        className={ 'ms-PeoplePicker' }
+        onRemoveSuggestion={ this._onRemoveSuggestion }
+        onValidateInput={ this._validateInput }
+        removeButtonAriaLabel={ 'Remove' }
+        onItemSelected={ this._onItemSelected }
+      />
+    );
+  }
+
   @autobind
   private _renderFooterText(): JSX.Element {
     return <div>No additional results</div>;
@@ -216,6 +235,13 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     }
   }
 
+  @autobind
+  private _onItemSelected(item: IPersonaProps) {
+    const processedItem = Object.assign({}, item);
+    processedItem.primaryText = `${item.primaryText} (selected)`;
+    return new Promise<IPersonaProps>((resolve, reject) => setTimeout(() => resolve(processedItem), 250));
+  }
+
   @autobind
   private _onFilterChanged(filterText: string, currentPersonas: IPersonaProps[], limitResults?: number) {
     if (filterText) {

From 0a25f628156487f5767dec48629187098762493c Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Wed, 26 Jul 2017 17:32:24 -0700
Subject: [PATCH 0314/1641] More strictNullCheck fixes for
 office-ui-fabric-react (#2298)

* Fix positioning

* Fix withResponsiveMode

* Fix ResizeGroup

* Fix swatchColorPicker

* Fix MessageBar

* Fix DataPicker and DetailsHeader

* Fix contextualMenu

* Fix command bar

* Fix calloutcontent

* Fix choicegroup

* Fix colorslider

* More fixes

* Fix Calendar

* Rush change
---
 .../oufr-strict-null3_2017-07-24-21-40.json   | 11 +++
 .../components/ActivityItem/ActivityItem.tsx  | 46 ++++++++-----
 .../Button/BaseButton.classNames.ts           |  2 +-
 .../src/components/Button/BaseButton.tsx      | 67 ++++++++++---------
 .../src/components/Calendar/Calendar.Props.ts |  4 +-
 .../src/components/Calendar/Calendar.test.tsx | 22 +++---
 .../src/components/Calendar/Calendar.tsx      | 30 ++++-----
 .../src/components/Callout/CalloutContent.tsx | 56 ++++++++--------
 .../components/ChoiceGroup/ChoiceGroup.tsx    | 22 +++---
 .../components/ColorPicker/ColorRectangle.tsx |  6 +-
 .../components/ColorPicker/ColorSlider.tsx    |  8 +--
 .../src/components/CommandBar/CommandBar.tsx  | 46 ++++++-------
 .../ContextualMenu/ContextualMenu.test.tsx    |  8 +--
 .../ContextualMenu/ContextualMenu.tsx         | 40 +++++------
 .../ContextualMenu.Checkmarks.Example.tsx     | 16 ++---
 .../components/DatePicker/DatePicker.Props.ts |  6 +-
 .../src/components/DatePicker/DatePicker.tsx  | 18 ++---
 .../components/DetailsList/DetailsHeader.tsx  | 32 ++++-----
 .../components/MessageBar/MessageBar.Props.ts |  3 +-
 .../src/components/MessageBar/MessageBar.tsx  | 10 +--
 .../ResizeGroup/ResizeGroup.test.tsx          |  6 +-
 .../components/ResizeGroup/ResizeGroup.tsx    | 10 +--
 .../SwatchColorPicker.Basic.Example.tsx       | 12 ++--
 .../decorators/withResponsiveMode.tsx         |  4 +-
 .../src/utilities/positioning.ts              |  6 +-
 25 files changed, 259 insertions(+), 232 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/oufr-strict-null3_2017-07-24-21-40.json

diff --git a/common/changes/office-ui-fabric-react/oufr-strict-null3_2017-07-24-21-40.json b/common/changes/office-ui-fabric-react/oufr-strict-null3_2017-07-24-21-40.json
new file mode 100644
index 0000000000000..5fe04f31527f1
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/oufr-strict-null3_2017-07-24-21-40.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "More type casting to get us on the path to enabling strictNullChecks",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "<christianjordangonzalez@gmail.com>"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
index a1ecd941df1fb..f476313bb3d96 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
@@ -41,9 +41,9 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
     this._styles = getStyles(undefined, customStyles);
     this._classNames = this._getClassNames(
       this._styles,
-      this.props.className,
-      this.props.activityPersonas,
-      this.props.isCompact
+      this.props.className!,
+      this.props.activityPersonas!,
+      this.props.isCompact!
     );
 
     return (
@@ -66,42 +66,59 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
   }
 
   @autobind
-  private _onRenderIcon(props: IActivityItemProps): JSX.Element {
+  private _onRenderIcon(props: IActivityItemProps): JSX.Element | null {
     if (props.activityPersonas) {
       return this._onRenderPersonaArray(props);
     }
+
+    return null;
   }
 
   @autobind
-  private _onRenderActivityDescription(props: IActivityItemProps): JSX.Element {
+  private _onRenderActivityDescription(props: IActivityItemProps): JSX.Element | null {
     if (props.activityDescriptionText) {
       return (<span className={ this._classNames.activityText }>{ props.activityDescriptionText }</span>);
     }
+
+    return null;
   }
 
   @autobind
-  private _onRenderComments(props: IActivityItemProps): JSX.Element {
+  private _onRenderComments(props: IActivityItemProps): JSX.Element | null {
     if (!props.isCompact && props.commentText) {
       return (<div className={ this._classNames.commentText }>{ props.commentText }</div>);
     }
+
+    return null;
   }
 
   @autobind
-  private _onRenderTimeStamp(props: IActivityItemProps): JSX.Element {
+  private _onRenderTimeStamp(props: IActivityItemProps): JSX.Element | null {
     if (!props.isCompact && props.timeStamp) {
       return (<div className={ this._classNames.timeStamp }>{ props.timeStamp }</div>);
     }
+
+    return null;
   }
 
   // If activityPersonas is an array of persona props, build the persona cluster element.
   @autobind
-  private _onRenderPersonaArray(props: IActivityItemProps): JSX.Element {
-    let personaElement: JSX.Element;
-    let activityPersonas: Array<IPersonaProps & { key?: string | number }> = props.activityPersonas;
+  private _onRenderPersonaArray(props: IActivityItemProps): JSX.Element | null {
+    let personaElement: JSX.Element | null = null;
+    let activityPersonas = props.activityPersonas as Array<IPersonaProps & { key?: string | number }>;
     if (activityPersonas[0].imageUrl || activityPersonas[0].imageInitials) {
       let personaList: Array<JSX.Element> = [];
       let showSize16Personas = (activityPersonas.length > 1 || props.isCompact);
       let personaLimit = props.isCompact ? 3 : 4;
+      let style: React.CSSProperties | undefined = undefined;
+      if (props.isCompact) {
+        style = {
+          display: 'inline-block',
+          width: '8px',
+          minWidth: '8px',
+          overflow: 'visible'
+        };
+      }
       activityPersonas.filter((person, index) => index < personaLimit).forEach((person, index) => {
         personaList.push(
           <Persona
@@ -111,14 +128,7 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
             className={ this._classNames.activityPersona }
             size={ showSize16Personas ? PersonaSize.size16 : PersonaSize.extraSmall }
             hidePersonaDetails={ true }
-            style={
-              props.isCompact && {
-                display: 'inline-block',
-                width: '8px',
-                minWidth: '8px',
-                overflow: 'visible'
-              }
-            } />
+            style={ style } />
         );
       });
       personaElement = <div className={ this._classNames.personaContainer }>{ personaList }</div>;
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
index 879f6073b136c..c910bf60a45b7 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
@@ -16,7 +16,7 @@ export const getClassNames = memoizeFunction((
   styles: IButtonStyles,
   className: string,
   variantClassName: string,
-  iconClassName: string,
+  iconClassName: string | undefined,
   disabled: boolean,
   checked: boolean,
   expanded: boolean
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 6d0f4c3d87b36..541a945a387ad 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -57,11 +57,11 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     this._warnConditionallyRequiredProps(
       ['menuProps', 'onClick'],
       'split',
-      this.props.split
+      this.props.split!
     );
 
     this._warnDeprecations({
-      rootProps: null,
+      rootProps: undefined,
       icon: 'iconProps',
       menuIconName: 'menuIconProps',
       toggled: 'checked'
@@ -91,12 +91,12 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
          } = this.props;
 
     this._classNames = getClassNames(
-      styles,
-      className,
-      variantClassName,
+      styles!,
+      className!,
+      variantClassName!,
       iconProps && iconProps.className,
-      disabled,
-      checked,
+      disabled!,
+      checked!,
       this.state.menuProps != null && !this.props.split
     );
 
@@ -218,7 +218,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   }
 
   @autobind
-  private _onRenderIcon(buttonProps?: IButtonProps, defaultRender?: IRenderFunction<IButtonProps>) {
+  private _onRenderIcon(buttonProps?: IButtonProps, defaultRender?: IRenderFunction<IButtonProps>): JSX.Element | null {
     let {
       baseClassName,
       disabled,
@@ -234,16 +234,17 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       } as IIconProps;
     }
 
-    return iconProps && (
-      Icon({
+    if (iconProps) {
+      return Icon({
         ...iconProps,
         className: this._classNames.icon
-      })
-    );
+      });
+    }
+    return null;
   }
 
   @autobind
-  private _onRenderText() {
+  private _onRenderText(): JSX.Element | null {
     let {
       children,
       disabled,
@@ -256,14 +257,18 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       text = children;
     }
 
-    return text && (
-      <span
-        className={ this._classNames.label }
-        id={ this._labelId }
-      >
-        { text }
-      </span>
-    );
+    if (text) {
+      return (
+        <span
+          className={ this._classNames.label }
+          id={ this._labelId }
+        >
+          { text }
+        </span>
+      );
+    }
+
+    return null;
   }
 
   @autobind
@@ -306,7 +311,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     // If ariaDescription is given, descriptionId will be assigned to ariaDescriptionSpan,
     // otherwise it will be assigned to descriptionSpan.
     return ariaDescription ? (
-      <span className={ styles.screenReaderText as string } id={ this._ariaDescriptionId }>{ ariaDescription }</span>
+      <span className={ styles!.screenReaderText as string } id={ this._ariaDescriptionId }>{ ariaDescription }</span>
     ) : (
         null
       );
@@ -376,9 +381,9 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         aria-expanded={ this._isExpanded }
         aria-pressed={ this.props.checked }
         aria-describedby={ buttonProps.ariaDescription }
-        className={ css(disabled ? styles.splitButtonContainerDisabled : styles.splitButtonContainer) }
+        className={ css(disabled ? styles!.splitButtonContainerDisabled : styles!.splitButtonContainer) }
         tabIndex={ 0 }
-        onKeyDown={ this.props.disabled ? null : this._onSplitButtonKeyDown }
+        onKeyDown={ this.props.disabled ? undefined : this._onSplitButtonKeyDown }
       >
         <span aria-hidden={ true } style={ { 'display': 'flex' } }>
           { this._onRenderContent(tag, buttonProps) }
@@ -407,21 +412,21 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         tabIndex={ -1 }
         styles={ {
           root: mergeStyles(
-            styles.splitButtonMenuButton,
+            styles!.splitButtonMenuButton,
             !!this.state.menuProps && [
-              styles.splitButtonMenuButtonExpanded
+              styles!.splitButtonMenuButtonExpanded
             ],
             disabled && [
-              styles.splitButtonMenuButtonDisabled
+              styles!.splitButtonMenuButtonDisabled
             ],
           ) as string,
-          rootChecked: styles.splitButtonMenuButtonChecked,
-          icon: disabled ? styles.splitButtonMenuIconDisabled : styles.splitButtonMenuIcon
+          rootChecked: styles!.splitButtonMenuButtonChecked,
+          icon: disabled ? styles!.splitButtonMenuIconDisabled : styles!.splitButtonMenuIcon
         } }
         checked={ this.props.checked }
         disabled={ this.props.disabled }
         onClick={ this._onToggleMenu }
-        menuProps={ null }
+        menuProps={ undefined }
         iconProps={ menuIconProps } />
     );
   }
@@ -431,7 +436,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     switch (ev.which) {
       case KeyCodes.enter:
       case KeyCodes.space:
-        this.props.onClick(null);
+        (this.props.onClick as any)(null);
         return;
     }
 
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
index 8a1be7bb53a8e..878344a8c7fad 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { Calendar } from './Calendar';
 import { DayOfWeek, DateRangeType } from '../../utilities/dateValues/DateValues';
 
-export { DayOfWeek, DateRangeType }
+export { DayOfWeek, DateRangeType };
 
 export interface ICalendar {
   /** Sets focus to the selected date. */
@@ -86,7 +86,7 @@ export interface ICalendarProps extends React.Props<Calendar> {
   /**
    * Localized strings to use in the Calendar
    */
-  strings: ICalendarStrings;
+  strings: ICalendarStrings | null;
 
   /**
   * Whether the month picker should highlight the current month
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
index 18b83bf35ddae..ab4e21b617a11 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
@@ -127,13 +127,13 @@ describe('Calendar', () => {
       // This test will likely fail around midnight.
       let today = new Date();
       expect(renderedComponent.state.selectedDate).to.not.be.null;
-      expect(renderedComponent.state.selectedDate.getDate()).to.equal(today.getDate());
-      expect(renderedComponent.state.selectedDate.getMonth()).to.equal(today.getMonth());
-      expect(renderedComponent.state.selectedDate.getFullYear()).to.equal(today.getFullYear());
+      expect(renderedComponent.state.selectedDate!.getDate()).to.equal(today.getDate());
+      expect(renderedComponent.state.selectedDate!.getMonth()).to.equal(today.getMonth());
+      expect(renderedComponent.state.selectedDate!.getFullYear()).to.equal(today.getFullYear());
       expect(renderedComponent.state.navigatedDate).to.not.be.null;
-      expect(renderedComponent.state.navigatedDate.getDate()).to.equal(today.getDate());
-      expect(renderedComponent.state.navigatedDate.getMonth()).to.equal(today.getMonth());
-      expect(renderedComponent.state.navigatedDate.getFullYear()).to.equal(today.getFullYear());
+      expect(renderedComponent.state.navigatedDate!.getDate()).to.equal(today.getDate());
+      expect(renderedComponent.state.navigatedDate!.getMonth()).to.equal(today.getMonth());
+      expect(renderedComponent.state.navigatedDate!.getFullYear()).to.equal(today.getFullYear());
     });
 
     it('Verify go to today', () => {
@@ -146,7 +146,7 @@ describe('Calendar', () => {
   describe('Test rendering most complicated calendar', () => {
     let renderedComponent: Calendar;
     let defaultDate: Date;
-    let lastSelectedDateRange: Date[] = null;
+    let lastSelectedDateRange: Date[] | null = null;
 
     before(() => {
       defaultDate = new Date(2017, 2, 16);
@@ -221,8 +221,8 @@ describe('Calendar', () => {
       let day = days[8]; // 03/08/2017
       ReactTestUtils.Simulate.click(day);
       expect(lastSelectedDateRange).to.not.be.null;
-      expect(lastSelectedDateRange.length).to.equal(7);
-      lastSelectedDateRange.forEach((val, i) => expect(compareDates(val, new Date(2017, 2, 7 + i))).is.true);
+      expect(lastSelectedDateRange!.length).to.equal(7);
+      lastSelectedDateRange!.forEach((val, i) => expect(compareDates(val, new Date(2017, 2, 7 + i))).is.true);
     });
 
     it('Verify navigate to day in different month', () => {
@@ -232,8 +232,8 @@ describe('Calendar', () => {
       let firstDate = new Date(2017, 2, 28);
       ReactTestUtils.Simulate.click(day);
       expect(lastSelectedDateRange).to.not.be.null;
-      expect(lastSelectedDateRange.length).to.equal(7);
-      lastSelectedDateRange.forEach((val, i) => expect(compareDates(val, addDays(firstDate, i))).is.true);
+      expect(lastSelectedDateRange!.length).to.equal(7);
+      lastSelectedDateRange!.forEach((val, i) => expect(compareDates(val, addDays(firstDate, i))).is.true);
     });
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index cd7faba2eb80a..bfde782f666de 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -23,11 +23,11 @@ export interface ICalendarState {
 
 export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> implements ICalendar {
   public static defaultProps: ICalendarProps = {
-    onSelectDate: null,
-    onDismiss: null,
+    onSelectDate: undefined,
+    onDismiss: undefined,
     isMonthPickerVisible: true,
     isDayPickerVisible: true,
-    value: null,
+    value: undefined,
     today: new Date(),
     firstDayOfWeek: DayOfWeek.Sunday,
     dateRangeType: DateRangeType.Day,
@@ -63,7 +63,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
 
     // Make sure auto-navigation is supported for programmatic changes to selected date, i.e.,
     // if selected date is updated via props, we may need to modify the navigated date
-    let overrideNavigatedDate = (autoNavigateOnSelection && !compareDates(value, this.props.value));
+    let overrideNavigatedDate = (autoNavigateOnSelection && !compareDates(value!, this.props.value!));
     if (overrideNavigatedDate) {
       this.setState({
         navigatedDate: value
@@ -106,25 +106,25 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
             <div className={ css('ms-DatePicker-frame', styles.frame) }>
               <div className={ css('ms-DatePicker-wrap', styles.wrap) }>
                 { isDayPickerVisible && <CalendarDay
-                  selectedDate={ selectedDate }
-                  navigatedDate={ navigatedDate }
+                  selectedDate={ selectedDate! }
+                  navigatedDate={ navigatedDate! }
                   today={ this.props.today }
                   onSelectDate={ this._onSelectDate }
                   onNavigateDate={ this._onNavigateDate }
                   onDismiss={ this.props.onDismiss }
-                  firstDayOfWeek={ firstDayOfWeek }
-                  dateRangeType={ dateRangeType }
-                  autoNavigateOnSelection={ autoNavigateOnSelection }
-                  strings={ strings }
+                  firstDayOfWeek={ firstDayOfWeek! }
+                  dateRangeType={ dateRangeType! }
+                  autoNavigateOnSelection={ autoNavigateOnSelection! }
+                  strings={ strings! }
                   ref='dayPicker' />
                 }
 
                 { isMonthPickerVisible && <CalendarMonth
-                  navigatedDate={ navigatedDate }
-                  strings={ strings }
+                  navigatedDate={ navigatedDate! }
+                  strings={ strings! }
                   onNavigateDate={ this._onNavigateDate }
                   today={ this.props.today }
-                  highlightCurrentMonth={ highlightCurrentMonth }
+                  highlightCurrentMonth={ highlightCurrentMonth! }
                   ref='monthPicker' /> }
 
                 { showGoToToday &&
@@ -134,7 +134,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                     onClick={ this._onGotoToday }
                     onKeyDown={ this._onGotoTodayKeyDown }
                     tabIndex={ 0 }>
-                    { strings.goToToday }
+                    { strings!.goToToday }
                   </span>
                 }
               </div>
@@ -184,7 +184,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
 
   @autobind
   private _onGotoToday() {
-    this._navigateDay(this.props.today);
+    this._navigateDay(this.props.today!);
     this._focusOnUpdate = true;
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index 0142e060f6757..132eb9c6fbffb 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -48,9 +48,9 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
   private _calloutElement: HTMLDivElement;
   private _targetWindow: Window;
   private _bounds: IRectangle;
-  private _maxHeight: number;
+  private _maxHeight: number | undefined;
   private _positionAttempts: number;
-  private _target: HTMLElement | MouseEvent;
+  private _target: HTMLElement | MouseEvent | null;
   private _setHeightOffsetTimer: number;
 
   constructor(props: ICalloutProps) {
@@ -60,9 +60,9 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
 
     this._didSetInitialFocus = false;
     this.state = {
-      positions: null,
-      slideDirectionalClassName: null,
-      calloutElementRect: null,
+      positions: undefined,
+      slideDirectionalClassName: undefined,
+      calloutElementRect: undefined,
       heightOffset: 0
     };
     this._positionAttempts = 0;
@@ -75,14 +75,14 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
 
   public componentWillMount() {
     let target = this.props.targetElement ? this.props.targetElement : this.props.target;
-    this._setTargetWindowAndElement(target);
+    this._setTargetWindowAndElement(target!);
   }
 
   public componentWillUpdate(newProps: ICalloutProps) {
     if (newProps.targetElement !== this.props.targetElement || newProps.target !== this.props.target) {
       let newTarget = newProps.targetElement ? newProps.targetElement : newProps.target;
       this._maxHeight = undefined;
-      this._setTargetWindowAndElement(newTarget);
+      this._setTargetWindowAndElement(newTarget!);
     }
     if (newProps.gapSpace !== this.props.gapSpace || this.props.beakWidth !== newProps.beakWidth) {
       this._maxHeight = undefined;
@@ -133,8 +133,8 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       ? (AnimationClassNames as any)[positions.directionalClassName]
       : '';
 
-    let contentMaxHeight: number = this._getMaxHeight() + this.state.heightOffset;
-    let beakVisible: boolean = isBeakVisible && (!!targetElement || !!target);
+    let contentMaxHeight: number = this._getMaxHeight() + this.state.heightOffset!;
+    let beakVisible = isBeakVisible && (!!targetElement || !!target);
     let content = (
       <div
         ref={ this._resolveRef('_hostElement') }
@@ -245,16 +245,16 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
     let calloutElement: HTMLElement = this._calloutElement;
 
     if (hostElement && calloutElement) {
-      let currentProps: IPositionProps;
+      let currentProps: IPositionProps | undefined;
       currentProps = assign(currentProps, this.props);
-      currentProps.bounds = this._getBounds();
+      currentProps!.bounds = this._getBounds();
       // Temporary to be removed when targetElement is removed. Currently deprecated.
       if (this.props.targetElement) {
-        currentProps.targetElement = this._target as HTMLElement;
+        currentProps!.targetElement = this._target as HTMLElement;
       } else {
-        currentProps.target = this._target;
+        currentProps!.target = this._target!;
       }
-      let newPositions: IPositionInfo = getRelativePositions(currentProps, hostElement, calloutElement);
+      let newPositions: IPositionInfo = getRelativePositions(currentProps!, hostElement, calloutElement);
 
       // Set the new position only when the positions are not exists or one of the new callout positions are different.
       // The position should not change if the position is within 2 decimal places.
@@ -282,12 +282,12 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
 
       if (!currentBounds) {
         currentBounds = {
-          top: 0 + this.props.minPagePadding,
-          left: 0 + this.props.minPagePadding,
-          right: this._targetWindow.innerWidth - this.props.minPagePadding,
-          bottom: this._targetWindow.innerHeight - this.props.minPagePadding,
-          width: this._targetWindow.innerWidth - this.props.minPagePadding * 2,
-          height: this._targetWindow.innerHeight - this.props.minPagePadding * 2
+          top: 0 + this.props.minPagePadding!,
+          left: 0 + this.props.minPagePadding!,
+          right: this._targetWindow.innerWidth - this.props.minPagePadding!,
+          bottom: this._targetWindow.innerHeight - this.props.minPagePadding!,
+          width: this._targetWindow.innerWidth - this.props.minPagePadding! * 2,
+          height: this._targetWindow.innerHeight - this.props.minPagePadding! * 2
         };
       }
       this._bounds = currentBounds;
@@ -300,7 +300,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       if (this.props.directionalHintFixed && this._target) {
         let beakWidth = this.props.isBeakVisible ? this.props.beakWidth : 0;
         let gapSpace = this.props.gapSpace ? this.props.gapSpace : 0;
-        this._maxHeight = getMaxHeight(this._target, this.props.directionalHint, beakWidth + gapSpace, this._getBounds());
+        this._maxHeight = getMaxHeight(this._target, this.props.directionalHint!, beakWidth! + gapSpace, this._getBounds());
       } else {
         this._maxHeight = this._getBounds().height - BORDER_WIDTH * 2;
       }
@@ -329,19 +329,19 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
   private _setTargetWindowAndElement(target: HTMLElement | string | MouseEvent): void {
     if (target) {
       if (typeof target === 'string') {
-        let currentDoc: Document = getDocument();
+        let currentDoc: Document = getDocument()!;
         this._target = currentDoc ? currentDoc.querySelector(target) as HTMLElement : null;
-        this._targetWindow = getWindow();
+        this._targetWindow = getWindow()!;
       } else if ((target as MouseEvent).stopPropagation) {
         this._target = target;
-        this._targetWindow = getWindow((target as MouseEvent).toElement as HTMLElement);
+        this._targetWindow = getWindow((target as MouseEvent).toElement as HTMLElement)!;
       } else {
         let targetElement: HTMLElement = target as HTMLElement;
         this._target = target;
-        this._targetWindow = getWindow(targetElement);
+        this._targetWindow = getWindow(targetElement)!;
       }
     } else {
-      this._targetWindow = getWindow();
+      this._targetWindow = getWindow()!;
     }
   }
 
@@ -354,10 +354,10 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
         const scrollDiff: number = cardScrollHeight - cardCurrHeight;
 
         this.setState({
-          heightOffset: this.state.heightOffset + scrollDiff
+          heightOffset: this.state.heightOffset! + scrollDiff
         });
 
-        if (calloutMainElem.offsetHeight < this.props.finalHeight) {
+        if (calloutMainElem.offsetHeight < this.props.finalHeight!) {
           this._setHeightOffsetEveryFrame();
         } else {
           this._async.cancelAnimationFrame(this._setHeightOffsetTimer);
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
index 85341dde30d90..9aa5e10f2ad3d 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
@@ -38,7 +38,7 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
 
     this.state = {
       keyChecked: (props.defaultSelectedKey === undefined) ?
-        this._getKeyChecked(props) :
+        this._getKeyChecked(props)! :
         props.defaultSelectedKey,
       keyFocused: undefined
     };
@@ -53,7 +53,7 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
 
     if (newKeyChecked !== oldKeyCheched) {
       this.setState({
-        keyChecked: newKeyChecked,
+        keyChecked: newKeyChecked!,
       });
     }
   }
@@ -74,7 +74,7 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
             <Label className={ className } required={ required } id={ this._id + '-label' }>{ label }</Label>
           ) }
 
-          { options.map((option: IChoiceGroupOption) => {
+          { options!.map((option: IChoiceGroupOption) => {
             let {
               onRenderField = this._onRenderField,
               onRenderLabel = this._onRenderLabel
@@ -168,8 +168,8 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
               >
                 <Image
                   src={ option.imageSrc }
-                  width={ option.imageSize ? option.imageSize.width : null }
-                  height={ option.imageSize ? option.imageSize.height : null }
+                  width={ option.imageSize ? option.imageSize.width : undefined }
+                  height={ option.imageSize ? option.imageSize.height : undefined }
                 />
               </div>
               <div className={ css(
@@ -181,8 +181,8 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
               >
                 <Image
                   src={ option.selectedImageSrc }
-                  width={ option.imageSize ? option.imageSize.width : null }
-                  height={ option.imageSize ? option.imageSize.height : null }
+                  width={ option.imageSize ? option.imageSize.width : undefined }
+                  height={ option.imageSize ? option.imageSize.height : undefined }
                 />
               </div>
             </div>
@@ -201,9 +201,9 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
           option.imageSrc || option.iconProps
             ? (
               <div className={ css('ms-ChoiceField-labelWrapper', styles.labelWrapper) }>
-                { onRenderLabel(option) }
+                { onRenderLabel!(option) }
               </div>
-            ) : onRenderLabel(option)
+            ) : onRenderLabel!(option)
         }
       </label>
     );
@@ -237,12 +237,12 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
    * If all the isChecked property of options are falsy values, return undefined;
    * Else return the key of the first option with the truthy isChecked property.
    */
-  private _getKeyChecked(props: IChoiceGroupProps): string | number {
+  private _getKeyChecked(props: IChoiceGroupProps): string | number | undefined {
     if (props.selectedKey !== undefined) {
       return props.selectedKey;
     }
 
-    const optionsChecked = props.options.filter((option: IChoiceGroupOption) => {
+    const optionsChecked = props.options!.filter((option: IChoiceGroupOption) => {
       return option.checked;
     });
 
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx
index debafb5d49b64..45f59d66a5580 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx
@@ -47,7 +47,7 @@ export class ColorRectangle extends BaseComponent<IColorRectangleProps, IColorPi
 
     this.state = {
       isAdjusting: false,
-      origin: null,
+      origin: undefined,
       color: color,
       fullColorString: getFullColorString(color)
     };
@@ -74,7 +74,7 @@ export class ColorRectangle extends BaseComponent<IColorRectangleProps, IColorPi
       <div ref='root' className={ css('ms-ColorPicker-colorRect', styles.colorRect) } style={ { minWidth: minSize, minHeight: minSize, backgroundColor: fullColorString } } onMouseDown={ this._onMouseDown }>
         <div className={ css('ms-ColorPicker-light', styles.light) } />
         <div className={ css('ms-ColorPicker-dark', styles.dark) } />
-        <div className={ css('ms-ColorPicker-thumb', styles.thumb) } style={ { left: color.s + '%', top: (MAX_COLOR_VALUE - color.v) + '%', backgroundColor: color.str } } />
+        <div className={ css('ms-ColorPicker-thumb', styles.thumb) } style={ { left: color!.s + '%', top: (MAX_COLOR_VALUE - color!.v) + '%', backgroundColor: color!.str } } />
       </div>
     );
   }
@@ -121,7 +121,7 @@ export class ColorRectangle extends BaseComponent<IColorRectangleProps, IColorPi
 
     this.setState({
       isAdjusting: false,
-      origin: null
+      origin: undefined
     });
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
index 15e4b09961130..6525a2180f0ab 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
@@ -46,7 +46,7 @@ export class ColorSlider extends BaseComponent<IColorSliderProps, IColorSliderSt
 
     this.state = {
       isAdjusting: false,
-      origin: null,
+      origin: undefined,
       currentValue: value
     };
   }
@@ -61,7 +61,7 @@ export class ColorSlider extends BaseComponent<IColorSliderProps, IColorSliderSt
     let { className, minValue, maxValue, overlayStyle } = this.props;
     let { currentValue, isAdjusting } = this.state;
 
-    let currentPercentage = 100 * (currentValue - minValue) / (maxValue - minValue);
+    let currentPercentage = 100 * (currentValue! - minValue!) / (maxValue! - minValue!);
 
     return (
       <div
@@ -90,7 +90,7 @@ export class ColorSlider extends BaseComponent<IColorSliderProps, IColorSliderSt
     let rectSize = this.refs.root.getBoundingClientRect();
 
     let currentPercentage = (ev.clientX - rectSize.left) / rectSize.width;
-    let newValue = Math.min(maxValue, Math.max(minValue, currentPercentage * maxValue));
+    let newValue = Math.min(maxValue!, Math.max(minValue!, currentPercentage * maxValue!));
 
     this.setState({
       isAdjusting: true,
@@ -111,7 +111,7 @@ export class ColorSlider extends BaseComponent<IColorSliderProps, IColorSliderSt
 
     this.setState({
       isAdjusting: false,
-      origin: null
+      origin: undefined
     });
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index bad0660501fca..c55bffe795c78 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -53,7 +53,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
 
   private _id: string;
   private _overflowWidth: number;
-  private _commandItemWidths: { [key: string]: number };
+  private _commandItemWidths: { [key: string]: number } | null;
 
   constructor(props: ICommandBarProps) {
     super(props);
@@ -112,8 +112,8 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
         { searchBox }
         <FocusZone ref='focusZone' className={ styles.container } direction={ FocusZoneDirection.horizontal } role='menubar' >
           <div className={ css('ms-CommandBar-primaryCommands', styles.primaryCommands) } ref='commandSurface'>
-            { renderedItems.map((item, index) => (
-              this._renderItemInCommandBar(item, index, expandedMenuItemKey)
+            { renderedItems!.map((item, index) => (
+              this._renderItemInCommandBar(item, index, expandedMenuItemKey!)
             )).concat((renderedOverflowItems && renderedOverflowItems.length) ? [
               <div className={ css('ms-CommandBarItem', styles.item) } key={ OVERFLOW_KEY } ref={ OVERFLOW_KEY }>
                 <button
@@ -134,8 +134,8 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
             ] : []) }
           </div>
           <div className={ css('ms-CommandBar-sideCommands', styles.sideCommands) } ref='farCommandSurface'>
-            { renderedFarItems.map((item, index) => (
-              this._renderItemInCommandBar(item, index, expandedMenuItemKey, true)
+            { renderedFarItems!.map((item, index) => (
+              this._renderItemInCommandBar(item, index, expandedMenuItemKey!, true)
             )) }
           </div>
         </FocusZone>
@@ -294,13 +294,13 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
     let farCommandSurface = this.refs.farCommandSurface;
     let commandBarRegion = this.refs.commandBarRegion;
     let searchSurface = this.refs.searchSurface;
-    let renderedItems = [].concat(items);
+    let renderedItems = [...items];
     let renderedOverflowItems = overflowItems;
     let consumedWidth = 0;
     let isOverflowVisible = overflowItems && overflowItems.length;
 
     let style = window.getComputedStyle(commandSurface);
-    let availableWidth = commandBarRegion.clientWidth - parseInt(style.marginLeft, 10) - parseInt(style.marginRight, 10);
+    let availableWidth = commandBarRegion.clientWidth - parseInt(style.marginLeft!, 10) - parseInt(style.marginRight!, 10);
     if (searchSurface) {
       availableWidth -= searchSurface.getBoundingClientRect().width;
     }
@@ -314,14 +314,14 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
 
     for (let i = 0; i < renderedItems.length; i++) {
       let item = renderedItems[i];
-      let itemWidth = this._commandItemWidths[item.key];
+      let itemWidth = this._commandItemWidths![item.key];
 
       if ((consumedWidth + itemWidth) >= availableWidth) {
         if (i > 0 && !isOverflowVisible && (availableWidth - consumedWidth) < OVERFLOW_WIDTH) {
           i--;
         }
 
-        renderedOverflowItems = renderedItems.splice(i).concat(overflowItems);
+        renderedOverflowItems = renderedItems.splice(i).concat(overflowItems!);
         break;
       } else {
         consumedWidth += itemWidth;
@@ -330,15 +330,15 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
     }
 
     let renderedContextualMenuProps = this._getContextualMenuPropsAfterUpdate(
-      renderedItems.concat(this.state.renderedFarItems),
-      renderedOverflowItems);
+      renderedItems.concat(this.state.renderedFarItems!),
+      renderedOverflowItems!);
 
     this.setState({
       renderedItems: renderedItems,
       renderedOverflowItems: renderedOverflowItems,
-      expandedMenuItemKey: renderedContextualMenuProps ? this.state.expandedMenuItemKey : null,
-      contextualMenuProps: renderedContextualMenuProps,
-      contextualMenuTarget: renderedContextualMenuProps ? this.state.contextualMenuTarget : null
+      expandedMenuItemKey: renderedContextualMenuProps ? this.state.expandedMenuItemKey : undefined,
+      contextualMenuProps: renderedContextualMenuProps!,
+      contextualMenuTarget: renderedContextualMenuProps ? this.state.contextualMenuTarget : undefined
     });
   }
 
@@ -366,7 +366,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
       this.setState({
         expandedMenuId: ev.currentTarget.id,
         expandedMenuItemKey: OVERFLOW_KEY,
-        contextualMenuProps: { items: this.state.renderedOverflowItems },
+        contextualMenuProps: { items: this.state.renderedOverflowItems! },
         contextualMenuTarget: ev.currentTarget
       });
     }
@@ -378,13 +378,13 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
       let { contextualMenuProps } = this.state;
 
       if (contextualMenuProps && contextualMenuProps.onDismiss) {
-        this.state.contextualMenuProps.onDismiss(ev);
+        this.state.contextualMenuProps!.onDismiss!(ev);
       }
 
       this.setState({
-        expandedMenuItemKey: null,
-        contextualMenuProps: null,
-        contextualMenuTarget: null
+        expandedMenuItemKey: undefined,
+        contextualMenuProps: undefined,
+        contextualMenuTarget: undefined
       });
     } else {
       ev.stopPropagation();
@@ -395,11 +395,11 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
   private _getStateFromProps(nextProps: ICommandBarProps): ICommandBarState {
     return {
       renderedItems: nextProps.items || [],
-      renderedOverflowItems: null,
+      renderedOverflowItems: undefined,
       contextualMenuProps: this._getContextualMenuPropsAfterUpdate(
-        nextProps.items.concat(nextProps.farItems),
-        nextProps.overflowItems),
-      renderedFarItems: nextProps.farItems || null
+        nextProps.items.concat(nextProps.farItems!),
+        nextProps.overflowItems!)!,
+      renderedFarItems: nextProps.farItems || undefined
     };
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
index 178672f6d0fa7..c6ca1fb463562 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
@@ -239,9 +239,9 @@ describe('ContextualMenu', () => {
     let headerTwo = menuItems[3];
 
     expect(headerOne.className).to.not.contain('divider', 'The first item is a divider and it should be a header');
-    expect(headerOne.firstElementChild.className).to.contain('header', 'The first item was not a header');
+    expect(headerOne.firstElementChild!.className).to.contain('header', 'The first item was not a header');
     expect(dividerOne.className).to.contain('divider', 'The third item in the contextualmenu was not a divider');
-    expect(headerTwo.firstElementChild.className).to.contain('header', 'The final item was not a header');
+    expect(headerTwo.firstElementChild!.className).to.contain('header', 'The final item was not a header');
   });
 
   it('does not return a value if no items are given', () => {
@@ -275,7 +275,7 @@ describe('ContextualMenu', () => {
       />
     );
 
-    let focusedItem = document.querySelector('.testkey1').firstChild;
+    let focusedItem = document.querySelector('.testkey1')!.firstChild;
     expect(document.activeElement).to.be.eq(focusedItem, 'The first element was not focused');
   });
 
@@ -299,7 +299,7 @@ describe('ContextualMenu', () => {
       />
     );
 
-    let focusedItem = document.querySelector('.testkey1').firstChild;
+    let focusedItem = document.querySelector('.testkey1')!.firstChild;
     expect(document.activeElement).to.be.not.eq(focusedItem, 'The first element was not focused');
   });
 
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 9870d01935d86..1632e87e85fd9 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -89,7 +89,7 @@ export function getSubmenuItems(item: IContextualMenuItem) {
 
 @withResponsiveMode
 export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContextualMenuState> {
-  // The default ContextualMenu properities have no items and beak, the default submenu direction is right and top.
+  // The default ContextualMenu properties have no items and beak, the default submenu direction is right and top.
   public static defaultProps: IContextualMenuProps = {
     items: [],
     shouldFocusOnMount: true,
@@ -100,18 +100,18 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   };
 
   private _host: HTMLElement;
-  private _previousActiveElement: HTMLElement;
+  private _previousActiveElement: HTMLElement | null;
   private _isFocusingPreviousElement: boolean;
   private _enterTimerId: number;
   private _focusZone: FocusZone;
   private _targetWindow: Window;
-  private _target: HTMLElement | MouseEvent;
+  private _target: HTMLElement | MouseEvent | null;
 
   constructor(props: IContextualMenuProps) {
     super(props);
 
     this.state = {
-      contextualMenuItems: null,
+      contextualMenuItems: undefined,
       subMenuId: getId('ContextualMenu')
     };
 
@@ -131,14 +131,14 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   public componentWillUpdate(newProps: IContextualMenuProps) {
     if (newProps.targetElement !== this.props.targetElement || newProps.target !== this.props.target) {
       let newTarget = newProps.targetElement ? newProps.targetElement : newProps.target;
-      this._setTargetWindowAndElement(newTarget);
+      this._setTargetWindowAndElement(newTarget!);
     }
   }
 
   // Invoked once, both on the client and server, immediately before the initial rendering occurs.
   public componentWillMount() {
     let target = this.props.targetElement ? this.props.targetElement : this.props.target;
-    this._setTargetWindowAndElement(target);
+    this._setTargetWindowAndElement(target!);
     this._previousActiveElement = this._targetWindow ? this._targetWindow.document.activeElement as HTMLElement : null;
   }
 
@@ -157,7 +157,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       // This slight delay is required so that we can unwind the stack, let react try to mess with focus, and then
       // apply the correct focus. Without the setTimeout, we end up focusing the correct thing, and then React wants
       // to reset the focus back to the thing it thinks should have been focused.
-      setTimeout(() => this._previousActiveElement.focus(), 0);
+      setTimeout(() => this._previousActiveElement!.focus(), 0);
     }
 
     this._events.dispose();
@@ -192,7 +192,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     let hasCheckmarks = !!(items && items.some(item => !!item.canCheck));
     const submenuProps = this.state.expandedMenuItemKey ? this._getSubmenuProps() : null;
 
-    isBeakVisible = isBeakVisible === undefined ? this.props.responsiveMode <= ResponsiveMode.medium : isBeakVisible;
+    isBeakVisible = isBeakVisible === undefined ? this.props.responsiveMode! <= ResponsiveMode.medium : isBeakVisible;
     /**
      * When useTargetWidth is true, get the width of the target element and apply it for the context menu container
      */
@@ -371,11 +371,11 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     return React.createElement(
       'button',
       assign({}, getNativeProps(item, buttonProperties), itemButtonProperties),
-      this._renderMenuItemChildren(item, index, hasCheckmarks, hasIcons));
+      this._renderMenuItemChildren(item, index, !hasCheckmarks, !hasIcons));
   }
 
   private _renderMenuItemChildren(item: IContextualMenuItem, index: number, hasCheckmarks: boolean, hasIcons: boolean) {
-    let isItemChecked: boolean = item.isChecked || item.checked;
+    let isItemChecked: boolean = (item.isChecked || item.checked) as boolean;
     return (
       <div className={ css('ms-ContextualMenu-linkContent', styles.linkContent) }>
         { (hasCheckmarks) ? (
@@ -506,12 +506,12 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
   private _getSubmenuProps() {
     const { submenuTarget, expandedMenuItemKey } = this.state;
-    const item = this._findItemByKey(expandedMenuItemKey);
+    const item = this._findItemByKey(expandedMenuItemKey!);
     let submenuProps = null;
 
     if (item) {
       submenuProps = {
-        items: getSubmenuItems(item),
+        items: getSubmenuItems(item)!,
         target: submenuTarget,
         onDismiss: this._onSubMenuDismiss,
         isSubMenu: true,
@@ -531,7 +531,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
   }
 
-  private _findItemByKey(key: string): IContextualMenuItem | null {
+  private _findItemByKey(key: string): IContextualMenuItem | undefined {
     let { items } = this.props;
     for (const item of items) {
       if (item.key && item.key === key) {
@@ -547,8 +547,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     } else {
       this.setState({
         dismissedMenuItemKey: this.state.expandedMenuItemKey,
-        expandedMenuItemKey: null,
-        submenuTarget: null
+        expandedMenuItemKey: undefined,
+        submenuTarget: undefined
       });
     }
   }
@@ -556,19 +556,19 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   private _setTargetWindowAndElement(target: HTMLElement | string | MouseEvent): void {
     if (target) {
       if (typeof target === 'string') {
-        let currentDoc: Document = getDocument();
+        let currentDoc: Document = getDocument()!;
         this._target = currentDoc ? currentDoc.querySelector(target) as HTMLElement : null;
-        this._targetWindow = getWindow();
+        this._targetWindow = getWindow()!;
       } else if ((target as MouseEvent).stopPropagation) {
         this._target = target;
-        this._targetWindow = getWindow((target as MouseEvent).toElement as HTMLElement);
+        this._targetWindow = getWindow((target as MouseEvent).toElement as HTMLElement)!;
       } else {
         let targetElement: HTMLElement = target as HTMLElement;
         this._target = target;
-        this._targetWindow = getWindow(targetElement);
+        this._targetWindow = getWindow(targetElement)!;
       }
     } else {
-      this._targetWindow = getWindow();
+      this._targetWindow = getWindow()!;
     }
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
index dcedbddc20230..a0dde5c663b5f 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
@@ -46,21 +46,21 @@ export class ContextualMenuCheckmarksExample extends React.Component<any, IConte
                   key: keys[0],
                   name: 'New',
                   canCheck: true,
-                  isChecked: selection[keys[0]],
+                  isChecked: selection![keys[0]],
                   onClick: this._onToggleSelect
                 },
                 {
                   key: keys[1],
                   name: 'Share',
                   canCheck: true,
-                  isChecked: selection[keys[1]],
+                  isChecked: selection![keys[1]],
                   onClick: this._onToggleSelect
                 },
                 {
                   key: keys[2],
                   name: 'Mobile',
                   canCheck: true,
-                  isChecked: selection[keys[2]],
+                  isChecked: selection![keys[2]],
                   onClick: this._onToggleSelect
                 },
                 {
@@ -72,14 +72,14 @@ export class ContextualMenuCheckmarksExample extends React.Component<any, IConte
                   key: keys[3],
                   name: 'Print',
                   canCheck: true,
-                  isChecked: selection[keys[3]],
+                  isChecked: selection![keys[3]],
                   onClick: this._onToggleSelect
                 },
                 {
                   key: keys[4],
                   name: 'Music',
                   canCheck: true,
-                  isChecked: selection[keys[4]],
+                  isChecked: selection![keys[4]],
                   onClick: this._onToggleSelect
                 },
                 {
@@ -90,14 +90,14 @@ export class ContextualMenuCheckmarksExample extends React.Component<any, IConte
                         key: keys[6],
                         name: 'Email message',
                         canCheck: true,
-                        isChecked: selection[keys[6]],
+                        isChecked: selection![keys[6]],
                         onClick: this._onToggleSelect
                       },
                       {
                         key: keys[7],
                         name: 'Calendar event',
                         canCheck: true,
-                        isChecked: selection[keys[7]],
+                        isChecked: selection![keys[7]],
                         onClick: this._onToggleSelect
                       }
                     ],
@@ -114,7 +114,7 @@ export class ContextualMenuCheckmarksExample extends React.Component<any, IConte
   private _onToggleSelect(ev?: React.MouseEvent<HTMLButtonElement>, item?: IContextualMenuItem) {
     let { selection } = this.state;
 
-    selection[item.key] = !selection[item.key];
+    selection![item!.key] = !selection![item!.key];
 
     this.setState({
       selection: selection
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
index f8e618eccc512..c28c4bb549a22 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
@@ -16,7 +16,7 @@ export interface IDatePickerProps extends React.Props<DatePicker> {
   /**
    * Callback issued when a date is selected
    */
-  onSelectDate?: (date: Date) => void;
+  onSelectDate?: (date: Date | null | undefined) => void;
 
   /**
    * Label for the DatePicker
@@ -84,7 +84,7 @@ export interface IDatePickerProps extends React.Props<DatePicker> {
    * Optional method to parse the text input value to date, it is only useful when allowTextInput is set to true
    * @defaultvalue new Date(Date.parse(dateStr))
    */
-  parseDateFromString?: (dateStr: string) => Date;
+  parseDateFromString?: (dateStr: string) => Date | null;
 
   /**
    * The first day of the week for your locale.
@@ -102,7 +102,7 @@ export interface IDatePickerProps extends React.Props<DatePicker> {
    * @defaultvalue false
    */
   borderless?: boolean;
-  
+
   /**
    * Optional Classname for datepicker root element .
    */
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index f1f82f0d30bfa..576948f59346c 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -133,7 +133,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
       selectedDate: value || new Date(),
       formattedDate: (formatDate && value) ? formatDate(value) : '',
       isDatePickerShown: false,
-      errorMessage: null
+      errorMessage: undefined
     };
 
     this._preventFocusOpeningPicker = false;
@@ -141,7 +141,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
 
   public componentWillReceiveProps(nextProps: IDatePickerProps) {
     let { formatDate, isRequired, strings, value } = nextProps;
-    const errorMessage = (isRequired && !value) ? (strings.isRequiredErrorMessage || '*') : null;
+    const errorMessage = (isRequired && !value) ? (strings!.isRequiredErrorMessage || '*') : undefined;
 
     // Set error message
     this.setState({
@@ -153,7 +153,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     // had a legit change. Note tha the bug will still repro when only the formatDate was passed in props and this
     // is the result of the onSelectDate callback, but this should be a rare scenario.
     let oldValue = this.props.value;
-    if (!compareDates(oldValue, value) || this.props.formatDate !== formatDate) {
+    if (!compareDates(oldValue!, value!) || this.props.formatDate !== formatDate) {
       this.setState({
         selectedDate: value || new Date(),
         formattedDate: (formatDate && value) ? formatDate(value) : '',
@@ -226,7 +226,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
               isMonthPickerVisible={ this.props.isMonthPickerVisible }
               value={ selectedDate }
               firstDayOfWeek={ firstDayOfWeek }
-              strings={ strings }
+              strings={ strings! }
               ref={ this._resolveRef('_calendar') }
             >
             </Calendar>
@@ -286,7 +286,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
       let { isRequired, value, strings } = this.props;
 
       this.setState({
-        errorMessage: (isRequired && !value) ? (strings.isRequiredErrorMessage || '*') : null,
+        errorMessage: (isRequired && !value) ? (strings!.isRequiredErrorMessage || '*') : undefined,
         formattedDate: newValue
       });
     }
@@ -375,7 +375,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
   @autobind
   private _validateTextInput() {
     let { isRequired, allowTextInput, strings, formatDate, parseDateFromString, onSelectDate } = this.props;
-    const inputValue: string = this.state.formattedDate;
+    const inputValue = this.state.formattedDate;
 
     // Do validation only if DatePicker's popup is dismissed
     if (this.state.isDatePickerShown) {
@@ -387,7 +387,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
       this.setState({
         // Since fabic react doesn't have loc support yet
         // use the symbol '*' to represent error message
-        errorMessage: strings.isRequiredErrorMessage || '*'
+        errorMessage: strings!.isRequiredErrorMessage || '*'
       });
       return;
     }
@@ -395,10 +395,10 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     if (allowTextInput) {
       let date = null;
       if (inputValue) {
-        date = parseDateFromString(inputValue);
+        date = parseDateFromString!(inputValue);
         if (!date) {
           this.setState({
-            errorMessage: strings.invalidInputErrorMessage || '*'
+            errorMessage: strings!.invalidInputErrorMessage || '*'
           });
         } else {
           this.setState({
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index d7bfc9bb843e1..156778020d7ca 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -92,7 +92,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
     super(props);
 
     this.state = {
-      columnResizeDetails: null,
+      columnResizeDetails: undefined,
       groupNestingDepth: this.props.groupNestingDepth,
       isAllCollapsed: this.props.isAllCollapsed
     };
@@ -176,7 +176,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
             }
           </div>
         ) : null }
-        { groupNestingDepth > 0 && this.props.collapseAllVisibility === CollapseAllVisibility.visible ? (
+        { groupNestingDepth! > 0 && this.props.collapseAllVisibility === CollapseAllVisibility.visible ? (
           <div
             className={ css('ms-DetailsHeader-cell', styles.cell) }
             onClick={ this._onToggleCollapseAll }
@@ -191,7 +191,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
             />
           </div>
         ) : (null) }
-        { GroupSpacer({ count: groupNestingDepth - 1 }) }
+        { GroupSpacer({ count: groupNestingDepth! - 1 }) }
         { columns.map((column: IColumn, columnIndex: number) => {
           const previousColumnIndex = columnIndex - 1;
           const previousColumn = columns[previousColumnIndex];
@@ -213,7 +213,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
                     'is-icon-visible': column.isSorted || column.isGrouped || column.isFiltered,
                     [styles.cellWrapperPadded]: column.isPadded
                   }) }
-                style={ { width: column.calculatedWidth + INNER_PADDING + (column.isPadded ? ISPADDED_WIDTH : 0) } }
+                style={ { width: column.calculatedWidth! + INNER_PADDING + (column.isPadded ? ISPADDED_WIDTH : 0) } }
                 aria-haspopup={ column.columnActionsMode === ColumnActionsMode.hasDropdown }
                 data-automationid='ColumnsHeaderColumn'
                 data-item-key={ column.key }
@@ -365,7 +365,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
     this.setState({
       columnResizeDetails: {
         columnIndex: columnIndex,
-        columnMinWidth: columns[columnIndex].calculatedWidth,
+        columnMinWidth: columns[columnIndex].calculatedWidth!,
         originX: ev.clientX
       }
     });
@@ -401,7 +401,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
         this.setState({
           columnResizeDetails: {
             columnIndex: columnIndex,
-            columnMinWidth: columns[columnIndex].calculatedWidth
+            columnMinWidth: columns[columnIndex].calculatedWidth!
           }
         });
 
@@ -409,11 +409,11 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
         ev.stopPropagation();
       }
     } else {
-      let increment: number;
+      let increment: number | undefined;
 
       if (ev.which === KeyCodes.enter) {
         this.setState({
-          columnResizeDetails: null
+          columnResizeDetails: undefined
         });
 
         ev.preventDefault();
@@ -469,22 +469,22 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
       return;
     }
 
-    if (ev.clientX !== columnResizeDetails.originX) {
+    if (ev.clientX !== columnResizeDetails!.originX) {
       if (onColumnIsSizingChanged) {
-        onColumnIsSizingChanged(columns[columnResizeDetails.columnIndex], true);
+        onColumnIsSizingChanged(columns[columnResizeDetails!.columnIndex], true);
       }
     }
 
     if (onColumnResized) {
-      let movement = ev.clientX - columnResizeDetails.originX;
+      let movement = ev.clientX - columnResizeDetails!.originX!;
 
       if (getRTL()) {
         movement = -movement;
       }
 
       onColumnResized(
-        columns[columnResizeDetails.columnIndex],
-        columnResizeDetails.columnMinWidth + movement
+        columns[columnResizeDetails!.columnIndex],
+        columnResizeDetails!.columnMinWidth + movement
       );
     }
 
@@ -496,7 +496,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
 
     if (columnResizeDetails) {
       this.setState({
-        columnResizeDetails: null,
+        columnResizeDetails: undefined,
         isSizing: false
       });
     }
@@ -516,12 +516,12 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
     let { columnResizeDetails } = this.state;
 
     this.setState({
-      columnResizeDetails: null,
+      columnResizeDetails: undefined,
       isSizing: false
     });
 
     if (onColumnIsSizingChanged) {
-      onColumnIsSizingChanged(columns[columnResizeDetails.columnIndex], false);
+      onColumnIsSizingChanged(columns[columnResizeDetails!.columnIndex], false);
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.Props.ts b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.Props.ts
index a80c29a0fe59e..21d828fe2aa90 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.Props.ts
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { BaseButton, Button } from '../../Button';
 
 export interface IMessageBar {
 
@@ -32,7 +33,7 @@ export interface IMessageBarProps extends React.HTMLAttributes<HTMLElement> {
    * If null, we don't show a dismiss button.
    * @defaultvalue null
    */
-  onDismiss?: (ev?: React.MouseEvent<HTMLButtonElement>) => any;
+  onDismiss?: (ev?: React.MouseEvent<HTMLButtonElement | BaseButton | HTMLAnchorElement | Button>) => any;
 
   /**
    * Determines if the message bar is multi lined.
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
index dfa4b341cad86..652ed469becaf 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
@@ -20,7 +20,7 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
 
   public static defaultProps: IMessageBarProps = {
     messageBarType: MessageBarType.info,
-    onDismiss: null,
+    onDismiss: undefined,
     isMultiline: true,
   };
 
@@ -49,7 +49,7 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
     return isMultiline ? this._renderMultiLine() : this._renderSingleLine();
   }
 
-  private _getActionsDiv(): JSX.Element {
+  private _getActionsDiv(): JSX.Element | null {
     if (this.props.actions) {
       return <div className={ this.props.isMultiline ?
         ('ms-MessageBar-actions ' + styles.actions) :
@@ -72,7 +72,7 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
     });
   }
 
-  private _getDismissDiv(): JSX.Element {
+  private _getDismissDiv(): JSX.Element | null {
     if (this.props.onDismiss) {
       return (
         <IconButton
@@ -87,7 +87,7 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
     return null;
   }
 
-  private _getDismissOneLine(): JSX.Element {
+  private _getDismissOneLine(): JSX.Element | null {
     if (this.props.onDismiss) {
       return (
         <div className={ css('ms-MessageBar-dismissOneline', styles.dismissOneline) }>
@@ -101,7 +101,7 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
   private _getIconSpan(): JSX.Element {
     return (
       <div className={ css('ms-MessageBar-icon', styles.icon) }>
-        <Icon iconName={ this.ICON_MAP[this.props.messageBarType] } />
+        <Icon iconName={ this.ICON_MAP[this.props.messageBarType!] } />
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
index a6772f24a7b89..af75263f42643 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
@@ -269,7 +269,7 @@ describe('ResizeGroup', () => {
       // Set the initial window width
       getNextResizeGroupState(resizeGroupProps,
         {},
-        undefined,
+        sinon.stub(),
         initialWidth);
 
       // Pass in a state that reflects some rendered data
@@ -304,7 +304,7 @@ describe('ResizeGroup', () => {
       // Set the initial window width
       getNextResizeGroupState(resizeGroupProps,
         {},
-        undefined,
+        sinon.stub(),
         initialWidth);
 
       // Pass in a state that reflects some rendered data
@@ -458,7 +458,7 @@ describe('ResizeGroup', () => {
       // Set the initial window width
       getNextResizeGroupState(resizeGroupProps,
         {},
-        undefined,
+        sinon.stub(),
         initialWidth);
 
       // Pass in a state that reflects some rendered data
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index 670638ed6fb7a..df0bda6529bd2 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -104,9 +104,9 @@ export const getNextResizeGroupStateProvider = (measurementCache = getMeasuremen
     onReduceData: (prevData: any) => any,
     getElementToMeasureWidth: () => number): IResizeGroupState {
     let dataToMeasure = data;
-    let measuredWidth = _getMeasuredWidth(data, getElementToMeasureWidth);
+    let measuredWidth: number | undefined = _getMeasuredWidth(data, getElementToMeasureWidth);
 
-    while (measuredWidth > _containerWidth) {
+    while (measuredWidth > _containerWidth!) {
       let nextMeasuredData = onReduceData(dataToMeasure);
 
       // We don't want to get stuck in an infinite render loop when there are no more
@@ -152,9 +152,9 @@ export const getNextResizeGroupStateProvider = (measurementCache = getMeasuremen
     onGrowData: (prevData: any) => any,
     getElementToMeasureWidth: () => number): IResizeGroupState {
     let dataToMeasure = data;
-    let measuredWidth = _getMeasuredWidth(data, getElementToMeasureWidth);
+    let measuredWidth: number | undefined = _getMeasuredWidth(data, getElementToMeasureWidth);
 
-    while (measuredWidth < _containerWidth) {
+    while (measuredWidth < _containerWidth!) {
       let nextMeasuredData = onGrowData(dataToMeasure);
 
       // We don't want to get stuck in an infinite render loop when there are no more
@@ -195,7 +195,7 @@ export const getNextResizeGroupStateProvider = (measurementCache = getMeasuremen
    */
   function _updateContainerWidth(newWidth: number, fullWidthData: any, renderedData: any, onGrowData?: (prevData: any) => any): IResizeGroupState {
     let nextState: IResizeGroupState;
-    if (newWidth > _containerWidth) {
+    if (newWidth > _containerWidth!) {
       if (onGrowData) {
         nextState = {
           resizeDirection: 'grow',
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
index 11a655f92cd70..e0d5f1a762531 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
@@ -5,8 +5,8 @@ import {
 } from 'office-ui-fabric-react/lib/SwatchColorPicker';
 
 export interface IBasicSwatchColorPickerExampleState {
-  color: string;
-  previewColor: string;
+  color: string | undefined;
+  previewColor: string | undefined;
 }
 
 export class SwatchColorPickerBasicExample extends React.Component<any, IBasicSwatchColorPickerExampleState> {
@@ -17,8 +17,8 @@ export class SwatchColorPickerBasicExample extends React.Component<any, IBasicSw
     super(props);
 
     this.state = {
-      color: null,
-      previewColor: null
+      color: undefined,
+      previewColor: undefined
     };
   }
   public render() {
@@ -125,8 +125,8 @@ export class SwatchColorPickerBasicExample extends React.Component<any, IBasicSw
         <SwatchColorPicker
           menuButtonProps={ { iconProps: { iconName: 'fontColor' }, title: 'Font Color' } }
           setSelectedColorForIcon={ true }
-          onCellHovered={ (id, color) => this.setState({ previewColor: color }) }
-          onCellFocused={ (id, color) => this.setState({ previewColor: color }) }
+          onCellHovered={ (id, color) => this.setState({ previewColor: color! }) }
+          onCellFocused={ (id, color) => this.setState({ previewColor: color! }) }
           onColorChanged={ (id, newColor) => this.setState({ color: newColor }) }
           onMenuItemClick={ (item) => item.label && alert(item.label + ' was clicked') }
           columnCount={ 4 }
diff --git a/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx b/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx
index 3680f2b278c72..bf2c6c79b7eb3 100644
--- a/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx
@@ -24,12 +24,12 @@ const RESPONSIVE_MAX_CONSTRAINT = [
   99999999
 ];
 
-let _defaultMode: ResponsiveMode;
+let _defaultMode: ResponsiveMode | undefined;
 
 /**
  * Allows a server rendered scenario to provide a default responsive mode.
  */
-export function setResponsiveMode(responsiveMode: ResponsiveMode) {
+export function setResponsiveMode(responsiveMode: ResponsiveMode | undefined) {
   _defaultMode = responsiveMode;
 }
 
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning.ts b/packages/office-ui-fabric-react/src/utilities/positioning.ts
index c46696d36b451..22466d644b638 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning.ts
@@ -180,11 +180,11 @@ let OppositeEdgeDictionary: { [key: number]: number } = {
   [RectangleEdge.left]: RectangleEdge.right,
 };
 
-function getDirectionalHintForLayout(props: IPositionProps): DirectionalHint {
+function getDirectionalHintForLayout(props: IPositionProps): DirectionalHint | undefined {
   if (getRTL()) {
     return props.directionalHintForRTL !== undefined ?
       props.directionalHintForRTL :
-      MirrorDirectionalHintDictionary[props.directionalHint];
+      MirrorDirectionalHintDictionary[props.directionalHint!];
   } else {
     return props.directionalHint;
   }
@@ -207,7 +207,7 @@ export function getRelativePositions(
     props.targetPoint,
     props.useTargetPoint);
   let positionData: PositionData = positioningFunctions._getPositionData(
-    getDirectionalHintForLayout(props),
+    getDirectionalHintForLayout(props)!,
     targetRect,
     boundingRect,
     props.coverTarget);

From 23d9125b1e4c2d506e276f6f023fc9f21a9cf1ea Mon Sep 17 00:00:00 2001
From: ycoco <ycocococo6256@gmail.com>
Date: Wed, 26 Jul 2017 17:36:10 -0700
Subject: [PATCH 0315/1641] Dropdown: adding onBlur support (#2305)

* pr

* onblur dropdown

* onblur for dropdown

* rush change

* resolve code review suggestions

* fix comments

* fix comment

* Update coco-dropdownonBlur_2017-07-05-22-15.json

* add custom onblur support for dropdown

* no message

* Update coco-dropdownonBlur_2017-07-25-22-57.json

* Update Dropdown.Basic.Example.tsx

* Delete coco-dropdownonBlur_2017-07-05-22-15.json
---
 .../coco-dropdownonBlur_2017-07-25-22-57.json         | 11 +++++++++++
 .../src/components/Dropdown/Dropdown.tsx              |  3 +++
 .../Dropdown/examples/Dropdown.Basic.Example.tsx      |  1 +
 3 files changed, 15 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/coco-dropdownonBlur_2017-07-25-22-57.json

diff --git a/common/changes/office-ui-fabric-react/coco-dropdownonBlur_2017-07-25-22-57.json b/common/changes/office-ui-fabric-react/coco-dropdownonBlur_2017-07-25-22-57.json
new file mode 100644
index 0000000000000..a18e40b7c56ab
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/coco-dropdownonBlur_2017-07-25-22-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: added onBlur support.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "t-yikche@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 0d83b36875701..ed7e3a7e290f8 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -430,6 +430,9 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
       // Do not onBlur when the callout is opened
       return;
     }
+    if (this.props.onBlur) {
+      this.props.onBlur(ev);
+    }
   }
 
   @autobind
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
index bb0867cd11960..c011635919b0a 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
@@ -61,6 +61,7 @@ export class DropdownBasicExample extends React.Component<any, any> {
           label='Controlled example:'
           selectedKey={ selectedItem && selectedItem.key }
           onChanged={ (item) => this.setState({ selectedItem: item }) }
+          onBlur={ () => console.log('onBlur called') }
           options={
             [
               { key: 'A', text: 'Option a' },

From b1a2623318f33bfdef482be2effeea65c4dbeba0 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Wed, 26 Jul 2017 18:06:58 -0700
Subject: [PATCH 0316/1641] Fix focus issues on Mac OS (#2313)

* Fix focus tracking in callouts

* Ignore Alt+Up in DetailsList

* Update change output
---
 .../focus-issues_2017-07-27-00-10.json                | 11 +++++++++++
 .../src/components/Callout/Callout.scss               |  2 ++
 .../src/components/Callout/CalloutContent.tsx         |  6 ++++--
 .../src/components/DetailsList/DetailsList.tsx        |  2 +-
 4 files changed, 18 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/focus-issues_2017-07-27-00-10.json

diff --git a/common/changes/office-ui-fabric-react/focus-issues_2017-07-27-00-10.json b/common/changes/office-ui-fabric-react/focus-issues_2017-07-27-00-10.json
new file mode 100644
index 0000000000000..6537961867e2e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/focus-issues_2017-07-27-00-10.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix focus issues for Safari and Firefox on Mac OS",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
index 028a6ba7a56a5..41576bc236768 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
@@ -26,6 +26,8 @@ $Callout-smallbeak-slant-width: 16px;
   position: absolute;
   box-sizing: border-box;
 
+  @include focus-clear();
+
   @media screen and (-ms-high-contrast: active) {
     border: 1px solid $ms-color-white;
   }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index 132eb9c6fbffb..aa65f9336f7da 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -149,6 +149,8 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
               directionalClassName
             ) }
           style={ positions ? positions.calloutPosition : OFF_SCREEN_STYLE }
+          tabIndex={ -1 } // Safari and Firefox on Mac OS requires this to back-stop click events so focus remains in the Callout.
+          // See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus
           ref={ this._resolveRef('_calloutElement') }
         >
 
@@ -227,8 +229,8 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
     this._async.setTimeout(() => {
       this._events.on(this._targetWindow, 'scroll', this._dismissOnScroll, true);
       this._events.on(this._targetWindow, 'resize', this.dismiss, true);
-      this._events.on(this._targetWindow, 'focus', this._dismissOnLostFocus, true);
-      this._events.on(this._targetWindow, 'click', this._dismissOnLostFocus, true);
+      this._events.on(this._targetWindow.document.body, 'focus', this._dismissOnLostFocus, true);
+      this._events.on(this._targetWindow.document.body, 'click', this._dismissOnLostFocus, true);
     }, 0);
 
     if (this.props.onLayerMounted) {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index b4f8a3f9a237b..f2cb58826f0dc 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -430,7 +430,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   }
 
   private _onContentKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
-    if (ev.which === KeyCodes.up) {
+    if (ev.which === KeyCodes.up && !ev.altKey) {
       if (this._header && this._header.focus()) {
         ev.preventDefault();
         ev.stopPropagation();

From 80f9d59c101130773c9d60db38129d5311d7a6ea Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 27 Jul 2017 03:23:33 -0700
Subject: [PATCH 0317/1641] Applying package updates.

---
 .../icon-update-2.38_2017-07-26-18-00.json    | 11 -----
 .../coco-dropdownonBlur_2017-07-25-22-57.json | 11 -----
 .../focus-issues_2017-07-27-00-10.json        | 11 -----
 .../icon-update-2.38_2017-07-26-18-00.json    | 11 -----
 ...er-process-selection_2017-07-26-23-47.json | 11 -----
 .../oufr-strict-null3_2017-07-24-21-40.json   | 11 -----
 ...s-veloiya-Bug1040384_2017-07-25-12-15.json | 11 -----
 packages/example-app-base/package.json        |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 46 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 17 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/CHANGELOG.json               | 14 ++++++
 packages/styling/CHANGELOG.md                 |  9 +++-
 packages/styling/package.json                 |  2 +-
 14 files changed, 88 insertions(+), 83 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/icon-update-2.38_2017-07-26-18-00.json
 delete mode 100644 common/changes/office-ui-fabric-react/coco-dropdownonBlur_2017-07-25-22-57.json
 delete mode 100644 common/changes/office-ui-fabric-react/focus-issues_2017-07-27-00-10.json
 delete mode 100644 common/changes/office-ui-fabric-react/icon-update-2.38_2017-07-26-18-00.json
 delete mode 100644 common/changes/office-ui-fabric-react/joem-peoplepicker-process-selection_2017-07-26-23-47.json
 delete mode 100644 common/changes/office-ui-fabric-react/oufr-strict-null3_2017-07-24-21-40.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-veloiya-Bug1040384_2017-07-25-12-15.json

diff --git a/common/changes/@uifabric/styling/icon-update-2.38_2017-07-26-18-00.json b/common/changes/@uifabric/styling/icon-update-2.38_2017-07-26-18-00.json
deleted file mode 100644
index bc0fb216e7658..0000000000000
--- a/common/changes/@uifabric/styling/icon-update-2.38_2017-07-26-18-00.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "Icons: Added new icons from 2.38",
-      "packageName": "@uifabric/styling",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/coco-dropdownonBlur_2017-07-25-22-57.json b/common/changes/office-ui-fabric-react/coco-dropdownonBlur_2017-07-25-22-57.json
deleted file mode 100644
index a18e40b7c56ab..0000000000000
--- a/common/changes/office-ui-fabric-react/coco-dropdownonBlur_2017-07-25-22-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: added onBlur support.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "t-yikche@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/focus-issues_2017-07-27-00-10.json b/common/changes/office-ui-fabric-react/focus-issues_2017-07-27-00-10.json
deleted file mode 100644
index 6537961867e2e..0000000000000
--- a/common/changes/office-ui-fabric-react/focus-issues_2017-07-27-00-10.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix focus issues for Safari and Firefox on Mac OS",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/icon-update-2.38_2017-07-26-18-00.json b/common/changes/office-ui-fabric-react/icon-update-2.38_2017-07-26-18-00.json
deleted file mode 100644
index 3897ac110fb2c..0000000000000
--- a/common/changes/office-ui-fabric-react/icon-update-2.38_2017-07-26-18-00.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Icons: Added new icons from 2.38",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/joem-peoplepicker-process-selection_2017-07-26-23-47.json b/common/changes/office-ui-fabric-react/joem-peoplepicker-process-selection_2017-07-26-23-47.json
deleted file mode 100644
index 75882cf448da1..0000000000000
--- a/common/changes/office-ui-fabric-react/joem-peoplepicker-process-selection_2017-07-26-23-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Adds prop to process selection in BasePicker",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joem@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/oufr-strict-null3_2017-07-24-21-40.json b/common/changes/office-ui-fabric-react/oufr-strict-null3_2017-07-24-21-40.json
deleted file mode 100644
index 5fe04f31527f1..0000000000000
--- a/common/changes/office-ui-fabric-react/oufr-strict-null3_2017-07-24-21-40.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "More type casting to get us on the path to enabling strictNullChecks",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "<christianjordangonzalez@gmail.com>"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-veloiya-Bug1040384_2017-07-25-12-15.json b/common/changes/office-ui-fabric-react/users-veloiya-Bug1040384_2017-07-25-12-15.json
deleted file mode 100644
index 9a099906ce067..0000000000000
--- a/common/changes/office-ui-fabric-react/users-veloiya-Bug1040384_2017-07-25-12-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "CommandBar: Accessibility fix for expand behavior",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "veloiya@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index de0a67c389c16..e2a9b3dfe0029 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -48,7 +48,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.13.16 <1.0.0",
+    "@uifabric/styling": ">=0.14.0 <1.0.0",
     "@uifabric/utilities": ">=4.8.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 71a6fc55b928a..592a109598126 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,52 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.24.0",
+      "tag": "office-ui-fabric-react_v4.24.0",
+      "date": "Thu, 27 Jul 2017 10:23:33 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "ycoco <ycocococo6256@gmail.com>",
+            "commit": "23d9125b1e4c2d506e276f6f023fc9f21a9cf1ea",
+            "comment": "Dropdown: added onBlur support."
+          },
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "b1a2623318f33bfdef482be2effeea65c4dbeba0",
+            "comment": "Fix focus issues for Safari and Firefox on Mac OS"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "df7a230735c92a73935bbdf97cfb6f2fcae9af45",
+            "comment": "Icons: Added new icons from 2.38"
+          },
+          {
+            "author": "Joe Martella <martellaj@live.com>",
+            "commit": "6c84d750f0c2446449368200e23c2aede7ab04f5",
+            "comment": "Adds prop to process selection in BasePicker"
+          },
+          {
+            "author": "veloiya <30428533+veloiya@users.noreply.github.com>",
+            "commit": "b711509d4a7e73d3a89734afd3358f72805b8550",
+            "comment": "CommandBar: Accessibility fix for expand behavior"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "0a25f628156487f5767dec48629187098762493c",
+            "comment": "More type casting to get us on the path to enabling strictNullChecks"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.13.16 <1.0.0` to `>=0.14.0 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.23.0",
       "tag": "office-ui-fabric-react_v4.23.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index e9b3a89e1012c..b7e5ab1f41dbf 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,21 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 25 Jul 2017 10:22:35 GMT and should not be manually modified.
+This log was last generated on Thu, 27 Jul 2017 10:23:33 GMT and should not be manually modified.
+
+## 4.24.0
+Thu, 27 Jul 2017 10:23:33 GMT
+
+### Minor changes
+
+- More type casting to get us on the path to enabling strictNullChecks
+
+### Patches
+
+- Dropdown: added onBlur support.
+- Fix focus issues for Safari and Firefox on Mac OS
+- Icons: Added new icons from 2.38
+- Adds prop to process selection in BasePicker
+- CommandBar: Accessibility fix for expand behavior
 
 ## 4.23.0
 Tue, 25 Jul 2017 10:22:35 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index c3aceb4341b2c..e2009fe68c28b 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.23.0",
+  "version": "4.24.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.8.0 <5.0.0",
-    "@uifabric/styling": ">=0.13.16 <1.0.0",
+    "@uifabric/styling": ">=0.14.0 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 093fb54f8018b..fbe218f04bab5 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.14.0",
+      "tag": "@uifabric/styling_v0.14.0",
+      "date": "Thu, 27 Jul 2017 10:23:33 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "df7a230735c92a73935bbdf97cfb6f2fcae9af45",
+            "comment": "Icons: Added new icons from 2.38"
+          }
+        ]
+      }
+    },
     {
       "version": "0.13.16",
       "tag": "@uifabric/styling_v0.13.16",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 02ee5d64e5e1c..a6a7256632bad 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Tue, 25 Jul 2017 10:22:35 GMT and should not be manually modified.
+This log was last generated on Thu, 27 Jul 2017 10:23:33 GMT and should not be manually modified.
+
+## 0.14.0
+Thu, 27 Jul 2017 10:23:33 GMT
+
+### Minor changes
+
+- Icons: Added new icons from 2.38
 
 ## 0.13.16
 Tue, 25 Jul 2017 10:22:35 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 5defbbc2bb398..f3534e8018e29 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.13.16",
+  "version": "0.14.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 20d920d1a9f38c468ab47027e9fb2ec80018d85d Mon Sep 17 00:00:00 2001
From: Kushal Yarlagadda <whykushal93@gmail.com>
Date: Thu, 27 Jul 2017 13:14:41 -0700
Subject: [PATCH 0318/1641] Moving the ComboBox component to use Glamor based
 styling (#2284)

* Initial check-in. Scaffolding for Glamor. No styles yet.

* More comboBox styling and scaffolding.

* Most styles are in
-Re-introducing high contrast palette.

* Reordering cascading to be more intuitive.

* More styling !
-Added styles for label
-added more semantically correct styles for items,
-added comments

* Deleting the sass file

* Change files

* -Replacing all 'item' with 'option' - based on IComboBoxOption we expose as public API.
-All public API will use option instead of item
-Correcting some tslint errors

* Fixing unit tests, correcting classNames
Still one more test to fix.

* Addressing PR comments
-IComboBoxStyles require all the styles now, they are not optional
-Using Partial<> for user custom styles
-Using System Colors for high-contrast mode.

* Fixing the tests. Using mount instead of shallow.

* Correcting a name.

* Separating the option styles to a separate interface.
-can custom style each option
-can custom style all options together.

* More changes to show custom styling in the example

* Spelling correction

* -New example component for custom styled comboBox
-Adding one more comment.
-More custom styling in example

* Adding a comment

* Having all option styles be under one className.
Changes to the way fonts are written inside IStyle.

* Making optionStyles to use the IButtonStyles.
Making caretButton use the IButtonStyles.
And making necessary changes for it.

* Styling the caretDown button

* -Refactoring palette colors into constants
-Separating hovered and focus styles for comboBox root

* Fixing tslint errors

* Using memoize function for helper functions inside Styles file.

* Addressing comments from PR
-Correcting color names
-removing high contrast black on active
-using semantic slots for disabled text

* Taking out all usages of shorthand styles.
as per https://github.com/threepointone/glamor/issues/226
---
 .../ComboBoxGlamor_2017-07-21-19-23.json      |  11 +
 .../ComboBoxGlamor_2017-07-21-19-23.json      |  11 +
 .../ComboBoxGlamor_2017-07-21-19-23.json      |  11 +
 .../ComboBoxGlamor_2017-07-21-19-23.json      |  11 +
 .../ComboBoxGlamor_2017-07-21-19-23.json      |  11 +
 .../Button/BaseButton.classNames.ts           |   1 +
 .../src/components/Button/Button.Props.ts     |   5 +
 .../src/components/ComboBox/ComboBox.Props.ts | 119 ++++++-
 .../ComboBox/ComboBox.classNames.ts           |  95 ++++++
 .../src/components/ComboBox/ComboBox.scss     | 254 --------------
 .../components/ComboBox/ComboBox.styles.ts    | 319 ++++++++++++++++++
 .../src/components/ComboBox/ComboBox.test.tsx |  17 +-
 .../src/components/ComboBox/ComboBox.tsx      | 112 ++++--
 .../src/components/ComboBox/ComboBoxPage.tsx  |   2 +
 .../examples/ComboBox.Basic.Example.scss      |  10 -
 .../examples/ComboBox.Basic.Example.tsx       |   3 +-
 .../ComboBox.CustomStyled.Example.tsx         |  86 +++++
 17 files changed, 767 insertions(+), 311 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/ComboBoxGlamor_2017-07-21-19-23.json
 create mode 100644 common/changes/@uifabric/fabric-website/ComboBoxGlamor_2017-07-21-19-23.json
 create mode 100644 common/changes/@uifabric/styling/ComboBoxGlamor_2017-07-21-19-23.json
 create mode 100644 common/changes/@uifabric/utilities/ComboBoxGlamor_2017-07-21-19-23.json
 create mode 100644 common/changes/office-ui-fabric-react/ComboBoxGlamor_2017-07-21-19-23.json
 create mode 100644 packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.CustomStyled.Example.tsx

diff --git a/common/changes/@uifabric/example-app-base/ComboBoxGlamor_2017-07-21-19-23.json b/common/changes/@uifabric/example-app-base/ComboBoxGlamor_2017-07-21-19-23.json
new file mode 100644
index 0000000000000..a48a2085ece6b
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/ComboBoxGlamor_2017-07-21-19-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "kushaly@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/ComboBoxGlamor_2017-07-21-19-23.json b/common/changes/@uifabric/fabric-website/ComboBoxGlamor_2017-07-21-19-23.json
new file mode 100644
index 0000000000000..4df779311b07b
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/ComboBoxGlamor_2017-07-21-19-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "kushaly@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/ComboBoxGlamor_2017-07-21-19-23.json b/common/changes/@uifabric/styling/ComboBoxGlamor_2017-07-21-19-23.json
new file mode 100644
index 0000000000000..5b61db95e0352
--- /dev/null
+++ b/common/changes/@uifabric/styling/ComboBoxGlamor_2017-07-21-19-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Adding High contrast colors to the paletter",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "kushaly@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/ComboBoxGlamor_2017-07-21-19-23.json b/common/changes/@uifabric/utilities/ComboBoxGlamor_2017-07-21-19-23.json
new file mode 100644
index 0000000000000..8b9c98c03c0f4
--- /dev/null
+++ b/common/changes/@uifabric/utilities/ComboBoxGlamor_2017-07-21-19-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "kushaly@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/ComboBoxGlamor_2017-07-21-19-23.json b/common/changes/office-ui-fabric-react/ComboBoxGlamor_2017-07-21-19-23.json
new file mode 100644
index 0000000000000..36ece412a5b82
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/ComboBoxGlamor_2017-07-21-19-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Moving ComboBox component to use the styling library",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kushaly@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
index c910bf60a45b7..f300116035350 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
@@ -42,6 +42,7 @@ export const getClassNames = memoizeFunction((
       !disabled && !expanded && {
         ':hover': styles.rootHovered,
         ':hover .ms-Button-description': styles.descriptionHovered,
+        ':focus': styles.rootFocused,
         ':active': styles.rootPressed,
         ':active .ms-Button-description': styles.descriptionPressed
       },
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
index 5fc65eef46ddd..e8bdae94417db 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
@@ -203,6 +203,11 @@ export interface IButtonStyles {
    */
   rootHovered?: IStyle;
 
+  /**
+   * Style override applied to the root on hover in the default, enabled, non-toggled state.
+   */
+  rootFocused?: IStyle;
+
   /**
    * Style override applied to the root on pressed in the default, enabled, non-toggled state.
    */
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
index 0560abf396eb6..b821c5d41c4d1 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
@@ -1,6 +1,8 @@
 import { IIconProps } from '../../Icon';
 import { ISelectableOption } from '../../utilities/selectableOption/SelectableOption.Props';
 import { ISelectableDroppableTextProps } from '../../utilities/selectableOption/SelectableDroppableText.Props';
+import { IStyle, ITheme } from '../../Styling';
+import { IButtonStyles } from '../../Button';
 
 export interface IComboBox {
   /**
@@ -11,6 +13,7 @@ export interface IComboBox {
 }
 
 export interface IComboBoxOption extends ISelectableOption {
+  styles?: Partial<IComboBoxOptionStyles>;
 }
 
 export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox> {
@@ -40,13 +43,13 @@ export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox>
   onResolveOptions?: (options: IComboBoxOption[]) => IComboBoxOption[] | PromiseLike<IComboBoxOption[]>;
 
   /**
-   * Whether the ComboBox is free form, meaning that the user input is not bound to provided items. Defaults to false.
+   * Whether the ComboBox is free form, meaning that the user input is not bound to provided options. Defaults to false.
    */
   allowFreeform?: boolean;
 
   /**
-   * Whether the ComboBox auto completes. As the user is inputing text, it will be suggested potential matches from the list of items. If
-   * the combo box is expanded, this will also scroll to the suggested item, and give it a selected style. Defaults to false.
+   * Whether the ComboBox auto completes. As the user is inputing text, it will be suggested potential matches from the list of options. If
+   * the combo box is expanded, this will also scroll to the suggested option, and give it a selected style. Defaults to false.
    */
   autoComplete?: string;
 
@@ -59,4 +62,114 @@ export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox>
    * The IconProps to use for the button aspect of the combobox
    */
   buttonIconProps?: IIconProps;
+
+  /**
+   * Theme provided by HOC.
+   */
+  theme?: ITheme;
+
+  /**
+   * Custom styles for this component
+   */
+  styles?: Partial<IComboBoxStyles>;
+}
+
+export interface IComboBoxStyles {
+  /**
+   * Style for the container which has the ComboBox and the label
+   */
+  container: IStyle;
+
+  /**
+   * Style for the label element of the ComboBox.
+   */
+  label: IStyle;
+
+  /**
+   * Base styles for the root element of all ComboBoxes.
+   */
+  root: IStyle;
+
+  /**
+   * Styles for the root element for variant of ComboBox with an errorMessage in the props.
+   */
+  rootError: IStyle;
+
+  /**
+   * Styles for variant of ComboBox where allowFreeForm is false in the props.
+   */
+  rootDisallowFreeForm: IStyle;
+
+  /**
+   * Styles for when the ComboBox is hovered. These styles are applied for all comboBoxes except when
+   * the comboBox is disabled.
+   */
+  rootHovered: IStyle;
+
+  /**
+   * Styles for when the ComboBox is focused. These styles are applied for all comboBoxes except when
+   * the comboBox is disabled.
+   */
+  rootFocused: IStyle;
+
+  /**
+   * Styles for when the comboBox is disabled. These styles override all the other styles.
+   * NOTE : Hover (or) Focused (or) active styles are not applied for disabled comboBoxes.
+   */
+  rootDisabled: IStyle;
+
+  /**
+   * Base styles for the input element - which contains the currently selected
+   * option.
+   */
+  input: IStyle;
+
+  /**
+   * Style override for the input element when comboBox is disabled.
+   */
+  inputDisabled: IStyle;
+
+  /**
+   * Styles for the caret down button.
+   */
+  caretDownButtonStyles: Partial<IComboBoxCaretDownButtonStyles>;
+
+  /**
+   * Styles for the error Message text of the comboBox.
+   */
+  errorMessage: IStyle;
+
+  /**
+   * Styles for the callout.
+   */
+  callout: IStyle;
+
+  /**
+   * Styles for the container of all the Combobox options
+   * Includes the headers and dividers.
+   */
+  optionsContainer: IStyle;
+
+  /**
+ * Styles for a header in the options.
+ */
+  header: IStyle;
+
+  /**
+   * Styles for a divider in the options.
+   */
+  divider: IStyle;
+
+  /**
+   * Default styles that should be applied to ComboBox options,
+   * incase an option does not come with user-defined custom styles
+   */
+  optionDefaultStyles: Partial<IComboBoxOptionStyles>;
 }
+
+export interface IComboBoxOptionStyles extends IButtonStyles {
+  optionText: IStyle;
+}
+
+export interface IComboBoxCaretDownButtonStyles extends IButtonStyles {
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
new file mode 100644
index 0000000000000..03451aea366f5
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
@@ -0,0 +1,95 @@
+import { IComboBoxStyles, IComboBoxOptionStyles } from './ComboBox.Props';
+import { memoizeFunction } from '../../Utilities';
+import {
+  mergeStyles,
+} from '../../Styling';
+
+export interface IComboBoxClassNames {
+  container: string;
+  label: string;
+  root: string;
+  input: string;
+  errorMessage: string;
+  callout: string;
+  optionsContainer: string;
+  header: string;
+  divider: string;
+}
+
+export interface IComboBoxOptionClassNames {
+  optionText: string;
+}
+
+export const getClassNames = memoizeFunction((
+  styles: IComboBoxStyles,
+  className: string,
+  isOpen: boolean,
+  disabled: boolean,
+  required: boolean,
+  focused: boolean,
+  allowFreeForm: boolean,
+  hasErrorMessage: boolean
+): IComboBoxClassNames => {
+  return {
+    container: mergeStyles(
+      'ms-ComboBox-container',
+      className,
+      styles.container,
+    ) as string,
+    label: mergeStyles(
+      styles.label
+    ) as string,
+    root: mergeStyles(
+      'ms-ComboBox',
+      isOpen && 'is-open',
+      required && 'is-required',
+      styles.root,
+      !allowFreeForm && styles.rootDisallowFreeForm,
+      hasErrorMessage && styles.rootError,
+      !disabled && focused && styles.rootFocused,
+      !disabled && {
+        ':hover': styles.rootHovered
+      },
+      disabled && [
+        'is-disabled', styles.rootDisabled
+      ],
+    ) as string,
+    input: mergeStyles(
+      'ms-ComboBox-Input',
+      styles.input,
+      disabled && styles.inputDisabled
+    ) as string,
+    errorMessage: mergeStyles(
+      styles.errorMessage
+    ) as string,
+    callout: mergeStyles(
+      'ms-ComboBox-callout',
+      styles.callout
+    ) as string,
+    optionsContainer: mergeStyles(
+      'ms-ComboBox-optionsContainer',
+      styles.optionsContainer
+    ) as string,
+    header: mergeStyles(
+      'ms-ComboBox-header',
+      styles.header
+    ) as string,
+    divider: mergeStyles(
+      'ms-ComboBox-divider',
+      styles.divider
+    ) as string,
+  };
+});
+
+export const getComboBoxOptionClassNames = memoizeFunction((
+  styles: IComboBoxOptionStyles,
+  optionIsSelected: boolean,
+  disabled: boolean,
+): IComboBoxOptionClassNames => {
+  return {
+    optionText: mergeStyles(
+      'ms-ComboBox-optionText',
+      styles.optionText
+    ) as string,
+  };
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.scss b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.scss
deleted file mode 100644
index 625dc559ece14..0000000000000
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.scss
+++ /dev/null
@@ -1,254 +0,0 @@
-@import '../../common/common';
-
-// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
-
-//
-// Office UI Fabric
-// --------------------------------------------------
-// ComboBox styles
-
-$ComboBox-selectedItem-bg: $ms-color-neutralQuaternaryAlt;
-$ComboBox-selectedItem-hover-bg: $ms-color-neutralLighter;
-$ComboBox-height: 32px;
-$ComboBox-caretDown-width: 32px;
-$ComboBox-item-height: 36px;
-
-// Mixin for high contrast mode link states
-@mixin highContrastListItemState {
-  @media screen and (-ms-high-contrast: active) {
-    background-color: $ms-color-contrastBlackSelected;
-    border-color: $ms-color-contrastBlackSelected;
-    color: $ms-color-black;
-
-    &:focus {
-      border-color: $ms-color-black;
-    }
-  }
-
-  @media screen and (-ms-high-contrast: black-on-white) {
-    background-color: $ms-color-contrastWhiteSelected;
-    border-color: $ms-color-contrastWhiteSelected;
-    color: $ms-color-white;
-  }
-
-  @include highContrastAdjust();
-}
-
-.root {
-  @include ms-normalize;
-  @include ms-font-m;
-  color: $ms-color-neutralPrimary;
-
-  margin-bottom: 10px;
-  position: relative;
-  outline: 0;
-  user-select: none;
-  background: $ms-color-white;
-  border: 1px solid $ms-color-neutralTertiaryAlt;
-  cursor: text ;
-  display: block;
-  height: $ComboBox-height;
-  line-height: $ComboBox-height - 2px; // height minus the border
-  @include padding(0, $ComboBox-caretDown-width, 0, 0);
-  overflow: hidden;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  box-sizing: content-box;
-
-  &:hover,
-  &.focused {
-    &.wrapper
-      {
-        border-color: $ms-color-themePrimary;
-
-        @media screen and (-ms-high-contrast: active) {
-          color: $ms-color-contrastBlackSelected;
-        }
-
-        @media screen and (-ms-high-contrast: black-on-white) {
-          color: $ms-color-contrastWhiteSelected;
-        }
-    }
-
-    &.readOnly {
-      .caretDown {
-        background-color: inherit;
-      }
-    }
-  }
-
-  &.wrapperForError {
-      border-color: $ms-color-error;
-  }
-
-  :global(.ms-Label) {
-    display: inline-block;
-    margin-bottom: 8px;
-  }
-}
-
-//== State: A disabled ComboBox
-.root.rootIsDisabled {
-  &.wrapper,
-  .input,
-  .caretDown {
-    background-color: $ms-color-neutralLighter;
-    border-color: $ms-color-neutralLighter;
-    color: $ms-color-neutralTertiary;
-    cursor: default;
-
-    @media screen and (-ms-high-contrast: active) {
-      border-color: $ms-color-contrastBlackDisabled;
-      color: $ms-color-contrastBlackDisabled;
-    }
-
-    @media screen and (-ms-high-contrast: black-on-white) {
-      border-color: $ms-color-contrastWhiteDisabled;
-      color: $ms-color-contrastWhiteDisabled;
-    }
-  }
-}
-
-.input {
-  box-sizing: border-box;
-  width: 100%;
-  height: 100%;
-  border: none;
-  outline: none;
-  font: inherit;
-  text-overflow: ellipsis;
-  padding-left: 12px;
-
-}
-
-.caretDown {
-  color: $ms-color-neutralDark;
-  font-size: $ms-icon-size-s;
-  position: absolute;
-  height: $ComboBox-height;
-  line-height: $ComboBox-height - 2px; // height minus the border
-  width: $ComboBox-caretDown-width;
-  text-align: center;
-  cursor: default;
-
-  &:hover{
-    background-color: $ms-color-neutralQuaternaryAlt;
-  }
-
-  &:active{
-    background-color: $ms-color-neutralTertiaryAlt;
-  }
-}
-
-.callout {
-  box-shadow: 0 0px 5px 0px rgba(0, 0, 0, 0.4);
-  border: 1px solid $ms-color-neutralLight;
-}
-
-.errorMessage{
-    color: $ms-color-error;
-  &::before {
-    content: '* ';
-  }
-}
-
-.items {
-  display: block;
-}
-
-// Container for the ComboBox items, displayed as a panel on small screens.
-.item {
-  background: transparent;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: block;
-  width: 100%;
-  height: auto;
-  min-height: $ComboBox-item-height;
-  line-height: 20px;
-  padding: 5px 16px;
-  position: relative;
-  border: 1px solid transparent;
-  word-wrap: break-word;
-  overflow-wrap: break-word;
-  text-align: left;
-
-  @media screen and (-ms-high-contrast: active) {
-    border-color: $ms-color-black;
-  }
-
-  @media screen and (-ms-high-contrast: black-on-white) {
-    border-color: $ms-color-white;
-  }
-
-  &:hover {
-    background-color: $ComboBox-selectedItem-hover-bg;
-    color: $ms-color-black;
-
-    @include highContrastListItemState;
-  }
-
-  @include focus-border();
-
-  &:focus {
-    background-color: $ms-color-neutralLighter;
-  }
-
-  &:active {
-    background-color: $ComboBox-selectedItem-hover-bg;
-    color: $ms-color-black;
-  }
-
-  &.itemIsDisabled {
-    background: $ms-color-white;
-    color: $ms-color-neutralTertiary;
-    cursor: default;
-  }
-  :global(.ms-Button-flexContainer) {
-    justify-content: flex-start;
-  }
-}
-
-// A selected ComboBox item
-.item.itemIsSelected {
-  background-color: $ComboBox-selectedItem-bg;
-  color: $ms-color-black;
-
-  &:hover {
-    background-color: $ComboBox-selectedItem-bg;
-  }
-
-  @include focus-border();
-
-  @include highContrastListItemState;
-}
-
-.header {
-  @include ms-font-m;
-  font-weight: $ms-font-weight-semibold;
-  color: $ms-color-themePrimary;
-  background: none;
-  border: none;
-  height: $ComboBox-item-height;
-  line-height: $ComboBox-item-height;
-  cursor: default;
-  padding: 0px 16px;
-  user-select: none;
-  @include text-align(left);
-}
-
-.divider {
-  height: 1px;
-  background-color: $dividerColor;
-}
-
-.optionText {
-  overflow: hidden;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  min-width: 0px;
-  max-width: 100%;
-  word-wrap: break-word;
-  overflow-wrap: break-word;
-  margin: 1px;
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
new file mode 100644
index 0000000000000..7dea57473c0ef
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -0,0 +1,319 @@
+import {
+  IComboBoxStyles,
+  IComboBoxOptionStyles,
+  IComboBoxCaretDownButtonStyles
+} from './ComboBox.Props';
+import {
+  ITheme,
+  IStyle,
+  mergeStyleSets,
+  FontSizes,
+  FontWeights,
+  getFocusStyle
+} from '../../Styling';
+import { memoizeFunction } from '../../Utilities';
+
+const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
+
+const ComboBoxHeight = '32px';
+const ComboBoxLineHeight = '30px';
+const ComboxBoxCaretDownWidth = '32px';
+const ComboBoxOptionHeight = '36px';
+
+const getDisabledStyles = memoizeFunction((theme: ITheme): IStyle => {
+  const { semanticColors, palette } = theme;
+  return {
+    backgroundColor: semanticColors.disabledBackground,
+    borderColor: semanticColors.disabledBackground,
+    color: semanticColors.disabledText,
+    cursor: 'default',
+    [MS_HIGHCONTRAST_ACTIVE]: {
+      borderColor: 'GrayText',
+      color: 'GrayText'
+    },
+  };
+});
+
+const getListOptionHighContrastStyles = memoizeFunction((theme: ITheme): IStyle => {
+  const { semanticColors, palette } = theme;
+  return {
+    [MS_HIGHCONTRAST_ACTIVE]: {
+      backgroundColor: 'Highlight',
+      borderColor: 'Highlight',
+      color: 'HighlightText',
+    },
+  };
+});
+
+export const getOptionStyles = memoizeFunction((
+  theme: ITheme,
+  customStylesForAllOptions?: Partial<IComboBoxOptionStyles>,
+  customOptionStylesForCurrentOption?: Partial<IComboBoxOptionStyles>,
+): IComboBoxOptionStyles => {
+
+  const { semanticColors, fonts, palette } = theme;
+
+  const ComboBoxOptionBackgroundSelected = semanticColors.menuItemBackgroundChecked;
+  const ComboBoxOptionBackgroundHovered = semanticColors.menuItemBackgroundHovered;
+  const ComboBoxOptionTextColorHovered = palette.black;
+  const ComboBoxOptionTextColorSelected = palette.black;
+  const ComboBoxOptionTextColorDisabled = semanticColors.disabledText;
+  const ComboBoxOptionBackgroundDisabled = semanticColors.disabledBackground;
+
+  const optionStyles: IComboBoxOptionStyles = {
+    root: [
+      {
+        backgroundColor: 'transparent',
+        boxSizing: 'border-box',
+        cursor: 'pointer',
+        display: 'block',
+        width: '100%',
+        height: 'auto',
+        minHeight: ComboBoxOptionHeight,
+        lineHeight: '20px',
+        // padding: '5px 16px',
+        paddingTop: '5px',
+        paddingRight: '16px',
+        paddingBottom: '5px',
+        paddingLeft: '16px',
+        position: 'relative',
+        borderWidth: '1px',
+        borderStyle: 'solid',
+        borderColor: 'transparent',
+        wordWrap: 'break-word',
+        overflowWrap: 'break-word',
+        textAlign: 'left',
+
+        [MS_HIGHCONTRAST_ACTIVE]: {
+          borderColor: 'Background'
+        }
+      },
+      getFocusStyle(theme),
+    ],
+    rootHovered: {
+      backgroundColor: ComboBoxOptionBackgroundHovered,
+      color: ComboBoxOptionTextColorHovered,
+      ...getListOptionHighContrastStyles(theme)
+    },
+    rootFocused: {
+      backgroundColor: ComboBoxOptionBackgroundHovered
+    },
+    rootPressed: {
+      backgroundColor: ComboBoxOptionBackgroundHovered,
+      color: ComboBoxOptionTextColorHovered
+    },
+    rootChecked: [
+      {
+        backgroundColor: ComboBoxOptionBackgroundSelected,
+        color: ComboBoxOptionTextColorSelected
+      },
+      getFocusStyle(theme),
+      getListOptionHighContrastStyles(theme)
+    ],
+    rootCheckedHovered: {
+      backgroundColor: ComboBoxOptionBackgroundSelected
+    },
+    rootDisabled: {
+      backgroundColor: ComboBoxOptionBackgroundDisabled,
+      color: ComboBoxOptionTextColorDisabled,
+      cursor: 'default',
+      ' .ms-Button-flexContainer': {
+        justifyContent: 'flex-start'
+      }
+    },
+    optionText: {
+      overflow: 'hidden',
+      whiteSpace: 'nowrap',
+      textOverflow: 'ellipsis',
+      minWidth: '0px',
+      maxWidth: '100%',
+      wordWrap: 'break-word',
+      overflowWrap: 'break-word',
+
+      // margin: '1px',
+      marginTop: '1px',
+      marginRight: '1px',
+      marginBottom: '1px',
+      marginLeft: '1px',
+    },
+  };
+
+  return mergeStyleSets(optionStyles, customStylesForAllOptions, customOptionStylesForCurrentOption) as IComboBoxOptionStyles;
+});
+
+export const getCaretDownButtonStyles = memoizeFunction((
+  theme: ITheme,
+  customStyles?: Partial<IComboBoxCaretDownButtonStyles>,
+): IComboBoxCaretDownButtonStyles => {
+  const { semanticColors, fonts, palette } = theme;
+
+  const caretButtonTextColor = palette.neutralDark;
+  const caretButtonBackgroundHovered = palette.neutralQuaternaryAlt;
+  const caretButtonBackgroundActive = palette.neutralTertiaryAlt;
+
+  const styles: IComboBoxCaretDownButtonStyles = {
+    root: {
+      color: caretButtonTextColor,
+      fontSize: FontSizes.small,
+      position: 'absolute',
+      height: ComboBoxHeight,
+      lineHeight: ComboBoxLineHeight,
+      width: ComboxBoxCaretDownWidth,
+      textAlign: 'center',
+      cursor: 'default',
+      [MS_HIGHCONTRAST_ACTIVE]: {
+        backgroundColor: 'ButtonFace',
+        borderColor: 'ButtonText',
+        color: 'ButtonText',
+      }
+    },
+    rootHovered: {
+      backgroundColor: caretButtonBackgroundHovered
+    },
+    rootPressed: {
+      backgroundColor: caretButtonBackgroundActive
+    },
+    rootDisabled: getDisabledStyles(theme),
+  };
+  return mergeStyleSets(styles, customStyles) as IComboBoxCaretDownButtonStyles;
+});
+
+export const getStyles = memoizeFunction((
+  theme: ITheme,
+  customStyles?: Partial<IComboBoxStyles>,
+): IComboBoxStyles => {
+
+  const { semanticColors, fonts, palette } = theme;
+
+  const ComboBoxRootBackground = semanticColors.bodyBackground;
+  const ComboBoxRootTextColor = semanticColors.bodyText;
+  const ComboBoxRootBorderColor = palette.neutralTertiaryAlt;
+  const ComboBoxRootBorderColorHovered = semanticColors.inputFocusBorderAlt;
+  const ComboBoxRootColorErrored = semanticColors.errorText;
+  const ComboBoxCalloutBorderColor = palette.neutralLight;
+  const ComboBoxOptionHeaderTextColor = semanticColors.menuHeader;
+  const ComboBoxOptionDividerBorderColor = semanticColors.bodyDivider;
+
+  const styles: IComboBoxStyles = {
+    container: {
+
+    },
+    label: {
+
+    },
+    root: [
+      fonts.medium,
+      {
+        boxShadow: 'none',
+        // margin: '0 0 10px 0',
+        marginTop: '0',
+        marginRight: '0',
+        marginBottom: '10px',
+        marginLeft: '0',
+
+        // padding: '0',
+        paddingTop: '0',
+        paddingRight: ComboxBoxCaretDownWidth,
+        paddingBottom: '0',
+        paddingLeft: '0',
+
+        color: ComboBoxRootTextColor,
+        position: 'relative',
+        outline: '0',
+        userSelect: 'none',
+        backgroundColor: ComboBoxRootBackground,
+        borderWidth: '1px',
+        borderStyle: 'solid',
+        borderColor: ComboBoxRootBorderColor,
+        cursor: 'text',
+        display: 'block',
+        height: ComboBoxHeight,
+        lineHeight: ComboBoxLineHeight,
+        overflow: 'hidden',
+        whiteSpace: 'nowrap',
+        textOverflow: 'ellipsis',
+        boxSizing: 'content-box',
+        ' .ms-Label': {
+          display: 'inline-block',
+          marginBottom: '8px',
+        }
+      }
+    ],
+    rootHovered: {
+      borderColor: ComboBoxRootBorderColorHovered,
+      [MS_HIGHCONTRAST_ACTIVE]: {
+        color: 'HighlightText',
+        borderColor: 'Highlight'
+      },
+    },
+    rootFocused: {
+      borderColor: ComboBoxRootBorderColorHovered,
+      [MS_HIGHCONTRAST_ACTIVE]: {
+        color: 'HighlightText',
+        borderColor: 'Highlight'
+      },
+    },
+    rootDisabled: getDisabledStyles(theme),
+    rootError: {
+      borderColor: ComboBoxRootColorErrored
+    },
+    rootDisallowFreeForm: {
+
+    },
+    input: {
+      boxSizing: 'border-box',
+      width: '100%',
+      height: '100%',
+      borderStyle: 'none',
+      outline: 'none',
+      font: 'inherit',
+      textOverflow: 'ellipsis',
+      paddingLeft: '12px'
+    },
+    inputDisabled: getDisabledStyles(theme),
+    caretDownButtonStyles: null,
+    errorMessage: {
+      color: ComboBoxRootColorErrored,
+      ':before': {
+        content: '* ',
+      }
+    },
+    callout: {
+      boxShadow: '0 0px 5px 0px rgba(0, 0, 0, 0.4)',
+      borderWidth: '1px',
+      borderStyle: 'solid',
+      borderColor: ComboBoxCalloutBorderColor,
+    },
+    optionsContainer: {
+      display: 'block'
+    },
+    header: [
+      fonts.medium,
+      {
+        fontWeight: FontWeights.semibold,
+        color: ComboBoxOptionHeaderTextColor,
+        backgroundColor: 'none',
+        borderStyle: 'none',
+        height: ComboBoxOptionHeight,
+        lineHeight: ComboBoxOptionHeight,
+        cursor: 'default',
+        // padding: '0px 16px',
+        paddingTop: '0',
+        paddingRight: '16px',
+        paddingBottom: '0',
+        paddingLeft: '16px',
+
+        userSelect: 'none',
+        textAlign: 'left'
+      }
+    ],
+    divider: {
+      borderWidth: '1px',
+      borderStyle: 'solid',
+      borderColor: ComboBoxOptionDividerBorderColor
+    },
+    optionDefaultStyles: null,
+  };
+
+  return mergeStyleSets(styles, customStyles) as IComboBoxStyles;
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
index 2b1592439a062..f6a677a3a1b9c 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
 import * as ReactTestUtils from 'react-addons-test-utils';
-import { mount, shallow } from 'enzyme';
+import { mount } from 'enzyme';
 import { KeyCodes } from '../../Utilities';
 let { expect } = chai;
 
@@ -25,17 +25,18 @@ const DEFAULT_OPTIONS2: IComboBoxOption[] = [
 describe('ComboBox', () => {
 
   it('Can flip between enabled and disabled.', () => {
-    let wrapper = shallow(
+    let wrapper = mount(
       <ComboBox
+        disabled={ false }
         label='testgroup'
         options={ DEFAULT_OPTIONS }
       />);
     let comboBoxRoot = wrapper.find('.ms-ComboBox');
 
-    expect(comboBoxRoot.find('.is-disabled').length).equals(0, `shouldn't be disabled`);
-    expect(comboBoxRoot.find('[data-is-interactable=true]').length).equals(1, 'data-is-focusable="true"');
+    expect(comboBoxRoot.find('.ms-ComboBox.is-disabled').length).equals(0, `shouldn't be disabled`);
+    expect(comboBoxRoot.find('[data-is-interactable=true]').length).equals(1, 'data-is-interactable="true"');
 
-    wrapper = shallow(
+    wrapper = mount(
       <ComboBox
         disabled={ true }
         label='testgroup'
@@ -43,8 +44,8 @@ describe('ComboBox', () => {
       />);
     comboBoxRoot = wrapper.find('.ms-ComboBox');
 
-    expect(comboBoxRoot.find('.is-disabled').length).equals(1, `should be disabled`);
-    expect(comboBoxRoot.find('[data-is-interactable=false]').length).equals(1, 'data-is-focusable="false"');
+    expect(comboBoxRoot.find('.ms-ComboBox.is-disabled').length).equals(1, `should be disabled`);
+    expect(comboBoxRoot.find('[data-is-interactable=false]').length).equals(1, 'data-is-interactable="false"');
   });
 
   it('Renders no selected item in default case', () => {
@@ -123,7 +124,7 @@ describe('ComboBox', () => {
     comboBoxRoot = wrapper.find('.ms-ComboBox');
     let buttonElement = comboBoxRoot.find('button');
     buttonElement.simulate('click');
-    let secondItemElement = wrapper.getDOMNode().ownerDocument.querySelector('.ms-ComboBox-item[data-index="1"]');
+    let secondItemElement = wrapper.getDOMNode().ownerDocument.querySelector('.ms-ComboBox-option[data-index="1"]');
     ReactTestUtils.Simulate.click(secondItemElement);
     let inputElement = comboBoxRoot.find('input');
     expect(inputElement.props().value).equals('2');
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 17e1b6b1eb7a0..2bf0793e63ea8 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -12,16 +12,26 @@ import { IBaseAutoFillProps } from '../pickers/AutoFill/BaseAutoFill.Props';
 import {
   autobind,
   BaseComponent,
-  css,
   divProperties,
   findIndex,
   getId,
   getNativeProps,
-  KeyCodes
+  KeyCodes,
 } from '../../Utilities';
 import { SelectableOptionMenuItemType } from '../../utilities/selectableOption/SelectableOption.Props';
-import * as stylesImport from './ComboBox.scss';
-const styles: any = stylesImport;
+
+import {
+  customizable,
+} from '../../Utilities';
+import {
+  getStyles,
+  getOptionStyles,
+  getCaretDownButtonStyles
+} from './ComboBox.styles';
+import {
+  IComboBoxClassNames,
+  getClassNames,
+} from './ComboBox.classNames';
 
 export interface IComboBoxState {
 
@@ -55,6 +65,7 @@ enum SearchDirection {
   forward = 1
 }
 
+@customizable(['theme'])
 export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
   public static defaultProps: IComboBoxProps = {
@@ -99,6 +110,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   // The current visible value sent to the auto fill on render
   private _currentVisibleValue: string | undefined;
 
+  private _classNames: IComboBoxClassNames;
+
   constructor(props: IComboBoxProps) {
     super(props);
 
@@ -200,38 +213,43 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       onRenderContainer = this._onRenderContainer,
       allowFreeform,
       autoComplete,
-      buttonIconProps
+      buttonIconProps,
+      styles: customStyles,
+      theme,
     } = this.props;
     let { isOpen, selectedIndex, focused, suggestedDisplayValue } = this.state;
     this._currentVisibleValue = this._getVisibleValue();
 
     let divProps = getNativeProps(this.props, divProperties);
 
+    let hasErrorMessage = (errorMessage && errorMessage.length > 0) ? true : false;
+
+    this._classNames = getClassNames(
+      getStyles(theme, customStyles),
+      className,
+      !!isOpen,
+      !!disabled,
+      !!required,
+      !!focused,
+      !!allowFreeform,
+      !!hasErrorMessage
+    );
+
     return (
-      <div {...divProps } ref='root' className={ css('ms-ComboBox-container') }>
+      <div {...divProps } ref='root' className={ this._classNames.container }>
         { label && (
-          <Label id={ id + '-label' } required={ required } htmlFor={ id }>{ label }</Label>
+          <Label id={ id + '-label' } required={ required } htmlFor={ id } className={ this._classNames.label }>{ label }</Label>
         ) }
         <div
           ref={ this._resolveRef('_comboBoxWrapper') }
           id={ id + 'wrapper' }
-          className={
-            css('ms-ComboBox', styles.wrapper,
-              (errorMessage && errorMessage.length > 0 ? styles.wrapperForError : null),
-              styles.root, className, {
-                'is-open': !!isOpen,
-                ['is-disabled ' + styles.rootIsDisabled]: !!disabled,
-                'is-required ': !!required,
-                [styles.focused]: !!focused,
-                [styles.readOnly]: !allowFreeform
-              }
-            )
-          } >
+          className={ this._classNames.root }
+        >
           <BaseAutoFill
             data-is-interactable={ !disabled }
             ref={ this._resolveRef('_comboBox') }
             id={ id + '-input' }
-            className={ css('ms-ComboBox-Input', styles.input) }
+            className={ this._classNames.input }
             type='text'
             key={ selectedIndex }
             onFocus={ this._select }
@@ -257,7 +275,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
             updateValueInWillReceiveProps={ this._onUpdateValueInAutoFillWillReceiveProps }
             shouldSelectFullInputValueInComponentDidUpdate={ this._onShouldSelectFullInputValueInAutoFillComponentDidUpdate } />
           <IconButton
-            className={ css('ms-ComboBox-Button', styles.caretDown) }
+            className={ 'ms-ComboBox-CaretDown-button' }
+            styles={ this._getCaretButtonStyles() }
             role='presentation'
             aria-hidden='true'
             tabIndex={ -1 }
@@ -272,7 +291,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         {
           errorMessage &&
           <div
-            className={ css(styles.errorMessage) }>
+            className={ this._classNames.errorMessage }>
             { errorMessage }
           </div>
         }
@@ -734,7 +753,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         directionalHint={ DirectionalHint.bottomLeftEdge }
         directionalHintFixed={ true }
         { ...calloutProps }
-        className={ css('ms-ComboBox-callout', styles.callout, calloutProps ? calloutProps.className : undefined) }
+        className={ this._classNames.callout }
         targetElement={ this._comboBoxWrapper }
         onDismiss={ this._onDismiss }
         setInitialFocus={ false }
@@ -759,7 +778,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     return (
       <div
         id={ id + '-list' }
-        className={ css('ms-ComboBox-items', styles.items) }
+        className={ this._classNames.optionsContainer }
         aria-labelledby={ id + '-label' }
         role='listbox'
       >
@@ -771,6 +790,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   // Render items
   @autobind
   private _onRenderItem(item: IComboBoxOption): JSX.Element | null {
+
     switch (item.itemType) {
       case SelectableOptionMenuItemType.Divider:
         return this._renderSeparator(item);
@@ -784,19 +804,21 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   // Render separator
   private _renderSeparator(item: IComboBoxOption): JSX.Element | null {
     let { index, key } = item;
+
     if (index && index > 0) {
       return <div
         role='separator'
         key={ key }
-        className={ css('ms-ComboBox-divider', styles.divider) } />;
+        className={ this._classNames.divider } />;
     }
     return null;
   }
 
   private _renderHeader(item: IComboBoxOption): JSX.Element {
     let { onRenderOption = this._onRenderOption } = this.props;
+
     return (
-      <div key={ item.key } className={ css('ms-ComboBox-header', styles.header) } role='header'>
+      <div key={ item.key } className={ this._classNames.header } role='header'>
         { onRenderOption(item, this._onRenderOption) }
       </div>);
   }
@@ -812,13 +834,9 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         id={ id + '-list' + item.index }
         key={ item.key }
         data-index={ item.index }
-        className={ css(
-          'ms-ComboBox-item', styles.item, {
-            ['is-selected ' + styles.itemIsSelected]:
-            isSelected,
-            ['is-disabled ' + styles.itemIsDisabled]: this.props.disabled === true
-          }
-        ) }
+        className={ 'ms-ComboBox-option' }
+        styles={ this._getCurrentOptionStyles(item) }
+        checked={ isSelected }
         onClick={ () => this._onItemClick(item.index) }
         role='option'
         aria-selected={ isSelected ? 'true' : 'false' }
@@ -868,7 +886,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   // Render content of item
   @autobind
   private _onRenderOption(item: IComboBoxOption): JSX.Element {
-    return <span className={ css('ms-ComboBox-optionText', styles.optionText) }>{ item.text }</span>;
+    const optionStyles = this._getCurrentOptionStyles(item);
+    return <span className={ optionStyles.optionText as string }>{ item.text }</span>;
   }
 
   /**
@@ -1217,4 +1236,29 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       });
     }
   }
+
+  /**
+ * Get the styles for the current option.
+ * @param item Item props for the current option
+ */
+  private _getCaretButtonStyles() {
+    const { styles: customStyles } = this.props;
+    const caretButtoncustomStyles = customStyles ? customStyles.caretDownButtonStyles : null;
+
+    return getCaretDownButtonStyles(this.props.theme, caretButtoncustomStyles);
+  }
+
+  /**
+   * Get the styles for the current option.
+   * @param item Item props for the current option
+   */
+  private _getCurrentOptionStyles(item: IComboBoxOption) {
+    const { styles: customStyles } = this.props;
+    const customStylesForAllOptions = customStyles ? customStyles.optionDefaultStyles : null;
+    const { styles: customStylesForCurrentOption } = item;
+
+    const isSelected: boolean = this._isOptionSelected(item.index);
+
+    return getOptionStyles(this.props.theme, customStylesForAllOptions, customStylesForCurrentOption);
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
index 2179418e30cd4..2343fb9ad0972 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
@@ -6,6 +6,7 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { ComboBoxBasicExample } from './examples/ComboBox.Basic.Example';
+import { ComboBoxCustomStyledExample } from './examples/ComboBox.CustomStyled.Example';
 
 const ComboBoxBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx') as string;
 
@@ -18,6 +19,7 @@ export class ComboBoxPage extends React.Component<IComponentDemoPageProps, {}> {
         exampleCards={
           <ExampleCard title='ComboBox' code={ ComboBoxBasicExampleCode }>
             <ComboBoxBasicExample />
+            <ComboBoxCustomStyledExample />
           </ExampleCard>
         }
         propertiesTables={
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.scss b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.scss
index f71fcb3e8911c..4e86e9a791396 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.scss
@@ -2,14 +2,4 @@
   .ms-ComboBoxBasicExample {
     max-width: 300px;
   }
-  .ms-ComboBox-optionText {
-    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    min-width: 0px;
-    max-width: 100%;
-    word-wrap: break-word;
-    overflow-wrap: break-word;
-    margin: 1px;
-  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
index a41d39c44b1d5..75651cd447293 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
@@ -14,7 +14,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
   private _testOptions =
   [{ key: 'Header', text: 'Theme Fonts', itemType: SelectableOptionMenuItemType.Header },
   { key: 'A', text: 'Arial Black' },
-  { key: 'B', text: 'Time New Roman' },
+  { key: 'B', text: 'Times New Roman' },
   { key: 'C', text: 'Comic Sans MS' },
   { key: 'divider_2', text: '-', itemType: SelectableOptionMenuItemType.Divider },
   { key: 'Header1', text: 'Other Options', itemType: SelectableOptionMenuItemType.Header },
@@ -146,7 +146,6 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
             onRenderOption={ this._onRenderFontOption }
           />
         }
-
       </div>
 
     );
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.CustomStyled.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.CustomStyled.Example.tsx
new file mode 100644
index 0000000000000..573583dde420f
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.CustomStyled.Example.tsx
@@ -0,0 +1,86 @@
+import * as React from 'react';
+import {
+  ComboBox,
+  IComboBoxOption
+} from 'office-ui-fabric-react/lib/ComboBox';
+import './ComboBox.Basic.Example.scss';
+import {
+  assign,
+  autobind
+} from 'office-ui-fabric-react/lib/Utilities';
+import { SelectableOptionMenuItemType } from 'office-ui-fabric-react/lib/utilities/selectableOption/SelectableOption.Props';
+
+export class ComboBoxCustomStyledExample extends React.Component<any, any> {
+
+  private _testOptionsWithCustomStyling =
+  [{
+    key: 'A',
+    text: 'Arial Black',
+    styles: {
+      optionText: {
+        fontFamily: '"Arial Black", "Arial Black_MSFontService", sans-serif',
+      }
+    }
+  },
+  {
+    key: 'B',
+    text: 'Times New Roman',
+    styles: {
+      optionText: {
+        fontFamily: '"Times New Roman", "Times New Roman_MSFontService", serif',
+      }
+    }
+  },
+  {
+    key: 'C',
+    text: 'Comic Sans MS',
+    styles: {
+      optionText: {
+        fontFamily: '"Comic Sans MS", "Comic Sans MS_MSFontService", fantasy',
+      }
+    }
+  },
+  {
+    key: 'D',
+    text: 'Calibri',
+    styles: {
+      optionText: {
+        fontFamily: 'Calibri, Calibri_MSFontService, sans-serif',
+      }
+    }
+  },
+  ];
+
+  constructor() {
+    super();
+  }
+
+  public render() {
+    return (
+      <div className='ms-ComboBoxCustomStyledExample'>
+        <ComboBox
+          defaultSelectedKey='C'
+          label='Custom styled uncontrolled ComboBox (allowFreeform: T, AutoComplete: T):'
+          id='Basicdrop6'
+          ariaLabel='Custom styled ComboBox example'
+          allowFreeform={ true }
+          autoComplete='on'
+          options={ this._testOptionsWithCustomStyling }
+          styles={
+            {
+              container: {
+                maxWidth: '300px'
+              },
+              optionDefaultStyles: {
+                optionText: {
+                  fontFamily: 'initial', // this should be overriden by custom styles for each option
+                },
+              }
+            }
+          }
+        />
+
+      </div>
+    );
+  }
+}
\ No newline at end of file

From 71b918343e8b8afed73902008d5332bbc200136b Mon Sep 17 00:00:00 2001
From: Aniket Handa <atneik@users.noreply.github.com>
Date: Thu, 27 Jul 2017 15:03:31 -0700
Subject: [PATCH 0319/1641] Fix hover card scroll in case of list (#2315)

* Fix in case of a List/DetailsList

* Add rush change
---
 ...-hoverCard-scrollFix_2017-07-27-08-14.json | 11 ++++++++
 .../HoverCard/ExpandingCard.Props.ts          |  5 ++++
 .../HoverCard/ExpandingCard.styles.ts         | 28 +++++++++++--------
 .../components/HoverCard/ExpandingCard.tsx    |  4 ++-
 .../components/HoverCard/HoverCard.Props.ts   |  2 +-
 .../src/components/HoverCard/HoverCard.tsx    |  2 +-
 .../examples/HoverCard.Basic.Example.tsx      |  8 ++++--
 7 files changed, 44 insertions(+), 16 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/anihan-hoverCard-scrollFix_2017-07-27-08-14.json

diff --git a/common/changes/office-ui-fabric-react/anihan-hoverCard-scrollFix_2017-07-27-08-14.json b/common/changes/office-ui-fabric-react/anihan-hoverCard-scrollFix_2017-07-27-08-14.json
new file mode 100644
index 0000000000000..335d43c441e72
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/anihan-hoverCard-scrollFix_2017-07-27-08-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix hover card scroll",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "anihan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts
index f8c975ad3220b..b8f0cfe783a45 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts
@@ -103,4 +103,9 @@ export interface IExpandingCardStyles {
    * Base Style for the expanded card content
    */
   expandedCard?: IStyle;
+
+  /**
+   * Style for the expanded card scroll content
+   */
+  expandedCardScroll?: IStyle;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
index 323207a8c291a..7e1f6a1e19539 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
@@ -2,7 +2,7 @@ import { IExpandingCardStyles } from './ExpandingCard.Props';
 import { memoizeFunction } from '../../Utilities';
 import {
   mergeStyleSets,
-  after,
+  before,
   ITheme
 } from '../../Styling';
 
@@ -20,26 +20,32 @@ export const getStyles = memoizeFunction((
         border: 'none'
       }
     },
-    compactCard: [
+    compactCard: {
+      'pointer-events': 'auto',
+      position: 'relative'
+    },
+    expandedCard: [
       {
+        height: '1px',
+        'overflow-y': 'hidden',
         'pointer-events': 'auto',
-        position: 'relative'
+        transition: 'height 0.467s cubic-bezier(0.5, 0, 0, 1)'
       },
-      after({
+      before({
         content: '""',
-        position: 'absolute',
-        bottom: '0',
+        position: 'relative',
+        display: 'block',
+        top: '0',
         left: '0',
         right: '0',
         height: '1px',
         'background-color': theme.palette.neutralLighter
       })
     ],
-    expandedCard: {
-      height: '0',
-      'overflow-y': 'hidden',
-      'pointer-events': 'auto',
-      transition: 'height 0.467s cubic-bezier(0.5, 0, 0, 1)'
+    expandedCardScroll: {
+      height: '100%',
+      'box-sizing': 'border-box',
+      'overflow-y': 'auto'
     }
   };
 
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
index 5dbea36a444db..ed064d7bddf79 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
@@ -122,7 +122,9 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
       ) as string }
         ref={ this._resolveRef('_expandedElem') }
       >
-        { this.props.onRenderExpandedCard && this.props.onRenderExpandedCard(this.props.renderData) }
+        <div className={ this._styles.expandedCardScroll as string }>
+          { this.props.onRenderExpandedCard && this.props.onRenderExpandedCard(this.props.renderData) }
+        </div>
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts
index ec615b983c76c..10126c98d318b 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts
@@ -42,7 +42,7 @@ export interface IHoverCardProps extends React.HTMLAttributes<HTMLDivElement | H
 
   /**
    * Time in ms when expanded card should open after compact card
-   * @default 1000
+   * @default 1500
    */
   expandedCardOpenDelay?: number;
 
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
index c5ae340d9b77f..e2804e63edb3e 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
@@ -24,7 +24,7 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
   public static defaultProps = {
     cardOpenDelay: 500,
     cardDismissDelay: 100,
-    expandedCardOpenDelay: 1000,
+    expandedCardOpenDelay: 1500,
     instantOpenOnClick: false
   };
 
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx
index 0b33539199d5e..7fe73a78ce708 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx
@@ -81,11 +81,15 @@ export class HoverCardBasicExample extends BaseComponent<{}, IHoverCardExampleSt
 
   @autobind
   private _onRenderExpandedCard(item: any): JSX.Element {
+    let { items, columns } = this.state;
     return (
       <div className='hoverCardExample-expandedCard'>
         { item.description }
-        { item.description }
-        { item.description }
+        <DetailsList
+          setKey='expandedCardSet'
+          items={ items }
+          columns={ columns }
+        />
       </div>
     );
   }

From de23624077202ce5c1542db44d809586e6eef420 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Thu, 27 Jul 2017 17:57:44 -0700
Subject: [PATCH 0320/1641] Checkbox label align (#2320)

* Update Checkbox label style with text-align

* Add change file for Checkbox label align
---
 .../checkbox-label-align_2017-07-27-22-02.json        | 11 +++++++++++
 .../src/components/Checkbox/Checkbox.styles.ts        |  3 ++-
 2 files changed, 13 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/checkbox-label-align_2017-07-27-22-02.json

diff --git a/common/changes/office-ui-fabric-react/checkbox-label-align_2017-07-27-22-02.json b/common/changes/office-ui-fabric-react/checkbox-label-align_2017-07-27-22-02.json
new file mode 100644
index 0000000000000..0390655a7596f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/checkbox-label-align_2017-07-27-22-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Checkbox: Added left textAlign style",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "a.erich@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
index e27e1bcc0fc03..87b2ac16c0fc6 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
@@ -43,7 +43,8 @@ export const getStyles = memoizeFunction((
       alignItems: 'center',
       cursor: 'pointer',
       position: 'relative',
-      userSelect: 'none'
+      userSelect: 'none',
+      textAlign: 'left'
     },
     labelReversed: {
       flexDirection: 'row-reverse',

From fd03731e7523f372438853eccbc13f59d0f2d9d7 Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Thu, 27 Jul 2017 18:11:43 -0700
Subject: [PATCH 0321/1641] Theming: add settings to the interface (#2297)

* add theme settings to track inverted themes

* add change file

* missing semicolon

* make isInverted a top level thingymajig
---
 .../styling/phkuo-invertedTheme_2017-07-24-21-01.json | 11 +++++++++++
 packages/styling/src/interfaces/ITheme.ts             |  2 ++
 packages/styling/src/styles/theme.ts                  |  6 ++++--
 3 files changed, 17 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/phkuo-invertedTheme_2017-07-24-21-01.json

diff --git a/common/changes/@uifabric/styling/phkuo-invertedTheme_2017-07-24-21-01.json b/common/changes/@uifabric/styling/phkuo-invertedTheme_2017-07-24-21-01.json
new file mode 100644
index 0000000000000..ff3bf58db6af2
--- /dev/null
+++ b/common/changes/@uifabric/styling/phkuo-invertedTheme_2017-07-24-21-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Theming: add settings to the interface so we can track whether the current theme is inverted or not",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/styling/src/interfaces/ITheme.ts b/packages/styling/src/interfaces/ITheme.ts
index 90fb34dbac2d6..c918041937e20 100644
--- a/packages/styling/src/interfaces/ITheme.ts
+++ b/packages/styling/src/interfaces/ITheme.ts
@@ -6,10 +6,12 @@ export interface ITheme {
   palette: IPalette;
   fonts: IFontStyles;
   semanticColors: ISemanticColors;
+  isInverted: boolean;
 }
 
 export interface IPartialTheme {
   palette?: Partial<IPalette>;
   fonts?: Partial<IFontStyles>;
   semanticColors?: Partial<ISemanticColors>;
+  isInverted?: boolean;
 }
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index 7b6ebcb04641b..40429ce1fd0ad 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -16,7 +16,8 @@ import { loadTheme as legacyLoadTheme } from '@microsoft/load-themed-styles';
 let _theme: ITheme = {
   palette: DefaultPalette,
   semanticColors: _makeSemanticColorsFromPalette(DefaultPalette),
-  fonts: DefaultFontStyles
+  fonts: DefaultFontStyles,
+  isInverted: false
 };
 
 export const ThemeSettingName = 'theme';
@@ -67,7 +68,8 @@ export function createTheme(theme: IPartialTheme): ITheme {
       ...DefaultFontStyles,
       ...theme.fonts
     },
-    semanticColors: { ..._makeSemanticColorsFromPalette(newPalette), ...theme.semanticColors }
+    semanticColors: { ..._makeSemanticColorsFromPalette(newPalette), ...theme.semanticColors },
+    isInverted: !!theme.isInverted
   } as ITheme;
 }
 

From b5c0fba73cc02669f9e025a228811840876e8bf7 Mon Sep 17 00:00:00 2001
From: David Michon <dmichon@microsoft.com>
Date: Thu, 27 Jul 2017 18:20:34 -0700
Subject: [PATCH 0322/1641] [Accessibility] Use 'menuitemcheckbox' role for
 checkable menu items (#2318)

* Update accessibility for checkable menu items

* Change file
---
 .../menuitem-check_2017-07-27-21-44.json      | 11 ++++++
 .../ContextualMenu/ContextualMenu.tsx         | 35 ++++++++++++++++---
 2 files changed, 41 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/menuitem-check_2017-07-27-21-44.json

diff --git a/common/changes/office-ui-fabric-react/menuitem-check_2017-07-27-21-44.json b/common/changes/office-ui-fabric-react/menuitem-check_2017-07-27-21-44.json
new file mode 100644
index 0000000000000..899722b3d2303
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/menuitem-check_2017-07-27-21-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Update accessibility for checkable menu items",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 1632e87e85fd9..5b3ef72c1dc29 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -87,6 +87,27 @@ export function getSubmenuItems(item: IContextualMenuItem) {
   return item.subMenuProps ? item.subMenuProps.items : item.items;
 }
 
+/**
+ * Determines the effective checked state of a menu item.
+ *
+ * @param item {IContextualMenuItem} to get the check state of.
+ * @returns {true} if the item is checked.
+ * @returns {false} if the item is unchecked.
+ * @returns {null} if the item is not checkable.
+ */
+function getIsChecked(item: IContextualMenuItem): boolean | null {
+  if (item.canCheck) {
+    return item.isChecked || item.checked;
+  }
+
+  if (typeof item.isChecked === 'boolean') {
+    return item.isChecked;
+  }
+
+  // Item is not checkable.
+  return null;
+}
+
 @withResponsiveMode
 export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContextualMenuState> {
   // The default ContextualMenu properties have no items and beak, the default submenu direction is right and top.
@@ -349,7 +370,10 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       ariaLabel = item.name;
     }
 
-    let itemButtonProperties = {
+    const isChecked: boolean | null = getIsChecked(item);
+    const canCheck: boolean = isChecked !== null;
+
+    const itemButtonProperties = {
       className: css('ms-ContextualMenu-link', styles.link, {
         ['is-expanded ' + styles.isExpanded]: (expandedMenuItemKey === item.key)
       }),
@@ -362,9 +386,10 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       href: item.href,
       title: item.title,
       'aria-label': ariaLabel,
-      'aria-haspopup': hasSubmenuItems(item) ? true : null,
+      'aria-haspopup': hasSubmenuItems(item) || null,
       'aria-owns': item.key === expandedMenuItemKey ? subMenuId : null,
-      role: 'menuitem',
+      'aria-checked': isChecked,
+      role: canCheck ? 'menuitemcheckbox' : 'menuitem',
       style: item.style,
     };
 
@@ -375,12 +400,12 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   }
 
   private _renderMenuItemChildren(item: IContextualMenuItem, index: number, hasCheckmarks: boolean, hasIcons: boolean) {
-    let isItemChecked: boolean = (item.isChecked || item.checked) as boolean;
+    const isItemChecked: boolean | null = getIsChecked(item);
     return (
       <div className={ css('ms-ContextualMenu-linkContent', styles.linkContent) }>
         { (hasCheckmarks) ? (
           <Icon
-            iconName={ isItemChecked ? 'CheckMark' : 'CustomIcon' }
+            iconName={ isItemChecked === true ? 'CheckMark' : 'CustomIcon' }
             className={ css('ms-ContextualMenu-icon', styles.icon) }
             onClick={ this._onItemClick.bind(this, item) } />
         ) : (null) }

From 4bc16e57321f3ef14b0889e8325d9f4b1061e672 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 28 Jul 2017 10:23:11 +0000
Subject: [PATCH 0323/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../ComboBoxGlamor_2017-07-21-19-23.json      | 11 ------
 .../ComboBoxGlamor_2017-07-21-19-23.json      | 11 ------
 .../ComboBoxGlamor_2017-07-21-19-23.json      | 11 ------
 .../phkuo-invertedTheme_2017-07-24-21-01.json | 11 ------
 .../ComboBoxGlamor_2017-07-21-19-23.json      | 11 ------
 .../ComboBoxGlamor_2017-07-21-19-23.json      | 11 ------
 ...-hoverCard-scrollFix_2017-07-27-08-14.json | 11 ------
 ...checkbox-label-align_2017-07-27-22-02.json | 11 ------
 .../menuitem-check_2017-07-27-21-44.json      | 11 ------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 36 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 +++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/CHANGELOG.json               | 21 +++++++++++
 packages/styling/CHANGELOG.md                 | 13 ++++++-
 packages/styling/package.json                 |  2 +-
 21 files changed, 92 insertions(+), 110 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/ComboBoxGlamor_2017-07-21-19-23.json
 delete mode 100644 common/changes/@uifabric/fabric-website/ComboBoxGlamor_2017-07-21-19-23.json
 delete mode 100644 common/changes/@uifabric/styling/ComboBoxGlamor_2017-07-21-19-23.json
 delete mode 100644 common/changes/@uifabric/styling/phkuo-invertedTheme_2017-07-24-21-01.json
 delete mode 100644 common/changes/@uifabric/utilities/ComboBoxGlamor_2017-07-21-19-23.json
 delete mode 100644 common/changes/office-ui-fabric-react/ComboBoxGlamor_2017-07-21-19-23.json
 delete mode 100644 common/changes/office-ui-fabric-react/anihan-hoverCard-scrollFix_2017-07-27-08-14.json
 delete mode 100644 common/changes/office-ui-fabric-react/checkbox-label-align_2017-07-27-22-02.json
 delete mode 100644 common/changes/office-ui-fabric-react/menuitem-check_2017-07-27-21-44.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index c3a5c74f22100..2ec2c2f34c720 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.23.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.24.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 1c7f0ab413030..b46571796a2c0 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.23.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.25.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 1483e9134d37f..5bd44a2f89f3e 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -35,7 +35,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.23.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.25.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 8cc030d4b0e4d..40a42442292ff 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.23.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.25.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/@uifabric/example-app-base/ComboBoxGlamor_2017-07-21-19-23.json b/common/changes/@uifabric/example-app-base/ComboBoxGlamor_2017-07-21-19-23.json
deleted file mode 100644
index a48a2085ece6b..0000000000000
--- a/common/changes/@uifabric/example-app-base/ComboBoxGlamor_2017-07-21-19-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "kushaly@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/ComboBoxGlamor_2017-07-21-19-23.json b/common/changes/@uifabric/fabric-website/ComboBoxGlamor_2017-07-21-19-23.json
deleted file mode 100644
index 4df779311b07b..0000000000000
--- a/common/changes/@uifabric/fabric-website/ComboBoxGlamor_2017-07-21-19-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "kushaly@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/ComboBoxGlamor_2017-07-21-19-23.json b/common/changes/@uifabric/styling/ComboBoxGlamor_2017-07-21-19-23.json
deleted file mode 100644
index 5b61db95e0352..0000000000000
--- a/common/changes/@uifabric/styling/ComboBoxGlamor_2017-07-21-19-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Adding High contrast colors to the paletter",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "kushaly@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/phkuo-invertedTheme_2017-07-24-21-01.json b/common/changes/@uifabric/styling/phkuo-invertedTheme_2017-07-24-21-01.json
deleted file mode 100644
index ff3bf58db6af2..0000000000000
--- a/common/changes/@uifabric/styling/phkuo-invertedTheme_2017-07-24-21-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Theming: add settings to the interface so we can track whether the current theme is inverted or not",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/ComboBoxGlamor_2017-07-21-19-23.json b/common/changes/@uifabric/utilities/ComboBoxGlamor_2017-07-21-19-23.json
deleted file mode 100644
index 8b9c98c03c0f4..0000000000000
--- a/common/changes/@uifabric/utilities/ComboBoxGlamor_2017-07-21-19-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "kushaly@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/ComboBoxGlamor_2017-07-21-19-23.json b/common/changes/office-ui-fabric-react/ComboBoxGlamor_2017-07-21-19-23.json
deleted file mode 100644
index 36ece412a5b82..0000000000000
--- a/common/changes/office-ui-fabric-react/ComboBoxGlamor_2017-07-21-19-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Moving ComboBox component to use the styling library",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kushaly@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/anihan-hoverCard-scrollFix_2017-07-27-08-14.json b/common/changes/office-ui-fabric-react/anihan-hoverCard-scrollFix_2017-07-27-08-14.json
deleted file mode 100644
index 335d43c441e72..0000000000000
--- a/common/changes/office-ui-fabric-react/anihan-hoverCard-scrollFix_2017-07-27-08-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix hover card scroll",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "anihan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/checkbox-label-align_2017-07-27-22-02.json b/common/changes/office-ui-fabric-react/checkbox-label-align_2017-07-27-22-02.json
deleted file mode 100644
index 0390655a7596f..0000000000000
--- a/common/changes/office-ui-fabric-react/checkbox-label-align_2017-07-27-22-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Checkbox: Added left textAlign style",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "a.erich@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/menuitem-check_2017-07-27-21-44.json b/common/changes/office-ui-fabric-react/menuitem-check_2017-07-27-21-44.json
deleted file mode 100644
index 899722b3d2303..0000000000000
--- a/common/changes/office-ui-fabric-react/menuitem-check_2017-07-27-21-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Update accessibility for checkable menu items",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index e2a9b3dfe0029..6be29fb714ee0 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -48,7 +48,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.14.0 <1.0.0",
+    "@uifabric/styling": ">=0.15.0 <1.0.0",
     "@uifabric/utilities": ">=4.8.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 4e5e197da63d2..52c8f8a0d9eec 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.23.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.25.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 592a109598126..27151545511c4 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,42 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.25.0",
+      "tag": "office-ui-fabric-react_v4.25.0",
+      "date": "Fri, 28 Jul 2017 10:23:10 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Aniket Handa <atneik@users.noreply.github.com>",
+            "commit": "71b918343e8b8afed73902008d5332bbc200136b",
+            "comment": "Fix hover card scroll"
+          },
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "de23624077202ce5c1542db44d809586e6eef420",
+            "comment": "Checkbox: Added left textAlign style"
+          },
+          {
+            "author": "David Michon <dmichon@microsoft.com>",
+            "commit": "b5c0fba73cc02669f9e025a228811840876e8bf7",
+            "comment": "Update accessibility for checkable menu items"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Kushal Yarlagadda <whykushal93@gmail.com>",
+            "commit": "20d920d1a9f38c468ab47027e9fb2ec80018d85d",
+            "comment": "Moving ComboBox component to use the styling library"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.14.0 <1.0.0` to `>=0.15.0 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.24.0",
       "tag": "office-ui-fabric-react_v4.24.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index b7e5ab1f41dbf..3b4b633e49162 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 27 Jul 2017 10:23:33 GMT and should not be manually modified.
+This log was last generated on Fri, 28 Jul 2017 10:23:10 GMT and should not be manually modified.
+
+## 4.25.0
+Fri, 28 Jul 2017 10:23:10 GMT
+
+### Minor changes
+
+- Moving ComboBox component to use the styling library
+
+### Patches
+
+- Fix hover card scroll
+- Checkbox: Added left textAlign style
+- Update accessibility for checkable menu items
 
 ## 4.24.0
 Thu, 27 Jul 2017 10:23:33 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index e2009fe68c28b..5d8f7e5281a86 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.24.0",
+  "version": "4.25.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.8.0 <5.0.0",
-    "@uifabric/styling": ">=0.14.0 <1.0.0",
+    "@uifabric/styling": ">=0.15.0 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index fbe218f04bab5..e81c31b5d8fca 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,27 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.15.0",
+      "tag": "@uifabric/styling_v0.15.0",
+      "date": "Fri, 28 Jul 2017 10:23:10 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Kushal Yarlagadda <whykushal93@gmail.com>",
+            "commit": "20d920d1a9f38c468ab47027e9fb2ec80018d85d",
+            "comment": "Adding High contrast colors to the paletter"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "fd03731e7523f372438853eccbc13f59d0f2d9d7",
+            "comment": "Theming: add settings to the interface so we can track whether the current theme is inverted or not"
+          }
+        ]
+      }
+    },
     {
       "version": "0.14.0",
       "tag": "@uifabric/styling_v0.14.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index a6a7256632bad..cf146def7b3f4 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 27 Jul 2017 10:23:33 GMT and should not be manually modified.
+This log was last generated on Fri, 28 Jul 2017 10:23:10 GMT and should not be manually modified.
+
+## 0.15.0
+Fri, 28 Jul 2017 10:23:10 GMT
+
+### Minor changes
+
+- Adding High contrast colors to the paletter
+
+### Patches
+
+- Theming: add settings to the interface so we can track whether the current theme is inverted or not
 
 ## 0.14.0
 Thu, 27 Jul 2017 10:23:33 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index f3534e8018e29..0de01488f7fb2 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.14.0",
+  "version": "0.15.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From bade6f5b0153fb82952b52be304241be9dc4572b Mon Sep 17 00:00:00 2001
From: daweffe <daweffe@microsoft.com>
Date: Fri, 28 Jul 2017 10:52:07 -0700
Subject: [PATCH 0324/1641] =?UTF-8?q?Fix=20Callout=20so=20it=20always=20ge?=
 =?UTF-8?q?ts=20a=20valid=20element=20when=20finding=20target=20by=20?=
 =?UTF-8?q?=E2=80=A6=20(#1978)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Fix Callout so it always gets a valid element when finding target by classname.

* Add the changes file

* Restore original logic and add check for string target

* Fix lint error
---
 .../daweffe-fixCalloutTarget_2017-06-22-15-45.json    | 11 +++++++++++
 .../src/components/Callout/CalloutContent.tsx         |  3 ++-
 2 files changed, 13 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/daweffe-fixCalloutTarget_2017-06-22-15-45.json

diff --git a/common/changes/office-ui-fabric-react/daweffe-fixCalloutTarget_2017-06-22-15-45.json b/common/changes/office-ui-fabric-react/daweffe-fixCalloutTarget_2017-06-22-15-45.json
new file mode 100644
index 0000000000000..1ba3d8eb840e6
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/daweffe-fixCalloutTarget_2017-06-22-15-45.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix Callout to get a valid element",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "daweffe@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index aa65f9336f7da..196844bc2df40 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -79,7 +79,8 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
   }
 
   public componentWillUpdate(newProps: ICalloutProps) {
-    if (newProps.targetElement !== this.props.targetElement || newProps.target !== this.props.target) {
+    // If the target element changed, find the new one. If we are tracking target with class name, always find element because we do not know if fabric has rendered a new element and disposed the old element.
+    if (newProps.targetElement !== this.props.targetElement || newProps.target !== this.props.target || typeof(newProps.target) === 'string' || newProps.target instanceof String) {
       let newTarget = newProps.targetElement ? newProps.targetElement : newProps.target;
       this._maxHeight = undefined;
       this._setTargetWindowAndElement(newTarget!);

From d2fdce1bdb3bec646721cf9dc0ec0cbc33622235 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 28 Jul 2017 11:11:13 -0700
Subject: [PATCH 0325/1641] Checkbox styling repairs. (#2329)

* Fixing checkbox default font color, disabled styling, removing click behavior on clicking disabled checkbox, fixing rtl bugs by using symetrical margins.

* Adding change file.
---
 .../checkbox-css_2017-07-28-17-11.json           | 11 +++++++++++
 .../src/components/Checkbox/Checkbox.styles.ts   | 10 ++++++++--
 .../src/components/Checkbox/Checkbox.tsx         | 16 +++++++++-------
 .../Checkbox/examples/Checkbox.Basic.Example.tsx |  6 ++++++
 4 files changed, 34 insertions(+), 9 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/checkbox-css_2017-07-28-17-11.json

diff --git a/common/changes/office-ui-fabric-react/checkbox-css_2017-07-28-17-11.json b/common/changes/office-ui-fabric-react/checkbox-css_2017-07-28-17-11.json
new file mode 100644
index 0000000000000..586f9a739acf4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/checkbox-css_2017-07-28-17-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Checkbox: Adjusting the default text color to not use default button color, removing click behavior for disabled checkboxes, fixing an rtl margin issue.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
index 87b2ac16c0fc6..acf6c68daf66f 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
@@ -19,10 +19,12 @@ export const getStyles = memoizeFunction((
   const checkmarkFontColor = semanticColors.inputForegroundChecked;
   const checkmarkFontColorCheckedDisabled = semanticColors.disabledBackground;
   const checkboxBorderColor = semanticColors.inputBorder;
+  const checkboxBorderColorDisabled = semanticColors.disabledText;
   const checkboxBorderHoveredColor = semanticColors.inputBorderHovered;
   const checkboxBackgroundChecked = semanticColors.inputBackgroundChecked;
   const checkboxBackgroundCheckedHovered = semanticColors.inputBackgroundCheckedHovered;
   const checkboxBackgroundDisabled = semanticColors.disabledText;
+  const checkboxTextColor = semanticColors.bodyText;
   const checkboxTextColorDisabled = semanticColors.disabledText;
 
   const styles: ICheckboxStyles = {
@@ -40,6 +42,7 @@ export const getStyles = memoizeFunction((
     ],
     label: {
       display: 'inline-flex',
+      margin: '0 -4px',
       alignItems: 'center',
       cursor: 'pointer',
       position: 'relative',
@@ -62,7 +65,7 @@ export const getStyles = memoizeFunction((
       borderWidth: '1px',
       borderStyle: 'solid',
       borderColor: checkboxBorderColor,
-      marginRight: '8px',
+      margin: '0 4px',
       boxSizing: 'border-box',
       transitionProperty: 'background, border, border-color',
       transitionDuration: MS_CHECKBOX_TRANSITION_DURATION,
@@ -82,9 +85,11 @@ export const getStyles = memoizeFunction((
     },
     checkboxDisabled: {
       background: checkboxBackgroundDisabled,
+      borderColor: checkboxBorderColorDisabled
     },
     checkboxCheckedDisabled: {
       background: checkboxBackgroundDisabled,
+      borderColor: checkboxBorderColorDisabled
     },
     checkmark: {
       opacity: '0',
@@ -100,7 +105,8 @@ export const getStyles = memoizeFunction((
       color: checkmarkFontColorCheckedDisabled,
     },
     text: {
-      marginRight: '8px',
+      color: checkboxTextColor,
+      margin: '0 4px',
       fontSize: FontSizes.medium
     },
     textHovered: {
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
index 8e8c2102d5d2d..7c06f11581c5b 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
@@ -153,15 +153,17 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
 
   @autobind
   private _onClick(ev: React.FormEvent<HTMLButtonElement>) {
-    const { onChange } = this.props;
-    let { isChecked } = this.state;
+    const { disabled, onChange } = this.props;
+    const { isChecked } = this.state;
 
-    if (onChange) {
-      onChange(ev, !isChecked);
-    }
+    if (!disabled) {
+      if (onChange) {
+        onChange(ev, !isChecked);
+      }
 
-    if (this.props.checked === undefined) {
-      this.setState({ isChecked: !isChecked });
+      if (this.props.checked === undefined) {
+        this.setState({ isChecked: !isChecked });
+      }
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
index 0bb91ed420227..48647f2167cd4 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
@@ -47,6 +47,12 @@ export class CheckboxBasicExample extends React.Component<{}, ICheckboxBasicExam
           styles={ styles }
         />
 
+        <Checkbox
+          label='Disabled uncontrolled checkbox'
+          disabled={ true }
+          styles={ styles }
+        />
+
         <Checkbox
           label='Disabled uncontrolled checkbox with defaultChecked true'
           disabled={ true }

From c55c1d1fda16b59cd45112fae583bcc6789c6fb0 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 28 Jul 2017 18:36:01 +0000
Subject: [PATCH 0326/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 .../checkbox-css_2017-07-28-17-11.json        | 11 ---------
 ...ffe-fixCalloutTarget_2017-06-22-15-45.json | 11 ---------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 24 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++++-
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/CHANGELOG.json               |  6 +++++
 packages/styling/CHANGELOG.md                 |  7 +++++-
 packages/styling/package.json                 |  2 +-
 11 files changed, 51 insertions(+), 30 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/checkbox-css_2017-07-28-17-11.json
 delete mode 100644 common/changes/office-ui-fabric-react/daweffe-fixCalloutTarget_2017-06-22-15-45.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 2ec2c2f34c720..d40d0b35fb7dc 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.24.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.25.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/checkbox-css_2017-07-28-17-11.json b/common/changes/office-ui-fabric-react/checkbox-css_2017-07-28-17-11.json
deleted file mode 100644
index 586f9a739acf4..0000000000000
--- a/common/changes/office-ui-fabric-react/checkbox-css_2017-07-28-17-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Checkbox: Adjusting the default text color to not use default button color, removing click behavior for disabled checkboxes, fixing an rtl margin issue.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/daweffe-fixCalloutTarget_2017-06-22-15-45.json b/common/changes/office-ui-fabric-react/daweffe-fixCalloutTarget_2017-06-22-15-45.json
deleted file mode 100644
index 1ba3d8eb840e6..0000000000000
--- a/common/changes/office-ui-fabric-react/daweffe-fixCalloutTarget_2017-06-22-15-45.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix Callout to get a valid element",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "daweffe@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 6be29fb714ee0..beba6361af7a3 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -48,7 +48,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.15.0 <1.0.0",
+    "@uifabric/styling": ">=0.15.1 <1.0.0",
     "@uifabric/utilities": ">=4.8.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 52c8f8a0d9eec..8042cc6f67a93 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.25.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.25.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 27151545511c4..94aedeacb9216 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.25.1",
+      "tag": "office-ui-fabric-react_v4.25.1",
+      "date": "Fri, 28 Jul 2017 18:36:00 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "d2fdce1bdb3bec646721cf9dc0ec0cbc33622235",
+            "comment": "Checkbox: Adjusting the default text color to not use default button color, removing click behavior for disabled checkboxes, fixing an rtl margin issue."
+          },
+          {
+            "author": "daweffe <daweffe@microsoft.com>",
+            "commit": "bade6f5b0153fb82952b52be304241be9dc4572b",
+            "comment": "Fix Callout to get a valid element"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.15.0 <1.0.0` to `>=0.15.1 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.25.0",
       "tag": "office-ui-fabric-react_v4.25.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 3b4b633e49162..c17414d4e4f36 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 28 Jul 2017 10:23:10 GMT and should not be manually modified.
+This log was last generated on Fri, 28 Jul 2017 18:36:00 GMT and should not be manually modified.
+
+## 4.25.1
+Fri, 28 Jul 2017 18:36:00 GMT
+
+### Patches
+
+- Checkbox: Adjusting the default text color to not use default button color, removing click behavior for disabled checkboxes, fixing an rtl margin issue.
+- Fix Callout to get a valid element
 
 ## 4.25.0
 Fri, 28 Jul 2017 10:23:10 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 5d8f7e5281a86..2b09b0e17e24c 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.25.0",
+  "version": "4.25.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.8.0 <5.0.0",
-    "@uifabric/styling": ">=0.15.0 <1.0.0",
+    "@uifabric/styling": ">=0.15.1 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index e81c31b5d8fca..5db2a937ba560 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.15.1",
+      "tag": "@uifabric/styling_v0.15.1",
+      "date": "Fri, 28 Jul 2017 18:36:00 GMT",
+      "comments": {}
+    },
     {
       "version": "0.15.0",
       "tag": "@uifabric/styling_v0.15.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index cf146def7b3f4..f3eb11aa967cd 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 28 Jul 2017 10:23:10 GMT and should not be manually modified.
+This log was last generated on Fri, 28 Jul 2017 18:36:00 GMT and should not be manually modified.
+
+## 0.15.1
+Fri, 28 Jul 2017 18:36:00 GMT
+
+*Changes not tracked*
 
 ## 0.15.0
 Fri, 28 Jul 2017 10:23:10 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 0de01488f7fb2..4a2d28315c845 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.15.0",
+  "version": "0.15.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 4b850dd2d9555fc5ab453d96c34670800cc78954 Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Fri, 28 Jul 2017 12:49:06 -0700
Subject: [PATCH 0327/1641] BasePicker: Make it able to be a controlled
 component (#2319)

* add in the ability for the basepicker to be used as a controlled component

* adding in change file{

* fixed focus problem

* added a comment

* fixed linting errors, added in a controlled picker test

* added in another test

* made the selectedItems work properly in the constructor
---
 ...-controlledcomponent_2017-07-27-21-08.json | 11 +++
 .../components/pickers/BasePicker.Props.ts    |  4 ++
 .../components/pickers/BasePicker.test.tsx    | 62 +++++++++++++++++
 .../src/components/pickers/BasePicker.tsx     | 67 +++++++++++++++----
 .../examples/PeoplePicker.Types.Example.scss  |  4 ++
 .../examples/PeoplePicker.Types.Example.tsx   | 53 ++++++++++++++-
 6 files changed, 184 insertions(+), 17 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/basepicker-controlledcomponent_2017-07-27-21-08.json

diff --git a/common/changes/office-ui-fabric-react/basepicker-controlledcomponent_2017-07-27-21-08.json b/common/changes/office-ui-fabric-react/basepicker-controlledcomponent_2017-07-27-21-08.json
new file mode 100644
index 0000000000000..a177beb73ffd4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/basepicker-controlledcomponent_2017-07-27-21-08.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "BasePicker: Add in the ability for it to be used as a controlled component with the property selectedItems",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
index 806b754e4dfa6..ec5b36904f6c2 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
@@ -86,6 +86,10 @@ export interface IBasePickerProps<T> extends React.Props<any> {
    * A callback to process a selection after the user selects something from the picker.
    */
   onItemSelected?: (selectedItem?: T) => T | PromiseLike<T>;
+  /**
+   * The items that the base picker should currently display as selected. If this is provided then the picker will act as a controlled component.
+   */
+  selectedItems?: T[];
 }
 
 export interface IBasePickerSuggestionsProps {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
index b9570b71a8d80..5803a5d9aab55 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
@@ -113,5 +113,67 @@ describe('Pickers', () => {
       ReactDOM.unmountComponentAtNode(root);
 
     });
+
+    it('can be a controlled component', () => {
+      let root = document.createElement('div');
+      document.body.appendChild(root);
+      let picker: TagPicker = ReactDOM.render(
+        <TagPicker
+          onResolveSuggestions={ onResolveSuggestions }
+          selectedItems={ [] }
+        />,
+        root
+      ) as TagPicker;
+      let input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
+
+      input.focus();
+      input.value = 'bl';
+      ReactTestUtils.Simulate.change(input);
+
+      let suggestionOptions = document.querySelectorAll('.ms-Suggestions-itemButton');
+
+      ReactTestUtils.Simulate.click(suggestionOptions[0]);
+
+      expect(picker.items.length).to.be.equal(0, 'The picker incorrectly added an item');
+
+      picker = ReactDOM.render(
+        <TagPicker
+          onResolveSuggestions={ onResolveSuggestions }
+          selectedItems={ [{ key: 'testColor', name: 'testColor' }] }
+        />,
+        root
+      ) as TagPicker;
+
+      expect(picker.items.length).to.be.equal(1, 'The picker rendered with an item.');
+      expect(picker.items[0].name).to.be.equal('testColor', 'The selected item did not have the correct text');
+      ReactDOM.unmountComponentAtNode(root);
+    });
+    it('fires change events correctly for controlled components', (done) => {
+      let root = document.createElement('div');
+      document.body.appendChild(root);
+      let picker: TagPicker = ReactDOM.render(
+        <TagPicker
+          onResolveSuggestions={ onResolveSuggestions }
+          selectedItems={ [] }
+          onChange={ (items) => {
+            expect(items.length).to.be.equal(1, 'The picker incorrectly added an item');
+            expect(items[0].name).to.be.equal('black', 'The picker incorrectly added an item');
+            done();
+          } }
+        />,
+        root
+      ) as TagPicker;
+      let input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
+
+      input.focus();
+      input.value = 'bl';
+      ReactTestUtils.Simulate.change(input);
+
+      let suggestionOptions = document.querySelectorAll('.ms-Suggestions-itemButton');
+
+      ReactTestUtils.Simulate.click(suggestionOptions[0]);
+
+      ReactDOM.unmountComponentAtNode(root);
+    });
   });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 0fbd0d4bb2970..ae4208c65555a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -47,7 +47,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   constructor(basePickerProps: P) {
     super(basePickerProps);
 
-    let items: T[] = basePickerProps.defaultSelectedItems || [];
+    let items: T[] = basePickerProps.selectedItems || basePickerProps.defaultSelectedItems || [];
 
     this.suggestionStore = new SuggestionsController<T>();
     this.selection = new Selection({ onSelectionChanged: () => this.onSelectionChange() });
@@ -75,6 +75,28 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     this.selection.setItems(this.state.items);
   }
 
+  public componentWillReceiveProps(newProps: P) {
+    let newItems = newProps.selectedItems;
+
+    if (newItems) {
+      let focusIndex: number;
+
+      // If there are less new items than old items then something was removed and we
+      // should try to keep focus consistent
+      if (newItems.length < this.state.items.length) {
+        focusIndex = this.state.items.indexOf(this.selection.getSelection()[0]);
+      }
+
+      this.setState({
+        items: newProps.selectedItems
+      }, () => {
+        if (focusIndex >= 0) {
+          this.resetFocus(focusIndex);
+        }
+      });
+    }
+  }
+
   public focus() {
     this.focusZone.focus();
   }
@@ -185,10 +207,10 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     }));
   }
 
-  protected resetFocus(index: number) {
+  protected resetFocus(index?: number) {
     let { items } = this.state;
 
-    if (items.length) {
+    if (items.length && index >= 0) {
       let newEl: HTMLElement = this.root.querySelectorAll('[data-selection-index]')[Math.min(index, items.length - 1)] as HTMLElement;
 
       if (newEl) {
@@ -305,9 +327,9 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     }
   }
 
-  protected onChange() {
+  protected onChange(items?: T[]) {
     if (this.props.onChange) {
-      this.props.onChange(this.state.items);
+      this.props.onChange(items);
     }
   }
 
@@ -420,7 +442,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
       let newItems: T[] = items;
       newItems[index] = changedItem;
 
-      this.setState({ items: newItems }, () => this.onChange());
+      this._updateSelectedItems(newItems);
     }
   }
 
@@ -471,11 +493,11 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     if (processedItemPromiseLike && processedItemPromiseLike.then) {
       processedItemPromiseLike.then((resolvedProcessedItem: T) => {
         let newItems: T[] = this.state.items.concat([resolvedProcessedItem]);
-        this.setState({ items: newItems }, () => this.onChange());
+        this._updateSelectedItems(newItems);
       });
     } else {
       let newItems: T[] = this.state.items.concat([processedItemObject]);
-      this.setState({ items: newItems }, () => this.onChange());
+      this._updateSelectedItems(newItems);
     }
   }
 
@@ -486,7 +508,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
     if (index >= 0) {
       let newItems: T[] = items.slice(0, index).concat(items.slice(index + 1));
-      this.setState({ items: newItems }, () => this.onChange());
+      this._updateSelectedItems(newItems);
     }
   }
 
@@ -494,13 +516,10 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   protected removeItems(itemsToRemove: any[]) {
     let { items } = this.state;
     let newItems: T[] = items.filter((item: any) => itemsToRemove.indexOf(item) === -1);
-    let firstItemToRemove = this.selection.getSelection()[0];
+    let firstItemToRemove = itemsToRemove[0];
     let index: number = items.indexOf(firstItemToRemove);
 
-    this.setState({ items: newItems }, () => {
-      this.resetFocus(index);
-      this.onChange();
-    });
+    this._updateSelectedItems(newItems, index);
   }
 
   // This is protected because we may expect the backspace key to work differently in a different kind of picker.
@@ -528,6 +547,26 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     return false;
   }
 
+  /**
+   * Controls what happens whenever there is an action that impacts the selected items.
+   * If selectedItems is provided as a property then this will act as a controlled component and it will not update it's own state.
+  */
+  private _updateSelectedItems(items: T[], focusIndex?: number) {
+    if (this.props.selectedItems) {
+      // If the component is a controlled component then the controlling component will need
+      this.onChange(items);
+    } else {
+      this.setState({ items: items }, () => {
+        this._onSelectedItemsUpdated(items, focusIndex);
+      });
+    }
+  }
+
+  private _onSelectedItemsUpdated(items?: T[], focusIndex?: number) {
+    this.resetFocus(focusIndex);
+    this.onChange(items);
+  }
+
   private _onValidateInput() {
     if (this.props.onValidateInput && this.props.onValidateInput(this.input.value) !== ValidationState.invalid && this.props.createGenericItem) {
       let itemToConvert = this.props.createGenericItem(this.input.value, this.props.onValidateInput(this.input.value));
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.scss b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.scss
index 7f7de9eacb6a0..5cd17e918d38c 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.scss
@@ -6,4 +6,8 @@
   .ms-PeoplePicker {
     width: 100%;
   }
+
+  .controlledPickerButton {
+    height: auto;
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index 6df5d056239f9..e8d8d245d4c79 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -19,14 +19,16 @@ import {
 } from 'office-ui-fabric-react/lib/Pickers';
 import { IPersonaWithMenu } from 'office-ui-fabric-react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.Props';
 import { people, mostRecentlyUsed } from './PeoplePickerExampleData';
-import './PeoplePicker.Types.Example.scss';
+import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Promise } from 'es6-promise';
+import './PeoplePicker.Types.Example.scss';
 
 export interface IPeoplePickerExampleState {
   currentPicker?: number | string;
   delayResults?: boolean;
   peopleList: IPersonaProps[];
   mostRecentlyUsed: IPersonaProps[];
+  currentSelectedItems?: IPersonaProps[];
 }
 
 const suggestionProps: IBasePickerSuggestionsProps = {
@@ -61,7 +63,8 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
       currentPicker: 1,
       delayResults: false,
       peopleList: peopleList,
-      mostRecentlyUsed: mostRecentlyUsed
+      mostRecentlyUsed: mostRecentlyUsed,
+      currentSelectedItems: []
     };
   }
 
@@ -86,6 +89,9 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
         break;
       case 6:
         currentPicker = this._renderProcessSelectionPicker();
+      case 7:
+        currentPicker = this._renderControlledPicker();
+        break;
       default:
     }
 
@@ -100,7 +106,8 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
               { key: 3, text: 'Members List' },
               { key: 4, text: 'Preselected Items' },
               { key: 5, text: 'Limit Search' },
-              { key: 6, text: 'Process Selection' }
+              { key: 6, text: 'Process Selection' },
+              { key: 7, text: 'Controlled Picker' }
             ] }
             selectedKey={ this.state.currentPicker }
             onChanged={ this._dropDownSelected }
@@ -208,6 +215,46 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     );
   }
 
+  public _renderControlledPicker() {
+    let controlledItems = [];
+    for (let i = 0; i < 5; i++) {
+      let item = this.state.peopleList[i];
+      if (this.state.currentSelectedItems.indexOf(item) === -1) {
+        controlledItems.push(this.state.peopleList[i]);
+      }
+    }
+    return (
+      <div>
+        <NormalPeoplePicker
+          onResolveSuggestions={ this._onFilterChanged }
+          getTextFromItem={ (persona: IPersonaProps) => persona.primaryText }
+          pickerSuggestionsProps={ suggestionProps }
+          className={ 'ms-PeoplePicker' }
+          key={ 'controlled' }
+          selectedItems={ this.state.currentSelectedItems }
+          onChange={ this.onItemsChange.bind(this) }
+        />
+        <label> Click to Add a person </label>
+        { controlledItems.map(item => <div>
+          <DefaultButton className='controlledPickerButton'
+            onClick={ () => {
+              this.setState({
+                currentSelectedItems: this.state.currentSelectedItems.concat([item])
+              });
+            } }>
+            <Persona { ...item} />
+          </DefaultButton>
+        </div>) }
+      </div>
+    );
+  }
+
+  public onItemsChange(items: any[]) {
+    this.setState({
+      currentSelectedItems: items
+    });
+  }
+
   @autobind
   private _renderFooterText(): JSX.Element {
     return <div>No additional results</div>;

From c56fe93ca63b2e3d16ad94848515e54b4e3e7ea3 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Fri, 28 Jul 2017 14:36:54 -0700
Subject: [PATCH 0328/1641] Message bar updates (#2331)

* Fix style issues that show up when component is on website

* Add change file

* Update MessageBar.scss
---
 .../message-bar-updates_2017-07-28-19-04.json        | 11 +++++++++++
 .../src/components/MessageBar/MessageBar.scss        | 12 +++++++++---
 .../src/components/MessageBar/MessageBar.tsx         |  2 +-
 3 files changed, 21 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/message-bar-updates_2017-07-28-19-04.json

diff --git a/common/changes/office-ui-fabric-react/message-bar-updates_2017-07-28-19-04.json b/common/changes/office-ui-fabric-react/message-bar-updates_2017-07-28-19-04.json
new file mode 100644
index 0000000000000..b2846605a0832
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/message-bar-updates_2017-07-28-19-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "MessageBar: Fix system problems that display when component is on website",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
index 3870b25a69063..0440a08aa19ed 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
@@ -19,6 +19,7 @@
   .icon {
     @include padding-right(8px);
     color: $ms-color-info;
+    flex-shrink: 0;
   }
 
   :global(.ms-Link) {
@@ -110,6 +111,7 @@
 // Shared
 .content {
   display: flex;
+  line-height: normal;
   width: 100%;
   box-sizing: border-box;
   &:before {
@@ -161,7 +163,7 @@
       .innerTextPadding {
         @include padding-right(8px);
         max-height: 1.3em;
-        overflow-x: hidden;
+        overflow: hidden;
         text-overflow: ellipsis;
         white-space: nowrap;
       }
@@ -183,7 +185,11 @@
   flex-shrink: 0;
 }
 
-.dismissalOneline {
+.dismissOneline {
+  display: flex;
+}
+
+.rootIsOneline {
   min-width: 16px;
   min-height: 16px;
   // We want padding between the outside of the dismiss button to be 8px
@@ -236,4 +242,4 @@
   .innerTextPadding {
     @include padding-right(48px);
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
index 652ed469becaf..72115d5e0b57d 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
@@ -140,7 +140,7 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
         css(this._getClassName(),
           'ms-MessageBar-singleline',
           styles.singleline,
-          this.props.onDismiss && 'ms-MessageBar-dismissalOneline ' + styles.dismissalOneline,
+          this.props.onDismiss && 'ms-MessageBar-dismissalOneline ' + styles.rootIsOneline,
           this.props.actions && styles.actionableOneline
         )
       } >

From e18312b24d642310972fe8840b38c3f114127010 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 28 Jul 2017 14:49:36 -0700
Subject: [PATCH 0329/1641] Adding flexShrink to the checkbox container to
 prevent it from getting squished.

---
 .../src/components/Checkbox/Checkbox.styles.ts                   | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
index acf6c68daf66f..b389a091517e9 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
@@ -58,6 +58,7 @@ export const getStyles = memoizeFunction((
     },
     checkbox: {
       display: 'flex',
+      flexShrink: '0',
       alignItems: 'center',
       justifyContent: 'center',
       height: MS_CHECKBOX_LABEL_SIZE,

From 82ba693676dcf38e7a739663ae3228bc78fc4dfb Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Fri, 28 Jul 2017 18:33:46 -0700
Subject: [PATCH 0330/1641] Searchbox: Fixed broken disabled state and aligned
 styles with current XD styles (#2328)

* Searchbox: Fixed broken disabled state and aligned styles with current XD styles

* Update SearchBox.scss

* Add change file

* Removed disabled from example

* Removed :nots
---
 ...updates-disabled-fix_2017-07-28-16-15.json | 11 +++++
 .../components/SearchBox/SearchBox.Props.ts   |  2 +-
 .../src/components/SearchBox/SearchBox.scss   | 46 ++++++++++---------
 .../src/components/SearchBox/SearchBox.tsx    |  4 +-
 4 files changed, 39 insertions(+), 24 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/search-color-updates-disabled-fix_2017-07-28-16-15.json

diff --git a/common/changes/office-ui-fabric-react/search-color-updates-disabled-fix_2017-07-28-16-15.json b/common/changes/office-ui-fabric-react/search-color-updates-disabled-fix_2017-07-28-16-15.json
new file mode 100644
index 0000000000000..9965b3b69216b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/search-color-updates-disabled-fix_2017-07-28-16-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Searchbox: Fixed broken disabled state and aligned styles with current XD styles",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts
index 8b06e793d2000..25bc80bffaa46 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts
@@ -8,7 +8,7 @@ export interface ISearchBox {
   focus(): void;
 }
 
-export interface ISearchBoxProps extends React.Props<SearchBox> {
+export interface ISearchBoxProps extends React.HTMLAttributes<HTMLInputElement> {
   /**
    * Optional callback to access the ISearchBox interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
index c4e6782dfda27..0b60f8064070f 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
@@ -17,7 +17,7 @@
   align-items: stretch;
   margin-bottom: 10px;
   @include padding(0, 0, 0, 8px);
-  border: 1px solid $ms-color-themeTertiary;
+  border: 1px solid $ms-color-neutralTertiary;
   height: 32px;
   @media screen and (-ms-high-contrast: active) {
     border: 1px solid $ms-color-white;
@@ -37,7 +37,7 @@
   width: 32px;
   text-align: center;
   transition: width $ms-animation-duration-1;
-  color: $ms-color-themePrimary;
+  color: $ms-color-themeDarkAlt;
 }
 
 .icon {
@@ -53,7 +53,7 @@
   font-weight: inherit;
   font-family: inherit;
   font-size: inherit;
-  color: $ms-color-black;
+  color: $ms-color-neutralPrimary;
   background-color: transparent;
   flex: 1 1 0px;
   overflow: hidden;
@@ -78,21 +78,12 @@
   color: $ms-color-themePrimary;
 }
 
-.root:hover {
-  border-color: $ms-color-themeDarker;
-  .label {
-    color: $ms-color-black;
-
-    .iconContainer {
-      color:$ms-color-themeDarker;
-    }
-  }
-}
-
 // State: Active searchbox
-.rootIsActive {
-  border-color: $ms-color-themeDarker;
-
+.root.rootIsActive {
+  border-color: $ms-color-themePrimary;
+  &:hover {
+    border-color: $ms-color-themePrimary;
+  }
   .iconContainer {
     width: 4px;
     transition: width $ms-animation-duration-1;
@@ -106,18 +97,29 @@
  // State: Disabled searchbox
 .rootIsDisabled {
   border-color: $ms-color-neutralLighter;
-
+  background-color: $ms-color-neutralLighter;
+  pointer-events: none;
+  cursor: default;
   .iconContainer {
     color: $ms-color-neutralTertiaryAlt;
   }
-
   .field {
-    background-color: $ms-color-neutralLighter;
-    pointer-events: none;
-    cursor: default;
+    color: $ms-color-neutralTertiaryAlt;
   }
 }
 
 .rootCanClear .clearButton {
   display: flex;
 }
+
+
+.root:hover {
+  border-color: $ms-color-neutralDark;
+  .label {
+    color: $ms-color-black;
+
+    .iconContainer {
+      color:$ms-color-themeDark;
+    }
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
index 09411429afda1..5b80f519a1145 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
@@ -47,13 +47,14 @@ export class SearchBox extends BaseComponent<ISearchBoxProps, ISearchBoxState> {
   }
 
   public render() {
-    let { labelText, className } = this.props;
+    let { labelText, className, disabled } = this.props;
     let { value, hasFocus, id } = this.state;
     return (
       <div
         ref={ this._resolveRef('_rootElement') }
         className={ css('ms-SearchBox', className, styles.root, {
           ['is-active ' + styles.rootIsActive]: hasFocus,
+          ['is-disabled ' + styles.rootIsDisabled]: disabled,
           ['can-clear ' + styles.rootCanClear]: value.length > 0,
         }) }
         { ...{ onFocusCapture: this._onFocusCapture } }
@@ -71,6 +72,7 @@ export class SearchBox extends BaseComponent<ISearchBoxProps, ISearchBoxState> {
           onInput={ this._onInputChange }
           onKeyDown={ this._onKeyDown }
           value={ value }
+          disabled={ this.props.disabled }
           aria-label={ this.props.ariaLabel ? this.props.ariaLabel : this.props.labelText }
           ref={ this._resolveRef('_inputElement') }
         />

From 6f68ed0837ea38b6373bb6ced8f8034445a9d87c Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 31 Jul 2017 10:12:08 +0000
Subject: [PATCH 0331/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...-controlledcomponent_2017-07-27-21-08.json | 11 -------
 .../message-bar-updates_2017-07-28-19-04.json | 11 -------
 ...updates-disabled-fix_2017-07-28-16-15.json | 11 -------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 31 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 14 ++++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/CHANGELOG.json               |  6 ++++
 packages/styling/CHANGELOG.md                 |  7 ++++-
 packages/styling/package.json                 |  2 +-
 15 files changed, 65 insertions(+), 44 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/basepicker-controlledcomponent_2017-07-27-21-08.json
 delete mode 100644 common/changes/office-ui-fabric-react/message-bar-updates_2017-07-28-19-04.json
 delete mode 100644 common/changes/office-ui-fabric-react/search-color-updates-disabled-fix_2017-07-28-16-15.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index d40d0b35fb7dc..6cff503a4ade6 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.25.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.26.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index b46571796a2c0..f4abafa327ced 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.25.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.26.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 5bd44a2f89f3e..3c79bc50576b4 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -35,7 +35,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.25.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.26.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 40a42442292ff..3673cd7de7772 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.25.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.26.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/office-ui-fabric-react/basepicker-controlledcomponent_2017-07-27-21-08.json b/common/changes/office-ui-fabric-react/basepicker-controlledcomponent_2017-07-27-21-08.json
deleted file mode 100644
index a177beb73ffd4..0000000000000
--- a/common/changes/office-ui-fabric-react/basepicker-controlledcomponent_2017-07-27-21-08.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "BasePicker: Add in the ability for it to be used as a controlled component with the property selectedItems",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/message-bar-updates_2017-07-28-19-04.json b/common/changes/office-ui-fabric-react/message-bar-updates_2017-07-28-19-04.json
deleted file mode 100644
index b2846605a0832..0000000000000
--- a/common/changes/office-ui-fabric-react/message-bar-updates_2017-07-28-19-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "MessageBar: Fix system problems that display when component is on website",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/search-color-updates-disabled-fix_2017-07-28-16-15.json b/common/changes/office-ui-fabric-react/search-color-updates-disabled-fix_2017-07-28-16-15.json
deleted file mode 100644
index 9965b3b69216b..0000000000000
--- a/common/changes/office-ui-fabric-react/search-color-updates-disabled-fix_2017-07-28-16-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Searchbox: Fixed broken disabled state and aligned styles with current XD styles",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index beba6361af7a3..dd90b553ab616 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -48,7 +48,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.15.1 <1.0.0",
+    "@uifabric/styling": ">=0.15.2 <1.0.0",
     "@uifabric/utilities": ">=4.8.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 8042cc6f67a93..b1fa599a66440 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.25.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.26.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 94aedeacb9216..e4d56773686bf 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,37 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.26.0",
+      "tag": "office-ui-fabric-react_v4.26.0",
+      "date": "Mon, 31 Jul 2017 10:12:08 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "4b850dd2d9555fc5ab453d96c34670800cc78954",
+            "comment": "BasePicker: Add in the ability for it to be used as a controlled component with the property selectedItems"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "c56fe93ca63b2e3d16ad94848515e54b4e3e7ea3",
+            "comment": "MessageBar: Fix system problems that display when component is on website"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "82ba693676dcf38e7a739663ae3228bc78fc4dfb",
+            "comment": "Searchbox: Fixed broken disabled state and aligned styles with current XD styles"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.15.1 <1.0.0` to `>=0.15.2 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.25.1",
       "tag": "office-ui-fabric-react_v4.25.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index c17414d4e4f36..0ca1f42f56482 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,18 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 28 Jul 2017 18:36:00 GMT and should not be manually modified.
+This log was last generated on Mon, 31 Jul 2017 10:12:08 GMT and should not be manually modified.
+
+## 4.26.0
+Mon, 31 Jul 2017 10:12:08 GMT
+
+### Minor changes
+
+- BasePicker: Add in the ability for it to be used as a controlled component with the property selectedItems
+
+### Patches
+
+- MessageBar: Fix system problems that display when component is on website
+- Searchbox: Fixed broken disabled state and aligned styles with current XD styles
 
 ## 4.25.1
 Fri, 28 Jul 2017 18:36:00 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 2b09b0e17e24c..efa0b4a82dbd7 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.25.1",
+  "version": "4.26.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.8.0 <5.0.0",
-    "@uifabric/styling": ">=0.15.1 <1.0.0",
+    "@uifabric/styling": ">=0.15.2 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 5db2a937ba560..cf7c6d172c58c 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.15.2",
+      "tag": "@uifabric/styling_v0.15.2",
+      "date": "Mon, 31 Jul 2017 10:12:08 GMT",
+      "comments": {}
+    },
     {
       "version": "0.15.1",
       "tag": "@uifabric/styling_v0.15.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index f3eb11aa967cd..493eb9862b687 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 28 Jul 2017 18:36:00 GMT and should not be manually modified.
+This log was last generated on Mon, 31 Jul 2017 10:12:08 GMT and should not be manually modified.
+
+## 0.15.2
+Mon, 31 Jul 2017 10:12:08 GMT
+
+*Changes not tracked*
 
 ## 0.15.1
 Fri, 28 Jul 2017 18:36:00 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 4a2d28315c845..59ea4e702f61a 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.15.1",
+  "version": "0.15.2",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From b08a5992ed06484684091b393002a6aab228908c Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Mon, 31 Jul 2017 08:23:22 -0700
Subject: [PATCH 0332/1641] Overflow set updates (#2330)

* Some upstream changes to overflow set

* Change log

* Linting fix
---
 .../overflowSet-updates_2017-07-28-17-25.json | 11 +++++++
 .../OverflowSet/OverflowSet.Props.ts          | 31 ++++++++++++++++---
 .../components/OverflowSet/OverflowSet.scss   |  1 +
 .../components/OverflowSet/OverflowSet.tsx    | 16 ++++++++--
 4 files changed, 51 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/overflowSet-updates_2017-07-28-17-25.json

diff --git a/common/changes/office-ui-fabric-react/overflowSet-updates_2017-07-28-17-25.json b/common/changes/office-ui-fabric-react/overflowSet-updates_2017-07-28-17-25.json
new file mode 100644
index 0000000000000..b823562d8caff
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/overflowSet-updates_2017-07-28-17-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "OverflowSet: Add focus method, class name and abstract item interface",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.Props.ts b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.Props.ts
index d039efdfb5234..c6ca812032bba 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.Props.ts
@@ -1,9 +1,13 @@
 import * as React from 'react';
 import { OverflowSet } from './OverflowSet';
 import { IRenderFunction } from '../../Utilities';
-import { IObjectWithKey } from '../../Selection';
 
-export interface IOverflowSet { }
+export interface IOverflowSet {
+  /**
+ * Sets focus to the button.
+ */
+  focus: () => void;
+}
 
 export interface IOverflowSetProps extends React.Props<OverflowSet> {
   /**
@@ -11,20 +15,25 @@ export interface IOverflowSetProps extends React.Props<OverflowSet> {
    */
   componentRef?: (ref?: IOverflowSet) => void;
 
+  /**
+   * Class name
+   */
+  className?: string;
+
   /**
    * An array of items to be rendered by your onRenderItem function in the primary content area
   */
-  items?: any[] | IObjectWithKey[];
+  items?: IOverflowSetItemProps[];
 
   /**
    * An array of items to be passed to overflow contextual menu
   */
-  overflowItems?: any[];
+  overflowItems?: IOverflowSetItemProps[];
 
   /**
    * Method to call when trying to render an item.
   */
-  onRenderItem: IRenderFunction<any>;
+  onRenderItem: (item: IOverflowSetItemProps) => any;
 
   /**
    * Rendering method for overflow button and contextual menu. The argument to the function is
@@ -32,3 +41,15 @@ export interface IOverflowSetProps extends React.Props<OverflowSet> {
   */
   onRenderOverflowButton: IRenderFunction<any[]>;
 }
+
+export interface IOverflowSetItemProps {
+  /**
+   * Unique id to identify the item
+   */
+  key: string;
+
+  /**
+   * Any additional properties to use when custom rendering menu items.
+   */
+  [propertyName: string]: any;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.scss b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.scss
index d46438c8214b4..43aa0b1a386bc 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.scss
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.scss
@@ -8,4 +8,5 @@
 
 .item {
   flex-shrink: 0;
+  display: inherit;
 }
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
index cc1080d897741..293cddc8aa28a 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
@@ -12,21 +12,30 @@ const styles: any = stylesImport;
 
 export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> implements IOverflowSet {
 
+  public refs: {
+    focusZone: FocusZone;
+  };
+
   public render() {
     let {
       items,
       overflowItems,
-      onRenderOverflowButton
+      onRenderOverflowButton,
+      className
     } = this.props;
 
     return (
-      <FocusZone className={ css('ms-OverflowSet', styles.root) } direction={ FocusZoneDirection.horizontal } role='menubar' >
+      <FocusZone ref='focusZone' className={ css('ms-OverflowSet', styles.root, className) } direction={ FocusZoneDirection.horizontal } role='menubar' >
         { items && this._onRenderItems(items) }
         { overflowItems && overflowItems.length > 0 && onRenderOverflowButton(overflowItems) }
       </FocusZone>
     );
   }
 
+  public focus() {
+    this.refs.focusZone.focus();
+  }
+
   @autobind
   private _onRenderItems(items: any[]): JSX.Element[] {
     return items.map((item, i) => {
@@ -41,4 +50,5 @@ export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> implements
       );
     });
   }
-}
+
+}
\ No newline at end of file

From ea03c892b388f359812282a0e99f4b9adeb07f4b Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Mon, 31 Jul 2017 11:44:10 -0700
Subject: [PATCH 0333/1641] Panel: added prop to force footer to bottom of the
 page (#2198)

* Panel: added prop to force footer to bottom of the page

* Change file

* Update Panel.tsx

little code cleanup

* Update Panel.tsx
---
 ...bottom-sticky-footer_2017-07-12-21-36.json | 11 ++++
 .../src/components/Panel/Panel.Props.ts       |  6 ++
 .../src/components/Panel/Panel.scss           |  4 ++
 .../src/components/Panel/Panel.tsx            |  8 ++-
 .../src/components/Panel/PanelPage.tsx        |  7 ++-
 .../Panel/examples/Panel.Footer.Example.tsx   | 57 +++++++++++++++++++
 6 files changed, 91 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/panel-bottom-sticky-footer_2017-07-12-21-36.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Footer.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/panel-bottom-sticky-footer_2017-07-12-21-36.json b/common/changes/office-ui-fabric-react/panel-bottom-sticky-footer_2017-07-12-21-36.json
new file mode 100644
index 0000000000000..852fa5eea1364
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/panel-bottom-sticky-footer_2017-07-12-21-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Panel: added prop to force footer to bottom of the page",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.Props.ts b/packages/office-ui-fabric-react/src/components/Panel/Panel.Props.ts
index 70c474f9a245e..f14e31ee5d4dd 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.Props.ts
@@ -45,6 +45,12 @@ export interface IPanelProps extends React.Props<Panel> {
   */
   isBlocking?: boolean;
 
+  /**
+   * Determines if content should stretch to fill available space putting footer at the bottom of the page
+   * @default false
+   */
+  isFooterAtBottom?: boolean;
+
   /**
   * Header text for the Panel.
   * @default ""
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.scss b/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
index 9a1b47deb9dbe..64b0e8ddc444b 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
@@ -253,6 +253,10 @@ $CommandBarHeight: 44px;
   overflow-y: auto;
 }
 
+.contentGrow {
+  flex-grow: 1;
+}
+
 .footer {
   // Ensure that footer doesn't shrink if screen is too small
   flex-grow: 0;
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
index b6cc4176d536e..dd32961f621bb 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
@@ -240,8 +240,14 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
 
   @autobind
   private _onRenderBody(props: IPanelProps): JSX.Element {
+    const contentClass = css( 
+      'ms-Panel-content', 
+      styles.content, 
+      props.isFooterAtBottom && styles.contentGrow 
+    );
+    
     return (
-      <div className={ css('ms-Panel-content', styles.content) } ref={ this._resolveRef('_content') }>
+      <div ref={ this._resolveRef('_content') } className={ contentClass } >
         { props.children }
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx b/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
index 7c75e4020d70b..ecc8ab8d09bde 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
@@ -15,6 +15,7 @@ import { PanelExtraLargeExample } from './examples/Panel.ExtraLarge.Example';
 import { PanelCustomExample } from './examples/Panel.Custom.Example';
 import { PanelLightDismissExample } from './examples/Panel.LightDismiss.Example';
 import { PanelNonModalExample } from './examples/Panel.NonModal.Example';
+import { PanelFooterExample } from './examples/Panel.Footer.Example';
 import { FontClassNames } from '../../Styling';
 
 const PanelSmallRightExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Panel/examples/Panel.SmallRight.Example.tsx') as string;
@@ -27,6 +28,7 @@ const PanelExtraLargeExampleCode = require('!raw-loader!office-ui-fabric-react/s
 const PanelCustomExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Panel/examples/Panel.Custom.Example.tsx') as string;
 const PanelLightDismissExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismiss.Example.tsx') as string;
 const PanelNonModalExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Panel/examples/Panel.NonModal.Example.tsx') as string;
+const PanelFooterExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Panel/examples/Panel.Footer.Example.tsx') as string;
 
 export class PanelPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
@@ -62,10 +64,13 @@ export class PanelPage extends React.Component<IComponentDemoPageProps, {}> {
             </ExampleCard>
             <ExampleCard title='Panel - Light Dismiss' code={ PanelLightDismissExampleCode }>
               <PanelLightDismissExample />
-            </ExampleCard>,
+            </ExampleCard>
             <ExampleCard title='Panel - Non-Modal' code={ PanelNonModalExampleCode }>
               <PanelNonModalExample />
             </ExampleCard>
+            <ExampleCard title='Panel - Footer' code={ PanelFooterExampleCode }>
+              <PanelFooterExample />
+            </ExampleCard>
           </div>
         }
         propertiesTables={
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Footer.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Footer.Example.tsx
new file mode 100644
index 0000000000000..1336754455219
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Footer.Example.tsx
@@ -0,0 +1,57 @@
+import * as React from 'react';
+import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
+import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
+
+export class PanelFooterExample extends React.Component<any, any> {
+
+  constructor() {
+    super();
+    this.state = { showPanel: false };
+  }
+
+  public render() {
+    return (
+      <div>
+        <DefaultButton
+          description='Opens the Sample Panel'
+          onClick={ this._onShowPanel }
+          text='Open Panel'
+        />
+        <Panel
+          isOpen={ this.state.showPanel }
+          type={ PanelType.smallFixedFar }
+          onDismiss={ this._onClosePanel }
+          isFooterAtBottom={ true }
+          headerText='Panel with footer at bottom'
+          closeButtonAriaLabel='Close'
+          onRenderFooterContent={ () => {
+            return (
+              <div>
+                <PrimaryButton
+                  onClick={ this._onClosePanel }
+                  style={ { 'marginRight': '8px' } } >
+                  Save
+                </PrimaryButton>
+                <DefaultButton
+                  onClick={ this._onClosePanel }
+                >
+                  Cancel
+                </DefaultButton>
+              </div>
+            );
+          } }
+        >
+          <span>Content goes here.</span>
+        </Panel>
+      </div>
+    );
+  }
+
+  private _onClosePanel = () => {
+    this.setState({ showPanel: false });
+  }
+
+  private _onShowPanel = () => {
+    this.setState({ showPanel: true });
+  }
+}

From 75b8690920938e69cdefd2d92363ccd3c6eabdef Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Mon, 31 Jul 2017 12:24:41 -0700
Subject: [PATCH 0334/1641] Jspurlin/swatch color picker simplify
 implementation (#2321)

* SwatchColorPicker: Simplify implementation, removing the menu button and header/divider aspect of the component

* Update CSS

* Fix an unneeded functionality

* Add change file

* Fixing a typo in a comment

* Address PR feedback
---
 ...mplifyImplementation_2017-07-27-23-22.json |  11 +
 .../SwatchColorPicker.Props.ts                |  68 +-
 .../SwatchColorPicker/SwatchColorPicker.scss  |  46 +-
 .../SwatchColorPicker.test.tsx                | 310 +-------
 .../SwatchColorPicker/SwatchColorPicker.tsx   | 708 ++++--------------
 .../SwatchColorPicker.Basic.Example.tsx       | 171 +----
 6 files changed, 244 insertions(+), 1070 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-SwatchColorPicker-SimplifyImplementation_2017-07-27-23-22.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPicker-SimplifyImplementation_2017-07-27-23-22.json b/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPicker-SimplifyImplementation_2017-07-27-23-22.json
new file mode 100644
index 0000000000000..df5217d85c24e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPicker-SimplifyImplementation_2017-07-27-23-22.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SwatchColorPicker: Simplify component to remove the menu button and header/divider aspects that were built in to the component. Now the SwatchColorPicker only renders the grid portion and is more streamlined",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts
index 52ec51088b3a9..a3109d3e65db0 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts
@@ -1,5 +1,3 @@
-import { IButtonProps } from '../../Button';
-
 export interface ISwatchColorPicker { }
 
 export interface ISwatchColorPickerProps {
@@ -18,6 +16,11 @@ export interface ISwatchColorPickerProps {
    */
   id?: string;
 
+  /**
+   * Additional class name to provide on the root element
+   */
+  className?: string;
+
   /**
    * The shape of the color cells, defaults to circle
    */
@@ -29,21 +32,9 @@ export interface ISwatchColorPickerProps {
   selectedId?: string;
 
   /**
-   * IButtonProps for the swatch color picker. If given the swatch color picker
-   * will render inside of a menu
+   * The color cells that will be made available to the user
    */
-  menuButtonProps?: IButtonProps;
-
-  /**
-   * Should the icon color be updated to align
-   * with the selected color? Default is false
-   */
-  setSelectedColorForIcon?: boolean;
-
-  /**
-   * The color options that will be made available to the user
-   */
-  swatchColorPickerItems: ISwatchColorPickerItemProps[];
+  colorCells: IColorCellProps[];
 
   /**
    * Callback issued when the user changes the color.
@@ -52,11 +43,6 @@ export interface ISwatchColorPickerProps {
    */
   onColorChanged?: (id?: string, color?: string) => void;
 
-  /**
- * Callback issued when the user click a menu item
- */
-  onMenuItemClick?: (item: ISwatchColorPickerItemProps) => void;
-
   /**
    * Callback issued when the user hovers over a color cell.
    * Note, if no id or color is given, cells are not longer being hovered
@@ -73,9 +59,24 @@ export interface ISwatchColorPickerProps {
    * Is this swatch color picker disabled?
    */
   disabled?: boolean;
+
+  /**
+   * The optional position this grid is in the parent set (index in a parent menu, for example)
+   */
+  positionInSet?: number;
+
+  /**
+   * The optional size of the parent set (size of parent menu, for example)
+   */
+  setSize?: number;
+
+  /**
+   * Should focus cycle to the beginning of once the user navigates past the end (and visa vsersa). Defaults to true
+   */
+  shouldFocusCircularNavigate?: boolean;
 }
 
-export interface ISwatchColorPickerItemProps {
+export interface IColorCellProps {
 
   /**
    * Arbitrary unique string associated with this option
@@ -89,11 +90,6 @@ export interface ISwatchColorPickerItemProps {
    */
   label?: string;
 
-  /**
-   * The type of item this is
-   */
-  type: SwatchColorPickerItemType;
-
   /**
    * The CSS-compatible string to describe the color
    */
@@ -103,22 +99,4 @@ export interface ISwatchColorPickerItemProps {
    * Index for this option
    */
   index?: number;
-
-  /**
-   * The menu item button props. This value is only used if
-   * the type is MenuItem
-   */
-  menuItemButtonProps?: IButtonProps;
-
-  /**
-   * Is this individual item disabled?
-   */
-  disabled?: boolean;
-}
-
-export enum SwatchColorPickerItemType {
-  Cell = 0,
-  MenuItem = 1,
-  Divider = 2,
-  Header = 3
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
index 4ac8360a315d2..1e58d7053931d 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
@@ -18,10 +18,6 @@
   }
 }
 
-.wrapper {
-  display: inline-block;
-}
-
 .item {
   @include ms-font-m;
   @include focus-border();
@@ -66,6 +62,7 @@
       box-shadow: 0 0 0 1px #969696;
     }
 
+    &:focus .svg,
     & .svg {
       &.circle {
         border-radius: 100%;
@@ -84,11 +81,19 @@
   &:hover .svg,
   &:focus .svg,
   &:active .svg {
-    border: 4px solid $ms-color-neutralTertiaryAlt;
     width: 12px;
     height: 12px;
   }
 
+  &:hover .svg,
+  &:focus .svg {
+      border: 4px solid $ms-color-neutralQuaternaryAlt;
+   }
+
+  &:active .svg {
+  border: 4px solid $ms-color-neutralTertiaryAlt;
+  }
+
   &:hover .svg.circle,
   &:focus .svg.circle,
   &:active .svg.circle {
@@ -116,37 +121,8 @@
 
 .swatchColorPickerContainer {
   clear: both;
-  display: inline-block;
-  min-width: 180px;
-}
-
-.icon {
-  width: 16px;
-}
-
-.menuItem {
-  margin: 0px 4px;
-}
-
-.header {
-  color: $menuHeaderColor;
-  font-weight: $ms-font-weight-semibold;
-  white-space: nowrap;
-  background: none;
-  border: none;
-  height: 36px;
-  line-height: 36px;
-  cursor: default;
-  padding: 0px 16px;
-  user-select: none;
-  @include text-align(left);
-}
-
-.divider {
   display: block;
-  height: 1px;
-  background-color: $menuDividerColor;
-  position: relative;
+  min-width: 180px;
 }
 
 
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
index 40b43fb3af08d..92dd14a9d2022 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
@@ -4,35 +4,24 @@ import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
 import * as ReactTestUtils from 'react-addons-test-utils';
 import { mount } from 'enzyme';
-import { KeyCodes } from '../../Utilities';
 import { SwatchColorPicker } from './SwatchColorPicker';
-import { ISwatchColorPickerItemProps, SwatchColorPickerItemType } from './SwatchColorPicker.Props';
+import { IColorCellProps } from './SwatchColorPicker.Props';
 
 let { expect } = chai;
 
-const DEFAULT_OPTIONS: ISwatchColorPickerItemProps[] = [
-  { id: '0', label: 'Colors', type: SwatchColorPickerItemType.Header },
-  { id: 'd1', type: SwatchColorPickerItemType.Divider },
-  { id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00' },
-  { id: 'b', label: 'orange', type: SwatchColorPickerItemType.Cell, color: '#ffa500' },
-  { id: 'c', label: 'blue', type: SwatchColorPickerItemType.Cell, color: '#0000ff' },
-  { id: 'd', label: 'red', type: SwatchColorPickerItemType.Cell, color: '#ff0000' },
-  { id: 'e', type: SwatchColorPickerItemType.Divider },
-  { id: 'f', label: 'More Colors', type: SwatchColorPickerItemType.Header },
-  { id: 'd2', type: SwatchColorPickerItemType.Divider },
-  { id: 'g', label: 'green', type: SwatchColorPickerItemType.Cell, color: 'green' },
-  { id: 'h', label: 'orange', type: SwatchColorPickerItemType.Cell, color: 'orange' },
-  { id: 'i', label: 'blue', type: SwatchColorPickerItemType.Cell, color: 'blue' },
-  { id: 'j', label: 'red', type: SwatchColorPickerItemType.Cell, color: 'red' },
-  { id: 'k', label: 'black', type: SwatchColorPickerItemType.Cell, color: 'black' },
-  { id: 'l', label: 'grey', type: SwatchColorPickerItemType.Cell, color: 'grey' },
-  { id: 'm', label: 'purple', type: SwatchColorPickerItemType.Cell, color: 'purple' },
-  { id: 'n', label: 'yellow', type: SwatchColorPickerItemType.Cell, color: 'yellow' },
-  { id: 'o', type: SwatchColorPickerItemType.Divider },
-  { id: 'p', label: 'Find Colors', type: SwatchColorPickerItemType.MenuItem },
-  { id: 'q', label: 'Find More Colors', type: SwatchColorPickerItemType.MenuItem, menuItemButtonProps: { iconProps: { iconName: 'glasses' } } },
-  { id: 'r', label: '...More Colors...', type: SwatchColorPickerItemType.MenuItem },
-  { id: 's', label: 'Find Even More Colors', type: SwatchColorPickerItemType.MenuItem, menuItemButtonProps: { iconProps: { iconName: 'redEye' } } }
+const DEFAULT_OPTIONS: IColorCellProps[] = [
+  { id: 'a', label: 'green', color: '#00ff00' },
+  { id: 'b', label: 'orange', color: '#ffa500' },
+  { id: 'c', label: 'blue', color: '#0000ff' },
+  { id: 'd', label: 'red', color: '#ff0000' },
+  { id: 'g', label: 'green', color: 'green' },
+  { id: 'h', label: 'orange', color: 'orange' },
+  { id: 'i', label: 'blue', color: 'blue' },
+  { id: 'j', label: 'red', color: 'red' },
+  { id: 'k', label: 'black', color: 'black' },
+  { id: 'l', label: 'grey', color: 'grey' },
+  { id: 'm', label: 'purple', color: 'purple' },
+  { id: 'n', label: 'yellow', color: 'yellow' }
 ];
 
 describe('SwatchColorPicker', () => {
@@ -40,110 +29,18 @@ describe('SwatchColorPicker', () => {
   it('Can render in full without being parented to a button', () => {
     const wrapper = mount(
       <SwatchColorPicker
-        swatchColorPickerItems={ DEFAULT_OPTIONS }
+        colorCells={ DEFAULT_OPTIONS }
         columnCount={ 4 }
       />);
-    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
-    let menu = wrapper.getDOMNode().ownerDocument.querySelector('.ms-swatchColorPickerMenu');
-
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton').length).to.equal(0, 'should not have a button');
-    expect(menu).equal(null, 'should not have a menu ');
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerBodyContainer').length).to.equal(1, 'should have a swatch color picker body');
-  });
-
-  it('Can render collapsed behind a button', () => {
-    const wrapper = mount(
-      <SwatchColorPicker
-        menuButtonProps={ { iconProps: { iconName: 'fontColor' }, title: 'Font Color' } }
-        swatchColorPickerItems={ DEFAULT_OPTIONS }
-        columnCount={ 4 }
-      />);
-    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
-
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton').length).to.equal(1, 'should have a button');
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(0, 'not be expanded');
-  });
-
-  it('Can render collapsed behind a button and expand', () => {
-    const wrapper = mount(
-      <SwatchColorPicker
-        menuButtonProps={ { iconProps: { iconName: 'fontColor' }, title: 'Font Color' } }
-        swatchColorPickerItems={ DEFAULT_OPTIONS }
-        columnCount={ 4 }
-      />);
-    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
-
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton').length).to.equal(1, 'should have a button');
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(0, 'should not be expanded');
-
-    swatchColorPickerRoot.find('.ms-swatchColorPickerButton').simulate('click');
-
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton').length).to.equal(1, 'should have a button');
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(1, 'should be expanded');
-
-    let menu = wrapper.getDOMNode().ownerDocument.querySelector('.ms-swatchColorPickerMenu');
-
-    expect(menu).to.not.equal(null, 'should have a menu');
-    expect(menu!.querySelectorAll('.ms-swatchColorPickerBodyContainer').length).to.equal(1, 'should have a swatch color picker body inside of the menu');
-  });
-
-  it('Can render the correct options when in a menu', () => {
-    const wrapper = mount(
-      <SwatchColorPicker
-        menuButtonProps={ { iconProps: { iconName: 'fontColor' }, title: 'Font Color' } }
-        swatchColorPickerItems={ DEFAULT_OPTIONS }
-        columnCount={ 4 }
-      />);
-    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
-
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton').length).to.equal(1, 'should have a button');
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(0, 'should not be expanded');
-
-    let button = swatchColorPickerRoot.find('.ms-swatchColorPickerButton');
-
-    expect(button).to.not.equal(null, 'should have a button');
-    button.simulate('click');
-
-    let menu = wrapper.getDOMNode().ownerDocument.querySelector('.ms-swatchColorPickerMenu') as Element;
-    expect(menu).to.not.equal(null, 'should have a menu');
-
-    let tableElements = menu.querySelectorAll('table[role="grid"]');
-    let tableRowElements = menu.querySelectorAll('tr[role="row"]');
-    let tableCellElements = menu.querySelectorAll('button[role="gridcell"]');
-    let headingElements = menu.querySelectorAll('[role="heading"]');
-    let dividerElements = menu.querySelectorAll('[role="separator"]');
-    let menuitems = menu.querySelectorAll('button[role="menuitem"]');
-    let buttons = menu.querySelectorAll('button[role="button"]');
-    let setSizeElements = menu.querySelectorAll('[aria-setsize]');
-
-    expect(menu.querySelectorAll('[role="menu"]').length).to.equal(1, 'should be one menu in the swatch color picker');
-    expect(tableElements.length).to.equal(2, 'should be two grids in the swatch color picker');
-    expect(tableElements[0].getAttribute('aria-posinset')).to.equal('1', 'first grid should have aria-posinset of 1');
-    expect(tableElements[1].getAttribute('aria-posinset')).to.equal('2', 'first grid should have aria-posinset of 2');
-    expect(tableRowElements.length).to.equal(3, 'should be three rows in the swatch color picker');
-    expect(tableRowElements[0].getElementsByTagName('td').length).to.equal(4, 'the first row should have four td elements');
-    expect(tableRowElements[1].getElementsByTagName('td').length).to.equal(4, 'the second row should have four td elements');
-    expect(tableRowElements[2].getElementsByTagName('td').length).to.equal(4, 'the third row should have four td elements');
-    expect(tableCellElements.length).to.equal(12, 'should be twelve grid cells in the swatch color picker');
-    expect(headingElements.length).to.equal(2, 'should be two headers in the swatch color picker');
-    expect(dividerElements.length).to.equal(4, 'should be four dividers in the swatch color picker');
-    expect(menuitems.length).to.equal(4, 'should be four menu items in the swatch color picker');
-    expect(menuitems[0].getAttribute('aria-posinset')).to.equal('3', 'first grid should have aria-posinset of 3');
-    expect(menuitems[1].getAttribute('aria-posinset')).to.equal('4', 'first grid should have aria-posinset of 4');
-    expect(menuitems[2].getAttribute('aria-posinset')).to.equal('5', 'first grid should have aria-posinset of 5');
-    expect(menuitems[3].getAttribute('aria-posinset')).to.equal('6', 'first grid should have aria-posinset of 6');
-    expect(setSizeElements.length).to.equal(6, 'should be six elements with aria-setsize in the swatch color picker');
-    expect(buttons.length).to.equal(0, 'should be zero role="button" elements in the swatch color picker');
-    expect(setSizeElements[0].getAttribute('aria-setsize')).to.equal('6', 'set size shoud be equal to six in the swatch color picker');
+    expect(wrapper.find('.ms-swatchColorPickerBodyContainer').length).to.equal(1, 'should have a swatch color picker');
   });
 
   it('Can render the correct options when not in a menu', () => {
     const wrapper = mount(
       <SwatchColorPicker
-        swatchColorPickerItems={ DEFAULT_OPTIONS }
+        colorCells={ DEFAULT_OPTIONS }
         columnCount={ 4 }
       />);
-    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
     let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
     let container = reactContainer.getDOMNode();
     expect(container).to.not.equal(null, 'should have a container');
@@ -158,146 +55,24 @@ describe('SwatchColorPicker', () => {
     let setSizeElements = container.querySelectorAll('[aria-setsize]');
     let posInSetElements = container.querySelectorAll('[aria-posinset]');
 
-    expect(container.querySelectorAll('[role="menu"]').length).to.equal(0, 'should be zero menus in the swatch color picker');
-    expect(tableElements.length).to.equal(2, 'should be two grids in the swatch color picker');
+    expect(tableElements.length).to.equal(1, 'should be two grids in the swatch color picker');
     expect(tableRowElements.length).to.equal(3, 'should be three rows in the swatch color picker');
     expect(tableRowElements[0].getElementsByTagName('td').length).to.equal(4, 'the first row should have four td elements');
     expect(tableRowElements[1].getElementsByTagName('td').length).to.equal(4, 'the second row should have four td elements');
     expect(tableRowElements[2].getElementsByTagName('td').length).to.equal(4, 'the third row should have four td elements');
     expect(tableCellElements.length).to.equal(12, 'should be twelve grid cells in the swatch color picker');
-    expect(headingElements.length).to.equal(2, 'should be two headers in the swatch color picker');
-    expect(dividerElements.length).to.equal(4, 'should be four dividers in the swatch color picker');
-    expect(menuitems.length).to.equal(0, 'should be zero menu items in the swatch color picker');
-    expect(buttons.length).to.equal(4, 'should be four buttons in the swatch color picker');
     expect(setSizeElements.length).to.equal(0, 'should be zero elements with aria-setsize since we are not in a menu in the swatch color picker');
     expect(posInSetElements.length).to.equal(0, 'should be zero elements with aria-posinset since we are not in a menu in the swatch color picker');
   });
 
-  it('Cannot expand a disabled collapsed swatch color picker', () => {
-    const wrapper = mount(
-      <SwatchColorPicker
-        menuButtonProps={ { iconProps: { iconName: 'fontColor' }, title: 'Font Color' } }
-        swatchColorPickerItems={ DEFAULT_OPTIONS }
-        columnCount={ 4 }
-        disabled={ true }
-      />);
-    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
-
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton').length).to.equal(1, 'should have a button');
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(0, 'should not be expanded');
-
-    swatchColorPickerRoot.find('.ms-swatchColorPickerButton').simulate('click');
-
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(0, 'should be expanded');
-
-    swatchColorPickerRoot.find('.ms-swatchColorPickerButton').simulate('keydown', { which: KeyCodes.enter });
-
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(0, 'should be expanded');
-  });
-
-  it('Cannot execute a disabled cell in an expanded swatch color picker', () => {
-    let eventFireCounter = 0;
-    const wrapper = mount(
-      <SwatchColorPicker
-        menuButtonProps={ { iconProps: { iconName: 'fontColor' }, title: 'Font Color' } }
-        swatchColorPickerItems={ [{ id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00', disabled: true }] }
-        onColorChanged={ (color) => eventFireCounter++ }
-        columnCount={ 4 }
-      />);
-    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
-
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton').length).to.equal(1, 'should have a button');
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(0, 'should not be expanded');
-
-    swatchColorPickerRoot.find('.ms-swatchColorPickerButton').simulate('click');
-
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(1, 'should be expanded');
-
-    let menu = wrapper.getDOMNode().ownerDocument.querySelector('.ms-swatchColorPickerMenu') as Element;
-    expect(menu).to.not.equal(null, 'should have a menu');
-
-    let cell = menu.querySelector('button') as HTMLButtonElement;
-    expect(cell).to.not.equal(null, 'should find a cell');
-
-    ReactTestUtils.Simulate.click(cell);
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(1, 'should still be expanded');
-
-    ReactTestUtils.Simulate.keyDown(cell, { which: KeyCodes.enter });
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(1, 'at the end the menu should still be expanded');
-
-    expect(eventFireCounter).to.equal(0, 'no color changed events were fired');
-  });
-
-  it('Cannot execute a disabled menu item in an expanded swatch color picker', () => {
-    let eventFireCounter = 0;
-    const wrapper = mount(
-      <SwatchColorPicker
-        menuButtonProps={ { iconProps: { iconName: 'fontColor' }, title: 'Font Color' } }
-        swatchColorPickerItems={ [{ id: 'a', label: 'green', type: SwatchColorPickerItemType.MenuItem, disabled: true }] }
-        onMenuItemClick={ (item) => eventFireCounter++ }
-        columnCount={ 4 }
-      />);
-    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
-
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton').length).to.equal(1, 'should have a button');
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(0, 'should not be expanded');
-
-    swatchColorPickerRoot.find('.ms-swatchColorPickerButton').simulate('click');
-
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(1, 'should be expanded');
-
-    let menu = wrapper.getDOMNode().ownerDocument.querySelector('.ms-swatchColorPickerMenu') as Element;
-    expect(menu).to.not.equal(null, 'should have a menu');
-
-    let cell = menu.querySelector('button') as HTMLButtonElement;
-    expect(cell).to.not.equal(null, 'should find a cell');
-
-    ReactTestUtils.Simulate.click(cell);
-    expect(swatchColorPickerRoot.find('.ms-swatchColorPickerButton.is-expanded').length).to.equal(1, 'should still be expanded');
-    expect(eventFireCounter).to.equal(0, 'no color changed events were fired');
-  });
-
-  it('Cannot execute a disabled cell in a non-collapsable swatch color picker', () => {
-    let eventFireCounter = 0;
-    const wrapper = mount(
-      <SwatchColorPicker
-        swatchColorPickerItems={ [{ id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00', disabled: true }] }
-        onColorChanged={ (color) => eventFireCounter++ }
-        columnCount={ 4 }
-      />);
-    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
-
-    let button = swatchColorPickerRoot.find('button');
-    expect(button).to.not.equal(null, 'should find a button');
-    button.simulate('click');
-    expect(eventFireCounter).to.equal(0, 'no color changed events were fired');
-  });
-
-  it('Cannot execute a disabled menu item in a non-collapsable swatch color picker', () => {
-    let eventFireCounter = 0;
-    const wrapper = mount(
-      <SwatchColorPicker
-        swatchColorPickerItems={ [{ id: 'a', label: 'green', type: SwatchColorPickerItemType.MenuItem, disabled: true }] }
-        onMenuItemClick={ (item) => eventFireCounter++ }
-        columnCount={ 4 }
-      />);
-    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
-
-    let button = swatchColorPickerRoot.find('button');
-    expect(button).to.not.equal(null, 'should find a button');
-    button.simulate('click');
-    expect(eventFireCounter).to.equal(0, 'no color changed events were fired');
-  });
-
   it('Can execute a cell in non-collapsable swatch color picker ', () => {
     let eventFireCounter = 0;
     const wrapper = mount(
       <SwatchColorPicker
-        swatchColorPickerItems={ [{ id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00' }] }
+        colorCells={ [{ id: 'a', label: 'green', color: '#00ff00' }] }
         onColorChanged={ (color) => eventFireCounter++ }
         columnCount={ 4 }
       />);
-    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
     let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
     let container = reactContainer.getDOMNode();
     expect(container).to.not.equal(null, 'should have a container');
@@ -309,35 +84,14 @@ describe('SwatchColorPicker', () => {
     expect(eventFireCounter).to.equal(1, 'one color changed events were fired');
   });
 
-  it('Can execute a menu item in non-collapsable swatch color picker ', () => {
-    let eventFireCounter = 0;
-    const wrapper = mount(
-      <SwatchColorPicker
-        swatchColorPickerItems={ [{ id: 'a', label: 'green', type: SwatchColorPickerItemType.MenuItem }] }
-        onMenuItemClick={ (item) => eventFireCounter++ }
-        columnCount={ 4 }
-      />);
-    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
-    let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
-    let container = reactContainer.getDOMNode();
-    expect(container).to.not.equal(null, 'should have a container');
-
-    let item = container.querySelector('[role="button"]') as Element;
-    expect(item).to.not.equal(null, 'should find a item');
-
-    ReactTestUtils.Simulate.click(item);
-    expect(eventFireCounter).to.equal(1, 'one color changed events were fired');
-  });
-
   it('Can fire the hover event on a cell in non-collapsable swatch color picker ', () => {
     let eventFireCounter = 0;
     const wrapper = mount(
       <SwatchColorPicker
-        swatchColorPickerItems={ [{ id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00' }] }
+        colorCells={ [{ id: 'a', label: 'green', color: '#00ff00' }] }
         onCellHovered={ (color) => eventFireCounter++ }
         columnCount={ 4 }
       />);
-    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
     let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
     let container = reactContainer.getDOMNode();
     expect(container).to.not.equal(null, 'should have a container');
@@ -353,11 +107,10 @@ describe('SwatchColorPicker', () => {
     let eventFireCounter = 0;
     const wrapper = mount(
       <SwatchColorPicker
-        swatchColorPickerItems={ [{ id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00' }] }
+        colorCells={ [{ id: 'a', label: 'green', color: '#00ff00' }] }
         onCellFocused={ (color) => eventFireCounter++ }
         columnCount={ 4 }
       />);
-    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
     let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
     let container = reactContainer.getDOMNode();
     expect(container).to.not.equal(null, 'should have a container');
@@ -368,25 +121,4 @@ describe('SwatchColorPicker', () => {
     ReactTestUtils.Simulate.focus(cell);
     expect(eventFireCounter).to.equal(1, 'one color changed events were fired');
   });
-
-  it('Cannot fire a hover or focus event on a disabled cell in non-collapsable swatch color picker ', () => {
-    let eventFireCounter = 0;
-    const wrapper = mount(
-      <SwatchColorPicker
-        swatchColorPickerItems={ [{ id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00', disabled: true }] }
-        onCellFocused={ (color) => eventFireCounter++ }
-        onCellHovered={ (color) => eventFireCounter++ }
-        columnCount={ 4 }
-      />);
-    let swatchColorPickerRoot = wrapper.find('.ms-swatchColorPickerWrapper');
-    let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
-    let container = reactContainer.getDOMNode();
-    expect(container).to.not.equal(null, 'should have a container');
-
-    let cell = container.querySelector('[role="gridcell"]') as Element;
-    expect(cell).to.not.equal(null, 'should find a cell');
-    ReactTestUtils.Simulate.mouseEnter(cell);
-    ReactTestUtils.Simulate.focus(cell);
-    expect(eventFireCounter).to.equal(0, 'no color changed events were fired');
-  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
index 82640975513ae..e040794cf13d0 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
@@ -9,14 +9,11 @@ import {
 import {
   ISwatchColorPicker,
   ISwatchColorPickerProps,
-  ISwatchColorPickerItemProps,
-  SwatchColorPickerItemType
+  IColorCellProps
 } from './SwatchColorPicker.Props';
-import { DirectionalHint } from '../../ContextualMenu';
 import { getColorFromString } from '../../utilities/color/colors';
 import { Grid } from '../../utilities/grid/Grid';
-import { DefaultButton, CommandButton, IButtonProps } from '../../Button';
-import { Callout } from '../../Callout';
+import { CommandButton } from '../../Button';
 import { FocusZone } from '../../FocusZone';
 import * as stylesImport from './SwatchColorPicker.scss';
 const styles: any = stylesImport;
@@ -26,23 +23,13 @@ interface ISwatchColorPickerOptionProps {
   /**
    * The option that will be made available to the user
    */
-  item: ISwatchColorPickerItemProps;
+  item: IColorCellProps;
 
   /**
    * Arbitrary unique string associated with this option
    */
   id: string;
 
-  /**
-   * Optional, the position in the parent set for this item
-   */
-  posInSet?: number;
-
-  /**
-   * Optional, the size of the total parent set
-   */
-  setSize?: number;
-
   /**
    * Optional, if the this option should be diabled
    */
@@ -56,7 +43,7 @@ interface ISwatchColorPickerOptionProps {
   /**
    * The on click handler
    */
-  onClick: (item: ISwatchColorPickerItemProps) => void;
+  onClick: (item: IColorCellProps) => void;
 
   /**
    * Optional, the onHover handler
@@ -79,18 +66,30 @@ interface ISwatchColorPickerOptionProps {
   className?: string;
 
   /**
-   * The shape for the option (only used for item type.Cell)
+   * The shape for the option. Defaults to circle
    */
   cellShape?: 'circle' | 'square';
 }
 
-const SwatchColorPickerOption: React.StatelessComponent<ISwatchColorPickerOptionProps> =
-  (props: ISwatchColorPickerOptionProps) => {
+class SwatchColorPickerOption extends React.Component<ISwatchColorPickerOptionProps, null> {
+
+  public static defaultProps = {
+    cellShape: 'circle',
+    disabled: false
+  };
+
+  private _id: string;
+
+  constructor(props: ISwatchColorPickerOptionProps) {
+    super(props);
+
+    this._id = props.id || getId('colorCell');
+  }
+
+  public render() {
     let {
       item,
       id,
-      posInSet,
-      setSize,
       className,
       role,
       selectedIndex,
@@ -99,100 +98,122 @@ const SwatchColorPickerOption: React.StatelessComponent<ISwatchColorPickerOption
       onClick,
       onHover,
       onFocus
-    } = props;
+    } = this.props;
     return (
       <CommandButton
-        { ...item.menuItemButtonProps }
         id={ id + '-item' + item.index }
         data-index={ item.index }
         data-is-focusable={ true }
-        aria-posinset={ posInSet && posInSet }
-        aria-setsize={ setSize && setSize }
         disabled={ disabled }
         className={ css(className,
           {
-            ['is-selected ' + styles.cellIsSelected]: (selectedIndex && selectedIndex === item.index),
+            ['is-selected ' + styles.cellIsSelected]: (selectedIndex !== undefined && selectedIndex === item.index),
             ['is-disabled ' + styles.disabled]: disabled
           }
         ) }
-        onClick={ _onClick }
-        onMouseEnter={ _onMouseEnter }
-        onMouseLeave={ _onMouseLeave }
-        onFocus={ _onFocus }
+        onClick={ this._onClick }
+        onMouseEnter={ this._onMouseEnter }
+        onMouseLeave={ this._onMouseLeave }
+        onFocus={ this._onFocus }
         role={ role }
-        aria-selected={ selectedIndex && (selectedIndex === item.index).toString() }
+        aria-selected={ selectedIndex !== undefined && (selectedIndex === item.index).toString() }
         ariaLabel={ item.label && item.label }
         title={ item.label && item.label }
       >
-        { _onRenderOption() }
+        { this._onRenderOption() }
       </CommandButton>
     );
+  }
 
-    function _onClick() {
-      if (onClick && !disabled) {
-        onClick(item);
-      }
-    }
+  @autobind
+  private _onClick() {
+    let {
+        onClick,
+      disabled,
+      item
+      } = this.props;
 
-    function _onMouseEnter() {
-      if (onHover && !disabled) {
-        onHover(item.id, item.color);
-      }
+    if (onClick && !disabled) {
+      onClick(item);
     }
+  }
 
-    function _onMouseLeave() {
-      if (onHover && !disabled) {
-        onHover();
-      }
-    }
+  @autobind
+  private _onMouseEnter() {
+    let {
+        onHover,
+      disabled,
+      item
+      } = this.props;
 
-    function _onFocus() {
-      if (onFocus && !disabled) {
-        onFocus(item.id, item.color);
-      }
+    if (onHover && !disabled) {
+      onHover(item.id, item.color);
     }
+  }
 
-    /**
-     * Render the core of an cell or menu item
-     * @returns {JSX.Element} - Element representing the core of the item
-     */
-    function _onRenderOption(): JSX.Element {
+  @autobind
+  private _onMouseLeave() {
+    let {
+        onHover,
+      disabled
+      } = this.props;
 
-      // Menu items just need their label text
-      if (item.type !== SwatchColorPickerItemType.Cell) {
-        return <span className={ styles.menuItem } >{ item.label }</span>;
-      }
+    if (onHover && !disabled) {
+      onHover();
+    }
+  }
 
-      // Build an SVG for the cell with the given shape and color properties
-      return (
-        <svg className={ css(styles.svg, cellShape, cellShape === 'circle' ? styles.circle : '') } viewBox='0 0 20 20' fill={ getColorFromString(item.color as string).str } >
-          {
-            cellShape === 'circle' ?
-              <circle cx='50%' cy='50%' r='50%' /> :
-              <rect width='100%' height='100%' />
-          }
-        </svg>
-      );
+  @autobind
+  private _onFocus() {
+    let {
+        onFocus,
+      disabled,
+      item
+      } = this.props;
+
+    if (onFocus && !disabled) {
+      onFocus(item.id, item.color);
     }
-  };
+  }
+
+  /**
+   * Render the core of a color cell
+   * @returns {JSX.Element} - Element representing the core of the item
+   */
+  @autobind
+  private _onRenderOption(): JSX.Element {
+    let {
+        cellShape,
+      item
+      } = this.props;
+
+    // Build an SVG for the cell with the given shape and color properties
+    return (
+      <svg className={ css(styles.svg, cellShape, cellShape === 'circle' ? styles.circle : '') } viewBox='0 0 20 20' fill={ getColorFromString(item.color as string).str } >
+        {
+          cellShape === 'circle' ?
+            <circle cx='50%' cy='50%' r='50%' /> :
+            <rect width='100%' height='100%' />
+        }
+      </svg>
+    );
+  }
+}
 
 export interface ISwatchColorPickerState {
   selectedIndex?: number;
-  expanded?: boolean;
 }
 
 export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, ISwatchColorPickerState> implements ISwatchColorPicker {
 
   public static defaultProps = {
     cellShape: 'circle',
-    updateButtonIconWithColor: false,
-    disabled: false
+    disabled: false,
+    shouldFocusCircularNavigate: true
   };
 
   private _id: string;
 
-  private _buttonWrapper: HTMLDivElement;
-
   constructor(props: ISwatchColorPickerProps) {
     super(props);
 
@@ -200,12 +221,11 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
 
     let selectedIndex: number | undefined;
     if (props.selectedId) {
-      selectedIndex = this._getSelectedIndex(props.swatchColorPickerItems, props.selectedId);
+      selectedIndex = this._getSelectedIndex(props.colorCells, props.selectedId);
     }
 
     this.state = {
-      selectedIndex,
-      expanded: false
+      selectedIndex
     };
   }
 
@@ -213,7 +233,7 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
     let newSelectedIndex;
 
     if (newProps.selectedId) {
-      newSelectedIndex = this._getSelectedIndex(newProps.swatchColorPickerItems, newProps.selectedId);
+      newSelectedIndex = this._getSelectedIndex(newProps.colorCells, newProps.selectedId);
     }
 
     if (newSelectedIndex !== undefined &&
@@ -225,317 +245,77 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
   }
 
   public render() {
-    let { expanded } = this.state;
-    let { menuButtonProps,
-      disabled,
-      swatchColorPickerItems,
-      columnCount } = this.props;
-
-    // If we got button props, put the swatch color picker behind a button, otherwise
-    // render all of the items
-    let colorToSet = this._getSelectedColorToSet();
-    let renderElement = menuButtonProps !== undefined ?
-      <SwatchColorPickerMenuButton
-        { ...this.props }
-        color={ colorToSet }
-        onClick={ this._onButtonClick }
-        expanded={ !!this.state.expanded }
-        onRenderContainer={ this._onRenderContainer }
-        menuIconProps={ menuButtonProps.menuIconProps ?
-          menuButtonProps.menuIconProps :
-          { iconName: 'chevronDown' } }
-      /> :
-      <SwatchColorPickerBody
-        { ...this.props }
-        onRenderItems={ this._onRenderItems }
-      />;
-
-    return (
-      <div
-        ref={ this._resolveRef('_buttonWrapper') }
-        className={ css('ms-swatchColorPickerWrapper', styles.wrapper) }>
-        { renderElement }
-      </div>);
-  }
-
-  /**
-   * Get the selected item's index
-   * @param items - The items to search
-   * @param selectedId - The selected item's id to find
-   * @returns {number} - The index of the selected item's id, -1 if there was no match
-   */
-  private _getSelectedIndex(items: ISwatchColorPickerItemProps[], selectedId: string): number | undefined {
-    let selectedIndex = findIndex(items, (item => (item.id === selectedId)));
-    return selectedIndex >= 0 ? selectedIndex : undefined;
-  }
-
-  /**
-   * Gets the color for the selected index
-   * @returns {string} - The color for the selected index,
-   *   or undefined if: we are not updating the button icon with color,
-   *   there is not a valid selected index, or if we do not have a valid color
-   */
-  private _getSelectedColorToSet(): string | undefined {
-    let { selectedIndex } = this.state;
     let {
-      swatchColorPickerItems,
-      setSelectedColorForIcon
+      disabled,
+      colorCells,
+      columnCount,
+      positionInSet,
+      setSize,
+      shouldFocusCircularNavigate,
+      className,
+      onCellFocused
     } = this.props;
 
-    // Do we need to update the button with the selected
-    // item's color? If so, attempt to grab the color
-    if (setSelectedColorForIcon && selectedIndex !== undefined) {
-      let swatchColorPickerItem = swatchColorPickerItems[selectedIndex];
-      if (swatchColorPickerItem.type === SwatchColorPickerItemType.Cell) {
-        return swatchColorPickerItem.color;
-      }
-    }
-
-    return undefined;
-  }
-
-  /**
-   * Render all the items
-   * @param items - The swatch color picker items
-   * @returns {JSX.Element[]} - An array of all the items in the swatch color picker
-   */
-  @autobind
-  private _onRenderItems(items: ISwatchColorPickerItemProps[]): JSX.Element[] {
-
-    // This holds all of the element for the items
-    let elements: JSX.Element[] = [];
-
-    // The number of cells that were processed in the previous iteration of loop.
-    // This will be used to increase the index to the item after the last processed
-    // item
-    let numOfItemsInChunk = -1;
-
-    // If we have cell items and we are in a menu, get all the
-    // first executable items per chunk. Note, in this
-    // context each menuItem is in its own "chunk", only grouped
-    // cells are processed as a chunk. This helps with being able
-    // to determine the correct aria-posinset and aria-setsize values
-    let firstExecutableItemsPerChunk = (this.props.menuButtonProps ?
-      this._getFirstExecutableItemsPerChunk() : undefined) as ISwatchColorPickerItemProps[];
-
-    // Did we find any executable items? (e.g. should be calculate the set information)
-    let shouldGetSetInfo = (firstExecutableItemsPerChunk && firstExecutableItemsPerChunk.length > 0);
-
-    let setSize = shouldGetSetInfo ? firstExecutableItemsPerChunk.length : undefined;
-
-    // If any menuItem has an icon, all menu items need to be positined correctly so they align
-    let shouldAccountForIcon = (firstExecutableItemsPerChunk && findIndex(firstExecutableItemsPerChunk, (executableItem) => (executableItem.type === SwatchColorPickerItemType.MenuItem && executableItem.menuItemButtonProps)));
-
-    // Loop across the items processing them depending on their item type
-    let index = 0;
-    while (index < items.length) {
-      let item = items[index];
-      let posInSet = shouldGetSetInfo ? this._getPositionInSet(firstExecutableItemsPerChunk, item.id) : undefined;
-      switch (item.type) {
-        case SwatchColorPickerItemType.Divider:
-          elements.push(this._renderSeparator(item));
-          break;
-        case SwatchColorPickerItemType.Header:
-          elements.push(this._renderHeader(item));
-          break;
-        case SwatchColorPickerItemType.Cell:
-
-          // build all the cells in the chunk this cell
-          // exists within (this will process all of the
-          // consecutive cells until the next non-cell type
-          // is incountered (or if we reach the end of the items))
-          let chunkItems = this._getNextChunkOfCellItems(items.slice(index));
-
-          // Update the number of items in chunk
-          numOfItemsInChunk = chunkItems.length > 0 ? chunkItems.length : -1;
-
-          // Add the result to the array
-          elements.push(this._renderNextChunkOfCellItems(
-            chunkItems,
-            posInSet,
-            setSize));
-          break;
-        default:
-
-          // Does at least one of the menu items have an icon?
-          if (shouldAccountForIcon) {
-
-            // Make sure the width styling is the same by applying a consistent className
-            if (item.menuItemButtonProps) {
-              item.menuItemButtonProps = {
-                ...item.menuItemButtonProps,
-                iconProps: { ...item.menuItemButtonProps.iconProps, className: styles.icon }
-              };
-            } else {
-
-              // This menu item didn't have an icon so add a "spacer" icon to make the text
-              // content align. This aligns with how ContextualMenu achieves this alignmet
-              item.menuItemButtonProps = { ...item.menuItemButtonProps, iconProps: { iconName: 'customIcon', className: styles.icon } };
-            }
-          }
-          elements.push(this._renderOption(item, posInSet, setSize));
-      }
-
-      // Increase the index by the number of items in the just processed chunk,
-      // otherwise just increment the index
-      index += numOfItemsInChunk > 0 ? numOfItemsInChunk : 1;
-      numOfItemsInChunk = -1;
-    }
-
-    return elements;
-  }
-
-  /**
-   * Renders the next consecutive chunk of cells
-   * @param items - The items to process
-   * @param posInSet - Optional, the position in the set for this chunk
-   * @param setSize - Optional, the size of the total set
-   * @returns {JSX.Element} - The grid that represents the chunk
-   */
-  private _renderNextChunkOfCellItems(items: ISwatchColorPickerItemProps[], posInSet?: number, setSize?: number): JSX.Element {
-    return (
+    return (<FocusZone
+      isCircularNavigation={ shouldFocusCircularNavigate }
+      className={ css('ms-swatchColorPickerBodyContainer', styles.swatchColorPickerContainer, className) }
+      onBlur={ this.onSwatchColorPickerBlur }
+    >
       <Grid
-        key={ this._id + items[0].id + '-grid' }
-        items={ items }
+        key={ this._id + colorCells[0].id + '-grid' }
+        items={ colorCells.map((item, index) => { return { ...item, index }; }) }
         columnCount={ this.props.columnCount }
         onRenderItem={ this._renderOption }
-        positionInSet={ posInSet }
-        setSize={ setSize }
+        positionInSet={ positionInSet && positionInSet }
+        setSize={ setSize && setSize }
       />
-    );
-  }
-
-  /**
-   * Get the position in set for the given id
-   * @param firstExecutableItemsPerChunk - The list of fist executable items per chunk
-   * @param itemId - The id of item to find the index of
-   * @returns {number} - The position in the set
-   */
-  private _getPositionInSet(firstExecutableItemsPerChunk: ISwatchColorPickerItemProps[], itemId: string): number | undefined {
-
-    // Find the index of the given id in the list of first executable items per chunk
-    let index = findIndex(firstExecutableItemsPerChunk, (executableItem) => (executableItem.id === itemId));
-
-    return index < 0 ? undefined : index + 1;
+    </FocusZone>);
   }
 
   /**
-   * Gets the next chunk of consecutive cells starting a index zero.
-   * Note, index zero should be of type cell
-   * @param items - The list of items to process where index zero is the start of the chunk
-   * @returns {ISwatchColorPickerItemProps[]} - the array of consecutive cells starting at index zero
-   *   (and continuing to the first non-cell type or the end of the items)
+   * When the whole swatchColorPicker is blurred,
+   * make sure to clear the pending focused stated
    */
-  private _getNextChunkOfCellItems(items: ISwatchColorPickerItemProps[]): ISwatchColorPickerItemProps[] {
-    let nextIndextAfterChunk = findIndex(items, (item => item.type !== SwatchColorPickerItemType.Cell));
-
-    // If we didn't find a non-cell item, we need to handle everything that is left
-    if (nextIndextAfterChunk < 0) {
-      return items;
+  @autobind
+  private onSwatchColorPickerBlur() {
+    if (this.props.onCellFocused) {
+      this.props.onCellFocused();
     }
-
-    // If we get here we found our chunk boundry
-    return items.slice(0 /* start */, nextIndextAfterChunk);
   }
 
   /**
-   * Get only the executable items (cells and menuItems)
-   * @returns {ISwatchColorPickerItemProps[]} - an array of the executable items
-   */
-  private _getFirstExecutableItemsPerChunk(): ISwatchColorPickerItemProps[] {
-
-    // Make sure every item has an index, then filter
-    // the results so that you only get the executable items,
-    // finally filter those items down to just the items that are
-    // either the start of a chunk or an menu item
-    return (
-      this.props.swatchColorPickerItems.map((item, index) => { return { ...item, index }; })
-        .filter(item => (item.type === SwatchColorPickerItemType.Cell || item.type === SwatchColorPickerItemType.MenuItem))
-        .filter((item, filteredIndex, items) => {
-          return (
-            filteredIndex === 0 ||
-            item.type === SwatchColorPickerItemType.MenuItem ||
-            (item.index - items[filteredIndex - 1].index !== 1)
-          );
-        }));
-  }
-
-  /**
-   * Render the separator
-   * @param item - The divider item to get the data to render from
-   * @returns {JSX.Element} - Element that represents the separator
-   */
-  private _renderSeparator(item: ISwatchColorPickerItemProps): JSX.Element {
-    return this._renderHeaderOrDivider(item, 'separator', styles.divider);
-  }
-
-  /**
-   * Render the header
-   * @param item - The header item to get the data to render from
-   * @returns {JSX.Element} - Element that represents the header
-   */
-  private _renderHeader(item: ISwatchColorPickerItemProps): JSX.Element {
-    return this._renderHeaderOrDivider(item, 'heading', styles.header);
-  }
-
-  /**
-   * Handle the rendering of the header/divider
-   * @param item - The item to get the data to render from
-   * @param role - The role of the element
-   * @param className - the className to use
-   * @returns {JSX.Element} - Element that represents the header
+   * Get the selected item's index
+   * @param items - The items to search
+   * @param selectedId - The selected item's id to find
+   * @returns {number} - The index of the selected item's id, -1 if there was no match
    */
-  private _renderHeaderOrDivider(item: ISwatchColorPickerItemProps, role: string, className: string): JSX.Element {
-    return <div
-      role={ role }
-      key={ item.id }
-      className={ className }
-    >
-      { item.label && item.label }
-    </div>;
+  private _getSelectedIndex(items: IColorCellProps[], selectedId: string): number | undefined {
+    let selectedIndex = findIndex(items, (item => (item.id === selectedId)));
+    return selectedIndex >= 0 ? selectedIndex : undefined;
   }
 
   /**
-   * Render a cell or menu item
+   * Render a color cell
    * @param item - The item to render
-   * @param posInSet - Optional, the position in the set of the item
-   * @param setSize - Optional, the total set size this item is in
    * @returns {JSX.Element} - Element representing the item
    */
   @autobind
-  private _renderOption(item: ISwatchColorPickerItemProps, posInSet?: number, setSize?: number): JSX.Element {
+  private _renderOption(item: IColorCellProps): JSX.Element {
     let id = this._id;
-    let isCell = item.type === SwatchColorPickerItemType.Cell;
-    let optionProps;
-
-    if (isCell) {
-      optionProps = {
-        className: styles.cell,
-        onClick: this._onCellClick,
-        onHover: this.props.onCellHovered,
-        onFocus: this.props.onCellFocused,
-        role: 'gridcell',
-        selectedIndex: this.state.selectedIndex
-      };
-    } else {
-      optionProps = {
-        posInSet: posInSet && posInSet,
-        setSize: setSize && setSize,
-        className: styles.item,
-        onClick: this._onMenuItemClick,
-        onFocus: this._clearFocusColorOnMenuItem,
-        role: this.props.menuButtonProps ? 'menuitem' : 'button'
-      };
-    }
 
     return (
       <SwatchColorPickerOption
         item={ item }
-        id={ this._id }
+        id={ id }
         key={ id + item.id }
-        disabled={ this.props.disabled || item.disabled }
+        disabled={ this.props.disabled }
         cellShape={ this.props.cellShape }
-        { ...optionProps }
+        className={ styles.cell }
+        onClick={ this._onCellClick }
+        onHover={ this.props.onCellHovered }
+        onFocus={ this.props.onCellFocused }
+        role={ 'gridcell' }
+        selectedIndex={ this.state.selectedIndex }
       />
     );
   }
@@ -545,8 +325,8 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
    * @param item - The cell that the click was fired against
    */
   @autobind
-  private _onCellClick(item: ISwatchColorPickerItemProps) {
-    if (this.props.disabled || item.disabled) {
+  private _onCellClick(item: IColorCellProps) {
+    if (this.props.disabled) {
       return;
     }
 
@@ -560,44 +340,11 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
       }
 
       this.setState({
-        selectedIndex: index,
-        expanded: false
-      });
-    } else if (index === this.state.selectedIndex) {
-
-      // The index that got the click was already selected,
-      // clear the selection
-      this._clearColors([this.props.onColorChanged!, this.props.onCellHovered!, this.props.onCellFocused!]);
-
-      this.setState({
-        selectedIndex: undefined,
-        expanded: false
+        selectedIndex: index
       });
     }
   }
 
-  /**
-   * Handle the click on a menu item
-   * @param item - The menu item that the click was fired against
-   */
-  @autobind
-  private _onMenuItemClick(item: ISwatchColorPickerItemProps) {
-    if (this.props.disabled || item.disabled) {
-      return;
-    }
-
-    if (this.props.onMenuItemClick) {
-      this.props.onMenuItemClick(item);
-    }
-
-    // Make sure to clear any hover/focus colors
-    this._clearColors([this.props.onCellHovered!, this.props.onCellFocused!]);
-
-    this.setState({
-      expanded: false
-    });
-  }
-
   /**
    * Clear the colors by calling the given callbacks
    * @param callbacks - The callbacks to handle the clear operation
@@ -609,171 +356,4 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
       }
     });
   }
-
-  /**
-   * Clear the focus color
-   * @param id - The id of the item
-   * @param color - The color for the item
-   */
-  @autobind
-  private _clearFocusColorOnMenuItem(id?: string, color?: string) {
-    this._clearColors([this.props.onCellFocused!]);
-  }
-
-  /**
-   * onClick Handler for the button
-   */
-  @autobind
-  private _onButtonClick() {
-    if (this.props.disabled) {
-      return;
-    }
-
-    if (this.state.expanded) {
-      this._onDismiss();
-    }
-
-    this.setState({
-      expanded: this.props.disabled ? false : !this.state.expanded
-    });
-  }
-
-  /**
-   * Render the menu (callout) for when the swatch color picker
-   * is behind a button and is expanded
-   */
-  @autobind
-  private _onRenderContainer() {
-    return (
-      <Callout
-        isBeakVisible={ false }
-        gapSpace={ 0 }
-        doNotLayer={ false }
-        role={ 'menu' }
-        directionalHint={ DirectionalHint.bottomLeftEdge }
-        className={ css('ms-swatchColorPickerMenu', styles.swatchColorPickerContainer) }
-        targetElement={ this._buttonWrapper }
-        onDismiss={ this._onDismiss }
-        setInitialFocus={ true }>
-        <SwatchColorPickerBody
-          { ...this.props }
-          onRenderItems={ this._onRenderItems }
-        />
-      </Callout>
-    );
-  }
-
-  /**
-   * Handle dismissing the menu
-   */
-  @autobind
-  private _onDismiss() {
-    this._clearColors([this.props.onCellHovered!, this.props.onCellFocused!]);
-
-    this.setState({
-      expanded: false
-    });
-  }
-}
-
-interface IMenuButtonProps extends IButtonProps {
-  /**
-   * The CSS-compatible string to describe the color to set
-   * for the button
-   */
-  color?: string;
-
-  /**
-   * Is the menuButton expanded?
-   */
-  expanded: boolean;
-
-  /**
-   * Is the menuButton disabled>
-   */
-  disabled?: boolean;
-
-  /**
-   * OnClick handler
-   */
-  onClick: () => void;
-
-  /**
-   * Callback for rendering the expanded container
-   */
-  onRenderContainer: () => JSX.Element;
-
-  /**
-   * Optional, ButtonProps for the menuButton
-   */
-  menuButtonProps?: IButtonProps;
-}
-
-class SwatchColorPickerMenuButton extends BaseComponent<IMenuButtonProps, {}> {
-  public static defaultProps = {
-    expanded: false,
-    disabled: false
-  };
-
-  public render() {
-    let {
-      color,
-      expanded,
-      disabled,
-      onClick,
-      onRenderContainer,
-      menuIconProps,
-      menuButtonProps
-    } = this.props;
-    return (
-      <div>
-        <DefaultButton
-          { ...menuButtonProps }
-          style={ { color: color && color } }
-          className={
-            css('ms-swatchColorPickerButton',
-              {
-                'is-expanded': expanded
-              }
-            )
-          }
-          onClick={ onClick }
-          aria-haspopup={ true }
-          aria-expanded={ !disabled && expanded }
-          disabled={ disabled }
-          menuIconProps={ menuIconProps ?
-            menuIconProps :
-            { iconName: 'chevronDown' } }
-        />
-        { (!disabled && expanded) &&
-          onRenderContainer()
-        }
-      </div>
-    );
-  }
-}
-
-interface ISwatchColorPickerBodyProps {
-  componentRef?: () => void;
-  swatchColorPickerItems: ISwatchColorPickerItemProps[];
-  columnCount: number;
-  onRenderItems: (items: ISwatchColorPickerItemProps[]) => JSX.Element[];
-}
-
-class SwatchColorPickerBody extends BaseComponent<ISwatchColorPickerBodyProps, {}> {
-  public render() {
-    let {
-      swatchColorPickerItems,
-      columnCount,
-      onRenderItems
-    } = this.props;
-    return (
-      <FocusZone
-        isCircularNavigation={ true }
-        className={ css('ms-swatchColorPickerBodyContainer', styles.swatchColorPickerContainer) }
-      >
-        { onRenderItems(swatchColorPickerItems.map((item, index) => { return { ...item, index }; })) }
-      </FocusZone>
-    );
-  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
index e0d5f1a762531..981bc80887b0a 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
@@ -1,8 +1,5 @@
 import * as React from 'react';
-import {
-  SwatchColorPicker,
-  SwatchColorPickerItemType
-} from 'office-ui-fabric-react/lib/SwatchColorPicker';
+import { SwatchColorPicker } from 'office-ui-fabric-react/lib/SwatchColorPicker';
 
 export interface IBasicSwatchColorPickerExampleState {
   color: string | undefined;
@@ -25,166 +22,66 @@ export class SwatchColorPickerBasicExample extends React.Component<any, IBasicSw
 
     return (
       <div>
-        <div>Simple swatch color picker:</div>
+        <div>Simple circle swatch color picker:</div>
         <SwatchColorPicker
           columnCount={ 4 }
           cellShape={ 'circle' }
-          swatchColorPickerItems={
+          colorCells={
             [
-              { id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00' },
-              { id: 'b', label: 'orange', type: SwatchColorPickerItemType.Cell, color: '#ffa500' },
-              { id: 'c', label: 'blue', type: SwatchColorPickerItemType.Cell, color: '#0000ff' },
-              { id: 'd', label: 'red', type: SwatchColorPickerItemType.Cell, color: '#ff0000' }
+              { id: 'a', label: 'green', color: '#00ff00' },
+              { id: 'b', label: 'orange', color: '#ffa500' },
+              { id: 'c', label: 'blue', color: '#0000ff' },
+              { id: 'd', label: 'red', color: '#ff0000' }
             ]
           } />
-        <div style={ { height: '235px', position: 'relative' } }>
-          <div>Simple swatch color picker with multiple sections:</div>
-          <SwatchColorPicker
-            columnCount={ this.width }
-            cellShape={ 'circle' }
-            swatchColorPickerItems={
-              [
-                { id: '0', label: 'Colors', type: SwatchColorPickerItemType.Header },
-                { id: 'd1', type: SwatchColorPickerItemType.Divider },
-                { id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00' },
-                { id: 'b', label: 'orange', type: SwatchColorPickerItemType.Cell, color: '#ffa500' },
-                { id: 'c', label: 'blue', type: SwatchColorPickerItemType.Cell, color: '#0000ff' },
-                { id: 'd', label: 'red', type: SwatchColorPickerItemType.Cell, color: '#ff0000' },
-                { id: 'e', type: SwatchColorPickerItemType.Divider },
-                { id: 'f', label: 'More Colors', type: SwatchColorPickerItemType.Header },
-                { id: 'd2', type: SwatchColorPickerItemType.Divider },
-                { id: 'g', label: 'green', type: SwatchColorPickerItemType.Cell, color: 'green' },
-                { id: 'h', label: 'orange', type: SwatchColorPickerItemType.Cell, color: 'orange' },
-                { id: 'i', label: 'blue', type: SwatchColorPickerItemType.Cell, color: 'blue' },
-                { id: 'j', label: 'red', type: SwatchColorPickerItemType.Cell, color: 'red' },
-                { id: 'k', label: 'black', type: SwatchColorPickerItemType.Cell, color: 'black' },
-                { id: 'l', label: 'grey', type: SwatchColorPickerItemType.Cell, color: 'grey' },
-                { id: 'm', label: 'purple', type: SwatchColorPickerItemType.Cell, color: 'purple' },
-                { id: 'n', label: 'yellow', type: SwatchColorPickerItemType.Cell, color: 'yellow' }
-
-              ]
-            } />
-        </div>
-        <div>Simple expandable swatch color picker with multiple sections:</div>
+        <div>Simple square swatch color picker:</div>
         <SwatchColorPicker
-          menuButtonProps={ { iconProps: { iconName: 'color' }, menuIconProps: { iconName: 'add' } } }
           columnCount={ 4 }
           cellShape={ 'square' }
-          swatchColorPickerItems={
-            [
-              { id: '0', label: 'Colors', type: SwatchColorPickerItemType.Header },
-              { id: 'd1', type: SwatchColorPickerItemType.Divider },
-              { id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00' },
-              { id: 'b', label: 'orange', type: SwatchColorPickerItemType.Cell, color: '#ffa500' },
-              { id: 'c', label: 'blue', type: SwatchColorPickerItemType.Cell, color: '#0000ff' },
-              { id: 'd', label: 'red', type: SwatchColorPickerItemType.Cell, color: '#ff0000' },
-              { id: 'e', type: SwatchColorPickerItemType.Divider },
-              { id: 'f', label: 'More Colors', type: SwatchColorPickerItemType.Header },
-              { id: 'd2', type: SwatchColorPickerItemType.Divider },
-              { id: 'g', label: 'green', type: SwatchColorPickerItemType.Cell, color: 'green' },
-              { id: 'h', label: 'orange', type: SwatchColorPickerItemType.Cell, color: 'orange' },
-              { id: 'i', label: 'blue', type: SwatchColorPickerItemType.Cell, color: 'blue' },
-              { id: 'j', label: 'red', type: SwatchColorPickerItemType.Cell, color: 'red' },
-              { id: 'k', type: SwatchColorPickerItemType.Divider },
-              { id: 'l', label: 'Find Colors', type: SwatchColorPickerItemType.MenuItem },
-              { id: 'm', label: 'Find More Colors', type: SwatchColorPickerItemType.MenuItem, menuItemButtonProps: { iconProps: { iconName: 'glasses' } } },
-              { id: 'n', label: '...More Colors...', type: SwatchColorPickerItemType.MenuItem },
-              { id: 'o', label: 'Find Even More Colors', type: SwatchColorPickerItemType.MenuItem, menuItemButtonProps: { iconProps: { iconName: 'redEye' } } }
-            ]
-          } />
-        <div>Simple expandable swatch color picker with multiple sections that updates it's icon color:</div>
-        <SwatchColorPicker
-          menuButtonProps={ { iconProps: { iconName: 'fontColor' }, title: 'Font Color' } }
-          setSelectedColorForIcon={ true }
-          columnCount={ 4 }
-          cellShape={ 'circle' }
-          swatchColorPickerItems={
+          colorCells={
             [
-              { id: '0', label: 'Colors', type: SwatchColorPickerItemType.Header },
-              { id: 'd1', type: SwatchColorPickerItemType.Divider },
-              { id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00' },
-              { id: 'b', label: 'orange', type: SwatchColorPickerItemType.Cell, color: '#ffa500' },
-              { id: 'c', label: 'blue', type: SwatchColorPickerItemType.Cell, color: '#0000ff' },
-              { id: 'd', label: 'red', type: SwatchColorPickerItemType.Cell, color: '#ff0000' },
-              { id: 'e', type: SwatchColorPickerItemType.Divider },
-              { id: 'f', label: 'More Colors', type: SwatchColorPickerItemType.Header },
-              { id: 'd2', type: SwatchColorPickerItemType.Divider },
-              { id: 'g', label: 'green', type: SwatchColorPickerItemType.Cell, color: 'green' },
-              { id: 'h', label: 'orange', type: SwatchColorPickerItemType.Cell, color: 'orange' },
-              { id: 'i', label: 'blue', type: SwatchColorPickerItemType.Cell, color: 'blue' },
-              { id: 'j', label: 'red', type: SwatchColorPickerItemType.Cell, color: 'red' },
-              { id: 'k', label: 'black', type: SwatchColorPickerItemType.Cell, color: 'black' },
-              { id: 'l', label: 'grey', type: SwatchColorPickerItemType.Cell, color: 'grey' },
-              { id: 'm', label: 'purple', type: SwatchColorPickerItemType.Cell, color: 'purple' },
-              { id: 'n', label: 'yellow', type: SwatchColorPickerItemType.Cell, color: 'yellow' },
-              { id: 'o', label: 'Find More Colors', type: SwatchColorPickerItemType.MenuItem, menuItemButtonProps: { iconProps: { iconName: 'glasses' } } }
+              { id: 'a', label: 'green', color: '#00ff00' },
+              { id: 'b', label: 'orange', color: '#ffa500' },
+              { id: 'c', label: 'blue', color: '#0000ff' },
+              { id: 'd', label: 'red', color: '#ff0000' }
             ]
           } />
-        <div>Simple expandable swatch color picker with multiple sections that updates it's icon color and shows a preview color:</div>
+        <div>Simple swatch color picker with multiple rows that updates it's icon color and shows a preview color:</div>
         <div style={ { color: this.state.previewColor ? this.state.previewColor : this.state.color ? this.state.color : null, fontSize: '24px' } } >Sample Text</div>
         <SwatchColorPicker
-          menuButtonProps={ { iconProps: { iconName: 'fontColor' }, title: 'Font Color' } }
-          setSelectedColorForIcon={ true }
           onCellHovered={ (id, color) => this.setState({ previewColor: color! }) }
           onCellFocused={ (id, color) => this.setState({ previewColor: color! }) }
           onColorChanged={ (id, newColor) => this.setState({ color: newColor }) }
-          onMenuItemClick={ (item) => item.label && alert(item.label + ' was clicked') }
           columnCount={ 4 }
           cellShape={ 'circle' }
-          swatchColorPickerItems={
+          colorCells={
             [
-              { id: '0', label: 'Colors', type: SwatchColorPickerItemType.Header },
-              { id: 'd1', type: SwatchColorPickerItemType.Divider },
-              { id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00' },
-              { id: 'b', label: 'orange', type: SwatchColorPickerItemType.Cell, color: '#ffa500' },
-              { id: 'c', label: 'blue', type: SwatchColorPickerItemType.Cell, color: '#0000ff' },
-              { id: 'd', label: 'red', type: SwatchColorPickerItemType.Cell, color: '#ff0000' },
-              { id: 'e', type: SwatchColorPickerItemType.Divider },
-              { id: 'f', label: 'More Colors', type: SwatchColorPickerItemType.Header },
-              { id: 'd2', type: SwatchColorPickerItemType.Divider },
-              { id: 'g', label: 'green', type: SwatchColorPickerItemType.Cell, color: 'green' },
-              { id: 'h', label: 'orange', type: SwatchColorPickerItemType.Cell, color: 'orange' },
-              { id: 'i', label: 'blue', type: SwatchColorPickerItemType.Cell, color: 'blue' },
-              { id: 'j', label: 'red', type: SwatchColorPickerItemType.Cell, color: 'red' },
-              { id: 'k', label: 'black', type: SwatchColorPickerItemType.Cell, color: 'black' },
-              { id: 'l', label: 'grey', type: SwatchColorPickerItemType.Cell, color: 'grey' },
-              { id: 'm', label: 'purple', type: SwatchColorPickerItemType.Cell, color: 'purple' },
-              { id: 'n', label: 'yellow', type: SwatchColorPickerItemType.Cell, color: 'yellow' },
-              { id: 'o', label: 'Find More Colors', type: SwatchColorPickerItemType.MenuItem, menuItemButtonProps: { iconProps: { iconName: 'glasses' } } }
+              { id: 'a', label: 'green', color: '#00ff00' },
+              { id: 'b', label: 'orange', color: '#ffa500' },
+              { id: 'c', label: 'blue', color: '#0000ff' },
+              { id: 'd', label: 'red', color: '#ff0000' },
+              { id: 'g', label: 'green', color: 'green' },
+              { id: 'h', label: 'orange', color: 'orange' },
+              { id: 'i', label: 'blue', color: 'blue' },
+              { id: 'j', label: 'red', color: 'red' },
+              { id: 'k', label: 'black', color: 'black' },
+              { id: 'l', label: 'grey', color: 'grey' },
+              { id: 'm', label: 'purple', color: 'purple' },
+              { id: 'n', label: 'yellow', color: 'yellow' }
 
             ]
           } />
-        <div>Simple disabled swatch color picker:</div>
+        <div>Simple disabled circle swatch color picker:</div>
         <SwatchColorPicker
-          menuButtonProps={ { iconProps: { iconName: 'fontColor' }, menuIconProps: { iconName: 'chevronDown' } } }
           disabled={ true }
           columnCount={ 4 }
-          cellShape={ 'square' }
-          swatchColorPickerItems={
-            [
-              { id: '0', label: 'Colors', type: SwatchColorPickerItemType.Header },
-              { id: 'd1', type: SwatchColorPickerItemType.Divider },
-              { id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00' },
-              { id: 'b', label: 'orange', type: SwatchColorPickerItemType.Cell, color: '#ffa500', disabled: true },
-              { id: 'c', label: 'blue', type: SwatchColorPickerItemType.Cell, color: '#0000ff' },
-              { id: 'd', label: 'red', type: SwatchColorPickerItemType.Cell, color: '#ff0000', disabled: true },
-            ]
-          } />
-        <div>Simple expandable swatch color picker with a few disabled items:</div>
-        <SwatchColorPicker
-          menuButtonProps={ { iconProps: { iconName: 'fontColor' }, menuIconProps: { iconName: 'chevronDown' } } }
-          columnCount={ 4 }
-          cellShape={ 'square' }
-          swatchColorPickerItems={
+          cellShape={ 'circle' }
+          colorCells={
             [
-              { id: '0', label: 'Colors', type: SwatchColorPickerItemType.Header },
-              { id: 'd1', type: SwatchColorPickerItemType.Divider },
-              { id: 'a', label: 'green', type: SwatchColorPickerItemType.Cell, color: '#00ff00' },
-              { id: 'b', label: 'orange', type: SwatchColorPickerItemType.Cell, color: '#ffa500', disabled: true },
-              { id: 'c', label: 'blue', type: SwatchColorPickerItemType.Cell, color: '#0000ff' },
-              { id: 'd', label: 'red', type: SwatchColorPickerItemType.Cell, color: '#ff0000', disabled: true },
-              { id: 'e', label: 'Find Colors', type: SwatchColorPickerItemType.MenuItem, menuItemButtonProps: { iconProps: { iconName: 'glasses' } }, disabled: true },
-              { id: 'f', label: 'Find More Colors', type: SwatchColorPickerItemType.MenuItem, menuItemButtonProps: { iconProps: { iconName: 'redEye' } } }
+              { id: 'a', label: 'green', color: '#00ff00' },
+              { id: 'b', label: 'orange', color: '#ffa500' },
+              { id: 'c', label: 'blue', color: '#0000ff' },
+              { id: 'd', label: 'red', color: '#ff0000' }
             ]
           } />
       </div>

From fa28674b2f94027e7ecd43ca8f114a7455af069e Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Mon, 31 Jul 2017 14:48:56 -0700
Subject: [PATCH 0335/1641] Adjustments for focusing items in People Picker
 (#2218)

* Allow X in selected people to get focus

* Update change output
---
 .../people-picker-focus_2017-07-14-21-52.json         | 11 +++++++++++
 .../src/components/pickers/BasePicker.tsx             |  5 +++++
 .../PeoplePickerItems/SelectedItemDefault.tsx         |  2 +-
 3 files changed, 17 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/people-picker-focus_2017-07-14-21-52.json

diff --git a/common/changes/office-ui-fabric-react/people-picker-focus_2017-07-14-21-52.json b/common/changes/office-ui-fabric-react/people-picker-focus_2017-07-14-21-52.json
new file mode 100644
index 0000000000000..f71278e7a48c5
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/people-picker-focus_2017-07-14-21-52.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Allow the X in a persona to receive focus and update focus when it is clicked",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index ae4208c65555a..d89795f93e015 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -544,6 +544,11 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
           return true;
       }
     }
+
+    if (ev.which === KeyCodes.enter) {
+      return true;
+    }
+
     return false;
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
index aaeb0f2b6035f..a7c3c5f150b24 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
@@ -26,6 +26,7 @@ export const SelectedItemDefault: (props: IPeoplePickerItemProps) => JSX.Element
         { ['is-invalid ' + styles.validationError]: item.ValidationState === ValidationState.warning }
       ) }
       data-is-focusable={ true }
+      data-is-sub-focuszone={ true }
       data-selection-index={ index } >
       <div className={ css('ms-PickerItem-content', styles.itemContent) } >
         <Persona
@@ -38,7 +39,6 @@ export const SelectedItemDefault: (props: IPeoplePickerItemProps) => JSX.Element
         onClick={ () => { if (onRemoveItem) { onRemoveItem(); } } }
         iconProps={ { iconName: 'Cancel', style: { fontSize: '12px' } } }
         className={ css('ms-PickerItem-removeButton', styles.removeButton) }
-        data-is-focusable={ false }
         ariaLabel={ removeButtonAriaLabel }
       />
     </div >

From d66b84777fdadc2f14b9d0f4251aa713ad81884c Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 1 Aug 2017 10:13:55 +0000
Subject: [PATCH 0336/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 ...mplifyImplementation_2017-07-27-23-22.json | 11 ------
 .../overflowSet-updates_2017-07-28-17-25.json | 11 ------
 ...bottom-sticky-footer_2017-07-12-21-36.json | 11 ------
 .../people-picker-focus_2017-07-14-21-52.json | 11 ------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 36 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 +++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/CHANGELOG.json               |  6 ++++
 packages/styling/CHANGELOG.md                 |  7 +++-
 packages/styling/package.json                 |  2 +-
 13 files changed, 68 insertions(+), 52 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-SwatchColorPicker-SimplifyImplementation_2017-07-27-23-22.json
 delete mode 100644 common/changes/office-ui-fabric-react/overflowSet-updates_2017-07-28-17-25.json
 delete mode 100644 common/changes/office-ui-fabric-react/panel-bottom-sticky-footer_2017-07-12-21-36.json
 delete mode 100644 common/changes/office-ui-fabric-react/people-picker-focus_2017-07-14-21-52.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 6cff503a4ade6..616035d0ddfc6 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.26.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.27.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPicker-SimplifyImplementation_2017-07-27-23-22.json b/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPicker-SimplifyImplementation_2017-07-27-23-22.json
deleted file mode 100644
index df5217d85c24e..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPicker-SimplifyImplementation_2017-07-27-23-22.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SwatchColorPicker: Simplify component to remove the menu button and header/divider aspects that were built in to the component. Now the SwatchColorPicker only renders the grid portion and is more streamlined",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/overflowSet-updates_2017-07-28-17-25.json b/common/changes/office-ui-fabric-react/overflowSet-updates_2017-07-28-17-25.json
deleted file mode 100644
index b823562d8caff..0000000000000
--- a/common/changes/office-ui-fabric-react/overflowSet-updates_2017-07-28-17-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "OverflowSet: Add focus method, class name and abstract item interface",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/panel-bottom-sticky-footer_2017-07-12-21-36.json b/common/changes/office-ui-fabric-react/panel-bottom-sticky-footer_2017-07-12-21-36.json
deleted file mode 100644
index 852fa5eea1364..0000000000000
--- a/common/changes/office-ui-fabric-react/panel-bottom-sticky-footer_2017-07-12-21-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Panel: added prop to force footer to bottom of the page",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/people-picker-focus_2017-07-14-21-52.json b/common/changes/office-ui-fabric-react/people-picker-focus_2017-07-14-21-52.json
deleted file mode 100644
index f71278e7a48c5..0000000000000
--- a/common/changes/office-ui-fabric-react/people-picker-focus_2017-07-14-21-52.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Allow the X in a persona to receive focus and update focus when it is clicked",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index dd90b553ab616..039eb88febfd6 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -48,7 +48,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.15.2 <1.0.0",
+    "@uifabric/styling": ">=0.15.3 <1.0.0",
     "@uifabric/utilities": ">=4.8.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index b1fa599a66440..47c1727060718 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.26.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.27.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index e4d56773686bf..37887b7e299bc 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,42 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.27.0",
+      "tag": "office-ui-fabric-react_v4.27.0",
+      "date": "Tue, 01 Aug 2017 10:13:55 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "75b8690920938e69cdefd2d92363ccd3c6eabdef",
+            "comment": "SwatchColorPicker: Simplify component to remove the menu button and header/divider aspects that were built in to the component. Now the SwatchColorPicker only renders the grid portion and is more streamlined"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "b08a5992ed06484684091b393002a6aab228908c",
+            "comment": "OverflowSet: Add focus method, class name and abstract item interface"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "ea03c892b388f359812282a0e99f4b9adeb07f4b",
+            "comment": "Panel: added prop to force footer to bottom of the page"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "fa28674b2f94027e7ecd43ca8f114a7455af069e",
+            "comment": "Allow the X in a persona to receive focus and update focus when it is clicked"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.15.2 <1.0.0` to `>=0.15.3 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.26.0",
       "tag": "office-ui-fabric-react_v4.26.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 0ca1f42f56482..a42e6003087dc 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 31 Jul 2017 10:12:08 GMT and should not be manually modified.
+This log was last generated on Tue, 01 Aug 2017 10:13:55 GMT and should not be manually modified.
+
+## 4.27.0
+Tue, 01 Aug 2017 10:13:55 GMT
+
+### Minor changes
+
+- SwatchColorPicker: Simplify component to remove the menu button and header/divider aspects that were built in to the component. Now the SwatchColorPicker only renders the grid portion and is more streamlined
+- OverflowSet: Add focus method, class name and abstract item interface
+- Panel: added prop to force footer to bottom of the page
+
+### Patches
+
+- Allow the X in a persona to receive focus and update focus when it is clicked
 
 ## 4.26.0
 Mon, 31 Jul 2017 10:12:08 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index efa0b4a82dbd7..29b87e7baa317 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.26.0",
+  "version": "4.27.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.8.0 <5.0.0",
-    "@uifabric/styling": ">=0.15.2 <1.0.0",
+    "@uifabric/styling": ">=0.15.3 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index cf7c6d172c58c..2160f04c3b7cb 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.15.3",
+      "tag": "@uifabric/styling_v0.15.3",
+      "date": "Tue, 01 Aug 2017 10:13:55 GMT",
+      "comments": {}
+    },
     {
       "version": "0.15.2",
       "tag": "@uifabric/styling_v0.15.2",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 493eb9862b687..d198243fbd8e9 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Mon, 31 Jul 2017 10:12:08 GMT and should not be manually modified.
+This log was last generated on Tue, 01 Aug 2017 10:13:55 GMT and should not be manually modified.
+
+## 0.15.3
+Tue, 01 Aug 2017 10:13:55 GMT
+
+*Changes not tracked*
 
 ## 0.15.2
 Mon, 31 Jul 2017 10:12:08 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 59ea4e702f61a..5183a6ded1990 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.15.2",
+  "version": "0.15.3",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 59f419ddeeb9fbfa5db9e90875c672c49fec3545 Mon Sep 17 00:00:00 2001
From: Serkan Inci <serkan.inci@hotmail.com>
Date: Tue, 1 Aug 2017 11:56:50 -0400
Subject: [PATCH 0337/1641] Fixing ContextualMenu icon issue #2336 (#2353)

* Fixing ContextualMenu icon issue #2336

* Update master_2017-08-01-11-35.json
---
 .../master_2017-08-01-11-35.json                      | 11 +++++++++++
 .../src/components/ContextualMenu/ContextualMenu.tsx  |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/master_2017-08-01-11-35.json

diff --git a/common/changes/office-ui-fabric-react/master_2017-08-01-11-35.json b/common/changes/office-ui-fabric-react/master_2017-08-01-11-35.json
new file mode 100644
index 0000000000000..9146c0b92dace
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2017-08-01-11-35.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: Fixing issue where icons are not displayed.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "serkani@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 5b3ef72c1dc29..93a81ee9fdbad 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -396,7 +396,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     return React.createElement(
       'button',
       assign({}, getNativeProps(item, buttonProperties), itemButtonProperties),
-      this._renderMenuItemChildren(item, index, !hasCheckmarks, !hasIcons));
+      this._renderMenuItemChildren(item, index, hasCheckmarks, hasIcons));
   }
 
   private _renderMenuItemChildren(item: IContextualMenuItem, index: number, hasCheckmarks: boolean, hasIcons: boolean) {

From d40a9c8afb171e1a550a05c60d542d27da3f48d3 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 1 Aug 2017 11:23:48 -0700
Subject: [PATCH 0338/1641] Checkbox edge doubleclick (#2357)

* Prevent second click event firing in Edge

* change file

* Add type='button'
---
 .../checkbox-edge-doubleclick_2017-08-01-16-42.json   | 11 +++++++++++
 .../src/components/Checkbox/Checkbox.tsx              |  2 ++
 2 files changed, 13 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/checkbox-edge-doubleclick_2017-08-01-16-42.json

diff --git a/common/changes/office-ui-fabric-react/checkbox-edge-doubleclick_2017-08-01-16-42.json b/common/changes/office-ui-fabric-react/checkbox-edge-doubleclick_2017-08-01-16-42.json
new file mode 100644
index 0000000000000..1b216c5b7ccdd
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/checkbox-edge-doubleclick_2017-08-01-16-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Checkbox: Fix Edge bug where 2nd click event was being fired",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
index 7c06f11581c5b..a864a45d07e68 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
@@ -106,6 +106,7 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
         name={ name }
         id={ this._id }
         role='checkbox'
+        type='button'
         className={ classNames.root }
         onClick={ this._onClick }
         onFocus={ this._onFocus }
@@ -155,6 +156,7 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
   private _onClick(ev: React.FormEvent<HTMLButtonElement>) {
     const { disabled, onChange } = this.props;
     const { isChecked } = this.state;
+    ev.preventDefault();
 
     if (!disabled) {
       if (onChange) {

From 856e21fb25f76daf48d08c6eba5445a4e33de352 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Tue, 1 Aug 2017 15:01:07 -0700
Subject: [PATCH 0339/1641] Enable strictNullChecks in office-ui-fabric-react
 (#2323)

* Layer, Toggle, HoverCard fixes

* Fix Panel

* Fix Dropdown and DocumentCardTitle

* Fix Button Checkbox and ComboBox

* Fix breadcrumb, combo box, and compount button

* More fixes

* More fixes

* More fixes

* More fixes

* More fixes

* More fixes

* More fixes

* More fixes

* More fixes

* More fixes

* More fixes

* More fixes

* Enable strict null checks!

* Rush change

* Fix build break.

* Fix things

* more fixes
---
 .../oufr-strict-null-4_2017-07-28-01-32.json  | 11 ++++
 .../src/VisualTestRoot.tsx                    |  2 +-
 .../src/common/ConnectedHost.tsx              |  4 +-
 .../src/common/StoreHost.tsx                  |  2 +-
 .../ActivityItem/ActivityItem.styles.ts       |  4 +-
 .../components/Breadcrumb/Breadcrumb.test.tsx |  2 +-
 .../src/components/Breadcrumb/Breadcrumb.tsx  |  6 +-
 .../src/components/Button/Button.test.tsx     |  9 +--
 .../CommandButton/CommandButton.styles.ts     |  2 +-
 .../Button/CommandButton/CommandButton.tsx    |  2 +-
 .../CompoundButton/CompoundButton.styles.ts   |  2 +-
 .../Button/CompoundButton/CompoundButton.tsx  |  2 +-
 .../DefaultButton/DefaultButton.styles.ts     |  2 +-
 .../Button/DefaultButton/DefaultButton.tsx    |  2 +-
 .../Button/IconButton/IconButton.styles.ts    |  2 +-
 .../Button/IconButton/IconButton.tsx          |  2 +-
 .../PrimaryButton/PrimaryButton.styles.ts     |  2 +-
 .../Button/PrimaryButton/PrimaryButton.tsx    |  2 +-
 .../Button/SplitButton/SplitButton.styles.ts  |  2 +-
 .../Button/examples/Button.Swap.Example.tsx   |  4 +-
 .../src/components/Calendar/CalendarDay.tsx   | 10 +--
 .../src/components/Calendar/CalendarMonth.tsx |  4 +-
 .../examples/Calendar.Button.Example.tsx      |  4 +-
 .../examples/Calendar.Inline.Example.tsx      | 10 +--
 .../examples/Callout.Cover.Example.tsx        |  2 +-
 .../examples/Callout.Directional.Example.tsx  |  2 +-
 .../components/Checkbox/Checkbox.styles.ts    |  2 +-
 .../src/components/Checkbox/Checkbox.tsx      | 12 ++--
 .../examples/Checkbox.Basic.Example.tsx       |  2 +-
 .../examples/ChoiceGroup.Custom.Example.tsx   |  2 +-
 .../src/components/ComboBox/ComboBox.Props.ts |  4 +-
 .../src/components/ComboBox/ComboBox.test.tsx |  2 +-
 .../src/components/ComboBox/ComboBox.tsx      | 16 ++---
 .../examples/ComboBox.Basic.Example.tsx       |  2 +-
 .../components/CommandBar/CommandBar.test.tsx |  2 +-
 .../CommandBar.Customization.Example.tsx      |  2 +-
 .../ContextualMenu/ContextualMenu.tsx         |  8 +--
 .../ContextualMenu.Directional.Example.tsx    |  4 +-
 .../examples/DatePicker.Basic.Example.tsx     |  2 +-
 .../examples/DatePicker.Input.Example.tsx     |  4 +-
 .../DetailsList/DetailsRowFields.tsx          |  2 +-
 .../examples/DetailsList.DragDrop.Example.tsx |  2 +-
 .../src/components/Dialog/DialogContent.tsx   |  4 +-
 .../components/DocumentCard/DocumentCard.tsx  | 10 +--
 .../DocumentCard/DocumentCardActions.tsx      |  2 +-
 .../DocumentCard/DocumentCardTitle.tsx        |  4 +-
 .../src/components/Dropdown/Dropdown.tsx      | 10 +--
 .../src/components/Fabric/Fabric.tsx          |  2 +-
 .../examples/Facepile.Basic.Example.tsx       |  2 +-
 .../FocusTrapZone/FocusTrapZone.tsx           |  4 +-
 .../components/FocusZone/FocusZone.test.tsx   | 11 ++--
 .../examples/FocusZone.List.Example.tsx       |  2 +-
 .../components/GroupedList/GroupFooter.tsx    | 19 +++---
 .../examples/GroupedList.Custom.Example.tsx   |  6 +-
 .../HoverCard/ExpandingCard.Props.ts          |  2 +-
 .../HoverCard/ExpandingCard.styles.ts         |  2 +-
 .../components/HoverCard/ExpandingCard.tsx    |  2 +-
 .../components/HoverCard/HoverCard.styles.ts  |  2 +-
 .../src/components/HoverCard/HoverCard.tsx    | 12 ++--
 .../examples/HoverCard.Basic.Example.tsx      |  4 +-
 .../src/components/Icon/Icon.styles.ts        |  4 +-
 .../src/components/Image/Image.tsx            |  4 +-
 .../src/components/Layer/Layer.test.tsx       |  4 +-
 .../src/components/Layer/LayerHost.tsx        |  4 +-
 .../MarqueeSelection.Basic.Example.tsx        |  2 +-
 .../examples/OverflowSet.Basic.Example.tsx    |  4 +-
 .../examples/OverflowSet.Custom.Example.tsx   |  4 +-
 .../src/components/Panel/Panel.tsx            | 64 ++++++++++---------
 .../src/components/Pivot/Pivot.tsx            |  2 +-
 .../src/components/Popup/Popup.tsx            |  2 +-
 .../ProgressIndicator/ProgressIndicator.tsx   |  2 +-
 .../ResizeGroup/ResizeGroup.test.tsx          |  2 +-
 .../ResizeGroup.OverflowSet.Example.tsx       |  2 +-
 .../src/components/SearchBox/SearchBox.tsx    |  4 +-
 .../src/components/Slider/Slider.tsx          |  6 +-
 .../TeachingBubble/TeachingBubble.test.tsx    |  2 +-
 .../components/TextField/TextField.test.tsx   |  2 +-
 .../src/components/Toggle/Toggle.tsx          |  6 +-
 .../src/components/Tooltip/TooltipHost.tsx    |  2 +-
 .../pickers/AutoFill/BaseAutoFill.tsx         |  6 +-
 .../components/pickers/BasePicker.Props.ts    |  2 +-
 .../components/pickers/BasePicker.test.tsx    |  4 +-
 .../src/components/pickers/BasePicker.tsx     | 22 +++----
 .../examples/PeoplePicker.Types.Example.tsx   |  6 +-
 .../pickers/Suggestions/Suggestions.Props.ts  |  2 +-
 .../pickers/Suggestions/Suggestions.tsx       |  2 +-
 .../Suggestions/SuggestionsController.ts      |  6 +-
 .../office-ui-fabric-react/src/demo/index.tsx |  4 +-
 packages/office-ui-fabric-react/tsconfig.json |  1 +
 89 files changed, 235 insertions(+), 208 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/oufr-strict-null-4_2017-07-28-01-32.json

diff --git a/common/changes/office-ui-fabric-react/oufr-strict-null-4_2017-07-28-01-32.json b/common/changes/office-ui-fabric-react/oufr-strict-null-4_2017-07-28-01-32.json
new file mode 100644
index 0000000000000..96ccf16e81e78
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/oufr-strict-null-4_2017-07-28-01-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Enable strictNullChecks",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/VisualTestRoot.tsx b/packages/office-ui-fabric-react/src/VisualTestRoot.tsx
index 985f0c5b81de9..5748011362299 100644
--- a/packages/office-ui-fabric-react/src/VisualTestRoot.tsx
+++ b/packages/office-ui-fabric-react/src/VisualTestRoot.tsx
@@ -19,7 +19,7 @@ function _routerDidMount() {
   if (_hasAnchorLink(window.location.hash)) {
     let hash = _extractAnchorLink(window.location.hash);
     let el = document.getElementById(hash);
-    let elRect = el.getBoundingClientRect();
+    let elRect = el!.getBoundingClientRect();
     let bodySTop = document.body.scrollTop;
     let currentScrollPosition;
     currentScrollPosition = bodySTop + elRect.top;
diff --git a/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx b/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx
index 7490bc2573fc4..9add3def31167 100644
--- a/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx
+++ b/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx
@@ -6,7 +6,7 @@ import { IStoreKey } from './storeKey';
 import { StoreSet } from './StoreSet';
 
 // Track all components that require changes.
-let _changedComponents: ConnectedHost[];
+let _changedComponents: ConnectedHost[] | null;
 
 export interface IConnectedHostProps {
   componentRef?: () => void;
@@ -103,7 +103,7 @@ export class ConnectedHost extends BaseComponent<IConnectedHostProps, IConnected
       if (!_changedComponents) {
         _changedComponents = [];
         this._async.setImmediate(() => {
-          _changedComponents.forEach(comp => comp._updateProps());
+          _changedComponents!.forEach(comp => comp._updateProps());
           _changedComponents = null;
         });
       }
diff --git a/packages/office-ui-fabric-react/src/common/StoreHost.tsx b/packages/office-ui-fabric-react/src/common/StoreHost.tsx
index ccb009a7be128..468b879018da7 100644
--- a/packages/office-ui-fabric-react/src/common/StoreHost.tsx
+++ b/packages/office-ui-fabric-react/src/common/StoreHost.tsx
@@ -27,7 +27,7 @@ export class StoreHost extends BaseComponent<IStoreHostProps, {}> {
     let { stores: parentStores } = this.context;
     let { stores: currentStores } = this.props;
 
-    return { stores: parentStores ? parentStores.merge(currentStores) : currentStores };
+    return { stores: parentStores ? parentStores.merge(currentStores!) : currentStores };
   }
 
   public render() {
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
index c944694335fe7..a38ef14eacac4 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
@@ -15,7 +15,7 @@ const COMPACT_ICON_SIZE = '13px';
 
 export const getStyles = memoizeFunction((
   theme: ITheme = getTheme(),
-  customStyles: IActivityItemStyles = undefined
+  customStyles: IActivityItemStyles | undefined = undefined
 ): IActivityItemStyles => {
   let ActivityItemStyles = {
 
@@ -112,5 +112,5 @@ export const getStyles = memoizeFunction((
     ]
   };
 
-  return mergeStyleSets(ActivityItemStyles, customStyles);
+  return mergeStyleSets(ActivityItemStyles, customStyles)!;
 });
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx
index ce8d16a732bb8..2872ff8c97dab 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx
@@ -31,7 +31,7 @@ describe('Breadcrumb', () => {
     let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
     let itemLink = renderedDOM.querySelector('.ms-Breadcrumb-itemLink');
 
-    ReactTestUtils.Simulate.click(itemLink);
+    ReactTestUtils.Simulate.click(itemLink!);
     expect(callbackValue).to.equal('TestKey');
   });
 
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
index bb5ab6be3a14b..10479e79f3ff1 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
@@ -41,8 +41,8 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
     const { onReduceData = this._onReduceData, maxDisplayedItems, items } = this.props;
     const breadCrumbData: IBreadCrumbData = {
       props: this.props,
-      renderedItems: items.slice(-maxDisplayedItems),
-      renderedOverflowItems: items.slice(0, -maxDisplayedItems)
+      renderedItems: items.slice(-maxDisplayedItems!),
+      renderedOverflowItems: items.slice(0, -maxDisplayedItems!)
     };
 
     return (
@@ -97,7 +97,7 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
                   iconProps={ { iconName: 'More' } }
                   role='button'
                   aria-haspopup='true'
-                  menuIconProps={ null }
+                  menuIconProps={ undefined }
                   menuProps={ {
                     items: contextualItems,
                     directionalHint: DirectionalHint.bottomLeftEdge
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
index 53fd89a7b1ab2..a14470c3a5efa 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
@@ -49,7 +49,8 @@ describe('DefaultButton', () => {
   });
 
   it('applies the correct aria attributes', () => {
-    let button, renderedDOM;
+    let button;
+    let renderedDOM: any;
     button = ReactTestUtils.renderIntoDocument<any>(
       <DefaultButton
         href='http://www.microsoft.com'
@@ -93,7 +94,7 @@ describe('DefaultButton', () => {
         href='http://www.microsoft.com'
         target='_blank'
         ariaDescription='This description is not visible'
-        styles={{screenReaderText: 'some-screenreader-class'}}>
+        styles={ { screenReaderText: 'some-screenreader-class' } }>
         Hello
       </DefaultButton>
     );
@@ -104,9 +105,9 @@ describe('DefaultButton', () => {
 
     button = ReactTestUtils.renderIntoDocument<any>(
       <IconButton
-        iconProps={{ iconName: 'Emoji2' }}
+        iconProps={ { iconName: 'Emoji2' } }
         ariaDescription='Description on icon button'
-        styles={{screenReaderText: 'some-screenreader-class'}} />
+        styles={ { screenReaderText: 'some-screenreader-class' } } />
     );
     renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
     expect(renderedDOM.getAttribute('aria-label') === null);
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
index 37e191fa30727..3794f5d37d602 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
@@ -73,5 +73,5 @@ export const getStyles = memoizeFunction((
 
   };
 
-  return mergeStyleSets(baseButtonStyles, commandButtonStyles, splitButtonStyles, customStyles);
+  return mergeStyleSets(baseButtonStyles, commandButtonStyles, splitButtonStyles, customStyles)!;
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx
index 1a4507ba66b13..247f3aa0a2d96 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx
@@ -20,7 +20,7 @@ export class CommandButton extends BaseComponent<IButtonProps, {}> {
       <BaseButton
         { ...this.props }
         variantClassName='ms-Button--command'
-        styles={ getStyles(theme, styles) }
+        styles={ getStyles(theme!, styles) }
         onRenderDescription={ nullRender }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
index 27baba7ebd00b..d46276fe3a836 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
@@ -71,5 +71,5 @@ export const getStyles = memoizeFunction((
 
   };
 
-  return mergeStyleSets(defaultButtonStyles, compoundButtonStyles, splitButtonStyles, customStyles);
+  return mergeStyleSets(defaultButtonStyles, compoundButtonStyles, splitButtonStyles, customStyles)!;
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
index 012ad5b60de50..54e8867ba572e 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
@@ -18,7 +18,7 @@ export class CompoundButton extends BaseComponent<IButtonProps, {}> {
       <BaseButton
         { ...this.props }
         variantClassName='ms-Button--compound'
-        styles={ getStyles(theme, styles) }
+        styles={ getStyles(theme!, styles) }
         onRenderIcon={ nullRender }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
index 49835edf84781..897dfe5bede3d 100644
--- a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
@@ -58,5 +58,5 @@ export const getStyles = memoizeFunction((
     }
   };
 
-  return mergeStyleSets(baseButtonStyles, defaultButtonStyles, splitButtonStyles, customStyles);
+  return mergeStyleSets(baseButtonStyles, defaultButtonStyles, splitButtonStyles, customStyles)!;
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
index 9a3f7e7d043b7..b2b22b57d386b 100644
--- a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
@@ -19,7 +19,7 @@ export class DefaultButton extends BaseComponent<IButtonProps, {}> {
       <BaseButton
         { ...this.props }
         variantClassName='ms-Button--default'
-        styles={ getStyles(theme, styles) }
+        styles={ getStyles(theme!, styles) }
         onRenderDescription={ nullRender }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
index ab98f5e3cb7c2..1598f34b35d8d 100644
--- a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
@@ -54,5 +54,5 @@ export const getStyles = memoizeFunction((
     }
   };
 
-  return mergeStyleSets(baseButtonStyles, iconButtonStyles, splitButtonStyles, customStyles);
+  return mergeStyleSets(baseButtonStyles, iconButtonStyles, splitButtonStyles, customStyles)!;
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
index 79c2107019e50..e705cbebf0d55 100644
--- a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
@@ -19,7 +19,7 @@ export class IconButton extends BaseComponent<IButtonProps, {}> {
       <BaseButton
         { ...this.props }
         variantClassName='ms-Button--icon'
-        styles={ getStyles(theme, styles) }
+        styles={ getStyles(theme!, styles) }
         onRenderText={ nullRender }
         onRenderDescription={ nullRender }
       />
diff --git a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
index 793c8d117a121..c2f5ad3b743e6 100644
--- a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
@@ -56,5 +56,5 @@ export const getStyles = memoizeFunction((
     }
   };
 
-  return mergeStyleSets(defaultButtonStyles, primaryButtonStyles, splitButtonStyles, customStyles);
+  return mergeStyleSets(defaultButtonStyles, primaryButtonStyles, splitButtonStyles, customStyles)!;
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
index 376fcab34c308..74a64ece7403f 100644
--- a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
@@ -21,7 +21,7 @@ export class PrimaryButton extends BaseComponent<IButtonProps, {}> {
         { ...this.props }
         variantClassName='ms-Button--primary'
         onRenderDescription={ nullRender }
-        styles={ getStyles(theme, styles) }
+        styles={ getStyles(theme!, styles) }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
index d2428e8a6bdd4..7801eb303669e 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
@@ -62,5 +62,5 @@ export const getStyles = memoizeFunction((
     },
   };
 
-  return mergeStyleSets(iconButtonStyles, customStyles);
+  return mergeStyleSets(iconButtonStyles, customStyles)!;
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
index a9ab0846342f4..76072ba210c59 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
@@ -12,7 +12,7 @@ export interface IButtonSwapExampleState {
 }
 
 export class ButtonSwapExample extends React.Component<IButtonProps, IButtonSwapExampleState> {
-  private buttonRef: HTMLElement;
+  private buttonRef: HTMLElement | null;
   private hasFocus: boolean;
 
   public constructor() {
@@ -34,7 +34,7 @@ export class ButtonSwapExample extends React.Component<IButtonProps, IButtonSwap
     // if our button previously had focus but we lost it
     // because we switched the control type, we need to set focus again
     if (this.hasFocus && document.activeElement !== this.buttonRef) {
-      this.buttonRef.focus();
+      this.buttonRef!.focus();
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index be54d5c6e9a8b..68ad078fea24c 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -143,7 +143,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
               </tr>
             </thead>
             <tbody>
-              { weeks.map((week, weekIndex) =>
+              { weeks!.map((week, weekIndex) =>
                 <tr key={ weekIndex }>
                   { week.map((day, dayIndex) =>
                     <td key={ day.key }>
@@ -164,10 +164,10 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
                         aria-selected={ day.isSelected }
                         aria-label={ day.originalDate.toLocaleString ?
                           day.originalDate.toLocaleString([], { day: 'numeric', month: 'long', year: 'numeric' }) : day.originalDate.getDate() }
-                        id={ compareDates(navigatedDate, day.originalDate) ? activeDescendantId : null }
+                        id={ compareDates(navigatedDate, day.originalDate) ? activeDescendantId : undefined }
                         data-is-focusable={ true }
-                        ref={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : null }
-                        key={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : null } >
+                        ref={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : undefined }
+                        key={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : undefined } >
                         <span aria-hidden='true'>{ day.date }</span>
                       </div>
                     </td>
@@ -192,7 +192,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
     if (weekIndex === 0 && ev.which === KeyCodes.up) {
       this.props.onNavigateDate(addWeeks(date, -1), true);
       ev.preventDefault();
-    } else if (weekIndex === (this.state.weeks.length - 1) && ev.which === KeyCodes.down) {
+    } else if (weekIndex === (this.state.weeks!.length - 1) && ev.which === KeyCodes.down) {
       this.props.onNavigateDate(addWeeks(date, 1), true);
       ev.preventDefault();
     } else if (dayIndex === 0 && ev.which === getRTLSafeKeyCode(KeyCodes.left)) {
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
index c89d49711cdb0..c2f523aa37e9c 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
@@ -85,14 +85,14 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
                   css('ms-DatePicker-monthOption',
                     styles.monthOption,
                     {
-                      ['ms-DatePicker-day--today ' + styles.monthIsCurrentMonth]: highlightCurrentMonth && this.isCurrentMonth(index, navigatedDate.getFullYear(), today)
+                      ['ms-DatePicker-day--today ' + styles.monthIsCurrentMonth]: highlightCurrentMonth && this.isCurrentMonth(index, navigatedDate.getFullYear(), today!)
                     })
                 }
                 key={ index }
                 onClick={ this._selectMonthCallbacks[index] }
                 aria-label={ setMonth(navigatedDate, index).toLocaleString([], { month: 'long', year: 'numeric' }) }
                 data-is-focusable={ true }
-                ref={ navigatedDate.getMonth() === index ? 'navigatedMonth' : null }
+                ref={ navigatedDate.getMonth() === index ? 'navigatedMonth' : undefined }
               >
                 { month }
               </span>
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
index 062fdb7d59cb2..097bffdf9a506 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
@@ -62,7 +62,7 @@ const DayPickerStrings = {
 
 export interface ICalendarButtonExampleState {
   showCalendar: boolean;
-  selectedDate: Date;
+  selectedDate: Date | null;
 }
 
 export class CalendarButtonExample extends React.Component<any, ICalendarButtonExampleState> {
@@ -105,7 +105,7 @@ export class CalendarButtonExample extends React.Component<any, ICalendarButtonE
               onSelectDate={ this._onSelectDate }
               onDismiss={ this._onDismiss }
               isMonthPickerVisible={ true }
-              value={ this.state.selectedDate }
+              value={ this.state.selectedDate! }
               firstDayOfWeek={ DayOfWeek.Sunday }
               strings={ DayPickerStrings }
             >
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
index 0a56acb432052..9ba8d605f55ef 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
@@ -62,8 +62,8 @@ const DayPickerStrings = {
 };
 
 export interface ICalendarInlineExampleState {
-  selectedDate: Date;
-  selectedDateRange: Date[];
+  selectedDate: Date | null;
+  selectedDateRange: Date[] | null;
 }
 
 export interface ICalendarInlineExampleProps {
@@ -101,7 +101,7 @@ export class CalendarInlineExample extends React.Component<ICalendarInlineExampl
       margin: '0 10px 0 0'
     };
 
-    let dateRangeString: string = null;
+    let dateRangeString: string | null = null;
     if (this.state.selectedDateRange != null) {
       let rangeStart = this.state.selectedDateRange[0];
       let rangeEnd = this.state.selectedDateRange[this.state.selectedDateRange.length - 1];
@@ -124,7 +124,7 @@ export class CalendarInlineExample extends React.Component<ICalendarInlineExampl
           dateRangeType={ this.props.dateRangeType }
           autoNavigateOnSelection={ this.props.autoNavigateOnSelection }
           showGoToToday={ this.props.showGoToToday }
-          value={ this.state.selectedDate }
+          value={ this.state.selectedDate! }
           firstDayOfWeek={ DayOfWeek.Sunday }
           strings={ DayPickerStrings }
           highlightCurrentMonth={ this.props.highlightCurrentMonth }
@@ -169,7 +169,7 @@ export class CalendarInlineExample extends React.Component<ICalendarInlineExampl
     this.setState((prevState: ICalendarInlineExampleState) => {
       let selectedDate = prevState.selectedDate || new Date();
       let dateRangeArray = getDateRangeArray(selectedDate, this.props.dateRangeType, DayOfWeek.Sunday);
-      let newSelectedDate = addDays(dateRangeArray.pop(), 1);
+      let newSelectedDate = addDays(dateRangeArray.pop()!, 1);
       return prevState.selectedDate = newSelectedDate;
     });
   }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
index 3d427be6c5f16..c6e7aca0cdd5e 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
@@ -50,7 +50,7 @@ export class CalloutCoverExample extends React.Component<any, ICalloutCoverExamp
         <div className='ms-CalloutExample-configArea'>
           <Dropdown
             label='Directional hint'
-            selectedKey={ DirectionalHint[directionalHint] }
+            selectedKey={ DirectionalHint[directionalHint!] }
             options={ DIRECTION_OPTIONS }
             onChanged={ this._onDirectionalChanged } />
         </div>
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
index 668b8bf97ab13..347773a68c3fd 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
@@ -66,7 +66,7 @@ export class CalloutDirectionalExample extends React.Component<any, ICalloutDire
               onChange={ this._onBeakWidthSlider } />) }
           <Dropdown
             label='Directional hint'
-            selectedKey={ DirectionalHint[directionalHint] }
+            selectedKey={ DirectionalHint[directionalHint!] }
             options={ DIRECTION_OPTIONS }
             onChanged={ this._onDirectionalChanged } />
         </div>
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
index b389a091517e9..872e7e17c7438 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
@@ -118,5 +118,5 @@ export const getStyles = memoizeFunction((
     }
   };
 
-  return mergeStyleSets(styles, customStyles);
+  return mergeStyleSets(styles, customStyles)!;
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
index a864a45d07e68..9baddbb8f5cb1 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
@@ -89,11 +89,11 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
     const isReversed = boxSide !== 'start' ? true : false;
 
     const classNames = this._getClassNames(
-      getStyles(theme, customStyles),
-      className,
-      disabled,
-      isChecked,
-      isReversed
+      getStyles(theme!, customStyles),
+      className!,
+      disabled!,
+      isChecked!,
+      isReversed!
     );
 
     return (
@@ -125,7 +125,7 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
   }
 
   public get checked(): boolean {
-    return this.state.isChecked;
+    return this.state.isChecked!;
   }
 
   public focus(): void {
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
index 48647f2167cd4..61af4d7df03be 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
@@ -65,7 +65,7 @@ export class CheckboxBasicExample extends React.Component<{}, ICheckboxBasicExam
           label='Controlled checkbox'
           checked={ isChecked }
           onChange={ (ev, checked) => {
-            this.setState({ isChecked: checked });
+            this.setState({ isChecked: checked! });
           } }
           styles={ styles }
         />
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Custom.Example.tsx
index a4632bca11b1c..39025c701f4ef 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Custom.Example.tsx
@@ -23,7 +23,7 @@ export class ChoiceGroupCustomExample extends React.Component<any, any> {
               onRenderField: (props, render) => {
                 return (
                   <div className={ css(styles.root) }>
-                    { render(props) }
+                    { render!(props) }
                     <Dropdown
                       className={ css(styles.dropdown) }
                       defaultSelectedKey='A'
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
index b821c5d41c4d1..127e073d58faf 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
@@ -132,7 +132,7 @@ export interface IComboBoxStyles {
   /**
    * Styles for the caret down button.
    */
-  caretDownButtonStyles: Partial<IComboBoxCaretDownButtonStyles>;
+  caretDownButtonStyles: Partial<IComboBoxCaretDownButtonStyles> | null;
 
   /**
    * Styles for the error Message text of the comboBox.
@@ -164,7 +164,7 @@ export interface IComboBoxStyles {
    * Default styles that should be applied to ComboBox options,
    * incase an option does not come with user-defined custom styles
    */
-  optionDefaultStyles: Partial<IComboBoxOptionStyles>;
+  optionDefaultStyles: Partial<IComboBoxOptionStyles> | null;
 }
 
 export interface IComboBoxOptionStyles extends IButtonStyles {
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
index f6a677a3a1b9c..837c4abdf7b44 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
@@ -125,7 +125,7 @@ describe('ComboBox', () => {
     let buttonElement = comboBoxRoot.find('button');
     buttonElement.simulate('click');
     let secondItemElement = wrapper.getDOMNode().ownerDocument.querySelector('.ms-ComboBox-option[data-index="1"]');
-    ReactTestUtils.Simulate.click(secondItemElement);
+    ReactTestUtils.Simulate.click(secondItemElement!);
     let inputElement = comboBoxRoot.find('input');
     expect(inputElement.props().value).equals('2');
   });
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 2bf0793e63ea8..a5769034724c8 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -18,7 +18,7 @@ import {
   getNativeProps,
   KeyCodes,
 } from '../../Utilities';
-import { SelectableOptionMenuItemType } from '../../utilities/selectableOption/SelectableOption.Props';
+import { SelectableOptionMenuItemType, ISelectableOption } from '../../utilities/selectableOption/SelectableOption.Props';
 
 import {
   customizable,
@@ -225,8 +225,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     let hasErrorMessage = (errorMessage && errorMessage.length > 0) ? true : false;
 
     this._classNames = getClassNames(
-      getStyles(theme, customStyles),
-      className,
+      getStyles(theme!, customStyles),
+      className!,
       !!isOpen,
       !!disabled,
       !!required,
@@ -286,7 +286,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         </div>
 
         { isOpen && (
-          onRenderContainer({ ...this.props as any }, this._onRenderContainer)
+          (onRenderContainer as any)({ ...this.props as any }, this._onRenderContainer)
         ) }
         {
           errorMessage &&
@@ -759,7 +759,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         setInitialFocus={ false }
       >
         <div ref={ this._resolveRef('_comboBoxMenu') } style={ { width: this._comboBoxWrapper.clientWidth - 2 } }>
-          { onRenderList({ ...props as any }, this._onRenderList) }
+          { (onRenderList as any)({ ...props }, this._onRenderList) }
         </div>
       </Callout>
     );
@@ -782,7 +782,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         aria-labelledby={ id + '-label' }
         role='listbox'
       >
-        { this.state.currentOptions.map((item, index) => onRenderItem({ ...item, index }, this._onRenderItem)) }
+        { this.state.currentOptions.map((item, index) => onRenderItem({ ...item, index } as ISelectableOption, this._onRenderItem)) }
       </div>
     );
   }
@@ -1245,7 +1245,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     const { styles: customStyles } = this.props;
     const caretButtoncustomStyles = customStyles ? customStyles.caretDownButtonStyles : null;
 
-    return getCaretDownButtonStyles(this.props.theme, caretButtoncustomStyles);
+    return getCaretDownButtonStyles(this.props.theme!, caretButtoncustomStyles!);
   }
 
   /**
@@ -1259,6 +1259,6 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
     const isSelected: boolean = this._isOptionSelected(item.index);
 
-    return getOptionStyles(this.props.theme, customStylesForAllOptions, customStylesForCurrentOption);
+    return getOptionStyles(this.props.theme!, customStylesForAllOptions!, customStylesForCurrentOption);
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
index 75651cd447293..53b8e97bb4bbc 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
@@ -171,7 +171,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
       // add a default fallback font
       newFontFamily += ',"Segoe UI",Tahoma,Sans-Serif';
 
-      this._fontMapping = assign({}, this._fontMapping, { [fontFamily]: newFontFamily });
+      this._fontMapping = assign({}, this._fontMapping, { [fontFamily as string]: newFontFamily });
       fontFamily = newFontFamily;
     }
 
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
index 0d17cc2f2fadb..f49de3b897550 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
@@ -224,7 +224,7 @@ describe('CommandBar', () => {
       expect(document.querySelector('.SubMenuClass')).to.exist;
 
       // Update the props, and re-render
-      items[0].subMenuProps.items[0].className = 'SubMenuClassUpdate';
+      items[0].subMenuProps!.items[0].className = 'SubMenuClassUpdate';
 
       renderedContent = ReactDOM.render(
         <CommandBar
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
index b5ced85cb4061..c96061813cbf9 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
@@ -83,7 +83,7 @@ export class CommandBarCustomizationExample extends React.Component<{}, ISplitDr
             className={ dropDownButtonClass }
             menuProps={ {
               className: css('ms-CommandBar-menuHost'),
-              items: item.subMenuProps.items
+              items: item.subMenuProps!.items
             } } />
         </div>
       </div >
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 93a81ee9fdbad..62cbb737d1905 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -95,7 +95,7 @@ export function getSubmenuItems(item: IContextualMenuItem) {
  * @returns {false} if the item is unchecked.
  * @returns {null} if the item is not checkable.
  */
-function getIsChecked(item: IContextualMenuItem): boolean | null {
+function getIsChecked(item: IContextualMenuItem): boolean | null | undefined {
   if (item.canCheck) {
     return item.isChecked || item.checked;
   }
@@ -370,7 +370,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       ariaLabel = item.name;
     }
 
-    const isChecked: boolean | null = getIsChecked(item);
+    const isChecked: boolean | null | undefined = getIsChecked(item);
     const canCheck: boolean = isChecked !== null;
 
     const itemButtonProperties = {
@@ -396,11 +396,11 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     return React.createElement(
       'button',
       assign({}, getNativeProps(item, buttonProperties), itemButtonProperties),
-      this._renderMenuItemChildren(item, index, hasCheckmarks, hasIcons));
+      this._renderMenuItemChildren(item, index, hasCheckmarks!, hasIcons!));
   }
 
   private _renderMenuItemChildren(item: IContextualMenuItem, index: number, hasCheckmarks: boolean, hasIcons: boolean) {
-    const isItemChecked: boolean | null = getIsChecked(item);
+    const isItemChecked: boolean | null | undefined = getIsChecked(item);
     return (
       <div className={ css('ms-ContextualMenu-linkContent', styles.linkContent) }>
         { (hasCheckmarks) ? (
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
index da10033a85e32..f071c5d8692c3 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
@@ -90,7 +90,7 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
               onChange={ this._onBeakWidthSlider } />) }
           <Dropdown
             label='Directional hint'
-            selectedKey={ DirectionalHint[directionalHint] }
+            selectedKey={ DirectionalHint[directionalHint!] }
             options={ DIRECTION_OPTIONS }
             onChanged={ this._onDirectionalChanged } />
           { getRTL() &&
@@ -99,7 +99,7 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
           { getRTL() &&
             <Dropdown
               label='Directional hint for RTL'
-              selectedKey={ DirectionalHint[directionalHintForRTL] }
+              selectedKey={ DirectionalHint[directionalHintForRTL!] }
               options={ DIRECTION_OPTIONS }
               onChanged={ this._onDirectionalRtlChanged }
               disabled={ !useDirectionalHintForRtl } />
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx
index 2203a8656167b..c48d5814a4737 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx
@@ -111,7 +111,7 @@ export class DatePickerBasicExample extends React.Component<any, IDatePickerBasi
               key: DayOfWeek[DayOfWeek.Saturday]
             }
           ] }
-          selectedKey={ DayOfWeek[firstDayOfWeek] }
+          selectedKey={ DayOfWeek[firstDayOfWeek!] }
           onChanged={ this._onDropdownChanged.bind(this) }
         />
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx
index 5999a562e3963..91e98d0924143 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx
@@ -66,7 +66,7 @@ const DayPickerStrings: IDatePickerStrings = {
 
 export interface IDatePickerInputExampleState {
   firstDayOfWeek?: DayOfWeek;
-  value?: Date;
+  value?: Date | null;
 }
 
 export class DatePickerInputExample extends React.Component<any, IDatePickerInputExampleState> {
@@ -92,7 +92,7 @@ export class DatePickerInputExample extends React.Component<any, IDatePickerInpu
           ariaLabel={ desc }
           firstDayOfWeek={ firstDayOfWeek }
           strings={ DayPickerStrings }
-          value={ value }
+          value={ value! }
           onSelectDate={ date => this.setState({ value: date }) }
         />
         <DefaultButton onClick={ () => this.setState({ value: null }) } text='Clear' />
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
index 76b256c652920..c93e492d66d6d 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
@@ -52,7 +52,7 @@ export class DetailsRowFields extends BaseComponent<IDetailsRowFieldsProps, IDet
               [styles.isPadded]: column.isPadded,
               [styles.isMultiline]: column.isMultiline
             }) }
-            style={ { width: column.calculatedWidth + INNER_PADDING + (column.isPadded ? ISPADDED_WIDTH : 0) } }
+            style={ { width: column.calculatedWidth! + INNER_PADDING + (column.isPadded ? ISPADDED_WIDTH : 0) } }
             data-automationid='DetailsRowCell'
             data-automation-key={ column.key }>
             { cellContent[columnIndex] }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx
index 4d46418f984aa..314e52208a4d2 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx
@@ -67,7 +67,7 @@ export class DetailsListDragDropExample extends React.Component<any, any> {
       },
       onDragStart: (item?: any, itemIndex?: number, selectedItems?: any[], event?: MouseEvent) => {
         _draggedItem = item;
-        _draggedIndex = itemIndex;
+        _draggedIndex = itemIndex!;
       },
       onDragEnd: (item?: any, event?: DragEvent) => {
         _draggedItem = null;
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx
index 56f04b24fb54f..c3e73a46a491e 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx
@@ -60,7 +60,7 @@ export class DialogContent extends BaseComponent<IDialogContentProps, IDialogCon
         <div className={ css('ms-Dialog-header', styles.header) }>
           <p className={ css('ms-Dialog-title', styles.title) } id={ id + '-title' } role='heading'>{ title }</p>
           <div className={ css('ms-Dialog-topButton', styles.topButton) }>
-            { this.props.topButtonsProps.map((props) => (
+            { this.props.topButtonsProps!.map((props) => (
               <IconButton {...props} />
             )) }
             { showCloseButton && type !== DialogType.largeHeader &&
@@ -71,7 +71,7 @@ export class DialogContent extends BaseComponent<IDialogContentProps, IDialogCon
                 ) }
                 iconProps={ { iconName: 'Cancel' } }
                 ariaLabel={ closeButtonAriaLabel }
-                onClick={ onDismiss }
+                onClick={ onDismiss as any }
               />
             }
           </div>
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx
index 9c82c4e25b639..874f685fb1c55 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx
@@ -18,7 +18,7 @@ export class DocumentCard extends BaseComponent<IDocumentCardProps, any> {
     super(props);
 
     this._warnDeprecations({
-      accentColor: null
+      accentColor: undefined
     });
   }
 
@@ -35,8 +35,8 @@ export class DocumentCard extends BaseComponent<IDocumentCardProps, any> {
     }
 
     // if this element is actionable it should have an aria role
-    let role = actionable ? (onClick ? 'button' : 'link') : null;
-    let tabIndex = actionable ? 0 : null;
+    let role = actionable ? (onClick ? 'button' : 'link') : undefined;
+    let tabIndex = actionable ? 0 : undefined;
 
     return (
       <div
@@ -53,8 +53,8 @@ export class DocumentCard extends BaseComponent<IDocumentCardProps, any> {
             className
           )
         }
-        onKeyDown={ actionable ? this._onKeyDown : null }
-        onClick={ actionable ? this._onClick : null }
+        onKeyDown={ actionable ? this._onKeyDown : undefined }
+        onClick={ actionable ? this._onClick : undefined }
         style={ style }>
         { children }
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActions.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActions.tsx
index 0b3dcf1744b48..76f0363781f03 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActions.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActions.tsx
@@ -21,7 +21,7 @@ export class DocumentCardActions extends BaseComponent<IDocumentCardActionsProps
           );
         }) }
 
-        { views > 0 && (
+        { views! > 0 && (
           <div className={ css('ms-DocumentCardActions-views', styles.views) }>
             <Icon iconName='View' />
             { views }
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx
index e44cc29c8c73c..a373470d16f9d 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx
@@ -122,8 +122,8 @@ export class DocumentCardTitle extends BaseComponent<IDocumentCardTitleProps, ID
       }
 
       this.setState({
-        truncatedTitleFirstPiece: truncatedTitleFirstPiece.slice(0, truncatedTitleFirstPiece.length - 1),
-        truncatedTitleSecondPiece: truncatedTitleSecondPiece.slice(1)
+        truncatedTitleFirstPiece: truncatedTitleFirstPiece!.slice(0, truncatedTitleFirstPiece!.length - 1),
+        truncatedTitleSecondPiece: truncatedTitleSecondPiece!.slice(1)
       });
     }
   }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index ed7e3a7e290f8..00c784e4e57d5 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -141,9 +141,9 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
           aria-owns={ isOpen ? id + '-list' : null }
           { ...divProps }
           className={ css('ms-Dropdown', styles.root, className, {
-            'is-open': isOpen,
-            ['is-disabled ' + styles.rootIsDisabled]: disabled,
-            'is-required ': required,
+            'is-open': isOpen!,
+            ['is-disabled ' + styles.rootIsDisabled]: disabled!,
+            'is-required ': required!,
           }) }
           onBlur={ this._onDropdownBlur }
           onKeyDown={ this._onDropdownKeyDown }
@@ -443,8 +443,8 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
         return;
       }
     }
-    let newIndex: number;
-    const { selectedIndex } = this.state;
+    let newIndex: number | undefined;
+    const selectedIndex = this.state.selectedIndex!;
 
     switch (ev.which) {
       case KeyCodes.enter:
diff --git a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
index c18992650456c..01ad2c39d8941 100644
--- a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
+++ b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
@@ -60,7 +60,7 @@ export class Fabric extends BaseComponent<IFabricProps, IFabricState> {
 
   public render() {
     const { isFocusVisible } = this.state;
-    const styles = getStyles(this.props.theme);
+    const styles = getStyles(this.props.theme!);
 
     const rootClass = css(
       'ms-Fabric',
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
index f9d3f829bec90..90bcfba545f9b 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
@@ -76,7 +76,7 @@ export class FacepileBasicExample extends React.Component<any, IFacepileBasicExa
           checked={ this.state.imagesFadeIn }
           onChange={ (ev, checked) => {
             this.setState((prevState: IFacepileBasicExampleState) => {
-              prevState.imagesFadeIn = checked;
+              prevState.imagesFadeIn = checked!;
               return prevState;
             });
           } }
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
index 50579564e83ba..434fb18309a4e 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
@@ -129,11 +129,11 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
     const _lastFocusableChild = getLastFocusable(root, root.lastChild as HTMLElement, true);
 
     if (ev.shiftKey && _firstFocusableChild === ev.target) {
-      _lastFocusableChild.focus();
+      _lastFocusableChild!.focus();
       ev.preventDefault();
       ev.stopPropagation();
     } else if (!ev.shiftKey && _lastFocusableChild === ev.target) {
-      _firstFocusableChild.focus();
+      _firstFocusableChild!.focus();
       ev.preventDefault();
       ev.stopPropagation();
     }
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
index 69861daf241b4..3a56238f85fde 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
@@ -12,7 +12,7 @@ import { FocusZoneDirection } from './FocusZone.Props';
 import { assert } from 'chai';
 
 describe('FocusZone', () => {
-  let lastFocusedElement: HTMLElement;
+  let lastFocusedElement: HTMLElement | undefined;
 
   function _onFocus(ev: any) {
     lastFocusedElement = ev.target;
@@ -591,8 +591,9 @@ describe('FocusZone', () => {
   });
 
   it('Focus first tabbable element, when active elemet is dynamically disabled', () => {
-    let focusZone: FocusZone = null;
-    let buttonA: any, buttonB = null;
+    let focusZone: FocusZone | null = null;
+    let buttonA: any;
+    let buttonB: any;
     const component = ReactTestUtils.renderIntoDocument(
       <div { ...{ onFocusCapture: _onFocus } }>
         <textarea className='t'></textarea>
@@ -626,7 +627,7 @@ describe('FocusZone', () => {
     });
 
     // ButtonA should be focussed.
-    focusZone.focus();
+    focusZone!.focus();
     assert(lastFocusedElement === buttonA, 'buttonA was not focused');
 
     buttonA.disabled = true;
@@ -636,7 +637,7 @@ describe('FocusZone', () => {
     assert(lastFocusedElement === textArea, 'textArea was not focused');
 
     // ButtonB should be focussed.
-    focusZone.focus();
+    focusZone!.focus();
     assert(lastFocusedElement === buttonB, 'buttonB was not focused ');
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.List.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.List.Example.tsx
index aa6a53bc7a8eb..1c3d74f73d4a4 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.List.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.List.Example.tsx
@@ -13,7 +13,7 @@ import './FocusZone.List.Example.scss';
 const ITEMS = createArray(10, (index) => ({
   key: index,
   name: 'Item-' + index,
-  url: 'http://placehold.it/100x' + (200 + index)
+  url: 'http://placehold.it/100x' + (200 + index!)
 }));
 
 const COLUMNS: IColumn[] = [
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.tsx
index 3314b55980982..28f82171a1ca4 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.tsx
@@ -11,20 +11,23 @@ import * as stylesImport from './GroupFooter.scss';
 const styles: any = stylesImport;
 
 export class GroupFooter extends BaseComponent<IGroupDividerProps, {}> {
-  public render() {
+  public render(): JSX.Element | null {
     let { group, groupLevel, showAllLinkText } = this.props;
 
-    return group && (
-      <div className={ css('ms-groupFooter', styles.root) }>
-        { GroupSpacer({ count: groupLevel }) }
-        <Link onClick={ this._onSummarizeClick }>{ showAllLinkText }</Link>
-      </div>
-    );
+    if (group) {
+      return (
+        <div className={ css('ms-groupFooter', styles.root) }>
+          { GroupSpacer({ count: groupLevel! }) }
+          <Link onClick={ this._onSummarizeClick }>{ showAllLinkText }</Link>
+        </div>
+      );
+    }
+    return null;
   }
 
   @autobind
   private _onSummarizeClick(ev: React.MouseEvent<HTMLElement>) {
-    this.props.onToggleSummarize(this.props.group);
+    this.props.onToggleSummarize!(this.props.group!);
 
     ev.stopPropagation();
     ev.preventDefault();
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx
index 802a194cbe231..018f2c5090c7b 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx
@@ -52,8 +52,8 @@ export class GroupedListCustomExample extends React.Component<any, any> {
   private _onRenderHeader(props: IGroupDividerProps): JSX.Element {
     return (
       <div className={ css('ms-GroupedListExample-header', FontClassNames.xLarge) }>
-        This is a custom header for { props.group.name }
-        &nbsp;(<Link onClick={ () => props.onToggleCollapse(props.group) }>{ props.group.isCollapsed ? 'Expand' : 'Collapse' }</Link>)
+        This is a custom header for { props.group!.name }
+        &nbsp;(<Link onClick={ () => props.onToggleCollapse!(props.group!) }>{ props.group!.isCollapsed ? 'Expand' : 'Collapse' }</Link>)
       </div>
     );
   }
@@ -61,7 +61,7 @@ export class GroupedListCustomExample extends React.Component<any, any> {
   private _onRenderFooter(props: IGroupDividerProps): JSX.Element {
     return (
       <div className={ css('ms-GroupedListExample-footer', FontClassNames.xLarge) }>
-        This is a custom footer for { props.group.name }
+        This is a custom footer for { props.group!.name }
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts
index b8f0cfe783a45..90c3e87c86a34 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts
@@ -25,7 +25,7 @@ export interface IExpandingCardProps extends React.HTMLAttributes<HTMLDivElement
   /**
    *  Render function to populate compact content area
    */
-  onRenderCompactCard: IRenderFunction<IExpandingCardProps>;
+  onRenderCompactCard?: IRenderFunction<IExpandingCardProps>;
 
   /**
    *  Render function to populate expanded content area
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
index 7e1f6a1e19539..f798f4605e48f 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
@@ -49,5 +49,5 @@ export const getStyles = memoizeFunction((
     }
   };
 
-  return mergeStyleSets(styles, customStyles);
+  return mergeStyleSets(styles, customStyles)!;
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
index ed064d7bddf79..de799b05dd150 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
@@ -99,7 +99,7 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
   private _onRenderCompactCard(): JSX.Element {
     return (
       <div className={ mergeStyles(this._styles.compactCard, { height: this.props.compactCardHeight + 'px' }) as string }>
-        { this.props.onRenderCompactCard(this.props.renderData) }
+        { this.props.onRenderCompactCard!(this.props.renderData) }
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.styles.ts b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.styles.ts
index f8f518756e881..2887b298c51bd 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.styles.ts
@@ -12,5 +12,5 @@ export const getStyles = memoizeFunction((
     host: {}
   };
 
-  return mergeStyleSets(styles, customStyles);
+  return mergeStyleSets(styles, customStyles)!;
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
index e2804e63edb3e..6394f0694c3b5 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
@@ -52,7 +52,7 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
           this.setState({
             mode: ExpandingCardMode.expanded
           });
-        }, this.props.expandedCardOpenDelay);
+        }, this.props.expandedCardOpenDelay!);
       } else {
         this.setState({
           mode: ExpandingCardMode.compact
@@ -76,6 +76,10 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
 
     this._styles = getStyles(customStyles);
 
+    let onClick;
+    if (instantOpenOnClick) {
+      onClick = this._instantOpenExpanded;
+    }
     return (
       <div
         className={ css(this._styles.host) }
@@ -84,7 +88,7 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
         onBlurCapture={ this._cardDismiss }
         onMouseEnter={ this._cardOpen }
         onMouseLeave={ this._cardDismiss }
-        onClick={ instantOpenOnClick && this._instantOpenExpanded }
+        onClick={ onClick }
         aria-describedby={ setAriaDescribedBy && isHoverCardVisible ? hoverCardId : undefined }
       >
         { children }
@@ -119,7 +123,7 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
           mode: ExpandingCardMode.compact
         });
       }
-    }, this.props.cardOpenDelay);
+    }, this.props.cardOpenDelay!);
   }
 
   // Hide HoverCard
@@ -135,7 +139,7 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
           mode: ExpandingCardMode.compact
         });
       }
-    }, this.props.cardDismissDelay);
+    }, this.props.cardDismissDelay!);
   }
 
   // Instant Open the card in Expanded mode
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx
index 7fe73a78ce708..a149884c89971 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx
@@ -39,7 +39,7 @@ export class HoverCardBasicExample extends BaseComponent<{}, IHoverCardExampleSt
         <p> Hover over location of a row item to see the card </p>
         <DetailsList
           setKey='hoverSet'
-          items={ items }
+          items={ items! }
           columns={ columns }
           onRenderItemColumn={ this._onRenderItemColumn }
         />
@@ -87,7 +87,7 @@ export class HoverCardBasicExample extends BaseComponent<{}, IHoverCardExampleSt
         { item.description }
         <DetailsList
           setKey='expandedCardSet'
-          items={ items }
+          items={ items! }
           columns={ columns }
         />
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.styles.ts b/packages/office-ui-fabric-react/src/components/Icon/Icon.styles.ts
index ae37d597b1a03..378dd6b49bfcf 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.styles.ts
@@ -11,7 +11,7 @@ import { IIconStyles } from './Icon.Props';
 
 export const getStyles = memoizeFunction((
   theme: ITheme = getTheme(),
-  customStyles: IIconStyles = undefined
+  customStyles: IIconStyles | undefined = undefined
 ): IIconStyles => {
   let iconStyles = {
 
@@ -27,5 +27,5 @@ export const getStyles = memoizeFunction((
     })
   };
 
-  return mergeStyleSets(iconStyles, customStyles);
+  return mergeStyleSets(iconStyles, customStyles)!;
 });
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.tsx
index 8071bec25e8b9..ac2383b5fd8ac 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.tsx
@@ -67,7 +67,7 @@ export class Image extends BaseComponent<IImageProps, IImageState> {
     this._checkImageLoaded();
     if (this.props.onLoadingStateChange
       && prevState.loadState !== this.state.loadState) {
-      this.props.onLoadingStateChange(this.state.loadState);
+      this.props.onLoadingStateChange(this.state.loadState!);
     }
   }
 
@@ -148,7 +148,7 @@ export class Image extends BaseComponent<IImageProps, IImageState> {
       // for some browsers, SVG images do not have a naturalWidth or naturalHeight, so fall back
       // to checking .complete for these images.
       let isLoaded: boolean = src && this._imageElement && (this._imageElement.naturalWidth > 0 && this._imageElement.naturalHeight > 0) ||
-        (this._imageElement.complete && Image._svgRegex.test(src));
+        (this._imageElement.complete && Image._svgRegex.test(src!));
 
       if (isLoaded) {
         this._computeCoverStyle(this.props);
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.test.tsx b/packages/office-ui-fabric-react/src/components/Layer/Layer.test.tsx
index 9a85b3ea0d8b4..27c4c3a5ee129 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/Layer.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.test.tsx
@@ -70,9 +70,9 @@ describe('Layer', () => {
       let parentElement = appElement.querySelector('#parent');
 
       expect(parentElement).is.not.empty;
-      expect(parentElement.ownerDocument).is.not.empty;
+      expect(parentElement!.ownerDocument).is.not.empty;
 
-      let childElement = appElement.querySelector('#child');
+      let childElement = appElement.querySelector('#child') as Element;
 
       expect(childElement.textContent).equals('foo');
     } finally {
diff --git a/packages/office-ui-fabric-react/src/components/Layer/LayerHost.tsx b/packages/office-ui-fabric-react/src/components/Layer/LayerHost.tsx
index 3f8b26eb8215f..4d037845aff5e 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/LayerHost.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/LayerHost.tsx
@@ -15,11 +15,11 @@ export class LayerHost extends BaseComponent<ILayerHostProps, {}> {
   }
 
   public componentDidMount() {
-    Layer.notifyHostChanged(this.props.id);
+    Layer.notifyHostChanged(this.props.id!);
   }
 
   public componentWillUnmount() {
-    Layer.notifyHostChanged(this.props.id);
+    Layer.notifyHostChanged(this.props.id!);
   }
 
   public render() {
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
index abd60d35c27ab..bace0b5a958d2 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
@@ -56,7 +56,7 @@ export class MarqueeSelectionBasicExample extends React.Component<{}, IMarqueeSe
         <Checkbox
           label='Is marquee enabled'
           defaultChecked={ true }
-          onChange={ (ev, isMarqueeEnabled) => this.setState({ isMarqueeEnabled }) } />
+          onChange={ (ev, isMarqueeEnabled) => this.setState({ isMarqueeEnabled: isMarqueeEnabled! }) } />
         <p>Drag a rectangle around the items below to select them:</p>
         <ul className='ms-MarqueeSelectionBasicExample-photoList'>
           { PHOTOS.map((photo, index) => (
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Basic.Example.tsx
index 87e2fc18e1a2c..44c7a5eb5fda6 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Basic.Example.tsx
@@ -52,8 +52,8 @@ export class OverflowSetBasicExample extends BaseComponent<any, any> {
             <IconButton
               className={ css(styles.overflowButton) }
               iconProps={ { iconName: 'More' } }
-              menuIconProps={ null }
-              menuProps={ { items: overflowItems } }
+              menuIconProps={ undefined }
+              menuProps={ { items: overflowItems! } }
             />
           );
         } }
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx
index e976fd6aaaedb..3e1098626ebdf 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx
@@ -115,8 +115,8 @@ export class OverflowSetCustomExample extends BaseComponent<any, any> {
             <DefaultButton
               className={ css(styles.overflowButton) }
               iconProps={ { iconName: 'More' } }
-              menuIconProps={ null }
-              menuProps={ { items: overflowItems } }
+              menuIconProps={ undefined }
+              menuProps={ { items: overflowItems! } }
             />
           );
         } }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
index dd32961f621bb..e444dbf0cad6b 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
@@ -110,7 +110,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
             !isOpen && isAnimating && AnimationClassNames.fadeOut200
           ) }
           isDarkThemed={ false }
-          onClick={ isLightDismiss ? this._onPanelClick : null }
+          onClick={ isLightDismiss ? this._onPanelClick : undefined }
         />
       );
     }
@@ -202,25 +202,27 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
   }
 
   @autobind
-  private _onRenderNavigation(props: IPanelProps): JSX.Element {
+  private _onRenderNavigation(props: IPanelProps): JSX.Element | null {
     const {
       closeButtonAriaLabel,
       hasCloseButton
     } = props;
-    return (
-      hasCloseButton &&
-      <IconButton
-        className={ css('ms-Panel-closeButton ms-PanelAction-close', styles.closeButton) }
-        onClick={ this._onPanelClick }
-        ariaLabel={ closeButtonAriaLabel }
-        data-is-visible={ true }
-        iconProps={ { iconName: 'Cancel' } }
-      />
-    );
+    if (hasCloseButton) {
+      return (
+        <IconButton
+          className={ css('ms-Panel-closeButton ms-PanelAction-close', styles.closeButton) }
+          onClick={ this._onPanelClick }
+          ariaLabel={ closeButtonAriaLabel }
+          data-is-visible={ true }
+          iconProps={ { iconName: 'Cancel' } }
+        />
+      );
+    }
+    return null;
   }
 
   @autobind
-  private _onRenderHeader(props: IPanelProps): JSX.Element {
+  private _onRenderHeader(props: IPanelProps): JSX.Element | null {
     const {
       headerText,
       componentId,
@@ -228,14 +230,16 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
     } = props;
 
     const { id } = this.state;
-    return (
-      headerText &&
-      <div className={ css('ms-Panel-header', styles.header) }>
-        <p className={ css('ms-Panel-headerText', styles.headerText, headerClassName) } id={ componentId + '-headerText' } role='heading'>
-          { headerText }
-        </p>
-      </div>
-    );
+    if (headerText) {
+      return (
+        <div className={ css('ms-Panel-header', styles.header) }>
+          <p className={ css('ms-Panel-headerText', styles.headerText, headerClassName) } id={ componentId + '-headerText' } role='heading'>
+            { headerText }
+          </p>
+        </div>
+      );
+    }
+    return null;
   }
 
   @autobind
@@ -254,17 +258,19 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
   }
 
   @autobind
-  private _onRenderFooter(props: IPanelProps): JSX.Element {
+  private _onRenderFooter(props: IPanelProps): JSX.Element | null {
     let { isFooterSticky } = this.state;
     let { onRenderFooterContent = null } = this.props;
-    return (
-      onRenderFooterContent != null &&
-      <div className={ css('ms-Panel-footer', styles.footer, isFooterSticky && styles.footerIsSticky) } >
-        <div className={ css('ms-Panel-footerInner', styles.footerInner) }>
-          { onRenderFooterContent() }
+    if (onRenderFooterContent != null) {
+      return (
+        <div className={ css('ms-Panel-footer', styles.footer, isFooterSticky && styles.footerIsSticky) } >
+          <div className={ css('ms-Panel-footerInner', styles.footerInner) }>
+            { onRenderFooterContent() }
+          </div>
         </div>
-      </div>
-    );
+      );
+    }
+    return null;
   }
 
   private _updateFooterPosition() {
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
index 3b83bb52a2d4e..d48588f178584 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
@@ -48,7 +48,7 @@ export class Pivot extends BaseComponent<IPivotProps, IPivotState> {
     super(props);
     this._pivotId = getId('Pivot');
     const links: IPivotItemProps[] = this._getPivotLinks(this.props);
-    let selectedKey: string;
+    let selectedKey: string | undefined;
 
     if (props.initialSelectedKey) {
       selectedKey = props.initialSelectedKey;
diff --git a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
index 9c254b82df0c0..3428f9068e0f7 100644
--- a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
+++ b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
@@ -28,7 +28,7 @@ export class Popup extends BaseComponent<IPopupProps, {}> {
   private _containsFocus: boolean;
 
   public componentWillMount() {
-    this._originalFocusedElement = getDocument().activeElement as HTMLElement;
+    this._originalFocusedElement = getDocument()!.activeElement as HTMLElement;
   }
 
   public componentDidMount(): void {
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx
index 6c5d3b9b414d1..cdeabedea3e49 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx
@@ -39,7 +39,7 @@ export class ProgressIndicator extends BaseComponent<IProgressIndicatorProps, {}
       label = title;
     }
 
-    percentComplete = Math.min(100, Math.max(0, percentComplete * 100));
+    percentComplete = Math.min(100, Math.max(0, percentComplete! * 100));
 
     return (
       <div className={ css('ms-ProgressIndicator', styles.root, className) }>
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
index af75263f42643..b695a039dcb96 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
@@ -579,7 +579,7 @@ describe('ResizeGroup', () => {
     // Set the initial window width
     getNextResizeGroupState(resizeGroupProps,
       {},
-      undefined,
+      sinon.stub(),
       initialWidth);
 
     // Pass in a state that reflects some rendered data
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
index 02e2c2c009b1b..cb71a46df6155 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
@@ -96,7 +96,7 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<{}, IResizeGrou
                 onRenderOverflowButton={ (overflowItems) => {
                   return (
                     <DefaultButton
-                      menuProps={ { items: overflowItems } }
+                      menuProps={ { items: overflowItems! } }
                     />
                   );
                 } }
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
index 5b80f519a1145..6365e1e172889 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
@@ -55,7 +55,7 @@ export class SearchBox extends BaseComponent<ISearchBoxProps, ISearchBoxState> {
         className={ css('ms-SearchBox', className, styles.root, {
           ['is-active ' + styles.rootIsActive]: hasFocus,
           ['is-disabled ' + styles.rootIsDisabled]: disabled,
-          ['can-clear ' + styles.rootCanClear]: value.length > 0,
+          ['can-clear ' + styles.rootCanClear]: value!.length > 0,
         }) }
         { ...{ onFocusCapture: this._onFocusCapture } }
       >
@@ -125,7 +125,7 @@ export class SearchBox extends BaseComponent<ISearchBoxProps, ISearchBoxState> {
         break;
 
       case KeyCodes.enter:
-        if (this.props.onSearch && this.state.value.length > 0) {
+        if (this.props.onSearch && this.state.value!.length > 0) {
           this.props.onSearch(this.state.value);
         }
         break;
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
index 24167c87bef42..bffdcc13ada61 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
@@ -174,7 +174,7 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     const sliderPositionRect: ClientRect = this.refs.sliderLine.getBoundingClientRect();
     const sliderLength: number = sliderPositionRect.width;
     const stepLength: number = sliderLength / steps;
-    let currentSteps: number;
+    let currentSteps: number | undefined;
 
     if (event.type === 'mousedown' || event.type === 'mousemove') {
       currentSteps = getRTL() ?
@@ -186,8 +186,8 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
         ((event as TouchEvent).touches[0].clientX - sliderPositionRect.left) / stepLength;
     }
 
-    let currentValue: number;
-    let renderedValue: number;
+    let currentValue: number | undefined;
+    let renderedValue: number | undefined;
 
     // The value shouldn't be bigger than max or be smaller than min.
     if (currentSteps! > Math.floor(steps)) {
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.test.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.test.tsx
index 5082232b0f95c..ec6a13120dccf 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.test.tsx
@@ -20,7 +20,7 @@ describe('TeachingBubble', () => {
     let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
     let titleElement = renderedDOM.querySelector('.ms-TeachingBubble-headline');
 
-    expect(titleElement.textContent).to.equal('Title');
+    expect(titleElement!.textContent).to.equal('Title');
   });
 
 });
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
index 7803c43140618..bd74a655aff48 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
@@ -349,7 +349,7 @@ describe('TextField', () => {
   });
 
   it('should select a range of text', () => {
-    let textField: TextField;
+    let textField: TextField | undefined;
     const initialValue = 'initial value';
 
     const onSelect = () => {
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
index 948b0dc643488..7b85516e0552e 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
@@ -92,9 +92,9 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
     const ariaLabel = isChecked ? onAriaLabel : offAriaLabel;
     const toggleNativeProps = getNativeProps(this.props, inputProperties, ['defaultChecked']);
     const classNames = this._getClassNames(
-      getStyles(theme, customStyles),
-      className,
-      disabled,
+      getStyles(theme!, customStyles),
+      className!,
+      disabled!,
       isChecked
     );
 
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
index 802fcb0c2307e..b085e7aafd094 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
@@ -92,7 +92,7 @@ export class TooltipHost extends BaseComponent<ITooltipHostProps, ITooltipHostSt
     if (overflowMode !== undefined) {
       switch (overflowMode) {
         case TooltipOverflowMode.Parent:
-          return this._tooltipHost.parentElement;
+          return this._tooltipHost.parentElement!;
 
         case TooltipOverflowMode.Self:
           return this._tooltipHost;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
index a05af2ce803e2..cb057af0298a3 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
@@ -68,13 +68,13 @@ export class BaseAutoFill extends BaseComponent<IBaseAutoFillProps, IBaseAutoFil
 
   public componentWillReceiveProps(nextProps: IBaseAutoFillProps) {
     if (this.props.updateValueInWillReceiveProps) {
-      let newValue: string = this.props.updateValueInWillReceiveProps();
+      let newValue = this.props.updateValueInWillReceiveProps();
 
       if (newValue !== null) {
         this._value = newValue;
       }
     }
-    if (this._autoFillEnabled && this._doesTextStartWith(nextProps.suggestedDisplayValue, this._value)) {
+    if (this._autoFillEnabled && this._doesTextStartWith(nextProps.suggestedDisplayValue!, this._value)) {
       this.setState({ displayValue: nextProps.suggestedDisplayValue });
     }
   }
@@ -164,7 +164,7 @@ export class BaseAutoFill extends BaseComponent<IBaseAutoFillProps, IBaseAutoFil
         break;
       default:
         if (!this._autoFillEnabled) {
-          if (this.props.enableAutoFillOnKeyPress.indexOf(ev.which) !== -1) {
+          if (this.props.enableAutoFillOnKeyPress!.indexOf(ev.which) !== -1) {
             this._autoFillEnabled = true;
           }
         }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
index ec5b36904f6c2..dd11728e7f0e3 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
@@ -17,7 +17,7 @@ export interface IBasePickerProps<T> extends React.Props<any> {
   /**
    * Function that specifies how an individual suggestion item will appear.
    */
-  onRenderSuggestionsItem?: (props: T, itemProps?: T) => JSX.Element;
+  onRenderSuggestionsItem?: (props: T, itemProps: any) => JSX.Element;
   /**
    * A callback for what should happen when a person types text into the input.
    * Returns the already selected items so the resolver can filter them out.
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
index 5803a5d9aab55..8af6023edccea 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
@@ -156,8 +156,8 @@ describe('Pickers', () => {
           onResolveSuggestions={ onResolveSuggestions }
           selectedItems={ [] }
           onChange={ (items) => {
-            expect(items.length).to.be.equal(1, 'The picker incorrectly added an item');
-            expect(items[0].name).to.be.equal('black', 'The picker incorrectly added an item');
+            expect(items!.length).to.be.equal(1, 'The picker incorrectly added an item');
+            expect(items![0].name).to.be.equal('black', 'The picker incorrectly added an item');
             done();
           } }
         />,
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index d89795f93e015..985ca9633cdda 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -112,7 +112,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   public completeSuggestion() {
     if (this.suggestionStore.hasSelectedSuggestion()) {
-      this.addItem(this.suggestionStore.currentSuggestion.item);
+      this.addItem(this.suggestionStore.currentSuggestion!.item);
       this.updateValue('');
       this.input.clear();
     }
@@ -210,8 +210,8 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   protected resetFocus(index?: number) {
     let { items } = this.state;
 
-    if (items.length && index >= 0) {
-      let newEl: HTMLElement = this.root.querySelectorAll('[data-selection-index]')[Math.min(index, items.length - 1)] as HTMLElement;
+    if (items.length && index! >= 0) {
+      let newEl: HTMLElement = this.root.querySelectorAll('[data-selection-index]')[Math.min(index!, items.length - 1)] as HTMLElement;
 
       if (newEl) {
         this.focusZone.focusElement(newEl);
@@ -329,7 +329,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   protected onChange(items?: T[]) {
     if (this.props.onChange) {
-      this.props.onChange(items);
+      (this.props.onChange as any)(items);
     }
   }
 
@@ -351,7 +351,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   @autobind
   protected onSuggestionRemove(ev: React.MouseEvent<HTMLElement>, item: IPersonaProps, index: number) {
     if (this.props.onRemoveSuggestion) {
-      this.props.onRemoveSuggestion(item);
+      (this.props.onRemoveSuggestion as any)(item);
     }
     this.suggestionStore.removeSuggestion(index);
   }
@@ -405,7 +405,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
       case KeyCodes.del:
         if (ev.target === this.input.inputElement && this.state.suggestionsVisible && this.suggestionStore.currentIndex !== -1) {
           if (this.props.onRemoveSuggestion) {
-            this.props.onRemoveSuggestion(this.suggestionStore.currentSuggestion.item);
+            (this.props.onRemoveSuggestion as any)(this.suggestionStore.currentSuggestion!.item);
           }
           this.suggestionStore.removeSuggestion(this.suggestionStore.currentIndex);
           this.forceUpdate();
@@ -452,7 +452,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
       isSearching: true
     }, () => {
       if (this.props.onGetMoreResults) {
-        let suggestions: T[] | PromiseLike<T[]> = this.props.onGetMoreResults(this.input.value, this.state.items);
+        let suggestions: T[] | PromiseLike<T[]> = (this.props.onGetMoreResults as any)(this.input.value, this.state.items);
         let suggestionsArray: T[] = suggestions as T[];
         let suggestionsPromiseLike: PromiseLike<T[]> = suggestions as PromiseLike<T[]>;
 
@@ -485,7 +485,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   @autobind
   protected addItem(item: T) {
-    let processedItem: T | PromiseLike<T> = this.props.onItemSelected ? this.props.onItemSelected(item) : item;
+    let processedItem: T | PromiseLike<T> = this.props.onItemSelected ? (this.props.onItemSelected as any)(item) : item;
 
     let processedItemObject: T = processedItem as T;
     let processedItemPromiseLike: PromiseLike<T> = processedItem as PromiseLike<T>;
@@ -573,8 +573,8 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   }
 
   private _onValidateInput() {
-    if (this.props.onValidateInput && this.props.onValidateInput(this.input.value) !== ValidationState.invalid && this.props.createGenericItem) {
-      let itemToConvert = this.props.createGenericItem(this.input.value, this.props.onValidateInput(this.input.value));
+    if (this.props.onValidateInput && (this.props.onValidateInput as any)(this.input.value) !== ValidationState.invalid && this.props.createGenericItem) {
+      let itemToConvert = (this.props.createGenericItem as any)(this.input.value, (this.props.onValidateInput as any)(this.input.value));
       this.suggestionStore.createGenericSuggestion(itemToConvert);
       this.completeSuggestion();
     }
@@ -582,7 +582,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   private _getTextFromItem(item: T, currentValue?: string): string {
     if (this.props.getTextFromItem) {
-      return this.props.getTextFromItem(item, currentValue);
+      return (this.props.getTextFromItem as any)(item, currentValue);
     } else {
       return '';
     }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index e8d8d245d4c79..4946ac6e440a0 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -219,7 +219,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     let controlledItems = [];
     for (let i = 0; i < 5; i++) {
       let item = this.state.peopleList[i];
-      if (this.state.currentSelectedItems.indexOf(item) === -1) {
+      if (this.state.currentSelectedItems!.indexOf(item) === -1) {
         controlledItems.push(this.state.peopleList[i]);
       }
     }
@@ -227,7 +227,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
       <div>
         <NormalPeoplePicker
           onResolveSuggestions={ this._onFilterChanged }
-          getTextFromItem={ (persona: IPersonaProps) => persona.primaryText }
+          getTextFromItem={ (persona: IPersonaProps) => persona.primaryText! }
           pickerSuggestionsProps={ suggestionProps }
           className={ 'ms-PeoplePicker' }
           key={ 'controlled' }
@@ -239,7 +239,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
           <DefaultButton className='controlledPickerButton'
             onClick={ () => {
               this.setState({
-                currentSelectedItems: this.state.currentSelectedItems.concat([item])
+                currentSelectedItems: this.state.currentSelectedItems!.concat([item])
               });
             } }>
             <Persona { ...item} />
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts
index 148f3ee1c5d9f..84515452e61e6 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts
@@ -12,7 +12,7 @@ export interface ISuggestionsProps<T> extends React.Props<any> {
   /**
    * How the suggestion should look in the suggestion list.
    */
-  onRenderSuggestion: (props: T, suggestionItemProps: any) => JSX.Element;
+  onRenderSuggestion?: (props: T, suggestionItemProps: T) => JSX.Element;
   /**
    * What should occur when a suggestion is clicked
    */
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index 55a1424a031bd..93199cc15ff69 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -190,7 +190,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
             <TypedSuggestionsItem
               id={ 'sug-item' + index }
               suggestionModel={ suggestion }
-              RenderSuggestion={ onRenderSuggestion }
+              RenderSuggestion={ onRenderSuggestion as any }
               onClick={ (ev: React.MouseEvent<HTMLElement>) => { this.props.onSuggestionClick(ev, suggestion.item, index); } }
               className={ suggestionsItemClassName }
               showRemoveButton={ showRemoveButtons }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
index 5c477c7ff4601..813e66c02b218 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
@@ -5,7 +5,7 @@ export interface ISuggestionModel<T> {
 
 export class SuggestionsController<T> {
   public currentIndex: number;
-  public currentSuggestion: ISuggestionModel<T>;
+  public currentSuggestion: ISuggestionModel<T> | undefined;
   private suggestions: ISuggestionModel<T>[];
   constructor() {
     this.suggestions = [];
@@ -66,7 +66,7 @@ export class SuggestionsController<T> {
   }
 
   public getCurrentItem(): ISuggestionModel<T> {
-    return this.currentSuggestion;
+    return this.currentSuggestion!;
   }
 
   public getSuggestionAtIndex(index: number): ISuggestionModel<T> {
@@ -95,7 +95,7 @@ export class SuggestionsController<T> {
   private _setSelectedSuggestion(index: number): void {
     if (index > this.suggestions.length - 1 || index < 0) {
       this.currentIndex = 0;
-      this.currentSuggestion.selected = false;
+      this.currentSuggestion!.selected = false;
       this.currentSuggestion = this.suggestions[0];
       this.currentSuggestion.selected = true;
     } else {
diff --git a/packages/office-ui-fabric-react/src/demo/index.tsx b/packages/office-ui-fabric-react/src/demo/index.tsx
index 40de2cf23b284..38d94b6bb66a7 100644
--- a/packages/office-ui-fabric-react/src/demo/index.tsx
+++ b/packages/office-ui-fabric-react/src/demo/index.tsx
@@ -13,7 +13,7 @@ import './ColorStyles.scss';
 
 setBaseUrl('./dist/');
 
-let rootElement: HTMLElement | undefined;
+let rootElement: HTMLElement | null;
 
 // Return the anchor link from the URL without the hash
 function _extractAnchorLink(path: string) {
@@ -27,7 +27,7 @@ function _extractAnchorLink(path: string) {
 function _scrollAnchorLink() {
   if ((window.location.hash.match(/#/g) || []).length > 1) {
     let anchor = _extractAnchorLink(window.location.hash);
-    document.getElementById(anchor).scrollIntoView();
+    document.getElementById(anchor)!.scrollIntoView();
   }
 }
 
diff --git a/packages/office-ui-fabric-react/tsconfig.json b/packages/office-ui-fabric-react/tsconfig.json
index 8b53e96ac36e8..1f1c998e76fe6 100644
--- a/packages/office-ui-fabric-react/tsconfig.json
+++ b/packages/office-ui-fabric-react/tsconfig.json
@@ -9,6 +9,7 @@
     "experimentalDecorators": true,
     "importHelpers": true,
     "forceConsistentCasingInFileNames": true,
+    "strictNullChecks": true,
     "noImplicitAny": true,
     "moduleResolution": "node",
     "lib": [

From a0d19b3a683e4fb97d4f91836eeaad3d6dd4c399 Mon Sep 17 00:00:00 2001
From: Michael Loughry <miclo@microsoft.com>
Date: Tue, 1 Aug 2017 15:30:55 -0700
Subject: [PATCH 0340/1641] Choice group/aria labels (#2280)

* Allow for additional aria-labelledBy ids

* Change file

* Fix typo

* Address PR comment

* Fix TSLint
---
 .../choice-group-aria-labels_2017-07-21-16-42.json    | 11 +++++++++++
 .../src/components/ChoiceGroup/ChoiceGroup.tsx        |  6 +++---
 2 files changed, 14 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/choice-group-aria-labels_2017-07-21-16-42.json

diff --git a/common/changes/office-ui-fabric-react/choice-group-aria-labels_2017-07-21-16-42.json b/common/changes/office-ui-fabric-react/choice-group-aria-labels_2017-07-21-16-42.json
new file mode 100644
index 0000000000000..fa2e6b15834a0
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/choice-group-aria-labels_2017-07-21-16-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ChoiceGroup: allow developers to pass additional 'aria-labelledBy' ids",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
index 9aa5e10f2ad3d..76a02e2fb26c4 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
@@ -7,8 +7,8 @@ import {
   assign,
   css,
   getId,
-  BaseComponent
-} from '../../Utilities';
+  BaseComponent,
+} from '@uifabric/utilities';
 import * as stylesImport from './ChoiceGroup.scss';
 const styles: any = stylesImport;
 
@@ -68,7 +68,7 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
         <div
           className={ css('ms-ChoiceFieldGroup', styles.root) }
           role='radiogroup'
-          aria-labelledby={ this.props.label ? this._id + '-label' : '' }
+          aria-labelledby={ `${this.props.label ? this._id + '-label' : ''} ${(this.props as any)['aria-labelledby'] || ''}` }
         >
           { this.props.label && (
             <Label className={ className } required={ required } id={ this._id + '-label' }>{ label }</Label>

From 7da6a8904849f7c839030090f8b15f15a90ffee4 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 2 Aug 2017 10:22:40 +0000
Subject: [PATCH 0341/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...box-edge-doubleclick_2017-08-01-16-42.json | 11 ------
 ...ce-group-aria-labels_2017-07-21-16-42.json | 11 ------
 .../master_2017-08-01-11-35.json              | 11 ------
 .../oufr-strict-null-4_2017-07-28-01-32.json  | 11 ------
 packages/example-app-base/package.json        |  2 +-
 packages/example-component/package.json       |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 36 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 +++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/CHANGELOG.json               |  6 ++++
 packages/styling/CHANGELOG.md                 |  7 +++-
 packages/styling/package.json                 |  2 +-
 16 files changed, 71 insertions(+), 55 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/checkbox-edge-doubleclick_2017-08-01-16-42.json
 delete mode 100644 common/changes/office-ui-fabric-react/choice-group-aria-labels_2017-07-21-16-42.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2017-08-01-11-35.json
 delete mode 100644 common/changes/office-ui-fabric-react/oufr-strict-null-4_2017-07-28-01-32.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 616035d0ddfc6..1c46963ae0463 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.27.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.28.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index f4abafa327ced..90af1d01c285f 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.26.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.28.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 3c79bc50576b4..19a5eb5dd2c69 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -35,7 +35,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.26.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.28.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 3673cd7de7772..d015675161634 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.26.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.28.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.2.2",
diff --git a/common/changes/office-ui-fabric-react/checkbox-edge-doubleclick_2017-08-01-16-42.json b/common/changes/office-ui-fabric-react/checkbox-edge-doubleclick_2017-08-01-16-42.json
deleted file mode 100644
index 1b216c5b7ccdd..0000000000000
--- a/common/changes/office-ui-fabric-react/checkbox-edge-doubleclick_2017-08-01-16-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Checkbox: Fix Edge bug where 2nd click event was being fired",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/choice-group-aria-labels_2017-07-21-16-42.json b/common/changes/office-ui-fabric-react/choice-group-aria-labels_2017-07-21-16-42.json
deleted file mode 100644
index fa2e6b15834a0..0000000000000
--- a/common/changes/office-ui-fabric-react/choice-group-aria-labels_2017-07-21-16-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ChoiceGroup: allow developers to pass additional 'aria-labelledBy' ids",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2017-08-01-11-35.json b/common/changes/office-ui-fabric-react/master_2017-08-01-11-35.json
deleted file mode 100644
index 9146c0b92dace..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2017-08-01-11-35.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: Fixing issue where icons are not displayed.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "serkani@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/oufr-strict-null-4_2017-07-28-01-32.json b/common/changes/office-ui-fabric-react/oufr-strict-null-4_2017-07-28-01-32.json
deleted file mode 100644
index 96ccf16e81e78..0000000000000
--- a/common/changes/office-ui-fabric-react/oufr-strict-null-4_2017-07-28-01-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Enable strictNullChecks",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 039eb88febfd6..bfda313e854a9 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -48,7 +48,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.15.3 <1.0.0",
+    "@uifabric/styling": ">=0.15.4 <1.0.0",
     "@uifabric/utilities": ">=4.8.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
index 47c1727060718..309109a7fed58 100644
--- a/packages/example-component/package.json
+++ b/packages/example-component/package.json
@@ -49,7 +49,7 @@
     "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.27.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.28.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 37887b7e299bc..5d741ef74d609 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,42 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.28.0",
+      "tag": "office-ui-fabric-react_v4.28.0",
+      "date": "Wed, 02 Aug 2017 10:22:40 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "d40a9c8afb171e1a550a05c60d542d27da3f48d3",
+            "comment": "Checkbox: Fix Edge bug where 2nd click event was being fired"
+          },
+          {
+            "author": "Michael Loughry <miclo@microsoft.com>",
+            "commit": "a0d19b3a683e4fb97d4f91836eeaad3d6dd4c399",
+            "comment": "ChoiceGroup: allow developers to pass additional 'aria-labelledBy' ids"
+          },
+          {
+            "author": "Serkan Inci <serkan.inci@hotmail.com>",
+            "commit": "59f419ddeeb9fbfa5db9e90875c672c49fec3545",
+            "comment": "ContextualMenu: Fixing issue where icons are not displayed."
+          }
+        ],
+        "minor": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "856e21fb25f76daf48d08c6eba5445a4e33de352",
+            "comment": "Enable strictNullChecks"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.15.3 <1.0.0` to `>=0.15.4 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.27.0",
       "tag": "office-ui-fabric-react_v4.27.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index a42e6003087dc..82bb603f4ed9c 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 01 Aug 2017 10:13:55 GMT and should not be manually modified.
+This log was last generated on Wed, 02 Aug 2017 10:22:40 GMT and should not be manually modified.
+
+## 4.28.0
+Wed, 02 Aug 2017 10:22:40 GMT
+
+### Minor changes
+
+- Enable strictNullChecks
+
+### Patches
+
+- Checkbox: Fix Edge bug where 2nd click event was being fired
+- ChoiceGroup: allow developers to pass additional 'aria-labelledBy' ids
+- ContextualMenu: Fixing issue where icons are not displayed.
 
 ## 4.27.0
 Tue, 01 Aug 2017 10:13:55 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 29b87e7baa317..d9c00a6572327 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.27.0",
+  "version": "4.28.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.2.2",
     "@uifabric/utilities": ">=4.8.0 <5.0.0",
-    "@uifabric/styling": ">=0.15.3 <1.0.0",
+    "@uifabric/styling": ">=0.15.4 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 2160f04c3b7cb..f2b09f6453af5 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.15.4",
+      "tag": "@uifabric/styling_v0.15.4",
+      "date": "Wed, 02 Aug 2017 10:22:40 GMT",
+      "comments": {}
+    },
     {
       "version": "0.15.3",
       "tag": "@uifabric/styling_v0.15.3",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index d198243fbd8e9..51ab5892cf71a 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Tue, 01 Aug 2017 10:13:55 GMT and should not be manually modified.
+This log was last generated on Wed, 02 Aug 2017 10:22:40 GMT and should not be manually modified.
+
+## 0.15.4
+Wed, 02 Aug 2017 10:22:40 GMT
+
+*Changes not tracked*
 
 ## 0.15.3
 Tue, 01 Aug 2017 10:13:55 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 5183a6ded1990..a9777536ecb1f 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.15.3",
+  "version": "0.15.4",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From de2008d03de119da17a26b616be69c4b09c5320c Mon Sep 17 00:00:00 2001
From: LQQ <lqq201194@163.com>
Date: Thu, 3 Aug 2017 03:33:43 +0800
Subject: [PATCH 0342/1641] Add spacer and divider icon (#2352)

* add Spacer and Divider icon

* run rush change
---
 .../add-Spacer-and-Divider-icon_2017-08-01-11-19.json | 11 +++++++++++
 .../add-Spacer-and-Divider-icon_2017-08-01-11-19.json | 11 +++++++++++
 .../src/components/Icon/IconName.ts                   |  2 ++
 packages/styling/src/styles/IconCodes.ts              |  8 ++++++++
 4 files changed, 32 insertions(+)
 create mode 100644 common/changes/@uifabric/styling/add-Spacer-and-Divider-icon_2017-08-01-11-19.json
 create mode 100644 common/changes/office-ui-fabric-react/add-Spacer-and-Divider-icon_2017-08-01-11-19.json

diff --git a/common/changes/@uifabric/styling/add-Spacer-and-Divider-icon_2017-08-01-11-19.json b/common/changes/@uifabric/styling/add-Spacer-and-Divider-icon_2017-08-01-11-19.json
new file mode 100644
index 0000000000000..6b8d53e4dd112
--- /dev/null
+++ b/common/changes/@uifabric/styling/add-Spacer-and-Divider-icon_2017-08-01-11-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "add Spacer and Divider toolbox icon",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "t-qianl@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/add-Spacer-and-Divider-icon_2017-08-01-11-19.json b/common/changes/office-ui-fabric-react/add-Spacer-and-Divider-icon_2017-08-01-11-19.json
new file mode 100644
index 0000000000000..626433ee4b774
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/add-Spacer-and-Divider-icon_2017-08-01-11-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "add Spacer and Divider toolbox icon",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "t-qianl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Icon/IconName.ts b/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
index 884362e1926db..a507209b9c33c 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
@@ -259,6 +259,7 @@ export type IconName =
   'DiffSideBySide' |
   'DisableUpdates' |
   'Dislike' |
+  'Divider' |
   'DockLeft' |
   'DockLeftMirrored' |
   'DockRight' |
@@ -742,6 +743,7 @@ export type IconName =
   'SortDown' |
   'SortLines' |
   'SortUp' |
+  'Spacer' |
   'Speakers' |
   'SpeedHigh' |
   'Split' |
diff --git a/packages/styling/src/styles/IconCodes.ts b/packages/styling/src/styles/IconCodes.ts
index 7e3d294881562..c09b5cf4c54c7 100644
--- a/packages/styling/src/styles/IconCodes.ts
+++ b/packages/styling/src/styles/IconCodes.ts
@@ -811,6 +811,10 @@ export const IconCodes = {
    * Icon code with the value '\uE8E0'.
    */
   dislike: '\uE8E0',
+  /**
+   * Icon code with the value '\uE949'.
+   */
+  divider: '\uE949',
   /**
    * Icon code with the value '\uEEB8'.
    */
@@ -2399,6 +2403,10 @@ export const IconCodes = {
    * Icon code with the value '\uE7F5'.
    */
   speakers: '\uE7F5',
+  /**
+   * Icon code with the value '\uF40D'.
+   */
+  spacer: '\uF40D ',
   /**
    * Icon code with the value '\uEC4A'.
    */

From 061d4bb481795b35e55b07e5df833bd824bcc35f Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 2 Aug 2017 12:38:46 -0700
Subject: [PATCH 0343/1641] Search clear latest value (#2367)

* Reset latestValue on clear

* change log

* Update SearchBox.tsx
---
 .../search-clear-latestValue_2017-08-02-16-39.json    | 11 +++++++++++
 .../src/components/SearchBox/SearchBox.tsx            |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/search-clear-latestValue_2017-08-02-16-39.json

diff --git a/common/changes/office-ui-fabric-react/search-clear-latestValue_2017-08-02-16-39.json b/common/changes/office-ui-fabric-react/search-clear-latestValue_2017-08-02-16-39.json
new file mode 100644
index 0000000000000..beb211d14931c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/search-clear-latestValue_2017-08-02-16-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Searchbox: fixed bug when repeatedly entering a single character",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
index 6365e1e172889..b937c4fb88894 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
@@ -97,6 +97,7 @@ export class SearchBox extends BaseComponent<ISearchBoxProps, ISearchBoxState> {
 
   @autobind
   private _onClearClick(ev?: any) {
+    this._latestValue = '';
     this.setState({
       value: ''
     });

From 7bfa0875f4198bda88a74f700745d8a23721a3b1 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 2 Aug 2017 12:39:39 -0700
Subject: [PATCH 0344/1641] Contextual menu target attribute (#2343)

* ConextualMenuItem: Support target value

* Add change file

* Added string to target options

* Update ContextualMenu.Props.ts
---
 .../contextual-menu-target_2017-07-31-15-56.json      | 11 +++++++++++
 .../components/ContextualMenu/ContextualMenu.Props.ts |  5 +++++
 .../src/components/ContextualMenu/ContextualMenu.tsx  |  1 +
 .../examples/ContextualMenu.Basic.Example.tsx         |  1 +
 4 files changed, 18 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/contextual-menu-target_2017-07-31-15-56.json

diff --git a/common/changes/office-ui-fabric-react/contextual-menu-target_2017-07-31-15-56.json b/common/changes/office-ui-fabric-react/contextual-menu-target_2017-07-31-15-56.json
new file mode 100644
index 0000000000000..400ae2ddb5270
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/contextual-menu-target_2017-07-31-15-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ConextualMenuItem: Support target value",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
index dd2d8390a2a6f..086b5cacd2d2a 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
@@ -262,6 +262,11 @@ export interface IContextualMenuItem {
    */
   href?: string;
 
+  /**
+   * An optional target when using href
+   */
+  target?: string;
+
   /**
    * Deprecated at v.80.0 and will be removed by v 1.0. Use 'subMenuProps' instead.
    * @deprecated
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 62cbb737d1905..1202fc9eda4aa 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -344,6 +344,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
         <a
           { ...getNativeProps(item, anchorProperties) }
           href={ item.href }
+          target={ item.target }
           className={ css(
             'ms-ContextualMenu-link',
             styles.link,
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx
index b0d1835452704..870c602ed044c 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx
@@ -162,6 +162,7 @@ export class ContextualMenuBasicExample extends React.Component<any, any> {
                 {
                   key: 'Bing',
                   name: 'Go to Bing',
+                  target: '_blank',
                   href: 'http://www.bing.com'
                 },
               ]

From c45ae1e1ba8ce08542de3f670c548e598a48ffc3 Mon Sep 17 00:00:00 2001
From: Ryo Miyake <ryo.studiom@gmail.com>
Date: Thu, 3 Aug 2017 04:42:00 +0900
Subject: [PATCH 0345/1641] Fix utility class names (#2327)

* Fix utility class names

* Generate a changelog
---
 apps/fabric-website/src/data/utilities.json    | 18 +++++++++---------
 .../master_2017-07-28-07-41.json               | 11 +++++++++++
 2 files changed, 20 insertions(+), 9 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/master_2017-07-28-07-41.json

diff --git a/apps/fabric-website/src/data/utilities.json b/apps/fabric-website/src/data/utilities.json
index f1d82b922dedc..4b82d00cbf451 100644
--- a/apps/fabric-website/src/data/utilities.json
+++ b/apps/fabric-website/src/data/utilities.json
@@ -6,7 +6,7 @@
   "data": [
     [
       {
-        "value": "screenReaderOnly"
+        "value": "ms-screenReaderOnly"
       },
       {
         "value": "Visually Hides content while still keeping it accessible for screen readers."
@@ -14,7 +14,7 @@
     ],
     [
       {
-        "value": "borderBox"
+        "value": "ms-borderBox"
       },
       {
         "value": "Set the value of 'box-sizing' to 'border-box', so that the element's padding and border are included in its width."
@@ -22,7 +22,7 @@
     ],
     [
       {
-        "value": "clearfix"
+        "value": "ms-clearfix"
       },
       {
         "value": "Prevents the container of a floated element from collapsing."
@@ -30,7 +30,7 @@
     ],
     [
       {
-        "value": "textAlignLeft"
+        "value": "ms-textAlignLeft"
       },
       {
         "value": "Sets the value of 'text-align' to 'left'."
@@ -38,7 +38,7 @@
     ],
     [
       {
-        "value": "textAlignCenter"
+        "value": "ms-textAlignCenter"
       },
       {
         "value": "Sets the value of 'text-align' to 'center'."
@@ -46,7 +46,7 @@
     ],
     [
       {
-        "value": "textAlignRight"
+        "value": "ms-textAlignRight"
       },
       {
         "value": "Sets the value of 'text-align' to 'right'."
@@ -54,7 +54,7 @@
     ],
     [
       {
-        "value": "borderBase"
+        "value": "ms-borderBase"
       },
       {
         "value": "Applies a solid, 1px wide border to the element. A border color class can then be used to set a color for the border."
@@ -62,11 +62,11 @@
     ],
     [
       {
-        "value": "normalize"
+        "value": "ms-normalize"
       },
       {
         "value": "Sets a variety of baseline styles for the element. This helper applies 'border-box' box sizing, removes any margins and padding, and removes box shadow."
       }
     ]
   ]
-}
\ No newline at end of file
+}
diff --git a/common/changes/@uifabric/fabric-website/master_2017-07-28-07-41.json b/common/changes/@uifabric/fabric-website/master_2017-07-28-07-41.json
new file mode 100644
index 0000000000000..acdf6eaaf4ff2
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/master_2017-07-28-07-41.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Fix utility class names, apply \"ms-\" prefix",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "ryo.studiom@gmail.com"
+}
\ No newline at end of file

From c6fe2ce27631f2663a6188c870b7048753ab04e4 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 2 Aug 2017 13:44:51 -0700
Subject: [PATCH 0346/1641] Update README.md (#2362)

---
 packages/office-ui-fabric-react/README.md | 70 +++++++++++++----------
 1 file changed, 39 insertions(+), 31 deletions(-)

diff --git a/packages/office-ui-fabric-react/README.md b/packages/office-ui-fabric-react/README.md
index 9fe013c63e8c8..e756a17d914c4 100644
--- a/packages/office-ui-fabric-react/README.md
+++ b/packages/office-ui-fabric-react/README.md
@@ -4,16 +4,14 @@
 
 [![npm version](https://badge.fury.io/js/office-ui-fabric-react.svg)](https://badge.fury.io/js/office-ui-fabric-react)
 [![Build Status](https://travis-ci.org/OfficeDev/office-ui-fabric-react.svg?branch=master)](https://travis-ci.org/OfficeDev/office-ui-fabric-react)
-[![Dependencies](https://david-dm.org/OfficeDev/office-ui-fabric-react.svg)](https://david-dm.org/OfficeDev/office-ui-fabric-react)
 
 Fabric React is a responsive, mobile-first collection of robust components designed to make it quick and simple for you to create web experiences using the Office Design Language.
 
-**This project is in a pre-v1 state**, so we encourage you to check out the [Roadmap](#roadmap) to see what we're working towards and what this means for your usage of the control library.
-
 ## Contents
 
 - [View the docs](#view-the-docs)
 - [Get started](#get-started)
+- [Testing](#testing)
 - [Advanced usage](#advanced-usage)
 - [Roadmap](#roadmap)
 - [Trello board](#trello-board)
@@ -35,12 +33,6 @@ This will run `gulp serve` from the office-ui-fabric-react package folder, which
 
 To build all packages in the repo, you can use `npm run build`.
 
-To run other Gulp commands such as clean or deploy, just prepend the command with `npm run gulp` and this will run the command from within the project context.
-
-`npm run gulp clean`
-`npm run gulp deploy`
-...
-
 ## Get started
 
 ### Tutorial
@@ -57,45 +49,61 @@ npm install --save office-ui-fabric-react
 
 This will add the fabric-react project as a dependency in your package.json file, and will drop the project under node_modules/office-ui-fabric-react.
 
-The library includes commonjs entry points under the lib folder. To use a control, you should be able to import it and use it in your render method. Note that wrapping your application in the Fabric component is required to support RTL, keyboard focus and other features.
+The library includes commonjs entry points under the lib folder. To use a control, you should be able to import it and use it in your render method:
 
 ```js
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
-import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
-import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
+import { Button } from 'office-ui-fabric-react/lib/Button';
 
-const MyPage = () => (<Fabric><DefaultButton>I am a button.</DefaultButton></Fabric>);
+const MyPage = () => (<div><Button>I am a button.</Button></div>);
 
 ReactDOM.render(<MyPage />, document.body.firstChild);
 ```
 
-## Advanced usage
-
-For advanced usage including info about module vs. path-based imports, using an AMD bundler like Require, and deployment features, see our [advanced documentation](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/ADVANCED.md).
+## Rendering Fabric components on the server (SSR)
 
+If you need to render Fabric components on the server side in a node environment, there is a way to do this. The basic idea is that you need to tell the styles loader to pipe styles into a variable, which you can later use to inject into your page. Example:
 
-## Roadmap
+```ts
+import { configureLoadStyles } from '@microsoft/load-themed-styles';
+ 
+// Store registered styles in a variable used later for injection.
+let _allStyles = '';
 
-The Fabric React project is currently in a **pre-v1 state** which means that we're working hard on achieving our v1 - a set of powerful and easy to use components built to the Office Design Language that are used *in production*. We will be actively working on this set as teams across Office and Office 365 contribute, evolve, and use these components in their own products.
-
-Given the early state of the project, all things are subject to change and some components may be more stable/usable than others. Use at your own risk!
+// Push styles into variables for injecting later.
+configureLoadStyles((styles: string) => {
+  _allStyles += styles;
+});
+ 
+import * as React from 'react';
+import * as ReactDOMServer from 'react-dom/server';
+import { Button } from 'office-ui-fabric-react/lib/Button'; 
+ 
+let body = ReactDOMServer.renderToString(<Button>hello</Button>);
+ 
+console.log(
+  `
+  <html>
+  <head>
+    <style>${ _allStyles}</style>
+  </head>
+  <body>
+    ${ body}
+  </body>
+  </html>
+  `);
+```
 
-Our goal is to build out the components to be:
-- Well documented
-- Have clear contracts
-- Keyboard accessible
-- Screen reader friendly
-- RTL friendly
-- Support high contrast mode
-- Generally bug-free
+Note: we are evaluating a more robust theming and style loading approach, which will allow a much more flexible server rendering approach, so this syntax may be simplified in the future.
 
-We hope to develop more concrete goals for the project's components in the future with a primary focus on explaining which components are used in production. Stay tuned to learn more.
+## Testing
 
-## Trello board
+For testing see our [testing documentation](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/TESTING.md).
 
-Fabric React contains a variety of components that are a part of the Office / Office 365 design language. If you're not seeing a component here that you'd like, first check out the [Fabric React Requests Trello board](https://trello.com/b/hBP8XdvR/office-ui-fabric-react-requests) and upvote it there (if it exists), or file an [issue on Fabric React's issue tracker](https://github.com/OfficeDev/office-ui-fabric-react/issues) to kick off a new request.
+## Advanced usage
 
+For advanced usage including info about module vs. path-based imports, using an AMD bundler like Require, and deployment features, see our [advanced documentation](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/ADVANCED.md).
 
 ## Browser support
 

From fb487aa0e1510e9182394ff2ee04966986502634 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 2 Aug 2017 13:59:31 -0700
Subject: [PATCH 0347/1641] Updating to TypeScript 2.4.2 (#2334)

* ts241

* Removing circular dependency, fixing versions.

* More fixes.

* Removing example-component, more fixes.

* Adding change files.

* Fixes

* Updating react deps.

* Typings updates due to @types/react changes.

* Fixes from merge.

* Resolving textfield prop thing.

* Removing isarray.
---
 .vscode/launch.json                           |    4 +-
 .vscode/settings.json                         |    2 +-
 apps/component-demo/package.json              |   12 +-
 apps/fabric-website/package.json              |   12 +-
 .../ComponentPage/ComponentPage.tsx           |    4 +-
 .../src/components/PageHeader/PageHeader.tsx  |    5 +-
 apps/fabric-website/src/root.tsx              |   45 +-
 .../src/utilities/router/Router.tsx           |  100 -
 apps/ssr-tests/package.json                   |    4 +-
 apps/test-bundle-button/package.json          |   10 +-
 apps/todo-app/package.json                    |   10 +-
 .../ts-241_2017-07-29-00-51.json              |   11 +
 .../ts-241_2017-07-29-00-51.json              |   11 +
 .../styling/ts-241_2017-07-29-00-51.json      |   11 +
 .../utilities/ts-241_2017-07-29-00-51.json    |   11 +
 .../ts-241_2017-07-29-00-51.json              |   11 +
 common/config/rush/npm-shrinkwrap.json        | 3619 ++++++++---------
 common/config/rush/pinned-versions.json       |    6 +-
 packages/example-app-base/package.json        |   10 +-
 .../ComponentPage/ComponentPage.tsx           |    8 +-
 .../components/ExampleCard/ExampleCard.tsx    |   13 +-
 .../example-app-base/src/utilities/beep.ts    |    5 +-
 packages/example-component/.npmrc             |    2 -
 packages/example-component/gulpfile.js        |   28 -
 packages/example-component/karma.config.js    |  106 -
 packages/example-component/package.json       |   55 -
 .../src/ExampleComponent.Props.ts             |   52 -
 .../src/ExampleComponent.scss                 |   36 -
 .../src/ExampleComponent.test.tsx             |   21 -
 .../src/ExampleComponent.tsx                  |  101 -
 .../src/ExampleComponentPage.tsx              |   55 -
 packages/example-component/src/demoIndex.tsx  |   27 -
 .../ExampleComponent.Basic.Example.tsx        |   11 -
 packages/example-component/src/index.ts       |    1 -
 packages/example-component/tsconfig.json      |   37 -
 packages/example-component/tslint.json        |    6 -
 packages/example-component/webpack.config.js  |   77 -
 .../package.json                              |    2 +-
 .../office-ui-fabric-react-tslint/tslint.json |   11 +-
 packages/office-ui-fabric-react/package.json  |   16 +-
 .../ActivityItem/ActivityItem.Props.ts        |    2 +-
 .../src/components/Button/Button.Props.ts     |    4 +-
 .../src/components/Button/Button.test.tsx     |    3 +-
 .../Button/examples/Button.Swap.Example.tsx   |    2 +-
 .../examples/Calendar.Button.Example.tsx      |    4 +-
 .../examples/Callout.Basic.Example.tsx        |    2 +-
 .../examples/Callout.Cover.Example.tsx        |    2 +-
 .../examples/Callout.Directional.Example.tsx  |    2 +-
 .../examples/Callout.Nested.Example.tsx       |    2 +-
 .../src/components/Checkbox/Checkbox.Props.ts |    4 +-
 .../ChoiceGroup/ChoiceGroup.Props.ts          |    2 +-
 .../components/ChoiceGroup/ChoiceGroup.tsx    |    2 +-
 .../components/ColorPicker/ColorPicker.tsx    |   10 +-
 .../components/ColorPicker/ColorSlider.tsx    |    9 +-
 .../src/components/ComboBox/ComboBox.test.tsx |   33 +-
 .../src/components/ComboBox/ComboBox.tsx      |    4 +-
 .../CommandBar.Customization.Example.tsx      |    2 +-
 .../ContextualMenu/ContextualMenu.tsx         |    2 -
 .../src/components/DatePicker/DatePicker.tsx  |    2 +-
 .../components/DetailsList/DetailsHeader.tsx  |  246 +-
 .../DetailsList/DetailsRowFields.tsx          |   12 +-
 .../examples/DetailsList.Grouped.Example.tsx  |    8 +-
 .../src/components/Facepile/Facepile.Props.ts |    2 +-
 .../src/components/Image/Image.Props.ts       |    2 +-
 .../src/components/Label/Label.Props.ts       |    7 +-
 .../src/components/Label/Label.tsx            |   13 +-
 .../src/components/Link/Link.Props.ts         |    3 +-
 .../src/components/Link/Link.tsx              |   22 +-
 .../src/components/Persona/Persona.test.tsx   |   10 +-
 .../src/components/Rating/Rating.Props.ts     |    2 +-
 .../components/SearchBox/SearchBox.Props.ts   |    2 +-
 .../SwatchColorPicker/SwatchColorPicker.tsx   |    2 +-
 .../examples/TeachingBubble.Basic.Example.tsx |    2 +-
 .../TeachingBubble.Condensed.Example.tsx      |    2 +-
 .../TeachingBubble.Illustration.Example.tsx   |    2 +-
 .../components/TextField/TextField.Props.ts   |    2 +-
 .../components/TextField/TextField.test.tsx   |    2 +-
 .../src/components/TextField/TextField.tsx    |    6 +-
 .../src/components/Toggle/Toggle.tsx          |    2 +-
 .../pickers/AutoFill/BaseAutoFill.Props.ts    |    3 +-
 .../pickers/AutoFill/BaseAutoFill.test.tsx    |   14 +-
 .../components/pickers/BasePicker.Props.ts    |    2 +-
 .../examples/PeoplePicker.Types.Example.tsx   |   10 +-
 .../examples/PeoplePickerExampleData.ts       |    2 +-
 .../components/pickers/PickerItem.Props.ts    |    2 +-
 .../components/pickers/TagPicker/TagItem.tsx  |    4 +-
 .../examples/Picker.CustomResult.Example.tsx  |    5 +-
 .../src/utilities/positioning.ts              |  149 +-
 .../src/utilities/router/Router.tsx           |    2 +-
 .../examples/Selection.Basic.Example.tsx      |   54 +-
 packages/styling/package.json                 |   21 +-
 .../AnimationPage/AnimationPage.styles.ts     |   34 -
 .../examples/AnimationPage/AnimationPage.tsx  |   56 -
 .../AnimationTile/AnimationTile.styles.ts     |   86 -
 .../examples/AnimationTile/AnimationTile.tsx  |   74 -
 .../examples/ColorPage/ColorPage.styles.ts    |   43 -
 .../src/examples/ColorPage/ColorPage.tsx      |  104 -
 .../src/examples/FontPage/FontPage.styles.ts  |   26 -
 .../src/examples/FontPage/FontPage.tsx        |   42 -
 .../src/examples/IconPage/IconPage.styles.ts  |   20 -
 .../src/examples/IconPage/IconPage.tsx        |   53 -
 .../src/examples/IconTile/IconTile.styles.ts  |   64 -
 .../src/examples/IconTile/IconTile.tsx        |   22 -
 .../styling/src/examples/Page/Page.styles.ts  |   21 -
 packages/styling/src/examples/Page/Page.tsx   |   19 -
 .../examples/PageHeader/PageHeader.styles.ts  |   21 -
 .../src/examples/PageHeader/PageHeader.tsx    |   19 -
 packages/styling/src/index.demo.tsx           |   37 -
 packages/utilities/package.json               |    8 +-
 packages/utilities/src/customizable.tsx       |    1 +
 packages/utilities/src/scroll.ts              |    4 +-
 packages/utilities/tsconfig.json              |    2 +
 rush.json                                     |    5 -
 113 files changed, 2258 insertions(+), 3781 deletions(-)
 delete mode 100644 apps/fabric-website/src/utilities/router/Router.tsx
 create mode 100644 common/changes/@uifabric/example-app-base/ts-241_2017-07-29-00-51.json
 create mode 100644 common/changes/@uifabric/fabric-website/ts-241_2017-07-29-00-51.json
 create mode 100644 common/changes/@uifabric/styling/ts-241_2017-07-29-00-51.json
 create mode 100644 common/changes/@uifabric/utilities/ts-241_2017-07-29-00-51.json
 create mode 100644 common/changes/office-ui-fabric-react/ts-241_2017-07-29-00-51.json
 delete mode 100644 packages/example-component/.npmrc
 delete mode 100644 packages/example-component/gulpfile.js
 delete mode 100644 packages/example-component/karma.config.js
 delete mode 100644 packages/example-component/package.json
 delete mode 100644 packages/example-component/src/ExampleComponent.Props.ts
 delete mode 100644 packages/example-component/src/ExampleComponent.scss
 delete mode 100644 packages/example-component/src/ExampleComponent.test.tsx
 delete mode 100644 packages/example-component/src/ExampleComponent.tsx
 delete mode 100644 packages/example-component/src/ExampleComponentPage.tsx
 delete mode 100644 packages/example-component/src/demoIndex.tsx
 delete mode 100644 packages/example-component/src/examples/ExampleComponent.Basic.Example.tsx
 delete mode 100644 packages/example-component/src/index.ts
 delete mode 100644 packages/example-component/tsconfig.json
 delete mode 100644 packages/example-component/tslint.json
 delete mode 100644 packages/example-component/webpack.config.js
 delete mode 100644 packages/styling/src/examples/AnimationPage/AnimationPage.styles.ts
 delete mode 100644 packages/styling/src/examples/AnimationPage/AnimationPage.tsx
 delete mode 100644 packages/styling/src/examples/AnimationTile/AnimationTile.styles.ts
 delete mode 100644 packages/styling/src/examples/AnimationTile/AnimationTile.tsx
 delete mode 100644 packages/styling/src/examples/ColorPage/ColorPage.styles.ts
 delete mode 100644 packages/styling/src/examples/ColorPage/ColorPage.tsx
 delete mode 100644 packages/styling/src/examples/FontPage/FontPage.styles.ts
 delete mode 100644 packages/styling/src/examples/FontPage/FontPage.tsx
 delete mode 100644 packages/styling/src/examples/IconPage/IconPage.styles.ts
 delete mode 100644 packages/styling/src/examples/IconPage/IconPage.tsx
 delete mode 100644 packages/styling/src/examples/IconTile/IconTile.styles.ts
 delete mode 100644 packages/styling/src/examples/IconTile/IconTile.tsx
 delete mode 100644 packages/styling/src/examples/Page/Page.styles.ts
 delete mode 100644 packages/styling/src/examples/Page/Page.tsx
 delete mode 100644 packages/styling/src/examples/PageHeader/PageHeader.styles.ts
 delete mode 100644 packages/styling/src/examples/PageHeader/PageHeader.tsx
 delete mode 100644 packages/styling/src/index.demo.tsx

diff --git a/.vscode/launch.json b/.vscode/launch.json
index 43d411bfaede0..6e1a726534374 100644
--- a/.vscode/launch.json
+++ b/.vscode/launch.json
@@ -5,10 +5,10 @@
       "name": "Launch",
       "type": "node",
       "request": "launch",
-      "program": "${workspaceRoot}/packages/office-ui-fabric-react/node_modules/gulp/bin/gulp.js",
+      "program": "${workspaceRoot}/packages/utilities/node_modules/gulp/bin/gulp.js",
       "stopOnEntry": false,
       "args": [],
-      "cwd": "${workspaceRoot}/packages/office-ui-fabric-react",
+      "cwd": "${workspaceRoot}/packages/utilities",
       "runtimeExecutable": null,
       "runtimeArgs": [
         "--nolazy",
diff --git a/.vscode/settings.json b/.vscode/settings.json
index ed39f2d27033f..932233ce65a98 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -34,5 +34,5 @@
   "typescript.format.insertSpaceAfterOpeningAndBeforeClosingJsxExpressionBraces": true,
   "editor.formatOnSave": true,
   "typescript.tsdk": "./common/temp/node_modules/typescript/lib",
-  "tslint.autoFixOnSave": true
+  "tslint.autoFixOnSave": false
 }
\ No newline at end of file
diff --git a/apps/component-demo/package.json b/apps/component-demo/package.json
index fbc6129ce1a70..3ee4396e1ada7 100644
--- a/apps/component-demo/package.json
+++ b/apps/component-demo/package.json
@@ -9,18 +9,18 @@
     "test": "gulp test"
   },
   "devDependencies": {
-    "@microsoft/web-library-build": "3.0.0"
+    "@microsoft/web-library-build": "^3.2.1"
   },
   "dependencies": {
-    "@microsoft/load-themed-styles": ">=1.2.2 <2.0.0",
+    "@microsoft/load-themed-styles": "^1.5.1",
     "@types/chai": "3.4.35",
     "@types/es6-promise": "^0.0.32",
     "@types/immutability-helper": "2.0.15",
     "@types/mocha": "2.2.32",
     "@types/node": "6.0.45",
-    "@types/react": "15.0.29",
-    "@types/react-addons-test-utils": "0.14.17",
-    "@types/react-dom": "0.14.23",
+    "@types/react": "15.0.38",
+    "@types/react-addons-test-utils": "0.14.19",
+    "@types/react-dom": "15.5.1",
     "@types/webpack-env": "1.13.0",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
@@ -29,6 +29,6 @@
     "react": ">=15.3.2 <16.0.0",
     "react-dom": ">=15.3.2 <16.0.0",
     "tslib": "^1.6.0",
-    "typescript": "2.2.2"
+    "typescript": "2.4.2"
   }
 }
\ No newline at end of file
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 1c46963ae0463..d75504847ade9 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -15,15 +15,15 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@microsoft/load-themed-styles": "^1.2.2",
-    "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
+    "@microsoft/load-themed-styles": "^1.5.1",
+    "@microsoft/web-library-build": "^3.2.1",
     "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.0",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "2.2.39",
-    "@types/react": "15.0.29",
-    "@types/react-addons-test-utils": "0.14.17",
-    "@types/react-dom": "15.5.0",
+    "@types/react": "15.0.38",
+    "@types/react-addons-test-utils": "0.14.19",
+    "@types/react-dom": "15.5.1",
     "@types/webpack-env": "1.13.0",
     "es6-promise": "^4.1.0",
     "git-rev": "0.2.1",
@@ -42,7 +42,7 @@
     "react-highlight": "0.9.0",
     "request": "^2.81.0",
     "source-map-loader": "0.2.1",
-    "typescript": "2.2.2",
+    "typescript": "2.4.2",
     "vinyl-ftp": "0.6.0",
     "webpack-bundle-analyzer": "^2.2.1"
   },
diff --git a/apps/fabric-website/src/components/ComponentPage/ComponentPage.tsx b/apps/fabric-website/src/components/ComponentPage/ComponentPage.tsx
index 0dde206db08fa..8ee615defd0af 100644
--- a/apps/fabric-website/src/components/ComponentPage/ComponentPage.tsx
+++ b/apps/fabric-website/src/components/ComponentPage/ComponentPage.tsx
@@ -5,8 +5,8 @@ export interface IComponentPageProps extends React.Props<ComponentPage> {
 }
 
 export class ComponentPage extends React.Component<IComponentPageProps, {}> {
-  public render() {
-    return(
+  public render(): JSX.Element | null {
+    return (
       <div className='ComponentPageWrapper'>
         { this.props.children }
       </div>
diff --git a/apps/fabric-website/src/components/PageHeader/PageHeader.tsx b/apps/fabric-website/src/components/PageHeader/PageHeader.tsx
index 4997bf5d25271..21b583549ed9f 100644
--- a/apps/fabric-website/src/components/PageHeader/PageHeader.tsx
+++ b/apps/fabric-website/src/components/PageHeader/PageHeader.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { css, BaseComponent } from 'office-ui-fabric-react/lib/Utilities';
+import { css, BaseComponent, IBaseProps } from 'office-ui-fabric-react/lib/Utilities';
 import * as stylesImport from './PageHeader.module.scss';
 const styles: any = stylesImport;
 import { getPageRouteFromState } from '../../utilities/pageroute';
@@ -8,7 +8,8 @@ import { PageHeaderLink } from '../../components/PageHeaderLink/PageHeaderLink';
 const FULL_HEADER_HEIGHT = 236;
 const ATTACHED_HEADER_HEIGHT = 128;
 
-export interface IPageHeaderProps {
+export interface IPageHeaderProps extends IBaseProps {
+
   /**
    * The title of the current page.
    * @default 'Page title'
diff --git a/apps/fabric-website/src/root.tsx b/apps/fabric-website/src/root.tsx
index 29129cf7419e5..0b2990966e7fc 100644
--- a/apps/fabric-website/src/root.tsx
+++ b/apps/fabric-website/src/root.tsx
@@ -23,7 +23,7 @@ let rootElement;
 let currentBreakpoint;
 let scrollDistance;
 
-function _routerDidMount() {
+function _routerDidMount(): void {
   if (_hasAnchorLink(window.location.hash)) {
     let hash = _extractAnchorLink(window.location.hash);
     let el = document.getElementById(hash);
@@ -35,12 +35,12 @@ function _routerDidMount() {
   }
 }
 
-function _getBreakpoint() {
+function _getBreakpoint(): void {
   currentBreakpoint = WindowWidthUtility.currentFabricBreakpoint();
   scrollDistance = _setScrollDistance();
 }
 
-function _setScrollDistance() {
+function _setScrollDistance(): number {
   switch (currentBreakpoint) {
     case ('LG'):
       return 240;
@@ -49,7 +49,7 @@ function _setScrollDistance() {
   }
 }
 
-function _hasAnchorLink(path) {
+function _hasAnchorLink(path: string): boolean {
   return (path.match(/#/g) || []).length > 1;
 }
 
@@ -65,7 +65,7 @@ function _extractAnchorLink(path) {
   return cleanedSplit[cleanedSplit.length - 1];
 }
 
-function _onLoad() {
+function _onLoad(): void {
 
   // Load the app into this element.
   rootElement = rootElement || document.getElementById('main');
@@ -82,16 +82,20 @@ function _onLoad() {
     rootElement);
 }
 
-function _createRoutes(pages): any[] {
+function _createRoutes(pages: {}[]): {}[] {
   let routes = [];
   let pageRoutes = [];
-  pages.forEach((page, pageIndex) => {
-    routes.push(<Route
-      key={ pageIndex }
-      path={ page.url }
-      component={ page.component }
-      getComponent={ page.getComponent }
-    />);
+
+  // tslint:disable-next-line:no-any
+  pages.forEach((page: any, pageIndex: number) => {
+    routes.push(
+      <Route
+        key={ pageIndex }
+        path={ page.url }
+        component={ page.component }
+        getComponent={ page.getComponent }
+      />
+    );
     if (page.pages) {
       routes = routes.concat(_createRoutes(page.pages));
     }
@@ -126,12 +130,15 @@ if (isReady) {
 }
 
 window.onunload = _onUnload;
-function addCSSToHeader(fileName) {
+
+function addCSSToHeader(fileName: string) {
   let headEl = document.head;
   let linkEl = document.createElement('link');
-  linkEl.type = 'text/css'
-  linkEl.rel = 'stylesheet'
-  linkEl.href = fileName
-  headEl.appendChild(linkEl)
+
+  linkEl.type = 'text/css';
+  linkEl.rel = 'stylesheet';
+  linkEl.href = fileName;
+  headEl.appendChild(linkEl);
 }
-addCSSToHeader('https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/7.1.0/css/fabric.min.css')
\ No newline at end of file
+
+addCSSToHeader('https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/7.1.0/css/fabric.min.css');
diff --git a/apps/fabric-website/src/utilities/router/Router.tsx b/apps/fabric-website/src/utilities/router/Router.tsx
deleted file mode 100644
index 86c3a1f06d226..0000000000000
--- a/apps/fabric-website/src/utilities/router/Router.tsx
+++ /dev/null
@@ -1,100 +0,0 @@
-import * as React from 'react';
-import { BaseComponent } from 'office-ui-fabric-react/lib/Utilities';
-
-export interface IRouterProps {
-  replaceState?: boolean;
-  children?: React.ReactElement<any>[];
-  routerDidMount?: Function;
-}
-
-export interface IRouterState {
-  path: string;
-}
-
-export class Router extends BaseComponent<IRouterProps, IRouterState> {
-
-  constructor() {
-    super();
-
-    this.state = {
-      path: location.hash
-    };
-  }
-
-  public componentDidUpdate(prevProps: IRouterProps, prevState: IRouterState) {
-
-    if (this.state.path !== prevState.path) {
-      window.scrollTo(0, 0);
-    }
-  }
-
-  public render() {
-    return _getComponent(this.state.path, this.props.children);
-  }
-
-  public componentDidMount() {
-    this._events.on(window, 'hashchange', () => {
-      if (this.state.path !== location.hash) {
-        this.setState({ path: location.hash });
-
-        if (this.props.routerDidMount) {
-          this.props.routerDidMount();
-        }
-      }
-    });
-
-    if (this.props.routerDidMount) {
-      this.props.routerDidMount();
-    }
-  }
-}
-
-function _getComponent(matchPath, children) {
-  let path = matchPath;
-  if (children && children.$$typeof) {
-    children = [children];
-  }
-
-  if (_hasAnchorLink(path)) {
-    path = _extractBasePath(path);
-  }
-
-  for (let i = 0; children && i < children.length; i++) {
-    let currentChild = children[i];
-
-    if (_match(path, currentChild)) {
-      let component = currentChild.props.component;
-      let childComponent = _getComponent(path, currentChild.props.children);
-
-      return React.createElement(component, null, childComponent);
-    }
-  }
-
-  return null;
-}
-
-function _hasAnchorLink(path) {
-  return (path.match(/#/g) || []).length > 1;
-}
-
-function _extractBasePath(path) {
-  let split = path.split('#');
-  split.splice(split.length - 1, 1);
-  return '#' + split.join('');
-}
-
-function _match(currentPath, child): boolean {
-  if (child.props) {
-    let { path } = child.props;
-
-    path = path || '';
-    currentPath = currentPath || '';
-
-    return (
-      (!path) ||
-      (path.toLowerCase() === currentPath.toLowerCase())
-    );
-  }
-
-  return false;
-}
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 90af1d01c285f..ab700614d01ac 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -16,7 +16,7 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@microsoft/load-themed-styles": "^1.2.2",
+    "@microsoft/load-themed-styles": "^1.5.1",
     "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.0",
     "@types/es6-promise": "^0.0.32",
@@ -28,7 +28,7 @@
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
     "react-dom": "^15.4.2",
-    "webpack": "^2.4.1",
+    "webpack": "^3.4.1",
     "webpack-node-externals": "^1.5.4"
   },
   "dependencies": {
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 19a5eb5dd2c69..610283e40d108 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -18,17 +18,17 @@
     "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.serve.config.js --open"
   },
   "devDependencies": {
-    "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
-    "@types/react": "15.0.29",
+    "@microsoft/web-library-build": "^3.2.1",
+    "@types/react": "15.0.38",
     "@types/react-addons-test-utils": "0.14.18",
-    "@types/react-dom": "15.5.0",
+    "@types/react-dom": "15.5.1",
     "@types/webpack-env": "1.13.0",
     "@types/prop-types": "15.5.1",
     "gzip-size": "^3.0.0",
     "source-map-loader": "^0.2.1",
     "ts-loader": "^2.0.1",
-    "typescript": "2.2.2",
-    "webpack": "^2.2.1",
+    "typescript": "2.4.2",
+    "webpack": "^3.4.1",
     "webpack-bundle-analyzer": "^2.2.1",
     "webpack-dev-server": "^2.4.1"
   },
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index d015675161634..71a86ef9b1b06 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -10,26 +10,26 @@
     "test": "gulp test"
   },
   "devDependencies": {
-    "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
+    "@microsoft/web-library-build": "^3.2.1",
     "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.0",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "2.2.39",
-    "@types/react": "15.0.29",
+    "@types/react": "15.0.38",
     "@types/react-addons-test-utils": "0.14.18",
-    "@types/react-dom": "15.5.0",
+    "@types/react-dom": "15.5.1",
     "@types/webpack-env": "1.13.0",
     "react-addons-test-utils": "^15.4.2"
   },
   "dependencies": {
-    "@microsoft/load-themed-styles": ">=1.2.2 <2.0.0",
+    "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.28.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
-    "typescript": "2.2.2",
+    "typescript": "2.4.2",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/ts-241_2017-07-29-00-51.json b/common/changes/@uifabric/example-app-base/ts-241_2017-07-29-00-51.json
new file mode 100644
index 0000000000000..39170784e31ab
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/ts-241_2017-07-29-00-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "TypeScript 2.4.1 bump",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/ts-241_2017-07-29-00-51.json b/common/changes/@uifabric/fabric-website/ts-241_2017-07-29-00-51.json
new file mode 100644
index 0000000000000..50e704c849a25
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/ts-241_2017-07-29-00-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "TypeScript 2.4.1 bump",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/ts-241_2017-07-29-00-51.json b/common/changes/@uifabric/styling/ts-241_2017-07-29-00-51.json
new file mode 100644
index 0000000000000..b0dc879738f47
--- /dev/null
+++ b/common/changes/@uifabric/styling/ts-241_2017-07-29-00-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "TypeScript 2.4.1 bump",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/ts-241_2017-07-29-00-51.json b/common/changes/@uifabric/utilities/ts-241_2017-07-29-00-51.json
new file mode 100644
index 0000000000000..ef33f917ecad8
--- /dev/null
+++ b/common/changes/@uifabric/utilities/ts-241_2017-07-29-00-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "TypeScript 2.4.1 bump",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/ts-241_2017-07-29-00-51.json b/common/changes/office-ui-fabric-react/ts-241_2017-07-29-00-51.json
new file mode 100644
index 0000000000000..442110acf86f8
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/ts-241_2017-07-29-00-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "TypeScript 2.4.1 bump",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 8fa9cfbc73632..e283fc06537af 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -4,14 +4,14 @@
   "lockfileVersion": 1,
   "dependencies": {
     "@microsoft/api-extractor": {
-      "version": "1.1.19",
-      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-1.1.19.tgz",
-      "integrity": "sha1-aBrxRDx7s/3xnRnPqvdd2QoD2dI="
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.3.1.tgz",
+      "integrity": "sha1-d65/YIwIY1K0/0M08RSXGo7Jr7o="
     },
     "@microsoft/gulp-core-build": {
-      "version": "2.7.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.7.0.tgz",
-      "integrity": "sha1-MF8vNfBTdvZ+Qg+6LfemEHW7qB0=",
+      "version": "2.7.2",
+      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.7.2.tgz",
+      "integrity": "sha1-wmouduFjUWQVpmgScsjY8UNqInM=",
       "dependencies": {
         "@types/chai": {
           "version": "3.4.34",
@@ -31,9 +31,9 @@
       }
     },
     "@microsoft/gulp-core-build-karma": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-karma/-/gulp-core-build-karma-2.3.0.tgz",
-      "integrity": "sha1-ypHU5TqdX/kyFja3h9oyDi2lr48=",
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-karma/-/gulp-core-build-karma-2.2.2.tgz",
+      "integrity": "sha1-L910uWl7x2VZjGwrOCxR9XBhSmg=",
       "dependencies": {
         "camelcase": {
           "version": "1.2.1",
@@ -139,9 +139,9 @@
       }
     },
     "@microsoft/gulp-core-build-sass": {
-      "version": "2.0.8",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-2.0.8.tgz",
-      "integrity": "sha1-Xq3URcMEIKuHxvHd5KTc68aKEmQ=",
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.1.2.tgz",
+      "integrity": "sha1-msehN3WBLY3s1/BOQrfy1BKjnCc=",
       "dependencies": {
         "autoprefixer": {
           "version": "6.3.7",
@@ -156,21 +156,14 @@
       "integrity": "sha1-k9LYWMLwL+3wxZSKal4KQ8XjqCU="
     },
     "@microsoft/gulp-core-build-typescript": {
-      "version": "2.4.4",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-2.4.4.tgz",
-      "integrity": "sha1-DJ7UgdBtZNmv3KpEzsGoVI89tTs=",
-      "dependencies": {
-        "typescript": {
-          "version": "2.1.6",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.1.6.tgz",
-          "integrity": "sha1-QMfm6eXaeWG3cYtVUF+crJSHpgc="
-        }
-      }
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.3.1.tgz",
+      "integrity": "sha1-O3jI8rwoUku+08UzLsIwYhELS5g="
     },
     "@microsoft/gulp-core-build-webpack": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-webpack/-/gulp-core-build-webpack-1.2.0.tgz",
-      "integrity": "sha1-YJabs2KtyW/0KziCN+b59Hi7mOI=",
+      "version": "1.1.6",
+      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-webpack/-/gulp-core-build-webpack-1.1.6.tgz",
+      "integrity": "sha1-OloimWPldBfH8WPd99iNfPdm8uA=",
       "dependencies": {
         "camelcase": {
           "version": "1.2.1",
@@ -247,9 +240,9 @@
       }
     },
     "@microsoft/load-themed-styles": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.4.0.tgz",
-      "integrity": "sha1-GDC9288QFxLKJgIX5Vq3RKUgQdw="
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.5.1.tgz",
+      "integrity": "sha1-vJGW0ezlqXkP3ZmUuSRDJpo5dMc="
     },
     "@microsoft/loader-cased-file": {
       "version": "1.0.1",
@@ -269,59 +262,78 @@
       }
     },
     "@microsoft/loader-load-themed-styles": {
-      "version": "0.0.5",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-0.0.5.tgz",
-      "integrity": "sha1-L9eYt4pDdvyRL5ASaI33kX8cofg=",
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.2.0.tgz",
+      "integrity": "sha1-S9TfPuiymFiKSBu0hBUhN1JcVUg=",
       "dependencies": {
         "@microsoft/load-themed-styles": {
-          "version": "1.2.2",
-          "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.2.2.tgz",
-          "integrity": "sha1-+i+hypxPDEliPi5IrTujBSRJWGc="
+          "version": "1.4.0",
+          "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.4.0.tgz",
+          "integrity": "sha1-GDC9288QFxLKJgIX5Vq3RKUgQdw="
+        },
+        "loader-utils": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
+          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
         }
       }
     },
     "@microsoft/loader-set-webpack-public-path": {
-      "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-set-webpack-public-path/-/loader-set-webpack-public-path-0.1.7.tgz",
-      "integrity": "sha1-elXNxsfwP05ZZyk+XKLAppxIxLI="
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-set-webpack-public-path/-/loader-set-webpack-public-path-2.1.0.tgz",
+      "integrity": "sha1-osSnwyfQAbomOivSMxUNKnuCFgA=",
+      "dependencies": {
+        "loader-utils": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
+          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
+        }
+      }
     },
     "@microsoft/rush-lib": {
-      "version": "1.8.3",
-      "resolved": "https://registry.npmjs.org/@microsoft/rush-lib/-/rush-lib-1.8.3.tgz",
-      "integrity": "sha1-+40E9QAknaLY7vXhwfj2Guy3t4Y=",
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/@microsoft/rush-lib/-/rush-lib-3.0.7.tgz",
+      "integrity": "sha1-bKgpmEgMMxDKcHqeWW+NXAA+MMQ=",
+      "dependencies": {
+        "rimraf": {
+          "version": "2.5.4",
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
+          "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
+        }
+      }
+    },
+    "@microsoft/sp-build-common": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/sp-build-common/-/sp-build-common-1.1.0.tgz",
+      "integrity": "sha1-lzCRSjgVLl4/UEO9DLT9Z6urrmY=",
       "dependencies": {
+        "@microsoft/gulp-core-build": {
+          "version": "2.5.3",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.5.3.tgz",
+          "integrity": "sha1-26R2Li/7oxiYdlmTx3d7AVk8/rc=",
+          "dependencies": {
+            "@types/yargs": {
+              "version": "0.0.34",
+              "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.34.tgz",
+              "integrity": "sha1-FWBCn8VQxDvEGnt9PfoK+8yRSjU="
+            }
+          }
+        },
+        "@microsoft/gulp-core-build-typescript": {
+          "version": "3.1.1",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.1.1.tgz",
+          "integrity": "sha1-e3gdjlKeSQzz5hB5eh+7fuZx01s="
+        },
         "@types/chai": {
           "version": "3.4.34",
           "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz",
           "integrity": "sha1-1TNXkoI7sJzd1eOMPSEbcJGDhU0="
         },
-        "@types/fs-extra": {
-          "version": "0.0.34",
-          "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.34.tgz",
-          "integrity": "sha1-Tv8v9bBqWjv8VErdOm7TTN+JIzU="
-        },
         "@types/mocha": {
           "version": "2.2.38",
           "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz",
           "integrity": "sha1-jBiPbjTC58Px0BJ9kI1aNuWmDck="
         },
-        "rimraf": {
-          "version": "2.5.4",
-          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
-          "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
-        },
-        "semver": {
-          "version": "5.2.0",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.2.0.tgz",
-          "integrity": "sha1-KBmVuAwUSCCUFd28TPUMJpzvVcU="
-        }
-      }
-    },
-    "@microsoft/sp-build-common": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/sp-build-common/-/sp-build-common-1.0.0.tgz",
-      "integrity": "sha1-LYMxudMf39F+CmgR9/Q4LQIIYPQ=",
-      "dependencies": {
         "@types/yargs": {
           "version": "0.0.35",
           "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.35.tgz",
@@ -331,28 +343,92 @@
           "version": "3.16.20-alpha",
           "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.20-alpha.tgz",
           "integrity": "sha1-NvWIzMon2Oht1rtZWpc67eiAN2Y="
+        },
+        "findup-sync": {
+          "version": "0.3.0",
+          "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.3.0.tgz",
+          "integrity": "sha1-N5MKpdgWt3fANEXhlmzGeQpMCxY=",
+          "dependencies": {
+            "glob": {
+              "version": "5.0.15",
+              "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
+              "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
+            }
+          }
+        },
+        "rimraf": {
+          "version": "2.5.4",
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
+          "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
+        },
+        "tslint": {
+          "version": "4.5.1",
+          "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.5.1.tgz",
+          "integrity": "sha1-BTVocb7yOkNJBnNABvwYgza6gks="
+        },
+        "tslint-microsoft-contrib": {
+          "version": "4.0.1",
+          "resolved": "https://registry.npmjs.org/tslint-microsoft-contrib/-/tslint-microsoft-contrib-4.0.1.tgz",
+          "integrity": "sha1-niAaFjn1hZZY/88rTcuxmZL45sA="
+        },
+        "tsutils": {
+          "version": "1.9.1",
+          "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-1.9.1.tgz",
+          "integrity": "sha1-ufmrROVa+WgYMdXyjQrur1x1DLA="
+        },
+        "typescript": {
+          "version": "2.2.2",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz",
+          "integrity": "sha1-YGAiUIR5tV/6NotY/uljoD39eww="
         }
       }
     },
     "@microsoft/sp-build-core-tasks": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/@microsoft/sp-build-core-tasks/-/sp-build-core-tasks-1.0.1.tgz",
-      "integrity": "sha1-lw0TAjg9Sph6HOzM+O47NRQR2k0=",
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@microsoft/sp-build-core-tasks/-/sp-build-core-tasks-1.1.1.tgz",
+      "integrity": "sha1-fjXpjrqWpMlMQNoGIoU8n05vOVY=",
       "dependencies": {
+        "@microsoft/gulp-core-build": {
+          "version": "2.5.3",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.5.3.tgz",
+          "integrity": "sha1-26R2Li/7oxiYdlmTx3d7AVk8/rc=",
+          "dependencies": {
+            "@types/node": {
+              "version": "6.0.62",
+              "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.62.tgz",
+              "integrity": "sha1-hSIsB3tU8ltXQXu3CLn4d72jf4k="
+            },
+            "rimraf": {
+              "version": "2.5.4",
+              "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
+              "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
+            }
+          }
+        },
         "@microsoft/load-themed-styles": {
-          "version": "1.2.2",
-          "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.2.2.tgz",
-          "integrity": "sha1-+i+hypxPDEliPi5IrTujBSRJWGc="
+          "version": "1.4.0",
+          "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.4.0.tgz",
+          "integrity": "sha1-GDC9288QFxLKJgIX5Vq3RKUgQdw="
         },
-        "camelcase": {
-          "version": "1.2.1",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
-          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
+        "@types/chai": {
+          "version": "3.4.34",
+          "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz",
+          "integrity": "sha1-1TNXkoI7sJzd1eOMPSEbcJGDhU0="
         },
-        "cliui": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
-          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE="
+        "@types/mocha": {
+          "version": "2.2.38",
+          "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz",
+          "integrity": "sha1-jBiPbjTC58Px0BJ9kI1aNuWmDck="
+        },
+        "@types/node": {
+          "version": "6.0.64",
+          "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.64.tgz",
+          "integrity": "sha1-zckBQR9jAeFDff7SO8aPVEQuTcg="
+        },
+        "acorn": {
+          "version": "5.1.1",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.1.1.tgz",
+          "integrity": "sha512-vOk6uEMctu0vQrvuSqFdJyqj1Q0S5VTDL79qtjo+DhRr+1mmaD+tluFSCZqhvi/JUhXSzoZN2BhtstaPEeE8cw=="
         },
         "css-loader": {
           "version": "0.24.0",
@@ -374,6 +450,70 @@
           "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-3.1.2.tgz",
           "integrity": "sha1-eV4lzrR/e6uyY9FRr77dktGOagc="
         },
+        "express": {
+          "version": "4.15.3",
+          "resolved": "https://registry.npmjs.org/express/-/express-4.15.3.tgz",
+          "integrity": "sha1-urZdDwOqgMNYQIly/HAPkWlEtmI=",
+          "dependencies": {
+            "debug": {
+              "version": "2.6.7",
+              "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.7.tgz",
+              "integrity": "sha1-krrR9tBbu2u6Isyoi80OyJTChh4="
+            },
+            "etag": {
+              "version": "1.8.0",
+              "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.0.tgz",
+              "integrity": "sha1-b2Ma7zNtbEY2K1F2QETOIWvjwFE="
+            },
+            "finalhandler": {
+              "version": "1.0.3",
+              "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.3.tgz",
+              "integrity": "sha1-70fneVDpmXgOhgIqVg4yF+DQzIk="
+            },
+            "fresh": {
+              "version": "0.5.0",
+              "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.0.tgz",
+              "integrity": "sha1-9HTKXmqSRtb9jglTz6m5yAWvp44="
+            },
+            "http-errors": {
+              "version": "1.6.1",
+              "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.1.tgz",
+              "integrity": "sha1-X4uO2YrKVFZWv1cplzh/kEpyIlc=",
+              "dependencies": {
+                "depd": {
+                  "version": "1.1.0",
+                  "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.0.tgz",
+                  "integrity": "sha1-4b2Cxqq2ztlluXuIsX7T5SjKGMM="
+                }
+              }
+            },
+            "ms": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+              "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
+            },
+            "range-parser": {
+              "version": "1.2.0",
+              "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.0.tgz",
+              "integrity": "sha1-9JvmtIeJTdxA3MlKMi9hEJLgDV4="
+            },
+            "send": {
+              "version": "0.15.3",
+              "resolved": "https://registry.npmjs.org/send/-/send-0.15.3.tgz",
+              "integrity": "sha1-UBP5+ZAj31DRvZiSwZ4979HVMwk="
+            },
+            "serve-static": {
+              "version": "1.12.3",
+              "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.12.3.tgz",
+              "integrity": "sha1-n0uhni8wMMVH+K+ZEHg47DjVseI="
+            },
+            "statuses": {
+              "version": "1.3.1",
+              "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.3.1.tgz",
+              "integrity": "sha1-+vUbnrdKrvOzrPStX2Gr8ky3uT4="
+            }
+          }
+        },
         "finalhandler": {
           "version": "0.4.1",
           "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.4.1.tgz",
@@ -389,20 +529,10 @@
           "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
           "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
         },
-        "interpret": {
-          "version": "0.6.6",
-          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz",
-          "integrity": "sha1-/s16GOfOXKar+5U+H4YhOknxYls="
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "memory-fs": {
-          "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz",
-          "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
+        "loader-utils": {
+          "version": "0.2.16",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.16.tgz",
+          "integrity": "sha1-8IYyBm7YKCg13/iN+1JwR2Wt7m0="
         },
         "mime": {
           "version": "1.3.4",
@@ -424,21 +554,11 @@
           "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.0.3.tgz",
           "integrity": "sha1-aHKCNTXGkuLCoBA4Jq/YLC4P8XU="
         },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
         "resolve": {
           "version": "1.1.7",
           "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz",
           "integrity": "sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs="
         },
-        "rimraf": {
-          "version": "2.5.4",
-          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
-          "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
-        },
         "send": {
           "version": "0.13.2",
           "resolved": "https://registry.npmjs.org/send/-/send-0.13.2.tgz",
@@ -454,67 +574,94 @@
           "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.2.1.tgz",
           "integrity": "sha1-3e1FzBglbVHtQK7BQkidXGECbSg="
         },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
+        "webpack-bundle-analyzer": {
+          "version": "2.4.1",
+          "resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.4.1.tgz",
+          "integrity": "sha1-H1o98pe1naL4IWybdhs/pAaG9HE=",
+          "dependencies": {
+            "lodash": {
+              "version": "4.17.4",
+              "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+              "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+            }
+          }
+        }
+      }
+    },
+    "@microsoft/sp-build-web": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/sp-build-web/-/sp-build-web-1.1.0.tgz",
+      "integrity": "sha1-hAxtV8FVsubPaIGrlxFbw7sL3TU=",
+      "dependencies": {
+        "@microsoft/gulp-core-build": {
+          "version": "2.5.3",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.5.3.tgz",
+          "integrity": "sha1-26R2Li/7oxiYdlmTx3d7AVk8/rc="
         },
-        "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        "@microsoft/gulp-core-build-typescript": {
+          "version": "3.1.1",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.1.1.tgz",
+          "integrity": "sha1-e3gdjlKeSQzz5hB5eh+7fuZx01s="
         },
-        "uglify-js": {
-          "version": "2.7.5",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.7.5.tgz",
-          "integrity": "sha1-RhLAx7qu4rp8SH3kkErhIgefLKg=",
+        "@types/chai": {
+          "version": "3.4.34",
+          "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz",
+          "integrity": "sha1-1TNXkoI7sJzd1eOMPSEbcJGDhU0="
+        },
+        "@types/mocha": {
+          "version": "2.2.38",
+          "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz",
+          "integrity": "sha1-jBiPbjTC58Px0BJ9kI1aNuWmDck="
+        },
+        "findup-sync": {
+          "version": "0.3.0",
+          "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.3.0.tgz",
+          "integrity": "sha1-N5MKpdgWt3fANEXhlmzGeQpMCxY=",
           "dependencies": {
-            "async": {
-              "version": "0.2.10",
-              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz",
-              "integrity": "sha1-trvgsGdLnXGXCMo43owjfLUmw9E="
+            "glob": {
+              "version": "5.0.15",
+              "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
+              "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
             }
           }
         },
-        "webpack": {
-          "version": "1.13.3",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz",
-          "integrity": "sha1-55xG/lo3xcpwCEugiUxZXNy0KBU="
+        "rimraf": {
+          "version": "2.5.4",
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
+          "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
         },
-        "window-size": {
-          "version": "0.1.0",
-          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
-          "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
+        "tslint": {
+          "version": "4.5.1",
+          "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.5.1.tgz",
+          "integrity": "sha1-BTVocb7yOkNJBnNABvwYgza6gks="
         },
-        "wordwrap": {
-          "version": "0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
-          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
+        "tslint-microsoft-contrib": {
+          "version": "4.0.1",
+          "resolved": "https://registry.npmjs.org/tslint-microsoft-contrib/-/tslint-microsoft-contrib-4.0.1.tgz",
+          "integrity": "sha1-niAaFjn1hZZY/88rTcuxmZL45sA="
         },
-        "yargs": {
-          "version": "3.10.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
-          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
-        }
-      }
-    },
-    "@microsoft/sp-build-web": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/@microsoft/sp-build-web/-/sp-build-web-1.0.1.tgz",
-      "integrity": "sha1-wLbn7gPT45eH38x9FZAn0UuhaRM=",
-      "dependencies": {
-        "@types/yargs": {
-          "version": "0.0.35",
-          "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.35.tgz",
-          "integrity": "sha1-QHczV2rO1IlfutZ6Pwr2M9Lfy60="
+        "tsutils": {
+          "version": "1.9.1",
+          "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-1.9.1.tgz",
+          "integrity": "sha1-ufmrROVa+WgYMdXyjQrur1x1DLA="
+        },
+        "typescript": {
+          "version": "2.2.2",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz",
+          "integrity": "sha1-YGAiUIR5tV/6NotY/uljoD39eww="
         }
       }
     },
     "@microsoft/sp-module-interfaces": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/sp-module-interfaces/-/sp-module-interfaces-1.0.0.tgz",
-      "integrity": "sha1-cHc83IuclD92RemXChcyud8gKbw=",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/sp-module-interfaces/-/sp-module-interfaces-1.1.0.tgz",
+      "integrity": "sha1-YW9ITO45IbtqnopIphZ7cyYxz54=",
       "dependencies": {
+        "@types/node": {
+          "version": "6.0.64",
+          "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.64.tgz",
+          "integrity": "sha1-zckBQR9jAeFDff7SO8aPVEQuTcg="
+        },
         "@types/z-schema": {
           "version": "3.16.20-alpha",
           "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.20-alpha.tgz",
@@ -523,103 +670,73 @@
       }
     },
     "@microsoft/sp-polyfills": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/sp-polyfills/-/sp-polyfills-1.0.0.tgz",
-      "integrity": "sha1-tB/N8Njkgbib46/reNdaBe4Zkqs=",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/sp-polyfills/-/sp-polyfills-1.1.0.tgz",
+      "integrity": "sha1-oFberMuTQLO3eg2QlYELTw/mAOo=",
       "dependencies": {
         "es6-promise": {
           "version": "3.1.2",
           "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-3.1.2.tgz",
           "integrity": "sha1-eV4lzrR/e6uyY9FRr77dktGOagc="
-        },
-        "whatwg-fetch": {
-          "version": "0.11.0",
-          "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-0.11.0.tgz",
-          "integrity": "sha1-RrHRjQqpmVWXHvGi9arFBq3SiBU="
         }
       }
     },
     "@microsoft/sp-tslint-rules": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/sp-tslint-rules/-/sp-tslint-rules-1.0.0.tgz",
-      "integrity": "sha1-Nas2DM1FUhb4e/YVDljVZlVZsjA="
-    },
-    "@microsoft/stream-collator": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@microsoft/stream-collator/-/stream-collator-1.0.2.tgz",
-      "integrity": "sha1-Qqwrj4yx79VSDd209FGZcBLLgwA="
-    },
-    "@microsoft/web-library-build": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/web-library-build/-/web-library-build-3.1.0.tgz",
-      "integrity": "sha1-FPDBDM3dZeoNDBZOlMf0Sn7BW0I=",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/sp-tslint-rules/-/sp-tslint-rules-1.1.0.tgz",
+      "integrity": "sha1-t0IKEO0oXp+RyN+/R5dDkdJiRmk=",
       "dependencies": {
-        "@microsoft/api-extractor": {
-          "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.2.0.tgz",
-          "integrity": "sha1-pWap7SVj1TlhR3NFGfXdig/Bz9w="
-        },
-        "@microsoft/gulp-core-build-sass": {
-          "version": "3.2.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.2.0.tgz",
-          "integrity": "sha1-KjGubAzpx/RC6KB21FGW+xVaRGo="
+        "@microsoft/gulp-core-build": {
+          "version": "2.5.3",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.5.3.tgz",
+          "integrity": "sha1-26R2Li/7oxiYdlmTx3d7AVk8/rc="
         },
         "@microsoft/gulp-core-build-typescript": {
-          "version": "3.2.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.2.0.tgz",
-          "integrity": "sha1-Ex5ztJ8Y2kUbjbOWR+mI0JRFSrw="
-        },
-        "ansi-align": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-2.0.0.tgz",
-          "integrity": "sha1-w2rsy6VjuJzrVW82kPCx2eNUf38="
-        },
-        "ansi-regex": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
-          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg="
-        },
-        "ansi-styles": {
-          "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.1.0.tgz",
-          "integrity": "sha1-CcIC1ckX7CMYjKpcnLkXnNlUd1A="
-        },
-        "autoprefixer": {
-          "version": "6.3.7",
-          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz",
-          "integrity": "sha1-jt8xZt2f1hFlM2Ysi7NqA8DvyHQ="
-        },
-        "boxen": {
-          "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/boxen/-/boxen-1.2.0.tgz",
-          "integrity": "sha512-tfKK3nq0qXXOxvXEYW1k1XNRrDuQzO2oFPvLD3Fs1I58n0leuTNlftBmu3seUCyZvDfiqgRaxlqZs9WJAbSA7g==",
+          "version": "3.1.1",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.1.1.tgz",
+          "integrity": "sha1-e3gdjlKeSQzz5hB5eh+7fuZx01s=",
           "dependencies": {
-            "chalk": {
-              "version": "2.0.1",
-              "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.0.1.tgz",
-              "integrity": "sha512-Mp+FXEI+FrwY/XYV45b2YD3E8i3HwnEAoFcM0qlZzq/RZ9RwWitt2Y/c7cqRAz70U7hfekqx6qNYthuKFO6K0g=="
+            "tslint": {
+              "version": "4.5.1",
+              "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.5.1.tgz",
+              "integrity": "sha1-BTVocb7yOkNJBnNABvwYgza6gks="
             }
           }
         },
-        "camelcase": {
-          "version": "4.1.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
-          "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
+        "@types/chai": {
+          "version": "3.4.34",
+          "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz",
+          "integrity": "sha1-1TNXkoI7sJzd1eOMPSEbcJGDhU0="
+        },
+        "@types/mocha": {
+          "version": "2.2.38",
+          "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz",
+          "integrity": "sha1-jBiPbjTC58Px0BJ9kI1aNuWmDck="
+        },
+        "ansi-align": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-1.1.0.tgz",
+          "integrity": "sha1-LwwWWIKXOa3V67FeawxuNCPwFro="
         },
-        "clean-css": {
-          "version": "4.1.7",
-          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.7.tgz",
-          "integrity": "sha1-ua6k+FZ5iJzz6ui0A0nsTr390DI="
+        "boxen": {
+          "version": "0.6.0",
+          "resolved": "https://registry.npmjs.org/boxen/-/boxen-0.6.0.tgz",
+          "integrity": "sha1-g2TUJIrDT/DvGy8r9JpsYM4NgbY="
         },
         "configstore": {
-          "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.0.tgz",
-          "integrity": "sha1-Rd+QcHPibfoc9LLVL1tgVF6qEdE="
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/configstore/-/configstore-2.1.0.tgz",
+          "integrity": "sha1-c3o6cDbpiGECqmCZ5HuzOrGroaE="
         },
         "dot-prop": {
-          "version": "4.1.1",
-          "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-4.1.1.tgz",
-          "integrity": "sha1-qEk/C3te7sglJbXHWH+n3nyoWcE="
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-3.0.0.tgz",
+          "integrity": "sha1-G3CK8JSknJoOfbyteQq6U52sEXc="
+        },
+        "duplexer2": {
+          "version": "0.1.4",
+          "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.1.4.tgz",
+          "integrity": "sha1-ixLauHjA1p4+eJEFFmKjL8a93ME="
         },
         "findup-sync": {
           "version": "0.3.0",
@@ -634,281 +751,287 @@
           }
         },
         "got": {
-          "version": "6.7.1",
-          "resolved": "https://registry.npmjs.org/got/-/got-6.7.1.tgz",
-          "integrity": "sha1-JAzQV4WpoY5WHcG0S0HHY+8ejbA="
-        },
-        "gulp-clean-css": {
-          "version": "3.0.4",
-          "resolved": "https://registry.npmjs.org/gulp-clean-css/-/gulp-clean-css-3.0.4.tgz",
-          "integrity": "sha1-DFrY0EVAfIjzwrnwNXCWOWfc/VQ="
+          "version": "5.7.1",
+          "resolved": "https://registry.npmjs.org/got/-/got-5.7.1.tgz",
+          "integrity": "sha1-X4FjWmHkplifGAVp6k44FoClHzU="
         },
-        "gulp-postcss": {
-          "version": "6.3.0",
-          "resolved": "https://registry.npmjs.org/gulp-postcss/-/gulp-postcss-6.3.0.tgz",
-          "integrity": "sha1-M+6XI+WcMC8z1wf8S3OYsQ8DK/8="
-        },
-        "gulp-sass": {
-          "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/gulp-sass/-/gulp-sass-3.1.0.tgz",
-          "integrity": "sha1-U9xLaKH13f5EJKtMJHZVJpqLdLc="
-        },
-        "has-flag": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
-          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
-        },
-        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
-          "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8="
+        "isarray": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "latest-version": {
-          "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-3.1.0.tgz",
-          "integrity": "sha1-ogU4P+oyKzO1rjsYq+4NwvNW7hU="
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-2.0.0.tgz",
+          "integrity": "sha1-VvjWE5YghHuAF/jx9NeOIRMkFos="
         },
         "package-json": {
-          "version": "4.0.1",
-          "resolved": "https://registry.npmjs.org/package-json/-/package-json-4.0.1.tgz",
-          "integrity": "sha1-iGmgQBJTZhxMTKPabCEh7VVfXu0="
-        },
-        "postcss-modules": {
-          "version": "0.6.4",
-          "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.6.4.tgz",
-          "integrity": "sha1-d6WLt3uhtDkrJwwLWYUv116JqLQ="
+          "version": "2.4.0",
+          "resolved": "https://registry.npmjs.org/package-json/-/package-json-2.4.0.tgz",
+          "integrity": "sha1-DRW9Z9HLvduyyiIv8u24a8sxqLs="
         },
-        "string-width": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.0.tgz",
-          "integrity": "sha1-AwZkVh/BRslCPsfZeP4kV0N/5tA="
+        "readable-stream": {
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
-        "strip-ansi": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
-          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8="
+        "rimraf": {
+          "version": "2.5.4",
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
+          "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
         },
-        "supports-color": {
-          "version": "4.2.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.0.tgz",
-          "integrity": "sha512-Ts0Mu/A1S1aZxEJNG88I4Oc9rcZSBFNac5e27yh4j2mqbhZSSzR1Ah79EYwSn9Zuh7lrlGD2cVGzw1RKGzyLSg=="
+        "string_decoder": {
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         },
         "timed-out": {
-          "version": "4.0.1",
-          "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-4.0.1.tgz",
-          "integrity": "sha1-8y6srFoXW+ol1/q1Zas+2HQe9W8="
+          "version": "3.1.3",
+          "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-3.1.3.tgz",
+          "integrity": "sha1-lYYL/MXHbCd/j4Mm/Q9bLiDrohc="
         },
         "tslint": {
-          "version": "4.5.1",
-          "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.5.1.tgz",
-          "integrity": "sha1-BTVocb7yOkNJBnNABvwYgza6gks="
+          "version": "4.0.2",
+          "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.0.2.tgz",
+          "integrity": "sha1-1D8kwMH4Jt5/Ogl7t4CKi0Ml/qw=",
+          "dependencies": {
+            "update-notifier": {
+              "version": "1.0.3",
+              "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-1.0.3.tgz",
+              "integrity": "sha1-j5LFFUgr1oMbfJMBPnD4dVLHz1o="
+            }
+          }
+        },
+        "tslint-microsoft-contrib": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/tslint-microsoft-contrib/-/tslint-microsoft-contrib-4.0.0.tgz",
+          "integrity": "sha1-fgClbBQXJR0/kaiA78xDNhpp+yo="
+        },
+        "tsutils": {
+          "version": "1.9.1",
+          "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-1.9.1.tgz",
+          "integrity": "sha1-ufmrROVa+WgYMdXyjQrur1x1DLA="
+        },
+        "typescript": {
+          "version": "2.2.2",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz",
+          "integrity": "sha1-YGAiUIR5tV/6NotY/uljoD39eww="
         },
         "unzip-response": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-2.0.1.tgz",
-          "integrity": "sha1-0vD3N9FrBhXnKmk17QQhRXLVb5c="
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-1.0.2.tgz",
+          "integrity": "sha1-uYTwh3/AqJwsdzzB73tbIytbBv4="
         },
-        "update-notifier": {
-          "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-2.2.0.tgz",
-          "integrity": "sha1-G1g3z5DAc22IYncytmHBOPht5y8="
+        "uuid": {
+          "version": "2.0.3",
+          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz",
+          "integrity": "sha1-Z+LoY3lyFVMN/zGOW/nc6/1Hsho="
         },
         "write-file-atomic": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.1.0.tgz",
-          "integrity": "sha512-0TZ20a+xcIl4u0+Mj5xDH2yOWdmQiXlKf9Hm+TgDXjTMsEYb+gDrmb8e8UNAzMCitX8NBqG4Z/FUQIyzv/R1JQ=="
+          "version": "1.3.4",
+          "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-1.3.4.tgz",
+          "integrity": "sha1-+Aek8LHZ6ROuekgRLmzDrxmRtF8="
         },
         "xdg-basedir": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-3.0.0.tgz",
-          "integrity": "sha1-SWsswQnsqNus/i3HK2A8F8WHCtQ="
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-2.0.0.tgz",
+          "integrity": "sha1-7byQPMOF/ARSPZZqM1UEtVBNG9I="
         }
       }
     },
-    "@rush-temp/example-app-base": {
-      "version": "file:projects\\example-app-base",
+    "@microsoft/stream-collator": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/@microsoft/stream-collator/-/stream-collator-2.0.3.tgz",
+      "integrity": "sha1-fmBfGON9Pa9hQXd+zTLu34g4/ts="
+    },
+    "@microsoft/web-library-build": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/@microsoft/web-library-build/-/web-library-build-3.2.1.tgz",
+      "integrity": "sha1-pHzwmHWUUKnExeo7n3ZSwJ1pp+Y=",
       "dependencies": {
-        "acorn": {
-          "version": "5.0.3",
-          "bundled": true
+        "@microsoft/gulp-core-build-karma": {
+          "version": "2.3.2",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-karma/-/gulp-core-build-karma-2.3.2.tgz",
+          "integrity": "sha1-7FSGE/FZgGVYzrLSLnZ4Ng4eCY8="
         },
-        "ajv": {
-          "version": "5.2.0",
-          "bundled": true
+        "@microsoft/gulp-core-build-sass": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.2.3.tgz",
+          "integrity": "sha1-v9N28057coiLtpfcz7XstDgeuDY="
         },
-        "async": {
-          "version": "0.9.2",
-          "bundled": true
+        "@microsoft/gulp-core-build-serve": {
+          "version": "2.1.5",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-serve/-/gulp-core-build-serve-2.1.5.tgz",
+          "integrity": "sha1-oNH517yG4lnBv8U1mLfDDZavPgs="
+        },
+        "@microsoft/gulp-core-build-webpack": {
+          "version": "1.2.2",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-webpack/-/gulp-core-build-webpack-1.2.2.tgz",
+          "integrity": "sha1-DEER3hfzc9RTNtOCftuKngnVRjU="
+        },
+        "autoprefixer": {
+          "version": "6.3.7",
+          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz",
+          "integrity": "sha1-jt8xZt2f1hFlM2Ysi7NqA8DvyHQ="
         },
         "camelcase": {
-          "version": "3.0.0",
-          "bundled": true
+          "version": "1.2.1",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
+          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
+        },
+        "cliui": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
+          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE="
         },
         "commander": {
           "version": "2.9.0",
-          "bundled": true
-        },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "crypto-browserify": {
-          "version": "3.11.0",
-          "bundled": true
+          "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
+          "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q="
         },
         "debug": {
           "version": "2.6.0",
-          "bundled": true
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz",
+          "integrity": "sha1-vFlryr52F/Edn6FTYe3tVgi4SZs="
         },
         "diff": {
           "version": "3.2.0",
-          "bundled": true
-        },
-        "enhanced-resolve": {
-          "version": "3.1.0",
-          "bundled": true
+          "resolved": "https://registry.npmjs.org/diff/-/diff-3.2.0.tgz",
+          "integrity": "sha1-yc45Okt8vQsFinJck98pkCeGj/k="
         },
         "glob": {
           "version": "7.1.1",
-          "bundled": true
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz",
+          "integrity": "sha1-gFIR3wT6rxxjo2ADBs31reULLsg="
         },
-        "https-browserify": {
-          "version": "0.0.1",
-          "bundled": true
+        "interpret": {
+          "version": "0.6.6",
+          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz",
+          "integrity": "sha1-/s16GOfOXKar+5U+H4YhOknxYls="
         },
         "isarray": {
           "version": "1.0.0",
-          "bundled": true
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
-        "loader-utils": {
-          "version": "0.2.17",
-          "bundled": true
+        "karma-sinon-chai": {
+          "version": "1.2.4",
+          "resolved": "https://registry.npmjs.org/karma-sinon-chai/-/karma-sinon-chai-1.2.4.tgz",
+          "integrity": "sha1-/qk19ivjNmzwJxyNi+UcDHDkCrw=",
+          "dependencies": {
+            "lolex": {
+              "version": "1.6.0",
+              "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
+              "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
+            }
+          }
+        },
+        "memory-fs": {
+          "version": "0.3.0",
+          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz",
+          "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
         },
         "mocha": {
-          "version": "3.3.0",
-          "bundled": true
+          "version": "3.4.2",
+          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.4.2.tgz",
+          "integrity": "sha1-0O9NMyEm2/GNDWQMmzgt1IvpdZQ="
         },
         "ms": {
           "version": "0.7.2",
-          "bundled": true
-        },
-        "node-libs-browser": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "os-browserify": {
-          "version": "0.2.1",
-          "bundled": true
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
+          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
         },
         "readable-stream": {
-          "version": "2.3.0",
-          "bundled": true,
-          "dependencies": {
-            "string_decoder": {
-              "version": "1.0.2",
-              "bundled": true,
-              "dependencies": {
-                "safe-buffer": {
-                  "version": "5.0.1",
-                  "bundled": true
-                }
-              }
-            }
-          }
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
+        "sinon": {
+          "version": "1.17.7",
+          "resolved": "https://registry.npmjs.org/sinon/-/sinon-1.17.7.tgz",
+          "integrity": "sha1-RUKk9JugxFwF6y6d2dID4rjv4L8=",
+          "dependencies": {
+            "lolex": {
+              "version": "1.3.2",
+              "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.3.2.tgz",
+              "integrity": "sha1-fD2mL/yzDw9agKJWbKJORdigHzE="
+            }
+          }
         },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true
+        "sinon-chai": {
+          "version": "2.8.0",
+          "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.8.0.tgz",
+          "integrity": "sha1-Qyqbv9Uab8AHmPTSUmqCnAYGh6w="
         },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "bundled": true
+        "string_decoder": {
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         },
         "supports-color": {
           "version": "3.1.2",
-          "bundled": true
-        },
-        "tapable": {
-          "version": "0.2.6",
-          "bundled": true
-        },
-        "timers-browserify": {
-          "version": "2.0.2",
-          "bundled": true
-        },
-        "url": {
-          "version": "0.11.0",
-          "bundled": true,
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "bundled": true
-            }
-          }
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz",
+          "integrity": "sha1-cqJiiU2dQIuVbKBf83su2KbiotU="
         },
-        "watchpack": {
-          "version": "1.3.1",
-          "bundled": true,
+        "uglify-js": {
+          "version": "2.7.5",
+          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.7.5.tgz",
+          "integrity": "sha1-RhLAx7qu4rp8SH3kkErhIgefLKg=",
           "dependencies": {
             "async": {
-              "version": "2.4.1",
-              "bundled": true
+              "version": "0.2.10",
+              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz",
+              "integrity": "sha1-trvgsGdLnXGXCMo43owjfLUmw9E="
             }
           }
         },
         "webpack": {
-          "version": "2.6.1",
-          "bundled": true,
-          "dependencies": {
-            "ajv": {
-              "version": "4.11.8",
-              "bundled": true
-            },
-            "async": {
-              "version": "2.4.1",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "0.2.17",
-              "bundled": true
-            },
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            }
-          }
+          "version": "1.13.3",
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz",
+          "integrity": "sha1-55xG/lo3xcpwCEugiUxZXNy0KBU="
         },
-        "yargs": {
-          "version": "6.6.0",
-          "bundled": true
+        "window-size": {
+          "version": "0.1.0",
+          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
+          "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
         },
-        "yargs-parser": {
-          "version": "4.2.1",
-          "bundled": true
+        "wordwrap": {
+          "version": "0.0.2",
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
+          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
+        },
+        "yargs": {
+          "version": "3.10.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
+          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
         }
       }
     },
-    "@rush-temp/example-component": {
-      "version": "file:projects\\example-component",
+    "@rush-temp/example-app-base": {
+      "version": "file:projects/example-app-base",
       "dependencies": {
         "acorn": {
-          "version": "5.0.3",
+          "version": "5.1.1",
           "bundled": true
         },
         "ajv": {
-          "version": "5.2.0",
+          "version": "5.2.2",
+          "bundled": true
+        },
+        "ajv-keywords": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "ansi-regex": {
+          "version": "3.0.0",
           "bundled": true
         },
         "async": {
-          "version": "2.4.1",
+          "version": "0.9.2",
           "bundled": true
         },
         "camelcase": {
-          "version": "3.0.0",
+          "version": "4.1.0",
           "bundled": true
         },
         "commander": {
@@ -920,7 +1043,7 @@
           "bundled": true
         },
         "crypto-browserify": {
-          "version": "3.11.0",
+          "version": "3.11.1",
           "bundled": true
         },
         "debug": {
@@ -932,7 +1055,11 @@
           "bundled": true
         },
         "enhanced-resolve": {
-          "version": "3.1.0",
+          "version": "3.4.1",
+          "bundled": true
+        },
+        "find-up": {
+          "version": "2.1.0",
           "bundled": true
         },
         "glob": {
@@ -943,16 +1070,20 @@
           "version": "0.0.1",
           "bundled": true
         },
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "bundled": true
+        },
         "isarray": {
           "version": "1.0.0",
           "bundled": true
         },
-        "loader-utils": {
-          "version": "1.1.0",
+        "load-json-file": {
+          "version": "2.0.0",
           "bundled": true
         },
         "mocha": {
-          "version": "3.4.2",
+          "version": "3.3.0",
           "bundled": true
         },
         "ms": {
@@ -967,36 +1098,76 @@
           "version": "0.2.1",
           "bundled": true
         },
+        "os-locale": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "path-type": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg-up": {
+          "version": "2.0.0",
+          "bundled": true
+        },
         "readable-stream": {
-          "version": "2.2.11",
+          "version": "2.3.3",
           "bundled": true,
           "dependencies": {
             "string_decoder": {
-              "version": "1.0.2",
+              "version": "1.0.3",
               "bundled": true
             }
           }
         },
-        "safe-buffer": {
-          "version": "5.0.1",
+        "source-list-map": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "source-map": {
+          "version": "0.1.43",
+          "bundled": true
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
           "bundled": true
         },
         "stream-browserify": {
           "version": "2.0.1",
           "bundled": true
         },
+        "string-width": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "bundled": true
+        },
+        "strip-bom": {
+          "version": "3.0.0",
+          "bundled": true
+        },
         "supports-color": {
           "version": "3.1.2",
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.6",
+          "version": "0.2.7",
           "bundled": true
         },
         "timers-browserify": {
           "version": "2.0.2",
           "bundled": true
         },
+        "typescript": {
+          "version": "2.4.2",
+          "bundled": true
+        },
         "url": {
           "version": "0.11.0",
           "bundled": true,
@@ -1008,42 +1179,70 @@
           }
         },
         "watchpack": {
-          "version": "1.3.1",
-          "bundled": true
+          "version": "1.4.0",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            }
+          }
         },
         "webpack": {
-          "version": "2.6.1",
+          "version": "3.4.1",
           "bundled": true,
           "dependencies": {
-            "ajv": {
-              "version": "4.11.8",
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            },
+            "has-flag": {
+              "version": "2.0.0",
               "bundled": true
             },
             "loader-utils": {
-              "version": "0.2.17",
+              "version": "1.1.0",
+              "bundled": true
+            },
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "4.2.1",
+              "bundled": true
+            }
+          }
+        },
+        "webpack-sources": {
+          "version": "1.0.1",
+          "bundled": true,
+          "dependencies": {
+            "source-map": {
+              "version": "0.5.6",
               "bundled": true
             }
           }
         },
+        "which-module": {
+          "version": "2.0.0",
+          "bundled": true
+        },
         "yargs": {
-          "version": "6.6.0",
+          "version": "8.0.2",
           "bundled": true
         },
         "yargs-parser": {
-          "version": "4.2.1",
+          "version": "7.0.0",
           "bundled": true
         }
       }
     },
     "@rush-temp/fabric-website": {
-      "version": "file:projects\\fabric-website",
+      "version": "file:projects/fabric-website",
       "dependencies": {
-        "@types/react": {
-          "version": "15.0.29",
-          "bundled": true
-        },
         "@types/react-addons-test-utils": {
-          "version": "0.14.17",
+          "version": "0.14.19",
           "bundled": true
         },
         "async": {
@@ -1070,10 +1269,6 @@
           "version": "9.11.0",
           "bundled": true
         },
-        "loader-utils": {
-          "version": "0.2.17",
-          "bundled": true
-        },
         "mocha": {
           "version": "3.3.0",
           "bundled": true
@@ -1093,18 +1288,30 @@
         "supports-color": {
           "version": "3.1.2",
           "bundled": true
+        },
+        "typescript": {
+          "version": "2.4.2",
+          "bundled": true
         }
       }
     },
     "@rush-temp/office-ui-fabric-react": {
-      "version": "file:projects\\office-ui-fabric-react",
+      "version": "file:projects/office-ui-fabric-react",
       "dependencies": {
         "acorn": {
-          "version": "5.0.3",
+          "version": "5.1.1",
           "bundled": true
         },
         "ajv": {
-          "version": "5.2.0",
+          "version": "5.2.2",
+          "bundled": true
+        },
+        "ajv-keywords": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "ansi-regex": {
+          "version": "3.0.0",
           "bundled": true
         },
         "async": {
@@ -1112,7 +1319,7 @@
           "bundled": true
         },
         "camelcase": {
-          "version": "3.0.0",
+          "version": "4.1.0",
           "bundled": true
         },
         "commander": {
@@ -1124,7 +1331,7 @@
           "bundled": true
         },
         "crypto-browserify": {
-          "version": "3.11.0",
+          "version": "3.11.1",
           "bundled": true
         },
         "debug": {
@@ -1136,28 +1343,50 @@
           "bundled": true
         },
         "enhanced-resolve": {
-          "version": "3.1.0",
+          "version": "3.4.1",
+          "bundled": true
+        },
+        "find-up": {
+          "version": "2.1.0",
           "bundled": true
         },
         "glob": {
           "version": "7.1.1",
           "bundled": true
         },
+        "has-flag": {
+          "version": "2.0.0",
+          "bundled": true
+        },
         "https-browserify": {
           "version": "0.0.1",
           "bundled": true
         },
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "bundled": true
+        },
         "isarray": {
           "version": "1.0.0",
           "bundled": true
         },
-        "loader-utils": {
-          "version": "0.2.17",
+        "load-json-file": {
+          "version": "2.0.0",
           "bundled": true
         },
         "mocha": {
           "version": "3.4.2",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "has-flag": {
+              "version": "1.0.0",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "3.1.2",
+              "bundled": true
+            }
+          }
         },
         "ms": {
           "version": "0.7.2",
@@ -1171,18 +1400,34 @@
           "version": "0.2.1",
           "bundled": true
         },
-        "readable-stream": {
-          "version": "2.2.11",
-          "bundled": true,
-          "dependencies": {
-            "string_decoder": {
-              "version": "1.0.2",
-              "bundled": true
-            }
+        "os-locale": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "path-type": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg-up": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "readable-stream": {
+          "version": "2.3.3",
+          "bundled": true,
+          "dependencies": {
+            "string_decoder": {
+              "version": "1.0.3",
+              "bundled": true
+            }
           }
         },
-        "safe-buffer": {
-          "version": "5.0.1",
+        "source-list-map": {
+          "version": "2.0.0",
           "bundled": true
         },
         "source-map": {
@@ -1197,18 +1442,34 @@
           "version": "2.0.1",
           "bundled": true
         },
+        "string-width": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "bundled": true
+        },
+        "strip-bom": {
+          "version": "3.0.0",
+          "bundled": true
+        },
         "supports-color": {
-          "version": "3.1.2",
+          "version": "4.2.1",
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.6",
+          "version": "0.2.7",
           "bundled": true
         },
         "timers-browserify": {
           "version": "2.0.2",
           "bundled": true
         },
+        "typescript": {
+          "version": "2.4.2",
+          "bundled": true
+        },
         "url": {
           "version": "0.11.0",
           "bundled": true,
@@ -1220,29 +1481,25 @@
           }
         },
         "watchpack": {
-          "version": "1.3.1",
+          "version": "1.4.0",
           "bundled": true,
           "dependencies": {
             "async": {
-              "version": "2.4.1",
+              "version": "2.5.0",
               "bundled": true
             }
           }
         },
         "webpack": {
-          "version": "2.6.1",
+          "version": "3.4.1",
           "bundled": true,
           "dependencies": {
-            "ajv": {
-              "version": "4.11.8",
-              "bundled": true
-            },
             "async": {
-              "version": "2.4.1",
+              "version": "2.5.0",
               "bundled": true
             },
             "loader-utils": {
-              "version": "0.2.17",
+              "version": "1.1.0",
               "bundled": true
             },
             "source-map": {
@@ -1251,36 +1508,58 @@
             }
           }
         },
+        "webpack-sources": {
+          "version": "1.0.1",
+          "bundled": true,
+          "dependencies": {
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
+        },
+        "which-module": {
+          "version": "2.0.0",
+          "bundled": true
+        },
         "yargs": {
-          "version": "6.6.0",
+          "version": "8.0.2",
           "bundled": true
         },
         "yargs-parser": {
-          "version": "4.2.1",
+          "version": "7.0.0",
           "bundled": true
         }
       }
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
-      "version": "file:projects\\office-ui-fabric-react-tslint"
+      "version": "file:projects/office-ui-fabric-react-tslint"
     },
     "@rush-temp/ssr-tests": {
-      "version": "file:projects\\ssr-tests",
+      "version": "file:projects/ssr-tests",
       "dependencies": {
         "acorn": {
-          "version": "5.0.3",
+          "version": "5.1.1",
           "bundled": true
         },
         "ajv": {
-          "version": "5.2.0",
+          "version": "5.2.2",
+          "bundled": true
+        },
+        "ajv-keywords": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "ansi-regex": {
+          "version": "3.0.0",
           "bundled": true
         },
         "async": {
-          "version": "2.4.1",
+          "version": "2.5.0",
           "bundled": true
         },
         "camelcase": {
-          "version": "3.0.0",
+          "version": "4.1.0",
           "bundled": true
         },
         "commander": {
@@ -1292,7 +1571,7 @@
           "bundled": true
         },
         "crypto-browserify": {
-          "version": "3.11.0",
+          "version": "3.11.1",
           "bundled": true
         },
         "debug": {
@@ -1304,7 +1583,11 @@
           "bundled": true
         },
         "enhanced-resolve": {
-          "version": "3.1.0",
+          "version": "3.4.1",
+          "bundled": true
+        },
+        "find-up": {
+          "version": "2.1.0",
           "bundled": true
         },
         "glob": {
@@ -1315,10 +1598,18 @@
           "version": "0.0.1",
           "bundled": true
         },
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "bundled": true
+        },
         "isarray": {
           "version": "1.0.0",
           "bundled": true
         },
+        "load-json-file": {
+          "version": "2.0.0",
+          "bundled": true
+        },
         "loader-utils": {
           "version": "1.1.0",
           "bundled": true
@@ -1339,30 +1630,58 @@
           "version": "0.2.1",
           "bundled": true
         },
+        "os-locale": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "path-type": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg-up": {
+          "version": "2.0.0",
+          "bundled": true
+        },
         "readable-stream": {
-          "version": "2.2.11",
+          "version": "2.3.3",
           "bundled": true,
           "dependencies": {
             "string_decoder": {
-              "version": "1.0.2",
+              "version": "1.0.3",
               "bundled": true
             }
           }
         },
-        "safe-buffer": {
-          "version": "5.0.1",
+        "source-list-map": {
+          "version": "2.0.0",
           "bundled": true
         },
         "stream-browserify": {
           "version": "2.0.1",
           "bundled": true
         },
+        "string-width": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "bundled": true
+        },
+        "strip-bom": {
+          "version": "3.0.0",
+          "bundled": true
+        },
         "supports-color": {
           "version": "3.1.2",
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.6",
+          "version": "0.2.7",
           "bundled": true
         },
         "timers-browserify": {
@@ -1380,46 +1699,62 @@
           }
         },
         "watchpack": {
-          "version": "1.3.1",
+          "version": "1.4.0",
           "bundled": true
         },
         "webpack": {
-          "version": "2.6.1",
+          "version": "3.4.1",
           "bundled": true,
           "dependencies": {
-            "ajv": {
-              "version": "4.11.8",
+            "has-flag": {
+              "version": "2.0.0",
               "bundled": true
             },
-            "loader-utils": {
-              "version": "0.2.17",
+            "supports-color": {
+              "version": "4.2.1",
               "bundled": true
             }
           }
         },
+        "webpack-sources": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "which-module": {
+          "version": "2.0.0",
+          "bundled": true
+        },
         "yargs": {
-          "version": "6.6.0",
+          "version": "8.0.2",
           "bundled": true
         },
         "yargs-parser": {
-          "version": "4.2.1",
+          "version": "7.0.0",
           "bundled": true
         }
       }
     },
     "@rush-temp/styling": {
-      "version": "file:projects\\styling",
+      "version": "file:projects/styling",
       "dependencies": {
         "@uifabric/utilities": {
-          "version": "1.10.2",
+          "version": "1.10.4",
           "bundled": true
         },
         "acorn": {
-          "version": "5.0.3",
+          "version": "5.1.1",
           "bundled": true
         },
         "ajv": {
-          "version": "5.2.0",
+          "version": "5.2.2",
+          "bundled": true
+        },
+        "ajv-keywords": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "ansi-regex": {
+          "version": "3.0.0",
           "bundled": true
         },
         "async": {
@@ -1427,7 +1762,7 @@
           "bundled": true
         },
         "camelcase": {
-          "version": "3.0.0",
+          "version": "4.1.0",
           "bundled": true
         },
         "commander": {
@@ -1439,7 +1774,7 @@
           "bundled": true
         },
         "crypto-browserify": {
-          "version": "3.11.0",
+          "version": "3.11.1",
           "bundled": true
         },
         "debug": {
@@ -1451,28 +1786,50 @@
           "bundled": true
         },
         "enhanced-resolve": {
-          "version": "3.1.0",
+          "version": "3.4.1",
+          "bundled": true
+        },
+        "find-up": {
+          "version": "2.1.0",
           "bundled": true
         },
         "glob": {
           "version": "7.1.1",
           "bundled": true
         },
+        "has-flag": {
+          "version": "2.0.0",
+          "bundled": true
+        },
         "https-browserify": {
           "version": "0.0.1",
           "bundled": true
         },
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "bundled": true
+        },
         "isarray": {
           "version": "1.0.0",
           "bundled": true
         },
-        "loader-utils": {
-          "version": "0.2.17",
+        "load-json-file": {
+          "version": "2.0.0",
           "bundled": true
         },
         "mocha": {
           "version": "3.4.2",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "has-flag": {
+              "version": "1.0.0",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "3.1.2",
+              "bundled": true
+            }
+          }
         },
         "ms": {
           "version": "0.7.2",
@@ -1490,18 +1847,34 @@
           "version": "0.2.1",
           "bundled": true
         },
+        "os-locale": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "path-type": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg-up": {
+          "version": "2.0.0",
+          "bundled": true
+        },
         "readable-stream": {
-          "version": "2.2.11",
+          "version": "2.3.3",
           "bundled": true,
           "dependencies": {
             "string_decoder": {
-              "version": "1.0.2",
+              "version": "1.0.3",
               "bundled": true
             }
           }
         },
-        "safe-buffer": {
-          "version": "5.0.1",
+        "source-list-map": {
+          "version": "2.0.0",
           "bundled": true
         },
         "source-map": {
@@ -1516,18 +1889,34 @@
           "version": "2.0.1",
           "bundled": true
         },
+        "string-width": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "bundled": true
+        },
+        "strip-bom": {
+          "version": "3.0.0",
+          "bundled": true
+        },
         "supports-color": {
-          "version": "3.1.2",
+          "version": "4.2.1",
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.6",
+          "version": "0.2.7",
           "bundled": true
         },
         "timers-browserify": {
           "version": "2.0.2",
           "bundled": true
         },
+        "typescript": {
+          "version": "2.4.2",
+          "bundled": true
+        },
         "url": {
           "version": "0.11.0",
           "bundled": true,
@@ -1539,29 +1928,25 @@
           }
         },
         "watchpack": {
-          "version": "1.3.1",
+          "version": "1.4.0",
           "bundled": true,
           "dependencies": {
             "async": {
-              "version": "2.4.1",
+              "version": "2.5.0",
               "bundled": true
             }
           }
         },
         "webpack": {
-          "version": "2.6.1",
+          "version": "3.4.1",
           "bundled": true,
           "dependencies": {
-            "ajv": {
-              "version": "4.11.8",
-              "bundled": true
-            },
             "async": {
-              "version": "2.4.1",
+              "version": "2.5.0",
               "bundled": true
             },
             "loader-utils": {
-              "version": "0.2.17",
+              "version": "1.1.0",
               "bundled": true
             },
             "source-map": {
@@ -1570,29 +1955,47 @@
             }
           }
         },
+        "webpack-sources": {
+          "version": "1.0.1",
+          "bundled": true,
+          "dependencies": {
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
+        },
+        "which-module": {
+          "version": "2.0.0",
+          "bundled": true
+        },
         "yargs": {
-          "version": "6.6.0",
+          "version": "8.0.2",
           "bundled": true
         },
         "yargs-parser": {
-          "version": "4.2.1",
+          "version": "7.0.0",
           "bundled": true
         }
       }
     },
     "@rush-temp/test-bundle-button": {
-      "version": "file:projects\\test-bundle-button",
+      "version": "file:projects/test-bundle-button",
       "dependencies": {
         "acorn": {
-          "version": "5.0.3",
+          "version": "5.1.1",
           "bundled": true
         },
         "ajv": {
-          "version": "5.2.0",
+          "version": "5.2.2",
           "bundled": true
         },
         "ajv-keywords": {
-          "version": "1.5.1",
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "ansi-regex": {
+          "version": "3.0.0",
           "bundled": true
         },
         "async": {
@@ -1600,7 +2003,7 @@
           "bundled": true
         },
         "camelcase": {
-          "version": "3.0.0",
+          "version": "4.1.0",
           "bundled": true
         },
         "constants-browserify": {
@@ -1608,23 +2011,35 @@
           "bundled": true
         },
         "crypto-browserify": {
-          "version": "3.11.0",
+          "version": "3.11.1",
           "bundled": true
         },
         "enhanced-resolve": {
-          "version": "3.1.0",
+          "version": "3.4.1",
+          "bundled": true
+        },
+        "find-up": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "has-flag": {
+          "version": "2.0.0",
           "bundled": true
         },
         "https-browserify": {
           "version": "0.0.1",
           "bundled": true
         },
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "bundled": true
+        },
         "isarray": {
           "version": "1.0.0",
           "bundled": true
         },
-        "loader-utils": {
-          "version": "0.2.17",
+        "load-json-file": {
+          "version": "2.0.0",
           "bundled": true
         },
         "node-libs-browser": {
@@ -1635,8 +2050,24 @@
           "version": "0.2.1",
           "bundled": true
         },
-        "readable-stream": {
-          "version": "2.3.2",
+        "os-locale": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "path-type": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg-up": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "readable-stream": {
+          "version": "2.3.3",
           "bundled": true,
           "dependencies": {
             "string_decoder": {
@@ -1646,7 +2077,7 @@
           }
         },
         "source-list-map": {
-          "version": "1.1.2",
+          "version": "2.0.0",
           "bundled": true
         },
         "source-map": {
@@ -1661,18 +2092,34 @@
           "version": "2.0.1",
           "bundled": true
         },
+        "string-width": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "bundled": true
+        },
+        "strip-bom": {
+          "version": "3.0.0",
+          "bundled": true
+        },
         "supports-color": {
-          "version": "3.2.3",
+          "version": "4.2.1",
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.6",
+          "version": "0.2.7",
           "bundled": true
         },
         "timers-browserify": {
           "version": "2.0.2",
           "bundled": true
         },
+        "typescript": {
+          "version": "2.4.2",
+          "bundled": true
+        },
         "url": {
           "version": "0.11.0",
           "bundled": true,
@@ -1684,57 +2131,35 @@
           }
         },
         "watchpack": {
-          "version": "1.3.1",
+          "version": "1.4.0",
           "bundled": true,
           "dependencies": {
             "async": {
-              "version": "2.4.1",
+              "version": "2.5.0",
               "bundled": true
             }
           }
         },
         "webpack": {
-          "version": "2.6.1",
+          "version": "3.4.1",
           "bundled": true,
           "dependencies": {
-            "ajv": {
-              "version": "4.11.8",
-              "bundled": true
-            },
-            "ajv-keywords": {
-              "version": "1.5.1",
-              "bundled": true
-            },
             "async": {
               "version": "2.5.0",
               "bundled": true
             },
             "loader-utils": {
-              "version": "0.2.17",
-              "bundled": true
-            },
-            "source-list-map": {
-              "version": "2.0.0",
+              "version": "1.1.0",
               "bundled": true
             },
             "source-map": {
               "version": "0.5.6",
               "bundled": true
-            },
-            "webpack-sources": {
-              "version": "0.2.3",
-              "bundled": true,
-              "dependencies": {
-                "source-list-map": {
-                  "version": "1.1.2",
-                  "bundled": true
-                }
-              }
             }
           }
         },
         "webpack-sources": {
-          "version": "0.2.3",
+          "version": "1.0.1",
           "bundled": true,
           "dependencies": {
             "source-map": {
@@ -1743,21 +2168,31 @@
             }
           }
         },
+        "which-module": {
+          "version": "2.0.0",
+          "bundled": true
+        },
         "yargs": {
-          "version": "6.6.0",
+          "version": "8.0.2",
           "bundled": true
         },
         "yargs-parser": {
-          "version": "4.2.1",
+          "version": "7.0.0",
           "bundled": true
         }
       }
     },
     "@rush-temp/todo-app": {
-      "version": "file:projects\\todo-app"
+      "version": "file:projects/todo-app",
+      "dependencies": {
+        "typescript": {
+          "version": "2.4.2",
+          "bundled": true
+        }
+      }
     },
     "@rush-temp/utilities": {
-      "version": "file:projects\\utilities",
+      "version": "file:projects/utilities",
       "dependencies": {
         "async": {
           "version": "0.9.2",
@@ -1779,10 +2214,6 @@
           "version": "7.1.1",
           "bundled": true
         },
-        "loader-utils": {
-          "version": "0.2.17",
-          "bundled": true
-        },
         "mocha": {
           "version": "3.3.0",
           "bundled": true
@@ -1802,6 +2233,10 @@
         "supports-color": {
           "version": "3.1.2",
           "bundled": true
+        },
+        "typescript": {
+          "version": "2.4.2",
+          "bundled": true
         }
       }
     },
@@ -1930,11 +2365,6 @@
       "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-2.0.29.tgz",
       "integrity": "sha1-UALhT3Xi1x5WQoHfBDHIwbSio2o="
     },
-    "@types/mkdirp": {
-      "version": "0.3.29",
-      "resolved": "https://registry.npmjs.org/@types/mkdirp/-/mkdirp-0.3.29.tgz",
-      "integrity": "sha1-fyrX7FX5FEgvybHsS7GuYCjUYGY="
-    },
     "@types/mocha": {
       "version": "2.2.39",
       "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.39.tgz",
@@ -1971,9 +2401,9 @@
       "integrity": "sha1-vShOV8hPEyXacCur/IKlMoGQwMU="
     },
     "@types/react": {
-      "version": "15.0.29",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.29.tgz",
-      "integrity": "sha512-EL5P9r/q2gIsXJYS0yT9csyfwIMVhs2hnrtevDgSaB86sRmWPFFxIkTuP8wisKRRO6869AVR6dqmuqzFIAIWkg=="
+      "version": "15.0.38",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.38.tgz",
+      "integrity": "sha512-CkRB27L/kMDu7K20U0V7BwYK9/kPd9Im6Jlxv2vAEolYBvQy6JrSpPJsbZXtOk4MoDUomkct8Q7PNBUSLd0fmg=="
     },
     "@types/react-addons-test-utils": {
       "version": "0.14.18",
@@ -1981,9 +2411,9 @@
       "integrity": "sha1-g+EK8dvl7CU1vC3FNz17w7gv3uE="
     },
     "@types/react-dom": {
-      "version": "15.5.0",
-      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-15.5.0.tgz",
-      "integrity": "sha1-f0+5YT1AURQXcyQve2tfGkazS9k="
+      "version": "15.5.1",
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-15.5.1.tgz",
+      "integrity": "sha512-4c+e/QPfvSa48YhgGOcQWoHishTo6BuJqka0Bh8qeLdnK1jS+1Nz8W/w1G17AIjtLxONYFUqmi8qyt+8p/yMFA=="
     },
     "@types/resemblejs": {
       "version": "1.3.28",
@@ -2020,6 +2450,11 @@
       "resolved": "https://registry.npmjs.org/@types/source-map/-/source-map-0.5.0.tgz",
       "integrity": "sha1-3TS72OMv5OdPLj2KwH+KpbRaR6w="
     },
+    "@types/tapable": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/@types/tapable/-/tapable-0.2.3.tgz",
+      "integrity": "sha1-CIiw8gzH5Y4cIqGIi06WPu+qgQo="
+    },
     "@types/through2": {
       "version": "2.0.32",
       "resolved": "https://registry.npmjs.org/@types/through2/-/through2-2.0.32.tgz",
@@ -2036,9 +2471,9 @@
       "integrity": "sha1-kRXAxFxAxXVziQa+n7Tfb1ueUBM="
     },
     "@types/webpack": {
-      "version": "1.12.36",
-      "resolved": "https://registry.npmjs.org/@types/webpack/-/webpack-1.12.36.tgz",
-      "integrity": "sha1-RjSfb7NFSe9HKpbFzsAwpUTyaSQ="
+      "version": "2.2.4",
+      "resolved": "https://registry.npmjs.org/@types/webpack/-/webpack-2.2.4.tgz",
+      "integrity": "sha1-Ba+0r1t+zopNSRAw6Ux2nHqbwRA="
     },
     "@types/webpack-env": {
       "version": "1.13.0",
@@ -2050,11 +2485,6 @@
       "resolved": "https://registry.npmjs.org/@types/webpack-stream/-/webpack-stream-3.2.5.tgz",
       "integrity": "sha1-iwNFN5GCGX+y2prqCpMKzgDRkJs="
     },
-    "@types/whatwg-fetch": {
-      "version": "0.0.30",
-      "resolved": "https://registry.npmjs.org/@types/whatwg-fetch/-/whatwg-fetch-0.0.30.tgz",
-      "integrity": "sha1-6Raex/Gv6gVsOtupnulAIy0O41s="
-    },
     "@types/yargs": {
       "version": "0.0.34",
       "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.34.tgz",
@@ -2066,36 +2496,19 @@
       "integrity": "sha1-LrHQCl5Ow/pYx2r94S4YK2bcXBw="
     },
     "@uifabric/example-app-base": {
-      "version": "1.3.14",
-      "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-1.3.14.tgz",
-      "integrity": "sha1-xme4sp7g4dyDDMBE8sFJFJe+5f4=",
-      "dependencies": {
-        "@uifabric/utilities": {
-          "version": "1.10.2",
-          "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-1.10.2.tgz",
-          "integrity": "sha1-46chhW9rIUDPOXoNRkdwlmrScyQ="
-        },
-        "office-ui-fabric-core": {
-          "version": "5.1.0",
-          "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-5.1.0.tgz",
-          "integrity": "sha1-v49DCOFbNjJEwWc0WygzRRTsCSA="
-        },
-        "office-ui-fabric-react": {
-          "version": "2.34.2",
-          "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-2.34.2.tgz",
-          "integrity": "sha1-+sP1mNQTD3//PprellvW+LOwQ/M="
-        }
-      }
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-4.1.1.tgz",
+      "integrity": "sha512-CFIyoGyfnoC/pEp1exoKAeJuJr8vFc/ldKP0RDtD9IIdEqUBAQiByah6+bGMxntAtD84Osg6WCXcA1DpVlM75g=="
     },
     "@uifabric/styling": {
-      "version": "0.13.9",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.13.9.tgz",
-      "integrity": "sha512-IADXPPUif+hvzqb4cM9I1Wybt0epv5c1kntzi9d1d51NXO/rTptnOGCVLJQom2AhIMtWGkGWSBfGYzBze0dWog=="
+      "version": "0.15.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.15.1.tgz",
+      "integrity": "sha512-57FgCqHJycNhspKZrcV3mzNv36ILntmB3UY5OimsSw7Sw2Lg3yFH28W2hYKRfqOSjm/5fCdreDyMpkaf8kJubg=="
     },
     "@uifabric/utilities": {
-      "version": "4.7.2",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.7.2.tgz",
-      "integrity": "sha512-f5nhpmOrohoAh7VhHcKnF1+0WI+Cjg+rfXFoRy6RPIAbf3/jH2OcKPtqSVqWb0PaQFlgffNXHvH7eEb2+qRX8g=="
+      "version": "4.8.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.8.1.tgz",
+      "integrity": "sha512-ooT8BFqDt0Tg7IV7ZrJ+6b4yvTbNUn/fYi0C+iAqVlugjDpbZ/4qhXo22K2XiP/l5M0eBgkiLoODUFOmX4A+3g=="
     },
     "abbrev": {
       "version": "1.0.9",
@@ -2155,9 +2568,31 @@
       "integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU="
     },
     "ansi-align": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-1.1.0.tgz",
-      "integrity": "sha1-LwwWWIKXOa3V67FeawxuNCPwFro="
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-2.0.0.tgz",
+      "integrity": "sha1-w2rsy6VjuJzrVW82kPCx2eNUf38=",
+      "dependencies": {
+        "ansi-regex": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg="
+        },
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
+          "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8="
+        },
+        "string-width": {
+          "version": "2.1.1",
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
+          "integrity": "sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw=="
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8="
+        }
+      }
     },
     "ansi-escapes": {
       "version": "1.4.0",
@@ -2185,9 +2620,9 @@
       "integrity": "sha1-vgiVmQl7dKXJxKhKDNvNtivYeu8="
     },
     "anymatch": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-1.3.0.tgz",
-      "integrity": "sha1-o+Uvo5FoyCX/V7AkgSbOWo/5VQc="
+      "version": "1.3.2",
+      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-1.3.2.tgz",
+      "integrity": "sha512-0XNayC8lTHQ2OI8aljNCN3sSx6hsr/1+rlcDAotXJR7C1oZZHCNsfpbKwMjRA3Uqb5tF1Rae2oloTr4xpq+WjA=="
     },
     "aproba": {
       "version": "1.1.2",
@@ -2224,14 +2659,7 @@
     "argparse": {
       "version": "1.0.9",
       "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.9.tgz",
-      "integrity": "sha1-c9g7wmP4bpf4zE9rrhsOkKfSLIY=",
-      "dependencies": {
-        "sprintf-js": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
-          "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw="
-        }
-      }
+      "integrity": "sha1-c9g7wmP4bpf4zE9rrhsOkKfSLIY="
     },
     "arr-diff": {
       "version": "2.0.0",
@@ -2454,11 +2882,6 @@
       "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.22.0.tgz",
       "integrity": "sha1-AnYgvuVnqIwyVhV05/0IAdMxGOQ="
     },
-    "babel-runtime": {
-      "version": "6.23.0",
-      "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.23.0.tgz",
-      "integrity": "sha1-CpSJ8UTecO+zzkMArM2zKeL8VDs="
-    },
     "backo2": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz",
@@ -2469,11 +2892,6 @@
       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
       "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c="
     },
-    "base62": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/base62/-/base62-1.2.0.tgz",
-      "integrity": "sha1-MeflYNyEbJ9EwaUx32UU2jVHQVc="
-    },
     "Base64": {
       "version": "0.2.1",
       "resolved": "https://registry.npmjs.org/Base64/-/Base64-0.2.1.tgz",
@@ -2536,9 +2954,9 @@
       "integrity": "sha1-TK2iGTZS6zyp7I5VyQFWacmAaXg="
     },
     "binary-extensions": {
-      "version": "1.8.0",
-      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.8.0.tgz",
-      "integrity": "sha1-SOyNFt9Dd+rl+liEaCSAr02Vx3Q="
+      "version": "1.9.0",
+      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.9.0.tgz",
+      "integrity": "sha1-ZlBsFs5vTWkopbPNajPKQelB43s="
     },
     "binaryextensions": {
       "version": "1.0.1",
@@ -2614,10 +3032,62 @@
       "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
       "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8="
     },
+    "bowser": {
+      "version": "1.7.1",
+      "resolved": "https://registry.npmjs.org/bowser/-/bowser-1.7.1.tgz",
+      "integrity": "sha1-pN6PGKGg3JUx6yqSoVIftqm6lqU="
+    },
     "boxen": {
-      "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/boxen/-/boxen-0.6.0.tgz",
-      "integrity": "sha1-g2TUJIrDT/DvGy8r9JpsYM4NgbY="
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/boxen/-/boxen-1.2.1.tgz",
+      "integrity": "sha1-DxHn/jRO25OXl3/BPt5/ZNlWSB0=",
+      "dependencies": {
+        "ansi-regex": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg="
+        },
+        "ansi-styles": {
+          "version": "3.2.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
+          "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
+        },
+        "camelcase": {
+          "version": "4.1.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
+          "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
+        },
+        "chalk": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.0.1.tgz",
+          "integrity": "sha512-Mp+FXEI+FrwY/XYV45b2YD3E8i3HwnEAoFcM0qlZzq/RZ9RwWitt2Y/c7cqRAz70U7hfekqx6qNYthuKFO6K0g=="
+        },
+        "has-flag": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
+          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
+        },
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
+          "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8="
+        },
+        "string-width": {
+          "version": "2.1.1",
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
+          "integrity": "sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw=="
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8="
+        },
+        "supports-color": {
+          "version": "4.2.1",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
+          "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
+        }
+      }
     },
     "brace-expansion": {
       "version": "1.1.8",
@@ -2640,21 +3110,14 @@
       "integrity": "sha1-81HTKWnTL6XXpVZxVCY9korjvR8="
     },
     "browserify-aes": {
-      "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-0.4.0.tgz",
-      "integrity": "sha1-BnFJtmjfMcS1hTPgLQHoBthgjiw="
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.6.tgz",
+      "integrity": "sha1-Xncl297x/Vkw1OurSFZ85FHEigo="
     },
     "browserify-cipher": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/browserify-cipher/-/browserify-cipher-1.0.0.tgz",
-      "integrity": "sha1-mYgkSHS/XtTijalWZtzWasj8Njo=",
-      "dependencies": {
-        "browserify-aes": {
-          "version": "1.0.6",
-          "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.6.tgz",
-          "integrity": "sha1-Xncl297x/Vkw1OurSFZ85FHEigo="
-        }
-      }
+      "integrity": "sha1-mYgkSHS/XtTijalWZtzWasj8Njo="
     },
     "browserify-des": {
       "version": "1.0.0",
@@ -2708,11 +3171,6 @@
       "resolved": "https://registry.npmjs.org/buffer-xor/-/buffer-xor-1.0.3.tgz",
       "integrity": "sha1-JuYe0UIvtw3ULm42cp7VHYVf6Nk="
     },
-    "bufferstreams": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/bufferstreams/-/bufferstreams-1.0.1.tgz",
-      "integrity": "sha1-z7GtlWjTujz+k1upq92VLeiKqyo="
-    },
     "builtin-modules": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz",
@@ -2759,9 +3217,9 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000701",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000701.tgz",
-      "integrity": "sha1-LjKwaZO/Pb2QtD2T8E4m0Rr93Lo="
+      "version": "1.0.30000708",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000708.tgz",
+      "integrity": "sha1-wuc2vTt/xfbBTkxt/mK5jtFeils="
     },
     "capture-stack-trace": {
       "version": "1.0.0",
@@ -2836,21 +3294,9 @@
       "integrity": "sha1-WckP4+E3EEdG/xlGmiemNP9oyFc="
     },
     "clean-css": {
-      "version": "3.4.28",
-      "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-3.4.28.tgz",
-      "integrity": "sha1-vxlF6C/ICPVWlebd6uwBQA79A/8=",
-      "dependencies": {
-        "commander": {
-          "version": "2.8.1",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-2.8.1.tgz",
-          "integrity": "sha1-Br42f+v9oMMwqh4qBy09yXYkJdQ="
-        },
-        "source-map": {
-          "version": "0.4.4",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
-          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s="
-        }
-      }
+      "version": "4.1.7",
+      "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.7.tgz",
+      "integrity": "sha1-ua6k+FZ5iJzz6ui0A0nsTr390DI="
     },
     "cli-boxes": {
       "version": "1.0.0",
@@ -2952,9 +3398,9 @@
       "integrity": "sha1-TLgFR5Blo2WMMmn0j6xz7/APld4="
     },
     "color-name": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.2.tgz",
-      "integrity": "sha1-XIq3K2S9IhXWF66VWeuxSEdc+Y0="
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
+      "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU="
     },
     "color-string": {
       "version": "0.3.0",
@@ -2981,18 +3427,6 @@
       "resolved": "https://registry.npmjs.org/commander/-/commander-2.11.0.tgz",
       "integrity": "sha512-b0553uYA5YAEGgyYIGYROzKQ7X5RAqedkfjiZxwi0kL1g3bOaBNNZfYkzt/CL0umgD5wc9Jec2FbB98CjkMRvQ=="
     },
-    "commoner": {
-      "version": "0.10.8",
-      "resolved": "https://registry.npmjs.org/commoner/-/commoner-0.10.8.tgz",
-      "integrity": "sha1-NPw2cs0kOT6LtH5wyqApOBH08sU=",
-      "dependencies": {
-        "glob": {
-          "version": "5.0.15",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
-          "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
-        }
-      }
-    },
     "component-bind": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/component-bind/-/component-bind-1.0.0.tgz",
@@ -3009,9 +3443,9 @@
       "integrity": "sha1-ZF/ErfWLcrZJ1crmUTVhnbJv8UM="
     },
     "compressible": {
-      "version": "2.0.10",
-      "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.10.tgz",
-      "integrity": "sha1-/tocf3YXkScyspv4zyYlKiC57s0="
+      "version": "2.0.11",
+      "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.11.tgz",
+      "integrity": "sha1-FnGKdd4oPtjmBAQWJaIGRYZ5fYo="
     },
     "compression": {
       "version": "1.5.2",
@@ -3073,16 +3507,9 @@
       }
     },
     "configstore": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/configstore/-/configstore-2.1.0.tgz",
-      "integrity": "sha1-c3o6cDbpiGECqmCZ5HuzOrGroaE=",
-      "dependencies": {
-        "uuid": {
-          "version": "2.0.3",
-          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz",
-          "integrity": "sha1-Z+LoY3lyFVMN/zGOW/nc6/1Hsho="
-        }
-      }
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.1.tgz",
+      "integrity": "sha512-5oNkD/L++l0O6xGXxb1EWS7SivtjfGQlRyxJsYgE0Z495/L81e2h4/d3r969hoPXuFItzNOKMtsXgYG4c7dYvw=="
     },
     "connect": {
       "version": "3.6.2",
@@ -3184,9 +3611,9 @@
       "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac="
     },
     "cosmiconfig": {
-      "version": "2.1.3",
-      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-2.1.3.tgz",
-      "integrity": "sha1-lSdx6w3dwcs/ovb75RpSLpOz7go="
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-2.2.2.tgz",
+      "integrity": "sha512-GiNXLwAFPYHy25XmTPpafYvn3CLAkJ8FLsscq78MQd1Kh0OU6Yzhn4eV2MVF4G9WEQZoWEGltatdR+ntGPMl5A=="
     },
     "crc": {
       "version": "3.3.0",
@@ -3279,6 +3706,11 @@
       "resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz",
       "integrity": "sha1-gIrcLnnPhHOAabZGyyDsJ762KeA="
     },
+    "css-in-js-utils": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/css-in-js-utils/-/css-in-js-utils-1.0.3.tgz",
+      "integrity": "sha1-msfgL3Y8+F2UAXZmVl7WiltfMhU="
+    },
     "css-loader": {
       "version": "0.28.4",
       "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.4.tgz",
@@ -3380,11 +3812,6 @@
       "resolved": "https://registry.npmjs.org/d/-/d-1.0.0.tgz",
       "integrity": "sha1-dUu1v+VUUdpppYuU1F9MWwRi1Y8="
     },
-    "d3": {
-      "version": "3.5.17",
-      "resolved": "https://registry.npmjs.org/d3/-/d3-3.5.17.tgz",
-      "integrity": "sha1-vEZ0gAQ3iyGjYMn8fPUjF5B2L7g="
-    },
     "dashdash": {
       "version": "1.14.1",
       "resolved": "https://registry.npmjs.org/dashdash/-/dashdash-1.14.1.tgz",
@@ -3492,9 +3919,9 @@
       "integrity": "sha1-hMbhWbgZBP3KWaDvRM2HDTElD5o="
     },
     "depd": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.0.tgz",
-      "integrity": "sha1-4b2Cxqq2ztlluXuIsX7T5SjKGMM="
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.1.tgz",
+      "integrity": "sha1-V4O04cRZ8G+lyif5kfPQbnoxA1k="
     },
     "deprecated": {
       "version": "0.0.1",
@@ -3521,18 +3948,6 @@
       "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.0.3.tgz",
       "integrity": "sha1-ogM8CcyOFY03dI+951B4Mr1s4Sc="
     },
-    "detective": {
-      "version": "4.5.0",
-      "resolved": "https://registry.npmjs.org/detective/-/detective-4.5.0.tgz",
-      "integrity": "sha1-blqMaybmx6JUsca210kNmOyR7dE=",
-      "dependencies": {
-        "acorn": {
-          "version": "4.0.13",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
-          "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c="
-        }
-      }
-    },
     "di": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/di/-/di-0.0.1.tgz",
@@ -3601,9 +4016,9 @@
       "integrity": "sha1-3NhIiib1Y9YQeeSMn3t+Mjc2gs8="
     },
     "dot-prop": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-3.0.0.tgz",
-      "integrity": "sha1-G3CK8JSknJoOfbyteQq6U52sEXc="
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-4.2.0.tgz",
+      "integrity": "sha512-tUMXrxlExSW6U2EXiiKGSBVdYgtV8qlHL+C10TsW4PURY/ic+eaysnSkwB4kA/mBlCyy/IKDJ+Lc3wbWeaXtuQ=="
     },
     "duplexer": {
       "version": "0.1.1",
@@ -3669,9 +4084,9 @@
       "integrity": "sha1-R5Y2v6P+Ox3r1SCH8KyyBLTxnIg="
     },
     "electron-to-chromium": {
-      "version": "1.3.15",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.15.tgz",
-      "integrity": "sha1-CDl5NIkcvPrrvRi4KpW1pIETg2k="
+      "version": "1.3.16",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.16.tgz",
+      "integrity": "sha1-0OAmc1dUdwkBrjAaIWZMukXZL30="
     },
     "elliptic": {
       "version": "6.4.0",
@@ -3776,11 +4191,6 @@
       "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.1.tgz",
       "integrity": "sha1-blwtClYhtdra7O+AuQ7ftc13cvA="
     },
-    "envify": {
-      "version": "3.4.1",
-      "resolved": "https://registry.npmjs.org/envify/-/envify-3.4.1.tgz",
-      "integrity": "sha1-1xIjKejfFoi6dxsSUBkXyc5cvOg="
-    },
     "enzyme": {
       "version": "2.7.0",
       "resolved": "https://registry.npmjs.org/enzyme/-/enzyme-2.7.0.tgz",
@@ -3838,11 +4248,21 @@
       "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.1.tgz",
       "integrity": "sha1-jjGcnwRTv1ddN0lAplWSDlnKVRI="
     },
+    "es6-map": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/es6-map/-/es6-map-0.1.5.tgz",
+      "integrity": "sha1-kTbgUD3MBqMBaQ8LsU/042TpSfA="
+    },
     "es6-promise": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.1.tgz",
       "integrity": "sha512-OaU1hHjgJf+b0NzsxCg7NdIYERD6Hy/PEmFLTjw+b65scuisG3Kt4QoTvJ66BBkPZ581gr0kpoVzKnxniM8nng=="
     },
+    "es6-set": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/es6-set/-/es6-set-0.1.5.tgz",
+      "integrity": "sha1-0rPsXU2ADO2BjbU40ol02wpzzLE="
+    },
     "es6-symbol": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.1.tgz",
@@ -3886,11 +4306,35 @@
         }
       }
     },
+    "escope": {
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/escope/-/escope-3.6.0.tgz",
+      "integrity": "sha1-4Bl16BJ4GhY6ba392AOY3GTIicM=",
+      "dependencies": {
+        "estraverse": {
+          "version": "4.2.0",
+          "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-4.2.0.tgz",
+          "integrity": "sha1-De4/7TH81GlhjOc0IJn8GvoL2xM="
+        }
+      }
+    },
     "esprima": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.0.tgz",
       "integrity": "sha512-oftTcaMu/EGrEIu904mWteKIv8vMuOgGYo7EhVJJN00R/EED9DCua/xxHRdYnKtcECzVg7xOWhflvJMnqcFZjw=="
     },
+    "esrecurse": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.2.0.tgz",
+      "integrity": "sha1-+pVo2Y04I/mkHZHpAtyrnqblsWM=",
+      "dependencies": {
+        "estraverse": {
+          "version": "4.2.0",
+          "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-4.2.0.tgz",
+          "integrity": "sha1-De4/7TH81GlhjOc0IJn8GvoL2xM="
+        }
+      }
+    },
     "estraverse": {
       "version": "1.9.3",
       "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-1.9.3.tgz",
@@ -3906,6 +4350,11 @@
       "resolved": "https://registry.npmjs.org/etag/-/etag-1.7.0.tgz",
       "integrity": "sha1-A9MLX2fdbmMtKUXTDWZScxo01dg="
     },
+    "event-emitter": {
+      "version": "0.3.5",
+      "resolved": "https://registry.npmjs.org/event-emitter/-/event-emitter-0.3.5.tgz",
+      "integrity": "sha1-34xp7vFkeSPHFXuc6DhAYQsCzDk="
+    },
     "event-stream": {
       "version": "3.0.20",
       "resolved": "https://registry.npmjs.org/event-stream/-/event-stream-3.0.20.tgz",
@@ -4103,726 +4552,188 @@
     },
     "fancy-log": {
       "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/fancy-log/-/fancy-log-1.3.0.tgz",
-      "integrity": "sha1-Rb4X0Cu5kX1gzP/UmVyZnmyMmUg="
-    },
-    "fast-levenshtein": {
-      "version": "2.0.6",
-      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
-      "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc="
-    },
-    "fastparse": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.1.tgz",
-      "integrity": "sha1-0eJkOzipTXWDtHkGDmxK/8lAcfg="
-    },
-    "faye-websocket": {
-      "version": "0.10.0",
-      "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz",
-      "integrity": "sha1-TkkvjQTftviQA1B/btvy1QHnxvQ="
-    },
-    "fbjs": {
-      "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.6.1.tgz",
-      "integrity": "sha1-lja3cF9bqWhNRLcveDISVK/IYPc=",
-      "dependencies": {
-        "core-js": {
-          "version": "1.2.7",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
-          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
-        }
-      }
-    },
-    "fd-slicer": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/fd-slicer/-/fd-slicer-1.0.1.tgz",
-      "integrity": "sha1-i1vL2ewyfFBBv5qwI/1nUPEXfmU="
-    },
-    "figures": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz",
-      "integrity": "sha1-y+Hjr/zxzUS4DK3+0o3Hk6lwHS4="
-    },
-    "file-loader": {
-      "version": "0.8.5",
-      "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.8.5.tgz",
-      "integrity": "sha1-knXQMf54DyfUf19K8CvUNxPMFRs="
-    },
-    "filename-regex": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz",
-      "integrity": "sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY="
-    },
-    "filesize": {
-      "version": "3.5.10",
-      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.5.10.tgz",
-      "integrity": "sha1-/I+iPdtO+eXgq24eZPZ5okpWdh8="
-    },
-    "fill-range": {
-      "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz",
-      "integrity": "sha1-ULd9/X5Gm8dJJHCWNpn+eoSFpyM="
-    },
-    "filled-array": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/filled-array/-/filled-array-1.1.0.tgz",
-      "integrity": "sha1-w8T2xmO5I0WamqKZEtLQMfFQf4Q="
-    },
-    "finalhandler": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.3.tgz",
-      "integrity": "sha1-70fneVDpmXgOhgIqVg4yF+DQzIk="
-    },
-    "find-index": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
-      "integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ="
-    },
-    "find-up": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
-      "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8="
-    },
-    "findup-sync": {
-      "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.4.3.tgz",
-      "integrity": "sha1-QAQ5Kee8YK3wt/SCfExudaDeyhI="
-    },
-    "fined": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/fined/-/fined-1.1.0.tgz",
-      "integrity": "sha1-s33IRLdqL15wgeiE98CuNE8VNHY=",
-      "dependencies": {
-        "expand-tilde": {
-          "version": "2.0.2",
-          "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-2.0.2.tgz",
-          "integrity": "sha1-l+gBqgUt8CRU3kawK/YhZCzchQI="
-        }
-      }
-    },
-    "first-chunk-stream": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/first-chunk-stream/-/first-chunk-stream-1.0.0.tgz",
-      "integrity": "sha1-Wb+1DNkF9g18OUzT2ayqtOatk04="
-    },
-    "flagged-respawn": {
-      "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/flagged-respawn/-/flagged-respawn-0.3.2.tgz",
-      "integrity": "sha1-/xke3c1wiKZ1smEP/8l2vpuAdLU="
-    },
-    "flatten": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz",
-      "integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I="
-    },
-    "for-in": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
-      "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA="
-    },
-    "for-own": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz",
-      "integrity": "sha1-UmXGgaTylNq78XyVCbZ2OqhFEM4="
-    },
-    "foreach": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/foreach/-/foreach-2.0.5.tgz",
-      "integrity": "sha1-C+4AUBiusmDQo6865ljdATbsG5k="
-    },
-    "forever-agent": {
-      "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
-      "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE="
-    },
-    "fork-stream": {
-      "version": "0.0.4",
-      "resolved": "https://registry.npmjs.org/fork-stream/-/fork-stream-0.0.4.tgz",
-      "integrity": "sha1-24Sfznf2cIpfjzhq5TOgkHtUrnA="
-    },
-    "form-data": {
-      "version": "2.1.4",
-      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
-      "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE="
-    },
-    "formatio": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.1.1.tgz",
-      "integrity": "sha1-XtPM1jZVEJc4NGXZlhmRAOhhYek="
-    },
-    "forwarded": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.0.tgz",
-      "integrity": "sha1-Ge+YdMSuHCl7zweP3mOgm2aoQ2M="
-    },
-    "fresh": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.3.0.tgz",
-      "integrity": "sha1-ZR+DjiJCTnVm3hYdg1jKoZn4PU8="
-    },
-    "from": {
-      "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/from/-/from-0.1.7.tgz",
-      "integrity": "sha1-g8YK/Fi5xWmXAH7Rp2izqzA6RP4="
-    },
-    "fs-exists-sync": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/fs-exists-sync/-/fs-exists-sync-0.1.0.tgz",
-      "integrity": "sha1-mC1ok6+RjnLQjeyehnP/K1qNat0="
-    },
-    "fs-extra": {
-      "version": "0.26.7",
-      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz",
-      "integrity": "sha1-muH92UiXeY7at20JGM9C0MMYT6k="
-    },
-    "fs.realpath": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
-      "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
-    },
-    "fsevents": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.2.tgz",
-      "integrity": "sha512-Sn44E5wQW4bTHXvQmvSHwqbuiXtduD6Rrjm2ZtUEGbyrig+nUH3t/QD4M4/ZXViY556TBpRgZkHLDx3JxPwxiw==",
-      "optional": true,
-      "dependencies": {
-        "abbrev": {
-          "version": "1.1.0",
-          "bundled": true,
-          "optional": true
-        },
-        "ajv": {
-          "version": "4.11.8",
-          "bundled": true,
-          "optional": true
-        },
-        "ansi-regex": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "aproba": {
-          "version": "1.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "are-we-there-yet": {
-          "version": "1.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "asn1": {
-          "version": "0.2.3",
-          "bundled": true,
-          "optional": true
-        },
-        "assert-plus": {
-          "version": "0.2.0",
-          "bundled": true,
-          "optional": true
-        },
-        "asynckit": {
-          "version": "0.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "aws-sign2": {
-          "version": "0.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "aws4": {
-          "version": "1.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "balanced-match": {
-          "version": "0.4.2",
-          "bundled": true
-        },
-        "bcrypt-pbkdf": {
-          "version": "1.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "block-stream": {
-          "version": "0.0.9",
-          "bundled": true
-        },
-        "boom": {
-          "version": "2.10.1",
-          "bundled": true
-        },
-        "brace-expansion": {
-          "version": "1.1.7",
-          "bundled": true
-        },
-        "buffer-shims": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "caseless": {
-          "version": "0.12.0",
-          "bundled": true,
-          "optional": true
-        },
-        "co": {
-          "version": "4.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "code-point-at": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "combined-stream": {
-          "version": "1.0.5",
-          "bundled": true
-        },
-        "concat-map": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "console-control-strings": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "core-util-is": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "cryptiles": {
-          "version": "2.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "dashdash": {
-          "version": "1.14.1",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true,
-          "optional": true
-        },
-        "deep-extend": {
-          "version": "0.4.2",
-          "bundled": true,
-          "optional": true
-        },
-        "delayed-stream": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "delegates": {
-          "version": "1.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "ecc-jsbn": {
-          "version": "0.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "extend": {
-          "version": "3.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "extsprintf": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "forever-agent": {
-          "version": "0.6.1",
-          "bundled": true,
-          "optional": true
-        },
-        "form-data": {
-          "version": "2.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "fs.realpath": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "fstream": {
-          "version": "1.0.11",
-          "bundled": true
-        },
-        "fstream-ignore": {
-          "version": "1.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "gauge": {
-          "version": "2.7.4",
-          "bundled": true,
-          "optional": true
-        },
-        "getpass": {
-          "version": "0.1.7",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "glob": {
-          "version": "7.1.2",
-          "bundled": true
-        },
-        "graceful-fs": {
-          "version": "4.1.11",
-          "bundled": true
-        },
-        "har-schema": {
-          "version": "1.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "har-validator": {
-          "version": "4.2.1",
-          "bundled": true,
-          "optional": true
-        },
-        "has-unicode": {
-          "version": "2.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "hawk": {
-          "version": "3.1.3",
-          "bundled": true,
-          "optional": true
-        },
-        "hoek": {
-          "version": "2.16.3",
-          "bundled": true
-        },
-        "http-signature": {
-          "version": "1.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "inflight": {
-          "version": "1.0.6",
-          "bundled": true
-        },
-        "inherits": {
-          "version": "2.0.3",
-          "bundled": true
-        },
-        "ini": {
-          "version": "1.3.4",
-          "bundled": true,
-          "optional": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "is-typedarray": {
-          "version": "1.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "isstream": {
-          "version": "0.1.2",
-          "bundled": true,
-          "optional": true
-        },
-        "jodid25519": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "jsbn": {
-          "version": "0.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "json-schema": {
-          "version": "0.2.3",
-          "bundled": true,
-          "optional": true
-        },
-        "json-stable-stringify": {
-          "version": "1.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "json-stringify-safe": {
-          "version": "5.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "jsonify": {
-          "version": "0.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "jsprim": {
-          "version": "1.4.0",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "mime-db": {
-          "version": "1.27.0",
-          "bundled": true
-        },
-        "mime-types": {
-          "version": "2.1.15",
-          "bundled": true
-        },
-        "minimatch": {
-          "version": "3.0.4",
-          "bundled": true
-        },
-        "minimist": {
-          "version": "0.0.8",
-          "bundled": true
-        },
-        "mkdirp": {
-          "version": "0.5.1",
-          "bundled": true
-        },
-        "ms": {
-          "version": "2.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "node-pre-gyp": {
-          "version": "0.6.36",
-          "bundled": true,
-          "optional": true
-        },
-        "nopt": {
-          "version": "4.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "npmlog": {
-          "version": "4.1.0",
-          "bundled": true,
-          "optional": true
-        },
-        "number-is-nan": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "oauth-sign": {
-          "version": "0.8.2",
-          "bundled": true,
-          "optional": true
-        },
-        "object-assign": {
-          "version": "4.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "once": {
-          "version": "1.4.0",
-          "bundled": true
-        },
-        "os-homedir": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "os-tmpdir": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "osenv": {
-          "version": "0.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "path-is-absolute": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "performance-now": {
-          "version": "0.2.0",
-          "bundled": true,
-          "optional": true
-        },
-        "process-nextick-args": {
-          "version": "1.0.7",
-          "bundled": true
-        },
-        "punycode": {
-          "version": "1.4.1",
-          "bundled": true,
-          "optional": true
-        },
-        "qs": {
-          "version": "6.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "rc": {
-          "version": "1.2.1",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "minimist": {
-              "version": "1.2.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "readable-stream": {
-          "version": "2.2.9",
-          "bundled": true
-        },
-        "request": {
-          "version": "2.81.0",
-          "bundled": true,
-          "optional": true
-        },
-        "rimraf": {
-          "version": "2.6.1",
-          "bundled": true
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "bundled": true
-        },
-        "semver": {
-          "version": "5.3.0",
-          "bundled": true,
-          "optional": true
-        },
-        "set-blocking": {
-          "version": "2.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "signal-exit": {
-          "version": "3.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "sntp": {
-          "version": "1.0.9",
-          "bundled": true,
-          "optional": true
-        },
-        "sshpk": {
-          "version": "1.13.0",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "string_decoder": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "stringstream": {
-          "version": "0.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "strip-ansi": {
-          "version": "3.0.1",
-          "bundled": true
-        },
-        "strip-json-comments": {
-          "version": "2.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "tar": {
-          "version": "2.2.1",
-          "bundled": true
-        },
-        "tar-pack": {
-          "version": "3.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "tough-cookie": {
-          "version": "2.3.2",
-          "bundled": true,
-          "optional": true
-        },
-        "tunnel-agent": {
-          "version": "0.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "tweetnacl": {
-          "version": "0.14.5",
-          "bundled": true,
-          "optional": true
-        },
-        "uid-number": {
-          "version": "0.0.6",
-          "bundled": true,
-          "optional": true
-        },
-        "util-deprecate": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "uuid": {
-          "version": "3.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "verror": {
-          "version": "1.3.6",
-          "bundled": true,
-          "optional": true
-        },
-        "wide-align": {
-          "version": "1.1.2",
-          "bundled": true,
-          "optional": true
-        },
-        "wrappy": {
-          "version": "1.0.2",
-          "bundled": true
+      "resolved": "https://registry.npmjs.org/fancy-log/-/fancy-log-1.3.0.tgz",
+      "integrity": "sha1-Rb4X0Cu5kX1gzP/UmVyZnmyMmUg="
+    },
+    "fast-deep-equal": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-1.0.0.tgz",
+      "integrity": "sha1-liVqO8l1WV6zbYLpkp0GDYk0Of8="
+    },
+    "fast-levenshtein": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
+      "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc="
+    },
+    "fastparse": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.1.tgz",
+      "integrity": "sha1-0eJkOzipTXWDtHkGDmxK/8lAcfg="
+    },
+    "faye-websocket": {
+      "version": "0.10.0",
+      "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz",
+      "integrity": "sha1-TkkvjQTftviQA1B/btvy1QHnxvQ="
+    },
+    "fbjs": {
+      "version": "0.8.14",
+      "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.14.tgz",
+      "integrity": "sha1-0dviviVMNakeCfMfnNUKQLKg7Rw=",
+      "dependencies": {
+        "core-js": {
+          "version": "1.2.7",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
+          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
+        }
+      }
+    },
+    "fd-slicer": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/fd-slicer/-/fd-slicer-1.0.1.tgz",
+      "integrity": "sha1-i1vL2ewyfFBBv5qwI/1nUPEXfmU="
+    },
+    "figures": {
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz",
+      "integrity": "sha1-y+Hjr/zxzUS4DK3+0o3Hk6lwHS4="
+    },
+    "file-loader": {
+      "version": "0.8.5",
+      "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.8.5.tgz",
+      "integrity": "sha1-knXQMf54DyfUf19K8CvUNxPMFRs="
+    },
+    "filename-regex": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz",
+      "integrity": "sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY="
+    },
+    "filesize": {
+      "version": "3.5.10",
+      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.5.10.tgz",
+      "integrity": "sha1-/I+iPdtO+eXgq24eZPZ5okpWdh8="
+    },
+    "fill-range": {
+      "version": "2.2.3",
+      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz",
+      "integrity": "sha1-ULd9/X5Gm8dJJHCWNpn+eoSFpyM="
+    },
+    "filled-array": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/filled-array/-/filled-array-1.1.0.tgz",
+      "integrity": "sha1-w8T2xmO5I0WamqKZEtLQMfFQf4Q="
+    },
+    "finalhandler": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.3.tgz",
+      "integrity": "sha1-70fneVDpmXgOhgIqVg4yF+DQzIk="
+    },
+    "find-index": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
+      "integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ="
+    },
+    "find-up": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
+      "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8="
+    },
+    "findup-sync": {
+      "version": "0.4.3",
+      "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.4.3.tgz",
+      "integrity": "sha1-QAQ5Kee8YK3wt/SCfExudaDeyhI="
+    },
+    "fined": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/fined/-/fined-1.1.0.tgz",
+      "integrity": "sha1-s33IRLdqL15wgeiE98CuNE8VNHY=",
+      "dependencies": {
+        "expand-tilde": {
+          "version": "2.0.2",
+          "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-2.0.2.tgz",
+          "integrity": "sha1-l+gBqgUt8CRU3kawK/YhZCzchQI="
         }
       }
     },
+    "first-chunk-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/first-chunk-stream/-/first-chunk-stream-1.0.0.tgz",
+      "integrity": "sha1-Wb+1DNkF9g18OUzT2ayqtOatk04="
+    },
+    "flagged-respawn": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/flagged-respawn/-/flagged-respawn-0.3.2.tgz",
+      "integrity": "sha1-/xke3c1wiKZ1smEP/8l2vpuAdLU="
+    },
+    "flatten": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz",
+      "integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I="
+    },
+    "for-in": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
+      "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA="
+    },
+    "for-own": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz",
+      "integrity": "sha1-UmXGgaTylNq78XyVCbZ2OqhFEM4="
+    },
+    "foreach": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/foreach/-/foreach-2.0.5.tgz",
+      "integrity": "sha1-C+4AUBiusmDQo6865ljdATbsG5k="
+    },
+    "forever-agent": {
+      "version": "0.6.1",
+      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
+      "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE="
+    },
+    "fork-stream": {
+      "version": "0.0.4",
+      "resolved": "https://registry.npmjs.org/fork-stream/-/fork-stream-0.0.4.tgz",
+      "integrity": "sha1-24Sfznf2cIpfjzhq5TOgkHtUrnA="
+    },
+    "form-data": {
+      "version": "2.1.4",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
+      "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE="
+    },
+    "formatio": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.1.1.tgz",
+      "integrity": "sha1-XtPM1jZVEJc4NGXZlhmRAOhhYek="
+    },
+    "forwarded": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.0.tgz",
+      "integrity": "sha1-Ge+YdMSuHCl7zweP3mOgm2aoQ2M="
+    },
+    "fresh": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.3.0.tgz",
+      "integrity": "sha1-ZR+DjiJCTnVm3hYdg1jKoZn4PU8="
+    },
+    "from": {
+      "version": "0.1.7",
+      "resolved": "https://registry.npmjs.org/from/-/from-0.1.7.tgz",
+      "integrity": "sha1-g8YK/Fi5xWmXAH7Rp2izqzA6RP4="
+    },
+    "fs-exists-sync": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/fs-exists-sync/-/fs-exists-sync-0.1.0.tgz",
+      "integrity": "sha1-mC1ok6+RjnLQjeyehnP/K1qNat0="
+    },
+    "fs-extra": {
+      "version": "0.26.7",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz",
+      "integrity": "sha1-muH92UiXeY7at20JGM9C0MMYT6k="
+    },
+    "fs.realpath": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
+      "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
+    },
     "fstream": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
@@ -4839,9 +4750,9 @@
       "integrity": "sha1-FhdnFMgBeY5Ojyz391KUZ7tKV3E="
     },
     "function.prototype.name": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.0.1.tgz",
-      "integrity": "sha512-yPTD33NazY14aRlTORxhFf8gTrNmnxmAGaw2Ge36m4ThRN7HauJU8hESMQQXixdJbnaO43c3MgMoZXP/QqGnTw=="
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.0.3.tgz",
+      "integrity": "sha512-5EblxZUdioXi2JiMZ9FUbwYj40eQ9MFHyzFLBSPdlRl3SO8l7SLWuAnQ/at/1Wi4hjJwME/C5WpF2ZfAc8nGNw=="
     },
     "gauge": {
       "version": "2.7.4",
@@ -4906,21 +4817,9 @@
       "integrity": "sha1-jMvSCSs0W8LJFJVIOW31SWRspj8="
     },
     "glamor": {
-      "version": "2.20.25",
-      "resolved": "https://registry.npmjs.org/glamor/-/glamor-2.20.25.tgz",
-      "integrity": "sha1-cbhLgrZ6kyd3GsWd5T7pFdFIpKM=",
-      "dependencies": {
-        "core-js": {
-          "version": "1.2.7",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
-          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
-        },
-        "fbjs": {
-          "version": "0.8.12",
-          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz",
-          "integrity": "sha1-ELXZL3bUVXX9Y6IX1OoCvqL47QQ="
-        }
-      }
+      "version": "2.20.37",
+      "resolved": "https://registry.npmjs.org/glamor/-/glamor-2.20.37.tgz",
+      "integrity": "sha512-+zfncOt+qhno7li2wDih/Q+F6ugtAJQ7E+V3NJ6SZ6rbkOAOa4yEvRLfC9NnNqYp0XIpH/MW6bW5x4Pua41DIQ=="
     },
     "glob": {
       "version": "7.1.2",
@@ -5032,31 +4931,9 @@
       "integrity": "sha1-f+DxmfV6yQbPUS/urY+Q7kooT8U="
     },
     "got": {
-      "version": "5.7.1",
-      "resolved": "https://registry.npmjs.org/got/-/got-5.7.1.tgz",
-      "integrity": "sha1-X4FjWmHkplifGAVp6k44FoClHzU=",
-      "dependencies": {
-        "duplexer2": {
-          "version": "0.1.4",
-          "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.1.4.tgz",
-          "integrity": "sha1-ixLauHjA1p4+eJEFFmKjL8a93ME="
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        }
-      }
+      "version": "6.7.1",
+      "resolved": "https://registry.npmjs.org/got/-/got-6.7.1.tgz",
+      "integrity": "sha1-JAzQV4WpoY5WHcG0S0HHY+8ejbA="
     },
     "graceful-fs": {
       "version": "4.1.11",
@@ -5123,26 +5000,9 @@
       "integrity": "sha1-nvyNMl+YBcx2aP3059YNSxQQ8s8="
     },
     "gulp-clean-css": {
-      "version": "2.0.13",
-      "resolved": "https://registry.npmjs.org/gulp-clean-css/-/gulp-clean-css-2.0.13.tgz",
-      "integrity": "sha1-hd70qqKvbwbBZG4FER/XtLXmJ9A=",
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        }
-      }
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/gulp-clean-css/-/gulp-clean-css-3.0.4.tgz",
+      "integrity": "sha1-DFrY0EVAfIjzwrnwNXCWOWfc/VQ="
     },
     "gulp-clip-empty-files": {
       "version": "0.1.2",
@@ -5368,9 +5228,9 @@
           "integrity": "sha1-dl52B8gFVFK7pvCwUllTUJhgNt4=",
           "dependencies": {
             "depd": {
-              "version": "1.1.0",
-              "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.0.tgz",
-              "integrity": "sha1-4b2Cxqq2ztlluXuIsX7T5SjKGMM="
+              "version": "1.1.1",
+              "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.1.tgz",
+              "integrity": "sha1-V4O04cRZ8G+lyif5kfPQbnoxA1k="
             },
             "escape-html": {
               "version": "1.0.3",
@@ -5627,9 +5487,9 @@
       "integrity": "sha1-8SF2wtBCL2AwbCQv/2oBo5T6ugk="
     },
     "gulp-postcss": {
-      "version": "6.1.1",
-      "resolved": "https://registry.npmjs.org/gulp-postcss/-/gulp-postcss-6.1.1.tgz",
-      "integrity": "sha1-h01E6f9srd3VfOPJVSAuVy0mkBU="
+      "version": "6.3.0",
+      "resolved": "https://registry.npmjs.org/gulp-postcss/-/gulp-postcss-6.3.0.tgz",
+      "integrity": "sha1-M+6XI+WcMC8z1wf8S3OYsQ8DK/8="
     },
     "gulp-prompt": {
       "version": "0.2.0",
@@ -5659,31 +5519,9 @@
       }
     },
     "gulp-sass": {
-      "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/gulp-sass/-/gulp-sass-2.3.2.tgz",
-      "integrity": "sha1-grerkP6QLNw0wE8YDZLyw0kC3VI=",
-      "dependencies": {
-        "gaze": {
-          "version": "1.1.2",
-          "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz",
-          "integrity": "sha1-hHIkZ3rbiHDWeSV+0ziP22HkAQU="
-        },
-        "globule": {
-          "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/globule/-/globule-1.2.0.tgz",
-          "integrity": "sha1-HcScaCLdnoovoAuiopUAboZkvQk="
-        },
-        "lodash": {
-          "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
-        },
-        "node-sass": {
-          "version": "3.13.1",
-          "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-3.13.1.tgz",
-          "integrity": "sha1-ckD7v/I5YwS0IjUn7TAgWJwAT8I="
-        }
-      }
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/gulp-sass/-/gulp-sass-3.1.0.tgz",
+      "integrity": "sha1-U9xLaKH13f5EJKtMJHZVJpqLdLc="
     },
     "gulp-sourcemaps": {
       "version": "1.6.0",
@@ -6003,28 +5841,18 @@
           "version": "1.1.0",
           "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
           "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
-        }
-      }
-    },
-    "html-minifier": {
-      "version": "3.5.2",
-      "resolved": "https://registry.npmjs.org/html-minifier/-/html-minifier-3.5.2.tgz",
-      "integrity": "sha1-1zvD/0SJQkCIGM5gm/P7DqfvTrc=",
-      "dependencies": {
-        "clean-css": {
-          "version": "4.1.7",
-          "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.7.tgz",
-          "integrity": "sha1-ua6k+FZ5iJzz6ui0A0nsTr390DI="
-        },
-        "commander": {
-          "version": "2.9.0",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
-          "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q="
-        },
+        }
+      }
+    },
+    "html-minifier": {
+      "version": "3.5.3",
+      "resolved": "https://registry.npmjs.org/html-minifier/-/html-minifier-3.5.3.tgz",
+      "integrity": "sha512-iKRzQQDuTCsq0Ultbi/mfJJnR0D3AdZKTq966Gsp92xkmAPCV4Xi08qhJ0Dl3ZAWemSgJ7qZK+UsZc0gFqK6wg==",
+      "dependencies": {
         "uglify-js": {
-          "version": "3.0.24",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.24.tgz",
-          "integrity": "sha512-IZ7l7MU2j7LIuz6IAFWBOk1dbuQ0QVQsKLffpNPKXuL8NYcFBBQ5QkvMAtfL1+oaBW16344DY4sA26GI9cXzlA=="
+          "version": "3.0.26",
+          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.26.tgz",
+          "integrity": "sha512-+D/BjzuvT1oRMSkH0fuF3M/BCvDxDywmZasd1UTPPHsdsHZqJEAZSvrojgFlS7lrM3ZZWq5h7Bb5i96X1TbOJw=="
         }
       }
     },
@@ -6063,7 +5891,14 @@
     "http-errors": {
       "version": "1.6.1",
       "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.1.tgz",
-      "integrity": "sha1-X4uO2YrKVFZWv1cplzh/kEpyIlc="
+      "integrity": "sha1-X4uO2YrKVFZWv1cplzh/kEpyIlc=",
+      "dependencies": {
+        "depd": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.0.tgz",
+          "integrity": "sha1-4b2Cxqq2ztlluXuIsX7T5SjKGMM="
+        }
+      }
     },
     "http-proxy": {
       "version": "1.16.2",
@@ -6102,6 +5937,11 @@
       "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.0.tgz",
       "integrity": "sha1-s//f5zSyo9Sp79WOhlTJH86G6v0="
     },
+    "hyphenate-style-name": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.0.2.tgz",
+      "integrity": "sha1-MRYKNpMK2vH8BMYHT360FGXU7Es="
+    },
     "iconv-lite": {
       "version": "0.4.15",
       "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.15.tgz",
@@ -6118,9 +5958,9 @@
       "integrity": "sha1-g/Cg7DeL8yRheLbCrZE28TWxyWI=",
       "dependencies": {
         "ansi-styles": {
-          "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.1.0.tgz",
-          "integrity": "sha1-CcIC1ckX7CMYjKpcnLkXnNlUd1A="
+          "version": "3.2.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
+          "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
         },
         "chalk": {
           "version": "2.0.1",
@@ -6133,14 +5973,14 @@
           "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
         },
         "postcss": {
-          "version": "6.0.6",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.6.tgz",
-          "integrity": "sha1-u6TVjohPx4yEDRU54Q7dqruPc70="
+          "version": "6.0.8",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.8.tgz",
+          "integrity": "sha512-G6WnRmdTt2jvJvY+aY+M0AO4YlbxE+slKPZb+jG2P2U9Tyxi3h1fYZ/DgiFU6DC6bv3XIEJoZt+f/kNh8BrWFw=="
         },
         "supports-color": {
-          "version": "4.2.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.0.tgz",
-          "integrity": "sha512-Ts0Mu/A1S1aZxEJNG88I4Oc9rcZSBFNac5e27yh4j2mqbhZSSzR1Ah79EYwSn9Zuh7lrlGD2cVGzw1RKGzyLSg=="
+          "version": "4.2.1",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
+          "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
         }
       }
     },
@@ -6199,6 +6039,11 @@
       "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.4.tgz",
       "integrity": "sha1-BTfLedr1m1mhpRff9wbIbsA5Fi4="
     },
+    "inline-style-prefixer": {
+      "version": "3.0.6",
+      "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-3.0.6.tgz",
+      "integrity": "sha1-sn/jCbQWijHq84yOjGCrnnwRcx8="
+    },
     "inpath": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/inpath/-/inpath-1.0.2.tgz",
@@ -6242,9 +6087,9 @@
       "integrity": "sha1-vd7XARQpCCjAoDnnLvJfWq7ENUo="
     },
     "ipaddr.js": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.3.0.tgz",
-      "integrity": "sha1-HgOlL9rYOou7KyXL9JmLTP/NPew="
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.4.0.tgz",
+      "integrity": "sha1-KWrKh4qCGBbluF0KKFqZvP9FgvA="
     },
     "irregular-plurals": {
       "version": "1.3.0",
@@ -6503,14 +6348,7 @@
     "isomorphic-fetch": {
       "version": "2.2.1",
       "resolved": "https://registry.npmjs.org/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz",
-      "integrity": "sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk=",
-      "dependencies": {
-        "whatwg-fetch": {
-          "version": "2.0.3",
-          "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-2.0.3.tgz",
-          "integrity": "sha1-nITsLc9oGH/wC8ZOEnS0QhduHIQ="
-        }
-      }
+      "integrity": "sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk="
     },
     "isstream": {
       "version": "0.1.2",
@@ -6559,6 +6397,23 @@
       "resolved": "https://registry.npmjs.org/istextorbinary/-/istextorbinary-1.0.2.tgz",
       "integrity": "sha1-rOGTVNGpoBc+/rEITOD4ewrX3s8="
     },
+    "jade": {
+      "version": "0.26.3",
+      "resolved": "https://registry.npmjs.org/jade/-/jade-0.26.3.tgz",
+      "integrity": "sha1-jxDXl32NefL2/4YqgbBRPMslaGw=",
+      "dependencies": {
+        "commander": {
+          "version": "0.6.1",
+          "resolved": "https://registry.npmjs.org/commander/-/commander-0.6.1.tgz",
+          "integrity": "sha1-+mihT2qUXVTbvlDYzbMyDp47GgY="
+        },
+        "mkdirp": {
+          "version": "0.3.0",
+          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.3.0.tgz",
+          "integrity": "sha1-G79asbqCevI1dRQ0kEJkVfSB/h4="
+        }
+      }
+    },
     "jju": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/jju/-/jju-1.3.0.tgz",
@@ -6591,15 +6446,20 @@
       "integrity": "sha1-597mbjXW/Bb3EP6R1c9p9w8IkR0="
     },
     "json-loader": {
-      "version": "0.5.4",
-      "resolved": "https://registry.npmjs.org/json-loader/-/json-loader-0.5.4.tgz",
-      "integrity": "sha1-i6oTZaYy9Yo8RtIBdfxgAsluN94="
+      "version": "0.5.7",
+      "resolved": "https://registry.npmjs.org/json-loader/-/json-loader-0.5.7.tgz",
+      "integrity": "sha512-QLPs8Dj7lnf3e3QYS1zkCo+4ZwqOiF9d/nZnYozTISxXWCfNs9yuky5rJw4/W34s7POaNlbZmQGaB5NiXCbP4w=="
     },
     "json-schema": {
       "version": "0.2.3",
       "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz",
       "integrity": "sha1-tIDIkuWaLwWVTOcnvT8qTogvnhM="
     },
+    "json-schema-traverse": {
+      "version": "0.3.1",
+      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.3.1.tgz",
+      "integrity": "sha1-NJptRMU6Ud6JtAgFxdXlm0F9M0A="
+    },
     "json-stable-stringify": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz",
@@ -6647,28 +6507,6 @@
         }
       }
     },
-    "jstransform": {
-      "version": "11.0.3",
-      "resolved": "https://registry.npmjs.org/jstransform/-/jstransform-11.0.3.tgz",
-      "integrity": "sha1-CaeJk+CuTU70SH9hVakfYZDLQiM=",
-      "dependencies": {
-        "esprima-fb": {
-          "version": "15001.1.0-dev-harmony-fb",
-          "resolved": "https://registry.npmjs.org/esprima-fb/-/esprima-fb-15001.1.0-dev-harmony-fb.tgz",
-          "integrity": "sha1-MKlHMDxrjV6VW+4rmbHSMyBqaQE="
-        },
-        "object-assign": {
-          "version": "2.1.1",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-2.1.1.tgz",
-          "integrity": "sha1-Q8NuXVaf+OSBbE76i+AtJpZ8GKo="
-        },
-        "source-map": {
-          "version": "0.4.4",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
-          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s="
-        }
-      }
-    },
     "jszip": {
       "version": "2.5.0",
       "resolved": "https://registry.npmjs.org/jszip/-/jszip-2.5.0.tgz",
@@ -6768,9 +6606,9 @@
       "integrity": "sha1-QIhDO0azsbolnXh4XY6W9zugJDk="
     },
     "latest-version": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-2.0.0.tgz",
-      "integrity": "sha1-VvjWE5YghHuAF/jx9NeOIRMkFos="
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-3.1.0.tgz",
+      "integrity": "sha1-ogU4P+oyKzO1rjsYq+4NwvNW7hU="
     },
     "lazy-cache": {
       "version": "1.0.4",
@@ -6856,6 +6694,18 @@
       "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz",
       "integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g="
     },
+    "locate-path": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-2.0.0.tgz",
+      "integrity": "sha1-K1aLJl7slExtnA3pw9u7ygNUzY4=",
+      "dependencies": {
+        "path-exists": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-3.0.0.tgz",
+          "integrity": "sha1-zg6+ql94yxiSXqfYENe1mwEP1RU="
+        }
+      }
+    },
     "lodash": {
       "version": "4.15.0",
       "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.15.0.tgz",
@@ -7229,6 +7079,11 @@
         }
       }
     },
+    "loglevel": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/loglevel/-/loglevel-1.4.1.tgz",
+      "integrity": "sha1-lbOD+Ro8J1b9SrCTZn5DCRYfK80="
+    },
     "lolex": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.4.0.tgz",
@@ -7314,6 +7169,11 @@
       "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
       "integrity": "sha1-hxDXrwqmJvj/+hzgAWhUUmMlV0g="
     },
+    "mem": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/mem/-/mem-1.1.0.tgz",
+      "integrity": "sha1-Xt1StIXKHZAP5kiVUFOZoN+kX3Y="
+    },
     "memory-fs": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.4.1.tgz",
@@ -7406,14 +7266,19 @@
       "integrity": "sha1-WR2E02U6awtKO5343lqoEI5y5eA="
     },
     "mime-db": {
-      "version": "1.27.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.27.0.tgz",
-      "integrity": "sha1-gg9XIpa70g7CXtVeW13oaeVDbrE="
+      "version": "1.29.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.29.0.tgz",
+      "integrity": "sha1-SNJtI1WJZRcErFkWygYAGRQmaHg="
     },
     "mime-types": {
-      "version": "2.1.15",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.15.tgz",
-      "integrity": "sha1-pOv1BkCUVpI3uM9wBGd20J/JKu0="
+      "version": "2.1.16",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.16.tgz",
+      "integrity": "sha1-K4WKUuXs1RbbiXrCvodIeDBpjiM="
+    },
+    "mimic-fn": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-1.1.0.tgz",
+      "integrity": "sha1-5md4PZLonb00KBi1IwudYqZyrRg="
     },
     "minimalistic-assert": {
       "version": "1.0.0",
@@ -7460,39 +7325,49 @@
       }
     },
     "mocha": {
-      "version": "3.4.2",
-      "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.4.2.tgz",
-      "integrity": "sha1-0O9NMyEm2/GNDWQMmzgt1IvpdZQ=",
+      "version": "2.5.3",
+      "resolved": "https://registry.npmjs.org/mocha/-/mocha-2.5.3.tgz",
+      "integrity": "sha1-FhvlvetJZ3HrmzV0UFC2IrWu/Fg=",
       "dependencies": {
         "commander": {
-          "version": "2.9.0",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
-          "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q="
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/commander/-/commander-2.3.0.tgz",
+          "integrity": "sha1-/UMOiJgy7DU7ms0d4hfBHLPu+HM="
         },
         "debug": {
-          "version": "2.6.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz",
-          "integrity": "sha1-vFlryr52F/Edn6FTYe3tVgi4SZs="
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "diff": {
-          "version": "3.2.0",
-          "resolved": "https://registry.npmjs.org/diff/-/diff-3.2.0.tgz",
-          "integrity": "sha1-yc45Okt8vQsFinJck98pkCeGj/k="
+          "version": "1.4.0",
+          "resolved": "https://registry.npmjs.org/diff/-/diff-1.4.0.tgz",
+          "integrity": "sha1-fyjS657nsVqX79ic5j3P2qPMur8="
+        },
+        "escape-string-regexp": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.2.tgz",
+          "integrity": "sha1-Tbwv5nTnGUnK8/smlc5/LcHZqNE="
         },
         "glob": {
-          "version": "7.1.1",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz",
-          "integrity": "sha1-gFIR3wT6rxxjo2ADBs31reULLsg="
+          "version": "3.2.11",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-3.2.11.tgz",
+          "integrity": "sha1-Spc/Y1uRkPcV0QmH1cAP0oFevj0="
+        },
+        "minimatch": {
+          "version": "0.3.0",
+          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.3.0.tgz",
+          "integrity": "sha1-J12O2qxPG7MyZHIInnlJyDlGmd0="
         },
         "ms": {
-          "version": "0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
-          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
+          "version": "0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         },
         "supports-color": {
-          "version": "3.1.2",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz",
-          "integrity": "sha1-cqJiiU2dQIuVbKBf83su2KbiotU="
+          "version": "1.2.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-1.2.0.tgz",
+          "integrity": "sha1-/x7R5hFp0Gs88tWI4YixjYhH4X4="
         }
       }
     },
@@ -7618,9 +7493,9 @@
       "integrity": "sha1-euuhxzpSGEJlVUt9wDuvcg34AIE="
     },
     "node-emoji": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/node-emoji/-/node-emoji-1.7.0.tgz",
-      "integrity": "sha512-dYx345sjhPJUpWaVQKjP0/43y+nTcfBRTZfSciM3ZEbRGaU/9AKaHBPf7AJ9vOKcK0W3v67AgI4m4oo02NLHhQ=="
+      "version": "1.8.1",
+      "resolved": "https://registry.npmjs.org/node-emoji/-/node-emoji-1.8.1.tgz",
+      "integrity": "sha512-+ktMAh1Jwas+TnGodfCfjUbJKoANqPaJFN0z0iqh41eqD8dvguNzcitVSBSVK1pidz0AqGbLKcoVuVLRVZ/aVg=="
     },
     "node-fetch": {
       "version": "1.7.1",
@@ -7814,14 +7689,14 @@
       "integrity": "sha1-EEEktsYCxnlogaBCVB0220OlJk4="
     },
     "office-ui-fabric-core": {
-      "version": "7.1.2",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-7.1.2.tgz",
-      "integrity": "sha1-6mJvqUURirroSrsZc45KCLCHPx8="
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-7.2.0.tgz",
+      "integrity": "sha1-JKwXdDPkou6REP5DWAutBZ+gBQk="
     },
     "office-ui-fabric-react": {
-      "version": "4.20.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.20.0.tgz",
-      "integrity": "sha512-ljajwhHLp79i0MoVLydpIyEO3AI8ozWDkLAYqrYSYgAoKBlms6Zo8jEJHSaJAhzD5kLnTxocXKpMmoqKsgoLaQ=="
+      "version": "4.25.1",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.25.1.tgz",
+      "integrity": "sha512-rGnC/XOI5u0AfJuTLg83PpfysXZk+XMYaF3AU+7my7dHXOIqFMS/DtE6Fv5+D5aAYexaLmBWugJc58BMDLRX5w=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -7951,15 +7826,25 @@
       "resolved": "https://registry.npmjs.org/p-finally/-/p-finally-1.0.0.tgz",
       "integrity": "sha1-P7z7FbiZpEEjs0ttzBi3JDNqLK4="
     },
+    "p-limit": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-1.1.0.tgz",
+      "integrity": "sha1-sH/y2aXYi+yAYDWJWiurZqJ5iLw="
+    },
+    "p-locate": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-2.0.0.tgz",
+      "integrity": "sha1-IKAQOyIqcMj9OcwuWAaA893l7EM="
+    },
     "p-map": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/p-map/-/p-map-1.1.1.tgz",
       "integrity": "sha1-BfXkrpegaDcbwqXMhr+9vBnErno="
     },
     "package-json": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/package-json/-/package-json-2.4.0.tgz",
-      "integrity": "sha1-DRW9Z9HLvduyyiIv8u24a8sxqLs="
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/package-json/-/package-json-4.0.1.tgz",
+      "integrity": "sha1-iGmgQBJTZhxMTKPabCEh7VVfXu0="
     },
     "pako": {
       "version": "0.2.9",
@@ -7996,14 +7881,7 @@
     "parse-asn1": {
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.0.tgz",
-      "integrity": "sha1-N8T5t+06tlx0gXtfJICTf7+XxxI=",
-      "dependencies": {
-        "browserify-aes": {
-          "version": "1.0.6",
-          "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.6.tgz",
-          "integrity": "sha1-Xncl297x/Vkw1OurSFZ85FHEigo="
-        }
-      }
+      "integrity": "sha1-N8T5t+06tlx0gXtfJICTf7+XxxI="
     },
     "parse-filepath": {
       "version": "1.0.1",
@@ -8361,9 +8239,9 @@
       "integrity": "sha1-ssapjAByz5G5MtGkllCBFDEXNb8="
     },
     "postcss-modules": {
-      "version": "0.5.2",
-      "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.5.2.tgz",
-      "integrity": "sha1-nWgv7T8oK9ZLKqT+tvIqKvQ1/9o="
+      "version": "0.6.4",
+      "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.6.4.tgz",
+      "integrity": "sha1-d6WLt3uhtDkrJwwLWYUv116JqLQ="
     },
     "postcss-modules-extract-imports": {
       "version": "1.1.0",
@@ -8371,9 +8249,9 @@
       "integrity": "sha1-thTJcgvmgW6u41+zpfqh26agXds=",
       "dependencies": {
         "ansi-styles": {
-          "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.1.0.tgz",
-          "integrity": "sha1-CcIC1ckX7CMYjKpcnLkXnNlUd1A="
+          "version": "3.2.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
+          "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
         },
         "chalk": {
           "version": "2.0.1",
@@ -8386,14 +8264,14 @@
           "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
         },
         "postcss": {
-          "version": "6.0.6",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.6.tgz",
-          "integrity": "sha1-u6TVjohPx4yEDRU54Q7dqruPc70="
+          "version": "6.0.8",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.8.tgz",
+          "integrity": "sha512-G6WnRmdTt2jvJvY+aY+M0AO4YlbxE+slKPZb+jG2P2U9Tyxi3h1fYZ/DgiFU6DC6bv3XIEJoZt+f/kNh8BrWFw=="
         },
         "supports-color": {
-          "version": "4.2.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.0.tgz",
-          "integrity": "sha512-Ts0Mu/A1S1aZxEJNG88I4Oc9rcZSBFNac5e27yh4j2mqbhZSSzR1Ah79EYwSn9Zuh7lrlGD2cVGzw1RKGzyLSg=="
+          "version": "4.2.1",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
+          "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
         }
       }
     },
@@ -8403,9 +8281,9 @@
       "integrity": "sha1-99gMOYxaOT+nlkRmvRlQCn1hwGk=",
       "dependencies": {
         "ansi-styles": {
-          "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.1.0.tgz",
-          "integrity": "sha1-CcIC1ckX7CMYjKpcnLkXnNlUd1A="
+          "version": "3.2.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
+          "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
         },
         "chalk": {
           "version": "2.0.1",
@@ -8418,14 +8296,14 @@
           "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
         },
         "postcss": {
-          "version": "6.0.6",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.6.tgz",
-          "integrity": "sha1-u6TVjohPx4yEDRU54Q7dqruPc70="
+          "version": "6.0.8",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.8.tgz",
+          "integrity": "sha512-G6WnRmdTt2jvJvY+aY+M0AO4YlbxE+slKPZb+jG2P2U9Tyxi3h1fYZ/DgiFU6DC6bv3XIEJoZt+f/kNh8BrWFw=="
         },
         "supports-color": {
-          "version": "4.2.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.0.tgz",
-          "integrity": "sha512-Ts0Mu/A1S1aZxEJNG88I4Oc9rcZSBFNac5e27yh4j2mqbhZSSzR1Ah79EYwSn9Zuh7lrlGD2cVGzw1RKGzyLSg=="
+          "version": "4.2.1",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
+          "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
         }
       }
     },
@@ -8435,9 +8313,9 @@
       "integrity": "sha1-1upkmUx5+XtipytCb75gVqGUu5A=",
       "dependencies": {
         "ansi-styles": {
-          "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.1.0.tgz",
-          "integrity": "sha1-CcIC1ckX7CMYjKpcnLkXnNlUd1A="
+          "version": "3.2.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
+          "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
         },
         "chalk": {
           "version": "2.0.1",
@@ -8450,14 +8328,14 @@
           "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
         },
         "postcss": {
-          "version": "6.0.6",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.6.tgz",
-          "integrity": "sha1-u6TVjohPx4yEDRU54Q7dqruPc70="
+          "version": "6.0.8",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.8.tgz",
+          "integrity": "sha512-G6WnRmdTt2jvJvY+aY+M0AO4YlbxE+slKPZb+jG2P2U9Tyxi3h1fYZ/DgiFU6DC6bv3XIEJoZt+f/kNh8BrWFw=="
         },
         "supports-color": {
-          "version": "4.2.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.0.tgz",
-          "integrity": "sha512-Ts0Mu/A1S1aZxEJNG88I4Oc9rcZSBFNac5e27yh4j2mqbhZSSzR1Ah79EYwSn9Zuh7lrlGD2cVGzw1RKGzyLSg=="
+          "version": "4.2.1",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
+          "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
         }
       }
     },
@@ -8467,9 +8345,9 @@
       "integrity": "sha1-7P+p1+GSUYOJ9CrQ6D9yrsRW6iA=",
       "dependencies": {
         "ansi-styles": {
-          "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.1.0.tgz",
-          "integrity": "sha1-CcIC1ckX7CMYjKpcnLkXnNlUd1A="
+          "version": "3.2.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
+          "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
         },
         "chalk": {
           "version": "2.0.1",
@@ -8482,14 +8360,14 @@
           "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
         },
         "postcss": {
-          "version": "6.0.6",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.6.tgz",
-          "integrity": "sha1-u6TVjohPx4yEDRU54Q7dqruPc70="
+          "version": "6.0.8",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.8.tgz",
+          "integrity": "sha512-G6WnRmdTt2jvJvY+aY+M0AO4YlbxE+slKPZb+jG2P2U9Tyxi3h1fYZ/DgiFU6DC6bv3XIEJoZt+f/kNh8BrWFw=="
         },
         "supports-color": {
-          "version": "4.2.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.0.tgz",
-          "integrity": "sha512-Ts0Mu/A1S1aZxEJNG88I4Oc9rcZSBFNac5e27yh4j2mqbhZSSzR1Ah79EYwSn9Zuh7lrlGD2cVGzw1RKGzyLSg=="
+          "version": "4.2.1",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
+          "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
         }
       }
     },
@@ -8596,24 +8474,12 @@
     "prop-types": {
       "version": "15.5.10",
       "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.5.10.tgz",
-      "integrity": "sha1-J5ffwxJhguOpXj37suiT3ddFYVQ=",
-      "dependencies": {
-        "core-js": {
-          "version": "1.2.7",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
-          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
-        },
-        "fbjs": {
-          "version": "0.8.12",
-          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz",
-          "integrity": "sha1-ELXZL3bUVXX9Y6IX1OoCvqL47QQ="
-        }
-      }
+      "integrity": "sha1-J5ffwxJhguOpXj37suiT3ddFYVQ="
     },
     "proxy-addr": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-1.1.4.tgz",
-      "integrity": "sha1-J+VF9pYKRKYn2bREZ+NcG2tM4vM="
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-1.1.5.tgz",
+      "integrity": "sha1-ccDuOxAt4/IC87ZPYI0XP8uhqRg="
     },
     "prr": {
       "version": "0.0.0",
@@ -8722,53 +8588,17 @@
     "react": {
       "version": "15.4.2",
       "resolved": "https://registry.npmjs.org/react/-/react-15.4.2.tgz",
-      "integrity": "sha1-QfeZGyYYU5K6m66WyIiefgGDl+8=",
-      "dependencies": {
-        "core-js": {
-          "version": "1.2.7",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
-          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
-        },
-        "fbjs": {
-          "version": "0.8.12",
-          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz",
-          "integrity": "sha1-ELXZL3bUVXX9Y6IX1OoCvqL47QQ="
-        }
-      }
+      "integrity": "sha1-QfeZGyYYU5K6m66WyIiefgGDl+8="
     },
     "react-addons-test-utils": {
       "version": "15.4.2",
       "resolved": "https://registry.npmjs.org/react-addons-test-utils/-/react-addons-test-utils-15.4.2.tgz",
-      "integrity": "sha1-k7yqcY/K5zYNQuj7HAl1bMNjAqI=",
-      "dependencies": {
-        "core-js": {
-          "version": "1.2.7",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
-          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
-        },
-        "fbjs": {
-          "version": "0.8.12",
-          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz",
-          "integrity": "sha1-ELXZL3bUVXX9Y6IX1OoCvqL47QQ="
-        }
-      }
+      "integrity": "sha1-k7yqcY/K5zYNQuj7HAl1bMNjAqI="
     },
     "react-dom": {
       "version": "15.4.2",
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-15.4.2.tgz",
-      "integrity": "sha1-AVNj8FsKH9Uq6e/dOgBg2QaVII8=",
-      "dependencies": {
-        "core-js": {
-          "version": "1.2.7",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
-          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
-        },
-        "fbjs": {
-          "version": "0.8.12",
-          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.12.tgz",
-          "integrity": "sha1-ELXZL3bUVXX9Y6IX1OoCvqL47QQ="
-        }
-      }
+      "integrity": "sha1-AVNj8FsKH9Uq6e/dOgBg2QaVII8="
     },
     "react-highlight": {
       "version": "0.9.0",
@@ -8914,11 +8744,6 @@
       "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.3.2.tgz",
       "integrity": "sha1-0ZQcZ7rUN+G+dkM63Vs4X5WxkmA="
     },
-    "regenerator-runtime": {
-      "version": "0.10.5",
-      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz",
-      "integrity": "sha1-M2w+/BIgrc7dosn6tntaeVWjNlg="
-    },
     "regex-cache": {
       "version": "0.4.3",
       "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.3.tgz",
@@ -9037,9 +8862,9 @@
       "integrity": "sha1-g1JeKtt333fIrQhqGyUQ8DJ2DAg="
     },
     "resolve": {
-      "version": "1.3.3",
-      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.3.3.tgz",
-      "integrity": "sha1-ZVkHw0aahoDcLeOidaj91paR8OU="
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.4.0.tgz",
+      "integrity": "sha512-aW7sVKPufyHqOmyyLzg/J+8606v5nevBgaliIlV7nUpVMsDnoBGV/cbSLNjZAg9q0Cfd/+easKVKQ8vOu8fn1Q=="
     },
     "resolve-dir": {
       "version": "0.1.1",
@@ -9077,9 +8902,9 @@
       "integrity": "sha1-8z/pz7Urv9UgqhgyO8ZdsRCht2w="
     },
     "rtl-css-js": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.1.1.tgz",
-      "integrity": "sha1-IZ0QchuARIRXcaA76i5cQ4eCECQ="
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.1.2.tgz",
+      "integrity": "sha1-HuipCwXhgy22cOohwluCCRtf/bs="
     },
     "run-async": {
       "version": "0.1.0",
@@ -9497,9 +9322,9 @@
       }
     },
     "sockjs-client": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/sockjs-client/-/sockjs-client-1.1.2.tgz",
-      "integrity": "sha1-8CEqhVDkyUaMjM6u79LjSTwDOtU=",
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/sockjs-client/-/sockjs-client-1.1.4.tgz",
+      "integrity": "sha1-W6vjhrd15M8U51IJEUUmVAFsixI=",
       "dependencies": {
         "faye-websocket": {
           "version": "0.11.1",
@@ -9605,9 +9430,9 @@
       "integrity": "sha1-Zwl8YB1pfOE2j0GPBs0gHPBSGlc="
     },
     "sprintf-js": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.1.1.tgz",
-      "integrity": "sha1-Nr54Mgr+WAH2zqPueLblqrlA6gw="
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
+      "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw="
     },
     "sshpk": {
       "version": "1.13.1",
@@ -9715,11 +9540,6 @@
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
       "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
     },
-    "string.prototype.codepointat": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/string.prototype.codepointat/-/string.prototype.codepointat-0.2.0.tgz",
-      "integrity": "sha1-aybpvTr8qnvjtCabUm3huCAArHg="
-    },
     "stringify-object": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/stringify-object/-/stringify-object-3.2.0.tgz",
@@ -9904,9 +9724,9 @@
       "integrity": "sha1-dkpaEa9QVhkhsTPztE5hhofg9cM="
     },
     "timed-out": {
-      "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-3.1.3.tgz",
-      "integrity": "sha1-lYYL/MXHbCd/j4Mm/Q9bLiDrohc="
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-4.0.1.tgz",
+      "integrity": "sha1-8y6srFoXW+ol1/q1Zas+2HQe9W8="
     },
     "timers-browserify": {
       "version": "1.4.2",
@@ -9994,11 +9814,21 @@
       "resolved": "https://registry.npmjs.org/to-arraybuffer/-/to-arraybuffer-1.0.1.tgz",
       "integrity": "sha1-fSKbH8xjfkZsoIEYCDanqr/4P0M="
     },
+    "to-iso-string": {
+      "version": "0.0.2",
+      "resolved": "https://registry.npmjs.org/to-iso-string/-/to-iso-string-0.0.2.tgz",
+      "integrity": "sha1-TcGeZk38y+Jb2NtQiwDG2hWCVdE="
+    },
     "tough-cookie": {
       "version": "2.3.2",
       "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.2.tgz",
       "integrity": "sha1-8IH3bkyFcg5sN6X6ztc3FQ2EByo="
     },
+    "tr46": {
+      "version": "0.0.3",
+      "resolved": "https://registry.npmjs.org/tr46/-/tr46-0.0.3.tgz",
+      "integrity": "sha1-gYT9NH2snNwYWZLzpmIuFLnZq2o="
+    },
     "trim-newlines": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/trim-newlines/-/trim-newlines-1.0.0.tgz",
@@ -10010,24 +9840,44 @@
       "integrity": "sha1-jbAWIuh35RuDFAyu58gIZK05DII="
     },
     "ts-loader": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/ts-loader/-/ts-loader-2.2.2.tgz",
-      "integrity": "sha512-HiusedxruMeHN1/BzpijS/rXSdup2P/IopamX235tLS3OuPU+eSXNyN3YgbHKzYEe71YkUhnm7X+VY4oOAGLtg==",
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/ts-loader/-/ts-loader-2.3.2.tgz",
+      "integrity": "sha512-KcQvWwla5nviCMX1511iKVsLfrx97Hbah6l5awE1HNL6eiyAzb3gSO8b5yasB6fK/qGukLpu9czWcd/AGGFy/g==",
       "dependencies": {
+        "ansi-styles": {
+          "version": "3.2.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
+          "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
+        },
+        "chalk": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.0.1.tgz",
+          "integrity": "sha512-Mp+FXEI+FrwY/XYV45b2YD3E8i3HwnEAoFcM0qlZzq/RZ9RwWitt2Y/c7cqRAz70U7hfekqx6qNYthuKFO6K0g=="
+        },
         "enhanced-resolve": {
-          "version": "3.3.0",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.3.0.tgz",
-          "integrity": "sha512-2qbxE7ek3YxPJ1ML6V+satHkzHpJQKWkRHmRx6mfAoW59yP8YH8BFplbegSP+u2hBd6B6KCOpvJQ3dZAP+hkpg=="
+          "version": "3.4.1",
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.4.1.tgz",
+          "integrity": "sha1-BCHjOf1xQZs9oT0Smzl5BAIwR24="
+        },
+        "has-flag": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
+          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
         },
         "loader-utils": {
           "version": "1.1.0",
           "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
           "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
         },
+        "supports-color": {
+          "version": "4.2.1",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
+          "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
+        },
         "tapable": {
-          "version": "0.2.6",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz",
-          "integrity": "sha1-IGvo4YiGC1FEJTdebxrom/sB/Y0="
+          "version": "0.2.7",
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.7.tgz",
+          "integrity": "sha1-5GwNqsuyuKmLmwzqD0BSEFgX7Vw="
         }
       }
     },
@@ -10037,38 +9887,31 @@
       "integrity": "sha1-vIAEFkaRkjp5/oN4u+s9ogF1OOw="
     },
     "tslint": {
-      "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.0.2.tgz",
-      "integrity": "sha1-1D8kwMH4Jt5/Ogl7t4CKi0Ml/qw=",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/tslint/-/tslint-5.5.0.tgz",
+      "integrity": "sha1-EOjas+MGH6YelELozuOYKs8gpqo="
+    },
+    "tslint-microsoft-contrib": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/tslint-microsoft-contrib/-/tslint-microsoft-contrib-5.0.1.tgz",
+      "integrity": "sha1-Mo7pwo0HzfeTKTIEyW4v+rkiGZQ=",
       "dependencies": {
-        "findup-sync": {
-          "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.3.0.tgz",
-          "integrity": "sha1-N5MKpdgWt3fANEXhlmzGeQpMCxY=",
-          "dependencies": {
-            "glob": {
-              "version": "5.0.15",
-              "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
-              "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
-            }
-          }
+        "tsutils": {
+          "version": "1.9.1",
+          "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-1.9.1.tgz",
+          "integrity": "sha1-ufmrROVa+WgYMdXyjQrur1x1DLA="
         }
       }
     },
-    "tslint-microsoft-contrib": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/tslint-microsoft-contrib/-/tslint-microsoft-contrib-4.0.0.tgz",
-      "integrity": "sha1-fgClbBQXJR0/kaiA78xDNhpp+yo="
-    },
     "tsscmp": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/tsscmp/-/tsscmp-1.0.5.tgz",
       "integrity": "sha1-fcSjOvcVgatDN9qR2FylQn69mpc="
     },
     "tsutils": {
-      "version": "1.9.1",
-      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-1.9.1.tgz",
-      "integrity": "sha1-ufmrROVa+WgYMdXyjQrur1x1DLA="
+      "version": "2.8.0",
+      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.8.0.tgz",
+      "integrity": "sha1-AWAXNymzvxOGKN0UoVN+AIUdgUo="
     },
     "tty-browserify": {
       "version": "0.0.0",
@@ -10107,14 +9950,14 @@
       "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
     },
     "typescript": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz",
-      "integrity": "sha1-YGAiUIR5tV/6NotY/uljoD39eww="
+      "version": "2.4.2",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.4.2.tgz",
+      "integrity": "sha1-+DlfhdRZJ2BnyYiqQYN6j4KHCEQ="
     },
     "ua-parser-js": {
-      "version": "0.7.13",
-      "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.13.tgz",
-      "integrity": "sha1-zZ3S+GSTs/RNvu7zeA/adMXuFL4="
+      "version": "0.7.14",
+      "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.14.tgz",
+      "integrity": "sha1-EQ1T+kw/MmwSEpK76skE0uAzh8o="
     },
     "uglify-js": {
       "version": "2.8.29",
@@ -10226,14 +10069,14 @@
       "integrity": "sha1-sr9O6FFKrmFltIF4KdIbLvSZBOw="
     },
     "unzip-response": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-1.0.2.tgz",
-      "integrity": "sha1-uYTwh3/AqJwsdzzB73tbIytbBv4="
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-2.0.1.tgz",
+      "integrity": "sha1-0vD3N9FrBhXnKmk17QQhRXLVb5c="
     },
     "update-notifier": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-1.0.3.tgz",
-      "integrity": "sha1-j5LFFUgr1oMbfJMBPnD4dVLHz1o="
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-2.2.0.tgz",
+      "integrity": "sha1-G1g3z5DAc22IYncytmHBOPht5y8="
     },
     "upper-case": {
       "version": "1.1.3",
@@ -10358,11 +10201,6 @@
       "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.5.3.tgz",
       "integrity": "sha1-sEVbOPxeDPMNQyUTLkYZcMIJHN4="
     },
-    "vinyl-bufferstream": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/vinyl-bufferstream/-/vinyl-bufferstream-1.0.1.tgz",
-      "integrity": "sha1-BTeGn1gO/6TKRay0dXnkuf5jCBo="
-    },
     "vinyl-fs": {
       "version": "0.3.14",
       "resolved": "https://registry.npmjs.org/vinyl-fs/-/vinyl-fs-0.3.14.tgz",
@@ -10454,6 +10292,11 @@
       "resolved": "https://registry.npmjs.org/wbuf/-/wbuf-1.7.2.tgz",
       "integrity": "sha1-1pe5nx9ZUS3ydRvkJ2nBWAtYAf4="
     },
+    "webidl-conversions": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-3.0.1.tgz",
+      "integrity": "sha1-JFNCdeKnvGvnvIZhHMFq4KVlSHE="
+    },
     "webpack": {
       "version": "2.2.1",
       "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.2.1.tgz",
@@ -10485,9 +10328,9 @@
           "integrity": "sha512-Na7ZlwCOqoaW5RwUK1WpXws2kv8mNhWdTlzob0UXulk6G9BDbyiJaGTYBIX61Ozn9l1EPPJpICZb4DaOpT9NlQ=="
         },
         "enhanced-resolve": {
-          "version": "3.3.0",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.3.0.tgz",
-          "integrity": "sha512-2qbxE7ek3YxPJ1ML6V+satHkzHpJQKWkRHmRx6mfAoW59yP8YH8BFplbegSP+u2hBd6B6KCOpvJQ3dZAP+hkpg=="
+          "version": "3.4.1",
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.4.1.tgz",
+          "integrity": "sha1-BCHjOf1xQZs9oT0Smzl5BAIwR24="
         },
         "https-browserify": {
           "version": "0.0.1",
@@ -10532,9 +10375,9 @@
           "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         },
         "tapable": {
-          "version": "0.2.6",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.6.tgz",
-          "integrity": "sha1-IGvo4YiGC1FEJTdebxrom/sB/Y0="
+          "version": "0.2.7",
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.7.tgz",
+          "integrity": "sha1-5GwNqsuyuKmLmwzqD0BSEFgX7Vw="
         },
         "timers-browserify": {
           "version": "2.0.2",
@@ -10554,14 +10397,9 @@
           }
         },
         "watchpack": {
-          "version": "1.3.1",
-          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.3.1.tgz",
-          "integrity": "sha1-fYaTkHsozmAT5/NhCqKhrPB9rYc="
-        },
-        "webpack-sources": {
-          "version": "0.1.5",
-          "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-0.1.5.tgz",
-          "integrity": "sha1-qh86vw8NdNtxEcQOUAuE+WZkB1A="
+          "version": "1.4.0",
+          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.4.0.tgz",
+          "integrity": "sha1-ShRyvLuVK9Cpu0A2gB+VTfs5+qw="
         },
         "yargs": {
           "version": "6.6.0",
@@ -10655,9 +10493,9 @@
       "integrity": "sha1-CWkdCXOjCtH4Ksc6EuIIfwpHVPk="
     },
     "webpack-dev-server": {
-      "version": "2.5.1",
-      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.5.1.tgz",
-      "integrity": "sha1-oC5yaoe7YD211xq7fW0mSb8Qx2k=",
+      "version": "2.6.1",
+      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.6.1.tgz",
+      "integrity": "sha1-Cykqnaltr4CmWYj2n4e0Fm5d7+c=",
       "dependencies": {
         "camelcase": {
           "version": "3.0.0",
@@ -10731,32 +10569,25 @@
       }
     },
     "webpack-sources": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-0.2.3.tgz",
-      "integrity": "sha1-F8Yr+vE8cH+dAsR54Nzd6DgGl/s=",
-      "dependencies": {
-        "source-list-map": {
-          "version": "1.1.2",
-          "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-1.1.2.tgz",
-          "integrity": "sha1-mIkBnRAkzOVc3AaUmDN+9hhqEaE="
-        }
-      }
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-0.1.5.tgz",
+      "integrity": "sha1-qh86vw8NdNtxEcQOUAuE+WZkB1A="
     },
     "webpack-split-by-path": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/webpack-split-by-path/-/webpack-split-by-path-2.0.0.tgz",
       "integrity": "sha1-K2p1MB82lfc9h4jZkMTwxxVn4rA="
     },
-    "webpack-stats-plugin": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/webpack-stats-plugin/-/webpack-stats-plugin-0.1.5.tgz",
-      "integrity": "sha1-KeXxLr/VMVjTHWVqETrB97hhedk="
-    },
     "webpack-stream": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/webpack-stream/-/webpack-stream-3.2.0.tgz",
       "integrity": "sha1-Oh0WD7EdQXJ7fObzL3IkZPmLIYY=",
       "dependencies": {
+        "browserify-aes": {
+          "version": "0.4.0",
+          "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-0.4.0.tgz",
+          "integrity": "sha1-BnFJtmjfMcS1hTPgLQHoBthgjiw="
+        },
         "camelcase": {
           "version": "1.2.1",
           "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
@@ -10890,23 +10721,6 @@
         }
       }
     },
-    "webpack-visualizer-plugin": {
-      "version": "0.1.11",
-      "resolved": "https://registry.npmjs.org/webpack-visualizer-plugin/-/webpack-visualizer-plugin-0.1.11.tgz",
-      "integrity": "sha1-uHcK2GtPZSYSxosbeCJT+vn4o04=",
-      "dependencies": {
-        "react": {
-          "version": "0.14.9",
-          "resolved": "https://registry.npmjs.org/react/-/react-0.14.9.tgz",
-          "integrity": "sha1-kRCmSXxJ1EuhwO3TF67CnC4NkdE="
-        },
-        "react-dom": {
-          "version": "0.14.9",
-          "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-0.14.9.tgz",
-          "integrity": "sha1-BQZKPc8PsYgKOyv8nVjFXY2fYpM="
-        }
-      }
-    },
     "websocket-driver": {
       "version": "0.6.5",
       "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.6.5.tgz",
@@ -10918,9 +10732,14 @@
       "integrity": "sha1-domUmcGEtu91Q3fC27DNbLVdKec="
     },
     "whatwg-fetch": {
-      "version": "0.9.0",
-      "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-0.9.0.tgz",
-      "integrity": "sha1-DjaExsuZlbQ+/J3wPkw2XZX9nMA="
+      "version": "0.11.0",
+      "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-0.11.0.tgz",
+      "integrity": "sha1-RrHRjQqpmVWXHvGi9arFBq3SiBU="
+    },
+    "whatwg-url": {
+      "version": "4.7.1",
+      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-4.7.1.tgz",
+      "integrity": "sha1-303C4/JaY7H6WzLtbWwTlXfWkN4="
     },
     "whet.extend": {
       "version": "0.9.9",
@@ -10968,9 +10787,9 @@
       "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8="
     },
     "write-file-atomic": {
-      "version": "1.3.4",
-      "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-1.3.4.tgz",
-      "integrity": "sha1-+Aek8LHZ6ROuekgRLmzDrxmRtF8="
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.1.0.tgz",
+      "integrity": "sha512-0TZ20a+xcIl4u0+Mj5xDH2yOWdmQiXlKf9Hm+TgDXjTMsEYb+gDrmb8e8UNAzMCitX8NBqG4Z/FUQIyzv/R1JQ=="
     },
     "ws": {
       "version": "1.1.4",
@@ -10983,9 +10802,9 @@
       "integrity": "sha1-OS2LotDxw00e4tYw8V0O+2jhBIo="
     },
     "xdg-basedir": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-2.0.0.tgz",
-      "integrity": "sha1-7byQPMOF/ARSPZZqM1UEtVBNG9I="
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-3.0.0.tgz",
+      "integrity": "sha1-SWsswQnsqNus/i3HK2A8F8WHCtQ="
     },
     "xml": {
       "version": "1.0.1",
@@ -11065,4 +10884,4 @@
       "integrity": "sha1-RCs4+denr3rke/z8NWhz6GFq0bc="
     }
   }
-}
+}
\ No newline at end of file
diff --git a/common/config/rush/pinned-versions.json b/common/config/rush/pinned-versions.json
index 25d1374df7f18..fe43ebf76a1ad 100644
--- a/common/config/rush/pinned-versions.json
+++ b/common/config/rush/pinned-versions.json
@@ -4,10 +4,10 @@
   "react-dom": "15.4.2",
   "enzyme": "2.7.0",
   "webpack": "2.2.1",
-  "tslint": "4.0.2",
-  "tslint-microsoft-contrib": "4.0.0",
+  "tslint": "5.5.0",
+  "tslint-microsoft-contrib": "5.0.1",
   "karma-sinon-chai": "1.3.1",
-  "typescript": "2.2.2",
+  "typescript": "2.4.2",
   "sinon-chai": "2.10.0",
   "sinon": "2.3.2"
 }
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index bfda313e854a9..0202c77d3bda0 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -16,15 +16,15 @@
     "test": "gulp"
   },
   "devDependencies": {
-    "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
+    "@microsoft/web-library-build": "^3.2.1",
     "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.0",
     "@types/es6-promise": "0.0.32",
     "@types/highlight.js": "9.1.9",
     "@types/mocha": "2.2.39",
-    "@types/react": "15.0.29",
+    "@types/react": "15.0.38",
     "@types/react-addons-test-utils": "0.14.18",
-    "@types/react-dom": "15.5.0",
+    "@types/react-dom": "15.5.1",
     "@types/webpack-env": "1.13.0",
     "css-loader": "^0.28.0",
     "enzyme": "^2.7.0",
@@ -39,9 +39,9 @@
     "style-loader": "^0.17.0",
     "source-map-loader": "0.2.1",
     "ts-loader": "^2.1.0",
-    "typescript": "2.2.2",
+    "typescript": "2.4.2",
     "webpack-dev-server": "^2.4.1",
-    "webpack": "^2.4.1"
+    "webpack": "^3.4.1"
   },
   "peerDependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx b/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
index 422a8a4d35455..9495d446bdcca 100644
--- a/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
+++ b/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
@@ -92,7 +92,7 @@ export class ComponentPage extends React.Component<IComponentPageProps, {}> {
     if (bestPractices && dos && donts) {
       links.push(
         <div className='ComponentPage-navLink' key='nav-link'>
-          <Link href={ this._baseUrl + '#Best Practices' }>Best Practices</Link>
+          <Link { ...{ href: this._baseUrl + '#Best Practices' } }>Best Practices</Link>
         </div>
       );
     }
@@ -100,14 +100,14 @@ export class ComponentPage extends React.Component<IComponentPageProps, {}> {
     return (
       <div className='ComponentPage-navigation'>
         <div className='ComponentPage-navLink'>
-          <Link href={ this._baseUrl + '#Overview' }>Overview</Link>
+          <Link { ...{ href: this._baseUrl + '#Overview' } }>Overview</Link>
         </div>
         { links }
         <div className='ComponentPage-navLink'>
-          <Link href={ this._baseUrl + '#Variants' }>Variants</Link>
+          <Link { ...{ href: this._baseUrl + '#Variants' } }>Variants</Link>
         </div>
         <div className='ComponentPage-navLink'>
-          <Link href={ this._baseUrl + '#Implementation' }>Implementation</Link>
+          <Link { ...{ href: this._baseUrl + '#Implementation' } }>Implementation</Link>
         </div>
       </div>
     );
diff --git a/packages/example-app-base/src/components/ExampleCard/ExampleCard.tsx b/packages/example-app-base/src/components/ExampleCard/ExampleCard.tsx
index 39d7d4e744d1c..2cd15dcf3d411 100644
--- a/packages/example-app-base/src/components/ExampleCard/ExampleCard.tsx
+++ b/packages/example-app-base/src/components/ExampleCard/ExampleCard.tsx
@@ -44,7 +44,10 @@ export class ExampleCard extends React.Component<IExampleCardProps, IExampleCard
               <CommandButton
                 iconProps={ { iconName: 'Embed' } }
                 onClick={ this._onToggleCodeClick }
-                className={ css('ExampleCard-codeButton', { 'is-active': isCodeVisible }) }
+                className={ css(
+                  'ExampleCard-codeButton',
+                  isCodeVisible && 'is-active'
+                ) }
               >
                 { isCodeVisible ? 'Hide code' : 'Show code' }
               </CommandButton>
@@ -60,7 +63,13 @@ export class ExampleCard extends React.Component<IExampleCardProps, IExampleCard
           ) }
         </div>
 
-        <div className={ css('ExampleCard-example', { ' is-right-aligned': (isRightAligned) }) } data-is-scrollable='true'>
+        <div
+          className={ css(
+            'ExampleCard-example',
+            isRightAligned && ' is-right-aligned'
+          ) }
+          data-is-scrollable='true'
+        >
           { children }
         </div>
 
diff --git a/packages/example-app-base/src/utilities/beep.ts b/packages/example-app-base/src/utilities/beep.ts
index f0027f4c5d325..31837736af360 100644
--- a/packages/example-app-base/src/utilities/beep.ts
+++ b/packages/example-app-base/src/utilities/beep.ts
@@ -13,8 +13,9 @@ export function beep() {
 
 function playBeep() {
   if (_beepsLeft) {
-    const beep = new Audio(BEEP_DATA);
-    beep.play();
+    const beepSound = new Audio(BEEP_DATA);
+
+    beepSound.play();
 
     setTimeout(() => {
       _beepsLeft--;
diff --git a/packages/example-component/.npmrc b/packages/example-component/.npmrc
deleted file mode 100644
index 825c83e09df4d..0000000000000
--- a/packages/example-component/.npmrc
+++ /dev/null
@@ -1,2 +0,0 @@
-registry=https://registry.npmjs.org/
-
diff --git a/packages/example-component/gulpfile.js b/packages/example-component/gulpfile.js
deleted file mode 100644
index 68ded2f36e037..0000000000000
--- a/packages/example-component/gulpfile.js
+++ /dev/null
@@ -1,28 +0,0 @@
-let build = require('@microsoft/web-library-build');
-let gulp = require('gulp');
-
-/* Disable the gcb-webpack build, since we don't need to produce a bundle. */
-build.webpack.isEnabled = () => false;
-
-// Configure custom lint overrides.
-let rules = Object.assign(
-  {},
-  require('./node_modules/@microsoft/gulp-core-build-typescript/lib/defaultTslint.json').rules,
-  require('./node_modules/office-ui-fabric-react-tslint/tslint.json').rules,
-  require('./tslint.json').rules
-);
-build.tslint.setConfig({
-  lintConfig: { rules },
-  displayAsWarning: false
-});
-
-// Use css modules.
-build.sass.setConfig({
-  useCSSModules: true,
-  moduleExportName: ''
-});
-
-// Custom build steps.
-build.task('tslint', build.tslint);
-
-build.initialize(gulp);
diff --git a/packages/example-component/karma.config.js b/packages/example-component/karma.config.js
deleted file mode 100644
index e4ad6872a5339..0000000000000
--- a/packages/example-component/karma.config.js
+++ /dev/null
@@ -1,106 +0,0 @@
-'use strict';
-
-// Karma configuration
-// Generated on Thu Oct 08 2015 18:13:05 GMT-0700 (PDT)
-
-let path = require('path');
-let build = require('@microsoft/web-library-build');
-let configResources = build.karma.resources;
-
-let bindPolyfillPath = configResources.bindPolyfillPath;
-let debugRun = (process.argv.indexOf('--debug') > -1);
-
-let testsFilePath = path.join(build.getConfig().tempFolder, 'tests.js');
-
-module.exports = function (config) {
-  let karmaConfig = {
-
-    // base path that will be used to resolve all patterns (eg. files, exclude)
-    basePath: '.',
-
-    // frameworks to use
-    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
-    frameworks: ['mocha', 'sinon-chai'],
-
-
-    // list of files / patterns to load in the browser
-    files: [bindPolyfillPath].concat([testsFilePath]),
-
-
-    // list of files to exclude
-    exclude: [],
-
-
-    // webpack config for bundling tests.
-    webpack: {
-      module: {
-        loaders: [
-          {
-            test: /sinon\.js$/,
-            loader: 'imports?define=>false'
-          },
-          debugRun ? {} : {
-            test: /\.js/,
-            exclude: /(test|node_modules|bower_components)/,
-            loader: configResources.istanbulInstrumenterLoaderPath,
-            enforce: 'post'
-          }
-        ]
-      },
-      resolve: {
-        modules: [
-          'lib',
-          'node_modules'
-        ]
-      }
-    },
-
-    webpackMiddleware: {
-      noInfo: true
-    },
-
-    // preprocess matching files before serving them to the browser
-    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
-    preprocessors: {
-      [testsFilePath]: ['webpack'],
-      'lib/**/*.js': ['webpack']
-    },
-
-    plugins: configResources.plugins.concat([
-    ]),
-
-    // test results reporter to use
-    // possible values: 'dots', 'progress'
-    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
-    reporters: ['mocha-clean', 'coverage'],
-
-
-    // web server port
-    port: 9876,
-
-
-    // enable / disable colors in the output (reporters and logs)
-    colors: true,
-
-
-    // level of logging
-    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
-    logLevel: config.LOG_INFO,
-
-
-    // enable / disable watching file and executing tests whenever any file changes
-    autoWatch: false,
-
-
-    // start these browsers
-    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
-    browsers: ['PhantomJS'],
-
-
-    // Continuous Integration mode
-    // if true, Karma captures browsers, runs the tests and exits
-    singleRun: true
-  };
-
-  config.set(karmaConfig);
-};
diff --git a/packages/example-component/package.json b/packages/example-component/package.json
deleted file mode 100644
index 309109a7fed58..0000000000000
--- a/packages/example-component/package.json
+++ /dev/null
@@ -1,55 +0,0 @@
-{
-  "name": "@uifabric/example-component",
-  "version": "1.0.45",
-  "description": "",
-  "main": "index.js",
-  "scripts": {
-    "build": "gulp",
-    "clean": "gulp clean",
-    "test": "gulp test --production",
-    "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js --open"
-  },
-  "author": "",
-  "devDependencies": {
-    "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
-    "@microsoft/load-themed-styles": "^1.2.2",
-    "@types/chai": "3.4.35",
-    "@types/enzyme": "2.8.0",
-    "@types/es6-promise": "^0.0.32",
-    "@types/mocha": "2.2.39",
-    "@types/react": "15.0.29",
-    "@types/react-addons-test-utils": "0.14.18",
-    "@types/react-dom": "15.5.0",
-    "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": "4.1.1",
-    "@uifabric/utilities": "4.8.1",
-    "autoprefixer": "^6.7.6",
-    "chai": "^3.5.0",
-    "css-loader": "^0.28.0",
-    "load-themed-styles-loader": "^0.0.3",
-    "mocha": "^3.2.0",
-    "mocha-loader": "^1.1.1",
-    "node-sass": "^4.5.0",
-    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
-    "postcss-loader": "^1.3.3",
-    "react": "^15.4.2",
-    "react-addons-test-utils": "^15.4.2",
-    "react-dom": "^15.4.2",
-    "sass-loader": "^6.0.3",
-    "style-loader": "^0.17.0",
-    "ts-loader": "^2.0.1",
-    "typescript": "2.2.2",
-    "webpack": "^2.4.1",
-    "webpack-dev-server": "^2.4.1",
-    "webpack-notifier": "^1.5.0"
-  },
-  "peerDependencies": {
-    "@microsoft/load-themed-styles": "^1.2.2",
-    "react": "^0.14 || ^15.4.2-0 || ^16.0.0-0",
-    "react-dom": "^0.14 || ^15.4.2 || ^16.0.0-0"
-  },
-  "dependencies": {
-    "office-ui-fabric-react": ">=4.28.0 <5.0.0",
-    "tslib": "^1.6.0"
-  }
-}
\ No newline at end of file
diff --git a/packages/example-component/src/ExampleComponent.Props.ts b/packages/example-component/src/ExampleComponent.Props.ts
deleted file mode 100644
index 67d9cfe2d9387..0000000000000
--- a/packages/example-component/src/ExampleComponent.Props.ts
+++ /dev/null
@@ -1,52 +0,0 @@
-import { ExampleComponent } from './ExampleComponent';
-import { IRenderFunction } from '@uifabric/utilities';
-
-export interface IExampleComponentProps extends React.HTMLAttributes<HTMLDivElement | ExampleComponent> {
-  /**
-   * Optional icon name using fabric icons.
-   *
-   * @type {string}
-   * @memberOf IExampleComponentProps
-   */
-  iconName?: string;
-
-  /**
-   * Optional text to display.
-   *
-   * @type {string}
-   * @memberOf IExampleComponentProps
-   */
-  text?: string;
-
-  /**
-   * Optional render override for the root element.
-   *
-   * @type {IRenderFunction<IExampleComponentProps>}
-   * @memberOf IExampleComponentProps
-   */
-  onRenderRoot?: IRenderFunction<IExampleComponentProps>;
-
-  /**
-   * Optional render override for the icon element.
-   *
-   * @type {IRenderFunction<IExampleComponentProps>}
-   * @memberOf IExampleComponentProps
-   */
-  onRenderIcon?: IRenderFunction<IExampleComponentProps>;
-
-  /**
-   * Optional render override for the text element between the icon and chevron.
-   *
-   * @type {IRenderFunction<IExampleComponentProps>}
-   * @memberOf IExampleComponentProps
-   */
-  onRenderText?: IRenderFunction<IExampleComponentProps>;
-
-  /**
-   * Optional render override for the chevron.
-   *
-   * @type {IRenderFunction<IExampleComponentProps>}
-   * @memberOf IExampleComponentProps
-   */
-  onRenderChevron?: IRenderFunction<IExampleComponentProps>;
-}
\ No newline at end of file
diff --git a/packages/example-component/src/ExampleComponent.scss b/packages/example-component/src/ExampleComponent.scss
deleted file mode 100644
index 187b59774804d..0000000000000
--- a/packages/example-component/src/ExampleComponent.scss
+++ /dev/null
@@ -1,36 +0,0 @@
-/* TODO: Get fabric common scss in here. Or migrate to glamor. */
-
-.root {
-  background: red;
-}
-
-.button {
-  border: none;
-  padding: 0 16px;
-  background: blue;
-  color: white;
-  height: 32px;
-  min-width: 100px;
-}
-
-.flexContainer {
-  display: flex;
-  align-items: center;
-}
-
-.text {
-  background: green;
-  padding: 4px;
-}
-
-.icon {
-  background: blue;
-  padding: 4px;
-}
-
-.chevron {
-  background: orange;
-  padding: 0 4px;
-  margin-left: auto;
-  margin-right: -12px;
-}
\ No newline at end of file
diff --git a/packages/example-component/src/ExampleComponent.test.tsx b/packages/example-component/src/ExampleComponent.test.tsx
deleted file mode 100644
index 2a744d2e2cdf7..0000000000000
--- a/packages/example-component/src/ExampleComponent.test.tsx
+++ /dev/null
@@ -1,21 +0,0 @@
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-/* tslint:enable:no-unused-variable */
-import * as ReactDOM from 'react-dom';
-import { expect } from 'chai';
-import * as ReactTestUtils from 'react-addons-test-utils';
-import { ExampleComponent } from './ExampleComponent';
-
-describe('ExampleComponent', () => {
-
-  it('Renders without throwing', () => {
-    const component: ExampleComponent = ReactTestUtils.renderIntoDocument(
-      <ExampleComponent />
-    ) as ExampleComponent;
-    const renderedDOM: Element = ReactDOM.findDOMNode(component as React.ReactInstance);
-    const rootElement: HTMLDivElement | null = renderedDOM.querySelector('div');
-
-    expect(rootElement).to.not.be.empty;
-  });
-
-});
diff --git a/packages/example-component/src/ExampleComponent.tsx b/packages/example-component/src/ExampleComponent.tsx
deleted file mode 100644
index 3353b2ebddaa8..0000000000000
--- a/packages/example-component/src/ExampleComponent.tsx
+++ /dev/null
@@ -1,101 +0,0 @@
-/**
-* ExampleComponent.tsx
-* Author:
-* Copyright: Microsoft 2016
-*
-* Type definitions to support the plugin.
-*/
-
-import * as React from 'react';
-import {
-  BaseComponent,
-  getNativeProps,
-  buttonProperties,
-  anchorProperties,
-  css
-} from '@uifabric/utilities';
-import { IExampleComponentProps } from './ExampleComponent.Props';
-
-/* tslint:disable:no-any */
-import * as stylesImport from './ExampleComponent.scss';
-const styles: any = stylesImport;
-/* tslint:enable:no-any */
-
-/**
- * Example component implementation which renders the skeconston of a Button component.
- *
- * @export
- * @class ExampleComponent
- * @extends {BaseComponent<IExampleComponentProps, {}>}
- */
-export class ExampleComponent extends BaseComponent<IExampleComponentProps, {}> {
-
-  public render(): JSX.Element | null {
-    const {
-      onRenderRoot = this._onRenderRoot
-    } = this.props;
-
-    return onRenderRoot(this.props, this._onRenderRoot);
-  }
-
-  private _onRenderRoot = (props: IExampleComponentProps): JSX.Element => {
-    const { className, href }: IExampleComponentProps = this.props;
-
-    if (!!href) {
-      const anchorProps: React.HTMLAttributes<HTMLAnchorElement> =
-        getNativeProps(this.props, anchorProperties);
-
-      return (
-        <a
-          { ...anchorProps }
-          className={ css(styles.root, className) }
-          { ...{ children: this._onRenderChildren() } }
-        />
-      );
-    } else {
-      const buttonProps: React.HTMLAttributes<HTMLButtonElement> =
-        getNativeProps(this.props, buttonProperties);
-
-      return (
-        <button
-          { ...buttonProps }
-          className={ css(styles.button).toString() }
-          { ...{ children: this._onRenderChildren() } }
-        />
-      );
-    }
-  }
-
-  private _onRenderChildren(): JSX.Element {
-    const {
-      children,
-      onRenderIcon = this._onRenderIcon,
-      onRenderText = this._onRenderText,
-      onRenderChevron = this._onRenderChevron
-    } = this.props;
-
-    return (
-      <div className={ css(styles.flexContainer).toString() }>
-        { onRenderIcon(this.props, this._onRenderIcon) }
-        { onRenderText(this.props, this._onRenderText) }
-        { children }
-        { onRenderChevron(this.props, this._onRenderChevron) }
-      </div>
-    );
-  }
-
-  private _onRenderIcon = (props: IExampleComponentProps): JSX.Element => {
-
-    return <i className={ 'ms-Icon ms-Icon--Mail ' + css(styles.icon).toString() } />;
-  }
-
-  private _onRenderText = (props: IExampleComponentProps): JSX.Element | null => {
-    return !!props.text ? (
-      <div className={ css(styles.text).toString() }>{ props.text }</div>
-    ) : null;
-  }
-
-  private _onRenderChevron = (props: IExampleComponentProps): JSX.Element => {
-    return <i className={ 'ms-Icon ms-Icon--ChevronDown ' + css(styles.chevron).toString() } />;
-  }
-}
diff --git a/packages/example-component/src/ExampleComponentPage.tsx b/packages/example-component/src/ExampleComponentPage.tsx
deleted file mode 100644
index 8283c3325aa83..0000000000000
--- a/packages/example-component/src/ExampleComponentPage.tsx
+++ /dev/null
@@ -1,55 +0,0 @@
-import * as React from 'react';
-import {
-  ExampleCard,
-  IComponentDemoPageProps,
-  ComponentPage,
-  // PropertiesTableSet
-} from '@uifabric/example-app-base';
-
-import { ExampleComponentBasicExample } from './examples/ExampleComponent.Basic.Example';
-
-// const LabelBasicExampleCode = require('./examples/Label.Basic.Example.tsx') as string;
-
-export class ExampleComponentPage extends React.Component<IComponentDemoPageProps, {}> {
-  public render(): JSX.Element {
-    return (
-      <ComponentPage
-        title='ExampleComponent'
-        componentName='ExampleComponentBasicExample'
-        exampleCards={
-          <ExampleCard title='ExampleComponent Basic Example'>
-            <ExampleComponentBasicExample />
-          </ExampleCard>
-        }
-        overview={
-          <div>
-            <p>
-              Lorem ipsum dolar.
-            </p>
-          </div>
-        }
-        bestPractices={
-          <div></div>
-        }
-        dos={
-          <div>
-            <ul>
-              <li>Lorem ipsum dolar.</li>
-            </ul>
-          </div>
-        }
-        donts={
-          <div>
-            <ul>
-              <li>Lorem ipsum dolar.</li>
-            </ul>
-          </div>
-        }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/Label/Label.html'>Fabric JS</a>
-        }
-        isHeaderVisible={ this.props.isHeaderVisible }>
-      </ComponentPage>
-    );
-  }
-}
diff --git a/packages/example-component/src/demoIndex.tsx b/packages/example-component/src/demoIndex.tsx
deleted file mode 100644
index bd91f35e82ed9..0000000000000
--- a/packages/example-component/src/demoIndex.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import * as React from 'react';
-import { examplesOf, createApp } from '@uifabric/example-app-base';
-import { ExampleComponent } from './ExampleComponent';
-import { ExampleComponentPage } from './ExampleComponentPage';
-
-createApp([
-  examplesOf('Documentation')
-    .add('Component docs', () => <ExampleComponentPage />),
-
-  examplesOf('ExampleComponent examples')
-    .add('Empty state', () => (
-      <ExampleComponent />
-    ))
-    .add('With text', () => (
-      <ExampleComponent text='I am text' />
-    ))
-    .add('With text and children', () => (
-      <ExampleComponent>
-        <div>I am a div</div>
-        <div>I am another div</div>
-      </ExampleComponent>
-    ))
-    .add('With a red background', () => (
-      <ExampleComponent style={ { background: 'red' } } />
-    ))
-
-]);
diff --git a/packages/example-component/src/examples/ExampleComponent.Basic.Example.tsx b/packages/example-component/src/examples/ExampleComponent.Basic.Example.tsx
deleted file mode 100644
index 42e906c1c78b5..0000000000000
--- a/packages/example-component/src/examples/ExampleComponent.Basic.Example.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import * as React from 'react';
-import { ExampleComponent } from '@uifabric/example-component';
-
-export class ExampleComponentBasicExample extends React.Component<{}, {}> {
-
-  public render(): JSX.Element {
-    return (
-      <ExampleComponent />
-    );
-  }
-}
diff --git a/packages/example-component/src/index.ts b/packages/example-component/src/index.ts
deleted file mode 100644
index 8b05144703cd2..0000000000000
--- a/packages/example-component/src/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { ExampleComponent } from './ExampleComponent';
\ No newline at end of file
diff --git a/packages/example-component/tsconfig.json b/packages/example-component/tsconfig.json
deleted file mode 100644
index b20ae504e0f73..0000000000000
--- a/packages/example-component/tsconfig.json
+++ /dev/null
@@ -1,37 +0,0 @@
-{
-  "compilerOptions": {
-    "baseUrl": ".",
-    "target": "es5",
-    "module": "commonjs",
-    "noImplicitAny": false,
-    "strictNullChecks": true,
-    "experimentalDecorators": true,
-    "importHelpers": true,
-    "forceConsistentCasingInFileNames": true,
-    "moduleResolution": "node",
-    "sourceMap": true,
-    "jsx": "react",
-    "outDir": "lib",
-    "paths": {
-      "@uifabric/example-component": [
-        "src"
-      ]
-    },
-    "lib": [
-      "es2017",
-      "dom"
-    ],
-    "types": [
-      "chai",
-      "mocha",
-      "webpack-env"
-    ]
-  },
-  "include": [
-    "src/**/*"
-  ],
-  "exclude": [
-    "node_modules",
-    "**/*.spec.ts"
-  ]
-}
\ No newline at end of file
diff --git a/packages/example-component/tslint.json b/packages/example-component/tslint.json
deleted file mode 100644
index 621ee6ba04605..0000000000000
--- a/packages/example-component/tslint.json
+++ /dev/null
@@ -1,6 +0,0 @@
-{
-  "extends": [
-    "office-ui-fabric-react-tslint"
-  ],
-  "rules": {}
-}
\ No newline at end of file
diff --git a/packages/example-component/webpack.config.js b/packages/example-component/webpack.config.js
deleted file mode 100644
index 3bf47d76cff04..0000000000000
--- a/packages/example-component/webpack.config.js
+++ /dev/null
@@ -1,77 +0,0 @@
-let path = require('path');
-let WebpackNotifierPlugin = require('webpack-notifier');
-
-const PACKAGE_NAME = require('./package.json').name;
-
-module.exports = {
-  entry: './src/examples.tsx',
-
-  output: {
-    path: path.resolve(__dirname, 'dist'),
-    filename: 'bundle.js',
-  },
-
-  externals: {
-    'react': 'React',
-    'react-dom': 'ReactDOM'
-  },
-
-  resolve: {
-    alias: {
-      [PACKAGE_NAME]: path.join(__dirname, 'src')
-    },
-    extensions: ['.ts', '.tsx', '.js']
-  },
-
-  devtool: 'source-map',
-
-  devServer: {
-    contentBase: path.resolve(__dirname, 'dist'),
-    inline: true
-  },
-
-  module: {
-    loaders: [
-      {
-        test: /\.tsx?$/,
-        loader: 'ts-loader',
-        exclude: [
-          /node_modules/
-        ]
-      },
-      {
-        test: /\.scss$/,
-        use: [
-          {
-            loader: "load-themed-styles-loader" // creates style nodes from JS strings
-          }, {
-            loader: "css-loader", // translates CSS into CommonJS
-            options: {
-              modules: true,
-              importLoaders: 2,
-              localIdentName: '[name]_[local]_[hash:base64:5]',
-              minimize: true
-            }
-          },
-          {
-            loader: 'postcss-loader',
-            options: {
-              plugins: function () {
-                return [
-                  require('autoprefixer')
-                ];
-              }
-            }
-          },
-          {
-            loader: "sass-loader" // compiles sass to CSS
-          }
-        ]
-      }
-    ]
-  },
-
-  plugins: [
-    new WebpackNotifierPlugin()
-  ]
-}
diff --git a/packages/office-ui-fabric-react-tslint/package.json b/packages/office-ui-fabric-react-tslint/package.json
index 95f4c7929fd95..ddd1ac5d9146b 100644
--- a/packages/office-ui-fabric-react-tslint/package.json
+++ b/packages/office-ui-fabric-react-tslint/package.json
@@ -8,6 +8,6 @@
     "build": "node -v"
   },
   "devDependencies": {
-    "@microsoft/gulp-core-build-typescript": "^2.4.4"
+    "@microsoft/gulp-core-build-typescript": "^3.3.1"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-tslint/tslint.json b/packages/office-ui-fabric-react-tslint/tslint.json
index 8e45fd95963bc..c3f39049d2d72 100644
--- a/packages/office-ui-fabric-react-tslint/tslint.json
+++ b/packages/office-ui-fabric-react-tslint/tslint.json
@@ -3,10 +3,17 @@
     "@microsoft/gulp-core-build-typescript/lib/defaultTslint.json"
   ],
   "rules": {
+    "no-duplicate-variable": true,
+    "use-isnan": true,
+    "triple-equals": [
+      true
+    ],
     "max-line-length": [
       true,
       140
     ],
+    "no-arg": true,
+    "radix": true,
     "typedef": [
       true,
       "call-signature",
@@ -15,8 +22,8 @@
       "property-declaration",
       "member-variable-declaration"
     ],
-    "no-unused-imports": [
-      true
+    "no-unused-expression": [
+      false
     ],
     "prefer-const": false,
     "quotemark": [
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index d9c00a6572327..c0888d20c708e 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -16,20 +16,20 @@
     "test": "gulp"
   },
   "devDependencies": {
-    "@microsoft/load-themed-styles": "^1.2.2",
-    "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
+    "@microsoft/load-themed-styles": "^1.5.1",
+    "@microsoft/web-library-build": "^3.2.1",
     "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.0",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "2.2.39",
     "@types/prop-types": "15.5.1",
-    "@types/react": "15.0.29",
+    "@types/react": "15.0.38",
     "@types/react-addons-test-utils": "0.14.18",
-    "@types/react-dom": "15.5.0",
+    "@types/react-dom": "15.5.1",
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": "4.1.1",
+    "@uifabric/example-app-base": ">=4.1.1 <5.0.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -61,16 +61,16 @@
     "source-map-loader": "0.2.1",
     "style-loader": "^0.17.0",
     "ts-loader": "^2.0.1",
-    "typescript": "2.2.2",
+    "typescript": "2.4.2",
     "vinyl-ftp": "0.6.0",
-    "webpack": "^2.4.1",
+    "webpack": "^3.4.1",
     "webpack-bundle-analyzer": "^2.2.1",
     "webpack-dev-server": "^2.4.1",
     "webpack-notifier": "^1.5.0",
     "webpack-split-by-path": "2.0.0"
   },
   "dependencies": {
-    "@microsoft/load-themed-styles": "^1.2.2",
+    "@microsoft/load-themed-styles": "^1.5.1",
     "@uifabric/utilities": ">=4.8.0 <5.0.0",
     "@uifabric/styling": ">=0.15.4 <1.0.0",
     "prop-types": "^15.5.10",
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.Props.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.Props.ts
index 32f17fd885008..c8fe8346b93d7 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.Props.ts
@@ -4,7 +4,7 @@ import { IRenderFunction } from '../../Utilities';
 import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
 
 // Please keep alphabetized
-export interface IActivityItemProps extends React.HTMLAttributes<HTMLElement> {
+export interface IActivityItemProps extends React.AllHTMLAttributes<HTMLElement> {
   /**
    * Text describing the activity that occurred and naming the people involved in it.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
index e8bdae94417db..ff757518b972c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
@@ -14,7 +14,7 @@ export interface IButton {
   focus: () => void;
 }
 
-export interface IButtonProps extends React.HTMLAttributes<HTMLButtonElement | HTMLAnchorElement | BaseButton | Button> {
+export interface IButtonProps extends React.AllHTMLAttributes<HTMLAnchorElement | HTMLButtonElement | BaseButton | Button> {
   /**
    * Optional callback to access the IButton interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
@@ -144,7 +144,7 @@ export interface IButtonProps extends React.HTMLAttributes<HTMLButtonElement | H
    * they will be mixed into the button/anchor element rendered by the component.
    * @deprecated
    */
-  rootProps?: React.HTMLAttributes<HTMLButtonElement> | React.HTMLAttributes<HTMLAnchorElement>;
+  rootProps?: React.ButtonHTMLAttributes<HTMLButtonElement> | React.AnchorHTMLAttributes<HTMLAnchorElement>;
 
   /**
    * Deprecated on 4/15/2017, use iconProps={ { iconName: 'Emoji2' } }.
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
index a14470c3a5efa..cb2a12b398267 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
@@ -49,8 +49,9 @@ describe('DefaultButton', () => {
   });
 
   it('applies the correct aria attributes', () => {
-    let button;
+    let button: any;
     let renderedDOM: any;
+
     button = ReactTestUtils.renderIntoDocument<any>(
       <DefaultButton
         href='http://www.microsoft.com'
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
index 76072ba210c59..7079d62dd5059 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
@@ -69,7 +69,7 @@ export class ButtonSwapExample extends React.Component<IButtonProps, IButtonSwap
   }
 
   @autobind
-  private _setButtonRef(ref: React.ReactInstance): void {
+  private _setButtonRef(ref: any): void {
     this.buttonRef = ReactDOM.findDOMNode(ref) as HTMLElement;
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
index 097bffdf9a506..0923c544f9d20 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
@@ -84,10 +84,10 @@ export class CalendarButtonExample extends React.Component<any, ICalendarButtonE
   public render() {
     return (
       <div>
-        <div ref={ (calendarBtn) => this._calendarButtonElement = calendarBtn }>
+        <div ref={ (calendarBtn) => this._calendarButtonElement = calendarBtn! }>
           <DefaultButton
             onClick={ this._onClick }
-            text={ this.state.selectedDate == null ? 'Click for Calendar' : this.state.selectedDate.toLocaleDateString() }
+            text={ !this.state.selectedDate ? 'Click for Calendar' : this.state.selectedDate.toLocaleDateString() }
           />
         </div>
         { this.state.showCalendar && (
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Basic.Example.tsx
index 09dad67117b84..8a5be8247ec16 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Basic.Example.tsx
@@ -27,7 +27,7 @@ export class CalloutBasicExample extends React.Component<any, ICalloutBaiscExamp
 
     return (
       <div className='ms-CalloutExample'>
-        <div className='ms-CalloutBasicExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton }>
+        <div className='ms-CalloutBasicExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton! }>
           <DefaultButton
             onClick={ this._onShowMenuClicked }
             text={ isCalloutVisible ? 'Hide callout' : 'Show callout' }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
index c6e7aca0cdd5e..6734b2a42624a 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
@@ -54,7 +54,7 @@ export class CalloutCoverExample extends React.Component<any, ICalloutCoverExamp
             options={ DIRECTION_OPTIONS }
             onChanged={ this._onDirectionalChanged } />
         </div>
-        <div className='ms-CalloutCoverExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton }>
+        <div className='ms-CalloutCoverExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton! }>
           <DefaultButton
             text={ isCalloutVisible ? 'Hide callout' : 'Show callout' }
             onClick={ this._onShowMenuClicked }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
index 347773a68c3fd..d558049eaf9c3 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
@@ -70,7 +70,7 @@ export class CalloutDirectionalExample extends React.Component<any, ICalloutDire
             options={ DIRECTION_OPTIONS }
             onChanged={ this._onDirectionalChanged } />
         </div>
-        <div className='ms-CalloutExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton }>
+        <div className='ms-CalloutExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton! }>
           <DefaultButton
             onClick={ this._onShowMenuClicked }
             text={ isCalloutVisible ? 'Hide callout' : 'Show callout' }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx
index 7e4b564584e1d..b240333f27b01 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx
@@ -28,7 +28,7 @@ export class CalloutNestedExample extends React.Component<any, ICalloutBaiscExam
 
     return (
       <div className='ms-CalloutExample'>
-        <div className='ms-CalloutBasicExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton }>
+        <div className='ms-CalloutBasicExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton! }>
           <DefaultButton
             onClick={ this._onDismiss }
             text={ isCalloutVisible ? 'Hide callout' : 'Show callout' }
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
index 0ff7fe49d2cca..866919fe50e75 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
@@ -15,7 +15,7 @@ export interface ICheckbox {
 /**
  * Checkbox properties.
  */
-export interface ICheckboxProps extends React.HTMLAttributes<HTMLElement | HTMLInputElement> {
+export interface ICheckboxProps extends React.ButtonHTMLAttributes<HTMLElement | HTMLInputElement> {
   /**
    * Optional callback to access the ICheckbox interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
@@ -60,7 +60,7 @@ export interface ICheckboxProps extends React.HTMLAttributes<HTMLElement | HTMLI
    * Note that if you provide, for example, "disabled" as well as "inputProps.disabled", the former will take
    * precedence over the later.
    */
-  inputProps?: React.HTMLAttributes<HTMLElement | HTMLInputElement>;
+  inputProps?: React.ButtonHTMLAttributes<HTMLElement | HTMLButtonElement>;
 
   /**
    * Allows you to set the checkbox to be at the before (start) or after (end) the label.
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts
index 04793eedd07fb..32e54f19b4b4e 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts
@@ -6,7 +6,7 @@ export interface IChoiceGroup {
 
 }
 
-export interface IChoiceGroupProps extends React.HTMLAttributes<HTMLElement | HTMLInputElement> {
+export interface IChoiceGroupProps extends React.InputHTMLAttributes<HTMLElement | HTMLInputElement> {
   /**
    * Optional callback to access the IChoiceGroup interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
index 76a02e2fb26c4..fd1ebb7972074 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
@@ -100,7 +100,7 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
                 }
               >
                 <input
-                  ref={ (c): HTMLInputElement => this._inputElement = c }
+                  ref={ (c): HTMLInputElement => this._inputElement = c! }
                   id={ option.id }
                   className={ css('ms-ChoiceField-input', styles.input) }
                   type='radio'
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
index 9acc79e6c04d7..8764bf262fce9 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
@@ -87,7 +87,7 @@ export class ColorPicker extends BaseComponent<IColorPickerProps, IColorPickerSt
                   <TextField
                     className={ css('ms-ColorPicker-input', styles.input) }
                     value={ color.hex }
-                    ref={ (ref) => this.hexText = ref }
+                    ref={ (ref) => this.hexText = ref! }
                     onBlur={ this._onHexChanged }
                   />
                 </td>
@@ -96,7 +96,7 @@ export class ColorPicker extends BaseComponent<IColorPickerProps, IColorPickerSt
                     className={ css('ms-ColorPicker-input', styles.input) }
                     onBlur={ this._onRGBAChanged }
                     value={ String(color.r) }
-                    ref={ (ref) => this.rText = ref }
+                    ref={ (ref) => this.rText = ref! }
                   />
                 </td>
                 <td style={ { width: '18%' } }>
@@ -104,7 +104,7 @@ export class ColorPicker extends BaseComponent<IColorPickerProps, IColorPickerSt
                     className={ css('ms-ColorPicker-input', styles.input) }
                     onBlur={ this._onRGBAChanged }
                     value={ String(color.g) }
-                    ref={ (ref) => this.gText = ref }
+                    ref={ (ref) => this.gText = ref! }
                   />
                 </td>
                 <td style={ { width: '18%' } }>
@@ -112,7 +112,7 @@ export class ColorPicker extends BaseComponent<IColorPickerProps, IColorPickerSt
                     className={ css('ms-ColorPicker-input', styles.input) }
                     onBlur={ this._onRGBAChanged }
                     value={ String(color.b) }
-                    ref={ (ref) => this.bText = ref }
+                    ref={ (ref) => this.bText = ref! }
                   />
                 </td>
                 { !this.props.alphaSliderHidden && (
@@ -121,7 +121,7 @@ export class ColorPicker extends BaseComponent<IColorPickerProps, IColorPickerSt
                       className={ css('ms-ColorPicker-input', styles.input) }
                       onBlur={ this._onRGBAChanged }
                       value={ String(color.a) }
-                      ref={ (ref) => this.aText = ref }
+                      ref={ (ref) => this.aText = ref! }
                     />
                   </td>
                 ) }
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
index 6525a2180f0ab..f1941d5fd47dd 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
@@ -66,9 +66,12 @@ export class ColorSlider extends BaseComponent<IColorSliderProps, IColorSliderSt
     return (
       <div
         ref='root'
-        className={ css('ms-ColorPicker-slider', styles.slider, className, {
-          'is-adjusting': isAdjusting
-        }) }
+        className={ css(
+          'ms-ColorPicker-slider',
+          styles.slider,
+          className,
+          isAdjusting && 'is-adjusting'
+        ) }
         onMouseDown={ this._onMouseDown }>
         <div className={ css('ms-ColorPicker-sliderOverlay', styles.sliderOverlay) } style={ overlayStyle } />
         <div className={ css('ms-ColorPicker-thumb is-slider', styles.thumb, styles.thumbIsSlider) } style={ { left: currentPercentage + '%' } } />
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
index 837c4abdf7b44..76c7101c618e0 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
 import * as ReactTestUtils from 'react-addons-test-utils';
-import { mount } from 'enzyme';
+import { mount, ReactWrapper } from 'enzyme';
 import { KeyCodes } from '../../Utilities';
 let { expect } = chai;
 
@@ -56,7 +56,7 @@ describe('ComboBox', () => {
         options={ DEFAULT_OPTIONS }
       />);
     let comboBoxRoot = wrapper.find('.ms-ComboBox');
-    let inputElement = comboBoxRoot.find('[role="combobox"]');
+    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = comboBoxRoot.find('[role="combobox"]');
 
     expect(inputElement.text()).equals('');
   });
@@ -69,7 +69,7 @@ describe('ComboBox', () => {
         options={ DEFAULT_OPTIONS }
       />);
     let comboBoxRoot = wrapper.find('.ms-ComboBox');
-    let inputElement = comboBoxRoot.find('input');
+    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = comboBoxRoot.find('input');
 
     expect(inputElement.props().value).equals('1');
   });
@@ -82,7 +82,7 @@ describe('ComboBox', () => {
         options={ DEFAULT_OPTIONS }
       />);
     let comboBoxRoot = wrapper.find('.ms-ComboBox');
-    let inputElement = comboBoxRoot.find('input');
+    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = comboBoxRoot.find('input');
 
     expect(inputElement.props().value).equals('1');
   });
@@ -95,7 +95,7 @@ describe('ComboBox', () => {
         options={ DEFAULT_OPTIONS }
       />);
     let comboBoxRoot = wrapper.find('.ms-ComboBox');
-    let inputElement = comboBoxRoot.find('input');
+    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = comboBoxRoot.find('input');
 
     expect(inputElement.props().value).equals('1');
   });
@@ -108,7 +108,7 @@ describe('ComboBox', () => {
         value='1'
       />);
     let comboBoxRoot = wrapper.find('.ms-ComboBox');
-    let inputElement = comboBoxRoot.find('input');
+    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = comboBoxRoot.find('input');
 
     expect(inputElement.props().value).equals('1');
   });
@@ -124,15 +124,18 @@ describe('ComboBox', () => {
     comboBoxRoot = wrapper.find('.ms-ComboBox');
     let buttonElement = comboBoxRoot.find('button');
     buttonElement.simulate('click');
-    let secondItemElement = wrapper.getDOMNode().ownerDocument.querySelector('.ms-ComboBox-option[data-index="1"]');
+    let secondItemElement: Element = wrapper.getDOMNode().ownerDocument.querySelector('.ms-ComboBox-option[data-index="1"]')!;
+
+    ReactTestUtils.Simulate.click(secondItemElement);
     ReactTestUtils.Simulate.click(secondItemElement!);
-    let inputElement = comboBoxRoot.find('input');
+
+    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = comboBoxRoot.find('input');
     expect(inputElement.props().value).equals('2');
   });
 
   it('Can insert text in uncontrolled case with autoComplete and allowFreeform on', () => {
     let comboBoxRoot;
-    let inputElement;
+    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any>;
     let wrapper = mount(
       <ComboBox
         label='testgroup'
@@ -150,7 +153,7 @@ describe('ComboBox', () => {
 
   it('Can insert text in uncontrolled case with autoComplete on and allowFreeform off', () => {
     let comboBoxRoot;
-    let inputElement;
+    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any>;
     let wrapper = mount(
       <ComboBox
         label='testgroup'
@@ -168,7 +171,7 @@ describe('ComboBox', () => {
 
   it('Can insert text in uncontrolled case with autoComplete off and allowFreeform on', () => {
     let comboBoxRoot;
-    let inputElement;
+    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any>;
     let wrapper = mount(
       <ComboBox
         label='testgroup'
@@ -186,7 +189,7 @@ describe('ComboBox', () => {
 
   it('Can insert text in uncontrolled case with autoComplete and allowFreeform off', () => {
     let comboBoxRoot;
-    let inputElement;
+    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any>;
     let wrapper = mount(
       <ComboBox
         label='testgroup'
@@ -204,7 +207,7 @@ describe('ComboBox', () => {
 
   it('Can change selected option with keyboard', () => {
     let comboBoxRoot;
-    let inputElement;
+    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any>;
     let wrapper = mount(
       <ComboBox
         label='testgroup'
@@ -220,7 +223,7 @@ describe('ComboBox', () => {
 
   it('Cannot insert text while disabled', () => {
     let comboBoxRoot;
-    let inputElement;
+    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any>;
     let wrapper = mount(
       <ComboBox
         label='testgroup'
@@ -237,7 +240,7 @@ describe('ComboBox', () => {
 
   it('Cannot change selected option with keyboard while disabled', () => {
     let comboBoxRoot;
-    let inputElement;
+    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any>;
     let wrapper = mount(
       <ComboBox
         label='testgroup'
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index a5769034724c8..1cd04d6922c1a 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -520,7 +520,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         updatedValue = updatedValue.toLocaleLowerCase();
 
         // If autoComplete is on, attempt to find a match where the text of an option starts with the updated value
-        let items = currentOptions.map((item, index) => { return { ...item, index }; }).filter((option) => option.itemType !== SelectableOptionMenuItemType.Header && option.itemType !== SelectableOptionMenuItemType.Divider).filter((option) => option.text.toLocaleLowerCase().indexOf(updatedValue) === 0);
+        let items = currentOptions.map((item, i) => { return { ...item, index: i }; }).filter((option) => option.itemType !== SelectableOptionMenuItemType.Header && option.itemType !== SelectableOptionMenuItemType.Divider).filter((option) => option.text.toLocaleLowerCase().indexOf(updatedValue) === 0);
 
         // If we found a match, udpdate the state
         if (items.length > 0) {
@@ -924,7 +924,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * @returns {number} - the index of the selected option, -1 if not found
    */
   private _getSelectedIndex(options: IComboBoxOption[], selectedKey: string | number): number {
-    return findIndex(options, (option => (option.isSelected || option.selected || (selectedKey != null) && option.key === selectedKey)));
+    return findIndex(options, (option => (option.isSelected || option.selected || (selectedKey !== null) && option.key === selectedKey)));
   }
 
   /**
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
index c96061813cbf9..784f7cda9cd7e 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
@@ -72,7 +72,7 @@ export class CommandBarCustomizationExample extends React.Component<{}, ISplitDr
         <div className={ css(
           styles.customButtonContainer,
           darkerBG
-        ) } ref={ ref => this.container = ref }>
+        ) } ref={ ref => this.container = ref! }>
           <CommandButton
             className={ mainBtnClassName }
             iconProps={ { iconName: 'Add' } }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 1202fc9eda4aa..8cb65a6136445 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -124,7 +124,6 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   private _previousActiveElement: HTMLElement | null;
   private _isFocusingPreviousElement: boolean;
   private _enterTimerId: number;
-  private _focusZone: FocusZone;
   private _targetWindow: Window;
   private _target: HTMLElement | MouseEvent | null;
 
@@ -252,7 +251,6 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
               <FocusZone
                 className={ css('ms-ContextualMenu is-open', styles.root) }
                 direction={ arrowDirection }
-                ref={ (focusZone) => this._focusZone = focusZone }
                 isCircularNavigation={ true }
               >
                 <ul
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 576948f59346c..a7b11b6cb578f 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -179,7 +179,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
 
     return (
       <div className={ css('ms-DatePicker', styles.root, className) } ref='root'>
-        <div ref={ (c): HTMLElement => this._datepicker = c }>
+        <div ref={ (c): HTMLElement => this._datepicker = c! }>
           <TextField
             className={ styles.textField }
             ariaLabel={ ariaLabel }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index 156778020d7ca..d14aaca05d81b 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -137,11 +137,13 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
       <FocusZone
         role='row'
         aria-label={ ariaLabel }
-        className={ css('ms-DetailsHeader', styles.root, {
-          ['is-allSelected ' + styles.rootIsAllSelected]: isAllSelected,
-          ['is-selectAllHidden ' + styles.rootIsSelectAllHidden]: selectAllVisibility === SelectAllVisibility.hidden,
-          'is-resizingColumn': !!columnResizeDetails && isSizing,
-        }) }
+        className={ css(
+          'ms-DetailsHeader',
+          styles.root,
+          isAllSelected && ('is-allSelected ' + styles.rootIsAllSelected),
+          (selectAllVisibility === SelectAllVisibility.hidden) && ('is-selectAllHidden ' + styles.rootIsSelectAllHidden),
+          (!!columnResizeDetails && isSizing) && 'is-resizingColumn'
+        ) }
         ref='root'
         onMouseMove={ this._onRootMouseMove }
         data-automationid='DetailsHeader'
@@ -149,12 +151,17 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
       >
         { showCheckbox ? (
           <div
-            className={ css('ms-DetailsHeader-cell', 'ms-DetailsHeader-cellIsCheck', styles.cell, styles.cellIsCheck, checkStyles.owner, {
-              [checkStyles.isSelected]: isAllSelected
-            }) }
+            className={ css(
+              'ms-DetailsHeader-cell',
+              'ms-DetailsHeader-cellIsCheck',
+              styles.cell,
+              styles.cellIsCheck,
+              checkStyles.owner,
+              isAllSelected && checkStyles.isSelected
+            ) }
             onClick={ this._onSelectAllClicked }
             aria-colindex={ 0 }
-            role='columnheader'>
+            role='columnheader' >
             <span
               aria-label={ ariaLabelForSelectionColumn }
             ></span>
@@ -174,117 +181,124 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
                 )
               }, this._onRenderColumnHeaderTooltip)
             }
-          </div>
-        ) : null }
-        { groupNestingDepth! > 0 && this.props.collapseAllVisibility === CollapseAllVisibility.visible ? (
-          <div
-            className={ css('ms-DetailsHeader-cell', styles.cell) }
-            onClick={ this._onToggleCollapseAll }
-          >
-            <Icon
-              className={ css(
-                'ms-DetailsHeader-collapseButton',
-                styles.collapseButton,
-                isAllCollapsed && ('is-collapsed ' + styles.collapseButtonIsCollapsed)
-              ) }
-              iconName='ChevronDown'
-            />
-          </div>
-        ) : (null) }
-        { GroupSpacer({ count: groupNestingDepth! - 1 }) }
-        { columns.map((column: IColumn, columnIndex: number) => {
-          const previousColumnIndex = columnIndex - 1;
-          const previousColumn = columns[previousColumnIndex];
-
-          return (
-            [
-              <div
-                key={ column.key }
-                role='columnheader'
-                aria-sort={ column.isSorted ? (column.isSortedDescending ? 'descending' : 'ascending') : 'none' }
-                aria-disabled={ column.columnActionsMode === ColumnActionsMode.disabled }
-                aria-colindex={ (showCheckbox ? 1 : 0) + columnIndex }
+          </div >
+        ) : null
+        }
+        {
+          groupNestingDepth! > 0 && this.props.collapseAllVisibility === CollapseAllVisibility.visible ? (
+            <div
+              className={ css('ms-DetailsHeader-cell', styles.cell) }
+              onClick={ this._onToggleCollapseAll }
+            >
+              <Icon
                 className={ css(
-                  'ms-DetailsHeader-cell',
-                  styles.cell,
-                  column.headerClassName, {
-                    ['is-actionable ' + styles.cellIsActionable]: column.columnActionsMode !== ColumnActionsMode.disabled,
-                    ['is-empty ' + styles.cellIsEmpty]: !column.name,
-                    'is-icon-visible': column.isSorted || column.isGrouped || column.isFiltered,
-                    [styles.cellWrapperPadded]: column.isPadded
-                  }) }
-                style={ { width: column.calculatedWidth! + INNER_PADDING + (column.isPadded ? ISPADDED_WIDTH : 0) } }
-                aria-haspopup={ column.columnActionsMode === ColumnActionsMode.hasDropdown }
-                data-automationid='ColumnsHeaderColumn'
-                data-item-key={ column.key }
-              >
-                {
-                  onRenderColumnHeaderTooltip({
-                    hostClassName: css(styles.cellTooltip),
-                    id: `${this._id}-${column.key}-tooltip`,
-                    setAriaDescribedBy: false,
-                    content: column.columnActionsMode !== ColumnActionsMode.disabled ? column.ariaLabel : '',
-                    children: (
-                      <span
-                        className={ css('ms-DetailsHeader-cellTitle', styles.cellTitle) }
-                        data-is-focusable={ column.columnActionsMode !== ColumnActionsMode.disabled }
-                        role={ column.columnActionsMode !== ColumnActionsMode.disabled ? 'button' : undefined }
-                        aria-describedby={ `${this._id}-${column.key}-tooltip` }
-                        onContextMenu={ this._onColumnContextMenu.bind(this, column) }
-                        onClick={ this._onColumnClick.bind(this, column) }
-                      >
+                  'ms-DetailsHeader-collapseButton',
+                  styles.collapseButton,
+                  isAllCollapsed && ('is-collapsed ' + styles.collapseButtonIsCollapsed)
+                ) }
+                iconName='ChevronDown'
+              />
+            </div>
+          ) : (null)
+        }
+        { GroupSpacer({ count: groupNestingDepth! - 1 }) }
+        {
+          columns.map((column: IColumn, columnIndex: number) => {
+            const previousColumnIndex = columnIndex - 1;
+            const previousColumn = columns[previousColumnIndex];
+
+            return (
+              [
+                <div
+                  key={ column.key }
+                  role='columnheader'
+                  aria-sort={ column.isSorted ? (column.isSortedDescending ? 'descending' : 'ascending') : 'none' }
+                  aria-disabled={ column.columnActionsMode === ColumnActionsMode.disabled }
+                  aria-colindex={ (showCheckbox ? 1 : 0) + columnIndex }
+                  className={ css(
+                    'ms-DetailsHeader-cell',
+                    styles.cell,
+                    column.headerClassName,
+                    (column.columnActionsMode !== ColumnActionsMode.disabled) && ('is-actionable ' + styles.cellIsActionable),
+                    !column.name && ('is-empty ' + styles.cellIsEmpty),
+                    (column.isSorted || column.isGrouped || column.isFiltered) && 'is-icon-visible',
+                    column.isPadded && styles.cellWrapperPadded
+                  ) }
+                  style={ { width: column.calculatedWidth! + INNER_PADDING + (column.isPadded ? ISPADDED_WIDTH : 0) } }
+                  aria-haspopup={ column.columnActionsMode === ColumnActionsMode.hasDropdown }
+                  data-automationid='ColumnsHeaderColumn'
+                  data-item-key={ column.key }
+                >
+                  {
+                    onRenderColumnHeaderTooltip({
+                      hostClassName: css(styles.cellTooltip),
+                      id: `${this._id}-${column.key}-tooltip`,
+                      setAriaDescribedBy: false,
+                      content: column.columnActionsMode !== ColumnActionsMode.disabled ? column.ariaLabel : '',
+                      children: (
                         <span
-                          aria-label={ column.isIconOnly ? column.name : undefined }
-                          className={ css('ms-DetailsHeader-cellName',
-                            styles.cellName, {
-                              [styles.iconOnlyHeader]: column.isIconOnly
-                            }) }
+                          className={ css('ms-DetailsHeader-cellTitle', styles.cellTitle) }
+                          data-is-focusable={ column.columnActionsMode !== ColumnActionsMode.disabled }
+                          role={ column.columnActionsMode !== ColumnActionsMode.disabled ? 'button' : undefined }
+                          aria-describedby={ `${this._id}-${column.key}-tooltip` }
+                          onContextMenu={ this._onColumnContextMenu.bind(this, column) }
+                          onClick={ this._onColumnClick.bind(this, column) }
                         >
-                          { (column.iconName || column.iconClassName) && (
-                            <Icon className={ css(styles.nearIcon, column.iconClassName) } iconName={ column.iconName } />
+                          <span
+                            aria-label={ column.isIconOnly ? column.name : undefined }
+                            className={ css('ms-DetailsHeader-cellName',
+                              styles.cellName, {
+                                [styles.iconOnlyHeader]: column.isIconOnly
+                              }) }
+                          >
+                            { (column.iconName || column.iconClassName) && (
+                              <Icon className={ css(styles.nearIcon, column.iconClassName) } iconName={ column.iconName } />
+                            ) }
+
+                            { !column.isIconOnly ? column.name : undefined }
+                          </span>
+
+                          { column.isFiltered && (
+                            <Icon className={ styles.nearIcon } iconName='Filter' />
                           ) }
 
-                          { !column.isIconOnly ? column.name : undefined }
+                          { column.isSorted && (
+                            <Icon className={ styles.nearIcon } iconName={ column.isSortedDescending ? 'SortDown' : 'SortUp' } />
+                          ) }
+
+                          { column.isGrouped && (
+                            <Icon className={ styles.nearIcon } iconName='GroupedDescending' />
+                          ) }
+
+                          { column.columnActionsMode === ColumnActionsMode.hasDropdown && !column.isIconOnly && (
+                            <Icon
+                              className={ css('ms-DetailsHeader-filterChevron', styles.filterChevron) }
+                              iconName='ChevronDown'
+                            />
+                          ) }
                         </span>
 
-                        { column.isFiltered && (
-                          <Icon className={ styles.nearIcon } iconName='Filter' />
-                        ) }
-
-                        { column.isSorted && (
-                          <Icon className={ styles.nearIcon } iconName={ column.isSortedDescending ? 'SortDown' : 'SortUp' } />
-                        ) }
-
-                        { column.isGrouped && (
-                          <Icon className={ styles.nearIcon } iconName='GroupedDescending' />
-                        ) }
-
-                        { column.columnActionsMode === ColumnActionsMode.hasDropdown && !column.isIconOnly && (
-                          <Icon
-                            className={ css('ms-DetailsHeader-filterChevron', styles.filterChevron) }
-                            iconName='ChevronDown'
-                          />
-                        ) }
-                      </span>
-
-                    )
-                  }, this._onRenderColumnHeaderTooltip)
-                }
-              </div>,
-              (column.isResizable) && this._renderColumnSizer(columnIndex)
-            ]
-          );
-        }) }
-        { isSizing && (
-          <Layer>
-            <div
-              className={ css(isSizing && styles.sizingOverlay) }
-              onMouseMove={ this._onSizerMouseMove }
-              onMouseUp={ this._onSizerMouseUp }
-            />
-          </Layer>
-        ) }
-      </FocusZone>
+                      )
+                    }, this._onRenderColumnHeaderTooltip)
+                  }
+                </div>,
+                (column.isResizable) && this._renderColumnSizer(columnIndex)
+              ]
+            );
+          })
+        }
+        {
+          isSizing && (
+            <Layer>
+              <div
+                className={ css(isSizing && styles.sizingOverlay) }
+                onMouseMove={ this._onSizerMouseMove }
+                onMouseUp={ this._onSizerMouseUp }
+              />
+            </Layer>
+          )
+        }
+      </FocusZone >
     );
   }
 
@@ -320,9 +334,9 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
 
   @autobind
   private _onRenderColumnHeaderTooltip(tooltipHostProps: ITooltipHostProps, defaultRender?: IRenderFunction<ITooltipHostProps>) {
-    return <span className={ tooltipHostProps.hostClassName }>{
+    return <span className={ tooltipHostProps.hostClassName }> {
       tooltipHostProps.children
-    }</span>;
+    }</span >;
   }
 
   /**
@@ -459,7 +473,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
       // use buttons property here since ev.button in some edge case is not upding well during the move.
       // but firefox doesn't support it, so we set the default value when it is not defined.
       buttons
-    } = ev;
+  } = ev;
     let { onColumnIsSizingChanged, onColumnResized, columns } = this.props;
     let { columnResizeDetails } = this.state;
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
index c93e492d66d6d..c1f306ba981e3 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
@@ -46,12 +46,12 @@ export class DetailsRowFields extends BaseComponent<IDetailsRowFieldsProps, IDet
             key={ columnIndex }
             role={ column.isRowHeader ? 'rowheader' : 'gridcell' }
             aria-colindex={ columnIndex + columnStartIndex }
-            className={ css('ms-DetailsRow-cell', styles.cell, column.className, {
-              'is-multiline': column.isMultiline,
-              [styles.isRowHeader]: column.isRowHeader,
-              [styles.isPadded]: column.isPadded,
-              [styles.isMultiline]: column.isMultiline
-            }) }
+            className={ css('ms-DetailsRow-cell', styles.cell, column.className,
+              column.isMultiline && 'is-multiline',
+              column.isRowHeader && styles.isRowHeader,
+              column.isPadded && styles.isPadded,
+              column.isMultiline && styles.isMultiline,
+            ) }
             style={ { width: column.calculatedWidth! + INNER_PADDING + (column.isPadded ? ISPADDED_WIDTH : 0) } }
             data-automationid='DetailsRowCell'
             data-automation-key={ column.key }>
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
index 3fb913e2a7463..52ad7a6f25ab6 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
@@ -52,10 +52,10 @@ let _items = [
 
 function groupBy(items: any[], fieldName: string) {
   let groups = items.reduce((currentGroups, currentItem, index) => {
-    let lastGroup = currentGroups[currentGroups.length - 1];
+    let lastCurrentGroup = currentGroups[currentGroups.length - 1];
     let fieldValue = currentItem[fieldName];
 
-    if (!lastGroup || lastGroup.value !== fieldValue) {
+    if (!lastCurrentGroup || lastCurrentGroup.value !== fieldValue) {
       currentGroups.push({
         key: 'group' + fieldValue + index,
         name: `By "${fieldValue}"`,
@@ -65,8 +65,8 @@ function groupBy(items: any[], fieldName: string) {
         count: 0
       });
     }
-    if (lastGroup) {
-      lastGroup.count = index - lastGroup.startIndex;
+    if (lastCurrentGroup) {
+      lastCurrentGroup.count = index - lastCurrentGroup.startIndex;
     }
     return currentGroups;
   }, []);
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.Props.ts b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.Props.ts
index 26d6bf2c3ffaf..1dd218b2cf367 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.Props.ts
@@ -60,7 +60,7 @@ export interface IFacepileProps extends React.Props<Facepile> {
   className?: string;
 }
 
-export interface IFacepilePersona extends React.HTMLAttributes<HTMLButtonElement | HTMLDivElement> {
+export interface IFacepilePersona extends React.ButtonHTMLAttributes<HTMLButtonElement | HTMLDivElement> {
   /**
    * Name of the person.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.Props.ts b/packages/office-ui-fabric-react/src/components/Image/Image.Props.ts
index cbfe6a4598cb0..50891a4d3fdc3 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.Props.ts
@@ -4,7 +4,7 @@ export interface IImage {
 
 }
 
-export interface IImageProps extends React.HTMLAttributes<HTMLImageElement> {
+export interface IImageProps extends React.ImgHTMLAttributes<HTMLImageElement> {
   /**
    * Optional callback to access the ICheckbox interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.Props.ts b/packages/office-ui-fabric-react/src/components/Label/Label.Props.ts
index ab2e569623fe9..1940f00bd93a7 100644
--- a/packages/office-ui-fabric-react/src/components/Label/Label.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Label/Label.Props.ts
@@ -6,7 +6,7 @@ export interface ILabel {
 
 }
 
-export interface ILabelProps extends React.HTMLAttributes<HTMLLabelElement> {
+export interface ILabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {
   /**
    * Optional callback to access the ILabel interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
@@ -18,4 +18,9 @@ export interface ILabelProps extends React.HTMLAttributes<HTMLLabelElement> {
    * @defaultvalue false
    */
   required?: boolean;
+
+  /**
+   * Renders the label as disabled.
+   */
+  disabled?: boolean;
 }
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.tsx b/packages/office-ui-fabric-react/src/components/Label/Label.tsx
index 2ef509078354b..49c232769d87f 100644
--- a/packages/office-ui-fabric-react/src/components/Label/Label.tsx
+++ b/packages/office-ui-fabric-react/src/components/Label/Label.tsx
@@ -11,12 +11,13 @@ export class Label extends BaseComponent<ILabelProps, any> {
     return (
       <label
         { ...getNativeProps(this.props, divProperties) }
-        className={ css(styles.root, 'ms-Label', className, {
-          'is-disabled': disabled,
-          'is-required': required,
-          [styles.isDisabled]: disabled,
-          [styles.isRequired]: required
-        }) }>
+        className={ css(
+          styles.root,
+          'ms-Label',
+          className,
+          disabled && ('is-disabled ' + styles.isDisabled),
+          required && ('is-required ' + styles.isRequired)
+        ) }>
         { children }
       </label>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.Props.ts b/packages/office-ui-fabric-react/src/components/Link/Link.Props.ts
index 5493d4f483568..d72ae7b73816b 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.Props.ts
@@ -8,7 +8,7 @@ export interface ILink {
   focus(): void;
 }
 
-export interface ILinkProps extends React.HTMLAttributes<HTMLAnchorElement | HTMLButtonElement | HTMLElement | Link> {
+export interface ILinkProps extends React.AllHTMLAttributes<HTMLAnchorElement | HTMLButtonElement | HTMLElement | Link> {
   /**
    * Optional callback to access the ILink interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
@@ -19,4 +19,5 @@ export interface ILinkProps extends React.HTMLAttributes<HTMLAnchorElement | HTM
    * Whether the link is disabled
    */
   disabled?: boolean;
+
 }
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.tsx b/packages/office-ui-fabric-react/src/components/Link/Link.tsx
index ade1c28b08e25..c065dd2f76396 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.tsx
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.tsx
@@ -28,11 +28,13 @@ export class Link extends BaseComponent<ILinkProps, any> implements ILink {
       href ? (
         <a
           { ...getNativeProps(this.props, anchorProperties) }
-          className={ css('ms-Link', styles.root, className, {
-            'is-disabled': disabled,
-            [styles.isDisabled]: disabled,
-            [styles.isEnabled]: !disabled
-          }) }
+          className={ css(
+            'ms-Link',
+            styles.root,
+            className,
+            disabled && ('is-disabled ' + styles.isDisabled),
+            !disabled && styles.isEnabled
+          ) }
           onClick={ this._onClick }
           ref={ this._resolveRef('_link') }
           target={ this.props.target }
@@ -42,10 +44,12 @@ export class Link extends BaseComponent<ILinkProps, any> implements ILink {
       ) : (
           <button
             { ...getNativeProps(this.props, buttonProperties) }
-            className={ css('ms-Link', styles.root, className, {
-              'is-disabled': disabled,
-              [styles.isDisabled]: disabled
-            }) }
+            className={ css(
+              'ms-Link',
+              styles.root,
+              className,
+              disabled && ('is-disabled ' + styles.isDisabled)
+            ) }
             onClick={ this._onClick }
             ref={ this._resolveRef('_link') }
           >
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
index 87b9a477cf58d..9ace8710fdb59 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 import { setRTL } from '../../Utilities';
 import { Persona } from './Persona';
 import { PersonaInitialsColor } from './Persona.Props';
-import { shallow } from 'enzyme';
+import { shallow, ShallowWrapper } from 'enzyme';
 import * as chai from 'chai';
 import * as stylesImport from './Persona.scss';
 const styles: any = stylesImport;
@@ -80,12 +80,16 @@ describe('Persona', () => {
   describe('image', () => {
     it('renders empty alt text by default', () => {
       const wrapper = shallow(<Persona primaryText='Kat Larrson' imageUrl={ testImage1x1 } />);
-      expect(wrapper.find('Image').props().alt).to.equal('');
+      const image: ShallowWrapper<React.ImgHTMLAttributes<any>, any> = wrapper.find('Image');
+
+      expect(image.props().alt).to.equal('');
     });
 
     it('renders its given alt text', () => {
       const wrapper = shallow(<Persona primaryText='Kat Larrson' imageUrl={ testImage1x1 } imageAlt='ALT TEXT' />);
-      expect(wrapper.find('Image').props().alt).to.equal('ALT TEXT');
+      const image: ShallowWrapper<React.ImgHTMLAttributes<any>, any> = wrapper.find('Image');
+
+      expect(image.props().alt).to.equal('ALT TEXT');
     });
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.Props.ts b/packages/office-ui-fabric-react/src/components/Rating/Rating.Props.ts
index 65839082209b4..3fdf909294fc3 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.Props.ts
@@ -7,7 +7,7 @@ export interface IRating {
 /**
  * Rating component props.
  */
-export interface IRatingProps extends React.HTMLAttributes<HTMLElement> {
+export interface IRatingProps extends React.AllHTMLAttributes<HTMLElement> {
   /**
    * Optional callback to access the IRating interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts
index 25bc80bffaa46..56ea4d445b71c 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts
@@ -8,7 +8,7 @@ export interface ISearchBox {
   focus(): void;
 }
 
-export interface ISearchBoxProps extends React.HTMLAttributes<HTMLInputElement> {
+export interface ISearchBoxProps extends React.InputHTMLAttributes<HTMLInputElement> {
   /**
    * Optional callback to access the ISearchBox interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
index e040794cf13d0..98a7183c4e38a 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
@@ -71,7 +71,7 @@ interface ISwatchColorPickerOptionProps {
   cellShape?: 'circle' | 'square';
 }
 
-class SwatchColorPickerOption extends React.Component<ISwatchColorPickerOptionProps, null> {
+class SwatchColorPickerOption extends React.Component<ISwatchColorPickerOptionProps, {}> {
 
   public static defaultProps = {
     cellShape: 'circle',
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx
index 35efadc686020..744cdcf63acff 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx
@@ -34,7 +34,7 @@ export class TeachingBubbleBasicExample extends React.Component<any, ITeachingBu
 
     return (
       <div className='ms-TeachingBubbleExample'>
-        <span className='ms-TeachingBubbleBasicExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton }>
+        <span className='ms-TeachingBubbleBasicExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton! }>
           <DefaultButton
             onClick={ this._onDismiss }
             text={ isTeachingBubbleVisible ? 'Hide TeachingBubble' : 'Show TeachingBubble' }
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Condensed.Example.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Condensed.Example.tsx
index be6920d61616f..78de6a44743b0 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Condensed.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Condensed.Example.tsx
@@ -26,7 +26,7 @@ export class TeachingBubbleCondensedExample extends React.Component<any, ITeachi
 
     return (
       <div className='ms-TeachingBubbleExample'>
-        <span className='ms-TeachingBubbleBasicExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton }>
+        <span className='ms-TeachingBubbleBasicExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton! }>
           <DefaultButton
             onClick={ this._onDismiss }
             text={ isTeachingBubbleVisible ? 'Hide TeachingBubble' : 'Show TeachingBubble' }
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Illustration.Example.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Illustration.Example.tsx
index 0f1eb3779e413..2579de506edfa 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Illustration.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Illustration.Example.tsx
@@ -36,7 +36,7 @@ export class TeachingBubbleIllustrationExample extends React.Component<any, ITea
 
     return (
       <div className='ms-TeachingBubbleExample'>
-        <span className='ms-TeachingBubbleBasicExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton }>
+        <span className='ms-TeachingBubbleBasicExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton! }>
           <DefaultButton
             onClick={ this._onDismiss }
             text={ isTeachingBubbleVisible ? 'Hide TeachingBubble' : 'Show TeachingBubble' }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts b/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts
index c0bdcdc4a72c1..556a4fce64aea 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts
@@ -29,7 +29,7 @@ export interface ITextField {
 /**
  * TextField component props.
  */
-export interface ITextFieldProps extends React.HTMLAttributes<HTMLInputElement | HTMLTextAreaElement> {
+export interface ITextFieldProps extends React.AllHTMLAttributes<HTMLInputElement | HTMLTextAreaElement> {
   /**
    * Optional callback to access the ITextField interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
index bd74a655aff48..4815399c51dd6 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
@@ -359,7 +359,7 @@ describe('TextField', () => {
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <TextField
-        ref={ (t) => textField = t }
+        ref={ (t) => textField = t! }
         defaultValue={ initialValue }
         onSelect={ onSelect }
       />
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index f92b13f159821..71fc2b762ab07 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -15,7 +15,7 @@ import * as stylesImport from './TextField.scss';
 const styles: any = stylesImport;
 import { AnimationClassNames } from '../../Styling';
 export interface ITextFieldState {
-  value?: string;
+  value?: string | undefined;
 
   /** Is true when the control has focus. */
   isFocused?: boolean;
@@ -49,10 +49,10 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
 
   private _id: string;
   private _descriptionId: string;
-  private _delayedValidate: (value: string) => void;
+  private _delayedValidate: (value: string | undefined) => void;
   private _isMounted: boolean;
   private _lastValidation: number;
-  private _latestValue: string;
+  private _latestValue: string | undefined;
   private _latestValidateValue: string | undefined;
   private _isDescriptionAvailable: boolean;
   private _textElement: HTMLTextAreaElement;
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
index 7b85516e0552e..babc4ade521b5 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
@@ -110,7 +110,7 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
             { ...toggleNativeProps }
             type='button'
             className={ classNames.pill }
-            ref={ (c): HTMLButtonElement => this._toggleButton = c }
+            ref={ (c): HTMLButtonElement => this._toggleButton = c! }
             aria-disabled={ disabled }
             aria-pressed={ isChecked }
             aria-label={ ariaLabel }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts
index 6d40f12abfd77..132909e814204 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts
@@ -40,7 +40,8 @@ export interface IBaseAutoFill {
   clear(): void;
 }
 
-export interface IBaseAutoFillProps extends React.HTMLAttributes<HTMLInputElement | BaseAutoFill> {
+export interface IBaseAutoFillProps extends
+  React.InputHTMLAttributes<HTMLInputElement | BaseAutoFill> {
   /**
    * Gets the compoonent ref.
    */
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.test.tsx b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.test.tsx
index f86b01f6551b4..58081b001ee28 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.test.tsx
@@ -17,7 +17,7 @@ describe('BaseAutoFill', () => {
 
     let component = ReactDOM.render(
       <BaseAutoFill
-        ref={ (c) => autoFill = c }
+        ref={ (c) => autoFill = c! }
         suggestedDisplayValue='hello' />,
       baseNode
     );
@@ -27,7 +27,7 @@ describe('BaseAutoFill', () => {
   it('correctly autofills', (done) => {
     ReactDOM.render(
       <BaseAutoFill
-        ref={ (c) => autoFill = c }
+        ref={ (c) => autoFill = c! }
         onInputValueChange={
           (text) => {
             assert(text === 'hel', 'text was ' + text);
@@ -42,7 +42,7 @@ describe('BaseAutoFill', () => {
     ReactTestUtils.Simulate.change(autoFillInput);
     ReactDOM.render(
       <BaseAutoFill
-        ref={ (c) => autoFill = c }
+        ref={ (c) => autoFill = c! }
         onInputValueChange={
           (text) => {
             assert(text === 'hel', 'text was ' + text);
@@ -60,7 +60,7 @@ describe('BaseAutoFill', () => {
     ReactTestUtils.Simulate.change(autoFillInput);
     ReactDOM.render(
       <BaseAutoFill
-        ref={ (c) => autoFill = c }
+        ref={ (c) => autoFill = c! }
         onInputValueChange={
           (text) => {
             assert(autoFill.value === 'hep', 'text was ' + autoFill.value);
@@ -81,7 +81,7 @@ describe('BaseAutoFill', () => {
 
     ReactDOM.render(
       <BaseAutoFill
-        ref={ (c) => autoFill = c }
+        ref={ (c) => autoFill = c! }
         suggestedDisplayValue='hello' />,
       baseNode
     );
@@ -104,7 +104,7 @@ describe('BaseAutoFill', () => {
 
     ReactDOM.render(
       <BaseAutoFill
-        ref={ (c) => autoFill = c }
+        ref={ (c) => autoFill = c! }
         suggestedDisplayValue='hello' />,
       baseNode
     );
@@ -122,7 +122,7 @@ describe('BaseAutoFill', () => {
 
     ReactDOM.render(
       <BaseAutoFill
-        ref={ (c) => autoFill = c }
+        ref={ (c) => autoFill = c! }
         suggestedDisplayValue='hello' />,
       baseNode
     );
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
index dd11728e7f0e3..7bf35288c63ab 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
@@ -55,7 +55,7 @@ export interface IBasePickerProps<T> extends React.Props<any> {
    * AutoFill input native props
    * @default undefined
    */
-  inputProps?: React.HTMLAttributes<HTMLInputElement>;
+  inputProps?: React.InputHTMLAttributes<HTMLInputElement>;
   /**
    * A callback for when a persona is removed from the suggestion list
    */
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index 4946ac6e440a0..c8597db6d009e 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -18,7 +18,7 @@ import {
   ValidationState
 } from 'office-ui-fabric-react/lib/Pickers';
 import { IPersonaWithMenu } from 'office-ui-fabric-react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.Props';
-import { people, mostRecentlyUsed } from './PeoplePickerExampleData';
+import { people, mru } from './PeoplePickerExampleData';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Promise } from 'es6-promise';
 import './PeoplePicker.Types.Example.scss';
@@ -63,7 +63,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
       currentPicker: 1,
       delayResults: false,
       peopleList: peopleList,
-      mostRecentlyUsed: mostRecentlyUsed,
+      mostRecentlyUsed: mru,
       currentSelectedItems: []
     };
   }
@@ -267,9 +267,9 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
 
   @autobind
   private _onRemoveSuggestion(item: IPersonaProps): void {
-    let { peopleList, mostRecentlyUsed } = this.state;
+    let { peopleList, mostRecentlyUsed: mruState } = this.state;
     let indexPeopleList: number = peopleList.indexOf(item);
-    let indexMostRecentlyUsed: number = mostRecentlyUsed.indexOf(item);
+    let indexMostRecentlyUsed: number = mruState.indexOf(item);
 
     if (indexPeopleList >= 0) {
       let newPeople: IPersonaProps[] = peopleList.slice(0, indexPeopleList).concat(peopleList.slice(indexPeopleList + 1));
@@ -277,7 +277,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     }
 
     if (indexMostRecentlyUsed >= 0) {
-      let newSuggestedPeople: IPersonaProps[] = mostRecentlyUsed.slice(0, indexMostRecentlyUsed).concat(mostRecentlyUsed.slice(indexMostRecentlyUsed + 1));
+      let newSuggestedPeople: IPersonaProps[] = mruState.slice(0, indexMostRecentlyUsed).concat(mruState.slice(indexMostRecentlyUsed + 1));
       this.setState({ mostRecentlyUsed: newSuggestedPeople });
     }
   }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePickerExampleData.ts b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePickerExampleData.ts
index 1902d08d53848..7c504b04049c0 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePickerExampleData.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePickerExampleData.ts
@@ -405,4 +405,4 @@ export const people: (IPersonaProps & { key: string | number })[] = [
   }
 ];
 
-export const mostRecentlyUsed: IPersonaProps[] = people.slice(0, 5);
\ No newline at end of file
+export const mru: IPersonaProps[] = people.slice(0, 5);
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PickerItem.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/PickerItem.Props.ts
index 3a820116763d5..2bb1050ceed7f 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PickerItem.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/PickerItem.Props.ts
@@ -1,5 +1,5 @@
 import * as React from 'react';
-export interface IPickerItemProps<T> extends React.HTMLAttributes<HTMLElement> {
+export interface IPickerItemProps<T> extends React.AllHTMLAttributes<HTMLElement> {
   componentRef?: () => void;
   item: T;
   index: number;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx
index 6df597b1f33ea..38c19c840c079 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx
@@ -1,7 +1,7 @@
 /* tslint:disable */
 import * as React from 'react';
 /* tslint:enable */
-import { css } from '../../../Utilities';
+import { css, IDictionary } from '../../../Utilities';
 import { Icon } from '../../../Icon';
 import { IPickerItemProps } from '../PickerItem.Props';
 import { ITag } from './TagPicker';
@@ -12,7 +12,7 @@ export const TagItem = (props: IPickerItemProps<ITag>) => (
   <div
     className={ css('ms-TagItem',
       styles.root,
-      { 'is-selected': props.selected },
+      { 'is-selected': props.selected } as IDictionary,
       props.selected && styles.isSelected) }
     key={ props.index }
     data-selection-index={ props.index }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
index 48b60be1f6418..b5169800fbc6e 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
@@ -317,6 +317,8 @@ export const SelectedDocumentItem: (documentProps: IPickerItemProps<IFullDocumen
   );
 };
 
+export class DocumentPicker extends BasePickerListBelow<IFullDocumentCardProps, IDocumentPickerProps> {
+}
 export class PickerCustomResultExample extends React.Component<any, IPeoplePickerExampleState> {
   constructor() {
     super();
@@ -366,6 +368,3 @@ export class PickerCustomResultExample extends React.Component<any, IPeoplePicke
     return items.filter(item => (item.documentTitleProps && item.documentTitleProps.title) === documentTitle).length > 0;
   }
 }
-
-export class DocumentPicker extends BasePickerListBelow<IFullDocumentCardProps, IDocumentPickerProps> {
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning.ts b/packages/office-ui-fabric-react/src/utilities/positioning.ts
index 22466d644b638..cc7c91df708f9 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning.ts
@@ -139,6 +139,7 @@ let MirrorDirectionalHintDictionary: { [key: number]: DirectionalHint } = {
   [DirectionalHint.rightCenter]: DirectionalHint.leftCenter,
   [DirectionalHint.rightBottomEdge]: DirectionalHint.leftBottomEdge,
 };
+
 // Currently the beakPercent is set to 50 for all positions meaning that it should tend to the center of the target
 let DirectionalDictionary: { [key: number]: PositionData } = {
   [DirectionalHint.topLeftEdge]: new PositionData(RectangleEdge.bottom, RectangleEdge.top, 0, 0, 50, false),
@@ -156,6 +157,7 @@ let DirectionalDictionary: { [key: number]: PositionData } = {
   [DirectionalHint.rightCenter]: new PositionData(RectangleEdge.left, RectangleEdge.right, 50, 50, 50, false),
   [DirectionalHint.rightBottomEdge]: new PositionData(RectangleEdge.left, RectangleEdge.right, 100, 100, 50, false)
 };
+
 let CoverDictionary: { [key: number]: PositionData } = {
   [DirectionalHint.topLeftEdge]: new PositionData(RectangleEdge.top, RectangleEdge.top, 0, 0, 50, false),
   [DirectionalHint.topCenter]: new PositionData(RectangleEdge.top, RectangleEdge.top, 50, 50, 50, false),
@@ -180,78 +182,6 @@ let OppositeEdgeDictionary: { [key: number]: number } = {
   [RectangleEdge.left]: RectangleEdge.right,
 };
 
-function getDirectionalHintForLayout(props: IPositionProps): DirectionalHint | undefined {
-  if (getRTL()) {
-    return props.directionalHintForRTL !== undefined ?
-      props.directionalHintForRTL :
-      MirrorDirectionalHintDictionary[props.directionalHint!];
-  } else {
-    return props.directionalHint;
-  }
-}
-
-export function getRelativePositions(
-  props: IPositionProps,
-  hostElement: HTMLElement,
-  calloutElement: HTMLElement): IPositionInfo {
-  let beakWidth: number = !props.isBeakVisible ? 0 : (props.beakWidth || 0);
-  let borderWidth: number = positioningFunctions._getBorderSize(calloutElement);
-  let gap: number = positioningFunctions._calculateActualBeakWidthInPixels(beakWidth) / 2 + (props.gapSpace ? props.gapSpace : 0);
-  let boundingRect: Rectangle = props.bounds ?
-    positioningFunctions._getRectangleFromIRect(props.bounds) :
-    new Rectangle(0, window.innerWidth - getScrollbarWidth(), 0, window.innerHeight);
-  let targetRect: Rectangle = props.target ? positioningFunctions._getTargetRect(boundingRect, props.target) : positioningFunctions._getTargetRectDEPRECATED(
-    boundingRect,
-    props.targetElement,
-    props.creationEvent,
-    props.targetPoint,
-    props.useTargetPoint);
-  let positionData: PositionData = positioningFunctions._getPositionData(
-    getDirectionalHintForLayout(props)!,
-    targetRect,
-    boundingRect,
-    props.coverTarget);
-  let positionedCallout: positioningFunctions.ICallout = positioningFunctions._positionCalloutWithinBounds(
-    positioningFunctions._getRectangleFromHTMLElement(calloutElement),
-    targetRect,
-    boundingRect,
-    positionData,
-    gap,
-    props.coverTarget,
-    props.directionalHintFixed);
-  let beakPositioned: Rectangle = positioningFunctions._positionBeak(beakWidth, positionedCallout, targetRect, borderWidth);
-  let finalizedCallout: Rectangle = positioningFunctions._finalizeCalloutPosition(positionedCallout.calloutRectangle, hostElement);
-
-  return {
-    calloutPosition: { top: finalizedCallout.top, left: finalizedCallout.left },
-    beakPosition: { top: beakPositioned.top, left: beakPositioned.left, display: 'block' },
-    directionalClassName: SLIDE_ANIMATIONS[positionedCallout.targetEdge],
-    submenuDirection: positionedCallout.calloutEdge === RectangleEdge.right ? DirectionalHint.leftBottomEdge : DirectionalHint.rightBottomEdge
-  };
-}
-/**
- * Get's the maximum height that a rectangle can have in order to fit below or above a target.
- * If the directional hint specifies a left or right edge (i.e. leftCenter) it will limit the height to the topBorder
- * of the target given.
- * If no bounds are provided then the window is treated as the bounds.
- */
-export function getMaxHeight(target: HTMLElement | MouseEvent, targetEdge: DirectionalHint, gapSpace: number = 0, bounds?: IRectangle) {
-  let mouseTarget: MouseEvent = target as MouseEvent;
-  let elementTarget: HTMLElement = target as HTMLElement;
-  let targetRect: Rectangle;
-  let boundingRectangle = bounds ?
-    positioningFunctions._getRectangleFromIRect(bounds) :
-    new Rectangle(0, window.innerWidth - getScrollbarWidth(), 0, window.innerHeight);
-
-  if (mouseTarget.stopPropagation) {
-    targetRect = new Rectangle(mouseTarget.clientX, mouseTarget.clientX, mouseTarget.clientY, mouseTarget.clientY);
-  } else {
-    targetRect = positioningFunctions._getRectangleFromHTMLElement(elementTarget);
-  }
-
-  return positioningFunctions._getMaxHeightFromTargetRectangle(targetRect, targetEdge, gapSpace, boundingRectangle);
-}
-
 export module positioningFunctions {
 
   export interface ICallout {
@@ -790,4 +720,77 @@ export module positioningFunctions {
 
     return callout;
   }
-}
\ No newline at end of file
+}
+
+function getDirectionalHintForLayout(props: IPositionProps): DirectionalHint | undefined {
+  if (getRTL()) {
+    return props.directionalHintForRTL !== undefined ?
+      props.directionalHintForRTL :
+      MirrorDirectionalHintDictionary[props.directionalHint!];
+  } else {
+    return props.directionalHint;
+  }
+}
+
+export function getRelativePositions(
+  props: IPositionProps,
+  hostElement: HTMLElement,
+  calloutElement: HTMLElement): IPositionInfo {
+  let beakWidth: number = !props.isBeakVisible ? 0 : (props.beakWidth || 0);
+  let borderWidth: number = positioningFunctions._getBorderSize(calloutElement);
+  let gap: number = positioningFunctions._calculateActualBeakWidthInPixels(beakWidth) / 2 + (props.gapSpace ? props.gapSpace : 0);
+  let boundingRect: Rectangle = props.bounds ?
+    positioningFunctions._getRectangleFromIRect(props.bounds) :
+    new Rectangle(0, window.innerWidth - getScrollbarWidth(), 0, window.innerHeight);
+  let targetRect: Rectangle = props.target ? positioningFunctions._getTargetRect(boundingRect, props.target) : positioningFunctions._getTargetRectDEPRECATED(
+    boundingRect,
+    props.targetElement,
+    props.creationEvent,
+    props.targetPoint,
+    props.useTargetPoint);
+  let positionData: PositionData = positioningFunctions._getPositionData(
+    getDirectionalHintForLayout(props)!,
+    targetRect,
+    boundingRect,
+    props.coverTarget);
+  let positionedCallout: positioningFunctions.ICallout = positioningFunctions._positionCalloutWithinBounds(
+    positioningFunctions._getRectangleFromHTMLElement(calloutElement),
+    targetRect,
+    boundingRect,
+    positionData,
+    gap,
+    props.coverTarget,
+    props.directionalHintFixed);
+  let beakPositioned: Rectangle = positioningFunctions._positionBeak(beakWidth, positionedCallout, targetRect, borderWidth);
+  let finalizedCallout: Rectangle = positioningFunctions._finalizeCalloutPosition(positionedCallout.calloutRectangle, hostElement);
+
+  return {
+    calloutPosition: { top: finalizedCallout.top, left: finalizedCallout.left },
+    beakPosition: { top: beakPositioned.top, left: beakPositioned.left, display: 'block' },
+    directionalClassName: SLIDE_ANIMATIONS[positionedCallout.targetEdge],
+    submenuDirection: positionedCallout.calloutEdge === RectangleEdge.right ? DirectionalHint.leftBottomEdge : DirectionalHint.rightBottomEdge
+  };
+}
+
+/**
+ * Get's the maximum height that a rectangle can have in order to fit below or above a target.
+ * If the directional hint specifies a left or right edge (i.e. leftCenter) it will limit the height to the topBorder
+ * of the target given.
+ * If no bounds are provided then the window is treated as the bounds.
+ */
+export function getMaxHeight(target: HTMLElement | MouseEvent, targetEdge: DirectionalHint, gapSpace: number = 0, bounds?: IRectangle) {
+  let mouseTarget: MouseEvent = target as MouseEvent;
+  let elementTarget: HTMLElement = target as HTMLElement;
+  let targetRect: Rectangle;
+  let boundingRectangle = bounds ?
+    positioningFunctions._getRectangleFromIRect(bounds) :
+    new Rectangle(0, window.innerWidth - getScrollbarWidth(), 0, window.innerHeight);
+
+  if (mouseTarget.stopPropagation) {
+    targetRect = new Rectangle(mouseTarget.clientX, mouseTarget.clientX, mouseTarget.clientY, mouseTarget.clientY);
+  } else {
+    targetRect = positioningFunctions._getRectangleFromHTMLElement(elementTarget);
+  }
+
+  return positioningFunctions._getMaxHeightFromTargetRectangle(targetRect, targetEdge, gapSpace, boundingRectangle);
+}
diff --git a/packages/office-ui-fabric-react/src/utilities/router/Router.tsx b/packages/office-ui-fabric-react/src/utilities/router/Router.tsx
index 8b8f683d7576a..033c17d0d74f1 100644
--- a/packages/office-ui-fabric-react/src/utilities/router/Router.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/router/Router.tsx
@@ -8,7 +8,7 @@ export interface IRouterProps {
   componentRef?: () => void;
 
   replaceState?: boolean;
-  children?: React.ReactElement<any>[];
+  children?: any;
   onNewRouteLoaded?: () => void;
 }
 
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx b/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
index 09086313a0b40..5e4025c47808d 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
@@ -30,6 +30,33 @@ export interface ISelectionItemExampleProps {
   selectionMode?: SelectionMode;
 }
 
+/**
+ * The SelectionItemExample controls and displays the selection state of a single item
+ */
+export class SelectionItemExample extends React.Component<ISelectionItemExampleProps, {}> {
+  public render() {
+    let { item, itemIndex, selection, selectionMode } = this.props;
+    let isSelected = false;
+
+    if (selection && itemIndex) {
+      selection.isIndexSelected(itemIndex);
+    }
+
+    return (
+      <div className='ms-SelectionItemExample' data-selection-index={ itemIndex }>
+        { (selectionMode !== SelectionMode.none) && (
+          <div className='ms-SelectionItemExample-check' data-selection-toggle={ true } >
+            <Check checked={ isSelected } />
+          </div>
+        ) }
+        <span className='ms-SelectionItemExample-name'>
+          { item.name }
+        </span>
+      </div>
+    );
+  }
+}
+
 /**
  * The SelectionBasicExample controls the selection state of all items
  */
@@ -183,30 +210,3 @@ export class SelectionBasicExample extends React.Component<any, ISelectionBasicE
     ];
   }
 }
-
-/**
- * The SelectionItemExample controls and displays the selection state of a single item
- */
-export class SelectionItemExample extends React.Component<ISelectionItemExampleProps, {}> {
-  public render() {
-    let { item, itemIndex, selection, selectionMode } = this.props;
-    let isSelected = false;
-
-    if (selection && itemIndex) {
-      selection.isIndexSelected(itemIndex);
-    }
-
-    return (
-      <div className='ms-SelectionItemExample' data-selection-index={ itemIndex }>
-        { (selectionMode !== SelectionMode.none) && (
-          <div className='ms-SelectionItemExample-check' data-selection-toggle={ true } >
-            <Check checked={ isSelected } />
-          </div>
-        ) }
-        <span className='ms-SelectionItemExample-name'>
-          { item.name }
-        </span>
-      </div>
-    );
-  }
-}
diff --git a/packages/styling/package.json b/packages/styling/package.json
index a9777536ecb1f..e8b8a047af9f4 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -10,17 +10,17 @@
     "build": "gulp"
   },
   "devDependencies": {
-    "@microsoft/sp-build-web": "~1.0.0",
-    "@microsoft/sp-module-interfaces": "~1.0.0",
-    "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
+    "@microsoft/sp-build-web": "^1.1.0",
+    "@microsoft/sp-module-interfaces": "^1.1.0",
+    "@microsoft/web-library-build": "^3.2.1",
     "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.0",
     "@types/mocha": "2.2.39",
-    "@types/react": "15.0.29",
+    "@types/react": "15.0.38",
     "@types/react-addons-test-utils": "0.14.18",
-    "@types/react-dom": "15.5.0",
+    "@types/react-dom": "15.5.1",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=1.3.12 <2.0.0",
+    "@uifabric/example-app-base": ">=4.1.1 <5.0.0",
     "chai": "^3.5.0",
     "enzyme": "^2.7.0",
     "es6-promise": "^4.1.0",
@@ -28,24 +28,23 @@
     "gulp": "~3.9.1",
     "mocha": "^3.2.0",
     "mocha-loader": "^1.1.1",
-    "office-ui-fabric-react": ">=2.11.0-0 <3.0.0-0",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
     "react-dom": "^15.4.2",
     "source-map-loader": "^0.2.1",
     "ts-loader": "^2.1.0",
-    "typescript": "2.2.2",
+    "typescript": "2.4.2",
     "uglifyjs-webpack-plugin": "^0.4.3",
-    "webpack": "^2.4.1",
+    "webpack": "^3.4.1",
     "webpack-bundle-analyzer": "^2.2.1",
     "webpack-dev-server": "^2.4.1",
     "webpack-notifier": "^1.5.0",
     "webpack-split-by-path": "2.0.0"
   },
   "dependencies": {
-    "@microsoft/load-themed-styles": "^1.2.2",
-    "@uifabric/utilities": ">=4.8.0 <5.0.0",
+    "@microsoft/load-themed-styles": "^1.5.1",
+    "@uifabric/utilities": ">=4.8.1 <5.0.0",
     "tslib": "^1.6.0",
     "rtl-css-js": "^1.1.1",
     "glamor": "^2.20.24"
diff --git a/packages/styling/src/examples/AnimationPage/AnimationPage.styles.ts b/packages/styling/src/examples/AnimationPage/AnimationPage.styles.ts
deleted file mode 100644
index fe21c21433112..0000000000000
--- a/packages/styling/src/examples/AnimationPage/AnimationPage.styles.ts
+++ /dev/null
@@ -1,34 +0,0 @@
-import {
-  IStyle,
-  ITheme,
-  getTheme,
-  mergeStyles
-} from '@uifabric/styling';
-
-export interface IAnimationPageStyles {
-  grid?: IStyle;
-  blue?: IStyle;
-  tile?: IStyle;
-}
-
-export function getStyles(theme: ITheme = getTheme()): IAnimationPageStyles {
-  return {
-    grid: mergeStyles({
-      display: 'flex',
-      flexWrap: 'wrap',
-      justifyContent: 'stretch',
-      margin: '-8px'
-    }),
-
-    blue: mergeStyles({
-      background: theme.palette.themeSecondary
-    }),
-
-    tile: mergeStyles({
-      flexGrow: 1,
-      minWidth: '200px',
-      maxWidth: '400px',
-      padding: '8px'
-    })
-  };
-}
diff --git a/packages/styling/src/examples/AnimationPage/AnimationPage.tsx b/packages/styling/src/examples/AnimationPage/AnimationPage.tsx
deleted file mode 100644
index 55a9678c60e13..0000000000000
--- a/packages/styling/src/examples/AnimationPage/AnimationPage.tsx
+++ /dev/null
@@ -1,56 +0,0 @@
-import * as React from 'react';
-import { BaseComponent } from '@uifabric/utilities';
-import { Page } from '../Page/Page';
-import { PageHeader } from '../PageHeader/PageHeader';
-import { AnimationTile } from '../AnimationTile/AnimationTile';
-import { AnimationClassNames } from '@uifabric/styling';
-import { IAnimationPageStyles, getStyles } from './AnimationPage.styles';
-
-export class AnimationPage extends BaseComponent<{}, {}> {
-
-  public render(): JSX.Element {
-    const styles: IAnimationPageStyles = getStyles();
-
-    return (
-      <Page>
-        <PageHeader text='Animations' />
-        <p>
-          Use the animation library to create web experiences that integrate with Office 365.
-          You can use the animation CSS classes for navigation, panels, dialogs, and more.
-          Animations include directionality (up, down, left, right relating to origin and
-          completion of tasks), enter/exit (fade in, fade out, zoom in, zoom out), and
-          duration (speed of enter/exit relating to urgency or content type).
-        </p>
-
-        <p>
-          When choosing a motion for side panels, consider the origin of the triggering
-          element. Use the motion to create a link between the action and the resulting UI.
-          For example, if the triggering element is on the right side of the interface,
-          consider having the panel move in from the right.
-        </p>
-
-        <p>
-          When choosing a motion for dialogs, consider the origin and tone of the content.
-          For a warning or error dialog, a quick fade in might be appropriate. If the dialog
-          appears when a user chooses an item to get more information, a scale-up might be
-          appropriate.
-        </p>
-
-        <PageHeader text='Implementation' />
-
-        <code>
-          TODO
-        </code>
-
-        <PageHeader text='Animations' />
-        <div className={ styles.grid as string }>
-          { Object.keys(AnimationClassNames).map((name: string) => (
-            <div className={ styles.tile as string } key={ name }>
-              <AnimationTile name={ name } />
-            </div>
-          )) }
-        </div>
-      </Page>
-    );
-  }
-}
diff --git a/packages/styling/src/examples/AnimationTile/AnimationTile.styles.ts b/packages/styling/src/examples/AnimationTile/AnimationTile.styles.ts
deleted file mode 100644
index eb09c5f655678..0000000000000
--- a/packages/styling/src/examples/AnimationTile/AnimationTile.styles.ts
+++ /dev/null
@@ -1,86 +0,0 @@
-import {
-  IStyle,
-  ITheme,
-  getTheme,
-  mergeStyles
-} from '@uifabric/styling';
-
-export interface IAnimationTileStyles {
-  root: IStyle;
-  title: IStyle;
-  container: IStyle;
-  animationBox: IStyle;
-  isLeft: IStyle;
-  isRight: IStyle;
-  isTop: IStyle;
-  isBottom: IStyle;
-  isIn: IStyle;
-}
-
-export function getStyles(theme: ITheme = getTheme()): IAnimationTileStyles {
-  return {
-
-    root: mergeStyles({
-      marginBottom: '20px'
-    }),
-
-    title: mergeStyles({
-      ...theme.fonts.medium,
-      marginBottom: '8px'
-    }),
-
-    container: mergeStyles({
-      overflow: 'hidden',
-      position: 'relative',
-      maxWidth: '400px',
-      height: '100px',
-      border: '1px solid black',
-      backgroundImage:
-      'url("data:image/svg+xml;base64,' + 'PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxMCcgaGVpZ2h0PScxMCc' +
-      '+CiAgPHJlY3Qgd2lkdGg9JzEwJyBoZWlnaHQ9JzEwJyBmaWxsPSd3aGl0ZScvPgogIDxwYXRoIGQ9J00tMSwx' +
-      'IGwyLC0yCiAgICAgICAgICAgTTAsMTAgbDEwLC0xMAogICAgICAgICAgIE05LDExIGwyLC0yJyBzdHJva2U9J' +
-      '2JsYWNrJyBzdHJva2Utd2lkdGg9JzEnLz4KPC9zdmc+Cg==")',
-      backgroundRepeat: 'repeat',
-    }),
-
-    animationBox: mergeStyles({
-      position: 'absolute',
-
-      background: theme.palette.themePrimary,
-      width: '25%',
-      height: '100%'
-    }),
-
-    isLeft: mergeStyles({
-      left: 0,
-      top: 0,
-      width: '25%',
-      height: '100%'
-    }),
-
-    isRight: mergeStyles({
-      right: 0,
-      top: 0,
-      width: '25%',
-      height: '100%'
-    }),
-
-    isTop: mergeStyles({
-      left: 0,
-      top: 0,
-      width: '100%',
-      height: '50%'
-    }),
-
-    isBottom: mergeStyles({
-      left: 0,
-      bottom: 0,
-      width: '100%',
-      height: '50%'
-    }),
-
-    isIn: mergeStyles({
-      opacity: 0
-    })
-  };
-}
\ No newline at end of file
diff --git a/packages/styling/src/examples/AnimationTile/AnimationTile.tsx b/packages/styling/src/examples/AnimationTile/AnimationTile.tsx
deleted file mode 100644
index fa69006d84fc7..0000000000000
--- a/packages/styling/src/examples/AnimationTile/AnimationTile.tsx
+++ /dev/null
@@ -1,74 +0,0 @@
-import * as React from 'react';
-import { BaseComponent } from '@uifabric/utilities';
-import {
-  AnimationClassNames,
-  IStyle,
-  mergeStyles
-} from '@uifabric/styling';
-import { IAnimationTileStyles, getStyles } from './AnimationTile.styles';
-
-export interface IAnimationTileProps {
-  componentRef?: () => void;
-  name: string;
-}
-
-export interface IAnimationTileState {
-  isAnimating: boolean;
-}
-
-export class AnimationTile extends BaseComponent<IAnimationTileProps, IAnimationTileState> {
-  constructor(props: IAnimationTileProps) {
-    super(props);
-
-    this.state = {
-      isAnimating: false
-    };
-  }
-
-  public render(): JSX.Element {
-    const styles: IAnimationTileStyles = getStyles();
-    const name: string = this.props.name;
-    const isIn: boolean = name.indexOf('In') >= 0;
-    const isInStyle: IStyle | null = isIn ? styles.isIn : null;
-    let positioningStyle: IStyle;
-
-    if (name.indexOf('Left') >= 0) {
-      positioningStyle = isIn ? styles.isRight : styles.isLeft;
-    } else if (name.indexOf('Right') >= 0) {
-      positioningStyle = isIn ? styles.isLeft : styles.isRight;
-    } else if (name.indexOf('Up') >= 0) {
-      positioningStyle = isIn ? styles.isBottom : styles.isTop;
-    } else {
-      positioningStyle = isIn ? styles.isTop : styles.isBottom;
-    }
-
-    let animationClassName: string | null = this.state.isAnimating
-      // tslint:disable-next-line:no-any
-      ? (AnimationClassNames as any)[this.props.name]
-      : null;
-
-    return (
-      <div className={ styles.root as string } onClick={ this._onClick }>
-        <div className={ styles.title as string }>{ this.props.name }</div>
-        <div className={ styles.container as string }>
-          <div
-            className={ mergeStyles(
-              styles.animationBox,
-              positioningStyle,
-              isInStyle,
-              animationClassName
-            ) as string }
-          />
-        </div>
-      </div>
-    );
-  }
-
-  private _onClick = (): void => {
-    this.setState({ isAnimating: true });
-    this._async.setTimeout(() => {
-      this.setState({ isAnimating: false });
-    }, 2000);
-  }
-
-}
diff --git a/packages/styling/src/examples/ColorPage/ColorPage.styles.ts b/packages/styling/src/examples/ColorPage/ColorPage.styles.ts
deleted file mode 100644
index 957eaa6273f7c..0000000000000
--- a/packages/styling/src/examples/ColorPage/ColorPage.styles.ts
+++ /dev/null
@@ -1,43 +0,0 @@
-import {
-  IStyle,
-  ITheme,
-  getTheme,
-  mergeStyles
-} from '@uifabric/styling';
-
-export interface IColorPageStyles {
-  swatch?: IStyle;
-  cell?: IStyle;
-  cellWithBorder?: IStyle;
-  swatchText?: IStyle;
-  example?: IStyle;
-}
-
-export function getStyles(theme: ITheme = getTheme()): IColorPageStyles {
-  return {
-    swatch: mergeStyles({
-      display: 'inline-block',
-      verticalAlign: 'middle',
-      width: 20,
-      height: 20,
-      borderRadius: '50%',
-      marginRight: '8px'
-    }),
-    cell: mergeStyles(
-      theme.fonts.small,
-      {
-        display: 'inline-block',
-        verticalAlign: 'middle',
-      }),
-    cellWithBorder: mergeStyles({
-      borderWidth: '1px',
-      borderStyle: 'solid'
-    }),
-    swatchText: mergeStyles({
-      display: 'inline-block',
-      verticalAlign: 'middle',
-    }),
-
-    example: mergeStyles(theme.fonts.mediumPlus)
-  };
-}
\ No newline at end of file
diff --git a/packages/styling/src/examples/ColorPage/ColorPage.tsx b/packages/styling/src/examples/ColorPage/ColorPage.tsx
deleted file mode 100644
index 5c0f2d326a668..0000000000000
--- a/packages/styling/src/examples/ColorPage/ColorPage.tsx
+++ /dev/null
@@ -1,104 +0,0 @@
-import * as React from 'react';
-import { BaseComponent } from '@uifabric/utilities';
-import {
-  DefaultPalette,
-  ColorClassNames,
-  ITheme,
-  getTheme
-} from '@uifabric/styling';
-import { DetailsList, IColumn } from 'office-ui-fabric-react/lib/DetailsList';
-import { Page } from '../Page/Page';
-import { PageHeader } from '../PageHeader/PageHeader';
-import { IColorPageStyles, getStyles } from './ColorPage.styles';
-
-const COLUMNS: IColumn[] = [
-  {
-    key: 'name',
-    name: 'Name',
-    fieldName: 'name',
-    minWidth: 200,
-    maxWidth: 300
-  },
-  {
-    key: 'colorValue',
-    name: 'Color value',
-    fieldName: 'colorValue',
-    minWidth: 100,
-    maxWidth: 200
-  },
-  {
-    key: 'example',
-    name: 'Example',
-    fieldName: 'example',
-    minWidth: 300,
-    maxWidth: 400
-  }
-];
-
-export interface IColorItem {
-  key: string;
-  colorValue: string;
-  name: string;
-}
-
-export class ColorPage extends BaseComponent<{}, {}> {
-  constructor() {
-    super();
-
-    this.state = { details: null };
-  }
-  public render(): JSX.Element {
-    const items: IColorItem[] = [];
-    const theme: ITheme = getTheme();
-    const styles: IColorPageStyles = getStyles();
-
-    Object.keys(DefaultPalette).forEach((colorName: string) => {
-      // tslint:disable-next-line:no-any
-      const colorValue: string = (theme.palette as any)[colorName];
-
-      ['', 'Hover', 'Background', 'BackgroundHover', 'Border', 'BorderHover'].forEach((suffix: string) => {
-        items.push({
-          key: 'item' + items.length,
-          name: colorName + suffix,
-          colorValue
-        });
-      });
-    });
-
-    return (
-      <Page>
-        <PageHeader text='Colors' />
-        <DetailsList
-          items={ items }
-          columns={ COLUMNS }
-          onRenderItemColumn={ (item: IColorItem, index: number, column: IColumn): JSX.Element => (
-            <div className={ styles.cell as string }>
-              { column.fieldName === 'colorValue' ? (
-                <div>
-                  <div className={ styles.swatch as string } style={ { background: item.colorValue } } />
-                  <div className={ styles.swatchText as string }>{ item.colorValue }</div>
-                </div>
-              ) :
-                column.key === 'example' ? (
-                  <div
-                    className={
-                      // tslint:disable-next-line:no-any
-                      (ColorClassNames as any)[item.name] +
-                      ' ' +
-                      (item.name.indexOf('Border') >= 0 ? styles.cellWithBorder : '')
-                    }
-                  >
-                    The quick brown fox jumps over the lazy dog.
-                  </div>
-                ) : (
-                    // tslint:disable-next-line:no-any
-                    <div>{ (item as any)[column.fieldName] }</div>
-                  ) }
-            </div>
-          )
-          }
-        />
-      </Page >
-    );
-  }
-}
diff --git a/packages/styling/src/examples/FontPage/FontPage.styles.ts b/packages/styling/src/examples/FontPage/FontPage.styles.ts
deleted file mode 100644
index 394383d87ae0e..0000000000000
--- a/packages/styling/src/examples/FontPage/FontPage.styles.ts
+++ /dev/null
@@ -1,26 +0,0 @@
-import {
-  IStyle,
-  ITheme,
-  getTheme,
-  mergeStyles
-} from '@uifabric/styling';
-
-export interface IFontPageRules {
-  row: IStyle;
-  cell: IStyle;
-}
-
-export function getStyles(theme: ITheme = getTheme()): IFontPageRules {
-  return {
-    row: mergeStyles({
-      paddingBottom: '10px',
-      borderBottom: '1px solid ' + theme.palette.themeLighterAlt,
-      userSelect: 'none'
-    }),
-    cell: mergeStyles(
-      theme.fonts.small,
-      {
-        paddingRight: '20px'
-      })
-  };
-}
diff --git a/packages/styling/src/examples/FontPage/FontPage.tsx b/packages/styling/src/examples/FontPage/FontPage.tsx
deleted file mode 100644
index 08a73b70f9da0..0000000000000
--- a/packages/styling/src/examples/FontPage/FontPage.tsx
+++ /dev/null
@@ -1,42 +0,0 @@
-import * as React from 'react';
-import { BaseComponent } from '@uifabric/utilities';
-import { Page } from '../Page/Page';
-import { PageHeader } from '../PageHeader/PageHeader';
-import {
-  ITheme,
-  getTheme,
-  mergeStyles
-} from '@uifabric/styling';
-import { IFontPageRules, getStyles } from './FontPage.styles';
-
-export class FontPage extends BaseComponent<{}, {}> {
-
-  public render(): JSX.Element {
-    const theme: ITheme = getTheme();
-    const styles: IFontPageRules = getStyles(theme);
-
-    return (
-      <Page>
-        <PageHeader text='Fonts' />
-        <table>
-          <tbody>
-            {
-              Object.keys(theme.fonts)
-                // tslint:disable:no-any
-                .filter((fontName: string) => (theme.fonts as any)[fontName].fontSize !== undefined)
-                .map((fontName: string) => (
-                  <tr className={ styles.row as string } key={ fontName }>
-                    <td className={ styles.cell as string }>{ `${fontName}` }</td>
-                    <td className={ styles.cell as string }>{ `${(theme.fonts as any)[fontName].fontSize}` }</td>
-                    <td className={ mergeStyles((theme.fonts as any)[fontName]) as string }>
-                      The quick brown fox jumps over the lazy dog
-                    </td>
-                  </tr>
-                )) }
-          </tbody>
-        </table>
-      </Page>
-    );
-  }
-}
-// tslint:enable:no-any
diff --git a/packages/styling/src/examples/IconPage/IconPage.styles.ts b/packages/styling/src/examples/IconPage/IconPage.styles.ts
deleted file mode 100644
index 2d7e54bfb4dd0..0000000000000
--- a/packages/styling/src/examples/IconPage/IconPage.styles.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import {
-  IStyle,
-  ITheme,
-  getTheme,
-  mergeStyles
-} from '@uifabric/styling';
-
-export interface IIconPageStyles {
-  container?: IStyle;
-}
-
-export function getStyles(theme: ITheme = getTheme()): IIconPageStyles {
-  return {
-    container: mergeStyles({
-      display: 'flex',
-      justifyContent: 'center',
-      flexWrap: 'wrap'
-    })
-  };
-}
diff --git a/packages/styling/src/examples/IconPage/IconPage.tsx b/packages/styling/src/examples/IconPage/IconPage.tsx
deleted file mode 100644
index c8ac72e2d8122..0000000000000
--- a/packages/styling/src/examples/IconPage/IconPage.tsx
+++ /dev/null
@@ -1,53 +0,0 @@
-import * as React from 'react';
-import { BaseComponent } from '@uifabric/utilities';
-import { IconCodes } from '@uifabric/styling';
-import { SearchBox } from 'office-ui-fabric-react/lib/SearchBox';
-import { FocusZone } from 'office-ui-fabric-react/lib/FocusZone';
-import { Page } from '../Page/Page';
-import { PageHeader } from '../PageHeader/PageHeader';
-import { IconTile } from '../IconTile/IconTile';
-import { IIconPageStyles, getStyles } from './IconPage.styles';
-
-export interface IIconPageState {
-  iconNames: string[];
-}
-
-export class IconPage extends BaseComponent<{}, IIconPageState> {
-  constructor() {
-    super();
-
-    this.state = {
-      iconNames: Object.keys(IconCodes)
-    };
-  }
-
-  public render(): JSX.Element {
-    const { iconNames }: IIconPageState = this.state;
-    const styles: IIconPageStyles = getStyles();
-
-    return (
-      <Page>
-        <PageHeader text='Icons' />
-        <SearchBox labelText='Filter icons...' onChange={ this._onSearchChange } />
-        <FocusZone>
-          <div className={ styles.container as string }>
-            { iconNames.map((iconName: string) => (
-              <IconTile key={ iconName } iconName={ iconName } data-is-focusable={ true } />
-            )) }
-          </div>
-        </FocusZone>
-      </Page>
-    );
-  }
-
-  private _onSearchChange = (value: string): void => {
-    let iconNames: string[] = Object.keys(IconCodes);
-
-    value = value.toLocaleLowerCase();
-
-    if (value) {
-      iconNames = iconNames.filter((name: string) => name.toLocaleLowerCase().indexOf(value) >= 0);
-    }
-    this.setState({ iconNames });
-  }
-}
diff --git a/packages/styling/src/examples/IconTile/IconTile.styles.ts b/packages/styling/src/examples/IconTile/IconTile.styles.ts
deleted file mode 100644
index ed061abc3a33e..0000000000000
--- a/packages/styling/src/examples/IconTile/IconTile.styles.ts
+++ /dev/null
@@ -1,64 +0,0 @@
-import {
-  AnimationStyles,
-  IStyle,
-  ITheme,
-  getTheme,
-  mergeStyles
-} from '@uifabric/styling';
-
-export interface IIconTileStyles {
-  iconTile: IStyle;
-  icon: IStyle;
-}
-
-export function getStyles(theme: ITheme = getTheme()): IIconTileStyles {
-  return {
-    iconTile: mergeStyles(
-      theme.fonts.small,
-      {
-        flexShrink: 0,
-        display: 'flex',
-        flexDirection: 'column',
-        justifyContent: 'center',
-        alignItems: 'center',
-        margin: '5px',
-        width: 150,
-        height: 80,
-        opacity: .6,
-        cursor: 'default',
-        outline: 'none',
-        position: 'relative',
-
-        ':focus:after': {
-          content: '""',
-          position: 'absolute',
-          left: 0,
-          top: 0,
-          right: 0,
-          bottom: 0,
-          border: '1px solid ' + theme.palette.themePrimary,
-        },
-
-        ':focus': {
-          ...AnimationStyles.fadeIn500,
-          color: theme.palette.themePrimary,
-          opacity: 1,
-          background: theme.palette.themeLighterAlt
-        },
-        ':hover': {
-          opacity: 1,
-          background: theme.palette.themeLighterAlt
-        },
-        ':focus:hover': {
-          background: theme.palette.themeLight
-        }
-      }),
-
-    icon: mergeStyles(
-      theme.fonts.icon,
-      {
-        fontSize: '36px',
-        paddingBottom: '8px'
-      })
-  };
-}
diff --git a/packages/styling/src/examples/IconTile/IconTile.tsx b/packages/styling/src/examples/IconTile/IconTile.tsx
deleted file mode 100644
index 8a33511865ddd..0000000000000
--- a/packages/styling/src/examples/IconTile/IconTile.tsx
+++ /dev/null
@@ -1,22 +0,0 @@
-import * as React from 'react';
-import { SearchBox } from 'office-ui-fabric-react/lib/SearchBox';
-import { IconClassNames } from '@uifabric/styling';
-import { IIconTileStyles, getStyles } from './IconTile.styles';
-
-export interface IIconTileProps extends React.HTMLAttributes<HTMLDivElement> {
-  iconName: string;
-}
-
-export function IconTile(props: IIconTileProps): JSX.Element {
-  const { iconName, children, ...divProps }: IIconTileProps = props;
-  const styles: IIconTileStyles = getStyles();
-
-  return (
-    // tslint:disable:no-any
-    <div className={ styles.iconTile as string } { ...divProps }>
-      <i className={ (IconClassNames as any)[iconName] + ' ' + styles.icon } />
-      <div>{ iconName }</div>
-    </div>
-    // tslint:enable:no-any
-  );
-}
diff --git a/packages/styling/src/examples/Page/Page.styles.ts b/packages/styling/src/examples/Page/Page.styles.ts
deleted file mode 100644
index deea7962ad3a7..0000000000000
--- a/packages/styling/src/examples/Page/Page.styles.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import {
-  IStyle,
-  ITheme,
-  getTheme,
-  mergeStyles
-} from '@uifabric/styling';
-
-export interface IPageStyles {
-  root?: IStyle;
-}
-
-export function getStyles(theme: ITheme = getTheme()): IPageStyles {
-  return {
-    root: mergeStyles(
-      theme.fonts.medium,
-      {
-        padding: '20px'
-      }
-    )
-  };
-}
diff --git a/packages/styling/src/examples/Page/Page.tsx b/packages/styling/src/examples/Page/Page.tsx
deleted file mode 100644
index 1e35abe96d1d4..0000000000000
--- a/packages/styling/src/examples/Page/Page.tsx
+++ /dev/null
@@ -1,19 +0,0 @@
-import * as React from 'react';
-import { getStyles, IPageStyles } from './Page.styles';
-
-export interface IPageProps extends React.Props<Page> {
-}
-
-export class Page extends React.PureComponent<IPageProps, {}> {
-
-  public render(): JSX.Element {
-    const { children }: IPageProps = this.props;
-    const styles: IPageStyles = getStyles();
-
-    return (
-      <div className={ styles.root as string }>
-        { children }
-      </div>
-    );
-  }
-}
diff --git a/packages/styling/src/examples/PageHeader/PageHeader.styles.ts b/packages/styling/src/examples/PageHeader/PageHeader.styles.ts
deleted file mode 100644
index aefd7d81c2abb..0000000000000
--- a/packages/styling/src/examples/PageHeader/PageHeader.styles.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import {
-  IStyle,
-  ITheme,
-  getTheme,
-  mergeStyles
-} from '@uifabric/styling';
-
-export interface IPageHeaderStyles {
-  root?: IStyle;
-}
-
-export function getStyles(theme: ITheme = getTheme()): IPageHeaderStyles {
-  return {
-    root: mergeStyles(
-      theme.fonts.xLarge,
-      {
-        paddingBottom: '20px'
-      }
-    )
-  };
-}
\ No newline at end of file
diff --git a/packages/styling/src/examples/PageHeader/PageHeader.tsx b/packages/styling/src/examples/PageHeader/PageHeader.tsx
deleted file mode 100644
index de749409903e1..0000000000000
--- a/packages/styling/src/examples/PageHeader/PageHeader.tsx
+++ /dev/null
@@ -1,19 +0,0 @@
-import * as React from 'react';
-import { IPageHeaderStyles, getStyles } from './PageHeader.styles';
-
-export interface IPageHeaderProps {
-  text: string;
-}
-
-export class PageHeader extends React.PureComponent<IPageHeaderProps, {}> {
-  public render(): JSX.Element {
-    const { text }: IPageHeaderProps = this.props;
-    const styles: IPageHeaderStyles = getStyles();
-
-    return (
-      <div>
-        <div className={ styles.root as string }>{ text }</div>
-      </div>
-    );
-  }
-}
diff --git a/packages/styling/src/index.demo.tsx b/packages/styling/src/index.demo.tsx
deleted file mode 100644
index fce4c88d67613..0000000000000
--- a/packages/styling/src/index.demo.tsx
+++ /dev/null
@@ -1,37 +0,0 @@
-import * as React from 'react';
-import { loadTheme } from '@uifabric/styling';
-
-// Example of setting theming overrides!
-/*
-loadTheme({
-  colors: { themePrimary: 'red' },
-  fonts: {
-    mediumPlus: {
-      fontFamily: '"Courier New"',
-      fontSize: '14px'
-    }
-  }
-});
-*/
-
-import { examplesOf, createApp } from '@uifabric/example-app-base';
-import { ColorPage } from './examples/ColorPage/ColorPage';
-import { FontPage } from './examples/FontPage/FontPage';
-import { IconPage } from './examples/IconPage/IconPage';
-import { AnimationPage } from './examples/AnimationPage/AnimationPage';
-
-createApp([
-  examplesOf('Styling')
-    .add('Colors', () => (
-      <ColorPage />
-    ))
-    .add('Typography', () => (
-      <FontPage />
-    ))
-    .add('Icons', () => (
-      <IconPage />
-    ))
-    .add('Animations', () => (
-      <AnimationPage />
-    ))
-]);
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 84909f986ad84..a8bfc5663b99a 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -16,16 +16,16 @@
     "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js"
   },
   "devDependencies": {
-    "@microsoft/web-library-build": ">=3.0.0-0 <4.0.0-0",
+    "@microsoft/web-library-build": "^3.2.1",
     "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.0",
     "@types/es6-promise": "^0.0.32",
     "@types/es6-weak-map": "1.2.0",
     "@types/mocha": "2.2.39",
     "@types/prop-types": "15.5.1",
-    "@types/react": "15.0.29",
+    "@types/react": "15.0.38",
     "@types/react-addons-test-utils": "0.14.18",
-    "@types/react-dom": "15.5.0",
+    "@types/react-dom": "15.5.1",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
     "enzyme": "^2.7.0",
@@ -39,7 +39,7 @@
     "react-dom": "^15.4.2",
     "sinon": "^2.3.2",
     "source-map-loader": "^0.2.1",
-    "typescript": "2.2.2"
+    "typescript": "2.4.2"
   },
   "dependencies": {
     "prop-types": "^15.5.10",
diff --git a/packages/utilities/src/customizable.tsx b/packages/utilities/src/customizable.tsx
index 5cf2e70bbe338..1a5ddff83be60 100644
--- a/packages/utilities/src/customizable.tsx
+++ b/packages/utilities/src/customizable.tsx
@@ -3,6 +3,7 @@ import * as PropTypes from 'prop-types';
 import { GlobalSettings, IChangeDescription } from './GlobalSettings';
 
 export function customizable<P>(fields: string[]) {
+  // tslint:disable-next-line:no-shadowed-variable
   return function customizableFactory<P, S>(
     ComposedComponent: (new (props: P, ...args: any[]) => React.Component<P, S>)
   ): any {
diff --git a/packages/utilities/src/scroll.ts b/packages/utilities/src/scroll.ts
index 2d4edddf61c5d..a0f43c33fefad 100644
--- a/packages/utilities/src/scroll.ts
+++ b/packages/utilities/src/scroll.ts
@@ -91,8 +91,8 @@ export function findScrollableParent(startingElement: HTMLElement): HTMLElement
 
   while (el && el !== document.body) {
     if (el.getAttribute(DATA_IS_SCROLLABLE_ATTRIBUTE) !== 'false') {
-      const styles = getComputedStyle(el);
-      let overflowY = styles ? styles.getPropertyValue('overflow-y') : '';
+      const computedStyles = getComputedStyle(el);
+      let overflowY = computedStyles ? computedStyles.getPropertyValue('overflow-y') : '';
 
       if (overflowY && (overflowY === 'scroll' || overflowY === 'auto')) {
         return el;
diff --git a/packages/utilities/tsconfig.json b/packages/utilities/tsconfig.json
index 5080d40bebda3..fb6d04adec19b 100644
--- a/packages/utilities/tsconfig.json
+++ b/packages/utilities/tsconfig.json
@@ -21,6 +21,8 @@
     ]
   },
   "exclude": [
+    "api",
+    "temp",
     "node_modules",
     "dist",
     "lib",
diff --git a/rush.json b/rush.json
index 034b3da289781..52dabd796a7b1 100644
--- a/rush.json
+++ b/rush.json
@@ -32,11 +32,6 @@
         "@uifabric/example-app-base"
       ]
     },
-    {
-      "packageName": "@uifabric/example-component",
-      "projectFolder": "packages/example-component",
-      "shouldPublish": false
-    },
     {
       "packageName": "ssr-tests",
       "projectFolder": "apps/ssr-tests",

From 234f9c8c7b84854e591376a2ea19a39b0f349fa2 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 2 Aug 2017 14:10:22 -0700
Subject: [PATCH 0348/1641] adding CODEOWNERS

---
 .github/CODEOWNERS | 94 ++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 94 insertions(+)
 create mode 100644 .github/CODEOWNERS

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
new file mode 100644
index 0000000000000..6bfa587f30c54
--- /dev/null
+++ b/.github/CODEOWNERS
@@ -0,0 +1,94 @@
+# This is a comment.
+# Each line is a file pattern followed by one or more owners.
+
+# These owners will be the default owners for everything in the repo.
+# Unless a later match takes precedence, @global-owner1 and @global-owner2
+# will be requested for review when someone opens a pull request.
+# *       @global-owner1 @global-owner2
+
+# Order is important; the last matching pattern takes the most precedence.
+# When someone opens a pull request that only modifies JS files, only @js-owner
+# and not the global owner(s) will be requested for a review.
+# *.js    @js-owner
+
+# You can also use email addresses if you prefer. They'll be used to look up
+# users just like we do for commit author emails.
+# docs/*  docs@example.com
+
+#### Apps
+# component-demo/*
+# fabric-website/*
+# ssr-tests/*
+# test-bundle-button/*
+# todo-app/*
+
+#### Packages
+# packages/example-app-base/*
+# packages/example-component/*
+
+  ### Fabric
+  # packages/office-ui-fabric-react/src/common/*
+
+    ## Components
+    # packages/office-ui-fabric-react/src/component/ActivityItem/*
+    # packages/office-ui-fabric-react/src/component/Breadcrumb/*
+    # packages/office-ui-fabric-react/src/component/Button/*
+    # packages/office-ui-fabric-react/src/component/Calendar/*
+    # packages/office-ui-fabric-react/src/component/Callout/*
+    # packages/office-ui-fabric-react/src/component/Check/*
+    # packages/office-ui-fabric-react/src/component/Checkbox/*
+    # packages/office-ui-fabric-react/src/component/ChoiceGroup/*
+    # packages/office-ui-fabric-react/src/component/ColorPicker/*
+    # packages/office-ui-fabric-react/src/component/ComboBox/*
+    packages/office-ui-fabric-react/src/component/CommandBar/*   @micahgodbolt
+    # packages/office-ui-fabric-react/src/component/ContextualMenu/*
+    # packages/office-ui-fabric-react/src/component/DatePicker/*
+    # packages/office-ui-fabric-react/src/component/DetailsList/*
+    # packages/office-ui-fabric-react/src/component/Dialog/*
+    # packages/office-ui-fabric-react/src/component/DocumentCard/*
+    # packages/office-ui-fabric-react/src/component/Dropdown/*
+    # packages/office-ui-fabric-react/src/component/Fabric/*
+    # packages/office-ui-fabric-react/src/component/FacePile/*
+    # packages/office-ui-fabric-react/src/component/FocusTrapZone/*
+    # packages/office-ui-fabric-react/src/component/FocusZone/*
+    # packages/office-ui-fabric-react/src/component/GroupedList/*
+    # packages/office-ui-fabric-react/src/component/HoverCard/*
+    # packages/office-ui-fabric-react/src/component/Icon/*
+    # packages/office-ui-fabric-react/src/component/Image/*
+    # packages/office-ui-fabric-react/src/component/Label/*
+    # packages/office-ui-fabric-react/src/component/Layer/*
+    # packages/office-ui-fabric-react/src/component/Link/*
+    # packages/office-ui-fabric-react/src/component/List/*
+    # packages/office-ui-fabric-react/src/component/MarqueeSelection/*
+    # packages/office-ui-fabric-react/src/component/MessageBar/*
+    # packages/office-ui-fabric-react/src/component/Modal/*
+    # packages/office-ui-fabric-react/src/component/Nav/*
+    packages/office-ui-fabric-react/src/component/OverflowSet/*  @micahgodbolt
+    # packages/office-ui-fabric-react/src/component/Overlay/*
+    # packages/office-ui-fabric-react/src/component/Panel/*
+    # packages/office-ui-fabric-react/src/component/Persona/*
+    # packages/office-ui-fabric-react/src/component/pickers/*
+    # packages/office-ui-fabric-react/src/component/Pivot/*
+    # packages/office-ui-fabric-react/src/component/Popup/*
+    # packages/office-ui-fabric-react/src/component/ProgressIndicator/*
+    # packages/office-ui-fabric-react/src/component/Rating/*
+    packages/office-ui-fabric-react/src/component/ResizeGroup/*  @micahgodbolt
+    # packages/office-ui-fabric-react/src/component/SearchBox/*
+    # packages/office-ui-fabric-react/src/component/Slider/*
+    # packages/office-ui-fabric-react/src/component/SpinButton/*
+    # packages/office-ui-fabric-react/src/component/Spinner/*
+    # packages/office-ui-fabric-react/src/component/SwatchColorPicker/*
+    packages/office-ui-fabric-react/src/component/TeachingBubble/*   @micahgodbolt
+    # packages/office-ui-fabric-react/src/component/TextField/*
+    # packages/office-ui-fabric-react/src/component/Theme/*
+    # packages/office-ui-fabric-react/src/component/Toggle/*
+    packages/office-ui-fabric-react/src/component/Tooltip/*  @micahgodbolt
+
+  # packages/office-ui-fabric-react/src/demo/*
+  # packages/office-ui-fabric-react/src/utilities/*
+  # packages/office-ui-fabric-react/src/visualtest/*
+
+# packages/office-ui-fabric-react-tslint/*
+# packages/styling/*
+# packages/utilities/*
+

From 48a105450fb54316e909d5d2644f74113d84f271 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 2 Aug 2017 14:14:35 -0700
Subject: [PATCH 0349/1641] CODEOWNERS typo fix

---
 .github/CODEOWNERS | 106 ++++++++++++++++++++++-----------------------
 1 file changed, 53 insertions(+), 53 deletions(-)

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index 6bfa587f30c54..6dee7cdd4584e 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -30,59 +30,59 @@
   # packages/office-ui-fabric-react/src/common/*
 
     ## Components
-    # packages/office-ui-fabric-react/src/component/ActivityItem/*
-    # packages/office-ui-fabric-react/src/component/Breadcrumb/*
-    # packages/office-ui-fabric-react/src/component/Button/*
-    # packages/office-ui-fabric-react/src/component/Calendar/*
-    # packages/office-ui-fabric-react/src/component/Callout/*
-    # packages/office-ui-fabric-react/src/component/Check/*
-    # packages/office-ui-fabric-react/src/component/Checkbox/*
-    # packages/office-ui-fabric-react/src/component/ChoiceGroup/*
-    # packages/office-ui-fabric-react/src/component/ColorPicker/*
-    # packages/office-ui-fabric-react/src/component/ComboBox/*
-    packages/office-ui-fabric-react/src/component/CommandBar/*   @micahgodbolt
-    # packages/office-ui-fabric-react/src/component/ContextualMenu/*
-    # packages/office-ui-fabric-react/src/component/DatePicker/*
-    # packages/office-ui-fabric-react/src/component/DetailsList/*
-    # packages/office-ui-fabric-react/src/component/Dialog/*
-    # packages/office-ui-fabric-react/src/component/DocumentCard/*
-    # packages/office-ui-fabric-react/src/component/Dropdown/*
-    # packages/office-ui-fabric-react/src/component/Fabric/*
-    # packages/office-ui-fabric-react/src/component/FacePile/*
-    # packages/office-ui-fabric-react/src/component/FocusTrapZone/*
-    # packages/office-ui-fabric-react/src/component/FocusZone/*
-    # packages/office-ui-fabric-react/src/component/GroupedList/*
-    # packages/office-ui-fabric-react/src/component/HoverCard/*
-    # packages/office-ui-fabric-react/src/component/Icon/*
-    # packages/office-ui-fabric-react/src/component/Image/*
-    # packages/office-ui-fabric-react/src/component/Label/*
-    # packages/office-ui-fabric-react/src/component/Layer/*
-    # packages/office-ui-fabric-react/src/component/Link/*
-    # packages/office-ui-fabric-react/src/component/List/*
-    # packages/office-ui-fabric-react/src/component/MarqueeSelection/*
-    # packages/office-ui-fabric-react/src/component/MessageBar/*
-    # packages/office-ui-fabric-react/src/component/Modal/*
-    # packages/office-ui-fabric-react/src/component/Nav/*
-    packages/office-ui-fabric-react/src/component/OverflowSet/*  @micahgodbolt
-    # packages/office-ui-fabric-react/src/component/Overlay/*
-    # packages/office-ui-fabric-react/src/component/Panel/*
-    # packages/office-ui-fabric-react/src/component/Persona/*
-    # packages/office-ui-fabric-react/src/component/pickers/*
-    # packages/office-ui-fabric-react/src/component/Pivot/*
-    # packages/office-ui-fabric-react/src/component/Popup/*
-    # packages/office-ui-fabric-react/src/component/ProgressIndicator/*
-    # packages/office-ui-fabric-react/src/component/Rating/*
-    packages/office-ui-fabric-react/src/component/ResizeGroup/*  @micahgodbolt
-    # packages/office-ui-fabric-react/src/component/SearchBox/*
-    # packages/office-ui-fabric-react/src/component/Slider/*
-    # packages/office-ui-fabric-react/src/component/SpinButton/*
-    # packages/office-ui-fabric-react/src/component/Spinner/*
-    # packages/office-ui-fabric-react/src/component/SwatchColorPicker/*
-    packages/office-ui-fabric-react/src/component/TeachingBubble/*   @micahgodbolt
-    # packages/office-ui-fabric-react/src/component/TextField/*
-    # packages/office-ui-fabric-react/src/component/Theme/*
-    # packages/office-ui-fabric-react/src/component/Toggle/*
-    packages/office-ui-fabric-react/src/component/Tooltip/*  @micahgodbolt
+    # packages/office-ui-fabric-react/src/components/ActivityItem/*
+    # packages/office-ui-fabric-react/src/components/Breadcrumb/*
+    # packages/office-ui-fabric-react/src/components/Button/*
+    # packages/office-ui-fabric-react/src/components/Calendar/*
+    # packages/office-ui-fabric-react/src/components/Callout/*
+    # packages/office-ui-fabric-react/src/components/Check/*
+    # packages/office-ui-fabric-react/src/components/Checkbox/*
+    # packages/office-ui-fabric-react/src/components/ChoiceGroup/*
+    # packages/office-ui-fabric-react/src/components/ColorPicker/*
+    # packages/office-ui-fabric-react/src/components/ComboBox/*
+    packages/office-ui-fabric-react/src/components/CommandBar/*   @micahgodbolt
+    # packages/office-ui-fabric-react/src/components/ContextualMenu/*
+    # packages/office-ui-fabric-react/src/components/DatePicker/*
+    # packages/office-ui-fabric-react/src/components/DetailsList/*
+    # packages/office-ui-fabric-react/src/components/Dialog/*
+    # packages/office-ui-fabric-react/src/components/DocumentCard/*
+    # packages/office-ui-fabric-react/src/components/Dropdown/*
+    # packages/office-ui-fabric-react/src/components/Fabric/*
+    # packages/office-ui-fabric-react/src/components/FacePile/*
+    # packages/office-ui-fabric-react/src/components/FocusTrapZone/*
+    # packages/office-ui-fabric-react/src/components/FocusZone/*
+    # packages/office-ui-fabric-react/src/components/GroupedList/*
+    # packages/office-ui-fabric-react/src/components/HoverCard/*
+    # packages/office-ui-fabric-react/src/components/Icon/*
+    # packages/office-ui-fabric-react/src/components/Image/*
+    # packages/office-ui-fabric-react/src/components/Label/*
+    # packages/office-ui-fabric-react/src/components/Layer/*
+    # packages/office-ui-fabric-react/src/components/Link/*
+    # packages/office-ui-fabric-react/src/components/List/*
+    # packages/office-ui-fabric-react/src/components/MarqueeSelection/*
+    # packages/office-ui-fabric-react/src/components/MessageBar/*
+    # packages/office-ui-fabric-react/src/components/Modal/*
+    # packages/office-ui-fabric-react/src/components/Nav/*
+    packages/office-ui-fabric-react/src/components/OverflowSet/*  @micahgodbolt
+    # packages/office-ui-fabric-react/src/components/Overlay/*
+    # packages/office-ui-fabric-react/src/components/Panel/*
+    # packages/office-ui-fabric-react/src/components/Persona/*
+    # packages/office-ui-fabric-react/src/components/pickers/*
+    # packages/office-ui-fabric-react/src/components/Pivot/*
+    # packages/office-ui-fabric-react/src/components/Popup/*
+    # packages/office-ui-fabric-react/src/components/ProgressIndicator/*
+    # packages/office-ui-fabric-react/src/components/Rating/*
+    packages/office-ui-fabric-react/src/components/ResizeGroup/*  @micahgodbolt
+    # packages/office-ui-fabric-react/src/components/SearchBox/*
+    # packages/office-ui-fabric-react/src/components/Slider/*
+    # packages/office-ui-fabric-react/src/components/SpinButton/*
+    # packages/office-ui-fabric-react/src/components/Spinner/*
+    # packages/office-ui-fabric-react/src/components/SwatchColorPicker/*
+    packages/office-ui-fabric-react/src/components/TeachingBubble/*   @micahgodbolt
+    # packages/office-ui-fabric-react/src/components/TextField/*
+    # packages/office-ui-fabric-react/src/components/Theme/*
+    # packages/office-ui-fabric-react/src/components/Toggle/*
+    packages/office-ui-fabric-react/src/components/Tooltip/*  @micahgodbolt
 
   # packages/office-ui-fabric-react/src/demo/*
   # packages/office-ui-fabric-react/src/utilities/*

From d87a20afac6728ca936a3e4ec421c1156782438f Mon Sep 17 00:00:00 2001
From: Aniket Handa <atneik@users.noreply.github.com>
Date: Wed, 2 Aug 2017 16:28:27 -0700
Subject: [PATCH 0350/1641] Update CODEOWNERS (#2378)

---
 .github/CODEOWNERS | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index 6dee7cdd4584e..b4a16f77db86f 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -52,7 +52,7 @@
     # packages/office-ui-fabric-react/src/components/FocusTrapZone/*
     # packages/office-ui-fabric-react/src/components/FocusZone/*
     # packages/office-ui-fabric-react/src/components/GroupedList/*
-    # packages/office-ui-fabric-react/src/components/HoverCard/*
+    packages/office-ui-fabric-react/src/components/HoverCard/*   @atneik
     # packages/office-ui-fabric-react/src/components/Icon/*
     # packages/office-ui-fabric-react/src/components/Image/*
     # packages/office-ui-fabric-react/src/components/Label/*

From 265ac177461bc60b63601e4bc6c88d3064b3bf13 Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Wed, 2 Aug 2017 18:02:51 -0700
Subject: [PATCH 0351/1641] Replacing callout border (#2379)

* Replacing callout border.

* Rush change.
---
 .../v-krbrow-callout-border_2017-08-02-23-18.json     | 11 +++++++++++
 .../src/components/Callout/Callout.scss               |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-callout-border_2017-08-02-23-18.json

diff --git a/common/changes/office-ui-fabric-react/v-krbrow-callout-border_2017-08-02-23-18.json b/common/changes/office-ui-fabric-react/v-krbrow-callout-border_2017-08-02-23-18.json
new file mode 100644
index 0000000000000..10eafb07acdda
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-callout-border_2017-08-02-23-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Callout: Reverting the callout border to it's previous state with a light border.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
index 41576bc236768..edcfdbf22c9d5 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
@@ -25,6 +25,7 @@ $Callout-smallbeak-slant-width: 16px;
   @include ms-drop-shadow(0,0, 5px, 0px);
   position: absolute;
   box-sizing: border-box;
+  border: 1px solid $ms-color-neutralLight;
 
   @include focus-clear();
 

From b607f48a5f7c073b215df7929eac9c81318fe962 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 3 Aug 2017 10:13:03 +0000
Subject: [PATCH 0352/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 32 +++++++++++++
 apps/fabric-website/CHANGELOG.md              | 13 ++++-
 apps/fabric-website/package.json              |  6 +--
 .../ts-241_2017-07-29-00-51.json              | 11 -----
 .../master_2017-07-28-07-41.json              | 11 -----
 .../ts-241_2017-07-29-00-51.json              | 11 -----
 ...cer-and-Divider-icon_2017-08-01-11-19.json | 11 -----
 .../styling/ts-241_2017-07-29-00-51.json      | 11 -----
 .../utilities/ts-241_2017-07-29-00-51.json    | 11 -----
 ...cer-and-Divider-icon_2017-08-01-11-19.json | 11 -----
 ...ntextual-menu-target_2017-07-31-15-56.json | 11 -----
 ...ch-clear-latestValue_2017-08-02-16-39.json | 11 -----
 .../ts-241_2017-07-29-00-51.json              | 11 -----
 ...rbrow-callout-border_2017-08-02-23-18.json | 11 -----
 packages/example-app-base/CHANGELOG.json      | 22 +++++++++
 packages/example-app-base/CHANGELOG.md        |  9 +++-
 packages/example-app-base/package.json        |  4 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 47 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 16 ++++++-
 packages/office-ui-fabric-react/package.json  |  8 ++--
 packages/styling/CHANGELOG.json               | 26 ++++++++++
 packages/styling/CHANGELOG.md                 | 13 ++++-
 packages/styling/package.json                 |  4 +-
 packages/utilities/CHANGELOG.json             | 14 ++++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  2 +-
 26 files changed, 208 insertions(+), 138 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/ts-241_2017-07-29-00-51.json
 delete mode 100644 common/changes/@uifabric/fabric-website/master_2017-07-28-07-41.json
 delete mode 100644 common/changes/@uifabric/fabric-website/ts-241_2017-07-29-00-51.json
 delete mode 100644 common/changes/@uifabric/styling/add-Spacer-and-Divider-icon_2017-08-01-11-19.json
 delete mode 100644 common/changes/@uifabric/styling/ts-241_2017-07-29-00-51.json
 delete mode 100644 common/changes/@uifabric/utilities/ts-241_2017-07-29-00-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/add-Spacer-and-Divider-icon_2017-08-01-11-19.json
 delete mode 100644 common/changes/office-ui-fabric-react/contextual-menu-target_2017-07-31-15-56.json
 delete mode 100644 common/changes/office-ui-fabric-react/search-clear-latestValue_2017-08-02-16-39.json
 delete mode 100644 common/changes/office-ui-fabric-react/ts-241_2017-07-29-00-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-callout-border_2017-08-02-23-18.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index de0fbc1e0308f..45b140ea53ac2 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,38 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.6.0",
+      "tag": "@uifabric/fabric-website_v4.6.0",
+      "date": "Thu, 03 Aug 2017 10:13:03 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Ryo Miyake <ryo.studiom@gmail.com>",
+            "commit": "c45ae1e1ba8ce08542de3f670c548e598a48ffc3",
+            "comment": "Fix utility class names, apply \"ms-\" prefix"
+          }
+        ],
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "fb487aa0e1510e9182394ff2ee04966986502634",
+            "comment": "TypeScript 2.4.1 bump"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=4.1.1 <5.0.0` to `>=4.2.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.8.0 <5.0.0` to `>=4.9.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.28.0 <5.0.0` to `>=4.28.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.5.42",
       "tag": "@uifabric/fabric-website_v4.5.42",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 72279033a073c..f153bca633f5e 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Fri, 21 Jul 2017 10:21:45 GMT and should not be manually modified.
+This log was last generated on Thu, 03 Aug 2017 10:13:03 GMT and should not be manually modified.
+
+## 4.6.0
+Thu, 03 Aug 2017 10:13:03 GMT
+
+### Minor changes
+
+- TypeScript 2.4.1 bump
+
+### Patches
+
+- Fix utility class names, apply "ms-" prefix
 
 ## 4.5.42
 Fri, 21 Jul 2017 10:21:45 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index d75504847ade9..aaf53841aadbe 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.5.42",
+  "version": "4.6.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,8 +47,8 @@
     "webpack-bundle-analyzer": "^2.2.1"
   },
   "dependencies": {
-    "@uifabric/example-app-base": ">=4.1.1 <5.0.0",
-    "@uifabric/utilities": ">=4.8.0 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.0 <5.0.0",
+    "@uifabric/utilities": ">=4.9.0 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
diff --git a/common/changes/@uifabric/example-app-base/ts-241_2017-07-29-00-51.json b/common/changes/@uifabric/example-app-base/ts-241_2017-07-29-00-51.json
deleted file mode 100644
index 39170784e31ab..0000000000000
--- a/common/changes/@uifabric/example-app-base/ts-241_2017-07-29-00-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "TypeScript 2.4.1 bump",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/master_2017-07-28-07-41.json b/common/changes/@uifabric/fabric-website/master_2017-07-28-07-41.json
deleted file mode 100644
index acdf6eaaf4ff2..0000000000000
--- a/common/changes/@uifabric/fabric-website/master_2017-07-28-07-41.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Fix utility class names, apply \"ms-\" prefix",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "ryo.studiom@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/ts-241_2017-07-29-00-51.json b/common/changes/@uifabric/fabric-website/ts-241_2017-07-29-00-51.json
deleted file mode 100644
index 50e704c849a25..0000000000000
--- a/common/changes/@uifabric/fabric-website/ts-241_2017-07-29-00-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "TypeScript 2.4.1 bump",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/add-Spacer-and-Divider-icon_2017-08-01-11-19.json b/common/changes/@uifabric/styling/add-Spacer-and-Divider-icon_2017-08-01-11-19.json
deleted file mode 100644
index 6b8d53e4dd112..0000000000000
--- a/common/changes/@uifabric/styling/add-Spacer-and-Divider-icon_2017-08-01-11-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "add Spacer and Divider toolbox icon",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "t-qianl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/ts-241_2017-07-29-00-51.json b/common/changes/@uifabric/styling/ts-241_2017-07-29-00-51.json
deleted file mode 100644
index b0dc879738f47..0000000000000
--- a/common/changes/@uifabric/styling/ts-241_2017-07-29-00-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "TypeScript 2.4.1 bump",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/ts-241_2017-07-29-00-51.json b/common/changes/@uifabric/utilities/ts-241_2017-07-29-00-51.json
deleted file mode 100644
index ef33f917ecad8..0000000000000
--- a/common/changes/@uifabric/utilities/ts-241_2017-07-29-00-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "TypeScript 2.4.1 bump",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/add-Spacer-and-Divider-icon_2017-08-01-11-19.json b/common/changes/office-ui-fabric-react/add-Spacer-and-Divider-icon_2017-08-01-11-19.json
deleted file mode 100644
index 626433ee4b774..0000000000000
--- a/common/changes/office-ui-fabric-react/add-Spacer-and-Divider-icon_2017-08-01-11-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "add Spacer and Divider toolbox icon",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "t-qianl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/contextual-menu-target_2017-07-31-15-56.json b/common/changes/office-ui-fabric-react/contextual-menu-target_2017-07-31-15-56.json
deleted file mode 100644
index 400ae2ddb5270..0000000000000
--- a/common/changes/office-ui-fabric-react/contextual-menu-target_2017-07-31-15-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ConextualMenuItem: Support target value",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/search-clear-latestValue_2017-08-02-16-39.json b/common/changes/office-ui-fabric-react/search-clear-latestValue_2017-08-02-16-39.json
deleted file mode 100644
index beb211d14931c..0000000000000
--- a/common/changes/office-ui-fabric-react/search-clear-latestValue_2017-08-02-16-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Searchbox: fixed bug when repeatedly entering a single character",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/ts-241_2017-07-29-00-51.json b/common/changes/office-ui-fabric-react/ts-241_2017-07-29-00-51.json
deleted file mode 100644
index 442110acf86f8..0000000000000
--- a/common/changes/office-ui-fabric-react/ts-241_2017-07-29-00-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "TypeScript 2.4.1 bump",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-callout-border_2017-08-02-23-18.json b/common/changes/office-ui-fabric-react/v-krbrow-callout-border_2017-08-02-23-18.json
deleted file mode 100644
index 10eafb07acdda..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-callout-border_2017-08-02-23-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Callout: Reverting the callout border to it's previous state with a light border.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 9a1ba62b2d7ae..195236fc07ddb 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "4.2.0",
+      "tag": "@uifabric/example-app-base_v4.2.0",
+      "date": "Thu, 03 Aug 2017 10:13:03 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "fb487aa0e1510e9182394ff2ee04966986502634",
+            "comment": "TypeScript 2.4.1 bump"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.15.4 <1.0.0` to `>=0.15.4 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.8.0 <5.0.0` to `>=4.9.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.1.1",
       "tag": "@uifabric/example-app-base_v4.1.1",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index ca856b3b7960f..8849d612e7c29 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Thu, 13 Jul 2017 02:58:02 GMT and should not be manually modified.
+This log was last generated on Thu, 03 Aug 2017 10:13:03 GMT and should not be manually modified.
+
+## 4.2.0
+Thu, 03 Aug 2017 10:13:03 GMT
+
+### Minor changes
+
+- TypeScript 2.4.1 bump
 
 ## 4.1.1
 Thu, 13 Jul 2017 02:58:02 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 0202c77d3bda0..6d6f2194ac83a 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "4.1.1",
+  "version": "4.2.0",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -49,7 +49,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=0.15.4 <1.0.0",
-    "@uifabric/utilities": ">=4.8.0 <5.0.0",
+    "@uifabric/utilities": ">=4.9.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.4.0 <5.0.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 5d741ef74d609..cd7735b7f63bf 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,53 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.29.0",
+      "tag": "office-ui-fabric-react_v4.29.0",
+      "date": "Thu, 03 Aug 2017 10:13:03 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "LQQ <lqq201194@163.com>",
+            "commit": "de2008d03de119da17a26b616be69c4b09c5320c",
+            "comment": "add Spacer and Divider toolbox icon"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "061d4bb481795b35e55b07e5df833bd824bcc35f",
+            "comment": "Searchbox: fixed bug when repeatedly entering a single character"
+          },
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "265ac177461bc60b63601e4bc6c88d3064b3bf13",
+            "comment": "Callout: Reverting the callout border to it's previous state with a light border."
+          }
+        ],
+        "minor": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "7bfa0875f4198bda88a74f700745d8a23721a3b1",
+            "comment": "ConextualMenuItem: Support target value"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "fb487aa0e1510e9182394ff2ee04966986502634",
+            "comment": "TypeScript 2.4.1 bump"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.8.0 <5.0.0` to `>=4.9.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.15.4 <1.0.0` to `>=0.16.0 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=4.1.1 <5.0.0` to `>=4.2.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.28.0",
       "tag": "office-ui-fabric-react_v4.28.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 82bb603f4ed9c..9ce608ca157c2 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,20 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 02 Aug 2017 10:22:40 GMT and should not be manually modified.
+This log was last generated on Thu, 03 Aug 2017 10:13:03 GMT and should not be manually modified.
+
+## 4.29.0
+Thu, 03 Aug 2017 10:13:03 GMT
+
+### Minor changes
+
+- ConextualMenuItem: Support target value
+- TypeScript 2.4.1 bump
+
+### Patches
+
+- add Spacer and Divider toolbox icon
+- Searchbox: fixed bug when repeatedly entering a single character
+- Callout: Reverting the callout border to it's previous state with a light border.
 
 ## 4.28.0
 Wed, 02 Aug 2017 10:22:40 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index c0888d20c708e..b489b9ed8c406 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.28.0",
+  "version": "4.29.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=4.1.1 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.0 <5.0.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -71,8 +71,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
-    "@uifabric/utilities": ">=4.8.0 <5.0.0",
-    "@uifabric/styling": ">=0.15.4 <1.0.0",
+    "@uifabric/utilities": ">=4.9.0 <5.0.0",
+    "@uifabric/styling": ">=0.16.0 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index f2b09f6453af5..837c42cfcc374 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.16.0",
+      "tag": "@uifabric/styling_v0.16.0",
+      "date": "Thu, 03 Aug 2017 10:13:03 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "LQQ <lqq201194@163.com>",
+            "commit": "de2008d03de119da17a26b616be69c4b09c5320c",
+            "comment": "add Spacer and Divider toolbox icon"
+          }
+        ],
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "fb487aa0e1510e9182394ff2ee04966986502634",
+            "comment": "TypeScript 2.4.1 bump"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.8.1 <5.0.0` to `>=4.9.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.15.4",
       "tag": "@uifabric/styling_v0.15.4",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 51ab5892cf71a..de72901e9bfac 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Wed, 02 Aug 2017 10:22:40 GMT and should not be manually modified.
+This log was last generated on Thu, 03 Aug 2017 10:13:03 GMT and should not be manually modified.
+
+## 0.16.0
+Thu, 03 Aug 2017 10:13:03 GMT
+
+### Minor changes
+
+- TypeScript 2.4.1 bump
+
+### Patches
+
+- add Spacer and Divider toolbox icon
 
 ## 0.15.4
 Wed, 02 Aug 2017 10:22:40 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index e8b8a047af9f4..52a24d539214b 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.15.4",
+  "version": "0.16.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
-    "@uifabric/utilities": ">=4.8.1 <5.0.0",
+    "@uifabric/utilities": ">=4.9.0 <5.0.0",
     "tslib": "^1.6.0",
     "rtl-css-js": "^1.1.1",
     "glamor": "^2.20.24"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index a399f58e12f9f..23c892333cb32 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.9.0",
+      "tag": "@uifabric/utilities_v4.9.0",
+      "date": "Thu, 03 Aug 2017 10:13:03 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "fb487aa0e1510e9182394ff2ee04966986502634",
+            "comment": "TypeScript 2.4.1 bump"
+          }
+        ]
+      }
+    },
     {
       "version": "4.8.1",
       "tag": "@uifabric/utilities_v4.8.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index ec95745b7937e..d91d70df2d447 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Fri, 21 Jul 2017 10:21:45 GMT and should not be manually modified.
+This log was last generated on Thu, 03 Aug 2017 10:13:03 GMT and should not be manually modified.
+
+## 4.9.0
+Thu, 03 Aug 2017 10:13:03 GMT
+
+### Minor changes
+
+- TypeScript 2.4.1 bump
 
 ## 4.8.1
 Fri, 21 Jul 2017 10:21:45 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index a8bfc5663b99a..20ede9718c479 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.8.1",
+  "version": "4.9.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From b05e72ce3b195894aa9dda09196c737263733d18 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Thu, 3 Aug 2017 09:27:57 -0700
Subject: [PATCH 0353/1641] Add classname to textfield-fieldgroup

---
 .../src/components/TextField/TextField.tsx                      | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index 71fc2b762ab07..21a16d5d53c58 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -156,7 +156,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
       <div className={ textFieldClassName }>
         <div className={ css('ms-TextField-wrapper', styles.wrapper) }>
           { label && <Label htmlFor={ this._id }>{ label }</Label> }
-          <div className={ css(styles.fieldGroup, isFocused && styles.fieldGroupIsFocused, errorMessage && styles.invalid) }>
+          <div className={ css('ms-TextField-fieldGroup', styles.fieldGroup, isFocused && styles.fieldGroupIsFocused, errorMessage && styles.invalid) }>
             { (addonString !== undefined || this.props.onRenderAddon) && (
               <div className={ css(styles.fieldAddon) }>
                 { onRenderAddon(this.props, this._onRenderAddon) }

From 8b5f91d7accb2087de8cc60dc75b823efc400ebf Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Thu, 3 Aug 2017 09:51:22 -0700
Subject: [PATCH 0354/1641] PeoplePicker: Improved keyboard support (#2372)

* Made load all button focusable, decreased load more and loading font size, made suggested contact list properly focus first suggestion.

* rush change

* Removing 'Top 10' element, fixing build issues.

* Fixing tslint build issues.

* Replacing callout border.

* Reverting callout border.
---
 ...plepicker-owa-review_2017-08-02-19-30.json | 11 +++++
 .../src/components/pickers/BasePicker.tsx     | 44 +++++++++++++++----
 .../examples/PeoplePicker.Types.Example.tsx   |  6 ---
 .../pickers/Suggestions/Suggestions.Props.ts  |  6 ++-
 .../pickers/Suggestions/Suggestions.scss      |  2 +
 .../pickers/Suggestions/Suggestions.tsx       | 11 ++++-
 .../Suggestions/SuggestionsController.ts      | 18 +++++---
 7 files changed, 75 insertions(+), 23 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-peoplepicker-owa-review_2017-08-02-19-30.json

diff --git a/common/changes/office-ui-fabric-react/v-krbrow-peoplepicker-owa-review_2017-08-02-19-30.json b/common/changes/office-ui-fabric-react/v-krbrow-peoplepicker-owa-review_2017-08-02-19-30.json
new file mode 100644
index 0000000000000..5becb5c266090
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-peoplepicker-owa-review_2017-08-02-19-30.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "PeoplePicker: Improved keyboard support and font size updates.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 985ca9633cdda..58c476f8e8e03 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -118,6 +118,16 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     }
   }
 
+  @autobind
+  public refocusSuggestions(keyCode: KeyCodes) {
+    this.resetFocus();
+    if (keyCode === KeyCodes.up) {
+      this.suggestionStore.setSelectedSuggestion(this.suggestionStore.suggestions.length - 1);
+    } else if (keyCode === KeyCodes.down) {
+      this.suggestionStore.setSelectedSuggestion(0);
+    }
+  }
+
   public render() {
     let { suggestedDisplayValue } = this.state;
     let {
@@ -184,6 +194,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
           isSearching={ this.state.isSearching }
           isMostRecentlyUsedVisible={ this.state.isMostRecentlyUsedVisible }
           isResultsFooterVisible={ this.state.isResultsFooterVisible }
+          refocusSuggestions={ this.refocusSuggestions }
           { ...this.props.pickerSuggestionsProps as any }
         />
       </Callout>
@@ -259,7 +270,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
       if (updatedValue !== undefined) {
         this.resolveNewValue(updatedValue, suggestionsArray);
       } else {
-        this.suggestionStore.updateSuggestions(suggestionsArray);
+        this.suggestionStore.updateSuggestions(suggestionsArray, 0);
       }
     } else if (suggestionsPromiseLike && suggestionsPromiseLike.then) {
       if (!this.loadingTimer) {
@@ -415,20 +426,35 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
         break;
 
       case KeyCodes.up:
-        if (ev.target === this.input.inputElement && this.suggestionStore.previousSuggestion() && this.state.suggestionsVisible) {
-          ev.preventDefault();
-          ev.stopPropagation();
-          this.onSuggestionSelect();
+        if (ev.target === this.input.inputElement && this.state.suggestionsVisible) {
+          if (this.state.moreSuggestionsAvailable && this.suggestionElement.props.searchForMoreText && this.suggestionStore.currentIndex === 0) {
+            this.suggestionElement.focusSearchForMoreButton();
+            this.suggestionStore.deselectAllSuggestions();
+            this.forceUpdate();
+          } else {
+            if (this.suggestionStore.previousSuggestion()) {
+              ev.preventDefault();
+              ev.stopPropagation();
+              this.onSuggestionSelect();
+            }
+          }
         }
         break;
 
       case KeyCodes.down:
         if (ev.target === this.input.inputElement && this.state.suggestionsVisible) {
-          if (this.suggestionStore.nextSuggestion()) {
-            ev.preventDefault();
-            ev.stopPropagation();
-            this.onSuggestionSelect();
+          if (this.state.moreSuggestionsAvailable && this.suggestionElement.props.searchForMoreText && (this.suggestionStore.currentIndex + 1) === this.suggestionStore.suggestions.length) {
+            this.suggestionElement.focusSearchForMoreButton();
+            this.suggestionStore.deselectAllSuggestions();
+            this.forceUpdate();
+          } else {
+            if (this.suggestionStore.nextSuggestion()) {
+              ev.preventDefault();
+              ev.stopPropagation();
+              this.onSuggestionSelect();
+            }
           }
+
         }
         break;
     }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index c8597db6d009e..0ba9c025fad3a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -184,7 +184,6 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
 
   public _renderLimitedSearch() {
     limitedSearchSuggestionProps.resultsFooter = this._renderFooterText;
-    limitedSearchSuggestionProps.resultsFooterFull = this._renderFooterFullText;
 
     return (
       <CompactPeoplePicker
@@ -260,11 +259,6 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     return <div>No additional results</div>;
   }
 
-  @autobind
-  private _renderFooterFullText(): JSX.Element {
-    return <div>Top 10 results</div>;
-  }
-
   @autobind
   private _onRemoveSuggestion(item: IPersonaProps): void {
     let { peopleList, mostRecentlyUsed: mruState } = this.state;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts
index 84515452e61e6..9357a6d4a6398 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { ISuggestionModel } from './SuggestionsController';
-import { IRenderFunction } from '../../../Utilities';
+import { IRenderFunction, KeyCodes } from '../../../Utilities';
 import { IPersonaProps } from '../../Persona/Persona.Props';
 
 export interface ISuggestionsProps<T> extends React.Props<any> {
@@ -110,6 +110,10 @@ export interface ISuggestionsProps<T> extends React.Props<any> {
    * Screen reader message to read when there are suggestions available.
    */
   suggestionsAvailableAlertText?: string;
+  /**
+   * A function that resets focus to the expected item in the suggestion list
+   */
+  refocusSuggestions?: (keyCode: KeyCodes) => void;
 }
 
 export interface ISuggestionItemProps<T> {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
index 8de508748329b..5be836ef3e4ae 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
@@ -63,6 +63,7 @@
   height: 40px;
   @include ms-text-align(left);
   width: 100%;
+  font-size: 12px;
   &:hover {
       background-color: $ms-color-neutralLight;
       cursor: pointer;
@@ -111,6 +112,7 @@
   @include text-align(left);
   white-space: nowrap;
   line-height: 20px;
+  font-size: 12px;
 
   :global(.ms-Spinner-circle) {
     display: inline-block;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index 93199cc15ff69..2cf7a5f338b6c 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -2,7 +2,9 @@ import * as React from 'react';
 import {
   BaseComponent,
   css,
-  assign
+  autobind,
+  assign,
+  KeyCodes
 } from '../../../Utilities';
 import { CommandButton, IconButton, IButton } from '../../../Button';
 import { Spinner } from '../../../Spinner';
@@ -124,6 +126,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
             className={ css('ms-SearchMore-button', styles.searchMoreButton) }
             iconProps={ { iconName: 'Search' } }
             onClick={ this._getMoreResults.bind(this) }
+            onKeyDown={ this._onKeyDown }
           >
             { searchForMoreText }
           </CommandButton>
@@ -211,4 +214,10 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
     }
   }
 
+  @autobind
+  private _onKeyDown(ev: React.KeyboardEvent<HTMLButtonElement>) {
+    if ((ev.keyCode === KeyCodes.up || ev.keyCode === KeyCodes.down) && typeof this.props.refocusSuggestions === 'function') {
+      this.props.refocusSuggestions(ev.keyCode);
+    }
+  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
index 813e66c02b218..d4a7e23a13c9c 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
@@ -6,7 +6,8 @@ export interface ISuggestionModel<T> {
 export class SuggestionsController<T> {
   public currentIndex: number;
   public currentSuggestion: ISuggestionModel<T> | undefined;
-  private suggestions: ISuggestionModel<T>[];
+  public suggestions: ISuggestionModel<T>[];
+
   constructor() {
     this.suggestions = [];
     this.currentIndex = -1;
@@ -33,10 +34,10 @@ export class SuggestionsController<T> {
   public nextSuggestion(): boolean {
     if (this.suggestions && this.suggestions.length) {
       if (this.currentIndex < (this.suggestions.length - 1)) {
-        this._setSelectedSuggestion(this.currentIndex + 1);
+        this.setSelectedSuggestion(this.currentIndex + 1);
         return true;
       } else if (this.currentIndex === (this.suggestions.length - 1)) {
-        this._setSelectedSuggestion(0);
+        this.setSelectedSuggestion(0);
         return true;
       }
     }
@@ -50,10 +51,10 @@ export class SuggestionsController<T> {
   public previousSuggestion(): boolean {
     if (this.suggestions && this.suggestions.length) {
       if (this.currentIndex > 0) {
-        this._setSelectedSuggestion(this.currentIndex - 1);
+        this.setSelectedSuggestion(this.currentIndex - 1);
         return true;
       } else if (this.currentIndex === 0) {
-        this._setSelectedSuggestion(this.suggestions.length - 1);
+        this.setSelectedSuggestion(this.suggestions.length - 1);
         return true;
       }
     }
@@ -92,7 +93,12 @@ export class SuggestionsController<T> {
     return converted;
   }
 
-  private _setSelectedSuggestion(index: number): void {
+  public deselectAllSuggestions(): void {
+    this.currentIndex = -1;
+    this.suggestions[this.currentIndex].selected = false;
+  }
+
+  public setSelectedSuggestion(index: number): void {
     if (index > this.suggestions.length - 1 || index < 0) {
       this.currentIndex = 0;
       this.currentSuggestion!.selected = false;

From 90e90f0999ed4040061d5bb2a18f7ccedb9755e9 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Thu, 3 Aug 2017 14:12:47 -0700
Subject: [PATCH 0355/1641] Datepicker icon size (#2368)

* updated datepicker icon size

* Change file
---
 .../datepicker-icon-size_2017-08-02-16-51.json        | 11 +++++++++++
 .../src/components/DatePicker/DatePicker.scss         |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/datepicker-icon-size_2017-08-02-16-51.json

diff --git a/common/changes/office-ui-fabric-react/datepicker-icon-size_2017-08-02-16-51.json b/common/changes/office-ui-fabric-react/datepicker-icon-size_2017-08-02-16-51.json
new file mode 100644
index 0000000000000..07322ce1725f5
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/datepicker-icon-size_2017-08-02-16-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Datepicker: updated icon size",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss
index f336ba04fec8e..a7b29764025c0 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss
@@ -8,8 +8,8 @@
 
 @mixin ms-DatePicker-event() {
   color: $ms-color-neutralSecondary;
-  font-size: $ms-icon-size-l;
-  line-height: 20px;
+  font-size: $ms-icon-size-m;
+  line-height: 18px;
   pointer-events: none;
   position: absolute;
   @include ms-right(9px);

From 2c7fbb2c4a9fe78f2c92ebc3f9e58a5d152d3073 Mon Sep 17 00:00:00 2001
From: Eddie Liu <leddie24@gmail.com>
Date: Thu, 3 Aug 2017 15:31:16 -0700
Subject: [PATCH 0356/1641] ScrollablePane and Sticky: New components and
 DetailsList locked header feature (#2259)

* Add starting component

* Add ScrollablePane Page

* Update example

* Fix listing errors

* work in progress, add sticky header

* update scroll component

* work in progress, add sticky header. Sticky top works, need to fix sticky bottom and unstickying

* need to clean up.  Unsticking header elements

* sticky header working

* fix lock header logic

* fix pointer events.  DetailsList locked headers is not preserving state, need to fix

* fix merge conflicts

* wip

* Add toggle example to show state bug

* Work in progress, change to fixed position single component render.  Need to figure out why context scroll container is not showing

* Code cleanup, fix sticky header logic to work with component state

* Code cleanup

* Add sticky class prop

* Add DetailsList example to scrollable pane page

* sticky footer functional

* Fix typings.  Fix componentDidUnmount to willUnmount.

* Fix sticky rendering improperly on window resize

* Rename StickyHeader to Sticky

* Simplify render check for isSticky

* addSticky and removeSticky change to addStickyHeader and removeStickyHeader

* Consolidate notifyHeaders and notifyFooters in one method

* Add missing semi

* Adjust example code.  Revert ExampleCard-example back to original css.  Fix check for sticky footer and notify subscribers.

* Reset DetailsList basic example.  Remove lockedHeader parameter from _onRenderDetailsHeader.

* Fix typescript any error

* Add IStyle typing to Sticky and add change file

* Remove unused scss file

* lockedHeader to isLockedHeader

* Fix transparent bg bug for Firefox

* Change from fixed to absolute position (fixes Edge)

* Fix Edge specific issue.  @TODO Need to fix Sticky footer for Edge

* Fix sticky footer in Edge

* Fix undefined class bug

* Add check for navigator in render

* Change to absolute position rendering

* Rename setDistances to setPlaceholderHeights

* Remove unused properties from ScrollablePane (topHeaderHeight, bottomFooterHeight)

* Move on window resize to private method.  Remove property _stickyContainer and use ref instead.

* - Remove _scrollElement property.
- Change ScrollablePane to be scrollable itself, instead of finding scrollable parent.
- Remove isLockedHeader prop for DetailsList.
- Change DetailsList example to render Sticky with onRenderDetailsHeader

* Reset DetailsList.tsx to master

* - Add overflow hidden on stickyContainer
- Add eventlistener to setPlaceholderHeight on transitionend
- Change default example, add border, box shadow to Sticky element, padding to text
- Adjust stickyContainer top/left position to take into account border

* Remove unused css classes

* Add check to rerender children in componentDidUpdate (Sticky.tsx). Add check for shouldComponentUpdate if states are not matching.

* consolidate remove sticky footer methods

* Consolidate addSticky methods into one.  Remove stickyClassName from render in Sticky

* Add sort stickies for header/footer in componentDidMount for ScrollablePane.
Notify subscribers again in _addSticky method.

* Fix null check errors

* Fix typescript errors

* Fix component context, move context methods to single scrollablePane object

* Fix _sortStickies

* Add stickyPosition prop

* Fix comment for ScrollablePane Props

* == to ===

* == to ===
---
 ...wliu-scrollable-pane_2017-07-19-22-52.json |   11 +
 package-lock.json                             | 2189 +++++++++++++++++
 .../components/ExampleCard/ExampleCard.scss   |    1 +
 .../src/ScrollablePane.ts                     |    1 +
 packages/office-ui-fabric-react/src/Sticky.ts |    1 +
 .../ScrollablePane/ScrollablePane.Props.ts    |   14 +
 .../ScrollablePane/ScrollablePane.scss        |   29 +
 .../ScrollablePane/ScrollablePane.tsx         |  206 ++
 .../ScrollablePane/ScrollablePanePage.tsx     |   69 +
 .../ScrollablePane.Default.Example.tsx        |   56 +
 .../ScrollablePane.DetailsList.Example.tsx    |  132 +
 .../examples/ScrollablePane.Example.scss      |   36 +
 .../src/components/ScrollablePane/index.ts    |    2 +
 .../src/components/Sticky/Sticky.Props.ts     |   25 +
 .../src/components/Sticky/Sticky.scss         |   11 +
 .../src/components/Sticky/Sticky.tsx          |  166 ++
 .../src/components/Sticky/index.ts            |    2 +
 .../src/demo/AppDefinition.tsx                |    6 +
 packages/office-ui-fabric-react/src/index.ts  |    2 +
 19 files changed, 2959 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/v-edwliu-scrollable-pane_2017-07-19-22-52.json
 create mode 100644 package-lock.json
 create mode 100644 packages/office-ui-fabric-react/src/ScrollablePane.ts
 create mode 100644 packages/office-ui-fabric-react/src/Sticky.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.Props.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.DetailsList.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Example.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/ScrollablePane/index.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Sticky/Sticky.Props.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Sticky/Sticky.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Sticky/index.ts

diff --git a/common/changes/office-ui-fabric-react/v-edwliu-scrollable-pane_2017-07-19-22-52.json b/common/changes/office-ui-fabric-react/v-edwliu-scrollable-pane_2017-07-19-22-52.json
new file mode 100644
index 0000000000000..fd3026d2b39d0
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-edwliu-scrollable-pane_2017-07-19-22-52.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add ScrollablePane and Sticky components",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-edwliu@microsoft.com"
+}
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
new file mode 100644
index 0000000000000..a378394bfcf6b
--- /dev/null
+++ b/package-lock.json
@@ -0,0 +1,2189 @@
+{
+  "name": "office-ui-fabric-react-repo",
+  "version": "1.0.0",
+  "lockfileVersion": 1,
+  "dependencies": {
+    "@microsoft/package-deps-hash": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/@microsoft/package-deps-hash/-/package-deps-hash-2.0.2.tgz",
+      "integrity": "sha1-e17NHr2RS2YIvwBUdKnQZ81MmUg=",
+      "dev": true
+    },
+    "@microsoft/rush": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/@microsoft/rush/-/rush-3.0.7.tgz",
+      "integrity": "sha1-3fehsUYJ+0E1Aoej9anz70gVC7w=",
+      "dev": true
+    },
+    "@microsoft/rush-lib": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/@microsoft/rush-lib/-/rush-lib-3.0.7.tgz",
+      "integrity": "sha1-bKgpmEgMMxDKcHqeWW+NXAA+MMQ=",
+      "dev": true
+    },
+    "@microsoft/stream-collator": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/@microsoft/stream-collator/-/stream-collator-2.0.1.tgz",
+      "integrity": "sha1-HGf86/kwM8KdIAwKkPOPQr/mBeY=",
+      "dev": true,
+      "dependencies": {
+        "@types/node": {
+          "version": "6.0.64",
+          "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.64.tgz",
+          "integrity": "sha1-zckBQR9jAeFDff7SO8aPVEQuTcg=",
+          "dev": true
+        }
+      }
+    },
+    "@microsoft/ts-command-line": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/@microsoft/ts-command-line/-/ts-command-line-2.0.1.tgz",
+      "integrity": "sha1-v1nDvt0A4eg/mM8xYki6+eYTEo4=",
+      "dev": true,
+      "dependencies": {
+        "@types/node": {
+          "version": "6.0.64",
+          "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.64.tgz",
+          "integrity": "sha1-zckBQR9jAeFDff7SO8aPVEQuTcg=",
+          "dev": true
+        }
+      }
+    },
+    "@types/es6-collections": {
+      "version": "0.5.29",
+      "resolved": "https://registry.npmjs.org/@types/es6-collections/-/es6-collections-0.5.29.tgz",
+      "integrity": "sha1-7CKDH36N5zY3vxVmD52MomlGmA0=",
+      "dev": true
+    },
+    "@types/fs-extra": {
+      "version": "0.0.37",
+      "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.37.tgz",
+      "integrity": "sha1-GV8RvNmhuX2eQSxrZombVFRxofc=",
+      "dev": true
+    },
+    "@types/node": {
+      "version": "6.0.62",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.62.tgz",
+      "integrity": "sha1-hSIsB3tU8ltXQXu3CLn4d72jf4k=",
+      "dev": true
+    },
+    "@types/z-schema": {
+      "version": "3.16.31",
+      "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.31.tgz",
+      "integrity": "sha1-LrHQCl5Ow/pYx2r94S4YK2bcXBw=",
+      "dev": true
+    },
+    "agent-base": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-2.1.1.tgz",
+      "integrity": "sha1-1t4Q1a9hMtW9aSQn1G/FOFOQlMc=",
+      "dev": true,
+      "dependencies": {
+        "semver": {
+          "version": "5.0.3",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.0.3.tgz",
+          "integrity": "sha1-d0Zt5YnNXTyV8TiqeLxWmjy10no=",
+          "dev": true
+        }
+      }
+    },
+    "ajv": {
+      "version": "4.11.8",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz",
+      "integrity": "sha1-gv+wKynmYq5TvcIK8VlHcGc5xTY=",
+      "dev": true,
+      "optional": true
+    },
+    "ansi-escapes": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz",
+      "integrity": "sha1-06ioOzGapneTZisT52HHkRQiMG4=",
+      "dev": true
+    },
+    "ansi-regex": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
+      "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
+      "dev": true
+    },
+    "ansi-styles": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+      "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=",
+      "dev": true
+    },
+    "archy": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/archy/-/archy-1.0.0.tgz",
+      "integrity": "sha1-+cjBN1fMHde8N5rHeyxipcKGjEA=",
+      "dev": true
+    },
+    "argparse": {
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.9.tgz",
+      "integrity": "sha1-c9g7wmP4bpf4zE9rrhsOkKfSLIY=",
+      "dev": true
+    },
+    "arr-diff": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
+      "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8=",
+      "dev": true
+    },
+    "arr-flatten": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.0.3.tgz",
+      "integrity": "sha1-onTthawIhJtr14R8RYB0XcUa37E=",
+      "dev": true
+    },
+    "array-differ": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/array-differ/-/array-differ-1.0.0.tgz",
+      "integrity": "sha1-7/UuN1gknTO+QCuLuOVkuytdQDE=",
+      "dev": true
+    },
+    "array-uniq": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz",
+      "integrity": "sha1-r2rId6Jcx/dOBYiUdThY39sk/bY=",
+      "dev": true
+    },
+    "array-unique": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
+      "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM=",
+      "dev": true
+    },
+    "asap": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.5.tgz",
+      "integrity": "sha1-UidltQw1EEkOUtfc/ghe+bqWlY8=",
+      "dev": true
+    },
+    "asn1": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.3.tgz",
+      "integrity": "sha1-2sh4dxPJlmhJ/IGAd36+nB3fO4Y=",
+      "dev": true,
+      "optional": true
+    },
+    "assert-plus": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-0.2.0.tgz",
+      "integrity": "sha1-104bh+ev/A24qttwIfP+SBAasjQ=",
+      "dev": true,
+      "optional": true
+    },
+    "asynckit": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
+      "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k=",
+      "dev": true,
+      "optional": true
+    },
+    "aws-sign2": {
+      "version": "0.6.0",
+      "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz",
+      "integrity": "sha1-FDQt0428yU0OW4fXY81jYSwOeU8=",
+      "dev": true,
+      "optional": true
+    },
+    "aws4": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.6.0.tgz",
+      "integrity": "sha1-g+9cqGCysy5KDe7e6MdxudtXRx4=",
+      "dev": true,
+      "optional": true
+    },
+    "balanced-match": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
+      "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c=",
+      "dev": true
+    },
+    "bcrypt-pbkdf": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/bcrypt-pbkdf/-/bcrypt-pbkdf-1.0.1.tgz",
+      "integrity": "sha1-Y7xdy2EzG5K8Bf1SiVPDNGKgb40=",
+      "dev": true,
+      "optional": true
+    },
+    "beeper": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/beeper/-/beeper-1.1.1.tgz",
+      "integrity": "sha1-5tXqjF2tABMEpwsiY4RH9pyy+Ak=",
+      "dev": true
+    },
+    "boom": {
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
+      "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8=",
+      "dev": true
+    },
+    "brace-expansion": {
+      "version": "1.1.8",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.8.tgz",
+      "integrity": "sha1-wHshHHyVLsH479Uad+8NHTmQopI=",
+      "dev": true
+    },
+    "braces": {
+      "version": "1.8.5",
+      "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
+      "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc=",
+      "dev": true
+    },
+    "builtin-modules": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz",
+      "integrity": "sha1-Jw8HbFpywC9bZaR9+Uxf46J4iS8=",
+      "dev": true
+    },
+    "builtins": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/builtins/-/builtins-1.0.3.tgz",
+      "integrity": "sha1-y5T662HIaWRR2zZTThQi+U8K7og=",
+      "dev": true
+    },
+    "camelcase": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
+      "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo=",
+      "dev": true
+    },
+    "caseless": {
+      "version": "0.12.0",
+      "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz",
+      "integrity": "sha1-G2gcIf+EAzyCZUMJBolCDRhxUdw=",
+      "dev": true,
+      "optional": true
+    },
+    "chalk": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+      "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+      "dev": true
+    },
+    "cli-cursor": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-1.0.2.tgz",
+      "integrity": "sha1-ZNo/fValRBLll5S9Ytw1KV6PKYc=",
+      "dev": true
+    },
+    "cli-width": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-2.1.0.tgz",
+      "integrity": "sha1-sjTKIJsp72b8UY2bmNWEewDt8Ao=",
+      "dev": true
+    },
+    "cliui": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
+      "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0=",
+      "dev": true
+    },
+    "clone": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.2.tgz",
+      "integrity": "sha1-Jgt6meux7f4kdTgXX3gyQ8sZ0Uk=",
+      "dev": true
+    },
+    "clone-stats": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-0.0.1.tgz",
+      "integrity": "sha1-uI+UqCzzi4eR1YBG6kAprYjKmdE=",
+      "dev": true
+    },
+    "co": {
+      "version": "4.6.0",
+      "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
+      "integrity": "sha1-bqa989hTrlTMuOR7+gvz+QMfsYQ=",
+      "dev": true,
+      "optional": true
+    },
+    "code-point-at": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz",
+      "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c=",
+      "dev": true
+    },
+    "colors": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/colors/-/colors-1.1.2.tgz",
+      "integrity": "sha1-FopHAXVran9RoSzgyXv6KMCE7WM=",
+      "dev": true
+    },
+    "combined-stream": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz",
+      "integrity": "sha1-k4NwpXtKUd6ix3wV1cX9+JUWQAk=",
+      "dev": true
+    },
+    "commander": {
+      "version": "2.9.0",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
+      "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q=",
+      "dev": true,
+      "optional": true
+    },
+    "concat-map": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
+      "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=",
+      "dev": true
+    },
+    "concat-stream": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.0.tgz",
+      "integrity": "sha1-CqxmL9Ur54lk1VMvaUeE5wEQrPc=",
+      "dev": true
+    },
+    "core-util-is": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
+      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=",
+      "dev": true
+    },
+    "cryptiles": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz",
+      "integrity": "sha1-O9/s3GCBR8HGcgL6KR59ylnqo7g=",
+      "dev": true,
+      "optional": true
+    },
+    "dashdash": {
+      "version": "1.14.1",
+      "resolved": "https://registry.npmjs.org/dashdash/-/dashdash-1.14.1.tgz",
+      "integrity": "sha1-hTz6D3y+L+1d4gMmuN1YEDX24vA=",
+      "dev": true,
+      "optional": true,
+      "dependencies": {
+        "assert-plus": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
+          "dev": true,
+          "optional": true
+        }
+      }
+    },
+    "dateformat": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-2.0.0.tgz",
+      "integrity": "sha1-J0Pjq7XD/CRi5SfcpEXgTp9N7hc=",
+      "dev": true
+    },
+    "debug": {
+      "version": "2.6.8",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
+      "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw=",
+      "dev": true
+    },
+    "debuglog": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/debuglog/-/debuglog-1.0.1.tgz",
+      "integrity": "sha1-qiT/uaw9+aI1GDfPstJ5NgzXhJI=",
+      "dev": true
+    },
+    "decamelize": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
+      "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA=",
+      "dev": true
+    },
+    "defaults": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.3.tgz",
+      "integrity": "sha1-xlYFHpgX2f8I7YgUd/P+QBnz730=",
+      "dev": true
+    },
+    "delayed-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
+      "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk=",
+      "dev": true
+    },
+    "deprecated": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/deprecated/-/deprecated-0.0.1.tgz",
+      "integrity": "sha1-+cmvVGSvoeepcUWKi97yqpTVuxk=",
+      "dev": true
+    },
+    "detect-file": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/detect-file/-/detect-file-0.1.0.tgz",
+      "integrity": "sha1-STXe39lIhkjgBrASlWbpOGcR6mM=",
+      "dev": true
+    },
+    "dezalgo": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/dezalgo/-/dezalgo-1.0.3.tgz",
+      "integrity": "sha1-f3Qt4Gb8dIvI24IFad3c5Jvw1FY=",
+      "dev": true
+    },
+    "duplexer2": {
+      "version": "0.0.2",
+      "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.0.2.tgz",
+      "integrity": "sha1-xhTc9n4vsUmVqRcR5aYX6KYKMds=",
+      "dev": true,
+      "dependencies": {
+        "isarray": {
+          "version": "0.0.1",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
+          "dev": true
+        },
+        "readable-stream": {
+          "version": "1.1.14",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
+          "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk=",
+          "dev": true
+        },
+        "string_decoder": {
+          "version": "0.10.31",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=",
+          "dev": true
+        }
+      }
+    },
+    "ecc-jsbn": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.1.tgz",
+      "integrity": "sha1-D8c6ntXw1Tw4GTOYUj735UN3dQU=",
+      "dev": true,
+      "optional": true
+    },
+    "end-of-stream": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-0.1.5.tgz",
+      "integrity": "sha1-jhdyBsPICDfYVjLouTWd/osvbq8=",
+      "dev": true,
+      "dependencies": {
+        "once": {
+          "version": "1.3.3",
+          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz",
+          "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA=",
+          "dev": true
+        }
+      }
+    },
+    "error-ex": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.1.tgz",
+      "integrity": "sha1-+FWobOYa3E6GIcPNoh56dhLDqNw=",
+      "dev": true
+    },
+    "escape-string-regexp": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
+      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
+      "dev": true
+    },
+    "exit-hook": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/exit-hook/-/exit-hook-1.1.1.tgz",
+      "integrity": "sha1-8FyiM7SMBdVP/wd2XfhQfpXAL/g=",
+      "dev": true
+    },
+    "expand-brackets": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
+      "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s=",
+      "dev": true
+    },
+    "expand-range": {
+      "version": "1.8.2",
+      "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz",
+      "integrity": "sha1-opnv/TNf4nIeuujiV+x5ZE/IUzc=",
+      "dev": true
+    },
+    "expand-tilde": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-1.2.2.tgz",
+      "integrity": "sha1-C4HrqJflo9MdHD0QL48BRB5VlEk=",
+      "dev": true
+    },
+    "extend": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz",
+      "integrity": "sha1-p1Xqe8Gt/MWjHOfnYtuq3F5jZEQ=",
+      "dev": true
+    },
+    "external-editor": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/external-editor/-/external-editor-1.1.1.tgz",
+      "integrity": "sha1-Etew24UPf/fnCBuvQAVwAGDEYAs=",
+      "dev": true
+    },
+    "extglob": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
+      "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE=",
+      "dev": true
+    },
+    "extsprintf": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.0.2.tgz",
+      "integrity": "sha1-4QgOBljjALBilJkMxw4VAiNf1VA=",
+      "dev": true
+    },
+    "fancy-log": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/fancy-log/-/fancy-log-1.3.0.tgz",
+      "integrity": "sha1-Rb4X0Cu5kX1gzP/UmVyZnmyMmUg=",
+      "dev": true
+    },
+    "figures": {
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz",
+      "integrity": "sha1-y+Hjr/zxzUS4DK3+0o3Hk6lwHS4=",
+      "dev": true
+    },
+    "filename-regex": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz",
+      "integrity": "sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY=",
+      "dev": true
+    },
+    "fill-range": {
+      "version": "2.2.3",
+      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz",
+      "integrity": "sha1-ULd9/X5Gm8dJJHCWNpn+eoSFpyM=",
+      "dev": true
+    },
+    "find-index": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
+      "integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ=",
+      "dev": true
+    },
+    "find-up": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
+      "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8=",
+      "dev": true
+    },
+    "findup-sync": {
+      "version": "0.4.3",
+      "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.4.3.tgz",
+      "integrity": "sha1-QAQ5Kee8YK3wt/SCfExudaDeyhI=",
+      "dev": true
+    },
+    "fined": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/fined/-/fined-1.0.2.tgz",
+      "integrity": "sha1-WyhCS3YNdZiWC374SA3/itNmDpc=",
+      "dev": true
+    },
+    "first-chunk-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/first-chunk-stream/-/first-chunk-stream-1.0.0.tgz",
+      "integrity": "sha1-Wb+1DNkF9g18OUzT2ayqtOatk04=",
+      "dev": true
+    },
+    "flagged-respawn": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/flagged-respawn/-/flagged-respawn-0.3.2.tgz",
+      "integrity": "sha1-/xke3c1wiKZ1smEP/8l2vpuAdLU=",
+      "dev": true
+    },
+    "follow-redirects": {
+      "version": "0.0.7",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-0.0.7.tgz",
+      "integrity": "sha1-NLkLqyqRGqNHVx2pDyK9NuzYqRk=",
+      "dev": true
+    },
+    "for-in": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
+      "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA=",
+      "dev": true
+    },
+    "for-own": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz",
+      "integrity": "sha1-UmXGgaTylNq78XyVCbZ2OqhFEM4=",
+      "dev": true
+    },
+    "forever-agent": {
+      "version": "0.6.1",
+      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
+      "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE=",
+      "dev": true,
+      "optional": true
+    },
+    "form-data": {
+      "version": "2.1.4",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
+      "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE=",
+      "dev": true,
+      "optional": true
+    },
+    "fs-exists-sync": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/fs-exists-sync/-/fs-exists-sync-0.1.0.tgz",
+      "integrity": "sha1-mC1ok6+RjnLQjeyehnP/K1qNat0=",
+      "dev": true
+    },
+    "fs-extra": {
+      "version": "0.26.7",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz",
+      "integrity": "sha1-muH92UiXeY7at20JGM9C0MMYT6k=",
+      "dev": true
+    },
+    "fs.realpath": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
+      "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=",
+      "dev": true
+    },
+    "gaze": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/gaze/-/gaze-0.5.2.tgz",
+      "integrity": "sha1-QLcJU30k0dRXZ9takIaJ3+aaxE8=",
+      "dev": true
+    },
+    "get-caller-file": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz",
+      "integrity": "sha1-9wLmMSfn4jHBYKgMFVSstw1QR+U=",
+      "dev": true
+    },
+    "getpass": {
+      "version": "0.1.7",
+      "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
+      "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo=",
+      "dev": true,
+      "optional": true,
+      "dependencies": {
+        "assert-plus": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
+          "dev": true,
+          "optional": true
+        }
+      }
+    },
+    "git-repo-info": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/git-repo-info/-/git-repo-info-1.1.4.tgz",
+      "integrity": "sha1-E0n6OIinZh6h/2OgR8L/Q7PglgI=",
+      "dev": true
+    },
+    "github": {
+      "version": "7.3.2",
+      "resolved": "https://registry.npmjs.org/github/-/github-7.3.2.tgz",
+      "integrity": "sha1-/hDN5pZDUsXZHhGnYW0m1f+2+Hs=",
+      "dev": true
+    },
+    "glob": {
+      "version": "7.0.6",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-7.0.6.tgz",
+      "integrity": "sha1-IRuvr0nlJbjNkyYNFKsTYVKz9Xo=",
+      "dev": true
+    },
+    "glob-base": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz",
+      "integrity": "sha1-27Fk9iIbHAscz4Kuoyi0l98Oo8Q=",
+      "dev": true
+    },
+    "glob-escape": {
+      "version": "0.0.2",
+      "resolved": "https://registry.npmjs.org/glob-escape/-/glob-escape-0.0.2.tgz",
+      "integrity": "sha1-nCf3gh7RwTd1gvPv2VWOP2dWKO0=",
+      "dev": true
+    },
+    "glob-parent": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz",
+      "integrity": "sha1-gTg9ctsFT8zPUzbaqQLxgvbtuyg=",
+      "dev": true
+    },
+    "glob-stream": {
+      "version": "3.1.18",
+      "resolved": "https://registry.npmjs.org/glob-stream/-/glob-stream-3.1.18.tgz",
+      "integrity": "sha1-kXCl8St5Awb9/lmPMT+PeVT9FDs=",
+      "dev": true,
+      "dependencies": {
+        "glob": {
+          "version": "4.5.3",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-4.5.3.tgz",
+          "integrity": "sha1-xstz0yJsHv7wTePFbQEvAzd+4V8=",
+          "dev": true
+        },
+        "isarray": {
+          "version": "0.0.1",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
+          "dev": true
+        },
+        "minimatch": {
+          "version": "2.0.10",
+          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-2.0.10.tgz",
+          "integrity": "sha1-jQh8OcazjAAbl/ynzm0OHoCvusc=",
+          "dev": true
+        },
+        "readable-stream": {
+          "version": "1.0.34",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=",
+          "dev": true
+        },
+        "string_decoder": {
+          "version": "0.10.31",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=",
+          "dev": true
+        },
+        "through2": {
+          "version": "0.6.5",
+          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
+          "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg=",
+          "dev": true
+        }
+      }
+    },
+    "glob-watcher": {
+      "version": "0.0.6",
+      "resolved": "https://registry.npmjs.org/glob-watcher/-/glob-watcher-0.0.6.tgz",
+      "integrity": "sha1-uVtKjfdLOcgymLDAXJeLTZo7cQs=",
+      "dev": true
+    },
+    "glob2base": {
+      "version": "0.0.12",
+      "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz",
+      "integrity": "sha1-nUGbPijxLoOjYhZKJ3BVkiycDVY=",
+      "dev": true
+    },
+    "global-modules": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-0.2.3.tgz",
+      "integrity": "sha1-6lo77ULG1s6ZWk+KEmm12uIjgo0=",
+      "dev": true
+    },
+    "global-prefix": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-0.1.5.tgz",
+      "integrity": "sha1-jTvGuNo8qBEqFg2NSW/wRiv+948=",
+      "dev": true
+    },
+    "globule": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/globule/-/globule-0.1.0.tgz",
+      "integrity": "sha1-2cjt3h2nnRJaFRt5UzuXhnY0auU=",
+      "dev": true,
+      "dependencies": {
+        "glob": {
+          "version": "3.1.21",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-3.1.21.tgz",
+          "integrity": "sha1-0p4KBV3qUTj00H7UDomC6DwgZs0=",
+          "dev": true
+        },
+        "graceful-fs": {
+          "version": "1.2.3",
+          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-1.2.3.tgz",
+          "integrity": "sha1-FaSAaldUfLLS2/J/QuiajDRRs2Q=",
+          "dev": true
+        },
+        "inherits": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/inherits/-/inherits-1.0.2.tgz",
+          "integrity": "sha1-ykMJ2t7mtUzAuNJH6NfHoJdb3Js=",
+          "dev": true
+        },
+        "lodash": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-1.0.2.tgz",
+          "integrity": "sha1-j1dWDIO1n8JwvT1WG2kAQ0MOJVE=",
+          "dev": true
+        },
+        "minimatch": {
+          "version": "0.2.14",
+          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.2.14.tgz",
+          "integrity": "sha1-x054BXT2PG+aCQ6Q775u9TpqdWo=",
+          "dev": true
+        }
+      }
+    },
+    "glogg": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/glogg/-/glogg-1.0.0.tgz",
+      "integrity": "sha1-f+DxmfV6yQbPUS/urY+Q7kooT8U=",
+      "dev": true
+    },
+    "graceful-fs": {
+      "version": "4.1.11",
+      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz",
+      "integrity": "sha1-Dovf5NHduIVNZOBOp8AOKgJuVlg=",
+      "dev": true
+    },
+    "graceful-readlink": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz",
+      "integrity": "sha1-TK+tdrxi8C+gObL5Tpo906ORpyU=",
+      "dev": true,
+      "optional": true
+    },
+    "gulp": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/gulp/-/gulp-3.9.1.tgz",
+      "integrity": "sha1-VxzkWSjdQK9lFPxAEYZgFsE4RbQ=",
+      "dev": true,
+      "dependencies": {
+        "semver": {
+          "version": "4.3.6",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz",
+          "integrity": "sha1-MAvG4OhjdPe6YQaLWx7NV/xlMto=",
+          "dev": true
+        }
+      }
+    },
+    "gulp-util": {
+      "version": "3.0.8",
+      "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.8.tgz",
+      "integrity": "sha1-AFTh50RQLifATBh8PsxQXdVLu08=",
+      "dev": true,
+      "dependencies": {
+        "object-assign": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz",
+          "integrity": "sha1-m+3VygiXlJvKR+f/QIBi1Un1h/I=",
+          "dev": true
+        }
+      }
+    },
+    "gulplog": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/gulplog/-/gulplog-1.0.0.tgz",
+      "integrity": "sha1-4oxNRdBey77YGDY86PnFkmIp/+U=",
+      "dev": true
+    },
+    "har-schema": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-1.0.5.tgz",
+      "integrity": "sha1-0mMTX0MwfALGAq/I/pWXDAFRNp4=",
+      "dev": true,
+      "optional": true
+    },
+    "har-validator": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz",
+      "integrity": "sha1-M0gdDxu/9gDdID11gSpqX7oALio=",
+      "dev": true,
+      "optional": true
+    },
+    "has-ansi": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz",
+      "integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE=",
+      "dev": true
+    },
+    "has-gulplog": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/has-gulplog/-/has-gulplog-0.1.0.tgz",
+      "integrity": "sha1-ZBTIKRNpfaUVkDl9r7EvIpZ4Ec4=",
+      "dev": true
+    },
+    "hawk": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz",
+      "integrity": "sha1-B4REvXwWQLD+VA0sm3PVlnjo4cQ=",
+      "dev": true,
+      "optional": true
+    },
+    "hoek": {
+      "version": "2.16.3",
+      "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz",
+      "integrity": "sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0=",
+      "dev": true
+    },
+    "homedir-polyfill": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.1.tgz",
+      "integrity": "sha1-TCu8inWJmP7r9e1oWA921GdotLw=",
+      "dev": true
+    },
+    "hosted-git-info": {
+      "version": "2.4.2",
+      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.4.2.tgz",
+      "integrity": "sha1-AHa59GonBQbduq6lZJaJdGBhKmc=",
+      "dev": true
+    },
+    "http-signature": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz",
+      "integrity": "sha1-33LiZwZs0Kxn+3at+OE0qPvPkb8=",
+      "dev": true,
+      "optional": true
+    },
+    "https-proxy-agent": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-1.0.0.tgz",
+      "integrity": "sha1-NffabEjOTdv6JkiRrFk+5f+GceY=",
+      "dev": true
+    },
+    "inflight": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
+      "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=",
+      "dev": true
+    },
+    "inherits": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
+      "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=",
+      "dev": true
+    },
+    "ini": {
+      "version": "1.3.4",
+      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.4.tgz",
+      "integrity": "sha1-BTfLedr1m1mhpRff9wbIbsA5Fi4=",
+      "dev": true
+    },
+    "inquirer": {
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-1.2.3.tgz",
+      "integrity": "sha1-TexvMvN+97sLLtPx0aXD9UUHSRg=",
+      "dev": true
+    },
+    "interpret": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.0.3.tgz",
+      "integrity": "sha1-y8NcYu7uc/Gat7EKgBURQBr8D5A=",
+      "dev": true
+    },
+    "invert-kv": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/invert-kv/-/invert-kv-1.0.0.tgz",
+      "integrity": "sha1-EEqOSqym09jNFXqO+L+rLXo//bY=",
+      "dev": true
+    },
+    "is-absolute": {
+      "version": "0.2.6",
+      "resolved": "https://registry.npmjs.org/is-absolute/-/is-absolute-0.2.6.tgz",
+      "integrity": "sha1-IN5p89uULvLYe5wto28XIjWxtes=",
+      "dev": true
+    },
+    "is-arrayish": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
+      "integrity": "sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0=",
+      "dev": true
+    },
+    "is-buffer": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.5.tgz",
+      "integrity": "sha1-Hzsm72E7IUuIy8ojzGwB2Hlh7sw=",
+      "dev": true
+    },
+    "is-builtin-module": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-1.0.0.tgz",
+      "integrity": "sha1-VAVy0096wxGfj3bDDLwbHgN6/74=",
+      "dev": true
+    },
+    "is-dotfile": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/is-dotfile/-/is-dotfile-1.0.3.tgz",
+      "integrity": "sha1-pqLzL/0t+wT1yiXs0Pa4PPeYoeE=",
+      "dev": true
+    },
+    "is-equal-shallow": {
+      "version": "0.1.3",
+      "resolved": "https://registry.npmjs.org/is-equal-shallow/-/is-equal-shallow-0.1.3.tgz",
+      "integrity": "sha1-IjgJj8Ih3gvPpdnqxMRdY4qhxTQ=",
+      "dev": true
+    },
+    "is-extendable": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
+      "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=",
+      "dev": true
+    },
+    "is-extglob": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
+      "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA=",
+      "dev": true
+    },
+    "is-fullwidth-code-point": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
+      "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
+      "dev": true
+    },
+    "is-glob": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz",
+      "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM=",
+      "dev": true
+    },
+    "is-number": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz",
+      "integrity": "sha1-Afy7s5NGOlSPL0ZszhbezknbkI8=",
+      "dev": true
+    },
+    "is-posix-bracket": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz",
+      "integrity": "sha1-MzTceXdDaOkvAW5vvAqI9c1ua8Q=",
+      "dev": true
+    },
+    "is-primitive": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/is-primitive/-/is-primitive-2.0.0.tgz",
+      "integrity": "sha1-IHurkWOEmcB7Kt8kCkGochADRXU=",
+      "dev": true
+    },
+    "is-promise": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-promise/-/is-promise-2.1.0.tgz",
+      "integrity": "sha1-eaKp7OfwlugPNtKy87wWwf9L8/o=",
+      "dev": true
+    },
+    "is-relative": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/is-relative/-/is-relative-0.2.1.tgz",
+      "integrity": "sha1-0n9MfVFtF1+2ENuEu+7yPDvJeqU=",
+      "dev": true
+    },
+    "is-typedarray": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz",
+      "integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo=",
+      "dev": true,
+      "optional": true
+    },
+    "is-unc-path": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/is-unc-path/-/is-unc-path-0.1.2.tgz",
+      "integrity": "sha1-arBTpyVzwQJQ/0FqOBTDUXivObk=",
+      "dev": true
+    },
+    "is-utf8": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz",
+      "integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI=",
+      "dev": true
+    },
+    "is-windows": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-0.2.0.tgz",
+      "integrity": "sha1-3hqm1j6indJIc3tp8f+LgALSEIw=",
+      "dev": true
+    },
+    "isarray": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+      "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=",
+      "dev": true
+    },
+    "isexe": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
+      "integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA=",
+      "dev": true
+    },
+    "isobject": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
+      "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk=",
+      "dev": true
+    },
+    "isstream": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz",
+      "integrity": "sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo=",
+      "dev": true,
+      "optional": true
+    },
+    "jju": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/jju/-/jju-1.3.0.tgz",
+      "integrity": "sha1-2t2e8BkkvHKLA/L3l5vb1i96Kqo=",
+      "dev": true
+    },
+    "jsbn": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-0.1.1.tgz",
+      "integrity": "sha1-peZUwuWi3rXyAdls77yoDA7y9RM=",
+      "dev": true,
+      "optional": true
+    },
+    "json-parse-helpfulerror": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/json-parse-helpfulerror/-/json-parse-helpfulerror-1.0.3.tgz",
+      "integrity": "sha1-E/FM4C7tTpgSl7ZOueO5MuLdE9w=",
+      "dev": true
+    },
+    "json-schema": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz",
+      "integrity": "sha1-tIDIkuWaLwWVTOcnvT8qTogvnhM=",
+      "dev": true,
+      "optional": true
+    },
+    "json-stable-stringify": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz",
+      "integrity": "sha1-mnWdOcXy/1A/1TAGRu1EX4jE+a8=",
+      "dev": true,
+      "optional": true
+    },
+    "json-stringify-safe": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz",
+      "integrity": "sha1-Epai1Y/UXxmg9s4B1lcB4sc1tus=",
+      "dev": true,
+      "optional": true
+    },
+    "jsonfile": {
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz",
+      "integrity": "sha1-NzaitCi4e72gzIO1P6PWM6NcKug=",
+      "dev": true
+    },
+    "jsonify": {
+      "version": "0.0.0",
+      "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz",
+      "integrity": "sha1-LHS27kHZPKUbe1qu6PUDYx0lKnM=",
+      "dev": true,
+      "optional": true
+    },
+    "jsprim": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.0.tgz",
+      "integrity": "sha1-o7h+QCmNjDgFUtjMdiigu5WiKRg=",
+      "dev": true,
+      "optional": true,
+      "dependencies": {
+        "assert-plus": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
+          "dev": true,
+          "optional": true
+        }
+      }
+    },
+    "kind-of": {
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+      "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+      "dev": true
+    },
+    "klaw": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/klaw/-/klaw-1.3.1.tgz",
+      "integrity": "sha1-QIhDO0azsbolnXh4XY6W9zugJDk=",
+      "dev": true
+    },
+    "lcid": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/lcid/-/lcid-1.0.0.tgz",
+      "integrity": "sha1-MIrMr6C8SDo4Z7S28rlQYlHRuDU=",
+      "dev": true
+    },
+    "liftoff": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/liftoff/-/liftoff-2.3.0.tgz",
+      "integrity": "sha1-qY8v9nGD2Lp8+soQVIvX/wVQs4U=",
+      "dev": true
+    },
+    "load-json-file": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
+      "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
+      "dev": true,
+      "dependencies": {
+        "strip-bom": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4=",
+          "dev": true
+        }
+      }
+    },
+    "lodash": {
+      "version": "4.15.0",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.15.0.tgz",
+      "integrity": "sha1-MWI5HY8BQKoiz49rPDTWt/Y9Oqk=",
+      "dev": true
+    },
+    "lodash._basecopy": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz",
+      "integrity": "sha1-jaDmqHbPNEwK2KVIghEd08XHyjY=",
+      "dev": true
+    },
+    "lodash._basetostring": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/lodash._basetostring/-/lodash._basetostring-3.0.1.tgz",
+      "integrity": "sha1-0YYdh3+CSlL2aYMtyvPuFVZqB9U=",
+      "dev": true
+    },
+    "lodash._basevalues": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._basevalues/-/lodash._basevalues-3.0.0.tgz",
+      "integrity": "sha1-W3dXYoAr3j0yl1A+JjAIIP32Ybc=",
+      "dev": true
+    },
+    "lodash._getnative": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/lodash._getnative/-/lodash._getnative-3.9.1.tgz",
+      "integrity": "sha1-VwvH3t5G1hzc3mh9ZdPuy6o6r/U=",
+      "dev": true
+    },
+    "lodash._isiterateecall": {
+      "version": "3.0.9",
+      "resolved": "https://registry.npmjs.org/lodash._isiterateecall/-/lodash._isiterateecall-3.0.9.tgz",
+      "integrity": "sha1-UgOte6Ql+uhCRg5pbbnPPmqsBXw=",
+      "dev": true
+    },
+    "lodash._reescape": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._reescape/-/lodash._reescape-3.0.0.tgz",
+      "integrity": "sha1-Kx1vXf4HyKNVdT5fJ/rH8c3hYWo=",
+      "dev": true
+    },
+    "lodash._reevaluate": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._reevaluate/-/lodash._reevaluate-3.0.0.tgz",
+      "integrity": "sha1-WLx0xAZklTrgsSTYBpltrKQx4u0=",
+      "dev": true
+    },
+    "lodash._reinterpolate": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz",
+      "integrity": "sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0=",
+      "dev": true
+    },
+    "lodash._root": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/lodash._root/-/lodash._root-3.0.1.tgz",
+      "integrity": "sha1-+6HEUkwZ7ppfgTa0YJ8BfPTe1pI=",
+      "dev": true
+    },
+    "lodash.assignwith": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/lodash.assignwith/-/lodash.assignwith-4.2.0.tgz",
+      "integrity": "sha1-EnqX8CrcQXUalU0ksN4X4QDgOOs=",
+      "dev": true
+    },
+    "lodash.escape": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-3.2.0.tgz",
+      "integrity": "sha1-mV7g3BjBtIzJLv+ucaEKq1tIdpg=",
+      "dev": true
+    },
+    "lodash.get": {
+      "version": "4.4.2",
+      "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
+      "integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk=",
+      "dev": true
+    },
+    "lodash.isarguments": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz",
+      "integrity": "sha1-L1c9hcaiQon/AGY7SRwdM4/zRYo=",
+      "dev": true
+    },
+    "lodash.isarray": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz",
+      "integrity": "sha1-eeTriMNqgSKvhvhEqpvNhRtfu1U=",
+      "dev": true
+    },
+    "lodash.isempty": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/lodash.isempty/-/lodash.isempty-4.4.0.tgz",
+      "integrity": "sha1-b4bL7di+TsmHvpqvM8loTbGzHn4=",
+      "dev": true
+    },
+    "lodash.isplainobject": {
+      "version": "4.0.6",
+      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
+      "integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs=",
+      "dev": true
+    },
+    "lodash.isstring": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/lodash.isstring/-/lodash.isstring-4.0.1.tgz",
+      "integrity": "sha1-1SfftUVuynzJu5XV2ur4i6VKVFE=",
+      "dev": true
+    },
+    "lodash.keys": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz",
+      "integrity": "sha1-TbwEcrFWvlCgsoaFXRvQsMZWCYo=",
+      "dev": true
+    },
+    "lodash.mapvalues": {
+      "version": "4.6.0",
+      "resolved": "https://registry.npmjs.org/lodash.mapvalues/-/lodash.mapvalues-4.6.0.tgz",
+      "integrity": "sha1-G6+lAF3p3W9PJmaMMMo3IwzJaJw=",
+      "dev": true
+    },
+    "lodash.pick": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz",
+      "integrity": "sha1-UvBWEP/53tQiYRRB7R/BI6AwAbM=",
+      "dev": true
+    },
+    "lodash.restparam": {
+      "version": "3.6.1",
+      "resolved": "https://registry.npmjs.org/lodash.restparam/-/lodash.restparam-3.6.1.tgz",
+      "integrity": "sha1-k2pOMJ7zMKdkXtQUWYbIWuWyCAU=",
+      "dev": true
+    },
+    "lodash.template": {
+      "version": "3.6.2",
+      "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-3.6.2.tgz",
+      "integrity": "sha1-+M3sxhaaJVvpCYrosMU9N4kx0U8=",
+      "dev": true
+    },
+    "lodash.templatesettings": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-3.1.1.tgz",
+      "integrity": "sha1-+zB4RHU7Zrnxr6VOJix0UwfbqOU=",
+      "dev": true
+    },
+    "lru-cache": {
+      "version": "2.7.3",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.7.3.tgz",
+      "integrity": "sha1-bUUk6LlV+V1PW1iFHOId1y+06VI=",
+      "dev": true
+    },
+    "map-cache": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz",
+      "integrity": "sha1-wyq9C9ZSXZsFFkW7TyasXcmKDb8=",
+      "dev": true
+    },
+    "micromatch": {
+      "version": "2.3.11",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
+      "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU=",
+      "dev": true
+    },
+    "mime": {
+      "version": "1.3.6",
+      "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.6.tgz",
+      "integrity": "sha1-WR2E02U6awtKO5343lqoEI5y5eA=",
+      "dev": true
+    },
+    "mime-db": {
+      "version": "1.27.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.27.0.tgz",
+      "integrity": "sha1-gg9XIpa70g7CXtVeW13oaeVDbrE=",
+      "dev": true
+    },
+    "mime-types": {
+      "version": "2.1.15",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.15.tgz",
+      "integrity": "sha1-pOv1BkCUVpI3uM9wBGd20J/JKu0=",
+      "dev": true
+    },
+    "minimatch": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
+      "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==",
+      "dev": true
+    },
+    "minimist": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
+      "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=",
+      "dev": true
+    },
+    "mkdirp": {
+      "version": "0.5.1",
+      "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
+      "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
+      "dev": true,
+      "dependencies": {
+        "minimist": {
+          "version": "0.0.8",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
+          "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0=",
+          "dev": true
+        }
+      }
+    },
+    "ms": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+      "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
+      "dev": true
+    },
+    "multipipe": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/multipipe/-/multipipe-0.1.2.tgz",
+      "integrity": "sha1-Ko8t33Du1WTf8tV/HhoTfZ8FB4s=",
+      "dev": true
+    },
+    "mute-stream": {
+      "version": "0.0.6",
+      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.6.tgz",
+      "integrity": "sha1-SJYrGeFp/R38JAs/HnMXYnu8R9s=",
+      "dev": true
+    },
+    "natives": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/natives/-/natives-1.1.0.tgz",
+      "integrity": "sha1-6f+EFBimsux6SV6TmYT3jxY+bjE=",
+      "dev": true
+    },
+    "netrc": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/netrc/-/netrc-0.1.4.tgz",
+      "integrity": "sha1-a+lPysqNd63gqWcNxGCRTJRHJEQ=",
+      "dev": true
+    },
+    "normalize-package-data": {
+      "version": "2.3.8",
+      "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.3.8.tgz",
+      "integrity": "sha1-2Bntoqne29H/pWPqQHHZNngilbs=",
+      "dev": true
+    },
+    "normalize-path": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-2.1.1.tgz",
+      "integrity": "sha1-GrKLVW4Zg2Oowab35vogE3/mrtk=",
+      "dev": true
+    },
+    "number-is-nan": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz",
+      "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=",
+      "dev": true
+    },
+    "oauth-sign": {
+      "version": "0.8.2",
+      "resolved": "https://registry.npmjs.org/oauth-sign/-/oauth-sign-0.8.2.tgz",
+      "integrity": "sha1-Rqarfwrq2N6unsBWV4C31O/rnUM=",
+      "dev": true,
+      "optional": true
+    },
+    "object-assign": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
+      "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=",
+      "dev": true
+    },
+    "object.omit": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/object.omit/-/object.omit-2.0.1.tgz",
+      "integrity": "sha1-Gpx0SCnznbuFjHbKNXmuKlTr0fo=",
+      "dev": true
+    },
+    "once": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
+      "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
+      "dev": true
+    },
+    "onetime": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/onetime/-/onetime-1.1.0.tgz",
+      "integrity": "sha1-ofeDj4MUxRbwXs78vEzP4EtO14k=",
+      "dev": true
+    },
+    "orchestrator": {
+      "version": "0.3.8",
+      "resolved": "https://registry.npmjs.org/orchestrator/-/orchestrator-0.3.8.tgz",
+      "integrity": "sha1-FOfp4nZPcxX7rBhOUGx6pt+UrX4=",
+      "dev": true
+    },
+    "ordered-read-streams": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.1.0.tgz",
+      "integrity": "sha1-/VZamvjrRHO6abbtijQ1LLVS8SY=",
+      "dev": true
+    },
+    "os-homedir": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
+      "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M=",
+      "dev": true
+    },
+    "os-locale": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
+      "integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk=",
+      "dev": true
+    },
+    "os-shim": {
+      "version": "0.1.3",
+      "resolved": "https://registry.npmjs.org/os-shim/-/os-shim-0.1.3.tgz",
+      "integrity": "sha1-a2LDeRz3kJ6jXtRuF2WLtBfLORc=",
+      "dev": true
+    },
+    "os-tmpdir": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
+      "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ=",
+      "dev": true
+    },
+    "parse-filepath": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/parse-filepath/-/parse-filepath-1.0.1.tgz",
+      "integrity": "sha1-FZ1hVdQ5BNFsEO9piRHaHpGWm3M=",
+      "dev": true
+    },
+    "parse-glob": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/parse-glob/-/parse-glob-3.0.4.tgz",
+      "integrity": "sha1-ssN2z7EfNVE7rdFz7wu246OIORw=",
+      "dev": true
+    },
+    "parse-json": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz",
+      "integrity": "sha1-9ID0BDTvgHQfhGkJn43qGPVaTck=",
+      "dev": true
+    },
+    "parse-passwd": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/parse-passwd/-/parse-passwd-1.0.0.tgz",
+      "integrity": "sha1-bVuTSkVpk7I9N/QKOC1vFmao5cY=",
+      "dev": true
+    },
+    "path-exists": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
+      "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s=",
+      "dev": true
+    },
+    "path-is-absolute": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
+      "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=",
+      "dev": true
+    },
+    "path-parse": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.5.tgz",
+      "integrity": "sha1-PBrfhx6pzWyUMbbqK9dKD/BVxME=",
+      "dev": true
+    },
+    "path-root": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/path-root/-/path-root-0.1.1.tgz",
+      "integrity": "sha1-mkpoFMrBwM1zNgqV8yCDyOpHRbc=",
+      "dev": true
+    },
+    "path-root-regex": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/path-root-regex/-/path-root-regex-0.1.2.tgz",
+      "integrity": "sha1-v8zcjfWxLcUsi0PsONGNcsBLqW0=",
+      "dev": true
+    },
+    "path-type": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
+      "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE=",
+      "dev": true
+    },
+    "performance-now": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-0.2.0.tgz",
+      "integrity": "sha1-M+8wxcd9TqIcWlOGnZG1bY8lVeU=",
+      "dev": true,
+      "optional": true
+    },
+    "pify": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+      "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
+      "dev": true
+    },
+    "pinkie": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/pinkie/-/pinkie-2.0.4.tgz",
+      "integrity": "sha1-clVrgM+g1IqXToDnckjoDtT3+HA=",
+      "dev": true
+    },
+    "pinkie-promise": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz",
+      "integrity": "sha1-ITXW36ejWMBprJsXh3YogihFD/o=",
+      "dev": true
+    },
+    "preserve": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/preserve/-/preserve-0.2.0.tgz",
+      "integrity": "sha1-gV7R9uvGWSb4ZbMQwHE7yzMVzks=",
+      "dev": true
+    },
+    "pretty-hrtime": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz",
+      "integrity": "sha1-t+PqQkNaTJsnWdmeDyAesZWALuE=",
+      "dev": true
+    },
+    "process-nextick-args": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz",
+      "integrity": "sha1-FQ4gt1ZZCtP5EJPyWk8q2L/zC6M=",
+      "dev": true
+    },
+    "punycode": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
+      "integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4=",
+      "dev": true,
+      "optional": true
+    },
+    "qs": {
+      "version": "6.4.0",
+      "resolved": "https://registry.npmjs.org/qs/-/qs-6.4.0.tgz",
+      "integrity": "sha1-E+JtKK1rD/qpExLNO/cI7TUecjM=",
+      "dev": true,
+      "optional": true
+    },
+    "randomatic": {
+      "version": "1.1.7",
+      "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-1.1.7.tgz",
+      "integrity": "sha512-D5JUjPyJbaJDkuAazpVnSfVkLlpeO3wDlPROTMLGKG1zMFNFRgrciKo1ltz/AzNTkqE0HzDx655QOL51N06how==",
+      "dev": true,
+      "dependencies": {
+        "is-number": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/is-number/-/is-number-3.0.0.tgz",
+          "integrity": "sha1-JP1iAaR4LPUFYcgQJ2r8fRLXEZU=",
+          "dev": true,
+          "dependencies": {
+            "kind-of": {
+              "version": "3.2.2",
+              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+              "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+              "dev": true
+            }
+          }
+        },
+        "kind-of": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-4.0.0.tgz",
+          "integrity": "sha1-IIE989cSkosgc3hpGkUGb65y3Vc=",
+          "dev": true
+        }
+      }
+    },
+    "read-package-json": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/read-package-json/-/read-package-json-2.0.5.tgz",
+      "integrity": "sha1-+Tpk5kFSnfaKCMZN5GOJ6KP4iEU=",
+      "dev": true,
+      "dependencies": {
+        "glob": {
+          "version": "7.1.2",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
+          "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ==",
+          "dev": true
+        }
+      }
+    },
+    "read-package-tree": {
+      "version": "5.1.6",
+      "resolved": "https://registry.npmjs.org/read-package-tree/-/read-package-tree-5.1.6.tgz",
+      "integrity": "sha512-FCX1aT3GWyY658wzDICef4p+n0dB+ENRct8E/Qyvppj6xVpOYerBHfUu7OP5Rt1/393Tdglguf5ju5DEX4wZNg==",
+      "dev": true
+    },
+    "read-pkg": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
+      "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg=",
+      "dev": true
+    },
+    "read-pkg-up": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
+      "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI=",
+      "dev": true
+    },
+    "readable-stream": {
+      "version": "2.2.11",
+      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+      "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q==",
+      "dev": true,
+      "dependencies": {
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c=",
+          "dev": true
+        }
+      }
+    },
+    "readdir-scoped-modules": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/readdir-scoped-modules/-/readdir-scoped-modules-1.0.2.tgz",
+      "integrity": "sha1-n6+jfShr5dksuuve4DDcm19AZ0c=",
+      "dev": true
+    },
+    "rechoir": {
+      "version": "0.6.2",
+      "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz",
+      "integrity": "sha1-hSBLVNuoLVdC4oyWdW70OvUOM4Q=",
+      "dev": true
+    },
+    "regex-cache": {
+      "version": "0.4.3",
+      "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.3.tgz",
+      "integrity": "sha1-mxpsNdTQ3871cRrmUejp09cRQUU=",
+      "dev": true
+    },
+    "remove-trailing-separator": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.0.2.tgz",
+      "integrity": "sha1-abBi2XhyetFNxrVrpKt3L9jXBRE=",
+      "dev": true
+    },
+    "repeat-element": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/repeat-element/-/repeat-element-1.1.2.tgz",
+      "integrity": "sha1-7wiaF40Ug7quTZPrmLT55OEdmQo=",
+      "dev": true
+    },
+    "repeat-string": {
+      "version": "1.6.1",
+      "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-1.6.1.tgz",
+      "integrity": "sha1-jcrkcOHIirwtYA//Sndihtp15jc=",
+      "dev": true
+    },
+    "replace-ext": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-0.0.1.tgz",
+      "integrity": "sha1-KbvZIHinOfC8zitO5B6DeVNSKSQ=",
+      "dev": true
+    },
+    "request": {
+      "version": "2.81.0",
+      "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz",
+      "integrity": "sha1-xpKJRqDgbF+Nb4qTM0af/aRimKA=",
+      "dev": true,
+      "optional": true
+    },
+    "require-directory": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
+      "integrity": "sha1-jGStX9MNqxyXbiNE/+f3kqam30I=",
+      "dev": true
+    },
+    "require-main-filename": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-1.0.1.tgz",
+      "integrity": "sha1-l/cXtp1IeE9fUmpsWqj/3aBVpNE=",
+      "dev": true
+    },
+    "resolve": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.3.3.tgz",
+      "integrity": "sha1-ZVkHw0aahoDcLeOidaj91paR8OU=",
+      "dev": true
+    },
+    "resolve-dir": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/resolve-dir/-/resolve-dir-0.1.1.tgz",
+      "integrity": "sha1-shklmlYC+sXFxJatiUpujMQwJh4=",
+      "dev": true
+    },
+    "restore-cursor": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-1.0.1.tgz",
+      "integrity": "sha1-NGYfRohjJ/7SmRR5FSJS35LapUE=",
+      "dev": true
+    },
+    "rimraf": {
+      "version": "2.5.4",
+      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
+      "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ=",
+      "dev": true
+    },
+    "run-async": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/run-async/-/run-async-2.3.0.tgz",
+      "integrity": "sha1-A3GrSuC91yDUFm19/aZP96RFpsA=",
+      "dev": true
+    },
+    "rx": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/rx/-/rx-4.1.0.tgz",
+      "integrity": "sha1-pfE/957zt0D+MKqAP7CfmIBdR4I=",
+      "dev": true
+    },
+    "safe-buffer": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.0.tgz",
+      "integrity": "sha512-aSLEDudu6OoRr/2rU609gRmnYboRLxgDG1z9o2Q0os7236FwvcqIOO8r8U5JUEwivZOhDaKlFO4SbPTJYyBEyQ==",
+      "dev": true
+    },
+    "semver": {
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz",
+      "integrity": "sha1-myzl094C0XxgEq0yaqa00M9U+U8=",
+      "dev": true
+    },
+    "sequencify": {
+      "version": "0.0.7",
+      "resolved": "https://registry.npmjs.org/sequencify/-/sequencify-0.0.7.tgz",
+      "integrity": "sha1-kM/xnQLgcCf9dn9erT57ldHnOAw=",
+      "dev": true
+    },
+    "set-blocking": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
+      "integrity": "sha1-BF+XgtARrppoA93TgrJDkrPYkPc=",
+      "dev": true
+    },
+    "sigmund": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/sigmund/-/sigmund-1.0.1.tgz",
+      "integrity": "sha1-P/IfGYytIXX587eBhT/ZTQ0ZtZA=",
+      "dev": true
+    },
+    "sntp": {
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz",
+      "integrity": "sha1-ZUEYTMkK7qbG57NeJlkIJEPGYZg=",
+      "dev": true,
+      "optional": true
+    },
+    "sparkles": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/sparkles/-/sparkles-1.0.0.tgz",
+      "integrity": "sha1-Gsu/tZJDbRC76PeFt8xvgoFQEsM=",
+      "dev": true
+    },
+    "spawn-sync": {
+      "version": "1.0.15",
+      "resolved": "https://registry.npmjs.org/spawn-sync/-/spawn-sync-1.0.15.tgz",
+      "integrity": "sha1-sAeZVX63+wyDdsKdROih6mfldHY=",
+      "dev": true
+    },
+    "spdx-correct": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-1.0.2.tgz",
+      "integrity": "sha1-SzBz2TP/UfORLwOsVRlJikFQ20A=",
+      "dev": true
+    },
+    "spdx-expression-parse": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-1.0.4.tgz",
+      "integrity": "sha1-m98vIOH0DtRH++JzJmGR/O1RYmw=",
+      "dev": true
+    },
+    "spdx-license-ids": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-1.2.2.tgz",
+      "integrity": "sha1-yd96NCRZSt5r0RkA1ZZpbcBrrFc=",
+      "dev": true
+    },
+    "sprintf-js": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
+      "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=",
+      "dev": true
+    },
+    "sshpk": {
+      "version": "1.13.1",
+      "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.13.1.tgz",
+      "integrity": "sha1-US322mKHFEMW3EwY/hzx2UBzm+M=",
+      "dev": true,
+      "optional": true,
+      "dependencies": {
+        "assert-plus": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
+          "dev": true,
+          "optional": true
+        }
+      }
+    },
+    "stream-consume": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/stream-consume/-/stream-consume-0.1.0.tgz",
+      "integrity": "sha1-pB6tGm1ggc63n2WwYZAbbY89HQ8=",
+      "dev": true
+    },
+    "string_decoder": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+      "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+      "dev": true,
+      "dependencies": {
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c=",
+          "dev": true
+        }
+      }
+    },
+    "string-width": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
+      "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
+      "dev": true
+    },
+    "stringstream": {
+      "version": "0.0.5",
+      "resolved": "https://registry.npmjs.org/stringstream/-/stringstream-0.0.5.tgz",
+      "integrity": "sha1-TkhM1N5aC7vuGORjB3EKioFiGHg=",
+      "dev": true,
+      "optional": true
+    },
+    "strip-ansi": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
+      "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
+      "dev": true
+    },
+    "strip-bom": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-1.0.0.tgz",
+      "integrity": "sha1-hbiGLzhEtabV7IRnqTWYFzo295Q=",
+      "dev": true
+    },
+    "supports-color": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+      "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=",
+      "dev": true
+    },
+    "through": {
+      "version": "2.3.8",
+      "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
+      "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU=",
+      "dev": true
+    },
+    "through2": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/through2/-/through2-2.0.3.tgz",
+      "integrity": "sha1-AARWmzfHx0ujnEPzzteNGtlBQL4=",
+      "dev": true
+    },
+    "tildify": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/tildify/-/tildify-1.2.0.tgz",
+      "integrity": "sha1-3OwD9V3Km3qj5bBPIYF+tW5jWIo=",
+      "dev": true
+    },
+    "time-stamp": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/time-stamp/-/time-stamp-1.1.0.tgz",
+      "integrity": "sha1-dkpaEa9QVhkhsTPztE5hhofg9cM=",
+      "dev": true
+    },
+    "tmp": {
+      "version": "0.0.29",
+      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.29.tgz",
+      "integrity": "sha1-8lEl/w3Z2jzLDC3Tce4SiLuRKMA=",
+      "dev": true
+    },
+    "tough-cookie": {
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.2.tgz",
+      "integrity": "sha1-8IH3bkyFcg5sN6X6ztc3FQ2EByo=",
+      "dev": true,
+      "optional": true
+    },
+    "tunnel-agent": {
+      "version": "0.6.0",
+      "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.6.0.tgz",
+      "integrity": "sha1-J6XeoGs2sEoKmWZ3SykIaPD8QP0=",
+      "dev": true,
+      "optional": true
+    },
+    "tweetnacl": {
+      "version": "0.14.5",
+      "resolved": "https://registry.npmjs.org/tweetnacl/-/tweetnacl-0.14.5.tgz",
+      "integrity": "sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q=",
+      "dev": true,
+      "optional": true
+    },
+    "typedarray": {
+      "version": "0.0.6",
+      "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
+      "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=",
+      "dev": true
+    },
+    "unc-path-regex": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/unc-path-regex/-/unc-path-regex-0.1.2.tgz",
+      "integrity": "sha1-5z3T17DXxe2G+6xrCufYxqadUPo=",
+      "dev": true
+    },
+    "unique-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-1.0.0.tgz",
+      "integrity": "sha1-1ZpKdUJ0R9mqbJHnAmP40mpLEEs=",
+      "dev": true
+    },
+    "user-home": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/user-home/-/user-home-1.1.1.tgz",
+      "integrity": "sha1-K1viOjK2Onyd640PKNSFcko98ZA=",
+      "dev": true
+    },
+    "util-deprecate": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
+      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=",
+      "dev": true
+    },
+    "uuid": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.0.1.tgz",
+      "integrity": "sha1-ZUS7ot/ajBzxfmKaOjBeK7H+5sE=",
+      "dev": true,
+      "optional": true
+    },
+    "v8flags": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/v8flags/-/v8flags-2.1.1.tgz",
+      "integrity": "sha1-qrGh+jDUX4jdMhFIh1rALAtV5bQ=",
+      "dev": true
+    },
+    "validate-npm-package-license": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.1.tgz",
+      "integrity": "sha1-KAS6vnEq0zeUWaz74kdGqywwP7w=",
+      "dev": true
+    },
+    "validator": {
+      "version": "5.7.0",
+      "resolved": "https://registry.npmjs.org/validator/-/validator-5.7.0.tgz",
+      "integrity": "sha1-eoelgUa2laxIYHEUHAxJ1n2gXlw=",
+      "dev": true
+    },
+    "verror": {
+      "version": "1.3.6",
+      "resolved": "https://registry.npmjs.org/verror/-/verror-1.3.6.tgz",
+      "integrity": "sha1-z/XfEpRtKX0rqu+qJoniW+AcAFw=",
+      "dev": true,
+      "optional": true
+    },
+    "vinyl": {
+      "version": "0.5.3",
+      "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.5.3.tgz",
+      "integrity": "sha1-sEVbOPxeDPMNQyUTLkYZcMIJHN4=",
+      "dev": true
+    },
+    "vinyl-fs": {
+      "version": "0.3.14",
+      "resolved": "https://registry.npmjs.org/vinyl-fs/-/vinyl-fs-0.3.14.tgz",
+      "integrity": "sha1-mmhRzhysHBzqX+hsCTHWIMLPqeY=",
+      "dev": true,
+      "dependencies": {
+        "clone": {
+          "version": "0.2.0",
+          "resolved": "https://registry.npmjs.org/clone/-/clone-0.2.0.tgz",
+          "integrity": "sha1-xhJqkK1Pctv1rNskPMN3JP6T/B8=",
+          "dev": true
+        },
+        "graceful-fs": {
+          "version": "3.0.11",
+          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-3.0.11.tgz",
+          "integrity": "sha1-dhPHeKGv6mLyXGMKCG1/Osu92Bg=",
+          "dev": true
+        },
+        "isarray": {
+          "version": "0.0.1",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
+          "dev": true
+        },
+        "readable-stream": {
+          "version": "1.0.34",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=",
+          "dev": true
+        },
+        "string_decoder": {
+          "version": "0.10.31",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=",
+          "dev": true
+        },
+        "through2": {
+          "version": "0.6.5",
+          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
+          "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg=",
+          "dev": true
+        },
+        "vinyl": {
+          "version": "0.4.6",
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.4.6.tgz",
+          "integrity": "sha1-LzVsh6VQolVGHza76ypbqL94SEc=",
+          "dev": true
+        }
+      }
+    },
+    "which": {
+      "version": "1.2.14",
+      "resolved": "https://registry.npmjs.org/which/-/which-1.2.14.tgz",
+      "integrity": "sha1-mofEN48D6CfOyvGs31bHNsAcFOU=",
+      "dev": true
+    },
+    "which-module": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/which-module/-/which-module-1.0.0.tgz",
+      "integrity": "sha1-u6Y8qGGUiZT/MHc2CJ47lgJsKk8=",
+      "dev": true
+    },
+    "wordwrap": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz",
+      "integrity": "sha1-J1hIEIkUVqQXHI0CJkQa3pDLyus=",
+      "dev": true
+    },
+    "wrap-ansi": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
+      "integrity": "sha1-2Pw9KE3QV5T+hJc8rs3Rz4JP3YU=",
+      "dev": true
+    },
+    "wrappy": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
+      "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=",
+      "dev": true
+    },
+    "xtend": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.1.tgz",
+      "integrity": "sha1-pcbVMr5lbiPbgg77lDofBJmNY68=",
+      "dev": true
+    },
+    "y18n": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/y18n/-/y18n-3.2.1.tgz",
+      "integrity": "sha1-bRX7qITAhnnA136I53WegR4H+kE=",
+      "dev": true
+    },
+    "yargs": {
+      "version": "6.6.0",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz",
+      "integrity": "sha1-eC7CHvQDNF+DCoCMo9UTr1YGUgg=",
+      "dev": true
+    },
+    "yargs-parser": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz",
+      "integrity": "sha1-KczqwNxPA8bIe0qfIX3RjJ90hxw=",
+      "dev": true
+    },
+    "z-schema": {
+      "version": "3.17.0",
+      "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-3.17.0.tgz",
+      "integrity": "sha1-RCs4+denr3rke/z8NWhz6GFq0bc=",
+      "dev": true
+    }
+  }
+}
diff --git a/packages/example-app-base/src/components/ExampleCard/ExampleCard.scss b/packages/example-app-base/src/components/ExampleCard/ExampleCard.scss
index 287b5b4e4fd27..f8a3dc776c802 100644
--- a/packages/example-app-base/src/components/ExampleCard/ExampleCard.scss
+++ b/packages/example-app-base/src/components/ExampleCard/ExampleCard.scss
@@ -58,6 +58,7 @@
     overflow-x: hidden;
     overflow-y: auto;
     padding: 20px 0;
+    position: relative;
   }
 
   .ExampleCard-example.is-right-aligned {
diff --git a/packages/office-ui-fabric-react/src/ScrollablePane.ts b/packages/office-ui-fabric-react/src/ScrollablePane.ts
new file mode 100644
index 0000000000000..f8ae6a868a95f
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/ScrollablePane.ts
@@ -0,0 +1 @@
+export * from './components/ScrollablePane/index';
diff --git a/packages/office-ui-fabric-react/src/Sticky.ts b/packages/office-ui-fabric-react/src/Sticky.ts
new file mode 100644
index 0000000000000..f5f2552df1d83
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/Sticky.ts
@@ -0,0 +1 @@
+export * from './components/Sticky/index';
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.Props.ts b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.Props.ts
new file mode 100644
index 0000000000000..50b229bb05c1c
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.Props.ts
@@ -0,0 +1,14 @@
+import * as React from 'react';
+import { ScrollablePane } from './ScrollablePane';
+
+export interface IScrollablePaneProps extends React.HTMLAttributes<HTMLElement | ScrollablePane> {
+  /**
+   * Gets ref to component interface.
+   */
+  componentRef?: (component: IScrollablePaneProps) => void;
+
+  /**
+   * Class name to apply to the root in addition to ms-ScrollablePane.
+  */
+  className?: string;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.scss b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.scss
new file mode 100644
index 0000000000000..f1f8a72e83790
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.scss
@@ -0,0 +1,29 @@
+@import '../../common/common';
+
+.root {
+  overflow-y: auto;
+  max-height: inherit;
+  -webkit-overflow-scrolling: touch;
+}
+
+.stickyContainer {
+  overflow: hidden;
+  position: absolute;
+  pointer-events: none;
+}
+
+.stickyAbove,
+.stickyBelow {
+  position: absolute;
+  pointer-events: auto;
+  width: 100%;
+  z-index: 1;
+}
+
+.stickyAbove {
+  top: 0;
+}
+
+.stickyBelow {
+  bottom: 0;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
new file mode 100644
index 0000000000000..e8078ec0cd4c2
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
@@ -0,0 +1,206 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+/* tslint:enable:no-unused-variable */
+import * as PropTypes from 'prop-types';
+import {
+  autobind,
+  BaseComponent,
+  css
+} from '../../Utilities';
+import { IScrollablePaneProps } from './ScrollablePane.Props';
+import { Sticky } from '../../Sticky';
+import * as stylesImport from './ScrollablePane.scss';
+const styles: any = stylesImport;
+
+export interface IScrollablePaneContext {
+  scrollablePane: PropTypes.Requireable<object>;
+}
+
+export class ScrollablePane extends BaseComponent<IScrollablePaneProps, {}> {
+  public static childContextTypes: IScrollablePaneContext = {
+    scrollablePane: PropTypes.object
+  };
+
+  public refs: {
+    root: HTMLElement;
+    stickyContainer: HTMLElement;
+    stickyAbove: HTMLElement;
+    stickyBelow: HTMLElement;
+  };
+
+  private _subscribers: Function[];
+  private _stickyAbove: Sticky[];
+  private _stickyBelow: Sticky[];
+
+  constructor(props: IScrollablePaneProps) {
+    super(props);
+    this._subscribers = [];
+    this._stickyAbove = [];
+    this._stickyBelow = [];
+  }
+
+  public getChildContext() {
+    return {
+      scrollablePane: {
+        subscribe: this.subscribe,
+        addStickyHeader: this.addStickyHeader,
+        removeStickyHeader: this.removeStickyHeader,
+        addStickyFooter: this.addStickyFooter,
+        removeStickyFooter: this.removeStickyFooter,
+      }
+    };
+  }
+
+  public componentDidMount() {
+    const { root, stickyContainer, stickyAbove, stickyBelow } = this.refs;
+
+    this._events.on(root, 'scroll', this._notifySubscribers);
+    this._events.on(window, 'resize', this._onWindowResize);
+    setTimeout(() => {
+      this._resizeContainer();
+      if (stickyContainer.parentElement && root.parentElement) {
+        stickyContainer.parentElement.removeChild(stickyContainer);
+        root.parentElement.insertBefore(stickyContainer, root.nextSibling);
+        this._notifySubscribers();
+        if (this._stickyAbove.length > 1) {
+          this._sortStickies(this._stickyAbove, stickyAbove);
+        }
+        if (this._stickyBelow.length > 1) {
+          this._sortStickies(this._stickyBelow, stickyBelow);
+        }
+      }
+    }, 500);
+  }
+
+  public componentWillUnmount() {
+    this._events.off(this.refs.root);
+    this._events.off(window);
+  }
+
+  public render() {
+    const { className } = this.props;
+
+    return (
+      <div
+        ref='root'
+        className={ css('ms-ScrollablePane', styles.root, className) }
+        data-is-scrollable={ true }>
+        <div ref='stickyContainer' className={ styles.stickyContainer }>
+          <div ref='stickyAbove' className={ styles.stickyAbove } />
+          <div ref='stickyBelow' className={ styles.stickyBelow } />
+        </div>
+        { this.props.children }
+      </div>
+    );
+  }
+
+  @autobind
+  public subscribe(handler: (headerBound: ClientRect, footerBound: ClientRect) => void) {
+    this._subscribers = this._subscribers.concat(handler);
+  }
+
+  @autobind
+  public addStickyHeader(sticky: Sticky) {
+    const { stickyAbove } = this.refs;
+    this._addSticky(sticky, this._stickyAbove, stickyAbove, () => {
+      stickyAbove.appendChild(sticky.content);
+    });
+  }
+
+  @autobind
+  public addStickyFooter(sticky: Sticky) {
+    const { stickyBelow } = this.refs;
+    this._addSticky(sticky, this._stickyBelow, stickyBelow, () => {
+      stickyBelow.insertBefore(sticky.content, stickyBelow.firstChild);
+    });
+  }
+
+  @autobind
+  public removeStickyHeader(sticky: Sticky) {
+    this._removeSticky(sticky, this._stickyAbove, this.refs.stickyAbove);
+  }
+
+  @autobind
+  public removeStickyFooter(sticky: Sticky) {
+    this._removeSticky(sticky, this._stickyBelow, this.refs.stickyBelow);
+  }
+
+  private _addSticky(sticky: Sticky, stickyList: Sticky[], container: HTMLElement, addStickyToContainer: () => void) {
+    if (stickyList.indexOf(sticky) < 0) {
+      stickyList.push(sticky);
+      addStickyToContainer();
+      sticky.content.addEventListener('transitionend',
+        this._setPlaceholderHeights.bind(null, stickyList, container),
+        false);
+      if (sticky.props.stickyClassName) {
+        setTimeout(() => {
+          if (sticky.props.stickyClassName) {
+            sticky.content.children[0].classList.add(sticky.props.stickyClassName);
+          }
+        }, 1);
+      }
+      this._notifySubscribers();
+      this._setPlaceholderHeights(stickyList, container);
+    }
+  }
+
+  private _removeSticky(sticky: Sticky, stickyList: Sticky[], container: HTMLElement) {
+    const indexOfSticky = stickyList.indexOf(sticky);
+    if (indexOfSticky >= 0) {
+      sticky.content.removeEventListener('transitionend',
+        this._setPlaceholderHeights.bind(null, stickyList, container));
+      stickyList.splice(indexOfSticky, 1);
+    }
+  }
+
+  private _onWindowResize() {
+    const { stickyAbove, stickyBelow } = this.refs;
+    setTimeout(() => {
+      this._resizeContainer();
+      this._notifySubscribers();
+      this._setPlaceholderHeights(this._stickyAbove, stickyAbove);
+      this._setPlaceholderHeights(this._stickyBelow, stickyBelow);
+    }, 5);
+  }
+
+  private _resizeContainer() {
+    const { stickyContainer, root } = this.refs;
+    const { borderTopWidth, borderLeftWidth } = getComputedStyle(root);
+    stickyContainer.style.height = root.clientHeight + 'px';
+    stickyContainer.style.width = root.clientWidth + 'px';
+    if (borderTopWidth) {
+      stickyContainer.style.top = root.offsetTop + parseInt(borderTopWidth, 10) + 'px';
+    }
+    if (borderLeftWidth) {
+      stickyContainer.style.left = root.offsetLeft + parseInt(borderLeftWidth, 10) + 'px';
+    }
+  }
+
+  @autobind
+  private _setPlaceholderHeights(stickies: Sticky[], element: HTMLElement) {
+    const { stickyAbove, stickyBelow } = this.refs;
+    stickies.forEach((sticky, idx) => {
+      sticky.setPlaceholderHeight(element.children[idx].clientHeight);
+    });
+  }
+
+  private _sortStickies(stickyList: Sticky[], container: HTMLElement): void {
+    stickyList.sort((a, b) => {
+      return a.refs.root.offsetTop - b.refs.root.offsetTop;
+    });
+    while (container.lastChild) {
+      this.refs.stickyBelow.removeChild(container.lastChild);
+    }
+    stickyList.forEach((sticky) => {
+      container.appendChild(sticky.content);
+    });
+  }
+
+  private _notifySubscribers() {
+    const { stickyAbove, stickyBelow } = this.refs;
+    this._subscribers.forEach((handle) => {
+      handle(stickyAbove.getBoundingClientRect(), stickyBelow.getBoundingClientRect());
+    });
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
new file mode 100644
index 0000000000000..e0289d5dd0473
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
@@ -0,0 +1,69 @@
+import * as React from 'react';
+import {
+  ExampleCard,
+  ComponentPage,
+  IComponentDemoPageProps,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+import { ScrollablePaneDefaultExample } from './examples/ScrollablePane.Default.Example';
+import { ScrollablePaneDetailsListExample } from './examples/ScrollablePane.DetailsList.Example';
+
+const ScrollablePaneDefaultExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx') as string;
+
+const ScrollablePaneDetailsListExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.DetailsList.Example.tsx') as string;
+
+export class ScrollablePanePage extends React.Component<IComponentDemoPageProps, {}> {
+  public render() {
+    return (
+      <ComponentPage
+        title='ScrollablePane'
+        componentName='ScrollablePaneExample'
+        exampleCards={
+          <div>
+            <ExampleCard title='Default' code={ ScrollablePaneDefaultExampleCode }>
+              <ScrollablePaneDefaultExample />
+            </ExampleCard>
+            <ExampleCard title='DetailsList Locked Header' code={ ScrollablePaneDetailsListExampleCode }>
+              <ScrollablePaneDetailsListExample />
+            </ExampleCard>
+          </div>
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.Props.ts')
+            ] }
+          />
+        }
+        overview={
+          <div>
+            <p>
+              ScrollablePane is a helper component designed to use in conjunction with a Sticky component.  ScrollablePane will find the nearest scrollable parent element, and designate that as the container for Sticky components.  Sticky components will "stick" to the top or bottom of a ScrollablePane's scrollable region and remain visible.
+            </p>
+          </div>
+        }
+        bestPractices={
+          <div></div>
+        }
+        dos={
+          <div>
+            <ul>
+              <li>Designate the nearest scrollable parent with the attribute data-is-scrollable=true</li>
+              <li>Use Sticky component on block level elements</li>
+              <li>Sticky component are ideally section headers and/or footers</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul>
+              <li>Don't use Sticky on elements with margin top or bottom</li>
+            </ul>
+          </div>
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }>
+      </ComponentPage>
+    );
+  }
+
+}
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx
new file mode 100644
index 0000000000000..0bb74ec723dfe
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx
@@ -0,0 +1,56 @@
+import * as React from 'react';
+import { ScrollablePane } from 'office-ui-fabric-react/lib/ScrollablePane';
+import { Sticky, StickyPositionType } from 'office-ui-fabric-react/lib/Sticky';
+import { lorem } from '@uifabric/example-app-base';
+import './ScrollablePane.Example.scss';
+
+export class ScrollablePaneDefaultExample extends React.Component<any, any> {
+  constructor() {
+    super();
+  }
+
+  public render() {
+    let contentAreas: JSX.Element[] = [];
+    for (let i = 0; i < 4; i++) {
+      contentAreas.push(this._createContentArea(i));
+    }
+
+    return (
+      <ScrollablePane className='scrollablePaneDefaultExample'>
+        { contentAreas.map((ele) => {
+          return ele;
+        }) }
+      </ScrollablePane>
+    );
+  }
+
+  private _getRandomColor() {
+    let letters = 'BCDEF'.split('');
+    let color = '#';
+    for (let i = 0; i < 6; i++) {
+      color += letters[Math.floor(Math.random() * letters.length)];
+    }
+    return color;
+  }
+
+  private _createContentArea(index: number) {
+    const style = {
+      backgroundColor: this._getRandomColor()
+    };
+
+    return (
+      <div key={ index }>
+        <Sticky
+          stickyPosition={ StickyPositionType.Both }
+          stickyClassName='largeFont'>
+          <div className='sticky' style={ style }>
+            Sticky Component #{ index + 1 }
+          </div>
+        </Sticky>
+        <div className='textContent'>
+          { lorem(200) }
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.DetailsList.Example.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.DetailsList.Example.tsx
new file mode 100644
index 0000000000000..d5a2e59fc1cf1
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.DetailsList.Example.tsx
@@ -0,0 +1,132 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+import { TextField } from 'office-ui-fabric-react/lib/TextField';
+import {
+  DetailsList,
+  DetailsListLayoutMode,
+  IDetailsHeaderProps,
+  Selection,
+  IColumn
+} from 'office-ui-fabric-react/lib/DetailsList';
+import {
+  IRenderFunction
+} from 'office-ui-fabric-react/lib/Utilities';
+import {
+  TooltipHost,
+  ITooltipHostProps
+} from 'office-ui-fabric-react/lib/Tooltip';
+import {
+  ScrollablePane
+} from 'office-ui-fabric-react/lib/ScrollablePane';
+import {
+  Sticky
+} from 'office-ui-fabric-react/lib/Sticky';
+import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
+
+let _items: {
+  key: number,
+  name: string,
+  value: number
+}[] = [];
+
+let _columns: IColumn[] = [
+  {
+    key: 'column1',
+    name: 'Name',
+    fieldName: 'name',
+    minWidth: 100,
+    maxWidth: 200,
+    isResizable: true,
+    ariaLabel: 'Operations for name'
+  },
+  {
+    key: 'column2',
+    name: 'Value',
+    fieldName: 'value',
+    minWidth: 100,
+    maxWidth: 200,
+    isResizable: true,
+    ariaLabel: 'Operations for value'
+  },
+];
+
+export class ScrollablePaneDetailsListExample extends React.Component<any, any> {
+  private _selection: Selection;
+
+  constructor() {
+    super();
+
+    // Populate with items for demos.
+    if (_items.length === 0) {
+      for (let i = 0; i < 200; i++) {
+        _items.push({
+          key: i,
+          name: 'Item ' + i,
+          value: i
+        });
+      }
+    }
+
+    this._selection = new Selection({
+      onSelectionChanged: () => this.setState({ selectionDetails: this._getSelectionDetails() })
+    });
+
+    this.state = {
+      items: _items,
+      selectionDetails: this._getSelectionDetails()
+    };
+  }
+
+  public render() {
+    let { items, selectionDetails } = this.state;
+
+    return (
+      <ScrollablePane>
+        <Sticky>{ selectionDetails }</Sticky>
+        <TextField
+          label='Filter by name:'
+          onChanged={ text => this.setState({ items: text ? _items.filter(i => i.name.toLowerCase().indexOf(text) > -1) : _items }) }
+        />
+        <Sticky>
+          <h1 style={ { margin: '0px' } }>Item List</h1>
+        </Sticky>
+        <MarqueeSelection selection={ this._selection }>
+          <DetailsList
+            items={ items }
+            columns={ _columns }
+            setKey='set'
+            layoutMode={ DetailsListLayoutMode.fixedColumns }
+            onRenderDetailsHeader={
+              (detailsHeaderProps: IDetailsHeaderProps, defaultRender: IRenderFunction<IDetailsHeaderProps>) => (
+                <Sticky>
+                  { defaultRender({
+                    ...detailsHeaderProps,
+                    onRenderColumnHeaderTooltip: (tooltipHostProps: ITooltipHostProps) => <TooltipHost { ...tooltipHostProps } />
+                  }) }
+                </Sticky>
+              ) }
+            selection={ this._selection }
+            selectionPreservedOnEmptyClick={ true }
+            ariaLabelForSelectionColumn='Toggle selection'
+            ariaLabelForSelectAllCheckbox='Toggle selection for all items'
+            onItemInvoked={ (item) => alert(`Item invoked: ${item.name}`) }
+          />
+        </MarqueeSelection>
+      </ScrollablePane>
+    );
+  }
+
+  private _getSelectionDetails(): string {
+    let selectionCount = this._selection.getSelectedCount();
+
+    switch (selectionCount) {
+      case 0:
+        return 'No items selected';
+      case 1:
+        return '1 item selected: ' + (this._selection.getSelection()[0] as any).name;
+      default:
+        return `${selectionCount} items selected`;
+    }
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Example.scss b/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Example.scss
new file mode 100644
index 0000000000000..5a9603237c42a
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Example.scss
@@ -0,0 +1,36 @@
+@import '../../../common/common';
+
+:global {
+  .scrollablePaneDefaultExample {
+    max-width: 400px;
+    max-height: inherit;
+    border: 1px solid $ms-color-neutralLight;
+  }
+
+  .sticky {
+    @include ms-fontColor-neutralDark;
+    padding: 10px 20px;
+    font-size: 16px;
+    -webkit-transition: font-size ease 0.3s;
+    -moz-transition: font-size ease 0.3s;
+    -o-transition: font-size ease 0.3s;
+    -ms-transition: font-size ease 0.3s;
+    -webkit-transform: translateZ(0);
+    -moz-transform: translateZ(0);
+    -ms-transform: translateZ(0);
+    -o-transform: translateZ(0);
+    transform: translateZ(0);
+    will-change: font-size;
+    box-shadow: 0 0 5px -1px $ms-color-neutralDark;
+  }
+
+  .largeFont {
+    .sticky {
+      font-size: 20px;
+    }
+  }
+
+  .textContent {
+    padding: 15px 10px;
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/index.ts b/packages/office-ui-fabric-react/src/components/ScrollablePane/index.ts
new file mode 100644
index 0000000000000..5d72420fb3e66
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/index.ts
@@ -0,0 +1,2 @@
+export * from './ScrollablePane';
+export * from './ScrollablePane.Props';
diff --git a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.Props.ts b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.Props.ts
new file mode 100644
index 0000000000000..49813269b34ae
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.Props.ts
@@ -0,0 +1,25 @@
+import * as React from 'react';
+import { Sticky } from './Sticky';
+
+export interface IStickyProps extends React.Props<Sticky> {
+  /**
+   * Gets ref to component interface.
+   */
+  componentRef?: (component: IStickyProps) => void;
+
+  /**
+   * Class name to apply to the sticky element if component is sticky.
+  */
+  stickyClassName?: string;
+
+  /**
+   * Region to render sticky component in.  Defaults to Both.
+   */
+  stickyPosition?: StickyPositionType;
+}
+
+export enum StickyPositionType {
+  Both = 0,
+  Header = 1,
+  Footer = 2
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.scss b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.scss
new file mode 100644
index 0000000000000..fe0ac64e04e19
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.scss
@@ -0,0 +1,11 @@
+@import '../../common/common';
+
+.isSticky {
+  position: fixed;
+  -webkit-overflow-scrolling: touch;
+  -webkit-transform: translateZ(0);
+  transform: translateZ(0);
+  -webkit-backface-visibility: hidden;
+  backface-visibility: hidden;
+  z-index: 1;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
new file mode 100644
index 0000000000000..5351fe104deb4
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
@@ -0,0 +1,166 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+/* tslint:enable:no-unused-variable */
+
+import * as PropTypes from 'prop-types';
+import {
+  BaseComponent,
+  autobind
+} from '../../Utilities';
+import { ScrollablePane } from '../../ScrollablePane';
+import { IStickyProps, StickyPositionType } from './Sticky.Props';
+import * as stylesImport from './Sticky.scss';
+const styles: any = stylesImport;
+
+export interface IStickyState {
+  isStickyTop: boolean;
+  isStickyBottom: boolean;
+  placeholderHeight?: number;
+}
+
+export interface IStickyContext {
+  scrollablePane: PropTypes.Requireable<object>;
+}
+
+export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
+  public static defaultProps: IStickyProps = {
+    stickyPosition: StickyPositionType.Both
+  };
+
+  public static contextTypes: IStickyContext = {
+    scrollablePane: PropTypes.object
+  };
+
+  public refs: {
+    root: HTMLElement;
+    placeholder: HTMLElement;
+  };
+
+  public context: {
+    scrollablePane: {
+      subscribe: (handler: Function) => void;
+      addStickyHeader: (sticky: Sticky) => void;
+      removeStickyHeader: (sticky: Sticky) => void;
+      addStickyFooter: (sticky: Sticky) => void;
+      removeStickyFooter: (sticky: Sticky) => void;
+    }
+  };
+
+  public content: HTMLElement;
+
+  constructor(props: IStickyProps) {
+    super(props);
+    this.state = {
+      isStickyTop: false,
+      isStickyBottom: false
+    };
+  }
+
+  @autobind
+  public componentDidMount() {
+    if (!this.context.scrollablePane) {
+      throw new TypeError('Expected Sticky to be mounted within ScrollablePane');
+    }
+    const { scrollablePane } = this.context;
+    const { stickyClassName } = this.props;
+    scrollablePane.subscribe(this._onScrollEvent);
+    this.content = document.createElement('div');
+    this.content.style.background = this._getBackground();
+    ReactDOM.render(<div>{ this.props.children }</div>, this.content);
+    this.refs.root.appendChild(this.content);
+  }
+
+  public componentDidUpdate(prevProps: IStickyProps, prevState: IStickyState) {
+    const { isStickyTop, isStickyBottom } = this.state;
+    const { scrollablePane } = this.context;
+
+    if (this.props.children !== prevProps.children) {
+      ReactDOM.render(<div>{ this.props.children }</div>, this.content);
+    }
+    if (isStickyTop && !prevState.isStickyTop) {
+      this._setSticky(() => {
+        scrollablePane.addStickyHeader(this);
+      });
+    } else if (!isStickyTop && prevState.isStickyTop) {
+      this._resetSticky(() => {
+        scrollablePane.removeStickyHeader(this);
+      });
+    } else if (isStickyBottom && !prevState.isStickyBottom) {
+      this._setSticky(() => {
+        scrollablePane.addStickyFooter(this);
+      });
+    } else if (!isStickyBottom && prevState.isStickyBottom) {
+      this._resetSticky(() => {
+        scrollablePane.removeStickyFooter(this);
+      });
+    }
+  }
+
+  public shouldComponentUpdate(nextProps: IStickyProps, nextState: IStickyState) {
+    const { isStickyTop, isStickyBottom, placeholderHeight } = this.state;
+    return isStickyTop !== nextState.isStickyTop ||
+      isStickyBottom !== nextState.isStickyBottom ||
+      placeholderHeight !== nextState.placeholderHeight ||
+      this.props.children !== nextProps.children;
+  }
+
+  public setPlaceholderHeight(height: number) {
+    this.setState({
+      placeholderHeight: height
+    });
+  }
+
+  public render() {
+    const { isStickyTop, isStickyBottom, placeholderHeight } = this.state;
+    const isSticky = isStickyTop || isStickyBottom;
+
+    return (
+      <div ref='root'>
+        <div ref='placeholder' style={ { height: (isSticky ? placeholderHeight : 0) } } />
+      </div>
+    );
+  }
+
+  @autobind
+  private _onScrollEvent(headerBound: ClientRect, footerBound: ClientRect) {
+    const { top, bottom } = this.refs.root.getBoundingClientRect();
+    const { isStickyTop, isStickyBottom } = this.state;
+    const { stickyPosition } = this.props;
+    const canStickyHeader = stickyPosition === StickyPositionType.Both || stickyPosition === StickyPositionType.Header;
+    const canStickyFooter = stickyPosition === StickyPositionType.Both || stickyPosition === StickyPositionType.Footer;
+
+    this.setState({
+      isStickyTop: canStickyHeader && ((!isStickyTop && top <= headerBound.bottom) || (isStickyTop && bottom < headerBound.bottom)),
+      isStickyBottom: canStickyFooter && ((!isStickyBottom && bottom >= footerBound.top) || (isStickyBottom && top > footerBound.top))
+    });
+  }
+  private _setSticky(callback: () => void) {
+    if (this.content.parentElement) {
+      this.content.parentElement.removeChild(this.content);
+    }
+    callback();
+  }
+
+  private _resetSticky(callback: () => void) {
+    this.refs.root.appendChild(this.content);
+    setTimeout(() => {
+      if (this.props.stickyClassName) {
+        this.content.children[0].classList.remove(this.props.stickyClassName);
+      }
+    }, 1);
+    callback();
+  }
+
+  // Gets background of nearest parent element that has a declared background-color attribute
+  private _getBackground(): string {
+    let curr = this.refs.root;
+    while (window.getComputedStyle(curr).getPropertyValue('background-color') === 'rgba(0, 0, 0, 0)' ||
+      window.getComputedStyle(curr).getPropertyValue('background-color') === 'transparent') {
+      if (curr.parentElement) {
+        curr = curr.parentElement;
+      }
+    }
+    return window.getComputedStyle(curr).getPropertyValue('background-color');
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/Sticky/index.ts b/packages/office-ui-fabric-react/src/components/Sticky/index.ts
new file mode 100644
index 0000000000000..86691f866b911
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Sticky/index.ts
@@ -0,0 +1,2 @@
+export * from './Sticky';
+export * from './Sticky.Props';
diff --git a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
index afc1d2e6fdcd5..9e11f62436516 100644
--- a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
+++ b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
@@ -208,6 +208,12 @@ export const AppDefinition: IAppDefinition = {
           name: 'ResizeGroup',
           url: '#/examples/resizegroup'
         },
+        {
+          component: require<any>('../components/ScrollablePane/ScrollablePanePage').ScrollablePanePage,
+          key: 'ScrollablePane',
+          name: 'ScrollablePane',
+          url: '#/examples/scrollablepane'
+        },
         {
           component: require<any>('../components/SearchBox/SearchBoxPage').SearchBoxPage,
           key: 'SearchBox',
diff --git a/packages/office-ui-fabric-react/src/index.ts b/packages/office-ui-fabric-react/src/index.ts
index 0cbad5c4ebf86..f2c8c88e932a4 100644
--- a/packages/office-ui-fabric-react/src/index.ts
+++ b/packages/office-ui-fabric-react/src/index.ts
@@ -42,10 +42,12 @@ export * from './Pivot';
 export * from './ProgressIndicator';
 export * from './Rating';
 export * from './ResizeGroup';
+export * from './ScrollablePane';
 export * from './SearchBox';
 export * from './Slider';
 export * from './SpinButton';
 export * from './Spinner';
+export * from './Sticky';
 export * from './Styling';
 export * from './SwatchColorPicker';
 export * from './TeachingBubble';

From ff44b6b9c31ceac21ade3f66c356e49bdee0287c Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 3 Aug 2017 16:28:56 -0700
Subject: [PATCH 0357/1641] Button: Merge IButtonStyles and ISplitButtonStyles
 interfaces (#2388)

* Update Button props style

* Rush change

* Merge ISplitButtonStyles and IButtonStyles

* Update button-styles-type_2017-08-03-22-01.json
---
 .../button-styles-type_2017-08-03-22-01.json  | 11 +++++
 .../src/components/Button/Button.Props.ts     | 42 ++++++++++++++++-
 .../CommandButton/CommandButton.styles.ts     |  3 +-
 .../CompoundButton/CompoundButton.styles.ts   |  3 +-
 .../DefaultButton/DefaultButton.styles.ts     |  3 +-
 .../Button/IconButton/IconButton.styles.ts    |  3 +-
 .../PrimaryButton/PrimaryButton.styles.ts     |  3 +-
 .../Button/SplitButton/SplitButton.Props.ts   | 46 -------------------
 .../Button/SplitButton/SplitButton.styles.ts  |  8 ++--
 .../Button/examples/Button.Split.Example.tsx  |  5 +-
 10 files changed, 62 insertions(+), 65 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/button-styles-type_2017-08-03-22-01.json
 delete mode 100644 packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.Props.ts

diff --git a/common/changes/office-ui-fabric-react/button-styles-type_2017-08-03-22-01.json b/common/changes/office-ui-fabric-react/button-styles-type_2017-08-03-22-01.json
new file mode 100644
index 0000000000000..7bd528937129b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/button-styles-type_2017-08-03-22-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Button: Merge the ISplitButtonStyles into IButtonStyles",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
index ff757518b972c..7ce3ba64f8eac 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
@@ -5,7 +5,6 @@ import { IRenderFunction } from '../../Utilities';
 import { IContextualMenuProps } from '../../ContextualMenu';
 import { IIconProps, IconName } from '../../Icon';
 import { IStyle, ITheme } from '../../Styling';
-import { ISplitButtonStyles } from './SplitButton/SplitButton.Props';
 
 export interface IButton {
   /**
@@ -35,7 +34,7 @@ export interface IButtonProps extends React.AllHTMLAttributes<HTMLAnchorElement
   /**
    * Custom styling for individual elements within the button DOM.
    */
-  styles?: ISplitButtonStyles;
+  styles?: IButtonStyles;
 
   /**
    * Theme provided by HOC.
@@ -313,4 +312,43 @@ export interface IButtonStyles {
    */
   screenReaderText?: IStyle;
 
+  /**
+   * Style override for the container div around a SplitButton element
+   */
+  splitButtonContainer?: IStyle;
+
+  /**
+   * Style override for the container div around a SplitButton element in a disabled state
+   */
+  splitButtonContainerDisabled?: IStyle;
+
+  /**
+   * Style override for the SplitButton menu button
+   */
+  splitButtonMenuButton?: IStyle;
+
+  /**
+   * Style override for the SplitButton menu button element in a disabled state.
+   */
+  splitButtonMenuButtonDisabled?: IStyle;
+
+  /**
+   * Style override for the SplitButton menu button element in a checked state
+   */
+  splitButtonMenuButtonChecked?: IStyle;
+
+  /**
+   * Style override for the SplitButton menu button element in an expanded state
+   */
+  splitButtonMenuButtonExpanded?: IStyle;
+
+  /**
+   * Style override for the SplitButton menu icon element
+   */
+  splitButtonMenuIcon?: IStyle;
+
+  /**
+   * Style override for the SplitButton menu icon element in a disabled state
+   */
+  splitButtonMenuIconDisabled?: IStyle;
 }
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
index 3794f5d37d602..a49b4c2ed6a98 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
@@ -1,5 +1,4 @@
 import { IButtonStyles } from '../Button.Props';
-import { ISplitButtonStyles } from '../SplitButton/SplitButton.Props';
 import {
   ITheme,
   mergeStyleSets
@@ -20,7 +19,7 @@ export const getStyles = memoizeFunction((
   customStyles?: IButtonStyles
 ): IButtonStyles => {
   let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
-  let splitButtonStyles: ISplitButtonStyles = getSplitButtonStyles(theme);
+  let splitButtonStyles: IButtonStyles = getSplitButtonStyles(theme);
   let commandButtonStyles: IButtonStyles = {
     root: {
       borderWidth: '0',
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
index d46276fe3a836..888db7bf0da47 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
@@ -1,5 +1,4 @@
 import { IButtonStyles } from '../Button.Props';
-import { ISplitButtonStyles } from '../SplitButton/SplitButton.Props';
 import {
   ITheme,
   mergeStyleSets
@@ -24,7 +23,7 @@ export const getStyles = memoizeFunction((
     theme,
     customStyles
   );
-  let splitButtonStyles: ISplitButtonStyles = getSplitButtonStyles(theme);
+  let splitButtonStyles: IButtonStyles = getSplitButtonStyles(theme);
   let compoundButtonStyles: IButtonStyles = {
     root: {
       maxWidth: '280px',
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
index 897dfe5bede3d..e0cd64673e72b 100644
--- a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
@@ -1,5 +1,4 @@
 import { IButtonStyles } from '../Button.Props';
-import { ISplitButtonStyles } from '../SplitButton/SplitButton.Props';
 import {
   ITheme,
   mergeStyleSets,
@@ -24,7 +23,7 @@ export const getStyles = memoizeFunction((
   focusColor?: string
 ): IButtonStyles => {
   let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme, focusInset, focusColor);
-  let splitButtonStyles: ISplitButtonStyles = getSplitButtonStyles(theme);
+  let splitButtonStyles: IButtonStyles = getSplitButtonStyles(theme);
   let defaultButtonStyles: IButtonStyles = {
     root: {
       minWidth: DEFAULT_BUTTON_MINWIDTH,
diff --git a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
index 1598f34b35d8d..06432043fe7d5 100644
--- a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
@@ -1,5 +1,4 @@
 import { IButtonStyles } from '../Button.Props';
-import { ISplitButtonStyles } from '../SplitButton/SplitButton.Props';
 import {
   ITheme,
   mergeStyleSets
@@ -20,7 +19,7 @@ export const getStyles = memoizeFunction((
   customStyles?: IButtonStyles
 ): IButtonStyles => {
   let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
-  let splitButtonStyles: ISplitButtonStyles = getSplitButtonStyles(theme);
+  let splitButtonStyles: IButtonStyles = getSplitButtonStyles(theme);
   let iconButtonStyles: IButtonStyles = {
     root: {
       padding: '0 4px',
diff --git a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
index c2f5ad3b743e6..c53c3c2e2c1f9 100644
--- a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
@@ -1,5 +1,4 @@
 import { IButtonStyles } from '../Button.Props';
-import { ISplitButtonStyles } from '../SplitButton/SplitButton.Props';
 import {
   ITheme,
   mergeStyleSets
@@ -17,7 +16,7 @@ export const getStyles = memoizeFunction((
   customStyles?: IButtonStyles
 ): IButtonStyles => {
   let { palette } = theme;
-  let splitButtonStyles: ISplitButtonStyles = getSplitButtonStyles(theme);
+  let splitButtonStyles: IButtonStyles = getSplitButtonStyles(theme);
   let defaultButtonStyles: IButtonStyles = getDefaultButtonStyles(
     theme,
     customStyles,
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.Props.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.Props.ts
deleted file mode 100644
index 2bf9e52f4e9bb..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.Props.ts
+++ /dev/null
@@ -1,46 +0,0 @@
-import { Button } from '../Button';
-import { IStyle } from '../../../Styling';
-import { IButtonStyles } from '../Button.Props';
-
-export interface ISplitButtonStyles extends IButtonStyles {
-  /**
-     * Style override for the container div around a SplitButton element
-     */
-  splitButtonContainer?: IStyle;
-
-  /**
-   * Style override for the container div around a SplitButton element in a disabled state
-   */
-  splitButtonContainerDisabled?: IStyle;
-
-  /**
-   * Style override for the SplitButton menu button
-   */
-  splitButtonMenuButton?: IStyle;
-
-  /**
-   * Style override for the SplitButton menu button element in a disabled state.
-   */
-  splitButtonMenuButtonDisabled?: IStyle;
-
-  /**
-   * Style override for the SplitButton menu button element in a checked state
-   */
-  splitButtonMenuButtonChecked?: IStyle;
-
-  /**
-   * Style override for the SplitButton menu button element in an expanded state
-   */
-  splitButtonMenuButtonExpanded?: IStyle;
-
-  /**
-   * Style override for the SplitButton menu icon element
-   */
-  splitButtonMenuIcon?: IStyle;
-
-  /**
-   * Style override for the SplitButton menu icon element in a disabled state
-   */
-  splitButtonMenuIconDisabled?: IStyle;
-
-}
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
index 7801eb303669e..69d0c6d888514 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
@@ -1,4 +1,4 @@
-import { ISplitButtonStyles } from '../SplitButton/SplitButton.Props';
+import { IButtonStyles } from '../Button.Props';
 import {
   ITheme,
   mergeStyleSets
@@ -10,9 +10,9 @@ const DEFAULT_PADDING = '0 4px';
 
 export const getStyles = memoizeFunction((
   theme: ITheme,
-  customStyles?: ISplitButtonStyles
-): ISplitButtonStyles => {
-  let iconButtonStyles: ISplitButtonStyles = {
+  customStyles?: IButtonStyles
+): IButtonStyles => {
+  let iconButtonStyles: IButtonStyles = {
     splitButtonContainer: {
       position: 'relative',
       display: 'inline-block',
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
index d83cbb50c1001..5c3c4a57aa8ef 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
-import { DefaultButton, IconButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
-import { ISplitButtonStyles } from '../SplitButton/SplitButton.Props';
+import { DefaultButton, IconButton, IButtonProps, IButtonStyles } from 'office-ui-fabric-react/lib/Button';
 import { Label } from 'office-ui-fabric-react/lib/Label';
 
 export class ButtonSplitExample extends React.Component<IButtonProps, {}> {
@@ -48,7 +47,7 @@ export class ButtonSplitCustomExample extends React.Component<IButtonProps, {}>
 
   public render() {
     let { disabled, checked } = this.props;
-    const style: ISplitButtonStyles = { splitButtonMenuButton: { backgroundColor: 'white', width: '10px' }, splitButtonMenuIcon: { fontSize: '7px' } };
+    const style: IButtonStyles = { splitButtonMenuButton: { backgroundColor: 'white', width: '10px' }, splitButtonMenuIcon: { fontSize: '7px' } };
 
     return (
       <div>

From b7b031bb833cf4ce042a951228a3c6a63a7386fa Mon Sep 17 00:00:00 2001
From: ycoco <ycocococo6256@gmail.com>
Date: Thu, 3 Aug 2017 18:13:52 -0700
Subject: [PATCH 0358/1641] Dropdown: Added multi-select support for dropdown
 (#2386)

* first draft

* add multi selection examples

* minor fix

* modify selections of the example

* fix suggestions

* minor fix

* fix style

* rush change

* add more comment

* fix comment

* Update coco-mutiChoice_2017-08-03-23-14.json
---
 .../coco-mutiChoice_2017-08-03-23-14.json     |  11 +
 package.json                                  |   2 +-
 .../src/components/Dropdown/Dropdown.Props.ts |  18 +-
 .../src/components/Dropdown/Dropdown.tsx      | 205 ++++++++++++++----
 .../examples/Dropdown.Basic.Example.tsx       |  95 +++++++-
 5 files changed, 284 insertions(+), 47 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/coco-mutiChoice_2017-08-03-23-14.json

diff --git a/common/changes/office-ui-fabric-react/coco-mutiChoice_2017-08-03-23-14.json b/common/changes/office-ui-fabric-react/coco-mutiChoice_2017-08-03-23-14.json
new file mode 100644
index 0000000000000..353020df2f8c5
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/coco-mutiChoice_2017-08-03-23-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: added `multiSelect` attribute, which controls multi-item selection. Added `selectedKeys` to `IDropdown` which provides access to all selected keys, in addition to `defaultSelectedKeys` and `selectedKeys` props.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "t-yikche@microsoft.com"
+}
diff --git a/package.json b/package.json
index 2d2155069e67e..f8a2a7fdd8306 100644
--- a/package.json
+++ b/package.json
@@ -28,4 +28,4 @@
     "gulp": "^3.9.1",
     "yargs": "^6.5.0"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
index 962f1f2ad6c82..1bb131f0b219c 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
@@ -28,10 +28,26 @@ export interface IDropdownProps extends ISelectableDroppableTextProps<HTMLDivEle
   /**
    * Optional custom renderer for selected option displayed in input
    */
-  onRenderTitle?: IRenderFunction<IDropdownOption>;
+  onRenderTitle?: IRenderFunction<IDropdownOption | IDropdownOption[]>;
 
   responsiveMode?: ResponsiveMode;
 
+  /**
+   * Optional mode indicates if multi-choice selections is allowed.  Default to false
+   */
+  multiSelect?: boolean;
+
+  /**
+   * Keys that will be initially used to set selected items.
+   */
+  defaultSelectedKeys?: string[] | number[];
+
+  /**
+  * Keys of the selected items. If you provide this, you must maintain selection
+  * state by observing onChange events and passing a new value in when changed.
+  */
+  selectedKeys?: string[] | number[];
+
   /**
    * Deprecated at v0.52.0, use 'disabled' instead.
    * @deprecated
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 00c784e4e57d5..993eab3b43589 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { IDropdownProps, IDropdownOption, DropdownMenuItemType } from './Dropdown.Props';
+import { Checkbox } from '../../Checkbox';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { Callout } from '../../Callout';
 import { Label } from '../../Label';
@@ -31,6 +32,7 @@ export interface IDropdownInternalProps extends IDropdownProps, IWithResponsiveM
 export interface IDropdownState {
   isOpen?: boolean;
   selectedIndex?: number;
+  selectedIndexes?: number[];
 }
 
 @withResponsiveMode
@@ -66,17 +68,30 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     });
 
     this._warnMutuallyExclusive({
-      'defaultSelectedKey': 'selectedKey'
+      'defaultSelectedKey': 'selectedKey',
+      'defaultSelectedKeys': 'selectedKeys',
+      'selectedKeys': 'selectedKey',
+      'multiSelect': 'defaultSelectedKey',
+      'selectedKey': 'multiSelect'
     });
 
     this._id = props.id || getId('Dropdown');
 
-    let selectedKey = props.defaultSelectedKey !== undefined ? props.defaultSelectedKey : props.selectedKey;
-
     this.state = {
-      isOpen: false,
-      selectedIndex: this._getSelectedIndex(props.options, selectedKey!)
+      isOpen: false
     };
+    if (this.props.multiSelect) {
+      let selectedKeys = props.defaultSelectedKeys !== undefined ? props.defaultSelectedKeys : props.selectedKeys;
+      this.state = {
+        selectedIndexes: this._getSelectedIndexes(props.options, selectedKeys!)
+      };
+    } else {
+      let selectedKey = props.defaultSelectedKey !== undefined ? props.defaultSelectedKey : props.selectedKey;
+      this.state = {
+        selectedIndex: this._getSelectedIndex(props.options, selectedKey!)
+      };
+    }
+
   }
 
   public componentWillReceiveProps(newProps: IDropdownProps) {
@@ -84,9 +99,15 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     // state if the key or options change.
     if (newProps.selectedKey !== undefined &&
       (newProps.selectedKey !== this.props.selectedKey || newProps.options !== this.props.options)) {
-      this.setState({
-        selectedIndex: this._getSelectedIndex(newProps.options, newProps.selectedKey)
-      });
+      if (this.props.multiSelect) {
+        this.setState({
+          selectedIndexes: this._getSelectedIndexes(newProps.options, newProps.selectedKeys)
+        });
+      } else {
+        this.setState({
+          selectedIndex: this._getSelectedIndex(newProps.options, newProps.selectedKey)
+        });
+      }
     }
   }
 
@@ -112,8 +133,9 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
       onRenderContainer = this._onRenderContainer,
       onRenderPlaceHolder = this._onRenderPlaceHolder
     } = this.props;
-    let { isOpen, selectedIndex } = this.state;
-    let selectedOption = options[selectedIndex as number];
+    let { isOpen, selectedIndex, selectedIndexes } = this.state;
+    let selectedOption = this.props.multiSelect ? selectedIndexes && this._getAllSelectedOptions(options, selectedIndexes)
+      : options[selectedIndex as number];
     let divProps = getNativeProps(this.props, divProperties);
 
     // Remove this deprecation workaround at 1.0.0
@@ -192,25 +214,54 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   public setSelectedIndex(index: number) {
-    let { onChanged, options, selectedKey } = this.props;
-    let { selectedIndex } = this.state;
+    let { onChanged, options, selectedKey, selectedKeys } = this.props;
+    let { selectedIndex, selectedIndexes } = this.state;
+    let checked: boolean = selectedIndexes ? selectedIndexes.indexOf(index) > -1 : false;
 
     index = Math.max(0, Math.min(options.length - 1, index));
 
     if (index !== selectedIndex) {
       if (selectedKey === undefined) {
         // Set the selected option if this is an uncontrolled component
-        this.setState({
-          selectedIndex: index
-        });
+        if (this.props.multiSelect) {
+          let newIndexes = selectedIndexes ? this._copyArray(selectedIndexes) : [];
+          if (checked) {
+            let position = newIndexes.indexOf(index);
+            if (position > -1) {
+              // unchecked the current one
+              newIndexes.splice(position, 1);
+            }
+          } else {
+            // add the new selected index into the existing one
+            newIndexes.push(index);
+          }
+          this.setState({
+            selectedIndexes: newIndexes
+          });
+        } else {
+          this.setState({
+            selectedIndex: index
+          });
+        }
       }
-
       if (onChanged) {
-        onChanged(options[index], index);
+        // for single-select, option passed in will always be selected.
+        // for multi-select, flip the checked value
+        let changedOpt = options[index];
+        changedOpt.selected = this.props.multiSelect ? !checked : true;
+        onChanged(changedOpt, index);
       }
     }
   }
 
+  private _copyArray(array: any[]): any[] {
+    let newArray = [];
+    for (let element of array) {
+      newArray.push(element);
+    }
+    return newArray;
+  }
+
   /**
    * Finds the next valid Dropdown option and sets the selected index to it.
    * @param stepValue Value of how many items the function should traverse.  Should be -1 or 1.
@@ -254,8 +305,17 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
 
   // Render text in dropdown input
   @autobind
-  private _onRenderTitle(item: IDropdownOption): JSX.Element {
-    return <span>{ item.text }</span>;
+  private _onRenderTitle(item: IDropdownOption | IDropdownOption[]): JSX.Element {
+    let displayTxt: string = '';
+    if (this.props.multiSelect && Array.isArray(item)) {
+      for (let i = 0; i < item.length; i++) {
+        displayTxt += item[i].text;
+        displayTxt += (i === item.length - 1) ? '' : ',';
+      }
+    } else {
+      displayTxt = (item as IDropdownOption).text;
+    }
+    return <span>{ displayTxt }</span>;
   }
 
   // Render placeHolder text in dropdown input
@@ -373,26 +433,52 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   @autobind
   private _renderOption(item: IDropdownOption): JSX.Element {
     let { onRenderOption = this._onRenderOption } = this.props;
+    let { selectedIndexes } = this.state;
     let id = this._id;
+    let isItemSelected;
+    if (this.props.multiSelect) {
+      isItemSelected = item.index && selectedIndexes ? selectedIndexes.indexOf(item.index) > -1 : false;
+    }
     return (
-      <CommandButton
-        id={ id + '-list' + item.index }
-        ref={ Dropdown.Option + item.index }
-        key={ item.key }
-        data-index={ item.index }
-        data-is-focusable={ true }
-        className={ css(
-          'ms-Dropdown-item', styles.item, {
-            ['is-selected ' + styles.itemIsSelected]: this.state.selectedIndex === item.index,
-            ['is-disabled ' + styles.itemIsDisabled]: this.props.disabled === true
-          }
-        ) }
-        onClick={ () => this._onItemClick(item.index!) }
-        role='option'
-        aria-selected={ this.state.selectedIndex === item.index ? 'true' : 'false' }
-        ariaLabel={ item.ariaLabel || item.text }
-        title={ item.text }
-      > { onRenderOption(item, this._onRenderOption) }</CommandButton>
+      !this.props.multiSelect ?
+        <CommandButton
+          id={ id + '-list' + item.index }
+          ref={ Dropdown.Option + item.index }
+          key={ item.key }
+          data-index={ item.index }
+          data-is-focusable={ true }
+          className={ css(
+            'ms-Dropdown-item', styles.item, {
+              ['is-selected ' + styles.itemIsSelected]: this.state.selectedIndex === item.index,
+              ['is-disabled ' + styles.itemIsDisabled]: this.props.disabled === true
+            }
+          ) }
+          onClick={ () => this._onItemClick(item.index!) }
+          role='option'
+          aria-selected={ this.state.selectedIndex === item.index ? 'true' : 'false' }
+          ariaLabel={ item.ariaLabel || item.text }
+          title={ item.text }
+        > { onRenderOption(item, this._onRenderOption) }</CommandButton>
+        :
+        <Checkbox
+          id={ id + '-list' + item.index }
+          ref={ Dropdown.Option + item.index }
+          key={ item.key }
+          data-index={ item.index }
+          data-is-focusable={ true }
+          onChange={ () => this._onItemClick(item.index!) }
+          label={ item.text }
+          className={ css(
+            'ms-ColumnManagementPanel-checkbox',
+            'ms-Dropdown-item', styles.item, {
+              ['is-selected ' + styles.itemIsSelected]: isItemSelected,
+              ['is-disabled ' + styles.itemIsDisabled]: isItemSelected
+            }
+          ) }
+          role='option'
+          aria-selected={ isItemSelected ? 'true' : 'false' }
+          checked={ isItemSelected }
+        >{ onRenderOption(item, this._onRenderOption) } </Checkbox>
     );
   }
 
@@ -409,9 +495,12 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
 
   private _onItemClick(index: number) {
     this.setSelectedIndex(index);
-    this.setState({
-      isOpen: false
-    });
+    if (!this.props.multiSelect) {
+      // only close the callout when it's in single-select mode
+      this.setState({
+        isOpen: false
+      });
+    }
   }
 
   @autobind
@@ -420,7 +509,31 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     this._dropDown.focus();
   }
 
-  private _getSelectedIndex(options: IDropdownOption[], selectedKey: string | number) {
+  // Get all selected indexes for multi-select mode
+  private _getSelectedIndexes(options: IDropdownOption[], selectedKey: any): number[] {
+    let selectedIndex: number[] = [];
+    if (!selectedKey) {
+      return selectedIndex;
+    }
+    for (let key of selectedKey) {
+      selectedIndex.push(this._getSelectedIndex(options, key));
+    }
+    return selectedIndex;
+  }
+
+  // Get all selected options for multi-select mode
+  private _getAllSelectedOptions(options: IDropdownOption[], selectedIndex: number[]) {
+    let selectedOptions: IDropdownOption[] = [];
+    for (let index of selectedIndex) {
+      selectedOptions.push(options[index]);
+    }
+    if (selectedOptions.length < 1) {
+      return undefined;
+    }
+    return selectedOptions;
+  }
+
+  private _getSelectedIndex(options: IDropdownOption[], selectedKey: string | number): number {
     return findIndex(options, (option => (option.isSelected || option.selected || (selectedKey != null) && option.key === selectedKey)));
   }
 
@@ -444,7 +557,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
       }
     }
     let newIndex: number | undefined;
-    const selectedIndex = this.state.selectedIndex!;
+    const selectedIndex = this.props.multiSelect ? (this.state.selectedIndexes ? this.state.selectedIndexes[0] : -1) : this.state.selectedIndex!;
 
     switch (ev.which) {
       case KeyCodes.enter:
@@ -464,11 +577,15 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
         break;
 
       case KeyCodes.up:
-        newIndex = this._moveIndex(-1, selectedIndex - 1, selectedIndex);
+        if (this.props.multiSelect) {
+          this.setState({ isOpen: true });
+        } else {
+          newIndex = this._moveIndex(-1, selectedIndex - 1, selectedIndex);
+        }
         break;
 
       case KeyCodes.down:
-        if (ev.altKey || ev.metaKey) {
+        if (ev.altKey || ev.metaKey || this.props.multiSelect) {
           this.setState({ isOpen: true });
         } else {
           newIndex = this._moveIndex(1, selectedIndex + 1, selectedIndex);
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
index c011635919b0a..de794b1ec0f7d 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Dropdown, DropdownMenuItemType } from 'office-ui-fabric-react/lib/Dropdown';
+import { Dropdown, DropdownMenuItemType, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
 import './Dropdown.Basic.Example.scss';
 
 export class DropdownBasicExample extends React.Component<any, any> {
@@ -62,6 +62,7 @@ export class DropdownBasicExample extends React.Component<any, any> {
           selectedKey={ selectedItem && selectedItem.key }
           onChanged={ (item) => this.setState({ selectedItem: item }) }
           onBlur={ () => console.log('onBlur called') }
+          placeHolder='Select an Option'
           options={
             [
               { key: 'A', text: 'Option a' },
@@ -76,6 +77,68 @@ export class DropdownBasicExample extends React.Component<any, any> {
           }
         />
 
+        <Dropdown
+          placeHolder='Select options'
+          label='Multi-Select uncontrolled example:'
+          defaultSelectedKeys={ ['Apple', 'Banana'] }
+          onChanged={ (item) => this.changeState(item) }
+          onBlur={ () => console.log('onBlur called') }
+          multiSelect
+          options={
+            [
+              { key: 'Header2', text: 'Fruits', itemType: DropdownMenuItemType.Header },
+              { key: 'Apple', text: 'apple' },
+              { key: 'Banana', text: 'banana' },
+              { key: 'Orange', text: 'orange' },
+              { key: 'Grape', text: 'grape' },
+              { key: 'divider_1', text: '-', itemType: DropdownMenuItemType.Divider },
+              { key: 'Header3', text: 'Lanuages', itemType: DropdownMenuItemType.Header },
+              { key: 'English', text: 'english' },
+              { key: 'French', text: 'french' },
+              { key: 'Germany', text: 'germany' },
+            ]
+          }
+        />
+
+        <Dropdown
+          placeHolder='Select options'
+          label='Multi-Select controlled example:'
+          selectedKeys={ selectedItem && selectedItem.key }
+          onChanged={ (item) => this.onChangeMultiSelect(item) }
+          onBlur={ () => console.log('onBlur called') }
+          multiSelect
+          options={
+            [
+              { key: 'Header4', text: 'Colors', itemType: DropdownMenuItemType.Header },
+              { key: 'red', text: 'Red' },
+              { key: 'green', text: 'Green' },
+              { key: 'blue', text: 'Blue' },
+              { key: 'yellow', text: 'Yellow' },
+              { key: 'divider_2', text: '-', itemType: DropdownMenuItemType.Divider },
+              { key: 'Header5', text: 'Flower', itemType: DropdownMenuItemType.Header },
+              { key: 'rose', text: 'Rose' },
+              { key: 'lily', text: 'Lily' },
+              { key: 'sunflower', text: 'Sunflower' },
+            ]
+          }
+        />
+        <Dropdown
+          label='Disabled uncontrolled example with defaultSelectedKey:'
+          defaultSelectedKeys={ ['GG', 'FF'] }
+          multiSelect
+          options={
+            [
+              { key: 'AA', text: 'Option a' },
+              { key: 'BB', text: 'Option b' },
+              { key: 'CC', text: 'Option c' },
+              { key: 'DD', text: 'Option d' },
+              { key: 'EE', text: 'Option e' },
+              { key: 'FF', text: 'Option f' },
+              { key: 'GG', text: 'Option g' },
+            ]
+          }
+          disabled={ true }
+        />
       </div>
 
     );
@@ -90,4 +153,34 @@ export class DropdownBasicExample extends React.Component<any, any> {
     return list;
   }
 
+  public changeState(item: IDropdownOption) {
+    console.log('here is the things updating...' + item.key + ' ' + item.text + ' ' + item.selected);
+    this.setState({ selectedItem: item });
+  }
+
+  public onChangeMultiSelect(item: IDropdownOption) {
+    let updatedSelectedItem = this.state.selectedItem ? this.copyArray(this.state.selectedItem) : [];
+    if (item.selected) {
+      // add the option if it's checked
+      updatedSelectedItem.push(item);
+    } else {
+      // remove the option if it's unchecked
+      let currIndex = updatedSelectedItem.indexOf(item.index);
+      if (currIndex > -1) {
+        updatedSelectedItem.splice(currIndex, 1);
+      }
+    }
+    this.setState({
+      selectedItem: updatedSelectedItem
+    });
+  }
+
+  public copyArray(array: any[]): any[] {
+    let newArray: any[] = [];
+    for (let i = 0; i < array.length; i++) {
+      newArray[i] = array[i];
+    }
+    return newArray;
+  }
+
 }

From 7b6124e4236d8977f270f369c7dd48a76cf841f0 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Thu, 3 Aug 2017 18:48:19 -0700
Subject: [PATCH 0359/1641] Expand hit-target for Selection checkbox in
 DetailsList (#2391)

* Expand hit target of DetailsRow checkbox

* Update change output
---
 .../details-tap_2017-08-04-00-17.json                 | 11 +++++++++++
 .../src/components/DetailsList/DetailsRow.tsx         |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/details-tap_2017-08-04-00-17.json

diff --git a/common/changes/office-ui-fabric-react/details-tap_2017-08-04-00-17.json b/common/changes/office-ui-fabric-react/details-tap_2017-08-04-00-17.json
new file mode 100644
index 0000000000000..e0a731dd5d04a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/details-tap_2017-08-04-00-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Expand hit target of DetailsRow checkbox",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index 7574b967fa612..83ef855cb4588 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -229,6 +229,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
           <div
             role='gridcell'
             aria-colindex={ 0 }
+            data-selection-toggle={ true }
             className={ css('ms-DetailsRow-cell', 'ms-DetailsRow-cellCheck', checkStyles.owner, styles.cell, styles.checkCell) }
           >
             { onRenderCheck({

From a230ec9fb1b83d215f7281cc3ee75f05d90f91f3 Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Thu, 3 Aug 2017 19:17:29 -0700
Subject: [PATCH 0360/1641] Theming: new semantic slots for warnings and legacy
 theme semantic slots (#2390)

* Theming: new semantic slots for warnings

* change file

* fixes
---
 .github/CODEOWNERS                            |  4 +--
 ...cyThemeSemanticSlots_2017-08-04-00-08.json | 11 +++++++
 packages/styling/src/interfaces/IPalette.ts   |  5 +--
 .../styling/src/interfaces/ISemanticColors.ts | 32 +++++++++++++++----
 packages/styling/src/styles/theme.ts          | 16 ++++++----
 5 files changed, 50 insertions(+), 18 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/phkuo-legacyThemeSemanticSlots_2017-08-04-00-08.json

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index b4a16f77db86f..604a763d3fb0b 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -81,7 +81,7 @@
     packages/office-ui-fabric-react/src/components/TeachingBubble/*   @micahgodbolt
     # packages/office-ui-fabric-react/src/components/TextField/*
     # packages/office-ui-fabric-react/src/components/Theme/*
-    # packages/office-ui-fabric-react/src/components/Toggle/*
+    packages/office-ui-fabric-react/src/components/Toggle/*  @phkuo
     packages/office-ui-fabric-react/src/components/Tooltip/*  @micahgodbolt
 
   # packages/office-ui-fabric-react/src/demo/*
@@ -89,6 +89,6 @@
   # packages/office-ui-fabric-react/src/visualtest/*
 
 # packages/office-ui-fabric-react-tslint/*
-# packages/styling/*
+packages/styling/*  @dzearing @phkuo
 # packages/utilities/*
 
diff --git a/common/changes/@uifabric/styling/phkuo-legacyThemeSemanticSlots_2017-08-04-00-08.json b/common/changes/@uifabric/styling/phkuo-legacyThemeSemanticSlots_2017-08-04-00-08.json
new file mode 100644
index 0000000000000..1690fff62d59b
--- /dev/null
+++ b/common/changes/@uifabric/styling/phkuo-legacyThemeSemanticSlots_2017-08-04-00-08.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Theming: add semantic slots for warnings, and also legacy theme semantic slots",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/styling/src/interfaces/IPalette.ts b/packages/styling/src/interfaces/IPalette.ts
index 611f1810648c6..61f4498fb6e8e 100644
--- a/packages/styling/src/interfaces/IPalette.ts
+++ b/packages/styling/src/interfaces/IPalette.ts
@@ -48,7 +48,7 @@ export interface IPalette {
   themeLighterAlt: string;
 
   /**
-   * Color code for black.
+   * Color code for the strongest color, which is black in the default theme. This is a very light color in inverted themes.
    */
   black: string;
 
@@ -113,7 +113,8 @@ export interface IPalette {
   neutralLighterAlt: string;
 
   /**
-   * Color code for white.
+   * Color code for the softest color, which is white in the default theme. This is a very dark color in dark themes.
+   * This is the page background.
    */
   white: string;
 
diff --git a/packages/styling/src/interfaces/ISemanticColors.ts b/packages/styling/src/interfaces/ISemanticColors.ts
index c7d5b3d17f999..a250348b1ae30 100644
--- a/packages/styling/src/interfaces/ISemanticColors.ts
+++ b/packages/styling/src/interfaces/ISemanticColors.ts
@@ -13,12 +13,19 @@
  * [hovered/pressed/disabled state] – One of these states, if applicable. Each of these states are mutually exclusive.
  * Pressed styles overwrite hovered styles, and disabled elements cannot be hovered or pressed.   
  *  
- * ## Base/Body
+ * ## Base Slots
  *
- * A basic set of slots that provide many default body styles, such as text, subtext, disabled colors, error text, and so on.
+ * A basic set of slots that provide many default body styles, such as text, subtext, disabled colors, and so on.
  * If a category doesn't provide the slot you're looking for, use one from this category.
  * For example, the placeholder text on a text input field has no corresponding slot in its category,
- * so you'd use the bodySubtextColor from this category. 
+ * so you'd use the bodySubtextColor from this category.
+ *
+ * ## Invariants
+ *
+ * When color has meaning, we do not want to change the color much theme to theme. For example, we
+ * will always want errors to be some shade of red, but we will need to tweak the exact shade so it's
+ * legible depending on whether it's an inverted theme or not.
+ * Invariant colors should almost never be changed by the theme, the defaults should suffice.
  *  
  * ## Input Controls 
  *
@@ -38,6 +45,8 @@
 export interface ISemanticColors {
   /* ANY ADDITIONS/REMOVALS HERE MUST ALSO BE MADE TO \packages\styling\src\utilities\theme.ts:_makeSemanticColorsFromPalette() */
 
+  //// Base slots
+
   /**
    * The default color for backgrounds.
    */
@@ -78,7 +87,8 @@ export interface ISemanticColors {
    */
   focusBorder: string;
 
-  // Invariants - slots that rarely change color theme-to-theme because the color has meaning
+  //// Invariants - slots that rarely change color theme-to-theme because the color has meaning
+
   /**
    * The background for errors, if necessary, or highlighting the section of the page where the error is present.
    */
@@ -87,8 +97,16 @@ export interface ISemanticColors {
    * The default color of error text.
    */
   errorText: string;
+  /**
+   * Background for blocking issues, which is more severe than a warning, but not as bad as an error.
+   */
+  blockingBackground: string;
+  /**
+   * Background for warning messages.
+   */
+  warningBackground: string;
 
-  // Input controls slots (text fields, checkboxes, radios...)
+  //// Input controls slots (text fields, checkboxes, radios...)
 
   /**
    * The border of an input control in its resting, unchecked state; e.g. the box of an unchecked checkbox.
@@ -120,7 +138,7 @@ export interface ISemanticColors {
    */
   inputFocusBorderAlt: string;
 
-  // Menus, popups, etc
+  //// Menus, popups, etc
 
   /**
    * The background of a hovered menu item.
@@ -142,7 +160,7 @@ export interface ISemanticColors {
    */
   menuHeader: string;
 
-  // Lists
+  //// Lists
 
   /**
    * The background color for the entire list.
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index 40429ce1fd0ad..a7ee93cbe9a66 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -15,7 +15,7 @@ import { loadTheme as legacyLoadTheme } from '@microsoft/load-themed-styles';
 
 let _theme: ITheme = {
   palette: DefaultPalette,
-  semanticColors: _makeSemanticColorsFromPalette(DefaultPalette),
+  semanticColors: _makeSemanticColorsFromPalette(DefaultPalette, false),
   fonts: DefaultFontStyles,
   isInverted: false
 };
@@ -48,8 +48,8 @@ export function getTheme(): ITheme {
 export function loadTheme(theme: IPartialTheme): ITheme {
   _theme = createTheme(theme);
 
-  // Load the legacy theme from the palette.
-  legacyLoadTheme(_theme.palette as {});
+  // Invoke the legacy method of theming the page as well.
+  legacyLoadTheme({ ..._theme.palette, ..._theme.semanticColors });
 
   GlobalSettings.setValue(ThemeSettingName, _theme);
 
@@ -68,14 +68,14 @@ export function createTheme(theme: IPartialTheme): ITheme {
       ...DefaultFontStyles,
       ...theme.fonts
     },
-    semanticColors: { ..._makeSemanticColorsFromPalette(newPalette), ...theme.semanticColors },
+    semanticColors: { ..._makeSemanticColorsFromPalette(newPalette, !!theme.isInverted), ...theme.semanticColors },
     isInverted: !!theme.isInverted
   } as ITheme;
 }
 
 // Generates all the semantic slot colors based on the Fabric palette.
 // We'll use these as fallbacks for semantic slots that the passed in theme did not define.
-function _makeSemanticColorsFromPalette(p: IPalette): ISemanticColors {
+function _makeSemanticColorsFromPalette(p: IPalette, isInverted: boolean): ISemanticColors {
   return {
     bodyBackground: p.white,
     bodyText: p.neutralPrimary,
@@ -88,8 +88,10 @@ function _makeSemanticColorsFromPalette(p: IPalette): ISemanticColors {
 
     focusBorder: p.black,
 
-    errorBackground: '#fde7e9',
-    errorText: p.redDark,
+    errorBackground: !isInverted ? 'rgba(232, 17, 35, .2)' : 'rgba(232, 17, 35, .5)',
+    errorText: !isInverted ? p.redDark : '#ff5f5f',
+    blockingBackground: !isInverted ? 'rgba(234, 67, 0, .2)' : 'rgba(234, 67, 0, .5)',
+    warningBackground: !isInverted ? 'rgba(255, 185, 0, .2)' : 'rgba(255, 251, 0, .6)',
 
     inputBorder: p.neutralTertiary,
     inputBorderHovered: p.neutralPrimary,

From 7956a3996fa829659c05ee74f626dab41bf5b434 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 3 Aug 2017 20:50:29 -0700
Subject: [PATCH 0361/1641] ResizeGroup: Add another example use case to demo
 site (#2387)

* Initial skeleton of example

* More styling

* Refactoring

* Use the props to render boxes

* Prevent wrapping

* Refactor styles

* Get rid of warning

* Add cahce keys

* Rush change

* Fix linter
---
 ...-flex-layout-support_2017-08-03-21-26.json | 11 +++
 .../ResizeGroup/ResizeGroupPage.tsx           |  8 +-
 .../examples/ResizeGroup.FlexBox.Example.tsx  | 90 +++++++++++++++++++
 3 files changed, 108 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/resizegroup-flex-layout-support_2017-08-03-21-26.json
 create mode 100644 packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/resizegroup-flex-layout-support_2017-08-03-21-26.json b/common/changes/office-ui-fabric-react/resizegroup-flex-layout-support_2017-08-03-21-26.json
new file mode 100644
index 0000000000000..8b3cf8d3b7974
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/resizegroup-flex-layout-support_2017-08-03-21-26.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ResizeGroup: Add another example use case to demo site",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
index c5d395e5d0cc1..a529096e397f5 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
@@ -7,9 +7,12 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { ResizeGroupOverflowSetExample } from './examples/ResizeGroup.OverflowSet.Example';
+import { FlexBoxResizeGroupExample } from './examples/ResizeGroup.FlexBox.Example';
 
 const ResizeGroupBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx') as string;
 
+const ResizeGroupFlexBoxExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx') as string;
+
 export class ResizeGroupPage extends React.Component<any, any> {
   public render() {
     return (
@@ -18,9 +21,12 @@ export class ResizeGroupPage extends React.Component<any, any> {
         componentName='ResizeGroupExample'
         exampleCards={
           <LayerHost>
-            <ExampleCard title='ResizeGroup' code={ ResizeGroupBasicExampleCode }>
+            <ExampleCard title='Use ResizeGroup to move commands into an overflow menu' code={ ResizeGroupBasicExampleCode }>
               <ResizeGroupOverflowSetExample />
             </ExampleCard>
+            <ExampleCard title='Use ResizeGroup to prevent two groups of items from overlapping' code={ ResizeGroupFlexBoxExampleCode }>
+              <FlexBoxResizeGroupExample />
+            </ExampleCard>
           </LayerHost>
         }
         propertiesTables={
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx
new file mode 100644
index 0000000000000..938ee1b0e9d36
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx
@@ -0,0 +1,90 @@
+import * as React from 'react';
+import { BaseComponent, memoizeFunction } from 'office-ui-fabric-react/lib/Utilities';
+import { mergeStyles, IStyle } from 'office-ui-fabric-react/lib/Styling';
+import { ResizeGroup } from 'office-ui-fabric-react/lib/ResizeGroup';
+
+const leftRightBoxClassName =
+  mergeStyles({
+    display: 'flex',
+    justifyContent: 'space-between',
+    whiteSpace: 'nowrap'
+  }) as string;
+
+const getNumberedBoxClassName = memoizeFunction((backgroundColor: string) => {
+  return mergeStyles({
+    display: 'inline-block',
+    textAlign: 'center',
+    fontSize: '20px',
+    lineHeight: '50px',
+    height: '50px',
+    width: '50px',
+    marginLeft: '10px',
+    marginRight: '10px',
+    backgroundColor
+  }) as string;
+});
+
+interface IBoxWithLabelProps {
+  label: string;
+  backgroundColor: string;
+}
+
+interface ILeftRightBoxSetProps {
+  leftCount: number;
+  rightCount: number;
+  cacheKey: string;
+}
+
+const BoxWithLabel: React.StatelessComponent<IBoxWithLabelProps> =
+  (props: IBoxWithLabelProps) => (<div className={ getNumberedBoxClassName(props.backgroundColor) } >{ props.label }</div >);
+
+function renderBoxWithLabels(count: number, backgroundColor: string): JSX.Element[] {
+  let result: JSX.Element[] = [];
+  for (let i = 1; i <= count; i += 1) {
+    result.push(<BoxWithLabel
+      label={ `${i}` }
+      backgroundColor={ backgroundColor }
+      key={ `${backgroundColor}-${i}` } />);
+  }
+  return result;
+}
+
+const LeftRightBoxSet: React.StatelessComponent<ILeftRightBoxSetProps> =
+  (props: ILeftRightBoxSetProps) => (
+    <div className={ leftRightBoxClassName }>
+      <div>
+        { renderBoxWithLabels(props.leftCount, 'orange') }
+      </div>
+      <div>
+        { renderBoxWithLabels(props.rightCount, 'green') }
+      </div>
+    </div >
+  );
+
+function onReduceData(props: ILeftRightBoxSetProps): ILeftRightBoxSetProps | undefined {
+  if (props.leftCount === 0 && props.rightCount === 0) {
+    return undefined;
+  }
+
+  let result: ILeftRightBoxSetProps;
+  if (props.leftCount > props.rightCount) {
+    result = { ...props, leftCount: props.leftCount - 1 };
+  } else {
+    result = { ...props, rightCount: props.rightCount - 1 };
+  }
+
+  // Update the cache key
+  return { ...result, cacheKey: `${result.leftCount + result.rightCount}` };
+}
+
+export class FlexBoxResizeGroupExample extends BaseComponent<{}, {}> {
+  public render() {
+    let data: ILeftRightBoxSetProps = { leftCount: 5, rightCount: 5, cacheKey: '10' };
+    return (
+      <ResizeGroup
+        data={ data }
+        onRenderData={ (scaledData: ILeftRightBoxSetProps) => <LeftRightBoxSet {...scaledData} /> }
+        onReduceData={ onReduceData }
+      />);
+  }
+}
\ No newline at end of file

From dbdbe0392f4fee67432d9e0ba04bcfcce9113a3b Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 4 Aug 2017 10:11:48 +0000
Subject: [PATCH 0362/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...cyThemeSemanticSlots_2017-08-04-00-08.json | 11 ----
 .../button-styles-type_2017-08-03-22-01.json  | 11 ----
 .../coco-mutiChoice_2017-08-03-23-14.json     | 11 ----
 ...datepicker-icon-size_2017-08-02-16-51.json | 11 ----
 .../details-tap_2017-08-04-00-17.json         | 11 ----
 ...-flex-layout-support_2017-08-03-21-26.json | 11 ----
 ...wliu-scrollable-pane_2017-07-19-22-52.json | 11 ----
 ...plepicker-owa-review_2017-08-02-19-30.json | 11 ----
 packages/example-app-base/package.json        |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 51 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 18 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/CHANGELOG.json               | 14 +++++
 packages/styling/CHANGELOG.md                 |  9 +++-
 packages/styling/package.json                 |  2 +-
 19 files changed, 98 insertions(+), 98 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/phkuo-legacyThemeSemanticSlots_2017-08-04-00-08.json
 delete mode 100644 common/changes/office-ui-fabric-react/button-styles-type_2017-08-03-22-01.json
 delete mode 100644 common/changes/office-ui-fabric-react/coco-mutiChoice_2017-08-03-23-14.json
 delete mode 100644 common/changes/office-ui-fabric-react/datepicker-icon-size_2017-08-02-16-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/details-tap_2017-08-04-00-17.json
 delete mode 100644 common/changes/office-ui-fabric-react/resizegroup-flex-layout-support_2017-08-03-21-26.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-edwliu-scrollable-pane_2017-07-19-22-52.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-peoplepicker-owa-review_2017-08-02-19-30.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index aaf53841aadbe..8cf89036f1a7d 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.28.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.30.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index ab700614d01ac..c152e13f8d79f 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.28.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.30.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 610283e40d108..6b455e4b288b7 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -35,7 +35,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.28.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.30.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 71a86ef9b1b06..06aa8a7b8eda3 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.28.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.30.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/styling/phkuo-legacyThemeSemanticSlots_2017-08-04-00-08.json b/common/changes/@uifabric/styling/phkuo-legacyThemeSemanticSlots_2017-08-04-00-08.json
deleted file mode 100644
index 1690fff62d59b..0000000000000
--- a/common/changes/@uifabric/styling/phkuo-legacyThemeSemanticSlots_2017-08-04-00-08.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Theming: add semantic slots for warnings, and also legacy theme semantic slots",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/button-styles-type_2017-08-03-22-01.json b/common/changes/office-ui-fabric-react/button-styles-type_2017-08-03-22-01.json
deleted file mode 100644
index 7bd528937129b..0000000000000
--- a/common/changes/office-ui-fabric-react/button-styles-type_2017-08-03-22-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Button: Merge the ISplitButtonStyles into IButtonStyles",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/coco-mutiChoice_2017-08-03-23-14.json b/common/changes/office-ui-fabric-react/coco-mutiChoice_2017-08-03-23-14.json
deleted file mode 100644
index 353020df2f8c5..0000000000000
--- a/common/changes/office-ui-fabric-react/coco-mutiChoice_2017-08-03-23-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: added `multiSelect` attribute, which controls multi-item selection. Added `selectedKeys` to `IDropdown` which provides access to all selected keys, in addition to `defaultSelectedKeys` and `selectedKeys` props.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "t-yikche@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/datepicker-icon-size_2017-08-02-16-51.json b/common/changes/office-ui-fabric-react/datepicker-icon-size_2017-08-02-16-51.json
deleted file mode 100644
index 07322ce1725f5..0000000000000
--- a/common/changes/office-ui-fabric-react/datepicker-icon-size_2017-08-02-16-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Datepicker: updated icon size",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/details-tap_2017-08-04-00-17.json b/common/changes/office-ui-fabric-react/details-tap_2017-08-04-00-17.json
deleted file mode 100644
index e0a731dd5d04a..0000000000000
--- a/common/changes/office-ui-fabric-react/details-tap_2017-08-04-00-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Expand hit target of DetailsRow checkbox",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/resizegroup-flex-layout-support_2017-08-03-21-26.json b/common/changes/office-ui-fabric-react/resizegroup-flex-layout-support_2017-08-03-21-26.json
deleted file mode 100644
index 8b3cf8d3b7974..0000000000000
--- a/common/changes/office-ui-fabric-react/resizegroup-flex-layout-support_2017-08-03-21-26.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ResizeGroup: Add another example use case to demo site",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-edwliu-scrollable-pane_2017-07-19-22-52.json b/common/changes/office-ui-fabric-react/v-edwliu-scrollable-pane_2017-07-19-22-52.json
deleted file mode 100644
index fd3026d2b39d0..0000000000000
--- a/common/changes/office-ui-fabric-react/v-edwliu-scrollable-pane_2017-07-19-22-52.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add ScrollablePane and Sticky components",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-edwliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-peoplepicker-owa-review_2017-08-02-19-30.json b/common/changes/office-ui-fabric-react/v-krbrow-peoplepicker-owa-review_2017-08-02-19-30.json
deleted file mode 100644
index 5becb5c266090..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-peoplepicker-owa-review_2017-08-02-19-30.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "PeoplePicker: Improved keyboard support and font size updates.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 6d6f2194ac83a..4f56a23f4bfed 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -48,7 +48,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.15.4 <1.0.0",
+    "@uifabric/styling": ">=0.17.0 <1.0.0",
     "@uifabric/utilities": ">=4.9.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index cd7735b7f63bf..f49f18a91f1df 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,57 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.30.0",
+      "tag": "office-ui-fabric-react_v4.30.0",
+      "date": "Fri, 04 Aug 2017 10:11:48 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "ff44b6b9c31ceac21ade3f66c356e49bdee0287c",
+            "comment": "Button: Merge the ISplitButtonStyles into IButtonStyles"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "90e90f0999ed4040061d5bb2a18f7ccedb9755e9",
+            "comment": "Datepicker: updated icon size"
+          },
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "7b6124e4236d8977f270f369c7dd48a76cf841f0",
+            "comment": "Expand hit target of DetailsRow checkbox"
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "7956a3996fa829659c05ee74f626dab41bf5b434",
+            "comment": "ResizeGroup: Add another example use case to demo site"
+          },
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "8b5f91d7accb2087de8cc60dc75b823efc400ebf",
+            "comment": "PeoplePicker: Improved keyboard support and font size updates."
+          }
+        ],
+        "minor": [
+          {
+            "author": "ycoco <ycocococo6256@gmail.com>",
+            "commit": "b7b031bb833cf4ce042a951228a3c6a63a7386fa",
+            "comment": "Dropdown: added `multiSelect` attribute, which controls multi-item selection. Added `selectedKeys` to `IDropdown` which provides access to all selected keys, in addition to `defaultSelectedKeys` and `selectedKeys` props."
+          },
+          {
+            "author": "Eddie Liu <leddie24@gmail.com>",
+            "commit": "2c7fbb2c4a9fe78f2c92ebc3f9e58a5d152d3073",
+            "comment": "Add ScrollablePane and Sticky components"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.16.0 <1.0.0` to `>=0.17.0 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.29.0",
       "tag": "office-ui-fabric-react_v4.29.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 9ce608ca157c2..ad8a748d8a345 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,22 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 03 Aug 2017 10:13:03 GMT and should not be manually modified.
+This log was last generated on Fri, 04 Aug 2017 10:11:48 GMT and should not be manually modified.
+
+## 4.30.0
+Fri, 04 Aug 2017 10:11:48 GMT
+
+### Minor changes
+
+- Dropdown: added `multiSelect` attribute, which controls multi-item selection. Added `selectedKeys` to `IDropdown` which provides access to all selected keys, in addition to `defaultSelectedKeys` and `selectedKeys` props.
+- Add ScrollablePane and Sticky components
+
+### Patches
+
+- Button: Merge the ISplitButtonStyles into IButtonStyles
+- Datepicker: updated icon size
+- Expand hit target of DetailsRow checkbox
+- ResizeGroup: Add another example use case to demo site
+- PeoplePicker: Improved keyboard support and font size updates.
 
 ## 4.29.0
 Thu, 03 Aug 2017 10:13:03 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index b489b9ed8c406..950200afb127a 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.29.0",
+  "version": "4.30.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
     "@uifabric/utilities": ">=4.9.0 <5.0.0",
-    "@uifabric/styling": ">=0.16.0 <1.0.0",
+    "@uifabric/styling": ">=0.17.0 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 837c42cfcc374..08f1a505a4446 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.17.0",
+      "tag": "@uifabric/styling_v0.17.0",
+      "date": "Fri, 04 Aug 2017 10:11:48 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "a230ec9fb1b83d215f7281cc3ee75f05d90f91f3",
+            "comment": "Theming: add semantic slots for warnings, and also legacy theme semantic slots"
+          }
+        ]
+      }
+    },
     {
       "version": "0.16.0",
       "tag": "@uifabric/styling_v0.16.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index de72901e9bfac..7a53e0fdbe0e2 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 03 Aug 2017 10:13:03 GMT and should not be manually modified.
+This log was last generated on Fri, 04 Aug 2017 10:11:48 GMT and should not be manually modified.
+
+## 0.17.0
+Fri, 04 Aug 2017 10:11:48 GMT
+
+### Minor changes
+
+- Theming: add semantic slots for warnings, and also legacy theme semantic slots
 
 ## 0.16.0
 Thu, 03 Aug 2017 10:13:03 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 52a24d539214b..f085a682f0da8 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.16.0",
+  "version": "0.17.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 8a227a402e06291fddf4cd5571b0e3d9f90a11bc Mon Sep 17 00:00:00 2001
From: Christopher Schleiden <cschleiden@live.de>
Date: Fri, 4 Aug 2017 08:18:51 -0700
Subject: [PATCH 0363/1641] Update CODEOWNERS (#2395)

---
 .github/CODEOWNERS | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index 604a763d3fb0b..06cefbee30eb8 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -58,7 +58,7 @@
     # packages/office-ui-fabric-react/src/components/Label/*
     # packages/office-ui-fabric-react/src/components/Layer/*
     # packages/office-ui-fabric-react/src/components/Link/*
-    # packages/office-ui-fabric-react/src/components/List/*
+    # packages/office-ui-fabric-react/src/components/List/*  @cschleiden
     # packages/office-ui-fabric-react/src/components/MarqueeSelection/*
     # packages/office-ui-fabric-react/src/components/MessageBar/*
     # packages/office-ui-fabric-react/src/components/Modal/*
@@ -71,7 +71,7 @@
     # packages/office-ui-fabric-react/src/components/Pivot/*
     # packages/office-ui-fabric-react/src/components/Popup/*
     # packages/office-ui-fabric-react/src/components/ProgressIndicator/*
-    # packages/office-ui-fabric-react/src/components/Rating/*
+    # packages/office-ui-fabric-react/src/components/Rating/*  @cschleiden
     packages/office-ui-fabric-react/src/components/ResizeGroup/*  @micahgodbolt
     # packages/office-ui-fabric-react/src/components/SearchBox/*
     # packages/office-ui-fabric-react/src/components/Slider/*

From 36ce1d12e6ba50ee97860100d1560365c193e3dd Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Fri, 4 Aug 2017 08:42:02 -0700
Subject: [PATCH 0364/1641] ResizeGroup: Prevent rendering to the hidden div on
 prop updates that has an initial data that is in the cache" (#2392)

* Prepare to export more than one method for resizeGroup state management.

* Fix the bug

* Add tests

* Update naming

* Rush change
---
 ...esizegroup-unmount-2_2017-08-04-01-59.json | 11 +++
 .../ResizeGroup/ResizeGroup.test.tsx          | 69 +++++++++++++------
 .../components/ResizeGroup/ResizeGroup.tsx    | 23 +++++--
 3 files changed, 77 insertions(+), 26 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/resizegroup-unmount-2_2017-08-04-01-59.json

diff --git a/common/changes/office-ui-fabric-react/resizegroup-unmount-2_2017-08-04-01-59.json b/common/changes/office-ui-fabric-react/resizegroup-unmount-2_2017-08-04-01-59.json
new file mode 100644
index 0000000000000..f2c6bffbd0c34
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/resizegroup-unmount-2_2017-08-04-01-59.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ResizeGroup: Prevent rendering to the hidden div on prop updates that has an initial data that is in the cache",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
index b695a039dcb96..b8d42ae913f59 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
@@ -45,7 +45,7 @@ describe('ResizeGroup', () => {
     it('does not provide a new state when there is no container width provided or data to measure', () => {
       const resizeGroupProps = getRequiredResizeGroupProps();
       const resizeGroupState: IResizeGroupState = {};
-      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getNextResizeGroupState = getNextResizeGroupStateProvider().getNextState;
       const getMeasuredElementWidthStub = sinon.stub();
 
       let result = getNextResizeGroupState(resizeGroupProps,
@@ -60,7 +60,7 @@ describe('ResizeGroup', () => {
       const dataToMeasure = { foo: 'bar' };
       const resizeGroupProps = getRequiredResizeGroupProps();
       const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'shrink' };
-      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getNextResizeGroupState = getNextResizeGroupStateProvider().getNextState;
       const getMeasuredElementWidthStub = sinon.stub();
       getMeasuredElementWidthStub.returns(25);
 
@@ -83,7 +83,7 @@ describe('ResizeGroup', () => {
       const resizeGroupProps = getRequiredResizeGroupProps();
       const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'shrink' };
       resizeGroupProps.onReduceData.returns({ index: 4 });
-      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getNextResizeGroupState = getNextResizeGroupStateProvider().getNextState;
       const getMeasuredElementWidthStub = sinon.stub();
       getMeasuredElementWidthStub.returns(25);
 
@@ -105,7 +105,7 @@ describe('ResizeGroup', () => {
 
       let measurementCache = getMeasurementCache();
       measurementCache.addMeasurementToCache(dataToMeasure, 40);
-      const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache);
+      const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache).getNextState;
 
       const resizeGroupProps = getRequiredResizeGroupProps();
       const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'shrink' };
@@ -134,7 +134,7 @@ describe('ResizeGroup', () => {
       measurementCache.addMeasurementToCache(dataArray[0], 50);
       measurementCache.addMeasurementToCache(dataArray[1], 40);
       measurementCache.addMeasurementToCache(dataArray[2], 5);
-      const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache);
+      const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache).getNextState;
 
       const resizeGroupProps = getRequiredResizeGroupProps();
       resizeGroupProps.onReduceData.onFirstCall().returns(dataArray[1]);
@@ -163,7 +163,7 @@ describe('ResizeGroup', () => {
 
       let measurementCache = getMeasurementCache();
       measurementCache.addMeasurementToCache(dataArray[0], 50);
-      const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache);
+      const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache).getNextState;
 
       const resizeGroupProps = getRequiredResizeGroupProps();
       resizeGroupProps.onReduceData.onFirstCall().returns(dataArray[1]);
@@ -191,7 +191,7 @@ describe('ResizeGroup', () => {
       const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'shrink' };
       resizeGroupProps.onReduceData.returns(undefined);
 
-      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getNextResizeGroupState = getNextResizeGroupStateProvider().getNextState;
 
       const getMeasuredElementWidthStub = sinon.stub();
       getMeasuredElementWidthStub.returns(25);
@@ -217,7 +217,7 @@ describe('ResizeGroup', () => {
       let measurementCache = getMeasurementCache();
       measurementCache.addMeasurementToCache(dataArray[0], 50);
       measurementCache.addMeasurementToCache(dataArray[1], 40);
-      const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache);
+      const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache).getNextState;
 
       const resizeGroupProps = getRequiredResizeGroupProps();
       resizeGroupProps.onReduceData.onFirstCall().returns(dataArray[1]);
@@ -244,7 +244,7 @@ describe('ResizeGroup', () => {
       const dataToMeasure = { foo: 'bar' };
       const resizeGroupProps = getRequiredResizeGroupProps();
       const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'shrink', };
-      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getNextResizeGroupState = getNextResizeGroupStateProvider().getNextState;
       const getMeasuredElementWidthStub = sinon.stub();
 
       let result = getNextResizeGroupState(resizeGroupProps,
@@ -263,7 +263,7 @@ describe('ResizeGroup', () => {
       const reducedWidth = 40;
       const renderedData = { foo: 'bar' };
       const resizeGroupProps = getRequiredResizeGroupProps();
-      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getNextResizeGroupState = getNextResizeGroupStateProvider().getNextState;
       const getMeasuredElementWidthStub = sinon.stub();
 
       // Set the initial window width
@@ -298,7 +298,7 @@ describe('ResizeGroup', () => {
       const increasedWidth = 60;
       const renderedData = { foo: 'bar' };
       const resizeGroupProps = { ...getRequiredResizeGroupProps(), data: { foo: 'initialData' } };
-      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getNextResizeGroupState = getNextResizeGroupStateProvider().getNextState;
       const getMeasuredElementWidthStub = sinon.stub();
 
       // Set the initial window width
@@ -330,7 +330,7 @@ describe('ResizeGroup', () => {
       const dataToMeasure = { foo: 'bar' };
       const resizeGroupProps = getRequiredResizeGroupProps();
       const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'grow' };
-      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getNextResizeGroupState = getNextResizeGroupStateProvider().getNextState;
       const getMeasuredElementWidthStub = sinon.stub();
       getMeasuredElementWidthStub.returns(25);
 
@@ -353,7 +353,7 @@ describe('ResizeGroup', () => {
       const resizeGroupProps = getRequiredResizeGroupProps();
       resizeGroupProps.onReduceData.returns({ index: 7 });
       const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'grow' };
-      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getNextResizeGroupState = getNextResizeGroupStateProvider().getNextState;
       const getMeasuredElementWidthStub = sinon.stub();
       getMeasuredElementWidthStub.returns(100);
 
@@ -377,7 +377,7 @@ describe('ResizeGroup', () => {
       onGrowData.returns({ index: 2 });
       const resizeGroupProps = { ...getRequiredResizeGroupProps(), onGrowData };
       const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'grow' };
-      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getNextResizeGroupState = getNextResizeGroupStateProvider().getNextState;
       const getMeasuredElementWidthStub = sinon.stub();
       getMeasuredElementWidthStub.returns(25);
 
@@ -400,7 +400,7 @@ describe('ResizeGroup', () => {
       const onGrowData = sinon.stub();
       const resizeGroupProps = { ...getRequiredResizeGroupProps(), onGrowData };
       const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'grow' };
-      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getNextResizeGroupState = getNextResizeGroupStateProvider().getNextState;
       const getMeasuredElementWidthStub = sinon.stub();
       getMeasuredElementWidthStub.returns(75);
 
@@ -425,7 +425,7 @@ describe('ResizeGroup', () => {
       onGrowData.returns(undefined);
       const resizeGroupProps = { ...getRequiredResizeGroupProps(), onGrowData };
       const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'grow' };
-      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getNextResizeGroupState = getNextResizeGroupStateProvider().getNextState;
       const getMeasuredElementWidthStub = sinon.stub();
       getMeasuredElementWidthStub.returns(25);
 
@@ -452,7 +452,7 @@ describe('ResizeGroup', () => {
       const onGrowData = sinon.stub();
       onGrowData.returns({ index: 4 });
       const resizeGroupProps = { ...getRequiredResizeGroupProps(), data: { foo: 'initialData' }, onGrowData };
-      const getNextResizeGroupState = getNextResizeGroupStateProvider();
+      const getNextResizeGroupState = getNextResizeGroupStateProvider().getNextState;
       const getMeasuredElementWidthStub = sinon.stub();
 
       // Set the initial window width
@@ -486,7 +486,7 @@ describe('ResizeGroup', () => {
 
       const measurementCache = getMeasurementCache();
       measurementCache.addMeasurementToCache(dataToMeasure, 40);
-      const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache);
+      const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache).getNextState;
 
       const onGrowData = sinon.stub();
       const resizeGroupProps = { ...getRequiredResizeGroupProps(), onGrowData };
@@ -516,7 +516,7 @@ describe('ResizeGroup', () => {
       measurementCache.addMeasurementToCache(dataArray[0], 50);
       measurementCache.addMeasurementToCache(dataArray[1], 70);
       measurementCache.addMeasurementToCache(dataArray[2], 150);
-      const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache);
+      const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache).getNextState;
 
       const onGrowData = sinon.stub();
       onGrowData.onFirstCall().returns(dataArray[1]);
@@ -545,7 +545,7 @@ describe('ResizeGroup', () => {
 
       let measurementCache = getMeasurementCache();
       measurementCache.addMeasurementToCache(dataArray[0], 40);
-      const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache);
+      const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache).getNextState;
 
       const onGrowData = sinon.stub();
       onGrowData.onFirstCall().returns(dataArray[1]);
@@ -572,7 +572,7 @@ describe('ResizeGroup', () => {
     const initialWidth = 50;
     const renderedData = { index: 4 };
     const resizeGroupProps = getRequiredResizeGroupProps();
-    const getNextResizeGroupState = getNextResizeGroupStateProvider();
+    const getNextResizeGroupState = getNextResizeGroupStateProvider().getNextState;
     const getMeasuredElementWidthStub = sinon.stub();
     getMeasuredElementWidthStub.returns(100);
 
@@ -607,4 +607,31 @@ describe('ResizeGroup', () => {
     expect(getMeasuredElementWidthStub.callCount).to.equal(1);
     expect(resizeGroupProps.onReduceData.callCount).to.equal(1);
   });
+
+  it('does not render to the hidden div when there is no dataToMeasure', () => {
+    const resizeGroupStateProvider = getNextResizeGroupStateProvider();
+
+    let result = resizeGroupStateProvider.shouldRenderDataToMeasureInHiddenDiv(undefined);
+
+    expect(result).to.equal(false);
+  });
+
+  it('does render to the hidden div when there is dataToMeasure', () => {
+    const resizeGroupStateProvider = getNextResizeGroupStateProvider();
+
+    let result = resizeGroupStateProvider.shouldRenderDataToMeasureInHiddenDiv({ index: 18 });
+
+    expect(result).to.equal(true);
+  });
+
+  it('does not render to the hidden div when there is dataToMeasure that is in the cache', () => {
+    let data = { index: 8, cacheKey: 'myCoolCacheKey' };
+    const measurementCache = getMeasurementCache();
+    measurementCache.addMeasurementToCache(data, 12);
+    const resizeGroupStateProvider = getNextResizeGroupStateProvider(measurementCache);
+
+    let result = resizeGroupStateProvider.shouldRenderDataToMeasureInHiddenDiv(data);
+
+    expect(result).to.equal(false);
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index df0bda6529bd2..00fea97d17202 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -217,10 +217,10 @@ export const getNextResizeGroupStateProvider = (measurementCache = getMeasuremen
     return { ...nextState, measureContainer: false };
   }
 
-  return (props: IResizeGroupProps,
+  function getNextState(props: IResizeGroupProps,
     currentState: IResizeGroupState,
     getElementToMeasureWidth: () => number,
-    newContainerWidth?: number): IResizeGroupState | undefined => {
+    newContainerWidth?: number): IResizeGroupState | undefined {
     // If there is no new container width or data to measure, there is no need for a new state update
     if (newContainerWidth === undefined && currentState.dataToMeasure === undefined) {
       return undefined;
@@ -256,11 +256,24 @@ export const getNextResizeGroupStateProvider = (measurementCache = getMeasuremen
     }
 
     return nextState;
+  }
+
+  function shouldRenderDataToMeasureInHiddenDiv(dataToMeasure: any | undefined): boolean {
+    if (!dataToMeasure || _measurementCache.getCachedMeasurement(dataToMeasure) !== undefined) {
+      return false;
+    }
+
+    return true;
+  }
+
+  return {
+    getNextState,
+    shouldRenderDataToMeasureInHiddenDiv
   };
 };
 
 export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupState> {
-  private _getNextResizeGroupState = getNextResizeGroupStateProvider();
+  private _nextResizeGroupStateProvider = getNextResizeGroupStateProvider();
   private _root: HTMLElement;
   private _measured: HTMLElement;
 
@@ -279,7 +292,7 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
 
     return (
       <div className={ css('ms-ResizeGroup') } ref={ this._resolveRef('_root') }>
-        { dataToMeasure && (
+        { this._nextResizeGroupStateProvider.shouldRenderDataToMeasureInHiddenDiv(dataToMeasure) && (
           <div className={ css(styles.measured) } ref={ this._resolveRef('_measured') }>
             { onRenderData(dataToMeasure) }
           </div>
@@ -318,7 +331,7 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
       if (this.state.measureContainer) {
         containerWidth = this._root.getBoundingClientRect().width;
       }
-      let nextState = this._getNextResizeGroupState(this.props,
+      let nextState = this._nextResizeGroupStateProvider.getNextState(this.props,
         this.state,
         () => this._measured.scrollWidth,
         containerWidth);

From b0b4d93a4375433f03885fbbebc9a715aa4ec34d Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Fri, 4 Aug 2017 13:21:58 -0700
Subject: [PATCH 0365/1641] Callout: Fix callout beak position comparison
 (#2399)

* fix callout compare so that the beak comparision is actually correct

* adding change file
---
 ...ct-fixcalloutpositioncompare_2017-08-04-18-06.json | 11 +++++++++++
 ...ct-fixcalloutpositioncompare_2017-08-04-18-06.json | 11 +++++++++++
 ...ct-fixcalloutpositioncompare_2017-08-04-18-06.json | 11 +++++++++++
 ...ct-fixcalloutpositioncompare_2017-08-04-18-06.json | 11 +++++++++++
 ...ct-fixcalloutpositioncompare_2017-08-04-18-06.json | 11 +++++++++++
 .../src/components/Callout/CalloutContent.tsx         |  4 ++--
 6 files changed, 57 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
 create mode 100644 common/changes/@uifabric/fabric-website/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
 create mode 100644 common/changes/@uifabric/styling/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
 create mode 100644 common/changes/@uifabric/utilities/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
 create mode 100644 common/changes/office-ui-fabric-react/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json

diff --git a/common/changes/@uifabric/example-app-base/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json b/common/changes/@uifabric/example-app-base/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
new file mode 100644
index 0000000000000..e4ff247bb6846
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json b/common/changes/@uifabric/fabric-website/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
new file mode 100644
index 0000000000000..60628424a4dfe
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json b/common/changes/@uifabric/styling/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
new file mode 100644
index 0000000000000..7285eaba1d8e4
--- /dev/null
+++ b/common/changes/@uifabric/styling/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json b/common/changes/@uifabric/utilities/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
new file mode 100644
index 0000000000000..a1f24b04e40a9
--- /dev/null
+++ b/common/changes/@uifabric/utilities/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json b/common/changes/office-ui-fabric-react/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
new file mode 100644
index 0000000000000..346a251ac3651
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Callout: Fix positioning comparision so it correctly repositions if the beak left/right position has changed\"",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index 196844bc2df40..abfafc10ddf22 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -80,7 +80,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
 
   public componentWillUpdate(newProps: ICalloutProps) {
     // If the target element changed, find the new one. If we are tracking target with class name, always find element because we do not know if fabric has rendered a new element and disposed the old element.
-    if (newProps.targetElement !== this.props.targetElement || newProps.target !== this.props.target || typeof(newProps.target) === 'string' || newProps.target instanceof String) {
+    if (newProps.targetElement !== this.props.targetElement || newProps.target !== this.props.target || typeof (newProps.target) === 'string' || newProps.target instanceof String) {
       let newTarget = newProps.targetElement ? newProps.targetElement : newProps.target;
       this._maxHeight = undefined;
       this._setTargetWindowAndElement(newTarget!);
@@ -321,7 +321,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
     if (positions.beakPosition.top.toFixed(2) !== newPosition.beakPosition.top.toFixed(2)) {
       return false;
     }
-    if (positions.beakPosition.top.toFixed(2) !== newPosition.beakPosition.top.toFixed(2)) {
+    if (positions.beakPosition.left.toFixed(2) !== newPosition.beakPosition.left.toFixed(2)) {
       return false;
     }
 

From 5c8d23dabbf43aff06ffe5ce4a99f0d3b577ea06 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Fri, 4 Aug 2017 13:33:23 -0700
Subject: [PATCH 0366/1641] Textfield: removed background from textfield
 internal field (#2344)

* Textfield: removed background from textfield internal field

* change file
---
 .../textfield-clipping-fix_2017-07-31-16-40.json      | 11 +++++++++++
 .../src/components/TextField/TextField.scss           |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/textfield-clipping-fix_2017-07-31-16-40.json

diff --git a/common/changes/office-ui-fabric-react/textfield-clipping-fix_2017-07-31-16-40.json b/common/changes/office-ui-fabric-react/textfield-clipping-fix_2017-07-31-16-40.json
new file mode 100644
index 0000000000000..71c35a33b4314
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/textfield-clipping-fix_2017-07-31-16-40.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Textfield: removed background from textfield internal field",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index d20c63bf7ec52..9b9ec1f8904ef 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -103,6 +103,7 @@ $field-error-color: $errorTextColor;
   font-size: $ms-font-size-m;
   border-radius: 0;
   border: none;
+  background: none;
   color: $field-text-color;
   @include ms-padding(0, 12px, 0, 12px);
   width: 100%;

From 2c4a1740d6e9495c9eca4c27f8c8fb6c70b2c61a Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 4 Aug 2017 14:36:55 -0700
Subject: [PATCH 0367/1641] Adding 4 icons to the codes map that are missing.
 (#2402)

* Adding 4 icons that are missing from the codes map but are in the font.

* Adding change file.

* Removing one code which doesn't work.
---
 .../@uifabric/styling/iconfix_2017-08-04-21-17.json  | 11 +++++++++++
 packages/styling/src/styles/IconCodes.ts             | 12 ++++++++++++
 2 files changed, 23 insertions(+)
 create mode 100644 common/changes/@uifabric/styling/iconfix_2017-08-04-21-17.json

diff --git a/common/changes/@uifabric/styling/iconfix_2017-08-04-21-17.json b/common/changes/@uifabric/styling/iconfix_2017-08-04-21-17.json
new file mode 100644
index 0000000000000..76ac906867066
--- /dev/null
+++ b/common/changes/@uifabric/styling/iconfix_2017-08-04-21-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Adding 4 icons that were missing in the codes map.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/styling/src/styles/IconCodes.ts b/packages/styling/src/styles/IconCodes.ts
index c09b5cf4c54c7..4c86073c46fd1 100644
--- a/packages/styling/src/styles/IconCodes.ts
+++ b/packages/styling/src/styles/IconCodes.ts
@@ -311,6 +311,10 @@ export const IconCodes = {
    * Icon code with the value '\uEA99'.
    */
   broom: '\uEA99',
+  /**
+   * Icon code with the value '\uF24F'.
+   */
+  buildQueue: '\uF24F',
   /**
    * Icon code with the value '\uF0D0'.
    */
@@ -771,6 +775,10 @@ export const IconCodes = {
    * Icon code with the value '\uED76'.
    */
   delveLogo: '\uED76',
+  /**
+   * Icon code with the value '\uF29D'.
+   */
+  deploy: '\uF29D',
   /**
    * Icon code with the value '\uEDC1'.
    */
@@ -1163,6 +1171,10 @@ export const IconCodes = {
    * Icon code with the value '\uE7C1'.
    */
   flag: '\uE7C1',
+  /**
+   * Icon code with the value '\uF1F3'.
+   */
+  flameSolid: '\uF1F3',
   /**
    * Icon code with the value '\uE935'.
    */

From d8ffba67d710b76be69866ab49ca5239b63ae76c Mon Sep 17 00:00:00 2001
From: Manish Dahamiwal <mdhamiwal@gmail.com>
Date: Sat, 5 Aug 2017 09:22:36 +0530
Subject: [PATCH 0368/1641] Dialog: fixing usage of aria attributes (#2365)

* Dialog: fixing aria labelledby and describedby

* change log

* fixing build errors
---
 .../manishda-dialogA11y_2017-08-02-11-58.json |  11 ++
 .../src/components/Dialog/Dialog.test.tsx     | 125 ++++++++++++------
 .../src/components/Dialog/Dialog.tsx          |  59 +++++----
 .../components/Dialog/DialogContent.Props.ts  |  12 +-
 .../src/components/Dialog/DialogContent.tsx   |  18 +--
 .../Dialog/examples/Dialog.Basic.Example.tsx  |   9 +-
 6 files changed, 148 insertions(+), 86 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/manishda-dialogA11y_2017-08-02-11-58.json

diff --git a/common/changes/office-ui-fabric-react/manishda-dialogA11y_2017-08-02-11-58.json b/common/changes/office-ui-fabric-react/manishda-dialogA11y_2017-08-02-11-58.json
new file mode 100644
index 0000000000000..650ac529b08f3
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/manishda-dialogA11y_2017-08-02-11-58.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dialog: fixing accessibility regression",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "manishda@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
index e9fe1aa4ea6b8..d1e54c6f65040 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
@@ -1,66 +1,109 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
-
 import * as ReactDOM from 'react-dom';
 
-import {
-  setWarningCallback,
-} from '@uifabric/utilities';
-
 let { expect } = chai;
+import { mount } from 'enzyme';
 
 import { Dialog } from './Dialog';
+import { DialogType } from './DialogContent.Props';
 
-// export function setWarningCallback(warningCallback: (message: string) => void): void;
+/* tslint:disable:no-unused-expression */// for express fluent assertions
 
 describe('Dialog', () => {
-  beforeEach(() => {
-    setWarningCallback(message => null);
-  });
-  afterEach(() => {
-    [].forEach.call(document.querySelectorAll('body > div'), (div: any) => div.parentNode.removeChild(div));
-
-    expect(document.querySelector('.ms-Dialog')).to.be.null;
-  });
-
-  it('Fires dismissed after closing', () => {
+  it('Fires dismissed after closing', (done) => {
     let dismissedCalled = false;
 
     const handleDismissed = () => {
       dismissedCalled = true;
     };
 
-    const div = document.createElement('div');
-    ReactDOM.render(<Dialog hidden={ false } onDismissed={ handleDismissed } />, div);
-    ReactDOM.render(<Dialog hidden={ true } onDismissed={ handleDismissed } />, div);
-
-    setTimeout(() => {
-      const dialog = document.querySelector('.ms-Dialog');
-      expect(dialog).to.be.null;
+    const wrapper = mount(
+      <Dialog
+        hidden={ false }
+        modalProps={ { onDismissed: handleDismissed } } />
+    );
 
-      expect(dismissedCalled).to.be.true;
-    }, 400);
+    expect(document.querySelector('[role="dialog"]')).to.not.be.null;
+    wrapper.setProps({ hidden: true });
+    wrapper.update();
 
+    // give time for update to complete
+    setTimeout(() => {
+      try {
+        expect(document.querySelector('[role="dialog"]')).to.be.null;
+        expect(dismissedCalled).to.be.true;
+      } catch (e) {
+        done(e);
+      }
+      wrapper.unmount();
+      done();
+    }, 300);
   });
 
-  it('Fires dismissed after hidden', () => {
-    let dismissedCalled = false;
-
-    const handleDismissed = () => {
-      dismissedCalled = true;
-    };
-
-    const div = document.createElement('div');
-    ReactDOM.render(<Dialog hidden={ false } modalProps={ { onDismissed: handleDismissed } } />, div);
-    ReactDOM.render(<Dialog hidden={ true } modalProps={ { onDismissed: handleDismissed } } />, div);
-
-    setTimeout(() => {
-      const dialog = document.querySelector('.ms-Dialog');
-      expect(dialog).to.be.null;
+  it('Properly attaches auto-generated aria attributes IDs', () => {
+    const wrapper = mount(
+      <Dialog
+        hidden={ false }
+        modalProps={ { onDismissed: () => {/* no-op */ } } }
+        dialogContentProps={ {
+          type: DialogType.normal,
+          title: 'sample title',
+          subText: 'Sample subtext'
+        } } />
+    );
+
+    const dialogHTML = document.querySelector('[role="dialog"]');
+    expect(dialogHTML).to.not.be.null;
+    expect(dialogHTML!.getAttribute('aria-labelledby')).to.match(/Dialog[\d+]+-title/, 'aria label should match the pattern');
+    expect(dialogHTML!.getAttribute('aria-describedby')).to.match(/Dialog[\d+]+-subText/, 'aria describeby should match the pattern');
+    wrapper.unmount();
+  });
 
-      expect(dismissedCalled).to.be.true;
-    }, 400);
+  it('Properly attaches IDs when aria-describedby is passed', () => {
+    const subTextAriaId = 'subtextariaid';
+    const wrapper = mount(
+      <Dialog
+        hidden={ false }
+        modalProps={ {
+          onDismissed: () => {/* no-op */ },
+          subtitleAriaId: subTextAriaId,
+        } }
+        dialogContentProps={ {
+          type: DialogType.normal,
+          title: 'sample title',
+          subText: 'Sample subtext'
+        } } />
+    );
+
+    const dialogHTML = document.querySelector('[role="dialog"]');
+    expect(dialogHTML).to.not.be.null;
+    expect(dialogHTML!.getAttribute('aria-labelledby')).to.match(/Dialog[\d+]+-title/, 'aria label should match the pattern');
+    expect(dialogHTML!.getAttribute('aria-describedby')).equals(subTextAriaId, 'aria describeby should match the pattern');
+    wrapper.unmount();
+  });
 
+  it('Properly attaches IDs when aria-labelledby is passed', () => {
+    const titleAriaId = 'titleariaid';
+    const wrapper = mount(
+      <Dialog
+        hidden={ false }
+        modalProps={ {
+          onDismissed: () => {/* no-op */ },
+          titleAriaId: titleAriaId,
+        } }
+        dialogContentProps={ {
+          type: DialogType.normal,
+          title: 'sample title',
+          subText: 'Sample subtext'
+        } } />
+    );
+
+    const dialogHTML = document.querySelector('[role="dialog"]');
+    expect(dialogHTML).to.not.be.null;
+    expect(dialogHTML!.getAttribute('aria-labelledby')).equals(titleAriaId, 'aria label should match the pattern');
+    expect(dialogHTML!.getAttribute('aria-describedby')).to.match(/Dialog[\d+]+-subText/, 'aria describeby should match the pattern');
+    wrapper.unmount();
   });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
index 942d3eabc6c30..c76205e095f82 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import {
-  autobind,
   BaseComponent,
   css,
   getId
@@ -14,13 +13,8 @@ const styles: any = stylesImport;
 
 import { DialogContent } from './DialogContent';
 
-export interface IDialogState {
-  id?: string;
-}
-
 @withResponsiveMode
-export class Dialog extends BaseComponent<IDialogProps, IDialogState> {
-
+export class Dialog extends BaseComponent<IDialogProps, {}> {
   public static defaultProps: IDialogProps = {
     modalProps: {
       isDarkOverlay: true,
@@ -36,12 +30,16 @@ export class Dialog extends BaseComponent<IDialogProps, IDialogState> {
     hidden: true,
   };
 
+  private _id: string;
+  private _defaultTitleTextId: string;
+  private _defaultSubTextId: string;
+
   constructor(props: IDialogProps) {
     super(props);
 
-    this.state = {
-      id: getId('Dialog'),
-    };
+    this._id = getId('Dialog');
+    this._defaultTitleTextId = this._id + '-title';
+    this._defaultSubTextId = this._id + '-subText';
 
     this._warnDeprecations({
       'isOpen': 'hidden',
@@ -88,7 +86,6 @@ export class Dialog extends BaseComponent<IDialogProps, IDialogState> {
       containerClassName,
       hidden
     } = this.props;
-    let { id } = this.state;
 
     return (
       <Modal
@@ -107,20 +104,12 @@ export class Dialog extends BaseComponent<IDialogProps, IDialogState> {
         className={ css('ms-Dialog', className ? className : modalProps!.className) }
         containerClassName={ css(styles.main, containerClassName ? containerClassName : modalProps!.containerClassName) }
         onDismiss={ onDismiss ? onDismiss : modalProps!.onDismiss }
-        subtitleAriaId={
-          this._getAriaLabelId(
-            (ariaDescribedById ? ariaDescribedById : modalProps!.subtitleAriaId) as string,
-            (subText ? subText : modalProps!.subtitleAriaId) as string,
-            id + '-subText'
-          )
-        }
-        titleAriaId={
-          this._getAriaLabelId(
-            (modalProps!.titleAriaId ? modalProps!.titleAriaId : ariaLabelledById) as string,
-            (title ? title : modalProps!.titleAriaId) as string,
-            id + '-title') }
+        subtitleAriaId={ this._getSubTextId() }
+        titleAriaId={ this._getTitleTextId() }
       >
         <DialogContent
+          titleId={ this._defaultTitleTextId }
+          subTextId={ this._defaultSubTextId }
           title={ title }
           subText={ subText }
           showCloseButton={ isBlocking !== undefined ? !isBlocking : !modalProps!.isBlocking }
@@ -132,13 +121,29 @@ export class Dialog extends BaseComponent<IDialogProps, IDialogState> {
         >
           { this.props.children }
         </DialogContent>
-
       </Modal>
     );
   }
 
-  @autobind
-  private _getAriaLabelId(ariaId: string, text: string, alternativeId: string): string {
-    return ariaId || text && alternativeId;
+  private _getSubTextId = (): string | undefined => {
+    let { ariaDescribedById, modalProps, dialogContentProps, subText } = this.props;
+    let id = ariaDescribedById || (modalProps && modalProps.subtitleAriaId);
+
+    if (!id) {
+      id = (subText || (dialogContentProps && dialogContentProps.subText)) && this._defaultSubTextId;
+    }
+
+    return id;
+  }
+
+  private _getTitleTextId = (): string | undefined => {
+    let { ariaLabelledById, modalProps, dialogContentProps, title } = this.props;
+    let id = ariaLabelledById || (modalProps && modalProps.titleAriaId);
+
+    if (!id) {
+      id = (title || (dialogContentProps && dialogContentProps.title)) && this._defaultTitleTextId;
+    }
+
+    return id;
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.Props.ts b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.Props.ts
index 1c2f96797eaa5..bf123e744613b 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.Props.ts
@@ -35,10 +35,20 @@ export interface IDialogContentProps extends React.Props<DialogContent> {
   onDismiss?: (ev?: React.MouseEvent<HTMLButtonElement>) => any;
 
   /**
-  * The subtext to display in the dialog.
+  * The Id for subText container
+  */
+  subTextId?: string;
+
+  /**
+  * The subtext to display in the dialog
   */
   subText?: string;
 
+  /**
+   * The Id for title container
+   */
+  titleId?: string;
+
   /**
   * The title text to display at the top of the dialog.
   */
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx
index c3e73a46a491e..83d490845cbac 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import {
   BaseComponent,
   css,
-  getId
 } from '../../Utilities';
 import { IDialogContentProps, DialogType } from './DialogContent.Props';
 import { IconButton } from '../../Button';
@@ -11,12 +10,8 @@ import { withResponsiveMode } from '../../utilities/decorators/withResponsiveMod
 import * as stylesImport from './Dialog.scss';
 const styles: any = stylesImport;
 
-export interface IDialogContnetState {
-  id?: string;
-}
-
 @withResponsiveMode
-export class DialogContent extends BaseComponent<IDialogContentProps, IDialogContnetState> {
+export class DialogContent extends BaseComponent<IDialogContentProps, {}> {
 
   public static defaultProps: IDialogContentProps = {
     showCloseButton: false,
@@ -27,10 +22,6 @@ export class DialogContent extends BaseComponent<IDialogContentProps, IDialogCon
 
   constructor(props: IDialogContentProps) {
     super(props);
-
-    this.state = {
-      id: getId('Dialog'),
-    };
   }
 
   public render() {
@@ -38,16 +29,17 @@ export class DialogContent extends BaseComponent<IDialogContentProps, IDialogCon
       showCloseButton,
       closeButtonAriaLabel,
       onDismiss,
+      subTextId,
       subText,
+      titleId,
       title,
       type
     } = this.props;
-    let { id } = this.state;
 
     let groupings = this._groupChildren();
     let subTextContent;
     if (subText) {
-      subTextContent = <p className={ css('ms-Dialog-subText', styles.subText) } id={ id + '-subText' }>{ subText }</p>;
+      subTextContent = <p className={ css('ms-Dialog-subText', styles.subText) } id={ subTextId }>{ subText }</p>;
     }
 
     const contentClassName = css(this.props.className, {
@@ -58,7 +50,7 @@ export class DialogContent extends BaseComponent<IDialogContentProps, IDialogCon
     return (
       <div className={ css(contentClassName) }>
         <div className={ css('ms-Dialog-header', styles.header) }>
-          <p className={ css('ms-Dialog-title', styles.title) } id={ id + '-title' } role='heading'>{ title }</p>
+          <p className={ css('ms-Dialog-title', styles.title) } id={ titleId } role='heading'>{ title }</p>
           <div className={ css('ms-Dialog-topButton', styles.topButton) }>
             { this.props.topButtonsProps!.map((props) => (
               <IconButton {...props} />
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
index cf5568bab7b1d..63e1f9b24576b 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
@@ -21,8 +21,9 @@ export class DialogBasicExample extends React.Component<any, any> {
           onClick={ this._showDialog.bind(this) }
           text='Open Dialog'
         />
-        <label id='myLabel' className='screenReaderOnly'>All emails together Your Inbox has changed.
-          No longer does it include favorites, it is a singular destination for your emails.</label>
+        <label id='myLabelId' className='screenReaderOnly'>My sample Label</label>
+        <label id='mySubTextId' className='screenReaderOnly'>My Sample description</label>
+
         <Dialog
           hidden={ this.state.hideDialog }
           onDismiss={ this._closeDialog.bind(this) }
@@ -32,8 +33,8 @@ export class DialogBasicExample extends React.Component<any, any> {
             subText: 'Your Inbox has changed. No longer does it include favorites, it is a singular destination for your emails.'
           } }
           modalProps={ {
-            titleAriaId: 'myLabel',
-            subtitleAriaId: '',
+            titleAriaId: 'myLabelId',
+            subtitleAriaId: 'mySubTextId',
             isBlocking: false,
             containerClassName: 'ms-dialogMainOverride'
           } }

From f88b41c8fa81ae1a673458c8e7824623e82f5ffd Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Fri, 4 Aug 2017 23:00:33 -0700
Subject: [PATCH 0369/1641] Prevent auto-selection of items within a DetailsRow
 when focus enters the area (#2346)

* Fix check visibility on DetailsRow focus

* Respect isSelectedOnFocus in SelectionZone

* Prevet SelectionZone from selecting items when focus first enters the zone

* Update change output
---
 .../no-select-on-focus_2017-07-31-23-49.json  | 11 ++++++++
 .../DetailsList/DetailsRowCheck.scss          |  9 +++++--
 .../src/utilities/selection/SelectionZone.tsx | 27 +++++++++++++++----
 3 files changed, 40 insertions(+), 7 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/no-select-on-focus_2017-07-31-23-49.json

diff --git a/common/changes/office-ui-fabric-react/no-select-on-focus_2017-07-31-23-49.json b/common/changes/office-ui-fabric-react/no-select-on-focus_2017-07-31-23-49.json
new file mode 100644
index 0000000000000..09bf34dd62ce4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/no-select-on-focus_2017-07-31-23-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Prevent auto-selection on focus in DetailsList",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "tmichon@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
index 8cd89296951e9..24f0f6ebb86cf 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
@@ -24,8 +24,13 @@ button.check {
 .owner {
   &.isSelected,
   &.isVisible,
-  &:hover,
-  &:focus {
+  &:hover {
+    .check {
+      opacity: 1;
+    }
+  }
+
+  @include focus(true) {
     .check {
       opacity: 1;
     }
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
index 2ce61c919873f..d4999d479f442 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
@@ -67,6 +67,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   private _isShiftPressed: boolean;
   private _isMetaPressed: boolean;
   private _shouldHandleFocus: boolean;
+  private _shouldHandleFocusTimeoutId: number | undefined;
 
   public componentDidMount() {
     let win = getWindow(this.refs.root);
@@ -107,7 +108,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
    */
   @autobind
   public ignoreNextFocus() {
-    this._shouldHandleFocus = false;
+    this._handleNextFocus(false);
   }
 
   @autobind
@@ -139,12 +140,14 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
           // set anchor only.
           selection.setIndexSelected(index, selection.isIndexSelected(index), true);
         } else {
-          this._onItemSurfaceClick(ev, index);
+          if (this.props.isSelectedOnFocus) {
+            this._onItemSurfaceClick(ev, index);
+          }
         }
       }
     }
 
-    this._shouldHandleFocus = false;
+    this._handleNextFocus(false);
   }
 
   @autobind
@@ -290,7 +293,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     // Ignore key downs from input elements.
     if (this._isInputElement(target)) {
       // A key was pressed while an item in this zone was focused.
-      this._shouldHandleFocus = true;
+      this._handleNextFocus(true);
       return;
     }
 
@@ -342,7 +345,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     }
 
     // A key was pressed while an item in this zone was focused.
-    this._shouldHandleFocus = true;
+    this._handleNextFocus(true);
   }
 
   private _onToggleAllClick(ev: React.MouseEvent<HTMLElement>) {
@@ -501,4 +504,18 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     return true;
   }
 
+  private _handleNextFocus(handleFocus: boolean) {
+    if (this._shouldHandleFocusTimeoutId) {
+      this._async.clearTimeout(this._shouldHandleFocusTimeoutId);
+      this._shouldHandleFocusTimeoutId = undefined;
+    }
+
+    this._shouldHandleFocus = handleFocus;
+
+    if (handleFocus) {
+      this._async.setTimeout(() => {
+        this._shouldHandleFocus = false;
+      }, 100);
+    }
+  }
 }

From fbb5e11a70d6ce02a7ba6231d04d42d0a9f3604d Mon Sep 17 00:00:00 2001
From: Johanna Hawkins <jo.hawkins@hotmail.com>
Date: Sun, 6 Aug 2017 12:44:48 -0700
Subject: [PATCH 0370/1641] Add codeowners for calendar (#2406)

* Date picker: Reduce min-width

* changes file

* Adding codeowners for calendar

* delete extraneous change file
---
 .github/CODEOWNERS | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index 06cefbee30eb8..03733e9da6cd0 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -33,7 +33,7 @@
     # packages/office-ui-fabric-react/src/components/ActivityItem/*
     # packages/office-ui-fabric-react/src/components/Breadcrumb/*
     # packages/office-ui-fabric-react/src/components/Button/*
-    # packages/office-ui-fabric-react/src/components/Calendar/*
+    # packages/office-ui-fabric-react/src/components/Calendar/*   @johannao76 @lorejoh12
     # packages/office-ui-fabric-react/src/components/Callout/*
     # packages/office-ui-fabric-react/src/components/Check/*
     # packages/office-ui-fabric-react/src/components/Checkbox/*
@@ -42,7 +42,7 @@
     # packages/office-ui-fabric-react/src/components/ComboBox/*
     packages/office-ui-fabric-react/src/components/CommandBar/*   @micahgodbolt
     # packages/office-ui-fabric-react/src/components/ContextualMenu/*
-    # packages/office-ui-fabric-react/src/components/DatePicker/*
+    # packages/office-ui-fabric-react/src/components/DatePicker/*   @johannao76 @lorejoh12
     # packages/office-ui-fabric-react/src/components/DetailsList/*
     # packages/office-ui-fabric-react/src/components/Dialog/*
     # packages/office-ui-fabric-react/src/components/DocumentCard/*

From 39dd1aebc150ffd66799087eb3375298c7324abd Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 7 Aug 2017 03:22:46 -0700
Subject: [PATCH 0371/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...lloutpositioncompare_2017-08-04-18-06.json | 11 ------
 ...lloutpositioncompare_2017-08-04-18-06.json | 11 ------
 .../styling/iconfix_2017-08-04-21-17.json     | 11 ------
 ...lloutpositioncompare_2017-08-04-18-06.json | 11 ------
 ...lloutpositioncompare_2017-08-04-18-06.json | 11 ------
 ...lloutpositioncompare_2017-08-04-18-06.json | 11 ------
 .../manishda-dialogA11y_2017-08-02-11-58.json | 11 ------
 .../no-select-on-focus_2017-07-31-23-49.json  | 11 ------
 ...esizegroup-unmount-2_2017-08-04-01-59.json | 11 ------
 ...xtfield-clipping-fix_2017-07-31-16-40.json | 11 ------
 .../office-ui-fabric-react/CHANGELOG.json     | 39 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 13 ++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 packages/styling/CHANGELOG.json               | 14 +++++++
 packages/styling/CHANGELOG.md                 |  9 ++++-
 packages/styling/package.json                 |  2 +-
 20 files changed, 79 insertions(+), 118 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
 delete mode 100644 common/changes/@uifabric/fabric-website/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
 delete mode 100644 common/changes/@uifabric/styling/iconfix_2017-08-04-21-17.json
 delete mode 100644 common/changes/@uifabric/styling/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
 delete mode 100644 common/changes/@uifabric/utilities/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
 delete mode 100644 common/changes/office-ui-fabric-react/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
 delete mode 100644 common/changes/office-ui-fabric-react/manishda-dialogA11y_2017-08-02-11-58.json
 delete mode 100644 common/changes/office-ui-fabric-react/no-select-on-focus_2017-07-31-23-49.json
 delete mode 100644 common/changes/office-ui-fabric-react/resizegroup-unmount-2_2017-08-04-01-59.json
 delete mode 100644 common/changes/office-ui-fabric-react/textfield-clipping-fix_2017-07-31-16-40.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 8cf89036f1a7d..c18a96acab4b4 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -53,7 +53,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.30.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.30.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index c152e13f8d79f..678740f94b3af 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.30.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.30.1 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 6b455e4b288b7..6417917e86af5 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -35,7 +35,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.30.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.30.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 06aa8a7b8eda3..2593c7aa38732 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.30.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.30.1 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/example-app-base/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json b/common/changes/@uifabric/example-app-base/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
deleted file mode 100644
index e4ff247bb6846..0000000000000
--- a/common/changes/@uifabric/example-app-base/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json b/common/changes/@uifabric/fabric-website/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
deleted file mode 100644
index 60628424a4dfe..0000000000000
--- a/common/changes/@uifabric/fabric-website/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/iconfix_2017-08-04-21-17.json b/common/changes/@uifabric/styling/iconfix_2017-08-04-21-17.json
deleted file mode 100644
index 76ac906867066..0000000000000
--- a/common/changes/@uifabric/styling/iconfix_2017-08-04-21-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Adding 4 icons that were missing in the codes map.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json b/common/changes/@uifabric/styling/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
deleted file mode 100644
index 7285eaba1d8e4..0000000000000
--- a/common/changes/@uifabric/styling/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json b/common/changes/@uifabric/utilities/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
deleted file mode 100644
index a1f24b04e40a9..0000000000000
--- a/common/changes/@uifabric/utilities/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json b/common/changes/office-ui-fabric-react/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
deleted file mode 100644
index 346a251ac3651..0000000000000
--- a/common/changes/office-ui-fabric-react/joschect-fixcalloutpositioncompare_2017-08-04-18-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Callout: Fix positioning comparision so it correctly repositions if the beak left/right position has changed\"",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/manishda-dialogA11y_2017-08-02-11-58.json b/common/changes/office-ui-fabric-react/manishda-dialogA11y_2017-08-02-11-58.json
deleted file mode 100644
index 650ac529b08f3..0000000000000
--- a/common/changes/office-ui-fabric-react/manishda-dialogA11y_2017-08-02-11-58.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dialog: fixing accessibility regression",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "manishda@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/no-select-on-focus_2017-07-31-23-49.json b/common/changes/office-ui-fabric-react/no-select-on-focus_2017-07-31-23-49.json
deleted file mode 100644
index 09bf34dd62ce4..0000000000000
--- a/common/changes/office-ui-fabric-react/no-select-on-focus_2017-07-31-23-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Prevent auto-selection on focus in DetailsList",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "tmichon@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/resizegroup-unmount-2_2017-08-04-01-59.json b/common/changes/office-ui-fabric-react/resizegroup-unmount-2_2017-08-04-01-59.json
deleted file mode 100644
index f2c6bffbd0c34..0000000000000
--- a/common/changes/office-ui-fabric-react/resizegroup-unmount-2_2017-08-04-01-59.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ResizeGroup: Prevent rendering to the hidden div on prop updates that has an initial data that is in the cache",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/textfield-clipping-fix_2017-07-31-16-40.json b/common/changes/office-ui-fabric-react/textfield-clipping-fix_2017-07-31-16-40.json
deleted file mode 100644
index 71c35a33b4314..0000000000000
--- a/common/changes/office-ui-fabric-react/textfield-clipping-fix_2017-07-31-16-40.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Textfield: removed background from textfield internal field",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index f49f18a91f1df..c61aca5674fe1 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,45 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.30.1",
+      "tag": "office-ui-fabric-react_v4.30.1",
+      "date": "Mon, 07 Aug 2017 10:22:46 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "b0b4d93a4375433f03885fbbebc9a715aa4ec34d",
+            "comment": "Callout: Fix positioning comparision so it correctly repositions if the beak left/right position has changed\""
+          },
+          {
+            "author": "Manish Dahamiwal <mdhamiwal@gmail.com>",
+            "commit": "d8ffba67d710b76be69866ab49ca5239b63ae76c",
+            "comment": "Dialog: fixing accessibility regression"
+          },
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "f88b41c8fa81ae1a673458c8e7824623e82f5ffd",
+            "comment": "Prevent auto-selection on focus in DetailsList"
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "36ce1d12e6ba50ee97860100d1560365c193e3dd",
+            "comment": "ResizeGroup: Prevent rendering to the hidden div on prop updates that has an initial data that is in the cache"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "5c8d23dabbf43aff06ffe5ce4a99f0d3b577ea06",
+            "comment": "Textfield: removed background from textfield internal field"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.17.0 <1.0.0` to `>=0.17.0 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.30.0",
       "tag": "office-ui-fabric-react_v4.30.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index ad8a748d8a345..ad039ff878c34 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 04 Aug 2017 10:11:48 GMT and should not be manually modified.
+This log was last generated on Mon, 07 Aug 2017 10:22:46 GMT and should not be manually modified.
+
+## 4.30.1
+Mon, 07 Aug 2017 10:22:46 GMT
+
+### Patches
+
+- Callout: Fix positioning comparision so it correctly repositions if the beak left/right position has changed"
+- Dialog: fixing accessibility regression
+- Prevent auto-selection on focus in DetailsList
+- ResizeGroup: Prevent rendering to the hidden div on prop updates that has an initial data that is in the cache
+- Textfield: removed background from textfield internal field
 
 ## 4.30.0
 Fri, 04 Aug 2017 10:11:48 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 950200afb127a..14d1c49958886 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.30.0",
+  "version": "4.30.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 08f1a505a4446..c22d3ad6ea227 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.18.0",
+      "tag": "@uifabric/styling_v0.18.0",
+      "date": "Mon, 07 Aug 2017 10:22:46 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "2c4a1740d6e9495c9eca4c27f8c8fb6c70b2c61a",
+            "comment": "Adding 4 icons that were missing in the codes map."
+          }
+        ]
+      }
+    },
     {
       "version": "0.17.0",
       "tag": "@uifabric/styling_v0.17.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 7a53e0fdbe0e2..71f55634d717d 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 04 Aug 2017 10:11:48 GMT and should not be manually modified.
+This log was last generated on Mon, 07 Aug 2017 10:22:46 GMT and should not be manually modified.
+
+## 0.18.0
+Mon, 07 Aug 2017 10:22:46 GMT
+
+### Minor changes
+
+- Adding 4 icons that were missing in the codes map.
 
 ## 0.17.0
 Fri, 04 Aug 2017 10:11:48 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index f085a682f0da8..57ade4cbec5bc 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.17.0",
+  "version": "0.18.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From a92eb2a9a79dcab033bdbe78ca7a18b2d6607e99 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Mon, 7 Aug 2017 09:19:42 -0700
Subject: [PATCH 0372/1641] BaseButton: use screenReaderText styles from style
 package (#2359)

* Styling: added a screenReaderText utility and applied it to baseButton

* change file

* Support custom screenReaderText styles

* Change screenReaderText to hideText
---
 ...baseButton-screenReaderText_2017-08-01-18-55.json | 11 +++++++++++
 ...baseButton-screenReaderText_2017-08-01-18-55.json | 11 +++++++++++
 .../src/components/Button/BaseButton.styles.ts       | 11 -----------
 .../src/components/Button/BaseButton.tsx             |  4 ++--
 packages/styling/src/styles/UtilityStyles.ts         | 12 ++++++++++++
 packages/styling/src/styles/index.ts                 |  3 +++
 6 files changed, 39 insertions(+), 13 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/baseButton-screenReaderText_2017-08-01-18-55.json
 create mode 100644 common/changes/office-ui-fabric-react/baseButton-screenReaderText_2017-08-01-18-55.json
 create mode 100644 packages/styling/src/styles/UtilityStyles.ts

diff --git a/common/changes/@uifabric/styling/baseButton-screenReaderText_2017-08-01-18-55.json b/common/changes/@uifabric/styling/baseButton-screenReaderText_2017-08-01-18-55.json
new file mode 100644
index 0000000000000..064c36181a005
--- /dev/null
+++ b/common/changes/@uifabric/styling/baseButton-screenReaderText_2017-08-01-18-55.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Styling: added a screenReaderText utility style",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/baseButton-screenReaderText_2017-08-01-18-55.json b/common/changes/office-ui-fabric-react/baseButton-screenReaderText_2017-08-01-18-55.json
new file mode 100644
index 0000000000000..05383ef66f633
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/baseButton-screenReaderText_2017-08-01-18-55.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "BaseButton: Added screenReaderText styles to base button",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
index 54b9821ce6052..d549321998413 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
@@ -79,16 +79,5 @@ export const getStyles = memoizeFunction((
       lineHeight: '100%'
     },
 
-    screenReaderText: {
-      position: 'absolute',
-      width: '1px',
-      height: '1px',
-      margin: '-1px',
-      padding: 0,
-      overflow: 'hidden',
-      clip: 'rect(0,0,0,0)',
-      border: 0
-    }
-
   };
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 541a945a387ad..f6dbc09f45f2c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -11,7 +11,7 @@ import {
   KeyCodes,
   css,
 } from '../../Utilities';
-import { mergeStyles } from '../../Styling';
+import { mergeStyles, hideText } from '../../Styling';
 import { Icon, IIconProps } from '../../Icon';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { ContextualMenu, IContextualMenuProps } from '../../ContextualMenu';
@@ -311,7 +311,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     // If ariaDescription is given, descriptionId will be assigned to ariaDescriptionSpan,
     // otherwise it will be assigned to descriptionSpan.
     return ariaDescription ? (
-      <span className={ styles!.screenReaderText as string } id={ this._ariaDescriptionId }>{ ariaDescription }</span>
+      <span className={ `${styles!.screenReaderText || mergeStyles(hideText)}` } id={ this._ariaDescriptionId }>{ ariaDescription }</span>
     ) : (
         null
       );
diff --git a/packages/styling/src/styles/UtilityStyles.ts b/packages/styling/src/styles/UtilityStyles.ts
new file mode 100644
index 0000000000000..4a9ba97a23ac4
--- /dev/null
+++ b/packages/styling/src/styles/UtilityStyles.ts
@@ -0,0 +1,12 @@
+import { IRawStyle } from '../interfaces/index';
+
+export const hideText: IRawStyle = {
+  position: 'absolute',
+  width: '1px',
+  height: '1px',
+  margin: '-1px',
+  padding: 0,
+  overflow: 'hidden',
+  clip: 'rect(0,0,0,0)',
+  border: 0
+};
diff --git a/packages/styling/src/styles/index.ts b/packages/styling/src/styles/index.ts
index 881706017c0c9..601482c3753af 100644
--- a/packages/styling/src/styles/index.ts
+++ b/packages/styling/src/styles/index.ts
@@ -3,6 +3,9 @@ export { DefaultPalette } from './DefaultPalette';
 export { DefaultFontStyles, FontSizes, FontWeights } from './DefaultFontStyles';
 export { IconCodes } from './IconCodes';
 export { getFocusStyle } from './getFocusStyle';
+export {
+  hideText
+} from './UtilityStyles';
 export {
   ThemeSettingName,
   getTheme,

From 3966386109ba377bd35636def5b8f86ca9bcb3d0 Mon Sep 17 00:00:00 2001
From: Boris Emorine <boris.emorine@gmail.com>
Date: Mon, 7 Aug 2017 11:01:25 -0700
Subject: [PATCH 0373/1641] Split Button Styling Fix (#2208)

* Implement color scheme in the ContextualMenu control to enable alternative theming.

* Implement the bar and unit tests and component page

* Revert "Implement color scheme in the ContextualMenu control to enable alternative theming."

This reverts commit 4f830cd8c55269368e73bfc6d0cd69430776b977.

* Don't render an empty icon for an icon-less header menu item.

* Revert "Implement Document Title Bar"

* Remove IConButton dependency form BaseButton

* Add change file

* Fix missing semi colon

* Update boemor-splitbutton-styling-fix_2017-07-13-21-32.json

* Merge styles at the component level instead of style level

* Remove variantClassName from BaseButton's SplitButton

* Minor fixes.
---
 ...itbutton-styling-fix_2017-07-13-21-32.json | 11 +++++++
 .../src/components/Button/BaseButton.tsx      | 23 ++++---------
 .../src/components/Button/Button.Props.ts     |  9 +++--
 .../src/components/Button/Button.test.tsx     |  2 +-
 .../SplitButton/SplitButton.classNames.ts     | 33 +++++++++++++++++++
 .../Button/SplitButton/SplitButton.styles.ts  | 28 +++++++++++++---
 6 files changed, 83 insertions(+), 23 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/boemor-splitbutton-styling-fix_2017-07-13-21-32.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts

diff --git a/common/changes/office-ui-fabric-react/boemor-splitbutton-styling-fix_2017-07-13-21-32.json b/common/changes/office-ui-fabric-react/boemor-splitbutton-styling-fix_2017-07-13-21-32.json
new file mode 100644
index 0000000000000..cc43d5db16142
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/boemor-splitbutton-styling-fix_2017-07-13-21-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "BaseButton: Remove the IconButton dependency that was introduced with SplitButton.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "boemor@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index f6dbc09f45f2c..ee15cb9d8a6cc 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -16,8 +16,8 @@ import { Icon, IIconProps } from '../../Icon';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { ContextualMenu, IContextualMenuProps } from '../../ContextualMenu';
 import { IButtonProps, IButton } from './Button.Props';
-import { IconButton } from './IconButton/IconButton';
 import { IButtonClassNames, getClassNames } from './BaseButton.classNames';
+import { getClassNames as getSplitButtonClassNames } from './SplitButton/SplitButton.classNames';
 
 export interface IBaseButtonProps extends IButtonProps {
   baseClassName?: string;
@@ -398,7 +398,8 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       menuIconName,
       menuIconProps,
       styles,
-      disabled
+      disabled,
+      checked
     } = this.props;
 
     if (menuIconProps === undefined) {
@@ -407,22 +408,12 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       };
     }
 
+    const classNames = styles ? getSplitButtonClassNames(styles!, disabled || false, !!this.state.menuProps, checked || false) : undefined;
+
     return (
-      <IconButton
+      <BaseButton
         tabIndex={ -1 }
-        styles={ {
-          root: mergeStyles(
-            styles!.splitButtonMenuButton,
-            !!this.state.menuProps && [
-              styles!.splitButtonMenuButtonExpanded
-            ],
-            disabled && [
-              styles!.splitButtonMenuButtonDisabled
-            ],
-          ) as string,
-          rootChecked: styles!.splitButtonMenuButtonChecked,
-          icon: disabled ? styles!.splitButtonMenuIconDisabled : styles!.splitButtonMenuIcon
-        } }
+        styles={ classNames }
         checked={ this.props.checked }
         disabled={ this.props.disabled }
         onClick={ this._onToggleMenu }
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
index 7ce3ba64f8eac..91a83f0a282e0 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
@@ -313,8 +313,8 @@ export interface IButtonStyles {
   screenReaderText?: IStyle;
 
   /**
-   * Style override for the container div around a SplitButton element
-   */
+     * Style override for the container div around a SplitButton element
+     */
   splitButtonContainer?: IStyle;
 
   /**
@@ -351,4 +351,9 @@ export interface IButtonStyles {
    * Style override for the SplitButton menu icon element in a disabled state
    */
   splitButtonMenuIconDisabled?: IStyle;
+
+  /**
+   * Style override for the SplitButton FlexContainer.
+   */
+  splitButtonFlexContainer?: IStyle;
 }
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
index cb2a12b398267..87ea960af7637 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
@@ -251,7 +251,7 @@ describe('DefaultButton', () => {
       />
     );
     const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
-    const menuButtonDOM: HTMLButtonElement = renderedDOM.getElementsByClassName('ms-Button--icon')[0] as HTMLButtonElement;
+    const menuButtonDOM: HTMLButtonElement = renderedDOM.getElementsByTagName('button')[1] as HTMLButtonElement;
     ReactTestUtils.Simulate.click(menuButtonDOM);
     expect(renderedDOM.getAttribute('aria-expanded')).to.equal('true');
   });
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts
new file mode 100644
index 0000000000000..3d552ebe1b130
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts
@@ -0,0 +1,33 @@
+import { memoizeFunction } from '../../../Utilities';
+import { mergeStyles } from '../../../Styling';
+import { IButtonStyles } from '../Button.Props';
+
+export interface ISplitButtonClassNames {
+  root?: string;
+  icon?: string;
+  flexContainer?: string;
+}
+
+export const getClassNames = memoizeFunction((
+  styles: IButtonStyles,
+  disabled: boolean,
+  expanded: boolean,
+  checked: boolean,
+): ISplitButtonClassNames => {
+  return {
+    root: mergeStyles(
+      styles.splitButtonMenuButton,
+      expanded && [
+        styles.splitButtonMenuButtonExpanded
+      ],
+      disabled && [
+        styles.splitButtonMenuButtonDisabled
+      ],
+      checked && [
+        styles.splitButtonMenuButtonChecked
+      ]
+    ) as string,
+    icon: (disabled ? mergeStyles(styles.splitButtonMenuIcon, styles.splitButtonMenuIconDisabled) : styles.splitButtonMenuIcon) as string,
+    flexContainer: styles.splitButtonFlexContainer as string
+  };
+});
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
index 69d0c6d888514..7a9e90dc363d4 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
@@ -12,7 +12,7 @@ export const getStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: IButtonStyles
 ): IButtonStyles => {
-  let iconButtonStyles: IButtonStyles = {
+  let splitButtonStyles: IButtonStyles = {
     splitButtonContainer: {
       position: 'relative',
       display: 'inline-block',
@@ -29,13 +29,22 @@ export const getStyles = memoizeFunction((
     },
 
     splitButtonContainerDisabled: {
-      position: 'absolute',
     },
 
     splitButtonMenuButton: {
-      backgroundColor: theme.palette.neutralLighter,
       padding: '6px',
       height: 'auto',
+      color: theme.palette.white,
+      boxSizing: 'border-box',
+      border: '1px solid transparent',
+      userSelect: 'none',
+      display: 'inline-block',
+      textDecoration: 'none',
+      textAlign: 'center',
+      cursor: 'pointer',
+      verticalAlign: 'top',
+      width: '32px',
+      backgroundColor: theme.palette.neutralLighter,
       ':hover': {
         backgroundColor: theme.palette.neutralLight
       },
@@ -43,6 +52,10 @@ export const getStyles = memoizeFunction((
 
     splitButtonMenuButtonDisabled: {
       backgroundColor: theme.palette.neutralLighter,
+      ':hover': {
+        backgroundColor: theme.palette.neutralLighter,
+        cursor: 'default'
+      }
     },
 
     splitButtonMenuIcon: {
@@ -53,6 +66,13 @@ export const getStyles = memoizeFunction((
       color: theme.palette.neutralTertiary
     },
 
+    splitButtonFlexContainer: {
+      display: 'flex',
+      height: '100%',
+      flexWrap: 'nowrap',
+      justifyContent: 'center',
+      alignItems: 'center'
+    },
     splitButtonMenuButtonChecked: {
       backgroundColor: theme.palette.themePrimary,
     },
@@ -62,5 +82,5 @@ export const getStyles = memoizeFunction((
     },
   };
 
-  return mergeStyleSets(iconButtonStyles, customStyles)!;
+  return mergeStyleSets(splitButtonStyles, customStyles)!;
 });

From 5e07c6d8d3518ef0301b1d1655dc467f4f7a0d3b Mon Sep 17 00:00:00 2001
From: thomabr <thomabr@microsoft.com>
Date: Mon, 7 Aug 2017 14:25:38 -0700
Subject: [PATCH 0374/1641] GridCell: Add a component to handle the shared
 logic managing selection and navigation (#2384)

* Initial Commit of refactoring logic that will be shared accross Grid consumers to the grid utility class. This change moves a majority of the logic away from the SwatchColorPickerOption class into the GridCell class. The Grid class will handle most of the navigation/selection logic and only push an onRenderItem callback to the consumers where they can specify how the cell should be rendered.

* Minor cleanup of unused imports

* Adding rush changes

* Fix lint error where public function is below private functions as well as handling some merge conflicts with the latest version of fabric

* Fix typo where disabled was being set on selected for the gridcell style

* Reverse major version change for rush. Making the change minor

* Address feedback from the PR

* Fix lint warning

* Fix PR feedback. Removing extra spaces, and removing the inheritance of React.Props from GridCell.Props

* Undo a breaking change to the SwatchColorPicker props file. Remap the OnCellHovered and OnCellFocused handlers to the new grid handlers.

* Add comments and nullcheck props file

* Fix lint style error
---
 ...haredCellLogicToGrid_2017-08-03-16-49.json |   0
 ...haredCellLogicToGrid_2017-08-03-18-46.json |  11 +
 .../SwatchColorPicker.Props.ts                |   1 +
 .../SwatchColorPicker/SwatchColorPicker.tsx   | 257 +++++-------------
 .../src/utilities/grid/Grid.Props.ts          |  15 +
 .../src/utilities/grid/Grid.tsx               |  77 +++---
 .../src/utilities/grid/GridCell.Props.ts      |  74 +++++
 .../src/utilities/grid/GridCell.tsx           | 116 ++++++++
 .../src/utilities/grid/index.ts               |   4 +-
 9 files changed, 329 insertions(+), 226 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/thomabr-MoveSharedCellLogicToGrid_2017-08-03-16-49.json
 create mode 100644 common/changes/office-ui-fabric-react/thomabr-MoveSharedCellLogicToGrid_2017-08-03-18-46.json
 create mode 100644 packages/office-ui-fabric-react/src/utilities/grid/GridCell.Props.ts
 create mode 100644 packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx

diff --git a/common/changes/office-ui-fabric-react/thomabr-MoveSharedCellLogicToGrid_2017-08-03-16-49.json b/common/changes/office-ui-fabric-react/thomabr-MoveSharedCellLogicToGrid_2017-08-03-16-49.json
new file mode 100644
index 0000000000000..e69de29bb2d1d
diff --git a/common/changes/office-ui-fabric-react/thomabr-MoveSharedCellLogicToGrid_2017-08-03-18-46.json b/common/changes/office-ui-fabric-react/thomabr-MoveSharedCellLogicToGrid_2017-08-03-18-46.json
new file mode 100644
index 0000000000000..90923e15ad39c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/thomabr-MoveSharedCellLogicToGrid_2017-08-03-18-46.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "GridCell: Add a component to handle the shared logic managing selection and navigation of cells within all consumers of the Grid class. This change also updates the SwatchColorPicker to  use the GridCell component and removes  most of the logic now contained in the GridCell component.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "thomabr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts
index a3109d3e65db0..4aa5857aa20b4 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts
@@ -99,4 +99,5 @@ export interface IColorCellProps {
    * Index for this option
    */
   index?: number;
+
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
index 98a7183c4e38a..49653d9238246 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
@@ -13,195 +13,17 @@ import {
 } from './SwatchColorPicker.Props';
 import { getColorFromString } from '../../utilities/color/colors';
 import { Grid } from '../../utilities/grid/Grid';
+import { GridCell } from '../../utilities/grid/GridCell';
+import { IGridCellProps } from '../../utilities/grid/GridCell.Props';
 import { CommandButton } from '../../Button';
-import { FocusZone } from '../../FocusZone';
 import * as stylesImport from './SwatchColorPicker.scss';
 const styles: any = stylesImport;
 
-interface ISwatchColorPickerOptionProps {
-
-  /**
-   * The option that will be made available to the user
-   */
-  item: IColorCellProps;
-
-  /**
-   * Arbitrary unique string associated with this option
-   */
-  id: string;
-
-  /**
-   * Optional, if the this option should be diabled
-   */
-  disabled?: boolean;
-
-  /**
-   * Optional, the currently selectedIndex in the set of options
-   */
+export interface ISwatchColorPickerState {
   selectedIndex?: number;
-
-  /**
-   * The on click handler
-   */
-  onClick: (item: IColorCellProps) => void;
-
-  /**
-   * Optional, the onHover handler
-   */
-  onHover?: (id?: string, color?: string) => void;
-
-  /**
-   * Optional, the onFocus handler
-   */
-  onFocus?: (id?: string, color?: string) => void;
-
-  /**
-   * The accessible role for this option
-   */
-  role?: string;
-
-  /**
-   * Optional, className(s) to apply
-   */
-  className?: string;
-
-  /**
-   * The shape for the option. Defaults to circle
-   */
-  cellShape?: 'circle' | 'square';
 }
 
-class SwatchColorPickerOption extends React.Component<ISwatchColorPickerOptionProps, {}> {
-
-  public static defaultProps = {
-    cellShape: 'circle',
-    disabled: false
-  };
-
-  private _id: string;
-
-  constructor(props: ISwatchColorPickerOptionProps) {
-    super(props);
-
-    this._id = props.id || getId('colorCell');
-  }
-
-  public render() {
-    let {
-      item,
-      id,
-      className,
-      role,
-      selectedIndex,
-      disabled,
-      cellShape,
-      onClick,
-      onHover,
-      onFocus
-    } = this.props;
-    return (
-      <CommandButton
-        id={ id + '-item' + item.index }
-        data-index={ item.index }
-        data-is-focusable={ true }
-        disabled={ disabled }
-        className={ css(className,
-          {
-            ['is-selected ' + styles.cellIsSelected]: (selectedIndex !== undefined && selectedIndex === item.index),
-            ['is-disabled ' + styles.disabled]: disabled
-          }
-        ) }
-        onClick={ this._onClick }
-        onMouseEnter={ this._onMouseEnter }
-        onMouseLeave={ this._onMouseLeave }
-        onFocus={ this._onFocus }
-        role={ role }
-        aria-selected={ selectedIndex !== undefined && (selectedIndex === item.index).toString() }
-        ariaLabel={ item.label && item.label }
-        title={ item.label && item.label }
-      >
-        { this._onRenderOption() }
-      </CommandButton>
-    );
-  }
-
-  @autobind
-  private _onClick() {
-    let {
-        onClick,
-      disabled,
-      item
-      } = this.props;
-
-    if (onClick && !disabled) {
-      onClick(item);
-    }
-  }
-
-  @autobind
-  private _onMouseEnter() {
-    let {
-        onHover,
-      disabled,
-      item
-      } = this.props;
-
-    if (onHover && !disabled) {
-      onHover(item.id, item.color);
-    }
-  }
-
-  @autobind
-  private _onMouseLeave() {
-    let {
-        onHover,
-      disabled
-      } = this.props;
-
-    if (onHover && !disabled) {
-      onHover();
-    }
-  }
-
-  @autobind
-  private _onFocus() {
-    let {
-        onFocus,
-      disabled,
-      item
-      } = this.props;
-
-    if (onFocus && !disabled) {
-      onFocus(item.id, item.color);
-    }
-  }
-
-  /**
-   * Render the core of a color cell
-   * @returns {JSX.Element} - Element representing the core of the item
-   */
-  @autobind
-  private _onRenderOption(): JSX.Element {
-    let {
-        cellShape,
-      item
-      } = this.props;
-
-    // Build an SVG for the cell with the given shape and color properties
-    return (
-      <svg className={ css(styles.svg, cellShape, cellShape === 'circle' ? styles.circle : '') } viewBox='0 0 20 20' fill={ getColorFromString(item.color as string).str } >
-        {
-          cellShape === 'circle' ?
-            <circle cx='50%' cy='50%' r='50%' /> :
-            <rect width='100%' height='100%' />
-        }
-      </svg>
-    );
-  }
-}
-
-export interface ISwatchColorPickerState {
-  selectedIndex?: number;
+class ColorPickerGridCell extends GridCell<IColorCellProps, IGridCellProps<IColorCellProps>> {
 }
 
 export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, ISwatchColorPickerState> implements ISwatchColorPicker {
@@ -256,11 +78,7 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
       onCellFocused
     } = this.props;
 
-    return (<FocusZone
-      isCircularNavigation={ shouldFocusCircularNavigate }
-      className={ css('ms-swatchColorPickerBodyContainer', styles.swatchColorPickerContainer, className) }
-      onBlur={ this.onSwatchColorPickerBlur }
-    >
+    return (
       <Grid
         key={ this._id + colorCells[0].id + '-grid' }
         items={ colorCells.map((item, index) => { return { ...item, index }; }) }
@@ -268,8 +86,10 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
         onRenderItem={ this._renderOption }
         positionInSet={ positionInSet && positionInSet }
         setSize={ setSize && setSize }
-      />
-    </FocusZone>);
+        shouldFocusCircularNavigate={ shouldFocusCircularNavigate }
+        onBlur={ this.onSwatchColorPickerBlur }
+        containerClassName={ css('ms-swatchColorPickerBodyContainer', styles.swatchColorPickerContainer, className) }
+      />);
   }
 
   /**
@@ -304,22 +124,71 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
     let id = this._id;
 
     return (
-      <SwatchColorPickerOption
+      <ColorPickerGridCell
         item={ item }
         id={ id }
         key={ id + item.id }
         disabled={ this.props.disabled }
-        cellShape={ this.props.cellShape }
         className={ styles.cell }
         onClick={ this._onCellClick }
-        onHover={ this.props.onCellHovered }
-        onFocus={ this.props.onCellFocused }
+        onHover={ this.onGridCellHovered }
+        onFocus={ this.onGridCellFocused }
+        onRenderItem={ this._onRenderColorOption }
         role={ 'gridcell' }
-        selectedIndex={ this.state.selectedIndex }
+        selected={ this.state.selectedIndex !== undefined && (this.state.selectedIndex === item.index) }
+        cellIsSelectedStyle={ ['is-selected ' + styles.cellIsSelected] }
+        cellDisabledStyle={ ['is-disabled ' + styles.disabled] }
+        label={ item.label }
       />
     );
   }
 
+  /**
+   * Callback passed to the GridCell class that will trigger the onCellHovered callback of the SwatchColorPicker
+   */
+  @autobind
+  private onGridCellHovered(item?: IColorCellProps): void {
+    if (this.props && this.props.onCellHovered) {
+      if (item) {
+        this.props.onCellHovered(item.id, item.color);
+      } else {
+        this.props.onCellHovered();
+      }
+    }
+  }
+
+  /**
+   * Callback passed to the GridCell class that will trigger the onCellFocus callback of the SwatchColorPicker
+   */
+  @autobind
+  private onGridCellFocused(item?: IColorCellProps): void {
+    if (this.props && this.props.onCellFocused) {
+      if (item) {
+        this.props.onCellFocused(item.id, item.color);
+      } else {
+        this.props.onCellFocused();
+      }
+    }
+  }
+
+  /**
+   * Render the core of a color cell
+   * @returns {JSX.Element} - Element representing the core of the item
+   */
+  @autobind
+  private _onRenderColorOption(colorOption: IColorCellProps): JSX.Element {
+    // Build an SVG for the cell with the given shape and color properties
+    return (
+      <svg className={ css(styles.svg, this.props.cellShape, this.props.cellShape === 'circle' ? styles.circle : '') } viewBox='0 0 20 20' fill={ getColorFromString(colorOption.color as string).str } >
+        {
+          this.props.cellShape === 'circle' ?
+            <circle cx='50%' cy='50%' r='50%' /> :
+            <rect width='100%' height='100%' />
+        }
+      </svg>
+    );
+  }
+
   /**
    * Handle the click on a cell
    * @param item - The cell that the click was fired against
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.Props.ts b/packages/office-ui-fabric-react/src/utilities/grid/Grid.Props.ts
index f222e96698945..a179682c67be5 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.Props.ts
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.Props.ts
@@ -19,6 +19,21 @@ export interface IGridProps {
    */
   onRenderItem: (item: any, index: number) => JSX.Element;
 
+  /**
+   * Boolean indicating if the focus should support circular navigation
+   */
+  shouldFocusCircularNavigate?: boolean;
+
+  /**
+   * Optional, class name for the FocusZone container for the grid
+   */
+  containerClassName?: string;
+
+  /**
+   * Optional, handler for when the grid should blur
+   */
+  onBlur?: () => void;
+
   /**
    * The optional position this grid is in the parent set (index in a parent menu, for example)
    */
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx b/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
index e14bfa4988ad9..6598605294aba 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
@@ -1,6 +1,12 @@
 import * as React from 'react';
-import { BaseComponent, getId, toMatrix } from '../../Utilities';
+import {
+  BaseComponent,
+  getId,
+  toMatrix
+} from '../../Utilities';
+import { FocusZone } from '../../FocusZone';
 import { IGridProps } from './Grid.Props';
+import { GridCell } from './GridCell';
 
 export class Grid extends BaseComponent<IGridProps, {}> {
 
@@ -17,7 +23,10 @@ export class Grid extends BaseComponent<IGridProps, {}> {
       columnCount,
       onRenderItem,
       positionInSet,
-      setSize
+      setSize,
+      shouldFocusCircularNavigate,
+      containerClassName,
+      onBlur
     } = this.props;
 
     // Array to store the cells in the correct row index
@@ -25,35 +34,41 @@ export class Grid extends BaseComponent<IGridProps, {}> {
 
     // Create the table/grid
     return (
-      <table
-        id={ this._id }
-        role={ 'grid' }
-        aria-posinset={ positionInSet }
-        aria-setsize={ setSize }
-        style={ { padding: '2px', outline: 'none' } }>
-        <tbody>
-          {
-            rowsOfItems.map((rows: any[], rowIndex) => {
-              return (
-                <tr
-                  role={ 'row' }
-                  key={ this._id + '-' + rowIndex + '-row' }>
-                  { rows.map((cell) => {
-                    return (
-                      <td
-                        role={ 'presentation' }
-                        key={ this._id + '-' + cell.index + '-cell' }
-                        style={ { padding: '0px' } }>
-                        { onRenderItem(cell, cell.index) }
-                      </td>
-                    );
-                  }) }
-                </tr>
-              );
-            })
-          }
-        </tbody>
-      </table>
+      <FocusZone
+        isCircularNavigation={ this.props.shouldFocusCircularNavigate }
+        className={ this.props.containerClassName }
+        onBlur={ this.props.onBlur }
+      >
+        <table
+          id={ this._id }
+          role={ 'grid' }
+          aria-posinset={ positionInSet }
+          aria-setsize={ setSize }
+          style={ { padding: '2px', outline: 'none' } }>
+          <tbody>
+            {
+              rowsOfItems.map((rows: any[], rowIndex) => {
+                return (
+                  <tr
+                    role={ 'row' }
+                    key={ this._id + '-' + rowIndex + '-row' }>
+                    { rows.map((cell) => {
+                      return (
+                        <td
+                          role={ 'presentation' }
+                          key={ this._id + '-' + cell.index + '-cell' }
+                          style={ { padding: '0px' } }>
+                          { onRenderItem(cell, cell.index) }
+                        </td>
+                      );
+                    }) }
+                  </tr>
+                );
+              })
+            }
+          </tbody>
+        </table>
+      </FocusZone>
     );
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/GridCell.Props.ts b/packages/office-ui-fabric-react/src/utilities/grid/GridCell.Props.ts
new file mode 100644
index 0000000000000..36db27462d782
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/utilities/grid/GridCell.Props.ts
@@ -0,0 +1,74 @@
+export interface IGridCellProps<T> {
+
+  /**
+   * The option that will be made available to the user
+   */
+  item: T;
+
+  /**
+   * Arbitrary unique string associated with this option
+   */
+  id: string;
+
+  /**
+   * Optional, if the this option should be diabled
+   */
+  disabled?: boolean;
+
+  /**
+   * Optional, if the cell is currently selected
+   */
+  selected?: boolean;
+
+  /**
+   * The on click handler
+   */
+  onClick?: (item: T) => void;
+
+  /**
+   * The render callback to handle rendering the item
+   */
+  onRenderItem: (item: T) => JSX.Element;
+
+  /**
+   * Optional, the onHover handler
+   */
+  onHover?: (item?: T) => void;
+
+  /**
+   * Optional, the onFocus handler
+   */
+  onFocus?: (item: T) => void;
+
+  /**
+   * The accessible role for this option
+   */
+  role?: string;
+
+  /**
+   * Optional, className(s) to apply
+   */
+  className?: string;
+
+  /**
+  * Optional, the CSS class used for when the cell is disabled
+  */
+  cellDisabledStyle?: string[];
+
+  /**
+  * Optional, the CSS class used for when the cell is selected
+  */
+  cellIsSelectedStyle?: string[];
+
+  /**
+  * Index for this option
+  */
+  index?: number;
+
+  /**
+ * The label for this item.
+ * Visible text if this item is a header,
+ * tooltip if is this item is normal
+ */
+  label?: string;
+}
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx b/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx
new file mode 100644
index 0000000000000..0d551eed3258f
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx
@@ -0,0 +1,116 @@
+import * as React from 'react';
+import {
+  autobind,
+  BaseComponent,
+  css,
+  getId,
+} from '../../Utilities';
+import { IGridCellProps } from './GridCell.Props';
+import { CommandButton } from '../../Button';
+
+export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P, {}> {
+
+  public static defaultProps = {
+    cellShape: 'circle',
+    disabled: false,
+    id: getId('gridCell')
+  };
+
+  private _id: string;
+
+  public render() {
+    let {
+      item,
+      id,
+      className,
+      role,
+      selected,
+      disabled,
+      onClick,
+      onHover,
+      onFocus,
+      onRenderItem,
+      cellDisabledStyle,
+      cellIsSelectedStyle,
+      index,
+      label
+    } = this.props;
+    return (
+      <CommandButton
+        id={ id + '-item' + index }
+        data-index={ index }
+        data-is-focusable={ true }
+        disabled={ disabled }
+        className={ css(className,
+          {
+            ['' + cellIsSelectedStyle]: selected,
+            ['' + cellDisabledStyle]: disabled
+          }
+        ) }
+        onClick={ this._onClick }
+        onMouseEnter={ this._onMouseEnter }
+        onMouseLeave={ this._onMouseLeave }
+        onFocus={ this._onFocus }
+        role={ role }
+        aria-selected={ selected }
+        ariaLabel={ label }
+        title={ label }
+      >
+        { onRenderItem(item) }
+      </CommandButton >
+    );
+  }
+
+  @autobind
+  private _onClick() {
+    let {
+      onClick,
+      disabled,
+      item
+      } = this.props as P;
+
+    if (onClick && !disabled) {
+      onClick(item);
+    }
+  }
+
+  @autobind
+  private _onMouseEnter() {
+    let {
+      onHover,
+      disabled,
+      item
+      } = this.props as P;
+
+    if (onHover && !disabled) {
+      onHover(item);
+    }
+  }
+
+  @autobind
+  private _onMouseLeave() {
+    let {
+      onHover,
+      disabled,
+      item
+      } = this.props as P;
+
+    if (onHover && !disabled) {
+      onHover();
+    }
+  }
+
+  @autobind
+  private _onFocus() {
+    let {
+      onFocus,
+      disabled,
+      item
+      } = this.props as P;
+
+    if (onFocus && !disabled) {
+      onFocus(item);
+    }
+  }
+
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/index.ts b/packages/office-ui-fabric-react/src/utilities/grid/index.ts
index 9329c17be35ce..49eb9324e05d0 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/index.ts
+++ b/packages/office-ui-fabric-react/src/utilities/grid/index.ts
@@ -1,2 +1,4 @@
 export * from './Grid';
-export * from './Grid.Props';
\ No newline at end of file
+export * from './Grid.Props';
+export * from './GridCell';
+export * from './GridCell.Props';
\ No newline at end of file

From a7bc11ddacabfcfbf4fbc56e99e6d13ea296b787 Mon Sep 17 00:00:00 2001
From: Kushal Yarlagadda <whykushal93@gmail.com>
Date: Mon, 7 Aug 2017 16:07:55 -0700
Subject: [PATCH 0375/1641] Moving the Spin Button component to Glamor based
 styling. (#2314)

* Spin Button initial checkin

* Adding more styles. This finishes up almost all the styles.
- But it does not look complete visually yet !
- There seems to be bug with cascading of styles for IconButton.

* Using IButtonStyles for the ArrowButtons
Adding focus and hover styles

* -Type safety for ISpinButtonArrowButtonStyles
-Introducing isFocused in state so that we have a way to style the root on focus,
-Making buttons be in the checked state when increment/decrement spin button
-Allowing for separate customization of the upArrow/downArrow buttons

* Slight changes to examples.

* Change files

* Updating examples with a custom styles spin button
correcting a bug with downArrow custom styling
removing the sass file

* Addressing PR comments
-Removing neutralSecondaryAlt from palette because it is depracated
-Addressing some of the errors that resulted out of null/undefined type checking
-correcting a spelling
-Adding underscore for private/non-exported functions

* Correcting disabled styles.

* Correcting examples. Without the container being wider, the label positioning is not showing its effects.

* Disabled styles are needed for input. Otherwise browser styles take precedence in Chrome.
-> Also adding the disabled attribute  to the input element for semantics

* Correcting null and undefined uses in the spin button.

* Addressing PR comments
1) Taking the styles for the button up to the props
2) Refactoring some ternary operations
3) Refactoring some of the code in SpinButton.tsx
4) Correcting a small bug in the example, and custom styling it with new arrow button styles in the props

* Renamed container->root, root->spinButtonWrapper to be more consistent.
Also, optimized exmaple  a tiny bit.
---
 .../SpinButtonGlamor_2017-07-27-00-34.json    |  11 +
 .../SpinButtonGlamor_2017-07-27-00-34.json    |  11 +
 .../SpinButtonGlamor_2017-07-27-00-34.json    |  11 +
 .../SpinButtonGlamor_2017-07-27-00-34.json    |  11 +
 .../SpinButtonGlamor_2017-07-27-00-34.json    |  11 +
 .../components/SpinButton/SpinButton.Props.ts | 124 +++++++++
 .../SpinButton/SpinButton.classNames.ts       |  97 +++++++
 .../src/components/SpinButton/SpinButton.scss | 226 ----------------
 .../SpinButton/SpinButton.styles.ts           | 244 ++++++++++++++++++
 .../src/components/SpinButton/SpinButton.tsx  | 125 ++++-----
 .../components/SpinButton/SpinButtonPage.tsx  |   8 +
 .../examples/SpinButton.Basic.Example.tsx     |   2 +-
 .../SpinButton.BasicDisabled.Example.tsx      |   2 +-
 ...pinButton.BasicWithEndPosition.Example.tsx |   2 +-
 .../SpinButton.BasicWithIcon.Example.tsx      |   2 +-
 .../SpinButton.CustomStyled.Example.tsx       |  46 ++++
 .../examples/SpinButton.Stateful.Example.tsx  |   2 +-
 17 files changed, 645 insertions(+), 290 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/SpinButtonGlamor_2017-07-27-00-34.json
 create mode 100644 common/changes/@uifabric/fabric-website/SpinButtonGlamor_2017-07-27-00-34.json
 create mode 100644 common/changes/@uifabric/styling/SpinButtonGlamor_2017-07-27-00-34.json
 create mode 100644 common/changes/@uifabric/utilities/SpinButtonGlamor_2017-07-27-00-34.json
 create mode 100644 common/changes/office-ui-fabric-react/SpinButtonGlamor_2017-07-27-00-34.json
 create mode 100644 packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.CustomStyled.Example.tsx

diff --git a/common/changes/@uifabric/example-app-base/SpinButtonGlamor_2017-07-27-00-34.json b/common/changes/@uifabric/example-app-base/SpinButtonGlamor_2017-07-27-00-34.json
new file mode 100644
index 0000000000000..a48a2085ece6b
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/SpinButtonGlamor_2017-07-27-00-34.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "kushaly@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/SpinButtonGlamor_2017-07-27-00-34.json b/common/changes/@uifabric/fabric-website/SpinButtonGlamor_2017-07-27-00-34.json
new file mode 100644
index 0000000000000..4df779311b07b
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/SpinButtonGlamor_2017-07-27-00-34.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "kushaly@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/SpinButtonGlamor_2017-07-27-00-34.json b/common/changes/@uifabric/styling/SpinButtonGlamor_2017-07-27-00-34.json
new file mode 100644
index 0000000000000..a68ad2cf20bef
--- /dev/null
+++ b/common/changes/@uifabric/styling/SpinButtonGlamor_2017-07-27-00-34.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Adding a color to the palette",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "kushaly@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/SpinButtonGlamor_2017-07-27-00-34.json b/common/changes/@uifabric/utilities/SpinButtonGlamor_2017-07-27-00-34.json
new file mode 100644
index 0000000000000..8b9c98c03c0f4
--- /dev/null
+++ b/common/changes/@uifabric/utilities/SpinButtonGlamor_2017-07-27-00-34.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "kushaly@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/SpinButtonGlamor_2017-07-27-00-34.json b/common/changes/office-ui-fabric-react/SpinButtonGlamor_2017-07-27-00-34.json
new file mode 100644
index 0000000000000..b3008d0371000
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/SpinButtonGlamor_2017-07-27-00-34.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Moving SpinButton to Glamor based styling",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kushaly@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts
index 00d25d503c782..7152f09628fc7 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts
@@ -1,5 +1,7 @@
 import { Position } from '../../utilities/positioning';
 import { IIconProps } from '../../Icon';
+import { ITheme, IStyle } from '../../Styling';
+import { IButtonStyles } from '../../Button';
 
 export interface ISpinButton {
   /**
@@ -114,4 +116,126 @@ export interface ISpinButtonProps {
    * Icon for the decrement button of the spinButton
    */
   decrementButtonIcon?: IIconProps;
+
+  /**
+   * Custom styling for individual elements within the button DOM.
+   */
+  styles?: Partial<ISpinButtonStyles>;
+
+  /**
+   * Custom styles for the upArrow button.
+   *
+   * Note: The buttons are in a checked state when arrow keys are used to
+   * incremenent/decrement the spinButton. Use rootChecked instead of rootPressed
+   * for styling when that is the case.
+   */
+  upArrowButtonStyles?: Partial<IButtonStyles>;
+
+  /**
+   * Custom styles for the downArrow button.
+   *
+   * Note: The buttons are in a checked state when arrow keys are used to
+   * incremenent/decrement the spinButton. Use rootChecked instead of rootPressed
+   * for styling when that is the case.
+   */
+  downArrowButtonStyles?: Partial<IButtonStyles>;
+
+  /**
+   * Theme provided by HOC.
+   */
+  theme?: ITheme;
+}
+
+export interface ISpinButtonStyles {
+
+  /**
+   * Styles for the root of the spin button component.
+   */
+  root: IStyle;
+
+  /**
+   * Style for the label wrapper element of the component
+   * The label wrapper contains the icon and the label.
+   */
+  labelWrapper: IStyle;
+
+  /**
+   * Style override when the label is positioned at the start.
+   */
+  labelWrapperStart: IStyle;
+
+  /**
+   * Style override when the label is positioned at the end.
+   */
+  labelWrapperEnd: IStyle;
+
+  /**
+   * Style override when the label is positioned at the top.
+   */
+  labelWrapperTop: IStyle;
+
+  /**
+   * Style override when the label is positioned at the bottom.
+   */
+  labelWrapperBottom: IStyle;
+
+  /**
+   * Style for the icon.
+   */
+  icon: IStyle;
+
+  /**
+   * Style for the label text
+   */
+  label: IStyle;
+
+  /**
+   * Style for spinButtonWrapper when enabled.
+   */
+  spinButtonWrapper: IStyle;
+
+  /**
+   * Style override when label is positioned at the top/bottom.
+   */
+  spinButtonWrapperTopBottom: IStyle;
+
+  /**
+   * Style override when spinButton is enabled/hovered.
+   */
+  spinButtonWrapperHovered: IStyle;
+
+  /**
+   * Style override when spinButton is enabled/focused.
+   */
+  spinButtonWrapperFocused: IStyle;
+
+  /**
+   * Style override when spinButton is disabled.
+   */
+  spinButtonWrapperDisabled: IStyle;
+
+  /**
+   * Styles for the input.
+   */
+  input: IStyle;
+
+  /**
+   * Style override for ::selection
+   */
+  inputTextSelected: IStyle;
+
+  /**
+   * Style override when spinButton is disabled.
+   */
+  inputDisabled: IStyle;
+
+  /**
+   * Styles for the arrowButtonsContainer
+   */
+  arrowButtonsContainer: IStyle;
+
+  /**
+   * Style override for the arrowButtonsContainer when spin button is disabled.
+   */
+  arrowButtonsContainerDisabled: IStyle;
 }
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts
new file mode 100644
index 0000000000000..af1ad386bc16d
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts
@@ -0,0 +1,97 @@
+import { memoizeFunction } from '../../Utilities';
+import { mergeStyles, IStyle } from '../../Styling';
+import { ISpinButtonStyles } from './SpinButton.Props';
+import { KeyboardSpinDirection } from './SpinButton';
+import { Position } from '../../utilities/positioning';
+
+export interface ISpinButtonClassNames {
+  root: string;
+  labelWrapper: string;
+  icon: string;
+  label: string;
+  spinButtonWrapper: string;
+  input: string;
+  arrowBox: string;
+}
+
+export const getClassNames = memoizeFunction((
+  styles: ISpinButtonStyles,
+  disabled: boolean,
+  isFocused: boolean,
+  keyboardSpinDirection: KeyboardSpinDirection,
+  labelPosition: Position = Position.start
+): ISpinButtonClassNames => {
+  return {
+    root: mergeStyles(
+      styles.root
+    ) as string,
+    labelWrapper: mergeStyles(
+      styles.labelWrapper,
+      _getStyleForLabelBasedOnPosition(labelPosition, styles)
+    ) as string,
+    icon: mergeStyles(
+      styles.icon,
+    ) as string,
+    label: mergeStyles(
+      styles.label
+    ) as string,
+    spinButtonWrapper: mergeStyles(
+      styles.spinButtonWrapper,
+      _getStyleForRootBasedOnPosition(labelPosition, styles),
+      !disabled && [
+        {
+          ':hover': styles.spinButtonWrapperHovered
+        },
+        isFocused && {
+          // This is to increase the specifity of the focus styles
+          // and make it equal to that of the hover styles.
+          '&&': styles.spinButtonWrapperFocused
+        }
+      ],
+      disabled && styles.spinButtonWrapperDisabled
+    ) as string,
+    input: mergeStyles(
+      'ms-spinButton-input',
+      styles.input,
+      !disabled && {
+        '::selection': styles.inputTextSelected
+      },
+      disabled && styles.inputDisabled,
+    ) as string,
+    arrowBox: mergeStyles(
+      styles.arrowButtonsContainer,
+      disabled && styles.arrowButtonsContainerDisabled
+    ) as string,
+  };
+});
+
+/**
+ * Returns the Style corresponding to the label position
+ */
+function _getStyleForLabelBasedOnPosition(labelPosition: Position, styles: ISpinButtonStyles): IStyle {
+  switch (labelPosition) {
+    case Position.start:
+      return styles.labelWrapperStart;
+    case Position.end:
+      return styles.labelWrapperEnd;
+    case Position.top:
+      return styles.labelWrapperTop;
+    case Position.bottom:
+      return styles.labelWrapperBottom;
+  }
+}
+
+/**
+ * Returns the Style corresponding to the label position
+ */
+function _getStyleForRootBasedOnPosition(labelPosition: Position, styles: ISpinButtonStyles): IStyle {
+  switch (labelPosition) {
+    case Position.top:
+    case Position.bottom:
+      return styles.spinButtonWrapperTopBottom;
+    default:
+      return {
+
+      };
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.scss b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.scss
deleted file mode 100644
index 90ea34b50ff0e..0000000000000
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.scss
+++ /dev/null
@@ -1,226 +0,0 @@
-@import '../../common/common';
-@import '../Label/LabelMixins.scss';
-
-.ArrowBox, .Input,
-.UpButton, .DownButton, .SpinButtonContainer {
-  outline: none;
-  font-size: 12px;
-}
-
-.SpinButtonLabel {
-  pointer-events: none;
-  padding: 2px 0px;
-}
-
-.SpinButtonContainer {
-  width: 100%;
-  min-width: 86px;
-  padding: 2px;
-}
-
-  .ArrowBox {
-    display: block;
-    float: left;
-    height: 100%;
-    border: 1px solid $ms-color-neutralTertiaryAlt;
-    border-left-width: 0px;
-    cursor: default;
-    padding: 0px;
-    box-sizing: border-box;
-  }
-
-  .SpinButtonWrapper:hover .ArrowBox, .SpinButtonWrapper:hover .Input {
-    border-color: $ms-color-neutralSecondaryAlt;
-    outline: 2px dashed transparent;
-
-    @media screen and (-ms-high-contrast: active) {
-      border-color: $ms-color-contrastBlackSelected;
-    }
-
-    @media screen and (-ms-high-contrast: black-on-white) {
-      border-color: $ms-color-contrastWhiteSelected;
-    }
-  }
-
-  .labelWrapper {
-    display: inline-flex;
-
-    &.start {
-       float: left;
-       margin-right: 10px;
-    }
-
-    &.end {
-      float: right;
-      margin-left: 10px;
-    }
-
-    &.top {
-      margin-bottom: 10px;
-    }
-
-    &.bottom {
-      margin-top: 10px;
-    }
-  }
-
-  .SpinButtonIcon {
-    padding: 2px 5px;
-    font-size: 20px;
-  }
-
-  .SpinButtonWrapper {
-    display: flex;
-    height: 26px;
-    min-width: 86px;
-  }
-
-  .SpinButtonWrapper.topBottom {
-    width: 100%;
-  }
-
-  .Input:focus + .ArrowBox {
-      border-color: $ms-color-themePrimary;
-      outline: 2px dashed transparent;
-
-      @media screen and (-ms-high-contrast: active) {
-        border-color: $ms-color-contrastBlackSelected;
-      }
-
-      @media screen and (-ms-high-contrast: black-on-white) {
-        border-color: $ms-color-contrastWhiteSelected;
-      }
-  }
-
-  .Input.disabled + .ArrowBox {
-    background-color: $ms-color-neutralLighter;
-    border-color: $ms-color-neutralLighter;
-    pointer-events: none;
-    cursor: default;
-
-    @media screen and (-ms-high-contrast: active) {
-    color: $ms-color-contrastBlackDisabled;
-    }
-
-    @media screen and (-ms-high-contrast: black-on-white) {
-      color: $ms-color-contrastWhiteDisabled;
-    }
-  }
-
-    .SpinButtonWrapper:hover .Input:focus {
-      border-color: $ms-color-themePrimary;
-    }
-
-  .Input {
-    @include ms-normalize;
-    border: 1px solid $ms-color-neutralTertiaryAlt;
-    border-radius: 0;
-    font-weight: $ms-font-weight-regular;
-    font-size: $ms-font-size-m;
-    color: $ms-color-neutralPrimary;
-    height: 100%;
-    @include padding(3px, 3px, 4px, 4px);
-    outline: 0;
-    text-overflow: ellipsis;
-    display: block;
-    float: left;
-    width: calc(100% - 14px);
-    min-width: 72px;
-    border-right-width: 0px;
-    overflow: hidden;
-    cursor: text;
-    user-select: text;
-
-    &:focus {
-      border-color: $ms-color-themePrimary;
-      outline: 2px dashed transparent;
-
-      @media screen and (-ms-high-contrast: active) {
-        border-color: $ms-color-contrastBlackSelected;
-      }
-
-      @media screen and (-ms-high-contrast: black-on-white) {
-        border-color: $ms-color-contrastWhiteSelected;
-      }
-    }
-
-    &::selection {
-      background-color: $ms-color-themePrimary;
-      color: $ms-color-white;
-    }
-  }
-
-  .SpinButtonWrapper:hover .Input.disabled,
-   .Input.disabled {
-      background-color: $ms-color-neutralLighter;
-      border-color: $ms-color-neutralLighter;
-      pointer-events: none;
-      cursor: default;
-      color: $ms-color-neutralTertiaryAlt;
-
-    @media screen and (-ms-high-contrast: active) {
-    color: $ms-color-contrastBlackDisabled;
-    }
-
-    @media screen and (-ms-high-contrast: black-on-white) {
-      color: $ms-color-contrastWhiteDisabled;
-    }
-  }
-
-  .Input:hover .UpButton, .Input:hover .DownButton {
-      background-color: $ms-color-neutralLighter;
-  }
-
-  .SpinButtonWrapper .UpButton, .SpinButtonWrapper .DownButton {
-    display: block;
-    height: 50%;
-    width: 12px;
-    padding: 0px;
-    background-color: transparent;
-    text-align: center;
-    cursor: default;
-    font-size: 6px;
-    color: $ms-color-neutralPrimary;
-
-    &:hover {
-      background-color: $ms-color-neutralLight;
-    }
-
-    &:active {
-      background-color: $ms-color-themePrimary;
-      color: $ms-color-white;
-
-      @media screen and (-ms-high-contrast: active) {
-        background-color: $ms-color-contrastBlackSelected;
-      }
-
-      @media screen and (-ms-high-contrast: black-on-white) {
-        background-color: $ms-color-contrastWhiteSelected;
-      }
-    }
-  }
-
-  .UpButton:disabled, .DownButton:disabled {
-    opacity: 0;
-
-    @media screen and (-ms-high-contrast: active) {
-    color: $ms-color-contrastBlackDisabled;
-    }
-
-    @media screen and (-ms-high-contrast: black-on-white) {
-      color: $ms-color-contrastWhiteDisabled;
-    }
-  }
-
-  .SpinButtonWrapper .UpButton.active, .SpinButtonWrapper .DownButton.active {
-      background-color: $ms-color-themePrimary;
-      color: $ms-color-white;
-
-      @media screen and (-ms-high-contrast: active) {
-        background-color: $ms-color-contrastBlackSelected;
-      }
-
-      @media screen and (-ms-high-contrast: black-on-white) {
-        background-color: $ms-color-contrastWhiteSelected;
-      }
-  }
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
new file mode 100644
index 0000000000000..5b629238fb20c
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
@@ -0,0 +1,244 @@
+import { IButtonStyles } from '../../Button';
+import { memoizeFunction } from '../../Utilities';
+import { ISpinButtonStyles } from './SpinButton.Props';
+
+import {
+  ITheme,
+  IStyle,
+  mergeStyleSets,
+} from '../../Styling';
+
+const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
+
+const _getDisabledStyles = memoizeFunction((theme: ITheme): IStyle => {
+  const { semanticColors, palette } = theme;
+
+  const SpinButtonTextColorDisabled = palette.neutralTertiaryAlt;
+  const SpinButtonBackgroundColorDisabled = palette.neutralLighter;
+  const SpinButtonBorderColorDisabled = palette.neutralLighter;
+
+  return {
+    backgroundColor: SpinButtonBackgroundColorDisabled,
+    borderColor: SpinButtonBorderColorDisabled,
+    pointerEvents: 'none',
+    cursor: 'default',
+    color: SpinButtonTextColorDisabled,
+    [MS_HIGHCONTRAST_ACTIVE]: {
+      color: 'GrayText'
+    }
+  };
+});
+
+export const getArrowButtonStyles = memoizeFunction((
+  theme: ITheme,
+  isUpArrow: boolean,
+  customSpecificArrowStyles?: Partial<IButtonStyles>,
+): IButtonStyles => {
+
+  const { semanticColors, fonts, palette } = theme;
+
+  const ArrowButtonTextColor = palette.neutralPrimary;
+  const ArrowButtonTextColorPressed = palette.white;
+  const ArrowButtonBackgroundHovered = palette.neutralLight;
+  const ArrowButtonBackgroundPressed = palette.themePrimary;
+
+  const defaultArrowButtonStyles: IButtonStyles = {
+    root: {
+      outline: 'none',
+      display: 'block',
+      height: '50%',
+      width: '14px',
+      paddingTop: '0',
+      paddingRight: '0',
+      paddingBottom: '0',
+      paddingLeft: '0',
+      backgroundColor: 'transparent',
+      textAlign: 'center',
+      cursor: 'default',
+      color: ArrowButtonTextColor
+    },
+    rootHovered: {
+      backgroundColor: ArrowButtonBackgroundHovered
+    },
+    rootChecked: {
+      backgroundColor: ArrowButtonBackgroundPressed,
+      color: ArrowButtonTextColorPressed,
+      [MS_HIGHCONTRAST_ACTIVE]: {
+        backgroundColor: 'Highlight',
+        color: 'HighlightText'
+      }
+    },
+    rootPressed: {
+      backgroundColor: ArrowButtonBackgroundPressed,
+      color: ArrowButtonTextColorPressed,
+      [MS_HIGHCONTRAST_ACTIVE]: {
+        backgroundColor: 'Highlight',
+        color: 'HighlightText'
+      }
+    },
+    rootDisabled: {
+      opacity: '0',
+      [MS_HIGHCONTRAST_ACTIVE]: {
+        color: 'GrayText'
+      }
+    },
+    icon: {
+      fontSize: '6px',
+      marginTop: '0',
+      marginRight: '0',
+      marginBottom: '0',
+      marginLeft: '0'
+    }
+  };
+
+  // No specific styles needed as of now.
+  const defaultUpArrowButtonStyles: Partial<IButtonStyles> = {
+
+  };
+
+  const defaultDownArrowButtonStyles: Partial<IButtonStyles> = {
+
+  };
+
+  return mergeStyleSets(
+    defaultArrowButtonStyles,
+    isUpArrow ? defaultUpArrowButtonStyles : defaultDownArrowButtonStyles,
+    customSpecificArrowStyles
+  ) as IButtonStyles;
+});
+
+export const getStyles = memoizeFunction((
+  theme: ITheme,
+  customStyles?: Partial<ISpinButtonStyles>
+): ISpinButtonStyles => {
+  const { semanticColors, fonts, palette } = theme;
+
+  const SpinButtonRootBorderColor = palette.neutralTertiaryAlt;
+  const SpinButtonRootBorderColorHovered = palette.neutralSecondary;
+  const SpinButtonRootBorderColorFocused = palette.themePrimary;
+
+  const SpinButtonInputTextColor = palette.neutralPrimary;
+  const SpinButtonInputTextColorSelected = palette.white;
+  const SpinButtonInputBackgroundColorSelected = palette.themePrimary;
+
+  const defaultStyles: ISpinButtonStyles = {
+    root: {
+      outline: 'none',
+      fontSize: '12px',
+      width: '100%',
+      minWidth: '86px',
+      paddingTop: '2px',
+      paddingRight: '2px',
+      paddingBottom: '2px',
+      paddingLeft: '2px',
+    },
+    labelWrapper: {
+      display: 'inline-flex'
+    },
+    labelWrapperStart: {
+      float: 'left',
+      marginRight: '10px'
+    },
+    labelWrapperEnd: {
+      float: 'right',
+      marginLeft: '10px'
+    },
+    labelWrapperTop: {
+      marginBottom: '10px'
+    },
+    labelWrapperBottom: {
+      marginTop: '10px'
+    },
+    icon: {
+      paddingTop: '2px',
+      paddingRight: '5px',
+      paddingBottom: '2px',
+      paddingLeft: '5px',
+
+      fontSize: '20px'
+    },
+    label: {
+      pointerEvents: 'none',
+      paddingTop: '2px',
+      paddingRight: '0',
+      paddingBottom: '2px',
+      paddingLeft: '0',
+    },
+    spinButtonWrapper: {
+      display: 'flex',
+      height: '26px',
+      minWidth: '86px',
+      borderWidth: '1px',
+      borderStyle: 'solid',
+      borderColor: SpinButtonRootBorderColor,
+    },
+    spinButtonWrapperTopBottom: {
+      width: '100%'
+    },
+    spinButtonWrapperHovered: {
+      borderColor: SpinButtonRootBorderColorHovered,
+      outline: '2px dashed transparent',
+      [MS_HIGHCONTRAST_ACTIVE]: {
+        borderColor: 'Highlight'
+      }
+    },
+    spinButtonWrapperFocused: {
+      borderColor: SpinButtonRootBorderColorFocused,
+      outline: '2px dashed transparent',
+      [MS_HIGHCONTRAST_ACTIVE]: {
+        borderColor: 'Highlight'
+      }
+    },
+    spinButtonWrapperDisabled: _getDisabledStyles(theme),
+    input: {
+      boxSizing: 'border-box',
+      boxShadow: 'none',
+      borderStyle: 'none',
+      marginTop: '0',
+      marginRight: '0',
+      marginBottom: '0',
+      marginLeft: '0',
+      fontSize: fonts.medium,
+      color: SpinButtonInputTextColor,
+      height: '100%',
+      paddingTop: '3px',
+      paddingRight: '3px',
+      paddingBottom: '4px',
+      paddingLeft: '4px',
+      outline: '0',
+      textOverflow: 'ellipsis',
+      display: 'block',
+      float: 'left',
+      width: 'calc(100% - 14px)',
+      minWidth: '72px',
+      overflow: 'hidden',
+      cursor: 'text',
+      userSelect: 'text'
+    },
+    inputTextSelected: {
+      backgroundColor: SpinButtonInputBackgroundColorSelected,
+      color: SpinButtonInputTextColorSelected,
+      [MS_HIGHCONTRAST_ACTIVE]: {
+        backgroundColor: 'Highlight',
+        borderColor: 'Highlight',
+        color: 'HighlightText',
+      }
+    },
+    inputDisabled: _getDisabledStyles(theme),
+    arrowButtonsContainer: {
+      outline: 'none',
+      fontSize: '12px',
+      display: 'block',
+      float: 'left',
+      height: '100%',
+      cursor: 'default',
+      paddingTop: '0',
+      paddingRight: '0',
+      paddingBottom: '0',
+      paddingLeft: '0',
+      boxSizing: 'border-box'
+    },
+    arrowButtonsContainerDisabled: _getDisabledStyles(theme),
+  };
+  return mergeStyleSets(defaultStyles, customStyles) as ISpinButtonStyles;
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index 0a09301c5f06d..ad635644405f1 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -4,18 +4,19 @@ import { Label } from '../../Label';
 import { Icon } from '../../Icon';
 import {
   BaseComponent,
-  css,
   getId,
   KeyCodes,
-  autobind
+  autobind,
+  customizable
 } from '../../Utilities';
+import { ThemeSettingName } from '../../Styling';
 import {
   ISpinButton,
-  ISpinButtonProps
+  ISpinButtonProps,
 } from './SpinButton.Props';
 import { Position } from '../../utilities/positioning';
-import * as stylesImport from './SpinButton.scss';
-const styles: any = stylesImport;
+import { getStyles, getArrowButtonStyles } from './SpinButton.styles';
+import { getClassNames } from './SpinButton.classNames';
 
 export enum KeyboardSpinDirection {
   down = -1,
@@ -24,18 +25,25 @@ export enum KeyboardSpinDirection {
 }
 
 export interface ISpinButtonState {
+
+  /**
+   * Is true when the control has focus.
+   */
+  isFocused: boolean;
+
   /**
    * the value of the spin button
    */
-  value?: string;
+  value: string;
 
   /**
    * keyboard spin direction, used to style the up or down button
    * as active when up/down arrow is pressed
    */
-  keyboardSpinDirection?: KeyboardSpinDirection;
+  keyboardSpinDirection: KeyboardSpinDirection;
 }
 
+@customizable([ThemeSettingName])
 export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState> implements ISpinButton {
 
   public static defaultProps: ISpinButtonProps = {
@@ -52,7 +60,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
   private _input: HTMLInputElement;
   private _inputId: string;
   private _labelId: string;
-  private _lastValidValue: string | undefined;
+  private _lastValidValue: string;
   private _spinningByMouse: boolean;
 
   private _onValidate?: (value: string) => string | void;
@@ -63,11 +71,6 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
   private _initialStepDelay = 400;
   private _stepDelay = 75;
   private _formattedValidUnitOptions: string[] = [];
-  private _arrowButtonStyle = {
-    icon: {
-      fontSize: '6px',
-    }
-  };
 
   constructor(props: ISpinButtonProps) {
     super(props);
@@ -80,6 +83,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
     this._lastValidValue = value;
 
     this.state = {
+      isFocused: false,
       value: value,
       keyboardSpinDirection: KeyboardSpinDirection.notSpinning
     };
@@ -128,28 +132,41 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
       incrementButtonIcon,
       decrementButtonIcon,
       title,
-      ariaLabel
+      ariaLabel,
+      styles: customStyles,
+      upArrowButtonStyles: customUpArrowButtonStyles,
+      downArrowButtonStyles: customDownArrowButtonStyles,
+      theme
     } = this.props;
 
     const {
+      isFocused,
       value,
       keyboardSpinDirection
     } = this.state;
 
+    const classNames = getClassNames(
+      getStyles(theme!, customStyles),
+      !!disabled,
+      !!isFocused,
+      keyboardSpinDirection,
+      labelPosition
+    );
+
     return (
-      <div className={ styles.SpinButtonContainer }>
-        { labelPosition !== Position.bottom && <div className={ css(styles.labelWrapper, this._getClassNameForLabelPosition(labelPosition as Position)) }>
-          { iconProps && <Icon iconName={ iconProps.iconName } className={ css(styles.SpinButtonIcon) } aria-hidden='true'></Icon> }
+      <div className={ classNames.root }>
+        { labelPosition !== Position.bottom && <div className={ classNames.labelWrapper }>
+          { iconProps && <Icon iconName={ iconProps.iconName } className={ classNames.icon } aria-hidden='true'></Icon> }
           { label &&
             <Label
               id={ this._labelId }
               htmlFor={ this._inputId }
-              className={ styles.SpinButtonLabel }>{ label }
+              className={ classNames.label }>{ label }
             </Label>
           }
         </div> }
         <div
-          className={ css(styles.SpinButtonWrapper, ((labelPosition === Position.top || labelPosition === Position.bottom) ? styles.topBottom : '')) }
+          className={ classNames.spinButtonWrapper }
           title={ title && title }
           aria-label={ ariaLabel && ariaLabel }
         >
@@ -158,25 +175,27 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
             id={ this._inputId }
             onChange={ this._onChange }
             onInput={ this._onInputChange }
-            className={ css(styles.Input, (disabled ? styles.disabled : '')) }
+            className={ classNames.input }
             type='text'
             role='spinbutton'
             aria-labelledby={ label && this._labelId }
             aria-valuenow={ value }
             aria-valuemin={ min && String(min) }
             aria-valuemax={ max && String(max) }
-            onBlur={ this._validate }
+            onBlur={ this._onBlur }
             ref={ this._resolveRef('_input') }
-            onFocus={ this.focus }
+            onFocus={ this._onFocus }
             onKeyDown={ this._handleKeyDown }
             onKeyUp={ this._handleKeyUp }
             readOnly={ disabled }
+            disabled={ disabled }
             aria-disabled={ disabled }
           />
-          <span className={ styles.ArrowBox }>
+          <span className={ classNames.arrowBox }>
             <IconButton
-              className={ css('ms-UpButton', styles.UpButton, (keyboardSpinDirection === KeyboardSpinDirection.up ? styles.active : '')) }
-              styles={ this._arrowButtonStyle }
+              styles={ getArrowButtonStyles(theme!, true, customUpArrowButtonStyles) }
+              className={ 'ms-UpButton' }
+              checked={ keyboardSpinDirection === KeyboardSpinDirection.up }
               disabled={ disabled }
               iconProps={ incrementButtonIcon }
               aria-hidden='true'
@@ -186,8 +205,9 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
               tabIndex={ -1 }
             />
             <IconButton
-              className={ css('ms-DownButton', styles.DownButton, (keyboardSpinDirection === KeyboardSpinDirection.down ? styles.active : '')) }
-              styles={ this._arrowButtonStyle }
+              styles={ getArrowButtonStyles(theme!, false, customDownArrowButtonStyles) }
+              className={ 'ms-DownButton' }
+              checked={ keyboardSpinDirection === KeyboardSpinDirection.down }
               disabled={ disabled }
               iconProps={ decrementButtonIcon }
               aria-hidden='true'
@@ -198,13 +218,13 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
             />
           </span>
         </div>
-        { labelPosition === Position.bottom && <div className={ css(styles.labelWrapper, this._getClassNameForLabelPosition(labelPosition)) }>
-          { iconProps && <Icon iconName={ iconProps.iconName } className={ css(styles.SpinButtonIcon) } aria-hidden='true'></Icon> }
+        { labelPosition === Position.bottom && <div className={ classNames.labelWrapper }>
+          { iconProps && <Icon iconName={ iconProps.iconName } className={ classNames.icon } aria-hidden='true'></Icon> }
           { label &&
             <Label
               id={ this._labelId }
               htmlFor={ this._inputId }
-              className={ styles.SpinButtonLabel }>{ label }
+              className={ classNames.label }>{ label }
             </Label>
           }
         </div>
@@ -213,16 +233,27 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
     );
   }
 
-  /**
-   * OnFocus select the contents of the input
-   */
-  public focus() {
+  public focus(): void {
+    if (this._input) {
+      this._input.focus();
+    }
+  }
+
+  @autobind
+  private _onFocus() {
     if (this._spinningByMouse || this.state.keyboardSpinDirection !== KeyboardSpinDirection.notSpinning) {
       this._stop();
     }
 
-    this._input.focus();
     this._input.select();
+
+    this.setState({ isFocused: true });
+  }
+
+  @autobind
+  private _onBlur(ev: React.FocusEvent<HTMLInputElement>): void {
+    this._validate(ev);
+    this.setState({ isFocused: false });
   }
 
   /**
@@ -259,29 +290,6 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
     return String(newValue);
   }
 
-  /**
-   * Returns the class name corresponding to the label position
-   */
-  private _getClassNameForLabelPosition(labelPosition: Position): string {
-    let className: string = '';
-
-    switch (labelPosition) {
-      case Position.start:
-        className = styles.start;
-        break;
-      case Position.end:
-        className = styles.end;
-        break;
-      case Position.top:
-        className = styles.top;
-        break;
-      case Position.bottom:
-        className = styles.bottom;
-    }
-
-    return className;
-  }
-
   private _onChange() {
     /**
      * A noop input change handler.
@@ -432,5 +440,4 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
   private _onDecrementMouseDown() {
     this._updateValue(true /* shouldSpin */, this._initialStepDelay, this._onDecrement!);
   }
-
 }
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
index 37fd9c958c51a..a920ebf0ce916 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
@@ -10,12 +10,14 @@ import { SpinButtonBasicDisabledExample } from './examples/SpinButton.BasicDisab
 import { SpinButtonStatefulExample } from './examples/SpinButton.Stateful.Example';
 import { SpinButtonBasicWithIconExample } from './examples/SpinButton.BasicWithIcon.Example';
 import { SpinButtonBasicWithEndPositionExample } from './examples/SpinButton.BasicWithEndPosition.Example';
+import { SpinButtonCustomStyledExample } from './examples/SpinButton.CustomStyled.Example';
 
 const SpinButtonBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx') as string;
 const SpinButtonBasicDisabledExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicDisabled.Example.tsx') as string;
 const SpinButtonStatefulExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx') as string;
 const SpinButtonBasicWithIconExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx') as string;
 const SpinButtonBasicWithEndPositionExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithEndPosition.Example.tsx') as string;
+const SpinButtonCustomStyledExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.CustomStyled.Example.tsx') as string;
 
 export class SpinButtonPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
@@ -50,6 +52,12 @@ export class SpinButtonPage extends React.Component<IComponentDemoPageProps, {}>
               code={ SpinButtonBasicWithEndPositionExampleCode }>
               <SpinButtonBasicWithEndPositionExample />
             </ExampleCard>
+            <ExampleCard
+              title={ 'Custom Styled SpinButton' }
+              code={ SpinButtonCustomStyledExampleCode }>
+              <SpinButtonCustomStyledExample />
+            </ExampleCard>
+
           </div>
         }
         propertiesTables={
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx
index 4999ef440bc24..284dfb2c945b2 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx
@@ -4,7 +4,7 @@ import { SpinButton } from 'office-ui-fabric-react/lib/SpinButton';
 export class SpinButtonBasicExample extends React.Component<any, any> {
   public render() {
     return (
-      <div style={ { width: '203px' } }>
+      <div style={ { width: '400px' } }>
         <SpinButton
           defaultValue='0'
           label={ 'Basic SpinButton:' }
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicDisabled.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicDisabled.Example.tsx
index b57b1d432db08..ba78d89b74575 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicDisabled.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicDisabled.Example.tsx
@@ -4,7 +4,7 @@ import { SpinButton } from 'office-ui-fabric-react/lib/SpinButton';
 export class SpinButtonBasicDisabledExample extends React.Component<any, any> {
   public render() {
     return (
-      <div style={ { width: '203px' } }>
+      <div style={ { width: '400px' } }>
         <SpinButton
           defaultValue='25'
           label={ 'Basic SpinButton:' }
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithEndPosition.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithEndPosition.Example.tsx
index 31d1d77b14ab5..be0e929dbd316 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithEndPosition.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithEndPosition.Example.tsx
@@ -5,7 +5,7 @@ import { Position } from 'office-ui-fabric-react/lib/utilities/positioning';
 export class SpinButtonBasicWithEndPositionExample extends React.Component<any, any> {
   public render() {
     return (
-      <div style={ { width: '233px' } }>
+      <div style={ { width: '400px' } }>
         <SpinButton
           defaultValue='0'
           iconProps={ { iconName: 'Light' } }
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx
index 056ba07096ba3..52ed163a323f9 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx
@@ -4,7 +4,7 @@ import { SpinButton } from 'office-ui-fabric-react/lib/SpinButton';
 export class SpinButtonBasicWithIconExample extends React.Component<any, any> {
   public render() {
     return (
-      <div style={ { width: '233px' } }>
+      <div style={ { width: '400px' } }>
         <SpinButton
           defaultValue='0'
           iconProps={ { iconName: 'IncreaseIndentLegacy' } }
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.CustomStyled.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.CustomStyled.Example.tsx
new file mode 100644
index 0000000000000..50b8480d4cffc
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.CustomStyled.Example.tsx
@@ -0,0 +1,46 @@
+import * as React from 'react';
+import { SpinButton, ISpinButtonStyles } from 'office-ui-fabric-react/lib/SpinButton';
+import { IButtonStyles } from 'office-ui-fabric-react/lib/Button';
+
+const styles: Partial<ISpinButtonStyles> = {
+  root: {
+    width: '400px'
+  }
+};
+
+const upArrowButtonStyles: Partial<IButtonStyles> = {
+  rootChecked: {
+    backgroundColor: 'green'
+  },
+  rootPressed: {
+    backgroundColor: 'green'
+  }
+};
+
+const downArrowButtonStyles: Partial<IButtonStyles> = {
+  rootChecked: {
+    backgroundColor: 'red'
+  },
+  rootPressed: {
+    backgroundColor: 'red'
+  }
+};
+
+export class SpinButtonCustomStyledExample extends React.Component<any, any> {
+  public render() {
+    return (
+      <div>
+        <SpinButton
+          styles={ styles }
+          upArrowButtonStyles={ upArrowButtonStyles }
+          downArrowButtonStyles={ downArrowButtonStyles }
+          defaultValue='0'
+          label={ 'Custom styled SpinButton:' }
+          min={ 0 }
+          max={ 100 }
+          step={ 1 }
+        />
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
index 205ddc1370100..8dab8ed7894ae 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
@@ -6,7 +6,7 @@ export class SpinButtonStatefulExample extends React.Component<any, any> {
     let suffix = ' cm';
 
     return (
-      <div style={ { width: '203px' } }>
+      <div style={ { width: '400px' } }>
         <SpinButton
           label='SpinButton with custom implementation:'
           value={ '7' + suffix }

From 40a60aa2489aa49074e7ed40b7de42f7125b5641 Mon Sep 17 00:00:00 2001
From: Kushal Yarlagadda <whykushal93@gmail.com>
Date: Mon, 7 Aug 2017 18:27:29 -0700
Subject: [PATCH 0376/1641] Combo box styling fixes (#2411)

* Moving child component stytles to main props.
-> This is done to avoid doing hacks while merging with the custom stylesets.
-> Also, to be consistent with the spinButton styling deisgn.
-> Corrected the example to use the correct API

* More fixes to the example page.

* Change files for PR

* Fixing a spelling and adding a comment.
---
 .../ComboBoxFixes_2017-08-07-23-15.json       | 11 ++++++
 .../ComboBoxFixes_2017-08-07-23-15.json       | 11 ++++++
 .../ComboBoxFixes_2017-08-07-23-15.json       | 11 ++++++
 .../ComboBoxFixes_2017-08-07-23-15.json       | 11 ++++++
 .../ComboBoxFixes_2017-08-07-23-15.json       | 11 ++++++
 .../src/components/ComboBox/ComboBox.Props.ts | 37 ++++++++++++-------
 .../components/ComboBox/ComboBox.styles.ts    | 12 +++---
 .../src/components/ComboBox/ComboBox.tsx      | 13 ++-----
 .../src/components/ComboBox/ComboBoxPage.tsx  | 13 +++++--
 .../ComboBox.CustomStyled.Example.tsx         | 12 +++---
 10 files changed, 103 insertions(+), 39 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/ComboBoxFixes_2017-08-07-23-15.json
 create mode 100644 common/changes/@uifabric/fabric-website/ComboBoxFixes_2017-08-07-23-15.json
 create mode 100644 common/changes/@uifabric/styling/ComboBoxFixes_2017-08-07-23-15.json
 create mode 100644 common/changes/@uifabric/utilities/ComboBoxFixes_2017-08-07-23-15.json
 create mode 100644 common/changes/office-ui-fabric-react/ComboBoxFixes_2017-08-07-23-15.json

diff --git a/common/changes/@uifabric/example-app-base/ComboBoxFixes_2017-08-07-23-15.json b/common/changes/@uifabric/example-app-base/ComboBoxFixes_2017-08-07-23-15.json
new file mode 100644
index 0000000000000..a48a2085ece6b
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/ComboBoxFixes_2017-08-07-23-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "kushaly@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/ComboBoxFixes_2017-08-07-23-15.json b/common/changes/@uifabric/fabric-website/ComboBoxFixes_2017-08-07-23-15.json
new file mode 100644
index 0000000000000..4df779311b07b
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/ComboBoxFixes_2017-08-07-23-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "kushaly@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/ComboBoxFixes_2017-08-07-23-15.json b/common/changes/@uifabric/styling/ComboBoxFixes_2017-08-07-23-15.json
new file mode 100644
index 0000000000000..1ed7dd6258d65
--- /dev/null
+++ b/common/changes/@uifabric/styling/ComboBoxFixes_2017-08-07-23-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "kushaly@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/ComboBoxFixes_2017-08-07-23-15.json b/common/changes/@uifabric/utilities/ComboBoxFixes_2017-08-07-23-15.json
new file mode 100644
index 0000000000000..8b9c98c03c0f4
--- /dev/null
+++ b/common/changes/@uifabric/utilities/ComboBoxFixes_2017-08-07-23-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "kushaly@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/ComboBoxFixes_2017-08-07-23-15.json b/common/changes/office-ui-fabric-react/ComboBoxFixes_2017-08-07-23-15.json
new file mode 100644
index 0000000000000..6e6cbc348604a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/ComboBoxFixes_2017-08-07-23-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Putting the child component styles in the main props and a few other fixes",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kushaly@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
index 127e073d58faf..fa2644c5ce4f5 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
@@ -13,6 +13,11 @@ export interface IComboBox {
 }
 
 export interface IComboBoxOption extends ISelectableOption {
+  /**
+   * Specific styles for each comboBox option. If you intend to give
+   * common styles to all comboBox option please use
+   * the prop comboBoxOptionStyles
+   */
   styles?: Partial<IComboBoxOptionStyles>;
 }
 
@@ -72,6 +77,17 @@ export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox>
    * Custom styles for this component
    */
   styles?: Partial<IComboBoxStyles>;
+
+  /**
+   * Styles for the caret down button.
+   */
+  caretDownButtonStyles?: Partial<IButtonStyles>;
+
+  /**
+   * Default styles that should be applied to ComboBox options,
+   * in case an option does not come with user-defined custom styles
+   */
+  comboBoxOptionStyles?: Partial<IComboBoxOptionStyles>;
 }
 
 export interface IComboBoxStyles {
@@ -129,11 +145,6 @@ export interface IComboBoxStyles {
    */
   inputDisabled: IStyle;
 
-  /**
-   * Styles for the caret down button.
-   */
-  caretDownButtonStyles: Partial<IComboBoxCaretDownButtonStyles> | null;
-
   /**
    * Styles for the error Message text of the comboBox.
    */
@@ -159,17 +170,15 @@ export interface IComboBoxStyles {
    * Styles for a divider in the options.
    */
   divider: IStyle;
-
-  /**
-   * Default styles that should be applied to ComboBox options,
-   * incase an option does not come with user-defined custom styles
-   */
-  optionDefaultStyles: Partial<IComboBoxOptionStyles> | null;
 }
 
 export interface IComboBoxOptionStyles extends IButtonStyles {
-  optionText: IStyle;
-}
 
-export interface IComboBoxCaretDownButtonStyles extends IButtonStyles {
+  /**
+   * Styles for the text inside the comboBox option.
+   * This should be used instead of the description
+   * inside IButtonStyles because we custom render the text
+   * in the comboBox options.
+   */
+  optionText: IStyle;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index 7dea57473c0ef..ce05fec67f052 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -1,7 +1,6 @@
 import {
   IComboBoxStyles,
   IComboBoxOptionStyles,
-  IComboBoxCaretDownButtonStyles
 } from './ComboBox.Props';
 import {
   ITheme,
@@ -11,6 +10,7 @@ import {
   FontWeights,
   getFocusStyle
 } from '../../Styling';
+import { IButtonStyles } from '../../Button';
 import { memoizeFunction } from '../../Utilities';
 
 const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
@@ -143,15 +143,15 @@ export const getOptionStyles = memoizeFunction((
 
 export const getCaretDownButtonStyles = memoizeFunction((
   theme: ITheme,
-  customStyles?: Partial<IComboBoxCaretDownButtonStyles>,
-): IComboBoxCaretDownButtonStyles => {
+  customStyles?: Partial<IButtonStyles>,
+): IButtonStyles => {
   const { semanticColors, fonts, palette } = theme;
 
   const caretButtonTextColor = palette.neutralDark;
   const caretButtonBackgroundHovered = palette.neutralQuaternaryAlt;
   const caretButtonBackgroundActive = palette.neutralTertiaryAlt;
 
-  const styles: IComboBoxCaretDownButtonStyles = {
+  const styles: IButtonStyles = {
     root: {
       color: caretButtonTextColor,
       fontSize: FontSizes.small,
@@ -175,7 +175,7 @@ export const getCaretDownButtonStyles = memoizeFunction((
     },
     rootDisabled: getDisabledStyles(theme),
   };
-  return mergeStyleSets(styles, customStyles) as IComboBoxCaretDownButtonStyles;
+  return mergeStyleSets(styles, customStyles) as IButtonStyles;
 });
 
 export const getStyles = memoizeFunction((
@@ -271,7 +271,6 @@ export const getStyles = memoizeFunction((
       paddingLeft: '12px'
     },
     inputDisabled: getDisabledStyles(theme),
-    caretDownButtonStyles: null,
     errorMessage: {
       color: ComboBoxRootColorErrored,
       ':before': {
@@ -312,7 +311,6 @@ export const getStyles = memoizeFunction((
       borderStyle: 'solid',
       borderColor: ComboBoxOptionDividerBorderColor
     },
-    optionDefaultStyles: null,
   };
 
   return mergeStyleSets(styles, customStyles) as IComboBoxStyles;
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 1cd04d6922c1a..ba5e71e686239 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -1242,10 +1242,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
  * @param item Item props for the current option
  */
   private _getCaretButtonStyles() {
-    const { styles: customStyles } = this.props;
-    const caretButtoncustomStyles = customStyles ? customStyles.caretDownButtonStyles : null;
-
-    return getCaretDownButtonStyles(this.props.theme!, caretButtoncustomStyles!);
+    const { caretDownButtonStyles: customCaretDownButtonStyles } = this.props;
+    return getCaretDownButtonStyles(this.props.theme!, customCaretDownButtonStyles);
   }
 
   /**
@@ -1253,12 +1251,9 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * @param item Item props for the current option
    */
   private _getCurrentOptionStyles(item: IComboBoxOption) {
-    const { styles: customStyles } = this.props;
-    const customStylesForAllOptions = customStyles ? customStyles.optionDefaultStyles : null;
+    const { comboBoxOptionStyles: customStylesForAllOptions } = this.props;
     const { styles: customStylesForCurrentOption } = item;
 
-    const isSelected: boolean = this._isOptionSelected(item.index);
-
-    return getOptionStyles(this.props.theme!, customStylesForAllOptions!, customStylesForCurrentOption);
+    return getOptionStyles(this.props.theme!, customStylesForAllOptions, customStylesForCurrentOption);
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
index 2343fb9ad0972..5be3cc7cf10b2 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
@@ -9,6 +9,7 @@ import { ComboBoxBasicExample } from './examples/ComboBox.Basic.Example';
 import { ComboBoxCustomStyledExample } from './examples/ComboBox.CustomStyled.Example';
 
 const ComboBoxBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx') as string;
+const ComboBoxCustomStyledExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.CustomStyled.Example.tsx') as string;
 
 export class ComboBoxPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
@@ -17,10 +18,14 @@ export class ComboBoxPage extends React.Component<IComponentDemoPageProps, {}> {
         title='ComboBox'
         componentName='ComboBoxExample'
         exampleCards={
-          <ExampleCard title='ComboBox' code={ ComboBoxBasicExampleCode }>
-            <ComboBoxBasicExample />
-            <ComboBoxCustomStyledExample />
-          </ExampleCard>
+          <div>
+            <ExampleCard title='ComboBox' code={ ComboBoxBasicExampleCode }>
+              <ComboBoxBasicExample />
+            </ExampleCard>
+            <ExampleCard title='ComboBoxCustomStyled' code={ ComboBoxCustomStyledExampleCode }>
+              <ComboBoxCustomStyledExample />
+            </ExampleCard>
+          </div>
         }
         propertiesTables={
           <PropertiesTableSet
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.CustomStyled.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.CustomStyled.Example.tsx
index 573583dde420f..728414abe404b 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.CustomStyled.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.CustomStyled.Example.tsx
@@ -71,11 +71,13 @@ export class ComboBoxCustomStyledExample extends React.Component<any, any> {
               container: {
                 maxWidth: '300px'
               },
-              optionDefaultStyles: {
-                optionText: {
-                  fontFamily: 'initial', // this should be overriden by custom styles for each option
-                },
-              }
+            }
+          }
+          comboBoxOptionStyles={
+            {
+              optionText: {
+                fontFamily: 'initial', // this should be overriden by custom styles for each option
+              },
             }
           }
         />

From 5588aeea04b799744c9159401e448f76749c64e0 Mon Sep 17 00:00:00 2001
From: Yimin Wu <yimwu@microsoft.com>
Date: Mon, 7 Aug 2017 22:08:33 -0700
Subject: [PATCH 0377/1641] Checkbox: add custom render function for checkbox
 label. (#2389)

* Checkbox: add custom render function for checkbox label.

* Fix type script warning

* rush change

* Fix review comment

* fix review comment.
---
 .../yimwu-checkbox_2017-08-03-23-05.json      | 11 ++++++++
 .../src/components/Checkbox/Checkbox.Props.ts |  6 +++++
 .../src/components/Checkbox/Checkbox.tsx      | 27 ++++++++++++++-----
 .../examples/Checkbox.Basic.Example.tsx       | 18 +++++++++++--
 4 files changed, 53 insertions(+), 9 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/yimwu-checkbox_2017-08-03-23-05.json

diff --git a/common/changes/office-ui-fabric-react/yimwu-checkbox_2017-08-03-23-05.json b/common/changes/office-ui-fabric-react/yimwu-checkbox_2017-08-03-23-05.json
new file mode 100644
index 0000000000000..ff3eef1f10457
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/yimwu-checkbox_2017-08-03-23-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Checkbox: add custom render function for checkbox label.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "yimwu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
index 866919fe50e75..7263df43c023a 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { IStyle, ITheme } from '../../Styling';
+import { IRenderFunction } from '../../Utilities';
 
 /**
  * Checkbox class interface.
@@ -77,6 +78,11 @@ export interface ICheckboxProps extends React.ButtonHTMLAttributes<HTMLElement |
    * Custom styles for this component
    */
   styles?: ICheckboxStyles;
+
+  /**
+   * Custom render function for the label.
+   */
+  onRenderLabel?: IRenderFunction<ICheckboxProps>;
 }
 
 export interface ICheckboxStyles {
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
index 9baddbb8f5cb1..b2db9a3326295 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
@@ -41,6 +41,7 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
 
   private _checkBox: HTMLInputElement;
   private _id: string;
+  private _classNames: ICheckboxClassNames;
 
   /**
    * Initialize a new instance of the TopHeaderV2
@@ -83,12 +84,13 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
       boxSide,
       theme,
       styles: customStyles,
-        } = this.props;
+      onRenderLabel = this._onRenderLabel
+    } = this.props;
 
     const isChecked = checked === undefined ? this.state.isChecked : checked;
     const isReversed = boxSide !== 'start' ? true : false;
 
-    const classNames = this._getClassNames(
+    this._classNames = this._getClassNames(
       getStyles(theme!, customStyles),
       className!,
       disabled!,
@@ -107,18 +109,18 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
         id={ this._id }
         role='checkbox'
         type='button'
-        className={ classNames.root }
+        className={ this._classNames.root }
         onClick={ this._onClick }
         onFocus={ this._onFocus }
         onBlur={ this._onBlur }
         aria-checked={ isChecked }
         aria-disabled={ disabled }
       >
-        <label className={ classNames.label } htmlFor={ this._id } >
-          <div className={ classNames.checkbox }>
-            <Icon iconName='CheckMark' className={ classNames.checkmark } />
+        <label className={ this._classNames.label } htmlFor={ this._id } >
+          <div className={ this._classNames.checkbox }>
+            <Icon iconName='CheckMark' className={ this._classNames.checkmark } />
           </div>
-          { label && <span className={ classNames.text }>{ label }</span> }
+          { onRenderLabel(this.props, this._onRenderLabel) }
         </label>
       </button>
     );
@@ -169,6 +171,17 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
     }
   }
 
+  @autobind
+  private _onRenderLabel(props: ICheckboxProps) {
+    const { label } = props;
+
+    return label ? (
+      <span className={ this._classNames.text }>{ label }</span>
+    ) : (
+        null
+      );
+  }
+
   @memoize
   private _getClassNames(
     styles: ICheckboxStyles,
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
index 61af4d7df03be..65fe061af03fc 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
@@ -1,9 +1,13 @@
 import * as React from 'react';
 import {
   Checkbox,
-  ICheckboxStyles
+  ICheckboxStyles,
+  ICheckboxProps
 } from 'office-ui-fabric-react/lib/Checkbox';
-
+import {
+  Persona,
+  PersonaSize
+} from 'office-ui-fabric-react/lib/Persona';
 export interface ICheckboxBasicExampleState {
   isChecked: boolean;
 }
@@ -75,6 +79,12 @@ export class CheckboxBasicExample extends React.Component<{}, ICheckboxBasicExam
           boxSide='end'
           styles={ styles }
         />
+
+        <Checkbox
+          label='Persona Checkbox'
+          styles={ styles }
+          onRenderLabel={ this._renderPersonaLabel }
+        />
       </div>
     );
   }
@@ -83,4 +93,8 @@ export class CheckboxBasicExample extends React.Component<{}, ICheckboxBasicExam
     console.log(`The option has been changed to ${isChecked}.`);
   }
 
+  private _renderPersonaLabel(props: ICheckboxProps) {
+    const DEFAULT_IMAGE_URL = '/_layouts/15/userphoto.aspx?size=S&accountname=';
+    return <Persona primaryText={ props.label } imageUrl={ DEFAULT_IMAGE_URL } size={ PersonaSize.extraSmall } />;
+  }
 }

From af2981df86ec3bcd1a6c073fda4768d5a1768f4a Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Tue, 8 Aug 2017 08:12:30 -0700
Subject: [PATCH 0378/1641] Unbreak publish loop by removing duplicate empty
 change file. (#2420)

---
 .../thomabr-MoveSharedCellLogicToGrid_2017-08-03-16-49.json       | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/thomabr-MoveSharedCellLogicToGrid_2017-08-03-16-49.json

diff --git a/common/changes/office-ui-fabric-react/thomabr-MoveSharedCellLogicToGrid_2017-08-03-16-49.json b/common/changes/office-ui-fabric-react/thomabr-MoveSharedCellLogicToGrid_2017-08-03-16-49.json
deleted file mode 100644
index e69de29bb2d1d..0000000000000

From 231ef83db44a8da2e437f3436de05a2b39946f51 Mon Sep 17 00:00:00 2001
From: Ricky Patel <rickyp@microsoft.com>
Date: Tue, 8 Aug 2017 08:13:12 -0700
Subject: [PATCH 0379/1641] Added role to the "no results" element in
 suggestions (#2409)

* Added role to the no results div

* Added change file
---
 .../rickyp-2345_2017-08-07-21-26.json                 | 11 +++++++++++
 .../components/pickers/Suggestions/Suggestions.tsx    |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/rickyp-2345_2017-08-07-21-26.json

diff --git a/common/changes/office-ui-fabric-react/rickyp-2345_2017-08-07-21-26.json b/common/changes/office-ui-fabric-react/rickyp-2345_2017-08-07-21-26.json
new file mode 100644
index 0000000000000..7827e483c2a60
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/rickyp-2345_2017-08-07-21-26.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added role alert to \"no results\" view ",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "rickyp@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index 2cf7a5f338b6c..2c160e7f60e10 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -95,7 +95,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
 
     let noResults = () => {
       return noResultsFoundText ?
-        <div className={ css('ms-Suggestions-none', styles.suggestionsNone) }>
+        <div role='alert' className={ css('ms-Suggestions-none', styles.suggestionsNone) }>
           { noResultsFoundText }
         </div> : null;
     };

From 2215701231ed8d5c3c08b73d8fa45e4e461eb29e Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 8 Aug 2017 15:28:32 +0000
Subject: [PATCH 0380/1641] Applying package updates.

---
 .../ComboBoxFixes_2017-08-07-23-15.json       | 11 ----
 .../SpinButtonGlamor_2017-07-27-00-34.json    | 11 ----
 .../ComboBoxFixes_2017-08-07-23-15.json       | 11 ----
 .../SpinButtonGlamor_2017-07-27-00-34.json    | 11 ----
 .../ComboBoxFixes_2017-08-07-23-15.json       | 11 ----
 .../SpinButtonGlamor_2017-07-27-00-34.json    | 11 ----
 ...ton-screenReaderText_2017-08-01-18-55.json | 11 ----
 .../ComboBoxFixes_2017-08-07-23-15.json       | 11 ----
 .../SpinButtonGlamor_2017-07-27-00-34.json    | 11 ----
 .../ComboBoxFixes_2017-08-07-23-15.json       | 11 ----
 .../SpinButtonGlamor_2017-07-27-00-34.json    | 11 ----
 ...ton-screenReaderText_2017-08-01-18-55.json | 11 ----
 ...itbutton-styling-fix_2017-07-13-21-32.json | 11 ----
 .../rickyp-2345_2017-08-07-21-26.json         | 11 ----
 ...haredCellLogicToGrid_2017-08-03-18-46.json | 11 ----
 .../yimwu-checkbox_2017-08-03-23-05.json      | 11 ----
 packages/example-app-base/package.json        |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 51 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 18 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/CHANGELOG.json               | 19 +++++++
 packages/styling/CHANGELOG.md                 | 10 +++-
 packages/styling/package.json                 |  2 +-
 23 files changed, 100 insertions(+), 182 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/ComboBoxFixes_2017-08-07-23-15.json
 delete mode 100644 common/changes/@uifabric/example-app-base/SpinButtonGlamor_2017-07-27-00-34.json
 delete mode 100644 common/changes/@uifabric/fabric-website/ComboBoxFixes_2017-08-07-23-15.json
 delete mode 100644 common/changes/@uifabric/fabric-website/SpinButtonGlamor_2017-07-27-00-34.json
 delete mode 100644 common/changes/@uifabric/styling/ComboBoxFixes_2017-08-07-23-15.json
 delete mode 100644 common/changes/@uifabric/styling/SpinButtonGlamor_2017-07-27-00-34.json
 delete mode 100644 common/changes/@uifabric/styling/baseButton-screenReaderText_2017-08-01-18-55.json
 delete mode 100644 common/changes/@uifabric/utilities/ComboBoxFixes_2017-08-07-23-15.json
 delete mode 100644 common/changes/@uifabric/utilities/SpinButtonGlamor_2017-07-27-00-34.json
 delete mode 100644 common/changes/office-ui-fabric-react/ComboBoxFixes_2017-08-07-23-15.json
 delete mode 100644 common/changes/office-ui-fabric-react/SpinButtonGlamor_2017-07-27-00-34.json
 delete mode 100644 common/changes/office-ui-fabric-react/baseButton-screenReaderText_2017-08-01-18-55.json
 delete mode 100644 common/changes/office-ui-fabric-react/boemor-splitbutton-styling-fix_2017-07-13-21-32.json
 delete mode 100644 common/changes/office-ui-fabric-react/rickyp-2345_2017-08-07-21-26.json
 delete mode 100644 common/changes/office-ui-fabric-react/thomabr-MoveSharedCellLogicToGrid_2017-08-03-18-46.json
 delete mode 100644 common/changes/office-ui-fabric-react/yimwu-checkbox_2017-08-03-23-05.json

diff --git a/common/changes/@uifabric/example-app-base/ComboBoxFixes_2017-08-07-23-15.json b/common/changes/@uifabric/example-app-base/ComboBoxFixes_2017-08-07-23-15.json
deleted file mode 100644
index a48a2085ece6b..0000000000000
--- a/common/changes/@uifabric/example-app-base/ComboBoxFixes_2017-08-07-23-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "kushaly@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/SpinButtonGlamor_2017-07-27-00-34.json b/common/changes/@uifabric/example-app-base/SpinButtonGlamor_2017-07-27-00-34.json
deleted file mode 100644
index a48a2085ece6b..0000000000000
--- a/common/changes/@uifabric/example-app-base/SpinButtonGlamor_2017-07-27-00-34.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "kushaly@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/ComboBoxFixes_2017-08-07-23-15.json b/common/changes/@uifabric/fabric-website/ComboBoxFixes_2017-08-07-23-15.json
deleted file mode 100644
index 4df779311b07b..0000000000000
--- a/common/changes/@uifabric/fabric-website/ComboBoxFixes_2017-08-07-23-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "kushaly@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/SpinButtonGlamor_2017-07-27-00-34.json b/common/changes/@uifabric/fabric-website/SpinButtonGlamor_2017-07-27-00-34.json
deleted file mode 100644
index 4df779311b07b..0000000000000
--- a/common/changes/@uifabric/fabric-website/SpinButtonGlamor_2017-07-27-00-34.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "kushaly@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/ComboBoxFixes_2017-08-07-23-15.json b/common/changes/@uifabric/styling/ComboBoxFixes_2017-08-07-23-15.json
deleted file mode 100644
index 1ed7dd6258d65..0000000000000
--- a/common/changes/@uifabric/styling/ComboBoxFixes_2017-08-07-23-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "kushaly@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/SpinButtonGlamor_2017-07-27-00-34.json b/common/changes/@uifabric/styling/SpinButtonGlamor_2017-07-27-00-34.json
deleted file mode 100644
index a68ad2cf20bef..0000000000000
--- a/common/changes/@uifabric/styling/SpinButtonGlamor_2017-07-27-00-34.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Adding a color to the palette",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "kushaly@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/baseButton-screenReaderText_2017-08-01-18-55.json b/common/changes/@uifabric/styling/baseButton-screenReaderText_2017-08-01-18-55.json
deleted file mode 100644
index 064c36181a005..0000000000000
--- a/common/changes/@uifabric/styling/baseButton-screenReaderText_2017-08-01-18-55.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Styling: added a screenReaderText utility style",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/ComboBoxFixes_2017-08-07-23-15.json b/common/changes/@uifabric/utilities/ComboBoxFixes_2017-08-07-23-15.json
deleted file mode 100644
index 8b9c98c03c0f4..0000000000000
--- a/common/changes/@uifabric/utilities/ComboBoxFixes_2017-08-07-23-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "kushaly@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/SpinButtonGlamor_2017-07-27-00-34.json b/common/changes/@uifabric/utilities/SpinButtonGlamor_2017-07-27-00-34.json
deleted file mode 100644
index 8b9c98c03c0f4..0000000000000
--- a/common/changes/@uifabric/utilities/SpinButtonGlamor_2017-07-27-00-34.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "kushaly@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/ComboBoxFixes_2017-08-07-23-15.json b/common/changes/office-ui-fabric-react/ComboBoxFixes_2017-08-07-23-15.json
deleted file mode 100644
index 6e6cbc348604a..0000000000000
--- a/common/changes/office-ui-fabric-react/ComboBoxFixes_2017-08-07-23-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Putting the child component styles in the main props and a few other fixes",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kushaly@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/SpinButtonGlamor_2017-07-27-00-34.json b/common/changes/office-ui-fabric-react/SpinButtonGlamor_2017-07-27-00-34.json
deleted file mode 100644
index b3008d0371000..0000000000000
--- a/common/changes/office-ui-fabric-react/SpinButtonGlamor_2017-07-27-00-34.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Moving SpinButton to Glamor based styling",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kushaly@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/baseButton-screenReaderText_2017-08-01-18-55.json b/common/changes/office-ui-fabric-react/baseButton-screenReaderText_2017-08-01-18-55.json
deleted file mode 100644
index 05383ef66f633..0000000000000
--- a/common/changes/office-ui-fabric-react/baseButton-screenReaderText_2017-08-01-18-55.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "BaseButton: Added screenReaderText styles to base button",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/boemor-splitbutton-styling-fix_2017-07-13-21-32.json b/common/changes/office-ui-fabric-react/boemor-splitbutton-styling-fix_2017-07-13-21-32.json
deleted file mode 100644
index cc43d5db16142..0000000000000
--- a/common/changes/office-ui-fabric-react/boemor-splitbutton-styling-fix_2017-07-13-21-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "BaseButton: Remove the IconButton dependency that was introduced with SplitButton.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "boemor@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/rickyp-2345_2017-08-07-21-26.json b/common/changes/office-ui-fabric-react/rickyp-2345_2017-08-07-21-26.json
deleted file mode 100644
index 7827e483c2a60..0000000000000
--- a/common/changes/office-ui-fabric-react/rickyp-2345_2017-08-07-21-26.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added role alert to \"no results\" view ",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "rickyp@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/thomabr-MoveSharedCellLogicToGrid_2017-08-03-18-46.json b/common/changes/office-ui-fabric-react/thomabr-MoveSharedCellLogicToGrid_2017-08-03-18-46.json
deleted file mode 100644
index 90923e15ad39c..0000000000000
--- a/common/changes/office-ui-fabric-react/thomabr-MoveSharedCellLogicToGrid_2017-08-03-18-46.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "GridCell: Add a component to handle the shared logic managing selection and navigation of cells within all consumers of the Grid class. This change also updates the SwatchColorPicker to  use the GridCell component and removes  most of the logic now contained in the GridCell component.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "thomabr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/yimwu-checkbox_2017-08-03-23-05.json b/common/changes/office-ui-fabric-react/yimwu-checkbox_2017-08-03-23-05.json
deleted file mode 100644
index ff3eef1f10457..0000000000000
--- a/common/changes/office-ui-fabric-react/yimwu-checkbox_2017-08-03-23-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Checkbox: add custom render function for checkbox label.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "yimwu@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 4f56a23f4bfed..b35f584d045c8 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -48,7 +48,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.17.0 <1.0.0",
+    "@uifabric/styling": ">=0.19.0 <1.0.0",
     "@uifabric/utilities": ">=4.9.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index c61aca5674fe1..19103ac8700b4 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,57 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.31.0",
+      "tag": "office-ui-fabric-react_v4.31.0",
+      "date": "Tue, 08 Aug 2017 15:28:32 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "a92eb2a9a79dcab033bdbe78ca7a18b2d6607e99",
+            "comment": "BaseButton: Added screenReaderText styles to base button"
+          },
+          {
+            "author": "Boris Emorine <boris.emorine@gmail.com>",
+            "commit": "3966386109ba377bd35636def5b8f86ca9bcb3d0",
+            "comment": "BaseButton: Remove the IconButton dependency that was introduced with SplitButton."
+          },
+          {
+            "author": "Ricky Patel <rickyp@microsoft.com>",
+            "commit": "231ef83db44a8da2e437f3436de05a2b39946f51",
+            "comment": "Added role alert to \"no results\" view "
+          }
+        ],
+        "minor": [
+          {
+            "author": "Kushal Yarlagadda <whykushal93@gmail.com>",
+            "commit": "40a60aa2489aa49074e7ed40b7de42f7125b5641",
+            "comment": "ComboBox: Putting the child component styles in the main props and a few other fixes"
+          },
+          {
+            "author": "Kushal Yarlagadda <whykushal93@gmail.com>",
+            "commit": "a7bc11ddacabfcfbf4fbc56e99e6d13ea296b787",
+            "comment": "Moving SpinButton to Glamor based styling"
+          },
+          {
+            "author": "thomabr <thomabr@microsoft.com>",
+            "commit": "5e07c6d8d3518ef0301b1d1655dc467f4f7a0d3b",
+            "comment": "GridCell: Add a component to handle the shared logic managing selection and navigation of cells within all consumers of the Grid class. This change also updates the SwatchColorPicker to  use the GridCell component and removes  most of the logic now contained in the GridCell component."
+          },
+          {
+            "author": "Yimin Wu <yimwu@microsoft.com>",
+            "commit": "5588aeea04b799744c9159401e448f76749c64e0",
+            "comment": "Checkbox: add custom render function for checkbox label."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.17.0 <1.0.0` to `>=0.19.0 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.30.1",
       "tag": "office-ui-fabric-react_v4.30.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index ad039ff878c34..315a829a9b601 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,22 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 07 Aug 2017 10:22:46 GMT and should not be manually modified.
+This log was last generated on Tue, 08 Aug 2017 15:28:32 GMT and should not be manually modified.
+
+## 4.31.0
+Tue, 08 Aug 2017 15:28:32 GMT
+
+### Minor changes
+
+- ComboBox: Putting the child component styles in the main props and a few other fixes
+- Moving SpinButton to Glamor based styling
+- GridCell: Add a component to handle the shared logic managing selection and navigation of cells within all consumers of the Grid class. This change also updates the SwatchColorPicker to  use the GridCell component and removes  most of the logic now contained in the GridCell component.
+- Checkbox: add custom render function for checkbox label.
+
+### Patches
+
+- BaseButton: Added screenReaderText styles to base button
+- BaseButton: Remove the IconButton dependency that was introduced with SplitButton.
+- Added role alert to "no results" view 
 
 ## 4.30.1
 Mon, 07 Aug 2017 10:22:46 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 14d1c49958886..7223a09bbd39f 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.30.1",
+  "version": "4.31.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
     "@uifabric/utilities": ">=4.9.0 <5.0.0",
-    "@uifabric/styling": ">=0.17.0 <1.0.0",
+    "@uifabric/styling": ">=0.19.0 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index c22d3ad6ea227..c61515c1f6032 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.19.0",
+      "tag": "@uifabric/styling_v0.19.0",
+      "date": "Tue, 08 Aug 2017 15:28:32 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "a92eb2a9a79dcab033bdbe78ca7a18b2d6607e99",
+            "comment": "Styling: added a screenReaderText utility style"
+          },
+          {
+            "author": "Kushal Yarlagadda <whykushal93@gmail.com>",
+            "commit": "a7bc11ddacabfcfbf4fbc56e99e6d13ea296b787",
+            "comment": "Adding a color to the palette"
+          }
+        ]
+      }
+    },
     {
       "version": "0.18.0",
       "tag": "@uifabric/styling_v0.18.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 71f55634d717d..77f41a860a0d2 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Mon, 07 Aug 2017 10:22:46 GMT and should not be manually modified.
+This log was last generated on Tue, 08 Aug 2017 15:28:32 GMT and should not be manually modified.
+
+## 0.19.0
+Tue, 08 Aug 2017 15:28:32 GMT
+
+### Minor changes
+
+- Styling: added a screenReaderText utility style
+- Adding a color to the palette
 
 ## 0.18.0
 Mon, 07 Aug 2017 10:22:46 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 57ade4cbec5bc..0d3269a0a5b96 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.18.0",
+  "version": "0.19.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From c66fa123e9533644a1e1401005c8dc8a425aa448 Mon Sep 17 00:00:00 2001
From: Qianqian Li <lqq201194@163.com>
Date: Wed, 9 Aug 2017 00:35:50 +0800
Subject: [PATCH 0381/1641] Add two icons: streamLogo and powerBILogo (#2394)

* add commit json file

* add StreamLogo, rename PowerBiLogo in IconCodes to PowerBILogo

* rush change

* delete last commit

* Update IconCodes.ts

* Update add-StreamLogo-and-rename-PowerBiLogo_2017-08-04-09-35.json

* Update add-StreamLogo-and-rename-PowerBiLogo_2017-08-04-09-35.json
---
 ...mLogo-and-rename-PowerBiLogo_2017-08-04-09-35.json | 11 +++++++++++
 ...mLogo-and-rename-PowerBiLogo_2017-08-04-09-35.json | 11 +++++++++++
 .../src/components/Icon/IconName.ts                   |  1 +
 packages/styling/src/styles/IconCodes.ts              |  8 ++++++++
 4 files changed, 31 insertions(+)
 create mode 100644 common/changes/@uifabric/styling/add-StreamLogo-and-rename-PowerBiLogo_2017-08-04-09-35.json
 create mode 100644 common/changes/office-ui-fabric-react/add-StreamLogo-and-rename-PowerBiLogo_2017-08-04-09-35.json

diff --git a/common/changes/@uifabric/styling/add-StreamLogo-and-rename-PowerBiLogo_2017-08-04-09-35.json b/common/changes/@uifabric/styling/add-StreamLogo-and-rename-PowerBiLogo_2017-08-04-09-35.json
new file mode 100644
index 0000000000000..991872c2a48dc
--- /dev/null
+++ b/common/changes/@uifabric/styling/add-StreamLogo-and-rename-PowerBiLogo_2017-08-04-09-35.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "add StreamLogo and PowerBILogo icons",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "t-qianl@microsoft.com"
+}
diff --git a/common/changes/office-ui-fabric-react/add-StreamLogo-and-rename-PowerBiLogo_2017-08-04-09-35.json b/common/changes/office-ui-fabric-react/add-StreamLogo-and-rename-PowerBiLogo_2017-08-04-09-35.json
new file mode 100644
index 0000000000000..e3b69ae0e1ad0
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/add-StreamLogo-and-rename-PowerBiLogo_2017-08-04-09-35.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "add StreamLogo and PowerBILogo icons",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "t-qianl@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Icon/IconName.ts b/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
index a507209b9c33c..f818a5337cc7d 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
@@ -768,6 +768,7 @@ export type IconName =
   'StoreLogoMed' |
   'Storyboard' |
   'Streaming' |
+  'StreamLogo' |
   'Strikethrough' |
   'Subscribe' |
   'Subscript' |
diff --git a/packages/styling/src/styles/IconCodes.ts b/packages/styling/src/styles/IconCodes.ts
index 4c86073c46fd1..d4636b8ca7163 100644
--- a/packages/styling/src/styles/IconCodes.ts
+++ b/packages/styling/src/styles/IconCodes.ts
@@ -1991,6 +1991,10 @@ export const IconCodes = {
    * Icon code with the value '\uEA1E'.
    */
   powerBiLogo: '\uEA1E',
+  /**
+   * Icon code with the value '\uEA1E'.
+   */
+  powerBILogo: '\uEA1E',
   /**
    * Icon code with the value '\uEF72'.
    */
@@ -2471,6 +2475,10 @@ export const IconCodes = {
    * Icon code with the value '\uEA04'.
    */
   storeLogoMed: '\uEA04',
+  /**
+   * Icon code with the value '\uF329'.
+   */
+  streamLogo: '\uF329',
   /**
    * Icon code with the value '\uEDE0'.
    */

From 727496ecd243ea0b6087858d8b4581604cfb5dc6 Mon Sep 17 00:00:00 2001
From: Srikanth Deshpande <srideshpande@users.noreply.github.com>
Date: Tue, 8 Aug 2017 14:18:42 -0700
Subject: [PATCH 0382/1641] Srideshpande/updating the package-lock.json and
 package.json with latest rush to unblock npm install  (#2413)

* new line

* [srideshpande] Updating the package-lock.json with the latest rush version to avoid npm install errors.
---
 package-lock.json | 1118 +++++++++++++++++++++++++++++++++++++++------
 package.json      |    2 +-
 2 files changed, 970 insertions(+), 150 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index a378394bfcf6b..e9f580f183c8d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2,6 +2,7 @@
   "name": "office-ui-fabric-react-repo",
   "version": "1.0.0",
   "lockfileVersion": 1,
+  "requires": true,
   "dependencies": {
     "@microsoft/package-deps-hash": {
       "version": "2.0.2",
@@ -10,22 +11,58 @@
       "dev": true
     },
     "@microsoft/rush": {
-      "version": "3.0.7",
-      "resolved": "https://registry.npmjs.org/@microsoft/rush/-/rush-3.0.7.tgz",
-      "integrity": "sha1-3fehsUYJ+0E1Aoej9anz70gVC7w=",
-      "dev": true
+      "version": "3.0.12",
+      "resolved": "https://registry.npmjs.org/@microsoft/rush/-/rush-3.0.12.tgz",
+      "integrity": "sha1-oLbMMxg7Bp+mY8gSwjK6EUGR440=",
+      "dev": true,
+      "requires": {
+        "@microsoft/package-deps-hash": "2.0.2",
+        "@microsoft/rush-lib": "3.0.12",
+        "@microsoft/stream-collator": "2.0.1",
+        "@microsoft/ts-command-line": "2.0.1",
+        "builtins": "1.0.3",
+        "colors": "1.1.2",
+        "fs-extra": "0.26.7",
+        "glob": "7.0.6",
+        "glob-escape": "0.0.2",
+        "inquirer": "1.2.3",
+        "lodash": "4.15.0",
+        "minimatch": "3.0.4",
+        "npm-package-arg": "5.1.2",
+        "read-package-tree": "5.1.6",
+        "semver": "5.3.0",
+        "wordwrap": "1.0.0"
+      }
     },
     "@microsoft/rush-lib": {
-      "version": "3.0.7",
-      "resolved": "https://registry.npmjs.org/@microsoft/rush-lib/-/rush-lib-3.0.7.tgz",
-      "integrity": "sha1-bKgpmEgMMxDKcHqeWW+NXAA+MMQ=",
-      "dev": true
+      "version": "3.0.12",
+      "resolved": "https://registry.npmjs.org/@microsoft/rush-lib/-/rush-lib-3.0.12.tgz",
+      "integrity": "sha1-EQYu0qO0nvRUaJPuQPWmctNBgIM=",
+      "dev": true,
+      "requires": {
+        "@microsoft/stream-collator": "2.0.1",
+        "@types/es6-collections": "0.5.29",
+        "@types/fs-extra": "0.0.37",
+        "@types/node": "6.0.62",
+        "@types/z-schema": "3.16.31",
+        "fs-extra": "0.26.7",
+        "git-repo-info": "1.1.4",
+        "jju": "1.3.0",
+        "lodash": "4.15.0",
+        "rimraf": "2.5.4",
+        "semver": "5.3.0",
+        "z-schema": "3.17.0"
+      }
     },
     "@microsoft/stream-collator": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/@microsoft/stream-collator/-/stream-collator-2.0.1.tgz",
       "integrity": "sha1-HGf86/kwM8KdIAwKkPOPQr/mBeY=",
       "dev": true,
+      "requires": {
+        "@types/node": "6.0.64",
+        "colors": "1.1.2"
+      },
       "dependencies": {
         "@types/node": {
           "version": "6.0.64",
@@ -40,6 +77,11 @@
       "resolved": "https://registry.npmjs.org/@microsoft/ts-command-line/-/ts-command-line-2.0.1.tgz",
       "integrity": "sha1-v1nDvt0A4eg/mM8xYki6+eYTEo4=",
       "dev": true,
+      "requires": {
+        "@types/node": "6.0.64",
+        "argparse": "1.0.9",
+        "colors": "1.1.2"
+      },
       "dependencies": {
         "@types/node": {
           "version": "6.0.64",
@@ -59,7 +101,10 @@
       "version": "0.0.37",
       "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.37.tgz",
       "integrity": "sha1-GV8RvNmhuX2eQSxrZombVFRxofc=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "@types/node": "6.0.62"
+      }
     },
     "@types/node": {
       "version": "6.0.62",
@@ -78,6 +123,10 @@
       "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-2.1.1.tgz",
       "integrity": "sha1-1t4Q1a9hMtW9aSQn1G/FOFOQlMc=",
       "dev": true,
+      "requires": {
+        "extend": "3.0.1",
+        "semver": "5.0.3"
+      },
       "dependencies": {
         "semver": {
           "version": "5.0.3",
@@ -92,7 +141,11 @@
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz",
       "integrity": "sha1-gv+wKynmYq5TvcIK8VlHcGc5xTY=",
       "dev": true,
-      "optional": true
+      "optional": true,
+      "requires": {
+        "co": "4.6.0",
+        "json-stable-stringify": "1.0.1"
+      }
     },
     "ansi-escapes": {
       "version": "1.4.0",
@@ -122,13 +175,19 @@
       "version": "1.0.9",
       "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.9.tgz",
       "integrity": "sha1-c9g7wmP4bpf4zE9rrhsOkKfSLIY=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "sprintf-js": "1.0.3"
+      }
     },
     "arr-diff": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
       "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "arr-flatten": "1.0.3"
+      }
     },
     "arr-flatten": {
       "version": "1.0.3",
@@ -206,7 +265,10 @@
       "resolved": "https://registry.npmjs.org/bcrypt-pbkdf/-/bcrypt-pbkdf-1.0.1.tgz",
       "integrity": "sha1-Y7xdy2EzG5K8Bf1SiVPDNGKgb40=",
       "dev": true,
-      "optional": true
+      "optional": true,
+      "requires": {
+        "tweetnacl": "0.14.5"
+      }
     },
     "beeper": {
       "version": "1.1.1",
@@ -218,19 +280,31 @@
       "version": "2.10.1",
       "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
       "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "hoek": "2.16.3"
+      }
     },
     "brace-expansion": {
       "version": "1.1.8",
       "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.8.tgz",
       "integrity": "sha1-wHshHHyVLsH479Uad+8NHTmQopI=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "balanced-match": "1.0.0",
+        "concat-map": "0.0.1"
+      }
     },
     "braces": {
       "version": "1.8.5",
       "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
       "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "expand-range": "1.8.2",
+        "preserve": "0.2.0",
+        "repeat-element": "1.1.2"
+      }
     },
     "builtin-modules": {
       "version": "1.1.1",
@@ -261,13 +335,23 @@
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
       "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "ansi-styles": "2.2.1",
+        "escape-string-regexp": "1.0.5",
+        "has-ansi": "2.0.0",
+        "strip-ansi": "3.0.1",
+        "supports-color": "2.0.0"
+      }
     },
     "cli-cursor": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-1.0.2.tgz",
       "integrity": "sha1-ZNo/fValRBLll5S9Ytw1KV6PKYc=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "restore-cursor": "1.0.1"
+      }
     },
     "cli-width": {
       "version": "2.1.0",
@@ -279,7 +363,12 @@
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
       "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "string-width": "1.0.2",
+        "strip-ansi": "3.0.1",
+        "wrap-ansi": "2.1.0"
+      }
     },
     "clone": {
       "version": "1.0.2",
@@ -316,14 +405,20 @@
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz",
       "integrity": "sha1-k4NwpXtKUd6ix3wV1cX9+JUWQAk=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "delayed-stream": "1.0.0"
+      }
     },
     "commander": {
       "version": "2.9.0",
       "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
       "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q=",
       "dev": true,
-      "optional": true
+      "optional": true,
+      "requires": {
+        "graceful-readlink": "1.0.1"
+      }
     },
     "concat-map": {
       "version": "0.0.1",
@@ -335,7 +430,12 @@
       "version": "1.6.0",
       "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.0.tgz",
       "integrity": "sha1-CqxmL9Ur54lk1VMvaUeE5wEQrPc=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "inherits": "2.0.3",
+        "readable-stream": "2.2.11",
+        "typedarray": "0.0.6"
+      }
     },
     "core-util-is": {
       "version": "1.0.2",
@@ -348,7 +448,10 @@
       "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz",
       "integrity": "sha1-O9/s3GCBR8HGcgL6KR59ylnqo7g=",
       "dev": true,
-      "optional": true
+      "optional": true,
+      "requires": {
+        "boom": "2.10.1"
+      }
     },
     "dashdash": {
       "version": "1.14.1",
@@ -356,6 +459,9 @@
       "integrity": "sha1-hTz6D3y+L+1d4gMmuN1YEDX24vA=",
       "dev": true,
       "optional": true,
+      "requires": {
+        "assert-plus": "1.0.0"
+      },
       "dependencies": {
         "assert-plus": {
           "version": "1.0.0",
@@ -376,7 +482,10 @@
       "version": "2.6.8",
       "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
       "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "ms": "2.0.0"
+      }
     },
     "debuglog": {
       "version": "1.0.1",
@@ -394,7 +503,10 @@
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.3.tgz",
       "integrity": "sha1-xlYFHpgX2f8I7YgUd/P+QBnz730=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "clone": "1.0.2"
+      }
     },
     "delayed-stream": {
       "version": "1.0.0",
@@ -412,19 +524,29 @@
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/detect-file/-/detect-file-0.1.0.tgz",
       "integrity": "sha1-STXe39lIhkjgBrASlWbpOGcR6mM=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "fs-exists-sync": "0.1.0"
+      }
     },
     "dezalgo": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/dezalgo/-/dezalgo-1.0.3.tgz",
       "integrity": "sha1-f3Qt4Gb8dIvI24IFad3c5Jvw1FY=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "asap": "2.0.5",
+        "wrappy": "1.0.2"
+      }
     },
     "duplexer2": {
       "version": "0.0.2",
       "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.0.2.tgz",
       "integrity": "sha1-xhTc9n4vsUmVqRcR5aYX6KYKMds=",
       "dev": true,
+      "requires": {
+        "readable-stream": "1.1.14"
+      },
       "dependencies": {
         "isarray": {
           "version": "0.0.1",
@@ -436,7 +558,13 @@
           "version": "1.1.14",
           "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
           "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk=",
-          "dev": true
+          "dev": true,
+          "requires": {
+            "core-util-is": "1.0.2",
+            "inherits": "2.0.3",
+            "isarray": "0.0.1",
+            "string_decoder": "0.10.31"
+          }
         },
         "string_decoder": {
           "version": "0.10.31",
@@ -451,19 +579,28 @@
       "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.1.tgz",
       "integrity": "sha1-D8c6ntXw1Tw4GTOYUj735UN3dQU=",
       "dev": true,
-      "optional": true
+      "optional": true,
+      "requires": {
+        "jsbn": "0.1.1"
+      }
     },
     "end-of-stream": {
       "version": "0.1.5",
       "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-0.1.5.tgz",
       "integrity": "sha1-jhdyBsPICDfYVjLouTWd/osvbq8=",
       "dev": true,
+      "requires": {
+        "once": "1.3.3"
+      },
       "dependencies": {
         "once": {
           "version": "1.3.3",
           "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz",
           "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA=",
-          "dev": true
+          "dev": true,
+          "requires": {
+            "wrappy": "1.0.2"
+          }
         }
       }
     },
@@ -471,7 +608,10 @@
       "version": "1.3.1",
       "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.1.tgz",
       "integrity": "sha1-+FWobOYa3E6GIcPNoh56dhLDqNw=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "is-arrayish": "0.2.1"
+      }
     },
     "escape-string-regexp": {
       "version": "1.0.5",
@@ -489,19 +629,28 @@
       "version": "0.1.5",
       "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
       "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "is-posix-bracket": "0.1.1"
+      }
     },
     "expand-range": {
       "version": "1.8.2",
       "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz",
       "integrity": "sha1-opnv/TNf4nIeuujiV+x5ZE/IUzc=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "fill-range": "2.2.3"
+      }
     },
     "expand-tilde": {
       "version": "1.2.2",
       "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-1.2.2.tgz",
       "integrity": "sha1-C4HrqJflo9MdHD0QL48BRB5VlEk=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "os-homedir": "1.0.2"
+      }
     },
     "extend": {
       "version": "3.0.1",
@@ -513,13 +662,21 @@
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/external-editor/-/external-editor-1.1.1.tgz",
       "integrity": "sha1-Etew24UPf/fnCBuvQAVwAGDEYAs=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "extend": "3.0.1",
+        "spawn-sync": "1.0.15",
+        "tmp": "0.0.29"
+      }
     },
     "extglob": {
       "version": "0.3.2",
       "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
       "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "is-extglob": "1.0.0"
+      }
     },
     "extsprintf": {
       "version": "1.0.2",
@@ -531,13 +688,21 @@
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/fancy-log/-/fancy-log-1.3.0.tgz",
       "integrity": "sha1-Rb4X0Cu5kX1gzP/UmVyZnmyMmUg=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "chalk": "1.1.3",
+        "time-stamp": "1.1.0"
+      }
     },
     "figures": {
       "version": "1.7.0",
       "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz",
       "integrity": "sha1-y+Hjr/zxzUS4DK3+0o3Hk6lwHS4=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "escape-string-regexp": "1.0.5",
+        "object-assign": "4.1.1"
+      }
     },
     "filename-regex": {
       "version": "2.0.1",
@@ -549,7 +714,14 @@
       "version": "2.2.3",
       "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz",
       "integrity": "sha1-ULd9/X5Gm8dJJHCWNpn+eoSFpyM=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "is-number": "2.1.0",
+        "isobject": "2.1.0",
+        "randomatic": "1.1.7",
+        "repeat-element": "1.1.2",
+        "repeat-string": "1.6.1"
+      }
     },
     "find-index": {
       "version": "0.1.1",
@@ -561,19 +733,38 @@
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
       "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "path-exists": "2.1.0",
+        "pinkie-promise": "2.0.1"
+      }
     },
     "findup-sync": {
       "version": "0.4.3",
       "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.4.3.tgz",
       "integrity": "sha1-QAQ5Kee8YK3wt/SCfExudaDeyhI=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "detect-file": "0.1.0",
+        "is-glob": "2.0.1",
+        "micromatch": "2.3.11",
+        "resolve-dir": "0.1.1"
+      }
     },
     "fined": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/fined/-/fined-1.0.2.tgz",
       "integrity": "sha1-WyhCS3YNdZiWC374SA3/itNmDpc=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "expand-tilde": "1.2.2",
+        "lodash.assignwith": "4.2.0",
+        "lodash.isempty": "4.4.0",
+        "lodash.isplainobject": "4.0.6",
+        "lodash.isstring": "4.0.1",
+        "lodash.pick": "4.4.0",
+        "parse-filepath": "1.0.1"
+      }
     },
     "first-chunk-stream": {
       "version": "1.0.0",
@@ -591,7 +782,11 @@
       "version": "0.0.7",
       "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-0.0.7.tgz",
       "integrity": "sha1-NLkLqyqRGqNHVx2pDyK9NuzYqRk=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "debug": "2.6.8",
+        "stream-consume": "0.1.0"
+      }
     },
     "for-in": {
       "version": "1.0.2",
@@ -603,7 +798,10 @@
       "version": "0.1.5",
       "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz",
       "integrity": "sha1-UmXGgaTylNq78XyVCbZ2OqhFEM4=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "for-in": "1.0.2"
+      }
     },
     "forever-agent": {
       "version": "0.6.1",
@@ -617,7 +815,12 @@
       "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
       "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE=",
       "dev": true,
-      "optional": true
+      "optional": true,
+      "requires": {
+        "asynckit": "0.4.0",
+        "combined-stream": "1.0.5",
+        "mime-types": "2.1.15"
+      }
     },
     "fs-exists-sync": {
       "version": "0.1.0",
@@ -629,7 +832,14 @@
       "version": "0.26.7",
       "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz",
       "integrity": "sha1-muH92UiXeY7at20JGM9C0MMYT6k=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "graceful-fs": "4.1.11",
+        "jsonfile": "2.4.0",
+        "klaw": "1.3.1",
+        "path-is-absolute": "1.0.1",
+        "rimraf": "2.5.4"
+      }
     },
     "fs.realpath": {
       "version": "1.0.0",
@@ -641,7 +851,10 @@
       "version": "0.5.2",
       "resolved": "https://registry.npmjs.org/gaze/-/gaze-0.5.2.tgz",
       "integrity": "sha1-QLcJU30k0dRXZ9takIaJ3+aaxE8=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "globule": "0.1.0"
+      }
     },
     "get-caller-file": {
       "version": "1.0.2",
@@ -655,6 +868,9 @@
       "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo=",
       "dev": true,
       "optional": true,
+      "requires": {
+        "assert-plus": "1.0.0"
+      },
       "dependencies": {
         "assert-plus": {
           "version": "1.0.0",
@@ -675,19 +891,37 @@
       "version": "7.3.2",
       "resolved": "https://registry.npmjs.org/github/-/github-7.3.2.tgz",
       "integrity": "sha1-/hDN5pZDUsXZHhGnYW0m1f+2+Hs=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "follow-redirects": "0.0.7",
+        "https-proxy-agent": "1.0.0",
+        "mime": "1.3.6",
+        "netrc": "0.1.4"
+      }
     },
     "glob": {
       "version": "7.0.6",
       "resolved": "https://registry.npmjs.org/glob/-/glob-7.0.6.tgz",
       "integrity": "sha1-IRuvr0nlJbjNkyYNFKsTYVKz9Xo=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "fs.realpath": "1.0.0",
+        "inflight": "1.0.6",
+        "inherits": "2.0.3",
+        "minimatch": "3.0.4",
+        "once": "1.4.0",
+        "path-is-absolute": "1.0.1"
+      }
     },
     "glob-base": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz",
       "integrity": "sha1-27Fk9iIbHAscz4Kuoyi0l98Oo8Q=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "glob-parent": "2.0.0",
+        "is-glob": "2.0.1"
+      }
     },
     "glob-escape": {
       "version": "0.0.2",
@@ -699,19 +933,36 @@
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz",
       "integrity": "sha1-gTg9ctsFT8zPUzbaqQLxgvbtuyg=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "is-glob": "2.0.1"
+      }
     },
     "glob-stream": {
       "version": "3.1.18",
       "resolved": "https://registry.npmjs.org/glob-stream/-/glob-stream-3.1.18.tgz",
       "integrity": "sha1-kXCl8St5Awb9/lmPMT+PeVT9FDs=",
       "dev": true,
+      "requires": {
+        "glob": "4.5.3",
+        "glob2base": "0.0.12",
+        "minimatch": "2.0.10",
+        "ordered-read-streams": "0.1.0",
+        "through2": "0.6.5",
+        "unique-stream": "1.0.0"
+      },
       "dependencies": {
         "glob": {
           "version": "4.5.3",
           "resolved": "https://registry.npmjs.org/glob/-/glob-4.5.3.tgz",
           "integrity": "sha1-xstz0yJsHv7wTePFbQEvAzd+4V8=",
-          "dev": true
+          "dev": true,
+          "requires": {
+            "inflight": "1.0.6",
+            "inherits": "2.0.3",
+            "minimatch": "2.0.10",
+            "once": "1.4.0"
+          }
         },
         "isarray": {
           "version": "0.0.1",
@@ -723,13 +974,22 @@
           "version": "2.0.10",
           "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-2.0.10.tgz",
           "integrity": "sha1-jQh8OcazjAAbl/ynzm0OHoCvusc=",
-          "dev": true
+          "dev": true,
+          "requires": {
+            "brace-expansion": "1.1.8"
+          }
         },
         "readable-stream": {
           "version": "1.0.34",
           "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
           "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=",
-          "dev": true
+          "dev": true,
+          "requires": {
+            "core-util-is": "1.0.2",
+            "inherits": "2.0.3",
+            "isarray": "0.0.1",
+            "string_decoder": "0.10.31"
+          }
         },
         "string_decoder": {
           "version": "0.10.31",
@@ -741,7 +1001,11 @@
           "version": "0.6.5",
           "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
           "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg=",
-          "dev": true
+          "dev": true,
+          "requires": {
+            "readable-stream": "1.0.34",
+            "xtend": "4.0.1"
+          }
         }
       }
     },
@@ -749,37 +1013,63 @@
       "version": "0.0.6",
       "resolved": "https://registry.npmjs.org/glob-watcher/-/glob-watcher-0.0.6.tgz",
       "integrity": "sha1-uVtKjfdLOcgymLDAXJeLTZo7cQs=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "gaze": "0.5.2"
+      }
     },
     "glob2base": {
       "version": "0.0.12",
       "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz",
       "integrity": "sha1-nUGbPijxLoOjYhZKJ3BVkiycDVY=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "find-index": "0.1.1"
+      }
     },
     "global-modules": {
       "version": "0.2.3",
       "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-0.2.3.tgz",
       "integrity": "sha1-6lo77ULG1s6ZWk+KEmm12uIjgo0=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "global-prefix": "0.1.5",
+        "is-windows": "0.2.0"
+      }
     },
     "global-prefix": {
       "version": "0.1.5",
       "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-0.1.5.tgz",
       "integrity": "sha1-jTvGuNo8qBEqFg2NSW/wRiv+948=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "homedir-polyfill": "1.0.1",
+        "ini": "1.3.4",
+        "is-windows": "0.2.0",
+        "which": "1.2.14"
+      }
     },
     "globule": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/globule/-/globule-0.1.0.tgz",
       "integrity": "sha1-2cjt3h2nnRJaFRt5UzuXhnY0auU=",
       "dev": true,
+      "requires": {
+        "glob": "3.1.21",
+        "lodash": "1.0.2",
+        "minimatch": "0.2.14"
+      },
       "dependencies": {
         "glob": {
           "version": "3.1.21",
           "resolved": "https://registry.npmjs.org/glob/-/glob-3.1.21.tgz",
           "integrity": "sha1-0p4KBV3qUTj00H7UDomC6DwgZs0=",
-          "dev": true
+          "dev": true,
+          "requires": {
+            "graceful-fs": "1.2.3",
+            "inherits": "1.0.2",
+            "minimatch": "0.2.14"
+          }
         },
         "graceful-fs": {
           "version": "1.2.3",
@@ -803,7 +1093,11 @@
           "version": "0.2.14",
           "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.2.14.tgz",
           "integrity": "sha1-x054BXT2PG+aCQ6Q775u9TpqdWo=",
-          "dev": true
+          "dev": true,
+          "requires": {
+            "lru-cache": "2.7.3",
+            "sigmund": "1.0.1"
+          }
         }
       }
     },
@@ -811,7 +1105,10 @@
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/glogg/-/glogg-1.0.0.tgz",
       "integrity": "sha1-f+DxmfV6yQbPUS/urY+Q7kooT8U=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "sparkles": "1.0.0"
+      }
     },
     "graceful-fs": {
       "version": "4.1.11",
@@ -831,6 +1128,21 @@
       "resolved": "https://registry.npmjs.org/gulp/-/gulp-3.9.1.tgz",
       "integrity": "sha1-VxzkWSjdQK9lFPxAEYZgFsE4RbQ=",
       "dev": true,
+      "requires": {
+        "archy": "1.0.0",
+        "chalk": "1.1.3",
+        "deprecated": "0.0.1",
+        "gulp-util": "3.0.8",
+        "interpret": "1.0.3",
+        "liftoff": "2.3.0",
+        "minimist": "1.2.0",
+        "orchestrator": "0.3.8",
+        "pretty-hrtime": "1.0.3",
+        "semver": "4.3.6",
+        "tildify": "1.2.0",
+        "v8flags": "2.1.1",
+        "vinyl-fs": "0.3.14"
+      },
       "dependencies": {
         "semver": {
           "version": "4.3.6",
@@ -845,6 +1157,26 @@
       "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.8.tgz",
       "integrity": "sha1-AFTh50RQLifATBh8PsxQXdVLu08=",
       "dev": true,
+      "requires": {
+        "array-differ": "1.0.0",
+        "array-uniq": "1.0.3",
+        "beeper": "1.1.1",
+        "chalk": "1.1.3",
+        "dateformat": "2.0.0",
+        "fancy-log": "1.3.0",
+        "gulplog": "1.0.0",
+        "has-gulplog": "0.1.0",
+        "lodash._reescape": "3.0.0",
+        "lodash._reevaluate": "3.0.0",
+        "lodash._reinterpolate": "3.0.0",
+        "lodash.template": "3.6.2",
+        "minimist": "1.2.0",
+        "multipipe": "0.1.2",
+        "object-assign": "3.0.0",
+        "replace-ext": "0.0.1",
+        "through2": "2.0.3",
+        "vinyl": "0.5.3"
+      },
       "dependencies": {
         "object-assign": {
           "version": "3.0.0",
@@ -858,7 +1190,10 @@
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/gulplog/-/gulplog-1.0.0.tgz",
       "integrity": "sha1-4oxNRdBey77YGDY86PnFkmIp/+U=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "glogg": "1.0.0"
+      }
     },
     "har-schema": {
       "version": "1.0.5",
@@ -872,26 +1207,42 @@
       "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz",
       "integrity": "sha1-M0gdDxu/9gDdID11gSpqX7oALio=",
       "dev": true,
-      "optional": true
+      "optional": true,
+      "requires": {
+        "ajv": "4.11.8",
+        "har-schema": "1.0.5"
+      }
     },
     "has-ansi": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz",
       "integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "ansi-regex": "2.1.1"
+      }
     },
     "has-gulplog": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/has-gulplog/-/has-gulplog-0.1.0.tgz",
       "integrity": "sha1-ZBTIKRNpfaUVkDl9r7EvIpZ4Ec4=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "sparkles": "1.0.0"
+      }
     },
     "hawk": {
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz",
       "integrity": "sha1-B4REvXwWQLD+VA0sm3PVlnjo4cQ=",
       "dev": true,
-      "optional": true
+      "optional": true,
+      "requires": {
+        "boom": "2.10.1",
+        "cryptiles": "2.0.5",
+        "hoek": "2.16.3",
+        "sntp": "1.0.9"
+      }
     },
     "hoek": {
       "version": "2.16.3",
@@ -903,7 +1254,10 @@
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.1.tgz",
       "integrity": "sha1-TCu8inWJmP7r9e1oWA921GdotLw=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "parse-passwd": "1.0.0"
+      }
     },
     "hosted-git-info": {
       "version": "2.4.2",
@@ -916,19 +1270,33 @@
       "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz",
       "integrity": "sha1-33LiZwZs0Kxn+3at+OE0qPvPkb8=",
       "dev": true,
-      "optional": true
+      "optional": true,
+      "requires": {
+        "assert-plus": "0.2.0",
+        "jsprim": "1.4.0",
+        "sshpk": "1.13.1"
+      }
     },
     "https-proxy-agent": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-1.0.0.tgz",
       "integrity": "sha1-NffabEjOTdv6JkiRrFk+5f+GceY=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "agent-base": "2.1.1",
+        "debug": "2.6.8",
+        "extend": "3.0.1"
+      }
     },
     "inflight": {
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
       "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "once": "1.4.0",
+        "wrappy": "1.0.2"
+      }
     },
     "inherits": {
       "version": "2.0.3",
@@ -946,7 +1314,23 @@
       "version": "1.2.3",
       "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-1.2.3.tgz",
       "integrity": "sha1-TexvMvN+97sLLtPx0aXD9UUHSRg=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "ansi-escapes": "1.4.0",
+        "chalk": "1.1.3",
+        "cli-cursor": "1.0.2",
+        "cli-width": "2.1.0",
+        "external-editor": "1.1.1",
+        "figures": "1.7.0",
+        "lodash": "4.15.0",
+        "mute-stream": "0.0.6",
+        "pinkie-promise": "2.0.1",
+        "run-async": "2.3.0",
+        "rx": "4.1.0",
+        "string-width": "1.0.2",
+        "strip-ansi": "3.0.1",
+        "through": "2.3.8"
+      }
     },
     "interpret": {
       "version": "1.0.3",
@@ -964,7 +1348,11 @@
       "version": "0.2.6",
       "resolved": "https://registry.npmjs.org/is-absolute/-/is-absolute-0.2.6.tgz",
       "integrity": "sha1-IN5p89uULvLYe5wto28XIjWxtes=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "is-relative": "0.2.1",
+        "is-windows": "0.2.0"
+      }
     },
     "is-arrayish": {
       "version": "0.2.1",
@@ -982,7 +1370,10 @@
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-1.0.0.tgz",
       "integrity": "sha1-VAVy0096wxGfj3bDDLwbHgN6/74=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "builtin-modules": "1.1.1"
+      }
     },
     "is-dotfile": {
       "version": "1.0.3",
@@ -994,7 +1385,10 @@
       "version": "0.1.3",
       "resolved": "https://registry.npmjs.org/is-equal-shallow/-/is-equal-shallow-0.1.3.tgz",
       "integrity": "sha1-IjgJj8Ih3gvPpdnqxMRdY4qhxTQ=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "is-primitive": "2.0.0"
+      }
     },
     "is-extendable": {
       "version": "0.1.1",
@@ -1012,19 +1406,28 @@
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
       "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "number-is-nan": "1.0.1"
+      }
     },
     "is-glob": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz",
       "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "is-extglob": "1.0.0"
+      }
     },
     "is-number": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz",
       "integrity": "sha1-Afy7s5NGOlSPL0ZszhbezknbkI8=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "kind-of": "3.2.2"
+      }
     },
     "is-posix-bracket": {
       "version": "0.1.1",
@@ -1048,7 +1451,10 @@
       "version": "0.2.1",
       "resolved": "https://registry.npmjs.org/is-relative/-/is-relative-0.2.1.tgz",
       "integrity": "sha1-0n9MfVFtF1+2ENuEu+7yPDvJeqU=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "is-unc-path": "0.1.2"
+      }
     },
     "is-typedarray": {
       "version": "1.0.0",
@@ -1061,7 +1467,10 @@
       "version": "0.1.2",
       "resolved": "https://registry.npmjs.org/is-unc-path/-/is-unc-path-0.1.2.tgz",
       "integrity": "sha1-arBTpyVzwQJQ/0FqOBTDUXivObk=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "unc-path-regex": "0.1.2"
+      }
     },
     "is-utf8": {
       "version": "0.2.1",
@@ -1091,7 +1500,10 @@
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
       "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "isarray": "1.0.0"
+      }
     },
     "isstream": {
       "version": "0.1.2",
@@ -1117,7 +1529,10 @@
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/json-parse-helpfulerror/-/json-parse-helpfulerror-1.0.3.tgz",
       "integrity": "sha1-E/FM4C7tTpgSl7ZOueO5MuLdE9w=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "jju": "1.3.0"
+      }
     },
     "json-schema": {
       "version": "0.2.3",
@@ -1131,7 +1546,10 @@
       "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz",
       "integrity": "sha1-mnWdOcXy/1A/1TAGRu1EX4jE+a8=",
       "dev": true,
-      "optional": true
+      "optional": true,
+      "requires": {
+        "jsonify": "0.0.0"
+      }
     },
     "json-stringify-safe": {
       "version": "5.0.1",
@@ -1144,7 +1562,10 @@
       "version": "2.4.0",
       "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz",
       "integrity": "sha1-NzaitCi4e72gzIO1P6PWM6NcKug=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "graceful-fs": "4.1.11"
+      }
     },
     "jsonify": {
       "version": "0.0.0",
@@ -1159,6 +1580,12 @@
       "integrity": "sha1-o7h+QCmNjDgFUtjMdiigu5WiKRg=",
       "dev": true,
       "optional": true,
+      "requires": {
+        "assert-plus": "1.0.0",
+        "extsprintf": "1.0.2",
+        "json-schema": "0.2.3",
+        "verror": "1.3.6"
+      },
       "dependencies": {
         "assert-plus": {
           "version": "1.0.0",
@@ -1173,37 +1600,67 @@
       "version": "3.2.2",
       "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
       "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "is-buffer": "1.1.5"
+      }
     },
     "klaw": {
       "version": "1.3.1",
       "resolved": "https://registry.npmjs.org/klaw/-/klaw-1.3.1.tgz",
       "integrity": "sha1-QIhDO0azsbolnXh4XY6W9zugJDk=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "graceful-fs": "4.1.11"
+      }
     },
     "lcid": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/lcid/-/lcid-1.0.0.tgz",
       "integrity": "sha1-MIrMr6C8SDo4Z7S28rlQYlHRuDU=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "invert-kv": "1.0.0"
+      }
     },
     "liftoff": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/liftoff/-/liftoff-2.3.0.tgz",
       "integrity": "sha1-qY8v9nGD2Lp8+soQVIvX/wVQs4U=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "extend": "3.0.1",
+        "findup-sync": "0.4.3",
+        "fined": "1.0.2",
+        "flagged-respawn": "0.3.2",
+        "lodash.isplainobject": "4.0.6",
+        "lodash.isstring": "4.0.1",
+        "lodash.mapvalues": "4.6.0",
+        "rechoir": "0.6.2",
+        "resolve": "1.3.3"
+      }
     },
     "load-json-file": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
       "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
       "dev": true,
+      "requires": {
+        "graceful-fs": "4.1.11",
+        "parse-json": "2.2.0",
+        "pify": "2.3.0",
+        "pinkie-promise": "2.0.1",
+        "strip-bom": "2.0.0"
+      },
       "dependencies": {
         "strip-bom": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
           "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4=",
-          "dev": true
+          "dev": true,
+          "requires": {
+            "is-utf8": "0.2.1"
+          }
         }
       }
     },
@@ -1277,7 +1734,10 @@
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-3.2.0.tgz",
       "integrity": "sha1-mV7g3BjBtIzJLv+ucaEKq1tIdpg=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "lodash._root": "3.0.1"
+      }
     },
     "lodash.get": {
       "version": "4.4.2",
@@ -1319,7 +1779,12 @@
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz",
       "integrity": "sha1-TbwEcrFWvlCgsoaFXRvQsMZWCYo=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "lodash._getnative": "3.9.1",
+        "lodash.isarguments": "3.1.0",
+        "lodash.isarray": "3.0.4"
+      }
     },
     "lodash.mapvalues": {
       "version": "4.6.0",
@@ -1343,13 +1808,28 @@
       "version": "3.6.2",
       "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-3.6.2.tgz",
       "integrity": "sha1-+M3sxhaaJVvpCYrosMU9N4kx0U8=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "lodash._basecopy": "3.0.1",
+        "lodash._basetostring": "3.0.1",
+        "lodash._basevalues": "3.0.0",
+        "lodash._isiterateecall": "3.0.9",
+        "lodash._reinterpolate": "3.0.0",
+        "lodash.escape": "3.2.0",
+        "lodash.keys": "3.1.2",
+        "lodash.restparam": "3.6.1",
+        "lodash.templatesettings": "3.1.1"
+      }
     },
     "lodash.templatesettings": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-3.1.1.tgz",
       "integrity": "sha1-+zB4RHU7Zrnxr6VOJix0UwfbqOU=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "lodash._reinterpolate": "3.0.0",
+        "lodash.escape": "3.2.0"
+      }
     },
     "lru-cache": {
       "version": "2.7.3",
@@ -1367,7 +1847,22 @@
       "version": "2.3.11",
       "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
       "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "arr-diff": "2.0.0",
+        "array-unique": "0.2.1",
+        "braces": "1.8.5",
+        "expand-brackets": "0.1.5",
+        "extglob": "0.3.2",
+        "filename-regex": "2.0.1",
+        "is-extglob": "1.0.0",
+        "is-glob": "2.0.1",
+        "kind-of": "3.2.2",
+        "normalize-path": "2.1.1",
+        "object.omit": "2.0.1",
+        "parse-glob": "3.0.4",
+        "regex-cache": "0.4.3"
+      }
     },
     "mime": {
       "version": "1.3.6",
@@ -1385,13 +1880,19 @@
       "version": "2.1.15",
       "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.15.tgz",
       "integrity": "sha1-pOv1BkCUVpI3uM9wBGd20J/JKu0=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "mime-db": "1.27.0"
+      }
     },
     "minimatch": {
       "version": "3.0.4",
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
       "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "brace-expansion": "1.1.8"
+      }
     },
     "minimist": {
       "version": "1.2.0",
@@ -1404,6 +1905,9 @@
       "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
       "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
       "dev": true,
+      "requires": {
+        "minimist": "0.0.8"
+      },
       "dependencies": {
         "minimist": {
           "version": "0.0.8",
@@ -1423,7 +1927,10 @@
       "version": "0.1.2",
       "resolved": "https://registry.npmjs.org/multipipe/-/multipipe-0.1.2.tgz",
       "integrity": "sha1-Ko8t33Du1WTf8tV/HhoTfZ8FB4s=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "duplexer2": "0.0.2"
+      }
     },
     "mute-stream": {
       "version": "0.0.6",
@@ -1447,13 +1954,34 @@
       "version": "2.3.8",
       "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.3.8.tgz",
       "integrity": "sha1-2Bntoqne29H/pWPqQHHZNngilbs=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "hosted-git-info": "2.4.2",
+        "is-builtin-module": "1.0.0",
+        "semver": "5.3.0",
+        "validate-npm-package-license": "3.0.1"
+      }
     },
     "normalize-path": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-2.1.1.tgz",
       "integrity": "sha1-GrKLVW4Zg2Oowab35vogE3/mrtk=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "remove-trailing-separator": "1.0.2"
+      }
+    },
+    "npm-package-arg": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/npm-package-arg/-/npm-package-arg-5.1.2.tgz",
+      "integrity": "sha512-wJBsrf0qpypPT7A0LART18hCdyhpCMxeTtcb0X4IZO2jsP6Om7EHN1d9KSKiqD+KVH030RVNpWS9thk+pb7wzA==",
+      "dev": true,
+      "requires": {
+        "hosted-git-info": "2.4.2",
+        "osenv": "0.1.4",
+        "semver": "5.3.0",
+        "validate-npm-package-name": "3.0.0"
+      }
     },
     "number-is-nan": {
       "version": "1.0.1",
@@ -1478,13 +2006,20 @@
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/object.omit/-/object.omit-2.0.1.tgz",
       "integrity": "sha1-Gpx0SCnznbuFjHbKNXmuKlTr0fo=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "for-own": "0.1.5",
+        "is-extendable": "0.1.1"
+      }
     },
     "once": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
       "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "wrappy": "1.0.2"
+      }
     },
     "onetime": {
       "version": "1.1.0",
@@ -1496,7 +2031,12 @@
       "version": "0.3.8",
       "resolved": "https://registry.npmjs.org/orchestrator/-/orchestrator-0.3.8.tgz",
       "integrity": "sha1-FOfp4nZPcxX7rBhOUGx6pt+UrX4=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "end-of-stream": "0.1.5",
+        "sequencify": "0.0.7",
+        "stream-consume": "0.1.0"
+      }
     },
     "ordered-read-streams": {
       "version": "0.1.0",
@@ -1514,7 +2054,10 @@
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
       "integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "lcid": "1.0.0"
+      }
     },
     "os-shim": {
       "version": "0.1.3",
@@ -1528,23 +2071,47 @@
       "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ=",
       "dev": true
     },
+    "osenv": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.4.tgz",
+      "integrity": "sha1-Qv5tWVPfBsgGS+bxdsPQWqqjRkQ=",
+      "dev": true,
+      "requires": {
+        "os-homedir": "1.0.2",
+        "os-tmpdir": "1.0.2"
+      }
+    },
     "parse-filepath": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/parse-filepath/-/parse-filepath-1.0.1.tgz",
       "integrity": "sha1-FZ1hVdQ5BNFsEO9piRHaHpGWm3M=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "is-absolute": "0.2.6",
+        "map-cache": "0.2.2",
+        "path-root": "0.1.1"
+      }
     },
     "parse-glob": {
       "version": "3.0.4",
       "resolved": "https://registry.npmjs.org/parse-glob/-/parse-glob-3.0.4.tgz",
       "integrity": "sha1-ssN2z7EfNVE7rdFz7wu246OIORw=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "glob-base": "0.3.0",
+        "is-dotfile": "1.0.3",
+        "is-extglob": "1.0.0",
+        "is-glob": "2.0.1"
+      }
     },
     "parse-json": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz",
       "integrity": "sha1-9ID0BDTvgHQfhGkJn43qGPVaTck=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "error-ex": "1.3.1"
+      }
     },
     "parse-passwd": {
       "version": "1.0.0",
@@ -1556,7 +2123,10 @@
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
       "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "pinkie-promise": "2.0.1"
+      }
     },
     "path-is-absolute": {
       "version": "1.0.1",
@@ -1574,7 +2144,10 @@
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/path-root/-/path-root-0.1.1.tgz",
       "integrity": "sha1-mkpoFMrBwM1zNgqV8yCDyOpHRbc=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "path-root-regex": "0.1.2"
+      }
     },
     "path-root-regex": {
       "version": "0.1.2",
@@ -1586,7 +2159,12 @@
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
       "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "graceful-fs": "4.1.11",
+        "pify": "2.3.0",
+        "pinkie-promise": "2.0.1"
+      }
     },
     "performance-now": {
       "version": "0.2.0",
@@ -1611,7 +2189,10 @@
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz",
       "integrity": "sha1-ITXW36ejWMBprJsXh3YogihFD/o=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "pinkie": "2.0.4"
+      }
     },
     "preserve": {
       "version": "0.2.0",
@@ -1650,18 +2231,28 @@
       "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-1.1.7.tgz",
       "integrity": "sha512-D5JUjPyJbaJDkuAazpVnSfVkLlpeO3wDlPROTMLGKG1zMFNFRgrciKo1ltz/AzNTkqE0HzDx655QOL51N06how==",
       "dev": true,
+      "requires": {
+        "is-number": "3.0.0",
+        "kind-of": "4.0.0"
+      },
       "dependencies": {
         "is-number": {
           "version": "3.0.0",
           "resolved": "https://registry.npmjs.org/is-number/-/is-number-3.0.0.tgz",
           "integrity": "sha1-JP1iAaR4LPUFYcgQJ2r8fRLXEZU=",
           "dev": true,
+          "requires": {
+            "kind-of": "3.2.2"
+          },
           "dependencies": {
             "kind-of": {
               "version": "3.2.2",
               "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
               "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
-              "dev": true
+              "dev": true,
+              "requires": {
+                "is-buffer": "1.1.5"
+              }
             }
           }
         },
@@ -1669,7 +2260,10 @@
           "version": "4.0.0",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-4.0.0.tgz",
           "integrity": "sha1-IIE989cSkosgc3hpGkUGb65y3Vc=",
-          "dev": true
+          "dev": true,
+          "requires": {
+            "is-buffer": "1.1.5"
+          }
         }
       }
     },
@@ -1678,12 +2272,26 @@
       "resolved": "https://registry.npmjs.org/read-package-json/-/read-package-json-2.0.5.tgz",
       "integrity": "sha1-+Tpk5kFSnfaKCMZN5GOJ6KP4iEU=",
       "dev": true,
+      "requires": {
+        "glob": "7.1.2",
+        "graceful-fs": "4.1.11",
+        "json-parse-helpfulerror": "1.0.3",
+        "normalize-package-data": "2.3.8"
+      },
       "dependencies": {
         "glob": {
           "version": "7.1.2",
           "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
           "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ==",
-          "dev": true
+          "dev": true,
+          "requires": {
+            "fs.realpath": "1.0.0",
+            "inflight": "1.0.6",
+            "inherits": "2.0.3",
+            "minimatch": "3.0.4",
+            "once": "1.4.0",
+            "path-is-absolute": "1.0.1"
+          }
         }
       }
     },
@@ -1691,25 +2299,50 @@
       "version": "5.1.6",
       "resolved": "https://registry.npmjs.org/read-package-tree/-/read-package-tree-5.1.6.tgz",
       "integrity": "sha512-FCX1aT3GWyY658wzDICef4p+n0dB+ENRct8E/Qyvppj6xVpOYerBHfUu7OP5Rt1/393Tdglguf5ju5DEX4wZNg==",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "debuglog": "1.0.1",
+        "dezalgo": "1.0.3",
+        "once": "1.4.0",
+        "read-package-json": "2.0.5",
+        "readdir-scoped-modules": "1.0.2"
+      }
     },
     "read-pkg": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
       "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "load-json-file": "1.1.0",
+        "normalize-package-data": "2.3.8",
+        "path-type": "1.1.0"
+      }
     },
     "read-pkg-up": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
       "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "find-up": "1.1.2",
+        "read-pkg": "1.1.0"
+      }
     },
     "readable-stream": {
       "version": "2.2.11",
       "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
       "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q==",
       "dev": true,
+      "requires": {
+        "core-util-is": "1.0.2",
+        "inherits": "2.0.3",
+        "isarray": "1.0.0",
+        "process-nextick-args": "1.0.7",
+        "safe-buffer": "5.0.1",
+        "string_decoder": "1.0.2",
+        "util-deprecate": "1.0.2"
+      },
       "dependencies": {
         "safe-buffer": {
           "version": "5.0.1",
@@ -1723,19 +2356,32 @@
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/readdir-scoped-modules/-/readdir-scoped-modules-1.0.2.tgz",
       "integrity": "sha1-n6+jfShr5dksuuve4DDcm19AZ0c=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "debuglog": "1.0.1",
+        "dezalgo": "1.0.3",
+        "graceful-fs": "4.1.11",
+        "once": "1.4.0"
+      }
     },
     "rechoir": {
       "version": "0.6.2",
       "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz",
       "integrity": "sha1-hSBLVNuoLVdC4oyWdW70OvUOM4Q=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "resolve": "1.3.3"
+      }
     },
     "regex-cache": {
       "version": "0.4.3",
       "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.3.tgz",
       "integrity": "sha1-mxpsNdTQ3871cRrmUejp09cRQUU=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "is-equal-shallow": "0.1.3",
+        "is-primitive": "2.0.0"
+      }
     },
     "remove-trailing-separator": {
       "version": "1.0.2",
@@ -1766,7 +2412,31 @@
       "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz",
       "integrity": "sha1-xpKJRqDgbF+Nb4qTM0af/aRimKA=",
       "dev": true,
-      "optional": true
+      "optional": true,
+      "requires": {
+        "aws-sign2": "0.6.0",
+        "aws4": "1.6.0",
+        "caseless": "0.12.0",
+        "combined-stream": "1.0.5",
+        "extend": "3.0.1",
+        "forever-agent": "0.6.1",
+        "form-data": "2.1.4",
+        "har-validator": "4.2.1",
+        "hawk": "3.1.3",
+        "http-signature": "1.1.1",
+        "is-typedarray": "1.0.0",
+        "isstream": "0.1.2",
+        "json-stringify-safe": "5.0.1",
+        "mime-types": "2.1.15",
+        "oauth-sign": "0.8.2",
+        "performance-now": "0.2.0",
+        "qs": "6.4.0",
+        "safe-buffer": "5.1.0",
+        "stringstream": "0.0.5",
+        "tough-cookie": "2.3.2",
+        "tunnel-agent": "0.6.0",
+        "uuid": "3.0.1"
+      }
     },
     "require-directory": {
       "version": "2.1.1",
@@ -1784,31 +2454,48 @@
       "version": "1.3.3",
       "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.3.3.tgz",
       "integrity": "sha1-ZVkHw0aahoDcLeOidaj91paR8OU=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "path-parse": "1.0.5"
+      }
     },
     "resolve-dir": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/resolve-dir/-/resolve-dir-0.1.1.tgz",
       "integrity": "sha1-shklmlYC+sXFxJatiUpujMQwJh4=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "expand-tilde": "1.2.2",
+        "global-modules": "0.2.3"
+      }
     },
     "restore-cursor": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-1.0.1.tgz",
       "integrity": "sha1-NGYfRohjJ/7SmRR5FSJS35LapUE=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "exit-hook": "1.1.1",
+        "onetime": "1.1.0"
+      }
     },
     "rimraf": {
       "version": "2.5.4",
       "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
       "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "glob": "7.0.6"
+      }
     },
     "run-async": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/run-async/-/run-async-2.3.0.tgz",
       "integrity": "sha1-A3GrSuC91yDUFm19/aZP96RFpsA=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "is-promise": "2.1.0"
+      }
     },
     "rx": {
       "version": "4.1.0",
@@ -1851,7 +2538,10 @@
       "resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz",
       "integrity": "sha1-ZUEYTMkK7qbG57NeJlkIJEPGYZg=",
       "dev": true,
-      "optional": true
+      "optional": true,
+      "requires": {
+        "hoek": "2.16.3"
+      }
     },
     "sparkles": {
       "version": "1.0.0",
@@ -1863,13 +2553,20 @@
       "version": "1.0.15",
       "resolved": "https://registry.npmjs.org/spawn-sync/-/spawn-sync-1.0.15.tgz",
       "integrity": "sha1-sAeZVX63+wyDdsKdROih6mfldHY=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "concat-stream": "1.6.0",
+        "os-shim": "0.1.3"
+      }
     },
     "spdx-correct": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-1.0.2.tgz",
       "integrity": "sha1-SzBz2TP/UfORLwOsVRlJikFQ20A=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "spdx-license-ids": "1.2.2"
+      }
     },
     "spdx-expression-parse": {
       "version": "1.0.4",
@@ -1895,6 +2592,16 @@
       "integrity": "sha1-US322mKHFEMW3EwY/hzx2UBzm+M=",
       "dev": true,
       "optional": true,
+      "requires": {
+        "asn1": "0.2.3",
+        "assert-plus": "1.0.0",
+        "bcrypt-pbkdf": "1.0.1",
+        "dashdash": "1.14.1",
+        "ecc-jsbn": "0.1.1",
+        "getpass": "0.1.7",
+        "jsbn": "0.1.1",
+        "tweetnacl": "0.14.5"
+      },
       "dependencies": {
         "assert-plus": {
           "version": "1.0.0",
@@ -1916,6 +2623,9 @@
       "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
       "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
       "dev": true,
+      "requires": {
+        "safe-buffer": "5.0.1"
+      },
       "dependencies": {
         "safe-buffer": {
           "version": "5.0.1",
@@ -1929,7 +2639,12 @@
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
       "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "code-point-at": "1.1.0",
+        "is-fullwidth-code-point": "1.0.0",
+        "strip-ansi": "3.0.1"
+      }
     },
     "stringstream": {
       "version": "0.0.5",
@@ -1942,13 +2657,20 @@
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
       "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "ansi-regex": "2.1.1"
+      }
     },
     "strip-bom": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-1.0.0.tgz",
       "integrity": "sha1-hbiGLzhEtabV7IRnqTWYFzo295Q=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "first-chunk-stream": "1.0.0",
+        "is-utf8": "0.2.1"
+      }
     },
     "supports-color": {
       "version": "2.0.0",
@@ -1966,13 +2688,20 @@
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/through2/-/through2-2.0.3.tgz",
       "integrity": "sha1-AARWmzfHx0ujnEPzzteNGtlBQL4=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "readable-stream": "2.2.11",
+        "xtend": "4.0.1"
+      }
     },
     "tildify": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/tildify/-/tildify-1.2.0.tgz",
       "integrity": "sha1-3OwD9V3Km3qj5bBPIYF+tW5jWIo=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "os-homedir": "1.0.2"
+      }
     },
     "time-stamp": {
       "version": "1.1.0",
@@ -1984,21 +2713,30 @@
       "version": "0.0.29",
       "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.29.tgz",
       "integrity": "sha1-8lEl/w3Z2jzLDC3Tce4SiLuRKMA=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "os-tmpdir": "1.0.2"
+      }
     },
     "tough-cookie": {
       "version": "2.3.2",
       "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.2.tgz",
       "integrity": "sha1-8IH3bkyFcg5sN6X6ztc3FQ2EByo=",
       "dev": true,
-      "optional": true
+      "optional": true,
+      "requires": {
+        "punycode": "1.4.1"
+      }
     },
     "tunnel-agent": {
       "version": "0.6.0",
       "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.6.0.tgz",
       "integrity": "sha1-J6XeoGs2sEoKmWZ3SykIaPD8QP0=",
       "dev": true,
-      "optional": true
+      "optional": true,
+      "requires": {
+        "safe-buffer": "5.1.0"
+      }
     },
     "tweetnacl": {
       "version": "0.14.5",
@@ -2048,13 +2786,29 @@
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/v8flags/-/v8flags-2.1.1.tgz",
       "integrity": "sha1-qrGh+jDUX4jdMhFIh1rALAtV5bQ=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "user-home": "1.1.1"
+      }
     },
     "validate-npm-package-license": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.1.tgz",
       "integrity": "sha1-KAS6vnEq0zeUWaz74kdGqywwP7w=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "spdx-correct": "1.0.2",
+        "spdx-expression-parse": "1.0.4"
+      }
+    },
+    "validate-npm-package-name": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/validate-npm-package-name/-/validate-npm-package-name-3.0.0.tgz",
+      "integrity": "sha1-X6kS2B630MdK/BQN5zF/DKffQ34=",
+      "dev": true,
+      "requires": {
+        "builtins": "1.0.3"
+      }
     },
     "validator": {
       "version": "5.7.0",
@@ -2067,19 +2821,37 @@
       "resolved": "https://registry.npmjs.org/verror/-/verror-1.3.6.tgz",
       "integrity": "sha1-z/XfEpRtKX0rqu+qJoniW+AcAFw=",
       "dev": true,
-      "optional": true
+      "optional": true,
+      "requires": {
+        "extsprintf": "1.0.2"
+      }
     },
     "vinyl": {
       "version": "0.5.3",
       "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.5.3.tgz",
       "integrity": "sha1-sEVbOPxeDPMNQyUTLkYZcMIJHN4=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "clone": "1.0.2",
+        "clone-stats": "0.0.1",
+        "replace-ext": "0.0.1"
+      }
     },
     "vinyl-fs": {
       "version": "0.3.14",
       "resolved": "https://registry.npmjs.org/vinyl-fs/-/vinyl-fs-0.3.14.tgz",
       "integrity": "sha1-mmhRzhysHBzqX+hsCTHWIMLPqeY=",
       "dev": true,
+      "requires": {
+        "defaults": "1.0.3",
+        "glob-stream": "3.1.18",
+        "glob-watcher": "0.0.6",
+        "graceful-fs": "3.0.11",
+        "mkdirp": "0.5.1",
+        "strip-bom": "1.0.0",
+        "through2": "0.6.5",
+        "vinyl": "0.4.6"
+      },
       "dependencies": {
         "clone": {
           "version": "0.2.0",
@@ -2091,7 +2863,10 @@
           "version": "3.0.11",
           "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-3.0.11.tgz",
           "integrity": "sha1-dhPHeKGv6mLyXGMKCG1/Osu92Bg=",
-          "dev": true
+          "dev": true,
+          "requires": {
+            "natives": "1.1.0"
+          }
         },
         "isarray": {
           "version": "0.0.1",
@@ -2103,7 +2878,13 @@
           "version": "1.0.34",
           "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
           "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=",
-          "dev": true
+          "dev": true,
+          "requires": {
+            "core-util-is": "1.0.2",
+            "inherits": "2.0.3",
+            "isarray": "0.0.1",
+            "string_decoder": "0.10.31"
+          }
         },
         "string_decoder": {
           "version": "0.10.31",
@@ -2115,13 +2896,21 @@
           "version": "0.6.5",
           "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
           "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg=",
-          "dev": true
+          "dev": true,
+          "requires": {
+            "readable-stream": "1.0.34",
+            "xtend": "4.0.1"
+          }
         },
         "vinyl": {
           "version": "0.4.6",
           "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.4.6.tgz",
           "integrity": "sha1-LzVsh6VQolVGHza76ypbqL94SEc=",
-          "dev": true
+          "dev": true,
+          "requires": {
+            "clone": "0.2.0",
+            "clone-stats": "0.0.1"
+          }
         }
       }
     },
@@ -2129,7 +2918,10 @@
       "version": "1.2.14",
       "resolved": "https://registry.npmjs.org/which/-/which-1.2.14.tgz",
       "integrity": "sha1-mofEN48D6CfOyvGs31bHNsAcFOU=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "isexe": "2.0.0"
+      }
     },
     "which-module": {
       "version": "1.0.0",
@@ -2147,7 +2939,11 @@
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
       "integrity": "sha1-2Pw9KE3QV5T+hJc8rs3Rz4JP3YU=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "string-width": "1.0.2",
+        "strip-ansi": "3.0.1"
+      }
     },
     "wrappy": {
       "version": "1.0.2",
@@ -2171,19 +2967,43 @@
       "version": "6.6.0",
       "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz",
       "integrity": "sha1-eC7CHvQDNF+DCoCMo9UTr1YGUgg=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "camelcase": "3.0.0",
+        "cliui": "3.2.0",
+        "decamelize": "1.2.0",
+        "get-caller-file": "1.0.2",
+        "os-locale": "1.4.0",
+        "read-pkg-up": "1.0.1",
+        "require-directory": "2.1.1",
+        "require-main-filename": "1.0.1",
+        "set-blocking": "2.0.0",
+        "string-width": "1.0.2",
+        "which-module": "1.0.0",
+        "y18n": "3.2.1",
+        "yargs-parser": "4.2.1"
+      }
     },
     "yargs-parser": {
       "version": "4.2.1",
       "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz",
       "integrity": "sha1-KczqwNxPA8bIe0qfIX3RjJ90hxw=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "camelcase": "3.0.0"
+      }
     },
     "z-schema": {
       "version": "3.17.0",
       "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-3.17.0.tgz",
       "integrity": "sha1-RCs4+denr3rke/z8NWhz6GFq0bc=",
-      "dev": true
+      "dev": true,
+      "requires": {
+        "commander": "2.9.0",
+        "lodash.get": "4.4.2",
+        "request": "2.81.0",
+        "validator": "5.7.0"
+      }
     }
   }
 }
diff --git a/package.json b/package.json
index f8a2a7fdd8306..49425f49f0447 100644
--- a/package.json
+++ b/package.json
@@ -23,7 +23,7 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@microsoft/rush": "3.0.11",
+    "@microsoft/rush": "3.0.12",
     "github": "^7.0.0",
     "gulp": "^3.9.1",
     "yargs": "^6.5.0"

From d57ca247d7333fa86473482e2037e1a5aca2c2f2 Mon Sep 17 00:00:00 2001
From: Ricky Patel <rickyp@microsoft.com>
Date: Tue, 8 Aug 2017 15:44:00 -0700
Subject: [PATCH 0383/1641] Change dropdown's role from "combobox" to "menu"
 (#2405)

* Change combobox to menu as the dropdown is not editable but the screen reader keeps saying it is

* Ran npm run change

* Added rush file

* Update rickyp-2335_2017-08-05-00-16.json
---
 .../rickyp-2335_2017-08-05-00-16.json                 |  1 +
 .../rickyp-2335_2017-08-07-19-14.json                 | 11 +++++++++++
 .../src/components/Dropdown/Dropdown.tsx              |  2 +-
 3 files changed, 13 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/rickyp-2335_2017-08-05-00-16.json
 create mode 100644 common/changes/office-ui-fabric-react/rickyp-2335_2017-08-07-19-14.json

diff --git a/common/changes/office-ui-fabric-react/rickyp-2335_2017-08-05-00-16.json b/common/changes/office-ui-fabric-react/rickyp-2335_2017-08-05-00-16.json
new file mode 100644
index 0000000000000..8b137891791fe
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/rickyp-2335_2017-08-05-00-16.json
@@ -0,0 +1 @@
+
diff --git a/common/changes/office-ui-fabric-react/rickyp-2335_2017-08-07-19-14.json b/common/changes/office-ui-fabric-react/rickyp-2335_2017-08-07-19-14.json
new file mode 100644
index 0000000000000..e9bee94daf5d9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/rickyp-2335_2017-08-07-19-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Change dropdown's role from \"combobox\" to \"menu\" ",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "rickyp@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 993eab3b43589..3ba01ae24e9fa 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -154,7 +154,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
           id={ id }
           tabIndex={ disabled ? -1 : 0 }
           aria-expanded={ isOpen ? 'true' : 'false' }
-          role='combobox'
+          role='menu'
           aria-live={ disabled || isOpen ? 'off' : 'assertive' }
           aria-label={ ariaLabel || label }
           aria-describedby={ id + '-option' }

From 1dd7376fecc68f3fb995d2279d871433967f7f16 Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Tue, 8 Aug 2017 16:13:47 -0700
Subject: [PATCH 0384/1641] Selection: Fixing unfunctional example (#2429)

* Fixing broken selection example

* rush change
---
 .../v-krbrow-selection-examples_2017-08-08-22-34.json | 11 +++++++++++
 .../selection/examples/Selection.Basic.Example.tsx    |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-selection-examples_2017-08-08-22-34.json

diff --git a/common/changes/office-ui-fabric-react/v-krbrow-selection-examples_2017-08-08-22-34.json b/common/changes/office-ui-fabric-react/v-krbrow-selection-examples_2017-08-08-22-34.json
new file mode 100644
index 0000000000000..f4122a0971661
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-selection-examples_2017-08-08-22-34.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Selection: Fix broken selection state in example.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx b/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
index 5e4025c47808d..4bb3016b996fe 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
@@ -38,8 +38,8 @@ export class SelectionItemExample extends React.Component<ISelectionItemExampleP
     let { item, itemIndex, selection, selectionMode } = this.props;
     let isSelected = false;
 
-    if (selection && itemIndex) {
-      selection.isIndexSelected(itemIndex);
+    if (selection && itemIndex !== undefined) {
+      isSelected = selection.isIndexSelected(itemIndex);
     }
 
     return (

From 850350776afe17bb20cfb16f7d1b2ab59e7058b3 Mon Sep 17 00:00:00 2001
From: Ricky Patel <rickyp@microsoft.com>
Date: Tue, 8 Aug 2017 17:36:39 -0700
Subject: [PATCH 0385/1641] Changed DatePicker role to be more accurate for
 screen readers  (#2414)

* Changed DatePicker role to be more accurate for screen readers

* Ran npm change

* Changed double quotes to single
---
 .../rickyp-2403_2_2017-08-08-01-31.json               | 11 +++++++++++
 .../src/components/DatePicker/DatePicker.tsx          |  4 +++-
 2 files changed, 14 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/rickyp-2403_2_2017-08-08-01-31.json

diff --git a/common/changes/office-ui-fabric-react/rickyp-2403_2_2017-08-08-01-31.json b/common/changes/office-ui-fabric-react/rickyp-2403_2_2017-08-08-01-31.json
new file mode 100644
index 0000000000000..405be77b2c82e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/rickyp-2403_2_2017-08-08-01-31.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Changed DatePicker role to be more accurate for screen readers",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "rickyp@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index a7b11b6cb578f..d0c98f442d5ec 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -205,7 +205,9 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
             } }
             readOnly={ !allowTextInput }
             value={ formattedDate }
-            ref='textField' />
+            ref='textField'
+            role={ allowTextInput ? 'combobox' : 'menu' }
+          />
         </div>
         { isDatePickerShown && (
           <Callout

From 38128798ac4d27ec6eae5036932742de15c56e21 Mon Sep 17 00:00:00 2001
From: Elizabeth Craig <ecraig12345@gmail.com>
Date: Wed, 9 Aug 2017 00:59:01 -0700
Subject: [PATCH 0386/1641] Nav: Add more options for nav link groups (#2423)

Added the following options:
- Nav link groups
  - Flag to render collapsed by default
  - Click handler for group header
- Nav links
  - Flag to force rendering as an anchor (not a button) even if a click handler is provided

Also includes a small security fix: use `rel=noopener` for links that will open in a target window so that the original window's location can't be hijacked.
---
 .../elcraig-nav_2017-08-08-19-47.json         | 11 ++++
 .../src/components/Nav/Nav.Props.ts           | 20 ++++++-
 .../src/components/Nav/Nav.tsx                | 54 +++++++++++++------
 3 files changed, 69 insertions(+), 16 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/elcraig-nav_2017-08-08-19-47.json

diff --git a/common/changes/office-ui-fabric-react/elcraig-nav_2017-08-08-19-47.json b/common/changes/office-ui-fabric-react/elcraig-nav_2017-08-08-19-47.json
new file mode 100644
index 0000000000000..d79b8ae0ba019
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/elcraig-nav_2017-08-08-19-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Nav: Add more options for nav link groups",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "elcraig@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.Props.ts b/packages/office-ui-fabric-react/src/components/Nav/Nav.Props.ts
index ec1a7656f27b3..60c133cb53653 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.Props.ts
@@ -91,6 +91,16 @@ export interface INavLinkGroup {
    * The name to use for functional automation tests
    */
   automationId?: string;
+
+  /**
+   * If true, the group should render collapsed by default
+   */
+  collapseByDefault?: boolean;
+
+  /**
+   * Callback invoked when a group header is clicked
+   */
+  onHeaderClick?: (ev?: React.MouseEvent<HTMLElement>, isCollapsing?: boolean) => void;
 }
 
 export interface INavLink {
@@ -115,7 +125,8 @@ export interface INavLink {
   links?: INavLink[];
 
   /**
-   * Function callback invoked when a link in the navigation is clicked
+   * Callback invoked when this link is clicked. Providing this callback will cause the link
+   * to render as a button (rather than an anchor) unless forceAnchor is set to true.
    */
   onClick?: (ev?: React.MouseEvent<HTMLElement>, item?: INavLink) => void;
 
@@ -172,6 +183,13 @@ export interface INavLink {
    */
   parentId?: string;
 
+  /**
+   * (Optional) By default, any link with onClick defined will render as a button.
+   * Set this property to true to override that behavior. (Links without onClick defined
+   * will render as anchors by default.)
+   */
+  forceAnchor?: boolean;
+
   /**
    * (Optional) Any additional properties to apply to the rendered links.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
index 5bea6c99fad48..193f775bac084 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
@@ -1,5 +1,6 @@
 import * as React from 'react';
 import {
+  autobind,
   BaseComponent,
   css,
   getRTL
@@ -27,6 +28,11 @@ const _indentNoExpandButton: number = 20;
 // global var used in _isLinkSelectedKey
 let _urlResolver: HTMLAnchorElement | undefined;
 
+export function isRelativeUrl(url: string): boolean {
+  // A URL is relative if it has no protocol.
+  return !!url && !/^[a-z0-9+-.]:\/\//i.test(url);
+}
+
 export interface INavState {
   isGroupCollapsed?: { [key: string]: boolean };
   isLinkExpandStateChanged?: boolean;
@@ -50,6 +56,13 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
       isLinkExpandStateChanged: false,
       selectedKey: props.initialSelectedKey || props.selectedKey,
     };
+    if (props.groups) {
+      for (let group of props.groups) {
+        if (group.collapseByDefault && group.name) {
+          this.state.isGroupCollapsed![group.name] = true;
+        }
+      }
+    }
     this._hasExpandButton = false;
   }
 
@@ -60,16 +73,15 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
       return null;
     }
 
-    // when this.props.groups[x].name is specified or Any of the link has child link, chevorn Expand/collaps button is shown,
-    // different padding is needed. _hasExpandButton marks this condition.
-    this._hasExpandButton = groups.some((group: INavLinkGroup, groupIndex: number) => {
-      return !!group && !!group.name || group.links && group.links.some((link: INavLink, linkIndex: number) => {
-        return !!link && !!link.links && link.links.length > 0;
-      });
+    // When groups[x].name is specified or any of the links have children, the expand/collapse
+    // chevron button is shown and different padding is needed. _hasExpandButton marks this condition.
+    this._hasExpandButton = groups.some((group: INavLinkGroup) => {
+      return group ? !!group.name || (group.links && group.links.some((link: INavLink) => {
+        return !!(link && link.links && link.links.length);
+      })) : false;
     });
 
-    const groupElements: React.ReactElement<{}>[] = groups.map(
-      (group: INavLinkGroup, groupIndex: number) => this._renderGroup(group, groupIndex));
+    const groupElements: React.ReactElement<{}>[] = groups.map(this._renderGroup);
 
     return (
       <FocusZone direction={ FocusZoneDirection.vertical }>
@@ -94,8 +106,10 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
     // Determine the appropriate padding to add before this link.
     // In RTL, the "before" padding will go on the right instead of the left.
     const isRtl: boolean = getRTL();
-    const paddingBefore: string = (_indentationSize * nestingLevel +
-      (this._hasExpandButton ? _indentWithExpandButton : _indentNoExpandButton)).toString(10) + 'px';
+    const paddingBefore: string = (_indentationSize * nestingLevel) +
+      String(this._hasExpandButton ? _indentWithExpandButton : _indentNoExpandButton) + 'px';
+    // Prevent hijacking of the parent window if link.target is defined
+    const rel = link.url && link.target && !isRelativeUrl(link.url) ? 'noopener noreferrer' : undefined;
 
     return (
       <a
@@ -106,6 +120,7 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
         aria-label={ link.ariaLabel }
         title={ link.title || link.name }
         target={ link.target }
+        rel={ rel }
       >
         { link.iconClassName && (
           <Icon
@@ -160,7 +175,9 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
             />
           </button> : null
         ) }
-        { !!link.onClick ? this._renderButtonLink(link, linkIndex) : this._renderAnchorLink(link, linkIndex, nestingLevel) }
+        { link.onClick && !link.forceAnchor
+          ? this._renderButtonLink(link, linkIndex)
+          : this._renderAnchorLink(link, linkIndex, nestingLevel) }
       </div>
     );
   }
@@ -188,8 +205,9 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
     );
   }
 
+  @autobind
   private _renderGroup(group: INavLinkGroup, groupIndex: number): React.ReactElement<{}> {
-    const isGroupExpanded: boolean = !this.state.isGroupCollapsed![group.name as string];
+    const isGroupExpanded: boolean = !this.state.isGroupCollapsed![group.name!];
 
     return (
       <div key={ groupIndex } className={ css('ms-Nav-group', styles.group, {
@@ -199,7 +217,7 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
         { (group.name ?
           <button
             className={ css('ms-Nav-chevronButton ms-Nav-chevronButton--group ms-Nav-groupHeaderFontSize', styles.chevronButton, styles.chevronButtonIsGroup, styles.groupHeaderFontSize) }
-            onClick={ this._onGroupHeaderClicked.bind(this, group.name) }
+            onClick={ this._onGroupHeaderClicked.bind(this, group) }
           >
             <Icon
               className={ css(
@@ -219,10 +237,16 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
     );
   }
 
-  private _onGroupHeaderClicked(groupKey: string, ev: React.MouseEvent<HTMLElement>): void {
+  private _onGroupHeaderClicked(group: INavLinkGroup, ev: React.MouseEvent<HTMLElement>): void {
     let { isGroupCollapsed } = this.state;
+    let groupKey = group.name!;
+    let isCollapsed = !isGroupCollapsed![groupKey];
+
+    if (group.onHeaderClick) {
+      group.onHeaderClick(ev, isCollapsed);
+    }
 
-    isGroupCollapsed![groupKey] = !isGroupCollapsed![groupKey];
+    isGroupCollapsed![groupKey] = isCollapsed;
     this.setState({ isGroupCollapsed: isGroupCollapsed });
 
     ev.preventDefault();

From 16b6cf3cc48ef357b28af2e5abc3717f21044812 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Wed, 9 Aug 2017 07:44:01 -0700
Subject: [PATCH 0387/1641] comboBox example fix (#2440)

* Update the ComboBox Example to check for undefined instead of null

* Add change file
---
 .../jspurlin-ComboBoxExampleFix_2017-08-09-12-53.json | 11 +++++++++++
 .../ComboBox/examples/ComboBox.Basic.Example.tsx      |  6 +++---
 2 files changed, 14 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxExampleFix_2017-08-09-12-53.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxExampleFix_2017-08-09-12-53.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxExampleFix_2017-08-09-12-53.json
new file mode 100644
index 0000000000000..0193ef93c9d46
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxExampleFix_2017-08-09-12-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Update example to work correctly now that StrictNullChecks have been put in place",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
index 53b8e97bb4bbc..34d47827600eb 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
@@ -213,17 +213,17 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
 
   @autobind
   private _onChanged(option: IComboBoxOption, index: number, value: string) {
-    if (option !== null) {
+    if (option !== undefined) {
       this.setState({
         selectedOptionKey: option.key,
         value: null
       });
-    } else if (index !== null && index >= 0 && index < this.state.options.length) {
+    } else if (index !== undefined && index >= 0 && index < this.state.options.length) {
       this.setState({
         selectedOptionKey: this.state.options[index].key,
         value: null
       });
-    } else if (value !== null) {
+    } else if (value !== undefined) {
       let newOption: IComboBoxOption = { key: value, text: value };
 
       this.setState({

From d2c36f8a6ea1295ad5f6c7db7ee0e21439d4b35f Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 9 Aug 2017 10:16:33 -0700
Subject: [PATCH 0388/1641] Removing package-lock.

---
 package-lock.json | 3009 ---------------------------------------------
 1 file changed, 3009 deletions(-)
 delete mode 100644 package-lock.json

diff --git a/package-lock.json b/package-lock.json
deleted file mode 100644
index e9f580f183c8d..0000000000000
--- a/package-lock.json
+++ /dev/null
@@ -1,3009 +0,0 @@
-{
-  "name": "office-ui-fabric-react-repo",
-  "version": "1.0.0",
-  "lockfileVersion": 1,
-  "requires": true,
-  "dependencies": {
-    "@microsoft/package-deps-hash": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/@microsoft/package-deps-hash/-/package-deps-hash-2.0.2.tgz",
-      "integrity": "sha1-e17NHr2RS2YIvwBUdKnQZ81MmUg=",
-      "dev": true
-    },
-    "@microsoft/rush": {
-      "version": "3.0.12",
-      "resolved": "https://registry.npmjs.org/@microsoft/rush/-/rush-3.0.12.tgz",
-      "integrity": "sha1-oLbMMxg7Bp+mY8gSwjK6EUGR440=",
-      "dev": true,
-      "requires": {
-        "@microsoft/package-deps-hash": "2.0.2",
-        "@microsoft/rush-lib": "3.0.12",
-        "@microsoft/stream-collator": "2.0.1",
-        "@microsoft/ts-command-line": "2.0.1",
-        "builtins": "1.0.3",
-        "colors": "1.1.2",
-        "fs-extra": "0.26.7",
-        "glob": "7.0.6",
-        "glob-escape": "0.0.2",
-        "inquirer": "1.2.3",
-        "lodash": "4.15.0",
-        "minimatch": "3.0.4",
-        "npm-package-arg": "5.1.2",
-        "read-package-tree": "5.1.6",
-        "semver": "5.3.0",
-        "wordwrap": "1.0.0"
-      }
-    },
-    "@microsoft/rush-lib": {
-      "version": "3.0.12",
-      "resolved": "https://registry.npmjs.org/@microsoft/rush-lib/-/rush-lib-3.0.12.tgz",
-      "integrity": "sha1-EQYu0qO0nvRUaJPuQPWmctNBgIM=",
-      "dev": true,
-      "requires": {
-        "@microsoft/stream-collator": "2.0.1",
-        "@types/es6-collections": "0.5.29",
-        "@types/fs-extra": "0.0.37",
-        "@types/node": "6.0.62",
-        "@types/z-schema": "3.16.31",
-        "fs-extra": "0.26.7",
-        "git-repo-info": "1.1.4",
-        "jju": "1.3.0",
-        "lodash": "4.15.0",
-        "rimraf": "2.5.4",
-        "semver": "5.3.0",
-        "z-schema": "3.17.0"
-      }
-    },
-    "@microsoft/stream-collator": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/@microsoft/stream-collator/-/stream-collator-2.0.1.tgz",
-      "integrity": "sha1-HGf86/kwM8KdIAwKkPOPQr/mBeY=",
-      "dev": true,
-      "requires": {
-        "@types/node": "6.0.64",
-        "colors": "1.1.2"
-      },
-      "dependencies": {
-        "@types/node": {
-          "version": "6.0.64",
-          "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.64.tgz",
-          "integrity": "sha1-zckBQR9jAeFDff7SO8aPVEQuTcg=",
-          "dev": true
-        }
-      }
-    },
-    "@microsoft/ts-command-line": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/@microsoft/ts-command-line/-/ts-command-line-2.0.1.tgz",
-      "integrity": "sha1-v1nDvt0A4eg/mM8xYki6+eYTEo4=",
-      "dev": true,
-      "requires": {
-        "@types/node": "6.0.64",
-        "argparse": "1.0.9",
-        "colors": "1.1.2"
-      },
-      "dependencies": {
-        "@types/node": {
-          "version": "6.0.64",
-          "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.64.tgz",
-          "integrity": "sha1-zckBQR9jAeFDff7SO8aPVEQuTcg=",
-          "dev": true
-        }
-      }
-    },
-    "@types/es6-collections": {
-      "version": "0.5.29",
-      "resolved": "https://registry.npmjs.org/@types/es6-collections/-/es6-collections-0.5.29.tgz",
-      "integrity": "sha1-7CKDH36N5zY3vxVmD52MomlGmA0=",
-      "dev": true
-    },
-    "@types/fs-extra": {
-      "version": "0.0.37",
-      "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.37.tgz",
-      "integrity": "sha1-GV8RvNmhuX2eQSxrZombVFRxofc=",
-      "dev": true,
-      "requires": {
-        "@types/node": "6.0.62"
-      }
-    },
-    "@types/node": {
-      "version": "6.0.62",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.62.tgz",
-      "integrity": "sha1-hSIsB3tU8ltXQXu3CLn4d72jf4k=",
-      "dev": true
-    },
-    "@types/z-schema": {
-      "version": "3.16.31",
-      "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.31.tgz",
-      "integrity": "sha1-LrHQCl5Ow/pYx2r94S4YK2bcXBw=",
-      "dev": true
-    },
-    "agent-base": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-2.1.1.tgz",
-      "integrity": "sha1-1t4Q1a9hMtW9aSQn1G/FOFOQlMc=",
-      "dev": true,
-      "requires": {
-        "extend": "3.0.1",
-        "semver": "5.0.3"
-      },
-      "dependencies": {
-        "semver": {
-          "version": "5.0.3",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.0.3.tgz",
-          "integrity": "sha1-d0Zt5YnNXTyV8TiqeLxWmjy10no=",
-          "dev": true
-        }
-      }
-    },
-    "ajv": {
-      "version": "4.11.8",
-      "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz",
-      "integrity": "sha1-gv+wKynmYq5TvcIK8VlHcGc5xTY=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "co": "4.6.0",
-        "json-stable-stringify": "1.0.1"
-      }
-    },
-    "ansi-escapes": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz",
-      "integrity": "sha1-06ioOzGapneTZisT52HHkRQiMG4=",
-      "dev": true
-    },
-    "ansi-regex": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
-      "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
-      "dev": true
-    },
-    "ansi-styles": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-      "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=",
-      "dev": true
-    },
-    "archy": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/archy/-/archy-1.0.0.tgz",
-      "integrity": "sha1-+cjBN1fMHde8N5rHeyxipcKGjEA=",
-      "dev": true
-    },
-    "argparse": {
-      "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.9.tgz",
-      "integrity": "sha1-c9g7wmP4bpf4zE9rrhsOkKfSLIY=",
-      "dev": true,
-      "requires": {
-        "sprintf-js": "1.0.3"
-      }
-    },
-    "arr-diff": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
-      "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8=",
-      "dev": true,
-      "requires": {
-        "arr-flatten": "1.0.3"
-      }
-    },
-    "arr-flatten": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.0.3.tgz",
-      "integrity": "sha1-onTthawIhJtr14R8RYB0XcUa37E=",
-      "dev": true
-    },
-    "array-differ": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/array-differ/-/array-differ-1.0.0.tgz",
-      "integrity": "sha1-7/UuN1gknTO+QCuLuOVkuytdQDE=",
-      "dev": true
-    },
-    "array-uniq": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz",
-      "integrity": "sha1-r2rId6Jcx/dOBYiUdThY39sk/bY=",
-      "dev": true
-    },
-    "array-unique": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
-      "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM=",
-      "dev": true
-    },
-    "asap": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.5.tgz",
-      "integrity": "sha1-UidltQw1EEkOUtfc/ghe+bqWlY8=",
-      "dev": true
-    },
-    "asn1": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.3.tgz",
-      "integrity": "sha1-2sh4dxPJlmhJ/IGAd36+nB3fO4Y=",
-      "dev": true,
-      "optional": true
-    },
-    "assert-plus": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-0.2.0.tgz",
-      "integrity": "sha1-104bh+ev/A24qttwIfP+SBAasjQ=",
-      "dev": true,
-      "optional": true
-    },
-    "asynckit": {
-      "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
-      "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k=",
-      "dev": true,
-      "optional": true
-    },
-    "aws-sign2": {
-      "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz",
-      "integrity": "sha1-FDQt0428yU0OW4fXY81jYSwOeU8=",
-      "dev": true,
-      "optional": true
-    },
-    "aws4": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.6.0.tgz",
-      "integrity": "sha1-g+9cqGCysy5KDe7e6MdxudtXRx4=",
-      "dev": true,
-      "optional": true
-    },
-    "balanced-match": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
-      "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c=",
-      "dev": true
-    },
-    "bcrypt-pbkdf": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/bcrypt-pbkdf/-/bcrypt-pbkdf-1.0.1.tgz",
-      "integrity": "sha1-Y7xdy2EzG5K8Bf1SiVPDNGKgb40=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "tweetnacl": "0.14.5"
-      }
-    },
-    "beeper": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/beeper/-/beeper-1.1.1.tgz",
-      "integrity": "sha1-5tXqjF2tABMEpwsiY4RH9pyy+Ak=",
-      "dev": true
-    },
-    "boom": {
-      "version": "2.10.1",
-      "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
-      "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8=",
-      "dev": true,
-      "requires": {
-        "hoek": "2.16.3"
-      }
-    },
-    "brace-expansion": {
-      "version": "1.1.8",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.8.tgz",
-      "integrity": "sha1-wHshHHyVLsH479Uad+8NHTmQopI=",
-      "dev": true,
-      "requires": {
-        "balanced-match": "1.0.0",
-        "concat-map": "0.0.1"
-      }
-    },
-    "braces": {
-      "version": "1.8.5",
-      "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
-      "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc=",
-      "dev": true,
-      "requires": {
-        "expand-range": "1.8.2",
-        "preserve": "0.2.0",
-        "repeat-element": "1.1.2"
-      }
-    },
-    "builtin-modules": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz",
-      "integrity": "sha1-Jw8HbFpywC9bZaR9+Uxf46J4iS8=",
-      "dev": true
-    },
-    "builtins": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/builtins/-/builtins-1.0.3.tgz",
-      "integrity": "sha1-y5T662HIaWRR2zZTThQi+U8K7og=",
-      "dev": true
-    },
-    "camelcase": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
-      "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo=",
-      "dev": true
-    },
-    "caseless": {
-      "version": "0.12.0",
-      "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz",
-      "integrity": "sha1-G2gcIf+EAzyCZUMJBolCDRhxUdw=",
-      "dev": true,
-      "optional": true
-    },
-    "chalk": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-      "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
-      "dev": true,
-      "requires": {
-        "ansi-styles": "2.2.1",
-        "escape-string-regexp": "1.0.5",
-        "has-ansi": "2.0.0",
-        "strip-ansi": "3.0.1",
-        "supports-color": "2.0.0"
-      }
-    },
-    "cli-cursor": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-1.0.2.tgz",
-      "integrity": "sha1-ZNo/fValRBLll5S9Ytw1KV6PKYc=",
-      "dev": true,
-      "requires": {
-        "restore-cursor": "1.0.1"
-      }
-    },
-    "cli-width": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-2.1.0.tgz",
-      "integrity": "sha1-sjTKIJsp72b8UY2bmNWEewDt8Ao=",
-      "dev": true
-    },
-    "cliui": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
-      "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0=",
-      "dev": true,
-      "requires": {
-        "string-width": "1.0.2",
-        "strip-ansi": "3.0.1",
-        "wrap-ansi": "2.1.0"
-      }
-    },
-    "clone": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.2.tgz",
-      "integrity": "sha1-Jgt6meux7f4kdTgXX3gyQ8sZ0Uk=",
-      "dev": true
-    },
-    "clone-stats": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-0.0.1.tgz",
-      "integrity": "sha1-uI+UqCzzi4eR1YBG6kAprYjKmdE=",
-      "dev": true
-    },
-    "co": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
-      "integrity": "sha1-bqa989hTrlTMuOR7+gvz+QMfsYQ=",
-      "dev": true,
-      "optional": true
-    },
-    "code-point-at": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz",
-      "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c=",
-      "dev": true
-    },
-    "colors": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/colors/-/colors-1.1.2.tgz",
-      "integrity": "sha1-FopHAXVran9RoSzgyXv6KMCE7WM=",
-      "dev": true
-    },
-    "combined-stream": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz",
-      "integrity": "sha1-k4NwpXtKUd6ix3wV1cX9+JUWQAk=",
-      "dev": true,
-      "requires": {
-        "delayed-stream": "1.0.0"
-      }
-    },
-    "commander": {
-      "version": "2.9.0",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
-      "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "graceful-readlink": "1.0.1"
-      }
-    },
-    "concat-map": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
-      "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=",
-      "dev": true
-    },
-    "concat-stream": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.0.tgz",
-      "integrity": "sha1-CqxmL9Ur54lk1VMvaUeE5wEQrPc=",
-      "dev": true,
-      "requires": {
-        "inherits": "2.0.3",
-        "readable-stream": "2.2.11",
-        "typedarray": "0.0.6"
-      }
-    },
-    "core-util-is": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
-      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=",
-      "dev": true
-    },
-    "cryptiles": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz",
-      "integrity": "sha1-O9/s3GCBR8HGcgL6KR59ylnqo7g=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "boom": "2.10.1"
-      }
-    },
-    "dashdash": {
-      "version": "1.14.1",
-      "resolved": "https://registry.npmjs.org/dashdash/-/dashdash-1.14.1.tgz",
-      "integrity": "sha1-hTz6D3y+L+1d4gMmuN1YEDX24vA=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "assert-plus": "1.0.0"
-      },
-      "dependencies": {
-        "assert-plus": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
-          "dev": true,
-          "optional": true
-        }
-      }
-    },
-    "dateformat": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-2.0.0.tgz",
-      "integrity": "sha1-J0Pjq7XD/CRi5SfcpEXgTp9N7hc=",
-      "dev": true
-    },
-    "debug": {
-      "version": "2.6.8",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
-      "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw=",
-      "dev": true,
-      "requires": {
-        "ms": "2.0.0"
-      }
-    },
-    "debuglog": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/debuglog/-/debuglog-1.0.1.tgz",
-      "integrity": "sha1-qiT/uaw9+aI1GDfPstJ5NgzXhJI=",
-      "dev": true
-    },
-    "decamelize": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
-      "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA=",
-      "dev": true
-    },
-    "defaults": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.3.tgz",
-      "integrity": "sha1-xlYFHpgX2f8I7YgUd/P+QBnz730=",
-      "dev": true,
-      "requires": {
-        "clone": "1.0.2"
-      }
-    },
-    "delayed-stream": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
-      "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk=",
-      "dev": true
-    },
-    "deprecated": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/deprecated/-/deprecated-0.0.1.tgz",
-      "integrity": "sha1-+cmvVGSvoeepcUWKi97yqpTVuxk=",
-      "dev": true
-    },
-    "detect-file": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/detect-file/-/detect-file-0.1.0.tgz",
-      "integrity": "sha1-STXe39lIhkjgBrASlWbpOGcR6mM=",
-      "dev": true,
-      "requires": {
-        "fs-exists-sync": "0.1.0"
-      }
-    },
-    "dezalgo": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/dezalgo/-/dezalgo-1.0.3.tgz",
-      "integrity": "sha1-f3Qt4Gb8dIvI24IFad3c5Jvw1FY=",
-      "dev": true,
-      "requires": {
-        "asap": "2.0.5",
-        "wrappy": "1.0.2"
-      }
-    },
-    "duplexer2": {
-      "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.0.2.tgz",
-      "integrity": "sha1-xhTc9n4vsUmVqRcR5aYX6KYKMds=",
-      "dev": true,
-      "requires": {
-        "readable-stream": "1.1.14"
-      },
-      "dependencies": {
-        "isarray": {
-          "version": "0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
-          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
-          "dev": true
-        },
-        "readable-stream": {
-          "version": "1.1.14",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
-          "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk=",
-          "dev": true,
-          "requires": {
-            "core-util-is": "1.0.2",
-            "inherits": "2.0.3",
-            "isarray": "0.0.1",
-            "string_decoder": "0.10.31"
-          }
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
-          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=",
-          "dev": true
-        }
-      }
-    },
-    "ecc-jsbn": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.1.tgz",
-      "integrity": "sha1-D8c6ntXw1Tw4GTOYUj735UN3dQU=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "jsbn": "0.1.1"
-      }
-    },
-    "end-of-stream": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-0.1.5.tgz",
-      "integrity": "sha1-jhdyBsPICDfYVjLouTWd/osvbq8=",
-      "dev": true,
-      "requires": {
-        "once": "1.3.3"
-      },
-      "dependencies": {
-        "once": {
-          "version": "1.3.3",
-          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz",
-          "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA=",
-          "dev": true,
-          "requires": {
-            "wrappy": "1.0.2"
-          }
-        }
-      }
-    },
-    "error-ex": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.1.tgz",
-      "integrity": "sha1-+FWobOYa3E6GIcPNoh56dhLDqNw=",
-      "dev": true,
-      "requires": {
-        "is-arrayish": "0.2.1"
-      }
-    },
-    "escape-string-regexp": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
-      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
-      "dev": true
-    },
-    "exit-hook": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/exit-hook/-/exit-hook-1.1.1.tgz",
-      "integrity": "sha1-8FyiM7SMBdVP/wd2XfhQfpXAL/g=",
-      "dev": true
-    },
-    "expand-brackets": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
-      "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s=",
-      "dev": true,
-      "requires": {
-        "is-posix-bracket": "0.1.1"
-      }
-    },
-    "expand-range": {
-      "version": "1.8.2",
-      "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz",
-      "integrity": "sha1-opnv/TNf4nIeuujiV+x5ZE/IUzc=",
-      "dev": true,
-      "requires": {
-        "fill-range": "2.2.3"
-      }
-    },
-    "expand-tilde": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-1.2.2.tgz",
-      "integrity": "sha1-C4HrqJflo9MdHD0QL48BRB5VlEk=",
-      "dev": true,
-      "requires": {
-        "os-homedir": "1.0.2"
-      }
-    },
-    "extend": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz",
-      "integrity": "sha1-p1Xqe8Gt/MWjHOfnYtuq3F5jZEQ=",
-      "dev": true
-    },
-    "external-editor": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/external-editor/-/external-editor-1.1.1.tgz",
-      "integrity": "sha1-Etew24UPf/fnCBuvQAVwAGDEYAs=",
-      "dev": true,
-      "requires": {
-        "extend": "3.0.1",
-        "spawn-sync": "1.0.15",
-        "tmp": "0.0.29"
-      }
-    },
-    "extglob": {
-      "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
-      "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE=",
-      "dev": true,
-      "requires": {
-        "is-extglob": "1.0.0"
-      }
-    },
-    "extsprintf": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.0.2.tgz",
-      "integrity": "sha1-4QgOBljjALBilJkMxw4VAiNf1VA=",
-      "dev": true
-    },
-    "fancy-log": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/fancy-log/-/fancy-log-1.3.0.tgz",
-      "integrity": "sha1-Rb4X0Cu5kX1gzP/UmVyZnmyMmUg=",
-      "dev": true,
-      "requires": {
-        "chalk": "1.1.3",
-        "time-stamp": "1.1.0"
-      }
-    },
-    "figures": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz",
-      "integrity": "sha1-y+Hjr/zxzUS4DK3+0o3Hk6lwHS4=",
-      "dev": true,
-      "requires": {
-        "escape-string-regexp": "1.0.5",
-        "object-assign": "4.1.1"
-      }
-    },
-    "filename-regex": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz",
-      "integrity": "sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY=",
-      "dev": true
-    },
-    "fill-range": {
-      "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz",
-      "integrity": "sha1-ULd9/X5Gm8dJJHCWNpn+eoSFpyM=",
-      "dev": true,
-      "requires": {
-        "is-number": "2.1.0",
-        "isobject": "2.1.0",
-        "randomatic": "1.1.7",
-        "repeat-element": "1.1.2",
-        "repeat-string": "1.6.1"
-      }
-    },
-    "find-index": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
-      "integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ=",
-      "dev": true
-    },
-    "find-up": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
-      "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8=",
-      "dev": true,
-      "requires": {
-        "path-exists": "2.1.0",
-        "pinkie-promise": "2.0.1"
-      }
-    },
-    "findup-sync": {
-      "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.4.3.tgz",
-      "integrity": "sha1-QAQ5Kee8YK3wt/SCfExudaDeyhI=",
-      "dev": true,
-      "requires": {
-        "detect-file": "0.1.0",
-        "is-glob": "2.0.1",
-        "micromatch": "2.3.11",
-        "resolve-dir": "0.1.1"
-      }
-    },
-    "fined": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/fined/-/fined-1.0.2.tgz",
-      "integrity": "sha1-WyhCS3YNdZiWC374SA3/itNmDpc=",
-      "dev": true,
-      "requires": {
-        "expand-tilde": "1.2.2",
-        "lodash.assignwith": "4.2.0",
-        "lodash.isempty": "4.4.0",
-        "lodash.isplainobject": "4.0.6",
-        "lodash.isstring": "4.0.1",
-        "lodash.pick": "4.4.0",
-        "parse-filepath": "1.0.1"
-      }
-    },
-    "first-chunk-stream": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/first-chunk-stream/-/first-chunk-stream-1.0.0.tgz",
-      "integrity": "sha1-Wb+1DNkF9g18OUzT2ayqtOatk04=",
-      "dev": true
-    },
-    "flagged-respawn": {
-      "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/flagged-respawn/-/flagged-respawn-0.3.2.tgz",
-      "integrity": "sha1-/xke3c1wiKZ1smEP/8l2vpuAdLU=",
-      "dev": true
-    },
-    "follow-redirects": {
-      "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-0.0.7.tgz",
-      "integrity": "sha1-NLkLqyqRGqNHVx2pDyK9NuzYqRk=",
-      "dev": true,
-      "requires": {
-        "debug": "2.6.8",
-        "stream-consume": "0.1.0"
-      }
-    },
-    "for-in": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
-      "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA=",
-      "dev": true
-    },
-    "for-own": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz",
-      "integrity": "sha1-UmXGgaTylNq78XyVCbZ2OqhFEM4=",
-      "dev": true,
-      "requires": {
-        "for-in": "1.0.2"
-      }
-    },
-    "forever-agent": {
-      "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
-      "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE=",
-      "dev": true,
-      "optional": true
-    },
-    "form-data": {
-      "version": "2.1.4",
-      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
-      "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "asynckit": "0.4.0",
-        "combined-stream": "1.0.5",
-        "mime-types": "2.1.15"
-      }
-    },
-    "fs-exists-sync": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/fs-exists-sync/-/fs-exists-sync-0.1.0.tgz",
-      "integrity": "sha1-mC1ok6+RjnLQjeyehnP/K1qNat0=",
-      "dev": true
-    },
-    "fs-extra": {
-      "version": "0.26.7",
-      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz",
-      "integrity": "sha1-muH92UiXeY7at20JGM9C0MMYT6k=",
-      "dev": true,
-      "requires": {
-        "graceful-fs": "4.1.11",
-        "jsonfile": "2.4.0",
-        "klaw": "1.3.1",
-        "path-is-absolute": "1.0.1",
-        "rimraf": "2.5.4"
-      }
-    },
-    "fs.realpath": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
-      "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=",
-      "dev": true
-    },
-    "gaze": {
-      "version": "0.5.2",
-      "resolved": "https://registry.npmjs.org/gaze/-/gaze-0.5.2.tgz",
-      "integrity": "sha1-QLcJU30k0dRXZ9takIaJ3+aaxE8=",
-      "dev": true,
-      "requires": {
-        "globule": "0.1.0"
-      }
-    },
-    "get-caller-file": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz",
-      "integrity": "sha1-9wLmMSfn4jHBYKgMFVSstw1QR+U=",
-      "dev": true
-    },
-    "getpass": {
-      "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
-      "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "assert-plus": "1.0.0"
-      },
-      "dependencies": {
-        "assert-plus": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
-          "dev": true,
-          "optional": true
-        }
-      }
-    },
-    "git-repo-info": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/git-repo-info/-/git-repo-info-1.1.4.tgz",
-      "integrity": "sha1-E0n6OIinZh6h/2OgR8L/Q7PglgI=",
-      "dev": true
-    },
-    "github": {
-      "version": "7.3.2",
-      "resolved": "https://registry.npmjs.org/github/-/github-7.3.2.tgz",
-      "integrity": "sha1-/hDN5pZDUsXZHhGnYW0m1f+2+Hs=",
-      "dev": true,
-      "requires": {
-        "follow-redirects": "0.0.7",
-        "https-proxy-agent": "1.0.0",
-        "mime": "1.3.6",
-        "netrc": "0.1.4"
-      }
-    },
-    "glob": {
-      "version": "7.0.6",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-7.0.6.tgz",
-      "integrity": "sha1-IRuvr0nlJbjNkyYNFKsTYVKz9Xo=",
-      "dev": true,
-      "requires": {
-        "fs.realpath": "1.0.0",
-        "inflight": "1.0.6",
-        "inherits": "2.0.3",
-        "minimatch": "3.0.4",
-        "once": "1.4.0",
-        "path-is-absolute": "1.0.1"
-      }
-    },
-    "glob-base": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz",
-      "integrity": "sha1-27Fk9iIbHAscz4Kuoyi0l98Oo8Q=",
-      "dev": true,
-      "requires": {
-        "glob-parent": "2.0.0",
-        "is-glob": "2.0.1"
-      }
-    },
-    "glob-escape": {
-      "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/glob-escape/-/glob-escape-0.0.2.tgz",
-      "integrity": "sha1-nCf3gh7RwTd1gvPv2VWOP2dWKO0=",
-      "dev": true
-    },
-    "glob-parent": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz",
-      "integrity": "sha1-gTg9ctsFT8zPUzbaqQLxgvbtuyg=",
-      "dev": true,
-      "requires": {
-        "is-glob": "2.0.1"
-      }
-    },
-    "glob-stream": {
-      "version": "3.1.18",
-      "resolved": "https://registry.npmjs.org/glob-stream/-/glob-stream-3.1.18.tgz",
-      "integrity": "sha1-kXCl8St5Awb9/lmPMT+PeVT9FDs=",
-      "dev": true,
-      "requires": {
-        "glob": "4.5.3",
-        "glob2base": "0.0.12",
-        "minimatch": "2.0.10",
-        "ordered-read-streams": "0.1.0",
-        "through2": "0.6.5",
-        "unique-stream": "1.0.0"
-      },
-      "dependencies": {
-        "glob": {
-          "version": "4.5.3",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-4.5.3.tgz",
-          "integrity": "sha1-xstz0yJsHv7wTePFbQEvAzd+4V8=",
-          "dev": true,
-          "requires": {
-            "inflight": "1.0.6",
-            "inherits": "2.0.3",
-            "minimatch": "2.0.10",
-            "once": "1.4.0"
-          }
-        },
-        "isarray": {
-          "version": "0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
-          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
-          "dev": true
-        },
-        "minimatch": {
-          "version": "2.0.10",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-2.0.10.tgz",
-          "integrity": "sha1-jQh8OcazjAAbl/ynzm0OHoCvusc=",
-          "dev": true,
-          "requires": {
-            "brace-expansion": "1.1.8"
-          }
-        },
-        "readable-stream": {
-          "version": "1.0.34",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
-          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=",
-          "dev": true,
-          "requires": {
-            "core-util-is": "1.0.2",
-            "inherits": "2.0.3",
-            "isarray": "0.0.1",
-            "string_decoder": "0.10.31"
-          }
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
-          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=",
-          "dev": true
-        },
-        "through2": {
-          "version": "0.6.5",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
-          "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg=",
-          "dev": true,
-          "requires": {
-            "readable-stream": "1.0.34",
-            "xtend": "4.0.1"
-          }
-        }
-      }
-    },
-    "glob-watcher": {
-      "version": "0.0.6",
-      "resolved": "https://registry.npmjs.org/glob-watcher/-/glob-watcher-0.0.6.tgz",
-      "integrity": "sha1-uVtKjfdLOcgymLDAXJeLTZo7cQs=",
-      "dev": true,
-      "requires": {
-        "gaze": "0.5.2"
-      }
-    },
-    "glob2base": {
-      "version": "0.0.12",
-      "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz",
-      "integrity": "sha1-nUGbPijxLoOjYhZKJ3BVkiycDVY=",
-      "dev": true,
-      "requires": {
-        "find-index": "0.1.1"
-      }
-    },
-    "global-modules": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-0.2.3.tgz",
-      "integrity": "sha1-6lo77ULG1s6ZWk+KEmm12uIjgo0=",
-      "dev": true,
-      "requires": {
-        "global-prefix": "0.1.5",
-        "is-windows": "0.2.0"
-      }
-    },
-    "global-prefix": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-0.1.5.tgz",
-      "integrity": "sha1-jTvGuNo8qBEqFg2NSW/wRiv+948=",
-      "dev": true,
-      "requires": {
-        "homedir-polyfill": "1.0.1",
-        "ini": "1.3.4",
-        "is-windows": "0.2.0",
-        "which": "1.2.14"
-      }
-    },
-    "globule": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/globule/-/globule-0.1.0.tgz",
-      "integrity": "sha1-2cjt3h2nnRJaFRt5UzuXhnY0auU=",
-      "dev": true,
-      "requires": {
-        "glob": "3.1.21",
-        "lodash": "1.0.2",
-        "minimatch": "0.2.14"
-      },
-      "dependencies": {
-        "glob": {
-          "version": "3.1.21",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-3.1.21.tgz",
-          "integrity": "sha1-0p4KBV3qUTj00H7UDomC6DwgZs0=",
-          "dev": true,
-          "requires": {
-            "graceful-fs": "1.2.3",
-            "inherits": "1.0.2",
-            "minimatch": "0.2.14"
-          }
-        },
-        "graceful-fs": {
-          "version": "1.2.3",
-          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-1.2.3.tgz",
-          "integrity": "sha1-FaSAaldUfLLS2/J/QuiajDRRs2Q=",
-          "dev": true
-        },
-        "inherits": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/inherits/-/inherits-1.0.2.tgz",
-          "integrity": "sha1-ykMJ2t7mtUzAuNJH6NfHoJdb3Js=",
-          "dev": true
-        },
-        "lodash": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-1.0.2.tgz",
-          "integrity": "sha1-j1dWDIO1n8JwvT1WG2kAQ0MOJVE=",
-          "dev": true
-        },
-        "minimatch": {
-          "version": "0.2.14",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.2.14.tgz",
-          "integrity": "sha1-x054BXT2PG+aCQ6Q775u9TpqdWo=",
-          "dev": true,
-          "requires": {
-            "lru-cache": "2.7.3",
-            "sigmund": "1.0.1"
-          }
-        }
-      }
-    },
-    "glogg": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/glogg/-/glogg-1.0.0.tgz",
-      "integrity": "sha1-f+DxmfV6yQbPUS/urY+Q7kooT8U=",
-      "dev": true,
-      "requires": {
-        "sparkles": "1.0.0"
-      }
-    },
-    "graceful-fs": {
-      "version": "4.1.11",
-      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz",
-      "integrity": "sha1-Dovf5NHduIVNZOBOp8AOKgJuVlg=",
-      "dev": true
-    },
-    "graceful-readlink": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz",
-      "integrity": "sha1-TK+tdrxi8C+gObL5Tpo906ORpyU=",
-      "dev": true,
-      "optional": true
-    },
-    "gulp": {
-      "version": "3.9.1",
-      "resolved": "https://registry.npmjs.org/gulp/-/gulp-3.9.1.tgz",
-      "integrity": "sha1-VxzkWSjdQK9lFPxAEYZgFsE4RbQ=",
-      "dev": true,
-      "requires": {
-        "archy": "1.0.0",
-        "chalk": "1.1.3",
-        "deprecated": "0.0.1",
-        "gulp-util": "3.0.8",
-        "interpret": "1.0.3",
-        "liftoff": "2.3.0",
-        "minimist": "1.2.0",
-        "orchestrator": "0.3.8",
-        "pretty-hrtime": "1.0.3",
-        "semver": "4.3.6",
-        "tildify": "1.2.0",
-        "v8flags": "2.1.1",
-        "vinyl-fs": "0.3.14"
-      },
-      "dependencies": {
-        "semver": {
-          "version": "4.3.6",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz",
-          "integrity": "sha1-MAvG4OhjdPe6YQaLWx7NV/xlMto=",
-          "dev": true
-        }
-      }
-    },
-    "gulp-util": {
-      "version": "3.0.8",
-      "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.8.tgz",
-      "integrity": "sha1-AFTh50RQLifATBh8PsxQXdVLu08=",
-      "dev": true,
-      "requires": {
-        "array-differ": "1.0.0",
-        "array-uniq": "1.0.3",
-        "beeper": "1.1.1",
-        "chalk": "1.1.3",
-        "dateformat": "2.0.0",
-        "fancy-log": "1.3.0",
-        "gulplog": "1.0.0",
-        "has-gulplog": "0.1.0",
-        "lodash._reescape": "3.0.0",
-        "lodash._reevaluate": "3.0.0",
-        "lodash._reinterpolate": "3.0.0",
-        "lodash.template": "3.6.2",
-        "minimist": "1.2.0",
-        "multipipe": "0.1.2",
-        "object-assign": "3.0.0",
-        "replace-ext": "0.0.1",
-        "through2": "2.0.3",
-        "vinyl": "0.5.3"
-      },
-      "dependencies": {
-        "object-assign": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz",
-          "integrity": "sha1-m+3VygiXlJvKR+f/QIBi1Un1h/I=",
-          "dev": true
-        }
-      }
-    },
-    "gulplog": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/gulplog/-/gulplog-1.0.0.tgz",
-      "integrity": "sha1-4oxNRdBey77YGDY86PnFkmIp/+U=",
-      "dev": true,
-      "requires": {
-        "glogg": "1.0.0"
-      }
-    },
-    "har-schema": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-1.0.5.tgz",
-      "integrity": "sha1-0mMTX0MwfALGAq/I/pWXDAFRNp4=",
-      "dev": true,
-      "optional": true
-    },
-    "har-validator": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz",
-      "integrity": "sha1-M0gdDxu/9gDdID11gSpqX7oALio=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "ajv": "4.11.8",
-        "har-schema": "1.0.5"
-      }
-    },
-    "has-ansi": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz",
-      "integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE=",
-      "dev": true,
-      "requires": {
-        "ansi-regex": "2.1.1"
-      }
-    },
-    "has-gulplog": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/has-gulplog/-/has-gulplog-0.1.0.tgz",
-      "integrity": "sha1-ZBTIKRNpfaUVkDl9r7EvIpZ4Ec4=",
-      "dev": true,
-      "requires": {
-        "sparkles": "1.0.0"
-      }
-    },
-    "hawk": {
-      "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz",
-      "integrity": "sha1-B4REvXwWQLD+VA0sm3PVlnjo4cQ=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "boom": "2.10.1",
-        "cryptiles": "2.0.5",
-        "hoek": "2.16.3",
-        "sntp": "1.0.9"
-      }
-    },
-    "hoek": {
-      "version": "2.16.3",
-      "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz",
-      "integrity": "sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0=",
-      "dev": true
-    },
-    "homedir-polyfill": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.1.tgz",
-      "integrity": "sha1-TCu8inWJmP7r9e1oWA921GdotLw=",
-      "dev": true,
-      "requires": {
-        "parse-passwd": "1.0.0"
-      }
-    },
-    "hosted-git-info": {
-      "version": "2.4.2",
-      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.4.2.tgz",
-      "integrity": "sha1-AHa59GonBQbduq6lZJaJdGBhKmc=",
-      "dev": true
-    },
-    "http-signature": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz",
-      "integrity": "sha1-33LiZwZs0Kxn+3at+OE0qPvPkb8=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "assert-plus": "0.2.0",
-        "jsprim": "1.4.0",
-        "sshpk": "1.13.1"
-      }
-    },
-    "https-proxy-agent": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-1.0.0.tgz",
-      "integrity": "sha1-NffabEjOTdv6JkiRrFk+5f+GceY=",
-      "dev": true,
-      "requires": {
-        "agent-base": "2.1.1",
-        "debug": "2.6.8",
-        "extend": "3.0.1"
-      }
-    },
-    "inflight": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
-      "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=",
-      "dev": true,
-      "requires": {
-        "once": "1.4.0",
-        "wrappy": "1.0.2"
-      }
-    },
-    "inherits": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
-      "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=",
-      "dev": true
-    },
-    "ini": {
-      "version": "1.3.4",
-      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.4.tgz",
-      "integrity": "sha1-BTfLedr1m1mhpRff9wbIbsA5Fi4=",
-      "dev": true
-    },
-    "inquirer": {
-      "version": "1.2.3",
-      "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-1.2.3.tgz",
-      "integrity": "sha1-TexvMvN+97sLLtPx0aXD9UUHSRg=",
-      "dev": true,
-      "requires": {
-        "ansi-escapes": "1.4.0",
-        "chalk": "1.1.3",
-        "cli-cursor": "1.0.2",
-        "cli-width": "2.1.0",
-        "external-editor": "1.1.1",
-        "figures": "1.7.0",
-        "lodash": "4.15.0",
-        "mute-stream": "0.0.6",
-        "pinkie-promise": "2.0.1",
-        "run-async": "2.3.0",
-        "rx": "4.1.0",
-        "string-width": "1.0.2",
-        "strip-ansi": "3.0.1",
-        "through": "2.3.8"
-      }
-    },
-    "interpret": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.0.3.tgz",
-      "integrity": "sha1-y8NcYu7uc/Gat7EKgBURQBr8D5A=",
-      "dev": true
-    },
-    "invert-kv": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/invert-kv/-/invert-kv-1.0.0.tgz",
-      "integrity": "sha1-EEqOSqym09jNFXqO+L+rLXo//bY=",
-      "dev": true
-    },
-    "is-absolute": {
-      "version": "0.2.6",
-      "resolved": "https://registry.npmjs.org/is-absolute/-/is-absolute-0.2.6.tgz",
-      "integrity": "sha1-IN5p89uULvLYe5wto28XIjWxtes=",
-      "dev": true,
-      "requires": {
-        "is-relative": "0.2.1",
-        "is-windows": "0.2.0"
-      }
-    },
-    "is-arrayish": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
-      "integrity": "sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0=",
-      "dev": true
-    },
-    "is-buffer": {
-      "version": "1.1.5",
-      "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.5.tgz",
-      "integrity": "sha1-Hzsm72E7IUuIy8ojzGwB2Hlh7sw=",
-      "dev": true
-    },
-    "is-builtin-module": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-1.0.0.tgz",
-      "integrity": "sha1-VAVy0096wxGfj3bDDLwbHgN6/74=",
-      "dev": true,
-      "requires": {
-        "builtin-modules": "1.1.1"
-      }
-    },
-    "is-dotfile": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/is-dotfile/-/is-dotfile-1.0.3.tgz",
-      "integrity": "sha1-pqLzL/0t+wT1yiXs0Pa4PPeYoeE=",
-      "dev": true
-    },
-    "is-equal-shallow": {
-      "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/is-equal-shallow/-/is-equal-shallow-0.1.3.tgz",
-      "integrity": "sha1-IjgJj8Ih3gvPpdnqxMRdY4qhxTQ=",
-      "dev": true,
-      "requires": {
-        "is-primitive": "2.0.0"
-      }
-    },
-    "is-extendable": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
-      "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=",
-      "dev": true
-    },
-    "is-extglob": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
-      "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA=",
-      "dev": true
-    },
-    "is-fullwidth-code-point": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
-      "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
-      "dev": true,
-      "requires": {
-        "number-is-nan": "1.0.1"
-      }
-    },
-    "is-glob": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz",
-      "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM=",
-      "dev": true,
-      "requires": {
-        "is-extglob": "1.0.0"
-      }
-    },
-    "is-number": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz",
-      "integrity": "sha1-Afy7s5NGOlSPL0ZszhbezknbkI8=",
-      "dev": true,
-      "requires": {
-        "kind-of": "3.2.2"
-      }
-    },
-    "is-posix-bracket": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz",
-      "integrity": "sha1-MzTceXdDaOkvAW5vvAqI9c1ua8Q=",
-      "dev": true
-    },
-    "is-primitive": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/is-primitive/-/is-primitive-2.0.0.tgz",
-      "integrity": "sha1-IHurkWOEmcB7Kt8kCkGochADRXU=",
-      "dev": true
-    },
-    "is-promise": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/is-promise/-/is-promise-2.1.0.tgz",
-      "integrity": "sha1-eaKp7OfwlugPNtKy87wWwf9L8/o=",
-      "dev": true
-    },
-    "is-relative": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/is-relative/-/is-relative-0.2.1.tgz",
-      "integrity": "sha1-0n9MfVFtF1+2ENuEu+7yPDvJeqU=",
-      "dev": true,
-      "requires": {
-        "is-unc-path": "0.1.2"
-      }
-    },
-    "is-typedarray": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz",
-      "integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo=",
-      "dev": true,
-      "optional": true
-    },
-    "is-unc-path": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/is-unc-path/-/is-unc-path-0.1.2.tgz",
-      "integrity": "sha1-arBTpyVzwQJQ/0FqOBTDUXivObk=",
-      "dev": true,
-      "requires": {
-        "unc-path-regex": "0.1.2"
-      }
-    },
-    "is-utf8": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz",
-      "integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI=",
-      "dev": true
-    },
-    "is-windows": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-0.2.0.tgz",
-      "integrity": "sha1-3hqm1j6indJIc3tp8f+LgALSEIw=",
-      "dev": true
-    },
-    "isarray": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-      "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=",
-      "dev": true
-    },
-    "isexe": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
-      "integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA=",
-      "dev": true
-    },
-    "isobject": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
-      "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk=",
-      "dev": true,
-      "requires": {
-        "isarray": "1.0.0"
-      }
-    },
-    "isstream": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz",
-      "integrity": "sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo=",
-      "dev": true,
-      "optional": true
-    },
-    "jju": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/jju/-/jju-1.3.0.tgz",
-      "integrity": "sha1-2t2e8BkkvHKLA/L3l5vb1i96Kqo=",
-      "dev": true
-    },
-    "jsbn": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-0.1.1.tgz",
-      "integrity": "sha1-peZUwuWi3rXyAdls77yoDA7y9RM=",
-      "dev": true,
-      "optional": true
-    },
-    "json-parse-helpfulerror": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/json-parse-helpfulerror/-/json-parse-helpfulerror-1.0.3.tgz",
-      "integrity": "sha1-E/FM4C7tTpgSl7ZOueO5MuLdE9w=",
-      "dev": true,
-      "requires": {
-        "jju": "1.3.0"
-      }
-    },
-    "json-schema": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz",
-      "integrity": "sha1-tIDIkuWaLwWVTOcnvT8qTogvnhM=",
-      "dev": true,
-      "optional": true
-    },
-    "json-stable-stringify": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz",
-      "integrity": "sha1-mnWdOcXy/1A/1TAGRu1EX4jE+a8=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "jsonify": "0.0.0"
-      }
-    },
-    "json-stringify-safe": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz",
-      "integrity": "sha1-Epai1Y/UXxmg9s4B1lcB4sc1tus=",
-      "dev": true,
-      "optional": true
-    },
-    "jsonfile": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz",
-      "integrity": "sha1-NzaitCi4e72gzIO1P6PWM6NcKug=",
-      "dev": true,
-      "requires": {
-        "graceful-fs": "4.1.11"
-      }
-    },
-    "jsonify": {
-      "version": "0.0.0",
-      "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz",
-      "integrity": "sha1-LHS27kHZPKUbe1qu6PUDYx0lKnM=",
-      "dev": true,
-      "optional": true
-    },
-    "jsprim": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.0.tgz",
-      "integrity": "sha1-o7h+QCmNjDgFUtjMdiigu5WiKRg=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "assert-plus": "1.0.0",
-        "extsprintf": "1.0.2",
-        "json-schema": "0.2.3",
-        "verror": "1.3.6"
-      },
-      "dependencies": {
-        "assert-plus": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
-          "dev": true,
-          "optional": true
-        }
-      }
-    },
-    "kind-of": {
-      "version": "3.2.2",
-      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-      "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
-      "dev": true,
-      "requires": {
-        "is-buffer": "1.1.5"
-      }
-    },
-    "klaw": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/klaw/-/klaw-1.3.1.tgz",
-      "integrity": "sha1-QIhDO0azsbolnXh4XY6W9zugJDk=",
-      "dev": true,
-      "requires": {
-        "graceful-fs": "4.1.11"
-      }
-    },
-    "lcid": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/lcid/-/lcid-1.0.0.tgz",
-      "integrity": "sha1-MIrMr6C8SDo4Z7S28rlQYlHRuDU=",
-      "dev": true,
-      "requires": {
-        "invert-kv": "1.0.0"
-      }
-    },
-    "liftoff": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/liftoff/-/liftoff-2.3.0.tgz",
-      "integrity": "sha1-qY8v9nGD2Lp8+soQVIvX/wVQs4U=",
-      "dev": true,
-      "requires": {
-        "extend": "3.0.1",
-        "findup-sync": "0.4.3",
-        "fined": "1.0.2",
-        "flagged-respawn": "0.3.2",
-        "lodash.isplainobject": "4.0.6",
-        "lodash.isstring": "4.0.1",
-        "lodash.mapvalues": "4.6.0",
-        "rechoir": "0.6.2",
-        "resolve": "1.3.3"
-      }
-    },
-    "load-json-file": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
-      "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
-      "dev": true,
-      "requires": {
-        "graceful-fs": "4.1.11",
-        "parse-json": "2.2.0",
-        "pify": "2.3.0",
-        "pinkie-promise": "2.0.1",
-        "strip-bom": "2.0.0"
-      },
-      "dependencies": {
-        "strip-bom": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
-          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4=",
-          "dev": true,
-          "requires": {
-            "is-utf8": "0.2.1"
-          }
-        }
-      }
-    },
-    "lodash": {
-      "version": "4.15.0",
-      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.15.0.tgz",
-      "integrity": "sha1-MWI5HY8BQKoiz49rPDTWt/Y9Oqk=",
-      "dev": true
-    },
-    "lodash._basecopy": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz",
-      "integrity": "sha1-jaDmqHbPNEwK2KVIghEd08XHyjY=",
-      "dev": true
-    },
-    "lodash._basetostring": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/lodash._basetostring/-/lodash._basetostring-3.0.1.tgz",
-      "integrity": "sha1-0YYdh3+CSlL2aYMtyvPuFVZqB9U=",
-      "dev": true
-    },
-    "lodash._basevalues": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._basevalues/-/lodash._basevalues-3.0.0.tgz",
-      "integrity": "sha1-W3dXYoAr3j0yl1A+JjAIIP32Ybc=",
-      "dev": true
-    },
-    "lodash._getnative": {
-      "version": "3.9.1",
-      "resolved": "https://registry.npmjs.org/lodash._getnative/-/lodash._getnative-3.9.1.tgz",
-      "integrity": "sha1-VwvH3t5G1hzc3mh9ZdPuy6o6r/U=",
-      "dev": true
-    },
-    "lodash._isiterateecall": {
-      "version": "3.0.9",
-      "resolved": "https://registry.npmjs.org/lodash._isiterateecall/-/lodash._isiterateecall-3.0.9.tgz",
-      "integrity": "sha1-UgOte6Ql+uhCRg5pbbnPPmqsBXw=",
-      "dev": true
-    },
-    "lodash._reescape": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reescape/-/lodash._reescape-3.0.0.tgz",
-      "integrity": "sha1-Kx1vXf4HyKNVdT5fJ/rH8c3hYWo=",
-      "dev": true
-    },
-    "lodash._reevaluate": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reevaluate/-/lodash._reevaluate-3.0.0.tgz",
-      "integrity": "sha1-WLx0xAZklTrgsSTYBpltrKQx4u0=",
-      "dev": true
-    },
-    "lodash._reinterpolate": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz",
-      "integrity": "sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0=",
-      "dev": true
-    },
-    "lodash._root": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/lodash._root/-/lodash._root-3.0.1.tgz",
-      "integrity": "sha1-+6HEUkwZ7ppfgTa0YJ8BfPTe1pI=",
-      "dev": true
-    },
-    "lodash.assignwith": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/lodash.assignwith/-/lodash.assignwith-4.2.0.tgz",
-      "integrity": "sha1-EnqX8CrcQXUalU0ksN4X4QDgOOs=",
-      "dev": true
-    },
-    "lodash.escape": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-3.2.0.tgz",
-      "integrity": "sha1-mV7g3BjBtIzJLv+ucaEKq1tIdpg=",
-      "dev": true,
-      "requires": {
-        "lodash._root": "3.0.1"
-      }
-    },
-    "lodash.get": {
-      "version": "4.4.2",
-      "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
-      "integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk=",
-      "dev": true
-    },
-    "lodash.isarguments": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz",
-      "integrity": "sha1-L1c9hcaiQon/AGY7SRwdM4/zRYo=",
-      "dev": true
-    },
-    "lodash.isarray": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz",
-      "integrity": "sha1-eeTriMNqgSKvhvhEqpvNhRtfu1U=",
-      "dev": true
-    },
-    "lodash.isempty": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/lodash.isempty/-/lodash.isempty-4.4.0.tgz",
-      "integrity": "sha1-b4bL7di+TsmHvpqvM8loTbGzHn4=",
-      "dev": true
-    },
-    "lodash.isplainobject": {
-      "version": "4.0.6",
-      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
-      "integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs=",
-      "dev": true
-    },
-    "lodash.isstring": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/lodash.isstring/-/lodash.isstring-4.0.1.tgz",
-      "integrity": "sha1-1SfftUVuynzJu5XV2ur4i6VKVFE=",
-      "dev": true
-    },
-    "lodash.keys": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz",
-      "integrity": "sha1-TbwEcrFWvlCgsoaFXRvQsMZWCYo=",
-      "dev": true,
-      "requires": {
-        "lodash._getnative": "3.9.1",
-        "lodash.isarguments": "3.1.0",
-        "lodash.isarray": "3.0.4"
-      }
-    },
-    "lodash.mapvalues": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/lodash.mapvalues/-/lodash.mapvalues-4.6.0.tgz",
-      "integrity": "sha1-G6+lAF3p3W9PJmaMMMo3IwzJaJw=",
-      "dev": true
-    },
-    "lodash.pick": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz",
-      "integrity": "sha1-UvBWEP/53tQiYRRB7R/BI6AwAbM=",
-      "dev": true
-    },
-    "lodash.restparam": {
-      "version": "3.6.1",
-      "resolved": "https://registry.npmjs.org/lodash.restparam/-/lodash.restparam-3.6.1.tgz",
-      "integrity": "sha1-k2pOMJ7zMKdkXtQUWYbIWuWyCAU=",
-      "dev": true
-    },
-    "lodash.template": {
-      "version": "3.6.2",
-      "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-3.6.2.tgz",
-      "integrity": "sha1-+M3sxhaaJVvpCYrosMU9N4kx0U8=",
-      "dev": true,
-      "requires": {
-        "lodash._basecopy": "3.0.1",
-        "lodash._basetostring": "3.0.1",
-        "lodash._basevalues": "3.0.0",
-        "lodash._isiterateecall": "3.0.9",
-        "lodash._reinterpolate": "3.0.0",
-        "lodash.escape": "3.2.0",
-        "lodash.keys": "3.1.2",
-        "lodash.restparam": "3.6.1",
-        "lodash.templatesettings": "3.1.1"
-      }
-    },
-    "lodash.templatesettings": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-3.1.1.tgz",
-      "integrity": "sha1-+zB4RHU7Zrnxr6VOJix0UwfbqOU=",
-      "dev": true,
-      "requires": {
-        "lodash._reinterpolate": "3.0.0",
-        "lodash.escape": "3.2.0"
-      }
-    },
-    "lru-cache": {
-      "version": "2.7.3",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.7.3.tgz",
-      "integrity": "sha1-bUUk6LlV+V1PW1iFHOId1y+06VI=",
-      "dev": true
-    },
-    "map-cache": {
-      "version": "0.2.2",
-      "resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz",
-      "integrity": "sha1-wyq9C9ZSXZsFFkW7TyasXcmKDb8=",
-      "dev": true
-    },
-    "micromatch": {
-      "version": "2.3.11",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
-      "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU=",
-      "dev": true,
-      "requires": {
-        "arr-diff": "2.0.0",
-        "array-unique": "0.2.1",
-        "braces": "1.8.5",
-        "expand-brackets": "0.1.5",
-        "extglob": "0.3.2",
-        "filename-regex": "2.0.1",
-        "is-extglob": "1.0.0",
-        "is-glob": "2.0.1",
-        "kind-of": "3.2.2",
-        "normalize-path": "2.1.1",
-        "object.omit": "2.0.1",
-        "parse-glob": "3.0.4",
-        "regex-cache": "0.4.3"
-      }
-    },
-    "mime": {
-      "version": "1.3.6",
-      "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.6.tgz",
-      "integrity": "sha1-WR2E02U6awtKO5343lqoEI5y5eA=",
-      "dev": true
-    },
-    "mime-db": {
-      "version": "1.27.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.27.0.tgz",
-      "integrity": "sha1-gg9XIpa70g7CXtVeW13oaeVDbrE=",
-      "dev": true
-    },
-    "mime-types": {
-      "version": "2.1.15",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.15.tgz",
-      "integrity": "sha1-pOv1BkCUVpI3uM9wBGd20J/JKu0=",
-      "dev": true,
-      "requires": {
-        "mime-db": "1.27.0"
-      }
-    },
-    "minimatch": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
-      "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==",
-      "dev": true,
-      "requires": {
-        "brace-expansion": "1.1.8"
-      }
-    },
-    "minimist": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
-      "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=",
-      "dev": true
-    },
-    "mkdirp": {
-      "version": "0.5.1",
-      "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
-      "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
-      "dev": true,
-      "requires": {
-        "minimist": "0.0.8"
-      },
-      "dependencies": {
-        "minimist": {
-          "version": "0.0.8",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
-          "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0=",
-          "dev": true
-        }
-      }
-    },
-    "ms": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-      "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
-      "dev": true
-    },
-    "multipipe": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/multipipe/-/multipipe-0.1.2.tgz",
-      "integrity": "sha1-Ko8t33Du1WTf8tV/HhoTfZ8FB4s=",
-      "dev": true,
-      "requires": {
-        "duplexer2": "0.0.2"
-      }
-    },
-    "mute-stream": {
-      "version": "0.0.6",
-      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.6.tgz",
-      "integrity": "sha1-SJYrGeFp/R38JAs/HnMXYnu8R9s=",
-      "dev": true
-    },
-    "natives": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/natives/-/natives-1.1.0.tgz",
-      "integrity": "sha1-6f+EFBimsux6SV6TmYT3jxY+bjE=",
-      "dev": true
-    },
-    "netrc": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/netrc/-/netrc-0.1.4.tgz",
-      "integrity": "sha1-a+lPysqNd63gqWcNxGCRTJRHJEQ=",
-      "dev": true
-    },
-    "normalize-package-data": {
-      "version": "2.3.8",
-      "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.3.8.tgz",
-      "integrity": "sha1-2Bntoqne29H/pWPqQHHZNngilbs=",
-      "dev": true,
-      "requires": {
-        "hosted-git-info": "2.4.2",
-        "is-builtin-module": "1.0.0",
-        "semver": "5.3.0",
-        "validate-npm-package-license": "3.0.1"
-      }
-    },
-    "normalize-path": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-2.1.1.tgz",
-      "integrity": "sha1-GrKLVW4Zg2Oowab35vogE3/mrtk=",
-      "dev": true,
-      "requires": {
-        "remove-trailing-separator": "1.0.2"
-      }
-    },
-    "npm-package-arg": {
-      "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/npm-package-arg/-/npm-package-arg-5.1.2.tgz",
-      "integrity": "sha512-wJBsrf0qpypPT7A0LART18hCdyhpCMxeTtcb0X4IZO2jsP6Om7EHN1d9KSKiqD+KVH030RVNpWS9thk+pb7wzA==",
-      "dev": true,
-      "requires": {
-        "hosted-git-info": "2.4.2",
-        "osenv": "0.1.4",
-        "semver": "5.3.0",
-        "validate-npm-package-name": "3.0.0"
-      }
-    },
-    "number-is-nan": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz",
-      "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=",
-      "dev": true
-    },
-    "oauth-sign": {
-      "version": "0.8.2",
-      "resolved": "https://registry.npmjs.org/oauth-sign/-/oauth-sign-0.8.2.tgz",
-      "integrity": "sha1-Rqarfwrq2N6unsBWV4C31O/rnUM=",
-      "dev": true,
-      "optional": true
-    },
-    "object-assign": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
-      "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=",
-      "dev": true
-    },
-    "object.omit": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/object.omit/-/object.omit-2.0.1.tgz",
-      "integrity": "sha1-Gpx0SCnznbuFjHbKNXmuKlTr0fo=",
-      "dev": true,
-      "requires": {
-        "for-own": "0.1.5",
-        "is-extendable": "0.1.1"
-      }
-    },
-    "once": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
-      "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
-      "dev": true,
-      "requires": {
-        "wrappy": "1.0.2"
-      }
-    },
-    "onetime": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/onetime/-/onetime-1.1.0.tgz",
-      "integrity": "sha1-ofeDj4MUxRbwXs78vEzP4EtO14k=",
-      "dev": true
-    },
-    "orchestrator": {
-      "version": "0.3.8",
-      "resolved": "https://registry.npmjs.org/orchestrator/-/orchestrator-0.3.8.tgz",
-      "integrity": "sha1-FOfp4nZPcxX7rBhOUGx6pt+UrX4=",
-      "dev": true,
-      "requires": {
-        "end-of-stream": "0.1.5",
-        "sequencify": "0.0.7",
-        "stream-consume": "0.1.0"
-      }
-    },
-    "ordered-read-streams": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.1.0.tgz",
-      "integrity": "sha1-/VZamvjrRHO6abbtijQ1LLVS8SY=",
-      "dev": true
-    },
-    "os-homedir": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
-      "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M=",
-      "dev": true
-    },
-    "os-locale": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
-      "integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk=",
-      "dev": true,
-      "requires": {
-        "lcid": "1.0.0"
-      }
-    },
-    "os-shim": {
-      "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/os-shim/-/os-shim-0.1.3.tgz",
-      "integrity": "sha1-a2LDeRz3kJ6jXtRuF2WLtBfLORc=",
-      "dev": true
-    },
-    "os-tmpdir": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
-      "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ=",
-      "dev": true
-    },
-    "osenv": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.4.tgz",
-      "integrity": "sha1-Qv5tWVPfBsgGS+bxdsPQWqqjRkQ=",
-      "dev": true,
-      "requires": {
-        "os-homedir": "1.0.2",
-        "os-tmpdir": "1.0.2"
-      }
-    },
-    "parse-filepath": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/parse-filepath/-/parse-filepath-1.0.1.tgz",
-      "integrity": "sha1-FZ1hVdQ5BNFsEO9piRHaHpGWm3M=",
-      "dev": true,
-      "requires": {
-        "is-absolute": "0.2.6",
-        "map-cache": "0.2.2",
-        "path-root": "0.1.1"
-      }
-    },
-    "parse-glob": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/parse-glob/-/parse-glob-3.0.4.tgz",
-      "integrity": "sha1-ssN2z7EfNVE7rdFz7wu246OIORw=",
-      "dev": true,
-      "requires": {
-        "glob-base": "0.3.0",
-        "is-dotfile": "1.0.3",
-        "is-extglob": "1.0.0",
-        "is-glob": "2.0.1"
-      }
-    },
-    "parse-json": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz",
-      "integrity": "sha1-9ID0BDTvgHQfhGkJn43qGPVaTck=",
-      "dev": true,
-      "requires": {
-        "error-ex": "1.3.1"
-      }
-    },
-    "parse-passwd": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/parse-passwd/-/parse-passwd-1.0.0.tgz",
-      "integrity": "sha1-bVuTSkVpk7I9N/QKOC1vFmao5cY=",
-      "dev": true
-    },
-    "path-exists": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
-      "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s=",
-      "dev": true,
-      "requires": {
-        "pinkie-promise": "2.0.1"
-      }
-    },
-    "path-is-absolute": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
-      "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=",
-      "dev": true
-    },
-    "path-parse": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.5.tgz",
-      "integrity": "sha1-PBrfhx6pzWyUMbbqK9dKD/BVxME=",
-      "dev": true
-    },
-    "path-root": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/path-root/-/path-root-0.1.1.tgz",
-      "integrity": "sha1-mkpoFMrBwM1zNgqV8yCDyOpHRbc=",
-      "dev": true,
-      "requires": {
-        "path-root-regex": "0.1.2"
-      }
-    },
-    "path-root-regex": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/path-root-regex/-/path-root-regex-0.1.2.tgz",
-      "integrity": "sha1-v8zcjfWxLcUsi0PsONGNcsBLqW0=",
-      "dev": true
-    },
-    "path-type": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
-      "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE=",
-      "dev": true,
-      "requires": {
-        "graceful-fs": "4.1.11",
-        "pify": "2.3.0",
-        "pinkie-promise": "2.0.1"
-      }
-    },
-    "performance-now": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-0.2.0.tgz",
-      "integrity": "sha1-M+8wxcd9TqIcWlOGnZG1bY8lVeU=",
-      "dev": true,
-      "optional": true
-    },
-    "pify": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
-      "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
-      "dev": true
-    },
-    "pinkie": {
-      "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/pinkie/-/pinkie-2.0.4.tgz",
-      "integrity": "sha1-clVrgM+g1IqXToDnckjoDtT3+HA=",
-      "dev": true
-    },
-    "pinkie-promise": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz",
-      "integrity": "sha1-ITXW36ejWMBprJsXh3YogihFD/o=",
-      "dev": true,
-      "requires": {
-        "pinkie": "2.0.4"
-      }
-    },
-    "preserve": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/preserve/-/preserve-0.2.0.tgz",
-      "integrity": "sha1-gV7R9uvGWSb4ZbMQwHE7yzMVzks=",
-      "dev": true
-    },
-    "pretty-hrtime": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz",
-      "integrity": "sha1-t+PqQkNaTJsnWdmeDyAesZWALuE=",
-      "dev": true
-    },
-    "process-nextick-args": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz",
-      "integrity": "sha1-FQ4gt1ZZCtP5EJPyWk8q2L/zC6M=",
-      "dev": true
-    },
-    "punycode": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
-      "integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4=",
-      "dev": true,
-      "optional": true
-    },
-    "qs": {
-      "version": "6.4.0",
-      "resolved": "https://registry.npmjs.org/qs/-/qs-6.4.0.tgz",
-      "integrity": "sha1-E+JtKK1rD/qpExLNO/cI7TUecjM=",
-      "dev": true,
-      "optional": true
-    },
-    "randomatic": {
-      "version": "1.1.7",
-      "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-1.1.7.tgz",
-      "integrity": "sha512-D5JUjPyJbaJDkuAazpVnSfVkLlpeO3wDlPROTMLGKG1zMFNFRgrciKo1ltz/AzNTkqE0HzDx655QOL51N06how==",
-      "dev": true,
-      "requires": {
-        "is-number": "3.0.0",
-        "kind-of": "4.0.0"
-      },
-      "dependencies": {
-        "is-number": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/is-number/-/is-number-3.0.0.tgz",
-          "integrity": "sha1-JP1iAaR4LPUFYcgQJ2r8fRLXEZU=",
-          "dev": true,
-          "requires": {
-            "kind-of": "3.2.2"
-          },
-          "dependencies": {
-            "kind-of": {
-              "version": "3.2.2",
-              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-              "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
-              "dev": true,
-              "requires": {
-                "is-buffer": "1.1.5"
-              }
-            }
-          }
-        },
-        "kind-of": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-4.0.0.tgz",
-          "integrity": "sha1-IIE989cSkosgc3hpGkUGb65y3Vc=",
-          "dev": true,
-          "requires": {
-            "is-buffer": "1.1.5"
-          }
-        }
-      }
-    },
-    "read-package-json": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/read-package-json/-/read-package-json-2.0.5.tgz",
-      "integrity": "sha1-+Tpk5kFSnfaKCMZN5GOJ6KP4iEU=",
-      "dev": true,
-      "requires": {
-        "glob": "7.1.2",
-        "graceful-fs": "4.1.11",
-        "json-parse-helpfulerror": "1.0.3",
-        "normalize-package-data": "2.3.8"
-      },
-      "dependencies": {
-        "glob": {
-          "version": "7.1.2",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
-          "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ==",
-          "dev": true,
-          "requires": {
-            "fs.realpath": "1.0.0",
-            "inflight": "1.0.6",
-            "inherits": "2.0.3",
-            "minimatch": "3.0.4",
-            "once": "1.4.0",
-            "path-is-absolute": "1.0.1"
-          }
-        }
-      }
-    },
-    "read-package-tree": {
-      "version": "5.1.6",
-      "resolved": "https://registry.npmjs.org/read-package-tree/-/read-package-tree-5.1.6.tgz",
-      "integrity": "sha512-FCX1aT3GWyY658wzDICef4p+n0dB+ENRct8E/Qyvppj6xVpOYerBHfUu7OP5Rt1/393Tdglguf5ju5DEX4wZNg==",
-      "dev": true,
-      "requires": {
-        "debuglog": "1.0.1",
-        "dezalgo": "1.0.3",
-        "once": "1.4.0",
-        "read-package-json": "2.0.5",
-        "readdir-scoped-modules": "1.0.2"
-      }
-    },
-    "read-pkg": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
-      "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg=",
-      "dev": true,
-      "requires": {
-        "load-json-file": "1.1.0",
-        "normalize-package-data": "2.3.8",
-        "path-type": "1.1.0"
-      }
-    },
-    "read-pkg-up": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
-      "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI=",
-      "dev": true,
-      "requires": {
-        "find-up": "1.1.2",
-        "read-pkg": "1.1.0"
-      }
-    },
-    "readable-stream": {
-      "version": "2.2.11",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-      "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q==",
-      "dev": true,
-      "requires": {
-        "core-util-is": "1.0.2",
-        "inherits": "2.0.3",
-        "isarray": "1.0.0",
-        "process-nextick-args": "1.0.7",
-        "safe-buffer": "5.0.1",
-        "string_decoder": "1.0.2",
-        "util-deprecate": "1.0.2"
-      },
-      "dependencies": {
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c=",
-          "dev": true
-        }
-      }
-    },
-    "readdir-scoped-modules": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/readdir-scoped-modules/-/readdir-scoped-modules-1.0.2.tgz",
-      "integrity": "sha1-n6+jfShr5dksuuve4DDcm19AZ0c=",
-      "dev": true,
-      "requires": {
-        "debuglog": "1.0.1",
-        "dezalgo": "1.0.3",
-        "graceful-fs": "4.1.11",
-        "once": "1.4.0"
-      }
-    },
-    "rechoir": {
-      "version": "0.6.2",
-      "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz",
-      "integrity": "sha1-hSBLVNuoLVdC4oyWdW70OvUOM4Q=",
-      "dev": true,
-      "requires": {
-        "resolve": "1.3.3"
-      }
-    },
-    "regex-cache": {
-      "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.3.tgz",
-      "integrity": "sha1-mxpsNdTQ3871cRrmUejp09cRQUU=",
-      "dev": true,
-      "requires": {
-        "is-equal-shallow": "0.1.3",
-        "is-primitive": "2.0.0"
-      }
-    },
-    "remove-trailing-separator": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.0.2.tgz",
-      "integrity": "sha1-abBi2XhyetFNxrVrpKt3L9jXBRE=",
-      "dev": true
-    },
-    "repeat-element": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/repeat-element/-/repeat-element-1.1.2.tgz",
-      "integrity": "sha1-7wiaF40Ug7quTZPrmLT55OEdmQo=",
-      "dev": true
-    },
-    "repeat-string": {
-      "version": "1.6.1",
-      "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-1.6.1.tgz",
-      "integrity": "sha1-jcrkcOHIirwtYA//Sndihtp15jc=",
-      "dev": true
-    },
-    "replace-ext": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-0.0.1.tgz",
-      "integrity": "sha1-KbvZIHinOfC8zitO5B6DeVNSKSQ=",
-      "dev": true
-    },
-    "request": {
-      "version": "2.81.0",
-      "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz",
-      "integrity": "sha1-xpKJRqDgbF+Nb4qTM0af/aRimKA=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "aws-sign2": "0.6.0",
-        "aws4": "1.6.0",
-        "caseless": "0.12.0",
-        "combined-stream": "1.0.5",
-        "extend": "3.0.1",
-        "forever-agent": "0.6.1",
-        "form-data": "2.1.4",
-        "har-validator": "4.2.1",
-        "hawk": "3.1.3",
-        "http-signature": "1.1.1",
-        "is-typedarray": "1.0.0",
-        "isstream": "0.1.2",
-        "json-stringify-safe": "5.0.1",
-        "mime-types": "2.1.15",
-        "oauth-sign": "0.8.2",
-        "performance-now": "0.2.0",
-        "qs": "6.4.0",
-        "safe-buffer": "5.1.0",
-        "stringstream": "0.0.5",
-        "tough-cookie": "2.3.2",
-        "tunnel-agent": "0.6.0",
-        "uuid": "3.0.1"
-      }
-    },
-    "require-directory": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
-      "integrity": "sha1-jGStX9MNqxyXbiNE/+f3kqam30I=",
-      "dev": true
-    },
-    "require-main-filename": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-1.0.1.tgz",
-      "integrity": "sha1-l/cXtp1IeE9fUmpsWqj/3aBVpNE=",
-      "dev": true
-    },
-    "resolve": {
-      "version": "1.3.3",
-      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.3.3.tgz",
-      "integrity": "sha1-ZVkHw0aahoDcLeOidaj91paR8OU=",
-      "dev": true,
-      "requires": {
-        "path-parse": "1.0.5"
-      }
-    },
-    "resolve-dir": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/resolve-dir/-/resolve-dir-0.1.1.tgz",
-      "integrity": "sha1-shklmlYC+sXFxJatiUpujMQwJh4=",
-      "dev": true,
-      "requires": {
-        "expand-tilde": "1.2.2",
-        "global-modules": "0.2.3"
-      }
-    },
-    "restore-cursor": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-1.0.1.tgz",
-      "integrity": "sha1-NGYfRohjJ/7SmRR5FSJS35LapUE=",
-      "dev": true,
-      "requires": {
-        "exit-hook": "1.1.1",
-        "onetime": "1.1.0"
-      }
-    },
-    "rimraf": {
-      "version": "2.5.4",
-      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
-      "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ=",
-      "dev": true,
-      "requires": {
-        "glob": "7.0.6"
-      }
-    },
-    "run-async": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/run-async/-/run-async-2.3.0.tgz",
-      "integrity": "sha1-A3GrSuC91yDUFm19/aZP96RFpsA=",
-      "dev": true,
-      "requires": {
-        "is-promise": "2.1.0"
-      }
-    },
-    "rx": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/rx/-/rx-4.1.0.tgz",
-      "integrity": "sha1-pfE/957zt0D+MKqAP7CfmIBdR4I=",
-      "dev": true
-    },
-    "safe-buffer": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.0.tgz",
-      "integrity": "sha512-aSLEDudu6OoRr/2rU609gRmnYboRLxgDG1z9o2Q0os7236FwvcqIOO8r8U5JUEwivZOhDaKlFO4SbPTJYyBEyQ==",
-      "dev": true
-    },
-    "semver": {
-      "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz",
-      "integrity": "sha1-myzl094C0XxgEq0yaqa00M9U+U8=",
-      "dev": true
-    },
-    "sequencify": {
-      "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/sequencify/-/sequencify-0.0.7.tgz",
-      "integrity": "sha1-kM/xnQLgcCf9dn9erT57ldHnOAw=",
-      "dev": true
-    },
-    "set-blocking": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
-      "integrity": "sha1-BF+XgtARrppoA93TgrJDkrPYkPc=",
-      "dev": true
-    },
-    "sigmund": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/sigmund/-/sigmund-1.0.1.tgz",
-      "integrity": "sha1-P/IfGYytIXX587eBhT/ZTQ0ZtZA=",
-      "dev": true
-    },
-    "sntp": {
-      "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz",
-      "integrity": "sha1-ZUEYTMkK7qbG57NeJlkIJEPGYZg=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "hoek": "2.16.3"
-      }
-    },
-    "sparkles": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/sparkles/-/sparkles-1.0.0.tgz",
-      "integrity": "sha1-Gsu/tZJDbRC76PeFt8xvgoFQEsM=",
-      "dev": true
-    },
-    "spawn-sync": {
-      "version": "1.0.15",
-      "resolved": "https://registry.npmjs.org/spawn-sync/-/spawn-sync-1.0.15.tgz",
-      "integrity": "sha1-sAeZVX63+wyDdsKdROih6mfldHY=",
-      "dev": true,
-      "requires": {
-        "concat-stream": "1.6.0",
-        "os-shim": "0.1.3"
-      }
-    },
-    "spdx-correct": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-1.0.2.tgz",
-      "integrity": "sha1-SzBz2TP/UfORLwOsVRlJikFQ20A=",
-      "dev": true,
-      "requires": {
-        "spdx-license-ids": "1.2.2"
-      }
-    },
-    "spdx-expression-parse": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-1.0.4.tgz",
-      "integrity": "sha1-m98vIOH0DtRH++JzJmGR/O1RYmw=",
-      "dev": true
-    },
-    "spdx-license-ids": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-1.2.2.tgz",
-      "integrity": "sha1-yd96NCRZSt5r0RkA1ZZpbcBrrFc=",
-      "dev": true
-    },
-    "sprintf-js": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
-      "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=",
-      "dev": true
-    },
-    "sshpk": {
-      "version": "1.13.1",
-      "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.13.1.tgz",
-      "integrity": "sha1-US322mKHFEMW3EwY/hzx2UBzm+M=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "asn1": "0.2.3",
-        "assert-plus": "1.0.0",
-        "bcrypt-pbkdf": "1.0.1",
-        "dashdash": "1.14.1",
-        "ecc-jsbn": "0.1.1",
-        "getpass": "0.1.7",
-        "jsbn": "0.1.1",
-        "tweetnacl": "0.14.5"
-      },
-      "dependencies": {
-        "assert-plus": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
-          "dev": true,
-          "optional": true
-        }
-      }
-    },
-    "stream-consume": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/stream-consume/-/stream-consume-0.1.0.tgz",
-      "integrity": "sha1-pB6tGm1ggc63n2WwYZAbbY89HQ8=",
-      "dev": true
-    },
-    "string_decoder": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-      "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-      "dev": true,
-      "requires": {
-        "safe-buffer": "5.0.1"
-      },
-      "dependencies": {
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c=",
-          "dev": true
-        }
-      }
-    },
-    "string-width": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
-      "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
-      "dev": true,
-      "requires": {
-        "code-point-at": "1.1.0",
-        "is-fullwidth-code-point": "1.0.0",
-        "strip-ansi": "3.0.1"
-      }
-    },
-    "stringstream": {
-      "version": "0.0.5",
-      "resolved": "https://registry.npmjs.org/stringstream/-/stringstream-0.0.5.tgz",
-      "integrity": "sha1-TkhM1N5aC7vuGORjB3EKioFiGHg=",
-      "dev": true,
-      "optional": true
-    },
-    "strip-ansi": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
-      "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
-      "dev": true,
-      "requires": {
-        "ansi-regex": "2.1.1"
-      }
-    },
-    "strip-bom": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-1.0.0.tgz",
-      "integrity": "sha1-hbiGLzhEtabV7IRnqTWYFzo295Q=",
-      "dev": true,
-      "requires": {
-        "first-chunk-stream": "1.0.0",
-        "is-utf8": "0.2.1"
-      }
-    },
-    "supports-color": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-      "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=",
-      "dev": true
-    },
-    "through": {
-      "version": "2.3.8",
-      "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
-      "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU=",
-      "dev": true
-    },
-    "through2": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/through2/-/through2-2.0.3.tgz",
-      "integrity": "sha1-AARWmzfHx0ujnEPzzteNGtlBQL4=",
-      "dev": true,
-      "requires": {
-        "readable-stream": "2.2.11",
-        "xtend": "4.0.1"
-      }
-    },
-    "tildify": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/tildify/-/tildify-1.2.0.tgz",
-      "integrity": "sha1-3OwD9V3Km3qj5bBPIYF+tW5jWIo=",
-      "dev": true,
-      "requires": {
-        "os-homedir": "1.0.2"
-      }
-    },
-    "time-stamp": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/time-stamp/-/time-stamp-1.1.0.tgz",
-      "integrity": "sha1-dkpaEa9QVhkhsTPztE5hhofg9cM=",
-      "dev": true
-    },
-    "tmp": {
-      "version": "0.0.29",
-      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.29.tgz",
-      "integrity": "sha1-8lEl/w3Z2jzLDC3Tce4SiLuRKMA=",
-      "dev": true,
-      "requires": {
-        "os-tmpdir": "1.0.2"
-      }
-    },
-    "tough-cookie": {
-      "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.2.tgz",
-      "integrity": "sha1-8IH3bkyFcg5sN6X6ztc3FQ2EByo=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "punycode": "1.4.1"
-      }
-    },
-    "tunnel-agent": {
-      "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.6.0.tgz",
-      "integrity": "sha1-J6XeoGs2sEoKmWZ3SykIaPD8QP0=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "safe-buffer": "5.1.0"
-      }
-    },
-    "tweetnacl": {
-      "version": "0.14.5",
-      "resolved": "https://registry.npmjs.org/tweetnacl/-/tweetnacl-0.14.5.tgz",
-      "integrity": "sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q=",
-      "dev": true,
-      "optional": true
-    },
-    "typedarray": {
-      "version": "0.0.6",
-      "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
-      "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=",
-      "dev": true
-    },
-    "unc-path-regex": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/unc-path-regex/-/unc-path-regex-0.1.2.tgz",
-      "integrity": "sha1-5z3T17DXxe2G+6xrCufYxqadUPo=",
-      "dev": true
-    },
-    "unique-stream": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-1.0.0.tgz",
-      "integrity": "sha1-1ZpKdUJ0R9mqbJHnAmP40mpLEEs=",
-      "dev": true
-    },
-    "user-home": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/user-home/-/user-home-1.1.1.tgz",
-      "integrity": "sha1-K1viOjK2Onyd640PKNSFcko98ZA=",
-      "dev": true
-    },
-    "util-deprecate": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
-      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=",
-      "dev": true
-    },
-    "uuid": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.0.1.tgz",
-      "integrity": "sha1-ZUS7ot/ajBzxfmKaOjBeK7H+5sE=",
-      "dev": true,
-      "optional": true
-    },
-    "v8flags": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/v8flags/-/v8flags-2.1.1.tgz",
-      "integrity": "sha1-qrGh+jDUX4jdMhFIh1rALAtV5bQ=",
-      "dev": true,
-      "requires": {
-        "user-home": "1.1.1"
-      }
-    },
-    "validate-npm-package-license": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.1.tgz",
-      "integrity": "sha1-KAS6vnEq0zeUWaz74kdGqywwP7w=",
-      "dev": true,
-      "requires": {
-        "spdx-correct": "1.0.2",
-        "spdx-expression-parse": "1.0.4"
-      }
-    },
-    "validate-npm-package-name": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/validate-npm-package-name/-/validate-npm-package-name-3.0.0.tgz",
-      "integrity": "sha1-X6kS2B630MdK/BQN5zF/DKffQ34=",
-      "dev": true,
-      "requires": {
-        "builtins": "1.0.3"
-      }
-    },
-    "validator": {
-      "version": "5.7.0",
-      "resolved": "https://registry.npmjs.org/validator/-/validator-5.7.0.tgz",
-      "integrity": "sha1-eoelgUa2laxIYHEUHAxJ1n2gXlw=",
-      "dev": true
-    },
-    "verror": {
-      "version": "1.3.6",
-      "resolved": "https://registry.npmjs.org/verror/-/verror-1.3.6.tgz",
-      "integrity": "sha1-z/XfEpRtKX0rqu+qJoniW+AcAFw=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "extsprintf": "1.0.2"
-      }
-    },
-    "vinyl": {
-      "version": "0.5.3",
-      "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.5.3.tgz",
-      "integrity": "sha1-sEVbOPxeDPMNQyUTLkYZcMIJHN4=",
-      "dev": true,
-      "requires": {
-        "clone": "1.0.2",
-        "clone-stats": "0.0.1",
-        "replace-ext": "0.0.1"
-      }
-    },
-    "vinyl-fs": {
-      "version": "0.3.14",
-      "resolved": "https://registry.npmjs.org/vinyl-fs/-/vinyl-fs-0.3.14.tgz",
-      "integrity": "sha1-mmhRzhysHBzqX+hsCTHWIMLPqeY=",
-      "dev": true,
-      "requires": {
-        "defaults": "1.0.3",
-        "glob-stream": "3.1.18",
-        "glob-watcher": "0.0.6",
-        "graceful-fs": "3.0.11",
-        "mkdirp": "0.5.1",
-        "strip-bom": "1.0.0",
-        "through2": "0.6.5",
-        "vinyl": "0.4.6"
-      },
-      "dependencies": {
-        "clone": {
-          "version": "0.2.0",
-          "resolved": "https://registry.npmjs.org/clone/-/clone-0.2.0.tgz",
-          "integrity": "sha1-xhJqkK1Pctv1rNskPMN3JP6T/B8=",
-          "dev": true
-        },
-        "graceful-fs": {
-          "version": "3.0.11",
-          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-3.0.11.tgz",
-          "integrity": "sha1-dhPHeKGv6mLyXGMKCG1/Osu92Bg=",
-          "dev": true,
-          "requires": {
-            "natives": "1.1.0"
-          }
-        },
-        "isarray": {
-          "version": "0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
-          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
-          "dev": true
-        },
-        "readable-stream": {
-          "version": "1.0.34",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
-          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=",
-          "dev": true,
-          "requires": {
-            "core-util-is": "1.0.2",
-            "inherits": "2.0.3",
-            "isarray": "0.0.1",
-            "string_decoder": "0.10.31"
-          }
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
-          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=",
-          "dev": true
-        },
-        "through2": {
-          "version": "0.6.5",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
-          "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg=",
-          "dev": true,
-          "requires": {
-            "readable-stream": "1.0.34",
-            "xtend": "4.0.1"
-          }
-        },
-        "vinyl": {
-          "version": "0.4.6",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.4.6.tgz",
-          "integrity": "sha1-LzVsh6VQolVGHza76ypbqL94SEc=",
-          "dev": true,
-          "requires": {
-            "clone": "0.2.0",
-            "clone-stats": "0.0.1"
-          }
-        }
-      }
-    },
-    "which": {
-      "version": "1.2.14",
-      "resolved": "https://registry.npmjs.org/which/-/which-1.2.14.tgz",
-      "integrity": "sha1-mofEN48D6CfOyvGs31bHNsAcFOU=",
-      "dev": true,
-      "requires": {
-        "isexe": "2.0.0"
-      }
-    },
-    "which-module": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/which-module/-/which-module-1.0.0.tgz",
-      "integrity": "sha1-u6Y8qGGUiZT/MHc2CJ47lgJsKk8=",
-      "dev": true
-    },
-    "wordwrap": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz",
-      "integrity": "sha1-J1hIEIkUVqQXHI0CJkQa3pDLyus=",
-      "dev": true
-    },
-    "wrap-ansi": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
-      "integrity": "sha1-2Pw9KE3QV5T+hJc8rs3Rz4JP3YU=",
-      "dev": true,
-      "requires": {
-        "string-width": "1.0.2",
-        "strip-ansi": "3.0.1"
-      }
-    },
-    "wrappy": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
-      "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=",
-      "dev": true
-    },
-    "xtend": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.1.tgz",
-      "integrity": "sha1-pcbVMr5lbiPbgg77lDofBJmNY68=",
-      "dev": true
-    },
-    "y18n": {
-      "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/y18n/-/y18n-3.2.1.tgz",
-      "integrity": "sha1-bRX7qITAhnnA136I53WegR4H+kE=",
-      "dev": true
-    },
-    "yargs": {
-      "version": "6.6.0",
-      "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz",
-      "integrity": "sha1-eC7CHvQDNF+DCoCMo9UTr1YGUgg=",
-      "dev": true,
-      "requires": {
-        "camelcase": "3.0.0",
-        "cliui": "3.2.0",
-        "decamelize": "1.2.0",
-        "get-caller-file": "1.0.2",
-        "os-locale": "1.4.0",
-        "read-pkg-up": "1.0.1",
-        "require-directory": "2.1.1",
-        "require-main-filename": "1.0.1",
-        "set-blocking": "2.0.0",
-        "string-width": "1.0.2",
-        "which-module": "1.0.0",
-        "y18n": "3.2.1",
-        "yargs-parser": "4.2.1"
-      }
-    },
-    "yargs-parser": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz",
-      "integrity": "sha1-KczqwNxPA8bIe0qfIX3RjJ90hxw=",
-      "dev": true,
-      "requires": {
-        "camelcase": "3.0.0"
-      }
-    },
-    "z-schema": {
-      "version": "3.17.0",
-      "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-3.17.0.tgz",
-      "integrity": "sha1-RCs4+denr3rke/z8NWhz6GFq0bc=",
-      "dev": true,
-      "requires": {
-        "commander": "2.9.0",
-        "lodash.get": "4.4.2",
-        "request": "2.81.0",
-        "validator": "5.7.0"
-      }
-    }
-  }
-}

From f4f9dc61003f76431d100794eb7d61ddfa2c4ab2 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 9 Aug 2017 10:52:04 -0700
Subject: [PATCH 0389/1641]  Dropdown: Support custom widths (#2383)

* Support dropdownWidth

* change file

* Updated docs

* return example to prev state

* Moved width to callout, passed value in from dropdown. added fixed direction hint

* moved position back to styles

* Update Callout.Props.ts

* Update dropdown-width_2017-08-03-16-39.json

* Reduced dropshadow used in dropdown as it was bleeding into input
---
 .../dropdown-width_2017-08-03-16-39.json              | 11 +++++++++++
 .../src/components/Callout/Callout.Props.ts           |  6 ++++++
 .../src/components/Callout/CalloutContent.tsx         | 11 +++++++----
 .../src/components/Dropdown/Dropdown.Props.ts         |  6 ++++++
 .../src/components/Dropdown/Dropdown.scss             |  2 +-
 .../src/components/Dropdown/Dropdown.tsx              |  9 +++++----
 6 files changed, 36 insertions(+), 9 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/dropdown-width_2017-08-03-16-39.json

diff --git a/common/changes/office-ui-fabric-react/dropdown-width_2017-08-03-16-39.json b/common/changes/office-ui-fabric-react/dropdown-width_2017-08-03-16-39.json
new file mode 100644
index 0000000000000..a411bb9030fb4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/dropdown-width_2017-08-03-16-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Callout/Dropdown: Both components now support custom widths",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts b/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
index 3d07c42c77993..728bdab754de9 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
@@ -49,6 +49,12 @@ export interface ICalloutProps extends React.Props<Callout | CalloutContent> {
    */
   beakWidth?: number;
 
+  /**
+   * Custom width for callout including borders. If value is 0, no width is applied.
+   * @default 0
+   */
+  calloutWidth?: number;
+
   /**
    * The background color of the Callout in hex format ie. #ffffff.
    * @default $ms-color-white
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index abfafc10ddf22..06ebdc22ae32e 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -17,7 +17,7 @@ import {
 import { getRelativePositions, IPositionInfo, IPositionProps, getMaxHeight } from '../../utilities/positioning';
 import { Popup } from '../../Popup';
 import * as stylesImport from './Callout.scss';
-import { AnimationClassNames } from '../../Styling';
+import { AnimationClassNames, mergeStyles } from '../../Styling';
 
 const styles: any = stylesImport;
 
@@ -111,6 +111,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       beakStyle,
       children,
       beakWidth,
+      calloutWidth,
       finalHeight,
       backgroundColor } = this.props;
     let { positions } = this.state;
@@ -136,6 +137,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
 
     let contentMaxHeight: number = this._getMaxHeight() + this.state.heightOffset!;
     let beakVisible = isBeakVisible && (!!targetElement || !!target);
+
     let content = (
       <div
         ref={ this._resolveRef('_hostElement') }
@@ -143,12 +145,13 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       >
         <div
           className={
-            css(
+            mergeStyles(
               'ms-Callout',
               styles.root,
               className,
-              directionalClassName
-            ) }
+              directionalClassName,
+              calloutWidth && { width: calloutWidth }
+            ) as string }
           style={ positions ? positions.calloutPosition : OFF_SCREEN_STYLE }
           tabIndex={ -1 } // Safari and Firefox on Mac OS requires this to back-stop click events so focus remains in the Callout.
           // See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
index 1bb131f0b219c..cabdac349251e 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
@@ -30,6 +30,12 @@ export interface IDropdownProps extends ISelectableDroppableTextProps<HTMLDivEle
    */
   onRenderTitle?: IRenderFunction<IDropdownOption | IDropdownOption[]>;
 
+  /**
+   * Custom width for dropdown. If value is 0, width of the input field is used.
+   * @default 0
+   */
+  dropdownWidth?: number;
+
   responsiveMode?: ResponsiveMode;
 
   /**
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
index c3ef234a0f696..279595f90dd67 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
@@ -178,7 +178,7 @@ $DropDown-item-height: 32px;
   }
 
 .callout {
-  box-shadow: 0 0px 5px 0px rgba(0, 0, 0, 0.4);
+  box-shadow: 0 0px 2px 0px rgba(0, 0, 0, 0.2);
   border: 1px solid $ms-color-neutralLight;
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 3ba01ae24e9fa..36e9e79ffa004 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -333,7 +333,8 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     let {
       onRenderList = this._onRenderList,
       responsiveMode,
-      calloutProps
+      calloutProps,
+      dropdownWidth
     } = this.props;
 
     let isSmall = responsiveMode! <= ResponsiveMode.medium;
@@ -354,16 +355,16 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
           isBeakVisible={ false }
           gapSpace={ 0 }
           doNotLayer={ false }
+          directionalHintFixed={ true }
           directionalHint={ DirectionalHint.bottomLeftEdge }
           { ...calloutProps }
           className={ css('ms-Dropdown-callout', styles.callout, calloutProps ? calloutProps.className : undefined) }
           targetElement={ this._dropDown }
           onDismiss={ this._onDismiss }
           onPositioned={ this._onPositioned }
+          calloutWidth={ dropdownWidth || this._dropDown.clientWidth }
         >
-          <div style={ { width: this._dropDown.clientWidth - 2 } }>
-            { onRenderList(props, this._onRenderList) }
-          </div>
+          { onRenderList(props, this._onRenderList) }
         </Callout>
     );
   }

From 16591f25f5ee2502e13e2ba1d764b4198e04d8ee Mon Sep 17 00:00:00 2001
From: John Miller <rubixws@gmail.com>
Date: Wed, 9 Aug 2017 10:57:38 -0700
Subject: [PATCH 0390/1641] Fabric Website Build Fixes (#2385)

* Updated the JSON imports to not use the !json flag
Added webpack-dev-server to the site

* Updated website host path

* Adding new serve config

* Adding change file

* Updating Readme

* Updating package lock and rush

* Reverting typescript version

* Removing tslint

* Remvoing package-lock

* shrinkwrap

* Fixing build errors
---
 apps/fabric-website/README.md                 |   43 +-
 apps/fabric-website/gulpfile.js               |   48 +-
 apps/fabric-website/index.html                |    2 +-
 apps/fabric-website/package.json              |   39 +-
 .../components/DONavigation/DONavigation.tsx  |    2 +-
 .../src/pages/BlogPage/BlogPage.tsx           |    2 +-
 .../src/pages/BlogPage/BlogPost.tsx           |    2 +-
 .../src/pages/HomePage/HomePage.tsx           |    2 +-
 .../Styles/AnimationsPage/AnimationsPage.tsx  |    2 +-
 .../Styles/BrandIconsPage/BrandIconsPage.tsx  |   10 +-
 .../pages/Styles/ColorsPage/ColorsPage.tsx    |    8 +-
 .../src/pages/Styles/IconsPage/IconsPage.tsx  |    2 +-
 .../pages/Styles/LayoutPage/LayoutPage.tsx    |    4 +-
 .../LocalizationPage/LocalizationPage.tsx     |    4 +-
 .../Styles/TypographyPage/TypographyPage.tsx  |    6 +-
 .../Styles/UtilitiesPage/UtilitiesPage.tsx    |    2 +-
 apps/fabric-website/webpack.serve.config.js   |   92 +
 apps/fabric-website/webpack.site.config.js    |    3 +
 ...ebsite-build-updates_2017-08-03-17-56.json |   11 +
 common/config/rush/npm-shrinkwrap.json        | 1737 ++++++++++++-----
 20 files changed, 1438 insertions(+), 583 deletions(-)
 create mode 100644 apps/fabric-website/webpack.serve.config.js
 create mode 100644 common/changes/@uifabric/fabric-website/miljo-website-build-updates_2017-08-03-17-56.json

diff --git a/apps/fabric-website/README.md b/apps/fabric-website/README.md
index c59fab37bf310..fec997e67b9d3 100644
--- a/apps/fabric-website/README.md
+++ b/apps/fabric-website/README.md
@@ -9,51 +9,18 @@ Office UI Fabric is a collection of projects that represent the Office and Offic
 Before you get started, make sure you have [node.js](https://nodejs.org/), [gulp](http://gulpjs.com/), and [git](https://git-scm.com/) installed. To view the documentation including examples, contracts, current statuses, and to add functionality or fix issues locally, you can:
 
 1. `git clone https://github.com/OfficeDev/office-ui-fabric-react.git` - this is the [Office UI Fabric React project](https://github.com/OfficeDev/office-ui-fabric-react) which you will want to name *office-ui-fabric-react*
-2. `npm install` the Fabric React project you just cloned in the previous step
-3. `gulp serve` the Fabric React project
-4. Stop the local web server
-5. `git clone https://onedrive.visualstudio.com/DefaultCollection/Design/_git/fabric-website` (the Fabric website project) into a sibling directory to the *office-ui-fabric-react* folder you just created and cloned Fabric React into
-6. `npm install` from within the Fabric website folder you created in the previous step
-7. `npm link ../office-ui-fabric-react` This tells NPM to use your local build of Fabric React instead of the regular copy where the link is to the project you cloned in step **1**
-8. `gulp serve`
-
-This will open a web browser with the home page. You can make changes to the code which will automatically build and refresh the page using live-reload.
-
-## Deploy the website
-
-1. Git checkout the `master` branch of this project.
-2. Update the version number for this release at the top of `package.json`
- - To determine the new version number, review the merged pull requests since the last release and follow [semantic versioning](http://semver.org).
- - The new version will almost always be a minor increment. E.g. 4.1.0 becomes 4.2.0
-3. Update the dependencies for Fabric Core and Fabric React in `package.json`
- - This will ensure that the site itself is built with the latest versions of Fabric.
- - View the [Fabric Core releases](https://github.com/OfficeDev/office-ui-fabric-core/releases) and [Fabric React releases](https://github.com/OfficeDev/office-ui-fabric-react/releases) to determine the version numbers of the latest releases.
-4. Update the home page (`src/pages/HomePage/HomePage.tsx`) to show the latest releases under the "Get Started" button.
-5. Navigate to the sibling office-ui-fabric-react project (see build instructions above), which is used as the source of component pages.
-6. Git checkout the commit of Fabric React that is tagged with the latest release.
-7. Run `gulp nuke` and `npm install`, followed by `gulp serve`. Verify that the Fabric React project is building correctly and works.
-8. Navigate back over to the Fabric Website folder.
-9. Run `gulp nuke` and `npm install`, followed by `gulp serve` to build the site locally. Test all pages and functionality to ensure it is working as expected.
-10. Git checkout a new branch (you should still be on `master`) named something like `[alias]/[new-version-number]-changes`. Make a commit that includes your changes to `package.json` and `HomePage.tsx`. Push this to VSTS.
-11. Run `gulp deploy` to deploy a test build of the website. Once again, test the website to ensure it is working as expected.
-12. Create a pull request in VSTS, merging the branch (e.g. `miwhea/4.2.0-changes`) into `master`.
-13. Once it is approved and merged, the `master` branch is now ready for release.
-14. Git checkout the `deploy` branch of the Fabric Website.
-15. Git checkout a new release branch named in the form `release/[new-version-number]`.
-16. Merge the latest commits from `master` into this new branch you created.
- - Make sure to use the CDN for images and scripts.
-17. Run `gulp serve` to build and test the site locally.
-18. Log in via FTP (credentials are in our team's OneNote) and replace the current files with `index.html`, `dist/` and `images/`.
-19. You've deployed the website! Test the live site one final time (and ask others to do the same) to be sure there are no unexpected issues.
+2. `npm install` the Fabric React project you just cloned in the previous step.
+3. In the command prompt change directories to the fabric-website director in apps `cd apps/fabric-website/`.
+4. Then to start the website run `npm start`. This will open your operating system's default web browser with the website. You can make changes to the code which will automatically build and refresh the page using live-reload.
 
 **Note**: Were any steps missing? Could the instructions be made clearer for the next person? Update the instructions above and submit a pull request!
 
 ## Licenses
 
-All files on the Office UI Fabric React GitHub repository are subject to the MIT license. Please read the License file at the root of the project. 
+All files on the Office UI Fabric React GitHub repository are subject to the MIT license. Please read the License file at the root of the project.
 
 Usage of the fonts referenced in Office UI Fabric files is subject to the [license](https://spoprod-a.akamaihd.net/files/fabric/assets/license.txt).
 
-- - - 
+- - -
 
 This project has adopted the [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/). For more information see the [Code of Conduct FAQ](https://opensource.microsoft.com/codeofconduct/faq/) or contact [opencode@microsoft.com](mailto:opencode@microsoft.com) with any additional questions or comments.
\ No newline at end of file
diff --git a/apps/fabric-website/gulpfile.js b/apps/fabric-website/gulpfile.js
index 8bd68033321ee..6ff514edd48bb 100644
--- a/apps/fabric-website/gulpfile.js
+++ b/apps/fabric-website/gulpfile.js
@@ -22,39 +22,49 @@ let rules = Object.assign(
   require('./node_modules/office-ui-fabric-react-tslint/tslint.json').rules,
   require('./tslint.json').rules
 );
-build.tslint.setConfig({
-  lintConfig: { rules },
-  displayAsWarning: false
-});
-
-// TODO: remove this! There are a number of lint errors to fix.
-build.tslint.isEnabled = () => false;
-
-build.webpack.isEnabled = () => isProduction;
 
 // Configure TypeScript.
 build.TypeScriptConfiguration.setTypescriptCompiler(require('typescript'));
+// Use css modules.
+build.sass.setConfig({
+  useCSSModules: true,
+  moduleExportName: ''
+});
+
+// Use Karma Tests - Disable during develoment if prefered
+build.karma.isEnabled = () => false;
 
-build.text.setConfig({ textMatch: ['src/**/*.txt', 'src/**/*.Example.tsx', 'src/**/*.Props.ts'] });
+// Disable unnecessary subtasks.
+build.preCopy.isEnabled = () => false;
 
+//Disable tslint
+build.tslint.isEnabled = () => false;
+
+// Copy fabric-core to dist to be published with fabric-react.
 build.postCopy.setConfig({
+  shouldFlatten: false,
   copyTo: {
-    [distFolder]: [
-      'src/**/*.png',
-      'node_modules/office-ui-fabric-core/dist/css/**/*'
+    [path.join(distFolder, 'sass')]: [
+      'node_modules/office-ui-fabric-core/dist/sass/**/*.*'
+    ],
+    [path.join(distFolder, 'css')]: [
+      'node_modules/office-ui-fabric-core/dist/css/**/*.*'
     ]
   }
 });
 
-// process *.Example.tsx as text.
-build.text.setConfig({ textMatch: ['src/**/*.txt', 'src/**/*.Example.tsx', 'src/**/*.Props.ts'] });
+// Produce AMD bits in lib-amd on production builds.
+if (isProduction || isNuke) {
+  build.setConfig({
+    libAMDFolder: path.join(packageFolder, 'lib-amd')
+  });
+}
 
+// Short aliases for subtasks.
 build.task('webpack', build.webpack);
 build.task('tslint', build.tslint);
 build.task('ts', build.typescript);
-
-// Use Karma Tests - Disable during develoment if prefered, turned off for now
-build.karma.isEnabled = () => false;
+build.task('sass', build.sass);
 
 // initialize tasks.
-build.initialize(gulp);
+build.initialize(gulp);
\ No newline at end of file
diff --git a/apps/fabric-website/index.html b/apps/fabric-website/index.html
index 9d9079489db5a..84aec05a78105 100644
--- a/apps/fabric-website/index.html
+++ b/apps/fabric-website/index.html
@@ -94,7 +94,7 @@
 
     if (isLocal) {
       scripts.push.apply(scripts, reactDevelopment);
-      scripts.push('/dist/fabric-site.js');
+      scripts.push('fabric-website.js');
     } else if (isDogfood) {
       if (noCompress) {
         scripts.push.apply(scripts, reactDevelopment);
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index c18a96acab4b4..de0c703bba103 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -9,9 +9,10 @@
     "url": "https://github.com/OfficeDev/office-ui-fabric-react"
   },
   "scripts": {
-    "build": "gulp --production",
+    "build": "gulp",
     "clean": "gulp clean",
-    "start": "gulp serve"
+    "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.serve.config.js --open",
+    "production": "gulp --production"
   },
   "license": "MIT",
   "devDependencies": {
@@ -21,30 +22,50 @@
     "@types/enzyme": "2.8.0",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "2.2.39",
+    "@types/prop-types": "15.5.1",
+    "@types/resemblejs": "~1.3.28",
+    "@types/sinon": "2.2.2",
     "@types/react": "15.0.38",
     "@types/react-addons-test-utils": "0.14.19",
     "@types/react-dom": "15.5.1",
     "@types/webpack-env": "1.13.0",
+    "@uifabric/example-app-base": "4.1.1",
+    "autoprefixer": "^6.7.6",
+    "chai": "^3.5.0",
+    "css-loader": "^0.28.0",
+    "enzyme": "^2.7.0",
     "es6-promise": "^4.1.0",
+    "es6-weak-map": "^2.0.2",
     "git-rev": "0.2.1",
     "gulp": "~3.9.1",
-    "gulp-debug": "3.1.0",
+    "gulp-phantomcss": "~0.3.0",
     "gulp-prompt": "^0.2.0",
     "gulp-util": "3.0.8",
     "gutil": "1.6.4",
-    "highlight.js": "9.11.0",
-    "mocha": "~3.3.0",
+    "highlight.js": "^9.6.0",
+    "load-themed-styles-loader": "^0.0.3",
+    "mocha": "^3.2.0",
+    "mocha-loader": "^1.1.1",
+    "node-sass": "^4.5.0",
+    "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
-    "orchestrator": "^0.3.7",
+    "postcss-loader": "^1.3.3",
+    "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
     "react-dom": "^15.4.2",
     "react-highlight": "0.9.0",
-    "request": "^2.81.0",
+    "resemblejs": "~2.2.3",
+    "sass-loader": "^6.0.3",
+    "sinon": "^2.3.2",
     "source-map-loader": "0.2.1",
+    "ts-loader": "^2.0.1",
     "typescript": "2.4.2",
-    "vinyl-ftp": "0.6.0",
-    "webpack-bundle-analyzer": "^2.2.1"
+    "webpack": "^3.5.1",
+    "webpack-bundle-analyzer": "^2.2.1",
+    "webpack-dev-server": "^2.4.1",
+    "webpack-notifier": "^1.5.0",
+    "webpack-split-by-path": "2.0.0"
   },
   "dependencies": {
     "@uifabric/example-app-base": ">=4.2.0 <5.0.0",
diff --git a/apps/fabric-website/src/components/DONavigation/DONavigation.tsx b/apps/fabric-website/src/components/DONavigation/DONavigation.tsx
index 8f44764787421..fe3b532c45086 100644
--- a/apps/fabric-website/src/components/DONavigation/DONavigation.tsx
+++ b/apps/fabric-website/src/components/DONavigation/DONavigation.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { DOSearchBox } from '../DOSearchBox/DOSearchBox';
 import { DONavigationLink } from './DONavigationLink';
 import './DONavigation.scss';
-const links = require('json!../../data/DONavigationLinkData.json');
+const links = require('../../data/DONavigationLinkData.json');
 
 export interface IDONavigationProps {
 }
diff --git a/apps/fabric-website/src/pages/BlogPage/BlogPage.tsx b/apps/fabric-website/src/pages/BlogPage/BlogPage.tsx
index 741c92068d675..77c1f902059c9 100644
--- a/apps/fabric-website/src/pages/BlogPage/BlogPage.tsx
+++ b/apps/fabric-website/src/pages/BlogPage/BlogPage.tsx
@@ -4,7 +4,7 @@ import { BlogItem } from './BlogItem';
 import * as stylesImport from './BlogPage.module.scss';
 const styles: any = stylesImport;
 
-const blogData = require('json!../../data/blog-posts.json');
+const blogData = require('../../data/blog-posts.json');
 
 export class BlogPage extends React.Component<any, any> {
   public render() {
diff --git a/apps/fabric-website/src/pages/BlogPage/BlogPost.tsx b/apps/fabric-website/src/pages/BlogPage/BlogPost.tsx
index 0437ed938845d..ed0db97adf6b5 100644
--- a/apps/fabric-website/src/pages/BlogPage/BlogPost.tsx
+++ b/apps/fabric-website/src/pages/BlogPage/BlogPost.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import './BlogPost.scss';
 
-const blogData = require('json!../../data/blog-posts.json');
+const blogData = require('../../data/blog-posts.json');
 
 export class BlogPost extends React.Component<{}, {}> {
   private _postId: string;
diff --git a/apps/fabric-website/src/pages/HomePage/HomePage.tsx b/apps/fabric-website/src/pages/HomePage/HomePage.tsx
index 59c14f153bc50..ef78accc2db11 100644
--- a/apps/fabric-website/src/pages/HomePage/HomePage.tsx
+++ b/apps/fabric-website/src/pages/HomePage/HomePage.tsx
@@ -3,7 +3,7 @@ import { css } from 'office-ui-fabric-react/lib/Utilities';
 import * as stylesImport from './HomePage.module.scss';
 const styles: any = stylesImport;
 
-const packageData = require('json!../../../package.json');
+const packageData = require('../../../package.json');
 
 export class HomePage extends React.Component<any, any> {
   public render() {
diff --git a/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.tsx b/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.tsx
index 29a2e7432e33c..90ef871c5f8ff 100644
--- a/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.tsx
@@ -4,7 +4,7 @@ import { PageHeader } from '../../../components/PageHeader/PageHeader';
 import { Table } from '../../../components/Table/Table';
 
 const pageStyles: any = require('../../PageStyles.module.scss');
-const animationsData = require('json!../../../data/animations.json');
+const animationsData = require('../../../data/animations.json');
 
 export class AnimationsPage extends React.Component<any, any> {
   public render() {
diff --git a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
index a4395dfc5e5e7..209737addb257 100644
--- a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
@@ -7,11 +7,11 @@ import * as stylesImport from './BrandIconsPage.module.scss';
 const styles: any = stylesImport;
 const pageStyles: any = require('../../PageStyles.module.scss');
 
-const svgResolutionData = require('json!../../../data/brand-icons-svg-resolutions.json');
-const pngResolutionData = require('json!../../../data/brand-icons-png-resolutions.json');
-const productIconsData = require('json!../../../data/brand-icons-products.json');
-const documentIconsData = require('json!../../../data/brand-icons-documents.json');
-const monochromeIconsData = require('json!../../../data/brand-icons-monochrome.json');
+const svgResolutionData = require('../../../data/brand-icons-svg-resolutions.json');
+const pngResolutionData = require('../../../data/brand-icons-png-resolutions.json');
+const productIconsData = require('../../../data/brand-icons-products.json');
+const documentIconsData = require('../../../data/brand-icons-documents.json');
+const monochromeIconsData = require('../../../data/brand-icons-monochrome.json');
 
 export class BrandIconsPage extends React.Component<any, any> {
   public render() {
diff --git a/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx b/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
index 9303d8fa1a84c..2331b35983e76 100644
--- a/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
@@ -7,10 +7,10 @@ const styles: any = stylesImport;
 const pageStyles: any = require('../../PageStyles.module.scss');
 import { baseURL } from '../../../appConfig';
 
-const accentColorsData = require('json!../../../data/colors-accent.json');
-const colorClassesData = require('json!../../../data/colors-classes.json');
-const neutralColorsData = require('json!../../../data/colors-neutral.json');
-const themeColorsData = require('json!../../../data/colors-theme.json');
+const accentColorsData = require('../../../data/colors-accent.json');
+const colorClassesData = require('../../../data/colors-classes.json');
+const neutralColorsData = require('../../../data/colors-neutral.json');
+const themeColorsData = require('../../../data/colors-theme.json');
 
 export class ColorsPage extends React.Component<any, any> {
   public render() {
diff --git a/apps/fabric-website/src/pages/Styles/IconsPage/IconsPage.tsx b/apps/fabric-website/src/pages/Styles/IconsPage/IconsPage.tsx
index 3c4f9318ef179..db381f5941a54 100644
--- a/apps/fabric-website/src/pages/Styles/IconsPage/IconsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/IconsPage/IconsPage.tsx
@@ -4,7 +4,7 @@ import { IconGrid } from '../../../components/IconGrid/IconGrid';
 import { PageHeader } from '../../../components/PageHeader/PageHeader';
 const pageStyles: any = require('../../PageStyles.module.scss');
 
-const iconData = require('json!../../../../node_modules/office-ui-fabric-core/src/data/icons.json');
+const iconData = require('../../../../node_modules/office-ui-fabric-core/src/data/icons.json');
 
 export class IconsPage extends React.Component<any, any> {
   public render() {
diff --git a/apps/fabric-website/src/pages/Styles/LayoutPage/LayoutPage.tsx b/apps/fabric-website/src/pages/Styles/LayoutPage/LayoutPage.tsx
index ca6a76c3cc89f..6dc98538bec6c 100644
--- a/apps/fabric-website/src/pages/Styles/LayoutPage/LayoutPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/LayoutPage/LayoutPage.tsx
@@ -6,8 +6,8 @@ import * as stylesImport from './LayoutPage.module.scss';
 const styles: any = stylesImport;
 const pageStyles: any = require('../../PageStyles.module.scss');
 
-const visibilityData = require('json!../../../data/layout-visibility.json');
-const breakpointsData = require('json!../../../data/responsive-breakpoints.json');
+const visibilityData = require('../../../data/layout-visibility.json');
+const breakpointsData = require('../../../data/responsive-breakpoints.json');
 
 export class LayoutPage extends React.Component<any, any> {
   public render() {
diff --git a/apps/fabric-website/src/pages/Styles/LocalizationPage/LocalizationPage.tsx b/apps/fabric-website/src/pages/Styles/LocalizationPage/LocalizationPage.tsx
index ebd5736b3a17a..0ea0050da726c 100644
--- a/apps/fabric-website/src/pages/Styles/LocalizationPage/LocalizationPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/LocalizationPage/LocalizationPage.tsx
@@ -6,8 +6,8 @@ const pageStyles: any = require('../../PageStyles.module.scss');
 import * as stylesImport from './LocalizationPage.module.scss';
 const styles: any = stylesImport;
 
-const directionalIconsData = require('json!../../../data/directional-icons.json');
-const localizedFontsData = require('json!../../../data/localized-fonts.json');
+const directionalIconsData = require('../../../data/directional-icons.json');
+const localizedFontsData = require('../../../data/localized-fonts.json');
 
 export class LocalizationPage extends React.Component<any, any> {
   public render() {
diff --git a/apps/fabric-website/src/pages/Styles/TypographyPage/TypographyPage.tsx b/apps/fabric-website/src/pages/Styles/TypographyPage/TypographyPage.tsx
index 640a5679b7686..940cf899637be 100644
--- a/apps/fabric-website/src/pages/Styles/TypographyPage/TypographyPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/TypographyPage/TypographyPage.tsx
@@ -3,9 +3,9 @@ import { PageHeader } from '../../../components/PageHeader/PageHeader';
 import { Table } from '../../../components/Table/Table';
 const pageStyles: any = require('../../PageStyles.module.scss');
 
-const typeRampData = require('json!../../../data/type-ramp.json');
-const typeSizeData = require('json!../../../data/type-sizes.json');
-const typeWeightData = require('json!../../../data/type-weights.json');
+const typeRampData = require('../../../data/type-ramp.json');
+const typeSizeData = require('../../../data/type-sizes.json');
+const typeWeightData = require('../../../data/type-weights.json');
 
 export class TypographyPage extends React.Component<any, any> {
   public render() {
diff --git a/apps/fabric-website/src/pages/Styles/UtilitiesPage/UtilitiesPage.tsx b/apps/fabric-website/src/pages/Styles/UtilitiesPage/UtilitiesPage.tsx
index 7aaee23a3a4ac..4965ec904c25f 100644
--- a/apps/fabric-website/src/pages/Styles/UtilitiesPage/UtilitiesPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/UtilitiesPage/UtilitiesPage.tsx
@@ -3,7 +3,7 @@ import { PageHeader } from '../../../components/PageHeader/PageHeader';
 import { Table } from '../../../components/Table/Table';
 const pageStyles: any = require('../../PageStyles.module.scss');
 
-const utilitiesData = require('json!../../../data/utilities.json');
+const utilitiesData = require('../../../data/utilities.json');
 
 export class UtilitiesPage extends React.Component<any, any> {
   public render() {
diff --git a/apps/fabric-website/webpack.serve.config.js b/apps/fabric-website/webpack.serve.config.js
new file mode 100644
index 0000000000000..6863e63b858f4
--- /dev/null
+++ b/apps/fabric-website/webpack.serve.config.js
@@ -0,0 +1,92 @@
+let path = require('path');
+let webpack = require('webpack');
+let WebpackNotifierPlugin = require('webpack-notifier');
+
+const PACKAGE_NAME = require('./package.json').name;
+
+module.exports = {
+  entry: './src/root.tsx',
+
+  output: {
+    filename: 'fabric-website.js',
+  },
+
+  externals: {
+    'react': 'React',
+    'react-dom': 'ReactDOM'
+  },
+
+  resolve: {
+    alias: {
+      'office-ui-fabric-react/src': path.join(__dirname, 'node_modules/office-ui-fabric-react/src'),
+      'office-ui-fabric-react/lib': path.join(__dirname, 'node_modules/office-ui-fabric-react/lib'),
+      'Props.ts.js': 'Props',
+      'Example.tsx.js': 'Example'
+    },
+    extensions: ['.ts', '.tsx', '.js']
+  },
+
+  devtool: 'source-map',
+
+  devServer: {
+    inline: true,
+    port: 4321
+  },
+  preLoaders: [
+    { test: /\.json$/, loader: 'json' },
+  ],
+  module: {
+    loaders: [
+      {
+        test: [/\.tsx?$/],
+        loader: 'ts-loader',
+        exclude: [
+          /node_modules/,
+          /\.scss.ts$/
+        ]
+      },
+      {
+        test: /\.scss$/,
+        enforce: 'pre',
+        exclude: [
+          /node_modules/
+        ],
+        use: [
+          {
+            loader: "load-themed-styles-loader", // creates style nodes from JS strings
+          },
+          {
+            loader: "css-loader", // translates CSS into CommonJS
+            options: {
+              modules: true,
+              importLoaders: 2,
+              localIdentName: '[name]_[local]_[hash:base64:5]',
+              minimize: false
+            }
+          },
+          {
+            loader: 'postcss-loader',
+
+            options: {
+              plugins: function () {
+                return [
+                  require('autoprefixer')
+                ];
+              }
+            }
+          },
+          {
+            loader: "sass-loader",
+          }
+        ]
+      }
+    ]
+  },
+
+  plugins: [
+    new webpack.DefinePlugin({
+      'process.env.NODE_ENV': JSON.stringify('production')
+    }),
+    new WebpackNotifierPlugin()
+  ]
+}
diff --git a/apps/fabric-website/webpack.site.config.js b/apps/fabric-website/webpack.site.config.js
index d1771b04d0715..644a40d493a42 100644
--- a/apps/fabric-website/webpack.site.config.js
+++ b/apps/fabric-website/webpack.site.config.js
@@ -69,6 +69,9 @@ function createConfig(isProduction, publicPath) {
 
     module: {
       noParse: [/autoit.js/],
+      preLoaders: [
+        { test: /\.json$/, loader: 'json' },
+      ],
       loaders: [
         {
           test: /\.js$/,
diff --git a/common/changes/@uifabric/fabric-website/miljo-website-build-updates_2017-08-03-17-56.json b/common/changes/@uifabric/fabric-website/miljo-website-build-updates_2017-08-03-17-56.json
new file mode 100644
index 0000000000000..93a177e1fe0db
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/miljo-website-build-updates_2017-08-03-17-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Updated fabric build system to use webpack dev server, removed the explicit !json loader in require statements.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "miljo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index e283fc06537af..0b1b25ad8c185 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -240,9 +240,9 @@
       }
     },
     "@microsoft/load-themed-styles": {
-      "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.5.1.tgz",
-      "integrity": "sha1-vJGW0ezlqXkP3ZmUuSRDJpo5dMc="
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.6.0.tgz",
+      "integrity": "sha1-/DziSXPvtyivjpLe058fF7pxi9Y="
     },
     "@microsoft/loader-cased-file": {
       "version": "1.0.1",
@@ -451,14 +451,14 @@
           "integrity": "sha1-eV4lzrR/e6uyY9FRr77dktGOagc="
         },
         "express": {
-          "version": "4.15.3",
-          "resolved": "https://registry.npmjs.org/express/-/express-4.15.3.tgz",
-          "integrity": "sha1-urZdDwOqgMNYQIly/HAPkWlEtmI=",
+          "version": "4.15.4",
+          "resolved": "https://registry.npmjs.org/express/-/express-4.15.4.tgz",
+          "integrity": "sha1-Ay4iU0ic+PzgJma+yj0R7XotrtE=",
           "dependencies": {
             "debug": {
-              "version": "2.6.7",
-              "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.7.tgz",
-              "integrity": "sha1-krrR9tBbu2u6Isyoi80OyJTChh4="
+              "version": "2.6.8",
+              "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
+              "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
             },
             "etag": {
               "version": "1.8.0",
@@ -466,9 +466,9 @@
               "integrity": "sha1-b2Ma7zNtbEY2K1F2QETOIWvjwFE="
             },
             "finalhandler": {
-              "version": "1.0.3",
-              "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.3.tgz",
-              "integrity": "sha1-70fneVDpmXgOhgIqVg4yF+DQzIk="
+              "version": "1.0.4",
+              "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.4.tgz",
+              "integrity": "sha512-16l/r8RgzlXKmFOhZpHBztvye+lAhC5SU7hXavnerC9UfZqZxxXl3BzL8MhffPT3kF61lj9Oav2LKEzh0ei7tg=="
             },
             "fresh": {
               "version": "0.5.0",
@@ -476,16 +476,9 @@
               "integrity": "sha1-9HTKXmqSRtb9jglTz6m5yAWvp44="
             },
             "http-errors": {
-              "version": "1.6.1",
-              "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.1.tgz",
-              "integrity": "sha1-X4uO2YrKVFZWv1cplzh/kEpyIlc=",
-              "dependencies": {
-                "depd": {
-                  "version": "1.1.0",
-                  "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.0.tgz",
-                  "integrity": "sha1-4b2Cxqq2ztlluXuIsX7T5SjKGMM="
-                }
-              }
+              "version": "1.6.2",
+              "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.2.tgz",
+              "integrity": "sha1-CgAsyFcHGSp+eUbO7cERVfYOxzY="
             },
             "ms": {
               "version": "2.0.0",
@@ -498,14 +491,14 @@
               "integrity": "sha1-9JvmtIeJTdxA3MlKMi9hEJLgDV4="
             },
             "send": {
-              "version": "0.15.3",
-              "resolved": "https://registry.npmjs.org/send/-/send-0.15.3.tgz",
-              "integrity": "sha1-UBP5+ZAj31DRvZiSwZ4979HVMwk="
+              "version": "0.15.4",
+              "resolved": "https://registry.npmjs.org/send/-/send-0.15.4.tgz",
+              "integrity": "sha1-mF+qPihLAnPHkzZKNcZze9k5Bbk="
             },
             "serve-static": {
-              "version": "1.12.3",
-              "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.12.3.tgz",
-              "integrity": "sha1-n0uhni8wMMVH+K+ZEHg47DjVseI="
+              "version": "1.12.4",
+              "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.12.4.tgz",
+              "integrity": "sha1-m2qpjutyU8Tu3Ewfb9vKYJkBqWE="
             },
             "statuses": {
               "version": "1.3.1",
@@ -549,6 +542,11 @@
           "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz",
           "integrity": "sha1-sEDrCSOWivq/jTL7HxfxFn/auQc="
         },
+        "qs": {
+          "version": "6.5.0",
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.5.0.tgz",
+          "integrity": "sha512-fjVFjW9yhqMhVGwRExCXLhJKrLlkYSaxNWdyc9rmHlrVZbk35YHH312dFd7191uQeXkI3mKLZTIbSvIeFwFemg=="
+        },
         "range-parser": {
           "version": "1.0.3",
           "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.0.3.tgz",
@@ -845,29 +843,73 @@
       "integrity": "sha1-fmBfGON9Pa9hQXd+zTLu34g4/ts="
     },
     "@microsoft/web-library-build": {
-      "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/@microsoft/web-library-build/-/web-library-build-3.2.1.tgz",
-      "integrity": "sha1-pHzwmHWUUKnExeo7n3ZSwJ1pp+Y=",
+      "version": "3.2.4",
+      "resolved": "https://registry.npmjs.org/@microsoft/web-library-build/-/web-library-build-3.2.4.tgz",
+      "integrity": "sha1-NmY+/vI2VsAHw6WSiV1eI32egXM=",
       "dependencies": {
+        "@microsoft/gulp-core-build": {
+          "version": "2.8.0",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.8.0.tgz",
+          "integrity": "sha1-4ZNBbueB7ZcgwvYOCZRfh5x0kgo="
+        },
         "@microsoft/gulp-core-build-karma": {
-          "version": "2.3.2",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-karma/-/gulp-core-build-karma-2.3.2.tgz",
-          "integrity": "sha1-7FSGE/FZgGVYzrLSLnZ4Ng4eCY8="
+          "version": "2.3.4",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-karma/-/gulp-core-build-karma-2.3.4.tgz",
+          "integrity": "sha1-hyW4gytHFETH16DkxSOtRjqYIVM="
         },
         "@microsoft/gulp-core-build-sass": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.2.3.tgz",
-          "integrity": "sha1-v9N28057coiLtpfcz7XstDgeuDY="
+          "version": "3.2.4",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.2.4.tgz",
+          "integrity": "sha1-QsJ2WR5xG6+dGDhZ7aTqv04vaSo="
         },
         "@microsoft/gulp-core-build-serve": {
           "version": "2.1.5",
           "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-serve/-/gulp-core-build-serve-2.1.5.tgz",
-          "integrity": "sha1-oNH517yG4lnBv8U1mLfDDZavPgs="
+          "integrity": "sha1-oNH517yG4lnBv8U1mLfDDZavPgs=",
+          "dependencies": {
+            "@microsoft/gulp-core-build": {
+              "version": "2.7.2",
+              "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.7.2.tgz",
+              "integrity": "sha1-wmouduFjUWQVpmgScsjY8UNqInM="
+            },
+            "@types/semver": {
+              "version": "5.3.31",
+              "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.31.tgz",
+              "integrity": "sha1-uZnX2TX0P1IHsBsA094ghS9Mp18="
+            }
+          }
         },
         "@microsoft/gulp-core-build-webpack": {
           "version": "1.2.2",
           "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-webpack/-/gulp-core-build-webpack-1.2.2.tgz",
-          "integrity": "sha1-DEER3hfzc9RTNtOCftuKngnVRjU="
+          "integrity": "sha1-DEER3hfzc9RTNtOCftuKngnVRjU=",
+          "dependencies": {
+            "@microsoft/gulp-core-build": {
+              "version": "2.7.2",
+              "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.7.2.tgz",
+              "integrity": "sha1-wmouduFjUWQVpmgScsjY8UNqInM="
+            },
+            "@types/semver": {
+              "version": "5.3.31",
+              "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.31.tgz",
+              "integrity": "sha1-uZnX2TX0P1IHsBsA094ghS9Mp18="
+            }
+          }
+        },
+        "@types/chai": {
+          "version": "3.4.34",
+          "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz",
+          "integrity": "sha1-1TNXkoI7sJzd1eOMPSEbcJGDhU0="
+        },
+        "@types/mocha": {
+          "version": "2.2.38",
+          "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz",
+          "integrity": "sha1-jBiPbjTC58Px0BJ9kI1aNuWmDck="
+        },
+        "@types/semver": {
+          "version": "5.3.33",
+          "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.33.tgz",
+          "integrity": "sha512-UwrBgjsRS8BSsckIEdrAhIAmdh0MJidtKTvD3S6tpMq6qHLY3uGaNYcRDUjPxpF4hOAOEbMNSXhhfxmNHB1QNQ=="
         },
         "autoprefixer": {
           "version": "6.3.7",
@@ -899,11 +941,6 @@
           "resolved": "https://registry.npmjs.org/diff/-/diff-3.2.0.tgz",
           "integrity": "sha1-yc45Okt8vQsFinJck98pkCeGj/k="
         },
-        "glob": {
-          "version": "7.1.1",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz",
-          "integrity": "sha1-gFIR3wT6rxxjo2ADBs31reULLsg="
-        },
         "interpret": {
           "version": "0.6.6",
           "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz",
@@ -934,7 +971,14 @@
         "mocha": {
           "version": "3.4.2",
           "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.4.2.tgz",
-          "integrity": "sha1-0O9NMyEm2/GNDWQMmzgt1IvpdZQ="
+          "integrity": "sha1-0O9NMyEm2/GNDWQMmzgt1IvpdZQ=",
+          "dependencies": {
+            "glob": {
+              "version": "7.1.1",
+              "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz",
+              "integrity": "sha1-gFIR3wT6rxxjo2ADBs31reULLsg="
+            }
+          }
         },
         "ms": {
           "version": "0.7.2",
@@ -946,6 +990,11 @@
           "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
           "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
+        "rimraf": {
+          "version": "2.5.4",
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
+          "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
+        },
         "sinon": {
           "version": "1.17.7",
           "resolved": "https://registry.npmjs.org/sinon/-/sinon-1.17.7.tgz",
@@ -982,6 +1031,11 @@
               "version": "0.2.10",
               "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz",
               "integrity": "sha1-trvgsGdLnXGXCMo43owjfLUmw9E="
+            },
+            "yargs": {
+              "version": "3.10.0",
+              "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
+              "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
             }
           }
         },
@@ -999,16 +1053,11 @@
           "version": "0.0.2",
           "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
           "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
-        },
-        "yargs": {
-          "version": "3.10.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
-          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
         }
       }
     },
     "@rush-temp/example-app-base": {
-      "version": "file:projects/example-app-base",
+      "version": "file:projects\\example-app-base",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1157,15 +1206,11 @@
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.7",
+          "version": "0.2.8",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.2",
-          "bundled": true
-        },
-        "typescript": {
-          "version": "2.4.2",
+          "version": "2.0.3",
           "bundled": true
         },
         "url": {
@@ -1189,7 +1234,7 @@
           }
         },
         "webpack": {
-          "version": "3.4.1",
+          "version": "3.5.1",
           "bundled": true,
           "dependencies": {
             "async": {
@@ -1239,65 +1284,12 @@
       }
     },
     "@rush-temp/fabric-website": {
-      "version": "file:projects/fabric-website",
+      "version": "file:projects\\fabric-website",
       "dependencies": {
         "@types/react-addons-test-utils": {
           "version": "0.14.19",
           "bundled": true
         },
-        "async": {
-          "version": "0.9.2",
-          "bundled": true
-        },
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true
-        },
-        "debug": {
-          "version": "2.6.0",
-          "bundled": true
-        },
-        "diff": {
-          "version": "3.2.0",
-          "bundled": true
-        },
-        "glob": {
-          "version": "7.1.1",
-          "bundled": true
-        },
-        "highlight.js": {
-          "version": "9.11.0",
-          "bundled": true
-        },
-        "mocha": {
-          "version": "3.3.0",
-          "bundled": true
-        },
-        "ms": {
-          "version": "0.7.2",
-          "bundled": true
-        },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "3.1.2",
-          "bundled": true
-        },
-        "typescript": {
-          "version": "2.4.2",
-          "bundled": true
-        }
-      }
-    },
-    "@rush-temp/office-ui-fabric-react": {
-      "version": "file:projects/office-ui-fabric-react",
-      "dependencies": {
         "acorn": {
           "version": "5.1.1",
           "bundled": true
@@ -1319,7 +1311,7 @@
           "bundled": true
         },
         "camelcase": {
-          "version": "4.1.0",
+          "version": "3.0.0",
           "bundled": true
         },
         "commander": {
@@ -1335,7 +1327,7 @@
           "bundled": true
         },
         "debug": {
-          "version": "2.6.0",
+          "version": "2.6.8",
           "bundled": true
         },
         "diff": {
@@ -1354,10 +1346,6 @@
           "version": "7.1.1",
           "bundled": true
         },
-        "has-flag": {
-          "version": "2.0.0",
-          "bundled": true
-        },
         "https-browserify": {
           "version": "0.0.1",
           "bundled": true
@@ -1375,21 +1363,7 @@
           "bundled": true
         },
         "mocha": {
-          "version": "3.4.2",
-          "bundled": true,
-          "dependencies": {
-            "has-flag": {
-              "version": "1.0.0",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "3.1.2",
-              "bundled": true
-            }
-          }
-        },
-        "ms": {
-          "version": "0.7.2",
+          "version": "3.5.0",
           "bundled": true
         },
         "node-libs-browser": {
@@ -1455,19 +1429,15 @@
           "bundled": true
         },
         "supports-color": {
-          "version": "4.2.1",
+          "version": "3.1.2",
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.7",
+          "version": "0.2.8",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.2",
-          "bundled": true
-        },
-        "typescript": {
-          "version": "2.4.2",
+          "version": "2.0.3",
           "bundled": true
         },
         "url": {
@@ -1491,20 +1461,48 @@
           }
         },
         "webpack": {
-          "version": "3.4.1",
+          "version": "3.5.2",
           "bundled": true,
           "dependencies": {
             "async": {
               "version": "2.5.0",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
+              "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw=="
+            },
+            "camelcase": {
+              "version": "4.1.0",
+              "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
+              "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
+            },
+            "has-flag": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
+              "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
             },
             "loader-utils": {
               "version": "1.1.0",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
+              "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
             },
             "source-map": {
               "version": "0.5.6",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz",
+              "integrity": "sha1-dc449SvwczxafwwRjYEzSiu19BI="
+            },
+            "supports-color": {
+              "version": "4.2.1",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
+              "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
+            },
+            "yargs": {
+              "version": "8.0.2",
+              "resolved": "https://registry.npmjs.org/yargs/-/yargs-8.0.2.tgz",
+              "integrity": "sha1-YpmpBVsc78lp/355wdkY3Osiw2A="
+            },
+            "yargs-parser": {
+              "version": "7.0.0",
+              "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-7.0.0.tgz",
+              "integrity": "sha1-jQrELxbqVd69MyyvTEA4s+P139k="
             }
           }
         },
@@ -1523,20 +1521,17 @@
           "bundled": true
         },
         "yargs": {
-          "version": "8.0.2",
+          "version": "6.6.0",
           "bundled": true
         },
         "yargs-parser": {
-          "version": "7.0.0",
+          "version": "4.2.1",
           "bundled": true
         }
       }
     },
-    "@rush-temp/office-ui-fabric-react-tslint": {
-      "version": "file:projects/office-ui-fabric-react-tslint"
-    },
-    "@rush-temp/ssr-tests": {
-      "version": "file:projects/ssr-tests",
+    "@rush-temp/office-ui-fabric-react": {
+      "version": "file:projects\\office-ui-fabric-react",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1555,7 +1550,7 @@
           "bundled": true
         },
         "async": {
-          "version": "2.5.0",
+          "version": "0.9.2",
           "bundled": true
         },
         "camelcase": {
@@ -1575,7 +1570,7 @@
           "bundled": true
         },
         "debug": {
-          "version": "2.6.0",
+          "version": "2.6.8",
           "bundled": true
         },
         "diff": {
@@ -1610,16 +1605,8 @@
           "version": "2.0.0",
           "bundled": true
         },
-        "loader-utils": {
-          "version": "1.1.0",
-          "bundled": true
-        },
         "mocha": {
-          "version": "3.3.0",
-          "bundled": true
-        },
-        "ms": {
-          "version": "0.7.2",
+          "version": "3.5.0",
           "bundled": true
         },
         "node-libs-browser": {
@@ -1660,6 +1647,14 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "source-map": {
+          "version": "0.1.43",
+          "bundled": true
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "bundled": true
+        },
         "stream-browserify": {
           "version": "2.0.1",
           "bundled": true
@@ -1681,11 +1676,11 @@
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.7",
+          "version": "0.2.8",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.2",
+          "version": "2.0.3",
           "bundled": true
         },
         "url": {
@@ -1700,16 +1695,34 @@
         },
         "watchpack": {
           "version": "1.4.0",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            }
+          }
         },
         "webpack": {
-          "version": "3.4.1",
+          "version": "3.5.1",
           "bundled": true,
           "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            },
             "has-flag": {
               "version": "2.0.0",
               "bundled": true
             },
+            "loader-utils": {
+              "version": "1.1.0",
+              "bundled": true
+            },
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            },
             "supports-color": {
               "version": "4.2.1",
               "bundled": true
@@ -1718,7 +1731,13 @@
         },
         "webpack-sources": {
           "version": "1.0.1",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
         },
         "which-module": {
           "version": "2.0.0",
@@ -1734,13 +1753,12 @@
         }
       }
     },
-    "@rush-temp/styling": {
-      "version": "file:projects/styling",
+    "@rush-temp/office-ui-fabric-react-tslint": {
+      "version": "file:projects\\office-ui-fabric-react-tslint"
+    },
+    "@rush-temp/ssr-tests": {
+      "version": "file:projects\\ssr-tests",
       "dependencies": {
-        "@uifabric/utilities": {
-          "version": "1.10.4",
-          "bundled": true
-        },
         "acorn": {
           "version": "5.1.1",
           "bundled": true
@@ -1758,7 +1776,7 @@
           "bundled": true
         },
         "async": {
-          "version": "0.9.2",
+          "version": "2.5.0",
           "bundled": true
         },
         "camelcase": {
@@ -1797,10 +1815,6 @@
           "version": "7.1.1",
           "bundled": true
         },
-        "has-flag": {
-          "version": "2.0.0",
-          "bundled": true
-        },
         "https-browserify": {
           "version": "0.0.1",
           "bundled": true
@@ -1817,19 +1831,13 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "loader-utils": {
+          "version": "1.1.0",
+          "bundled": true
+        },
         "mocha": {
-          "version": "3.4.2",
-          "bundled": true,
-          "dependencies": {
-            "has-flag": {
-              "version": "1.0.0",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "3.1.2",
-              "bundled": true
-            }
-          }
+          "version": "3.3.0",
+          "bundled": true
         },
         "ms": {
           "version": "0.7.2",
@@ -1839,10 +1847,6 @@
           "version": "2.0.0",
           "bundled": true
         },
-        "office-ui-fabric-react": {
-          "version": "2.34.2",
-          "bundled": true
-        },
         "os-browserify": {
           "version": "0.2.1",
           "bundled": true
@@ -1877,14 +1881,6 @@
           "version": "2.0.0",
           "bundled": true
         },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true
-        },
         "stream-browserify": {
           "version": "2.0.1",
           "bundled": true
@@ -1902,19 +1898,214 @@
           "bundled": true
         },
         "supports-color": {
-          "version": "4.2.1",
+          "version": "3.1.2",
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.7",
+          "version": "0.2.8",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.2",
+          "version": "2.0.3",
           "bundled": true
         },
-        "typescript": {
-          "version": "2.4.2",
+        "url": {
+          "version": "0.11.0",
+          "bundled": true,
+          "dependencies": {
+            "punycode": {
+              "version": "1.3.2",
+              "bundled": true
+            }
+          }
+        },
+        "watchpack": {
+          "version": "1.4.0",
+          "bundled": true
+        },
+        "webpack": {
+          "version": "3.5.1",
+          "bundled": true,
+          "dependencies": {
+            "has-flag": {
+              "version": "2.0.0",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "4.2.1",
+              "bundled": true
+            }
+          }
+        },
+        "webpack-sources": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "which-module": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "yargs": {
+          "version": "8.0.2",
+          "bundled": true
+        },
+        "yargs-parser": {
+          "version": "7.0.0",
+          "bundled": true
+        }
+      }
+    },
+    "@rush-temp/styling": {
+      "version": "file:projects\\styling",
+      "dependencies": {
+        "acorn": {
+          "version": "5.1.1",
+          "bundled": true
+        },
+        "ajv": {
+          "version": "5.2.2",
+          "bundled": true
+        },
+        "ajv-keywords": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "ansi-regex": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "async": {
+          "version": "0.9.2",
+          "bundled": true
+        },
+        "camelcase": {
+          "version": "4.1.0",
+          "bundled": true
+        },
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
+        "constants-browserify": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "crypto-browserify": {
+          "version": "3.11.1",
+          "bundled": true
+        },
+        "debug": {
+          "version": "2.6.8",
+          "bundled": true
+        },
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
+        },
+        "enhanced-resolve": {
+          "version": "3.4.1",
+          "bundled": true
+        },
+        "find-up": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "glob": {
+          "version": "7.1.1",
+          "bundled": true
+        },
+        "https-browserify": {
+          "version": "0.0.1",
+          "bundled": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "load-json-file": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "mocha": {
+          "version": "3.5.0",
+          "bundled": true
+        },
+        "node-libs-browser": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "os-browserify": {
+          "version": "0.2.1",
+          "bundled": true
+        },
+        "os-locale": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "path-type": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg-up": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "readable-stream": {
+          "version": "2.3.3",
+          "bundled": true,
+          "dependencies": {
+            "string_decoder": {
+              "version": "1.0.3",
+              "bundled": true
+            }
+          }
+        },
+        "source-list-map": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "source-map": {
+          "version": "0.1.43",
+          "bundled": true
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "bundled": true
+        },
+        "stream-browserify": {
+          "version": "2.0.1",
+          "bundled": true
+        },
+        "string-width": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "bundled": true
+        },
+        "strip-bom": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "supports-color": {
+          "version": "3.1.2",
+          "bundled": true
+        },
+        "tapable": {
+          "version": "0.2.8",
+          "bundled": true
+        },
+        "timers-browserify": {
+          "version": "2.0.3",
           "bundled": true
         },
         "url": {
@@ -1938,13 +2129,17 @@
           }
         },
         "webpack": {
-          "version": "3.4.1",
+          "version": "3.5.1",
           "bundled": true,
           "dependencies": {
             "async": {
               "version": "2.5.0",
               "bundled": true
             },
+            "has-flag": {
+              "version": "2.0.0",
+              "bundled": true
+            },
             "loader-utils": {
               "version": "1.1.0",
               "bundled": true
@@ -1952,6 +2147,10 @@
             "source-map": {
               "version": "0.5.6",
               "bundled": true
+            },
+            "supports-color": {
+              "version": "4.2.1",
+              "bundled": true
             }
           }
         },
@@ -1980,7 +2179,7 @@
       }
     },
     "@rush-temp/test-bundle-button": {
-      "version": "file:projects/test-bundle-button",
+      "version": "file:projects\\test-bundle-button",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -2109,15 +2308,11 @@
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.7",
+          "version": "0.2.8",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.2",
-          "bundled": true
-        },
-        "typescript": {
-          "version": "2.4.2",
+          "version": "2.0.3",
           "bundled": true
         },
         "url": {
@@ -2141,7 +2336,7 @@
           }
         },
         "webpack": {
-          "version": "3.4.1",
+          "version": "3.5.1",
           "bundled": true,
           "dependencies": {
             "async": {
@@ -2183,16 +2378,10 @@
       }
     },
     "@rush-temp/todo-app": {
-      "version": "file:projects/todo-app",
-      "dependencies": {
-        "typescript": {
-          "version": "2.4.2",
-          "bundled": true
-        }
-      }
+      "version": "file:projects\\todo-app"
     },
     "@rush-temp/utilities": {
-      "version": "file:projects/utilities",
+      "version": "file:projects\\utilities",
       "dependencies": {
         "async": {
           "version": "0.9.2",
@@ -2233,10 +2422,6 @@
         "supports-color": {
           "version": "3.1.2",
           "bundled": true
-        },
-        "typescript": {
-          "version": "2.4.2",
-          "bundled": true
         }
       }
     },
@@ -2446,9 +2631,9 @@
       "integrity": "sha1-qA2khougisysvOTTcnbzXhugpS8="
     },
     "@types/source-map": {
-      "version": "0.5.0",
-      "resolved": "https://registry.npmjs.org/@types/source-map/-/source-map-0.5.0.tgz",
-      "integrity": "sha1-3TS72OMv5OdPLj2KwH+KpbRaR6w="
+      "version": "0.5.1",
+      "resolved": "https://registry.npmjs.org/@types/source-map/-/source-map-0.5.1.tgz",
+      "integrity": "sha512-/GVAjL1Y8puvZab63n8tsuBiYwZt1bApMdx58/msQ9ID5T05ov+wm/ZV1DvYC/DKKEygpTJViqQvkh5Rhrl4CA=="
     },
     "@types/tapable": {
       "version": "0.2.3",
@@ -2501,14 +2686,14 @@
       "integrity": "sha512-CFIyoGyfnoC/pEp1exoKAeJuJr8vFc/ldKP0RDtD9IIdEqUBAQiByah6+bGMxntAtD84Osg6WCXcA1DpVlM75g=="
     },
     "@uifabric/styling": {
-      "version": "0.15.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.15.1.tgz",
-      "integrity": "sha512-57FgCqHJycNhspKZrcV3mzNv36ILntmB3UY5OimsSw7Sw2Lg3yFH28W2hYKRfqOSjm/5fCdreDyMpkaf8kJubg=="
+      "version": "0.19.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.19.0.tgz",
+      "integrity": "sha512-jeMle8I1dBAG4l9t0BdgBEwAn2b2p4Jg0dH7L6t5xVA1BSptj8vGqcVay0nlnMLSkYU1yw5mbOnRqxl/xxdG7A=="
     },
     "@uifabric/utilities": {
-      "version": "4.8.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.8.1.tgz",
-      "integrity": "sha512-ooT8BFqDt0Tg7IV7ZrJ+6b4yvTbNUn/fYi0C+iAqVlugjDpbZ/4qhXo22K2XiP/l5M0eBgkiLoODUFOmX4A+3g=="
+      "version": "4.9.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.9.0.tgz",
+      "integrity": "sha512-9AmohH0ivY9lBjyOkCAsoV8ca7vkQGnyv65XJ8tveaR/yoPF/rEy/wm2TSI121HnAQx0z1+OJYPUJVfszRt40Q=="
     },
     "abbrev": {
       "version": "1.0.9",
@@ -3001,9 +3186,9 @@
       "integrity": "sha1-eRQg1/VR7qKJdFOop3ZT+WYG1nw="
     },
     "bn.js": {
-      "version": "4.11.7",
-      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.7.tgz",
-      "integrity": "sha512-LxFiV5mefv0ley0SzqkOPR1bC4EbpPx8LkOz5vMe/Yi15t5hzwgO/G+tc7wOtL4PZTYjwHu8JnEiSLumuSjSfA=="
+      "version": "4.11.8",
+      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.8.tgz",
+      "integrity": "sha512-ItfYfPLkWHUjckQCk8xC+LwxgK8NYcXywGigJgSwOP8Y2iyWT4f2vsZnoOXTTbo+o5yXmIUJ4gn5538SO5S3gA=="
     },
     "body-parser": {
       "version": "1.17.2",
@@ -3058,9 +3243,9 @@
           "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
         },
         "chalk": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.0.1.tgz",
-          "integrity": "sha512-Mp+FXEI+FrwY/XYV45b2YD3E8i3HwnEAoFcM0qlZzq/RZ9RwWitt2Y/c7cqRAz70U7hfekqx6qNYthuKFO6K0g=="
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
+          "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ=="
         },
         "has-flag": {
           "version": "2.0.0",
@@ -3217,9 +3402,9 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000708",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000708.tgz",
-      "integrity": "sha1-wuc2vTt/xfbBTkxt/mK5jtFeils="
+      "version": "1.0.30000713",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000713.tgz",
+      "integrity": "sha1-6gF2GEC18Uj6+U7F800KodMhlm8="
     },
     "capture-stack-trace": {
       "version": "1.0.0",
@@ -3512,9 +3697,16 @@
       "integrity": "sha512-5oNkD/L++l0O6xGXxb1EWS7SivtjfGQlRyxJsYgE0Z495/L81e2h4/d3r969hoPXuFItzNOKMtsXgYG4c7dYvw=="
     },
     "connect": {
-      "version": "3.6.2",
-      "resolved": "https://registry.npmjs.org/connect/-/connect-3.6.2.tgz",
-      "integrity": "sha1-aU6NIGgb/kkCgsiriGvpjwn0L+c="
+      "version": "3.6.3",
+      "resolved": "https://registry.npmjs.org/connect/-/connect-3.6.3.tgz",
+      "integrity": "sha512-GLSZqgjVxPvGYVD/2vz//gS201MEXk4b7t3nHV6OVnTdDNWi/Gm7Rpxs/ybvljPWvULys/wrzIV3jB3YvEc3nQ==",
+      "dependencies": {
+        "debug": {
+          "version": "2.6.8",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
+          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
+        }
+      }
     },
     "connect-history-api-fallback": {
       "version": "1.3.0",
@@ -3601,9 +3793,9 @@
       "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw="
     },
     "core-js": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.4.1.tgz",
-      "integrity": "sha1-TekR5mew6ukSTjQlS1OupvxhjT4="
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.5.0.tgz",
+      "integrity": "sha1-VpwFCRi+ZIazg3VSAorgRmtxcIY="
     },
     "core-util-is": {
       "version": "1.0.2",
@@ -3995,6 +4187,11 @@
         }
       }
     },
+    "dom-walk": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/dom-walk/-/dom-walk-0.1.1.tgz",
+      "integrity": "sha1-ZyIm3HTI95mtNTB9+TaroRrNYBg="
+    },
     "domain-browser": {
       "version": "1.1.7",
       "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.1.7.tgz",
@@ -4036,25 +4233,15 @@
       "integrity": "sha1-7gHdHKwO08vH/b6jfcCo8c4ALOI="
     },
     "duplexify": {
-      "version": "3.5.0",
-      "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-3.5.0.tgz",
-      "integrity": "sha1-GqdzAC4VeEV+nZ1KULDMquvL1gQ=",
+      "version": "3.5.1",
+      "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-3.5.1.tgz",
+      "integrity": "sha512-j5goxHTwVED1Fpe5hh3q9R93Kip0Bg2KVAt4f8CEYM3UEwYcPSvWbXaUQOzdX/HtiNomipv+gU7ASQPDbV7pGQ==",
       "dependencies": {
-        "end-of-stream": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.0.0.tgz",
-          "integrity": "sha1-1FlucCc0qT5A6a+GQxnqvZn/Lw4="
-        },
         "isarray": {
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
-        "once": {
-          "version": "1.3.3",
-          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz",
-          "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA="
-        },
         "readable-stream": {
           "version": "2.3.3",
           "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
@@ -4079,14 +4266,14 @@
       "integrity": "sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0="
     },
     "ejs": {
-      "version": "2.5.6",
-      "resolved": "https://registry.npmjs.org/ejs/-/ejs-2.5.6.tgz",
-      "integrity": "sha1-R5Y2v6P+Ox3r1SCH8KyyBLTxnIg="
+      "version": "2.5.7",
+      "resolved": "https://registry.npmjs.org/ejs/-/ejs-2.5.7.tgz",
+      "integrity": "sha1-zIcsFoiArjxxiXYv1f/ACJbJUYo="
     },
     "electron-to-chromium": {
-      "version": "1.3.16",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.16.tgz",
-      "integrity": "sha1-0OAmc1dUdwkBrjAaIWZMukXZL30="
+      "version": "1.3.17",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.17.tgz",
+      "integrity": "sha1-QcE0V8xxZsXBXnZ65h2GqMrN7l0="
     },
     "elliptic": {
       "version": "6.4.0",
@@ -4224,9 +4411,9 @@
       "integrity": "sha1-t7cO2PNZ6duICS8tIMD4MUIK2D8="
     },
     "es-abstract": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.7.0.tgz",
-      "integrity": "sha1-363ndOAb/Nl/lhgCmMRJyGI/uUw="
+      "version": "1.8.0",
+      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.8.0.tgz",
+      "integrity": "sha512-Cf9/h5MrXtExM20gSS55YFrGKCyPrRBjIVBtVyy8vmlsDfe0NPKMWj65tPLgzyfPuapWxh5whpXCtW4+AW5mRg=="
     },
     "es-to-primitive": {
       "version": "1.1.1",
@@ -4234,9 +4421,9 @@
       "integrity": "sha1-RTVSSKiJeQNLZ5Lhm7gfK3l13Q0="
     },
     "es5-ext": {
-      "version": "0.10.24",
-      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.24.tgz",
-      "integrity": "sha1-pVh3yZJLwMjZvTwsvhdJWsFwmxQ="
+      "version": "0.10.26",
+      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.26.tgz",
+      "integrity": "sha1-UbISilMbcMT2dkCTpzy+u4IYY3I="
     },
     "es6-collections": {
       "version": "0.5.6",
@@ -4546,9 +4733,9 @@
       }
     },
     "extsprintf": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.0.2.tgz",
-      "integrity": "sha1-4QgOBljjALBilJkMxw4VAiNf1VA="
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.3.0.tgz",
+      "integrity": "sha1-lpGEQOMEGnpBT4xS48V06zw+HgU="
     },
     "fancy-log": {
       "version": "1.3.0",
@@ -4623,14 +4810,21 @@
       "integrity": "sha1-w8T2xmO5I0WamqKZEtLQMfFQf4Q="
     },
     "finalhandler": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.3.tgz",
-      "integrity": "sha1-70fneVDpmXgOhgIqVg4yF+DQzIk="
-    },
-    "find-index": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
-      "integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ="
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.4.tgz",
+      "integrity": "sha512-16l/r8RgzlXKmFOhZpHBztvye+lAhC5SU7hXavnerC9UfZqZxxXl3BzL8MhffPT3kF61lj9Oav2LKEzh0ei7tg==",
+      "dependencies": {
+        "debug": {
+          "version": "2.6.8",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
+          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
+        }
+      }
+    },
+    "find-index": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
+      "integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ="
     },
     "find-up": {
       "version": "1.1.2",
@@ -4654,86 +4848,629 @@
         }
       }
     },
-    "first-chunk-stream": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/first-chunk-stream/-/first-chunk-stream-1.0.0.tgz",
-      "integrity": "sha1-Wb+1DNkF9g18OUzT2ayqtOatk04="
-    },
-    "flagged-respawn": {
-      "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/flagged-respawn/-/flagged-respawn-0.3.2.tgz",
-      "integrity": "sha1-/xke3c1wiKZ1smEP/8l2vpuAdLU="
-    },
-    "flatten": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz",
-      "integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I="
-    },
-    "for-in": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
-      "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA="
-    },
-    "for-own": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz",
-      "integrity": "sha1-UmXGgaTylNq78XyVCbZ2OqhFEM4="
-    },
-    "foreach": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/foreach/-/foreach-2.0.5.tgz",
-      "integrity": "sha1-C+4AUBiusmDQo6865ljdATbsG5k="
-    },
-    "forever-agent": {
-      "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
-      "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE="
-    },
-    "fork-stream": {
-      "version": "0.0.4",
-      "resolved": "https://registry.npmjs.org/fork-stream/-/fork-stream-0.0.4.tgz",
-      "integrity": "sha1-24Sfznf2cIpfjzhq5TOgkHtUrnA="
-    },
-    "form-data": {
-      "version": "2.1.4",
-      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
-      "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE="
-    },
-    "formatio": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.1.1.tgz",
-      "integrity": "sha1-XtPM1jZVEJc4NGXZlhmRAOhhYek="
-    },
-    "forwarded": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.0.tgz",
-      "integrity": "sha1-Ge+YdMSuHCl7zweP3mOgm2aoQ2M="
-    },
-    "fresh": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.3.0.tgz",
-      "integrity": "sha1-ZR+DjiJCTnVm3hYdg1jKoZn4PU8="
-    },
-    "from": {
-      "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/from/-/from-0.1.7.tgz",
-      "integrity": "sha1-g8YK/Fi5xWmXAH7Rp2izqzA6RP4="
-    },
-    "fs-exists-sync": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/fs-exists-sync/-/fs-exists-sync-0.1.0.tgz",
-      "integrity": "sha1-mC1ok6+RjnLQjeyehnP/K1qNat0="
-    },
-    "fs-extra": {
-      "version": "0.26.7",
-      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz",
-      "integrity": "sha1-muH92UiXeY7at20JGM9C0MMYT6k="
-    },
-    "fs.realpath": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
-      "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
-    },
+    "first-chunk-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/first-chunk-stream/-/first-chunk-stream-1.0.0.tgz",
+      "integrity": "sha1-Wb+1DNkF9g18OUzT2ayqtOatk04="
+    },
+    "flagged-respawn": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/flagged-respawn/-/flagged-respawn-0.3.2.tgz",
+      "integrity": "sha1-/xke3c1wiKZ1smEP/8l2vpuAdLU="
+    },
+    "flatten": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz",
+      "integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I="
+    },
+    "for-in": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
+      "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA="
+    },
+    "for-own": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz",
+      "integrity": "sha1-UmXGgaTylNq78XyVCbZ2OqhFEM4="
+    },
+    "foreach": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/foreach/-/foreach-2.0.5.tgz",
+      "integrity": "sha1-C+4AUBiusmDQo6865ljdATbsG5k="
+    },
+    "forever-agent": {
+      "version": "0.6.1",
+      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
+      "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE="
+    },
+    "fork-stream": {
+      "version": "0.0.4",
+      "resolved": "https://registry.npmjs.org/fork-stream/-/fork-stream-0.0.4.tgz",
+      "integrity": "sha1-24Sfznf2cIpfjzhq5TOgkHtUrnA="
+    },
+    "form-data": {
+      "version": "2.1.4",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
+      "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE="
+    },
+    "formatio": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.1.1.tgz",
+      "integrity": "sha1-XtPM1jZVEJc4NGXZlhmRAOhhYek="
+    },
+    "forwarded": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.0.tgz",
+      "integrity": "sha1-Ge+YdMSuHCl7zweP3mOgm2aoQ2M="
+    },
+    "fresh": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.3.0.tgz",
+      "integrity": "sha1-ZR+DjiJCTnVm3hYdg1jKoZn4PU8="
+    },
+    "from": {
+      "version": "0.1.7",
+      "resolved": "https://registry.npmjs.org/from/-/from-0.1.7.tgz",
+      "integrity": "sha1-g8YK/Fi5xWmXAH7Rp2izqzA6RP4="
+    },
+    "fs-exists-sync": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/fs-exists-sync/-/fs-exists-sync-0.1.0.tgz",
+      "integrity": "sha1-mC1ok6+RjnLQjeyehnP/K1qNat0="
+    },
+    "fs-extra": {
+      "version": "0.26.7",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz",
+      "integrity": "sha1-muH92UiXeY7at20JGM9C0MMYT6k="
+    },
+    "fs.realpath": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
+      "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
+    },
+    "fsevents": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.2.tgz",
+      "integrity": "sha512-Sn44E5wQW4bTHXvQmvSHwqbuiXtduD6Rrjm2ZtUEGbyrig+nUH3t/QD4M4/ZXViY556TBpRgZkHLDx3JxPwxiw==",
+      "optional": true,
+      "dependencies": {
+        "abbrev": {
+          "version": "1.1.0",
+          "bundled": true,
+          "optional": true
+        },
+        "ajv": {
+          "version": "4.11.8",
+          "bundled": true,
+          "optional": true
+        },
+        "ansi-regex": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "aproba": {
+          "version": "1.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "are-we-there-yet": {
+          "version": "1.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "asn1": {
+          "version": "0.2.3",
+          "bundled": true,
+          "optional": true
+        },
+        "assert-plus": {
+          "version": "0.2.0",
+          "bundled": true,
+          "optional": true
+        },
+        "asynckit": {
+          "version": "0.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "aws-sign2": {
+          "version": "0.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "aws4": {
+          "version": "1.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "balanced-match": {
+          "version": "0.4.2",
+          "bundled": true
+        },
+        "bcrypt-pbkdf": {
+          "version": "1.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "block-stream": {
+          "version": "0.0.9",
+          "bundled": true
+        },
+        "boom": {
+          "version": "2.10.1",
+          "bundled": true
+        },
+        "brace-expansion": {
+          "version": "1.1.7",
+          "bundled": true
+        },
+        "buffer-shims": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "caseless": {
+          "version": "0.12.0",
+          "bundled": true,
+          "optional": true
+        },
+        "co": {
+          "version": "4.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "code-point-at": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "combined-stream": {
+          "version": "1.0.5",
+          "bundled": true
+        },
+        "concat-map": {
+          "version": "0.0.1",
+          "bundled": true
+        },
+        "console-control-strings": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "core-util-is": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "cryptiles": {
+          "version": "2.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "dashdash": {
+          "version": "1.14.1",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "debug": {
+          "version": "2.6.8",
+          "bundled": true,
+          "optional": true
+        },
+        "deep-extend": {
+          "version": "0.4.2",
+          "bundled": true,
+          "optional": true
+        },
+        "delayed-stream": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "delegates": {
+          "version": "1.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "ecc-jsbn": {
+          "version": "0.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "extend": {
+          "version": "3.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "extsprintf": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "forever-agent": {
+          "version": "0.6.1",
+          "bundled": true,
+          "optional": true
+        },
+        "form-data": {
+          "version": "2.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "fs.realpath": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "fstream": {
+          "version": "1.0.11",
+          "bundled": true
+        },
+        "fstream-ignore": {
+          "version": "1.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "gauge": {
+          "version": "2.7.4",
+          "bundled": true,
+          "optional": true
+        },
+        "getpass": {
+          "version": "0.1.7",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "glob": {
+          "version": "7.1.2",
+          "bundled": true
+        },
+        "graceful-fs": {
+          "version": "4.1.11",
+          "bundled": true
+        },
+        "har-schema": {
+          "version": "1.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "har-validator": {
+          "version": "4.2.1",
+          "bundled": true,
+          "optional": true
+        },
+        "has-unicode": {
+          "version": "2.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "hawk": {
+          "version": "3.1.3",
+          "bundled": true,
+          "optional": true
+        },
+        "hoek": {
+          "version": "2.16.3",
+          "bundled": true
+        },
+        "http-signature": {
+          "version": "1.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "inflight": {
+          "version": "1.0.6",
+          "bundled": true
+        },
+        "inherits": {
+          "version": "2.0.3",
+          "bundled": true
+        },
+        "ini": {
+          "version": "1.3.4",
+          "bundled": true,
+          "optional": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "is-typedarray": {
+          "version": "1.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "isstream": {
+          "version": "0.1.2",
+          "bundled": true,
+          "optional": true
+        },
+        "jodid25519": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "jsbn": {
+          "version": "0.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "json-schema": {
+          "version": "0.2.3",
+          "bundled": true,
+          "optional": true
+        },
+        "json-stable-stringify": {
+          "version": "1.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "json-stringify-safe": {
+          "version": "5.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "jsonify": {
+          "version": "0.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "jsprim": {
+          "version": "1.4.0",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "mime-db": {
+          "version": "1.27.0",
+          "bundled": true
+        },
+        "mime-types": {
+          "version": "2.1.15",
+          "bundled": true
+        },
+        "minimatch": {
+          "version": "3.0.4",
+          "bundled": true
+        },
+        "minimist": {
+          "version": "0.0.8",
+          "bundled": true
+        },
+        "mkdirp": {
+          "version": "0.5.1",
+          "bundled": true
+        },
+        "ms": {
+          "version": "2.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "node-pre-gyp": {
+          "version": "0.6.36",
+          "bundled": true,
+          "optional": true
+        },
+        "nopt": {
+          "version": "4.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "npmlog": {
+          "version": "4.1.0",
+          "bundled": true,
+          "optional": true
+        },
+        "number-is-nan": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "oauth-sign": {
+          "version": "0.8.2",
+          "bundled": true,
+          "optional": true
+        },
+        "object-assign": {
+          "version": "4.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "once": {
+          "version": "1.4.0",
+          "bundled": true
+        },
+        "os-homedir": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "os-tmpdir": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "osenv": {
+          "version": "0.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "path-is-absolute": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "performance-now": {
+          "version": "0.2.0",
+          "bundled": true,
+          "optional": true
+        },
+        "process-nextick-args": {
+          "version": "1.0.7",
+          "bundled": true
+        },
+        "punycode": {
+          "version": "1.4.1",
+          "bundled": true,
+          "optional": true
+        },
+        "qs": {
+          "version": "6.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "rc": {
+          "version": "1.2.1",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "minimist": {
+              "version": "1.2.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "bundled": true
+        },
+        "request": {
+          "version": "2.81.0",
+          "bundled": true,
+          "optional": true
+        },
+        "rimraf": {
+          "version": "2.6.1",
+          "bundled": true
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "bundled": true
+        },
+        "semver": {
+          "version": "5.3.0",
+          "bundled": true,
+          "optional": true
+        },
+        "set-blocking": {
+          "version": "2.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "signal-exit": {
+          "version": "3.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "sntp": {
+          "version": "1.0.9",
+          "bundled": true,
+          "optional": true
+        },
+        "sshpk": {
+          "version": "1.13.0",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "string_decoder": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "string-width": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "stringstream": {
+          "version": "0.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "strip-ansi": {
+          "version": "3.0.1",
+          "bundled": true
+        },
+        "strip-json-comments": {
+          "version": "2.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "tar": {
+          "version": "2.2.1",
+          "bundled": true
+        },
+        "tar-pack": {
+          "version": "3.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "tough-cookie": {
+          "version": "2.3.2",
+          "bundled": true,
+          "optional": true
+        },
+        "tunnel-agent": {
+          "version": "0.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "tweetnacl": {
+          "version": "0.14.5",
+          "bundled": true,
+          "optional": true
+        },
+        "uid-number": {
+          "version": "0.0.6",
+          "bundled": true,
+          "optional": true
+        },
+        "util-deprecate": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "uuid": {
+          "version": "3.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "verror": {
+          "version": "1.3.6",
+          "bundled": true,
+          "optional": true
+        },
+        "wide-align": {
+          "version": "1.1.2",
+          "bundled": true,
+          "optional": true
+        },
+        "wrappy": {
+          "version": "1.0.2",
+          "bundled": true
+        }
+      }
+    },
     "fstream": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
@@ -4784,11 +5521,6 @@
       "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz",
       "integrity": "sha1-9wLmMSfn4jHBYKgMFVSstw1QR+U="
     },
-    "get-own-enumerable-property-symbols": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/get-own-enumerable-property-symbols/-/get-own-enumerable-property-symbols-1.0.1.tgz",
-      "integrity": "sha1-8dTjrRQC4DmJjlbR6bmqkkwm5IQ="
-    },
     "get-stdin": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz",
@@ -4817,9 +5549,9 @@
       "integrity": "sha1-jMvSCSs0W8LJFJVIOW31SWRspj8="
     },
     "glamor": {
-      "version": "2.20.37",
-      "resolved": "https://registry.npmjs.org/glamor/-/glamor-2.20.37.tgz",
-      "integrity": "sha512-+zfncOt+qhno7li2wDih/Q+F6ugtAJQ7E+V3NJ6SZ6rbkOAOa4yEvRLfC9NnNqYp0XIpH/MW6bW5x4Pua41DIQ=="
+      "version": "2.20.39",
+      "resolved": "https://registry.npmjs.org/glamor/-/glamor-2.20.39.tgz",
+      "integrity": "sha512-tQ25Rmuad18jybnQgnsBzjhayPaK5Izy7SApBAaRnYQ50uA96SQEAoyymA8QNan51QyK1mB7dFUCX0OyaKa0yg=="
     },
     "glob": {
       "version": "7.1.2",
@@ -4878,6 +5610,18 @@
       "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz",
       "integrity": "sha1-nUGbPijxLoOjYhZKJ3BVkiycDVY="
     },
+    "global": {
+      "version": "4.3.2",
+      "resolved": "https://registry.npmjs.org/global/-/global-4.3.2.tgz",
+      "integrity": "sha1-52mJJopsdMOJCLEwWxD8DjlOnQ8=",
+      "dependencies": {
+        "process": {
+          "version": "0.5.2",
+          "resolved": "https://registry.npmjs.org/process/-/process-0.5.2.tgz",
+          "integrity": "sha1-FjjYqONML0QKkduVq5rrZ3/Bhc8="
+        }
+      }
+    },
     "global-modules": {
       "version": "0.2.3",
       "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-0.2.3.tgz",
@@ -5263,11 +6007,6 @@
         }
       }
     },
-    "gulp-debug": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/gulp-debug/-/gulp-debug-3.1.0.tgz",
-      "integrity": "sha1-TakVaLVJFb6ANpbKqsEMiVssCnE="
-    },
     "gulp-decomment": {
       "version": "0.1.3",
       "resolved": "https://registry.npmjs.org/gulp-decomment/-/gulp-decomment-0.1.3.tgz",
@@ -5478,6 +6217,11 @@
           "version": "0.4.3",
           "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz",
           "integrity": "sha1-Y3PbdpCf5XDgjXNYM2Xtgop07us="
+        },
+        "which": {
+          "version": "1.2.14",
+          "resolved": "https://registry.npmjs.org/which/-/which-1.2.14.tgz",
+          "integrity": "sha1-mofEN48D6CfOyvGs31bHNsAcFOU="
         }
       }
     },
@@ -5850,9 +6594,9 @@
       "integrity": "sha512-iKRzQQDuTCsq0Ultbi/mfJJnR0D3AdZKTq966Gsp92xkmAPCV4Xi08qhJ0Dl3ZAWemSgJ7qZK+UsZc0gFqK6wg==",
       "dependencies": {
         "uglify-js": {
-          "version": "3.0.26",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.26.tgz",
-          "integrity": "sha512-+D/BjzuvT1oRMSkH0fuF3M/BCvDxDywmZasd1UTPPHsdsHZqJEAZSvrojgFlS7lrM3ZZWq5h7Bb5i96X1TbOJw=="
+          "version": "3.0.27",
+          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.27.tgz",
+          "integrity": "sha512-HD8CmxPXUI62v5tweiulMcP/apAtx1DXGcNZkhKQZyC+MTrTsoCBb8yPAwVrbvpgw3EpRU76bRe6axjIiCYcQg=="
         }
       }
     },
@@ -5889,16 +6633,9 @@
       "integrity": "sha1-+nFolEq5pRnTN8sL7HKE3D5yPYc="
     },
     "http-errors": {
-      "version": "1.6.1",
-      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.1.tgz",
-      "integrity": "sha1-X4uO2YrKVFZWv1cplzh/kEpyIlc=",
-      "dependencies": {
-        "depd": {
-          "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.0.tgz",
-          "integrity": "sha1-4b2Cxqq2ztlluXuIsX7T5SjKGMM="
-        }
-      }
+      "version": "1.6.2",
+      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.2.tgz",
+      "integrity": "sha1-CgAsyFcHGSp+eUbO7cERVfYOxzY="
     },
     "http-proxy": {
       "version": "1.16.2",
@@ -5963,9 +6700,9 @@
           "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
         },
         "chalk": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.0.1.tgz",
-          "integrity": "sha512-Mp+FXEI+FrwY/XYV45b2YD3E8i3HwnEAoFcM0qlZzq/RZ9RwWitt2Y/c7cqRAz70U7hfekqx6qNYthuKFO6K0g=="
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
+          "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ=="
         },
         "has-flag": {
           "version": "2.0.0",
@@ -5990,9 +6727,9 @@
       "integrity": "sha1-vjPUCsEO8ZJnAfbwii2G+/0a0+Q="
     },
     "immutability-helper": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.3.0.tgz",
-      "integrity": "sha1-6Jd0HB2ilUGoYeoWvb+QkmXi61U="
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.3.1.tgz",
+      "integrity": "sha1-jM/OkhVyCMEgsq+tftBcERFMCG4="
     },
     "import-lazy": {
       "version": "2.1.0",
@@ -6040,9 +6777,9 @@
       "integrity": "sha1-BTfLedr1m1mhpRff9wbIbsA5Fi4="
     },
     "inline-style-prefixer": {
-      "version": "3.0.6",
-      "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-3.0.6.tgz",
-      "integrity": "sha1-sn/jCbQWijHq84yOjGCrnnwRcx8="
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-3.0.7.tgz",
+      "integrity": "sha1-DMyS5ZAv5uDSjZdcQlhEP4gGFfg="
     },
     "inpath": {
       "version": "1.0.2",
@@ -6091,11 +6828,6 @@
       "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.4.0.tgz",
       "integrity": "sha1-KWrKh4qCGBbluF0KKFqZvP9FgvA="
     },
-    "irregular-plurals": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/irregular-plurals/-/irregular-plurals-1.3.0.tgz",
-      "integrity": "sha512-njf5A+Mxb3kojuHd1DzISjjIl+XhyzovXEOyPPSzdQozq/Lf2tN27mOrAAsxEPZxpn6I4MGzs1oo9TxXxPFpaA=="
-    },
     "is": {
       "version": "3.2.1",
       "resolved": "https://registry.npmjs.org/is/-/is-3.2.1.tgz",
@@ -6258,11 +6990,6 @@
       "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.0.4.tgz",
       "integrity": "sha1-VRdIm1RwkbCTDglWVM7SXul+lJE="
     },
-    "is-regexp": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-regexp/-/is-regexp-1.0.0.tgz",
-      "integrity": "sha1-/S2INUXEa6xaYz57mgnof6LLUGk="
-    },
     "is-relative": {
       "version": "0.2.1",
       "resolved": "https://registry.npmjs.org/is-relative/-/is-relative-0.2.1.tgz",
@@ -6430,9 +7157,9 @@
       "integrity": "sha1-mGbfOVECEw449/mWvOtlRDIJwls="
     },
     "js-yaml": {
-      "version": "3.9.0",
-      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.9.0.tgz",
-      "integrity": "sha512-0LoUNELX4S+iofCT8f4uEHIiRBR+c2AINyC8qRWfC6QNruLtxVZRJaPcu/xwMgFIgDxF25tGHaDjvxzJCNE9yw=="
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.9.1.tgz",
+      "integrity": "sha512-CbcG379L1e+mWBnLvHWWeLs8GyV/EMw862uLI3c+GxVyDHWZcjZinwuBd3iW2pgxgIlksW/1vNJa4to+RvDOww=="
     },
     "jsbn": {
       "version": "0.1.1",
@@ -6496,9 +7223,9 @@
       "integrity": "sha1-T9kss04OnbPInIYi7PUfm5eMbLk="
     },
     "jsprim": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.0.tgz",
-      "integrity": "sha1-o7h+QCmNjDgFUtjMdiigu5WiKRg=",
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.1.tgz",
+      "integrity": "sha1-MT5mvB5cwG5Di8G3SZwuXFastqI=",
       "dependencies": {
         "assert-plus": {
           "version": "1.0.0",
@@ -7280,6 +8007,11 @@
       "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-1.1.0.tgz",
       "integrity": "sha1-5md4PZLonb00KBi1IwudYqZyrRg="
     },
+    "min-document": {
+      "version": "2.19.0",
+      "resolved": "https://registry.npmjs.org/min-document/-/min-document-2.19.0.tgz",
+      "integrity": "sha1-e9KC4/WELtKVu3SM3Z8f+iyCRoU="
+    },
     "minimalistic-assert": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.0.tgz",
@@ -7498,9 +8230,9 @@
       "integrity": "sha512-+ktMAh1Jwas+TnGodfCfjUbJKoANqPaJFN0z0iqh41eqD8dvguNzcitVSBSVK1pidz0AqGbLKcoVuVLRVZ/aVg=="
     },
     "node-fetch": {
-      "version": "1.7.1",
-      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.1.tgz",
-      "integrity": "sha512-j8XsFGCLw79vWXkZtMSmmLaOk9z5SQ9bV/tkbZVCqvgwzrjAGq66igobLofHtF63NvMTp2WjytpsNTGKa+XRIQ=="
+      "version": "1.7.2",
+      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.2.tgz",
+      "integrity": "sha512-xZZUq2yDhKMIn/UgG5q//IZSNLJIwW2QxS14CNH5spuiXkITM2pUitjdq58yLSaU7m4M0wBNaM2Gh/ggY4YJig=="
     },
     "node-forge": {
       "version": "0.7.1",
@@ -7694,9 +8426,9 @@
       "integrity": "sha1-JKwXdDPkou6REP5DWAutBZ+gBQk="
     },
     "office-ui-fabric-react": {
-      "version": "4.25.1",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.25.1.tgz",
-      "integrity": "sha512-rGnC/XOI5u0AfJuTLg83PpfysXZk+XMYaF3AU+7my7dHXOIqFMS/DtE6Fv5+D5aAYexaLmBWugJc58BMDLRX5w=="
+      "version": "4.31.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.31.0.tgz",
+      "integrity": "sha512-4kOV3n/GwjtbGPLj4KTUyXroLVcMkaugrYz5UVqzqPKhTW58tqvgn4Q5+CBLCWZ8lNITtC+fxf9nWXEaKKNF9A=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -7989,9 +8721,9 @@
       "integrity": "sha1-/lo0sMvOErWqaitAPuLnO2AvFEU="
     },
     "pbkdf2": {
-      "version": "3.0.12",
-      "resolved": "https://registry.npmjs.org/pbkdf2/-/pbkdf2-3.0.12.tgz",
-      "integrity": "sha1-vjZ4XFBn6kjYBv+SMojF91C2uKI=",
+      "version": "3.0.13",
+      "resolved": "https://registry.npmjs.org/pbkdf2/-/pbkdf2-3.0.13.tgz",
+      "integrity": "sha512-+dCHxDH+djNtjgWmvVC/my3SYBAKpKNqKSjLkp+GtWWYe4XPE+e/PSD2aCanlEZZnqPk2uekTKNC/ccbwd2X2Q==",
       "dependencies": {
         "ripemd160": {
           "version": "2.0.1",
@@ -8069,6 +8801,11 @@
           "version": "0.4.3",
           "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz",
           "integrity": "sha1-Y3PbdpCf5XDgjXNYM2Xtgop07us="
+        },
+        "which": {
+          "version": "1.2.14",
+          "resolved": "https://registry.npmjs.org/which/-/which-1.2.14.tgz",
+          "integrity": "sha1-mofEN48D6CfOyvGs31bHNsAcFOU="
         }
       }
     },
@@ -8097,11 +8834,6 @@
       "resolved": "https://registry.npmjs.org/pkg-conf/-/pkg-conf-1.1.3.tgz",
       "integrity": "sha1-N45W1v0T6Iv7b0ol33qD+qvduls="
     },
-    "plur": {
-      "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/plur/-/plur-2.1.2.tgz",
-      "integrity": "sha1-dIJFLBoPUI4+NE6uwxLJHCncZVo="
-    },
     "portfinder": {
       "version": "1.0.13",
       "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.13.tgz",
@@ -8254,9 +8986,9 @@
           "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
         },
         "chalk": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.0.1.tgz",
-          "integrity": "sha512-Mp+FXEI+FrwY/XYV45b2YD3E8i3HwnEAoFcM0qlZzq/RZ9RwWitt2Y/c7cqRAz70U7hfekqx6qNYthuKFO6K0g=="
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
+          "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ=="
         },
         "has-flag": {
           "version": "2.0.0",
@@ -8286,9 +9018,9 @@
           "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
         },
         "chalk": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.0.1.tgz",
-          "integrity": "sha512-Mp+FXEI+FrwY/XYV45b2YD3E8i3HwnEAoFcM0qlZzq/RZ9RwWitt2Y/c7cqRAz70U7hfekqx6qNYthuKFO6K0g=="
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
+          "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ=="
         },
         "has-flag": {
           "version": "2.0.0",
@@ -8318,9 +9050,9 @@
           "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
         },
         "chalk": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.0.1.tgz",
-          "integrity": "sha512-Mp+FXEI+FrwY/XYV45b2YD3E8i3HwnEAoFcM0qlZzq/RZ9RwWitt2Y/c7cqRAz70U7hfekqx6qNYthuKFO6K0g=="
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
+          "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ=="
         },
         "has-flag": {
           "version": "2.0.0",
@@ -8350,9 +9082,9 @@
           "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
         },
         "chalk": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.0.1.tgz",
-          "integrity": "sha512-Mp+FXEI+FrwY/XYV45b2YD3E8i3HwnEAoFcM0qlZzq/RZ9RwWitt2Y/c7cqRAz70U7hfekqx6qNYthuKFO6K0g=="
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
+          "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ=="
         },
         "has-flag": {
           "version": "2.0.0",
@@ -8902,9 +9634,9 @@
       "integrity": "sha1-8z/pz7Urv9UgqhgyO8ZdsRCht2w="
     },
     "rtl-css-js": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.1.2.tgz",
-      "integrity": "sha1-HuipCwXhgy22cOohwluCCRtf/bs="
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.1.3.tgz",
+      "integrity": "sha1-JHyZl21jSk7XjfwN+KF/9lQMii8="
     },
     "run-async": {
       "version": "0.1.0",
@@ -9540,11 +10272,6 @@
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
       "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
     },
-    "stringify-object": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/stringify-object/-/stringify-object-3.2.0.tgz",
-      "integrity": "sha1-lDcKE15BvASDWIE7+ZSB8TFcaqY="
-    },
     "stringstream": {
       "version": "0.0.5",
       "resolved": "https://registry.npmjs.org/stringstream/-/stringstream-0.0.5.tgz",
@@ -9850,9 +10577,9 @@
           "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
         },
         "chalk": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.0.1.tgz",
-          "integrity": "sha512-Mp+FXEI+FrwY/XYV45b2YD3E8i3HwnEAoFcM0qlZzq/RZ9RwWitt2Y/c7cqRAz70U7hfekqx6qNYthuKFO6K0g=="
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
+          "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ=="
         },
         "enhanced-resolve": {
           "version": "3.4.1",
@@ -9875,9 +10602,9 @@
           "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
         },
         "tapable": {
-          "version": "0.2.7",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.7.tgz",
-          "integrity": "sha1-5GwNqsuyuKmLmwzqD0BSEFgX7Vw="
+          "version": "0.2.8",
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.8.tgz",
+          "integrity": "sha1-mTcqXJmb8t8WCvwNdL7U9HlIzSI="
         }
       }
     },
@@ -10187,9 +10914,16 @@
       "integrity": "sha1-N61zyO5Bf7PVgOeFMSMH0nSEfyI="
     },
     "verror": {
-      "version": "1.3.6",
-      "resolved": "https://registry.npmjs.org/verror/-/verror-1.3.6.tgz",
-      "integrity": "sha1-z/XfEpRtKX0rqu+qJoniW+AcAFw="
+      "version": "1.10.0",
+      "resolved": "https://registry.npmjs.org/verror/-/verror-1.10.0.tgz",
+      "integrity": "sha1-OhBcoXBTr1XW4nDB+CiGguGNpAA=",
+      "dependencies": {
+        "assert-plus": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
+        }
+      }
     },
     "vhost": {
       "version": "3.0.2",
@@ -10375,14 +11109,14 @@
           "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         },
         "tapable": {
-          "version": "0.2.7",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.7.tgz",
-          "integrity": "sha1-5GwNqsuyuKmLmwzqD0BSEFgX7Vw="
+          "version": "0.2.8",
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.8.tgz",
+          "integrity": "sha1-mTcqXJmb8t8WCvwNdL7U9HlIzSI="
         },
         "timers-browserify": {
-          "version": "2.0.2",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz",
-          "integrity": "sha1-q0iDz1l9zVCvIRNJoA+8pWrIa4Y="
+          "version": "2.0.3",
+          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.3.tgz",
+          "integrity": "sha512-+JAqyNgg+M8+gXIrq2EeUr4kZqRz47Ysco7X5QKRGScRE9HIHckyHD1asozSFGeqx2nmPCgA8T5tIGVO0ML7/w=="
         },
         "url": {
           "version": "0.11.0",
@@ -10414,24 +11148,29 @@
       }
     },
     "webpack-bundle-analyzer": {
-      "version": "2.8.3",
-      "resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.8.3.tgz",
-      "integrity": "sha512-kDnp1ejbZzmocvUbsjS+ymW9rcD01LzgFKOX4ArgtiSyro3i2ywIM1Thr2Z0MUtauZQw8C5cUdeUXOlvcBFduA==",
+      "version": "2.9.0",
+      "resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.9.0.tgz",
+      "integrity": "sha1-tYvDTMMLJ//brz0AvyerpvopxuM=",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
           "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.1.1.tgz",
           "integrity": "sha512-vOk6uEMctu0vQrvuSqFdJyqj1Q0S5VTDL79qtjo+DhRr+1mmaD+tluFSCZqhvi/JUhXSzoZN2BhtstaPEeE8cw=="
         },
+        "debug": {
+          "version": "2.6.8",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
+          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
+        },
         "etag": {
           "version": "1.8.0",
           "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.0.tgz",
           "integrity": "sha1-b2Ma7zNtbEY2K1F2QETOIWvjwFE="
         },
         "express": {
-          "version": "4.15.3",
-          "resolved": "https://registry.npmjs.org/express/-/express-4.15.3.tgz",
-          "integrity": "sha1-urZdDwOqgMNYQIly/HAPkWlEtmI="
+          "version": "4.15.4",
+          "resolved": "https://registry.npmjs.org/express/-/express-4.15.4.tgz",
+          "integrity": "sha1-Ay4iU0ic+PzgJma+yj0R7XotrtE="
         },
         "fresh": {
           "version": "0.5.0",
@@ -10448,20 +11187,25 @@
           "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz",
           "integrity": "sha1-EV+eO2s9rylZmDyzjxSaLUDrXVM="
         },
+        "qs": {
+          "version": "6.5.0",
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.5.0.tgz",
+          "integrity": "sha512-fjVFjW9yhqMhVGwRExCXLhJKrLlkYSaxNWdyc9rmHlrVZbk35YHH312dFd7191uQeXkI3mKLZTIbSvIeFwFemg=="
+        },
         "safe-buffer": {
           "version": "5.0.1",
           "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
           "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
         "send": {
-          "version": "0.15.3",
-          "resolved": "https://registry.npmjs.org/send/-/send-0.15.3.tgz",
-          "integrity": "sha1-UBP5+ZAj31DRvZiSwZ4979HVMwk="
+          "version": "0.15.4",
+          "resolved": "https://registry.npmjs.org/send/-/send-0.15.4.tgz",
+          "integrity": "sha1-mF+qPihLAnPHkzZKNcZze9k5Bbk="
         },
         "serve-static": {
-          "version": "1.12.3",
-          "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.12.3.tgz",
-          "integrity": "sha1-n0uhni8wMMVH+K+ZEHg47DjVseI="
+          "version": "1.12.4",
+          "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.12.4.tgz",
+          "integrity": "sha1-m2qpjutyU8Tu3Ewfb9vKYJkBqWE="
         },
         "ultron": {
           "version": "1.1.0",
@@ -10488,14 +11232,21 @@
       }
     },
     "webpack-dev-middleware": {
-      "version": "1.11.0",
-      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-1.11.0.tgz",
-      "integrity": "sha1-CWkdCXOjCtH4Ksc6EuIIfwpHVPk="
+      "version": "1.12.0",
+      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-1.12.0.tgz",
+      "integrity": "sha1-007++y7dp+HTtdvgcolRMhllFwk=",
+      "dependencies": {
+        "time-stamp": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/time-stamp/-/time-stamp-2.0.0.tgz",
+          "integrity": "sha1-lcakRTDhW6jW9KPsuMOj+sRto1c="
+        }
+      }
     },
     "webpack-dev-server": {
-      "version": "2.6.1",
-      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.6.1.tgz",
-      "integrity": "sha1-Cykqnaltr4CmWYj2n4e0Fm5d7+c=",
+      "version": "2.7.1",
+      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.7.1.tgz",
+      "integrity": "sha1-IVgPWgjNBlxxFEz29hw0W8pZqLg=",
       "dependencies": {
         "camelcase": {
           "version": "3.0.0",
@@ -10666,9 +11417,9 @@
           "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         },
         "timers-browserify": {
-          "version": "2.0.2",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.2.tgz",
-          "integrity": "sha1-q0iDz1l9zVCvIRNJoA+8pWrIa4Y="
+          "version": "2.0.3",
+          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.3.tgz",
+          "integrity": "sha512-+JAqyNgg+M8+gXIrq2EeUr4kZqRz47Ysco7X5QKRGScRE9HIHckyHD1asozSFGeqx2nmPCgA8T5tIGVO0ML7/w=="
         },
         "uglify-js": {
           "version": "2.7.5",
@@ -10747,9 +11498,9 @@
       "integrity": "sha1-+HfVv2SMl+WqVC+twW1qJZucEaE="
     },
     "which": {
-      "version": "1.2.14",
-      "resolved": "https://registry.npmjs.org/which/-/which-1.2.14.tgz",
-      "integrity": "sha1-mofEN48D6CfOyvGs31bHNsAcFOU="
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/which/-/which-1.3.0.tgz",
+      "integrity": "sha512-xcJpopdamTuY5duC/KnTTNBraPK54YwpenP4lzxU8H91GudWpFv38u0CKjclE1Wi2EH2EDz5LRcHcKbCIzqGyg=="
     },
     "which-module": {
       "version": "1.0.0",
@@ -10884,4 +11635,4 @@
       "integrity": "sha1-RCs4+denr3rke/z8NWhz6GFq0bc="
     }
   }
-}
\ No newline at end of file
+}

From 689c2efdb5a5612cdaee801b63040f5a482f388f Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Wed, 9 Aug 2017 11:32:45 -0700
Subject: [PATCH 0391/1641] Enhancement: added ability to customize calendar's
 navigation icons. (#2444)

* no message

* Adding arrow customization functionality

* no message

* change file

* Removing new dependencies from json
---
 ...-CalendarArrowStyles_2017-08-09-16-51.json | 11 ++++++++++
 package.json                                  |  2 +-
 .../src/components/Calendar/Calendar.Props.ts | 20 +++++++++++++++++++
 .../src/components/Calendar/Calendar.tsx      | 16 ++++++++++++---
 .../src/components/Calendar/CalendarDay.tsx   | 11 ++++++----
 .../src/components/Calendar/CalendarMonth.tsx | 11 ++++++----
 6 files changed, 59 insertions(+), 12 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-CalendarArrowStyles_2017-08-09-16-51.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-CalendarArrowStyles_2017-08-09-16-51.json b/common/changes/office-ui-fabric-react/kegorr-CalendarArrowStyles_2017-08-09-16-51.json
new file mode 100644
index 0000000000000..30327ad0881c3
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-CalendarArrowStyles_2017-08-09-16-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Enhancement: added ability to customize calendar's navigation icons.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/package.json b/package.json
index 49425f49f0447..1334ba672658c 100644
--- a/package.json
+++ b/package.json
@@ -28,4 +28,4 @@
     "gulp": "^3.9.1",
     "yargs": "^6.5.0"
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
index 878344a8c7fad..0d38a45cab9e3 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
@@ -93,6 +93,11 @@ export interface ICalendarProps extends React.Props<Calendar> {
   * @defaultvalue false
   */
   highlightCurrentMonth?: boolean;
+
+  /**
+  * Customize navigation icons using ICalendarIconStrings
+  */
+  navigationIcons?: ICalendarIconStrings;
 }
 
 export interface ICalendarStrings {
@@ -145,3 +150,18 @@ export interface ICalendarStrings {
    */
   nextYearAriaLabel?: string;
 }
+
+export interface ICalendarIconStrings {
+  /**
+  * FabricMDL2Icons name for the left navigation icon
+  * @defaultvalue  'ChevronLeft'
+  */
+  leftNavigation?: string;
+
+  /**
+  * FabricMDL2Icons name for the right navigation icon
+  * @defaultvalue  'ChevronRight'
+  */
+  rightNavigation?: string;
+
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index bfde782f666de..b28200ab3ec21 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { ICalendar, ICalendarProps } from './Calendar.Props';
+import { ICalendar, ICalendarProps, ICalendarIconStrings } from './Calendar.Props';
 import { DayOfWeek, DateRangeType } from '../../utilities/dateValues/DateValues';
 import { CalendarDay } from './CalendarDay';
 import { CalendarMonth } from './CalendarMonth';
@@ -13,6 +13,13 @@ import {
 import * as stylesImport from './Calendar.scss';
 const styles: any = stylesImport;
 
+const leftArrow: string = 'ChevronLeft';
+const rightArrow: string = 'ChevronRight';
+let iconStrings: ICalendarIconStrings = {
+  leftNavigation: leftArrow,
+  rightNavigation: rightArrow
+};
+
 export interface ICalendarState {
   /** The currently focused date in the calendar, but not necessarily selected */
   navigatedDate?: Date;
@@ -34,7 +41,8 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     autoNavigateOnSelection: false,
     showGoToToday: true,
     strings: null,
-    highlightCurrentMonth: false
+    highlightCurrentMonth: false,
+    navigationIcons: iconStrings
   };
 
   public refs: {
@@ -89,7 +97,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
 
   public render() {
     let rootClass = 'ms-DatePicker';
-    let { firstDayOfWeek, dateRangeType, strings, isMonthPickerVisible, isDayPickerVisible, autoNavigateOnSelection, showGoToToday, highlightCurrentMonth } = this.props;
+    let { firstDayOfWeek, dateRangeType, strings, isMonthPickerVisible, isDayPickerVisible, autoNavigateOnSelection, showGoToToday, highlightCurrentMonth, navigationIcons } = this.props;
     let { selectedDate, navigatedDate } = this.state;
 
     return (
@@ -116,6 +124,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   dateRangeType={ dateRangeType! }
                   autoNavigateOnSelection={ autoNavigateOnSelection! }
                   strings={ strings! }
+                  navigationIcons={ navigationIcons! }
                   ref='dayPicker' />
                 }
 
@@ -125,6 +134,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   onNavigateDate={ this._onNavigateDate }
                   today={ this.props.today }
                   highlightCurrentMonth={ highlightCurrentMonth! }
+                  navigationIcons={ navigationIcons! }
                   ref='monthPicker' /> }
 
                 { showGoToToday &&
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index 68ad078fea24c..105e14298492a 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -8,7 +8,7 @@ import {
   getRTL,
   getRTLSafeKeyCode
 } from '../../Utilities';
-import { ICalendarStrings } from './Calendar.Props';
+import { ICalendarStrings, ICalendarIconStrings } from './Calendar.Props';
 import { DayOfWeek, DateRangeType } from '../../utilities/dateValues/DateValues';
 import { FocusZone } from '../../FocusZone';
 import { Icon } from '../../Icon';
@@ -48,6 +48,7 @@ export interface ICalendarDayProps extends React.Props<CalendarDay> {
   firstDayOfWeek: DayOfWeek;
   dateRangeType: DateRangeType;
   autoNavigateOnSelection: boolean;
+  navigationIcons: ICalendarIconStrings;
   today?: Date;
 }
 
@@ -84,9 +85,11 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
 
   public render() {
     let { activeDescendantId, weeks } = this.state;
-    let { firstDayOfWeek, strings, navigatedDate, onSelectDate } = this.props;
+    let { firstDayOfWeek, strings, navigatedDate, onSelectDate, navigationIcons } = this.props;
     let dayPickerId = getId('DatePickerDay-dayPicker');
     let monthAndYearId = getId('DatePickerDay-monthAndYear');
+    let leftNavigationIcon = navigationIcons.leftNavigation;
+    let rightNavigationIcon = navigationIcons.rightNavigation;
 
     return (
       <div className={ css('ms-DatePicker-dayPicker', styles.dayPicker) } id={ dayPickerId }>
@@ -106,7 +109,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
               aria-label={ strings.prevMonthAriaLabel }
               role='button'
               tabIndex={ 0 }>
-              <Icon iconName={ getRTL() ? 'ChevronRight' : 'ChevronLeft' } />
+              <Icon iconName={ getRTL() ? rightNavigationIcon : leftNavigationIcon } />
             </span >
             <span
               className={ css('ms-DatePicker-nextMonth js-nextMonth', styles.nextMonth) }
@@ -116,7 +119,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
               aria-label={ strings.nextMonthAriaLabel }
               role='button'
               tabIndex={ 0 }>
-              <Icon iconName={ getRTL() ? 'ChevronLeft' : 'ChevronRight' } />
+              <Icon iconName={ getRTL() ? leftNavigationIcon : rightNavigationIcon } />
             </span >
           </div >
           <div className={ css('ms-DatePicker-headerToggleView js-showMonthPicker', styles.headerToggleView) } />
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
index c2f523aa37e9c..b632c5b19006c 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
@@ -5,7 +5,7 @@ import {
   css,
   getRTL
 } from '../../Utilities';
-import { ICalendarStrings } from './Calendar.Props';
+import { ICalendarStrings, ICalendarIconStrings } from './Calendar.Props';
 import { FocusZone } from '../../FocusZone';
 import { addYears, setMonth } from '../../utilities/dateMath/DateMath';
 import { Icon } from '../../Icon';
@@ -19,6 +19,7 @@ export interface ICalendarMonthProps extends React.Props<CalendarMonth> {
   onNavigateDate: (date: Date, focusOnNavigatedDay: boolean) => void;
   today?: Date;
   highlightCurrentMonth: boolean;
+  navigationIcons: ICalendarIconStrings;
 }
 
 export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
@@ -45,7 +46,9 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
 
   public render() {
 
-    let { navigatedDate, strings, today, highlightCurrentMonth } = this.props;
+    let { navigatedDate, strings, today, highlightCurrentMonth, navigationIcons } = this.props;
+    let leftNavigationIcon = navigationIcons.leftNavigation;
+    let rightNavigationIcon = navigationIcons.rightNavigation;
 
     return (
       <div className={ css('ms-DatePicker-monthPicker', styles.monthPicker) }>
@@ -62,7 +65,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
               aria-label={ strings.prevYearAriaLabel }
               role='button'
               tabIndex={ 0 }>
-              <Icon iconName={ getRTL() ? 'ChevronRight' : 'ChevronLeft' } />
+              <Icon iconName={ getRTL() ? rightNavigationIcon : leftNavigationIcon } />
             </span>
             <span
               className={ css('ms-DatePicker-nextYear js-nextYear', styles.nextYear) }
@@ -71,7 +74,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
               aria-label={ strings.nextYearAriaLabel }
               role='button'
               tabIndex={ 0 }>
-              <Icon iconName={ getRTL() ? 'ChevronLeft' : 'ChevronRight' } />
+              <Icon iconName={ getRTL() ? leftNavigationIcon : rightNavigationIcon } />
             </span>
           </div>
           <div className={ css('ms-DatePicker-currentYear js-showYearPicker', styles.currentYear) }>{ navigatedDate.getFullYear() }</div>

From 229c80f37742637827bec2afc52a978efc2fcadc Mon Sep 17 00:00:00 2001
From: Ryan Delaney <rrdelaney@outlook.com>
Date: Wed, 9 Aug 2017 11:34:32 -0700
Subject: [PATCH 0392/1641] Move registering FocusZone instance to
 componentDidMount (#2349)

* Move registering instance to cDM

* Add change file
---
 .../focus-zone-cdm_2017-08-01-00-34.json              | 11 +++++++++++
 .../src/components/FocusZone/FocusZone.tsx            |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/focus-zone-cdm_2017-08-01-00-34.json

diff --git a/common/changes/office-ui-fabric-react/focus-zone-cdm_2017-08-01-00-34.json b/common/changes/office-ui-fabric-react/focus-zone-cdm_2017-08-01-00-34.json
new file mode 100644
index 0000000000000..a348828988a5b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/focus-zone-cdm_2017-08-01-00-34.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Move registering FocusZone instance to componentDidMount",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "rydelan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index b9098e1fd08de..0fae456213853 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -62,7 +62,6 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     this._warnDeprecations({ rootProps: undefined });
 
     this._id = getId('FocusZone');
-    _allInstances[this._id] = this;
 
     this._focusAlignment = {
       left: 0,
@@ -71,6 +70,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   }
 
   public componentDidMount() {
+    _allInstances[this._id] = this;
     const windowElement = this.refs.root.ownerDocument.defaultView;
 
     let parentElement = getParent(this.refs.root);

From 709a3da96e538f46e3c6ff7ba722550cc4cedfcc Mon Sep 17 00:00:00 2001
From: Elizabeth Craig <ecraig12345@gmail.com>
Date: Wed, 9 Aug 2017 16:20:21 -0700
Subject: [PATCH 0393/1641] Nav: fix bug with sublink padding (#2450)

Add the sublink padding components as numbers rather than concatenating strings.
---
 .../elcraig-nav_2017-08-09-22-35.json                 | 11 +++++++++++
 .../office-ui-fabric-react/src/components/Nav/Nav.tsx |  6 +++---
 2 files changed, 14 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/elcraig-nav_2017-08-09-22-35.json

diff --git a/common/changes/office-ui-fabric-react/elcraig-nav_2017-08-09-22-35.json b/common/changes/office-ui-fabric-react/elcraig-nav_2017-08-09-22-35.json
new file mode 100644
index 0000000000000..33c76951abb49
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/elcraig-nav_2017-08-09-22-35.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Nav: fix bug with sublink padding",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "elcraig@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
index 193f775bac084..910453100375a 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
@@ -106,15 +106,15 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
     // Determine the appropriate padding to add before this link.
     // In RTL, the "before" padding will go on the right instead of the left.
     const isRtl: boolean = getRTL();
-    const paddingBefore: string = (_indentationSize * nestingLevel) +
-      String(this._hasExpandButton ? _indentWithExpandButton : _indentNoExpandButton) + 'px';
+    const paddingBefore = _indentationSize * nestingLevel +
+      (this._hasExpandButton ? _indentWithExpandButton : _indentNoExpandButton);
     // Prevent hijacking of the parent window if link.target is defined
     const rel = link.url && link.target && !isRelativeUrl(link.url) ? 'noopener noreferrer' : undefined;
 
     return (
       <a
         className={ css('ms-Nav-link', styles.link) }
-        style={ { [isRtl ? 'paddingRight' : 'paddingLeft']: paddingBefore } }
+        style={ { [isRtl ? 'paddingRight' : 'paddingLeft']: paddingBefore + 'px' } }
         href={ link.url || 'javascript:' }
         onClick={ this._onNavAnchorLinkClicked.bind(this, link) }
         aria-label={ link.ariaLabel }

From d5c814642cc050fea38ca3310cd222783ff7a678 Mon Sep 17 00:00:00 2001
From: Aniket Handa <atneik@users.noreply.github.com>
Date: Wed, 9 Aug 2017 23:35:15 -0700
Subject: [PATCH 0394/1641] HoverCard: Add target (#2451)

* HoverCard: Add target

* Add rush change

* Nit
---
 ...han-hovercard-target_2017-08-09-23-26.json |  11 ++
 .../components/HoverCard/HoverCard.Props.ts   |   5 +
 .../src/components/HoverCard/HoverCard.tsx    |  38 +++--
 .../components/HoverCard/HoverCardPage.tsx    |   5 +
 .../examples/HoverCard.Target.Example.tsx     | 138 ++++++++++++++++++
 5 files changed, 183 insertions(+), 14 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/anihan-hovercard-target_2017-08-09-23-26.json
 create mode 100644 packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/anihan-hovercard-target_2017-08-09-23-26.json b/common/changes/office-ui-fabric-react/anihan-hovercard-target_2017-08-09-23-26.json
new file mode 100644
index 0000000000000..72b1ce2b07f70
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/anihan-hovercard-target_2017-08-09-23-26.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add target to hover card",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "atneik@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts
index 10126c98d318b..c86817de6de7e 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts
@@ -62,6 +62,11 @@ export interface IHoverCardProps extends React.HTMLAttributes<HTMLDivElement | H
    * Custom styles for this component
    */
   styles?: IHoverCardStyles;
+
+  /**
+   * Optional target element to tag hover card on
+   */
+  target?: HTMLElement;
 }
 
 export interface IHoverCardStyles {
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
index 6394f0694c3b5..0732bcb36ec11 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
@@ -45,6 +45,16 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
     };
   }
 
+  public componentDidMount() {
+    const target = this._getTargetElement();
+
+    this._events.on(target, 'mouseenter', this._cardOpen);
+    this._events.on(target, 'mouseleave', this._cardDismiss);
+    this._events.on(target, 'focus', this._cardOpen);
+    this._events.on(target, 'blur', this._cardDismiss);
+    this.props.instantOpenOnClick && this._events.on(target, 'click', this._instantOpenExpanded);
+  }
+
   public componentWillUpdate(newProps: IHoverCardProps, newState: IHoverCardState) {
     if (newState.isHoverCardVisible !== this.state.isHoverCardVisible) {
       if (newState.isHoverCardVisible) {
@@ -84,11 +94,6 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
       <div
         className={ css(this._styles.host) }
         ref={ this._resolveRef('_hoverCard') }
-        onFocusCapture={ this._cardOpen }
-        onBlurCapture={ this._cardDismiss }
-        onMouseEnter={ this._cardOpen }
-        onMouseLeave={ this._cardDismiss }
-        onClick={ onClick }
         aria-describedby={ setAriaDescribedBy && isHoverCardVisible ? hoverCardId : undefined }
       >
         { children }
@@ -108,12 +113,12 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
   }
 
   private _getTargetElement(): HTMLElement {
-    return this._hoverCard;
+    return this.props.target ? this.props.target : this._hoverCard;
   }
 
   // Show HoverCard
   @autobind
-  private _cardOpen(ev: any) {
+  private _cardOpen(ev: MouseEvent) {
     this._async.clearTimeout(this._dismissTimerId);
 
     this._openTimerId = this._async.setTimeout(() => {
@@ -128,16 +133,21 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
 
   // Hide HoverCard
   @autobind
-  private _cardDismiss(ev: React.MouseEvent<HTMLDivElement> | React.FocusEvent<HTMLDivElement>) {
-    const eventType = ev.type;
+  private _cardDismiss(ev: MouseEvent) {
+    const { type, x, y } = ev;
     this._async.clearTimeout(this._openTimerId);
 
     this._dismissTimerId = this._async.setTimeout(() => {
-      if (!(this.props.sticky && eventType === 'mouseleave')) {
-        this.setState({
-          isHoverCardVisible: false,
-          mode: ExpandingCardMode.compact
-        });
+      if (!(this.props.sticky && type === 'mouseleave')) {
+        const rect = this._hoverCard.getBoundingClientRect();
+        // handle the case when dismiss is called by target when cursor moves towards the card.
+        const isInsideCard: boolean = x <= rect.right && x >= rect.left && y >= rect.top;
+        if (!isInsideCard) {
+          this.setState({
+            isHoverCardVisible: false,
+            mode: ExpandingCardMode.compact
+          });
+        }
       }
     }, this.props.cardDismissDelay!);
   }
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx
index d058d93f6694c..9fabde92e4229 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx
@@ -7,10 +7,12 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { HoverCardBasicExample } from './examples/HoverCard.Basic.Example';
+import { HoverCardTargetExample } from './examples/HoverCard.Target.Example';
 
 import './HoverCardPage.scss';
 
 const HoverCardBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx') as string;
+const HoverCardTargetExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx') as string;
 
 export class HoverCardPage extends React.Component<any, any> {
   public render() {
@@ -23,6 +25,9 @@ export class HoverCardPage extends React.Component<any, any> {
             <ExampleCard title='HoverCard' code={ HoverCardBasicExampleCode }>
               <HoverCardBasicExample />
             </ExampleCard>
+            <ExampleCard title='HoverCard using Target' code={ HoverCardTargetExampleCode }>
+              <HoverCardTargetExample />
+            </ExampleCard>
           </LayerHost>
         }
         propertiesTables={
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
new file mode 100644
index 0000000000000..178e09f519fe0
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
@@ -0,0 +1,138 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+/* tslint:enable:no-unused-variable */
+import { BaseComponent, IRenderFunction } from 'office-ui-fabric-react/lib/Utilities';
+import {
+  HoverCard,
+  IExpandingCardProps
+} from 'office-ui-fabric-react/lib/HoverCard';
+import { DetailsList, buildColumns, IColumn } from 'office-ui-fabric-react/lib/DetailsList';
+import { autobind, css } from 'office-ui-fabric-react/lib/Utilities';
+import { createListItems } from '@uifabric/example-app-base';
+import './HoverCard.Example.scss';
+
+let _items: any[];
+
+export interface IHoverCardExampleState {
+  items?: any[];
+  columns?: IColumn[];
+}
+
+interface IHoverCardFieldProps {
+  componentRef?: any;
+  content: HTMLDivElement;
+  expandingCardProps: IExpandingCardProps;
+}
+
+interface IHoverCardFieldState {
+  contentRendered?: HTMLDivElement;
+}
+
+class HoverCardField extends BaseComponent<IHoverCardFieldProps, IHoverCardFieldState> {
+  constructor(props: IHoverCardFieldProps) {
+    super(props);
+
+    this.state = {
+      contentRendered: undefined
+    };
+  }
+
+  public render() {
+    return (
+      <div ref={ (c: HTMLDivElement) => !this.state.contentRendered && this.setState({ contentRendered: c }) } >
+        { this.props.content }
+        {
+          this.state.contentRendered &&
+          <HoverCard
+            expandingCardProps={ this.props.expandingCardProps }
+            instantOpenOnClick={ true }
+            target={ this.state.contentRendered }
+          />
+        }
+      </div>
+    );
+  }
+}
+
+export class HoverCardTargetExample extends BaseComponent<{}, IHoverCardExampleState> {
+
+  constructor(props: {}) {
+    super(props);
+
+    _items = _items || createListItems(10);
+
+    this.state = {
+      items: _items,
+      columns: _buildColumns()
+    };
+  }
+
+  public render() {
+    let { items, columns } = this.state;
+
+    return (
+      <div>
+        <p> Hover over location of a row item to see the card </p>
+        <DetailsList
+          setKey='hoverSet'
+          items={ items! }
+          columns={ columns }
+          onRenderItemColumn={ this._onRenderItemColumn }
+        />
+      </div>
+    );
+  }
+
+  @autobind
+  private _onRenderItemColumn(item: any, index: number, column: IColumn) {
+    const expandingCardProps: IExpandingCardProps = {
+      onRenderCompactCard: this._onRenderCompactCard,
+      onRenderExpandedCard: this._onRenderExpandedCard,
+      renderData: item
+    };
+
+    if (column.key === 'location') {
+      return (
+        <div className='HoverCard-item'>
+          <HoverCardField
+            content={ item.location }
+            expandingCardProps={ expandingCardProps }
+          />
+        </div>
+      );
+    }
+
+    return item[column.key];
+  }
+
+  @autobind
+  private _onRenderCompactCard(item: any): JSX.Element {
+    return (
+      <div className='hoverCardExample-compactCard'>
+        <a target='_blank' href={ `http://wikipedia.org/wiki/${item.location}` }>
+          { item.location }
+        </a>
+      </div>
+    );
+  }
+
+  @autobind
+  private _onRenderExpandedCard(item: any): JSX.Element {
+    let { items, columns } = this.state;
+    return (
+      <div className='hoverCardExample-expandedCard'>
+        { item.description }
+        <DetailsList
+          setKey='expandedCardSet'
+          items={ items! }
+          columns={ columns }
+        />
+      </div>
+    );
+  }
+}
+
+function _buildColumns() {
+  return buildColumns(_items).filter(column => column.name === 'location' || column.name === 'key');
+}
\ No newline at end of file

From fc45ed06eb7be4a1273333eabd751bd1b868df0f Mon Sep 17 00:00:00 2001
From: Aniket Handa <atneik@users.noreply.github.com>
Date: Thu, 10 Aug 2017 00:25:11 -0700
Subject: [PATCH 0395/1641] Update CODEOWNERS (#2455)

---
 .github/CODEOWNERS | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index 03733e9da6cd0..239a0285606e7 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -52,7 +52,7 @@
     # packages/office-ui-fabric-react/src/components/FocusTrapZone/*
     # packages/office-ui-fabric-react/src/components/FocusZone/*
     # packages/office-ui-fabric-react/src/components/GroupedList/*
-    packages/office-ui-fabric-react/src/components/HoverCard/*   @atneik
+    packages/office-ui-fabric-react/src/components/HoverCard/*   @atneik @micahgodbolt
     # packages/office-ui-fabric-react/src/components/Icon/*
     # packages/office-ui-fabric-react/src/components/Image/*
     # packages/office-ui-fabric-react/src/components/Label/*

From 741bf74775697aa459121b4b1b81af7e44138991 Mon Sep 17 00:00:00 2001
From: Stanley Yao <stanley.yao@microsoft.com>
Date: Thu, 10 Aug 2017 11:33:42 -0700
Subject: [PATCH 0396/1641] Add onFocus and onBlur for Pickers, SpinButton,
 SearchBox, and Rating. Add IBasePicker with focus(). (#2445)

* Add onFocus and onBlur for Pickers, SpinButton, SearchBox, and Rating. Add IBasePicker with focus().

* Add rush change file

* Resolve some merge issues

* Resolve some merge issues

* Fix some merge issues

* Removed some redundancy

* Update picker examples accordingly
---
 .../stanleyy-onblur_2017-08-09-17-27.json     | 11 +++++
 .../examples/ComboBox.Basic.Example.tsx       | 16 ++++++
 .../examples/Dropdown.Basic.Example.tsx       |  9 ++++
 .../src/components/Rating/Rating.tsx          |  8 +++
 .../Rating/examples/Rating.Basic.Example.tsx  |  8 +++
 .../src/components/SearchBox/SearchBox.tsx    | 10 +++-
 .../examples/SearchBox.FullSize.Example.tsx   |  5 +-
 .../examples/SearchBox.Small.Example.tsx      |  2 +
 .../components/SpinButton/SpinButton.Props.ts | 10 ++++
 .../src/components/SpinButton/SpinButton.tsx  | 11 +++--
 .../examples/SpinButton.Basic.Example.tsx     |  2 +
 .../SpinButton.BasicDisabled.Example.tsx      |  2 +
 ...pinButton.BasicWithEndPosition.Example.tsx |  2 +
 .../SpinButton.BasicWithIcon.Example.tsx      |  2 +
 .../examples/SpinButton.Stateful.Example.tsx  |  2 +
 .../Toggle/examples/Toggle.Basic.Example.tsx  | 20 ++++++--
 .../components/pickers/BasePicker.Props.ts    | 22 ++++++++-
 .../src/components/pickers/BasePicker.tsx     |  7 ++-
 .../examples/PeoplePicker.Types.Example.tsx   | 49 +++++++++++++++++++
 .../examples/Picker.CustomResult.Example.tsx  |  4 ++
 .../examples/TagPicker.Basic.Example.tsx      |  4 ++
 21 files changed, 194 insertions(+), 12 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/stanleyy-onblur_2017-08-09-17-27.json

diff --git a/common/changes/office-ui-fabric-react/stanleyy-onblur_2017-08-09-17-27.json b/common/changes/office-ui-fabric-react/stanleyy-onblur_2017-08-09-17-27.json
new file mode 100644
index 0000000000000..17163a289e61c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/stanleyy-onblur_2017-08-09-17-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add onFocus and onBlur for Pickers, SpinButton, SearchBox, and Rating. Add IBasePicker with focus().",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "stanleyy@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
index 34d47827600eb..43f603e40a473 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
@@ -58,6 +58,8 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
           autoComplete='on'
           options={ this._testOptions }
           onRenderOption={ this._onRenderFontOption }
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
         />
 
         <ComboBox
@@ -69,6 +71,8 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
           autoComplete='off'
           options={ this._testOptions }
           onRenderOption={ this._onRenderFontOption }
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
         />
 
         <ComboBox
@@ -80,6 +84,8 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
           autoComplete='on'
           options={ this._testOptions }
           onRenderOption={ this._onRenderFontOption }
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
         />
 
         <ComboBox
@@ -91,6 +97,8 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
           autoComplete='off'
           options={ this._testOptions }
           onRenderOption={ this._onRenderFontOption }
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
         />
 
         <ComboBox
@@ -100,6 +108,8 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
           errorMessage='Error! Here is some text!'
           options={ this._testOptions }
           onRenderOption={ this._onRenderFontOption }
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
         />
 
         <ComboBox
@@ -117,6 +127,8 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
             ]
           }
           disabled={ true }
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
         />
 
         { value ?
@@ -131,6 +143,8 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
             onResolveOptions={ this._getOptions }
             value={ value && value }
             onRenderOption={ this._onRenderFontOption }
+            onFocus={ () => console.log('onFocus called') }
+            onBlur={ () => console.log('onBlur called') }
           />
           :
           <ComboBox
@@ -144,6 +158,8 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
             onChanged={ this._onChanged }
             onResolveOptions={ this._getOptions }
             onRenderOption={ this._onRenderFontOption }
+            onFocus={ () => console.log('onFocus called') }
+            onBlur={ () => console.log('onBlur called') }
           />
         }
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
index de794b1ec0f7d..184c20410f8b6 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
@@ -38,6 +38,8 @@ export class DropdownBasicExample extends React.Component<any, any> {
               { key: 'J', text: 'Option j' },
             ]
           }
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
         />
 
         <Dropdown
@@ -54,6 +56,8 @@ export class DropdownBasicExample extends React.Component<any, any> {
               { key: 'G', text: 'Option g' },
             ]
           }
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
           disabled={ true }
         />
 
@@ -61,6 +65,7 @@ export class DropdownBasicExample extends React.Component<any, any> {
           label='Controlled example:'
           selectedKey={ selectedItem && selectedItem.key }
           onChanged={ (item) => this.setState({ selectedItem: item }) }
+          onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
           placeHolder='Select an Option'
           options={
@@ -82,6 +87,7 @@ export class DropdownBasicExample extends React.Component<any, any> {
           label='Multi-Select uncontrolled example:'
           defaultSelectedKeys={ ['Apple', 'Banana'] }
           onChanged={ (item) => this.changeState(item) }
+          onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
           multiSelect
           options={
@@ -105,6 +111,7 @@ export class DropdownBasicExample extends React.Component<any, any> {
           label='Multi-Select controlled example:'
           selectedKeys={ selectedItem && selectedItem.key }
           onChanged={ (item) => this.onChangeMultiSelect(item) }
+          onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
           multiSelect
           options={
@@ -138,6 +145,8 @@ export class DropdownBasicExample extends React.Component<any, any> {
             ]
           }
           disabled={ true }
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
         />
       </div>
 
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx b/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
index 64d043c9532ff..4357035d17abf 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
@@ -90,12 +90,20 @@ export class Rating extends BaseComponent<IRatingProps, IRatingState> {
     this.setState({
       focusedRating: value
     } as IRatingState);
+
+    if (this.props.onFocus) {
+      this.props.onFocus(ev);
+    }
   }
 
   private _onBlur(option: number, ev: React.FocusEvent<HTMLElement>): void {
     this.setState({
       focusedRating: null
     } as IRatingState);
+
+    if (this.props.onBlur) {
+      this.props.onBlur(ev);
+    }
   }
 
   private _onChange(rating: number, evt: React.FormEvent<HTMLInputElement>) {
diff --git a/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx
index 530f0c67da87b..7e9b2e7ac9b98 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx
@@ -24,6 +24,8 @@ export class RatingBasicExample extends React.Component<any, any> {
           max={ 5 }
           rating={ this.state.rating }
           onChanged={ this._onChanged }
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
         />
 
         <Rating
@@ -32,6 +34,8 @@ export class RatingBasicExample extends React.Component<any, any> {
           size={ RatingSize.Large }
           rating={ this.state.rating }
           onChanged={ this._onChanged }
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
         />
 
         <Rating
@@ -40,6 +44,8 @@ export class RatingBasicExample extends React.Component<any, any> {
           size={ RatingSize.Large }
           rating={ this.state.rating }
           onChanged={ this._onChanged }
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
         />
 
         Disabled:
@@ -49,6 +55,8 @@ export class RatingBasicExample extends React.Component<any, any> {
           rating={ this.state.rating }
           onChanged={ this._onChanged }
           disabled={ true }
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
         />
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
index b937c4fb88894..a7f27e1c7c6a8 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
@@ -115,6 +115,10 @@ export class SearchBox extends BaseComponent<ISearchBoxProps, ISearchBoxState> {
     });
 
     this._events.on(this._rootElement, 'blur', this._onBlur, true);
+
+    if (this.props.onFocus) {
+      this.props.onFocus(ev as React.FocusEvent<HTMLInputElement>);
+    }
   }
 
   @autobind
@@ -141,11 +145,15 @@ export class SearchBox extends BaseComponent<ISearchBoxProps, ISearchBoxState> {
   }
 
   @autobind
-  private _onBlur(ev: React.ChangeEvent<HTMLInputElement>) {
+  private _onBlur(ev: React.FocusEvent<HTMLInputElement>) {
     this._events.off(this._rootElement, 'blur');
     this.setState({
       hasFocus: false
     });
+
+    if (this.props.onBlur) {
+      this.props.onBlur(ev);
+    }
   }
 
   @autobind
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.FullSize.Example.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.FullSize.Example.tsx
index bdb3ccd373128..3b3a2f491aa83 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.FullSize.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.FullSize.Example.tsx
@@ -4,7 +4,10 @@ import { SearchBox } from 'office-ui-fabric-react/lib/SearchBox';
 export class SearchBoxFullSizeExample extends React.Component<any, any> {
   public render() {
     return (
-      <SearchBox />
+      <SearchBox
+        onFocus={ () => console.log('onFocus called') }
+        onBlur={ () => console.log('onBlur called') }
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Small.Example.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Small.Example.tsx
index f3cf80b57f8b4..0d5997cb77369 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Small.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Small.Example.tsx
@@ -11,6 +11,8 @@ export class SearchBoxSmallExample extends React.Component<any, any> {
         <SearchBox
           onChange={ (newValue) => console.log('SearchBox onChange fired: ' + newValue) }
           onSearch={ (newValue) => console.log('SearchBox onSearch fired: ' + newValue) }
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
         />
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts
index 7152f09628fc7..9d3b651bac1bf 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts
@@ -107,6 +107,16 @@ export interface ISpinButtonProps {
    */
   onDecrement?: (value: string) => string | void;
 
+  /**
+   * A callback for when the user put focus on the picker
+   */
+  onFocus?: React.FocusEventHandler<HTMLInputElement>;
+
+  /**
+   * A callback for when the user moves the focus away from the picker
+   */
+  onBlur?: React.FocusEventHandler<HTMLInputElement>;
+
   /**
    * Icon for the increment button of the spinButton
    */
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index ad635644405f1..00baae970a85f 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -102,8 +102,6 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
       this._onIncrement = this._defaultOnIncrement;
       this._onDecrement = this._defaultOnDecrement;
     }
-
-    this.focus = this.focus.bind(this);
   }
 
   /**
@@ -240,7 +238,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
   }
 
   @autobind
-  private _onFocus() {
+  private _onFocus(ev: React.FocusEvent<HTMLInputElement>) {
     if (this._spinningByMouse || this.state.keyboardSpinDirection !== KeyboardSpinDirection.notSpinning) {
       this._stop();
     }
@@ -248,12 +246,19 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
     this._input.select();
 
     this.setState({ isFocused: true });
+
+    if (this.props.onFocus) {
+      this.props.onFocus(ev);
+    }
   }
 
   @autobind
   private _onBlur(ev: React.FocusEvent<HTMLInputElement>): void {
     this._validate(ev);
     this.setState({ isFocused: false });
+    if (this.props.onBlur) {
+      this.props.onBlur(ev);
+    }
   }
 
   /**
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx
index 284dfb2c945b2..a859c44ccc525 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx
@@ -11,6 +11,8 @@ export class SpinButtonBasicExample extends React.Component<any, any> {
           min={ 0 }
           max={ 100 }
           step={ 1 }
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
         />
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicDisabled.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicDisabled.Example.tsx
index ba78d89b74575..873cc743e98d0 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicDisabled.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicDisabled.Example.tsx
@@ -12,6 +12,8 @@ export class SpinButtonBasicDisabledExample extends React.Component<any, any> {
           max={ 100 }
           step={ 1 }
           disabled={ true }
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
         />
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithEndPosition.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithEndPosition.Example.tsx
index be0e929dbd316..4a59b63332cd0 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithEndPosition.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithEndPosition.Example.tsx
@@ -14,6 +14,8 @@ export class SpinButtonBasicWithEndPositionExample extends React.Component<any,
           min={ 0 }
           max={ 100 }
           step={ 1 }
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
         />
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx
index 52ed163a323f9..41f629629712d 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx
@@ -12,6 +12,8 @@ export class SpinButtonBasicWithIconExample extends React.Component<any, any> {
           min={ 0 }
           max={ 100 }
           step={ 1 }
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
         />
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
index 8dab8ed7894ae..d34e59081c4aa 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
@@ -26,6 +26,8 @@ export class SpinButtonStatefulExample extends React.Component<any, any> {
             value = this.removeSuffix(value, suffix);
             return String(+value - 2) + suffix;
           } }
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
         />
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/examples/Toggle.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Toggle/examples/Toggle.Basic.Example.tsx
index 339881ba480cc..c4b47bdbdba8a 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/examples/Toggle.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/examples/Toggle.Basic.Example.tsx
@@ -11,23 +11,35 @@ export const ToggleBasicExample = () => (
       onAriaLabel='This toggle is checked. Press to uncheck.'
       offAriaLabel='This toggle is unchecked. Press to check.'
       onText='On'
-      offText='Off' />
+      offText='Off'
+      onFocus={ () => console.log('onFocus called') }
+      onBlur={ () => console.log('onBlur called') }
+    />
     <Toggle
       defaultChecked={ false }
       label='Enabled and unchecked'
       onText='On'
-      offText='Off' />
+      offText='Off'
+      onFocus={ () => console.log('onFocus called') }
+      onBlur={ () => console.log('onBlur called') }
+    />
     <Toggle
       defaultChecked={ true }
       disabled={ true }
       label='Disabled and checked'
       onText='On'
-      offText='Off' />
+      offText='Off'
+      onFocus={ () => console.log('onFocus called') }
+      onBlur={ () => console.log('onBlur called') }
+    />
     <Toggle
       defaultChecked={ false }
       disabled={ true }
       label='Disabled and unchecked'
       onText='On'
-      offText='Off' />
+      offText='Off'
+      onFocus={ () => console.log('onFocus called') }
+      onBlur={ () => console.log('onBlur called') }
+    />
   </div>
 );
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
index 7bf35288c63ab..1bd4c1e9d17fa 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
@@ -3,12 +3,21 @@ import { IPickerItemProps } from './PickerItem.Props';
 import { IPersonaProps } from '../Persona/Persona.Props';
 import { IRenderFunction } from '../../Utilities';
 import { ISuggestionModel } from './Suggestions/SuggestionsController';
+import { BaseAutoFill } from './AutoFill/BaseAutoFill';
+
+export interface IBasePicker<T> {
+  /** Gets the current value of the input. */
+  items: T[] | undefined;
+
+  /** Sets focus to the input. */
+  focus: () => void;
+}
 
 // Type T is the type of the item that is displayed
 // and searched for by the people picker. For example, if the picker is
 // displaying persona's than type T could either be of Persona or Ipersona props
 export interface IBasePickerProps<T> extends React.Props<any> {
-  componentRef?: () => void;
+  componentRef?: (component?: IBasePicker<T>) => void;
 
   /**
    * Function that specifies how the selected item will appear.
@@ -35,6 +44,17 @@ export interface IBasePickerProps<T> extends React.Props<any> {
    * A callback for when the selected list of items changes.
    */
   onChange?: (items?: T[]) => void;
+
+  /**
+   * A callback for when the user put focus on the picker
+   */
+  onFocus?: React.FocusEventHandler<HTMLInputElement | BaseAutoFill>;
+
+  /**
+   * A callback for when the user moves the focus away from the picker
+   */
+  onBlur?: React.FocusEventHandler<HTMLInputElement | BaseAutoFill>;
+
   /**
    * A callback to get text from an item. Used to autofill text in the pickers.
    */
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 58c476f8e8e03..bb8287f700e35 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -12,7 +12,7 @@ import { Selection, SelectionZone, SelectionMode } from '../../utilities/selecti
 import { Suggestions } from './Suggestions/Suggestions';
 import { ISuggestionsProps } from './Suggestions/Suggestions.Props';
 import { SuggestionsController } from './Suggestions/SuggestionsController';
-import { IBasePickerProps, ValidationState } from './BasePicker.Props';
+import { IBasePicker, IBasePickerProps, ValidationState } from './BasePicker.Props';
 import { BaseAutoFill } from './AutoFill/BaseAutoFill';
 import { IPickerItemProps } from './PickerItem.Props';
 import { IPersonaProps } from '../Persona/Persona.Props';
@@ -30,7 +30,7 @@ export interface IBasePickerState {
   isResultsFooterVisible?: boolean;
 }
 
-export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<P, IBasePickerState> {
+export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<P, IBasePickerState> implements IBasePicker<T> {
 
   protected selection: Selection;
 
@@ -383,6 +383,9 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
         suggestionsVisible: true
       });
     }
+    if (this.props.inputProps && this.props.inputProps.onFocus) {
+      this.props.inputProps.onFocus(ev as React.FocusEvent<HTMLInputElement>);
+    }
   }
 
   @autobind
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index 0ba9c025fad3a..72dad72283541 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -13,10 +13,12 @@ import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
 import {
   CompactPeoplePicker,
   IBasePickerSuggestionsProps,
+  IBasePicker,
   ListPeoplePicker,
   NormalPeoplePicker,
   ValidationState
 } from 'office-ui-fabric-react/lib/Pickers';
+import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
 import { IPersonaWithMenu } from 'office-ui-fabric-react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.Props';
 import { people, mru } from './PeoplePickerExampleData';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
@@ -49,6 +51,8 @@ const limitedSearchAdditionalProps: IBasePickerSuggestionsProps = {
 const limitedSearchSuggestionProps: IBasePickerSuggestionsProps = assign(limitedSearchAdditionalProps, suggestionProps);
 
 export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerExampleState> {
+  private _picker: IBasePicker<IPersonaProps>;
+
   constructor() {
     super();
     let peopleList: IPersonaWithMenu[] = [];
@@ -117,6 +121,9 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
             defaultChecked={ false }
             onChanged={ this._toggleDelayResultsChange } />
         </div>
+        <PrimaryButton
+          text='Set focus'
+          onClick={ this._onSetFocusButtonClicked } />
       </div>
     );
   }
@@ -132,6 +139,11 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
         key={ 'list' }
         onRemoveSuggestion={ this._onRemoveSuggestion }
         onValidateInput={ this._validateInput }
+        inputProps={ {
+          onBlur: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onBlur called'),
+          onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called')
+        } }
+        componentRef={ (component: IBasePicker<IPersonaProps>) => this._picker = component }
       />
     );
   }
@@ -148,6 +160,11 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
         onRemoveSuggestion={ this._onRemoveSuggestion }
         onValidateInput={ this._validateInput }
         removeButtonAriaLabel={ 'Remove' }
+        inputProps={ {
+          onBlur: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onBlur called'),
+          onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called')
+        } }
+        componentRef={ (component: IBasePicker<IPersonaProps>) => this._picker = component }
       />
     );
   }
@@ -162,6 +179,11 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
         className={ 'ms-PeoplePicker' }
         onRemoveSuggestion={ this._onRemoveSuggestion }
         onValidateInput={ this._validateInput }
+        inputProps={ {
+          onBlur: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onBlur called'),
+          onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called')
+        } }
+        componentRef={ (component: IBasePicker<IPersonaProps>) => this._picker = component }
       />
     );
   }
@@ -178,6 +200,11 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
         pickerSuggestionsProps={ suggestionProps }
         onRemoveSuggestion={ this._onRemoveSuggestion }
         onValidateInput={ this._validateInput }
+        inputProps={ {
+          onBlur: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onBlur called'),
+          onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called')
+        } }
+        componentRef={ (component: IBasePicker<IPersonaProps>) => this._picker = component }
       />
     );
   }
@@ -194,6 +221,11 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
         onGetMoreResults={ this._onFilterChanged }
         pickerSuggestionsProps={ limitedSearchSuggestionProps }
         onRemoveSuggestion={ this._onRemoveSuggestion }
+        inputProps={ {
+          onBlur: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onBlur called'),
+          onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called')
+        } }
+        componentRef={ (component: IBasePicker<IPersonaProps>) => this._picker = component }
       />
     );
   }
@@ -210,6 +242,11 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
         onValidateInput={ this._validateInput }
         removeButtonAriaLabel={ 'Remove' }
         onItemSelected={ this._onItemSelected }
+        inputProps={ {
+          onBlur: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onBlur called'),
+          onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called')
+        } }
+        componentRef={ (component: IBasePicker<IPersonaProps>) => this._picker = component }
       />
     );
   }
@@ -232,6 +269,11 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
           key={ 'controlled' }
           selectedItems={ this.state.currentSelectedItems }
           onChange={ this.onItemsChange.bind(this) }
+          inputProps={ {
+            onBlur: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onBlur called'),
+            onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called')
+          } }
+          componentRef={ (component: IBasePicker<IPersonaProps>) => this._picker = component }
         />
         <label> Click to Add a person </label>
         { controlledItems.map(item => <div>
@@ -254,6 +296,13 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     });
   }
 
+  @autobind
+  private _onSetFocusButtonClicked() {
+    if (this._picker) {
+      this._picker.focus();
+    }
+  }
+
   @autobind
   private _renderFooterText(): JSX.Element {
     return <div>No additional results</div>;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
index b5169800fbc6e..58e17fe4eac3c 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
@@ -345,6 +345,10 @@ export class PickerCustomResultExample extends React.Component<any, IPeoplePicke
             }
           }
           disabled={ this.state.isPickerDisabled }
+          inputProps={ {
+            onFocus: () => console.log('onFocus called'),
+            onBlur: () => console.log('onBlur called')
+          } }
         />
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
index 21f24b995b1eb..67de9f7ad7326 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
@@ -43,6 +43,10 @@ export class TagPickerBasicExample extends React.Component<{}, ITagPickerDemoPag
             }
           }
           disabled={ this.state.isPickerDisabled }
+          inputProps={ {
+            onBlur: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onBlur called'),
+            onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called')
+          } }
         />
       </div>
     );

From 7ac4aa1a0969d2195482d1bd9a6da99e95b16fc4 Mon Sep 17 00:00:00 2001
From: Elizabeth Craig <ecraig12345@gmail.com>
Date: Thu, 10 Aug 2017 13:15:18 -0700
Subject: [PATCH 0397/1641] Nav: Update isGroupCollapsed for new groups (#2454)

When the nav receives updated props, it should ensure that collapseByDefault is respected for any new groups.
---
 .../nav_2017-08-10-02-04.json                 | 11 +++++++++
 .../src/components/Nav/Nav.tsx                | 23 +++++++++++++++++++
 2 files changed, 34 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/nav_2017-08-10-02-04.json

diff --git a/common/changes/office-ui-fabric-react/nav_2017-08-10-02-04.json b/common/changes/office-ui-fabric-react/nav_2017-08-10-02-04.json
new file mode 100644
index 0000000000000..b96c778fdb6dd
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/nav_2017-08-10-02-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Nav: update isGroupCollapsed for new groups",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "elcraig@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
index 910453100375a..6d5364d5efb0a 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
@@ -56,6 +56,7 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
       isLinkExpandStateChanged: false,
       selectedKey: props.initialSelectedKey || props.selectedKey,
     };
+
     if (props.groups) {
       for (let group of props.groups) {
         if (group.collapseByDefault && group.name) {
@@ -66,6 +67,28 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
     this._hasExpandButton = false;
   }
 
+  public componentWillReceiveProps(newProps: INavProps) {
+    let newGroups = newProps.groups || [];
+    let isGroupCollapsed = this.state.isGroupCollapsed!;
+
+    // If the component's props were updated, new groups may have been added, which may have
+    // collapseByDefault set. Ensure that setting is respected for any new groups.
+    // (If isGroupCollapsed is already set for a group, don't overwrite that.)
+    let hasUpdated = false;
+    for (let newGroup of newGroups) {
+      if (newGroup.name && newGroup.collapseByDefault && !isGroupCollapsed.hasOwnProperty(newGroup.name)) {
+        isGroupCollapsed[newGroup.name] = true;
+        hasUpdated = true;
+      }
+    }
+
+    if (hasUpdated) {
+      this.setState({
+        isGroupCollapsed: isGroupCollapsed
+      });
+    }
+  }
+
   public render(): JSX.Element | null {
     const { groups, className, isOnTop } = this.props;
 

From 4672a8423b1156afe54ad8be7439e947170658f0 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Thu, 10 Aug 2017 15:04:53 -0700
Subject: [PATCH 0398/1641] ComboBox: Fixes to better account for some
 controlled cases (#2453)

* Update ComboBox to account for some controlled cases, like not automatically adding new options if we are controlled

* add change file

* Address feedback, update undefined check and simplify the newSelectedIndex since we know where it is without having to do extra work
---
 ...boBoxControlledFixes_2017-08-10-00-16.json | 11 ++++
 .../src/components/ComboBox/ComboBox.test.tsx | 39 +++++++++++
 .../src/components/ComboBox/ComboBox.tsx      | 65 +++++++++++--------
 3 files changed, 89 insertions(+), 26 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxControlledFixes_2017-08-10-00-16.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxControlledFixes_2017-08-10-00-16.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxControlledFixes_2017-08-10-00-16.json
new file mode 100644
index 0000000000000..d7c329a792bb1
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxControlledFixes_2017-08-10-00-16.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Fix some functionality for when the comboBox is controlled",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
index 76c7101c618e0..ecfb6127e7799 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
@@ -87,6 +87,45 @@ describe('ComboBox', () => {
     expect(inputElement.props().value).equals('1');
   });
 
+  it('New options are not automatically added when allowFreeform on in controlled case', () => {
+    let comboBoxRoot;
+    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any>;
+    let comboBoxComponent: any;
+    let wrapper = mount(
+      <ComboBox
+        label='testgroup'
+        options={ DEFAULT_OPTIONS }
+        allowFreeform={ true }
+        onChanged={ () => { return; } }
+        componentRef={ ref => comboBoxComponent = ref }
+      />);
+    comboBoxRoot = wrapper.find('.ms-ComboBox');
+    inputElement = comboBoxRoot.find('input');
+    inputElement.simulate('change', { target: { value: 'f' } });
+    inputElement.simulate('keydown', { which: KeyCodes.enter });
+    expect((comboBoxComponent as React.Component<any, any>).state.currentOptions.length).equals(DEFAULT_OPTIONS.length);
+  });
+
+  it('New options are automatically added when allowFreeform on in uncontrolled case', () => {
+    let comboBoxRoot;
+    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any>;
+    let comboBoxComponent: any;
+    let wrapper = mount(
+      <ComboBox
+        label='testgroup'
+        options={ DEFAULT_OPTIONS }
+        allowFreeform={ true }
+        componentRef={ ref => comboBoxComponent = ref }
+      />);
+    comboBoxRoot = wrapper.find('.ms-ComboBox');
+    inputElement = comboBoxRoot.find('input');
+    inputElement.simulate('change', { target: { value: 'f' } });
+    inputElement.simulate('keydown', { which: KeyCodes.enter });
+    let currentOptions = (comboBoxComponent as React.Component<any, any>).state.currentOptions;
+    expect(currentOptions.length).equals(DEFAULT_OPTIONS.length + 1);
+    expect(currentOptions[currentOptions.length - 1].text).equals('f');
+  });
+
   it('Renders a default value with options', () => {
     let wrapper = mount(
       <ComboBox
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index ba5e71e686239..868283663f2e5 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -126,7 +126,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     let selectedKey = props.defaultSelectedKey !== undefined ? props.defaultSelectedKey : props.selectedKey;
     this._lastReadOnlyAutoCompleteChangeTimeoutId = -1;
 
-    let index: number = this._getSelectedIndex(props.options!, selectedKey!);
+    let index: number = this._getSelectedIndex(props.options, selectedKey);
 
     this.state = {
       isOpen: false,
@@ -145,11 +145,11 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   }
 
   public componentWillReceiveProps(newProps: IComboBoxProps) {
-    // In controlled component usage where selectedKey is provided, update the selectedIndex
-    // and currentOptions state if the key or options change
-    if (newProps.selectedKey !== undefined &&
+    // In controlled component usage where selectedKey or value is provided,
+    // update the selectedIndex and currentOptions state if the selectedKey or options have changed
+    if ((newProps.selectedKey || newProps.value) &&
       (newProps.selectedKey !== this.props.selectedKey || newProps.options !== this.props.options)) {
-      let index: number = this._getSelectedIndex(newProps.options!, newProps.selectedKey);
+      let index: number = this._getSelectedIndex(newProps.options, newProps.selectedKey);
       this.setState({
         selectedIndex: index,
         currentOptions: newProps.options
@@ -159,7 +159,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
   public componentDidUpdate(prevProps: IComboBoxProps, prevState: IComboBoxState) {
     let {
-      allowFreeform
+      allowFreeform,
+      value
     } = this.props;
     let {
       isOpen,
@@ -184,11 +185,11 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
     // If we just opened/closed the menu OR
     // updated the selectedIndex with the menu closed OR
-    // we are focused and are not allowing freeform
-    // we need to fix up focus and set selection
+    // are focused and are not allowing freeform or the value changed
+    // we need to set selection
     if (prevState.isOpen !== isOpen ||
       (!isOpen && prevState.selectedIndex !== selectedIndex) ||
-      (!allowFreeform && focused)) {
+      (focused && (!allowFreeform || value !== prevProps.value))) {
       this._select();
     }
   }
@@ -359,11 +360,15 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       currentPendingValueValidIndex,
       currentOptions,
       currentPendingValue,
-      suggestedDisplayValue
+      suggestedDisplayValue,
+      isOpen
     } = this.state;
 
+    let currentPendingIndexValid = this._indexWithinBounds(currentOptions, currentPendingValueValidIndex);
+
     // If the user passed is a value prop, use that
-    if (value) {
+    // unless we are open and have a valid current pending index
+    if (!(isOpen && currentPendingIndexValid) && value) {
       return value;
     }
 
@@ -374,7 +379,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       // If we are allowing freeform and autocomplete is also true
       // and we've got a pending value that matches an option, remember
       // the matched option's index
-      if (autoComplete === 'on' && this._indexWithinBounds(currentOptions, currentPendingValueValidIndex)) {
+      if (autoComplete === 'on' && currentPendingIndexValid) {
         index = currentPendingValueValidIndex;
       }
 
@@ -387,7 +392,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       // If we are not allowing freeform and have a
       // valid index that matches the pending value,
       // we know we will need some version of the pending value
-      if (this._indexWithinBounds(currentOptions, currentPendingValueValidIndex)) {
+      if (currentPendingIndexValid) {
 
         // If autoComplete is on, return the
         // raw pending value, otherwise remember
@@ -714,18 +719,17 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         }
       }
 
-      // Create a new option
-      let newOption: IComboBoxOption = { key: currentPendingValue, text: currentPendingValue };
-      let newOptions: IComboBoxOption[] = [...currentOptions, newOption];
-      let newSelectedIndex: number = this._getSelectedIndex(newOptions, currentPendingValue);
-
-      this.setState({
-        currentOptions: newOptions,
-        selectedIndex: newSelectedIndex
-      });
-
       if (onChanged) {
         onChanged(undefined, undefined, currentPendingValue);
+      } else {
+        // If we are not controlled, create a new option
+        let newOption: IComboBoxOption = { key: currentPendingValue, text: currentPendingValue };
+        let newOptions: IComboBoxOption[] = [...currentOptions, newOption];
+
+        this.setState({
+          currentOptions: newOptions,
+          selectedIndex: newOptions.length - 1
+        });
       }
     } else if (currentPendingValueValidIndex >= 0) {
       // Since we are not allowing freeform, we must have a matching
@@ -923,8 +927,12 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * @param selectedKey - the known selected key to find
    * @returns {number} - the index of the selected option, -1 if not found
    */
-  private _getSelectedIndex(options: IComboBoxOption[], selectedKey: string | number): number {
-    return findIndex(options, (option => (option.isSelected || option.selected || (selectedKey !== null) && option.key === selectedKey)));
+  private _getSelectedIndex(options: IComboBoxOption[] | undefined, selectedKey: string | number | undefined): number {
+    if (options === undefined || selectedKey === undefined) {
+      return -1;
+    }
+
+    return findIndex(options, (option => (option.isSelected || option.selected || option.key === selectedKey)));
   }
 
   /**
@@ -945,6 +953,11 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       this.setState({
         suggestedDisplayValue: currentOptions[selectedIndex].text
       });
+    } else if (this.props.value) {
+      // If we had a value initially, restore it
+      this.setState({
+        suggestedDisplayValue: this.props.value
+      });
     }
   }
 
@@ -978,7 +991,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       currentOptions
     } = this.state;
 
-    if (index > 0 && index < currentOptions.length) {
+    if (index >= 0 && index < currentOptions.length) {
       let option = currentOptions[index];
       this._setPendingInfo(option.text, index, option.text);
     } else {

From a044e9533a8e9fe6906df2103e84ff8663ba6127 Mon Sep 17 00:00:00 2001
From: antonlabunets <alabunets@gmail.com>
Date: Thu, 10 Aug 2017 15:06:12 -0700
Subject: [PATCH 0399/1641] Automation id for choice group options (#2214)

* Automation id for choice group options

* Unit tests

* Removing the default to key logic upon offline feedback

* Switching to mixin of attributes instead of custom prop

* Fixing unit test per new test value.

* Removing inputProps to rely on option inheritance

* Updating to deal with strict nulls

* Updating samples/tests to use data-automation-id as first planned
---
 ...ceGroup-automationId_2017-07-14-16-11.json | 11 +++++++
 ...ceGroup-automationId_2017-07-14-16-11.json | 11 +++++++
 ...ceGroup-automationId_2017-07-14-16-11.json | 11 +++++++
 ...ceGroup-automationId_2017-07-14-16-11.json | 11 +++++++
 ...ceGroup-automationId_2017-07-14-16-11.json | 11 +++++++
 .../ChoiceGroup/ChoiceGroup.Props.ts          |  3 +-
 .../ChoiceGroup/ChoiceGroup.test.tsx          | 33 +++++++++++++++----
 .../components/ChoiceGroup/ChoiceGroup.tsx    | 13 +++++---
 .../examples/ChoiceGroup.Basic.Example.tsx    |  5 +--
 9 files changed, 94 insertions(+), 15 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/antonla-choiceGroup-automationId_2017-07-14-16-11.json
 create mode 100644 common/changes/@uifabric/fabric-website/antonla-choiceGroup-automationId_2017-07-14-16-11.json
 create mode 100644 common/changes/@uifabric/styling/antonla-choiceGroup-automationId_2017-07-14-16-11.json
 create mode 100644 common/changes/@uifabric/utilities/antonla-choiceGroup-automationId_2017-07-14-16-11.json
 create mode 100644 common/changes/office-ui-fabric-react/antonla-choiceGroup-automationId_2017-07-14-16-11.json

diff --git a/common/changes/@uifabric/example-app-base/antonla-choiceGroup-automationId_2017-07-14-16-11.json b/common/changes/@uifabric/example-app-base/antonla-choiceGroup-automationId_2017-07-14-16-11.json
new file mode 100644
index 0000000000000..76417580155b9
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/antonla-choiceGroup-automationId_2017-07-14-16-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "antonla@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/antonla-choiceGroup-automationId_2017-07-14-16-11.json b/common/changes/@uifabric/fabric-website/antonla-choiceGroup-automationId_2017-07-14-16-11.json
new file mode 100644
index 0000000000000..b2bd3ebc00a94
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/antonla-choiceGroup-automationId_2017-07-14-16-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "antonla@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/antonla-choiceGroup-automationId_2017-07-14-16-11.json b/common/changes/@uifabric/styling/antonla-choiceGroup-automationId_2017-07-14-16-11.json
new file mode 100644
index 0000000000000..c702d237618a9
--- /dev/null
+++ b/common/changes/@uifabric/styling/antonla-choiceGroup-automationId_2017-07-14-16-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "antonla@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/antonla-choiceGroup-automationId_2017-07-14-16-11.json b/common/changes/@uifabric/utilities/antonla-choiceGroup-automationId_2017-07-14-16-11.json
new file mode 100644
index 0000000000000..35c148e6e2508
--- /dev/null
+++ b/common/changes/@uifabric/utilities/antonla-choiceGroup-automationId_2017-07-14-16-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "antonla@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/antonla-choiceGroup-automationId_2017-07-14-16-11.json b/common/changes/office-ui-fabric-react/antonla-choiceGroup-automationId_2017-07-14-16-11.json
new file mode 100644
index 0000000000000..52227f7861268
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/antonla-choiceGroup-automationId_2017-07-14-16-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Mixing choice group fields with html input attributes",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "antonla@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts
index 32e54f19b4b4e..3345352217461 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts
@@ -46,7 +46,7 @@ export interface IChoiceGroupProps extends React.InputHTMLAttributes<HTMLElement
   onChanged?: (option: IChoiceGroupOption, evt?: React.FormEvent<HTMLElement | HTMLInputElement>) => void;
 }
 
-export interface IChoiceGroupOption {
+export interface IChoiceGroupOption extends React.HTMLAttributes<HTMLElement | HTMLInputElement> {
   /**
    * A required key to uniquely identify the option.
    */
@@ -106,5 +106,4 @@ export interface IChoiceGroupOption {
    * This value is maintained by the component and is accessible during onRenderField
    */
   labelId?: string;
-
 }
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
index a8f3eea22c0a8..4cab4d5847e97 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
@@ -11,10 +11,11 @@ import { ChoiceGroup } from './ChoiceGroup';
 import { IChoiceGroupOption } from './ChoiceGroup.Props';
 
 const TEST_OPTIONS: IChoiceGroupOption[] = [
-  { key: '1', text: '1' },
+  { key: '1', text: '1', 'data-automation-id': 'auto1' } as IChoiceGroupOption,
   { key: '2', text: '2' },
   { key: '3', text: '3' }
 ];
+const QUERY_SELECTOR: string = '.ms-ChoiceField-input';
 
 describe('ChoiceGroup', () => {
 
@@ -42,7 +43,7 @@ describe('ChoiceGroup', () => {
     expect(threwException).to.be.false;
 
     let renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
-    let choiceOptions = renderedDOM.querySelectorAll('.ms-ChoiceField-input');
+    let choiceOptions = renderedDOM.querySelectorAll(QUERY_SELECTOR);
 
     expect((choiceOptions[0] as HTMLInputElement).checked).to.be.eq(false, 'Choice 1 was true before click');
     expect((choiceOptions[1] as HTMLInputElement).checked).to.be.eq(false, 'Choice 2 was true before click');
@@ -91,7 +92,7 @@ describe('ChoiceGroup', () => {
     expect(threwException).to.be.false;
 
     let renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
-    let choiceOptions = renderedDOM.querySelectorAll('.ms-ChoiceField-input');
+    let choiceOptions = renderedDOM.querySelectorAll(QUERY_SELECTOR);
 
     expect((choiceOptions[0] as HTMLInputElement).disabled).to.be.eq(true, 'Disabled option 1 is not disabled');
     expect((choiceOptions[1] as HTMLInputElement).disabled).to.be.eq(false, 'Not disabled option 2 is disabled');
@@ -123,7 +124,7 @@ describe('ChoiceGroup', () => {
     expect(threwException).to.be.false;
 
     let renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
-    let choiceOptions = renderedDOM.querySelectorAll('.ms-ChoiceField-input');
+    let choiceOptions = renderedDOM.querySelectorAll(QUERY_SELECTOR);
 
     expect((choiceOptions[0] as HTMLInputElement).disabled).to.be.eq(true, 'Disabled option 1 is not disabled');
     expect((choiceOptions[1] as HTMLInputElement).disabled).to.be.eq(true, 'Disabled option 2 is not disabled');
@@ -138,7 +139,7 @@ describe('ChoiceGroup', () => {
       />
     );
     let renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
-    let choiceOptions = renderedDOM.querySelectorAll('.ms-ChoiceField-input');
+    let choiceOptions = renderedDOM.querySelectorAll(QUERY_SELECTOR);
 
     expect((choiceOptions[0] as HTMLInputElement).checked).to.be.eq(true, 'Choice 1 was not selected');
 
@@ -157,7 +158,7 @@ describe('ChoiceGroup', () => {
       />
     );
     let renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
-    let choiceOptions = renderedDOM.querySelectorAll('.ms-ChoiceField-input');
+    let choiceOptions = renderedDOM.querySelectorAll(QUERY_SELECTOR);
 
     expect((choiceOptions[0] as HTMLInputElement).checked).to.be.eq(true, 'Choice 1 was not selected');
 
@@ -168,4 +169,24 @@ describe('ChoiceGroup', () => {
 
     expect(_selectedItem).to.equal(TEST_OPTIONS[1], 'onChange did not return new item');
   });
+
+  it('extra <input> attributes appear in dom if specified', () => {
+    let _selectedItem;
+    const choiceGroup = ReactTestUtils.renderIntoDocument<ChoiceGroup>(
+      <ChoiceGroup
+        options={ TEST_OPTIONS }
+        onChange={ (ev, item) => _selectedItem = item }
+      />
+    );
+    const renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
+    const choiceOptions = renderedDOM.querySelectorAll(QUERY_SELECTOR);
+
+    const extraAttributeGetter: (index: number) => string | null = (index: number): string | null => {
+      const input: HTMLInputElement = choiceOptions[index] as HTMLInputElement;
+      return input.getAttribute('data-automation-id');
+    };
+
+    expect(extraAttributeGetter(0)).to.be.eq('auto1', 'Specified data attribute did not match');
+    expect(extraAttributeGetter(1)).to.be.null;
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
index fd1ebb7972074..1b9c5c25a6f6f 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
@@ -5,10 +5,12 @@ import { Icon } from '../../Icon';
 import { IChoiceGroupOption, IChoiceGroupProps } from './ChoiceGroup.Props';
 import {
   assign,
+  BaseComponent,
   css,
   getId,
-  BaseComponent,
-} from '@uifabric/utilities';
+  getNativeProps,
+  inputProperties
+} from '../../Utilities';
 import * as stylesImport from './ChoiceGroup.scss';
 const styles: any = stylesImport;
 
@@ -26,7 +28,7 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
 
   private _id: string;
   private _labelId: string;
-  private _inputElement: HTMLInputElement;
+  private _inputElement: HTMLInputElement | null;
 
   constructor(props: IChoiceGroupProps, ) {
     super(props);
@@ -63,7 +65,7 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
     let { keyChecked, keyFocused } = this.state;
 
     return (
-      // Need to assign role application on containing div because JAWS doesnt call OnKeyDown without this role
+      // Need to assign role application on containing div because JAWS doesn't call OnKeyDown without this role
       <div role='application' className={ className }>
         <div
           className={ css('ms-ChoiceFieldGroup', styles.root) }
@@ -100,7 +102,7 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
                 }
               >
                 <input
-                  ref={ (c): HTMLInputElement => this._inputElement = c! }
+                  ref={ this._resolveRef('_inputElement') }
                   id={ option.id }
                   className={ css('ms-ChoiceField-input', styles.input) }
                   type='radio'
@@ -112,6 +114,7 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
                   onFocus={ this._onFocus.bind(this, option) }
                   onBlur={ this._onBlur.bind(this, option) }
                   aria-labelledby={ option.id }
+                  { ...getNativeProps(option, inputProperties) }
                 />
                 { onRenderField(option, this._onRenderField) }
               </div>
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Basic.Example.tsx
index 663c31f7e44c1..4ff1b13133b11 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Basic.Example.tsx
@@ -26,8 +26,9 @@ export class ChoiceGroupBasicExample extends React.Component<any, IChoiceGroupBa
           options={ [
             {
               key: 'A',
-              text: 'Option A'
-            },
+              text: 'Option A',
+              'data-automation-id': 'auto1'
+            } as IChoiceGroupOption,
             {
               key: 'B',
               text: 'Option B',

From 2d643b3ed42f193f59eb345d4c1834985e41e881 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 10 Aug 2017 15:09:09 -0700
Subject: [PATCH 0400/1641] Removing the module part of the fabric website
 webpack config.

---
 apps/fabric-website/webpack.site.config.js | 14 --------------
 1 file changed, 14 deletions(-)

diff --git a/apps/fabric-website/webpack.site.config.js b/apps/fabric-website/webpack.site.config.js
index 644a40d493a42..3f4192bd3d82c 100644
--- a/apps/fabric-website/webpack.site.config.js
+++ b/apps/fabric-website/webpack.site.config.js
@@ -67,20 +67,6 @@ function createConfig(isProduction, publicPath) {
       extensions: ['', '.js']
     },
 
-    module: {
-      noParse: [/autoit.js/],
-      preLoaders: [
-        { test: /\.json$/, loader: 'json' },
-      ],
-      loaders: [
-        {
-          test: /\.js$/,
-          loader: 'source-map-loader',
-          enforce: 'pre'
-        }
-      ],
-    },
-
     plugins: [
       new BundleAnalyzerPlugin({
         analyzerMode: 'static',

From f5a842593734782b86a286a3baf627f87c7c3819 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 10 Aug 2017 17:17:32 -0700
Subject: [PATCH 0401/1641] Revert "Removing the module part of the fabric
 website webpack config."

This reverts commit 2d643b3ed42f193f59eb345d4c1834985e41e881.
---
 apps/fabric-website/webpack.site.config.js | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/apps/fabric-website/webpack.site.config.js b/apps/fabric-website/webpack.site.config.js
index 3f4192bd3d82c..644a40d493a42 100644
--- a/apps/fabric-website/webpack.site.config.js
+++ b/apps/fabric-website/webpack.site.config.js
@@ -67,6 +67,20 @@ function createConfig(isProduction, publicPath) {
       extensions: ['', '.js']
     },
 
+    module: {
+      noParse: [/autoit.js/],
+      preLoaders: [
+        { test: /\.json$/, loader: 'json' },
+      ],
+      loaders: [
+        {
+          test: /\.js$/,
+          loader: 'source-map-loader',
+          enforce: 'pre'
+        }
+      ],
+    },
+
     plugins: [
       new BundleAnalyzerPlugin({
         analyzerMode: 'static',

From 92a6a6878d2af24d251113dbfcf79b60d92181f2 Mon Sep 17 00:00:00 2001
From: jijizz <liu_zhi8@hotmail.com>
Date: Fri, 11 Aug 2017 10:04:25 -0700
Subject: [PATCH 0402/1641] Zhiliu/List perf: cache page and delay measurement
 (#2415)

* try page cache and defer measureReact

* more aggresive cache

* add capability to cache first page and also be able to do measurement after glass

* remove debugging code

* Fast List Rendering

* remove debug logging

* simpler caching logic

* fix review comment

* fix review comment

* do not cache property

* Update DetailsList.tsx
---
 .../DetailsList/DetailsList.Props.ts          |  15 +++
 .../components/DetailsList/DetailsList.tsx    |   8 +-
 .../GroupedList/GroupedList.Props.ts          |  14 +++
 .../components/GroupedList/GroupedList.tsx    |   6 +-
 .../src/components/List/List.Props.ts         |  15 +++
 .../src/components/List/List.tsx              | 106 +++++++++++++++---
 6 files changed, 144 insertions(+), 20 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
index 6b191774fe684..8d39924ccded7 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
@@ -186,6 +186,21 @@ export interface IDetailsListProps extends React.Props<DetailsList> {
 
   /** Boolean value to indicate if the component should render in compact mode. Set to false by default */
   compact?: boolean;
+
+  /**
+  * Boolean value to enable render page caching. This is an experimental performance optimization 
+  * that is off by default.
+  * @defaultValue false
+  */
+  usePageCache?: boolean;
+  
+  /**
+   * Optional callback to determine whether the list should be rendered in full, or virtualized.
+   * Virtualization will add and remove pages of items as the user scrolls them into the visible range.
+   * This benefits larger list scenarios by reducing the DOM on the screen, but can negatively affect performance for smaller lists.
+   * The default implementation will virtualize when this callback is not provided.
+   */
+  onShouldVirtualize?: (props: IListProps) => boolean;
 }
 
 export interface IColumn {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index f2cb58826f0dc..fa700b2e103e4 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -212,7 +212,9 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       rowElementEventMap,
       shouldApplyApplicationRole = false,
       getKey,
-      listProps
+      listProps,
+      usePageCache,
+      onShouldVirtualize
     } = this.props;
     let {
       adjustedColumns,
@@ -326,6 +328,8 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
                     eventsToRegister={ rowElementEventMap }
                     listProps={ additionalListProps }
                     onGroupExpandStateChanged={ this._onGroupExpandStateChanged }
+                    usePageCache={ usePageCache }
+                    onShouldVirtualize={ onShouldVirtualize }
                   />
                 ) : (
                     <List
@@ -333,6 +337,8 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
                       role='presentation'
                       items={ items }
                       onRenderCell={ (item, itemIndex) => this._onRenderCell(0, item, itemIndex as number) }
+                      usePageCache={ usePageCache }
+                      onShouldVirtualize={ onShouldVirtualize }
                       { ...additionalListProps }
                     />
                   )
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts
index 5d1b137bbc5b1..e69f360a2ed56 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts
@@ -85,6 +85,20 @@ export interface IGroupedListProps extends React.Props<GroupedList> {
 
   /** Optional callback when the group expand state changes between all collapsed and at least one group is expanded. */
   onGroupExpandStateChanged?: (isSomeGroupExpanded: boolean) => void;
+
+  /** 
+   * boolean to control if pages containing unchanged items should be cached, this is a perf optimization 
+   * The same property in List.Props
+   */
+  usePageCache?: boolean;
+  
+  /**
+   * Optional callback to determine whether the list should be rendered in full, or virtualized.
+   * Virtualization will add and remove pages of items as the user scrolls them into the visible range.
+   * This benefits larger list scenarios by reducing the DOM on the screen, but can negatively affect performance for smaller lists.
+   * The default implementation will virtualize when this callback is not provided.
+   */
+  onShouldVirtualize?: (props: IListProps) => boolean;
 }
 
 export interface IGroup {
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
index f04705dd73e8b..055d6438f28b9 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
@@ -77,7 +77,9 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
 
   public render() {
     let {
-      className
+      className,
+      usePageCache,
+      onShouldVirtualize
     } = this.props;
     let {
       groups
@@ -98,6 +100,8 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
               items={ groups }
               onRenderCell={ this._renderGroup }
               getItemCountForPage={ () => 1 }
+              usePageCache = { usePageCache }
+              onShouldVirtualize = { onShouldVirtualize }
             />
           )
         }
diff --git a/packages/office-ui-fabric-react/src/components/List/List.Props.ts b/packages/office-ui-fabric-react/src/components/List/List.Props.ts
index 2fba651a9cf9b..ee6d88859af88 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/List/List.Props.ts
@@ -75,6 +75,21 @@ export interface IListProps extends React.HTMLAttributes<List | HTMLDivElement>
 
   /** Number of items to render. Defaults to items.length. */
   renderCount?: number;
+
+  /**
+  * Boolean value to enable render page caching. This is an experimental performance optimization 
+  * that is off by default.
+  * @defaultValue false
+  */
+  usePageCache?: boolean;
+  
+  /**
+   * Optional callback to determine whether the list should be rendered in full, or virtualized.
+   * Virtualization will add and remove pages of items as the user scrolls them into the visible range.
+   * This benefits larger list scenarios by reducing the DOM on the screen, but can negatively affect performance for smaller lists.
+   * The default implementation will virtualize when this callback is not provided.
+   */
+  onShouldVirtualize?: (props: IListProps) => boolean;
 }
 
 export interface IPage {
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index 9d88e6474f083..6f42f0ce959d7 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -28,6 +28,15 @@ export interface IListState {
   measureVersion?: number;
 }
 
+interface IPageCacheItem {
+  page: IPage;
+  pageElement?: JSX.Element;
+}
+
+interface IPageCache {
+  [key: string]: IPageCacheItem;
+}
+
 const EMPTY_RECT = {
   top: -1,
   bottom: -1,
@@ -56,6 +65,10 @@ const _measureScrollRect = _measurePageRect;
  *
  * Measuring too frequently can pull performance down significantly. To compensate, we cache measured values so that
  * we can avoid re-measuring during operations that should not alter heights, like scrolling.
+ * 
+ * To optimize glass rendering performance, onShouldVirtualize can be set. When onShouldVirtualize return false,
+ * List will run in fast mode (not virtualized) to render all items without any measurements to improve page load time. And we
+ * start doing measurements and rendering in virtualized mode when items grows larger than this threshold.
  *
  * However, certain operations can make measure data stale. For example, resizing the list, or passing in new props,
  * or forcing an update change cause pages to shrink/grow. When these operations occur, we increment a measureVersion
@@ -64,7 +77,7 @@ const _measureScrollRect = _measurePageRect;
 export class List extends BaseComponent<IListProps, IListState> implements IList {
   public static defaultProps = {
     startIndex: 0,
-    onRenderCell: (item: any, index: number, containsFocus: boolean) => (<div>{ (item && item.name) || '' }</div>),
+    onRenderCell: (item: any, index: number, containsFocus: boolean) => (<div>{(item && item.name) || ''}</div>),
     renderedWindowsAhead: DEFAULT_RENDERED_WINDOWS_AHEAD,
     renderedWindowsBehind: DEFAULT_RENDERED_WINDOWS_BEHIND
   };
@@ -106,6 +119,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   private _measureVersion: number;
   private _scrollHeight: number;
   private _scrollTop: number;
+  private _pageCache: IPageCache;
 
   constructor(props: IListProps) {
     super(props);
@@ -148,6 +162,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     this._estimatedPageHeight = 0;
     this._focusedIndex = -1;
     this._scrollingToIndex = -1;
+    this._pageCache = {};
   }
 
   /**
@@ -251,6 +266,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       this._requiredRect = null;
 
       this._measureVersion++;
+      this._invalidatePageCache();
       this._updatePages(newProps);
     }
   }
@@ -285,6 +301,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   }
 
   public forceUpdate() {
+    this._invalidatePageCache();
     // Ensure that when the list is force updated we update the pages first before render.
     this._updateRenderRects(this.props, true);
     this._updatePages();
@@ -309,16 +326,39 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     // console.log(`Page elements ${pageElements.length}`);
 
     return (
-      <div ref='root' { ...divProps } role={ role } className={ css('ms-List', className) } >
+      <div ref='root' { ...divProps } role={role} className={css('ms-List', className)} >
         <div ref='surface' className='ms-List-surface' role='presentation'>
-          { pageElements }
+          {pageElements}
         </div>
       </div>
     );
   }
 
+  private _shouldVirtualize(): boolean {
+    const {
+      onShouldVirtualize
+    } = this.props;
+    return !onShouldVirtualize || onShouldVirtualize(this.props);
+  }
+
+  /**
+   * when props.items change or forceUpdate called, throw away cached pages
+   */
+  private _invalidatePageCache() {
+    this._pageCache = {};
+  }
+
   private _renderPage(page: IPage): any {
-    let { onRenderCell, role } = this.props;
+    let { onRenderCell, role, usePageCache } = this.props;
+    let cachedPage;
+    // if usePageCache is set and cached page element can be found, just return cached page
+    if (usePageCache) {
+      cachedPage = this._pageCache[page.key];
+      if (cachedPage && cachedPage.pageElement) {
+        return cachedPage.pageElement;
+      }
+    }
+
     let cells = [];
     let pageStyle = this._getPageStyle(page);
 
@@ -338,17 +378,28 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       }
 
       cells.push(
-        <div role={ role } className='ms-List-cell' key={ itemKey } data-list-index={ i + page.startIndex } data-automationid='ListCell'>
-          { onRenderCell!(item, page.startIndex + i) }
+        <div role={role} className='ms-List-cell' key={itemKey} data-list-index={i + page.startIndex} data-automationid='ListCell'>
+          {onRenderCell!(item, page.startIndex + i)}
         </div>
       );
     }
 
-    return (
-      <div className='ms-List-page' key={ page.key } ref={ page.key } style={ pageStyle } role='presentation'>
-        { cells }
+    const pageElement = (
+      <div className='ms-List-page' key={page.key} ref={page.key} style={pageStyle} role='presentation'>
+        {cells}
       </div>
     );
+    // cache the first page for now since it is re-rendered a lot times unncessarily.
+    // todo: a more aggresive caching mechanism is to cache pages constaining the items not changed.
+    // now we re-render pages too frequently, for example, props.items increased from 30 to 60, although the 
+    // first 30 items did not change, we still re-rendered all of them in this props.items change.
+    if (usePageCache && page.startIndex === 0) {
+      this._pageCache[page.key] = {
+        page: page,
+        pageElement: pageElement
+      };
+    }
+    return pageElement;
   }
 
   /** Generate the style object for the page. */
@@ -483,6 +534,11 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     let heightChanged = false;
     let renderCount = this._getRenderCount();
 
+    // when not in virtualize mode, we render all the items without page measurement
+    if (!this._shouldVirtualize()) {
+      return heightChanged;
+    }
+
     for (let i = 0; i < oldPages.length; i++) {
       let page = oldPages[i];
 
@@ -525,7 +581,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
 
     // console.log('   * measure attempt', page.startIndex, cachedHeight);
 
-    if (pageElement && (!cachedHeight || cachedHeight.measureVersion !== this._measureVersion)) {
+    if (pageElement && this._shouldVirtualize() && (!cachedHeight || cachedHeight.measureVersion !== this._measureVersion)) {
       let newClientRect = {
         width: pageElement.clientWidth,
         height: pageElement.clientHeight
@@ -585,6 +641,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     let currentSpacer = null;
     let focusedIndex = this._focusedIndex;
     let endIndex = startIndex + renderCount;
+    const shouldVirtualize = this._shouldVirtualize();
 
     // First render is very important to track; when we render cells, we have no idea of estimated page height.
     // So we should default to rendering only the first page so that we can get information.
@@ -598,15 +655,16 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       let pageBottom = pageTop + pageHeight - 1;
 
       let isPageRendered = findIndex(this.state.pages as IPage[], (page) => page.items && page.startIndex === itemIndex) > -1;
-      let isPageInAllowedRange = pageBottom >= this._allowedRect.top && pageTop <= this._allowedRect.bottom!;
-      let isPageInRequiredRange = pageBottom >= this._requiredRect!.top && pageTop <= this._requiredRect!.bottom!;
-      let isPageVisible = !isFirstRender && (isPageInRequiredRange || (isPageInAllowedRange && isPageRendered));
+      let isPageInAllowedRange = !this._allowedRect || pageBottom >= this._allowedRect.top && pageTop <= this._allowedRect.bottom!;
+      let isPageInRequiredRange = !this._requiredRect || pageBottom >= this._requiredRect!.top && pageTop <= this._requiredRect!.bottom!;
+      let isPageVisible = !isFirstRender && (isPageInRequiredRange || (isPageInAllowedRange && isPageRendered)) || !shouldVirtualize;
       let isPageFocused = focusedIndex >= itemIndex && focusedIndex < (itemIndex + itemsPerPage);
       let isFirstPage = itemIndex === startIndex;
 
       // console.log('building page', itemIndex, 'pageTop: ' + pageTop, 'inAllowed: ' + isPageInAllowedRange, 'inRequired: ' + isPageInRequiredRange);
 
-      // Only render whats visible, focused, or first page.
+      // Only render whats visible, focused, or first page, 
+      // or when running in fast rendering mode (not in virtualized mode), we render all current items in pages
       if (isPageVisible || isPageFocused || isFirstPage) {
         if (currentSpacer) {
           pages.push(currentSpacer);
@@ -621,7 +679,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
 
         pages.push(newPage);
 
-        if (isPageInRequiredRange) {
+        if (isPageInRequiredRange && this._allowedRect) {
           _mergeRect(materializedRect, {
             top: pageTop,
             bottom: pageBottom,
@@ -641,7 +699,9 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       }
       pageTop += (pageBottom - pageTop + 1);
 
-      if (isFirstRender) {
+      // in virtualized mode, we render need to render first page then break and measure,
+      // otherwise, we render all items without measurement to make rendering fast
+      if (isFirstRender && shouldVirtualize) {
         break;
       }
     }
@@ -682,6 +742,10 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
 
   private _createPage(pageKey: string | null, items: any[] | null, startIndex?: number, count?: number, style?: any): IPage {
     pageKey = pageKey || ('page-' + startIndex);
+    const cachedPage = this._pageCache[pageKey];
+    if (cachedPage && cachedPage.page) {
+      return cachedPage.page;
+    }
 
     // Fill undefined cells because array.map will ignore undefined cells.
     if (items) {
@@ -709,9 +773,15 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
 
   /** Calculate the visible rect within the list where top: 0 and left: 0 is the top/left of the list. */
   private _updateRenderRects(props?: IListProps, forceUpdate?: boolean) {
-    const { renderedWindowsAhead, renderedWindowsBehind } = (props || this.props);
+    props = props || this.props;
+    const { renderedWindowsAhead, renderedWindowsBehind } = props;
     const { pages } = this.state;
     const renderCount = this._getRenderCount(props);
+    // when not in virtualize mode, we render all items without measurement to optimize page rendering perf
+    if (!this._shouldVirtualize()) {
+      return;
+    }
+
     let surfaceRect = this._surfaceRect;
     let scrollHeight = this._scrollElement && this._scrollElement.scrollHeight;
     let scrollTop = this._scrollElement ? this._scrollElement.scrollTop : 0;
@@ -791,4 +861,4 @@ function _mergeRect(targetRect: IRectangle, newRect: IRectangle): IRectangle {
   targetRect.height = targetRect.bottom! - targetRect.top + 1;
 
   return targetRect;
-}
+}
\ No newline at end of file

From 8a06323127801c81d19cf4682469a0a1f3f5b5f6 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 11 Aug 2017 11:09:59 -0700
Subject: [PATCH 0403/1641] Updating tsconfig and webpack config for website.

---
 apps/fabric-website/tsconfig.json          |  7 ++-----
 apps/fabric-website/webpack.site.config.js | 13 ++++---------
 2 files changed, 6 insertions(+), 14 deletions(-)

diff --git a/apps/fabric-website/tsconfig.json b/apps/fabric-website/tsconfig.json
index da7a35839a57b..9b601b1bf53aa 100644
--- a/apps/fabric-website/tsconfig.json
+++ b/apps/fabric-website/tsconfig.json
@@ -22,10 +22,7 @@
       ]
     }
   },
-  "exclude": [
-    "node_modules",
-    "dist",
-    "lib",
-    "lib-amd"
+  "include": [
+    "src"
   ]
 }
\ No newline at end of file
diff --git a/apps/fabric-website/webpack.site.config.js b/apps/fabric-website/webpack.site.config.js
index 644a40d493a42..b154be834d74c 100644
--- a/apps/fabric-website/webpack.site.config.js
+++ b/apps/fabric-website/webpack.site.config.js
@@ -27,7 +27,6 @@ if (isProduction) {
   configs.push(createConfig(true, publicPath));
 }
 
-
 // Helper to create the config.
 function createConfig(isProduction, publicPath) {
   let today = new Date();
@@ -71,17 +70,13 @@ function createConfig(isProduction, publicPath) {
       noParse: [/autoit.js/],
       preLoaders: [
         { test: /\.json$/, loader: 'json' },
-      ],
-      loaders: [
-        {
-          test: /\.js$/,
-          loader: 'source-map-loader',
-          enforce: 'pre'
-        }
-      ],
+      ]
     },
 
     plugins: [
+      new webpack.optimize.CommonsChunkPlugin({
+        name: 'fabric-website-common'
+      }),
       new BundleAnalyzerPlugin({
         analyzerMode: 'static',
         reportFilename: 'fabric-site.stats.html',

From f09734e9d1cadc504f4d96b0fa76d3ba47123488 Mon Sep 17 00:00:00 2001
From: John Miller <rubixws@gmail.com>
Date: Fri, 11 Aug 2017 11:14:31 -0700
Subject: [PATCH 0404/1641] Removing bundle analyzer plugin. (#2479)

---
 apps/fabric-website/package.json           |  2 +-
 apps/fabric-website/webpack.site.config.js | 13 ++-----------
 2 files changed, 3 insertions(+), 12 deletions(-)

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index de0c703bba103..23d840a29b6f6 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -12,7 +12,7 @@
     "build": "gulp",
     "clean": "gulp clean",
     "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.serve.config.js --open",
-    "production": "gulp --production"
+    "production": "node --max_old_space_size=8192 ./node_modules/gulp/bin/gulp.js --production"
   },
   "license": "MIT",
   "devDependencies": {
diff --git a/apps/fabric-website/webpack.site.config.js b/apps/fabric-website/webpack.site.config.js
index b154be834d74c..2a0ccadd4f779 100644
--- a/apps/fabric-website/webpack.site.config.js
+++ b/apps/fabric-website/webpack.site.config.js
@@ -69,20 +69,11 @@ function createConfig(isProduction, publicPath) {
     module: {
       noParse: [/autoit.js/],
       preLoaders: [
-        { test: /\.json$/, loader: 'json' },
+        { test: /\.json$/, loader: 'json' }
       ]
     },
 
-    plugins: [
-      new webpack.optimize.CommonsChunkPlugin({
-        name: 'fabric-website-common'
-      }),
-      new BundleAnalyzerPlugin({
-        analyzerMode: 'static',
-        reportFilename: 'fabric-site.stats.html',
-        openAnalyzer: false
-      })
-    ]
+    plugins: []
   };
 
   if (isProduction) {

From 50b608ee4ee1ad5c948073121fd92f0fbaed81d5 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 11 Aug 2017 12:28:08 -0700
Subject: [PATCH 0405/1641] Cleaning up change files.

---
 ...nla-choiceGroup-automationId_2017-07-14-16-11.json | 11 -----------
 ...nla-choiceGroup-automationId_2017-07-14-16-11.json | 11 -----------
 ...a-website-update-header_2017-06-09-19-15.json~HEAD | 11 -----------
 ...9-15.json~b0ee1f6c9e5f0d9b31c060d92998e0c43af504d4 | 11 -----------
 ...nla-choiceGroup-automationId_2017-07-14-16-11.json | 11 -----------
 ...nla-choiceGroup-automationId_2017-07-14-16-11.json | 11 -----------
 .../focus-zone-cdm_2017-08-01-00-34.json              |  2 +-
 .../kegorr-CalendarArrowStyles_2017-08-09-16-51.json  |  2 +-
 .../rickyp-2335_2017-08-05-00-16.json                 |  1 -
 9 files changed, 2 insertions(+), 69 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/antonla-choiceGroup-automationId_2017-07-14-16-11.json
 delete mode 100644 common/changes/@uifabric/fabric-website/antonla-choiceGroup-automationId_2017-07-14-16-11.json
 delete mode 100644 common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json~HEAD
 delete mode 100644 common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json~b0ee1f6c9e5f0d9b31c060d92998e0c43af504d4
 delete mode 100644 common/changes/@uifabric/styling/antonla-choiceGroup-automationId_2017-07-14-16-11.json
 delete mode 100644 common/changes/@uifabric/utilities/antonla-choiceGroup-automationId_2017-07-14-16-11.json
 delete mode 100644 common/changes/office-ui-fabric-react/rickyp-2335_2017-08-05-00-16.json

diff --git a/common/changes/@uifabric/example-app-base/antonla-choiceGroup-automationId_2017-07-14-16-11.json b/common/changes/@uifabric/example-app-base/antonla-choiceGroup-automationId_2017-07-14-16-11.json
deleted file mode 100644
index 76417580155b9..0000000000000
--- a/common/changes/@uifabric/example-app-base/antonla-choiceGroup-automationId_2017-07-14-16-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "antonla@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/antonla-choiceGroup-automationId_2017-07-14-16-11.json b/common/changes/@uifabric/fabric-website/antonla-choiceGroup-automationId_2017-07-14-16-11.json
deleted file mode 100644
index b2bd3ebc00a94..0000000000000
--- a/common/changes/@uifabric/fabric-website/antonla-choiceGroup-automationId_2017-07-14-16-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "antonla@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json~HEAD b/common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json~HEAD
deleted file mode 100644
index ca46d03d32883..0000000000000
--- a/common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json~HEAD
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Fix issues with dev.office.com header",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "miwhea@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json~b0ee1f6c9e5f0d9b31c060d92998e0c43af504d4 b/common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json~b0ee1f6c9e5f0d9b31c060d92998e0c43af504d4
deleted file mode 100644
index ca46d03d32883..0000000000000
--- a/common/changes/@uifabric/fabric-website/miwhea-website-update-header_2017-06-09-19-15.json~b0ee1f6c9e5f0d9b31c060d92998e0c43af504d4
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Fix issues with dev.office.com header",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "miwhea@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/antonla-choiceGroup-automationId_2017-07-14-16-11.json b/common/changes/@uifabric/styling/antonla-choiceGroup-automationId_2017-07-14-16-11.json
deleted file mode 100644
index c702d237618a9..0000000000000
--- a/common/changes/@uifabric/styling/antonla-choiceGroup-automationId_2017-07-14-16-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "antonla@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/antonla-choiceGroup-automationId_2017-07-14-16-11.json b/common/changes/@uifabric/utilities/antonla-choiceGroup-automationId_2017-07-14-16-11.json
deleted file mode 100644
index 35c148e6e2508..0000000000000
--- a/common/changes/@uifabric/utilities/antonla-choiceGroup-automationId_2017-07-14-16-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "antonla@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/focus-zone-cdm_2017-08-01-00-34.json b/common/changes/office-ui-fabric-react/focus-zone-cdm_2017-08-01-00-34.json
index a348828988a5b..e1f48fd70a783 100644
--- a/common/changes/office-ui-fabric-react/focus-zone-cdm_2017-08-01-00-34.json
+++ b/common/changes/office-ui-fabric-react/focus-zone-cdm_2017-08-01-00-34.json
@@ -2,7 +2,7 @@
   "changes": [
     {
       "packageName": "office-ui-fabric-react",
-      "comment": "Move registering FocusZone instance to componentDidMount",
+      "comment": "FocusZone: adjusting initialization logic to remove a potential memory leak in server rendered scenarios.",
       "type": "patch"
     }
   ],
diff --git a/common/changes/office-ui-fabric-react/kegorr-CalendarArrowStyles_2017-08-09-16-51.json b/common/changes/office-ui-fabric-react/kegorr-CalendarArrowStyles_2017-08-09-16-51.json
index 30327ad0881c3..78adfecec84a1 100644
--- a/common/changes/office-ui-fabric-react/kegorr-CalendarArrowStyles_2017-08-09-16-51.json
+++ b/common/changes/office-ui-fabric-react/kegorr-CalendarArrowStyles_2017-08-09-16-51.json
@@ -2,7 +2,7 @@
   "changes": [
     {
       "packageName": "office-ui-fabric-react",
-      "comment": "Enhancement: added ability to customize calendar's navigation icons.",
+      "comment": "Calendar: added ability to customize navigation icons.",
       "type": "minor"
     }
   ],
diff --git a/common/changes/office-ui-fabric-react/rickyp-2335_2017-08-05-00-16.json b/common/changes/office-ui-fabric-react/rickyp-2335_2017-08-05-00-16.json
deleted file mode 100644
index 8b137891791fe..0000000000000
--- a/common/changes/office-ui-fabric-react/rickyp-2335_2017-08-05-00-16.json
+++ /dev/null
@@ -1 +0,0 @@
-

From ef36b89981ad89d3eba9e81970bbb533763626c0 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 11 Aug 2017 19:38:35 +0000
Subject: [PATCH 0406/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 19 ++++
 apps/fabric-website/CHANGELOG.md              |  9 +-
 apps/fabric-website/package.json              |  4 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...ebsite-build-updates_2017-08-03-17-56.json | 11 ---
 ...d-rename-PowerBiLogo_2017-08-04-09-35.json | 11 ---
 ...d-rename-PowerBiLogo_2017-08-04-09-35.json | 11 ---
 ...han-hovercard-target_2017-08-09-23-26.json | 11 ---
 ...ceGroup-automationId_2017-07-14-16-11.json | 11 ---
 .../dropdown-width_2017-08-03-16-39.json      | 11 ---
 .../elcraig-nav_2017-08-08-19-47.json         | 11 ---
 .../elcraig-nav_2017-08-09-22-35.json         | 11 ---
 .../focus-zone-cdm_2017-08-01-00-34.json      | 11 ---
 ...boBoxControlledFixes_2017-08-10-00-16.json | 11 ---
 ...n-ComboBoxExampleFix_2017-08-09-12-53.json | 11 ---
 ...-CalendarArrowStyles_2017-08-09-16-51.json | 11 ---
 .../nav_2017-08-10-02-04.json                 | 11 ---
 .../rickyp-2335_2017-08-07-19-14.json         | 11 ---
 .../rickyp-2403_2_2017-08-08-01-31.json       | 11 ---
 .../stanleyy-onblur_2017-08-09-17-27.json     | 11 ---
 ...w-selection-examples_2017-08-08-22-34.json | 11 ---
 packages/example-app-base/package.json        |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 91 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 26 +++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/CHANGELOG.json               | 14 +++
 packages/styling/CHANGELOG.md                 |  9 +-
 packages/styling/package.json                 |  2 +-
 30 files changed, 174 insertions(+), 199 deletions(-)
 delete mode 100644 common/changes/@uifabric/fabric-website/miljo-website-build-updates_2017-08-03-17-56.json
 delete mode 100644 common/changes/@uifabric/styling/add-StreamLogo-and-rename-PowerBiLogo_2017-08-04-09-35.json
 delete mode 100644 common/changes/office-ui-fabric-react/add-StreamLogo-and-rename-PowerBiLogo_2017-08-04-09-35.json
 delete mode 100644 common/changes/office-ui-fabric-react/anihan-hovercard-target_2017-08-09-23-26.json
 delete mode 100644 common/changes/office-ui-fabric-react/antonla-choiceGroup-automationId_2017-07-14-16-11.json
 delete mode 100644 common/changes/office-ui-fabric-react/dropdown-width_2017-08-03-16-39.json
 delete mode 100644 common/changes/office-ui-fabric-react/elcraig-nav_2017-08-08-19-47.json
 delete mode 100644 common/changes/office-ui-fabric-react/elcraig-nav_2017-08-09-22-35.json
 delete mode 100644 common/changes/office-ui-fabric-react/focus-zone-cdm_2017-08-01-00-34.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxControlledFixes_2017-08-10-00-16.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxExampleFix_2017-08-09-12-53.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-CalendarArrowStyles_2017-08-09-16-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/nav_2017-08-10-02-04.json
 delete mode 100644 common/changes/office-ui-fabric-react/rickyp-2335_2017-08-07-19-14.json
 delete mode 100644 common/changes/office-ui-fabric-react/rickyp-2403_2_2017-08-08-01-31.json
 delete mode 100644 common/changes/office-ui-fabric-react/stanleyy-onblur_2017-08-09-17-27.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-selection-examples_2017-08-08-22-34.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 45b140ea53ac2..bed2bce46bf52 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.7.0",
+      "tag": "@uifabric/fabric-website_v4.7.0",
+      "date": "Fri, 11 Aug 2017 19:38:35 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "John Miller <rubixws@gmail.com>",
+            "commit": "16591f25f5ee2502e13e2ba1d764b4198e04d8ee",
+            "comment": "Updated fabric build system to use webpack dev server, removed the explicit !json loader in require statements."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.30.1 <5.0.0` to `>=4.32.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.6.0",
       "tag": "@uifabric/fabric-website_v4.6.0",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index f153bca633f5e..748a51eb36a4d 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Thu, 03 Aug 2017 10:13:03 GMT and should not be manually modified.
+This log was last generated on Fri, 11 Aug 2017 19:38:35 GMT and should not be manually modified.
+
+## 4.7.0
+Fri, 11 Aug 2017 19:38:35 GMT
+
+### Minor changes
+
+- Updated fabric build system to use webpack dev server, removed the explicit !json loader in require statements.
 
 ## 4.6.0
 Thu, 03 Aug 2017 10:13:03 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 23d840a29b6f6..110cc741f1ef5 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.6.0",
+  "version": "4.7.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -74,7 +74,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.30.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.32.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 678740f94b3af..c5dfc1c334019 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.30.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.32.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 6417917e86af5..0d2a2fa61c6a2 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -35,7 +35,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.30.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.32.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 2593c7aa38732..0983d9af6f344 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.30.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.32.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/fabric-website/miljo-website-build-updates_2017-08-03-17-56.json b/common/changes/@uifabric/fabric-website/miljo-website-build-updates_2017-08-03-17-56.json
deleted file mode 100644
index 93a177e1fe0db..0000000000000
--- a/common/changes/@uifabric/fabric-website/miljo-website-build-updates_2017-08-03-17-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Updated fabric build system to use webpack dev server, removed the explicit !json loader in require statements.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "miljo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/add-StreamLogo-and-rename-PowerBiLogo_2017-08-04-09-35.json b/common/changes/@uifabric/styling/add-StreamLogo-and-rename-PowerBiLogo_2017-08-04-09-35.json
deleted file mode 100644
index 991872c2a48dc..0000000000000
--- a/common/changes/@uifabric/styling/add-StreamLogo-and-rename-PowerBiLogo_2017-08-04-09-35.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "add StreamLogo and PowerBILogo icons",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "t-qianl@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/add-StreamLogo-and-rename-PowerBiLogo_2017-08-04-09-35.json b/common/changes/office-ui-fabric-react/add-StreamLogo-and-rename-PowerBiLogo_2017-08-04-09-35.json
deleted file mode 100644
index e3b69ae0e1ad0..0000000000000
--- a/common/changes/office-ui-fabric-react/add-StreamLogo-and-rename-PowerBiLogo_2017-08-04-09-35.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "add StreamLogo and PowerBILogo icons",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "t-qianl@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/anihan-hovercard-target_2017-08-09-23-26.json b/common/changes/office-ui-fabric-react/anihan-hovercard-target_2017-08-09-23-26.json
deleted file mode 100644
index 72b1ce2b07f70..0000000000000
--- a/common/changes/office-ui-fabric-react/anihan-hovercard-target_2017-08-09-23-26.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add target to hover card",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "atneik@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/antonla-choiceGroup-automationId_2017-07-14-16-11.json b/common/changes/office-ui-fabric-react/antonla-choiceGroup-automationId_2017-07-14-16-11.json
deleted file mode 100644
index 52227f7861268..0000000000000
--- a/common/changes/office-ui-fabric-react/antonla-choiceGroup-automationId_2017-07-14-16-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Mixing choice group fields with html input attributes",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "antonla@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/dropdown-width_2017-08-03-16-39.json b/common/changes/office-ui-fabric-react/dropdown-width_2017-08-03-16-39.json
deleted file mode 100644
index a411bb9030fb4..0000000000000
--- a/common/changes/office-ui-fabric-react/dropdown-width_2017-08-03-16-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Callout/Dropdown: Both components now support custom widths",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/elcraig-nav_2017-08-08-19-47.json b/common/changes/office-ui-fabric-react/elcraig-nav_2017-08-08-19-47.json
deleted file mode 100644
index d79b8ae0ba019..0000000000000
--- a/common/changes/office-ui-fabric-react/elcraig-nav_2017-08-08-19-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Nav: Add more options for nav link groups",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "elcraig@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/elcraig-nav_2017-08-09-22-35.json b/common/changes/office-ui-fabric-react/elcraig-nav_2017-08-09-22-35.json
deleted file mode 100644
index 33c76951abb49..0000000000000
--- a/common/changes/office-ui-fabric-react/elcraig-nav_2017-08-09-22-35.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Nav: fix bug with sublink padding",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "elcraig@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/focus-zone-cdm_2017-08-01-00-34.json b/common/changes/office-ui-fabric-react/focus-zone-cdm_2017-08-01-00-34.json
deleted file mode 100644
index e1f48fd70a783..0000000000000
--- a/common/changes/office-ui-fabric-react/focus-zone-cdm_2017-08-01-00-34.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "FocusZone: adjusting initialization logic to remove a potential memory leak in server rendered scenarios.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "rydelan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxControlledFixes_2017-08-10-00-16.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxControlledFixes_2017-08-10-00-16.json
deleted file mode 100644
index d7c329a792bb1..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxControlledFixes_2017-08-10-00-16.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Fix some functionality for when the comboBox is controlled",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxExampleFix_2017-08-09-12-53.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxExampleFix_2017-08-09-12-53.json
deleted file mode 100644
index 0193ef93c9d46..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxExampleFix_2017-08-09-12-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Update example to work correctly now that StrictNullChecks have been put in place",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kegorr-CalendarArrowStyles_2017-08-09-16-51.json b/common/changes/office-ui-fabric-react/kegorr-CalendarArrowStyles_2017-08-09-16-51.json
deleted file mode 100644
index 78adfecec84a1..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-CalendarArrowStyles_2017-08-09-16-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Calendar: added ability to customize navigation icons.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/nav_2017-08-10-02-04.json b/common/changes/office-ui-fabric-react/nav_2017-08-10-02-04.json
deleted file mode 100644
index b96c778fdb6dd..0000000000000
--- a/common/changes/office-ui-fabric-react/nav_2017-08-10-02-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Nav: update isGroupCollapsed for new groups",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "elcraig@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/rickyp-2335_2017-08-07-19-14.json b/common/changes/office-ui-fabric-react/rickyp-2335_2017-08-07-19-14.json
deleted file mode 100644
index e9bee94daf5d9..0000000000000
--- a/common/changes/office-ui-fabric-react/rickyp-2335_2017-08-07-19-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Change dropdown's role from \"combobox\" to \"menu\" ",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "rickyp@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/rickyp-2403_2_2017-08-08-01-31.json b/common/changes/office-ui-fabric-react/rickyp-2403_2_2017-08-08-01-31.json
deleted file mode 100644
index 405be77b2c82e..0000000000000
--- a/common/changes/office-ui-fabric-react/rickyp-2403_2_2017-08-08-01-31.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Changed DatePicker role to be more accurate for screen readers",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "rickyp@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/stanleyy-onblur_2017-08-09-17-27.json b/common/changes/office-ui-fabric-react/stanleyy-onblur_2017-08-09-17-27.json
deleted file mode 100644
index 17163a289e61c..0000000000000
--- a/common/changes/office-ui-fabric-react/stanleyy-onblur_2017-08-09-17-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add onFocus and onBlur for Pickers, SpinButton, SearchBox, and Rating. Add IBasePicker with focus().",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "stanleyy@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-selection-examples_2017-08-08-22-34.json b/common/changes/office-ui-fabric-react/v-krbrow-selection-examples_2017-08-08-22-34.json
deleted file mode 100644
index f4122a0971661..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-selection-examples_2017-08-08-22-34.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Selection: Fix broken selection state in example.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index b35f584d045c8..22d0a600c60a5 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -48,7 +48,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.19.0 <1.0.0",
+    "@uifabric/styling": ">=0.19.1 <1.0.0",
     "@uifabric/utilities": ">=4.9.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 19103ac8700b4..0513f1c348f96 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,97 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.32.0",
+      "tag": "office-ui-fabric-react_v4.32.0",
+      "date": "Fri, 11 Aug 2017 19:38:35 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Qianqian Li <lqq201194@163.com>",
+            "commit": "c66fa123e9533644a1e1401005c8dc8a425aa448",
+            "comment": "add StreamLogo and PowerBILogo icons"
+          },
+          {
+            "author": "Aniket Handa <atneik@users.noreply.github.com>",
+            "commit": "d5c814642cc050fea38ca3310cd222783ff7a678",
+            "comment": "Add target to hover card"
+          },
+          {
+            "author": "Elizabeth Craig <ecraig12345@gmail.com>",
+            "commit": "709a3da96e538f46e3c6ff7ba722550cc4cedfcc",
+            "comment": "Nav: fix bug with sublink padding"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "50b608ee4ee1ad5c948073121fd92f0fbaed81d5",
+            "comment": "FocusZone: adjusting initialization logic to remove a potential memory leak in server rendered scenarios."
+          },
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "16b6cf3cc48ef357b28af2e5abc3717f21044812",
+            "comment": "ComboBox: Update example to work correctly now that StrictNullChecks have been put in place"
+          },
+          {
+            "author": "Elizabeth Craig <ecraig12345@gmail.com>",
+            "commit": "7ac4aa1a0969d2195482d1bd9a6da99e95b16fc4",
+            "comment": "Nav: update isGroupCollapsed for new groups"
+          },
+          {
+            "author": "Ricky Patel <rickyp@microsoft.com>",
+            "commit": "d57ca247d7333fa86473482e2037e1a5aca2c2f2",
+            "comment": "Change dropdown's role from \"combobox\" to \"menu\" "
+          },
+          {
+            "author": "Ricky Patel <rickyp@microsoft.com>",
+            "commit": "850350776afe17bb20cfb16f7d1b2ab59e7058b3",
+            "comment": "Changed DatePicker role to be more accurate for screen readers"
+          },
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "1dd7376fecc68f3fb995d2279d871433967f7f16",
+            "comment": "Selection: Fix broken selection state in example."
+          }
+        ],
+        "minor": [
+          {
+            "author": "antonlabunets <alabunets@gmail.com>",
+            "commit": "a044e9533a8e9fe6906df2103e84ff8663ba6127",
+            "comment": "Mixing choice group fields with html input attributes"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "f4f9dc61003f76431d100794eb7d61ddfa2c4ab2",
+            "comment": "Callout/Dropdown: Both components now support custom widths"
+          },
+          {
+            "author": "Elizabeth Craig <ecraig12345@gmail.com>",
+            "commit": "38128798ac4d27ec6eae5036932742de15c56e21",
+            "comment": "Nav: Add more options for nav link groups"
+          },
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "4672a8423b1156afe54ad8be7439e947170658f0",
+            "comment": "ComboBox: Fix some functionality for when the comboBox is controlled"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "50b608ee4ee1ad5c948073121fd92f0fbaed81d5",
+            "comment": "Calendar: added ability to customize navigation icons."
+          },
+          {
+            "author": "Stanley Yao <stanley.yao@microsoft.com>",
+            "commit": "741bf74775697aa459121b4b1b81af7e44138991",
+            "comment": "Add onFocus and onBlur for Pickers, SpinButton, SearchBox, and Rating. Add IBasePicker with focus()."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.19.0 <1.0.0` to `>=0.19.1 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.31.0",
       "tag": "office-ui-fabric-react_v4.31.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 315a829a9b601..b4400b3e6054e 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,30 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 08 Aug 2017 15:28:32 GMT and should not be manually modified.
+This log was last generated on Fri, 11 Aug 2017 19:38:35 GMT and should not be manually modified.
+
+## 4.32.0
+Fri, 11 Aug 2017 19:38:35 GMT
+
+### Minor changes
+
+- Mixing choice group fields with html input attributes
+- Callout/Dropdown: Both components now support custom widths
+- Nav: Add more options for nav link groups
+- ComboBox: Fix some functionality for when the comboBox is controlled
+- Calendar: added ability to customize navigation icons.
+- Add onFocus and onBlur for Pickers, SpinButton, SearchBox, and Rating. Add IBasePicker with focus().
+
+### Patches
+
+- add StreamLogo and PowerBILogo icons
+- Add target to hover card
+- Nav: fix bug with sublink padding
+- FocusZone: adjusting initialization logic to remove a potential memory leak in server rendered scenarios.
+- ComboBox: Update example to work correctly now that StrictNullChecks have been put in place
+- Nav: update isGroupCollapsed for new groups
+- Change dropdown's role from "combobox" to "menu" 
+- Changed DatePicker role to be more accurate for screen readers
+- Selection: Fix broken selection state in example.
 
 ## 4.31.0
 Tue, 08 Aug 2017 15:28:32 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 7223a09bbd39f..114cb2f218091 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.31.0",
+  "version": "4.32.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
     "@uifabric/utilities": ">=4.9.0 <5.0.0",
-    "@uifabric/styling": ">=0.19.0 <1.0.0",
+    "@uifabric/styling": ">=0.19.1 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index c61515c1f6032..675289481519f 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.19.1",
+      "tag": "@uifabric/styling_v0.19.1",
+      "date": "Fri, 11 Aug 2017 19:38:35 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Qianqian Li <lqq201194@163.com>",
+            "commit": "c66fa123e9533644a1e1401005c8dc8a425aa448",
+            "comment": "add StreamLogo and PowerBILogo icons"
+          }
+        ]
+      }
+    },
     {
       "version": "0.19.0",
       "tag": "@uifabric/styling_v0.19.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 77f41a860a0d2..a88a8247fbd1a 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Tue, 08 Aug 2017 15:28:32 GMT and should not be manually modified.
+This log was last generated on Fri, 11 Aug 2017 19:38:35 GMT and should not be manually modified.
+
+## 0.19.1
+Fri, 11 Aug 2017 19:38:35 GMT
+
+### Patches
+
+- add StreamLogo and PowerBILogo icons
 
 ## 0.19.0
 Tue, 08 Aug 2017 15:28:32 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 0d3269a0a5b96..880b7479de357 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.19.0",
+  "version": "0.19.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From aed8e8abf6e9e97c6228d66e012e79da08fb63ea Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Fri, 11 Aug 2017 14:47:53 -0700
Subject: [PATCH 0407/1641] getFocusStyle: Add -moz-focus-inner to fix outline
 bug (#2478)

* Added moz-focus-inner to getFocusStyle

* change file
---
 .../styling/firefox-focus-style_2017-08-11-16-42.json | 11 +++++++++++
 packages/styling/src/styles/getFocusStyle.ts          |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/@uifabric/styling/firefox-focus-style_2017-08-11-16-42.json

diff --git a/common/changes/@uifabric/styling/firefox-focus-style_2017-08-11-16-42.json b/common/changes/@uifabric/styling/firefox-focus-style_2017-08-11-16-42.json
new file mode 100644
index 0000000000000..5fcbb423c550c
--- /dev/null
+++ b/common/changes/@uifabric/styling/firefox-focus-style_2017-08-11-16-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "getFocusStyle: Add -moz-focus-inner to fix outline bug",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/styling/src/styles/getFocusStyle.ts b/packages/styling/src/styles/getFocusStyle.ts
index 521911ec04a77..cb66fbaf6ca41 100644
--- a/packages/styling/src/styles/getFocusStyle.ts
+++ b/packages/styling/src/styles/getFocusStyle.ts
@@ -21,6 +21,7 @@ export function getFocusStyle(
   return mergeStyles(
     {
       outline: 'transparent',
+      '::-moz-focus-inner': { border: 0 },
       position
     },
     parent('.ms-Fabric.is-focusVisible', {

From e2719a852d779ea0d423dd700557c305bdab0796 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 14 Aug 2017 03:20:31 -0700
Subject: [PATCH 0408/1641] Applying package updates.

---
 .../firefox-focus-style_2017-08-11-16-42.json      | 11 -----------
 packages/example-app-base/package.json             |  2 +-
 packages/office-ui-fabric-react/package.json       |  2 +-
 packages/styling/CHANGELOG.json                    | 14 ++++++++++++++
 packages/styling/CHANGELOG.md                      |  9 ++++++++-
 packages/styling/package.json                      |  2 +-
 6 files changed, 25 insertions(+), 15 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/firefox-focus-style_2017-08-11-16-42.json

diff --git a/common/changes/@uifabric/styling/firefox-focus-style_2017-08-11-16-42.json b/common/changes/@uifabric/styling/firefox-focus-style_2017-08-11-16-42.json
deleted file mode 100644
index 5fcbb423c550c..0000000000000
--- a/common/changes/@uifabric/styling/firefox-focus-style_2017-08-11-16-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "getFocusStyle: Add -moz-focus-inner to fix outline bug",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 22d0a600c60a5..8b646ce04b946 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -48,7 +48,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.19.1 <1.0.0",
+    "@uifabric/styling": ">=0.19.2 <1.0.0",
     "@uifabric/utilities": ">=4.9.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 114cb2f218091..4cb21ec7bc2d6 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
     "@uifabric/utilities": ">=4.9.0 <5.0.0",
-    "@uifabric/styling": ">=0.19.1 <1.0.0",
+    "@uifabric/styling": ">=0.19.2 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 675289481519f..0b79175305406 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.19.2",
+      "tag": "@uifabric/styling_v0.19.2",
+      "date": "Mon, 14 Aug 2017 10:20:31 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "aed8e8abf6e9e97c6228d66e012e79da08fb63ea",
+            "comment": "getFocusStyle: Add -moz-focus-inner to fix outline bug"
+          }
+        ]
+      }
+    },
     {
       "version": "0.19.1",
       "tag": "@uifabric/styling_v0.19.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index a88a8247fbd1a..a3a69505f5e85 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 11 Aug 2017 19:38:35 GMT and should not be manually modified.
+This log was last generated on Mon, 14 Aug 2017 10:20:31 GMT and should not be manually modified.
+
+## 0.19.2
+Mon, 14 Aug 2017 10:20:31 GMT
+
+### Patches
+
+- getFocusStyle: Add -moz-focus-inner to fix outline bug
 
 ## 0.19.1
 Fri, 11 Aug 2017 19:38:35 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 880b7479de357..1b7de94b9af35 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.19.1",
+  "version": "0.19.2",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 56806c0cdbbbe9f8724d987d85dce31bc68cf0b6 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Mon, 14 Aug 2017 10:33:11 -0700
Subject: [PATCH 0409/1641] Create a Fabric Experiments Package (#2412)

* init fabric experiment

* Set Fabric as dependency

* fixed sass paths

* Trying loadPaths

* Added link to demo that it works

* removed mixins not in references yet

* removed another mixin

* Add test file

* turned off karma tests on build

* Add shrinkwrap updates

* revert shrinkwrap

* Fixed shrinkwrap

* Added readme

* Reenable tests and remove lint overrides

* tweaks to package.json

* New shrinkwrap after package.json updates

* Added tests.js file to common
---
 common/config/rush/npm-shrinkwrap.json        | 776 +++++++++++++-----
 .../.npmignore                                |  30 +
 .../office-ui-fabric-react-experiments/.npmrc |   2 +
 .../.vscode/settings.json                     |  37 +
 .../LICENSE                                   |  15 +
 .../README.md                                 |  17 +
 .../config/api-extractor.json.disabled        |   6 +
 .../gulpfile.js                               |  79 ++
 .../index.html                                |  48 ++
 .../jsconfig.json                             |   6 +
 .../karma.config.js                           | 115 +++
 .../package.json                              |  73 ++
 .../src/Link.ts                               |   1 +
 .../src/common/tests.js                       |  18 +
 .../src/components/Link/Link.Props.ts         |  23 +
 .../src/components/Link/Link.scss             |  44 +
 .../src/components/Link/Link.test.tsx         |  23 +
 .../src/components/Link/Link.tsx              |  75 ++
 .../src/components/Link/LinkPage.tsx          |  71 ++
 .../Link/examples/Link.Basic.Example.tsx      |  18 +
 .../src/components/Link/index.ts              |   2 +
 .../src/demo/AppDefinition.tsx                |  38 +
 .../src/demo/ColorStyles.scss                 |  26 +
 .../src/demo/GettingStartedPage.scss          |  57 ++
 .../src/demo/GettingStartedPage.tsx           |  87 ++
 .../src/demo/index.scss                       |   7 +
 .../src/demo/index.tsx                        |  94 +++
 .../src/index.ts                              |   6 +
 .../tsconfig.json                             |  36 +
 .../tslint.json                               |  15 +
 .../webpack.config.js                         |   5 +
 .../webpack.lib.config.js                     |  77 ++
 .../webpack.serve.config.js                   |  90 ++
 rush.json                                     |   5 +
 34 files changed, 1828 insertions(+), 194 deletions(-)
 create mode 100644 packages/office-ui-fabric-react-experiments/.npmignore
 create mode 100644 packages/office-ui-fabric-react-experiments/.npmrc
 create mode 100644 packages/office-ui-fabric-react-experiments/.vscode/settings.json
 create mode 100644 packages/office-ui-fabric-react-experiments/LICENSE
 create mode 100644 packages/office-ui-fabric-react-experiments/README.md
 create mode 100644 packages/office-ui-fabric-react-experiments/config/api-extractor.json.disabled
 create mode 100644 packages/office-ui-fabric-react-experiments/gulpfile.js
 create mode 100644 packages/office-ui-fabric-react-experiments/index.html
 create mode 100644 packages/office-ui-fabric-react-experiments/jsconfig.json
 create mode 100644 packages/office-ui-fabric-react-experiments/karma.config.js
 create mode 100644 packages/office-ui-fabric-react-experiments/package.json
 create mode 100644 packages/office-ui-fabric-react-experiments/src/Link.ts
 create mode 100644 packages/office-ui-fabric-react-experiments/src/common/tests.js
 create mode 100644 packages/office-ui-fabric-react-experiments/src/components/Link/Link.Props.ts
 create mode 100644 packages/office-ui-fabric-react-experiments/src/components/Link/Link.scss
 create mode 100644 packages/office-ui-fabric-react-experiments/src/components/Link/Link.test.tsx
 create mode 100644 packages/office-ui-fabric-react-experiments/src/components/Link/Link.tsx
 create mode 100644 packages/office-ui-fabric-react-experiments/src/components/Link/LinkPage.tsx
 create mode 100644 packages/office-ui-fabric-react-experiments/src/components/Link/examples/Link.Basic.Example.tsx
 create mode 100644 packages/office-ui-fabric-react-experiments/src/components/Link/index.ts
 create mode 100644 packages/office-ui-fabric-react-experiments/src/demo/AppDefinition.tsx
 create mode 100644 packages/office-ui-fabric-react-experiments/src/demo/ColorStyles.scss
 create mode 100644 packages/office-ui-fabric-react-experiments/src/demo/GettingStartedPage.scss
 create mode 100644 packages/office-ui-fabric-react-experiments/src/demo/GettingStartedPage.tsx
 create mode 100644 packages/office-ui-fabric-react-experiments/src/demo/index.scss
 create mode 100644 packages/office-ui-fabric-react-experiments/src/demo/index.tsx
 create mode 100644 packages/office-ui-fabric-react-experiments/src/index.ts
 create mode 100644 packages/office-ui-fabric-react-experiments/tsconfig.json
 create mode 100644 packages/office-ui-fabric-react-experiments/tslint.json
 create mode 100644 packages/office-ui-fabric-react-experiments/webpack.config.js
 create mode 100644 packages/office-ui-fabric-react-experiments/webpack.lib.config.js
 create mode 100644 packages/office-ui-fabric-react-experiments/webpack.serve.config.js

diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 0b1b25ad8c185..b21222ca4905e 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -384,9 +384,9 @@
       }
     },
     "@microsoft/sp-build-core-tasks": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/@microsoft/sp-build-core-tasks/-/sp-build-core-tasks-1.1.1.tgz",
-      "integrity": "sha1-fjXpjrqWpMlMQNoGIoU8n05vOVY=",
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/@microsoft/sp-build-core-tasks/-/sp-build-core-tasks-1.1.2.tgz",
+      "integrity": "sha1-Ao01gqCmrAOyF7BkO30Xgzwsv6Q=",
       "dependencies": {
         "@microsoft/gulp-core-build": {
           "version": "2.5.3",
@@ -651,9 +651,9 @@
       }
     },
     "@microsoft/sp-module-interfaces": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/sp-module-interfaces/-/sp-module-interfaces-1.1.0.tgz",
-      "integrity": "sha1-YW9ITO45IbtqnopIphZ7cyYxz54=",
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@microsoft/sp-module-interfaces/-/sp-module-interfaces-1.1.1.tgz",
+      "integrity": "sha1-AFAm2/RhZq+QhNpenMpRuZjAsIo=",
       "dependencies": {
         "@types/node": {
           "version": "6.0.64",
@@ -843,56 +843,53 @@
       "integrity": "sha1-fmBfGON9Pa9hQXd+zTLu34g4/ts="
     },
     "@microsoft/web-library-build": {
-      "version": "3.2.4",
-      "resolved": "https://registry.npmjs.org/@microsoft/web-library-build/-/web-library-build-3.2.4.tgz",
-      "integrity": "sha1-NmY+/vI2VsAHw6WSiV1eI32egXM=",
+      "version": "3.2.6",
+      "resolved": "https://registry.npmjs.org/@microsoft/web-library-build/-/web-library-build-3.2.6.tgz",
+      "integrity": "sha1-eQviy1300iCF3WhnHpkQZAYWSTk=",
       "dependencies": {
         "@microsoft/gulp-core-build": {
-          "version": "2.8.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.8.0.tgz",
-          "integrity": "sha1-4ZNBbueB7ZcgwvYOCZRfh5x0kgo="
+          "version": "2.9.1",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.1.tgz",
+          "integrity": "sha1-WzSh8iziNCjdhe4knuoybjmEak0="
         },
         "@microsoft/gulp-core-build-karma": {
-          "version": "2.3.4",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-karma/-/gulp-core-build-karma-2.3.4.tgz",
-          "integrity": "sha1-hyW4gytHFETH16DkxSOtRjqYIVM="
+          "version": "2.3.6",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-karma/-/gulp-core-build-karma-2.3.6.tgz",
+          "integrity": "sha1-YS7r0CWQ16G7QTyqS54WAkw9bt4="
         },
         "@microsoft/gulp-core-build-sass": {
           "version": "3.2.4",
           "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.2.4.tgz",
-          "integrity": "sha1-QsJ2WR5xG6+dGDhZ7aTqv04vaSo="
+          "integrity": "sha1-QsJ2WR5xG6+dGDhZ7aTqv04vaSo=",
+          "dependencies": {
+            "@microsoft/gulp-core-build": {
+              "version": "2.8.0",
+              "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.8.0.tgz",
+              "integrity": "sha1-4ZNBbueB7ZcgwvYOCZRfh5x0kgo="
+            }
+          }
         },
         "@microsoft/gulp-core-build-serve": {
-          "version": "2.1.5",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-serve/-/gulp-core-build-serve-2.1.5.tgz",
-          "integrity": "sha1-oNH517yG4lnBv8U1mLfDDZavPgs=",
+          "version": "2.1.6",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-serve/-/gulp-core-build-serve-2.1.6.tgz",
+          "integrity": "sha1-+zyD8q95nR0Ufoj7WjM8kW9hJYY=",
           "dependencies": {
             "@microsoft/gulp-core-build": {
-              "version": "2.7.2",
-              "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.7.2.tgz",
-              "integrity": "sha1-wmouduFjUWQVpmgScsjY8UNqInM="
-            },
-            "@types/semver": {
-              "version": "5.3.31",
-              "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.31.tgz",
-              "integrity": "sha1-uZnX2TX0P1IHsBsA094ghS9Mp18="
+              "version": "2.9.0",
+              "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.0.tgz",
+              "integrity": "sha1-Muok4TP1d89dpVlqV3k6ztB/9W8="
             }
           }
         },
         "@microsoft/gulp-core-build-webpack": {
-          "version": "1.2.2",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-webpack/-/gulp-core-build-webpack-1.2.2.tgz",
-          "integrity": "sha1-DEER3hfzc9RTNtOCftuKngnVRjU=",
+          "version": "1.2.3",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-webpack/-/gulp-core-build-webpack-1.2.3.tgz",
+          "integrity": "sha1-RsMPy71SC62KFbl9UtRw1FeWXsM=",
           "dependencies": {
             "@microsoft/gulp-core-build": {
-              "version": "2.7.2",
-              "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.7.2.tgz",
-              "integrity": "sha1-wmouduFjUWQVpmgScsjY8UNqInM="
-            },
-            "@types/semver": {
-              "version": "5.3.31",
-              "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.31.tgz",
-              "integrity": "sha1-uZnX2TX0P1IHsBsA094ghS9Mp18="
+              "version": "2.9.0",
+              "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.0.tgz",
+              "integrity": "sha1-Muok4TP1d89dpVlqV3k6ztB/9W8="
             }
           }
         },
@@ -1131,6 +1128,10 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "loader-utils": {
+          "version": "0.2.17",
+          "bundled": true
+        },
         "mocha": {
           "version": "3.3.0",
           "bundled": true
@@ -1169,7 +1170,13 @@
           "dependencies": {
             "string_decoder": {
               "version": "1.0.3",
-              "bundled": true
+              "bundled": true,
+              "dependencies": {
+                "safe-buffer": {
+                  "version": "5.1.1",
+                  "bundled": true
+                }
+              }
             }
           }
         },
@@ -1206,11 +1213,15 @@
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.8",
+          "version": "0.2.7",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.3",
+          "version": "2.0.2",
+          "bundled": true
+        },
+        "typescript": {
+          "version": "2.4.2",
           "bundled": true
         },
         "url": {
@@ -1234,9 +1245,13 @@
           }
         },
         "webpack": {
-          "version": "3.5.1",
+          "version": "3.4.1",
           "bundled": true,
           "dependencies": {
+            "ajv": {
+              "version": "5.2.2",
+              "bundled": true
+            },
             "async": {
               "version": "2.5.0",
               "bundled": true
@@ -1283,13 +1298,9 @@
         }
       }
     },
-    "@rush-temp/fabric-website": {
-      "version": "file:projects\\fabric-website",
+    "@rush-temp/experiments": {
+      "version": "file:projects\\experiments",
       "dependencies": {
-        "@types/react-addons-test-utils": {
-          "version": "0.14.19",
-          "bundled": true
-        },
         "acorn": {
           "version": "5.1.1",
           "bundled": true
@@ -1311,7 +1322,7 @@
           "bundled": true
         },
         "camelcase": {
-          "version": "3.0.0",
+          "version": "4.1.0",
           "bundled": true
         },
         "commander": {
@@ -1461,48 +1472,28 @@
           }
         },
         "webpack": {
-          "version": "3.5.2",
+          "version": "3.4.1",
           "bundled": true,
           "dependencies": {
             "async": {
               "version": "2.5.0",
-              "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
-              "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw=="
-            },
-            "camelcase": {
-              "version": "4.1.0",
-              "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
-              "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
+              "bundled": true
             },
             "has-flag": {
               "version": "2.0.0",
-              "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
-              "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
+              "bundled": true
             },
             "loader-utils": {
               "version": "1.1.0",
-              "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
-              "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
+              "bundled": true
             },
             "source-map": {
               "version": "0.5.6",
-              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz",
-              "integrity": "sha1-dc449SvwczxafwwRjYEzSiu19BI="
+              "bundled": true
             },
             "supports-color": {
               "version": "4.2.1",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
-              "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
-            },
-            "yargs": {
-              "version": "8.0.2",
-              "resolved": "https://registry.npmjs.org/yargs/-/yargs-8.0.2.tgz",
-              "integrity": "sha1-YpmpBVsc78lp/355wdkY3Osiw2A="
-            },
-            "yargs-parser": {
-              "version": "7.0.0",
-              "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-7.0.0.tgz",
-              "integrity": "sha1-jQrELxbqVd69MyyvTEA4s+P139k="
+              "bundled": true
             }
           }
         },
@@ -1521,18 +1512,26 @@
           "bundled": true
         },
         "yargs": {
-          "version": "6.6.0",
+          "version": "8.0.2",
           "bundled": true
         },
         "yargs-parser": {
-          "version": "4.2.1",
+          "version": "7.0.0",
           "bundled": true
         }
       }
     },
-    "@rush-temp/office-ui-fabric-react": {
-      "version": "file:projects\\office-ui-fabric-react",
+    "@rush-temp/fabric-website": {
+      "version": "file:projects\\fabric-website",
       "dependencies": {
+        "@types/react": {
+          "version": "15.0.38",
+          "bundled": true
+        },
+        "@types/react-addons-test-utils": {
+          "version": "0.14.19",
+          "bundled": true
+        },
         "acorn": {
           "version": "5.1.1",
           "bundled": true
@@ -1570,7 +1569,7 @@
           "bundled": true
         },
         "debug": {
-          "version": "2.6.8",
+          "version": "2.6.0",
           "bundled": true
         },
         "diff": {
@@ -1589,6 +1588,10 @@
           "version": "7.1.1",
           "bundled": true
         },
+        "highlight.js": {
+          "version": "9.11.0",
+          "bundled": true
+        },
         "https-browserify": {
           "version": "0.0.1",
           "bundled": true
@@ -1605,8 +1608,16 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "loader-utils": {
+          "version": "0.2.17",
+          "bundled": true
+        },
         "mocha": {
-          "version": "3.5.0",
+          "version": "3.3.0",
+          "bundled": true
+        },
+        "ms": {
+          "version": "0.7.2",
           "bundled": true
         },
         "node-libs-browser": {
@@ -1683,6 +1694,10 @@
           "version": "2.0.3",
           "bundled": true
         },
+        "typescript": {
+          "version": "2.4.2",
+          "bundled": true
+        },
         "url": {
           "version": "0.11.0",
           "bundled": true,
@@ -1704,7 +1719,7 @@
           }
         },
         "webpack": {
-          "version": "3.5.1",
+          "version": "3.5.2",
           "bundled": true,
           "dependencies": {
             "async": {
@@ -1753,6 +1768,259 @@
         }
       }
     },
+    "@rush-temp/office-ui-fabric-react": {
+      "version": "file:projects\\office-ui-fabric-react",
+      "dependencies": {
+        "acorn": {
+          "version": "5.1.1",
+          "bundled": true
+        },
+        "ajv": {
+          "version": "5.2.2",
+          "bundled": true
+        },
+        "ajv-keywords": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "ansi-regex": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "async": {
+          "version": "0.9.2",
+          "bundled": true
+        },
+        "camelcase": {
+          "version": "4.1.0",
+          "bundled": true
+        },
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
+        "constants-browserify": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "crypto-browserify": {
+          "version": "3.11.1",
+          "bundled": true
+        },
+        "debug": {
+          "version": "2.6.0",
+          "bundled": true
+        },
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
+        },
+        "enhanced-resolve": {
+          "version": "3.4.1",
+          "bundled": true
+        },
+        "find-up": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "glob": {
+          "version": "7.1.1",
+          "bundled": true
+        },
+        "has-flag": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "https-browserify": {
+          "version": "0.0.1",
+          "bundled": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "load-json-file": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "loader-utils": {
+          "version": "0.2.17",
+          "bundled": true
+        },
+        "mocha": {
+          "version": "3.4.2",
+          "bundled": true,
+          "dependencies": {
+            "has-flag": {
+              "version": "1.0.0",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "3.1.2",
+              "bundled": true
+            }
+          }
+        },
+        "ms": {
+          "version": "0.7.2",
+          "bundled": true
+        },
+        "node-libs-browser": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "os-browserify": {
+          "version": "0.2.1",
+          "bundled": true
+        },
+        "os-locale": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "path-type": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg-up": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "readable-stream": {
+          "version": "2.3.3",
+          "bundled": true,
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.1.1",
+              "bundled": true
+            },
+            "string_decoder": {
+              "version": "1.0.3",
+              "bundled": true
+            }
+          }
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "bundled": true
+        },
+        "source-list-map": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "source-map": {
+          "version": "0.1.43",
+          "bundled": true
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "bundled": true
+        },
+        "stream-browserify": {
+          "version": "2.0.1",
+          "bundled": true
+        },
+        "string-width": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "bundled": true
+        },
+        "strip-bom": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "supports-color": {
+          "version": "4.2.1",
+          "bundled": true
+        },
+        "tapable": {
+          "version": "0.2.7",
+          "bundled": true
+        },
+        "timers-browserify": {
+          "version": "2.0.2",
+          "bundled": true
+        },
+        "typescript": {
+          "version": "2.4.2",
+          "bundled": true
+        },
+        "url": {
+          "version": "0.11.0",
+          "bundled": true,
+          "dependencies": {
+            "punycode": {
+              "version": "1.3.2",
+              "bundled": true
+            }
+          }
+        },
+        "watchpack": {
+          "version": "1.4.0",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            }
+          }
+        },
+        "webpack": {
+          "version": "3.4.1",
+          "bundled": true,
+          "dependencies": {
+            "ajv": {
+              "version": "5.2.2",
+              "bundled": true
+            },
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "1.1.0",
+              "bundled": true
+            },
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
+        },
+        "webpack-sources": {
+          "version": "1.0.1",
+          "bundled": true,
+          "dependencies": {
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
+        },
+        "which-module": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "yargs": {
+          "version": "8.0.2",
+          "bundled": true
+        },
+        "yargs-parser": {
+          "version": "7.0.0",
+          "bundled": true
+        }
+      }
+    },
     "@rush-temp/office-ui-fabric-react-tslint": {
       "version": "file:projects\\office-ui-fabric-react-tslint"
     },
@@ -1871,12 +2139,20 @@
           "version": "2.3.3",
           "bundled": true,
           "dependencies": {
+            "safe-buffer": {
+              "version": "5.1.1",
+              "bundled": true
+            },
             "string_decoder": {
               "version": "1.0.3",
               "bundled": true
             }
           }
         },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "bundled": true
+        },
         "source-list-map": {
           "version": "2.0.0",
           "bundled": true
@@ -1902,11 +2178,11 @@
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.8",
+          "version": "0.2.7",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.3",
+          "version": "2.0.2",
           "bundled": true
         },
         "url": {
@@ -1924,13 +2200,21 @@
           "bundled": true
         },
         "webpack": {
-          "version": "3.5.1",
+          "version": "3.4.1",
           "bundled": true,
           "dependencies": {
+            "ajv": {
+              "version": "5.2.2",
+              "bundled": true
+            },
             "has-flag": {
               "version": "2.0.0",
               "bundled": true
             },
+            "loader-utils": {
+              "version": "1.1.0",
+              "bundled": true
+            },
             "supports-color": {
               "version": "4.2.1",
               "bundled": true
@@ -1958,6 +2242,10 @@
     "@rush-temp/styling": {
       "version": "file:projects\\styling",
       "dependencies": {
+        "@uifabric/utilities": {
+          "version": "1.10.4",
+          "bundled": true
+        },
         "acorn": {
           "version": "5.1.1",
           "bundled": true
@@ -1995,7 +2283,7 @@
           "bundled": true
         },
         "debug": {
-          "version": "2.6.8",
+          "version": "2.6.0",
           "bundled": true
         },
         "diff": {
@@ -2014,6 +2302,10 @@
           "version": "7.1.1",
           "bundled": true
         },
+        "has-flag": {
+          "version": "2.0.0",
+          "bundled": true
+        },
         "https-browserify": {
           "version": "0.0.1",
           "bundled": true
@@ -2030,14 +2322,36 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "loader-utils": {
+          "version": "0.2.17",
+          "bundled": true
+        },
         "mocha": {
-          "version": "3.5.0",
+          "version": "3.4.2",
+          "bundled": true,
+          "dependencies": {
+            "has-flag": {
+              "version": "1.0.0",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "3.1.2",
+              "bundled": true
+            }
+          }
+        },
+        "ms": {
+          "version": "0.7.2",
           "bundled": true
         },
         "node-libs-browser": {
           "version": "2.0.0",
           "bundled": true
         },
+        "office-ui-fabric-react": {
+          "version": "2.34.2",
+          "bundled": true
+        },
         "os-browserify": {
           "version": "0.2.1",
           "bundled": true
@@ -2062,12 +2376,20 @@
           "version": "2.3.3",
           "bundled": true,
           "dependencies": {
+            "safe-buffer": {
+              "version": "5.1.1",
+              "bundled": true
+            },
             "string_decoder": {
               "version": "1.0.3",
               "bundled": true
             }
           }
         },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "bundled": true
+        },
         "source-list-map": {
           "version": "2.0.0",
           "bundled": true
@@ -2097,15 +2419,19 @@
           "bundled": true
         },
         "supports-color": {
-          "version": "3.1.2",
+          "version": "4.2.1",
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.8",
+          "version": "0.2.7",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.3",
+          "version": "2.0.2",
+          "bundled": true
+        },
+        "typescript": {
+          "version": "2.4.2",
           "bundled": true
         },
         "url": {
@@ -2129,15 +2455,15 @@
           }
         },
         "webpack": {
-          "version": "3.5.1",
+          "version": "3.4.1",
           "bundled": true,
           "dependencies": {
-            "async": {
-              "version": "2.5.0",
+            "ajv": {
+              "version": "5.2.2",
               "bundled": true
             },
-            "has-flag": {
-              "version": "2.0.0",
+            "async": {
+              "version": "2.5.0",
               "bundled": true
             },
             "loader-utils": {
@@ -2147,10 +2473,6 @@
             "source-map": {
               "version": "0.5.6",
               "bundled": true
-            },
-            "supports-color": {
-              "version": "4.2.1",
-              "bundled": true
             }
           }
         },
@@ -2241,6 +2563,10 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "loader-utils": {
+          "version": "0.2.17",
+          "bundled": true
+        },
         "node-libs-browser": {
           "version": "2.0.0",
           "bundled": true
@@ -2308,11 +2634,15 @@
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.8",
+          "version": "0.2.7",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.3",
+          "version": "2.0.2",
+          "bundled": true
+        },
+        "typescript": {
+          "version": "2.4.2",
           "bundled": true
         },
         "url": {
@@ -2336,9 +2666,17 @@
           }
         },
         "webpack": {
-          "version": "3.5.1",
+          "version": "3.4.1",
           "bundled": true,
           "dependencies": {
+            "ajv": {
+              "version": "5.2.2",
+              "bundled": true
+            },
+            "ajv-keywords": {
+              "version": "2.1.0",
+              "bundled": true
+            },
             "async": {
               "version": "2.5.0",
               "bundled": true
@@ -2347,9 +2685,23 @@
               "version": "1.1.0",
               "bundled": true
             },
+            "source-list-map": {
+              "version": "2.0.0",
+              "bundled": true
+            },
             "source-map": {
               "version": "0.5.6",
               "bundled": true
+            },
+            "webpack-sources": {
+              "version": "1.0.1",
+              "bundled": true,
+              "dependencies": {
+                "source-list-map": {
+                  "version": "2.0.0",
+                  "bundled": true
+                }
+              }
             }
           }
         },
@@ -2378,7 +2730,13 @@
       }
     },
     "@rush-temp/todo-app": {
-      "version": "file:projects\\todo-app"
+      "version": "file:projects\\todo-app",
+      "dependencies": {
+        "typescript": {
+          "version": "2.4.2",
+          "bundled": true
+        }
+      }
     },
     "@rush-temp/utilities": {
       "version": "file:projects\\utilities",
@@ -2403,6 +2761,10 @@
           "version": "7.1.1",
           "bundled": true
         },
+        "loader-utils": {
+          "version": "0.2.17",
+          "bundled": true
+        },
         "mocha": {
           "version": "3.3.0",
           "bundled": true
@@ -2422,6 +2784,10 @@
         "supports-color": {
           "version": "3.1.2",
           "bundled": true
+        },
+        "typescript": {
+          "version": "2.4.2",
+          "bundled": true
         }
       }
     },
@@ -2686,9 +3052,9 @@
       "integrity": "sha512-CFIyoGyfnoC/pEp1exoKAeJuJr8vFc/ldKP0RDtD9IIdEqUBAQiByah6+bGMxntAtD84Osg6WCXcA1DpVlM75g=="
     },
     "@uifabric/styling": {
-      "version": "0.19.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.19.0.tgz",
-      "integrity": "sha512-jeMle8I1dBAG4l9t0BdgBEwAn2b2p4Jg0dH7L6t5xVA1BSptj8vGqcVay0nlnMLSkYU1yw5mbOnRqxl/xxdG7A=="
+      "version": "0.19.2",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.19.2.tgz",
+      "integrity": "sha512-RRnaQGrohT0fVmpb3jyA5J3V5znQsWapcUF06eLeh6wS6F8zX2geEqiujidJLg93E+0PHn+3f/G2tOcMWZAnnw=="
     },
     "@uifabric/utilities": {
       "version": "4.9.0",
@@ -3139,9 +3505,9 @@
       "integrity": "sha1-TK2iGTZS6zyp7I5VyQFWacmAaXg="
     },
     "binary-extensions": {
-      "version": "1.9.0",
-      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.9.0.tgz",
-      "integrity": "sha1-ZlBsFs5vTWkopbPNajPKQelB43s="
+      "version": "1.10.0",
+      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.10.0.tgz",
+      "integrity": "sha1-muuabF6IY4qtFx4Wf1kAq+JINdA="
     },
     "binaryextensions": {
       "version": "1.0.1",
@@ -3402,9 +3768,9 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000713",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000713.tgz",
-      "integrity": "sha1-6gF2GEC18Uj6+U7F800KodMhlm8="
+      "version": "1.0.30000715",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000715.tgz",
+      "integrity": "sha1-C5tceVlQ37rzAaiAa6/ofxJtqMo="
     },
     "capture-stack-trace": {
       "version": "1.0.0",
@@ -3675,9 +4041,9 @@
       "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s="
     },
     "concat-stream": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.5.0.tgz",
-      "integrity": "sha1-U/fUPFHF5D+ByP3QMyHGMb5o1hE=",
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.0.tgz",
+      "integrity": "sha1-CqxmL9Ur54lk1VMvaUeE5wEQrPc=",
       "dependencies": {
         "isarray": {
           "version": "1.0.0",
@@ -3685,9 +4051,14 @@
           "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
-          "version": "2.0.6",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz",
-          "integrity": "sha1-j5A0HmilPMySh4jaz80Rs265t44="
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
+        },
+        "string_decoder": {
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
         }
       }
     },
@@ -4161,9 +4532,9 @@
       "integrity": "sha1-s55/HabrCnW6nBcySzR1PEfgZU0="
     },
     "dns-packet": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.1.1.tgz",
-      "integrity": "sha1-I2nUUDivBF84mOb6VoYq7T9AKWw="
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.2.1.tgz",
+      "integrity": "sha512-eisukPHpsFmhEIDnm2mECIiT0huapmdkC0AH1Lvt613Kz2v1kwolrkecvguFazrqnpxvgYdtcMFTsmQzAeRXZQ=="
     },
     "dns-txt": {
       "version": "2.0.2",
@@ -4271,9 +4642,9 @@
       "integrity": "sha1-zIcsFoiArjxxiXYv1f/ACJbJUYo="
     },
     "electron-to-chromium": {
-      "version": "1.3.17",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.17.tgz",
-      "integrity": "sha1-QcE0V8xxZsXBXnZ65h2GqMrN7l0="
+      "version": "1.3.18",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.18.tgz",
+      "integrity": "sha1-PcyZ2j5rZl9qu8ccKK1Ros1zGpw="
     },
     "elliptic": {
       "version": "6.4.0",
@@ -4421,9 +4792,9 @@
       "integrity": "sha1-RTVSSKiJeQNLZ5Lhm7gfK3l13Q0="
     },
     "es5-ext": {
-      "version": "0.10.26",
-      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.26.tgz",
-      "integrity": "sha1-UbISilMbcMT2dkCTpzy+u4IYY3I="
+      "version": "0.10.27",
+      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.27.tgz",
+      "integrity": "sha512-3KXJRYzKXTd7xfFy5uZsJCXue55fAYQ035PRjyYk2PicllxIwcW9l3AbM/eGaw3vgVAUW4tl4xg9AXDEI6yw0w=="
     },
     "es6-collections": {
       "version": "0.5.6",
@@ -4711,14 +5082,14 @@
       "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
     },
     "extract-zip": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/extract-zip/-/extract-zip-1.5.0.tgz",
-      "integrity": "sha1-ksz22B73Cp+kwXRxFMzvbYaIpsQ=",
+      "version": "1.6.5",
+      "resolved": "https://registry.npmjs.org/extract-zip/-/extract-zip-1.6.5.tgz",
+      "integrity": "sha1-maBnNbbqIOqbcF13ms/8yHz/BEA=",
       "dependencies": {
         "debug": {
-          "version": "0.7.4",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-0.7.4.tgz",
-          "integrity": "sha1-BuHqgILCyxTjmAbiLi9vdX+Srzk="
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
         "minimist": {
           "version": "0.0.8",
@@ -4729,6 +5100,11 @@
           "version": "0.5.0",
           "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.0.tgz",
           "integrity": "sha1-HXMHam35hs2TROFecfzAWkyavxI="
+        },
+        "ms": {
+          "version": "0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         }
       }
     },
@@ -5549,9 +5925,9 @@
       "integrity": "sha1-jMvSCSs0W8LJFJVIOW31SWRspj8="
     },
     "glamor": {
-      "version": "2.20.39",
-      "resolved": "https://registry.npmjs.org/glamor/-/glamor-2.20.39.tgz",
-      "integrity": "sha512-tQ25Rmuad18jybnQgnsBzjhayPaK5Izy7SApBAaRnYQ50uA96SQEAoyymA8QNan51QyK1mB7dFUCX0OyaKa0yg=="
+      "version": "2.20.40",
+      "resolved": "https://registry.npmjs.org/glamor/-/glamor-2.20.40.tgz",
+      "integrity": "sha512-DNXCd+c14N9QF8aAKrfl4xakPk5FdcFwmH7sD0qnC0Pr7xoZ5W9yovhUrY/dJc3psfGGXC58vqQyRtuskyUJxA=="
     },
     "glob": {
       "version": "7.1.2",
@@ -6158,11 +6534,26 @@
           "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz",
           "integrity": "sha1-cVuW6phBWTzDMGeSP17GDr2k99c="
         },
+        "concat-stream": {
+          "version": "1.5.0",
+          "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.5.0.tgz",
+          "integrity": "sha1-U/fUPFHF5D+ByP3QMyHGMb5o1hE="
+        },
         "dateformat": {
           "version": "1.0.12",
           "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
           "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk="
         },
+        "debug": {
+          "version": "0.7.4",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-0.7.4.tgz",
+          "integrity": "sha1-BuHqgILCyxTjmAbiLi9vdX+Srzk="
+        },
+        "extract-zip": {
+          "version": "1.5.0",
+          "resolved": "https://registry.npmjs.org/extract-zip/-/extract-zip-1.5.0.tgz",
+          "integrity": "sha1-ksz22B73Cp+kwXRxFMzvbYaIpsQ="
+        },
         "form-data": {
           "version": "1.0.1",
           "resolved": "https://registry.npmjs.org/form-data/-/form-data-1.0.1.tgz",
@@ -6178,11 +6569,28 @@
           "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz",
           "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0="
         },
+        "isarray": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+        },
         "lodash": {
           "version": "3.10.1",
           "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
           "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
         },
+        "mkdirp": {
+          "version": "0.5.0",
+          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.0.tgz",
+          "integrity": "sha1-HXMHam35hs2TROFecfzAWkyavxI=",
+          "dependencies": {
+            "minimist": {
+              "version": "0.0.8",
+              "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
+              "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0="
+            }
+          }
+        },
         "node-uuid": {
           "version": "1.4.8",
           "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz",
@@ -6203,6 +6611,11 @@
           "resolved": "https://registry.npmjs.org/qs/-/qs-5.2.1.tgz",
           "integrity": "sha1-gB/uAw4LlFDWOFrcSKTMVbRK7fw="
         },
+        "readable-stream": {
+          "version": "2.0.6",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz",
+          "integrity": "sha1-j5A0HmilPMySh4jaz80Rs265t44="
+        },
         "request": {
           "version": "2.67.0",
           "resolved": "https://registry.npmjs.org/request/-/request-2.67.0.tgz",
@@ -6710,9 +7123,9 @@
           "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
         },
         "postcss": {
-          "version": "6.0.8",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.8.tgz",
-          "integrity": "sha512-G6WnRmdTt2jvJvY+aY+M0AO4YlbxE+slKPZb+jG2P2U9Tyxi3h1fYZ/DgiFU6DC6bv3XIEJoZt+f/kNh8BrWFw=="
+          "version": "6.0.9",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.9.tgz",
+          "integrity": "sha512-bBE2AHNEBhF23TfET6AA/lFP8ah+qHOZoFJEflFG+HgvVLdTmMOrocx/4LVVDIn3w6jUssw1q2Exk1cc9UOI8w=="
         },
         "supports-color": {
           "version": "4.2.1",
@@ -8426,9 +8839,9 @@
       "integrity": "sha1-JKwXdDPkou6REP5DWAutBZ+gBQk="
     },
     "office-ui-fabric-react": {
-      "version": "4.31.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.31.0.tgz",
-      "integrity": "sha512-4kOV3n/GwjtbGPLj4KTUyXroLVcMkaugrYz5UVqzqPKhTW58tqvgn4Q5+CBLCWZ8lNITtC+fxf9nWXEaKKNF9A=="
+      "version": "4.32.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.32.0.tgz",
+      "integrity": "sha512-0P7OgvX2rI+BjCYSqhG2yKrmlTSC9pQrus1RZZecb4dKRPLxZ0qqngh6MtsUwqPrWmCG8qf1yPfnsWvO5+jd+g=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -8763,15 +9176,10 @@
       "integrity": "sha1-jGpxY+m8j9n/2+fWBctTUvn7iR4="
     },
     "phantomjs-prebuilt": {
-      "version": "2.1.14",
-      "resolved": "https://registry.npmjs.org/phantomjs-prebuilt/-/phantomjs-prebuilt-2.1.14.tgz",
-      "integrity": "sha1-1T0xH8+30dCN2yQBRVjxGIxRbaA=",
+      "version": "2.1.15",
+      "resolved": "https://registry.npmjs.org/phantomjs-prebuilt/-/phantomjs-prebuilt-2.1.15.tgz",
+      "integrity": "sha1-IPhugtM0nFBZF1J3RbekEeCLOQM=",
       "dependencies": {
-        "caseless": {
-          "version": "0.11.0",
-          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz",
-          "integrity": "sha1-cVuW6phBWTzDMGeSP17GDr2k99c="
-        },
         "es6-promise": {
           "version": "4.0.5",
           "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.0.5.tgz",
@@ -8782,26 +9190,6 @@
           "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-1.0.0.tgz",
           "integrity": "sha1-zTzl9+fLYUWIP8rjGR6Yd/hYeVA="
         },
-        "har-validator": {
-          "version": "2.0.6",
-          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz",
-          "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0="
-        },
-        "qs": {
-          "version": "6.3.2",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-6.3.2.tgz",
-          "integrity": "sha1-51vV9uJoEioqDgvaYwslUMFmUCw="
-        },
-        "request": {
-          "version": "2.79.0",
-          "resolved": "https://registry.npmjs.org/request/-/request-2.79.0.tgz",
-          "integrity": "sha1-Tf5b9r6LjNw3/Pk+BLZVd3InEN4="
-        },
-        "tunnel-agent": {
-          "version": "0.4.3",
-          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz",
-          "integrity": "sha1-Y3PbdpCf5XDgjXNYM2Xtgop07us="
-        },
         "which": {
           "version": "1.2.14",
           "resolved": "https://registry.npmjs.org/which/-/which-1.2.14.tgz",
@@ -8996,9 +9384,9 @@
           "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
         },
         "postcss": {
-          "version": "6.0.8",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.8.tgz",
-          "integrity": "sha512-G6WnRmdTt2jvJvY+aY+M0AO4YlbxE+slKPZb+jG2P2U9Tyxi3h1fYZ/DgiFU6DC6bv3XIEJoZt+f/kNh8BrWFw=="
+          "version": "6.0.9",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.9.tgz",
+          "integrity": "sha512-bBE2AHNEBhF23TfET6AA/lFP8ah+qHOZoFJEflFG+HgvVLdTmMOrocx/4LVVDIn3w6jUssw1q2Exk1cc9UOI8w=="
         },
         "supports-color": {
           "version": "4.2.1",
@@ -9028,9 +9416,9 @@
           "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
         },
         "postcss": {
-          "version": "6.0.8",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.8.tgz",
-          "integrity": "sha512-G6WnRmdTt2jvJvY+aY+M0AO4YlbxE+slKPZb+jG2P2U9Tyxi3h1fYZ/DgiFU6DC6bv3XIEJoZt+f/kNh8BrWFw=="
+          "version": "6.0.9",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.9.tgz",
+          "integrity": "sha512-bBE2AHNEBhF23TfET6AA/lFP8ah+qHOZoFJEflFG+HgvVLdTmMOrocx/4LVVDIn3w6jUssw1q2Exk1cc9UOI8w=="
         },
         "supports-color": {
           "version": "4.2.1",
@@ -9060,9 +9448,9 @@
           "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
         },
         "postcss": {
-          "version": "6.0.8",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.8.tgz",
-          "integrity": "sha512-G6WnRmdTt2jvJvY+aY+M0AO4YlbxE+slKPZb+jG2P2U9Tyxi3h1fYZ/DgiFU6DC6bv3XIEJoZt+f/kNh8BrWFw=="
+          "version": "6.0.9",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.9.tgz",
+          "integrity": "sha512-bBE2AHNEBhF23TfET6AA/lFP8ah+qHOZoFJEflFG+HgvVLdTmMOrocx/4LVVDIn3w6jUssw1q2Exk1cc9UOI8w=="
         },
         "supports-color": {
           "version": "4.2.1",
@@ -9092,9 +9480,9 @@
           "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
         },
         "postcss": {
-          "version": "6.0.8",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.8.tgz",
-          "integrity": "sha512-G6WnRmdTt2jvJvY+aY+M0AO4YlbxE+slKPZb+jG2P2U9Tyxi3h1fYZ/DgiFU6DC6bv3XIEJoZt+f/kNh8BrWFw=="
+          "version": "6.0.9",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.9.tgz",
+          "integrity": "sha512-bBE2AHNEBhF23TfET6AA/lFP8ah+qHOZoFJEflFG+HgvVLdTmMOrocx/4LVVDIn3w6jUssw1q2Exk1cc9UOI8w=="
         },
         "supports-color": {
           "version": "4.2.1",
@@ -9730,9 +10118,9 @@
       "integrity": "sha1-Yl2GWPhlr0Psliv8N2o3NZpJlMo="
     },
     "selfsigned": {
-      "version": "1.9.1",
-      "resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-1.9.1.tgz",
-      "integrity": "sha1-zdpEktcNSGVw+HxlVGAjVY4d+lo=",
+      "version": "1.10.1",
+      "resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-1.10.1.tgz",
+      "integrity": "sha1-v4y3uDJWxFUeMTR8YxF3jbme7FI=",
       "dependencies": {
         "node-forge": {
           "version": "0.6.33",
@@ -10522,9 +10910,9 @@
       }
     },
     "tmp": {
-      "version": "0.0.31",
-      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.31.tgz",
-      "integrity": "sha1-jzirlDjhcxXl29izZX6L+yd65Kc="
+      "version": "0.0.33",
+      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.33.tgz",
+      "integrity": "sha512-jRCJlojKnZ3addtTOjdIqoRuPEKBvNXcGYqzO6zWZX8KfKEpnGY5jfggJQ3EjKuu8D4bJRr0y+cYJFmYbImXGw=="
     },
     "to-absolute-glob": {
       "version": "0.1.1",
@@ -11114,9 +11502,9 @@
           "integrity": "sha1-mTcqXJmb8t8WCvwNdL7U9HlIzSI="
         },
         "timers-browserify": {
-          "version": "2.0.3",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.3.tgz",
-          "integrity": "sha512-+JAqyNgg+M8+gXIrq2EeUr4kZqRz47Ysco7X5QKRGScRE9HIHckyHD1asozSFGeqx2nmPCgA8T5tIGVO0ML7/w=="
+          "version": "2.0.4",
+          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.4.tgz",
+          "integrity": "sha512-uZYhyU3EX8O7HQP+J9fTVYwsq90Vr68xPEFo7yrVImIxYvHgukBEgOB/SgGoorWVTzGM/3Z+wUNnboA4M8jWrg=="
         },
         "url": {
           "version": "0.11.0",
@@ -11417,9 +11805,9 @@
           "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         },
         "timers-browserify": {
-          "version": "2.0.3",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.3.tgz",
-          "integrity": "sha512-+JAqyNgg+M8+gXIrq2EeUr4kZqRz47Ysco7X5QKRGScRE9HIHckyHD1asozSFGeqx2nmPCgA8T5tIGVO0ML7/w=="
+          "version": "2.0.4",
+          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.4.tgz",
+          "integrity": "sha512-uZYhyU3EX8O7HQP+J9fTVYwsq90Vr68xPEFo7yrVImIxYvHgukBEgOB/SgGoorWVTzGM/3Z+wUNnboA4M8jWrg=="
         },
         "uglify-js": {
           "version": "2.7.5",
diff --git a/packages/office-ui-fabric-react-experiments/.npmignore b/packages/office-ui-fabric-react-experiments/.npmignore
new file mode 100644
index 0000000000000..6c28b2fcf1c04
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/.npmignore
@@ -0,0 +1,30 @@
+*.config.js
+*.nuspec
+*.yml
+*.test.*
+.editorconfig
+.gitattributes
+.gitignore
+.vscode
+coverage
+temp
+images
+results
+*.build.log
+dist/*.stats.html
+dist/demo*.*
+gulpfile.js
+index.html
+jsconfig.json
+karma.config.js
+node_modules
+src/**/*
+!src/**/*.Props.ts
+!src/**/*.Example.tsx
+tsconfig.json
+tsd.json
+tslint.json
+typings
+webpack.config.js
+fabric-test*
+visualtests
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-experiments/.npmrc b/packages/office-ui-fabric-react-experiments/.npmrc
new file mode 100644
index 0000000000000..825c83e09df4d
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/.npmrc
@@ -0,0 +1,2 @@
+registry=https://registry.npmjs.org/
+
diff --git a/packages/office-ui-fabric-react-experiments/.vscode/settings.json b/packages/office-ui-fabric-react-experiments/.vscode/settings.json
new file mode 100644
index 0000000000000..307cc081230ba
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/.vscode/settings.json
@@ -0,0 +1,37 @@
+{
+  // Controls the rendering size of tabs in characters. Accepted values: "auto", 2, 4, 6, etc. If set to "auto", the value will be guessed when a file is opened.
+  "editor.tabSize": 2,
+  // When opening a file, `editor.tabSize` and `editor.insertSpaces` will be detected based on the file contents.
+  "editor.detectIndentation": false,
+  // When enabled, will trim trailing whitespace when you save a file.
+  "files.trimTrailingWhitespace": true,
+  // Controls if the editor should automatically close brackets after opening them
+  "editor.autoClosingBrackets": false,
+  // Controls whether the editor should render whitespace characters
+  "editor.renderWhitespace": "all",
+  // Controls if the editor will insert spaces for tabs. Accepted values:  "auto", true, false. If set to "auto", the value will be guessed when a file is opened.
+  "editor.insertSpaces": true,
+  "files.exclude": {
+    "**/.git": true,
+    "**/.DS_Store": true,
+    "**/bower_components": true,
+    "**/coverage": true,
+    "**/*.scss.ts": true
+  },
+  // Configure glob patterns for excluding files and folders in searches. Inherits all glob patterns from the file.exclude setting.
+  "search.exclude": {
+    "**/node_modules": true,
+    "**/lib": true,
+    "**/lib-amd": true,
+    "**/dist": true,
+    "**/*.scss.ts": true
+  },
+  // Controls after how many characters the editor will wrap to the next line. Setting this to 0 turns on viewport width wrapping
+  "editor.wrappingColumn": 140,
+  "tslint.enable": true,
+  "tslint.rulesDirectory": "../../common/node_modules/tslint-microsoft-contrib",
+  // Defines space handling after opening and before closing JSX expression braces. Requires TypeScript >= 2.0.6.
+  "typescript.format.insertSpaceAfterOpeningAndBeforeClosingJsxExpressionBraces": true,
+  "editor.formatOnSave": true,
+  "typescript.tsdk": "../../common/node_modules/typescript/lib"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-experiments/LICENSE b/packages/office-ui-fabric-react-experiments/LICENSE
new file mode 100644
index 0000000000000..27a5ae5b1312c
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/LICENSE
@@ -0,0 +1,15 @@
+Office UI Fabric React Experiments
+
+Copyright (c) Microsoft Corporation
+
+All rights reserved.
+
+MIT License
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the ""Software""), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED *AS IS*, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
+Note: Usage of the fonts and icons referenced in Office UI Fabric is subject to the terms listed at http://aka.ms/fabric-assets-license
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-experiments/README.md b/packages/office-ui-fabric-react-experiments/README.md
new file mode 100644
index 0000000000000..721c55da64a9c
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/README.md
@@ -0,0 +1,17 @@
+# [Office UI Fabric React Experiments](http://dev.office.com/fabric)
+
+##### Experimental components for Office UI Fabric React
+
+These are not production ready components and __should never be used in product__. This experimental space is useful for testing new components whos API might change before final release.
+
+To import experimantal components:
+
+```js
+import { ComponentName } from '@officeui/experiments/lib/ComponentName';
+```
+
+Once the experimental component graduates to a production release the component will be available at:
+
+```js
+import { ComponentName } from 'office-ui-fabric-react/lib/ComponentName';
+```
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-experiments/config/api-extractor.json.disabled b/packages/office-ui-fabric-react-experiments/config/api-extractor.json.disabled
new file mode 100644
index 0000000000000..8d9598f25eeed
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/config/api-extractor.json.disabled
@@ -0,0 +1,6 @@
+{
+  "enabled": true,
+  "apiReviewFolder": "../common/reviews/api",
+  "apiJsonFolder": "./temp",
+  "entry": "src/index.ts"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-experiments/gulpfile.js b/packages/office-ui-fabric-react-experiments/gulpfile.js
new file mode 100644
index 0000000000000..0f36845be4ca6
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/gulpfile.js
@@ -0,0 +1,79 @@
+'use strict';
+
+let build = require('@microsoft/web-library-build');
+let serial = build.serial;
+let parallel = build.parallel;
+let buildConfig = build.getConfig();
+let gulp = require('gulp');
+let configFile = "./ftpconfig.json";
+let fs = require('fs');
+let path = require('path');
+let del = require('del');
+let gulpConnect = require('gulp-connect');
+
+let isProduction = process.argv.indexOf('--production') >= 0;
+let isNuke = process.argv.indexOf('nuke') >= 0;
+let {
+  libFolder,
+  distFolder,
+  packageFolder = ''
+} = buildConfig;
+
+// Configure custom lint overrides.
+let rules = Object.assign(
+  {},
+  require('./node_modules/@microsoft/gulp-core-build-typescript/lib/defaultTslint.json').rules,
+  require('./node_modules/office-ui-fabric-react-tslint/tslint.json').rules,
+  require('./tslint.json').rules
+);
+build.tslint.setConfig({
+  lintConfig: { rules },
+  displayAsWarning: false
+});
+
+// Configure TypeScript.
+// build.typescript.setConfig({ typescript: require('typescript') });
+build.TypeScriptConfiguration.setTypescriptCompiler(require('typescript'));
+// Use css modules.
+build.sass.setConfig({
+  useCSSModules: true,
+  moduleExportName: ''
+});
+
+// Use Karma Tests - Disable during develoment if prefered
+build.karma.isEnabled = () => true;
+
+// Disable unnecessary subtasks.
+build.preCopy.isEnabled = () => false;
+
+// Until typings work.
+//build.apiExtractor.isEnabled = () => false;
+
+// Copy fabric-core to dist to be published with fabric-react.
+build.postCopy.setConfig({
+  shouldFlatten: false,
+  copyTo: {
+    [path.join(distFolder, 'sass')]: [
+      'node_modules/office-ui-fabric-core/dist/sass/**/*.*'
+    ],
+    [path.join(distFolder, 'css')]: [
+      'node_modules/office-ui-fabric-core/dist/css/**/*.*'
+    ]
+  }
+});
+
+// Produce AMD bits in lib-amd on production builds.
+if (isProduction || isNuke) {
+  build.setConfig({
+    libAMDFolder: path.join(packageFolder, 'lib-amd')
+  });
+}
+
+// Short aliases for subtasks.
+build.task('webpack', build.webpack);
+build.task('tslint', build.tslint);
+build.task('ts', build.typescript);
+build.task('sass', build.sass);
+
+// initialize tasks.
+build.initialize(gulp);
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-experiments/index.html b/packages/office-ui-fabric-react-experiments/index.html
new file mode 100644
index 0000000000000..91f6558f337b1
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/index.html
@@ -0,0 +1,48 @@
+<!doctype html>
+<html>
+
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" user-scalable="no" />
+
+  <title>Office UI Fabric React Examples</title>
+
+</head>
+
+<body>
+  <div id="content"></div>
+  <script type="text/javascript">
+    window.FabricConfig = {
+      // Uncommenting this prevents the fontfaces from being registered.
+      // Alternatively you can specify a base url which contains the font/icon assets.
+      // fontBaseUrl: ''
+    };
+
+    var isProduction = (
+      document.location.search.indexOf('?min=0') === -1 && (
+        document.location.search.indexOf('?min=1') > -1 ||
+        location.pathname === '/fabric-react/master/'
+      ));
+
+    function loadScript(n) {
+      for (var i = 0; i < n.length; i++) {
+        var s = document.createElement('script');
+        s.src = n[i];
+        s.async = false;
+        document.body.appendChild(s);
+      }
+    }
+    loadScript(isProduction ? [
+      '//cdnjs.cloudflare.com/ajax/libs/react/15.4.0/react.min.js',
+      '//cdnjs.cloudflare.com/ajax/libs/react/15.4.0/react-dom.min.js',
+      'demo-app.min.js'
+    ] : [
+        '//cdnjs.cloudflare.com/ajax/libs/react/15.4.0/react.js',
+        '//cdnjs.cloudflare.com/ajax/libs/react/15.4.0/react-dom.js',
+        'demo-app.js'
+      ]);
+  </script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-experiments/jsconfig.json b/packages/office-ui-fabric-react-experiments/jsconfig.json
new file mode 100644
index 0000000000000..c25b2cc60e644
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/jsconfig.json
@@ -0,0 +1,6 @@
+{
+  "compilerOptions": {
+    "target": "ES6",
+    "module": "commonjs"
+  }
+}
diff --git a/packages/office-ui-fabric-react-experiments/karma.config.js b/packages/office-ui-fabric-react-experiments/karma.config.js
new file mode 100644
index 0000000000000..6eb13997c250b
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/karma.config.js
@@ -0,0 +1,115 @@
+'use strict';
+
+// Karma configuration
+// Generated on Thu Oct 08 2015 18:13:05 GMT-0700 (PDT)
+
+let path = require('path');
+let build = require('@microsoft/web-library-build');
+let webpack = require('webpack');
+let buildConfig = build.getConfig();
+let configResources = build.karma.resources;
+let bindPolyfillPath = configResources.bindPolyfillPath;
+let debugRun = (process.argv.indexOf('--debug') > -1);
+
+module.exports = function (config) {
+  let karmaConfig = {
+
+    // base path that will be used to resolve all patterns (eg. files, exclude)
+    basePath: '.',
+
+    // frameworks to use
+    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
+    frameworks: ['mocha', 'sinon-chai'],
+
+
+    // list of files / patterns to load in the browser
+    files: [bindPolyfillPath].concat([path.join(buildConfig.libFolder, 'common/tests.js')]),
+
+    // list of files to exclude
+    exclude: [],
+
+
+    // webpack config for bundling tests.
+    webpack: {
+      devtool: 'inline-source-map',
+      module: {
+        loaders: [
+          {
+            test: /sinon\/pkg\/sinon/,
+            loader: "imports?define=>false,require=>false"
+          },
+          debugRun ? {} : {
+            test: /\.js/,
+            exclude: /(test|node_modules|bower_components)/,
+            loader: configResources.istanbulInstrumenterLoaderPath,
+            enforce: 'post'
+          }
+        ],
+      },
+      externals: {
+        'cheerio': 'window',
+        'react/addons': true,
+        'react/lib/ExecutionEnvironment': true,
+        'react/lib/ReactContext': true
+      },
+      resolve: {
+        modules: [
+          buildConfig.libFolder,
+          'node_modules'
+        ]
+      },
+      plugins: [
+        new webpack.DefinePlugin({
+          'process.env.NODE_ENV': JSON.stringify('production')
+        })
+      ]
+    },
+
+    webpackMiddleware: {
+      noInfo: true
+    },
+
+    // preprocess matching files before serving them to the browser
+    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
+    preprocessors: {
+      [path.join(buildConfig.libFolder, '/**/*.js')]: ['webpack']
+    },
+
+    plugins: configResources.plugins.concat([
+    ]),
+
+    // test results reporter to use
+    // possible values: 'dots', 'progress'
+    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
+    reporters: ['mocha-clean', 'coverage'],
+
+
+    // web server port
+    port: 9876,
+
+
+    // enable / disable colors in the output (reporters and logs)
+    colors: true,
+
+
+    // level of logging
+    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
+    logLevel: config.LOG_INFO,
+
+
+    // enable / disable watching file and executing tests whenever any file changes
+    autoWatch: false,
+
+
+    // start these browsers
+    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
+    browsers: ['PhantomJS'],
+
+
+    // Continuous Integration mode
+    // if true, Karma captures browsers, runs the tests and exits
+    singleRun: true
+  };
+
+  config.set(karmaConfig);
+};
diff --git a/packages/office-ui-fabric-react-experiments/package.json b/packages/office-ui-fabric-react-experiments/package.json
new file mode 100644
index 0000000000000..39662c8464dd5
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/package.json
@@ -0,0 +1,73 @@
+{
+  "name": "@uifabric/experiments",
+  "version": "0.0.1",
+  "description": "Experimental React components for building experiences for Office 365.",
+  "main": "lib/index.js",
+  "typings": "lib/index.d.ts",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/OfficeDev/office-ui-fabric-react"
+  },
+  "license": "MIT",
+  "scripts": {
+    "build": "gulp",
+    "clean": "gulp clean",
+    "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.serve.config.js --open",
+    "test": "gulp"
+  },
+  "devDependencies": {
+    "@microsoft/load-themed-styles": "^1.5.1",
+    "@microsoft/web-library-build": "^3.2.1",
+    "@types/chai": "3.4.35",
+    "@types/enzyme": "2.8.0",
+    "@types/es6-promise": "^0.0.32",
+    "@types/mocha": "2.2.39",
+    "@types/prop-types": "15.5.1",
+    "@types/react": "15.0.38",
+    "@types/react-addons-test-utils": "0.14.18",
+    "@types/react-dom": "15.5.1",
+    "@types/resemblejs": "~1.3.28",
+    "@types/sinon": "2.2.2",
+    "@types/webpack-env": "1.13.0",
+    "@uifabric/example-app-base": ">=4.2.0 <5.0.0",
+    "autoprefixer": "^6.7.6",
+    "chai": "^3.5.0",
+    "css-loader": "^0.28.0",
+    "enzyme": "^2.7.0",
+    "es6-promise": "^4.1.0",
+    "es6-weak-map": "^2.0.2",
+    "git-rev": "0.2.1",
+    "gulp": "~3.9.1",
+    "gutil": "1.6.4",
+    "highlight.js": "^9.6.0",
+    "load-themed-styles-loader": "^0.0.3",
+    "mocha": "^3.2.0",
+    "mocha-loader": "^1.1.1",
+    "node-sass": "^4.5.0",
+    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
+    "postcss-loader": "^1.3.3",
+    "raw-loader": "^0.5.1",
+    "react": "^15.4.2",
+    "react-addons-test-utils": "^15.4.2",
+    "react-dom": "^15.4.2",
+    "react-highlight": "0.9.0",
+    "sass-loader": "^6.0.3",
+    "sinon": "^2.3.2",
+    "source-map-loader": "0.2.1",
+    "style-loader": "^0.17.0",
+    "ts-loader": "^2.0.1",
+    "typescript": "2.4.2",
+    "vinyl-ftp": "0.6.0",
+    "webpack": "^3.4.1",
+    "webpack-bundle-analyzer": "^2.2.1",
+    "webpack-dev-server": "^2.4.1",
+    "webpack-notifier": "^1.5.0"
+  },
+  "dependencies": {
+    "office-ui-fabric-react": ">=4.31.0"
+  },
+  "peerDependencies": {
+    "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
+    "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-experiments/src/Link.ts b/packages/office-ui-fabric-react-experiments/src/Link.ts
new file mode 100644
index 0000000000000..9fed7079908fd
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/src/Link.ts
@@ -0,0 +1 @@
+export * from './components/Link/index';
diff --git a/packages/office-ui-fabric-react-experiments/src/common/tests.js b/packages/office-ui-fabric-react-experiments/src/common/tests.js
new file mode 100644
index 0000000000000..3a716c9dd52da
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/src/common/tests.js
@@ -0,0 +1,18 @@
+'use strict';
+
+// Polyfills
+require('es6-weak-map/implement');
+
+/**
+ * This is a test entry point to help karma-webpack find all tests in the project.
+ **/
+
+// Before loading modules, treat errors and warnings as test failures.
+console.error = console.warn = function (warning) {
+  throw new Error(warning);
+}
+
+var context = require.context('..', true, /.+\.test\.js?$/);
+
+context.keys().forEach(context);
+module.exports = context;
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-experiments/src/components/Link/Link.Props.ts b/packages/office-ui-fabric-react-experiments/src/components/Link/Link.Props.ts
new file mode 100644
index 0000000000000..d72ae7b73816b
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/src/components/Link/Link.Props.ts
@@ -0,0 +1,23 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+import { Link } from './Link';
+
+export interface ILink {
+  /** Sets focus to the link. */
+  focus(): void;
+}
+
+export interface ILinkProps extends React.AllHTMLAttributes<HTMLAnchorElement | HTMLButtonElement | HTMLElement | Link> {
+  /**
+   * Optional callback to access the ILink interface. Use this instead of ref for accessing
+   * the public methods and properties of the component.
+   */
+  componentRef?: (component: ILink) => void;
+
+  /**
+   * Whether the link is disabled
+   */
+  disabled?: boolean;
+
+}
diff --git a/packages/office-ui-fabric-react-experiments/src/components/Link/Link.scss b/packages/office-ui-fabric-react-experiments/src/components/Link/Link.scss
new file mode 100644
index 0000000000000..00ffe5e1a7722
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/src/components/Link/Link.scss
@@ -0,0 +1,44 @@
+@import '~office-ui-fabric-react/dist/sass/References';
+
+// Element: ms-Link root component
+.root {
+  color: $ms-color-themePrimary;
+  margin: 0;
+  overflow: inherit;
+  padding: 0;
+  text-overflow: inherit;
+}
+
+// State: The button is not disabled.
+.isEnabled {
+  &:hover,
+  &:focus {
+    color: $ms-color-themeDarker;
+  }
+
+  &:active {
+    color: $ms-color-themePrimary;
+  }
+}
+
+// State: The button is disabled.
+.isDisabled {
+  color: $ms-color-neutralTertiary;
+  pointer-events: none;
+  cursor: default;
+}
+
+
+// Link implemented as a button.
+button.root {
+  background: none;
+  border: none;
+  cursor: pointer;
+  display: inline;
+  font-size: inherit; // Ensure that we inherit font size, rather than the browser's default.
+}
+
+// Link implemented as an anchor.
+a.root {
+  text-decoration: none;
+}
diff --git a/packages/office-ui-fabric-react-experiments/src/components/Link/Link.test.tsx b/packages/office-ui-fabric-react-experiments/src/components/Link/Link.test.tsx
new file mode 100644
index 0000000000000..3fbe90a4f88e0
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/src/components/Link/Link.test.tsx
@@ -0,0 +1,23 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+
+import * as ReactDOM from 'react-dom';
+import * as ReactTestUtils from 'react-addons-test-utils';
+
+let { expect } = chai;
+
+import { Link } from './Link';
+
+describe('Link', () => {
+
+  it('renders a link', () => {
+    let component = ReactTestUtils.renderIntoDocument(
+      <Link href='#'>test</Link >
+    );
+    let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
+
+    expect(renderedDOM.textContent).to.equal('test');
+  });
+
+});
diff --git a/packages/office-ui-fabric-react-experiments/src/components/Link/Link.tsx b/packages/office-ui-fabric-react-experiments/src/components/Link/Link.tsx
new file mode 100644
index 0000000000000..d6986fbf328d1
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/src/components/Link/Link.tsx
@@ -0,0 +1,75 @@
+import * as React from 'react';
+import {
+  BaseComponent,
+  anchorProperties,
+  autobind,
+  buttonProperties,
+  css,
+  getNativeProps
+} from 'office-ui-fabric-react/lib/Utilities';
+import { ILink, ILinkProps } from './Link.Props';
+import * as stylesImport from './Link.scss';
+const styles: any = stylesImport;
+
+interface IMyScreen extends Screen {
+  left: number;
+  top: number;
+}
+
+declare var screen: IMyScreen;
+
+export class Link extends BaseComponent<ILinkProps, any> implements ILink {
+  private _link: HTMLElement;
+
+  public render() {
+    let { disabled, children, className, href } = this.props;
+
+    return (
+      href ? (
+        <a
+          { ...getNativeProps(this.props, anchorProperties) }
+          className={ css(
+            'ms-Link',
+            styles.root,
+            className,
+            disabled && ('is-disabled ' + styles.isDisabled),
+            !disabled && styles.isEnabled
+          ) }
+          onClick={ this._onClick }
+          ref={ this._resolveRef('_link') }
+          target={ this.props.target }
+        >
+          { children }
+        </a>
+      ) : (
+          <button
+            { ...getNativeProps(this.props, buttonProperties) }
+            className={ css(
+              'ms-Link',
+              styles.root,
+              className,
+              disabled && ('is-disabled ' + styles.isDisabled)
+            ) }
+            onClick={ this._onClick }
+            ref={ this._resolveRef('_link') }
+          >
+            { children }
+          </button>
+        ));
+  }
+
+  public focus() {
+    if (this._link) {
+      this._link.focus();
+    }
+  }
+
+  @autobind
+  private _onClick(ev: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>) {
+    let { onClick } = this.props;
+
+    if (onClick) {
+      onClick(ev);
+    }
+  }
+}
diff --git a/packages/office-ui-fabric-react-experiments/src/components/Link/LinkPage.tsx b/packages/office-ui-fabric-react-experiments/src/components/Link/LinkPage.tsx
new file mode 100644
index 0000000000000..8b120691da096
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/src/components/Link/LinkPage.tsx
@@ -0,0 +1,71 @@
+import * as React from 'react';
+import {
+  ExampleCard,
+  IComponentDemoPageProps,
+  ComponentPage,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+import { LinkBasicExample } from './examples/Link.Basic.Example';
+
+let LinkBasicExampleCode = require('!raw-loader!office-ui-fabric-react-experiments/src/components/Link/examples/Link.Basic.Example.tsx') as string;
+
+export class LinkPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render() {
+    return (
+      <ComponentPage
+        title='Link'
+        componentName='LinkExample'
+        exampleCards={
+          <ExampleCard title='Link' code={ LinkBasicExampleCode }>
+            <LinkBasicExample />
+          </ExampleCard>
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!office-ui-fabric-react-experiments/src/components/Link/Link.Props.ts')
+            ] }
+          />
+        }
+        overview={
+          <div>
+            <p>
+              With a Link, users can navigate to another page, window, or Help topic; display a definition; initiate a command; or choose an option. A Link indicates that it can be clicked, typically by being displayed using the visited or unvisited link system colors. Traditionally, Links are underlined as well, but that approach is often unnecessary and falling out of favor to reduce visual clutter.
+            </p>
+
+            <p>
+              A Link is the lightest weight clickable control, and is often used to reduce the visual complexity of a design.
+            </p>
+          </div>
+        }
+        bestPractices={
+          <div></div>
+        }
+        dos={
+          <div>
+            <ul>
+              <li>Use to navigate to another page, window, or help topic; display a definition; initiate a command; or choose an option.</li>
+              <li>Make Links discoverable by visual inspection alone. Users shouldn't have to interact with your program to find links.</li>
+              <li>Use Links that give specific descriptive information about the result of clicking on the link, using as much text as necessary. Users should be able to accurately predict the result of a link from its link text and optional Tooltip.</li>
+              <li>Use text that suggests clicking, such as a command starting with an imperative verb like "Show", "Print", "Copy", or "Delete".</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul>
+              <li>
+                Use if the action is destructive or irreversible. Because users associate links with navigation (and the ability to back out), Links aren't appropriate for commands with significant consequences.
+              </li>
+            </ul>
+          </div>
+        }
+        related={
+          <a href='https://dev.office.com/fabric-js/Components/Link/Link.html'>Fabric JS</a>
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }>
+      </ComponentPage>
+    );
+  }
+
+}
diff --git a/packages/office-ui-fabric-react-experiments/src/components/Link/examples/Link.Basic.Example.tsx b/packages/office-ui-fabric-react-experiments/src/components/Link/examples/Link.Basic.Example.tsx
new file mode 100644
index 0000000000000..eb42503fcd2eb
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/src/components/Link/examples/Link.Basic.Example.tsx
@@ -0,0 +1,18 @@
+import * as React from 'react';
+import { Link } from 'office-ui-fabric-react/lib/Link';
+
+export class LinkBasicExample extends React.Component<any, any> {
+  public render() {
+    return (
+      <div>
+        <span>When a link has an href, </span>
+        <Link href='http://dev.office.com/fabric/components/link'>it renders as an anchor tag.</Link>
+        <span> Without an href, </span>
+        <Link>the link is rendered as a button</Link>.
+        <span> You can also use the disabled attribute to create a </span>
+        <Link disabled={ true } href='http://dev.office.com/fabric/components/link'>disabled link</Link>.
+      </div>
+    );
+  }
+
+}
diff --git a/packages/office-ui-fabric-react-experiments/src/components/Link/index.ts b/packages/office-ui-fabric-react-experiments/src/components/Link/index.ts
new file mode 100644
index 0000000000000..ac3d784d97918
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/src/components/Link/index.ts
@@ -0,0 +1,2 @@
+export * from './Link';
+export * from './Link.Props';
diff --git a/packages/office-ui-fabric-react-experiments/src/demo/AppDefinition.tsx b/packages/office-ui-fabric-react-experiments/src/demo/AppDefinition.tsx
new file mode 100644
index 0000000000000..38471be1ffba1
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/src/demo/AppDefinition.tsx
@@ -0,0 +1,38 @@
+import * as React from 'react';
+import { App as AppBase, IAppDefinition, IAppProps } from '@uifabric/example-app-base';
+
+export const AppDefinition: IAppDefinition = {
+  appTitle: 'Fabric - React',
+
+  testPages: [
+  ],
+  examplePages: [
+    {
+      links: [
+        {
+          component: require<any>('../components/Link/LinkPage').LinkPage,
+          key: 'Link',
+          name: 'Link',
+          url: '#/examples/link'
+        },
+      ]
+    }
+  ],
+  headerLinks: [
+    {
+      name: 'Getting started',
+      url: '#/'
+    },
+    {
+      name: 'Fabric',
+      url: 'http://dev.office.com/fabric'
+    },
+    {
+      name: 'Github',
+      url: 'http://www.github.com/officedev'
+    }
+  ]
+
+};
+
+export const App = (props: IAppProps) => <AppBase appDefinition={ AppDefinition } { ...props } />;
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-experiments/src/demo/ColorStyles.scss b/packages/office-ui-fabric-react-experiments/src/demo/ColorStyles.scss
new file mode 100644
index 0000000000000..4e99d1f56a3df
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/src/demo/ColorStyles.scss
@@ -0,0 +1,26 @@
+@import '~office-ui-fabric-react/dist/sass/References';
+
+:global {
+  .hljs {
+    background: $ms-color-neutralDark;
+    color: $ms-color-white;
+  }
+  .hljs-comment, .hljs-quote {
+    color: #777;
+  }
+  .hljs-variable, .hljs-template-variable, .hljs-tag, .hljs-regexp, .hljs-meta, .hljs-number, .hljs-built_in, .hljs-builtin-name, .hljs-literal, .hljs-params, .hljs-symbol, .hljs-bullet, .hljs-link, .hljs-deletion {
+    color: #ab875d;
+  }
+  .hljs-section, .hljs-title, .hljs-name, .hljs-selector-id, .hljs-selector-class, .hljs-type, .hljs-attribute {
+    color: #9b869b;
+  }
+  .hljs-string, .hljs-keyword, .hljs-selector-tag, .hljs-addition {
+    color: #8f9c6c;
+  }
+  .hljs-emphasis {
+    font-style: italic;
+  }
+  .hljs-strong {
+    font-weight: bold;
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-experiments/src/demo/GettingStartedPage.scss b/packages/office-ui-fabric-react-experiments/src/demo/GettingStartedPage.scss
new file mode 100644
index 0000000000000..4c2a000d2643e
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/src/demo/GettingStartedPage.scss
@@ -0,0 +1,57 @@
+@import '~office-ui-fabric-react/dist/sass/References';
+
+:global {
+  .ms-GettingStartedPage {
+    margin-top: -20px;
+    padding: 40px;
+
+    h1 {
+      @include ms-font-xxl;
+    }
+
+    h2 {
+      @include ms-font-xl;
+    }
+
+    h3 {
+      @include ms-font-l;
+    }
+
+  }
+
+  .ms-GettingStartedPage-banner {
+    padding: 1px 20px;
+    margin: -20px;
+    margin-bottom: 20px;
+    // border-bottom: 1px solid $ms-color-neutralTertiaryAlt;
+
+    h1 {
+      margin-bottom: 0;
+    }
+
+    h3 {
+      margin-top: 0;
+    }
+  }
+
+  @media (max-width: $ms-screen-max-lg) {
+    .ms-GettingStartedPage-banner {
+      margin: -20px 0;
+      margin-bottom: 20px;
+    }
+  }
+
+  .ms-GettingStartedPage-code {
+    background: $ms-color-neutralDark;
+    padding: 20px;
+
+    pre {
+      margin: 0;
+    }
+
+    .hljs {
+      background: inherit;
+      padding: 0;
+    }
+  }
+}
diff --git a/packages/office-ui-fabric-react-experiments/src/demo/GettingStartedPage.tsx b/packages/office-ui-fabric-react-experiments/src/demo/GettingStartedPage.tsx
new file mode 100644
index 0000000000000..b77c7cef01bef
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/src/demo/GettingStartedPage.tsx
@@ -0,0 +1,87 @@
+import * as React from 'react';
+import { Link } from 'office-ui-fabric-react/lib/Link';
+import './GettingStartedPage.scss';
+import { Highlight } from '@uifabric/example-app-base';
+
+export class GettingStartedPage extends React.Component<any, any> {
+  public render() {
+    return (
+      <div className='ms-GettingStartedPage'>
+
+        <div className='ms-GettingStartedPage-banner'>
+          <h1>office-ui-fabric-react-experiments!</h1>
+          <h3>A library of reusable, generic React components</h3>
+        </div>
+
+        <h2>Overview</h2>
+
+        <p>{
+          `Fabric React components are built as production ready components to be used in Microsoft products, but generalized, documented, and reusable. This enables us and our partners to more easily build great applications without spending a ton of time implementing the same things over and over.`
+        }</p>
+
+        <p>{
+          `Each component is designed to be RTL friendly, keyboard accessible, screen reader friendly, themeable, and generalized. TypeScript definition files are also included, so if you use TypeScript (which isn't a requirement), you will get compiler validation and using an editor like VS Code, you'll get intellisense. Each component is exported as a named module that can be easily imported in your code, allowing your external bundler to create small bundles that include just what you need.`
+        }</p>
+
+        <h2>Getting started</h2>
+
+        <p>{ `Integrating components into your project depends heavily on your setup. The recommended setup is to use a bundler such as ` }<Link href='https://webpack.github.io/' target='_blank'>Webpack</Link>{ ` which can resolve NPM package imports in your code and can bundle the specific things you import.` }</p>
+
+        <p>{
+          `Within an npm project, you should install the package and save it as a dependency:`
+        }</p>
+
+        <div className='ms-GettingStartedPage-code'>
+          <Highlight className='bash'>npm install --save office-ui-fabric-react</Highlight>
+        </div>
+
+        <p>{
+          `This will add the fabric-react project as a dependency in your package.json file, and will drop the project under node_modules/office-ui-fabric-react.`
+        }</p>
+
+        <p>{
+          `The library includes commonjs entry points under the lib folder. To use a control, you should be able to import it and use it in your render method. Note that wrapping your application in the Fabric component is required to support RTL, keyboard focus and other features.`
+        }</p>
+
+        <div className='ms-GettingStartedPage-code'>
+          <Highlight className='typescript'>{
+            `import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
+import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
+
+const MyPage = () => (<Fabric><DefaultButton>I am a button.</DefaultButton></Fabric>);
+
+ReactDOM.render(<MyPage />, document.body.firstChild);`
+          }</Highlight>
+        </div>
+
+        <h2>Notes on module vs path-based imports</h2>
+        <p>{
+          `While it is possible to import all components as named imports from the main module entry point, it is not recommended to do so without using a bundler that supports es6 tree shaking. In other words, if you import the Button component like this:`
+        }</p>
+
+        <div className='ms-GettingStartedPage-code'>
+          <Highlight className='typescript'>{ `import { Button } from 'office-ui-fabric-react';` }</Highlight>
+        </div>
+
+        <p>{ `...this would work, but then unless you are using a tree-shaking bundler such as Rollup.js or Webpack 2, Webpack will assume you want every module exported from the main entry file to be included in your final bundle, which produces unnecessary large bundles and slows your page load down. Instead you can import the specific paths to trim down your bundle size:` }</p>
+
+        <div className='ms-GettingStartedPage-code'>
+          <Highlight className='typescript'>{
+            `import { Button } from 'office-ui-fabric-react/lib/Button';
+import { Dropdown } from 'office-ui-fabric-react/lib/Dropdown';
+import { List } from 'office-ui-fabric-react/lib/List';`
+          }</Highlight>
+        </div>
+
+        <h2>Using an AMD bundler like r.js</h2>
+
+        <p>{ `
+        If your project relies on AMD modules, they are dropped in the lib-amd folder. You will need to set up your bundler to handle the imports correctly. This may require you to symlink or copy the folder into your pre-bundle location.
+        ` }</p>
+
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react-experiments/src/demo/index.scss b/packages/office-ui-fabric-react-experiments/src/demo/index.scss
new file mode 100644
index 0000000000000..72394e26afcdf
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/src/demo/index.scss
@@ -0,0 +1,7 @@
+@import '~office-ui-fabric-react/dist/sass/References';
+
+:global {
+  html, body {
+    -webkit-tap-highlight-color: transparent;
+  }
+}
diff --git a/packages/office-ui-fabric-react-experiments/src/demo/index.tsx b/packages/office-ui-fabric-react-experiments/src/demo/index.tsx
new file mode 100644
index 0000000000000..38d94b6bb66a7
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/src/demo/index.tsx
@@ -0,0 +1,94 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+import * as ReactDOM from 'react-dom';
+import { App, AppDefinition } from './AppDefinition';
+import { Router, Route } from 'office-ui-fabric-react/lib/utilities/router/index';
+import { GettingStartedPage } from './GettingStartedPage';
+import { setBaseUrl } from 'office-ui-fabric-react/lib/Utilities';
+import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
+
+import './index.scss';
+import './ColorStyles.scss';
+
+setBaseUrl('./dist/');
+
+let rootElement: HTMLElement | null;
+
+// Return the anchor link from the URL without the hash
+function _extractAnchorLink(path: string) {
+  let index = path.lastIndexOf('#');
+  if (index >= 0) {
+    path = path.substr(index + 1, path.length - index);
+  }
+  return path;
+}
+
+function _scrollAnchorLink() {
+  if ((window.location.hash.match(/#/g) || []).length > 1) {
+    let anchor = _extractAnchorLink(window.location.hash);
+    document.getElementById(anchor)!.scrollIntoView();
+  }
+}
+
+function _onLoad() {
+  rootElement = rootElement || document.getElementById('content');
+
+  ReactDOM.render(
+    <Fabric>
+      <Router onNewRouteLoaded={ _scrollAnchorLink }>
+        { _getRoutes() }
+      </Router>
+    </Fabric>,
+    rootElement);
+}
+
+function _getRoutes() {
+  let routes = AppDefinition.testPages.map(page => <Route key={ page.key } path={ page.url } component={ page.component } />);
+  let appRoutes: JSX.Element[] = [];
+
+  AppDefinition.examplePages.forEach(group => {
+    group.links
+      .filter(link => link.hasOwnProperty('component') || link.hasOwnProperty('getComponent'))
+      .forEach((link, linkIndex) => {
+        const { component, getComponent } = link;
+
+        appRoutes.push(
+          <Route
+            key={ link.key }
+            path={ link.url }
+            component={ component }
+            getComponent={ getComponent }
+          />);
+      });
+  });
+
+  // Default route.
+  appRoutes.push(
+    <Route key='gettingstarted' component={ GettingStartedPage } />
+  );
+
+  routes.push(
+    <Route key='app' component={ App }>
+      { appRoutes }
+    </Route>
+  );
+
+  return routes;
+}
+
+function _onUnload() {
+  if (rootElement) {
+    ReactDOM.unmountComponentAtNode(rootElement);
+  }
+}
+
+let isReady = document.readyState === 'interactive' || document.readyState === 'complete';
+
+if (isReady) {
+  _onLoad();
+} else {
+  window.onload = _onLoad;
+}
+
+window.onunload = _onUnload;
diff --git a/packages/office-ui-fabric-react-experiments/src/index.ts b/packages/office-ui-fabric-react-experiments/src/index.ts
new file mode 100644
index 0000000000000..a8d612800ca7d
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/src/index.ts
@@ -0,0 +1,6 @@
+/**
+ * WARNING: This entry should NOT be imported for production purposes. This entry forces every control to be
+ * parsed and available at load time, which is not necessary for most cases.
+ */
+
+export * from './Link';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-experiments/tsconfig.json b/packages/office-ui-fabric-react-experiments/tsconfig.json
new file mode 100644
index 0000000000000..5fec2b5f064db
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/tsconfig.json
@@ -0,0 +1,36 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "target": "es5",
+    "module": "commonjs",
+    "jsx": "react",
+    "declaration": true,
+    "sourceMap": true,
+    "experimentalDecorators": true,
+    "importHelpers": true,
+    "forceConsistentCasingInFileNames": true,
+    "strictNullChecks": true,
+    "noImplicitAny": true,
+    "moduleResolution": "node",
+    "lib": [
+      "es2017",
+      "dom"
+    ],
+    "types": [
+      "chai",
+      "mocha",
+      "webpack-env"
+    ],
+    "paths": {
+      "office-ui-fabric-react-experiments/lib/*": [
+        "./src/*"
+      ]
+    }
+  },
+  "exclude": [
+    "node_modules",
+    "dist",
+    "lib",
+    "lib-amd"
+  ]
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-experiments/tslint.json b/packages/office-ui-fabric-react-experiments/tslint.json
new file mode 100644
index 0000000000000..972ff4be6f494
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/tslint.json
@@ -0,0 +1,15 @@
+{
+  "extends": [
+    "office-ui-fabric-react-tslint"
+  ],
+  "rules": {
+    "max-line-length": [
+      false,
+      140
+    ],
+    "no-any": false,
+    "typedef": [
+      false
+    ]
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-experiments/webpack.config.js b/packages/office-ui-fabric-react-experiments/webpack.config.js
new file mode 100644
index 0000000000000..2a5df0d6b187b
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/webpack.config.js
@@ -0,0 +1,5 @@
+let configs = [
+  require('./webpack.lib.config')
+];
+
+module.exports = configs;
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-experiments/webpack.lib.config.js b/packages/office-ui-fabric-react-experiments/webpack.lib.config.js
new file mode 100644
index 0000000000000..d6ef0f412c14f
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/webpack.lib.config.js
@@ -0,0 +1,77 @@
+'use strict';
+
+/** Note: this require may need to be fixed to point to the build that exports the gulp-core-build-webpack instance. */
+let build = require('@microsoft/web-library-build');
+let webpackTaskResources = build.webpack.resources;
+let webpack = webpackTaskResources.webpack;
+let path = require('path');
+let buildConfig = build.getConfig();
+let BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
+
+const BUNDLE_NAME = 'office-ui-fabric-react-experiments';
+const BUNDLE_TEST = 'fabric-test';
+const IS_PRODUCTION = process.argv.indexOf('--production') > -1;
+
+// Create an array of configs, prepopulated with a debug (non-minified) build.
+let configs = [
+  createConfig(false)
+];
+
+// Create a production config if applicable.
+if (IS_PRODUCTION) {
+  configs.push(createConfig(true));
+}
+
+// Helper to create the config.
+function createConfig(isProduction) {
+  let webpackConfig = {
+
+    entry: {
+      [BUNDLE_NAME]: './lib/index.js'
+    },
+
+    output: {
+      libraryTarget: 'var',
+      library: 'Fabric',
+      path: path.join(__dirname, buildConfig.distFolder),
+      publicPath: '/dist/',
+      filename: `[name]${isProduction ? '.min' : ''}.js`
+    },
+
+    devtool: 'source-map',
+
+    externals: [
+      {
+        'react': 'React',
+      },
+      {
+        'react-dom': 'ReactDOM'
+      }
+    ],
+
+    plugins: [
+      new BundleAnalyzerPlugin({
+        analyzerMode: 'static',
+        reportFilename: BUNDLE_NAME + '.stats.html',
+        openAnalyzer: false
+      })
+    ]
+  };
+
+  if (isProduction) {
+    webpackConfig.plugins.push(
+      new webpack.DefinePlugin({
+        'process.env.NODE_ENV': JSON.stringify('production')
+      }),
+      new webpack.optimize.UglifyJsPlugin({
+        minimize: true,
+        compress: {
+          warnings: false
+        }
+      }));
+  }
+
+  return webpackConfig;
+}
+
+module.exports = configs;
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-experiments/webpack.serve.config.js b/packages/office-ui-fabric-react-experiments/webpack.serve.config.js
new file mode 100644
index 0000000000000..d0f412d2ca3b7
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/webpack.serve.config.js
@@ -0,0 +1,90 @@
+let path = require('path');
+let webpack = require('webpack');
+let WebpackNotifierPlugin = require('webpack-notifier');
+
+const PACKAGE_NAME = require('./package.json').name;
+
+module.exports = {
+  entry: './src/demo/index.tsx',
+
+  output: {
+    filename: 'demo-app.js',
+  },
+
+  externals: {
+    'react': 'React',
+    'react-dom': 'ReactDOM'
+  },
+
+  resolve: {
+    alias: {
+      'office-ui-fabric-react-experiments/src': path.join(__dirname, 'src'),
+      'office-ui-fabric-react-experiments/lib': path.join(__dirname, 'src'),
+      'Props.ts.js': 'Props',
+      'Example.tsx.js': 'Example'
+    },
+    extensions: ['.ts', '.tsx', '.js']
+  },
+
+  devtool: 'source-map',
+
+  devServer: {
+    inline: true,
+    port: 4321
+  },
+
+  module: {
+    loaders: [
+      {
+        test: [/\.tsx?$/],
+        loader: 'ts-loader',
+        exclude: [
+          /node_modules/,
+          /\.scss.ts$/
+        ]
+      },
+      {
+        test: /\.scss$/,
+        enforce: 'pre',
+        exclude: [
+          /node_modules/
+        ],
+        use: [
+          {
+            loader: "load-themed-styles-loader", // creates style nodes from JS strings
+          },
+          {
+            loader: "css-loader", // translates CSS into CommonJS
+            options: {
+              modules: true,
+              importLoaders: 2,
+              localIdentName: '[name]_[local]_[hash:base64:5]',
+              minimize: false
+            }
+          },
+          {
+            loader: 'postcss-loader',
+
+            options: {
+              plugins: function () {
+                return [
+                  require('autoprefixer')
+                ];
+              }
+            }
+          },
+          {
+            loader: "sass-loader",
+          }
+        ]
+      }
+    ]
+  },
+
+  plugins: [
+    new webpack.DefinePlugin({
+      'process.env.NODE_ENV': JSON.stringify('production')
+    }),
+    new WebpackNotifierPlugin()
+  ]
+}
diff --git a/rush.json b/rush.json
index 52dabd796a7b1..eb5f639411940 100644
--- a/rush.json
+++ b/rush.json
@@ -10,6 +10,11 @@
       "projectFolder": "packages/office-ui-fabric-react",
       "shouldPublish": true
     },
+    {
+      "packageName": "@uifabric/experiments",
+      "projectFolder": "packages/office-ui-fabric-react-experiments",
+      "shouldPublish": true
+    },
     {
       "packageName": "@uifabric/utilities",
       "projectFolder": "packages/utilities",

From 57cc40972c70f63921e9663682e5922b2868b32c Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 14 Aug 2017 11:14:27 -0700
Subject: [PATCH 0410/1641] Updating build to build fast in CI again. This
 pulls in a new gcb-karma build which can enforce that tests fail the build in
 non-production workflows. (#2494)

---
 common/config/rush/npm-shrinkwrap.json      | 860 ++------------------
 package.json                                |   2 +-
 packages/office-ui-fabric-react/gulpfile.js |   9 +-
 packages/utilities/gulpfile.js              |  11 +-
 4 files changed, 103 insertions(+), 779 deletions(-)

diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index b21222ca4905e..f79ec3bed5dfb 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -1054,7 +1054,7 @@
       }
     },
     "@rush-temp/example-app-base": {
-      "version": "file:projects\\example-app-base",
+      "version": "file:projects/example-app-base",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1128,10 +1128,6 @@
           "version": "2.0.0",
           "bundled": true
         },
-        "loader-utils": {
-          "version": "0.2.17",
-          "bundled": true
-        },
         "mocha": {
           "version": "3.3.0",
           "bundled": true
@@ -1170,13 +1166,7 @@
           "dependencies": {
             "string_decoder": {
               "version": "1.0.3",
-              "bundled": true,
-              "dependencies": {
-                "safe-buffer": {
-                  "version": "5.1.1",
-                  "bundled": true
-                }
-              }
+              "bundled": true
             }
           }
         },
@@ -1213,15 +1203,11 @@
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.7",
+          "version": "0.2.8",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.2",
-          "bundled": true
-        },
-        "typescript": {
-          "version": "2.4.2",
+          "version": "2.0.3",
           "bundled": true
         },
         "url": {
@@ -1245,13 +1231,9 @@
           }
         },
         "webpack": {
-          "version": "3.4.1",
+          "version": "3.5.1",
           "bundled": true,
           "dependencies": {
-            "ajv": {
-              "version": "5.2.2",
-              "bundled": true
-            },
             "async": {
               "version": "2.5.0",
               "bundled": true
@@ -1299,7 +1281,7 @@
       }
     },
     "@rush-temp/experiments": {
-      "version": "file:projects\\experiments",
+      "version": "file:projects/experiments",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1407,7 +1389,8 @@
           "dependencies": {
             "string_decoder": {
               "version": "1.0.3",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+              "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
             }
           }
         },
@@ -1448,7 +1431,7 @@
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.3",
+          "version": "2.0.4",
           "bundled": true
         },
         "url": {
@@ -1457,7 +1440,8 @@
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
+              "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
             }
           }
         },
@@ -1467,33 +1451,39 @@
           "dependencies": {
             "async": {
               "version": "2.5.0",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
+              "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw=="
             }
           }
         },
         "webpack": {
-          "version": "3.4.1",
+          "version": "3.5.4",
           "bundled": true,
           "dependencies": {
             "async": {
               "version": "2.5.0",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
+              "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw=="
             },
             "has-flag": {
               "version": "2.0.0",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
+              "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
             },
             "loader-utils": {
               "version": "1.1.0",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
+              "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
             },
             "source-map": {
               "version": "0.5.6",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz",
+              "integrity": "sha1-dc449SvwczxafwwRjYEzSiu19BI="
             },
             "supports-color": {
               "version": "4.2.1",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
+              "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
             }
           }
         },
@@ -1503,7 +1493,8 @@
           "dependencies": {
             "source-map": {
               "version": "0.5.6",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz",
+              "integrity": "sha1-dc449SvwczxafwwRjYEzSiu19BI="
             }
           }
         },
@@ -1522,12 +1513,8 @@
       }
     },
     "@rush-temp/fabric-website": {
-      "version": "file:projects\\fabric-website",
+      "version": "file:projects/fabric-website",
       "dependencies": {
-        "@types/react": {
-          "version": "15.0.38",
-          "bundled": true
-        },
         "@types/react-addons-test-utils": {
           "version": "0.14.19",
           "bundled": true
@@ -1553,7 +1540,7 @@
           "bundled": true
         },
         "camelcase": {
-          "version": "4.1.0",
+          "version": "3.0.0",
           "bundled": true
         },
         "commander": {
@@ -1569,7 +1556,7 @@
           "bundled": true
         },
         "debug": {
-          "version": "2.6.0",
+          "version": "2.6.8",
           "bundled": true
         },
         "diff": {
@@ -1588,10 +1575,6 @@
           "version": "7.1.1",
           "bundled": true
         },
-        "highlight.js": {
-          "version": "9.11.0",
-          "bundled": true
-        },
         "https-browserify": {
           "version": "0.0.1",
           "bundled": true
@@ -1608,16 +1591,8 @@
           "version": "2.0.0",
           "bundled": true
         },
-        "loader-utils": {
-          "version": "0.2.17",
-          "bundled": true
-        },
         "mocha": {
-          "version": "3.3.0",
-          "bundled": true
-        },
-        "ms": {
-          "version": "0.7.2",
+          "version": "3.5.0",
           "bundled": true
         },
         "node-libs-browser": {
@@ -1694,10 +1669,6 @@
           "version": "2.0.3",
           "bundled": true
         },
-        "typescript": {
-          "version": "2.4.2",
-          "bundled": true
-        },
         "url": {
           "version": "0.11.0",
           "bundled": true,
@@ -1726,6 +1697,10 @@
               "version": "2.5.0",
               "bundled": true
             },
+            "camelcase": {
+              "version": "4.1.0",
+              "bundled": true
+            },
             "has-flag": {
               "version": "2.0.0",
               "bundled": true
@@ -1741,6 +1716,14 @@
             "supports-color": {
               "version": "4.2.1",
               "bundled": true
+            },
+            "yargs": {
+              "version": "8.0.2",
+              "bundled": true
+            },
+            "yargs-parser": {
+              "version": "7.0.0",
+              "bundled": true
             }
           }
         },
@@ -1759,17 +1742,17 @@
           "bundled": true
         },
         "yargs": {
-          "version": "8.0.2",
+          "version": "6.6.0",
           "bundled": true
         },
         "yargs-parser": {
-          "version": "7.0.0",
+          "version": "4.2.1",
           "bundled": true
         }
       }
     },
     "@rush-temp/office-ui-fabric-react": {
-      "version": "file:projects\\office-ui-fabric-react",
+      "version": "file:projects/office-ui-fabric-react",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1808,7 +1791,7 @@
           "bundled": true
         },
         "debug": {
-          "version": "2.6.0",
+          "version": "2.6.8",
           "bundled": true
         },
         "diff": {
@@ -1827,10 +1810,6 @@
           "version": "7.1.1",
           "bundled": true
         },
-        "has-flag": {
-          "version": "2.0.0",
-          "bundled": true
-        },
         "https-browserify": {
           "version": "0.0.1",
           "bundled": true
@@ -1847,26 +1826,8 @@
           "version": "2.0.0",
           "bundled": true
         },
-        "loader-utils": {
-          "version": "0.2.17",
-          "bundled": true
-        },
         "mocha": {
-          "version": "3.4.2",
-          "bundled": true,
-          "dependencies": {
-            "has-flag": {
-              "version": "1.0.0",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "3.1.2",
-              "bundled": true
-            }
-          }
-        },
-        "ms": {
-          "version": "0.7.2",
+          "version": "3.5.0",
           "bundled": true
         },
         "node-libs-browser": {
@@ -1897,20 +1858,12 @@
           "version": "2.3.3",
           "bundled": true,
           "dependencies": {
-            "safe-buffer": {
-              "version": "5.1.1",
-              "bundled": true
-            },
             "string_decoder": {
               "version": "1.0.3",
               "bundled": true
             }
           }
         },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "bundled": true
-        },
         "source-list-map": {
           "version": "2.0.0",
           "bundled": true
@@ -1940,19 +1893,15 @@
           "bundled": true
         },
         "supports-color": {
-          "version": "4.2.1",
+          "version": "3.1.2",
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.7",
+          "version": "0.2.8",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.2",
-          "bundled": true
-        },
-        "typescript": {
-          "version": "2.4.2",
+          "version": "2.0.3",
           "bundled": true
         },
         "url": {
@@ -1976,17 +1925,17 @@
           }
         },
         "webpack": {
-          "version": "3.4.1",
+          "version": "3.5.1",
           "bundled": true,
           "dependencies": {
-            "ajv": {
-              "version": "5.2.2",
-              "bundled": true
-            },
             "async": {
               "version": "2.5.0",
               "bundled": true
             },
+            "has-flag": {
+              "version": "2.0.0",
+              "bundled": true
+            },
             "loader-utils": {
               "version": "1.1.0",
               "bundled": true
@@ -1994,6 +1943,10 @@
             "source-map": {
               "version": "0.5.6",
               "bundled": true
+            },
+            "supports-color": {
+              "version": "4.2.1",
+              "bundled": true
             }
           }
         },
@@ -2022,10 +1975,10 @@
       }
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
-      "version": "file:projects\\office-ui-fabric-react-tslint"
+      "version": "file:projects/office-ui-fabric-react-tslint"
     },
     "@rush-temp/ssr-tests": {
-      "version": "file:projects\\ssr-tests",
+      "version": "file:projects/ssr-tests",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -2139,20 +2092,12 @@
           "version": "2.3.3",
           "bundled": true,
           "dependencies": {
-            "safe-buffer": {
-              "version": "5.1.1",
-              "bundled": true
-            },
             "string_decoder": {
               "version": "1.0.3",
               "bundled": true
             }
           }
         },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "bundled": true
-        },
         "source-list-map": {
           "version": "2.0.0",
           "bundled": true
@@ -2178,11 +2123,11 @@
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.7",
+          "version": "0.2.8",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.2",
+          "version": "2.0.3",
           "bundled": true
         },
         "url": {
@@ -2200,21 +2145,13 @@
           "bundled": true
         },
         "webpack": {
-          "version": "3.4.1",
+          "version": "3.5.1",
           "bundled": true,
           "dependencies": {
-            "ajv": {
-              "version": "5.2.2",
-              "bundled": true
-            },
             "has-flag": {
               "version": "2.0.0",
               "bundled": true
             },
-            "loader-utils": {
-              "version": "1.1.0",
-              "bundled": true
-            },
             "supports-color": {
               "version": "4.2.1",
               "bundled": true
@@ -2240,12 +2177,8 @@
       }
     },
     "@rush-temp/styling": {
-      "version": "file:projects\\styling",
+      "version": "file:projects/styling",
       "dependencies": {
-        "@uifabric/utilities": {
-          "version": "1.10.4",
-          "bundled": true
-        },
         "acorn": {
           "version": "5.1.1",
           "bundled": true
@@ -2283,7 +2216,7 @@
           "bundled": true
         },
         "debug": {
-          "version": "2.6.0",
+          "version": "2.6.8",
           "bundled": true
         },
         "diff": {
@@ -2302,10 +2235,6 @@
           "version": "7.1.1",
           "bundled": true
         },
-        "has-flag": {
-          "version": "2.0.0",
-          "bundled": true
-        },
         "https-browserify": {
           "version": "0.0.1",
           "bundled": true
@@ -2322,36 +2251,14 @@
           "version": "2.0.0",
           "bundled": true
         },
-        "loader-utils": {
-          "version": "0.2.17",
-          "bundled": true
-        },
         "mocha": {
-          "version": "3.4.2",
-          "bundled": true,
-          "dependencies": {
-            "has-flag": {
-              "version": "1.0.0",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "3.1.2",
-              "bundled": true
-            }
-          }
-        },
-        "ms": {
-          "version": "0.7.2",
+          "version": "3.5.0",
           "bundled": true
         },
         "node-libs-browser": {
           "version": "2.0.0",
           "bundled": true
         },
-        "office-ui-fabric-react": {
-          "version": "2.34.2",
-          "bundled": true
-        },
         "os-browserify": {
           "version": "0.2.1",
           "bundled": true
@@ -2376,20 +2283,12 @@
           "version": "2.3.3",
           "bundled": true,
           "dependencies": {
-            "safe-buffer": {
-              "version": "5.1.1",
-              "bundled": true
-            },
             "string_decoder": {
               "version": "1.0.3",
               "bundled": true
             }
           }
         },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "bundled": true
-        },
         "source-list-map": {
           "version": "2.0.0",
           "bundled": true
@@ -2419,19 +2318,15 @@
           "bundled": true
         },
         "supports-color": {
-          "version": "4.2.1",
+          "version": "3.1.2",
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.7",
+          "version": "0.2.8",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.2",
-          "bundled": true
-        },
-        "typescript": {
-          "version": "2.4.2",
+          "version": "2.0.3",
           "bundled": true
         },
         "url": {
@@ -2455,17 +2350,17 @@
           }
         },
         "webpack": {
-          "version": "3.4.1",
+          "version": "3.5.1",
           "bundled": true,
           "dependencies": {
-            "ajv": {
-              "version": "5.2.2",
-              "bundled": true
-            },
             "async": {
               "version": "2.5.0",
               "bundled": true
             },
+            "has-flag": {
+              "version": "2.0.0",
+              "bundled": true
+            },
             "loader-utils": {
               "version": "1.1.0",
               "bundled": true
@@ -2473,6 +2368,10 @@
             "source-map": {
               "version": "0.5.6",
               "bundled": true
+            },
+            "supports-color": {
+              "version": "4.2.1",
+              "bundled": true
             }
           }
         },
@@ -2501,7 +2400,7 @@
       }
     },
     "@rush-temp/test-bundle-button": {
-      "version": "file:projects\\test-bundle-button",
+      "version": "file:projects/test-bundle-button",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -2563,10 +2462,6 @@
           "version": "2.0.0",
           "bundled": true
         },
-        "loader-utils": {
-          "version": "0.2.17",
-          "bundled": true
-        },
         "node-libs-browser": {
           "version": "2.0.0",
           "bundled": true
@@ -2634,15 +2529,11 @@
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.7",
+          "version": "0.2.8",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.2",
-          "bundled": true
-        },
-        "typescript": {
-          "version": "2.4.2",
+          "version": "2.0.3",
           "bundled": true
         },
         "url": {
@@ -2666,17 +2557,9 @@
           }
         },
         "webpack": {
-          "version": "3.4.1",
+          "version": "3.5.1",
           "bundled": true,
           "dependencies": {
-            "ajv": {
-              "version": "5.2.2",
-              "bundled": true
-            },
-            "ajv-keywords": {
-              "version": "2.1.0",
-              "bundled": true
-            },
             "async": {
               "version": "2.5.0",
               "bundled": true
@@ -2685,23 +2568,9 @@
               "version": "1.1.0",
               "bundled": true
             },
-            "source-list-map": {
-              "version": "2.0.0",
-              "bundled": true
-            },
             "source-map": {
               "version": "0.5.6",
               "bundled": true
-            },
-            "webpack-sources": {
-              "version": "1.0.1",
-              "bundled": true,
-              "dependencies": {
-                "source-list-map": {
-                  "version": "2.0.0",
-                  "bundled": true
-                }
-              }
             }
           }
         },
@@ -2730,16 +2599,10 @@
       }
     },
     "@rush-temp/todo-app": {
-      "version": "file:projects\\todo-app",
-      "dependencies": {
-        "typescript": {
-          "version": "2.4.2",
-          "bundled": true
-        }
-      }
+      "version": "file:projects/todo-app"
     },
     "@rush-temp/utilities": {
-      "version": "file:projects\\utilities",
+      "version": "file:projects/utilities",
       "dependencies": {
         "async": {
           "version": "0.9.2",
@@ -2761,10 +2624,6 @@
           "version": "7.1.1",
           "bundled": true
         },
-        "loader-utils": {
-          "version": "0.2.17",
-          "bundled": true
-        },
         "mocha": {
           "version": "3.3.0",
           "bundled": true
@@ -2784,10 +2643,6 @@
         "supports-color": {
           "version": "3.1.2",
           "bundled": true
-        },
-        "typescript": {
-          "version": "2.4.2",
-          "bundled": true
         }
       }
     },
@@ -5304,549 +5159,6 @@
       "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
       "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
     },
-    "fsevents": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.2.tgz",
-      "integrity": "sha512-Sn44E5wQW4bTHXvQmvSHwqbuiXtduD6Rrjm2ZtUEGbyrig+nUH3t/QD4M4/ZXViY556TBpRgZkHLDx3JxPwxiw==",
-      "optional": true,
-      "dependencies": {
-        "abbrev": {
-          "version": "1.1.0",
-          "bundled": true,
-          "optional": true
-        },
-        "ajv": {
-          "version": "4.11.8",
-          "bundled": true,
-          "optional": true
-        },
-        "ansi-regex": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "aproba": {
-          "version": "1.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "are-we-there-yet": {
-          "version": "1.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "asn1": {
-          "version": "0.2.3",
-          "bundled": true,
-          "optional": true
-        },
-        "assert-plus": {
-          "version": "0.2.0",
-          "bundled": true,
-          "optional": true
-        },
-        "asynckit": {
-          "version": "0.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "aws-sign2": {
-          "version": "0.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "aws4": {
-          "version": "1.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "balanced-match": {
-          "version": "0.4.2",
-          "bundled": true
-        },
-        "bcrypt-pbkdf": {
-          "version": "1.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "block-stream": {
-          "version": "0.0.9",
-          "bundled": true
-        },
-        "boom": {
-          "version": "2.10.1",
-          "bundled": true
-        },
-        "brace-expansion": {
-          "version": "1.1.7",
-          "bundled": true
-        },
-        "buffer-shims": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "caseless": {
-          "version": "0.12.0",
-          "bundled": true,
-          "optional": true
-        },
-        "co": {
-          "version": "4.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "code-point-at": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "combined-stream": {
-          "version": "1.0.5",
-          "bundled": true
-        },
-        "concat-map": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "console-control-strings": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "core-util-is": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "cryptiles": {
-          "version": "2.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "dashdash": {
-          "version": "1.14.1",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true,
-          "optional": true
-        },
-        "deep-extend": {
-          "version": "0.4.2",
-          "bundled": true,
-          "optional": true
-        },
-        "delayed-stream": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "delegates": {
-          "version": "1.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "ecc-jsbn": {
-          "version": "0.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "extend": {
-          "version": "3.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "extsprintf": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "forever-agent": {
-          "version": "0.6.1",
-          "bundled": true,
-          "optional": true
-        },
-        "form-data": {
-          "version": "2.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "fs.realpath": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "fstream": {
-          "version": "1.0.11",
-          "bundled": true
-        },
-        "fstream-ignore": {
-          "version": "1.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "gauge": {
-          "version": "2.7.4",
-          "bundled": true,
-          "optional": true
-        },
-        "getpass": {
-          "version": "0.1.7",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "glob": {
-          "version": "7.1.2",
-          "bundled": true
-        },
-        "graceful-fs": {
-          "version": "4.1.11",
-          "bundled": true
-        },
-        "har-schema": {
-          "version": "1.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "har-validator": {
-          "version": "4.2.1",
-          "bundled": true,
-          "optional": true
-        },
-        "has-unicode": {
-          "version": "2.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "hawk": {
-          "version": "3.1.3",
-          "bundled": true,
-          "optional": true
-        },
-        "hoek": {
-          "version": "2.16.3",
-          "bundled": true
-        },
-        "http-signature": {
-          "version": "1.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "inflight": {
-          "version": "1.0.6",
-          "bundled": true
-        },
-        "inherits": {
-          "version": "2.0.3",
-          "bundled": true
-        },
-        "ini": {
-          "version": "1.3.4",
-          "bundled": true,
-          "optional": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "is-typedarray": {
-          "version": "1.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "isstream": {
-          "version": "0.1.2",
-          "bundled": true,
-          "optional": true
-        },
-        "jodid25519": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "jsbn": {
-          "version": "0.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "json-schema": {
-          "version": "0.2.3",
-          "bundled": true,
-          "optional": true
-        },
-        "json-stable-stringify": {
-          "version": "1.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "json-stringify-safe": {
-          "version": "5.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "jsonify": {
-          "version": "0.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "jsprim": {
-          "version": "1.4.0",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "mime-db": {
-          "version": "1.27.0",
-          "bundled": true
-        },
-        "mime-types": {
-          "version": "2.1.15",
-          "bundled": true
-        },
-        "minimatch": {
-          "version": "3.0.4",
-          "bundled": true
-        },
-        "minimist": {
-          "version": "0.0.8",
-          "bundled": true
-        },
-        "mkdirp": {
-          "version": "0.5.1",
-          "bundled": true
-        },
-        "ms": {
-          "version": "2.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "node-pre-gyp": {
-          "version": "0.6.36",
-          "bundled": true,
-          "optional": true
-        },
-        "nopt": {
-          "version": "4.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "npmlog": {
-          "version": "4.1.0",
-          "bundled": true,
-          "optional": true
-        },
-        "number-is-nan": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "oauth-sign": {
-          "version": "0.8.2",
-          "bundled": true,
-          "optional": true
-        },
-        "object-assign": {
-          "version": "4.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "once": {
-          "version": "1.4.0",
-          "bundled": true
-        },
-        "os-homedir": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "os-tmpdir": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "osenv": {
-          "version": "0.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "path-is-absolute": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "performance-now": {
-          "version": "0.2.0",
-          "bundled": true,
-          "optional": true
-        },
-        "process-nextick-args": {
-          "version": "1.0.7",
-          "bundled": true
-        },
-        "punycode": {
-          "version": "1.4.1",
-          "bundled": true,
-          "optional": true
-        },
-        "qs": {
-          "version": "6.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "rc": {
-          "version": "1.2.1",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "minimist": {
-              "version": "1.2.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "readable-stream": {
-          "version": "2.2.9",
-          "bundled": true
-        },
-        "request": {
-          "version": "2.81.0",
-          "bundled": true,
-          "optional": true
-        },
-        "rimraf": {
-          "version": "2.6.1",
-          "bundled": true
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "bundled": true
-        },
-        "semver": {
-          "version": "5.3.0",
-          "bundled": true,
-          "optional": true
-        },
-        "set-blocking": {
-          "version": "2.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "signal-exit": {
-          "version": "3.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "sntp": {
-          "version": "1.0.9",
-          "bundled": true,
-          "optional": true
-        },
-        "sshpk": {
-          "version": "1.13.0",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "string_decoder": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "stringstream": {
-          "version": "0.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "strip-ansi": {
-          "version": "3.0.1",
-          "bundled": true
-        },
-        "strip-json-comments": {
-          "version": "2.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "tar": {
-          "version": "2.2.1",
-          "bundled": true
-        },
-        "tar-pack": {
-          "version": "3.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "tough-cookie": {
-          "version": "2.3.2",
-          "bundled": true,
-          "optional": true
-        },
-        "tunnel-agent": {
-          "version": "0.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "tweetnacl": {
-          "version": "0.14.5",
-          "bundled": true,
-          "optional": true
-        },
-        "uid-number": {
-          "version": "0.0.6",
-          "bundled": true,
-          "optional": true
-        },
-        "util-deprecate": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "uuid": {
-          "version": "3.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "verror": {
-          "version": "1.3.6",
-          "bundled": true,
-          "optional": true
-        },
-        "wide-align": {
-          "version": "1.1.2",
-          "bundled": true,
-          "optional": true
-        },
-        "wrappy": {
-          "version": "1.0.2",
-          "bundled": true
-        }
-      }
-    },
     "fstream": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
@@ -12023,4 +11335,4 @@
       "integrity": "sha1-RCs4+denr3rke/z8NWhz6GFq0bc="
     }
   }
-}
+}
\ No newline at end of file
diff --git a/package.json b/package.json
index 1334ba672658c..cf8b71b46222c 100644
--- a/package.json
+++ b/package.json
@@ -9,7 +9,7 @@
   },
   "scripts": {
     "_rushInstall": "node node_modules/@microsoft/rush/bin/rush install -c",
-    "_rushBuild": "node node_modules/@microsoft/rush/bin/rush build --verbose --production",
+    "_rushBuild": "node node_modules/@microsoft/rush/bin/rush build --verbose",
     "_rushBuildToFabric": "node node_modules/@microsoft/rush/bin/rush build --to office-ui-fabric-react",
     "_rushRebuild": "node node_modules/@microsoft/rush/bin/rush rebuild --production --verbose",
     "_rushRebuildFast": "node node_modules/@microsoft/rush/bin/rush rebuild --verbose",
diff --git a/packages/office-ui-fabric-react/gulpfile.js b/packages/office-ui-fabric-react/gulpfile.js
index 90c173cc2bbe2..ae519f22e455b 100644
--- a/packages/office-ui-fabric-react/gulpfile.js
+++ b/packages/office-ui-fabric-react/gulpfile.js
@@ -54,9 +54,14 @@ build.tslint.setConfig({
   displayAsWarning: false
 });
 
+// Always fail on test failures.
+build.karma.setConfig({
+  failBuildOnErrors: true
+});
+
 // Configure TypeScript.
-// build.typescript.setConfig({ typescript: require('typescript') });
 build.TypeScriptConfiguration.setTypescriptCompiler(require('typescript'));
+
 // Use css modules.
 build.sass.setConfig({
   useCSSModules: true,
@@ -97,7 +102,7 @@ build.task('webpack', build.webpack);
 build.task('tslint', build.tslint);
 build.task('ts', build.typescript);
 build.task('sass', build.sass);
-
+build.task('test', serial(build.sass, build.typescript, build.karma));
 build.task('visualtest', serial(build.sass, build.typescript, build.webpack, visualTestClean, visualTest));
 
 // initialize tasks.
diff --git a/packages/utilities/gulpfile.js b/packages/utilities/gulpfile.js
index b5238c40e78a0..1269d7dbefe1d 100644
--- a/packages/utilities/gulpfile.js
+++ b/packages/utilities/gulpfile.js
@@ -8,6 +8,9 @@ let buildConfig = build.getConfig();
 let isProduction = process.argv.indexOf('--production') >= 0;
 let isClean = process.argv.indexOf('clean') >= 0;
 
+build.task('test', build.serial(build.typescript, build.karma));
+build.task('tslint', build.tslint);
+
 // initialize tasks.
 build.initialize(gulp);
 
@@ -18,11 +21,17 @@ let rules = Object.assign(
   require('./node_modules/office-ui-fabric-react-tslint/tslint.json').rules,
   require('./tslint.json').rules
 );
+
 build.tslint.setConfig({
   lintConfig: { rules },
   displayAsWarning: false
 });
 
+// Always fail on test failures.
+build.karma.setConfig({
+  failBuildOnErrors: true
+});
+
 // Configure TypeScript.
 build.TypeScriptConfiguration.setTypescriptCompiler(require('typescript'));
 
@@ -41,5 +50,3 @@ if (isProduction || isClean) {
   });
 }
 
-build.task('tslint', build.tslint);
-

From 1cdf83594ca2e1bdd844b5cb99a13c01ea23bdb2 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 14 Aug 2017 12:03:00 -0700
Subject: [PATCH 0411/1641] Dropdown: no longer scrolls body when arrowing
 beyond the menu edges. (#2492)

* Dropdown scroll fix issue, fixing delimiter.

* change file.

* Fixing PR issues.
---
 .../dropdown-fix_2017-08-14-17-13.json        | 11 +++++
 .../src/components/Dropdown/Dropdown.Props.ts |  8 ++++
 .../src/components/Dropdown/Dropdown.tsx      | 44 +++++++++++--------
 3 files changed, 45 insertions(+), 18 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/dropdown-fix_2017-08-14-17-13.json

diff --git a/common/changes/office-ui-fabric-react/dropdown-fix_2017-08-14-17-13.json b/common/changes/office-ui-fabric-react/dropdown-fix_2017-08-14-17-13.json
new file mode 100644
index 0000000000000..3e9d92a251785
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/dropdown-fix_2017-08-14-17-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: no longer scrolls body when arrowing up down at the start/end of the menu. Also added `multSelectDelimiter` for tweaking how the title is rendered in a multi-select scenario.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
index cabdac349251e..9973bc70e9dda 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
@@ -54,6 +54,14 @@ export interface IDropdownProps extends ISelectableDroppableTextProps<HTMLDivEle
   */
   selectedKeys?: string[] | number[];
 
+  /**
+   * When multiple items are selected, this still will be used to separate values in
+   * the dropdown title.
+   *
+   * @defaultValue ", "
+   */
+  multiSelectDelimiter?: string;
+
   /**
    * Deprecated at v0.52.0, use 'disabled' instead.
    * @deprecated
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 36e9e79ffa004..9f707ba6bb8d1 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -307,11 +307,10 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   @autobind
   private _onRenderTitle(item: IDropdownOption | IDropdownOption[]): JSX.Element {
     let displayTxt: string = '';
+    let { multiSelectDelimiter = ', ' } = this.props;
+
     if (this.props.multiSelect && Array.isArray(item)) {
-      for (let i = 0; i < item.length; i++) {
-        displayTxt += item[i].text;
-        displayTxt += (i === item.length - 1) ? '' : ',';
-      }
+      displayTxt = item.map(i => i.text).join(multiSelectDelimiter);
     } else {
       displayTxt = (item as IDropdownOption).text;
     }
@@ -380,18 +379,19 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     let { selectedIndex } = this.state;
 
     return (
-      <FocusZone
-        ref={ this._resolveRef('_focusZone') }
-        direction={ FocusZoneDirection.vertical }
-        defaultActiveElement={ '#' + id + '-list' + selectedIndex }
-        id={ id + '-list' }
-        className={ css('ms-Dropdown-items', styles.items) }
-        aria-labelledby={ id + '-label' }
-        onKeyDown={ this._onZoneKeyDown }
-        role='listbox'
-      >
-        { this.props.options.map((item: any, index: number) => onRenderItem({ ...item, index }, this._onRenderItem)) }
-      </FocusZone>
+      <div onKeyDown={ this._onZoneKeyDown }>
+        <FocusZone
+          ref={ this._resolveRef('_focusZone') }
+          direction={ FocusZoneDirection.vertical }
+          defaultActiveElement={ '#' + id + '-list' + selectedIndex }
+          id={ id + '-list' }
+          className={ css('ms-Dropdown-items', styles.items) }
+          aria-labelledby={ id + '-label' }
+          role='listbox'
+        >
+          { this.props.options.map((item: any, index: number) => onRenderItem({ ...item, index }, this._onRenderItem)) }
+        </FocusZone>
+      </div>
     );
   }
 
@@ -535,6 +535,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   private _getSelectedIndex(options: IDropdownOption[], selectedKey: string | number): number {
+    // tslint:disable-next-line:triple-equals
     return findIndex(options, (option => (option.isSelected || option.selected || (selectedKey != null) && option.key === selectedKey)));
   }
 
@@ -645,10 +646,17 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
       case KeyCodes.up:
         if (ev.altKey || ev.metaKey) {
           this.setState({ isOpen: false });
-          break;
         }
+        break;
 
-        return;
+      // All directional keystrokes should be canceled when the zone is rendered.
+      // This avoids the body scroll from reacting and thus dismissing the dropdown.
+      case KeyCodes.home:
+      case KeyCodes.end:
+      case KeyCodes.pageUp:
+      case KeyCodes.pageDown:
+      case KeyCodes.down:
+        break;
 
       case KeyCodes.escape:
         this.setState({ isOpen: false });

From e3ee978f51c1cfe727afa70800e88f9858fe19a0 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 14 Aug 2017 12:11:19 -0700
Subject: [PATCH 0412/1641] Updating launch.json

---
 .vscode/launch.json | 10 +++-------
 1 file changed, 3 insertions(+), 7 deletions(-)

diff --git a/.vscode/launch.json b/.vscode/launch.json
index 6e1a726534374..e2e5dbf6e72de 100644
--- a/.vscode/launch.json
+++ b/.vscode/launch.json
@@ -17,9 +17,7 @@
       "env": {
         "NODE_ENV": "development"
       },
-      "externalConsole": false,
-      "sourceMaps": false,
-      "outDir": null
+      "sourceMaps": false
     },
     {
       "name": "Run ssr tests",
@@ -40,9 +38,7 @@
       "env": {
         "NODE_ENV": "development"
       },
-      "externalConsole": false,
-      "sourceMaps": false,
-      "outDir": null
-    },
+      "sourceMaps": false
+    }
   ]
 }
\ No newline at end of file

From 5a4b65ff3e7f45706076b5127237cc0266e87b35 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Mon, 14 Aug 2017 13:39:30 -0700
Subject: [PATCH 0413/1641] ComboBox: Fixing role typo from header to heading
 (#2495)

* Fixing role typo from header to heading

* add change file
---
 ...jspurlin-ComboBoxRoleTypoFix_2017-08-14-20-24.json | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.tsx              |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxRoleTypoFix_2017-08-14-20-24.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxRoleTypoFix_2017-08-14-20-24.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxRoleTypoFix_2017-08-14-20-24.json
new file mode 100644
index 0000000000000..4663bdb10627b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxRoleTypoFix_2017-08-14-20-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Fix role typo to read heading instead of header",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 868283663f2e5..4eb1e6ff336af 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -822,7 +822,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     let { onRenderOption = this._onRenderOption } = this.props;
 
     return (
-      <div key={ item.key } className={ this._classNames.header } role='header'>
+      <div key={ item.key } className={ this._classNames.header } role='heading'>
         { onRenderOption(item, this._onRenderOption) }
       </div>);
   }

From 5e997af469f817b17544b9d39c04b0ed1b37af75 Mon Sep 17 00:00:00 2001
From: Ricky Patel <rickyp@microsoft.com>
Date: Mon, 14 Aug 2017 14:35:44 -0700
Subject: [PATCH 0414/1641] ContextMenu Accessibility: Added posinset and
 setsize to menu items (#2433)

* Fixed ContextMenu aria context

* Added aria-disabled
---
 .../rickyp-2432_2017-08-09-00-59.json         | 11 +++++
 .../ContextualMenu/ContextualMenu.tsx         | 40 ++++++++++++++-----
 2 files changed, 41 insertions(+), 10 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/rickyp-2432_2017-08-09-00-59.json

diff --git a/common/changes/office-ui-fabric-react/rickyp-2432_2017-08-09-00-59.json b/common/changes/office-ui-fabric-react/rickyp-2432_2017-08-09-00-59.json
new file mode 100644
index 0000000000000..7f151034b5161
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/rickyp-2432_2017-08-09-00-59.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added menu indexes to the accessibility readouts for ContextMenus",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "rickyp@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 8cb65a6136445..3b783cde55e67 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -227,6 +227,14 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
     // The menu should only return if items were provided, if no items were provided then it should not appear.
     if (items && items.length > 0) {
+      let indexCorrection = 0;
+      let totalItemCount = 0;
+      for (let item of items) {
+        if (item.itemType !== ContextualMenuItemType.Divider &&
+          item.itemType !== ContextualMenuItemType.Header) {
+          totalItemCount++;
+        }
+      }
       return (
         <Callout
           {...calloutProps}
@@ -259,9 +267,13 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
                   aria-labelledby={ labelElementId }
                   className={ css('ms-ContextualMenu-list is-open', styles.list) }
                   onKeyDown={ this._onKeyDown }>
-                  { items.map((item, index) => (
-                    this._renderMenuItem(item, index, hasCheckmarks, hasIcons)
-                  )) }
+                  { items.map((item, index) => {
+                    if (item.itemType === ContextualMenuItemType.Divider ||
+                      item.itemType === ContextualMenuItemType.Header) {
+                      indexCorrection++;
+                    }
+                    return this._renderMenuItem(item, index, index - indexCorrection, totalItemCount, hasCheckmarks, hasIcons);
+                  }) }
                 </ul>
               </FocusZone>
             ) : (null) }
@@ -274,7 +286,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     }
   }
 
-  private _renderMenuItem(item: IContextualMenuItem, index: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
+  private _renderMenuItem(item: IContextualMenuItem, index: number, focusableElementIndex: number, totalItemCount: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
     let renderedItems: React.ReactNode[] = [];
 
     if (item.name === '-') {
@@ -291,7 +303,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
         renderedItems.push(this._renderListItem(headerItem, item.key || index, item.className, item.title));
         break;
       default:
-        let menuItem = this._renderNormalItem(item, index, hasCheckmarks, hasIcons);
+        let menuItem = this._renderNormalItem(item, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons);
         renderedItems.push(this._renderListItem(menuItem, item.key || index, item.className, item.title));
         break;
     }
@@ -319,14 +331,14 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     return null;
   }
 
-  private _renderNormalItem(item: IContextualMenuItem, index: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
+  private _renderNormalItem(item: IContextualMenuItem, index: number, focusableElementIndex: number, totalItemCount: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
     if (item.onRender) {
       return [item.onRender(item)];
     }
     if (item.href) {
-      return this._renderAnchorMenuItem(item, index, hasCheckmarks, hasIcons);
+      return this._renderAnchorMenuItem(item, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons);
     }
-    return this._renderButtonItem(item, index, hasCheckmarks, hasIcons);
+    return this._renderButtonItem(item, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons);
   }
 
   private _renderHeaderMenuItem(item: IContextualMenuItem, index: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
@@ -336,7 +348,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       </div>);
   }
 
-  private _renderAnchorMenuItem(item: IContextualMenuItem, index: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
+  private _renderAnchorMenuItem(item: IContextualMenuItem, index: number, focusableElementIndex: number, totalItemCount: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
     return (
       <div>
         <a
@@ -348,6 +360,9 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
             styles.link,
             (item.isDisabled || item.disabled) && 'is-disabled') }
           role='menuitem'
+          aria-posinset={ focusableElementIndex + 1 }
+          aria-setsize={ totalItemCount }
+          aria-disabled={ item.isDisabled }
           style={ item.style }
           onClick={ this._onAnchorClick.bind(this, item) }>
           { this._renderMenuItemChildren(item, index, hasCheckmarks, hasIcons) }
@@ -358,6 +373,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   private _renderButtonItem(
     item: IContextualMenuItem,
     index: number,
+    focusableElementIndex: number,
+    totalItemCount: number,
     hasCheckmarks?: boolean,
     hasIcons?: boolean) {
     let { expandedMenuItemKey, subMenuId } = this.state;
@@ -388,8 +405,11 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       'aria-haspopup': hasSubmenuItems(item) || null,
       'aria-owns': item.key === expandedMenuItemKey ? subMenuId : null,
       'aria-checked': isChecked,
+      'aria-posinset': focusableElementIndex + 1,
+      'aria-setsize': totalItemCount,
+      'aria-disabled': item.isDisabled,
       role: canCheck ? 'menuitemcheckbox' : 'menuitem',
-      style: item.style,
+      style: item.style
     };
 
     return React.createElement(

From d7dd2ef00231bd0accbe53788c8efde51256bc2b Mon Sep 17 00:00:00 2001
From: Ricky Patel <rickyp@microsoft.com>
Date: Mon, 14 Aug 2017 14:46:46 -0700
Subject: [PATCH 0415/1641] Rickyp/focus zone custom root element (#2467)

* Added the ability to customize the root node of a FocusZone as often times it will be a UL

* Add an aria label

* Ran npm run change

* Fixed the double quote issue
---
 ...oneCustomRootElement_2017-08-10-21-25.json | 11 +++++++
 .../components/FocusZone/FocusZone.Props.ts   |  5 +++
 .../src/components/FocusZone/FocusZone.tsx    | 31 +++++++++----------
 .../examples/FocusZone.Photos.Example.tsx     | 27 +++++++++-------
 4 files changed, 46 insertions(+), 28 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/rickyp-focusZoneCustomRootElement_2017-08-10-21-25.json

diff --git a/common/changes/office-ui-fabric-react/rickyp-focusZoneCustomRootElement_2017-08-10-21-25.json b/common/changes/office-ui-fabric-react/rickyp-focusZoneCustomRootElement_2017-08-10-21-25.json
new file mode 100644
index 0000000000000..a64c6f5f2e3f8
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/rickyp-focusZoneCustomRootElement_2017-08-10-21-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added the ability to change the root element of a FocusZone",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "rickyp@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.Props.ts b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.Props.ts
index 4227189dd4cf9..e4f8cadcbd2c1 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.Props.ts
@@ -53,6 +53,11 @@ export interface IFocusZoneProps extends React.HTMLAttributes<HTMLElement | Focu
    */
   disabled?: boolean;
 
+  /**
+   * Element type the root element will use. Default is "div".
+   */
+  elementType?: keyof React.ReactHTML;
+
   /**
    * If set, will cycle to the beginning of the targets once the user navigates to the
    * next target while at the end, and to the end when navigate to the previous at the beginning.
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 0fae456213853..be116a5055fe9 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -108,22 +108,21 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     let { rootProps, ariaDescribedBy, ariaLabelledBy, className } = this.props;
     let divProps = getNativeProps(this.props, divProperties);
 
-    return (
-      <div
-        role='presentation'
-        { ...divProps }
-        { ...rootProps }
-        className={ css('ms-FocusZone', className) }
-        ref='root'
-        data-focuszone-id={ this._id }
-        aria-labelledby={ ariaLabelledBy }
-        aria-describedby={ ariaDescribedBy }
-        onKeyDown={ this._onKeyDown }
-        onFocus={ this._onFocus }
-        { ...{ onMouseDownCapture: this._onMouseDown } }
-      >
-        { this.props.children }
-      </div>
+    return React.createElement(
+      this.props.elementType || 'div', {
+        role: 'presentation',
+        ...divProps,
+        ...rootProps,
+        className: css('ms-FocusZone', className),
+        ref: 'root',
+        'data-focuszone-id': this._id,
+        'aria-labelledby': ariaLabelledBy,
+        'aria-describedby': ariaDescribedBy,
+        onKeyDown: this._onKeyDown,
+        onFocus: this._onFocus,
+        ...{ onMouseDownCapture: this._onMouseDown }
+      },
+      this.props.children
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Photos.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Photos.Example.tsx
index b26b2ddbc3f0d..c875658e13d03 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Photos.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Photos.Example.tsx
@@ -18,17 +18,20 @@ const PHOTOS = createArray(25, () => {
 });
 
 export const FocusZonePhotosExample = () => (
-  <FocusZone>
-    <ul className='ms-FocusZoneExamples-photoList'>
-      { PHOTOS.map((photo, index) => (
-        <div
-          key={ index }
-          className='ms-FocusZoneExamples-photoCell'
-          data-is-focusable={ true }
-          onClick={ () => console.log('clicked') }>
-          <Image src={ photo.url } width={ photo.width } height={ photo.height } />
-        </div>
-      )) }
-    </ul>
+  <FocusZone
+    elementType='ul'
+    className='ms-FocusZoneExamples-photoList'>
+    { PHOTOS.map((photo, index) => (
+      <li
+        key={ index }
+        className='ms-FocusZoneExamples-photoCell'
+        aria-posinset={ index + 1 }
+        aria-setsize={ PHOTOS.length }
+        aria-label='Photo'
+        data-is-focusable={ true }
+        onClick={ () => console.log('clicked') }>
+        <Image src={ photo.url } width={ photo.width } height={ photo.height } />
+      </li>
+    )) }
   </FocusZone>
 );

From 07c4a433d922de61db0c174908ec69e6337958ec Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Mon, 14 Aug 2017 15:03:04 -0700
Subject: [PATCH 0416/1641] Pickers: accessibility and styling fixes (#2493)

* Fixing picker styling issues.

* Adding aria label prop to base picker

* Preventing dismissSuggestions from resolving suggestions when nothing has been typed into the well

* rush change

* Removing min-width on tag item text

* PR comments: adding IInputProps interface

* Changing to single quotes
---
 ...epicker-backlog-bugs_2017-08-14-17-27.json | 11 ++++++++++
 .../src/components/Dropdown/Dropdown.scss     |  2 +-
 .../src/components/Persona/Persona.scss       |  2 +-
 .../components/pickers/BasePicker.Props.ts    |  9 ++++++++-
 .../src/components/pickers/BasePicker.scss    |  2 +-
 .../src/components/pickers/BasePicker.tsx     |  2 +-
 .../examples/PeoplePicker.Types.Example.tsx   | 20 ++++++++++++-------
 .../components/pickers/TagPicker/TagItem.scss | 14 ++++++++++---
 .../examples/TagPicker.Basic.Example.tsx      |  3 ++-
 9 files changed, 49 insertions(+), 16 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-basepicker-backlog-bugs_2017-08-14-17-27.json

diff --git a/common/changes/office-ui-fabric-react/v-krbrow-basepicker-backlog-bugs_2017-08-14-17-27.json b/common/changes/office-ui-fabric-react/v-krbrow-basepicker-backlog-bugs_2017-08-14-17-27.json
new file mode 100644
index 0000000000000..e97a4d29b1005
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-basepicker-backlog-bugs_2017-08-14-17-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Pickers: fixing accessiblity and styling issues",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
index 279595f90dd67..0fb77413564ac 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
@@ -148,7 +148,7 @@ $DropDown-item-height: 32px;
 .title {
   @include ms-normalize;
   background: $ms-color-white;
-  border: 1px solid $ms-color-neutralTertiaryAlt;
+  border: 1px solid $ms-color-neutralTertiary;
   cursor: pointer;
   display: block;
   height: $DropDown-height;
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
index f81fb09ed3f87..3a33d209fa869 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
@@ -123,7 +123,7 @@ $ms-Persona-presenceSizeXl: 28px;
 .initials {
   color: $ms-color-white;
   font-size: $ms-font-size-l;
-  font-weight: $ms-font-weight-light;
+  font-weight: $ms-font-weight-regular;
   line-height: 46px;
   height: $ms-Persona-sizeMd;
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
index 1bd4c1e9d17fa..f5d9dad3b6d03 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
@@ -75,7 +75,7 @@ export interface IBasePickerProps<T> extends React.Props<any> {
    * AutoFill input native props
    * @default undefined
    */
-  inputProps?: React.InputHTMLAttributes<HTMLInputElement>;
+  inputProps?: IInputProps;
   /**
    * A callback for when a persona is removed from the suggestion list
    */
@@ -179,4 +179,11 @@ export enum ValidationState {
   valid,
   warning,
   invalid
+}
+
+export interface IInputProps extends React.HTMLAttributes<HTMLInputElement> {
+  /**
+   * Screen reader label to apply to an input element.
+   */
+  'aria-label'?: string;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.scss b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.scss
index db022bd9c2ad8..a175b699c2dfd 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.scss
@@ -5,7 +5,7 @@
   flex-wrap: wrap;
   align-items: center;
   box-sizing: border-box;
-  border: 1px solid $ms-color-neutralLight;
+  border: 1px solid $ms-color-neutralTertiary;
   min-width: 180px;
   padding: 1px;
   min-height: 32px;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index bb8287f700e35..01309ee192e05 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -104,7 +104,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   @autobind
   public dismissSuggestions() {
     // Select the first suggestion if one is available when user leaves.
-    if (this.suggestionStore.hasSelectedSuggestion() && this.state.suggestionsVisible) {
+    if (this.suggestionStore.hasSelectedSuggestion() && this.state.suggestionsVisible && this.state.suggestedDisplayValue) {
       this.addItemByIndex(0);
     }
     this.setState({ suggestionsVisible: false });
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index 72dad72283541..0f8ccdab2f9f3 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -39,7 +39,7 @@ const suggestionProps: IBasePickerSuggestionsProps = {
   noResultsFoundText: 'No results found',
   loadingText: 'Loading',
   showRemoveButtons: true,
-  suggestionsAvailableAlertText: 'Suggestions available'
+  suggestionsAvailableAlertText: 'People Picker Suggestions available'
 };
 
 const limitedSearchAdditionalProps: IBasePickerSuggestionsProps = {
@@ -141,7 +141,8 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
         onValidateInput={ this._validateInput }
         inputProps={ {
           onBlur: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onBlur called'),
-          onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called')
+          onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called'),
+          'aria-label': 'People Picker'
         } }
         componentRef={ (component: IBasePicker<IPersonaProps>) => this._picker = component }
       />
@@ -162,7 +163,8 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
         removeButtonAriaLabel={ 'Remove' }
         inputProps={ {
           onBlur: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onBlur called'),
-          onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called')
+          onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called'),
+          'aria-label': 'People Picker'
         } }
         componentRef={ (component: IBasePicker<IPersonaProps>) => this._picker = component }
       />
@@ -181,7 +183,8 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
         onValidateInput={ this._validateInput }
         inputProps={ {
           onBlur: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onBlur called'),
-          onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called')
+          onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called'),
+          'aria-label': 'People Picker'
         } }
         componentRef={ (component: IBasePicker<IPersonaProps>) => this._picker = component }
       />
@@ -202,7 +205,8 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
         onValidateInput={ this._validateInput }
         inputProps={ {
           onBlur: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onBlur called'),
-          onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called')
+          onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called'),
+          'aria-label': 'People Picker'
         } }
         componentRef={ (component: IBasePicker<IPersonaProps>) => this._picker = component }
       />
@@ -223,7 +227,8 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
         onRemoveSuggestion={ this._onRemoveSuggestion }
         inputProps={ {
           onBlur: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onBlur called'),
-          onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called')
+          onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called'),
+          'aria-label': 'People Picker'
         } }
         componentRef={ (component: IBasePicker<IPersonaProps>) => this._picker = component }
       />
@@ -244,7 +249,8 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
         onItemSelected={ this._onItemSelected }
         inputProps={ {
           onBlur: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onBlur called'),
-          onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called')
+          onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called'),
+          'aria-label': 'People Picker'
         } }
         componentRef={ (component: IBasePicker<IPersonaProps>) => this._picker = component }
       />
diff --git a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.scss b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.scss
index aa9d7be1b6f93..affc79b0c84fb 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.scss
@@ -11,8 +11,7 @@
   user-select: none;
   display: flex;
   flex-wrap: nowrap;
-  min-width: 100px;
-  max-width: 100%;
+  max-width: 300px;
 
   &:hover {
     background: $ms-color-neutralLight;
@@ -20,17 +19,26 @@
 
   &.isSelected {
     background: $ms-color-neutralQuaternary;
+
+    @media screen and (-ms-high-contrast: active) {
+      border: 1px solid WindowFrame;
+    }
+
     &:hover {
       background: $ms-color-neutralQuaternaryAlt;
     }
   }
+
+  @media screen and (-ms-high-contrast: active) {
+    border: 1px solid WindowText;
+  }
 }
 
 .tagItemText {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
-  min-width: 100px;
+  min-width: 30px;
   margin: 0 8px;
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
index 67de9f7ad7326..7b664722e94aa 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
@@ -45,7 +45,8 @@ export class TagPickerBasicExample extends React.Component<{}, ITagPickerDemoPag
           disabled={ this.state.isPickerDisabled }
           inputProps={ {
             onBlur: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onBlur called'),
-            onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called')
+            onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called'),
+            'aria-label': 'Tag Picker'
           } }
         />
       </div>

From fe8cc9fcd642a0257968ed5861db03c91461517d Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 15 Aug 2017 10:19:22 +0000
Subject: [PATCH 0417/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../dropdown-fix_2017-08-14-17-13.json        | 11 ------
 ...-ComboBoxRoleTypoFix_2017-08-14-20-24.json | 11 ------
 .../rickyp-2432_2017-08-09-00-59.json         | 11 ------
 ...oneCustomRootElement_2017-08-10-21-25.json | 11 ------
 ...epicker-backlog-bugs_2017-08-14-17-27.json | 11 ------
 .../CHANGELOG.json                            | 17 +++++++++
 .../CHANGELOG.md                              |  9 +++++
 .../package.json                              |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 36 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 16 ++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 15 files changed, 83 insertions(+), 62 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/dropdown-fix_2017-08-14-17-13.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxRoleTypoFix_2017-08-14-20-24.json
 delete mode 100644 common/changes/office-ui-fabric-react/rickyp-2432_2017-08-09-00-59.json
 delete mode 100644 common/changes/office-ui-fabric-react/rickyp-focusZoneCustomRootElement_2017-08-10-21-25.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-basepicker-backlog-bugs_2017-08-14-17-27.json
 create mode 100644 packages/office-ui-fabric-react-experiments/CHANGELOG.json
 create mode 100644 packages/office-ui-fabric-react-experiments/CHANGELOG.md

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 110cc741f1ef5..a9d1698a5e6b4 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -74,7 +74,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.32.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.33.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index c5dfc1c334019..4543be98e6a99 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.32.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.33.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 0d2a2fa61c6a2..e8004331c5cb4 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -35,7 +35,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.32.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.33.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 0983d9af6f344..b2c98563dd8fb 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.32.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.33.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/dropdown-fix_2017-08-14-17-13.json b/common/changes/office-ui-fabric-react/dropdown-fix_2017-08-14-17-13.json
deleted file mode 100644
index 3e9d92a251785..0000000000000
--- a/common/changes/office-ui-fabric-react/dropdown-fix_2017-08-14-17-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: no longer scrolls body when arrowing up down at the start/end of the menu. Also added `multSelectDelimiter` for tweaking how the title is rendered in a multi-select scenario.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxRoleTypoFix_2017-08-14-20-24.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxRoleTypoFix_2017-08-14-20-24.json
deleted file mode 100644
index 4663bdb10627b..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxRoleTypoFix_2017-08-14-20-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Fix role typo to read heading instead of header",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/rickyp-2432_2017-08-09-00-59.json b/common/changes/office-ui-fabric-react/rickyp-2432_2017-08-09-00-59.json
deleted file mode 100644
index 7f151034b5161..0000000000000
--- a/common/changes/office-ui-fabric-react/rickyp-2432_2017-08-09-00-59.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added menu indexes to the accessibility readouts for ContextMenus",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "rickyp@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/rickyp-focusZoneCustomRootElement_2017-08-10-21-25.json b/common/changes/office-ui-fabric-react/rickyp-focusZoneCustomRootElement_2017-08-10-21-25.json
deleted file mode 100644
index a64c6f5f2e3f8..0000000000000
--- a/common/changes/office-ui-fabric-react/rickyp-focusZoneCustomRootElement_2017-08-10-21-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added the ability to change the root element of a FocusZone",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "rickyp@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-basepicker-backlog-bugs_2017-08-14-17-27.json b/common/changes/office-ui-fabric-react/v-krbrow-basepicker-backlog-bugs_2017-08-14-17-27.json
deleted file mode 100644
index e97a4d29b1005..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-basepicker-backlog-bugs_2017-08-14-17-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Pickers: fixing accessiblity and styling issues",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-experiments/CHANGELOG.json b/packages/office-ui-fabric-react-experiments/CHANGELOG.json
new file mode 100644
index 0000000000000..cb8ef4af3b15b
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/CHANGELOG.json
@@ -0,0 +1,17 @@
+{
+  "name": "@uifabric/experiments",
+  "entries": [
+    {
+      "version": "0.0.1",
+      "tag": "@uifabric/experiments_v0.0.1",
+      "date": "Tue, 15 Aug 2017 10:19:22 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.31.0` to `4.33.0`"
+          }
+        ]
+      }
+    }
+  ]
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-experiments/CHANGELOG.md b/packages/office-ui-fabric-react-experiments/CHANGELOG.md
new file mode 100644
index 0000000000000..878d6a4557bff
--- /dev/null
+++ b/packages/office-ui-fabric-react-experiments/CHANGELOG.md
@@ -0,0 +1,9 @@
+# Change Log - @uifabric/experiments
+
+This log was last generated on Tue, 15 Aug 2017 10:19:22 GMT and should not be manually modified.
+
+## 0.0.1
+Tue, 15 Aug 2017 10:19:22 GMT
+
+*Initial release*
+
diff --git a/packages/office-ui-fabric-react-experiments/package.json b/packages/office-ui-fabric-react-experiments/package.json
index 39662c8464dd5..22a5d86380500 100644
--- a/packages/office-ui-fabric-react-experiments/package.json
+++ b/packages/office-ui-fabric-react-experiments/package.json
@@ -64,7 +64,7 @@
     "webpack-notifier": "^1.5.0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.31.0"
+    "office-ui-fabric-react": "4.33.0"
   },
   "peerDependencies": {
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 0513f1c348f96..f512e69534082 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,42 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.33.0",
+      "tag": "office-ui-fabric-react_v4.33.0",
+      "date": "Tue, 15 Aug 2017 10:19:22 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "1cdf83594ca2e1bdd844b5cb99a13c01ea23bdb2",
+            "comment": "Dropdown: no longer scrolls body when arrowing up down at the start/end of the menu. Also added `multSelectDelimiter` for tweaking how the title is rendered in a multi-select scenario."
+          },
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "07c4a433d922de61db0c174908ec69e6337958ec",
+            "comment": "Pickers: fixing accessiblity and styling issues"
+          }
+        ],
+        "patch": [
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "5a4b65ff3e7f45706076b5127237cc0266e87b35",
+            "comment": "ComboBox: Fix role typo to read heading instead of header"
+          },
+          {
+            "author": "Ricky Patel <rickyp@microsoft.com>",
+            "commit": "5e997af469f817b17544b9d39c04b0ed1b37af75",
+            "comment": "Added menu indexes to the accessibility readouts for ContextMenus"
+          },
+          {
+            "author": "Ricky Patel <rickyp@microsoft.com>",
+            "commit": "d7dd2ef00231bd0accbe53788c8efde51256bc2b",
+            "comment": "Added the ability to change the root element of a FocusZone"
+          }
+        ]
+      }
+    },
     {
       "version": "4.32.0",
       "tag": "office-ui-fabric-react_v4.32.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index b4400b3e6054e..f875bc75a7c85 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,20 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 11 Aug 2017 19:38:35 GMT and should not be manually modified.
+This log was last generated on Tue, 15 Aug 2017 10:19:22 GMT and should not be manually modified.
+
+## 4.33.0
+Tue, 15 Aug 2017 10:19:22 GMT
+
+### Minor changes
+
+- Dropdown: no longer scrolls body when arrowing up down at the start/end of the menu. Also added `multSelectDelimiter` for tweaking how the title is rendered in a multi-select scenario.
+- Pickers: fixing accessiblity and styling issues
+
+### Patches
+
+- ComboBox: Fix role typo to read heading instead of header
+- Added menu indexes to the accessibility readouts for ContextMenus
+- Added the ability to change the root element of a FocusZone
 
 ## 4.32.0
 Fri, 11 Aug 2017 19:38:35 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 4cb21ec7bc2d6..7514315ab6d36 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.32.0",
+  "version": "4.33.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From d67af9b7cb454b35931c33fb8f0e9f9f65330876 Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Tue, 15 Aug 2017 09:52:04 -0700
Subject: [PATCH 0418/1641] Calendar remove extra margin from bottom of
 component (#2469)

* no message

* no message

* Removed extra bottom margin.  Margin is only necessary when 'Go to today' button is visible

* Change log

* removed additional json dependencies

* Adding comments to css
---
 ...darRemoveExtraMargin_2017-08-10-23-23.json | 11 +++++++++
 .../src/components/Calendar/Calendar.scss     | 24 +++++++++++++++----
 .../src/components/Calendar/Calendar.tsx      |  3 +--
 .../examples/Calendar.Inline.Example.tsx      |  2 +-
 4 files changed, 32 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-CalendarRemoveExtraMargin_2017-08-10-23-23.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-CalendarRemoveExtraMargin_2017-08-10-23-23.json b/common/changes/office-ui-fabric-react/kegorr-CalendarRemoveExtraMargin_2017-08-10-23-23.json
new file mode 100644
index 0000000000000..3ce23f20b753d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-CalendarRemoveExtraMargin_2017-08-10-23-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Calendar had extra 30px margin at the bottom of the component.  It interfered with the layout below the component.  The 30px margin is only necessary when the 'go to today' button is visible.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
index da48e76eee211..47760e3c9ab56 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
@@ -11,7 +11,6 @@ $Calendar-dayPicker-margin: 10px;
 
 .root {
   @include ms-normalize;
-  margin-bottom: 17px;
 }
 
 // Base wrapper for the date picker.
@@ -60,7 +59,6 @@ $Calendar-dayPicker-margin: 10px;
 // Wrapper containing the calendar view to pick a specific date.
 .dayPicker {
   display: block;
-  margin-bottom: 30px;
 }
 
 
@@ -259,7 +257,7 @@ $Calendar-dayPicker-margin: 10px;
   position: relative;
   height: 210px;
   width: 280px;
-  @include margin(10px, 0, 30px, 5px);
+  @include margin(10px, 0, 0px, 5px);
 }
 
 // Button to select a different month.
@@ -306,6 +304,11 @@ $Calendar-dayPicker-margin: 10px;
   }
 }
 
+//additional 30px margin needed when "Go to today" button is visible
+.wrap.goTodaySpacing{
+  margin-bottom: 30px;
+}
+
 // State: The picker is showing the year components.
 .root.isPickingYears {
   // Hide the day picking components.
@@ -401,7 +404,6 @@ $Calendar-dayPicker-margin: 10px;
       min-height: ( $Calendar-day * 8 ) - $Calendar-dayPicker-margin;
     }
 
-
     .holder {
       width: 440px;
     }
@@ -421,7 +423,6 @@ $Calendar-dayPicker-margin: 10px;
       @include margin-left(12px);
     }
 
-
     .optionGrid {
       width: 200px;
       height: auto;
@@ -465,6 +466,10 @@ $Calendar-dayPicker-margin: 10px;
       @include text-align(right);
       top: 199px;
     }
+    //When date and month picker are side-by-side and "Go to today" button is visible no additional margin is needed
+    .wrap.goTodaySpacing{
+      margin-bottom: 0px;
+    }
     // State: The picker is showing the year components.
     // On larger screens the calendar will remain and the years
     // will replace the months.
@@ -512,6 +517,10 @@ $Calendar-dayPicker-margin: 10px;
       position: relative;
       top: 0;
     }
+
+    .wrap.goTodaySpacing{
+      margin-bottom: 30px;
+    }
   }
 }
 
@@ -532,6 +541,11 @@ $Calendar-dayPicker-margin: 10px;
       display: block;
     }
   }
+
+  //additional 30px margin needed when "Go to today" button is visible
+  .wrap.goTodaySpacing{
+    margin-bottom: 30px;
+  }
 }
 
 
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index b28200ab3ec21..354a99995798b 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -99,7 +99,6 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     let rootClass = 'ms-DatePicker';
     let { firstDayOfWeek, dateRangeType, strings, isMonthPickerVisible, isDayPickerVisible, autoNavigateOnSelection, showGoToToday, highlightCurrentMonth, navigationIcons } = this.props;
     let { selectedDate, navigatedDate } = this.state;
-
     return (
       <div className={ css(rootClass, styles.root) } ref='root' role='application'>
         <div className={ css(
@@ -112,7 +111,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
         ) } >
           <div className={ css('ms-DatePicker-holder ms-slideDownIn10', styles.holder) } onKeyDown={ this._onDatePickerPopupKeyDown }>
             <div className={ css('ms-DatePicker-frame', styles.frame) }>
-              <div className={ css('ms-DatePicker-wrap', styles.wrap) }>
+              <div className={ css('ms-DatePicker-wrap', styles.wrap, showGoToToday && styles.goTodaySpacing) }>
                 { isDayPickerVisible && <CalendarDay
                   selectedDate={ selectedDate! }
                   navigatedDate={ navigatedDate! }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
index 9ba8d605f55ef..6d53296ccf67a 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
@@ -98,7 +98,7 @@ export class CalendarInlineExample extends React.Component<ICalendarInlineExampl
     };
 
     let buttonStyle: React.CSSProperties = {
-      margin: '0 10px 0 0'
+      margin: '17px 10px 0 0'
     };
 
     let dateRangeString: string | null = null;

From 8d6bf682d48e2e54d5b5aaa73ab2f0265c907f30 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Tue, 15 Aug 2017 12:05:55 -0700
Subject: [PATCH 0419/1641] List paging (#2421)

* Add Page customization support to List component

* Update change output
---
 .../list-paging_2017-08-08-18-00.json         |  11 +
 .../src/components/List/List.Props.ts         |  61 ++++-
 .../src/components/List/List.tsx              | 244 ++++++++++++------
 3 files changed, 230 insertions(+), 86 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/list-paging_2017-08-08-18-00.json

diff --git a/common/changes/office-ui-fabric-react/list-paging_2017-08-08-18-00.json b/common/changes/office-ui-fabric-react/list-paging_2017-08-08-18-00.json
new file mode 100644
index 0000000000000..37f08a4061035
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/list-paging_2017-08-08-18-00.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add ability to override page render behavior in List",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/List/List.Props.ts b/packages/office-ui-fabric-react/src/components/List/List.Props.ts
index ee6d88859af88..26b035ed8ec08 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/List/List.Props.ts
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { IRectangle } from '../../Utilities';
+import { IRectangle, IRenderFunction } from '../../Utilities';
 import { List } from './List';
 
 export interface IList {
@@ -41,7 +41,18 @@ export interface IListProps extends React.HTMLAttributes<List | HTMLDivElement>
   /** Optional callback to get the item key, to be used on render. */
   getKey?: (item: any, index?: number) => string;
 
-  /** Method called by the list to get how many items to render per page from specified index. */
+  /**
+   * Called by the list to get the specification for a page.
+   * Use this method to provide an allocation of items per page,
+   * as well as an estimated rendered height for the page.
+   * The list will use this to optimize virtualization.
+   */
+  getPageSpecification?: (itemIndex?: number, visibleRect?: IRectangle) => IPageSpecification;
+
+  /**
+   * Method called by the list to get how many items to render per page from specified index.
+   * In general, use `getPageSpecification` instead.
+   */
   getItemCountForPage?: (itemIndex?: number, visibleRect?: IRectangle) => number;
 
   /**
@@ -49,6 +60,7 @@ export interface IListProps extends React.HTMLAttributes<List | HTMLDivElement>
    * page's height and default all other pages to that height when calculating the surface space. It is
    * ideal to be able to adequately predict page heights in order to keep the surface space from jumping
    * in pixels, which has been seen to cause browser performance issues.
+   * In general, use `getPageSpecification` instead.
    */
   getPageHeight?: (itemIndex?: number, visibleRect?: IRectangle) => number;
 
@@ -77,12 +89,12 @@ export interface IListProps extends React.HTMLAttributes<List | HTMLDivElement>
   renderCount?: number;
 
   /**
-  * Boolean value to enable render page caching. This is an experimental performance optimization 
+  * Boolean value to enable render page caching. This is an experimental performance optimization
   * that is off by default.
   * @defaultValue false
   */
   usePageCache?: boolean;
-  
+
   /**
    * Optional callback to determine whether the list should be rendered in full, or virtualized.
    * Virtualization will add and remove pages of items as the user scrolls them into the visible range.
@@ -90,14 +102,53 @@ export interface IListProps extends React.HTMLAttributes<List | HTMLDivElement>
    * The default implementation will virtualize when this callback is not provided.
    */
   onShouldVirtualize?: (props: IListProps) => boolean;
+
+  /**
+   * The role to assign to the list root element.
+   * Use this to override the default assignment of 'list' to the root and 'listitem' to the cells.
+   */
+  role?: string;
+
+  /**
+   * Called when the List will render a page.
+   * Override this to control how cells are rendered within a page.
+   */
+  onRenderPage?: (pageProps: IPageProps, defaultRender?: IRenderFunction<IPageProps>) => React.ReactNode;
 }
 
 export interface IPage {
   key: string;
-  items: any[];
+  items: any[] | undefined;
   startIndex: number;
   itemCount: number;
   style: any;
   top: number;
   height: number;
+  data?: any;
+}
+
+export interface IPageProps extends React.HTMLAttributes<HTMLDivElement>, React.Props<HTMLDivElement> {
+  /**
+   * The role being assigned to the rendered page element by the list.
+   */
+  role?: string;
+  /**
+   * The allocation data for the page.
+   */
+  page: IPage;
+}
+
+export interface IPageSpecification {
+  /**
+   * The number of items to allocate to the page.
+   */
+  itemCount?: number;
+  /**
+   * The estimated pixel height of the page.
+   */
+  height?: number;
+  /**
+   * Data to pass through to the page when rendering.
+   */
+  data?: any;
 }
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index 6f42f0ce959d7..35899d4076a89 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -2,15 +2,16 @@ import * as React from 'react';
 import {
   BaseComponent,
   IRectangle,
-  assign,
   css,
   findIndex,
   findScrollableParent,
   getParent,
   divProperties,
-  getNativeProps
+  getNativeProps,
+  IRenderFunction,
+  autobind
 } from '../../Utilities';
-import { IList, IListProps, IPage } from './List.Props';
+import { IList, IListProps, IPage, IPageProps, IPageSpecification } from './List.Props';
 
 const RESIZE_DELAY = 16;
 const MIN_SCROLL_UPDATE_DELAY = 100;
@@ -65,7 +66,7 @@ const _measureScrollRect = _measurePageRect;
  *
  * Measuring too frequently can pull performance down significantly. To compensate, we cache measured values so that
  * we can avoid re-measuring during operations that should not alter heights, like scrolling.
- * 
+ *
  * To optimize glass rendering performance, onShouldVirtualize can be set. When onShouldVirtualize return false,
  * List will run in fast mode (not virtualized) to render all items without any measurements to improve page load time. And we
  * start doing measurements and rendering in virtualized mode when items grows larger than this threshold.
@@ -77,7 +78,7 @@ const _measureScrollRect = _measurePageRect;
 export class List extends BaseComponent<IListProps, IListState> implements IList {
   public static defaultProps = {
     startIndex: 0,
-    onRenderCell: (item: any, index: number, containsFocus: boolean) => (<div>{(item && item.name) || ''}</div>),
+    onRenderCell: (item: any, index: number, containsFocus: boolean) => (<div>{ (item && item.name) || '' }</div>),
     renderedWindowsAhead: DEFAULT_RENDERED_WINDOWS_AHEAD,
     renderedWindowsBehind: DEFAULT_RENDERED_WINDOWS_BEHIND
   };
@@ -180,11 +181,16 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     const renderCount = this._getRenderCount();
     const endIndex = startIndex + renderCount;
 
+    const allowedRect = this._allowedRect;
+
     let scrollTop = 0;
 
     let itemsPerPage = 1;
     for (let itemIndex = startIndex; itemIndex < endIndex; itemIndex += itemsPerPage) {
-      itemsPerPage = this._getItemCountForPage(itemIndex, this._allowedRect);
+      const pageSpecification = this._getPageSpecification(itemIndex, allowedRect);
+
+      const pageHeight = pageSpecification.height;
+      itemsPerPage = pageSpecification.itemCount;
 
       const requestedIndexIsInPage = itemIndex <= index && (itemIndex + itemsPerPage) > index;
       if (requestedIndexIsInPage) {
@@ -237,7 +243,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
         break;
       }
 
-      scrollTop += this._getPageHeight(itemIndex, itemsPerPage, this._surfaceRect);
+      scrollTop += pageHeight;
     }
   }
 
@@ -277,11 +283,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     let { pages: newPages, measureVersion } = newState;
     let shouldComponentUpdate = false;
 
-    if (
-      this._measureVersion === measureVersion &&
-      newProps.renderedWindowsAhead === renderedWindowsAhead,
-      newProps.renderedWindowsBehind === renderedWindowsBehind,
-      newProps.items === this.props.items &&
+    if (newProps.items === this.props.items &&
       oldPages!.length === newPages!.length) {
       for (let i = 0; i < oldPages!.length; i++) {
         let oldPage = oldPages![i];
@@ -311,24 +313,32 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   }
 
   public render() {
-    let { className, role } = this.props;
-    let { pages } = this.state;
-    let pageElements = [];
+    const {
+      className,
+      role,
+      onRenderPage = this._onRenderPage
+    } = this.props;
+    const {
+      pages = []
+    } = this.state;
+    let pageElements: JSX.Element[] = [];
     let divProps = getNativeProps(this.props, divProperties);
 
-    // assign list if no role
-    role = (role === undefined) ? 'list' : role;
-
-    for (let i = 0; i < pages!.length; i++) {
-      pageElements.push(this._renderPage(pages![i]));
+    for (const page of pages) {
+      pageElements.push(this._renderPage(page));
     }
 
     // console.log(`Page elements ${pageElements.length}`);
 
     return (
-      <div ref='root' { ...divProps } role={role} className={css('ms-List', className)} >
-        <div ref='surface' className='ms-List-surface' role='presentation'>
-          {pageElements}
+      <div
+        ref='root'
+        { ...divProps }
+        role={ (role === undefined) ? 'list' : role }
+        className={ css('ms-List', className) }
+      >
+        <div ref='surface' className={ css('ms-List-surface') } role='presentation'>
+          { pageElements }
         </div>
       </div>
     );
@@ -348,7 +358,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     this._pageCache = {};
   }
 
-  private _renderPage(page: IPage): any {
+  private _renderPage(page: IPage): JSX.Element {
     let { onRenderCell, role, usePageCache } = this.props;
     let cachedPage;
     // if usePageCache is set and cached page element can be found, just return cached page
@@ -359,39 +369,24 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       }
     }
 
-    let cells = [];
-    let pageStyle = this._getPageStyle(page);
+    const pageStyle = this._getPageStyle(page);
 
-    // only assign list item role if no role is assigned
-    role = (role === undefined) ? 'listitem' : 'presentation';
-
-    for (let i = 0; page.items && i < page.items.length; i++) {
-      let item = page.items[i];
-      const index = page.startIndex + i;
-      let itemKey =
-        this.props.getKey
-          ? this.props.getKey(item, index)
-          : item && item.key;
-
-      if (itemKey === null || itemKey === undefined) {
-        itemKey = index;
-      }
+    const {
+      onRenderPage = this._onRenderPage
+    } = this.props;
 
-      cells.push(
-        <div role={role} className='ms-List-cell' key={itemKey} data-list-index={i + page.startIndex} data-automationid='ListCell'>
-          {onRenderCell!(item, page.startIndex + i)}
-        </div>
-      );
-    }
+    const pageElement = onRenderPage({
+      page: page,
+      className: css('ms-List-page'),
+      key: page.key,
+      ref: page.key,
+      style: pageStyle,
+      role: 'presentation'
+    }, this._onRenderPage);
 
-    const pageElement = (
-      <div className='ms-List-page' key={page.key} ref={page.key} style={pageStyle} role='presentation'>
-        {cells}
-      </div>
-    );
     // cache the first page for now since it is re-rendered a lot times unncessarily.
     // todo: a more aggresive caching mechanism is to cache pages constaining the items not changed.
-    // now we re-render pages too frequently, for example, props.items increased from 30 to 60, although the 
+    // now we re-render pages too frequently, for example, props.items increased from 30 to 60, although the
     // first 30 items did not change, we still re-rendered all of them in this props.items change.
     if (usePageCache && page.startIndex === 0) {
       this._pageCache[page.key] = {
@@ -403,20 +398,65 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   }
 
   /** Generate the style object for the page. */
-  private _getPageStyle(page: IPage) {
-    let style;
-    let { getPageStyle } = this.props;
+  private _getPageStyle(page: IPage): React.StyleHTMLAttributes<HTMLDivElement> {
+    const {
+      getPageStyle
+    } = this.props;
 
-    if (getPageStyle) {
-      style = getPageStyle(page);
-    }
+    return {
+      ...(getPageStyle ? getPageStyle(page) : {}),
+      ...(!page.items ? {
+        height: page.height
+      } : {})
+    };
+  }
 
-    if (!page.items) {
-      style = style || {};
-      style.height = page.height;
-    }
+  @autobind
+  private _onRenderPage(pageProps: IPageProps, defaultRender?: IRenderFunction<IPageProps>): any {
+    const {
+      onRenderCell,
+      role
+    } = this.props;
+
+    const {
+      page: {
+        items,
+      startIndex
+      },
+      ...divProps
+    } = pageProps;
 
-    return style;
+    // only assign list item role if no role is assigned
+    const cellRole = (role === undefined) ? 'listitem' : 'presentation';
+
+    const cells = (items || []).map((item: any, offset: number) => {
+      const index = startIndex + offset;
+
+      let itemKey = this.props.getKey ?
+        this.props.getKey(item, index) :
+        item && item.key;
+
+      if (itemKey === null || itemKey === undefined) {
+        itemKey = index;
+      }
+
+      return (
+        <div role={ cellRole }
+          className={ css('ms-List-cell') }
+          key={ itemKey }
+          data-list-index={ index }
+          data-automationid='ListCell'>
+          { onRenderCell && onRenderCell(item, index) }
+        </div>
+      );
+    });
+
+    return (
+      <div
+        { ...divProps }>
+        { cells }
+      </div>
+    );
   }
 
   /** Track the last item index focused so that we ensure we keep it rendered. */
@@ -634,9 +674,10 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
 
   /** Build up the pages that should be rendered. */
   private _buildPages(items: any[], startIndex: number, renderCount: number): IListState {
-    let materializedRect = assign({}, EMPTY_RECT) as IRectangle;
+    const materializedRect = { ...EMPTY_RECT };
+    const pages: IPage[] = [];
+
     let itemsPerPage = 1;
-    let pages = [];
     let pageTop = 0;
     let currentSpacer = null;
     let focusedIndex = this._focusedIndex;
@@ -648,14 +689,19 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     // However if the user provides a measure function, let's just assume they know the right heights.
     let isFirstRender = this._estimatedPageHeight === 0 && !this.props.getPageHeight;
 
+    const allowedRect = this._allowedRect;
+
     for (let itemIndex = startIndex; itemIndex < endIndex; itemIndex += itemsPerPage) {
-      itemsPerPage = this._getItemCountForPage(itemIndex, this._allowedRect);
+      const pageSpecification = this._getPageSpecification(itemIndex, allowedRect);
+      const pageHeight = pageSpecification.height;
+      const pageData = pageSpecification.data;
+
+      itemsPerPage = pageSpecification.itemCount;
 
-      let pageHeight = this._getPageHeight(itemIndex, itemsPerPage, this._surfaceRect);
       let pageBottom = pageTop + pageHeight - 1;
 
       let isPageRendered = findIndex(this.state.pages as IPage[], (page) => page.items && page.startIndex === itemIndex) > -1;
-      let isPageInAllowedRange = !this._allowedRect || pageBottom >= this._allowedRect.top && pageTop <= this._allowedRect.bottom!;
+      let isPageInAllowedRange = !allowedRect || pageBottom >= allowedRect.top && pageTop <= allowedRect.bottom!;
       let isPageInRequiredRange = !this._requiredRect || pageBottom >= this._requiredRect!.top && pageTop <= this._requiredRect!.bottom!;
       let isPageVisible = !isFirstRender && (isPageInRequiredRange || (isPageInAllowedRange && isPageRendered)) || !shouldVirtualize;
       let isPageFocused = focusedIndex >= itemIndex && focusedIndex < (itemIndex + itemsPerPage);
@@ -663,7 +709,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
 
       // console.log('building page', itemIndex, 'pageTop: ' + pageTop, 'inAllowed: ' + isPageInAllowedRange, 'inRequired: ' + isPageInRequiredRange);
 
-      // Only render whats visible, focused, or first page, 
+      // Only render whats visible, focused, or first page,
       // or when running in fast rendering mode (not in virtualized mode), we render all current items in pages
       if (isPageVisible || isPageFocused || isFirstPage) {
         if (currentSpacer) {
@@ -672,7 +718,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
         }
 
         let itemsInPage = Math.min(itemsPerPage, endIndex - itemIndex);
-        let newPage = this._createPage(null, items.slice(itemIndex, itemIndex + itemsInPage), itemIndex);
+        let newPage = this._createPage(undefined, items.slice(itemIndex, itemIndex + itemsInPage), itemIndex, undefined, undefined, pageData);
 
         newPage.top = pageTop;
         newPage.height = pageHeight;
@@ -684,15 +730,15 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
             top: pageTop,
             bottom: pageBottom,
             height: pageHeight,
-            left: this._allowedRect.left,
-            right: this._allowedRect.right,
-            width: this._allowedRect.width
+            left: allowedRect.left,
+            right: allowedRect.right,
+            width: allowedRect.width
           });
         }
 
       } else {
         if (!currentSpacer) {
-          currentSpacer = this._createPage('spacer-' + itemIndex, null, itemIndex, 0);
+          currentSpacer = this._createPage('spacer-' + itemIndex, undefined, itemIndex, 0, undefined, pageData);
         }
         currentSpacer.height = (currentSpacer.height || 0) + (pageBottom - pageTop) + 1;
         currentSpacer.itemCount += itemsPerPage;
@@ -720,6 +766,41 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     };
   }
 
+  private _getPageSpecification(itemIndex: number, visibleRect: IRectangle): {
+    // These return values are now no longer optional.
+    itemCount: number;
+    height: number;
+    data?: any;
+  } {
+    const {
+      getPageSpecification
+    } = this.props;
+    if (getPageSpecification) {
+      const pageData = getPageSpecification(itemIndex, visibleRect);
+
+      const {
+        itemCount = this._getItemCountForPage(itemIndex, visibleRect)
+      } = pageData;
+
+      const {
+        height = this._getPageHeight(itemIndex, itemCount, visibleRect)
+      } = pageData;
+
+      return {
+        itemCount: itemCount,
+        height: height,
+        data: pageData.data
+      };
+    } else {
+      const itemCount = this._getItemCountForPage(itemIndex, visibleRect);
+
+      return {
+        itemCount: itemCount,
+        height: this._getPageHeight(itemIndex, itemCount, visibleRect)
+      };
+    }
+  }
+
   /**
    * Get the pixel height of a give page. Will use the props getPageHeight first, and if not provided, fallback to
    * cached height, or estimated page height, or default page height.
@@ -740,7 +821,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     return itemsPerPage ? itemsPerPage : DEFAULT_ITEMS_PER_PAGE;
   }
 
-  private _createPage(pageKey: string | null, items: any[] | null, startIndex?: number, count?: number, style?: any): IPage {
+  private _createPage(pageKey: string | undefined, items: any[] | undefined, startIndex: number = -1, count: number = items ? items.length : 0, style: any = {}, data: any = undefined): IPage {
     pageKey = pageKey || ('page-' + startIndex);
     const cachedPage = this._pageCache[pageKey];
     if (cachedPage && cachedPage.page) {
@@ -750,18 +831,19 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     // Fill undefined cells because array.map will ignore undefined cells.
     if (items) {
       for (let i = 0; i < items.length; i++) {
-        items[i] = items[i] || null;
+        items[i] = items[i] || undefined;
       }
     }
 
     return {
       key: pageKey,
-      startIndex: startIndex === undefined ? -1 : startIndex,
-      itemCount: (count === undefined) ? (items ? items.length : 0) : count,
-      items: items as any[],
+      startIndex: startIndex,
+      itemCount: count,
+      items: items,
       style: style || {},
       top: 0,
-      height: 0
+      height: 0,
+      data: data
     };
   }
 
@@ -861,4 +943,4 @@ function _mergeRect(targetRect: IRectangle, newRect: IRectangle): IRectangle {
   targetRect.height = targetRect.bottom! - targetRect.top + 1;
 
   return targetRect;
-}
\ No newline at end of file
+}

From de591860c357b1264ea259c0ab6b9b1c1047de65 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 15 Aug 2017 13:02:44 -0700
Subject: [PATCH 0420/1641] Update README.md

---
 packages/office-ui-fabric-react-experiments/README.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/office-ui-fabric-react-experiments/README.md b/packages/office-ui-fabric-react-experiments/README.md
index 721c55da64a9c..72299e9471c98 100644
--- a/packages/office-ui-fabric-react-experiments/README.md
+++ b/packages/office-ui-fabric-react-experiments/README.md
@@ -7,11 +7,11 @@ These are not production ready components and __should never be used in product_
 To import experimantal components:
 
 ```js
-import { ComponentName } from '@officeui/experiments/lib/ComponentName';
+import { ComponentName } from '@uifabric/experiments/lib/ComponentName';
 ```
 
 Once the experimental component graduates to a production release the component will be available at:
 
 ```js
 import { ComponentName } from 'office-ui-fabric-react/lib/ComponentName';
-```
\ No newline at end of file
+```

From 10b530ad1ede39a211c77e3b7050a437416f1f44 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 15 Aug 2017 13:30:42 -0700
Subject: [PATCH 0421/1641] Update CODEOWNERS

---
 .github/CODEOWNERS | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index 239a0285606e7..f7771919d1f0e 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -33,7 +33,7 @@
     # packages/office-ui-fabric-react/src/components/ActivityItem/*
     # packages/office-ui-fabric-react/src/components/Breadcrumb/*
     # packages/office-ui-fabric-react/src/components/Button/*
-    # packages/office-ui-fabric-react/src/components/Calendar/*   @johannao76 @lorejoh12
+    packages/office-ui-fabric-react/src/components/Calendar/*   @johannao76 @lorejoh12
     # packages/office-ui-fabric-react/src/components/Callout/*
     # packages/office-ui-fabric-react/src/components/Check/*
     # packages/office-ui-fabric-react/src/components/Checkbox/*
@@ -42,7 +42,7 @@
     # packages/office-ui-fabric-react/src/components/ComboBox/*
     packages/office-ui-fabric-react/src/components/CommandBar/*   @micahgodbolt
     # packages/office-ui-fabric-react/src/components/ContextualMenu/*
-    # packages/office-ui-fabric-react/src/components/DatePicker/*   @johannao76 @lorejoh12
+    packages/office-ui-fabric-react/src/components/DatePicker/*   @johannao76 @lorejoh12
     # packages/office-ui-fabric-react/src/components/DetailsList/*
     # packages/office-ui-fabric-react/src/components/Dialog/*
     # packages/office-ui-fabric-react/src/components/DocumentCard/*
@@ -71,7 +71,7 @@
     # packages/office-ui-fabric-react/src/components/Pivot/*
     # packages/office-ui-fabric-react/src/components/Popup/*
     # packages/office-ui-fabric-react/src/components/ProgressIndicator/*
-    # packages/office-ui-fabric-react/src/components/Rating/*  @cschleiden
+    packages/office-ui-fabric-react/src/components/Rating/*  @cschleiden
     packages/office-ui-fabric-react/src/components/ResizeGroup/*  @micahgodbolt
     # packages/office-ui-fabric-react/src/components/SearchBox/*
     # packages/office-ui-fabric-react/src/components/Slider/*

From ee12a9a1f80e4822953571f3d3627fdb483b910a Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 15 Aug 2017 13:31:01 -0700
Subject: [PATCH 0422/1641] Update CODEOWNERS

---
 .github/CODEOWNERS | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index f7771919d1f0e..16633634559b1 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -58,7 +58,7 @@
     # packages/office-ui-fabric-react/src/components/Label/*
     # packages/office-ui-fabric-react/src/components/Layer/*
     # packages/office-ui-fabric-react/src/components/Link/*
-    # packages/office-ui-fabric-react/src/components/List/*  @cschleiden
+    packages/office-ui-fabric-react/src/components/List/*  @cschleiden
     # packages/office-ui-fabric-react/src/components/MarqueeSelection/*
     # packages/office-ui-fabric-react/src/components/MessageBar/*
     # packages/office-ui-fabric-react/src/components/Modal/*

From c19ef03ff37d4c3f3dee5fac23d92d9d92399839 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 15 Aug 2017 16:15:04 -0700
Subject: [PATCH 0423/1641] change folder name of office-ui-fabric-experiments
 (#2513)

* change folder name

* Update GettingStartedPage.tsx
---
 common/config/rush/npm-shrinkwrap.json        | 981 +++++++++++++++---
 .../.npmignore                                |   0
 .../.npmrc                                    |   0
 .../.vscode/settings.json                     |   0
 .../CHANGELOG.json                            |   0
 .../CHANGELOG.md                              |   0
 .../LICENSE                                   |   0
 .../README.md                                 |   0
 .../config/api-extractor.json.disabled        |   0
 .../gulpfile.js                               |   0
 .../index.html                                |   0
 .../jsconfig.json                             |   0
 .../karma.config.js                           |   0
 .../package.json                              |   0
 .../src/Link.ts                               |   0
 .../src/common/tests.js                       |   0
 .../src/components/Link/Link.Props.ts         |   0
 .../src/components/Link/Link.scss             |   0
 .../src/components/Link/Link.test.tsx         |   0
 .../src/components/Link/Link.tsx              |   0
 .../src/components/Link/LinkPage.tsx          |   4 +-
 .../Link/examples/Link.Basic.Example.tsx      |   0
 .../src/components/Link/index.ts              |   0
 .../src/demo/AppDefinition.tsx                |   0
 .../src/demo/ColorStyles.scss                 |   0
 .../src/demo/GettingStartedPage.scss          |   0
 .../src/demo/GettingStartedPage.tsx           |   2 +-
 .../src/demo/index.scss                       |   0
 .../src/demo/index.tsx                        |   0
 .../src/index.ts                              |   0
 .../tsconfig.json                             |   2 +-
 .../tslint.json                               |   0
 .../webpack.config.js                         |   0
 .../webpack.lib.config.js                     |   2 +-
 .../webpack.serve.config.js                   |   4 +-
 rush.json                                     |   2 +-
 36 files changed, 850 insertions(+), 147 deletions(-)
 rename packages/{office-ui-fabric-react-experiments => experiments}/.npmignore (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/.npmrc (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/.vscode/settings.json (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/CHANGELOG.json (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/CHANGELOG.md (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/LICENSE (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/README.md (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/config/api-extractor.json.disabled (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/gulpfile.js (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/index.html (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/jsconfig.json (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/karma.config.js (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/package.json (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/src/Link.ts (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/src/common/tests.js (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/src/components/Link/Link.Props.ts (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/src/components/Link/Link.scss (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/src/components/Link/Link.test.tsx (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/src/components/Link/Link.tsx (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/src/components/Link/LinkPage.tsx (91%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/src/components/Link/examples/Link.Basic.Example.tsx (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/src/components/Link/index.ts (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/src/demo/AppDefinition.tsx (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/src/demo/ColorStyles.scss (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/src/demo/GettingStartedPage.scss (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/src/demo/GettingStartedPage.tsx (98%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/src/demo/index.scss (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/src/demo/index.tsx (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/src/index.ts (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/tsconfig.json (92%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/tslint.json (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/webpack.config.js (100%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/webpack.lib.config.js (96%)
 rename packages/{office-ui-fabric-react-experiments => experiments}/webpack.serve.config.js (91%)

diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index f79ec3bed5dfb..c1ddee2792ec9 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -4,14 +4,14 @@
   "lockfileVersion": 1,
   "dependencies": {
     "@microsoft/api-extractor": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.3.1.tgz",
-      "integrity": "sha1-d65/YIwIY1K0/0M08RSXGo7Jr7o="
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.3.2.tgz",
+      "integrity": "sha1-pVZ78Y5vGuhNhjE5j0kzlMJeIdM="
     },
     "@microsoft/gulp-core-build": {
-      "version": "2.7.2",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.7.2.tgz",
-      "integrity": "sha1-wmouduFjUWQVpmgScsjY8UNqInM=",
+      "version": "2.9.2",
+      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.2.tgz",
+      "integrity": "sha1-mx/9pcjNJMZZv0AWUWUUQUztB7s=",
       "dependencies": {
         "@types/chai": {
           "version": "3.4.34",
@@ -156,9 +156,9 @@
       "integrity": "sha1-k9LYWMLwL+3wxZSKal4KQ8XjqCU="
     },
     "@microsoft/gulp-core-build-typescript": {
-      "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.3.1.tgz",
-      "integrity": "sha1-O3jI8rwoUku+08UzLsIwYhELS5g="
+      "version": "3.3.2",
+      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.3.2.tgz",
+      "integrity": "sha1-EH8TFHtgW28sUP6rYZTPp9+po4s="
     },
     "@microsoft/gulp-core-build-webpack": {
       "version": "1.1.6",
@@ -240,9 +240,9 @@
       }
     },
     "@microsoft/load-themed-styles": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.6.0.tgz",
-      "integrity": "sha1-/DziSXPvtyivjpLe058fF7pxi9Y="
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.0.tgz",
+      "integrity": "sha1-y2nzOhcQgKSt0ZUKE8W59RapUdI="
     },
     "@microsoft/loader-cased-file": {
       "version": "1.0.1",
@@ -334,6 +334,11 @@
           "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz",
           "integrity": "sha1-jBiPbjTC58Px0BJ9kI1aNuWmDck="
         },
+        "@types/semver": {
+          "version": "5.3.31",
+          "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.31.tgz",
+          "integrity": "sha1-uZnX2TX0P1IHsBsA094ghS9Mp18="
+        },
         "@types/yargs": {
           "version": "0.0.35",
           "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.35.tgz",
@@ -425,6 +430,11 @@
           "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.64.tgz",
           "integrity": "sha1-zckBQR9jAeFDff7SO8aPVEQuTcg="
         },
+        "@types/semver": {
+          "version": "5.3.31",
+          "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.31.tgz",
+          "integrity": "sha1-uZnX2TX0P1IHsBsA094ghS9Mp18="
+        },
         "acorn": {
           "version": "5.1.1",
           "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.1.1.tgz",
@@ -611,6 +621,11 @@
           "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz",
           "integrity": "sha1-jBiPbjTC58Px0BJ9kI1aNuWmDck="
         },
+        "@types/semver": {
+          "version": "5.3.31",
+          "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.31.tgz",
+          "integrity": "sha1-uZnX2TX0P1IHsBsA094ghS9Mp18="
+        },
         "findup-sync": {
           "version": "0.3.0",
           "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.3.0.tgz",
@@ -711,6 +726,11 @@
           "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz",
           "integrity": "sha1-jBiPbjTC58Px0BJ9kI1aNuWmDck="
         },
+        "@types/semver": {
+          "version": "5.3.31",
+          "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.31.tgz",
+          "integrity": "sha1-uZnX2TX0P1IHsBsA094ghS9Mp18="
+        },
         "ansi-align": {
           "version": "1.1.0",
           "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-1.1.0.tgz",
@@ -843,53 +863,53 @@
       "integrity": "sha1-fmBfGON9Pa9hQXd+zTLu34g4/ts="
     },
     "@microsoft/web-library-build": {
-      "version": "3.2.6",
-      "resolved": "https://registry.npmjs.org/@microsoft/web-library-build/-/web-library-build-3.2.6.tgz",
-      "integrity": "sha1-eQviy1300iCF3WhnHpkQZAYWSTk=",
+      "version": "3.2.8",
+      "resolved": "https://registry.npmjs.org/@microsoft/web-library-build/-/web-library-build-3.2.8.tgz",
+      "integrity": "sha1-Nu04s3YW+V7dAVh3WT+eiyJ5PYQ=",
       "dependencies": {
         "@microsoft/gulp-core-build": {
-          "version": "2.9.1",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.1.tgz",
-          "integrity": "sha1-WzSh8iziNCjdhe4knuoybjmEak0="
+          "version": "2.9.3",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.3.tgz",
+          "integrity": "sha1-HJbOC5DAUmm9jMurTY5VskofCVg="
         },
         "@microsoft/gulp-core-build-karma": {
-          "version": "2.3.6",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-karma/-/gulp-core-build-karma-2.3.6.tgz",
-          "integrity": "sha1-YS7r0CWQ16G7QTyqS54WAkw9bt4="
+          "version": "2.3.8",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-karma/-/gulp-core-build-karma-2.3.8.tgz",
+          "integrity": "sha1-MdsOvht/vxQzpmvGPwQFvAzNPVo="
         },
         "@microsoft/gulp-core-build-sass": {
-          "version": "3.2.4",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.2.4.tgz",
-          "integrity": "sha1-QsJ2WR5xG6+dGDhZ7aTqv04vaSo=",
+          "version": "3.2.5",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.2.5.tgz",
+          "integrity": "sha1-QlRZRLsO5A7KarTIu/p4gI8zfLg=",
           "dependencies": {
             "@microsoft/gulp-core-build": {
-              "version": "2.8.0",
-              "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.8.0.tgz",
-              "integrity": "sha1-4ZNBbueB7ZcgwvYOCZRfh5x0kgo="
+              "version": "2.9.2",
+              "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.2.tgz",
+              "integrity": "sha1-mx/9pcjNJMZZv0AWUWUUQUztB7s="
             }
           }
         },
         "@microsoft/gulp-core-build-serve": {
-          "version": "2.1.6",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-serve/-/gulp-core-build-serve-2.1.6.tgz",
-          "integrity": "sha1-+zyD8q95nR0Ufoj7WjM8kW9hJYY=",
+          "version": "2.1.7",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-serve/-/gulp-core-build-serve-2.1.7.tgz",
+          "integrity": "sha1-ZdM6YXuIlwKaHXkFDcxwvkICB9k=",
           "dependencies": {
             "@microsoft/gulp-core-build": {
-              "version": "2.9.0",
-              "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.0.tgz",
-              "integrity": "sha1-Muok4TP1d89dpVlqV3k6ztB/9W8="
+              "version": "2.9.2",
+              "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.2.tgz",
+              "integrity": "sha1-mx/9pcjNJMZZv0AWUWUUQUztB7s="
             }
           }
         },
         "@microsoft/gulp-core-build-webpack": {
-          "version": "1.2.3",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-webpack/-/gulp-core-build-webpack-1.2.3.tgz",
-          "integrity": "sha1-RsMPy71SC62KFbl9UtRw1FeWXsM=",
+          "version": "1.2.4",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-webpack/-/gulp-core-build-webpack-1.2.4.tgz",
+          "integrity": "sha1-VqV15cYESx7Q1yEUKD4Ixr2xY6Y=",
           "dependencies": {
             "@microsoft/gulp-core-build": {
-              "version": "2.9.0",
-              "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.0.tgz",
-              "integrity": "sha1-Muok4TP1d89dpVlqV3k6ztB/9W8="
+              "version": "2.9.2",
+              "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.2.tgz",
+              "integrity": "sha1-mx/9pcjNJMZZv0AWUWUUQUztB7s="
             }
           }
         },
@@ -903,11 +923,6 @@
           "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz",
           "integrity": "sha1-jBiPbjTC58Px0BJ9kI1aNuWmDck="
         },
-        "@types/semver": {
-          "version": "5.3.33",
-          "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.33.tgz",
-          "integrity": "sha512-UwrBgjsRS8BSsckIEdrAhIAmdh0MJidtKTvD3S6tpMq6qHLY3uGaNYcRDUjPxpF4hOAOEbMNSXhhfxmNHB1QNQ=="
-        },
         "autoprefixer": {
           "version": "6.3.7",
           "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz",
@@ -1054,7 +1069,7 @@
       }
     },
     "@rush-temp/example-app-base": {
-      "version": "file:projects/example-app-base",
+      "version": "file:projects\\example-app-base",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1128,6 +1143,10 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "loader-utils": {
+          "version": "0.2.17",
+          "bundled": true
+        },
         "mocha": {
           "version": "3.3.0",
           "bundled": true
@@ -1166,7 +1185,13 @@
           "dependencies": {
             "string_decoder": {
               "version": "1.0.3",
-              "bundled": true
+              "bundled": true,
+              "dependencies": {
+                "safe-buffer": {
+                  "version": "5.1.1",
+                  "bundled": true
+                }
+              }
             }
           }
         },
@@ -1203,11 +1228,15 @@
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.8",
+          "version": "0.2.7",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.3",
+          "version": "2.0.2",
+          "bundled": true
+        },
+        "typescript": {
+          "version": "2.4.2",
           "bundled": true
         },
         "url": {
@@ -1231,9 +1260,13 @@
           }
         },
         "webpack": {
-          "version": "3.5.1",
+          "version": "3.4.1",
           "bundled": true,
           "dependencies": {
+            "ajv": {
+              "version": "5.2.2",
+              "bundled": true
+            },
             "async": {
               "version": "2.5.0",
               "bundled": true
@@ -1281,7 +1314,7 @@
       }
     },
     "@rush-temp/experiments": {
-      "version": "file:projects/experiments",
+      "version": "file:projects\\experiments",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1389,8 +1422,7 @@
           "dependencies": {
             "string_decoder": {
               "version": "1.0.3",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-              "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
+              "bundled": true
             }
           }
         },
@@ -1431,7 +1463,7 @@
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.4",
+          "version": "2.0.3",
           "bundled": true
         },
         "url": {
@@ -1440,8 +1472,7 @@
           "dependencies": {
             "punycode": {
               "version": "1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
-              "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
+              "bundled": true
             }
           }
         },
@@ -1451,39 +1482,33 @@
           "dependencies": {
             "async": {
               "version": "2.5.0",
-              "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
-              "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw=="
+              "bundled": true
             }
           }
         },
         "webpack": {
-          "version": "3.5.4",
+          "version": "3.4.1",
           "bundled": true,
           "dependencies": {
             "async": {
               "version": "2.5.0",
-              "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
-              "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw=="
+              "bundled": true
             },
             "has-flag": {
               "version": "2.0.0",
-              "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
-              "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
+              "bundled": true
             },
             "loader-utils": {
               "version": "1.1.0",
-              "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
-              "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
+              "bundled": true
             },
             "source-map": {
               "version": "0.5.6",
-              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz",
-              "integrity": "sha1-dc449SvwczxafwwRjYEzSiu19BI="
+              "bundled": true
             },
             "supports-color": {
               "version": "4.2.1",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
-              "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
+              "bundled": true
             }
           }
         },
@@ -1493,8 +1518,7 @@
           "dependencies": {
             "source-map": {
               "version": "0.5.6",
-              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz",
-              "integrity": "sha1-dc449SvwczxafwwRjYEzSiu19BI="
+              "bundled": true
             }
           }
         },
@@ -1513,8 +1537,12 @@
       }
     },
     "@rush-temp/fabric-website": {
-      "version": "file:projects/fabric-website",
+      "version": "file:projects\\fabric-website",
       "dependencies": {
+        "@types/react": {
+          "version": "15.0.38",
+          "bundled": true
+        },
         "@types/react-addons-test-utils": {
           "version": "0.14.19",
           "bundled": true
@@ -1540,7 +1568,7 @@
           "bundled": true
         },
         "camelcase": {
-          "version": "3.0.0",
+          "version": "4.1.0",
           "bundled": true
         },
         "commander": {
@@ -1556,7 +1584,7 @@
           "bundled": true
         },
         "debug": {
-          "version": "2.6.8",
+          "version": "2.6.0",
           "bundled": true
         },
         "diff": {
@@ -1575,6 +1603,10 @@
           "version": "7.1.1",
           "bundled": true
         },
+        "highlight.js": {
+          "version": "9.11.0",
+          "bundled": true
+        },
         "https-browserify": {
           "version": "0.0.1",
           "bundled": true
@@ -1591,8 +1623,16 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "loader-utils": {
+          "version": "0.2.17",
+          "bundled": true
+        },
         "mocha": {
-          "version": "3.5.0",
+          "version": "3.3.0",
+          "bundled": true
+        },
+        "ms": {
+          "version": "0.7.2",
           "bundled": true
         },
         "node-libs-browser": {
@@ -1669,6 +1709,10 @@
           "version": "2.0.3",
           "bundled": true
         },
+        "typescript": {
+          "version": "2.4.2",
+          "bundled": true
+        },
         "url": {
           "version": "0.11.0",
           "bundled": true,
@@ -1697,10 +1741,6 @@
               "version": "2.5.0",
               "bundled": true
             },
-            "camelcase": {
-              "version": "4.1.0",
-              "bundled": true
-            },
             "has-flag": {
               "version": "2.0.0",
               "bundled": true
@@ -1716,14 +1756,6 @@
             "supports-color": {
               "version": "4.2.1",
               "bundled": true
-            },
-            "yargs": {
-              "version": "8.0.2",
-              "bundled": true
-            },
-            "yargs-parser": {
-              "version": "7.0.0",
-              "bundled": true
             }
           }
         },
@@ -1742,17 +1774,17 @@
           "bundled": true
         },
         "yargs": {
-          "version": "6.6.0",
+          "version": "8.0.2",
           "bundled": true
         },
         "yargs-parser": {
-          "version": "4.2.1",
+          "version": "7.0.0",
           "bundled": true
         }
       }
     },
     "@rush-temp/office-ui-fabric-react": {
-      "version": "file:projects/office-ui-fabric-react",
+      "version": "file:projects\\office-ui-fabric-react",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1791,7 +1823,7 @@
           "bundled": true
         },
         "debug": {
-          "version": "2.6.8",
+          "version": "2.6.0",
           "bundled": true
         },
         "diff": {
@@ -1810,6 +1842,10 @@
           "version": "7.1.1",
           "bundled": true
         },
+        "has-flag": {
+          "version": "2.0.0",
+          "bundled": true
+        },
         "https-browserify": {
           "version": "0.0.1",
           "bundled": true
@@ -1826,8 +1862,26 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "loader-utils": {
+          "version": "0.2.17",
+          "bundled": true
+        },
         "mocha": {
-          "version": "3.5.0",
+          "version": "3.4.2",
+          "bundled": true,
+          "dependencies": {
+            "has-flag": {
+              "version": "1.0.0",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "3.1.2",
+              "bundled": true
+            }
+          }
+        },
+        "ms": {
+          "version": "0.7.2",
           "bundled": true
         },
         "node-libs-browser": {
@@ -1858,12 +1912,20 @@
           "version": "2.3.3",
           "bundled": true,
           "dependencies": {
+            "safe-buffer": {
+              "version": "5.1.1",
+              "bundled": true
+            },
             "string_decoder": {
               "version": "1.0.3",
               "bundled": true
             }
           }
         },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "bundled": true
+        },
         "source-list-map": {
           "version": "2.0.0",
           "bundled": true
@@ -1893,15 +1955,19 @@
           "bundled": true
         },
         "supports-color": {
-          "version": "3.1.2",
+          "version": "4.2.1",
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.8",
+          "version": "0.2.7",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.3",
+          "version": "2.0.2",
+          "bundled": true
+        },
+        "typescript": {
+          "version": "2.4.2",
           "bundled": true
         },
         "url": {
@@ -1925,15 +1991,15 @@
           }
         },
         "webpack": {
-          "version": "3.5.1",
+          "version": "3.4.1",
           "bundled": true,
           "dependencies": {
-            "async": {
-              "version": "2.5.0",
+            "ajv": {
+              "version": "5.2.2",
               "bundled": true
             },
-            "has-flag": {
-              "version": "2.0.0",
+            "async": {
+              "version": "2.5.0",
               "bundled": true
             },
             "loader-utils": {
@@ -1943,10 +2009,6 @@
             "source-map": {
               "version": "0.5.6",
               "bundled": true
-            },
-            "supports-color": {
-              "version": "4.2.1",
-              "bundled": true
             }
           }
         },
@@ -1975,10 +2037,10 @@
       }
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
-      "version": "file:projects/office-ui-fabric-react-tslint"
+      "version": "file:projects\\office-ui-fabric-react-tslint"
     },
     "@rush-temp/ssr-tests": {
-      "version": "file:projects/ssr-tests",
+      "version": "file:projects\\ssr-tests",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -2092,12 +2154,20 @@
           "version": "2.3.3",
           "bundled": true,
           "dependencies": {
+            "safe-buffer": {
+              "version": "5.1.1",
+              "bundled": true
+            },
             "string_decoder": {
               "version": "1.0.3",
               "bundled": true
             }
           }
         },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "bundled": true
+        },
         "source-list-map": {
           "version": "2.0.0",
           "bundled": true
@@ -2123,11 +2193,11 @@
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.8",
+          "version": "0.2.7",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.3",
+          "version": "2.0.2",
           "bundled": true
         },
         "url": {
@@ -2145,13 +2215,21 @@
           "bundled": true
         },
         "webpack": {
-          "version": "3.5.1",
+          "version": "3.4.1",
           "bundled": true,
           "dependencies": {
+            "ajv": {
+              "version": "5.2.2",
+              "bundled": true
+            },
             "has-flag": {
               "version": "2.0.0",
               "bundled": true
             },
+            "loader-utils": {
+              "version": "1.1.0",
+              "bundled": true
+            },
             "supports-color": {
               "version": "4.2.1",
               "bundled": true
@@ -2177,8 +2255,12 @@
       }
     },
     "@rush-temp/styling": {
-      "version": "file:projects/styling",
+      "version": "file:projects\\styling",
       "dependencies": {
+        "@uifabric/utilities": {
+          "version": "1.10.4",
+          "bundled": true
+        },
         "acorn": {
           "version": "5.1.1",
           "bundled": true
@@ -2216,7 +2298,7 @@
           "bundled": true
         },
         "debug": {
-          "version": "2.6.8",
+          "version": "2.6.0",
           "bundled": true
         },
         "diff": {
@@ -2235,6 +2317,10 @@
           "version": "7.1.1",
           "bundled": true
         },
+        "has-flag": {
+          "version": "2.0.0",
+          "bundled": true
+        },
         "https-browserify": {
           "version": "0.0.1",
           "bundled": true
@@ -2251,14 +2337,36 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "loader-utils": {
+          "version": "0.2.17",
+          "bundled": true
+        },
         "mocha": {
-          "version": "3.5.0",
+          "version": "3.4.2",
+          "bundled": true,
+          "dependencies": {
+            "has-flag": {
+              "version": "1.0.0",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "3.1.2",
+              "bundled": true
+            }
+          }
+        },
+        "ms": {
+          "version": "0.7.2",
           "bundled": true
         },
         "node-libs-browser": {
           "version": "2.0.0",
           "bundled": true
         },
+        "office-ui-fabric-react": {
+          "version": "2.34.2",
+          "bundled": true
+        },
         "os-browserify": {
           "version": "0.2.1",
           "bundled": true
@@ -2283,12 +2391,20 @@
           "version": "2.3.3",
           "bundled": true,
           "dependencies": {
+            "safe-buffer": {
+              "version": "5.1.1",
+              "bundled": true
+            },
             "string_decoder": {
               "version": "1.0.3",
               "bundled": true
             }
           }
         },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "bundled": true
+        },
         "source-list-map": {
           "version": "2.0.0",
           "bundled": true
@@ -2318,15 +2434,19 @@
           "bundled": true
         },
         "supports-color": {
-          "version": "3.1.2",
+          "version": "4.2.1",
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.8",
+          "version": "0.2.7",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.3",
+          "version": "2.0.2",
+          "bundled": true
+        },
+        "typescript": {
+          "version": "2.4.2",
           "bundled": true
         },
         "url": {
@@ -2350,15 +2470,15 @@
           }
         },
         "webpack": {
-          "version": "3.5.1",
+          "version": "3.4.1",
           "bundled": true,
           "dependencies": {
-            "async": {
-              "version": "2.5.0",
+            "ajv": {
+              "version": "5.2.2",
               "bundled": true
             },
-            "has-flag": {
-              "version": "2.0.0",
+            "async": {
+              "version": "2.5.0",
               "bundled": true
             },
             "loader-utils": {
@@ -2368,10 +2488,6 @@
             "source-map": {
               "version": "0.5.6",
               "bundled": true
-            },
-            "supports-color": {
-              "version": "4.2.1",
-              "bundled": true
             }
           }
         },
@@ -2400,7 +2516,7 @@
       }
     },
     "@rush-temp/test-bundle-button": {
-      "version": "file:projects/test-bundle-button",
+      "version": "file:projects\\test-bundle-button",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -2462,6 +2578,10 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "loader-utils": {
+          "version": "0.2.17",
+          "bundled": true
+        },
         "node-libs-browser": {
           "version": "2.0.0",
           "bundled": true
@@ -2529,11 +2649,15 @@
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.8",
+          "version": "0.2.7",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.3",
+          "version": "2.0.2",
+          "bundled": true
+        },
+        "typescript": {
+          "version": "2.4.2",
           "bundled": true
         },
         "url": {
@@ -2557,9 +2681,17 @@
           }
         },
         "webpack": {
-          "version": "3.5.1",
+          "version": "3.4.1",
           "bundled": true,
           "dependencies": {
+            "ajv": {
+              "version": "5.2.2",
+              "bundled": true
+            },
+            "ajv-keywords": {
+              "version": "2.1.0",
+              "bundled": true
+            },
             "async": {
               "version": "2.5.0",
               "bundled": true
@@ -2568,9 +2700,23 @@
               "version": "1.1.0",
               "bundled": true
             },
+            "source-list-map": {
+              "version": "2.0.0",
+              "bundled": true
+            },
             "source-map": {
               "version": "0.5.6",
               "bundled": true
+            },
+            "webpack-sources": {
+              "version": "1.0.1",
+              "bundled": true,
+              "dependencies": {
+                "source-list-map": {
+                  "version": "2.0.0",
+                  "bundled": true
+                }
+              }
             }
           }
         },
@@ -2599,10 +2745,16 @@
       }
     },
     "@rush-temp/todo-app": {
-      "version": "file:projects/todo-app"
+      "version": "file:projects\\todo-app",
+      "dependencies": {
+        "typescript": {
+          "version": "2.4.2",
+          "bundled": true
+        }
+      }
     },
     "@rush-temp/utilities": {
-      "version": "file:projects/utilities",
+      "version": "file:projects\\utilities",
       "dependencies": {
         "async": {
           "version": "0.9.2",
@@ -2624,6 +2776,10 @@
           "version": "7.1.1",
           "bundled": true
         },
+        "loader-utils": {
+          "version": "0.2.17",
+          "bundled": true
+        },
         "mocha": {
           "version": "3.3.0",
           "bundled": true
@@ -2643,6 +2799,10 @@
         "supports-color": {
           "version": "3.1.2",
           "bundled": true
+        },
+        "typescript": {
+          "version": "2.4.2",
+          "bundled": true
         }
       }
     },
@@ -2767,9 +2927,9 @@
       "integrity": "sha512-rek8twk9C58gHYqIrUlJsx8NQMhlxqHzln9Z9ODqiNgv3/s+ZwIrfr+djqzsnVM12xe9hL98iJ20lj2RvCBv6A=="
     },
     "@types/minimatch": {
-      "version": "2.0.29",
-      "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-2.0.29.tgz",
-      "integrity": "sha1-UALhT3Xi1x5WQoHfBDHIwbSio2o="
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.0.tgz",
+      "integrity": "sha512-BnRgLPs1oy9gV8b4dAW8jilIa7Kpe3uNucAvv4RkY7Yt6rj9E6Kk4Qa/18LOSinA+XDBPdzx3MqYPEP5mw8rDA=="
     },
     "@types/mocha": {
       "version": "2.2.39",
@@ -2837,9 +2997,9 @@
       "integrity": "sha1-VWJRm8eWPKyoq/fxKMrjtZTUHQY="
     },
     "@types/semver": {
-      "version": "5.3.31",
-      "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.31.tgz",
-      "integrity": "sha1-uZnX2TX0P1IHsBsA094ghS9Mp18="
+      "version": "5.3.33",
+      "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.33.tgz",
+      "integrity": "sha512-UwrBgjsRS8BSsckIEdrAhIAmdh0MJidtKTvD3S6tpMq6qHLY3uGaNYcRDUjPxpF4hOAOEbMNSXhhfxmNHB1QNQ=="
     },
     "@types/serve-static": {
       "version": "1.7.31",
@@ -5159,6 +5319,549 @@
       "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
       "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
     },
+    "fsevents": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.2.tgz",
+      "integrity": "sha512-Sn44E5wQW4bTHXvQmvSHwqbuiXtduD6Rrjm2ZtUEGbyrig+nUH3t/QD4M4/ZXViY556TBpRgZkHLDx3JxPwxiw==",
+      "optional": true,
+      "dependencies": {
+        "abbrev": {
+          "version": "1.1.0",
+          "bundled": true,
+          "optional": true
+        },
+        "ajv": {
+          "version": "4.11.8",
+          "bundled": true,
+          "optional": true
+        },
+        "ansi-regex": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "aproba": {
+          "version": "1.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "are-we-there-yet": {
+          "version": "1.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "asn1": {
+          "version": "0.2.3",
+          "bundled": true,
+          "optional": true
+        },
+        "assert-plus": {
+          "version": "0.2.0",
+          "bundled": true,
+          "optional": true
+        },
+        "asynckit": {
+          "version": "0.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "aws-sign2": {
+          "version": "0.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "aws4": {
+          "version": "1.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "balanced-match": {
+          "version": "0.4.2",
+          "bundled": true
+        },
+        "bcrypt-pbkdf": {
+          "version": "1.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "block-stream": {
+          "version": "0.0.9",
+          "bundled": true
+        },
+        "boom": {
+          "version": "2.10.1",
+          "bundled": true
+        },
+        "brace-expansion": {
+          "version": "1.1.7",
+          "bundled": true
+        },
+        "buffer-shims": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "caseless": {
+          "version": "0.12.0",
+          "bundled": true,
+          "optional": true
+        },
+        "co": {
+          "version": "4.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "code-point-at": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "combined-stream": {
+          "version": "1.0.5",
+          "bundled": true
+        },
+        "concat-map": {
+          "version": "0.0.1",
+          "bundled": true
+        },
+        "console-control-strings": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "core-util-is": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "cryptiles": {
+          "version": "2.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "dashdash": {
+          "version": "1.14.1",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "debug": {
+          "version": "2.6.8",
+          "bundled": true,
+          "optional": true
+        },
+        "deep-extend": {
+          "version": "0.4.2",
+          "bundled": true,
+          "optional": true
+        },
+        "delayed-stream": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "delegates": {
+          "version": "1.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "ecc-jsbn": {
+          "version": "0.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "extend": {
+          "version": "3.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "extsprintf": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "forever-agent": {
+          "version": "0.6.1",
+          "bundled": true,
+          "optional": true
+        },
+        "form-data": {
+          "version": "2.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "fs.realpath": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "fstream": {
+          "version": "1.0.11",
+          "bundled": true
+        },
+        "fstream-ignore": {
+          "version": "1.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "gauge": {
+          "version": "2.7.4",
+          "bundled": true,
+          "optional": true
+        },
+        "getpass": {
+          "version": "0.1.7",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "glob": {
+          "version": "7.1.2",
+          "bundled": true
+        },
+        "graceful-fs": {
+          "version": "4.1.11",
+          "bundled": true
+        },
+        "har-schema": {
+          "version": "1.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "har-validator": {
+          "version": "4.2.1",
+          "bundled": true,
+          "optional": true
+        },
+        "has-unicode": {
+          "version": "2.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "hawk": {
+          "version": "3.1.3",
+          "bundled": true,
+          "optional": true
+        },
+        "hoek": {
+          "version": "2.16.3",
+          "bundled": true
+        },
+        "http-signature": {
+          "version": "1.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "inflight": {
+          "version": "1.0.6",
+          "bundled": true
+        },
+        "inherits": {
+          "version": "2.0.3",
+          "bundled": true
+        },
+        "ini": {
+          "version": "1.3.4",
+          "bundled": true,
+          "optional": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "is-typedarray": {
+          "version": "1.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "isstream": {
+          "version": "0.1.2",
+          "bundled": true,
+          "optional": true
+        },
+        "jodid25519": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "jsbn": {
+          "version": "0.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "json-schema": {
+          "version": "0.2.3",
+          "bundled": true,
+          "optional": true
+        },
+        "json-stable-stringify": {
+          "version": "1.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "json-stringify-safe": {
+          "version": "5.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "jsonify": {
+          "version": "0.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "jsprim": {
+          "version": "1.4.0",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "mime-db": {
+          "version": "1.27.0",
+          "bundled": true
+        },
+        "mime-types": {
+          "version": "2.1.15",
+          "bundled": true
+        },
+        "minimatch": {
+          "version": "3.0.4",
+          "bundled": true
+        },
+        "minimist": {
+          "version": "0.0.8",
+          "bundled": true
+        },
+        "mkdirp": {
+          "version": "0.5.1",
+          "bundled": true
+        },
+        "ms": {
+          "version": "2.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "node-pre-gyp": {
+          "version": "0.6.36",
+          "bundled": true,
+          "optional": true
+        },
+        "nopt": {
+          "version": "4.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "npmlog": {
+          "version": "4.1.0",
+          "bundled": true,
+          "optional": true
+        },
+        "number-is-nan": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "oauth-sign": {
+          "version": "0.8.2",
+          "bundled": true,
+          "optional": true
+        },
+        "object-assign": {
+          "version": "4.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "once": {
+          "version": "1.4.0",
+          "bundled": true
+        },
+        "os-homedir": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "os-tmpdir": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "osenv": {
+          "version": "0.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "path-is-absolute": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "performance-now": {
+          "version": "0.2.0",
+          "bundled": true,
+          "optional": true
+        },
+        "process-nextick-args": {
+          "version": "1.0.7",
+          "bundled": true
+        },
+        "punycode": {
+          "version": "1.4.1",
+          "bundled": true,
+          "optional": true
+        },
+        "qs": {
+          "version": "6.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "rc": {
+          "version": "1.2.1",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "minimist": {
+              "version": "1.2.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "bundled": true
+        },
+        "request": {
+          "version": "2.81.0",
+          "bundled": true,
+          "optional": true
+        },
+        "rimraf": {
+          "version": "2.6.1",
+          "bundled": true
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "bundled": true
+        },
+        "semver": {
+          "version": "5.3.0",
+          "bundled": true,
+          "optional": true
+        },
+        "set-blocking": {
+          "version": "2.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "signal-exit": {
+          "version": "3.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "sntp": {
+          "version": "1.0.9",
+          "bundled": true,
+          "optional": true
+        },
+        "sshpk": {
+          "version": "1.13.0",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "string_decoder": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "string-width": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "stringstream": {
+          "version": "0.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "strip-ansi": {
+          "version": "3.0.1",
+          "bundled": true
+        },
+        "strip-json-comments": {
+          "version": "2.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "tar": {
+          "version": "2.2.1",
+          "bundled": true
+        },
+        "tar-pack": {
+          "version": "3.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "tough-cookie": {
+          "version": "2.3.2",
+          "bundled": true,
+          "optional": true
+        },
+        "tunnel-agent": {
+          "version": "0.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "tweetnacl": {
+          "version": "0.14.5",
+          "bundled": true,
+          "optional": true
+        },
+        "uid-number": {
+          "version": "0.0.6",
+          "bundled": true,
+          "optional": true
+        },
+        "util-deprecate": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "uuid": {
+          "version": "3.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "verror": {
+          "version": "1.3.6",
+          "bundled": true,
+          "optional": true
+        },
+        "wide-align": {
+          "version": "1.1.2",
+          "bundled": true,
+          "optional": true
+        },
+        "wrappy": {
+          "version": "1.0.2",
+          "bundled": true
+        }
+      }
+    },
     "fstream": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
@@ -8151,9 +8854,9 @@
       "integrity": "sha1-JKwXdDPkou6REP5DWAutBZ+gBQk="
     },
     "office-ui-fabric-react": {
-      "version": "4.32.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.32.0.tgz",
-      "integrity": "sha512-0P7OgvX2rI+BjCYSqhG2yKrmlTSC9pQrus1RZZecb4dKRPLxZ0qqngh6MtsUwqPrWmCG8qf1yPfnsWvO5+jd+g=="
+      "version": "4.33.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.33.0.tgz",
+      "integrity": "sha512-wgPdX4jU+GFcselCpEtSAfBnyDzVH0Hg5WnVhW08XUQM9nuT92DKfVoxq3BfL/6164DG7yIbVVTzfgD2aJWjGw=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -11335,4 +12038,4 @@
       "integrity": "sha1-RCs4+denr3rke/z8NWhz6GFq0bc="
     }
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react-experiments/.npmignore b/packages/experiments/.npmignore
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/.npmignore
rename to packages/experiments/.npmignore
diff --git a/packages/office-ui-fabric-react-experiments/.npmrc b/packages/experiments/.npmrc
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/.npmrc
rename to packages/experiments/.npmrc
diff --git a/packages/office-ui-fabric-react-experiments/.vscode/settings.json b/packages/experiments/.vscode/settings.json
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/.vscode/settings.json
rename to packages/experiments/.vscode/settings.json
diff --git a/packages/office-ui-fabric-react-experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/CHANGELOG.json
rename to packages/experiments/CHANGELOG.json
diff --git a/packages/office-ui-fabric-react-experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/CHANGELOG.md
rename to packages/experiments/CHANGELOG.md
diff --git a/packages/office-ui-fabric-react-experiments/LICENSE b/packages/experiments/LICENSE
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/LICENSE
rename to packages/experiments/LICENSE
diff --git a/packages/office-ui-fabric-react-experiments/README.md b/packages/experiments/README.md
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/README.md
rename to packages/experiments/README.md
diff --git a/packages/office-ui-fabric-react-experiments/config/api-extractor.json.disabled b/packages/experiments/config/api-extractor.json.disabled
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/config/api-extractor.json.disabled
rename to packages/experiments/config/api-extractor.json.disabled
diff --git a/packages/office-ui-fabric-react-experiments/gulpfile.js b/packages/experiments/gulpfile.js
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/gulpfile.js
rename to packages/experiments/gulpfile.js
diff --git a/packages/office-ui-fabric-react-experiments/index.html b/packages/experiments/index.html
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/index.html
rename to packages/experiments/index.html
diff --git a/packages/office-ui-fabric-react-experiments/jsconfig.json b/packages/experiments/jsconfig.json
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/jsconfig.json
rename to packages/experiments/jsconfig.json
diff --git a/packages/office-ui-fabric-react-experiments/karma.config.js b/packages/experiments/karma.config.js
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/karma.config.js
rename to packages/experiments/karma.config.js
diff --git a/packages/office-ui-fabric-react-experiments/package.json b/packages/experiments/package.json
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/package.json
rename to packages/experiments/package.json
diff --git a/packages/office-ui-fabric-react-experiments/src/Link.ts b/packages/experiments/src/Link.ts
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/src/Link.ts
rename to packages/experiments/src/Link.ts
diff --git a/packages/office-ui-fabric-react-experiments/src/common/tests.js b/packages/experiments/src/common/tests.js
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/src/common/tests.js
rename to packages/experiments/src/common/tests.js
diff --git a/packages/office-ui-fabric-react-experiments/src/components/Link/Link.Props.ts b/packages/experiments/src/components/Link/Link.Props.ts
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/src/components/Link/Link.Props.ts
rename to packages/experiments/src/components/Link/Link.Props.ts
diff --git a/packages/office-ui-fabric-react-experiments/src/components/Link/Link.scss b/packages/experiments/src/components/Link/Link.scss
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/src/components/Link/Link.scss
rename to packages/experiments/src/components/Link/Link.scss
diff --git a/packages/office-ui-fabric-react-experiments/src/components/Link/Link.test.tsx b/packages/experiments/src/components/Link/Link.test.tsx
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/src/components/Link/Link.test.tsx
rename to packages/experiments/src/components/Link/Link.test.tsx
diff --git a/packages/office-ui-fabric-react-experiments/src/components/Link/Link.tsx b/packages/experiments/src/components/Link/Link.tsx
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/src/components/Link/Link.tsx
rename to packages/experiments/src/components/Link/Link.tsx
diff --git a/packages/office-ui-fabric-react-experiments/src/components/Link/LinkPage.tsx b/packages/experiments/src/components/Link/LinkPage.tsx
similarity index 91%
rename from packages/office-ui-fabric-react-experiments/src/components/Link/LinkPage.tsx
rename to packages/experiments/src/components/Link/LinkPage.tsx
index 8b120691da096..1908aced7c208 100644
--- a/packages/office-ui-fabric-react-experiments/src/components/Link/LinkPage.tsx
+++ b/packages/experiments/src/components/Link/LinkPage.tsx
@@ -7,7 +7,7 @@ import {
 } from '@uifabric/example-app-base';
 import { LinkBasicExample } from './examples/Link.Basic.Example';
 
-let LinkBasicExampleCode = require('!raw-loader!office-ui-fabric-react-experiments/src/components/Link/examples/Link.Basic.Example.tsx') as string;
+let LinkBasicExampleCode = require('!raw-loader!experiments/src/components/Link/examples/Link.Basic.Example.tsx') as string;
 
 export class LinkPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
@@ -23,7 +23,7 @@ export class LinkPage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react-experiments/src/components/Link/Link.Props.ts')
+              require<string>('!raw-loader!experiments/src/components/Link/Link.Props.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react-experiments/src/components/Link/examples/Link.Basic.Example.tsx b/packages/experiments/src/components/Link/examples/Link.Basic.Example.tsx
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/src/components/Link/examples/Link.Basic.Example.tsx
rename to packages/experiments/src/components/Link/examples/Link.Basic.Example.tsx
diff --git a/packages/office-ui-fabric-react-experiments/src/components/Link/index.ts b/packages/experiments/src/components/Link/index.ts
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/src/components/Link/index.ts
rename to packages/experiments/src/components/Link/index.ts
diff --git a/packages/office-ui-fabric-react-experiments/src/demo/AppDefinition.tsx b/packages/experiments/src/demo/AppDefinition.tsx
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/src/demo/AppDefinition.tsx
rename to packages/experiments/src/demo/AppDefinition.tsx
diff --git a/packages/office-ui-fabric-react-experiments/src/demo/ColorStyles.scss b/packages/experiments/src/demo/ColorStyles.scss
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/src/demo/ColorStyles.scss
rename to packages/experiments/src/demo/ColorStyles.scss
diff --git a/packages/office-ui-fabric-react-experiments/src/demo/GettingStartedPage.scss b/packages/experiments/src/demo/GettingStartedPage.scss
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/src/demo/GettingStartedPage.scss
rename to packages/experiments/src/demo/GettingStartedPage.scss
diff --git a/packages/office-ui-fabric-react-experiments/src/demo/GettingStartedPage.tsx b/packages/experiments/src/demo/GettingStartedPage.tsx
similarity index 98%
rename from packages/office-ui-fabric-react-experiments/src/demo/GettingStartedPage.tsx
rename to packages/experiments/src/demo/GettingStartedPage.tsx
index b77c7cef01bef..d77576eaba971 100644
--- a/packages/office-ui-fabric-react-experiments/src/demo/GettingStartedPage.tsx
+++ b/packages/experiments/src/demo/GettingStartedPage.tsx
@@ -9,7 +9,7 @@ export class GettingStartedPage extends React.Component<any, any> {
       <div className='ms-GettingStartedPage'>
 
         <div className='ms-GettingStartedPage-banner'>
-          <h1>office-ui-fabric-react-experiments!</h1>
+          <h1>Office UI Fabric React Experiments!</h1>
           <h3>A library of reusable, generic React components</h3>
         </div>
 
diff --git a/packages/office-ui-fabric-react-experiments/src/demo/index.scss b/packages/experiments/src/demo/index.scss
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/src/demo/index.scss
rename to packages/experiments/src/demo/index.scss
diff --git a/packages/office-ui-fabric-react-experiments/src/demo/index.tsx b/packages/experiments/src/demo/index.tsx
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/src/demo/index.tsx
rename to packages/experiments/src/demo/index.tsx
diff --git a/packages/office-ui-fabric-react-experiments/src/index.ts b/packages/experiments/src/index.ts
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/src/index.ts
rename to packages/experiments/src/index.ts
diff --git a/packages/office-ui-fabric-react-experiments/tsconfig.json b/packages/experiments/tsconfig.json
similarity index 92%
rename from packages/office-ui-fabric-react-experiments/tsconfig.json
rename to packages/experiments/tsconfig.json
index 5fec2b5f064db..9dd90f46d52e1 100644
--- a/packages/office-ui-fabric-react-experiments/tsconfig.json
+++ b/packages/experiments/tsconfig.json
@@ -22,7 +22,7 @@
       "webpack-env"
     ],
     "paths": {
-      "office-ui-fabric-react-experiments/lib/*": [
+      "experiments/lib/*": [
         "./src/*"
       ]
     }
diff --git a/packages/office-ui-fabric-react-experiments/tslint.json b/packages/experiments/tslint.json
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/tslint.json
rename to packages/experiments/tslint.json
diff --git a/packages/office-ui-fabric-react-experiments/webpack.config.js b/packages/experiments/webpack.config.js
similarity index 100%
rename from packages/office-ui-fabric-react-experiments/webpack.config.js
rename to packages/experiments/webpack.config.js
diff --git a/packages/office-ui-fabric-react-experiments/webpack.lib.config.js b/packages/experiments/webpack.lib.config.js
similarity index 96%
rename from packages/office-ui-fabric-react-experiments/webpack.lib.config.js
rename to packages/experiments/webpack.lib.config.js
index d6ef0f412c14f..3e959f22f78fb 100644
--- a/packages/office-ui-fabric-react-experiments/webpack.lib.config.js
+++ b/packages/experiments/webpack.lib.config.js
@@ -8,7 +8,7 @@ let path = require('path');
 let buildConfig = build.getConfig();
 let BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
 
-const BUNDLE_NAME = 'office-ui-fabric-react-experiments';
+const BUNDLE_NAME = 'experiments';
 const BUNDLE_TEST = 'fabric-test';
 const IS_PRODUCTION = process.argv.indexOf('--production') > -1;
 
diff --git a/packages/office-ui-fabric-react-experiments/webpack.serve.config.js b/packages/experiments/webpack.serve.config.js
similarity index 91%
rename from packages/office-ui-fabric-react-experiments/webpack.serve.config.js
rename to packages/experiments/webpack.serve.config.js
index d0f412d2ca3b7..4af8bb2dfd4bd 100644
--- a/packages/office-ui-fabric-react-experiments/webpack.serve.config.js
+++ b/packages/experiments/webpack.serve.config.js
@@ -18,8 +18,8 @@ module.exports = {
 
   resolve: {
     alias: {
-      'office-ui-fabric-react-experiments/src': path.join(__dirname, 'src'),
-      'office-ui-fabric-react-experiments/lib': path.join(__dirname, 'src'),
+      'experiments/src': path.join(__dirname, 'src'),
+      'experiments/lib': path.join(__dirname, 'src'),
       'Props.ts.js': 'Props',
       'Example.tsx.js': 'Example'
     },
diff --git a/rush.json b/rush.json
index eb5f639411940..5443f5216968f 100644
--- a/rush.json
+++ b/rush.json
@@ -12,7 +12,7 @@
     },
     {
       "packageName": "@uifabric/experiments",
-      "projectFolder": "packages/office-ui-fabric-react-experiments",
+      "projectFolder": "packages/experiments",
       "shouldPublish": true
     },
     {

From 408bddf8bc49210e6a904dd9607fc522370ff6a8 Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Tue, 15 Aug 2017 17:02:47 -0700
Subject: [PATCH 0424/1641] Enhancement: calendar overlay enhancement (#2397)

* Calendar/Month picker 1 column overlay testing

* Calendar styles for overlayed calendar and month picker

* Updating calendar styles for calendar / month picker overlay

* scss name change

* Adding accessibility support

* Fixing test errors

* Fixing test errors

* Adding change request file

* Updates to css

* Removed additional dependencies from JSON file

* Fixing spelling errors

* no message

* no message

* Making updates based on PR feedback.  There are a few more items to fix still.

* Adding missing semicolons and updating some css.  More css updates to come.

* no message

* Changing css back to 40px from $Calendar-day. Sass variable not working right...

* Css updated

* css updates

* Css updates.  The header for the month picker was nested differently than the header for the day picker, this was causing inconsistent styling.

* no message

* Updates in progress...

* PR updates

* Ran gulp test and resolved errors

* Updating PR

* Update package.json

removing extra dependencies
---
 ...arOverlayEnhancement_2017-08-04-17-25.json |   11 +
 package-lock.json                             | 3009 +++++++++++++++++
 package.json                                  |    2 +-
 .../src/components/Calendar/Calendar.Props.ts |   16 +
 .../src/components/Calendar/Calendar.scss     |   95 +-
 .../src/components/Calendar/Calendar.tsx      |   43 +-
 .../src/components/Calendar/CalendarDay.tsx   |   56 +-
 .../src/components/Calendar/CalendarMonth.tsx |  100 +-
 .../src/components/Calendar/CalendarPage.tsx  |   12 +-
 .../examples/Calendar.Inline.Example.tsx      |    4 +-
 10 files changed, 3285 insertions(+), 63 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-CalendarOverlayEnhancement_2017-08-04-17-25.json
 create mode 100644 package-lock.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-CalendarOverlayEnhancement_2017-08-04-17-25.json b/common/changes/office-ui-fabric-react/kegorr-CalendarOverlayEnhancement_2017-08-04-17-25.json
new file mode 100644
index 0000000000000..77a7e42dce26a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-CalendarOverlayEnhancement_2017-08-04-17-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Enhancing the calendar component.  Created option to have month picker overlayed on top of calendar so that the calendar remains in one column and switches between the two.  Added accessibility in new overlay to mimi OWA calendar.  Fixed issue: When the month picker is the only calendar, and screen is small, calendar would disappear when it should be visible.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
new file mode 100644
index 0000000000000..e9f580f183c8d
--- /dev/null
+++ b/package-lock.json
@@ -0,0 +1,3009 @@
+{
+  "name": "office-ui-fabric-react-repo",
+  "version": "1.0.0",
+  "lockfileVersion": 1,
+  "requires": true,
+  "dependencies": {
+    "@microsoft/package-deps-hash": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/@microsoft/package-deps-hash/-/package-deps-hash-2.0.2.tgz",
+      "integrity": "sha1-e17NHr2RS2YIvwBUdKnQZ81MmUg=",
+      "dev": true
+    },
+    "@microsoft/rush": {
+      "version": "3.0.12",
+      "resolved": "https://registry.npmjs.org/@microsoft/rush/-/rush-3.0.12.tgz",
+      "integrity": "sha1-oLbMMxg7Bp+mY8gSwjK6EUGR440=",
+      "dev": true,
+      "requires": {
+        "@microsoft/package-deps-hash": "2.0.2",
+        "@microsoft/rush-lib": "3.0.12",
+        "@microsoft/stream-collator": "2.0.1",
+        "@microsoft/ts-command-line": "2.0.1",
+        "builtins": "1.0.3",
+        "colors": "1.1.2",
+        "fs-extra": "0.26.7",
+        "glob": "7.0.6",
+        "glob-escape": "0.0.2",
+        "inquirer": "1.2.3",
+        "lodash": "4.15.0",
+        "minimatch": "3.0.4",
+        "npm-package-arg": "5.1.2",
+        "read-package-tree": "5.1.6",
+        "semver": "5.3.0",
+        "wordwrap": "1.0.0"
+      }
+    },
+    "@microsoft/rush-lib": {
+      "version": "3.0.12",
+      "resolved": "https://registry.npmjs.org/@microsoft/rush-lib/-/rush-lib-3.0.12.tgz",
+      "integrity": "sha1-EQYu0qO0nvRUaJPuQPWmctNBgIM=",
+      "dev": true,
+      "requires": {
+        "@microsoft/stream-collator": "2.0.1",
+        "@types/es6-collections": "0.5.29",
+        "@types/fs-extra": "0.0.37",
+        "@types/node": "6.0.62",
+        "@types/z-schema": "3.16.31",
+        "fs-extra": "0.26.7",
+        "git-repo-info": "1.1.4",
+        "jju": "1.3.0",
+        "lodash": "4.15.0",
+        "rimraf": "2.5.4",
+        "semver": "5.3.0",
+        "z-schema": "3.17.0"
+      }
+    },
+    "@microsoft/stream-collator": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/@microsoft/stream-collator/-/stream-collator-2.0.1.tgz",
+      "integrity": "sha1-HGf86/kwM8KdIAwKkPOPQr/mBeY=",
+      "dev": true,
+      "requires": {
+        "@types/node": "6.0.64",
+        "colors": "1.1.2"
+      },
+      "dependencies": {
+        "@types/node": {
+          "version": "6.0.64",
+          "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.64.tgz",
+          "integrity": "sha1-zckBQR9jAeFDff7SO8aPVEQuTcg=",
+          "dev": true
+        }
+      }
+    },
+    "@microsoft/ts-command-line": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/@microsoft/ts-command-line/-/ts-command-line-2.0.1.tgz",
+      "integrity": "sha1-v1nDvt0A4eg/mM8xYki6+eYTEo4=",
+      "dev": true,
+      "requires": {
+        "@types/node": "6.0.64",
+        "argparse": "1.0.9",
+        "colors": "1.1.2"
+      },
+      "dependencies": {
+        "@types/node": {
+          "version": "6.0.64",
+          "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.64.tgz",
+          "integrity": "sha1-zckBQR9jAeFDff7SO8aPVEQuTcg=",
+          "dev": true
+        }
+      }
+    },
+    "@types/es6-collections": {
+      "version": "0.5.29",
+      "resolved": "https://registry.npmjs.org/@types/es6-collections/-/es6-collections-0.5.29.tgz",
+      "integrity": "sha1-7CKDH36N5zY3vxVmD52MomlGmA0=",
+      "dev": true
+    },
+    "@types/fs-extra": {
+      "version": "0.0.37",
+      "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.37.tgz",
+      "integrity": "sha1-GV8RvNmhuX2eQSxrZombVFRxofc=",
+      "dev": true,
+      "requires": {
+        "@types/node": "6.0.62"
+      }
+    },
+    "@types/node": {
+      "version": "6.0.62",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.62.tgz",
+      "integrity": "sha1-hSIsB3tU8ltXQXu3CLn4d72jf4k=",
+      "dev": true
+    },
+    "@types/z-schema": {
+      "version": "3.16.31",
+      "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.31.tgz",
+      "integrity": "sha1-LrHQCl5Ow/pYx2r94S4YK2bcXBw=",
+      "dev": true
+    },
+    "agent-base": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-2.1.1.tgz",
+      "integrity": "sha1-1t4Q1a9hMtW9aSQn1G/FOFOQlMc=",
+      "dev": true,
+      "requires": {
+        "extend": "3.0.1",
+        "semver": "5.0.3"
+      },
+      "dependencies": {
+        "semver": {
+          "version": "5.0.3",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.0.3.tgz",
+          "integrity": "sha1-d0Zt5YnNXTyV8TiqeLxWmjy10no=",
+          "dev": true
+        }
+      }
+    },
+    "ajv": {
+      "version": "4.11.8",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz",
+      "integrity": "sha1-gv+wKynmYq5TvcIK8VlHcGc5xTY=",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "co": "4.6.0",
+        "json-stable-stringify": "1.0.1"
+      }
+    },
+    "ansi-escapes": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz",
+      "integrity": "sha1-06ioOzGapneTZisT52HHkRQiMG4=",
+      "dev": true
+    },
+    "ansi-regex": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
+      "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
+      "dev": true
+    },
+    "ansi-styles": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+      "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=",
+      "dev": true
+    },
+    "archy": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/archy/-/archy-1.0.0.tgz",
+      "integrity": "sha1-+cjBN1fMHde8N5rHeyxipcKGjEA=",
+      "dev": true
+    },
+    "argparse": {
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.9.tgz",
+      "integrity": "sha1-c9g7wmP4bpf4zE9rrhsOkKfSLIY=",
+      "dev": true,
+      "requires": {
+        "sprintf-js": "1.0.3"
+      }
+    },
+    "arr-diff": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
+      "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8=",
+      "dev": true,
+      "requires": {
+        "arr-flatten": "1.0.3"
+      }
+    },
+    "arr-flatten": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.0.3.tgz",
+      "integrity": "sha1-onTthawIhJtr14R8RYB0XcUa37E=",
+      "dev": true
+    },
+    "array-differ": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/array-differ/-/array-differ-1.0.0.tgz",
+      "integrity": "sha1-7/UuN1gknTO+QCuLuOVkuytdQDE=",
+      "dev": true
+    },
+    "array-uniq": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz",
+      "integrity": "sha1-r2rId6Jcx/dOBYiUdThY39sk/bY=",
+      "dev": true
+    },
+    "array-unique": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
+      "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM=",
+      "dev": true
+    },
+    "asap": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.5.tgz",
+      "integrity": "sha1-UidltQw1EEkOUtfc/ghe+bqWlY8=",
+      "dev": true
+    },
+    "asn1": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.3.tgz",
+      "integrity": "sha1-2sh4dxPJlmhJ/IGAd36+nB3fO4Y=",
+      "dev": true,
+      "optional": true
+    },
+    "assert-plus": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-0.2.0.tgz",
+      "integrity": "sha1-104bh+ev/A24qttwIfP+SBAasjQ=",
+      "dev": true,
+      "optional": true
+    },
+    "asynckit": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
+      "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k=",
+      "dev": true,
+      "optional": true
+    },
+    "aws-sign2": {
+      "version": "0.6.0",
+      "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz",
+      "integrity": "sha1-FDQt0428yU0OW4fXY81jYSwOeU8=",
+      "dev": true,
+      "optional": true
+    },
+    "aws4": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.6.0.tgz",
+      "integrity": "sha1-g+9cqGCysy5KDe7e6MdxudtXRx4=",
+      "dev": true,
+      "optional": true
+    },
+    "balanced-match": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
+      "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c=",
+      "dev": true
+    },
+    "bcrypt-pbkdf": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/bcrypt-pbkdf/-/bcrypt-pbkdf-1.0.1.tgz",
+      "integrity": "sha1-Y7xdy2EzG5K8Bf1SiVPDNGKgb40=",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "tweetnacl": "0.14.5"
+      }
+    },
+    "beeper": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/beeper/-/beeper-1.1.1.tgz",
+      "integrity": "sha1-5tXqjF2tABMEpwsiY4RH9pyy+Ak=",
+      "dev": true
+    },
+    "boom": {
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
+      "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8=",
+      "dev": true,
+      "requires": {
+        "hoek": "2.16.3"
+      }
+    },
+    "brace-expansion": {
+      "version": "1.1.8",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.8.tgz",
+      "integrity": "sha1-wHshHHyVLsH479Uad+8NHTmQopI=",
+      "dev": true,
+      "requires": {
+        "balanced-match": "1.0.0",
+        "concat-map": "0.0.1"
+      }
+    },
+    "braces": {
+      "version": "1.8.5",
+      "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
+      "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc=",
+      "dev": true,
+      "requires": {
+        "expand-range": "1.8.2",
+        "preserve": "0.2.0",
+        "repeat-element": "1.1.2"
+      }
+    },
+    "builtin-modules": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz",
+      "integrity": "sha1-Jw8HbFpywC9bZaR9+Uxf46J4iS8=",
+      "dev": true
+    },
+    "builtins": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/builtins/-/builtins-1.0.3.tgz",
+      "integrity": "sha1-y5T662HIaWRR2zZTThQi+U8K7og=",
+      "dev": true
+    },
+    "camelcase": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
+      "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo=",
+      "dev": true
+    },
+    "caseless": {
+      "version": "0.12.0",
+      "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz",
+      "integrity": "sha1-G2gcIf+EAzyCZUMJBolCDRhxUdw=",
+      "dev": true,
+      "optional": true
+    },
+    "chalk": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+      "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+      "dev": true,
+      "requires": {
+        "ansi-styles": "2.2.1",
+        "escape-string-regexp": "1.0.5",
+        "has-ansi": "2.0.0",
+        "strip-ansi": "3.0.1",
+        "supports-color": "2.0.0"
+      }
+    },
+    "cli-cursor": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-1.0.2.tgz",
+      "integrity": "sha1-ZNo/fValRBLll5S9Ytw1KV6PKYc=",
+      "dev": true,
+      "requires": {
+        "restore-cursor": "1.0.1"
+      }
+    },
+    "cli-width": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-2.1.0.tgz",
+      "integrity": "sha1-sjTKIJsp72b8UY2bmNWEewDt8Ao=",
+      "dev": true
+    },
+    "cliui": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
+      "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0=",
+      "dev": true,
+      "requires": {
+        "string-width": "1.0.2",
+        "strip-ansi": "3.0.1",
+        "wrap-ansi": "2.1.0"
+      }
+    },
+    "clone": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.2.tgz",
+      "integrity": "sha1-Jgt6meux7f4kdTgXX3gyQ8sZ0Uk=",
+      "dev": true
+    },
+    "clone-stats": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-0.0.1.tgz",
+      "integrity": "sha1-uI+UqCzzi4eR1YBG6kAprYjKmdE=",
+      "dev": true
+    },
+    "co": {
+      "version": "4.6.0",
+      "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
+      "integrity": "sha1-bqa989hTrlTMuOR7+gvz+QMfsYQ=",
+      "dev": true,
+      "optional": true
+    },
+    "code-point-at": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz",
+      "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c=",
+      "dev": true
+    },
+    "colors": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/colors/-/colors-1.1.2.tgz",
+      "integrity": "sha1-FopHAXVran9RoSzgyXv6KMCE7WM=",
+      "dev": true
+    },
+    "combined-stream": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz",
+      "integrity": "sha1-k4NwpXtKUd6ix3wV1cX9+JUWQAk=",
+      "dev": true,
+      "requires": {
+        "delayed-stream": "1.0.0"
+      }
+    },
+    "commander": {
+      "version": "2.9.0",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
+      "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q=",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "graceful-readlink": "1.0.1"
+      }
+    },
+    "concat-map": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
+      "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=",
+      "dev": true
+    },
+    "concat-stream": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.0.tgz",
+      "integrity": "sha1-CqxmL9Ur54lk1VMvaUeE5wEQrPc=",
+      "dev": true,
+      "requires": {
+        "inherits": "2.0.3",
+        "readable-stream": "2.2.11",
+        "typedarray": "0.0.6"
+      }
+    },
+    "core-util-is": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
+      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=",
+      "dev": true
+    },
+    "cryptiles": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz",
+      "integrity": "sha1-O9/s3GCBR8HGcgL6KR59ylnqo7g=",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "boom": "2.10.1"
+      }
+    },
+    "dashdash": {
+      "version": "1.14.1",
+      "resolved": "https://registry.npmjs.org/dashdash/-/dashdash-1.14.1.tgz",
+      "integrity": "sha1-hTz6D3y+L+1d4gMmuN1YEDX24vA=",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "assert-plus": "1.0.0"
+      },
+      "dependencies": {
+        "assert-plus": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
+          "dev": true,
+          "optional": true
+        }
+      }
+    },
+    "dateformat": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-2.0.0.tgz",
+      "integrity": "sha1-J0Pjq7XD/CRi5SfcpEXgTp9N7hc=",
+      "dev": true
+    },
+    "debug": {
+      "version": "2.6.8",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
+      "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw=",
+      "dev": true,
+      "requires": {
+        "ms": "2.0.0"
+      }
+    },
+    "debuglog": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/debuglog/-/debuglog-1.0.1.tgz",
+      "integrity": "sha1-qiT/uaw9+aI1GDfPstJ5NgzXhJI=",
+      "dev": true
+    },
+    "decamelize": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
+      "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA=",
+      "dev": true
+    },
+    "defaults": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.3.tgz",
+      "integrity": "sha1-xlYFHpgX2f8I7YgUd/P+QBnz730=",
+      "dev": true,
+      "requires": {
+        "clone": "1.0.2"
+      }
+    },
+    "delayed-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
+      "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk=",
+      "dev": true
+    },
+    "deprecated": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/deprecated/-/deprecated-0.0.1.tgz",
+      "integrity": "sha1-+cmvVGSvoeepcUWKi97yqpTVuxk=",
+      "dev": true
+    },
+    "detect-file": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/detect-file/-/detect-file-0.1.0.tgz",
+      "integrity": "sha1-STXe39lIhkjgBrASlWbpOGcR6mM=",
+      "dev": true,
+      "requires": {
+        "fs-exists-sync": "0.1.0"
+      }
+    },
+    "dezalgo": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/dezalgo/-/dezalgo-1.0.3.tgz",
+      "integrity": "sha1-f3Qt4Gb8dIvI24IFad3c5Jvw1FY=",
+      "dev": true,
+      "requires": {
+        "asap": "2.0.5",
+        "wrappy": "1.0.2"
+      }
+    },
+    "duplexer2": {
+      "version": "0.0.2",
+      "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.0.2.tgz",
+      "integrity": "sha1-xhTc9n4vsUmVqRcR5aYX6KYKMds=",
+      "dev": true,
+      "requires": {
+        "readable-stream": "1.1.14"
+      },
+      "dependencies": {
+        "isarray": {
+          "version": "0.0.1",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
+          "dev": true
+        },
+        "readable-stream": {
+          "version": "1.1.14",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
+          "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk=",
+          "dev": true,
+          "requires": {
+            "core-util-is": "1.0.2",
+            "inherits": "2.0.3",
+            "isarray": "0.0.1",
+            "string_decoder": "0.10.31"
+          }
+        },
+        "string_decoder": {
+          "version": "0.10.31",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=",
+          "dev": true
+        }
+      }
+    },
+    "ecc-jsbn": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.1.tgz",
+      "integrity": "sha1-D8c6ntXw1Tw4GTOYUj735UN3dQU=",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "jsbn": "0.1.1"
+      }
+    },
+    "end-of-stream": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-0.1.5.tgz",
+      "integrity": "sha1-jhdyBsPICDfYVjLouTWd/osvbq8=",
+      "dev": true,
+      "requires": {
+        "once": "1.3.3"
+      },
+      "dependencies": {
+        "once": {
+          "version": "1.3.3",
+          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz",
+          "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA=",
+          "dev": true,
+          "requires": {
+            "wrappy": "1.0.2"
+          }
+        }
+      }
+    },
+    "error-ex": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.1.tgz",
+      "integrity": "sha1-+FWobOYa3E6GIcPNoh56dhLDqNw=",
+      "dev": true,
+      "requires": {
+        "is-arrayish": "0.2.1"
+      }
+    },
+    "escape-string-regexp": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
+      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
+      "dev": true
+    },
+    "exit-hook": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/exit-hook/-/exit-hook-1.1.1.tgz",
+      "integrity": "sha1-8FyiM7SMBdVP/wd2XfhQfpXAL/g=",
+      "dev": true
+    },
+    "expand-brackets": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
+      "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s=",
+      "dev": true,
+      "requires": {
+        "is-posix-bracket": "0.1.1"
+      }
+    },
+    "expand-range": {
+      "version": "1.8.2",
+      "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz",
+      "integrity": "sha1-opnv/TNf4nIeuujiV+x5ZE/IUzc=",
+      "dev": true,
+      "requires": {
+        "fill-range": "2.2.3"
+      }
+    },
+    "expand-tilde": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-1.2.2.tgz",
+      "integrity": "sha1-C4HrqJflo9MdHD0QL48BRB5VlEk=",
+      "dev": true,
+      "requires": {
+        "os-homedir": "1.0.2"
+      }
+    },
+    "extend": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz",
+      "integrity": "sha1-p1Xqe8Gt/MWjHOfnYtuq3F5jZEQ=",
+      "dev": true
+    },
+    "external-editor": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/external-editor/-/external-editor-1.1.1.tgz",
+      "integrity": "sha1-Etew24UPf/fnCBuvQAVwAGDEYAs=",
+      "dev": true,
+      "requires": {
+        "extend": "3.0.1",
+        "spawn-sync": "1.0.15",
+        "tmp": "0.0.29"
+      }
+    },
+    "extglob": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
+      "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE=",
+      "dev": true,
+      "requires": {
+        "is-extglob": "1.0.0"
+      }
+    },
+    "extsprintf": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.0.2.tgz",
+      "integrity": "sha1-4QgOBljjALBilJkMxw4VAiNf1VA=",
+      "dev": true
+    },
+    "fancy-log": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/fancy-log/-/fancy-log-1.3.0.tgz",
+      "integrity": "sha1-Rb4X0Cu5kX1gzP/UmVyZnmyMmUg=",
+      "dev": true,
+      "requires": {
+        "chalk": "1.1.3",
+        "time-stamp": "1.1.0"
+      }
+    },
+    "figures": {
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz",
+      "integrity": "sha1-y+Hjr/zxzUS4DK3+0o3Hk6lwHS4=",
+      "dev": true,
+      "requires": {
+        "escape-string-regexp": "1.0.5",
+        "object-assign": "4.1.1"
+      }
+    },
+    "filename-regex": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz",
+      "integrity": "sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY=",
+      "dev": true
+    },
+    "fill-range": {
+      "version": "2.2.3",
+      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz",
+      "integrity": "sha1-ULd9/X5Gm8dJJHCWNpn+eoSFpyM=",
+      "dev": true,
+      "requires": {
+        "is-number": "2.1.0",
+        "isobject": "2.1.0",
+        "randomatic": "1.1.7",
+        "repeat-element": "1.1.2",
+        "repeat-string": "1.6.1"
+      }
+    },
+    "find-index": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
+      "integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ=",
+      "dev": true
+    },
+    "find-up": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
+      "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8=",
+      "dev": true,
+      "requires": {
+        "path-exists": "2.1.0",
+        "pinkie-promise": "2.0.1"
+      }
+    },
+    "findup-sync": {
+      "version": "0.4.3",
+      "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.4.3.tgz",
+      "integrity": "sha1-QAQ5Kee8YK3wt/SCfExudaDeyhI=",
+      "dev": true,
+      "requires": {
+        "detect-file": "0.1.0",
+        "is-glob": "2.0.1",
+        "micromatch": "2.3.11",
+        "resolve-dir": "0.1.1"
+      }
+    },
+    "fined": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/fined/-/fined-1.0.2.tgz",
+      "integrity": "sha1-WyhCS3YNdZiWC374SA3/itNmDpc=",
+      "dev": true,
+      "requires": {
+        "expand-tilde": "1.2.2",
+        "lodash.assignwith": "4.2.0",
+        "lodash.isempty": "4.4.0",
+        "lodash.isplainobject": "4.0.6",
+        "lodash.isstring": "4.0.1",
+        "lodash.pick": "4.4.0",
+        "parse-filepath": "1.0.1"
+      }
+    },
+    "first-chunk-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/first-chunk-stream/-/first-chunk-stream-1.0.0.tgz",
+      "integrity": "sha1-Wb+1DNkF9g18OUzT2ayqtOatk04=",
+      "dev": true
+    },
+    "flagged-respawn": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/flagged-respawn/-/flagged-respawn-0.3.2.tgz",
+      "integrity": "sha1-/xke3c1wiKZ1smEP/8l2vpuAdLU=",
+      "dev": true
+    },
+    "follow-redirects": {
+      "version": "0.0.7",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-0.0.7.tgz",
+      "integrity": "sha1-NLkLqyqRGqNHVx2pDyK9NuzYqRk=",
+      "dev": true,
+      "requires": {
+        "debug": "2.6.8",
+        "stream-consume": "0.1.0"
+      }
+    },
+    "for-in": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
+      "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA=",
+      "dev": true
+    },
+    "for-own": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz",
+      "integrity": "sha1-UmXGgaTylNq78XyVCbZ2OqhFEM4=",
+      "dev": true,
+      "requires": {
+        "for-in": "1.0.2"
+      }
+    },
+    "forever-agent": {
+      "version": "0.6.1",
+      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
+      "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE=",
+      "dev": true,
+      "optional": true
+    },
+    "form-data": {
+      "version": "2.1.4",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
+      "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE=",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "asynckit": "0.4.0",
+        "combined-stream": "1.0.5",
+        "mime-types": "2.1.15"
+      }
+    },
+    "fs-exists-sync": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/fs-exists-sync/-/fs-exists-sync-0.1.0.tgz",
+      "integrity": "sha1-mC1ok6+RjnLQjeyehnP/K1qNat0=",
+      "dev": true
+    },
+    "fs-extra": {
+      "version": "0.26.7",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz",
+      "integrity": "sha1-muH92UiXeY7at20JGM9C0MMYT6k=",
+      "dev": true,
+      "requires": {
+        "graceful-fs": "4.1.11",
+        "jsonfile": "2.4.0",
+        "klaw": "1.3.1",
+        "path-is-absolute": "1.0.1",
+        "rimraf": "2.5.4"
+      }
+    },
+    "fs.realpath": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
+      "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=",
+      "dev": true
+    },
+    "gaze": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/gaze/-/gaze-0.5.2.tgz",
+      "integrity": "sha1-QLcJU30k0dRXZ9takIaJ3+aaxE8=",
+      "dev": true,
+      "requires": {
+        "globule": "0.1.0"
+      }
+    },
+    "get-caller-file": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz",
+      "integrity": "sha1-9wLmMSfn4jHBYKgMFVSstw1QR+U=",
+      "dev": true
+    },
+    "getpass": {
+      "version": "0.1.7",
+      "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
+      "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo=",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "assert-plus": "1.0.0"
+      },
+      "dependencies": {
+        "assert-plus": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
+          "dev": true,
+          "optional": true
+        }
+      }
+    },
+    "git-repo-info": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/git-repo-info/-/git-repo-info-1.1.4.tgz",
+      "integrity": "sha1-E0n6OIinZh6h/2OgR8L/Q7PglgI=",
+      "dev": true
+    },
+    "github": {
+      "version": "7.3.2",
+      "resolved": "https://registry.npmjs.org/github/-/github-7.3.2.tgz",
+      "integrity": "sha1-/hDN5pZDUsXZHhGnYW0m1f+2+Hs=",
+      "dev": true,
+      "requires": {
+        "follow-redirects": "0.0.7",
+        "https-proxy-agent": "1.0.0",
+        "mime": "1.3.6",
+        "netrc": "0.1.4"
+      }
+    },
+    "glob": {
+      "version": "7.0.6",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-7.0.6.tgz",
+      "integrity": "sha1-IRuvr0nlJbjNkyYNFKsTYVKz9Xo=",
+      "dev": true,
+      "requires": {
+        "fs.realpath": "1.0.0",
+        "inflight": "1.0.6",
+        "inherits": "2.0.3",
+        "minimatch": "3.0.4",
+        "once": "1.4.0",
+        "path-is-absolute": "1.0.1"
+      }
+    },
+    "glob-base": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz",
+      "integrity": "sha1-27Fk9iIbHAscz4Kuoyi0l98Oo8Q=",
+      "dev": true,
+      "requires": {
+        "glob-parent": "2.0.0",
+        "is-glob": "2.0.1"
+      }
+    },
+    "glob-escape": {
+      "version": "0.0.2",
+      "resolved": "https://registry.npmjs.org/glob-escape/-/glob-escape-0.0.2.tgz",
+      "integrity": "sha1-nCf3gh7RwTd1gvPv2VWOP2dWKO0=",
+      "dev": true
+    },
+    "glob-parent": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz",
+      "integrity": "sha1-gTg9ctsFT8zPUzbaqQLxgvbtuyg=",
+      "dev": true,
+      "requires": {
+        "is-glob": "2.0.1"
+      }
+    },
+    "glob-stream": {
+      "version": "3.1.18",
+      "resolved": "https://registry.npmjs.org/glob-stream/-/glob-stream-3.1.18.tgz",
+      "integrity": "sha1-kXCl8St5Awb9/lmPMT+PeVT9FDs=",
+      "dev": true,
+      "requires": {
+        "glob": "4.5.3",
+        "glob2base": "0.0.12",
+        "minimatch": "2.0.10",
+        "ordered-read-streams": "0.1.0",
+        "through2": "0.6.5",
+        "unique-stream": "1.0.0"
+      },
+      "dependencies": {
+        "glob": {
+          "version": "4.5.3",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-4.5.3.tgz",
+          "integrity": "sha1-xstz0yJsHv7wTePFbQEvAzd+4V8=",
+          "dev": true,
+          "requires": {
+            "inflight": "1.0.6",
+            "inherits": "2.0.3",
+            "minimatch": "2.0.10",
+            "once": "1.4.0"
+          }
+        },
+        "isarray": {
+          "version": "0.0.1",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
+          "dev": true
+        },
+        "minimatch": {
+          "version": "2.0.10",
+          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-2.0.10.tgz",
+          "integrity": "sha1-jQh8OcazjAAbl/ynzm0OHoCvusc=",
+          "dev": true,
+          "requires": {
+            "brace-expansion": "1.1.8"
+          }
+        },
+        "readable-stream": {
+          "version": "1.0.34",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=",
+          "dev": true,
+          "requires": {
+            "core-util-is": "1.0.2",
+            "inherits": "2.0.3",
+            "isarray": "0.0.1",
+            "string_decoder": "0.10.31"
+          }
+        },
+        "string_decoder": {
+          "version": "0.10.31",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=",
+          "dev": true
+        },
+        "through2": {
+          "version": "0.6.5",
+          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
+          "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg=",
+          "dev": true,
+          "requires": {
+            "readable-stream": "1.0.34",
+            "xtend": "4.0.1"
+          }
+        }
+      }
+    },
+    "glob-watcher": {
+      "version": "0.0.6",
+      "resolved": "https://registry.npmjs.org/glob-watcher/-/glob-watcher-0.0.6.tgz",
+      "integrity": "sha1-uVtKjfdLOcgymLDAXJeLTZo7cQs=",
+      "dev": true,
+      "requires": {
+        "gaze": "0.5.2"
+      }
+    },
+    "glob2base": {
+      "version": "0.0.12",
+      "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz",
+      "integrity": "sha1-nUGbPijxLoOjYhZKJ3BVkiycDVY=",
+      "dev": true,
+      "requires": {
+        "find-index": "0.1.1"
+      }
+    },
+    "global-modules": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-0.2.3.tgz",
+      "integrity": "sha1-6lo77ULG1s6ZWk+KEmm12uIjgo0=",
+      "dev": true,
+      "requires": {
+        "global-prefix": "0.1.5",
+        "is-windows": "0.2.0"
+      }
+    },
+    "global-prefix": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-0.1.5.tgz",
+      "integrity": "sha1-jTvGuNo8qBEqFg2NSW/wRiv+948=",
+      "dev": true,
+      "requires": {
+        "homedir-polyfill": "1.0.1",
+        "ini": "1.3.4",
+        "is-windows": "0.2.0",
+        "which": "1.2.14"
+      }
+    },
+    "globule": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/globule/-/globule-0.1.0.tgz",
+      "integrity": "sha1-2cjt3h2nnRJaFRt5UzuXhnY0auU=",
+      "dev": true,
+      "requires": {
+        "glob": "3.1.21",
+        "lodash": "1.0.2",
+        "minimatch": "0.2.14"
+      },
+      "dependencies": {
+        "glob": {
+          "version": "3.1.21",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-3.1.21.tgz",
+          "integrity": "sha1-0p4KBV3qUTj00H7UDomC6DwgZs0=",
+          "dev": true,
+          "requires": {
+            "graceful-fs": "1.2.3",
+            "inherits": "1.0.2",
+            "minimatch": "0.2.14"
+          }
+        },
+        "graceful-fs": {
+          "version": "1.2.3",
+          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-1.2.3.tgz",
+          "integrity": "sha1-FaSAaldUfLLS2/J/QuiajDRRs2Q=",
+          "dev": true
+        },
+        "inherits": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/inherits/-/inherits-1.0.2.tgz",
+          "integrity": "sha1-ykMJ2t7mtUzAuNJH6NfHoJdb3Js=",
+          "dev": true
+        },
+        "lodash": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-1.0.2.tgz",
+          "integrity": "sha1-j1dWDIO1n8JwvT1WG2kAQ0MOJVE=",
+          "dev": true
+        },
+        "minimatch": {
+          "version": "0.2.14",
+          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.2.14.tgz",
+          "integrity": "sha1-x054BXT2PG+aCQ6Q775u9TpqdWo=",
+          "dev": true,
+          "requires": {
+            "lru-cache": "2.7.3",
+            "sigmund": "1.0.1"
+          }
+        }
+      }
+    },
+    "glogg": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/glogg/-/glogg-1.0.0.tgz",
+      "integrity": "sha1-f+DxmfV6yQbPUS/urY+Q7kooT8U=",
+      "dev": true,
+      "requires": {
+        "sparkles": "1.0.0"
+      }
+    },
+    "graceful-fs": {
+      "version": "4.1.11",
+      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz",
+      "integrity": "sha1-Dovf5NHduIVNZOBOp8AOKgJuVlg=",
+      "dev": true
+    },
+    "graceful-readlink": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz",
+      "integrity": "sha1-TK+tdrxi8C+gObL5Tpo906ORpyU=",
+      "dev": true,
+      "optional": true
+    },
+    "gulp": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/gulp/-/gulp-3.9.1.tgz",
+      "integrity": "sha1-VxzkWSjdQK9lFPxAEYZgFsE4RbQ=",
+      "dev": true,
+      "requires": {
+        "archy": "1.0.0",
+        "chalk": "1.1.3",
+        "deprecated": "0.0.1",
+        "gulp-util": "3.0.8",
+        "interpret": "1.0.3",
+        "liftoff": "2.3.0",
+        "minimist": "1.2.0",
+        "orchestrator": "0.3.8",
+        "pretty-hrtime": "1.0.3",
+        "semver": "4.3.6",
+        "tildify": "1.2.0",
+        "v8flags": "2.1.1",
+        "vinyl-fs": "0.3.14"
+      },
+      "dependencies": {
+        "semver": {
+          "version": "4.3.6",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz",
+          "integrity": "sha1-MAvG4OhjdPe6YQaLWx7NV/xlMto=",
+          "dev": true
+        }
+      }
+    },
+    "gulp-util": {
+      "version": "3.0.8",
+      "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.8.tgz",
+      "integrity": "sha1-AFTh50RQLifATBh8PsxQXdVLu08=",
+      "dev": true,
+      "requires": {
+        "array-differ": "1.0.0",
+        "array-uniq": "1.0.3",
+        "beeper": "1.1.1",
+        "chalk": "1.1.3",
+        "dateformat": "2.0.0",
+        "fancy-log": "1.3.0",
+        "gulplog": "1.0.0",
+        "has-gulplog": "0.1.0",
+        "lodash._reescape": "3.0.0",
+        "lodash._reevaluate": "3.0.0",
+        "lodash._reinterpolate": "3.0.0",
+        "lodash.template": "3.6.2",
+        "minimist": "1.2.0",
+        "multipipe": "0.1.2",
+        "object-assign": "3.0.0",
+        "replace-ext": "0.0.1",
+        "through2": "2.0.3",
+        "vinyl": "0.5.3"
+      },
+      "dependencies": {
+        "object-assign": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz",
+          "integrity": "sha1-m+3VygiXlJvKR+f/QIBi1Un1h/I=",
+          "dev": true
+        }
+      }
+    },
+    "gulplog": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/gulplog/-/gulplog-1.0.0.tgz",
+      "integrity": "sha1-4oxNRdBey77YGDY86PnFkmIp/+U=",
+      "dev": true,
+      "requires": {
+        "glogg": "1.0.0"
+      }
+    },
+    "har-schema": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-1.0.5.tgz",
+      "integrity": "sha1-0mMTX0MwfALGAq/I/pWXDAFRNp4=",
+      "dev": true,
+      "optional": true
+    },
+    "har-validator": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz",
+      "integrity": "sha1-M0gdDxu/9gDdID11gSpqX7oALio=",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "ajv": "4.11.8",
+        "har-schema": "1.0.5"
+      }
+    },
+    "has-ansi": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz",
+      "integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE=",
+      "dev": true,
+      "requires": {
+        "ansi-regex": "2.1.1"
+      }
+    },
+    "has-gulplog": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/has-gulplog/-/has-gulplog-0.1.0.tgz",
+      "integrity": "sha1-ZBTIKRNpfaUVkDl9r7EvIpZ4Ec4=",
+      "dev": true,
+      "requires": {
+        "sparkles": "1.0.0"
+      }
+    },
+    "hawk": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz",
+      "integrity": "sha1-B4REvXwWQLD+VA0sm3PVlnjo4cQ=",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "boom": "2.10.1",
+        "cryptiles": "2.0.5",
+        "hoek": "2.16.3",
+        "sntp": "1.0.9"
+      }
+    },
+    "hoek": {
+      "version": "2.16.3",
+      "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz",
+      "integrity": "sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0=",
+      "dev": true
+    },
+    "homedir-polyfill": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.1.tgz",
+      "integrity": "sha1-TCu8inWJmP7r9e1oWA921GdotLw=",
+      "dev": true,
+      "requires": {
+        "parse-passwd": "1.0.0"
+      }
+    },
+    "hosted-git-info": {
+      "version": "2.4.2",
+      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.4.2.tgz",
+      "integrity": "sha1-AHa59GonBQbduq6lZJaJdGBhKmc=",
+      "dev": true
+    },
+    "http-signature": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz",
+      "integrity": "sha1-33LiZwZs0Kxn+3at+OE0qPvPkb8=",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "assert-plus": "0.2.0",
+        "jsprim": "1.4.0",
+        "sshpk": "1.13.1"
+      }
+    },
+    "https-proxy-agent": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-1.0.0.tgz",
+      "integrity": "sha1-NffabEjOTdv6JkiRrFk+5f+GceY=",
+      "dev": true,
+      "requires": {
+        "agent-base": "2.1.1",
+        "debug": "2.6.8",
+        "extend": "3.0.1"
+      }
+    },
+    "inflight": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
+      "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=",
+      "dev": true,
+      "requires": {
+        "once": "1.4.0",
+        "wrappy": "1.0.2"
+      }
+    },
+    "inherits": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
+      "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=",
+      "dev": true
+    },
+    "ini": {
+      "version": "1.3.4",
+      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.4.tgz",
+      "integrity": "sha1-BTfLedr1m1mhpRff9wbIbsA5Fi4=",
+      "dev": true
+    },
+    "inquirer": {
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-1.2.3.tgz",
+      "integrity": "sha1-TexvMvN+97sLLtPx0aXD9UUHSRg=",
+      "dev": true,
+      "requires": {
+        "ansi-escapes": "1.4.0",
+        "chalk": "1.1.3",
+        "cli-cursor": "1.0.2",
+        "cli-width": "2.1.0",
+        "external-editor": "1.1.1",
+        "figures": "1.7.0",
+        "lodash": "4.15.0",
+        "mute-stream": "0.0.6",
+        "pinkie-promise": "2.0.1",
+        "run-async": "2.3.0",
+        "rx": "4.1.0",
+        "string-width": "1.0.2",
+        "strip-ansi": "3.0.1",
+        "through": "2.3.8"
+      }
+    },
+    "interpret": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.0.3.tgz",
+      "integrity": "sha1-y8NcYu7uc/Gat7EKgBURQBr8D5A=",
+      "dev": true
+    },
+    "invert-kv": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/invert-kv/-/invert-kv-1.0.0.tgz",
+      "integrity": "sha1-EEqOSqym09jNFXqO+L+rLXo//bY=",
+      "dev": true
+    },
+    "is-absolute": {
+      "version": "0.2.6",
+      "resolved": "https://registry.npmjs.org/is-absolute/-/is-absolute-0.2.6.tgz",
+      "integrity": "sha1-IN5p89uULvLYe5wto28XIjWxtes=",
+      "dev": true,
+      "requires": {
+        "is-relative": "0.2.1",
+        "is-windows": "0.2.0"
+      }
+    },
+    "is-arrayish": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
+      "integrity": "sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0=",
+      "dev": true
+    },
+    "is-buffer": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.5.tgz",
+      "integrity": "sha1-Hzsm72E7IUuIy8ojzGwB2Hlh7sw=",
+      "dev": true
+    },
+    "is-builtin-module": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-1.0.0.tgz",
+      "integrity": "sha1-VAVy0096wxGfj3bDDLwbHgN6/74=",
+      "dev": true,
+      "requires": {
+        "builtin-modules": "1.1.1"
+      }
+    },
+    "is-dotfile": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/is-dotfile/-/is-dotfile-1.0.3.tgz",
+      "integrity": "sha1-pqLzL/0t+wT1yiXs0Pa4PPeYoeE=",
+      "dev": true
+    },
+    "is-equal-shallow": {
+      "version": "0.1.3",
+      "resolved": "https://registry.npmjs.org/is-equal-shallow/-/is-equal-shallow-0.1.3.tgz",
+      "integrity": "sha1-IjgJj8Ih3gvPpdnqxMRdY4qhxTQ=",
+      "dev": true,
+      "requires": {
+        "is-primitive": "2.0.0"
+      }
+    },
+    "is-extendable": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
+      "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=",
+      "dev": true
+    },
+    "is-extglob": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
+      "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA=",
+      "dev": true
+    },
+    "is-fullwidth-code-point": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
+      "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
+      "dev": true,
+      "requires": {
+        "number-is-nan": "1.0.1"
+      }
+    },
+    "is-glob": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz",
+      "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM=",
+      "dev": true,
+      "requires": {
+        "is-extglob": "1.0.0"
+      }
+    },
+    "is-number": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz",
+      "integrity": "sha1-Afy7s5NGOlSPL0ZszhbezknbkI8=",
+      "dev": true,
+      "requires": {
+        "kind-of": "3.2.2"
+      }
+    },
+    "is-posix-bracket": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz",
+      "integrity": "sha1-MzTceXdDaOkvAW5vvAqI9c1ua8Q=",
+      "dev": true
+    },
+    "is-primitive": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/is-primitive/-/is-primitive-2.0.0.tgz",
+      "integrity": "sha1-IHurkWOEmcB7Kt8kCkGochADRXU=",
+      "dev": true
+    },
+    "is-promise": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-promise/-/is-promise-2.1.0.tgz",
+      "integrity": "sha1-eaKp7OfwlugPNtKy87wWwf9L8/o=",
+      "dev": true
+    },
+    "is-relative": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/is-relative/-/is-relative-0.2.1.tgz",
+      "integrity": "sha1-0n9MfVFtF1+2ENuEu+7yPDvJeqU=",
+      "dev": true,
+      "requires": {
+        "is-unc-path": "0.1.2"
+      }
+    },
+    "is-typedarray": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz",
+      "integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo=",
+      "dev": true,
+      "optional": true
+    },
+    "is-unc-path": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/is-unc-path/-/is-unc-path-0.1.2.tgz",
+      "integrity": "sha1-arBTpyVzwQJQ/0FqOBTDUXivObk=",
+      "dev": true,
+      "requires": {
+        "unc-path-regex": "0.1.2"
+      }
+    },
+    "is-utf8": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz",
+      "integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI=",
+      "dev": true
+    },
+    "is-windows": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-0.2.0.tgz",
+      "integrity": "sha1-3hqm1j6indJIc3tp8f+LgALSEIw=",
+      "dev": true
+    },
+    "isarray": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+      "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=",
+      "dev": true
+    },
+    "isexe": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
+      "integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA=",
+      "dev": true
+    },
+    "isobject": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
+      "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk=",
+      "dev": true,
+      "requires": {
+        "isarray": "1.0.0"
+      }
+    },
+    "isstream": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz",
+      "integrity": "sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo=",
+      "dev": true,
+      "optional": true
+    },
+    "jju": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/jju/-/jju-1.3.0.tgz",
+      "integrity": "sha1-2t2e8BkkvHKLA/L3l5vb1i96Kqo=",
+      "dev": true
+    },
+    "jsbn": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-0.1.1.tgz",
+      "integrity": "sha1-peZUwuWi3rXyAdls77yoDA7y9RM=",
+      "dev": true,
+      "optional": true
+    },
+    "json-parse-helpfulerror": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/json-parse-helpfulerror/-/json-parse-helpfulerror-1.0.3.tgz",
+      "integrity": "sha1-E/FM4C7tTpgSl7ZOueO5MuLdE9w=",
+      "dev": true,
+      "requires": {
+        "jju": "1.3.0"
+      }
+    },
+    "json-schema": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz",
+      "integrity": "sha1-tIDIkuWaLwWVTOcnvT8qTogvnhM=",
+      "dev": true,
+      "optional": true
+    },
+    "json-stable-stringify": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz",
+      "integrity": "sha1-mnWdOcXy/1A/1TAGRu1EX4jE+a8=",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "jsonify": "0.0.0"
+      }
+    },
+    "json-stringify-safe": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz",
+      "integrity": "sha1-Epai1Y/UXxmg9s4B1lcB4sc1tus=",
+      "dev": true,
+      "optional": true
+    },
+    "jsonfile": {
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz",
+      "integrity": "sha1-NzaitCi4e72gzIO1P6PWM6NcKug=",
+      "dev": true,
+      "requires": {
+        "graceful-fs": "4.1.11"
+      }
+    },
+    "jsonify": {
+      "version": "0.0.0",
+      "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz",
+      "integrity": "sha1-LHS27kHZPKUbe1qu6PUDYx0lKnM=",
+      "dev": true,
+      "optional": true
+    },
+    "jsprim": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.0.tgz",
+      "integrity": "sha1-o7h+QCmNjDgFUtjMdiigu5WiKRg=",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "assert-plus": "1.0.0",
+        "extsprintf": "1.0.2",
+        "json-schema": "0.2.3",
+        "verror": "1.3.6"
+      },
+      "dependencies": {
+        "assert-plus": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
+          "dev": true,
+          "optional": true
+        }
+      }
+    },
+    "kind-of": {
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+      "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+      "dev": true,
+      "requires": {
+        "is-buffer": "1.1.5"
+      }
+    },
+    "klaw": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/klaw/-/klaw-1.3.1.tgz",
+      "integrity": "sha1-QIhDO0azsbolnXh4XY6W9zugJDk=",
+      "dev": true,
+      "requires": {
+        "graceful-fs": "4.1.11"
+      }
+    },
+    "lcid": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/lcid/-/lcid-1.0.0.tgz",
+      "integrity": "sha1-MIrMr6C8SDo4Z7S28rlQYlHRuDU=",
+      "dev": true,
+      "requires": {
+        "invert-kv": "1.0.0"
+      }
+    },
+    "liftoff": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/liftoff/-/liftoff-2.3.0.tgz",
+      "integrity": "sha1-qY8v9nGD2Lp8+soQVIvX/wVQs4U=",
+      "dev": true,
+      "requires": {
+        "extend": "3.0.1",
+        "findup-sync": "0.4.3",
+        "fined": "1.0.2",
+        "flagged-respawn": "0.3.2",
+        "lodash.isplainobject": "4.0.6",
+        "lodash.isstring": "4.0.1",
+        "lodash.mapvalues": "4.6.0",
+        "rechoir": "0.6.2",
+        "resolve": "1.3.3"
+      }
+    },
+    "load-json-file": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
+      "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
+      "dev": true,
+      "requires": {
+        "graceful-fs": "4.1.11",
+        "parse-json": "2.2.0",
+        "pify": "2.3.0",
+        "pinkie-promise": "2.0.1",
+        "strip-bom": "2.0.0"
+      },
+      "dependencies": {
+        "strip-bom": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4=",
+          "dev": true,
+          "requires": {
+            "is-utf8": "0.2.1"
+          }
+        }
+      }
+    },
+    "lodash": {
+      "version": "4.15.0",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.15.0.tgz",
+      "integrity": "sha1-MWI5HY8BQKoiz49rPDTWt/Y9Oqk=",
+      "dev": true
+    },
+    "lodash._basecopy": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz",
+      "integrity": "sha1-jaDmqHbPNEwK2KVIghEd08XHyjY=",
+      "dev": true
+    },
+    "lodash._basetostring": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/lodash._basetostring/-/lodash._basetostring-3.0.1.tgz",
+      "integrity": "sha1-0YYdh3+CSlL2aYMtyvPuFVZqB9U=",
+      "dev": true
+    },
+    "lodash._basevalues": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._basevalues/-/lodash._basevalues-3.0.0.tgz",
+      "integrity": "sha1-W3dXYoAr3j0yl1A+JjAIIP32Ybc=",
+      "dev": true
+    },
+    "lodash._getnative": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/lodash._getnative/-/lodash._getnative-3.9.1.tgz",
+      "integrity": "sha1-VwvH3t5G1hzc3mh9ZdPuy6o6r/U=",
+      "dev": true
+    },
+    "lodash._isiterateecall": {
+      "version": "3.0.9",
+      "resolved": "https://registry.npmjs.org/lodash._isiterateecall/-/lodash._isiterateecall-3.0.9.tgz",
+      "integrity": "sha1-UgOte6Ql+uhCRg5pbbnPPmqsBXw=",
+      "dev": true
+    },
+    "lodash._reescape": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._reescape/-/lodash._reescape-3.0.0.tgz",
+      "integrity": "sha1-Kx1vXf4HyKNVdT5fJ/rH8c3hYWo=",
+      "dev": true
+    },
+    "lodash._reevaluate": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._reevaluate/-/lodash._reevaluate-3.0.0.tgz",
+      "integrity": "sha1-WLx0xAZklTrgsSTYBpltrKQx4u0=",
+      "dev": true
+    },
+    "lodash._reinterpolate": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz",
+      "integrity": "sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0=",
+      "dev": true
+    },
+    "lodash._root": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/lodash._root/-/lodash._root-3.0.1.tgz",
+      "integrity": "sha1-+6HEUkwZ7ppfgTa0YJ8BfPTe1pI=",
+      "dev": true
+    },
+    "lodash.assignwith": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/lodash.assignwith/-/lodash.assignwith-4.2.0.tgz",
+      "integrity": "sha1-EnqX8CrcQXUalU0ksN4X4QDgOOs=",
+      "dev": true
+    },
+    "lodash.escape": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-3.2.0.tgz",
+      "integrity": "sha1-mV7g3BjBtIzJLv+ucaEKq1tIdpg=",
+      "dev": true,
+      "requires": {
+        "lodash._root": "3.0.1"
+      }
+    },
+    "lodash.get": {
+      "version": "4.4.2",
+      "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
+      "integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk=",
+      "dev": true
+    },
+    "lodash.isarguments": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz",
+      "integrity": "sha1-L1c9hcaiQon/AGY7SRwdM4/zRYo=",
+      "dev": true
+    },
+    "lodash.isarray": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz",
+      "integrity": "sha1-eeTriMNqgSKvhvhEqpvNhRtfu1U=",
+      "dev": true
+    },
+    "lodash.isempty": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/lodash.isempty/-/lodash.isempty-4.4.0.tgz",
+      "integrity": "sha1-b4bL7di+TsmHvpqvM8loTbGzHn4=",
+      "dev": true
+    },
+    "lodash.isplainobject": {
+      "version": "4.0.6",
+      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
+      "integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs=",
+      "dev": true
+    },
+    "lodash.isstring": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/lodash.isstring/-/lodash.isstring-4.0.1.tgz",
+      "integrity": "sha1-1SfftUVuynzJu5XV2ur4i6VKVFE=",
+      "dev": true
+    },
+    "lodash.keys": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz",
+      "integrity": "sha1-TbwEcrFWvlCgsoaFXRvQsMZWCYo=",
+      "dev": true,
+      "requires": {
+        "lodash._getnative": "3.9.1",
+        "lodash.isarguments": "3.1.0",
+        "lodash.isarray": "3.0.4"
+      }
+    },
+    "lodash.mapvalues": {
+      "version": "4.6.0",
+      "resolved": "https://registry.npmjs.org/lodash.mapvalues/-/lodash.mapvalues-4.6.0.tgz",
+      "integrity": "sha1-G6+lAF3p3W9PJmaMMMo3IwzJaJw=",
+      "dev": true
+    },
+    "lodash.pick": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz",
+      "integrity": "sha1-UvBWEP/53tQiYRRB7R/BI6AwAbM=",
+      "dev": true
+    },
+    "lodash.restparam": {
+      "version": "3.6.1",
+      "resolved": "https://registry.npmjs.org/lodash.restparam/-/lodash.restparam-3.6.1.tgz",
+      "integrity": "sha1-k2pOMJ7zMKdkXtQUWYbIWuWyCAU=",
+      "dev": true
+    },
+    "lodash.template": {
+      "version": "3.6.2",
+      "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-3.6.2.tgz",
+      "integrity": "sha1-+M3sxhaaJVvpCYrosMU9N4kx0U8=",
+      "dev": true,
+      "requires": {
+        "lodash._basecopy": "3.0.1",
+        "lodash._basetostring": "3.0.1",
+        "lodash._basevalues": "3.0.0",
+        "lodash._isiterateecall": "3.0.9",
+        "lodash._reinterpolate": "3.0.0",
+        "lodash.escape": "3.2.0",
+        "lodash.keys": "3.1.2",
+        "lodash.restparam": "3.6.1",
+        "lodash.templatesettings": "3.1.1"
+      }
+    },
+    "lodash.templatesettings": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-3.1.1.tgz",
+      "integrity": "sha1-+zB4RHU7Zrnxr6VOJix0UwfbqOU=",
+      "dev": true,
+      "requires": {
+        "lodash._reinterpolate": "3.0.0",
+        "lodash.escape": "3.2.0"
+      }
+    },
+    "lru-cache": {
+      "version": "2.7.3",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.7.3.tgz",
+      "integrity": "sha1-bUUk6LlV+V1PW1iFHOId1y+06VI=",
+      "dev": true
+    },
+    "map-cache": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz",
+      "integrity": "sha1-wyq9C9ZSXZsFFkW7TyasXcmKDb8=",
+      "dev": true
+    },
+    "micromatch": {
+      "version": "2.3.11",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
+      "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU=",
+      "dev": true,
+      "requires": {
+        "arr-diff": "2.0.0",
+        "array-unique": "0.2.1",
+        "braces": "1.8.5",
+        "expand-brackets": "0.1.5",
+        "extglob": "0.3.2",
+        "filename-regex": "2.0.1",
+        "is-extglob": "1.0.0",
+        "is-glob": "2.0.1",
+        "kind-of": "3.2.2",
+        "normalize-path": "2.1.1",
+        "object.omit": "2.0.1",
+        "parse-glob": "3.0.4",
+        "regex-cache": "0.4.3"
+      }
+    },
+    "mime": {
+      "version": "1.3.6",
+      "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.6.tgz",
+      "integrity": "sha1-WR2E02U6awtKO5343lqoEI5y5eA=",
+      "dev": true
+    },
+    "mime-db": {
+      "version": "1.27.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.27.0.tgz",
+      "integrity": "sha1-gg9XIpa70g7CXtVeW13oaeVDbrE=",
+      "dev": true
+    },
+    "mime-types": {
+      "version": "2.1.15",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.15.tgz",
+      "integrity": "sha1-pOv1BkCUVpI3uM9wBGd20J/JKu0=",
+      "dev": true,
+      "requires": {
+        "mime-db": "1.27.0"
+      }
+    },
+    "minimatch": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
+      "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==",
+      "dev": true,
+      "requires": {
+        "brace-expansion": "1.1.8"
+      }
+    },
+    "minimist": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
+      "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=",
+      "dev": true
+    },
+    "mkdirp": {
+      "version": "0.5.1",
+      "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
+      "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
+      "dev": true,
+      "requires": {
+        "minimist": "0.0.8"
+      },
+      "dependencies": {
+        "minimist": {
+          "version": "0.0.8",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
+          "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0=",
+          "dev": true
+        }
+      }
+    },
+    "ms": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+      "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
+      "dev": true
+    },
+    "multipipe": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/multipipe/-/multipipe-0.1.2.tgz",
+      "integrity": "sha1-Ko8t33Du1WTf8tV/HhoTfZ8FB4s=",
+      "dev": true,
+      "requires": {
+        "duplexer2": "0.0.2"
+      }
+    },
+    "mute-stream": {
+      "version": "0.0.6",
+      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.6.tgz",
+      "integrity": "sha1-SJYrGeFp/R38JAs/HnMXYnu8R9s=",
+      "dev": true
+    },
+    "natives": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/natives/-/natives-1.1.0.tgz",
+      "integrity": "sha1-6f+EFBimsux6SV6TmYT3jxY+bjE=",
+      "dev": true
+    },
+    "netrc": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/netrc/-/netrc-0.1.4.tgz",
+      "integrity": "sha1-a+lPysqNd63gqWcNxGCRTJRHJEQ=",
+      "dev": true
+    },
+    "normalize-package-data": {
+      "version": "2.3.8",
+      "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.3.8.tgz",
+      "integrity": "sha1-2Bntoqne29H/pWPqQHHZNngilbs=",
+      "dev": true,
+      "requires": {
+        "hosted-git-info": "2.4.2",
+        "is-builtin-module": "1.0.0",
+        "semver": "5.3.0",
+        "validate-npm-package-license": "3.0.1"
+      }
+    },
+    "normalize-path": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-2.1.1.tgz",
+      "integrity": "sha1-GrKLVW4Zg2Oowab35vogE3/mrtk=",
+      "dev": true,
+      "requires": {
+        "remove-trailing-separator": "1.0.2"
+      }
+    },
+    "npm-package-arg": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/npm-package-arg/-/npm-package-arg-5.1.2.tgz",
+      "integrity": "sha512-wJBsrf0qpypPT7A0LART18hCdyhpCMxeTtcb0X4IZO2jsP6Om7EHN1d9KSKiqD+KVH030RVNpWS9thk+pb7wzA==",
+      "dev": true,
+      "requires": {
+        "hosted-git-info": "2.4.2",
+        "osenv": "0.1.4",
+        "semver": "5.3.0",
+        "validate-npm-package-name": "3.0.0"
+      }
+    },
+    "number-is-nan": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz",
+      "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=",
+      "dev": true
+    },
+    "oauth-sign": {
+      "version": "0.8.2",
+      "resolved": "https://registry.npmjs.org/oauth-sign/-/oauth-sign-0.8.2.tgz",
+      "integrity": "sha1-Rqarfwrq2N6unsBWV4C31O/rnUM=",
+      "dev": true,
+      "optional": true
+    },
+    "object-assign": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
+      "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=",
+      "dev": true
+    },
+    "object.omit": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/object.omit/-/object.omit-2.0.1.tgz",
+      "integrity": "sha1-Gpx0SCnznbuFjHbKNXmuKlTr0fo=",
+      "dev": true,
+      "requires": {
+        "for-own": "0.1.5",
+        "is-extendable": "0.1.1"
+      }
+    },
+    "once": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
+      "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
+      "dev": true,
+      "requires": {
+        "wrappy": "1.0.2"
+      }
+    },
+    "onetime": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/onetime/-/onetime-1.1.0.tgz",
+      "integrity": "sha1-ofeDj4MUxRbwXs78vEzP4EtO14k=",
+      "dev": true
+    },
+    "orchestrator": {
+      "version": "0.3.8",
+      "resolved": "https://registry.npmjs.org/orchestrator/-/orchestrator-0.3.8.tgz",
+      "integrity": "sha1-FOfp4nZPcxX7rBhOUGx6pt+UrX4=",
+      "dev": true,
+      "requires": {
+        "end-of-stream": "0.1.5",
+        "sequencify": "0.0.7",
+        "stream-consume": "0.1.0"
+      }
+    },
+    "ordered-read-streams": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.1.0.tgz",
+      "integrity": "sha1-/VZamvjrRHO6abbtijQ1LLVS8SY=",
+      "dev": true
+    },
+    "os-homedir": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
+      "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M=",
+      "dev": true
+    },
+    "os-locale": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
+      "integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk=",
+      "dev": true,
+      "requires": {
+        "lcid": "1.0.0"
+      }
+    },
+    "os-shim": {
+      "version": "0.1.3",
+      "resolved": "https://registry.npmjs.org/os-shim/-/os-shim-0.1.3.tgz",
+      "integrity": "sha1-a2LDeRz3kJ6jXtRuF2WLtBfLORc=",
+      "dev": true
+    },
+    "os-tmpdir": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
+      "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ=",
+      "dev": true
+    },
+    "osenv": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.4.tgz",
+      "integrity": "sha1-Qv5tWVPfBsgGS+bxdsPQWqqjRkQ=",
+      "dev": true,
+      "requires": {
+        "os-homedir": "1.0.2",
+        "os-tmpdir": "1.0.2"
+      }
+    },
+    "parse-filepath": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/parse-filepath/-/parse-filepath-1.0.1.tgz",
+      "integrity": "sha1-FZ1hVdQ5BNFsEO9piRHaHpGWm3M=",
+      "dev": true,
+      "requires": {
+        "is-absolute": "0.2.6",
+        "map-cache": "0.2.2",
+        "path-root": "0.1.1"
+      }
+    },
+    "parse-glob": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/parse-glob/-/parse-glob-3.0.4.tgz",
+      "integrity": "sha1-ssN2z7EfNVE7rdFz7wu246OIORw=",
+      "dev": true,
+      "requires": {
+        "glob-base": "0.3.0",
+        "is-dotfile": "1.0.3",
+        "is-extglob": "1.0.0",
+        "is-glob": "2.0.1"
+      }
+    },
+    "parse-json": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz",
+      "integrity": "sha1-9ID0BDTvgHQfhGkJn43qGPVaTck=",
+      "dev": true,
+      "requires": {
+        "error-ex": "1.3.1"
+      }
+    },
+    "parse-passwd": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/parse-passwd/-/parse-passwd-1.0.0.tgz",
+      "integrity": "sha1-bVuTSkVpk7I9N/QKOC1vFmao5cY=",
+      "dev": true
+    },
+    "path-exists": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
+      "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s=",
+      "dev": true,
+      "requires": {
+        "pinkie-promise": "2.0.1"
+      }
+    },
+    "path-is-absolute": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
+      "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=",
+      "dev": true
+    },
+    "path-parse": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.5.tgz",
+      "integrity": "sha1-PBrfhx6pzWyUMbbqK9dKD/BVxME=",
+      "dev": true
+    },
+    "path-root": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/path-root/-/path-root-0.1.1.tgz",
+      "integrity": "sha1-mkpoFMrBwM1zNgqV8yCDyOpHRbc=",
+      "dev": true,
+      "requires": {
+        "path-root-regex": "0.1.2"
+      }
+    },
+    "path-root-regex": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/path-root-regex/-/path-root-regex-0.1.2.tgz",
+      "integrity": "sha1-v8zcjfWxLcUsi0PsONGNcsBLqW0=",
+      "dev": true
+    },
+    "path-type": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
+      "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE=",
+      "dev": true,
+      "requires": {
+        "graceful-fs": "4.1.11",
+        "pify": "2.3.0",
+        "pinkie-promise": "2.0.1"
+      }
+    },
+    "performance-now": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-0.2.0.tgz",
+      "integrity": "sha1-M+8wxcd9TqIcWlOGnZG1bY8lVeU=",
+      "dev": true,
+      "optional": true
+    },
+    "pify": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+      "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
+      "dev": true
+    },
+    "pinkie": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/pinkie/-/pinkie-2.0.4.tgz",
+      "integrity": "sha1-clVrgM+g1IqXToDnckjoDtT3+HA=",
+      "dev": true
+    },
+    "pinkie-promise": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz",
+      "integrity": "sha1-ITXW36ejWMBprJsXh3YogihFD/o=",
+      "dev": true,
+      "requires": {
+        "pinkie": "2.0.4"
+      }
+    },
+    "preserve": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/preserve/-/preserve-0.2.0.tgz",
+      "integrity": "sha1-gV7R9uvGWSb4ZbMQwHE7yzMVzks=",
+      "dev": true
+    },
+    "pretty-hrtime": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz",
+      "integrity": "sha1-t+PqQkNaTJsnWdmeDyAesZWALuE=",
+      "dev": true
+    },
+    "process-nextick-args": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz",
+      "integrity": "sha1-FQ4gt1ZZCtP5EJPyWk8q2L/zC6M=",
+      "dev": true
+    },
+    "punycode": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
+      "integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4=",
+      "dev": true,
+      "optional": true
+    },
+    "qs": {
+      "version": "6.4.0",
+      "resolved": "https://registry.npmjs.org/qs/-/qs-6.4.0.tgz",
+      "integrity": "sha1-E+JtKK1rD/qpExLNO/cI7TUecjM=",
+      "dev": true,
+      "optional": true
+    },
+    "randomatic": {
+      "version": "1.1.7",
+      "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-1.1.7.tgz",
+      "integrity": "sha512-D5JUjPyJbaJDkuAazpVnSfVkLlpeO3wDlPROTMLGKG1zMFNFRgrciKo1ltz/AzNTkqE0HzDx655QOL51N06how==",
+      "dev": true,
+      "requires": {
+        "is-number": "3.0.0",
+        "kind-of": "4.0.0"
+      },
+      "dependencies": {
+        "is-number": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/is-number/-/is-number-3.0.0.tgz",
+          "integrity": "sha1-JP1iAaR4LPUFYcgQJ2r8fRLXEZU=",
+          "dev": true,
+          "requires": {
+            "kind-of": "3.2.2"
+          },
+          "dependencies": {
+            "kind-of": {
+              "version": "3.2.2",
+              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+              "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+              "dev": true,
+              "requires": {
+                "is-buffer": "1.1.5"
+              }
+            }
+          }
+        },
+        "kind-of": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-4.0.0.tgz",
+          "integrity": "sha1-IIE989cSkosgc3hpGkUGb65y3Vc=",
+          "dev": true,
+          "requires": {
+            "is-buffer": "1.1.5"
+          }
+        }
+      }
+    },
+    "read-package-json": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/read-package-json/-/read-package-json-2.0.5.tgz",
+      "integrity": "sha1-+Tpk5kFSnfaKCMZN5GOJ6KP4iEU=",
+      "dev": true,
+      "requires": {
+        "glob": "7.1.2",
+        "graceful-fs": "4.1.11",
+        "json-parse-helpfulerror": "1.0.3",
+        "normalize-package-data": "2.3.8"
+      },
+      "dependencies": {
+        "glob": {
+          "version": "7.1.2",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
+          "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ==",
+          "dev": true,
+          "requires": {
+            "fs.realpath": "1.0.0",
+            "inflight": "1.0.6",
+            "inherits": "2.0.3",
+            "minimatch": "3.0.4",
+            "once": "1.4.0",
+            "path-is-absolute": "1.0.1"
+          }
+        }
+      }
+    },
+    "read-package-tree": {
+      "version": "5.1.6",
+      "resolved": "https://registry.npmjs.org/read-package-tree/-/read-package-tree-5.1.6.tgz",
+      "integrity": "sha512-FCX1aT3GWyY658wzDICef4p+n0dB+ENRct8E/Qyvppj6xVpOYerBHfUu7OP5Rt1/393Tdglguf5ju5DEX4wZNg==",
+      "dev": true,
+      "requires": {
+        "debuglog": "1.0.1",
+        "dezalgo": "1.0.3",
+        "once": "1.4.0",
+        "read-package-json": "2.0.5",
+        "readdir-scoped-modules": "1.0.2"
+      }
+    },
+    "read-pkg": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
+      "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg=",
+      "dev": true,
+      "requires": {
+        "load-json-file": "1.1.0",
+        "normalize-package-data": "2.3.8",
+        "path-type": "1.1.0"
+      }
+    },
+    "read-pkg-up": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
+      "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI=",
+      "dev": true,
+      "requires": {
+        "find-up": "1.1.2",
+        "read-pkg": "1.1.0"
+      }
+    },
+    "readable-stream": {
+      "version": "2.2.11",
+      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
+      "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q==",
+      "dev": true,
+      "requires": {
+        "core-util-is": "1.0.2",
+        "inherits": "2.0.3",
+        "isarray": "1.0.0",
+        "process-nextick-args": "1.0.7",
+        "safe-buffer": "5.0.1",
+        "string_decoder": "1.0.2",
+        "util-deprecate": "1.0.2"
+      },
+      "dependencies": {
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c=",
+          "dev": true
+        }
+      }
+    },
+    "readdir-scoped-modules": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/readdir-scoped-modules/-/readdir-scoped-modules-1.0.2.tgz",
+      "integrity": "sha1-n6+jfShr5dksuuve4DDcm19AZ0c=",
+      "dev": true,
+      "requires": {
+        "debuglog": "1.0.1",
+        "dezalgo": "1.0.3",
+        "graceful-fs": "4.1.11",
+        "once": "1.4.0"
+      }
+    },
+    "rechoir": {
+      "version": "0.6.2",
+      "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz",
+      "integrity": "sha1-hSBLVNuoLVdC4oyWdW70OvUOM4Q=",
+      "dev": true,
+      "requires": {
+        "resolve": "1.3.3"
+      }
+    },
+    "regex-cache": {
+      "version": "0.4.3",
+      "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.3.tgz",
+      "integrity": "sha1-mxpsNdTQ3871cRrmUejp09cRQUU=",
+      "dev": true,
+      "requires": {
+        "is-equal-shallow": "0.1.3",
+        "is-primitive": "2.0.0"
+      }
+    },
+    "remove-trailing-separator": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.0.2.tgz",
+      "integrity": "sha1-abBi2XhyetFNxrVrpKt3L9jXBRE=",
+      "dev": true
+    },
+    "repeat-element": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/repeat-element/-/repeat-element-1.1.2.tgz",
+      "integrity": "sha1-7wiaF40Ug7quTZPrmLT55OEdmQo=",
+      "dev": true
+    },
+    "repeat-string": {
+      "version": "1.6.1",
+      "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-1.6.1.tgz",
+      "integrity": "sha1-jcrkcOHIirwtYA//Sndihtp15jc=",
+      "dev": true
+    },
+    "replace-ext": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-0.0.1.tgz",
+      "integrity": "sha1-KbvZIHinOfC8zitO5B6DeVNSKSQ=",
+      "dev": true
+    },
+    "request": {
+      "version": "2.81.0",
+      "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz",
+      "integrity": "sha1-xpKJRqDgbF+Nb4qTM0af/aRimKA=",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "aws-sign2": "0.6.0",
+        "aws4": "1.6.0",
+        "caseless": "0.12.0",
+        "combined-stream": "1.0.5",
+        "extend": "3.0.1",
+        "forever-agent": "0.6.1",
+        "form-data": "2.1.4",
+        "har-validator": "4.2.1",
+        "hawk": "3.1.3",
+        "http-signature": "1.1.1",
+        "is-typedarray": "1.0.0",
+        "isstream": "0.1.2",
+        "json-stringify-safe": "5.0.1",
+        "mime-types": "2.1.15",
+        "oauth-sign": "0.8.2",
+        "performance-now": "0.2.0",
+        "qs": "6.4.0",
+        "safe-buffer": "5.1.0",
+        "stringstream": "0.0.5",
+        "tough-cookie": "2.3.2",
+        "tunnel-agent": "0.6.0",
+        "uuid": "3.0.1"
+      }
+    },
+    "require-directory": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
+      "integrity": "sha1-jGStX9MNqxyXbiNE/+f3kqam30I=",
+      "dev": true
+    },
+    "require-main-filename": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-1.0.1.tgz",
+      "integrity": "sha1-l/cXtp1IeE9fUmpsWqj/3aBVpNE=",
+      "dev": true
+    },
+    "resolve": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.3.3.tgz",
+      "integrity": "sha1-ZVkHw0aahoDcLeOidaj91paR8OU=",
+      "dev": true,
+      "requires": {
+        "path-parse": "1.0.5"
+      }
+    },
+    "resolve-dir": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/resolve-dir/-/resolve-dir-0.1.1.tgz",
+      "integrity": "sha1-shklmlYC+sXFxJatiUpujMQwJh4=",
+      "dev": true,
+      "requires": {
+        "expand-tilde": "1.2.2",
+        "global-modules": "0.2.3"
+      }
+    },
+    "restore-cursor": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-1.0.1.tgz",
+      "integrity": "sha1-NGYfRohjJ/7SmRR5FSJS35LapUE=",
+      "dev": true,
+      "requires": {
+        "exit-hook": "1.1.1",
+        "onetime": "1.1.0"
+      }
+    },
+    "rimraf": {
+      "version": "2.5.4",
+      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
+      "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ=",
+      "dev": true,
+      "requires": {
+        "glob": "7.0.6"
+      }
+    },
+    "run-async": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/run-async/-/run-async-2.3.0.tgz",
+      "integrity": "sha1-A3GrSuC91yDUFm19/aZP96RFpsA=",
+      "dev": true,
+      "requires": {
+        "is-promise": "2.1.0"
+      }
+    },
+    "rx": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/rx/-/rx-4.1.0.tgz",
+      "integrity": "sha1-pfE/957zt0D+MKqAP7CfmIBdR4I=",
+      "dev": true
+    },
+    "safe-buffer": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.0.tgz",
+      "integrity": "sha512-aSLEDudu6OoRr/2rU609gRmnYboRLxgDG1z9o2Q0os7236FwvcqIOO8r8U5JUEwivZOhDaKlFO4SbPTJYyBEyQ==",
+      "dev": true
+    },
+    "semver": {
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz",
+      "integrity": "sha1-myzl094C0XxgEq0yaqa00M9U+U8=",
+      "dev": true
+    },
+    "sequencify": {
+      "version": "0.0.7",
+      "resolved": "https://registry.npmjs.org/sequencify/-/sequencify-0.0.7.tgz",
+      "integrity": "sha1-kM/xnQLgcCf9dn9erT57ldHnOAw=",
+      "dev": true
+    },
+    "set-blocking": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
+      "integrity": "sha1-BF+XgtARrppoA93TgrJDkrPYkPc=",
+      "dev": true
+    },
+    "sigmund": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/sigmund/-/sigmund-1.0.1.tgz",
+      "integrity": "sha1-P/IfGYytIXX587eBhT/ZTQ0ZtZA=",
+      "dev": true
+    },
+    "sntp": {
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz",
+      "integrity": "sha1-ZUEYTMkK7qbG57NeJlkIJEPGYZg=",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "hoek": "2.16.3"
+      }
+    },
+    "sparkles": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/sparkles/-/sparkles-1.0.0.tgz",
+      "integrity": "sha1-Gsu/tZJDbRC76PeFt8xvgoFQEsM=",
+      "dev": true
+    },
+    "spawn-sync": {
+      "version": "1.0.15",
+      "resolved": "https://registry.npmjs.org/spawn-sync/-/spawn-sync-1.0.15.tgz",
+      "integrity": "sha1-sAeZVX63+wyDdsKdROih6mfldHY=",
+      "dev": true,
+      "requires": {
+        "concat-stream": "1.6.0",
+        "os-shim": "0.1.3"
+      }
+    },
+    "spdx-correct": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-1.0.2.tgz",
+      "integrity": "sha1-SzBz2TP/UfORLwOsVRlJikFQ20A=",
+      "dev": true,
+      "requires": {
+        "spdx-license-ids": "1.2.2"
+      }
+    },
+    "spdx-expression-parse": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-1.0.4.tgz",
+      "integrity": "sha1-m98vIOH0DtRH++JzJmGR/O1RYmw=",
+      "dev": true
+    },
+    "spdx-license-ids": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-1.2.2.tgz",
+      "integrity": "sha1-yd96NCRZSt5r0RkA1ZZpbcBrrFc=",
+      "dev": true
+    },
+    "sprintf-js": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
+      "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=",
+      "dev": true
+    },
+    "sshpk": {
+      "version": "1.13.1",
+      "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.13.1.tgz",
+      "integrity": "sha1-US322mKHFEMW3EwY/hzx2UBzm+M=",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "asn1": "0.2.3",
+        "assert-plus": "1.0.0",
+        "bcrypt-pbkdf": "1.0.1",
+        "dashdash": "1.14.1",
+        "ecc-jsbn": "0.1.1",
+        "getpass": "0.1.7",
+        "jsbn": "0.1.1",
+        "tweetnacl": "0.14.5"
+      },
+      "dependencies": {
+        "assert-plus": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
+          "dev": true,
+          "optional": true
+        }
+      }
+    },
+    "stream-consume": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/stream-consume/-/stream-consume-0.1.0.tgz",
+      "integrity": "sha1-pB6tGm1ggc63n2WwYZAbbY89HQ8=",
+      "dev": true
+    },
+    "string_decoder": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
+      "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
+      "dev": true,
+      "requires": {
+        "safe-buffer": "5.0.1"
+      },
+      "dependencies": {
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c=",
+          "dev": true
+        }
+      }
+    },
+    "string-width": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
+      "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
+      "dev": true,
+      "requires": {
+        "code-point-at": "1.1.0",
+        "is-fullwidth-code-point": "1.0.0",
+        "strip-ansi": "3.0.1"
+      }
+    },
+    "stringstream": {
+      "version": "0.0.5",
+      "resolved": "https://registry.npmjs.org/stringstream/-/stringstream-0.0.5.tgz",
+      "integrity": "sha1-TkhM1N5aC7vuGORjB3EKioFiGHg=",
+      "dev": true,
+      "optional": true
+    },
+    "strip-ansi": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
+      "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
+      "dev": true,
+      "requires": {
+        "ansi-regex": "2.1.1"
+      }
+    },
+    "strip-bom": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-1.0.0.tgz",
+      "integrity": "sha1-hbiGLzhEtabV7IRnqTWYFzo295Q=",
+      "dev": true,
+      "requires": {
+        "first-chunk-stream": "1.0.0",
+        "is-utf8": "0.2.1"
+      }
+    },
+    "supports-color": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+      "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=",
+      "dev": true
+    },
+    "through": {
+      "version": "2.3.8",
+      "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
+      "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU=",
+      "dev": true
+    },
+    "through2": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/through2/-/through2-2.0.3.tgz",
+      "integrity": "sha1-AARWmzfHx0ujnEPzzteNGtlBQL4=",
+      "dev": true,
+      "requires": {
+        "readable-stream": "2.2.11",
+        "xtend": "4.0.1"
+      }
+    },
+    "tildify": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/tildify/-/tildify-1.2.0.tgz",
+      "integrity": "sha1-3OwD9V3Km3qj5bBPIYF+tW5jWIo=",
+      "dev": true,
+      "requires": {
+        "os-homedir": "1.0.2"
+      }
+    },
+    "time-stamp": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/time-stamp/-/time-stamp-1.1.0.tgz",
+      "integrity": "sha1-dkpaEa9QVhkhsTPztE5hhofg9cM=",
+      "dev": true
+    },
+    "tmp": {
+      "version": "0.0.29",
+      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.29.tgz",
+      "integrity": "sha1-8lEl/w3Z2jzLDC3Tce4SiLuRKMA=",
+      "dev": true,
+      "requires": {
+        "os-tmpdir": "1.0.2"
+      }
+    },
+    "tough-cookie": {
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.2.tgz",
+      "integrity": "sha1-8IH3bkyFcg5sN6X6ztc3FQ2EByo=",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "punycode": "1.4.1"
+      }
+    },
+    "tunnel-agent": {
+      "version": "0.6.0",
+      "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.6.0.tgz",
+      "integrity": "sha1-J6XeoGs2sEoKmWZ3SykIaPD8QP0=",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "safe-buffer": "5.1.0"
+      }
+    },
+    "tweetnacl": {
+      "version": "0.14.5",
+      "resolved": "https://registry.npmjs.org/tweetnacl/-/tweetnacl-0.14.5.tgz",
+      "integrity": "sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q=",
+      "dev": true,
+      "optional": true
+    },
+    "typedarray": {
+      "version": "0.0.6",
+      "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
+      "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=",
+      "dev": true
+    },
+    "unc-path-regex": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/unc-path-regex/-/unc-path-regex-0.1.2.tgz",
+      "integrity": "sha1-5z3T17DXxe2G+6xrCufYxqadUPo=",
+      "dev": true
+    },
+    "unique-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-1.0.0.tgz",
+      "integrity": "sha1-1ZpKdUJ0R9mqbJHnAmP40mpLEEs=",
+      "dev": true
+    },
+    "user-home": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/user-home/-/user-home-1.1.1.tgz",
+      "integrity": "sha1-K1viOjK2Onyd640PKNSFcko98ZA=",
+      "dev": true
+    },
+    "util-deprecate": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
+      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=",
+      "dev": true
+    },
+    "uuid": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.0.1.tgz",
+      "integrity": "sha1-ZUS7ot/ajBzxfmKaOjBeK7H+5sE=",
+      "dev": true,
+      "optional": true
+    },
+    "v8flags": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/v8flags/-/v8flags-2.1.1.tgz",
+      "integrity": "sha1-qrGh+jDUX4jdMhFIh1rALAtV5bQ=",
+      "dev": true,
+      "requires": {
+        "user-home": "1.1.1"
+      }
+    },
+    "validate-npm-package-license": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.1.tgz",
+      "integrity": "sha1-KAS6vnEq0zeUWaz74kdGqywwP7w=",
+      "dev": true,
+      "requires": {
+        "spdx-correct": "1.0.2",
+        "spdx-expression-parse": "1.0.4"
+      }
+    },
+    "validate-npm-package-name": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/validate-npm-package-name/-/validate-npm-package-name-3.0.0.tgz",
+      "integrity": "sha1-X6kS2B630MdK/BQN5zF/DKffQ34=",
+      "dev": true,
+      "requires": {
+        "builtins": "1.0.3"
+      }
+    },
+    "validator": {
+      "version": "5.7.0",
+      "resolved": "https://registry.npmjs.org/validator/-/validator-5.7.0.tgz",
+      "integrity": "sha1-eoelgUa2laxIYHEUHAxJ1n2gXlw=",
+      "dev": true
+    },
+    "verror": {
+      "version": "1.3.6",
+      "resolved": "https://registry.npmjs.org/verror/-/verror-1.3.6.tgz",
+      "integrity": "sha1-z/XfEpRtKX0rqu+qJoniW+AcAFw=",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "extsprintf": "1.0.2"
+      }
+    },
+    "vinyl": {
+      "version": "0.5.3",
+      "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.5.3.tgz",
+      "integrity": "sha1-sEVbOPxeDPMNQyUTLkYZcMIJHN4=",
+      "dev": true,
+      "requires": {
+        "clone": "1.0.2",
+        "clone-stats": "0.0.1",
+        "replace-ext": "0.0.1"
+      }
+    },
+    "vinyl-fs": {
+      "version": "0.3.14",
+      "resolved": "https://registry.npmjs.org/vinyl-fs/-/vinyl-fs-0.3.14.tgz",
+      "integrity": "sha1-mmhRzhysHBzqX+hsCTHWIMLPqeY=",
+      "dev": true,
+      "requires": {
+        "defaults": "1.0.3",
+        "glob-stream": "3.1.18",
+        "glob-watcher": "0.0.6",
+        "graceful-fs": "3.0.11",
+        "mkdirp": "0.5.1",
+        "strip-bom": "1.0.0",
+        "through2": "0.6.5",
+        "vinyl": "0.4.6"
+      },
+      "dependencies": {
+        "clone": {
+          "version": "0.2.0",
+          "resolved": "https://registry.npmjs.org/clone/-/clone-0.2.0.tgz",
+          "integrity": "sha1-xhJqkK1Pctv1rNskPMN3JP6T/B8=",
+          "dev": true
+        },
+        "graceful-fs": {
+          "version": "3.0.11",
+          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-3.0.11.tgz",
+          "integrity": "sha1-dhPHeKGv6mLyXGMKCG1/Osu92Bg=",
+          "dev": true,
+          "requires": {
+            "natives": "1.1.0"
+          }
+        },
+        "isarray": {
+          "version": "0.0.1",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
+          "dev": true
+        },
+        "readable-stream": {
+          "version": "1.0.34",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=",
+          "dev": true,
+          "requires": {
+            "core-util-is": "1.0.2",
+            "inherits": "2.0.3",
+            "isarray": "0.0.1",
+            "string_decoder": "0.10.31"
+          }
+        },
+        "string_decoder": {
+          "version": "0.10.31",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=",
+          "dev": true
+        },
+        "through2": {
+          "version": "0.6.5",
+          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
+          "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg=",
+          "dev": true,
+          "requires": {
+            "readable-stream": "1.0.34",
+            "xtend": "4.0.1"
+          }
+        },
+        "vinyl": {
+          "version": "0.4.6",
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.4.6.tgz",
+          "integrity": "sha1-LzVsh6VQolVGHza76ypbqL94SEc=",
+          "dev": true,
+          "requires": {
+            "clone": "0.2.0",
+            "clone-stats": "0.0.1"
+          }
+        }
+      }
+    },
+    "which": {
+      "version": "1.2.14",
+      "resolved": "https://registry.npmjs.org/which/-/which-1.2.14.tgz",
+      "integrity": "sha1-mofEN48D6CfOyvGs31bHNsAcFOU=",
+      "dev": true,
+      "requires": {
+        "isexe": "2.0.0"
+      }
+    },
+    "which-module": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/which-module/-/which-module-1.0.0.tgz",
+      "integrity": "sha1-u6Y8qGGUiZT/MHc2CJ47lgJsKk8=",
+      "dev": true
+    },
+    "wordwrap": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz",
+      "integrity": "sha1-J1hIEIkUVqQXHI0CJkQa3pDLyus=",
+      "dev": true
+    },
+    "wrap-ansi": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
+      "integrity": "sha1-2Pw9KE3QV5T+hJc8rs3Rz4JP3YU=",
+      "dev": true,
+      "requires": {
+        "string-width": "1.0.2",
+        "strip-ansi": "3.0.1"
+      }
+    },
+    "wrappy": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
+      "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=",
+      "dev": true
+    },
+    "xtend": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.1.tgz",
+      "integrity": "sha1-pcbVMr5lbiPbgg77lDofBJmNY68=",
+      "dev": true
+    },
+    "y18n": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/y18n/-/y18n-3.2.1.tgz",
+      "integrity": "sha1-bRX7qITAhnnA136I53WegR4H+kE=",
+      "dev": true
+    },
+    "yargs": {
+      "version": "6.6.0",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz",
+      "integrity": "sha1-eC7CHvQDNF+DCoCMo9UTr1YGUgg=",
+      "dev": true,
+      "requires": {
+        "camelcase": "3.0.0",
+        "cliui": "3.2.0",
+        "decamelize": "1.2.0",
+        "get-caller-file": "1.0.2",
+        "os-locale": "1.4.0",
+        "read-pkg-up": "1.0.1",
+        "require-directory": "2.1.1",
+        "require-main-filename": "1.0.1",
+        "set-blocking": "2.0.0",
+        "string-width": "1.0.2",
+        "which-module": "1.0.0",
+        "y18n": "3.2.1",
+        "yargs-parser": "4.2.1"
+      }
+    },
+    "yargs-parser": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz",
+      "integrity": "sha1-KczqwNxPA8bIe0qfIX3RjJ90hxw=",
+      "dev": true,
+      "requires": {
+        "camelcase": "3.0.0"
+      }
+    },
+    "z-schema": {
+      "version": "3.17.0",
+      "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-3.17.0.tgz",
+      "integrity": "sha1-RCs4+denr3rke/z8NWhz6GFq0bc=",
+      "dev": true,
+      "requires": {
+        "commander": "2.9.0",
+        "lodash.get": "4.4.2",
+        "request": "2.81.0",
+        "validator": "5.7.0"
+      }
+    }
+  }
+}
diff --git a/package.json b/package.json
index cf8b71b46222c..d95ec089b6a79 100644
--- a/package.json
+++ b/package.json
@@ -28,4 +28,4 @@
     "gulp": "^3.9.1",
     "yargs": "^6.5.0"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
index 0d38a45cab9e3..91b9eb4664e9b 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
@@ -40,6 +40,12 @@ export interface ICalendarProps extends React.Props<Calendar> {
   */
   isDayPickerVisible?: boolean;
 
+  /**
+  * Show month picker on top of date picker when visible.
+  * @defaultvalue false
+  */
+  showMonthPickerAsOverlay?: boolean;
+
   /**
     * Value of today. If null, current time in client machine will be used.
     */
@@ -149,6 +155,16 @@ export interface ICalendarStrings {
    * Aria-label for the "next year" button.
    */
   nextYearAriaLabel?: string;
+
+  /**
+  * Aria-label for the "month picker" header. When showMonthPickerAsOverlay is true the header becomes clickable.
+  */
+  monthPickerAriaLabel?: string;
+
+  /**
+  * Aria-label for the "day picker" header. When showMonthPickerAsOverlay is true the header becomes clickable.
+  */
+  dayPickerAriaLabel?: string;
 }
 
 export interface ICalendarIconStrings {
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
index 47760e3c9ab56..5e4d5a8982302 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
@@ -228,6 +228,9 @@ $Calendar-dayPicker-margin: 10px;
   cursor: pointer;
 }
 
+.wrap div.headerToggleView:focus {
+  position: absolute;
+}
 
 // Text showing the currently-selected year.
 .currentYear,
@@ -326,6 +329,15 @@ $Calendar-dayPicker-margin: 10px;
   }
 }
 
+
+ .pickerOnlyMonthPickerVisible {
+
+  .yearComponents,
+  .decadeComponents {
+    top: 9px;
+  }
+ }
+
 // 460px and up.
 //
 // On screens that can fit it, we show the month picker next to the day picker if we have it enabled.
@@ -351,7 +363,7 @@ $Calendar-dayPicker-margin: 10px;
   }
 
   // Size the month components to the day picker's new width
-  .monthComponents {
+  .monthComponents,.yearComponents {
     width: 210px;
   }
 
@@ -389,7 +401,7 @@ $Calendar-dayPicker-margin: 10px;
     }
   }
 
-  // Show the month picker, if enabled
+  // Show the day picker and month picker side-by-side, if enabled
   .pickerIsMonthPickerVisible {
     // Swap margin for padding so that the border extends the full height.
     .dayPicker {
@@ -411,7 +423,7 @@ $Calendar-dayPicker-margin: 10px;
     .monthPicker {
       display: block;
     }
-    // Style the the month and year pickers.
+    // Style the month and year pickers.
     .monthPicker,
     .yearPicker {
       top: 9px;
@@ -425,7 +437,6 @@ $Calendar-dayPicker-margin: 10px;
 
     .optionGrid {
       width: 200px;
-      height: auto;
       @include margin(10px, 0, 0, 0);
     }
     // This component is only used on small displays.
@@ -442,6 +453,7 @@ $Calendar-dayPicker-margin: 10px;
       padding: 0 10px;
       display: inline-block;
     }
+
     // Reduce the size of the month buttons.
     .monthOption,
     .yearOption {
@@ -491,6 +503,47 @@ $Calendar-dayPicker-margin: 10px;
     }
   }
 
+  // Show the month picker over date picker (1 column layout), if enabled
+  .overlayedCalendars {
+    // Show the month picker.
+
+    .holder {
+      width: 230px;
+    }
+
+    .monthPicker {
+      display: block;
+    }
+    // Style the month and year pickers.
+    .monthPicker,
+    .yearPicker {
+      top: 0px;
+      @include ms-left(0px);
+      position: relative;
+    }
+
+    .currentYear,
+    .currentDecade {
+      padding:0px;
+    }
+
+    .optionGrid{
+      margin: 10px 0 0 10px;
+    }
+    // Arrows need to be in the same spot as the calendar
+    // when switching between the two
+    .yearComponents,
+    .decadeComponents {
+      @include ms-right(2px);
+    }
+
+    // Position the "Go to today" button below the month picker.
+    .goToday {
+      @include ms-right(5px);
+      bottom: 9px;
+    }
+  }
+
   // if only the month picker is visible, don't show day picker
   .pickerOnlyMonthPickerVisible {
     // Hide the day picking components.
@@ -509,13 +562,8 @@ $Calendar-dayPicker-margin: 10px;
     }
 
     .currentYear {
-      height: initial;
-      line-height: initial;
-    }
-
-    .yearComponents {
-      position: relative;
-      top: 0;
+      height: $Calendar-day;
+      line-height: $Calendar-day;
     }
 
     .wrap.goTodaySpacing{
@@ -527,6 +575,11 @@ $Calendar-dayPicker-margin: 10px;
 // On smaller screens the month button toggles to the picking months state.
 @media (max-width: 459px) {
 
+  //Stop elements from going off screen
+  .holder {
+    width: 300px;
+  }
+
   // State: The picker is showing the month components.
   .root.isPickingMonths {
 
@@ -540,6 +593,26 @@ $Calendar-dayPicker-margin: 10px;
     .monthPicker {
       display: block;
     }
+
+  }
+
+  // Do not hide Month picker if it is the only calendar
+  .pickerOnlyMonthPickerVisible, .overlayedCalendars{
+    .monthPicker{
+      display: block;
+    }
+
+    .optionGrid{
+      height: 210px;
+      width: 280px;
+    }
+
+    //keep arrows in place when switching between calendar and month overlay
+    .yearComponents,
+    .decadeComponents {
+      @include ms-right(9px);
+      top: 9px;
+    }
   }
 
   //additional 30px margin needed when "Go to today" button is visible
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index 354a99995798b..3a32e0b298928 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -26,6 +26,12 @@ export interface ICalendarState {
 
   /** The currently selected date in the calendar */
   selectedDate?: Date;
+
+  /** State used to show/hide month picker */
+  isMonthPickerVisible?: boolean;
+
+  /** State used to show/hide day picker */
+  isDayPickerVisible?: boolean;
 }
 
 export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> implements ICalendar {
@@ -34,6 +40,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     onDismiss: undefined,
     isMonthPickerVisible: true,
     isDayPickerVisible: true,
+    showMonthPickerAsOverlay: false,
     value: undefined,
     today: new Date(),
     firstDayOfWeek: DayOfWeek.Sunday,
@@ -55,12 +62,16 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
   private _focusOnUpdate: boolean;
 
   constructor(props: ICalendarProps) {
-    super();
-
+    super(props);
     let currentDate = props.value && !isNaN(props.value.getTime()) ? props.value : (props.today || new Date());
+
     this.state = {
       selectedDate: currentDate,
-      navigatedDate: currentDate
+      navigatedDate: currentDate,
+
+      /** When showMonthPickerAsOverlay is active it overrides isMonthPickerVisible/isDayPickerVisible props (These props permanently set the visibility of their respective calendars). */
+      isMonthPickerVisible: this.props.showMonthPickerAsOverlay ? false : this.props.isMonthPickerVisible,
+      isDayPickerVisible: this.props.showMonthPickerAsOverlay ? true : this.props.isDayPickerVisible
     };
 
     this._focusOnUpdate = false;
@@ -97,8 +108,11 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
 
   public render() {
     let rootClass = 'ms-DatePicker';
-    let { firstDayOfWeek, dateRangeType, strings, isMonthPickerVisible, isDayPickerVisible, autoNavigateOnSelection, showGoToToday, highlightCurrentMonth, navigationIcons } = this.props;
-    let { selectedDate, navigatedDate } = this.state;
+    let { firstDayOfWeek, dateRangeType, strings, showMonthPickerAsOverlay, autoNavigateOnSelection, showGoToToday, highlightCurrentMonth, navigationIcons } = this.props;
+    let { selectedDate, navigatedDate, isMonthPickerVisible, isDayPickerVisible } = this.state;
+    let onHeaderSelect = showMonthPickerAsOverlay ? this._onHeaderSelect : undefined;
+    let showSmallMonthPicker = (isMonthPickerVisible && isDayPickerVisible) || (showMonthPickerAsOverlay && isMonthPickerVisible);
+
     return (
       <div className={ css(rootClass, styles.root) } ref='root' role='application'>
         <div className={ css(
@@ -106,8 +120,9 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
           styles.picker,
           styles.pickerIsOpened,
           styles.pickerIsFocused,
-          isMonthPickerVisible && isDayPickerVisible && ('is-monthPickerVisible ' + styles.pickerIsMonthPickerVisible),
-          isMonthPickerVisible && !isDayPickerVisible && ('is-onlymonthPickerVisible ' + styles.pickerOnlyMonthPickerVisible)
+          showSmallMonthPicker && ('is-monthPickerVisible ' + styles.pickerIsMonthPickerVisible),
+          isMonthPickerVisible && !isDayPickerVisible && !showMonthPickerAsOverlay && ('is-onlymonthPickerVisible ' + styles.pickerOnlyMonthPickerVisible),
+          showMonthPickerAsOverlay && styles.overlayedCalendars,
         ) } >
           <div className={ css('ms-DatePicker-holder ms-slideDownIn10', styles.holder) } onKeyDown={ this._onDatePickerPopupKeyDown }>
             <div className={ css('ms-DatePicker-frame', styles.frame) }>
@@ -123,6 +138,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   dateRangeType={ dateRangeType! }
                   autoNavigateOnSelection={ autoNavigateOnSelection! }
                   strings={ strings! }
+                  onHeaderSelect={ onHeaderSelect }
                   navigationIcons={ navigationIcons! }
                   ref='dayPicker' />
                 }
@@ -133,6 +149,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   onNavigateDate={ this._onNavigateDate }
                   today={ this.props.today }
                   highlightCurrentMonth={ highlightCurrentMonth! }
+                  onHeaderSelect={ onHeaderSelect }
                   navigationIcons={ navigationIcons! }
                   ref='monthPicker' /> }
 
@@ -191,6 +208,18 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     }
   }
 
+  @autobind
+  private _onHeaderSelect(focus: boolean) {
+    this.setState({
+      isDayPickerVisible: !this.state.isDayPickerVisible,
+      isMonthPickerVisible: !this.state.isMonthPickerVisible
+    });
+
+    if (focus) {
+      this._focusOnUpdate = true;
+    }
+  }
+
   @autobind
   private _onGotoToday() {
     this._navigateDay(this.props.today!);
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index 105e14298492a..0e5c46075f326 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -50,6 +50,7 @@ export interface ICalendarDayProps extends React.Props<CalendarDay> {
   autoNavigateOnSelection: boolean;
   navigationIcons: ICalendarIconStrings;
   today?: Date;
+  onHeaderSelect?: (focus: boolean) => void;
 }
 
 export interface ICalendarDayState {
@@ -85,7 +86,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
 
   public render() {
     let { activeDescendantId, weeks } = this.state;
-    let { firstDayOfWeek, strings, navigatedDate, onSelectDate, navigationIcons } = this.props;
+    let { firstDayOfWeek, strings, navigatedDate, navigationIcons } = this.props;
     let dayPickerId = getId('DatePickerDay-dayPicker');
     let monthAndYearId = getId('DatePickerDay-monthAndYear');
     let leftNavigationIcon = navigationIcons.leftNavigation;
@@ -93,7 +94,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
 
     return (
       <div className={ css('ms-DatePicker-dayPicker', styles.dayPicker) } id={ dayPickerId }>
-        <div className={ css('ms-DatePicker-header', styles.header) }>
+        <div className={ css('ms-DatePicker-header', styles.header) } >
           <div aria-live='polite' aria-relevant='text' aria-atomic='true' id={ monthAndYearId }>
             <div className={ css('ms-DatePicker-month', styles.month) }>{ strings.months[navigatedDate.getMonth()] }</div>
             <div className={ css('ms-DatePicker-year', styles.year) }>{ navigatedDate.getFullYear() }</div>
@@ -114,7 +115,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
             <span
               className={ css('ms-DatePicker-nextMonth js-nextMonth', styles.nextMonth) }
               onClick={ this._onSelectNextMonth }
-              onKeyDown={ this._onKeyDown.bind(this, this._onSelectNextMonth) }
+              onKeyDown={ this.onNextMonthKeyDown }
               aria-controls={ dayPickerId }
               aria-label={ strings.nextMonthAriaLabel }
               role='button'
@@ -122,7 +123,19 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
               <Icon iconName={ getRTL() ? leftNavigationIcon : rightNavigationIcon } />
             </span >
           </div >
-          <div className={ css('ms-DatePicker-headerToggleView js-showMonthPicker', styles.headerToggleView) } />
+          {
+            this.props.onHeaderSelect ?
+              <div
+                className={ css('ms-DatePicker-headerToggleView js-showMonthPicker', styles.headerToggleView) }
+                onClick={ this._onHeaderSelect }
+                onKeyDown={ this._onHeaderKeyDown }
+                aria-label={ strings.monthPickerAriaLabel }
+                role='button'
+                tabIndex={ 0 }
+              />
+              :
+              null
+          }
         </div >
         <FocusZone>
           <table
@@ -207,12 +220,14 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
     }
   }
 
+  @autobind
   private _onKeyDown(callback: () => void, ev: React.KeyboardEvent<HTMLElement>) {
     if (ev.which === KeyCodes.enter || ev.which === KeyCodes.space) {
       callback();
     }
   }
 
+  @autobind
   private _onSelectDate(selectedDate: Date) {
     let { onSelectDate, dateRangeType, firstDayOfWeek, navigatedDate, autoNavigateOnSelection } = this.props;
 
@@ -232,27 +247,42 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
     }
   }
 
+  @autobind
   private _onSelectNextMonth() {
     this.props.onNavigateDate(addMonths(this.props.navigatedDate, 1), false);
   }
 
+  @autobind
   private _onSelectPrevMonth() {
     this.props.onNavigateDate(addMonths(this.props.navigatedDate, -1), false);
   }
 
   @autobind
-  private _onPrevMonthKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
-    if (ev.which === KeyCodes.tab && ev.shiftKey) {
-      if (this.props.onDismiss) {
-        ev.preventDefault();
-        ev.stopPropagation();
-        this.props.onDismiss();
-      }
-    } else {
-      this._onKeyDown(this._onSelectPrevMonth, ev);
+  private _onHeaderSelect() {
+    let { onHeaderSelect } = this.props;
+    if (onHeaderSelect) {
+      onHeaderSelect(true);
     }
   }
 
+  @autobind
+  private _onHeaderKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+    let { onHeaderSelect } = this.props;
+    if (onHeaderSelect && (ev.which === KeyCodes.enter || ev.which === KeyCodes.space)) {
+      onHeaderSelect(true);
+    }
+  }
+
+  @autobind
+  private _onPrevMonthKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+    this._onKeyDown(this._onSelectPrevMonth, ev);
+  }
+
+  @autobind
+  private onNextMonthKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+    this._onKeyDown(this._onSelectNextMonth, ev);
+  }
+
   private _getWeeks(propsToUse: ICalendarDayProps): IDayInfo[][] {
     let { navigatedDate, selectedDate, dateRangeType, firstDayOfWeek, today } = propsToUse;
     let date = new Date(navigatedDate.getFullYear(), navigatedDate.getMonth(), 1);
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
index b632c5b19006c..6458a53b69def 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
@@ -3,7 +3,8 @@ import {
   BaseComponent,
   KeyCodes,
   css,
-  getRTL
+  getRTL,
+  autobind
 } from '../../Utilities';
 import { ICalendarStrings, ICalendarIconStrings } from './Calendar.Props';
 import { FocusZone } from '../../FocusZone';
@@ -19,6 +20,7 @@ export interface ICalendarMonthProps extends React.Props<CalendarMonth> {
   onNavigateDate: (date: Date, focusOnNavigatedDay: boolean) => void;
   today?: Date;
   highlightCurrentMonth: boolean;
+  onHeaderSelect?: (focus: boolean) => void;
   navigationIcons: ICalendarIconStrings;
 }
 
@@ -53,31 +55,42 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
     return (
       <div className={ css('ms-DatePicker-monthPicker', styles.monthPicker) }>
         <div className={ css('ms-DatePicker-header', styles.header) }>
-          <div className={ css(
-            'ms-DatePicker-yearComponents ms-DatePicker-navContainer',
-            styles.yearComponents,
-            styles.navContainer
-          ) }>
-            <span
-              className={ css('ms-DatePicker-prevYear js-prevYear', styles.prevYear) }
-              onClick={ this._onSelectPrevYear }
-              onKeyDown={ this._onKeyDown.bind(this, this._onSelectPrevYear) }
-              aria-label={ strings.prevYearAriaLabel }
-              role='button'
-              tabIndex={ 0 }>
-              <Icon iconName={ getRTL() ? rightNavigationIcon : leftNavigationIcon } />
-            </span>
-            <span
-              className={ css('ms-DatePicker-nextYear js-nextYear', styles.nextYear) }
-              onClick={ this._onSelectNextYear }
-              onKeyDown={ this._onKeyDown.bind(this, this._onSelectNextYear) }
-              aria-label={ strings.nextYearAriaLabel }
-              role='button'
-              tabIndex={ 0 }>
-              <Icon iconName={ getRTL() ? leftNavigationIcon : rightNavigationIcon } />
-            </span>
-          </div>
           <div className={ css('ms-DatePicker-currentYear js-showYearPicker', styles.currentYear) }>{ navigatedDate.getFullYear() }</div>
+          <div className={ css('ms-DatePicker-yearComponents', styles.yearComponents) }>
+            <div className={ css('ms-DatePicker-navContainer', styles.navContainer) }>
+              <span
+                className={ css('ms-DatePicker-prevYear js-prevYear', styles.prevYear) }
+                onClick={ this._onSelectPrevYear }
+                onKeyDown={ this._onSelectPrevYearKeyDown }
+                aria-label={ strings.prevYearAriaLabel }
+                role='button'
+                tabIndex={ 0 }>
+                <Icon iconName={ getRTL() ? rightNavigationIcon : leftNavigationIcon } />
+              </span>
+              <span
+                className={ css('ms-DatePicker-nextYear js-nextYear', styles.nextYear) }
+                onClick={ this._onSelectNextYear }
+                onKeyDown={ this._onSelectNextYearKeyDown }
+                aria-label={ strings.nextYearAriaLabel }
+                role='button'
+                tabIndex={ 0 }>
+                <Icon iconName={ getRTL() ? leftNavigationIcon : rightNavigationIcon } />
+              </span>
+            </div>
+          </div>
+          {
+            this.props.onHeaderSelect ?
+              <div
+                className={ css('ms-DatePicker-headerToggleView js-showYearPicker', styles.headerToggleView) }
+                onClick={ this._onHeaderSelect }
+                onKeyDown={ this._onHeaderKeyDown }
+                aria-label={ strings.dayPickerAriaLabel }
+                role='button'
+                tabIndex={ 0 }
+              />
+              :
+              null
+          }
         </div>
         <FocusZone>
           <div className={ css('ms-DatePicker-optionGrid', styles.optionGrid) }>
@@ -117,24 +130,59 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
     return today.getFullYear() === year && today.getMonth() === month;
   }
 
+  @autobind
   private _onKeyDown(callback: () => void, ev: React.KeyboardEvent<HTMLElement>) {
     if (ev.which === KeyCodes.enter || ev.which === KeyCodes.space) {
       callback();
     }
   }
 
+  @autobind
   private _onSelectNextYear() {
     let { navigatedDate, onNavigateDate } = this.props;
     onNavigateDate(addYears(navigatedDate, 1), false);
   }
 
+  @autobind
+  private _onSelectNextYearKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+    this._onKeyDown(this._onSelectNextYear, ev);
+  }
+
+  @autobind
   private _onSelectPrevYear() {
     let { navigatedDate, onNavigateDate } = this.props;
     onNavigateDate(addYears(navigatedDate, -1), false);
   }
 
+  @autobind
+  private _onSelectPrevYearKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+    this._onKeyDown(this._onSelectNextYear, ev);
+  }
+
+  @autobind
   private _onSelectMonth(newMonth: number) {
-    let { navigatedDate, onNavigateDate } = this.props;
+    let { navigatedDate, onNavigateDate, onHeaderSelect } = this.props;
+
+    // If header is clickable the calendars are overlayed, switch back to day picker when month is clicked
+    if (onHeaderSelect) {
+      onHeaderSelect(true);
+    }
     onNavigateDate(setMonth(navigatedDate, newMonth), true);
   }
+
+  @autobind
+  private _onHeaderSelect() {
+    let { onHeaderSelect } = this.props;
+    if (onHeaderSelect) {
+      onHeaderSelect(true);
+    }
+  }
+
+  @autobind
+  private _onHeaderKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+    let { onHeaderSelect } = this.props;
+    if (onHeaderSelect && (ev.which === KeyCodes.enter || ev.which === KeyCodes.space)) {
+      onHeaderSelect(true);
+    }
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
index 0a0ecdac7f1eb..9dd97aa02310a 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
@@ -24,20 +24,24 @@ export class CalendarPage extends React.Component<IComponentDemoPageProps, any>
               <CalendarInlineExample isMonthPickerVisible={ false } dateRangeType={ DateRangeType.Day } autoNavigateOnSelection={ false }
                 showGoToToday={ false } />
             </ExampleCard>
+            <ExampleCard title='Inline Calendar with overlayed month picker when header is clicked' code={ CalendarInlineExampleCode }>
+              <CalendarInlineExample showMonthPickerAsOverlay={ true } highlightCurrentMonth={ true } dateRangeType={ DateRangeType.Day } autoNavigateOnSelection={ false }
+                showGoToToday={ true } />
+            </ExampleCard>
             <ExampleCard title='Inline Calendar with month picker' code={ CalendarInlineExampleCode }>
-              <CalendarInlineExample isMonthPickerVisible={ true } dateRangeType={ DateRangeType.Day } autoNavigateOnSelection={ false }
+              <CalendarInlineExample dateRangeType={ DateRangeType.Day } autoNavigateOnSelection={ false }
                 showGoToToday={ true } />
             </ExampleCard>
             <ExampleCard title='Inline Calendar with week selection' code={ CalendarInlineExampleCode }>
-              <CalendarInlineExample isMonthPickerVisible={ true } dateRangeType={ DateRangeType.Week } autoNavigateOnSelection={ true }
+              <CalendarInlineExample dateRangeType={ DateRangeType.Week } autoNavigateOnSelection={ true }
                 showGoToToday={ true } showNavigateButtons={ true } />
             </ExampleCard>
             <ExampleCard title='Inline Calendar with month selection' code={ CalendarInlineExampleCode }>
-              <CalendarInlineExample isMonthPickerVisible={ true } dateRangeType={ DateRangeType.Month } autoNavigateOnSelection={ true }
+              <CalendarInlineExample dateRangeType={ DateRangeType.Month } autoNavigateOnSelection={ true }
                 showGoToToday={ true } showNavigateButtons={ true } />
             </ExampleCard>
             <ExampleCard title='Inline Calendar with month picker and no day picker' code={ CalendarInlineExampleCode }>
-              <CalendarInlineExample isMonthPickerVisible={ true } dateRangeType={ DateRangeType.Month } autoNavigateOnSelection={ false }
+              <CalendarInlineExample dateRangeType={ DateRangeType.Month } autoNavigateOnSelection={ false }
                 showGoToToday={ true } highlightCurrentMonth={ true } isDayPickerVisible={ false } />
             </ExampleCard>
             <ExampleCard title='Calendar launched from a button' code={ CalendarButtonExampleCode }>
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
index 6d53296ccf67a..a9b68e8df3652 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
@@ -67,13 +67,14 @@ export interface ICalendarInlineExampleState {
 }
 
 export interface ICalendarInlineExampleProps {
-  isMonthPickerVisible: boolean;
+  isMonthPickerVisible?: boolean;
   dateRangeType: DateRangeType;
   autoNavigateOnSelection: boolean;
   showGoToToday: boolean;
   showNavigateButtons?: boolean;
   highlightCurrentMonth?: boolean;
   isDayPickerVisible?: boolean;
+  showMonthPickerAsOverlay?: boolean;
 }
 
 export class CalendarInlineExample extends React.Component<ICalendarInlineExampleProps, ICalendarInlineExampleState> {
@@ -129,6 +130,7 @@ export class CalendarInlineExample extends React.Component<ICalendarInlineExampl
           strings={ DayPickerStrings }
           highlightCurrentMonth={ this.props.highlightCurrentMonth }
           isDayPickerVisible={ this.props.isDayPickerVisible }
+          showMonthPickerAsOverlay={ this.props.showMonthPickerAsOverlay }
         >
         </Calendar>
         { this.props.showNavigateButtons &&

From 6ea835ec7c1324dee1e8fbf1e212b44beee286bd Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 16 Aug 2017 10:11:43 +0000
Subject: [PATCH 0425/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...arOverlayEnhancement_2017-08-04-17-25.json | 11 ---------
 ...darRemoveExtraMargin_2017-08-10-23-23.json | 11 ---------
 .../list-paging_2017-08-08-18-00.json         | 11 ---------
 packages/experiments/CHANGELOG.json           | 12 ++++++++++
 packages/experiments/CHANGELOG.md             |  7 +++++-
 packages/experiments/package.json             |  4 ++--
 .../office-ui-fabric-react/CHANGELOG.json     | 24 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 11 ++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 13 files changed, 59 insertions(+), 42 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-CalendarOverlayEnhancement_2017-08-04-17-25.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-CalendarRemoveExtraMargin_2017-08-10-23-23.json
 delete mode 100644 common/changes/office-ui-fabric-react/list-paging_2017-08-08-18-00.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index a9d1698a5e6b4..3ce42f3da4dfb 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -74,7 +74,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.33.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.34.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 4543be98e6a99..0b8a7e0c9a319 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.33.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.34.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index e8004331c5cb4..d9db3dbad913d 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -35,7 +35,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.33.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.34.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index b2c98563dd8fb..03dae1d3580d4 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.33.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.34.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/kegorr-CalendarOverlayEnhancement_2017-08-04-17-25.json b/common/changes/office-ui-fabric-react/kegorr-CalendarOverlayEnhancement_2017-08-04-17-25.json
deleted file mode 100644
index 77a7e42dce26a..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-CalendarOverlayEnhancement_2017-08-04-17-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Enhancing the calendar component.  Created option to have month picker overlayed on top of calendar so that the calendar remains in one column and switches between the two.  Added accessibility in new overlay to mimi OWA calendar.  Fixed issue: When the month picker is the only calendar, and screen is small, calendar would disappear when it should be visible.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kegorr-CalendarRemoveExtraMargin_2017-08-10-23-23.json b/common/changes/office-ui-fabric-react/kegorr-CalendarRemoveExtraMargin_2017-08-10-23-23.json
deleted file mode 100644
index 3ce23f20b753d..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-CalendarRemoveExtraMargin_2017-08-10-23-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Calendar had extra 30px margin at the bottom of the component.  It interfered with the layout below the component.  The 30px margin is only necessary when the 'go to today' button is visible.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/list-paging_2017-08-08-18-00.json b/common/changes/office-ui-fabric-react/list-paging_2017-08-08-18-00.json
deleted file mode 100644
index 37f08a4061035..0000000000000
--- a/common/changes/office-ui-fabric-react/list-paging_2017-08-08-18-00.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add ability to override page render behavior in List",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index cb8ef4af3b15b..ae7affdab5df5 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,18 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "0.0.2",
+      "tag": "@uifabric/experiments_v0.0.2",
+      "date": "Wed, 16 Aug 2017 10:11:43 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `4.33.0` to `4.34.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.0.1",
       "tag": "@uifabric/experiments_v0.0.1",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 878d6a4557bff..a02343743596e 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Tue, 15 Aug 2017 10:19:22 GMT and should not be manually modified.
+This log was last generated on Wed, 16 Aug 2017 10:11:43 GMT and should not be manually modified.
+
+## 0.0.2
+Wed, 16 Aug 2017 10:11:43 GMT
+
+*Changes not tracked*
 
 ## 0.0.1
 Tue, 15 Aug 2017 10:19:22 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 22a5d86380500..fad1f0a658035 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -64,7 +64,7 @@
     "webpack-notifier": "^1.5.0"
   },
   "dependencies": {
-    "office-ui-fabric-react": "4.33.0"
+    "office-ui-fabric-react": "4.34.0"
   },
   "peerDependencies": {
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index f512e69534082..8cffbe78be7d4 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.34.0",
+      "tag": "office-ui-fabric-react_v4.34.0",
+      "date": "Wed, 16 Aug 2017 10:11:43 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "408bddf8bc49210e6a904dd9607fc522370ff6a8",
+            "comment": "Enhancing the calendar component.  Created option to have month picker overlayed on top of calendar so that the calendar remains in one column and switches between the two.  Added accessibility in new overlay to mimi OWA calendar.  Fixed issue: When the month picker is the only calendar, and screen is small, calendar would disappear when it should be visible."
+          },
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "d67af9b7cb454b35931c33fb8f0e9f9f65330876",
+            "comment": "Calendar had extra 30px margin at the bottom of the component.  It interfered with the layout below the component.  The 30px margin is only necessary when the 'go to today' button is visible."
+          },
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "8d6bf682d48e2e54d5b5aaa73ab2f0265c907f30",
+            "comment": "Add ability to override page render behavior in List"
+          }
+        ]
+      }
+    },
     {
       "version": "4.33.0",
       "tag": "office-ui-fabric-react_v4.33.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index f875bc75a7c85..bb6f91ab74457 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,15 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 15 Aug 2017 10:19:22 GMT and should not be manually modified.
+This log was last generated on Wed, 16 Aug 2017 10:11:43 GMT and should not be manually modified.
+
+## 4.34.0
+Wed, 16 Aug 2017 10:11:43 GMT
+
+### Minor changes
+
+- Enhancing the calendar component.  Created option to have month picker overlayed on top of calendar so that the calendar remains in one column and switches between the two.  Added accessibility in new overlay to mimi OWA calendar.  Fixed issue: When the month picker is the only calendar, and screen is small, calendar would disappear when it should be visible.
+- Calendar had extra 30px margin at the bottom of the component.  It interfered with the layout below the component.  The 30px margin is only necessary when the 'go to today' button is visible.
+- Add ability to override page render behavior in List
 
 ## 4.33.0
 Tue, 15 Aug 2017 10:19:22 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 7514315ab6d36..6455245e13806 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.33.0",
+  "version": "4.34.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From ec2a0c25f756846079d25f97a768c584682c85b2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pablo=20N=C3=BA=C3=B1ez?= <pablonete@gmail.com>
Date: Wed, 16 Aug 2017 17:48:48 +0200
Subject: [PATCH 0426/1641] TooltipHost: new onTooltipToggle callback prop
 (#2477)

* TooltipHost: new onTooltipToggle.

* Add change description.

* Use getId, better practice to avoid collisions.

* Set aria-describedby only on tooltip visible.

* Clean up "none" changes.

* Call prop in the setState callback.

Thus we ensure we are not using any stale value. We only read state on the callback which is safest.
Also removed optional from isTooltipVisible so we can use it as not-null.
---
 ...Host-onTooltipToggle_2017-08-11-16-12.json | 11 ++++++++++
 .../components/Tooltip/TooltipHost.Props.ts   |  5 +++++
 .../src/components/Tooltip/TooltipHost.tsx    | 21 +++++++++---------
 .../examples/Tooltip.Overflow.Example.tsx     | 22 ++++++++++++++-----
 4 files changed, 44 insertions(+), 15 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/tooltipHost-onTooltipToggle_2017-08-11-16-12.json

diff --git a/common/changes/office-ui-fabric-react/tooltipHost-onTooltipToggle_2017-08-11-16-12.json b/common/changes/office-ui-fabric-react/tooltipHost-onTooltipToggle_2017-08-11-16-12.json
new file mode 100644
index 0000000000000..2d45e8f0c72f9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/tooltipHost-onTooltipToggle_2017-08-11-16-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "TooltipHost: new onTooltipToggle callback",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-panu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.Props.ts b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.Props.ts
index 6c13079b0a628..9032a2118ee2c 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.Props.ts
@@ -75,4 +75,9 @@ export interface ITooltipHostProps extends React.HTMLAttributes<HTMLDivElement |
    * Optional class name to apply to tooltip host.
    */
   hostClassName?: string;
+
+  /**
+   * Notifies when tooltip becomes visible or hidden, whatever the trigger was.
+   */
+  onTooltipToggle?(isTooltipVisible: boolean): void;
 }
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
index b085e7aafd094..a5703adebd885 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
@@ -19,7 +19,7 @@ import * as stylesImport from './TooltipHost.scss';
 const styles: any = stylesImport;
 
 export interface ITooltipHostState {
-  isTooltipVisible?: boolean;
+  isTooltipVisible: boolean;
 }
 
 export class TooltipHost extends BaseComponent<ITooltipHostProps, ITooltipHostState> {
@@ -114,24 +114,25 @@ export class TooltipHost extends BaseComponent<ITooltipHostProps, ITooltipHostSt
       }
     }
 
-    this.setState({
-      isTooltipVisible: true
-    });
+    this.toggleTooltip(true);
   }
 
   // Hide Tooltip
   @autobind
   private _onTooltipMouseLeave(ev: any) {
-    this.setState({
-      isTooltipVisible: false
-    });
+    this.toggleTooltip(false);
   }
 
   // Hide Tooltip
   @autobind
   private _onTooltipCallOutDismiss() {
-    this.setState({
-      isTooltipVisible: false
-    });
+    this.toggleTooltip(false);
+  }
+
+  private toggleTooltip(isTooltipVisible: boolean) {
+    this.setState(
+      { isTooltipVisible },
+      () => this.props.onTooltipToggle &&
+        this.props.onTooltipToggle(this.state.isTooltipVisible));
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/examples/Tooltip.Overflow.Example.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/examples/Tooltip.Overflow.Example.tsx
index 7fd1d95f7895b..8b5835fb47220 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/examples/Tooltip.Overflow.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/examples/Tooltip.Overflow.Example.tsx
@@ -1,19 +1,27 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
-import { BaseComponent, css } from 'office-ui-fabric-react/lib/Utilities';
+import { BaseComponent, css, getId } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import {
   TooltipHost,
   TooltipOverflowMode
 } from 'office-ui-fabric-react/lib/Tooltip';
 
-export class TooltipOverflowExample extends BaseComponent<any, any> {
+export interface ITooltipOverflowExampleState {
+  overflow: boolean;
+  isTooltipVisible: boolean;
+}
+
+export class TooltipOverflowExample extends BaseComponent<{}, ITooltipOverflowExampleState> {
+  private readonly tooltipId = getId('text-tooltip');
+
   constructor(props: any) {
     super(props);
 
     this.state = {
-      overflow: false
+      overflow: false,
+      isTooltipVisible: false,
     };
   }
 
@@ -32,8 +40,12 @@ export class TooltipOverflowExample extends BaseComponent<any, any> {
             width: this.state.overflow && '200px',
             border: '1px solid black'
           } }>
-            <TooltipHost content='This is the tooltip' id='myID' overflowMode={ TooltipOverflowMode.Parent }>
-              <span aria-describedby='myID'>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec volutpat lectus ut magna sodales, sit amet accumsan arcu accumsan. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</span>
+            <TooltipHost
+              content='This is the tooltip'
+              id={ this.tooltipId }
+              overflowMode={ TooltipOverflowMode.Parent }
+              onTooltipToggle={ isTooltipVisible => this.setState({ isTooltipVisible }) }>
+              <span aria-describedby={ this.state.isTooltipVisible ? this.tooltipId : undefined }>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec volutpat lectus ut magna sodales, sit amet accumsan arcu accumsan. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</span>
             </TooltipHost>
           </div>
         </div>

From f24367cada9bfa7c55019d8c39a919068657f58b Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 16 Aug 2017 09:27:01 -0700
Subject: [PATCH 0427/1641] misc. (#2523)

---
 .vscode/settings.json                  |   8 +
 apps/fabric-website/package.json       |   2 -
 apps/fabric-website/src/root.tsx       |   2 +-
 common/config/rush/npm-shrinkwrap.json | 605 ++-----------------------
 4 files changed, 54 insertions(+), 563 deletions(-)

diff --git a/.vscode/settings.json b/.vscode/settings.json
index 932233ce65a98..8807589f04b73 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -16,6 +16,14 @@
     "**/coverage": true,
     "**/*.scss.ts": true
   },
+  "files.watcherExclude": {
+    "**/.git/objects/**": true,
+    "**/.git/subtree-cache/**": true,
+    "**/node_modules/**": true,
+    "**/tmp/**": true,
+    "**/bower_components/**": true,
+    "**/dist/**": true
+  },
   // Configure glob patterns for excluding files and folders in searches. Inherits all glob patterns from the file.exclude setting.
   "search.exclude": {
     "common": true,
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 3ce42f3da4dfb..36d1129ed4e36 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -29,7 +29,6 @@
     "@types/react-addons-test-utils": "0.14.19",
     "@types/react-dom": "15.5.1",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": "4.1.1",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -69,7 +68,6 @@
   },
   "dependencies": {
     "@uifabric/example-app-base": ">=4.2.0 <5.0.0",
-    "@uifabric/utilities": ">=4.9.0 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
diff --git a/apps/fabric-website/src/root.tsx b/apps/fabric-website/src/root.tsx
index 0b2990966e7fc..b42fa4264dc2a 100644
--- a/apps/fabric-website/src/root.tsx
+++ b/apps/fabric-website/src/root.tsx
@@ -6,7 +6,7 @@ import { App } from './components/App/App';
 import { AppState } from './components/App/AppState';
 import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
 import { Route, Router } from 'office-ui-fabric-react/lib/utilities/router/index';
-import { setBaseUrl } from '@uifabric/utilities/lib/resources';
+import { setBaseUrl } from 'office-ui-fabric-react/lib/Utilities';
 import { HomePage } from './pages/HomePage/HomePage';
 import WindowWidthUtility from './utilities/WindowWidthUtility';
 import './styles/styles.scss';
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index c1ddee2792ec9..7c74f3e98b402 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -240,9 +240,9 @@
       }
     },
     "@microsoft/load-themed-styles": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.0.tgz",
-      "integrity": "sha1-y2nzOhcQgKSt0ZUKE8W59RapUdI="
+      "version": "1.7.1",
+      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.1.tgz",
+      "integrity": "sha1-hpLvLfbRmczGF5AIJqcM88yex2E="
     },
     "@microsoft/loader-cased-file": {
       "version": "1.0.1",
@@ -1069,7 +1069,7 @@
       }
     },
     "@rush-temp/example-app-base": {
-      "version": "file:projects\\example-app-base",
+      "version": "file:projects/example-app-base",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1314,7 +1314,7 @@
       }
     },
     "@rush-temp/experiments": {
-      "version": "file:projects\\experiments",
+      "version": "file:projects/experiments",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1537,7 +1537,7 @@
       }
     },
     "@rush-temp/fabric-website": {
-      "version": "file:projects\\fabric-website",
+      "version": "file:projects/fabric-website",
       "dependencies": {
         "@types/react": {
           "version": "15.0.38",
@@ -1741,6 +1741,10 @@
               "version": "2.5.0",
               "bundled": true
             },
+            "camelcase": {
+              "version": "4.1.0",
+              "bundled": true
+            },
             "has-flag": {
               "version": "2.0.0",
               "bundled": true
@@ -1756,6 +1760,14 @@
             "supports-color": {
               "version": "4.2.1",
               "bundled": true
+            },
+            "yargs": {
+              "version": "8.0.2",
+              "bundled": true
+            },
+            "yargs-parser": {
+              "version": "7.0.0",
+              "bundled": true
             }
           }
         },
@@ -1784,7 +1796,7 @@
       }
     },
     "@rush-temp/office-ui-fabric-react": {
-      "version": "file:projects\\office-ui-fabric-react",
+      "version": "file:projects/office-ui-fabric-react",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -2002,6 +2014,10 @@
               "version": "2.5.0",
               "bundled": true
             },
+            "has-flag": {
+              "version": "2.0.0",
+              "bundled": true
+            },
             "loader-utils": {
               "version": "1.1.0",
               "bundled": true
@@ -2009,6 +2025,10 @@
             "source-map": {
               "version": "0.5.6",
               "bundled": true
+            },
+            "supports-color": {
+              "version": "4.2.1",
+              "bundled": true
             }
           }
         },
@@ -2037,10 +2057,10 @@
       }
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
-      "version": "file:projects\\office-ui-fabric-react-tslint"
+      "version": "file:projects/office-ui-fabric-react-tslint"
     },
     "@rush-temp/ssr-tests": {
-      "version": "file:projects\\ssr-tests",
+      "version": "file:projects/ssr-tests",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -2255,7 +2275,7 @@
       }
     },
     "@rush-temp/styling": {
-      "version": "file:projects\\styling",
+      "version": "file:projects/styling",
       "dependencies": {
         "@uifabric/utilities": {
           "version": "1.10.4",
@@ -2481,6 +2501,10 @@
               "version": "2.5.0",
               "bundled": true
             },
+            "has-flag": {
+              "version": "2.0.0",
+              "bundled": true
+            },
             "loader-utils": {
               "version": "1.1.0",
               "bundled": true
@@ -2488,6 +2512,10 @@
             "source-map": {
               "version": "0.5.6",
               "bundled": true
+            },
+            "supports-color": {
+              "version": "4.2.1",
+              "bundled": true
             }
           }
         },
@@ -2516,7 +2544,7 @@
       }
     },
     "@rush-temp/test-bundle-button": {
-      "version": "file:projects\\test-bundle-button",
+      "version": "file:projects/test-bundle-button",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -2745,7 +2773,7 @@
       }
     },
     "@rush-temp/todo-app": {
-      "version": "file:projects\\todo-app",
+      "version": "file:projects/todo-app",
       "dependencies": {
         "typescript": {
           "version": "2.4.2",
@@ -2754,7 +2782,7 @@
       }
     },
     "@rush-temp/utilities": {
-      "version": "file:projects\\utilities",
+      "version": "file:projects/utilities",
       "dependencies": {
         "async": {
           "version": "0.9.2",
@@ -3062,9 +3090,9 @@
       "integrity": "sha1-LrHQCl5Ow/pYx2r94S4YK2bcXBw="
     },
     "@uifabric/example-app-base": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-4.1.1.tgz",
-      "integrity": "sha512-CFIyoGyfnoC/pEp1exoKAeJuJr8vFc/ldKP0RDtD9IIdEqUBAQiByah6+bGMxntAtD84Osg6WCXcA1DpVlM75g=="
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-4.2.0.tgz",
+      "integrity": "sha512-2DN1KzfSoF+D/gAjJC9JEQC03HfKeRcHz5uNTPd3DDZte8SrZZ32MS+9bIR+2grQPf911l9MZtpafHBxVsaFdw=="
     },
     "@uifabric/styling": {
       "version": "0.19.2",
@@ -5319,549 +5347,6 @@
       "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
       "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
     },
-    "fsevents": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.2.tgz",
-      "integrity": "sha512-Sn44E5wQW4bTHXvQmvSHwqbuiXtduD6Rrjm2ZtUEGbyrig+nUH3t/QD4M4/ZXViY556TBpRgZkHLDx3JxPwxiw==",
-      "optional": true,
-      "dependencies": {
-        "abbrev": {
-          "version": "1.1.0",
-          "bundled": true,
-          "optional": true
-        },
-        "ajv": {
-          "version": "4.11.8",
-          "bundled": true,
-          "optional": true
-        },
-        "ansi-regex": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "aproba": {
-          "version": "1.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "are-we-there-yet": {
-          "version": "1.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "asn1": {
-          "version": "0.2.3",
-          "bundled": true,
-          "optional": true
-        },
-        "assert-plus": {
-          "version": "0.2.0",
-          "bundled": true,
-          "optional": true
-        },
-        "asynckit": {
-          "version": "0.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "aws-sign2": {
-          "version": "0.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "aws4": {
-          "version": "1.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "balanced-match": {
-          "version": "0.4.2",
-          "bundled": true
-        },
-        "bcrypt-pbkdf": {
-          "version": "1.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "block-stream": {
-          "version": "0.0.9",
-          "bundled": true
-        },
-        "boom": {
-          "version": "2.10.1",
-          "bundled": true
-        },
-        "brace-expansion": {
-          "version": "1.1.7",
-          "bundled": true
-        },
-        "buffer-shims": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "caseless": {
-          "version": "0.12.0",
-          "bundled": true,
-          "optional": true
-        },
-        "co": {
-          "version": "4.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "code-point-at": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "combined-stream": {
-          "version": "1.0.5",
-          "bundled": true
-        },
-        "concat-map": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "console-control-strings": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "core-util-is": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "cryptiles": {
-          "version": "2.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "dashdash": {
-          "version": "1.14.1",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true,
-          "optional": true
-        },
-        "deep-extend": {
-          "version": "0.4.2",
-          "bundled": true,
-          "optional": true
-        },
-        "delayed-stream": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "delegates": {
-          "version": "1.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "ecc-jsbn": {
-          "version": "0.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "extend": {
-          "version": "3.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "extsprintf": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "forever-agent": {
-          "version": "0.6.1",
-          "bundled": true,
-          "optional": true
-        },
-        "form-data": {
-          "version": "2.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "fs.realpath": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "fstream": {
-          "version": "1.0.11",
-          "bundled": true
-        },
-        "fstream-ignore": {
-          "version": "1.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "gauge": {
-          "version": "2.7.4",
-          "bundled": true,
-          "optional": true
-        },
-        "getpass": {
-          "version": "0.1.7",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "glob": {
-          "version": "7.1.2",
-          "bundled": true
-        },
-        "graceful-fs": {
-          "version": "4.1.11",
-          "bundled": true
-        },
-        "har-schema": {
-          "version": "1.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "har-validator": {
-          "version": "4.2.1",
-          "bundled": true,
-          "optional": true
-        },
-        "has-unicode": {
-          "version": "2.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "hawk": {
-          "version": "3.1.3",
-          "bundled": true,
-          "optional": true
-        },
-        "hoek": {
-          "version": "2.16.3",
-          "bundled": true
-        },
-        "http-signature": {
-          "version": "1.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "inflight": {
-          "version": "1.0.6",
-          "bundled": true
-        },
-        "inherits": {
-          "version": "2.0.3",
-          "bundled": true
-        },
-        "ini": {
-          "version": "1.3.4",
-          "bundled": true,
-          "optional": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "is-typedarray": {
-          "version": "1.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "isstream": {
-          "version": "0.1.2",
-          "bundled": true,
-          "optional": true
-        },
-        "jodid25519": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "jsbn": {
-          "version": "0.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "json-schema": {
-          "version": "0.2.3",
-          "bundled": true,
-          "optional": true
-        },
-        "json-stable-stringify": {
-          "version": "1.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "json-stringify-safe": {
-          "version": "5.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "jsonify": {
-          "version": "0.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "jsprim": {
-          "version": "1.4.0",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "mime-db": {
-          "version": "1.27.0",
-          "bundled": true
-        },
-        "mime-types": {
-          "version": "2.1.15",
-          "bundled": true
-        },
-        "minimatch": {
-          "version": "3.0.4",
-          "bundled": true
-        },
-        "minimist": {
-          "version": "0.0.8",
-          "bundled": true
-        },
-        "mkdirp": {
-          "version": "0.5.1",
-          "bundled": true
-        },
-        "ms": {
-          "version": "2.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "node-pre-gyp": {
-          "version": "0.6.36",
-          "bundled": true,
-          "optional": true
-        },
-        "nopt": {
-          "version": "4.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "npmlog": {
-          "version": "4.1.0",
-          "bundled": true,
-          "optional": true
-        },
-        "number-is-nan": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "oauth-sign": {
-          "version": "0.8.2",
-          "bundled": true,
-          "optional": true
-        },
-        "object-assign": {
-          "version": "4.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "once": {
-          "version": "1.4.0",
-          "bundled": true
-        },
-        "os-homedir": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "os-tmpdir": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "osenv": {
-          "version": "0.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "path-is-absolute": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "performance-now": {
-          "version": "0.2.0",
-          "bundled": true,
-          "optional": true
-        },
-        "process-nextick-args": {
-          "version": "1.0.7",
-          "bundled": true
-        },
-        "punycode": {
-          "version": "1.4.1",
-          "bundled": true,
-          "optional": true
-        },
-        "qs": {
-          "version": "6.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "rc": {
-          "version": "1.2.1",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "minimist": {
-              "version": "1.2.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "readable-stream": {
-          "version": "2.2.9",
-          "bundled": true
-        },
-        "request": {
-          "version": "2.81.0",
-          "bundled": true,
-          "optional": true
-        },
-        "rimraf": {
-          "version": "2.6.1",
-          "bundled": true
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "bundled": true
-        },
-        "semver": {
-          "version": "5.3.0",
-          "bundled": true,
-          "optional": true
-        },
-        "set-blocking": {
-          "version": "2.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "signal-exit": {
-          "version": "3.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "sntp": {
-          "version": "1.0.9",
-          "bundled": true,
-          "optional": true
-        },
-        "sshpk": {
-          "version": "1.13.0",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "string_decoder": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "stringstream": {
-          "version": "0.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "strip-ansi": {
-          "version": "3.0.1",
-          "bundled": true
-        },
-        "strip-json-comments": {
-          "version": "2.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "tar": {
-          "version": "2.2.1",
-          "bundled": true
-        },
-        "tar-pack": {
-          "version": "3.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "tough-cookie": {
-          "version": "2.3.2",
-          "bundled": true,
-          "optional": true
-        },
-        "tunnel-agent": {
-          "version": "0.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "tweetnacl": {
-          "version": "0.14.5",
-          "bundled": true,
-          "optional": true
-        },
-        "uid-number": {
-          "version": "0.0.6",
-          "bundled": true,
-          "optional": true
-        },
-        "util-deprecate": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "uuid": {
-          "version": "3.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "verror": {
-          "version": "1.3.6",
-          "bundled": true,
-          "optional": true
-        },
-        "wide-align": {
-          "version": "1.1.2",
-          "bundled": true,
-          "optional": true
-        },
-        "wrappy": {
-          "version": "1.0.2",
-          "bundled": true
-        }
-      }
-    },
     "fstream": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
@@ -12038,4 +11523,4 @@
       "integrity": "sha1-RCs4+denr3rke/z8NWhz6GFq0bc="
     }
   }
-}
+}
\ No newline at end of file

From ca84a2625b70408020b4c13775149c4d0f561aae Mon Sep 17 00:00:00 2001
From: Aadhar Surange <adhargithub@gmail.com>
Date: Wed, 16 Aug 2017 22:43:06 +0530
Subject: [PATCH 0428/1641] Fixing 2 bugs 2501 & 2461 (#2502)

* Making collapse/expand all button keyboard accessible

* adding aria-expanded to command bar overflow button

* Adding change file
---
 .../users-adsurang-14aug_2017-08-15-05-25.json        | 11 +++++++++++
 .../users-adsurang-14aug_2017-08-15-05-25.json        | 11 +++++++++++
 .../users-adsurang-14aug_2017-08-15-05-25.json        | 11 +++++++++++
 .../users-adsurang-14aug_2017-08-15-05-25.json        | 11 +++++++++++
 .../users-adsurang-14aug_2017-08-15-05-25.json        | 11 +++++++++++
 .../src/components/CommandBar/CommandBar.tsx          |  1 +
 .../src/components/DetailsList/DetailsHeader.tsx      |  1 +
 7 files changed, 57 insertions(+)
 create mode 100644 common/changes/@uifabric/example-app-base/users-adsurang-14aug_2017-08-15-05-25.json
 create mode 100644 common/changes/@uifabric/fabric-website/users-adsurang-14aug_2017-08-15-05-25.json
 create mode 100644 common/changes/@uifabric/styling/users-adsurang-14aug_2017-08-15-05-25.json
 create mode 100644 common/changes/@uifabric/utilities/users-adsurang-14aug_2017-08-15-05-25.json
 create mode 100644 common/changes/office-ui-fabric-react/users-adsurang-14aug_2017-08-15-05-25.json

diff --git a/common/changes/@uifabric/example-app-base/users-adsurang-14aug_2017-08-15-05-25.json b/common/changes/@uifabric/example-app-base/users-adsurang-14aug_2017-08-15-05-25.json
new file mode 100644
index 0000000000000..7d80e8e887db5
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/users-adsurang-14aug_2017-08-15-05-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "adsurang@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/users-adsurang-14aug_2017-08-15-05-25.json b/common/changes/@uifabric/fabric-website/users-adsurang-14aug_2017-08-15-05-25.json
new file mode 100644
index 0000000000000..f3ff20e3759a2
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/users-adsurang-14aug_2017-08-15-05-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "adsurang@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/users-adsurang-14aug_2017-08-15-05-25.json b/common/changes/@uifabric/styling/users-adsurang-14aug_2017-08-15-05-25.json
new file mode 100644
index 0000000000000..862f25c73e009
--- /dev/null
+++ b/common/changes/@uifabric/styling/users-adsurang-14aug_2017-08-15-05-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "adsurang@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/users-adsurang-14aug_2017-08-15-05-25.json b/common/changes/@uifabric/utilities/users-adsurang-14aug_2017-08-15-05-25.json
new file mode 100644
index 0000000000000..b7a21e19e9cff
--- /dev/null
+++ b/common/changes/@uifabric/utilities/users-adsurang-14aug_2017-08-15-05-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "adsurang@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-adsurang-14aug_2017-08-15-05-25.json b/common/changes/office-ui-fabric-react/users-adsurang-14aug_2017-08-15-05-25.json
new file mode 100644
index 0000000000000..8fcd0c6c09d4c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-adsurang-14aug_2017-08-15-05-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Making collapse all button in grouped list accessible and adding aria expanded in  overflow button of command bar",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "adsurang@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index c55bffe795c78..199a228a288ac 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -124,6 +124,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
                   }) }
                   onClick={ this._onOverflowClick }
                   role='menuitem'
+                  aria-expanded={this.state.expandedMenuItemKey === OVERFLOW_KEY}
                   aria-label={ this.props.elipisisAriaLabel || '' }
                   aria-haspopup={ true }
                   data-automation-id='commandBarOverflow'
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index d14aaca05d81b..bad479414fcf0 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -189,6 +189,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
             <div
               className={ css('ms-DetailsHeader-cell', styles.cell) }
               onClick={ this._onToggleCollapseAll }
+              data-is-focusable={ true }
             >
               <Icon
                 className={ css(

From 280d228b69ee181fe058e3fb14a7310403a23b96 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 16 Aug 2017 10:14:43 -0700
Subject: [PATCH 0429/1641] Update users-adsurang-14aug_2017-08-15-05-25.json

---
 .../users-adsurang-14aug_2017-08-15-05-25.json           | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/common/changes/office-ui-fabric-react/users-adsurang-14aug_2017-08-15-05-25.json b/common/changes/office-ui-fabric-react/users-adsurang-14aug_2017-08-15-05-25.json
index 8fcd0c6c09d4c..df4fc3036cad9 100644
--- a/common/changes/office-ui-fabric-react/users-adsurang-14aug_2017-08-15-05-25.json
+++ b/common/changes/office-ui-fabric-react/users-adsurang-14aug_2017-08-15-05-25.json
@@ -2,10 +2,15 @@
   "changes": [
     {
       "packageName": "office-ui-fabric-react",
-      "comment": "Making collapse all button in grouped list accessible and adding aria expanded in  overflow button of command bar",
+      "comment": "CommandBar: adding `aria-expanded` attribute to overflow menu."
+      "type": "patch"
+    },
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: Making expand/collapse chevron in grouped list headers keyboard accessible."
       "type": "patch"
     }
   ],
   "packageName": "office-ui-fabric-react",
   "email": "adsurang@microsoft.com"
-}
\ No newline at end of file
+}

From 7e54352c459dc557f04ff96badcc14955155bbb3 Mon Sep 17 00:00:00 2001
From: Sean Larkin <sean.larkin@cuw.edu>
Date: Wed, 16 Aug 2017 14:42:35 -0500
Subject: [PATCH 0430/1641] chore(README): Make required deps a bit more
 obvious in view-the-docs section (#2510)

---
 README.md | 21 ++++++++++++---------
 1 file changed, 12 insertions(+), 9 deletions(-)

diff --git a/README.md b/README.md
index e756a17d914c4..3954990de16ff 100644
--- a/README.md
+++ b/README.md
@@ -23,11 +23,14 @@ Fabric React is a responsive, mobile-first collection of robust components desig
 
 ## View the docs
 
-Before you get started, make sure you have [node.js](https://nodejs.org/), [gulp](http://gulpjs.com/), and [git](https://git-scm.com/) installed. To view the documentation including examples, contracts, component status, and to add functionality or fix issues locally, you can:
+Before you get started, **make sure you have [node.js](https://nodejs.org/) and [git](https://git-scm.com/) installed.**
 
-1. `git clone https://github.com/OfficeDev/office-ui-fabric-react.git`
-2. `npm install`
-3. `npm start`
+To view the documentation including examples, contracts, component status, and to add functionality or fix issues locally, you can:
+
+1. `npm install -g gulp`
+2. `git clone https://github.com/OfficeDev/office-ui-fabric-react.git`
+3. `npm install`
+4. `npm start`
 
 This will run `gulp serve` from the office-ui-fabric-react package folder, which will open a web browser with the example page. You can make changes to the code which will automatically build and refresh the page using live-reload.
 
@@ -67,7 +70,7 @@ If you need to render Fabric components on the server side in a node environment
 
 ```ts
 import { configureLoadStyles } from '@microsoft/load-themed-styles';
- 
+
 // Store registered styles in a variable used later for injection.
 let _allStyles = '';
 
@@ -75,13 +78,13 @@ let _allStyles = '';
 configureLoadStyles((styles: string) => {
   _allStyles += styles;
 });
- 
+
 import * as React from 'react';
 import * as ReactDOMServer from 'react-dom/server';
-import { Button } from 'office-ui-fabric-react/lib/Button'; 
- 
+import { Button } from 'office-ui-fabric-react/lib/Button';
+
 let body = ReactDOMServer.renderToString(<Button>hello</Button>);
- 
+
 console.log(
   `
   <html>

From 343bfd766f2f33155d5fdedd7e59688de688341d Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 16 Aug 2017 14:24:24 -0700
Subject: [PATCH 0431/1641] Added tooltip to website (#2522)

---
 .../src/components/App/AppState.tsx           |  6 ++++
 .../pages/Components/TooltipComponentPage.tsx | 33 +++++++++++++++++++
 2 files changed, 39 insertions(+)
 create mode 100644 apps/fabric-website/src/pages/Components/TooltipComponentPage.tsx

diff --git a/apps/fabric-website/src/components/App/AppState.tsx b/apps/fabric-website/src/components/App/AppState.tsx
index e3ae19490d261..e8e2c3ba07469 100644
--- a/apps/fabric-website/src/components/App/AppState.tsx
+++ b/apps/fabric-website/src/components/App/AppState.tsx
@@ -333,6 +333,12 @@ export const AppState: IAppState = {
           component: () => <LoadingComponent title='Toggle' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/ToggleComponentPage').ToggleComponentPage))
         },
+        {
+          title: 'Tooltip',
+          url: '#/components/tooltip',
+          component: () => <LoadingComponent title='Tooltip' />,
+          getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/TooltipComponentPage').TooltipComponentPage))
+        },
         {
           title: 'Utilities',
           url: '#/components/utilities',
diff --git a/apps/fabric-website/src/pages/Components/TooltipComponentPage.tsx b/apps/fabric-website/src/pages/Components/TooltipComponentPage.tsx
new file mode 100644
index 0000000000000..9eb1b4936295b
--- /dev/null
+++ b/apps/fabric-website/src/pages/Components/TooltipComponentPage.tsx
@@ -0,0 +1,33 @@
+import * as React from 'react';
+import { TooltipPage } from 'office-ui-fabric-react/lib/components/Tooltip/TooltipPage';
+import { PageHeader } from '../../components/PageHeader/PageHeader';
+import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+
+export class TooltipComponentPage extends React.Component<any, any> {
+  public render() {
+    return (
+      <div ref='pageElement'>
+        <ComponentPage>
+          <PageHeader pageTitle='Tooltip' backgroundColor='#038387'
+            links={
+              [
+                {
+                  'text': 'Overview',
+                  'location': 'Overview'
+                },
+                {
+                  'text': 'Variants',
+                  'location': 'Variants'
+                },
+                {
+                  'text': 'Implementation',
+                  'location': 'Implementation'
+                }
+              ]
+            } />
+          <TooltipPage isHeaderVisible={ false } />
+        </ComponentPage>
+      </div>
+    );
+  }
+}

From ff9c4c0f916b47fec51b8df461f37f5cb4ca635a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pablo=20N=C3=BA=C3=B1ez?= <pablonete@gmail.com>
Date: Wed, 16 Aug 2017 23:26:38 +0200
Subject: [PATCH 0432/1641] DetailsList: resizing justified columns (#2418)

* Stop coercing layoutMode from props.

* Consider columnOverrides and maxWidth in justify mode.

* Describe changes.
---
 ...sizeJustifiedColumns_2017-08-08-09-56.json | 11 ++++
 ...sizeJustifiedColumns_2017-08-08-09-56.json | 11 ++++
 ...sizeJustifiedColumns_2017-08-08-09-56.json | 11 ++++
 ...sizeJustifiedColumns_2017-08-08-09-56.json | 11 ++++
 ...sizeJustifiedColumns_2017-08-08-09-56.json | 11 ++++
 .../components/DetailsList/DetailsList.tsx    | 56 ++++++++++---------
 .../DetailsList/DetailsListPage.tsx           |  2 +-
 7 files changed, 87 insertions(+), 26 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
 create mode 100644 common/changes/@uifabric/fabric-website/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
 create mode 100644 common/changes/@uifabric/styling/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
 create mode 100644 common/changes/@uifabric/utilities/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
 create mode 100644 common/changes/office-ui-fabric-react/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json

diff --git a/common/changes/@uifabric/example-app-base/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json b/common/changes/@uifabric/example-app-base/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
new file mode 100644
index 0000000000000..be59f08e8e294
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "v-panu@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json b/common/changes/@uifabric/fabric-website/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
new file mode 100644
index 0000000000000..c7bff1c0a4954
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "v-panu@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json b/common/changes/@uifabric/styling/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
new file mode 100644
index 0000000000000..bece4f87a03a9
--- /dev/null
+++ b/common/changes/@uifabric/styling/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "v-panu@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json b/common/changes/@uifabric/utilities/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
new file mode 100644
index 0000000000000..9f52a48cb3632
--- /dev/null
+++ b/common/changes/@uifabric/utilities/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "v-panu@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json b/common/changes/office-ui-fabric-react/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
new file mode 100644
index 0000000000000..c1edd42d2de4e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: Resizing columns preserves justified mode.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-panu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index fa700b2e103e4..eb8daf2a654a0 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -43,7 +43,6 @@ export interface IDetailsListState {
   lastWidth?: number;
   lastSelectionMode?: SelectionMode;
   adjustedColumns?: IColumn[];
-  layoutMode?: DetailsListLayoutMode;
   isCollapsed?: boolean;
   isSizing?: boolean;
   isDropping?: boolean;
@@ -106,7 +105,6 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     this.state = {
       lastWidth: 0,
       adjustedColumns: this._getAdjustedColumns(props),
-      layoutMode: props.layoutMode,
       isSizing: false,
       isDropping: false,
       isCollapsed: props.groupProps && props.groupProps.isAllGroupsCollapsed,
@@ -150,13 +148,10 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       columns,
       viewport
     } = this.props;
-    let { layoutMode } = this.state;
     let shouldResetSelection = (newProps.setKey !== setKey) || newProps.setKey === undefined;
     let shouldForceUpdates = false;
 
     if (newProps.layoutMode !== this.props.layoutMode) {
-      layoutMode = newProps.layoutMode;
-      this.setState({ layoutMode: layoutMode });
       shouldForceUpdates = true;
     }
 
@@ -176,7 +171,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       shouldForceUpdates = true;
     }
 
-    this._adjustColumns(newProps, true, layoutMode);
+    this._adjustColumns(newProps, true);
 
     if (newProps.selectionMode !== selectionMode) {
       shouldForceUpdates = true;
@@ -201,6 +196,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       groupProps,
       items,
       isHeaderVisible,
+      layoutMode,
       onItemInvoked,
       onItemContextMenu,
       onColumnHeaderClick,
@@ -219,7 +215,6 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     let {
       adjustedColumns,
       isCollapsed,
-      layoutMode,
       isSizing,
       isSomeGroupExpanded
     } = this.state;
@@ -513,28 +508,23 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     }
   }
 
-  private _adjustColumns(newProps: IDetailsListProps, forceUpdate?: boolean, layoutMode?: DetailsListLayoutMode) {
-    let adjustedColumns = this._getAdjustedColumns(newProps, forceUpdate, layoutMode);
+  private _adjustColumns(newProps: IDetailsListProps, forceUpdate?: boolean) {
+    let adjustedColumns = this._getAdjustedColumns(newProps, forceUpdate);
     let { width: viewportWidth } = this.props.viewport!;
 
     if (adjustedColumns) {
       this.setState({
         adjustedColumns: adjustedColumns,
         lastWidth: viewportWidth,
-        layoutMode: layoutMode
       });
     }
   }
 
   /** Returns adjusted columns, given the viewport size and layout mode. */
-  private _getAdjustedColumns(newProps: IDetailsListProps, forceUpdate?: boolean, layoutMode?: DetailsListLayoutMode): IColumn[] | undefined {
-    let { columns: newColumns, items: newItems, selectionMode } = newProps;
+  private _getAdjustedColumns(newProps: IDetailsListProps, forceUpdate?: boolean): IColumn[] | undefined {
+    let { columns: newColumns, items: newItems, layoutMode, selectionMode } = newProps;
     let { width: viewportWidth } = newProps.viewport!;
 
-    if (layoutMode === undefined) {
-      layoutMode = newProps.layoutMode;
-    }
-
     let columns = this.props ? this.props.columns : [];
     let lastWidth = this.state ? this.state.lastWidth : -1;
     let lastSelectionMode = this.state ? this.state.lastSelectionMode : undefined;
@@ -556,16 +546,15 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
 
     if (layoutMode === DetailsListLayoutMode.fixedColumns) {
       adjustedColumns = this._getFixedColumns(newColumns);
+
+      // Preserve adjusted column calculated widths.
+      adjustedColumns.forEach(column => {
+        this._rememberCalculatedWidth(column, column.calculatedWidth!);
+      });
     } else {
       adjustedColumns = this._getJustifiedColumns(newColumns, viewportWidth, newProps);
     }
 
-    // Preserve adjusted column calculated widths.
-    adjustedColumns.forEach(column => {
-      let overrides = this._columnOverrides[column.key] = this._columnOverrides[column.key] || {} as IColumn;
-      overrides.calculatedWidth = column.calculatedWidth;
-    });
-
     return adjustedColumns;
   }
 
@@ -600,7 +589,12 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
         column,
         {
           calculatedWidth: column.minWidth || MIN_COLUMN_WIDTH
-        });
+        },
+        this._columnOverrides[column.key]);
+
+      if (newColumn.maxWidth && newColumn.calculatedWidth > newColumn.maxWidth) {
+        newColumn.calculatedWidth = newColumn.maxWidth;
+      }
 
       totalWidth += newColumn.calculatedWidth + (i > 0 ? DEFAULT_INNER_PADDING : 0) + (column.isPadded ? ISPADDED_WIDTH : 0);
 
@@ -623,6 +617,11 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     // Then expand columns starting at the beginning, until we've filled the width.
     for (let i = 0; i < adjustedColumns.length && totalWidth < availableWidth; i++) {
       let column = adjustedColumns[i];
+      const overrides = this._columnOverrides[column.key];
+      if (overrides && overrides.calculatedWidth) {
+        continue;
+      }
+
       let maxWidth = column.maxWidth;
       let minWidth = column.minWidth || maxWidth || MIN_COLUMN_WIDTH;
       let spaceLeft = availableWidth - totalWidth;
@@ -650,11 +649,18 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     if (this.props.onColumnResize) {
       this.props.onColumnResize(resizingColumn, newCalculatedWidth);
     }
-    this._columnOverrides[resizingColumn.key].calculatedWidth = newCalculatedWidth;
-    this._adjustColumns(this.props, true, DetailsListLayoutMode.fixedColumns);
+
+    this._rememberCalculatedWidth(resizingColumn, newCalculatedWidth);
+
+    this._adjustColumns(this.props, true);
     this._forceListUpdates();
   }
 
+  private _rememberCalculatedWidth(column: IColumn, newCalculatedWidth: number) {
+    let overrides = this._columnOverrides[column.key] = this._columnOverrides[column.key] || {} as IColumn;
+    overrides.calculatedWidth = newCalculatedWidth;
+  }
+
   /**
    * Callback function when double clicked on the details header column resizer
    * which will measure the column cells of all the active rows and resize the
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
index 651c776a8fd29..c2b44a6d14846 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
@@ -44,7 +44,7 @@ export class DetailsListPage extends React.Component<IComponentDemoPageProps, {}
         componentName='DetailsListExample'
         exampleCards={
           <div>
-            <ExampleCard title='Document DetailsList with 500 items, sorting, filtering, marquee selection' isOptIn={ true } code={ DetailsListDocumentsExampleCode }>
+            <ExampleCard title='Document DetailsList with 500 items, sorting, filtering, marquee selection, justified columns' isOptIn={ true } code={ DetailsListDocumentsExampleCode }>
               <DetailsListDocumentsExample />
             </ExampleCard>
             <ExampleCard title='Simple DetailsList with 500 items, filtering, marquee selection' isOptIn={ true } code={ DetailsListBasicExampleCode }>

From 66cfd860da0296f9c4cd583ae1112059eb23d887 Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Wed, 16 Aug 2017 14:41:49 -0700
Subject: [PATCH 0433/1641] Pickers: Fixed infinite loop when focus lost.
 (#2514)

* fixed an issue where a loop could occur if values were resolved when the input value was updated to be empty

* adding change files

* renamed lambda

* fixed missing semicolon

* removed unecessary chnage files
---
 ...ers-fixstackoverflow_2017-08-15-22-39.json | 11 ++++++++++
 .../src/components/pickers/BasePicker.tsx     | 22 +++++++++----------
 2 files changed, 21 insertions(+), 12 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/pickers-fixstackoverflow_2017-08-15-22-39.json

diff --git a/common/changes/office-ui-fabric-react/pickers-fixstackoverflow_2017-08-15-22-39.json b/common/changes/office-ui-fabric-react/pickers-fixstackoverflow_2017-08-15-22-39.json
new file mode 100644
index 0000000000000..deb0649d32be2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/pickers-fixstackoverflow_2017-08-15-22-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Pickers: Fixed an issue where a loop would sometimes occur if values were resolved when input had an empty value.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 01309ee192e05..a057beb4f272f 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -104,8 +104,15 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   @autobind
   public dismissSuggestions() {
     // Select the first suggestion if one is available when user leaves.
-    if (this.suggestionStore.hasSelectedSuggestion() && this.state.suggestionsVisible && this.state.suggestedDisplayValue) {
-      this.addItemByIndex(0);
+    let selectItemFunction = () => {
+      if (this.suggestionStore.hasSelectedSuggestion() && this.state.suggestedDisplayValue) {
+        this.addItemByIndex(0);
+      }
+    };
+    if (this.currentPromise) {
+      this.currentPromise.then(() => selectItemFunction());
+    } else {
+      selectItemFunction();
     }
     this.setState({ suggestionsVisible: false });
   }
@@ -326,16 +333,6 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
       suggestedDisplayValue: itemValue,
       suggestionsVisible: this.input.value !== '' && this.input.inputElement === document.activeElement
     });
-
-    /**
-     * If user exits the input box before suggestions are returned,
-     * select the first result upon promise resolution, if a suggestion
-     * is available.
-     */
-    if (this.suggestionStore.hasSelectedSuggestion() &&
-      this.input.inputElement !== document.activeElement) {
-      this.addItemByIndex(0);
-    }
   }
 
   protected onChange(items?: T[]) {
@@ -528,6 +525,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
       let newItems: T[] = this.state.items.concat([processedItemObject]);
       this._updateSelectedItems(newItems);
     }
+    this.setState({ suggestedDisplayValue: '' });
   }
 
   @autobind

From 9f787bd3ede1ec0b878963780d0d695545592cee Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Wed, 16 Aug 2017 14:43:24 -0700
Subject: [PATCH 0434/1641] Add initial framework for a TilesList component
 (#2304)

* Change FocusZone to use TSX syntax

* Add office-ui-fabric-core dependency for SASS files

* Add Signals renderers

* Add Tile component

* Add Tile examples

* Add TilesList component

* Add TilesList examples
---
 packages/experiments/package.json             |   5 +-
 packages/experiments/src/Tile.ts              |   2 +
 packages/experiments/src/TilesList.ts         |   2 +
 .../src/components/Tile/Tile.Props.ts         |  71 +++
 .../experiments/src/components/Tile/Tile.scss | 265 +++++++++
 .../experiments/src/components/Tile/Tile.tsx  | 260 +++++++++
 .../src/components/Tile/TilePage.tsx          |  64 +++
 .../Tile/examples/Tile.Document.Example.tsx   | 182 ++++++
 .../Tile/examples/Tile.Example.scss           |  23 +
 .../Tile/examples/Tile.Media.Example.tsx      | 118 ++++
 .../experiments/src/components/Tile/index.ts  |   3 +
 .../components/TilesList/TilesList.Props.ts   | 102 ++++
 .../src/components/TilesList/TilesList.scss   |  47 ++
 .../src/components/TilesList/TilesList.tsx    | 518 ++++++++++++++++++
 .../components/TilesList/TilesListPage.tsx    |  77 +++
 .../TilesList/examples/ExampleHelpers.tsx     | 130 +++++
 .../examples/TilesList.Basic.Example.tsx      |  79 +++
 .../examples/TilesList.Document.Example.tsx   | 109 ++++
 .../examples/TilesList.Media.Example.tsx      |  99 ++++
 .../src/components/TilesList/index.ts         |   2 +
 .../src/components/signals/Signals.scss       | 103 ++++
 .../src/components/signals/Signals.tsx        | 147 +++++
 .../experiments/src/demo/AppDefinition.tsx    |  14 +-
 .../src/components/FocusZone/FocusZone.tsx    |  37 +-
 24 files changed, 2441 insertions(+), 18 deletions(-)
 create mode 100644 packages/experiments/src/Tile.ts
 create mode 100644 packages/experiments/src/TilesList.ts
 create mode 100644 packages/experiments/src/components/Tile/Tile.Props.ts
 create mode 100644 packages/experiments/src/components/Tile/Tile.scss
 create mode 100644 packages/experiments/src/components/Tile/Tile.tsx
 create mode 100644 packages/experiments/src/components/Tile/TilePage.tsx
 create mode 100644 packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
 create mode 100644 packages/experiments/src/components/Tile/examples/Tile.Example.scss
 create mode 100644 packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
 create mode 100644 packages/experiments/src/components/Tile/index.ts
 create mode 100644 packages/experiments/src/components/TilesList/TilesList.Props.ts
 create mode 100644 packages/experiments/src/components/TilesList/TilesList.scss
 create mode 100644 packages/experiments/src/components/TilesList/TilesList.tsx
 create mode 100644 packages/experiments/src/components/TilesList/TilesListPage.tsx
 create mode 100644 packages/experiments/src/components/TilesList/examples/ExampleHelpers.tsx
 create mode 100644 packages/experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx
 create mode 100644 packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
 create mode 100644 packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
 create mode 100644 packages/experiments/src/components/TilesList/index.ts
 create mode 100644 packages/experiments/src/components/signals/Signals.scss
 create mode 100644 packages/experiments/src/components/signals/Signals.tsx

diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index fad1f0a658035..d7cfaeaa09c48 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -64,10 +64,11 @@
     "webpack-notifier": "^1.5.0"
   },
   "dependencies": {
-    "office-ui-fabric-react": "4.34.0"
+    "office-ui-fabric-react": "4.34.0",
+    "office-ui-fabric-core": ">= 7.1.2 <8.0.0"
   },
   "peerDependencies": {
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/experiments/src/Tile.ts b/packages/experiments/src/Tile.ts
new file mode 100644
index 0000000000000..84998bcde79c4
--- /dev/null
+++ b/packages/experiments/src/Tile.ts
@@ -0,0 +1,2 @@
+
+export * from './components/Tile/index';
diff --git a/packages/experiments/src/TilesList.ts b/packages/experiments/src/TilesList.ts
new file mode 100644
index 0000000000000..ed36e2701f29b
--- /dev/null
+++ b/packages/experiments/src/TilesList.ts
@@ -0,0 +1,2 @@
+
+export * from './components/TilesList/index';
diff --git a/packages/experiments/src/components/Tile/Tile.Props.ts b/packages/experiments/src/components/Tile/Tile.Props.ts
new file mode 100644
index 0000000000000..e6b80e92896bf
--- /dev/null
+++ b/packages/experiments/src/components/Tile/Tile.Props.ts
@@ -0,0 +1,71 @@
+
+import * as React from 'react';
+import { IBaseProps } from 'office-ui-fabric-react/lib/Utilities';
+import { Tile } from './Tile';
+import { Selection } from 'office-ui-fabric-react/lib/utilities/selection/Selection';
+
+export interface ITileProps extends IBaseProps, React.AllHTMLAttributes<HTMLSpanElement | HTMLAnchorElement> {
+  /**
+   * Index of the item in the selection controller.
+   *
+   * @type {number}
+   * @memberof ITileProps
+   */
+  selectionIndex?: number;
+  /**
+   * Selection controller for the item rendered in the tile.
+   *
+   * @type {Selection}
+   * @memberof ITileProps
+   */
+  selection?: Selection;
+  /**
+   * Name to use on the nameplate for the tile.
+   *
+   * @type {(React.ReactNode | React.ReactNode[])}
+   * @memberof ITileProps
+   */
+  itemName?: React.ReactNode | React.ReactNode[];
+  /**
+   * Activity to use on the nameplate for the tile.
+   *
+   * @type {(React.ReactNode | React.ReactNode[])}
+   * @memberof ITileProps
+   */
+  itemActivity?: React.ReactNode | React.ReactNode[];
+  /**
+   * Content to render as the full-size background of the tile.
+   *
+   * @type {(React.ReactNode | React.ReactNode[])}
+   * @memberof ITileProps
+   */
+  background?: React.ReactNode | React.ReactNode[];
+  /**
+   * Whether or not to frame the background.
+   *
+   * @type {boolean}
+   * @memberof ITileProps
+   */
+  showBackgroundFrame?: boolean;
+  /**
+   * Content to render as the foreground of the tile, bounded by padding and the nameplate.
+   *
+   * @type {(React.ReactNode | React.ReactNode[])}
+   * @memberof ITileProps
+   */
+  foreground?: React.ReactNode | React.ReactNode[];
+  /**
+   * Whether or not to frame the foreground.
+   *
+   * @type {boolean}
+   * @memberof ITileProps
+   */
+  showForegroundFrame?: boolean;
+  /**
+   * The accessible label for the selection checkbox.
+   *
+   * @type {boolean}
+   * @memberof ITileProps
+   */
+  toggleSelectionAriaLabel?: boolean;
+}
diff --git a/packages/experiments/src/components/Tile/Tile.scss b/packages/experiments/src/components/Tile/Tile.scss
new file mode 100644
index 0000000000000..bb6340cef9fad
--- /dev/null
+++ b/packages/experiments/src/components/Tile/Tile.scss
@@ -0,0 +1,265 @@
+
+@import '../../../../office-ui-fabric-react/src/common/common';
+
+.tile {
+  @include focus-clear();
+
+  display: block;
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background-color: $ms-color-white;
+  transition: transform 0.1s linear;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  align-content: stretch;
+
+  text-decoration: none;
+  color: $ms-color-neutralPrimary;
+
+  &:hover {
+    background-color: $ms-color-neutralLighter;
+
+    &.selected {
+      background-color: $ms-color-neutralQuaternaryAlt;
+    }
+  }
+
+  &.selected {
+    background-color: $ms-color-neutralLight;
+  }
+
+  @include focus(true) {
+    background-color: $ms-color-neutralLighter;
+
+    &.selected {
+      background-color: $ms-color-neutralQuaternaryAlt; // Todo need a color variable.
+    }
+  }
+
+  @include focus(true) {
+    outline: 1px solid $ms-color-neutralSecondary;
+
+    &.selected {
+      outline: 1px solid $ms-color-themePrimary;
+    }
+  }
+
+  &.hasBackgroundFrame {
+    box-shadow: 0 1px 3px 1px rgba(1, 1, 0, 0.05);
+
+    &:hover {
+      outline: 1px solid $ms-color-neutralTertiaryAlt;
+    }
+
+    @include focus(true) {
+      outline: 1px solid $ms-color-neutralSecondary;
+
+      &.selected {
+        outline: 1px solid $ms-color-themePrimary;
+      }
+    }
+
+    &:after {
+      content: '';
+      display: block;
+      position: absolute;
+      top: 0;
+      left: 0;
+      bottom: 0;
+      right: 0;
+      pointer-events: none;
+      border: 2px solid $ms-color-white;
+    }
+  }
+
+  &:active {
+    transform: scale(0.95);
+  }
+}
+
+.frame {
+  margin: auto;
+  position: relative;
+  overflow: hidden;
+  max-width: 100%;
+  max-height: 100%;
+
+  &.hasForegroundFrame {
+    margin: auto auto 0 auto;
+    background-color: $ms-color-white;
+    box-shadow: 0 1px 3px 1px rgba(1, 1, 0, 0.05);
+
+    &:after {
+      content: '';
+      display: block;
+      position: absolute;
+      top: 0;
+      left: 0;
+      bottom: 0;
+      right: 0;
+      pointer-events: none;
+      border: 2px solid $ms-color-white;
+    }
+  }
+}
+
+.check {
+  @include focus-border($position: absolute);
+  display: none;
+  top: 0;
+  @include right(0);
+  border: none;
+  background: none;
+  opacity: 0;
+
+  .tile.selectable & {
+    display: block;
+  }
+
+  .tile.selected &,
+  .tile:hover & {
+    opacity: 1;
+  }
+
+  @include focus(true) {
+    opacity: 1;
+  }
+}
+
+.tile {
+  @include focus(true) {
+    .check {
+      opacity: 1;
+    }
+  }
+}
+
+button.check {
+  padding: 6px;
+}
+
+.content {
+  position: relative;
+  flex: 1;
+}
+
+.background {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  overflow: hidden;
+}
+
+.foreground {
+  top: 16px;
+  left: 16px;
+  right: 16px;
+  bottom: 0;
+  flex-grow: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  position: absolute;
+}
+
+.nameplate {
+  display: block;
+  margin: auto 0 0 0;
+  padding: 12px 8px;
+  text-align: center;
+
+  .tile.hasBackgroundFrame & {
+    padding: 12px 10px;
+  }
+}
+
+.signal {
+  display: inline-block;
+
+  &.storageSignal {
+    @include margin-left(4px);
+  }
+
+  &.socialSignal {
+    @include margin-right(4px);
+  }
+
+  &.lifecycleSignal {
+    @include margin-right(4px);
+  }
+}
+
+@mixin preserveExtenders($topMargin: 0px) {
+  padding-top: 8px;
+  margin-top: $topMargin - 8px;
+  @include margin-left(-8px);
+  @include padding-left(8px);
+}
+
+.name {
+  display: block;
+  font-weight: $ms-font-weight-regular;
+  font-size: $ms-font-size-m;
+  color: $ms-color-neutralPrimary;
+  height: 20px;
+  line-height: 20px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  @include preserveExtenders();
+}
+
+.activity {
+  margin-top: 4px;
+  display: block;
+  font-weight: $ms-font-weight-regular;
+  font-size: $ms-font-size-s;
+  color: #767676;
+  height: 16px;
+  line-height: 16px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  @include preserveExtenders(4px);
+}
+
+.hasBackgroundFrame {
+  .nameplate {
+    @include text-align(left);
+  }
+}
+
+.hasBackground {
+  .nameplate {
+    position: relative;
+    background-image: linear-gradient(to top, rgba(#000, 0.65) 0%, rgba(#000, 0.65 * 0.85) 70%, rgba(#000, 0.30 * 0.85) 100%);
+
+    &:before {
+      position: absolute;
+      content: '';
+      display: block;
+      height: 12px;
+      bottom: 100%;
+      left: 0;
+      right: 0;
+      background-image: linear-gradient(to top, rgba(#000, 0.30 * 0.85) 0%, rgba(#000, 0) 100%);
+    }
+  }
+
+  .name {
+    color: $ms-color-white;
+    text-shadow: 0.5px 0.5px 2px rgba(#000, 0.55);
+  }
+
+  .activity {
+    color: $ms-color-white;
+    text-shadow: 0.5px 0.5px 2px rgba(#000, 0.55);
+  }
+}
diff --git a/packages/experiments/src/components/Tile/Tile.tsx b/packages/experiments/src/components/Tile/Tile.tsx
new file mode 100644
index 0000000000000..fdd6a837ffc89
--- /dev/null
+++ b/packages/experiments/src/components/Tile/Tile.tsx
@@ -0,0 +1,260 @@
+
+import * as React from 'react';
+import { ITileProps } from './Tile.Props';
+import { Check } from 'office-ui-fabric-react/lib/Check';
+import { SELECTION_CHANGE } from 'office-ui-fabric-react/lib/utilities/selection/index';
+import { css, BaseComponent, autobind, getNativeProps, getId } from 'office-ui-fabric-react/lib/Utilities';
+import * as TileStylesModule from './Tile.scss';
+import * as SignalStylesModule from '../signals/Signals.scss';
+
+const TileStyles: any = TileStylesModule;
+const SignalStyles: any = SignalStylesModule;
+
+export interface ITileState {
+  isSelected?: boolean;
+}
+
+/**
+ * A tile provides a frame for a potentially-selectable item which displays its contents prominently.
+ *
+ * @export
+ * @class Tile
+ * @extends {React.Component<ITileProps, ITileState>}
+ */
+export class Tile extends BaseComponent<ITileProps, ITileState> {
+  private _nameId: string;
+  private _activityId: string;
+
+  constructor(props: ITileProps, context: any) {
+    super(props, context);
+
+    this._nameId = getId('Tile-name');
+    this._activityId = getId('Tile-activity');
+
+    const {
+      selectionIndex = -1,
+      selection
+    } = props;
+
+    const isSelected = !!selection && selectionIndex > -1 && selection.isIndexSelected(selectionIndex);
+
+    this.state = {
+      isSelected: isSelected
+    };
+  }
+
+  public componentWillReceiveProps(nextProps: ITileProps) {
+    const {
+      selection,
+      selectionIndex
+    } = this.props;
+
+    const {
+      selection: nextSelection,
+      selectionIndex: nextSelectionIndex = -1
+    } = nextProps;
+
+    if (selection !== nextSelection || selectionIndex !== nextSelectionIndex) {
+      const isSelected = !!nextSelection && nextSelectionIndex > -1 && nextSelection.isIndexSelected(nextSelectionIndex);
+
+      this.setState({
+        isSelected: isSelected
+      });
+    }
+  }
+
+  public componentDidMount() {
+    const {
+      selection
+    } = this.props;
+
+    if (selection) {
+      this._events.on(selection, SELECTION_CHANGE, this._onSelectionChange);
+    }
+  }
+
+  public componentDidUpdate(previousProps: ITileProps) {
+    const {
+      selection
+    } = this.props;
+
+    const {
+      selection: previousSelection
+    } = previousProps;
+
+    if (selection !== previousSelection) {
+      if (previousSelection) {
+        this._events.off(previousSelection);
+      }
+
+      if (selection) {
+        this._events.on(selection, SELECTION_CHANGE, this._onSelectionChange);
+      }
+    }
+  }
+
+  public render() {
+    const {
+      children,
+      selectionIndex = -1,
+      selection,
+      background,
+      foreground,
+      showBackgroundFrame = false,
+      showForegroundFrame = false,
+      itemName,
+      itemActivity,
+      componentRef,
+      className,
+      ...aProps
+    } = this.props;
+
+    const isSelectable = !!selection && selectionIndex > -1;
+
+    const {
+      isSelected = false
+    } = this.state;
+
+    const Tag = aProps.href ? 'a' : 'span';
+
+    return (
+      <Tag
+        { ...(aProps.href ? aProps : {}) }
+        aria-labelledby={ this._nameId }
+        aria-describedby={ this._activityId }
+        className={ css('ms-Tile', className, TileStyles.tile, {
+          [`ms-Tile--hasBackgroundFrame ${TileStyles.hasBackgroundFrame}`]: showBackgroundFrame,
+          [`ms-Tile--isSelected ${TileStyles.selected} ${SignalStyles.selected}`]: isSelected,
+          [`ms-Tile--isSelectable ${TileStyles.selectable}`]: isSelectable,
+          [`ms-Tile--hasBackground ${TileStyles.hasBackground} ${SignalStyles.dark}`]: !!background
+        }) }
+        data-is-focusable={ true }
+        data-is-sub-focuszone={ true }
+        data-selection-invoke={ (selectionIndex > -1) ? true : undefined }
+        data-selection-index={ (selectionIndex > -1) ? selectionIndex : undefined }>
+        {
+          background ? this._onRenderBackground({
+            background: background
+          }) : null
+        }
+        {
+          foreground ? this._onRenderForeground({
+            foreground: foreground,
+            showForegroundFrame: showForegroundFrame
+          }) : null
+        }
+        {
+          (itemName || itemActivity) ? this._onRenderNameplate({
+            name: itemName,
+            activity: itemActivity
+          }) : null
+        }
+        {
+          isSelectable ? this._onRenderCheck({
+            isSelected: isSelected
+          }) : null
+        }
+      </Tag>
+    );
+  }
+
+  private _onRenderBackground({
+    background
+  }: {
+      background: React.ReactNode | React.ReactNode[]
+    }) {
+    return (
+      <span className={ css('ms-Tile-background', TileStyles.background) }>
+        { background }
+      </span>
+    );
+  }
+
+  private _onRenderForeground({
+    foreground,
+    showForegroundFrame
+  }: {
+      foreground: React.ReactNode | React.ReactNode[];
+      showForegroundFrame: boolean;
+    }) {
+    return (
+      <span
+        role='presentation'
+        className={ css('ms-Tile-content', TileStyles.content) }>
+        <span
+          role='presentation'
+          className={ css('ms-Tile-foreground', TileStyles.foreground) }>
+          <span
+            role='presentation'
+            className={ css('ms-Tile-frame', TileStyles.frame, {
+              [`ms-Tile-frame--hasForegroundFrame ${TileStyles.hasForegroundFrame}`]: showForegroundFrame
+            }) }>
+            { foreground }
+          </span>
+        </span>
+      </span>
+    );
+  }
+
+  private _onRenderNameplate({
+    name,
+    activity
+  }: {
+      name: React.ReactNode | React.ReactNode[];
+      activity: React.ReactNode | React.ReactNode[];
+    }) {
+    return (
+      <span
+        className={ css('ms-Tile-nameplate', TileStyles.nameplate) }>
+        {
+          name ? (
+            <span
+              id={ this._nameId }
+              className={ css('ms-Tile-name', TileStyles.name) }>
+              { name }
+            </span>
+          ) : null
+        }
+        {
+          activity ? (
+            <span
+              id={ this._activityId }
+              className={ css('ms-Tile-activity', TileStyles.activity) }>
+              { activity }
+            </span>
+          ) : null
+        }
+      </span>
+    );
+  }
+
+  private _onRenderCheck({
+    isSelected
+  }: {
+      isSelected: boolean;
+    }) {
+    return (
+      <button
+        aria-label={ this.props.toggleSelectionAriaLabel }
+        className={ css('ms-Tile-check', TileStyles.check) }
+        data-selection-toggle={ true }
+        role='checkbox'>
+        <Check
+          checked={ isSelected }
+        />
+      </button>
+    );
+  }
+
+  @autobind
+  private _onSelectionChange() {
+    const {
+      selection,
+      selectionIndex = -1
+    } = this.props;
+
+    this.setState({
+      isSelected: selectionIndex > -1 && selection && selection.isIndexSelected(selectionIndex)
+    });
+  }
+}
diff --git a/packages/experiments/src/components/Tile/TilePage.tsx b/packages/experiments/src/components/Tile/TilePage.tsx
new file mode 100644
index 0000000000000..b16ae3b4241d8
--- /dev/null
+++ b/packages/experiments/src/components/Tile/TilePage.tsx
@@ -0,0 +1,64 @@
+import * as React from 'react';
+import { Link } from 'office-ui-fabric-react/lib/Link';
+import {
+  ExampleCard,
+  IComponentDemoPageProps,
+  ComponentPage,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+
+import { TileMediaExample } from './examples/Tile.Media.Example';
+const TileMediaExampleCode = require('!raw-loader!experiments/src/components/Tile/examples/Tile.Media.Example.tsx') as string;
+
+import { TileDocumentExample } from './examples/Tile.Document.Example';
+const TileDocumentExampleCode = require('!raw-loader!experiments/src/components/Tile/examples/Tile.Document.Example.tsx') as string;
+
+export class TilePage extends React.Component<IComponentDemoPageProps, {}> {
+  public render() {
+    return (
+      <ComponentPage
+        title='Tile'
+        componentName='Tile'
+        exampleCards={
+          <div>
+            <ExampleCard title='Document Tile' isOptIn={ true } code={ TileDocumentExampleCode }>
+              <TileDocumentExample />
+            </ExampleCard>
+            <ExampleCard title='Media Tile' isOptIn={ true } code={ TileMediaExampleCode }>
+              <TileMediaExample />
+            </ExampleCard>
+          </div>
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!experiments/src/components/Tile/Tile.Props.ts')
+            ] }
+          />
+        }
+        overview={
+          <div>
+          </div>
+        }
+        bestPractices={
+          <div></div>
+        }
+        dos={
+          <div>
+            <ul>
+              <li>Use them to represent a large collection of items visually.</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul>
+              <li>Use them for general layout of components that are not part of the same set.</li>
+            </ul>
+          </div>
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }>
+      </ComponentPage>
+    );
+  }
+}
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
new file mode 100644
index 0000000000000..c6a456b6a16c5
--- /dev/null
+++ b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
@@ -0,0 +1,182 @@
+
+import * as React from 'react';
+import { Tile } from '../Tile';
+import { Icon } from 'office-ui-fabric-react/lib/Icon';
+import { css } from 'office-ui-fabric-react/lib/Utilities';
+import {
+  SignalField,
+  Signal,
+  NewSignal,
+  CommentsSignal,
+  TrendingSignal,
+  SharedSignal,
+  MentionSignal
+} from '../../signals/Signals';
+import { lorem } from '@uifabric/example-app-base';
+import * as TileExampleStylesModule from './Tile.Example.scss';
+
+const TileExampleStyles = TileExampleStylesModule as any;
+
+export class TileDocumentExample extends React.Component<any, any> {
+  public render() {
+    return (
+      <div>
+        <h3>Tiny document thumbnail</h3>
+        <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
+          <Tile
+            itemName={
+              <SignalField
+                before={
+                  <TrendingSignal />
+                }
+              >
+                { lorem(2) }
+              </SignalField>
+            }
+            itemActivity={
+              <SignalField
+                before={
+                  <CommentsSignal>{ '12' }</CommentsSignal>
+                }
+              >
+                { lorem(2) }
+              </SignalField>
+            }
+            foreground={
+              <img src={ `//placehold.it/40x40` } style={
+                {
+                  display: 'block'
+                }
+              } />
+            }
+            showForegroundFrame={ true }
+          />
+        </div>
+        <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
+          <Tile
+            itemName={
+              <SignalField
+                before={
+                  <TrendingSignal />
+                }
+              >
+                { lorem(2) }
+              </SignalField>
+            }
+            itemActivity={
+              <SignalField
+                before={
+                  <CommentsSignal>{ '12' }</CommentsSignal>
+                }
+              >
+                { lorem(2) }
+              </SignalField>
+            }
+            foreground={
+              <img src={ `//placehold.it/80x120` } style={
+                {
+                  display: 'block'
+                }
+              } />
+            }
+            showForegroundFrame={ true }
+          />
+        </div>
+        <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
+          <Tile
+            itemName={
+              <SignalField
+                before={
+                  <TrendingSignal />
+                }
+              >
+                { lorem(2) }
+              </SignalField>
+            }
+            itemActivity={
+              <SignalField
+                before={
+                  <CommentsSignal>{ '12' }</CommentsSignal>
+                }
+              >
+                { lorem(2) }
+              </SignalField>
+            }
+            foreground={
+              <img src={ `//placehold.it/168x96` } style={
+                {
+                  display: 'block'
+                }
+              } />
+            }
+            showForegroundFrame={ true }
+          />
+        </div>
+        <h3>Maximum-sized document thumbnail</h3>
+        <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
+          <Tile
+            itemName={
+              <SignalField
+                before={
+                  <NewSignal />
+                }
+              >
+                { lorem(10) }
+              </SignalField>
+            }
+            foreground={
+              <img src={ `//placehold.it/168x120` } style={
+                {
+                  display: 'block'
+                }
+
+              } />
+            }
+            showForegroundFrame={ true }
+          />
+        </div>
+        <h3>Document icon</h3>
+        <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
+          <Tile
+            itemName={
+              <SignalField
+                before={
+                  <NewSignal />
+                }
+              >
+                { lorem(1) }
+              </SignalField>
+            }
+            itemActivity={
+              (
+                <SignalField
+                  before={
+                    <SharedSignal />
+                  }
+                >
+                  { lorem(3) }
+                </SignalField>
+              )
+            }
+            foreground={
+              <img
+                src={
+                  `https://static2.sharepointonline.com/files/fabric/assets/brand-icons/document/svg/docx_48x1.svg`
+                }
+                style={
+                  {
+                    display: 'block',
+                    width: '64px',
+                    height: '64px',
+                    margin: '16px'
+                  }
+                }
+              />
+            }
+            showForegroundFrame={ true }
+          />
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Example.scss b/packages/experiments/src/components/Tile/examples/Tile.Example.scss
new file mode 100644
index 0000000000000..2a9180ffb2347
--- /dev/null
+++ b/packages/experiments/src/components/Tile/examples/Tile.Example.scss
@@ -0,0 +1,23 @@
+
+.tile {
+  display: inline-block;
+  position: relative;
+  margin: 4px;
+}
+
+.landscapeTile {
+  width: 250px;
+  height: 200px;
+}
+
+.portraitTile {
+  width: 175px;
+  height: 200px;
+}
+
+.squareTile {
+  display: inline-block;
+  position: relative;
+  width: 200px;
+  height: 200px;
+}
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
new file mode 100644
index 0000000000000..3541551d3e2e2
--- /dev/null
+++ b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
@@ -0,0 +1,118 @@
+
+import * as React from 'react';
+import { Tile } from '../Tile';
+import { Icon } from 'office-ui-fabric-react/lib/Icon';
+import { css } from 'office-ui-fabric-react/lib/Utilities';
+import {
+  SignalField,
+  Signal,
+  NewSignal,
+  CommentsSignal,
+  TrendingSignal,
+  SharedSignal,
+  MentionSignal
+} from '../../signals/Signals';
+import { lorem } from '@uifabric/example-app-base';
+import * as TileExampleStylesModule from './Tile.Example.scss';
+
+const TileExampleStyles = TileExampleStylesModule as any;
+
+export class TileMediaExample extends React.Component<any, any> {
+  public render() {
+    return (
+      <div>
+        <h3>Landscape</h3>
+        <div className={ css(TileExampleStyles.tile, TileExampleStyles.landscapeTile) }>
+          <Tile
+            itemName={
+              <SignalField
+                before={
+                  <NewSignal />
+                }
+              >
+                { lorem(2) }
+              </SignalField>
+            }
+            itemActivity={
+              <SignalField
+                before={
+                  [<Signal><Icon iconName='play' /></Signal>, <MentionSignal />]
+                }
+              >
+                { lorem(6) }
+              </SignalField>
+            }
+            background={
+              <img src={ `//placehold.it/250x200` } style={
+                {
+                  display: 'block'
+                }
+              } />
+            }
+            showBackgroundFrame={ true }
+          />
+        </div>
+        <h3>Portrait</h3>
+        <div className={ css(TileExampleStyles.tile, TileExampleStyles.portraitTile) }>
+          <Tile
+            itemName={
+              <SignalField
+                before={
+                  <NewSignal />
+                }
+              >
+                { lorem(1) }
+              </SignalField>
+            }
+            itemActivity={
+              <SignalField
+                before={
+                  <CommentsSignal>{ '6' }</CommentsSignal>
+                }
+              >
+                { lorem(6) }
+              </SignalField>
+            }
+            background={
+              <img src={ `//placehold.it/175x200` } style={
+                {
+                  display: 'block'
+                }
+              } />
+            }
+            showBackgroundFrame={ true }
+          />
+        </div>
+        <h3>No preview</h3>
+        <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
+          <Tile
+            itemName={
+              <SignalField
+                before={
+                  <NewSignal />
+                }
+              >
+                { lorem(2) }
+              </SignalField>
+            }
+            itemActivity={
+              (
+                <SignalField
+                  before={
+                    [<Signal><Icon iconName='play' /></Signal>, <SharedSignal />]
+                  }
+                >
+                  { lorem(8) }
+                </SignalField>
+              )
+            }
+            foreground={
+              <Icon iconName='play' style={ { margin: '11px', fontSize: '40px' } } />
+            }
+            showBackgroundFrame={ true }
+          />
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/packages/experiments/src/components/Tile/index.ts b/packages/experiments/src/components/Tile/index.ts
new file mode 100644
index 0000000000000..9149e165f7740
--- /dev/null
+++ b/packages/experiments/src/components/Tile/index.ts
@@ -0,0 +1,3 @@
+
+export * from './Tile.Props';
+export * from './Tile';
diff --git a/packages/experiments/src/components/TilesList/TilesList.Props.ts b/packages/experiments/src/components/TilesList/TilesList.Props.ts
new file mode 100644
index 0000000000000..f510ad15a4809
--- /dev/null
+++ b/packages/experiments/src/components/TilesList/TilesList.Props.ts
@@ -0,0 +1,102 @@
+
+import * as React from 'react';
+import { IBaseProps } from 'office-ui-fabric-react/lib/Utilities';
+import { TilesList } from './TilesList';
+import { Selection } from 'office-ui-fabric-react/lib/utilities/selection/Selection';
+
+export interface ITilesGridItem<TItem> {
+  /**
+   * A unique key to assign to the item within the grid.
+   * This is only used for reconciliation, not selection behavior.
+   */
+  key: string;
+  /**
+   * The content item to be rendered. This will be passed back to `onRender`.
+   */
+  content: TItem;
+  /**
+   * The desired dimensions of the item, used to compute aspect ratio.
+   * If not provided, this is assumed to be a square equivalent to the current row height.
+   */
+  desiredSize?: { width: number; height: number; };
+  /**
+   * Invoked to render the virtual DOM for the item.
+   * This content will be rendered inside the cell allocated for the item.
+   */
+  onRender: (content: TItem, finalSize?: ITileSize) => (React.ReactNode | React.ReactNode[]);
+}
+
+export const enum TilesGridMode {
+  /**
+   * Every item in the grid gets its own row.
+   */
+  none,
+  /**
+   * Items in the row are stacked without resizing until they overflow.
+   */
+  stack,
+  /**
+   * Items in the row are stretched if necessary to fill the row.
+   */
+  fill
+}
+
+export interface ITilesGridSegment<TItem> {
+  /**
+   * A unique key to assign to the grid segment.
+   * This will only be used for reconciliation.
+   */
+  key: string;
+  /**
+   * The items to render as part of a contiguous, flowing grid.
+   * All items will be rendered with the same base row height and margin.
+   */
+  items: ITilesGridItem<TItem>[];
+  /**
+   * The spacing to allocate between items.
+   */
+  spacing?: number;
+  /**
+   * The base height for each row.
+   */
+  minRowHeight: number;
+  /**
+   * The maximum scale factor to use when stretching items to fill a row.
+   */
+  maxScaleFactor?: number;
+  /**
+   * The mode for the grid.
+   */
+  mode: TilesGridMode;
+  /**
+   * The top margin for the grid.
+   */
+  marginTop?: number;
+  /**
+   * The bottom margin for the grid.
+   */
+  marginBottom?: number;
+}
+
+export interface ITileSize {
+  width: number;
+  height: number;
+}
+
+export interface ITilesListProps<TItem> extends IBaseProps, React.HTMLAttributes<TilesList<TItem>> {
+  /**
+   * An array of items to assign to the list.
+   * This should be complete and not contain any holes.
+   * The items may either be header row specifications, or grid specifications which each
+   * define their own items.
+   */
+  items: (ITilesGridItem<TItem> | ITilesGridSegment<TItem>)[];
+  /**
+   * The desired number of content cells to render per page.
+   */
+  cellsPerPage?: number;
+  /**
+   * The current selection model.
+   */
+  selection?: Selection;
+}
diff --git a/packages/experiments/src/components/TilesList/TilesList.scss b/packages/experiments/src/components/TilesList/TilesList.scss
new file mode 100644
index 0000000000000..4c2e0eecd533b
--- /dev/null
+++ b/packages/experiments/src/components/TilesList/TilesList.scss
@@ -0,0 +1,47 @@
+
+@import '../../../../office-ui-fabric-react/src/common/common';
+
+.listCell {
+  display: block;
+  margin: 0;
+}
+
+.listPage {
+  display: flex;
+  flex-direction: column;
+}
+
+.cell {
+  display: block;
+  position: relative;
+}
+
+.cellContent {
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
+}
+
+.cellFirstInRow {
+  display: block;
+}
+
+.sizer {
+  display: block;
+  visibility: hidden;
+}
+
+.grid {
+  display: flex;
+  flex-direction: row;
+  flex-flow: row wrap;
+  align-items: flex-start;
+  justify-content: flex-start;
+  align-content: flex-start;
+}
+
+.none {
+  display: block;
+}
diff --git a/packages/experiments/src/components/TilesList/TilesList.tsx b/packages/experiments/src/components/TilesList/TilesList.tsx
new file mode 100644
index 0000000000000..e38669ad107ee
--- /dev/null
+++ b/packages/experiments/src/components/TilesList/TilesList.tsx
@@ -0,0 +1,518 @@
+
+import * as React from 'react';
+import { ITilesListProps, ITilesGridItem, ITilesGridSegment, TilesGridMode, ITileSize } from './TilesList.Props';
+import { List, IPageProps } from 'office-ui-fabric-react/lib/List';
+import { FocusZone, FocusZoneDirection } from 'office-ui-fabric-react/lib/FocusZone';
+import { SelectionZone, SelectionMode } from 'office-ui-fabric-react/lib/utilities/selection/index';
+import { autobind, css, IRenderFunction, IRectangle } from 'office-ui-fabric-react/lib/Utilities';
+import * as TilesListStylesModule from './TilesList.scss';
+
+const TilesListStyles: any = TilesListStylesModule;
+
+const MAX_TILE_STRETCH = 1.5;
+const CELLS_PER_PAGE = 100;
+
+export interface ITilesListState<TItem> {
+  cells: ITileCell<TItem>[];
+}
+
+export interface ITileGrid {
+  minRowHeight: number;
+  mode: TilesGridMode;
+  spacing: number;
+  maxScaleFactor: number;
+  marginTop: number;
+  marginBottom: number;
+  key: string;
+}
+
+export interface ITileCell<TItem> {
+  key: string;
+  content: TItem;
+  aspectRatio: number;
+  grid: ITileGrid;
+  onRender(content: TItem, finalSize: { width: number; height: number; }): React.ReactNode | React.ReactNode[];
+}
+
+interface IRowData {
+  scaleFactor: number;
+  isLastRow?: boolean;
+}
+
+interface IPageData<TItem> {
+  pageWidths: {
+    [index: number]: number;
+  };
+  rows: {
+    [index: number]: IRowData;
+  };
+  cellSizes: {
+    [index: number]: ITileSize;
+  };
+  extraCells: ITileCell<TItem>[] | undefined;
+}
+
+interface IPageSpecification<TItem> {
+  itemCount: number;
+  data: IPageData<TItem>;
+}
+
+interface IPageSpecificationCache<TItem> {
+  byIndex: {
+    [index: number]: IPageSpecification<TItem>;
+  };
+  width: number;
+}
+
+export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, ITilesListState<TItem>> {
+  private _pageSpecificationCache: IPageSpecificationCache<TItem> | undefined;
+
+  constructor(props: ITilesListProps<TItem>, context: any) {
+    super(props, context);
+
+    this.state = {
+      cells: this._getCells(props.items)
+    };
+  }
+
+  public componentWillReceiveProps(nextProps: ITilesListProps<TItem>) {
+    if (nextProps.items !== this.props.items) {
+      this.setState({
+        cells: this._getCells(nextProps.items)
+      });
+    }
+  }
+
+  public componentWillUpdate(nextProps: ITilesListProps<TItem>, nextState: ITilesListState<TItem>) {
+    if (nextState.cells !== this.state.cells) {
+      this._pageSpecificationCache = undefined;
+    }
+  }
+
+  public render() {
+    const {
+      selection
+    } = this.props;
+
+    const {
+      cells
+    } = this.state;
+
+    const list = (
+      <List
+        items={ cells }
+        getPageSpecification={ this._getPageSpecification }
+        onRenderPage={ this._onRenderPage }
+      />
+    );
+
+    return (
+      <FocusZone
+        direction={ FocusZoneDirection.bidirectional }
+      >
+        {
+          selection ?
+            <SelectionZone
+              selection={ selection }
+              selectionMode={ SelectionMode.multiple }>
+              { list }
+            </SelectionZone> :
+            list
+        }
+      </FocusZone>
+    );
+  }
+
+  private _onRenderCell(item: ITileCell<TItem>, finalSize: ITileSize) {
+    if (item.grid.mode === TilesGridMode.none) {
+      return (
+        <div className={ css(TilesListStyles.header) }
+        >
+          { item.onRender(item.content, { width: 0, height: 0 }) }
+        </div>
+      );
+    }
+
+    const itemWidthOverHeight = item.aspectRatio;
+    const itemHeightOverWidth = 1 / itemWidthOverHeight;
+
+    return (
+      <div
+        role='presentation'
+        className={ css(TilesListStyles.cell) }
+        style={
+          {
+            paddingTop: `${(100 * itemHeightOverWidth).toFixed(2)}%`
+          }
+        }
+      >
+        <div
+          role='presentation'
+          className={ css(TilesListStyles.cellContent) }
+        >
+          { item.onRender(item.content, finalSize) }
+        </div>
+      </div>
+    );
+  }
+
+  @autobind
+  private _onRenderPage(pageProps: IPageProps, defaultRender?: IRenderFunction<IPageProps>) {
+    const {
+      page,
+      className: pageClassName,
+      ...divProps
+    } = pageProps;
+
+    const {
+      items
+    } = page;
+
+    const data: IPageData<TItem> = page.data;
+
+    const cells: ITileCell<TItem>[] = items || [];
+
+    let grids: React.ReactNode[] = [];
+
+    const previousCell = this.state.cells[page.startIndex - 1];
+    const nextCell = this.state.cells[page.startIndex + page.itemCount];
+
+    const endIndex = cells.length;
+
+    let currentRow: IRowData | undefined;
+
+    for (let i = 0; i < endIndex;) {
+      // For each cell at the start of a grid.
+      const grid = cells[i].grid;
+
+      const renderedCells: React.ReactNode[] = [];
+
+      const width = data.pageWidths[i];
+
+      for (; i < endIndex && cells[i].grid === grid; i++) {
+        // For each cell in the current grid.
+        const cell = cells[i];
+
+        const index = page.startIndex + i;
+        const cellAsFirstRow = data.rows[index];
+
+        if (cellAsFirstRow) {
+          currentRow = cellAsFirstRow;
+        }
+
+        let finalSize = data.cellSizes[index];
+
+        if (currentRow) {
+          const {
+            scaleFactor
+          } = currentRow;
+
+          if (!currentRow.isLastRow || scaleFactor <= grid.maxScaleFactor) {
+            const finalScaleFactor = Math.min(grid.maxScaleFactor, scaleFactor);
+
+            finalSize = {
+              width: finalSize.width * finalScaleFactor,
+              height: finalSize.height * finalScaleFactor
+            };
+          }
+        }
+
+        renderedCells.push(
+          <div
+            key={ `${grid.key}-item-${cell.key}` }
+            data-item-index={ index }
+            className={ css('ms-List-cell', this._onGetCellClassName(), {
+              [`ms-TilesList-cell--firstInRow ${TilesListStyles.cellFirstInRow}`]: !!cellAsFirstRow
+            }) }
+            style={
+              {
+                ...this._onGetCellStyle(cell, currentRow)
+              }
+            }
+          >
+            { this._onRenderCell(cell, finalSize) }
+          </div>
+        );
+      }
+
+      const isOpenStart = previousCell && previousCell.grid === grid;
+      const isOpenEnd = nextCell && nextCell.grid === grid;
+
+      const margin = grid.spacing / 2;
+
+      grids.push(
+        <div
+          key={ grid.key }
+          className={ css('ms-TilesList-grid', {
+            [`${TilesListStyles.grid}`]: grid.mode !== TilesGridMode.none
+          }) }
+          style={
+            {
+              width: `${width}px`,
+              margin: `${-margin}px`,
+              marginTop: isOpenStart ? '0' : `${grid.marginTop - margin}px`,
+              marginBottom: isOpenEnd ? '0' : `${grid.marginBottom - margin}px`
+            }
+          }>
+          { ...renderedCells }
+        </div>
+      );
+    }
+
+    return (
+      <div
+        { ...divProps }
+        className={ css(pageClassName, this._onGetPageClassName()) }
+      >
+        { grids }
+      </div>
+    );
+  }
+
+  @autobind
+  private _getPageSpecification(startIndex: number, bounds: IRectangle): {
+    itemCount: number;
+    data: IPageData<TItem>;
+  } {
+    if (this._pageSpecificationCache) {
+      if (this._pageSpecificationCache.width !== bounds.width) {
+        this._pageSpecificationCache = undefined;
+      }
+    }
+
+    if (!this._pageSpecificationCache) {
+      this._pageSpecificationCache = {
+        width: bounds.width,
+        byIndex: {}
+      };
+    }
+
+    const pageSpecificationCache = this._pageSpecificationCache;
+
+    if (pageSpecificationCache.byIndex[startIndex]) {
+      return pageSpecificationCache.byIndex[startIndex];
+    }
+
+    const {
+      cells
+    } = this.state;
+
+    const endIndex = Math.min(cells.length, startIndex + CELLS_PER_PAGE);
+
+    let rowWidth = 0;
+    let rowStart = 0;
+    let fillPercent = 0;
+    let i = startIndex;
+
+    let isAtGridEnd = true;
+
+    const startCells: IPageData<TItem>['rows'] = {};
+    let extraCells: IPageData<TItem>['extraCells'] | undefined;
+    const cellSizes: IPageData<TItem>['cellSizes'] = {};
+    const widths: IPageData<TItem>['pageWidths'] = {};
+
+    for (; i < endIndex;) {
+      // For each cell at the start of a grid.
+      const grid = cells[i].grid;
+
+      rowWidth = 0;
+      rowStart = i;
+
+      const boundsWidth = bounds.width + grid.spacing;
+
+      widths[i] = boundsWidth;
+
+      let currentRow: IRowData = startCells[i] = {
+        scaleFactor: 1
+      };
+
+      if (grid.mode === TilesGridMode.none) {
+        // The current "grid" just takes up the full width.
+        // No flex calculations necessary.
+        isAtGridEnd = true;
+        fillPercent = 1;
+        cellSizes[i] = {
+          width: bounds.width,
+          height: 0
+        };
+        i++;
+        continue;
+      }
+
+      for (; i < endIndex && cells[i].grid === grid; i++) {
+        // For each cell in the current grid.
+        const {
+          aspectRatio
+        } = cells[i];
+
+        const width = aspectRatio * grid.minRowHeight + grid.spacing;
+
+        if (rowWidth + width > boundsWidth && grid.mode === TilesGridMode.fill) {
+          const totalMargin = grid.spacing * (i - rowStart);
+          currentRow.scaleFactor = (boundsWidth - totalMargin) / (rowWidth - totalMargin);
+        }
+
+        rowWidth += width;
+        fillPercent = rowWidth / boundsWidth;
+
+        cellSizes[i] = {
+          // Assign the expected base size of the cell.
+          // Scaling will be handled at render time.
+          width: aspectRatio * grid.minRowHeight,
+          height: grid.minRowHeight
+        };
+
+        if (rowWidth > boundsWidth) {
+          rowWidth = width;
+          fillPercent = rowWidth / boundsWidth;
+          rowStart = i;
+          currentRow = startCells[i] = {
+            scaleFactor: 1
+          };
+        }
+      }
+
+      if (cells[i] && cells[i].grid === grid) {
+        // If the next cell is part of a different grid.
+        isAtGridEnd = false;
+      } else {
+        currentRow.isLastRow = true;
+      }
+
+      if (rowWidth < boundsWidth && grid.mode === TilesGridMode.fill) {
+        const totalMargin = grid.spacing * (i - rowStart);
+        currentRow.scaleFactor = (boundsWidth - totalMargin) / (rowWidth - totalMargin);
+      }
+
+      if (!isAtGridEnd && currentRow.scaleFactor > grid.maxScaleFactor) {
+        // If the last computed row is not the end of the grid, and the content cannot scale to fit the width,
+        // declare these cells as 'extra' and let them be pushed into the next page.
+        extraCells = cells.slice(rowStart, i);
+      }
+    }
+
+    const itemCount = extraCells ?
+      // If there are extra cells, cut off the page so the extra cells will be pushed into the next page.
+      rowStart - startIndex :
+      // Otherwise, take all the cells.
+      i - startIndex;
+
+    const pageSpecification: IPageSpecification<TItem> = {
+      itemCount: itemCount,
+      data: {
+        pageWidths: widths,
+        rows: startCells,
+        extraCells: extraCells,
+        cellSizes: cellSizes
+      }
+    };
+
+    pageSpecificationCache.byIndex[startIndex] = pageSpecification;
+
+    return pageSpecification;
+  }
+
+  @autobind
+  private _onGetCellClassName(): string {
+    return TilesListStyles.listCell;
+  }
+
+  @autobind
+  private _onGetPageClassName(): string {
+    return TilesListStyles.listPage;
+  }
+
+  @autobind
+  private _onGetCellStyle(item: ITileCell<TItem>, currentRow?: IRowData): React.CSSProperties {
+    const {
+      grid: {
+        mode: gridMode,
+      maxScaleFactor
+      },
+      grid
+    } = item;
+
+    if (gridMode === TilesGridMode.none) {
+      return {};
+    }
+
+    const itemWidthOverHeight = item.aspectRatio || 1;
+    const itemHeightOverWidth = 1 / itemWidthOverHeight;
+    const margin = grid.spacing / 2;
+
+    const isFill = gridMode === TilesGridMode.fill;
+
+    const width = itemWidthOverHeight * grid.minRowHeight;
+
+    return {
+      flex: isFill ? `${itemWidthOverHeight} ${itemWidthOverHeight} ${width}px` : `0 0 ${width}px`,
+      maxWidth: isFill && (!currentRow || !currentRow.isLastRow || currentRow.scaleFactor <= maxScaleFactor) ?
+        // Flexbox can scale the item to the maximum ratio.
+        `${width * maxScaleFactor}px` :
+        // The item must not be scaled.
+        `${width}px`,
+      margin: `${margin}px`
+    };
+  }
+
+  private _getCells(items: (ITilesGridSegment<TItem> | ITilesGridItem<TItem>)[]): ITileCell<TItem>[] {
+    const cells: ITileCell<TItem>[] = [];
+
+    for (const item of items) {
+      if (isGridSegment(item)) {
+        const {
+          spacing = 0,
+          maxScaleFactor = MAX_TILE_STRETCH,
+          marginBottom = 0,
+          marginTop = 0
+        } = item;
+
+        const grid: ITileGrid = {
+          minRowHeight: item.minRowHeight,
+          spacing: spacing,
+          mode: item.mode,
+          key: `grid-${item.key}`,
+          maxScaleFactor: maxScaleFactor,
+          marginTop: marginTop,
+          marginBottom: marginBottom
+        };
+
+        for (const gridItem of item.items) {
+          const {
+            desiredSize
+          } = gridItem;
+
+          cells.push({
+            aspectRatio: desiredSize && (desiredSize.width / desiredSize.height) || 1,
+            content: gridItem.content,
+            onRender: gridItem.onRender,
+            grid: grid,
+            key: gridItem.key
+          });
+        }
+      } else {
+        cells.push({
+          aspectRatio: 1,
+          content: item.content,
+          onRender: item.onRender,
+          grid: {
+            minRowHeight: 0,
+            spacing: 0,
+            mode: TilesGridMode.none,
+            key: `grid-header-${item.key}`,
+            maxScaleFactor: 1,
+            marginBottom: 0,
+            marginTop: 0
+          },
+          key: `header-${item.key}`
+        });
+      }
+    }
+
+    return cells;
+  }
+}
+
+function isGridSegment<TItem>(item: ITilesGridSegment<TItem> | ITilesGridItem<TItem>): item is ITilesGridSegment<TItem> {
+  return !!(item as ITilesGridSegment<TItem>).items;
+}
diff --git a/packages/experiments/src/components/TilesList/TilesListPage.tsx b/packages/experiments/src/components/TilesList/TilesListPage.tsx
new file mode 100644
index 0000000000000..1da8b488d99f8
--- /dev/null
+++ b/packages/experiments/src/components/TilesList/TilesListPage.tsx
@@ -0,0 +1,77 @@
+import * as React from 'react';
+import { Link } from 'office-ui-fabric-react/lib/Link';
+import {
+  ExampleCard,
+  IComponentDemoPageProps,
+  ComponentPage,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+
+import { TilesListBasicExample } from './examples/TilesList.Basic.Example';
+const TilesListBasicExampleCode = require('!raw-loader!experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx') as string;
+
+import { TilesListDocumentExample } from './examples/TilesList.Document.Example';
+const TilesListDocumentExampleCode = require('!raw-loader!experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx') as string;
+
+import { TilesListMediaExample } from './examples/TilesList.Media.Example';
+const TilesListMediaExampleCode = require('!raw-loader!experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx') as string;
+
+export class TilesListPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render() {
+    return (
+      <ComponentPage
+        title='TilesList'
+        componentName='TilesListExample'
+        exampleCards={
+          <div>
+            <ExampleCard title='TilesList with basic tiles' isOptIn={ true } code={ TilesListBasicExampleCode }>
+              <TilesListBasicExample />
+            </ExampleCard>
+            <ExampleCard title='TilesList with document tiles' isOptIn={ true } code={ TilesListDocumentExampleCode }>
+              <TilesListDocumentExample />
+            </ExampleCard>
+            <ExampleCard title='TilesList with media tiles' isOptIn={ true } code={ TilesListMediaExampleCode }>
+              <TilesListMediaExample />
+            </ExampleCard>
+          </div>
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!experiments/src/components/TilesList/TilesList.Props.ts')
+            ] }
+          />
+        }
+        overview={
+          <div>
+            <p>
+              <code>TilesList</code> is a specialization of the <Link href='#/examples/List'><code>List</code></Link> component.
+              It is intended to represent items visual using a one or mote content-focused flowing grids.
+            </p>
+            <p>
+              <code>TilesList</code> is designed to be used in conjunction with the <code>Tile</code> component. The <code>Tile</code> component provides a standardized form of focusable and selectable content item.
+            </p>
+          </div>
+        }
+        bestPractices={
+          <div></div>
+        }
+        dos={
+          <div>
+            <ul>
+              <li>Use them to represent a large collection of items visually.</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul>
+              <li>Use them for general layout of components that are not part of the same set.</li>
+            </ul>
+          </div>
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }>
+      </ComponentPage>
+    );
+  }
+}
diff --git a/packages/experiments/src/components/TilesList/examples/ExampleHelpers.tsx b/packages/experiments/src/components/TilesList/examples/ExampleHelpers.tsx
new file mode 100644
index 0000000000000..b221da05927e6
--- /dev/null
+++ b/packages/experiments/src/components/TilesList/examples/ExampleHelpers.tsx
@@ -0,0 +1,130 @@
+
+import { TilesGridMode, ITilesGridItem, ITilesGridSegment, ITileSize } from '../TilesList.Props';
+import { lorem } from '@uifabric/example-app-base';
+
+type IAspectRatioByProbability = { [probability: string]: number; };
+
+const PROBABILITIES: IAspectRatioByProbability = {
+  '0.95': 3,
+  '0.90': 1 / 3,
+  '0.80': 16 / 9,
+  '0.70': 9 / 16,
+  '0.40': 4 / 3,
+  '0.10': 3 / 4,
+  '0.00': 1
+};
+
+const ENTRIES = Object.keys(PROBABILITIES).map((key: keyof IAspectRatioByProbability) => ({
+  probability: Number(key),
+  aspectRatio: PROBABILITIES[key]
+}));
+
+export interface IExampleItem {
+  key: string;
+  name: string;
+  index: number;
+  aspectRatio: number;
+}
+
+export interface IExampleGroup {
+  items: IExampleItem[];
+  name: string;
+  index: number;
+  type: 'document' | 'media';
+  key: string;
+}
+
+export function createMediaItems(count: number, indexOffset: number) {
+  const items: IExampleItem[] = [];
+
+  for (let i = 0; i < count; i++) {
+    const seed = Math.random();
+
+    items.push({
+      key: `item-${indexOffset + i}`,
+      name: lorem(4),
+      index: indexOffset + i,
+      aspectRatio: ENTRIES.filter((entry: { probability: number; aspectRatio: number; }) => seed >= entry.probability)[0].aspectRatio
+    });
+  }
+
+  return items;
+}
+
+export function createDocumentItems(count: number, indexOffset: number) {
+  const items: IExampleItem[] = [];
+
+  for (let i = 0; i < count; i++) {
+    const seed = Math.random();
+
+    items.push({
+      key: `item-${indexOffset + i}`,
+      name: lorem(4),
+      index: indexOffset + i,
+      aspectRatio: 1
+    });
+  }
+
+  return items;
+}
+
+export function createGroup(items: IExampleItem[], type: 'document' | 'media', index: number): IExampleGroup {
+  return {
+    items: items,
+    index: index,
+    name: lorem(4),
+    type: type,
+    key: `group-${index}`
+  };
+}
+
+export function getTileCells(groups: IExampleGroup[], {
+  onRenderCell,
+  onRenderHeader
+}: {
+    onRenderHeader: (item: IExampleItem) => JSX.Element;
+    onRenderCell: (item: IExampleItem, finalSize?: ITileSize) => JSX.Element;
+  }) {
+  const items: (ITilesGridSegment<IExampleItem> | ITilesGridItem<IExampleItem>)[] = [];
+
+  for (const group of groups) {
+    const header: ITilesGridItem<IExampleItem> = {
+      key: `header-${group.key}`,
+      content: {
+        key: '',
+        aspectRatio: 1,
+        name: lorem(6),
+        index: group.index
+      },
+      onRender: onRenderHeader
+    };
+
+    items.push(header);
+
+    items.push({
+      items: group.items.map((item: IExampleItem): ITilesGridItem<IExampleItem> => {
+        return {
+          key: item.key,
+          content: item,
+          desiredSize: group.type === 'document' ? {
+            width: 176,
+            height: 171
+          } : {
+              width: 171 * item.aspectRatio,
+              height: 171
+            },
+          onRender: onRenderCell
+        };
+      }),
+      spacing: 8,
+      marginBottom: 40,
+      minRowHeight: 171,
+      mode: group.type === 'document' ?
+        TilesGridMode.stack :
+        TilesGridMode.fill,
+      key: group.key
+    });
+  }
+
+  return items;
+}
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx
new file mode 100644
index 0000000000000..c30dacc20e732
--- /dev/null
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx
@@ -0,0 +1,79 @@
+
+import * as React from 'react';
+import {
+  TilesList,
+  ITilesGridSegment,
+  ITilesGridItem,
+  TilesGridMode,
+  ITileSize
+} from '../../TilesList';
+
+export interface IBasicItem {
+  color: string;
+  key: string;
+}
+
+const ITEMS: IBasicItem[] = [];
+
+for (let i = 0; i < 500; i++) {
+  ITEMS.push({
+    color: ['red', 'blue', 'green', 'yellow', 'orange', 'brown', 'purple', 'gray'][Math.floor(Math.random() * 8)],
+    key: `item-${i}`
+  });
+}
+
+export interface ITilesListBasicExampleState {
+  items: ITilesGridItem<IBasicItem>[];
+}
+
+export class TilesListBasicExample extends React.Component<{}, ITilesListBasicExampleState> {
+  constructor() {
+    super();
+
+    this.state = {
+      items: ITEMS.map((item: IBasicItem): ITilesGridItem<IBasicItem> => {
+        return {
+          content: item,
+          desiredSize: { width: 100, height: 100 },
+          key: item.key,
+          onRender: renderItem
+        };
+      })
+    };
+  }
+
+  public render() {
+    const gridSegment: ITilesGridSegment<IBasicItem> = {
+      items: this.state.items,
+      key: 'grid',
+      mode: TilesGridMode.fill,
+      minRowHeight: 100,
+      spacing: 10
+    };
+
+    return (
+      <TilesList
+        items={
+          [gridSegment]
+        }
+      />
+    );
+  }
+}
+
+function renderItem(item: IBasicItem) {
+  return (
+    <div
+      style={
+        {
+          position: 'absolute',
+          top: '0',
+          left: '0',
+          bottom: '0',
+          right: '0',
+          backgroundColor: item.color
+        }
+      }
+    />
+  );
+}
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
new file mode 100644
index 0000000000000..f1c8776310723
--- /dev/null
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
@@ -0,0 +1,109 @@
+
+import * as React from 'react';
+import {
+  TilesList,
+  ITilesGridSegment,
+  ITilesGridItem,
+  TilesGridMode,
+  ITileSize
+} from '../../TilesList';
+import { Tile } from '../../../Tile';
+import { Selection } from 'office-ui-fabric-react/lib/utilities/selection/Selection';
+import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { AnimationClassNames } from 'office-ui-fabric-react/lib/Styling';
+import { lorem } from '@uifabric/example-app-base';
+import { IExampleGroup, IExampleItem, createGroup, createDocumentItems, getTileCells } from './ExampleHelpers';
+
+function createGroups(): IExampleGroup[] {
+  let offset = 0;
+
+  const groups: IExampleGroup[] = [];
+
+  for (let i = 0; i < 20; i++) {
+    const items = createDocumentItems(50 + Math.ceil(Math.random() * 6) * 50, offset);
+
+    offset += items.length;
+
+    groups.push(createGroup(items, 'document', i));
+  }
+
+  return groups;
+}
+
+const GROUPS = createGroups();
+
+const ITEMS = ([] as IExampleItem[]).concat(...GROUPS.map((group: { items: IExampleItem[]; }) => group.items));
+
+declare class TilesListClass extends TilesList<IExampleItem> { }
+
+const TilesListType: typeof TilesListClass = TilesList;
+
+export class TilesListDocumentExample extends React.Component<any, any> {
+  private _selection: Selection;
+
+  constructor() {
+    super();
+
+    this._selection = new Selection({
+      getKey: (item: IExampleItem) => item.key,
+    });
+
+    this._selection.setItems(ITEMS);
+  }
+  public render() {
+    const items = getTileCells(GROUPS, {
+      onRenderCell: this._onRenderDocumentCell,
+      onRenderHeader: this._onRenderHeader
+    });
+
+    return (
+      <div style={ { padding: '4px' } }>
+        <MarqueeSelection selection={ this._selection }>
+          <TilesListType
+            selection={ this._selection }
+            items={ items }
+          />
+        </MarqueeSelection>
+      </div>
+    );
+  }
+
+  @autobind
+  private _onRenderDocumentCell(item: IExampleItem) {
+    return (
+      <Tile
+        className={ AnimationClassNames.fadeIn400 }
+        selection={ this._selection }
+        selectionIndex={ ITEMS.indexOf(item) }
+        foreground={
+          <img
+            src={
+              `https://static2.sharepointonline.com/files/fabric/assets/brand-icons/document/svg/docx_48x1.svg`
+            }
+            style={
+              {
+                display: 'block',
+                width: '40px',
+                height: '40px',
+                margin: '11px'
+              }
+            }
+          />
+        }
+        showForegroundFrame={ true }
+        itemName={ item.name }
+        itemActivity={ item.key }
+      />
+    );
+  }
+
+  @autobind
+  private _onRenderHeader(item: IExampleItem) {
+    return (
+      <div>
+        <h3>{ item.name }</h3>
+      </div>
+    );
+  }
+}
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
new file mode 100644
index 0000000000000..804d169c2f135
--- /dev/null
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
@@ -0,0 +1,99 @@
+
+import * as React from 'react';
+import {
+  TilesList,
+  ITilesGridSegment,
+  ITilesGridItem,
+  TilesGridMode,
+  ITileSize
+} from '../../TilesList';
+import { Tile } from '../../../Tile';
+import { Selection } from 'office-ui-fabric-react/lib/utilities/selection/Selection';
+import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { AnimationClassNames } from 'office-ui-fabric-react/lib/Styling';
+import { lorem } from '@uifabric/example-app-base';
+import { IExampleGroup, IExampleItem, createGroup, createMediaItems, getTileCells } from './ExampleHelpers';
+
+function createGroups(): IExampleGroup[] {
+  let offset = 0;
+
+  const groups: IExampleGroup[] = [];
+
+  for (let i = 0; i < 20; i++) {
+    const items = createMediaItems(50 + Math.ceil(Math.random() * 6) * 50, offset);
+
+    offset += items.length;
+
+    groups.push(createGroup(items, 'media', i));
+  }
+
+  return groups;
+}
+
+const GROUPS = createGroups();
+
+const ITEMS = ([] as IExampleItem[]).concat(...GROUPS.map((group: { items: IExampleItem[]; }) => group.items));
+
+declare class TilesListClass extends TilesList<IExampleItem> { }
+
+const TilesListType: typeof TilesListClass = TilesList;
+
+export class TilesListMediaExample extends React.Component<any, any> {
+  private _selection: Selection;
+
+  constructor() {
+    super();
+
+    this._selection = new Selection({
+      getKey: (item: IExampleItem) => item.key,
+    });
+
+    this._selection.setItems(ITEMS);
+  }
+  public render() {
+    const items = getTileCells(GROUPS, {
+      onRenderCell: this._onRenderMediaCell,
+      onRenderHeader: this._onRenderHeader
+    });
+
+    return (
+      <div style={ { padding: '4px' } }>
+        <MarqueeSelection selection={ this._selection }>
+          <TilesListType
+            selection={ this._selection }
+            items={ items }
+          />
+        </MarqueeSelection>
+      </div>
+    );
+  }
+
+  @autobind
+  private _onRenderMediaCell(item: IExampleItem, finalSize: ITileSize) {
+    return (
+      <Tile
+        className={ AnimationClassNames.fadeIn400 }
+        selection={ this._selection }
+        selectionIndex={ item.index }
+        background={
+          <img style={ { display: 'block' } } src={
+            `//placehold.it/${Math.round(finalSize.width)}x${Math.round(finalSize.height)}`
+          } />
+        }
+        showBackgroundFrame={ true }
+        itemName={ item.name }
+        itemActivity={ item.key }
+      />
+    );
+  }
+
+  @autobind
+  private _onRenderHeader(item: IExampleItem) {
+    return (
+      <div>
+        <h3>{ item.name }</h3>
+      </div>
+    );
+  }
+}
diff --git a/packages/experiments/src/components/TilesList/index.ts b/packages/experiments/src/components/TilesList/index.ts
new file mode 100644
index 0000000000000..4b6fe18ed7b84
--- /dev/null
+++ b/packages/experiments/src/components/TilesList/index.ts
@@ -0,0 +1,2 @@
+export * from './TilesList';
+export * from './TilesList.Props';
diff --git a/packages/experiments/src/components/signals/Signals.scss b/packages/experiments/src/components/signals/Signals.scss
new file mode 100644
index 0000000000000..c2d8bcfd62aca
--- /dev/null
+++ b/packages/experiments/src/components/signals/Signals.scss
@@ -0,0 +1,103 @@
+
+@import '../../../../office-ui-fabric-react/src/common/common';
+
+.signal {
+  display: inline-block;
+  margin: 0 4px;
+
+  &:first-child {
+    @include margin-left(0);
+  }
+
+  &:last-child {
+    @include margin-right(0);
+  }
+}
+
+.new {
+  width: 0;
+  height: 1em;
+  position: relative;
+  @include margin-right(0);
+  line-height: 1em;
+  color: $ms-color-themePrimary;
+
+  .selected & {
+    color: $ms-color-themeDark;
+  }
+}
+
+.newIcon {
+  position: absolute;
+  bottom: 100%;
+  @include right(-1px);
+  font-size: 0.66em;
+  margin-bottom: -0.75em;
+}
+
+.comments {
+  color: $ms-color-themePrimary;
+
+  .selected & {
+    color: $ms-color-themeDark;
+  }
+}
+
+.commentsIcon {
+  vertical-align: middle;
+}
+
+.commentsCount {
+  @include margin-left(0.2em);
+  font-size: 0.9em;
+  font-weight: $ms-font-weight-semibold;
+  vertical-align: baseline;
+}
+
+.trending {
+  color: #006257;
+}
+
+.blocked {
+  color: #a80000;
+}
+
+.warning {
+  color: #cf3902;
+}
+
+.shared {
+  color: $ms-color-neutralSecondary;
+}
+
+.missingMetadata {
+  color: $ms-color-themeDarker;
+}
+
+.mention {
+  color: $ms-color-themePrimary;
+
+  .selected & {
+    color: $ms-color-themeDark;
+  }
+}
+
+.signal {
+  .dark &,
+  .dark.selected {
+    color: $ms-color-white;
+  }
+}
+
+.signalField {
+  display: inline-flex;
+  max-width: 100%;
+  flex-direction: row nowrap;
+}
+
+.signalFieldValue {
+  text-overflow: ellipsis;
+  overflow: hidden;
+  white-space: nowrap;
+  text-align: left;
+}
diff --git a/packages/experiments/src/components/signals/Signals.tsx b/packages/experiments/src/components/signals/Signals.tsx
new file mode 100644
index 0000000000000..28815b85481f3
--- /dev/null
+++ b/packages/experiments/src/components/signals/Signals.tsx
@@ -0,0 +1,147 @@
+
+import * as React from 'react';
+import { Icon } from 'office-ui-fabric-react/lib/Icon';
+import { css } from 'office-ui-fabric-react/lib/Utilities';
+import * as SignalStylesModule from './Signals.scss';
+
+const SignalStyles = SignalStylesModule as any;
+
+export interface ISignalFieldProps extends React.HTMLAttributes<HTMLSpanElement> {
+  before?: React.ReactNode | React.ReactNode[];
+  after?: React.ReactNode | React.ReactNode[];
+}
+
+/**
+ * Renders a field flanked by signals.
+ * Pass `<Signal />` or related components in for the `before` and `after` fields.
+ * Pass the main value as the children.
+ */
+export const SignalField: React.StatelessComponent<ISignalFieldProps> = (props: ISignalFieldProps): JSX.Element => {
+  return (
+    <span className={ SignalStyles.signalField }>
+      { props.before }
+      <span className={ SignalStyles.signalFieldValue }>
+        { props.children }
+      </span>
+      { props.after }
+    </span>
+  );
+};
+
+export interface ISignalProps extends React.HTMLAttributes<HTMLSpanElement> {
+  ariaLabel?: string;
+}
+
+export type Signal = React.StatelessComponent<ISignalProps>;
+
+export const Signal: Signal = (props: ISignalProps): JSX.Element => {
+  return (
+    <span className={ css(SignalStyles.signal) }>{ props.children }</span>
+  );
+};
+
+export const YouCheckedOutSignal: Signal = (props: ISignalProps): JSX.Element => {
+  return (
+    <Icon className={ css(SignalStyles.signal, SignalStyles.youCheckedOutl) } iconName='' /> // TODO get correct icon
+  );
+};
+
+export const BlockedSignal: Signal = (props: ISignalProps): JSX.Element => {
+  return (
+    <Icon className={ css(SignalStyles.signal, SignalStyles.blocked) } iconName='blocked2' />
+  );
+};
+
+export const MissingMetadataSignal: Signal = (props: ISignalProps): JSX.Element => {
+  return (
+    <Icon className={ css(SignalStyles.signal, SignalStyles.missingMetadata) } iconName='info' />
+  );
+};
+
+export const WarningSignal: Signal = (props: ISignalProps): JSX.Element => {
+  return (
+    <Icon className={ css(SignalStyles.signal, SignalStyles.warning) } iconName='warning' />
+  );
+};
+
+export const AwaitingApprovalSignal: Signal = (props: ISignalProps): JSX.Element => {
+  return (
+    <Icon className={ css(SignalStyles.signal, SignalStyles.awaitingApproval) } iconName='documentmanagement' /> // TODO get correct icon
+  );
+};
+
+export const TrendingSignal: Signal = (props: ISignalProps): JSX.Element => {
+  return (
+    <Icon className={ css(SignalStyles.signal, SignalStyles.trending) } iconName='market' />
+  );
+};
+
+export const SomeoneCheckedOutSignal: Signal = (props: ISignalProps): JSX.Element => {
+  return (
+    <Icon className={ css(SignalStyles.signal, SignalStyles.someoneCheckedOut) } iconName='navigateforward' /> // TODO get correct icon
+  );
+};
+
+/**
+ * Renders a signal marking the proceeding content as new.
+ */
+export const NewSignal: Signal = (props: ISignalProps): JSX.Element => {
+  return (
+    <span className={ css(SignalStyles.signal, SignalStyles.new) }>
+      <Icon className={ css(SignalStyles.newIcon) } iconName='glimmer' />
+    </span>
+  );
+};
+
+/**
+ * Renders a signal for a live-edit scenario.
+ */
+export const LiveEditSignal: Signal = (props: ISignalProps): JSX.Element => {
+  return (
+    <span className={ css(SignalStyles.signal, SignalStyles.liveEdit) }>
+      { props.children }
+    </span>
+  );
+};
+
+export const MentionSignal: Signal = (props: ISignalProps): JSX.Element => {
+  return (
+    <Icon className={ css(SignalStyles.signal, SignalStyles.mention) } iconName='accounts' />
+  );
+};
+
+/**
+ * Renders a signal for a number of comments.
+ */
+export const CommentsSignal: Signal = (props: ISignalProps): JSX.Element => {
+  return (
+    <span className={ css(SignalStyles.signal, SignalStyles.comments) }>
+      <Icon className={ css(SignalStyles.commentsIcon) } iconName='MessageFill' />
+      {
+        props.children ? (
+          <span className={ css(SignalStyles.commentsCount) }>
+            { props.children }
+          </span>
+        ) : null
+      }
+    </span>
+  );
+};
+
+export const UnseenEditSignal: Signal = (props: ISignalProps): JSX.Element => {
+  return (
+    <Icon className={ css(SignalStyles.signal, SignalStyles.unseenEdit) } iconName='edit' /> // TODO get correct icon
+  );
+};
+
+export const ReadOnlySignal: Signal = (props: ISignalProps): JSX.Element => {
+  return (
+    <Icon className={ css(SignalStyles.signal, SignalStyles.readOnly) } iconName='' /> // TODO get correct icon
+  );
+};
+
+export const SharedSignal: Signal = (props: ISignalProps): JSX.Element => {
+  return (
+    <Icon className={ css(SignalStyles.signal, SignalStyles.shared) } iconName='people' />
+  );
+};
diff --git a/packages/experiments/src/demo/AppDefinition.tsx b/packages/experiments/src/demo/AppDefinition.tsx
index 38471be1ffba1..ed73b0f4509d8 100644
--- a/packages/experiments/src/demo/AppDefinition.tsx
+++ b/packages/experiments/src/demo/AppDefinition.tsx
@@ -15,6 +15,18 @@ export const AppDefinition: IAppDefinition = {
           name: 'Link',
           url: '#/examples/link'
         },
+        {
+          component: require<any>('../components/Tile/TilePage').TilePage,
+          key: 'Tile',
+          name: 'Tile',
+          url: '#/examples/tile'
+        },
+        {
+          component: require<any>('../components/TilesList/TilesListPage').TilesListPage,
+          key: 'TilesList',
+          name: 'TilesList',
+          url: '#/examples/tileslist'
+        }
       ]
     }
   ],
@@ -35,4 +47,4 @@ export const AppDefinition: IAppDefinition = {
 
 };
 
-export const App = (props: IAppProps) => <AppBase appDefinition={ AppDefinition } { ...props } />;
\ No newline at end of file
+export const App = (props: IAppProps) => <AppBase appDefinition={ AppDefinition } { ...props } />;
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index be116a5055fe9..8e25d00ee9c1f 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -108,21 +108,28 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     let { rootProps, ariaDescribedBy, ariaLabelledBy, className } = this.props;
     let divProps = getNativeProps(this.props, divProperties);
 
-    return React.createElement(
-      this.props.elementType || 'div', {
-        role: 'presentation',
-        ...divProps,
-        ...rootProps,
-        className: css('ms-FocusZone', className),
-        ref: 'root',
-        'data-focuszone-id': this._id,
-        'aria-labelledby': ariaLabelledBy,
-        'aria-describedby': ariaDescribedBy,
-        onKeyDown: this._onKeyDown,
-        onFocus: this._onFocus,
-        ...{ onMouseDownCapture: this._onMouseDown }
-      },
-      this.props.children
+    const Tag = this.props.elementType || 'div';
+
+    return (
+      <Tag
+        role='presentation'
+        {
+        ...divProps
+        }
+        {
+        ...rootProps
+        }
+        className={ css('ms-FocusZone', className) }
+        ref='root'
+        data-focuszone-id={ this._id }
+        aria-labelledby={ ariaLabelledBy }
+        aria-describedby={ ariaDescribedBy }
+        onKeyDown={ this._onKeyDown }
+        onFocus={ this._onFocus }
+        onMouseDownCapture={ this._onMouseDown }
+      >
+        { this.props.children }
+      </Tag>
     );
   }
 

From 14f335d0ca77f09cc9422c1809121e527153c430 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 16 Aug 2017 17:40:44 -0700
Subject: [PATCH 0435/1641] Cleaning up css() usage to avoid class to state map
 objects. (#2528)

* Cleaning up all instances to css which use object maps. Don't use object maps, it will make migration to mergeStyles more difficult.

* Updating css usage.
---
 .../fabric-website/src/components/App/App.tsx |    5 +-
 .../css-cleanup_2017-08-17-00-19.json         |   11 +
 .../css-cleanup_2017-08-17-00-19.json         |   11 +
 package-lock.json                             | 3009 -----------------
 packages/office-ui-fabric-react/index.html    |    1 +
 .../components/DetailsList/DetailsList.tsx    |   14 +-
 .../DetailsList/DetailsRowCheck.tsx           |   10 +-
 .../DetailsList.CustomRows.Example.tsx        |    6 +-
 .../src/components/Dropdown/Dropdown.tsx      |   13 +-
 .../List/examples/List.Scrolling.Example.tsx  |    9 +-
 .../MarqueeSelection/MarqueeSelection.tsx     |   19 +-
 .../MarqueeSelection.Basic.Example.tsx        |    7 +-
 .../src/components/Modal/Modal.tsx            |   11 +-
 .../src/components/Nav/Nav.tsx                |   34 +-
 .../ProgressIndicator/ProgressIndicator.tsx   |    9 +-
 .../src/components/Slider/Slider.tsx          |   11 +-
 16 files changed, 116 insertions(+), 3064 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/css-cleanup_2017-08-17-00-19.json
 create mode 100644 common/changes/office-ui-fabric-react/css-cleanup_2017-08-17-00-19.json
 delete mode 100644 package-lock.json

diff --git a/apps/fabric-website/src/components/App/App.tsx b/apps/fabric-website/src/components/App/App.tsx
index a57f726f2cd16..512c29e6f40d8 100644
--- a/apps/fabric-website/src/components/App/App.tsx
+++ b/apps/fabric-website/src/components/App/App.tsx
@@ -38,8 +38,9 @@ export class App extends React.Component<IAppProps, any> {
     }
 
     return (
-      <Fabric className={ css('App',
-        { 'is-navOpen': isNavOpen }
+      <Fabric className={ css(
+        'App',
+        isNavOpen && 'is-navOpen'
       ) }>
         <Header />
         <div className='App-wrapper'>
diff --git a/common/changes/@uifabric/fabric-website/css-cleanup_2017-08-17-00-19.json b/common/changes/@uifabric/fabric-website/css-cleanup_2017-08-17-00-19.json
new file mode 100644
index 0000000000000..daf2f3bd0610f
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/css-cleanup_2017-08-17-00-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Minor css usage cleanup.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/css-cleanup_2017-08-17-00-19.json b/common/changes/office-ui-fabric-react/css-cleanup_2017-08-17-00-19.json
new file mode 100644
index 0000000000000..8226e7a0868a1
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/css-cleanup_2017-08-17-00-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Minor cleanup in merging of css class names.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
deleted file mode 100644
index e9f580f183c8d..0000000000000
--- a/package-lock.json
+++ /dev/null
@@ -1,3009 +0,0 @@
-{
-  "name": "office-ui-fabric-react-repo",
-  "version": "1.0.0",
-  "lockfileVersion": 1,
-  "requires": true,
-  "dependencies": {
-    "@microsoft/package-deps-hash": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/@microsoft/package-deps-hash/-/package-deps-hash-2.0.2.tgz",
-      "integrity": "sha1-e17NHr2RS2YIvwBUdKnQZ81MmUg=",
-      "dev": true
-    },
-    "@microsoft/rush": {
-      "version": "3.0.12",
-      "resolved": "https://registry.npmjs.org/@microsoft/rush/-/rush-3.0.12.tgz",
-      "integrity": "sha1-oLbMMxg7Bp+mY8gSwjK6EUGR440=",
-      "dev": true,
-      "requires": {
-        "@microsoft/package-deps-hash": "2.0.2",
-        "@microsoft/rush-lib": "3.0.12",
-        "@microsoft/stream-collator": "2.0.1",
-        "@microsoft/ts-command-line": "2.0.1",
-        "builtins": "1.0.3",
-        "colors": "1.1.2",
-        "fs-extra": "0.26.7",
-        "glob": "7.0.6",
-        "glob-escape": "0.0.2",
-        "inquirer": "1.2.3",
-        "lodash": "4.15.0",
-        "minimatch": "3.0.4",
-        "npm-package-arg": "5.1.2",
-        "read-package-tree": "5.1.6",
-        "semver": "5.3.0",
-        "wordwrap": "1.0.0"
-      }
-    },
-    "@microsoft/rush-lib": {
-      "version": "3.0.12",
-      "resolved": "https://registry.npmjs.org/@microsoft/rush-lib/-/rush-lib-3.0.12.tgz",
-      "integrity": "sha1-EQYu0qO0nvRUaJPuQPWmctNBgIM=",
-      "dev": true,
-      "requires": {
-        "@microsoft/stream-collator": "2.0.1",
-        "@types/es6-collections": "0.5.29",
-        "@types/fs-extra": "0.0.37",
-        "@types/node": "6.0.62",
-        "@types/z-schema": "3.16.31",
-        "fs-extra": "0.26.7",
-        "git-repo-info": "1.1.4",
-        "jju": "1.3.0",
-        "lodash": "4.15.0",
-        "rimraf": "2.5.4",
-        "semver": "5.3.0",
-        "z-schema": "3.17.0"
-      }
-    },
-    "@microsoft/stream-collator": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/@microsoft/stream-collator/-/stream-collator-2.0.1.tgz",
-      "integrity": "sha1-HGf86/kwM8KdIAwKkPOPQr/mBeY=",
-      "dev": true,
-      "requires": {
-        "@types/node": "6.0.64",
-        "colors": "1.1.2"
-      },
-      "dependencies": {
-        "@types/node": {
-          "version": "6.0.64",
-          "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.64.tgz",
-          "integrity": "sha1-zckBQR9jAeFDff7SO8aPVEQuTcg=",
-          "dev": true
-        }
-      }
-    },
-    "@microsoft/ts-command-line": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/@microsoft/ts-command-line/-/ts-command-line-2.0.1.tgz",
-      "integrity": "sha1-v1nDvt0A4eg/mM8xYki6+eYTEo4=",
-      "dev": true,
-      "requires": {
-        "@types/node": "6.0.64",
-        "argparse": "1.0.9",
-        "colors": "1.1.2"
-      },
-      "dependencies": {
-        "@types/node": {
-          "version": "6.0.64",
-          "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.64.tgz",
-          "integrity": "sha1-zckBQR9jAeFDff7SO8aPVEQuTcg=",
-          "dev": true
-        }
-      }
-    },
-    "@types/es6-collections": {
-      "version": "0.5.29",
-      "resolved": "https://registry.npmjs.org/@types/es6-collections/-/es6-collections-0.5.29.tgz",
-      "integrity": "sha1-7CKDH36N5zY3vxVmD52MomlGmA0=",
-      "dev": true
-    },
-    "@types/fs-extra": {
-      "version": "0.0.37",
-      "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.37.tgz",
-      "integrity": "sha1-GV8RvNmhuX2eQSxrZombVFRxofc=",
-      "dev": true,
-      "requires": {
-        "@types/node": "6.0.62"
-      }
-    },
-    "@types/node": {
-      "version": "6.0.62",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.62.tgz",
-      "integrity": "sha1-hSIsB3tU8ltXQXu3CLn4d72jf4k=",
-      "dev": true
-    },
-    "@types/z-schema": {
-      "version": "3.16.31",
-      "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.31.tgz",
-      "integrity": "sha1-LrHQCl5Ow/pYx2r94S4YK2bcXBw=",
-      "dev": true
-    },
-    "agent-base": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-2.1.1.tgz",
-      "integrity": "sha1-1t4Q1a9hMtW9aSQn1G/FOFOQlMc=",
-      "dev": true,
-      "requires": {
-        "extend": "3.0.1",
-        "semver": "5.0.3"
-      },
-      "dependencies": {
-        "semver": {
-          "version": "5.0.3",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.0.3.tgz",
-          "integrity": "sha1-d0Zt5YnNXTyV8TiqeLxWmjy10no=",
-          "dev": true
-        }
-      }
-    },
-    "ajv": {
-      "version": "4.11.8",
-      "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz",
-      "integrity": "sha1-gv+wKynmYq5TvcIK8VlHcGc5xTY=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "co": "4.6.0",
-        "json-stable-stringify": "1.0.1"
-      }
-    },
-    "ansi-escapes": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz",
-      "integrity": "sha1-06ioOzGapneTZisT52HHkRQiMG4=",
-      "dev": true
-    },
-    "ansi-regex": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
-      "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
-      "dev": true
-    },
-    "ansi-styles": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-      "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=",
-      "dev": true
-    },
-    "archy": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/archy/-/archy-1.0.0.tgz",
-      "integrity": "sha1-+cjBN1fMHde8N5rHeyxipcKGjEA=",
-      "dev": true
-    },
-    "argparse": {
-      "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.9.tgz",
-      "integrity": "sha1-c9g7wmP4bpf4zE9rrhsOkKfSLIY=",
-      "dev": true,
-      "requires": {
-        "sprintf-js": "1.0.3"
-      }
-    },
-    "arr-diff": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
-      "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8=",
-      "dev": true,
-      "requires": {
-        "arr-flatten": "1.0.3"
-      }
-    },
-    "arr-flatten": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.0.3.tgz",
-      "integrity": "sha1-onTthawIhJtr14R8RYB0XcUa37E=",
-      "dev": true
-    },
-    "array-differ": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/array-differ/-/array-differ-1.0.0.tgz",
-      "integrity": "sha1-7/UuN1gknTO+QCuLuOVkuytdQDE=",
-      "dev": true
-    },
-    "array-uniq": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz",
-      "integrity": "sha1-r2rId6Jcx/dOBYiUdThY39sk/bY=",
-      "dev": true
-    },
-    "array-unique": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
-      "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM=",
-      "dev": true
-    },
-    "asap": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.5.tgz",
-      "integrity": "sha1-UidltQw1EEkOUtfc/ghe+bqWlY8=",
-      "dev": true
-    },
-    "asn1": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.3.tgz",
-      "integrity": "sha1-2sh4dxPJlmhJ/IGAd36+nB3fO4Y=",
-      "dev": true,
-      "optional": true
-    },
-    "assert-plus": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-0.2.0.tgz",
-      "integrity": "sha1-104bh+ev/A24qttwIfP+SBAasjQ=",
-      "dev": true,
-      "optional": true
-    },
-    "asynckit": {
-      "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
-      "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k=",
-      "dev": true,
-      "optional": true
-    },
-    "aws-sign2": {
-      "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz",
-      "integrity": "sha1-FDQt0428yU0OW4fXY81jYSwOeU8=",
-      "dev": true,
-      "optional": true
-    },
-    "aws4": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.6.0.tgz",
-      "integrity": "sha1-g+9cqGCysy5KDe7e6MdxudtXRx4=",
-      "dev": true,
-      "optional": true
-    },
-    "balanced-match": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
-      "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c=",
-      "dev": true
-    },
-    "bcrypt-pbkdf": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/bcrypt-pbkdf/-/bcrypt-pbkdf-1.0.1.tgz",
-      "integrity": "sha1-Y7xdy2EzG5K8Bf1SiVPDNGKgb40=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "tweetnacl": "0.14.5"
-      }
-    },
-    "beeper": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/beeper/-/beeper-1.1.1.tgz",
-      "integrity": "sha1-5tXqjF2tABMEpwsiY4RH9pyy+Ak=",
-      "dev": true
-    },
-    "boom": {
-      "version": "2.10.1",
-      "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
-      "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8=",
-      "dev": true,
-      "requires": {
-        "hoek": "2.16.3"
-      }
-    },
-    "brace-expansion": {
-      "version": "1.1.8",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.8.tgz",
-      "integrity": "sha1-wHshHHyVLsH479Uad+8NHTmQopI=",
-      "dev": true,
-      "requires": {
-        "balanced-match": "1.0.0",
-        "concat-map": "0.0.1"
-      }
-    },
-    "braces": {
-      "version": "1.8.5",
-      "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
-      "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc=",
-      "dev": true,
-      "requires": {
-        "expand-range": "1.8.2",
-        "preserve": "0.2.0",
-        "repeat-element": "1.1.2"
-      }
-    },
-    "builtin-modules": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz",
-      "integrity": "sha1-Jw8HbFpywC9bZaR9+Uxf46J4iS8=",
-      "dev": true
-    },
-    "builtins": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/builtins/-/builtins-1.0.3.tgz",
-      "integrity": "sha1-y5T662HIaWRR2zZTThQi+U8K7og=",
-      "dev": true
-    },
-    "camelcase": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
-      "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo=",
-      "dev": true
-    },
-    "caseless": {
-      "version": "0.12.0",
-      "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz",
-      "integrity": "sha1-G2gcIf+EAzyCZUMJBolCDRhxUdw=",
-      "dev": true,
-      "optional": true
-    },
-    "chalk": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-      "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
-      "dev": true,
-      "requires": {
-        "ansi-styles": "2.2.1",
-        "escape-string-regexp": "1.0.5",
-        "has-ansi": "2.0.0",
-        "strip-ansi": "3.0.1",
-        "supports-color": "2.0.0"
-      }
-    },
-    "cli-cursor": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-1.0.2.tgz",
-      "integrity": "sha1-ZNo/fValRBLll5S9Ytw1KV6PKYc=",
-      "dev": true,
-      "requires": {
-        "restore-cursor": "1.0.1"
-      }
-    },
-    "cli-width": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-2.1.0.tgz",
-      "integrity": "sha1-sjTKIJsp72b8UY2bmNWEewDt8Ao=",
-      "dev": true
-    },
-    "cliui": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
-      "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0=",
-      "dev": true,
-      "requires": {
-        "string-width": "1.0.2",
-        "strip-ansi": "3.0.1",
-        "wrap-ansi": "2.1.0"
-      }
-    },
-    "clone": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.2.tgz",
-      "integrity": "sha1-Jgt6meux7f4kdTgXX3gyQ8sZ0Uk=",
-      "dev": true
-    },
-    "clone-stats": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-0.0.1.tgz",
-      "integrity": "sha1-uI+UqCzzi4eR1YBG6kAprYjKmdE=",
-      "dev": true
-    },
-    "co": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
-      "integrity": "sha1-bqa989hTrlTMuOR7+gvz+QMfsYQ=",
-      "dev": true,
-      "optional": true
-    },
-    "code-point-at": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz",
-      "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c=",
-      "dev": true
-    },
-    "colors": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/colors/-/colors-1.1.2.tgz",
-      "integrity": "sha1-FopHAXVran9RoSzgyXv6KMCE7WM=",
-      "dev": true
-    },
-    "combined-stream": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz",
-      "integrity": "sha1-k4NwpXtKUd6ix3wV1cX9+JUWQAk=",
-      "dev": true,
-      "requires": {
-        "delayed-stream": "1.0.0"
-      }
-    },
-    "commander": {
-      "version": "2.9.0",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
-      "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "graceful-readlink": "1.0.1"
-      }
-    },
-    "concat-map": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
-      "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=",
-      "dev": true
-    },
-    "concat-stream": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.0.tgz",
-      "integrity": "sha1-CqxmL9Ur54lk1VMvaUeE5wEQrPc=",
-      "dev": true,
-      "requires": {
-        "inherits": "2.0.3",
-        "readable-stream": "2.2.11",
-        "typedarray": "0.0.6"
-      }
-    },
-    "core-util-is": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
-      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=",
-      "dev": true
-    },
-    "cryptiles": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz",
-      "integrity": "sha1-O9/s3GCBR8HGcgL6KR59ylnqo7g=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "boom": "2.10.1"
-      }
-    },
-    "dashdash": {
-      "version": "1.14.1",
-      "resolved": "https://registry.npmjs.org/dashdash/-/dashdash-1.14.1.tgz",
-      "integrity": "sha1-hTz6D3y+L+1d4gMmuN1YEDX24vA=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "assert-plus": "1.0.0"
-      },
-      "dependencies": {
-        "assert-plus": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
-          "dev": true,
-          "optional": true
-        }
-      }
-    },
-    "dateformat": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-2.0.0.tgz",
-      "integrity": "sha1-J0Pjq7XD/CRi5SfcpEXgTp9N7hc=",
-      "dev": true
-    },
-    "debug": {
-      "version": "2.6.8",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
-      "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw=",
-      "dev": true,
-      "requires": {
-        "ms": "2.0.0"
-      }
-    },
-    "debuglog": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/debuglog/-/debuglog-1.0.1.tgz",
-      "integrity": "sha1-qiT/uaw9+aI1GDfPstJ5NgzXhJI=",
-      "dev": true
-    },
-    "decamelize": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
-      "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA=",
-      "dev": true
-    },
-    "defaults": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.3.tgz",
-      "integrity": "sha1-xlYFHpgX2f8I7YgUd/P+QBnz730=",
-      "dev": true,
-      "requires": {
-        "clone": "1.0.2"
-      }
-    },
-    "delayed-stream": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
-      "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk=",
-      "dev": true
-    },
-    "deprecated": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/deprecated/-/deprecated-0.0.1.tgz",
-      "integrity": "sha1-+cmvVGSvoeepcUWKi97yqpTVuxk=",
-      "dev": true
-    },
-    "detect-file": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/detect-file/-/detect-file-0.1.0.tgz",
-      "integrity": "sha1-STXe39lIhkjgBrASlWbpOGcR6mM=",
-      "dev": true,
-      "requires": {
-        "fs-exists-sync": "0.1.0"
-      }
-    },
-    "dezalgo": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/dezalgo/-/dezalgo-1.0.3.tgz",
-      "integrity": "sha1-f3Qt4Gb8dIvI24IFad3c5Jvw1FY=",
-      "dev": true,
-      "requires": {
-        "asap": "2.0.5",
-        "wrappy": "1.0.2"
-      }
-    },
-    "duplexer2": {
-      "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.0.2.tgz",
-      "integrity": "sha1-xhTc9n4vsUmVqRcR5aYX6KYKMds=",
-      "dev": true,
-      "requires": {
-        "readable-stream": "1.1.14"
-      },
-      "dependencies": {
-        "isarray": {
-          "version": "0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
-          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
-          "dev": true
-        },
-        "readable-stream": {
-          "version": "1.1.14",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
-          "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk=",
-          "dev": true,
-          "requires": {
-            "core-util-is": "1.0.2",
-            "inherits": "2.0.3",
-            "isarray": "0.0.1",
-            "string_decoder": "0.10.31"
-          }
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
-          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=",
-          "dev": true
-        }
-      }
-    },
-    "ecc-jsbn": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.1.tgz",
-      "integrity": "sha1-D8c6ntXw1Tw4GTOYUj735UN3dQU=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "jsbn": "0.1.1"
-      }
-    },
-    "end-of-stream": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-0.1.5.tgz",
-      "integrity": "sha1-jhdyBsPICDfYVjLouTWd/osvbq8=",
-      "dev": true,
-      "requires": {
-        "once": "1.3.3"
-      },
-      "dependencies": {
-        "once": {
-          "version": "1.3.3",
-          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz",
-          "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA=",
-          "dev": true,
-          "requires": {
-            "wrappy": "1.0.2"
-          }
-        }
-      }
-    },
-    "error-ex": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.1.tgz",
-      "integrity": "sha1-+FWobOYa3E6GIcPNoh56dhLDqNw=",
-      "dev": true,
-      "requires": {
-        "is-arrayish": "0.2.1"
-      }
-    },
-    "escape-string-regexp": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
-      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
-      "dev": true
-    },
-    "exit-hook": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/exit-hook/-/exit-hook-1.1.1.tgz",
-      "integrity": "sha1-8FyiM7SMBdVP/wd2XfhQfpXAL/g=",
-      "dev": true
-    },
-    "expand-brackets": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
-      "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s=",
-      "dev": true,
-      "requires": {
-        "is-posix-bracket": "0.1.1"
-      }
-    },
-    "expand-range": {
-      "version": "1.8.2",
-      "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz",
-      "integrity": "sha1-opnv/TNf4nIeuujiV+x5ZE/IUzc=",
-      "dev": true,
-      "requires": {
-        "fill-range": "2.2.3"
-      }
-    },
-    "expand-tilde": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-1.2.2.tgz",
-      "integrity": "sha1-C4HrqJflo9MdHD0QL48BRB5VlEk=",
-      "dev": true,
-      "requires": {
-        "os-homedir": "1.0.2"
-      }
-    },
-    "extend": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz",
-      "integrity": "sha1-p1Xqe8Gt/MWjHOfnYtuq3F5jZEQ=",
-      "dev": true
-    },
-    "external-editor": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/external-editor/-/external-editor-1.1.1.tgz",
-      "integrity": "sha1-Etew24UPf/fnCBuvQAVwAGDEYAs=",
-      "dev": true,
-      "requires": {
-        "extend": "3.0.1",
-        "spawn-sync": "1.0.15",
-        "tmp": "0.0.29"
-      }
-    },
-    "extglob": {
-      "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
-      "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE=",
-      "dev": true,
-      "requires": {
-        "is-extglob": "1.0.0"
-      }
-    },
-    "extsprintf": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.0.2.tgz",
-      "integrity": "sha1-4QgOBljjALBilJkMxw4VAiNf1VA=",
-      "dev": true
-    },
-    "fancy-log": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/fancy-log/-/fancy-log-1.3.0.tgz",
-      "integrity": "sha1-Rb4X0Cu5kX1gzP/UmVyZnmyMmUg=",
-      "dev": true,
-      "requires": {
-        "chalk": "1.1.3",
-        "time-stamp": "1.1.0"
-      }
-    },
-    "figures": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz",
-      "integrity": "sha1-y+Hjr/zxzUS4DK3+0o3Hk6lwHS4=",
-      "dev": true,
-      "requires": {
-        "escape-string-regexp": "1.0.5",
-        "object-assign": "4.1.1"
-      }
-    },
-    "filename-regex": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz",
-      "integrity": "sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY=",
-      "dev": true
-    },
-    "fill-range": {
-      "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz",
-      "integrity": "sha1-ULd9/X5Gm8dJJHCWNpn+eoSFpyM=",
-      "dev": true,
-      "requires": {
-        "is-number": "2.1.0",
-        "isobject": "2.1.0",
-        "randomatic": "1.1.7",
-        "repeat-element": "1.1.2",
-        "repeat-string": "1.6.1"
-      }
-    },
-    "find-index": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
-      "integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ=",
-      "dev": true
-    },
-    "find-up": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
-      "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8=",
-      "dev": true,
-      "requires": {
-        "path-exists": "2.1.0",
-        "pinkie-promise": "2.0.1"
-      }
-    },
-    "findup-sync": {
-      "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.4.3.tgz",
-      "integrity": "sha1-QAQ5Kee8YK3wt/SCfExudaDeyhI=",
-      "dev": true,
-      "requires": {
-        "detect-file": "0.1.0",
-        "is-glob": "2.0.1",
-        "micromatch": "2.3.11",
-        "resolve-dir": "0.1.1"
-      }
-    },
-    "fined": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/fined/-/fined-1.0.2.tgz",
-      "integrity": "sha1-WyhCS3YNdZiWC374SA3/itNmDpc=",
-      "dev": true,
-      "requires": {
-        "expand-tilde": "1.2.2",
-        "lodash.assignwith": "4.2.0",
-        "lodash.isempty": "4.4.0",
-        "lodash.isplainobject": "4.0.6",
-        "lodash.isstring": "4.0.1",
-        "lodash.pick": "4.4.0",
-        "parse-filepath": "1.0.1"
-      }
-    },
-    "first-chunk-stream": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/first-chunk-stream/-/first-chunk-stream-1.0.0.tgz",
-      "integrity": "sha1-Wb+1DNkF9g18OUzT2ayqtOatk04=",
-      "dev": true
-    },
-    "flagged-respawn": {
-      "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/flagged-respawn/-/flagged-respawn-0.3.2.tgz",
-      "integrity": "sha1-/xke3c1wiKZ1smEP/8l2vpuAdLU=",
-      "dev": true
-    },
-    "follow-redirects": {
-      "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-0.0.7.tgz",
-      "integrity": "sha1-NLkLqyqRGqNHVx2pDyK9NuzYqRk=",
-      "dev": true,
-      "requires": {
-        "debug": "2.6.8",
-        "stream-consume": "0.1.0"
-      }
-    },
-    "for-in": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
-      "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA=",
-      "dev": true
-    },
-    "for-own": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz",
-      "integrity": "sha1-UmXGgaTylNq78XyVCbZ2OqhFEM4=",
-      "dev": true,
-      "requires": {
-        "for-in": "1.0.2"
-      }
-    },
-    "forever-agent": {
-      "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
-      "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE=",
-      "dev": true,
-      "optional": true
-    },
-    "form-data": {
-      "version": "2.1.4",
-      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
-      "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "asynckit": "0.4.0",
-        "combined-stream": "1.0.5",
-        "mime-types": "2.1.15"
-      }
-    },
-    "fs-exists-sync": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/fs-exists-sync/-/fs-exists-sync-0.1.0.tgz",
-      "integrity": "sha1-mC1ok6+RjnLQjeyehnP/K1qNat0=",
-      "dev": true
-    },
-    "fs-extra": {
-      "version": "0.26.7",
-      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz",
-      "integrity": "sha1-muH92UiXeY7at20JGM9C0MMYT6k=",
-      "dev": true,
-      "requires": {
-        "graceful-fs": "4.1.11",
-        "jsonfile": "2.4.0",
-        "klaw": "1.3.1",
-        "path-is-absolute": "1.0.1",
-        "rimraf": "2.5.4"
-      }
-    },
-    "fs.realpath": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
-      "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=",
-      "dev": true
-    },
-    "gaze": {
-      "version": "0.5.2",
-      "resolved": "https://registry.npmjs.org/gaze/-/gaze-0.5.2.tgz",
-      "integrity": "sha1-QLcJU30k0dRXZ9takIaJ3+aaxE8=",
-      "dev": true,
-      "requires": {
-        "globule": "0.1.0"
-      }
-    },
-    "get-caller-file": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz",
-      "integrity": "sha1-9wLmMSfn4jHBYKgMFVSstw1QR+U=",
-      "dev": true
-    },
-    "getpass": {
-      "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
-      "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "assert-plus": "1.0.0"
-      },
-      "dependencies": {
-        "assert-plus": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
-          "dev": true,
-          "optional": true
-        }
-      }
-    },
-    "git-repo-info": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/git-repo-info/-/git-repo-info-1.1.4.tgz",
-      "integrity": "sha1-E0n6OIinZh6h/2OgR8L/Q7PglgI=",
-      "dev": true
-    },
-    "github": {
-      "version": "7.3.2",
-      "resolved": "https://registry.npmjs.org/github/-/github-7.3.2.tgz",
-      "integrity": "sha1-/hDN5pZDUsXZHhGnYW0m1f+2+Hs=",
-      "dev": true,
-      "requires": {
-        "follow-redirects": "0.0.7",
-        "https-proxy-agent": "1.0.0",
-        "mime": "1.3.6",
-        "netrc": "0.1.4"
-      }
-    },
-    "glob": {
-      "version": "7.0.6",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-7.0.6.tgz",
-      "integrity": "sha1-IRuvr0nlJbjNkyYNFKsTYVKz9Xo=",
-      "dev": true,
-      "requires": {
-        "fs.realpath": "1.0.0",
-        "inflight": "1.0.6",
-        "inherits": "2.0.3",
-        "minimatch": "3.0.4",
-        "once": "1.4.0",
-        "path-is-absolute": "1.0.1"
-      }
-    },
-    "glob-base": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz",
-      "integrity": "sha1-27Fk9iIbHAscz4Kuoyi0l98Oo8Q=",
-      "dev": true,
-      "requires": {
-        "glob-parent": "2.0.0",
-        "is-glob": "2.0.1"
-      }
-    },
-    "glob-escape": {
-      "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/glob-escape/-/glob-escape-0.0.2.tgz",
-      "integrity": "sha1-nCf3gh7RwTd1gvPv2VWOP2dWKO0=",
-      "dev": true
-    },
-    "glob-parent": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz",
-      "integrity": "sha1-gTg9ctsFT8zPUzbaqQLxgvbtuyg=",
-      "dev": true,
-      "requires": {
-        "is-glob": "2.0.1"
-      }
-    },
-    "glob-stream": {
-      "version": "3.1.18",
-      "resolved": "https://registry.npmjs.org/glob-stream/-/glob-stream-3.1.18.tgz",
-      "integrity": "sha1-kXCl8St5Awb9/lmPMT+PeVT9FDs=",
-      "dev": true,
-      "requires": {
-        "glob": "4.5.3",
-        "glob2base": "0.0.12",
-        "minimatch": "2.0.10",
-        "ordered-read-streams": "0.1.0",
-        "through2": "0.6.5",
-        "unique-stream": "1.0.0"
-      },
-      "dependencies": {
-        "glob": {
-          "version": "4.5.3",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-4.5.3.tgz",
-          "integrity": "sha1-xstz0yJsHv7wTePFbQEvAzd+4V8=",
-          "dev": true,
-          "requires": {
-            "inflight": "1.0.6",
-            "inherits": "2.0.3",
-            "minimatch": "2.0.10",
-            "once": "1.4.0"
-          }
-        },
-        "isarray": {
-          "version": "0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
-          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
-          "dev": true
-        },
-        "minimatch": {
-          "version": "2.0.10",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-2.0.10.tgz",
-          "integrity": "sha1-jQh8OcazjAAbl/ynzm0OHoCvusc=",
-          "dev": true,
-          "requires": {
-            "brace-expansion": "1.1.8"
-          }
-        },
-        "readable-stream": {
-          "version": "1.0.34",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
-          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=",
-          "dev": true,
-          "requires": {
-            "core-util-is": "1.0.2",
-            "inherits": "2.0.3",
-            "isarray": "0.0.1",
-            "string_decoder": "0.10.31"
-          }
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
-          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=",
-          "dev": true
-        },
-        "through2": {
-          "version": "0.6.5",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
-          "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg=",
-          "dev": true,
-          "requires": {
-            "readable-stream": "1.0.34",
-            "xtend": "4.0.1"
-          }
-        }
-      }
-    },
-    "glob-watcher": {
-      "version": "0.0.6",
-      "resolved": "https://registry.npmjs.org/glob-watcher/-/glob-watcher-0.0.6.tgz",
-      "integrity": "sha1-uVtKjfdLOcgymLDAXJeLTZo7cQs=",
-      "dev": true,
-      "requires": {
-        "gaze": "0.5.2"
-      }
-    },
-    "glob2base": {
-      "version": "0.0.12",
-      "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz",
-      "integrity": "sha1-nUGbPijxLoOjYhZKJ3BVkiycDVY=",
-      "dev": true,
-      "requires": {
-        "find-index": "0.1.1"
-      }
-    },
-    "global-modules": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-0.2.3.tgz",
-      "integrity": "sha1-6lo77ULG1s6ZWk+KEmm12uIjgo0=",
-      "dev": true,
-      "requires": {
-        "global-prefix": "0.1.5",
-        "is-windows": "0.2.0"
-      }
-    },
-    "global-prefix": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-0.1.5.tgz",
-      "integrity": "sha1-jTvGuNo8qBEqFg2NSW/wRiv+948=",
-      "dev": true,
-      "requires": {
-        "homedir-polyfill": "1.0.1",
-        "ini": "1.3.4",
-        "is-windows": "0.2.0",
-        "which": "1.2.14"
-      }
-    },
-    "globule": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/globule/-/globule-0.1.0.tgz",
-      "integrity": "sha1-2cjt3h2nnRJaFRt5UzuXhnY0auU=",
-      "dev": true,
-      "requires": {
-        "glob": "3.1.21",
-        "lodash": "1.0.2",
-        "minimatch": "0.2.14"
-      },
-      "dependencies": {
-        "glob": {
-          "version": "3.1.21",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-3.1.21.tgz",
-          "integrity": "sha1-0p4KBV3qUTj00H7UDomC6DwgZs0=",
-          "dev": true,
-          "requires": {
-            "graceful-fs": "1.2.3",
-            "inherits": "1.0.2",
-            "minimatch": "0.2.14"
-          }
-        },
-        "graceful-fs": {
-          "version": "1.2.3",
-          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-1.2.3.tgz",
-          "integrity": "sha1-FaSAaldUfLLS2/J/QuiajDRRs2Q=",
-          "dev": true
-        },
-        "inherits": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/inherits/-/inherits-1.0.2.tgz",
-          "integrity": "sha1-ykMJ2t7mtUzAuNJH6NfHoJdb3Js=",
-          "dev": true
-        },
-        "lodash": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-1.0.2.tgz",
-          "integrity": "sha1-j1dWDIO1n8JwvT1WG2kAQ0MOJVE=",
-          "dev": true
-        },
-        "minimatch": {
-          "version": "0.2.14",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.2.14.tgz",
-          "integrity": "sha1-x054BXT2PG+aCQ6Q775u9TpqdWo=",
-          "dev": true,
-          "requires": {
-            "lru-cache": "2.7.3",
-            "sigmund": "1.0.1"
-          }
-        }
-      }
-    },
-    "glogg": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/glogg/-/glogg-1.0.0.tgz",
-      "integrity": "sha1-f+DxmfV6yQbPUS/urY+Q7kooT8U=",
-      "dev": true,
-      "requires": {
-        "sparkles": "1.0.0"
-      }
-    },
-    "graceful-fs": {
-      "version": "4.1.11",
-      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz",
-      "integrity": "sha1-Dovf5NHduIVNZOBOp8AOKgJuVlg=",
-      "dev": true
-    },
-    "graceful-readlink": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz",
-      "integrity": "sha1-TK+tdrxi8C+gObL5Tpo906ORpyU=",
-      "dev": true,
-      "optional": true
-    },
-    "gulp": {
-      "version": "3.9.1",
-      "resolved": "https://registry.npmjs.org/gulp/-/gulp-3.9.1.tgz",
-      "integrity": "sha1-VxzkWSjdQK9lFPxAEYZgFsE4RbQ=",
-      "dev": true,
-      "requires": {
-        "archy": "1.0.0",
-        "chalk": "1.1.3",
-        "deprecated": "0.0.1",
-        "gulp-util": "3.0.8",
-        "interpret": "1.0.3",
-        "liftoff": "2.3.0",
-        "minimist": "1.2.0",
-        "orchestrator": "0.3.8",
-        "pretty-hrtime": "1.0.3",
-        "semver": "4.3.6",
-        "tildify": "1.2.0",
-        "v8flags": "2.1.1",
-        "vinyl-fs": "0.3.14"
-      },
-      "dependencies": {
-        "semver": {
-          "version": "4.3.6",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz",
-          "integrity": "sha1-MAvG4OhjdPe6YQaLWx7NV/xlMto=",
-          "dev": true
-        }
-      }
-    },
-    "gulp-util": {
-      "version": "3.0.8",
-      "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.8.tgz",
-      "integrity": "sha1-AFTh50RQLifATBh8PsxQXdVLu08=",
-      "dev": true,
-      "requires": {
-        "array-differ": "1.0.0",
-        "array-uniq": "1.0.3",
-        "beeper": "1.1.1",
-        "chalk": "1.1.3",
-        "dateformat": "2.0.0",
-        "fancy-log": "1.3.0",
-        "gulplog": "1.0.0",
-        "has-gulplog": "0.1.0",
-        "lodash._reescape": "3.0.0",
-        "lodash._reevaluate": "3.0.0",
-        "lodash._reinterpolate": "3.0.0",
-        "lodash.template": "3.6.2",
-        "minimist": "1.2.0",
-        "multipipe": "0.1.2",
-        "object-assign": "3.0.0",
-        "replace-ext": "0.0.1",
-        "through2": "2.0.3",
-        "vinyl": "0.5.3"
-      },
-      "dependencies": {
-        "object-assign": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz",
-          "integrity": "sha1-m+3VygiXlJvKR+f/QIBi1Un1h/I=",
-          "dev": true
-        }
-      }
-    },
-    "gulplog": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/gulplog/-/gulplog-1.0.0.tgz",
-      "integrity": "sha1-4oxNRdBey77YGDY86PnFkmIp/+U=",
-      "dev": true,
-      "requires": {
-        "glogg": "1.0.0"
-      }
-    },
-    "har-schema": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-1.0.5.tgz",
-      "integrity": "sha1-0mMTX0MwfALGAq/I/pWXDAFRNp4=",
-      "dev": true,
-      "optional": true
-    },
-    "har-validator": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz",
-      "integrity": "sha1-M0gdDxu/9gDdID11gSpqX7oALio=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "ajv": "4.11.8",
-        "har-schema": "1.0.5"
-      }
-    },
-    "has-ansi": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz",
-      "integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE=",
-      "dev": true,
-      "requires": {
-        "ansi-regex": "2.1.1"
-      }
-    },
-    "has-gulplog": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/has-gulplog/-/has-gulplog-0.1.0.tgz",
-      "integrity": "sha1-ZBTIKRNpfaUVkDl9r7EvIpZ4Ec4=",
-      "dev": true,
-      "requires": {
-        "sparkles": "1.0.0"
-      }
-    },
-    "hawk": {
-      "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz",
-      "integrity": "sha1-B4REvXwWQLD+VA0sm3PVlnjo4cQ=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "boom": "2.10.1",
-        "cryptiles": "2.0.5",
-        "hoek": "2.16.3",
-        "sntp": "1.0.9"
-      }
-    },
-    "hoek": {
-      "version": "2.16.3",
-      "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz",
-      "integrity": "sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0=",
-      "dev": true
-    },
-    "homedir-polyfill": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.1.tgz",
-      "integrity": "sha1-TCu8inWJmP7r9e1oWA921GdotLw=",
-      "dev": true,
-      "requires": {
-        "parse-passwd": "1.0.0"
-      }
-    },
-    "hosted-git-info": {
-      "version": "2.4.2",
-      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.4.2.tgz",
-      "integrity": "sha1-AHa59GonBQbduq6lZJaJdGBhKmc=",
-      "dev": true
-    },
-    "http-signature": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz",
-      "integrity": "sha1-33LiZwZs0Kxn+3at+OE0qPvPkb8=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "assert-plus": "0.2.0",
-        "jsprim": "1.4.0",
-        "sshpk": "1.13.1"
-      }
-    },
-    "https-proxy-agent": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-1.0.0.tgz",
-      "integrity": "sha1-NffabEjOTdv6JkiRrFk+5f+GceY=",
-      "dev": true,
-      "requires": {
-        "agent-base": "2.1.1",
-        "debug": "2.6.8",
-        "extend": "3.0.1"
-      }
-    },
-    "inflight": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
-      "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=",
-      "dev": true,
-      "requires": {
-        "once": "1.4.0",
-        "wrappy": "1.0.2"
-      }
-    },
-    "inherits": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
-      "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=",
-      "dev": true
-    },
-    "ini": {
-      "version": "1.3.4",
-      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.4.tgz",
-      "integrity": "sha1-BTfLedr1m1mhpRff9wbIbsA5Fi4=",
-      "dev": true
-    },
-    "inquirer": {
-      "version": "1.2.3",
-      "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-1.2.3.tgz",
-      "integrity": "sha1-TexvMvN+97sLLtPx0aXD9UUHSRg=",
-      "dev": true,
-      "requires": {
-        "ansi-escapes": "1.4.0",
-        "chalk": "1.1.3",
-        "cli-cursor": "1.0.2",
-        "cli-width": "2.1.0",
-        "external-editor": "1.1.1",
-        "figures": "1.7.0",
-        "lodash": "4.15.0",
-        "mute-stream": "0.0.6",
-        "pinkie-promise": "2.0.1",
-        "run-async": "2.3.0",
-        "rx": "4.1.0",
-        "string-width": "1.0.2",
-        "strip-ansi": "3.0.1",
-        "through": "2.3.8"
-      }
-    },
-    "interpret": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.0.3.tgz",
-      "integrity": "sha1-y8NcYu7uc/Gat7EKgBURQBr8D5A=",
-      "dev": true
-    },
-    "invert-kv": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/invert-kv/-/invert-kv-1.0.0.tgz",
-      "integrity": "sha1-EEqOSqym09jNFXqO+L+rLXo//bY=",
-      "dev": true
-    },
-    "is-absolute": {
-      "version": "0.2.6",
-      "resolved": "https://registry.npmjs.org/is-absolute/-/is-absolute-0.2.6.tgz",
-      "integrity": "sha1-IN5p89uULvLYe5wto28XIjWxtes=",
-      "dev": true,
-      "requires": {
-        "is-relative": "0.2.1",
-        "is-windows": "0.2.0"
-      }
-    },
-    "is-arrayish": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
-      "integrity": "sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0=",
-      "dev": true
-    },
-    "is-buffer": {
-      "version": "1.1.5",
-      "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.5.tgz",
-      "integrity": "sha1-Hzsm72E7IUuIy8ojzGwB2Hlh7sw=",
-      "dev": true
-    },
-    "is-builtin-module": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-1.0.0.tgz",
-      "integrity": "sha1-VAVy0096wxGfj3bDDLwbHgN6/74=",
-      "dev": true,
-      "requires": {
-        "builtin-modules": "1.1.1"
-      }
-    },
-    "is-dotfile": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/is-dotfile/-/is-dotfile-1.0.3.tgz",
-      "integrity": "sha1-pqLzL/0t+wT1yiXs0Pa4PPeYoeE=",
-      "dev": true
-    },
-    "is-equal-shallow": {
-      "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/is-equal-shallow/-/is-equal-shallow-0.1.3.tgz",
-      "integrity": "sha1-IjgJj8Ih3gvPpdnqxMRdY4qhxTQ=",
-      "dev": true,
-      "requires": {
-        "is-primitive": "2.0.0"
-      }
-    },
-    "is-extendable": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
-      "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=",
-      "dev": true
-    },
-    "is-extglob": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
-      "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA=",
-      "dev": true
-    },
-    "is-fullwidth-code-point": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
-      "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
-      "dev": true,
-      "requires": {
-        "number-is-nan": "1.0.1"
-      }
-    },
-    "is-glob": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz",
-      "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM=",
-      "dev": true,
-      "requires": {
-        "is-extglob": "1.0.0"
-      }
-    },
-    "is-number": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz",
-      "integrity": "sha1-Afy7s5NGOlSPL0ZszhbezknbkI8=",
-      "dev": true,
-      "requires": {
-        "kind-of": "3.2.2"
-      }
-    },
-    "is-posix-bracket": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz",
-      "integrity": "sha1-MzTceXdDaOkvAW5vvAqI9c1ua8Q=",
-      "dev": true
-    },
-    "is-primitive": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/is-primitive/-/is-primitive-2.0.0.tgz",
-      "integrity": "sha1-IHurkWOEmcB7Kt8kCkGochADRXU=",
-      "dev": true
-    },
-    "is-promise": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/is-promise/-/is-promise-2.1.0.tgz",
-      "integrity": "sha1-eaKp7OfwlugPNtKy87wWwf9L8/o=",
-      "dev": true
-    },
-    "is-relative": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/is-relative/-/is-relative-0.2.1.tgz",
-      "integrity": "sha1-0n9MfVFtF1+2ENuEu+7yPDvJeqU=",
-      "dev": true,
-      "requires": {
-        "is-unc-path": "0.1.2"
-      }
-    },
-    "is-typedarray": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz",
-      "integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo=",
-      "dev": true,
-      "optional": true
-    },
-    "is-unc-path": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/is-unc-path/-/is-unc-path-0.1.2.tgz",
-      "integrity": "sha1-arBTpyVzwQJQ/0FqOBTDUXivObk=",
-      "dev": true,
-      "requires": {
-        "unc-path-regex": "0.1.2"
-      }
-    },
-    "is-utf8": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz",
-      "integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI=",
-      "dev": true
-    },
-    "is-windows": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-0.2.0.tgz",
-      "integrity": "sha1-3hqm1j6indJIc3tp8f+LgALSEIw=",
-      "dev": true
-    },
-    "isarray": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-      "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=",
-      "dev": true
-    },
-    "isexe": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
-      "integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA=",
-      "dev": true
-    },
-    "isobject": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
-      "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk=",
-      "dev": true,
-      "requires": {
-        "isarray": "1.0.0"
-      }
-    },
-    "isstream": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz",
-      "integrity": "sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo=",
-      "dev": true,
-      "optional": true
-    },
-    "jju": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/jju/-/jju-1.3.0.tgz",
-      "integrity": "sha1-2t2e8BkkvHKLA/L3l5vb1i96Kqo=",
-      "dev": true
-    },
-    "jsbn": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-0.1.1.tgz",
-      "integrity": "sha1-peZUwuWi3rXyAdls77yoDA7y9RM=",
-      "dev": true,
-      "optional": true
-    },
-    "json-parse-helpfulerror": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/json-parse-helpfulerror/-/json-parse-helpfulerror-1.0.3.tgz",
-      "integrity": "sha1-E/FM4C7tTpgSl7ZOueO5MuLdE9w=",
-      "dev": true,
-      "requires": {
-        "jju": "1.3.0"
-      }
-    },
-    "json-schema": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz",
-      "integrity": "sha1-tIDIkuWaLwWVTOcnvT8qTogvnhM=",
-      "dev": true,
-      "optional": true
-    },
-    "json-stable-stringify": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz",
-      "integrity": "sha1-mnWdOcXy/1A/1TAGRu1EX4jE+a8=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "jsonify": "0.0.0"
-      }
-    },
-    "json-stringify-safe": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz",
-      "integrity": "sha1-Epai1Y/UXxmg9s4B1lcB4sc1tus=",
-      "dev": true,
-      "optional": true
-    },
-    "jsonfile": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz",
-      "integrity": "sha1-NzaitCi4e72gzIO1P6PWM6NcKug=",
-      "dev": true,
-      "requires": {
-        "graceful-fs": "4.1.11"
-      }
-    },
-    "jsonify": {
-      "version": "0.0.0",
-      "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz",
-      "integrity": "sha1-LHS27kHZPKUbe1qu6PUDYx0lKnM=",
-      "dev": true,
-      "optional": true
-    },
-    "jsprim": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.0.tgz",
-      "integrity": "sha1-o7h+QCmNjDgFUtjMdiigu5WiKRg=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "assert-plus": "1.0.0",
-        "extsprintf": "1.0.2",
-        "json-schema": "0.2.3",
-        "verror": "1.3.6"
-      },
-      "dependencies": {
-        "assert-plus": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
-          "dev": true,
-          "optional": true
-        }
-      }
-    },
-    "kind-of": {
-      "version": "3.2.2",
-      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-      "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
-      "dev": true,
-      "requires": {
-        "is-buffer": "1.1.5"
-      }
-    },
-    "klaw": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/klaw/-/klaw-1.3.1.tgz",
-      "integrity": "sha1-QIhDO0azsbolnXh4XY6W9zugJDk=",
-      "dev": true,
-      "requires": {
-        "graceful-fs": "4.1.11"
-      }
-    },
-    "lcid": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/lcid/-/lcid-1.0.0.tgz",
-      "integrity": "sha1-MIrMr6C8SDo4Z7S28rlQYlHRuDU=",
-      "dev": true,
-      "requires": {
-        "invert-kv": "1.0.0"
-      }
-    },
-    "liftoff": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/liftoff/-/liftoff-2.3.0.tgz",
-      "integrity": "sha1-qY8v9nGD2Lp8+soQVIvX/wVQs4U=",
-      "dev": true,
-      "requires": {
-        "extend": "3.0.1",
-        "findup-sync": "0.4.3",
-        "fined": "1.0.2",
-        "flagged-respawn": "0.3.2",
-        "lodash.isplainobject": "4.0.6",
-        "lodash.isstring": "4.0.1",
-        "lodash.mapvalues": "4.6.0",
-        "rechoir": "0.6.2",
-        "resolve": "1.3.3"
-      }
-    },
-    "load-json-file": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
-      "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
-      "dev": true,
-      "requires": {
-        "graceful-fs": "4.1.11",
-        "parse-json": "2.2.0",
-        "pify": "2.3.0",
-        "pinkie-promise": "2.0.1",
-        "strip-bom": "2.0.0"
-      },
-      "dependencies": {
-        "strip-bom": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
-          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4=",
-          "dev": true,
-          "requires": {
-            "is-utf8": "0.2.1"
-          }
-        }
-      }
-    },
-    "lodash": {
-      "version": "4.15.0",
-      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.15.0.tgz",
-      "integrity": "sha1-MWI5HY8BQKoiz49rPDTWt/Y9Oqk=",
-      "dev": true
-    },
-    "lodash._basecopy": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz",
-      "integrity": "sha1-jaDmqHbPNEwK2KVIghEd08XHyjY=",
-      "dev": true
-    },
-    "lodash._basetostring": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/lodash._basetostring/-/lodash._basetostring-3.0.1.tgz",
-      "integrity": "sha1-0YYdh3+CSlL2aYMtyvPuFVZqB9U=",
-      "dev": true
-    },
-    "lodash._basevalues": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._basevalues/-/lodash._basevalues-3.0.0.tgz",
-      "integrity": "sha1-W3dXYoAr3j0yl1A+JjAIIP32Ybc=",
-      "dev": true
-    },
-    "lodash._getnative": {
-      "version": "3.9.1",
-      "resolved": "https://registry.npmjs.org/lodash._getnative/-/lodash._getnative-3.9.1.tgz",
-      "integrity": "sha1-VwvH3t5G1hzc3mh9ZdPuy6o6r/U=",
-      "dev": true
-    },
-    "lodash._isiterateecall": {
-      "version": "3.0.9",
-      "resolved": "https://registry.npmjs.org/lodash._isiterateecall/-/lodash._isiterateecall-3.0.9.tgz",
-      "integrity": "sha1-UgOte6Ql+uhCRg5pbbnPPmqsBXw=",
-      "dev": true
-    },
-    "lodash._reescape": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reescape/-/lodash._reescape-3.0.0.tgz",
-      "integrity": "sha1-Kx1vXf4HyKNVdT5fJ/rH8c3hYWo=",
-      "dev": true
-    },
-    "lodash._reevaluate": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reevaluate/-/lodash._reevaluate-3.0.0.tgz",
-      "integrity": "sha1-WLx0xAZklTrgsSTYBpltrKQx4u0=",
-      "dev": true
-    },
-    "lodash._reinterpolate": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz",
-      "integrity": "sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0=",
-      "dev": true
-    },
-    "lodash._root": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/lodash._root/-/lodash._root-3.0.1.tgz",
-      "integrity": "sha1-+6HEUkwZ7ppfgTa0YJ8BfPTe1pI=",
-      "dev": true
-    },
-    "lodash.assignwith": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/lodash.assignwith/-/lodash.assignwith-4.2.0.tgz",
-      "integrity": "sha1-EnqX8CrcQXUalU0ksN4X4QDgOOs=",
-      "dev": true
-    },
-    "lodash.escape": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-3.2.0.tgz",
-      "integrity": "sha1-mV7g3BjBtIzJLv+ucaEKq1tIdpg=",
-      "dev": true,
-      "requires": {
-        "lodash._root": "3.0.1"
-      }
-    },
-    "lodash.get": {
-      "version": "4.4.2",
-      "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
-      "integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk=",
-      "dev": true
-    },
-    "lodash.isarguments": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz",
-      "integrity": "sha1-L1c9hcaiQon/AGY7SRwdM4/zRYo=",
-      "dev": true
-    },
-    "lodash.isarray": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz",
-      "integrity": "sha1-eeTriMNqgSKvhvhEqpvNhRtfu1U=",
-      "dev": true
-    },
-    "lodash.isempty": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/lodash.isempty/-/lodash.isempty-4.4.0.tgz",
-      "integrity": "sha1-b4bL7di+TsmHvpqvM8loTbGzHn4=",
-      "dev": true
-    },
-    "lodash.isplainobject": {
-      "version": "4.0.6",
-      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
-      "integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs=",
-      "dev": true
-    },
-    "lodash.isstring": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/lodash.isstring/-/lodash.isstring-4.0.1.tgz",
-      "integrity": "sha1-1SfftUVuynzJu5XV2ur4i6VKVFE=",
-      "dev": true
-    },
-    "lodash.keys": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz",
-      "integrity": "sha1-TbwEcrFWvlCgsoaFXRvQsMZWCYo=",
-      "dev": true,
-      "requires": {
-        "lodash._getnative": "3.9.1",
-        "lodash.isarguments": "3.1.0",
-        "lodash.isarray": "3.0.4"
-      }
-    },
-    "lodash.mapvalues": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/lodash.mapvalues/-/lodash.mapvalues-4.6.0.tgz",
-      "integrity": "sha1-G6+lAF3p3W9PJmaMMMo3IwzJaJw=",
-      "dev": true
-    },
-    "lodash.pick": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz",
-      "integrity": "sha1-UvBWEP/53tQiYRRB7R/BI6AwAbM=",
-      "dev": true
-    },
-    "lodash.restparam": {
-      "version": "3.6.1",
-      "resolved": "https://registry.npmjs.org/lodash.restparam/-/lodash.restparam-3.6.1.tgz",
-      "integrity": "sha1-k2pOMJ7zMKdkXtQUWYbIWuWyCAU=",
-      "dev": true
-    },
-    "lodash.template": {
-      "version": "3.6.2",
-      "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-3.6.2.tgz",
-      "integrity": "sha1-+M3sxhaaJVvpCYrosMU9N4kx0U8=",
-      "dev": true,
-      "requires": {
-        "lodash._basecopy": "3.0.1",
-        "lodash._basetostring": "3.0.1",
-        "lodash._basevalues": "3.0.0",
-        "lodash._isiterateecall": "3.0.9",
-        "lodash._reinterpolate": "3.0.0",
-        "lodash.escape": "3.2.0",
-        "lodash.keys": "3.1.2",
-        "lodash.restparam": "3.6.1",
-        "lodash.templatesettings": "3.1.1"
-      }
-    },
-    "lodash.templatesettings": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-3.1.1.tgz",
-      "integrity": "sha1-+zB4RHU7Zrnxr6VOJix0UwfbqOU=",
-      "dev": true,
-      "requires": {
-        "lodash._reinterpolate": "3.0.0",
-        "lodash.escape": "3.2.0"
-      }
-    },
-    "lru-cache": {
-      "version": "2.7.3",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.7.3.tgz",
-      "integrity": "sha1-bUUk6LlV+V1PW1iFHOId1y+06VI=",
-      "dev": true
-    },
-    "map-cache": {
-      "version": "0.2.2",
-      "resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz",
-      "integrity": "sha1-wyq9C9ZSXZsFFkW7TyasXcmKDb8=",
-      "dev": true
-    },
-    "micromatch": {
-      "version": "2.3.11",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
-      "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU=",
-      "dev": true,
-      "requires": {
-        "arr-diff": "2.0.0",
-        "array-unique": "0.2.1",
-        "braces": "1.8.5",
-        "expand-brackets": "0.1.5",
-        "extglob": "0.3.2",
-        "filename-regex": "2.0.1",
-        "is-extglob": "1.0.0",
-        "is-glob": "2.0.1",
-        "kind-of": "3.2.2",
-        "normalize-path": "2.1.1",
-        "object.omit": "2.0.1",
-        "parse-glob": "3.0.4",
-        "regex-cache": "0.4.3"
-      }
-    },
-    "mime": {
-      "version": "1.3.6",
-      "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.6.tgz",
-      "integrity": "sha1-WR2E02U6awtKO5343lqoEI5y5eA=",
-      "dev": true
-    },
-    "mime-db": {
-      "version": "1.27.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.27.0.tgz",
-      "integrity": "sha1-gg9XIpa70g7CXtVeW13oaeVDbrE=",
-      "dev": true
-    },
-    "mime-types": {
-      "version": "2.1.15",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.15.tgz",
-      "integrity": "sha1-pOv1BkCUVpI3uM9wBGd20J/JKu0=",
-      "dev": true,
-      "requires": {
-        "mime-db": "1.27.0"
-      }
-    },
-    "minimatch": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
-      "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==",
-      "dev": true,
-      "requires": {
-        "brace-expansion": "1.1.8"
-      }
-    },
-    "minimist": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
-      "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=",
-      "dev": true
-    },
-    "mkdirp": {
-      "version": "0.5.1",
-      "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
-      "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
-      "dev": true,
-      "requires": {
-        "minimist": "0.0.8"
-      },
-      "dependencies": {
-        "minimist": {
-          "version": "0.0.8",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
-          "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0=",
-          "dev": true
-        }
-      }
-    },
-    "ms": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-      "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
-      "dev": true
-    },
-    "multipipe": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/multipipe/-/multipipe-0.1.2.tgz",
-      "integrity": "sha1-Ko8t33Du1WTf8tV/HhoTfZ8FB4s=",
-      "dev": true,
-      "requires": {
-        "duplexer2": "0.0.2"
-      }
-    },
-    "mute-stream": {
-      "version": "0.0.6",
-      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.6.tgz",
-      "integrity": "sha1-SJYrGeFp/R38JAs/HnMXYnu8R9s=",
-      "dev": true
-    },
-    "natives": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/natives/-/natives-1.1.0.tgz",
-      "integrity": "sha1-6f+EFBimsux6SV6TmYT3jxY+bjE=",
-      "dev": true
-    },
-    "netrc": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/netrc/-/netrc-0.1.4.tgz",
-      "integrity": "sha1-a+lPysqNd63gqWcNxGCRTJRHJEQ=",
-      "dev": true
-    },
-    "normalize-package-data": {
-      "version": "2.3.8",
-      "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.3.8.tgz",
-      "integrity": "sha1-2Bntoqne29H/pWPqQHHZNngilbs=",
-      "dev": true,
-      "requires": {
-        "hosted-git-info": "2.4.2",
-        "is-builtin-module": "1.0.0",
-        "semver": "5.3.0",
-        "validate-npm-package-license": "3.0.1"
-      }
-    },
-    "normalize-path": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-2.1.1.tgz",
-      "integrity": "sha1-GrKLVW4Zg2Oowab35vogE3/mrtk=",
-      "dev": true,
-      "requires": {
-        "remove-trailing-separator": "1.0.2"
-      }
-    },
-    "npm-package-arg": {
-      "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/npm-package-arg/-/npm-package-arg-5.1.2.tgz",
-      "integrity": "sha512-wJBsrf0qpypPT7A0LART18hCdyhpCMxeTtcb0X4IZO2jsP6Om7EHN1d9KSKiqD+KVH030RVNpWS9thk+pb7wzA==",
-      "dev": true,
-      "requires": {
-        "hosted-git-info": "2.4.2",
-        "osenv": "0.1.4",
-        "semver": "5.3.0",
-        "validate-npm-package-name": "3.0.0"
-      }
-    },
-    "number-is-nan": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz",
-      "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=",
-      "dev": true
-    },
-    "oauth-sign": {
-      "version": "0.8.2",
-      "resolved": "https://registry.npmjs.org/oauth-sign/-/oauth-sign-0.8.2.tgz",
-      "integrity": "sha1-Rqarfwrq2N6unsBWV4C31O/rnUM=",
-      "dev": true,
-      "optional": true
-    },
-    "object-assign": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
-      "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=",
-      "dev": true
-    },
-    "object.omit": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/object.omit/-/object.omit-2.0.1.tgz",
-      "integrity": "sha1-Gpx0SCnznbuFjHbKNXmuKlTr0fo=",
-      "dev": true,
-      "requires": {
-        "for-own": "0.1.5",
-        "is-extendable": "0.1.1"
-      }
-    },
-    "once": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
-      "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
-      "dev": true,
-      "requires": {
-        "wrappy": "1.0.2"
-      }
-    },
-    "onetime": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/onetime/-/onetime-1.1.0.tgz",
-      "integrity": "sha1-ofeDj4MUxRbwXs78vEzP4EtO14k=",
-      "dev": true
-    },
-    "orchestrator": {
-      "version": "0.3.8",
-      "resolved": "https://registry.npmjs.org/orchestrator/-/orchestrator-0.3.8.tgz",
-      "integrity": "sha1-FOfp4nZPcxX7rBhOUGx6pt+UrX4=",
-      "dev": true,
-      "requires": {
-        "end-of-stream": "0.1.5",
-        "sequencify": "0.0.7",
-        "stream-consume": "0.1.0"
-      }
-    },
-    "ordered-read-streams": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.1.0.tgz",
-      "integrity": "sha1-/VZamvjrRHO6abbtijQ1LLVS8SY=",
-      "dev": true
-    },
-    "os-homedir": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
-      "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M=",
-      "dev": true
-    },
-    "os-locale": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
-      "integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk=",
-      "dev": true,
-      "requires": {
-        "lcid": "1.0.0"
-      }
-    },
-    "os-shim": {
-      "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/os-shim/-/os-shim-0.1.3.tgz",
-      "integrity": "sha1-a2LDeRz3kJ6jXtRuF2WLtBfLORc=",
-      "dev": true
-    },
-    "os-tmpdir": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
-      "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ=",
-      "dev": true
-    },
-    "osenv": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.4.tgz",
-      "integrity": "sha1-Qv5tWVPfBsgGS+bxdsPQWqqjRkQ=",
-      "dev": true,
-      "requires": {
-        "os-homedir": "1.0.2",
-        "os-tmpdir": "1.0.2"
-      }
-    },
-    "parse-filepath": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/parse-filepath/-/parse-filepath-1.0.1.tgz",
-      "integrity": "sha1-FZ1hVdQ5BNFsEO9piRHaHpGWm3M=",
-      "dev": true,
-      "requires": {
-        "is-absolute": "0.2.6",
-        "map-cache": "0.2.2",
-        "path-root": "0.1.1"
-      }
-    },
-    "parse-glob": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/parse-glob/-/parse-glob-3.0.4.tgz",
-      "integrity": "sha1-ssN2z7EfNVE7rdFz7wu246OIORw=",
-      "dev": true,
-      "requires": {
-        "glob-base": "0.3.0",
-        "is-dotfile": "1.0.3",
-        "is-extglob": "1.0.0",
-        "is-glob": "2.0.1"
-      }
-    },
-    "parse-json": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz",
-      "integrity": "sha1-9ID0BDTvgHQfhGkJn43qGPVaTck=",
-      "dev": true,
-      "requires": {
-        "error-ex": "1.3.1"
-      }
-    },
-    "parse-passwd": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/parse-passwd/-/parse-passwd-1.0.0.tgz",
-      "integrity": "sha1-bVuTSkVpk7I9N/QKOC1vFmao5cY=",
-      "dev": true
-    },
-    "path-exists": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
-      "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s=",
-      "dev": true,
-      "requires": {
-        "pinkie-promise": "2.0.1"
-      }
-    },
-    "path-is-absolute": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
-      "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=",
-      "dev": true
-    },
-    "path-parse": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.5.tgz",
-      "integrity": "sha1-PBrfhx6pzWyUMbbqK9dKD/BVxME=",
-      "dev": true
-    },
-    "path-root": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/path-root/-/path-root-0.1.1.tgz",
-      "integrity": "sha1-mkpoFMrBwM1zNgqV8yCDyOpHRbc=",
-      "dev": true,
-      "requires": {
-        "path-root-regex": "0.1.2"
-      }
-    },
-    "path-root-regex": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/path-root-regex/-/path-root-regex-0.1.2.tgz",
-      "integrity": "sha1-v8zcjfWxLcUsi0PsONGNcsBLqW0=",
-      "dev": true
-    },
-    "path-type": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
-      "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE=",
-      "dev": true,
-      "requires": {
-        "graceful-fs": "4.1.11",
-        "pify": "2.3.0",
-        "pinkie-promise": "2.0.1"
-      }
-    },
-    "performance-now": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-0.2.0.tgz",
-      "integrity": "sha1-M+8wxcd9TqIcWlOGnZG1bY8lVeU=",
-      "dev": true,
-      "optional": true
-    },
-    "pify": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
-      "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
-      "dev": true
-    },
-    "pinkie": {
-      "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/pinkie/-/pinkie-2.0.4.tgz",
-      "integrity": "sha1-clVrgM+g1IqXToDnckjoDtT3+HA=",
-      "dev": true
-    },
-    "pinkie-promise": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz",
-      "integrity": "sha1-ITXW36ejWMBprJsXh3YogihFD/o=",
-      "dev": true,
-      "requires": {
-        "pinkie": "2.0.4"
-      }
-    },
-    "preserve": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/preserve/-/preserve-0.2.0.tgz",
-      "integrity": "sha1-gV7R9uvGWSb4ZbMQwHE7yzMVzks=",
-      "dev": true
-    },
-    "pretty-hrtime": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz",
-      "integrity": "sha1-t+PqQkNaTJsnWdmeDyAesZWALuE=",
-      "dev": true
-    },
-    "process-nextick-args": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz",
-      "integrity": "sha1-FQ4gt1ZZCtP5EJPyWk8q2L/zC6M=",
-      "dev": true
-    },
-    "punycode": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
-      "integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4=",
-      "dev": true,
-      "optional": true
-    },
-    "qs": {
-      "version": "6.4.0",
-      "resolved": "https://registry.npmjs.org/qs/-/qs-6.4.0.tgz",
-      "integrity": "sha1-E+JtKK1rD/qpExLNO/cI7TUecjM=",
-      "dev": true,
-      "optional": true
-    },
-    "randomatic": {
-      "version": "1.1.7",
-      "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-1.1.7.tgz",
-      "integrity": "sha512-D5JUjPyJbaJDkuAazpVnSfVkLlpeO3wDlPROTMLGKG1zMFNFRgrciKo1ltz/AzNTkqE0HzDx655QOL51N06how==",
-      "dev": true,
-      "requires": {
-        "is-number": "3.0.0",
-        "kind-of": "4.0.0"
-      },
-      "dependencies": {
-        "is-number": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/is-number/-/is-number-3.0.0.tgz",
-          "integrity": "sha1-JP1iAaR4LPUFYcgQJ2r8fRLXEZU=",
-          "dev": true,
-          "requires": {
-            "kind-of": "3.2.2"
-          },
-          "dependencies": {
-            "kind-of": {
-              "version": "3.2.2",
-              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-              "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
-              "dev": true,
-              "requires": {
-                "is-buffer": "1.1.5"
-              }
-            }
-          }
-        },
-        "kind-of": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-4.0.0.tgz",
-          "integrity": "sha1-IIE989cSkosgc3hpGkUGb65y3Vc=",
-          "dev": true,
-          "requires": {
-            "is-buffer": "1.1.5"
-          }
-        }
-      }
-    },
-    "read-package-json": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/read-package-json/-/read-package-json-2.0.5.tgz",
-      "integrity": "sha1-+Tpk5kFSnfaKCMZN5GOJ6KP4iEU=",
-      "dev": true,
-      "requires": {
-        "glob": "7.1.2",
-        "graceful-fs": "4.1.11",
-        "json-parse-helpfulerror": "1.0.3",
-        "normalize-package-data": "2.3.8"
-      },
-      "dependencies": {
-        "glob": {
-          "version": "7.1.2",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
-          "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ==",
-          "dev": true,
-          "requires": {
-            "fs.realpath": "1.0.0",
-            "inflight": "1.0.6",
-            "inherits": "2.0.3",
-            "minimatch": "3.0.4",
-            "once": "1.4.0",
-            "path-is-absolute": "1.0.1"
-          }
-        }
-      }
-    },
-    "read-package-tree": {
-      "version": "5.1.6",
-      "resolved": "https://registry.npmjs.org/read-package-tree/-/read-package-tree-5.1.6.tgz",
-      "integrity": "sha512-FCX1aT3GWyY658wzDICef4p+n0dB+ENRct8E/Qyvppj6xVpOYerBHfUu7OP5Rt1/393Tdglguf5ju5DEX4wZNg==",
-      "dev": true,
-      "requires": {
-        "debuglog": "1.0.1",
-        "dezalgo": "1.0.3",
-        "once": "1.4.0",
-        "read-package-json": "2.0.5",
-        "readdir-scoped-modules": "1.0.2"
-      }
-    },
-    "read-pkg": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
-      "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg=",
-      "dev": true,
-      "requires": {
-        "load-json-file": "1.1.0",
-        "normalize-package-data": "2.3.8",
-        "path-type": "1.1.0"
-      }
-    },
-    "read-pkg-up": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
-      "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI=",
-      "dev": true,
-      "requires": {
-        "find-up": "1.1.2",
-        "read-pkg": "1.1.0"
-      }
-    },
-    "readable-stream": {
-      "version": "2.2.11",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.2.11.tgz",
-      "integrity": "sha512-h+8+r3MKEhkiVrwdKL8aWs1oc1VvBu33ueshOvS26RsZQ3Amhx/oO3TKe4lApSV9ueY6as8EAh7mtuFjdlhg9Q==",
-      "dev": true,
-      "requires": {
-        "core-util-is": "1.0.2",
-        "inherits": "2.0.3",
-        "isarray": "1.0.0",
-        "process-nextick-args": "1.0.7",
-        "safe-buffer": "5.0.1",
-        "string_decoder": "1.0.2",
-        "util-deprecate": "1.0.2"
-      },
-      "dependencies": {
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c=",
-          "dev": true
-        }
-      }
-    },
-    "readdir-scoped-modules": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/readdir-scoped-modules/-/readdir-scoped-modules-1.0.2.tgz",
-      "integrity": "sha1-n6+jfShr5dksuuve4DDcm19AZ0c=",
-      "dev": true,
-      "requires": {
-        "debuglog": "1.0.1",
-        "dezalgo": "1.0.3",
-        "graceful-fs": "4.1.11",
-        "once": "1.4.0"
-      }
-    },
-    "rechoir": {
-      "version": "0.6.2",
-      "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz",
-      "integrity": "sha1-hSBLVNuoLVdC4oyWdW70OvUOM4Q=",
-      "dev": true,
-      "requires": {
-        "resolve": "1.3.3"
-      }
-    },
-    "regex-cache": {
-      "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.3.tgz",
-      "integrity": "sha1-mxpsNdTQ3871cRrmUejp09cRQUU=",
-      "dev": true,
-      "requires": {
-        "is-equal-shallow": "0.1.3",
-        "is-primitive": "2.0.0"
-      }
-    },
-    "remove-trailing-separator": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.0.2.tgz",
-      "integrity": "sha1-abBi2XhyetFNxrVrpKt3L9jXBRE=",
-      "dev": true
-    },
-    "repeat-element": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/repeat-element/-/repeat-element-1.1.2.tgz",
-      "integrity": "sha1-7wiaF40Ug7quTZPrmLT55OEdmQo=",
-      "dev": true
-    },
-    "repeat-string": {
-      "version": "1.6.1",
-      "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-1.6.1.tgz",
-      "integrity": "sha1-jcrkcOHIirwtYA//Sndihtp15jc=",
-      "dev": true
-    },
-    "replace-ext": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-0.0.1.tgz",
-      "integrity": "sha1-KbvZIHinOfC8zitO5B6DeVNSKSQ=",
-      "dev": true
-    },
-    "request": {
-      "version": "2.81.0",
-      "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz",
-      "integrity": "sha1-xpKJRqDgbF+Nb4qTM0af/aRimKA=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "aws-sign2": "0.6.0",
-        "aws4": "1.6.0",
-        "caseless": "0.12.0",
-        "combined-stream": "1.0.5",
-        "extend": "3.0.1",
-        "forever-agent": "0.6.1",
-        "form-data": "2.1.4",
-        "har-validator": "4.2.1",
-        "hawk": "3.1.3",
-        "http-signature": "1.1.1",
-        "is-typedarray": "1.0.0",
-        "isstream": "0.1.2",
-        "json-stringify-safe": "5.0.1",
-        "mime-types": "2.1.15",
-        "oauth-sign": "0.8.2",
-        "performance-now": "0.2.0",
-        "qs": "6.4.0",
-        "safe-buffer": "5.1.0",
-        "stringstream": "0.0.5",
-        "tough-cookie": "2.3.2",
-        "tunnel-agent": "0.6.0",
-        "uuid": "3.0.1"
-      }
-    },
-    "require-directory": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
-      "integrity": "sha1-jGStX9MNqxyXbiNE/+f3kqam30I=",
-      "dev": true
-    },
-    "require-main-filename": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-1.0.1.tgz",
-      "integrity": "sha1-l/cXtp1IeE9fUmpsWqj/3aBVpNE=",
-      "dev": true
-    },
-    "resolve": {
-      "version": "1.3.3",
-      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.3.3.tgz",
-      "integrity": "sha1-ZVkHw0aahoDcLeOidaj91paR8OU=",
-      "dev": true,
-      "requires": {
-        "path-parse": "1.0.5"
-      }
-    },
-    "resolve-dir": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/resolve-dir/-/resolve-dir-0.1.1.tgz",
-      "integrity": "sha1-shklmlYC+sXFxJatiUpujMQwJh4=",
-      "dev": true,
-      "requires": {
-        "expand-tilde": "1.2.2",
-        "global-modules": "0.2.3"
-      }
-    },
-    "restore-cursor": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-1.0.1.tgz",
-      "integrity": "sha1-NGYfRohjJ/7SmRR5FSJS35LapUE=",
-      "dev": true,
-      "requires": {
-        "exit-hook": "1.1.1",
-        "onetime": "1.1.0"
-      }
-    },
-    "rimraf": {
-      "version": "2.5.4",
-      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
-      "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ=",
-      "dev": true,
-      "requires": {
-        "glob": "7.0.6"
-      }
-    },
-    "run-async": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/run-async/-/run-async-2.3.0.tgz",
-      "integrity": "sha1-A3GrSuC91yDUFm19/aZP96RFpsA=",
-      "dev": true,
-      "requires": {
-        "is-promise": "2.1.0"
-      }
-    },
-    "rx": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/rx/-/rx-4.1.0.tgz",
-      "integrity": "sha1-pfE/957zt0D+MKqAP7CfmIBdR4I=",
-      "dev": true
-    },
-    "safe-buffer": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.0.tgz",
-      "integrity": "sha512-aSLEDudu6OoRr/2rU609gRmnYboRLxgDG1z9o2Q0os7236FwvcqIOO8r8U5JUEwivZOhDaKlFO4SbPTJYyBEyQ==",
-      "dev": true
-    },
-    "semver": {
-      "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz",
-      "integrity": "sha1-myzl094C0XxgEq0yaqa00M9U+U8=",
-      "dev": true
-    },
-    "sequencify": {
-      "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/sequencify/-/sequencify-0.0.7.tgz",
-      "integrity": "sha1-kM/xnQLgcCf9dn9erT57ldHnOAw=",
-      "dev": true
-    },
-    "set-blocking": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
-      "integrity": "sha1-BF+XgtARrppoA93TgrJDkrPYkPc=",
-      "dev": true
-    },
-    "sigmund": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/sigmund/-/sigmund-1.0.1.tgz",
-      "integrity": "sha1-P/IfGYytIXX587eBhT/ZTQ0ZtZA=",
-      "dev": true
-    },
-    "sntp": {
-      "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz",
-      "integrity": "sha1-ZUEYTMkK7qbG57NeJlkIJEPGYZg=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "hoek": "2.16.3"
-      }
-    },
-    "sparkles": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/sparkles/-/sparkles-1.0.0.tgz",
-      "integrity": "sha1-Gsu/tZJDbRC76PeFt8xvgoFQEsM=",
-      "dev": true
-    },
-    "spawn-sync": {
-      "version": "1.0.15",
-      "resolved": "https://registry.npmjs.org/spawn-sync/-/spawn-sync-1.0.15.tgz",
-      "integrity": "sha1-sAeZVX63+wyDdsKdROih6mfldHY=",
-      "dev": true,
-      "requires": {
-        "concat-stream": "1.6.0",
-        "os-shim": "0.1.3"
-      }
-    },
-    "spdx-correct": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-1.0.2.tgz",
-      "integrity": "sha1-SzBz2TP/UfORLwOsVRlJikFQ20A=",
-      "dev": true,
-      "requires": {
-        "spdx-license-ids": "1.2.2"
-      }
-    },
-    "spdx-expression-parse": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-1.0.4.tgz",
-      "integrity": "sha1-m98vIOH0DtRH++JzJmGR/O1RYmw=",
-      "dev": true
-    },
-    "spdx-license-ids": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-1.2.2.tgz",
-      "integrity": "sha1-yd96NCRZSt5r0RkA1ZZpbcBrrFc=",
-      "dev": true
-    },
-    "sprintf-js": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
-      "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=",
-      "dev": true
-    },
-    "sshpk": {
-      "version": "1.13.1",
-      "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.13.1.tgz",
-      "integrity": "sha1-US322mKHFEMW3EwY/hzx2UBzm+M=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "asn1": "0.2.3",
-        "assert-plus": "1.0.0",
-        "bcrypt-pbkdf": "1.0.1",
-        "dashdash": "1.14.1",
-        "ecc-jsbn": "0.1.1",
-        "getpass": "0.1.7",
-        "jsbn": "0.1.1",
-        "tweetnacl": "0.14.5"
-      },
-      "dependencies": {
-        "assert-plus": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
-          "dev": true,
-          "optional": true
-        }
-      }
-    },
-    "stream-consume": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/stream-consume/-/stream-consume-0.1.0.tgz",
-      "integrity": "sha1-pB6tGm1ggc63n2WwYZAbbY89HQ8=",
-      "dev": true
-    },
-    "string_decoder": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.2.tgz",
-      "integrity": "sha1-sp4fThEl+pehA4K4pTNze3SR4Xk=",
-      "dev": true,
-      "requires": {
-        "safe-buffer": "5.0.1"
-      },
-      "dependencies": {
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c=",
-          "dev": true
-        }
-      }
-    },
-    "string-width": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
-      "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
-      "dev": true,
-      "requires": {
-        "code-point-at": "1.1.0",
-        "is-fullwidth-code-point": "1.0.0",
-        "strip-ansi": "3.0.1"
-      }
-    },
-    "stringstream": {
-      "version": "0.0.5",
-      "resolved": "https://registry.npmjs.org/stringstream/-/stringstream-0.0.5.tgz",
-      "integrity": "sha1-TkhM1N5aC7vuGORjB3EKioFiGHg=",
-      "dev": true,
-      "optional": true
-    },
-    "strip-ansi": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
-      "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
-      "dev": true,
-      "requires": {
-        "ansi-regex": "2.1.1"
-      }
-    },
-    "strip-bom": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-1.0.0.tgz",
-      "integrity": "sha1-hbiGLzhEtabV7IRnqTWYFzo295Q=",
-      "dev": true,
-      "requires": {
-        "first-chunk-stream": "1.0.0",
-        "is-utf8": "0.2.1"
-      }
-    },
-    "supports-color": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-      "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=",
-      "dev": true
-    },
-    "through": {
-      "version": "2.3.8",
-      "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
-      "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU=",
-      "dev": true
-    },
-    "through2": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/through2/-/through2-2.0.3.tgz",
-      "integrity": "sha1-AARWmzfHx0ujnEPzzteNGtlBQL4=",
-      "dev": true,
-      "requires": {
-        "readable-stream": "2.2.11",
-        "xtend": "4.0.1"
-      }
-    },
-    "tildify": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/tildify/-/tildify-1.2.0.tgz",
-      "integrity": "sha1-3OwD9V3Km3qj5bBPIYF+tW5jWIo=",
-      "dev": true,
-      "requires": {
-        "os-homedir": "1.0.2"
-      }
-    },
-    "time-stamp": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/time-stamp/-/time-stamp-1.1.0.tgz",
-      "integrity": "sha1-dkpaEa9QVhkhsTPztE5hhofg9cM=",
-      "dev": true
-    },
-    "tmp": {
-      "version": "0.0.29",
-      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.29.tgz",
-      "integrity": "sha1-8lEl/w3Z2jzLDC3Tce4SiLuRKMA=",
-      "dev": true,
-      "requires": {
-        "os-tmpdir": "1.0.2"
-      }
-    },
-    "tough-cookie": {
-      "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.2.tgz",
-      "integrity": "sha1-8IH3bkyFcg5sN6X6ztc3FQ2EByo=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "punycode": "1.4.1"
-      }
-    },
-    "tunnel-agent": {
-      "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.6.0.tgz",
-      "integrity": "sha1-J6XeoGs2sEoKmWZ3SykIaPD8QP0=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "safe-buffer": "5.1.0"
-      }
-    },
-    "tweetnacl": {
-      "version": "0.14.5",
-      "resolved": "https://registry.npmjs.org/tweetnacl/-/tweetnacl-0.14.5.tgz",
-      "integrity": "sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q=",
-      "dev": true,
-      "optional": true
-    },
-    "typedarray": {
-      "version": "0.0.6",
-      "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
-      "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=",
-      "dev": true
-    },
-    "unc-path-regex": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/unc-path-regex/-/unc-path-regex-0.1.2.tgz",
-      "integrity": "sha1-5z3T17DXxe2G+6xrCufYxqadUPo=",
-      "dev": true
-    },
-    "unique-stream": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-1.0.0.tgz",
-      "integrity": "sha1-1ZpKdUJ0R9mqbJHnAmP40mpLEEs=",
-      "dev": true
-    },
-    "user-home": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/user-home/-/user-home-1.1.1.tgz",
-      "integrity": "sha1-K1viOjK2Onyd640PKNSFcko98ZA=",
-      "dev": true
-    },
-    "util-deprecate": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
-      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=",
-      "dev": true
-    },
-    "uuid": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.0.1.tgz",
-      "integrity": "sha1-ZUS7ot/ajBzxfmKaOjBeK7H+5sE=",
-      "dev": true,
-      "optional": true
-    },
-    "v8flags": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/v8flags/-/v8flags-2.1.1.tgz",
-      "integrity": "sha1-qrGh+jDUX4jdMhFIh1rALAtV5bQ=",
-      "dev": true,
-      "requires": {
-        "user-home": "1.1.1"
-      }
-    },
-    "validate-npm-package-license": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.1.tgz",
-      "integrity": "sha1-KAS6vnEq0zeUWaz74kdGqywwP7w=",
-      "dev": true,
-      "requires": {
-        "spdx-correct": "1.0.2",
-        "spdx-expression-parse": "1.0.4"
-      }
-    },
-    "validate-npm-package-name": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/validate-npm-package-name/-/validate-npm-package-name-3.0.0.tgz",
-      "integrity": "sha1-X6kS2B630MdK/BQN5zF/DKffQ34=",
-      "dev": true,
-      "requires": {
-        "builtins": "1.0.3"
-      }
-    },
-    "validator": {
-      "version": "5.7.0",
-      "resolved": "https://registry.npmjs.org/validator/-/validator-5.7.0.tgz",
-      "integrity": "sha1-eoelgUa2laxIYHEUHAxJ1n2gXlw=",
-      "dev": true
-    },
-    "verror": {
-      "version": "1.3.6",
-      "resolved": "https://registry.npmjs.org/verror/-/verror-1.3.6.tgz",
-      "integrity": "sha1-z/XfEpRtKX0rqu+qJoniW+AcAFw=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "extsprintf": "1.0.2"
-      }
-    },
-    "vinyl": {
-      "version": "0.5.3",
-      "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.5.3.tgz",
-      "integrity": "sha1-sEVbOPxeDPMNQyUTLkYZcMIJHN4=",
-      "dev": true,
-      "requires": {
-        "clone": "1.0.2",
-        "clone-stats": "0.0.1",
-        "replace-ext": "0.0.1"
-      }
-    },
-    "vinyl-fs": {
-      "version": "0.3.14",
-      "resolved": "https://registry.npmjs.org/vinyl-fs/-/vinyl-fs-0.3.14.tgz",
-      "integrity": "sha1-mmhRzhysHBzqX+hsCTHWIMLPqeY=",
-      "dev": true,
-      "requires": {
-        "defaults": "1.0.3",
-        "glob-stream": "3.1.18",
-        "glob-watcher": "0.0.6",
-        "graceful-fs": "3.0.11",
-        "mkdirp": "0.5.1",
-        "strip-bom": "1.0.0",
-        "through2": "0.6.5",
-        "vinyl": "0.4.6"
-      },
-      "dependencies": {
-        "clone": {
-          "version": "0.2.0",
-          "resolved": "https://registry.npmjs.org/clone/-/clone-0.2.0.tgz",
-          "integrity": "sha1-xhJqkK1Pctv1rNskPMN3JP6T/B8=",
-          "dev": true
-        },
-        "graceful-fs": {
-          "version": "3.0.11",
-          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-3.0.11.tgz",
-          "integrity": "sha1-dhPHeKGv6mLyXGMKCG1/Osu92Bg=",
-          "dev": true,
-          "requires": {
-            "natives": "1.1.0"
-          }
-        },
-        "isarray": {
-          "version": "0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
-          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8=",
-          "dev": true
-        },
-        "readable-stream": {
-          "version": "1.0.34",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
-          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=",
-          "dev": true,
-          "requires": {
-            "core-util-is": "1.0.2",
-            "inherits": "2.0.3",
-            "isarray": "0.0.1",
-            "string_decoder": "0.10.31"
-          }
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
-          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ=",
-          "dev": true
-        },
-        "through2": {
-          "version": "0.6.5",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
-          "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg=",
-          "dev": true,
-          "requires": {
-            "readable-stream": "1.0.34",
-            "xtend": "4.0.1"
-          }
-        },
-        "vinyl": {
-          "version": "0.4.6",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.4.6.tgz",
-          "integrity": "sha1-LzVsh6VQolVGHza76ypbqL94SEc=",
-          "dev": true,
-          "requires": {
-            "clone": "0.2.0",
-            "clone-stats": "0.0.1"
-          }
-        }
-      }
-    },
-    "which": {
-      "version": "1.2.14",
-      "resolved": "https://registry.npmjs.org/which/-/which-1.2.14.tgz",
-      "integrity": "sha1-mofEN48D6CfOyvGs31bHNsAcFOU=",
-      "dev": true,
-      "requires": {
-        "isexe": "2.0.0"
-      }
-    },
-    "which-module": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/which-module/-/which-module-1.0.0.tgz",
-      "integrity": "sha1-u6Y8qGGUiZT/MHc2CJ47lgJsKk8=",
-      "dev": true
-    },
-    "wordwrap": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz",
-      "integrity": "sha1-J1hIEIkUVqQXHI0CJkQa3pDLyus=",
-      "dev": true
-    },
-    "wrap-ansi": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
-      "integrity": "sha1-2Pw9KE3QV5T+hJc8rs3Rz4JP3YU=",
-      "dev": true,
-      "requires": {
-        "string-width": "1.0.2",
-        "strip-ansi": "3.0.1"
-      }
-    },
-    "wrappy": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
-      "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=",
-      "dev": true
-    },
-    "xtend": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.1.tgz",
-      "integrity": "sha1-pcbVMr5lbiPbgg77lDofBJmNY68=",
-      "dev": true
-    },
-    "y18n": {
-      "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/y18n/-/y18n-3.2.1.tgz",
-      "integrity": "sha1-bRX7qITAhnnA136I53WegR4H+kE=",
-      "dev": true
-    },
-    "yargs": {
-      "version": "6.6.0",
-      "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz",
-      "integrity": "sha1-eC7CHvQDNF+DCoCMo9UTr1YGUgg=",
-      "dev": true,
-      "requires": {
-        "camelcase": "3.0.0",
-        "cliui": "3.2.0",
-        "decamelize": "1.2.0",
-        "get-caller-file": "1.0.2",
-        "os-locale": "1.4.0",
-        "read-pkg-up": "1.0.1",
-        "require-directory": "2.1.1",
-        "require-main-filename": "1.0.1",
-        "set-blocking": "2.0.0",
-        "string-width": "1.0.2",
-        "which-module": "1.0.0",
-        "y18n": "3.2.1",
-        "yargs-parser": "4.2.1"
-      }
-    },
-    "yargs-parser": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz",
-      "integrity": "sha1-KczqwNxPA8bIe0qfIX3RjJ90hxw=",
-      "dev": true,
-      "requires": {
-        "camelcase": "3.0.0"
-      }
-    },
-    "z-schema": {
-      "version": "3.17.0",
-      "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-3.17.0.tgz",
-      "integrity": "sha1-RCs4+denr3rke/z8NWhz6GFq0bc=",
-      "dev": true,
-      "requires": {
-        "commander": "2.9.0",
-        "lodash.get": "4.4.2",
-        "request": "2.81.0",
-        "validator": "5.7.0"
-      }
-    }
-  }
-}
diff --git a/packages/office-ui-fabric-react/index.html b/packages/office-ui-fabric-react/index.html
index 91f6558f337b1..a5f406af92e68 100644
--- a/packages/office-ui-fabric-react/index.html
+++ b/packages/office-ui-fabric-react/index.html
@@ -43,6 +43,7 @@
         'demo-app.js'
       ]);
   </script>
+
 </body>
 
 </html>
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index eb8daf2a654a0..3d970102770fa 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -256,12 +256,14 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       // with JAWS.
       <div
         ref={ this._resolveRef('_root') }
-        className={ css('ms-DetailsList', styles.root, className, {
-          'is-fixed': layoutMode === DetailsListLayoutMode.fixedColumns,
-          ['is-horizontalConstrained ' + styles.rootIsHorizontalConstrained]: constrainMode === ConstrainMode.horizontalConstrained,
-          'ms-DetailsList--Compact': !!compact,
-          [styles.rootCompact]: !!compact
-        }) }
+        className={ css(
+          'ms-DetailsList',
+          styles.root,
+          className,
+          (layoutMode === DetailsListLayoutMode.fixedColumns) && 'is-fixed',
+          (constrainMode === ConstrainMode.horizontalConstrained) && ('is-horizontalConstrained ' + styles.rootIsHorizontalConstrained),
+          !!compact && ('ms-DetailsList--Compact ' + styles.rootCompact)
+        ) }
         data-automationid='DetailsList'
         data-is-scrollable='false'
         aria-label={ ariaLabel }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx
index fdb0032ad21c2..bef39a9761ee4 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx
@@ -31,10 +31,12 @@ export const DetailsRowCheck = (props: IDetailsRowCheckProps) => {
     <button
       { ...buttonProps }
       role='checkbox'
-      className={ css('ms-DetailsRow-check', styles.check, {
-        [styles.isDisabled]: !props.canSelect,
-        'ms-DetailsRow-check--isDisabled': !props.canSelect
-      }) }
+      className={ css(
+        'ms-DetailsRow-check',
+        styles.check,
+        !props.canSelect && styles.isDisabled,
+        !props.canSelect && 'ms-DetailsRow-check--isDisabled'
+      ) }
       aria-checked={ isPressed }
       data-selection-toggle={ true }
       data-automationid='DetailsRowCheck'
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomRows.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomRows.Example.tsx
index 4fd738561e89d..0564d22d6b510 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomRows.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomRows.Example.tsx
@@ -41,9 +41,9 @@ export class DetailsListCustomRowsExample extends React.Component<any, any> {
     return (
       <div
         className={ css(
-          'ms-DetailsRow-check DetailsListExample-customCheck', {
-            'is-any-selected': props.anySelected
-          }) }
+          'ms-DetailsRow-check DetailsListExample-customCheck',
+          props.anySelected && 'is-any-selected'
+        ) }
         role='button'
         aria-pressed={ props.isSelected }
         data-selection-toggle={ true }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 9f707ba6bb8d1..a199c8512dd5c 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -162,11 +162,14 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
           aria-disabled={ disabled }
           aria-owns={ isOpen ? id + '-list' : null }
           { ...divProps }
-          className={ css('ms-Dropdown', styles.root, className, {
-            'is-open': isOpen!,
-            ['is-disabled ' + styles.rootIsDisabled]: disabled!,
-            'is-required ': required!,
-          }) }
+          className={ css(
+            'ms-Dropdown',
+            styles.root,
+            className,
+            isOpen! && 'is-open',
+            disabled! && ('is-disabled ' + styles.rootIsDisabled),
+            required! && 'is-required',
+          ) }
           onBlur={ this._onDropdownBlur }
           onKeyDown={ this._onDropdownKeyDown }
           onKeyUp={ this._onDropdownKeyUp }
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx b/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx
index 85c1cebbb36e2..2891a84f99277 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx
@@ -69,10 +69,11 @@ export class ListScrollingExample extends React.Component<IListScrollingExampleP
             } }
             onRenderCell={ (item, index: number) => (
               <div className='ms-ListScrollingExample-itemCell' data-is-focusable={ true }>
-                <div className={ css('ms-ListScrollingExample-itemContent', {
-                  'ms-ListScrollingExample-itemContent-even': index % 2 === 0,
-                  'ms-ListScrollingExample-itemContent-odd': index % 2 === 1
-                }) }>
+                <div className={ css(
+                  'ms-ListScrollingExample-itemContent',
+                  (index % 2 === 0) && 'ms-ListScrollingExample-itemContent-even',
+                  (index % 2 === 1) && 'ms-ListScrollingExample-itemContent-odd'
+                ) }>
                   { index } &nbsp; { item.name }
                 </div>
               </div>
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
index 764ebf533ad83..090980beece07 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
@@ -83,14 +83,27 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
     return (
       <div
         { ...rootProps }
-        className={ css('ms-MarqueeSelection', styles.root, rootProps && rootProps.className) }
+        className={ css(
+          'ms-MarqueeSelection',
+          styles.root,
+          rootProps && rootProps.className
+        ) }
         ref='root'
       >
         { children }
         { dragRect && (<div className={ css('ms-MarqueeSelection-dragMask', styles.dragMask) } />) }
         { dragRect && (
-          <div className={ css('ms-MarqueeSelection-box', styles.box) } style={ dragRect }>
-            <div className={ css('ms-MarqueeSelection-boxFill', styles.boxFill) } />
+          <div
+            className={ css(
+              'ms-MarqueeSelection-box',
+              styles.box
+            ) }
+            style={ dragRect }
+          >
+            <div className={ css(
+              'ms-MarqueeSelection-boxFill',
+              styles.boxFill
+            ) } />
           </div>
         ) }
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
index bace0b5a958d2..3ce09df175b30 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
@@ -62,9 +62,10 @@ export class MarqueeSelectionBasicExample extends React.Component<{}, IMarqueeSe
           { PHOTOS.map((photo, index) => (
             <div
               key={ index }
-              className={ css('ms-MarqueeSelectionBasicExample-photoCell', {
-                'is-selected': this._selection.isIndexSelected(index)
-              }) }
+              className={ css(
+                'ms-MarqueeSelectionBasicExample-photoCell',
+                this._selection.isIndexSelected(index) && 'is-selected'
+              ) }
               data-is-focusable={ true }
               data-selection-index={ index }
               onClick={ () => console.log('clicked') }
diff --git a/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx b/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
index 64dab54fd3762..a34bda5d6a1d9 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
+++ b/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
@@ -96,10 +96,13 @@ export class Modal extends BaseComponent<IModalProps, IDialogState> {
     } = this.props;
     let { id, isOpen, isVisible } = this.state;
 
-    const modalClassName = css('ms-Modal', styles.root, this.props.className, {
-      ['is-open']: !!isOpen,
-      [styles.rootIsVisible]: !!isVisible,
-    });
+    const modalClassName = css(
+      'ms-Modal',
+      styles.root,
+      this.props.className,
+      !!isOpen && 'is-open',
+      !!isVisible && styles.rootIsVisible
+    );
 
     if (!isOpen) {
       return null;
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
index 6d5364d5efb0a..03562411711c6 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
@@ -159,10 +159,11 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
   private _renderButtonLink(link: INavLink, linkIndex: number) {
     return (
       <CommandButton
-        className={ css('ms-Nav-link ms-Nav-linkButton', styles.link, {
-          'isOnExpanded': this._hasExpandButton,
-          [styles.linkIsOnExpanded]: this._hasExpandButton
-        }) }
+        className={ css(
+          'ms-Nav-link ms-Nav-linkButton',
+          styles.link,
+          this._hasExpandButton && 'isOnExpanded ' + styles.linkIsOnExpanded
+        ) }
         href={ link.url }
         iconProps={ { iconName: link.icon } }
         description={ link.title || link.name }
@@ -178,12 +179,14 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
 
     return (
       <div key={ link.key || linkIndex }
-        className={ css('ms-Nav-compositeLink', styles.compositeLink, {
-          ' is-expanded': !!link.isExpanded,
-          'is-selected': isLinkSelected,
-          [styles.compositeLinkIsExpanded]: !!link.isExpanded,
-          [styles.compositeLinkIsSelected]: isLinkSelected
-        }) }>
+        className={ css(
+          'ms-Nav-compositeLink',
+          styles.compositeLink,
+          !!link.isExpanded && 'is-expanded',
+          isLinkSelected && 'is-selected',
+          !!link.isExpanded && styles.compositeLinkIsExpanded,
+          isLinkSelected && styles.compositeLinkIsSelected
+        ) }>
         { (link.links && link.links.length > 0 ?
           <button
             style={ { [isRtl ? 'marginRight' : 'marginLeft']: paddingBefore } }
@@ -233,10 +236,13 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
     const isGroupExpanded: boolean = !this.state.isGroupCollapsed![group.name!];
 
     return (
-      <div key={ groupIndex } className={ css('ms-Nav-group', styles.group, {
-        'is-expanded': isGroupExpanded,
-        [styles.groupIsExpanded]: isGroupExpanded
-      }) }>
+      <div
+        key={ groupIndex }
+        className={ css(
+          'ms-Nav-group',
+          styles.group,
+          isGroupExpanded && ('is-expanded ' + styles.groupIsExpanded)
+        ) }>
         { (group.name ?
           <button
             className={ css('ms-Nav-chevronButton ms-Nav-chevronButton--group ms-Nav-groupHeaderFontSize', styles.chevronButton, styles.chevronButtonIsGroup, styles.groupHeaderFontSize) }
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx
index cdeabedea3e49..993f8e7948e3c 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx
@@ -46,9 +46,12 @@ export class ProgressIndicator extends BaseComponent<IProgressIndicatorProps, {}
         <div className={ css('ms-ProgressIndicator-itemName', styles.itemName) }>{ label }</div>
         <div className={ css('ms-ProgressIndicator-itemProgress', styles.itemProgress) }>
           <div className={ css('ms-ProgressIndicator-progressTrack', styles.progressTrack) }></div>
-          <div className={ css('ms-ProgressIndicator-progressBar', styles.progressBar, {
-            'smoothTransition': percentComplete > ZERO_THRESHOLD
-          }) }
+          <div
+            className={ css(
+              'ms-ProgressIndicator-progressBar',
+              styles.progressBar,
+              percentComplete > ZERO_THRESHOLD && 'smoothTransition'
+            ) }
             style={ { width: percentComplete + '%' } }
             role='progressbar'
             aria-valuemin='0'
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
index bffdcc13ada61..f4bbd77ccd771 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
@@ -113,10 +113,13 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
             { ...onTouchStartProp }
             { ...onKeyDownProp }
             { ...buttonProps }
-            className={ css('ms-Slider-slideBox', styles.slideBox, buttonProps!.className, {
-              'ms-Slider-showValue': !!showValue,
-              ['ms-Slider-showTransitions ' + styles.showTransitions]: (renderedValue === value)
-            }) }
+            className={ css(
+              'ms-Slider-slideBox',
+              styles.slideBox,
+              buttonProps!.className,
+              !!showValue && 'ms-Slider-showValue',
+              (renderedValue === value) && ('ms-Slider-showTransitions ' + styles.showTransitions)
+            ) }
             id={ this._id }
             disabled={ disabled }
             type='button'

From e35e5e23555797dae09d6f3aac98fd932c245f1d Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 17 Aug 2017 13:41:30 -0700
Subject: [PATCH 0436/1641] Toggle: refined the JavaScript css styling to be
 cleaner, fixed issues (#2538)

* Cleaning up the javascript styling for toggle to only have a classnames file. Tweaking the return type of mergeStyleSets to be less restrictive.

* Adding change files.
---
 .../toggle-cleanup_2017-08-17-18-12.json      |  11 +
 .../toggle-cleanup_2017-08-17-18-12.json      |  11 +
 .../components/Toggle/Toggle.classNames.ts    | 199 ++++++++++++++++++
 .../src/components/Toggle/Toggle.styles.ts    | 125 -----------
 .../src/components/Toggle/Toggle.tsx          | 127 +++--------
 .../styling/src/utilities/mergeStyleSets.ts   |   4 +-
 6 files changed, 249 insertions(+), 228 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/toggle-cleanup_2017-08-17-18-12.json
 create mode 100644 common/changes/office-ui-fabric-react/toggle-cleanup_2017-08-17-18-12.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts

diff --git a/common/changes/@uifabric/styling/toggle-cleanup_2017-08-17-18-12.json b/common/changes/@uifabric/styling/toggle-cleanup_2017-08-17-18-12.json
new file mode 100644
index 0000000000000..1241859baf4f8
--- /dev/null
+++ b/common/changes/@uifabric/styling/toggle-cleanup_2017-08-17-18-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "mergeStyleSets: tweaked the return type to be less restrictive.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/toggle-cleanup_2017-08-17-18-12.json b/common/changes/office-ui-fabric-react/toggle-cleanup_2017-08-17-18-12.json
new file mode 100644
index 0000000000000..8475268c28a4c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/toggle-cleanup_2017-08-17-18-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Toggle: fixed issue where disabled Toggles are clickable. Also cleaned up some of the styling.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
new file mode 100644
index 0000000000000..cf4fb04a594d0
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
@@ -0,0 +1,199 @@
+import { memoizeFunction } from '../../Utilities';
+import {
+  ITheme,
+  mergeStyleSets,
+  getFocusStyle
+} from '../../Styling';
+import { IToggleStyles } from './Toggle.Props';
+
+export interface IToggleClassNames {
+  root?: string;
+  label?: string;
+  container?: string;
+  pill?: string;
+  thumb?: string;
+  text?: string;
+}
+
+export const getClassNames = memoizeFunction((
+  theme: ITheme,
+  styles: IToggleStyles,
+  className: string,
+  disabled: boolean,
+  checked: boolean
+): IToggleClassNames => {
+  const { semanticColors } = theme;
+  const pillUncheckedBackground = semanticColors.bodyBackground;
+  const pillCheckedBackground = semanticColors.inputBackgroundChecked;
+  const pillCheckedHoveredBackground = semanticColors.inputBackgroundCheckedHovered;
+  const pillCheckedDisabledBackground = semanticColors.disabledText;
+  const thumbBackground = semanticColors.inputBorderHovered;
+  const thumbCheckedBackground = semanticColors.inputForegroundChecked;
+  const thumbDisabledBackground = semanticColors.disabledText;
+  const thumbCheckedDisabledBackground = semanticColors.disabledBackground;
+  const pillBorderColor = semanticColors.inputBorder;
+  const pillBorderHoveredColor = semanticColors.inputBorderHovered;
+  const pillBorderDisabledColor = semanticColors.disabledText;
+  const toggleFocusBorderColor = semanticColors.focusBorder;
+  const textDisabledColor = semanticColors.disabledText;
+
+  styles = styles || {};
+
+  return mergeStyleSets({
+    root: [
+      'ms-Toggle',
+      checked && 'is-checked',
+      !disabled && 'is-enabled',
+      disabled && 'is-disabled',
+      className,
+      {
+        marginBottom: '8px'
+      },
+      styles.root
+    ],
+
+    label: [
+      'ms-Toggle-label',
+      styles.label
+    ],
+
+    container: [
+      'ms-Toggle-innerContainer',
+      {
+        display: 'inline-flex',
+        position: 'relative',
+      },
+      styles.container
+    ],
+
+    pill: [
+      'ms-Toggle-background',
+      getFocusStyle(theme, '-1px'),
+      {
+        fontSize: '20px',
+        lineHeight: '1em',
+        boxSizing: 'border-box',
+        position: 'relative',
+        width: '2.2em',
+        height: '1em',
+        borderRadius: '1em',
+        transition: 'all 0.1s ease',
+        borderWidth: '1px',
+        borderStyle: 'solid',
+        background: pillUncheckedBackground,
+        borderColor: pillBorderColor,
+        cursor: 'pointer',
+      },
+      styles.pill,
+      !disabled && [
+        !checked && {
+          ':hover': [
+            {
+              borderColor: pillBorderHoveredColor
+            },
+            styles.pillHovered
+          ],
+          ':hover .ms-Toggle-thumb': styles.thumbHovered
+        },
+        checked && [
+          {
+            background: pillCheckedBackground,
+            borderColor: 'transparent',
+          },
+          styles.pillChecked,
+          {
+            ':hover': [
+              {
+                backgroundColor: pillCheckedHoveredBackground,
+                borderColor: 'transparent'
+              },
+              styles.pillCheckedHovered
+            ],
+            ':hover .ms-Toggle-thumb': [
+              styles.thumbCheckedHovered
+            ]
+          }
+        ]
+      ],
+      disabled && [
+        {
+          cursor: 'default'
+        },
+        !checked && [
+          {
+            borderColor: pillBorderDisabledColor
+          },
+          styles.pillDisabled
+        ],
+        checked && [
+          {
+            backgroundColor: pillCheckedDisabledBackground,
+            borderColor: 'transparent'
+          },
+          styles.pillCheckedDisabled
+        ],
+      ]
+    ],
+
+    thumb: [
+      'ms-Toggle-thumb',
+      {
+        width: '.5em',
+        height: '.5em',
+        borderRadius: '.5em',
+        position: 'absolute',
+        top: '.2em',
+        transition: 'all 0.1s ease',
+        backgroundColor: thumbBackground,
+        /* Border is added to handle high contrast mode for Firefox */
+        borderColor: 'transparent',
+        borderWidth: '.27em',
+        borderStyle: 'solid',
+        boxSizing: 'border-box',
+        left: '.2em'
+      },
+      styles.thumb,
+      !disabled && checked && [
+        {
+          backgroundColor: thumbCheckedBackground,
+          left: '1.4em'
+        },
+        styles.thumbChecked
+      ],
+      disabled && [
+        !checked && [
+          {
+            backgroundColor: thumbDisabledBackground,
+            left: '.2em',
+          },
+          styles.thumbDisabled
+        ],
+        checked && [
+          {
+            backgroundColor: thumbCheckedDisabledBackground,
+            left: '1.4em'
+          },
+          styles.thumbCheckedDisabled
+        ]
+      ]
+    ],
+
+    text: [
+      'ms-Toggle-stateText',
+      {
+        '.ms-Toggle-stateText': {
+          padding: '0',
+          margin: '0 10px',
+          userSelect: 'none'
+        }
+      },
+      disabled && {
+        '.ms-Toggle-stateText': {
+          color: textDisabledColor
+        }
+      },
+      styles.text
+    ]
+  });
+
+});
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts
deleted file mode 100644
index 63bf000c89607..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.styles.ts
+++ /dev/null
@@ -1,125 +0,0 @@
-import { IToggleStyles } from './Toggle.Props';
-import {
-  ITheme,
-  mergeStyleSets,
-  getFocusStyle
-} from '../../Styling';
-import { memoizeFunction } from '../../Utilities';
-
-export const getStyles = memoizeFunction((
-  theme: ITheme,
-  customStyles?: IToggleStyles
-): IToggleStyles => {
-  const { semanticColors } = theme;
-  const pillUncheckedBackground = semanticColors.bodyBackground;
-  const pillCheckedBackground = semanticColors.inputBackgroundChecked;
-  const pillCheckedHoveredBackground = semanticColors.inputBackgroundCheckedHovered;
-  const pillCheckedDisabledBackground = semanticColors.disabledText;
-  const thumbBackground = semanticColors.inputBorderHovered;
-  const thumbCheckedBackground = semanticColors.inputForegroundChecked;
-  const thumbDisabledBackground = semanticColors.disabledText;
-  const thumbCheckedDisabledBackground = semanticColors.disabledBackground;
-  const pillBorderColor = semanticColors.inputBorder;
-  const pillBorderHoveredColor = semanticColors.inputBorderHovered;
-  const pillBorderDisabledColor = semanticColors.disabledText;
-  const toggleFocusBorderColor = semanticColors.focusBorder;
-
-  const styles: IToggleStyles = {
-    root: {
-      marginBottom: '8px'
-    },
-
-    container: [
-      {
-        display: 'inline-flex',
-        position: 'relative',
-      }
-    ],
-
-    pill: [
-      getFocusStyle(theme, '-1px'),
-      {
-        fontSize: '20px',
-        lineHeight: '1em',
-        boxSizing: 'border-box',
-        position: 'relative',
-        width: '2.2em',
-        height: '1em',
-        borderRadius: '1em',
-        transition: 'all 0.1s ease',
-        borderWidth: '1px',
-        borderStyle: 'solid',
-        background: pillUncheckedBackground,
-        borderColor: pillBorderColor,
-        cursor: 'pointer',
-      }
-    ],
-
-    pillHovered: {
-      borderColor: pillBorderHoveredColor
-    },
-
-    pillChecked: {
-      background: pillCheckedBackground,
-      borderColor: 'transparent',
-    },
-
-    pillCheckedHovered: {
-      backgroundColor: pillCheckedHoveredBackground,
-      borderColor: 'transparent'
-    },
-
-    pillDisabled: {
-      borderColor: pillBorderDisabledColor
-    },
-
-    pillCheckedDisabled: {
-      backgroundColor: pillCheckedDisabledBackground,
-      borderColor: 'transparent'
-    },
-
-    thumb: {
-      width: '.5em',
-      height: '.5em',
-      borderRadius: '.5em',
-      position: 'absolute',
-      top: '.2em',
-      transition: 'all 0.1s ease',
-      backgroundColor: thumbBackground,
-      /* Border is added to handle high contrast mode for Firefox */
-      borderColor: 'transparent',
-      borderWidth: '.27em',
-      borderStyle: 'solid',
-      boxSizing: 'border-box',
-      left: '.2em'
-    },
-
-    thumbChecked: {
-      backgroundColor: thumbCheckedBackground,
-      left: '1.4em'
-    },
-
-    thumbDisabled: {
-      backgroundColor: thumbDisabledBackground,
-      left: '.2em',
-    },
-
-    thumbCheckedDisabled: {
-      backgroundColor: thumbCheckedDisabledBackground,
-      left: '1.4em'
-    },
-
-    text: {
-      // Workaround; until Label is converted and we can pass in custom styles, we need to make this
-      // more specific. Once Label is converted, we should be able to just pull in the customized styling.
-      '.ms-Toggle-stateText': {
-        padding: '0',
-        margin: '0 10px',
-        userSelect: 'none'
-      }
-    }
-
-  };
-
-  return mergeStyleSets(styles, customStyles) as IToggleStyles;
-});
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
index babc4ade521b5..0304b5e1f9de5 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
@@ -19,22 +19,12 @@ import {
 import {
   mergeStyles
 } from '../../Styling';
-
-import { getStyles } from './Toggle.styles';
+import { getClassNames } from './Toggle.classNames';
 
 export interface IToggleState {
   isChecked: boolean;
 }
 
-interface IToggleClassNames {
-  root: string;
-  label: string;
-  container: string;
-  pill: string;
-  thumb: string;
-  text: string;
-}
-
 @customizable(['theme'])
 export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements IToggle {
 
@@ -91,8 +81,9 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
     let stateText = isChecked ? onText : offText;
     const ariaLabel = isChecked ? onAriaLabel : offAriaLabel;
     const toggleNativeProps = getNativeProps(this.props, inputProperties, ['defaultChecked']);
-    const classNames = this._getClassNames(
-      getStyles(theme!, customStyles),
+    const classNames = getClassNames(
+      theme!,
+      customStyles!,
       className!,
       disabled!,
       isChecked
@@ -108,22 +99,22 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
         <div className={ classNames.container } >
           <button
             { ...toggleNativeProps }
-            type='button'
             className={ classNames.pill }
-            ref={ (c): HTMLButtonElement => this._toggleButton = c! }
+            disabled={ disabled }
+            id={ this._id }
+            type='button'
+            ref={ this._resolveRef('_toggleButton') }
             aria-disabled={ disabled }
             aria-pressed={ isChecked }
             aria-label={ ariaLabel }
-            id={ this._id }
-            onChange={ () => { /* no-op */ } }
-            disabled={ disabled }
             data-is-focusable={ true }
+            onChange={ () => { /* no-op */ } }
             onClick={ this._onClick }
           >
             <div className={ classNames.thumb } />
           </button>
           { stateText && (
-            <Label className={ classNames.text }>{ stateText }</Label>
+            <Label htmlFor={ this._id } className={ classNames.text }>{ stateText }</Label>
           ) }
         </div>
       </div >
@@ -138,91 +129,25 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
 
   @autobind
   private _onClick(ev: React.MouseEvent<HTMLElement>) {
-    let { checked, onChanged, onClick } = this.props;
+    let { disabled, checked, onChanged, onClick } = this.props;
     let { isChecked } = this.state;
 
-    // Only update the state if the user hasn't provided it.
-    if (checked === undefined) {
-      this.setState({
-        isChecked: !isChecked
-      });
-    }
-
-    if (onChanged) {
-      onChanged(!isChecked);
-    }
-
-    if (onClick) {
-      onClick(ev);
+    if (!disabled) {
+      // Only update the state if the user hasn't provided it.
+      if (checked === undefined) {
+        this.setState({
+          isChecked: !isChecked
+        });
+      }
+
+      if (onChanged) {
+        onChanged(!isChecked);
+      }
+
+      if (onClick) {
+        onClick(ev);
+      }
     }
   }
 
-  @memoize
-  private _getClassNames(
-    styles: IToggleStyles,
-    className: string,
-    disabled: boolean,
-    isChecked: boolean
-    ): IToggleClassNames {
-
-    return {
-      root: mergeStyles(
-        'ms-Toggle',
-        isChecked && 'is-checked',
-        !disabled && 'is-enabled',
-        disabled && 'is-disabled',
-        className,
-        styles.root
-      ) as string,
-
-      label: mergeStyles(
-        'ms-Toggle-label',
-        styles.label
-      ) as string,
-
-      container: mergeStyles(
-        'ms-Toggle-innerContainer',
-        styles.container
-      ) as string,
-
-      pill: mergeStyles(
-        'ms-Toggle-background',
-        styles.pill,
-        !disabled && [
-          !isChecked && {
-            ':hover': styles.pillHovered,
-            ':hover .ms-Toggle-thumb': styles.thumbHovered
-          },
-          isChecked && [
-            styles.pillChecked,
-            {
-              ':hover': styles.pillCheckedHovered,
-              ':hover .ms-Toggle-thumb': styles.thumbCheckedHovered
-            }
-          ]
-        ],
-        disabled && [
-          !isChecked && styles.pillDisabled,
-          isChecked && styles.pillCheckedDisabled,
-        ]
-      ) as string,
-
-      thumb: mergeStyles(
-        'ms-Toggle-thumb',
-        styles.thumb,
-        !disabled && isChecked && styles.thumbChecked,
-        disabled && [
-          !isChecked && styles.thumbDisabled,
-          isChecked && styles.thumbCheckedDisabled
-        ]
-      ) as string,
-
-      text: mergeStyles(
-        'ms-Toggle-stateText',
-        styles.text
-      ) as string,
-
-    };
-  }
-
 }
diff --git a/packages/styling/src/utilities/mergeStyleSets.ts b/packages/styling/src/utilities/mergeStyleSets.ts
index 489a7e4e293fa..cd8590ce34727 100644
--- a/packages/styling/src/utilities/mergeStyleSets.ts
+++ b/packages/styling/src/utilities/mergeStyleSets.ts
@@ -5,8 +5,8 @@ import { mergeStyles } from './mergeStyles';
  * like Object.assign in that it layers them in the argument order specified, but will
  * not mutate them and will return the merged result.
  */
-export function mergeStyleSets<T>(...args: T[]): T {
-  const mergedRules: T = {} as T;
+export function mergeStyleSets<T>(...args: T[]): {[key in keyof T]?: string } {
+  const mergedRules: {[key in keyof T]?: string } = {};
   // tslint:disable-next-line:no-any
   const setStyles: any = {};
 

From 8d1c3d64c38899aad8ccad960fbaea5ccef9872f Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Thu, 17 Aug 2017 14:13:32 -0700
Subject: [PATCH 0437/1641] Dropdown: Fixed bug where selected state was not
 being removed from dropdown options (#2537)

* Fixed bug where selected state was not being removed from dropdown options

* Change file
---
 .../dropdown-selected-fix_2017-08-17-17-04.json       | 11 +++++++++++
 .../src/components/Dropdown/Dropdown.tsx              |  9 ++++++---
 2 files changed, 17 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/dropdown-selected-fix_2017-08-17-17-04.json

diff --git a/common/changes/office-ui-fabric-react/dropdown-selected-fix_2017-08-17-17-04.json b/common/changes/office-ui-fabric-react/dropdown-selected-fix_2017-08-17-17-04.json
new file mode 100644
index 0000000000000..5b78d53f65f4e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/dropdown-selected-fix_2017-08-17-17-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: Fixed bug where selected state was not being removed from dropdown options",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index a199c8512dd5c..abf0e9028df84 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -217,7 +217,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   public setSelectedIndex(index: number) {
-    let { onChanged, options, selectedKey, selectedKeys } = this.props;
+    let { onChanged, options, selectedKey, selectedKeys, multiSelect } = this.props;
     let { selectedIndex, selectedIndexes } = this.state;
     let checked: boolean = selectedIndexes ? selectedIndexes.indexOf(index) > -1 : false;
 
@@ -226,7 +226,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     if (index !== selectedIndex) {
       if (selectedKey === undefined) {
         // Set the selected option if this is an uncontrolled component
-        if (this.props.multiSelect) {
+        if (multiSelect) {
           let newIndexes = selectedIndexes ? this._copyArray(selectedIndexes) : [];
           if (checked) {
             let position = newIndexes.indexOf(index);
@@ -249,9 +249,12 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
       }
       if (onChanged) {
         // for single-select, option passed in will always be selected.
+        if (!multiSelect) {
+          options.map((option: any) => option.selected === true ? option.selected = false : null);
+        }
         // for multi-select, flip the checked value
         let changedOpt = options[index];
-        changedOpt.selected = this.props.multiSelect ? !checked : true;
+        changedOpt.selected = multiSelect ? !checked : true;
         onChanged(changedOpt, index);
       }
     }

From fa91b3922c72797cabb972576159288885014bfc Mon Sep 17 00:00:00 2001
From: Eddie Liu <leddie24@gmail.com>
Date: Fri, 18 Aug 2017 00:25:40 +0000
Subject: [PATCH 0438/1641] Update ScrollablePane page documentation/usage
 (#2543)

---
 .../src/components/ScrollablePane/ScrollablePanePage.tsx      | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
index e0289d5dd0473..d4fb4e24c8449 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
@@ -38,7 +38,7 @@ export class ScrollablePanePage extends React.Component<IComponentDemoPageProps,
         overview={
           <div>
             <p>
-              ScrollablePane is a helper component designed to use in conjunction with a Sticky component.  ScrollablePane will find the nearest scrollable parent element, and designate that as the container for Sticky components.  Sticky components will "stick" to the top or bottom of a ScrollablePane's scrollable region and remain visible.
+              ScrollablePane is a helper component designed to use in conjunction with a Sticky component.  Sticky components will "stick" to the top or bottom of a ScrollablePane's scrollable region and remain visible.  ScrollablePane requires a height or max-height set either on the component itself, or on the immediate parent element.
             </p>
           </div>
         }
@@ -48,7 +48,7 @@ export class ScrollablePanePage extends React.Component<IComponentDemoPageProps,
         dos={
           <div>
             <ul>
-              <li>Designate the nearest scrollable parent with the attribute data-is-scrollable=true</li>
+              <li>Ensure that a parent component has a CSS height, or max-height attribute set (and any intermediary containers have an inherit, or explicit height/max-height set).</li>
               <li>Use Sticky component on block level elements</li>
               <li>Sticky component are ideally section headers and/or footers</li>
             </ul>

From 3ab591c8b3f3c9645beb16022d8a3e67c6ee2fac Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Thu, 17 Aug 2017 17:39:19 -0700
Subject: [PATCH 0439/1641] Fix some bugs with TilesList and clean up some List
 typings (#2539)

* Fix underflow behavior for TilesList stack mode

* Fix some unused code and typings in List

* Update change output
---
 .../experiments/list-range_2017-08-17-18-12.json  | 11 +++++++++++
 .../list-range_2017-08-17-18-12.json              | 11 +++++++++++
 .../src/components/TilesList/TilesList.tsx        |  6 +++---
 .../src/components/List/List.tsx                  | 15 ++++++++-------
 4 files changed, 33 insertions(+), 10 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/list-range_2017-08-17-18-12.json
 create mode 100644 common/changes/office-ui-fabric-react/list-range_2017-08-17-18-12.json

diff --git a/common/changes/@uifabric/experiments/list-range_2017-08-17-18-12.json b/common/changes/@uifabric/experiments/list-range_2017-08-17-18-12.json
new file mode 100644
index 0000000000000..2f42abfc770bb
--- /dev/null
+++ b/common/changes/@uifabric/experiments/list-range_2017-08-17-18-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Fix underflow for TilesList with stack grids",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/list-range_2017-08-17-18-12.json b/common/changes/office-ui-fabric-react/list-range_2017-08-17-18-12.json
new file mode 100644
index 0000000000000..dc0ec0592b83f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/list-range_2017-08-17-18-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix some unused code and typings in List",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/TilesList/TilesList.tsx b/packages/experiments/src/components/TilesList/TilesList.tsx
index e38669ad107ee..f6e6f5a4528a6 100644
--- a/packages/experiments/src/components/TilesList/TilesList.tsx
+++ b/packages/experiments/src/components/TilesList/TilesList.tsx
@@ -207,7 +207,7 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
             scaleFactor
           } = currentRow;
 
-          if (!currentRow.isLastRow || scaleFactor <= grid.maxScaleFactor) {
+          if (grid.mode === TilesGridMode.fill && (!currentRow.isLastRow || scaleFactor <= grid.maxScaleFactor)) {
             const finalScaleFactor = Math.min(grid.maxScaleFactor, scaleFactor);
 
             finalSize = {
@@ -347,7 +347,7 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
 
         const width = aspectRatio * grid.minRowHeight + grid.spacing;
 
-        if (rowWidth + width > boundsWidth && grid.mode === TilesGridMode.fill) {
+        if (rowWidth + width > boundsWidth) {
           const totalMargin = grid.spacing * (i - rowStart);
           currentRow.scaleFactor = (boundsWidth - totalMargin) / (rowWidth - totalMargin);
         }
@@ -379,7 +379,7 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
         currentRow.isLastRow = true;
       }
 
-      if (rowWidth < boundsWidth && grid.mode === TilesGridMode.fill) {
+      if (rowWidth < boundsWidth) {
         const totalMargin = grid.spacing * (i - rowStart);
         currentRow.scaleFactor = (boundsWidth - totalMargin) / (rowWidth - totalMargin);
       }
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index 35899d4076a89..d3cc4b47646e4 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -570,9 +570,11 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   }
 
   private _updatePageMeasurements(oldPages: IPage[], newPages: IPage[]) {
-    let renderedIndexes = {};
+    const renderedIndexes: {
+      [index: number]: IPage;
+    } = {};
+
     let heightChanged = false;
-    let renderCount = this._getRenderCount();
 
     // when not in virtualize mode, we render all the items without page measurement
     if (!this._shouldVirtualize()) {
@@ -583,7 +585,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       let page = oldPages[i];
 
       if (page.items) {
-        (renderedIndexes as any)[page.startIndex] = page;
+        renderedIndexes[page.startIndex] = page;
       }
     }
 
@@ -593,17 +595,17 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       if (page.items) {
         heightChanged = this._measurePage(page) || heightChanged;
 
-        if (!(renderedIndexes as any)[page.startIndex]) {
+        if (!renderedIndexes[page.startIndex]) {
           this._onPageAdded(page);
         } else {
-          delete (renderedIndexes as any)[page.startIndex];
+          delete renderedIndexes[page.startIndex];
         }
       }
     }
 
     for (let index in renderedIndexes) {
       if (renderedIndexes.hasOwnProperty(index)) {
-        this._onPageRemoved((renderedIndexes as any)[index]);
+        this._onPageRemoved(renderedIndexes[index]);
       }
     }
 
@@ -858,7 +860,6 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     props = props || this.props;
     const { renderedWindowsAhead, renderedWindowsBehind } = props;
     const { pages } = this.state;
-    const renderCount = this._getRenderCount(props);
     // when not in virtualize mode, we render all items without measurement to optimize page rendering perf
     if (!this._shouldVirtualize()) {
       return;

From be902328b437c88c85b8e1f924b421e94b163f5f Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Fri, 18 Aug 2017 08:28:10 -0700
Subject: [PATCH 0440/1641] Add CommandBar to experiments, add Action and
 CommandBar button to Fabric (#2496)

* Copy command bar and command/action button into experiments

* Styling to styling

* Adding styling to dependencies

* remove styling from package.json

* pull styling from exported in fabric

* Gotta save after you solve merge conflict

* Change foldername

* Moved buttons into oufr

* Change file

* Change sass import

* Changed back to core

* removed core from experiments

* remove reference to core package

* Turn on precopy and set css/sass to be copied in precopy

* Turned off postCopy
---
 ...d-bar-in-experiments_2017-08-16-18-18.json |  11 +
 ...d-bar-in-experiments_2017-08-16-18-18.json |  11 +
 packages/experiments/package.json             |   5 +-
 packages/experiments/src/CommandBar.ts        |   1 +
 packages/experiments/src/Link.ts              |   1 -
 .../components/CommandBar/CommandBar.Props.ts |  98 ++++++++
 .../src/components/CommandBar/CommandBar.scss |  19 ++
 .../components/CommandBar/CommandBar.test.tsx | 216 ++++++++++++++++++
 .../src/components/CommandBar/CommandBar.tsx  | 211 +++++++++++++++++
 .../CommandBar/CommandBar.visualtest.ts       |  37 +++
 .../components/CommandBar/CommandBarPage.tsx  |  80 +++++++
 .../CommandBar/CommandBarPage.visualtest.tsx  |  38 +++
 .../examples/CommandBar.Basic.Example.tsx     |  30 +++
 .../components/CommandBar/examples/data.ts    | 109 +++++++++
 .../src/components/CommandBar/index.ts        |   2 +
 .../src/components/Link/Link.Props.ts         |  23 --
 .../experiments/src/components/Link/Link.scss |  44 ----
 .../src/components/Link/Link.test.tsx         |  23 --
 .../experiments/src/components/Link/Link.tsx  |  75 ------
 .../src/components/Link/LinkPage.tsx          |  71 ------
 .../Link/examples/Link.Basic.Example.tsx      |  18 --
 .../experiments/src/components/Link/index.ts  |   2 -
 .../experiments/src/demo/AppDefinition.tsx    |   8 +-
 packages/experiments/src/index.ts             |   8 +-
 packages/office-ui-fabric-react/gulpfile.js   |   4 +-
 .../src/common/_common.scss                   |   2 +-
 .../ActionButton.styles.ts}                   |  39 ++--
 .../Button/ActionButton/ActionButton.tsx      |  27 +++
 .../Button/BaseButton.classNames.ts           |   2 +
 .../src/components/Button/Button.Props.ts     |  27 ++-
 .../src/components/Button/ButtonPage.tsx      |  13 +-
 .../CommandBarButton.styles.ts                |  82 +++++++
 .../CommandBarButton/CommandBarButton.tsx     |  27 +++
 .../Button/CommandButton/CommandButton.tsx    |  28 +--
 .../Button/examples/Button.Action.Example.tsx |  31 +++
 .../examples/Button.CommandBar.Example.tsx    |  43 ++++
 .../src/components/Button/index.ts            |   2 +
 37 files changed, 1151 insertions(+), 317 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/command-bar-in-experiments_2017-08-16-18-18.json
 create mode 100644 common/changes/office-ui-fabric-react/command-bar-in-experiments_2017-08-16-18-18.json
 create mode 100644 packages/experiments/src/CommandBar.ts
 delete mode 100644 packages/experiments/src/Link.ts
 create mode 100644 packages/experiments/src/components/CommandBar/CommandBar.Props.ts
 create mode 100644 packages/experiments/src/components/CommandBar/CommandBar.scss
 create mode 100644 packages/experiments/src/components/CommandBar/CommandBar.test.tsx
 create mode 100644 packages/experiments/src/components/CommandBar/CommandBar.tsx
 create mode 100644 packages/experiments/src/components/CommandBar/CommandBar.visualtest.ts
 create mode 100644 packages/experiments/src/components/CommandBar/CommandBarPage.tsx
 create mode 100644 packages/experiments/src/components/CommandBar/CommandBarPage.visualtest.tsx
 create mode 100644 packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
 create mode 100644 packages/experiments/src/components/CommandBar/examples/data.ts
 create mode 100644 packages/experiments/src/components/CommandBar/index.ts
 delete mode 100644 packages/experiments/src/components/Link/Link.Props.ts
 delete mode 100644 packages/experiments/src/components/Link/Link.scss
 delete mode 100644 packages/experiments/src/components/Link/Link.test.tsx
 delete mode 100644 packages/experiments/src/components/Link/Link.tsx
 delete mode 100644 packages/experiments/src/components/Link/LinkPage.tsx
 delete mode 100644 packages/experiments/src/components/Link/examples/Link.Basic.Example.tsx
 delete mode 100644 packages/experiments/src/components/Link/index.ts
 rename packages/office-ui-fabric-react/src/components/Button/{CommandButton/CommandButton.styles.ts => ActionButton/ActionButton.styles.ts} (72%)
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/examples/Button.CommandBar.Example.tsx

diff --git a/common/changes/@uifabric/experiments/command-bar-in-experiments_2017-08-16-18-18.json b/common/changes/@uifabric/experiments/command-bar-in-experiments_2017-08-16-18-18.json
new file mode 100644
index 0000000000000..92b196edc9d76
--- /dev/null
+++ b/common/changes/@uifabric/experiments/command-bar-in-experiments_2017-08-16-18-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Added commandbar as ExperimentCommandBar",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/command-bar-in-experiments_2017-08-16-18-18.json b/common/changes/office-ui-fabric-react/command-bar-in-experiments_2017-08-16-18-18.json
new file mode 100644
index 0000000000000..e7dda66768e17
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/command-bar-in-experiments_2017-08-16-18-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added ActionButton and CommandBarButton",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index d7cfaeaa09c48..5de5d5a7c0ee5 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -64,11 +64,10 @@
     "webpack-notifier": "^1.5.0"
   },
   "dependencies": {
-    "office-ui-fabric-react": "4.34.0",
-    "office-ui-fabric-core": ">= 7.1.2 <8.0.0"
+    "office-ui-fabric-react": ">=4.34.0"
   },
   "peerDependencies": {
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   }
-}
+}
\ No newline at end of file
diff --git a/packages/experiments/src/CommandBar.ts b/packages/experiments/src/CommandBar.ts
new file mode 100644
index 0000000000000..eb972f5838cae
--- /dev/null
+++ b/packages/experiments/src/CommandBar.ts
@@ -0,0 +1 @@
+export * from './components/CommandBar';
diff --git a/packages/experiments/src/Link.ts b/packages/experiments/src/Link.ts
deleted file mode 100644
index 9fed7079908fd..0000000000000
--- a/packages/experiments/src/Link.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './components/Link/index';
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.Props.ts b/packages/experiments/src/components/CommandBar/CommandBar.Props.ts
new file mode 100644
index 0000000000000..21b452825942a
--- /dev/null
+++ b/packages/experiments/src/components/CommandBar/CommandBar.Props.ts
@@ -0,0 +1,98 @@
+import * as React from 'react';
+import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { IButtonStyles } from 'office-ui-fabric-react/lib/Button';
+import { ISearchBoxProps } from 'office-ui-fabric-react/lib/SearchBox';
+import { IIconProps } from 'office-ui-fabric-react/lib/Icon';
+import { ICommandBarData } from './CommandBar';
+
+export interface ICommandBar {
+  /**
+   * Sets focus to the active command in the list.
+   */
+  focus(): void;
+}
+
+export interface ICommandBarProps extends React.HTMLAttributes<HTMLDivElement> {
+  /**
+   * Optional callback to access the ICommandBar interface. Use this instead of ref for accessing
+   * the public methods and properties of the component.
+   */
+  componentRef?: (component: ICommandBar) => void;
+
+  /**
+   * Items to render
+   */
+  items: ICommandBarItemProps[];
+
+  /**
+ * Items to render on the right side (or left, in RTL).
+ */
+  farItems?: ICommandBarItemProps[];
+
+  /**
+   * Default items to have in the overflow menu
+   */
+  overflowItems?: ICommandBarItemProps[];
+
+  /**
+   * Text to be read by screen readers if there are overflow items and focus is on elipsis button
+   */
+  elipisisAriaLabel?: string;
+
+  /**
+  * Text to be read by screen readers if there are overflow items and focus is on elipsis button
+  */
+  elipisisIconProps?: IIconProps;
+
+  /**
+   * Custom styles to be mixed into individual button styles
+   */
+  buttonStyles?: IButtonStyles;
+
+  /**
+   * Custom render function for all non contextual menu buttons.
+   */
+  onRenderButton?: (item: ICommandBarItemProps) => JSX.Element;
+
+  /**
+   * Custom function to reduce data if items do not fit in given space. Return `undefined` if no more steps can be taken to avoid infinate loop.
+   */
+  onReduceData?: (data: ICommandBarData) => ICommandBarData;
+
+  /**
+   * Custom function to grow data if items are too small for the given space. Return `undefined` if no more steps can be taken to avoid infinate loop.
+   */
+  onGrowData?: (data: ICommandBarData) => ICommandBarData;
+
+  /**
+   * Additional css class to apply to the command bar
+   * @defaultvalue undefined
+   */
+  className?: string;
+}
+
+export interface ICommandBarItemProps extends IContextualMenuItem {
+
+  /**
+   * Remove text when button is not in the overflow
+   * @defaultvalue false
+   */
+  iconOnly?: boolean;
+
+  /**
+   * Custom styles for individual button
+   */
+  styles?: IButtonStyles;
+
+  /**
+   * A custom cache key to be used for this item. If cacheKey is changed, the cache will invalidate. Defaults to key value;
+   */
+  cacheKey?: string;
+
+  /**
+   * Context under which the item is being rendered
+   * This value is controlled by the component and useful for adjusting onRender function
+   */
+  renderedInOverflow?: boolean;
+
+}
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.scss b/packages/experiments/src/components/CommandBar/CommandBar.scss
new file mode 100644
index 0000000000000..22ba0a13c4fff
--- /dev/null
+++ b/packages/experiments/src/components/CommandBar/CommandBar.scss
@@ -0,0 +1,19 @@
+@import '../../../../office-ui-fabric-react/src/common/common';
+
+.root {
+  display: flex;
+  background-color: $ms-color-neutralLighter;
+  padding: 0 16px;
+}
+
+.primarySet {
+  flex-grow: 1;
+  display: flex;
+  align-items: stretch;
+}
+
+.secondarySet {
+  flex-shrink: 0;
+  display: flex;
+  align-items: stretch;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.test.tsx b/packages/experiments/src/components/CommandBar/CommandBar.test.tsx
new file mode 100644
index 0000000000000..b54e800654fab
--- /dev/null
+++ b/packages/experiments/src/components/CommandBar/CommandBar.test.tsx
@@ -0,0 +1,216 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+
+import * as ReactDOM from 'react-dom';
+import * as ReactTestUtils from 'react-addons-test-utils';
+
+let { expect } = chai;
+
+import { CommandBar } from './CommandBar';
+import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
+
+// describe('CommandBar', () => {
+
+//   afterEach(() => {
+//     for (let i = 0; i < document.body.children.length; i++) {
+//       if (document.body.children[i].tagName === 'DIV') {
+//         document.body.removeChild(document.body.children[i]);
+//         i--;
+//       }
+//     }
+//   });
+
+//   it.only('opens a menu with IContextualMenuItem.subMenuProps.items property', () => {
+//     const items: IContextualMenuItem[] = [
+//       {
+//         name: 'TestText 1',
+//         key: 'TestKey1',
+//         subMenuProps: {
+//           items: [
+//             {
+//               name: 'SubmenuText 1',
+//               key: 'SubmenuKey1',
+//               className: 'SubMenuClass'
+//             }
+//           ]
+//         }
+//       },
+//     ];
+
+//     let renderedContent = ReactTestUtils.renderIntoDocument<CommandBar>(
+//       <CommandBar
+//         items={ items }
+//       />
+//     ) as React.Component<CommandBar, {}>;
+//     document.body.appendChild(ReactDOM.findDOMNode(renderedContent));
+
+//     let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
+//     ReactTestUtils.Simulate.click(menuItem);
+
+//     expect(document.querySelector('.SubMenuClass')).to.exist;
+//   });
+
+//   it('keeps menu open after update if item is still present', () => {
+//     let renderContainer = document.createElement('div');
+//     document.body.appendChild(renderContainer);
+
+//     try {
+//       let items: IContextualMenuItem[] = [
+//         {
+//           name: 'TestText 1',
+//           key: 'TestKey1',
+//           subMenuProps: {
+//             items: [
+//               {
+//                 name: 'SubmenuText 1',
+//                 key: 'SubmenuKey1',
+//                 className: 'SubMenuClass'
+//               }
+//             ]
+//           }
+//         },
+//       ];
+
+//       let renderedContent = ReactDOM.render(
+//         <CommandBar
+//           items={ items }
+//         />,
+//         renderContainer
+//       ) as React.Component<CommandBar, {}>;
+
+//       let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
+//       ReactTestUtils.Simulate.click(menuItem);
+
+//       // Make sure the menu is open before the re-render
+//       expect(document.querySelector('.SubMenuClass')).to.exist;
+
+//       // Update the props, and re-render
+//       items.push({
+//         name: 'Test Key 2',
+//         key: 'TestKey2'
+//       });
+
+//       renderedContent = ReactDOM.render(
+//         <CommandBar
+//           items={ items }
+//         />,
+//         renderContainer
+//       ) as React.Component<CommandBar, {}>;
+
+//       // Make sure the menu is still open after the re-render
+//       expect(document.querySelector('.SubMenuClass')).to.exist;
+//     } finally {
+//       ReactDOM.unmountComponentAtNode(renderContainer);
+//       document.body.removeChild(renderContainer);
+//     }
+//   });
+
+//   it('closes menu after update if item is not longer present', () => {
+//     let renderContainer = document.createElement('div');
+//     document.body.appendChild(renderContainer);
+
+//     try {
+//       let items: IContextualMenuItem[] = [
+//         {
+//           name: 'TestText 1',
+//           key: 'TestKey1',
+//           subMenuProps: {
+//             items: [
+//               {
+//                 name: 'SubmenuText 1',
+//                 key: 'SubmenuKey1',
+//                 className: 'SubMenuClass'
+//               }
+//             ]
+//           }
+//         },
+//       ];
+
+//       let renderedContent = ReactDOM.render(
+//         <CommandBar
+//           items={ items }
+//         />,
+//         renderContainer
+//       ) as React.Component<CommandBar, {}>;
+
+//       let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
+//       ReactTestUtils.Simulate.click(menuItem);
+
+//       // Make sure the menu is open before the re-render
+//       expect(document.querySelector('.SubMenuClass')).to.exist;
+
+//       // Update the props, and re-render
+//       items = [{
+//         name: 'Test Key 2',
+//         key: 'TestKey2'
+//       }];
+
+//       renderedContent = ReactDOM.render(
+//         <CommandBar
+//           items={ items }
+//         />,
+//         renderContainer
+//       ) as React.Component<CommandBar, {}>;
+
+//       // Make sure the menu is still open after the re-render
+//       expect(document.querySelector('.SubMenuClass')).not.to.exist;
+//     } finally {
+//       ReactDOM.unmountComponentAtNode(renderContainer);
+//       document.body.removeChild(renderContainer);
+//     }
+//   });
+
+//   it('updates menu after update if item is still present', () => {
+//     let renderContainer = document.createElement('div');
+//     document.body.appendChild(renderContainer);
+
+//     try {
+//       let items: IContextualMenuItem[] = [
+//         {
+//           name: 'TestText 1',
+//           key: 'TestKey1',
+//           subMenuProps: {
+//             items: [
+//               {
+//                 name: 'SubmenuText 1',
+//                 key: 'SubmenuKey1',
+//                 className: 'SubMenuClass'
+//               }
+//             ]
+//           }
+//         },
+//       ];
+
+//       let renderedContent = ReactDOM.render(
+//         <CommandBar
+//           items={ items }
+//         />,
+//         renderContainer
+//       ) as React.Component<CommandBar, {}>;
+
+//       let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
+//       ReactTestUtils.Simulate.click(menuItem);
+
+//       // Make sure the menu is open before the re-render
+//       expect(document.querySelector('.SubMenuClass')).to.exist;
+
+//       // Update the props, and re-render
+//       items[0].subMenuProps!.items[0].className = 'SubMenuClassUpdate';
+
+//       renderedContent = ReactDOM.render(
+//         <CommandBar
+//           items={ items }
+//         />,
+//         renderContainer
+//       ) as React.Component<CommandBar, {}>;
+
+//       // Make sure the menu is still open after the re-render
+//       expect(document.querySelector('.SubMenuClass')).not.to.exist;
+//       expect(document.querySelector('.SubMenuClassUpdate')).to.exist;
+//     } finally {
+//       ReactDOM.unmountComponentAtNode(renderContainer);
+//       document.body.removeChild(renderContainer);
+//     }
+//   });
+// });
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.tsx b/packages/experiments/src/components/CommandBar/CommandBar.tsx
new file mode 100644
index 0000000000000..19705f7f6b126
--- /dev/null
+++ b/packages/experiments/src/components/CommandBar/CommandBar.tsx
@@ -0,0 +1,211 @@
+import * as React from 'react';
+import {
+  BaseComponent,
+  css,
+  getId,
+  autobind,
+  assign
+} from 'office-ui-fabric-react/lib/Utilities';
+import { ICommandBar, ICommandBarProps, ICommandBarItemProps } from './CommandBar.Props';
+import { CommandBarButton } from 'office-ui-fabric-react/lib/Button';
+import { OverflowSet } from 'office-ui-fabric-react/lib/OverflowSet';
+import { FocusZone } from 'office-ui-fabric-react/lib/FocusZone';
+import { ResizeGroup } from 'office-ui-fabric-react/lib/ResizeGroup';
+import { TooltipHost } from 'office-ui-fabric-react/lib/Tooltip';
+import * as stylesImport from './CommandBar.scss';
+const styles: any = stylesImport;
+
+export interface ICommandBarData {
+  /**
+   * Items being rendered in the primary region
+   */
+  primaryItems: ICommandBarItemProps[];
+  /**
+   * Items being rendered in the overflow
+   */
+  overflowItems: ICommandBarItemProps[];
+  /**
+   * Items being rendered on the far side
+   */
+  farItems: ICommandBarItemProps[] | undefined;
+  /**
+   * Length of original overflowItems to ensure that they are not moved into primary region on resize
+   */
+  minimumOverflowItems: number;
+  /**
+   * Unique string used to cache the width of the command bar
+   */
+  cacheKey: string;
+}
+
+const COMMANDBAR_HEIGHT = '40px';
+
+export class CommandBar extends BaseComponent<ICommandBarProps, any> implements ICommandBar {
+  public static defaultProps: ICommandBarProps = {
+    items: [],
+    overflowItems: [],
+    farItems: [],
+    elipisisIconProps: { iconName: 'More' }
+  };
+
+  public refs: {
+    overflowSet: OverflowSet
+  };
+
+  private _id: string;
+
+  constructor(props: ICommandBarProps) {
+    super(props);
+    this._id = getId('CommandBar');
+  }
+
+  public render() {
+    const {
+      className,
+      items,
+      overflowItems,
+      farItems,
+      elipisisAriaLabel,
+      elipisisIconProps,
+      buttonStyles,
+      onRenderButton = this._onRenderButton,
+      onReduceData = this._onReduceData,
+      onGrowData = this._onGrowData,
+    } = this.props;
+
+    let commandBardata: ICommandBarData = {
+      primaryItems: [...items],
+      overflowItems: [...overflowItems!],
+      minimumOverflowItems: [...overflowItems!].length, // for tracking
+      farItems,
+      cacheKey: '',
+    };
+
+    return (
+      <ResizeGroup
+        data={ commandBardata }
+        onReduceData={ onReduceData }
+        onGrowData={ onGrowData }
+        onRenderData={ (data: ICommandBarData) => {
+          return (
+            <div className={ css('ms-CommandBar', styles.root) }>
+
+              {/*Primary Items*/ }
+              <OverflowSet
+                ref='overflowSet'
+                className={ css(styles.primarySet) }
+                items={ data.primaryItems }
+                overflowItems={ data.overflowItems.length ? data.overflowItems : undefined }
+                onRenderItem={ this._onRenderItems }
+                onRenderOverflowButton={ (renderedOverflowItems: ICommandBarItemProps[]) => {
+                  return (
+                    this._onRenderButton({
+                      key: 'oveflowButton',
+                      styles: { ...buttonStyles, menuIcon: { fontSize: '17px' } },
+                      ariaLabel: elipisisAriaLabel,
+                      className: css(styles.overflowButton),
+                      menuProps: { items: renderedOverflowItems },
+                      menuIconProps: elipisisIconProps,
+                    })
+                  );
+                } }
+              />
+
+              {/*Secondary Items*/ }
+              <OverflowSet
+                className={ css(styles.secondarySet) }
+                items={ data.farItems }
+                onRenderItem={ this._onRenderItems }
+                onRenderOverflowButton={ () => null }
+              />
+            </div>
+          );
+        } }
+      />
+    );
+  }
+
+  public focus() {
+    this.refs.overflowSet.focus();
+  }
+
+  private computeCacheKey(primaryItems: ICommandBarItemProps[], farItems: ICommandBarItemProps[], overflow: boolean): string {
+    const returnKey = (acc: string, current: ICommandBarItemProps): string => {
+      const { cacheKey = current.key } = current;
+      return acc + cacheKey;
+    };
+
+    const primaryKey = primaryItems.reduce(returnKey, '');
+    const farKey = farItems.reduce(returnKey, '');
+    const overflowKey = overflow ? 'overflow' : '';
+
+    return [primaryKey, farKey, overflowKey].join(' ');
+  }
+
+  @autobind
+  private _onReduceData(data: ICommandBarData): ICommandBarData | undefined {
+    let { primaryItems, overflowItems, cacheKey, farItems } = data;
+    let movedItem = primaryItems[primaryItems.length - 1];
+
+    if (movedItem !== undefined) {
+      movedItem.renderedInOverflow = true;
+
+      overflowItems = [...overflowItems, movedItem];
+      primaryItems = primaryItems.slice(0, -1);
+      cacheKey = this.computeCacheKey(primaryItems, farItems!, !!overflowItems.length);
+
+      return { ...data, primaryItems, overflowItems, cacheKey };
+    }
+
+    return undefined;
+  }
+
+  @autobind
+  private _onGrowData(data: ICommandBarData): ICommandBarData | undefined {
+    let { primaryItems, overflowItems, cacheKey, minimumOverflowItems, farItems } = data;
+    let movedItem = overflowItems[overflowItems.length - 1];
+
+    // Make sure that moved item exists and is not one of the original overflow items
+    if (movedItem !== undefined && overflowItems.length > minimumOverflowItems) {
+      movedItem.renderedInOverflow = false;
+
+      overflowItems = overflowItems.slice(0, -1);
+      primaryItems = [...primaryItems, movedItem];
+      cacheKey = this.computeCacheKey(primaryItems, farItems!, !!overflowItems.length);
+
+      return { ...data, primaryItems, overflowItems, cacheKey };
+    }
+
+    return undefined;
+  }
+
+  @autobind
+  private _onRenderItems(item: ICommandBarItemProps) {
+    let { buttonStyles } = this.props;
+
+    if (item.onRender) { return item.onRender(item); }
+
+    const commandButtonProps: ICommandBarItemProps = {
+      ...item,
+      styles: { root: { height: COMMANDBAR_HEIGHT }, ...item.buttonStyles, ...buttonStyles },
+      className: css(styles.commandButton, item.className),
+      text: !item.iconOnly ? item.name : '',
+      menuProps: item.subMenuProps,
+    };
+
+    if (item.iconOnly && item.name !== undefined) {
+      return (
+        <TooltipHost content={ item.name } >
+          { this._onRenderButton(commandButtonProps) }
+        </TooltipHost>
+      );
+    }
+
+    return this._onRenderButton(commandButtonProps);
+  }
+
+  @autobind
+  private _onRenderButton(props: ICommandBarItemProps) {
+    return <CommandBarButton {...props as any} />;
+  }
+}
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.visualtest.ts b/packages/experiments/src/components/CommandBar/CommandBar.visualtest.ts
new file mode 100644
index 0000000000000..7b02816708ddf
--- /dev/null
+++ b/packages/experiments/src/components/CommandBar/CommandBar.visualtest.ts
@@ -0,0 +1,37 @@
+import { Casper } from 'office-ui-fabric-react/lib/visualtest/PhantomCssInterface';
+import { baseUrl } from 'office-ui-fabric-react/lib/common/VisualTest';
+import {
+  defaultScreenshot, mouseMoveScreenshot, mouseDownScreenshot,
+  mouseClickScreenshot, mouseSingleClickScreenshot, testRunner
+} from 'office-ui-fabric-react/lib/visualtest/RunVisualTest';
+import { IRunVisualTest } from 'office-ui-fabric-react/lib/visualtest/IRunVisualTest';
+declare var casper: Casper;
+let componentIds: IRunVisualTest[] = [];
+
+componentIds.push({
+  selector: '.' + 'ms-CommandBarItem-link',
+  imageSelector: '.' + 'CommandBar',
+  fileName: 'commandBar',
+  commands: [defaultScreenshot, mouseMoveScreenshot, mouseDownScreenshot, mouseClickScreenshot]
+});
+
+componentIds.push({
+  selector: '.' + 'ms-CommandBarItem-link',
+  imageSelector: '.' + 'CommandBar',
+  fileName: 'commandBarItem',
+  commands: [mouseSingleClickScreenshot],
+  childParams: {
+    selector: '.' + 'ms-ContextualMenu-list',
+    imageSelector: '.' + 'ms-ContextualMenu-Callout',
+    fileName: 'commandBarItem',
+    commands: [defaultScreenshot],
+  }
+});
+
+casper.
+  start(baseUrl + 'commandBar').
+  then(() => {
+    testRunner(componentIds);
+  });
+
+casper.run(() => { casper.test.done(); });
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/CommandBarPage.tsx b/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
new file mode 100644
index 0000000000000..4419cae34fc0b
--- /dev/null
+++ b/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
@@ -0,0 +1,80 @@
+import * as React from 'react';
+import {
+  ExampleCard,
+  IComponentDemoPageProps,
+  ComponentPage,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+import { items, overflowItems, farItems } from './examples/data';
+import { CommandBarBasicExample } from './examples/CommandBar.Basic.Example';
+
+const CommandBarBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx') as string;
+
+export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render() {
+    let cmdBarParamsTextAndIcons: any = { items, overflowItems, farItems };
+
+    return (
+      <ComponentPage
+        title='CommandBar'
+        componentName='CommandBarExample'
+        exampleCards={
+          <div>
+            <ExampleCard title='CommandBar with search box and overflowing menu items' code={ CommandBarBasicExampleCode }>
+              <CommandBarBasicExample {...cmdBarParamsTextAndIcons} />
+            </ExampleCard>
+          </div>
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/CommandBar/CommandBar.Props.ts'),
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts')
+            ] }
+          />
+        }
+        overview={
+          <div>
+            <p>
+              CommandBar is a surface that houses commands that operate on the content of the window, panel, or parent region it resides above. They are one of the most visible and recognizable ways to surface commands, and can be an intuitive method for interacting with content on the page. However, if overloaded or poorly organized, they can be difficult to use and hide valuable commands from your user. CommandBars can also display a search box for finding content; hold simple commands as well as menus; and display the status of ongoing actions.
+            </p>
+            <p>
+              Commands should be sorted in order of importance, from left to right or right to left depending on the culture. Secondarily, organize commands in logical groupings for easier recall. CommandBars work best when they display no more than 5-7 commands. This helps users quickly find your most valuable features. If you need to show more commands, consider using the overflow menu. If you need to render status, or viewing controls, these go on the right side of the CommandBar (or left side if in a left to right experience). Do not display more than 2-3 items on the right side as it will make the overall CommandBar difficult to parse.
+            </p>
+            <p>
+              All command items should have an icon and a label. Commands can render as labels only as well. In smaller widths, commands can just use icon only, but only for the most recognizable and frequently used commands. All other commands should go into an overflow where text labels can be shown.
+            </p>
+          </div>
+        }
+        bestPractices={
+          <div></div>
+        }
+        dos={
+          <div>
+            <ul>
+              <li>Sort commands in order of importance from left to right or right to left depending on the culture.</li>
+              <li>Organize commands into logical groupings.</li>
+              <li>Display no more than 5-7 commands.</li>
+              <li>Use overflow to house less frequently-used commands.</li>
+              <li>In small breakpoints, only have the most recognizable commands render as icon only.</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul>
+              <li>Fill the command bar completely from left to right.</li>
+              <li>Use icons only for commands in larger widths.</li>
+              <li>Display more than 2-3 items on the right side of the bar (or left side in left to right experiences).</li>
+            </ul>
+          </div>
+        }
+        related={
+          <a href='https://dev.office.com/fabric-js/Components/CommandBar/CommandBar.html'>Fabric JS</a>
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }>
+      </ComponentPage>
+    );
+  }
+
+}
diff --git a/packages/experiments/src/components/CommandBar/CommandBarPage.visualtest.tsx b/packages/experiments/src/components/CommandBar/CommandBarPage.visualtest.tsx
new file mode 100644
index 0000000000000..ded60b395750a
--- /dev/null
+++ b/packages/experiments/src/components/CommandBar/CommandBarPage.visualtest.tsx
@@ -0,0 +1,38 @@
+import { CommandBar } from './index';
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+export default class CommandBarVPage extends React.Component<any, any> {
+  public render() {
+    return <div style={ { width: '600px' } }>
+      <CommandBar
+        className='CommandBar'
+        items={
+          [
+            {
+              key: 'new',
+              name: 'New',
+              icon: 'Add',
+              onClick: () => { return; },
+              items: [
+                {
+                  key: 'emailMessage',
+                  name: 'Email message',
+                  icon: 'Mail'
+                },
+                {
+                  key: 'calendarEvent',
+                  name: 'Calendar event',
+                  icon: 'Calendar'
+                }
+              ]
+            },
+            {
+              key: 'upload',
+              name: 'Upload',
+              icon: 'Upload'
+            }] }
+      />
+    </div>;
+  }
+}
diff --git a/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx b/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
new file mode 100644
index 0000000000000..3be9125083feb
--- /dev/null
+++ b/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
@@ -0,0 +1,30 @@
+import * as React from 'react';
+import { assign } from 'office-ui-fabric-react/lib/Utilities';
+import { CommandBar } from '../CommandBar';
+import { Toggle } from 'office-ui-fabric-react/lib/Toggle';
+
+export class CommandBarBasicExample extends React.Component<any, any> {
+
+  constructor(props: any) {
+    super(props);
+    this.state = {
+      areNamesVisible: true,
+      areIconsVisible: true
+    };
+  }
+
+  public render() {
+    let { items, overflowItems, farItems } = this.props;
+
+    return (
+      <div>
+        <CommandBar
+          elipisisAriaLabel='More options'
+          items={ items }
+          overflowItems={ overflowItems }
+          farItems={ farItems }
+        />
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/examples/data.ts b/packages/experiments/src/components/CommandBar/examples/data.ts
new file mode 100644
index 0000000000000..0d31ff8ebe6c7
--- /dev/null
+++ b/packages/experiments/src/components/CommandBar/examples/data.ts
@@ -0,0 +1,109 @@
+export const items = [
+  {
+    key: 'newItem',
+    name: 'New',
+    cacheKey: 'myCacheKey',
+    iconProps: {
+      iconName: 'Add',
+    },
+    ariaLabel: 'New. Use left and right arrow keys to navigate',
+    ['data-automation-id']: 'newItemMenu',
+    subMenuProps: {
+      items: [
+        {
+          key: 'emailMessage',
+          name: 'Email message',
+          iconProps: {
+            iconName: 'Mail',
+          },
+          ['data-automation-id']: 'newEmailButton'
+        },
+        {
+          key: 'calendarEvent',
+          name: 'Calendar event',
+          iconProps: {
+            iconName: 'Calendar'
+          },
+        }
+      ],
+    },
+  },
+  {
+    key: 'upload',
+    name: 'Upload',
+    iconProps: {
+      iconName: 'Upload',
+    },
+    href: 'https://dev.office.com/fabric',
+    ['data-automation-id']: 'uploadButton'
+  },
+  {
+    key: 'share',
+    name: 'Share',
+    iconProps: {
+      iconName: 'Share',
+    },
+    onClick: () => { return; }
+  },
+  {
+    key: 'download',
+    name: 'Download',
+    iconProps: {
+      iconName: 'Download',
+    },
+    onClick: () => { return; }
+  }
+];
+
+export const overflowItems = [
+  {
+    key: 'move',
+    name: 'Move to...',
+    iconProps: {
+      iconName: 'MoveToFolder'
+    },
+  },
+  {
+    key: 'copy',
+    name: 'Copy to...',
+    iconProps: {
+      iconName: 'Copy'
+    },
+  },
+  {
+    key: 'rename',
+    name: 'Rename...',
+    iconProps: {
+      iconName: 'Edit'
+    },
+  }
+];
+
+export const farItems = [
+  {
+    key: 'sort',
+    name: 'Sort',
+    iconProps: {
+      iconName: 'SortLines',
+    },
+    onClick: () => { return; }
+  },
+  {
+    key: 'tile',
+    name: 'Grid view',
+    iconProps: {
+      iconName: 'Tiles',
+    },
+    iconOnly: true,
+    onClick: () => { return; }
+  },
+  {
+    key: 'info',
+    name: 'Info',
+    iconProps: {
+      iconName: 'Info',
+    },
+    iconOnly: true,
+    onClick: () => { return; }
+  }
+];
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/index.ts b/packages/experiments/src/components/CommandBar/index.ts
new file mode 100644
index 0000000000000..455b306d96bae
--- /dev/null
+++ b/packages/experiments/src/components/CommandBar/index.ts
@@ -0,0 +1,2 @@
+export * from './CommandBar';
+export * from './CommandBar.Props';
diff --git a/packages/experiments/src/components/Link/Link.Props.ts b/packages/experiments/src/components/Link/Link.Props.ts
deleted file mode 100644
index d72ae7b73816b..0000000000000
--- a/packages/experiments/src/components/Link/Link.Props.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-/* tslint:enable:no-unused-variable */
-import { Link } from './Link';
-
-export interface ILink {
-  /** Sets focus to the link. */
-  focus(): void;
-}
-
-export interface ILinkProps extends React.AllHTMLAttributes<HTMLAnchorElement | HTMLButtonElement | HTMLElement | Link> {
-  /**
-   * Optional callback to access the ILink interface. Use this instead of ref for accessing
-   * the public methods and properties of the component.
-   */
-  componentRef?: (component: ILink) => void;
-
-  /**
-   * Whether the link is disabled
-   */
-  disabled?: boolean;
-
-}
diff --git a/packages/experiments/src/components/Link/Link.scss b/packages/experiments/src/components/Link/Link.scss
deleted file mode 100644
index 00ffe5e1a7722..0000000000000
--- a/packages/experiments/src/components/Link/Link.scss
+++ /dev/null
@@ -1,44 +0,0 @@
-@import '~office-ui-fabric-react/dist/sass/References';
-
-// Element: ms-Link root component
-.root {
-  color: $ms-color-themePrimary;
-  margin: 0;
-  overflow: inherit;
-  padding: 0;
-  text-overflow: inherit;
-}
-
-// State: The button is not disabled.
-.isEnabled {
-  &:hover,
-  &:focus {
-    color: $ms-color-themeDarker;
-  }
-
-  &:active {
-    color: $ms-color-themePrimary;
-  }
-}
-
-// State: The button is disabled.
-.isDisabled {
-  color: $ms-color-neutralTertiary;
-  pointer-events: none;
-  cursor: default;
-}
-
-
-// Link implemented as a button.
-button.root {
-  background: none;
-  border: none;
-  cursor: pointer;
-  display: inline;
-  font-size: inherit; // Ensure that we inherit font size, rather than the browser's default.
-}
-
-// Link implemented as an anchor.
-a.root {
-  text-decoration: none;
-}
diff --git a/packages/experiments/src/components/Link/Link.test.tsx b/packages/experiments/src/components/Link/Link.test.tsx
deleted file mode 100644
index 3fbe90a4f88e0..0000000000000
--- a/packages/experiments/src/components/Link/Link.test.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-/* tslint:enable:no-unused-variable */
-
-import * as ReactDOM from 'react-dom';
-import * as ReactTestUtils from 'react-addons-test-utils';
-
-let { expect } = chai;
-
-import { Link } from './Link';
-
-describe('Link', () => {
-
-  it('renders a link', () => {
-    let component = ReactTestUtils.renderIntoDocument(
-      <Link href='#'>test</Link >
-    );
-    let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
-
-    expect(renderedDOM.textContent).to.equal('test');
-  });
-
-});
diff --git a/packages/experiments/src/components/Link/Link.tsx b/packages/experiments/src/components/Link/Link.tsx
deleted file mode 100644
index d6986fbf328d1..0000000000000
--- a/packages/experiments/src/components/Link/Link.tsx
+++ /dev/null
@@ -1,75 +0,0 @@
-import * as React from 'react';
-import {
-  BaseComponent,
-  anchorProperties,
-  autobind,
-  buttonProperties,
-  css,
-  getNativeProps
-} from 'office-ui-fabric-react/lib/Utilities';
-import { ILink, ILinkProps } from './Link.Props';
-import * as stylesImport from './Link.scss';
-const styles: any = stylesImport;
-
-interface IMyScreen extends Screen {
-  left: number;
-  top: number;
-}
-
-declare var screen: IMyScreen;
-
-export class Link extends BaseComponent<ILinkProps, any> implements ILink {
-  private _link: HTMLElement;
-
-  public render() {
-    let { disabled, children, className, href } = this.props;
-
-    return (
-      href ? (
-        <a
-          { ...getNativeProps(this.props, anchorProperties) }
-          className={ css(
-            'ms-Link',
-            styles.root,
-            className,
-            disabled && ('is-disabled ' + styles.isDisabled),
-            !disabled && styles.isEnabled
-          ) }
-          onClick={ this._onClick }
-          ref={ this._resolveRef('_link') }
-          target={ this.props.target }
-        >
-          { children }
-        </a>
-      ) : (
-          <button
-            { ...getNativeProps(this.props, buttonProperties) }
-            className={ css(
-              'ms-Link',
-              styles.root,
-              className,
-              disabled && ('is-disabled ' + styles.isDisabled)
-            ) }
-            onClick={ this._onClick }
-            ref={ this._resolveRef('_link') }
-          >
-            { children }
-          </button>
-        ));
-  }
-
-  public focus() {
-    if (this._link) {
-      this._link.focus();
-    }
-  }
-
-  @autobind
-  private _onClick(ev: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>) {
-    let { onClick } = this.props;
-
-    if (onClick) {
-      onClick(ev);
-    }
-  }
-}
diff --git a/packages/experiments/src/components/Link/LinkPage.tsx b/packages/experiments/src/components/Link/LinkPage.tsx
deleted file mode 100644
index 1908aced7c208..0000000000000
--- a/packages/experiments/src/components/Link/LinkPage.tsx
+++ /dev/null
@@ -1,71 +0,0 @@
-import * as React from 'react';
-import {
-  ExampleCard,
-  IComponentDemoPageProps,
-  ComponentPage,
-  PropertiesTableSet
-} from '@uifabric/example-app-base';
-import { LinkBasicExample } from './examples/Link.Basic.Example';
-
-let LinkBasicExampleCode = require('!raw-loader!experiments/src/components/Link/examples/Link.Basic.Example.tsx') as string;
-
-export class LinkPage extends React.Component<IComponentDemoPageProps, {}> {
-  public render() {
-    return (
-      <ComponentPage
-        title='Link'
-        componentName='LinkExample'
-        exampleCards={
-          <ExampleCard title='Link' code={ LinkBasicExampleCode }>
-            <LinkBasicExample />
-          </ExampleCard>
-        }
-        propertiesTables={
-          <PropertiesTableSet
-            sources={ [
-              require<string>('!raw-loader!experiments/src/components/Link/Link.Props.ts')
-            ] }
-          />
-        }
-        overview={
-          <div>
-            <p>
-              With a Link, users can navigate to another page, window, or Help topic; display a definition; initiate a command; or choose an option. A Link indicates that it can be clicked, typically by being displayed using the visited or unvisited link system colors. Traditionally, Links are underlined as well, but that approach is often unnecessary and falling out of favor to reduce visual clutter.
-            </p>
-
-            <p>
-              A Link is the lightest weight clickable control, and is often used to reduce the visual complexity of a design.
-            </p>
-          </div>
-        }
-        bestPractices={
-          <div></div>
-        }
-        dos={
-          <div>
-            <ul>
-              <li>Use to navigate to another page, window, or help topic; display a definition; initiate a command; or choose an option.</li>
-              <li>Make Links discoverable by visual inspection alone. Users shouldn't have to interact with your program to find links.</li>
-              <li>Use Links that give specific descriptive information about the result of clicking on the link, using as much text as necessary. Users should be able to accurately predict the result of a link from its link text and optional Tooltip.</li>
-              <li>Use text that suggests clicking, such as a command starting with an imperative verb like "Show", "Print", "Copy", or "Delete".</li>
-            </ul>
-          </div>
-        }
-        donts={
-          <div>
-            <ul>
-              <li>
-                Use if the action is destructive or irreversible. Because users associate links with navigation (and the ability to back out), Links aren't appropriate for commands with significant consequences.
-              </li>
-            </ul>
-          </div>
-        }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/Link/Link.html'>Fabric JS</a>
-        }
-        isHeaderVisible={ this.props.isHeaderVisible }>
-      </ComponentPage>
-    );
-  }
-
-}
diff --git a/packages/experiments/src/components/Link/examples/Link.Basic.Example.tsx b/packages/experiments/src/components/Link/examples/Link.Basic.Example.tsx
deleted file mode 100644
index eb42503fcd2eb..0000000000000
--- a/packages/experiments/src/components/Link/examples/Link.Basic.Example.tsx
+++ /dev/null
@@ -1,18 +0,0 @@
-import * as React from 'react';
-import { Link } from 'office-ui-fabric-react/lib/Link';
-
-export class LinkBasicExample extends React.Component<any, any> {
-  public render() {
-    return (
-      <div>
-        <span>When a link has an href, </span>
-        <Link href='http://dev.office.com/fabric/components/link'>it renders as an anchor tag.</Link>
-        <span> Without an href, </span>
-        <Link>the link is rendered as a button</Link>.
-        <span> You can also use the disabled attribute to create a </span>
-        <Link disabled={ true } href='http://dev.office.com/fabric/components/link'>disabled link</Link>.
-      </div>
-    );
-  }
-
-}
diff --git a/packages/experiments/src/components/Link/index.ts b/packages/experiments/src/components/Link/index.ts
deleted file mode 100644
index ac3d784d97918..0000000000000
--- a/packages/experiments/src/components/Link/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export * from './Link';
-export * from './Link.Props';
diff --git a/packages/experiments/src/demo/AppDefinition.tsx b/packages/experiments/src/demo/AppDefinition.tsx
index ed73b0f4509d8..80ce68875926d 100644
--- a/packages/experiments/src/demo/AppDefinition.tsx
+++ b/packages/experiments/src/demo/AppDefinition.tsx
@@ -10,10 +10,10 @@ export const AppDefinition: IAppDefinition = {
     {
       links: [
         {
-          component: require<any>('../components/Link/LinkPage').LinkPage,
-          key: 'Link',
-          name: 'Link',
-          url: '#/examples/link'
+          component: require<any>('../components/CommandBar/CommandBarPage').CommandBarPage,
+          key: 'CommandBar',
+          name: 'CommandBar',
+          url: '#/examples/commandbar'
         },
         {
           component: require<any>('../components/Tile/TilePage').TilePage,
diff --git a/packages/experiments/src/index.ts b/packages/experiments/src/index.ts
index a8d612800ca7d..b20ef73f0126c 100644
--- a/packages/experiments/src/index.ts
+++ b/packages/experiments/src/index.ts
@@ -1,6 +1,2 @@
-/**
- * WARNING: This entry should NOT be imported for production purposes. This entry forces every control to be
- * parsed and available at load time, which is not necessary for most cases.
- */
-
-export * from './Link';
\ No newline at end of file
+export * from 'office-ui-fabric-react';
+export { CommandBar as ExperimentCommandBar } from './CommandBar';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/gulpfile.js b/packages/office-ui-fabric-react/gulpfile.js
index ae519f22e455b..ef33ec3d05515 100644
--- a/packages/office-ui-fabric-react/gulpfile.js
+++ b/packages/office-ui-fabric-react/gulpfile.js
@@ -72,13 +72,13 @@ build.sass.setConfig({
 build.karma.isEnabled = () => true;
 
 // Disable unnecessary subtasks.
-build.preCopy.isEnabled = () => false;
+build.postCopy.isEnabled = () => true;
 
 // Until typings work.
 //build.apiExtractor.isEnabled = () => false;
 
 // Copy fabric-core to dist to be published with fabric-react.
-build.postCopy.setConfig({
+build.preCopy.setConfig({
   shouldFlatten: false,
   copyTo: {
     [path.join(distFolder, 'sass')]: [
diff --git a/packages/office-ui-fabric-react/src/common/_common.scss b/packages/office-ui-fabric-react/src/common/_common.scss
index a135ab74ac2e3..823b00129b134 100644
--- a/packages/office-ui-fabric-react/src/common/_common.scss
+++ b/packages/office-ui-fabric-react/src/common/_common.scss
@@ -1,4 +1,4 @@
-@import '~office-ui-fabric-core/dist/sass/References';
+@import '../../dist/sass/References';
 @import './i18n';
 @import './themeOverrides';
 @import './focusBorder';
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.styles.ts
similarity index 72%
rename from packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
rename to packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.styles.ts
index a49b4c2ed6a98..74edbe405ea5a 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.styles.ts
@@ -16,11 +16,13 @@ const DEFAULT_PADDING = '0 4px';
 
 export const getStyles = memoizeFunction((
   theme: ITheme,
-  customStyles?: IButtonStyles
+  customStyles?: IButtonStyles,
+  focusInset?: string,
+  focusColor?: string
 ): IButtonStyles => {
   let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
   let splitButtonStyles: IButtonStyles = getSplitButtonStyles(theme);
-  let commandButtonStyles: IButtonStyles = {
+  let actionButtonStyles: IButtonStyles = {
     root: {
       borderWidth: '0',
       padding: DEFAULT_PADDING,
@@ -30,28 +32,39 @@ export const getStyles = memoizeFunction((
     },
 
     rootHovered: {
-      color: theme.palette.themeDarker
+      color: theme.palette.themePrimary,
+      icon: {
+        color: theme.palette.themePrimary
+      }
+    },
+
+    iconHovered: {
+      color: theme.palette.themePrimary
     },
 
     rootPressed: {
+      color: theme.palette.black,
+    },
+
+    rootExpanded: {
       color: theme.palette.themePrimary
     },
 
+    iconPressed: {
+      color: theme.palette.themeDarker
+    },
+
     rootDisabled: {
       color: theme.palette.neutralTertiary,
       backgroundColor: 'transparent'
     },
 
     rootChecked: {
-      backgroundColor: theme.palette.neutralTertiaryAlt,
-    },
-
-    rootExpanded: {
-      color: theme.palette.themePrimary
+      color: theme.palette.black,
     },
 
-    rootCheckedHovered: {
-      backgroundColor: theme.palette.neutralLight
+    iconChecked: {
+      color: theme.palette.themeDarker
     },
 
     flexContainer: {
@@ -59,7 +72,7 @@ export const getStyles = memoizeFunction((
     },
 
     icon: {
-      color: theme.palette.themePrimary
+      color: theme.palette.themeDarkAlt
     },
 
     iconDisabled: {
@@ -72,5 +85,5 @@ export const getStyles = memoizeFunction((
 
   };
 
-  return mergeStyleSets(baseButtonStyles, commandButtonStyles, splitButtonStyles, customStyles)!;
-});
+  return mergeStyleSets(baseButtonStyles, actionButtonStyles, customStyles)!;
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx b/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx
new file mode 100644
index 0000000000000..65b85a0cf0188
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx
@@ -0,0 +1,27 @@
+import * as React from 'react';
+import { BaseButton } from '../BaseButton';
+import { BaseComponent, customizable, nullRender } from '../../../Utilities';
+import { IButtonProps } from '../Button.Props';
+import { getStyles } from './ActionButton.styles';
+
+@customizable(['theme'])
+export class ActionButton extends BaseComponent<IButtonProps, {}> {
+
+  /**
+   * Tell BaseComponent to bypass resolution of componentRef.
+   */
+  protected _shouldUpdateComponentRef = false;
+
+  public render() {
+    let { styles, theme } = this.props;
+
+    return (
+      <BaseButton
+        { ...this.props }
+        variantClassName='ms-Button--action ms-Button--command'
+        styles={ getStyles(theme!, styles) }
+        onRenderDescription={ nullRender }
+      />
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
index f300116035350..3170717efe779 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
@@ -41,6 +41,7 @@ export const getClassNames = memoizeFunction((
       ],
       !disabled && !expanded && {
         ':hover': styles.rootHovered,
+        ':hover .ms-Button-icon': styles.iconHovered,
         ':hover .ms-Button-description': styles.descriptionHovered,
         ':focus': styles.rootFocused,
         ':active': styles.rootPressed,
@@ -64,6 +65,7 @@ export const getClassNames = memoizeFunction((
       'ms-Button-icon',
       iconClassName,
       styles.icon,
+      expanded && styles.iconExpanded,
       checked && styles.iconChecked,
       disabled && styles.iconDisabled,
     ) as string,
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
index 91a83f0a282e0..1007020062649 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
@@ -26,6 +26,11 @@ export interface IButtonProps extends React.AllHTMLAttributes<HTMLAnchorElement
    */
   href?: string;
 
+  /**
+   * Unique id to identify the item. Typically a duplicate of key value.
+   */
+  uniqueId?: string | number;
+
   /**
    * Whether the button is disabled
    */
@@ -162,6 +167,11 @@ export interface IButtonProps extends React.AllHTMLAttributes<HTMLAnchorElement
    * @deprecated
    */
   toggled?: boolean;
+
+  /**
+ * Any custom data the developer wishes to associate with the menu item.
+ */
+  data?: any;
 }
 
 export enum ElementType {
@@ -242,6 +252,21 @@ export interface IButtonStyles {
    */
   icon?: IStyle;
 
+  /**
+   * Style for the icon on the near side of the label on hover.
+   */
+  iconHovered?: IStyle;
+
+  /**
+   * Style for the icon on the near side of the label when pressed.
+   */
+  iconPressed?: IStyle;
+
+  /**
+   * Style for the icon on the near side of the label when expanded.
+   */
+  iconExpanded?: IStyle;
+
   /**
    * Style override for the icon when the button is disabled.
    */
@@ -356,4 +381,4 @@ export interface IButtonStyles {
    * Style override for the SplitButton FlexContainer.
    */
   splitButtonFlexContainer?: IStyle;
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
index 9330650c286c2..d42fab182f936 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
@@ -10,7 +10,8 @@ import { ButtonDefaultExample } from './examples/Button.Default.Example';
 import { ButtonContextualMenuExample } from './examples/Button.ContextualMenu.Example';
 import { ButtonPrimaryExample } from './examples/Button.Primary.Example';
 import { ButtonCompoundExample } from './examples/Button.Compound.Example';
-import { ButtonCommandExample } from './examples/Button.Command.Example';
+import { ButtonActionExample } from './examples/Button.Action.Example';
+import { ButtonCommandBarExample } from './examples/Button.CommandBar.Example';
 import { ButtonIconExample } from './examples/Button.Icon.Example';
 import { ButtonAnchorExample } from './examples/Button.Anchor.Example';
 import { ButtonScreenReaderExample } from './examples/Button.ScreenReader.Example';
@@ -22,7 +23,8 @@ import { Link } from '../../Link';
 const ButtonDefaultExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx') as string;
 const ButtonPrimaryExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx') as string;
 const ButtonCompoundExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx') as string;
-const ButtonCommandExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Command.Example.tsx') as string;
+const ButtonActionExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx') as string;
+const ButtonCommandBarExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.CommandBar.Example.tsx') as string;
 const ButtonIconExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx') as string;
 const ButtonAnchorExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx') as string;
 const ButtonScreenReaderExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx') as string;
@@ -63,8 +65,11 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
             <ExampleCard title='Compound Button' code={ ButtonCompoundExampleCode }>
               <ButtonCompoundExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
-            <ExampleCard title='Command Button' code={ ButtonCommandExampleCode }>
-              <ButtonCommandExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
+            <ExampleCard title='Command Bar Button' code={ ButtonCommandBarExampleCode }>
+              <ButtonCommandBarExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
+            </ExampleCard>
+            <ExampleCard title='Action Button' code={ ButtonActionExampleCode }>
+              <ButtonActionExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
             <ExampleCard title='Icon Button' code={ ButtonIconExampleCode }>
               <ButtonIconExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts
new file mode 100644
index 0000000000000..07eb4282f1baf
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts
@@ -0,0 +1,82 @@
+import { IButtonStyles } from '../Button.Props';
+import {
+  ITheme,
+  mergeStyleSets
+} from '../../../Styling';
+import { memoizeFunction } from '../../../Utilities';
+import {
+  getStyles as getBaseButtonStyles
+} from '../BaseButton.styles';
+import {
+  getStyles as getSplitButtonStyles
+} from '../SplitButton/SplitButton.styles';
+
+export const getStyles = memoizeFunction((
+  theme: ITheme,
+  customStyles?: IButtonStyles,
+  focusInset?: string,
+  focusColor?: string
+): IButtonStyles => {
+  let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
+  let baseSplitButtonStyles: IButtonStyles = getSplitButtonStyles(theme);
+  let commandButtonStyles: IButtonStyles = {
+    root: {
+      minWidth: '40px',
+      backgroundColor: theme.palette.neutralLighter,
+      color: theme.palette.neutralPrimary,
+      padding: '0 4px'
+    },
+
+    rootHovered: {
+      backgroundColor: theme.palette.neutralLight,
+      color: theme.palette.neutralDark,
+      icon: {
+        color: theme.palette.themeDark
+      }
+    },
+
+    rootPressed: {
+      backgroundColor: theme.palette.neutralQuaternaryAlt,
+      color: theme.palette.black,
+      icon: {
+        color: theme.palette.themeDark
+      }
+    },
+
+    rootChecked: {
+      backgroundColor: theme.palette.neutralQuaternaryAlt,
+      color: theme.palette.black,
+      icon: {
+        color: theme.palette.themeDarker
+      }
+    },
+
+    rootExpanded: {
+      backgroundColor: theme.palette.neutralQuaternaryAlt,
+      color: theme.palette.black,
+      icon: {
+        color: theme.palette.themeDark
+      }
+    },
+
+    rootCheckedHovered: {
+      backgroundColor: theme.palette.neutralQuaternary,
+      color: theme.palette.black,
+    },
+
+    label: {
+      fontWeight: 'normal' // theme.fontWeights.semibold,
+    },
+
+    icon: {
+      color: theme.palette.themeDarkAlt
+    },
+
+    menuIcon: {
+      color: theme.palette.neutralSecondary
+    }
+
+  };
+
+  return mergeStyleSets(baseButtonStyles, commandButtonStyles, baseSplitButtonStyles, customStyles)!;
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx
new file mode 100644
index 0000000000000..50f9be9d8e756
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx
@@ -0,0 +1,27 @@
+import * as React from 'react';
+import { BaseButton } from '../BaseButton';
+import { BaseComponent, customizable, nullRender } from '../../../Utilities';
+import { ThemeSettingName } from '../../../Styling';
+import { IButtonProps } from '../Button.Props';
+import { getStyles } from './CommandBarButton.styles';
+
+@customizable([ThemeSettingName])
+export class CommandBarButton extends BaseComponent<IButtonProps, {}> {
+  /**
+   * Tell BaseComponent to bypass resolution of componentRef.
+   */
+  protected _shouldUpdateComponentRef = false;
+
+  public render() {
+    let { styles, theme } = this.props;
+
+    return (
+      <BaseButton
+        { ...this.props }
+        variantClassName='ms-Button--commandBar'
+        styles={ getStyles(theme!, styles) }
+        onRenderDescription={ nullRender }
+      />
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx
index 247f3aa0a2d96..06a1e9d40fec8 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx
@@ -1,28 +1,4 @@
 import * as React from 'react';
-import { BaseButton } from '../BaseButton';
-import { BaseComponent, customizable, nullRender } from '../../../Utilities';
-import { ThemeSettingName } from '../../../Styling';
-import { IButtonProps } from '../Button.Props';
-import { getStyles } from './CommandButton.styles';
+import { ActionButton } from '../ActionButton/ActionButton';
 
-@customizable([ThemeSettingName])
-export class CommandButton extends BaseComponent<IButtonProps, {}> {
-
-  /**
-   * Tell BaseComponent to bypass resolution of componentRef.
-   */
-  protected _shouldUpdateComponentRef = false;
-
-  public render() {
-    let { styles, theme } = this.props;
-
-    return (
-      <BaseButton
-        { ...this.props }
-        variantClassName='ms-Button--command'
-        styles={ getStyles(theme!, styles) }
-        onRenderDescription={ nullRender }
-      />
-    );
-  }
-}
+export const CommandButton = ActionButton;
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx
new file mode 100644
index 0000000000000..1ed3f196bc95d
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx
@@ -0,0 +1,31 @@
+import * as React from 'react';
+import {
+  ActionButton,
+  IButtonProps
+} from 'office-ui-fabric-react/lib/Button';
+import {
+  Label
+} from 'office-ui-fabric-react/lib/Label';
+
+export class ButtonActionExample extends React.Component<IButtonProps, any> {
+  public constructor() {
+    super();
+  }
+
+  public render() {
+    let { disabled, checked } = this.props;
+
+    return (
+      <div className='ms-BasicButtonsExample'>
+        <ActionButton
+          data-automation-id='test'
+          iconProps={ { iconName: 'AddFriend' } }
+          disabled={ disabled }
+          checked={ checked }
+        >
+          Create account
+        </ActionButton>
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.CommandBar.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.CommandBar.Example.tsx
new file mode 100644
index 0000000000000..3ef494a34669f
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.CommandBar.Example.tsx
@@ -0,0 +1,43 @@
+import * as React from 'react';
+import { CommandBarButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
+
+export class ButtonCommandBarExample extends React.Component<IButtonProps, {}> {
+  public render() {
+    let { disabled, checked } = this.props;
+
+    return (
+      <div>
+        <div style={ { display: 'flex', alignItems: 'stretch', height: '40px' } }>
+          <CommandBarButton
+            data-automation-id='test'
+            disabled={ disabled }
+            checked={ checked }
+            iconProps={ { iconName: 'Add' } }
+            text='Create account'
+            menuProps={ {
+              items: [
+                {
+                  key: 'emailMessage',
+                  name: 'Email message',
+                  icon: 'Mail'
+                },
+                {
+                  key: 'calendarEvent',
+                  name: 'Calendar event',
+                  icon: 'Calendar'
+                }
+              ]
+            } }
+          />
+          <CommandBarButton
+            data-automation-id='test2'
+            disabled={ disabled }
+            checked={ checked }
+            iconProps={ { iconName: 'Mail' } }
+            text='Send Mail'
+          />
+        </div>
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/index.ts b/packages/office-ui-fabric-react/src/components/Button/index.ts
index 68f067b3ebbbb..56972890a0374 100644
--- a/packages/office-ui-fabric-react/src/components/Button/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/index.ts
@@ -1,6 +1,8 @@
 export * from './BaseButton';
 export * from './Button.Props';
 export * from './Button';
+export * from './ActionButton/ActionButton';
+export * from './CommandBarButton/CommandBarButton';
 export * from './CommandButton/CommandButton';
 export * from './CompoundButton/CompoundButton';
 export * from './DefaultButton/DefaultButton';

From 2669e2f9e147a34134b072c36e95ded7d91d2fae Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 18 Aug 2017 08:33:50 -0700
Subject: [PATCH 0441/1641] Update users-adsurang-14aug_2017-08-15-05-25.json

---
 .../users-adsurang-14aug_2017-08-15-05-25.json                | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/common/changes/office-ui-fabric-react/users-adsurang-14aug_2017-08-15-05-25.json b/common/changes/office-ui-fabric-react/users-adsurang-14aug_2017-08-15-05-25.json
index df4fc3036cad9..188e76fde7796 100644
--- a/common/changes/office-ui-fabric-react/users-adsurang-14aug_2017-08-15-05-25.json
+++ b/common/changes/office-ui-fabric-react/users-adsurang-14aug_2017-08-15-05-25.json
@@ -2,12 +2,12 @@
   "changes": [
     {
       "packageName": "office-ui-fabric-react",
-      "comment": "CommandBar: adding `aria-expanded` attribute to overflow menu."
+      "comment": "CommandBar: adding `aria-expanded` attribute to overflow menu.",
       "type": "patch"
     },
     {
       "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: Making expand/collapse chevron in grouped list headers keyboard accessible."
+      "comment": "DetailsList: Making expand/collapse chevron in grouped list headers keyboard accessible.",
       "type": "patch"
     }
   ],

From c1916782dbcb6f6283b052f58e006790b8c0eab3 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 18 Aug 2017 09:14:35 -0700
Subject: [PATCH 0442/1641] Re-enabling commandbar tests.

---
 packages/experiments/gulpfile.js              |   3 -
 packages/experiments/src/common/tests.js      |   3 -
 .../components/CommandBar/CommandBar.test.tsx | 408 +++++++++---------
 3 files changed, 204 insertions(+), 210 deletions(-)

diff --git a/packages/experiments/gulpfile.js b/packages/experiments/gulpfile.js
index 0f36845be4ca6..dffac944e5699 100644
--- a/packages/experiments/gulpfile.js
+++ b/packages/experiments/gulpfile.js
@@ -40,9 +40,6 @@ build.sass.setConfig({
   moduleExportName: ''
 });
 
-// Use Karma Tests - Disable during develoment if prefered
-build.karma.isEnabled = () => true;
-
 // Disable unnecessary subtasks.
 build.preCopy.isEnabled = () => false;
 
diff --git a/packages/experiments/src/common/tests.js b/packages/experiments/src/common/tests.js
index 3a716c9dd52da..31923f7c58879 100644
--- a/packages/experiments/src/common/tests.js
+++ b/packages/experiments/src/common/tests.js
@@ -1,8 +1,5 @@
 'use strict';
 
-// Polyfills
-require('es6-weak-map/implement');
-
 /**
  * This is a test entry point to help karma-webpack find all tests in the project.
  **/
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.test.tsx b/packages/experiments/src/components/CommandBar/CommandBar.test.tsx
index b54e800654fab..474ef98a65dbb 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.test.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBar.test.tsx
@@ -10,207 +10,207 @@ let { expect } = chai;
 import { CommandBar } from './CommandBar';
 import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
 
-// describe('CommandBar', () => {
-
-//   afterEach(() => {
-//     for (let i = 0; i < document.body.children.length; i++) {
-//       if (document.body.children[i].tagName === 'DIV') {
-//         document.body.removeChild(document.body.children[i]);
-//         i--;
-//       }
-//     }
-//   });
-
-//   it.only('opens a menu with IContextualMenuItem.subMenuProps.items property', () => {
-//     const items: IContextualMenuItem[] = [
-//       {
-//         name: 'TestText 1',
-//         key: 'TestKey1',
-//         subMenuProps: {
-//           items: [
-//             {
-//               name: 'SubmenuText 1',
-//               key: 'SubmenuKey1',
-//               className: 'SubMenuClass'
-//             }
-//           ]
-//         }
-//       },
-//     ];
-
-//     let renderedContent = ReactTestUtils.renderIntoDocument<CommandBar>(
-//       <CommandBar
-//         items={ items }
-//       />
-//     ) as React.Component<CommandBar, {}>;
-//     document.body.appendChild(ReactDOM.findDOMNode(renderedContent));
-
-//     let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
-//     ReactTestUtils.Simulate.click(menuItem);
-
-//     expect(document.querySelector('.SubMenuClass')).to.exist;
-//   });
-
-//   it('keeps menu open after update if item is still present', () => {
-//     let renderContainer = document.createElement('div');
-//     document.body.appendChild(renderContainer);
-
-//     try {
-//       let items: IContextualMenuItem[] = [
-//         {
-//           name: 'TestText 1',
-//           key: 'TestKey1',
-//           subMenuProps: {
-//             items: [
-//               {
-//                 name: 'SubmenuText 1',
-//                 key: 'SubmenuKey1',
-//                 className: 'SubMenuClass'
-//               }
-//             ]
-//           }
-//         },
-//       ];
-
-//       let renderedContent = ReactDOM.render(
-//         <CommandBar
-//           items={ items }
-//         />,
-//         renderContainer
-//       ) as React.Component<CommandBar, {}>;
-
-//       let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
-//       ReactTestUtils.Simulate.click(menuItem);
-
-//       // Make sure the menu is open before the re-render
-//       expect(document.querySelector('.SubMenuClass')).to.exist;
-
-//       // Update the props, and re-render
-//       items.push({
-//         name: 'Test Key 2',
-//         key: 'TestKey2'
-//       });
-
-//       renderedContent = ReactDOM.render(
-//         <CommandBar
-//           items={ items }
-//         />,
-//         renderContainer
-//       ) as React.Component<CommandBar, {}>;
-
-//       // Make sure the menu is still open after the re-render
-//       expect(document.querySelector('.SubMenuClass')).to.exist;
-//     } finally {
-//       ReactDOM.unmountComponentAtNode(renderContainer);
-//       document.body.removeChild(renderContainer);
-//     }
-//   });
-
-//   it('closes menu after update if item is not longer present', () => {
-//     let renderContainer = document.createElement('div');
-//     document.body.appendChild(renderContainer);
-
-//     try {
-//       let items: IContextualMenuItem[] = [
-//         {
-//           name: 'TestText 1',
-//           key: 'TestKey1',
-//           subMenuProps: {
-//             items: [
-//               {
-//                 name: 'SubmenuText 1',
-//                 key: 'SubmenuKey1',
-//                 className: 'SubMenuClass'
-//               }
-//             ]
-//           }
-//         },
-//       ];
-
-//       let renderedContent = ReactDOM.render(
-//         <CommandBar
-//           items={ items }
-//         />,
-//         renderContainer
-//       ) as React.Component<CommandBar, {}>;
-
-//       let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
-//       ReactTestUtils.Simulate.click(menuItem);
-
-//       // Make sure the menu is open before the re-render
-//       expect(document.querySelector('.SubMenuClass')).to.exist;
-
-//       // Update the props, and re-render
-//       items = [{
-//         name: 'Test Key 2',
-//         key: 'TestKey2'
-//       }];
-
-//       renderedContent = ReactDOM.render(
-//         <CommandBar
-//           items={ items }
-//         />,
-//         renderContainer
-//       ) as React.Component<CommandBar, {}>;
-
-//       // Make sure the menu is still open after the re-render
-//       expect(document.querySelector('.SubMenuClass')).not.to.exist;
-//     } finally {
-//       ReactDOM.unmountComponentAtNode(renderContainer);
-//       document.body.removeChild(renderContainer);
-//     }
-//   });
-
-//   it('updates menu after update if item is still present', () => {
-//     let renderContainer = document.createElement('div');
-//     document.body.appendChild(renderContainer);
-
-//     try {
-//       let items: IContextualMenuItem[] = [
-//         {
-//           name: 'TestText 1',
-//           key: 'TestKey1',
-//           subMenuProps: {
-//             items: [
-//               {
-//                 name: 'SubmenuText 1',
-//                 key: 'SubmenuKey1',
-//                 className: 'SubMenuClass'
-//               }
-//             ]
-//           }
-//         },
-//       ];
-
-//       let renderedContent = ReactDOM.render(
-//         <CommandBar
-//           items={ items }
-//         />,
-//         renderContainer
-//       ) as React.Component<CommandBar, {}>;
-
-//       let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
-//       ReactTestUtils.Simulate.click(menuItem);
-
-//       // Make sure the menu is open before the re-render
-//       expect(document.querySelector('.SubMenuClass')).to.exist;
-
-//       // Update the props, and re-render
-//       items[0].subMenuProps!.items[0].className = 'SubMenuClassUpdate';
-
-//       renderedContent = ReactDOM.render(
-//         <CommandBar
-//           items={ items }
-//         />,
-//         renderContainer
-//       ) as React.Component<CommandBar, {}>;
-
-//       // Make sure the menu is still open after the re-render
-//       expect(document.querySelector('.SubMenuClass')).not.to.exist;
-//       expect(document.querySelector('.SubMenuClassUpdate')).to.exist;
-//     } finally {
-//       ReactDOM.unmountComponentAtNode(renderContainer);
-//       document.body.removeChild(renderContainer);
-//     }
-//   });
-// });
\ No newline at end of file
+describe('CommandBar', () => {
+
+  afterEach(() => {
+    for (let i = 0; i < document.body.children.length; i++) {
+      if (document.body.children[i].tagName === 'DIV') {
+        document.body.removeChild(document.body.children[i]);
+        i--;
+      }
+    }
+  });
+
+  it.only('opens a menu with IContextualMenuItem.subMenuProps.items property', () => {
+    const items: IContextualMenuItem[] = [
+      {
+        name: 'TestText 1',
+        key: 'TestKey1',
+        subMenuProps: {
+          items: [
+            {
+              name: 'SubmenuText 1',
+              key: 'SubmenuKey1',
+              className: 'SubMenuClass'
+            }
+          ]
+        }
+      },
+    ];
+
+    let renderedContent = ReactTestUtils.renderIntoDocument<CommandBar>(
+      <CommandBar
+        items={ items }
+      />
+    ) as React.Component<CommandBar, {}>;
+    document.body.appendChild(ReactDOM.findDOMNode(renderedContent));
+
+    let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
+    ReactTestUtils.Simulate.click(menuItem);
+
+    expect(document.querySelector('.SubMenuClass')).to.exist;
+  });
+
+  it('keeps menu open after update if item is still present', () => {
+    let renderContainer = document.createElement('div');
+    document.body.appendChild(renderContainer);
+
+    try {
+      let items: IContextualMenuItem[] = [
+        {
+          name: 'TestText 1',
+          key: 'TestKey1',
+          subMenuProps: {
+            items: [
+              {
+                name: 'SubmenuText 1',
+                key: 'SubmenuKey1',
+                className: 'SubMenuClass'
+              }
+            ]
+          }
+        },
+      ];
+
+      let renderedContent = ReactDOM.render(
+        <CommandBar
+          items={ items }
+        />,
+        renderContainer
+      ) as React.Component<CommandBar, {}>;
+
+      let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
+      ReactTestUtils.Simulate.click(menuItem);
+
+      // Make sure the menu is open before the re-render
+      expect(document.querySelector('.SubMenuClass')).to.exist;
+
+      // Update the props, and re-render
+      items.push({
+        name: 'Test Key 2',
+        key: 'TestKey2'
+      });
+
+      renderedContent = ReactDOM.render(
+        <CommandBar
+          items={ items }
+        />,
+        renderContainer
+      ) as React.Component<CommandBar, {}>;
+
+      // Make sure the menu is still open after the re-render
+      expect(document.querySelector('.SubMenuClass')).to.exist;
+    } finally {
+      ReactDOM.unmountComponentAtNode(renderContainer);
+      document.body.removeChild(renderContainer);
+    }
+  });
+
+  it('closes menu after update if item is not longer present', () => {
+    let renderContainer = document.createElement('div');
+    document.body.appendChild(renderContainer);
+
+    try {
+      let items: IContextualMenuItem[] = [
+        {
+          name: 'TestText 1',
+          key: 'TestKey1',
+          subMenuProps: {
+            items: [
+              {
+                name: 'SubmenuText 1',
+                key: 'SubmenuKey1',
+                className: 'SubMenuClass'
+              }
+            ]
+          }
+        },
+      ];
+
+      let renderedContent = ReactDOM.render(
+        <CommandBar
+          items={ items }
+        />,
+        renderContainer
+      ) as React.Component<CommandBar, {}>;
+
+      let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
+      ReactTestUtils.Simulate.click(menuItem);
+
+      // Make sure the menu is open before the re-render
+      expect(document.querySelector('.SubMenuClass')).to.exist;
+
+      // Update the props, and re-render
+      items = [{
+        name: 'Test Key 2',
+        key: 'TestKey2'
+      }];
+
+      renderedContent = ReactDOM.render(
+        <CommandBar
+          items={ items }
+        />,
+        renderContainer
+      ) as React.Component<CommandBar, {}>;
+
+      // Make sure the menu is still open after the re-render
+      expect(document.querySelector('.SubMenuClass')).not.to.exist;
+    } finally {
+      ReactDOM.unmountComponentAtNode(renderContainer);
+      document.body.removeChild(renderContainer);
+    }
+  });
+
+  it('updates menu after update if item is still present', () => {
+    let renderContainer = document.createElement('div');
+    document.body.appendChild(renderContainer);
+
+    try {
+      let items: IContextualMenuItem[] = [
+        {
+          name: 'TestText 1',
+          key: 'TestKey1',
+          subMenuProps: {
+            items: [
+              {
+                name: 'SubmenuText 1',
+                key: 'SubmenuKey1',
+                className: 'SubMenuClass'
+              }
+            ]
+          }
+        },
+      ];
+
+      let renderedContent = ReactDOM.render(
+        <CommandBar
+          items={ items }
+        />,
+        renderContainer
+      ) as React.Component<CommandBar, {}>;
+
+      let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
+      ReactTestUtils.Simulate.click(menuItem);
+
+      // Make sure the menu is open before the re-render
+      expect(document.querySelector('.SubMenuClass')).to.exist;
+
+      // Update the props, and re-render
+      items[0].subMenuProps!.items[0].className = 'SubMenuClassUpdate';
+
+      renderedContent = ReactDOM.render(
+        <CommandBar
+          items={ items }
+        />,
+        renderContainer
+      ) as React.Component<CommandBar, {}>;
+
+      // Make sure the menu is still open after the re-render
+      expect(document.querySelector('.SubMenuClass')).not.to.exist;
+      expect(document.querySelector('.SubMenuClassUpdate')).to.exist;
+    } finally {
+      ReactDOM.unmountComponentAtNode(renderContainer);
+      document.body.removeChild(renderContainer);
+    }
+  });
+});
\ No newline at end of file

From 860ca7ed4743647c6740e39ec2e21b060884a23a Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 18 Aug 2017 09:14:52 -0700
Subject: [PATCH 0443/1641] FocusZone: respect home/end when in INPUT or
 TEXTAREA (#2547)

* fixing textfield home/end in focuszone

* Adding change file.
---
 .../focus-zonefix_2017-08-18-16-01.json               | 11 +++++++++++
 .../src/components/FocusZone/FocusZone.tsx            | 11 +++++++++++
 2 files changed, 22 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/focus-zonefix_2017-08-18-16-01.json

diff --git a/common/changes/office-ui-fabric-react/focus-zonefix_2017-08-18-16-01.json b/common/changes/office-ui-fabric-react/focus-zonefix_2017-08-18-16-01.json
new file mode 100644
index 0000000000000..ea1c6eb886a70
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/focus-zonefix_2017-08-18-16-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "FocusZone: presssing home/end inside of an input/textarea element should respect cursor location.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 8e25d00ee9c1f..95e83f5fa6d96 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -343,6 +343,11 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
           return;
 
         case KeyCodes.home:
+          if (
+            this._isElementInput(ev.target as HTMLElement) &&
+            !this._shouldInputLoseFocus(ev.target as HTMLInputElement, false)) {
+            return false;
+          }
           const firstChild = this.refs.root.firstChild as HTMLElement;
           if (this.focusElement(getNextElement(this.refs.root, firstChild, true) as HTMLElement)) {
             break;
@@ -350,6 +355,12 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
           return;
 
         case KeyCodes.end:
+          if (
+            this._isElementInput(ev.target as HTMLElement) &&
+            !this._shouldInputLoseFocus(ev.target as HTMLInputElement, true)) {
+            return false;
+          }
+
           const lastChild = this.refs.root.lastChild as HTMLElement;
           if (this.focusElement(getPreviousElement(this.refs.root, lastChild, true, true, true) as HTMLElement)) {
             break;

From a3520cd55dffa9bd89f2dc476a49d426b52d48e5 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 18 Aug 2017 16:32:34 +0000
Subject: [PATCH 0444/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 19 +++++
 apps/fabric-website/CHANGELOG.md              |  9 ++-
 apps/fabric-website/package.json              |  4 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...sizeJustifiedColumns_2017-08-08-09-56.json | 11 ---
 ...users-adsurang-14aug_2017-08-15-05-25.json | 11 ---
 ...d-bar-in-experiments_2017-08-16-18-18.json | 11 ---
 .../list-range_2017-08-17-18-12.json          | 11 ---
 .../css-cleanup_2017-08-17-00-19.json         | 11 ---
 ...sizeJustifiedColumns_2017-08-08-09-56.json | 11 ---
 ...users-adsurang-14aug_2017-08-15-05-25.json | 11 ---
 ...sizeJustifiedColumns_2017-08-08-09-56.json | 11 ---
 .../toggle-cleanup_2017-08-17-18-12.json      | 11 ---
 ...users-adsurang-14aug_2017-08-15-05-25.json | 11 ---
 ...sizeJustifiedColumns_2017-08-08-09-56.json | 11 ---
 ...users-adsurang-14aug_2017-08-15-05-25.json | 11 ---
 ...d-bar-in-experiments_2017-08-16-18-18.json | 11 ---
 .../css-cleanup_2017-08-17-00-19.json         | 11 ---
 ...sizeJustifiedColumns_2017-08-08-09-56.json | 11 ---
 ...ropdown-selected-fix_2017-08-17-17-04.json | 11 ---
 .../focus-zonefix_2017-08-18-16-01.json       | 11 ---
 .../list-range_2017-08-17-18-12.json          | 11 ---
 ...ers-fixstackoverflow_2017-08-15-22-39.json | 11 ---
 .../toggle-cleanup_2017-08-17-18-12.json      | 11 ---
 ...Host-onTooltipToggle_2017-08-11-16-12.json | 11 ---
 ...users-adsurang-14aug_2017-08-15-05-25.json | 16 -----
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/CHANGELOG.json           | 26 +++++++
 packages/experiments/CHANGELOG.md             | 13 +++-
 packages/experiments/package.json             |  4 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 71 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 22 +++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/CHANGELOG.json               | 14 ++++
 packages/styling/CHANGELOG.md                 |  9 ++-
 packages/styling/package.json                 |  2 +-
 38 files changed, 190 insertions(+), 262 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
 delete mode 100644 common/changes/@uifabric/example-app-base/users-adsurang-14aug_2017-08-15-05-25.json
 delete mode 100644 common/changes/@uifabric/experiments/command-bar-in-experiments_2017-08-16-18-18.json
 delete mode 100644 common/changes/@uifabric/experiments/list-range_2017-08-17-18-12.json
 delete mode 100644 common/changes/@uifabric/fabric-website/css-cleanup_2017-08-17-00-19.json
 delete mode 100644 common/changes/@uifabric/fabric-website/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
 delete mode 100644 common/changes/@uifabric/fabric-website/users-adsurang-14aug_2017-08-15-05-25.json
 delete mode 100644 common/changes/@uifabric/styling/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
 delete mode 100644 common/changes/@uifabric/styling/toggle-cleanup_2017-08-17-18-12.json
 delete mode 100644 common/changes/@uifabric/styling/users-adsurang-14aug_2017-08-15-05-25.json
 delete mode 100644 common/changes/@uifabric/utilities/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
 delete mode 100644 common/changes/@uifabric/utilities/users-adsurang-14aug_2017-08-15-05-25.json
 delete mode 100644 common/changes/office-ui-fabric-react/command-bar-in-experiments_2017-08-16-18-18.json
 delete mode 100644 common/changes/office-ui-fabric-react/css-cleanup_2017-08-17-00-19.json
 delete mode 100644 common/changes/office-ui-fabric-react/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
 delete mode 100644 common/changes/office-ui-fabric-react/dropdown-selected-fix_2017-08-17-17-04.json
 delete mode 100644 common/changes/office-ui-fabric-react/focus-zonefix_2017-08-18-16-01.json
 delete mode 100644 common/changes/office-ui-fabric-react/list-range_2017-08-17-18-12.json
 delete mode 100644 common/changes/office-ui-fabric-react/pickers-fixstackoverflow_2017-08-15-22-39.json
 delete mode 100644 common/changes/office-ui-fabric-react/toggle-cleanup_2017-08-17-18-12.json
 delete mode 100644 common/changes/office-ui-fabric-react/tooltipHost-onTooltipToggle_2017-08-11-16-12.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-adsurang-14aug_2017-08-15-05-25.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index bed2bce46bf52..dfa94d1aa6624 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.7.1",
+      "tag": "@uifabric/fabric-website_v4.7.1",
+      "date": "Fri, 18 Aug 2017 16:32:33 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "14f335d0ca77f09cc9422c1809121e527153c430",
+            "comment": "Minor css usage cleanup."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.34.0 <5.0.0` to `>=4.35.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.7.0",
       "tag": "@uifabric/fabric-website_v4.7.0",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 748a51eb36a4d..d09273799fe84 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Fri, 11 Aug 2017 19:38:35 GMT and should not be manually modified.
+This log was last generated on Fri, 18 Aug 2017 16:32:33 GMT and should not be manually modified.
+
+## 4.7.1
+Fri, 18 Aug 2017 16:32:33 GMT
+
+### Patches
+
+- Minor css usage cleanup.
 
 ## 4.7.0
 Fri, 11 Aug 2017 19:38:35 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 36d1129ed4e36..46169d9342926 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.7.0",
+  "version": "4.7.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.34.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.35.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 0b8a7e0c9a319..e248d1952a267 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.34.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.35.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index d9db3dbad913d..1d37efd338ce1 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -35,7 +35,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.34.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.35.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 03dae1d3580d4..80a8d86afa2f7 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.34.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.35.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/example-app-base/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json b/common/changes/@uifabric/example-app-base/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
deleted file mode 100644
index be59f08e8e294..0000000000000
--- a/common/changes/@uifabric/example-app-base/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "v-panu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/users-adsurang-14aug_2017-08-15-05-25.json b/common/changes/@uifabric/example-app-base/users-adsurang-14aug_2017-08-15-05-25.json
deleted file mode 100644
index 7d80e8e887db5..0000000000000
--- a/common/changes/@uifabric/example-app-base/users-adsurang-14aug_2017-08-15-05-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "adsurang@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/command-bar-in-experiments_2017-08-16-18-18.json b/common/changes/@uifabric/experiments/command-bar-in-experiments_2017-08-16-18-18.json
deleted file mode 100644
index 92b196edc9d76..0000000000000
--- a/common/changes/@uifabric/experiments/command-bar-in-experiments_2017-08-16-18-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Added commandbar as ExperimentCommandBar",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/list-range_2017-08-17-18-12.json b/common/changes/@uifabric/experiments/list-range_2017-08-17-18-12.json
deleted file mode 100644
index 2f42abfc770bb..0000000000000
--- a/common/changes/@uifabric/experiments/list-range_2017-08-17-18-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Fix underflow for TilesList with stack grids",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/css-cleanup_2017-08-17-00-19.json b/common/changes/@uifabric/fabric-website/css-cleanup_2017-08-17-00-19.json
deleted file mode 100644
index daf2f3bd0610f..0000000000000
--- a/common/changes/@uifabric/fabric-website/css-cleanup_2017-08-17-00-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Minor css usage cleanup.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json b/common/changes/@uifabric/fabric-website/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
deleted file mode 100644
index c7bff1c0a4954..0000000000000
--- a/common/changes/@uifabric/fabric-website/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "v-panu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/users-adsurang-14aug_2017-08-15-05-25.json b/common/changes/@uifabric/fabric-website/users-adsurang-14aug_2017-08-15-05-25.json
deleted file mode 100644
index f3ff20e3759a2..0000000000000
--- a/common/changes/@uifabric/fabric-website/users-adsurang-14aug_2017-08-15-05-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "adsurang@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json b/common/changes/@uifabric/styling/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
deleted file mode 100644
index bece4f87a03a9..0000000000000
--- a/common/changes/@uifabric/styling/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "v-panu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/toggle-cleanup_2017-08-17-18-12.json b/common/changes/@uifabric/styling/toggle-cleanup_2017-08-17-18-12.json
deleted file mode 100644
index 1241859baf4f8..0000000000000
--- a/common/changes/@uifabric/styling/toggle-cleanup_2017-08-17-18-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "mergeStyleSets: tweaked the return type to be less restrictive.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/users-adsurang-14aug_2017-08-15-05-25.json b/common/changes/@uifabric/styling/users-adsurang-14aug_2017-08-15-05-25.json
deleted file mode 100644
index 862f25c73e009..0000000000000
--- a/common/changes/@uifabric/styling/users-adsurang-14aug_2017-08-15-05-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "adsurang@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json b/common/changes/@uifabric/utilities/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
deleted file mode 100644
index 9f52a48cb3632..0000000000000
--- a/common/changes/@uifabric/utilities/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "v-panu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/users-adsurang-14aug_2017-08-15-05-25.json b/common/changes/@uifabric/utilities/users-adsurang-14aug_2017-08-15-05-25.json
deleted file mode 100644
index b7a21e19e9cff..0000000000000
--- a/common/changes/@uifabric/utilities/users-adsurang-14aug_2017-08-15-05-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "adsurang@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/command-bar-in-experiments_2017-08-16-18-18.json b/common/changes/office-ui-fabric-react/command-bar-in-experiments_2017-08-16-18-18.json
deleted file mode 100644
index e7dda66768e17..0000000000000
--- a/common/changes/office-ui-fabric-react/command-bar-in-experiments_2017-08-16-18-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added ActionButton and CommandBarButton",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/css-cleanup_2017-08-17-00-19.json b/common/changes/office-ui-fabric-react/css-cleanup_2017-08-17-00-19.json
deleted file mode 100644
index 8226e7a0868a1..0000000000000
--- a/common/changes/office-ui-fabric-react/css-cleanup_2017-08-17-00-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Minor cleanup in merging of css class names.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json b/common/changes/office-ui-fabric-react/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
deleted file mode 100644
index c1edd42d2de4e..0000000000000
--- a/common/changes/office-ui-fabric-react/detailsList-resizeJustifiedColumns_2017-08-08-09-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: Resizing columns preserves justified mode.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-panu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/dropdown-selected-fix_2017-08-17-17-04.json b/common/changes/office-ui-fabric-react/dropdown-selected-fix_2017-08-17-17-04.json
deleted file mode 100644
index 5b78d53f65f4e..0000000000000
--- a/common/changes/office-ui-fabric-react/dropdown-selected-fix_2017-08-17-17-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: Fixed bug where selected state was not being removed from dropdown options",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/focus-zonefix_2017-08-18-16-01.json b/common/changes/office-ui-fabric-react/focus-zonefix_2017-08-18-16-01.json
deleted file mode 100644
index ea1c6eb886a70..0000000000000
--- a/common/changes/office-ui-fabric-react/focus-zonefix_2017-08-18-16-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "FocusZone: presssing home/end inside of an input/textarea element should respect cursor location.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/list-range_2017-08-17-18-12.json b/common/changes/office-ui-fabric-react/list-range_2017-08-17-18-12.json
deleted file mode 100644
index dc0ec0592b83f..0000000000000
--- a/common/changes/office-ui-fabric-react/list-range_2017-08-17-18-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix some unused code and typings in List",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/pickers-fixstackoverflow_2017-08-15-22-39.json b/common/changes/office-ui-fabric-react/pickers-fixstackoverflow_2017-08-15-22-39.json
deleted file mode 100644
index deb0649d32be2..0000000000000
--- a/common/changes/office-ui-fabric-react/pickers-fixstackoverflow_2017-08-15-22-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Pickers: Fixed an issue where a loop would sometimes occur if values were resolved when input had an empty value.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/toggle-cleanup_2017-08-17-18-12.json b/common/changes/office-ui-fabric-react/toggle-cleanup_2017-08-17-18-12.json
deleted file mode 100644
index 8475268c28a4c..0000000000000
--- a/common/changes/office-ui-fabric-react/toggle-cleanup_2017-08-17-18-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Toggle: fixed issue where disabled Toggles are clickable. Also cleaned up some of the styling.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/tooltipHost-onTooltipToggle_2017-08-11-16-12.json b/common/changes/office-ui-fabric-react/tooltipHost-onTooltipToggle_2017-08-11-16-12.json
deleted file mode 100644
index 2d45e8f0c72f9..0000000000000
--- a/common/changes/office-ui-fabric-react/tooltipHost-onTooltipToggle_2017-08-11-16-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "TooltipHost: new onTooltipToggle callback",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-panu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-adsurang-14aug_2017-08-15-05-25.json b/common/changes/office-ui-fabric-react/users-adsurang-14aug_2017-08-15-05-25.json
deleted file mode 100644
index 188e76fde7796..0000000000000
--- a/common/changes/office-ui-fabric-react/users-adsurang-14aug_2017-08-15-05-25.json
+++ /dev/null
@@ -1,16 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "CommandBar: adding `aria-expanded` attribute to overflow menu.",
-      "type": "patch"
-    },
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: Making expand/collapse chevron in grouped list headers keyboard accessible.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "adsurang@microsoft.com"
-}
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 8b646ce04b946..24787b6fc863e 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -48,7 +48,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.19.2 <1.0.0",
+    "@uifabric/styling": ">=0.20.0 <1.0.0",
     "@uifabric/utilities": ">=4.9.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index ae7affdab5df5..f382e5bb7732e 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "0.1.0",
+      "tag": "@uifabric/experiments_v0.1.0",
+      "date": "Fri, 18 Aug 2017 16:32:33 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "be902328b437c88c85b8e1f924b421e94b163f5f",
+            "comment": "Added commandbar as ExperimentCommandBar"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "3ab591c8b3f3c9645beb16022d8a3e67c6ee2fac",
+            "comment": "Fix underflow for TilesList with stack grids"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.34.0` to `4.35.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.0.2",
       "tag": "@uifabric/experiments_v0.0.2",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index a02343743596e..2edeb5b582935 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Wed, 16 Aug 2017 10:11:43 GMT and should not be manually modified.
+This log was last generated on Fri, 18 Aug 2017 16:32:33 GMT and should not be manually modified.
+
+## 0.1.0
+Fri, 18 Aug 2017 16:32:33 GMT
+
+### Minor changes
+
+- Added commandbar as ExperimentCommandBar
+
+### Patches
+
+- Fix underflow for TilesList with stack grids
 
 ## 0.0.2
 Wed, 16 Aug 2017 10:11:43 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 5de5d5a7c0ee5..d2229297a849b 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "0.0.2",
+  "version": "0.1.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -64,7 +64,7 @@
     "webpack-notifier": "^1.5.0"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.34.0"
+    "office-ui-fabric-react": "4.35.0"
   },
   "peerDependencies": {
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 8cffbe78be7d4..7ada6ce05fd2f 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,77 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.35.0",
+      "tag": "office-ui-fabric-react_v4.35.0",
+      "date": "Fri, 18 Aug 2017 16:32:33 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "be902328b437c88c85b8e1f924b421e94b163f5f",
+            "comment": "Added ActionButton and CommandBarButton"
+          },
+          {
+            "author": "Pablo Núñez <pablonete@gmail.com>",
+            "commit": "ff9c4c0f916b47fec51b8df461f37f5cb4ca635a",
+            "comment": "DetailsList: Resizing columns preserves justified mode."
+          },
+          {
+            "author": "Pablo Núñez <pablonete@gmail.com>",
+            "commit": "ec2a0c25f756846079d25f97a768c584682c85b2",
+            "comment": "TooltipHost: new onTooltipToggle callback"
+          }
+        ],
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "14f335d0ca77f09cc9422c1809121e527153c430",
+            "comment": "Minor cleanup in merging of css class names."
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "8d1c3d64c38899aad8ccad960fbaea5ccef9872f",
+            "comment": "Dropdown: Fixed bug where selected state was not being removed from dropdown options"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "860ca7ed4743647c6740e39ec2e21b060884a23a",
+            "comment": "FocusZone: presssing home/end inside of an input/textarea element should respect cursor location."
+          },
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "3ab591c8b3f3c9645beb16022d8a3e67c6ee2fac",
+            "comment": "Fix some unused code and typings in List"
+          },
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "66cfd860da0296f9c4cd583ae1112059eb23d887",
+            "comment": "Pickers: Fixed an issue where a loop would sometimes occur if values were resolved when input had an empty value."
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "e35e5e23555797dae09d6f3aac98fd932c245f1d",
+            "comment": "Toggle: fixed issue where disabled Toggles are clickable. Also cleaned up some of the styling."
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "2669e2f9e147a34134b072c36e95ded7d91d2fae",
+            "comment": "CommandBar: adding `aria-expanded` attribute to overflow menu."
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "2669e2f9e147a34134b072c36e95ded7d91d2fae",
+            "comment": "DetailsList: Making expand/collapse chevron in grouped list headers keyboard accessible."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.19.2 <1.0.0` to `>=0.20.0 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.34.0",
       "tag": "office-ui-fabric-react_v4.34.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index bb6f91ab74457..68f8e8c8eb059 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,26 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 16 Aug 2017 10:11:43 GMT and should not be manually modified.
+This log was last generated on Fri, 18 Aug 2017 16:32:33 GMT and should not be manually modified.
+
+## 4.35.0
+Fri, 18 Aug 2017 16:32:33 GMT
+
+### Minor changes
+
+- Added ActionButton and CommandBarButton
+- DetailsList: Resizing columns preserves justified mode.
+- TooltipHost: new onTooltipToggle callback
+
+### Patches
+
+- Minor cleanup in merging of css class names.
+- Dropdown: Fixed bug where selected state was not being removed from dropdown options
+- FocusZone: presssing home/end inside of an input/textarea element should respect cursor location.
+- Fix some unused code and typings in List
+- Pickers: Fixed an issue where a loop would sometimes occur if values were resolved when input had an empty value.
+- Toggle: fixed issue where disabled Toggles are clickable. Also cleaned up some of the styling.
+- CommandBar: adding `aria-expanded` attribute to overflow menu.
+- DetailsList: Making expand/collapse chevron in grouped list headers keyboard accessible.
 
 ## 4.34.0
 Wed, 16 Aug 2017 10:11:43 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 6455245e13806..05b8a41e28c27 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.34.0",
+  "version": "4.35.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
     "@uifabric/utilities": ">=4.9.0 <5.0.0",
-    "@uifabric/styling": ">=0.19.2 <1.0.0",
+    "@uifabric/styling": ">=0.20.0 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 0b79175305406..17d5069eb45a4 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.20.0",
+      "tag": "@uifabric/styling_v0.20.0",
+      "date": "Fri, 18 Aug 2017 16:32:33 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "e35e5e23555797dae09d6f3aac98fd932c245f1d",
+            "comment": "mergeStyleSets: tweaked the return type to be less restrictive."
+          }
+        ]
+      }
+    },
     {
       "version": "0.19.2",
       "tag": "@uifabric/styling_v0.19.2",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index a3a69505f5e85..72b78299bcd0c 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Mon, 14 Aug 2017 10:20:31 GMT and should not be manually modified.
+This log was last generated on Fri, 18 Aug 2017 16:32:33 GMT and should not be manually modified.
+
+## 0.20.0
+Fri, 18 Aug 2017 16:32:33 GMT
+
+### Minor changes
+
+- mergeStyleSets: tweaked the return type to be less restrictive.
 
 ## 0.19.2
 Mon, 14 Aug 2017 10:20:31 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 1b7de94b9af35..f396f7593d226 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.19.2",
+  "version": "0.20.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 0f3606270be2ca8b30a4ad753d678e1071a66c70 Mon Sep 17 00:00:00 2001
From: Eddie Liu <leddie24@gmail.com>
Date: Fri, 18 Aug 2017 20:54:24 +0000
Subject: [PATCH 0445/1641] DetailsList: Move background from .cell to .root in
 DetailsHeader (#2548)

* Move background property from .cell to .root to fix background not expanding whole width of detailslist

* Add change file

* Remove duplicate property
---
 ...detailsheader-background-fix_2017-08-18-20-44.json | 11 +++++++++++
 .../src/components/DetailsList/DetailsHeader.scss     |  3 +--
 2 files changed, 12 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-edwliu-detailsheader-background-fix_2017-08-18-20-44.json

diff --git a/common/changes/office-ui-fabric-react/v-edwliu-detailsheader-background-fix_2017-08-18-20-44.json b/common/changes/office-ui-fabric-react/v-edwliu-detailsheader-background-fix_2017-08-18-20-44.json
new file mode 100644
index 0000000000000..592c431bdf307
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-edwliu-detailsheader-background-fix_2017-08-18-20-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: Move background color from .cell to .root for DetailsHeader",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-edwliu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
index b7b713d95f472..df6836c39b819 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
@@ -11,6 +11,7 @@ $isPaddedMargin: 24px;
 
 .root {
   display: inline-block;
+  background: $headerBackgroundColor;
   position: relative;
   min-width: 100%;
   vertical-align: top;
@@ -35,7 +36,6 @@ $isPaddedMargin: 24px;
 
 .cell {
   @include ms-font-s;
-  background: $headerBackgroundColor;
   color: $headerForegroundColor;
   @include focus-border();
   position: relative;
@@ -45,7 +45,6 @@ $isPaddedMargin: 24px;
   border: none;
   line-height: inherit;
   margin: 0;
-  @include ms-text-align(left);
   height: $rowHeight;
   vertical-align: top;
   white-space: nowrap;

From 7141e63018997876d0c4f9d8dc6e420eb5f52db9 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 18 Aug 2017 15:08:28 -0700
Subject: [PATCH 0446/1641] Adding a dedicated merge-styles package which will
 replace the glamor usage. (#2527)

* Initial checkin.

* Updates to add webpack and slightly reduce the bundle size of merge-styles to 3.4k total.

* Adding change files.

* Adding more tests.

* Updating version number.

* Updates: remove ALL dependencies bringing the total size down to 2.7k, fix tests, remove async and appendChild features from stylesheet.

* Fixing for loops and readme and strict mode.

* const updates.

* pr feedback.

* Assume pixels when providing number types.

* ignore opacity.

* Adding keyframes test.

* Adding comments, removing obsolete or deprecated properties from rawstyle interface.

* Removing import.

* Updating to optimize the transforms to an O(n) approach.

* Updating documentation.

* Minor grammar fixes.
---
 apps/fabric-website/package.json              |    4 +-
 .../merge-styles_2017-08-16-20-51.json        |   11 +
 .../merge-styles_2017-08-16-20-51.json        |   11 +
 .../merge-styles_2017-08-16-20-51.json        |   11 +
 .../merge-styles_2017-08-16-20-51.json        |   11 +
 .../merge-styles_2017-08-16-20-51.json        |   11 +
 common/config/rush/npm-shrinkwrap.json        |  223 ++-
 packages/example-app-base/package.json        |    4 +-
 packages/experiments/package.json             |    4 +-
 packages/merge-styles/.npmignore              |   22 +
 packages/merge-styles/.npmrc                  |    2 +
 packages/merge-styles/LICENSE                 |   15 +
 packages/merge-styles/README.md               |  305 +++
 packages/merge-styles/api/merge-styles.api.ts |  303 +++
 .../merge-styles/config/api-extractor.json    |    6 +
 packages/merge-styles/gulpfile.js             |   44 +
 packages/merge-styles/karma.config.js         |  111 ++
 packages/merge-styles/package.json            |   49 +
 packages/merge-styles/src/IRawStyle.ts        | 1764 +++++++++++++++++
 packages/merge-styles/src/IStyle.ts           |   29 +
 packages/merge-styles/src/IStyleSet.ts        |    5 +
 packages/merge-styles/src/Stylesheet.ts       |  186 ++
 packages/merge-styles/src/common/tests.js     |   22 +
 .../merge-styles/src/concatStyleSets.test.ts  |   41 +
 packages/merge-styles/src/concatStyleSets.ts  |   32 +
 packages/merge-styles/src/fontFace.test.ts    |   20 +
 packages/merge-styles/src/fontFace.ts         |   11 +
 .../merge-styles/src/getVendorSettings.ts     |   41 +
 packages/merge-styles/src/index.ts            |   40 +
 packages/merge-styles/src/keyframes.test.ts   |   50 +
 packages/merge-styles/src/keyframes.ts        |   27 +
 .../merge-styles/src/mergeStyleSets.test.ts   |   50 +
 packages/merge-styles/src/mergeStyleSets.ts   |   27 +
 packages/merge-styles/src/mergeStyles.test.ts |   48 +
 packages/merge-styles/src/mergeStyles.ts      |   41 +
 packages/merge-styles/src/server.test.ts      |   28 +
 packages/merge-styles/src/server.ts           |   17 +
 .../merge-styles/src/styleToClassName.test.ts |  125 ++
 packages/merge-styles/src/styleToClassName.ts |  164 ++
 .../src/transforms/kebabRules.test.ts         |   34 +
 .../merge-styles/src/transforms/kebabRules.ts |    6 +
 .../src/transforms/prefixRules.test.ts        |   67 +
 .../src/transforms/prefixRules.ts             |   33 +
 .../src/transforms/provideUnits.test.ts       |   63 +
 .../src/transforms/provideUnits.ts            |   14 +
 .../src/transforms/rtlifyRules.test.ts        |   54 +
 .../src/transforms/rtlifyRules.ts             |   85 +
 packages/merge-styles/tsconfig.json           |   30 +
 packages/merge-styles/tslint.json             |    8 +
 packages/merge-styles/webpack.config.js       |   57 +
 packages/office-ui-fabric-react/package.json  |    4 +-
 packages/utilities/api/utilities.api.ts       |    2 +-
 packages/utilities/package.json               |    2 +-
 packages/utilities/src/GlobalSettings.ts      |    6 +-
 packages/utilities/src/rtl.ts                 |    5 +-
 rush.json                                     |    5 +
 56 files changed, 4337 insertions(+), 53 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/merge-styles_2017-08-16-20-51.json
 create mode 100644 common/changes/@uifabric/experiments/merge-styles_2017-08-16-20-51.json
 create mode 100644 common/changes/@uifabric/fabric-website/merge-styles_2017-08-16-20-51.json
 create mode 100644 common/changes/@uifabric/utilities/merge-styles_2017-08-16-20-51.json
 create mode 100644 common/changes/office-ui-fabric-react/merge-styles_2017-08-16-20-51.json
 create mode 100644 packages/merge-styles/.npmignore
 create mode 100644 packages/merge-styles/.npmrc
 create mode 100644 packages/merge-styles/LICENSE
 create mode 100644 packages/merge-styles/README.md
 create mode 100644 packages/merge-styles/api/merge-styles.api.ts
 create mode 100644 packages/merge-styles/config/api-extractor.json
 create mode 100644 packages/merge-styles/gulpfile.js
 create mode 100644 packages/merge-styles/karma.config.js
 create mode 100644 packages/merge-styles/package.json
 create mode 100644 packages/merge-styles/src/IRawStyle.ts
 create mode 100644 packages/merge-styles/src/IStyle.ts
 create mode 100644 packages/merge-styles/src/IStyleSet.ts
 create mode 100644 packages/merge-styles/src/Stylesheet.ts
 create mode 100644 packages/merge-styles/src/common/tests.js
 create mode 100644 packages/merge-styles/src/concatStyleSets.test.ts
 create mode 100644 packages/merge-styles/src/concatStyleSets.ts
 create mode 100644 packages/merge-styles/src/fontFace.test.ts
 create mode 100644 packages/merge-styles/src/fontFace.ts
 create mode 100644 packages/merge-styles/src/getVendorSettings.ts
 create mode 100644 packages/merge-styles/src/index.ts
 create mode 100644 packages/merge-styles/src/keyframes.test.ts
 create mode 100644 packages/merge-styles/src/keyframes.ts
 create mode 100644 packages/merge-styles/src/mergeStyleSets.test.ts
 create mode 100644 packages/merge-styles/src/mergeStyleSets.ts
 create mode 100644 packages/merge-styles/src/mergeStyles.test.ts
 create mode 100644 packages/merge-styles/src/mergeStyles.ts
 create mode 100644 packages/merge-styles/src/server.test.ts
 create mode 100644 packages/merge-styles/src/server.ts
 create mode 100644 packages/merge-styles/src/styleToClassName.test.ts
 create mode 100644 packages/merge-styles/src/styleToClassName.ts
 create mode 100644 packages/merge-styles/src/transforms/kebabRules.test.ts
 create mode 100644 packages/merge-styles/src/transforms/kebabRules.ts
 create mode 100644 packages/merge-styles/src/transforms/prefixRules.test.ts
 create mode 100644 packages/merge-styles/src/transforms/prefixRules.ts
 create mode 100644 packages/merge-styles/src/transforms/provideUnits.test.ts
 create mode 100644 packages/merge-styles/src/transforms/provideUnits.ts
 create mode 100644 packages/merge-styles/src/transforms/rtlifyRules.test.ts
 create mode 100644 packages/merge-styles/src/transforms/rtlifyRules.ts
 create mode 100644 packages/merge-styles/tsconfig.json
 create mode 100644 packages/merge-styles/tslint.json
 create mode 100644 packages/merge-styles/webpack.config.js

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 46169d9342926..75f79f42c6c23 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -43,7 +43,7 @@
     "gutil": "1.6.4",
     "highlight.js": "^9.6.0",
     "load-themed-styles-loader": "^0.0.3",
-    "mocha": "^3.2.0",
+    "mocha": "^3.3.0",
     "mocha-loader": "^1.1.1",
     "node-sass": "^4.5.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
@@ -57,7 +57,7 @@
     "resemblejs": "~2.2.3",
     "sass-loader": "^6.0.3",
     "sinon": "^2.3.2",
-    "source-map-loader": "0.2.1",
+    "source-map-loader": "^0.2.1",
     "ts-loader": "^2.0.1",
     "typescript": "2.4.2",
     "webpack": "^3.5.1",
diff --git a/common/changes/@uifabric/example-app-base/merge-styles_2017-08-16-20-51.json b/common/changes/@uifabric/example-app-base/merge-styles_2017-08-16-20-51.json
new file mode 100644
index 0000000000000..33d339800cbda
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/merge-styles_2017-08-16-20-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Updating project dependencies.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/merge-styles_2017-08-16-20-51.json b/common/changes/@uifabric/experiments/merge-styles_2017-08-16-20-51.json
new file mode 100644
index 0000000000000..7f1199310ce0d
--- /dev/null
+++ b/common/changes/@uifabric/experiments/merge-styles_2017-08-16-20-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Updating project dependencies.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/merge-styles_2017-08-16-20-51.json b/common/changes/@uifabric/fabric-website/merge-styles_2017-08-16-20-51.json
new file mode 100644
index 0000000000000..e1ec4b9d0de7b
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/merge-styles_2017-08-16-20-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Updating project dependencies.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/merge-styles_2017-08-16-20-51.json b/common/changes/@uifabric/utilities/merge-styles_2017-08-16-20-51.json
new file mode 100644
index 0000000000000..c3bd0f31ee091
--- /dev/null
+++ b/common/changes/@uifabric/utilities/merge-styles_2017-08-16-20-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Minor tweaks to utilities to reduce the graph edges.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/merge-styles_2017-08-16-20-51.json b/common/changes/office-ui-fabric-react/merge-styles_2017-08-16-20-51.json
new file mode 100644
index 0000000000000..43d1c47765ec0
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/merge-styles_2017-08-16-20-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Updating project dependencies.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 7c74f3e98b402..aba93b92f2ea6 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -9,9 +9,9 @@
       "integrity": "sha1-pVZ78Y5vGuhNhjE5j0kzlMJeIdM="
     },
     "@microsoft/gulp-core-build": {
-      "version": "2.9.2",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.2.tgz",
-      "integrity": "sha1-mx/9pcjNJMZZv0AWUWUUQUztB7s=",
+      "version": "2.9.3",
+      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.3.tgz",
+      "integrity": "sha1-HJbOC5DAUmm9jMurTY5VskofCVg=",
       "dependencies": {
         "@types/chai": {
           "version": "3.4.34",
@@ -156,9 +156,9 @@
       "integrity": "sha1-k9LYWMLwL+3wxZSKal4KQ8XjqCU="
     },
     "@microsoft/gulp-core-build-typescript": {
-      "version": "3.3.2",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.3.2.tgz",
-      "integrity": "sha1-EH8TFHtgW28sUP6rYZTPp9+po4s="
+      "version": "3.4.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.4.0.tgz",
+      "integrity": "sha1-Fy1A/zaq1nAcju1SmSKbjx0QOQw="
     },
     "@microsoft/gulp-core-build-webpack": {
       "version": "1.1.6",
@@ -440,6 +440,11 @@
           "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.1.1.tgz",
           "integrity": "sha512-vOk6uEMctu0vQrvuSqFdJyqj1Q0S5VTDL79qtjo+DhRr+1mmaD+tluFSCZqhvi/JUhXSzoZN2BhtstaPEeE8cw=="
         },
+        "async": {
+          "version": "0.9.2",
+          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz",
+          "integrity": "sha1-rqdNXmHB+JlhO/ZL2mbUx48v0X0="
+        },
         "css-loader": {
           "version": "0.24.0",
           "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.24.0.tgz",
@@ -577,6 +582,16 @@
           "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.10.3.tgz",
           "integrity": "sha1-zlpuzTEB/tXsCYJ9rCKpwpv7BTU="
         },
+        "source-map": {
+          "version": "0.1.43",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz",
+          "integrity": "sha1-wkvBRspRfBRx9drL4lcbK3+eM0Y="
+        },
+        "source-map-loader": {
+          "version": "0.1.6",
+          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.1.6.tgz",
+          "integrity": "sha1-wJkD2m1zueU7ftjuUkVZcFHpjpE="
+        },
         "statuses": {
           "version": "1.2.1",
           "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.2.1.tgz",
@@ -867,11 +882,6 @@
       "resolved": "https://registry.npmjs.org/@microsoft/web-library-build/-/web-library-build-3.2.8.tgz",
       "integrity": "sha1-Nu04s3YW+V7dAVh3WT+eiyJ5PYQ=",
       "dependencies": {
-        "@microsoft/gulp-core-build": {
-          "version": "2.9.3",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.3.tgz",
-          "integrity": "sha1-HJbOC5DAUmm9jMurTY5VskofCVg="
-        },
         "@microsoft/gulp-core-build-karma": {
           "version": "2.3.8",
           "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-karma/-/gulp-core-build-karma-2.3.8.tgz",
@@ -886,6 +896,26 @@
               "version": "2.9.2",
               "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.2.tgz",
               "integrity": "sha1-mx/9pcjNJMZZv0AWUWUUQUztB7s="
+            },
+            "camelcase": {
+              "version": "2.1.1",
+              "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz",
+              "integrity": "sha1-fB0W1nmhu+WcoCys7PsBHiAfWh8="
+            },
+            "cliui": {
+              "version": "3.2.0",
+              "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
+              "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
+            },
+            "window-size": {
+              "version": "0.2.0",
+              "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.2.0.tgz",
+              "integrity": "sha1-tDFbtCFKPXBY6+7okuE/ok2YsHU="
+            },
+            "yargs": {
+              "version": "4.6.0",
+              "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz",
+              "integrity": "sha1-y0BQwBWb+2u2ScD0r1UFJqhGGdw="
             }
           }
         },
@@ -898,6 +928,58 @@
               "version": "2.9.2",
               "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.2.tgz",
               "integrity": "sha1-mx/9pcjNJMZZv0AWUWUUQUztB7s="
+            },
+            "camelcase": {
+              "version": "2.1.1",
+              "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz",
+              "integrity": "sha1-fB0W1nmhu+WcoCys7PsBHiAfWh8="
+            },
+            "cliui": {
+              "version": "3.2.0",
+              "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
+              "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
+            },
+            "window-size": {
+              "version": "0.2.0",
+              "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.2.0.tgz",
+              "integrity": "sha1-tDFbtCFKPXBY6+7okuE/ok2YsHU="
+            },
+            "yargs": {
+              "version": "4.6.0",
+              "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz",
+              "integrity": "sha1-y0BQwBWb+2u2ScD0r1UFJqhGGdw="
+            }
+          }
+        },
+        "@microsoft/gulp-core-build-typescript": {
+          "version": "3.3.2",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.3.2.tgz",
+          "integrity": "sha1-EH8TFHtgW28sUP6rYZTPp9+po4s=",
+          "dependencies": {
+            "@microsoft/gulp-core-build": {
+              "version": "2.9.2",
+              "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.2.tgz",
+              "integrity": "sha1-mx/9pcjNJMZZv0AWUWUUQUztB7s="
+            },
+            "camelcase": {
+              "version": "2.1.1",
+              "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz",
+              "integrity": "sha1-fB0W1nmhu+WcoCys7PsBHiAfWh8="
+            },
+            "cliui": {
+              "version": "3.2.0",
+              "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
+              "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
+            },
+            "window-size": {
+              "version": "0.2.0",
+              "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.2.0.tgz",
+              "integrity": "sha1-tDFbtCFKPXBY6+7okuE/ok2YsHU="
+            },
+            "yargs": {
+              "version": "4.6.0",
+              "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz",
+              "integrity": "sha1-y0BQwBWb+2u2ScD0r1UFJqhGGdw="
             }
           }
         },
@@ -910,6 +992,26 @@
               "version": "2.9.2",
               "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.2.tgz",
               "integrity": "sha1-mx/9pcjNJMZZv0AWUWUUQUztB7s="
+            },
+            "camelcase": {
+              "version": "2.1.1",
+              "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz",
+              "integrity": "sha1-fB0W1nmhu+WcoCys7PsBHiAfWh8="
+            },
+            "cliui": {
+              "version": "3.2.0",
+              "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
+              "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
+            },
+            "window-size": {
+              "version": "0.2.0",
+              "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.2.0.tgz",
+              "integrity": "sha1-tDFbtCFKPXBY6+7okuE/ok2YsHU="
+            },
+            "yargs": {
+              "version": "4.6.0",
+              "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz",
+              "integrity": "sha1-y0BQwBWb+2u2ScD0r1UFJqhGGdw="
             }
           }
         },
@@ -953,6 +1055,11 @@
           "resolved": "https://registry.npmjs.org/diff/-/diff-3.2.0.tgz",
           "integrity": "sha1-yc45Okt8vQsFinJck98pkCeGj/k="
         },
+        "glob": {
+          "version": "7.1.1",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz",
+          "integrity": "sha1-gFIR3wT6rxxjo2ADBs31reULLsg="
+        },
         "interpret": {
           "version": "0.6.6",
           "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz",
@@ -983,14 +1090,7 @@
         "mocha": {
           "version": "3.4.2",
           "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.4.2.tgz",
-          "integrity": "sha1-0O9NMyEm2/GNDWQMmzgt1IvpdZQ=",
-          "dependencies": {
-            "glob": {
-              "version": "7.1.1",
-              "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz",
-              "integrity": "sha1-gFIR3wT6rxxjo2ADBs31reULLsg="
-            }
-          }
+          "integrity": "sha1-0O9NMyEm2/GNDWQMmzgt1IvpdZQ="
         },
         "ms": {
           "version": "0.7.2",
@@ -1043,11 +1143,6 @@
               "version": "0.2.10",
               "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz",
               "integrity": "sha1-trvgsGdLnXGXCMo43owjfLUmw9E="
-            },
-            "yargs": {
-              "version": "3.10.0",
-              "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
-              "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
             }
           }
         },
@@ -1065,6 +1160,11 @@
           "version": "0.0.2",
           "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
           "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
+        },
+        "yargs": {
+          "version": "3.10.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
+          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
         }
       }
     },
@@ -1795,6 +1895,51 @@
         }
       }
     },
+    "@rush-temp/merge-styles": {
+      "version": "file:projects/merge-styles",
+      "dependencies": {
+        "async": {
+          "version": "0.9.2",
+          "bundled": true
+        },
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
+        "debug": {
+          "version": "2.6.0",
+          "bundled": true
+        },
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
+        },
+        "glob": {
+          "version": "7.1.1",
+          "bundled": true
+        },
+        "mocha": {
+          "version": "3.3.0",
+          "bundled": true
+        },
+        "ms": {
+          "version": "0.7.2",
+          "bundled": true
+        },
+        "source-map": {
+          "version": "0.1.43",
+          "bundled": true
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "bundled": true
+        },
+        "supports-color": {
+          "version": "3.1.2",
+          "bundled": true
+        }
+      }
+    },
     "@rush-temp/office-ui-fabric-react": {
       "version": "file:projects/office-ui-fabric-react",
       "dependencies": {
@@ -3472,9 +3617,9 @@
       }
     },
     "babel-code-frame": {
-      "version": "6.22.0",
-      "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.22.0.tgz",
-      "integrity": "sha1-AnYgvuVnqIwyVhV05/0IAdMxGOQ="
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
+      "integrity": "sha1-Y/1D99weO7fONZR9uP42mj9Yx0s="
     },
     "backo2": {
       "version": "1.0.2",
@@ -4575,9 +4720,9 @@
       "integrity": "sha1-s55/HabrCnW6nBcySzR1PEfgZU0="
     },
     "dns-packet": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.2.1.tgz",
-      "integrity": "sha512-eisukPHpsFmhEIDnm2mECIiT0huapmdkC0AH1Lvt613Kz2v1kwolrkecvguFazrqnpxvgYdtcMFTsmQzAeRXZQ=="
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.2.2.tgz",
+      "integrity": "sha512-kN+DjfGF7dJGUL7nWRktL9Z18t1rWP3aQlyZdY8XlpvU3Nc6GeFTQApftcjtWKxAZfiggZSGrCEoszNgvnpwDg=="
     },
     "dns-txt": {
       "version": "2.0.2",
@@ -8339,9 +8484,9 @@
       "integrity": "sha1-JKwXdDPkou6REP5DWAutBZ+gBQk="
     },
     "office-ui-fabric-react": {
-      "version": "4.33.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.33.0.tgz",
-      "integrity": "sha512-wgPdX4jU+GFcselCpEtSAfBnyDzVH0Hg5WnVhW08XUQM9nuT92DKfVoxq3BfL/6164DG7yIbVVTzfgD2aJWjGw=="
+      "version": "4.34.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.34.0.tgz",
+      "integrity": "sha512-23twEIf81GH6qro92oAve7ZG1MVDxBgtOuKR3Rq3e/Z/LIGF/OWGRyetmHe0+k9Tpzw7sLUud+3KG7IEZ98LSg=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -9400,9 +9545,9 @@
       "integrity": "sha1-VNvzd+UUQKypCkzSdGANP/LYiKk="
     },
     "remove-trailing-separator": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.0.2.tgz",
-      "integrity": "sha1-abBi2XhyetFNxrVrpKt3L9jXBRE="
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.1.0.tgz",
+      "integrity": "sha1-wkvOKig62tW8P1jg1IJJuSN52O8="
     },
     "repeat-element": {
       "version": "1.1.2",
@@ -9969,9 +10114,9 @@
       "integrity": "sha1-dc449SvwczxafwwRjYEzSiu19BI="
     },
     "source-map-loader": {
-      "version": "0.1.6",
-      "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.1.6.tgz",
-      "integrity": "sha1-wJkD2m1zueU7ftjuUkVZcFHpjpE=",
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz",
+      "integrity": "sha1-SBJr6SML1H+tBeRqjDwuPS2r5Qc=",
       "dependencies": {
         "async": {
           "version": "0.9.2",
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 24787b6fc863e..5340d7d42f1a9 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -30,14 +30,14 @@
     "enzyme": "^2.7.0",
     "es6-promise": "^4.1.0",
     "gulp": "~3.9.1",
-    "mocha": "~3.3.0",
+    "mocha": "^3.3.0",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
     "react-dom": "^15.4.2",
     "sass-loader": "^6.0.3",
     "style-loader": "^0.17.0",
-    "source-map-loader": "0.2.1",
+    "source-map-loader": "^0.2.1",
     "ts-loader": "^2.1.0",
     "typescript": "2.4.2",
     "webpack-dev-server": "^2.4.1",
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index d2229297a849b..0b0d887b9bf47 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -41,7 +41,7 @@
     "gutil": "1.6.4",
     "highlight.js": "^9.6.0",
     "load-themed-styles-loader": "^0.0.3",
-    "mocha": "^3.2.0",
+    "mocha": "^3.3.0",
     "mocha-loader": "^1.1.1",
     "node-sass": "^4.5.0",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
@@ -53,7 +53,7 @@
     "react-highlight": "0.9.0",
     "sass-loader": "^6.0.3",
     "sinon": "^2.3.2",
-    "source-map-loader": "0.2.1",
+    "source-map-loader": "^0.2.1",
     "style-loader": "^0.17.0",
     "ts-loader": "^2.0.1",
     "typescript": "2.4.2",
diff --git a/packages/merge-styles/.npmignore b/packages/merge-styles/.npmignore
new file mode 100644
index 0000000000000..b632939d809a6
--- /dev/null
+++ b/packages/merge-styles/.npmignore
@@ -0,0 +1,22 @@
+*.config.js
+*.nuspec
+*.yml
+*.test.*
+.editorconfig
+.gitattributes
+.gitignore
+.vscode
+coverage
+dist/*.stats.html
+dist/demo*.*
+gulpfile.js
+index.html
+jsconfig.json
+karma.config.js
+node_modules
+src
+tsconfig.json
+tsd.json
+tslint.json
+typings
+webpack.config.js
diff --git a/packages/merge-styles/.npmrc b/packages/merge-styles/.npmrc
new file mode 100644
index 0000000000000..825c83e09df4d
--- /dev/null
+++ b/packages/merge-styles/.npmrc
@@ -0,0 +1,2 @@
+registry=https://registry.npmjs.org/
+
diff --git a/packages/merge-styles/LICENSE b/packages/merge-styles/LICENSE
new file mode 100644
index 0000000000000..310f6231e35c5
--- /dev/null
+++ b/packages/merge-styles/LICENSE
@@ -0,0 +1,15 @@
+Office UI Fabric React - merge-styles
+
+Copyright (c) Microsoft Corporation
+
+All rights reserved.
+
+MIT License
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the ""Software""), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED *AS IS*, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
+Note: Usage of the fonts and icons referenced in Office UI Fabric is subject to the terms listed at http://aka.ms/fabric-assets-license
\ No newline at end of file
diff --git a/packages/merge-styles/README.md b/packages/merge-styles/README.md
new file mode 100644
index 0000000000000..8ab309149676f
--- /dev/null
+++ b/packages/merge-styles/README.md
@@ -0,0 +1,305 @@
+# [merge-styles](http://dev.office.com/fabric)
+
+The `merge-styles` library provides utilities for loading styles through javascript. It is designed to make it simple to style components through javascript. It generates css classes, rather than using inline styling, to ensure we can use css features like pseudo selectors (:hover) and parent/child selectors (media queries).
+
+The library was built for speed and size; the entire package is 2.62k gzipped. It has no dependencies other than `tslib`.
+
+The basic idea is to provide a method which can take in one or more style objects css styling javascript objects representing the styles for a given element, and return a single class name. If the same set of styling is passed in, the same name returns and nothing is re-registered.
+
+## Motivation
+
+Defining rules at runtime has a number of benefits over traditional build time staticly produced css:
+
+* Only register classes that are needed, when they're needed, reducing the overall selector count and improving TTG.
+
+* Dynamically create new class permutations based on contextual theming requirements. (Use a different theme inside of a DIV without downloading multiple copies of the css rule definitions.)
+
+* Use JavaScript to define the class content (using utilities like color converters, or reusing constant numbers becomes possible.)
+
+* Allow control libraries to merge customized styling in with their rules, avoiding complexities like css selector specificity.
+
+* Simplify RTL processing; lefts become rights in RTL, in the actual rules. No complexity like `html[dir=rtl]` prefixes necessary, which alleviates unexpected specificity bugs. (You can use `/* noflip */` comments to avoid flipping if needed.)
+
+* Reduce bundle size. Automatically handles vendor prefixing, unit providing, RTL flipping, and margin/padding expansion (e.g. margin will automatically expand out to margin TRBL, so that we avoid specificity problems when merging things together.)
+
+* Reduce the build time overhead of running through CSS preprocessors.
+
+* TypeScript type safety; spell "background" wrong and get build breaks.
+
+## What tradeoffs are there? Are there downsides to using JavaScript to process styling?
+
+In static solutions, there is very little runtime evaluation required; everything is injected as-is. Things like auto prefixing and language specific processing like sass mixins are all evaluated at build time.
+
+In runtime styling, much of this is evaluated in the browser, so you are paying a cost in doing this. However, with performance optimizations like memoization, you can minimize this quite a bit, and you gain all of the robustness enumerated above.
+
+# API
+
+The api surfaces consists of 3 methods and a handful of interfaces:
+
+`mergeStyles(..args[]: IStyle[]): string` - Takes in one or more style objects, merges them in the right order, and produces a single css class name which can be injected into any component.
+
+`mergeStyleSet(...args[]: IStyleSet[]): { [key: string]: string }` - Takes in one or more style set objects, each consisting of a set of areas, each which will produce a class name. Using this is analogous to calling mergeStyles for each property in the object, but ensures we maintain the set ordering when multiple style sets are merged.
+
+`concatStyleSet(...args[]: IStyleSet[]): IStyleSet` - In some cases you simply need to combine style sets, without actually generating class names (it is costs in performance to generate class names.) This tool returns a single set merging many together.
+
+## Vocabulary
+
+A **style object** represents the collection of css rules, except that the names are camelCased rather than kebab-cased. Example:
+
+```tsx
+let style = {
+  backgroundColor: 'red',
+  left: 42
+};
+```
+
+Additionally, **style objects** can contain selectors under the `selectors` property:
+
+```tsx
+let style = {
+  backgroundColor: 'red',
+  selectors: {
+    ':hover': {
+      backgroundColor: 'blue';
+    },
+    '.parent &': { /* parent selector */ },
+    '& .child': { /* child selector */ }
+  }
+};
+```
+
+A **style set** represents a map of area to style object. When building a component, you need to generate a class name for each element that requires styling. You would defint this in a **style set**.
+
+```tsx
+let styleSet = {
+  root: { background: 'red' },
+  button: { margin: 42 }
+}
+```
+
+## Basic usage
+
+When building a component, you will need a **style set** map of class names to inject into your elements' class attributes.
+
+The recommended pattern is to provide the classnames in a separate function, typically in a separate file `ComponentName.classNames.ts`.
+
+```tsx
+import { IStyle, mergeStyleSets } from '@uifabric/merge-styles';
+
+export interface IComponentClassNames {
+  root: string;
+  button: string;
+  buttonIcon: string;
+}
+
+export const getClassNames = (): IComponentClassNames => {
+  return mergeStyleSets({
+    root: {
+        background: 'red'
+      }
+    ),
+
+    button: {
+      backgroundColor: 'green',
+    },
+
+    buttonIcon: {
+      margin: 10
+    }
+  });
+};
+```
+
+The class map can then be used in a component:
+
+```tsx
+import { getClassNames } from './MyComponent.classNames';
+
+export const MyComponent = () => {
+  let { root, button, buttonIcon } = getClassNames();
+
+  return (
+    <div className={ root }>
+      <button className={ button }>
+        <i className={ buttonIcon } />
+      </button>
+    </div>
+  );
+};
+```
+
+## Selectors
+
+Custom selectors can be defined within `IStyle` definitions under the `selectors` section:
+
+```tsx
+{
+  background: 'red',
+  selectors: {
+    ':hover': {
+      background: 'green'
+    }
+  }
+}
+```
+
+By default, the rule will be appended to the current selector scope. That is, in the above scenario, there will be 2 rules inserted when using `mergeRules`:
+
+```css
+.css-0 { background: red; }
+.css-0:hover { background: green; }
+```
+
+In some cases, you may need to use parent or child selectors. To do so, you can define a selector from scratch and use the `&` character to represent the generated class name. When using the `&`, the current scope is ignored. Example:
+
+```tsx
+{
+  selectors: {
+    // selector relative to parent
+    '.ms-Fabric.is-focusVisible &': {
+      background: 'red'
+    }
+    // selector for child
+    '& .child' {
+      background: 'green'
+    }
+  }
+}
+```
+
+This would register the rules:
+
+```css
+.ms-Fabric.is-focusVisible .css-0 { background: red; }
+.css-0 .child { background: green; }
+```
+
+## Custom class names
+
+By default class names that are generated will use the prefix `css-` followed by a number, creating unique rules where needed.
+
+While this prefix is fine, sometimes a more readable prefix is desired. You can pass in a `displayName` to resolve this:
+
+```tsx
+{
+  displayName: 'MyComponent',
+  background: 'red'
+}
+```
+
+This generates:
+
+```css
+.MyComponent-0 { background: red; }
+```
+
+## Managing conditionals and states
+
+Style objects can be represented by a simple object, but also can be an array of the objects. The merge functions will handle arrays and merge things together in the given order. They will also ignore falsey values, allowing you to conditionalize the results.
+
+In the following example, the root class generated will be different depending on the `isToggled` state:
+
+```tsx
+export const getClassNames = (
+  isToggled: boolean
+): IComponentClassNames => {
+
+  return mergeStyleSet({
+    root: [
+      {
+        background: 'red'
+      },
+      isToggled && {
+        background: 'green'
+      }
+    ]
+  })
+};
+```
+
+## Optimizing for performance
+
+Resolving the class names on every render can be an unwanted expense especially in hot spots where things are rendered frequently. To optimize, we recommend 2 guidelines:
+
+1. For your `getClassNames` function, flatten all input parameters into simple immutable values. This helps the `memoizeFunction` utility to cache the results based on the input.
+
+2. Use the `memoizeFunction` function from the `@uifabric/utilities` package to cache the results, given a unique combination of inputs. Example:
+
+```tsx
+import { memoizeFunction } from '@uifabric/utilities';
+
+export const getClassNames = memoizeFunction((
+  isToggled: boolean
+) => {
+  return mergeStyleSet({
+    // ...
+  });
+});
+```
+
+## Registering fonts
+
+Registering font faces example:
+
+```tsx
+import { fontFace } from '@uifabric/merge-styles';
+
+fontFace({
+  fontFamily: `"Segoe UI"`,
+  src: `url("//cdn.com/fontface.woff2) format(woff2)`,
+  fontWeight: "normal"
+});
+```
+
+Note that in cases like `fontFamily` you may need to embed quotes in the string as shown above.
+
+## Registering keyframes
+
+Registering animation keyframes example:
+
+```tsx
+import { keyframes, mergeStyleSets } from '@uifabric/merge-styles';
+
+let fadeIn = keyframes({
+  "from": {
+    opacity: 0
+  },
+  "to": {
+    opacity: 1
+  }
+});
+
+export const getClassNames = () => {
+  return mergeStyleSets({
+    root: {
+      animationName: fadeIn
+    }
+  });
+};
+```
+
+## Server-side rendering
+
+You can import `renderStatic` method from the `/lib/server` entry to render content and extract the css rules that would have been registered, as a string.
+
+Example:
+
+```tsx
+import { renderStatic } from '@uifabric/merge-styles/lib/server';
+
+let { html, css } = renderStatic(() => {
+  return ReactDOM.renderToString(...);
+});
+```
+
+Caveats for server-side rendering (TODOs):
+
+* Currently font face definitions and keyframes won't be included in the result.
+
+* Using the `memoizeFunction` utility may short circuit calling merge-styles APIs to register styles, which may cause the helper here to skip returning css. This can be fixed, but it is currently a known limitation.
+
+* Until all Fabric components use the merge-styles library, this will only return a subset of the styling. Also a known limitation and work in progress.
+
+* The rehydration logic has not yet been implemented, so we may run into issues when you rehydrate.
+
+* Only components which USE mergeStyles will have their css included. In Fabric, not all components have been converted from using SASS yet.
diff --git a/packages/merge-styles/api/merge-styles.api.ts b/packages/merge-styles/api/merge-styles.api.ts
new file mode 100644
index 0000000000000..9c43cf64f8329
--- /dev/null
+++ b/packages/merge-styles/api/merge-styles.api.ts
@@ -0,0 +1,303 @@
+// @public
+export function concatStyleSets < T extends object >(...args: (T | false | null | undefined)[]): T;
+
+// @public
+export function fontFace(font: IFontFace): void;
+
+// @public
+interface IExtendedRawStyle extends IRawStyle {
+  displayName?: string;
+  selectors?: {
+    [ key: string ]: IStyle;
+  }
+}
+
+// @public
+interface IFontFace extends IRawFontStyle {
+  fontFeatureSettings?: string;
+  src?: string;
+  unicodeRange?: ICSSRule | string;
+}
+
+// @public
+enum InjectionMode {
+  insertNode = 1,
+  none = 0
+}
+
+// @public
+interface IRawStyle extends IRawFontStyle {
+  alignContent?: ICSSRule | 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'stretch';
+  alignItems?: ICSSRule | 'flex-start' | 'flex-end' | 'center' | 'baseline' | 'stretch';
+  alignmentAdjust?: ICSSRule | string;
+  alignmentBaseline?: ICSSRule | string;
+  alignSelf?: ICSSRule | 'auto' | 'flex-start' | 'flex-end' | 'center' | 'baseline' | 'stretch';
+  animationDelay?: ICSSRule | string;
+  animationDirection?: ICSSRule | string;
+  animationDuration?: ICSSRule | string;
+  animationFillMode?: ICSSRule | 'none' | 'forwards' | 'backwards' | 'both';
+  animationIterationCount?: ICSSRule | string;
+  animationName?: ICSSRule | string;
+  animationPlayState?: ICSSRule | string;
+  animationTimingFunction?: ICSSRule | string;
+  appearance?: ICSSRule | string;
+  backfaceVisibility?: ICSSRule | string;
+  background?: ICSSRule | string;
+  backgroundAttachment?: ICSSRule | 'scroll' | 'fixed' | 'local';
+  backgroundBlendMode?: ICSSRule | string;
+  backgroundColor?: ICSSRule | string;
+  backgroundComposite?: ICSSRule | string;
+  backgroundImage?: ICSSRule | string;
+  backgroundOrigin?: ICSSRule | string;
+  backgroundPosition?: ICSSRule | string;
+  backgroundRepeat?: ICSSRule | string;
+  border?: ICSSRule | 0 | string;
+  borderBottom?: ICSSRule | number | string;
+  borderBottomColor?: ICSSRule | string;
+  borderBottomLeftRadius?: ICSSRule | string;
+  borderBottomRightRadius?: ICSSRule | string;
+  borderBottomStyle?: ICSSRule | string;
+  borderBottomWidth?: ICSSRule | string;
+  borderCollapse?: ICSSRule | string;
+  borderColor?: ICSSRule | string;
+  borderCornerShape?: ICSSRule | string;
+  borderImageSource?: ICSSRule | string;
+  borderImageWidth?: ICSSRule | string;
+  borderLeft?: ICSSRule | number | string;
+  borderLeftColor?: ICSSRule | string;
+  borderLeftStyle?: ICSSRule | string;
+  borderLeftWidth?: ICSSRule | string;
+  borderRadius?: ICSSRule | string;
+  borderRight?: ICSSRule | number | string;
+  borderRightColor?: ICSSRule | string;
+  borderRightStyle?: ICSSRule | string;
+  borderRightWidth?: ICSSRule | string;
+  borderSpacing?: ICSSRule | string;
+  borderStyle?: ICSSRule | string;
+  borderTop?: ICSSRule | number | string;
+  borderTopColor?: ICSSRule | string;
+  borderTopLeftRadius?: ICSSRule | string;
+  borderTopRightRadius?: ICSSRule | string;
+  borderTopStyle?: ICSSRule | string;
+  borderTopWidth?: ICSSRule | string;
+  borderWidth?: ICSSRule | number | string;
+  bottom?: ICSSRule | number | string;
+  boxDecorationBreak?: ICSSRule | string;
+  boxShadow?: ICSSRule | string;
+  boxSizing?: ICSSRule | 'border-box' | 'content-box';
+  breakAfter?: ICSSRule | string;
+  breakBefore?: ICSSRule | string;
+  breakInside?: ICSSRule | string;
+  clear?: ICSSRule | string;
+  clipRule?: ICSSRule | string;
+  color?: ICSSRule | string;
+  columnCount?: ICSSRule | number | 'auto';
+  columnFill?: ICSSRule | string;
+  columnGap?: ICSSRule | string;
+  columnRule?: ICSSRule | string;
+  columnRuleColor?: ICSSRule | string;
+  columnRuleWidth?: ICSSRule | string;
+  columns?: ICSSRule | string;
+  columnSpan?: ICSSRule | string;
+  columnWidth?: ICSSRule | string;
+  content?: string;
+  counterIncrement?: ICSSRule | string;
+  counterReset?: ICSSRule | string;
+  cue?: ICSSRule | string;
+  cueAfter?: ICSSRule | string;
+  cursor?: ICSSRule | string;
+  direction?: ICSSRule | string;
+  display?: ICSSRule | string;
+  fill?: ICSSRule | string;
+  fillOpacity?: ICSSRule | number;
+  fillRule?: ICSSRule | string;
+  filter?: ICSSRule | string;
+  flex?: ICSSRule | number | string;
+  flexBasis?: ICSSRule | string;
+  flexDirection?: ICSSRule | 'row' | 'row-reverse' | 'column' | 'column-reverse';
+  flexFlow?: ICSSRule | string;
+  flexGrow?: ICSSRule | number;
+  flexOrder?: ICSSRule | string;
+  flexShrink?: ICSSRule | number;
+  flexWrap?: ICSSRule | 'nowrap' | 'wrap' | 'wrap-reverse';
+  float?: ICSSRule | string;
+  flowFrom?: ICSSRule | string;
+  gridArea?: ICSSRule | string;
+  gridColumn?: ICSSRule | string;
+  gridColumnEnd?: ICSSRule | string;
+  gridColumnStart?: ICSSRule | string;
+  gridRow?: ICSSRule | string;
+  gridRowEnd?: ICSSRule | string;
+  gridRowPosition?: ICSSRule | string;
+  gridTemplateAreas?: ICSSRule | string;
+  gridTemplateColumns?: ICSSRule | string;
+  gridTemplateRows?: ICSSRule | string;
+  height?: ICSSRule | string;
+  hyphenateLimitChars?: ICSSRule | string;
+  hyphenateLimitLines?: ICSSRule | string;
+  hyphenateLimitZone?: ICSSRule | string;
+  hyphens?: ICSSRule | string;
+  justifyContent?: ICSSRule | 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly';
+  left?: ICSSRule | number | string;
+  letterSpacing?: ICSSRule | string;
+  lineHeight?: ICSSRule | 'normal' | number | ICSSLengthRule | ICSSPercentageRule;
+  listStyle?: ICSSRule | string;
+  listStyleImage?: ICSSRule | string;
+  listStylePosition?: ICSSRule | string;
+  listStyleType?: ICSSRule | string;
+  margin?: ICSSRule | number | string;
+  marginBottom?: ICSSRule | number | string;
+  marginLeft?: ICSSRule | number | string;
+  marginRight?: ICSSRule | number | string;
+  marginTop?: ICSSRule | number | string;
+  marqueeDirection?: ICSSRule | string;
+  marqueeStyle?: ICSSRule | string;
+  mask?: ICSSRule | string;
+  maskBorder?: ICSSRule | string;
+  maskBorderRepeat?: ICSSRule | string;
+  maskBorderSlice?: ICSSRule | string;
+  maskBorderSource?: ICSSRule | string;
+  maskBorderWidth?: ICSSRule | string;
+  maskClip?: ICSSRule | string;
+  maskOrigin?: ICSSRule | string;
+  maxFontSize?: ICSSRule | string;
+  maxHeight?: ICSSRule | string;
+  maxWidth?: ICSSRule | string;
+  minHeight?: ICSSRule | string;
+  minWidth?: ICSSRule | string;
+  MozFontSmoothing?: string;
+  opacity?: ICSSRule | number;
+  order?: ICSSRule | number;
+  orphans?: ICSSRule | number;
+  outline?: ICSSRule | 0 | string;
+  outlineColor?: ICSSRule | string;
+  outlineOffset?: ICSSRule | string;
+  overflow?: ICSSRule | 'auto' | 'hidden' | 'scroll' | 'visible';
+  overflowStyle?: ICSSRule | string;
+  overflowWrap?: ICSSRule | 'normal' | 'break-word';
+  overflowX?: ICSSRule | 'auto' | 'hidden' | 'scroll' | 'visible';
+  overflowY?: ICSSRule | 'auto' | 'hidden' | 'scroll' | 'visible';
+  padding?: ICSSRule | number | string;
+  paddingBottom?: ICSSRule | number | string;
+  paddingLeft?: ICSSRule | number | string;
+  paddingRight?: ICSSRule | number | string;
+  paddingTop?: ICSSRule | number | string;
+  pageBreakAfter?: ICSSRule | string;
+  pageBreakBefore?: ICSSRule | string;
+  pageBreakInside?: ICSSRule | string;
+  pause?: ICSSRule | string;
+  pauseAfter?: ICSSRule | string;
+  pauseBefore?: ICSSRule | string;
+  perspective?: ICSSRule | string;
+  perspectiveOrigin?: ICSSRule | string;
+  pointerEvents?: ICSSRule | string;
+  position?: ICSSRule | 'static' | 'relative' | 'absolute' | 'fixed' | 'sticky';
+  quotes?: ICSSRule | string;
+  regionFragment?: ICSSRule | string;
+  restAfter?: ICSSRule | string;
+  restBefore?: ICSSRule | string;
+  right?: ICSSRule | number | string;
+  shapeImageThreshold?: ICSSRule | string;
+  shapeInside?: ICSSRule | string;
+  shapeMargin?: ICSSRule | string;
+  shapeOutside?: ICSSRule | string;
+  speak?: ICSSRule | string;
+  speakAs?: ICSSRule | string;
+  strokeOpacity?: ICSSRule | number;
+  strokeWidth?: ICSSRule | ICSSPercentageRule | ICSSLengthRule;
+  tableLayout?: ICSSRule | string;
+  tabSize?: ICSSRule | string;
+  textAlign?: ICSSRule | string;
+  textAlignLast?: ICSSRule | string;
+  textDecoration?: ICSSRule | string;
+  textDecorationColor?: ICSSRule | string;
+  textDecorationLine?: ICSSRule | string;
+  textDecorationSkip?: ICSSRule | string;
+  textDecorationStyle?: ICSSRule | string;
+  textEmphasis?: ICSSRule | string;
+  textEmphasisColor?: ICSSRule | string;
+  textEmphasisStyle?: ICSSRule | string;
+  textHeight?: ICSSRule | string;
+  textIndent?: ICSSRule | string;
+  textOverflow?: ICSSRule | string;
+  textOverline?: ICSSRule | string;
+  textOverlineColor?: ICSSRule | string;
+  textOverlineMode?: ICSSRule | string;
+  textOverlineStyle?: ICSSRule | string;
+  textOverlineWidth?: ICSSRule | string;
+  textRendering?: ICSSRule | string;
+  textShadow?: ICSSRule | string;
+  textTransform?: ICSSRule | string;
+  textUnderlinePosition?: ICSSRule | string;
+  textUnderlineStyle?: ICSSRule | string;
+  top?: ICSSRule | number | string;
+  touchAction?: ICSSRule | string;
+  transform?: ICSSRule | string;
+  transformOrigin?: ICSSRule | string;
+  transformOriginZ?: ICSSRule | string;
+  transformStyle?: ICSSRule | string;
+  transition?: ICSSRule | string;
+  transitionDelay?: ICSSRule | string;
+  transitionDuration?: ICSSRule | string;
+  transitionProperty?: ICSSRule | string;
+  transitionTimingFunction?: ICSSRule | string;
+  unicodeBidi?: ICSSRule | string;
+  userFocus?: ICSSRule | string;
+  userInput?: ICSSRule | string;
+  userSelect?: ICSSRule | 'none' | 'auto' | 'text' | 'all' | 'contain';
+  verticalAlign?: ICSSRule | string;
+  visibility?: ICSSRule | string;
+  voiceBalance?: ICSSRule | string;
+  voiceDuration?: ICSSRule | string;
+  voiceFamily?: ICSSRule | string;
+  voicePitch?: ICSSRule | string;
+  voiceRange?: ICSSRule | string;
+  voiceRate?: ICSSRule | string;
+  voiceStress?: ICSSRule | string;
+  voiceVolume?: ICSSRule | string;
+  WebkitFontSmoothing?: 'none' | 'antialiased' | 'grayscale' | 'subpixel-antialiased';
+  whiteSpace?: ICSSRule | string;
+  widows?: ICSSRule | number;
+  width?: ICSSRule | string;
+  wordBreak?: ICSSRule | string;
+  wordSpacing?: ICSSRule | string;
+  wordWrap?: ICSSRule | string;
+  wrapFlow?: ICSSRule | string;
+  wrapMargin?: ICSSRule | string;
+  writingMode?: ICSSRule | string;
+  zIndex?: ICSSRule | 'auto' | number;
+  zoom?: ICSSRule | 'auto' | number | ICSSPercentageRule;
+}
+
+// @public
+interface IStyleSheetConfig {
+  injectionMode?: InjectionMode;
+}
+
+// @public
+export function keyframes(timeline: { [key: string]: {} }): string;
+
+// @public
+export function mergeStyles(...args: (IStyle | IStyle[])[]): string;
+
+// @public
+export function mergeStyleSets < T extends object >(...cssSets: T[]): {[P in keyof T]?: string };
+
+// @public
+class Stylesheet {
+  constructor(config?: IStyleSheetConfig);
+  public argsFromClassName(className: string): IStyle[] | undefined;
+  public cacheClassName(className: string, key: string, args: IStyle[]): void;
+  public classNameFromKey(key: string): string | undefined;
+  public getClassName(displayName?: string): string;
+  public static getInstance(): Stylesheet;
+  public getRules(): string;
+  public insertRule(rule: string): void;
+  public reset(): void;
+  public setConfig(config?: IStyleSheetConfig): void;
+}
+
+// WARNING: Unsupported export: IStyle
+// WARNING: Unsupported export: IStyleSet
+// WARNING: Unsupported export: IFontWeight
+// (No packageDescription for this package)
diff --git a/packages/merge-styles/config/api-extractor.json b/packages/merge-styles/config/api-extractor.json
new file mode 100644
index 0000000000000..9c294e8c13388
--- /dev/null
+++ b/packages/merge-styles/config/api-extractor.json
@@ -0,0 +1,6 @@
+{
+  "enabled": true,
+  "apiReviewFolder": "./api",
+  "apiJsonFolder": "./temp",
+  "entry": "src/index.ts"
+}
\ No newline at end of file
diff --git a/packages/merge-styles/gulpfile.js b/packages/merge-styles/gulpfile.js
new file mode 100644
index 0000000000000..6b32bac66ed9b
--- /dev/null
+++ b/packages/merge-styles/gulpfile.js
@@ -0,0 +1,44 @@
+'use strict';
+
+let gulp = require('gulp');
+let path = require('path');
+let build = require('@microsoft/web-library-build');
+let buildConfig = build.getConfig();
+
+let isProduction = process.argv.indexOf('--production') >= 0;
+let isClean = process.argv.indexOf('clean') >= 0;
+
+// initialize tasks.
+build.initialize(gulp);
+
+/* Configure lint rules */
+let rules = Object.assign(
+  {},
+  require('./node_modules/@microsoft/gulp-core-build-typescript/lib/defaultTslint.json').rules,
+  require('./node_modules/office-ui-fabric-react-tslint/tslint.json').rules,
+  require('./tslint.json').rules
+);
+build.tslint.setConfig({
+  lintConfig: { rules },
+  displayAsWarning: false
+});
+
+// Configure TypeScript.
+build.TypeScriptConfiguration.setTypescriptCompiler(require('typescript'));
+
+// Disable unnecessary steps.
+build.preCopy.isEnabled = () => false;
+build.postCopy.isEnabled = () => false;
+build.text.isEnabled = () => false;
+build.sass.isEnabled = () => false;
+
+let packageFolder = buildConfig.packageFolder || '';
+let distFolder = buildConfig.distFolder;
+
+if (isProduction || isClean) {
+  build.setConfig({
+    libAMDFolder: path.join(packageFolder, 'lib-amd')
+  });
+}
+
+build.task('tslint', build.tslint);
diff --git a/packages/merge-styles/karma.config.js b/packages/merge-styles/karma.config.js
new file mode 100644
index 0000000000000..a706b978e8741
--- /dev/null
+++ b/packages/merge-styles/karma.config.js
@@ -0,0 +1,111 @@
+'use strict';
+
+// Karma configuration
+// Generated on Thu Oct 08 2015 18:13:05 GMT-0700 (PDT)
+
+let path = require('path');
+let build = require('@microsoft/web-library-build');
+let buildConfig = build.getConfig();
+let configResources = build.karma.resources;
+let bindPolyfillPath = configResources.bindPolyfillPath;
+let debugRun = (process.argv.indexOf('--debug') > -1);
+
+module.exports = function (config) {
+  let karmaConfig = {
+
+    // base path that will be used to resolve all patterns (eg. files, exclude)
+    basePath: '.',
+
+    // frameworks to use
+    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
+    frameworks: ['mocha', 'sinon-chai'],
+
+
+    // list of files / patterns to load in the browser
+    files: [bindPolyfillPath].concat([path.join(buildConfig.libFolder, '**', '*.test.js')]),
+
+
+    // list of files to exclude
+    exclude: [],
+
+
+    // webpack config for bundling tests.
+    webpack: {
+      devtool: 'source-map',
+      module: {
+        loaders: [
+          {
+            test: /sinon\.js$/,
+            loader: 'imports?define=>false',
+            enforce: 'pre'
+          },
+          debugRun ? {} : {
+            test: /\.js/,
+            exclude: /(test|node_modules|bower_components)/,
+            loader: configResources.istanbulInstrumenterLoaderPath,
+            enforce: 'post'
+          }
+        ],
+      },
+      externals: {
+        'cheerio': 'window',
+        'react/addons': true,
+        'react/lib/ExecutionEnvironment': true,
+        'react/lib/ReactContext': true
+      },
+      resolve: {
+        modules: [
+          buildConfig.libFolder,
+          'node_modules'
+        ]
+      }
+    },
+
+    webpackMiddleware: {
+      noInfo: true
+    },
+
+    // preprocess matching files before serving them to the browser
+    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
+    preprocessors: {
+      [path.join(buildConfig.libFolder, '/**/*.js')]: ['webpack']
+    },
+
+    plugins: configResources.plugins.concat([
+    ]),
+
+    // test results reporter to use
+    // possible values: 'dots', 'progress'
+    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
+    reporters: ['mocha-clean', 'coverage'],
+
+
+    // web server port
+    port: 9876,
+
+
+    // enable / disable colors in the output (reporters and logs)
+    colors: true,
+
+
+    // level of logging
+    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
+    logLevel: config.LOG_INFO,
+
+
+    // enable / disable watching file and executing tests whenever any file changes
+    autoWatch: false,
+
+
+    // start these browsers
+    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
+    browsers: ['PhantomJS'],
+
+
+    // Continuous Integration mode
+    // if true, Karma captures browsers, runs the tests and exits
+    singleRun: true
+  };
+
+  config.set(karmaConfig);
+};
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
new file mode 100644
index 0000000000000..5b413e8ab5c92
--- /dev/null
+++ b/packages/merge-styles/package.json
@@ -0,0 +1,49 @@
+{
+  "name": "@uifabric/merge-styles",
+  "version": "0.0.1",
+  "description": "Office UI Fabric style loading utilities.",
+  "main": "lib/index.js",
+  "typings": "lib/index.d.ts",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/OfficeDev/office-ui-fabric-react"
+  },
+  "license": "MIT",
+  "scripts": {
+    "build": "gulp",
+    "clean": "gulp clean",
+    "test": "gulp",
+    "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js"
+  },
+  "devDependencies": {
+    "@microsoft/web-library-build": "^3.2.1",
+    "@types/chai": "3.4.35",
+    "@types/enzyme": "2.8.0",
+    "@types/es6-promise": "^0.0.32",
+    "@types/es6-weak-map": "1.2.0",
+    "@types/mocha": "2.2.39",
+    "@types/prop-types": "15.5.1",
+    "@types/react": "15.0.38",
+    "@types/react-addons-test-utils": "0.14.18",
+    "@types/react-dom": "15.5.1",
+    "@types/sinon": "2.2.2",
+    "@types/webpack-env": "1.13.0",
+    "enzyme": "^2.7.0",
+    "es6-map": "^0.1.5",
+    "es6-promise": "^4.1.0",
+    "es6-weak-map": "^2.0.2",
+    "gulp": "~3.9.1",
+    "mocha": "^3.3.0",
+    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
+    "react": "^15.4.2",
+    "react-addons-test-utils": "^15.4.2",
+    "react-dom": "^15.4.2",
+    "sinon": "^2.3.2",
+    "source-map-loader": "^0.2.1",
+    "typescript": "2.4.2",
+    "webpack-bundle-analyzer": "^2.2.1"
+  },
+  "dependencies": {
+    "tslib": "^1.7.1"
+  }
+}
\ No newline at end of file
diff --git a/packages/merge-styles/src/IRawStyle.ts b/packages/merge-styles/src/IRawStyle.ts
new file mode 100644
index 0000000000000..14cc09f493a18
--- /dev/null
+++ b/packages/merge-styles/src/IRawStyle.ts
@@ -0,0 +1,1764 @@
+// See CSS 3 CSS-wide keywords https://www.w3.org/TR/css3-values/#common-keywords
+// See CSS 3 Explicit Defaulting https://www.w3.org/TR/css-cascade-3/#defaulting-keywords
+// "all CSS properties can accept these values"
+export type ICSSRule = 'initial' | 'inherit' | 'unset';
+
+// See CSS 3 <percentage> type https://drafts.csswg.org/css-values-3/#percentages
+export type ICSSPercentageRule = string;
+
+// See CSS 3 <length> type https://drafts.csswg.org/css-values-3/#lengths
+export type ICSSLengthRule = number | string;
+
+export type IFontWeight = ICSSRule | 'normal' | 'bold' | 'bolder' | 'lighter' | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900;
+
+/**
+ * The base font style.
+ */
+export interface IRawFontStyle {
+  /**
+   * The font property is shorthand that allows you to do one of two things: you can
+   * either set up six of the most mature font properties in one line, or you can set
+   *  one of a choice of keywords to adopt a system font setting.
+   */
+  font?: ICSSRule | string;
+
+  /**
+   * The font-family property allows one or more font family names and/or generic family
+   * names to be specified for usage on the selected element(s)' text. The browser then
+   * goes through the list; for each character in the selection it applies the first
+   * font family that has an available glyph for that character.
+   */
+  fontFamily?: ICSSRule | string;
+
+  /**
+   * The font-kerning property allows contextual adjustment of inter-glyph spacing, i.e.
+   * the spaces between the characters in text. This property controls <bold>metric
+   * kerning</bold> - that utilizes adjustment data contained in the font. Optical
+   * Kerning is not supported as yet.
+   */
+  fontKerning?: ICSSRule | string;
+
+  /**
+   * Specifies the size of the font. Used to compute em and ex units.
+   * See CSS 3 font-size property https://www.w3.org/TR/css-fonts-3/#propdef-font-size
+   */
+  fontSize?:
+  | ICSSRule
+  | 'xx-small'
+  | 'x-small'
+  | 'small'
+  | 'medium'
+  | 'large'
+  | 'x-large'
+  | 'xx-large'
+  | 'larger'
+  | 'smaller'
+  | ICSSLengthRule
+  | ICSSPercentageRule;
+
+  /**
+   * The font-size-adjust property adjusts the font-size of the fallback fonts defined
+   * with font-family, so that the x-height is the same no matter what font is used.
+   * This preserves the readability of the text when fallback happens.
+   * See CSS 3 font-size-adjust property
+   * https://www.w3.org/TR/css-fonts-3/#propdef-font-size-adjust
+   */
+  fontSizeAdjust?: ICSSRule | 'none' | number;
+
+  /**
+   * Allows you to expand or condense the widths for a normal, condensed, or expanded
+   * font face.
+   * See CSS 3 font-stretch property
+   * https://drafts.csswg.org/css-fonts-3/#propdef-font-stretch
+   */
+  fontStretch?:
+  | ICSSRule
+  | 'normal'
+  | 'ultra-condensed'
+  | 'extra-condensed'
+  | 'condensed'
+  | 'semi-condensed'
+  | 'semi-expanded'
+  | 'expanded'
+  | 'extra-expanded'
+  | 'ultra-expanded';
+
+  /**
+   * The font-style property allows normal, italic, or oblique faces to be selected.
+   * Italic forms are generally cursive in nature while oblique faces are typically
+   * sloped versions of the regular face. Oblique faces can be simulated by artificially
+   * sloping the glyphs of the regular face.
+   * See CSS 3 font-style property https://www.w3.org/TR/css-fonts-3/#propdef-font-style
+   */
+  fontStyle?: ICSSRule | 'normal' | 'italic' | 'oblique';
+
+  /**
+   * This value specifies whether the user agent is allowed to synthesize bold or
+   *  oblique font faces when a font family lacks bold or italic faces.
+   */
+  fontSynthesis?: ICSSRule | string;
+
+  /**
+   * The font-variant property enables you to select the small-caps font within a font
+   * family.
+   */
+  fontVariant?: ICSSRule | string;
+
+  /**
+   * Fonts can provide alternate glyphs in addition to default glyph for a character.
+   * This property provides control over the selection of these alternate glyphs.
+   */
+  fontVariantAlternates?: ICSSRule | string;
+
+  /**
+   * Specifies the weight or boldness of the font.
+   * See CSS 3 'font-weight' property https://www.w3.org/TR/css-fonts-3/#propdef-font-weight
+   */
+  fontWeight?: IFontWeight;
+}
+
+/**
+ * Font face definition.
+ *
+ * @public
+ */
+export interface IFontFace extends IRawFontStyle {
+  /**
+   * Specifies the src of the font.
+   */
+  src?: string;
+
+  /**
+   * unicode-range allows you to set a specific range of characters to be downloaded
+   * from a font (embedded using @font-face) and made available for use on the current
+   * page.
+   */
+  unicodeRange?: ICSSRule | string;
+
+  /**
+   * Feature settings for the font.
+   */
+  fontFeatureSettings?: string;
+}
+
+/**
+ * All raw style properties.
+ *
+ * @public
+ */
+export interface IRawStyle extends IRawFontStyle {
+  /**
+   * (Moz specific) font smoothing directive.
+   */
+  MozFontSmoothing?: string;
+
+  /**
+   * (Webkit specific) font smoothing directive.
+   */
+  WebkitFontSmoothing?: 'none' | 'antialiased' | 'grayscale' | 'subpixel-antialiased';
+
+  /**
+   * Aligns a flex container's lines within the flex container when there is extra space
+   * in the cross-axis, similar to how justify-content aligns individual items within the main-axis.
+   */
+  alignContent?: ICSSRule | 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'stretch';
+
+  /**
+   * Sets the default alignment in the cross axis for all of the flex container's items,
+   * including anonymous flex items, similarly to how justify-content aligns items along the main axis.
+   */
+  alignItems?: ICSSRule | 'flex-start' | 'flex-end' | 'center' | 'baseline' | 'stretch';
+
+  /**
+   * Allows the default alignment to be overridden for individual flex items.
+   */
+  alignSelf?: ICSSRule | 'auto' | 'flex-start' | 'flex-end' | 'center' | 'baseline' | 'stretch';
+
+  /**
+   * This property allows precise alignment of elements, such as graphics, that do not
+   * have a baseline-table or lack the desired baseline in their baseline-table. With the
+   * alignment-adjust property, the position of the baseline identified by the
+   * alignment-baseline can be explicitly determined. It also determines precisely
+   * the alignment point for each glyph within a textual element.
+   */
+  alignmentAdjust?: ICSSRule | string;
+
+  /**
+   * Specifies how an object is aligned with respect to its parent. This property specifies
+   * which baseline of this element is to be aligned with the corresponding baseline of the
+   * parent. For example, this allows alphabetic baselines in Roman text to stay aligned
+   * across font size changes. It defaults to the baseline with the same name as the computed
+   * value of the alignment-baseline property.
+   */
+  alignmentBaseline?: ICSSRule | string;
+
+  /**
+   * Defines a length of time to elapse before an animation starts, allowing an animation to begin execution some time after it is applied.
+   */
+  animationDelay?: ICSSRule | string;
+
+  /**
+   * Defines whether an animation should run in reverse on some or all cycles.
+   */
+  animationDirection?: ICSSRule | string;
+
+  /**
+   * Specifies the length an animation takes to finish. Default value is 0, meaning
+   * there will be no animation.
+   */
+  animationDuration?: ICSSRule | string;
+
+  /**
+   * The animation-fill-mode CSS property specifies how a CSS animation should apply
+   * styles to its target before and after its execution.
+   */
+  animationFillMode?: ICSSRule | 'none' | 'forwards' | 'backwards' | 'both';
+
+  /**
+   * Specifies how many times an animation cycle should play.
+   */
+  animationIterationCount?: ICSSRule | string;
+
+  /**
+   * Defines the list of animations that apply to the element.
+   */
+  animationName?: ICSSRule | string;
+
+  /**
+   * Defines whether an animation is running or paused.
+   */
+  animationPlayState?: ICSSRule | string;
+
+  /**
+   * The animation-timing-function specifies the speed curve of an animation.
+   */
+  animationTimingFunction?: ICSSRule | string;
+
+  /**
+   * Allows changing the style of any element to platform-based interface elements or
+   * vice versa.
+   */
+  appearance?: ICSSRule | string;
+
+  /**
+   * Determines whether or not the “back” side of a transformed element is visible when
+   * facing the viewer.
+   */
+  backfaceVisibility?: ICSSRule | string;
+
+  /**
+   * Shorthand property to set the values for one or more of:
+   * background-clip, background-color, background-image,
+   * background-origin, background-position, background-repeat,
+   * background-size, and background-attachment.
+   */
+  background?: ICSSRule | string;
+
+  /**
+   * If a background-image is specified, this property determines
+   * whether that image's position is fixed within the viewport,
+   * or scrolls along with its containing block.
+   * See CSS 3 background-attachment property https://drafts.csswg.org/css-backgrounds-3/#the-background-attachment
+   */
+  backgroundAttachment?: ICSSRule | 'scroll' | 'fixed' | 'local';
+
+  /**
+   * This property describes how the element's background images should blend with each
+   * other and the element's background color. The value is a list of blend modes that
+   * corresponds to each background image. Each element in the list will apply to the
+   * corresponding element of background-image. If a property doesn’t have enough
+   * comma-separated values to match the number of layers, the UA must calculate its
+   * used value by repeating the list of values until there are enough.
+   */
+  backgroundBlendMode?: ICSSRule | string;
+
+  /**
+   * Sets the background color of an element.
+   */
+  backgroundColor?: ICSSRule | string;
+
+  /**
+   * Sets a compositing style for background images and colors.
+   */
+  backgroundComposite?: ICSSRule | string;
+
+  /**
+   * Applies one or more background images to an element. These can be any valid CSS
+   * image, including url() paths to image files or CSS gradients.
+   */
+  backgroundImage?: ICSSRule | string;
+
+  /**
+   * Specifies what the background-position property is relative to.
+   */
+  backgroundOrigin?: ICSSRule | string;
+
+  /**
+   * Sets the position of a background image.
+   */
+  backgroundPosition?: ICSSRule | string;
+
+  /**
+   * Background-repeat defines if and how background images will be repeated after they
+   * have been sized and positioned
+   */
+  backgroundRepeat?: ICSSRule | string;
+
+  /**
+   * Shorthand property that defines the different properties of all four sides of an
+   * element's border in a single declaration. It can be used to set border-width,
+   * border-style and border-color, or a subset of these.
+   */
+  border?: ICSSRule | 0 | string;
+
+  /**
+   * Shorthand that sets the values of border-bottom-color,
+   * border-bottom-style, and border-bottom-width.
+   */
+  borderBottom?: ICSSRule | number | string;
+
+  /**
+   * Sets the color of the bottom border of an element.
+   */
+  borderBottomColor?: ICSSRule | string;
+
+  /**
+   * Defines the shape of the border of the bottom-left corner.
+   */
+  borderBottomLeftRadius?: ICSSRule | string;
+
+  /**
+   * Defines the shape of the border of the bottom-right corner.
+   */
+  borderBottomRightRadius?: ICSSRule | string;
+
+  /**
+   * Sets the line style of the bottom border of a box.
+   */
+  borderBottomStyle?: ICSSRule | string;
+
+  /**
+   * Sets the width of an element's bottom border. To set all four borders, use the
+   * border-width shorthand property which sets the values simultaneously for
+   * border-top-width, border-right-width, border-bottom-width, and border-left-width.
+   */
+  borderBottomWidth?: ICSSRule | string;
+
+  /**
+   * Border-collapse can be used for collapsing the borders between table cells
+   */
+  borderCollapse?: ICSSRule | string;
+
+  /**
+   * The CSS border-color property sets the color of an element's four borders. This
+   * property can have from one to four values, made up of the elementary properties:
+   *      •       border-top-color
+   *      •       border-right-color
+   *      •       border-bottom-color
+   *      •       border-left-color The default color is the currentColor of each of
+   * these values.
+   * If you provide one value, it sets the color for the element. Two values set the
+   * horizontal and vertical values, respectively. Providing three values sets the top,
+   * vertical, and bottom values, in that order. Four values set all for sides: top,
+   * right, bottom, and left, in that order.
+   */
+  borderColor?: ICSSRule | string;
+
+  /**
+   * Specifies different corner clipping effects, such as scoop (inner curves), bevel
+   * (straight cuts) or notch (cut-off rectangles). Works along with border-radius to
+   * specify the size of each corner effect.
+   */
+  borderCornerShape?: ICSSRule | string;
+
+  /**
+   * The property border-image-source is used to set the image to be used instead of
+   * the border style. If this is set to none the border-style is used instead.
+   */
+  borderImageSource?: ICSSRule | string;
+
+  /**
+   * The border-image-width CSS property defines the offset to use for dividing the
+   * border image in nine parts, the top-left corner, central top edge, top-right-corner,
+   * central right edge, bottom-right corner, central bottom edge, bottom-left corner,
+   * and central right edge. They represent inward distance from the top, right, bottom,
+   * and left edges.
+   */
+  borderImageWidth?: ICSSRule | string;
+
+  /**
+   * Shorthand property that defines the border-width, border-style and border-color of
+   * an element's left border in a single declaration. Note that you can use the
+   * corresponding longhand properties to set specific individual properties of the left
+   * border — border-left-width, border-left-style and border-left-color.
+   */
+  borderLeft?: ICSSRule | number | string;
+
+  /**
+   * The CSS border-left-color property sets the color of an element's left border. This
+   *  page explains the border-left-color value, but often you will find it more
+   * convenient to fix the border's left color as part of a shorthand set, either
+   * border-left or border-color. Colors can be defined several ways. For more
+   * information, see Usage.
+   */
+  borderLeftColor?: ICSSRule | string;
+
+  /**
+   * Sets the style of an element's left border. To set all four borders, use the
+   * shorthand property, border-style. Otherwise, you can set the borders individually
+   * with border-top-style, border-right-style, border-bottom-style, border-left-style.
+   */
+  borderLeftStyle?: ICSSRule | string;
+
+  /**
+   * Sets the width of an element's left border. To set all four borders, use the
+   * border-width shorthand property which sets the values simultaneously for
+   * border-top-width, border-right-width, border-bottom-width, and border-left-width.
+   */
+  borderLeftWidth?: ICSSRule | string;
+
+  /**
+   * Defines how round the border's corners are.
+   */
+  borderRadius?: ICSSRule | string;
+
+  /**
+   * Shorthand property that defines the border-width, border-style and border-color of
+   * an element's right border in a single declaration. Note that you can use the
+   * corresponding longhand properties to set specific individual properties of the
+   * right border — border-right-width, border-right-style and border-right-color.
+   */
+  borderRight?: ICSSRule | number | string;
+
+  /**
+   * Sets the color of an element's right border. This page explains the
+   * border-right-color value, but often you will find it more convenient to fix the
+   * border's right color as part of a shorthand set, either border-right or border-color.
+   * Colors can be defined several ways. For more information, see Usage.
+   */
+  borderRightColor?: ICSSRule | string;
+
+  /**
+   * Sets the style of an element's right border. To set all four borders, use the
+   * shorthand property, border-style. Otherwise, you can set the borders individually
+   * with border-top-style, border-right-style, border-bottom-style, border-left-style.
+   */
+  borderRightStyle?: ICSSRule | string;
+
+  /**
+   * Sets the width of an element's right border. To set all four borders, use the
+   * border-width shorthand property which sets the values simultaneously for
+   * border-top-width, border-right-width, border-bottom-width, and border-left-width.
+   */
+  borderRightWidth?: ICSSRule | string;
+
+  /**
+   * Specifies the distance between the borders of adjacent cells.
+   */
+  borderSpacing?: ICSSRule | string;
+
+  /**
+   * Sets the style of an element's four borders. This property can have from one to
+   * four values. With only one value, the value will be applied to all four borders;
+   * otherwise, this works as a shorthand property for each of border-top-style,
+   *  border-right-style, border-bottom-style, border-left-style, where each border
+   *  style may be assigned a separate value.
+   */
+  borderStyle?: ICSSRule | string;
+
+  /**
+   * Shorthand property that defines the border-width, border-style and border-color of
+   * an element's top border in a single declaration. Note that you can use the
+   * corresponding longhand properties to set specific individual properties of the top
+   * border — border-top-width, border-top-style and border-top-color.
+   */
+  borderTop?: ICSSRule | number | string;
+
+  /**
+   * Sets the color of an element's top border. This page explains the border-top-color
+   * value, but often you will find it more convenient to fix the border's top color as
+   * part of a shorthand set, either border-top or border-color.
+   * Colors can be defined several ways. For more information, see Usage.
+   */
+  borderTopColor?: ICSSRule | string;
+
+  /**
+   * Sets the rounding of the top-left corner of the element.
+   */
+  borderTopLeftRadius?: ICSSRule | string;
+
+  /**
+   * Sets the rounding of the top-right corner of the element.
+   */
+  borderTopRightRadius?: ICSSRule | string;
+
+  /**
+   * Sets the style of an element's top border. To set all four borders, use the
+   * shorthand property, border-style. Otherwise, you can set the borders individually
+   * with border-top-style, border-right-style, border-bottom-style, border-left-style.
+   */
+  borderTopStyle?: ICSSRule | string;
+
+  /**
+   * Sets the width of an element's top border. To set all four borders, use the
+   * border-width shorthand property which sets the values simultaneously for
+   * border-top-width, border-right-width, border-bottom-width, and border-left-width.
+   */
+  borderTopWidth?: ICSSRule | string;
+
+  /**
+   * Sets the width of an element's four borders. This property can have from one to
+   * four values. This is a shorthand property for setting values simultaneously for
+   * border-top-width, border-right-width, border-bottom-width, and border-left-width.
+   */
+  borderWidth?: ICSSRule | number | string;
+
+  /**
+   * This property specifies how far an absolutely positioned box's bottom margin edge
+   * is offset above the bottom edge of the box's containing block. For relatively
+   * positioned boxes, the offset is with respect to the bottom edges of the box itself
+   * (i.e., the box is given a position in the normal flow, then offset from that
+   * position according to these properties).
+   */
+  bottom?: ICSSRule | number | string;
+
+  /**
+   * Breaks a box into fragments creating new borders, padding and repeating backgrounds
+   * or lets it stay as a continuous box on a page break, column break, or, for inline
+   * elements, at a line break.
+   */
+  boxDecorationBreak?: ICSSRule | string;
+
+  /**
+   * Cast a drop shadow from the frame of almost any element.
+   * MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow
+   */
+  boxShadow?: ICSSRule | string;
+
+  /**
+   * The CSS box-sizing property is used to alter the default CSS box model used to
+   * calculate width and height of the elements.
+   */
+  boxSizing?: ICSSRule | 'border-box' | 'content-box';
+
+  /**
+   * The CSS break-after property allows you to force a break on multi-column layouts.
+   * More specifically, it allows you to force a break after an element. It allows you
+   * to determine if a break should occur, and what type of break it should be. The
+   * break-after CSS property describes how the page, column or region break behaves
+   * after the generated box. If there is no generated box, the property is ignored.
+   */
+  breakAfter?: ICSSRule | string;
+
+  /**
+   * Control page/column/region breaks that fall above a block of content
+   */
+  breakBefore?: ICSSRule | string;
+
+  /**
+   * Control page/column/region breaks that fall within a block of content
+   */
+  breakInside?: ICSSRule | string;
+
+  /**
+   * The clear CSS property specifies if an element can be positioned next to or must be
+   * positioned below the floating elements that precede it in the markup.
+   */
+  clear?: ICSSRule | string;
+
+  /**
+   * Clipping crops an graphic, so that only a portion of the graphic is rendered, or
+   * filled. This clip-rule property, when used with the clip-path property, defines
+   * which clip rule, or algorithm, to use when filling the different parts of a graphics.
+   */
+  clipRule?: ICSSRule | string;
+
+  /**
+   * The color property sets the color of an element's foreground content (usually text),
+   * accepting any standard CSS color from keywords and hex values to RGB(a) and HSL(a).
+   */
+  color?: ICSSRule | string;
+
+  /**
+   * Describes the number of columns of the element.
+   * See CSS 3 column-count property https://www.w3.org/TR/css3-multicol/#cc
+   */
+  columnCount?: ICSSRule | number | 'auto';
+
+  /**
+   * Specifies how to fill columns (balanced or sequential).
+   */
+  columnFill?: ICSSRule | string;
+
+  /**
+   * The column-gap property controls the width of the gap between columns in multi-column
+   * elements.
+   */
+  columnGap?: ICSSRule | string;
+
+  /**
+   * Sets the width, style, and color of the rule between columns.
+   */
+  columnRule?: ICSSRule | string;
+
+  /**
+   * Specifies the color of the rule between columns.
+   */
+  columnRuleColor?: ICSSRule | string;
+
+  /**
+   * Specifies the width of the rule between columns.
+   */
+  columnRuleWidth?: ICSSRule | string;
+
+  /**
+   * The column-span CSS property makes it possible for an element to span across all
+   * columns when its value is set to all. An element that spans more than one column
+   * is called a spanning element.
+   */
+  columnSpan?: ICSSRule | string;
+
+  /**
+   * Specifies the width of columns in multi-column elements.
+   */
+  columnWidth?: ICSSRule | string;
+
+  /**
+   * This property is a shorthand property for setting column-width and/or column-count.
+   */
+  columns?: ICSSRule | string;
+
+  /**
+   * Content for pseudo selectors.
+   */
+  content?: string;
+
+  /**
+   * The counter-increment property accepts one or more names of counters (identifiers),
+   * each one optionally followed by an integer which specifies the value by which the
+   * counter should be incremented (e.g. if the value is 2, the counter increases by 2
+   * each time it is invoked).
+   */
+  counterIncrement?: ICSSRule | string;
+
+  /**
+   * The counter-reset property contains a list of one or more names of counters, each
+   * one optionally followed by an integer (otherwise, the integer defaults to 0.) Each
+   * time the given element is invoked, the counters specified by the property are set to the given integer.
+   */
+  counterReset?: ICSSRule | string;
+
+  /**
+   * The cue property specifies sound files (known as an "auditory icon") to be played by
+   * speech media agents before and after presenting an element's content; if only one
+   * file is specified, it is played both before and after. The volume at which the
+   * file(s) should be played, relative to the volume of the main element, may also be
+   * specified. The icon files may also be set separately with the cue-before and
+   * cue-after properties.
+   */
+  cue?: ICSSRule | string;
+
+  /**
+   * The cue-after property specifies a sound file (known as an "auditory icon") to be
+   * played by speech media agents after presenting an element's content; the volume at
+   * which the file should be played may also be specified. The shorthand property cue
+   * sets cue sounds for both before and after the element is presented.
+   */
+  cueAfter?: ICSSRule | string;
+
+  /**
+   * Specifies the mouse cursor displayed when the mouse pointer is over an element.
+   */
+  cursor?: ICSSRule | string;
+
+  /**
+   * The direction CSS property specifies the text direction/writing direction. The rtl
+   * is used for Hebrew or Arabic text, the ltr is for other languages.
+   */
+  direction?: ICSSRule | string;
+
+  /**
+   * This property specifies the type of rendering box used for an element. It is a
+   * shorthand property for many other display properties.
+   */
+  display?: ICSSRule | string;
+
+  /**
+   * The ‘fill’ property paints the interior of the given graphical element. The area to
+   * be painted consists of any areas inside the outline of the shape. To determine the
+   * inside of the shape, all subpaths are considered, and the interior is determined
+   * according to the rules associated with the current value of the ‘fill-rule’
+   * property. The zero-width geometric outline of a shape is included in the area to be
+   * painted.
+   */
+  fill?: ICSSRule | string;
+
+  /**
+   * SVG: Specifies the opacity of the color or the content the current object is filled
+   * with.
+   * See SVG 1.1 https://www.w3.org/TR/SVG/painting.html#FillOpacityProperty
+   */
+  fillOpacity?: ICSSRule | number;
+
+  /**
+   * The ‘fill-rule’ property indicates the algorithm which is to be used to determine
+   * what parts of the canvas are included inside the shape. For a simple,
+   * non-intersecting path, it is intuitively clear what region lies "inside"; however,
+   * for a more complex path, such as a path that intersects itself or where one subpath
+   * encloses another, the interpretation of "inside" is not so obvious.
+   * The ‘fill-rule’ property provides two options for how the inside of a shape is
+   * determined:
+   */
+  fillRule?: ICSSRule | string;
+
+  /**
+   * Applies various image processing effects. This property is largely unsupported. See
+   * Compatibility section for more information.
+   */
+  filter?: ICSSRule | string;
+
+  /**
+   * Shorthand for `flex-grow`, `flex-shrink`, and `flex-basis`.
+   */
+  flex?: ICSSRule | number | string;
+
+  /**
+   * The flex-basis CSS property describes the initial main size of the flex item before
+   * any free space is distributed according to the flex factors described in the flex
+   * property (flex-grow and flex-shrink).
+   */
+  flexBasis?: ICSSRule | string;
+
+  /**
+   * The flex-direction CSS property describes how flex items are placed in the flex
+   * container, by setting the direction of the flex container's main axis.
+   */
+  flexDirection?: ICSSRule | 'row' | 'row-reverse' | 'column' | 'column-reverse';
+
+  /**
+   * The flex-flow CSS property defines the flex container's main and cross axis. It is
+   * a shorthand property for the flex-direction and flex-wrap properties.
+   */
+  flexFlow?: ICSSRule | string;
+
+  /**
+   * Specifies the flex grow factor of a flex item.
+   * See CSS flex-grow property https://drafts.csswg.org/css-flexbox-1/#flex-grow-property
+   */
+  flexGrow?: ICSSRule | number;
+
+  /**
+   * Gets or sets a value that specifies the ordinal group that a flexbox element
+   *  belongs to. This ordinal value identifies the display order for the group.
+   */
+  flexOrder?: ICSSRule | string;
+
+  /**
+   * Specifies the flex shrink factor of a flex item.
+   * See CSS flex-shrink property https://drafts.csswg.org/css-flexbox-1/#flex-shrink-property
+   */
+  flexShrink?: ICSSRule | number;
+
+  /**
+   * Specifies whether flex items are forced into a single line or can be wrapped onto
+   * multiple lines. If wrapping is allowed, this property also enables you to control
+   * the direction in which lines are stacked.
+   * See CSS flex-wrap property https://drafts.csswg.org/css-flexbox-1/#flex-wrap-property
+   */
+  flexWrap?: ICSSRule | 'nowrap' | 'wrap' | 'wrap-reverse';
+
+  /**
+   * Elements which have the style float are floated horizontally. These elements can
+   * move as far to the left or right of the containing element. All elements after
+   * the floating element will flow around it, but elements before the floating element
+   * are not impacted. If several floating elements are placed after each other, they
+   * will float next to each other as long as there is room.
+   */
+  float?: ICSSRule | string;
+
+  /**
+   * Flows content from a named flow (specified by a corresponding flow-into) through
+   * selected elements to form a dynamic chain of layout regions.
+   */
+  flowFrom?: ICSSRule | string;
+
+  /**
+   * Lays out one or more grid items bound by 4 grid lines. Shorthand for setting
+   * grid-column-start, grid-column-end, grid-row-start, and grid-row-end in a single
+   * declaration.
+   */
+  gridArea?: ICSSRule | string;
+
+  /**
+   * Controls a grid item's placement in a grid area, particularly grid position and a
+   * grid span. Shorthand for setting grid-column-start and grid-column-end in a single
+   * declaration.
+   */
+  gridColumn?: ICSSRule | string;
+
+  /**
+   * Controls a grid item's placement in a grid area as well as grid position and a
+   * grid span. The grid-column-end property (with grid-row-start, grid-row-end, and
+   * grid-column-start) determines a grid item's placement by specifying the grid lines
+   * of a grid item's grid area.
+   */
+  gridColumnEnd?: ICSSRule | string;
+
+  /**
+   * Determines a grid item's placement by specifying the starting grid lines of a grid
+   * item's grid area . A grid item's placement in a grid area consists of a grid
+   * position and a grid span. See also ( grid-row-start, grid-row-end, and
+   * grid-column-end)
+   */
+  gridColumnStart?: ICSSRule | string;
+
+  /**
+   * Gets or sets a value that indicates which row an element within a Grid should
+   * appear in. Shorthand for setting grid-row-start and grid-row-end in a single
+   * declaration.
+   */
+  gridRow?: ICSSRule | string;
+
+  /**
+   * Determines a grid item’s placement by specifying the block-end. A grid item's
+   * placement in a grid area consists of a grid position and a grid span. The
+   * grid-row-end property (with grid-row-start, grid-column-start, and grid-column-end)
+   * determines a grid item's placement by specifying the grid lines of a grid item's
+   * grid area.
+   */
+  gridRowEnd?: ICSSRule | string;
+
+  /**
+   * Specifies a row position based upon an integer location, string value, or desired
+   * row size.
+   * css/properties/grid-row is used as short-hand for grid-row-position and
+   * grid-row-position
+   */
+  gridRowPosition?: ICSSRule | string;
+
+  /**
+   * Specifies named grid areas which are not associated with any particular grid item,
+   * but can be referenced from the grid-placement properties. The syntax of the
+   * grid-template-areas property also provides a visualization of the structure of the
+   * grid, making the overall layout of the grid container easier to understand.
+   */
+  gridTemplateAreas?: ICSSRule | string;
+
+  /**
+   * Specifies (with grid-template-rows) the line names and track sizing functions of
+   * the grid. Each sizing function can be specified as a length, a percentage of the
+   * grid container’s size, a measurement of the contents occupying the column or row,
+   * or a fraction of the free space in the grid.
+   */
+  gridTemplateColumns?: ICSSRule | string;
+
+  /**
+   * Specifies (with grid-template-columns) the line names and track sizing functions of
+   * the grid. Each sizing function can be specified as a length, a percentage of the
+   * grid container’s size, a measurement of the contents occupying the column or row,
+   * or a fraction of the free space in the grid.
+   */
+  gridTemplateRows?: ICSSRule | string;
+
+  /**
+   * Sets the height of an element. The content area of the element height does not
+   * include the padding, border, and margin of the element.
+   */
+  height?: ICSSRule | string;
+
+  /**
+   * Specifies the minimum number of characters in a hyphenated word
+   */
+  hyphenateLimitChars?: ICSSRule | string;
+
+  /**
+   * Indicates the maximum number of successive hyphenated lines in an element. The
+   * ‘no-limit’ value means that there is no limit.
+   */
+  hyphenateLimitLines?: ICSSRule | string;
+
+  /**
+   * Specifies the maximum amount of trailing whitespace (before justification) that may
+   * be left in a line before hyphenation is triggered to pull part of a word from the
+   * next line back up into the current one.
+   */
+  hyphenateLimitZone?: ICSSRule | string;
+
+  /**
+   * Specifies whether or not words in a sentence can be split by the use of a manual or
+   * automatic hyphenation mechanism.
+   */
+  hyphens?: ICSSRule | string;
+
+  /**
+   * Defines how the browser distributes space between and around flex items
+   * along the main-axis of their container.
+   * See CSS justify-content property
+   * https://www.w3.org/TR/css-flexbox-1/#justify-content-property
+   */
+  justifyContent?: ICSSRule | 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly';
+
+  /**
+   * Sets the left position of an element relative to the nearest anscestor that is set
+   * to position absolute, relative, or fixed.
+   */
+  left?: ICSSRule | number | string;
+
+  /**
+   * The letter-spacing CSS property specifies the spacing behavior between text
+   * characters.
+   */
+  letterSpacing?: ICSSRule | string;
+
+  /**
+   * Specifies the height of an inline block level element.
+   * See CSS 2.1 line-height property https://www.w3.org/TR/CSS21/visudet.html#propdef-line-height
+   */
+  lineHeight?: ICSSRule | 'normal' | number | ICSSLengthRule | ICSSPercentageRule;
+
+  /**
+   * Shorthand property that sets the list-style-type, list-style-position and
+   * list-style-image properties in one declaration.
+   */
+  listStyle?: ICSSRule | string;
+
+  /**
+   * This property sets the image that will be used as the list item marker. When the
+   * image is available, it will replace the marker set with the 'list-style-type'
+   * marker. That also means that if the image is not available, it will show the style
+   * specified by list-style-property
+   */
+  listStyleImage?: ICSSRule | string;
+
+  /**
+   * Specifies if the list-item markers should appear inside or outside the content flow.
+   */
+  listStylePosition?: ICSSRule | string;
+
+  /**
+   * Specifies the type of list-item marker in a list.
+   */
+  listStyleType?: ICSSRule | string;
+
+  /**
+   * The margin property is shorthand to allow you to set all four margins of an element
+   * at once. Its equivalent longhand properties are margin-top, margin-right,
+   * margin-bottom and margin-left. Negative values are also allowed.
+   */
+  margin?: ICSSRule | number | string;
+
+  /**
+   * margin-bottom sets the bottom margin of an element.
+   */
+  marginBottom?: ICSSRule | number | string;
+
+  /**
+   * margin-left sets the left margin of an element.
+   */
+  marginLeft?: ICSSRule | number | string;
+
+  /**
+   * margin-right sets the right margin of an element.
+   */
+  marginRight?: ICSSRule | number | string;
+
+  /**
+   * margin-top sets the top margin of an element.
+   */
+  marginTop?: ICSSRule | number | string;
+
+  /**
+   * The marquee-direction determines the initial direction in which the marquee content moves.
+   */
+  marqueeDirection?: ICSSRule | string;
+
+  /**
+   * The 'marquee-style' property determines a marquee's scrolling behavior.
+   */
+  marqueeStyle?: ICSSRule | string;
+
+  /**
+   * This property is shorthand for setting mask-image, mask-mode, mask-repeat,
+   * mask-position, mask-clip, mask-origin, mask-composite and mask-size. Omitted
+   * values are set to their original properties' initial values.
+   */
+  mask?: ICSSRule | string;
+
+  /**
+   * This property is shorthand for setting mask-border-source, mask-border-slice,
+   * mask-border-width, mask-border-outset, and mask-border-repeat. Omitted values
+   * are set to their original properties' initial values.
+   */
+  maskBorder?: ICSSRule | string;
+
+  /**
+   * This property specifies how the images for the sides and the middle part of the
+   * mask image are scaled and tiled. The first keyword applies to the horizontal
+   * sides, the second one applies to the vertical ones. If the second keyword is
+   * absent, it is assumed to be the same as the first, similar to the CSS
+   * border-image-repeat property.
+   */
+  maskBorderRepeat?: ICSSRule | string;
+
+  /**
+   * This property specifies inward offsets from the top, right, bottom, and left
+   * edges of the mask image, dividing it into nine regions: four corners, four
+   * edges, and a middle. The middle image part is discarded and treated as fully
+   * transparent black unless the fill keyword is present. The four values set the
+   * top, right, bottom and left offsets in that order, similar to the CSS
+   * border-image-slice property.
+   */
+  maskBorderSlice?: ICSSRule | string;
+
+  /**
+   * Specifies an image to be used as a mask. An image that is empty, fails to
+   * download, is non-existent, or cannot be displayed is ignored and does not mask
+   * the element.
+   */
+  maskBorderSource?: ICSSRule | string;
+
+  /**
+   * This property sets the width of the mask box image, similar to the CSS
+   * border-image-width property.
+   */
+  maskBorderWidth?: ICSSRule | string;
+
+  /**
+   * Determines the mask painting area, which defines the area that is affected by
+   * the mask. The painted content of an element may be restricted to this area.
+   */
+  maskClip?: ICSSRule | string;
+
+  /**
+   * For elements rendered as a single box, specifies the mask positioning area. For
+   * elements rendered as multiple boxes (e.g., inline boxes on several lines, boxes
+   * on several pages) specifies which boxes box-decoration-break operates on to
+   * determine the mask positioning area(s).
+   */
+  maskOrigin?: ICSSRule | string;
+
+  /**
+   * This property must not be used. It is no longer included in any standard or
+   * standard track specification, nor is it implemented in any browser. It is only
+   * used when the text-align-last property is set to size. It controls allowed
+   * adjustments of font-size to fit line content.
+   */
+  maxFontSize?: ICSSRule | string;
+
+  /**
+   * Sets the maximum height for an element. It prevents the height of the element to
+   *  exceed the specified value. If min-height is specified and is greater than
+   * max-height, max-height is overridden.
+   */
+  maxHeight?: ICSSRule | string;
+
+  /**
+   * Sets the maximum width for an element. It limits the width property to be larger
+   * than the value specified in max-width.
+   */
+  maxWidth?: ICSSRule | string;
+
+  /**
+   * Sets the minimum height for an element. It prevents the height of the element to
+   * be smaller than the specified value. The value of min-height overrides both
+   * max-height and height.
+   */
+  minHeight?: ICSSRule | string;
+
+  /**
+   * Sets the minimum width of an element. It limits the width property to be not
+   * smaller than the value specified in min-width.
+   */
+  minWidth?: ICSSRule | string;
+
+  /**
+   * Specifies the transparency of an element.
+   * See CSS 3 opacity property https://drafts.csswg.org/css-color-3/#opacity
+   */
+  opacity?: ICSSRule | number;
+
+  /**
+   * Specifies the order used to lay out flex items in their flex container.
+   * Elements are laid out in the ascending order of the order value.
+   * See CSS order property https://drafts.csswg.org/css-flexbox-1/#order-property
+   */
+  order?: ICSSRule | number;
+
+  /**
+   * In paged media, this property defines the minimum number of lines in
+   * a block container that must be left at the bottom of the page.
+   * See CSS 3 orphans, widows properties https://drafts.csswg.org/css-break-3/#widows-orphans
+   */
+  orphans?: ICSSRule | number;
+
+  /**
+   * The CSS outline property is a shorthand property for setting one or more of the
+   * individual outline properties outline-style, outline-width and outline-color in a
+   * single rule. In most cases the use of this shortcut is preferable and more
+   * convenient.
+   * Outlines differ from borders in the following ways:
+   *      •       Outlines do not take up space, they are drawn above the content.
+   *      •       Outlines may be non-rectangular. They are rectangular in
+   * Gecko/Firefox. Internet Explorer attempts to place the smallest contiguous outline
+   * around all elements or shapes that are indicated to have an outline. Opera draws a
+   * non-rectangular shape around a construct.
+   */
+  outline?: ICSSRule | 0 | string;
+
+  /**
+   * The outline-color property sets the color of the outline of an element. An
+   * outline is a line that is drawn around elements, outside the border edge, to make
+   * the element stand out.
+   */
+  outlineColor?: ICSSRule | string;
+
+  /**
+   * The outline-offset property offsets the outline and draw it beyond the border edge.
+   */
+  outlineOffset?: ICSSRule | string;
+
+  /**
+   * The overflow property controls how extra content exceeding the bounding box of an
+   * element is rendered. It can be used in conjunction with an element that has a
+   * fixed width and height, to eliminate text-induced page distortion.
+   */
+  overflow?: ICSSRule | 'auto' | 'hidden' | 'scroll' | 'visible';
+
+  /**
+   * Specifies the preferred scrolling methods for elements that overflow.
+   */
+  overflowStyle?: ICSSRule | string;
+
+  /**
+   * Specifies whether or not the browser should insert line breaks within words to
+   * prevent text from overflowing its content box. In contrast to word-break,
+   * overflow-wrap will only create a break if an entire word cannot be placed on its
+   * own line without overflowing.
+   */
+  overflowWrap?: ICSSRule | 'normal' | 'break-word';
+
+  /**
+   * Controls how extra content exceeding the x-axis of the bounding box of an element
+   * is rendered.
+   */
+  overflowX?: ICSSRule | 'auto' | 'hidden' | 'scroll' | 'visible';
+
+  /**
+   * Controls how extra content exceeding the y-axis of the bounding box of an element
+   * is rendered.
+   */
+  overflowY?: ICSSRule | 'auto' | 'hidden' | 'scroll' | 'visible';
+
+  /**
+   * The padding optional CSS property sets the required padding space on one to four
+   * sides of an element. The padding area is the space between an element and its
+   * border. Negative values are not allowed but decimal values are permitted. The
+   *  element size is treated as fixed, and the content of the element shifts toward the
+   * center as padding is increased. The padding property is a shorthand to avoid
+   * setting each side separately (padding-top, padding-right, padding-bottom,
+   * padding-left).
+   */
+  padding?: ICSSRule | number | string;
+
+  /**
+   * The padding-bottom CSS property of an element sets the padding space required on
+   * the bottom of an element. The padding area is the space between the content of the
+   * element and its border. Contrary to margin-bottom values, negative values of
+   * padding-bottom are invalid.
+   */
+  paddingBottom?: ICSSRule | number | string;
+
+  /**
+   * The padding-left CSS property of an element sets the padding space required on the
+   * left side of an element. The padding area is the space between the content of the
+   * element and its border. Contrary to margin-left values, negative values of
+   * padding-left are invalid.
+   */
+  paddingLeft?: ICSSRule | number | string;
+
+  /**
+   * The padding-right CSS property of an element sets the padding space required on the
+   * right side of an element. The padding area is the space between the content of the
+   * element and its border. Contrary to margin-right values, negative values of
+   * padding-right are invalid.
+   */
+  paddingRight?: ICSSRule | number | string;
+
+  /**
+   * The padding-top CSS property of an element sets the padding space required on the
+   * top of an element. The padding area is the space between the content of the element
+   * and its border. Contrary to margin-top values, negative values of padding-top are
+   * invalid.
+   */
+  paddingTop?: ICSSRule | number | string;
+
+  /**
+   * The page-break-after property is supported in all major browsers. With CSS3,
+   *  page-break-* properties are only aliases of the break-* properties. The CSS3
+   * Fragmentation spec defines breaks for all CSS box fragmentation.
+   */
+  pageBreakAfter?: ICSSRule | string;
+
+  /**
+   * The page-break-before property sets the page-breaking behavior before an element.
+   * With CSS3, page-break-* properties are only aliases of the break-* properties. The
+   * CSS3 Fragmentation spec defines breaks for all CSS box fragmentation.
+   */
+  pageBreakBefore?: ICSSRule | string;
+
+  /**
+   * Sets the page-breaking behavior inside an element. With CSS3, page-break-*
+   * properties are only aliases of the break-* properties. The CSS3 Fragmentation spec
+   * defines breaks for all CSS box fragmentation.
+   */
+  pageBreakInside?: ICSSRule | string;
+
+  /**
+   * The pause property determines how long a speech media agent should pause before and
+   * after presenting an element. It is a shorthand for the pause-before and pause-after
+   *  properties.
+   */
+  pause?: ICSSRule | string;
+
+  /**
+   * The pause-after property determines how long a speech media agent should pause after
+   * presenting an element. It may be replaced by the shorthand property pause, which
+   * sets pause time before and after.
+   */
+  pauseAfter?: ICSSRule | string;
+
+  /**
+   * The pause-before property determines how long a speech media agent should pause
+   * before presenting an element. It may be replaced by the shorthand property pause,
+   * which sets pause time before and after.
+   */
+  pauseBefore?: ICSSRule | string;
+
+  /**
+   * The perspective property defines how far an element is placed from the view on the
+   * z-axis, from the screen to the viewer. Perspective defines how an object is viewed.
+   * In graphic arts, perspective is the representation on a flat surface of what the
+   * viewer's eye would see in a 3D space. (See Wikipedia for more information about
+   * graphical perspective and for related illustrations.)
+   * The illusion of perspective on a flat surface, such as a computer screen, is created
+   * by projecting points on the flat surface as they would appear if the flat surface
+   * were a window through which the viewer was looking at the object. In discussion of
+   * virtual environments, this flat surface is called a projection plane.
+   */
+  perspective?: ICSSRule | string;
+
+  /**
+   * The perspective-origin property establishes the origin for the perspective property.
+   * It effectively sets the X and Y position at which the viewer appears to be looking
+   * at the children of the element.
+   * When used with perspective, perspective-origin changes the appearance of an object,
+   * as if a viewer were looking at it from a different origin. An object appears
+   * differently if a viewer is looking directly at it versus looking at it from below,
+   * above, or from the side. Thus, the perspective-origin is like a vanishing point.
+   * The default value of perspective-origin is 50% 50%. This displays an object as if
+   * the viewer's eye were positioned directly at the center of the screen, both
+   * top-to-bottom and left-to-right. A value of 0% 0% changes the object as if the
+   * viewer was looking toward the top left angle. A value of 100% 100% changes the
+   * appearance as if viewed toward the bottom right angle.
+   */
+  perspectiveOrigin?: ICSSRule | string;
+
+  /**
+   * The pointer-events property allows you to control whether an element can be the
+   * target for the pointing device (e.g, mouse, pen) events.
+   */
+  pointerEvents?: ICSSRule | string;
+
+  /**
+   * The position property controls the type of positioning used by an element within
+   * its parent elements. The effect of the position property depends on a lot of
+   * factors, for example the position property of parent elements.
+   */
+  position?: ICSSRule | 'static' | 'relative' | 'absolute' | 'fixed' | 'sticky';
+
+  /**
+   * Sets the type of quotation marks for embedded quotations.
+   */
+  quotes?: ICSSRule | string;
+
+  /**
+   * Controls whether the last region in a chain displays additional 'overset' content
+   * according its default overflow property, or if it displays a fragment of content
+   * as if it were flowing into a subsequent region.
+   */
+  regionFragment?: ICSSRule | string;
+
+  /**
+   * The rest-after property determines how long a speech media agent should pause after
+   * presenting an element's main content, before presenting that element's exit cue
+   * sound. It may be replaced by the shorthand property rest, which sets rest time
+   * before and after.
+   */
+  restAfter?: ICSSRule | string;
+
+  /**
+   * The rest-before property determines how long a speech media agent should pause after
+   * presenting an intro cue sound for an element, before presenting that element's main
+   * content. It may be replaced by the shorthand property rest, which sets rest time
+   * before and after.
+   */
+  restBefore?: ICSSRule | string;
+
+  /**
+   * Specifies the position an element in relation to the right side of the containing
+   * element.
+   */
+  right?: ICSSRule | number | string;
+
+  /**
+   * Defines the alpha channel threshold used to extract a shape from an image. Can be
+   * thought of as a "minimum opacity" threshold; that is, a value of 0.5 means that the
+   * shape will enclose all the pixels that are more than 50% opaque.
+   */
+  shapeImageThreshold?: ICSSRule | string;
+
+  /**
+   * A future level of CSS Shapes will define a shape-inside property, which will define
+   * a shape to wrap content within the element. See Editor's Draft
+   * <http://dev.w3.org/csswg/css-shapes/> and CSSWG wiki page on next-level plans
+   * <http://wiki.csswg.org/spec/css-shapes>
+   */
+  shapeInside?: ICSSRule | string;
+
+  /**
+   * Adds a margin to a shape-outside. In effect, defines a new shape that is the
+   * smallest contour around all the points that are the shape-margin distance outward
+   * perpendicular to each point on the underlying shape. For points where a
+   * perpendicular direction is not defined (e.g., a triangle corner), takes all
+   * points on a circle centered at the point and with a radius of the shape-margin
+   * distance. This property accepts only non-negative values.
+   */
+  shapeMargin?: ICSSRule | string;
+
+  /**
+   * Declares a shape around which text should be wrapped, with possible modifications
+   * from the shape-margin property. The shape defined by shape-outside and shape-margin
+   * changes the geometry of a float element's float area.
+   */
+  shapeOutside?: ICSSRule | string;
+
+  /**
+   * The speak property determines whether or not a speech synthesizer will read aloud
+   * the contents of an element.
+   */
+  speak?: ICSSRule | string;
+
+  /**
+   * The speak-as property determines how the speech synthesizer interprets the content:
+   * words as whole words or as a sequence of letters, numbers as a numerical value or a
+   * sequence of digits, punctuation as pauses in speech or named punctuation characters.
+   */
+  speakAs?: ICSSRule | string;
+
+  /**
+   * SVG: Specifies the opacity of the outline on the current object.
+   * See SVG 1.1 https://www.w3.org/TR/SVG/painting.html#StrokeOpacityProperty
+   */
+  strokeOpacity?: ICSSRule | number;
+
+  /**
+   * SVG: Specifies the width of the outline on the current object.
+   * See SVG 1.1 https://www.w3.org/TR/SVG/painting.html#StrokeWidthProperty
+   */
+  strokeWidth?: ICSSRule | ICSSPercentageRule | ICSSLengthRule;
+
+  /**
+   * The tab-size CSS property is used to customise the width of a tab (U+0009) character.
+   */
+  tabSize?: ICSSRule | string;
+
+  /**
+   * The 'table-layout' property controls the algorithm used to lay out the table cells, rows, and columns.
+   */
+  tableLayout?: ICSSRule | string;
+
+  /**
+   * The text-align CSS property describes how inline content like text is aligned in its
+   * parent block element. text-align does not control the alignment of block elements
+   * itself, only their inline content.
+   */
+  textAlign?: ICSSRule | string;
+
+  /**
+   * The text-align-last CSS property describes how the last line of a block element or
+   * a line before line break is aligned in its parent block element.
+   */
+  textAlignLast?: ICSSRule | string;
+
+  /**
+   * The text-decoration CSS property is used to set the text formatting to underline,
+   * overline, line-through or blink. underline and overline decorations are positioned
+   * under the text, line-through over it.
+   */
+  textDecoration?: ICSSRule | string;
+
+  /**
+   * Sets the color of any text decoration, such as underlines, overlines, and strike
+   * throughs.
+   */
+  textDecorationColor?: ICSSRule | string;
+
+  /**
+   * Sets what kind of line decorations are added to an element, such as underlines,
+   * overlines, etc.
+   */
+  textDecorationLine?: ICSSRule | string;
+
+  /**
+   * Specifies what parts of an element’s content are skipped over when applying any
+   * text decoration.
+   */
+  textDecorationSkip?: ICSSRule | string;
+
+  /**
+   * This property specifies the style of the text decoration line drawn on the
+   * specified element. The intended meaning for the values are the same as those of
+   * the border-style-properties.
+   */
+  textDecorationStyle?: ICSSRule | string;
+
+  /**
+   * The text-emphasis property will apply special emphasis marks to the elements text.
+   * Slightly similar to the text-decoration property only that this property can have
+   * affect on the line-height. It also is noted that this is shorthand for
+   * text-emphasis-style and for text-emphasis-color.
+   */
+  textEmphasis?: ICSSRule | string;
+
+  /**
+   * The text-emphasis-color property specifies the foreground color of the emphasis
+   * marks.
+   */
+  textEmphasisColor?: ICSSRule | string;
+
+  /**
+   * The text-emphasis-style property applies special emphasis marks to an element's
+   * text.
+   */
+  textEmphasisStyle?: ICSSRule | string;
+
+  /**
+   * This property helps determine an inline box's block-progression dimension, derived
+   * from the text-height and font-size properties for non-replaced elements, the height
+   * or the width for replaced elements, and the stacked block-progression dimension for
+   * inline-block elements. The block-progression dimension determines the position of
+   * the padding, border and margin for the element.
+   */
+  textHeight?: ICSSRule | string;
+
+  /**
+   * Specifies the amount of space horizontally that should be left on the first line of
+   * the text of an element. This horizontal spacing is at the beginning of the first
+   * line and is in respect to the left edge of the containing block box.
+   */
+  textIndent?: ICSSRule | string;
+
+  /**
+   * The text-overflow shorthand CSS property determines how overflowed content that is
+   * not displayed is signaled to the users. It can be clipped, display an ellipsis
+   * ('…', U+2026 HORIZONTAL ELLIPSIS) or a Web author-defined string. It covers the
+   * two long-hand properties text-overflow-mode and text-overflow-ellipsis
+   */
+  textOverflow?: ICSSRule | string;
+
+  /**
+   * The text-overline property is the shorthand for the text-overline-style,
+   * text-overline-width, text-overline-color, and text-overline-mode properties.
+   */
+  textOverline?: ICSSRule | string;
+
+  /**
+   * Specifies the line color for the overline text decoration.
+   */
+  textOverlineColor?: ICSSRule | string;
+
+  /**
+   * Sets the mode for the overline text decoration, determining whether the text
+   * decoration affects the space characters or not.
+   */
+  textOverlineMode?: ICSSRule | string;
+
+  /**
+   * Specifies the line style for overline text decoration.
+   */
+  textOverlineStyle?: ICSSRule | string;
+
+  /**
+   * Specifies the line width for the overline text decoration.
+   */
+  textOverlineWidth?: ICSSRule | string;
+
+  /**
+   * The text-rendering CSS property provides information to the browser about how to
+   * optimize when rendering text. Options are: legibility, speed or geometric precision.
+   */
+  textRendering?: ICSSRule | string;
+
+  /**
+   * The CSS text-shadow property applies one or more drop shadows to the text and
+   * <text-decorations> of an element. Each shadow is specified as an offset from the
+   * text, along with optional color and blur radius values.
+   */
+  textShadow?: ICSSRule | string;
+
+  /**
+   * This property transforms text for styling purposes. (It has no effect on the
+   * underlying content.)
+   */
+  textTransform?: ICSSRule | string;
+
+  /**
+   * Unsupported.
+   * This property will add a underline position value to the element that has an
+   * underline defined.
+   */
+  textUnderlinePosition?: ICSSRule | string;
+
+  /**
+   * After review this should be replaced by text-decoration should it not?
+   * This property will set the underline style for text with a line value for
+   * underline, overline, and line-through.
+   */
+  textUnderlineStyle?: ICSSRule | string;
+
+  /**
+   * This property specifies how far an absolutely positioned box's top margin edge is
+   * offset below the top edge of the box's containing block. For relatively positioned
+   * boxes, the offset is with respect to the top edges of the box itself (i.e., the box
+   * is given a position in the normal flow, then offset from that position according to
+   * these properties).
+   */
+  top?: ICSSRule | number | string;
+
+  /**
+   * Determines whether touch input may trigger default behavior supplied by the user
+   * agent, such as panning or zooming.
+   */
+  touchAction?: ICSSRule | string;
+
+  /**
+   * CSS transforms allow elements styled with CSS to be transformed in two-dimensional
+   * or three-dimensional space. Using this property, elements can be translated,
+   * rotated, scaled, and skewed. The value list may consist of 2D and/or 3D transform
+   * values.
+   */
+  transform?: ICSSRule | string;
+
+  /**
+   * This property defines the origin of the transformation axes relative to the element
+   * to which the transformation is applied.
+   */
+  transformOrigin?: ICSSRule | string;
+
+  /**
+   * This property allows you to define the relative position of the origin of the
+   * transformation grid along the z-axis.
+   */
+  transformOriginZ?: ICSSRule | string;
+
+  /**
+   * This property specifies how nested elements are rendered in 3D space relative to their parent.
+   */
+  transformStyle?: ICSSRule | string;
+
+  /**
+   * The transition CSS property is a shorthand property for transition-property,
+   * transition-duration, transition-timing-function, and transition-delay. It allows to
+   * define the transition between two states of an element.
+   */
+  transition?: ICSSRule | string;
+
+  /**
+   * Defines when the transition will start. A value of ‘0s’ means the transition will
+   * execute as soon as the property is changed. Otherwise, the value specifies an
+   * offset from the moment the property is changed, and the transition will delay
+   * execution by that offset.
+   */
+  transitionDelay?: ICSSRule | string;
+
+  /**
+   * The 'transition-duration' property specifies the length of time a transition
+   * animation takes to complete.
+   */
+  transitionDuration?: ICSSRule | string;
+
+  /**
+   * The 'transition-property' property specifies the name of the CSS property to which
+   * the transition is applied.
+   */
+  transitionProperty?: ICSSRule | string;
+
+  /**
+   * Sets the pace of action within a transition
+   */
+  transitionTimingFunction?: ICSSRule | string;
+
+  /**
+   * The unicode-bidi CSS property specifies the level of embedding with respect to the bidirectional algorithm.
+   */
+  unicodeBidi?: ICSSRule | string;
+
+  /**
+   * This is for all the high level UX stuff.
+   */
+  userFocus?: ICSSRule | string;
+
+  /**
+   * For inputing user content
+   */
+  userInput?: ICSSRule | string;
+
+  /**
+   * Defines the text selection behavior.
+   */
+  userSelect?: ICSSRule | 'none' | 'auto' | 'text' | 'all' | 'contain';
+
+  /**
+   * The vertical-align property controls how inline elements or text are vertically
+   * aligned compared to the baseline. If this property is used on table-cells it
+   * controls the vertical alignment of content of the table cell.
+   */
+  verticalAlign?: ICSSRule | string;
+
+  /**
+   * The visibility property specifies whether the boxes generated by an element are rendered.
+   */
+  visibility?: ICSSRule | string;
+
+  /**
+   * The voice-balance property sets the apparent position (in stereo sound) of the synthesized voice for spoken media.
+   */
+  voiceBalance?: ICSSRule | string;
+
+  /**
+   * The voice-duration property allows the author to explicitly set the amount of time
+   * it should take a speech synthesizer to read an element's content, for example to
+   * allow the speech to be synchronized with other media. With a value of auto (the
+   * default) the length of time it takes to read the content is determined by the
+   * content itself and the voice-rate property.
+   */
+  voiceDuration?: ICSSRule | string;
+
+  /**
+   * The voice-family property sets the speaker's voice used by a speech media agent to
+   * read an element. The speaker may be specified as a named character (to match a
+   * voice option in the speech reading software) or as a generic description of the
+   * age and gender of the voice. Similar to the font-family property for visual media,
+   * a comma-separated list of fallback options may be given in case the speech reader
+   * does not recognize the character name or cannot synthesize the requested combination
+   * of generic properties.
+   */
+  voiceFamily?: ICSSRule | string;
+
+  /**
+   * The voice-pitch property sets pitch or tone (high or low) for the synthesized speech
+   * when reading an element; the pitch may be specified absolutely or relative to the
+   * normal pitch for the voice-family used to read the text.
+   */
+  voicePitch?: ICSSRule | string;
+
+  /**
+   * The voice-range property determines how much variation in pitch or tone will be
+   * created by the speech synthesize when reading an element. Emphasized text,
+   * grammatical structures and punctuation may all be rendered as changes in pitch,
+   * this property determines how strong or obvious those changes are; large ranges are
+   * associated with enthusiastic or emotional speech, while small ranges are associated
+   * with flat or mechanical speech.
+   */
+  voiceRange?: ICSSRule | string;
+
+  /**
+   * The voice-rate property sets the speed at which the voice synthesized by a speech
+   * media agent will read content.
+   */
+  voiceRate?: ICSSRule | string;
+
+  /**
+   * The voice-stress property sets the level of vocal emphasis to be used for
+   * synthesized speech reading the element.
+   */
+  voiceStress?: ICSSRule | string;
+
+  /**
+   * The voice-volume property sets the volume for spoken content in speech media. It
+   * replaces the deprecated volume property.
+   */
+  voiceVolume?: ICSSRule | string;
+
+  /**
+   * The white-space property controls whether and how white space inside the element is
+   * collapsed, and whether lines may wrap at unforced "soft wrap" opportunities.
+   */
+  whiteSpace?: ICSSRule | string;
+
+  /**
+   * In paged media, this property defines the mimimum number of lines that must be left
+   * at the top of the second page.
+   * See CSS 3 orphans, widows properties
+   * https://drafts.csswg.org/css-break-3/#widows-orphans
+   */
+  widows?: ICSSRule | number;
+
+  /**
+   * Specifies the width of the content area of an element. The content area of the element
+   * width does not include the padding, border, and margin of the element.
+   */
+  width?: ICSSRule | string;
+
+  /**
+   * The word-break property is often used when there is long generated content that is
+   * strung together without and spaces or hyphens to beak apart. A common case of this
+   * is when there is a long URL that does not have any hyphens. This case could
+   * potentially cause the breaking of the layout as it could extend past the parent
+   * element.
+   */
+  wordBreak?: ICSSRule | string;
+
+  /**
+   * The word-spacing CSS property specifies the spacing behavior between "words".
+   */
+  wordSpacing?: ICSSRule | string;
+
+  /**
+   * An alias of css/properties/overflow-wrap, word-wrap defines whether to break
+   * words when the content exceeds the boundaries of its container.
+   */
+  wordWrap?: ICSSRule | string;
+
+  /**
+   * Specifies how exclusions affect inline content within block-level elements. Elements
+   * lay out their inline content in their content area but wrap around exclusion areas.
+   */
+  wrapFlow?: ICSSRule | string;
+
+  /**
+   * Set the value that is used to offset the inner wrap shape from other shapes. Inline
+   * content that intersects a shape with this property will be pushed by this shape's
+   * margin.
+   */
+  wrapMargin?: ICSSRule | string;
+
+  /**
+   * writing-mode specifies if lines of text are laid out horizontally or vertically,
+   * and the direction which lines of text and blocks progress.
+   */
+  writingMode?: ICSSRule | string;
+
+  /**
+   * The z-index property specifies the z-order of an element and its descendants.
+   * When elements overlap, z-order determines which one covers the other.
+   * See CSS 2 z-index property https://www.w3.org/TR/CSS2/visuren.html#z-index
+   */
+  zIndex?: ICSSRule | 'auto' | number;
+
+  /**
+   * Sets the initial zoom factor of a document defined by @viewport.
+   * See CSS zoom descriptor https://drafts.csswg.org/css-device-adapt/#zoom-desc
+   */
+  zoom?: ICSSRule | 'auto' | number | ICSSPercentageRule;
+}
diff --git a/packages/merge-styles/src/IStyle.ts b/packages/merge-styles/src/IStyle.ts
new file mode 100644
index 0000000000000..4a46df0baaf59
--- /dev/null
+++ b/packages/merge-styles/src/IStyle.ts
@@ -0,0 +1,29 @@
+import { IRawStyle } from './IRawStyle';
+
+/**
+ * IStyleObject extends a raw style objects, but allows selectors to be defined
+ * under the selectors node.
+ * @public
+ */
+export interface IExtendedRawStyle extends IRawStyle {
+  /**
+   * Display name for the style.
+   */
+  displayName?: string;
+
+  /**
+   * Custom selectors for the style.
+   */
+  selectors?: {
+    [key: string]: IStyle;
+  };
+}
+
+export type IStyleBase = IExtendedRawStyle | string | false | null | undefined;
+
+/**
+ * IStyleObject extends a raw style objects, but allows selectors to be defined
+ * under the selectors node.
+ * @public
+ */
+export type IStyle = IStyleBase | IStyleBase[] | IStyleBase[][] | IStyleBase[][][];
diff --git a/packages/merge-styles/src/IStyleSet.ts b/packages/merge-styles/src/IStyleSet.ts
new file mode 100644
index 0000000000000..82926ab5b49a8
--- /dev/null
+++ b/packages/merge-styles/src/IStyleSet.ts
@@ -0,0 +1,5 @@
+import { IStyle } from './IStyle';
+
+export type IStyleSet = {
+  [key: string]: IStyle;
+};
diff --git a/packages/merge-styles/src/Stylesheet.ts b/packages/merge-styles/src/Stylesheet.ts
new file mode 100644
index 0000000000000..257954b4f157a
--- /dev/null
+++ b/packages/merge-styles/src/Stylesheet.ts
@@ -0,0 +1,186 @@
+import { IStyle } from './IStyle';
+
+/**
+ * Injection mode for the stylesheet.
+ *
+ * @public
+ */
+export const enum InjectionMode {
+  /**
+   * Avoids style injection, use getRules() to read the styles.
+   */
+  none = 0,
+
+  /**
+   * Inserts rules using the insertRule api.
+   */
+  insertNode = 1
+}
+
+/**
+ * Stylesheet config.
+ *
+ * @public
+ */
+export interface IStyleSheetConfig {
+  /**
+   * Injection mode for how rules are inserted.
+   */
+  injectionMode?: InjectionMode;
+}
+
+const STYLESHEET_SETTING = '__stylesheet__';
+
+let _stylesheet: Stylesheet;
+
+/**
+ * Represents the state of styles registered in the page. Abstracts
+ * the surface for adding styles to the stylesheet, exposes helpers
+ * for reading the styles registered in server rendered scenarios.
+ *
+ * @public
+ */
+export class Stylesheet {
+  private _styleElement: HTMLStyleElement;
+  private _rules: string[];
+  private _config: IStyleSheetConfig;
+  private _rulesToInsert: string[];
+  private _timerId: number;
+  private _counter: number;
+  private _keyToClassName: { [key: string]: string };
+
+  // tslint:disable-next-line:no-any
+  private _classNameToArgs: { [key: string]: any };
+
+  /**
+   * Gets the singleton instance.
+   */
+  public static getInstance(): Stylesheet {
+    // tslint:disable-next-line:no-any
+    const win: any = typeof window !== 'undefined' ? window : {};
+    _stylesheet = win[STYLESHEET_SETTING] as Stylesheet;
+
+    if (!_stylesheet) {
+      _stylesheet = win[STYLESHEET_SETTING] = new Stylesheet();
+    }
+
+    return _stylesheet;
+  }
+
+  constructor(config?: IStyleSheetConfig) {
+    this._config = {
+      async: false,
+      injectionMode: InjectionMode.insertNode,
+      ...config
+    };
+
+    this.reset();
+  }
+
+  /**
+   * Configures the stylesheet.
+   */
+  public setConfig(config?: IStyleSheetConfig): void {
+    this._config = {
+      ...this._config,
+      ...config
+    };
+  }
+
+  /**
+   * Generates a unique classname.
+   *
+   * @param displayName - Optional value to use as a prefix.
+   */
+  public getClassName(displayName?: string): string {
+    const prefix = displayName || 'css';
+
+    return `${prefix}-${this._counter++}`;
+  }
+
+  /**
+   * Used internally to cache information about a class which was
+   * registered with the stylesheet.
+   */
+  public cacheClassName(className: string, key: string, args: IStyle[]): void {
+    this._keyToClassName[key] = className;
+    this._classNameToArgs[className] = args;
+  }
+
+  /**
+   * Gets the appropriate classname given a key which was previously
+   * registered using cacheClassName.
+   */
+  public classNameFromKey(key: string): string | undefined {
+    return this._keyToClassName[key];
+  }
+
+  /**
+   * Gets the arguments associated with a given classname which was
+   * previously registered using cacheClassName.
+   */
+  public argsFromClassName(className: string): IStyle[] | undefined {
+    return this._classNameToArgs[className];
+  }
+
+  /**
+   * Inserts a css rule into the stylesheet.
+   */
+  public insertRule(
+    rule: string
+  ): void {
+    const element = this._getElement();
+    const injectionMode = element ? this._config.injectionMode : InjectionMode.none;
+
+    switch (injectionMode) {
+      case InjectionMode.insertNode:
+        const { sheet } = element;
+
+        try {
+          // tslint:disable-next-line:no-any
+          (sheet as any).insertRule(rule, (sheet as any).cssRules.length);
+        } catch (e) {
+          /* no-op on errors */
+        }
+        break;
+
+      default:
+        this._rules.push(rule);
+        break;
+    }
+  }
+
+  /**
+   * Gets all rules registered with the stylesheet; only valid when
+   * using InsertionMode.none.
+   */
+  public getRules(): string {
+    return (this._rules.join('') || '') + (this._rulesToInsert.join('') || '');
+  }
+
+  /**
+   * Resets the internal state of the stylesheet. Only used in server
+   * rendered scenarios where we're using InsertionMode.none.
+   */
+  public reset(): void {
+    this._rules = [];
+    this._rulesToInsert = [];
+    this._counter = 0;
+    this._classNameToArgs = {};
+    this._keyToClassName = {};
+
+    if (this._timerId) {
+      clearTimeout(this._timerId);
+      this._timerId = 0;
+    }
+  }
+
+  private _getElement(): HTMLStyleElement {
+    if (!this._styleElement) {
+      this._styleElement = document.createElement('style');
+      document.head.appendChild(this._styleElement);
+    }
+
+    return this._styleElement;
+  }
+}
diff --git a/packages/merge-styles/src/common/tests.js b/packages/merge-styles/src/common/tests.js
new file mode 100644
index 0000000000000..ec92b70032203
--- /dev/null
+++ b/packages/merge-styles/src/common/tests.js
@@ -0,0 +1,22 @@
+'use strict';
+
+
+/**
+ * This is a test entry point to help karma-webpack find all tests in the project.
+ **/
+
+// Polyfills
+require('es6-weak-map/implement');
+require('es6-map/implement');
+console.log('hi')
+// Before loading modules, treat errors and warnings as test failures.
+console.error = console.warn = function (warning) {
+  throw new Error(warning);
+}
+
+var context = require.context('..', true, /.+\.test\.js?$/);
+
+context.keys().forEach(context);
+
+
+module.exports = context;
diff --git a/packages/merge-styles/src/concatStyleSets.test.ts b/packages/merge-styles/src/concatStyleSets.test.ts
new file mode 100644
index 0000000000000..4d7e59d8cfe1e
--- /dev/null
+++ b/packages/merge-styles/src/concatStyleSets.test.ts
@@ -0,0 +1,41 @@
+import { concatStyleSets } from './concatStyleSets';
+import { IStyle } from './IStyle';
+const { expect } = chai;
+
+describe('concatStyleSets', () => {
+  it('can concat style sets', () => {
+    const result = concatStyleSets<{ root?: IStyle, a?: IStyle, b?: IStyle }>(
+      {
+        root: { background: 'red' },
+        a: { background: 'green' }
+      },
+      {
+        a: { background: 'white' },
+        b: { background: 'blue' }
+      },
+      {
+        root: {
+          selectors: {
+            ':hover': { background: 'yellow' }
+          }
+        }
+      }
+    );
+
+    expect(result).eqls({
+      root: [
+        { background: 'red' },
+        {
+          selectors: {
+            ':hover': { background: 'yellow' }
+          }
+        }
+      ],
+      a: [
+        { background: 'green' },
+        { background: 'white' }
+      ],
+      b: { background: 'blue' }
+    });
+  });
+});
\ No newline at end of file
diff --git a/packages/merge-styles/src/concatStyleSets.ts b/packages/merge-styles/src/concatStyleSets.ts
new file mode 100644
index 0000000000000..7ceb0d2cdb222
--- /dev/null
+++ b/packages/merge-styles/src/concatStyleSets.ts
@@ -0,0 +1,32 @@
+import { IStyleSet } from './IStyleSet';
+
+/**
+ * Combine a set of styles together (but does not register css classes.)
+ * @public
+ */
+export function concatStyleSets<T extends object>(...args: (T | false | null | undefined)[]): T {
+  // tslint:disable-next-line:no-any
+  const mergedSet: T = {} as any;
+
+  for (const currentSet of args) {
+    if (currentSet) {
+      for (const prop in currentSet) {
+        if (currentSet.hasOwnProperty(prop)) {
+          const mergedValue = mergedSet[prop];
+          const currentValue = currentSet[prop];
+
+          if (mergedValue === undefined) {
+            mergedSet[prop] = currentValue;
+          } else {
+            mergedSet[prop] = [
+              ...(Array.isArray(mergedValue) ? mergedValue : [mergedValue]),
+              ...(Array.isArray(currentValue) ? currentValue : [currentValue])
+            ];
+          }
+        }
+      }
+    }
+  }
+
+  return mergedSet;
+}
\ No newline at end of file
diff --git a/packages/merge-styles/src/fontFace.test.ts b/packages/merge-styles/src/fontFace.test.ts
new file mode 100644
index 0000000000000..722e1340be8c0
--- /dev/null
+++ b/packages/merge-styles/src/fontFace.test.ts
@@ -0,0 +1,20 @@
+import { fontFace } from './fontFace';
+import {
+  Stylesheet,
+  InjectionMode
+} from './Stylesheet';
+
+const { expect } = chai;
+const _stylesheet: Stylesheet = Stylesheet.getInstance();
+
+_stylesheet.setConfig({ injectionMode: InjectionMode.none });
+
+describe('fontFace', () => {
+  it('can register a font face', () => {
+    fontFace({
+      fontFamily: 'Segoe UI',
+      src: 'url("foo")'
+    });
+    expect(_stylesheet.getRules()).equals('@font-face{font-family:Segoe UI;src:url("foo");}');
+  });
+});
\ No newline at end of file
diff --git a/packages/merge-styles/src/fontFace.ts b/packages/merge-styles/src/fontFace.ts
new file mode 100644
index 0000000000000..67785016c2b39
--- /dev/null
+++ b/packages/merge-styles/src/fontFace.ts
@@ -0,0 +1,11 @@
+import { Stylesheet } from './Stylesheet';
+import { IFontFace } from './IRawStyle';
+import { serializeRuleEntries } from './styleToClassName';
+
+/**
+ * Registers a font face.
+ * @public
+ */
+export function fontFace(font: IFontFace): void {
+  Stylesheet.getInstance().insertRule(`@font-face{${serializeRuleEntries(font as {})}}`);
+}
diff --git a/packages/merge-styles/src/getVendorSettings.ts b/packages/merge-styles/src/getVendorSettings.ts
new file mode 100644
index 0000000000000..64efe9b5b4a03
--- /dev/null
+++ b/packages/merge-styles/src/getVendorSettings.ts
@@ -0,0 +1,41 @@
+export interface IVendorSettings {
+  isWebkit?: boolean;
+  isMoz?: boolean;
+  isMs?: boolean;
+  isOpera?: boolean;
+}
+
+let _vendorSettings: IVendorSettings | undefined;
+
+export function getVendorSettings(): IVendorSettings {
+  if (!_vendorSettings) {
+    const doc = typeof document !== 'undefined' ? document : undefined;
+    const nav = typeof navigator !== 'undefined' ? navigator : undefined;
+    const userAgent = nav ? nav.userAgent.toLowerCase() : undefined;
+
+    if (!doc) {
+      _vendorSettings = {
+        isWebkit: true,
+        isMoz: true,
+        isOpera: true,
+        isMs: true
+      };
+    } else {
+      _vendorSettings = {
+        isWebkit: !!(doc && 'WebkitAppearance' in doc.documentElement.style),
+        isMoz: !!(userAgent && userAgent.indexOf('firefox') > -1),
+        isOpera: !!(userAgent && userAgent.indexOf('opera') > -1),
+        isMs: !!(nav && (/rv:11.0/i.test(nav.userAgent) || /Edge\/\d./i.test(navigator.userAgent)))
+      };
+    }
+  }
+
+  return _vendorSettings;
+}
+
+/**
+ * Sets the vendor settings for prefixing and vendor specific operations.
+ */
+export function setVendorSettings(vendorSettings?: IVendorSettings): void {
+  _vendorSettings = vendorSettings;
+}
\ No newline at end of file
diff --git a/packages/merge-styles/src/index.ts b/packages/merge-styles/src/index.ts
new file mode 100644
index 0000000000000..785f94b3ab876
--- /dev/null
+++ b/packages/merge-styles/src/index.ts
@@ -0,0 +1,40 @@
+export {
+  IExtendedRawStyle,
+  IStyle
+} from './IStyle';
+
+export {
+  IStyleSet
+} from './IStyleSet';
+
+export {
+  IRawStyle,
+  IFontFace,
+  IFontWeight
+} from './IRawStyle';
+
+export {
+  mergeStyles
+} from './mergeStyles';
+
+export {
+  mergeStyleSets
+} from './mergeStyleSets';
+
+export {
+  concatStyleSets
+} from './concatStyleSets';
+
+export {
+  fontFace
+} from './fontFace';
+
+export {
+  keyframes
+} from './keyframes';
+
+export {
+  IStyleSheetConfig,
+  InjectionMode,
+  Stylesheet
+} from './Stylesheet';
diff --git a/packages/merge-styles/src/keyframes.test.ts b/packages/merge-styles/src/keyframes.test.ts
new file mode 100644
index 0000000000000..573a4fb8d3379
--- /dev/null
+++ b/packages/merge-styles/src/keyframes.test.ts
@@ -0,0 +1,50 @@
+import { keyframes } from './keyframes';
+import {
+  Stylesheet,
+  InjectionMode
+} from './Stylesheet';
+
+const { expect } = chai;
+const _stylesheet: Stylesheet = Stylesheet.getInstance();
+
+_stylesheet.setConfig({ injectionMode: InjectionMode.none });
+
+describe('keyframes', () => {
+  beforeEach(() => {
+    _stylesheet.reset();
+  });
+
+  it('can register from/to keyframes', () => {
+    keyframes({
+      from: {
+        opacity: 0,
+      },
+      to: {
+        opacity: 1
+      }
+    });
+
+    expect(_stylesheet.getRules()).equals(
+      '@keyframes css-0{from{opacity:0;}to{opacity:1;}}'
+    );
+  });
+
+  it('can register percentage keyframes', () => {
+    keyframes({
+      '0%': {
+        opacity: 0,
+      },
+      '50%': {
+        opacity: .8
+      },
+      '100%': {
+        opacity: 1
+      }
+    });
+
+    expect(_stylesheet.getRules()).equals(
+      '@keyframes css-0{0%{opacity:0;}50%{opacity:0.8;}100%{opacity:1;}}'
+    );
+  });
+
+});
\ No newline at end of file
diff --git a/packages/merge-styles/src/keyframes.ts b/packages/merge-styles/src/keyframes.ts
new file mode 100644
index 0000000000000..fec40daa0e921
--- /dev/null
+++ b/packages/merge-styles/src/keyframes.ts
@@ -0,0 +1,27 @@
+import { Stylesheet } from './Stylesheet';
+import { serializeRuleEntries } from './styleToClassName';
+
+/**
+ * Registers keyframe definitions.
+ *
+ * @public
+ */
+export function keyframes(timeline: { [key: string]: {} }): string {
+  const stylesheet = Stylesheet.getInstance();
+  const name = stylesheet.getClassName();
+
+  const rulesArray: string[] = [];
+
+  for (const prop in timeline) {
+    if (timeline.hasOwnProperty(prop)) {
+      rulesArray.push(prop, '{', serializeRuleEntries(timeline[prop]), '}');
+    }
+  }
+  const rules = rulesArray.join('');
+
+  stylesheet.insertRule(`@keyframes ${name}{${rules}}`);
+
+  // If needed later, we would add vendor prefixes here.
+
+  return name;
+}
diff --git a/packages/merge-styles/src/mergeStyleSets.test.ts b/packages/merge-styles/src/mergeStyleSets.test.ts
new file mode 100644
index 0000000000000..3736931fb58c8
--- /dev/null
+++ b/packages/merge-styles/src/mergeStyleSets.test.ts
@@ -0,0 +1,50 @@
+import { mergeStyleSets } from './mergeStyleSets';
+import {
+  Stylesheet,
+  InjectionMode
+} from './Stylesheet';
+
+const { expect } = chai;
+const _stylesheet: Stylesheet = Stylesheet.getInstance();
+
+_stylesheet.setConfig({ injectionMode: InjectionMode.none });
+
+describe('mergeStyleSets', () => {
+  beforeEach(() => {
+    _stylesheet.reset();
+  });
+
+  it('can merge style sets', () => {
+
+    // tslint:disable-next-line:no-any
+    const result = mergeStyleSets<any>(
+      {
+        root: { background: 'red' },
+        a: { background: 'green' }
+      },
+      {
+        a: { background: 'white' },
+        b: { background: 'blue' }
+      },
+      {
+        root: {
+          selectors: {
+            ':hover': { background: 'yellow' }
+          }
+        }
+      }
+    );
+
+    expect(result).eqls({
+      root: 'css-0',
+      a: 'css-1',
+      b: 'css-2'
+    });
+
+    expect(_stylesheet.getRules()).equals(
+      '.css-0{background:red;}.css-0:hover{background:yellow;}' +
+      '.css-1{background:white;}' +
+      '.css-2{background:blue;}'
+    );
+  });
+});
\ No newline at end of file
diff --git a/packages/merge-styles/src/mergeStyleSets.ts b/packages/merge-styles/src/mergeStyleSets.ts
new file mode 100644
index 0000000000000..5ad495f072c04
--- /dev/null
+++ b/packages/merge-styles/src/mergeStyleSets.ts
@@ -0,0 +1,27 @@
+import { mergeStyles } from './mergeStyles';
+import { concatStyleSets } from './concatStyleSets';
+import { IStyle } from './IStyle';
+
+/**
+ * Allows you to pass in 1 or more sets of areas which will return a merged
+ * set of classes.
+ *
+ * @public
+ */
+export function mergeStyleSets<T extends object>(
+  ...cssSets: T[]
+): {[P in keyof T]?: string } {
+  const classNameSet: {[P in keyof T]?: string } = {};
+  let cssSet = cssSets[0];
+
+  if (cssSets.length > 1) {
+    cssSet = concatStyleSets(...cssSets);
+  }
+  for (const prop in cssSet) {
+    if (cssSet.hasOwnProperty(prop)) {
+      classNameSet[prop] = mergeStyles(cssSet[prop] as IStyle);
+    }
+  }
+
+  return classNameSet;
+}
diff --git a/packages/merge-styles/src/mergeStyles.test.ts b/packages/merge-styles/src/mergeStyles.test.ts
new file mode 100644
index 0000000000000..a251bbe9e1245
--- /dev/null
+++ b/packages/merge-styles/src/mergeStyles.test.ts
@@ -0,0 +1,48 @@
+import { mergeStyles } from './mergeStyles';
+import {
+  Stylesheet,
+  InjectionMode
+} from './Stylesheet';
+
+const { expect } = chai;
+const _stylesheet: Stylesheet = Stylesheet.getInstance();
+
+_stylesheet.setConfig({ injectionMode: InjectionMode.none });
+
+describe('mergeStyles', () => {
+  beforeEach(() => {
+    _stylesheet.reset();
+  });
+
+  it('can join strings', () => {
+    expect(mergeStyles('a', false, null, undefined, 'b')).equals('a b');
+  });
+
+  it('can join arrays of strings', () => {
+    expect(mergeStyles(['a', 'b', 'c'], false, null, undefined)).equals('a b c');
+  });
+
+  it('can mix styles and classnames together', () => {
+    expect(mergeStyles('foo', { background: 'red' })).equals('foo css-0');
+    expect(_stylesheet.getRules()).equals('.css-0{background:red;}');
+  });
+
+  it('can remerge styles', () => {
+    const className: string = mergeStyles({ background: 'red', color: 'black' });
+    const newClassName = mergeStyles(className, { color: 'white' });
+
+    expect(className).equals('css-0');
+    expect(newClassName).equals('css-1');
+    expect(_stylesheet.getRules()).equals(
+      '.css-0{background:red;color:black;}.css-1{background:red;color:white;}'
+    );
+  });
+
+  it('can normalize margins', () => {
+    mergeStyles({ margin: '4px' }, { marginRight: '8px' });
+    expect(_stylesheet.getRules()).equals(
+      '.css-0{margin-top:4px;margin-right:8px;margin-bottom:4px;margin-left:4px;}'
+    );
+  });
+
+});
diff --git a/packages/merge-styles/src/mergeStyles.ts b/packages/merge-styles/src/mergeStyles.ts
new file mode 100644
index 0000000000000..1f9beef45bca3
--- /dev/null
+++ b/packages/merge-styles/src/mergeStyles.ts
@@ -0,0 +1,41 @@
+import { IStyle } from './IStyle';
+import { styleToClassName } from './styleToClassName';
+import { Stylesheet } from './Stylesheet';
+
+/**
+ * Concatination helper, which can merge class names together. Skips over falsey values.
+ *
+ * @public
+ */
+export function mergeStyles(...args: (IStyle | IStyle[])[]): string {
+  const classes: string[] = [];
+  const objects: {}[] = [];
+  const stylesheet = Stylesheet.getInstance();
+
+  function _processArgs(argsList: (IStyle | IStyle[])[]): void {
+    for (const arg of argsList) {
+      if (arg) {
+        if (typeof arg === 'string') {
+          const translatedArgs = stylesheet.argsFromClassName(arg);
+          if (translatedArgs) {
+            objects.push(translatedArgs);
+          } else {
+            classes.push(arg);
+          }
+        } else if (Array.isArray(arg)) {
+          _processArgs(arg);
+        } else if (typeof arg === 'object') {
+          objects.push(arg);
+        }
+      }
+    }
+  }
+
+  _processArgs(args);
+
+  if (objects.length) {
+    classes.push(styleToClassName(objects));
+  }
+
+  return classes.join(' ');
+}
diff --git a/packages/merge-styles/src/server.test.ts b/packages/merge-styles/src/server.test.ts
new file mode 100644
index 0000000000000..cd5ee2480cdf4
--- /dev/null
+++ b/packages/merge-styles/src/server.test.ts
@@ -0,0 +1,28 @@
+import { renderStatic } from './server';
+import {
+  Stylesheet,
+  InjectionMode
+} from './Stylesheet';
+import {
+  mergeStyleSets
+} from './mergeStyleSets';
+
+const { expect } = chai;
+
+describe('staticRender', () => {
+  it('can render content', () => {
+
+    const { html, css } = renderStatic(() => {
+      const classNames = mergeStyleSets({
+        root: {
+          background: 'red'
+        }
+      });
+
+      return `<div class="${classNames.root}">Hello!</div>`;
+    });
+
+    expect(html).equals(`<div class="css-0">Hello!</div>`);
+    expect(css).equals(`.css-0{background:red;}`);
+  });
+});
\ No newline at end of file
diff --git a/packages/merge-styles/src/server.ts b/packages/merge-styles/src/server.ts
new file mode 100644
index 0000000000000..6039007617198
--- /dev/null
+++ b/packages/merge-styles/src/server.ts
@@ -0,0 +1,17 @@
+import { InjectionMode, Stylesheet } from './Stylesheet';
+
+export function renderStatic(
+  onRender: () => string
+): { html: string, css: string } {
+  const stylesheet = Stylesheet.getInstance();
+
+  stylesheet.setConfig({
+    injectionMode: InjectionMode.none
+  });
+  stylesheet.reset();
+
+  return {
+    html: onRender(),
+    css: stylesheet.getRules()
+  };
+}
\ No newline at end of file
diff --git a/packages/merge-styles/src/styleToClassName.test.ts b/packages/merge-styles/src/styleToClassName.test.ts
new file mode 100644
index 0000000000000..ba11f25e031aa
--- /dev/null
+++ b/packages/merge-styles/src/styleToClassName.test.ts
@@ -0,0 +1,125 @@
+import 'es6-map/implement';
+import { setRTL } from './transforms/rtlifyRules';
+import { styleToClassName } from './styleToClassName';
+import {
+  InjectionMode,
+  Stylesheet
+} from './Stylesheet';
+
+const { expect } = chai;
+const _stylesheet: Stylesheet = Stylesheet.getInstance();
+
+_stylesheet.setConfig({ injectionMode: InjectionMode.none });
+
+describe('styleToClassName', () => {
+  beforeEach(() => {
+    _stylesheet.reset();
+  });
+
+  it('can register classes and avoid re-registering', () => {
+    let className = styleToClassName({ background: 'red' });
+
+    expect(className).equals('css-0');
+    expect(_stylesheet.getRules()).equals('.css-0{background:red;}');
+
+    className = styleToClassName({ background: 'red' });
+
+    expect(className).equals('css-0');
+    expect(_stylesheet.getRules()).equals('.css-0{background:red;}');
+
+    className = styleToClassName({ background: 'green' });
+
+    expect(className).equals('css-1');
+    expect(_stylesheet.getRules()).equals('.css-0{background:red;}.css-1{background:green;}');
+  });
+
+  it('can register pseudo selectors', () => {
+    const className = styleToClassName({
+      selectors: {
+        ':hover': { background: 'red' }
+      }
+    });
+
+    expect(className).equals('css-0');
+    expect(_stylesheet.getRules()).equals('.css-0:hover{background:red;}');
+  });
+
+  it('can register parent and sibling selectors', () => {
+    const className = styleToClassName({
+      selectors: {
+        '& .child': { background: 'red' },
+        '.parent &': { background: 'green' }
+      }
+    });
+
+    expect(className).equals('css-0');
+    expect(_stylesheet.getRules()).equals('.css-0 .child{background:red;}.parent .css-0{background:green;}');
+  });
+
+  it('can merge rules', () => {
+    let className = styleToClassName(
+      null,
+      false,
+      undefined,
+      { backgroundColor: 'red', color: 'white' },
+      { backgroundColor: 'green' }
+    );
+
+    expect(className).equals('css-0');
+    expect(_stylesheet.getRules()).equals('.css-0{background-color:green;color:white;}');
+
+    className = styleToClassName({ backgroundColor: 'green', color: 'white' });
+    expect(className).equals('css-0');
+  });
+
+  it('returns blank string with no input', () => {
+    expect(styleToClassName()).equals('');
+  });
+
+  it('can preserve displayName in names', () => {
+    expect(styleToClassName({ displayName: 'DisplayName', background: 'red' })).equals('DisplayName-0');
+    expect(_stylesheet.getRules()).equals('.DisplayName-0{background:red;}');
+  });
+
+  it('can flip rtl and add units', () => {
+    setRTL(true);
+
+    styleToClassName({ left: 40 });
+    expect(_stylesheet.getRules()).equals('.css-0{right:40px;}');
+
+    setRTL(false);
+  });
+
+  it('can prefix webkit specific things', () => {
+    styleToClassName({ WebkitFontSmoothing: 'none' });
+    expect(_stylesheet.getRules()).equals('.css-0{-webkit-font-smoothing:none;}');
+  });
+
+  it('can expand previously defined rules', () => {
+    const className = styleToClassName({ background: 'red' });
+    const newClassName = styleToClassName(className, { color: 'white' });
+
+    expect(newClassName).equals('css-1');
+    expect(_stylesheet.getRules()).equals('.css-0{background:red;}.css-1{background:red;color:white;}');
+  });
+
+  it('can expand an array of rules', () => {
+    styleToClassName([
+      { background: 'red' },
+      { background: 'white' }
+    ]);
+    expect(_stylesheet.getRules()).equals('.css-0{background:white;}');
+  });
+
+  it('can expand increased specificity rules', () => {
+    styleToClassName({
+      selectors: {
+        '&&&': {
+          background: 'red'
+        }
+      }
+    });
+
+    expect(_stylesheet.getRules()).equals('.css-0.css-0.css-0{background:red;}');
+  });
+});
diff --git a/packages/merge-styles/src/styleToClassName.ts b/packages/merge-styles/src/styleToClassName.ts
new file mode 100644
index 0000000000000..77c72f2d29464
--- /dev/null
+++ b/packages/merge-styles/src/styleToClassName.ts
@@ -0,0 +1,164 @@
+import { rtlifyRules } from './transforms/rtlifyRules';
+import { provideUnits } from './transforms/provideUnits';
+import { prefixRules } from './transforms/prefixRules';
+import { kebabRules } from './transforms/kebabRules';
+import { getVendorSettings } from './getVendorSettings';
+import { Stylesheet } from './Stylesheet';
+import { IStyle, IExtendedRawStyle } from './IStyle';
+
+const DISPLAY_NAME = 'displayName';
+
+function getDisplayName(rules?: Map<string, IStyle>): string | undefined {
+  const rootStyle: IStyle = rules && rules.get('&');
+
+  return rootStyle ? (rootStyle as IExtendedRawStyle).displayName : undefined;
+}
+
+function extractRules(
+  args: IStyle[],
+  rules: Map<string, {}> = new Map<string, {}>(),
+  currentSelector: string = '&'
+): Map<string, {}> {
+  const stylesheet = Stylesheet.getInstance();
+  let currentRules: {} | undefined = rules.get(currentSelector);
+
+  if (!currentRules) {
+    currentRules = {};
+    rules.set(currentSelector, currentRules);
+  }
+
+  for (const arg of args) {
+    // If the arg is a string, we need to look up the class map and merge.
+    if (typeof arg === 'string') {
+      const expandedRules = stylesheet.argsFromClassName(arg);
+
+      if (expandedRules) {
+        extractRules(expandedRules, rules);
+      }
+      // Else if the arg is an array, we need to recurse in.
+    } else if (Array.isArray(arg)) {
+      extractRules(arg, rules, currentSelector);
+    } else {
+      // tslint:disable-next-line:no-any
+      for (const prop in (arg as any)) {
+        if (prop === 'selectors') {
+          // tslint:disable-next-line:no-any
+          const selectors: { [key: string]: IStyle } = (arg as any).selectors;
+
+          for (let newSelector in selectors) {
+            if (selectors.hasOwnProperty(newSelector)) {
+              const selectorValue = selectors[newSelector];
+
+              if (newSelector.indexOf('&') < 0) {
+                newSelector = currentSelector + newSelector;
+              }
+              extractRules([selectorValue], rules, newSelector);
+            }
+          }
+        } else {
+          // Else, add the rule to the currentSelector.
+          if (prop === 'margin' || prop === 'padding') {
+            // tslint:disable-next-line:no-any
+            expandQuads(currentRules, prop, (arg as any)[prop]);
+          } else {
+            // tslint:disable-next-line:no-any
+            (currentRules as any)[prop] = (arg as any)[prop] as any;
+          }
+        }
+      }
+    }
+  }
+
+  return rules;
+}
+
+function expandQuads(
+  currentRules: { [key: string]: string },
+  name: string,
+  value: string
+): void {
+  const parts = value.split(' ');
+  currentRules[name + 'Top'] = parts[0];
+  currentRules[name + 'Right'] = parts[1] || parts[0];
+  currentRules[name + 'Bottom'] = parts[2] || parts[0];
+  currentRules[name + 'Left'] = parts[3] || parts[1] || parts[0];
+}
+
+function getKeyForRules(rules: Map<string, IStyle>): string | undefined {
+  const serialized: string[] = [];
+  let hasProps = false;
+
+  rules.forEach((ruleEntries: { [key: string]: string }, selector: string): void => {
+    serialized.push(selector);
+
+    for (const propName in ruleEntries) {
+      if (ruleEntries.hasOwnProperty(propName)) {
+        hasProps = true;
+        serialized.push(propName, ruleEntries[propName]);
+      }
+    }
+  });
+
+  return hasProps ? serialized.join('') : undefined;
+}
+
+export function serializeRuleEntries(ruleEntries: { [key: string]: string | number }): string {
+  if (!ruleEntries) {
+    return '';
+  }
+
+  const allEntries: (string | number)[] = [];
+
+  for (const entry in ruleEntries) {
+    if (ruleEntries.hasOwnProperty(entry) && entry !== DISPLAY_NAME) {
+      allEntries.push(entry, ruleEntries[entry]);
+    }
+  }
+
+  // Apply transforms.
+  for (let i = 0; i < allEntries.length; i += 2) {
+    kebabRules(allEntries, i);
+    provideUnits(allEntries, i);
+    rtlifyRules(allEntries, i);
+    prefixRules(allEntries, i);
+  }
+
+  // Apply punctuation.
+  for (let i = 1; i < allEntries.length; i += 4) {
+    allEntries.splice(i, 1, ':', allEntries[i], ';');
+  }
+
+  return allEntries.join('');
+}
+
+export function styleToClassName(...args: IStyle[]): string {
+  const rules: Map<string, IStyle> = extractRules(args);
+  const key = getKeyForRules(rules);
+  let className = '';
+
+  if (key) {
+    const stylesheet = Stylesheet.getInstance();
+
+    className = stylesheet.classNameFromKey(key)!;
+
+    if (!className) {
+      className = stylesheet.getClassName(getDisplayName(rules));
+      stylesheet.cacheClassName(className, key, args);
+
+      const ruleSelectors = rules.keys();
+      let selector = ruleSelectors.next().value;
+
+      while (selector) {
+        const rulesToInsert: string = serializeRuleEntries(rules.get(selector) as {});
+
+        if (rulesToInsert) {
+          selector = selector.replace(/\&/g, `.${className}`);
+          stylesheet.insertRule(`${selector}{${rulesToInsert}}`);
+        }
+        selector = ruleSelectors.next().value;
+      }
+    }
+  }
+
+  return className;
+}
diff --git a/packages/merge-styles/src/transforms/kebabRules.test.ts b/packages/merge-styles/src/transforms/kebabRules.test.ts
new file mode 100644
index 0000000000000..7fe3d58730a82
--- /dev/null
+++ b/packages/merge-styles/src/transforms/kebabRules.test.ts
@@ -0,0 +1,34 @@
+import { kebabRules } from './kebabRules';
+import { expect } from 'chai';
+
+describe('kebabRules', () => {
+
+  it('can kebab the names', () => {
+    const rules = [
+      'backgroundColor',
+      '#cAcAcA'
+    ];
+
+    kebabRules(rules, 0);
+
+    expect(rules).eqls([
+      'background-color',
+      '#cAcAcA'
+    ]);
+  });
+
+  it('can kebab webkit prefix', () => {
+    const rules = [
+      'WebkitFontSmoothing',
+      'antialiased'
+    ];
+
+    kebabRules(rules, 0);
+
+    expect(rules).eqls([
+      '-webkit-font-smoothing',
+      'antialiased'
+    ]);
+  });
+
+});
diff --git a/packages/merge-styles/src/transforms/kebabRules.ts b/packages/merge-styles/src/transforms/kebabRules.ts
new file mode 100644
index 0000000000000..33ad7b88e0aaa
--- /dev/null
+++ b/packages/merge-styles/src/transforms/kebabRules.ts
@@ -0,0 +1,6 @@
+export function kebabRules(
+  rulePairs: (string | number)[],
+  index: number
+): void {
+  rulePairs[index] = (rulePairs[index] as string).replace(/([A-Z])/g, '-$1').toLowerCase();
+}
\ No newline at end of file
diff --git a/packages/merge-styles/src/transforms/prefixRules.test.ts b/packages/merge-styles/src/transforms/prefixRules.test.ts
new file mode 100644
index 0000000000000..a6f99c41c7676
--- /dev/null
+++ b/packages/merge-styles/src/transforms/prefixRules.test.ts
@@ -0,0 +1,67 @@
+import { prefixRules } from './prefixRules';
+import { setVendorSettings } from '../getVendorSettings';
+import { expect } from 'chai';
+
+const AUTO_TRANSLATED_RULES = [
+  'user-select'
+];
+
+describe('prefixRules', () => {
+  after(() => {
+    setVendorSettings(undefined);
+  });
+
+  it('can provide translate webkit rules', () => {
+    AUTO_TRANSLATED_RULES.forEach((rule: string) => {
+      const rules = [rule, 'none'];
+
+      setVendorSettings({ isWebkit: true });
+      prefixRules(rules, 0);
+
+      expect(rules).eql([
+        rule, 'none',
+        '-webkit-' + rule, 'none'
+      ]);
+    });
+  });
+
+  it('can provide translate moz rules', () => {
+    AUTO_TRANSLATED_RULES.forEach((rule: string) => {
+      const rules = [rule, 'none'];
+
+      setVendorSettings({ isMoz: true });
+      prefixRules(rules, 0);
+      expect(rules).eql([
+        rule, 'none',
+        '-moz-' + rule, 'none'
+      ]);
+    });
+  });
+
+  it('can provide translate ms rules', () => {
+    AUTO_TRANSLATED_RULES.forEach((rule: string) => {
+      const rules = [rule, 'none'];
+
+      setVendorSettings({ isMs: true });
+      prefixRules(rules, 0);
+      expect(rules).eql([
+        rule, 'none',
+        '-ms-' + rule, 'none'
+      ]);
+    });
+  });
+
+  it('can provide translate opera rules', () => {
+    AUTO_TRANSLATED_RULES.forEach((rule: string) => {
+      const rules = [rule, 'none'];
+
+      setVendorSettings({ isOpera: true });
+      prefixRules(rules, 0);
+      expect(rules).eql([
+        rule, 'none',
+        '-o-' + rule, 'none'
+      ]);
+    });
+  });
+
+});
\ No newline at end of file
diff --git a/packages/merge-styles/src/transforms/prefixRules.ts b/packages/merge-styles/src/transforms/prefixRules.ts
new file mode 100644
index 0000000000000..109fe3b089d87
--- /dev/null
+++ b/packages/merge-styles/src/transforms/prefixRules.ts
@@ -0,0 +1,33 @@
+import { getVendorSettings } from '../getVendorSettings';
+
+const autoPrefixNames: { [key: string]: number } = {
+  'user-select': 1
+};
+
+export function prefixRules(
+  rulePairs: (string | number)[],
+  index: number
+): void {
+  const vendorSettings = getVendorSettings();
+
+  const name = rulePairs[index];
+
+  if (autoPrefixNames[name]) {
+    const value = rulePairs[index + 1];
+
+    if (autoPrefixNames[name]) {
+      if (vendorSettings.isWebkit) {
+        rulePairs.push('-webkit-' + name, value);
+      }
+      if (vendorSettings.isMoz) {
+        rulePairs.push('-moz-' + name, value);
+      }
+      if (vendorSettings.isMs) {
+        rulePairs.push('-ms-' + name, value);
+      }
+      if (vendorSettings.isOpera) {
+        rulePairs.push('-o-' + name, value);
+      }
+    }
+  }
+}
diff --git a/packages/merge-styles/src/transforms/provideUnits.test.ts b/packages/merge-styles/src/transforms/provideUnits.test.ts
new file mode 100644
index 0000000000000..3e5d641b632b8
--- /dev/null
+++ b/packages/merge-styles/src/transforms/provideUnits.test.ts
@@ -0,0 +1,63 @@
+import { provideUnits } from './provideUnits';
+
+import { expect } from 'chai';
+
+describe('provideUnits', () => {
+  it('can provide units', () => {
+    const propertiesToTest = [
+      'left',
+      'right',
+      'top',
+      'bottom',
+      'borderWidth'
+    ].forEach((property: string) => {
+      const testSet: (string | number)[] = [property, 1];
+
+      provideUnits(testSet, 0);
+
+      expect(testSet).eql([property, '1px']);
+    });
+  });
+
+  it('can provide units for directional props', () => {
+    const propertiesToTest = [
+      'padding',
+      'margin',
+      'border'
+    ].forEach((property: string) => {
+      const testSet: (string | number)[] = [
+        property, 1,
+        property + 'Left', 1,
+        property + 'Right', 1,
+        property + 'Top', 1,
+        property + 'Bottom', 1
+      ];
+
+      provideUnits(testSet, 0);
+      provideUnits(testSet, 2);
+      provideUnits(testSet, 4);
+      provideUnits(testSet, 6);
+      provideUnits(testSet, 8);
+
+      expect(testSet).eql([
+        property, '1px',
+        property + 'Left', '1px',
+        property + 'Right', '1px',
+        property + 'Top', '1px',
+        property + 'Bottom', '1px'
+      ]);
+    });
+  });
+
+  it('ignores opacity', () => {
+    const testSet = [
+      'opacity',
+      0
+    ];
+
+    provideUnits(testSet, 0);
+
+    expect(testSet).eql(['opacity', 0]);
+  });
+
+});
\ No newline at end of file
diff --git a/packages/merge-styles/src/transforms/provideUnits.ts b/packages/merge-styles/src/transforms/provideUnits.ts
new file mode 100644
index 0000000000000..9b3c4b5fa2132
--- /dev/null
+++ b/packages/merge-styles/src/transforms/provideUnits.ts
@@ -0,0 +1,14 @@
+export function provideUnits(
+  rulePairs: (string | number)[],
+  index: number
+): void {
+  const name = rulePairs[index];
+  const value = rulePairs[index + 1];
+
+  if (
+    name !== 'opacity' &&
+    typeof value === 'number'
+  ) {
+    rulePairs[index + 1] = `${value}px`;
+  }
+}
diff --git a/packages/merge-styles/src/transforms/rtlifyRules.test.ts b/packages/merge-styles/src/transforms/rtlifyRules.test.ts
new file mode 100644
index 0000000000000..e2ce99fd79ebb
--- /dev/null
+++ b/packages/merge-styles/src/transforms/rtlifyRules.test.ts
@@ -0,0 +1,54 @@
+import { setRTL, rtlifyRules } from './rtlifyRules';
+
+const { expect } = chai;
+
+describe('rtlifyRules', () => {
+
+  before(() => {
+    setRTL(true);
+  });
+
+  after(() => {
+    setRTL(false);
+  });
+
+  it('can auto flip or avoid autoflipping with noflip', () => {
+    [
+      [['left', '42'], ['right', '42']],
+      [['right', '42'], ['left', '42']],
+      [['float', 'left'], ['float', 'right']],
+      [['float', 'right'], ['float', 'left']],
+      [['clear', 'left'], ['clear', 'right']],
+      [['margin', '42'], ['margin', '42']],
+      [['margin', '1 2'], ['margin', '1 2']],
+      [['margin', '1 2 3'], ['margin', '1 2 3']],
+      [['margin', '1 2 3 4'], ['margin', '1 4 3 2']],
+      [['margin-left', '42'], ['margin-right', '42']],
+      [['margin-right', '42'], ['margin-left', '42']],
+      [['padding', '42'], ['padding', '42']],
+      [['padding', '1 2'], ['padding', '1 2']],
+      [['padding', '1 2 3'], ['padding', '1 2 3']],
+      [['padding', '1 2 3 4'], ['padding', '1 4 3 2']],
+      [['padding-left', '42'], ['padding-right', '42']],
+      [['padding-right', '42'], ['padding-left', '42']],
+      [['cursor', 'w-resize'], ['cursor', 'e-resize']],
+      [['cursor', 'sw-resize'], ['cursor', 'se-resize']],
+      [['cursor', 'nw-resize'], ['cursor', 'ne-resize']],
+      [['left', '42px /*noflip*/'], ['left', '42px /*noflip*/']],
+      [['box-shadow', '42px 0 red'], ['box-shadow', '-42px 0 red']],
+      [['box-shadow', '-42px 0 red'], ['box-shadow', '42px 0 red']]
+    ].forEach((test: string[][]) => {
+      rtlifyRules(test[0], 0);
+      expect(test[0]).eqls(test[1]);
+    });
+  });
+
+  it('does not flip an unflippable cursor', () => {
+    const rules = ['cursor', 'hand'];
+
+    rtlifyRules(rules, 0);
+
+    expect(rules).eqls(['cursor', 'hand']);
+  });
+
+});
diff --git a/packages/merge-styles/src/transforms/rtlifyRules.ts b/packages/merge-styles/src/transforms/rtlifyRules.ts
new file mode 100644
index 0000000000000..46a3bca8c3359
--- /dev/null
+++ b/packages/merge-styles/src/transforms/rtlifyRules.ts
@@ -0,0 +1,85 @@
+const _nameReplacements: { [key: string]: string } = {
+  'left': 'right',
+  'right': 'left'
+};
+
+const _valueReplacements: { [key: string]: string } = {
+  'w-resize': 'e-resize',
+  'sw-resize': 'se-resize',
+  'nw-resize': 'ne-resize'
+};
+
+const NO_FLIP = 'noflip';
+
+let _rtl = getRTL();
+
+export function setRTL(isRTL: boolean): void {
+  _rtl = isRTL;
+}
+export function getRTL(): boolean {
+  if (_rtl === undefined) {
+    _rtl = (
+      typeof document !== undefined &&
+      !!document.documentElement &&
+      document.documentElement.getAttribute('dir') === 'rtl'
+    );
+  }
+  return _rtl;
+}
+
+export function rtlifyRules(
+  rulePairs: (string | number)[],
+  index: number
+): void {
+  if (getRTL()) {
+    const name = rulePairs[index] as string;
+    const value = rulePairs[index + 1] as string;
+
+    if (value.indexOf(NO_FLIP) >= 0) {
+      return;
+    } else if (name.indexOf('left') >= 0) {
+      rulePairs[index] = name.replace('left', 'right');
+    } else if (name.indexOf('right') >= 0) {
+      rulePairs[index] = name.replace('right', 'left');
+    } else if (String(value).indexOf('left') >= 0) {
+      rulePairs[index + 1] = value.replace('left', 'right');
+    } else if (String(value).indexOf('right') >= 0) {
+      rulePairs[index + 1] = value.replace('right', 'left');
+    } else if (_nameReplacements[name]) {
+      rulePairs[index] = _nameReplacements[name];
+    } else if (_valueReplacements[value]) {
+      rulePairs[index + 1] = _valueReplacements[value];
+    } else {
+      switch (name) {
+        case 'margin':
+        case 'padding':
+          rulePairs[index + 1] = flipQuad(value);
+          break;
+        case 'box-shadow':
+          rulePairs[index + 1] = negateNum(value, 0);
+          break;
+      }
+    }
+  }
+}
+
+function negateNum(value: string, partIndex: number): string {
+  const parts = value.split(' ');
+  const numberVal = parseInt(parts[partIndex], 10);
+
+  parts[0] = parts[0].replace(String(numberVal), String(numberVal * -1));
+
+  return parts.join(' ');
+}
+
+function flipQuad(value: string): string {
+  if (typeof value === 'string') {
+    const parts = value.split(' ');
+
+    if (parts.length === 4) {
+      return `${parts[0]} ${parts[3]} ${parts[2]} ${parts[1]}`;
+    }
+  }
+
+  return value;
+}
\ No newline at end of file
diff --git a/packages/merge-styles/tsconfig.json b/packages/merge-styles/tsconfig.json
new file mode 100644
index 0000000000000..d8bc289af26e3
--- /dev/null
+++ b/packages/merge-styles/tsconfig.json
@@ -0,0 +1,30 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "module": "commonjs",
+    "lib": [
+      "es2017",
+      "dom"
+    ],
+    "jsx": "react",
+    "declaration": true,
+    "sourceMap": true,
+    "experimentalDecorators": true,
+    "importHelpers": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "moduleResolution": "node",
+    "types": [
+      "chai",
+      "mocha"
+    ]
+  },
+  "exclude": [
+    "api",
+    "temp",
+    "node_modules",
+    "dist",
+    "lib",
+    "lib-amd"
+  ]
+}
\ No newline at end of file
diff --git a/packages/merge-styles/tslint.json b/packages/merge-styles/tslint.json
new file mode 100644
index 0000000000000..009d06e3cf447
--- /dev/null
+++ b/packages/merge-styles/tslint.json
@@ -0,0 +1,8 @@
+{
+  "extends": [
+    "office-ui-fabric-react-tslint"
+  ],
+  "rules": {
+    "prefer-const": true
+  }
+}
\ No newline at end of file
diff --git a/packages/merge-styles/webpack.config.js b/packages/merge-styles/webpack.config.js
new file mode 100644
index 0000000000000..a85316c212134
--- /dev/null
+++ b/packages/merge-styles/webpack.config.js
@@ -0,0 +1,57 @@
+'use strict';
+
+/** Note: this require may need to be fixed to point to the build that exports the gulp-core-build-webpack instance. */
+let build = require('@microsoft/web-library-build');
+let webpackTaskResources = build.webpack.resources;
+let webpack = webpackTaskResources.webpack;
+let path = require('path');
+let buildConfig = build.getConfig();
+let BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
+
+const BUNDLE_NAME = 'merge-styles';
+
+let webpackConfig = {
+
+  entry: {
+    [BUNDLE_NAME]: './lib/index.js'
+  },
+
+  output: {
+    libraryTarget: 'var',
+    library: 'MergeStyles',
+    path: path.join(__dirname, buildConfig.distFolder),
+    publicPath: '/dist/',
+    filename: `[name].min.js`
+  },
+
+  devtool: 'source-map',
+
+  externals: [
+    {
+      'tslib': {
+        commonjs: 'tslib',
+        amd: 'tslib'
+      }
+    }
+  ],
+
+  plugins: [
+    new BundleAnalyzerPlugin({
+      analyzerMode: 'static',
+      reportFilename: BUNDLE_NAME + '.stats.html',
+      openAnalyzer: false
+    }),
+    new webpack.DefinePlugin({
+      'process.env.NODE_ENV': JSON.stringify('production')
+    }),
+    new webpack.optimize.UglifyJsPlugin({
+      minimize: true,
+      compress: {
+        warnings: false
+      }
+    })
+  ]
+};
+
+
+module.exports = webpackConfig;
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 05b8a41e28c27..05f629befec4f 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -44,7 +44,7 @@
     "gutil": "1.6.4",
     "highlight.js": "^9.6.0",
     "load-themed-styles-loader": "^0.0.3",
-    "mocha": "^3.2.0",
+    "mocha": "^3.3.0",
     "mocha-loader": "^1.1.1",
     "node-sass": "^4.5.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
@@ -58,7 +58,7 @@
     "resemblejs": "~2.2.3",
     "sass-loader": "^6.0.3",
     "sinon": "^2.3.2",
-    "source-map-loader": "0.2.1",
+    "source-map-loader": "^0.2.1",
     "style-loader": "^0.17.0",
     "ts-loader": "^2.0.1",
     "typescript": "2.4.2",
diff --git a/packages/utilities/api/utilities.api.ts b/packages/utilities/api/utilities.api.ts
index 148a933912c03..64d6c0baddfde 100644
--- a/packages/utilities/api/utilities.api.ts
+++ b/packages/utilities/api/utilities.api.ts
@@ -183,7 +183,7 @@ class GlobalSettings {
   // (undocumented)
   public static addChangeListener(cb: IChangeEventCallback): void;
   // (undocumented)
-  public static getValue < T >(key: string): T;
+  public static getValue < T >(key: string, defaultValue?: T | (() => T)): T;
   // (undocumented)
   public static removeChangeListener(cb: IChangeEventCallback): void;
   // (undocumented)
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 20ede9718c479..67e0c849db82b 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -32,7 +32,7 @@
     "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
     "gulp": "~3.9.1",
-    "mocha": "~3.3.0",
+    "mocha": "^3.3.0",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/packages/utilities/src/GlobalSettings.ts b/packages/utilities/src/GlobalSettings.ts
index 199e2e052d87e..e04f798ef995e 100644
--- a/packages/utilities/src/GlobalSettings.ts
+++ b/packages/utilities/src/GlobalSettings.ts
@@ -52,7 +52,11 @@ export interface IChangeEventCallback {
  * @public
  */
 export class GlobalSettings {
-  public static getValue<T>(key: string): T {
+  public static getValue<T>(key: string, defaultValue?: T | (() => T)): T {
+    if (_globalSettings[key] === undefined) {
+      _globalSettings[key] = typeof defaultValue === 'function' ? defaultValue() : defaultValue;
+    }
+
     return _globalSettings[key];
   }
 
diff --git a/packages/utilities/src/rtl.ts b/packages/utilities/src/rtl.ts
index 6c71dfcdc71f2..eaeecb10b399b 100644
--- a/packages/utilities/src/rtl.ts
+++ b/packages/utilities/src/rtl.ts
@@ -1,5 +1,4 @@
 import { KeyCodes } from './KeyCodes';
-import { getDocument } from './dom';
 
 // Default to undefined so that we initialize on first read.
 let _isRTL: boolean | undefined;
@@ -13,7 +12,7 @@ export function getRTL(): boolean {
   let isRTL: boolean = _isRTL as boolean;
 
   if (isRTL === undefined) {
-    let doc = getDocument();
+    let doc = typeof document === 'undefined' ? undefined : document;
 
     if (doc && doc.documentElement) {
       isRTL = doc.documentElement.getAttribute('dir') === 'rtl';
@@ -29,7 +28,7 @@ export function getRTL(): boolean {
  * @public
  */
 export function setRTL(isRTL: boolean) {
-  let doc = getDocument();
+  let doc = typeof document === 'undefined' ? undefined : document;
 
   if (doc && doc.documentElement) {
     doc.documentElement.setAttribute('dir', isRTL ? 'rtl' : 'ltr');
diff --git a/rush.json b/rush.json
index 5443f5216968f..d28eb68b4c6b6 100644
--- a/rush.json
+++ b/rush.json
@@ -15,6 +15,11 @@
       "projectFolder": "packages/experiments",
       "shouldPublish": true
     },
+    {
+      "packageName": "@uifabric/merge-styles",
+      "projectFolder": "packages/merge-styles",
+      "shouldPublish": false
+    },
     {
       "packageName": "@uifabric/utilities",
       "projectFolder": "packages/utilities",

From 86e32f8ba71d8697da0c5f7f472619784b51a0bf Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Sun, 20 Aug 2017 13:30:40 -0700
Subject: [PATCH 0447/1641] PeoplePicker: Fixing A11yMAS issue in selected
 picker items (#2549)

* Fixing A11yMAS people picker labeling issues.

* Fixing conflict with tagpicker

* rush change

* Fixing in selected items in tagpicker
---
 ...brow-picker-uia-node-fixes_2017-08-18-22-51.json | 11 +++++++++++
 .../src/components/pickers/BasePicker.tsx           |  2 +-
 .../PeoplePickerItems/SelectedItemDefault.tsx       | 13 ++++++++++---
 .../src/components/pickers/TagPicker/TagItem.tsx    |  2 +-
 4 files changed, 23 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-picker-uia-node-fixes_2017-08-18-22-51.json

diff --git a/common/changes/office-ui-fabric-react/v-krbrow-picker-uia-node-fixes_2017-08-18-22-51.json b/common/changes/office-ui-fabric-react/v-krbrow-picker-uia-node-fixes_2017-08-18-22-51.json
new file mode 100644
index 0000000000000..6e66650c57f38
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-picker-uia-node-fixes_2017-08-18-22-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "PeoplePicker: Fixing A11yMAS accessibility issue in selected items.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index a057beb4f272f..675af774d1e0f 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -154,7 +154,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
           direction={ FocusZoneDirection.bidirectional }
           isInnerZoneKeystroke={ this._isFocusZoneInnerKeystroke }>
           <SelectionZone selection={ this.selection } selectionMode={ SelectionMode.multiple }>
-            <div className={ css('ms-BasePicker-text', styles.pickerText) }>
+            <div className={ css('ms-BasePicker-text', styles.pickerText) } role={ 'list' }>
               { this.renderItems() }
               <BaseAutoFill
                 { ...inputProps as any }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
index a7c3c5f150b24..f1bc9e65c6238 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
@@ -1,7 +1,7 @@
 /* tslint:disable */
 import * as React from 'react';
 /* tslint:enable */
-import { css } from '../../../../Utilities';
+import { css, getId } from '../../../../Utilities';
 import { Persona, PersonaSize, PersonaPresence } from '../../../../Persona';
 import { IPeoplePickerItemProps } from './PeoplePickerItem.Props';
 import { ValidationState } from '../../BasePicker.Props';
@@ -17,6 +17,9 @@ export const SelectedItemDefault: (props: IPeoplePickerItemProps) => JSX.Element
     selected,
     removeButtonAriaLabel
   } = peoplePickerItemProps;
+
+  const itemId = getId();
+
   return (
     <div
       className={ css(
@@ -27,8 +30,12 @@ export const SelectedItemDefault: (props: IPeoplePickerItemProps) => JSX.Element
       ) }
       data-is-focusable={ true }
       data-is-sub-focuszone={ true }
-      data-selection-index={ index } >
-      <div className={ css('ms-PickerItem-content', styles.itemContent) } >
+      data-selection-index={ index }
+      role={ 'listitem' }
+      aria-labelledby={ 'selectedItemPersona-' + itemId } >
+      <div
+        className={ css('ms-PickerItem-content', styles.itemContent) }
+        id={ 'selectedItemPersona-' + itemId } >
         <Persona
           { ...item }
           presence={ item.presence !== undefined ? item.presence : PersonaPresence.none }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx
index 38c19c840c079..d9bf674bd8d7e 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx
@@ -17,7 +17,7 @@ export const TagItem = (props: IPickerItemProps<ITag>) => (
     key={ props.index }
     data-selection-index={ props.index }
     data-is-focusable={ !props.disabled && true }>
-    <span className={ css('ms-TagItem-text', styles.tagItemText) }>{ props.children }</span>
+    <span className={ css('ms-TagItem-text', styles.tagItemText) } aria-label={ props.children }>{ props.children }</span>
     { !props.disabled &&
       <span className={ css('ms-TagItem-close', styles.tagItemClose) } onClick={ props.onRemoveItem }>
         <Icon iconName='Cancel' />

From 63f95d18ed4787e04b36cb5899fd1198f38b9bed Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sun, 20 Aug 2017 23:44:40 -0700
Subject: [PATCH 0448/1641] Disabling webpack in non-production builds. This
 speeds up the ci workflow.

---
 apps/fabric-website/gulpfile.js | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/apps/fabric-website/gulpfile.js b/apps/fabric-website/gulpfile.js
index 6ff514edd48bb..f192c8e1a73eb 100644
--- a/apps/fabric-website/gulpfile.js
+++ b/apps/fabric-website/gulpfile.js
@@ -37,9 +37,12 @@ build.karma.isEnabled = () => false;
 // Disable unnecessary subtasks.
 build.preCopy.isEnabled = () => false;
 
-//Disable tslint
+// Disable tslint
 build.tslint.isEnabled = () => false;
 
+// Only run bundling in production builds; this speeds up normal ci builds.
+build.webpack.isEnabled = () => isProduction;
+
 // Copy fabric-core to dist to be published with fabric-react.
 build.postCopy.setConfig({
   shouldFlatten: false,

From 1adca054bc055413461bbf273980a85c9721d181 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sun, 20 Aug 2017 23:51:03 -0700
Subject: [PATCH 0449/1641] Minor updates to merge-styles.

---
 packages/merge-styles/api/merge-styles.api.ts |  83 +++++++-------
 packages/merge-styles/src/IRawStyle.ts        | 103 ++++++++++--------
 packages/merge-styles/src/Stylesheet.ts       |   6 +-
 packages/merge-styles/src/concatStyleSets.ts  |   6 +-
 packages/merge-styles/src/mergeStyleSets.ts   |  16 +--
 packages/merge-styles/src/mergeStyles.ts      |   4 +-
 packages/merge-styles/src/server.test.ts      |   4 -
 packages/merge-styles/src/styleToClassName.ts |   1 -
 .../src/transforms/provideUnits.test.ts       |   4 +-
 .../src/transforms/rtlifyRules.ts             |   2 +-
 10 files changed, 123 insertions(+), 106 deletions(-)

diff --git a/packages/merge-styles/api/merge-styles.api.ts b/packages/merge-styles/api/merge-styles.api.ts
index 9c43cf64f8329..d0fc53e5dab8f 100644
--- a/packages/merge-styles/api/merge-styles.api.ts
+++ b/packages/merge-styles/api/merge-styles.api.ts
@@ -52,36 +52,36 @@ interface IRawStyle extends IRawFontStyle {
   backgroundPosition?: ICSSRule | string;
   backgroundRepeat?: ICSSRule | string;
   border?: ICSSRule | 0 | string;
-  borderBottom?: ICSSRule | number | string;
+  borderBottom?: ICSSRule | ICSSPixelUnitRule;
   borderBottomColor?: ICSSRule | string;
   borderBottomLeftRadius?: ICSSRule | string;
   borderBottomRightRadius?: ICSSRule | string;
   borderBottomStyle?: ICSSRule | string;
-  borderBottomWidth?: ICSSRule | string;
+  borderBottomWidth?: ICSSRule | ICSSPixelUnitRule;
   borderCollapse?: ICSSRule | string;
   borderColor?: ICSSRule | string;
   borderCornerShape?: ICSSRule | string;
   borderImageSource?: ICSSRule | string;
-  borderImageWidth?: ICSSRule | string;
-  borderLeft?: ICSSRule | number | string;
+  borderImageWidth?: ICSSRule | ICSSPixelUnitRule;
+  borderLeft?: ICSSRule | ICSSPixelUnitRule;
   borderLeftColor?: ICSSRule | string;
   borderLeftStyle?: ICSSRule | string;
-  borderLeftWidth?: ICSSRule | string;
-  borderRadius?: ICSSRule | string;
-  borderRight?: ICSSRule | number | string;
+  borderLeftWidth?: ICSSRule | ICSSPixelUnitRule;
+  borderRadius?: ICSSRule | ICSSPixelUnitRule;
+  borderRight?: ICSSRule | ICSSPixelUnitRule;
   borderRightColor?: ICSSRule | string;
   borderRightStyle?: ICSSRule | string;
-  borderRightWidth?: ICSSRule | string;
+  borderRightWidth?: ICSSRule | ICSSPixelUnitRule;
   borderSpacing?: ICSSRule | string;
   borderStyle?: ICSSRule | string;
-  borderTop?: ICSSRule | number | string;
+  borderTop?: ICSSRule | ICSSPixelUnitRule;
   borderTopColor?: ICSSRule | string;
   borderTopLeftRadius?: ICSSRule | string;
   borderTopRightRadius?: ICSSRule | string;
   borderTopStyle?: ICSSRule | string;
-  borderTopWidth?: ICSSRule | string;
-  borderWidth?: ICSSRule | number | string;
-  bottom?: ICSSRule | number | string;
+  borderTopWidth?: ICSSRule | ICSSPixelUnitRule;
+  borderWidth?: ICSSRule | ICSSPixelUnitRule;
+  bottom?: ICSSRule | ICSSPixelUnitRule;
   boxDecorationBreak?: ICSSRule | string;
   boxShadow?: ICSSRule | string;
   boxSizing?: ICSSRule | 'border-box' | 'content-box';
@@ -89,6 +89,7 @@ interface IRawStyle extends IRawFontStyle {
   breakBefore?: ICSSRule | string;
   breakInside?: ICSSRule | string;
   clear?: ICSSRule | string;
+  clip?: void;
   clipRule?: ICSSRule | string;
   color?: ICSSRule | string;
   columnCount?: ICSSRule | number | 'auto';
@@ -96,10 +97,10 @@ interface IRawStyle extends IRawFontStyle {
   columnGap?: ICSSRule | string;
   columnRule?: ICSSRule | string;
   columnRuleColor?: ICSSRule | string;
-  columnRuleWidth?: ICSSRule | string;
+  columnRuleWidth?: ICSSRule | ICSSPixelUnitRule;
   columns?: ICSSRule | string;
   columnSpan?: ICSSRule | string;
-  columnWidth?: ICSSRule | string;
+  columnWidth?: ICSSRule | ICSSPixelUnitRule;
   content?: string;
   counterIncrement?: ICSSRule | string;
   counterReset?: ICSSRule | string;
@@ -112,7 +113,7 @@ interface IRawStyle extends IRawFontStyle {
   fillOpacity?: ICSSRule | number;
   fillRule?: ICSSRule | string;
   filter?: ICSSRule | string;
-  flex?: ICSSRule | number | string;
+  flex?: ICSSRule | ICSSPixelUnitRule;
   flexBasis?: ICSSRule | string;
   flexDirection?: ICSSRule | 'row' | 'row-reverse' | 'column' | 'column-reverse';
   flexFlow?: ICSSRule | string;
@@ -132,24 +133,24 @@ interface IRawStyle extends IRawFontStyle {
   gridTemplateAreas?: ICSSRule | string;
   gridTemplateColumns?: ICSSRule | string;
   gridTemplateRows?: ICSSRule | string;
-  height?: ICSSRule | string;
+  height?: ICSSRule | ICSSPixelUnitRule;
   hyphenateLimitChars?: ICSSRule | string;
   hyphenateLimitLines?: ICSSRule | string;
   hyphenateLimitZone?: ICSSRule | string;
   hyphens?: ICSSRule | string;
   justifyContent?: ICSSRule | 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly';
-  left?: ICSSRule | number | string;
+  left?: ICSSRule | ICSSPixelUnitRule;
   letterSpacing?: ICSSRule | string;
-  lineHeight?: ICSSRule | 'normal' | number | ICSSLengthRule | ICSSPercentageRule;
+  lineHeight?: ICSSRule | 'normal' | number | ICSSPixelUnitRule | ICSSPercentageRule;
   listStyle?: ICSSRule | string;
   listStyleImage?: ICSSRule | string;
   listStylePosition?: ICSSRule | string;
   listStyleType?: ICSSRule | string;
-  margin?: ICSSRule | number | string;
-  marginBottom?: ICSSRule | number | string;
-  marginLeft?: ICSSRule | number | string;
-  marginRight?: ICSSRule | number | string;
-  marginTop?: ICSSRule | number | string;
+  margin?: ICSSRule | ICSSPixelUnitRule;
+  marginBottom?: ICSSRule | ICSSPixelUnitRule;
+  marginLeft?: ICSSRule | ICSSPixelUnitRule;
+  marginRight?: ICSSRule | ICSSPixelUnitRule;
+  marginTop?: ICSSRule | ICSSPixelUnitRule;
   marqueeDirection?: ICSSRule | string;
   marqueeStyle?: ICSSRule | string;
   mask?: ICSSRule | string;
@@ -157,16 +158,16 @@ interface IRawStyle extends IRawFontStyle {
   maskBorderRepeat?: ICSSRule | string;
   maskBorderSlice?: ICSSRule | string;
   maskBorderSource?: ICSSRule | string;
-  maskBorderWidth?: ICSSRule | string;
+  maskBorderWidth?: ICSSRule | ICSSPixelUnitRule;
   maskClip?: ICSSRule | string;
   maskOrigin?: ICSSRule | string;
   maxFontSize?: ICSSRule | string;
   maxHeight?: ICSSRule | string;
-  maxWidth?: ICSSRule | string;
-  minHeight?: ICSSRule | string;
-  minWidth?: ICSSRule | string;
-  MozFontSmoothing?: string;
-  opacity?: ICSSRule | number;
+  maxWidth?: ICSSRule | ICSSPixelUnitRule;
+  minHeight?: ICSSRule | ICSSPixelUnitRule;
+  minWidth?: ICSSRule | ICSSPixelUnitRule;
+  MozOsxFontSmoothing?: 'none' | 'antialiased' | 'grayscale' | 'subpixel-antialiased';
+  opacity?: ICSSRule | number | string;
   order?: ICSSRule | number;
   orphans?: ICSSRule | number;
   outline?: ICSSRule | 0 | string;
@@ -177,11 +178,11 @@ interface IRawStyle extends IRawFontStyle {
   overflowWrap?: ICSSRule | 'normal' | 'break-word';
   overflowX?: ICSSRule | 'auto' | 'hidden' | 'scroll' | 'visible';
   overflowY?: ICSSRule | 'auto' | 'hidden' | 'scroll' | 'visible';
-  padding?: ICSSRule | number | string;
-  paddingBottom?: ICSSRule | number | string;
-  paddingLeft?: ICSSRule | number | string;
-  paddingRight?: ICSSRule | number | string;
-  paddingTop?: ICSSRule | number | string;
+  padding?: ICSSRule | ICSSPixelUnitRule;
+  paddingBottom?: ICSSRule | ICSSPixelUnitRule;
+  paddingLeft?: ICSSRule | ICSSPixelUnitRule;
+  paddingRight?: ICSSRule | ICSSPixelUnitRule;
+  paddingTop?: ICSSRule | ICSSPixelUnitRule;
   pageBreakAfter?: ICSSRule | string;
   pageBreakBefore?: ICSSRule | string;
   pageBreakInside?: ICSSRule | string;
@@ -196,7 +197,7 @@ interface IRawStyle extends IRawFontStyle {
   regionFragment?: ICSSRule | string;
   restAfter?: ICSSRule | string;
   restBefore?: ICSSRule | string;
-  right?: ICSSRule | number | string;
+  right?: ICSSRule | ICSSPixelUnitRule;
   shapeImageThreshold?: ICSSRule | string;
   shapeInside?: ICSSRule | string;
   shapeMargin?: ICSSRule | string;
@@ -204,7 +205,7 @@ interface IRawStyle extends IRawFontStyle {
   speak?: ICSSRule | string;
   speakAs?: ICSSRule | string;
   strokeOpacity?: ICSSRule | number;
-  strokeWidth?: ICSSRule | ICSSPercentageRule | ICSSLengthRule;
+  strokeWidth?: ICSSRule | ICSSPixelUnitRule;
   tableLayout?: ICSSRule | string;
   tabSize?: ICSSRule | string;
   textAlign?: ICSSRule | string;
@@ -224,13 +225,13 @@ interface IRawStyle extends IRawFontStyle {
   textOverlineColor?: ICSSRule | string;
   textOverlineMode?: ICSSRule | string;
   textOverlineStyle?: ICSSRule | string;
-  textOverlineWidth?: ICSSRule | string;
+  textOverlineWidth?: ICSSRule | ICSSPixelUnitRule;
   textRendering?: ICSSRule | string;
   textShadow?: ICSSRule | string;
   textTransform?: ICSSRule | string;
   textUnderlinePosition?: ICSSRule | string;
   textUnderlineStyle?: ICSSRule | string;
-  top?: ICSSRule | number | string;
+  top?: ICSSRule | ICSSPixelUnitRule;
   touchAction?: ICSSRule | string;
   transform?: ICSSRule | string;
   transformOrigin?: ICSSRule | string;
@@ -258,7 +259,7 @@ interface IRawStyle extends IRawFontStyle {
   WebkitFontSmoothing?: 'none' | 'antialiased' | 'grayscale' | 'subpixel-antialiased';
   whiteSpace?: ICSSRule | string;
   widows?: ICSSRule | number;
-  width?: ICSSRule | string;
+  width?: ICSSRule | ICSSPixelUnitRule;
   wordBreak?: ICSSRule | string;
   wordSpacing?: ICSSRule | string;
   wordWrap?: ICSSRule | string;
@@ -278,10 +279,10 @@ interface IStyleSheetConfig {
 export function keyframes(timeline: { [key: string]: {} }): string;
 
 // @public
-export function mergeStyles(...args: (IStyle | IStyle[])[]): string;
+export function mergeStyles(...args: (IStyle | IStyle[] | false | null | undefined)[]): string;
 
 // @public
-export function mergeStyleSets < T extends object >(...cssSets: T[]): {[P in keyof T]?: string };
+export function mergeStyleSets < T extends object >(...cssSets: (T | false | null | undefined)[]): {[P in keyof T]?: string };
 
 // @public
 class Stylesheet {
diff --git a/packages/merge-styles/src/IRawStyle.ts b/packages/merge-styles/src/IRawStyle.ts
index 14cc09f493a18..a8fbd9aa62a3f 100644
--- a/packages/merge-styles/src/IRawStyle.ts
+++ b/packages/merge-styles/src/IRawStyle.ts
@@ -7,9 +7,20 @@ export type ICSSRule = 'initial' | 'inherit' | 'unset';
 export type ICSSPercentageRule = string;
 
 // See CSS 3 <length> type https://drafts.csswg.org/css-values-3/#lengths
-export type ICSSLengthRule = number | string;
-
-export type IFontWeight = ICSSRule | 'normal' | 'bold' | 'bolder' | 'lighter' | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900;
+export type ICSSPixelUnitRule = string | number;
+
+export type IFontWeight =
+  ICSSRule |
+  'normal' | 'bold' | 'bolder' | 'lighter' |
+  '100' | 100 |
+  '200' | 200 |
+  '300' | 300 |
+  '400' | 400 |
+  '500' | 500 |
+  '600' | 600 |
+  '700' | 700 |
+  '800' | 800 |
+  '900' | 900;
 
 /**
  * The base font style.
@@ -53,7 +64,7 @@ export interface IRawFontStyle {
   | 'xx-large'
   | 'larger'
   | 'smaller'
-  | ICSSLengthRule
+  | ICSSPixelUnitRule
   | ICSSPercentageRule;
 
   /**
@@ -150,7 +161,7 @@ export interface IRawStyle extends IRawFontStyle {
   /**
    * (Moz specific) font smoothing directive.
    */
-  MozFontSmoothing?: string;
+  MozOsxFontSmoothing?: 'none' | 'antialiased' | 'grayscale' | 'subpixel-antialiased';
 
   /**
    * (Webkit specific) font smoothing directive.
@@ -315,7 +326,7 @@ export interface IRawStyle extends IRawFontStyle {
    * Shorthand that sets the values of border-bottom-color,
    * border-bottom-style, and border-bottom-width.
    */
-  borderBottom?: ICSSRule | number | string;
+  borderBottom?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * Sets the color of the bottom border of an element.
@@ -342,7 +353,7 @@ export interface IRawStyle extends IRawFontStyle {
    * border-width shorthand property which sets the values simultaneously for
    * border-top-width, border-right-width, border-bottom-width, and border-left-width.
    */
-  borderBottomWidth?: ICSSRule | string;
+  borderBottomWidth?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * Border-collapse can be used for collapsing the borders between table cells
@@ -384,7 +395,7 @@ export interface IRawStyle extends IRawFontStyle {
    * and central right edge. They represent inward distance from the top, right, bottom,
    * and left edges.
    */
-  borderImageWidth?: ICSSRule | string;
+  borderImageWidth?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * Shorthand property that defines the border-width, border-style and border-color of
@@ -392,7 +403,7 @@ export interface IRawStyle extends IRawFontStyle {
    * corresponding longhand properties to set specific individual properties of the left
    * border — border-left-width, border-left-style and border-left-color.
    */
-  borderLeft?: ICSSRule | number | string;
+  borderLeft?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * The CSS border-left-color property sets the color of an element's left border. This
@@ -415,12 +426,12 @@ export interface IRawStyle extends IRawFontStyle {
    * border-width shorthand property which sets the values simultaneously for
    * border-top-width, border-right-width, border-bottom-width, and border-left-width.
    */
-  borderLeftWidth?: ICSSRule | string;
+  borderLeftWidth?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * Defines how round the border's corners are.
    */
-  borderRadius?: ICSSRule | string;
+  borderRadius?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * Shorthand property that defines the border-width, border-style and border-color of
@@ -428,7 +439,7 @@ export interface IRawStyle extends IRawFontStyle {
    * corresponding longhand properties to set specific individual properties of the
    * right border — border-right-width, border-right-style and border-right-color.
    */
-  borderRight?: ICSSRule | number | string;
+  borderRight?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * Sets the color of an element's right border. This page explains the
@@ -450,7 +461,7 @@ export interface IRawStyle extends IRawFontStyle {
    * border-width shorthand property which sets the values simultaneously for
    * border-top-width, border-right-width, border-bottom-width, and border-left-width.
    */
-  borderRightWidth?: ICSSRule | string;
+  borderRightWidth?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * Specifies the distance between the borders of adjacent cells.
@@ -472,7 +483,7 @@ export interface IRawStyle extends IRawFontStyle {
    * corresponding longhand properties to set specific individual properties of the top
    * border — border-top-width, border-top-style and border-top-color.
    */
-  borderTop?: ICSSRule | number | string;
+  borderTop?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * Sets the color of an element's top border. This page explains the border-top-color
@@ -504,14 +515,14 @@ export interface IRawStyle extends IRawFontStyle {
    * border-width shorthand property which sets the values simultaneously for
    * border-top-width, border-right-width, border-bottom-width, and border-left-width.
    */
-  borderTopWidth?: ICSSRule | string;
+  borderTopWidth?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * Sets the width of an element's four borders. This property can have from one to
    * four values. This is a shorthand property for setting values simultaneously for
    * border-top-width, border-right-width, border-bottom-width, and border-left-width.
    */
-  borderWidth?: ICSSRule | number | string;
+  borderWidth?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * This property specifies how far an absolutely positioned box's bottom margin edge
@@ -520,7 +531,7 @@ export interface IRawStyle extends IRawFontStyle {
    * (i.e., the box is given a position in the normal flow, then offset from that
    * position according to these properties).
    */
-  bottom?: ICSSRule | number | string;
+  bottom?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * Breaks a box into fragments creating new borders, padding and repeating backgrounds
@@ -566,6 +577,12 @@ export interface IRawStyle extends IRawFontStyle {
    */
   clear?: ICSSRule | string;
 
+  /**
+   * This feature has been removed from the Web standards. Though some
+   * browsers may still support it, it is in the process of being dropped.
+   */
+  clip?: void;
+
   /**
    * Clipping crops an graphic, so that only a portion of the graphic is rendered, or
    * filled. This clip-rule property, when used with the clip-path property, defines
@@ -609,7 +626,7 @@ export interface IRawStyle extends IRawFontStyle {
   /**
    * Specifies the width of the rule between columns.
    */
-  columnRuleWidth?: ICSSRule | string;
+  columnRuleWidth?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * The column-span CSS property makes it possible for an element to span across all
@@ -621,7 +638,7 @@ export interface IRawStyle extends IRawFontStyle {
   /**
    * Specifies the width of columns in multi-column elements.
    */
-  columnWidth?: ICSSRule | string;
+  columnWidth?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * This property is a shorthand property for setting column-width and/or column-count.
@@ -720,7 +737,7 @@ export interface IRawStyle extends IRawFontStyle {
   /**
    * Shorthand for `flex-grow`, `flex-shrink`, and `flex-basis`.
    */
-  flex?: ICSSRule | number | string;
+  flex?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * The flex-basis CSS property describes the initial main size of the flex item before
@@ -864,7 +881,7 @@ export interface IRawStyle extends IRawFontStyle {
    * Sets the height of an element. The content area of the element height does not
    * include the padding, border, and margin of the element.
    */
-  height?: ICSSRule | string;
+  height?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * Specifies the minimum number of characters in a hyphenated word
@@ -902,7 +919,7 @@ export interface IRawStyle extends IRawFontStyle {
    * Sets the left position of an element relative to the nearest anscestor that is set
    * to position absolute, relative, or fixed.
    */
-  left?: ICSSRule | number | string;
+  left?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * The letter-spacing CSS property specifies the spacing behavior between text
@@ -914,7 +931,7 @@ export interface IRawStyle extends IRawFontStyle {
    * Specifies the height of an inline block level element.
    * See CSS 2.1 line-height property https://www.w3.org/TR/CSS21/visudet.html#propdef-line-height
    */
-  lineHeight?: ICSSRule | 'normal' | number | ICSSLengthRule | ICSSPercentageRule;
+  lineHeight?: ICSSRule | 'normal' | number | ICSSPixelUnitRule | ICSSPercentageRule;
 
   /**
    * Shorthand property that sets the list-style-type, list-style-position and
@@ -945,27 +962,27 @@ export interface IRawStyle extends IRawFontStyle {
    * at once. Its equivalent longhand properties are margin-top, margin-right,
    * margin-bottom and margin-left. Negative values are also allowed.
    */
-  margin?: ICSSRule | number | string;
+  margin?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * margin-bottom sets the bottom margin of an element.
    */
-  marginBottom?: ICSSRule | number | string;
+  marginBottom?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * margin-left sets the left margin of an element.
    */
-  marginLeft?: ICSSRule | number | string;
+  marginLeft?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * margin-right sets the right margin of an element.
    */
-  marginRight?: ICSSRule | number | string;
+  marginRight?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * margin-top sets the top margin of an element.
    */
-  marginTop?: ICSSRule | number | string;
+  marginTop?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * The marquee-direction determines the initial direction in which the marquee content moves.
@@ -1021,7 +1038,7 @@ export interface IRawStyle extends IRawFontStyle {
    * This property sets the width of the mask box image, similar to the CSS
    * border-image-width property.
    */
-  maskBorderWidth?: ICSSRule | string;
+  maskBorderWidth?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * Determines the mask painting area, which defines the area that is affected by
@@ -1056,26 +1073,26 @@ export interface IRawStyle extends IRawFontStyle {
    * Sets the maximum width for an element. It limits the width property to be larger
    * than the value specified in max-width.
    */
-  maxWidth?: ICSSRule | string;
+  maxWidth?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * Sets the minimum height for an element. It prevents the height of the element to
    * be smaller than the specified value. The value of min-height overrides both
    * max-height and height.
    */
-  minHeight?: ICSSRule | string;
+  minHeight?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * Sets the minimum width of an element. It limits the width property to be not
    * smaller than the value specified in min-width.
    */
-  minWidth?: ICSSRule | string;
+  minWidth?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * Specifies the transparency of an element.
    * See CSS 3 opacity property https://drafts.csswg.org/css-color-3/#opacity
    */
-  opacity?: ICSSRule | number;
+  opacity?: ICSSRule | number | string;
 
   /**
    * Specifies the order used to lay out flex items in their flex container.
@@ -1158,7 +1175,7 @@ export interface IRawStyle extends IRawFontStyle {
    * setting each side separately (padding-top, padding-right, padding-bottom,
    * padding-left).
    */
-  padding?: ICSSRule | number | string;
+  padding?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * The padding-bottom CSS property of an element sets the padding space required on
@@ -1166,7 +1183,7 @@ export interface IRawStyle extends IRawFontStyle {
    * element and its border. Contrary to margin-bottom values, negative values of
    * padding-bottom are invalid.
    */
-  paddingBottom?: ICSSRule | number | string;
+  paddingBottom?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * The padding-left CSS property of an element sets the padding space required on the
@@ -1174,7 +1191,7 @@ export interface IRawStyle extends IRawFontStyle {
    * element and its border. Contrary to margin-left values, negative values of
    * padding-left are invalid.
    */
-  paddingLeft?: ICSSRule | number | string;
+  paddingLeft?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * The padding-right CSS property of an element sets the padding space required on the
@@ -1182,7 +1199,7 @@ export interface IRawStyle extends IRawFontStyle {
    * element and its border. Contrary to margin-right values, negative values of
    * padding-right are invalid.
    */
-  paddingRight?: ICSSRule | number | string;
+  paddingRight?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * The padding-top CSS property of an element sets the padding space required on the
@@ -1190,7 +1207,7 @@ export interface IRawStyle extends IRawFontStyle {
    * and its border. Contrary to margin-top values, negative values of padding-top are
    * invalid.
    */
-  paddingTop?: ICSSRule | number | string;
+  paddingTop?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * The page-break-after property is supported in all major browsers. With CSS3,
@@ -1308,7 +1325,7 @@ export interface IRawStyle extends IRawFontStyle {
    * Specifies the position an element in relation to the right side of the containing
    * element.
    */
-  right?: ICSSRule | number | string;
+  right?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * Defines the alpha channel threshold used to extract a shape from an image. Can be
@@ -1365,7 +1382,7 @@ export interface IRawStyle extends IRawFontStyle {
    * SVG: Specifies the width of the outline on the current object.
    * See SVG 1.1 https://www.w3.org/TR/SVG/painting.html#StrokeWidthProperty
    */
-  strokeWidth?: ICSSRule | ICSSPercentageRule | ICSSLengthRule;
+  strokeWidth?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * The tab-size CSS property is used to customise the width of a tab (U+0009) character.
@@ -1491,7 +1508,7 @@ export interface IRawStyle extends IRawFontStyle {
   /**
    * Specifies the line width for the overline text decoration.
    */
-  textOverlineWidth?: ICSSRule | string;
+  textOverlineWidth?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * The text-rendering CSS property provides information to the browser about how to
@@ -1533,7 +1550,7 @@ export interface IRawStyle extends IRawFontStyle {
    * is given a position in the normal flow, then offset from that position according to
    * these properties).
    */
-  top?: ICSSRule | number | string;
+  top?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * Determines whether touch input may trigger default behavior supplied by the user
@@ -1708,7 +1725,7 @@ export interface IRawStyle extends IRawFontStyle {
    * Specifies the width of the content area of an element. The content area of the element
    * width does not include the padding, border, and margin of the element.
    */
-  width?: ICSSRule | string;
+  width?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * The word-break property is often used when there is long generated content that is
diff --git a/packages/merge-styles/src/Stylesheet.ts b/packages/merge-styles/src/Stylesheet.ts
index 257954b4f157a..5b26b175bffa0 100644
--- a/packages/merge-styles/src/Stylesheet.ts
+++ b/packages/merge-styles/src/Stylesheet.ts
@@ -134,7 +134,7 @@ export class Stylesheet {
 
     switch (injectionMode) {
       case InjectionMode.insertNode:
-        const { sheet } = element;
+        const { sheet } = element!;
 
         try {
           // tslint:disable-next-line:no-any
@@ -175,8 +175,8 @@ export class Stylesheet {
     }
   }
 
-  private _getElement(): HTMLStyleElement {
-    if (!this._styleElement) {
+  private _getElement(): HTMLStyleElement | undefined {
+    if (!this._styleElement && typeof document !== 'undefined') {
       this._styleElement = document.createElement('style');
       document.head.appendChild(this._styleElement);
     }
diff --git a/packages/merge-styles/src/concatStyleSets.ts b/packages/merge-styles/src/concatStyleSets.ts
index 7ceb0d2cdb222..6068fa557682e 100644
--- a/packages/merge-styles/src/concatStyleSets.ts
+++ b/packages/merge-styles/src/concatStyleSets.ts
@@ -1,10 +1,10 @@
-import { IStyleSet } from './IStyleSet';
-
 /**
  * Combine a set of styles together (but does not register css classes.)
  * @public
  */
-export function concatStyleSets<T extends object>(...args: (T | false | null | undefined)[]): T {
+export function concatStyleSets<T extends object>(
+  ...args: (T | false | null | undefined)[]
+): T {
   // tslint:disable-next-line:no-any
   const mergedSet: T = {} as any;
 
diff --git a/packages/merge-styles/src/mergeStyleSets.ts b/packages/merge-styles/src/mergeStyleSets.ts
index 5ad495f072c04..7bbf43d330704 100644
--- a/packages/merge-styles/src/mergeStyleSets.ts
+++ b/packages/merge-styles/src/mergeStyleSets.ts
@@ -9,17 +9,19 @@ import { IStyle } from './IStyle';
  * @public
  */
 export function mergeStyleSets<T extends object>(
-  ...cssSets: T[]
+  ...cssSets: (T | false | null | undefined)[]
 ): {[P in keyof T]?: string } {
   const classNameSet: {[P in keyof T]?: string } = {};
   let cssSet = cssSets[0];
 
-  if (cssSets.length > 1) {
-    cssSet = concatStyleSets(...cssSets);
-  }
-  for (const prop in cssSet) {
-    if (cssSet.hasOwnProperty(prop)) {
-      classNameSet[prop] = mergeStyles(cssSet[prop] as IStyle);
+  if (cssSet) {
+    if (cssSets.length > 1) {
+      cssSet = concatStyleSets(...cssSets);
+    }
+    for (const prop in cssSet) {
+      if (cssSet.hasOwnProperty(prop)) {
+        classNameSet[prop] = mergeStyles(cssSet[prop] as IStyle);
+      }
     }
   }
 
diff --git a/packages/merge-styles/src/mergeStyles.ts b/packages/merge-styles/src/mergeStyles.ts
index 1f9beef45bca3..09b82fdb7c0c2 100644
--- a/packages/merge-styles/src/mergeStyles.ts
+++ b/packages/merge-styles/src/mergeStyles.ts
@@ -7,7 +7,9 @@ import { Stylesheet } from './Stylesheet';
  *
  * @public
  */
-export function mergeStyles(...args: (IStyle | IStyle[])[]): string {
+export function mergeStyles(
+  ...args: (IStyle | IStyle[] | false | null | undefined)[]
+): string {
   const classes: string[] = [];
   const objects: {}[] = [];
   const stylesheet = Stylesheet.getInstance();
diff --git a/packages/merge-styles/src/server.test.ts b/packages/merge-styles/src/server.test.ts
index cd5ee2480cdf4..68a9ec7c343ba 100644
--- a/packages/merge-styles/src/server.test.ts
+++ b/packages/merge-styles/src/server.test.ts
@@ -1,8 +1,4 @@
 import { renderStatic } from './server';
-import {
-  Stylesheet,
-  InjectionMode
-} from './Stylesheet';
 import {
   mergeStyleSets
 } from './mergeStyleSets';
diff --git a/packages/merge-styles/src/styleToClassName.ts b/packages/merge-styles/src/styleToClassName.ts
index 77c72f2d29464..5f298bb37e8a3 100644
--- a/packages/merge-styles/src/styleToClassName.ts
+++ b/packages/merge-styles/src/styleToClassName.ts
@@ -2,7 +2,6 @@ import { rtlifyRules } from './transforms/rtlifyRules';
 import { provideUnits } from './transforms/provideUnits';
 import { prefixRules } from './transforms/prefixRules';
 import { kebabRules } from './transforms/kebabRules';
-import { getVendorSettings } from './getVendorSettings';
 import { Stylesheet } from './Stylesheet';
 import { IStyle, IExtendedRawStyle } from './IStyle';
 
diff --git a/packages/merge-styles/src/transforms/provideUnits.test.ts b/packages/merge-styles/src/transforms/provideUnits.test.ts
index 3e5d641b632b8..0ef378d822e20 100644
--- a/packages/merge-styles/src/transforms/provideUnits.test.ts
+++ b/packages/merge-styles/src/transforms/provideUnits.test.ts
@@ -4,7 +4,7 @@ import { expect } from 'chai';
 
 describe('provideUnits', () => {
   it('can provide units', () => {
-    const propertiesToTest = [
+    [
       'left',
       'right',
       'top',
@@ -20,7 +20,7 @@ describe('provideUnits', () => {
   });
 
   it('can provide units for directional props', () => {
-    const propertiesToTest = [
+    [
       'padding',
       'margin',
       'border'
diff --git a/packages/merge-styles/src/transforms/rtlifyRules.ts b/packages/merge-styles/src/transforms/rtlifyRules.ts
index 46a3bca8c3359..59f4ac20e8557 100644
--- a/packages/merge-styles/src/transforms/rtlifyRules.ts
+++ b/packages/merge-styles/src/transforms/rtlifyRules.ts
@@ -19,7 +19,7 @@ export function setRTL(isRTL: boolean): void {
 export function getRTL(): boolean {
   if (_rtl === undefined) {
     _rtl = (
-      typeof document !== undefined &&
+      typeof document !== 'undefined' &&
       !!document.documentElement &&
       document.documentElement.getAttribute('dir') === 'rtl'
     );

From a24282ac27110ba738d2509dc3a73305b66c3611 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 21 Aug 2017 10:19:29 +0000
Subject: [PATCH 0450/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 22 +++++++++++++
 apps/fabric-website/CHANGELOG.md              |  9 +++++-
 apps/fabric-website/package.json              |  6 ++--
 .../merge-styles_2017-08-16-20-51.json        | 11 -------
 .../merge-styles_2017-08-16-20-51.json        | 11 -------
 .../merge-styles_2017-08-16-20-51.json        | 11 -------
 .../merge-styles_2017-08-16-20-51.json        | 11 -------
 .../merge-styles_2017-08-16-20-51.json        | 11 -------
 ...eader-background-fix_2017-08-18-20-44.json | 11 -------
 ...icker-uia-node-fixes_2017-08-18-22-51.json | 11 -------
 packages/example-app-base/CHANGELOG.json      | 19 +++++++++++
 packages/example-app-base/CHANGELOG.md        |  9 +++++-
 packages/example-app-base/package.json        |  4 +--
 packages/experiments/CHANGELOG.json           | 22 +++++++++++++
 packages/experiments/CHANGELOG.md             |  9 +++++-
 packages/experiments/package.json             |  6 ++--
 .../office-ui-fabric-react/CHANGELOG.json     | 32 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 11 ++++++-
 packages/office-ui-fabric-react/package.json  |  6 ++--
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 ++++++++
 packages/utilities/CHANGELOG.md               |  9 +++++-
 packages/utilities/package.json               |  2 +-
 23 files changed, 164 insertions(+), 95 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/merge-styles_2017-08-16-20-51.json
 delete mode 100644 common/changes/@uifabric/experiments/merge-styles_2017-08-16-20-51.json
 delete mode 100644 common/changes/@uifabric/fabric-website/merge-styles_2017-08-16-20-51.json
 delete mode 100644 common/changes/@uifabric/utilities/merge-styles_2017-08-16-20-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/merge-styles_2017-08-16-20-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-edwliu-detailsheader-background-fix_2017-08-18-20-44.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-picker-uia-node-fixes_2017-08-18-22-51.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index dfa94d1aa6624..33e818948f1a1 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.7.2",
+      "tag": "@uifabric/fabric-website_v4.7.2",
+      "date": "Mon, 21 Aug 2017 10:19:29 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "7141e63018997876d0c4f9d8dc6e420eb5f52db9",
+            "comment": "Updating project dependencies."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=4.2.0 <5.0.0` to `>=4.2.1 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.35.0 <5.0.0` to `>=4.35.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.7.1",
       "tag": "@uifabric/fabric-website_v4.7.1",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index d09273799fe84..5075728050702 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Fri, 18 Aug 2017 16:32:33 GMT and should not be manually modified.
+This log was last generated on Mon, 21 Aug 2017 10:19:29 GMT and should not be manually modified.
+
+## 4.7.2
+Mon, 21 Aug 2017 10:19:29 GMT
+
+### Patches
+
+- Updating project dependencies.
 
 ## 4.7.1
 Fri, 18 Aug 2017 16:32:33 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 75f79f42c6c23..694c0a2c0c738 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.7.1",
+  "version": "4.7.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -67,12 +67,12 @@
     "webpack-split-by-path": "2.0.0"
   },
   "dependencies": {
-    "@uifabric/example-app-base": ">=4.2.0 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.1 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.35.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.35.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/merge-styles_2017-08-16-20-51.json b/common/changes/@uifabric/example-app-base/merge-styles_2017-08-16-20-51.json
deleted file mode 100644
index 33d339800cbda..0000000000000
--- a/common/changes/@uifabric/example-app-base/merge-styles_2017-08-16-20-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Updating project dependencies.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/merge-styles_2017-08-16-20-51.json b/common/changes/@uifabric/experiments/merge-styles_2017-08-16-20-51.json
deleted file mode 100644
index 7f1199310ce0d..0000000000000
--- a/common/changes/@uifabric/experiments/merge-styles_2017-08-16-20-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Updating project dependencies.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/merge-styles_2017-08-16-20-51.json b/common/changes/@uifabric/fabric-website/merge-styles_2017-08-16-20-51.json
deleted file mode 100644
index e1ec4b9d0de7b..0000000000000
--- a/common/changes/@uifabric/fabric-website/merge-styles_2017-08-16-20-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Updating project dependencies.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/merge-styles_2017-08-16-20-51.json b/common/changes/@uifabric/utilities/merge-styles_2017-08-16-20-51.json
deleted file mode 100644
index c3bd0f31ee091..0000000000000
--- a/common/changes/@uifabric/utilities/merge-styles_2017-08-16-20-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Minor tweaks to utilities to reduce the graph edges.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/merge-styles_2017-08-16-20-51.json b/common/changes/office-ui-fabric-react/merge-styles_2017-08-16-20-51.json
deleted file mode 100644
index 43d1c47765ec0..0000000000000
--- a/common/changes/office-ui-fabric-react/merge-styles_2017-08-16-20-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Updating project dependencies.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-edwliu-detailsheader-background-fix_2017-08-18-20-44.json b/common/changes/office-ui-fabric-react/v-edwliu-detailsheader-background-fix_2017-08-18-20-44.json
deleted file mode 100644
index 592c431bdf307..0000000000000
--- a/common/changes/office-ui-fabric-react/v-edwliu-detailsheader-background-fix_2017-08-18-20-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: Move background color from .cell to .root for DetailsHeader",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-edwliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-picker-uia-node-fixes_2017-08-18-22-51.json b/common/changes/office-ui-fabric-react/v-krbrow-picker-uia-node-fixes_2017-08-18-22-51.json
deleted file mode 100644
index 6e66650c57f38..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-picker-uia-node-fixes_2017-08-18-22-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "PeoplePicker: Fixing A11yMAS accessibility issue in selected items.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 195236fc07ddb..bd1700b118177 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "4.2.1",
+      "tag": "@uifabric/example-app-base_v4.2.1",
+      "date": "Mon, 21 Aug 2017 10:19:28 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "7141e63018997876d0c4f9d8dc6e420eb5f52db9",
+            "comment": "Updating project dependencies."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.9.0 <5.0.0` to `>=4.9.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.2.0",
       "tag": "@uifabric/example-app-base_v4.2.0",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index 8849d612e7c29..f4c2ebcc46e64 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Thu, 03 Aug 2017 10:13:03 GMT and should not be manually modified.
+This log was last generated on Mon, 21 Aug 2017 10:19:28 GMT and should not be manually modified.
+
+## 4.2.1
+Mon, 21 Aug 2017 10:19:28 GMT
+
+### Patches
+
+- Updating project dependencies.
 
 ## 4.2.0
 Thu, 03 Aug 2017 10:13:03 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 5340d7d42f1a9..2dfffe9032408 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "4.2.0",
+  "version": "4.2.1",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -49,7 +49,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=0.20.0 <1.0.0",
-    "@uifabric/utilities": ">=4.9.0 <5.0.0",
+    "@uifabric/utilities": ">=4.9.1 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.4.0 <5.0.0",
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index f382e5bb7732e..2b703b5ac359f 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "0.1.1",
+      "tag": "@uifabric/experiments_v0.1.1",
+      "date": "Mon, 21 Aug 2017 10:19:29 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "7141e63018997876d0c4f9d8dc6e420eb5f52db9",
+            "comment": "Updating project dependencies."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `4.35.0` to `4.35.1`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=4.2.0 <5.0.0` to `>=4.2.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.1.0",
       "tag": "@uifabric/experiments_v0.1.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 2edeb5b582935..eb67671151812 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Fri, 18 Aug 2017 16:32:33 GMT and should not be manually modified.
+This log was last generated on Mon, 21 Aug 2017 10:19:29 GMT and should not be manually modified.
+
+## 0.1.1
+Mon, 21 Aug 2017 10:19:29 GMT
+
+### Patches
+
+- Updating project dependencies.
 
 ## 0.1.0
 Fri, 18 Aug 2017 16:32:33 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 0b0d887b9bf47..35563188280f8 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=4.2.0 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.1 <5.0.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -64,7 +64,7 @@
     "webpack-notifier": "^1.5.0"
   },
   "dependencies": {
-    "office-ui-fabric-react": "4.35.0"
+    "office-ui-fabric-react": "4.35.1"
   },
   "peerDependencies": {
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 7ada6ce05fd2f..911c27c319f41 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,38 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.35.1",
+      "tag": "office-ui-fabric-react_v4.35.1",
+      "date": "Mon, 21 Aug 2017 10:19:29 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "7141e63018997876d0c4f9d8dc6e420eb5f52db9",
+            "comment": "Updating project dependencies."
+          },
+          {
+            "author": "Eddie Liu <leddie24@gmail.com>",
+            "commit": "0f3606270be2ca8b30a4ad753d678e1071a66c70",
+            "comment": "DetailsList: Move background color from .cell to .root for DetailsHeader"
+          },
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "86e32f8ba71d8697da0c5f7f472619784b51a0bf",
+            "comment": "PeoplePicker: Fixing A11yMAS accessibility issue in selected items."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.9.0 <5.0.0` to `>=4.9.1 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=4.2.0 <5.0.0` to `>=4.2.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.35.0",
       "tag": "office-ui-fabric-react_v4.35.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 68f8e8c8eb059..2d027bbf1e723 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,15 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 18 Aug 2017 16:32:33 GMT and should not be manually modified.
+This log was last generated on Mon, 21 Aug 2017 10:19:29 GMT and should not be manually modified.
+
+## 4.35.1
+Mon, 21 Aug 2017 10:19:29 GMT
+
+### Patches
+
+- Updating project dependencies.
+- DetailsList: Move background color from .cell to .root for DetailsHeader
+- PeoplePicker: Fixing A11yMAS accessibility issue in selected items.
 
 ## 4.35.0
 Fri, 18 Aug 2017 16:32:33 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 05f629befec4f..723459d26b349 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.35.0",
+  "version": "4.35.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=4.2.0 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.1 <5.0.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -71,7 +71,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
-    "@uifabric/utilities": ">=4.9.0 <5.0.0",
+    "@uifabric/utilities": ">=4.9.1 <5.0.0",
     "@uifabric/styling": ">=0.20.0 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
diff --git a/packages/styling/package.json b/packages/styling/package.json
index f396f7593d226..b708c2b2cf490 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
-    "@uifabric/utilities": ">=4.9.0 <5.0.0",
+    "@uifabric/utilities": ">=4.9.1 <5.0.0",
     "tslib": "^1.6.0",
     "rtl-css-js": "^1.1.1",
     "glamor": "^2.20.24"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 23c892333cb32..d9500456d8375 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.9.1",
+      "tag": "@uifabric/utilities_v4.9.1",
+      "date": "Mon, 21 Aug 2017 10:19:29 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "7141e63018997876d0c4f9d8dc6e420eb5f52db9",
+            "comment": "Minor tweaks to utilities to reduce the graph edges."
+          }
+        ]
+      }
+    },
     {
       "version": "4.9.0",
       "tag": "@uifabric/utilities_v4.9.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index d91d70df2d447..059bbbdc885c2 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Thu, 03 Aug 2017 10:13:03 GMT and should not be manually modified.
+This log was last generated on Mon, 21 Aug 2017 10:19:29 GMT and should not be manually modified.
+
+## 4.9.1
+Mon, 21 Aug 2017 10:19:29 GMT
+
+### Patches
+
+- Minor tweaks to utilities to reduce the graph edges.
 
 ## 4.9.0
 Thu, 03 Aug 2017 10:13:03 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 67e0c849db82b..c5188cc54fa55 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.9.0",
+  "version": "4.9.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From c30c763aad57be0d86bf495d56e751b7cf77de23 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Mon, 21 Aug 2017 13:14:58 -0700
Subject: [PATCH 0451/1641] Emlynam/animation fix (#2564)

* updated color themes

* Fixed website animation examples
---
 apps/fabric-website/src/data/animations.json  | 54 +++++++++----------
 .../fabric-website/src/data/colors-theme.json |  6 +--
 .../Styles/AnimationsPage/AnimationsPage.scss | 28 +++++-----
 3 files changed, 44 insertions(+), 44 deletions(-)

diff --git a/apps/fabric-website/src/data/animations.json b/apps/fabric-website/src/data/animations.json
index 8c73c3548cee3..ce5f71d4e1e99 100644
--- a/apps/fabric-website/src/data/animations.json
+++ b/apps/fabric-website/src/data/animations.json
@@ -12,7 +12,7 @@
         "value": "Slide right 10px and fade in"
       },
       {
-        "value": "slideRightIn10"
+        "value": "ms-slideRightIn10"
       },
       {
         "value": "cubic-bezier(0.1, 0.9, 0.2, 1)"
@@ -26,7 +26,7 @@
         "value": "Slide right 20px and fade in"
       },
       {
-        "value": "slideRightIn20"
+        "value": "ms-slideRightIn20"
       },
       {
         "value": "cubic-bezier(0.1, 0.9, 0.2, 1)"
@@ -40,7 +40,7 @@
         "value": "Slide right 40px and fade in"
       },
       {
-        "value": "slideRightIn40"
+        "value": "ms-slideRightIn40"
       },
       {
         "value": "cubic-bezier(0.1, 0.9, 0.2, 1)"
@@ -54,7 +54,7 @@
         "value": "Slide left 10px and fade in"
       },
       {
-        "value": "slideLeftIn10"
+        "value": "ms-slideLeftIn10"
       },
       {
         "value": "cubic-bezier(0.1, 0.9, 0.2, 1)"
@@ -68,7 +68,7 @@
         "value": "Slide left 20px and fade in"
       },
       {
-        "value": "slideLeftIn20"
+        "value": "ms-slideLeftIn20"
       },
       {
         "value": "cubic-bezier(0.1, 0.9, 0.2, 1)"
@@ -82,7 +82,7 @@
         "value": "Slide right 40px and fade in"
       },
       {
-        "value": "slideLeftIn40"
+        "value": "ms-slideLeftIn40"
       },
       {
         "value": "cubic-bezier(0.1, 0.9, 0.2, 1)"
@@ -96,7 +96,7 @@
         "value": "Slide up 20px and fade in"
       },
       {
-        "value": "slideUpIn20"
+        "value": "ms-slideUpIn20"
       },
       {
         "value": "cubic-bezier(0.1, 0.9, 0.2, 1)"
@@ -110,7 +110,7 @@
         "value": "Slide right 10 and fade in"
       },
       {
-        "value": "slideUpIn10"
+        "value": "ms-slideUpIn10"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -124,7 +124,7 @@
         "value": "Slide down 20px and fade in"
       },
       {
-        "value": "slideDownIn20"
+        "value": "ms-slideDownIn20"
       },
       {
         "value": "cubic-bezier(0.1, 0.9, 0.2, 1)"
@@ -138,7 +138,7 @@
         "value": "Slide down 10px and fade in"
       },
       {
-        "value": "slideDownIn10"
+        "value": "ms-slideDownIn10"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -152,7 +152,7 @@
         "value": "Slide right 40px and fade out"
       },
       {
-        "value": "slideRightOut40"
+        "value": "ms-slideRightOut40"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -166,7 +166,7 @@
         "value": "Slide left 40px and fade out"
       },
       {
-        "value": "slideLeftOut40"
+        "value": "ms-slideLeftOut40"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -180,7 +180,7 @@
         "value": "Slide up 20px and fade out"
       },
       {
-        "value": "slideUpOut10"
+        "value": "ms-slideUpOut10"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -194,7 +194,7 @@
         "value": "Slide up 10px and fade out"
       },
       {
-        "value": "slideUpOut10"
+        "value": "ms-slideUpOut10"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -208,7 +208,7 @@
         "value": "Slide down 20px and fade out"
       },
       {
-        "value": "slideDownOut20"
+        "value": "ms-slideDownOut20"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -222,7 +222,7 @@
         "value": "Slide down 10px and fade out"
       },
       {
-        "value": "slideDownOut10"
+        "value": "ms-slideDownOut10"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -236,7 +236,7 @@
         "value": "Scale up to 100% and fade in"
       },
       {
-        "value": "scaleUpIn100"
+        "value": "ms-scaleUpIn100"
       },
       {
         "value": "cubic-bezier(0.1, 0.9, 0.2, 1)"
@@ -250,7 +250,7 @@
         "value": "Slide down to 100% and fade in"
       },
       {
-        "value": "scaleDownIn100"
+        "value": "ms-scaleDownIn100"
       },
       {
         "value": "cubic-bezier(0.1, 0.9, 0.2, 1)"
@@ -264,7 +264,7 @@
         "value": "Scale up to 103% and fade out"
       },
       {
-        "value": "scaleUpOut103"
+        "value": "ms-scaleUpOut103"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -278,7 +278,7 @@
         "value": "Slide right 98% and fade out"
       },
       {
-        "value": "scaleDownOut98"
+        "value": "ms-scaleDownOut98"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -292,7 +292,7 @@
         "value": "Fade in"
       },
       {
-        "value": "fadeIn100"
+        "value": "ms-fadeIn100"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -306,7 +306,7 @@
         "value": "Fade in"
       },
       {
-        "value": "fadeIn200"
+        "value": "ms-fadeIn200"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -320,7 +320,7 @@
         "value": "Fade in"
       },
       {
-        "value": "fadeIn400"
+        "value": "ms-fadeIn400"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -334,7 +334,7 @@
         "value": "Fade in"
       },
       {
-        "value": "fadeIn500"
+        "value": "ms-fadeIn500"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -348,7 +348,7 @@
         "value": "Fade out"
       },
       {
-        "value": "fadeOut100"
+        "value": "ms-fadeOut100"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -362,7 +362,7 @@
         "value": "Fade out"
       },
       {
-        "value": "fadeOut200"
+        "value": "ms-fadeOut200"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
@@ -376,7 +376,7 @@
         "value": "Fade out"
       },
       {
-        "value": "fadeOut400"
+        "value": "ms-fadeOut400"
       },
       {
         "value": "cubic-bezier(0.1, 0.25, 0.75, 0.9)"
diff --git a/apps/fabric-website/src/data/colors-theme.json b/apps/fabric-website/src/data/colors-theme.json
index ea09b07632c58..2002f86d6e9e0 100644
--- a/apps/fabric-website/src/data/colors-theme.json
+++ b/apps/fabric-website/src/data/colors-theme.json
@@ -21,17 +21,17 @@
   },
   {
     "name": "themeSecondary",
-    "value": "#2488d8",
+    "value": "#2b88d8",
     "labelColorClass": "ms-fontColor-white"
   },
   {
     "name": "themeTertiary",
-    "value": "#69afe5",
+    "value": "#71afe5",
     "labelColorClass": "ms-fontColor-white"
   },
   {
     "name": "themeLight",
-    "value": "#b3d6f2",
+    "value": "#c730f4",
     "labelColorClass": "ms-fontColor-black"
   },
   {
diff --git a/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.scss b/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.scss
index 70b16cc7eb804..0dbb27ab6523c 100644
--- a/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.scss
+++ b/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.scss
@@ -44,9 +44,9 @@
   }
 
   .docs_animationsTable_body { // override for demo purposes
-    .slideRightOut40, .slideLeftOut40, .slideUpOut20, .slideUpOut10,
-    .slideDownOut20, .slideDownOut10, .scaleUpOut103, .scaleDownOut98,
-    .fadeOut100, .fadeOut200, .fadeOut400, .fadeOut500 {
+    .ms-slideRightOut40, .ms-slideLeftOut40, .ms-slideUpOut20, .ms-slideUpOut10,
+    .ms-slideDownOut20, .ms-slideDownOut10, .ms-scaleUpOut103, .ms-scaleDownOut98,
+    .ms-fadeOut100, .ms-fadeOut200, .ms-fadeOut400, .ms-fadeOut500 {
       -webkit-animation-play-state: paused;
       animation-play-state: paused;
 
@@ -57,24 +57,24 @@
       }
     }
 
-    .slideRightOut40, .slideLeftOut40, .slideLeftIn10, .slideLeftIn20, .slideLeftIn40 {
+    .ms-slideRightOut40, .ms-slideLeftOut40, .ms-slideLeftIn10, .ms-slideLeftIn20, .ms-slideLeftIn40 {
         .animationExample_panel {
             right: 0;
         }
     }
-    .slideLeftOut40 {
+    .ms-slideLeftOut40 {
         .animationExample_panel {
             left: 0;
         }
     }
-    .slideUpOut20, .slideUpOut10, .slideDownOut20, .slideDownOut10 {
+    .ms-slideUpOut20, .ms-slideUpOut10, .ms-slideDownOut20, .ms-slideDownOut10 {
         .animationExample_panel {
             width: 100%;
             height: 30px;
             top: 0;
         }
     }
-    .slideUpOut10, .slideDownOut10 {
+    .ms-slideUpOut10, .ms-slideDownOut10 {
         .animationExample_panel {
             width: 60px;
             top: 10px;
@@ -82,15 +82,15 @@
             height: 20px;
         }
     }
-    .slideDownOut10, .slideDownOut20 {
+    .ms-slideDownOut10, .ms-slideDownOut20 {
         .animationExample_panel {
             top: 60px;
         }
     }
-    .scaleUpIn100,
-    .scaleDownIn100,
-    .scaleUpOut103,
-    .scaleDownOut98 {
+    .ms-scaleUpIn100,
+    .ms-scaleDownIn100,
+    .ms-scaleUpOut103,
+    .ms-scaleDownOut98 {
         overflow: visible;
         .animationExample_panel {
             height: 100%;
@@ -174,7 +174,7 @@
         }
     }
 
-    .fadeIn100, .fadeIn200, .fadeIn400, .fadeIn500 {
+    .ms-fadeIn100, .ms-fadeIn200, .ms-fadeIn400, .ms-fadeIn500 {
         .animationExample_panel {
             height: 100%;
             width: 100%;
@@ -182,7 +182,7 @@
         }
     }
 
-    .fadeOut100, .fadeOut200, .fadeOut400, .fadeOut500 {
+    .ms-fadeOut100, .ms-fadeOut200, .ms-fadeOut400, .ms-fadeOut500 {
         .animationExample_panel {
             height: 100%;
             width: 100%;

From 1eef5ec0708f79a87492e4d4fe2f3cf81ed77468 Mon Sep 17 00:00:00 2001
From: Melina Sparks <30634057+melvsparks@users.noreply.github.com>
Date: Mon, 21 Aug 2017 21:12:38 -0700
Subject: [PATCH 0452/1641] Bug fix: Dropdown - SelectedKey selects dropdown
 option with a different key (#2552)

* Add parenthesis, so the logic executed in the correct order
* Add the change file
---
 ...-dropdownGetSelectedIndexFix_2017-08-22-03-58.json | 11 +++++++++++
 .../src/components/Dropdown/Dropdown.tsx              |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/melvsparks-dropdownGetSelectedIndexFix_2017-08-22-03-58.json

diff --git a/common/changes/office-ui-fabric-react/melvsparks-dropdownGetSelectedIndexFix_2017-08-22-03-58.json b/common/changes/office-ui-fabric-react/melvsparks-dropdownGetSelectedIndexFix_2017-08-22-03-58.json
new file mode 100644
index 0000000000000..18a467053f936
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/melvsparks-dropdownGetSelectedIndexFix_2017-08-22-03-58.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: Fixed bug where selectedKey selects dropdown option with a different key",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "melspa@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index abf0e9028df84..836737d1cf21d 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -542,7 +542,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
 
   private _getSelectedIndex(options: IDropdownOption[], selectedKey: string | number): number {
     // tslint:disable-next-line:triple-equals
-    return findIndex(options, (option => (option.isSelected || option.selected || (selectedKey != null) && option.key === selectedKey)));
+    return findIndex(options, (option => ((option.isSelected || option.selected || (selectedKey != null)) && option.key === selectedKey)));
   }
 
   @autobind

From 96fb2d9868e722791e56b7840eb8c8e6b42d51f2 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 22 Aug 2017 10:09:55 +0000
Subject: [PATCH 0453/1641] Applying package updates.

---
 apps/fabric-website/package.json                   |  2 +-
 apps/ssr-tests/package.json                        |  2 +-
 apps/test-bundle-button/package.json               |  2 +-
 apps/todo-app/package.json                         |  2 +-
 ...opdownGetSelectedIndexFix_2017-08-22-03-58.json | 11 -----------
 packages/experiments/CHANGELOG.json                | 12 ++++++++++++
 packages/experiments/CHANGELOG.md                  |  7 ++++++-
 packages/experiments/package.json                  |  4 ++--
 packages/office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md       |  9 ++++++++-
 packages/office-ui-fabric-react/package.json       |  2 +-
 11 files changed, 47 insertions(+), 20 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/melvsparks-dropdownGetSelectedIndexFix_2017-08-22-03-58.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 694c0a2c0c738..0eb78ee9dbbce 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -72,7 +72,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.35.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.35.2 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index e248d1952a267..f2a3e1de550fc 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.35.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.35.2 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 1d37efd338ce1..50846c442ad03 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -35,7 +35,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.35.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.35.2 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 80a8d86afa2f7..7e45419bfc2d9 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.35.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.35.2 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/melvsparks-dropdownGetSelectedIndexFix_2017-08-22-03-58.json b/common/changes/office-ui-fabric-react/melvsparks-dropdownGetSelectedIndexFix_2017-08-22-03-58.json
deleted file mode 100644
index 18a467053f936..0000000000000
--- a/common/changes/office-ui-fabric-react/melvsparks-dropdownGetSelectedIndexFix_2017-08-22-03-58.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: Fixed bug where selectedKey selects dropdown option with a different key",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "melspa@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 2b703b5ac359f..60a2d6e1b347f 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,18 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "0.1.2",
+      "tag": "@uifabric/experiments_v0.1.2",
+      "date": "Tue, 22 Aug 2017 10:09:55 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `4.35.1` to `4.35.2`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.1.1",
       "tag": "@uifabric/experiments_v0.1.1",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index eb67671151812..4ca011388d94c 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Mon, 21 Aug 2017 10:19:29 GMT and should not be manually modified.
+This log was last generated on Tue, 22 Aug 2017 10:09:55 GMT and should not be manually modified.
+
+## 0.1.2
+Tue, 22 Aug 2017 10:09:55 GMT
+
+*Changes not tracked*
 
 ## 0.1.1
 Mon, 21 Aug 2017 10:19:29 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 35563188280f8..4688eb4ac0198 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -64,7 +64,7 @@
     "webpack-notifier": "^1.5.0"
   },
   "dependencies": {
-    "office-ui-fabric-react": "4.35.1"
+    "office-ui-fabric-react": "4.35.2"
   },
   "peerDependencies": {
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 911c27c319f41..718d8dfe1c136 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.35.2",
+      "tag": "office-ui-fabric-react_v4.35.2",
+      "date": "Tue, 22 Aug 2017 10:09:55 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Melina Sparks <30634057+melvsparks@users.noreply.github.com>",
+            "commit": "1eef5ec0708f79a87492e4d4fe2f3cf81ed77468",
+            "comment": "Dropdown: Fixed bug where selectedKey selects dropdown option with a different key"
+          }
+        ]
+      }
+    },
     {
       "version": "4.35.1",
       "tag": "office-ui-fabric-react_v4.35.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 2d027bbf1e723..28e8434e601d0 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 21 Aug 2017 10:19:29 GMT and should not be manually modified.
+This log was last generated on Tue, 22 Aug 2017 10:09:55 GMT and should not be manually modified.
+
+## 4.35.2
+Tue, 22 Aug 2017 10:09:55 GMT
+
+### Patches
+
+- Dropdown: Fixed bug where selectedKey selects dropdown option with a different key
 
 ## 4.35.1
 Mon, 21 Aug 2017 10:19:29 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 723459d26b349..8b436c406c815 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.35.1",
+  "version": "4.35.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 48c4c90cfeb7831f75e7f39f4aeb07c2b1668555 Mon Sep 17 00:00:00 2001
From: Serkan Inci <serkan.inci@hotmail.com>
Date: Tue, 22 Aug 2017 11:51:52 -0400
Subject: [PATCH 0454/1641] Adding react import to SpinButton.Props (#2568)

* Adding react import to SpinButton.Props for classic module resolution.

* Adding config change.
---
 .../master_2017-08-21-21-28.json                      | 11 +++++++++++
 .../src/components/SpinButton/SpinButton.Props.ts     |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/master_2017-08-21-21-28.json

diff --git a/common/changes/office-ui-fabric-react/master_2017-08-21-21-28.json b/common/changes/office-ui-fabric-react/master_2017-08-21-21-28.json
new file mode 100644
index 0000000000000..6e1edeb1675b2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2017-08-21-21-28.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Adding react import to SpinButton.Props for classic module resolution.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "serkani@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts
index 9d3b651bac1bf..65de5f3f5e512 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts
@@ -1,3 +1,4 @@
+import * as React from 'react';
 import { Position } from '../../utilities/positioning';
 import { IIconProps } from '../../Icon';
 import { ITheme, IStyle } from '../../Styling';

From 44a7f2531984ac585ed8032ea04c9b43bd4525bd Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Tue, 22 Aug 2017 10:26:09 -0700
Subject: [PATCH 0455/1641] High Contrast and accessibility bugfixes (#2542)

* Fixing colorPicker inputs

* Normalizing TextField

* Preventing event bubbling on checkboxes

* Adding high-contrast borders to selected and current calendar dates

* Fixing details list selected high contrast state

* Changing primary button colors in HC mode

* changed colors of HC details list selected states

* rush change
---
 ...trast-accessibility-bugfixes_2017-08-17-23-04.json | 11 +++++++++++
 .../Button/PrimaryButton/PrimaryButton.styles.ts      |  8 +++++++-
 .../src/components/Calendar/Calendar.scss             |  8 ++++++++
 .../src/components/Check/Check.scss                   |  9 +++++++++
 .../src/components/Checkbox/Checkbox.tsx              |  1 +
 .../src/components/ColorPicker/ColorPicker.scss       |  3 ++-
 .../src/components/DetailsList/DetailsRow.scss        |  4 ++++
 .../src/components/TextField/TextField.scss           |  1 +
 8 files changed, 43 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-contrast-accessibility-bugfixes_2017-08-17-23-04.json

diff --git a/common/changes/office-ui-fabric-react/v-krbrow-contrast-accessibility-bugfixes_2017-08-17-23-04.json b/common/changes/office-ui-fabric-react/v-krbrow-contrast-accessibility-bugfixes_2017-08-17-23-04.json
new file mode 100644
index 0000000000000..20b807cbab19f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-contrast-accessibility-bugfixes_2017-08-17-23-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "High contrast, accesibility, and other bugfixes",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
index c53c3c2e2c1f9..f389a32d6de63 100644
--- a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
@@ -11,6 +11,8 @@ import {
   getStyles as getSplitButtonStyles
 } from '../SplitButton/SplitButton.styles';
 
+const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
+
 export const getStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: IButtonStyles
@@ -26,7 +28,11 @@ export const getStyles = memoizeFunction((
   let primaryButtonStyles: IButtonStyles = {
     root: {
       backgroundColor: palette.themePrimary,
-      color: palette.white
+      color: palette.white,
+      [MS_HIGHCONTRAST_ACTIVE]: {
+        borderColor: 'Highlight',
+        color: 'Highlight'
+      }
     },
 
     rootHovered: {
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
index 5e4d5a8982302..0458d5201e560 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
@@ -126,6 +126,10 @@ $Calendar-dayPicker-margin: 10px;
 .dayIsToday {
   position: relative;
   background-color: $ms-color-themeLight;
+
+  @media screen and (-ms-high-contrast: active) {
+    border: 1px solid WindowText;
+  }
 }
 
 
@@ -160,6 +164,10 @@ $Calendar-dayPicker-margin: 10px;
   cursor: pointer;
   color: $ms-color-white;
   background: $ms-color-themePrimary;
+
+  @media screen and (-ms-high-contrast: active) {
+    border: 1px solid Highlight;
+  }
 }
 
 
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.scss b/packages/office-ui-fabric-react/src/components/Check/Check.scss
index 8469f5272c24d..4a2aa12a47aea 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.scss
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.scss
@@ -43,6 +43,10 @@ $checkBoxHeight: 16px;
   top: 50%;
   left: 50%;
   color: $ms-color-neutralTertiaryAlt;
+
+  @media screen and (-ms-high-contrast: active) {
+    display: none;
+  }
 }
 
 .rootIsChecked .circle {
@@ -61,4 +65,9 @@ $checkBoxHeight: 16px;
 .rootIsChecked .check {
   color: $ms-color-white;
   font-weight: 900;
+
+  @media screen and (-ms-high-contrast: active) {
+    border-radius: 10px;
+    border: 1px solid WindowText;
+  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
index b2db9a3326295..80d340e559cf5 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
@@ -159,6 +159,7 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
     const { disabled, onChange } = this.props;
     const { isChecked } = this.state;
     ev.preventDefault();
+    ev.stopPropagation();
 
     if (!disabled) {
       if (onChange) {
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.scss b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.scss
index 27decc62b5065..e24b85cc1bb37 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.scss
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.scss
@@ -99,9 +99,10 @@
     padding-right: 2px;
   }
 
-  .input &:global(.ms-TextField-field) {
+  :global(.ms-TextField-field) {
     min-width: auto;
     padding: 5px;
+    text-overflow: clip;
   }
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
index 348d3c85f0c64..90805592a1750 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
@@ -98,6 +98,10 @@ $detailsList-item-focus-meta-text-color: $ms-color-neutralDark;
     &.isRowHeader {
       color: $detailsList-item-selected-text-color;
     }
+
+    @media screen and (-ms-high-contrast: active) {
+      color: Highlight;
+    }
   }
 
   &:before {
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index 9b9ec1f8904ef..01131c7b381d9 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -40,6 +40,7 @@ $field-error-color: $errorTextColor;
 
 //= State: default
 .fieldGroup {
+  @include ms-normalize;
   border: 1px solid $field-border-color;
   background: $field-background-color;
   height: 32px;

From 042e2133b475a37340c4f05ae9eeb0abd22ec49d Mon Sep 17 00:00:00 2001
From: Benjamin Kaiser <benjaminjkaiser@gmail.com>
Date: Tue, 22 Aug 2017 11:17:07 -0700
Subject: [PATCH 0456/1641] Add Comment icon (#2569)

We would like to consume the Comment icon through the
office-ui-fabric-react package but it currently does not have all the
neccessary parts in place.
---
 .../bekaise-addCommentIcon_2017-08-21-22-08.json      | 11 +++++++++++
 packages/styling/src/styles/IconCodes.ts              |  4 ++++
 2 files changed, 15 insertions(+)
 create mode 100644 common/changes/@uifabric/styling/bekaise-addCommentIcon_2017-08-21-22-08.json

diff --git a/common/changes/@uifabric/styling/bekaise-addCommentIcon_2017-08-21-22-08.json b/common/changes/@uifabric/styling/bekaise-addCommentIcon_2017-08-21-22-08.json
new file mode 100644
index 0000000000000..7a2cea47ad7a1
--- /dev/null
+++ b/common/changes/@uifabric/styling/bekaise-addCommentIcon_2017-08-21-22-08.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "add Comment icon",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "bekaise@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/styling/src/styles/IconCodes.ts b/packages/styling/src/styles/IconCodes.ts
index d4636b8ca7163..a46b69176f98c 100644
--- a/packages/styling/src/styles/IconCodes.ts
+++ b/packages/styling/src/styles/IconCodes.ts
@@ -683,6 +683,10 @@ export const IconCodes = {
    * Icon code with the value '\uEDBB'.
    */
   combine: '\uEDBB',
+  /**
+   * Icon code with value '\uE90A'.
+   */
+  comment: '\uE90A',
   /**
    * Icon code with the value '\uE942'.
    */

From c5bc8fec8a3c51a469a159e15833f7084ba947aa Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 22 Aug 2017 13:47:04 -0700
Subject: [PATCH 0457/1641] DONT MERGE: Updated build tooling to move
 typescript/tslint out of GCB (#2577)

Updated build tooling to move typescript/tslint out of GCB
---
 .gitignore                                    |    1 +
 common/config/rush/npm-shrinkwrap.json        | 1250 ++++++-----------
 package.json                                  |    7 +-
 packages/example-app-base/gulpfile.js         |   46 +-
 packages/example-app-base/karma.config.js     |  110 --
 packages/example-app-base/package.json        |    5 +-
 .../src/components/App/App.tsx                |   18 +-
 .../src/components/Header/Header.tsx          |    3 +-
 .../PropertiesTable/PropertiesTableSet.tsx    |    8 +-
 .../src/utilities/createApp.tsx               |   10 +-
 .../src/utilities/examplesOf.ts               |    4 -
 packages/example-app-base/tslint.json         |    2 +
 packages/experiments/gulpfile.js              |   73 +-
 packages/experiments/package.json             |    6 +-
 packages/experiments/src/common/tests.js      |   15 -
 packages/experiments/src/common/tests.ts      |   17 +
 .../components/CommandBar/CommandBar.Props.ts |    1 +
 .../src/components/CommandBar/CommandBar.tsx  |   18 +-
 .../components/CommandBar/CommandBarPage.tsx  |    3 +-
 .../CommandBar/CommandBarPage.visualtest.tsx  |   63 +-
 .../experiments/src/components/Tile/Tile.tsx  |   24 +-
 .../src/components/Tile/TilePage.tsx          |    9 +-
 .../Tile/examples/Tile.Document.Example.tsx   |   45 +-
 .../Tile/examples/Tile.Media.Example.tsx      |   29 +-
 .../src/components/TilesList/TilesList.tsx    |    9 +-
 .../components/TilesList/TilesListPage.tsx    |    3 +-
 .../examples/TilesList.Media.Example.tsx      |    9 +-
 .../src/demo/GettingStartedPage.tsx           |    4 +-
 packages/experiments/tsconfig.json            |    7 +-
 packages/experiments/tslint.json              |    4 +
 packages/merge-styles/gulpfile.js             |   41 +-
 packages/merge-styles/package.json            |    3 +-
 packages/merge-styles/src/common/tests.js     |   22 -
 packages/merge-styles/src/common/tests.ts     |   16 +
 packages/merge-styles/tsconfig.json           |    3 +-
 .../package.json                              |    3 +-
 .../office-ui-fabric-react-tslint/tslint.json |   21 +-
 packages/office-ui-fabric-react/gulpfile.js   |   79 +-
 packages/office-ui-fabric-react/package.json  |    7 +-
 .../src/common/ConnectedHost.tsx              |    2 +-
 .../src/common/ISubscribable.ts               |    2 +-
 .../src/common/StoreSet.ts                    |    6 +-
 .../src/common/connect.test.tsx               |   30 +-
 .../src/common/connect.tsx                    |    2 +-
 .../src/common/storeKey.ts                    |    4 +-
 .../src/common/tests.js                       |   18 -
 .../src/common/tests.ts                       |   17 +
 .../src/components/ComboBox/ComboBox.tsx      |    2 +-
 .../src/components/List/List.tsx              |    2 +-
 .../MarqueeSelection.Basic.Example.tsx        |    3 +-
 .../src/demo/GettingStartedPage.tsx           |    2 +
 .../src/utilities/selection/Selection.ts      |    4 +-
 .../src/utilities/selection/interfaces.ts     |    2 +-
 packages/office-ui-fabric-react/tslint.json   |   12 +
 .../office-ui-fabric-react/webpack.config.js  |   75 +-
 .../webpack.lib.config.js                     |   78 -
 packages/styling/gulpfile.js                  |   46 +-
 packages/styling/package.json                 |    3 +-
 packages/styling/src/common/tests.js          |   18 -
 packages/styling/src/common/tests.ts          |   17 +
 packages/styling/webpack.config.js            |   63 -
 packages/styling/webpack.serve.config.js      |   52 -
 packages/utilities/gulpfile.js                |   42 +-
 packages/utilities/package.json               |    8 +-
 packages/utilities/src/array.ts               |   10 +-
 packages/utilities/src/autobind.test.ts       |    2 +-
 packages/utilities/src/common/tests.js        |   15 -
 packages/utilities/src/common/tests.ts        |   17 +
 packages/utilities/src/customizable.tsx       |    2 +-
 packages/utilities/src/focus.test.tsx         |    6 +-
 packages/utilities/src/initials.ts            |    2 +-
 packages/utilities/tsconfig.json              |    3 +-
 rush.json                                     |    7 +-
 scripts/build.js                              |   13 +
 scripts/exec-sync.js                          |   56 +
 scripts/package.json                          |   18 +
 scripts/selective-build.js                    |  111 --
 scripts/tasks/karma.js                        |   11 +
 scripts/tasks/sass.js                         |    5 +
 scripts/tasks/serve.js                        |    0
 scripts/tasks/ts.js                           |   12 +
 scripts/tasks/tslint.js                       |   10 +
 scripts/tasks/webpack.js                      |   14 +
 83 files changed, 1040 insertions(+), 1782 deletions(-)
 delete mode 100644 packages/example-app-base/karma.config.js
 delete mode 100644 packages/experiments/src/common/tests.js
 create mode 100644 packages/experiments/src/common/tests.ts
 delete mode 100644 packages/merge-styles/src/common/tests.js
 create mode 100644 packages/merge-styles/src/common/tests.ts
 delete mode 100644 packages/office-ui-fabric-react/src/common/tests.js
 create mode 100644 packages/office-ui-fabric-react/src/common/tests.ts
 delete mode 100644 packages/office-ui-fabric-react/webpack.lib.config.js
 delete mode 100644 packages/styling/src/common/tests.js
 create mode 100644 packages/styling/src/common/tests.ts
 delete mode 100644 packages/styling/webpack.config.js
 delete mode 100644 packages/styling/webpack.serve.config.js
 delete mode 100644 packages/utilities/src/common/tests.js
 create mode 100644 packages/utilities/src/common/tests.ts
 create mode 100644 scripts/build.js
 create mode 100644 scripts/exec-sync.js
 create mode 100644 scripts/package.json
 delete mode 100644 scripts/selective-build.js
 create mode 100644 scripts/tasks/karma.js
 create mode 100644 scripts/tasks/sass.js
 create mode 100644 scripts/tasks/serve.js
 create mode 100644 scripts/tasks/ts.js
 create mode 100644 scripts/tasks/tslint.js
 create mode 100644 scripts/tasks/webpack.js

diff --git a/.gitignore b/.gitignore
index 46257cf4e56d7..5e4728c515245 100644
--- a/.gitignore
+++ b/.gitignore
@@ -42,6 +42,7 @@ node_modules
 temp
 lib
 lib-amd
+lib-es6
 coverage
 dist
 npm-debug.log
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index aba93b92f2ea6..baf25e5993c8d 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -4,14 +4,14 @@
   "lockfileVersion": 1,
   "dependencies": {
     "@microsoft/api-extractor": {
-      "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.3.2.tgz",
-      "integrity": "sha1-pVZ78Y5vGuhNhjE5j0kzlMJeIdM="
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.3.3.tgz",
+      "integrity": "sha1-BIDn0JDTDRy0uchpeMFakIXJO7o="
     },
     "@microsoft/gulp-core-build": {
-      "version": "2.9.3",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.3.tgz",
-      "integrity": "sha1-HJbOC5DAUmm9jMurTY5VskofCVg=",
+      "version": "2.9.4",
+      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.4.tgz",
+      "integrity": "sha1-3CTaxi7YWEYuHpukLvyQsus6i4A=",
       "dependencies": {
         "@types/chai": {
           "version": "3.4.34",
@@ -27,6 +27,11 @@
           "version": "2.5.4",
           "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
           "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
+        },
+        "yargs": {
+          "version": "4.6.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz",
+          "integrity": "sha1-y0BQwBWb+2u2ScD0r1UFJqhGGdw="
         }
       }
     },
@@ -156,9 +161,9 @@
       "integrity": "sha1-k9LYWMLwL+3wxZSKal4KQ8XjqCU="
     },
     "@microsoft/gulp-core-build-typescript": {
-      "version": "3.4.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.4.0.tgz",
-      "integrity": "sha1-Fy1A/zaq1nAcju1SmSKbjx0QOQw="
+      "version": "3.4.2",
+      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.4.2.tgz",
+      "integrity": "sha1-+DHJLG36ogub6HPmPhVxZRKW9Yk="
     },
     "@microsoft/gulp-core-build-webpack": {
       "version": "1.1.6",
@@ -240,9 +245,9 @@
       }
     },
     "@microsoft/load-themed-styles": {
-      "version": "1.7.1",
-      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.1.tgz",
-      "integrity": "sha1-hpLvLfbRmczGF5AIJqcM88yex2E="
+      "version": "1.7.2",
+      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.2.tgz",
+      "integrity": "sha1-Hv4yu8cRKZBl7RMYEg5olF9LZ0E="
     },
     "@microsoft/loader-cased-file": {
       "version": "1.0.1",
@@ -385,6 +390,11 @@
           "version": "2.2.2",
           "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz",
           "integrity": "sha1-YGAiUIR5tV/6NotY/uljoD39eww="
+        },
+        "yargs": {
+          "version": "4.6.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz",
+          "integrity": "sha1-y0BQwBWb+2u2ScD0r1UFJqhGGdw="
         }
       }
     },
@@ -445,6 +455,11 @@
           "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz",
           "integrity": "sha1-rqdNXmHB+JlhO/ZL2mbUx48v0X0="
         },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
         "css-loader": {
           "version": "0.24.0",
           "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.24.0.tgz",
@@ -608,6 +623,11 @@
               "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
             }
           }
+        },
+        "yargs": {
+          "version": "4.6.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz",
+          "integrity": "sha1-y0BQwBWb+2u2ScD0r1UFJqhGGdw="
         }
       }
     },
@@ -677,6 +697,11 @@
           "version": "2.2.2",
           "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz",
           "integrity": "sha1-YGAiUIR5tV/6NotY/uljoD39eww="
+        },
+        "yargs": {
+          "version": "4.6.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz",
+          "integrity": "sha1-y0BQwBWb+2u2ScD0r1UFJqhGGdw="
         }
       }
     },
@@ -756,6 +781,11 @@
           "resolved": "https://registry.npmjs.org/boxen/-/boxen-0.6.0.tgz",
           "integrity": "sha1-g2TUJIrDT/DvGy8r9JpsYM4NgbY="
         },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
         "configstore": {
           "version": "2.1.0",
           "resolved": "https://registry.npmjs.org/configstore/-/configstore-2.1.0.tgz",
@@ -869,161 +899,43 @@
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-2.0.0.tgz",
           "integrity": "sha1-7byQPMOF/ARSPZZqM1UEtVBNG9I="
+        },
+        "yargs": {
+          "version": "4.6.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz",
+          "integrity": "sha1-y0BQwBWb+2u2ScD0r1UFJqhGGdw="
         }
       }
     },
     "@microsoft/stream-collator": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/@microsoft/stream-collator/-/stream-collator-2.0.3.tgz",
-      "integrity": "sha1-fmBfGON9Pa9hQXd+zTLu34g4/ts="
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/@microsoft/stream-collator/-/stream-collator-2.0.4.tgz",
+      "integrity": "sha1-Ofv6OxWIw3Z4j+f7xif2lsRDMus="
     },
     "@microsoft/web-library-build": {
-      "version": "3.2.8",
-      "resolved": "https://registry.npmjs.org/@microsoft/web-library-build/-/web-library-build-3.2.8.tgz",
-      "integrity": "sha1-Nu04s3YW+V7dAVh3WT+eiyJ5PYQ=",
+      "version": "3.2.10",
+      "resolved": "https://registry.npmjs.org/@microsoft/web-library-build/-/web-library-build-3.2.10.tgz",
+      "integrity": "sha1-MV7aphKQiy6wUKat96RFGYbwDU4=",
       "dependencies": {
         "@microsoft/gulp-core-build-karma": {
-          "version": "2.3.8",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-karma/-/gulp-core-build-karma-2.3.8.tgz",
-          "integrity": "sha1-MdsOvht/vxQzpmvGPwQFvAzNPVo="
+          "version": "2.3.9",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-karma/-/gulp-core-build-karma-2.3.9.tgz",
+          "integrity": "sha1-MNH8KliZpaurRodoXanhBUf/mPY="
         },
         "@microsoft/gulp-core-build-sass": {
-          "version": "3.2.5",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.2.5.tgz",
-          "integrity": "sha1-QlRZRLsO5A7KarTIu/p4gI8zfLg=",
-          "dependencies": {
-            "@microsoft/gulp-core-build": {
-              "version": "2.9.2",
-              "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.2.tgz",
-              "integrity": "sha1-mx/9pcjNJMZZv0AWUWUUQUztB7s="
-            },
-            "camelcase": {
-              "version": "2.1.1",
-              "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz",
-              "integrity": "sha1-fB0W1nmhu+WcoCys7PsBHiAfWh8="
-            },
-            "cliui": {
-              "version": "3.2.0",
-              "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
-              "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
-            },
-            "window-size": {
-              "version": "0.2.0",
-              "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.2.0.tgz",
-              "integrity": "sha1-tDFbtCFKPXBY6+7okuE/ok2YsHU="
-            },
-            "yargs": {
-              "version": "4.6.0",
-              "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz",
-              "integrity": "sha1-y0BQwBWb+2u2ScD0r1UFJqhGGdw="
-            }
-          }
+          "version": "3.2.7",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.2.7.tgz",
+          "integrity": "sha1-98YUUdy1Y4C32r7thGmb2X2YJZg="
         },
         "@microsoft/gulp-core-build-serve": {
-          "version": "2.1.7",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-serve/-/gulp-core-build-serve-2.1.7.tgz",
-          "integrity": "sha1-ZdM6YXuIlwKaHXkFDcxwvkICB9k=",
-          "dependencies": {
-            "@microsoft/gulp-core-build": {
-              "version": "2.9.2",
-              "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.2.tgz",
-              "integrity": "sha1-mx/9pcjNJMZZv0AWUWUUQUztB7s="
-            },
-            "camelcase": {
-              "version": "2.1.1",
-              "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz",
-              "integrity": "sha1-fB0W1nmhu+WcoCys7PsBHiAfWh8="
-            },
-            "cliui": {
-              "version": "3.2.0",
-              "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
-              "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
-            },
-            "window-size": {
-              "version": "0.2.0",
-              "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.2.0.tgz",
-              "integrity": "sha1-tDFbtCFKPXBY6+7okuE/ok2YsHU="
-            },
-            "yargs": {
-              "version": "4.6.0",
-              "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz",
-              "integrity": "sha1-y0BQwBWb+2u2ScD0r1UFJqhGGdw="
-            }
-          }
-        },
-        "@microsoft/gulp-core-build-typescript": {
-          "version": "3.3.2",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.3.2.tgz",
-          "integrity": "sha1-EH8TFHtgW28sUP6rYZTPp9+po4s=",
-          "dependencies": {
-            "@microsoft/gulp-core-build": {
-              "version": "2.9.2",
-              "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.2.tgz",
-              "integrity": "sha1-mx/9pcjNJMZZv0AWUWUUQUztB7s="
-            },
-            "camelcase": {
-              "version": "2.1.1",
-              "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz",
-              "integrity": "sha1-fB0W1nmhu+WcoCys7PsBHiAfWh8="
-            },
-            "cliui": {
-              "version": "3.2.0",
-              "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
-              "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
-            },
-            "window-size": {
-              "version": "0.2.0",
-              "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.2.0.tgz",
-              "integrity": "sha1-tDFbtCFKPXBY6+7okuE/ok2YsHU="
-            },
-            "yargs": {
-              "version": "4.6.0",
-              "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz",
-              "integrity": "sha1-y0BQwBWb+2u2ScD0r1UFJqhGGdw="
-            }
-          }
+          "version": "2.1.9",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-serve/-/gulp-core-build-serve-2.1.9.tgz",
+          "integrity": "sha1-bu8mCufNa174k5PD1mtUlmkt8Zk="
         },
         "@microsoft/gulp-core-build-webpack": {
-          "version": "1.2.4",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-webpack/-/gulp-core-build-webpack-1.2.4.tgz",
-          "integrity": "sha1-VqV15cYESx7Q1yEUKD4Ixr2xY6Y=",
-          "dependencies": {
-            "@microsoft/gulp-core-build": {
-              "version": "2.9.2",
-              "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.2.tgz",
-              "integrity": "sha1-mx/9pcjNJMZZv0AWUWUUQUztB7s="
-            },
-            "camelcase": {
-              "version": "2.1.1",
-              "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz",
-              "integrity": "sha1-fB0W1nmhu+WcoCys7PsBHiAfWh8="
-            },
-            "cliui": {
-              "version": "3.2.0",
-              "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
-              "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
-            },
-            "window-size": {
-              "version": "0.2.0",
-              "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.2.0.tgz",
-              "integrity": "sha1-tDFbtCFKPXBY6+7okuE/ok2YsHU="
-            },
-            "yargs": {
-              "version": "4.6.0",
-              "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz",
-              "integrity": "sha1-y0BQwBWb+2u2ScD0r1UFJqhGGdw="
-            }
-          }
-        },
-        "@types/chai": {
-          "version": "3.4.34",
-          "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz",
-          "integrity": "sha1-1TNXkoI7sJzd1eOMPSEbcJGDhU0="
-        },
-        "@types/mocha": {
-          "version": "2.2.38",
-          "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz",
-          "integrity": "sha1-jBiPbjTC58Px0BJ9kI1aNuWmDck="
+          "version": "1.2.6",
+          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-webpack/-/gulp-core-build-webpack-1.2.6.tgz",
+          "integrity": "sha1-CEPmcgi0QcZlaaL038cWTQv/rbU="
         },
         "autoprefixer": {
           "version": "6.3.7",
@@ -1102,11 +1014,6 @@
           "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
           "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
         },
-        "rimraf": {
-          "version": "2.5.4",
-          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
-          "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
-        },
         "sinon": {
           "version": "1.17.7",
           "resolved": "https://registry.npmjs.org/sinon/-/sinon-1.17.7.tgz",
@@ -1168,6 +1075,15 @@
         }
       }
     },
+    "@rush-temp/build": {
+      "version": "file:projects/build",
+      "dependencies": {
+        "tslint": {
+          "version": "5.6.0",
+          "bundled": true
+        }
+      }
+    },
     "@rush-temp/example-app-base": {
       "version": "file:projects/example-app-base",
       "dependencies": {
@@ -1188,7 +1104,7 @@
           "bundled": true
         },
         "async": {
-          "version": "0.9.2",
+          "version": "2.5.0",
           "bundled": true
         },
         "camelcase": {
@@ -1208,7 +1124,7 @@
           "bundled": true
         },
         "debug": {
-          "version": "2.6.0",
+          "version": "2.6.8",
           "bundled": true
         },
         "diff": {
@@ -1244,15 +1160,11 @@
           "bundled": true
         },
         "loader-utils": {
-          "version": "0.2.17",
+          "version": "1.1.0",
           "bundled": true
         },
         "mocha": {
-          "version": "3.3.0",
-          "bundled": true
-        },
-        "ms": {
-          "version": "0.7.2",
+          "version": "3.5.0",
           "bundled": true
         },
         "node-libs-browser": {
@@ -1285,13 +1197,7 @@
           "dependencies": {
             "string_decoder": {
               "version": "1.0.3",
-              "bundled": true,
-              "dependencies": {
-                "safe-buffer": {
-                  "version": "5.1.1",
-                  "bundled": true
-                }
-              }
+              "bundled": true
             }
           }
         },
@@ -1299,14 +1205,6 @@
           "version": "2.0.0",
           "bundled": true
         },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true
-        },
         "stream-browserify": {
           "version": "2.0.1",
           "bundled": true
@@ -1328,15 +1226,11 @@
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.7",
+          "version": "0.2.8",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.2",
-          "bundled": true
-        },
-        "typescript": {
-          "version": "2.4.2",
+          "version": "2.0.4",
           "bundled": true
         },
         "url": {
@@ -1351,38 +1245,16 @@
         },
         "watchpack": {
           "version": "1.4.0",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            }
-          }
+          "bundled": true
         },
         "webpack": {
-          "version": "3.4.1",
+          "version": "3.5.5",
           "bundled": true,
           "dependencies": {
-            "ajv": {
-              "version": "5.2.2",
-              "bundled": true
-            },
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            },
             "has-flag": {
               "version": "2.0.0",
               "bundled": true
             },
-            "loader-utils": {
-              "version": "1.1.0",
-              "bundled": true
-            },
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            },
             "supports-color": {
               "version": "4.2.1",
               "bundled": true
@@ -1391,13 +1263,7 @@
         },
         "webpack-sources": {
           "version": "1.0.1",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            }
-          }
+          "bundled": true
         },
         "which-module": {
           "version": "2.0.0",
@@ -1433,7 +1299,7 @@
           "bundled": true
         },
         "async": {
-          "version": "0.9.2",
+          "version": "2.5.0",
           "bundled": true
         },
         "camelcase": {
@@ -1488,6 +1354,10 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "loader-utils": {
+          "version": "1.1.0",
+          "bundled": true
+        },
         "mocha": {
           "version": "3.5.0",
           "bundled": true
@@ -1530,14 +1400,6 @@
           "version": "2.0.0",
           "bundled": true
         },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true
-        },
         "stream-browserify": {
           "version": "2.0.1",
           "bundled": true
@@ -1563,7 +1425,7 @@
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.3",
+          "version": "2.0.4",
           "bundled": true
         },
         "url": {
@@ -1578,34 +1440,16 @@
         },
         "watchpack": {
           "version": "1.4.0",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            }
-          }
+          "bundled": true
         },
         "webpack": {
-          "version": "3.4.1",
+          "version": "3.5.5",
           "bundled": true,
           "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            },
             "has-flag": {
               "version": "2.0.0",
               "bundled": true
             },
-            "loader-utils": {
-              "version": "1.1.0",
-              "bundled": true
-            },
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            },
             "supports-color": {
               "version": "4.2.1",
               "bundled": true
@@ -1614,13 +1458,7 @@
         },
         "webpack-sources": {
           "version": "1.0.1",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            }
-          }
+          "bundled": true
         },
         "which-module": {
           "version": "2.0.0",
@@ -1639,10 +1477,6 @@
     "@rush-temp/fabric-website": {
       "version": "file:projects/fabric-website",
       "dependencies": {
-        "@types/react": {
-          "version": "15.0.38",
-          "bundled": true
-        },
         "@types/react-addons-test-utils": {
           "version": "0.14.19",
           "bundled": true
@@ -1664,7 +1498,7 @@
           "bundled": true
         },
         "async": {
-          "version": "0.9.2",
+          "version": "2.5.0",
           "bundled": true
         },
         "camelcase": {
@@ -1684,7 +1518,7 @@
           "bundled": true
         },
         "debug": {
-          "version": "2.6.0",
+          "version": "2.6.8",
           "bundled": true
         },
         "diff": {
@@ -1703,10 +1537,6 @@
           "version": "7.1.1",
           "bundled": true
         },
-        "highlight.js": {
-          "version": "9.11.0",
-          "bundled": true
-        },
         "https-browserify": {
           "version": "0.0.1",
           "bundled": true
@@ -1724,15 +1554,11 @@
           "bundled": true
         },
         "loader-utils": {
-          "version": "0.2.17",
+          "version": "1.1.0",
           "bundled": true
         },
         "mocha": {
-          "version": "3.3.0",
-          "bundled": true
-        },
-        "ms": {
-          "version": "0.7.2",
+          "version": "3.5.0",
           "bundled": true
         },
         "node-libs-browser": {
@@ -1773,14 +1599,6 @@
           "version": "2.0.0",
           "bundled": true
         },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true
-        },
         "stream-browserify": {
           "version": "2.0.1",
           "bundled": true
@@ -1806,11 +1624,7 @@
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.3",
-          "bundled": true
-        },
-        "typescript": {
-          "version": "2.4.2",
+          "version": "2.0.4",
           "bundled": true
         },
         "url": {
@@ -1825,61 +1639,25 @@
         },
         "watchpack": {
           "version": "1.4.0",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            }
-          }
+          "bundled": true
         },
         "webpack": {
-          "version": "3.5.2",
+          "version": "3.5.5",
           "bundled": true,
           "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            },
-            "camelcase": {
-              "version": "4.1.0",
-              "bundled": true
-            },
             "has-flag": {
               "version": "2.0.0",
               "bundled": true
             },
-            "loader-utils": {
-              "version": "1.1.0",
-              "bundled": true
-            },
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            },
             "supports-color": {
               "version": "4.2.1",
               "bundled": true
-            },
-            "yargs": {
-              "version": "8.0.2",
-              "bundled": true
-            },
-            "yargs-parser": {
-              "version": "7.0.0",
-              "bundled": true
             }
           }
         },
         "webpack-sources": {
           "version": "1.0.1",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            }
-          }
+          "bundled": true
         },
         "which-module": {
           "version": "2.0.0",
@@ -1898,16 +1676,12 @@
     "@rush-temp/merge-styles": {
       "version": "file:projects/merge-styles",
       "dependencies": {
-        "async": {
-          "version": "0.9.2",
-          "bundled": true
-        },
         "commander": {
           "version": "2.9.0",
           "bundled": true
         },
         "debug": {
-          "version": "2.6.0",
+          "version": "2.6.8",
           "bundled": true
         },
         "diff": {
@@ -1919,19 +1693,7 @@
           "bundled": true
         },
         "mocha": {
-          "version": "3.3.0",
-          "bundled": true
-        },
-        "ms": {
-          "version": "0.7.2",
-          "bundled": true
-        },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
+          "version": "3.5.0",
           "bundled": true
         },
         "supports-color": {
@@ -1960,7 +1722,7 @@
           "bundled": true
         },
         "async": {
-          "version": "0.9.2",
+          "version": "2.5.0",
           "bundled": true
         },
         "camelcase": {
@@ -1980,7 +1742,7 @@
           "bundled": true
         },
         "debug": {
-          "version": "2.6.0",
+          "version": "2.6.8",
           "bundled": true
         },
         "diff": {
@@ -1999,10 +1761,6 @@
           "version": "7.1.1",
           "bundled": true
         },
-        "has-flag": {
-          "version": "2.0.0",
-          "bundled": true
-        },
         "https-browserify": {
           "version": "0.0.1",
           "bundled": true
@@ -2020,25 +1778,11 @@
           "bundled": true
         },
         "loader-utils": {
-          "version": "0.2.17",
+          "version": "1.1.0",
           "bundled": true
         },
         "mocha": {
-          "version": "3.4.2",
-          "bundled": true,
-          "dependencies": {
-            "has-flag": {
-              "version": "1.0.0",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "3.1.2",
-              "bundled": true
-            }
-          }
-        },
-        "ms": {
-          "version": "0.7.2",
+          "version": "3.5.0",
           "bundled": true
         },
         "node-libs-browser": {
@@ -2069,32 +1813,16 @@
           "version": "2.3.3",
           "bundled": true,
           "dependencies": {
-            "safe-buffer": {
-              "version": "5.1.1",
-              "bundled": true
-            },
             "string_decoder": {
               "version": "1.0.3",
               "bundled": true
             }
           }
         },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "bundled": true
-        },
         "source-list-map": {
           "version": "2.0.0",
           "bundled": true
         },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true
-        },
         "stream-browserify": {
           "version": "2.0.1",
           "bundled": true
@@ -2112,19 +1840,15 @@
           "bundled": true
         },
         "supports-color": {
-          "version": "4.2.1",
+          "version": "3.1.2",
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.7",
+          "version": "0.2.8",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.2",
-          "bundled": true
-        },
-        "typescript": {
-          "version": "2.4.2",
+          "version": "2.0.4",
           "bundled": true
         },
         "url": {
@@ -2139,38 +1863,16 @@
         },
         "watchpack": {
           "version": "1.4.0",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            }
-          }
+          "bundled": true
         },
         "webpack": {
-          "version": "3.4.1",
+          "version": "3.5.5",
           "bundled": true,
           "dependencies": {
-            "ajv": {
-              "version": "5.2.2",
-              "bundled": true
-            },
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            },
             "has-flag": {
               "version": "2.0.0",
               "bundled": true
             },
-            "loader-utils": {
-              "version": "1.1.0",
-              "bundled": true
-            },
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            },
             "supports-color": {
               "version": "4.2.1",
               "bundled": true
@@ -2179,13 +1881,7 @@
         },
         "webpack-sources": {
           "version": "1.0.1",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            }
-          }
+          "bundled": true
         },
         "which-module": {
           "version": "2.0.0",
@@ -2319,20 +2015,12 @@
           "version": "2.3.3",
           "bundled": true,
           "dependencies": {
-            "safe-buffer": {
-              "version": "5.1.1",
-              "bundled": true
-            },
             "string_decoder": {
               "version": "1.0.3",
               "bundled": true
             }
           }
         },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "bundled": true
-        },
         "source-list-map": {
           "version": "2.0.0",
           "bundled": true
@@ -2358,11 +2046,11 @@
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.7",
+          "version": "0.2.8",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.2",
+          "version": "2.0.4",
           "bundled": true
         },
         "url": {
@@ -2380,21 +2068,13 @@
           "bundled": true
         },
         "webpack": {
-          "version": "3.4.1",
+          "version": "3.5.5",
           "bundled": true,
           "dependencies": {
-            "ajv": {
-              "version": "5.2.2",
-              "bundled": true
-            },
             "has-flag": {
               "version": "2.0.0",
               "bundled": true
             },
-            "loader-utils": {
-              "version": "1.1.0",
-              "bundled": true
-            },
             "supports-color": {
               "version": "4.2.1",
               "bundled": true
@@ -2422,10 +2102,6 @@
     "@rush-temp/styling": {
       "version": "file:projects/styling",
       "dependencies": {
-        "@uifabric/utilities": {
-          "version": "1.10.4",
-          "bundled": true
-        },
         "acorn": {
           "version": "5.1.1",
           "bundled": true
@@ -2443,7 +2119,7 @@
           "bundled": true
         },
         "async": {
-          "version": "0.9.2",
+          "version": "2.5.0",
           "bundled": true
         },
         "camelcase": {
@@ -2463,7 +2139,7 @@
           "bundled": true
         },
         "debug": {
-          "version": "2.6.0",
+          "version": "2.6.8",
           "bundled": true
         },
         "diff": {
@@ -2482,10 +2158,6 @@
           "version": "7.1.1",
           "bundled": true
         },
-        "has-flag": {
-          "version": "2.0.0",
-          "bundled": true
-        },
         "https-browserify": {
           "version": "0.0.1",
           "bundled": true
@@ -2503,35 +2175,17 @@
           "bundled": true
         },
         "loader-utils": {
-          "version": "0.2.17",
+          "version": "1.1.0",
           "bundled": true
         },
         "mocha": {
-          "version": "3.4.2",
-          "bundled": true,
-          "dependencies": {
-            "has-flag": {
-              "version": "1.0.0",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "3.1.2",
-              "bundled": true
-            }
-          }
-        },
-        "ms": {
-          "version": "0.7.2",
+          "version": "3.5.0",
           "bundled": true
         },
         "node-libs-browser": {
           "version": "2.0.0",
           "bundled": true
         },
-        "office-ui-fabric-react": {
-          "version": "2.34.2",
-          "bundled": true
-        },
         "os-browserify": {
           "version": "0.2.1",
           "bundled": true
@@ -2556,32 +2210,16 @@
           "version": "2.3.3",
           "bundled": true,
           "dependencies": {
-            "safe-buffer": {
-              "version": "5.1.1",
-              "bundled": true
-            },
             "string_decoder": {
               "version": "1.0.3",
               "bundled": true
             }
           }
         },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "bundled": true
-        },
         "source-list-map": {
           "version": "2.0.0",
           "bundled": true
         },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true
-        },
         "stream-browserify": {
           "version": "2.0.1",
           "bundled": true
@@ -2599,19 +2237,15 @@
           "bundled": true
         },
         "supports-color": {
-          "version": "4.2.1",
+          "version": "3.1.2",
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.7",
+          "version": "0.2.8",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.2",
-          "bundled": true
-        },
-        "typescript": {
-          "version": "2.4.2",
+          "version": "2.0.4",
           "bundled": true
         },
         "url": {
@@ -2626,38 +2260,16 @@
         },
         "watchpack": {
           "version": "1.4.0",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            }
-          }
+          "bundled": true
         },
         "webpack": {
-          "version": "3.4.1",
+          "version": "3.5.5",
           "bundled": true,
           "dependencies": {
-            "ajv": {
-              "version": "5.2.2",
-              "bundled": true
-            },
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            },
             "has-flag": {
               "version": "2.0.0",
               "bundled": true
             },
-            "loader-utils": {
-              "version": "1.1.0",
-              "bundled": true
-            },
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            },
             "supports-color": {
               "version": "4.2.1",
               "bundled": true
@@ -2666,13 +2278,7 @@
         },
         "webpack-sources": {
           "version": "1.0.1",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            }
-          }
+          "bundled": true
         },
         "which-module": {
           "version": "2.0.0",
@@ -2708,7 +2314,7 @@
           "bundled": true
         },
         "async": {
-          "version": "0.9.2",
+          "version": "2.5.0",
           "bundled": true
         },
         "camelcase": {
@@ -2752,7 +2358,7 @@
           "bundled": true
         },
         "loader-utils": {
-          "version": "0.2.17",
+          "version": "1.1.0",
           "bundled": true
         },
         "node-libs-browser": {
@@ -2793,14 +2399,6 @@
           "version": "2.0.0",
           "bundled": true
         },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true
-        },
         "stream-browserify": {
           "version": "2.0.1",
           "bundled": true
@@ -2822,15 +2420,11 @@
           "bundled": true
         },
         "tapable": {
-          "version": "0.2.7",
+          "version": "0.2.8",
           "bundled": true
         },
         "timers-browserify": {
-          "version": "2.0.2",
-          "bundled": true
-        },
-        "typescript": {
-          "version": "2.4.2",
+          "version": "2.0.4",
           "bundled": true
         },
         "url": {
@@ -2845,63 +2439,15 @@
         },
         "watchpack": {
           "version": "1.4.0",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            }
-          }
+          "bundled": true
         },
         "webpack": {
-          "version": "3.4.1",
-          "bundled": true,
-          "dependencies": {
-            "ajv": {
-              "version": "5.2.2",
-              "bundled": true
-            },
-            "ajv-keywords": {
-              "version": "2.1.0",
-              "bundled": true
-            },
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "1.1.0",
-              "bundled": true
-            },
-            "source-list-map": {
-              "version": "2.0.0",
-              "bundled": true
-            },
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            },
-            "webpack-sources": {
-              "version": "1.0.1",
-              "bundled": true,
-              "dependencies": {
-                "source-list-map": {
-                  "version": "2.0.0",
-                  "bundled": true
-                }
-              }
-            }
-          }
+          "version": "3.5.5",
+          "bundled": true
         },
         "webpack-sources": {
           "version": "1.0.1",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            }
-          }
+          "bundled": true
         },
         "which-module": {
           "version": "2.0.0",
@@ -2918,27 +2464,17 @@
       }
     },
     "@rush-temp/todo-app": {
-      "version": "file:projects/todo-app",
-      "dependencies": {
-        "typescript": {
-          "version": "2.4.2",
-          "bundled": true
-        }
-      }
+      "version": "file:projects/todo-app"
     },
     "@rush-temp/utilities": {
       "version": "file:projects/utilities",
       "dependencies": {
-        "async": {
-          "version": "0.9.2",
-          "bundled": true
-        },
         "commander": {
           "version": "2.9.0",
           "bundled": true
         },
         "debug": {
-          "version": "2.6.0",
+          "version": "2.6.8",
           "bundled": true
         },
         "diff": {
@@ -2949,33 +2485,13 @@
           "version": "7.1.1",
           "bundled": true
         },
-        "loader-utils": {
-          "version": "0.2.17",
-          "bundled": true
-        },
         "mocha": {
-          "version": "3.3.0",
-          "bundled": true
-        },
-        "ms": {
-          "version": "0.7.2",
-          "bundled": true
-        },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
+          "version": "3.5.0",
           "bundled": true
         },
         "supports-color": {
           "version": "3.1.2",
           "bundled": true
-        },
-        "typescript": {
-          "version": "2.4.2",
-          "bundled": true
         }
       }
     },
@@ -3030,14 +2546,14 @@
       "integrity": "sha1-2fb4WDaaiLvGnvQCOAgfLWu8hhQ="
     },
     "@types/express": {
-      "version": "4.0.36",
-      "resolved": "https://registry.npmjs.org/@types/express/-/express-4.0.36.tgz",
-      "integrity": "sha512-bT9q2eqH/E72AGBQKT50dh6AXzheTqigGZ1GwDiwmx7vfHff0bZOrvUWjvGpNWPNkRmX1vDF6wonG6rlpBHb1A=="
+      "version": "4.0.37",
+      "resolved": "https://registry.npmjs.org/@types/express/-/express-4.0.37.tgz",
+      "integrity": "sha512-tIULTLzQpFFs5/PKnFIAFOsXQxss76glppbVKR3/jddPK26SBsD5HF5grn5G2jOGtpRWSBvYmDYoduVv+3wOXg=="
     },
     "@types/express-serve-static-core": {
-      "version": "4.0.49",
-      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.0.49.tgz",
-      "integrity": "sha512-b7mVHoURu1xaP/V6xw1sYwyv9V0EZ7euyi+sdnbnTZxEkAh4/hzPsI6Eflq+ZzHQ/Tgl7l16Jz+0oz8F46MLnA=="
+      "version": "4.0.50",
+      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.0.50.tgz",
+      "integrity": "sha512-0n1YgeUfZEIaMMu82LuOFIFDyMtFtcEP0yjQKihJlNjpCiygDVri7C26DC7jaUOwFXL6ZU2x4tGtNYNEgeO3tw=="
     },
     "@types/finalhandler": {
       "version": "0.0.31",
@@ -3085,9 +2601,9 @@
       "integrity": "sha1-3lx6sU2hKJczIzybDsb543fbkPU="
     },
     "@types/log4js": {
-      "version": "0.0.32",
-      "resolved": "https://registry.npmjs.org/@types/log4js/-/log4js-0.0.32.tgz",
-      "integrity": "sha1-wVYhz6lvkuxrDPtJCWvdI82JPHw="
+      "version": "0.0.33",
+      "resolved": "https://registry.npmjs.org/@types/log4js/-/log4js-0.0.33.tgz",
+      "integrity": "sha512-AiV2aDM8FZoSh/cRzWA3y9kffXjzTMS1x002FfwzYzbg8cYJpTgTGyjWuJl0b0bZxluOpgqcA248xmtXrJ1TBg=="
     },
     "@types/merge2": {
       "version": "0.3.29",
@@ -3100,9 +2616,9 @@
       "integrity": "sha512-rek8twk9C58gHYqIrUlJsx8NQMhlxqHzln9Z9ODqiNgv3/s+ZwIrfr+djqzsnVM12xe9hL98iJ20lj2RvCBv6A=="
     },
     "@types/minimatch": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.0.tgz",
-      "integrity": "sha512-BnRgLPs1oy9gV8b4dAW8jilIa7Kpe3uNucAvv4RkY7Yt6rj9E6Kk4Qa/18LOSinA+XDBPdzx3MqYPEP5mw8rDA=="
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.1.tgz",
+      "integrity": "sha512-rUO/jz10KRSyA9SHoCWQ8WX9BICyj5jZYu1/ucKEJKb4KzLZCKMURdYbadP157Q6Zl1x0vHsrU+Z/O0XlhYQDw=="
     },
     "@types/mocha": {
       "version": "2.2.39",
@@ -3190,9 +2706,9 @@
       "integrity": "sha512-/GVAjL1Y8puvZab63n8tsuBiYwZt1bApMdx58/msQ9ID5T05ov+wm/ZV1DvYC/DKKEygpTJViqQvkh5Rhrl4CA=="
     },
     "@types/tapable": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/@types/tapable/-/tapable-0.2.3.tgz",
-      "integrity": "sha1-CIiw8gzH5Y4cIqGIi06WPu+qgQo="
+      "version": "0.2.4",
+      "resolved": "https://registry.npmjs.org/@types/tapable/-/tapable-0.2.4.tgz",
+      "integrity": "sha512-pclMAvhPnXJcJu1ZZ8bQthuUcdDWzDuxDdbSf6l1U6s4fP6EBiZpPsOZYqFOrbqDV97sXGFSsb6AUpiLfv4xIA=="
     },
     "@types/through2": {
       "version": "2.0.32",
@@ -3235,19 +2751,19 @@
       "integrity": "sha1-LrHQCl5Ow/pYx2r94S4YK2bcXBw="
     },
     "@uifabric/example-app-base": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-4.2.0.tgz",
-      "integrity": "sha512-2DN1KzfSoF+D/gAjJC9JEQC03HfKeRcHz5uNTPd3DDZte8SrZZ32MS+9bIR+2grQPf911l9MZtpafHBxVsaFdw=="
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-4.2.1.tgz",
+      "integrity": "sha512-h31RK6ZihusHLr5qNNE57Isa9/f9l9l5GKyzVZwlKf2Ol7sC9tioTlyI54eNvCrTzIQqjziwh+xRl9f9NSNmcg=="
     },
     "@uifabric/styling": {
-      "version": "0.19.2",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.19.2.tgz",
-      "integrity": "sha512-RRnaQGrohT0fVmpb3jyA5J3V5znQsWapcUF06eLeh6wS6F8zX2geEqiujidJLg93E+0PHn+3f/G2tOcMWZAnnw=="
+      "version": "0.20.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.20.0.tgz",
+      "integrity": "sha512-tAR5notvVdKj5n2/+OyrWqmgp1fVIeSzmqoGEDbCsCEBj7WC5ir2lO6Cj4lDunzRlSGgbZVpYO2EKJ3xJy/Ctw=="
     },
     "@uifabric/utilities": {
-      "version": "4.9.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.9.0.tgz",
-      "integrity": "sha512-9AmohH0ivY9lBjyOkCAsoV8ca7vkQGnyv65XJ8tveaR/yoPF/rEy/wm2TSI121HnAQx0z1+OJYPUJVfszRt40Q=="
+      "version": "4.9.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.9.1.tgz",
+      "integrity": "sha512-CdFxnm5TbWF1775SEwJ1Kwn2eIdj9spy/BYhZAnFcLa2Bo9mXYDI3cAtVDdRuw5TAFYriZgtcSYxu9GkTavyFA=="
     },
     "abbrev": {
       "version": "1.0.9",
@@ -3281,6 +2797,18 @@
       "resolved": "https://registry.npmjs.org/after/-/after-0.8.2.tgz",
       "integrity": "sha1-/ts5T58OAqqXaOcCvaI7UF+ufh8="
     },
+    "agent-base": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-2.1.1.tgz",
+      "integrity": "sha1-1t4Q1a9hMtW9aSQn1G/FOFOQlMc=",
+      "dependencies": {
+        "semver": {
+          "version": "5.0.3",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.0.3.tgz",
+          "integrity": "sha1-d0Zt5YnNXTyV8TiqeLxWmjy10no="
+        }
+      }
+    },
     "ajv": {
       "version": "4.11.8",
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz",
@@ -3552,6 +3080,11 @@
           "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz",
           "integrity": "sha1-cVuW6phBWTzDMGeSP17GDr2k99c="
         },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
         "extend": {
           "version": "1.2.1",
           "resolved": "https://registry.npmjs.org/extend/-/extend-1.2.1.tgz",
@@ -3619,7 +3152,14 @@
     "babel-code-frame": {
       "version": "6.26.0",
       "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
-      "integrity": "sha1-Y/1D99weO7fONZR9uP42mj9Yx0s="
+      "integrity": "sha1-Y/1D99weO7fONZR9uP42mj9Yx0s=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        }
+      }
     },
     "backo2": {
       "version": "1.0.2",
@@ -3772,9 +3312,9 @@
       "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8="
     },
     "bowser": {
-      "version": "1.7.1",
-      "resolved": "https://registry.npmjs.org/bowser/-/bowser-1.7.1.tgz",
-      "integrity": "sha1-pN6PGKGg3JUx6yqSoVIftqm6lqU="
+      "version": "1.7.2",
+      "resolved": "https://registry.npmjs.org/bowser/-/bowser-1.7.2.tgz",
+      "integrity": "sha1-uUzGklumteB8QhpY5gHORhEmRXI="
     },
     "boxen": {
       "version": "1.2.1",
@@ -3786,26 +3326,11 @@
           "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
           "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg="
         },
-        "ansi-styles": {
-          "version": "3.2.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
-          "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
-        },
         "camelcase": {
           "version": "4.1.0",
           "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
           "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
         },
-        "chalk": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
-          "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ=="
-        },
-        "has-flag": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
-          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
-        },
         "is-fullwidth-code-point": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
@@ -3820,11 +3345,6 @@
           "version": "4.0.0",
           "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
           "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8="
-        },
-        "supports-color": {
-          "version": "4.2.1",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
-          "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
         }
       }
     },
@@ -3901,9 +3421,9 @@
       }
     },
     "buffer-indexof": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/buffer-indexof/-/buffer-indexof-1.1.0.tgz",
-      "integrity": "sha1-9U9kfE9OJSKLqmVqLlfkPV8nCYI="
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/buffer-indexof/-/buffer-indexof-1.1.1.tgz",
+      "integrity": "sha512-4/rOEg86jivtPTeOUUT61jJO1Ya1TrR/OkqCSZDyq84WJh3LuuiphBYJN+fm5xufIk4XAFcEwte/8WzC8If/1g=="
     },
     "buffer-xor": {
       "version": "1.0.3",
@@ -3956,9 +3476,9 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000715",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000715.tgz",
-      "integrity": "sha1-C5tceVlQ37rzAaiAa6/ofxJtqMo="
+      "version": "1.0.30000717",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000717.tgz",
+      "integrity": "sha1-J931/szdM4yZpiyXiMJpT5n2ftc="
     },
     "capture-stack-trace": {
       "version": "1.0.0",
@@ -3991,9 +3511,26 @@
       "integrity": "sha1-TQJjewZ/6Vi9v906QOxW/vc3Mkc="
     },
     "chalk": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-      "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
+      "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ==",
+      "dependencies": {
+        "ansi-styles": {
+          "version": "3.2.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
+          "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
+        },
+        "has-flag": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
+          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
+        },
+        "supports-color": {
+          "version": "4.2.1",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
+          "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
+        }
+      }
     },
     "charenc": {
       "version": "0.0.2",
@@ -4030,7 +3567,14 @@
     "clap": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/clap/-/clap-1.2.0.tgz",
-      "integrity": "sha1-WckP4+E3EEdG/xlGmiemNP9oyFc="
+      "integrity": "sha1-WckP4+E3EEdG/xlGmiemNP9oyFc=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        }
+      }
     },
     "clean-css": {
       "version": "4.1.7",
@@ -4463,9 +4007,9 @@
       "integrity": "sha1-msfgL3Y8+F2UAXZmVl7WiltfMhU="
     },
     "css-loader": {
-      "version": "0.28.4",
-      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.4.tgz",
-      "integrity": "sha1-bPNXkZLONV6LONX0Ldeh8uyJjQ8=",
+      "version": "0.28.5",
+      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.5.tgz",
+      "integrity": "sha512-/FJmsDD8e6xZOBHMFShN/BCjnrEybq0spYaTZ1QoZ10/jhUa1LDDojQELu/JJ1ykZZjt0nSwkYrb2Mfx3bZx3Q==",
       "dependencies": {
         "loader-utils": {
           "version": "1.1.0",
@@ -4476,6 +4020,11 @@
           "version": "4.3.0",
           "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz",
           "integrity": "sha1-soqmKIorn8ZRA1x3EfZathkDMaY="
+        },
+        "source-list-map": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-2.0.0.tgz",
+          "integrity": "sha512-I2UmuJSRr/T8jisiROLU3A3ltr+swpniSmNPI4Ml3ZCX6tVnDsuZzK7F2hl5jTqbZBWCEKlj5HRQiPExXLgE8A=="
         }
       }
     },
@@ -4484,6 +4033,18 @@
       "resolved": "https://registry.npmjs.org/css-modules-loader-core/-/css-modules-loader-core-1.1.0.tgz",
       "integrity": "sha1-WQhmgpShvs0mGuCkziGwtVHyHRY=",
       "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
         "postcss": {
           "version": "6.0.1",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
@@ -4746,11 +4307,6 @@
         }
       }
     },
-    "dom-walk": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/dom-walk/-/dom-walk-0.1.1.tgz",
-      "integrity": "sha1-ZyIm3HTI95mtNTB9+TaroRrNYBg="
-    },
     "domain-browser": {
       "version": "1.1.7",
       "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.1.7.tgz",
@@ -4980,9 +4536,9 @@
       "integrity": "sha1-RTVSSKiJeQNLZ5Lhm7gfK3l13Q0="
     },
     "es5-ext": {
-      "version": "0.10.27",
-      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.27.tgz",
-      "integrity": "sha512-3KXJRYzKXTd7xfFy5uZsJCXue55fAYQ035PRjyYk2PicllxIwcW9l3AbM/eGaw3vgVAUW4tl4xg9AXDEI6yw0w=="
+      "version": "0.10.29",
+      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.29.tgz",
+      "integrity": "sha512-KXla9NXo5sdaEkGSmbFPYgjH6m75kxsthL6GDRSug/Y2OiMoYm0I9giL39j4cgmaFmAbkIFJ6gG+SGKnLSmOvA=="
     },
     "es6-collections": {
       "version": "0.5.6",
@@ -5122,9 +4678,9 @@
       "integrity": "sha1-Cs7ehJ7X3RzMMsgRuxG5RNTykjI="
     },
     "evp_bytestokey": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/evp_bytestokey/-/evp_bytestokey-1.0.0.tgz",
-      "integrity": "sha1-SXtmrZ/vZc18CKYYCCS6FHa2blM="
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/evp_bytestokey/-/evp_bytestokey-1.0.2.tgz",
+      "integrity": "sha512-ni0r0lrm7AOzsh2qC5mi9sj8S0gmj5fLNjfFpxN05FB4tAVZEKotbkjOtLPqTCX/CXT7NsUr6juZb4IFJeNNdA=="
     },
     "execa": {
       "version": "0.7.0",
@@ -5304,7 +4860,14 @@
     "fancy-log": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/fancy-log/-/fancy-log-1.3.0.tgz",
-      "integrity": "sha1-Rb4X0Cu5kX1gzP/UmVyZnmyMmUg="
+      "integrity": "sha1-Rb4X0Cu5kX1gzP/UmVyZnmyMmUg=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        }
+      }
     },
     "fast-deep-equal": {
       "version": "1.0.0",
@@ -5427,6 +4990,11 @@
       "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz",
       "integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I="
     },
+    "follow-redirects": {
+      "version": "0.0.7",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-0.0.7.tgz",
+      "integrity": "sha1-NLkLqyqRGqNHVx2pDyK9NuzYqRk="
+    },
     "for-in": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
@@ -5569,6 +5137,11 @@
       "resolved": "https://registry.npmjs.org/git-rev/-/git-rev-0.2.1.tgz",
       "integrity": "sha1-jMvSCSs0W8LJFJVIOW31SWRspj8="
     },
+    "github": {
+      "version": "7.3.2",
+      "resolved": "https://registry.npmjs.org/github/-/github-7.3.2.tgz",
+      "integrity": "sha1-/hDN5pZDUsXZHhGnYW0m1f+2+Hs="
+    },
     "glamor": {
       "version": "2.20.40",
       "resolved": "https://registry.npmjs.org/glamor/-/glamor-2.20.40.tgz",
@@ -5631,18 +5204,6 @@
       "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz",
       "integrity": "sha1-nUGbPijxLoOjYhZKJ3BVkiycDVY="
     },
-    "global": {
-      "version": "4.3.2",
-      "resolved": "https://registry.npmjs.org/global/-/global-4.3.2.tgz",
-      "integrity": "sha1-52mJJopsdMOJCLEwWxD8DjlOnQ8=",
-      "dependencies": {
-        "process": {
-          "version": "0.5.2",
-          "resolved": "https://registry.npmjs.org/process/-/process-0.5.2.tgz",
-          "integrity": "sha1-FjjYqONML0QKkduVq5rrZ3/Bhc8="
-        }
-      }
-    },
     "global-modules": {
       "version": "0.2.3",
       "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-0.2.3.tgz",
@@ -5725,6 +5286,11 @@
       "resolved": "https://registry.npmjs.org/gulp/-/gulp-3.9.1.tgz",
       "integrity": "sha1-VxzkWSjdQK9lFPxAEYZgFsE4RbQ=",
       "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
         "semver": {
           "version": "4.3.6",
           "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz",
@@ -6179,6 +5745,11 @@
           "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz",
           "integrity": "sha1-cVuW6phBWTzDMGeSP17GDr2k99c="
         },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
         "concat-stream": {
           "version": "1.5.0",
           "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.5.0.tgz",
@@ -6468,6 +6039,11 @@
       "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.8.tgz",
       "integrity": "sha1-AFTh50RQLifATBh8PsxQXdVLu08=",
       "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
         "object-assign": {
           "version": "3.0.0",
           "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz",
@@ -6652,9 +6228,9 @@
       "integrity": "sha512-iKRzQQDuTCsq0Ultbi/mfJJnR0D3AdZKTq966Gsp92xkmAPCV4Xi08qhJ0Dl3ZAWemSgJ7qZK+UsZc0gFqK6wg==",
       "dependencies": {
         "uglify-js": {
-          "version": "3.0.27",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.27.tgz",
-          "integrity": "sha512-HD8CmxPXUI62v5tweiulMcP/apAtx1DXGcNZkhKQZyC+MTrTsoCBb8yPAwVrbvpgw3EpRU76bRe6axjIiCYcQg=="
+          "version": "3.0.28",
+          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.28.tgz",
+          "integrity": "sha512-0h/qGay016GG2lVav3Kz174F3T2Vjlz2v6HCt+WDQpoXfco0hWwF5gHK9yh88mUYvIC+N7Z8NT8WpjSp1yoqGA=="
         }
       }
     },
@@ -6732,6 +6308,11 @@
       "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.0.tgz",
       "integrity": "sha1-s//f5zSyo9Sp79WOhlTJH86G6v0="
     },
+    "https-proxy-agent": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-1.0.0.tgz",
+      "integrity": "sha1-NffabEjOTdv6JkiRrFk+5f+GceY="
+    },
     "hyphenate-style-name": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.0.2.tgz",
@@ -6752,16 +6333,6 @@
       "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-2.1.0.tgz",
       "integrity": "sha1-g/Cg7DeL8yRheLbCrZE28TWxyWI=",
       "dependencies": {
-        "ansi-styles": {
-          "version": "3.2.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
-          "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
-        },
-        "chalk": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
-          "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ=="
-        },
         "has-flag": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
@@ -6849,6 +6420,11 @@
       "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-0.10.1.tgz",
       "integrity": "sha1-6iXkzmnKFF4FyZ5G3P7AXkASWUo=",
       "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
         "lodash": {
           "version": "3.10.1",
           "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
@@ -7334,7 +6910,14 @@
     "karma-mocha-clean-reporter": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/karma-mocha-clean-reporter/-/karma-mocha-clean-reporter-0.0.1.tgz",
-      "integrity": "sha1-6G961LxefGLX8uJC3ydRzPk/Rvo="
+      "integrity": "sha1-6G961LxefGLX8uJC3ydRzPk/Rvo=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        }
+      }
     },
     "karma-phantomjs-launcher": {
       "version": "1.0.4",
@@ -7845,7 +7428,14 @@
     "log-symbols": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-1.0.2.tgz",
-      "integrity": "sha1-N2/3tY6jCGoPCfrMdGF+ylAeGhg="
+      "integrity": "sha1-N2/3tY6jCGoPCfrMdGF+ylAeGhg=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        }
+      }
     },
     "log4js": {
       "version": "0.6.38",
@@ -7937,7 +7527,14 @@
     "marked-terminal": {
       "version": "1.7.0",
       "resolved": "https://registry.npmjs.org/marked-terminal/-/marked-terminal-1.7.0.tgz",
-      "integrity": "sha1-yMRgiBx3LHYEtkNnAH7l938SWQQ="
+      "integrity": "sha1-yMRgiBx3LHYEtkNnAH7l938SWQQ=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        }
+      }
     },
     "math-expression-evaluator": {
       "version": "1.2.17",
@@ -7949,6 +7546,18 @@
       "resolved": "https://registry.npmjs.org/md5/-/md5-2.2.1.tgz",
       "integrity": "sha1-U6s41f48iJG6RlMp6iP6wFQBJvk="
     },
+    "md5.js": {
+      "version": "1.3.4",
+      "resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.4.tgz",
+      "integrity": "sha1-6b296UogpawYsENA/Fdk1bCdkB0=",
+      "dependencies": {
+        "hash-base": {
+          "version": "3.0.4",
+          "resolved": "https://registry.npmjs.org/hash-base/-/hash-base-3.0.4.tgz",
+          "integrity": "sha1-X8hoaEfs1zSZQDMZprCj8/auSRg="
+        }
+      }
+    },
     "media-typer": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
@@ -8065,11 +7674,6 @@
       "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-1.1.0.tgz",
       "integrity": "sha1-5md4PZLonb00KBi1IwudYqZyrRg="
     },
-    "min-document": {
-      "version": "2.19.0",
-      "resolved": "https://registry.npmjs.org/min-document/-/min-document-2.19.0.tgz",
-      "integrity": "sha1-e9KC4/WELtKVu3SM3Z8f+iyCRoU="
-    },
     "minimalistic-assert": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.0.tgz",
@@ -8277,6 +7881,11 @@
       "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.1.tgz",
       "integrity": "sha1-KzJxhOiZIQEXeyhWP7XnECrNDKk="
     },
+    "netrc": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/netrc/-/netrc-0.1.4.tgz",
+      "integrity": "sha1-a+lPysqNd63gqWcNxGCRTJRHJEQ="
+    },
     "no-case": {
       "version": "2.3.1",
       "resolved": "https://registry.npmjs.org/no-case/-/no-case-2.3.1.tgz",
@@ -8317,6 +7926,11 @@
       "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.5.3.tgz",
       "integrity": "sha1-0JydEXlkEjnRuX/8YjH9zsU+FWg=",
       "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
         "gaze": {
           "version": "1.1.2",
           "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz",
@@ -8464,9 +8078,16 @@
       "integrity": "sha1-Gpx0SCnznbuFjHbKNXmuKlTr0fo="
     },
     "object.pick": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/object.pick/-/object.pick-1.2.0.tgz",
-      "integrity": "sha1-tTkr7peC2m2ft9avr1OXefEjTCs="
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/object.pick/-/object.pick-1.3.0.tgz",
+      "integrity": "sha1-h6EKxMFpS9Lhy/U1kaZhQftd10c=",
+      "dependencies": {
+        "isobject": {
+          "version": "3.0.1",
+          "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.1.tgz",
+          "integrity": "sha1-TkMekrEalzFjaqH5yNHMvP2reN8="
+        }
+      }
     },
     "object.values": {
       "version": "1.0.4",
@@ -8484,9 +8105,9 @@
       "integrity": "sha1-JKwXdDPkou6REP5DWAutBZ+gBQk="
     },
     "office-ui-fabric-react": {
-      "version": "4.34.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.34.0.tgz",
-      "integrity": "sha512-23twEIf81GH6qro92oAve7ZG1MVDxBgtOuKR3Rq3e/Z/LIGF/OWGRyetmHe0+k9Tpzw7sLUud+3KG7IEZ98LSg=="
+      "version": "4.35.2",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.35.2.tgz",
+      "integrity": "sha512-2WYTwGBWOT4QcGGIhR0ksJYETlzkeTqQ/ZOjhlJMFnU/X97ofW6rHiCi+tGrBugmBkUUlGoEBPLt8azpph4G3g=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -8877,6 +8498,18 @@
       "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
       "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
       "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
@@ -9013,16 +8646,6 @@
       "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-1.1.0.tgz",
       "integrity": "sha1-thTJcgvmgW6u41+zpfqh26agXds=",
       "dependencies": {
-        "ansi-styles": {
-          "version": "3.2.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
-          "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
-        },
-        "chalk": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
-          "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ=="
-        },
         "has-flag": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
@@ -9045,16 +8668,6 @@
       "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-1.2.0.tgz",
       "integrity": "sha1-99gMOYxaOT+nlkRmvRlQCn1hwGk=",
       "dependencies": {
-        "ansi-styles": {
-          "version": "3.2.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
-          "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
-        },
-        "chalk": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
-          "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ=="
-        },
         "has-flag": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
@@ -9077,16 +8690,6 @@
       "resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-1.1.0.tgz",
       "integrity": "sha1-1upkmUx5+XtipytCb75gVqGUu5A=",
       "dependencies": {
-        "ansi-styles": {
-          "version": "3.2.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
-          "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
-        },
-        "chalk": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
-          "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ=="
-        },
         "has-flag": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
@@ -9109,16 +8712,6 @@
       "resolved": "https://registry.npmjs.org/postcss-modules-values/-/postcss-modules-values-1.3.0.tgz",
       "integrity": "sha1-7P+p1+GSUYOJ9CrQ6D9yrsRW6iA=",
       "dependencies": {
-        "ansi-styles": {
-          "version": "3.2.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
-          "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
-        },
-        "chalk": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
-          "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ=="
-        },
         "has-flag": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
@@ -9930,9 +9523,9 @@
       "integrity": "sha1-2kL0l0DAtC2yypcoVxyxkMmO/qM="
     },
     "shellwords": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/shellwords/-/shellwords-0.1.0.tgz",
-      "integrity": "sha1-Zq/Ue2oSky2Qccv9mKUueFzQuhQ="
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/shellwords/-/shellwords-0.1.1.tgz",
+      "integrity": "sha512-vFwSUfQvqybiICwZY5+DAWIPLKsWO31Q91JSKl3UYv+K5c2QRPzn0qzec6QPu1Qc9eHYItiP3NdJqNVqetYAww=="
     },
     "sigmund": {
       "version": "1.0.1",
@@ -10109,9 +9702,9 @@
       "integrity": "sha1-xVCyq1Qn9rPyH1r+rYjE9Vh7IQY="
     },
     "source-map": {
-      "version": "0.5.6",
-      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz",
-      "integrity": "sha1-dc449SvwczxafwwRjYEzSiu19BI="
+      "version": "0.5.7",
+      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+      "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
     },
     "source-map-loader": {
       "version": "0.2.1",
@@ -10600,40 +10193,20 @@
       "integrity": "sha1-jbAWIuh35RuDFAyu58gIZK05DII="
     },
     "ts-loader": {
-      "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/ts-loader/-/ts-loader-2.3.2.tgz",
-      "integrity": "sha512-KcQvWwla5nviCMX1511iKVsLfrx97Hbah6l5awE1HNL6eiyAzb3gSO8b5yasB6fK/qGukLpu9czWcd/AGGFy/g==",
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/ts-loader/-/ts-loader-2.3.3.tgz",
+      "integrity": "sha512-BX/BZF2BWr4wKrzw+sI3eam04cocz46HX/ERt2YZZYTgyOdUPlRnuVoukKaFIGyTE3vo5uYYGTCvKuKiUJUffg==",
       "dependencies": {
-        "ansi-styles": {
-          "version": "3.2.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
-          "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
-        },
-        "chalk": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
-          "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ=="
-        },
         "enhanced-resolve": {
           "version": "3.4.1",
           "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.4.1.tgz",
           "integrity": "sha1-BCHjOf1xQZs9oT0Smzl5BAIwR24="
         },
-        "has-flag": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
-          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
-        },
         "loader-utils": {
           "version": "1.1.0",
           "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
           "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
         },
-        "supports-color": {
-          "version": "4.2.1",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
-          "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
-        },
         "tapable": {
           "version": "0.2.8",
           "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.8.tgz",
@@ -10663,6 +10236,11 @@
         }
       }
     },
+    "tslint-react": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/tslint-react/-/tslint-react-3.2.0.tgz",
+      "integrity": "sha1-hR+1BSAcY9A0PFFybmNk9+mtLpk="
+    },
     "tsscmp": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/tsscmp/-/tsscmp-1.0.5.tgz",
@@ -10836,7 +10414,14 @@
     "update-notifier": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-2.2.0.tgz",
-      "integrity": "sha1-G1g3z5DAc22IYncytmHBOPht5y8="
+      "integrity": "sha1-G1g3z5DAc22IYncytmHBOPht5y8=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        }
+      }
     },
     "upper-case": {
       "version": "1.1.3",
@@ -11079,11 +10664,6 @@
           "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
           "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw=="
         },
-        "camelcase": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
-          "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
-        },
         "constants-browserify": {
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz",
@@ -11167,16 +10747,6 @@
           "version": "1.4.0",
           "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.4.0.tgz",
           "integrity": "sha1-ShRyvLuVK9Cpu0A2gB+VTfs5+qw="
-        },
-        "yargs": {
-          "version": "6.6.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz",
-          "integrity": "sha1-eC7CHvQDNF+DCoCMo9UTr1YGUgg="
-        },
-        "yargs-parser": {
-          "version": "4.2.1",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz",
-          "integrity": "sha1-KczqwNxPA8bIe0qfIX3RjJ90hxw="
         }
       }
     },
@@ -11190,6 +10760,11 @@
           "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.1.1.tgz",
           "integrity": "sha512-vOk6uEMctu0vQrvuSqFdJyqj1Q0S5VTDL79qtjo+DhRr+1mmaD+tluFSCZqhvi/JUhXSzoZN2BhtstaPEeE8cw=="
         },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
         "debug": {
           "version": "2.6.8",
           "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
@@ -11281,11 +10856,6 @@
       "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.7.1.tgz",
       "integrity": "sha1-IVgPWgjNBlxxFEz29hw0W8pZqLg=",
       "dependencies": {
-        "camelcase": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
-          "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
-        },
         "del": {
           "version": "3.0.0",
           "resolved": "https://registry.npmjs.org/del/-/del-3.0.0.tgz",
@@ -11312,16 +10882,6 @@
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
           "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
-        },
-        "yargs": {
-          "version": "6.6.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz",
-          "integrity": "sha1-eC7CHvQDNF+DCoCMo9UTr1YGUgg="
-        },
-        "yargs-parser": {
-          "version": "4.2.1",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz",
-          "integrity": "sha1-KczqwNxPA8bIe0qfIX3RjJ90hxw="
         }
       }
     },
@@ -11571,9 +11131,9 @@
       "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8="
     },
     "write-file-atomic": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.1.0.tgz",
-      "integrity": "sha512-0TZ20a+xcIl4u0+Mj5xDH2yOWdmQiXlKf9Hm+TgDXjTMsEYb+gDrmb8e8UNAzMCitX8NBqG4Z/FUQIyzv/R1JQ=="
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.3.0.tgz",
+      "integrity": "sha512-xuPeK4OdjWqtfi59ylvVL0Yn35SF3zgcAcv7rBPFHVaEapaDr4GdGgm3j7ckTwH9wHL7fGmgfAnb0+THrHb8tA=="
     },
     "ws": {
       "version": "1.1.4",
@@ -11636,9 +11196,21 @@
       "integrity": "sha1-HBH5IY8HYImkfdUS+TxmmaaoHVI="
     },
     "yargs": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz",
-      "integrity": "sha1-y0BQwBWb+2u2ScD0r1UFJqhGGdw="
+      "version": "6.6.0",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz",
+      "integrity": "sha1-eC7CHvQDNF+DCoCMo9UTr1YGUgg=",
+      "dependencies": {
+        "camelcase": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
+          "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
+        },
+        "yargs-parser": {
+          "version": "4.2.1",
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz",
+          "integrity": "sha1-KczqwNxPA8bIe0qfIX3RjJ90hxw="
+        }
+      }
     },
     "yargs-parser": {
       "version": "2.4.1",
diff --git a/package.json b/package.json
index d95ec089b6a79..bac819f462a7c 100644
--- a/package.json
+++ b/package.json
@@ -23,9 +23,6 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@microsoft/rush": "3.0.12",
-    "github": "^7.0.0",
-    "gulp": "^3.9.1",
-    "yargs": "^6.5.0"
+    "@microsoft/rush": "3.0.12"
   }
-}
+}
\ No newline at end of file
diff --git a/packages/example-app-base/gulpfile.js b/packages/example-app-base/gulpfile.js
index b19ead1bd4d3a..196c2a4dd3da6 100644
--- a/packages/example-app-base/gulpfile.js
+++ b/packages/example-app-base/gulpfile.js
@@ -1,47 +1,23 @@
 'use strict';
 
-let gulp = require('gulp');
-let path = require('path');
 let build = require('@microsoft/web-library-build');
-let buildConfig = build.getConfig();
-
-let isProduction = process.argv.indexOf('--production') >= 0;
-let isClean = process.argv.indexOf('clean') >= 0;
-
-let rules = Object.assign(
-  {},
-  require('./node_modules/@microsoft/gulp-core-build-typescript/lib/defaultTslint.json').rules,
-  require('./node_modules/office-ui-fabric-react-tslint/tslint.json').rules,
-  require('./tslint.json').rules
-);
-build.tslint.setConfig({
-  lintConfig: { rules },
-  displayAsWarning: false
-});
-
-// Configure TypeScript.
-build.TypeScriptConfiguration.setTypescriptCompiler(require('typescript'));
-
-/** Disable webpack. */
-build.webpack.isEnabled = () => false;
+let gulp = require('gulp');
 
-/** Disable tests until we need them. */
-build.karma.isEnabled = () => false;
+// Short aliases for subtasks.
+build.task('webpack', build.webpack);
+build.task('sass', build.sass);
+build.task('karma', build.karma);
 
-let packageFolder = buildConfig.packageFolder || '';
-let distFolder = buildConfig.distFolder;
+// initialize tasks.
+build.initialize(gulp);
 
-if (isProduction || isClean) {
-  build.setConfig({
-    libAMDFolder: path.join(packageFolder, 'lib-amd')
-  });
-}
+// Always fail on test failures.
+build.karma.setConfig({
+  failBuildOnErrors: true
+});
 
 // Use css modules.
 build.sass.setConfig({
   useCSSModules: true,
   moduleExportName: ''
 });
-
-// initialize tasks.
-build.initialize(gulp);
diff --git a/packages/example-app-base/karma.config.js b/packages/example-app-base/karma.config.js
deleted file mode 100644
index 9fa51dae65351..0000000000000
--- a/packages/example-app-base/karma.config.js
+++ /dev/null
@@ -1,110 +0,0 @@
-'use strict';
-
-// Karma configuration
-// Generated on Thu Oct 08 2015 18:13:05 GMT-0700 (PDT)
-
-let path = require('path');
-let build = require('@microsoft/web-library-build');
-let buildConfig = build.getConfig();
-let configResources = build.karma.resources;
-let bindPolyfillPath = configResources.bindPolyfillPath;
-let debugRun = (process.argv.indexOf('--debug') > -1);
-
-module.exports = function (config) {
-  let karmaConfig = {
-
-    // base path that will be used to resolve all patterns (eg. files, exclude)
-    basePath: '.',
-
-    // frameworks to use
-    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
-    frameworks: ['mocha', 'sinon-chai'],
-
-
-    // list of files / patterns to load in the browser
-    files: [bindPolyfillPath].concat([path.join(buildConfig.libFolder, '**', '*.test.js')]),
-
-
-    // list of files to exclude
-    exclude: [],
-
-
-    // webpack config for bundling tests.
-    webpack: {
-      devtool: 'inline-source-map',
-      module: {
-        loaders: [
-          {
-            test: /sinon\.js$/,
-            loader: 'imports?define=>false'
-          }
-        ],
-        postLoaders: debugRun ? null : [{
-          test: /\.js/,
-          exclude: /(test|node_modules|bower_components)/,
-          loader: configResources.istanbulInstrumenterLoaderPath
-        }]
-      },
-      externals: {
-        'cheerio': 'window',
-        'react/addons': true,
-        'react/lib/ExecutionEnvironment': true,
-        'react/lib/ReactContext': true
-      },
-      resolve: {
-        modulesDirectories: [
-          '',
-          buildConfig.libFolder,
-          'node_modules'
-        ]
-      }
-    },
-
-    webpackMiddleware: {
-      noInfo: true
-    },
-
-    // preprocess matching files before serving them to the browser
-    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
-    preprocessors: {
-      [path.join(buildConfig.libFolder, '/**/*.js')]: ['webpack']
-    },
-
-    plugins: configResources.plugins.concat([
-    ]),
-
-    // test results reporter to use
-    // possible values: 'dots', 'progress'
-    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
-    reporters: ['mocha-clean', 'coverage'],
-
-
-    // web server port
-    port: 9876,
-
-
-    // enable / disable colors in the output (reporters and logs)
-    colors: true,
-
-
-    // level of logging
-    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
-    logLevel: config.LOG_INFO,
-
-
-    // enable / disable watching file and executing tests whenever any file changes
-    autoWatch: false,
-
-
-    // start these browsers
-    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
-    browsers: ['PhantomJS'],
-
-
-    // Continuous Integration mode
-    // if true, Karma captures browsers, runs the tests and exits
-    singleRun: true
-  };
-
-  config.set(karmaConfig);
-};
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 2dfffe9032408..4a967deda34f3 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -10,10 +10,9 @@
   },
   "license": "MIT",
   "scripts": {
-    "build": "gulp",
+    "build": "node ../../scripts/build.js",
     "clean": "gulp clean",
-    "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.serve.config.js --open",
-    "test": "gulp"
+    "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.serve.config.js --open"
   },
   "devDependencies": {
     "@microsoft/web-library-build": "^3.2.1",
diff --git a/packages/example-app-base/src/components/App/App.tsx b/packages/example-app-base/src/components/App/App.tsx
index 79644bcc263d1..048b718dc74cb 100644
--- a/packages/example-app-base/src/components/App/App.tsx
+++ b/packages/example-app-base/src/components/App/App.tsx
@@ -65,12 +65,15 @@ export class App extends React.Component<IAppProps, any> {
     }
 
     let navPanel = (
-      <Nav groups={ appDefinition.examplePages } onLinkClick={ this._onLinkClick } onRenderLink={ (link: INavLink) => ([
-        <span key={ 1 } className='Nav-linkText'>{ link.name }</span>,
-        (link.status !== undefined ?
-          <span key={ 2 } className={ 'Nav-linkFlair ' + 'is-state' + link.status } >{ ExampleStatus[link.status] }</span> :
-          null)
-      ]) }
+      <Nav
+        groups={ appDefinition.examplePages }
+        onLinkClick={ this._onLinkClick }
+        onRenderLink={ (link: INavLink) => ([
+          <span key={ 1 } className='Nav-linkText'>{ link.name }</span>,
+          (link.status !== undefined ?
+            <span key={ 2 } className={ 'Nav-linkFlair ' + 'is-state' + link.status } >{ ExampleStatus[link.status] }</span> :
+            null)
+        ]) }
       />
     );
 
@@ -102,7 +105,8 @@ export class App extends React.Component<IAppProps, any> {
             isOpen={ isMenuVisible }
             isLightDismiss={ true }
             type={ PanelType.smallFixedNear }
-            onDismiss={ this._onIsMenuVisibleChanged.bind(this, false) }>
+            onDismiss={ this._onIsMenuVisibleChanged.bind(this, false) }
+          >
             { navPanel }
           </Panel>
         ) : (null) }
diff --git a/packages/example-app-base/src/components/Header/Header.tsx b/packages/example-app-base/src/components/Header/Header.tsx
index 716d2bc1ea83c..7eadd8c05a740 100644
--- a/packages/example-app-base/src/components/Header/Header.tsx
+++ b/packages/example-app-base/src/components/Header/Header.tsx
@@ -89,7 +89,8 @@ export class Header extends React.Component<IHeaderProps, IHeaderState> {
             targetElement={ contextMenu.target }
             directionalHint={ DirectionalHint.bottomAutoEdge }
             gapSpace={ 5 }
-            onDismiss={ this._onDismiss } />
+            onDismiss={ this._onDismiss }
+          />
         ) : (null) }
       </div>
     );
diff --git a/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.tsx b/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.tsx
index 2f627c710630a..70909bd13f23b 100644
--- a/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.tsx
+++ b/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.tsx
@@ -42,12 +42,14 @@ export class PropertiesTableSet extends React.Component<IPropertiesTableSetProps
   }
 
   public renderEach() {
-    return this.state.properties.map((item: IProperty) =>
-      (<PropertiesTable
+    return this.state.properties.map((item: IProperty) => (
+      <PropertiesTable
         key={ item.propertyName }
         title={ item.name === ('I' + this.props.componentName) ? (this.props.componentName + ' class') : item.propertyName }
         properties={ item.property }
-        renderAsEnum={ item.propertyType === PropertyType.enum } />));
+        renderAsEnum={ item.propertyType === PropertyType.enum }
+      />
+    ));
   }
 
   public render() {
diff --git a/packages/example-app-base/src/utilities/createApp.tsx b/packages/example-app-base/src/utilities/createApp.tsx
index 7e3b4fefaeff0..a019c3a7c3650 100644
--- a/packages/example-app-base/src/utilities/createApp.tsx
+++ b/packages/example-app-base/src/utilities/createApp.tsx
@@ -1,3 +1,5 @@
+/* tslint:disable:jsx-no-lambda */
+
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
@@ -53,7 +55,7 @@ export function createApp(examples: ExampleGroup | ExampleGroup[], defaultRouteC
     ReactDOM.render(
       <Fabric>
         <Router>
-          <Route key='minimal' path='?minimal' component={ (props: any) => <div { ...props } /> }>
+          <Route key='minimal' path='?minimal' component={ _getComponent }>
             { routes }
           </Route>
           <Route key={ 'app' } component={ (props: any) => <App appDefinition={ appDefinition } { ...props } /> }>
@@ -83,6 +85,12 @@ export function createApp(examples: ExampleGroup | ExampleGroup[], defaultRouteC
   window.onunload = _onUnload;
 }
 
+function _getComponent(props: any): JSX.Element {
+  return (
+    <div { ...props } />
+  );
+}
+
 function _getDefinition(groups: ExampleGroup[]): IAppDefinition {
   return {
     appTitle: 'Fabric Examples',
diff --git a/packages/example-app-base/src/utilities/examplesOf.ts b/packages/example-app-base/src/utilities/examplesOf.ts
index ce1115a3a4c34..3f77b625043be 100644
--- a/packages/example-app-base/src/utilities/examplesOf.ts
+++ b/packages/example-app-base/src/utilities/examplesOf.ts
@@ -1,7 +1,3 @@
-/* tslint:disable:no-unused-imports */
-import * as React from 'react';
-/* tslint:enable:no-unused-imports */
-
 import { getId } from 'office-ui-fabric-react/lib/Utilities';
 
 export interface IExample {
diff --git a/packages/example-app-base/tslint.json b/packages/example-app-base/tslint.json
index 2e4dea2deb630..ad57de6cee22e 100644
--- a/packages/example-app-base/tslint.json
+++ b/packages/example-app-base/tslint.json
@@ -3,6 +3,8 @@
     "office-ui-fabric-react-tslint"
   ],
   "rules": {
+    "jsx-no-multiline-js": false,
+    "jsx-no-lambda": false,
     "max-line-length": [
       false,
       140
diff --git a/packages/experiments/gulpfile.js b/packages/experiments/gulpfile.js
index dffac944e5699..196c2a4dd3da6 100644
--- a/packages/experiments/gulpfile.js
+++ b/packages/experiments/gulpfile.js
@@ -1,76 +1,23 @@
 'use strict';
 
 let build = require('@microsoft/web-library-build');
-let serial = build.serial;
-let parallel = build.parallel;
-let buildConfig = build.getConfig();
 let gulp = require('gulp');
-let configFile = "./ftpconfig.json";
-let fs = require('fs');
-let path = require('path');
-let del = require('del');
-let gulpConnect = require('gulp-connect');
 
-let isProduction = process.argv.indexOf('--production') >= 0;
-let isNuke = process.argv.indexOf('nuke') >= 0;
-let {
-  libFolder,
-  distFolder,
-  packageFolder = ''
-} = buildConfig;
+// Short aliases for subtasks.
+build.task('webpack', build.webpack);
+build.task('sass', build.sass);
+build.task('karma', build.karma);
+
+// initialize tasks.
+build.initialize(gulp);
 
-// Configure custom lint overrides.
-let rules = Object.assign(
-  {},
-  require('./node_modules/@microsoft/gulp-core-build-typescript/lib/defaultTslint.json').rules,
-  require('./node_modules/office-ui-fabric-react-tslint/tslint.json').rules,
-  require('./tslint.json').rules
-);
-build.tslint.setConfig({
-  lintConfig: { rules },
-  displayAsWarning: false
+// Always fail on test failures.
+build.karma.setConfig({
+  failBuildOnErrors: true
 });
 
-// Configure TypeScript.
-// build.typescript.setConfig({ typescript: require('typescript') });
-build.TypeScriptConfiguration.setTypescriptCompiler(require('typescript'));
 // Use css modules.
 build.sass.setConfig({
   useCSSModules: true,
   moduleExportName: ''
 });
-
-// Disable unnecessary subtasks.
-build.preCopy.isEnabled = () => false;
-
-// Until typings work.
-//build.apiExtractor.isEnabled = () => false;
-
-// Copy fabric-core to dist to be published with fabric-react.
-build.postCopy.setConfig({
-  shouldFlatten: false,
-  copyTo: {
-    [path.join(distFolder, 'sass')]: [
-      'node_modules/office-ui-fabric-core/dist/sass/**/*.*'
-    ],
-    [path.join(distFolder, 'css')]: [
-      'node_modules/office-ui-fabric-core/dist/css/**/*.*'
-    ]
-  }
-});
-
-// Produce AMD bits in lib-amd on production builds.
-if (isProduction || isNuke) {
-  build.setConfig({
-    libAMDFolder: path.join(packageFolder, 'lib-amd')
-  });
-}
-
-// Short aliases for subtasks.
-build.task('webpack', build.webpack);
-build.task('tslint', build.tslint);
-build.task('ts', build.typescript);
-build.task('sass', build.sass);
-
-// initialize tasks.
-build.initialize(gulp);
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 4688eb4ac0198..86582abbce787 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -10,10 +10,9 @@
   },
   "license": "MIT",
   "scripts": {
-    "build": "gulp",
+    "build": "node ../../scripts/build.js",
     "clean": "gulp clean",
-    "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.serve.config.js --open",
-    "test": "gulp"
+    "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.serve.config.js --open"
   },
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
@@ -36,6 +35,7 @@
     "enzyme": "^2.7.0",
     "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
+    "es6-map": "^0.1.5",
     "git-rev": "0.2.1",
     "gulp": "~3.9.1",
     "gutil": "1.6.4",
diff --git a/packages/experiments/src/common/tests.js b/packages/experiments/src/common/tests.js
deleted file mode 100644
index 31923f7c58879..0000000000000
--- a/packages/experiments/src/common/tests.js
+++ /dev/null
@@ -1,15 +0,0 @@
-'use strict';
-
-/**
- * This is a test entry point to help karma-webpack find all tests in the project.
- **/
-
-// Before loading modules, treat errors and warnings as test failures.
-console.error = console.warn = function (warning) {
-  throw new Error(warning);
-}
-
-var context = require.context('..', true, /.+\.test\.js?$/);
-
-context.keys().forEach(context);
-module.exports = context;
\ No newline at end of file
diff --git a/packages/experiments/src/common/tests.ts b/packages/experiments/src/common/tests.ts
new file mode 100644
index 0000000000000..13fa7bc7d3b38
--- /dev/null
+++ b/packages/experiments/src/common/tests.ts
@@ -0,0 +1,17 @@
+// Polyfills
+import 'es6-weak-map/implement';
+import 'es6-map/implement';
+
+/**
+ * This is a test entry point to help karma-webpack find all tests in the project.
+ **/
+
+// Before loading modules, treat errors and warnings as test failures.
+console.error = console.warn = (warning: string) => {
+  throw new Error(warning);
+};
+
+const testContext = require.context('..', true, /.+\.test\.js?$/);
+
+testContext.keys().forEach(testContext);
+module.exports = testContext;
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.Props.ts b/packages/experiments/src/components/CommandBar/CommandBar.Props.ts
index 21b452825942a..1c95466649e19 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.Props.ts
+++ b/packages/experiments/src/components/CommandBar/CommandBar.Props.ts
@@ -1,3 +1,4 @@
+/* tslint:disable:no-unused-variable */
 import * as React from 'react';
 import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
 import { IButtonStyles } from 'office-ui-fabric-react/lib/Button';
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.tsx b/packages/experiments/src/components/CommandBar/CommandBar.tsx
index 19705f7f6b126..3a1ddc151752b 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBar.tsx
@@ -3,13 +3,11 @@ import {
   BaseComponent,
   css,
   getId,
-  autobind,
-  assign
+  autobind
 } from 'office-ui-fabric-react/lib/Utilities';
 import { ICommandBar, ICommandBarProps, ICommandBarItemProps } from './CommandBar.Props';
 import { CommandBarButton } from 'office-ui-fabric-react/lib/Button';
-import { OverflowSet } from 'office-ui-fabric-react/lib/OverflowSet';
-import { FocusZone } from 'office-ui-fabric-react/lib/FocusZone';
+import { OverflowSet, IOverflowSet } from 'office-ui-fabric-react/lib/OverflowSet';
 import { ResizeGroup } from 'office-ui-fabric-react/lib/ResizeGroup';
 import { TooltipHost } from 'office-ui-fabric-react/lib/Tooltip';
 import * as stylesImport from './CommandBar.scss';
@@ -48,9 +46,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, any> implements
     elipisisIconProps: { iconName: 'More' }
   };
 
-  public refs: {
-    overflowSet: OverflowSet
-  };
+  private _overflowSet: IOverflowSet;
 
   private _id: string;
 
@@ -83,23 +79,25 @@ export class CommandBar extends BaseComponent<ICommandBarProps, any> implements
 
     return (
       <ResizeGroup
+        className={ className }
         data={ commandBardata }
         onReduceData={ onReduceData }
         onGrowData={ onGrowData }
+        // tslint:disable-next-line:jsx-no-lambda
         onRenderData={ (data: ICommandBarData) => {
           return (
             <div className={ css('ms-CommandBar', styles.root) }>
 
               {/*Primary Items*/ }
               <OverflowSet
-                ref='overflowSet'
+                componentRef={ this._resolveRef('_overflowSet') }
                 className={ css(styles.primarySet) }
                 items={ data.primaryItems }
                 overflowItems={ data.overflowItems.length ? data.overflowItems : undefined }
                 onRenderItem={ this._onRenderItems }
                 onRenderOverflowButton={ (renderedOverflowItems: ICommandBarItemProps[]) => {
                   return (
-                    this._onRenderButton({
+                    onRenderButton({
                       key: 'oveflowButton',
                       styles: { ...buttonStyles, menuIcon: { fontSize: '17px' } },
                       ariaLabel: elipisisAriaLabel,
@@ -126,7 +124,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, any> implements
   }
 
   public focus() {
-    this.refs.overflowSet.focus();
+    this._overflowSet.focus();
   }
 
   private computeCacheKey(primaryItems: ICommandBarItemProps[], farItems: ICommandBarItemProps[], overflow: boolean): string {
diff --git a/packages/experiments/src/components/CommandBar/CommandBarPage.tsx b/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
index 4419cae34fc0b..eebdd9a439d02 100644
--- a/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
@@ -72,7 +72,8 @@ export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}>
         related={
           <a href='https://dev.office.com/fabric-js/Components/CommandBar/CommandBar.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/experiments/src/components/CommandBar/CommandBarPage.visualtest.tsx b/packages/experiments/src/components/CommandBar/CommandBarPage.visualtest.tsx
index ded60b395750a..f5013fc5d698f 100644
--- a/packages/experiments/src/components/CommandBar/CommandBarPage.visualtest.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBarPage.visualtest.tsx
@@ -1,38 +1,41 @@
+/* tslint:disable:jsx-ban-props */
 import { CommandBar } from './index';
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 export default class CommandBarVPage extends React.Component<any, any> {
   public render() {
-    return <div style={ { width: '600px' } }>
-      <CommandBar
-        className='CommandBar'
-        items={
-          [
-            {
-              key: 'new',
-              name: 'New',
-              icon: 'Add',
-              onClick: () => { return; },
-              items: [
-                {
-                  key: 'emailMessage',
-                  name: 'Email message',
-                  icon: 'Mail'
-                },
-                {
-                  key: 'calendarEvent',
-                  name: 'Calendar event',
-                  icon: 'Calendar'
-                }
-              ]
-            },
-            {
-              key: 'upload',
-              name: 'Upload',
-              icon: 'Upload'
-            }] }
-      />
-    </div>;
+    return (
+      <div style={ { width: '600px' } }>
+        <CommandBar
+          className='CommandBar'
+          items={
+            [
+              {
+                key: 'new',
+                name: 'New',
+                icon: 'Add',
+                onClick: () => { return; },
+                items: [
+                  {
+                    key: 'emailMessage',
+                    name: 'Email message',
+                    icon: 'Mail'
+                  },
+                  {
+                    key: 'calendarEvent',
+                    name: 'Calendar event',
+                    icon: 'Calendar'
+                  }
+                ]
+              },
+              {
+                key: 'upload',
+                name: 'Upload',
+                icon: 'Upload'
+              }] }
+        />
+      </div>
+    );
   }
 }
diff --git a/packages/experiments/src/components/Tile/Tile.tsx b/packages/experiments/src/components/Tile/Tile.tsx
index fdd6a837ffc89..d2184e1589139 100644
--- a/packages/experiments/src/components/Tile/Tile.tsx
+++ b/packages/experiments/src/components/Tile/Tile.tsx
@@ -131,7 +131,8 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
         data-is-focusable={ true }
         data-is-sub-focuszone={ true }
         data-selection-invoke={ (selectionIndex > -1) ? true : undefined }
-        data-selection-index={ (selectionIndex > -1) ? selectionIndex : undefined }>
+        data-selection-index={ (selectionIndex > -1) ? selectionIndex : undefined }
+      >
         {
           background ? this._onRenderBackground({
             background: background
@@ -180,15 +181,18 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
     return (
       <span
         role='presentation'
-        className={ css('ms-Tile-content', TileStyles.content) }>
+        className={ css('ms-Tile-content', TileStyles.content) }
+      >
         <span
           role='presentation'
-          className={ css('ms-Tile-foreground', TileStyles.foreground) }>
+          className={ css('ms-Tile-foreground', TileStyles.foreground) }
+        >
           <span
             role='presentation'
             className={ css('ms-Tile-frame', TileStyles.frame, {
               [`ms-Tile-frame--hasForegroundFrame ${TileStyles.hasForegroundFrame}`]: showForegroundFrame
-            }) }>
+            }) }
+          >
             { foreground }
           </span>
         </span>
@@ -205,12 +209,14 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
     }) {
     return (
       <span
-        className={ css('ms-Tile-nameplate', TileStyles.nameplate) }>
+        className={ css('ms-Tile-nameplate', TileStyles.nameplate) }
+      >
         {
           name ? (
             <span
               id={ this._nameId }
-              className={ css('ms-Tile-name', TileStyles.name) }>
+              className={ css('ms-Tile-name', TileStyles.name) }
+            >
               { name }
             </span>
           ) : null
@@ -219,7 +225,8 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
           activity ? (
             <span
               id={ this._activityId }
-              className={ css('ms-Tile-activity', TileStyles.activity) }>
+              className={ css('ms-Tile-activity', TileStyles.activity) }
+            >
               { activity }
             </span>
           ) : null
@@ -238,7 +245,8 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
         aria-label={ this.props.toggleSelectionAriaLabel }
         className={ css('ms-Tile-check', TileStyles.check) }
         data-selection-toggle={ true }
-        role='checkbox'>
+        role='checkbox'
+      >
         <Check
           checked={ isSelected }
         />
diff --git a/packages/experiments/src/components/Tile/TilePage.tsx b/packages/experiments/src/components/Tile/TilePage.tsx
index b16ae3b4241d8..b06cbcc5e624a 100644
--- a/packages/experiments/src/components/Tile/TilePage.tsx
+++ b/packages/experiments/src/components/Tile/TilePage.tsx
@@ -37,11 +37,10 @@ export class TilePage extends React.Component<IComponentDemoPageProps, {}> {
           />
         }
         overview={
-          <div>
-          </div>
+          <div />
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -57,8 +56,8 @@ export class TilePage extends React.Component<IComponentDemoPageProps, {}> {
             </ul>
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
-      </ComponentPage>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      />
     );
   }
 }
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
index c6a456b6a16c5..ec7cdd9c0d4bb 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
@@ -43,11 +43,14 @@ export class TileDocumentExample extends React.Component<any, any> {
               </SignalField>
             }
             foreground={
-              <img src={ `//placehold.it/40x40` } style={
-                {
-                  display: 'block'
+              <img
+                src={ `//placehold.it/40x40` }
+                style={
+                  {
+                    display: 'block'
+                  }
                 }
-              } />
+              />
             }
             showForegroundFrame={ true }
           />
@@ -73,11 +76,14 @@ export class TileDocumentExample extends React.Component<any, any> {
               </SignalField>
             }
             foreground={
-              <img src={ `//placehold.it/80x120` } style={
-                {
-                  display: 'block'
+              <img
+                src={ `//placehold.it/80x120` }
+                style={
+                  {
+                    display: 'block'
+                  }
                 }
-              } />
+              />
             }
             showForegroundFrame={ true }
           />
@@ -103,11 +109,14 @@ export class TileDocumentExample extends React.Component<any, any> {
               </SignalField>
             }
             foreground={
-              <img src={ `//placehold.it/168x96` } style={
-                {
-                  display: 'block'
+              <img
+                src={ `//placehold.it/168x96` }
+                style={
+                  {
+                    display: 'block'
+                  }
                 }
-              } />
+              />
             }
             showForegroundFrame={ true }
           />
@@ -125,12 +134,14 @@ export class TileDocumentExample extends React.Component<any, any> {
               </SignalField>
             }
             foreground={
-              <img src={ `//placehold.it/168x120` } style={
-                {
-                  display: 'block'
+              <img
+                src={ `//placehold.it/168x120` }
+                style={
+                  {
+                    display: 'block'
+                  }
                 }
-
-              } />
+              />
             }
             showForegroundFrame={ true }
           />
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
index 3541551d3e2e2..ced7fee347ed8 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
@@ -36,18 +36,21 @@ export class TileMediaExample extends React.Component<any, any> {
             itemActivity={
               <SignalField
                 before={
-                  [<Signal><Icon iconName='play' /></Signal>, <MentionSignal />]
+                  [<Signal key={ 0 }><Icon iconName='play' /></Signal>, <MentionSignal key={ 1 } />]
                 }
               >
                 { lorem(6) }
               </SignalField>
             }
             background={
-              <img src={ `//placehold.it/250x200` } style={
-                {
-                  display: 'block'
+              <img
+                src={ `//placehold.it/250x200` }
+                style={
+                  {
+                    display: 'block'
+                  }
                 }
-              } />
+              />
             }
             showBackgroundFrame={ true }
           />
@@ -74,11 +77,14 @@ export class TileMediaExample extends React.Component<any, any> {
               </SignalField>
             }
             background={
-              <img src={ `//placehold.it/175x200` } style={
-                {
-                  display: 'block'
+              <img
+                src={ `//placehold.it/175x200` }
+                style={
+                  {
+                    display: 'block'
+                  }
                 }
-              } />
+              />
             }
             showBackgroundFrame={ true }
           />
@@ -99,7 +105,10 @@ export class TileMediaExample extends React.Component<any, any> {
               (
                 <SignalField
                   before={
-                    [<Signal><Icon iconName='play' /></Signal>, <SharedSignal />]
+                    [
+                      <Signal key={ 0 }><Icon iconName='play' /></Signal>,
+                      <SharedSignal key={ 1 } />
+                    ]
                   }
                 >
                   { lorem(8) }
diff --git a/packages/experiments/src/components/TilesList/TilesList.tsx b/packages/experiments/src/components/TilesList/TilesList.tsx
index f6e6f5a4528a6..8726b5fb58dab 100644
--- a/packages/experiments/src/components/TilesList/TilesList.tsx
+++ b/packages/experiments/src/components/TilesList/TilesList.tsx
@@ -114,7 +114,8 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
           selection ?
             <SelectionZone
               selection={ selection }
-              selectionMode={ SelectionMode.multiple }>
+              selectionMode={ SelectionMode.multiple }
+            >
               { list }
             </SelectionZone> :
             list
@@ -126,7 +127,8 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
   private _onRenderCell(item: ITileCell<TItem>, finalSize: ITileSize) {
     if (item.grid.mode === TilesGridMode.none) {
       return (
-        <div className={ css(TilesListStyles.header) }
+        <div
+          className={ css(TilesListStyles.header) }
         >
           { item.onRender(item.content, { width: 0, height: 0 }) }
         </div>
@@ -253,7 +255,8 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
               marginTop: isOpenStart ? '0' : `${grid.marginTop - margin}px`,
               marginBottom: isOpenEnd ? '0' : `${grid.marginBottom - margin}px`
             }
-          }>
+          }
+        >
           { ...renderedCells }
         </div>
       );
diff --git a/packages/experiments/src/components/TilesList/TilesListPage.tsx b/packages/experiments/src/components/TilesList/TilesListPage.tsx
index 1da8b488d99f8..cd27272ddcc4f 100644
--- a/packages/experiments/src/components/TilesList/TilesListPage.tsx
+++ b/packages/experiments/src/components/TilesList/TilesListPage.tsx
@@ -70,7 +70,8 @@ export class TilesListPage extends React.Component<IComponentDemoPageProps, {}>
             </ul>
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
index 804d169c2f135..0673961289920 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
@@ -77,9 +77,12 @@ export class TilesListMediaExample extends React.Component<any, any> {
         selection={ this._selection }
         selectionIndex={ item.index }
         background={
-          <img style={ { display: 'block' } } src={
-            `//placehold.it/${Math.round(finalSize.width)}x${Math.round(finalSize.height)}`
-          } />
+          <img
+            style={ { display: 'block' } }
+            src={
+              `//placehold.it/${Math.round(finalSize.width)}x${Math.round(finalSize.height)}`
+            }
+          />
         }
         showBackgroundFrame={ true }
         itemName={ item.name }
diff --git a/packages/experiments/src/demo/GettingStartedPage.tsx b/packages/experiments/src/demo/GettingStartedPage.tsx
index d77576eaba971..d8d03d7617e43 100644
--- a/packages/experiments/src/demo/GettingStartedPage.tsx
+++ b/packages/experiments/src/demo/GettingStartedPage.tsx
@@ -1,13 +1,15 @@
+/* tslint:disable:jsx-no-multiline-js */
+
 import * as React from 'react';
 import { Link } from 'office-ui-fabric-react/lib/Link';
 import './GettingStartedPage.scss';
 import { Highlight } from '@uifabric/example-app-base';
 
 export class GettingStartedPage extends React.Component<any, any> {
+
   public render() {
     return (
       <div className='ms-GettingStartedPage'>
-
         <div className='ms-GettingStartedPage-banner'>
           <h1>Office UI Fabric React Experiments!</h1>
           <h3>A library of reusable, generic React components</h3>
diff --git a/packages/experiments/tsconfig.json b/packages/experiments/tsconfig.json
index 9dd90f46d52e1..8c9ef12253000 100644
--- a/packages/experiments/tsconfig.json
+++ b/packages/experiments/tsconfig.json
@@ -27,10 +27,7 @@
       ]
     }
   },
-  "exclude": [
-    "node_modules",
-    "dist",
-    "lib",
-    "lib-amd"
+  "include": [
+    "src"
   ]
 }
\ No newline at end of file
diff --git a/packages/experiments/tslint.json b/packages/experiments/tslint.json
index 972ff4be6f494..f98ceb211d85f 100644
--- a/packages/experiments/tslint.json
+++ b/packages/experiments/tslint.json
@@ -3,6 +3,10 @@
     "office-ui-fabric-react-tslint"
   ],
   "rules": {
+    "jsx-ban-props": false,
+    "jsx-self-close": false,
+    "no-unused-variable": false,
+    "jsx-no-multiline-js": false,
     "max-line-length": [
       false,
       140
diff --git a/packages/merge-styles/gulpfile.js b/packages/merge-styles/gulpfile.js
index 6b32bac66ed9b..8a0959526eaad 100644
--- a/packages/merge-styles/gulpfile.js
+++ b/packages/merge-styles/gulpfile.js
@@ -1,44 +1,17 @@
 'use strict';
 
 let gulp = require('gulp');
-let path = require('path');
 let build = require('@microsoft/web-library-build');
-let buildConfig = build.getConfig();
 
-let isProduction = process.argv.indexOf('--production') >= 0;
-let isClean = process.argv.indexOf('clean') >= 0;
+build.task('tslint', build.tslint);
+build.task('sass', build.sass);
+build.task('karma', build.karma);
+build.task('webpack', build.webpack);
 
 // initialize tasks.
 build.initialize(gulp);
 
-/* Configure lint rules */
-let rules = Object.assign(
-  {},
-  require('./node_modules/@microsoft/gulp-core-build-typescript/lib/defaultTslint.json').rules,
-  require('./node_modules/office-ui-fabric-react-tslint/tslint.json').rules,
-  require('./tslint.json').rules
-);
-build.tslint.setConfig({
-  lintConfig: { rules },
-  displayAsWarning: false
+// Always fail on test failures.
+build.karma.setConfig({
+  failBuildOnErrors: true
 });
-
-// Configure TypeScript.
-build.TypeScriptConfiguration.setTypescriptCompiler(require('typescript'));
-
-// Disable unnecessary steps.
-build.preCopy.isEnabled = () => false;
-build.postCopy.isEnabled = () => false;
-build.text.isEnabled = () => false;
-build.sass.isEnabled = () => false;
-
-let packageFolder = buildConfig.packageFolder || '';
-let distFolder = buildConfig.distFolder;
-
-if (isProduction || isClean) {
-  build.setConfig({
-    libAMDFolder: path.join(packageFolder, 'lib-amd')
-  });
-}
-
-build.task('tslint', build.tslint);
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index 5b413e8ab5c92..b52161b7f62d0 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -10,9 +10,8 @@
   },
   "license": "MIT",
   "scripts": {
-    "build": "gulp",
+    "build": "node ../../scripts/build.js",
     "clean": "gulp clean",
-    "test": "gulp",
     "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js"
   },
   "devDependencies": {
diff --git a/packages/merge-styles/src/common/tests.js b/packages/merge-styles/src/common/tests.js
deleted file mode 100644
index ec92b70032203..0000000000000
--- a/packages/merge-styles/src/common/tests.js
+++ /dev/null
@@ -1,22 +0,0 @@
-'use strict';
-
-
-/**
- * This is a test entry point to help karma-webpack find all tests in the project.
- **/
-
-// Polyfills
-require('es6-weak-map/implement');
-require('es6-map/implement');
-console.log('hi')
-// Before loading modules, treat errors and warnings as test failures.
-console.error = console.warn = function (warning) {
-  throw new Error(warning);
-}
-
-var context = require.context('..', true, /.+\.test\.js?$/);
-
-context.keys().forEach(context);
-
-
-module.exports = context;
diff --git a/packages/merge-styles/src/common/tests.ts b/packages/merge-styles/src/common/tests.ts
new file mode 100644
index 0000000000000..460f057cc9862
--- /dev/null
+++ b/packages/merge-styles/src/common/tests.ts
@@ -0,0 +1,16 @@
+// Polyfills
+import 'es6-map/implement';
+
+/**
+ * This is a test entry point to help karma-webpack find all tests in the project.
+ **/
+
+// Before loading modules, treat errors and warnings as test failures.
+console.error = console.warn = (warning: string) => {
+  throw new Error(warning);
+};
+
+const testContext = require.context('..', true, /.+\.test\.js?$/);
+
+testContext.keys().forEach(testContext);
+module.exports = testContext;
diff --git a/packages/merge-styles/tsconfig.json b/packages/merge-styles/tsconfig.json
index d8bc289af26e3..4b43fb784f7e2 100644
--- a/packages/merge-styles/tsconfig.json
+++ b/packages/merge-styles/tsconfig.json
@@ -16,7 +16,8 @@
     "moduleResolution": "node",
     "types": [
       "chai",
-      "mocha"
+      "mocha",
+      "webpack-env"
     ]
   },
   "exclude": [
diff --git a/packages/office-ui-fabric-react-tslint/package.json b/packages/office-ui-fabric-react-tslint/package.json
index ddd1ac5d9146b..5fb9fef220a95 100644
--- a/packages/office-ui-fabric-react-tslint/package.json
+++ b/packages/office-ui-fabric-react-tslint/package.json
@@ -8,6 +8,7 @@
     "build": "node -v"
   },
   "devDependencies": {
-    "@microsoft/gulp-core-build-typescript": "^3.3.1"
+    "@microsoft/gulp-core-build-typescript": "^3.3.1",
+    "tslint-react": "^3.2.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-tslint/tslint.json b/packages/office-ui-fabric-react-tslint/tslint.json
index c3f39049d2d72..5856052c78329 100644
--- a/packages/office-ui-fabric-react-tslint/tslint.json
+++ b/packages/office-ui-fabric-react-tslint/tslint.json
@@ -1,8 +1,27 @@
 {
   "extends": [
-    "@microsoft/gulp-core-build-typescript/lib/defaultTslint.json"
+    "@microsoft/gulp-core-build-typescript/lib/defaultTslint.json",
+    "tslint-react"
   ],
   "rules": {
+    "jsx-curly-spacing": {
+      "when": "always"
+    },
+    "jsx-no-bind": true,
+    "jsx-boolean-value": "never",
+    "jsx-equals-spacing": "never",
+    "jsx-key": true,
+    "jsx-no-lambda": true,
+    "jsx-self-close": true,
+    "jsx-wrap-multiline": true,
+    "jsx-no-string-ref": true,
+    "jsx-ban-props": [
+      true,
+      [
+        "style",
+        "Use className and provide css rules instead of using inline styles."
+      ]
+    ],
     "no-duplicate-variable": true,
     "use-isnan": true,
     "triple-equals": [
diff --git a/packages/office-ui-fabric-react/gulpfile.js b/packages/office-ui-fabric-react/gulpfile.js
index ef33ec3d05515..0a19a9842a919 100644
--- a/packages/office-ui-fabric-react/gulpfile.js
+++ b/packages/office-ui-fabric-react/gulpfile.js
@@ -19,64 +19,41 @@ let {
   packageFolder = ''
 } = buildConfig;
 
-let visualTestClean = build.subTask('visualTestClean', (gulp, options, done) => {
-  return del(['visualtests/results/*png']).then(() => done());
-});
-
-let visualTest = build.subTask('visualtest', (gulp, options, done) => {
-  gulpConnect.server({
-    port: 43210,
-    livereload: false,
-    directoryListing: false
-  });
-  if (!options.args['debug']) {
-    let matchFile = options.args['match'] || '';
-
-    let casperJs = require('gulp-phantomcss');
-    gulp.src(['lib/**/*' + matchFile + '.visualtest.js'])
-      .pipe(casperJs(
-        {
-          screenshots: 'visualtests/baseline',
-          comparisonResultRoot: 'visualtests/results'
-        })).on('end', done);
-  }
-});
+// let visualTestClean = build.subTask('visualTestClean', (gulp, options, done) => {
+//   return del(['visualtests/results/*png']).then(() => done());
+// });
+
+// let visualTest = build.subTask('visualtest', (gulp, options, done) => {
+//   gulpConnect.server({
+//     port: 43210,
+//     livereload: false,
+//     directoryListing: false
+//   });
+//   if (!options.args['debug']) {
+//     let matchFile = options.args['match'] || '';
+
+//     let casperJs = require('gulp-phantomcss');
+//     gulp.src(['lib/**/*' + matchFile + '.visualtest.js'])
+//       .pipe(casperJs(
+//         {
+//           screenshots: 'visualtests/baseline',
+//           comparisonResultRoot: 'visualtests/results'
+//         })).on('end', done);
+//   }
+// });
 
-// Configure custom lint overrides.
-let rules = Object.assign(
-  {},
-  require('./node_modules/@microsoft/gulp-core-build-typescript/lib/defaultTslint.json').rules,
-  require('./node_modules/office-ui-fabric-react-tslint/tslint.json').rules,
-  require('./tslint.json').rules
-);
-build.tslint.setConfig({
-  lintConfig: { rules },
-  displayAsWarning: false
-});
 
 // Always fail on test failures.
 build.karma.setConfig({
   failBuildOnErrors: true
 });
 
-// Configure TypeScript.
-build.TypeScriptConfiguration.setTypescriptCompiler(require('typescript'));
-
 // Use css modules.
 build.sass.setConfig({
   useCSSModules: true,
   moduleExportName: ''
 });
 
-// Use Karma Tests - Disable during develoment if prefered
-build.karma.isEnabled = () => true;
-
-// Disable unnecessary subtasks.
-build.postCopy.isEnabled = () => true;
-
-// Until typings work.
-//build.apiExtractor.isEnabled = () => false;
-
 // Copy fabric-core to dist to be published with fabric-react.
 build.preCopy.setConfig({
   shouldFlatten: false,
@@ -90,20 +67,14 @@ build.preCopy.setConfig({
   }
 });
 
-// Produce AMD bits in lib-amd on production builds.
-if (isProduction || isNuke) {
-  build.setConfig({
-    libAMDFolder: path.join(packageFolder, 'lib-amd')
-  });
-}
-
 // Short aliases for subtasks.
 build.task('webpack', build.webpack);
 build.task('tslint', build.tslint);
 build.task('ts', build.typescript);
-build.task('sass', build.sass);
+build.task('sass', build.serial(build.preCopy, build.sass));
+build.task('karma', build.karma);
 build.task('test', serial(build.sass, build.typescript, build.karma));
-build.task('visualtest', serial(build.sass, build.typescript, build.webpack, visualTestClean, visualTest));
+// build.task('visualtest', serial(build.sass, build.typescript, build.webpack, visualTestClean, visualTest));
 
 // initialize tasks.
 build.initialize(gulp);
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 8b436c406c815..aa137e7940a28 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -10,10 +10,9 @@
   },
   "license": "MIT",
   "scripts": {
-    "build": "gulp",
+    "build": "node ../../scripts/build.js",
     "clean": "gulp clean",
-    "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.serve.config.js --open",
-    "test": "gulp"
+    "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.serve.config.js --open"
   },
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
@@ -36,6 +35,7 @@
     "enzyme": "^2.7.0",
     "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
+    "es6-map": "^0.1.5",
     "git-rev": "0.2.1",
     "gulp": "~3.9.1",
     "gulp-phantomcss": "~0.3.0",
@@ -61,7 +61,6 @@
     "source-map-loader": "^0.2.1",
     "style-loader": "^0.17.0",
     "ts-loader": "^2.0.1",
-    "typescript": "2.4.2",
     "vinyl-ftp": "0.6.0",
     "webpack": "^3.4.1",
     "webpack-bundle-analyzer": "^2.2.1",
diff --git a/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx b/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx
index 9add3def31167..747f188fc1002 100644
--- a/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx
+++ b/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx
@@ -11,7 +11,7 @@ let _changedComponents: ConnectedHost[] | null;
 export interface IConnectedHostProps {
   componentRef?: () => void;
   componentProps: any;
-  storesToSubscribe: IStoreKey<any>[];
+  storesToSubscribe: IStoreKey[];
   component: any;
   getProps: (stores: any, props: any) => any;
 }
diff --git a/packages/office-ui-fabric-react/src/common/ISubscribable.ts b/packages/office-ui-fabric-react/src/common/ISubscribable.ts
index 9377581863524..92872b94ee44f 100644
--- a/packages/office-ui-fabric-react/src/common/ISubscribable.ts
+++ b/packages/office-ui-fabric-react/src/common/ISubscribable.ts
@@ -5,5 +5,5 @@ export interface IEmptyFunction {
 }
 
 export interface ISubscribable {
-  subscribe: (onChange: IEmptyFunction) => (IDisposable | IEmptyFunction);
+  subscribe: (onChange?: IEmptyFunction) => IDisposable;
 }
diff --git a/packages/office-ui-fabric-react/src/common/StoreSet.ts b/packages/office-ui-fabric-react/src/common/StoreSet.ts
index 9edc3bbe09a9c..da821ae6b3f4a 100644
--- a/packages/office-ui-fabric-react/src/common/StoreSet.ts
+++ b/packages/office-ui-fabric-react/src/common/StoreSet.ts
@@ -4,19 +4,19 @@ import { assign } from '../Utilities';
 
 export class StoreSet {
   private _stores: {
-    [ key: string]: any;
+    [key: string]: any;
   };
 
   constructor() {
     this._stores = {};
   }
 
-  public add<T extends ISubscribable>(key: IStoreKey<T>, value: T): StoreSet {
+  public add<T extends ISubscribable>(key: IStoreKey, value: T): StoreSet {
     this._stores[key.id] = value;
     return this;
   }
 
-  public getStore<T extends ISubscribable>(key: IStoreKey<T>): T {
+  public getStore<T extends ISubscribable>(key: IStoreKey): T {
     return this._stores[key.id];
   }
 
diff --git a/packages/office-ui-fabric-react/src/common/connect.test.tsx b/packages/office-ui-fabric-react/src/common/connect.test.tsx
index dce7d1beee73f..1c84dcdd14555 100644
--- a/packages/office-ui-fabric-react/src/common/connect.test.tsx
+++ b/packages/office-ui-fabric-react/src/common/connect.test.tsx
@@ -27,16 +27,6 @@ interface IHelloStore extends ISubscribable {
   say(message: string): void;
 }
 
-interface IAddStore extends ISubscribable {
-  result: number;
-
-  add(num1: number, num2: number): void;
-}
-
-class AddStore extends BaseStore implements ISubscribable {
-
-}
-
 class HelloStore extends BaseStore implements IHelloStore {
   public message: string = '';
 
@@ -48,8 +38,8 @@ class HelloStore extends BaseStore implements IHelloStore {
 
 describe('connect', () => {
   it('can observe store changes', (done) => {
-    let hello1 = storeKey<IHelloStore>('hello1');
-    let hello2 = storeKey<IHelloStore>('hello2');
+    let hello1 = storeKey('hello1');
+    let hello2 = storeKey('hello2');
     let localStores = new StoreSet()
       .add(hello1, new HelloStore())
       .add(hello2, new HelloStore());
@@ -72,11 +62,11 @@ describe('connect', () => {
 
     expect(rootElement.textContent).equals('');
 
-    localStores.getStore(hello1).say('hello');
+    localStores.getStore<IHelloStore>(hello1).say('hello');
     setTimeout(() => {
       try {
         expect(rootElement.textContent).equals('hello');
-        localStores.getStore(hello2).say(' world');
+        localStores.getStore<IHelloStore>(hello2).say(' world');
 
         setTimeout(() => {
           try {
@@ -91,7 +81,7 @@ describe('connect', () => {
   });
 
   it('can throw when requiring a store in an environment without any stores hosted', () => {
-    let hello = storeKey<IHelloStore>('hello');
+    let hello = storeKey('hello');
     let Connected = connect<ITestComponentProps, {}>(
       TestComponent,
       [hello],
@@ -111,7 +101,7 @@ describe('connect', () => {
   });
 
   it('can throw in an environment that does not contain the required store', () => {
-    let hello = storeKey<IHelloStore>('hello');
+    let hello = storeKey('hello');
     let Connected = connect<ITestComponentProps, {}>(
       TestComponent,
       [hello],
@@ -141,8 +131,8 @@ describe('connect', () => {
       return <div>hi</div>;
     };
 
-    let hello1 = storeKey<IHelloStore>('hello1');
-    let hello2 = storeKey<IHelloStore>('hello2');
+    let hello1 = storeKey('hello1');
+    let hello2 = storeKey('hello2');
     let localStores = new StoreSet()
       .add(hello1, new HelloStore())
       .add(hello2, new HelloStore());
@@ -166,8 +156,8 @@ describe('connect', () => {
     expect(renders).to.equal(1, 'render was not 1');
 
     // Cause 2 store changes. This should setImmediate and cause 1 resolve.
-    localStores.getStore(hello1).say('hello');
-    localStores.getStore(hello2).say(' world');
+    localStores.getStore<IHelloStore>(hello1).say('hello');
+    localStores.getStore<IHelloStore>(hello2).say(' world');
 
     setTimeout(() => {
       try {
diff --git a/packages/office-ui-fabric-react/src/common/connect.tsx b/packages/office-ui-fabric-react/src/common/connect.tsx
index 38e860666c47c..6a7204d6f4b90 100644
--- a/packages/office-ui-fabric-react/src/common/connect.tsx
+++ b/packages/office-ui-fabric-react/src/common/connect.tsx
@@ -4,7 +4,7 @@ import { IStoreKey } from './storeKey';
 
 export function connect<ORIGINAL_PROPS, NEW_PROPS>(
   component: React.ComponentClass<ORIGINAL_PROPS> | React.StatelessComponent<ORIGINAL_PROPS>,
-  storesToSubscribe: IStoreKey<any>[],
+  storesToSubscribe: IStoreKey[],
   getProps: (props: ORIGINAL_PROPS, ...stores: any[]) => NEW_PROPS
 ): React.StatelessComponent<NEW_PROPS> {
 
diff --git a/packages/office-ui-fabric-react/src/common/storeKey.ts b/packages/office-ui-fabric-react/src/common/storeKey.ts
index 51373feedb46d..4e07a7c63f9de 100644
--- a/packages/office-ui-fabric-react/src/common/storeKey.ts
+++ b/packages/office-ui-fabric-react/src/common/storeKey.ts
@@ -1,6 +1,6 @@
 import { getId } from '../Utilities';
 
-export interface IStoreKey<T> {
+export interface IStoreKey {
   name: string;
   id: string;
 }
@@ -28,4 +28,4 @@ export interface IStoreKey<T> {
  * to the selectionKey reference, and you will get TypeScript errors by referring to selection
  * member that aren't in that interface.
  */
-export const storeKey = <T>(name: string) => ({ name, id: getId(name) }) as IStoreKey<T>;
+export const storeKey = (name: string) => ({ name, id: getId(name) }) as IStoreKey;
diff --git a/packages/office-ui-fabric-react/src/common/tests.js b/packages/office-ui-fabric-react/src/common/tests.js
deleted file mode 100644
index 3a716c9dd52da..0000000000000
--- a/packages/office-ui-fabric-react/src/common/tests.js
+++ /dev/null
@@ -1,18 +0,0 @@
-'use strict';
-
-// Polyfills
-require('es6-weak-map/implement');
-
-/**
- * This is a test entry point to help karma-webpack find all tests in the project.
- **/
-
-// Before loading modules, treat errors and warnings as test failures.
-console.error = console.warn = function (warning) {
-  throw new Error(warning);
-}
-
-var context = require.context('..', true, /.+\.test\.js?$/);
-
-context.keys().forEach(context);
-module.exports = context;
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/common/tests.ts b/packages/office-ui-fabric-react/src/common/tests.ts
new file mode 100644
index 0000000000000..13fa7bc7d3b38
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/common/tests.ts
@@ -0,0 +1,17 @@
+// Polyfills
+import 'es6-weak-map/implement';
+import 'es6-map/implement';
+
+/**
+ * This is a test entry point to help karma-webpack find all tests in the project.
+ **/
+
+// Before loading modules, treat errors and warnings as test failures.
+console.error = console.warn = (warning: string) => {
+  throw new Error(warning);
+};
+
+const testContext = require.context('..', true, /.+\.test\.js?$/);
+
+testContext.keys().forEach(testContext);
+module.exports = testContext;
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 4eb1e6ff336af..b45b96bf1d417 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -932,7 +932,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       return -1;
     }
 
-    return findIndex(options, (option => (option.isSelected || option.selected || option.key === selectedKey)));
+    return findIndex(options, (option => (option.selected || option.key === selectedKey)));
   }
 
   /**
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index d3cc4b47646e4..28881e8fd474c 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -702,7 +702,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
 
       let pageBottom = pageTop + pageHeight - 1;
 
-      let isPageRendered = findIndex(this.state.pages as IPage[], (page) => page.items && page.startIndex === itemIndex) > -1;
+      let isPageRendered = findIndex(this.state.pages as IPage[], (page: IPage) => !!page.items && page.startIndex === itemIndex) > -1;
       let isPageInAllowedRange = !allowedRect || pageBottom >= allowedRect.top && pageTop <= allowedRect.bottom!;
       let isPageInRequiredRange = !this._requiredRect || pageBottom >= this._requiredRect!.top && pageTop <= this._requiredRect!.bottom!;
       let isPageVisible = !isFirstRender && (isPageInRequiredRange || (isPageInAllowedRange && isPageRendered)) || !shouldVirtualize;
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
index 3ce09df175b30..3443d232e02c9 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
@@ -10,10 +10,11 @@ import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { MarqueeSelection, Selection } from 'office-ui-fabric-react/lib/MarqueeSelection';
 import './MarqueeSelection.Basic.Example.scss';
 
-const PHOTOS = createArray(250, () => {
+const PHOTOS = createArray(250, (index: number) => {
   const randomWidth = 50 + Math.floor(Math.random() * 150);
 
   return {
+    key: index,
     url: `http://placehold.it/${randomWidth}x100`,
     width: randomWidth,
     height: 100
diff --git a/packages/office-ui-fabric-react/src/demo/GettingStartedPage.tsx b/packages/office-ui-fabric-react/src/demo/GettingStartedPage.tsx
index ac77b3ad399e7..2aeff4d2bd557 100644
--- a/packages/office-ui-fabric-react/src/demo/GettingStartedPage.tsx
+++ b/packages/office-ui-fabric-react/src/demo/GettingStartedPage.tsx
@@ -1,3 +1,5 @@
+/* tslint:disable:jsx-no-multiline-js */
+
 import * as React from 'react';
 import { Link } from 'office-ui-fabric-react/lib/Link';
 import './GettingStartedPage.scss';
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts b/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
index 55be785d3074a..6f3a3b08651a5 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
@@ -3,13 +3,13 @@ import { EventGroup } from '../../Utilities';
 
 export interface ISelectionOptions {
   onSelectionChanged?: () => void;
-  getKey?: (item: IObjectWithKey, index?: number) => string;
+  getKey?: (item: IObjectWithKey, index?: number) => string | number;
   canSelectItem?: (item: IObjectWithKey) => boolean;
 }
 
 export class Selection implements ISelection {
   public count: number;
-  public getKey: (item: IObjectWithKey, index?: number) => string;
+  public getKey: (item: IObjectWithKey, index?: number) => string | number;
   public canSelectItem: (item: IObjectWithKey) => boolean;
 
   private _changeEventSuppressionCount: number;
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/interfaces.ts b/packages/office-ui-fabric-react/src/utilities/selection/interfaces.ts
index 0996f2a3c542e..ab2c3df213c61 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/interfaces.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selection/interfaces.ts
@@ -1,5 +1,5 @@
 export interface IObjectWithKey {
-  key?: string;
+  key?: string | number;
 }
 
 export const SELECTION_CHANGE = 'change';
diff --git a/packages/office-ui-fabric-react/tslint.json b/packages/office-ui-fabric-react/tslint.json
index 366021e29b14f..2659ae28c7851 100644
--- a/packages/office-ui-fabric-react/tslint.json
+++ b/packages/office-ui-fabric-react/tslint.json
@@ -3,6 +3,18 @@
     "office-ui-fabric-react-tslint"
   ],
   "rules": {
+    "triple-equals": false,
+    "jsx-no-string-ref": false,
+    "jsx-key": false,
+    "jsx-boolean-value": false,
+    "no-unused-variable": false,
+    "jsx-no-bind": false,
+    "jsx-no-multiline-js": false,
+    "jsx-alignment": false,
+    "jsx-wrap-multiline": false,
+    "jsx-self-close": false,
+    "jsx-no-lambda": false,
+    "jsx-ban-props": false,
     "max-line-length": [
       false,
       140
diff --git a/packages/office-ui-fabric-react/webpack.config.js b/packages/office-ui-fabric-react/webpack.config.js
index 2a5df0d6b187b..8da3d58b8f788 100644
--- a/packages/office-ui-fabric-react/webpack.config.js
+++ b/packages/office-ui-fabric-react/webpack.config.js
@@ -1,5 +1,78 @@
+'use strict';
+
+/** Note: this require may need to be fixed to point to the build that exports the gulp-core-build-webpack instance. */
+let build = require('@microsoft/web-library-build');
+let webpackTaskResources = build.webpack.resources;
+let webpack = webpackTaskResources.webpack;
+let path = require('path');
+let buildConfig = build.getConfig();
+let BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
+
+const BUNDLE_NAME = 'office-ui-fabric-react';
+const BUNDLE_TEST = 'fabric-test';
+const IS_PRODUCTION = process.argv.indexOf('--production') > -1;
+
+// Create an array of configs, prepopulated with a debug (non-minified) build.
 let configs = [
-  require('./webpack.lib.config')
+  createConfig(false)
 ];
 
+// Create a production config if applicable.
+if (IS_PRODUCTION) {
+  configs.push(createConfig(true));
+}
+
+// Helper to create the config.
+function createConfig(isProduction) {
+  let webpackConfig = {
+
+    entry: {
+      [BUNDLE_TEST]: './lib/VisualTestRoot.js',
+      [BUNDLE_NAME]: './lib/index.js'
+    },
+
+    output: {
+      libraryTarget: 'var',
+      library: 'Fabric',
+      path: path.join(__dirname, buildConfig.distFolder),
+      publicPath: '/dist/',
+      filename: `[name]${isProduction ? '.min' : ''}.js`
+    },
+
+    devtool: 'source-map',
+
+    externals: [
+      {
+        'react': 'React',
+      },
+      {
+        'react-dom': 'ReactDOM'
+      }
+    ],
+
+    plugins: [
+      new BundleAnalyzerPlugin({
+        analyzerMode: 'static',
+        reportFilename: BUNDLE_NAME + '.stats.html',
+        openAnalyzer: false
+      })
+    ]
+  };
+
+  if (isProduction) {
+    webpackConfig.plugins.push(
+      new webpack.DefinePlugin({
+        'process.env.NODE_ENV': JSON.stringify('production')
+      }),
+      new webpack.optimize.UglifyJsPlugin({
+        minimize: true,
+        compress: {
+          warnings: false
+        }
+      }));
+  }
+
+  return webpackConfig;
+}
+
 module.exports = configs;
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/webpack.lib.config.js b/packages/office-ui-fabric-react/webpack.lib.config.js
deleted file mode 100644
index 8da3d58b8f788..0000000000000
--- a/packages/office-ui-fabric-react/webpack.lib.config.js
+++ /dev/null
@@ -1,78 +0,0 @@
-'use strict';
-
-/** Note: this require may need to be fixed to point to the build that exports the gulp-core-build-webpack instance. */
-let build = require('@microsoft/web-library-build');
-let webpackTaskResources = build.webpack.resources;
-let webpack = webpackTaskResources.webpack;
-let path = require('path');
-let buildConfig = build.getConfig();
-let BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
-
-const BUNDLE_NAME = 'office-ui-fabric-react';
-const BUNDLE_TEST = 'fabric-test';
-const IS_PRODUCTION = process.argv.indexOf('--production') > -1;
-
-// Create an array of configs, prepopulated with a debug (non-minified) build.
-let configs = [
-  createConfig(false)
-];
-
-// Create a production config if applicable.
-if (IS_PRODUCTION) {
-  configs.push(createConfig(true));
-}
-
-// Helper to create the config.
-function createConfig(isProduction) {
-  let webpackConfig = {
-
-    entry: {
-      [BUNDLE_TEST]: './lib/VisualTestRoot.js',
-      [BUNDLE_NAME]: './lib/index.js'
-    },
-
-    output: {
-      libraryTarget: 'var',
-      library: 'Fabric',
-      path: path.join(__dirname, buildConfig.distFolder),
-      publicPath: '/dist/',
-      filename: `[name]${isProduction ? '.min' : ''}.js`
-    },
-
-    devtool: 'source-map',
-
-    externals: [
-      {
-        'react': 'React',
-      },
-      {
-        'react-dom': 'ReactDOM'
-      }
-    ],
-
-    plugins: [
-      new BundleAnalyzerPlugin({
-        analyzerMode: 'static',
-        reportFilename: BUNDLE_NAME + '.stats.html',
-        openAnalyzer: false
-      })
-    ]
-  };
-
-  if (isProduction) {
-    webpackConfig.plugins.push(
-      new webpack.DefinePlugin({
-        'process.env.NODE_ENV': JSON.stringify('production')
-      }),
-      new webpack.optimize.UglifyJsPlugin({
-        minimize: true,
-        compress: {
-          warnings: false
-        }
-      }));
-  }
-
-  return webpackConfig;
-}
-
-module.exports = configs;
\ No newline at end of file
diff --git a/packages/styling/gulpfile.js b/packages/styling/gulpfile.js
index c4d5fefcb3943..d5c333c7cdb4c 100644
--- a/packages/styling/gulpfile.js
+++ b/packages/styling/gulpfile.js
@@ -1,45 +1,21 @@
 'use strict';
 
-let build = require('@microsoft/sp-build-web');
-let path = require('path');
 let gulp = require('gulp');
-let buildConfig = build.getConfig();
+let build = require('@microsoft/web-library-build');
 
-let isProduction = process.argv.indexOf('--production') >= 0;
-let isClean = process.argv.indexOf('clean') >= 0;
+build.task('sass', build.sass);
+build.task('karma', build.karma);
 
 // initialize tasks.
 build.initialize(gulp);
 
-// Configure TypeScript
-build.TypeScriptConfiguration.setTypescriptCompiler(require('typescript'));
-
-// Configure custom lint overrides.
-let rules = Object.assign(
-  {},
-  require('@microsoft/gulp-core-build-typescript/lib/defaultTslint.json').rules,
-  require('./node_modules/office-ui-fabric-react-tslint/tslint.json').rules,
-  require('./tslint.json').rules
-);
-build.tslint.setConfig({
-  lintConfig: { rules },
-  displayAsWarning: false
+// Always fail on test failures.
+build.karma.setConfig({
+  failBuildOnErrors: true
 });
 
-// Disable all unnecessary tasks.
-build.sass.isEnabled = () => false;
-build.karma.isEnabled = () => false;
-build.text.isEnabled = () => false;
-build.preCopy.isEnabled = () => false;
-
-let packageFolder = buildConfig.packageFolder || '';
-let distFolder = buildConfig.distFolder;
-
-if (isProduction || isClean) {
-  build.setConfig({
-    libAMDFolder: path.join(packageFolder, 'lib-amd')
-  });
-}
-
-// Until typings work.
-build.apiExtractor.isEnabled = () => false;
+// Use css modules.
+build.sass.setConfig({
+  useCSSModules: true,
+  moduleExportName: ''
+});
diff --git a/packages/styling/package.json b/packages/styling/package.json
index b708c2b2cf490..0726a7062f9cc 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -7,7 +7,7 @@
   "scripts": {
     "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.serve.config.js --open",
     "clean": "gulp clean",
-    "build": "gulp"
+    "build": "node ../../scripts/build.js"
   },
   "devDependencies": {
     "@microsoft/sp-build-web": "^1.1.0",
@@ -25,6 +25,7 @@
     "enzyme": "^2.7.0",
     "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
+    "es6-map": "^0.1.5",
     "gulp": "~3.9.1",
     "mocha": "^3.2.0",
     "mocha-loader": "^1.1.1",
diff --git a/packages/styling/src/common/tests.js b/packages/styling/src/common/tests.js
deleted file mode 100644
index 3a716c9dd52da..0000000000000
--- a/packages/styling/src/common/tests.js
+++ /dev/null
@@ -1,18 +0,0 @@
-'use strict';
-
-// Polyfills
-require('es6-weak-map/implement');
-
-/**
- * This is a test entry point to help karma-webpack find all tests in the project.
- **/
-
-// Before loading modules, treat errors and warnings as test failures.
-console.error = console.warn = function (warning) {
-  throw new Error(warning);
-}
-
-var context = require.context('..', true, /.+\.test\.js?$/);
-
-context.keys().forEach(context);
-module.exports = context;
\ No newline at end of file
diff --git a/packages/styling/src/common/tests.ts b/packages/styling/src/common/tests.ts
new file mode 100644
index 0000000000000..13fa7bc7d3b38
--- /dev/null
+++ b/packages/styling/src/common/tests.ts
@@ -0,0 +1,17 @@
+// Polyfills
+import 'es6-weak-map/implement';
+import 'es6-map/implement';
+
+/**
+ * This is a test entry point to help karma-webpack find all tests in the project.
+ **/
+
+// Before loading modules, treat errors and warnings as test failures.
+console.error = console.warn = (warning: string) => {
+  throw new Error(warning);
+};
+
+const testContext = require.context('..', true, /.+\.test\.js?$/);
+
+testContext.keys().forEach(testContext);
+module.exports = testContext;
diff --git a/packages/styling/webpack.config.js b/packages/styling/webpack.config.js
deleted file mode 100644
index f62169121828f..0000000000000
--- a/packages/styling/webpack.config.js
+++ /dev/null
@@ -1,63 +0,0 @@
-const path = require('path');
-const webpack = require('webpack');
-const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
-const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
-
-const BUNDLE_NAME = 'fabric.styling';
-
-module.exports = {
-  entry: './src/index.ts',
-
-  output: {
-    path: path.resolve(__dirname, 'dist'),
-    filename: BUNDLE_NAME + '.js',
-  },
-
-  resolve: {
-    alias: {
-      '@uifabric/styling': path.join(__dirname, 'src')
-    },
-    extensions: ['.js', '.ts', '.tsx']
-  },
-
-  devtool: 'source-map',
-
-  devServer: {
-    inline: true,
-    port: 4322
-  },
-
-  module: {
-    loaders: [
-      {
-        test: /\.tsx?$/,
-        loader: 'ts-loader',
-        exclude: [
-          /node_modules/
-        ]
-      }
-    ]
-  },
-
-  plugins: [
-    new webpack.DefinePlugin({
-      'process.env.NODE_ENV': JSON.stringify('production')
-    }),
-    new UglifyJSPlugin({
-      minimize: true,
-      compress: {
-        warnings: false
-      }
-    }),
-    new BundleAnalyzerPlugin({
-      analyzerMode: 'static',
-      reportFilename: BUNDLE_NAME + '.stats.html',
-      openAnalyzer: false,
-      generateStatsFile: true,
-      statsFilename: BUNDLE_NAME + '.stats.json'
-    }),
-    new webpack.ProvidePlugin({
-      __extends: path.join(__dirname, './src', 'extends.ts')
-    })
-  ]
-}
diff --git a/packages/styling/webpack.serve.config.js b/packages/styling/webpack.serve.config.js
deleted file mode 100644
index 19fb33194a934..0000000000000
--- a/packages/styling/webpack.serve.config.js
+++ /dev/null
@@ -1,52 +0,0 @@
-const path = require('path');
-const WebpackNotifierPlugin = require('webpack-notifier');
-const DefinePlugin = require('webpack').DefinePlugin;
-
-const PACKAGE_NAME = require('./package.json').name;
-
-module.exports = {
-  entry: './src/index.demo.tsx',
-
-  output: {
-    path: path.resolve(__dirname, 'dist'),
-    filename: 'demo.js',
-  },
-
-  externals: {
-    'react': 'React',
-    'react-dom': 'ReactDOM'
-  },
-
-  resolve: {
-    alias: {
-      '@uifabric/styling': path.join(__dirname, 'src')
-    },
-    extensions: ['.js', '.ts', '.tsx']
-  },
-
-  devtool: 'source-map',
-
-  devServer: {
-    inline: true,
-    port: 4322
-  },
-
-  module: {
-    loaders: [
-      {
-        test: /\.tsx?$/,
-        loader: 'ts-loader',
-        exclude: [
-          /node_modules/
-        ]
-      }
-    ]
-  },
-
-  plugins: [
-    new WebpackNotifierPlugin(),
-    new DefinePlugin({
-      'process.env.NODE_ENV': JSON.stringify('production')
-    })
-  ]
-}
diff --git a/packages/utilities/gulpfile.js b/packages/utilities/gulpfile.js
index 1269d7dbefe1d..2057829cb8bac 100644
--- a/packages/utilities/gulpfile.js
+++ b/packages/utilities/gulpfile.js
@@ -1,52 +1,20 @@
 'use strict';
 
 let gulp = require('gulp');
-let path = require('path');
 let build = require('@microsoft/web-library-build');
-let buildConfig = build.getConfig();
 
-let isProduction = process.argv.indexOf('--production') >= 0;
-let isClean = process.argv.indexOf('clean') >= 0;
-
-build.task('test', build.serial(build.typescript, build.karma));
-build.task('tslint', build.tslint);
+build.task('sass', build.sass);
+build.task('karma', build.karma);
 
 // initialize tasks.
 build.initialize(gulp);
 
-/* Configure lint rules */
-let rules = Object.assign(
-  {},
-  require('./node_modules/@microsoft/gulp-core-build-typescript/lib/defaultTslint.json').rules,
-  require('./node_modules/office-ui-fabric-react-tslint/tslint.json').rules,
-  require('./tslint.json').rules
-);
-
-build.tslint.setConfig({
-  lintConfig: { rules },
-  displayAsWarning: false
-});
-
 // Always fail on test failures.
 build.karma.setConfig({
   failBuildOnErrors: true
 });
 
-// Configure TypeScript.
-build.TypeScriptConfiguration.setTypescriptCompiler(require('typescript'));
-
 // Use css modules.
-build.sass.setConfig({ useCSSModules: true });
-
-/** Disable webpack. */
-build.webpack.isEnabled = () => false;
-
-let packageFolder = buildConfig.packageFolder || '';
-let distFolder = buildConfig.distFolder;
-
-if (isProduction || isClean) {
-  build.setConfig({
-    libAMDFolder: path.join(packageFolder, 'lib-amd')
-  });
-}
-
+build.sass.setConfig({
+  useCSSModules: true
+});
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index c5188cc54fa55..7fab892b08417 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -10,10 +10,9 @@
   },
   "license": "MIT",
   "scripts": {
-    "build": "gulp",
-    "clean": "gulp clean",
-    "test": "gulp",
-    "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js"
+    "tslint": "node ../../scripts/tslint.js",
+    "build": "node ../../scripts/build.js",
+    "clean": "gulp clean"
   },
   "devDependencies": {
     "@microsoft/web-library-build": "^3.2.1",
@@ -31,6 +30,7 @@
     "enzyme": "^2.7.0",
     "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
+    "es6-map": "^0.1.5",
     "gulp": "~3.9.1",
     "mocha": "^3.3.0",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
diff --git a/packages/utilities/src/array.ts b/packages/utilities/src/array.ts
index 812d8d2f0170b..4d489df1739eb 100644
--- a/packages/utilities/src/array.ts
+++ b/packages/utilities/src/array.ts
@@ -6,7 +6,7 @@
  * @param array - Array to search.
  * @param cb - Callback which returns true on matches.
  */
-export function findIndex(array: any[], cb: (item: any, index?: number) => boolean): number {
+export function findIndex<T>(array: T[], cb: (item: T, index?: number) => boolean): number {
   let index = -1;
 
   for (let i = 0; array && i < array.length; i++) {
@@ -26,14 +26,14 @@ export function findIndex(array: any[], cb: (item: any, index?: number) => boole
  * @param size - Size of array.
  * @param getItem - Callback to populate given cell index.
  */
-export function createArray(size: number, getItem?: (index?: number) => any): any[] {
-  let array = [];
+export function createArray<T>(size: number, getItem?: (index?: number) => T): T[] {
+  let array: (T | null)[] = [];
 
   for (let i = 0; i < size; i++) {
     array.push(getItem ? getItem(i) : null);
   }
 
-  return array;
+  return array as T[];
 }
 
 /**
@@ -46,7 +46,7 @@ export function createArray(size: number, getItem?: (index?: number) => any): an
  * @returns {any[][]} - A matrix of items
  */
 export function toMatrix<T>(items: T[], columnCount: number): T[][] {
-  return items.reduce((rows, currentValue, index) => {
+  return items.reduce((rows: T[][], currentValue: T, index: number) => {
     if (index % columnCount === 0) {
       rows.push([currentValue]);
     } else {
diff --git a/packages/utilities/src/autobind.test.ts b/packages/utilities/src/autobind.test.ts
index a12a74bab561b..e9a68bd19a108 100644
--- a/packages/utilities/src/autobind.test.ts
+++ b/packages/utilities/src/autobind.test.ts
@@ -1,4 +1,4 @@
-let { expect, should } = chai;
+let { expect } = chai;
 import { autobind } from './autobind';
 
 class Greeter {
diff --git a/packages/utilities/src/common/tests.js b/packages/utilities/src/common/tests.js
deleted file mode 100644
index f2ee7d9123445..0000000000000
--- a/packages/utilities/src/common/tests.js
+++ /dev/null
@@ -1,15 +0,0 @@
-'use strict';
-
-/**
- * This is a test entry point to help karma-webpack find all tests in the project.
- **/
-
-// Before loading modules, treat errors and warnings as test failures.
-console.error = console.warn = function (warning) {
-  throw new Error(warning);
-}
-
-var context = require.context('..', true, /.+\.test\.js?$/);
-
-context.keys().forEach(context);
-module.exports = context;
diff --git a/packages/utilities/src/common/tests.ts b/packages/utilities/src/common/tests.ts
new file mode 100644
index 0000000000000..13fa7bc7d3b38
--- /dev/null
+++ b/packages/utilities/src/common/tests.ts
@@ -0,0 +1,17 @@
+// Polyfills
+import 'es6-weak-map/implement';
+import 'es6-map/implement';
+
+/**
+ * This is a test entry point to help karma-webpack find all tests in the project.
+ **/
+
+// Before loading modules, treat errors and warnings as test failures.
+console.error = console.warn = (warning: string) => {
+  throw new Error(warning);
+};
+
+const testContext = require.context('..', true, /.+\.test\.js?$/);
+
+testContext.keys().forEach(testContext);
+module.exports = testContext;
diff --git a/packages/utilities/src/customizable.tsx b/packages/utilities/src/customizable.tsx
index 1a5ddff83be60..07b516db6261b 100644
--- a/packages/utilities/src/customizable.tsx
+++ b/packages/utilities/src/customizable.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import * as PropTypes from 'prop-types';
 import { GlobalSettings, IChangeDescription } from './GlobalSettings';
 
-export function customizable<P>(fields: string[]) {
+export function customizable(fields: string[]) {
   // tslint:disable-next-line:no-shadowed-variable
   return function customizableFactory<P, S>(
     ComposedComponent: (new (props: P, ...args: any[]) => React.Component<P, S>)
diff --git a/packages/utilities/src/focus.test.tsx b/packages/utilities/src/focus.test.tsx
index 3d60e27f07190..7f1b9487da876 100644
--- a/packages/utilities/src/focus.test.tsx
+++ b/packages/utilities/src/focus.test.tsx
@@ -21,17 +21,17 @@ function renderIntoDocument(element: React.ReactElement<any>): HTMLElement {
 function _initialize() {
   _hiddenElement = renderIntoDocument(
     <div data-is-visible={ false }>
-      <button></button>
+      <button />
     </div>
   ) as HTMLElement;
   _visibleElement = renderIntoDocument(
     <div data-is-visible={ true }>
-      <button></button>
+      <button />
     </div>
   ) as HTMLElement;
   _element = renderIntoDocument(
     <div>
-      <button></button>
+      <button />
     </div>
   ) as HTMLElement;
   (_element as any).isVisible = true;
diff --git a/packages/utilities/src/initials.ts b/packages/utilities/src/initials.ts
index 5d20fb2dab328..f85a2704637ea 100644
--- a/packages/utilities/src/initials.ts
+++ b/packages/utilities/src/initials.ts
@@ -55,7 +55,7 @@ function cleanupDisplayName(displayName: string): string {
  * @public
  */
 export function getInitials(displayName: string | undefined | null, isRtl: boolean): string {
-  if (displayName == null) {
+  if (!displayName) {
     return '';
   }
 
diff --git a/packages/utilities/tsconfig.json b/packages/utilities/tsconfig.json
index fb6d04adec19b..1623e98fb4227 100644
--- a/packages/utilities/tsconfig.json
+++ b/packages/utilities/tsconfig.json
@@ -17,7 +17,8 @@
     "moduleResolution": "node",
     "types": [
       "chai",
-      "mocha"
+      "mocha",
+      "webpack-env"
     ]
   },
   "exclude": [
diff --git a/rush.json b/rush.json
index d28eb68b4c6b6..5754358787356 100644
--- a/rush.json
+++ b/rush.json
@@ -1,10 +1,15 @@
 {
   "npmVersion": "5.0.3",
-  "rushMinimumVersion": "3.0.11",
+  "rushMinimumVersion": "3.0.12",
   "nodeSupportedVersionRange": ">=6.9.0 <9.0.0",
   "projectFolderMinDepth": 1,
   "projectFolderMaxDepth": 999,
   "projects": [
+    {
+      "packageName": "@uifabric/build",
+      "projectFolder": "scripts",
+      "shouldPublish": false
+    },
     {
       "packageName": "office-ui-fabric-react",
       "projectFolder": "packages/office-ui-fabric-react",
diff --git a/scripts/build.js b/scripts/build.js
new file mode 100644
index 0000000000000..cf2569d20db76
--- /dev/null
+++ b/scripts/build.js
@@ -0,0 +1,13 @@
+const isProduction = process.argv.indexOf('--production') > -1;
+
+if (process.argv.length >= 3 && process.argv[2].indexOf('--') === -1) {
+  require('./tasks/' + process.argv[2])({ isProduction });
+} else {
+  [
+    'sass',
+    'tslint',
+    'ts',
+    'karma',
+    'webpack'
+  ].forEach(task => require('./tasks/' + task)({ isProduction }));
+}
diff --git a/scripts/exec-sync.js b/scripts/exec-sync.js
new file mode 100644
index 0000000000000..4ca203d79e513
--- /dev/null
+++ b/scripts/exec-sync.js
@@ -0,0 +1,56 @@
+const path = require('path');
+const execSync = require('child_process').execSync;
+const chalk = require('chalk');
+
+const SEPARATOR = process.platform === 'win32' ? ';' : ':',
+  env = Object.assign({}, process.env);
+
+env.PATH = path.resolve('./node_modules/.bin') + SEPARATOR + env.PATH;
+
+function myExecSync(cmd, displayName) {
+  let returnValue = 0;
+  let start = new Date().getTime();
+
+  console.log(
+    `${
+    chalk.white('[') + chalk.gray(new Date().toLocaleTimeString({ hour12: false })) + chalk.white('] Starting:')
+    } ${
+    chalk.cyan(displayName || cmd)
+    }`);
+
+  try {
+    const output = execSync(cmd, {
+      cwd: process.cwd(),
+      env: env,
+      stdio: 'inherit'
+    });
+  } catch (ex) {
+    returnValue = ex.status;
+  }
+
+  console.log(
+    `${
+    chalk.white('[') + chalk.gray(new Date().toLocaleTimeString({ hour12: false })) + chalk.white('] Ending:')
+    } ${
+    chalk.white('(') + (returnValue !== 0 ? chalk.red('Error') : chalk.green('Pass')) + chalk.white(') ') +
+    chalk.cyan(displayName || cmd) +
+    chalk.white(' (') + chalk.yellow(formatTime(new Date().getTime() - start)) + chalk.white(')')
+    }`);
+
+  if (returnValue !== 0) {
+    console.error(`The task "${chalk.cyan(displayName || cmd)}" failed.`);
+    process.exit(returnValue);
+  }
+
+  return returnValue;
+}
+
+function formatTime(milliseconds) {
+  if (milliseconds >= 1000) {
+    return (milliseconds / 1000) + 's';
+  } else {
+    return milliseconds + 'ms';
+  }
+}
+
+module.exports = myExecSync;
diff --git a/scripts/package.json b/scripts/package.json
new file mode 100644
index 0000000000000..c9e315b101608
--- /dev/null
+++ b/scripts/package.json
@@ -0,0 +1,18 @@
+{
+  "name": "@uifabric/build",
+  "version": "1.0.0",
+  "private": true,
+  "scripts": {
+    "clean": "",
+    "build": "node -v"
+  },
+  "devDependencies": {
+    "chalk": "^2.1.0",
+    "github": "^7.0.0",
+    "gulp": "^3.9.1",
+    "tslint": "^5.6.0",
+    "tslint-microsoft-contrib": "^5.0.1",
+    "typescript": "2.4.2",
+    "yargs": "^6.5.0"
+  }
+}
\ No newline at end of file
diff --git a/scripts/selective-build.js b/scripts/selective-build.js
deleted file mode 100644
index 9e20aefd82f13..0000000000000
--- a/scripts/selective-build.js
+++ /dev/null
@@ -1,111 +0,0 @@
-// Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license.
-// See LICENSE in the project root for license information.
-
-const child_process = require('child_process');
-const fs = require('fs');
-const path = require('path');
-const rushPackages = JSON.parse(fs.readFileSync('rush.json', 'utf8'));
-
-const excludedFolders = [
-  path.resolve('common/changes'),
-  path.resolve('scripts')
-];
-
-/**
- * Tests if the folder path falls under any of the excluded folders.
- */
-function isExcluded(folderPath) {
-  for (let exclude of excludedFolders) {
-    if (folderPath.indexOf(exclude) === 0) {
-      return true;
-    }
-  }
-
-  return false;
-}
-
-/**
- * Gets changed packages.
- * @returns null if nothing changed, empty array if everything changed, or specific project names if some changed.
- */
-function getChangedPackages(targetBranch) {
-  let changedPackages = [];
-
-  let changedFiles = child_process.execSync(`git diff --name-only ${targetBranch}`)
-    .toString()
-    .trim()
-    .split('\n');
-
-  for (let filename of changedFiles) {
-    let changedPath = path.dirname(path.resolve(filename));
-    console.log(changedPath);
-
-    if (isExcluded(changedPath)) {
-      console.log('excluding')
-    } else {
-      let packageName = getPackageName(changedPath);
-
-      if (!packageName) {
-        return [];
-      }
-      if (changedPackages.indexOf(packageName) < 0) {
-        changedPackages.push(packageName);
-      }
-    }
-  }
-
-  return changedPackages.length ? changedPackages : undefined;
-}
-
-function cleanPackageDeps() {
-  rushPackages.projects.forEach(project => {
-    const depFile = path.join(project.projectFolder, 'package-deps.json');
-
-    if (fs.existsSync(depFile)) {
-      console.log(`Removing ${depFile}`);
-      fs.unlinkSync(depFile);
-    }
-  });
-}
-
-function getPackageName(changedFilePath) {
-  if (changedFilePath) {
-    console.log(`looking up; ${changedFilePath}`);
-    for (let project of rushPackages.projects) {
-      let projectPath = path.resolve(project.projectFolder);
-
-      if (changedFilePath.indexOf(projectPath) === 0) {
-        console.log(`found ${project.packageName}`);
-        return project.packageName;
-      }
-    }
-  }
-  console.log(`not found`)
-  return undefined;
-}
-
-cleanPackageDeps();
-
-const defaultSourceBranch = 'origin/master';
-const defaultRushParams = '--vso -p 4 --verbose';
-const rushLocation = 'node_modules/@microsoft/rush/bin/rush';
-
-let changedPackages = getChangedPackages(defaultSourceBranch);
-
-if (changedPackages) {
-  if (changedPackages.length === 0) {
-    /* Build all. */
-    console.log('Rebuilding all due to unrecognized updates.');
-    child_process.execSync(`node ${rushLocation} rebuild ${defaultRushParams}`, { stdio: [0, 1, 2] });
-  } else {
-    /* Build specifics. */
-    console.log('Building specific packages with detected changes.');
-    changedPackages.forEach(packageName => {
-      const buildCommand = `node ${rushLocation} build --from ${packageName} --to ${packageName} ${defaultRushParams}`;
-      console.log(`Running: ${buildCommand}`);
-      child_process.execSync(buildCommand, { stdio: [0, 1, 2] });
-    });
-  }
-} else {
-  console.log('No packages have been modified.');
-}
diff --git a/scripts/tasks/karma.js b/scripts/tasks/karma.js
new file mode 100644
index 0000000000000..dbc29b5c00f28
--- /dev/null
+++ b/scripts/tasks/karma.js
@@ -0,0 +1,11 @@
+module.exports = function (options) {
+  let path = require('path');
+  let fs = require('fs');
+  let karmaPath = path.join(process.cwd(), 'karma.config.js');
+
+  if (fs.existsSync(karmaPath)) {
+    const execSync = require('../exec-sync');
+
+    execSync('gulp karma');
+  }
+};
diff --git a/scripts/tasks/sass.js b/scripts/tasks/sass.js
new file mode 100644
index 0000000000000..1ff6ec305741a
--- /dev/null
+++ b/scripts/tasks/sass.js
@@ -0,0 +1,5 @@
+module.exports = function (options) {
+  const execSync = require('../exec-sync');
+
+  execSync('gulp sass');
+};
diff --git a/scripts/tasks/serve.js b/scripts/tasks/serve.js
new file mode 100644
index 0000000000000..e69de29bb2d1d
diff --git a/scripts/tasks/ts.js b/scripts/tasks/ts.js
new file mode 100644
index 0000000000000..117668e31fef8
--- /dev/null
+++ b/scripts/tasks/ts.js
@@ -0,0 +1,12 @@
+module.exports = function (options) {
+  const path = require('path');
+  const execSync = require('../exec-sync');
+  const typescriptPath = 'node ' + path.resolve(require.resolve('typescript/lib/tsc'));
+
+  execSync(typescriptPath + ' -outDir lib -t es5 -m commonjs --pretty', 'typescript commonjs/es5');
+
+  if (options.isProduction) {
+    execSync(typescriptPath + ' -outDir lib-amd -t es5 -m amd --pretty', 'typescript amd/es5');
+    // execSync(typescriptPath + ' -outDir lib-es6 -t es6 -m es6 --pretty', 'typescript es6');
+  }
+};
\ No newline at end of file
diff --git a/scripts/tasks/tslint.js b/scripts/tasks/tslint.js
new file mode 100644
index 0000000000000..365dcbf118c4f
--- /dev/null
+++ b/scripts/tasks/tslint.js
@@ -0,0 +1,10 @@
+module.exports = function (options) {
+  const execSync = require('../exec-sync');
+  const path = require('path');
+  const msCustomRulesMain = require.resolve('tslint-microsoft-contrib');
+  const rulesPath = path.dirname(msCustomRulesMain);
+  const projectPath = path.resolve(process.cwd(), 'tsconfig.json');
+  const sourcePath = path.resolve(process.cwd(), 'src/**/*.ts*');
+
+  execSync(`tslint --project ${projectPath} -t stylish -r ${rulesPath}`, 'tslint');
+};
diff --git a/scripts/tasks/webpack.js b/scripts/tasks/webpack.js
new file mode 100644
index 0000000000000..e8d53e7d216a6
--- /dev/null
+++ b/scripts/tasks/webpack.js
@@ -0,0 +1,14 @@
+module.exports = function (options) {
+  let path = require('path');
+  let fs = require('fs');
+  let webpackConfigPath = path.join(process.cwd(), 'webpack.config.js');
+
+  if (fs.existsSync(webpackConfigPath)) {
+    // const execSync = require('./exec-sync');
+    // execSync('webpack --config webpack.config.js' + (options.isProduction ? ' --production' : ''));
+
+    const execSync = require('../exec-sync');
+
+    execSync('gulp webpack');
+  }
+};

From 336483b8c3a1dcb46c361aaf2d452b21e6ac6f56 Mon Sep 17 00:00:00 2001
From: Yimin Wu <yimwu@microsoft.com>
Date: Tue, 22 Aug 2017 15:40:34 -0700
Subject: [PATCH 0458/1641] DocumentCardPreview: Allow show Icon in the preview
 area instead of image (#2580)

* DocumentCardPreview: Allow show Icon in the preview area instead of image.

* Add change log
---
 ...-documentcardpreview_2017-08-22-21-53.json |  11 ++
 .../DocumentCard/DocumentCard.Props.ts        |   8 ++
 .../components/DocumentCard/DocumentCard.scss |  10 ++
 .../DocumentCard/DocumentCardPreview.tsx      |  14 +-
 .../examples/DocumentCard.Basic.Example.tsx   |   1 +
 .../examples/DocumentCard.Compact.Example.tsx |  26 ++++
 .../DocumentCard.Complete.Example.tsx         | 125 +++++++++++-------
 .../examples/DocumentCard.Example.scss        |   7 +
 8 files changed, 152 insertions(+), 50 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/yimwu-documentcardpreview_2017-08-22-21-53.json
 create mode 100644 packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Example.scss

diff --git a/common/changes/office-ui-fabric-react/yimwu-documentcardpreview_2017-08-22-21-53.json b/common/changes/office-ui-fabric-react/yimwu-documentcardpreview_2017-08-22-21-53.json
new file mode 100644
index 0000000000000..0e05d99fe4c5e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/yimwu-documentcardpreview_2017-08-22-21-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DocumentCardPreview: Allow show Icon in the preview area instead of image.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "yimwu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.Props.ts b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.Props.ts
index e7b8fa3a54d7f..8c6cc15d49aa1 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.Props.ts
@@ -8,6 +8,7 @@ import { DocumentCardActions } from './DocumentCardActions';
 import { PersonaInitialsColor } from '../../Persona';
 import { ImageFit } from '../../Image';
 import { IButtonProps } from '../../Button';
+import { IIconProps } from '../../Icon';
 
 export interface IDocumentCard {
 
@@ -110,6 +111,7 @@ export interface IDocumentCardPreviewImage {
 
   /**
    * Path to the icon associated with this document type.
+   *
    */
   iconSrc?: string;
 
@@ -136,6 +138,12 @@ export interface IDocumentCardPreviewImage {
    * @deprecated
    */
   accentColor?: string;
+
+  /**
+   * The props for the preview icon.
+   * If provided, icon will be rendered instead of image.
+   */
+  previewIconProps?: IIconProps;
 }
 
 export interface IDocumentCardTitleProps extends React.Props<DocumentCardTitle> {
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.scss b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.scss
index 47ee4fb136e51..ed04bdd8bdb51 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.scss
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.scss
@@ -62,6 +62,10 @@
     @include border-right(1px, solid, $ms-color-neutralLight);
   }
 
+  .previewIconContainer {
+    height: 100%;
+  }
+
   .title {
       padding: 12px 16px 8px 16px;
       @include ms-font-m-plus;
@@ -219,6 +223,12 @@ $ms-DocumentCardActivity-personaTextGutter: 8px;
   }
 }
 
+.previewIconContainer {
+  display: flex;
+  align-items: center;
+  justify-content: center
+}
+
 .icon {
   @include ms-left(10px);
   bottom: 10px;
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx
index 65630a08469b7..24062dc2be593 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { IDocumentCardPreviewProps, IDocumentCardPreviewImage } from './DocumentCard.Props';
 import { Image } from '../../Image';
+import { Icon } from '../../Icon';
 import {
   BaseComponent,
   autobind,
@@ -34,14 +35,23 @@ export class DocumentCardPreview extends BaseComponent<IDocumentCardPreviewProps
     }
 
     return (
-      <div className={ css('ms-DocumentCardPreview', styles.preview, isFileList && ('is-fileList ' + styles.previewIsFileList)) } style={ style }>
+      <div className={ css('ms-DocumentCardPreview', styles.preview, isFileList && ('is-fileList ' + styles.previewIsFileList)) }
+        style={ style }>
         { preview }
       </div>
     );
   }
 
   private _renderPreviewImage(previewImage: IDocumentCardPreviewImage): React.ReactElement<React.HTMLAttributes<HTMLDivElement>> {
-    let { width, height, imageFit } = previewImage;
+    let { width, height, imageFit, previewIconProps } = previewImage;
+
+    if (previewIconProps) {
+      return (
+        <div className={ css('ms-DocumentCardPreview-iconContainer', styles.previewIconContainer) } style={ { width: width, height: height } } >
+          <Icon { ...previewIconProps } />
+        </div>
+      );
+    }
 
     let image = (
       <Image
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Basic.Example.tsx
index a592fe6ea3632..13343f6453888 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Basic.Example.tsx
@@ -8,6 +8,7 @@ import {
 } from 'office-ui-fabric-react/lib/DocumentCard';
 import { ImageFit } from 'office-ui-fabric-react/lib/Image';
 import { TestImages } from '../../../common/TestImages';
+import './DocumentCard.Example.scss';
 
 export class DocumentCardBasicExample extends React.Component<any, any> {
   public render() {
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Compact.Example.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Compact.Example.tsx
index aa96a31784aa0..7810259cce4e9 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Compact.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Compact.Example.tsx
@@ -45,6 +45,15 @@ export class DocumentCardCompactExample extends React.Component<any, any> {
       ],
     };
 
+    let previewPropsUsingIcon: IDocumentCardPreviewProps = {
+      previewImages: [
+        {
+          previewIconProps: { iconName: 'OpenFile', styles: { root: { fontSize: 42, color: '#ffffff' } } },
+          width: 144
+        }
+      ]
+    };
+
     return (
       <div>
         <DocumentCard type={ DocumentCardType.compact } onClickHref='http://bing.com'>
@@ -80,6 +89,23 @@ export class DocumentCardCompactExample extends React.Component<any, any> {
             />
           </div>
         </DocumentCard>
+        <p />
+        <DocumentCard type={ DocumentCardType.compact } onClickHref='http://bing.com'>
+          <DocumentCardPreview { ...previewPropsUsingIcon } />
+          <div className='ms-DocumentCard-details'>
+            <DocumentCardTitle
+              title='View and share files'
+              shouldTruncate={ true } />
+            <DocumentCardActivity
+              activity='Created a few minutes ago'
+              people={
+                [
+                  { name: 'Kat Larrson', profileImageSrc: TestImages.personaFemale }
+                ]
+              }
+            />
+          </div>
+        </DocumentCard>
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx
index cec92786b2ad3..48bb4c5fb7ba5 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx
@@ -74,58 +74,87 @@ export class DocumentCardCompleteExample extends React.Component<any, any> {
 
     };
 
+    let previewPropsUsingIcon: IDocumentCardPreviewProps = {
+      previewImages: [
+        {
+          previewIconProps: { iconName: 'OpenFile', styles: { root: { fontSize: 42, color: '#ffffff' } } },
+          width: 318,
+          height: 196
+        }
+      ]
+    };
+
     return (
-      <DocumentCard
-        onClick={ () => { console.log('You clicked the card.'); } }
-      >
-        <DocumentCardPreview { ...previewProps } />
-        <DocumentCardLocation location='Marketing Documents' locationHref='http://microsoft.com' ariaLabel='Location, Marketing Documents' />
-        <DocumentCardTitle title='6 files were uploaded' />
-        <DocumentCardActivity
-          activity='Created Feb 23, 2016'
-          people={
-            [
-              { name: 'Annie Lindqvist', profileImageSrc: TestImages.personaFemale },
-              { name: 'Roko Kolar', profileImageSrc: '', initials: 'JH' },
-              { name: 'Greta Lundberg', profileImageSrc: TestImages.personaFemale }
-            ]
-          }
-        />
-        <DocumentCardActions
-          actions={
-            [
-              {
-                iconProps: { iconName: 'Share' },
-                onClick: (ev: any) => {
-                  console.log('You clicked the share action.');
-                  ev.preventDefault();
-                  ev.stopPropagation();
+      <div>
+        <DocumentCard
+          onClick={ () => { console.log('You clicked the card.'); } }
+        >
+          <DocumentCardPreview { ...previewProps } />
+          <DocumentCardLocation location='Marketing Documents' locationHref='http://microsoft.com' ariaLabel='Location, Marketing Documents' />
+          <DocumentCardTitle title='6 files were uploaded' />
+          <DocumentCardActivity
+            activity='Created Feb 23, 2016'
+            people={
+              [
+                { name: 'Annie Lindqvist', profileImageSrc: TestImages.personaFemale },
+                { name: 'Roko Kolar', profileImageSrc: '', initials: 'JH' },
+                { name: 'Greta Lundberg', profileImageSrc: TestImages.personaFemale }
+              ]
+            }
+          />
+          <DocumentCardActions
+            actions={
+              [
+                {
+                  iconProps: { iconName: 'Share' },
+                  onClick: (ev: any) => {
+                    console.log('You clicked the share action.');
+                    ev.preventDefault();
+                    ev.stopPropagation();
+                  },
+                  ariaLabel: 'share action'
                 },
-                ariaLabel: 'share action'
-              },
-              {
-                iconProps: { iconName: 'Pin' },
-                onClick: (ev: any) => {
-                  console.log('You clicked the pin action.');
-                  ev.preventDefault();
-                  ev.stopPropagation();
+                {
+                  iconProps: { iconName: 'Pin' },
+                  onClick: (ev: any) => {
+                    console.log('You clicked the pin action.');
+                    ev.preventDefault();
+                    ev.stopPropagation();
+                  },
+                  ariaLabel: 'pin action'
                 },
-                ariaLabel: 'pin action'
-              },
-              {
-                iconProps: { iconName: 'Ringer' },
-                onClick: (ev: any) => {
-                  console.log('You clicked the ringer action.');
-                  ev.preventDefault();
-                  ev.stopPropagation();
+                {
+                  iconProps: { iconName: 'Ringer' },
+                  onClick: (ev: any) => {
+                    console.log('You clicked the ringer action.');
+                    ev.preventDefault();
+                    ev.stopPropagation();
+                  },
+                  ariaLabel: 'ringer action'
                 },
-                ariaLabel: 'ringer action'
-              },
-            ]
-          }
-          views={ 432 }
-        />
-      </DocumentCard>
+              ]
+            }
+            views={ 432 }
+          />
+        </DocumentCard>
+        <p />
+        <DocumentCard onClickHref='http://bing.com'>
+          <DocumentCardPreview { ...previewPropsUsingIcon } />
+          <div className='ms-DocumentCard-details'>
+            <DocumentCardTitle
+              title='View and share files'
+              shouldTruncate={ true } />
+            <DocumentCardActivity
+              activity='Created a few minutes ago'
+              people={
+                [
+                  { name: 'Kat Larrson', profileImageSrc: TestImages.personaFemale }
+                ]
+              }
+            />
+          </div>
+        </DocumentCard>
+      </div>
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Example.scss b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Example.scss
new file mode 100644
index 0000000000000..f150ec2e88415
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Example.scss
@@ -0,0 +1,7 @@
+@import '../../../common/common';
+
+:global {
+  .ms-DocumentCardPreview-iconContainer {
+    background-color: $ms-color-themePrimary;
+  }
+}

From d5c12b214899f71a2886a3bddc2ae065ce2f19ed Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Tue, 22 Aug 2017 17:00:10 -0700
Subject: [PATCH 0459/1641] ComboBox set selected fix for when the comboBox is
 not focused (#2581)

* Update selecting the comboBox content to only happen if the comboBox is in the focused state when the value is updated

* add change file

* Update the spacing to increase readability
---
 ...lin-ComboBoxSetSelectedFix_2017-08-22-22-16.json | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.tsx            | 13 +++++++++----
 2 files changed, 20 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxSetSelectedFix_2017-08-22-22-16.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxSetSelectedFix_2017-08-22-22-16.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxSetSelectedFix_2017-08-22-22-16.json
new file mode 100644
index 0000000000000..87d82bed8e51e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxSetSelectedFix_2017-08-22-22-16.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Content should not be selected when comboBox isn't focused",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index b45b96bf1d417..c2c0d74ab2952 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -184,12 +184,17 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     }
 
     // If we just opened/closed the menu OR
-    // updated the selectedIndex with the menu closed OR
-    // are focused and are not allowing freeform or the value changed
+    // are focused AND
+    //   updated the selectedIndex with the menu closed OR
+    //   are not allowing freeform OR
+    //   the value changed
     // we need to set selection
     if (prevState.isOpen !== isOpen ||
-      (!isOpen && prevState.selectedIndex !== selectedIndex) ||
-      (focused && (!allowFreeform || value !== prevProps.value))) {
+      (focused &&
+        ((!isOpen && prevState.selectedIndex !== selectedIndex) ||
+          !allowFreeform ||
+          value !== prevProps.value)
+      )) {
       this._select();
     }
   }

From 1d1f46e65d4ea0ec1cec42301c6fe9c10122ee5c Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Tue, 22 Aug 2017 21:40:50 -0700
Subject: [PATCH 0460/1641] Removed unused variables in experiments pkg to pass
 tslint (#2586)

* Remove unused variables from experinents pkg - tslint

* Add change file
---
 ...ents-remove-unused-variables_2017-08-23-00-57.json | 11 +++++++++++
 .../CommandBar/examples/CommandBar.Basic.Example.tsx  |  3 ---
 .../experiments/src/components/Tile/Tile.Props.ts     |  1 -
 packages/experiments/src/components/Tile/Tile.tsx     |  2 +-
 packages/experiments/src/components/Tile/TilePage.tsx |  1 -
 .../Tile/examples/Tile.Document.Example.tsx           |  5 +----
 .../components/Tile/examples/Tile.Media.Example.tsx   |  1 -
 .../src/components/TilesList/TilesList.tsx            |  1 -
 .../components/TilesList/examples/ExampleHelpers.tsx  |  2 --
 .../TilesList/examples/TilesList.Basic.Example.tsx    |  3 +--
 .../TilesList/examples/TilesList.Document.Example.tsx |  7 +------
 .../TilesList/examples/TilesList.Media.Example.tsx    |  4 ----
 packages/experiments/tslint.json                      |  1 -
 13 files changed, 15 insertions(+), 27 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/experiments-remove-unused-variables_2017-08-23-00-57.json

diff --git a/common/changes/@uifabric/experiments/experiments-remove-unused-variables_2017-08-23-00-57.json b/common/changes/@uifabric/experiments/experiments-remove-unused-variables_2017-08-23-00-57.json
new file mode 100644
index 0000000000000..7d40c8c8b3406
--- /dev/null
+++ b/common/changes/@uifabric/experiments/experiments-remove-unused-variables_2017-08-23-00-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Removed suppression of tslint unused variables rule from Experiments package and removed unused variables to pass tslint",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "a.erich@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx b/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
index 3be9125083feb..fbbb2e94c599d 100644
--- a/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
+++ b/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
@@ -1,8 +1,5 @@
 import * as React from 'react';
-import { assign } from 'office-ui-fabric-react/lib/Utilities';
 import { CommandBar } from '../CommandBar';
-import { Toggle } from 'office-ui-fabric-react/lib/Toggle';
-
 export class CommandBarBasicExample extends React.Component<any, any> {
 
   constructor(props: any) {
diff --git a/packages/experiments/src/components/Tile/Tile.Props.ts b/packages/experiments/src/components/Tile/Tile.Props.ts
index e6b80e92896bf..3a9c22be08d42 100644
--- a/packages/experiments/src/components/Tile/Tile.Props.ts
+++ b/packages/experiments/src/components/Tile/Tile.Props.ts
@@ -1,7 +1,6 @@
 
 import * as React from 'react';
 import { IBaseProps } from 'office-ui-fabric-react/lib/Utilities';
-import { Tile } from './Tile';
 import { Selection } from 'office-ui-fabric-react/lib/utilities/selection/Selection';
 
 export interface ITileProps extends IBaseProps, React.AllHTMLAttributes<HTMLSpanElement | HTMLAnchorElement> {
diff --git a/packages/experiments/src/components/Tile/Tile.tsx b/packages/experiments/src/components/Tile/Tile.tsx
index d2184e1589139..c5870932d1a61 100644
--- a/packages/experiments/src/components/Tile/Tile.tsx
+++ b/packages/experiments/src/components/Tile/Tile.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 import { ITileProps } from './Tile.Props';
 import { Check } from 'office-ui-fabric-react/lib/Check';
 import { SELECTION_CHANGE } from 'office-ui-fabric-react/lib/utilities/selection/index';
-import { css, BaseComponent, autobind, getNativeProps, getId } from 'office-ui-fabric-react/lib/Utilities';
+import { css, BaseComponent, autobind, getId } from 'office-ui-fabric-react/lib/Utilities';
 import * as TileStylesModule from './Tile.scss';
 import * as SignalStylesModule from '../signals/Signals.scss';
 
diff --git a/packages/experiments/src/components/Tile/TilePage.tsx b/packages/experiments/src/components/Tile/TilePage.tsx
index b06cbcc5e624a..dbdc21f32e839 100644
--- a/packages/experiments/src/components/Tile/TilePage.tsx
+++ b/packages/experiments/src/components/Tile/TilePage.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { Link } from 'office-ui-fabric-react/lib/Link';
 import {
   ExampleCard,
   IComponentDemoPageProps,
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
index ec7cdd9c0d4bb..5b1df0bb3ecac 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
@@ -1,16 +1,13 @@
 
 import * as React from 'react';
 import { Tile } from '../Tile';
-import { Icon } from 'office-ui-fabric-react/lib/Icon';
 import { css } from 'office-ui-fabric-react/lib/Utilities';
 import {
   SignalField,
-  Signal,
   NewSignal,
   CommentsSignal,
   TrendingSignal,
-  SharedSignal,
-  MentionSignal
+  SharedSignal
 } from '../../signals/Signals';
 import { lorem } from '@uifabric/example-app-base';
 import * as TileExampleStylesModule from './Tile.Example.scss';
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
index ced7fee347ed8..62c687f73f072 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
@@ -8,7 +8,6 @@ import {
   Signal,
   NewSignal,
   CommentsSignal,
-  TrendingSignal,
   SharedSignal,
   MentionSignal
 } from '../../signals/Signals';
diff --git a/packages/experiments/src/components/TilesList/TilesList.tsx b/packages/experiments/src/components/TilesList/TilesList.tsx
index 8726b5fb58dab..b8f85b2a084c3 100644
--- a/packages/experiments/src/components/TilesList/TilesList.tsx
+++ b/packages/experiments/src/components/TilesList/TilesList.tsx
@@ -440,7 +440,6 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
     }
 
     const itemWidthOverHeight = item.aspectRatio || 1;
-    const itemHeightOverWidth = 1 / itemWidthOverHeight;
     const margin = grid.spacing / 2;
 
     const isFill = gridMode === TilesGridMode.fill;
diff --git a/packages/experiments/src/components/TilesList/examples/ExampleHelpers.tsx b/packages/experiments/src/components/TilesList/examples/ExampleHelpers.tsx
index b221da05927e6..0daf562942ea6 100644
--- a/packages/experiments/src/components/TilesList/examples/ExampleHelpers.tsx
+++ b/packages/experiments/src/components/TilesList/examples/ExampleHelpers.tsx
@@ -55,8 +55,6 @@ export function createDocumentItems(count: number, indexOffset: number) {
   const items: IExampleItem[] = [];
 
   for (let i = 0; i < count; i++) {
-    const seed = Math.random();
-
     items.push({
       key: `item-${indexOffset + i}`,
       name: lorem(4),
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx
index c30dacc20e732..1c42b8096fa20 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx
@@ -4,8 +4,7 @@ import {
   TilesList,
   ITilesGridSegment,
   ITilesGridItem,
-  TilesGridMode,
-  ITileSize
+  TilesGridMode
 } from '../../TilesList';
 
 export interface IBasicItem {
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
index f1c8776310723..6c025f29848c5 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
@@ -1,18 +1,13 @@
 
 import * as React from 'react';
 import {
-  TilesList,
-  ITilesGridSegment,
-  ITilesGridItem,
-  TilesGridMode,
-  ITileSize
+  TilesList
 } from '../../TilesList';
 import { Tile } from '../../../Tile';
 import { Selection } from 'office-ui-fabric-react/lib/utilities/selection/Selection';
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { AnimationClassNames } from 'office-ui-fabric-react/lib/Styling';
-import { lorem } from '@uifabric/example-app-base';
 import { IExampleGroup, IExampleItem, createGroup, createDocumentItems, getTileCells } from './ExampleHelpers';
 
 function createGroups(): IExampleGroup[] {
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
index 0673961289920..eb51e3be54f19 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
@@ -2,9 +2,6 @@
 import * as React from 'react';
 import {
   TilesList,
-  ITilesGridSegment,
-  ITilesGridItem,
-  TilesGridMode,
   ITileSize
 } from '../../TilesList';
 import { Tile } from '../../../Tile';
@@ -12,7 +9,6 @@ import { Selection } from 'office-ui-fabric-react/lib/utilities/selection/Select
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { AnimationClassNames } from 'office-ui-fabric-react/lib/Styling';
-import { lorem } from '@uifabric/example-app-base';
 import { IExampleGroup, IExampleItem, createGroup, createMediaItems, getTileCells } from './ExampleHelpers';
 
 function createGroups(): IExampleGroup[] {
diff --git a/packages/experiments/tslint.json b/packages/experiments/tslint.json
index f98ceb211d85f..f814a30d35664 100644
--- a/packages/experiments/tslint.json
+++ b/packages/experiments/tslint.json
@@ -5,7 +5,6 @@
   "rules": {
     "jsx-ban-props": false,
     "jsx-self-close": false,
-    "no-unused-variable": false,
     "jsx-no-multiline-js": false,
     "max-line-length": [
       false,

From 017873a67b9772721cd94ff56f7860a1eefe6ec3 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Tue, 22 Aug 2017 21:45:26 -0700
Subject: [PATCH 0461/1641] Break up long lines or disable max line length in
 Experiments pkg to pass tslint (#2584)

* Break up long lines or disable max line length in experiments pkg - tslint

* Add change file
---
 .../experiments-max-line-length_2017-08-23-00-37.json | 11 +++++++++++
 .../src/components/CommandBar/CommandBar.Props.ts     |  6 ++++--
 .../src/components/CommandBar/CommandBarPage.tsx      |  3 +++
 .../src/components/TilesList/TilesListPage.tsx        |  5 ++++-
 packages/experiments/src/demo/GettingStartedPage.tsx  |  2 +-
 packages/experiments/tslint.json                      |  4 ----
 6 files changed, 23 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/experiments-max-line-length_2017-08-23-00-37.json

diff --git a/common/changes/@uifabric/experiments/experiments-max-line-length_2017-08-23-00-37.json b/common/changes/@uifabric/experiments/experiments-max-line-length_2017-08-23-00-37.json
new file mode 100644
index 0000000000000..b22b935e442a3
--- /dev/null
+++ b/common/changes/@uifabric/experiments/experiments-max-line-length_2017-08-23-00-37.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Removed suppression of tslint max line length rule from Experiments package, and broke up large lines or inserted tslint:disable comments to pass tslint",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "a.erich@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.Props.ts b/packages/experiments/src/components/CommandBar/CommandBar.Props.ts
index 1c95466649e19..45423af44824c 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.Props.ts
+++ b/packages/experiments/src/components/CommandBar/CommandBar.Props.ts
@@ -56,12 +56,14 @@ export interface ICommandBarProps extends React.HTMLAttributes<HTMLDivElement> {
   onRenderButton?: (item: ICommandBarItemProps) => JSX.Element;
 
   /**
-   * Custom function to reduce data if items do not fit in given space. Return `undefined` if no more steps can be taken to avoid infinate loop.
+   * Custom function to reduce data if items do not fit in given space. Return `undefined`
+   * if no more steps can be taken to avoid infinate loop.
    */
   onReduceData?: (data: ICommandBarData) => ICommandBarData;
 
   /**
-   * Custom function to grow data if items are too small for the given space. Return `undefined` if no more steps can be taken to avoid infinate loop.
+   * Custom function to grow data if items are too small for the given space.
+   * Return `undefined` if no more steps can be taken to avoid infinate loop.
    */
   onGrowData?: (data: ICommandBarData) => ICommandBarData;
 
diff --git a/packages/experiments/src/components/CommandBar/CommandBarPage.tsx b/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
index eebdd9a439d02..36bfbfda119fb 100644
--- a/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
@@ -8,6 +8,7 @@ import {
 import { items, overflowItems, farItems } from './examples/data';
 import { CommandBarBasicExample } from './examples/CommandBar.Basic.Example';
 
+// tslint:disable-next-line:max-line-length
 const CommandBarBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx') as string;
 
 export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}> {
@@ -33,6 +34,7 @@ export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}>
             ] }
           />
         }
+        /* tslint:disable:max-line-length */
         overview={
           <div>
             <p>
@@ -46,6 +48,7 @@ export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}>
             </p>
           </div>
         }
+        /* tslint:enable:max-line-length */
         bestPractices={
           <div></div>
         }
diff --git a/packages/experiments/src/components/TilesList/TilesListPage.tsx b/packages/experiments/src/components/TilesList/TilesListPage.tsx
index cd27272ddcc4f..b6b08dfc3ad8a 100644
--- a/packages/experiments/src/components/TilesList/TilesListPage.tsx
+++ b/packages/experiments/src/components/TilesList/TilesListPage.tsx
@@ -7,6 +7,7 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 
+/* tslint:disable:max-line-length */
 import { TilesListBasicExample } from './examples/TilesList.Basic.Example';
 const TilesListBasicExampleCode = require('!raw-loader!experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx') as string;
 
@@ -15,6 +16,7 @@ const TilesListDocumentExampleCode = require('!raw-loader!experiments/src/compon
 
 import { TilesListMediaExample } from './examples/TilesList.Media.Example';
 const TilesListMediaExampleCode = require('!raw-loader!experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx') as string;
+/* tslint:enable:max-line-length */
 
 export class TilesListPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
@@ -49,7 +51,8 @@ export class TilesListPage extends React.Component<IComponentDemoPageProps, {}>
               It is intended to represent items visual using a one or mote content-focused flowing grids.
             </p>
             <p>
-              <code>TilesList</code> is designed to be used in conjunction with the <code>Tile</code> component. The <code>Tile</code> component provides a standardized form of focusable and selectable content item.
+              <code>TilesList</code> is designed to be used in conjunction with the <code>Tile</code> component.
+              The <code>Tile</code> component provides a standardized form of focusable and selectable content item.
             </p>
           </div>
         }
diff --git a/packages/experiments/src/demo/GettingStartedPage.tsx b/packages/experiments/src/demo/GettingStartedPage.tsx
index d8d03d7617e43..e80f383ccbef4 100644
--- a/packages/experiments/src/demo/GettingStartedPage.tsx
+++ b/packages/experiments/src/demo/GettingStartedPage.tsx
@@ -1,4 +1,4 @@
-/* tslint:disable:jsx-no-multiline-js */
+/* tslint:disable:jsx-no-multiline-js max-line-length */
 
 import * as React from 'react';
 import { Link } from 'office-ui-fabric-react/lib/Link';
diff --git a/packages/experiments/tslint.json b/packages/experiments/tslint.json
index f814a30d35664..940d29c140ebc 100644
--- a/packages/experiments/tslint.json
+++ b/packages/experiments/tslint.json
@@ -6,10 +6,6 @@
     "jsx-ban-props": false,
     "jsx-self-close": false,
     "jsx-no-multiline-js": false,
-    "max-line-length": [
-      false,
-      140
-    ],
     "no-any": false,
     "typedef": [
       false

From f9295f56a26a91d6fd35776490ca91d7ae83bd40 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 22 Aug 2017 22:15:04 -0700
Subject: [PATCH 0462/1641] Emlynam/rm trello ref (#2576)

* Removed Trello reference

* Added change file
---
 .../src/pages/GetStarted/GetStartedPage.tsx           |  2 +-
 .../emlynam-rm-trello-ref_2017-08-22-18-54.json       | 11 +++++++++++
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/fabric-website/emlynam-rm-trello-ref_2017-08-22-18-54.json

diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
index b5e5d1dfd5ba8..c1b1557e80747 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
@@ -161,7 +161,7 @@ ReactDOM.render(<MyPage />, document.body.firstChild);`
           <p>For advanced scenarios or alternatives to NPM see the <a href='https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/ADVANCED.md'>advanced documentation in the Fabric React repository</a>.</p>
 
           <h3>Need a component Fabric React doesn&rsquo;t have?</h3>
-          <p>Check the <a href='https://trello.com/b/hBP8XdvR/office-ui-fabric-react-requests'>Fabric React Trello board</a> and vote up the request so we can track it. If you don&rsquo;t see an existing card, please <a href='https://github.com/OfficeDev/office-ui-fabric-react/issues'>file an issue in the repository</a> and we&rsquo;ll add the card for you.</p>
+          <p>First, check the <a href='https://github.com/OfficeDev/office-ui-fabric-react/issues'>Fabric React issue queue</a> or <a href='https://github.com/OfficeDev/office-ui-fabric-react/projects'>projects</a> to see if your component has already been requested or is being worked on. If you don't see an existing issue or project for the component you're looking for, please <a href='https://github.com/OfficeDev/office-ui-fabric-react/issues'>file an issue in the repo</a>, and we'll respond if it's being built or on our radar.</p>
 
           <h2 id='core'>Get started with Fabric Core</h2>
           <p>With one reference to our CDN, you can access Fabric&rsquo;s fonts, icons, type styles, colors, grid, and more.</p>
diff --git a/common/changes/@uifabric/fabric-website/emlynam-rm-trello-ref_2017-08-22-18-54.json b/common/changes/@uifabric/fabric-website/emlynam-rm-trello-ref_2017-08-22-18-54.json
new file mode 100644
index 0000000000000..e9fe40b4eff5c
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/emlynam-rm-trello-ref_2017-08-22-18-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Removed Trello reference",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From d13adf8353d706d583a1e217135890ceaf6e49ff Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 22 Aug 2017 22:16:31 -0700
Subject: [PATCH 0463/1641] Emlynam/update branding guidance (#2575)

* Updated branding guidance pdf from the cdn

* added change file
---
 .../pages/Styles/BrandIconsPage/BrandIconsPage.tsx    |  2 +-
 ...nam-update-branding-guidance_2017-08-22-17-03.json | 11 +++++++++++
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/fabric-website/emlynam-update-branding-guidance_2017-08-22-17-03.json

diff --git a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
index 209737addb257..b76ed5d463f55 100644
--- a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
@@ -52,7 +52,7 @@ export class BrandIconsPage extends React.Component<any, any> {
         <div className={ pageStyles.u_maxTextWidth }>
           <h2 id='overview'>Overview</h2>
           <p>Fabric includes product and document icons that you can use to connect your experience with other Office and Office 365 endpoints. The icons come in three formats &mdash; SVG and PNG for multicolor and the icon font for monochrome &mdash; in a variety of sizes and resolutions.</p>
-          <p>Usage of these icons is subject to the <a href='https://static2.sharepointonline.com/files/fabric/assets/license.txt'>assets license agreement (DOCX)</a> and our <a href={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/files/officebrandguide_16sep2016.pdf' }>brand guidelines (PDF)</a>. Please read this document and the resolution/size guidance carefully to ensure that you use our branded icons correctly to create the best experience.</p>
+          <p>Usage of these icons is subject to the <a href='https://static2.sharepointonline.com/files/fabric/assets/license.txt'>assets license agreement (DOCX)</a> and our <a href={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/files/office_marketing_guidelines.pdf' }>brand guidelines (PDF)</a>. Please read this document and the resolution/size guidance carefully to ensure that you use our branded icons correctly to create the best experience.</p>
         </div>
         <h3>Product icons</h3>
         <div className='ms-Grid ms-Grid--wide'>
diff --git a/common/changes/@uifabric/fabric-website/emlynam-update-branding-guidance_2017-08-22-17-03.json b/common/changes/@uifabric/fabric-website/emlynam-update-branding-guidance_2017-08-22-17-03.json
new file mode 100644
index 0000000000000..b3a62739712f4
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/emlynam-update-branding-guidance_2017-08-22-17-03.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Updated branding guidance pdf from the cdn.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From 0138f94e936b5bbbd7889dd1ff3b742002c78279 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 22 Aug 2017 22:29:22 -0700
Subject: [PATCH 0464/1641] Build tooling updates: Adding copy and sass tasks,
 updating logging. (#2588)

* Adding copy and sass tasks, updating logging.

* update shrinkwrap.

* Making build step verbose.
---
 .vscode/settings.json                         |    2 +-
 common/config/rush/npm-shrinkwrap.json        | 1203 ++++++++++++++---
 package.json                                  |    2 +-
 .../example-app-base/src/common/_common.scss  |    2 +-
 .../src/common/_semanticColorVariables.scss   |    2 +
 .../src/components/CommandBar/CommandBar.scss |    2 +-
 .../experiments/src/components/Tile/Tile.scss |    2 +-
 .../src/components/TilesList/TilesList.scss   |    2 +-
 .../src/components/signals/Signals.scss       |    4 +-
 .../src/components/signals/Signals.tsx        |    2 +-
 .../config/pre-copy.json                      |   10 +
 packages/utilities/src/scroll.scss            |    3 +-
 packages/utilities/src/scroll.ts              |    6 +-
 scripts/build.js                              |   48 +-
 scripts/exec-sync.js                          |   45 +-
 scripts/logging.js                            |   33 +
 scripts/package.json                          |    6 +
 scripts/tasks/copy.js                         |   44 +
 scripts/tasks/sass.js                         |   89 +-
 19 files changed, 1279 insertions(+), 228 deletions(-)
 create mode 100644 packages/office-ui-fabric-react/config/pre-copy.json
 create mode 100644 scripts/logging.js
 create mode 100644 scripts/tasks/copy.js

diff --git a/.vscode/settings.json b/.vscode/settings.json
index 8807589f04b73..aa7f6036fb24d 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -14,7 +14,7 @@
     "**/.DS_Store": true,
     "**/bower_components": true,
     "**/coverage": true,
-    "**/*.scss.ts": true
+    "**/*.scss.ts": false
   },
   "files.watcherExclude": {
     "**/.git/objects/**": true,
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index baf25e5993c8d..867d44b59c272 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -148,10 +148,32 @@
       "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.1.2.tgz",
       "integrity": "sha1-msehN3WBLY3s1/BOQrfy1BKjnCc=",
       "dependencies": {
-        "autoprefixer": {
-          "version": "6.3.7",
-          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz",
-          "integrity": "sha1-jt8xZt2f1hFlM2Ysi7NqA8DvyHQ="
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "postcss-modules": {
+          "version": "0.6.4",
+          "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.6.4.tgz",
+          "integrity": "sha1-d6WLt3uhtDkrJwwLWYUv116JqLQ="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
@@ -458,7 +480,14 @@
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
         },
         "css-loader": {
           "version": "0.24.0",
@@ -572,6 +601,11 @@
           "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz",
           "integrity": "sha1-sEDrCSOWivq/jTL7HxfxFn/auQc="
         },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
         "qs": {
           "version": "6.5.0",
           "resolved": "https://registry.npmjs.org/qs/-/qs-6.5.0.tgz",
@@ -597,21 +631,28 @@
           "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.10.3.tgz",
           "integrity": "sha1-zlpuzTEB/tXsCYJ9rCKpwpv7BTU="
         },
-        "source-map": {
-          "version": "0.1.43",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz",
-          "integrity": "sha1-wkvBRspRfBRx9drL4lcbK3+eM0Y="
-        },
         "source-map-loader": {
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.1.6.tgz",
-          "integrity": "sha1-wJkD2m1zueU7ftjuUkVZcFHpjpE="
+          "integrity": "sha1-wJkD2m1zueU7ftjuUkVZcFHpjpE=",
+          "dependencies": {
+            "source-map": {
+              "version": "0.1.43",
+              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz",
+              "integrity": "sha1-wkvBRspRfBRx9drL4lcbK3+eM0Y="
+            }
+          }
         },
         "statuses": {
           "version": "1.2.1",
           "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.2.1.tgz",
           "integrity": "sha1-3e1FzBglbVHtQK7BQkidXGECbSg="
         },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        },
         "webpack-bundle-analyzer": {
           "version": "2.4.1",
           "resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.4.1.tgz",
@@ -937,16 +978,23 @@
           "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-webpack/-/gulp-core-build-webpack-1.2.6.tgz",
           "integrity": "sha1-CEPmcgi0QcZlaaL038cWTQv/rbU="
         },
-        "autoprefixer": {
-          "version": "6.3.7",
-          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz",
-          "integrity": "sha1-jt8xZt2f1hFlM2Ysi7NqA8DvyHQ="
-        },
         "camelcase": {
           "version": "1.2.1",
           "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
           "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
         },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
         "cliui": {
           "version": "2.1.0",
           "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
@@ -1009,6 +1057,23 @@
           "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
           "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
         },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
+          "dependencies": {
+            "supports-color": {
+              "version": "3.2.3",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+              "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+            }
+          }
+        },
+        "postcss-modules": {
+          "version": "0.6.4",
+          "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.6.4.tgz",
+          "integrity": "sha1-d6WLt3uhtDkrJwwLWYUv116JqLQ="
+        },
         "readable-stream": {
           "version": "2.3.3",
           "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
@@ -1078,6 +1143,14 @@
     "@rush-temp/build": {
       "version": "file:projects/build",
       "dependencies": {
+        "autoprefixer": {
+          "version": "7.1.2",
+          "bundled": true
+        },
+        "browserslist": {
+          "version": "2.3.3",
+          "bundled": true
+        },
         "tslint": {
           "version": "5.6.0",
           "bundled": true
@@ -1302,10 +1375,39 @@
           "version": "2.5.0",
           "bundled": true
         },
+        "autoprefixer": {
+          "version": "6.7.7",
+          "bundled": true
+        },
+        "browserslist": {
+          "version": "1.7.7",
+          "bundled": true
+        },
         "camelcase": {
           "version": "4.1.0",
           "bundled": true
         },
+        "chalk": {
+          "version": "1.1.3",
+          "bundled": true,
+          "dependencies": {
+            "ansi-regex": {
+              "version": "2.1.1",
+              "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
+              "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
+            },
+            "strip-ansi": {
+              "version": "3.0.1",
+              "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
+              "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8="
+            },
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
         "commander": {
           "version": "2.9.0",
           "bundled": true
@@ -1378,6 +1480,17 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "postcss": {
+          "version": "5.2.17",
+          "bundled": true,
+          "dependencies": {
+            "supports-color": {
+              "version": "3.2.3",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+              "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+            }
+          }
+        },
         "read-pkg": {
           "version": "2.0.0",
           "bundled": true
@@ -1501,10 +1614,39 @@
           "version": "2.5.0",
           "bundled": true
         },
+        "autoprefixer": {
+          "version": "6.7.7",
+          "bundled": true
+        },
+        "browserslist": {
+          "version": "1.7.7",
+          "bundled": true
+        },
         "camelcase": {
           "version": "4.1.0",
           "bundled": true
         },
+        "chalk": {
+          "version": "1.1.3",
+          "bundled": true,
+          "dependencies": {
+            "ansi-regex": {
+              "version": "2.1.1",
+              "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
+              "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
+            },
+            "strip-ansi": {
+              "version": "3.0.1",
+              "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
+              "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8="
+            },
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
         "commander": {
           "version": "2.9.0",
           "bundled": true
@@ -1577,6 +1719,17 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "postcss": {
+          "version": "5.2.17",
+          "bundled": true,
+          "dependencies": {
+            "supports-color": {
+              "version": "3.2.3",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+              "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+            }
+          }
+        },
         "read-pkg": {
           "version": "2.0.0",
           "bundled": true
@@ -1725,10 +1878,39 @@
           "version": "2.5.0",
           "bundled": true
         },
+        "autoprefixer": {
+          "version": "6.7.7",
+          "bundled": true
+        },
+        "browserslist": {
+          "version": "1.7.7",
+          "bundled": true
+        },
         "camelcase": {
           "version": "4.1.0",
           "bundled": true
         },
+        "chalk": {
+          "version": "1.1.3",
+          "bundled": true,
+          "dependencies": {
+            "ansi-regex": {
+              "version": "2.1.1",
+              "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
+              "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
+            },
+            "strip-ansi": {
+              "version": "3.0.1",
+              "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
+              "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8="
+            },
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
         "commander": {
           "version": "2.9.0",
           "bundled": true
@@ -1801,6 +1983,17 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "postcss": {
+          "version": "5.2.17",
+          "bundled": true,
+          "dependencies": {
+            "supports-color": {
+              "version": "3.2.3",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+              "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+            }
+          }
+        },
         "read-pkg": {
           "version": "2.0.0",
           "bundled": true
@@ -2948,6 +3141,11 @@
       "resolved": "https://registry.npmjs.org/array-each/-/array-each-1.0.1.tgz",
       "integrity": "sha1-p5SvDAWrF1KEbudTofIRoFugxE8="
     },
+    "array-filter": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/array-filter/-/array-filter-0.0.1.tgz",
+      "integrity": "sha1-fajPLiZijtcygDWB/SH2fKzS7uw="
+    },
     "array-find-index": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/array-find-index/-/array-find-index-1.0.2.tgz",
@@ -2958,6 +3156,16 @@
       "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
       "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI="
     },
+    "array-map": {
+      "version": "0.0.0",
+      "resolved": "https://registry.npmjs.org/array-map/-/array-map-0.0.0.tgz",
+      "integrity": "sha1-iKK6tz0c97zVwbEYoAP2b2ZfpmI="
+    },
+    "array-reduce": {
+      "version": "0.0.0",
+      "resolved": "https://registry.npmjs.org/array-reduce/-/array-reduce-0.0.0.tgz",
+      "integrity": "sha1-FziZ0//Rx9k4PkR5Ul2+J4yrXys="
+    },
     "array-slice": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/array-slice/-/array-slice-1.0.0.tgz",
@@ -3044,14 +3252,31 @@
       "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k="
     },
     "autoprefixer": {
-      "version": "6.7.7",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.7.7.tgz",
-      "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ=",
+      "version": "6.3.7",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz",
+      "integrity": "sha1-jt8xZt2f1hFlM2Ysi7NqA8DvyHQ=",
       "dependencies": {
-        "browserslist": {
-          "version": "1.7.7",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
-          "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk="
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
@@ -3161,6 +3386,11 @@
         }
       }
     },
+    "babel-runtime": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz",
+      "integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4="
+    },
     "backo2": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz",
@@ -3480,6 +3710,11 @@
       "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000717.tgz",
       "integrity": "sha1-J931/szdM4yZpiyXiMJpT5n2ftc="
     },
+    "caniuse-lite": {
+      "version": "1.0.30000717",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000717.tgz",
+      "integrity": "sha1-RTmxJq94fB1IUZRN4isr2HgNNhI="
+    },
     "capture-stack-trace": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/capture-stack-trace/-/capture-stack-trace-1.0.0.tgz",
@@ -3910,6 +4145,11 @@
       "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-2.2.2.tgz",
       "integrity": "sha512-GiNXLwAFPYHy25XmTPpafYvn3CLAkJ8FLsscq78MQd1Kh0OU6Yzhn4eV2MVF4G9WEQZoWEGltatdR+ntGPMl5A=="
     },
+    "cpx": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/cpx/-/cpx-1.5.0.tgz",
+      "integrity": "sha1-GFvgGFEdhycN7czCkxceN2VauI8="
+    },
     "crc": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/crc/-/crc-3.3.0.tgz",
@@ -4011,6 +4251,18 @@
       "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.5.tgz",
       "integrity": "sha512-/FJmsDD8e6xZOBHMFShN/BCjnrEybq0spYaTZ1QoZ10/jhUa1LDDojQELu/JJ1ykZZjt0nSwkYrb2Mfx3bZx3Q==",
       "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
         "loader-utils": {
           "version": "1.1.0",
           "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
@@ -4021,10 +4273,20 @@
           "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz",
           "integrity": "sha1-soqmKIorn8ZRA1x3EfZathkDMaY="
         },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
         "source-list-map": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-2.0.0.tgz",
           "integrity": "sha512-I2UmuJSRr/T8jisiROLU3A3ltr+swpniSmNPI4Ml3ZCX6tVnDsuZzK7F2hl5jTqbZBWCEKlj5HRQiPExXLgE8A=="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
@@ -4080,7 +4342,31 @@
     "cssnano": {
       "version": "3.10.0",
       "resolved": "https://registry.npmjs.org/cssnano/-/cssnano-3.10.0.tgz",
-      "integrity": "sha1-Tzj2zqK5sX+gFJDyPx3GjqZcHDg="
+      "integrity": "sha1-Tzj2zqK5sX+gFJDyPx3GjqZcHDg=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
     },
     "csso": {
       "version": "2.3.2",
@@ -5862,7 +6148,31 @@
     "gulp-postcss": {
       "version": "6.3.0",
       "resolved": "https://registry.npmjs.org/gulp-postcss/-/gulp-postcss-6.3.0.tgz",
-      "integrity": "sha1-M+6XI+WcMC8z1wf8S3OYsQ8DK/8="
+      "integrity": "sha1-M+6XI+WcMC8z1wf8S3OYsQ8DK/8=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
     },
     "gulp-prompt": {
       "version": "0.2.0",
@@ -6331,24 +6641,7 @@
     "icss-utils": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-2.1.0.tgz",
-      "integrity": "sha1-g/Cg7DeL8yRheLbCrZE28TWxyWI=",
-      "dependencies": {
-        "has-flag": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
-          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
-        },
-        "postcss": {
-          "version": "6.0.9",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.9.tgz",
-          "integrity": "sha512-bBE2AHNEBhF23TfET6AA/lFP8ah+qHOZoFJEflFG+HgvVLdTmMOrocx/4LVVDIn3w6jUssw1q2Exk1cc9UOI8w=="
-        },
-        "supports-color": {
-          "version": "4.2.1",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
-          "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
-        }
-      }
+      "integrity": "sha1-g/Cg7DeL8yRheLbCrZE28TWxyWI="
     },
     "ieee754": {
       "version": "1.1.8",
@@ -7775,6 +8068,18 @@
       "resolved": "https://registry.npmjs.org/mocha-loader/-/mocha-loader-1.1.1.tgz",
       "integrity": "sha1-Ocm3jErWmrxTPtAuLas5gkTKM6s=",
       "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
         "css-loader": {
           "version": "0.23.1",
           "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.23.1.tgz",
@@ -7797,10 +8102,20 @@
           "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
           "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
         },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
         "style-loader": {
           "version": "0.13.2",
           "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.13.2.tgz",
           "integrity": "sha1-dFMzhM9pjHEEx5URULSXF63C87s="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
@@ -8494,9 +8809,26 @@
       "integrity": "sha1-uzLs2HwnEErm7kS1o8y/Drsa7ek="
     },
     "postcss": {
-      "version": "5.2.17",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-      "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
+      "version": "6.0.9",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.9.tgz",
+      "integrity": "sha512-bBE2AHNEBhF23TfET6AA/lFP8ah+qHOZoFJEflFG+HgvVLdTmMOrocx/4LVVDIn3w6jUssw1q2Exk1cc9UOI8w==",
+      "dependencies": {
+        "has-flag": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
+          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
+        },
+        "supports-color": {
+          "version": "4.2.1",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
+          "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
+        }
+      }
+    },
+    "postcss-calc": {
+      "version": "5.3.1",
+      "resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-5.3.1.tgz",
+      "integrity": "sha1-d7rnypKK2FcW4v2kLyYb98HWW14=",
       "dependencies": {
         "chalk": {
           "version": "1.1.3",
@@ -8510,6 +8842,11 @@
             }
           }
         },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
@@ -8517,50 +8854,237 @@
         }
       }
     },
-    "postcss-calc": {
-      "version": "5.3.1",
-      "resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-5.3.1.tgz",
-      "integrity": "sha1-d7rnypKK2FcW4v2kLyYb98HWW14="
-    },
     "postcss-colormin": {
       "version": "2.2.2",
       "resolved": "https://registry.npmjs.org/postcss-colormin/-/postcss-colormin-2.2.2.tgz",
-      "integrity": "sha1-ZjFBfV8OkJo9fsJrJMio0eT5bks="
+      "integrity": "sha1-ZjFBfV8OkJo9fsJrJMio0eT5bks=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
     },
     "postcss-convert-values": {
       "version": "2.6.1",
       "resolved": "https://registry.npmjs.org/postcss-convert-values/-/postcss-convert-values-2.6.1.tgz",
-      "integrity": "sha1-u9hZPFwf0uPRwyK7kl3K6Nrk1i0="
+      "integrity": "sha1-u9hZPFwf0uPRwyK7kl3K6Nrk1i0=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
     },
     "postcss-discard-comments": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/postcss-discard-comments/-/postcss-discard-comments-2.0.4.tgz",
-      "integrity": "sha1-vv6J+v1bPazlzM5Rt2uBUUvgDj0="
+      "integrity": "sha1-vv6J+v1bPazlzM5Rt2uBUUvgDj0=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
     },
     "postcss-discard-duplicates": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/postcss-discard-duplicates/-/postcss-discard-duplicates-2.1.0.tgz",
-      "integrity": "sha1-uavye4isGIFYpesSq8riAmO5GTI="
+      "integrity": "sha1-uavye4isGIFYpesSq8riAmO5GTI=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
     },
     "postcss-discard-empty": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/postcss-discard-empty/-/postcss-discard-empty-2.1.0.tgz",
-      "integrity": "sha1-0rS9nVztXr2Nyt52QMfXzX9PkrU="
+      "integrity": "sha1-0rS9nVztXr2Nyt52QMfXzX9PkrU=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
     },
     "postcss-discard-overridden": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/postcss-discard-overridden/-/postcss-discard-overridden-0.1.1.tgz",
-      "integrity": "sha1-ix6vVU9ob7KIzYdMVWZ7CqNmjVg="
+      "integrity": "sha1-ix6vVU9ob7KIzYdMVWZ7CqNmjVg=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
     },
     "postcss-discard-unused": {
       "version": "2.2.3",
       "resolved": "https://registry.npmjs.org/postcss-discard-unused/-/postcss-discard-unused-2.2.3.tgz",
-      "integrity": "sha1-vOMLLMWR/8Y0Mitfs0ZLbZNPRDM="
+      "integrity": "sha1-vOMLLMWR/8Y0Mitfs0ZLbZNPRDM=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
     },
     "postcss-filter-plugins": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/postcss-filter-plugins/-/postcss-filter-plugins-2.0.2.tgz",
-      "integrity": "sha1-bYWGJTTXNaxCDkqFgG4fXUKG2Ew="
+      "integrity": "sha1-bYWGJTTXNaxCDkqFgG4fXUKG2Ew=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
     },
     "postcss-load-config": {
       "version": "1.2.0",
@@ -8582,182 +9106,446 @@
       "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-1.3.3.tgz",
       "integrity": "sha1-piHqH6KQYqg5cqRvVEhncTAZFus=",
       "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
         "loader-utils": {
           "version": "1.1.0",
           "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
           "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
     "postcss-merge-idents": {
       "version": "2.1.7",
       "resolved": "https://registry.npmjs.org/postcss-merge-idents/-/postcss-merge-idents-2.1.7.tgz",
-      "integrity": "sha1-TFUwMTwI4dWzu/PSu8dH4njuonA="
-    },
-    "postcss-merge-longhand": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/postcss-merge-longhand/-/postcss-merge-longhand-2.0.2.tgz",
-      "integrity": "sha1-I9kM0Sewp3mUkVMyc5A0oaTz1lg="
-    },
-    "postcss-merge-rules": {
-      "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/postcss-merge-rules/-/postcss-merge-rules-2.1.2.tgz",
-      "integrity": "sha1-0d9d+qexrMO+VT8OnhDofGG19yE=",
+      "integrity": "sha1-TFUwMTwI4dWzu/PSu8dH4njuonA=",
       "dependencies": {
-        "browserslist": {
-          "version": "1.7.7",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
-          "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk="
-        }
-      }
-    },
-    "postcss-message-helpers": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-message-helpers/-/postcss-message-helpers-2.0.0.tgz",
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
+    },
+    "postcss-merge-longhand": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/postcss-merge-longhand/-/postcss-merge-longhand-2.0.2.tgz",
+      "integrity": "sha1-I9kM0Sewp3mUkVMyc5A0oaTz1lg=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
+    },
+    "postcss-merge-rules": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/postcss-merge-rules/-/postcss-merge-rules-2.1.2.tgz",
+      "integrity": "sha1-0d9d+qexrMO+VT8OnhDofGG19yE=",
+      "dependencies": {
+        "browserslist": {
+          "version": "1.7.7",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
+          "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
+    },
+    "postcss-message-helpers": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-message-helpers/-/postcss-message-helpers-2.0.0.tgz",
       "integrity": "sha1-pPL0+rbk/gAvCu0ABHjN9S+bpg4="
     },
     "postcss-minify-font-values": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/postcss-minify-font-values/-/postcss-minify-font-values-1.0.5.tgz",
-      "integrity": "sha1-S1jttWZB66fIR0qzUmyv17vey2k="
+      "integrity": "sha1-S1jttWZB66fIR0qzUmyv17vey2k=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
     },
     "postcss-minify-gradients": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/postcss-minify-gradients/-/postcss-minify-gradients-1.0.5.tgz",
-      "integrity": "sha1-Xb2hE3NwP4PPtKPqOIHY11/15uE="
-    },
-    "postcss-minify-params": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/postcss-minify-params/-/postcss-minify-params-1.2.2.tgz",
-      "integrity": "sha1-rSzgcTc7lDs9kwo/pZo1jCjW8fM="
-    },
-    "postcss-minify-selectors": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/postcss-minify-selectors/-/postcss-minify-selectors-2.1.1.tgz",
-      "integrity": "sha1-ssapjAByz5G5MtGkllCBFDEXNb8="
-    },
-    "postcss-modules": {
-      "version": "0.6.4",
-      "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.6.4.tgz",
-      "integrity": "sha1-d6WLt3uhtDkrJwwLWYUv116JqLQ="
-    },
-    "postcss-modules-extract-imports": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-1.1.0.tgz",
-      "integrity": "sha1-thTJcgvmgW6u41+zpfqh26agXds=",
+      "integrity": "sha1-Xb2hE3NwP4PPtKPqOIHY11/15uE=",
       "dependencies": {
-        "has-flag": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
-          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
         },
         "postcss": {
-          "version": "6.0.9",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.9.tgz",
-          "integrity": "sha512-bBE2AHNEBhF23TfET6AA/lFP8ah+qHOZoFJEflFG+HgvVLdTmMOrocx/4LVVDIn3w6jUssw1q2Exk1cc9UOI8w=="
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
         },
         "supports-color": {
-          "version": "4.2.1",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
-          "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
-    "postcss-modules-local-by-default": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-1.2.0.tgz",
-      "integrity": "sha1-99gMOYxaOT+nlkRmvRlQCn1hwGk=",
+    "postcss-minify-params": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/postcss-minify-params/-/postcss-minify-params-1.2.2.tgz",
+      "integrity": "sha1-rSzgcTc7lDs9kwo/pZo1jCjW8fM=",
       "dependencies": {
-        "has-flag": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
-          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
         },
         "postcss": {
-          "version": "6.0.9",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.9.tgz",
-          "integrity": "sha512-bBE2AHNEBhF23TfET6AA/lFP8ah+qHOZoFJEflFG+HgvVLdTmMOrocx/4LVVDIn3w6jUssw1q2Exk1cc9UOI8w=="
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
         },
         "supports-color": {
-          "version": "4.2.1",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
-          "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
-    "postcss-modules-scope": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-1.1.0.tgz",
-      "integrity": "sha1-1upkmUx5+XtipytCb75gVqGUu5A=",
+    "postcss-minify-selectors": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/postcss-minify-selectors/-/postcss-minify-selectors-2.1.1.tgz",
+      "integrity": "sha1-ssapjAByz5G5MtGkllCBFDEXNb8=",
       "dependencies": {
-        "has-flag": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
-          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
         },
         "postcss": {
-          "version": "6.0.9",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.9.tgz",
-          "integrity": "sha512-bBE2AHNEBhF23TfET6AA/lFP8ah+qHOZoFJEflFG+HgvVLdTmMOrocx/4LVVDIn3w6jUssw1q2Exk1cc9UOI8w=="
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
         },
         "supports-color": {
-          "version": "4.2.1",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
-          "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
+    "postcss-modules": {
+      "version": "0.8.0",
+      "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.8.0.tgz",
+      "integrity": "sha1-qdAYBt/+GcJgfe6I6hy9gNwFmZI="
+    },
+    "postcss-modules-extract-imports": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-1.1.0.tgz",
+      "integrity": "sha1-thTJcgvmgW6u41+zpfqh26agXds="
+    },
+    "postcss-modules-local-by-default": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-1.2.0.tgz",
+      "integrity": "sha1-99gMOYxaOT+nlkRmvRlQCn1hwGk="
+    },
+    "postcss-modules-scope": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-1.1.0.tgz",
+      "integrity": "sha1-1upkmUx5+XtipytCb75gVqGUu5A="
+    },
     "postcss-modules-values": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/postcss-modules-values/-/postcss-modules-values-1.3.0.tgz",
-      "integrity": "sha1-7P+p1+GSUYOJ9CrQ6D9yrsRW6iA=",
+      "integrity": "sha1-7P+p1+GSUYOJ9CrQ6D9yrsRW6iA="
+    },
+    "postcss-normalize-charset": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/postcss-normalize-charset/-/postcss-normalize-charset-1.1.1.tgz",
+      "integrity": "sha1-757nEhLX/nWceO0WL2HtYrXLk/E=",
       "dependencies": {
-        "has-flag": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
-          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
         },
         "postcss": {
-          "version": "6.0.9",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.9.tgz",
-          "integrity": "sha512-bBE2AHNEBhF23TfET6AA/lFP8ah+qHOZoFJEflFG+HgvVLdTmMOrocx/4LVVDIn3w6jUssw1q2Exk1cc9UOI8w=="
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
         },
         "supports-color": {
-          "version": "4.2.1",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
-          "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
-    "postcss-normalize-charset": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/postcss-normalize-charset/-/postcss-normalize-charset-1.1.1.tgz",
-      "integrity": "sha1-757nEhLX/nWceO0WL2HtYrXLk/E="
-    },
     "postcss-normalize-url": {
       "version": "3.0.8",
       "resolved": "https://registry.npmjs.org/postcss-normalize-url/-/postcss-normalize-url-3.0.8.tgz",
-      "integrity": "sha1-EI90s/L82viRov+j6kWSJ5/HgiI="
+      "integrity": "sha1-EI90s/L82viRov+j6kWSJ5/HgiI=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
     },
     "postcss-ordered-values": {
       "version": "2.2.3",
       "resolved": "https://registry.npmjs.org/postcss-ordered-values/-/postcss-ordered-values-2.2.3.tgz",
-      "integrity": "sha1-7sbCpntsQSqNsgQud/6NpD+VwR0="
+      "integrity": "sha1-7sbCpntsQSqNsgQud/6NpD+VwR0=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
     },
     "postcss-reduce-idents": {
       "version": "2.4.0",
       "resolved": "https://registry.npmjs.org/postcss-reduce-idents/-/postcss-reduce-idents-2.4.0.tgz",
-      "integrity": "sha1-wsbSDMlYKE9qv75j92Cb9AkFmtM="
+      "integrity": "sha1-wsbSDMlYKE9qv75j92Cb9AkFmtM=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
     },
     "postcss-reduce-initial": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/postcss-reduce-initial/-/postcss-reduce-initial-1.0.1.tgz",
-      "integrity": "sha1-aPgGlfBF0IJjqHmtJA343WT2ROo="
+      "integrity": "sha1-aPgGlfBF0IJjqHmtJA343WT2ROo=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
     },
     "postcss-reduce-transforms": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/postcss-reduce-transforms/-/postcss-reduce-transforms-1.0.4.tgz",
-      "integrity": "sha1-/3b02CEkN7McKYpC0uFEQCV3GuE="
+      "integrity": "sha1-/3b02CEkN7McKYpC0uFEQCV3GuE=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
     },
     "postcss-selector-parser": {
       "version": "2.2.3",
@@ -8767,12 +9555,60 @@
     "postcss-svgo": {
       "version": "2.1.6",
       "resolved": "https://registry.npmjs.org/postcss-svgo/-/postcss-svgo-2.1.6.tgz",
-      "integrity": "sha1-tt8YqmE7Zm4TPwittSGcJoSsEI0="
+      "integrity": "sha1-tt8YqmE7Zm4TPwittSGcJoSsEI0=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
     },
     "postcss-unique-selectors": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/postcss-unique-selectors/-/postcss-unique-selectors-2.0.2.tgz",
-      "integrity": "sha1-mB1X0p3csz57Hf4f1DuGSfkzyh0="
+      "integrity": "sha1-mB1X0p3csz57Hf4f1DuGSfkzyh0=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
     },
     "postcss-value-parser": {
       "version": "3.3.0",
@@ -8782,7 +9618,31 @@
     "postcss-zindex": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/postcss-zindex/-/postcss-zindex-2.2.0.tgz",
-      "integrity": "sha1-0hCd3AVbka9n/EyzsCWUZjnSryI="
+      "integrity": "sha1-0hCd3AVbka9n/EyzsCWUZjnSryI=",
+      "dependencies": {
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
     },
     "prelude-ls": {
       "version": "1.1.2",
@@ -9102,6 +9962,11 @@
       "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.3.2.tgz",
       "integrity": "sha1-0ZQcZ7rUN+G+dkM63Vs4X5WxkmA="
     },
+    "regenerator-runtime": {
+      "version": "0.11.0",
+      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.0.tgz",
+      "integrity": "sha512-/aA0kLeRb5N9K0d4fw7ooEbI+xDe+DKD499EQqygGqeS8N3xto15p09uY2xj7ixP81sNPXvRLnAQIqdVStgb1A=="
+    },
     "regex-cache": {
       "version": "0.4.3",
       "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.3.tgz",
@@ -9522,6 +10387,11 @@
       "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-1.0.0.tgz",
       "integrity": "sha1-2kL0l0DAtC2yypcoVxyxkMmO/qM="
     },
+    "shell-quote": {
+      "version": "1.6.1",
+      "resolved": "https://registry.npmjs.org/shell-quote/-/shell-quote-1.6.1.tgz",
+      "integrity": "sha1-9HgZSczkAmlxJ0MOo7PFR29IF2c="
+    },
     "shellwords": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/shellwords/-/shellwords-0.1.1.tgz",
@@ -9952,6 +10822,11 @@
         }
       }
     },
+    "subarg": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/subarg/-/subarg-1.0.0.tgz",
+      "integrity": "sha1-9izxdYHplrSPyWVpn1TAauJouNI="
+    },
     "sudo": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/sudo/-/sudo-1.0.3.tgz",
diff --git a/package.json b/package.json
index bac819f462a7c..3c2bdead96b97 100644
--- a/package.json
+++ b/package.json
@@ -10,7 +10,7 @@
   "scripts": {
     "_rushInstall": "node node_modules/@microsoft/rush/bin/rush install -c",
     "_rushBuild": "node node_modules/@microsoft/rush/bin/rush build --verbose",
-    "_rushBuildToFabric": "node node_modules/@microsoft/rush/bin/rush build --to office-ui-fabric-react",
+    "_rushBuildToFabric": "node node_modules/@microsoft/rush/bin/rush build --to office-ui-fabric-react --verbose",
     "_rushRebuild": "node node_modules/@microsoft/rush/bin/rush rebuild --production --verbose",
     "_rushRebuildFast": "node node_modules/@microsoft/rush/bin/rush rebuild --verbose",
     "postinstall": "npm run _rushInstall && npm run _rushBuildToFabric",
diff --git a/packages/example-app-base/src/common/_common.scss b/packages/example-app-base/src/common/_common.scss
index a135ab74ac2e3..56c0e7b28b5d3 100644
--- a/packages/example-app-base/src/common/_common.scss
+++ b/packages/example-app-base/src/common/_common.scss
@@ -1,4 +1,4 @@
-@import '~office-ui-fabric-core/dist/sass/References';
+@import '~office-ui-fabric-react/dist/sass/References';
 @import './i18n';
 @import './themeOverrides';
 @import './focusBorder';
diff --git a/packages/example-app-base/src/common/_semanticColorVariables.scss b/packages/example-app-base/src/common/_semanticColorVariables.scss
index 3a27348fcdcd0..63b2047422cec 100644
--- a/packages/example-app-base/src/common/_semanticColorVariables.scss
+++ b/packages/example-app-base/src/common/_semanticColorVariables.scss
@@ -1,3 +1,5 @@
+@import './themeOverrides';
+
 $focusedBorderColor: $ms-color-neutralSecondary;
 
 $bodyBackgroundColor: $ms-color-white;
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.scss b/packages/experiments/src/components/CommandBar/CommandBar.scss
index 22ba0a13c4fff..788b808fc0435 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.scss
+++ b/packages/experiments/src/components/CommandBar/CommandBar.scss
@@ -1,4 +1,4 @@
-@import '../../../../office-ui-fabric-react/src/common/common';
+@import '~office-ui-fabric-react/src/common/common';
 
 .root {
   display: flex;
diff --git a/packages/experiments/src/components/Tile/Tile.scss b/packages/experiments/src/components/Tile/Tile.scss
index bb6340cef9fad..ff61e4e6caab9 100644
--- a/packages/experiments/src/components/Tile/Tile.scss
+++ b/packages/experiments/src/components/Tile/Tile.scss
@@ -1,5 +1,5 @@
 
-@import '../../../../office-ui-fabric-react/src/common/common';
+@import '~office-ui-fabric-react/src/common/common';
 
 .tile {
   @include focus-clear();
diff --git a/packages/experiments/src/components/TilesList/TilesList.scss b/packages/experiments/src/components/TilesList/TilesList.scss
index 4c2e0eecd533b..a20f279914f55 100644
--- a/packages/experiments/src/components/TilesList/TilesList.scss
+++ b/packages/experiments/src/components/TilesList/TilesList.scss
@@ -1,5 +1,5 @@
 
-@import '../../../../office-ui-fabric-react/src/common/common';
+@import '~office-ui-fabric-react/src/common/common';
 
 .listCell {
   display: block;
diff --git a/packages/experiments/src/components/signals/Signals.scss b/packages/experiments/src/components/signals/Signals.scss
index c2d8bcfd62aca..7b4e6efe9f094 100644
--- a/packages/experiments/src/components/signals/Signals.scss
+++ b/packages/experiments/src/components/signals/Signals.scss
@@ -1,5 +1,5 @@
 
-@import '../../../../office-ui-fabric-react/src/common/common';
+@import '~office-ui-fabric-react/src/common/common';
 
 .signal {
   display: inline-block;
@@ -14,7 +14,7 @@
   }
 }
 
-.new {
+.newItem {
   width: 0;
   height: 1em;
   position: relative;
diff --git a/packages/experiments/src/components/signals/Signals.tsx b/packages/experiments/src/components/signals/Signals.tsx
index 28815b85481f3..841f57e3fe49c 100644
--- a/packages/experiments/src/components/signals/Signals.tsx
+++ b/packages/experiments/src/components/signals/Signals.tsx
@@ -87,7 +87,7 @@ export const SomeoneCheckedOutSignal: Signal = (props: ISignalProps): JSX.Elemen
  */
 export const NewSignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
-    <span className={ css(SignalStyles.signal, SignalStyles.new) }>
+    <span className={ css(SignalStyles.signal, SignalStyles.newItem) }>
       <Icon className={ css(SignalStyles.newIcon) } iconName='glimmer' />
     </span>
   );
diff --git a/packages/office-ui-fabric-react/config/pre-copy.json b/packages/office-ui-fabric-react/config/pre-copy.json
new file mode 100644
index 0000000000000..be6f0a795c4d4
--- /dev/null
+++ b/packages/office-ui-fabric-react/config/pre-copy.json
@@ -0,0 +1,10 @@
+{
+  "copyTo": {
+    "dist/sass": [
+      "node_modules/office-ui-fabric-core/dist/sass/**/*"
+    ],
+    "dist/css": [
+      "node_modules/office-ui-fabric-core/dist/css/**/*"
+    ]
+  }
+}
\ No newline at end of file
diff --git a/packages/utilities/src/scroll.scss b/packages/utilities/src/scroll.scss
index a9e46eeca17ca..3760891597970 100644
--- a/packages/utilities/src/scroll.scss
+++ b/packages/utilities/src/scroll.scss
@@ -1,5 +1,6 @@
 // Note: due to this being attached to body, we'll make the variable Fabric specific to be clear where it
 // is coming from.
-.msFabricScrollDisabled {
+.scrollDisabled {
   overflow: hidden !important;
+  user-select: none;
 }
diff --git a/packages/utilities/src/scroll.ts b/packages/utilities/src/scroll.ts
index a0f43c33fefad..e8dc32dc02357 100644
--- a/packages/utilities/src/scroll.ts
+++ b/packages/utilities/src/scroll.ts
@@ -1,5 +1,5 @@
 import { getDocument } from './dom';
-import styles from './scroll.scss';
+import * as styles from './scroll.scss';
 
 let _scrollbarWidth: number;
 let _bodyScrollDisabledCount = 0;
@@ -22,7 +22,7 @@ export function disableBodyScroll() {
   let doc = getDocument();
 
   if (doc && doc.body && !_bodyScrollDisabledCount) {
-    doc.body.classList.add(styles.msFabricScrollDisabled);
+    doc.body.classList.add(styles.scrollDisabled);
   }
 
   _bodyScrollDisabledCount++;
@@ -38,7 +38,7 @@ export function enableBodyScroll() {
     let doc = getDocument();
 
     if (doc && doc.body && _bodyScrollDisabledCount === 1) {
-      doc.body.classList.remove(styles.msFabricScrollDisabled);
+      doc.body.classList.remove(styles.scrollDisabled);
     }
 
     _bodyScrollDisabledCount--;
diff --git a/scripts/build.js b/scripts/build.js
index cf2569d20db76..29ba8d2f0b2df 100644
--- a/scripts/build.js
+++ b/scripts/build.js
@@ -1,13 +1,43 @@
 const isProduction = process.argv.indexOf('--production') > -1;
+const chalk = require('chalk');
+const { logStartTask, logEndTask } = require('./logging');
+
+let tasks = [
+  'copy',
+  'sass',
+  'tslint',
+  'ts',
+  'karma',
+  'webpack'
+];
 
 if (process.argv.length >= 3 && process.argv[2].indexOf('--') === -1) {
-  require('./tasks/' + process.argv[2])({ isProduction });
-} else {
-  [
-    'sass',
-    'tslint',
-    'ts',
-    'karma',
-    'webpack'
-  ].forEach(task => require('./tasks/' + task)({ isProduction }));
+  tasks = [process.argv[2]];
 }
+
+let promise = Promise.resolve();
+let hasFailures = false;
+
+tasks.forEach(task => {
+  promise = promise.then(() => runTask(task));
+});
+
+promise.then(() => {
+  if (hasFailures) {
+    process.exitCode = 1;
+  }
+});
+
+function runTask(task) {
+  let start = new Date().getTime();
+
+  return Promise.resolve()
+    .then(() => !hasFailures && Promise.resolve()
+      .then(() => logStartTask(task))
+      .then(() => require('./tasks/' + task)({ isProduction }))
+      .then(() => logEndTask(task, new Date().getTime() - start))
+      .catch((e) => {
+        hasFailures = true;
+        logEndTask(task, new Date().getTime() - start, e);
+      }));
+}
\ No newline at end of file
diff --git a/scripts/exec-sync.js b/scripts/exec-sync.js
index 4ca203d79e513..6767f17b7b5b8 100644
--- a/scripts/exec-sync.js
+++ b/scripts/exec-sync.js
@@ -11,46 +11,11 @@ function myExecSync(cmd, displayName) {
   let returnValue = 0;
   let start = new Date().getTime();
 
-  console.log(
-    `${
-    chalk.white('[') + chalk.gray(new Date().toLocaleTimeString({ hour12: false })) + chalk.white('] Starting:')
-    } ${
-    chalk.cyan(displayName || cmd)
-    }`);
-
-  try {
-    const output = execSync(cmd, {
-      cwd: process.cwd(),
-      env: env,
-      stdio: 'inherit'
-    });
-  } catch (ex) {
-    returnValue = ex.status;
-  }
-
-  console.log(
-    `${
-    chalk.white('[') + chalk.gray(new Date().toLocaleTimeString({ hour12: false })) + chalk.white('] Ending:')
-    } ${
-    chalk.white('(') + (returnValue !== 0 ? chalk.red('Error') : chalk.green('Pass')) + chalk.white(') ') +
-    chalk.cyan(displayName || cmd) +
-    chalk.white(' (') + chalk.yellow(formatTime(new Date().getTime() - start)) + chalk.white(')')
-    }`);
-
-  if (returnValue !== 0) {
-    console.error(`The task "${chalk.cyan(displayName || cmd)}" failed.`);
-    process.exit(returnValue);
-  }
-
-  return returnValue;
-}
-
-function formatTime(milliseconds) {
-  if (milliseconds >= 1000) {
-    return (milliseconds / 1000) + 's';
-  } else {
-    return milliseconds + 'ms';
-  }
+  const output = execSync(cmd, {
+    cwd: process.cwd(),
+    env: env,
+    stdio: 'inherit'
+  });
 }
 
 module.exports = myExecSync;
diff --git a/scripts/logging.js b/scripts/logging.js
new file mode 100644
index 0000000000000..9f0068660ac38
--- /dev/null
+++ b/scripts/logging.js
@@ -0,0 +1,33 @@
+const chalk = require('chalk');
+
+module.exports.logStartTask = (task) => {
+  console.log(
+    `${
+    chalk.white('[') + chalk.gray(new Date().toLocaleTimeString({ hour12: false })) + chalk.white('] Starting:')
+    } ${
+    chalk.cyan(task)
+    }`);
+};
+
+module.exports.logEndTask = (task, duration, errorMessage) => {
+  console.log(
+    `[${
+    chalk.gray(new Date().toLocaleTimeString({ hour12: false }))
+    }] ${
+    (errorMessage === undefined ? chalk.green('Pass') : chalk.red('Error'))
+    }: ${
+    chalk.cyan(task)
+    } (${
+    chalk.yellow(formatTime(duration))
+    })${
+    errorMessage ? (chalk.white(': ') + chalk.red(errorMessage)) : ''
+    }`);
+}
+
+function formatTime(milliseconds) {
+  if (milliseconds >= 1000) {
+    return (milliseconds / 1000) + 's';
+  } else {
+    return milliseconds + 'ms';
+  }
+}
diff --git a/scripts/package.json b/scripts/package.json
index c9e315b101608..859d61e93c4cd 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -7,9 +7,15 @@
     "build": "node -v"
   },
   "devDependencies": {
+    "autoprefixer": "^7.1.2",
     "chalk": "^2.1.0",
+    "cpx": "^1.5.0",
     "github": "^7.0.0",
+    "glob": "^7.1.2",
     "gulp": "^3.9.1",
+    "node-sass": "^4.5.3",
+    "postcss": "^6.0.9",
+    "postcss-modules": "^0.8.0",
     "tslint": "^5.6.0",
     "tslint-microsoft-contrib": "^5.0.1",
     "typescript": "2.4.2",
diff --git a/scripts/tasks/copy.js b/scripts/tasks/copy.js
new file mode 100644
index 0000000000000..f9e543d210d7c
--- /dev/null
+++ b/scripts/tasks/copy.js
@@ -0,0 +1,44 @@
+
+module.exports = function (options) {
+  const { logStartTask, logEndTask } = require('../logging');
+  const path = require('path');
+  const fs = require('fs');
+
+  configPath = path.resolve(process.cwd(), 'config/pre-copy.json');
+
+  if (!fs.existsSync(configPath)) {
+    return;
+  }
+
+  const config = JSON.parse(fs.readFileSync(configPath, 'utf8'));
+  let promise = Promise.resolve();
+
+  if (config && config.copyTo) {
+    for (let destination in config.copyTo) {
+      const sources = config.copyTo[destination];
+
+      for (let source of sources) {
+        source = path.resolve(process.cwd(), source);
+        destination = path.resolve(process.cwd(), destination);
+        startCopy(source, destination);
+      }
+    }
+  }
+
+  return promise;
+
+  function startCopy(source, destination) {
+    promise = promise.then(() => new Promise((resolve, reject) => {
+      const copy = require('cpx').copy;
+
+      console.log(`  Copying "${path.relative(process.cwd(), source)}" to "${path.relative(process.cwd(), destination)}"`);
+      copy(source, destination, (err) => {
+        if (err) {
+          reject(err);
+        } else {
+          resolve();
+        }
+      });
+    }));
+  }
+};
\ No newline at end of file
diff --git a/scripts/tasks/sass.js b/scripts/tasks/sass.js
index 1ff6ec305741a..c63e98ebe4f85 100644
--- a/scripts/tasks/sass.js
+++ b/scripts/tasks/sass.js
@@ -1,5 +1,90 @@
 module.exports = function (options) {
   const execSync = require('../exec-sync');
+  const glob = require('glob');
+  const sass = require('node-sass');
+  const path = require('path');
+  const fs = require('fs');
+  const postcss = require('postcss');
+  const autoprefixer = require('autoprefixer')({ browsers: ['> 1%', 'last 2 versions', 'ie >= 11'] });
+  const modules = require('postcss-modules')({
+    getJSON,
+    generateScopedName
+  });
+  const _fileNameToClassMap = {};
 
-  execSync('gulp sass');
-};
+  // Return a promise.
+  return processFiles();
+
+  function processFiles() {
+    const promises = [];
+
+    glob.sync(path.resolve(process.cwd(), 'src/**/*.scss')).forEach(fileName => {
+      promises.push(new Promise((resolve, reject) => {
+        sass.render(
+          {
+            file: fileName,
+            outputStyle: 'compressed',
+            importer: patchSassUrl,
+            includePaths: [
+              path.resolve(process.cwd(), 'node_modules')
+            ]
+          },
+          (err, result) => {
+            if (err) {
+              reject(path.relative(process.cwd(), fileName) + ': ' + err);
+            } else {
+              const css = result.css.toString();
+
+              postcss([autoprefixer, modules])
+                .process(css, { from: fileName })
+                .then(result => {
+                  fs.writeFileSync(fileName + '.ts', createTypeScriptModule(fileName, result.css));
+                  resolve();
+                });
+            }
+          });
+      }));
+    });
+
+    return Promise.all(promises);
+  }
+
+  function generateScopedName(name, fileName, css) {
+    const crypto = require('crypto');
+
+    return name + '_' + crypto.createHmac('sha1', fileName).update(css).digest('hex').substring(0, 8);
+  }
+
+  function getJSON(cssFileName, json) {
+    _fileNameToClassMap[cssFileName] = json;
+  }
+
+  function createTypeScriptModule(fileName, css) {
+    // Create a source file.
+    const source = [
+      `/* tslint:disable */`,
+      `import { loadStyles } from \'@microsoft/load-themed-styles\';`,
+      `loadStyles(${JSON.stringify(css)});`
+    ];
+    const map = _fileNameToClassMap[fileName];
+
+    for (let prop in map) {
+      source.push(`export const ${prop} = "${map[prop]}";`);
+    }
+
+    return source.join('\n');
+  }
+
+  function patchSassUrl(url, prev, done) {
+    let newUrl = url;
+
+    if (url[0] === '~') {
+      newUrl = path.resolve(process.cwd(), 'node_modules', url.substr(1));
+    }
+    else if (url === 'stdin') {
+      newUrl = '';
+    }
+
+    return { file: newUrl };
+  }
+};
\ No newline at end of file

From 4851f696d5579d213c70ecea143392b228c5c6cf Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Tue, 22 Aug 2017 22:29:46 -0700
Subject: [PATCH 0465/1641] Self-closed empty elements in experiments pkg to
 pass tslint (#2585)

* Self close empty elements in experiments pkg - tslint

* Add change file
---
 .../experiments-self-close_2017-08-23-00-41.json      | 11 +++++++++++
 .../src/components/CommandBar/CommandBarPage.tsx      |  5 ++---
 .../src/components/TilesList/TilesListPage.tsx        |  5 ++---
 packages/experiments/tslint.json                      |  1 -
 4 files changed, 15 insertions(+), 7 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/experiments-self-close_2017-08-23-00-41.json

diff --git a/common/changes/@uifabric/experiments/experiments-self-close_2017-08-23-00-41.json b/common/changes/@uifabric/experiments/experiments-self-close_2017-08-23-00-41.json
new file mode 100644
index 0000000000000..9a04d96cd2b02
--- /dev/null
+++ b/common/changes/@uifabric/experiments/experiments-self-close_2017-08-23-00-41.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Removed suppression of tslint self-close rule from Experiments package and self-closed all empty elements to pass tslint",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "a.erich@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/CommandBarPage.tsx b/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
index 36bfbfda119fb..36a9a24e67eb3 100644
--- a/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
@@ -50,7 +50,7 @@ export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}>
         }
         /* tslint:enable:max-line-length */
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -76,8 +76,7 @@ export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}>
           <a href='https://dev.office.com/fabric-js/Components/CommandBar/CommandBar.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 
diff --git a/packages/experiments/src/components/TilesList/TilesListPage.tsx b/packages/experiments/src/components/TilesList/TilesListPage.tsx
index b6b08dfc3ad8a..768f5815e66e4 100644
--- a/packages/experiments/src/components/TilesList/TilesListPage.tsx
+++ b/packages/experiments/src/components/TilesList/TilesListPage.tsx
@@ -57,7 +57,7 @@ export class TilesListPage extends React.Component<IComponentDemoPageProps, {}>
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -74,8 +74,7 @@ export class TilesListPage extends React.Component<IComponentDemoPageProps, {}>
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/experiments/tslint.json b/packages/experiments/tslint.json
index 940d29c140ebc..2d6bb7b6e6bb8 100644
--- a/packages/experiments/tslint.json
+++ b/packages/experiments/tslint.json
@@ -4,7 +4,6 @@
   ],
   "rules": {
     "jsx-ban-props": false,
-    "jsx-self-close": false,
     "jsx-no-multiline-js": false,
     "no-any": false,
     "typedef": [

From b9a635fd582cbf04becda07d89edb98a8263fcfa Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Tue, 22 Aug 2017 22:57:49 -0700
Subject: [PATCH 0466/1641] ContextualMenu: Add ability to provide a role for a
 menu item (#2582)

* Add ability to provide role on contextual menu item

* Rush change
---
 .../contextual-menu-role_2017-08-22-23-33.json        | 11 +++++++++++
 .../components/ContextualMenu/ContextualMenu.Props.ts |  8 +++++++-
 .../src/components/ContextualMenu/ContextualMenu.tsx  |  3 ++-
 3 files changed, 20 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/contextual-menu-role_2017-08-22-23-33.json

diff --git a/common/changes/office-ui-fabric-react/contextual-menu-role_2017-08-22-23-33.json b/common/changes/office-ui-fabric-react/contextual-menu-role_2017-08-22-23-33.json
new file mode 100644
index 0000000000000..5eff8d4357bbf
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/contextual-menu-role_2017-08-22-23-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: Add ability to override role on menu items",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
index 086b5cacd2d2a..6a8a760d816ed 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
@@ -295,7 +295,7 @@ export interface IContextualMenuItem {
 
   /**
    * Optional accessibility label (aria-label) attribute that will be stamped on to the element.
-   * If none is specified, the arai-label attribute will contain the item name
+   * If none is specified, the aria-label attribute will contain the item name
    */
   ariaLabel?: string;
 
@@ -319,6 +319,12 @@ export interface IContextualMenuItem {
    */
   onMouseDown?: (item: IContextualMenuItem, event: any) => void;
 
+  /**
+   * Optional override for the role attribute on the menu button. If one is not provided, it will
+   * have a value of menuitem or menuitemcheckbox.
+   */
+  role?: string;
+
   /**
    * Any additional properties to use when custom rendering menu items.
    */
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 3b783cde55e67..650a624a5c24d 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -388,6 +388,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
     const isChecked: boolean | null | undefined = getIsChecked(item);
     const canCheck: boolean = isChecked !== null;
+    const defaultRole = canCheck ? 'menuitemcheckbox' : 'menuitem';
 
     const itemButtonProperties = {
       className: css('ms-ContextualMenu-link', styles.link, {
@@ -408,7 +409,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       'aria-posinset': focusableElementIndex + 1,
       'aria-setsize': totalItemCount,
       'aria-disabled': item.isDisabled,
-      role: canCheck ? 'menuitemcheckbox' : 'menuitem',
+      role: item.role || defaultRole,
       style: item.style
     };
 

From 2d179149380245f586834535299b5832094bee6d Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Wed, 23 Aug 2017 10:04:55 -0700
Subject: [PATCH 0467/1641] Updated to latest Fabric Core CDN (#2563)

* Updated to latest Fabric Core CDN

* added change file
---
 .../src/pages/GetStarted/GetStartedPage.tsx           |  2 +-
 .../emlynam-update-cdn_2017-08-22-15-57.json          | 11 +++++++++++
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/fabric-website/emlynam-update-cdn_2017-08-22-15-57.json

diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
index c1b1557e80747..652b4bdd1d8e5 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
@@ -171,7 +171,7 @@ ReactDOM.render(<MyPage />, document.body.firstChild);`
               <p>Add the following line to the &lt;head&gt; of your webpage:</p>
               <CodeBlock language='html' isLightTheme={ true }>
                 {
-                  `<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/4.1.0/css/fabric.min.css">`
+                  `<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/7.2.0/css/fabric.min.css">`
                 }
               </CodeBlock>
             </li>
diff --git a/common/changes/@uifabric/fabric-website/emlynam-update-cdn_2017-08-22-15-57.json b/common/changes/@uifabric/fabric-website/emlynam-update-cdn_2017-08-22-15-57.json
new file mode 100644
index 0000000000000..cc1d898c71931
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/emlynam-update-cdn_2017-08-22-15-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Updated the CDN link on the \"Get Started\" page and section to an updated version of Fabric Core, 7.2.0",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gamil.com"
+}
\ No newline at end of file

From 852d8897c24f431188f4dd730e41537db00b5210 Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Wed, 23 Aug 2017 10:59:19 -0700
Subject: [PATCH 0468/1641] Dropdown: Adding htmlFor to dropdown labels (#2424)

* Adding for property to droprop labels

* Rush change

* Making aria-label only exist when label doesn't.

* Simplifying aria-label prop of dropdown
---
 .../v-krbrow-dropdown-for_2017-08-08-19-51.json       | 11 +++++++++++
 .../src/components/Dropdown/Dropdown.tsx              |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-dropdown-for_2017-08-08-19-51.json

diff --git a/common/changes/office-ui-fabric-react/v-krbrow-dropdown-for_2017-08-08-19-51.json b/common/changes/office-ui-fabric-react/v-krbrow-dropdown-for_2017-08-08-19-51.json
new file mode 100644
index 0000000000000..fe06d6cc2e0bc
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-dropdown-for_2017-08-08-19-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: adds a for property to dropdown labels.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 836737d1cf21d..24a533232e2b2 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -146,7 +146,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     return (
       <div ref='root' className={ css('ms-Dropdown-container') }>
         { label && (
-          <Label className={ css('ms-Dropdown-label') } id={ id + '-label' } ref={ this._resolveRef('_dropdownLabel') } required={ required }>{ label }</Label>
+          <Label className={ css('ms-Dropdown-label') } id={ id + '-label' } htmlFor={ id } ref={ this._resolveRef('_dropdownLabel') } required={ required }>{ label }</Label>
         ) }
         <div
           data-is-focusable={ !disabled }
@@ -156,7 +156,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
           aria-expanded={ isOpen ? 'true' : 'false' }
           role='menu'
           aria-live={ disabled || isOpen ? 'off' : 'assertive' }
-          aria-label={ ariaLabel || label }
+          aria-label={ ariaLabel }
           aria-describedby={ id + '-option' }
           aria-activedescendant={ isOpen && selectedIndex! >= 0 ? (this._id + '-list' + selectedIndex) : null }
           aria-disabled={ disabled }

From 3934332af3939fcb13224c71eac56ef195c48d8a Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Wed, 23 Aug 2017 11:37:48 -0700
Subject: [PATCH 0469/1641] Added missing typedefs to call signatures in
 experiments pkg to pass tslint (#2583)

* Add missing typedefs to call signatures in experiments pkg - tslint

* Added change file
---
 .../experiments-typedef_2017-08-23-00-24.json | 11 +++++++++++
 .../src/components/CommandBar/CommandBar.tsx  |  8 ++++----
 .../components/CommandBar/CommandBarPage.tsx  |  2 +-
 .../CommandBar/CommandBarPage.visualtest.tsx  |  2 +-
 .../examples/CommandBar.Basic.Example.tsx     |  2 +-
 .../experiments/src/components/Tile/Tile.tsx  | 18 +++++++++---------
 .../src/components/Tile/TilePage.tsx          |  2 +-
 .../Tile/examples/Tile.Document.Example.tsx   |  2 +-
 .../Tile/examples/Tile.Media.Example.tsx      |  2 +-
 .../src/components/TilesList/TilesList.tsx    | 10 +++++-----
 .../components/TilesList/TilesListPage.tsx    |  2 +-
 .../TilesList/examples/ExampleHelpers.tsx     |  6 +++---
 .../examples/TilesList.Basic.Example.tsx      |  4 ++--
 .../examples/TilesList.Document.Example.tsx   |  6 +++---
 .../examples/TilesList.Media.Example.tsx      |  6 +++---
 .../src/demo/GettingStartedPage.tsx           |  2 +-
 packages/experiments/src/demo/index.tsx       | 19 ++++++++++---------
 packages/experiments/tslint.json              |  5 +----
 18 files changed, 59 insertions(+), 50 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/experiments-typedef_2017-08-23-00-24.json

diff --git a/common/changes/@uifabric/experiments/experiments-typedef_2017-08-23-00-24.json b/common/changes/@uifabric/experiments/experiments-typedef_2017-08-23-00-24.json
new file mode 100644
index 0000000000000..6f90a298731e1
--- /dev/null
+++ b/common/changes/@uifabric/experiments/experiments-typedef_2017-08-23-00-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Added missing typedefs to call signatures in experiments, re-enable tslint rulefor typedef",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "a.erich@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.tsx b/packages/experiments/src/components/CommandBar/CommandBar.tsx
index 3a1ddc151752b..f9feed657bdd8 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBar.tsx
@@ -55,7 +55,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, any> implements
     this._id = getId('CommandBar');
   }
 
-  public render() {
+  public render(): JSX.Element {
     const {
       className,
       items,
@@ -123,7 +123,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, any> implements
     );
   }
 
-  public focus() {
+  public focus(): void {
     this._overflowSet.focus();
   }
 
@@ -178,7 +178,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, any> implements
   }
 
   @autobind
-  private _onRenderItems(item: ICommandBarItemProps) {
+  private _onRenderItems(item: ICommandBarItemProps): JSX.Element | React.ReactNode {
     let { buttonStyles } = this.props;
 
     if (item.onRender) { return item.onRender(item); }
@@ -203,7 +203,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, any> implements
   }
 
   @autobind
-  private _onRenderButton(props: ICommandBarItemProps) {
+  private _onRenderButton(props: ICommandBarItemProps): JSX.Element {
     return <CommandBarButton {...props as any} />;
   }
 }
diff --git a/packages/experiments/src/components/CommandBar/CommandBarPage.tsx b/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
index 36a9a24e67eb3..215ae0e8fba21 100644
--- a/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
@@ -12,7 +12,7 @@ import { CommandBarBasicExample } from './examples/CommandBar.Basic.Example';
 const CommandBarBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx') as string;
 
 export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}> {
-  public render() {
+  public render(): JSX.Element {
     let cmdBarParamsTextAndIcons: any = { items, overflowItems, farItems };
 
     return (
diff --git a/packages/experiments/src/components/CommandBar/CommandBarPage.visualtest.tsx b/packages/experiments/src/components/CommandBar/CommandBarPage.visualtest.tsx
index f5013fc5d698f..3c22234dda985 100644
--- a/packages/experiments/src/components/CommandBar/CommandBarPage.visualtest.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBarPage.visualtest.tsx
@@ -4,7 +4,7 @@ import { CommandBar } from './index';
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 export default class CommandBarVPage extends React.Component<any, any> {
-  public render() {
+  public render(): JSX.Element {
     return (
       <div style={ { width: '600px' } }>
         <CommandBar
diff --git a/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx b/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
index fbbb2e94c599d..8abe58bb10b4e 100644
--- a/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
+++ b/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
@@ -10,7 +10,7 @@ export class CommandBarBasicExample extends React.Component<any, any> {
     };
   }
 
-  public render() {
+  public render(): JSX.Element {
     let { items, overflowItems, farItems } = this.props;
 
     return (
diff --git a/packages/experiments/src/components/Tile/Tile.tsx b/packages/experiments/src/components/Tile/Tile.tsx
index c5870932d1a61..de202d0b7ca72 100644
--- a/packages/experiments/src/components/Tile/Tile.tsx
+++ b/packages/experiments/src/components/Tile/Tile.tsx
@@ -43,7 +43,7 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
     };
   }
 
-  public componentWillReceiveProps(nextProps: ITileProps) {
+  public componentWillReceiveProps(nextProps: ITileProps): void {
     const {
       selection,
       selectionIndex
@@ -63,7 +63,7 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
     }
   }
 
-  public componentDidMount() {
+  public componentDidMount(): void {
     const {
       selection
     } = this.props;
@@ -73,7 +73,7 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
     }
   }
 
-  public componentDidUpdate(previousProps: ITileProps) {
+  public componentDidUpdate(previousProps: ITileProps): void {
     const {
       selection
     } = this.props;
@@ -93,7 +93,7 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
     }
   }
 
-  public render() {
+  public render(): JSX.Element {
     const {
       children,
       selectionIndex = -1,
@@ -163,7 +163,7 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
     background
   }: {
       background: React.ReactNode | React.ReactNode[]
-    }) {
+    }): JSX.Element {
     return (
       <span className={ css('ms-Tile-background', TileStyles.background) }>
         { background }
@@ -177,7 +177,7 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
   }: {
       foreground: React.ReactNode | React.ReactNode[];
       showForegroundFrame: boolean;
-    }) {
+    }): JSX.Element {
     return (
       <span
         role='presentation'
@@ -206,7 +206,7 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
   }: {
       name: React.ReactNode | React.ReactNode[];
       activity: React.ReactNode | React.ReactNode[];
-    }) {
+    }): JSX.Element {
     return (
       <span
         className={ css('ms-Tile-nameplate', TileStyles.nameplate) }
@@ -239,7 +239,7 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
     isSelected
   }: {
       isSelected: boolean;
-    }) {
+    }): JSX.Element {
     return (
       <button
         aria-label={ this.props.toggleSelectionAriaLabel }
@@ -255,7 +255,7 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
   }
 
   @autobind
-  private _onSelectionChange() {
+  private _onSelectionChange(): void {
     const {
       selection,
       selectionIndex = -1
diff --git a/packages/experiments/src/components/Tile/TilePage.tsx b/packages/experiments/src/components/Tile/TilePage.tsx
index dbdc21f32e839..13523b143cc4a 100644
--- a/packages/experiments/src/components/Tile/TilePage.tsx
+++ b/packages/experiments/src/components/Tile/TilePage.tsx
@@ -13,7 +13,7 @@ import { TileDocumentExample } from './examples/Tile.Document.Example';
 const TileDocumentExampleCode = require('!raw-loader!experiments/src/components/Tile/examples/Tile.Document.Example.tsx') as string;
 
 export class TilePage extends React.Component<IComponentDemoPageProps, {}> {
-  public render() {
+  public render(): JSX.Element {
     return (
       <ComponentPage
         title='Tile'
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
index 5b1df0bb3ecac..1e0274f8756fe 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
@@ -15,7 +15,7 @@ import * as TileExampleStylesModule from './Tile.Example.scss';
 const TileExampleStyles = TileExampleStylesModule as any;
 
 export class TileDocumentExample extends React.Component<any, any> {
-  public render() {
+  public render(): JSX.Element {
     return (
       <div>
         <h3>Tiny document thumbnail</h3>
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
index 62c687f73f072..24e95115904b5 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
@@ -17,7 +17,7 @@ import * as TileExampleStylesModule from './Tile.Example.scss';
 const TileExampleStyles = TileExampleStylesModule as any;
 
 export class TileMediaExample extends React.Component<any, any> {
-  public render() {
+  public render(): JSX.Element {
     return (
       <div>
         <h3>Landscape</h3>
diff --git a/packages/experiments/src/components/TilesList/TilesList.tsx b/packages/experiments/src/components/TilesList/TilesList.tsx
index b8f85b2a084c3..f796b2ed0a002 100644
--- a/packages/experiments/src/components/TilesList/TilesList.tsx
+++ b/packages/experiments/src/components/TilesList/TilesList.tsx
@@ -75,7 +75,7 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
     };
   }
 
-  public componentWillReceiveProps(nextProps: ITilesListProps<TItem>) {
+  public componentWillReceiveProps(nextProps: ITilesListProps<TItem>): void {
     if (nextProps.items !== this.props.items) {
       this.setState({
         cells: this._getCells(nextProps.items)
@@ -83,13 +83,13 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
     }
   }
 
-  public componentWillUpdate(nextProps: ITilesListProps<TItem>, nextState: ITilesListState<TItem>) {
+  public componentWillUpdate(nextProps: ITilesListProps<TItem>, nextState: ITilesListState<TItem>): void {
     if (nextState.cells !== this.state.cells) {
       this._pageSpecificationCache = undefined;
     }
   }
 
-  public render() {
+  public render(): JSX.Element {
     const {
       selection
     } = this.props;
@@ -124,7 +124,7 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
     );
   }
 
-  private _onRenderCell(item: ITileCell<TItem>, finalSize: ITileSize) {
+  private _onRenderCell(item: ITileCell<TItem>, finalSize: ITileSize): JSX.Element {
     if (item.grid.mode === TilesGridMode.none) {
       return (
         <div
@@ -159,7 +159,7 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
   }
 
   @autobind
-  private _onRenderPage(pageProps: IPageProps, defaultRender?: IRenderFunction<IPageProps>) {
+  private _onRenderPage(pageProps: IPageProps, defaultRender?: IRenderFunction<IPageProps>): JSX.Element {
     const {
       page,
       className: pageClassName,
diff --git a/packages/experiments/src/components/TilesList/TilesListPage.tsx b/packages/experiments/src/components/TilesList/TilesListPage.tsx
index 768f5815e66e4..a17ecc62cc3c8 100644
--- a/packages/experiments/src/components/TilesList/TilesListPage.tsx
+++ b/packages/experiments/src/components/TilesList/TilesListPage.tsx
@@ -19,7 +19,7 @@ const TilesListMediaExampleCode = require('!raw-loader!experiments/src/component
 /* tslint:enable:max-line-length */
 
 export class TilesListPage extends React.Component<IComponentDemoPageProps, {}> {
-  public render() {
+  public render(): JSX.Element {
     return (
       <ComponentPage
         title='TilesList'
diff --git a/packages/experiments/src/components/TilesList/examples/ExampleHelpers.tsx b/packages/experiments/src/components/TilesList/examples/ExampleHelpers.tsx
index 0daf562942ea6..277dbad7c3af1 100644
--- a/packages/experiments/src/components/TilesList/examples/ExampleHelpers.tsx
+++ b/packages/experiments/src/components/TilesList/examples/ExampleHelpers.tsx
@@ -34,7 +34,7 @@ export interface IExampleGroup {
   key: string;
 }
 
-export function createMediaItems(count: number, indexOffset: number) {
+export function createMediaItems(count: number, indexOffset: number): IExampleItem[] {
   const items: IExampleItem[] = [];
 
   for (let i = 0; i < count; i++) {
@@ -51,7 +51,7 @@ export function createMediaItems(count: number, indexOffset: number) {
   return items;
 }
 
-export function createDocumentItems(count: number, indexOffset: number) {
+export function createDocumentItems(count: number, indexOffset: number): IExampleItem[] {
   const items: IExampleItem[] = [];
 
   for (let i = 0; i < count; i++) {
@@ -82,7 +82,7 @@ export function getTileCells(groups: IExampleGroup[], {
 }: {
     onRenderHeader: (item: IExampleItem) => JSX.Element;
     onRenderCell: (item: IExampleItem, finalSize?: ITileSize) => JSX.Element;
-  }) {
+  }): (ITilesGridSegment<IExampleItem> | ITilesGridItem<IExampleItem>)[] {
   const items: (ITilesGridSegment<IExampleItem> | ITilesGridItem<IExampleItem>)[] = [];
 
   for (const group of groups) {
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx
index 1c42b8096fa20..717cf5cf1897a 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx
@@ -41,7 +41,7 @@ export class TilesListBasicExample extends React.Component<{}, ITilesListBasicEx
     };
   }
 
-  public render() {
+  public render(): JSX.Element {
     const gridSegment: ITilesGridSegment<IBasicItem> = {
       items: this.state.items,
       key: 'grid',
@@ -60,7 +60,7 @@ export class TilesListBasicExample extends React.Component<{}, ITilesListBasicEx
   }
 }
 
-function renderItem(item: IBasicItem) {
+function renderItem(item: IBasicItem): JSX.Element {
   return (
     <div
       style={
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
index 6c025f29848c5..cdd8facace176 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
@@ -46,7 +46,7 @@ export class TilesListDocumentExample extends React.Component<any, any> {
 
     this._selection.setItems(ITEMS);
   }
-  public render() {
+  public render(): JSX.Element {
     const items = getTileCells(GROUPS, {
       onRenderCell: this._onRenderDocumentCell,
       onRenderHeader: this._onRenderHeader
@@ -65,7 +65,7 @@ export class TilesListDocumentExample extends React.Component<any, any> {
   }
 
   @autobind
-  private _onRenderDocumentCell(item: IExampleItem) {
+  private _onRenderDocumentCell(item: IExampleItem): JSX.Element {
     return (
       <Tile
         className={ AnimationClassNames.fadeIn400 }
@@ -94,7 +94,7 @@ export class TilesListDocumentExample extends React.Component<any, any> {
   }
 
   @autobind
-  private _onRenderHeader(item: IExampleItem) {
+  private _onRenderHeader(item: IExampleItem): JSX.Element {
     return (
       <div>
         <h3>{ item.name }</h3>
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
index eb51e3be54f19..e061da71cfdd4 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
@@ -47,7 +47,7 @@ export class TilesListMediaExample extends React.Component<any, any> {
 
     this._selection.setItems(ITEMS);
   }
-  public render() {
+  public render(): JSX.Element {
     const items = getTileCells(GROUPS, {
       onRenderCell: this._onRenderMediaCell,
       onRenderHeader: this._onRenderHeader
@@ -66,7 +66,7 @@ export class TilesListMediaExample extends React.Component<any, any> {
   }
 
   @autobind
-  private _onRenderMediaCell(item: IExampleItem, finalSize: ITileSize) {
+  private _onRenderMediaCell(item: IExampleItem, finalSize: ITileSize): JSX.Element {
     return (
       <Tile
         className={ AnimationClassNames.fadeIn400 }
@@ -88,7 +88,7 @@ export class TilesListMediaExample extends React.Component<any, any> {
   }
 
   @autobind
-  private _onRenderHeader(item: IExampleItem) {
+  private _onRenderHeader(item: IExampleItem): JSX.Element {
     return (
       <div>
         <h3>{ item.name }</h3>
diff --git a/packages/experiments/src/demo/GettingStartedPage.tsx b/packages/experiments/src/demo/GettingStartedPage.tsx
index e80f383ccbef4..1df2a9cdb6c72 100644
--- a/packages/experiments/src/demo/GettingStartedPage.tsx
+++ b/packages/experiments/src/demo/GettingStartedPage.tsx
@@ -7,7 +7,7 @@ import { Highlight } from '@uifabric/example-app-base';
 
 export class GettingStartedPage extends React.Component<any, any> {
 
-  public render() {
+  public render(): JSX.Element {
     return (
       <div className='ms-GettingStartedPage'>
         <div className='ms-GettingStartedPage-banner'>
diff --git a/packages/experiments/src/demo/index.tsx b/packages/experiments/src/demo/index.tsx
index 38d94b6bb66a7..46d9405742c73 100644
--- a/packages/experiments/src/demo/index.tsx
+++ b/packages/experiments/src/demo/index.tsx
@@ -3,6 +3,7 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import * as ReactDOM from 'react-dom';
 import { App, AppDefinition } from './AppDefinition';
+import { IAppLink, IAppLinkGroup } from '@uifabric/example-app-base';
 import { Router, Route } from 'office-ui-fabric-react/lib/utilities/router/index';
 import { GettingStartedPage } from './GettingStartedPage';
 import { setBaseUrl } from 'office-ui-fabric-react/lib/Utilities';
@@ -16,7 +17,7 @@ setBaseUrl('./dist/');
 let rootElement: HTMLElement | null;
 
 // Return the anchor link from the URL without the hash
-function _extractAnchorLink(path: string) {
+function _extractAnchorLink(path: string): string {
   let index = path.lastIndexOf('#');
   if (index >= 0) {
     path = path.substr(index + 1, path.length - index);
@@ -24,14 +25,14 @@ function _extractAnchorLink(path: string) {
   return path;
 }
 
-function _scrollAnchorLink() {
+function _scrollAnchorLink(): void {
   if ((window.location.hash.match(/#/g) || []).length > 1) {
     let anchor = _extractAnchorLink(window.location.hash);
     document.getElementById(anchor)!.scrollIntoView();
   }
 }
 
-function _onLoad() {
+function _onLoad(): void {
   rootElement = rootElement || document.getElementById('content');
 
   ReactDOM.render(
@@ -43,14 +44,14 @@ function _onLoad() {
     rootElement);
 }
 
-function _getRoutes() {
-  let routes = AppDefinition.testPages.map(page => <Route key={ page.key } path={ page.url } component={ page.component } />);
+function _getRoutes(): JSX.Element[] {
+  let routes = AppDefinition.testPages.map((page: IAppLink) => <Route key={ page.key } path={ page.url } component={ page.component } />);
   let appRoutes: JSX.Element[] = [];
 
-  AppDefinition.examplePages.forEach(group => {
+  AppDefinition.examplePages.forEach((group: IAppLinkGroup) => {
     group.links
-      .filter(link => link.hasOwnProperty('component') || link.hasOwnProperty('getComponent'))
-      .forEach((link, linkIndex) => {
+      .filter((link: IAppLink) => link.hasOwnProperty('component') || link.hasOwnProperty('getComponent'))
+      .forEach((link: IAppLink, linkIndex: number) => {
         const { component, getComponent } = link;
 
         appRoutes.push(
@@ -77,7 +78,7 @@ function _getRoutes() {
   return routes;
 }
 
-function _onUnload() {
+function _onUnload(): void {
   if (rootElement) {
     ReactDOM.unmountComponentAtNode(rootElement);
   }
diff --git a/packages/experiments/tslint.json b/packages/experiments/tslint.json
index 2d6bb7b6e6bb8..ccd1251bf5139 100644
--- a/packages/experiments/tslint.json
+++ b/packages/experiments/tslint.json
@@ -5,9 +5,6 @@
   "rules": {
     "jsx-ban-props": false,
     "jsx-no-multiline-js": false,
-    "no-any": false,
-    "typedef": [
-      false
-    ]
+    "no-any": false
   }
 }
\ No newline at end of file

From 7a256c33a1984938ca724411efe58778591446ee Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 23 Aug 2017 11:55:01 -0700
Subject: [PATCH 0470/1641] Fixing the OS specific build problem, adding more
 logging.

---
 scripts/build.js      | 25 +++++++++++++++++++-----
 scripts/exec-sync.js  |  3 +++
 scripts/logging.js    | 44 +++++++++++++++++++++++++++++++++++++------
 scripts/tasks/sass.js |  4 +++-
 4 files changed, 64 insertions(+), 12 deletions(-)

diff --git a/scripts/build.js b/scripts/build.js
index 29ba8d2f0b2df..eb4cfae43cb49 100644
--- a/scripts/build.js
+++ b/scripts/build.js
@@ -1,6 +1,9 @@
-const isProduction = process.argv.indexOf('--production') > -1;
 const chalk = require('chalk');
-const { logStartTask, logEndTask } = require('./logging');
+const fs = require('fs');
+const path = require('path');
+const { logStartTask, logEndTask, logEndBuild } = require('./logging');
+
+const isProduction = process.argv.indexOf('--production') > -1;
 
 let tasks = [
   'copy',
@@ -17,6 +20,7 @@ if (process.argv.length >= 3 && process.argv[2].indexOf('--') === -1) {
 
 let promise = Promise.resolve();
 let hasFailures = false;
+let buildStartTime = new Date().getTime();
 
 tasks.forEach(task => {
   promise = promise.then(() => runTask(task));
@@ -26,18 +30,29 @@ promise.then(() => {
   if (hasFailures) {
     process.exitCode = 1;
   }
+  logEndBuild(getPackageName(), !hasFailures, buildStartTime);
 });
 
 function runTask(task) {
-  let start = new Date().getTime();
+  let taskStartTime = new Date().getTime();
 
   return Promise.resolve()
     .then(() => !hasFailures && Promise.resolve()
       .then(() => logStartTask(task))
       .then(() => require('./tasks/' + task)({ isProduction }))
-      .then(() => logEndTask(task, new Date().getTime() - start))
+      .then(() => logEndTask(task, taskStartTime))
       .catch((e) => {
         hasFailures = true;
-        logEndTask(task, new Date().getTime() - start, e);
+        logEndTask(task, taskStartTime, e);
       }));
+}
+
+function getPackageName() {
+  let packagePath = path.resolve(process.cwd(), 'package.json');
+
+  if (fs.existsSync(packagePath)) {
+    return JSON.parse(fs.readFileSync(packagePath, 'utf8')).name;
+  }
+
+  return '';
 }
\ No newline at end of file
diff --git a/scripts/exec-sync.js b/scripts/exec-sync.js
index 6767f17b7b5b8..4a989911be35a 100644
--- a/scripts/exec-sync.js
+++ b/scripts/exec-sync.js
@@ -1,6 +1,7 @@
 const path = require('path');
 const execSync = require('child_process').execSync;
 const chalk = require('chalk');
+const { logStatus } = require('./logging');
 
 const SEPARATOR = process.platform === 'win32' ? ';' : ':',
   env = Object.assign({}, process.env);
@@ -11,6 +12,8 @@ function myExecSync(cmd, displayName) {
   let returnValue = 0;
   let start = new Date().getTime();
 
+  logStatus(chalk.gray('Executing: ') + chalk.cyan(displayName || cmd));
+
   const output = execSync(cmd, {
     cwd: process.cwd(),
     env: env,
diff --git a/scripts/logging.js b/scripts/logging.js
index 9f0068660ac38..95eb906dfedcf 100644
--- a/scripts/logging.js
+++ b/scripts/logging.js
@@ -9,21 +9,53 @@ module.exports.logStartTask = (task) => {
     }`);
 };
 
-module.exports.logEndTask = (task, duration, errorMessage) => {
+module.exports.logEndTask = (task, startTime, errorMessage) => {
   console.log(
-    `[${
-    chalk.gray(new Date().toLocaleTimeString({ hour12: false }))
-    }] ${
-    (errorMessage === undefined ? chalk.green('Pass') : chalk.red('Error'))
+    `${
+    getTimePrefix()
+    } ${
+    getPassFail(errorMessage === undefined)
     }: ${
     chalk.cyan(task)
     } (${
-    chalk.yellow(formatTime(duration))
+    getDuration(startTime)
     })${
     errorMessage ? (chalk.white(': ') + chalk.red(errorMessage)) : ''
     }`);
 }
 
+module.exports.logStatus = (taskStatus) => {
+  console.log('  ' + taskStatus);
+}
+
+module.exports.logEndBuild = (packageName, passed, startTime) => {
+  console.log();
+  console.log(
+    `${
+    getTimePrefix()
+    } ${
+    chalk.grey('===') + chalk.white('[ ') + chalk.cyan(packageName) + chalk.white(' ]') +
+    chalk.grey('=') + chalk.white('[ ') + getPassFail(passed) + chalk.white(' ]') +
+    chalk.grey('=') + chalk.white('[ ') + getDuration(startTime) + chalk.white(' ]') +
+    chalk.grey('===')
+    }
+  `);
+}
+
+function getDuration(startTime) {
+  let duration = new Date().getTime() - startTime;
+
+  return chalk.yellow(formatTime(duration));
+}
+function getPassFail(passed) {
+  return passed ? chalk.green('Pass') : chalk.red('Error');
+}
+
+function getTimePrefix() {
+  return `[${
+    chalk.gray(new Date().toLocaleTimeString({ hour12: false }))
+    }]`;
+}
 function formatTime(milliseconds) {
   if (milliseconds >= 1000) {
     return (milliseconds / 1000) + 's';
diff --git a/scripts/tasks/sass.js b/scripts/tasks/sass.js
index c63e98ebe4f85..95128f11d6eb6 100644
--- a/scripts/tasks/sass.js
+++ b/scripts/tasks/sass.js
@@ -19,6 +19,8 @@ module.exports = function (options) {
     const promises = [];
 
     glob.sync(path.resolve(process.cwd(), 'src/**/*.scss')).forEach(fileName => {
+      fileName = path.resolve(fileName);
+
       promises.push(new Promise((resolve, reject) => {
         sass.render(
           {
@@ -56,7 +58,7 @@ module.exports = function (options) {
   }
 
   function getJSON(cssFileName, json) {
-    _fileNameToClassMap[cssFileName] = json;
+    _fileNameToClassMap[path.resolve(cssFileName)] = json;
   }
 
   function createTypeScriptModule(fileName, css) {

From 9c7e61655a80db8660659c14601a601f3e857210 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 23 Aug 2017 19:04:55 +0000
Subject: [PATCH 0471/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 29 ++++++++++++
 apps/fabric-website/CHANGELOG.md              | 11 ++++-
 apps/fabric-website/package.json              |  4 +-
 ...ents-max-line-length_2017-08-23-00-37.json | 11 -----
 ...ove-unused-variables_2017-08-23-00-57.json | 11 -----
 ...periments-self-close_2017-08-23-00-41.json | 11 -----
 .../experiments-typedef_2017-08-23-00-24.json | 11 -----
 ...mlynam-rm-trello-ref_2017-08-22-18-54.json | 11 -----
 ...te-branding-guidance_2017-08-22-17-03.json | 11 -----
 .../emlynam-update-cdn_2017-08-22-15-57.json  | 11 -----
 ...kaise-addCommentIcon_2017-08-21-22-08.json | 11 -----
 ...contextual-menu-role_2017-08-22-23-33.json | 11 -----
 ...mboBoxSetSelectedFix_2017-08-22-22-16.json | 11 -----
 .../master_2017-08-21-21-28.json              | 11 -----
 ...cessibility-bugfixes_2017-08-17-23-04.json | 11 -----
 ...-krbrow-dropdown-for_2017-08-08-19-51.json | 11 -----
 ...-documentcardpreview_2017-08-22-21-53.json | 11 -----
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/CHANGELOG.json           | 34 ++++++++++++++
 packages/experiments/CHANGELOG.md             | 12 ++++-
 packages/experiments/package.json             |  4 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 46 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 17 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/CHANGELOG.json               | 14 ++++++
 packages/styling/CHANGELOG.md                 |  9 +++-
 packages/styling/package.json                 |  2 +-
 27 files changed, 176 insertions(+), 166 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/experiments-max-line-length_2017-08-23-00-37.json
 delete mode 100644 common/changes/@uifabric/experiments/experiments-remove-unused-variables_2017-08-23-00-57.json
 delete mode 100644 common/changes/@uifabric/experiments/experiments-self-close_2017-08-23-00-41.json
 delete mode 100644 common/changes/@uifabric/experiments/experiments-typedef_2017-08-23-00-24.json
 delete mode 100644 common/changes/@uifabric/fabric-website/emlynam-rm-trello-ref_2017-08-22-18-54.json
 delete mode 100644 common/changes/@uifabric/fabric-website/emlynam-update-branding-guidance_2017-08-22-17-03.json
 delete mode 100644 common/changes/@uifabric/fabric-website/emlynam-update-cdn_2017-08-22-15-57.json
 delete mode 100644 common/changes/@uifabric/styling/bekaise-addCommentIcon_2017-08-21-22-08.json
 delete mode 100644 common/changes/office-ui-fabric-react/contextual-menu-role_2017-08-22-23-33.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxSetSelectedFix_2017-08-22-22-16.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2017-08-21-21-28.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-contrast-accessibility-bugfixes_2017-08-17-23-04.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-dropdown-for_2017-08-08-19-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/yimwu-documentcardpreview_2017-08-22-21-53.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 33e818948f1a1..6c1b5f808df44 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,35 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.7.3",
+      "tag": "@uifabric/fabric-website_v4.7.3",
+      "date": "Wed, 23 Aug 2017 19:04:55 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "f9295f56a26a91d6fd35776490ca91d7ae83bd40",
+            "comment": "Removed Trello reference"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "d13adf8353d706d583a1e217135890ceaf6e49ff",
+            "comment": "Updated branding guidance pdf from the cdn."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "2d179149380245f586834535299b5832094bee6d",
+            "comment": "Updated the CDN link on the \"Get Started\" page and section to an updated version of Fabric Core, 7.2.0"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.35.2 <5.0.0` to `>=4.36.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.7.2",
       "tag": "@uifabric/fabric-website_v4.7.2",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 5075728050702..1d70baccadcea 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,15 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Mon, 21 Aug 2017 10:19:29 GMT and should not be manually modified.
+This log was last generated on Wed, 23 Aug 2017 19:04:55 GMT and should not be manually modified.
+
+## 4.7.3
+Wed, 23 Aug 2017 19:04:55 GMT
+
+### Patches
+
+- Removed Trello reference
+- Updated branding guidance pdf from the cdn.
+- Updated the CDN link on the "Get Started" page and section to an updated version of Fabric Core, 7.2.0
 
 ## 4.7.2
 Mon, 21 Aug 2017 10:19:29 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 0eb78ee9dbbce..3377d18b9770d 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.7.2",
+  "version": "4.7.3",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -72,7 +72,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.35.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.36.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/experiments-max-line-length_2017-08-23-00-37.json b/common/changes/@uifabric/experiments/experiments-max-line-length_2017-08-23-00-37.json
deleted file mode 100644
index b22b935e442a3..0000000000000
--- a/common/changes/@uifabric/experiments/experiments-max-line-length_2017-08-23-00-37.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Removed suppression of tslint max line length rule from Experiments package, and broke up large lines or inserted tslint:disable comments to pass tslint",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "a.erich@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/experiments-remove-unused-variables_2017-08-23-00-57.json b/common/changes/@uifabric/experiments/experiments-remove-unused-variables_2017-08-23-00-57.json
deleted file mode 100644
index 7d40c8c8b3406..0000000000000
--- a/common/changes/@uifabric/experiments/experiments-remove-unused-variables_2017-08-23-00-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Removed suppression of tslint unused variables rule from Experiments package and removed unused variables to pass tslint",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "a.erich@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/experiments-self-close_2017-08-23-00-41.json b/common/changes/@uifabric/experiments/experiments-self-close_2017-08-23-00-41.json
deleted file mode 100644
index 9a04d96cd2b02..0000000000000
--- a/common/changes/@uifabric/experiments/experiments-self-close_2017-08-23-00-41.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Removed suppression of tslint self-close rule from Experiments package and self-closed all empty elements to pass tslint",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "a.erich@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/experiments-typedef_2017-08-23-00-24.json b/common/changes/@uifabric/experiments/experiments-typedef_2017-08-23-00-24.json
deleted file mode 100644
index 6f90a298731e1..0000000000000
--- a/common/changes/@uifabric/experiments/experiments-typedef_2017-08-23-00-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Added missing typedefs to call signatures in experiments, re-enable tslint rulefor typedef",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "a.erich@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/emlynam-rm-trello-ref_2017-08-22-18-54.json b/common/changes/@uifabric/fabric-website/emlynam-rm-trello-ref_2017-08-22-18-54.json
deleted file mode 100644
index e9fe40b4eff5c..0000000000000
--- a/common/changes/@uifabric/fabric-website/emlynam-rm-trello-ref_2017-08-22-18-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Removed Trello reference",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/emlynam-update-branding-guidance_2017-08-22-17-03.json b/common/changes/@uifabric/fabric-website/emlynam-update-branding-guidance_2017-08-22-17-03.json
deleted file mode 100644
index b3a62739712f4..0000000000000
--- a/common/changes/@uifabric/fabric-website/emlynam-update-branding-guidance_2017-08-22-17-03.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Updated branding guidance pdf from the cdn.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/emlynam-update-cdn_2017-08-22-15-57.json b/common/changes/@uifabric/fabric-website/emlynam-update-cdn_2017-08-22-15-57.json
deleted file mode 100644
index cc1d898c71931..0000000000000
--- a/common/changes/@uifabric/fabric-website/emlynam-update-cdn_2017-08-22-15-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Updated the CDN link on the \"Get Started\" page and section to an updated version of Fabric Core, 7.2.0",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gamil.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/bekaise-addCommentIcon_2017-08-21-22-08.json b/common/changes/@uifabric/styling/bekaise-addCommentIcon_2017-08-21-22-08.json
deleted file mode 100644
index 7a2cea47ad7a1..0000000000000
--- a/common/changes/@uifabric/styling/bekaise-addCommentIcon_2017-08-21-22-08.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "add Comment icon",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "bekaise@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/contextual-menu-role_2017-08-22-23-33.json b/common/changes/office-ui-fabric-react/contextual-menu-role_2017-08-22-23-33.json
deleted file mode 100644
index 5eff8d4357bbf..0000000000000
--- a/common/changes/office-ui-fabric-react/contextual-menu-role_2017-08-22-23-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: Add ability to override role on menu items",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxSetSelectedFix_2017-08-22-22-16.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxSetSelectedFix_2017-08-22-22-16.json
deleted file mode 100644
index 87d82bed8e51e..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxSetSelectedFix_2017-08-22-22-16.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Content should not be selected when comboBox isn't focused",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2017-08-21-21-28.json b/common/changes/office-ui-fabric-react/master_2017-08-21-21-28.json
deleted file mode 100644
index 6e1edeb1675b2..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2017-08-21-21-28.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Adding react import to SpinButton.Props for classic module resolution.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "serkani@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-contrast-accessibility-bugfixes_2017-08-17-23-04.json b/common/changes/office-ui-fabric-react/v-krbrow-contrast-accessibility-bugfixes_2017-08-17-23-04.json
deleted file mode 100644
index 20b807cbab19f..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-contrast-accessibility-bugfixes_2017-08-17-23-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "High contrast, accesibility, and other bugfixes",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-dropdown-for_2017-08-08-19-51.json b/common/changes/office-ui-fabric-react/v-krbrow-dropdown-for_2017-08-08-19-51.json
deleted file mode 100644
index fe06d6cc2e0bc..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-dropdown-for_2017-08-08-19-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: adds a for property to dropdown labels.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/yimwu-documentcardpreview_2017-08-22-21-53.json b/common/changes/office-ui-fabric-react/yimwu-documentcardpreview_2017-08-22-21-53.json
deleted file mode 100644
index 0e05d99fe4c5e..0000000000000
--- a/common/changes/office-ui-fabric-react/yimwu-documentcardpreview_2017-08-22-21-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DocumentCardPreview: Allow show Icon in the preview area instead of image.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "yimwu@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 4a967deda34f3..86f6cfb416a2f 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -47,7 +47,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.20.0 <1.0.0",
+    "@uifabric/styling": ">=0.20.1 <1.0.0",
     "@uifabric/utilities": ">=4.9.1 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 60a2d6e1b347f..9a1da4688cfee 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,40 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "0.1.3",
+      "tag": "@uifabric/experiments_v0.1.3",
+      "date": "Wed, 23 Aug 2017 19:04:55 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "017873a67b9772721cd94ff56f7860a1eefe6ec3",
+            "comment": "Removed suppression of tslint max line length rule from Experiments package, and broke up large lines or inserted tslint:disable comments to pass tslint"
+          },
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "1d1f46e65d4ea0ec1cec42301c6fe9c10122ee5c",
+            "comment": "Removed suppression of tslint unused variables rule from Experiments package and removed unused variables to pass tslint"
+          },
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "4851f696d5579d213c70ecea143392b228c5c6cf",
+            "comment": "Removed suppression of tslint self-close rule from Experiments package and self-closed all empty elements to pass tslint"
+          },
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "3934332af3939fcb13224c71eac56ef195c48d8a",
+            "comment": "Added missing typedefs to call signatures in experiments, re-enable tslint rulefor typedef"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `4.35.2` to `4.36.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.1.2",
       "tag": "@uifabric/experiments_v0.1.2",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 4ca011388d94c..c7dadf90b752b 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,16 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Tue, 22 Aug 2017 10:09:55 GMT and should not be manually modified.
+This log was last generated on Wed, 23 Aug 2017 19:04:55 GMT and should not be manually modified.
+
+## 0.1.3
+Wed, 23 Aug 2017 19:04:55 GMT
+
+### Patches
+
+- Removed suppression of tslint max line length rule from Experiments package, and broke up large lines or inserted tslint:disable comments to pass tslint
+- Removed suppression of tslint unused variables rule from Experiments package and removed unused variables to pass tslint
+- Removed suppression of tslint self-close rule from Experiments package and self-closed all empty elements to pass tslint
+- Added missing typedefs to call signatures in experiments, re-enable tslint rulefor typedef
 
 ## 0.1.2
 Tue, 22 Aug 2017 10:09:55 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 86582abbce787..5eafe3eeb7f4e 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -64,7 +64,7 @@
     "webpack-notifier": "^1.5.0"
   },
   "dependencies": {
-    "office-ui-fabric-react": "4.35.2"
+    "office-ui-fabric-react": "4.36.0"
   },
   "peerDependencies": {
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 718d8dfe1c136..8999da3a9b63e 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,52 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.36.0",
+      "tag": "office-ui-fabric-react_v4.36.0",
+      "date": "Wed, 23 Aug 2017 19:04:55 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "b9a635fd582cbf04becda07d89edb98a8263fcfa",
+            "comment": "ContextualMenu: Add ability to override role on menu items"
+          },
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "d5c12b214899f71a2886a3bddc2ae065ce2f19ed",
+            "comment": "ComboBox: Content should not be selected when comboBox isn't focused"
+          },
+          {
+            "author": "Serkan Inci <serkan.inci@hotmail.com>",
+            "commit": "48c4c90cfeb7831f75e7f39f4aeb07c2b1668555",
+            "comment": "Adding react import to SpinButton.Props for classic module resolution."
+          },
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "44a7f2531984ac585ed8032ea04c9b43bd4525bd",
+            "comment": "High contrast, accesibility, and other bugfixes"
+          },
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "852d8897c24f431188f4dd730e41537db00b5210",
+            "comment": "Dropdown: adds a for property to dropdown labels."
+          }
+        ],
+        "minor": [
+          {
+            "author": "Yimin Wu <yimwu@microsoft.com>",
+            "commit": "336483b8c3a1dcb46c361aaf2d452b21e6ac6f56",
+            "comment": "DocumentCardPreview: Allow show Icon in the preview area instead of image."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.20.0 <1.0.0` to `>=0.20.1 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.35.2",
       "tag": "office-ui-fabric-react_v4.35.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 28e8434e601d0..dfa2203c5218d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,21 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 22 Aug 2017 10:09:55 GMT and should not be manually modified.
+This log was last generated on Wed, 23 Aug 2017 19:04:55 GMT and should not be manually modified.
+
+## 4.36.0
+Wed, 23 Aug 2017 19:04:55 GMT
+
+### Minor changes
+
+- DocumentCardPreview: Allow show Icon in the preview area instead of image.
+
+### Patches
+
+- ContextualMenu: Add ability to override role on menu items
+- ComboBox: Content should not be selected when comboBox isn't focused
+- Adding react import to SpinButton.Props for classic module resolution.
+- High contrast, accesibility, and other bugfixes
+- Dropdown: adds a for property to dropdown labels.
 
 ## 4.35.2
 Tue, 22 Aug 2017 10:09:55 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index aa137e7940a28..0a1b90f84eaf0 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.35.2",
+  "version": "4.36.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -71,7 +71,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
     "@uifabric/utilities": ">=4.9.1 <5.0.0",
-    "@uifabric/styling": ">=0.20.0 <1.0.0",
+    "@uifabric/styling": ">=0.20.1 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 17d5069eb45a4..5442b5f121dd4 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.20.1",
+      "tag": "@uifabric/styling_v0.20.1",
+      "date": "Wed, 23 Aug 2017 19:04:55 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Benjamin Kaiser <benjaminjkaiser@gmail.com>",
+            "commit": "042e2133b475a37340c4f05ae9eeb0abd22ec49d",
+            "comment": "add Comment icon"
+          }
+        ]
+      }
+    },
     {
       "version": "0.20.0",
       "tag": "@uifabric/styling_v0.20.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 72b78299bcd0c..d992f426c97a5 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 18 Aug 2017 16:32:33 GMT and should not be manually modified.
+This log was last generated on Wed, 23 Aug 2017 19:04:55 GMT and should not be manually modified.
+
+## 0.20.1
+Wed, 23 Aug 2017 19:04:55 GMT
+
+### Patches
+
+- add Comment icon
 
 ## 0.20.0
 Fri, 18 Aug 2017 16:32:33 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 0726a7062f9cc..5b7245a3af11a 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.20.0",
+  "version": "0.20.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From bc67766f6cf174eed337321b3fd95dd644b4f076 Mon Sep 17 00:00:00 2001
From: Eddie Liu <leddie24@gmail.com>
Date: Wed, 23 Aug 2017 20:20:43 +0000
Subject: [PATCH 0472/1641] DetailsList: Set button.check margin to 0 (#2591)

* Set margin to 0.  Fixes safari applying margin to button.

* Add change file
---
 ...wliu-detailsrow-check-margin_2017-08-23-20-11.json | 11 +++++++++++
 .../src/components/DetailsList/DetailsRowCheck.scss   |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/v-edwliu-detailsrow-check-margin_2017-08-23-20-11.json

diff --git a/common/changes/office-ui-fabric-react/v-edwliu-detailsrow-check-margin_2017-08-23-20-11.json b/common/changes/office-ui-fabric-react/v-edwliu-detailsrow-check-margin_2017-08-23-20-11.json
new file mode 100644
index 0000000000000..62a62da5301df
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-edwliu-detailsrow-check-margin_2017-08-23-20-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: Set button.check margin to 0",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-edwliu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
index 24f0f6ebb86cf..6dd484999fe3f 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
@@ -19,6 +19,7 @@
 
 button.check {
   padding: 3px;
+  margin: 0;
 }
 
 .owner {

From 5a27e9b090b22fde94e6c600e171067af2bd9875 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 23 Aug 2017 15:06:06 -0700
Subject: [PATCH 0473/1641] minified bundles are now being deployed again.

---
 scripts/tasks/karma.js   | 2 +-
 scripts/tasks/webpack.js | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/scripts/tasks/karma.js b/scripts/tasks/karma.js
index dbc29b5c00f28..e02861a7f3e51 100644
--- a/scripts/tasks/karma.js
+++ b/scripts/tasks/karma.js
@@ -6,6 +6,6 @@ module.exports = function (options) {
   if (fs.existsSync(karmaPath)) {
     const execSync = require('../exec-sync');
 
-    execSync('gulp karma');
+    execSync('gulp karma' + (options.isProduction ? ' --production' : ''));
   }
 };
diff --git a/scripts/tasks/webpack.js b/scripts/tasks/webpack.js
index e8d53e7d216a6..35367a06beb4e 100644
--- a/scripts/tasks/webpack.js
+++ b/scripts/tasks/webpack.js
@@ -9,6 +9,6 @@ module.exports = function (options) {
 
     const execSync = require('../exec-sync');
 
-    execSync('gulp webpack');
+    execSync('gulp webpack' + (options.isProduction ? ' --production' : ''));
   }
 };

From d6658fcb6c1978a6a6949fb5ecec6cf5e7291f70 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 23 Aug 2017 15:58:16 -0700
Subject: [PATCH 0474/1641] Updating build to run ts and tslint slightly
 differently.

---
 scripts/tasks/ts.js     | 6 +++---
 scripts/tasks/tslint.js | 3 ++-
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/scripts/tasks/ts.js b/scripts/tasks/ts.js
index 117668e31fef8..f6fc974559d28 100644
--- a/scripts/tasks/ts.js
+++ b/scripts/tasks/ts.js
@@ -1,12 +1,12 @@
 module.exports = function (options) {
   const path = require('path');
   const execSync = require('../exec-sync');
-  const typescriptPath = 'node ' + path.resolve(require.resolve('typescript/lib/tsc'));
+  const typescriptPath = 'node ' + path.resolve(__dirname, '../node_modules/typescript/lib/tsc');
 
-  execSync(typescriptPath + ' -outDir lib -t es5 -m commonjs --pretty', 'typescript commonjs/es5');
+  execSync(typescriptPath + ' -outDir lib -t es5 -m commonjs --pretty');
 
   if (options.isProduction) {
-    execSync(typescriptPath + ' -outDir lib-amd -t es5 -m amd --pretty', 'typescript amd/es5');
+    execSync(typescriptPath + ' -outDir lib-amd -t es5 -m amd --pretty');
     // execSync(typescriptPath + ' -outDir lib-es6 -t es6 -m es6 --pretty', 'typescript es6');
   }
 };
\ No newline at end of file
diff --git a/scripts/tasks/tslint.js b/scripts/tasks/tslint.js
index 365dcbf118c4f..3d15fec52aa27 100644
--- a/scripts/tasks/tslint.js
+++ b/scripts/tasks/tslint.js
@@ -5,6 +5,7 @@ module.exports = function (options) {
   const rulesPath = path.dirname(msCustomRulesMain);
   const projectPath = path.resolve(process.cwd(), 'tsconfig.json');
   const sourcePath = path.resolve(process.cwd(), 'src/**/*.ts*');
+  const tslintPath = 'node ' + path.resolve(__dirname, '../node_modules/tslint/lib/tslint-cli');
 
-  execSync(`tslint --project ${projectPath} -t stylish -r ${rulesPath}`, 'tslint');
+  execSync(`${tslintPath} --project ${projectPath} -t stylish -r ${rulesPath}`);
 };

From dcd93b4058e9e68632c8b373de733601dab574c5 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 23 Aug 2017 16:30:10 -0700
Subject: [PATCH 0475/1641] createArray: undo of optional for callback. (#2601)

* Fix createArray

* adding change file.
---
 .../utilities/array-fix_2017-08-23-23-20.json         | 11 +++++++++++
 packages/utilities/src/array.ts                       |  8 ++++----
 2 files changed, 15 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/array-fix_2017-08-23-23-20.json

diff --git a/common/changes/@uifabric/utilities/array-fix_2017-08-23-23-20.json b/common/changes/@uifabric/utilities/array-fix_2017-08-23-23-20.json
new file mode 100644
index 0000000000000..d0647d6994209
--- /dev/null
+++ b/common/changes/@uifabric/utilities/array-fix_2017-08-23-23-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "createArray: reverting previous change to make getItem optional, cleaning up so that the return value is correct.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/src/array.ts b/packages/utilities/src/array.ts
index 4d489df1739eb..5ae018269b844 100644
--- a/packages/utilities/src/array.ts
+++ b/packages/utilities/src/array.ts
@@ -26,14 +26,14 @@ export function findIndex<T>(array: T[], cb: (item: T, index?: number) => boolea
  * @param size - Size of array.
  * @param getItem - Callback to populate given cell index.
  */
-export function createArray<T>(size: number, getItem?: (index?: number) => T): T[] {
-  let array: (T | null)[] = [];
+export function createArray<T>(size: number, getItem: (index: number) => T): T[] {
+  let array: T[] = [];
 
   for (let i = 0; i < size; i++) {
-    array.push(getItem ? getItem(i) : null);
+    array.push(getItem(i));
   }
 
-  return array as T[];
+  return array;
 }
 
 /**

From eee654b354aa2ff30830fcc51319da11f3b8d688 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Wed, 23 Aug 2017 16:33:50 -0700
Subject: [PATCH 0476/1641] Break up long lines or disable max line length in
 ex-app-base pkg to pass tslint (#2598)

* Break up long lines or disable max line length in ex-app-base pkg to pass tslint

* Removed tslint rules that dont require changes

* Added change file

* Revert "Added change file"

This reverts commit 53e1c4dfcc9f20eeec078272a5117ead52c26b00.

* Added change file
---
 .../exappbase-max-line_2017-08-23-21-53.json       | 11 +++++++++++
 .../components/PropertiesTable/PropertiesTable.tsx |  7 ++++++-
 packages/example-app-base/src/utilities/beep.ts    |  1 +
 .../example-app-base/src/utilities/createApp.tsx   |  6 +++++-
 .../src/utilities/parser/InterfaceParserHelper.ts  |  3 ++-
 packages/example-app-base/tslint.json              | 14 +-------------
 6 files changed, 26 insertions(+), 16 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/exappbase-max-line_2017-08-23-21-53.json

diff --git a/common/changes/@uifabric/example-app-base/exappbase-max-line_2017-08-23-21-53.json b/common/changes/@uifabric/example-app-base/exappbase-max-line_2017-08-23-21-53.json
new file mode 100644
index 0000000000000..d7e4e9293ab04
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/exappbase-max-line_2017-08-23-21-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Break up long lines or disable max line length in ex-app-base pkg to pass tslint",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "a.erich@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx b/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx
index d23364b774ec5..b1be110cc6dd7 100644
--- a/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx
+++ b/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx
@@ -143,7 +143,12 @@ export class PropertiesTable extends React.Component<IPropertiesTableProps, any>
     return groups;
   }
 
-  private _tryAddGroup(props: IInterfaceProperty[], typeToCompare: InterfacePropertyType, name: string, index: number, allGroups: IGroup[]): number {
+  private _tryAddGroup(
+    props: IInterfaceProperty[],
+    typeToCompare: InterfacePropertyType,
+    name: string, index: number,
+    allGroups: IGroup[]
+  ): number {
     let group: IGroup | undefined = undefined;
 
     while (index < props.length) {
diff --git a/packages/example-app-base/src/utilities/beep.ts b/packages/example-app-base/src/utilities/beep.ts
index 31837736af360..fa0eb60b770c3 100644
--- a/packages/example-app-base/src/utilities/beep.ts
+++ b/packages/example-app-base/src/utilities/beep.ts
@@ -1,3 +1,4 @@
+// tslint:disable-next-line:max-line-length
 const BEEP_DATA = 'data:audio/wav;base64,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qJrx4KOQjahZxWbcZgztj2c49nKmkId44S71j0c8eV9yDK6uPRzx5X18eDvjvQ6yKo9ZSS6l//8elePK/Lf//IInrOF/FvDoADYAGBMGb7FtErm5MXMlmPAJQVgWta7Zx2go+8xJ0UiCb8LHHdftWyLJE0QIAIsI+UbXu67dZMjmgDGCGl1H+vpF4NSDckSIkk7Vd+sxEhBQMRU8j/12UIRhzSaUdQ+rQU5kGeFxm+hb1oh6pWWmv3uvmReDl0UnvtapVaIzo1jZbf/pD6ElLqSX+rUmOQNpJFa/r+sa4e/pBlAABoAAAAA3CUgShLdGIxsY7AUABPRrgCABdDuQ5GC7DqPQCgbbJUAoRSUj+NIEig0YfyWUho1VBBBA//uQZB4ABZx5zfMakeAAAAmwAAAAF5F3P0w9GtAAACfAAAAAwLhMDmAYWMgVEG1U0FIGCBgXBXAtfMH10000EEEEEECUBYln03TTTdNBDZopopYvrTTdNa325mImNg3TTPV9q3pmY0xoO6bv3r00y+IDGid/9aaaZTGMuj9mpu9Mpio1dXrr5HERTZSmqU36A3CumzN/9Robv/Xx4v9ijkSRSNLQhAWumap82WRSBUqXStV/YcS+XVLnSS+WLDroqArFkMEsAS+eWmrUzrO0oEmE40RlMZ5+ODIkAyKAGUwZ3mVKmcamcJnMW26MRPgUw6j+LkhyHGVGYjSUUKNpuJUQoOIAyDvEyG8S5yfK6dhZc0Tx1KI/gviKL6qvvFs1+bWtaz58uUNnryq6kt5RzOCkPWlVqVX2a/EEBUdU1KrXLf40GoiiFXK///qpoiDXrOgqDR38JB0bw7SoL+ZB9o1RCkQjQ2CBYZKd/+VJxZRRZlqSkKiws0WFxUyCwsKiMy7hUVFhIaCrNQsKkTIsLivwKKigsj8XYlwt/WKi2N4d//uQRCSAAjURNIHpMZBGYiaQPSYyAAABLAAAAAAAACWAAAAApUF/Mg+0aohSIRobBAsMlO//Kk4soosy1JSFRYWaLC4qZBYWFRGZdwqKiwkNBVmoWFSJkWFxX4FFRQWR+LsS4W/rFRb/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////VEFHAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAU291bmRib3kuZGUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAMjAwNGh0dHA6Ly93d3cuc291bmRib3kuZGUAAAAAAAAAACU=';
 
 const MIN_DURATION_BETWEEN_BEEPS = 100;
diff --git a/packages/example-app-base/src/utilities/createApp.tsx b/packages/example-app-base/src/utilities/createApp.tsx
index a019c3a7c3650..efe24b8b308c7 100644
--- a/packages/example-app-base/src/utilities/createApp.tsx
+++ b/packages/example-app-base/src/utilities/createApp.tsx
@@ -18,7 +18,11 @@ import { ExampleGroup, IExample } from './examplesOf';
  * @param appTitle A title for the application that will be displayed in the header.
  * @param headerLinks A set of links to put in the header of the application.
  */
-export function createApp(examples: ExampleGroup | ExampleGroup[], defaultRouteComponent: () => (JSX.Element | null) = () => null, appTitle?: string, headerLinks?: IAppLink[]) {
+export function createApp(
+  examples: ExampleGroup | ExampleGroup[],
+  defaultRouteComponent: () => (JSX.Element | null) = () => null,
+  appTitle?: string, headerLinks?: IAppLink[]
+) {
   let rootElement: HTMLElement | null;
   let groups: ExampleGroup[] = !Array.isArray(examples) ? [examples] : examples;
 
diff --git a/packages/example-app-base/src/utilities/parser/InterfaceParserHelper.ts b/packages/example-app-base/src/utilities/parser/InterfaceParserHelper.ts
index ea8671cfb8d85..244fe2837f549 100644
--- a/packages/example-app-base/src/utilities/parser/InterfaceParserHelper.ts
+++ b/packages/example-app-base/src/utilities/parser/InterfaceParserHelper.ts
@@ -125,7 +125,8 @@ export class InterfaceParserHelper extends BaseParser {
             this.eat(';'); // actually eat the semicolon
 
             let isOptional = identifierName[identifierName.length - 1] === '?';
-            let propType = isDeprecated ? InterfacePropertyType.deprecated : (isOptional ? InterfacePropertyType.optional : InterfacePropertyType.required);
+            let propType = isDeprecated ? InterfacePropertyType.deprecated :
+              (isOptional ? InterfacePropertyType.optional : InterfacePropertyType.required);
 
             if (isOptional) {
               identifierName = identifierName.substr(0, identifierName.length - 1);
diff --git a/packages/example-app-base/tslint.json b/packages/example-app-base/tslint.json
index ad57de6cee22e..6b48dfbfb1cf5 100644
--- a/packages/example-app-base/tslint.json
+++ b/packages/example-app-base/tslint.json
@@ -5,21 +5,9 @@
   "rules": {
     "jsx-no-multiline-js": false,
     "jsx-no-lambda": false,
-    "max-line-length": [
-      false,
-      140
-    ],
     "no-any": false,
-    "no-null-keyword": false,
-    "variable-name": false,
     "typedef": [
       false
-    ],
-    "export-name": false,
-    "trailing-comma": [
-      false
-    ],
-    "no-internal-module": false,
-    "prefer-const": false
+    ]
   }
 }
\ No newline at end of file

From ea1eb5192be167619d7cdd19f67327083917e21f Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Wed, 23 Aug 2017 16:35:26 -0700
Subject: [PATCH 0477/1641] Make SelectionMode intrinsic to Selection model
 (#2590)

* Make SelectionMode intrinsic to Selection model

* Make SelectionZone respect Selection.mode if provided

* Update SelectionZone example to use Selection.mode

* Update change output

* Update Selection.ts
---
 .../selection-mode_2017-08-23-17-57.json      | 11 +++
 .../src/utilities/selection/Selection.ts      | 99 +++++++++++++++----
 .../src/utilities/selection/SelectionZone.tsx | 36 +++++--
 .../examples/Selection.Basic.Example.tsx      | 44 +++++----
 .../src/utilities/selection/interfaces.ts     |  4 +-
 5 files changed, 151 insertions(+), 43 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/selection-mode_2017-08-23-17-57.json

diff --git a/common/changes/office-ui-fabric-react/selection-mode_2017-08-23-17-57.json b/common/changes/office-ui-fabric-react/selection-mode_2017-08-23-17-57.json
new file mode 100644
index 0000000000000..dcbdc77dcb080
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/selection-mode_2017-08-23-17-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Make SelectionMode intrinsic to Selection model",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts b/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
index 6f3a3b08651a5..d93067b893c17 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
@@ -1,16 +1,20 @@
-import { IObjectWithKey, ISelection, SELECTION_CHANGE } from './interfaces';
+
+import { IObjectWithKey, ISelection, SELECTION_CHANGE, SelectionMode } from './interfaces';
 import { EventGroup } from '../../Utilities';
 
 export interface ISelectionOptions {
   onSelectionChanged?: () => void;
   getKey?: (item: IObjectWithKey, index?: number) => string | number;
   canSelectItem?: (item: IObjectWithKey) => boolean;
+  selectionMode?: SelectionMode;
 }
 
 export class Selection implements ISelection {
   public count: number;
-  public getKey: (item: IObjectWithKey, index?: number) => string | number;
-  public canSelectItem: (item: IObjectWithKey) => boolean;
+  public readonly mode: SelectionMode;
+
+  private _getKey: (item: IObjectWithKey, index?: number) => string | number;
+  private _canSelectItem: (item: IObjectWithKey) => boolean;
 
   private _changeEventSuppressionCount: number;
   private _items: IObjectWithKey[];
@@ -26,21 +30,34 @@ export class Selection implements ISelection {
   private _unselectableCount: number;
 
   constructor(options: ISelectionOptions = {}) {
-    let {
+    const {
       onSelectionChanged,
       getKey,
-      canSelectItem = (item: IObjectWithKey) => { return true; }
+      canSelectItem = (item: IObjectWithKey) => true,
+      selectionMode = SelectionMode.multiple
     } = options;
-    this.getKey = getKey || ((item: IObjectWithKey, index?: number) => ((item && item.key) ? item.key : String(index)));
+
+    this.mode = selectionMode;
+
+    this._getKey = getKey || defaultGetKey;
 
     this._changeEventSuppressionCount = 0;
     this._exemptedCount = 0;
     this._anchoredIndex = 0;
     this._unselectableCount = 0;
-    this.setItems([], true);
 
     this._onSelectionChanged = onSelectionChanged;
-    this.canSelectItem = canSelectItem;
+    this._canSelectItem = canSelectItem;
+
+    this.setItems([], true);
+  }
+
+  public canSelectItem(item: IObjectWithKey): boolean {
+    return this._canSelectItem(item);
+  }
+
+  public getKey(item: IObjectWithKey, index?: number): string {
+    return `${this._getKey(item, index)}`;
   }
 
   public setChangeEvents(isEnabled: boolean, suppressChange?: boolean) {
@@ -161,6 +178,11 @@ export class Selection implements ISelection {
   public isAllSelected(): boolean {
     let selectableCount = this._items.length - this._unselectableCount;
 
+    // In single mode, we can only have a max of 1 item.
+    if (this.mode === SelectionMode.single) {
+      selectableCount = Math.min(selectableCount, 1);
+    }
+    
     return (
       (this.count > 0) &&
       (this._isAllSelected && this._exemptedCount === 0) ||
@@ -180,7 +202,11 @@ export class Selection implements ISelection {
       (!this._isAllSelected && this._exemptedIndices[index]));
   }
 
-  public setAllSelected(isAllSelected: boolean) {
+  public setAllSelected(isAllSelected: boolean): void {
+    if (isAllSelected && this.mode !== SelectionMode.multiple) {
+      return;
+    }
+
     let selectableCount = this._items ? (this._items.length - this._unselectableCount) : 0;
 
     if (selectableCount > 0 && (this._exemptedCount > 0 || isAllSelected !== this._isAllSelected)) {
@@ -191,7 +217,7 @@ export class Selection implements ISelection {
     }
   }
 
-  public setKeySelected(key: string, isSelected: boolean, shouldAnchor: boolean) {
+  public setKeySelected(key: string, isSelected: boolean, shouldAnchor: boolean): void {
     let index = this._keyToIndexMap[key];
 
     if (index >= 0) {
@@ -199,7 +225,11 @@ export class Selection implements ISelection {
     }
   }
 
-  public setIndexSelected(index: number, isSelected: boolean, shouldAnchor: boolean) {
+  public setIndexSelected(index: number, isSelected: boolean, shouldAnchor: boolean): void {
+    if (this.mode === SelectionMode.none) {
+      return;
+    }
+
     // Clamp the index.
     index = Math.min(Math.max(0, index), this._items.length - 1);
 
@@ -208,11 +238,18 @@ export class Selection implements ISelection {
       return;
     }
 
+    this.setChangeEvents(false);
+
     let isExempt = this._exemptedIndices[index];
     let hasChanged = false;
     let canSelect = !this._unselectableIndices[index];
 
     if (canSelect) {
+      if (isSelected && this.mode === SelectionMode.single) {
+        // If this is single-select, the previous selection should be removed.
+        this.setAllSelected(false);
+      }
+
       // Determine if we need to remove the exemption.
       if (isExempt && (
         (isSelected && this._isAllSelected) ||
@@ -241,13 +278,24 @@ export class Selection implements ISelection {
     if (hasChanged) {
       this._updateCount();
     }
+
+    this.setChangeEvents(true);
   }
 
-  public selectToKey(key: string, clearSelection?: boolean) {
+  public selectToKey(key: string, clearSelection?: boolean): void {
     this.selectToIndex(this._keyToIndexMap[key], clearSelection);
   }
 
-  public selectToIndex(index: number, clearSelection?: boolean) {
+  public selectToIndex(index: number, clearSelection?: boolean): void {
+    if (this.mode === SelectionMode.none) {
+      return;
+    }
+
+    if (this.mode === SelectionMode.single) {
+      this.setIndexSelected(index, true, true);
+      return;
+    }
+
     let anchorIndex = this._anchoredIndex || 0;
     let startIndex = Math.min(index, anchorIndex);
     let endIndex = Math.max(index, anchorIndex);
@@ -265,22 +313,30 @@ export class Selection implements ISelection {
     this.setChangeEvents(true);
   }
 
-  public toggleAllSelected() {
+  public toggleAllSelected(): void {
     this.setAllSelected(!this.isAllSelected());
   }
 
-  public toggleKeySelected(key: string) {
+  public toggleKeySelected(key: string): void {
     this.setKeySelected(key, !this.isKeySelected(key), true);
   }
 
-  public toggleIndexSelected(index: number) {
+  public toggleIndexSelected(index: number): void {
     this.setIndexSelected(index, !this.isIndexSelected(index), true);
   }
 
-  public toggleRangeSelected(fromIndex: number, count: number) {
+  public toggleRangeSelected(fromIndex: number, count: number): void {
+    if (this.mode === SelectionMode.none) {
+      return;
+    }
+
     let isRangeSelected = this.isRangeSelected(fromIndex, count);
     let endIndex = fromIndex + count;
 
+    if (this.mode === SelectionMode.single && count > 1) {
+      return;
+    }
+
     this.setChangeEvents(false);
     for (let i = fromIndex; i < endIndex; i++) {
       this.setIndexSelected(i, !isRangeSelected, false);
@@ -288,12 +344,12 @@ export class Selection implements ISelection {
     this.setChangeEvents(true);
   }
 
-  private _updateCount() {
+  private _updateCount(): void {
     this.count = this.getSelectedCount();
     this._change();
   }
 
-  private _change() {
+  private _change(): void {
     if (this._changeEventSuppressionCount === 0) {
       this._selectedItems = null;
 
@@ -306,5 +362,10 @@ export class Selection implements ISelection {
       this._hasChanged = true;
     }
   }
+}
 
+function defaultGetKey(item: IObjectWithKey, index?: number): string | number {
+  return item && item.key ?
+    item.key :
+    `${index}`;
 }
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
index d4999d479f442..2e2a57d889533 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
@@ -126,9 +126,11 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   @autobind
   private _onFocus(ev: React.FocusEvent<HTMLElement>) {
     let target = ev.target as HTMLElement;
-    let { selection, selectionMode } = this.props;
+    let { selection } = this.props;
     let isToggleModifierPressed = this._isCtrlPressed || this._isMetaPressed;
 
+    const selectionMode = this._getSelectionMode();
+
     if (this._shouldHandleFocus && selectionMode !== SelectionMode.none) {
       let isToggle = this._hasAttribute(target, SELECTION_TOGGLE_ATTRIBUTE_NAME);
       let itemRoot = this._findItemRoot(target);
@@ -253,9 +255,11 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
       return;
     }
 
-    let { selectionMode, onItemInvoked } = this.props;
+    let { onItemInvoked } = this.props;
     let itemRoot = this._findItemRoot(target);
 
+    const selectionMode = this._getSelectionMode();
+
     if (itemRoot && onItemInvoked && selectionMode !== SelectionMode.none && !this._isInputElement(target)) {
       let index = this._getItemIndex(itemRoot);
 
@@ -286,7 +290,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
       return;
     }
 
-    let { selection, selectionMode } = this.props;
+    let { selection } = this.props;
     let isSelectAllKey = ev.which === KeyCodes.a && (this._isCtrlPressed || this._isMetaPressed);
     let isClearSelectionKey = ev.which === KeyCodes.escape;
 
@@ -297,6 +301,8 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
       return;
     }
 
+    const selectionMode = this._getSelectionMode();
+
     // If ctrl-a is pressed, select all (if all are not already selected.)
     if (isSelectAllKey && selectionMode === SelectionMode.multiple && !selection.isAllSelected()) {
       selection.setAllSelected(true);
@@ -349,7 +355,9 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   }
 
   private _onToggleAllClick(ev: React.MouseEvent<HTMLElement>) {
-    let { selection, selectionMode } = this.props;
+    let { selection } = this.props;
+
+    const selectionMode = this._getSelectionMode();
 
     if (selectionMode === SelectionMode.multiple) {
       selection.toggleAllSelected();
@@ -359,7 +367,9 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   }
 
   private _onToggleClick(ev: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>, index: number) {
-    let { selection, selectionMode } = this.props;
+    let { selection } = this.props;
+
+    const selectionMode = this._getSelectionMode();
 
     if (selectionMode === SelectionMode.multiple) {
       selection.toggleIndexSelected(index);
@@ -390,9 +400,11 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   }
 
   private _onItemSurfaceClick(ev: React.SyntheticEvent<HTMLElement>, index: number) {
-    let { selection, selectionMode } = this.props;
+    let { selection } = this.props;
     let isToggleModifierPressed = this._isCtrlPressed || this._isMetaPressed;
 
+    const selectionMode = this._getSelectionMode();
+
     if (selectionMode === SelectionMode.multiple) {
       if (this._isShiftPressed) {
         selection.selectToIndex(index, !isToggleModifierPressed);
@@ -518,4 +530,16 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
       }, 100);
     }
   }
+
+  private _getSelectionMode(): SelectionMode {
+    const {
+      selection
+    } = this.props;
+
+    const {
+      selectionMode = selection ? selection.mode : SelectionMode.none
+    } = this.props;
+
+    return selectionMode;
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx b/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
index 4bb3016b996fe..4f7df1d3662e4 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
@@ -43,9 +43,9 @@ export class SelectionItemExample extends React.Component<ISelectionItemExampleP
     }
 
     return (
-      <div className='ms-SelectionItemExample' data-selection-index={ itemIndex }>
-        { (selectionMode !== SelectionMode.none) && (
-          <div className='ms-SelectionItemExample-check' data-selection-toggle={ true } >
+      <div className='ms-SelectionItemExample' data-is-focusable={ true } data-selection-index={ itemIndex }>
+        { (selection && selection.canSelectItem(item) && selection.mode !== SelectionMode.none) && (
+          <div className='ms-SelectionItemExample-check' data-is-focusable={ true } data-selection-toggle={ true } >
             <Check checked={ isSelected } />
           </div>
         ) }
@@ -92,10 +92,9 @@ export class SelectionBasicExample extends React.Component<any, ISelectionBasicE
     return (
       <div className='ms-SelectionBasicExample'>
         <CommandBar items={ this._getCommandItems() } />
-        <MarqueeSelection selection={ selection } isEnabled={ selectionMode === SelectionMode.multiple } >
+        <MarqueeSelection selection={ selection } isEnabled={ selection.mode === SelectionMode.multiple } >
           <SelectionZone
             selection={ selection }
-            selectionMode={ selectionMode }
             onItemInvoked={ (item) => alert('item invoked: ' + item.name) }>
             { items.map((item, index) => (
               <SelectionItemExample
@@ -103,7 +102,6 @@ export class SelectionBasicExample extends React.Component<any, ISelectionBasicE
                 key={ item.key }
                 item={ item }
                 itemIndex={ index }
-                selectionMode={ selectionMode }
                 selection={ selection }
               />
             )) }
@@ -125,18 +123,30 @@ export class SelectionBasicExample extends React.Component<any, ISelectionBasicE
   }
 
   private _onSelectionModeChanged(ev: React.MouseEvent<HTMLElement>, menuItem: IContextualMenuItem) {
-    this.setState({
-      selectionMode: menuItem.data
+    this.setState((previousState: ISelectionBasicExampleState) => {
+      let newSelection = new Selection({
+        onSelectionChanged: this._onSelectionChanged,
+        canSelectItem: previousState.canSelect === 'vowels' ? this._canSelectItem : undefined,
+        selectionMode: menuItem.data
+      });
+      newSelection.setItems(previousState.items as IObjectWithKey[], false);
+
+      return {
+        selection: newSelection
+      };
     });
   }
 
   private _onCanSelectChanged(ev: React.MouseEvent<HTMLElement>, menuItem: IContextualMenuItem) {
     let canSelectItem = (menuItem.data === 'vowels') ? this._canSelectItem : undefined;
-    let newSelection = new Selection({ onSelectionChanged: this._onSelectionChanged, canSelectItem: canSelectItem });
-    newSelection.setItems(this.state.items as IObjectWithKey[], false);
-    this.setState({
-      selection: newSelection,
-      canSelect: (menuItem.data === 'vowels') ? 'vowels' : 'all'
+
+    this.setState((previousState: ISelectionBasicExampleState) => {
+      let newSelection = new Selection({ onSelectionChanged: this._onSelectionChanged, canSelectItem: canSelectItem, selectionMode: previousState.selection.mode });
+      newSelection.setItems(previousState.items as IObjectWithKey[], false);
+      return {
+        selection: newSelection,
+        canSelect: (menuItem.data === 'vowels') ? 'vowels' : 'all'
+      };
     });
   }
 
@@ -145,7 +155,7 @@ export class SelectionBasicExample extends React.Component<any, ISelectionBasicE
   }
 
   private _getCommandItems(): IContextualMenuItem[] {
-    let { selectionMode, canSelect } = this.state;
+    let { selection, canSelect } = this.state;
 
     return [
       {
@@ -156,7 +166,7 @@ export class SelectionBasicExample extends React.Component<any, ISelectionBasicE
             key: SelectionMode[SelectionMode.none],
             name: 'None',
             canCheck: true,
-            checked: selectionMode === SelectionMode.none,
+            checked: selection.mode === SelectionMode.none,
             onClick: this._onSelectionModeChanged,
             data: SelectionMode.none
 
@@ -165,7 +175,7 @@ export class SelectionBasicExample extends React.Component<any, ISelectionBasicE
             key: SelectionMode[SelectionMode.single],
             name: 'Single select',
             canCheck: true,
-            checked: selectionMode === SelectionMode.single,
+            checked: selection.mode === SelectionMode.single,
             onClick: this._onSelectionModeChanged,
             data: SelectionMode.single
           },
@@ -173,7 +183,7 @@ export class SelectionBasicExample extends React.Component<any, ISelectionBasicE
             key: SelectionMode[SelectionMode.multiple],
             name: 'Multi select',
             canCheck: true,
-            checked: selectionMode === SelectionMode.multiple,
+            checked: selection.mode === SelectionMode.multiple,
             onClick: this._onSelectionModeChanged,
             data: SelectionMode.multiple
           },
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/interfaces.ts b/packages/office-ui-fabric-react/src/utilities/selection/interfaces.ts
index ab2c3df213c61..3b6783c4855be 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/interfaces.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selection/interfaces.ts
@@ -12,7 +12,9 @@ export enum SelectionMode {
 
 export interface ISelection {
   count: number;
-  canSelectItem?: (item: IObjectWithKey) => boolean;
+  mode: SelectionMode;
+
+  canSelectItem: (item: IObjectWithKey) => boolean;
 
   // Obesrvable methods.
   setChangeEvents(isEnabled: boolean, suppressChange?: boolean): void;

From 0d1a498dbb1fb2456db97592c553fbe05572930a Mon Sep 17 00:00:00 2001
From: jijizz <liu_zhi8@hotmail.com>
Date: Wed, 23 Aug 2017 16:37:28 -0700
Subject: [PATCH 0478/1641] Adding the ability to disable withViewport
 measuring to improve performance (#2592)

* perf optimization in withViewport, do not need to do expensive measurement when list is fixed column layout

* change file

* Update withViewport.tsx

* Update withViewport.tsx

* Update zhiliu-viewportPerf_2017-08-23-19-56.json
---
 .../zhiliu-viewportPerf_2017-08-23-19-56.json    | 11 +++++++++++
 .../components/DetailsList/DetailsList.Props.ts  |  4 ++--
 .../src/utilities/decorators/withViewport.tsx    | 16 ++++++++++++++--
 3 files changed, 27 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/zhiliu-viewportPerf_2017-08-23-19-56.json

diff --git a/common/changes/office-ui-fabric-react/zhiliu-viewportPerf_2017-08-23-19-56.json b/common/changes/office-ui-fabric-react/zhiliu-viewportPerf_2017-08-23-19-56.json
new file mode 100644
index 0000000000000..1f08ce6537ade
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/zhiliu-viewportPerf_2017-08-23-19-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "withViewport: adding the ability to disable measures to improve performance of rendering the DetailsList in fixed mode.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "zhiliu@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
index 8d39924ccded7..0378ac0d0b587 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
@@ -16,7 +16,7 @@ import {
 } from '../GroupedList/index';
 import { IDetailsRowProps } from '../DetailsList/DetailsRow';
 import { IDetailsHeaderProps } from './DetailsHeader';
-import { IViewport } from '../../utilities/decorators/withViewport';
+import { IWithViewportProps, IViewport } from '../../utilities/decorators/withViewport';
 import { IListProps } from '../List/index';
 
 export { IDetailsHeaderProps };
@@ -30,7 +30,7 @@ export interface IDetailsList {
   forceUpdate: () => void;
 }
 
-export interface IDetailsListProps extends React.Props<DetailsList> {
+export interface IDetailsListProps extends React.Props<DetailsList>, IWithViewportProps {
   /**
    * Optional callback to access the IDetailsList interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx b/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx
index 01241f197ad69..b0334ce2a4866 100644
--- a/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx
@@ -14,6 +14,10 @@ export interface IWithViewportState {
   viewport?: IViewport;
 }
 
+export interface IWithViewportProps {
+  skipViewportMeasures?: boolean;
+}
+
 const RESIZE_DELAY = 500;
 const MAX_RESIZE_ATTEMPTS = 3;
 
@@ -47,7 +51,12 @@ export function withViewport<P extends { viewport?: IViewport }, S>(ComposedComp
         });
 
       this._events.on(window, 'resize', this._onAsyncResize);
-      this._updateViewport();
+      const {
+        skipViewportMeasures
+      } = this.props as IWithViewportProps;
+      if (!skipViewportMeasures) {
+        this._updateViewport();
+      }
     }
 
     public componentWillUnmount() {
@@ -56,7 +65,10 @@ export function withViewport<P extends { viewport?: IViewport }, S>(ComposedComp
 
     public render() {
       let { viewport } = this.state;
-      let isViewportVisible = viewport!.width > 0 && viewport!.height > 0;
+      const {
+        skipViewportMeasures
+      } = this.props as IWithViewportProps;
+      let isViewportVisible = skipViewportMeasures || (viewport!.width > 0 && viewport!.height > 0);
 
       return (
         <div className='ms-Viewport' ref='root' style={ { minWidth: 1, minHeight: 1 } }>

From a22b9c12cba3c9df75beeb076a929f2d8a3bc8a6 Mon Sep 17 00:00:00 2001
From: Manish Dahamiwal <mdhamiwal@gmail.com>
Date: Thu, 24 Aug 2017 05:09:09 +0530
Subject: [PATCH 0479/1641] Checkbox: support for aria attributes (#2441)

* adding aria attributes to checkbox

* resolved CR comments, added example

* resolving comments
---
 .../checkbox-a11y_2017-08-09-14-11.json         | 11 +++++++++++
 .../src/components/Checkbox/Checkbox.Props.ts   | 17 ++++++++++++++++-
 .../src/components/Checkbox/Checkbox.tsx        |  6 ++++++
 .../examples/Checkbox.Basic.Example.tsx         |  2 ++
 4 files changed, 35 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/checkbox-a11y_2017-08-09-14-11.json

diff --git a/common/changes/office-ui-fabric-react/checkbox-a11y_2017-08-09-14-11.json b/common/changes/office-ui-fabric-react/checkbox-a11y_2017-08-09-14-11.json
new file mode 100644
index 0000000000000..a3425510dd7b6
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/checkbox-a11y_2017-08-09-14-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Checkbox: support for aria attributes",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "manishda@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
index 7263df43c023a..6a0fdceef82d0 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
@@ -74,6 +74,21 @@ export interface ICheckboxProps extends React.ButtonHTMLAttributes<HTMLElement |
    */
   theme?: ITheme;
 
+  /**
+   * Accessible label for the checkbox.
+   */
+  ariaLabel?: string;
+
+  /**
+   * ID for element that contains label information for the checkbox.
+   */
+  ariaLabelledBy?: string;
+
+  /**
+   * ID for element that provides extended information for the checkbox.
+   */
+  ariaDescribedBy?: string;
+
   /**
    * Custom styles for this component
    */
@@ -170,4 +185,4 @@ export interface ICheckboxStyles {
    * Style override for text appearing with the checkbox when disabled.
    */
   textDisabled?: IStyle;
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
index 80d340e559cf5..6e2f00a216144 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
@@ -83,6 +83,9 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
       name,
       boxSide,
       theme,
+      ariaLabel,
+      ariaLabelledBy,
+      ariaDescribedBy,
       styles: customStyles,
       onRenderLabel = this._onRenderLabel
     } = this.props;
@@ -115,6 +118,9 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
         onBlur={ this._onBlur }
         aria-checked={ isChecked }
         aria-disabled={ disabled }
+        aria-label={ ariaLabel }
+        aria-labelledby={ ariaLabelledBy }
+        aria-describedby={ ariaDescribedBy }
       >
         <label className={ this._classNames.label } htmlFor={ this._id } >
           <div className={ this._classNames.checkbox }>
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
index 65fe061af03fc..5e58d05eec946 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
@@ -42,7 +42,9 @@ export class CheckboxBasicExample extends React.Component<{}, ICheckboxBasicExam
             onBlur: () => { console.log('Uncontrolled checkbox is blured'); }
           } }
           styles={ styles }
+          ariaDescribedBy={ 'descriptionID' }
         />
+        <label id='descriptionID' className='screenReaderOnly'>Uncontroller checkbox description</label>
 
         <Checkbox
           label='Uncontrolled checkbox with defaultChecked true'

From b3060b01dc2875f6efa770f30ac355c59b62ccb5 Mon Sep 17 00:00:00 2001
From: Roel <roelvb@roelvb.nl>
Date: Thu, 24 Aug 2017 01:43:45 +0200
Subject: [PATCH 0480/1641] Implemented selectionStart and selectionEnd getters
 on TextField (#2475)

* Implemented selectionStart and selectionEnd getters on TextField

* Update TextField.Props.ts

* Update TextField.Props.ts

* Update TextField.tsx
---
 .../src/components/TextField/TextField.Props.ts    | 10 ++++++++--
 .../src/components/TextField/TextField.tsx         | 14 ++++++++++++++
 2 files changed, 22 insertions(+), 2 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts b/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts
index 556a4fce64aea..86fca64cf98eb 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts
@@ -12,10 +12,10 @@ export interface ITextField {
   /** Select the value of the text field. */
   select: () => void;
 
-  /** Sets the selection start of the text field to a specified value */
+  /** Sets the selection start of the text field to a specified value. */
   setSelectionStart: (value: number) => void;
 
-  /** Sets the selection end of the text field to a specified value */
+  /** Sets the selection end of the text field to a specified value. */
   setSelectionEnd: (value: number) => void;
 
   /**
@@ -24,6 +24,12 @@ export interface ITextField {
    * @param end Index of the end of the selection.
    */
   setSelectionRange: (start: number, end: number) => void;
+
+  /** Gets the selection start of the text field. Returns -1 if there is no selection. */
+  selectionStart: number;
+
+  /** Gets the selection end of the text field. Returns -1 if there is no selection. */
+  selectionEnd: number;
 }
 
 /**
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index 21a16d5d53c58..c7177136030ae 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -223,6 +223,20 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
     }
   }
 
+  /**
+   * Gets the selection start of the text field
+   */
+  public get selectionStart(): number {
+    return this._textElement ? this._textElement.selectionStart : -1;    
+  }
+
+  /**
+   * Gets the selection end of the text field
+   */
+  public get selectionEnd(): number {
+    return this._textElement ? this._textElement.selectionEnd : -1;
+  }
+
   /**
    * Sets the start and end positions of a selection in a text field.
    * @param start Index of the start of the selection.

From f641204ac5537dfaed6787fbece6d512e6e29439 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 23 Aug 2017 16:48:24 -0700
Subject: [PATCH 0481/1641] Cleaning up change files, adding textfield one.

---
 .../selection-mode_2017-08-23-17-57.json              |  2 +-
 common/changes/office-ui-fabric-react/textfield.json  | 11 +++++++++++
 ...wliu-detailsrow-check-margin_2017-08-23-20-11.json |  2 +-
 3 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/textfield.json

diff --git a/common/changes/office-ui-fabric-react/selection-mode_2017-08-23-17-57.json b/common/changes/office-ui-fabric-react/selection-mode_2017-08-23-17-57.json
index dcbdc77dcb080..c006b987f2acc 100644
--- a/common/changes/office-ui-fabric-react/selection-mode_2017-08-23-17-57.json
+++ b/common/changes/office-ui-fabric-react/selection-mode_2017-08-23-17-57.json
@@ -2,7 +2,7 @@
   "changes": [
     {
       "packageName": "office-ui-fabric-react",
-      "comment": "Make SelectionMode intrinsic to Selection model",
+      "comment": "Selection: now takes in a selectionMode, which DetailsList and others can read from. This does not break any existing SelectionMode passed into DetailsList currently but allows you to move the setting to the Selection object.",
       "type": "minor"
     }
   ],
diff --git a/common/changes/office-ui-fabric-react/textfield.json b/common/changes/office-ui-fabric-react/textfield.json
new file mode 100644
index 0000000000000..c9ed02953edf4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/textfield.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "TextField: Added selectionStart and selectionEnd getters to ITextField.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-edwliu-detailsrow-check-margin_2017-08-23-20-11.json b/common/changes/office-ui-fabric-react/v-edwliu-detailsrow-check-margin_2017-08-23-20-11.json
index 62a62da5301df..28ed18e1a4a07 100644
--- a/common/changes/office-ui-fabric-react/v-edwliu-detailsrow-check-margin_2017-08-23-20-11.json
+++ b/common/changes/office-ui-fabric-react/v-edwliu-detailsrow-check-margin_2017-08-23-20-11.json
@@ -2,7 +2,7 @@
   "changes": [
     {
       "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: Set button.check margin to 0",
+      "comment": "DetailsRow: Removed margin from check buttons.",
       "type": "patch"
     }
   ],

From 5803bbd5fcbf189e55c7826189edaf93a79dc6c5 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Wed, 23 Aug 2017 16:57:05 -0700
Subject: [PATCH 0482/1641] Fix accessible labeling for DetailsList column
 headers (#2578)

* Fix accessible labeling of DetailsList column headers

* Update change output

* Address PR feedback
---
 .../details-columns_2017-08-22-20-39.json     | 11 +++
 .../components/DetailsList/DetailsHeader.scss |  4 +
 .../components/DetailsList/DetailsHeader.tsx  | 94 ++++++++++++-------
 .../examples/DetailsList.Basic.Example.tsx    | 10 --
 4 files changed, 74 insertions(+), 45 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/details-columns_2017-08-22-20-39.json

diff --git a/common/changes/office-ui-fabric-react/details-columns_2017-08-22-20-39.json b/common/changes/office-ui-fabric-react/details-columns_2017-08-22-20-39.json
new file mode 100644
index 0000000000000..ac1318f9711f3
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/details-columns_2017-08-22-20-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix aria-labeling for DetailsList column headers",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
index df6836c39b819..c7e5e0ea9c4a1 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
@@ -180,3 +180,7 @@ $isPaddedMargin: 24px;
 .cell .collapseButton {
   @include ms-padding-right(0);
 }
+
+.accessibleLabel {
+  @include ms-screenReaderOnly;
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index bad479414fcf0..9cd944351a7ad 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -150,38 +150,50 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
         direction={ FocusZoneDirection.horizontal }
       >
         { showCheckbox ? (
-          <div
-            className={ css(
-              'ms-DetailsHeader-cell',
-              'ms-DetailsHeader-cellIsCheck',
-              styles.cell,
-              styles.cellIsCheck,
-              checkStyles.owner,
-              isAllSelected && checkStyles.isSelected
-            ) }
-            onClick={ this._onSelectAllClicked }
-            aria-colindex={ 0 }
-            role='columnheader' >
-            <span
-              aria-label={ ariaLabelForSelectionColumn }
-            ></span>
-            {
-              onRenderColumnHeaderTooltip({
-                hostClassName: css(styles.checkTooltip),
-                id: `${this._id}-checkTooltip`,
-                setAriaDescribedBy: false,
-                content: ariaLabelForSelectAllCheckbox,
-                children: (
-                  <DetailsRowCheck
-                    aria-describedby={ `${this._id}-checkTooltip` }
-                    selected={ isAllSelected }
-                    anySelected={ false }
-                    canSelect={ true }
-                  />
-                )
-              }, this._onRenderColumnHeaderTooltip)
-            }
-          </div >
+          [
+            <div
+              key='__checkbox'
+              className={ css(
+                'ms-DetailsHeader-cell',
+                'ms-DetailsHeader-cellIsCheck',
+                styles.cell,
+                styles.cellIsCheck,
+                checkStyles.owner,
+                isAllSelected && checkStyles.isSelected
+              ) }
+              aria-labelledby={ `${this._id}-check` }
+              onClick={ this._onSelectAllClicked }
+              aria-colindex={ 0 }
+              role='columnheader' >
+              {
+                onRenderColumnHeaderTooltip({
+                  hostClassName: css(styles.checkTooltip),
+                  id: `${this._id}-checkTooltip`,
+                  setAriaDescribedBy: false,
+                  content: ariaLabelForSelectAllCheckbox,
+                  children: (
+                    <DetailsRowCheck
+                      id={ `${this._id}-check` }
+                      aria-label={ ariaLabelForSelectionColumn }
+                      aria-describedby={ `${this._id}-checkTooltip` }
+                      selected={ isAllSelected }
+                      anySelected={ false }
+                      canSelect={ true }
+                    />
+                  )
+                }, this._onRenderColumnHeaderTooltip)
+              }
+            </div>,
+            ariaLabelForSelectAllCheckbox && !this.props.onRenderColumnHeaderTooltip ? (
+              <label
+                key='__checkboxLabel'
+                id={ `${this._id}-checkTooltip` }
+                className={ styles.accessibleLabel }
+              >
+                { ariaLabelForSelectAllCheckbox }
+              </label>
+            ) : null
+          ]
         ) : null
         }
         {
@@ -238,6 +250,9 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
                       content: column.columnActionsMode !== ColumnActionsMode.disabled ? column.ariaLabel : '',
                       children: (
                         <span
+                          id={ `${this._id}-${column.key}` }
+                          aria-label={ column.isIconOnly ? column.name : undefined }
+                          aria-labelledby={ column.isIconOnly ? undefined : `${this._id}-${column.key}-name ` }
                           className={ css('ms-DetailsHeader-cellTitle', styles.cellTitle) }
                           data-is-focusable={ column.columnActionsMode !== ColumnActionsMode.disabled }
                           role={ column.columnActionsMode !== ColumnActionsMode.disabled ? 'button' : undefined }
@@ -246,7 +261,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
                           onClick={ this._onColumnClick.bind(this, column) }
                         >
                           <span
-                            aria-label={ column.isIconOnly ? column.name : undefined }
+                            id={ `${this._id}-${column.key}-name` }
                             className={ css('ms-DetailsHeader-cellName',
                               styles.cellName, {
                                 [styles.iconOnlyHeader]: column.isIconOnly
@@ -278,11 +293,19 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
                             />
                           ) }
                         </span>
-
                       )
                     }, this._onRenderColumnHeaderTooltip)
                   }
                 </div>,
+                column.ariaLabel && !this.props.onRenderColumnHeaderTooltip ? (
+                  <label
+                    key={ `${column.key}_label` }
+                    id={ `${this._id}-${column.key}-tooltip` }
+                    className={ styles.accessibleLabel }
+                  >
+                    { column.ariaLabel }
+                  </label>
+                ) : null,
                 (column.isResizable) && this._renderColumnSizer(columnIndex)
               ]
             );
@@ -299,7 +322,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
             </Layer>
           )
         }
-      </FocusZone >
+      </FocusZone>
     );
   }
 
@@ -315,6 +338,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
 
     return (
       <div
+        key={ `${column.key}_sizer` }
         aria-hidden={ true }
         role='button'
         data-is-focusable={ false }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
index 5580772c21e27..3bd3f1c7e2eb4 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
@@ -12,10 +12,6 @@ import {
 import {
   IRenderFunction
 } from 'office-ui-fabric-react/lib/Utilities';
-import {
-  TooltipHost,
-  ITooltipHostProps
-} from 'office-ui-fabric-react/lib/Tooltip';
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
 
 let _items: any[] = [];
@@ -84,12 +80,6 @@ export class DetailsListBasicExample extends React.Component<any, any> {
             columns={ _columns }
             setKey='set'
             layoutMode={ DetailsListLayoutMode.fixedColumns }
-            onRenderDetailsHeader={
-              (detailsHeaderProps: IDetailsHeaderProps, defaultRender: IRenderFunction<IDetailsHeaderProps>) => defaultRender({
-                ...detailsHeaderProps,
-                onRenderColumnHeaderTooltip: (tooltipHostProps: ITooltipHostProps) => <TooltipHost { ...tooltipHostProps } />
-              })
-            }
             selection={ this._selection }
             selectionPreservedOnEmptyClick={ true }
             ariaLabelForSelectionColumn='Toggle selection'

From 00dcae5bd4d9166ad61e76222427df94021bb06e Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Wed, 23 Aug 2017 16:58:16 -0700
Subject: [PATCH 0483/1641] Utilities: Add type safety to createArray and
 findIndex (#2567)

* Add typesafety to the array helpers

* rush change

* Fix build break

* remove unused import
---
 ...utilities-typesafety_2017-08-21-20-42.json | 11 ++++++
 ...utilities-typesafety_2017-08-21-20-42.json | 11 ++++++
 .../examples/FocusZone.List.Example.tsx       |  2 +-
 .../MarqueeSelection.Basic.Example.tsx        | 10 ++++--
 packages/utilities/api/utilities.api.ts       |  4 +--
 packages/utilities/src/array.test.ts          | 35 +++++++++++++++++++
 6 files changed, 68 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/utilities-typesafety_2017-08-21-20-42.json
 create mode 100644 common/changes/office-ui-fabric-react/utilities-typesafety_2017-08-21-20-42.json
 create mode 100644 packages/utilities/src/array.test.ts

diff --git a/common/changes/@uifabric/utilities/utilities-typesafety_2017-08-21-20-42.json b/common/changes/@uifabric/utilities/utilities-typesafety_2017-08-21-20-42.json
new file mode 100644
index 0000000000000..8ccdeec536db7
--- /dev/null
+++ b/common/changes/@uifabric/utilities/utilities-typesafety_2017-08-21-20-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Array: Add typesafety for createArray and findIndex",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/utilities-typesafety_2017-08-21-20-42.json b/common/changes/office-ui-fabric-react/utilities-typesafety_2017-08-21-20-42.json
new file mode 100644
index 0000000000000..d4aea377503d2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/utilities-typesafety_2017-08-21-20-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "office-ui-fabric-react",
+      "type": "none"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.List.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.List.Example.tsx
index 1c3d74f73d4a4..c274a7ed4ff48 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.List.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.List.Example.tsx
@@ -11,7 +11,7 @@ import { DetailsRow, IColumn, Selection, SelectionMode } from 'office-ui-fabric-
 import './FocusZone.List.Example.scss';
 
 const ITEMS = createArray(10, (index) => ({
-  key: index,
+  key: index.toString(),
   name: 'Item-' + index,
   url: 'http://placehold.it/100x' + (200 + index!)
 }));
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
index 3443d232e02c9..48d873c851525 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
@@ -7,10 +7,16 @@ import {
   createArray
 } from 'office-ui-fabric-react/lib/Utilities';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
-import { MarqueeSelection, Selection } from 'office-ui-fabric-react/lib/MarqueeSelection';
+import { MarqueeSelection, Selection, IObjectWithKey } from 'office-ui-fabric-react/lib/MarqueeSelection';
 import './MarqueeSelection.Basic.Example.scss';
 
-const PHOTOS = createArray(250, (index: number) => {
+interface IPhoto extends IObjectWithKey {
+  url: string;
+  width: number;
+  height: number;
+}
+
+const PHOTOS: IPhoto[] = createArray(250, (index: number) => {
   const randomWidth = 50 + Math.floor(Math.random() * 150);
 
   return {
diff --git a/packages/utilities/api/utilities.api.ts b/packages/utilities/api/utilities.api.ts
index 64d6c0baddfde..1c9fe98f170fa 100644
--- a/packages/utilities/api/utilities.api.ts
+++ b/packages/utilities/api/utilities.api.ts
@@ -55,7 +55,7 @@ class BaseComponent<P extends IBaseProps, S> extends React.Component<P, S> {
 }
 
 // @public
-export function createArray(size: number, getItem?: (index?: number) => any): any[];
+export function createArray < T >(size: number, getItem: (index: number) => T): T[];
 
 // WARNING: contextTypes has incomplete type information
 // WARNING: childContextTypes has incomplete type information
@@ -106,7 +106,7 @@ class FabricPerformance {
 }
 
 // @public
-export function findIndex(array: any[], cb: (item: any, index?: number) => boolean): number;
+export function findIndex < T >(array: T[], cb: (item: any, index: number) => boolean): number;
 
 // @public
 export function findScrollableParent(startingElement: HTMLElement): HTMLElement | null;
diff --git a/packages/utilities/src/array.test.ts b/packages/utilities/src/array.test.ts
new file mode 100644
index 0000000000000..1b3e0d7d0ec8b
--- /dev/null
+++ b/packages/utilities/src/array.test.ts
@@ -0,0 +1,35 @@
+import { findIndex, createArray } from './array';
+let { expect } = chai;
+
+describe('array utils tests', () => {
+  describe('findIndex tests', () => {
+    it('returns -1 when there is no match in the array', () => {
+      const array = [0, 1, 2];
+      const index = findIndex(array, _ => false);
+
+      expect(index).equals(-1);
+    });
+
+    it('should return the correct index when the predicate satisfies the condition', () => {
+      const array = [0, 1, 2];
+      const index = findIndex(array, elem => elem === 1);
+
+      expect(index).equals(1);
+    });
+
+    it('should return the first index when repeated elements satisfy the predicate', () => {
+      const array = [0, 1, 2, 2];
+      const index = findIndex(array, elem => elem === 2);
+
+      expect(index).equals(2);
+    });
+  });
+
+  describe('createArray tests', () => {
+    it('creates an array while invoking the callback', () => {
+      let result = createArray(4, (index: number) => String.fromCharCode('a'.charCodeAt(0) + index));
+
+      expect(result).to.deep.equal(['a', 'b', 'c', 'd']);
+    });
+  });
+});
\ No newline at end of file

From cd5b68bacd924f438829c16d9e824cfa5bf9b632 Mon Sep 17 00:00:00 2001
From: Sohan Fernando <ohritz@users.noreply.github.com>
Date: Thu, 24 Aug 2017 02:24:02 +0200
Subject: [PATCH 0484/1641] Implemented BasePicker itemLimit (#2553)

* Picker itemLimit implemented

* added change request

* removed leftover variable assignment from previous iteration

* removed debug remnant..

* added jsDoc defualt value for itemLimit Prop

* simplified logic and changed function name to be more consistent

* added more tests for itemLimit

* fixes in focus handling when itemLimit set. (needs test)
---
 .../master_2017-08-20-21-11.json              | 11 +++
 .../components/pickers/BasePicker.Props.ts    |  6 ++
 .../components/pickers/BasePicker.test.tsx    | 67 +++++++++++++++++++
 .../src/components/pickers/BasePicker.tsx     | 19 ++++--
 .../examples/TagPicker.Basic.Example.tsx      |  1 +
 5 files changed, 98 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/master_2017-08-20-21-11.json

diff --git a/common/changes/office-ui-fabric-react/master_2017-08-20-21-11.json b/common/changes/office-ui-fabric-react/master_2017-08-20-21-11.json
new file mode 100644
index 0000000000000..238793c9d1aa5
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2017-08-20-21-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "BasePicker: added itemLimit property, which will allow preventing adding more items than set limit.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "sohan@graceful.nu"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
index f5d9dad3b6d03..b4a4b41526f2b 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
@@ -93,6 +93,12 @@ export interface IBasePickerProps<T> extends React.Props<any> {
    * @default false
    */
   disabled?: boolean;
+
+  /**
+   * Restrict the amount of selectable items.
+   * @default undefined
+   */
+  itemLimit?: number;
   /**
    * Function that specifies how arbitrary text entered into the well is handled.
    */
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
index 8af6023edccea..05479c9942f56 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
@@ -81,6 +81,73 @@ describe('Pickers', () => {
 
     });
 
+    it('can will not render input when items reach itemLimit', () => {
+      let root = document.createElement('div');
+      document.body.appendChild(root);
+      let picker: TypedBasePicker = ReactDOM.render(
+        <BasePickerWithType
+          onResolveSuggestions={ onResolveSuggestions }
+          onRenderItem={ (props: IPickerItemProps<{ key: string, name: string }>) => <div key={ props.item.name }>{ basicRenderer(props) }</div> }
+          onRenderSuggestionsItem={ basicSuggestionRenderer }
+          itemLimit={ 1 }
+        />,
+        root
+      ) as TypedBasePicker;
+      let input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
+      input.focus();
+      input.value = 'bl';
+      ReactTestUtils.Simulate.change(input);
+
+      let suggestions = document.querySelector('.ms-Suggestions') as HTMLInputElement;
+      let suggestionOptions = document.querySelectorAll('.ms-Suggestions-itemButton');
+      ReactTestUtils.Simulate.click(suggestionOptions[0]);
+      expect(picker.items.length).to.be.equal(1, 'There was not only 1 item selected');
+      input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
+      expect(input).to.be.null;
+
+      ReactDOM.unmountComponentAtNode(root);
+    });
+
+    it('will still render with itemLimit set to 0', () => {
+      let root = document.createElement('div');
+      document.body.appendChild(root);
+      let picker: TypedBasePicker = ReactDOM.render(
+        <BasePickerWithType
+          onResolveSuggestions={ onResolveSuggestions }
+          onRenderItem={ (props: IPickerItemProps<{ key: string, name: string }>) => <div key={ props.item.name }>{ basicRenderer(props) }</div> }
+          onRenderSuggestionsItem={ basicSuggestionRenderer }
+          itemLimit={ 0 }
+        />,
+        root
+      ) as TypedBasePicker;
+
+      let input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
+      expect(input).to.be.null;
+
+      ReactDOM.unmountComponentAtNode(root);
+    });
+
+    it('can be set with selectedItems and a lower itemLimit', () => {
+      let root = document.createElement('div');
+      document.body.appendChild(root);
+      let picker: TypedBasePicker = ReactDOM.render(
+        <BasePickerWithType
+          selectedItems={ [{ key: '1', name: 'blue' }, { key: '2', name: 'black' }] }
+          onResolveSuggestions={ onResolveSuggestions }
+          onRenderItem={ (props: IPickerItemProps<{ key: string, name: string }>) => <div key={ props.item.name }>{ basicRenderer(props) }</div> }
+          onRenderSuggestionsItem={ basicSuggestionRenderer }
+          itemLimit={ 0 }
+        />,
+        root
+      ) as TypedBasePicker;
+
+      let input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
+      expect(input).to.be.null;
+      expect(picker.items.length).to.equal(2);
+
+      ReactDOM.unmountComponentAtNode(root);
+    });
+
   });
 
   describe('TagPicker', () => {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 675af774d1e0f..53c5cc57b5182 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -156,7 +156,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
           <SelectionZone selection={ this.selection } selectionMode={ SelectionMode.multiple }>
             <div className={ css('ms-BasePicker-text', styles.pickerText) } role={ 'list' }>
               { this.renderItems() }
-              <BaseAutoFill
+              { this.canAddItems() && (<BaseAutoFill
                 { ...inputProps as any }
                 className={ css('ms-BasePicker-input', styles.pickerInput) }
                 ref={ this._resolveRef('input') }
@@ -171,7 +171,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
                 autoComplete='off'
                 role='combobox'
                 disabled={ disabled }
-              />
+              />) }
             </div>
           </SelectionZone>
         </FocusZone>
@@ -180,6 +180,12 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     );
   }
 
+  protected canAddItems(): boolean {
+    const { items } = this.state;
+    const { itemLimit } = this.props;
+    return itemLimit === undefined || items.length < itemLimit;
+  }
+
   protected renderSuggestions(): JSX.Element | null {
     let TypedSuggestion = this.SuggestionOfProperType;
     return this.state.suggestionsVisible ? (
@@ -230,10 +236,12 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
     if (items.length && index! >= 0) {
       let newEl: HTMLElement = this.root.querySelectorAll('[data-selection-index]')[Math.min(index!, items.length - 1)] as HTMLElement;
-
       if (newEl) {
         this.focusZone.focusElement(newEl);
       }
+    } else if (!this.canAddItems()) {
+      (items[items.length - 1] as IPickerItemProps<T>).selected = true;
+      this.resetFocus(items.length - 1);
     } else {
       this.input.focus();
     }
@@ -387,7 +395,6 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   @autobind
   protected onKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
-    let value = this.input.value;
     switch (ev.which) {
       case KeyCodes.escape:
         if (this.state.suggestionsVisible) {
@@ -414,7 +421,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
         break;
 
       case KeyCodes.del:
-        if (ev.target === this.input.inputElement && this.state.suggestionsVisible && this.suggestionStore.currentIndex !== -1) {
+        if (this.input && ev.target === this.input.inputElement && this.state.suggestionsVisible && this.suggestionStore.currentIndex !== -1) {
           if (this.props.onRemoveSuggestion) {
             (this.props.onRemoveSuggestion as any)(this.suggestionStore.currentSuggestion!.item);
           }
@@ -552,7 +559,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   // This is protected because we may expect the backspace key to work differently in a different kind of picker.
   // This lets the subclass override it and provide it's own onBackspace. For an example see the BasePickerListBelow
   protected onBackspace(ev: React.KeyboardEvent<HTMLElement>) {
-    if (this.state.items.length && !this.input.isValueSelected && this.input.cursorLocation === 0) {
+    if (this.state.items.length && !this.input || (!this.input.isValueSelected && this.input.cursorLocation === 0)) {
       if (this.selection.getSelectedCount() > 0) {
         this.removeItems(this.selection.getSelection());
       } else {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
index 7b664722e94aa..5851b72517201 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
@@ -42,6 +42,7 @@ export class TagPickerBasicExample extends React.Component<{}, ITagPickerDemoPag
               noResultsFoundText: 'No Color Tags Found'
             }
           }
+          itemLimit={ 2 }
           disabled={ this.state.isPickerDisabled }
           inputProps={ {
             onBlur: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onBlur called'),

From ed1912293fb8aaf2485833e73c7f5f2ae549ed37 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 23 Aug 2017 18:55:17 -0700
Subject: [PATCH 0485/1641] Private methods without underscores should break
 the build (#2603)

* updating lint to prevent privates from not having underscores.

* updated rules.

* Oh there are errors! Yay catching bugs and inconsistencies!

* one more.
---
 .../src/components/CommandBar/CommandBar.tsx  |  6 ++---
 .../office-ui-fabric-react-tslint/tslint.json | 10 ++++++++
 .../src/components/Calendar/CalendarDay.tsx   |  4 ++--
 .../src/components/Calendar/CalendarMonth.tsx |  6 ++---
 .../CommandBar.Customization.Example.tsx      |  8 +++----
 .../DetailsList.NavigatingFocus.Example.tsx   |  4 ++--
 .../src/components/Icon/Icon.tsx              |  4 ++--
 .../examples/Overlay.Light.Example.tsx        |  2 +-
 .../src/components/Pivot/Pivot.tsx            |  4 ++--
 .../ResizeGroup.OverflowSet.Example.tsx       | 24 +++++++++----------
 .../examples/SpinButton.Stateful.Example.tsx  | 12 +++++-----
 .../SwatchColorPicker/SwatchColorPicker.tsx   | 12 +++++-----
 .../src/components/Tooltip/TooltipHost.tsx    |  8 +++----
 .../SelectedItemWithMenu.tsx                  | 10 ++++----
 .../examples/PeoplePicker.Types.Example.tsx   | 18 +++++++-------
 .../Suggestions/SuggestionsController.ts      |  6 ++---
 16 files changed, 74 insertions(+), 64 deletions(-)

diff --git a/packages/experiments/src/components/CommandBar/CommandBar.tsx b/packages/experiments/src/components/CommandBar/CommandBar.tsx
index f9feed657bdd8..ed8815f3f1205 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBar.tsx
@@ -127,7 +127,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, any> implements
     this._overflowSet.focus();
   }
 
-  private computeCacheKey(primaryItems: ICommandBarItemProps[], farItems: ICommandBarItemProps[], overflow: boolean): string {
+  private _computeCacheKey(primaryItems: ICommandBarItemProps[], farItems: ICommandBarItemProps[], overflow: boolean): string {
     const returnKey = (acc: string, current: ICommandBarItemProps): string => {
       const { cacheKey = current.key } = current;
       return acc + cacheKey;
@@ -150,7 +150,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, any> implements
 
       overflowItems = [...overflowItems, movedItem];
       primaryItems = primaryItems.slice(0, -1);
-      cacheKey = this.computeCacheKey(primaryItems, farItems!, !!overflowItems.length);
+      cacheKey = this._computeCacheKey(primaryItems, farItems!, !!overflowItems.length);
 
       return { ...data, primaryItems, overflowItems, cacheKey };
     }
@@ -169,7 +169,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, any> implements
 
       overflowItems = overflowItems.slice(0, -1);
       primaryItems = [...primaryItems, movedItem];
-      cacheKey = this.computeCacheKey(primaryItems, farItems!, !!overflowItems.length);
+      cacheKey = this._computeCacheKey(primaryItems, farItems!, !!overflowItems.length);
 
       return { ...data, primaryItems, overflowItems, cacheKey };
     }
diff --git a/packages/office-ui-fabric-react-tslint/tslint.json b/packages/office-ui-fabric-react-tslint/tslint.json
index 5856052c78329..369818657a4ae 100644
--- a/packages/office-ui-fabric-react-tslint/tslint.json
+++ b/packages/office-ui-fabric-react-tslint/tslint.json
@@ -4,6 +4,16 @@
     "tslint-react"
   ],
   "rules": {
+    "function-name": [
+      true,
+      {
+        "method-regex": "^[a-z][\\w\\d]+$",
+        "private-method-regex": "^_[a-z][\\w\\d]+$",
+        "protected-method-regex": "^[_]?[a-z][\\w\\d]+$",
+        "static-method-regex": "^[a-z][\\w\\d]+$",
+        "function-regex": "^[_]?[a-z][\\w\\d]+$"
+      }
+    ],
     "jsx-curly-spacing": {
       "when": "always"
     },
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index 0e5c46075f326..c63d376199e08 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -115,7 +115,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
             <span
               className={ css('ms-DatePicker-nextMonth js-nextMonth', styles.nextMonth) }
               onClick={ this._onSelectNextMonth }
-              onKeyDown={ this.onNextMonthKeyDown }
+              onKeyDown={ this._onNextMonthKeyDown }
               aria-controls={ dayPickerId }
               aria-label={ strings.nextMonthAriaLabel }
               role='button'
@@ -279,7 +279,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
   }
 
   @autobind
-  private onNextMonthKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+  private _onNextMonthKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
     this._onKeyDown(this._onSelectNextMonth, ev);
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
index 6458a53b69def..41671e9746675 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
@@ -40,7 +40,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
       this._selectMonthCallbacks[index] = this._onSelectMonth.bind(this, index);
     });
 
-    this.isCurrentMonth = this.isCurrentMonth.bind(this);
+    this._isCurrentMonth = this._isCurrentMonth.bind(this);
     this._onSelectNextYear = this._onSelectNextYear.bind(this);
     this._onSelectPrevYear = this._onSelectPrevYear.bind(this);
     this._onSelectMonth = this._onSelectMonth.bind(this);
@@ -101,7 +101,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
                   css('ms-DatePicker-monthOption',
                     styles.monthOption,
                     {
-                      ['ms-DatePicker-day--today ' + styles.monthIsCurrentMonth]: highlightCurrentMonth && this.isCurrentMonth(index, navigatedDate.getFullYear(), today!)
+                      ['ms-DatePicker-day--today ' + styles.monthIsCurrentMonth]: highlightCurrentMonth && this._isCurrentMonth(index, navigatedDate.getFullYear(), today!)
                     })
                 }
                 key={ index }
@@ -126,7 +126,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
     }
   }
 
-  private isCurrentMonth(month: number, year: number, today: Date) {
+  private _isCurrentMonth(month: number, year: number, today: Date) {
     return today.getFullYear() === year && today.getMonth() === month;
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
index 784f7cda9cd7e..fbd5675a27cb3 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
@@ -79,7 +79,7 @@ export class CommandBarCustomizationExample extends React.Component<{}, ISplitDr
             text='New' />
           <span className={ styles.splitter }>|</span>
           <CommandButton
-            onClick={ this.onClickChevron }
+            onClick={ this._onClickChevron }
             className={ dropDownButtonClass }
             menuProps={ {
               className: css('ms-CommandBar-menuHost'),
@@ -91,13 +91,13 @@ export class CommandBarCustomizationExample extends React.Component<{}, ISplitDr
   }
 
   @autobind
-  private onClickChevron(ev: any) {
+  private _onClickChevron(ev: any) {
     ev.stopPropagation();
-    this.toggleDropDownMenuShown(ev);
+    this._toggleDropDownMenuShown(ev);
   }
 
   @autobind
-  private toggleDropDownMenuShown(ev: any) {
+  private _toggleDropDownMenuShown(ev: any) {
     this.setState({
       isContextMenuShown: !this.state.isContextMenuShown
     });
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
index d16220435a6a6..79491a6cf0f6a 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
@@ -20,7 +20,7 @@ export class DetailsListNavigatingFocusExample extends React.Component<{}, IDeta
       onRender: item =>
         <Link
           key={ item }
-          onClick={ () => this.navigate(item) }>
+          onClick={ () => this._navigate(item) }>
           { item }
         </Link>,
     } as IColumn,
@@ -40,7 +40,7 @@ export class DetailsListNavigatingFocusExample extends React.Component<{}, IDeta
     );
   }
 
-  private navigate(name: string) {
+  private _navigate(name: string) {
     this.setState({
       items: generateItems(name + '/'),
       initialFocusedIndex: 0,
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
index e473681b32087..5b69cb1202ca3 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
@@ -12,7 +12,7 @@ import {
 import { IconCodes } from '../../Styling';
 import { getStyles } from './Icon.styles';
 
-export function Icon(props: IIconProps): JSX.Element {
+export const Icon = (props: IIconProps): JSX.Element => {
   let {
     ariaLabel,
     className,
@@ -63,4 +63,4 @@ export function Icon(props: IIconProps): JSX.Element {
       </i>
     );
   }
-}
\ No newline at end of file
+};
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Light.Example.tsx b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Light.Example.tsx
index 844bc3f54e118..442fd64cfa586 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Light.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Light.Example.tsx
@@ -32,7 +32,7 @@ export class OverlayLightExample extends React.Component<any, any> {
     );
   }
 
-  public _onClick() {
+  private _onClick() {
     this.setState({
       isOverlayVisible: !this.state.isOverlayVisible
     });
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
index d48588f178584..8f172ecd029ce 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
@@ -211,7 +211,7 @@ export class Pivot extends BaseComponent<IPivotProps, IPivotState> {
           onRenderItemLink: pivotItem.props.onRenderItemLink
         });
         this._keyToIndexMapping[itemKey] = index;
-        this._keyToTabIds[itemKey] = this.getTabId(itemKey, index);
+        this._keyToTabIds[itemKey] = this._getTabId(itemKey, index);
       }
     });
 
@@ -221,7 +221,7 @@ export class Pivot extends BaseComponent<IPivotProps, IPivotState> {
   /**
    * Generates the Id for the tab button.
    */
-  private getTabId(itemKey: string, index: number): string {
+  private _getTabId(itemKey: string, index: number): string {
     if (this.props.getTabId) {
       return this.props.getTabId(itemKey, index);
     }
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
index cb71a46df6155..fbb687254813b 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
@@ -76,8 +76,8 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<{}, IResizeGrou
       <div className={ short ? styles.resizeIsShort : 'notResized' }>
         <ResizeGroup
           data={ dataToRender }
-          onReduceData={ this.onReduceData }
-          onGrowData={ onGrowDataEnabled ? this.onGrowData : undefined }
+          onReduceData={ this._onReduceData }
+          onGrowData={ onGrowDataEnabled ? this._onGrowData : undefined }
           onRenderData={ (data) => {
             return (
               <OverflowSet
@@ -105,14 +105,14 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<{}, IResizeGrou
           } }
         />
         <div className={ styles.settingsGroup }>
-          <Checkbox label='Enable caching' onChange={ this.onCachingEnabledChanged } checked={ cachingEnabled } />
-          <Checkbox label='Set onGrowData' onChange={ this.onGrowDataEnabledChanged } checked={ onGrowDataEnabled } />
-          <Checkbox label='Buttons checked' onChange={ this.onButtonsCheckedChanged } checked={ buttonsChecked } />
+          <Checkbox label='Enable caching' onChange={ this._onCachingEnabledChanged } checked={ cachingEnabled } />
+          <Checkbox label='Set onGrowData' onChange={ this._onGrowDataEnabledChanged } checked={ onGrowDataEnabled } />
+          <Checkbox label='Buttons checked' onChange={ this._onButtonsCheckedChanged } checked={ buttonsChecked } />
           <div className={ styles.itemCountDropdown } >
             <Dropdown
               label='Number of items to render'
               selectedKey={ numberOfItems.toString() }
-              onChanged={ this.onNumberOfItemsChanged }
+              onChanged={ this._onNumberOfItemsChanged }
               options={
                 [{ key: '20', text: '20' },
                 { key: '30', text: '30' },
@@ -128,7 +128,7 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<{}, IResizeGrou
   }
 
   @autobind
-  private onReduceData(currentData: any): any {
+  private _onReduceData(currentData: any): any {
     if (currentData.primary.length === 0) {
       return undefined;
     }
@@ -144,7 +144,7 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<{}, IResizeGrou
   }
 
   @autobind
-  private onGrowData(currentData: any): any {
+  private _onGrowData(currentData: any): any {
     if (currentData.overflow.length === 0) {
       return undefined;
     }
@@ -160,22 +160,22 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<{}, IResizeGrou
   }
 
   @autobind
-  private onCachingEnabledChanged(_: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean) {
+  private _onCachingEnabledChanged(_: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean) {
     this.setState({ cachingEnabled: checked });
   }
 
   @autobind
-  private onGrowDataEnabledChanged(_: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean) {
+  private _onGrowDataEnabledChanged(_: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean) {
     this.setState({ onGrowDataEnabled: checked });
   }
 
   @autobind
-  private onButtonsCheckedChanged(_: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean) {
+  private _onButtonsCheckedChanged(_: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean) {
     this.setState({ buttonsChecked: checked });
   }
 
   @autobind
-  private onNumberOfItemsChanged(option: IDropdownOption) {
+  private _onNumberOfItemsChanged(option: IDropdownOption) {
     this.setState({ numberOfItems: parseInt(option.text, 10) });
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
index d34e59081c4aa..410464d8982ee 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
@@ -11,7 +11,7 @@ export class SpinButtonStatefulExample extends React.Component<any, any> {
           label='SpinButton with custom implementation:'
           value={ '7' + suffix }
           onValidate={ (value: string) => {
-            value = this.removeSuffix(value, suffix);
+            value = this._removeSuffix(value, suffix);
             if (isNaN(+value)) {
               return '0' + suffix;
             }
@@ -19,11 +19,11 @@ export class SpinButtonStatefulExample extends React.Component<any, any> {
             return String(value) + suffix;
           } }
           onIncrement={ (value: string) => {
-            value = this.removeSuffix(value, suffix);
+            value = this._removeSuffix(value, suffix);
             return String(+value + 2) + suffix;
           } }
           onDecrement={ (value: string) => {
-            value = this.removeSuffix(value, suffix);
+            value = this._removeSuffix(value, suffix);
             return String(+value - 2) + suffix;
           } }
           onFocus={ () => console.log('onFocus called') }
@@ -33,13 +33,13 @@ export class SpinButtonStatefulExample extends React.Component<any, any> {
     );
   }
 
-  private hasSuffix(string: string, suffix: string): Boolean {
+  private _hasSuffix(string: string, suffix: string): Boolean {
     let subString = string.substr(string.length - suffix.length);
     return subString === suffix;
   }
 
-  private removeSuffix(string: string, suffix: string): string {
-    if (!this.hasSuffix(string, suffix)) {
+  private _removeSuffix(string: string, suffix: string): string {
+    if (!this._hasSuffix(string, suffix)) {
       return string;
     }
 
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
index 49653d9238246..40d3efe39749b 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
@@ -87,7 +87,7 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
         positionInSet={ positionInSet && positionInSet }
         setSize={ setSize && setSize }
         shouldFocusCircularNavigate={ shouldFocusCircularNavigate }
-        onBlur={ this.onSwatchColorPickerBlur }
+        onBlur={ this._onSwatchColorPickerBlur }
         containerClassName={ css('ms-swatchColorPickerBodyContainer', styles.swatchColorPickerContainer, className) }
       />);
   }
@@ -97,7 +97,7 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
    * make sure to clear the pending focused stated
    */
   @autobind
-  private onSwatchColorPickerBlur() {
+  private _onSwatchColorPickerBlur() {
     if (this.props.onCellFocused) {
       this.props.onCellFocused();
     }
@@ -131,8 +131,8 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
         disabled={ this.props.disabled }
         className={ styles.cell }
         onClick={ this._onCellClick }
-        onHover={ this.onGridCellHovered }
-        onFocus={ this.onGridCellFocused }
+        onHover={ this._onGridCellHovered }
+        onFocus={ this._onGridCellFocused }
         onRenderItem={ this._onRenderColorOption }
         role={ 'gridcell' }
         selected={ this.state.selectedIndex !== undefined && (this.state.selectedIndex === item.index) }
@@ -147,7 +147,7 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
    * Callback passed to the GridCell class that will trigger the onCellHovered callback of the SwatchColorPicker
    */
   @autobind
-  private onGridCellHovered(item?: IColorCellProps): void {
+  private _onGridCellHovered(item?: IColorCellProps): void {
     if (this.props && this.props.onCellHovered) {
       if (item) {
         this.props.onCellHovered(item.id, item.color);
@@ -161,7 +161,7 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
    * Callback passed to the GridCell class that will trigger the onCellFocus callback of the SwatchColorPicker
    */
   @autobind
-  private onGridCellFocused(item?: IColorCellProps): void {
+  private _onGridCellFocused(item?: IColorCellProps): void {
     if (this.props && this.props.onCellFocused) {
       if (item) {
         this.props.onCellFocused(item.id, item.color);
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
index a5703adebd885..734b921a871ac 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
@@ -114,22 +114,22 @@ export class TooltipHost extends BaseComponent<ITooltipHostProps, ITooltipHostSt
       }
     }
 
-    this.toggleTooltip(true);
+    this._toggleTooltip(true);
   }
 
   // Hide Tooltip
   @autobind
   private _onTooltipMouseLeave(ev: any) {
-    this.toggleTooltip(false);
+    this._toggleTooltip(false);
   }
 
   // Hide Tooltip
   @autobind
   private _onTooltipCallOutDismiss() {
-    this.toggleTooltip(false);
+    this._toggleTooltip(false);
   }
 
-  private toggleTooltip(isTooltipVisible: boolean) {
+  private _toggleTooltip(isTooltipVisible: boolean) {
     this.setState(
       { isTooltipVisible },
       () => this.props.onTooltipToggle &&
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
index f57d309270656..6b5e125b39aad 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
@@ -1,7 +1,7 @@
 /* tslint:disable */
 import * as React from 'react';
 /* tslint:enable */
-import { BaseComponent, css } from '../../../../Utilities';
+import { BaseComponent, autobind, css } from '../../../../Utilities';
 import { IPeoplePickerItemWithMenuProps } from './PeoplePickerItem.Props';
 import { Persona, PersonaPresence } from '../../../../Persona';
 import { ContextualMenu, DirectionalHint } from '../../../../ContextualMenu';
@@ -22,8 +22,6 @@ export class SelectedItemWithMenu extends BaseComponent<IPeoplePickerItemWithMen
 
   constructor(props: IPeoplePickerItemWithMenuProps) {
     super(props);
-    this.onContextualMenu = this.onContextualMenu.bind(this);
-    this._onCloseContextualMenu = this._onCloseContextualMenu.bind(this);
     this.state = { contextualMenuVisible: false };
   }
 
@@ -45,7 +43,7 @@ export class SelectedItemWithMenu extends BaseComponent<IPeoplePickerItemWithMen
           <div ref='ellipsisRef' className={ css('ms-PickerItem-content', styles.itemContent) }>
             <IconButton
               iconProps={ { iconName: 'More' } }
-              onClick={ this.onContextualMenu }
+              onClick={ this._onContextualMenu }
             />
           </div>
           <div className={ css('ms-PickerItem-content', styles.itemContent) }>
@@ -68,10 +66,12 @@ export class SelectedItemWithMenu extends BaseComponent<IPeoplePickerItemWithMen
     );
   }
 
-  private onContextualMenu(ev?: any) {
+  @autobind
+  private _onContextualMenu(ev?: any) {
     this.setState({ contextualMenuVisible: true });
   }
 
+  @autobind
   private _onCloseContextualMenu(ev: Event) {
     this.setState({ contextualMenuVisible: false });
   }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index 0f8ccdab2f9f3..aa4c087397019 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -128,7 +128,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     );
   }
 
-  public _renderListPicker() {
+  private _renderListPicker() {
     return (
       <ListPeoplePicker
         onResolveSuggestions={ this._onFilterChanged }
@@ -149,7 +149,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     );
   }
 
-  public _renderNormalPicker() {
+  private _renderNormalPicker() {
     return (
       <NormalPeoplePicker
         onResolveSuggestions={ this._onFilterChanged }
@@ -171,7 +171,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     );
   }
 
-  public _renderCompactPicker() {
+  private _renderCompactPicker() {
     return (
       <CompactPeoplePicker
         onResolveSuggestions={ this._onFilterChanged }
@@ -191,7 +191,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     );
   }
 
-  public _renderPreselectedItemsPicker() {
+  private _renderPreselectedItemsPicker() {
     return (
       <CompactPeoplePicker
         onResolveSuggestions={ this._onFilterChanged }
@@ -213,7 +213,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     );
   }
 
-  public _renderLimitedSearch() {
+  private _renderLimitedSearch() {
     limitedSearchSuggestionProps.resultsFooter = this._renderFooterText;
 
     return (
@@ -235,7 +235,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     );
   }
 
-  public _renderProcessSelectionPicker() {
+  private _renderProcessSelectionPicker() {
     return (
       <NormalPeoplePicker
         onResolveSuggestions={ this._onFilterChanged }
@@ -257,7 +257,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     );
   }
 
-  public _renderControlledPicker() {
+  private _renderControlledPicker() {
     let controlledItems = [];
     for (let i = 0; i < 5; i++) {
       let item = this.state.peopleList[i];
@@ -274,7 +274,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
           className={ 'ms-PeoplePicker' }
           key={ 'controlled' }
           selectedItems={ this.state.currentSelectedItems }
-          onChange={ this.onItemsChange.bind(this) }
+          onChange={ this._onItemsChange.bind(this) }
           inputProps={ {
             onBlur: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onBlur called'),
             onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called')
@@ -296,7 +296,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     );
   }
 
-  public onItemsChange(items: any[]) {
+  private _onItemsChange(items: any[]) {
     this.setState({
       currentSelectedItems: items
     });
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
index d4a7e23a13c9c..f8d6ba4738a15 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
@@ -15,7 +15,7 @@ export class SuggestionsController<T> {
 
   public updateSuggestions(newSuggestions: T[], selectedIndex?: number) {
     if (newSuggestions && newSuggestions.length > 0) {
-      this.suggestions = this._convertSuggestionsToSuggestionItems(newSuggestions);
+      this.suggestions = this.convertSuggestionsToSuggestionItems(newSuggestions);
       this.currentIndex = 0;
       if (selectedIndex !== undefined) {
         this.suggestions[selectedIndex].selected = true;
@@ -83,11 +83,11 @@ export class SuggestionsController<T> {
   }
 
   public createGenericSuggestion(itemToConvert: ISuggestionModel<T>) {
-    let itemToAdd = this._convertSuggestionsToSuggestionItems([itemToConvert])[0];
+    let itemToAdd = this.convertSuggestionsToSuggestionItems([itemToConvert])[0];
     this.currentSuggestion = itemToAdd;
   }
 
-  public _convertSuggestionsToSuggestionItems(suggestions: any[]): ISuggestionModel<T>[] {
+  public convertSuggestionsToSuggestionItems(suggestions: any[]): ISuggestionModel<T>[] {
     let converted: ISuggestionModel<T>[] = [];
     suggestions.forEach((suggestion: any) => converted.push({ item: suggestion, selected: false }));
     return converted;

From 57cd0e2dfea3dc5277cb22038690cec140868b21 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Wed, 23 Aug 2017 18:59:16 -0700
Subject: [PATCH 0486/1641] Disable jsx-no-multiline-js in Fabric tslint.json
 (#2605)

---
 packages/office-ui-fabric-react-tslint/tslint.json | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/office-ui-fabric-react-tslint/tslint.json b/packages/office-ui-fabric-react-tslint/tslint.json
index 369818657a4ae..003df4bc8c6a2 100644
--- a/packages/office-ui-fabric-react-tslint/tslint.json
+++ b/packages/office-ui-fabric-react-tslint/tslint.json
@@ -24,6 +24,7 @@
     "jsx-no-lambda": true,
     "jsx-self-close": true,
     "jsx-wrap-multiline": true,
+    "jsx-no-multiline-js": false,
     "jsx-no-string-ref": true,
     "jsx-ban-props": [
       true,

From ee6c807985284d7bc6a5a089ca79fe5d8da7f105 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Wed, 23 Aug 2017 19:01:05 -0700
Subject: [PATCH 0487/1641] Inserted disable jsx-ban-props lines to experiments
 pkg to pass tslint (#2606)

* Disable jsx-no-multiline-js in Fabric tslint.json

* Inserted disable jsx-ban-props lines to experiments pkg to pass tslint

* Added change file
---
 .../experiments-jsx-ban-props_2017-08-24-01-54.json   | 11 +++++++++++
 .../src/components/TilesList/TilesList.tsx            |  3 +++
 .../TilesList/examples/TilesList.Basic.Example.tsx    |  1 +
 .../TilesList/examples/TilesList.Document.Example.tsx |  1 +
 .../TilesList/examples/TilesList.Media.Example.tsx    |  1 +
 packages/experiments/tslint.json                      |  2 --
 6 files changed, 17 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/experiments-jsx-ban-props_2017-08-24-01-54.json

diff --git a/common/changes/@uifabric/experiments/experiments-jsx-ban-props_2017-08-24-01-54.json b/common/changes/@uifabric/experiments/experiments-jsx-ban-props_2017-08-24-01-54.json
new file mode 100644
index 0000000000000..b62aa25e076ce
--- /dev/null
+++ b/common/changes/@uifabric/experiments/experiments-jsx-ban-props_2017-08-24-01-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Inserted disable jsx-ban-props lines to experiments pkg to pass tslint",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "a.erich@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/TilesList/TilesList.tsx b/packages/experiments/src/components/TilesList/TilesList.tsx
index f796b2ed0a002..7c92d8c57bd0f 100644
--- a/packages/experiments/src/components/TilesList/TilesList.tsx
+++ b/packages/experiments/src/components/TilesList/TilesList.tsx
@@ -142,6 +142,7 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
       <div
         role='presentation'
         className={ css(TilesListStyles.cell) }
+        // tslint:disable-next-line:jsx-ban-props
         style={
           {
             paddingTop: `${(100 * itemHeightOverWidth).toFixed(2)}%`
@@ -226,6 +227,7 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
             className={ css('ms-List-cell', this._onGetCellClassName(), {
               [`ms-TilesList-cell--firstInRow ${TilesListStyles.cellFirstInRow}`]: !!cellAsFirstRow
             }) }
+            // tslint:disable-next-line:jsx-ban-props
             style={
               {
                 ...this._onGetCellStyle(cell, currentRow)
@@ -248,6 +250,7 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
           className={ css('ms-TilesList-grid', {
             [`${TilesListStyles.grid}`]: grid.mode !== TilesGridMode.none
           }) }
+          // tslint:disable-next-line:jsx-ban-props
           style={
             {
               width: `${width}px`,
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx
index 717cf5cf1897a..c789fc9a9c513 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx
@@ -63,6 +63,7 @@ export class TilesListBasicExample extends React.Component<{}, ITilesListBasicEx
 function renderItem(item: IBasicItem): JSX.Element {
   return (
     <div
+      // tslint:disable-next-line:jsx-ban-props
       style={
         {
           position: 'absolute',
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
index cdd8facace176..c21cf2db38c61 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
@@ -53,6 +53,7 @@ export class TilesListDocumentExample extends React.Component<any, any> {
     });
 
     return (
+      // tslint:disable-next-line:jsx-ban-props
       <div style={ { padding: '4px' } }>
         <MarqueeSelection selection={ this._selection }>
           <TilesListType
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
index e061da71cfdd4..a9d6679d8ec27 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
@@ -54,6 +54,7 @@ export class TilesListMediaExample extends React.Component<any, any> {
     });
 
     return (
+      // tslint:disable-next-line:jsx-ban-props
       <div style={ { padding: '4px' } }>
         <MarqueeSelection selection={ this._selection }>
           <TilesListType
diff --git a/packages/experiments/tslint.json b/packages/experiments/tslint.json
index ccd1251bf5139..5d9173ba970da 100644
--- a/packages/experiments/tslint.json
+++ b/packages/experiments/tslint.json
@@ -3,8 +3,6 @@
     "office-ui-fabric-react-tslint"
   ],
   "rules": {
-    "jsx-ban-props": false,
-    "jsx-no-multiline-js": false,
     "no-any": false
   }
 }
\ No newline at end of file

From f7b6bb4aceffd947b2443eb14f3271a05175e670 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Wed, 23 Aug 2017 19:03:54 -0700
Subject: [PATCH 0488/1641] Added missing typedefs in ex-app-base pkg to pass
 tslint (#2602)

* Added missing typedefs in ex-app-base pkg to pass tslint

* Added change file

* Added missing typedefs in ex-app-base pkg to pass tslint

* Added change file

* Removed rules that were added in
---
 .../master_2017-08-24-00-00.json              | 11 ++++++++
 .../src/components/App/App.tsx                |  6 ++---
 .../ComponentPage/ComponentPage.tsx           |  4 +--
 .../components/ExampleCard/ExampleCard.tsx    |  6 ++---
 .../src/components/Header/Header.tsx          | 27 ++++++++++---------
 .../src/components/Highlight/Highlight.tsx    |  6 ++---
 .../PropertiesTable/PropertiesTable.tsx       | 12 ++++-----
 .../PropertiesTable/PropertiesTableSet.tsx    | 10 +++----
 .../example-app-base/src/utilities/beep.ts    |  4 +--
 .../src/utilities/createApp.tsx               | 12 ++++-----
 .../example-app-base/src/utilities/data.ts    |  6 ++---
 .../src/utilities/debugging.ts                |  6 ++---
 .../src/utilities/examplesOf.ts               |  2 +-
 .../src/utilities/parser/BaseParser.ts        |  4 ++-
 .../src/utilities/parser/Parse.ts             |  6 ++---
 packages/example-app-base/tslint.json         |  7 ++---
 16 files changed, 69 insertions(+), 60 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/master_2017-08-24-00-00.json

diff --git a/common/changes/@uifabric/example-app-base/master_2017-08-24-00-00.json b/common/changes/@uifabric/example-app-base/master_2017-08-24-00-00.json
new file mode 100644
index 0000000000000..268f26d793609
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/master_2017-08-24-00-00.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Added missing typedefs in ex-app-base pkg to pass tslint",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "a.erich@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/src/components/App/App.tsx b/packages/example-app-base/src/components/App/App.tsx
index 048b718dc74cb..fbc7b83e87934 100644
--- a/packages/example-app-base/src/components/App/App.tsx
+++ b/packages/example-app-base/src/components/App/App.tsx
@@ -56,7 +56,7 @@ export class App extends React.Component<IAppProps, any> {
     this._onLinkClick = this._onLinkClick.bind(this);
   }
 
-  public render() {
+  public render(): JSX.Element {
     let { appDefinition, responsiveMode } = this.props;
     let { isMenuVisible } = this.state;
 
@@ -114,11 +114,11 @@ export class App extends React.Component<IAppProps, any> {
     );
   }
 
-  private _onIsMenuVisibleChanged(isMenuVisible: boolean) {
+  private _onIsMenuVisibleChanged(isMenuVisible: boolean): void {
     this.setState({ isMenuVisible });
   }
 
-  private _onLinkClick() {
+  private _onLinkClick(): void {
     this.setState({ isMenuVisible: false });
   }
 }
diff --git a/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx b/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
index 9495d446bdcca..a194339021562 100644
--- a/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
+++ b/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
@@ -23,7 +23,7 @@ export interface IComponentPageProps {
 }
 
 export class ComponentPage extends React.Component<IComponentPageProps, {}> {
-  public static defaultProps = {
+  public static defaultProps: Partial<IComponentPageProps> = {
     isHeaderVisible: true
   };
 
@@ -36,7 +36,7 @@ export class ComponentPage extends React.Component<IComponentPageProps, {}> {
     this._baseUrl = doc ? document.location.href : '';
   }
 
-  public render() {
+  public render(): JSX.Element {
     let {
       componentName,
       exampleCards,
diff --git a/packages/example-app-base/src/components/ExampleCard/ExampleCard.tsx b/packages/example-app-base/src/components/ExampleCard/ExampleCard.tsx
index 2cd15dcf3d411..4b9534774e093 100644
--- a/packages/example-app-base/src/components/ExampleCard/ExampleCard.tsx
+++ b/packages/example-app-base/src/components/ExampleCard/ExampleCard.tsx
@@ -30,7 +30,7 @@ export class ExampleCard extends React.Component<IExampleCardProps, IExampleCard
     this._onToggleCodeClick = this._onToggleCodeClick.bind(this);
   }
 
-  public render() {
+  public render(): JSX.Element {
     const { title, code, children, isRightAligned } = this.props;
     const { isCodeVisible } = this.state;
     let rootClass = 'ExampleCard' + (this.state.isCodeVisible ? ' is-codeVisible' : '');
@@ -78,7 +78,7 @@ export class ExampleCard extends React.Component<IExampleCardProps, IExampleCard
     );
   }
 
-  private _getDosAndDonts() {
+  private _getDosAndDonts(): JSX.Element | void {
     if (this.props.dos && this.props.donts) {
       return (
         <div className='ExampleCard-dosAndDonts'>
@@ -95,7 +95,7 @@ export class ExampleCard extends React.Component<IExampleCardProps, IExampleCard
     }
   }
 
-  private _onToggleCodeClick() {
+  private _onToggleCodeClick(): void {
     this.setState({
       isCodeVisible: !this.state.isCodeVisible
     });
diff --git a/packages/example-app-base/src/components/Header/Header.tsx b/packages/example-app-base/src/components/Header/Header.tsx
index 7eadd8c05a740..35ddd2982508d 100644
--- a/packages/example-app-base/src/components/Header/Header.tsx
+++ b/packages/example-app-base/src/components/Header/Header.tsx
@@ -45,7 +45,7 @@ export class Header extends React.Component<IHeaderProps, IHeaderState> {
     };
   }
 
-  public render() {
+  public render(): JSX.Element {
     let { title, sideLinks, responsiveMode } = this.props;
     let { contextMenu } = this.state;
 
@@ -72,13 +72,16 @@ export class Header extends React.Component<IHeaderProps, IHeaderState> {
           </div>
           <div className='Header-buttons'>
             <FocusZone direction={ FocusZoneDirection.horizontal }>
-              { sideLinks.map((link, linkIndex) => (
-                <a key={ linkIndex } className='Header-button' href={ link.url }>{ link.name }</a>
-              )).concat([
-                <button key='headerButton' className='Header-button' onClick={ this._onGearClick }>
-                  <Icon iconName='Settings' />
-                </button>
-              ]) }
+              { sideLinks.map((link: {
+                name: string;
+                url: string;
+              }, linkIndex: number) => (
+                  <a key={ linkIndex } className='Header-button' href={ link.url }>{ link.name }</a>
+                )).concat([
+                  <button key='headerButton' className='Header-button' onClick={ this._onGearClick }>
+                    <Icon iconName='Settings' />
+                  </button>
+                ]) }
             </FocusZone>
           </div>
         </div>
@@ -96,7 +99,7 @@ export class Header extends React.Component<IHeaderProps, IHeaderState> {
     );
   }
 
-  private _onMenuClick(ev: React.MouseEvent<HTMLElement>) {
+  private _onMenuClick(ev: React.MouseEvent<HTMLElement>): void {
     let { onIsMenuVisibleChanged, isMenuVisible } = this.props;
 
     if (onIsMenuVisibleChanged) {
@@ -104,7 +107,7 @@ export class Header extends React.Component<IHeaderProps, IHeaderState> {
     }
   }
 
-  private _onGearClick(ev: React.MouseEvent<HTMLElement>) {
+  private _onGearClick(ev: React.MouseEvent<HTMLElement>): void {
     let { contextMenu } = this.state;
 
     this.setState({
@@ -124,7 +127,7 @@ export class Header extends React.Component<IHeaderProps, IHeaderState> {
     }];
   }
 
-  private _onRTLToggled(ev: React.MouseEvent<HTMLElement>) {
+  private _onRTLToggled(ev: React.MouseEvent<HTMLElement>): void {
     let { isRTLEnabled } = this.state;
 
     setRTL(!isRTLEnabled);
@@ -135,7 +138,7 @@ export class Header extends React.Component<IHeaderProps, IHeaderState> {
     });
   }
 
-  private _onDismiss() {
+  private _onDismiss(): void {
     this.setState({
       contextMenu: undefined
     });
diff --git a/packages/example-app-base/src/components/Highlight/Highlight.tsx b/packages/example-app-base/src/components/Highlight/Highlight.tsx
index ad183cccb2d4e..bec5eb68d3d58 100644
--- a/packages/example-app-base/src/components/Highlight/Highlight.tsx
+++ b/packages/example-app-base/src/components/Highlight/Highlight.tsx
@@ -12,7 +12,7 @@ export interface IHighlightProps extends React.HTMLAttributes<HTMLDivElement> {
 export class Highlight extends BaseComponent<IHighlightProps, {}> {
   private _codeElement: HTMLElement;
 
-  public render() {
+  public render(): JSX.Element {
     return (
       <pre>
         <code
@@ -25,11 +25,11 @@ export class Highlight extends BaseComponent<IHighlightProps, {}> {
     );
   }
 
-  public shouldComponentUpdate() {
+  public shouldComponentUpdate(): boolean {
     return false;
   }
 
-  public componentDidMount() {
+  public componentDidMount(): void {
     highlightBlock(this._codeElement);
   }
 }
diff --git a/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx b/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx
index b1be110cc6dd7..cb33cf27339f2 100644
--- a/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx
+++ b/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx
@@ -80,22 +80,22 @@ const ENUM_COLUMNS: IColumn[] = [
 ];
 
 export class PropertiesTable extends React.Component<IPropertiesTableProps, any> {
-  public static defaultProps = {
+  public static defaultProps: Partial<IPropertiesTableProps> = {
     title: 'Properties'
   };
 
   constructor(props: IPropertiesTableProps) {
     super(props);
 
-    let properties = (props.properties as any[])
-      .sort((a, b) => (
+    let properties = (props.properties as IInterfaceProperty[])
+      .sort((a: IInterfaceProperty, b: IInterfaceProperty) => (
         a.interfacePropertyType < b.interfacePropertyType ? -1 :
           a.interfacePropertyType > b.interfacePropertyType ? 1 :
             a.name < b.name ? -1 :
               a.name > b.name ? 1 :
                 0
       ))
-      .map((prop, index) => assign({}, prop, { key: index }));
+      .map((prop: IInterfaceProperty, index: number) => assign({}, prop, { key: index }));
 
     let groups: IGroup[] | null = null;
 
@@ -110,7 +110,7 @@ export class PropertiesTable extends React.Component<IPropertiesTableProps, any>
     };
   }
 
-  public render() {
+  public render(): JSX.Element | null {
     let { title } = this.props;
     let { properties, isEnum, groups } = this.state;
 
@@ -132,7 +132,7 @@ export class PropertiesTable extends React.Component<IPropertiesTableProps, any>
     );
   }
 
-  private _getGroups(props: IInterfaceProperty[]) {
+  private _getGroups(props: IInterfaceProperty[]): IGroup[] {
     let groups: IGroup[] = [];
     let index = 0;
 
diff --git a/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.tsx b/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.tsx
index 70909bd13f23b..4ded64868cdee 100644
--- a/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.tsx
+++ b/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.tsx
@@ -9,10 +9,6 @@ export interface IPropertiesTableSetState {
 }
 
 export class PropertiesTableSet extends React.Component<IPropertiesTableSetProps, IPropertiesTableSetState> {
-  public static defaultProps = {
-    title: 'Properties'
-  };
-
   constructor(props: IPropertiesTableSetProps) {
     super(props);
     let { componentName, componentPath, sources } = props;
@@ -21,7 +17,7 @@ export class PropertiesTableSet extends React.Component<IPropertiesTableSetProps
 
     if (sources) {
       src = '';
-      sources.forEach(source => src += source);
+      sources.forEach((source: string) => src += source);
     } else if (componentPath && componentName) {
       src = require(componentPath + componentName + '.Props.ts');
     } else {
@@ -41,7 +37,7 @@ export class PropertiesTableSet extends React.Component<IPropertiesTableSetProps
     };
   }
 
-  public renderEach() {
+  public renderEach(): JSX.Element[] {
     return this.state.properties.map((item: IProperty) => (
       <PropertiesTable
         key={ item.propertyName }
@@ -52,7 +48,7 @@ export class PropertiesTableSet extends React.Component<IPropertiesTableSetProps
     ));
   }
 
-  public render() {
+  public render(): JSX.Element {
     return (
       <div>
         { this.renderEach() }
diff --git a/packages/example-app-base/src/utilities/beep.ts b/packages/example-app-base/src/utilities/beep.ts
index fa0eb60b770c3..030ef6515bd24 100644
--- a/packages/example-app-base/src/utilities/beep.ts
+++ b/packages/example-app-base/src/utilities/beep.ts
@@ -5,14 +5,14 @@ const MIN_DURATION_BETWEEN_BEEPS = 100;
 
 let _beepsLeft = 0;
 
-export function beep() {
+export function beep(): void {
   _beepsLeft++;
   if (_beepsLeft === 1) {
     playBeep();
   }
 }
 
-function playBeep() {
+function playBeep(): void {
   if (_beepsLeft) {
     const beepSound = new Audio(BEEP_DATA);
 
diff --git a/packages/example-app-base/src/utilities/createApp.tsx b/packages/example-app-base/src/utilities/createApp.tsx
index efe24b8b308c7..2dc7cf7c45952 100644
--- a/packages/example-app-base/src/utilities/createApp.tsx
+++ b/packages/example-app-base/src/utilities/createApp.tsx
@@ -22,17 +22,17 @@ export function createApp(
   examples: ExampleGroup | ExampleGroup[],
   defaultRouteComponent: () => (JSX.Element | null) = () => null,
   appTitle?: string, headerLinks?: IAppLink[]
-) {
+): void {
   let rootElement: HTMLElement | null;
   let groups: ExampleGroup[] = !Array.isArray(examples) ? [examples] : examples;
 
-  function _onLoad() {
+  function _onLoad(): void {
     rootElement = document.createElement('div');
     document.body.appendChild(rootElement);
 
     setBaseUrl('./dist/');
 
-    let routes: (JSX.Element | JSX.Element[])[] = groups.map((group, groupIndex) => group.examples.map(
+    let routes: (JSX.Element | JSX.Element[])[] = groups.map((group: ExampleGroup, groupIndex: number) => group.examples.map(
       (example: IExample, index: number) => (
         <Route
           key={ example.key }
@@ -71,7 +71,7 @@ export function createApp(
       rootElement);
   }
 
-  function _onUnload() {
+  function _onUnload(): void {
     if (rootElement) {
       ReactDOM.unmountComponentAtNode(rootElement);
       rootElement = null;
@@ -99,10 +99,10 @@ function _getDefinition(groups: ExampleGroup[]): IAppDefinition {
   return {
     appTitle: 'Fabric Examples',
     testPages: [],
-    examplePages: groups.map((group, groupIndex) => (
+    examplePages: groups.map((group: ExampleGroup, groupIndex: number) => (
       {
         name: group.title,
-        links: group.examples.map((example, exampleIndex) => (
+        links: group.examples.map((example: IExample, exampleIndex: number) => (
           {
             component: example.onRender,
             key: example.key,
diff --git a/packages/example-app-base/src/utilities/data.ts b/packages/example-app-base/src/utilities/data.ts
index 7a9e6c07bbd52..b6298a737b206 100644
--- a/packages/example-app-base/src/utilities/data.ts
+++ b/packages/example-app-base/src/utilities/data.ts
@@ -10,7 +10,7 @@ const DATA = {
   'location': ['Seattle', 'New York', 'Chicago', 'Los Angeles', 'Portland']
 };
 
-export function createListItems(count: number, startIndex = 0): any {
+export function createListItems(count: number, startIndex: number = 0): any {
   return Array.apply(null, Array(count)).map((item: any, index: number) => {
     let size = 150 + Math.round(Math.random() * 100);
 
@@ -30,7 +30,7 @@ export function createListItems(count: number, startIndex = 0): any {
 
 export function createGroups(
   groupCount: number, groupDepth: number, startIndex: number,
-  itemsPerGroup: number, level: number = 0, key: string = '') {
+  itemsPerGroup: number, level: number = 0, key: string = ''): any {
   if (key !== '') {
     key = key + '-';
   }
@@ -61,7 +61,7 @@ export function isGroupable(key: string): boolean {
     key === 'location';
 }
 
-function _randWord(array: string[]) {
+function _randWord(array: string[]): string {
   let index = Math.floor(Math.random() * array.length);
   return array[index];
 }
diff --git a/packages/example-app-base/src/utilities/debugging.ts b/packages/example-app-base/src/utilities/debugging.ts
index 4f515dced4852..424eb58242de7 100644
--- a/packages/example-app-base/src/utilities/debugging.ts
+++ b/packages/example-app-base/src/utilities/debugging.ts
@@ -1,9 +1,9 @@
 import { beep } from './beep';
 
-export function instrumentMethod(target: any, methodName: string) {
+export function instrumentMethod(target: any, methodName: string): void {
   const originalMethod = target[methodName];
 
-  target[methodName] = function () {
+  target[methodName] = function (): any {
     beep();
 
     let startTime = performance.now();
@@ -24,7 +24,7 @@ export function instrumentMethod(target: any, methodName: string) {
   };
 }
 
-export function getStackTrace() {
+export function getStackTrace(): string {
   let obj = {
     stack: ''
   };
diff --git a/packages/example-app-base/src/utilities/examplesOf.ts b/packages/example-app-base/src/utilities/examplesOf.ts
index 3f77b625043be..470c006240472 100644
--- a/packages/example-app-base/src/utilities/examplesOf.ts
+++ b/packages/example-app-base/src/utilities/examplesOf.ts
@@ -15,7 +15,7 @@ export class ExampleGroup {
     this._examples = [];
   }
 
-  public get title() {
+  public get title(): string {
     return this._title;
   }
 
diff --git a/packages/example-app-base/src/utilities/parser/BaseParser.ts b/packages/example-app-base/src/utilities/parser/BaseParser.ts
index c8f0d9739397e..3e8a59bf17240 100644
--- a/packages/example-app-base/src/utilities/parser/BaseParser.ts
+++ b/packages/example-app-base/src/utilities/parser/BaseParser.ts
@@ -3,7 +3,9 @@
  * Base for a parser - does not actually do any parsing.
  */
 export class BaseParser {
-  private _currLocation = 0;
+  // Disabled bc of tslint conflict https://github.com/palantir/tslint/issues/711
+  // tslint:disable:no-inferrable-types
+  private _currLocation: number = 0;
   private _str: string;
   private _strLength: number;
 
diff --git a/packages/example-app-base/src/utilities/parser/Parse.ts b/packages/example-app-base/src/utilities/parser/Parse.ts
index e8c25e5693be0..a67cd25061c4d 100644
--- a/packages/example-app-base/src/utilities/parser/Parse.ts
+++ b/packages/example-app-base/src/utilities/parser/Parse.ts
@@ -1,6 +1,6 @@
 /* tslint:disable:no-trailing-whitespace */
 
-import { IProperty, PropertyType } from './interfaces';
+import { IEnumProperty, IInterfaceProperty, IProperty, PropertyType } from './interfaces';
 import { InterfaceParserHelper } from './InterfaceParserHelper';
 import { EnumParserHelper } from './EnumParserHelper';
 
@@ -59,8 +59,8 @@ export function parse(source: string, propsInterfaceOrEnumName?: string): IPrope
   return props;
 }
 
-function _parseEnumOrInterface(regexResult: RegExpExecArray) {
-  let parseInfo;
+function _parseEnumOrInterface(regexResult: RegExpExecArray): IInterfaceProperty[] | IEnumProperty[] {
+  let parseInfo: IInterfaceProperty[] | IEnumProperty[];
   if (regexResult[1] === 'interface') {
     let parser = new InterfaceParserHelper(regexResult[0]);
     parseInfo = parser.parse();
diff --git a/packages/example-app-base/tslint.json b/packages/example-app-base/tslint.json
index 6b48dfbfb1cf5..6a187c7d20621 100644
--- a/packages/example-app-base/tslint.json
+++ b/packages/example-app-base/tslint.json
@@ -5,9 +5,6 @@
   "rules": {
     "jsx-no-multiline-js": false,
     "jsx-no-lambda": false,
-    "no-any": false,
-    "typedef": [
-      false
-    ]
+    "no-any": false
   }
-}
\ No newline at end of file
+}

From 3965f6e8cfede80428b188984b6866192ad26f89 Mon Sep 17 00:00:00 2001
From: Aniket Handa <atneik@users.noreply.github.com>
Date: Wed, 23 Aug 2017 22:08:12 -0700
Subject: [PATCH 0489/1641] Update CODEOWNERS (#2607)

---
 .github/CODEOWNERS | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index 16633634559b1..22846bfd41b74 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -52,7 +52,7 @@
     # packages/office-ui-fabric-react/src/components/FocusTrapZone/*
     # packages/office-ui-fabric-react/src/components/FocusZone/*
     # packages/office-ui-fabric-react/src/components/GroupedList/*
-    packages/office-ui-fabric-react/src/components/HoverCard/*   @atneik @micahgodbolt
+    packages/office-ui-fabric-react/src/components/HoverCard/*   @atneik @Jahnp
     # packages/office-ui-fabric-react/src/components/Icon/*
     # packages/office-ui-fabric-react/src/components/Image/*
     # packages/office-ui-fabric-react/src/components/Label/*

From 2ed339561d61e6ee1aad68f6bd3f7cccea21907d Mon Sep 17 00:00:00 2001
From: Gunjan Datta <gunjandatta@users.noreply.github.com>
Date: Thu, 24 Aug 2017 01:21:49 -0400
Subject: [PATCH 0490/1641] =?UTF-8?q?Bug=20Fix:=20The=20first=20option=20w?=
 =?UTF-8?q?ill=20not=20be=20selected,=20if=20the=20index=20is=20set=20t?=
 =?UTF-8?q?=E2=80=A6=20(#2604)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Bug Fix: The first option will not be selected, if the index is set to 0.

* Update Dropdown.tsx
---
 .../office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 24a533232e2b2..bbb86d9485694 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -444,7 +444,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     let id = this._id;
     let isItemSelected;
     if (this.props.multiSelect) {
-      isItemSelected = item.index && selectedIndexes ? selectedIndexes.indexOf(item.index) > -1 : false;
+      isItemSelected = item.index !== undefined && selectedIndexes ? selectedIndexes.indexOf(item.index) > -1 : false;
     }
     return (
       !this.props.multiSelect ?

From e10f860aa43514c41b661960d2304336f2a4efd2 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 24 Aug 2017 05:38:14 +0000
Subject: [PATCH 0491/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  4 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../exappbase-max-line_2017-08-23-21-53.json  | 11 ----
 .../master_2017-08-24-00-00.json              | 11 ----
 ...iments-jsx-ban-props_2017-08-24-01-54.json | 11 ----
 .../utilities/array-fix_2017-08-23-23-20.json | 11 ----
 ...utilities-typesafety_2017-08-21-20-42.json | 11 ----
 .../checkbox-a11y_2017-08-09-14-11.json       | 11 ----
 .../details-columns_2017-08-22-20-39.json     | 11 ----
 .../master_2017-08-20-21-11.json              | 11 ----
 .../selection-mode_2017-08-23-17-57.json      | 11 ----
 .../office-ui-fabric-react/textfield.json     | 11 ----
 ...utilities-typesafety_2017-08-21-20-42.json | 11 ----
 ...ailsrow-check-margin_2017-08-23-20-11.json | 11 ----
 .../zhiliu-viewportPerf_2017-08-23-19-56.json | 11 ----
 packages/example-app-base/CHANGELOG.json      | 24 +++++++++
 packages/example-app-base/CHANGELOG.md        | 10 +++-
 packages/example-app-base/package.json        |  4 +-
 packages/experiments/CHANGELOG.json           | 22 ++++++++
 packages/experiments/CHANGELOG.md             |  9 +++-
 packages/experiments/package.json             |  6 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 54 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 18 ++++++-
 packages/office-ui-fabric-react/package.json  |  6 +--
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 19 +++++++
 packages/utilities/CHANGELOG.md               | 10 +++-
 packages/utilities/package.json               |  2 +-
 30 files changed, 177 insertions(+), 162 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/exappbase-max-line_2017-08-23-21-53.json
 delete mode 100644 common/changes/@uifabric/example-app-base/master_2017-08-24-00-00.json
 delete mode 100644 common/changes/@uifabric/experiments/experiments-jsx-ban-props_2017-08-24-01-54.json
 delete mode 100644 common/changes/@uifabric/utilities/array-fix_2017-08-23-23-20.json
 delete mode 100644 common/changes/@uifabric/utilities/utilities-typesafety_2017-08-21-20-42.json
 delete mode 100644 common/changes/office-ui-fabric-react/checkbox-a11y_2017-08-09-14-11.json
 delete mode 100644 common/changes/office-ui-fabric-react/details-columns_2017-08-22-20-39.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2017-08-20-21-11.json
 delete mode 100644 common/changes/office-ui-fabric-react/selection-mode_2017-08-23-17-57.json
 delete mode 100644 common/changes/office-ui-fabric-react/textfield.json
 delete mode 100644 common/changes/office-ui-fabric-react/utilities-typesafety_2017-08-21-20-42.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-edwliu-detailsrow-check-margin_2017-08-23-20-11.json
 delete mode 100644 common/changes/office-ui-fabric-react/zhiliu-viewportPerf_2017-08-23-19-56.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 3377d18b9770d..09c24acd937f1 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -67,12 +67,12 @@
     "webpack-split-by-path": "2.0.0"
   },
   "dependencies": {
-    "@uifabric/example-app-base": ">=4.2.1 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.2 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.36.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.37.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index f2a3e1de550fc..83eca21f6f330 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.35.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.37.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 50846c442ad03..bb0d9dbd90dc7 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -35,7 +35,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.35.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.37.0 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 7e45419bfc2d9..cfa576490f138 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.35.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.37.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/example-app-base/exappbase-max-line_2017-08-23-21-53.json b/common/changes/@uifabric/example-app-base/exappbase-max-line_2017-08-23-21-53.json
deleted file mode 100644
index d7e4e9293ab04..0000000000000
--- a/common/changes/@uifabric/example-app-base/exappbase-max-line_2017-08-23-21-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Break up long lines or disable max line length in ex-app-base pkg to pass tslint",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "a.erich@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/master_2017-08-24-00-00.json b/common/changes/@uifabric/example-app-base/master_2017-08-24-00-00.json
deleted file mode 100644
index 268f26d793609..0000000000000
--- a/common/changes/@uifabric/example-app-base/master_2017-08-24-00-00.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Added missing typedefs in ex-app-base pkg to pass tslint",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "a.erich@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/experiments-jsx-ban-props_2017-08-24-01-54.json b/common/changes/@uifabric/experiments/experiments-jsx-ban-props_2017-08-24-01-54.json
deleted file mode 100644
index b62aa25e076ce..0000000000000
--- a/common/changes/@uifabric/experiments/experiments-jsx-ban-props_2017-08-24-01-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Inserted disable jsx-ban-props lines to experiments pkg to pass tslint",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "a.erich@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/array-fix_2017-08-23-23-20.json b/common/changes/@uifabric/utilities/array-fix_2017-08-23-23-20.json
deleted file mode 100644
index d0647d6994209..0000000000000
--- a/common/changes/@uifabric/utilities/array-fix_2017-08-23-23-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "createArray: reverting previous change to make getItem optional, cleaning up so that the return value is correct.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/utilities-typesafety_2017-08-21-20-42.json b/common/changes/@uifabric/utilities/utilities-typesafety_2017-08-21-20-42.json
deleted file mode 100644
index 8ccdeec536db7..0000000000000
--- a/common/changes/@uifabric/utilities/utilities-typesafety_2017-08-21-20-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Array: Add typesafety for createArray and findIndex",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/checkbox-a11y_2017-08-09-14-11.json b/common/changes/office-ui-fabric-react/checkbox-a11y_2017-08-09-14-11.json
deleted file mode 100644
index a3425510dd7b6..0000000000000
--- a/common/changes/office-ui-fabric-react/checkbox-a11y_2017-08-09-14-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Checkbox: support for aria attributes",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "manishda@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/details-columns_2017-08-22-20-39.json b/common/changes/office-ui-fabric-react/details-columns_2017-08-22-20-39.json
deleted file mode 100644
index ac1318f9711f3..0000000000000
--- a/common/changes/office-ui-fabric-react/details-columns_2017-08-22-20-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix aria-labeling for DetailsList column headers",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2017-08-20-21-11.json b/common/changes/office-ui-fabric-react/master_2017-08-20-21-11.json
deleted file mode 100644
index 238793c9d1aa5..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2017-08-20-21-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "BasePicker: added itemLimit property, which will allow preventing adding more items than set limit.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "sohan@graceful.nu"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/selection-mode_2017-08-23-17-57.json b/common/changes/office-ui-fabric-react/selection-mode_2017-08-23-17-57.json
deleted file mode 100644
index c006b987f2acc..0000000000000
--- a/common/changes/office-ui-fabric-react/selection-mode_2017-08-23-17-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Selection: now takes in a selectionMode, which DetailsList and others can read from. This does not break any existing SelectionMode passed into DetailsList currently but allows you to move the setting to the Selection object.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/textfield.json b/common/changes/office-ui-fabric-react/textfield.json
deleted file mode 100644
index c9ed02953edf4..0000000000000
--- a/common/changes/office-ui-fabric-react/textfield.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "TextField: Added selectionStart and selectionEnd getters to ITextField.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/utilities-typesafety_2017-08-21-20-42.json b/common/changes/office-ui-fabric-react/utilities-typesafety_2017-08-21-20-42.json
deleted file mode 100644
index d4aea377503d2..0000000000000
--- a/common/changes/office-ui-fabric-react/utilities-typesafety_2017-08-21-20-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "office-ui-fabric-react",
-      "type": "none"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-edwliu-detailsrow-check-margin_2017-08-23-20-11.json b/common/changes/office-ui-fabric-react/v-edwliu-detailsrow-check-margin_2017-08-23-20-11.json
deleted file mode 100644
index 28ed18e1a4a07..0000000000000
--- a/common/changes/office-ui-fabric-react/v-edwliu-detailsrow-check-margin_2017-08-23-20-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsRow: Removed margin from check buttons.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-edwliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/zhiliu-viewportPerf_2017-08-23-19-56.json b/common/changes/office-ui-fabric-react/zhiliu-viewportPerf_2017-08-23-19-56.json
deleted file mode 100644
index 1f08ce6537ade..0000000000000
--- a/common/changes/office-ui-fabric-react/zhiliu-viewportPerf_2017-08-23-19-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "withViewport: adding the ability to disable measures to improve performance of rendering the DetailsList in fixed mode.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "zhiliu@microsoft.com"
-}
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index bd1700b118177..0f59b6a21134a 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "4.2.2",
+      "tag": "@uifabric/example-app-base_v4.2.2",
+      "date": "Thu, 24 Aug 2017 05:38:14 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "eee654b354aa2ff30830fcc51319da11f3b8d688",
+            "comment": "Break up long lines or disable max line length in ex-app-base pkg to pass tslint"
+          },
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "f7b6bb4aceffd947b2443eb14f3271a05175e670",
+            "comment": "Added missing typedefs in ex-app-base pkg to pass tslint"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.9.1 <5.0.0` to `>=4.10.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.2.1",
       "tag": "@uifabric/example-app-base_v4.2.1",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index f4c2ebcc46e64..64bba05beeef0 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Mon, 21 Aug 2017 10:19:28 GMT and should not be manually modified.
+This log was last generated on Thu, 24 Aug 2017 05:38:14 GMT and should not be manually modified.
+
+## 4.2.2
+Thu, 24 Aug 2017 05:38:14 GMT
+
+### Patches
+
+- Break up long lines or disable max line length in ex-app-base pkg to pass tslint
+- Added missing typedefs in ex-app-base pkg to pass tslint
 
 ## 4.2.1
 Mon, 21 Aug 2017 10:19:28 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 86f6cfb416a2f..fabc2b7324a59 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "4.2.1",
+  "version": "4.2.2",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -48,7 +48,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=0.20.1 <1.0.0",
-    "@uifabric/utilities": ">=4.9.1 <5.0.0",
+    "@uifabric/utilities": ">=4.10.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.4.0 <5.0.0",
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 9a1da4688cfee..57d2eca7bbd85 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "0.1.4",
+      "tag": "@uifabric/experiments_v0.1.4",
+      "date": "Thu, 24 Aug 2017 05:38:14 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "ee6c807985284d7bc6a5a089ca79fe5d8da7f105",
+            "comment": "Inserted disable jsx-ban-props lines to experiments pkg to pass tslint"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `4.36.0` to `4.37.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=4.2.1 <5.0.0` to `>=4.2.2 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.1.3",
       "tag": "@uifabric/experiments_v0.1.3",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index c7dadf90b752b..000002951159c 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Wed, 23 Aug 2017 19:04:55 GMT and should not be manually modified.
+This log was last generated on Thu, 24 Aug 2017 05:38:14 GMT and should not be manually modified.
+
+## 0.1.4
+Thu, 24 Aug 2017 05:38:14 GMT
+
+### Patches
+
+- Inserted disable jsx-ban-props lines to experiments pkg to pass tslint
 
 ## 0.1.3
 Wed, 23 Aug 2017 19:04:55 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 5eafe3eeb7f4e..42ad7329d5623 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "0.1.3",
+  "version": "0.1.4",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -28,7 +28,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=4.2.1 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.2 <5.0.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -64,7 +64,7 @@
     "webpack-notifier": "^1.5.0"
   },
   "dependencies": {
-    "office-ui-fabric-react": "4.36.0"
+    "office-ui-fabric-react": "4.37.0"
   },
   "peerDependencies": {
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 8999da3a9b63e..98f8174b73da9 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,60 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.37.0",
+      "tag": "office-ui-fabric-react_v4.37.0",
+      "date": "Thu, 24 Aug 2017 05:38:14 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Manish Dahamiwal <mdhamiwal@gmail.com>",
+            "commit": "a22b9c12cba3c9df75beeb076a929f2d8a3bc8a6",
+            "comment": "Checkbox: support for aria attributes"
+          },
+          {
+            "author": "Sohan Fernando <ohritz@users.noreply.github.com>",
+            "commit": "cd5b68bacd924f438829c16d9e824cfa5bf9b632",
+            "comment": "BasePicker: added itemLimit property, which will allow preventing adding more items than set limit."
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "f641204ac5537dfaed6787fbece6d512e6e29439",
+            "comment": "Selection: now takes in a selectionMode, which DetailsList and others can read from. This does not break any existing SelectionMode passed into DetailsList currently but allows you to move the setting to the Selection object."
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "f641204ac5537dfaed6787fbece6d512e6e29439",
+            "comment": "TextField: Added selectionStart and selectionEnd getters to ITextField."
+          },
+          {
+            "author": "jijizz <liu_zhi8@hotmail.com>",
+            "commit": "0d1a498dbb1fb2456db97592c553fbe05572930a",
+            "comment": "withViewport: adding the ability to disable measures to improve performance of rendering the DetailsList in fixed mode."
+          }
+        ],
+        "patch": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "5803bbd5fcbf189e55c7826189edaf93a79dc6c5",
+            "comment": "Fix aria-labeling for DetailsList column headers"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "f641204ac5537dfaed6787fbece6d512e6e29439",
+            "comment": "DetailsRow: Removed margin from check buttons."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.9.1 <5.0.0` to `>=4.10.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=4.2.1 <5.0.0` to `>=4.2.2 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.36.0",
       "tag": "office-ui-fabric-react_v4.36.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index dfa2203c5218d..ae0ff703d675f 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,22 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 23 Aug 2017 19:04:55 GMT and should not be manually modified.
+This log was last generated on Thu, 24 Aug 2017 05:38:14 GMT and should not be manually modified.
+
+## 4.37.0
+Thu, 24 Aug 2017 05:38:14 GMT
+
+### Minor changes
+
+- Checkbox: support for aria attributes
+- BasePicker: added itemLimit property, which will allow preventing adding more items than set limit.
+- Selection: now takes in a selectionMode, which DetailsList and others can read from. This does not break any existing SelectionMode passed into DetailsList currently but allows you to move the setting to the Selection object.
+- TextField: Added selectionStart and selectionEnd getters to ITextField.
+- withViewport: adding the ability to disable measures to improve performance of rendering the DetailsList in fixed mode.
+
+### Patches
+
+- Fix aria-labeling for DetailsList column headers
+- DetailsRow: Removed margin from check buttons.
 
 ## 4.36.0
 Wed, 23 Aug 2017 19:04:55 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 0a1b90f84eaf0..6a99310a4c518 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.36.0",
+  "version": "4.37.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -28,7 +28,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=4.2.1 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.2 <5.0.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -70,7 +70,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
-    "@uifabric/utilities": ">=4.9.1 <5.0.0",
+    "@uifabric/utilities": ">=4.10.0 <5.0.0",
     "@uifabric/styling": ">=0.20.1 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 5b7245a3af11a..b4dbd370052fb 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
-    "@uifabric/utilities": ">=4.9.1 <5.0.0",
+    "@uifabric/utilities": ">=4.10.0 <5.0.0",
     "tslib": "^1.6.0",
     "rtl-css-js": "^1.1.1",
     "glamor": "^2.20.24"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index d9500456d8375..da9ef1a9ebfe9 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.10.0",
+      "tag": "@uifabric/utilities_v4.10.0",
+      "date": "Thu, 24 Aug 2017 05:38:14 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "dcd93b4058e9e68632c8b373de733601dab574c5",
+            "comment": "createArray: reverting previous change to make getItem optional, cleaning up so that the return value is correct."
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "00dcae5bd4d9166ad61e76222427df94021bb06e",
+            "comment": "Array: Add typesafety for createArray and findIndex"
+          }
+        ]
+      }
+    },
     {
       "version": "4.9.1",
       "tag": "@uifabric/utilities_v4.9.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 059bbbdc885c2..35854900877f9 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Mon, 21 Aug 2017 10:19:29 GMT and should not be manually modified.
+This log was last generated on Thu, 24 Aug 2017 05:38:14 GMT and should not be manually modified.
+
+## 4.10.0
+Thu, 24 Aug 2017 05:38:14 GMT
+
+### Minor changes
+
+- createArray: reverting previous change to make getItem optional, cleaning up so that the return value is correct.
+- Array: Add typesafety for createArray and findIndex
 
 ## 4.9.1
 Mon, 21 Aug 2017 10:19:29 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 7fab892b08417..e96867b782af3 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.9.1",
+  "version": "4.10.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From dca2b82fd6f32ba7e8e6d1d196a5952ae85fc177 Mon Sep 17 00:00:00 2001
From: petdun2519 <peterdunlop2519@gmail.com>
Date: Wed, 23 Aug 2017 22:54:15 -0700
Subject: [PATCH 0492/1641] darkened the placeholder text for dropdown (#2571)

---
 ...downPlaceholderColorContrast_2017-08-21-22-29.json | 11 +++++++++++
 ...downPlaceholderColorContrast_2017-08-21-22-29.json | 11 +++++++++++
 ...downPlaceholderColorContrast_2017-08-21-22-29.json | 11 +++++++++++
 ...downPlaceholderColorContrast_2017-08-21-22-29.json | 11 +++++++++++
 ...downPlaceholderColorContrast_2017-08-21-22-29.json | 11 +++++++++++
 ...downPlaceholderColorContrast_2017-08-21-22-29.json | 11 +++++++++++
 .../src/components/Dropdown/Dropdown.scss             |  4 ++--
 7 files changed, 68 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
 create mode 100644 common/changes/@uifabric/experiments/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
 create mode 100644 common/changes/@uifabric/fabric-website/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
 create mode 100644 common/changes/@uifabric/styling/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
 create mode 100644 common/changes/@uifabric/utilities/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
 create mode 100644 common/changes/office-ui-fabric-react/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json

diff --git a/common/changes/@uifabric/example-app-base/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json b/common/changes/@uifabric/example-app-base/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
new file mode 100644
index 0000000000000..344f9222761bf
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "peterdunlop2519@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json b/common/changes/@uifabric/experiments/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
new file mode 100644
index 0000000000000..84eaf9ce19caa
--- /dev/null
+++ b/common/changes/@uifabric/experiments/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/experiments",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "peterdunlop2519@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json b/common/changes/@uifabric/fabric-website/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
new file mode 100644
index 0000000000000..e641b8932ad45
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "peterdunlop2519@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json b/common/changes/@uifabric/styling/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
new file mode 100644
index 0000000000000..51e4e878a0f01
--- /dev/null
+++ b/common/changes/@uifabric/styling/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "peterdunlop2519@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json b/common/changes/@uifabric/utilities/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
new file mode 100644
index 0000000000000..6cb6c52a405f3
--- /dev/null
+++ b/common/changes/@uifabric/utilities/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "peterdunlop2519@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json b/common/changes/office-ui-fabric-react/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
new file mode 100644
index 0000000000000..e9786f5dbb4a1
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Darkened the placeholder text for dropdowns to meet MAS color contrast standards",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "peterdunlop2519@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
index 0fb77413564ac..36ec971b58e2d 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
@@ -59,7 +59,7 @@ $DropDown-item-height: 32px;
       }
     }
     .titleIsPlaceHolder {
-      color: $ms-color-neutralTertiary;
+      color: $ms-color-neutralSecondary;
     }
   }
 
@@ -162,7 +162,7 @@ $DropDown-item-height: 32px;
         border-color: $ms-color-error;
     }
   &.titleIsPlaceHolder {
-    color: $ms-color-neutralTertiary;
+    color: $ms-color-neutralSecondary;
   }
 }
 

From c3dcef2f6aaa12705dec55b9fd60476daf6dbb31 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 24 Aug 2017 03:20:21 -0700
Subject: [PATCH 0493/1641] Applying package updates.

---
 apps/fabric-website/package.json                   |  2 +-
 apps/ssr-tests/package.json                        |  2 +-
 apps/test-bundle-button/package.json               |  2 +-
 apps/todo-app/package.json                         |  2 +-
 ...nPlaceholderColorContrast_2017-08-21-22-29.json | 11 -----------
 ...nPlaceholderColorContrast_2017-08-21-22-29.json | 11 -----------
 ...nPlaceholderColorContrast_2017-08-21-22-29.json | 11 -----------
 ...nPlaceholderColorContrast_2017-08-21-22-29.json | 11 -----------
 ...nPlaceholderColorContrast_2017-08-21-22-29.json | 11 -----------
 ...nPlaceholderColorContrast_2017-08-21-22-29.json | 11 -----------
 packages/experiments/CHANGELOG.json                | 12 ++++++++++++
 packages/experiments/CHANGELOG.md                  |  7 ++++++-
 packages/experiments/package.json                  |  4 ++--
 packages/office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md       |  9 ++++++++-
 packages/office-ui-fabric-react/package.json       |  2 +-
 16 files changed, 47 insertions(+), 75 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
 delete mode 100644 common/changes/@uifabric/experiments/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
 delete mode 100644 common/changes/@uifabric/fabric-website/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
 delete mode 100644 common/changes/@uifabric/styling/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
 delete mode 100644 common/changes/@uifabric/utilities/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 09c24acd937f1..e2d43803955b0 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -72,7 +72,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.37.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.37.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 83eca21f6f330..60cbef0c125fb 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.37.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.37.1 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index bb0d9dbd90dc7..89d1b210ca55c 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -35,7 +35,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.37.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.37.1 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index cfa576490f138..746141d03343f 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.37.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.37.1 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/example-app-base/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json b/common/changes/@uifabric/example-app-base/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
deleted file mode 100644
index 344f9222761bf..0000000000000
--- a/common/changes/@uifabric/example-app-base/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "peterdunlop2519@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json b/common/changes/@uifabric/experiments/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
deleted file mode 100644
index 84eaf9ce19caa..0000000000000
--- a/common/changes/@uifabric/experiments/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/experiments",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "peterdunlop2519@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json b/common/changes/@uifabric/fabric-website/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
deleted file mode 100644
index e641b8932ad45..0000000000000
--- a/common/changes/@uifabric/fabric-website/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "peterdunlop2519@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json b/common/changes/@uifabric/styling/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
deleted file mode 100644
index 51e4e878a0f01..0000000000000
--- a/common/changes/@uifabric/styling/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "peterdunlop2519@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json b/common/changes/@uifabric/utilities/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
deleted file mode 100644
index 6cb6c52a405f3..0000000000000
--- a/common/changes/@uifabric/utilities/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "peterdunlop2519@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json b/common/changes/office-ui-fabric-react/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
deleted file mode 100644
index e9786f5dbb4a1..0000000000000
--- a/common/changes/office-ui-fabric-react/users-petdun-fixDropdownPlaceholderColorContrast_2017-08-21-22-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Darkened the placeholder text for dropdowns to meet MAS color contrast standards",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "peterdunlop2519@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 57d2eca7bbd85..1ca49999821e1 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,18 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "0.1.5",
+      "tag": "@uifabric/experiments_v0.1.5",
+      "date": "Thu, 24 Aug 2017 10:20:20 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `4.37.0` to `4.37.1`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.1.4",
       "tag": "@uifabric/experiments_v0.1.4",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 000002951159c..442ec644e9d7b 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Thu, 24 Aug 2017 05:38:14 GMT and should not be manually modified.
+This log was last generated on Thu, 24 Aug 2017 10:20:20 GMT and should not be manually modified.
+
+## 0.1.5
+Thu, 24 Aug 2017 10:20:20 GMT
+
+*Changes not tracked*
 
 ## 0.1.4
 Thu, 24 Aug 2017 05:38:14 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 42ad7329d5623..04d28310b4c79 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -64,7 +64,7 @@
     "webpack-notifier": "^1.5.0"
   },
   "dependencies": {
-    "office-ui-fabric-react": "4.37.0"
+    "office-ui-fabric-react": "4.37.1"
   },
   "peerDependencies": {
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 98f8174b73da9..b9cf349ec2be0 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.37.1",
+      "tag": "office-ui-fabric-react_v4.37.1",
+      "date": "Thu, 24 Aug 2017 10:20:20 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "petdun2519 <peterdunlop2519@gmail.com>",
+            "commit": "dca2b82fd6f32ba7e8e6d1d196a5952ae85fc177",
+            "comment": "Darkened the placeholder text for dropdowns to meet MAS color contrast standards"
+          }
+        ]
+      }
+    },
     {
       "version": "4.37.0",
       "tag": "office-ui-fabric-react_v4.37.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index ae0ff703d675f..51433f814b0a5 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 24 Aug 2017 05:38:14 GMT and should not be manually modified.
+This log was last generated on Thu, 24 Aug 2017 10:20:20 GMT and should not be manually modified.
+
+## 4.37.1
+Thu, 24 Aug 2017 10:20:20 GMT
+
+### Patches
+
+- Darkened the placeholder text for dropdowns to meet MAS color contrast standards
 
 ## 4.37.0
 Thu, 24 Aug 2017 05:38:14 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 6a99310a4c518..edfc26e388cb8 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.37.0",
+  "version": "4.37.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 1d8f10d433cb87cbe876f2ed9b8f1cb605b13a09 Mon Sep 17 00:00:00 2001
From: Christopher Schleiden <cschleiden@live.de>
Date: Thu, 24 Aug 2017 10:17:50 -0700
Subject: [PATCH 0494/1641] Make BaseComponent consistent with React.Component
 typing (#2611)

---
 ...s-cschleid-makeStateOptional_2017-08-24-16-23.json | 11 +++++++++++
 packages/utilities/src/BaseComponent.ts               |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/utilities/users-cschleid-makeStateOptional_2017-08-24-16-23.json

diff --git a/common/changes/@uifabric/utilities/users-cschleid-makeStateOptional_2017-08-24-16-23.json b/common/changes/@uifabric/utilities/users-cschleid-makeStateOptional_2017-08-24-16-23.json
new file mode 100644
index 0000000000000..b0dbcb9bad97b
--- /dev/null
+++ b/common/changes/@uifabric/utilities/users-cschleid-makeStateOptional_2017-08-24-16-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "BaseComponent: Make State type optional to be consistent with React.Component typing",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "cschleid@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/src/BaseComponent.ts b/packages/utilities/src/BaseComponent.ts
index 351a355d27c90..4d2fbc3d3a504 100644
--- a/packages/utilities/src/BaseComponent.ts
+++ b/packages/utilities/src/BaseComponent.ts
@@ -18,7 +18,7 @@ export interface IBaseProps {
  *
  * @public
  */
-export class BaseComponent<P extends IBaseProps, S> extends React.Component<P, S> {
+export class BaseComponent<P extends IBaseProps, S = {}> extends React.Component<P, S> {
   /**
    * External consumers should override BaseComponent.onError to hook into error messages that occur from
    * exceptions thrown from within components.

From a3f43cc66f9977e8a57519a0e9f84e48b7ad1098 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 24 Aug 2017 10:35:27 -0700
Subject: [PATCH 0495/1641] Utilities: Add find function for arrays (#2612)

* Add find to array

* Rush change
---
 ...go-find-to-utilities_2017-08-24-17-19.json | 11 ++++++++
 packages/utilities/src/array.test.ts          | 25 ++++++++++++++++++-
 packages/utilities/src/array.ts               | 17 ++++++++++++-
 3 files changed, 51 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/chrisgo-find-to-utilities_2017-08-24-17-19.json

diff --git a/common/changes/@uifabric/utilities/chrisgo-find-to-utilities_2017-08-24-17-19.json b/common/changes/@uifabric/utilities/chrisgo-find-to-utilities_2017-08-24-17-19.json
new file mode 100644
index 0000000000000..0ff4076e64401
--- /dev/null
+++ b/common/changes/@uifabric/utilities/chrisgo-find-to-utilities_2017-08-24-17-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Array: Add find utility method",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/src/array.test.ts b/packages/utilities/src/array.test.ts
index 1b3e0d7d0ec8b..5fca3a66e1e0b 100644
--- a/packages/utilities/src/array.test.ts
+++ b/packages/utilities/src/array.test.ts
@@ -1,4 +1,4 @@
-import { findIndex, createArray } from './array';
+import { findIndex, find, createArray } from './array';
 let { expect } = chai;
 
 describe('array utils tests', () => {
@@ -25,6 +25,29 @@ describe('array utils tests', () => {
     });
   });
 
+  describe('find tests', () => {
+    it('returns -1 when there is no match in the array', () => {
+      const array = [0, 1, 2];
+      const item = find(array, _ => false);
+
+      expect(item).equals(undefined);
+    });
+
+    it('should return the correct item when the predicate satisfies the condition', () => {
+      const array = [{ id: 0 }, { id: 1 }, { id: 2 }, { id: 3 }];
+      const item = find(array, elem => elem.id === 1);
+
+      expect(item).equals(array[1]);
+    });
+
+    it('should return the first index when repeated elements satisfy the predicate', () => {
+      const array = [8, 9, 10, 11];
+      const item = find(array, elem => elem === 10);
+
+      expect(item).equals(10);
+    });
+  });
+
   describe('createArray tests', () => {
     it('creates an array while invoking the callback', () => {
       let result = createArray(4, (index: number) => String.fromCharCode('a'.charCodeAt(0) + index));
diff --git a/packages/utilities/src/array.ts b/packages/utilities/src/array.ts
index 5ae018269b844..820d6169a923c 100644
--- a/packages/utilities/src/array.ts
+++ b/packages/utilities/src/array.ts
@@ -6,7 +6,7 @@
  * @param array - Array to search.
  * @param cb - Callback which returns true on matches.
  */
-export function findIndex<T>(array: T[], cb: (item: T, index?: number) => boolean): number {
+export function findIndex<T>(array: T[], cb: (item: T, index: number) => boolean): number {
   let index = -1;
 
   for (let i = 0; array && i < array.length; i++) {
@@ -19,6 +19,21 @@ export function findIndex<T>(array: T[], cb: (item: T, index?: number) => boolea
   return index;
 }
 
+/**
+ * Helper to find the first item within an array that satisfies the callback.
+ * @param array - Array to search
+ * @param cb - Callback which returns true on matches
+ */
+export function find<T>(array: T[], cb: (item: T, index: number) => boolean): T | undefined {
+  let index = findIndex(array, cb);
+
+  if (index < 0) {
+    return undefined;
+  }
+
+  return array[index];
+}
+
 /**
  * Creates an array of a given size and helper method to populate.
  *

From fe61630fd3fa722f7f1eb380e1f8d59f377aa14d Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Thu, 24 Aug 2017 13:25:54 -0700
Subject: [PATCH 0496/1641] Breadcrumb: fixed menu icon showing up (#2617)

* Breadcrumb: fixed menu icon showing up

* add changefile
---
 .../breadcrumb-overflow-fix_2017-08-24-19-34.json     | 11 +++++++++++
 .../src/components/Breadcrumb/Breadcrumb.tsx          |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/breadcrumb-overflow-fix_2017-08-24-19-34.json

diff --git a/common/changes/office-ui-fabric-react/breadcrumb-overflow-fix_2017-08-24-19-34.json b/common/changes/office-ui-fabric-react/breadcrumb-overflow-fix_2017-08-24-19-34.json
new file mode 100644
index 0000000000000..023c236dfe87a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/breadcrumb-overflow-fix_2017-08-24-19-34.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Breadcrumb: Fixed extra dropdown icon",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
index 10479e79f3ff1..35cfe4b408519 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
@@ -97,7 +97,7 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
                   iconProps={ { iconName: 'More' } }
                   role='button'
                   aria-haspopup='true'
-                  menuIconProps={ undefined }
+                  onRenderMenuIcon={ () => null }
                   menuProps={ {
                     items: contextualItems,
                     directionalHint: DirectionalHint.bottomLeftEdge

From 8c44eb11c83b26cba83a170b8f757a774ec2109f Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Thu, 24 Aug 2017 15:57:29 -0700
Subject: [PATCH 0497/1641] ComboBox - Fix value update bug (#2618)

* Remove unneeded key which was causing the BaseAutoFill to be rebuilt when it could just be updated, and fix up the setting of the new value

* rush change

* Changing the check to typeof to allow for ''
---
 ...purlin-ComboBoxUpdateFix_2017-08-24-20-12.json | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.tsx          |  1 -
 .../components/pickers/AutoFill/BaseAutoFill.tsx  | 15 +++++++++------
 3 files changed, 20 insertions(+), 7 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxUpdateFix_2017-08-24-20-12.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxUpdateFix_2017-08-24-20-12.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxUpdateFix_2017-08-24-20-12.json
new file mode 100644
index 0000000000000..bd173b84e3dad
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxUpdateFix_2017-08-24-20-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox - Fix so the component doesn't cause it's children to rebuild and fix up the  the updating of the value  accordingly",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index c2c0d74ab2952..6e1eb858335af 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -257,7 +257,6 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
             id={ id + '-input' }
             className={ this._classNames.input }
             type='text'
-            key={ selectedIndex }
             onFocus={ this._select }
             onBlur={ this._onBlur }
             onKeyDown={ this._onInputKeyDown }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
index cb057af0298a3..0043f0e2aed0d 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
@@ -67,15 +67,18 @@ export class BaseAutoFill extends BaseComponent<IBaseAutoFillProps, IBaseAutoFil
   }
 
   public componentWillReceiveProps(nextProps: IBaseAutoFillProps) {
+    let newValue;
+
     if (this.props.updateValueInWillReceiveProps) {
-      let newValue = this.props.updateValueInWillReceiveProps();
+      newValue = this.props.updateValueInWillReceiveProps();
+    }
 
-      if (newValue !== null) {
-        this._value = newValue;
-      }
+    if (this._autoFillEnabled && this._doesTextStartWith(nextProps.suggestedDisplayValue!, newValue ? newValue : this._value)) {
+      newValue = nextProps.suggestedDisplayValue;
     }
-    if (this._autoFillEnabled && this._doesTextStartWith(nextProps.suggestedDisplayValue!, this._value)) {
-      this.setState({ displayValue: nextProps.suggestedDisplayValue });
+
+    if (typeof newValue === 'string') {
+      this.setState({ displayValue: newValue });
     }
   }
 

From 7b608ea0e6dc3d75b07e2998b7b5ace77fb8fb32 Mon Sep 17 00:00:00 2001
From: Aniket Handa <atneik@users.noreply.github.com>
Date: Thu, 24 Aug 2017 18:00:21 -0700
Subject: [PATCH 0498/1641] HoverCard: Dismiss on key/mouse down, Add
 directionalHint, Fix target prop   (#2599)

* Fix card dismiss

* Dismiss card on key or mouse down

* Add ability to specify target using a query string

* Add directionalHint

* Add rush change

* Expose gapSpace too

* Nit

* Tslint nit

* Remove getBoundingClientRect

* Code clean
---
 ...erCard-click-timeout_2017-08-23-22-09.json | 11 ++++
 .../HoverCard/ExpandingCard.Props.ts          | 13 +++++
 .../components/HoverCard/ExpandingCard.tsx    |  7 ++-
 .../components/HoverCard/HoverCard.Props.ts   |  2 +-
 .../src/components/HoverCard/HoverCard.tsx    | 54 +++++++++++--------
 .../components/HoverCard/HoverCardPage.tsx    |  2 +-
 .../examples/HoverCard.Target.Example.tsx     | 13 +++--
 7 files changed, 72 insertions(+), 30 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/anihan-hoverCard-click-timeout_2017-08-23-22-09.json

diff --git a/common/changes/office-ui-fabric-react/anihan-hoverCard-click-timeout_2017-08-23-22-09.json b/common/changes/office-ui-fabric-react/anihan-hoverCard-click-timeout_2017-08-23-22-09.json
new file mode 100644
index 0000000000000..e4fed8969c1ec
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/anihan-hoverCard-click-timeout_2017-08-23-22-09.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "HoverCard: Dismiss on key/mouse down, Add directionalHint, Fix target prop",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "anihan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts
index 90c3e87c86a34..424e83afd29f5 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts
@@ -2,6 +2,7 @@ import * as React from 'react';
 import { ExpandingCard } from './ExpandingCard';
 import { IRenderFunction } from '../../Utilities';
 import { IStyle, ITheme } from '../../Styling';
+import { DirectionalHint } from '../../common/DirectionalHint';
 
 export interface IExpandingCard {
 
@@ -70,6 +71,18 @@ export interface IExpandingCardProps extends React.HTMLAttributes<HTMLDivElement
    */
   theme?: ITheme;
 
+  /**
+   * How the element should be positioned
+   * @default DirectionalHint.bottomLeftEdge
+   */
+  directionalHint?: DirectionalHint;
+
+  /**
+   * The gap between the card and the target
+   * @default 0
+   */
+  gapSpace?: number;
+
   /**
    * Custom styles for this component
    */
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
index de799b05dd150..f1e85af341e14 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
@@ -26,7 +26,9 @@ export interface IExpandingCardState {
 export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpandingCardState> {
   public static defaultProps = {
     compactCardHeight: 156,
-    expandedCardHeight: 384
+    expandedCardHeight: 384,
+    directionalHint: DirectionalHint.bottomLeftEdge,
+    gapSpace: 0
   };
 
   private _styles: IExpandingCardStyles;
@@ -77,10 +79,11 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
         ) }
         targetElement={ targetElement }
         isBeakVisible={ false }
-        directionalHint={ getRTL() ? DirectionalHint.bottomRightEdge : DirectionalHint.bottomLeftEdge }
+        directionalHint={ this.props.directionalHint }
         directionalHintFixed={ true }
         finalHeight={ compactCardHeight! + expandedCardHeight! }
         minPagePadding={ 24 }
+        gapSpace={ this.props.gapSpace }
       >
         <div
           onFocusCapture={ this.props.onEnter }
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts
index c86817de6de7e..775835cb3e235 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts
@@ -66,7 +66,7 @@ export interface IHoverCardProps extends React.HTMLAttributes<HTMLDivElement | H
   /**
    * Optional target element to tag hover card on
    */
-  target?: HTMLElement;
+  target?: HTMLElement | string;
 }
 
 export interface IHoverCardStyles {
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
index 0732bcb36ec11..cb54f36a0c997 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
@@ -7,7 +7,8 @@ import {
   css,
   divProperties,
   getNativeProps,
-  getId
+  getId,
+  getDocument
 } from '../../Utilities';
 import { IHoverCardProps, IHoverCardStyles } from './HoverCard.Props';
 import { ExpandingCard } from './ExpandingCard';
@@ -30,8 +31,10 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
 
   // The wrapping div that gets the hover events
   private _hoverCard: HTMLElement;
+  private _expandingCard: ExpandingCard;
   private _dismissTimerId: number;
   private _openTimerId: number;
+  private _currentMouseTarget: EventTarget;
 
   private _styles: IHoverCardStyles;
 
@@ -52,7 +55,12 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
     this._events.on(target, 'mouseleave', this._cardDismiss);
     this._events.on(target, 'focus', this._cardOpen);
     this._events.on(target, 'blur', this._cardDismiss);
-    this.props.instantOpenOnClick && this._events.on(target, 'click', this._instantOpenExpanded);
+    if (this.props.instantOpenOnClick) {
+      this._events.on(target, 'click', this._instantOpenExpanded);
+    } else {
+      this._events.on(target, 'mousedown', this._cardDismiss);
+      this._events.on(target, 'keydown', this._cardDismiss);
+    }
   }
 
   public componentWillUpdate(newProps: IHoverCardProps, newState: IHoverCardState) {
@@ -86,10 +94,6 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
 
     this._styles = getStyles(customStyles);
 
-    let onClick;
-    if (instantOpenOnClick) {
-      onClick = this._instantOpenExpanded;
-    }
     return (
       <div
         className={ css(this._styles.host) }
@@ -99,6 +103,7 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
         { children }
         { isHoverCardVisible &&
           <ExpandingCard
+            componentRef={ this._resolveRef('_expandingCard') }
             { ...getNativeProps(this.props, divProperties) }
             id={ hoverCardId }
             targetElement={ this._getTargetElement() }
@@ -113,13 +118,25 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
   }
 
   private _getTargetElement(): HTMLElement {
-    return this.props.target ? this.props.target : this._hoverCard;
+    const { target } = this.props;
+
+    switch (typeof target) {
+      case 'string':
+        return getDocument()!.querySelector(target as string) as HTMLElement;
+
+      case 'object':
+        return target as HTMLElement;
+
+      default:
+        return this._hoverCard;
+    }
   }
 
   // Show HoverCard
   @autobind
   private _cardOpen(ev: MouseEvent) {
     this._async.clearTimeout(this._dismissTimerId);
+    this._currentMouseTarget = ev.currentTarget;
 
     this._openTimerId = this._async.setTimeout(() => {
       if (!this.state.isHoverCardVisible) {
@@ -134,22 +151,17 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
   // Hide HoverCard
   @autobind
   private _cardDismiss(ev: MouseEvent) {
-    const { type, x, y } = ev;
     this._async.clearTimeout(this._openTimerId);
 
-    this._dismissTimerId = this._async.setTimeout(() => {
-      if (!(this.props.sticky && type === 'mouseleave')) {
-        const rect = this._hoverCard.getBoundingClientRect();
-        // handle the case when dismiss is called by target when cursor moves towards the card.
-        const isInsideCard: boolean = x <= rect.right && x >= rect.left && y >= rect.top;
-        if (!isInsideCard) {
-          this.setState({
-            isHoverCardVisible: false,
-            mode: ExpandingCardMode.compact
-          });
-        }
-      }
-    }, this.props.cardDismissDelay!);
+    // Dismiss if not sticky and currentTarget is the same element that mouse last entered
+    if (!this.props.sticky && this._currentMouseTarget === ev.currentTarget) {
+      this._dismissTimerId = this._async.setTimeout(() => {
+        this.setState({
+          isHoverCardVisible: false,
+          mode: ExpandingCardMode.compact
+        });
+      }, this.props.cardDismissDelay!);
+    }
   }
 
   // Instant Open the card in Expanded mode
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx
index 9fabde92e4229..d7f15e6bd6542 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx
@@ -25,7 +25,7 @@ export class HoverCardPage extends React.Component<any, any> {
             <ExampleCard title='HoverCard' code={ HoverCardBasicExampleCode }>
               <HoverCardBasicExample />
             </ExampleCard>
-            <ExampleCard title='HoverCard using Target' code={ HoverCardTargetExampleCode }>
+            <ExampleCard title='HoverCard using Target and at right center' code={ HoverCardTargetExampleCode }>
               <HoverCardTargetExample />
             </ExampleCard>
           </LayerHost>
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
index 178e09f519fe0..273750fe37f31 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
@@ -8,6 +8,7 @@ import {
   IExpandingCardProps
 } from 'office-ui-fabric-react/lib/HoverCard';
 import { DetailsList, buildColumns, IColumn } from 'office-ui-fabric-react/lib/DetailsList';
+import { DirectionalHint } from 'office-ui-fabric-react/lib/common/DirectionalHint';
 import { autobind, css } from 'office-ui-fabric-react/lib/Utilities';
 import { createListItems } from '@uifabric/example-app-base';
 import './HoverCard.Example.scss';
@@ -46,8 +47,8 @@ class HoverCardField extends BaseComponent<IHoverCardFieldProps, IHoverCardField
           this.state.contentRendered &&
           <HoverCard
             expandingCardProps={ this.props.expandingCardProps }
-            instantOpenOnClick={ true }
             target={ this.state.contentRendered }
+            cardDismissDelay={ 300 }
           />
         }
       </div>
@@ -73,7 +74,7 @@ export class HoverCardTargetExample extends BaseComponent<{}, IHoverCardExampleS
 
     return (
       <div>
-        <p> Hover over location of a row item to see the card </p>
+        <p> Hover over key of a row item to see the card </p>
         <DetailsList
           setKey='hoverSet'
           items={ items! }
@@ -89,14 +90,16 @@ export class HoverCardTargetExample extends BaseComponent<{}, IHoverCardExampleS
     const expandingCardProps: IExpandingCardProps = {
       onRenderCompactCard: this._onRenderCompactCard,
       onRenderExpandedCard: this._onRenderExpandedCard,
-      renderData: item
+      renderData: item,
+      directionalHint: DirectionalHint.rightCenter,
+      gapSpace: 16
     };
 
-    if (column.key === 'location') {
+    if (column.key === 'key') {
       return (
         <div className='HoverCard-item'>
           <HoverCardField
-            content={ item.location }
+            content={ item.key }
             expandingCardProps={ expandingCardProps }
           />
         </div>

From 6a5bf14ba020f1aa4c4c5887c9d63ed08cec6c6e Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 25 Aug 2017 10:09:40 +0000
Subject: [PATCH 0499/1641] Applying package updates.

---
 ...go-find-to-utilities_2017-08-24-17-19.json | 11 -------
 ...id-makeStateOptional_2017-08-24-16-23.json | 11 -------
 ...erCard-click-timeout_2017-08-23-22-09.json | 11 -------
 ...adcrumb-overflow-fix_2017-08-24-19-34.json | 11 -------
 ...in-ComboBoxUpdateFix_2017-08-24-20-12.json | 11 -------
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 29 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 11 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 19 ++++++++++++
 packages/utilities/CHANGELOG.md               | 10 ++++++-
 packages/utilities/package.json               |  2 +-
 14 files changed, 73 insertions(+), 63 deletions(-)
 delete mode 100644 common/changes/@uifabric/utilities/chrisgo-find-to-utilities_2017-08-24-17-19.json
 delete mode 100644 common/changes/@uifabric/utilities/users-cschleid-makeStateOptional_2017-08-24-16-23.json
 delete mode 100644 common/changes/office-ui-fabric-react/anihan-hoverCard-click-timeout_2017-08-23-22-09.json
 delete mode 100644 common/changes/office-ui-fabric-react/breadcrumb-overflow-fix_2017-08-24-19-34.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxUpdateFix_2017-08-24-20-12.json

diff --git a/common/changes/@uifabric/utilities/chrisgo-find-to-utilities_2017-08-24-17-19.json b/common/changes/@uifabric/utilities/chrisgo-find-to-utilities_2017-08-24-17-19.json
deleted file mode 100644
index 0ff4076e64401..0000000000000
--- a/common/changes/@uifabric/utilities/chrisgo-find-to-utilities_2017-08-24-17-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Array: Add find utility method",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/users-cschleid-makeStateOptional_2017-08-24-16-23.json b/common/changes/@uifabric/utilities/users-cschleid-makeStateOptional_2017-08-24-16-23.json
deleted file mode 100644
index b0dbcb9bad97b..0000000000000
--- a/common/changes/@uifabric/utilities/users-cschleid-makeStateOptional_2017-08-24-16-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "BaseComponent: Make State type optional to be consistent with React.Component typing",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "cschleid@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/anihan-hoverCard-click-timeout_2017-08-23-22-09.json b/common/changes/office-ui-fabric-react/anihan-hoverCard-click-timeout_2017-08-23-22-09.json
deleted file mode 100644
index e4fed8969c1ec..0000000000000
--- a/common/changes/office-ui-fabric-react/anihan-hoverCard-click-timeout_2017-08-23-22-09.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "HoverCard: Dismiss on key/mouse down, Add directionalHint, Fix target prop",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "anihan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/breadcrumb-overflow-fix_2017-08-24-19-34.json b/common/changes/office-ui-fabric-react/breadcrumb-overflow-fix_2017-08-24-19-34.json
deleted file mode 100644
index 023c236dfe87a..0000000000000
--- a/common/changes/office-ui-fabric-react/breadcrumb-overflow-fix_2017-08-24-19-34.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Breadcrumb: Fixed extra dropdown icon",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxUpdateFix_2017-08-24-20-12.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxUpdateFix_2017-08-24-20-12.json
deleted file mode 100644
index bd173b84e3dad..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxUpdateFix_2017-08-24-20-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox - Fix so the component doesn't cause it's children to rebuild and fix up the  the updating of the value  accordingly",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index fabc2b7324a59..d19bcad4eb3a5 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -48,7 +48,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=0.20.1 <1.0.0",
-    "@uifabric/utilities": ">=4.10.0 <5.0.0",
+    "@uifabric/utilities": ">=4.10.1 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.4.0 <5.0.0",
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 04d28310b4c79..a21d0730d9346 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -64,7 +64,7 @@
     "webpack-notifier": "^1.5.0"
   },
   "dependencies": {
-    "office-ui-fabric-react": "4.37.1"
+    "office-ui-fabric-react": "4.37.2"
   },
   "peerDependencies": {
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index b9cf349ec2be0..7b1a029acfc40 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,35 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.37.2",
+      "tag": "office-ui-fabric-react_v4.37.2",
+      "date": "Fri, 25 Aug 2017 10:09:40 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Aniket Handa <atneik@users.noreply.github.com>",
+            "commit": "7b608ea0e6dc3d75b07e2998b7b5ace77fb8fb32",
+            "comment": "HoverCard: Dismiss on key/mouse down, Add directionalHint, Fix target prop"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "fe61630fd3fa722f7f1eb380e1f8d59f377aa14d",
+            "comment": "Breadcrumb: Fixed extra dropdown icon"
+          },
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "8c44eb11c83b26cba83a170b8f757a774ec2109f",
+            "comment": "ComboBox - Fix so the component doesn't cause it's children to rebuild and fix up the  the updating of the value  accordingly"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.10.0 <5.0.0` to `>=4.10.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.37.1",
       "tag": "office-ui-fabric-react_v4.37.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 51433f814b0a5..8d9f71b9b18fa 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,15 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 24 Aug 2017 10:20:20 GMT and should not be manually modified.
+This log was last generated on Fri, 25 Aug 2017 10:09:40 GMT and should not be manually modified.
+
+## 4.37.2
+Fri, 25 Aug 2017 10:09:40 GMT
+
+### Patches
+
+- HoverCard: Dismiss on key/mouse down, Add directionalHint, Fix target prop
+- Breadcrumb: Fixed extra dropdown icon
+- ComboBox - Fix so the component doesn't cause it's children to rebuild and fix up the  the updating of the value  accordingly
 
 ## 4.37.1
 Thu, 24 Aug 2017 10:20:20 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index edfc26e388cb8..125aefe9a9385 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.37.1",
+  "version": "4.37.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -70,7 +70,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
-    "@uifabric/utilities": ">=4.10.0 <5.0.0",
+    "@uifabric/utilities": ">=4.10.1 <5.0.0",
     "@uifabric/styling": ">=0.20.1 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
diff --git a/packages/styling/package.json b/packages/styling/package.json
index b4dbd370052fb..5c8c6caa40a68 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
-    "@uifabric/utilities": ">=4.10.0 <5.0.0",
+    "@uifabric/utilities": ">=4.10.1 <5.0.0",
     "tslib": "^1.6.0",
     "rtl-css-js": "^1.1.1",
     "glamor": "^2.20.24"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index da9ef1a9ebfe9..f8f3971a126e8 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.10.1",
+      "tag": "@uifabric/utilities_v4.10.1",
+      "date": "Fri, 25 Aug 2017 10:09:40 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "a3f43cc66f9977e8a57519a0e9f84e48b7ad1098",
+            "comment": "Array: Add find utility method"
+          },
+          {
+            "author": "Christopher Schleiden <cschleiden@live.de>",
+            "commit": "1d8f10d433cb87cbe876f2ed9b8f1cb605b13a09",
+            "comment": "BaseComponent: Make State type optional to be consistent with React.Component typing"
+          }
+        ]
+      }
+    },
     {
       "version": "4.10.0",
       "tag": "@uifabric/utilities_v4.10.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 35854900877f9..efd51177f7701 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Thu, 24 Aug 2017 05:38:14 GMT and should not be manually modified.
+This log was last generated on Fri, 25 Aug 2017 10:09:40 GMT and should not be manually modified.
+
+## 4.10.1
+Fri, 25 Aug 2017 10:09:40 GMT
+
+### Patches
+
+- Array: Add find utility method
+- BaseComponent: Make State type optional to be consistent with React.Component typing
 
 ## 4.10.0
 Thu, 24 Aug 2017 05:38:14 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index e96867b782af3..038f0f7fe2ad2 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.10.0",
+  "version": "4.10.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 1fb22fcd2134049ec2d6a73cdf58b1452461145d Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Fri, 25 Aug 2017 08:33:40 -0700
Subject: [PATCH 0500/1641] Re-enable tslint rule no-any and fix uses of any in
 experiments package (#2621)

* Re-enable tslint rule no-any and fix uses of any

* Removed unused import IButtonProps

* Update tslint.json
---
 .../experiments/src/components/CommandBar/CommandBar.tsx    | 5 ++++-
 .../src/components/CommandBar/CommandBarPage.tsx            | 3 ++-
 .../src/components/CommandBar/CommandBarPage.visualtest.tsx | 3 ++-
 .../CommandBar/examples/CommandBar.Basic.Example.tsx        | 5 +++--
 packages/experiments/src/components/Tile/Tile.tsx           | 3 +++
 .../src/components/Tile/examples/Tile.Document.Example.tsx  | 3 ++-
 .../src/components/Tile/examples/Tile.Media.Example.tsx     | 3 ++-
 packages/experiments/src/components/TilesList/TilesList.tsx | 2 ++
 .../TilesList/examples/TilesList.Document.Example.tsx       | 2 +-
 .../TilesList/examples/TilesList.Media.Example.tsx          | 2 +-
 packages/experiments/src/components/signals/Signals.tsx     | 1 +
 packages/experiments/src/demo/AppDefinition.tsx             | 1 +
 packages/experiments/src/demo/GettingStartedPage.tsx        | 2 +-
 packages/experiments/tslint.json                            | 6 ++----
 14 files changed, 27 insertions(+), 14 deletions(-)

diff --git a/packages/experiments/src/components/CommandBar/CommandBar.tsx b/packages/experiments/src/components/CommandBar/CommandBar.tsx
index ed8815f3f1205..0b2692833d361 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBar.tsx
@@ -11,6 +11,8 @@ import { OverflowSet, IOverflowSet } from 'office-ui-fabric-react/lib/OverflowSe
 import { ResizeGroup } from 'office-ui-fabric-react/lib/ResizeGroup';
 import { TooltipHost } from 'office-ui-fabric-react/lib/Tooltip';
 import * as stylesImport from './CommandBar.scss';
+
+// tslint:disable-next-line:no-any
 const styles: any = stylesImport;
 
 export interface ICommandBarData {
@@ -38,7 +40,7 @@ export interface ICommandBarData {
 
 const COMMANDBAR_HEIGHT = '40px';
 
-export class CommandBar extends BaseComponent<ICommandBarProps, any> implements ICommandBar {
+export class CommandBar extends BaseComponent<ICommandBarProps, {}> implements ICommandBar {
   public static defaultProps: ICommandBarProps = {
     items: [],
     overflowItems: [],
@@ -204,6 +206,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, any> implements
 
   @autobind
   private _onRenderButton(props: ICommandBarItemProps): JSX.Element {
+    // tslint:disable-next-line:no-any
     return <CommandBarButton {...props as any} />;
   }
 }
diff --git a/packages/experiments/src/components/CommandBar/CommandBarPage.tsx b/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
index 215ae0e8fba21..12f019565b0d2 100644
--- a/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
@@ -6,6 +6,7 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { items, overflowItems, farItems } from './examples/data';
+import { ICommandBarProps } from './CommandBar.Props';
 import { CommandBarBasicExample } from './examples/CommandBar.Basic.Example';
 
 // tslint:disable-next-line:max-line-length
@@ -13,7 +14,7 @@ const CommandBarBasicExampleCode = require('!raw-loader!office-ui-fabric-react/s
 
 export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}> {
   public render(): JSX.Element {
-    let cmdBarParamsTextAndIcons: any = { items, overflowItems, farItems };
+    let cmdBarParamsTextAndIcons: ICommandBarProps = { items, overflowItems, farItems };
 
     return (
       <ComponentPage
diff --git a/packages/experiments/src/components/CommandBar/CommandBarPage.visualtest.tsx b/packages/experiments/src/components/CommandBar/CommandBarPage.visualtest.tsx
index 3c22234dda985..58a363630b79b 100644
--- a/packages/experiments/src/components/CommandBar/CommandBarPage.visualtest.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBarPage.visualtest.tsx
@@ -3,7 +3,8 @@ import { CommandBar } from './index';
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
-export default class CommandBarVPage extends React.Component<any, any> {
+
+export default class CommandBarVPage extends React.Component<{}, {}> {
   public render(): JSX.Element {
     return (
       <div style={ { width: '600px' } }>
diff --git a/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx b/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
index 8abe58bb10b4e..24a62c74b24a8 100644
--- a/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
+++ b/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
@@ -1,8 +1,9 @@
 import * as React from 'react';
 import { CommandBar } from '../CommandBar';
-export class CommandBarBasicExample extends React.Component<any, any> {
+import { ICommandBarProps } from './../CommandBar.Props';
+export class CommandBarBasicExample extends React.Component<ICommandBarProps, {}> {
 
-  constructor(props: any) {
+  constructor(props: ICommandBarProps) {
     super(props);
     this.state = {
       areNamesVisible: true,
diff --git a/packages/experiments/src/components/Tile/Tile.tsx b/packages/experiments/src/components/Tile/Tile.tsx
index de202d0b7ca72..9cb89d9426647 100644
--- a/packages/experiments/src/components/Tile/Tile.tsx
+++ b/packages/experiments/src/components/Tile/Tile.tsx
@@ -7,8 +7,10 @@ import { css, BaseComponent, autobind, getId } from 'office-ui-fabric-react/lib/
 import * as TileStylesModule from './Tile.scss';
 import * as SignalStylesModule from '../signals/Signals.scss';
 
+// tslint:disable:no-any
 const TileStyles: any = TileStylesModule;
 const SignalStyles: any = SignalStylesModule;
+// tslint:enable:no-any
 
 export interface ITileState {
   isSelected?: boolean;
@@ -25,6 +27,7 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
   private _nameId: string;
   private _activityId: string;
 
+  // tslint:disable-next-line:no-any
   constructor(props: ITileProps, context: any) {
     super(props, context);
 
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
index 1e0274f8756fe..d801d8bcd223d 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
@@ -12,9 +12,10 @@ import {
 import { lorem } from '@uifabric/example-app-base';
 import * as TileExampleStylesModule from './Tile.Example.scss';
 
+// tslint:disable-next-line:no-any
 const TileExampleStyles = TileExampleStylesModule as any;
 
-export class TileDocumentExample extends React.Component<any, any> {
+export class TileDocumentExample extends React.Component<{}, {}> {
   public render(): JSX.Element {
     return (
       <div>
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
index 24e95115904b5..aea7fc60173fb 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
@@ -14,9 +14,10 @@ import {
 import { lorem } from '@uifabric/example-app-base';
 import * as TileExampleStylesModule from './Tile.Example.scss';
 
+// tslint:disable-next-line:no-any
 const TileExampleStyles = TileExampleStylesModule as any;
 
-export class TileMediaExample extends React.Component<any, any> {
+export class TileMediaExample extends React.Component<{}, {}> {
   public render(): JSX.Element {
     return (
       <div>
diff --git a/packages/experiments/src/components/TilesList/TilesList.tsx b/packages/experiments/src/components/TilesList/TilesList.tsx
index 7c92d8c57bd0f..90dcde7a2a73e 100644
--- a/packages/experiments/src/components/TilesList/TilesList.tsx
+++ b/packages/experiments/src/components/TilesList/TilesList.tsx
@@ -7,6 +7,7 @@ import { SelectionZone, SelectionMode } from 'office-ui-fabric-react/lib/utiliti
 import { autobind, css, IRenderFunction, IRectangle } from 'office-ui-fabric-react/lib/Utilities';
 import * as TilesListStylesModule from './TilesList.scss';
 
+// tslint:disable-next-line:no-any
 const TilesListStyles: any = TilesListStylesModule;
 
 const MAX_TILE_STRETCH = 1.5;
@@ -67,6 +68,7 @@ interface IPageSpecificationCache<TItem> {
 export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, ITilesListState<TItem>> {
   private _pageSpecificationCache: IPageSpecificationCache<TItem> | undefined;
 
+  // tslint:disable-next-line:no-any
   constructor(props: ITilesListProps<TItem>, context: any) {
     super(props, context);
 
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
index c21cf2db38c61..3570b1a3e3fe4 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
@@ -34,7 +34,7 @@ declare class TilesListClass extends TilesList<IExampleItem> { }
 
 const TilesListType: typeof TilesListClass = TilesList;
 
-export class TilesListDocumentExample extends React.Component<any, any> {
+export class TilesListDocumentExample extends React.Component<{}, {}> {
   private _selection: Selection;
 
   constructor() {
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
index a9d6679d8ec27..912d6f403dd19 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
@@ -35,7 +35,7 @@ declare class TilesListClass extends TilesList<IExampleItem> { }
 
 const TilesListType: typeof TilesListClass = TilesList;
 
-export class TilesListMediaExample extends React.Component<any, any> {
+export class TilesListMediaExample extends React.Component<{}, {}> {
   private _selection: Selection;
 
   constructor() {
diff --git a/packages/experiments/src/components/signals/Signals.tsx b/packages/experiments/src/components/signals/Signals.tsx
index 841f57e3fe49c..b42a7e8e62cfb 100644
--- a/packages/experiments/src/components/signals/Signals.tsx
+++ b/packages/experiments/src/components/signals/Signals.tsx
@@ -4,6 +4,7 @@ import { Icon } from 'office-ui-fabric-react/lib/Icon';
 import { css } from 'office-ui-fabric-react/lib/Utilities';
 import * as SignalStylesModule from './Signals.scss';
 
+// tslint:disable-next-line:no-any
 const SignalStyles = SignalStylesModule as any;
 
 export interface ISignalFieldProps extends React.HTMLAttributes<HTMLSpanElement> {
diff --git a/packages/experiments/src/demo/AppDefinition.tsx b/packages/experiments/src/demo/AppDefinition.tsx
index 80ce68875926d..d6ff64e33d051 100644
--- a/packages/experiments/src/demo/AppDefinition.tsx
+++ b/packages/experiments/src/demo/AppDefinition.tsx
@@ -1,3 +1,4 @@
+// tslint:disable:no-any
 import * as React from 'react';
 import { App as AppBase, IAppDefinition, IAppProps } from '@uifabric/example-app-base';
 
diff --git a/packages/experiments/src/demo/GettingStartedPage.tsx b/packages/experiments/src/demo/GettingStartedPage.tsx
index 1df2a9cdb6c72..f332b6cd65140 100644
--- a/packages/experiments/src/demo/GettingStartedPage.tsx
+++ b/packages/experiments/src/demo/GettingStartedPage.tsx
@@ -5,7 +5,7 @@ import { Link } from 'office-ui-fabric-react/lib/Link';
 import './GettingStartedPage.scss';
 import { Highlight } from '@uifabric/example-app-base';
 
-export class GettingStartedPage extends React.Component<any, any> {
+export class GettingStartedPage extends React.Component<{}, {}> {
 
   public render(): JSX.Element {
     return (
diff --git a/packages/experiments/tslint.json b/packages/experiments/tslint.json
index 5d9173ba970da..8d79cc0019df1 100644
--- a/packages/experiments/tslint.json
+++ b/packages/experiments/tslint.json
@@ -2,7 +2,5 @@
   "extends": [
     "office-ui-fabric-react-tslint"
   ],
-  "rules": {
-    "no-any": false
-  }
-}
\ No newline at end of file
+  "rules": {}
+}

From 74203c8aec4976f12a30eb4abab4738ed4487b67 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Fri, 25 Aug 2017 10:53:06 -0700
Subject: [PATCH 0501/1641] ComboBox: Fix so options update correctly (#2301)
 (#2623)

* Fix the comboBox so that it will update the options any time new options are passed in

* rush change
---
 ...electedKeyOrValueFix_--2301-_2017-08-25-01-20.json | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.tsx              |  7 +++----
 2 files changed, 14 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxOptionsUpdateWithoutSelectedKeyOrValueFix_--2301-_2017-08-25-01-20.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxOptionsUpdateWithoutSelectedKeyOrValueFix_--2301-_2017-08-25-01-20.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxOptionsUpdateWithoutSelectedKeyOrValueFix_--2301-_2017-08-25-01-20.json
new file mode 100644
index 0000000000000..2538260d2cecc
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxOptionsUpdateWithoutSelectedKeyOrValueFix_--2301-_2017-08-25-01-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox- Make sure the option always get updated if they change (#2301)",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 6e1eb858335af..e14e012a1e2a7 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -145,10 +145,9 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   }
 
   public componentWillReceiveProps(newProps: IComboBoxProps) {
-    // In controlled component usage where selectedKey or value is provided,
-    // update the selectedIndex and currentOptions state if the selectedKey or options have changed
-    if ((newProps.selectedKey || newProps.value) &&
-      (newProps.selectedKey !== this.props.selectedKey || newProps.options !== this.props.options)) {
+    // Update the selectedIndex and currentOptions state if the selectedKey or options have changed
+    if (((newProps.selectedKey || newProps.value) && newProps.selectedKey !== this.props.selectedKey) ||
+      newProps.options !== this.props.options) {
       let index: number = this._getSelectedIndex(newProps.options, newProps.selectedKey);
       this.setState({
         selectedIndex: index,

From 66b1a18537f33d92434acc717842762bdad47eef Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Fri, 25 Aug 2017 12:15:41 -0700
Subject: [PATCH 0502/1641] Pickers inputprops bugfix (#2634)

* correctly extend React.inputhtmlattributes

* Change file
---
 .../pickers-inputprops-bugfix_2017-08-25-19-07.json   | 11 +++++++++++
 .../src/components/pickers/BasePicker.Props.ts        |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/pickers-inputprops-bugfix_2017-08-25-19-07.json

diff --git a/common/changes/office-ui-fabric-react/pickers-inputprops-bugfix_2017-08-25-19-07.json b/common/changes/office-ui-fabric-react/pickers-inputprops-bugfix_2017-08-25-19-07.json
new file mode 100644
index 0000000000000..c3127149ebf02
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/pickers-inputprops-bugfix_2017-08-25-19-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Pickers: Have IInput props correctly extend inputhtmlattributes",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
index b4a4b41526f2b..99872b516089e 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
@@ -187,7 +187,7 @@ export enum ValidationState {
   invalid
 }
 
-export interface IInputProps extends React.HTMLAttributes<HTMLInputElement> {
+export interface IInputProps extends React.InputHTMLAttributes<HTMLInputElement> {
   /**
    * Screen reader label to apply to an input element.
    */

From 3ec7aeb275e819c90c2ba5ad4269c53165d07c70 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 25 Aug 2017 19:27:18 +0000
Subject: [PATCH 0503/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...eyOrValueFix_--2301-_2017-08-25-01-20.json | 11 -----------
 ...rs-inputprops-bugfix_2017-08-25-19-07.json | 11 -----------
 packages/experiments/CHANGELOG.json           | 12 ++++++++++++
 packages/experiments/CHANGELOG.md             |  7 ++++++-
 packages/experiments/package.json             |  4 ++--
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 12 files changed, 53 insertions(+), 31 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxOptionsUpdateWithoutSelectedKeyOrValueFix_--2301-_2017-08-25-01-20.json
 delete mode 100644 common/changes/office-ui-fabric-react/pickers-inputprops-bugfix_2017-08-25-19-07.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index e2d43803955b0..fe0b8160e98b9 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -72,7 +72,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.37.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.37.3 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 60cbef0c125fb..1924807beed05 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.37.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.37.3 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 89d1b210ca55c..ae527875df9d5 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -35,7 +35,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.37.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.37.3 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 746141d03343f..34e5c032b3e6f 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.37.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.37.3 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxOptionsUpdateWithoutSelectedKeyOrValueFix_--2301-_2017-08-25-01-20.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxOptionsUpdateWithoutSelectedKeyOrValueFix_--2301-_2017-08-25-01-20.json
deleted file mode 100644
index 2538260d2cecc..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxOptionsUpdateWithoutSelectedKeyOrValueFix_--2301-_2017-08-25-01-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox- Make sure the option always get updated if they change (#2301)",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/pickers-inputprops-bugfix_2017-08-25-19-07.json b/common/changes/office-ui-fabric-react/pickers-inputprops-bugfix_2017-08-25-19-07.json
deleted file mode 100644
index c3127149ebf02..0000000000000
--- a/common/changes/office-ui-fabric-react/pickers-inputprops-bugfix_2017-08-25-19-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Pickers: Have IInput props correctly extend inputhtmlattributes",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 1ca49999821e1..7a76090829554 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,18 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "0.1.6",
+      "tag": "@uifabric/experiments_v0.1.6",
+      "date": "Fri, 25 Aug 2017 19:27:18 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `4.37.2` to `4.37.3`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.1.5",
       "tag": "@uifabric/experiments_v0.1.5",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 442ec644e9d7b..3f4b175cd17bd 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Thu, 24 Aug 2017 10:20:20 GMT and should not be manually modified.
+This log was last generated on Fri, 25 Aug 2017 19:27:18 GMT and should not be manually modified.
+
+## 0.1.6
+Fri, 25 Aug 2017 19:27:18 GMT
+
+*Changes not tracked*
 
 ## 0.1.5
 Thu, 24 Aug 2017 10:20:20 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index a21d0730d9346..28e45f0e21a26 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "0.1.5",
+  "version": "0.1.6",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -64,7 +64,7 @@
     "webpack-notifier": "^1.5.0"
   },
   "dependencies": {
-    "office-ui-fabric-react": "4.37.2"
+    "office-ui-fabric-react": "4.37.3"
   },
   "peerDependencies": {
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 7b1a029acfc40..381b79807b560 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.37.3",
+      "tag": "office-ui-fabric-react_v4.37.3",
+      "date": "Fri, 25 Aug 2017 19:27:18 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "74203c8aec4976f12a30eb4abab4738ed4487b67",
+            "comment": "ComboBox- Make sure the option always get updated if they change (#2301)"
+          },
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "66b1a18537f33d92434acc717842762bdad47eef",
+            "comment": "Pickers: Have IInput props correctly extend inputhtmlattributes"
+          }
+        ]
+      }
+    },
     {
       "version": "4.37.2",
       "tag": "office-ui-fabric-react_v4.37.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 8d9f71b9b18fa..b09330f808986 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 25 Aug 2017 10:09:40 GMT and should not be manually modified.
+This log was last generated on Fri, 25 Aug 2017 19:27:18 GMT and should not be manually modified.
+
+## 4.37.3
+Fri, 25 Aug 2017 19:27:18 GMT
+
+### Patches
+
+- ComboBox- Make sure the option always get updated if they change (#2301)
+- Pickers: Have IInput props correctly extend inputhtmlattributes
 
 ## 4.37.2
 Fri, 25 Aug 2017 10:09:40 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 125aefe9a9385..eb3a53989f093 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.37.2",
+  "version": "4.37.3",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 6746103da3c35f95afb1cde1b304a756c550deff Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 25 Aug 2017 13:12:51 -0700
Subject: [PATCH 0504/1641] Fixing sourcemaps to not fail building in webpack.
 (#2636)

* Updating build to output sourceContent in source maps.

* Touching files to add changes

* Adding change files.

* undoing changes

* Update ts.js
---
 .../fix-sourcemaps_2017-08-25-20-10.json              | 11 +++++++++++
 .../experiments/fix-sourcemaps_2017-08-25-20-10.json  | 11 +++++++++++
 .../styling/fix-sourcemaps_2017-08-25-20-10.json      | 11 +++++++++++
 .../utilities/fix-sourcemaps_2017-08-25-20-10.json    | 11 +++++++++++
 .../fix-sourcemaps_2017-08-25-20-10.json              | 11 +++++++++++
 scripts/tasks/ts.js                                   | 11 ++++++-----
 6 files changed, 61 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/fix-sourcemaps_2017-08-25-20-10.json
 create mode 100644 common/changes/@uifabric/experiments/fix-sourcemaps_2017-08-25-20-10.json
 create mode 100644 common/changes/@uifabric/styling/fix-sourcemaps_2017-08-25-20-10.json
 create mode 100644 common/changes/@uifabric/utilities/fix-sourcemaps_2017-08-25-20-10.json
 create mode 100644 common/changes/office-ui-fabric-react/fix-sourcemaps_2017-08-25-20-10.json

diff --git a/common/changes/@uifabric/example-app-base/fix-sourcemaps_2017-08-25-20-10.json b/common/changes/@uifabric/example-app-base/fix-sourcemaps_2017-08-25-20-10.json
new file mode 100644
index 0000000000000..81680dad9ea2b
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/fix-sourcemaps_2017-08-25-20-10.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Adding back sourcemap content to .map files, which should alleviate \"../src/* missing\" issues when using webpack.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/fix-sourcemaps_2017-08-25-20-10.json b/common/changes/@uifabric/experiments/fix-sourcemaps_2017-08-25-20-10.json
new file mode 100644
index 0000000000000..b4d6b3442eed0
--- /dev/null
+++ b/common/changes/@uifabric/experiments/fix-sourcemaps_2017-08-25-20-10.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Adding back sourcemap content to .map files, which should alleviate \"../src/* missing\" issues when using webpack.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/fix-sourcemaps_2017-08-25-20-10.json b/common/changes/@uifabric/styling/fix-sourcemaps_2017-08-25-20-10.json
new file mode 100644
index 0000000000000..02b66254c3771
--- /dev/null
+++ b/common/changes/@uifabric/styling/fix-sourcemaps_2017-08-25-20-10.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Adding back sourcemap content to .map files, which should alleviate \"../src/* missing\" issues when using webpack.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/fix-sourcemaps_2017-08-25-20-10.json b/common/changes/@uifabric/utilities/fix-sourcemaps_2017-08-25-20-10.json
new file mode 100644
index 0000000000000..a70de6833b611
--- /dev/null
+++ b/common/changes/@uifabric/utilities/fix-sourcemaps_2017-08-25-20-10.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Adding back sourcemap content to .map files, which should alleviate \"../src/* missing\" issues when using webpack.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-sourcemaps_2017-08-25-20-10.json b/common/changes/office-ui-fabric-react/fix-sourcemaps_2017-08-25-20-10.json
new file mode 100644
index 0000000000000..cbc92e72e4a5f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-sourcemaps_2017-08-25-20-10.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Adding back sourcemap content to .map files, which should alleviate \"../src/* missing\" issues when using webpack.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/scripts/tasks/ts.js b/scripts/tasks/ts.js
index f6fc974559d28..561df4a5dd791 100644
--- a/scripts/tasks/ts.js
+++ b/scripts/tasks/ts.js
@@ -2,11 +2,12 @@ module.exports = function (options) {
   const path = require('path');
   const execSync = require('../exec-sync');
   const typescriptPath = 'node ' + path.resolve(__dirname, '../node_modules/typescript/lib/tsc');
-
-  execSync(typescriptPath + ' -outDir lib -t es5 -m commonjs --pretty');
+  const extraParams = '--pretty' + (options.isProduction ? ' --inlineSources --mapRoot ../src' : '');
+  
+  execSync(typescriptPath + ' -outDir lib -t es5 -m commonjs ' + extraParams);
 
   if (options.isProduction) {
-    execSync(typescriptPath + ' -outDir lib-amd -t es5 -m amd --pretty');
-    // execSync(typescriptPath + ' -outDir lib-es6 -t es6 -m es6 --pretty', 'typescript es6');
+    execSync(typescriptPath + ' -outDir lib-amd -t es5 -m amd ' + extraParams);
+    // execSync(typescriptPath + ' -outDir lib-es6 -t es6 -m es6 ' + extraParams, 'typescript es6');
   }
-};
\ No newline at end of file
+};

From 6cf93d94d9adcf55ba7616e0d9d55936e9a1e465 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 25 Aug 2017 20:31:52 +0000
Subject: [PATCH 0505/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  4 +--
 .../fix-sourcemaps_2017-08-25-20-10.json      | 11 --------
 .../fix-sourcemaps_2017-08-25-20-10.json      | 11 --------
 .../fix-sourcemaps_2017-08-25-20-10.json      | 11 --------
 .../fix-sourcemaps_2017-08-25-20-10.json      | 11 --------
 .../fix-sourcemaps_2017-08-25-20-10.json      | 11 --------
 packages/example-app-base/CHANGELOG.json      | 22 ++++++++++++++++
 packages/example-app-base/CHANGELOG.md        |  9 ++++++-
 packages/example-app-base/package.json        |  6 ++---
 packages/experiments/CHANGELOG.json           | 22 ++++++++++++++++
 packages/experiments/CHANGELOG.md             |  9 ++++++-
 packages/experiments/package.json             |  6 ++---
 .../office-ui-fabric-react/CHANGELOG.json     | 25 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++-
 packages/office-ui-fabric-react/package.json  |  8 +++---
 packages/styling/CHANGELOG.json               | 19 ++++++++++++++
 packages/styling/CHANGELOG.md                 |  9 ++++++-
 packages/styling/package.json                 |  4 +--
 packages/utilities/CHANGELOG.json             | 14 +++++++++++
 packages/utilities/CHANGELOG.md               |  9 ++++++-
 packages/utilities/package.json               |  2 +-
 21 files changed, 157 insertions(+), 75 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/fix-sourcemaps_2017-08-25-20-10.json
 delete mode 100644 common/changes/@uifabric/experiments/fix-sourcemaps_2017-08-25-20-10.json
 delete mode 100644 common/changes/@uifabric/styling/fix-sourcemaps_2017-08-25-20-10.json
 delete mode 100644 common/changes/@uifabric/utilities/fix-sourcemaps_2017-08-25-20-10.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-sourcemaps_2017-08-25-20-10.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index fe0b8160e98b9..bbf2ca671c411 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -67,12 +67,12 @@
     "webpack-split-by-path": "2.0.0"
   },
   "dependencies": {
-    "@uifabric/example-app-base": ">=4.2.2 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.3 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.37.3 <5.0.0",
+    "office-ui-fabric-react": ">=4.37.4 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/fix-sourcemaps_2017-08-25-20-10.json b/common/changes/@uifabric/example-app-base/fix-sourcemaps_2017-08-25-20-10.json
deleted file mode 100644
index 81680dad9ea2b..0000000000000
--- a/common/changes/@uifabric/example-app-base/fix-sourcemaps_2017-08-25-20-10.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Adding back sourcemap content to .map files, which should alleviate \"../src/* missing\" issues when using webpack.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/fix-sourcemaps_2017-08-25-20-10.json b/common/changes/@uifabric/experiments/fix-sourcemaps_2017-08-25-20-10.json
deleted file mode 100644
index b4d6b3442eed0..0000000000000
--- a/common/changes/@uifabric/experiments/fix-sourcemaps_2017-08-25-20-10.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Adding back sourcemap content to .map files, which should alleviate \"../src/* missing\" issues when using webpack.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/fix-sourcemaps_2017-08-25-20-10.json b/common/changes/@uifabric/styling/fix-sourcemaps_2017-08-25-20-10.json
deleted file mode 100644
index 02b66254c3771..0000000000000
--- a/common/changes/@uifabric/styling/fix-sourcemaps_2017-08-25-20-10.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Adding back sourcemap content to .map files, which should alleviate \"../src/* missing\" issues when using webpack.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/fix-sourcemaps_2017-08-25-20-10.json b/common/changes/@uifabric/utilities/fix-sourcemaps_2017-08-25-20-10.json
deleted file mode 100644
index a70de6833b611..0000000000000
--- a/common/changes/@uifabric/utilities/fix-sourcemaps_2017-08-25-20-10.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Adding back sourcemap content to .map files, which should alleviate \"../src/* missing\" issues when using webpack.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-sourcemaps_2017-08-25-20-10.json b/common/changes/office-ui-fabric-react/fix-sourcemaps_2017-08-25-20-10.json
deleted file mode 100644
index cbc92e72e4a5f..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-sourcemaps_2017-08-25-20-10.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Adding back sourcemap content to .map files, which should alleviate \"../src/* missing\" issues when using webpack.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 0f59b6a21134a..24581f729889b 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "4.2.3",
+      "tag": "@uifabric/example-app-base_v4.2.3",
+      "date": "Fri, 25 Aug 2017 20:31:51 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "6746103da3c35f95afb1cde1b304a756c550deff",
+            "comment": "Adding back sourcemap content to .map files, which should alleviate \"../src/* missing\" issues when using webpack."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.20.1 <1.0.0` to `>=0.20.2 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.10.1 <5.0.0` to `>=4.10.2 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.2.2",
       "tag": "@uifabric/example-app-base_v4.2.2",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index 64bba05beeef0..709d0bb0655ec 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Thu, 24 Aug 2017 05:38:14 GMT and should not be manually modified.
+This log was last generated on Fri, 25 Aug 2017 20:31:51 GMT and should not be manually modified.
+
+## 4.2.3
+Fri, 25 Aug 2017 20:31:51 GMT
+
+### Patches
+
+- Adding back sourcemap content to .map files, which should alleviate "../src/* missing" issues when using webpack.
 
 ## 4.2.2
 Thu, 24 Aug 2017 05:38:14 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index d19bcad4eb3a5..a4a2d2151441e 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "4.2.2",
+  "version": "4.2.3",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,8 +47,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.20.1 <1.0.0",
-    "@uifabric/utilities": ">=4.10.1 <5.0.0",
+    "@uifabric/styling": ">=0.20.2 <1.0.0",
+    "@uifabric/utilities": ">=4.10.2 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.4.0 <5.0.0",
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 7a76090829554..954e179bb43d5 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "0.1.7",
+      "tag": "@uifabric/experiments_v0.1.7",
+      "date": "Fri, 25 Aug 2017 20:31:51 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "6746103da3c35f95afb1cde1b304a756c550deff",
+            "comment": "Adding back sourcemap content to .map files, which should alleviate \"../src/* missing\" issues when using webpack."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `4.37.3` to `4.37.4`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=4.2.2 <5.0.0` to `>=4.2.3 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.1.6",
       "tag": "@uifabric/experiments_v0.1.6",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 3f4b175cd17bd..0271a0ba63ab6 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Fri, 25 Aug 2017 19:27:18 GMT and should not be manually modified.
+This log was last generated on Fri, 25 Aug 2017 20:31:51 GMT and should not be manually modified.
+
+## 0.1.7
+Fri, 25 Aug 2017 20:31:51 GMT
+
+### Patches
+
+- Adding back sourcemap content to .map files, which should alleviate "../src/* missing" issues when using webpack.
 
 ## 0.1.6
 Fri, 25 Aug 2017 19:27:18 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 28e45f0e21a26..db623e4467e76 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "0.1.6",
+  "version": "0.1.7",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -28,7 +28,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=4.2.2 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.3 <5.0.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -64,7 +64,7 @@
     "webpack-notifier": "^1.5.0"
   },
   "dependencies": {
-    "office-ui-fabric-react": "4.37.3"
+    "office-ui-fabric-react": "4.37.4"
   },
   "peerDependencies": {
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 381b79807b560..e4f7c091a51fe 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,31 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.37.4",
+      "tag": "office-ui-fabric-react_v4.37.4",
+      "date": "Fri, 25 Aug 2017 20:31:51 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "6746103da3c35f95afb1cde1b304a756c550deff",
+            "comment": "Adding back sourcemap content to .map files, which should alleviate \"../src/* missing\" issues when using webpack."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.10.1 <5.0.0` to `>=4.10.2 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.20.1 <1.0.0` to `>=0.20.2 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=4.2.2 <5.0.0` to `>=4.2.3 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.37.3",
       "tag": "office-ui-fabric-react_v4.37.3",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index b09330f808986..9ffd34c8b89ef 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 25 Aug 2017 19:27:18 GMT and should not be manually modified.
+This log was last generated on Fri, 25 Aug 2017 20:31:51 GMT and should not be manually modified.
+
+## 4.37.4
+Fri, 25 Aug 2017 20:31:51 GMT
+
+### Patches
+
+- Adding back sourcemap content to .map files, which should alleviate "../src/* missing" issues when using webpack.
 
 ## 4.37.3
 Fri, 25 Aug 2017 19:27:18 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index eb3a53989f093..8b6abbac13294 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.37.3",
+  "version": "4.37.4",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -28,7 +28,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=4.2.2 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.3 <5.0.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -70,8 +70,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
-    "@uifabric/utilities": ">=4.10.1 <5.0.0",
-    "@uifabric/styling": ">=0.20.1 <1.0.0",
+    "@uifabric/utilities": ">=4.10.2 <5.0.0",
+    "@uifabric/styling": ">=0.20.2 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 5442b5f121dd4..42591d20aa958 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.20.2",
+      "tag": "@uifabric/styling_v0.20.2",
+      "date": "Fri, 25 Aug 2017 20:31:51 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "6746103da3c35f95afb1cde1b304a756c550deff",
+            "comment": "Adding back sourcemap content to .map files, which should alleviate \"../src/* missing\" issues when using webpack."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.10.1 <5.0.0` to `>=4.10.2 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.20.1",
       "tag": "@uifabric/styling_v0.20.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index d992f426c97a5..2987481c27dda 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Wed, 23 Aug 2017 19:04:55 GMT and should not be manually modified.
+This log was last generated on Fri, 25 Aug 2017 20:31:51 GMT and should not be manually modified.
+
+## 0.20.2
+Fri, 25 Aug 2017 20:31:51 GMT
+
+### Patches
+
+- Adding back sourcemap content to .map files, which should alleviate "../src/* missing" issues when using webpack.
 
 ## 0.20.1
 Wed, 23 Aug 2017 19:04:55 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 5c8c6caa40a68..16b7310031140 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.20.1",
+  "version": "0.20.2",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
-    "@uifabric/utilities": ">=4.10.1 <5.0.0",
+    "@uifabric/utilities": ">=4.10.2 <5.0.0",
     "tslib": "^1.6.0",
     "rtl-css-js": "^1.1.1",
     "glamor": "^2.20.24"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index f8f3971a126e8..d119771724247 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.10.2",
+      "tag": "@uifabric/utilities_v4.10.2",
+      "date": "Fri, 25 Aug 2017 20:31:51 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "6746103da3c35f95afb1cde1b304a756c550deff",
+            "comment": "Adding back sourcemap content to .map files, which should alleviate \"../src/* missing\" issues when using webpack."
+          }
+        ]
+      }
+    },
     {
       "version": "4.10.1",
       "tag": "@uifabric/utilities_v4.10.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index efd51177f7701..40722bc057575 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Fri, 25 Aug 2017 10:09:40 GMT and should not be manually modified.
+This log was last generated on Fri, 25 Aug 2017 20:31:51 GMT and should not be manually modified.
+
+## 4.10.2
+Fri, 25 Aug 2017 20:31:51 GMT
+
+### Patches
+
+- Adding back sourcemap content to .map files, which should alleviate "../src/* missing" issues when using webpack.
 
 ## 4.10.1
 Fri, 25 Aug 2017 10:09:40 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 038f0f7fe2ad2..1b443d2b6746e 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.10.1",
+  "version": "4.10.2",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From a8c320b1aad836100fe35a56eea73be2b2ac9652 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Fri, 25 Aug 2017 16:54:19 -0700
Subject: [PATCH 0506/1641] Fix bugs in SelectionZone outside of a FocusZone
 and enhance TilesList selection (#2620)

* Set noUnusedLocals flag in experiments

* Fis noUnusedLocals issues

* Add <a> target to Tile

* Remove <SelectionZone> from TilesList

* Fix event ordering of SelectionZone outside of FocusZone

* Fix TilesList underflow issue in stack mode

* Update change output
---
 .../tiles-selection_2017-08-24-23-24.json     | 11 +++++
 .../tiles-selection_2017-08-24-23-24.json     | 11 +++++
 .../components/CommandBar/CommandBar.Props.ts |  3 +-
 .../experiments/src/components/Tile/Tile.scss | 25 +++++++---
 .../experiments/src/components/Tile/Tile.tsx  | 47 ++++++++++---------
 .../components/TilesList/TilesList.Props.ts   |  5 --
 .../src/components/TilesList/TilesList.tsx    | 38 ++++-----------
 .../examples/TilesList.Document.Example.tsx   | 20 ++++++--
 .../examples/TilesList.Media.Example.tsx      | 20 ++++++--
 packages/experiments/tsconfig.json            |  3 +-
 .../src/utilities/selection/SelectionZone.tsx | 14 ++++--
 11 files changed, 119 insertions(+), 78 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/tiles-selection_2017-08-24-23-24.json
 create mode 100644 common/changes/office-ui-fabric-react/tiles-selection_2017-08-24-23-24.json

diff --git a/common/changes/@uifabric/experiments/tiles-selection_2017-08-24-23-24.json b/common/changes/@uifabric/experiments/tiles-selection_2017-08-24-23-24.json
new file mode 100644
index 0000000000000..ddc16c840cb1b
--- /dev/null
+++ b/common/changes/@uifabric/experiments/tiles-selection_2017-08-24-23-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Separate Selection out from TilesList and fix minor TilesList bugs",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/tiles-selection_2017-08-24-23-24.json b/common/changes/office-ui-fabric-react/tiles-selection_2017-08-24-23-24.json
new file mode 100644
index 0000000000000..65938cbf2af38
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/tiles-selection_2017-08-24-23-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix issues when a SelectionZone is outside a FocusZone",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.Props.ts b/packages/experiments/src/components/CommandBar/CommandBar.Props.ts
index 45423af44824c..d7a9bda28518e 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.Props.ts
+++ b/packages/experiments/src/components/CommandBar/CommandBar.Props.ts
@@ -1,8 +1,7 @@
-/* tslint:disable:no-unused-variable */
+
 import * as React from 'react';
 import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
 import { IButtonStyles } from 'office-ui-fabric-react/lib/Button';
-import { ISearchBoxProps } from 'office-ui-fabric-react/lib/SearchBox';
 import { IIconProps } from 'office-ui-fabric-react/lib/Icon';
 import { ICommandBarData } from './CommandBar';
 
diff --git a/packages/experiments/src/components/Tile/Tile.scss b/packages/experiments/src/components/Tile/Tile.scss
index ff61e4e6caab9..4b024e0020b12 100644
--- a/packages/experiments/src/components/Tile/Tile.scss
+++ b/packages/experiments/src/components/Tile/Tile.scss
@@ -12,13 +12,6 @@
   right: 0;
   background-color: $ms-color-white;
   transition: transform 0.1s linear;
-  overflow: hidden;
-  display: flex;
-  flex-direction: column;
-  align-items: stretch;
-  align-content: stretch;
-
-  text-decoration: none;
   color: $ms-color-neutralPrimary;
 
   &:hover {
@@ -82,6 +75,24 @@
   }
 }
 
+.link {
+  @include focus-clear();
+
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
+  text-decoration: none;
+  color: inherit;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  align-content: stretch;
+  text-decoration: none;
+}
+
 .frame {
   margin: auto;
   position: relative;
diff --git a/packages/experiments/src/components/Tile/Tile.tsx b/packages/experiments/src/components/Tile/Tile.tsx
index 9cb89d9426647..e5181f830515e 100644
--- a/packages/experiments/src/components/Tile/Tile.tsx
+++ b/packages/experiments/src/components/Tile/Tile.tsx
@@ -121,8 +121,7 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
     const Tag = aProps.href ? 'a' : 'span';
 
     return (
-      <Tag
-        { ...(aProps.href ? aProps : {}) }
+      <div
         aria-labelledby={ this._nameId }
         aria-describedby={ this._activityId }
         className={ css('ms-Tile', className, TileStyles.tile, {
@@ -133,32 +132,38 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
         }) }
         data-is-focusable={ true }
         data-is-sub-focuszone={ true }
-        data-selection-invoke={ (selectionIndex > -1) ? true : undefined }
+        data-disable-click-on-enter={ true }
         data-selection-index={ (selectionIndex > -1) ? selectionIndex : undefined }
       >
-        {
-          background ? this._onRenderBackground({
-            background: background
-          }) : null
-        }
-        {
-          foreground ? this._onRenderForeground({
-            foreground: foreground,
-            showForegroundFrame: showForegroundFrame
-          }) : null
-        }
-        {
-          (itemName || itemActivity) ? this._onRenderNameplate({
-            name: itemName,
-            activity: itemActivity
-          }) : null
-        }
+        <Tag
+          { ...aProps }
+          data-selection-invoke={ (selectionIndex > -1) ? true : undefined }
+          className={ css('ms-Tile-link', TileStyles.link) }
+        >
+          {
+            background ? this._onRenderBackground({
+              background: background
+            }) : null
+          }
+          {
+            foreground ? this._onRenderForeground({
+              foreground: foreground,
+              showForegroundFrame: showForegroundFrame
+            }) : null
+          }
+          {
+            (itemName || itemActivity) ? this._onRenderNameplate({
+              name: itemName,
+              activity: itemActivity
+            }) : null
+          }
+        </Tag>
         {
           isSelectable ? this._onRenderCheck({
             isSelected: isSelected
           }) : null
         }
-      </Tag>
+      </div>
     );
   }
 
diff --git a/packages/experiments/src/components/TilesList/TilesList.Props.ts b/packages/experiments/src/components/TilesList/TilesList.Props.ts
index f510ad15a4809..ab31035b628c5 100644
--- a/packages/experiments/src/components/TilesList/TilesList.Props.ts
+++ b/packages/experiments/src/components/TilesList/TilesList.Props.ts
@@ -2,7 +2,6 @@
 import * as React from 'react';
 import { IBaseProps } from 'office-ui-fabric-react/lib/Utilities';
 import { TilesList } from './TilesList';
-import { Selection } from 'office-ui-fabric-react/lib/utilities/selection/Selection';
 
 export interface ITilesGridItem<TItem> {
   /**
@@ -95,8 +94,4 @@ export interface ITilesListProps<TItem> extends IBaseProps, React.HTMLAttributes
    * The desired number of content cells to render per page.
    */
   cellsPerPage?: number;
-  /**
-   * The current selection model.
-   */
-  selection?: Selection;
 }
diff --git a/packages/experiments/src/components/TilesList/TilesList.tsx b/packages/experiments/src/components/TilesList/TilesList.tsx
index 90dcde7a2a73e..0fb0f966ba42a 100644
--- a/packages/experiments/src/components/TilesList/TilesList.tsx
+++ b/packages/experiments/src/components/TilesList/TilesList.tsx
@@ -3,7 +3,6 @@ import * as React from 'react';
 import { ITilesListProps, ITilesGridItem, ITilesGridSegment, TilesGridMode, ITileSize } from './TilesList.Props';
 import { List, IPageProps } from 'office-ui-fabric-react/lib/List';
 import { FocusZone, FocusZoneDirection } from 'office-ui-fabric-react/lib/FocusZone';
-import { SelectionZone, SelectionMode } from 'office-ui-fabric-react/lib/utilities/selection/index';
 import { autobind, css, IRenderFunction, IRectangle } from 'office-ui-fabric-react/lib/Utilities';
 import * as TilesListStylesModule from './TilesList.scss';
 
@@ -92,36 +91,19 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
   }
 
   public render(): JSX.Element {
-    const {
-      selection
-    } = this.props;
-
     const {
       cells
     } = this.state;
 
-    const list = (
-      <List
-        items={ cells }
-        getPageSpecification={ this._getPageSpecification }
-        onRenderPage={ this._onRenderPage }
-      />
-    );
-
     return (
       <FocusZone
         direction={ FocusZoneDirection.bidirectional }
       >
-        {
-          selection ?
-            <SelectionZone
-              selection={ selection }
-              selectionMode={ SelectionMode.multiple }
-            >
-              { list }
-            </SelectionZone> :
-            list
-        }
+        <List
+          items={ cells }
+          getPageSpecification={ this._getPageSpecification }
+          onRenderPage={ this._onRenderPage }
+        />
       </FocusZone>
     );
   }
@@ -392,18 +374,16 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
         currentRow.scaleFactor = (boundsWidth - totalMargin) / (rowWidth - totalMargin);
       }
 
-      if (!isAtGridEnd && currentRow.scaleFactor > grid.maxScaleFactor) {
+      if (!isAtGridEnd && currentRow.scaleFactor > (grid.mode === TilesGridMode.fill ? grid.maxScaleFactor : 1)) {
         // If the last computed row is not the end of the grid, and the content cannot scale to fit the width,
         // declare these cells as 'extra' and let them be pushed into the next page.
         extraCells = cells.slice(rowStart, i);
       }
     }
 
-    const itemCount = extraCells ?
-      // If there are extra cells, cut off the page so the extra cells will be pushed into the next page.
-      rowStart - startIndex :
-      // Otherwise, take all the cells.
-      i - startIndex;
+    // If there are extra cells, cut off the page so the extra cells will be pushed into the next page.
+    // Otherwise, take all the cells.
+    const itemCount = i - (extraCells ? extraCells.length : 0) - startIndex;
 
     const pageSpecification: IPageSpecification<TItem> = {
       itemCount: itemCount,
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
index 3570b1a3e3fe4..1aee9da9ef2f6 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
@@ -4,7 +4,7 @@ import {
   TilesList
 } from '../../TilesList';
 import { Tile } from '../../../Tile';
-import { Selection } from 'office-ui-fabric-react/lib/utilities/selection/Selection';
+import { Selection, SelectionZone } from 'office-ui-fabric-react/lib/Selection';
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { AnimationClassNames } from 'office-ui-fabric-react/lib/Styling';
@@ -56,15 +56,27 @@ export class TilesListDocumentExample extends React.Component<{}, {}> {
       // tslint:disable-next-line:jsx-ban-props
       <div style={ { padding: '4px' } }>
         <MarqueeSelection selection={ this._selection }>
-          <TilesListType
+          <SelectionZone
             selection={ this._selection }
-            items={ items }
-          />
+            onItemInvoked={ this._onItemInvoked }
+          >
+            <TilesListType
+              items={ items }
+            />
+          </SelectionZone>
         </MarqueeSelection>
       </div>
     );
   }
 
+  @autobind
+  private _onItemInvoked(item: IExampleItem, index: number, event: Event): void {
+    event.stopPropagation();
+    event.preventDefault();
+
+    alert(`Invoked item '${item.name}'`);
+  }
+
   @autobind
   private _onRenderDocumentCell(item: IExampleItem): JSX.Element {
     return (
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
index 912d6f403dd19..36f13df3118e1 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
@@ -5,7 +5,7 @@ import {
   ITileSize
 } from '../../TilesList';
 import { Tile } from '../../../Tile';
-import { Selection } from 'office-ui-fabric-react/lib/utilities/selection/Selection';
+import { Selection, SelectionZone } from 'office-ui-fabric-react/lib/Selection';
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { AnimationClassNames } from 'office-ui-fabric-react/lib/Styling';
@@ -57,15 +57,27 @@ export class TilesListMediaExample extends React.Component<{}, {}> {
       // tslint:disable-next-line:jsx-ban-props
       <div style={ { padding: '4px' } }>
         <MarqueeSelection selection={ this._selection }>
-          <TilesListType
+          <SelectionZone
             selection={ this._selection }
-            items={ items }
-          />
+            onItemInvoked={ this._onItemInvoked }
+          >
+            <TilesListType
+              items={ items }
+            />
+          </SelectionZone>
         </MarqueeSelection>
       </div>
     );
   }
 
+  @autobind
+  private _onItemInvoked(item: IExampleItem, index: number, event: Event): void {
+    event.stopPropagation();
+    event.preventDefault();
+
+    alert(`Invoked item '${item.name}'`);
+  }
+
   @autobind
   private _onRenderMediaCell(item: IExampleItem, finalSize: ITileSize): JSX.Element {
     return (
diff --git a/packages/experiments/tsconfig.json b/packages/experiments/tsconfig.json
index 8c9ef12253000..27c99b10fb390 100644
--- a/packages/experiments/tsconfig.json
+++ b/packages/experiments/tsconfig.json
@@ -8,6 +8,7 @@
     "sourceMap": true,
     "experimentalDecorators": true,
     "importHelpers": true,
+    "noUnusedLocals": true,
     "forceConsistentCasingInFileNames": true,
     "strictNullChecks": true,
     "noImplicitAny": true,
@@ -30,4 +31,4 @@
   "include": [
     "src"
   ]
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
index 2e2a57d889533..5115f4e37dac1 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
@@ -74,7 +74,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     let scrollElement = findScrollableParent(this.refs.root);
 
     // Track the latest modifier keys globally.
-    this._events.on(win, 'keydown keyup', this._updateModifiers);
+    this._events.on(win, 'keydown, keyup', this._updateModifiers, true);
     this._events.on(scrollElement, 'click', this._tryClearOnEmptyClick);
   }
 
@@ -85,6 +85,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
         ref='root'
         onKeyDown={ this._onKeyDown }
         onMouseDown={ this._onMouseDown }
+        onKeyDownCapture={ this._onKeyDownCapture }
         onClick={ this._onClick }
         role='presentation'
 
@@ -280,6 +281,13 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     }
   }
 
+  @autobind
+  private _onKeyDownCapture(ev: React.KeyboardEvent<HTMLElement>) {
+    this._updateModifiers(ev);
+
+    this._handleNextFocus(true);
+  }
+
   @autobind
   private _onKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
     this._updateModifiers(ev);
@@ -297,7 +305,6 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     // Ignore key downs from input elements.
     if (this._isInputElement(target)) {
       // A key was pressed while an item in this zone was focused.
-      this._handleNextFocus(true);
       return;
     }
 
@@ -349,9 +356,6 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
         target = getParent(target) as HTMLElement;
       }
     }
-
-    // A key was pressed while an item in this zone was focused.
-    this._handleNextFocus(true);
   }
 
   private _onToggleAllClick(ev: React.MouseEvent<HTMLElement>) {

From 7aa10dd59accd3de49d0e5256d693c72fbcae231 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 25 Aug 2017 17:04:05 -0700
Subject: [PATCH 0507/1641] Re-enabling sass theme token pre-processing in
 build. (#2641)

* Fixing sass to pre-process tokens.

* Re-enabling sass pre-processing.
---
 .../office-ui-fabric-react/sass_2017-08-25-23-55.json | 11 +++++++++++
 scripts/package.json                                  |  1 +
 scripts/tasks/sass.js                                 |  4 +++-
 3 files changed, 15 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/sass_2017-08-25-23-55.json

diff --git a/common/changes/office-ui-fabric-react/sass_2017-08-25-23-55.json b/common/changes/office-ui-fabric-react/sass_2017-08-25-23-55.json
new file mode 100644
index 0000000000000..75d3e97ac949b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/sass_2017-08-25-23-55.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Updating sass build to pre-process theming again for better registration performance.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/scripts/package.json b/scripts/package.json
index 859d61e93c4cd..9a40062b98992 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -7,6 +7,7 @@
     "build": "node -v"
   },
   "devDependencies": {
+    "@microsoft/load-themed-styles": "^1.5.1",
     "autoprefixer": "^7.1.2",
     "chalk": "^2.1.0",
     "cpx": "^1.5.0",
diff --git a/scripts/tasks/sass.js b/scripts/tasks/sass.js
index 95128f11d6eb6..749dba37bb1a0 100644
--- a/scripts/tasks/sass.js
+++ b/scripts/tasks/sass.js
@@ -5,6 +5,7 @@ module.exports = function (options) {
   const path = require('path');
   const fs = require('fs');
   const postcss = require('postcss');
+  const { splitStyles } = require("@microsoft/load-themed-styles");
   const autoprefixer = require('autoprefixer')({ browsers: ['> 1%', 'last 2 versions', 'ie >= 11'] });
   const modules = require('postcss-modules')({
     getJSON,
@@ -66,8 +67,9 @@ module.exports = function (options) {
     const source = [
       `/* tslint:disable */`,
       `import { loadStyles } from \'@microsoft/load-themed-styles\';`,
-      `loadStyles(${JSON.stringify(css)});`
+      `loadStyles(${JSON.stringify(splitStyles(css))});`
     ];
+
     const map = _fileNameToClassMap[fileName];
 
     for (let prop in map) {

From 23006609806052685ddc3fb0414f6814ba8fd619 Mon Sep 17 00:00:00 2001
From: Benjamin Kaiser <benjaminjkaiser@gmail.com>
Date: Fri, 25 Aug 2017 17:16:43 -0700
Subject: [PATCH 0508/1641] Add LikeSolid icon (#2637)

* Add LikeSolid icon

We would like to consume this icon through office-ui-fabric-react.

* add changefiles
---
 .../styling/bekaise-likeSolid_2017-08-25-20-43.json   | 11 +++++++++++
 .../bekaise-likeSolid_2017-08-25-20-43.json           | 11 +++++++++++
 .../src/components/Icon/IconName.ts                   |  1 +
 packages/styling/src/styles/IconCodes.ts              |  4 ++++
 4 files changed, 27 insertions(+)
 create mode 100644 common/changes/@uifabric/styling/bekaise-likeSolid_2017-08-25-20-43.json
 create mode 100644 common/changes/office-ui-fabric-react/bekaise-likeSolid_2017-08-25-20-43.json

diff --git a/common/changes/@uifabric/styling/bekaise-likeSolid_2017-08-25-20-43.json b/common/changes/@uifabric/styling/bekaise-likeSolid_2017-08-25-20-43.json
new file mode 100644
index 0000000000000..08fa0c5d0a05f
--- /dev/null
+++ b/common/changes/@uifabric/styling/bekaise-likeSolid_2017-08-25-20-43.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "Add LikeSolid icon",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "bekaise@microsoft.com"
+}
diff --git a/common/changes/office-ui-fabric-react/bekaise-likeSolid_2017-08-25-20-43.json b/common/changes/office-ui-fabric-react/bekaise-likeSolid_2017-08-25-20-43.json
new file mode 100644
index 0000000000000..76a892d6fb84c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/bekaise-likeSolid_2017-08-25-20-43.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add LikeSolid icon",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "bekaise@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Icon/IconName.ts b/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
index f818a5337cc7d..6b41fd25130b1 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
@@ -463,6 +463,7 @@ export type IconName =
   'Lightbulb' |
   'LightningBolt' |
   'Like' |
+  'LikeSolid' |
   'LineChart' |
   'Link' |
   'List' |
diff --git a/packages/styling/src/styles/IconCodes.ts b/packages/styling/src/styles/IconCodes.ts
index a46b69176f98c..a614c31bcd888 100644
--- a/packages/styling/src/styles/IconCodes.ts
+++ b/packages/styling/src/styles/IconCodes.ts
@@ -1519,6 +1519,10 @@ export const IconCodes = {
    * Icon code with the value '\uE8E1'.
    */
   like: '\uE8E1',
+  /**
+   * Icon code with the value '\uF3BF'
+   */
+  likeSolid: '\uF3BF',
   /**
    * Icon code with the value '\uE71B'.
    */

From 1d4c719efd0e59027ebb8b4ddf59eacd415c8f94 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Fri, 25 Aug 2017 17:40:40 -0700
Subject: [PATCH 0509/1641] Re-enable variable-name rule and tslint-disable
 affected lines in BaseComponent in utilities (#2632)

---
 packages/utilities/src/BaseComponent.ts | 2 ++
 packages/utilities/tslint.json          | 3 ---
 2 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/packages/utilities/src/BaseComponent.ts b/packages/utilities/src/BaseComponent.ts
index 4d2fbc3d3a504..14f9cd80bcb7d 100644
--- a/packages/utilities/src/BaseComponent.ts
+++ b/packages/utilities/src/BaseComponent.ts
@@ -32,11 +32,13 @@ export class BaseComponent<P extends IBaseProps, S = {}> extends React.Component
    */
   protected _shouldUpdateComponentRef: boolean;
 
+  // tslint:disable:variable-name
   private __async: Async;
   private __events: EventGroup;
   private __disposables: IDisposable[] | null;
   private __resolves: { [name: string]: (ref: any) => any };
   private __className: string;
+  // tslint:enable:variable-name
 
   /**
    * BaseComponent constructor
diff --git a/packages/utilities/tslint.json b/packages/utilities/tslint.json
index 7d8f6d8fad1ad..cd3b575b4545f 100644
--- a/packages/utilities/tslint.json
+++ b/packages/utilities/tslint.json
@@ -4,9 +4,6 @@
   ],
   "rules": {
     "no-any": false,
-    "variable-name": false,
-    "no-internal-module": false,
-    "prefer-const": false,
     "typedef": [
       false
     ]

From 8787bed91ff5e856975c631dc8454c1edde1327b Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Fri, 25 Aug 2017 17:41:40 -0700
Subject: [PATCH 0510/1641] Utilities: Add removeElement method to array.ts
 (#2614)

* Add removeElement utility method to array.ts

* Rush change

* Switch to a faster replace method using slice + splice instead of spread.

* Even faster.
---
 .../array-replace_2017-08-24-17-52.json       | 11 ++++++++
 packages/utilities/src/array.test.ts          | 28 ++++++++++++++++++-
 packages/utilities/src/array.ts               |  9 ++++++
 3 files changed, 47 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/utilities/array-replace_2017-08-24-17-52.json

diff --git a/common/changes/@uifabric/utilities/array-replace_2017-08-24-17-52.json b/common/changes/@uifabric/utilities/array-replace_2017-08-24-17-52.json
new file mode 100644
index 0000000000000..3e76b6a23db7a
--- /dev/null
+++ b/common/changes/@uifabric/utilities/array-replace_2017-08-24-17-52.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Array: Add removeElement method",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/src/array.test.ts b/packages/utilities/src/array.test.ts
index 5fca3a66e1e0b..ecbfb861fd947 100644
--- a/packages/utilities/src/array.test.ts
+++ b/packages/utilities/src/array.test.ts
@@ -1,4 +1,4 @@
-import { findIndex, find, createArray } from './array';
+import { findIndex, find, createArray, removeElement } from './array';
 let { expect } = chai;
 
 describe('array utils tests', () => {
@@ -55,4 +55,30 @@ describe('array utils tests', () => {
       expect(result).to.deep.equal(['a', 'b', 'c', 'd']);
     });
   });
+
+  describe('removeElement tests', () => {
+    it('should return a new array instead of mutating the existing array', () => {
+      const array = [0, 1, 2];
+      const result = removeElement(array, 0);
+      expect(result).to.not.equal(array);
+    });
+
+    it('should remove the first element of the array', () => {
+      const array = [0, 1, 2];
+      const result = removeElement(array, 0);
+      expect(result).to.deep.equal([1, 2]);
+    });
+
+    it('should remove the last element of the array', () => {
+      const array = [0, 1, 2];
+      const result = removeElement(array, 2);
+      expect(result).to.deep.equal([0, 1]);
+    });
+
+    it('should remove the element in the middle of the array', () => {
+      const array = [0, 1, 2];
+      const result = removeElement(array, 1);
+      expect(result).to.deep.equal([0, 2]);
+    });
+  });
 });
\ No newline at end of file
diff --git a/packages/utilities/src/array.ts b/packages/utilities/src/array.ts
index 820d6169a923c..d13f51ecd84e0 100644
--- a/packages/utilities/src/array.ts
+++ b/packages/utilities/src/array.ts
@@ -70,3 +70,12 @@ export function toMatrix<T>(items: T[], columnCount: number): T[][] {
     return rows;
   }, [] as T[][]);
 }
+
+/**
+ * Given an array, it returns a new array that does not contain the item at the given index.
+ * @param array - The array to operate on
+ * @param index - The index of the element to remove
+ */
+export function removeElement<T>(array: T[], index: number): T[] {
+  return array.filter((_, i) => index !== i);
+}
\ No newline at end of file

From d318b00272e2e42d522c68391f377c3f2c3b28fe Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Sat, 26 Aug 2017 00:52:38 +0000
Subject: [PATCH 0511/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../tiles-selection_2017-08-24-23-24.json     | 11 ---------
 .../bekaise-likeSolid_2017-08-25-20-43.json   | 11 ---------
 .../bekaise-likeSolid_2017-08-25-20-43.json   | 11 ---------
 .../sass_2017-08-25-23-55.json                | 11 ---------
 .../tiles-selection_2017-08-24-23-24.json     | 11 ---------
 packages/experiments/CHANGELOG.json           | 19 +++++++++++++++
 packages/experiments/CHANGELOG.md             |  9 ++++++-
 packages/experiments/package.json             |  4 ++--
 .../office-ui-fabric-react/CHANGELOG.json     | 24 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 11 ++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 15 files changed, 68 insertions(+), 64 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/tiles-selection_2017-08-24-23-24.json
 delete mode 100644 common/changes/@uifabric/styling/bekaise-likeSolid_2017-08-25-20-43.json
 delete mode 100644 common/changes/office-ui-fabric-react/bekaise-likeSolid_2017-08-25-20-43.json
 delete mode 100644 common/changes/office-ui-fabric-react/sass_2017-08-25-23-55.json
 delete mode 100644 common/changes/office-ui-fabric-react/tiles-selection_2017-08-24-23-24.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index bbf2ca671c411..eb885be4e6877 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -72,7 +72,7 @@
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.37.4 <5.0.0",
+    "office-ui-fabric-react": ">=4.37.5 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 1924807beed05..a217073a67e82 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.37.3 <5.0.0",
+    "office-ui-fabric-react": ">=4.37.5 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index ae527875df9d5..426682d9ab639 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -35,7 +35,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.37.3 <5.0.0",
+    "office-ui-fabric-react": ">=4.37.5 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 34e5c032b3e6f..3d1703a5ce4af 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.37.3 <5.0.0",
+    "office-ui-fabric-react": ">=4.37.5 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/experiments/tiles-selection_2017-08-24-23-24.json b/common/changes/@uifabric/experiments/tiles-selection_2017-08-24-23-24.json
deleted file mode 100644
index ddc16c840cb1b..0000000000000
--- a/common/changes/@uifabric/experiments/tiles-selection_2017-08-24-23-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Separate Selection out from TilesList and fix minor TilesList bugs",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/bekaise-likeSolid_2017-08-25-20-43.json b/common/changes/@uifabric/styling/bekaise-likeSolid_2017-08-25-20-43.json
deleted file mode 100644
index 08fa0c5d0a05f..0000000000000
--- a/common/changes/@uifabric/styling/bekaise-likeSolid_2017-08-25-20-43.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "Add LikeSolid icon",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "bekaise@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/bekaise-likeSolid_2017-08-25-20-43.json b/common/changes/office-ui-fabric-react/bekaise-likeSolid_2017-08-25-20-43.json
deleted file mode 100644
index 76a892d6fb84c..0000000000000
--- a/common/changes/office-ui-fabric-react/bekaise-likeSolid_2017-08-25-20-43.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add LikeSolid icon",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "bekaise@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/sass_2017-08-25-23-55.json b/common/changes/office-ui-fabric-react/sass_2017-08-25-23-55.json
deleted file mode 100644
index 75d3e97ac949b..0000000000000
--- a/common/changes/office-ui-fabric-react/sass_2017-08-25-23-55.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Updating sass build to pre-process theming again for better registration performance.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/tiles-selection_2017-08-24-23-24.json b/common/changes/office-ui-fabric-react/tiles-selection_2017-08-24-23-24.json
deleted file mode 100644
index 65938cbf2af38..0000000000000
--- a/common/changes/office-ui-fabric-react/tiles-selection_2017-08-24-23-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix issues when a SelectionZone is outside a FocusZone",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 954e179bb43d5..c245dae059792 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "0.2.0",
+      "tag": "@uifabric/experiments_v0.2.0",
+      "date": "Sat, 26 Aug 2017 00:52:38 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "a8c320b1aad836100fe35a56eea73be2b2ac9652",
+            "comment": "Separate Selection out from TilesList and fix minor TilesList bugs"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `4.37.4` to `4.37.5`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.1.7",
       "tag": "@uifabric/experiments_v0.1.7",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 0271a0ba63ab6..fdb1e7920119e 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Fri, 25 Aug 2017 20:31:51 GMT and should not be manually modified.
+This log was last generated on Sat, 26 Aug 2017 00:52:38 GMT and should not be manually modified.
+
+## 0.2.0
+Sat, 26 Aug 2017 00:52:38 GMT
+
+### Minor changes
+
+- Separate Selection out from TilesList and fix minor TilesList bugs
 
 ## 0.1.7
 Fri, 25 Aug 2017 20:31:51 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index db623e4467e76..1fc6834734f8e 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "0.1.7",
+  "version": "0.2.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -64,7 +64,7 @@
     "webpack-notifier": "^1.5.0"
   },
   "dependencies": {
-    "office-ui-fabric-react": "4.37.4"
+    "office-ui-fabric-react": "4.37.5"
   },
   "peerDependencies": {
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index e4f7c091a51fe..ad9ae8ca469ef 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.37.5",
+      "tag": "office-ui-fabric-react_v4.37.5",
+      "date": "Sat, 26 Aug 2017 00:52:38 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Benjamin Kaiser <benjaminjkaiser@gmail.com>",
+            "commit": "23006609806052685ddc3fb0414f6814ba8fd619",
+            "comment": "Add LikeSolid icon"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "7aa10dd59accd3de49d0e5256d693c72fbcae231",
+            "comment": "Updating sass build to pre-process theming again for better registration performance."
+          },
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "a8c320b1aad836100fe35a56eea73be2b2ac9652",
+            "comment": "Fix issues when a SelectionZone is outside a FocusZone"
+          }
+        ]
+      }
+    },
     {
       "version": "4.37.4",
       "tag": "office-ui-fabric-react_v4.37.4",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 9ffd34c8b89ef..f6faf126ada7c 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,15 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 25 Aug 2017 20:31:51 GMT and should not be manually modified.
+This log was last generated on Sat, 26 Aug 2017 00:52:38 GMT and should not be manually modified.
+
+## 4.37.5
+Sat, 26 Aug 2017 00:52:38 GMT
+
+### Patches
+
+- Add LikeSolid icon
+- Updating sass build to pre-process theming again for better registration performance.
+- Fix issues when a SelectionZone is outside a FocusZone
 
 ## 4.37.4
 Fri, 25 Aug 2017 20:31:51 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 8b6abbac13294..4b5a60e22e4ad 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.37.4",
+  "version": "4.37.5",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 73706e0bee1ca3eede408a9602a6f5dd9258d31e Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 28 Aug 2017 10:09:33 +0000
Subject: [PATCH 0512/1641] Applying package updates.

---
 .../utilities/array-replace_2017-08-24-17-52.json  | 11 -----------
 packages/example-app-base/package.json             |  2 +-
 packages/office-ui-fabric-react/package.json       |  2 +-
 packages/styling/package.json                      |  2 +-
 packages/utilities/CHANGELOG.json                  | 14 ++++++++++++++
 packages/utilities/CHANGELOG.md                    |  9 ++++++++-
 packages/utilities/package.json                    |  2 +-
 7 files changed, 26 insertions(+), 16 deletions(-)
 delete mode 100644 common/changes/@uifabric/utilities/array-replace_2017-08-24-17-52.json

diff --git a/common/changes/@uifabric/utilities/array-replace_2017-08-24-17-52.json b/common/changes/@uifabric/utilities/array-replace_2017-08-24-17-52.json
deleted file mode 100644
index 3e76b6a23db7a..0000000000000
--- a/common/changes/@uifabric/utilities/array-replace_2017-08-24-17-52.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Array: Add removeElement method",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index a4a2d2151441e..da1020f9cfbbd 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -48,7 +48,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=0.20.2 <1.0.0",
-    "@uifabric/utilities": ">=4.10.2 <5.0.0",
+    "@uifabric/utilities": ">=4.10.3 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.4.0 <5.0.0",
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 4b5a60e22e4ad..da7fcb622374e 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -70,7 +70,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
-    "@uifabric/utilities": ">=4.10.2 <5.0.0",
+    "@uifabric/utilities": ">=4.10.3 <5.0.0",
     "@uifabric/styling": ">=0.20.2 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 16b7310031140..0f8b23d4682f2 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
-    "@uifabric/utilities": ">=4.10.2 <5.0.0",
+    "@uifabric/utilities": ">=4.10.3 <5.0.0",
     "tslib": "^1.6.0",
     "rtl-css-js": "^1.1.1",
     "glamor": "^2.20.24"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index d119771724247..347b8f7c0f84c 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.10.3",
+      "tag": "@uifabric/utilities_v4.10.3",
+      "date": "Mon, 28 Aug 2017 10:09:32 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "8787bed91ff5e856975c631dc8454c1edde1327b",
+            "comment": "Array: Add removeElement method"
+          }
+        ]
+      }
+    },
     {
       "version": "4.10.2",
       "tag": "@uifabric/utilities_v4.10.2",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 40722bc057575..f5fa96e9e642d 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Fri, 25 Aug 2017 20:31:51 GMT and should not be manually modified.
+This log was last generated on Mon, 28 Aug 2017 10:09:32 GMT and should not be manually modified.
+
+## 4.10.3
+Mon, 28 Aug 2017 10:09:32 GMT
+
+### Patches
+
+- Array: Add removeElement method
 
 ## 4.10.2
 Fri, 25 Aug 2017 20:31:51 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 1b443d2b6746e..b53860470e837 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.10.2",
+  "version": "4.10.3",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 42a8dbcf9c3715d41f1393ec98642de1f73e67a9 Mon Sep 17 00:00:00 2001
From: David Wolf <lupine86@users.noreply.github.com>
Date: Mon, 28 Aug 2017 13:18:16 -0400
Subject: [PATCH 0513/1641] Users/davwolf/fix dialog close button logic (#2650)

* Show close button when dialog type is DialogType.close

* add change file

* Update users-davwolf-fixDialogCloseButtonLogic_2017-08-28-15-52.json
---
 ...lf-fixDialogCloseButtonLogic_2017-08-28-15-52.json | 11 +++++++++++
 .../src/components/Dialog/DialogContent.tsx           |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-davwolf-fixDialogCloseButtonLogic_2017-08-28-15-52.json

diff --git a/common/changes/office-ui-fabric-react/users-davwolf-fixDialogCloseButtonLogic_2017-08-28-15-52.json b/common/changes/office-ui-fabric-react/users-davwolf-fixDialogCloseButtonLogic_2017-08-28-15-52.json
new file mode 100644
index 0000000000000..09f201986ce4a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-davwolf-fixDialogCloseButtonLogic_2017-08-28-15-52.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dialog: Show close button when dialog type is DialogType.close",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "davwolf@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx
index 83d490845cbac..b670f23f710d0 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx
@@ -55,7 +55,7 @@ export class DialogContent extends BaseComponent<IDialogContentProps, {}> {
             { this.props.topButtonsProps!.map((props) => (
               <IconButton {...props} />
             )) }
-            { showCloseButton && type !== DialogType.largeHeader &&
+            { (type === DialogType.close || (showCloseButton && type !== DialogType.largeHeader)) &&
               <IconButton
                 className={ css(
                   'ms-Dialog-button ms-Dialog-button--close',

From 1bfc50eb3e4f3a47c38e705a5484b643f35f3bce Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Mon, 28 Aug 2017 13:03:15 -0700
Subject: [PATCH 0514/1641] Handle null or undefined values in Selection getKey
 param (#2652)

* Handle case where getKey is null or undefined in Selection

* Update change output

* Update selection-key_2017-08-28-19-11.json
---
 .../selection-key_2017-08-28-19-11.json            | 11 +++++++++++
 .../src/utilities/selection/Selection.ts           | 14 +++++++++++---
 2 files changed, 22 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/selection-key_2017-08-28-19-11.json

diff --git a/common/changes/office-ui-fabric-react/selection-key_2017-08-28-19-11.json b/common/changes/office-ui-fabric-react/selection-key_2017-08-28-19-11.json
new file mode 100644
index 0000000000000..ef7eab04f6197
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/selection-key_2017-08-28-19-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Selection: Adding better handling around a case where getKey returns null or undefined.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "tmichon@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts b/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
index d93067b893c17..0d1014da79145 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
@@ -57,7 +57,11 @@ export class Selection implements ISelection {
   }
 
   public getKey(item: IObjectWithKey, index?: number): string {
-    return `${this._getKey(item, index)}`;
+    const key = this._getKey(item, index);
+
+    return (typeof key === 'number' || key) ?
+      `${key}` :
+      '';
   }
 
   public setChangeEvents(isEnabled: boolean, suppressChange?: boolean) {
@@ -93,7 +97,11 @@ export class Selection implements ISelection {
       let item = items[i];
 
       if (item) {
-        newKeyToIndexMap[this.getKey(item, i)] = i;
+        const key = this.getKey(item, i);
+
+        if (key) {
+          newKeyToIndexMap[key] = i;
+        }
       }
 
       newUnselectableIndices[i] = item && !this.canSelectItem(item);
@@ -182,7 +190,7 @@ export class Selection implements ISelection {
     if (this.mode === SelectionMode.single) {
       selectableCount = Math.min(selectableCount, 1);
     }
-    
+
     return (
       (this.count > 0) &&
       (this._isAllSelected && this._exemptedCount === 0) ||

From 5128c5b25d383e5bb5dad2570683f490f4ba6781 Mon Sep 17 00:00:00 2001
From: John Miller <rubixws@gmail.com>
Date: Mon, 28 Aug 2017 15:29:44 -0700
Subject: [PATCH 0515/1641] Removing preloaders congif (#2616)

* Fixed deprecated values in webpack config
Fixed import
Updated package.json

* Reverting unncessary changes
---
 apps/fabric-website/webpack.serve.config.js | 3 ---
 apps/fabric-website/webpack.site.config.js  | 4 ++--
 2 files changed, 2 insertions(+), 5 deletions(-)

diff --git a/apps/fabric-website/webpack.serve.config.js b/apps/fabric-website/webpack.serve.config.js
index 6863e63b858f4..889f30ef02729 100644
--- a/apps/fabric-website/webpack.serve.config.js
+++ b/apps/fabric-website/webpack.serve.config.js
@@ -32,9 +32,6 @@ module.exports = {
     inline: true,
     port: 4321
   },
-  preLoaders: [
-    { test: /\.json$/, loader: 'json' },
-  ],
   module: {
     loaders: [
       {
diff --git a/apps/fabric-website/webpack.site.config.js b/apps/fabric-website/webpack.site.config.js
index 2a0ccadd4f779..d6ea9de84d2a5 100644
--- a/apps/fabric-website/webpack.site.config.js
+++ b/apps/fabric-website/webpack.site.config.js
@@ -68,8 +68,8 @@ function createConfig(isProduction, publicPath) {
 
     module: {
       noParse: [/autoit.js/],
-      preLoaders: [
-        { test: /\.json$/, loader: 'json' }
+      loaders: [
+        { test: /\.json$/, loader: 'json', enforce: 'pre' }
       ]
     },
 

From e9a99a34b2950f779b13b4299e2d495265872b52 Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Mon, 28 Aug 2017 17:17:51 -0700
Subject: [PATCH 0516/1641] Theming/styling: add accent color slot (#2657)

* adding the accent color to be part of theming

* adding change file

* fixed if statement
---
 .../theming-add-accentcolor_2017-08-28-23-41.json     | 11 +++++++++++
 packages/styling/src/interfaces/IPalette.ts           |  5 +++++
 packages/styling/src/styles/DefaultPalette.ts         |  1 +
 packages/styling/src/styles/theme.ts                  |  4 ++++
 4 files changed, 21 insertions(+)
 create mode 100644 common/changes/@uifabric/styling/theming-add-accentcolor_2017-08-28-23-41.json

diff --git a/common/changes/@uifabric/styling/theming-add-accentcolor_2017-08-28-23-41.json b/common/changes/@uifabric/styling/theming-add-accentcolor_2017-08-28-23-41.json
new file mode 100644
index 0000000000000..f00d973bf3e9b
--- /dev/null
+++ b/common/changes/@uifabric/styling/theming-add-accentcolor_2017-08-28-23-41.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Theming: added an accent color slot",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/styling/src/interfaces/IPalette.ts b/packages/styling/src/interfaces/IPalette.ts
index 61f4498fb6e8e..e7e19aa3b3785 100644
--- a/packages/styling/src/interfaces/IPalette.ts
+++ b/packages/styling/src/interfaces/IPalette.ts
@@ -112,6 +112,11 @@ export interface IPalette {
    */
   neutralLighterAlt: string;
 
+  /**
+   * Color code for the accent.
+   */
+  accent: string;
+
   /**
    * Color code for the softest color, which is white in the default theme. This is a very dark color in dark themes.
    * This is the page background.
diff --git a/packages/styling/src/styles/DefaultPalette.ts b/packages/styling/src/styles/DefaultPalette.ts
index 3c0ab6500a1fa..ad3e0825cc3a4 100644
--- a/packages/styling/src/styles/DefaultPalette.ts
+++ b/packages/styling/src/styles/DefaultPalette.ts
@@ -23,6 +23,7 @@ export const DefaultPalette: IPalette = {
   neutralLight: '#eaeaea',
   neutralLighter: '#f4f4f4',
   neutralLighterAlt: '#f8f8f8',
+  accent: '#0078d7',
   white: '#ffffff',
   yellow: '#ffb900',
   yellowLight: '#fff100',
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index a7ee93cbe9a66..4813f0e773d39 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -62,6 +62,10 @@ export function loadTheme(theme: IPartialTheme): ITheme {
 export function createTheme(theme: IPartialTheme): ITheme {
   let newPalette = { ...DefaultPalette, ...theme.palette };
 
+  if (!theme.palette || !theme.palette.accent) {
+    newPalette.accent = newPalette.themePrimary;
+  }
+
   return {
     palette: newPalette,
     fonts: {

From 9d4818a42955c9517b5b64c0e4d4ea2bab4c05ad Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Mon, 28 Aug 2017 17:52:44 -0700
Subject: [PATCH 0517/1641] Fix module references by Tile in Experiments
 (#2655)

* Fix Selection module references in Tile components

* Update change output
---
 .../experiments/tile-selection_2017-08-28-23-06.json  | 11 +++++++++++
 .../experiments/src/components/Tile/Tile.Props.ts     |  2 +-
 packages/experiments/src/components/Tile/Tile.tsx     |  2 +-
 3 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/tile-selection_2017-08-28-23-06.json

diff --git a/common/changes/@uifabric/experiments/tile-selection_2017-08-28-23-06.json b/common/changes/@uifabric/experiments/tile-selection_2017-08-28-23-06.json
new file mode 100644
index 0000000000000..ed182eeb98f6a
--- /dev/null
+++ b/common/changes/@uifabric/experiments/tile-selection_2017-08-28-23-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Fix Selection module reference in Tile modules",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Tile/Tile.Props.ts b/packages/experiments/src/components/Tile/Tile.Props.ts
index 3a9c22be08d42..d99f71913d82d 100644
--- a/packages/experiments/src/components/Tile/Tile.Props.ts
+++ b/packages/experiments/src/components/Tile/Tile.Props.ts
@@ -1,7 +1,7 @@
 
 import * as React from 'react';
 import { IBaseProps } from 'office-ui-fabric-react/lib/Utilities';
-import { Selection } from 'office-ui-fabric-react/lib/utilities/selection/Selection';
+import { Selection } from 'office-ui-fabric-react/lib/Selection';
 
 export interface ITileProps extends IBaseProps, React.AllHTMLAttributes<HTMLSpanElement | HTMLAnchorElement> {
   /**
diff --git a/packages/experiments/src/components/Tile/Tile.tsx b/packages/experiments/src/components/Tile/Tile.tsx
index e5181f830515e..8be050d0b6a91 100644
--- a/packages/experiments/src/components/Tile/Tile.tsx
+++ b/packages/experiments/src/components/Tile/Tile.tsx
@@ -2,7 +2,7 @@
 import * as React from 'react';
 import { ITileProps } from './Tile.Props';
 import { Check } from 'office-ui-fabric-react/lib/Check';
-import { SELECTION_CHANGE } from 'office-ui-fabric-react/lib/utilities/selection/index';
+import { SELECTION_CHANGE } from 'office-ui-fabric-react/lib/Selection';
 import { css, BaseComponent, autobind, getId } from 'office-ui-fabric-react/lib/Utilities';
 import * as TileStylesModule from './Tile.scss';
 import * as SignalStylesModule from '../signals/Signals.scss';

From 5808e5fe6af1798d80e3a4c0fef6b08bc8b693fe Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Mon, 28 Aug 2017 18:12:05 -0700
Subject: [PATCH 0518/1641] Utilities: Rename removeElement (#2649)

* Rename removeElement

* Rush change
---
 .../rename-removeElement_2017-08-28-16-30.json       | 11 +++++++++++
 packages/utilities/src/array.test.ts                 | 12 ++++++------
 packages/utilities/src/array.ts                      |  2 +-
 3 files changed, 18 insertions(+), 7 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/rename-removeElement_2017-08-28-16-30.json

diff --git a/common/changes/@uifabric/utilities/rename-removeElement_2017-08-28-16-30.json b/common/changes/@uifabric/utilities/rename-removeElement_2017-08-28-16-30.json
new file mode 100644
index 0000000000000..f9f9c0aeb70c2
--- /dev/null
+++ b/common/changes/@uifabric/utilities/rename-removeElement_2017-08-28-16-30.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Array: rename removeElement to removeIndex",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/src/array.test.ts b/packages/utilities/src/array.test.ts
index ecbfb861fd947..582f0d0ff482a 100644
--- a/packages/utilities/src/array.test.ts
+++ b/packages/utilities/src/array.test.ts
@@ -1,4 +1,4 @@
-import { findIndex, find, createArray, removeElement } from './array';
+import { findIndex, find, createArray, removeIndex } from './array';
 let { expect } = chai;
 
 describe('array utils tests', () => {
@@ -56,28 +56,28 @@ describe('array utils tests', () => {
     });
   });
 
-  describe('removeElement tests', () => {
+  describe('removeIndex tests', () => {
     it('should return a new array instead of mutating the existing array', () => {
       const array = [0, 1, 2];
-      const result = removeElement(array, 0);
+      const result = removeIndex(array, 0);
       expect(result).to.not.equal(array);
     });
 
     it('should remove the first element of the array', () => {
       const array = [0, 1, 2];
-      const result = removeElement(array, 0);
+      const result = removeIndex(array, 0);
       expect(result).to.deep.equal([1, 2]);
     });
 
     it('should remove the last element of the array', () => {
       const array = [0, 1, 2];
-      const result = removeElement(array, 2);
+      const result = removeIndex(array, 2);
       expect(result).to.deep.equal([0, 1]);
     });
 
     it('should remove the element in the middle of the array', () => {
       const array = [0, 1, 2];
-      const result = removeElement(array, 1);
+      const result = removeIndex(array, 1);
       expect(result).to.deep.equal([0, 2]);
     });
   });
diff --git a/packages/utilities/src/array.ts b/packages/utilities/src/array.ts
index d13f51ecd84e0..50de8178a0157 100644
--- a/packages/utilities/src/array.ts
+++ b/packages/utilities/src/array.ts
@@ -76,6 +76,6 @@ export function toMatrix<T>(items: T[], columnCount: number): T[][] {
  * @param array - The array to operate on
  * @param index - The index of the element to remove
  */
-export function removeElement<T>(array: T[], index: number): T[] {
+export function removeIndex<T>(array: T[], index: number): T[] {
   return array.filter((_, i) => index !== i);
 }
\ No newline at end of file

From 6e12534ed922a1ea60cca8e1d5941ddcf56a5580 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Mon, 28 Aug 2017 18:13:22 -0700
Subject: [PATCH 0519/1641] Re-enable tslint rule no-any and fix uses of any in
 example-app-base (#2622)

* Re-enable tslint rule no-any and fix uses of any in ex-app-base

* Change children type in IExampleCardProps

* Remove more 'any' types

* Add type for component in IAppLink
---
 .../example-app-base/src/components/App/App.tsx |  5 +++--
 .../src/components/ExampleCard/ExampleCard.tsx  |  2 +-
 .../PropertiesTable/PropertiesTable.tsx         | 10 ++++++++--
 .../PropertiesTable/PropertiesTableSet.tsx      |  2 +-
 .../src/utilities/createApp.tsx                 |  4 ++--
 packages/example-app-base/src/utilities/data.ts | 17 ++++++++++++-----
 .../example-app-base/src/utilities/debugging.ts |  9 ++++++---
 packages/example-app-base/tslint.json           |  5 ++---
 8 files changed, 35 insertions(+), 19 deletions(-)

diff --git a/packages/example-app-base/src/components/App/App.tsx b/packages/example-app-base/src/components/App/App.tsx
index fbc7b83e87934..a7abd3f0d2ecc 100644
--- a/packages/example-app-base/src/components/App/App.tsx
+++ b/packages/example-app-base/src/components/App/App.tsx
@@ -18,8 +18,9 @@ export enum ExampleStatus {
 }
 
 export interface IAppLink extends INavLink {
+  // tslint:disable-next-line:no-any
   getComponent?: (cb: (obj: any) => void) => any;
-  component?: any;
+  component?: React.ComponentClass | (() => JSX.Element);
 }
 
 export interface IAppLinkGroup extends INavLinkGroup {
@@ -43,7 +44,7 @@ export interface IAppState {
 }
 
 @withResponsiveMode
-export class App extends React.Component<IAppProps, any> {
+export class App extends React.Component<IAppProps, IAppState> {
 
   constructor(props: IAppProps) {
     super(props);
diff --git a/packages/example-app-base/src/components/ExampleCard/ExampleCard.tsx b/packages/example-app-base/src/components/ExampleCard/ExampleCard.tsx
index 4b9534774e093..11bfff1e82c09 100644
--- a/packages/example-app-base/src/components/ExampleCard/ExampleCard.tsx
+++ b/packages/example-app-base/src/components/ExampleCard/ExampleCard.tsx
@@ -8,7 +8,7 @@ export interface IExampleCardProps {
   title: string;
   isOptIn?: boolean;
   code?: string;
-  children?: any;
+  children?: React.ReactNode;
   isRightAligned?: boolean;
   dos?: JSX.Element;
   donts?: JSX.Element;
diff --git a/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx b/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx
index cb33cf27339f2..808c84316294b 100644
--- a/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx
+++ b/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx
@@ -17,6 +17,12 @@ export interface IPropertiesTableProps {
   key?: string;
 }
 
+export interface IProptertiesTableState {
+  properties: IInterfaceProperty[] | IEnumProperty[];
+  isEnum: boolean;
+  groups: IGroup[] | undefined;
+}
+
 const DEFAULT_COLUMNS: IColumn[] = [
   {
     key: 'name',
@@ -79,7 +85,7 @@ const ENUM_COLUMNS: IColumn[] = [
   }
 ];
 
-export class PropertiesTable extends React.Component<IPropertiesTableProps, any> {
+export class PropertiesTable extends React.Component<IPropertiesTableProps, IProptertiesTableState> {
   public static defaultProps: Partial<IPropertiesTableProps> = {
     title: 'Properties'
   };
@@ -97,7 +103,7 @@ export class PropertiesTable extends React.Component<IPropertiesTableProps, any>
       ))
       .map((prop: IInterfaceProperty, index: number) => assign({}, prop, { key: index }));
 
-    let groups: IGroup[] | null = null;
+    let groups: IGroup[] | undefined = undefined;
 
     if (!props.renderAsEnum) {
       groups = this._getGroups(properties);
diff --git a/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.tsx b/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.tsx
index 4ded64868cdee..b17257086c236 100644
--- a/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.tsx
+++ b/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.tsx
@@ -12,7 +12,7 @@ export class PropertiesTableSet extends React.Component<IPropertiesTableSetProps
   constructor(props: IPropertiesTableSetProps) {
     super(props);
     let { componentName, componentPath, sources } = props;
-    let src: any;
+    let src: string;
     let properties: IProperty[] = [];
 
     if (sources) {
diff --git a/packages/example-app-base/src/utilities/createApp.tsx b/packages/example-app-base/src/utilities/createApp.tsx
index 2dc7cf7c45952..076c9473649d8 100644
--- a/packages/example-app-base/src/utilities/createApp.tsx
+++ b/packages/example-app-base/src/utilities/createApp.tsx
@@ -62,7 +62,7 @@ export function createApp(
           <Route key='minimal' path='?minimal' component={ _getComponent }>
             { routes }
           </Route>
-          <Route key={ 'app' } component={ (props: any) => <App appDefinition={ appDefinition } { ...props } /> }>
+          <Route key={ 'app' } component={ (props: {}) => <App appDefinition={ appDefinition } { ...props } /> }>
             { routes }
           </Route>
         </Router>
@@ -89,7 +89,7 @@ export function createApp(
   window.onunload = _onUnload;
 }
 
-function _getComponent(props: any): JSX.Element {
+function _getComponent<TProps extends React.Props<{}>>(props: TProps): JSX.Element {
   return (
     <div { ...props } />
   );
diff --git a/packages/example-app-base/src/utilities/data.ts b/packages/example-app-base/src/utilities/data.ts
index b6298a737b206..ad7ae546556fb 100644
--- a/packages/example-app-base/src/utilities/data.ts
+++ b/packages/example-app-base/src/utilities/data.ts
@@ -1,3 +1,5 @@
+import { IGroup } from 'office-ui-fabric-react/lib/DetailsList';
+
 const LOREM_IPSUM = ('Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut ' +
   'labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut ' +
   'aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore ' +
@@ -10,8 +12,9 @@ const DATA = {
   'location': ['Seattle', 'New York', 'Chicago', 'Los Angeles', 'Portland']
 };
 
+// tslint:disable-next-line:no-any
 export function createListItems(count: number, startIndex: number = 0): any {
-  return Array.apply(null, Array(count)).map((item: any, index: number) => {
+  return Array.apply(null, Array(count)).map((item: number, index: number) => {
     let size = 150 + Math.round(Math.random() * 100);
 
     return {
@@ -29,13 +32,17 @@ export function createListItems(count: number, startIndex: number = 0): any {
 }
 
 export function createGroups(
-  groupCount: number, groupDepth: number, startIndex: number,
-  itemsPerGroup: number, level: number = 0, key: string = ''): any {
+  groupCount: number,
+  groupDepth: number,
+  startIndex: number,
+  itemsPerGroup: number,
+  level: number = 0,
+  key: string = ''): IGroup[] {
   if (key !== '') {
     key = key + '-';
   }
   let count = Math.pow(itemsPerGroup, groupDepth);
-  return Array.apply(null, Array(groupCount)).map((value: any, index: number) => {
+  return Array.apply(null, Array(groupCount)).map((value: number, index: number) => {
     return {
       count: count,
       key: 'group' + key + index,
@@ -51,7 +58,7 @@ export function createGroups(
 
 export function lorem(wordCount: number): string {
   return Array.apply(null, Array(wordCount))
-    .map((item: any) => _randWord(LOREM_IPSUM))
+    .map((item: number) => _randWord(LOREM_IPSUM))
     .join(' ');
 }
 
diff --git a/packages/example-app-base/src/utilities/debugging.ts b/packages/example-app-base/src/utilities/debugging.ts
index 424eb58242de7..0fdf68c2c66e0 100644
--- a/packages/example-app-base/src/utilities/debugging.ts
+++ b/packages/example-app-base/src/utilities/debugging.ts
@@ -1,8 +1,10 @@
 import { beep } from './beep';
 
+// tslint:disable-next-line:no-any
 export function instrumentMethod(target: any, methodName: string): void {
   const originalMethod = target[methodName];
 
+  // tslint:disable-next-line:no-any
   target[methodName] = function (): any {
     beep();
 
@@ -29,9 +31,10 @@ export function getStackTrace(): string {
     stack: ''
   };
 
-  /* tslint:disable:no-string-literal */
-  const captureStackTrace = (Error as any)['captureStackTrace'];
-  /* tslint:enable:no-string-literal */
+  const captureStackTrace = (Error as {
+    captureStackTrace?: (obj: { stack: string; },
+      getStackTrace: () => {}) => void;
+  }).captureStackTrace;
 
   if (captureStackTrace) {
     captureStackTrace(obj, getStackTrace);
diff --git a/packages/example-app-base/tslint.json b/packages/example-app-base/tslint.json
index 6a187c7d20621..a553ae5f145b3 100644
--- a/packages/example-app-base/tslint.json
+++ b/packages/example-app-base/tslint.json
@@ -4,7 +4,6 @@
   ],
   "rules": {
     "jsx-no-multiline-js": false,
-    "jsx-no-lambda": false,
-    "no-any": false
+    "jsx-no-lambda": false
   }
-}
+}
\ No newline at end of file

From 5a1d787d64a053d6ab882c2b6cadfa3c56b8005b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pablo=20N=C3=BA=C3=B1ez?= <pablonete@gmail.com>
Date: Tue, 29 Aug 2017 03:16:19 +0200
Subject: [PATCH 0520/1641] FocusZone: update previous element tab-index on
 mouse down (#2561)

* Disable tabIndex of previous element when focusing with mouse #2520

Otherwise many elements could have tabIndex 0 at the same time, which is an inconsistency that impacts our ability to style the current element.

* Add change details.

* Remove debugging leftover.

* Fix private method name.

* Write tests for mouseDown. Call focus() on mouseDown to trigger the onFocus prop.
---
 ...cTabIndexOnMouseDown_2017-08-21-16-25.json | 11 ++++
 .../components/FocusZone/FocusZone.test.tsx   | 65 ++++++++++++++++++-
 .../src/components/FocusZone/FocusZone.tsx    | 49 +++++++-------
 3 files changed, 100 insertions(+), 25 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/focusZone-syncTabIndexOnMouseDown_2017-08-21-16-25.json

diff --git a/common/changes/office-ui-fabric-react/focusZone-syncTabIndexOnMouseDown_2017-08-21-16-25.json b/common/changes/office-ui-fabric-react/focusZone-syncTabIndexOnMouseDown_2017-08-21-16-25.json
new file mode 100644
index 0000000000000..0f0c1e463e9b8
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/focusZone-syncTabIndexOnMouseDown_2017-08-21-16-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "FocusZone: disable tabIndex of previous element on mouse focus.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-panu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
index 3a56238f85fde..5bc8c6d1b3ae7 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
@@ -590,7 +590,7 @@ describe('FocusZone', () => {
     assert(lastFocusedElement === divB, 'pressing left did not skip back to divB');
   });
 
-  it('Focus first tabbable element, when active elemet is dynamically disabled', () => {
+  it('Focus first tabbable element, when active element is dynamically disabled', () => {
     let focusZone: FocusZone | null = null;
     let buttonA: any;
     let buttonB: any;
@@ -606,7 +606,6 @@ describe('FocusZone', () => {
 
     const rootNode = ReactDOM.findDOMNode(component as React.ReactInstance) as Element;
     const textArea = rootNode.children[0];
-    const focusZoneElement = rootNode.children[1];
 
     setupElement(buttonA, {
       clientRect: {
@@ -640,4 +639,66 @@ describe('FocusZone', () => {
     focusZone!.focus();
     assert(lastFocusedElement === buttonB, 'buttonB was not focused ');
   });
+
+  it('removes tab-index of previous element when another one is selected (mouse & keyboard)', () => {
+    let focusZone: FocusZone | null = null;
+    let buttonA: HTMLButtonElement | null = null;
+    let buttonB: HTMLButtonElement | null = null;
+    const component = ReactTestUtils.renderIntoDocument(
+      <div { ...{ onFocusCapture: _onFocus } }>
+        <FocusZone ref={ (focus) => { focusZone = focus; } }>
+          <button className='a' ref={ (button) => { buttonA = button; } }>a</button>
+          <button className='b' ref={ (button) => { buttonB = button; } }>b</button>
+        </FocusZone>
+      </div>
+    );
+
+    const focusZoneElement = ReactDOM.findDOMNode(component as React.ReactInstance).firstChild as Element;
+    const buttonAElement = focusZoneElement.querySelector('.a') as HTMLElement;
+
+    // HACK declare that elements are not null at this point.
+    // Type narrowing doesn't work because TypeScript is not considering the assignments inside `ref` lambdas.
+    focusZone = focusZone!;
+    buttonA = buttonA!;
+    buttonB = buttonB!;
+
+    setupElement(buttonA, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 0,
+        right: 20
+      }
+    });
+
+    setupElement(buttonB, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 20,
+        right: 40
+      }
+    });
+
+    // ButtonA should be focussed.
+    focusZone.focus();
+    assert(lastFocusedElement === buttonA, 'buttonA was not focused after initial focus');
+
+    assert(buttonA.tabIndex === 0, 'buttonA tab-index was not on after initial focus');
+    assert(buttonB.tabIndex === -1, 'buttonB tab-index was not off after initial focus');
+
+    // Pressing right should go to b.
+    ReactTestUtils.Simulate.keyDown(focusZoneElement, { which: KeyCodes.right });
+    assert(lastFocusedElement === buttonB, 'buttonB was not focused after key down');
+
+    assert(buttonA.tabIndex === -1, 'buttonA tab-index was not off after key down');
+    assert(buttonB.tabIndex === 0, 'buttonB tab-index was not on after key down');
+
+    // Clicking on A should enable its tab-index and disable others.
+    ReactTestUtils.Simulate.mouseDown(buttonAElement);
+    assert(lastFocusedElement === buttonA, 'buttonA was not focused after mouse down');
+
+    assert(buttonA.tabIndex === 0, 'buttonA tab-index was not on after mouse down');
+    assert(buttonB.tabIndex === -1, 'buttonB tab-index was not off after mouse down');
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 95e83f5fa6d96..14346d699a2a5 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -174,28 +174,9 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     }
 
     if (element) {
-      const previousActiveElement = this._activeElement;
+      this._setActiveElement(element);
 
-      this._activeElement = element;
-
-      if (previousActiveElement) {
-        if (isElementFocusZone(previousActiveElement)) {
-          this._updateTabIndexes(previousActiveElement);
-        }
-
-        previousActiveElement.tabIndex = -1;
-      }
-
-      if (element) {
-        if (!this._focusAlignment) {
-          this._setFocusAlignment(element, true, true);
-        }
-
-        this._activeElement.tabIndex = 0;
-        element.focus();
-
-        return true;
-      }
+      return true;
     }
 
     return false;
@@ -253,8 +234,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       target = path.pop() as HTMLElement;
 
       if (target && isElementTabbable(target)) {
-        target.tabIndex = 0;
-        this._setFocusAlignment(target, true, true);
+        this._setActiveElement(target);
       }
 
       if (isElementFocusZone(target)) {
@@ -264,6 +244,29 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     }
   }
 
+  private _setActiveElement(element: HTMLElement): void {
+    const previousActiveElement = this._activeElement;
+
+    this._activeElement = element;
+
+    if (previousActiveElement) {
+      if (isElementFocusZone(previousActiveElement)) {
+        this._updateTabIndexes(previousActiveElement);
+      }
+
+      previousActiveElement.tabIndex = -1;
+    }
+
+    if (this._activeElement) {
+      if (!this._focusAlignment) {
+        this._setFocusAlignment(element, true, true);
+      }
+
+      this._activeElement.tabIndex = 0;
+      this._activeElement.focus();
+    }
+  }
+
   /**
    * Handle the keystrokes.
    */

From b9a25a16428e2ca8e0805e00f7a0839907cbcdf0 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 29 Aug 2017 03:20:56 -0700
Subject: [PATCH 0521/1641] Applying package updates.

---
 .../tile-selection_2017-08-28-23-06.json      | 11 -------
 ...ming-add-accentcolor_2017-08-28-23-41.json | 11 -------
 ...rename-removeElement_2017-08-28-16-30.json | 11 -------
 ...cTabIndexOnMouseDown_2017-08-21-16-25.json | 11 -------
 .../selection-key_2017-08-28-19-11.json       | 11 -------
 ...alogCloseButtonLogic_2017-08-28-15-52.json | 11 -------
 packages/example-app-base/package.json        |  4 +--
 packages/experiments/CHANGELOG.json           | 19 +++++++++++
 packages/experiments/CHANGELOG.md             |  9 +++++-
 packages/experiments/package.json             |  4 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 32 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 11 ++++++-
 packages/office-ui-fabric-react/package.json  |  6 ++--
 packages/styling/CHANGELOG.json               | 19 +++++++++++
 packages/styling/CHANGELOG.md                 |  9 +++++-
 packages/styling/package.json                 |  4 +--
 packages/utilities/CHANGELOG.json             | 14 ++++++++
 packages/utilities/CHANGELOG.md               |  9 +++++-
 packages/utilities/package.json               |  2 +-
 19 files changed, 128 insertions(+), 80 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/tile-selection_2017-08-28-23-06.json
 delete mode 100644 common/changes/@uifabric/styling/theming-add-accentcolor_2017-08-28-23-41.json
 delete mode 100644 common/changes/@uifabric/utilities/rename-removeElement_2017-08-28-16-30.json
 delete mode 100644 common/changes/office-ui-fabric-react/focusZone-syncTabIndexOnMouseDown_2017-08-21-16-25.json
 delete mode 100644 common/changes/office-ui-fabric-react/selection-key_2017-08-28-19-11.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-davwolf-fixDialogCloseButtonLogic_2017-08-28-15-52.json

diff --git a/common/changes/@uifabric/experiments/tile-selection_2017-08-28-23-06.json b/common/changes/@uifabric/experiments/tile-selection_2017-08-28-23-06.json
deleted file mode 100644
index ed182eeb98f6a..0000000000000
--- a/common/changes/@uifabric/experiments/tile-selection_2017-08-28-23-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Fix Selection module reference in Tile modules",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/theming-add-accentcolor_2017-08-28-23-41.json b/common/changes/@uifabric/styling/theming-add-accentcolor_2017-08-28-23-41.json
deleted file mode 100644
index f00d973bf3e9b..0000000000000
--- a/common/changes/@uifabric/styling/theming-add-accentcolor_2017-08-28-23-41.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Theming: added an accent color slot",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/rename-removeElement_2017-08-28-16-30.json b/common/changes/@uifabric/utilities/rename-removeElement_2017-08-28-16-30.json
deleted file mode 100644
index f9f9c0aeb70c2..0000000000000
--- a/common/changes/@uifabric/utilities/rename-removeElement_2017-08-28-16-30.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Array: rename removeElement to removeIndex",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/focusZone-syncTabIndexOnMouseDown_2017-08-21-16-25.json b/common/changes/office-ui-fabric-react/focusZone-syncTabIndexOnMouseDown_2017-08-21-16-25.json
deleted file mode 100644
index 0f0c1e463e9b8..0000000000000
--- a/common/changes/office-ui-fabric-react/focusZone-syncTabIndexOnMouseDown_2017-08-21-16-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "FocusZone: disable tabIndex of previous element on mouse focus.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-panu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/selection-key_2017-08-28-19-11.json b/common/changes/office-ui-fabric-react/selection-key_2017-08-28-19-11.json
deleted file mode 100644
index ef7eab04f6197..0000000000000
--- a/common/changes/office-ui-fabric-react/selection-key_2017-08-28-19-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Selection: Adding better handling around a case where getKey returns null or undefined.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "tmichon@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/users-davwolf-fixDialogCloseButtonLogic_2017-08-28-15-52.json b/common/changes/office-ui-fabric-react/users-davwolf-fixDialogCloseButtonLogic_2017-08-28-15-52.json
deleted file mode 100644
index 09f201986ce4a..0000000000000
--- a/common/changes/office-ui-fabric-react/users-davwolf-fixDialogCloseButtonLogic_2017-08-28-15-52.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dialog: Show close button when dialog type is DialogType.close",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "davwolf@microsoft.com"
-}
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index da1020f9cfbbd..ef1721199be98 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -47,8 +47,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.20.2 <1.0.0",
-    "@uifabric/utilities": ">=4.10.3 <5.0.0",
+    "@uifabric/styling": ">=0.21.0 <1.0.0",
+    "@uifabric/utilities": ">=4.11.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.4.0 <5.0.0",
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index c245dae059792..265b5b90c7979 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "0.2.1",
+      "tag": "@uifabric/experiments_v0.2.1",
+      "date": "Tue, 29 Aug 2017 10:20:56 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "9d4818a42955c9517b5b64c0e4d4ea2bab4c05ad",
+            "comment": "Fix Selection module reference in Tile modules"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `4.37.5` to `4.37.6`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.2.0",
       "tag": "@uifabric/experiments_v0.2.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index fdb1e7920119e..d6f8f1f45ffa4 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Sat, 26 Aug 2017 00:52:38 GMT and should not be manually modified.
+This log was last generated on Tue, 29 Aug 2017 10:20:56 GMT and should not be manually modified.
+
+## 0.2.1
+Tue, 29 Aug 2017 10:20:56 GMT
+
+### Patches
+
+- Fix Selection module reference in Tile modules
 
 ## 0.2.0
 Sat, 26 Aug 2017 00:52:38 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 1fc6834734f8e..d73266cd2cdf0 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -64,7 +64,7 @@
     "webpack-notifier": "^1.5.0"
   },
   "dependencies": {
-    "office-ui-fabric-react": "4.37.5"
+    "office-ui-fabric-react": "4.37.6"
   },
   "peerDependencies": {
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index ad9ae8ca469ef..c05fade54466c 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,38 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.37.6",
+      "tag": "office-ui-fabric-react_v4.37.6",
+      "date": "Tue, 29 Aug 2017 10:20:56 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Pablo Núñez <pablonete@gmail.com>",
+            "commit": "5a1d787d64a053d6ab882c2b6cadfa3c56b8005b",
+            "comment": "FocusZone: disable tabIndex of previous element on mouse focus."
+          },
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "1bfc50eb3e4f3a47c38e705a5484b643f35f3bce",
+            "comment": "Selection: Adding better handling around a case where getKey returns null or undefined."
+          },
+          {
+            "author": "David Wolf <lupine86@users.noreply.github.com>",
+            "commit": "42a8dbcf9c3715d41f1393ec98642de1f73e67a9",
+            "comment": "Dialog: Show close button when dialog type is DialogType.close"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.10.3 <5.0.0` to `>=4.11.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.20.2 <1.0.0` to `>=0.21.0 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.37.5",
       "tag": "office-ui-fabric-react_v4.37.5",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index f6faf126ada7c..6cfd64e867e84 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,15 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Sat, 26 Aug 2017 00:52:38 GMT and should not be manually modified.
+This log was last generated on Tue, 29 Aug 2017 10:20:56 GMT and should not be manually modified.
+
+## 4.37.6
+Tue, 29 Aug 2017 10:20:56 GMT
+
+### Patches
+
+- FocusZone: disable tabIndex of previous element on mouse focus.
+- Selection: Adding better handling around a case where getKey returns null or undefined.
+- Dialog: Show close button when dialog type is DialogType.close
 
 ## 4.37.5
 Sat, 26 Aug 2017 00:52:38 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index da7fcb622374e..cd8388e2e65ba 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.37.5",
+  "version": "4.37.6",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -70,8 +70,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
-    "@uifabric/utilities": ">=4.10.3 <5.0.0",
-    "@uifabric/styling": ">=0.20.2 <1.0.0",
+    "@uifabric/utilities": ">=4.11.0 <5.0.0",
+    "@uifabric/styling": ">=0.21.0 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 42591d20aa958..6372b3c21101a 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.21.0",
+      "tag": "@uifabric/styling_v0.21.0",
+      "date": "Tue, 29 Aug 2017 10:20:56 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "e9a99a34b2950f779b13b4299e2d495265872b52",
+            "comment": "Theming: added an accent color slot"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.10.3 <5.0.0` to `>=4.11.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.20.2",
       "tag": "@uifabric/styling_v0.20.2",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 2987481c27dda..79966f8929fd3 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 25 Aug 2017 20:31:51 GMT and should not be manually modified.
+This log was last generated on Tue, 29 Aug 2017 10:20:56 GMT and should not be manually modified.
+
+## 0.21.0
+Tue, 29 Aug 2017 10:20:56 GMT
+
+### Minor changes
+
+- Theming: added an accent color slot
 
 ## 0.20.2
 Fri, 25 Aug 2017 20:31:51 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 0f8b23d4682f2..b702a386279c3 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.20.2",
+  "version": "0.21.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
-    "@uifabric/utilities": ">=4.10.3 <5.0.0",
+    "@uifabric/utilities": ">=4.11.0 <5.0.0",
     "tslib": "^1.6.0",
     "rtl-css-js": "^1.1.1",
     "glamor": "^2.20.24"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 347b8f7c0f84c..b3fa5579bc900 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.11.0",
+      "tag": "@uifabric/utilities_v4.11.0",
+      "date": "Tue, 29 Aug 2017 10:20:56 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "5808e5fe6af1798d80e3a4c0fef6b08bc8b693fe",
+            "comment": "Array: rename removeElement to removeIndex"
+          }
+        ]
+      }
+    },
     {
       "version": "4.10.3",
       "tag": "@uifabric/utilities_v4.10.3",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index f5fa96e9e642d..7a894c6ac114a 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Mon, 28 Aug 2017 10:09:32 GMT and should not be manually modified.
+This log was last generated on Tue, 29 Aug 2017 10:20:56 GMT and should not be manually modified.
+
+## 4.11.0
+Tue, 29 Aug 2017 10:20:56 GMT
+
+### Minor changes
+
+- Array: rename removeElement to removeIndex
 
 ## 4.10.3
 Mon, 28 Aug 2017 10:09:32 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index b53860470e837..852eecc5fa3d8 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.10.3",
+  "version": "4.11.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From f5b0c87005e04ebae9f29f0a6b84692550ff83de Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Tue, 29 Aug 2017 11:43:07 -0700
Subject: [PATCH 0522/1641] Add a FolderCover component to experiments (#2642)

* Add FolderCover component

* Add additional gulp tasks to @uifabric/experiments

* Add FolderCover example page

* Add Folder example for Tile

* Update change output

* Address PR feedback and fix prop field names
---
 .../folder-cover_2017-08-25-23-08.json        | 11 +++
 packages/experiments/gulpfile.js              |  2 +
 packages/experiments/src/FolderCover.ts       |  2 +
 .../FolderCover/FolderCover.Props.ts          | 18 ++++
 .../components/FolderCover/FolderCover.scss   | 85 ++++++++++++++++++
 .../components/FolderCover/FolderCover.tsx    | 87 +++++++++++++++++++
 .../FolderCover/FolderCoverPage.tsx           | 57 ++++++++++++
 .../examples/FolderCover.Basic.Example.tsx    | 42 +++++++++
 .../src/components/FolderCover/index.ts       |  3 +
 .../src/components/Tile/TilePage.tsx          |  6 ++
 .../Tile/examples/Tile.Folder.Example.tsx     | 80 +++++++++++++++++
 .../experiments/src/demo/AppDefinition.tsx    |  6 ++
 12 files changed, 399 insertions(+)
 create mode 100644 common/changes/@uifabric/experiments/folder-cover_2017-08-25-23-08.json
 create mode 100644 packages/experiments/src/FolderCover.ts
 create mode 100644 packages/experiments/src/components/FolderCover/FolderCover.Props.ts
 create mode 100644 packages/experiments/src/components/FolderCover/FolderCover.scss
 create mode 100644 packages/experiments/src/components/FolderCover/FolderCover.tsx
 create mode 100644 packages/experiments/src/components/FolderCover/FolderCoverPage.tsx
 create mode 100644 packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx
 create mode 100644 packages/experiments/src/components/FolderCover/index.ts
 create mode 100644 packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx

diff --git a/common/changes/@uifabric/experiments/folder-cover_2017-08-25-23-08.json b/common/changes/@uifabric/experiments/folder-cover_2017-08-25-23-08.json
new file mode 100644
index 0000000000000..eb3dc4f7207b8
--- /dev/null
+++ b/common/changes/@uifabric/experiments/folder-cover_2017-08-25-23-08.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Implement FolderCover component",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/gulpfile.js b/packages/experiments/gulpfile.js
index 196c2a4dd3da6..5c782647005cc 100644
--- a/packages/experiments/gulpfile.js
+++ b/packages/experiments/gulpfile.js
@@ -7,6 +7,8 @@ let gulp = require('gulp');
 build.task('webpack', build.webpack);
 build.task('sass', build.sass);
 build.task('karma', build.karma);
+build.task('ts', build.typescript);
+build.task('tslist', build.tslint);
 
 // initialize tasks.
 build.initialize(gulp);
diff --git a/packages/experiments/src/FolderCover.ts b/packages/experiments/src/FolderCover.ts
new file mode 100644
index 0000000000000..4424108cdefde
--- /dev/null
+++ b/packages/experiments/src/FolderCover.ts
@@ -0,0 +1,2 @@
+
+export * from './components/FolderCover';
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.Props.ts b/packages/experiments/src/components/FolderCover/FolderCover.Props.ts
new file mode 100644
index 0000000000000..6bff688f05f93
--- /dev/null
+++ b/packages/experiments/src/components/FolderCover/FolderCover.Props.ts
@@ -0,0 +1,18 @@
+
+import * as React from 'react';
+import { IBaseProps } from 'office-ui-fabric-react/lib/Utilities';
+import { FolderCover } from './FolderCover';
+
+export type FolderCoverSize =
+  'small' |
+  'large';
+
+export type FolderCoverType =
+  'default' |
+  'media';
+
+export interface IFolderCoverProps extends IBaseProps, React.HTMLAttributes<FolderCover> {
+  folderCoverSize?: FolderCoverSize;
+  folderCoverType?: FolderCoverType;
+  metadata?: React.ReactNode[] | React.ReactNode;
+}
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.scss b/packages/experiments/src/components/FolderCover/FolderCover.scss
new file mode 100644
index 0000000000000..875aa12e57c7f
--- /dev/null
+++ b/packages/experiments/src/components/FolderCover/FolderCover.scss
@@ -0,0 +1,85 @@
+
+@import '~office-ui-fabric-react/src/common/common';
+
+.root {
+  display: inline-flex;
+  position: relative;
+  vertical-align: bottom;
+
+  &,
+  &.isSmall {
+    width: 72px;
+    height: 52px;
+  }
+
+  &.isLarge {
+    width: 112px;
+    height: 80px;
+  }
+}
+
+.front {
+  display: block;
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+}
+
+.back {
+  display: block;
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+}
+
+.content {
+  position: absolute;
+  left: 4px;
+  right: 4px;
+  bottom: 4px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  overflow: hidden;
+
+  &,
+  .isSmall & {
+    max-height: 52px - 8px;
+  }
+
+  .isLarge & {
+    max-height: 80px - 8px;
+  }
+}
+
+.metadata {
+  position: absolute;
+  display: block;
+  right: 8px;
+  left: 8px;
+  @include text-align(right);
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  font-weight: $ms-font-weight-regular;
+  color: $ms-color-white;
+
+  &,
+  &.isSmall {
+    font-size: $ms-font-size-s;
+  }
+
+  .isLarge & {
+    font-size: $ms-font-size-m;
+  }
+
+  &,
+  &.isDefault {
+    bottom: 8px;
+  }
+
+  .isMedia & {
+    bottom: 4px;
+  }
+}
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.tsx b/packages/experiments/src/components/FolderCover/FolderCover.tsx
new file mode 100644
index 0000000000000..bb86f116121b4
--- /dev/null
+++ b/packages/experiments/src/components/FolderCover/FolderCover.tsx
@@ -0,0 +1,87 @@
+
+import * as React from 'react';
+import { IFolderCoverProps, FolderCoverSize, FolderCoverType } from './FolderCover.Props';
+import { css } from 'office-ui-fabric-react/lib/Utilities';
+import * as FolderCoverStylesModule from './FolderCover.scss';
+
+// tslint:disable-next-line:no-any
+const FolderCoverStyles = FolderCoverStylesModule as any;
+
+export interface IFolderCoverState {
+  // TODO Add animation support for drag/drop events.
+}
+
+const ASSET_CDN_BASE_URL = 'https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets';
+
+const ASSETS: {
+  [P in FolderCoverSize]: {
+    [T in FolderCoverType]: {
+      back: string;
+      front: string;
+    };
+  };
+} = {
+    small: {
+      default: {
+        back: `${ASSET_CDN_BASE_URL}/foldericons/s-ldefaultback.png`,
+        front: `${ASSET_CDN_BASE_URL}/foldericons/s-ldefaultfront.png`
+      },
+      media: {
+        back: `${ASSET_CDN_BASE_URL}/foldericons/s-lphotoback.png`,
+        front: `${ASSET_CDN_BASE_URL}/foldericons/s-lphotosfront.png`
+      }
+    },
+    large: {
+      default: {
+        back: `${ASSET_CDN_BASE_URL}/foldericons/xxxxl-xldefaultback.png`,
+        front: `${ASSET_CDN_BASE_URL}/foldericons/xxxxl-xldefaultfront.png`
+      },
+      media: {
+        back: `${ASSET_CDN_BASE_URL}/foldericons/xxxxl-xlphotoback.png`,
+        front: `${ASSET_CDN_BASE_URL}/foldericons/xxxxl-xlphotofront.png`
+      }
+    }
+  };
+
+export class FolderCover extends React.Component<IFolderCoverProps, IFolderCoverState> {
+  public render(): JSX.Element | null {
+    const {
+      folderCoverSize: size = 'large',
+      folderCoverType: type = 'default'
+    } = this.props;
+
+    const assets = ASSETS[size][type];
+
+    return (
+      <div
+        className={ css(FolderCoverStyles.root, {
+          [FolderCoverStyles.isSmall]: size === 'small',
+          [FolderCoverStyles.isLarge]: size === 'large',
+          [FolderCoverStyles.isDefault]: type === 'default',
+          [FolderCoverStyles.isMedia]: type === 'media'
+        }) }
+      >
+        <img
+          className={ css(FolderCoverStyles.back) }
+          src={ assets.back }
+        />
+        <span className={ css(FolderCoverStyles.content) }>
+          { this.props.children }
+        </span>
+        <img
+          className={ css(FolderCoverStyles.front) }
+          src={ assets.front }
+        />
+        {
+          this.props.metadata ?
+            (
+              <span className={ css(FolderCoverStyles.metadata) }>
+                { this.props.metadata }
+              </span>
+            ) :
+            null
+        }
+      </div>
+    );
+  }
+}
diff --git a/packages/experiments/src/components/FolderCover/FolderCoverPage.tsx b/packages/experiments/src/components/FolderCover/FolderCoverPage.tsx
new file mode 100644
index 0000000000000..383fb75c75b89
--- /dev/null
+++ b/packages/experiments/src/components/FolderCover/FolderCoverPage.tsx
@@ -0,0 +1,57 @@
+import * as React from 'react';
+import {
+  ExampleCard,
+  IComponentDemoPageProps,
+  ComponentPage,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+
+import { FolderCoverBasicExample } from './examples/FolderCover.Basic.Example';
+const FolderCoverBasicExampleCode =
+  require('!raw-loader!experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx') as string;
+
+export class FolderCoverPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render(): JSX.Element {
+    return (
+      <ComponentPage
+        title='FolderCover'
+        componentName='FolderCover'
+        exampleCards={
+          <div>
+            <ExampleCard title='Folder Cover' isOptIn={ true } code={ FolderCoverBasicExampleCode }>
+              <FolderCoverBasicExample />
+            </ExampleCard>
+          </div>
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!experiments/src/components/FolderCover/FolderCover.Props.ts')
+            ] }
+          />
+        }
+        overview={
+          <div />
+        }
+        bestPractices={
+          <div />
+        }
+        dos={
+          <div>
+            <ul>
+              <li>Use them to represent a folder which may contain visual content.</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul>
+              <li>To represent the concept of a folder as opposed to an actual folder item.</li>
+            </ul>
+          </div>
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }
+      />
+    );
+  }
+}
diff --git a/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx b/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx
new file mode 100644
index 0000000000000..d33ec98e044ed
--- /dev/null
+++ b/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx
@@ -0,0 +1,42 @@
+
+import * as React from 'react';
+import { FolderCover } from '../FolderCover';
+
+export class FolderCoverBasicExample extends React.Component<{}, {}> {
+  public render(): JSX.Element {
+    return (
+      <div>
+        <h3>Large Default Cover</h3>
+        <FolderCover
+          folderCoverSize='large'
+          metadata={ 20 }
+        >
+          <img src='//placehold.it/104x72' />
+        </FolderCover>
+        <h3>Small Default Cover</h3>
+        <FolderCover
+          folderCoverSize='small'
+          metadata={ 15 }
+        >
+          <img src='//placehold.it/64x44' />
+        </FolderCover>
+        <h3>Large Media Cover</h3>
+        <FolderCover
+          folderCoverSize='large'
+          folderCoverType='media'
+          metadata={ 20 }
+        >
+          <img src='//placehold.it/104x72' />
+        </FolderCover>
+        <h3>Small Media Cover</h3>
+        <FolderCover
+          folderCoverSize='small'
+          folderCoverType='media'
+          metadata={ 15 }
+        >
+          <img src='//placehold.it/64x44' />
+        </FolderCover>
+      </div>
+    );
+  }
+}
diff --git a/packages/experiments/src/components/FolderCover/index.ts b/packages/experiments/src/components/FolderCover/index.ts
new file mode 100644
index 0000000000000..7fc454510d944
--- /dev/null
+++ b/packages/experiments/src/components/FolderCover/index.ts
@@ -0,0 +1,3 @@
+
+export * from './FolderCover.Props';
+export * from './FolderCover';
diff --git a/packages/experiments/src/components/Tile/TilePage.tsx b/packages/experiments/src/components/Tile/TilePage.tsx
index 13523b143cc4a..d939c1d3bfaf0 100644
--- a/packages/experiments/src/components/Tile/TilePage.tsx
+++ b/packages/experiments/src/components/Tile/TilePage.tsx
@@ -6,6 +6,9 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 
+import { TileFolderExample } from './examples/Tile.Folder.Example';
+const TileFolderExampleCode = require('!raw-loader!experiments/src/components/Tile/examples/Tile.Folder.Example.tsx') as string;
+
 import { TileMediaExample } from './examples/Tile.Media.Example';
 const TileMediaExampleCode = require('!raw-loader!experiments/src/components/Tile/examples/Tile.Media.Example.tsx') as string;
 
@@ -20,6 +23,9 @@ export class TilePage extends React.Component<IComponentDemoPageProps, {}> {
         componentName='Tile'
         exampleCards={
           <div>
+            <ExampleCard title='Folder Tile' isOptIn={ true } code={ TileFolderExampleCode }>
+              <TileFolderExample />
+            </ExampleCard>
             <ExampleCard title='Document Tile' isOptIn={ true } code={ TileDocumentExampleCode }>
               <TileDocumentExample />
             </ExampleCard>
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
new file mode 100644
index 0000000000000..7acb612bf8a04
--- /dev/null
+++ b/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
@@ -0,0 +1,80 @@
+
+import * as React from 'react';
+import { Tile } from '../Tile';
+import { css } from 'office-ui-fabric-react/lib/Utilities';
+import {
+  SignalField,
+  NewSignal,
+  CommentsSignal,
+  TrendingSignal
+} from '../../signals/Signals';
+import { FolderCover } from '../../FolderCover/FolderCover';
+import { lorem } from '@uifabric/example-app-base';
+import * as TileExampleStylesModule from './Tile.Example.scss';
+
+// tslint:disable-next-line:no-any
+const TileExampleStyles = TileExampleStylesModule as any;
+
+export class TileFolderExample extends React.Component<{}, {}> {
+  public render(): JSX.Element {
+    return (
+      <div>
+        <h3>Folder</h3>
+        <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
+          <Tile
+            itemName={
+              <SignalField
+                before={
+                  <NewSignal />
+                }
+              >
+                { lorem(2) }
+              </SignalField>
+            }
+            itemActivity={
+              <SignalField
+                before={
+                  <CommentsSignal>{ '12' }</CommentsSignal>
+                }
+              >
+                { lorem(2) }
+              </SignalField>
+            }
+            foreground={
+              <FolderCover />
+            }
+          />
+        </div>
+        <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
+          <Tile
+            itemName={
+              <SignalField
+                before={
+                  <TrendingSignal />
+                }
+              >
+                { lorem(2) }
+              </SignalField>
+            }
+            itemActivity={
+              <SignalField
+                before={
+                  <CommentsSignal>{ '12' }</CommentsSignal>
+                }
+              >
+                { lorem(2) }
+              </SignalField>
+            }
+            foreground={
+              <FolderCover
+                folderCoverType='media'
+              >
+                <img src='//placehold.it/104x72' />
+              </FolderCover>
+            }
+          />
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/packages/experiments/src/demo/AppDefinition.tsx b/packages/experiments/src/demo/AppDefinition.tsx
index d6ff64e33d051..b8c2b1c7189e1 100644
--- a/packages/experiments/src/demo/AppDefinition.tsx
+++ b/packages/experiments/src/demo/AppDefinition.tsx
@@ -16,6 +16,12 @@ export const AppDefinition: IAppDefinition = {
           name: 'CommandBar',
           url: '#/examples/commandbar'
         },
+        {
+          component: require<any>('../components/FolderCover/FolderCoverPage').FolderCoverPage,
+          key: 'FolderCover',
+          name: 'FolderCover',
+          url: '#/examples/foldercover'
+        },
         {
           component: require<any>('../components/Tile/TilePage').TilePage,
           key: 'Tile',

From 8af993abbec24538b5bfebe2322122710b17b316 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 29 Aug 2017 13:29:35 -0700
Subject: [PATCH 0523/1641] Adding sourceRoot back to sourcemaps. (#2667)

* Updating sourcemaps.

* adding change files.
---
 .../sourcemap-tweak_2017-08-29-19-17.json             | 11 +++++++++++
 .../experiments/sourcemap-tweak_2017-08-29-19-17.json | 11 +++++++++++
 .../sourcemap-tweak_2017-08-29-19-17.json             | 11 +++++++++++
 .../styling/sourcemap-tweak_2017-08-29-19-17.json     | 11 +++++++++++
 .../utilities/sourcemap-tweak_2017-08-29-19-17.json   | 11 +++++++++++
 .../sourcemap-tweak_2017-08-29-19-17.json             | 11 +++++++++++
 package.json                                          |  2 +-
 packages/experiments/package.json                     |  4 ++--
 scripts/tasks/ts.js                                   |  6 ++++--
 9 files changed, 73 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/sourcemap-tweak_2017-08-29-19-17.json
 create mode 100644 common/changes/@uifabric/experiments/sourcemap-tweak_2017-08-29-19-17.json
 create mode 100644 common/changes/@uifabric/fabric-website/sourcemap-tweak_2017-08-29-19-17.json
 create mode 100644 common/changes/@uifabric/styling/sourcemap-tweak_2017-08-29-19-17.json
 create mode 100644 common/changes/@uifabric/utilities/sourcemap-tweak_2017-08-29-19-17.json
 create mode 100644 common/changes/office-ui-fabric-react/sourcemap-tweak_2017-08-29-19-17.json

diff --git a/common/changes/@uifabric/example-app-base/sourcemap-tweak_2017-08-29-19-17.json b/common/changes/@uifabric/example-app-base/sourcemap-tweak_2017-08-29-19-17.json
new file mode 100644
index 0000000000000..0a9cdf7789c56
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/sourcemap-tweak_2017-08-29-19-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Adjusted build to produce sourcemaps with correct sourceRoot.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/sourcemap-tweak_2017-08-29-19-17.json b/common/changes/@uifabric/experiments/sourcemap-tweak_2017-08-29-19-17.json
new file mode 100644
index 0000000000000..270324d4eb01b
--- /dev/null
+++ b/common/changes/@uifabric/experiments/sourcemap-tweak_2017-08-29-19-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Adjusted build to produce sourcemaps with correct sourceRoot.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/sourcemap-tweak_2017-08-29-19-17.json b/common/changes/@uifabric/fabric-website/sourcemap-tweak_2017-08-29-19-17.json
new file mode 100644
index 0000000000000..600fadfde2e16
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/sourcemap-tweak_2017-08-29-19-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Adjusted build to produce sourcemaps with correct sourceRoot.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/sourcemap-tweak_2017-08-29-19-17.json b/common/changes/@uifabric/styling/sourcemap-tweak_2017-08-29-19-17.json
new file mode 100644
index 0000000000000..1224d6743dc14
--- /dev/null
+++ b/common/changes/@uifabric/styling/sourcemap-tweak_2017-08-29-19-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Adjusted build to produce sourcemaps with correct sourceRoot.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/sourcemap-tweak_2017-08-29-19-17.json b/common/changes/@uifabric/utilities/sourcemap-tweak_2017-08-29-19-17.json
new file mode 100644
index 0000000000000..36d1c7343f24a
--- /dev/null
+++ b/common/changes/@uifabric/utilities/sourcemap-tweak_2017-08-29-19-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Adjusted build to produce sourcemaps with correct sourceRoot.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/sourcemap-tweak_2017-08-29-19-17.json b/common/changes/office-ui-fabric-react/sourcemap-tweak_2017-08-29-19-17.json
new file mode 100644
index 0000000000000..a4e1b9ea6f118
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/sourcemap-tweak_2017-08-29-19-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Adjusted build to produce sourcemaps with correct sourceRoot.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/package.json b/package.json
index 3c2bdead96b97..a20050805670c 100644
--- a/package.json
+++ b/package.json
@@ -25,4 +25,4 @@
   "devDependencies": {
     "@microsoft/rush": "3.0.12"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index d73266cd2cdf0..6ddea8cda676f 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -15,7 +15,6 @@
     "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.serve.config.js --open"
   },
   "devDependencies": {
-    "@microsoft/load-themed-styles": "^1.5.1",
     "@microsoft/web-library-build": "^3.2.1",
     "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.0",
@@ -64,7 +63,8 @@
     "webpack-notifier": "^1.5.0"
   },
   "dependencies": {
-    "office-ui-fabric-react": "4.37.6"
+    "@microsoft/load-themed-styles": "^1.5.1",
+    "office-ui-fabric-react": ">=4.37.6 <5.0.0"
   },
   "peerDependencies": {
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/scripts/tasks/ts.js b/scripts/tasks/ts.js
index 561df4a5dd791..05cc2c8295405 100644
--- a/scripts/tasks/ts.js
+++ b/scripts/tasks/ts.js
@@ -2,8 +2,10 @@ module.exports = function (options) {
   const path = require('path');
   const execSync = require('../exec-sync');
   const typescriptPath = 'node ' + path.resolve(__dirname, '../node_modules/typescript/lib/tsc');
-  const extraParams = '--pretty' + (options.isProduction ? ' --inlineSources --mapRoot ../src' : '');
-  
+  const libPath = path.resolve(process.cwd(), 'lib');
+  const srcPath = path.resolve(process.cwd(), 'src');
+  const extraParams = '--pretty' + (options.isProduction ? ` --inlineSources --sourceRoot ${path.relative(libPath, srcPath)}` : '');
+
   execSync(typescriptPath + ' -outDir lib -t es5 -m commonjs ' + extraParams);
 
   if (options.isProduction) {

From 10f28f39fa209f5060e640ed836cd923c146e4e1 Mon Sep 17 00:00:00 2001
From: Aniket Handa <atneik@users.noreply.github.com>
Date: Tue, 29 Aug 2017 13:51:45 -0700
Subject: [PATCH 0524/1641] HoverCard: Performance fix for expanding animation
 (#2658)

* Pref fix

* Add rush change

* Nit comment
---
 .../anihan-hover-card-pref-fix_2017-08-28-23-48.json  | 11 +++++++++++
 .../src/components/HoverCard/ExpandingCard.tsx        |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/anihan-hover-card-pref-fix_2017-08-28-23-48.json

diff --git a/common/changes/office-ui-fabric-react/anihan-hover-card-pref-fix_2017-08-28-23-48.json b/common/changes/office-ui-fabric-react/anihan-hover-card-pref-fix_2017-08-28-23-48.json
new file mode 100644
index 0000000000000..9e29d8a9cb9f3
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/anihan-hover-card-pref-fix_2017-08-28-23-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "HoverCard: Improved performance of expanding animation.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "anihan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
index f1e85af341e14..0e5893cbb3736 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
@@ -109,9 +109,9 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
 
   @autobind
   private _onRenderExpandedCard(): JSX.Element {
-    // firstFrameRendered helps in initially setting height of expanded card to 0, even if
+    // firstFrameRendered helps in initially setting height of expanded card to 1px, even if
     // mode prop is set to ExpandingCardMode.expanded on first render. This is to make sure transition animation takes place.
-    this._async.requestAnimationFrame(() => {
+    !this.state.firstFrameRendered && this._async.requestAnimationFrame(() => {
       this.setState({
         firstFrameRendered: true
       });

From f554d61227e9618ec6ff1f9bb898ff9cca56010f Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 29 Aug 2017 13:55:35 -0700
Subject: [PATCH 0525/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 22 ++++++++++++++
 apps/fabric-website/CHANGELOG.md              |  9 +++++-
 apps/fabric-website/package.json              |  6 ++--
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../sourcemap-tweak_2017-08-29-19-17.json     | 11 -------
 .../folder-cover_2017-08-25-23-08.json        | 11 -------
 .../sourcemap-tweak_2017-08-29-19-17.json     | 11 -------
 .../sourcemap-tweak_2017-08-29-19-17.json     | 11 -------
 .../sourcemap-tweak_2017-08-29-19-17.json     | 11 -------
 .../sourcemap-tweak_2017-08-29-19-17.json     | 11 -------
 .../sourcemap-tweak_2017-08-29-19-17.json     | 11 -------
 packages/example-app-base/CHANGELOG.json      | 22 ++++++++++++++
 packages/example-app-base/CHANGELOG.md        |  9 +++++-
 packages/example-app-base/package.json        |  6 ++--
 packages/experiments/CHANGELOG.json           | 29 +++++++++++++++++++
 packages/experiments/CHANGELOG.md             | 13 ++++++++-
 packages/experiments/package.json             |  6 ++--
 .../office-ui-fabric-react/CHANGELOG.json     | 25 ++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 +++++-
 packages/office-ui-fabric-react/package.json  |  8 ++---
 packages/styling/CHANGELOG.json               | 19 ++++++++++++
 packages/styling/CHANGELOG.md                 |  9 +++++-
 packages/styling/package.json                 |  4 +--
 packages/utilities/CHANGELOG.json             | 14 +++++++++
 packages/utilities/CHANGELOG.md               |  9 +++++-
 packages/utilities/package.json               |  2 +-
 28 files changed, 202 insertions(+), 102 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/sourcemap-tweak_2017-08-29-19-17.json
 delete mode 100644 common/changes/@uifabric/experiments/folder-cover_2017-08-25-23-08.json
 delete mode 100644 common/changes/@uifabric/experiments/sourcemap-tweak_2017-08-29-19-17.json
 delete mode 100644 common/changes/@uifabric/fabric-website/sourcemap-tweak_2017-08-29-19-17.json
 delete mode 100644 common/changes/@uifabric/styling/sourcemap-tweak_2017-08-29-19-17.json
 delete mode 100644 common/changes/@uifabric/utilities/sourcemap-tweak_2017-08-29-19-17.json
 delete mode 100644 common/changes/office-ui-fabric-react/sourcemap-tweak_2017-08-29-19-17.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 6c1b5f808df44..b085e1eee4423 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.7.4",
+      "tag": "@uifabric/fabric-website_v4.7.4",
+      "date": "Tue, 29 Aug 2017 20:55:35 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "8af993abbec24538b5bfebe2322122710b17b316",
+            "comment": "Adjusted build to produce sourcemaps with correct sourceRoot."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=4.2.3 <5.0.0` to `>=4.2.4 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.37.5 <5.0.0` to `>=4.37.7 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.7.3",
       "tag": "@uifabric/fabric-website_v4.7.3",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 1d70baccadcea..4f45c6df0b5df 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Wed, 23 Aug 2017 19:04:55 GMT and should not be manually modified.
+This log was last generated on Tue, 29 Aug 2017 20:55:35 GMT and should not be manually modified.
+
+## 4.7.4
+Tue, 29 Aug 2017 20:55:35 GMT
+
+### Patches
+
+- Adjusted build to produce sourcemaps with correct sourceRoot.
 
 ## 4.7.3
 Wed, 23 Aug 2017 19:04:55 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index eb885be4e6877..2e0e29dcae28e 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.7.3",
+  "version": "4.7.4",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -67,12 +67,12 @@
     "webpack-split-by-path": "2.0.0"
   },
   "dependencies": {
-    "@uifabric/example-app-base": ">=4.2.3 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.4 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "load-themed-styles": "^1.1.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.37.5 <5.0.0",
+    "office-ui-fabric-react": ">=4.37.7 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index a217073a67e82..0cb70fd90b59c 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.37.5 <5.0.0",
+    "office-ui-fabric-react": ">=4.37.7 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 426682d9ab639..7eda65bda1c4f 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -35,7 +35,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.37.5 <5.0.0",
+    "office-ui-fabric-react": ">=4.37.7 <5.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 3d1703a5ce4af..161a8b8b98770 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -26,7 +26,7 @@
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.37.5 <5.0.0",
+    "office-ui-fabric-react": ">=4.37.7 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/example-app-base/sourcemap-tweak_2017-08-29-19-17.json b/common/changes/@uifabric/example-app-base/sourcemap-tweak_2017-08-29-19-17.json
deleted file mode 100644
index 0a9cdf7789c56..0000000000000
--- a/common/changes/@uifabric/example-app-base/sourcemap-tweak_2017-08-29-19-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Adjusted build to produce sourcemaps with correct sourceRoot.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/folder-cover_2017-08-25-23-08.json b/common/changes/@uifabric/experiments/folder-cover_2017-08-25-23-08.json
deleted file mode 100644
index eb3dc4f7207b8..0000000000000
--- a/common/changes/@uifabric/experiments/folder-cover_2017-08-25-23-08.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Implement FolderCover component",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/sourcemap-tweak_2017-08-29-19-17.json b/common/changes/@uifabric/experiments/sourcemap-tweak_2017-08-29-19-17.json
deleted file mode 100644
index 270324d4eb01b..0000000000000
--- a/common/changes/@uifabric/experiments/sourcemap-tweak_2017-08-29-19-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Adjusted build to produce sourcemaps with correct sourceRoot.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/sourcemap-tweak_2017-08-29-19-17.json b/common/changes/@uifabric/fabric-website/sourcemap-tweak_2017-08-29-19-17.json
deleted file mode 100644
index 600fadfde2e16..0000000000000
--- a/common/changes/@uifabric/fabric-website/sourcemap-tweak_2017-08-29-19-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Adjusted build to produce sourcemaps with correct sourceRoot.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/sourcemap-tweak_2017-08-29-19-17.json b/common/changes/@uifabric/styling/sourcemap-tweak_2017-08-29-19-17.json
deleted file mode 100644
index 1224d6743dc14..0000000000000
--- a/common/changes/@uifabric/styling/sourcemap-tweak_2017-08-29-19-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Adjusted build to produce sourcemaps with correct sourceRoot.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/sourcemap-tweak_2017-08-29-19-17.json b/common/changes/@uifabric/utilities/sourcemap-tweak_2017-08-29-19-17.json
deleted file mode 100644
index 36d1c7343f24a..0000000000000
--- a/common/changes/@uifabric/utilities/sourcemap-tweak_2017-08-29-19-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Adjusted build to produce sourcemaps with correct sourceRoot.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/sourcemap-tweak_2017-08-29-19-17.json b/common/changes/office-ui-fabric-react/sourcemap-tweak_2017-08-29-19-17.json
deleted file mode 100644
index a4e1b9ea6f118..0000000000000
--- a/common/changes/office-ui-fabric-react/sourcemap-tweak_2017-08-29-19-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Adjusted build to produce sourcemaps with correct sourceRoot.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 24581f729889b..8034f5315e3d2 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "4.2.4",
+      "tag": "@uifabric/example-app-base_v4.2.4",
+      "date": "Tue, 29 Aug 2017 20:55:35 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "8af993abbec24538b5bfebe2322122710b17b316",
+            "comment": "Adjusted build to produce sourcemaps with correct sourceRoot."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.21.0 <1.0.0` to `>=0.21.1 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.11.0 <5.0.0` to `>=4.11.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.2.3",
       "tag": "@uifabric/example-app-base_v4.2.3",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index 709d0bb0655ec..709f844247391 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Fri, 25 Aug 2017 20:31:51 GMT and should not be manually modified.
+This log was last generated on Tue, 29 Aug 2017 20:55:35 GMT and should not be manually modified.
+
+## 4.2.4
+Tue, 29 Aug 2017 20:55:35 GMT
+
+### Patches
+
+- Adjusted build to produce sourcemaps with correct sourceRoot.
 
 ## 4.2.3
 Fri, 25 Aug 2017 20:31:51 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index ef1721199be98..baa2d58b9129d 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "4.2.3",
+  "version": "4.2.4",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,8 +47,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.21.0 <1.0.0",
-    "@uifabric/utilities": ">=4.11.0 <5.0.0",
+    "@uifabric/styling": ">=0.21.1 <1.0.0",
+    "@uifabric/utilities": ">=4.11.1 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.4.0 <5.0.0",
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 265b5b90c7979..6c3f26568a612 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,35 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "0.3.0",
+      "tag": "@uifabric/experiments_v0.3.0",
+      "date": "Tue, 29 Aug 2017 20:55:35 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "f5b0c87005e04ebae9f29f0a6b84692550ff83de",
+            "comment": "Implement FolderCover component"
+          }
+        ],
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "8af993abbec24538b5bfebe2322122710b17b316",
+            "comment": "Adjusted build to produce sourcemaps with correct sourceRoot."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.37.6 <5.0.0` to `>=4.37.7 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=4.2.3 <5.0.0` to `>=4.2.4 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.2.1",
       "tag": "@uifabric/experiments_v0.2.1",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index d6f8f1f45ffa4..a0a5f85f5f98b 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Tue, 29 Aug 2017 10:20:56 GMT and should not be manually modified.
+This log was last generated on Tue, 29 Aug 2017 20:55:35 GMT and should not be manually modified.
+
+## 0.3.0
+Tue, 29 Aug 2017 20:55:35 GMT
+
+### Minor changes
+
+- Implement FolderCover component
+
+### Patches
+
+- Adjusted build to produce sourcemaps with correct sourceRoot.
 
 ## 0.2.1
 Tue, 29 Aug 2017 10:20:56 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 6ddea8cda676f..aef57fa5640dc 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "0.2.1",
+  "version": "0.3.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -27,7 +27,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=4.2.3 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.4 <5.0.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -64,7 +64,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
-    "office-ui-fabric-react": ">=4.37.6 <5.0.0"
+    "office-ui-fabric-react": ">=4.37.7 <5.0.0"
   },
   "peerDependencies": {
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index c05fade54466c..feca27468e891 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,31 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.37.7",
+      "tag": "office-ui-fabric-react_v4.37.7",
+      "date": "Tue, 29 Aug 2017 20:55:35 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "8af993abbec24538b5bfebe2322122710b17b316",
+            "comment": "Adjusted build to produce sourcemaps with correct sourceRoot."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.11.0 <5.0.0` to `>=4.11.1 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.21.0 <1.0.0` to `>=0.21.1 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=4.2.3 <5.0.0` to `>=4.2.4 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.37.6",
       "tag": "office-ui-fabric-react_v4.37.6",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 6cfd64e867e84..3296fa7aebdbe 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 29 Aug 2017 10:20:56 GMT and should not be manually modified.
+This log was last generated on Tue, 29 Aug 2017 20:55:35 GMT and should not be manually modified.
+
+## 4.37.7
+Tue, 29 Aug 2017 20:55:35 GMT
+
+### Patches
+
+- Adjusted build to produce sourcemaps with correct sourceRoot.
 
 ## 4.37.6
 Tue, 29 Aug 2017 10:20:56 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index cd8388e2e65ba..18bc2c2196b60 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.37.6",
+  "version": "4.37.7",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -28,7 +28,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=4.2.3 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.4 <5.0.0",
     "autoprefixer": "^6.7.6",
     "chai": "^3.5.0",
     "css-loader": "^0.28.0",
@@ -70,8 +70,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
-    "@uifabric/utilities": ">=4.11.0 <5.0.0",
-    "@uifabric/styling": ">=0.21.0 <1.0.0",
+    "@uifabric/utilities": ">=4.11.1 <5.0.0",
+    "@uifabric/styling": ">=0.21.1 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.6.0"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 6372b3c21101a..f1234bd556333 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.21.1",
+      "tag": "@uifabric/styling_v0.21.1",
+      "date": "Tue, 29 Aug 2017 20:55:35 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "8af993abbec24538b5bfebe2322122710b17b316",
+            "comment": "Adjusted build to produce sourcemaps with correct sourceRoot."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.11.0 <5.0.0` to `>=4.11.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.21.0",
       "tag": "@uifabric/styling_v0.21.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 79966f8929fd3..b1e325dc4b86c 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Tue, 29 Aug 2017 10:20:56 GMT and should not be manually modified.
+This log was last generated on Tue, 29 Aug 2017 20:55:35 GMT and should not be manually modified.
+
+## 0.21.1
+Tue, 29 Aug 2017 20:55:35 GMT
+
+### Patches
+
+- Adjusted build to produce sourcemaps with correct sourceRoot.
 
 ## 0.21.0
 Tue, 29 Aug 2017 10:20:56 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index b702a386279c3..7d0165893ae77 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.21.0",
+  "version": "0.21.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
-    "@uifabric/utilities": ">=4.11.0 <5.0.0",
+    "@uifabric/utilities": ">=4.11.1 <5.0.0",
     "tslib": "^1.6.0",
     "rtl-css-js": "^1.1.1",
     "glamor": "^2.20.24"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index b3fa5579bc900..4091d3bcc84c4 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.11.1",
+      "tag": "@uifabric/utilities_v4.11.1",
+      "date": "Tue, 29 Aug 2017 20:55:35 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "8af993abbec24538b5bfebe2322122710b17b316",
+            "comment": "Adjusted build to produce sourcemaps with correct sourceRoot."
+          }
+        ]
+      }
+    },
     {
       "version": "4.11.0",
       "tag": "@uifabric/utilities_v4.11.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 7a894c6ac114a..6539f8c5a07fa 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Tue, 29 Aug 2017 10:20:56 GMT and should not be manually modified.
+This log was last generated on Tue, 29 Aug 2017 20:55:35 GMT and should not be manually modified.
+
+## 4.11.1
+Tue, 29 Aug 2017 20:55:35 GMT
+
+### Patches
+
+- Adjusted build to produce sourcemaps with correct sourceRoot.
 
 ## 4.11.0
 Tue, 29 Aug 2017 10:20:56 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 852eecc5fa3d8..90eed5ca13195 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.11.0",
+  "version": "4.11.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From c0bb20fabec2548c1262956053225dc3b53d2945 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Tue, 29 Aug 2017 14:41:04 -0700
Subject: [PATCH 0526/1641] Re-enable jsx-no-lambda rule in example-app-base
 and fix to pass tslint (#2629)

* Re-enable jsx-no-lambda rule and fix to pass tslint

* Moved function outside of render

* Refactor for organization

* Apply autobind to App.tsx
---
 .../src/components/App/App.tsx                | 25 ++++++++++++-------
 packages/example-app-base/tslint.json         |  5 +---
 2 files changed, 17 insertions(+), 13 deletions(-)

diff --git a/packages/example-app-base/src/components/App/App.tsx b/packages/example-app-base/src/components/App/App.tsx
index a7abd3f0d2ecc..6a66ad4d66215 100644
--- a/packages/example-app-base/src/components/App/App.tsx
+++ b/packages/example-app-base/src/components/App/App.tsx
@@ -2,6 +2,7 @@ import * as React from 'react';
 import {
   css
 } from 'office-ui-fabric-react/lib/Utilities';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 import { Nav } from 'office-ui-fabric-react/lib/Nav';
@@ -52,9 +53,6 @@ export class App extends React.Component<IAppProps, IAppState> {
     this.state = {
       isMenuVisible: false
     };
-
-    this._onIsMenuVisibleChanged = this._onIsMenuVisibleChanged.bind(this);
-    this._onLinkClick = this._onLinkClick.bind(this);
   }
 
   public render(): JSX.Element {
@@ -69,12 +67,7 @@ export class App extends React.Component<IAppProps, IAppState> {
       <Nav
         groups={ appDefinition.examplePages }
         onLinkClick={ this._onLinkClick }
-        onRenderLink={ (link: INavLink) => ([
-          <span key={ 1 } className='Nav-linkText'>{ link.name }</span>,
-          (link.status !== undefined ?
-            <span key={ 2 } className={ 'Nav-linkFlair ' + 'is-state' + link.status } >{ ExampleStatus[link.status] }</span> :
-            null)
-        ]) }
+        onRenderLink={ this._onRenderLink }
       />
     );
 
@@ -115,11 +108,25 @@ export class App extends React.Component<IAppProps, IAppState> {
     );
   }
 
+  @autobind
   private _onIsMenuVisibleChanged(isMenuVisible: boolean): void {
     this.setState({ isMenuVisible });
   }
 
+  @autobind
   private _onLinkClick(): void {
     this.setState({ isMenuVisible: false });
   }
+
+  @autobind
+  private _onRenderLink(link: INavLink): (JSX.Element | null)[] {
+    return (
+      [
+        <span key={ 1 } className='Nav-linkText'>{ link.name }</span>,
+        (link.status !== undefined ?
+          <span key={ 2 } className={ 'Nav-linkFlair ' + 'is-state' + link.status } >{ ExampleStatus[link.status] }</span> :
+          null)
+      ]
+    );
+  }
 }
diff --git a/packages/example-app-base/tslint.json b/packages/example-app-base/tslint.json
index a553ae5f145b3..621ee6ba04605 100644
--- a/packages/example-app-base/tslint.json
+++ b/packages/example-app-base/tslint.json
@@ -2,8 +2,5 @@
   "extends": [
     "office-ui-fabric-react-tslint"
   ],
-  "rules": {
-    "jsx-no-multiline-js": false,
-    "jsx-no-lambda": false
-  }
+  "rules": {}
 }
\ No newline at end of file

From 0e28d77ec626cac7a3b4b923fe4411879fae5225 Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Tue, 29 Aug 2017 15:33:22 -0700
Subject: [PATCH 0527/1641] Calendar: go to today button functionality update
 (#2593)

* no message

* no message

* Updating goToToday to include onSelectDate function if defined (to behave like a date has been picked)

* Adding change file

* Updating _onGoToToday() button
---
 ...lendarGoToTodayFunctionality_2017-08-23-20-36.json | 11 +++++++++++
 .../src/components/Calendar/Calendar.tsx              | 11 ++++++++---
 2 files changed, 19 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-calendarGoToTodayFunctionality_2017-08-23-20-36.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-calendarGoToTodayFunctionality_2017-08-23-20-36.json b/common/changes/office-ui-fabric-react/kegorr-calendarGoToTodayFunctionality_2017-08-23-20-36.json
new file mode 100644
index 0000000000000..63939411eeea0
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-calendarGoToTodayFunctionality_2017-08-23-20-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Updating goToToday to include onSelectDate function if defined so that this button behaves like a date has been picked",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index 3a32e0b298928..6093064ccf14b 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -3,7 +3,7 @@ import { ICalendar, ICalendarProps, ICalendarIconStrings } from './Calendar.Prop
 import { DayOfWeek, DateRangeType } from '../../utilities/dateValues/DateValues';
 import { CalendarDay } from './CalendarDay';
 import { CalendarMonth } from './CalendarMonth';
-import { compareDates } from '../../utilities/dateMath/DateMath';
+import { compareDates, getDateRangeArray } from '../../utilities/dateMath/DateMath';
 import {
   autobind,
   css,
@@ -222,8 +222,13 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
 
   @autobind
   private _onGotoToday() {
-    this._navigateDay(this.props.today!);
-    this._focusOnUpdate = true;
+
+    let { onSelectDate, dateRangeType, firstDayOfWeek, today } = this.props;
+
+    let dates = getDateRangeArray(today!, dateRangeType!, firstDayOfWeek!);
+
+    this._onSelectDate(today!, dates);
+
   }
 
   @autobind

From 3aff5a49a264cbeb51ca23903412fb15b88d3e44 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Tue, 29 Aug 2017 15:49:20 -0700
Subject: [PATCH 0528/1641] Add missing typedefs to utilities pkg to pass
 tslint (#2639)

* Add missing typedefs to utilities pkg to pass tslint

* Resolved additional typedef issues

* Add typedefs to array.ts
---
 packages/utilities/src/Async.ts               | 13 +++++-----
 packages/utilities/src/AutoScroll.ts          | 14 +++++------
 packages/utilities/src/BaseComponent.test.tsx |  8 +++----
 packages/utilities/src/BaseComponent.ts       | 24 +++++++++----------
 packages/utilities/src/Customizer.tsx         | 18 ++++++++++----
 packages/utilities/src/DelayedRender.tsx      |  7 +++---
 packages/utilities/src/EventGroup.ts          | 23 +++++++++---------
 packages/utilities/src/FabricPerformance.ts   |  4 ++--
 packages/utilities/src/array.test.ts          | 12 +++++-----
 packages/utilities/src/array.ts               |  2 +-
 packages/utilities/src/autobind.test.ts       |  3 ++-
 packages/utilities/src/autobind.ts            | 12 ++++++----
 packages/utilities/src/css.ts                 |  2 +-
 packages/utilities/src/customizable.test.tsx  |  2 +-
 packages/utilities/src/customizable.tsx       | 12 ++++++----
 packages/utilities/src/dom.ts                 |  8 +++----
 packages/utilities/src/focus.test.tsx         |  2 +-
 packages/utilities/src/focus.ts               |  2 +-
 packages/utilities/src/hoist.ts               |  4 ++--
 packages/utilities/src/language.ts            |  2 +-
 packages/utilities/src/memoize.test.ts        |  6 ++---
 packages/utilities/src/memoize.ts             | 11 ++++++---
 packages/utilities/src/object.test.ts         |  2 +-
 packages/utilities/src/object.ts              |  6 ++---
 packages/utilities/src/properties.ts          |  2 +-
 packages/utilities/src/resources.ts           |  4 ++--
 packages/utilities/src/rtl.ts                 |  2 +-
 packages/utilities/src/scroll.ts              |  4 ++--
 packages/utilities/src/string.ts              |  2 +-
 .../utilities/src/test/injectWrapperMethod.ts |  4 ++--
 packages/utilities/src/warn.test.ts           |  6 ++---
 packages/utilities/tslint.json                |  5 +---
 32 files changed, 124 insertions(+), 104 deletions(-)

diff --git a/packages/utilities/src/Async.ts b/packages/utilities/src/Async.ts
index 0bdaf69607a33..3fb01a9556e6d 100644
--- a/packages/utilities/src/Async.ts
+++ b/packages/utilities/src/Async.ts
@@ -15,12 +15,13 @@ export class Async {
   private _immediateIds: any = null;
   private _intervalIds: any = null;
   private _animationFrameIds: { [id: number]: boolean } | null = null;
-  private _isDisposed = false;
+  private _isDisposed: boolean;
   private _parent: any;
   private _onErrorHandler: ((e: any) => void) | undefined;
   private _noop: any;
 
   constructor(parent?: any, onError?: (e: any) => void) {
+    this._isDisposed = false;
     this._parent = parent || null;
     this._onErrorHandler = onError;
     this._noop = () => { /* do nothing */ };
@@ -29,7 +30,7 @@ export class Async {
   /**
    * Dispose function, clears all async operations.
    */
-  public dispose() {
+  public dispose(): void {
     let id;
 
     this._isDisposed = true;
@@ -172,7 +173,7 @@ export class Async {
    * Clears the immediate.
    * @param id - Id to cancel.
    */
-  public clearImmediate(id: number) {
+  public clearImmediate(id: number): void {
 
     if (this._immediateIds && this._immediateIds[id]) {
       /* tslint:disable:ban-native-functions */
@@ -219,7 +220,7 @@ export class Async {
    * Clears the interval.
    * @param id - Id to cancel.
    */
-  public clearInterval(id: number) {
+  public clearInterval(id: number): void {
     if (this._intervalIds && this._intervalIds[id]) {
       /* tslint:disable:ban-native-functions */
       clearInterval(id);
@@ -418,7 +419,7 @@ export class Async {
     return animationFrameId;
   }
 
-  public cancelAnimationFrame(id: number) {
+  public cancelAnimationFrame(id: number): void {
     if (this._animationFrameIds && this._animationFrameIds[id]) {
       /* tslint:disable:ban-native-functions */
       window.cancelAnimationFrame ? window.cancelAnimationFrame(id) : window.clearTimeout(id);
@@ -427,7 +428,7 @@ export class Async {
     }
   }
 
-  protected _logError(e: any) {
+  protected _logError(e: any): void {
     if (this._onErrorHandler) {
       this._onErrorHandler(e);
     }
diff --git a/packages/utilities/src/AutoScroll.ts b/packages/utilities/src/AutoScroll.ts
index 67026b12af230..b8bf7b5ca1084 100644
--- a/packages/utilities/src/AutoScroll.ts
+++ b/packages/utilities/src/AutoScroll.ts
@@ -41,22 +41,22 @@ export class AutoScroll {
     }
   }
 
-  public dispose() {
+  public dispose(): void {
     this._events.dispose();
     this._stopScroll();
   }
 
-  private _onMouseMove(ev: MouseEvent) {
+  private _onMouseMove(ev: MouseEvent): void {
     this._computeScrollVelocity(ev.clientY);
   }
 
-  private _onTouchMove(ev: TouchEvent) {
+  private _onTouchMove(ev: TouchEvent): void {
     if (ev.touches.length > 0) {
       this._computeScrollVelocity(ev.touches[0].clientY);
     }
   }
 
-  private _computeScrollVelocity(clientY: number) {
+  private _computeScrollVelocity(clientY: number): void {
     if (!this._scrollRect) {
       return;
     }
@@ -85,13 +85,13 @@ export class AutoScroll {
     }
   }
 
-  private _startScroll() {
+  private _startScroll(): void {
     if (!this._timeoutId) {
       this._incrementScroll();
     }
   }
 
-  private _incrementScroll() {
+  private _incrementScroll(): void {
     if (this._scrollableParent) {
       this._scrollableParent.scrollTop += Math.round(this._scrollVelocity);
     }
@@ -99,7 +99,7 @@ export class AutoScroll {
     this._timeoutId = setTimeout(this._incrementScroll, SCROLL_ITERATION_DELAY);
   }
 
-  private _stopScroll() {
+  private _stopScroll(): void {
     if (this._timeoutId) {
       clearTimeout(this._timeoutId);
       delete this._timeoutId;
diff --git a/packages/utilities/src/BaseComponent.test.tsx b/packages/utilities/src/BaseComponent.test.tsx
index 9002994ba1634..15387518b0dff 100644
--- a/packages/utilities/src/BaseComponent.test.tsx
+++ b/packages/utilities/src/BaseComponent.test.tsx
@@ -46,7 +46,7 @@ class TestComponent extends BaseComponent<{}, {}> {
     this._createNullRef();
   }
 
-  private _createNullRef() {
+  private _createNullRef(): void {
     let foo: any = null;
 
     // Calling a null
@@ -72,7 +72,7 @@ describe('BaseComponent', () => {
     class Foo extends BaseComponent<{}, {}> {
       public root: HTMLElement;
 
-      public render() {
+      public render(): JSX.Element {
         return <div ref={ this._resolveRef('root') } />;
       }
     }
@@ -85,11 +85,11 @@ describe('BaseComponent', () => {
   });
 });
 
-function _buildTestFor(methodName: string) {
+function _buildTestFor(methodName: string): void {
   it(`calls the error logger on ${methodName} exception`, () => {
     let lastErrorMessage = null;
 
-    BaseComponent.onError = (errorMessage, ex) => lastErrorMessage = errorMessage;
+    BaseComponent.onError = (errorMessage: string | undefined) => lastErrorMessage = errorMessage;
 
     let c = new TestComponent();
 
diff --git a/packages/utilities/src/BaseComponent.ts b/packages/utilities/src/BaseComponent.ts
index 14f9cd80bcb7d..8655d1344f824 100644
--- a/packages/utilities/src/BaseComponent.ts
+++ b/packages/utilities/src/BaseComponent.ts
@@ -65,21 +65,21 @@ export class BaseComponent<P extends IBaseProps, S = {}> extends React.Component
   /**
    * When the component will receive props, make sure the componentRef is updated.
    */
-  public componentWillReceiveProps(newProps?: P, newContext?: any) {
+  public componentWillReceiveProps(newProps?: P, newContext?: any): void {
     this._updateComponentRef(this.props, newProps);
   }
 
   /**
    * When the component has mounted, update the componentRef.
    */
-  public componentDidMount() {
+  public componentDidMount(): void {
     this._updateComponentRef(undefined, this.props);
   }
 
   /**
    * If we have disposables, dispose them automatically on unmount.
    */
-  public componentWillUnmount() {
+  public componentWillUnmount(): void {
     if (this.__disposables) {
       for (let i = 0, len = this._disposables.length; i < len; i++) {
         let disposable = this.__disposables[i];
@@ -95,7 +95,7 @@ export class BaseComponent<P extends IBaseProps, S = {}> extends React.Component
   /**
    * Gets the object's class name.
    */
-  public get className() {
+  public get className(): string {
     if (!this.__className) {
       let funcNameRegex = /function (.{1,})\(/;
       let results = (funcNameRegex).exec((this).constructor.toString());
@@ -156,7 +156,7 @@ export class BaseComponent<P extends IBaseProps, S = {}> extends React.Component
       this.__resolves = {};
     }
     if (!this.__resolves[refName]) {
-      this.__resolves[refName] = (ref) => {
+      this.__resolves[refName] = (ref: any) => {
         return (this as any)[refName] = ref;
       };
     }
@@ -167,7 +167,7 @@ export class BaseComponent<P extends IBaseProps, S = {}> extends React.Component
   /**
    * Updates the componentRef (by calling it with "this" when necessary.)
    */
-  protected _updateComponentRef(currentProps: IBaseProps | undefined, newProps: IBaseProps = {}) {
+  protected _updateComponentRef(currentProps: IBaseProps | undefined, newProps: IBaseProps = {}): void {
     if (this._shouldUpdateComponentRef &&
       ((!currentProps && newProps.componentRef) ||
         (currentProps && currentProps.componentRef !== newProps.componentRef))) {
@@ -187,7 +187,7 @@ export class BaseComponent<P extends IBaseProps, S = {}> extends React.Component
    * @param deprecationMap - The map of deprecations, where key is the prop name and the value is
    * either null or a replacement prop name.
    */
-  protected _warnDeprecations(deprecationMap: ISettingsMap<P>) {
+  protected _warnDeprecations(deprecationMap: ISettingsMap<P>): void {
     warnDeprecations(this.className, this.props, deprecationMap);
   }
 
@@ -196,7 +196,7 @@ export class BaseComponent<P extends IBaseProps, S = {}> extends React.Component
    *
    * @param mutuallyExclusiveMap - The map of mutually exclusive props.
    */
-  protected _warnMutuallyExclusive(mutuallyExclusiveMap: ISettingsMap<P>) {
+  protected _warnMutuallyExclusive(mutuallyExclusiveMap: ISettingsMap<P>): void {
     warnMutuallyExclusive(this.className, this.props, mutuallyExclusiveMap);
   }
 
@@ -218,18 +218,18 @@ export class BaseComponent<P extends IBaseProps, S = {}> extends React.Component
  * ensures that the BaseComponent's methods are called before the subclass's. This ensures that
  * componentWillUnmount in the base is called and that things in the _disposables array are disposed.
  */
-function _makeAllSafe(obj: BaseComponent<any, any>, prototype: Object, methodNames: string[]) {
+function _makeAllSafe(obj: BaseComponent<any, any>, prototype: Object, methodNames: string[]): void {
   for (let i = 0, len = methodNames.length; i < len; i++) {
     _makeSafe(obj, prototype, methodNames[i]);
   }
 }
 
-function _makeSafe(obj: BaseComponent<any, any>, prototype: Object, methodName: string) {
+function _makeSafe(obj: BaseComponent<any, any>, prototype: Object, methodName: string): void {
   let classMethod = (obj as any)[methodName];
   let prototypeMethod = (prototype as any)[methodName];
 
   if (classMethod || prototypeMethod) {
-    (obj as any)[methodName] = function () {
+    (obj as any)[methodName] = function (): any {
       let retVal;
 
       try {
@@ -252,7 +252,7 @@ function _makeSafe(obj: BaseComponent<any, any>, prototype: Object, methodName:
   }
 }
 
-BaseComponent.onError = (errorMessage) => {
+BaseComponent.onError = (errorMessage: string) => {
   console.error(errorMessage);
   throw errorMessage;
 };
diff --git a/packages/utilities/src/Customizer.tsx b/packages/utilities/src/Customizer.tsx
index 010603decfc39..78605e590d169 100644
--- a/packages/utilities/src/Customizer.tsx
+++ b/packages/utilities/src/Customizer.tsx
@@ -44,11 +44,15 @@ export interface ICustomizerState {
  * @public
  */
 export class Customizer extends BaseComponent<ICustomizerProps, ICustomizerState> {
-  public static contextTypes = {
+  public static contextTypes: {
+    injectedProps: PropTypes.Requireable<any>;
+  } = {
     injectedProps: PropTypes.object
   };
 
-  public static childContextTypes = Customizer.contextTypes;
+  public static childContextTypes: {
+    injectedProps: PropTypes.Requireable<any>;
+  } = Customizer.contextTypes;
 
   constructor(props: any, context: any) {
     super(props);
@@ -60,15 +64,19 @@ export class Customizer extends BaseComponent<ICustomizerProps, ICustomizerState
     return this.state;
   }
 
-  public componentWillReceiveProps(newProps: any, newContext: any) {
+  public componentWillReceiveProps(newProps: any, newContext: any): void {
     this.setState(this._getInjectedProps(newProps, newContext));
   }
 
-  public render() {
+  public render(): React.ReactElement<any> {
     return React.Children.only(this.props.children);
   }
 
-  private _getInjectedProps(props: ICustomizerProps, context: ICustomizerState) {
+  private _getInjectedProps(props: ICustomizerProps, context: ICustomizerState): {
+    injectedProps: {
+      [x: string]: any;
+    };
+  } {
     let { settings: injectedPropsFromSettings = {} as ISettings } = props;
     let { injectedProps: injectedPropsFromContext = {} as ISettings } = context;
 
diff --git a/packages/utilities/src/DelayedRender.tsx b/packages/utilities/src/DelayedRender.tsx
index 870cf3f3ec0ba..1e63560f1117a 100644
--- a/packages/utilities/src/DelayedRender.tsx
+++ b/packages/utilities/src/DelayedRender.tsx
@@ -32,6 +32,7 @@ export interface IDelayedRenderState {
  * @public
  */
 export class DelayedRender extends React.Component<IDelayedRenderProps, IDelayedRenderState> {
+  // tslint:disable-next-line:typedef
   public static defaultProps = {
     delay: 0
   };
@@ -45,7 +46,7 @@ export class DelayedRender extends React.Component<IDelayedRenderProps, IDelayed
     };
   }
 
-  public componentDidMount() {
+  public componentDidMount(): void {
     let { delay } = this.props;
     this._timeoutId = setTimeout(() => {
       this.setState({
@@ -54,13 +55,13 @@ export class DelayedRender extends React.Component<IDelayedRenderProps, IDelayed
     }, delay);
   }
 
-  public componentWillUnmount() {
+  public componentWillUnmount(): void {
     if (this._timeoutId) {
       clearTimeout(this._timeoutId);
     }
   }
 
-  public render() {
+  public render(): React.ReactElement<any> | null {
     return this.state.isRendered ? React.Children.only(this.props.children) : null;
   }
 }
diff --git a/packages/utilities/src/EventGroup.ts b/packages/utilities/src/EventGroup.ts
index ff8d69ae810b8..b64d1d352b3aa 100644
--- a/packages/utilities/src/EventGroup.ts
+++ b/packages/utilities/src/EventGroup.ts
@@ -54,10 +54,11 @@ export interface IDeclaredEventsByName {
  * @public
  */
 export class EventGroup {
-  private static _uniqueId = 0;
+  // tslint:disable-next-line:no-inferrable-types
+  private static _uniqueId: number = 0;
   private _parent: any;
   private _eventRecords: IEventRecord[];
-  private _id = EventGroup._uniqueId++;
+  private _id: number = EventGroup._uniqueId++;
   private _isDisposed: boolean;
 
   /** For IE8, bubbleEvent is ignored here and must be dealt with by the handler.
@@ -71,7 +72,7 @@ export class EventGroup {
     eventName: string,
     eventArgs?: any,
     bubbleEvent?: boolean
-  ) {
+  ): boolean | undefined {
     let retVal;
 
     if (EventGroup._isElement(target)) {
@@ -128,7 +129,7 @@ export class EventGroup {
     return !!declaredEvents && !!declaredEvents[eventName];
   }
 
-  public static stopPropagation(event: any) {
+  public static stopPropagation(event: any): void {
     if (event.stopPropagation) {
       event.stopPropagation();
     } else { // IE8
@@ -136,8 +137,8 @@ export class EventGroup {
     }
   }
 
-  private static _isElement(target: HTMLElement) {
-    return !!target && (target.addEventListener || target instanceof HTMLElement);
+  private static _isElement(target: HTMLElement): boolean {
+    return !!target && (!!target.addEventListener || target instanceof HTMLElement);
   }
 
   /** parent: the context in which events attached to non-HTMLElements are called */
@@ -146,7 +147,7 @@ export class EventGroup {
     this._eventRecords = [];
   }
 
-  public dispose() {
+  public dispose(): void {
     if (!this._isDisposed) {
       this._isDisposed = true;
 
@@ -156,7 +157,7 @@ export class EventGroup {
   }
 
   /** On the target, attach a set of events, where the events object is a name to function mapping. */
-  public onAll(target: any, events: { [key: string]: (args?: any) => void; }, useCapture?: boolean) {
+  public onAll(target: any, events: { [key: string]: (args?: any) => void; }, useCapture?: boolean): void {
     for (let eventName in events) {
       if (events.hasOwnProperty(eventName)) {
         this.on(target, eventName, events[eventName], useCapture);
@@ -167,7 +168,7 @@ export class EventGroup {
   /** On the target, attach an event whose handler will be called in the context of the parent
    * of this instance of EventGroup.
    */
-  public on(target: any, eventName: string, callback: (args?: any) => void, useCapture?: boolean) {
+  public on(target: any, eventName: string, callback: (args?: any) => void, useCapture?: boolean): void {
     if (eventName.indexOf(',') > -1) {
       let events = eventName.split(/[ ,]+/);
 
@@ -248,7 +249,7 @@ export class EventGroup {
     }
   }
 
-  public off(target?: any, eventName?: string, callback?: (args?: any) => void, useCapture?: boolean) {
+  public off(target?: any, eventName?: string, callback?: (args?: any) => void, useCapture?: boolean): void {
     for (let i = 0; i < this._eventRecords.length; i++) {
       let eventRecord = this._eventRecords[i];
       if ((!target || target === eventRecord.target) &&
@@ -293,7 +294,7 @@ export class EventGroup {
   }
 
   /** Declare an event as being supported by this instance of EventGroup. */
-  public declare(event: any) {
+  public declare(event: any): void {
     let declaredEvents = this._parent.__declaredEvents = this._parent.__declaredEvents || {};
 
     if (typeof event === 'string') {
diff --git a/packages/utilities/src/FabricPerformance.ts b/packages/utilities/src/FabricPerformance.ts
index f315ef27661af..4b68917b90205 100644
--- a/packages/utilities/src/FabricPerformance.ts
+++ b/packages/utilities/src/FabricPerformance.ts
@@ -46,7 +46,7 @@ export class FabricPerformance {
    * @param name - The name of this measurement
    * @param func - The logic to be measured for execution time
    */
-  public static measure(name: string, func: () => void) {
+  public static measure(name: string, func: () => void): void {
     const start = now();
     func();
     const end = now();
@@ -65,7 +65,7 @@ export class FabricPerformance {
     FabricPerformance.summary[name] = measurement;
   }
 
-  public static reset() {
+  public static reset(): void {
     FabricPerformance.summary = {};
     clearTimeout(FabricPerformance._timeoutId);
     FabricPerformance.setPeriodicReset();
diff --git a/packages/utilities/src/array.test.ts b/packages/utilities/src/array.test.ts
index 582f0d0ff482a..8478acd8a46ba 100644
--- a/packages/utilities/src/array.test.ts
+++ b/packages/utilities/src/array.test.ts
@@ -5,21 +5,21 @@ describe('array utils tests', () => {
   describe('findIndex tests', () => {
     it('returns -1 when there is no match in the array', () => {
       const array = [0, 1, 2];
-      const index = findIndex(array, _ => false);
+      const index = findIndex(array, () => false);
 
       expect(index).equals(-1);
     });
 
     it('should return the correct index when the predicate satisfies the condition', () => {
       const array = [0, 1, 2];
-      const index = findIndex(array, elem => elem === 1);
+      const index = findIndex(array, (elem: number) => elem === 1);
 
       expect(index).equals(1);
     });
 
     it('should return the first index when repeated elements satisfy the predicate', () => {
       const array = [0, 1, 2, 2];
-      const index = findIndex(array, elem => elem === 2);
+      const index = findIndex(array, (elem: number) => elem === 2);
 
       expect(index).equals(2);
     });
@@ -28,21 +28,21 @@ describe('array utils tests', () => {
   describe('find tests', () => {
     it('returns -1 when there is no match in the array', () => {
       const array = [0, 1, 2];
-      const item = find(array, _ => false);
+      const item = find(array, () => false);
 
       expect(item).equals(undefined);
     });
 
     it('should return the correct item when the predicate satisfies the condition', () => {
       const array = [{ id: 0 }, { id: 1 }, { id: 2 }, { id: 3 }];
-      const item = find(array, elem => elem.id === 1);
+      const item = find(array, (elem: { id: number }) => elem.id === 1);
 
       expect(item).equals(array[1]);
     });
 
     it('should return the first index when repeated elements satisfy the predicate', () => {
       const array = [8, 9, 10, 11];
-      const item = find(array, elem => elem === 10);
+      const item = find(array, (elem: number) => elem === 10);
 
       expect(item).equals(10);
     });
diff --git a/packages/utilities/src/array.ts b/packages/utilities/src/array.ts
index 50de8178a0157..731082db573ce 100644
--- a/packages/utilities/src/array.ts
+++ b/packages/utilities/src/array.ts
@@ -77,5 +77,5 @@ export function toMatrix<T>(items: T[], columnCount: number): T[][] {
  * @param index - The index of the element to remove
  */
 export function removeIndex<T>(array: T[], index: number): T[] {
-  return array.filter((_, i) => index !== i);
+  return array.filter((_: T, i: number) => index !== i);
 }
\ No newline at end of file
diff --git a/packages/utilities/src/autobind.test.ts b/packages/utilities/src/autobind.test.ts
index e9a68bd19a108..c119af377f1f6 100644
--- a/packages/utilities/src/autobind.test.ts
+++ b/packages/utilities/src/autobind.test.ts
@@ -2,7 +2,8 @@ let { expect } = chai;
 import { autobind } from './autobind';
 
 class Greeter {
-  private _hello = 'hello';
+  // tslint:disable-next-line:no-inferrable-types
+  private _hello: string = 'hello';
 
   @autobind
   public sayHello(): string {
diff --git a/packages/utilities/src/autobind.ts b/packages/utilities/src/autobind.ts
index 893d873e065df..fbadce9a70d7b 100644
--- a/packages/utilities/src/autobind.ts
+++ b/packages/utilities/src/autobind.ts
@@ -2,7 +2,11 @@
  * Autobind is a utility for binding methods in a class. This simplifies tagging methods as being "bound" to the this pointer
  * so that they can be used in scenarios that simply require a function callback.
  */
-export function autobind<T extends Function>(target: any, key: string, descriptor: TypedPropertyDescriptor<T>) {
+export function autobind<T extends Function>(target: any, key: string, descriptor: TypedPropertyDescriptor<T>): {
+  configurable: boolean;
+  get(): T;
+  set(newValue: any): void;
+} | void {
   let fn = descriptor.value;
 
   let defining = false;
@@ -10,9 +14,9 @@ export function autobind<T extends Function>(target: any, key: string, descripto
   return {
     configurable: true,
 
-    get() {
+    get(): T {
       if (defining || (fn && this === fn.prototype) || this.hasOwnProperty(key)) {
-        return fn;
+        return fn as T;
       }
 
       // Bind method only once, and update the property to return the bound value from now on
@@ -30,7 +34,7 @@ export function autobind<T extends Function>(target: any, key: string, descripto
       return fnBound;
     },
 
-    set(newValue: any) {
+    set(newValue: any): void {
       Object.defineProperty(this, key, {
         configurable: true,
         writable: true,
diff --git a/packages/utilities/src/css.ts b/packages/utilities/src/css.ts
index 1051e52c23441..734b39337cbf6 100644
--- a/packages/utilities/src/css.ts
+++ b/packages/utilities/src/css.ts
@@ -28,7 +28,7 @@ export type ICssInput = string | ISerializableObject | IDictionary | null | unde
  *
  * @public
  */
-export function css(...args: ICssInput[]) {
+export function css(...args: ICssInput[]): string {
   let classes = [];
 
   for (let arg of args) {
diff --git a/packages/utilities/src/customizable.test.tsx b/packages/utilities/src/customizable.test.tsx
index e54c4e5c621d4..d16320432650b 100644
--- a/packages/utilities/src/customizable.test.tsx
+++ b/packages/utilities/src/customizable.test.tsx
@@ -10,7 +10,7 @@ let { expect } = chai;
 class Foo extends React.Component<{ field: string; }, {}> {
   public name: any;
 
-  public render() {
+  public render(): JSX.Element {
     return <div>{ (this.props as any)[this.props.field] }</div>;
   }
 }
diff --git a/packages/utilities/src/customizable.tsx b/packages/utilities/src/customizable.tsx
index 07b516db6261b..a1fea0e72bb62 100644
--- a/packages/utilities/src/customizable.tsx
+++ b/packages/utilities/src/customizable.tsx
@@ -2,13 +2,15 @@ import * as React from 'react';
 import * as PropTypes from 'prop-types';
 import { GlobalSettings, IChangeDescription } from './GlobalSettings';
 
-export function customizable(fields: string[]) {
+export function customizable(fields: string[]): <P, S>(ComposedComponent: new (props: P, ...args: any[]) => React.Component<P, S>) => any {
   // tslint:disable-next-line:no-shadowed-variable
   return function customizableFactory<P, S>(
     ComposedComponent: (new (props: P, ...args: any[]) => React.Component<P, S>)
   ): any {
     return class ComponentWithInjectedProps extends React.Component<P, {}> {
-      public static contextTypes = {
+      public static contextTypes: {
+        injectedProps: PropTypes.Requireable<any>;
+      } = {
         injectedProps: PropTypes.object
       };
 
@@ -18,15 +20,15 @@ export function customizable(fields: string[]) {
         this._onSettingChanged = this._onSettingChanged.bind(this);
       }
 
-      public componentDidMount() {
+      public componentDidMount(): void {
         GlobalSettings.addChangeListener(this._onSettingChanged);
       }
 
-      public componentWillUnmount() {
+      public componentWillUnmount(): void {
         GlobalSettings.removeChangeListener(this._onSettingChanged);
       }
 
-      public render() {
+      public render(): JSX.Element {
         let defaultProps = {};
 
         for (let propName of fields) {
diff --git a/packages/utilities/src/dom.ts b/packages/utilities/src/dom.ts
index 84b7bad3bb49b..8efaaff52ed64 100644
--- a/packages/utilities/src/dom.ts
+++ b/packages/utilities/src/dom.ts
@@ -17,7 +17,7 @@ interface IVirtualElement extends HTMLElement {
  *
  * @public
  */
-export function setVirtualParent(child: HTMLElement, parent: HTMLElement) {
+export function setVirtualParent(child: HTMLElement, parent: HTMLElement): void {
   let virtualChild = <IVirtualElement>child;
   let virtualParent = <IVirtualElement>parent;
 
@@ -119,7 +119,7 @@ let _isSSR = false;
  *
  * @public
  */
-export function setSSR(isEnabled: boolean) {
+export function setSSR(isEnabled: boolean): void {
   _isSSR = isEnabled;
 }
 
@@ -128,7 +128,7 @@ export function setSSR(isEnabled: boolean) {
  *
  * @public
  */
-export function getWindow(rootElement?: HTMLElement) {
+export function getWindow(rootElement?: HTMLElement): Window | undefined {
   if (_isSSR || typeof window === 'undefined') {
     return undefined;
   } else {
@@ -147,7 +147,7 @@ export function getWindow(rootElement?: HTMLElement) {
  *
  * @public
  */
-export function getDocument(rootElement?: HTMLElement) {
+export function getDocument(rootElement?: HTMLElement): Document | undefined {
   if (_isSSR || typeof document === 'undefined') {
     return undefined;
   } else {
diff --git a/packages/utilities/src/focus.test.tsx b/packages/utilities/src/focus.test.tsx
index 7f1b9487da876..9abc71b98930c 100644
--- a/packages/utilities/src/focus.test.tsx
+++ b/packages/utilities/src/focus.test.tsx
@@ -18,7 +18,7 @@ function renderIntoDocument(element: React.ReactElement<any>): HTMLElement {
   return renderedDOM as HTMLElement;
 }
 
-function _initialize() {
+function _initialize(): void {
   _hiddenElement = renderIntoDocument(
     <div data-is-visible={ false }>
       <button />
diff --git a/packages/utilities/src/focus.ts b/packages/utilities/src/focus.ts
index f55feb6e53062..4407854e26369 100644
--- a/packages/utilities/src/focus.ts
+++ b/packages/utilities/src/focus.ts
@@ -273,7 +273,7 @@ export function isElementFocusSubZone(element?: HTMLElement): boolean {
  *
  * @public
  */
-export function doesElementContainFocus(element: HTMLElement) {
+export function doesElementContainFocus(element: HTMLElement): boolean {
   let document = getDocument(element);
   let currentActiveElement: HTMLElement | undefined = document && document.activeElement as HTMLElement;
   if (currentActiveElement && elementContains(element, currentActiveElement)) {
diff --git a/packages/utilities/src/hoist.ts b/packages/utilities/src/hoist.ts
index 3e2ffeb0788c8..6c84e9eb22a67 100644
--- a/packages/utilities/src/hoist.ts
+++ b/packages/utilities/src/hoist.ts
@@ -29,7 +29,7 @@ export function hoistMethods(destination: any, source: any, exclusions: string[]
     ) {
       hoisted.push(methodName);
       /* tslint:disable:no-function-expression */
-      destination[methodName] = function () { source[methodName].apply(source, arguments); };
+      destination[methodName] = function (): void { source[methodName].apply(source, arguments); };
       /* tslint:enable */
     }
   }
@@ -46,5 +46,5 @@ export function hoistMethods(destination: any, source: any, exclusions: string[]
  */
 export function unhoistMethods(source: any, methodNames: string[]): void {
   methodNames
-    .forEach((methodName) => delete source[methodName]);
+    .forEach((methodName: string) => delete source[methodName]);
 }
diff --git a/packages/utilities/src/language.ts b/packages/utilities/src/language.ts
index 380f031d2f8e8..5315e4787ad4e 100644
--- a/packages/utilities/src/language.ts
+++ b/packages/utilities/src/language.ts
@@ -39,7 +39,7 @@ export function getLanguage(): string | null {
  *
  * @public
  */
-export function setLanguage(language: string, avoidPersisting = false): void {
+export function setLanguage(language: string, avoidPersisting: boolean = false): void {
   let doc = getDocument();
 
   if (doc) {
diff --git a/packages/utilities/src/memoize.test.ts b/packages/utilities/src/memoize.test.ts
index b100ae39bf526..ca9d57891af9d 100644
--- a/packages/utilities/src/memoize.test.ts
+++ b/packages/utilities/src/memoize.test.ts
@@ -22,7 +22,7 @@ describe('memoizeFunction', () => {
 
   it('can return a cached result with a 2 arg function', () => {
     let _timesCalled = 0;
-    let combine = memoizeFunction((obj1, obj2) => (obj1.val + obj2.val + ++_timesCalled));
+    let combine = memoizeFunction((obj1: any, obj2: any) => (obj1.val + obj2.val + ++_timesCalled));
     let objA = { val: 'a' };
     let objB = { val: 'b' };
 
@@ -36,7 +36,7 @@ describe('memoizeFunction', () => {
 
   it('can return a cached result with falsy args', () => {
     let _timesCalled = 0;
-    let combine = memoizeFunction((obj1, obj2) => ((obj1 ? obj1.val : '') + (obj2 ? obj2.val : '') + ++_timesCalled));
+    let combine = memoizeFunction((obj1: any, obj2: any) => ((obj1 ? obj1.val : '') + (obj2 ? obj2.val : '') + ++_timesCalled));
     let objA = { val: 'a' };
     let objB = { val: 'b' };
 
@@ -109,7 +109,7 @@ describe('memoize', () => {
     class Foo {
 
       @memoize
-      public bar(val: string) {
+      public bar(val: string): string {
         return val + _count++;
       }
     }
diff --git a/packages/utilities/src/memoize.ts b/packages/utilities/src/memoize.ts
index 47c453c7a0c20..0d27893049a07 100644
--- a/packages/utilities/src/memoize.ts
+++ b/packages/utilities/src/memoize.ts
@@ -32,7 +32,10 @@ export function setMemoizeWeakMap(weakMap: any): void {
 export function memoize<T extends Function>(
   target: any,
   key: string,
-  descriptor: TypedPropertyDescriptor<T>) {
+  descriptor: TypedPropertyDescriptor<T>): {
+    configurable: boolean;
+    get(): T;
+  } {
 
   // We bind to "null" to prevent people from inadvertently pulling values from "this",
   // rather than passing them in as input values which can be memoized.
@@ -40,7 +43,7 @@ export function memoize<T extends Function>(
 
   return {
     configurable: true,
-    get() {
+    get(): T {
       return fn;
     }
   };
@@ -106,7 +109,9 @@ export function memoizeFunction<T extends (...args: any[]) => RET_TYPE, RET_TYPE
   } as any;
 }
 
-function _normalizeArg(val: any) {
+function _normalizeArg(val: null | undefined): { empty: boolean } | any;
+function _normalizeArg(val: object): any;
+function _normalizeArg(val: any): any {
   if (!val) {
     return _emptyObject;
   } else if (typeof val === 'object') {
diff --git a/packages/utilities/src/object.test.ts b/packages/utilities/src/object.test.ts
index 43a4f12690f6c..b665d9a5872d3 100644
--- a/packages/utilities/src/object.test.ts
+++ b/packages/utilities/src/object.test.ts
@@ -28,7 +28,7 @@ describe('filteredAssign', () => {
       a: 1,
       b: 'string'
     };
-    let result = filteredAssign((propName) => propName !== 'b', {}, source);
+    let result = filteredAssign((propName: string) => propName !== 'b', {}, source);
 
     expect(result.a).to.equal(1);
     expect(result.b).to.equal(undefined, 'b was not excluded');
diff --git a/packages/utilities/src/object.ts b/packages/utilities/src/object.ts
index a133c2c78bea3..84dbf94049479 100644
--- a/packages/utilities/src/object.ts
+++ b/packages/utilities/src/object.ts
@@ -9,7 +9,7 @@ if (_global[CURRENT_ID_PROPERTY] === undefined) {
   _global[CURRENT_ID_PROPERTY] = 0;
 }
 
-function checkProperties(a: any, b: any) {
+function checkProperties(a: any, b: any): boolean {
   for (let propName in a) {
     if (a.hasOwnProperty(propName)) {
       if (!b.hasOwnProperty(propName) || (b[propName] !== a[propName])) {
@@ -26,7 +26,7 @@ function checkProperties(a: any, b: any) {
  *
  * @public
  */
-export function shallowCompare(a: any, b: any) {
+export function shallowCompare(a: any, b: any): boolean {
   return checkProperties(a, b) && checkProperties(b, a);
 }
 
@@ -56,7 +56,7 @@ export function assign(target: any, ...args: any[]): any {
  * @param args - One or more objects that will be mixed into the target in the order they are provided.
  * @returns Resulting merged target.
  */
-export function filteredAssign(isAllowed: (propName: string) => boolean, target: any, ...args: any[]) {
+export function filteredAssign(isAllowed: (propName: string) => boolean, target: any, ...args: any[]): any {
   target = target || {};
 
   for (let sourceObject of args) {
diff --git a/packages/utilities/src/properties.ts b/packages/utilities/src/properties.ts
index 18c86ec22f3da..6f948a502b890 100644
--- a/packages/utilities/src/properties.ts
+++ b/packages/utilities/src/properties.ts
@@ -272,7 +272,7 @@ export const imageProperties = divProperties;
  * @returns The filtered props
  */
 export function getNativeProps<T>(props: any, allowedPropNames: string[], excludedPropNames?: string[]): T {
-  return filteredAssign((propName) => {
+  return filteredAssign((propName: string) => {
     return (
       (!excludedPropNames || excludedPropNames.indexOf(propName) < 0) && (
         (propName.indexOf('data-') === 0) ||
diff --git a/packages/utilities/src/resources.ts b/packages/utilities/src/resources.ts
index f1aedeee24a45..949dd4b45d6ea 100644
--- a/packages/utilities/src/resources.ts
+++ b/packages/utilities/src/resources.ts
@@ -1,11 +1,11 @@
 let _baseUrl = '';
 
 /** Sets the current base url used for fetching images. */
-export function getResourceUrl(url: string) {
+export function getResourceUrl(url: string): string {
   return _baseUrl + url;
 }
 
 /** Gets the current base url used for fetching images. */
-export function setBaseUrl(baseUrl: string) {
+export function setBaseUrl(baseUrl: string): void {
   _baseUrl = baseUrl;
 }
diff --git a/packages/utilities/src/rtl.ts b/packages/utilities/src/rtl.ts
index eaeecb10b399b..f27ea75c2c2dd 100644
--- a/packages/utilities/src/rtl.ts
+++ b/packages/utilities/src/rtl.ts
@@ -27,7 +27,7 @@ export function getRTL(): boolean {
  *
  * @public
  */
-export function setRTL(isRTL: boolean) {
+export function setRTL(isRTL: boolean): void {
   let doc = typeof document === 'undefined' ? undefined : document;
 
   if (doc && doc.documentElement) {
diff --git a/packages/utilities/src/scroll.ts b/packages/utilities/src/scroll.ts
index e8dc32dc02357..f1cd45dae72f1 100644
--- a/packages/utilities/src/scroll.ts
+++ b/packages/utilities/src/scroll.ts
@@ -18,7 +18,7 @@ export const DATA_IS_SCROLLABLE_ATTRIBUTE = 'data-is-scrollable';
  *
  * @public
  */
-export function disableBodyScroll() {
+export function disableBodyScroll(): void {
   let doc = getDocument();
 
   if (doc && doc.body && !_bodyScrollDisabledCount) {
@@ -33,7 +33,7 @@ export function disableBodyScroll() {
  *
  * @public
  */
-export function enableBodyScroll() {
+export function enableBodyScroll(): void {
   if (_bodyScrollDisabledCount > 0) {
     let doc = getDocument();
 
diff --git a/packages/utilities/src/string.ts b/packages/utilities/src/string.ts
index 2a6ec2c8eed96..8b073a2659390 100644
--- a/packages/utilities/src/string.ts
+++ b/packages/utilities/src/string.ts
@@ -18,7 +18,7 @@ export function format(s: string, ...values: any[]): string {
 
   let args = values;
   // Callback match function
-  function replace_func(match: string) {
+  function replace_func(match: string): string {
     // looks up in the args
     let replacement = args[match.replace(FORMAT_ARGS_REGEX, '') as any];
 
diff --git a/packages/utilities/src/test/injectWrapperMethod.ts b/packages/utilities/src/test/injectWrapperMethod.ts
index b683b2cf1445e..fae25b3d9c6f1 100644
--- a/packages/utilities/src/test/injectWrapperMethod.ts
+++ b/packages/utilities/src/test/injectWrapperMethod.ts
@@ -6,14 +6,14 @@ import { ReactWrapper } from 'enzyme';
  * @param methodName - The name of the method to modify on the wrapper
  * @param fn - The function to run prior to the call of the original method
  */
-export function injectWrapperMethod(wrapper: ReactWrapper<any, any>, methodName: string, fn: () => void) {
+export function injectWrapperMethod(wrapper: ReactWrapper<any, any>, methodName: string, fn: () => void): void {
   const originalMethod = (wrapper.instance() as any)[methodName];
 
   if (typeof originalMethod !== 'function') {
     throw new Error(`Tried to override the method ${methodName} on a ReactWrapper that does not have that function`);
   }
 
-  (wrapper.instance() as any)[methodName] = function (prevProps: any) {
+  (wrapper.instance() as any)[methodName] = function (prevProps: any): void {
     fn();
     originalMethod.call(this, prevProps);
   };
diff --git a/packages/utilities/src/warn.test.ts b/packages/utilities/src/warn.test.ts
index 250eafe9c2dc5..600390d63e620 100644
--- a/packages/utilities/src/warn.test.ts
+++ b/packages/utilities/src/warn.test.ts
@@ -11,7 +11,7 @@ let _lastWarning: string | undefined;
 describe('warnDeprecations', () => {
   beforeEach(() => {
     _lastWarning = undefined;
-    setWarningCallback(message => _lastWarning = message);
+    setWarningCallback((message: string) => _lastWarning = message);
   });
 
   afterEach(() => setWarningCallback(undefined));
@@ -35,7 +35,7 @@ describe('warnDeprecations', () => {
 describe('warnMutuallyExclusive', () => {
   beforeEach(() => {
     _lastWarning = undefined;
-    setWarningCallback(message => _lastWarning = message);
+    setWarningCallback((message: string) => _lastWarning = message);
   });
 
   afterEach(() => setWarningCallback(undefined));
@@ -54,7 +54,7 @@ describe('warnMutuallyExclusive', () => {
 describe('warnConditionallyRequiredProps', () => {
   beforeEach(() => {
     _lastWarning = undefined;
-    setWarningCallback(message => _lastWarning = message);
+    setWarningCallback((message: string) => _lastWarning = message);
   });
 
   afterEach(() => setWarningCallback(undefined));
diff --git a/packages/utilities/tslint.json b/packages/utilities/tslint.json
index cd3b575b4545f..5d9173ba970da 100644
--- a/packages/utilities/tslint.json
+++ b/packages/utilities/tslint.json
@@ -3,9 +3,6 @@
     "office-ui-fabric-react-tslint"
   ],
   "rules": {
-    "no-any": false,
-    "typedef": [
-      false
-    ]
+    "no-any": false
   }
 }
\ No newline at end of file

From 5e9fbcd5735cc185c1b2e047beb517cb9f1dbe96 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 29 Aug 2017 16:06:28 -0700
Subject: [PATCH 0529/1641] Removing: gulp, gcb, and simplifying the build.
 (#2653)

* Removes karma.

* Total removal of gulp

* Gulp removed!

* more fixes.

* Fixing oufr webpack.

* More updates.

* Updates.

* remove fsevents.

* Update BreadcrumbPage.tsx

* More changes.

* Updates.
---
 .travis.yml                                   |    2 -
 .vscode/launch.json                           |   10 +-
 apps/component-demo/gulpfile.js               |   41 -
 apps/component-demo/index.html                |   20 -
 apps/component-demo/package.json              |   34 -
 apps/component-demo/src/index.tsx             |   24 -
 apps/component-demo/tsconfig.json             |   25 -
 apps/component-demo/tsd.json                  |   15 -
 apps/component-demo/webpack.config.js         |   59 -
 apps/fabric-website/config/pre-copy.json      |    7 +
 apps/fabric-website/karma.config.js           |  108 -
 apps/fabric-website/package.json              |   43 +-
 apps/fabric-website/src/common/tests.js       |   15 -
 .../fabric-website/src/components/App/App.tsx |    8 +-
 .../src/components/App/AppState.tsx           |    5 +-
 .../src/components/DOIcon/DOIcon.tsx          |    5 +-
 .../components/DONavigation/DONavigation.tsx  |   28 +-
 .../src/components/Header/Header.tsx          |    4 +-
 .../src/components/IconGrid/IconGrid.tsx      |    2 +-
 .../Table/AnimationCell/AnimationCell.tsx     |   19 +-
 .../src/components/Table/Table.tsx            |    6 +-
 .../src/pages/BlogPage/BlogPage.tsx           |    2 +-
 .../src/pages/BlogPage/BlogPost.tsx           |   32 +-
 .../src/pages/ResourcesPage/ResourcesPage.tsx |    2 +-
 .../Styles/BrandIconsPage/BrandIconsPage.tsx  |    2 +-
 .../pages/Styles/ColorsPage/ColorsPage.tsx    |    1 -
 .../LocalizationPage/LocalizationPage.tsx     |    4 +-
 apps/fabric-website/src/root.tsx              |    1 -
 apps/fabric-website/src/styles/_base.scss     |    3 +
 .../fabric-website/src/styles/_highlight.scss |    2 +
 .../fabric-website/src/styles/_overrides.scss |    3 +
 .../src/styles/_typography.scss               |    3 +
 .../fabric-website/src/styles/_variables.scss |    2 +-
 .../src/utilities/animation/Ease.ts           |   51 +-
 apps/fabric-website/src/utilities/beep.ts     |   24 -
 .../fabric-website/src/utilities/debugging.ts |   44 -
 apps/fabric-website/tsconfig.json             |    1 +
 apps/fabric-website/tslint.json               |   15 +-
 apps/fabric-website/webpack.config.js         |   49 +-
 apps/fabric-website/webpack.serve.config.js   |   72 +-
 apps/fabric-website/webpack.site.config.js    |   91 -
 apps/ssr-tests/package.json                   |    7 +-
 apps/ssr-tests/webpack.config.js              |   67 +-
 apps/test-bundle-button/check-size.js         |   12 -
 apps/test-bundle-button/package.json          |   19 +-
 apps/test-bundle-button/tsconfig.json         |    8 +-
 apps/test-bundle-button/webpack.config.js     |   66 +-
 apps/todo-app/gulpfile.js                     |   47 -
 apps/todo-app/index.html                      |   10 +-
 apps/todo-app/package.json                    |   12 +-
 apps/todo-app/src/DataProvider.ts             |   16 +-
 .../{Todo.module.scss => Todo.scss}           |    3 +-
 apps/todo-app/src/components/Todo.tsx         |   17 +-
 apps/todo-app/src/components/TodoForm.tsx     |    2 +-
 apps/todo-app/src/components/TodoItem.tsx     |    5 +-
 apps/todo-app/src/components/TodoTabs.tsx     |   13 +-
 apps/todo-app/src/index.tsx                   |    3 +-
 apps/todo-app/src/strings.ts                  |    2 +-
 apps/todo-app/tsconfig.json                   |    8 +-
 apps/todo-app/tslint.json                     |   11 +
 apps/todo-app/webpack.config.js               |   74 +-
 apps/todo-app/webpack.serve.config.js         |   17 +
 common/config/rush/npm-shrinkwrap.json        | 8296 +++++------------
 common/config/rush/pinned-versions.json       |    9 +-
 packages/example-app-base/package.json        |   19 +-
 packages/example-app-base/tsconfig.json       |    8 +-
 .../example-app-base/webpack.serve.config.js  |   40 +-
 packages/experiments/karma.config.js          |   27 +-
 packages/experiments/package.json             |   35 +-
 packages/experiments/tsconfig.json            |    3 +-
 packages/experiments/webpack.config.js        |   28 +-
 packages/experiments/webpack.lib.config.js    |   77 -
 packages/experiments/webpack.serve.config.js  |   77 +-
 packages/merge-styles/karma.config.js         |   12 +-
 packages/merge-styles/package.json            |   13 +-
 .../src/transforms/kebabRules.test.ts         |    3 +-
 .../src/transforms/prefixRules.test.ts        |    2 +-
 .../src/transforms/provideUnits.test.ts       |    2 +-
 packages/merge-styles/tsconfig.json           |   10 +-
 packages/merge-styles/webpack.config.js       |   69 +-
 .../package.json                              |    1 -
 .../office-ui-fabric-react-tslint/tslint.json |  102 +-
 packages/office-ui-fabric-react/gulpfile.js   |   80 -
 .../office-ui-fabric-react/karma.config.js    |   18 +-
 packages/office-ui-fabric-react/package.json  |   37 +-
 .../DetailsList/DetailsList.Props.ts          |    4 +-
 .../src/components/Facepile/Facepile.test.tsx |    5 +-
 .../components/FocusZone/FocusZone.test.tsx   |    2 +-
 .../GroupedList/GroupedList.Props.ts          |    6 +-
 .../OverflowSet/OverflowSet.test.tsx          |    2 +-
 .../src/components/Panel/Panel.tsx            |   10 +-
 .../src/components/Persona/Persona.test.tsx   |    1 -
 .../ResizeGroup/ResizeGroup.test.tsx          |    2 +-
 .../src/components/TextField/TextField.tsx    |    2 +-
 packages/office-ui-fabric-react/tsconfig.json |    8 +-
 .../office-ui-fabric-react/webpack.config.js  |   63 +-
 .../webpack.serve.config.js                   |   78 +-
 packages/styling/package.json                 |   31 +-
 .../styling/src/interfaces/ISemanticColors.ts |   32 +-
 packages/styling/tsconfig.json                |   10 +-
 packages/utilities/api/utilities.api.ts       |    8 +-
 packages/utilities/karma.config.js            |   21 +-
 packages/utilities/package.json               |   13 +-
 packages/utilities/src/warn.test.ts           |    2 +-
 packages/utilities/tsconfig.json              |   10 +-
 scripts/build.js                              |   10 +-
 scripts/clean.js                              |   13 +
 scripts/logging.js                            |   28 +-
 scripts/package.json                          |   31 +-
 scripts/start.js                              |   13 +
 scripts/tasks/karma-resources.js              |   19 +
 scripts/tasks/karma.js                        |    7 +-
 scripts/tasks/serve.js                        |    0
 scripts/tasks/tslint.js                       |    1 +
 scripts/tasks/webpack-resources.js            |  208 +
 scripts/tasks/webpack.js                      |   68 +-
 116 files changed, 3429 insertions(+), 7550 deletions(-)
 delete mode 100644 apps/component-demo/gulpfile.js
 delete mode 100644 apps/component-demo/index.html
 delete mode 100644 apps/component-demo/package.json
 delete mode 100644 apps/component-demo/src/index.tsx
 delete mode 100644 apps/component-demo/tsconfig.json
 delete mode 100644 apps/component-demo/tsd.json
 delete mode 100644 apps/component-demo/webpack.config.js
 create mode 100644 apps/fabric-website/config/pre-copy.json
 delete mode 100644 apps/fabric-website/karma.config.js
 delete mode 100644 apps/fabric-website/src/common/tests.js
 delete mode 100644 apps/fabric-website/src/utilities/beep.ts
 delete mode 100644 apps/fabric-website/src/utilities/debugging.ts
 delete mode 100644 apps/fabric-website/webpack.site.config.js
 delete mode 100644 apps/test-bundle-button/check-size.js
 delete mode 100644 apps/todo-app/gulpfile.js
 rename apps/todo-app/src/components/{Todo.module.scss => Todo.scss} (95%)
 create mode 100644 apps/todo-app/tslint.json
 create mode 100644 apps/todo-app/webpack.serve.config.js
 delete mode 100644 packages/experiments/webpack.lib.config.js
 delete mode 100644 packages/office-ui-fabric-react/gulpfile.js
 create mode 100644 scripts/clean.js
 create mode 100644 scripts/start.js
 create mode 100644 scripts/tasks/karma-resources.js
 delete mode 100644 scripts/tasks/serve.js
 create mode 100644 scripts/tasks/webpack-resources.js

diff --git a/.travis.yml b/.travis.yml
index 818c787046457..28ef2764c908b 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -1,7 +1,5 @@
 language: node_js
 node_js:
   - '7'
-before_script:
-  - npm install -g gulp
 script:
   - npm run buildfast
\ No newline at end of file
diff --git a/.vscode/launch.json b/.vscode/launch.json
index e2e5dbf6e72de..8ef25390f8459 100644
--- a/.vscode/launch.json
+++ b/.vscode/launch.json
@@ -5,10 +5,14 @@
       "name": "Launch",
       "type": "node",
       "request": "launch",
-      "program": "${workspaceRoot}/packages/utilities/node_modules/gulp/bin/gulp.js",
+      "program": "${workspaceRoot}/scripts/build.js",
       "stopOnEntry": false,
-      "args": [],
-      "cwd": "${workspaceRoot}/packages/utilities",
+      "args": [
+        "webpack",
+        "--",
+        "--production"
+      ],
+      "cwd": "${workspaceRoot}/apps/fabric-website",
       "runtimeExecutable": null,
       "runtimeArgs": [
         "--nolazy",
diff --git a/apps/component-demo/gulpfile.js b/apps/component-demo/gulpfile.js
deleted file mode 100644
index c2007dcf9e087..0000000000000
--- a/apps/component-demo/gulpfile.js
+++ /dev/null
@@ -1,41 +0,0 @@
-'use strict';
-
-let build = require('@microsoft/web-library-build');
-let serial = build.serial;
-
-build.tslint.isEnabled = () => false;
-build.karma.isEnabled = () => false;
-
-/* Configure TypeScript 2.0. */
-build.typescript.setConfig({ typescript: require('typescript') });
-
-// Set up a "rushBuild" subTask that will spawn rush build
-let fs = require('fs');
-let spawn = require('child_process').spawn;
-let rawStdout = new fs.SyncWriteStream(1, { autoClose: false });
-
-let rushBuild = build.subTask('rushbuild', (gulp, options, done) => {
-  let child = spawn(
-    'rush',
-    ['build', '--to', 'component-demo']
-  );
-
-  child.stdout.on('data', data => rawStdout.write(data));
-  child.on('close', done);
-});
-
-const sourceMatch = [
-  'src/**/*.{ts,tsx,scss,js,txt,html}',
-  '!src/**/*.scss.ts'
-];
-
-build.task('serve', serial(
-  build.serve,
-  build.watch(sourceMatch, serial(
-    rushBuild,
-    build.reload
-  ))));
-
-build.initialize(require('gulp'));
-
-
diff --git a/apps/component-demo/index.html b/apps/component-demo/index.html
deleted file mode 100644
index 65d95ddc6ccb1..0000000000000
--- a/apps/component-demo/index.html
+++ /dev/null
@@ -1,20 +0,0 @@
-<!doctype html>
-<html dir="ltr">
-
-<head>
-  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
-  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-  <meta name="viewport" content="width=device-width, initial-scale=1" />
-
-  <title>Fabric React Component</title>
-
-  <link rel="stylesheet" type="text/css" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/6.0.0/css/fabric.min.css">
-  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.2.0/react.min.js"></script>
-  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.2.0/react-dom.min.js"></script>
-</head>
-
-<body>
-  <script type="text/javascript" src="dist/component-demo.js"></script>
-</body>
-
-</html>
\ No newline at end of file
diff --git a/apps/component-demo/package.json b/apps/component-demo/package.json
deleted file mode 100644
index 3ee4396e1ada7..0000000000000
--- a/apps/component-demo/package.json
+++ /dev/null
@@ -1,34 +0,0 @@
-{
-  "name": "component-demo",
-  "description": "Simple demo of a Fabric React component.",
-  "version": "1.0.1",
-  "scripts": {
-    "build": "gulp",
-    "clean": "gulp clean",
-    "start": "gulp serve",
-    "test": "gulp test"
-  },
-  "devDependencies": {
-    "@microsoft/web-library-build": "^3.2.1"
-  },
-  "dependencies": {
-    "@microsoft/load-themed-styles": "^1.5.1",
-    "@types/chai": "3.4.35",
-    "@types/es6-promise": "^0.0.32",
-    "@types/immutability-helper": "2.0.15",
-    "@types/mocha": "2.2.32",
-    "@types/node": "6.0.45",
-    "@types/react": "15.0.38",
-    "@types/react-addons-test-utils": "0.14.19",
-    "@types/react-dom": "15.5.1",
-    "@types/webpack-env": "1.13.0",
-    "es6-promise": "^4.1.0",
-    "immutability-helper": "^2.0.0",
-    "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=1.5.5 <2.0.0",
-    "react": ">=15.3.2 <16.0.0",
-    "react-dom": ">=15.3.2 <16.0.0",
-    "tslib": "^1.6.0",
-    "typescript": "2.4.2"
-  }
-}
\ No newline at end of file
diff --git a/apps/component-demo/src/index.tsx b/apps/component-demo/src/index.tsx
deleted file mode 100644
index c09ed6f9d014f..0000000000000
--- a/apps/component-demo/src/index.tsx
+++ /dev/null
@@ -1,24 +0,0 @@
-import * as React from 'react';
-import * as ReactDOM from 'react-dom';
-
-import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
-import { TextField } from 'office-ui-fabric-react/lib/components/TextField';
-
-let _rootDiv: HTMLElement;
-
-function start(): void {
-  if (!_rootDiv) {
-    _rootDiv = document.createElement('div');
-    document.body.appendChild(_rootDiv);
-  }
-
-  ReactDOM.render(
-    <Fabric>
-      <h1>Component Demo</h1>
-      <TextField label='Default TextField' />
-    </Fabric>,
-    _rootDiv);
-}
-
-// Start the application.
-start();
diff --git a/apps/component-demo/tsconfig.json b/apps/component-demo/tsconfig.json
deleted file mode 100644
index c6eb73686d0ef..0000000000000
--- a/apps/component-demo/tsconfig.json
+++ /dev/null
@@ -1,25 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "es5",
-    "module": "commonjs",
-    "jsx": "react",
-    "declaration": true,
-    "sourceMap": true,
-    "experimentalDecorators": true,
-    "noEmitOnError": true,
-    "importHelpers": true,
-    "forceConsistentCasingInFileNames": true,
-    "moduleResolution": "node",
-    "types": [
-      "chai",
-      "mocha",
-      "webpack-env"
-    ]
-  },
-  "exclude": [
-    "node_modules",
-    "dist",
-    "lib",
-    "lib-amd"
-  ]
-}
\ No newline at end of file
diff --git a/apps/component-demo/tsd.json b/apps/component-demo/tsd.json
deleted file mode 100644
index a912a39c8c9c9..0000000000000
--- a/apps/component-demo/tsd.json
+++ /dev/null
@@ -1,15 +0,0 @@
-{
-  "version": "v4",
-  "repo": "borisyankov/DefinitelyTyped",
-  "ref": "master",
-  "path": "typings",
-  "bundle": "typings/tsd.d.ts",
-  "installed": {
-    "react/react-dom.d.ts": {
-      "commit": "33585c55fbb7cd3cfc59d18a3b87f4ae6012eaff"
-    },
-    "react/react.d.ts": {
-      "commit": "33585c55fbb7cd3cfc59d18a3b87f4ae6012eaff"
-    }
-  }
-}
diff --git a/apps/component-demo/webpack.config.js b/apps/component-demo/webpack.config.js
deleted file mode 100644
index 3fb1f0a32ca1a..0000000000000
--- a/apps/component-demo/webpack.config.js
+++ /dev/null
@@ -1,59 +0,0 @@
-'use strict';
-
-/** Note: this require may need to be fixed to point to the build that exports the gulp-core-build-webpack instance. */
-let webpackTaskResources = require('@microsoft/web-library-build').webpack.resources;
-let webpack = webpackTaskResources.webpack;
-
-let path = require('path');
-let isProduction = process.argv.indexOf('--production') > -1;
-let packageJSON = require('./package.json');
-
-let webpackConfig = {
-  context: path.join(__dirname, 'lib/'),
-
-  entry: {
-    [packageJSON.name]: './index.js'
-  },
-
-  output: {
-    libraryTarget: 'umd',
-    path: path.join(__dirname, '/dist'),
-    filename: `[name]${isProduction ? '.min' : ''}.js`
-  },
-
-  devtool: 'source-map',
-
-  devServer: {
-    stats: 'none'
-  },
-
-  externals: [
-    {
-      'react': 'React'
-
-    },
-    {
-      'react-dom': 'ReactDOM'
-    }
-  ],
-
-  module: {
-    loaders: [
-    ]
-  },
-
-  plugins: [
-    //  new WebpackNotifierPlugin()
-  ]
-};
-
-if (isProduction) {
-  webpackConfig.plugins.push(new webpack.optimize.UglifyJsPlugin({
-    minimize: true,
-    compress: {
-      warnings: false
-    }
-  }));
-}
-
-module.exports = webpackConfig;
\ No newline at end of file
diff --git a/apps/fabric-website/config/pre-copy.json b/apps/fabric-website/config/pre-copy.json
new file mode 100644
index 0000000000000..baf19c00de4c5
--- /dev/null
+++ b/apps/fabric-website/config/pre-copy.json
@@ -0,0 +1,7 @@
+{
+  "copyTo": {
+    "lib": [
+      "src/**/*.json"
+    ]
+  }
+}
\ No newline at end of file
diff --git a/apps/fabric-website/karma.config.js b/apps/fabric-website/karma.config.js
deleted file mode 100644
index 9088588c2adbc..0000000000000
--- a/apps/fabric-website/karma.config.js
+++ /dev/null
@@ -1,108 +0,0 @@
-'use strict';
-
-// Karma configuration
-// Generated on Thu Oct 08 2015 18:13:05 GMT-0700 (PDT)
-
-let path = require('path');
-let build = require('@microsoft/web-library-build');
-let buildConfig = build.getConfig();
-let configResources = build.karma.resources;
-let bindPolyfillPath = configResources.bindPolyfillPath;
-let debugRun = (process.argv.indexOf('--debug') > -1);
-
-module.exports = function (config) {
-  let karmaConfig = {
-
-    // base path that will be used to resolve all patterns (eg. files, exclude)
-    basePath: '.',
-
-    // frameworks to use
-    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
-    frameworks: ['mocha', 'sinon-chai'],
-
-
-    // list of files / patterns to load in the browser
-    files: [bindPolyfillPath].concat([path.join(buildConfig.libFolder, 'common/tests.js')]),
-
-    // list of files to exclude
-    exclude: [],
-
-    // webpack config for bundling tests.
-    webpack: {
-      devtool: 'inline-source-map',
-      module: {
-        loaders: [
-          {
-            test: /sinon\/pkg\/sinon/,
-            loader: "imports?define=>false,require=>false"
-          },
-          debugRun ? {} : {
-            test: /\.js/,
-            exclude: /(test|node_modules|bower_components)/,
-            loader: configResources.istanbulInstrumenterLoaderPath,
-            enforce: 'post'
-          }
-        ],
-      },
-      externals: {
-        'cheerio': 'window',
-        'react/addons': true,
-        'react/lib/ExecutionEnvironment': true,
-        'react/lib/ReactContext': true
-      },
-      resolve: {
-        modules: [
-          buildConfig.libFolder,
-          'node_modules'
-        ]
-      }
-    },
-
-    webpackMiddleware: {
-      noInfo: true
-    },
-
-    // preprocess matching files before serving them to the browser
-    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
-    preprocessors: {
-      [path.join(buildConfig.libFolder, '/**/*.js')]: ['webpack']
-    },
-
-    plugins: configResources.plugins.concat([
-    ]),
-
-    // test results reporter to use
-    // possible values: 'dots', 'progress'
-    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
-    reporters: ['mocha-clean', 'coverage'],
-
-
-    // web server port
-    port: 9876,
-
-
-    // enable / disable colors in the output (reporters and logs)
-    colors: true,
-
-
-    // level of logging
-    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
-    logLevel: config.LOG_INFO,
-
-
-    // enable / disable watching file and executing tests whenever any file changes
-    autoWatch: false,
-
-
-    // start these browsers
-    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
-    browsers: ['PhantomJS'],
-
-
-    // Continuous Integration mode
-    // if true, Karma captures browsers, runs the tests and exits
-    singleRun: true
-  };
-
-  config.set(karmaConfig);
-};
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 2e0e29dcae28e..bc0c7b6676a70 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -9,15 +9,13 @@
     "url": "https://github.com/OfficeDev/office-ui-fabric-react"
   },
   "scripts": {
-    "build": "gulp",
-    "clean": "gulp clean",
-    "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.serve.config.js --open",
-    "production": "node --max_old_space_size=8192 ./node_modules/gulp/bin/gulp.js --production"
+    "build": "node ../../scripts/build.js",
+    "clean": "node ../../scripts/clean.js",
+    "start": "node ../../scripts/start.js",
+    "production": "node --max_old_space_size=8192 ../../scripts/build.js --production"
   },
   "license": "MIT",
   "devDependencies": {
-    "@microsoft/load-themed-styles": "^1.5.1",
-    "@microsoft/web-library-build": "^3.2.1",
     "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.0",
     "@types/es6-promise": "^0.0.32",
@@ -29,50 +27,23 @@
     "@types/react-addons-test-utils": "0.14.19",
     "@types/react-dom": "15.5.1",
     "@types/webpack-env": "1.13.0",
-    "autoprefixer": "^6.7.6",
-    "chai": "^3.5.0",
-    "css-loader": "^0.28.0",
     "enzyme": "^2.7.0",
     "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
-    "git-rev": "0.2.1",
-    "gulp": "~3.9.1",
-    "gulp-phantomcss": "~0.3.0",
-    "gulp-prompt": "^0.2.0",
-    "gulp-util": "3.0.8",
-    "gutil": "1.6.4",
     "highlight.js": "^9.6.0",
-    "load-themed-styles-loader": "^0.0.3",
-    "mocha": "^3.3.0",
-    "mocha-loader": "^1.1.1",
-    "node-sass": "^4.5.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
-    "postcss-loader": "^1.3.3",
-    "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
     "react-dom": "^15.4.2",
-    "react-highlight": "0.9.0",
-    "resemblejs": "~2.2.3",
-    "sass-loader": "^6.0.3",
-    "sinon": "^2.3.2",
-    "source-map-loader": "^0.2.1",
-    "ts-loader": "^2.0.1",
-    "typescript": "2.4.2",
-    "webpack": "^3.5.1",
-    "webpack-bundle-analyzer": "^2.2.1",
-    "webpack-dev-server": "^2.4.1",
-    "webpack-notifier": "^1.5.0",
-    "webpack-split-by-path": "2.0.0"
+    "react-highlight": "0.9.0"
   },
   "dependencies": {
+    "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/example-app-base": ">=4.2.4 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "load-themed-styles": "^1.1.0",
-    "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.37.7 <5.0.0",
-    "tslib": "^1.6.0"
+    "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/fabric-website/src/common/tests.js b/apps/fabric-website/src/common/tests.js
deleted file mode 100644
index 38f28d927bf30..0000000000000
--- a/apps/fabric-website/src/common/tests.js
+++ /dev/null
@@ -1,15 +0,0 @@
-'use strict';
-
-/**
- * This is a test entry point to help karma-webpack find all tests in the project.
- **/
-
-// Before loading modules, treat errors and warnings as test failures.
-console.error = console.warn = function (warning) {
-  throw new Error(warning);
-}
-
-var context = require.context('..', true, /.+\.test\.js?$/);
-
-// context.keys().forEach(context);
-// module.exports = context;
\ No newline at end of file
diff --git a/apps/fabric-website/src/components/App/App.tsx b/apps/fabric-website/src/components/App/App.tsx
index 512c29e6f40d8..6f507ee1f428f 100644
--- a/apps/fabric-website/src/components/App/App.tsx
+++ b/apps/fabric-website/src/components/App/App.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import './App.scss';
 import { AppState } from './AppState';
 import { css } from 'office-ui-fabric-react/lib/Utilities';
-import { Fabric } from 'office-ui-fabric-react/lib/components/Fabric';
+import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
 import { Footer } from '../Footer/Footer';
 import { Header } from '../Header/Header';
 import { Nav } from '../Nav/Nav';
@@ -30,10 +30,10 @@ export class App extends React.Component<IAppProps, any> {
     let toggleIcon;
     let siteTitle;
     if (isNavOpen) {
-      toggleIcon = <i className='ms-Icon ms-Icon--ChromeClose'></i>;
+      toggleIcon = <i className='ms-Icon ms-Icon--ChromeClose' />;
       siteTitle = '';
     } else {
-      toggleIcon = <i className='ms-Icon ms-Icon--GlobalNavButton'></i>;
+      toggleIcon = <i className='ms-Icon ms-Icon--GlobalNavButton' />;
       siteTitle = <div className='siteTitle'>Fabric</div>;
     }
 
@@ -50,7 +50,7 @@ export class App extends React.Component<IAppProps, any> {
             </button>
             { siteTitle }
           </div>
-          <div className='App-mobileNavOverlay' onClick={ this._onOverlayClicked.bind(this) }></div>
+          <div className='App-mobileNavOverlay' onClick={ this._onOverlayClicked.bind(this) } />
           <div className='App-nav'>
             <Nav pages={ AppState.pages } onLinkClick={ this._onNavItemClicked.bind(this) } />
           </div>
diff --git a/apps/fabric-website/src/components/App/AppState.tsx b/apps/fabric-website/src/components/App/AppState.tsx
index e8e2c3ba07469..75bd7ae75e4b8 100644
--- a/apps/fabric-website/src/components/App/AppState.tsx
+++ b/apps/fabric-website/src/components/App/AppState.tsx
@@ -4,20 +4,19 @@ import * as React from 'react';
 import { INavPage } from '../Nav/Nav.Props';
 import { ComponentPage } from '../ComponentPage/ComponentPage';
 import { PageHeader } from '../PageHeader/PageHeader';
-import { Spinner } from 'office-ui-fabric-react/lib/Spinner';
 
 export interface IAppState {
   appTitle: string;
   pages: INavPage[];
 }
 
-function LoadingComponent(props: any): JSX.Element {
+const LoadingComponent = (props: any): JSX.Element => {
   return (
     <ComponentPage>
       <PageHeader pageTitle={ props.title } backgroundColor='#038387' />
     </ComponentPage>
   );
-}
+};
 
 export const AppState: IAppState = {
   appTitle: 'Office UI Fabric',
diff --git a/apps/fabric-website/src/components/DOIcon/DOIcon.tsx b/apps/fabric-website/src/components/DOIcon/DOIcon.tsx
index 63c15885b6e05..e212f0f6c8a38 100644
--- a/apps/fabric-website/src/components/DOIcon/DOIcon.tsx
+++ b/apps/fabric-website/src/components/DOIcon/DOIcon.tsx
@@ -14,7 +14,10 @@ export class DOIcon extends React.Component<IDOIconProps, {}> {
 
   public render() {
     return (
-      <i className={ 'od-Icon od-Icon--' + this.props.iconClass + ' ms-bgColor-' + this.props.bgColor } aria-hidden={ this.props.ariaHidden }></i>
+      <i
+        className={ 'od-Icon od-Icon--' + this.props.iconClass + ' ms-bgColor-' + this.props.bgColor }
+        aria-hidden={ this.props.ariaHidden }
+      />
     );
   }
 }
\ No newline at end of file
diff --git a/apps/fabric-website/src/components/DONavigation/DONavigation.tsx b/apps/fabric-website/src/components/DONavigation/DONavigation.tsx
index fe3b532c45086..6a06c7c8cb769 100644
--- a/apps/fabric-website/src/components/DONavigation/DONavigation.tsx
+++ b/apps/fabric-website/src/components/DONavigation/DONavigation.tsx
@@ -88,7 +88,7 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
           <div className='od-Navigation-linkContainer'>
             <a className='od-Navigation-link is-selected' role='menuitem' aria-label='Explore menu item, hit enter to open sub-menu and tab to navigate to first sub menu item' href='/' aria-expanded='false'>
               Explore
-                <i className='ms-Icon ms-Icon--ChevronDown' aria-hidden='true'></i>
+                <i className='ms-Icon ms-Icon--ChevronDown' aria-hidden='true' />
             </a>
             <div className='od-Navigation-subMenu'>
               <div className='od-Navigation-subMenuItems'>
@@ -102,7 +102,7 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
                     </div>
                     <div className='ms-Grid-col ms-xl3 ms-sm12  od-Navigation-menuThirdColumn'>
                       { this._getLinks(links.exploreLinks.thirdMenuColumn) }
-                      <div className='od-Navigation-subMenuOverflowColor'></div>
+                      <div className='od-Navigation-subMenuOverflowColor' />
                     </div>
                   </div>
                 </div>
@@ -122,7 +122,7 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
           <div className='od-Navigation-linkContainer'>
             <a className='od-Navigation-link' role='menuitem' aria-label='Resources menu item, hit enter to open sub-menu' href='/' aria-expanded='false'>
               Resources
-                <i className='ms-Icon ms-Icon--ChevronDown' aria-hidden='true'></i>
+                <i className='ms-Icon ms-Icon--ChevronDown' aria-hidden='true' />
             </a>
             <div className='od-Navigation-subMenu'>
               <div className='od-Navigation-subMenuItems od-Navigation-menuFirstColumn'>
@@ -133,7 +133,7 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
           <div className='od-Navigation-linkContainer'>
             <a className='od-Navigation-link' role='menuitem' aria-label='Documentation menu item, hit enter to open sub-menu and tab to navigate to first sub menu item' href='/' aria-expanded='false'>
               Documentation
-                <i className='ms-Icon ms-Icon--ChevronDown' aria-hidden='true'></i>
+                <i className='ms-Icon ms-Icon--ChevronDown' aria-hidden='true' />
             </a>
             <div className='od-Navigation-subMenu'>
               <div className='od-Navigation-subMenuItems od-Navigation-menuFirstColumn'>
@@ -143,11 +143,11 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
           </div>
         </div>
         <div className='od-Navigation-socialButtons'>
-          <div className='od-Navigation-socialButton'></div>
-          <div className='od-Navigation-socialButton'></div>
-          <div className='od-Navigation-socialButton'></div>
-          <div className='od-Navigation-socialButton'></div>
-          <div className='od-Navigation-socialButton'></div>
+          <div className='od-Navigation-socialButton' />
+          <div className='od-Navigation-socialButton' />
+          <div className='od-Navigation-socialButton' />
+          <div className='od-Navigation-socialButton' />
+          <div className='od-Navigation-socialButton' />
         </div>
       </div>
     );
@@ -259,7 +259,7 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
   }
 
   private _closeDropdownHandler(e) {
-    if (!this.isDescendant(this.headerel, document.activeElement)) {
+    if (!this._isDescendant(this.headerel, document.activeElement)) {
       this._removeDropdown();
     }
   }
@@ -305,7 +305,7 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
         e.target.setAttribute('aria-expanded', false);
       }
     } else {
-      ancestor = this.findAncestor(e.target, this.CONTAINER_CLASS);
+      ancestor = this._findAncestor(e.target, this.CONTAINER_CLASS);
 
       if (!ancestor.classList.contains(this.LINK_OPEN_STATE)) {
         this._removeAllActiveClasses();
@@ -330,9 +330,9 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
     }
   }
 
-  private isDescendant(parent, child) {
+  private _isDescendant(parent, child) {
     let node = child.parentNode;
-    while (node != null) {
+    while (node) {
       if (node === parent) {
         return true;
       }
@@ -347,7 +347,7 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
     }
   }
 
-  private findAncestor(el, cls) {
+  private _findAncestor(el, cls) {
     let newCLS = cls.replace('.', '');
     let that;
     let newEL = el;
diff --git a/apps/fabric-website/src/components/Header/Header.tsx b/apps/fabric-website/src/components/Header/Header.tsx
index 356d573e7f5fd..b3fecf807b6ae 100644
--- a/apps/fabric-website/src/components/Header/Header.tsx
+++ b/apps/fabric-website/src/components/Header/Header.tsx
@@ -25,10 +25,10 @@ export class Header extends React.Component<IHeaderProps, IHeaderState> {
           </div>
         </div>
         <div className='od-Header-navigationContainer'>
-         <DONavigation />
+          <DONavigation />
         </div>
         <button className='od-Header-hamburgerButton' role='menu' aria-label='Mobile menu, press enter to open'>
-          <i className='ms-Icon ms-Icon--menu2' aria-hidden='true'></i>
+          <i className='ms-Icon ms-Icon--menu2' aria-hidden='true' />
         </button>
       </header>
     );
diff --git a/apps/fabric-website/src/components/IconGrid/IconGrid.tsx b/apps/fabric-website/src/components/IconGrid/IconGrid.tsx
index 99853f9423a78..5f54105c867e5 100644
--- a/apps/fabric-website/src/components/IconGrid/IconGrid.tsx
+++ b/apps/fabric-website/src/components/IconGrid/IconGrid.tsx
@@ -38,7 +38,7 @@ export class IconGrid extends React.Component<IIconGridProps, IIconGridState> {
             .filter(icon => icon.name.toLowerCase().indexOf(searchQuery.toLowerCase()) !== -1)
             .map((icon, iconIndex) => (
               <li key={ iconIndex } aria-label={ icon.name + ' icon' }>
-                <i className={ `ms-Icon ms-Icon--${icon.name}` } title={ `${icon.name}` } aria-hidden='true'></i>
+                <i className={ `ms-Icon ms-Icon--${icon.name}` } title={ `${icon.name}` } aria-hidden='true' />
                 <span>{ icon.name }</span>
               </li>
             ))
diff --git a/apps/fabric-website/src/components/Table/AnimationCell/AnimationCell.tsx b/apps/fabric-website/src/components/Table/AnimationCell/AnimationCell.tsx
index 3dc66d51acf69..f2f143e825b2b 100644
--- a/apps/fabric-website/src/components/Table/AnimationCell/AnimationCell.tsx
+++ b/apps/fabric-website/src/components/Table/AnimationCell/AnimationCell.tsx
@@ -13,12 +13,13 @@ export class AnimationCell extends React.Component<IAnimationCellProps, {}> {
   public render() {
     const name = this.props.data[0].value;
     const animClass = this.props.data[1].value;
+
     return (
-      <div className={`AnimationExample ${animClass}`}
-          data-class={ animClass }
-          aria-label={`Visual Animation Example for ${ name }`}
-          onClick={ this._doAnimation }
-          >
+      <div className={ `AnimationExample ${animClass}` }
+        data-class={ animClass }
+        aria-label={ `Visual Animation Example for ${name}` }
+        onClick={ this._doAnimation }
+      >
         <div className='AnimationExample-content' aria-hidden='true'>
           <hr />
           <hr />
@@ -28,16 +29,16 @@ export class AnimationCell extends React.Component<IAnimationCellProps, {}> {
           <hr />
           <hr />
         </div>
-        <div className='animationExample_panel ms-bg-color-themePrimary' data-class={ animClass }></div>
+        <div className='animationExample_panel ms-bg-color-themePrimary' data-class={ animClass } />
       </div>
     );
   }
 
   // Apply animation to animation cell
   private _doAnimation(e): void {
-    const AnimationCell = e.currentTarget;
-    const panel = AnimationCell.getElementsByClassName('animationExample_panel')[0];
-    const animClass = AnimationCell.getAttribute('data-class');
+    const cell = e.currentTarget;
+    const panel = cell.getElementsByClassName('animationExample_panel')[0];
+    const animClass = cell.getAttribute('data-class');
     panel.classList.add(animClass);
     setTimeout(() => {
       panel.classList.remove(animClass);
diff --git a/apps/fabric-website/src/components/Table/Table.tsx b/apps/fabric-website/src/components/Table/Table.tsx
index be7b5dc7841a2..a9bcf0d2b8edb 100644
--- a/apps/fabric-website/src/components/Table/Table.tsx
+++ b/apps/fabric-website/src/components/Table/Table.tsx
@@ -41,7 +41,7 @@ export class Table extends React.Component<ITableProps, ITableState> {
     return (
       (cell.value.length) ?
         <td className={ cell.className } key={ index }>{ cell.value }</td> :
-        <td className={ cell.className } key={ index } dangerouslySetInnerHTML={ { __html: cell.html } }></td>
+        <td className={ cell.className } key={ index } dangerouslySetInnerHTML={ { __html: cell.html } } />
     );
   }
 
@@ -105,8 +105,8 @@ export class Table extends React.Component<ITableProps, ITableState> {
   }
 
   // Capitalize the first letter of a string
-  private _capitalizeFirstLetter(string: string): string {
-    return string.charAt(0).toUpperCase() + string.slice(1);
+  private _capitalizeFirstLetter(str: string): string {
+    return str.charAt(0).toUpperCase() + str.slice(1);
   }
 
   // Check current window size and set state if current size is different from state
diff --git a/apps/fabric-website/src/pages/BlogPage/BlogPage.tsx b/apps/fabric-website/src/pages/BlogPage/BlogPage.tsx
index 77c1f902059c9..686d320b7d8ca 100644
--- a/apps/fabric-website/src/pages/BlogPage/BlogPage.tsx
+++ b/apps/fabric-website/src/pages/BlogPage/BlogPage.tsx
@@ -11,7 +11,7 @@ export class BlogPage extends React.Component<any, any> {
     return (
       <div>
         <PageHeader pageTitle='Blog' backgroundColor='#73aa24' />
-        <div className={ styles.angle }></div>
+        <div className={ styles.angle } />
         { this._getBlogItems() }
       </div>
     );
diff --git a/apps/fabric-website/src/pages/BlogPage/BlogPost.tsx b/apps/fabric-website/src/pages/BlogPage/BlogPost.tsx
index ed0db97adf6b5..f8b0496c0a895 100644
--- a/apps/fabric-website/src/pages/BlogPage/BlogPost.tsx
+++ b/apps/fabric-website/src/pages/BlogPage/BlogPost.tsx
@@ -21,31 +21,31 @@ export class BlogPost extends React.Component<{}, {}> {
           { blogData[this._postId].title }
         </h1>
         <p className='BlogPost-meta'>
-         { blogData[this._postId].fullPublishedDate } | Posted by { blogData[this._postId].author }
+          { blogData[this._postId].fullPublishedDate } | Posted by { blogData[this._postId].author }
         </p>
         <div
           className='BlogPost-content'
-          dangerouslySetInnerHTML={ {__html: blogData[this._postId].content } }>
-        </div>
+          dangerouslySetInnerHTML={ { __html: blogData[this._postId].content } }
+        />
       </div>
     );
   }
 
   private _getParameterByName(name: string, url?: string) {
-      if (!url) {
-         url = window.location.href;
-      }
+    if (!url) {
+      url = window.location.href;
+    }
 
-      name = name.replace(/[\[\]]/g, '\\$&');
-      let regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
-          results = regex.exec(url);
-      if (!results) {
-         return null;
-      }
+    name = name.replace(/[\[\]]/g, '\\$&');
+    let regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
+      results = regex.exec(url);
+    if (!results) {
+      return null;
+    }
 
-      if (!results[2]) {
-        return '';
-      }
-      return decodeURIComponent(results[2].replace(/\+/g, ' '));
+    if (!results[2]) {
+      return '';
+    }
+    return decodeURIComponent(results[2].replace(/\+/g, ' '));
   }
 }
\ No newline at end of file
diff --git a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
index 73d7b228b3d8f..5dcc0d36d1278 100644
--- a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
+++ b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
@@ -25,7 +25,7 @@ export class ResourcesPage extends React.Component<any, any> {
           backgroundColor='#ff8c00'
         />
 
-        <div className={ styles.angle }></div>
+        <div className={ styles.angle } />
 
         <h2 className={ styles.pageTitle }>We want to hear from you</h2>
 
diff --git a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
index b76ed5d463f55..53867fa771cf5 100644
--- a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
@@ -128,7 +128,7 @@ export class BrandIconsPage extends React.Component<any, any> {
               </ul>
               <ul className={ styles.exampleIcons }>
                 <li>
-                  <i className='ms-Icon ms-Icon--OutlookLogo ms-fontColor-neutralSecondary' style={ { fontSize: '64px' } }></i>
+                  <i className='ms-Icon ms-Icon--OutlookLogo ms-fontColor-neutralSecondary' style={ { fontSize: '64px' } } />
                   <span>Icon font</span>
                 </li>
               </ul>
diff --git a/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx b/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
index 2331b35983e76..ed12bc44c0d7f 100644
--- a/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
@@ -5,7 +5,6 @@ import { Table } from '../../../components/Table/Table';
 import * as stylesImport from './ColorsPage.module.scss';
 const styles: any = stylesImport;
 const pageStyles: any = require('../../PageStyles.module.scss');
-import { baseURL } from '../../../appConfig';
 
 const accentColorsData = require('../../../data/colors-accent.json');
 const colorClassesData = require('../../../data/colors-classes.json');
diff --git a/apps/fabric-website/src/pages/Styles/LocalizationPage/LocalizationPage.tsx b/apps/fabric-website/src/pages/Styles/LocalizationPage/LocalizationPage.tsx
index 0ea0050da726c..bbf164f810592 100644
--- a/apps/fabric-website/src/pages/Styles/LocalizationPage/LocalizationPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/LocalizationPage/LocalizationPage.tsx
@@ -55,11 +55,11 @@ export class LocalizationPage extends React.Component<any, any> {
           { directionalIconsData.map((pair, pairIndex) => (
             <li className={ styles.directionalIconPair } key={ pairIndex }>
               <div className={ styles.directionalIcon }>
-                <i className={ 'ms-Icon ms-Icon--' + pair[0] }></i>
+                <i className={ 'ms-Icon ms-Icon--' + pair[0] } />
                 { pair[0] }
               </div>
               <div className={ styles.directionalIcon }>
-                <i className={ 'ms-Icon ms-Icon--' + pair[1] }></i>
+                <i className={ 'ms-Icon ms-Icon--' + pair[1] } />
                 { pair[1] }
               </div>
             </li>
diff --git a/apps/fabric-website/src/root.tsx b/apps/fabric-website/src/root.tsx
index b42fa4264dc2a..c71a4e044411d 100644
--- a/apps/fabric-website/src/root.tsx
+++ b/apps/fabric-website/src/root.tsx
@@ -84,7 +84,6 @@ function _onLoad(): void {
 
 function _createRoutes(pages: {}[]): {}[] {
   let routes = [];
-  let pageRoutes = [];
 
   // tslint:disable-next-line:no-any
   pages.forEach((page: any, pageIndex: number) => {
diff --git a/apps/fabric-website/src/styles/_base.scss b/apps/fabric-website/src/styles/_base.scss
index 87f1249defc18..7d7160316133e 100644
--- a/apps/fabric-website/src/styles/_base.scss
+++ b/apps/fabric-website/src/styles/_base.scss
@@ -1,3 +1,6 @@
+@import '~office-ui-fabric-react/dist/sass/References';
+@import './variables';
+
 // Root elements
 :global {
   html, body {
diff --git a/apps/fabric-website/src/styles/_highlight.scss b/apps/fabric-website/src/styles/_highlight.scss
index 1a90ac8336c38..3a3941cba1ab6 100644
--- a/apps/fabric-website/src/styles/_highlight.scss
+++ b/apps/fabric-website/src/styles/_highlight.scss
@@ -1,3 +1,5 @@
+@import '~office-ui-fabric-react/dist/sass/References';
+
 :global {
   .hljs {
     background: $ms-color-neutralDark;
diff --git a/apps/fabric-website/src/styles/_overrides.scss b/apps/fabric-website/src/styles/_overrides.scss
index ff2caa9f60f68..b773f25c562e2 100644
--- a/apps/fabric-website/src/styles/_overrides.scss
+++ b/apps/fabric-website/src/styles/_overrides.scss
@@ -1,3 +1,6 @@
+@import '~office-ui-fabric-react/dist/sass/References';
+@import './variables';
+
 //== Fabric overrides and additions
 
 // Override the default Grid component so that the content is pulled out to the edge
diff --git a/apps/fabric-website/src/styles/_typography.scss b/apps/fabric-website/src/styles/_typography.scss
index a13a653687c4b..a7ad5d40626cc 100644
--- a/apps/fabric-website/src/styles/_typography.scss
+++ b/apps/fabric-website/src/styles/_typography.scss
@@ -1,3 +1,6 @@
+@import '~office-ui-fabric-react/dist/sass/References';
+@import './variables';
+
 // Standard text size and spacing
 :global {
   body {
diff --git a/apps/fabric-website/src/styles/_variables.scss b/apps/fabric-website/src/styles/_variables.scss
index 4011ba96bf501..8419ec6c32e23 100644
--- a/apps/fabric-website/src/styles/_variables.scss
+++ b/apps/fabric-website/src/styles/_variables.scss
@@ -1,5 +1,5 @@
 // Import the Fabric variables and mixins
-@import '../../node_modules/office-ui-fabric-core/src/sass/References';
+@import '~office-ui-fabric-react/dist/sass/References';
 
 // Colors (all taken from the MDL2 palette)
 $color-home-darker: #004e8c;
diff --git a/apps/fabric-website/src/utilities/animation/Ease.ts b/apps/fabric-website/src/utilities/animation/Ease.ts
index f44d9d3011813..746210a7cfd17 100644
--- a/apps/fabric-website/src/utilities/animation/Ease.ts
+++ b/apps/fabric-website/src/utilities/animation/Ease.ts
@@ -1,33 +1,34 @@
 // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
 // 'use strict';
 
+const CUBIC_BEZIER = 'cubic-bezier';
+
 export class Ease {
-  private static CB = 'cubic-bezier';
 
-  public static QUAD_EASE_IN: string = Ease.CB + '(0.550, 0.085, 0.680, 0.530)';
-  public static CUBIC_EASE_IN: string = Ease.CB + '(0.550, 0.055, 0.675, 0.190)';
-  public static QUART_EASE_IN: string = Ease.CB + '(0.895, 0.030, 0.685, 0.220)';
-  public static QUINT_EASE_IN: string = Ease.CB + '(0.755, 0.050, 0.855, 0.060)';
-  public static SINE_EASE_IN: string = Ease.CB + '(0.470, 0, 0.745, 0.715)';
-  public static EXPO_EASE_IN: string = Ease.CB + '(0.950, 0.050, 0.795, 0.035)';
-  public static CIRC_EASE_IN: string = Ease.CB + '(0.600, 0.040, 0.980, 0.335)';
-  public static BACK_EASE_IN: string = Ease.CB + '(0.600, 0.040, 0.980, 0.335)';
+  public static QUAD_EASE_IN: string = CUBIC_BEZIER + '(0.550, 0.085, 0.680, 0.530)';
+  public static CUBIC_EASE_IN: string = CUBIC_BEZIER + '(0.550, 0.055, 0.675, 0.190)';
+  public static QUART_EASE_IN: string = CUBIC_BEZIER + '(0.895, 0.030, 0.685, 0.220)';
+  public static QUINT_EASE_IN: string = CUBIC_BEZIER + '(0.755, 0.050, 0.855, 0.060)';
+  public static SINE_EASE_IN: string = CUBIC_BEZIER + '(0.470, 0, 0.745, 0.715)';
+  public static EXPO_EASE_IN: string = CUBIC_BEZIER + '(0.950, 0.050, 0.795, 0.035)';
+  public static CIRC_EASE_IN: string = CUBIC_BEZIER + '(0.600, 0.040, 0.980, 0.335)';
+  public static BACK_EASE_IN: string = CUBIC_BEZIER + '(0.600, 0.040, 0.980, 0.335)';
 
-  public static QUAD_EASE_OUT: string = Ease.CB + '(0.250, 0.460, 0.450, 0.940)';
-  public static CUBIC_EASE_OUT: string = Ease.CB + '(0.215, 0.610, 0.355, 1)';
-  public static QUART_EASE_OUT: string = Ease.CB + '(0.165, 0.840, 0.440, 1)';
-  public static QUINT_EASE_OUT: string = Ease.CB + '(0.230, 1, 0.320, 1)';
-  public static SINE_EASE_OUT: string = Ease.CB + '(0.390, 0.575, 0.565, 1)';
-  public static EXPO_EASE_OUT: string = Ease.CB + '(0.190, 1, 0.220, 1)';
-  public static CIRC_EASE_OUT: string = Ease.CB + '(0.075, 0.820, 0.165, 1)';
-  public static BACK_EASE_OUT: string = Ease.CB + '(0.175, 0.885, 0.320, 1.275)';
+  public static QUAD_EASE_OUT: string = CUBIC_BEZIER + '(0.250, 0.460, 0.450, 0.940)';
+  public static CUBIC_EASE_OUT: string = CUBIC_BEZIER + '(0.215, 0.610, 0.355, 1)';
+  public static QUART_EASE_OUT: string = CUBIC_BEZIER + '(0.165, 0.840, 0.440, 1)';
+  public static QUINT_EASE_OUT: string = CUBIC_BEZIER + '(0.230, 1, 0.320, 1)';
+  public static SINE_EASE_OUT: string = CUBIC_BEZIER + '(0.390, 0.575, 0.565, 1)';
+  public static EXPO_EASE_OUT: string = CUBIC_BEZIER + '(0.190, 1, 0.220, 1)';
+  public static CIRC_EASE_OUT: string = CUBIC_BEZIER + '(0.075, 0.820, 0.165, 1)';
+  public static BACK_EASE_OUT: string = CUBIC_BEZIER + '(0.175, 0.885, 0.320, 1.275)';
 
-  public static QUAD_EASE_IN_OUT: string = Ease.CB + '(0.455, 0.030, 0.515, 0.955)';
-  public static CUBIC_EASE_IN_OUT: string = Ease.CB + '(0.645, 0.045, 0.355, 1)';
-  public static QUART_EASE_IN_OUT: string = Ease.CB + '(0.770, 0, 0.175, 1)';
-  public static QUINT_EASE_IN_OUT: string = Ease.CB + '(0.860, 0, 0.070, 1)';
-  public static SINE_EASE_IN_OUT: string = Ease.CB + '(0.445, 0.050, 0.550, 0.950)';
-  public static EXPO_EASE_IN_OUT: string = Ease.CB + '(1, 0, 0, 1)';
-  public static CIRC_EASE_IN_OUT: string = Ease.CB + '(0.785, 0.135, 0.150, 0.860)';
-  public static BACK_EASE_IN_OUT: string = Ease.CB + '(0.680, -0.550, 0.265, 1.550)';
+  public static QUAD_EASE_IN_OUT: string = CUBIC_BEZIER + '(0.455, 0.030, 0.515, 0.955)';
+  public static CUBIC_EASE_IN_OUT: string = CUBIC_BEZIER + '(0.645, 0.045, 0.355, 1)';
+  public static QUART_EASE_IN_OUT: string = CUBIC_BEZIER + '(0.770, 0, 0.175, 1)';
+  public static QUINT_EASE_IN_OUT: string = CUBIC_BEZIER + '(0.860, 0, 0.070, 1)';
+  public static SINE_EASE_IN_OUT: string = CUBIC_BEZIER + '(0.445, 0.050, 0.550, 0.950)';
+  public static EXPO_EASE_IN_OUT: string = CUBIC_BEZIER + '(1, 0, 0, 1)';
+  public static CIRC_EASE_IN_OUT: string = CUBIC_BEZIER + '(0.785, 0.135, 0.150, 0.860)';
+  public static BACK_EASE_IN_OUT: string = CUBIC_BEZIER + '(0.680, -0.550, 0.265, 1.550)';
 }
diff --git a/apps/fabric-website/src/utilities/beep.ts b/apps/fabric-website/src/utilities/beep.ts
deleted file mode 100644
index f0027f4c5d325..0000000000000
--- a/apps/fabric-website/src/utilities/beep.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-const BEEP_DATA = 'data:audio/wav;base64,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qJrx4KOQjahZxWbcZgztj2c49nKmkId44S71j0c8eV9yDK6uPRzx5X18eDvjvQ6yKo9ZSS6l//8elePK/Lf//IInrOF/FvDoADYAGBMGb7FtErm5MXMlmPAJQVgWta7Zx2go+8xJ0UiCb8LHHdftWyLJE0QIAIsI+UbXu67dZMjmgDGCGl1H+vpF4NSDckSIkk7Vd+sxEhBQMRU8j/12UIRhzSaUdQ+rQU5kGeFxm+hb1oh6pWWmv3uvmReDl0UnvtapVaIzo1jZbf/pD6ElLqSX+rUmOQNpJFa/r+sa4e/pBlAABoAAAAA3CUgShLdGIxsY7AUABPRrgCABdDuQ5GC7DqPQCgbbJUAoRSUj+NIEig0YfyWUho1VBBBA//uQZB4ABZx5zfMakeAAAAmwAAAAF5F3P0w9GtAAACfAAAAAwLhMDmAYWMgVEG1U0FIGCBgXBXAtfMH10000EEEEEECUBYln03TTTdNBDZopopYvrTTdNa325mImNg3TTPV9q3pmY0xoO6bv3r00y+IDGid/9aaaZTGMuj9mpu9Mpio1dXrr5HERTZSmqU36A3CumzN/9Robv/Xx4v9ijkSRSNLQhAWumap82WRSBUqXStV/YcS+XVLnSS+WLDroqArFkMEsAS+eWmrUzrO0oEmE40RlMZ5+ODIkAyKAGUwZ3mVKmcamcJnMW26MRPgUw6j+LkhyHGVGYjSUUKNpuJUQoOIAyDvEyG8S5yfK6dhZc0Tx1KI/gviKL6qvvFs1+bWtaz58uUNnryq6kt5RzOCkPWlVqVX2a/EEBUdU1KrXLf40GoiiFXK///qpoiDXrOgqDR38JB0bw7SoL+ZB9o1RCkQjQ2CBYZKd/+VJxZRRZlqSkKiws0WFxUyCwsKiMy7hUVFhIaCrNQsKkTIsLivwKKigsj8XYlwt/WKi2N4d//uQRCSAAjURNIHpMZBGYiaQPSYyAAABLAAAAAAAACWAAAAApUF/Mg+0aohSIRobBAsMlO//Kk4soosy1JSFRYWaLC4qZBYWFRGZdwqKiwkNBVmoWFSJkWFxX4FFRQWR+LsS4W/rFRb/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////VEFHAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAU291bmRib3kuZGUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAMjAwNGh0dHA6Ly93d3cuc291bmRib3kuZGUAAAAAAAAAACU=';
-
-const MIN_DURATION_BETWEEN_BEEPS = 100;
-
-let _beepsLeft = 0;
-
-export function beep() {
-  _beepsLeft++;
-  if (_beepsLeft === 1) {
-    playBeep();
-  }
-}
-
-function playBeep() {
-  if (_beepsLeft) {
-    const beep = new Audio(BEEP_DATA);
-    beep.play();
-
-    setTimeout(() => {
-      _beepsLeft--;
-      playBeep();
-    }, MIN_DURATION_BETWEEN_BEEPS);
-  }
-}
diff --git a/apps/fabric-website/src/utilities/debugging.ts b/apps/fabric-website/src/utilities/debugging.ts
deleted file mode 100644
index 5a2bec1b4d120..0000000000000
--- a/apps/fabric-website/src/utilities/debugging.ts
+++ /dev/null
@@ -1,44 +0,0 @@
-import { beep } from './beep';
-
-export function instrumentMethod(target: Object, methodName: string) {
-  const originalMethod = target[methodName];
-
-  target[methodName] = function() {
-    beep();
-
-    let startTime = performance.now();
-    let retVal = originalMethod.apply(this, arguments);
-    let duration = performance.now() - startTime;
-
-    /* tslint:disable:no-console */
-    if (duration <= 1) {
-      console.log(`${ methodName } called`, getStackTrace());
-    } else if (duration <= 10) {
-      console.warn(`${ methodName } called, took ${ Math.round(duration * 1000) / 1000 }ms`, getStackTrace());
-    } else {
-      console.error(`${ methodName } called, took ${ Math.round(duration * 1000) / 1000 }ms`, getStackTrace());
-    }
-    /* tslint:enable:no-console */
-
-    return retVal;
-  };
-}
-
-export function getStackTrace() {
-  let obj = {
-    stack: ''
-  };
-
-  /* tslint:disable:no-string-literal */
-  const captureStackTrace = Error['captureStackTrace'];
-  /* tslint:enable:no-string-literal */
-
-  if (captureStackTrace) {
-    captureStackTrace(obj, getStackTrace);
-    let stackEntries = obj.stack.split('at ');
-
-    obj.stack = stackEntries[2];
-  }
-
-  return obj.stack;
-}
diff --git a/apps/fabric-website/tsconfig.json b/apps/fabric-website/tsconfig.json
index 9b601b1bf53aa..3fd52c50b451e 100644
--- a/apps/fabric-website/tsconfig.json
+++ b/apps/fabric-website/tsconfig.json
@@ -1,6 +1,7 @@
 {
   "compilerOptions": {
     "baseUrl": ".",
+    "outDir": "lib",
     "target": "es5",
     "module": "commonjs",
     "jsx": "react",
diff --git a/apps/fabric-website/tslint.json b/apps/fabric-website/tslint.json
index 621ee6ba04605..c1579f8b41531 100644
--- a/apps/fabric-website/tslint.json
+++ b/apps/fabric-website/tslint.json
@@ -2,5 +2,18 @@
   "extends": [
     "office-ui-fabric-react-tslint"
   ],
-  "rules": {}
+  "rules": {
+    "no-any": false,
+    "no-inferrable-types": false,
+    "typedef": [
+      false
+    ],
+    "max-line-length": [
+      false
+    ],
+    "jsx-alignment": false,
+    "jsx-ban-props": false,
+    "jsx-no-string-ref": false,
+    "jsx-no-bind": false
+  }
 }
\ No newline at end of file
diff --git a/apps/fabric-website/webpack.config.js b/apps/fabric-website/webpack.config.js
index da6b78de48267..8b09feed450ad 100644
--- a/apps/fabric-website/webpack.config.js
+++ b/apps/fabric-website/webpack.config.js
@@ -1,3 +1,46 @@
-module.exports = [].concat(
-  require('./webpack.site.config')
-);
\ No newline at end of file
+const path = require('path');
+const resources = require('../../scripts/tasks/webpack-resources');
+
+const isProduction = process.argv.indexOf('--production') > -1;
+const isDogfood = process.argv.indexOf('--dogfood') > -1;
+const version = require('./package.json').version;
+let publicPath = 'https://static2.sharepointonline.com/files/fabric/fabric-website/dist/';
+
+if (isDogfood) {
+  publicPath = 'https://static2df.sharepointonline.com/files/fabric/fabric-website/dist/';
+} else if (!isProduction) {
+  publicPath = "/dist/";
+}
+const PACKAGE_NAME = 'fabric-site';
+
+module.exports = resources.createConfig(
+  PACKAGE_NAME,
+  isProduction,
+  {
+    entry: {
+      [PACKAGE_NAME]: './lib/root.js'
+    },
+
+    output: {
+      publicPath: publicPath,
+      chunkFilename: `${PACKAGE_NAME}-${version}-[name].min.js`
+    },
+
+    externals: [
+      {
+        'react': 'React'
+      },
+      {
+        'react-dom': 'ReactDOM'
+      },
+    ],
+
+    resolve: {
+      alias: {
+        'office-ui-fabric-react/src': path.join(__dirname, 'node_modules/office-ui-fabric-react/src'),
+        'office-ui-fabric-react/lib': path.join(__dirname, 'node_modules/office-ui-fabric-react/lib')
+      }
+    },
+  },
+  true /* only production */
+);
diff --git a/apps/fabric-website/webpack.serve.config.js b/apps/fabric-website/webpack.serve.config.js
index 889f30ef02729..bc30e2427dec1 100644
--- a/apps/fabric-website/webpack.serve.config.js
+++ b/apps/fabric-website/webpack.serve.config.js
@@ -1,10 +1,9 @@
 let path = require('path');
-let webpack = require('webpack');
-let WebpackNotifierPlugin = require('webpack-notifier');
+let resources = require('../../scripts/tasks/webpack-resources');
 
 const PACKAGE_NAME = require('./package.json').name;
 
-module.exports = {
+module.exports = resources.createServeConfig({
   entry: './src/root.tsx',
 
   output: {
@@ -22,68 +21,7 @@ module.exports = {
       'office-ui-fabric-react/lib': path.join(__dirname, 'node_modules/office-ui-fabric-react/lib'),
       'Props.ts.js': 'Props',
       'Example.tsx.js': 'Example'
-    },
-    extensions: ['.ts', '.tsx', '.js']
-  },
-
-  devtool: 'source-map',
-
-  devServer: {
-    inline: true,
-    port: 4321
-  },
-  module: {
-    loaders: [
-      {
-        test: [/\.tsx?$/],
-        loader: 'ts-loader',
-        exclude: [
-          /node_modules/,
-          /\.scss.ts$/
-        ]
-      },
-      {
-        test: /\.scss$/,
-        enforce: 'pre',
-        exclude: [
-          /node_modules/
-        ],
-        use: [
-          {
-            loader: "load-themed-styles-loader", // creates style nodes from JS strings
-          },
-          {
-            loader: "css-loader", // translates CSS into CommonJS
-            options: {
-              modules: true,
-              importLoaders: 2,
-              localIdentName: '[name]_[local]_[hash:base64:5]',
-              minimize: false
-            }
-          },
-          {
-            loader: 'postcss-loader',
-
-            options: {
-              plugins: function () {
-                return [
-                  require('autoprefixer')
-                ];
-              }
-            }
-          },
-          {
-            loader: "sass-loader",
-          }
-        ]
-      }
-    ]
-  },
+    }
+  }
 
-  plugins: [
-    new webpack.DefinePlugin({
-      'process.env.NODE_ENV': JSON.stringify('production')
-    }),
-    new WebpackNotifierPlugin()
-  ]
-}
+});
diff --git a/apps/fabric-website/webpack.site.config.js b/apps/fabric-website/webpack.site.config.js
deleted file mode 100644
index d6ea9de84d2a5..0000000000000
--- a/apps/fabric-website/webpack.site.config.js
+++ /dev/null
@@ -1,91 +0,0 @@
-'use strict';
-
-/** Note: this require may need to be fixed to point to the build that exports the gulp-core-build-webpack instance. */
-let webpackTaskResources = require('@microsoft/web-library-build').webpack.resources;
-let webpack = webpackTaskResources.webpack;
-let BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
-let isProduction = process.argv.indexOf('--production') > -1;
-let isDogfood = process.argv.indexOf('--dogfood') > -1;
-let path = require('path');
-const version = require('./package.json').version;
-
-let publicPath = 'https://static2.sharepointonline.com/files/fabric/fabric-website/dist/';
-
-if (isDogfood) {
-  publicPath = 'https://static2df.sharepointonline.com/files/fabric/fabric-website/dist/';
-} else if (!isProduction) {
-  publicPath = "/dist/";
-}
-
-// Create an array of configs, prepopulated with a debug (non-minified) build.
-let configs = [
-  createConfig(false, publicPath)
-];
-
-// Create a production config if applicable.
-if (isProduction) {
-  configs.push(createConfig(true, publicPath));
-}
-
-// Helper to create the config.
-function createConfig(isProduction, publicPath) {
-  let today = new Date();
-  let date = today.getFullYear() + '-' + (today.getMonth() + 1) + '-' + today.getDate();
-  let minFileNamePart = isProduction ? '.min' : '';
-  let webpackConfig = {
-
-    entry: {
-      'fabric-site': './lib/root.js'
-    },
-
-    output: {
-      path: path.join(__dirname, '/dist'),
-      publicPath: publicPath,
-      filename: `[name]${minFileNamePart}.js`,
-      chunkFilename: `fabric-site-${version}-[name]${minFileNamePart}.js`
-    },
-
-    devServer: {
-      stats: 'none'
-    },
-
-    externals: [
-      {
-        'react': 'React'
-      },
-      {
-        'react-dom': 'ReactDOM'
-      },
-    ],
-
-    resolve: {
-      alias: {
-        'office-ui-fabric-react/src': path.join(__dirname, 'node_modules/office-ui-fabric-react/src'),
-        'office-ui-fabric-react/lib': path.join(__dirname, 'node_modules/office-ui-fabric-react/lib')
-      },
-      extensions: ['', '.js']
-    },
-
-    module: {
-      noParse: [/autoit.js/],
-      loaders: [
-        { test: /\.json$/, loader: 'json', enforce: 'pre' }
-      ]
-    },
-
-    plugins: []
-  };
-
-  if (isProduction) {
-    webpackConfig.plugins.push(new webpack.optimize.UglifyJsPlugin({
-      minimize: true,
-      compress: {
-        warnings: false
-      }
-    }));
-  }
-
-  return webpackConfig;
-}
-
-module.exports = configs;
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 0cb70fd90b59c..761c1b12b59f3 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -8,7 +8,7 @@
     "url": "https://github.com/OfficeDev/office-ui-fabric-react"
   },
   "scripts": {
-    "_webpack": "node ./node_modules/webpack/bin/webpack --config webpack.config.js",
+    "_webpack": "node ../../scripts/build.js webpack",
     "_mocha": "node ./node_modules/mocha/bin/_mocha dist/ssr-tests.js",
     "_test": "npm run _webpack && npm run _mocha",
     "build": "npm run _test",
@@ -28,11 +28,10 @@
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
     "react-dom": "^15.4.2",
-    "webpack": "^3.4.1",
-    "webpack-node-externals": "^1.5.4"
+    "webpack": "^3.5.5"
   },
   "dependencies": {
     "es6-promise": "^4.1.0",
-    "tslib": "^1.6.0"
+    "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/webpack.config.js b/apps/ssr-tests/webpack.config.js
index bbe4265db6033..9c15a6ffe071b 100644
--- a/apps/ssr-tests/webpack.config.js
+++ b/apps/ssr-tests/webpack.config.js
@@ -1,49 +1,34 @@
-let path = require('path');
-let nodeExternals = require('webpack-node-externals');
-let webpack = require('webpack');
+const path = require('path');
+const resources = require('../../scripts/tasks/webpack-resources');
 
-module.exports = {
-  entry: './test/test.js',
+module.exports = resources.createConfig(
+  'ssr-tests',
+  false,
+  {
+    entry: './test/test.js',
 
-  output: {
-    filename: 'dist/ssr-tests.js',
-  },
-
-  target: 'node',
-
-  externals: [
-    //  nodeExternals()
-    "vertx"
-  ],
+    output: {
+      filename: 'ssr-tests.js',
+    },
 
-  node: {
-    fs: 'empty'
-  },
+    target: 'node',
 
-  resolve: {
-    alias: {
-      'office-ui-fabric-react/src': path.join(__dirname, '../../packages/office-ui-fabric-react/src'),
-      'office-ui-fabric-react/lib': path.join(__dirname, '../../packages/office-ui-fabric-react/lib'),
-      'Props.ts.js': 'Props'
+    node: {
+      fs: 'empty'
     },
-    extensions: ['.js', '.tsx']
-  },
 
-  devtool: 'source-map',
-
-  devServer: {
-    inline: true,
-    port: 4321
-  },
+    resolve: {
+      alias: {
+        'office-ui-fabric-react/src': path.join(__dirname, '../../packages/office-ui-fabric-react/src'),
+        'office-ui-fabric-react/lib': path.join(__dirname, '../../packages/office-ui-fabric-react/lib'),
+        'Props.ts.js': 'Props'
+      },
+      extensions: ['.js', '.tsx']
+    },
 
-  module: {
-    loaders: [
+    plugins: [
+      new resources.webpack.DefinePlugin({
+        'process.env.NODE_ENV': JSON.stringify('production')
+      }),
     ]
-  },
-
-  plugins: [
-    new webpack.DefinePlugin({
-      'process.env.NODE_ENV': JSON.stringify('production')
-    }),
-  ]
-}
+  });
diff --git a/apps/test-bundle-button/check-size.js b/apps/test-bundle-button/check-size.js
deleted file mode 100644
index de7ae65302aec..0000000000000
--- a/apps/test-bundle-button/check-size.js
+++ /dev/null
@@ -1,12 +0,0 @@
-let gzipSize = require('gzip-size');
-let fs = require('fs');
-let files = [
-  'dist/test-bundle-button.js'
-];
-
-for (let file of files) {
-  let content = fs.readFileSync(file, 'utf8');
-  let size = gzipSize.sync(content);
-
-  console.log(`${file} - min: ${content.length} bytes, gzip: ${size} bytes`);
-}
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 7eda65bda1c4f..0a8058190655b 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -11,31 +11,22 @@
   },
   "license": "MIT",
   "scripts": {
-    "_checksize": "node check-size.js",
-    "_bundle": "node node_modules/webpack/bin/webpack --config webpack.config.js && echo Done",
-    "build": "npm run _bundle && npm run _checksize",
-    "clean": "",
-    "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.serve.config.js --open"
+    "build": "node ../../scripts/build.js",
+    "clean": "node ../../scripts/clean.js",
+    "start": "node ../../scripts/start.js"
   },
   "devDependencies": {
-    "@microsoft/web-library-build": "^3.2.1",
     "@types/react": "15.0.38",
     "@types/react-addons-test-utils": "0.14.18",
     "@types/react-dom": "15.5.1",
     "@types/webpack-env": "1.13.0",
     "@types/prop-types": "15.5.1",
-    "gzip-size": "^3.0.0",
-    "source-map-loader": "^0.2.1",
-    "ts-loader": "^2.0.1",
-    "typescript": "2.4.2",
-    "webpack": "^3.4.1",
-    "webpack-bundle-analyzer": "^2.2.1",
-    "webpack-dev-server": "^2.4.1"
+    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0"
   },
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "office-ui-fabric-react": ">=4.37.7 <5.0.0",
-    "tslib": "^1.6.0"
+    "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/test-bundle-button/tsconfig.json b/apps/test-bundle-button/tsconfig.json
index ae12d160c00f1..fae99682d09cb 100644
--- a/apps/test-bundle-button/tsconfig.json
+++ b/apps/test-bundle-button/tsconfig.json
@@ -1,6 +1,7 @@
 {
   "compilerOptions": {
     "baseUrl": ".",
+    "outDir": "lib",
     "target": "es5",
     "module": "commonjs",
     "jsx": "react",
@@ -15,10 +16,7 @@
     ],
     "paths": {}
   },
-  "exclude": [
-    "node_modules",
-    "dist",
-    "lib",
-    "lib-amd"
+  "include": [
+    "src"
   ]
 }
\ No newline at end of file
diff --git a/apps/test-bundle-button/webpack.config.js b/apps/test-bundle-button/webpack.config.js
index 0fc4ff8b84571..475e48ba7a49a 100644
--- a/apps/test-bundle-button/webpack.config.js
+++ b/apps/test-bundle-button/webpack.config.js
@@ -1,60 +1,18 @@
 const path = require('path');
-const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
-const webpack = require('webpack');
-const PACKAGE_NAME = require('./package.json').name;
+const resources = require('../../scripts/tasks/webpack-resources');
 
-module.exports = {
-  entry: './src/index.tsx',
+const PACKAGE_NAME = 'test-bundle-button';
 
-  output: {
-    path: path.join(__dirname, 'dist'),
-    filename: PACKAGE_NAME + '.js',
-  },
+module.exports = resources.createConfig(
+  PACKAGE_NAME,
+  true,
+  {
+    entry: './lib/index.js',
 
-  externals: {
-    'react': 'React',
-    'react-dom': 'ReactDOM'
-  },
+    externals: {
+      'react': 'React',
+      'react-dom': 'ReactDOM'
+    }
 
-  resolve: {
-    alias: {},
-    extensions: ['.ts', '.tsx', '.js']
-  },
+  });
 
-  devServer: {
-    inline: true,
-    port: 4321
-  },
-
-  module: {
-    loaders: [
-      {
-        test: [/\.tsx?$/],
-        loader: 'ts-loader',
-        exclude: [
-          /node_modules/,
-          /\.scss.ts$/
-        ]
-      }
-    ]
-  },
-
-  plugins: [
-    new webpack.DefinePlugin({
-      'process.env.NODE_ENV': JSON.stringify('production')
-    }),
-    new webpack.optimize.UglifyJsPlugin({
-      minimize: true,
-      compress: {
-        warnings: false
-      }
-    }),
-    new BundleAnalyzerPlugin({
-      analyzerMode: 'static',
-      reportFilename: PACKAGE_NAME + '.stats.html',
-      openAnalyzer: false,
-      generateStatsFile: true,
-      statsFilename: PACKAGE_NAME + '.stats.json'
-    }),
-  ]
-}
diff --git a/apps/todo-app/gulpfile.js b/apps/todo-app/gulpfile.js
deleted file mode 100644
index 71bc35cd89bf3..0000000000000
--- a/apps/todo-app/gulpfile.js
+++ /dev/null
@@ -1,47 +0,0 @@
-'use strict';
-
-let build = require('@microsoft/web-library-build');
-let serial = build.serial;
-
-build.tslint.isEnabled = () => false;
-build.karma.isEnabled = () => false;
-
-// Configure TypeScript.
-build.TypeScriptConfiguration.setTypescriptCompiler(require('typescript'));
-
-// Use css modules.
-build.sass.setConfig({
-  useCSSModules: true,
-  moduleExportName: ''
-});
-
-// Set up a "rushBuild" subTask that will spawn rush build
-let fs = require('fs');
-let spawn = require('child_process').spawn;
-let rawStdout = new fs.SyncWriteStream(1, { autoClose: false });
-
-let rushBuild = build.subTask('rushbuild', (gulp, options, done) => {
-  let child = spawn(
-    'rush',
-    ['build', '--to', 'todo-app']
-  );
-
-  child.stdout.on('data', data => rawStdout.write(data));
-  child.on('close', done);
-});
-
-const sourceMatch = [
-  'src/**/*.{ts,tsx,scss,js,txt,html}',
-  '!src/**/*.scss.ts'
-];
-
-build.task('serve', serial(
-  build.serve,
-  build.watch(sourceMatch, serial(
-    rushBuild,
-    build.reload
-  ))));
-
-build.initialize(require('gulp'));
-
-
diff --git a/apps/todo-app/index.html b/apps/todo-app/index.html
index 8a7d857094fad..5fd2c3c069444 100644
--- a/apps/todo-app/index.html
+++ b/apps/todo-app/index.html
@@ -6,15 +6,13 @@
   <meta http-equiv="X-UA-Compatible" content="IE=edge" />
   <meta name="viewport" content="width=device-width, initial-scale=1" />
 
-  <title>Test Page</title>
-
-  <link rel="stylesheet" type="text/css" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/6.0.0/css/fabric.min.css">
-  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.2.0/react.min.js"></script>
-  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.2.0/react-dom.min.js"></script>
+  <title>Todo App</title>
+  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react.min.js"></script>
+  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react-dom.min.js"></script>
 </head>
 
 <body>
-  <script type="text/javascript" src="dist/todo-app.js"></script>
+  <script type="text/javascript" src="todo-app.js"></script>
 </body>
 
 </html>
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 161a8b8b98770..fdf8165dbb8db 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -4,13 +4,11 @@
   "version": "1.0.3",
   "private": true,
   "scripts": {
-    "build": "gulp",
-    "clean": "gulp clean",
-    "start": "gulp serve",
-    "test": "gulp test"
+    "build": "node ../../scripts/build.js",
+    "clean": "node ../../scripts/clean.js",
+    "start": "node ../../scripts/start.js"
   },
   "devDependencies": {
-    "@microsoft/web-library-build": "^3.2.1",
     "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.0",
     "@types/es6-promise": "^0.0.32",
@@ -19,17 +17,17 @@
     "@types/react-addons-test-utils": "0.14.18",
     "@types/react-dom": "15.5.1",
     "@types/webpack-env": "1.13.0",
+    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
     "react-addons-test-utils": "^15.4.2"
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.37.7 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
-    "tslib": "^1.6.0"
+    "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/src/DataProvider.ts b/apps/todo-app/src/DataProvider.ts
index c2c2b286f8270..9074b13c49484 100644
--- a/apps/todo-app/src/DataProvider.ts
+++ b/apps/todo-app/src/DataProvider.ts
@@ -118,7 +118,7 @@ export default class DataProvider implements IDataProvider {
       const index: number =
         findIndex(
           this.items,
-          (item: ITodoItem) => item.id === newItem.id
+          (current: ITodoItem) => current.id === newItem.id
         );
       if (index !== -1) {
         this.items[index] = newItem;
@@ -159,9 +159,15 @@ export default class DataProvider implements IDataProvider {
   }
 
   private _generateGuid(): string {
-    return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
-      var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
-      return v.toString(16);
-    });
+    return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(
+      /[xy]/g,
+      (c) => {
+        // tslint:disable-next-line:no-bitwise
+        const r = Math.random() * 16 | 0;
+        // tslint:disable-next-line:no-bitwise
+        const v = c === 'x' ? r : (r & 0x3 | 0x8);
+
+        return v.toString(16);
+      });
   }
 }
diff --git a/apps/todo-app/src/components/Todo.module.scss b/apps/todo-app/src/components/Todo.scss
similarity index 95%
rename from apps/todo-app/src/components/Todo.module.scss
rename to apps/todo-app/src/components/Todo.scss
index 96ca35198a3cc..5f48aab610e25 100644
--- a/apps/todo-app/src/components/Todo.module.scss
+++ b/apps/todo-app/src/components/Todo.scss
@@ -1,4 +1,4 @@
-@import "~/office-ui-fabric-core/dist/sass/References";
+@import "~office-ui-fabric-react/dist/sass/References";
 
 .todo {
   padding: 28px 40px 60px 40px;
@@ -25,6 +25,7 @@
     .textField {
       display: table-cell;
       width: 100%;
+      vertical-align: top;
     }
     .addButton {
       display: table-cell;
diff --git a/apps/todo-app/src/components/Todo.tsx b/apps/todo-app/src/components/Todo.tsx
index a9ee3fa419776..09adfe573f9d2 100644
--- a/apps/todo-app/src/components/Todo.tsx
+++ b/apps/todo-app/src/components/Todo.tsx
@@ -1,12 +1,11 @@
 import * as React from 'react';
 import { Spinner, SpinnerType } from 'office-ui-fabric-react/lib/Spinner';
-import DataProvider from '../DataProvider';
-import { ITodoProps, ITodoState, ITodoItem, ITodoItemProps } from '../types/index';
+import { ITodoProps, ITodoState } from '../types/index';
 
 import TodoForm from './TodoForm';
 import TodoTabs from './TodoTabs';
 
-import * as stylesImport from './Todo.module.scss';
+import * as stylesImport from './Todo.scss';
 const styles: any = stylesImport;
 import strings from '../strings';
 
@@ -55,19 +54,19 @@ export default class Todo extends React.Component<ITodoProps, ITodoState> {
   }
 
   private _renderWorkingOnItSpinner(): React.ReactElement<React.HTMLAttributes<HTMLDivElement>> {
-    return this.props.dataProvider.isLoading && this.state.items.length > 0
-      ? <div className={ styles.workingOnItSpinner }>
+    return (this.props.dataProvider.isLoading && this.state.items.length > 0) && (
+      <div className={ styles.workingOnItSpinner }>
         <Spinner type={ SpinnerType.normal } />
       </div>
-      : undefined;
+    );
   }
 
   private _renderFetchingTasksSpinner(): React.ReactElement<React.HTMLAttributes<HTMLDivElement>> {
-    return this.props.dataProvider.isLoading && this.state.items.length === 0
-      ? <div className={ styles.fetchingTasksSpinner }>
+    return (this.props.dataProvider.isLoading && this.state.items.length === 0) && (
+      <div className={ styles.fetchingTasksSpinner }>
         <Spinner type={ SpinnerType.large } label={ strings.fetchingTasksLabel } />
       </div>
-      : undefined;
+    );
   }
 
   private _onProviderChange(): void {
diff --git a/apps/todo-app/src/components/TodoForm.tsx b/apps/todo-app/src/components/TodoForm.tsx
index 46b1ae6ee47ef..734130cb0c53e 100644
--- a/apps/todo-app/src/components/TodoForm.tsx
+++ b/apps/todo-app/src/components/TodoForm.tsx
@@ -3,7 +3,7 @@ import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
 import { ITodoFormProps, ITodoFormState } from '../types/index';
-import * as stylesImport from './Todo.module.scss';
+import * as stylesImport from './Todo.scss';
 const styles: any = stylesImport;
 import strings from './../strings';
 
diff --git a/apps/todo-app/src/components/TodoItem.tsx b/apps/todo-app/src/components/TodoItem.tsx
index f9ed464eb7a60..0ec6c4db0e265 100644
--- a/apps/todo-app/src/components/TodoItem.tsx
+++ b/apps/todo-app/src/components/TodoItem.tsx
@@ -2,11 +2,10 @@ import * as React from 'react';
 import { IconButton } from 'office-ui-fabric-react/lib/Button';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { FocusZone, FocusZoneDirection } from 'office-ui-fabric-react/lib/FocusZone';
-import { DocumentCardActivity } from 'office-ui-fabric-react/lib/DocumentCard';
 import { css } from 'office-ui-fabric-react/lib/Utilities';
 import { ITodoItem, ITodoItemProps } from '../types/index';
 
-import * as stylesImport from './Todo.module.scss';
+import * as stylesImport from './Todo.scss';
 const styles: any = stylesImport;
 import strings from './../strings';
 
@@ -19,7 +18,7 @@ import strings from './../strings';
  * Link of DocumentCardActivity: https://fabricreact.azurewebsites.net/fabric-react/master/#/examples/documentcard
  */
 export default class TodoItem extends React.Component<ITodoItemProps, {}> {
-  private static ANIMATION_TIMEOUT: number = 200;
+  private static ANIMATION_TIMEOUT = 200;
 
   private _animationTimeoutId: number;
   private _rowItem: HTMLDivElement;
diff --git a/apps/todo-app/src/components/TodoTabs.tsx b/apps/todo-app/src/components/TodoTabs.tsx
index ee60406511adc..c7fd2422c824a 100644
--- a/apps/todo-app/src/components/TodoTabs.tsx
+++ b/apps/todo-app/src/components/TodoTabs.tsx
@@ -5,13 +5,13 @@ import {
   IPivotProps,
   PivotLinkSize
 } from 'office-ui-fabric-react/lib/Pivot';
-import { FocusZone, FocusZoneDirection, IFocusZoneProps } from 'office-ui-fabric-react/lib/FocusZone';
+import { FocusZone, FocusZoneDirection } from 'office-ui-fabric-react/lib/FocusZone';
 import { List } from 'office-ui-fabric-react/lib/List';
-import { KeyCodes } from 'office-ui-fabric-react/lib/Utilities';
+import { KeyCodes, autobind } from 'office-ui-fabric-react/lib/Utilities';
 import TodoItem from './TodoItem';
 import { ITodoItem, ITodoItemProps, ITodoTabsProps } from '../types/index';
 
-import * as stylesImport from './Todo.module.scss';
+import * as stylesImport from './Todo.scss';
 const styles: any = stylesImport;
 import strings from './../strings';
 
@@ -61,7 +61,7 @@ export default class TodoTabs extends React.Component<ITodoTabsProps, {}> {
       <PivotItem linkText={ `${tabName} (${tasks.length})` }>
         <FocusZone
           direction={ FocusZoneDirection.vertical }
-          isInnerZoneKeystroke={ ev => ev.which === KeyCodes.right }
+          isInnerZoneKeystroke={ this._isInnerZoneKeystroke }
         >
           <List
             className={ styles.todoList }
@@ -73,6 +73,11 @@ export default class TodoTabs extends React.Component<ITodoTabsProps, {}> {
     );
   }
 
+  @autobind
+  private _isInnerZoneKeystroke(ev): boolean {
+    return ev.which === KeyCodes.right;
+  }
+
   private _onRenderTodoItem(item: ITodoItem): React.ReactElement<ITodoItemProps> {
     return (
       <TodoItem
diff --git a/apps/todo-app/src/index.tsx b/apps/todo-app/src/index.tsx
index 5738d81f1ff7f..370e3884de410 100644
--- a/apps/todo-app/src/index.tsx
+++ b/apps/todo-app/src/index.tsx
@@ -4,7 +4,6 @@ import * as ReactDOM from 'react-dom';
 import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
 import Todo from './components/Todo';
 import DataProvider from './DataProvider';
-import { ITodoProps } from './types/index';
 
 let _rootDiv: HTMLElement;
 let _dataProvider = new DataProvider();
@@ -19,7 +18,7 @@ function start(): void {
     <Fabric>
       <Todo
         dataProvider={ _dataProvider }
-        />
+      />
     </Fabric>,
     _rootDiv);
 }
diff --git a/apps/todo-app/src/strings.ts b/apps/todo-app/src/strings.ts
index 4363a29238f80..d15a90802ef73 100644
--- a/apps/todo-app/src/strings.ts
+++ b/apps/todo-app/src/strings.ts
@@ -13,6 +13,6 @@ const strings = {
   deleteItemAriaLabel: 'Delete',
   workingOnSpinnerLabel: 'Working on...',
   titleEmptyErrorMessage: 'You can not leave this blank.'
-}
+};
 
 export default strings;
\ No newline at end of file
diff --git a/apps/todo-app/tsconfig.json b/apps/todo-app/tsconfig.json
index 5522ea6798234..7d3ecc1ecc28d 100644
--- a/apps/todo-app/tsconfig.json
+++ b/apps/todo-app/tsconfig.json
@@ -1,6 +1,7 @@
 {
   "compilerOptions": {
     "target": "es5",
+    "outDir": "lib",
     "module": "commonjs",
     "jsx": "react",
     "declaration": true,
@@ -14,10 +15,7 @@
       "webpack-env"
     ]
   },
-  "exclude": [
-    "node_modules",
-    "dist",
-    "lib",
-    "lib-amd"
+  "include": [
+    "src"
   ]
 }
\ No newline at end of file
diff --git a/apps/todo-app/tslint.json b/apps/todo-app/tslint.json
new file mode 100644
index 0000000000000..cd3b575b4545f
--- /dev/null
+++ b/apps/todo-app/tslint.json
@@ -0,0 +1,11 @@
+{
+  "extends": [
+    "office-ui-fabric-react-tslint"
+  ],
+  "rules": {
+    "no-any": false,
+    "typedef": [
+      false
+    ]
+  }
+}
\ No newline at end of file
diff --git a/apps/todo-app/webpack.config.js b/apps/todo-app/webpack.config.js
index 3fb1f0a32ca1a..6dacd4fb0b319 100644
--- a/apps/todo-app/webpack.config.js
+++ b/apps/todo-app/webpack.config.js
@@ -1,59 +1,29 @@
-'use strict';
-
-/** Note: this require may need to be fixed to point to the build that exports the gulp-core-build-webpack instance. */
-let webpackTaskResources = require('@microsoft/web-library-build').webpack.resources;
-let webpack = webpackTaskResources.webpack;
-
 let path = require('path');
-let isProduction = process.argv.indexOf('--production') > -1;
-let packageJSON = require('./package.json');
-
-let webpackConfig = {
-  context: path.join(__dirname, 'lib/'),
-
-  entry: {
-    [packageJSON.name]: './index.js'
-  },
-
-  output: {
-    libraryTarget: 'umd',
-    path: path.join(__dirname, '/dist'),
-    filename: `[name]${isProduction ? '.min' : ''}.js`
-  },
+const resources = require('../../scripts/tasks/webpack-resources');
 
-  devtool: 'source-map',
+const BUNDLE_NAME = 'todo-app';
+const IS_PRODUCTION = process.argv.indexOf('--production') > -1;
 
-  devServer: {
-    stats: 'none'
-  },
-
-  externals: [
-    {
-      'react': 'React'
+module.exports = resources.createConfig(
+  BUNDLE_NAME,
+  IS_PRODUCTION,
+  {
+    entry: {
+      [BUNDLE_NAME]: './lib/index.js'
+    },
 
+    output: {
+      libraryTarget: 'var',
+      library: 'Fabric'
     },
-    {
-      'react-dom': 'ReactDOM'
-    }
-  ],
 
-  module: {
-    loaders: [
+    externals: [
+      {
+        'react': 'React',
+      },
+      {
+        'react-dom': 'ReactDOM'
+      }
     ]
-  },
-
-  plugins: [
-    //  new WebpackNotifierPlugin()
-  ]
-};
-
-if (isProduction) {
-  webpackConfig.plugins.push(new webpack.optimize.UglifyJsPlugin({
-    minimize: true,
-    compress: {
-      warnings: false
-    }
-  }));
-}
-
-module.exports = webpackConfig;
\ No newline at end of file
+  }
+);
diff --git a/apps/todo-app/webpack.serve.config.js b/apps/todo-app/webpack.serve.config.js
new file mode 100644
index 0000000000000..c89a0af2be9e4
--- /dev/null
+++ b/apps/todo-app/webpack.serve.config.js
@@ -0,0 +1,17 @@
+const path = require('path');
+const resources = require('../../scripts/tasks/webpack-resources');
+const isProduction = process.argv.indexOf('--production') > -1;
+const PACKAGE_NAME = 'todo-app';
+
+module.exports = resources.createServeConfig({
+  entry: './src/index.tsx',
+  output: {
+    filename: 'todo-app.js'
+  },
+
+  externals: {
+    'react': 'React',
+    'react-dom': 'ReactDOM'
+  }
+
+});
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 867d44b59c272..b0d35e422fdad 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -3,1199 +3,653 @@
   "version": "0.0.0",
   "lockfileVersion": 1,
   "dependencies": {
-    "@microsoft/api-extractor": {
-      "version": "2.3.3",
-      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-2.3.3.tgz",
-      "integrity": "sha1-BIDn0JDTDRy0uchpeMFakIXJO7o="
+    "@microsoft/load-themed-styles": {
+      "version": "1.7.2",
+      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.2.tgz",
+      "integrity": "sha1-Hv4yu8cRKZBl7RMYEg5olF9LZ0E="
     },
-    "@microsoft/gulp-core-build": {
-      "version": "2.9.4",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.9.4.tgz",
-      "integrity": "sha1-3CTaxi7YWEYuHpukLvyQsus6i4A=",
-      "dependencies": {
-        "@types/chai": {
-          "version": "3.4.34",
-          "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz",
-          "integrity": "sha1-1TNXkoI7sJzd1eOMPSEbcJGDhU0="
-        },
-        "@types/mocha": {
-          "version": "2.2.38",
-          "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz",
-          "integrity": "sha1-jBiPbjTC58Px0BJ9kI1aNuWmDck="
-        },
-        "rimraf": {
-          "version": "2.5.4",
-          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
-          "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
-        },
-        "yargs": {
-          "version": "4.6.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz",
-          "integrity": "sha1-y0BQwBWb+2u2ScD0r1UFJqhGGdw="
-        }
-      }
+    "@microsoft/loader-load-themed-styles": {
+      "version": "1.4.2",
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.4.2.tgz",
+      "integrity": "sha1-uppUNhnV2V+BXJige3eSxxaE0nM="
     },
-    "@microsoft/gulp-core-build-karma": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-karma/-/gulp-core-build-karma-2.2.2.tgz",
-      "integrity": "sha1-L910uWl7x2VZjGwrOCxR9XBhSmg=",
+    "@rush-temp/build": {
+      "version": "file:projects/build",
       "dependencies": {
-        "camelcase": {
-          "version": "1.2.1",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
-          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
+        "acorn": {
+          "version": "5.1.1",
+          "bundled": true
         },
-        "cliui": {
+        "ajv": {
+          "version": "5.2.2",
+          "bundled": true
+        },
+        "ajv-keywords": {
           "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
-          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE="
+          "bundled": true
         },
-        "interpret": {
-          "version": "0.6.6",
-          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz",
-          "integrity": "sha1-/s16GOfOXKar+5U+H4YhOknxYls="
+        "ansi-regex": {
+          "version": "3.0.0",
+          "bundled": true
         },
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+        "ansi-styles": {
+          "version": "2.2.1",
+          "bundled": true
         },
-        "karma-sinon-chai": {
-          "version": "1.2.4",
-          "resolved": "https://registry.npmjs.org/karma-sinon-chai/-/karma-sinon-chai-1.2.4.tgz",
-          "integrity": "sha1-/qk19ivjNmzwJxyNi+UcDHDkCrw=",
-          "dependencies": {
-            "lolex": {
-              "version": "1.6.0",
-              "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
-              "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
-            }
-          }
+        "async": {
+          "version": "2.5.0",
+          "bundled": true
         },
-        "memory-fs": {
-          "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz",
-          "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
+        "autoprefixer": {
+          "version": "7.1.2",
+          "bundled": true
         },
-        "readable-stream": {
+        "browserslist": {
           "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
+          "bundled": true
         },
-        "sinon": {
-          "version": "1.17.7",
-          "resolved": "https://registry.npmjs.org/sinon/-/sinon-1.17.7.tgz",
-          "integrity": "sha1-RUKk9JugxFwF6y6d2dID4rjv4L8=",
+        "camelcase": {
+          "version": "4.1.0",
+          "bundled": true
+        },
+        "cliui": {
+          "version": "3.2.0",
+          "bundled": true,
           "dependencies": {
-            "lolex": {
-              "version": "1.3.2",
-              "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.3.2.tgz",
-              "integrity": "sha1-fD2mL/yzDw9agKJWbKJORdigHzE="
+            "ansi-regex": {
+              "version": "2.1.1",
+              "bundled": true
+            },
+            "is-fullwidth-code-point": {
+              "version": "1.0.0",
+              "bundled": true
+            },
+            "string-width": {
+              "version": "1.0.2",
+              "bundled": true
+            },
+            "strip-ansi": {
+              "version": "3.0.1",
+              "bundled": true
             }
           }
         },
-        "sinon-chai": {
-          "version": "2.8.0",
-          "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.8.0.tgz",
-          "integrity": "sha1-Qyqbv9Uab8AHmPTSUmqCnAYGh6w="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
+        "constants-browserify": {
+          "version": "1.0.0",
+          "bundled": true
         },
-        "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        "crypto-browserify": {
+          "version": "3.11.1",
+          "bundled": true
         },
-        "uglify-js": {
-          "version": "2.7.5",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.7.5.tgz",
-          "integrity": "sha1-RhLAx7qu4rp8SH3kkErhIgefLKg=",
+        "css-loader": {
+          "version": "0.28.5",
+          "bundled": true,
           "dependencies": {
-            "async": {
-              "version": "0.2.10",
-              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz",
-              "integrity": "sha1-trvgsGdLnXGXCMo43owjfLUmw9E="
+            "ansi-regex": {
+              "version": "2.1.1",
+              "bundled": true
+            },
+            "chalk": {
+              "version": "1.1.3",
+              "bundled": true,
+              "dependencies": {
+                "supports-color": {
+                  "version": "2.0.0",
+                  "bundled": true
+                }
+              }
+            },
+            "has-flag": {
+              "version": "1.0.0",
+              "bundled": true
+            },
+            "postcss": {
+              "version": "5.2.17",
+              "bundled": true
+            },
+            "strip-ansi": {
+              "version": "3.0.1",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "3.2.3",
+              "bundled": true
             }
           }
         },
-        "webpack": {
-          "version": "1.13.3",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz",
-          "integrity": "sha1-55xG/lo3xcpwCEugiUxZXNy0KBU="
+        "debug": {
+          "version": "2.6.8",
+          "bundled": true
         },
-        "window-size": {
-          "version": "0.1.0",
-          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
-          "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
+        "enhanced-resolve": {
+          "version": "3.4.1",
+          "bundled": true
         },
-        "wordwrap": {
-          "version": "0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
-          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
+        "etag": {
+          "version": "1.8.0",
+          "bundled": true
         },
-        "yargs": {
-          "version": "3.10.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
-          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
-        }
-      }
-    },
-    "@microsoft/gulp-core-build-sass": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.1.2.tgz",
-      "integrity": "sha1-msehN3WBLY3s1/BOQrfy1BKjnCc=",
-      "dependencies": {
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
-          "dependencies": {
-            "supports-color": {
-              "version": "2.0.0",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-            }
-          }
+        "express": {
+          "version": "4.15.4",
+          "bundled": true
         },
-        "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        "find-up": {
+          "version": "2.1.0",
+          "bundled": true
         },
-        "postcss-modules": {
-          "version": "0.6.4",
-          "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.6.4.tgz",
-          "integrity": "sha1-d6WLt3uhtDkrJwwLWYUv116JqLQ="
+        "fresh": {
+          "version": "0.5.0",
+          "bundled": true
         },
-        "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
-        }
-      }
-    },
-    "@microsoft/gulp-core-build-serve": {
-      "version": "2.1.3",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-serve/-/gulp-core-build-serve-2.1.3.tgz",
-      "integrity": "sha1-k9LYWMLwL+3wxZSKal4KQ8XjqCU="
-    },
-    "@microsoft/gulp-core-build-typescript": {
-      "version": "3.4.2",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.4.2.tgz",
-      "integrity": "sha1-+DHJLG36ogub6HPmPhVxZRKW9Yk="
-    },
-    "@microsoft/gulp-core-build-webpack": {
-      "version": "1.1.6",
-      "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-webpack/-/gulp-core-build-webpack-1.1.6.tgz",
-      "integrity": "sha1-OloimWPldBfH8WPd99iNfPdm8uA=",
-      "dependencies": {
-        "camelcase": {
-          "version": "1.2.1",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
-          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
+        "has-flag": {
+          "version": "2.0.0",
+          "bundled": true
         },
-        "cliui": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
-          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE="
+        "https-browserify": {
+          "version": "0.0.1",
+          "bundled": true
         },
-        "interpret": {
-          "version": "0.6.6",
-          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz",
-          "integrity": "sha1-/s16GOfOXKar+5U+H4YhOknxYls="
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "bundled": true
         },
         "isarray": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+          "bundled": true
         },
-        "memory-fs": {
-          "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz",
-          "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
+        "load-json-file": {
+          "version": "2.0.0",
+          "bundled": true
         },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
+        "loader-utils": {
+          "version": "1.1.0",
+          "bundled": true
         },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
+        "lodash.camelcase": {
+          "version": "4.3.0",
+          "bundled": true
         },
-        "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        "mime": {
+          "version": "1.3.4",
+          "bundled": true
+        },
+        "node-libs-browser": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "os-browserify": {
+          "version": "0.2.1",
+          "bundled": true
+        },
+        "os-locale": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "path-to-regexp": {
+          "version": "0.1.7",
+          "bundled": true
+        },
+        "path-type": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "qs": {
+          "version": "6.5.0",
+          "bundled": true
+        },
+        "read-pkg": {
+          "version": "2.0.0",
+          "bundled": true
         },
-        "uglify-js": {
-          "version": "2.7.5",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.7.5.tgz",
-          "integrity": "sha1-RhLAx7qu4rp8SH3kkErhIgefLKg=",
+        "read-pkg-up": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "readable-stream": {
+          "version": "2.3.3",
+          "bundled": true,
           "dependencies": {
-            "async": {
-              "version": "0.2.10",
-              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz",
-              "integrity": "sha1-trvgsGdLnXGXCMo43owjfLUmw9E="
+            "string_decoder": {
+              "version": "1.0.3",
+              "bundled": true
             }
           }
         },
-        "webpack": {
-          "version": "1.13.3",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz",
-          "integrity": "sha1-55xG/lo3xcpwCEugiUxZXNy0KBU="
+        "semver": {
+          "version": "5.4.1",
+          "bundled": true
         },
-        "window-size": {
-          "version": "0.1.0",
-          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
-          "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
+        "send": {
+          "version": "0.15.4",
+          "bundled": true
         },
-        "wordwrap": {
-          "version": "0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
-          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
+        "serve-static": {
+          "version": "1.12.4",
+          "bundled": true
         },
-        "yargs": {
-          "version": "3.10.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
-          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
-        }
-      }
-    },
-    "@microsoft/load-themed-styles": {
-      "version": "1.7.2",
-      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.2.tgz",
-      "integrity": "sha1-Hv4yu8cRKZBl7RMYEg5olF9LZ0E="
-    },
-    "@microsoft/loader-cased-file": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-cased-file/-/loader-cased-file-1.0.1.tgz",
-      "integrity": "sha1-89JNxxtO1lEt6I+u0AyCf5ehWhY=",
-      "dependencies": {
-        "@types/node": {
-          "version": "6.0.64",
-          "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.64.tgz",
-          "integrity": "sha1-zckBQR9jAeFDff7SO8aPVEQuTcg="
+        "source-list-map": {
+          "version": "2.0.0",
+          "bundled": true
         },
-        "loader-utils": {
-          "version": "0.2.16",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.16.tgz",
-          "integrity": "sha1-8IYyBm7YKCg13/iN+1JwR2Wt7m0="
-        }
-      }
-    },
-    "@microsoft/loader-load-themed-styles": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.2.0.tgz",
-      "integrity": "sha1-S9TfPuiymFiKSBu0hBUhN1JcVUg=",
-      "dependencies": {
-        "@microsoft/load-themed-styles": {
-          "version": "1.4.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.4.0.tgz",
-          "integrity": "sha1-GDC9288QFxLKJgIX5Vq3RKUgQdw="
+        "stream-browserify": {
+          "version": "2.0.1",
+          "bundled": true
         },
-        "loader-utils": {
-          "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
-          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
-        }
-      }
-    },
-    "@microsoft/loader-set-webpack-public-path": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-set-webpack-public-path/-/loader-set-webpack-public-path-2.1.0.tgz",
-      "integrity": "sha1-osSnwyfQAbomOivSMxUNKnuCFgA=",
-      "dependencies": {
-        "loader-utils": {
+        "string_decoder": {
+          "version": "0.10.31",
+          "bundled": true
+        },
+        "string-width": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "bundled": true
+        },
+        "strip-bom": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "supports-color": {
+          "version": "4.2.1",
+          "bundled": true
+        },
+        "tapable": {
+          "version": "0.2.8",
+          "bundled": true
+        },
+        "timers-browserify": {
+          "version": "2.0.4",
+          "bundled": true
+        },
+        "tslint": {
+          "version": "5.6.0",
+          "bundled": true
+        },
+        "ultron": {
           "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
-          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
-        }
-      }
-    },
-    "@microsoft/rush-lib": {
-      "version": "3.0.7",
-      "resolved": "https://registry.npmjs.org/@microsoft/rush-lib/-/rush-lib-3.0.7.tgz",
-      "integrity": "sha1-bKgpmEgMMxDKcHqeWW+NXAA+MMQ=",
-      "dependencies": {
-        "rimraf": {
-          "version": "2.5.4",
-          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
-          "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
-        }
-      }
-    },
-    "@microsoft/sp-build-common": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/sp-build-common/-/sp-build-common-1.1.0.tgz",
-      "integrity": "sha1-lzCRSjgVLl4/UEO9DLT9Z6urrmY=",
-      "dependencies": {
-        "@microsoft/gulp-core-build": {
-          "version": "2.5.3",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.5.3.tgz",
-          "integrity": "sha1-26R2Li/7oxiYdlmTx3d7AVk8/rc=",
+          "bundled": true
+        },
+        "url": {
+          "version": "0.11.0",
+          "bundled": true,
           "dependencies": {
-            "@types/yargs": {
-              "version": "0.0.34",
-              "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.34.tgz",
-              "integrity": "sha1-FWBCn8VQxDvEGnt9PfoK+8yRSjU="
+            "punycode": {
+              "version": "1.3.2",
+              "bundled": true
             }
           }
         },
-        "@microsoft/gulp-core-build-typescript": {
-          "version": "3.1.1",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.1.1.tgz",
-          "integrity": "sha1-e3gdjlKeSQzz5hB5eh+7fuZx01s="
-        },
-        "@types/chai": {
-          "version": "3.4.34",
-          "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz",
-          "integrity": "sha1-1TNXkoI7sJzd1eOMPSEbcJGDhU0="
-        },
-        "@types/mocha": {
-          "version": "2.2.38",
-          "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz",
-          "integrity": "sha1-jBiPbjTC58Px0BJ9kI1aNuWmDck="
-        },
-        "@types/semver": {
-          "version": "5.3.31",
-          "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.31.tgz",
-          "integrity": "sha1-uZnX2TX0P1IHsBsA094ghS9Mp18="
-        },
-        "@types/yargs": {
-          "version": "0.0.35",
-          "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.35.tgz",
-          "integrity": "sha1-QHczV2rO1IlfutZ6Pwr2M9Lfy60="
-        },
-        "@types/z-schema": {
-          "version": "3.16.20-alpha",
-          "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.20-alpha.tgz",
-          "integrity": "sha1-NvWIzMon2Oht1rtZWpc67eiAN2Y="
-        },
-        "findup-sync": {
-          "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.3.0.tgz",
-          "integrity": "sha1-N5MKpdgWt3fANEXhlmzGeQpMCxY=",
+        "watchpack": {
+          "version": "1.4.0",
+          "bundled": true
+        },
+        "webpack": {
+          "version": "3.5.5",
+          "bundled": true,
           "dependencies": {
-            "glob": {
-              "version": "5.0.15",
-              "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
-              "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
+            "yargs": {
+              "version": "8.0.2",
+              "bundled": true
             }
           }
         },
-        "rimraf": {
-          "version": "2.5.4",
-          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
-          "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
-        },
-        "tslint": {
-          "version": "4.5.1",
-          "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.5.1.tgz",
-          "integrity": "sha1-BTVocb7yOkNJBnNABvwYgza6gks="
+        "webpack-bundle-analyzer": {
+          "version": "2.9.0",
+          "bundled": true,
+          "dependencies": {
+            "ansi-regex": {
+              "version": "2.1.1",
+              "bundled": true
+            },
+            "chalk": {
+              "version": "1.1.3",
+              "bundled": true
+            },
+            "lodash": {
+              "version": "4.17.4",
+              "bundled": true
+            },
+            "strip-ansi": {
+              "version": "3.0.1",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "2.0.0",
+              "bundled": true
+            }
+          }
         },
-        "tslint-microsoft-contrib": {
-          "version": "4.0.1",
-          "resolved": "https://registry.npmjs.org/tslint-microsoft-contrib/-/tslint-microsoft-contrib-4.0.1.tgz",
-          "integrity": "sha1-niAaFjn1hZZY/88rTcuxmZL45sA="
+        "webpack-sources": {
+          "version": "1.0.1",
+          "bundled": true
         },
-        "tsutils": {
-          "version": "1.9.1",
-          "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-1.9.1.tgz",
-          "integrity": "sha1-ufmrROVa+WgYMdXyjQrur1x1DLA="
+        "which-module": {
+          "version": "2.0.0",
+          "bundled": true
         },
-        "typescript": {
-          "version": "2.2.2",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz",
-          "integrity": "sha1-YGAiUIR5tV/6NotY/uljoD39eww="
+        "ws": {
+          "version": "2.3.1",
+          "bundled": true,
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "bundled": true
+            }
+          }
         },
-        "yargs": {
-          "version": "4.6.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz",
-          "integrity": "sha1-y0BQwBWb+2u2ScD0r1UFJqhGGdw="
+        "yargs-parser": {
+          "version": "7.0.0",
+          "bundled": true
         }
       }
     },
-    "@microsoft/sp-build-core-tasks": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/@microsoft/sp-build-core-tasks/-/sp-build-core-tasks-1.1.2.tgz",
-      "integrity": "sha1-Ao01gqCmrAOyF7BkO30Xgzwsv6Q=",
+    "@rush-temp/example-app-base": {
+      "version": "file:projects/example-app-base",
       "dependencies": {
-        "@microsoft/gulp-core-build": {
-          "version": "2.5.3",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.5.3.tgz",
-          "integrity": "sha1-26R2Li/7oxiYdlmTx3d7AVk8/rc=",
-          "dependencies": {
-            "@types/node": {
-              "version": "6.0.62",
-              "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.62.tgz",
-              "integrity": "sha1-hSIsB3tU8ltXQXu3CLn4d72jf4k="
-            },
-            "rimraf": {
-              "version": "2.5.4",
-              "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
-              "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
-            }
-          }
-        },
-        "@microsoft/load-themed-styles": {
-          "version": "1.4.0",
-          "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.4.0.tgz",
-          "integrity": "sha1-GDC9288QFxLKJgIX5Vq3RKUgQdw="
-        },
-        "@types/chai": {
-          "version": "3.4.34",
-          "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz",
-          "integrity": "sha1-1TNXkoI7sJzd1eOMPSEbcJGDhU0="
-        },
-        "@types/mocha": {
-          "version": "2.2.38",
-          "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz",
-          "integrity": "sha1-jBiPbjTC58Px0BJ9kI1aNuWmDck="
+        "acorn": {
+          "version": "5.1.1",
+          "bundled": true
         },
-        "@types/node": {
-          "version": "6.0.64",
-          "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.64.tgz",
-          "integrity": "sha1-zckBQR9jAeFDff7SO8aPVEQuTcg="
+        "ajv": {
+          "version": "5.2.2",
+          "bundled": true
         },
-        "@types/semver": {
-          "version": "5.3.31",
-          "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.31.tgz",
-          "integrity": "sha1-uZnX2TX0P1IHsBsA094ghS9Mp18="
+        "ajv-keywords": {
+          "version": "2.1.0",
+          "bundled": true
         },
-        "acorn": {
-          "version": "5.1.1",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.1.1.tgz",
-          "integrity": "sha512-vOk6uEMctu0vQrvuSqFdJyqj1Q0S5VTDL79qtjo+DhRr+1mmaD+tluFSCZqhvi/JUhXSzoZN2BhtstaPEeE8cw=="
+        "ansi-regex": {
+          "version": "3.0.0",
+          "bundled": true
         },
         "async": {
-          "version": "0.9.2",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz",
-          "integrity": "sha1-rqdNXmHB+JlhO/ZL2mbUx48v0X0="
+          "version": "2.5.0",
+          "bundled": true
+        },
+        "camelcase": {
+          "version": "4.1.0",
+          "bundled": true
         },
         "chalk": {
           "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "bundled": true,
           "dependencies": {
+            "ansi-regex": {
+              "version": "2.1.1",
+              "bundled": true
+            },
+            "strip-ansi": {
+              "version": "3.0.1",
+              "bundled": true
+            },
             "supports-color": {
               "version": "2.0.0",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+              "bundled": true
             }
           }
         },
-        "css-loader": {
-          "version": "0.24.0",
-          "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.24.0.tgz",
-          "integrity": "sha1-evqvtMD7L5CzNe0Qocd7NNZIQ/4="
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
+        "constants-browserify": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "crypto-browserify": {
+          "version": "3.11.1",
+          "bundled": true
         },
-        "css-selector-tokenizer": {
-          "version": "0.6.0",
-          "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.6.0.tgz",
-          "integrity": "sha1-ZEX1gseTDSQdzFAHpD1vy48HMVI="
+        "css-loader": {
+          "version": "0.28.5",
+          "bundled": true
         },
         "debug": {
-          "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
+          "version": "2.6.8",
+          "bundled": true
         },
-        "es6-promise": {
-          "version": "3.1.2",
-          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-3.1.2.tgz",
-          "integrity": "sha1-eV4lzrR/e6uyY9FRr77dktGOagc="
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
         },
-        "express": {
-          "version": "4.15.4",
-          "resolved": "https://registry.npmjs.org/express/-/express-4.15.4.tgz",
-          "integrity": "sha1-Ay4iU0ic+PzgJma+yj0R7XotrtE=",
-          "dependencies": {
-            "debug": {
-              "version": "2.6.8",
-              "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
-              "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
-            },
-            "etag": {
-              "version": "1.8.0",
-              "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.0.tgz",
-              "integrity": "sha1-b2Ma7zNtbEY2K1F2QETOIWvjwFE="
-            },
-            "finalhandler": {
-              "version": "1.0.4",
-              "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.4.tgz",
-              "integrity": "sha512-16l/r8RgzlXKmFOhZpHBztvye+lAhC5SU7hXavnerC9UfZqZxxXl3BzL8MhffPT3kF61lj9Oav2LKEzh0ei7tg=="
-            },
-            "fresh": {
-              "version": "0.5.0",
-              "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.0.tgz",
-              "integrity": "sha1-9HTKXmqSRtb9jglTz6m5yAWvp44="
-            },
-            "http-errors": {
-              "version": "1.6.2",
-              "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.2.tgz",
-              "integrity": "sha1-CgAsyFcHGSp+eUbO7cERVfYOxzY="
-            },
-            "ms": {
-              "version": "2.0.0",
-              "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-              "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
-            },
-            "range-parser": {
-              "version": "1.2.0",
-              "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.0.tgz",
-              "integrity": "sha1-9JvmtIeJTdxA3MlKMi9hEJLgDV4="
-            },
-            "send": {
-              "version": "0.15.4",
-              "resolved": "https://registry.npmjs.org/send/-/send-0.15.4.tgz",
-              "integrity": "sha1-mF+qPihLAnPHkzZKNcZze9k5Bbk="
-            },
-            "serve-static": {
-              "version": "1.12.4",
-              "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.12.4.tgz",
-              "integrity": "sha1-m2qpjutyU8Tu3Ewfb9vKYJkBqWE="
-            },
-            "statuses": {
-              "version": "1.3.1",
-              "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.3.1.tgz",
-              "integrity": "sha1-+vUbnrdKrvOzrPStX2Gr8ky3uT4="
-            }
-          }
+        "enhanced-resolve": {
+          "version": "3.4.1",
+          "bundled": true
         },
-        "finalhandler": {
-          "version": "0.4.1",
-          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.4.1.tgz",
-          "integrity": "sha1-haF8bFmpRxfSYtYSMNSw6+PUoU0="
+        "find-up": {
+          "version": "2.1.0",
+          "bundled": true
         },
         "glob": {
-          "version": "7.0.6",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.0.6.tgz",
-          "integrity": "sha1-IRuvr0nlJbjNkyYNFKsTYVKz9Xo="
+          "version": "7.1.1",
+          "bundled": true
         },
-        "http-errors": {
-          "version": "1.3.1",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
-          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
+        "https-browserify": {
+          "version": "0.0.1",
+          "bundled": true
         },
-        "loader-utils": {
-          "version": "0.2.16",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.16.tgz",
-          "integrity": "sha1-8IYyBm7YKCg13/iN+1JwR2Wt7m0="
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "bundled": true
         },
-        "mime": {
-          "version": "1.3.4",
-          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz",
-          "integrity": "sha1-EV+eO2s9rylZmDyzjxSaLUDrXVM="
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
         },
-        "ms": {
-          "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+        "load-json-file": {
+          "version": "2.0.0",
+          "bundled": true
         },
-        "node-uuid": {
-          "version": "1.4.8",
-          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz",
-          "integrity": "sha1-sEDrCSOWivq/jTL7HxfxFn/auQc="
+        "loader-utils": {
+          "version": "1.1.0",
+          "bundled": true
         },
-        "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+        "lodash.camelcase": {
+          "version": "4.3.0",
+          "bundled": true
         },
-        "qs": {
-          "version": "6.5.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-6.5.0.tgz",
-          "integrity": "sha512-fjVFjW9yhqMhVGwRExCXLhJKrLlkYSaxNWdyc9rmHlrVZbk35YHH312dFd7191uQeXkI3mKLZTIbSvIeFwFemg=="
+        "mocha": {
+          "version": "3.5.0",
+          "bundled": true
         },
-        "range-parser": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.0.3.tgz",
-          "integrity": "sha1-aHKCNTXGkuLCoBA4Jq/YLC4P8XU="
+        "node-libs-browser": {
+          "version": "2.0.0",
+          "bundled": true
         },
-        "resolve": {
-          "version": "1.1.7",
-          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz",
-          "integrity": "sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs="
+        "os-browserify": {
+          "version": "0.2.1",
+          "bundled": true
         },
-        "send": {
-          "version": "0.13.2",
-          "resolved": "https://registry.npmjs.org/send/-/send-0.13.2.tgz",
-          "integrity": "sha1-dl52B8gFVFK7pvCwUllTUJhgNt4="
+        "os-locale": {
+          "version": "2.1.0",
+          "bundled": true
         },
-        "serve-static": {
-          "version": "1.10.3",
-          "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.10.3.tgz",
-          "integrity": "sha1-zlpuzTEB/tXsCYJ9rCKpwpv7BTU="
+        "path-type": {
+          "version": "2.0.0",
+          "bundled": true
         },
-        "source-map-loader": {
-          "version": "0.1.6",
-          "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.1.6.tgz",
-          "integrity": "sha1-wJkD2m1zueU7ftjuUkVZcFHpjpE=",
+        "postcss": {
+          "version": "5.2.17",
+          "bundled": true,
           "dependencies": {
-            "source-map": {
-              "version": "0.1.43",
-              "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz",
-              "integrity": "sha1-wkvBRspRfBRx9drL4lcbK3+eM0Y="
+            "supports-color": {
+              "version": "3.2.3",
+              "bundled": true
             }
           }
         },
-        "statuses": {
-          "version": "1.2.1",
-          "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.2.1.tgz",
-          "integrity": "sha1-3e1FzBglbVHtQK7BQkidXGECbSg="
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        "read-pkg": {
+          "version": "2.0.0",
+          "bundled": true
         },
-        "webpack-bundle-analyzer": {
-          "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.4.1.tgz",
-          "integrity": "sha1-H1o98pe1naL4IWybdhs/pAaG9HE=",
-          "dependencies": {
-            "lodash": {
-              "version": "4.17.4",
-              "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-              "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
-            }
-          }
+        "read-pkg-up": {
+          "version": "2.0.0",
+          "bundled": true
         },
-        "yargs": {
-          "version": "4.6.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz",
-          "integrity": "sha1-y0BQwBWb+2u2ScD0r1UFJqhGGdw="
-        }
-      }
-    },
-    "@microsoft/sp-build-web": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/sp-build-web/-/sp-build-web-1.1.0.tgz",
-      "integrity": "sha1-hAxtV8FVsubPaIGrlxFbw7sL3TU=",
-      "dependencies": {
-        "@microsoft/gulp-core-build": {
-          "version": "2.5.3",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.5.3.tgz",
-          "integrity": "sha1-26R2Li/7oxiYdlmTx3d7AVk8/rc="
-        },
-        "@microsoft/gulp-core-build-typescript": {
-          "version": "3.1.1",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.1.1.tgz",
-          "integrity": "sha1-e3gdjlKeSQzz5hB5eh+7fuZx01s="
-        },
-        "@types/chai": {
-          "version": "3.4.34",
-          "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz",
-          "integrity": "sha1-1TNXkoI7sJzd1eOMPSEbcJGDhU0="
-        },
-        "@types/mocha": {
-          "version": "2.2.38",
-          "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz",
-          "integrity": "sha1-jBiPbjTC58Px0BJ9kI1aNuWmDck="
-        },
-        "@types/semver": {
-          "version": "5.3.31",
-          "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.31.tgz",
-          "integrity": "sha1-uZnX2TX0P1IHsBsA094ghS9Mp18="
-        },
-        "findup-sync": {
-          "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.3.0.tgz",
-          "integrity": "sha1-N5MKpdgWt3fANEXhlmzGeQpMCxY=",
+        "readable-stream": {
+          "version": "2.3.3",
+          "bundled": true,
           "dependencies": {
-            "glob": {
-              "version": "5.0.15",
-              "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
-              "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
+            "string_decoder": {
+              "version": "1.0.3",
+              "bundled": true
             }
           }
         },
-        "rimraf": {
-          "version": "2.5.4",
-          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
-          "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
+        "source-list-map": {
+          "version": "2.0.0",
+          "bundled": true
         },
-        "tslint": {
-          "version": "4.5.1",
-          "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.5.1.tgz",
-          "integrity": "sha1-BTVocb7yOkNJBnNABvwYgza6gks="
+        "stream-browserify": {
+          "version": "2.0.1",
+          "bundled": true
         },
-        "tslint-microsoft-contrib": {
-          "version": "4.0.1",
-          "resolved": "https://registry.npmjs.org/tslint-microsoft-contrib/-/tslint-microsoft-contrib-4.0.1.tgz",
-          "integrity": "sha1-niAaFjn1hZZY/88rTcuxmZL45sA="
+        "string-width": {
+          "version": "2.1.1",
+          "bundled": true
         },
-        "tsutils": {
-          "version": "1.9.1",
-          "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-1.9.1.tgz",
-          "integrity": "sha1-ufmrROVa+WgYMdXyjQrur1x1DLA="
+        "strip-ansi": {
+          "version": "4.0.0",
+          "bundled": true
         },
-        "typescript": {
-          "version": "2.2.2",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz",
-          "integrity": "sha1-YGAiUIR5tV/6NotY/uljoD39eww="
+        "strip-bom": {
+          "version": "3.0.0",
+          "bundled": true
         },
-        "yargs": {
-          "version": "4.6.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz",
-          "integrity": "sha1-y0BQwBWb+2u2ScD0r1UFJqhGGdw="
-        }
-      }
-    },
-    "@microsoft/sp-module-interfaces": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/@microsoft/sp-module-interfaces/-/sp-module-interfaces-1.1.1.tgz",
-      "integrity": "sha1-AFAm2/RhZq+QhNpenMpRuZjAsIo=",
-      "dependencies": {
-        "@types/node": {
-          "version": "6.0.64",
-          "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.64.tgz",
-          "integrity": "sha1-zckBQR9jAeFDff7SO8aPVEQuTcg="
+        "style-loader": {
+          "version": "0.17.0",
+          "bundled": true
         },
-        "@types/z-schema": {
-          "version": "3.16.20-alpha",
-          "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.20-alpha.tgz",
-          "integrity": "sha1-NvWIzMon2Oht1rtZWpc67eiAN2Y="
-        }
-      }
-    },
-    "@microsoft/sp-polyfills": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/sp-polyfills/-/sp-polyfills-1.1.0.tgz",
-      "integrity": "sha1-oFberMuTQLO3eg2QlYELTw/mAOo=",
-      "dependencies": {
-        "es6-promise": {
+        "supports-color": {
           "version": "3.1.2",
-          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-3.1.2.tgz",
-          "integrity": "sha1-eV4lzrR/e6uyY9FRr77dktGOagc="
-        }
-      }
-    },
-    "@microsoft/sp-tslint-rules": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/sp-tslint-rules/-/sp-tslint-rules-1.1.0.tgz",
-      "integrity": "sha1-t0IKEO0oXp+RyN+/R5dDkdJiRmk=",
-      "dependencies": {
-        "@microsoft/gulp-core-build": {
-          "version": "2.5.3",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build/-/gulp-core-build-2.5.3.tgz",
-          "integrity": "sha1-26R2Li/7oxiYdlmTx3d7AVk8/rc="
-        },
-        "@microsoft/gulp-core-build-typescript": {
-          "version": "3.1.1",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-typescript/-/gulp-core-build-typescript-3.1.1.tgz",
-          "integrity": "sha1-e3gdjlKeSQzz5hB5eh+7fuZx01s=",
-          "dependencies": {
-            "tslint": {
-              "version": "4.5.1",
-              "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.5.1.tgz",
-              "integrity": "sha1-BTVocb7yOkNJBnNABvwYgza6gks="
-            }
-          }
-        },
-        "@types/chai": {
-          "version": "3.4.34",
-          "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.34.tgz",
-          "integrity": "sha1-1TNXkoI7sJzd1eOMPSEbcJGDhU0="
-        },
-        "@types/mocha": {
-          "version": "2.2.38",
-          "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.38.tgz",
-          "integrity": "sha1-jBiPbjTC58Px0BJ9kI1aNuWmDck="
-        },
-        "@types/semver": {
-          "version": "5.3.31",
-          "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.31.tgz",
-          "integrity": "sha1-uZnX2TX0P1IHsBsA094ghS9Mp18="
-        },
-        "ansi-align": {
-          "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-1.1.0.tgz",
-          "integrity": "sha1-LwwWWIKXOa3V67FeawxuNCPwFro="
-        },
-        "boxen": {
-          "version": "0.6.0",
-          "resolved": "https://registry.npmjs.org/boxen/-/boxen-0.6.0.tgz",
-          "integrity": "sha1-g2TUJIrDT/DvGy8r9JpsYM4NgbY="
+          "bundled": true
         },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        "tapable": {
+          "version": "0.2.8",
+          "bundled": true
         },
-        "configstore": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/configstore/-/configstore-2.1.0.tgz",
-          "integrity": "sha1-c3o6cDbpiGECqmCZ5HuzOrGroaE="
+        "timers-browserify": {
+          "version": "2.0.4",
+          "bundled": true
         },
-        "dot-prop": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-3.0.0.tgz",
-          "integrity": "sha1-G3CK8JSknJoOfbyteQq6U52sEXc="
-        },
-        "duplexer2": {
-          "version": "0.1.4",
-          "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.1.4.tgz",
-          "integrity": "sha1-ixLauHjA1p4+eJEFFmKjL8a93ME="
-        },
-        "findup-sync": {
-          "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.3.0.tgz",
-          "integrity": "sha1-N5MKpdgWt3fANEXhlmzGeQpMCxY=",
+        "url": {
+          "version": "0.11.0",
+          "bundled": true,
           "dependencies": {
-            "glob": {
-              "version": "5.0.15",
-              "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
-              "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
+            "punycode": {
+              "version": "1.3.2",
+              "bundled": true
             }
           }
         },
-        "got": {
-          "version": "5.7.1",
-          "resolved": "https://registry.npmjs.org/got/-/got-5.7.1.tgz",
-          "integrity": "sha1-X4FjWmHkplifGAVp6k44FoClHzU="
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "latest-version": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-2.0.0.tgz",
-          "integrity": "sha1-VvjWE5YghHuAF/jx9NeOIRMkFos="
-        },
-        "package-json": {
-          "version": "2.4.0",
-          "resolved": "https://registry.npmjs.org/package-json/-/package-json-2.4.0.tgz",
-          "integrity": "sha1-DRW9Z9HLvduyyiIv8u24a8sxqLs="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "rimraf": {
-          "version": "2.5.4",
-          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.5.4.tgz",
-          "integrity": "sha1-loAAk8vxoMhr2VtGJUZ1NcKd+gQ="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        },
-        "timed-out": {
-          "version": "3.1.3",
-          "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-3.1.3.tgz",
-          "integrity": "sha1-lYYL/MXHbCd/j4Mm/Q9bLiDrohc="
+        "watchpack": {
+          "version": "1.4.0",
+          "bundled": true
         },
-        "tslint": {
-          "version": "4.0.2",
-          "resolved": "https://registry.npmjs.org/tslint/-/tslint-4.0.2.tgz",
-          "integrity": "sha1-1D8kwMH4Jt5/Ogl7t4CKi0Ml/qw=",
+        "webpack": {
+          "version": "3.5.5",
+          "bundled": true,
           "dependencies": {
-            "update-notifier": {
-              "version": "1.0.3",
-              "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-1.0.3.tgz",
-              "integrity": "sha1-j5LFFUgr1oMbfJMBPnD4dVLHz1o="
+            "has-flag": {
+              "version": "2.0.0",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "4.2.1",
+              "bundled": true
             }
           }
         },
-        "tslint-microsoft-contrib": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/tslint-microsoft-contrib/-/tslint-microsoft-contrib-4.0.0.tgz",
-          "integrity": "sha1-fgClbBQXJR0/kaiA78xDNhpp+yo="
-        },
-        "tsutils": {
-          "version": "1.9.1",
-          "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-1.9.1.tgz",
-          "integrity": "sha1-ufmrROVa+WgYMdXyjQrur1x1DLA="
-        },
-        "typescript": {
-          "version": "2.2.2",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz",
-          "integrity": "sha1-YGAiUIR5tV/6NotY/uljoD39eww="
-        },
-        "unzip-response": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-1.0.2.tgz",
-          "integrity": "sha1-uYTwh3/AqJwsdzzB73tbIytbBv4="
-        },
-        "uuid": {
-          "version": "2.0.3",
-          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz",
-          "integrity": "sha1-Z+LoY3lyFVMN/zGOW/nc6/1Hsho="
-        },
-        "write-file-atomic": {
-          "version": "1.3.4",
-          "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-1.3.4.tgz",
-          "integrity": "sha1-+Aek8LHZ6ROuekgRLmzDrxmRtF8="
+        "webpack-sources": {
+          "version": "1.0.1",
+          "bundled": true
         },
-        "xdg-basedir": {
+        "which-module": {
           "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-2.0.0.tgz",
-          "integrity": "sha1-7byQPMOF/ARSPZZqM1UEtVBNG9I="
+          "bundled": true
         },
         "yargs": {
-          "version": "4.6.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-4.6.0.tgz",
-          "integrity": "sha1-y0BQwBWb+2u2ScD0r1UFJqhGGdw="
+          "version": "8.0.2",
+          "bundled": true
+        },
+        "yargs-parser": {
+          "version": "7.0.0",
+          "bundled": true
         }
       }
     },
-    "@microsoft/stream-collator": {
-      "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/@microsoft/stream-collator/-/stream-collator-2.0.4.tgz",
-      "integrity": "sha1-Ofv6OxWIw3Z4j+f7xif2lsRDMus="
-    },
-    "@microsoft/web-library-build": {
-      "version": "3.2.10",
-      "resolved": "https://registry.npmjs.org/@microsoft/web-library-build/-/web-library-build-3.2.10.tgz",
-      "integrity": "sha1-MV7aphKQiy6wUKat96RFGYbwDU4=",
-      "dependencies": {
-        "@microsoft/gulp-core-build-karma": {
-          "version": "2.3.9",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-karma/-/gulp-core-build-karma-2.3.9.tgz",
-          "integrity": "sha1-MNH8KliZpaurRodoXanhBUf/mPY="
-        },
-        "@microsoft/gulp-core-build-sass": {
-          "version": "3.2.7",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-sass/-/gulp-core-build-sass-3.2.7.tgz",
-          "integrity": "sha1-98YUUdy1Y4C32r7thGmb2X2YJZg="
-        },
-        "@microsoft/gulp-core-build-serve": {
-          "version": "2.1.9",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-serve/-/gulp-core-build-serve-2.1.9.tgz",
-          "integrity": "sha1-bu8mCufNa174k5PD1mtUlmkt8Zk="
-        },
-        "@microsoft/gulp-core-build-webpack": {
-          "version": "1.2.6",
-          "resolved": "https://registry.npmjs.org/@microsoft/gulp-core-build-webpack/-/gulp-core-build-webpack-1.2.6.tgz",
-          "integrity": "sha1-CEPmcgi0QcZlaaL038cWTQv/rbU="
+    "@rush-temp/experiments": {
+      "version": "file:projects/experiments",
+      "dependencies": {
+        "acorn": {
+          "version": "5.1.1",
+          "bundled": true
+        },
+        "ajv": {
+          "version": "5.2.2",
+          "bundled": true
+        },
+        "ajv-keywords": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "ansi-regex": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "async": {
+          "version": "2.5.0",
+          "bundled": true
+        },
+        "autoprefixer": {
+          "version": "6.7.7",
+          "bundled": true
+        },
+        "browserslist": {
+          "version": "1.7.7",
+          "bundled": true
         },
         "camelcase": {
-          "version": "1.2.1",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
-          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
+          "version": "4.1.0",
+          "bundled": true
         },
         "chalk": {
           "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "bundled": true,
           "dependencies": {
+            "ansi-regex": {
+              "version": "2.1.1",
+              "bundled": true
+            },
+            "strip-ansi": {
+              "version": "3.0.1",
+              "bundled": true
+            },
             "supports-color": {
               "version": "2.0.0",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+              "bundled": true
             }
           }
         },
-        "cliui": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
-          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE="
-        },
         "commander": {
           "version": "2.9.0",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
-          "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q="
+          "bundled": true
         },
-        "debug": {
-          "version": "2.6.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz",
-          "integrity": "sha1-vFlryr52F/Edn6FTYe3tVgi4SZs="
-        },
-        "diff": {
-          "version": "3.2.0",
-          "resolved": "https://registry.npmjs.org/diff/-/diff-3.2.0.tgz",
-          "integrity": "sha1-yc45Okt8vQsFinJck98pkCeGj/k="
-        },
-        "glob": {
-          "version": "7.1.1",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz",
-          "integrity": "sha1-gFIR3wT6rxxjo2ADBs31reULLsg="
-        },
-        "interpret": {
-          "version": "0.6.6",
-          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz",
-          "integrity": "sha1-/s16GOfOXKar+5U+H4YhOknxYls="
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "karma-sinon-chai": {
-          "version": "1.2.4",
-          "resolved": "https://registry.npmjs.org/karma-sinon-chai/-/karma-sinon-chai-1.2.4.tgz",
-          "integrity": "sha1-/qk19ivjNmzwJxyNi+UcDHDkCrw=",
-          "dependencies": {
-            "lolex": {
-              "version": "1.6.0",
-              "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
-              "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
-            }
-          }
-        },
-        "memory-fs": {
-          "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz",
-          "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
-        },
-        "mocha": {
-          "version": "3.4.2",
-          "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.4.2.tgz",
-          "integrity": "sha1-0O9NMyEm2/GNDWQMmzgt1IvpdZQ="
-        },
-        "ms": {
-          "version": "0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
-          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
-        },
-        "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
-          "dependencies": {
-            "supports-color": {
-              "version": "3.2.3",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-              "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
-            }
-          }
-        },
-        "postcss-modules": {
-          "version": "0.6.4",
-          "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.6.4.tgz",
-          "integrity": "sha1-d6WLt3uhtDkrJwwLWYUv116JqLQ="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "sinon": {
-          "version": "1.17.7",
-          "resolved": "https://registry.npmjs.org/sinon/-/sinon-1.17.7.tgz",
-          "integrity": "sha1-RUKk9JugxFwF6y6d2dID4rjv4L8=",
-          "dependencies": {
-            "lolex": {
-              "version": "1.3.2",
-              "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.3.2.tgz",
-              "integrity": "sha1-fD2mL/yzDw9agKJWbKJORdigHzE="
-            }
-          }
-        },
-        "sinon-chai": {
-          "version": "2.8.0",
-          "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.8.0.tgz",
-          "integrity": "sha1-Qyqbv9Uab8AHmPTSUmqCnAYGh6w="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        },
-        "supports-color": {
-          "version": "3.1.2",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz",
-          "integrity": "sha1-cqJiiU2dQIuVbKBf83su2KbiotU="
-        },
-        "uglify-js": {
-          "version": "2.7.5",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.7.5.tgz",
-          "integrity": "sha1-RhLAx7qu4rp8SH3kkErhIgefLKg=",
-          "dependencies": {
-            "async": {
-              "version": "0.2.10",
-              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz",
-              "integrity": "sha1-trvgsGdLnXGXCMo43owjfLUmw9E="
-            }
-          }
-        },
-        "webpack": {
-          "version": "1.13.3",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.13.3.tgz",
-          "integrity": "sha1-55xG/lo3xcpwCEugiUxZXNy0KBU="
-        },
-        "window-size": {
-          "version": "0.1.0",
-          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
-          "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
-        },
-        "wordwrap": {
-          "version": "0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
-          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
-        },
-        "yargs": {
-          "version": "3.10.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
-          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
-        }
-      }
-    },
-    "@rush-temp/build": {
-      "version": "file:projects/build",
-      "dependencies": {
-        "autoprefixer": {
-          "version": "7.1.2",
-          "bundled": true
-        },
-        "browserslist": {
-          "version": "2.3.3",
-          "bundled": true
-        },
-        "tslint": {
-          "version": "5.6.0",
-          "bundled": true
-        }
-      }
-    },
-    "@rush-temp/example-app-base": {
-      "version": "file:projects/example-app-base",
-      "dependencies": {
-        "acorn": {
-          "version": "5.1.1",
-          "bundled": true
-        },
-        "ajv": {
-          "version": "5.2.2",
-          "bundled": true
-        },
-        "ajv-keywords": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "ansi-regex": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "async": {
-          "version": "2.5.0",
-          "bundled": true
-        },
-        "camelcase": {
-          "version": "4.1.0",
-          "bundled": true
-        },
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true
-        },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "bundled": true
+        "constants-browserify": {
+          "version": "1.0.0",
+          "bundled": true
         },
         "crypto-browserify": {
           "version": "3.11.1",
           "bundled": true
         },
+        "css-loader": {
+          "version": "0.28.5",
+          "bundled": true
+        },
         "debug": {
           "version": "2.6.8",
           "bundled": true
@@ -1236,6 +690,10 @@
           "version": "1.1.0",
           "bundled": true
         },
+        "lodash.camelcase": {
+          "version": "4.3.0",
+          "bundled": true
+        },
         "mocha": {
           "version": "3.5.0",
           "bundled": true
@@ -1256,6 +714,20 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "postcss": {
+          "version": "5.2.17",
+          "bundled": true,
+          "dependencies": {
+            "supports-color": {
+              "version": "3.2.3",
+              "bundled": true
+            }
+          }
+        },
+        "postcss-loader": {
+          "version": "1.3.3",
+          "bundled": true
+        },
         "read-pkg": {
           "version": "2.0.0",
           "bundled": true
@@ -1274,6 +746,10 @@
             }
           }
         },
+        "sinon": {
+          "version": "2.4.1",
+          "bundled": true
+        },
         "source-list-map": {
           "version": "2.0.0",
           "bundled": true
@@ -1294,6 +770,10 @@
           "version": "3.0.0",
           "bundled": true
         },
+        "style-loader": {
+          "version": "0.17.0",
+          "bundled": true
+        },
         "supports-color": {
           "version": "3.1.2",
           "bundled": true
@@ -1352,9 +832,13 @@
         }
       }
     },
-    "@rush-temp/experiments": {
-      "version": "file:projects/experiments",
+    "@rush-temp/fabric-website": {
+      "version": "file:projects/fabric-website",
       "dependencies": {
+        "@types/react-addons-test-utils": {
+          "version": "0.14.19",
+          "bundled": true
+        },
         "acorn": {
           "version": "5.1.1",
           "bundled": true
@@ -1393,18 +877,15 @@
           "dependencies": {
             "ansi-regex": {
               "version": "2.1.1",
-              "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
-              "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
+              "bundled": true
             },
             "strip-ansi": {
               "version": "3.0.1",
-              "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
-              "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8="
+              "bundled": true
             },
             "supports-color": {
               "version": "2.0.0",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+              "bundled": true
             }
           }
         },
@@ -1420,6 +901,10 @@
           "version": "3.11.1",
           "bundled": true
         },
+        "css-loader": {
+          "version": "0.28.5",
+          "bundled": true
+        },
         "debug": {
           "version": "2.6.8",
           "bundled": true
@@ -1460,6 +945,10 @@
           "version": "1.1.0",
           "bundled": true
         },
+        "lodash.camelcase": {
+          "version": "4.3.0",
+          "bundled": true
+        },
         "mocha": {
           "version": "3.5.0",
           "bundled": true
@@ -1486,11 +975,14 @@
           "dependencies": {
             "supports-color": {
               "version": "3.2.3",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-              "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+              "bundled": true
             }
           }
         },
+        "postcss-loader": {
+          "version": "1.3.3",
+          "bundled": true
+        },
         "read-pkg": {
           "version": "2.0.0",
           "bundled": true
@@ -1587,13 +1079,38 @@
         }
       }
     },
-    "@rush-temp/fabric-website": {
-      "version": "file:projects/fabric-website",
+    "@rush-temp/merge-styles": {
+      "version": "file:projects/merge-styles",
       "dependencies": {
-        "@types/react-addons-test-utils": {
-          "version": "0.14.19",
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
+        "debug": {
+          "version": "2.6.8",
+          "bundled": true
+        },
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
+        },
+        "glob": {
+          "version": "7.1.1",
           "bundled": true
         },
+        "mocha": {
+          "version": "3.5.0",
+          "bundled": true
+        },
+        "supports-color": {
+          "version": "3.1.2",
+          "bundled": true
+        }
+      }
+    },
+    "@rush-temp/office-ui-fabric-react": {
+      "version": "file:projects/office-ui-fabric-react",
+      "dependencies": {
         "acorn": {
           "version": "5.1.1",
           "bundled": true
@@ -1632,18 +1149,15 @@
           "dependencies": {
             "ansi-regex": {
               "version": "2.1.1",
-              "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
-              "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
+              "bundled": true
             },
             "strip-ansi": {
               "version": "3.0.1",
-              "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
-              "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8="
+              "bundled": true
             },
             "supports-color": {
               "version": "2.0.0",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+              "bundled": true
             }
           }
         },
@@ -1659,6 +1173,10 @@
           "version": "3.11.1",
           "bundled": true
         },
+        "css-loader": {
+          "version": "0.28.5",
+          "bundled": true
+        },
         "debug": {
           "version": "2.6.8",
           "bundled": true
@@ -1699,6 +1217,10 @@
           "version": "1.1.0",
           "bundled": true
         },
+        "lodash.camelcase": {
+          "version": "4.3.0",
+          "bundled": true
+        },
         "mocha": {
           "version": "3.5.0",
           "bundled": true
@@ -1725,11 +1247,14 @@
           "dependencies": {
             "supports-color": {
               "version": "3.2.3",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-              "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+              "bundled": true
             }
           }
         },
+        "postcss-loader": {
+          "version": "1.3.3",
+          "bundled": true
+        },
         "read-pkg": {
           "version": "2.0.0",
           "bundled": true
@@ -1748,6 +1273,10 @@
             }
           }
         },
+        "sinon": {
+          "version": "2.4.1",
+          "bundled": true
+        },
         "source-list-map": {
           "version": "2.0.0",
           "bundled": true
@@ -1768,6 +1297,10 @@
           "version": "3.0.0",
           "bundled": true
         },
+        "style-loader": {
+          "version": "0.17.0",
+          "bundled": true
+        },
         "supports-color": {
           "version": "3.1.2",
           "bundled": true
@@ -1826,88 +1359,55 @@
         }
       }
     },
-    "@rush-temp/merge-styles": {
-      "version": "file:projects/merge-styles",
+    "@rush-temp/office-ui-fabric-react-tslint": {
+      "version": "file:projects/office-ui-fabric-react-tslint"
+    },
+    "@rush-temp/ssr-tests": {
+      "version": "file:projects/ssr-tests",
       "dependencies": {
-        "commander": {
-          "version": "2.9.0",
+        "acorn": {
+          "version": "5.1.1",
           "bundled": true
         },
-        "debug": {
-          "version": "2.6.8",
+        "ajv": {
+          "version": "5.2.2",
           "bundled": true
         },
-        "diff": {
-          "version": "3.2.0",
+        "ajv-keywords": {
+          "version": "2.1.0",
           "bundled": true
         },
-        "glob": {
-          "version": "7.1.1",
+        "ansi-regex": {
+          "version": "3.0.0",
           "bundled": true
         },
-        "mocha": {
-          "version": "3.5.0",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "3.1.2",
-          "bundled": true
-        }
-      }
-    },
-    "@rush-temp/office-ui-fabric-react": {
-      "version": "file:projects/office-ui-fabric-react",
-      "dependencies": {
-        "acorn": {
-          "version": "5.1.1",
-          "bundled": true
-        },
-        "ajv": {
-          "version": "5.2.2",
-          "bundled": true
-        },
-        "ajv-keywords": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "ansi-regex": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "async": {
-          "version": "2.5.0",
-          "bundled": true
-        },
-        "autoprefixer": {
-          "version": "6.7.7",
-          "bundled": true
-        },
-        "browserslist": {
-          "version": "1.7.7",
+        "async": {
+          "version": "2.5.0",
           "bundled": true
         },
         "camelcase": {
           "version": "4.1.0",
           "bundled": true
         },
-        "chalk": {
-          "version": "1.1.3",
+        "cliui": {
+          "version": "3.2.0",
           "bundled": true,
           "dependencies": {
             "ansi-regex": {
               "version": "2.1.1",
-              "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
-              "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
+              "bundled": true
+            },
+            "is-fullwidth-code-point": {
+              "version": "1.0.0",
+              "bundled": true
+            },
+            "string-width": {
+              "version": "1.0.2",
+              "bundled": true
             },
             "strip-ansi": {
               "version": "3.0.1",
-              "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
-              "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8="
-            },
-            "supports-color": {
-              "version": "2.0.0",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+              "bundled": true
             }
           }
         },
@@ -1924,7 +1424,7 @@
           "bundled": true
         },
         "debug": {
-          "version": "2.6.8",
+          "version": "2.6.0",
           "bundled": true
         },
         "diff": {
@@ -1943,6 +1443,10 @@
           "version": "7.1.1",
           "bundled": true
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "bundled": true
+        },
         "https-browserify": {
           "version": "0.0.1",
           "bundled": true
@@ -1964,7 +1468,11 @@
           "bundled": true
         },
         "mocha": {
-          "version": "3.5.0",
+          "version": "3.3.0",
+          "bundled": true
+        },
+        "ms": {
+          "version": "0.7.2",
           "bundled": true
         },
         "node-libs-browser": {
@@ -1983,17 +1491,6 @@
           "version": "2.0.0",
           "bundled": true
         },
-        "postcss": {
-          "version": "5.2.17",
-          "bundled": true,
-          "dependencies": {
-            "supports-color": {
-              "version": "3.2.3",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-              "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
-            }
-          }
-        },
         "read-pkg": {
           "version": "2.0.0",
           "bundled": true
@@ -2020,6 +1517,10 @@
           "version": "2.0.1",
           "bundled": true
         },
+        "string_decoder": {
+          "version": "0.10.31",
+          "bundled": true
+        },
         "string-width": {
           "version": "2.1.1",
           "bundled": true
@@ -2090,11 +1591,8 @@
         }
       }
     },
-    "@rush-temp/office-ui-fabric-react-tslint": {
-      "version": "file:projects/office-ui-fabric-react-tslint"
-    },
-    "@rush-temp/ssr-tests": {
-      "version": "file:projects/ssr-tests",
+    "@rush-temp/styling": {
+      "version": "file:projects/styling",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -2133,7 +1631,7 @@
           "bundled": true
         },
         "debug": {
-          "version": "2.6.0",
+          "version": "2.6.8",
           "bundled": true
         },
         "diff": {
@@ -2173,11 +1671,7 @@
           "bundled": true
         },
         "mocha": {
-          "version": "3.3.0",
-          "bundled": true
-        },
-        "ms": {
-          "version": "0.7.2",
+          "version": "3.5.0",
           "bundled": true
         },
         "node-libs-browser": {
@@ -2292,8 +1786,8 @@
         }
       }
     },
-    "@rush-temp/styling": {
-      "version": "file:projects/styling",
+    "@rush-temp/test-bundle-button": {
+      "version": "file:projects/test-bundle-button",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -2319,10 +1813,6 @@
           "version": "4.1.0",
           "bundled": true
         },
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true
-        },
         "constants-browserify": {
           "version": "1.0.0",
           "bundled": true
@@ -2331,14 +1821,6 @@
           "version": "3.11.1",
           "bundled": true
         },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true
-        },
-        "diff": {
-          "version": "3.2.0",
-          "bundled": true
-        },
         "enhanced-resolve": {
           "version": "3.4.1",
           "bundled": true
@@ -2347,8 +1829,8 @@
           "version": "2.1.0",
           "bundled": true
         },
-        "glob": {
-          "version": "7.1.1",
+        "has-flag": {
+          "version": "2.0.0",
           "bundled": true
         },
         "https-browserify": {
@@ -2371,10 +1853,6 @@
           "version": "1.1.0",
           "bundled": true
         },
-        "mocha": {
-          "version": "3.5.0",
-          "bundled": true
-        },
         "node-libs-browser": {
           "version": "2.0.0",
           "bundled": true
@@ -2430,7 +1908,7 @@
           "bundled": true
         },
         "supports-color": {
-          "version": "3.1.2",
+          "version": "4.2.1",
           "bundled": true
         },
         "tapable": {
@@ -2457,17 +1935,7 @@
         },
         "webpack": {
           "version": "3.5.5",
-          "bundled": true,
-          "dependencies": {
-            "has-flag": {
-              "version": "2.0.0",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "4.2.1",
-              "bundled": true
-            }
-          }
+          "bundled": true
         },
         "webpack-sources": {
           "version": "1.0.1",
@@ -2487,247 +1955,57 @@
         }
       }
     },
-    "@rush-temp/test-bundle-button": {
-      "version": "file:projects/test-bundle-button",
+    "@rush-temp/todo-app": {
+      "version": "file:projects/todo-app"
+    },
+    "@rush-temp/utilities": {
+      "version": "file:projects/utilities",
       "dependencies": {
-        "acorn": {
-          "version": "5.1.1",
-          "bundled": true
-        },
-        "ajv": {
-          "version": "5.2.2",
-          "bundled": true
-        },
-        "ajv-keywords": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "ansi-regex": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "async": {
-          "version": "2.5.0",
-          "bundled": true
-        },
-        "camelcase": {
-          "version": "4.1.0",
-          "bundled": true
-        },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "crypto-browserify": {
-          "version": "3.11.1",
-          "bundled": true
-        },
-        "enhanced-resolve": {
-          "version": "3.4.1",
-          "bundled": true
-        },
-        "find-up": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "has-flag": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "load-json-file": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "loader-utils": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "node-libs-browser": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "os-browserify": {
-          "version": "0.2.1",
-          "bundled": true
-        },
-        "os-locale": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "path-type": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg-up": {
-          "version": "2.0.0",
+        "commander": {
+          "version": "2.9.0",
           "bundled": true
         },
-        "readable-stream": {
-          "version": "2.3.3",
-          "bundled": true,
-          "dependencies": {
-            "string_decoder": {
-              "version": "1.0.3",
-              "bundled": true
-            }
-          }
-        },
-        "source-list-map": {
-          "version": "2.0.0",
+        "debug": {
+          "version": "2.6.8",
           "bundled": true
         },
-        "stream-browserify": {
-          "version": "2.0.1",
+        "diff": {
+          "version": "3.2.0",
           "bundled": true
         },
-        "string-width": {
-          "version": "2.1.1",
+        "glob": {
+          "version": "7.1.1",
           "bundled": true
         },
-        "strip-ansi": {
-          "version": "4.0.0",
+        "mocha": {
+          "version": "3.5.0",
           "bundled": true
         },
-        "strip-bom": {
-          "version": "3.0.0",
+        "sinon": {
+          "version": "2.4.1",
           "bundled": true
         },
         "supports-color": {
-          "version": "4.2.1",
-          "bundled": true
-        },
-        "tapable": {
-          "version": "0.2.8",
-          "bundled": true
-        },
-        "timers-browserify": {
-          "version": "2.0.4",
-          "bundled": true
-        },
-        "url": {
-          "version": "0.11.0",
-          "bundled": true,
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "bundled": true
-            }
-          }
-        },
-        "watchpack": {
-          "version": "1.4.0",
-          "bundled": true
-        },
-        "webpack": {
-          "version": "3.5.5",
-          "bundled": true
-        },
-        "webpack-sources": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "which-module": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "yargs": {
-          "version": "8.0.2",
-          "bundled": true
-        },
-        "yargs-parser": {
-          "version": "7.0.0",
-          "bundled": true
-        }
-      }
-    },
-    "@rush-temp/todo-app": {
-      "version": "file:projects/todo-app"
-    },
-    "@rush-temp/utilities": {
-      "version": "file:projects/utilities",
-      "dependencies": {
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true
-        },
-        "diff": {
-          "version": "3.2.0",
-          "bundled": true
-        },
-        "glob": {
-          "version": "7.1.1",
-          "bundled": true
-        },
-        "mocha": {
-          "version": "3.5.0",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "3.1.2",
+          "version": "3.1.2",
           "bundled": true
         }
       }
     },
-    "@types/assertion-error": {
-      "version": "1.0.30",
-      "resolved": "https://registry.npmjs.org/@types/assertion-error/-/assertion-error-1.0.30.tgz",
-      "integrity": "sha1-89DV2i7Ie1FOMNs/+aAYh7VhnCk="
-    },
-    "@types/bluebird": {
-      "version": "3.5.8",
-      "resolved": "https://registry.npmjs.org/@types/bluebird/-/bluebird-3.5.8.tgz",
-      "integrity": "sha512-rBfrD56OxaqVjghtVqp2EEX0ieHkRk6IefDVrQXIVGvlhDOEBTvZff4Q02uo84ukVkH4k5eB1cPKGDM2NlFL8A=="
-    },
     "@types/chai": {
       "version": "3.4.35",
       "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.35.tgz",
       "integrity": "sha1-6NZfg0ktKUT4FvxiB0GCHCioyQA="
     },
-    "@types/chalk": {
-      "version": "0.4.31",
-      "resolved": "https://registry.npmjs.org/@types/chalk/-/chalk-0.4.31.tgz",
-      "integrity": "sha1-ox10JBprHtu5c8822XooloNKUfk="
-    },
     "@types/cheerio": {
       "version": "0.22.2",
       "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.2.tgz",
       "integrity": "sha512-7YJQbllem83umRzZ+ry6RZFAbBWNoHvbiW6tE5VEAJIoX6F22hrKrBw3ibRvHm2zPnOhZGrZJusAbp1zZKcLzQ=="
     },
-    "@types/colors": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/@types/colors/-/colors-1.1.1.tgz",
-      "integrity": "sha1-SXM5KPtHzxElS3YR4vb4X/YCBSE="
-    },
     "@types/enzyme": {
       "version": "2.8.0",
       "resolved": "https://registry.npmjs.org/@types/enzyme/-/enzyme-2.8.0.tgz",
       "integrity": "sha1-hMYgTPiYMSI6iattw/SQseCIY1I="
     },
-    "@types/es6-collections": {
-      "version": "0.5.29",
-      "resolved": "https://registry.npmjs.org/@types/es6-collections/-/es6-collections-0.5.29.tgz",
-      "integrity": "sha1-7CKDH36N5zY3vxVmD52MomlGmA0="
-    },
     "@types/es6-promise": {
       "version": "0.0.32",
       "resolved": "https://registry.npmjs.org/@types/es6-promise/-/es6-promise-0.0.32.tgz",
@@ -2738,116 +2016,21 @@
       "resolved": "https://registry.npmjs.org/@types/es6-weak-map/-/es6-weak-map-1.2.0.tgz",
       "integrity": "sha1-2fb4WDaaiLvGnvQCOAgfLWu8hhQ="
     },
-    "@types/express": {
-      "version": "4.0.37",
-      "resolved": "https://registry.npmjs.org/@types/express/-/express-4.0.37.tgz",
-      "integrity": "sha512-tIULTLzQpFFs5/PKnFIAFOsXQxss76glppbVKR3/jddPK26SBsD5HF5grn5G2jOGtpRWSBvYmDYoduVv+3wOXg=="
-    },
-    "@types/express-serve-static-core": {
-      "version": "4.0.50",
-      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.0.50.tgz",
-      "integrity": "sha512-0n1YgeUfZEIaMMu82LuOFIFDyMtFtcEP0yjQKihJlNjpCiygDVri7C26DC7jaUOwFXL6ZU2x4tGtNYNEgeO3tw=="
-    },
-    "@types/finalhandler": {
-      "version": "0.0.31",
-      "resolved": "https://registry.npmjs.org/@types/finalhandler/-/finalhandler-0.0.31.tgz",
-      "integrity": "sha1-7PMvOpu0Om+0BFdQ6h5VJYLTXcM="
-    },
-    "@types/fs-extra": {
-      "version": "0.0.37",
-      "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.37.tgz",
-      "integrity": "sha1-GV8RvNmhuX2eQSxrZombVFRxofc="
-    },
-    "@types/glob": {
-      "version": "5.0.30",
-      "resolved": "https://registry.npmjs.org/@types/glob/-/glob-5.0.30.tgz",
-      "integrity": "sha1-ECZAnFYlqGiQdGAoCNCCsoZ7ilE="
-    },
-    "@types/gulp": {
-      "version": "3.8.32",
-      "resolved": "https://registry.npmjs.org/@types/gulp/-/gulp-3.8.32.tgz",
-      "integrity": "sha1-g8WcaBzCM9Hsf4LSaVVVZvoTMVY="
-    },
-    "@types/gulp-replace": {
-      "version": "0.0.29",
-      "resolved": "https://registry.npmjs.org/@types/gulp-replace/-/gulp-replace-0.0.29.tgz",
-      "integrity": "sha1-gFqGw0pcz8+IS8E24GgzHkj5tls="
-    },
-    "@types/gulp-util": {
-      "version": "3.0.30",
-      "resolved": "https://registry.npmjs.org/@types/gulp-util/-/gulp-util-3.0.30.tgz",
-      "integrity": "sha1-TF9lg6IWCBOWZ+OsVrBbxn7PqPs="
-    },
     "@types/highlight.js": {
       "version": "9.1.9",
       "resolved": "https://registry.npmjs.org/@types/highlight.js/-/highlight.js-9.1.9.tgz",
       "integrity": "sha1-7WM2lV6vIzt163kjubHzc9BF7wE="
     },
-    "@types/karma": {
-      "version": "0.13.33",
-      "resolved": "https://registry.npmjs.org/@types/karma/-/karma-0.13.33.tgz",
-      "integrity": "sha1-ODXT2U6IS23oiEo+cKb1aQ5qWFA="
-    },
-    "@types/lodash": {
-      "version": "4.14.52",
-      "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.52.tgz",
-      "integrity": "sha1-3lx6sU2hKJczIzybDsb543fbkPU="
-    },
-    "@types/log4js": {
-      "version": "0.0.33",
-      "resolved": "https://registry.npmjs.org/@types/log4js/-/log4js-0.0.33.tgz",
-      "integrity": "sha512-AiV2aDM8FZoSh/cRzWA3y9kffXjzTMS1x002FfwzYzbg8cYJpTgTGyjWuJl0b0bZxluOpgqcA248xmtXrJ1TBg=="
-    },
-    "@types/merge2": {
-      "version": "0.3.29",
-      "resolved": "https://registry.npmjs.org/@types/merge2/-/merge2-0.3.29.tgz",
-      "integrity": "sha1-y1UumCbKPAjZ5lSd6ezY8VQX8G0="
-    },
-    "@types/mime": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.1.tgz",
-      "integrity": "sha512-rek8twk9C58gHYqIrUlJsx8NQMhlxqHzln9Z9ODqiNgv3/s+ZwIrfr+djqzsnVM12xe9hL98iJ20lj2RvCBv6A=="
-    },
-    "@types/minimatch": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.1.tgz",
-      "integrity": "sha512-rUO/jz10KRSyA9SHoCWQ8WX9BICyj5jZYu1/ucKEJKb4KzLZCKMURdYbadP157Q6Zl1x0vHsrU+Z/O0XlhYQDw=="
-    },
     "@types/mocha": {
       "version": "2.2.39",
       "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.39.tgz",
       "integrity": "sha1-9o1j24tpw46VWLQHNSXPlsT3qCk="
     },
-    "@types/node": {
-      "version": "6.0.62",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.62.tgz",
-      "integrity": "sha1-hSIsB3tU8ltXQXu3CLn4d72jf4k="
-    },
-    "@types/node-notifier": {
-      "version": "0.0.28",
-      "resolved": "https://registry.npmjs.org/@types/node-notifier/-/node-notifier-0.0.28.tgz",
-      "integrity": "sha1-hro9OqjZGDUswxkdiN4yiyDck8E="
-    },
-    "@types/node-uuid": {
-      "version": "0.0.28",
-      "resolved": "https://registry.npmjs.org/@types/node-uuid/-/node-uuid-0.0.28.tgz",
-      "integrity": "sha1-QWVbXOY7LzN0xOgmtN0h5ykFjj0="
-    },
-    "@types/orchestrator": {
-      "version": "0.0.30",
-      "resolved": "https://registry.npmjs.org/@types/orchestrator/-/orchestrator-0.0.30.tgz",
-      "integrity": "sha1-3N2o1ke1aLex40F4yx8LRKyamOU="
-    },
     "@types/prop-types": {
       "version": "15.5.1",
       "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.5.1.tgz",
       "integrity": "sha1-Hs9SYhKZ5luFU3Qzf7Ef0tEGb8E="
     },
-    "@types/q": {
-      "version": "0.0.32",
-      "resolved": "https://registry.npmjs.org/@types/q/-/q-0.0.32.tgz",
-      "integrity": "sha1-vShOV8hPEyXacCur/IKlMoGQwMU="
-    },
     "@types/react": {
       "version": "15.0.38",
       "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.38.tgz",
@@ -2868,95 +2051,30 @@
       "resolved": "https://registry.npmjs.org/@types/resemblejs/-/resemblejs-1.3.28.tgz",
       "integrity": "sha1-Lg2ztf2w8vPUVPXXLhMkEgnql60="
     },
-    "@types/resolve": {
-      "version": "0.0.4",
-      "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-0.0.4.tgz",
-      "integrity": "sha1-m1htZalH3qiMS8JNoLkF/pUgoNU="
-    },
-    "@types/rimraf": {
-      "version": "0.0.28",
-      "resolved": "https://registry.npmjs.org/@types/rimraf/-/rimraf-0.0.28.tgz",
-      "integrity": "sha1-VWJRm8eWPKyoq/fxKMrjtZTUHQY="
-    },
-    "@types/semver": {
-      "version": "5.3.33",
-      "resolved": "https://registry.npmjs.org/@types/semver/-/semver-5.3.33.tgz",
-      "integrity": "sha512-UwrBgjsRS8BSsckIEdrAhIAmdh0MJidtKTvD3S6tpMq6qHLY3uGaNYcRDUjPxpF4hOAOEbMNSXhhfxmNHB1QNQ=="
-    },
-    "@types/serve-static": {
-      "version": "1.7.31",
-      "resolved": "https://registry.npmjs.org/@types/serve-static/-/serve-static-1.7.31.tgz",
-      "integrity": "sha1-FUVt6NmNa0z/Mb5savdJKuY/Uho="
-    },
     "@types/sinon": {
       "version": "2.2.2",
       "resolved": "https://registry.npmjs.org/@types/sinon/-/sinon-2.2.2.tgz",
       "integrity": "sha1-qA2khougisysvOTTcnbzXhugpS8="
     },
-    "@types/source-map": {
-      "version": "0.5.1",
-      "resolved": "https://registry.npmjs.org/@types/source-map/-/source-map-0.5.1.tgz",
-      "integrity": "sha512-/GVAjL1Y8puvZab63n8tsuBiYwZt1bApMdx58/msQ9ID5T05ov+wm/ZV1DvYC/DKKEygpTJViqQvkh5Rhrl4CA=="
-    },
-    "@types/tapable": {
-      "version": "0.2.4",
-      "resolved": "https://registry.npmjs.org/@types/tapable/-/tapable-0.2.4.tgz",
-      "integrity": "sha512-pclMAvhPnXJcJu1ZZ8bQthuUcdDWzDuxDdbSf6l1U6s4fP6EBiZpPsOZYqFOrbqDV97sXGFSsb6AUpiLfv4xIA=="
-    },
-    "@types/through2": {
-      "version": "2.0.32",
-      "resolved": "https://registry.npmjs.org/@types/through2/-/through2-2.0.32.tgz",
-      "integrity": "sha1-RwAkRQ8at2QPGfnr9C09pXTCYSk="
-    },
-    "@types/uglify-js": {
-      "version": "2.6.29",
-      "resolved": "https://registry.npmjs.org/@types/uglify-js/-/uglify-js-2.6.29.tgz",
-      "integrity": "sha512-BdFLCZW0GTl31AbqXSak8ss/MqEZ3DN2MH9rkAyGoTuzK7ifGUlX+u0nfbWeTsa7IPcZhtn8BlpYBXSV+vqGhQ=="
-    },
-    "@types/vinyl": {
-      "version": "1.2.30",
-      "resolved": "https://registry.npmjs.org/@types/vinyl/-/vinyl-1.2.30.tgz",
-      "integrity": "sha1-kRXAxFxAxXVziQa+n7Tfb1ueUBM="
-    },
-    "@types/webpack": {
-      "version": "2.2.4",
-      "resolved": "https://registry.npmjs.org/@types/webpack/-/webpack-2.2.4.tgz",
-      "integrity": "sha1-Ba+0r1t+zopNSRAw6Ux2nHqbwRA="
-    },
     "@types/webpack-env": {
       "version": "1.13.0",
       "resolved": "https://registry.npmjs.org/@types/webpack-env/-/webpack-env-1.13.0.tgz",
       "integrity": "sha1-MEQ4FkfhHulzxa8uklMjkw9pHYA="
     },
-    "@types/webpack-stream": {
-      "version": "3.2.5",
-      "resolved": "https://registry.npmjs.org/@types/webpack-stream/-/webpack-stream-3.2.5.tgz",
-      "integrity": "sha1-iwNFN5GCGX+y2prqCpMKzgDRkJs="
-    },
-    "@types/yargs": {
-      "version": "0.0.34",
-      "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-0.0.34.tgz",
-      "integrity": "sha1-FWBCn8VQxDvEGnt9PfoK+8yRSjU="
-    },
-    "@types/z-schema": {
-      "version": "3.16.31",
-      "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.31.tgz",
-      "integrity": "sha1-LrHQCl5Ow/pYx2r94S4YK2bcXBw="
-    },
     "@uifabric/example-app-base": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-4.2.1.tgz",
-      "integrity": "sha512-h31RK6ZihusHLr5qNNE57Isa9/f9l9l5GKyzVZwlKf2Ol7sC9tioTlyI54eNvCrTzIQqjziwh+xRl9f9NSNmcg=="
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-4.2.3.tgz",
+      "integrity": "sha512-aCLzsLbgzckDeQyK+bzNOXd9nLMRFsZCpS8VmQIdOn9w30q5gECqNC3SZpRZrJ8Pew+N5REpWPNS0Hp++N+AUQ=="
     },
     "@uifabric/styling": {
-      "version": "0.20.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.20.0.tgz",
-      "integrity": "sha512-tAR5notvVdKj5n2/+OyrWqmgp1fVIeSzmqoGEDbCsCEBj7WC5ir2lO6Cj4lDunzRlSGgbZVpYO2EKJ3xJy/Ctw=="
+      "version": "0.20.2",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.20.2.tgz",
+      "integrity": "sha512-POAynLm1clX1j+k7NGgV1PbXGTtofMYcxhpVmI1T9nRdo5pBHt8MuSH9GL4P255tkClW84bJe7l8b6eklcXa4g=="
     },
     "@uifabric/utilities": {
-      "version": "4.9.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.9.1.tgz",
-      "integrity": "sha512-CdFxnm5TbWF1775SEwJ1Kwn2eIdj9spy/BYhZAnFcLa2Bo9mXYDI3cAtVDdRuw5TAFYriZgtcSYxu9GkTavyFA=="
+      "version": "4.10.3",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.10.3.tgz",
+      "integrity": "sha512-fmOaqFNHC/hlxvNNvltPnWvcgvHcGH9WR9CL7svnxDBdIncLwSeRpS+C2byCizjaIVWbkk/NEPh/esD6nrSktg=="
     },
     "abbrev": {
       "version": "1.0.9",
@@ -2969,21 +2087,14 @@
       "integrity": "sha1-w8p0NJOGSMPg2cHjKN1otiLChMo="
     },
     "acorn": {
-      "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-3.3.0.tgz",
-      "integrity": "sha1-ReN/s56No/JbruP/U2niu18iAXo="
+      "version": "4.0.13",
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
+      "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c="
     },
     "acorn-dynamic-import": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/acorn-dynamic-import/-/acorn-dynamic-import-2.0.2.tgz",
-      "integrity": "sha1-x1K9IQvvZ5UBtsbLf8hPj0cVjMQ=",
-      "dependencies": {
-        "acorn": {
-          "version": "4.0.13",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
-          "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c="
-        }
-      }
+      "integrity": "sha1-x1K9IQvvZ5UBtsbLf8hPj0cVjMQ="
     },
     "after": {
       "version": "0.8.2",
@@ -2993,29 +2104,29 @@
     "agent-base": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-2.1.1.tgz",
-      "integrity": "sha1-1t4Q1a9hMtW9aSQn1G/FOFOQlMc=",
-      "dependencies": {
-        "semver": {
-          "version": "5.0.3",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.0.3.tgz",
-          "integrity": "sha1-d0Zt5YnNXTyV8TiqeLxWmjy10no="
-        }
-      }
+      "integrity": "sha1-1t4Q1a9hMtW9aSQn1G/FOFOQlMc="
     },
     "ajv": {
-      "version": "4.11.8",
-      "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz",
-      "integrity": "sha1-gv+wKynmYq5TvcIK8VlHcGc5xTY="
+      "version": "5.2.2",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-5.2.2.tgz",
+      "integrity": "sha1-R8aNaehvXZUxA7AHSpQw3GPaXjk="
     },
     "ajv-keywords": {
-      "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-1.5.1.tgz",
-      "integrity": "sha1-MU3QpLM2j609/NxU7eYXG4htrzw="
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-2.1.0.tgz",
+      "integrity": "sha1-opbhf3v658HOT34N5T0pyzIWLfA="
     },
     "align-text": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/align-text/-/align-text-0.1.4.tgz",
-      "integrity": "sha1-DNkKVhCT810KmSVsIrcGlDP60Rc="
+      "integrity": "sha1-DNkKVhCT810KmSVsIrcGlDP60Rc=",
+      "dependencies": {
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+        }
+      }
     },
     "alphanum-sort": {
       "version": "1.0.2",
@@ -3027,38 +2138,6 @@
       "resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz",
       "integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU="
     },
-    "ansi-align": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-2.0.0.tgz",
-      "integrity": "sha1-w2rsy6VjuJzrVW82kPCx2eNUf38=",
-      "dependencies": {
-        "ansi-regex": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
-          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg="
-        },
-        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
-          "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8="
-        },
-        "string-width": {
-          "version": "2.1.1",
-          "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
-          "integrity": "sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw=="
-        },
-        "strip-ansi": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
-          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8="
-        }
-      }
-    },
-    "ansi-escapes": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz",
-      "integrity": "sha1-06ioOzGapneTZisT52HHkRQiMG4="
-    },
     "ansi-html": {
       "version": "0.0.7",
       "resolved": "https://registry.npmjs.org/ansi-html/-/ansi-html-0.0.7.tgz",
@@ -3070,9 +2149,9 @@
       "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
     },
     "ansi-styles": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-      "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
+      "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
     },
     "ansicolors": {
       "version": "0.2.1",
@@ -3082,39 +2161,59 @@
     "anymatch": {
       "version": "1.3.2",
       "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-1.3.2.tgz",
-      "integrity": "sha512-0XNayC8lTHQ2OI8aljNCN3sSx6hsr/1+rlcDAotXJR7C1oZZHCNsfpbKwMjRA3Uqb5tF1Rae2oloTr4xpq+WjA=="
+      "integrity": "sha512-0XNayC8lTHQ2OI8aljNCN3sSx6hsr/1+rlcDAotXJR7C1oZZHCNsfpbKwMjRA3Uqb5tF1Rae2oloTr4xpq+WjA==",
+      "dependencies": {
+        "arr-diff": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
+          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8="
+        },
+        "array-unique": {
+          "version": "0.2.1",
+          "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
+          "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM="
+        },
+        "braces": {
+          "version": "1.8.5",
+          "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
+          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
+        },
+        "expand-brackets": {
+          "version": "0.1.5",
+          "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
+          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s="
+        },
+        "extglob": {
+          "version": "0.3.2",
+          "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
+          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
+        },
+        "is-extglob": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
+          "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
+        },
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+        },
+        "micromatch": {
+          "version": "2.3.11",
+          "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
+          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
+        }
+      }
     },
     "aproba": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.1.2.tgz",
       "integrity": "sha512-ZpYajIfO0j2cOFTO955KUMIKNmj6zhX8kVztMAxFsDaMwz+9Z9SV0uou2pC9HJqcfpffOsjnbrDMvkNy+9RXPw=="
     },
-    "archy": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/archy/-/archy-1.0.0.tgz",
-      "integrity": "sha1-+cjBN1fMHde8N5rHeyxipcKGjEA="
-    },
     "are-we-there-yet": {
       "version": "1.1.4",
       "resolved": "https://registry.npmjs.org/are-we-there-yet/-/are-we-there-yet-1.1.4.tgz",
-      "integrity": "sha1-u13KOCu5TwXhUZQ3PRb9O6HKEQ0=",
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        }
-      }
+      "integrity": "sha1-u13KOCu5TwXhUZQ3PRb9O6HKEQ0="
     },
     "argparse": {
       "version": "1.0.9",
@@ -3122,24 +2221,19 @@
       "integrity": "sha1-c9g7wmP4bpf4zE9rrhsOkKfSLIY="
     },
     "arr-diff": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
-      "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8="
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-4.0.0.tgz",
+      "integrity": "sha1-1kYQdP6/7HHn4VI1dhoyml3HxSA="
     },
     "arr-flatten": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.1.0.tgz",
       "integrity": "sha512-L3hKV5R/p5o81R7O02IGnwpDmkp6E982XhtbuwSe3O4qOtMMMtodicASA1Cny2U+aCXcNpml+m4dPsvsJ3jatg=="
     },
-    "array-differ": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/array-differ/-/array-differ-1.0.0.tgz",
-      "integrity": "sha1-7/UuN1gknTO+QCuLuOVkuytdQDE="
-    },
-    "array-each": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/array-each/-/array-each-1.0.1.tgz",
-      "integrity": "sha1-p5SvDAWrF1KEbudTofIRoFugxE8="
+    "arr-union": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/arr-union/-/arr-union-3.1.0.tgz",
+      "integrity": "sha1-45sJrqne+Gao8gbiiK9jkZuuOcQ="
     },
     "array-filter": {
       "version": "0.0.1",
@@ -3167,9 +2261,9 @@
       "integrity": "sha1-FziZ0//Rx9k4PkR5Ul2+J4yrXys="
     },
     "array-slice": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/array-slice/-/array-slice-1.0.0.tgz",
-      "integrity": "sha1-5zA08A3MH0CHYAj9IP6ud71LfC8="
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/array-slice/-/array-slice-0.2.3.tgz",
+      "integrity": "sha1-3Tz7gO15c6dRF82sabC5nshhhvU="
     },
     "array-union": {
       "version": "1.0.2",
@@ -3182,20 +2276,15 @@
       "integrity": "sha1-r2rId6Jcx/dOBYiUdThY39sk/bY="
     },
     "array-unique": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
-      "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM="
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.3.2.tgz",
+      "integrity": "sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg="
     },
     "arraybuffer.slice": {
       "version": "0.0.6",
       "resolved": "https://registry.npmjs.org/arraybuffer.slice/-/arraybuffer.slice-0.0.6.tgz",
       "integrity": "sha1-8zshWfBTKj8xB6JywMz70a0peco="
     },
-    "arrify": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz",
-      "integrity": "sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0="
-    },
     "asap": {
       "version": "2.0.6",
       "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz",
@@ -3226,11 +2315,6 @@
       "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-1.0.2.tgz",
       "integrity": "sha1-E8pRXYYgbaC6xm6DTdOX2HWBCUw="
     },
-    "ast-types": {
-      "version": "0.9.6",
-      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.9.6.tgz",
-      "integrity": "sha1-ECyenpAF0+fjgpvwxPok7oYu6bk="
-    },
     "async": {
       "version": "1.5.2",
       "resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz",
@@ -3251,35 +2335,28 @@
       "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
       "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k="
     },
+    "atob": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/atob/-/atob-2.0.3.tgz",
+      "integrity": "sha1-GcenYEc3dEaPILLS0DNyrX1Mv10="
+    },
     "autoprefixer": {
-      "version": "6.3.7",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.3.7.tgz",
-      "integrity": "sha1-jt8xZt2f1hFlM2Ysi7NqA8DvyHQ=",
+      "version": "7.1.3",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-7.1.3.tgz",
+      "integrity": "sha512-zGy6aRrZjWhR+25n89jYkpLXutg6xdDGKKnVNzkfamnnhK3mYchkKj5GJR14aJiU0x4UqZ1+N728tkFNUL5N2g==",
       "dependencies": {
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
-          "dependencies": {
-            "supports-color": {
-              "version": "2.0.0",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-            }
-          }
-        },
-        "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        "browserslist": {
+          "version": "2.4.0",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.4.0.tgz",
+          "integrity": "sha512-aM2Gt4x9bVlCUteADBS6JP0F+2tMWKM1jQzUulVROtdFWFIcIVvY76AJbr7GDqy0eDhn+PcnpzzivGxY4qiaKQ=="
         }
       }
     },
+    "awesome-typescript-loader": {
+      "version": "3.2.3",
+      "resolved": "https://registry.npmjs.org/awesome-typescript-loader/-/awesome-typescript-loader-3.2.3.tgz",
+      "integrity": "sha512-zGGD6j6jYYtIOBtfhtnrbNB3dlDThVdgF9CQhkPqBwPUUsyJOHNxj9d2LOmVJY1PlBoNPABoDeyRfphIDeYGxA=="
+    },
     "aws-sign2": {
       "version": "0.6.0",
       "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz",
@@ -3290,107 +2367,70 @@
       "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.6.0.tgz",
       "integrity": "sha1-g+9cqGCysy5KDe7e6MdxudtXRx4="
     },
-    "azure-storage": {
-      "version": "0.10.0",
-      "resolved": "https://registry.npmjs.org/azure-storage/-/azure-storage-0.10.0.tgz",
-      "integrity": "sha1-QsV7ty1vM+u3jS2VTds99Jp1sro=",
+    "babel-code-frame": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
+      "integrity": "sha1-Y/1D99weO7fONZR9uP42mj9Yx0s=",
       "dependencies": {
-        "async": {
-          "version": "2.5.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
-          "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw=="
-        },
-        "caseless": {
-          "version": "0.11.0",
-          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz",
-          "integrity": "sha1-cVuW6phBWTzDMGeSP17GDr2k99c="
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
         },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
         },
-        "extend": {
-          "version": "1.2.1",
-          "resolved": "https://registry.npmjs.org/extend/-/extend-1.2.1.tgz",
-          "integrity": "sha1-oPX9bPyDpf5J72mNYOyKYk3UV2w="
-        },
-        "form-data": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/form-data/-/form-data-1.0.1.tgz",
-          "integrity": "sha1-rjFduaSQf6BlUCMEpm13M0de43w="
-        },
-        "har-validator": {
-          "version": "2.0.6",
-          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz",
-          "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0="
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "node-uuid": {
-          "version": "1.4.8",
-          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz",
-          "integrity": "sha1-sEDrCSOWivq/jTL7HxfxFn/auQc="
-        },
-        "qs": {
-          "version": "6.0.4",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-6.0.4.tgz",
-          "integrity": "sha1-UQGdhHIMk5uCc36EVWp4Izjs6ns="
-        },
-        "readable-stream": {
-          "version": "2.0.6",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz",
-          "integrity": "sha1-j5A0HmilPMySh4jaz80Rs265t44="
-        },
-        "request": {
-          "version": "2.69.0",
-          "resolved": "https://registry.npmjs.org/request/-/request-2.69.0.tgz",
-          "integrity": "sha1-z5HS4AB1KxIXFVwAUkGRGZGiNGo=",
-          "dependencies": {
-            "extend": {
-              "version": "3.0.1",
-              "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz",
-              "integrity": "sha1-p1Xqe8Gt/MWjHOfnYtuq3F5jZEQ="
-            }
-          }
-        },
-        "tough-cookie": {
-          "version": "2.2.2",
-          "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.2.2.tgz",
-          "integrity": "sha1-yDoYMPTl7wuT7yo0iOck+N4Basc="
-        },
-        "tunnel-agent": {
-          "version": "0.4.3",
-          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz",
-          "integrity": "sha1-Y3PbdpCf5XDgjXNYM2Xtgop07us="
-        },
-        "validator": {
-          "version": "3.22.2",
-          "resolved": "https://registry.npmjs.org/validator/-/validator-3.22.2.tgz",
-          "integrity": "sha1-byl65n9/gqzHbQr9tJ8Y2aCcGMA="
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
         }
       }
     },
-    "babel-code-frame": {
+    "babel-generator": {
       "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
-      "integrity": "sha1-Y/1D99weO7fONZR9uP42mj9Yx0s=",
+      "resolved": "https://registry.npmjs.org/babel-generator/-/babel-generator-6.26.0.tgz",
+      "integrity": "sha1-rBriAHC3n248odMmlhMFN3TyDcU=",
       "dependencies": {
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        "jsesc": {
+          "version": "1.3.0",
+          "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-1.3.0.tgz",
+          "integrity": "sha1-RsP+yMGJKxKwgz25vHYiF226s0s="
         }
       }
     },
+    "babel-messages": {
+      "version": "6.23.0",
+      "resolved": "https://registry.npmjs.org/babel-messages/-/babel-messages-6.23.0.tgz",
+      "integrity": "sha1-8830cDhYA1sqKVHG7F7fbGLyYw4="
+    },
     "babel-runtime": {
       "version": "6.26.0",
       "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz",
       "integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4="
     },
+    "babel-template": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-template/-/babel-template-6.26.0.tgz",
+      "integrity": "sha1-3gPi0WOWsGn0bdn/+FIfsaDjXgI="
+    },
+    "babel-traverse": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-traverse/-/babel-traverse-6.26.0.tgz",
+      "integrity": "sha1-RqnL1+3MYsjlwGTi0tjQ9ANXZu4="
+    },
+    "babel-types": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-types/-/babel-types-6.26.0.tgz",
+      "integrity": "sha1-o7Bz+Uq0nrb6Vc1lInozQ4BjJJc="
+    },
+    "babylon": {
+      "version": "6.18.0",
+      "resolved": "https://registry.npmjs.org/babylon/-/babylon-6.18.0.tgz",
+      "integrity": "sha512-q/UEjfGJ2Cm3oKV71DJz9d25TPnq5rhBVL2Q4fA5wcC3jcrdn7+SssEybFIxwAvvP+YCsCYNKughoF33GxgycQ=="
+    },
     "backo2": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz",
@@ -3401,10 +2441,32 @@
       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
       "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c="
     },
-    "Base64": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/Base64/-/Base64-0.2.1.tgz",
-      "integrity": "sha1-ujpCMHCOGGcFBl5mur3Uw1z2ACg="
+    "base": {
+      "version": "0.11.1",
+      "resolved": "https://registry.npmjs.org/base/-/base-0.11.1.tgz",
+      "integrity": "sha1-s2p/ERE4U6NCoVaR2Y4tzIpswnA=",
+      "dependencies": {
+        "define-property": {
+          "version": "0.2.5",
+          "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
+          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY="
+        },
+        "is-descriptor": {
+          "version": "0.1.6",
+          "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
+          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
+        },
+        "isobject": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
+          "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk="
+        },
+        "kind-of": {
+          "version": "5.0.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
+          "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
+        }
+      }
     },
     "base64-arraybuffer": {
       "version": "0.1.5",
@@ -3416,30 +2478,15 @@
       "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.2.1.tgz",
       "integrity": "sha512-dwVUVIXsBZXwTuwnXI9RK8sBmgq09NDHzyR9SAph9eqk76gKK2JSQmZARC2zRC81JC2QTtxD0ARU5qTS25gIGw=="
     },
-    "base64-url": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/base64-url/-/base64-url-1.2.1.tgz",
-      "integrity": "sha1-GZ/WYXAqDnt9yubgaYuwicUvbXg="
-    },
     "base64id": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/base64id/-/base64id-1.0.0.tgz",
       "integrity": "sha1-R2iMuZu2gE8OBtPnY7HDLlfY5rY="
     },
-    "basic-auth": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/basic-auth/-/basic-auth-1.0.4.tgz",
-      "integrity": "sha1-Awk1sB3nyblKgksp8/zLdQ06UpA="
-    },
-    "basic-auth-connect": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/basic-auth-connect/-/basic-auth-connect-1.0.0.tgz",
-      "integrity": "sha1-/bC0OWLKe0BFanwrtI/hc9otISI="
-    },
     "batch": {
-      "version": "0.5.3",
-      "resolved": "https://registry.npmjs.org/batch/-/batch-0.5.3.tgz",
-      "integrity": "sha1-PzQU84AyF0O/wQQvmoP/HVgk1GQ="
+      "version": "0.6.1",
+      "resolved": "https://registry.npmjs.org/batch/-/batch-0.6.1.tgz",
+      "integrity": "sha1-3DQxT05nkxgJP8dgJyUl+UvyXBY="
     },
     "bcrypt-pbkdf": {
       "version": "1.0.1",
@@ -3447,11 +2494,6 @@
       "integrity": "sha1-Y7xdy2EzG5K8Bf1SiVPDNGKgb40=",
       "optional": true
     },
-    "beeper": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/beeper/-/beeper-1.1.1.tgz",
-      "integrity": "sha1-5tXqjF2tABMEpwsiY4RH9pyy+Ak="
-    },
     "better-assert": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/better-assert/-/better-assert-1.0.2.tgz",
@@ -3467,33 +2509,6 @@
       "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.10.0.tgz",
       "integrity": "sha1-muuabF6IY4qtFx4Wf1kAq+JINdA="
     },
-    "binaryextensions": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/binaryextensions/-/binaryextensions-1.0.1.tgz",
-      "integrity": "sha1-HmN0iLNbWL2l9HdL+WpSEqjJB1U="
-    },
-    "bindings": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.2.1.tgz",
-      "integrity": "sha1-FK1hE4EtLTfXLme0ystLtyZQXxE="
-    },
-    "bl": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/bl/-/bl-1.0.3.tgz",
-      "integrity": "sha1-/FQhoo/UImA2w7OJGmaiW8ZNIm4=",
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "readable-stream": {
-          "version": "2.0.6",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz",
-          "integrity": "sha1-j5A0HmilPMySh4jaz80Rs265t44="
-        }
-      }
-    },
     "blob": {
       "version": "0.0.4",
       "resolved": "https://registry.npmjs.org/blob/-/blob-0.0.4.tgz",
@@ -3517,7 +2532,14 @@
     "body-parser": {
       "version": "1.17.2",
       "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.17.2.tgz",
-      "integrity": "sha1-+IkqvI+eYn1Crtr7yma/WrmRBO4="
+      "integrity": "sha1-+IkqvI+eYn1Crtr7yma/WrmRBO4=",
+      "dependencies": {
+        "debug": {
+          "version": "2.6.7",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.7.tgz",
+          "integrity": "sha1-krrR9tBbu2u6Isyoi80OyJTChh4="
+        }
+      }
     },
     "bonjour": {
       "version": "3.5.0",
@@ -3546,47 +2568,15 @@
       "resolved": "https://registry.npmjs.org/bowser/-/bowser-1.7.2.tgz",
       "integrity": "sha1-uUzGklumteB8QhpY5gHORhEmRXI="
     },
-    "boxen": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/boxen/-/boxen-1.2.1.tgz",
-      "integrity": "sha1-DxHn/jRO25OXl3/BPt5/ZNlWSB0=",
-      "dependencies": {
-        "ansi-regex": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
-          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg="
-        },
-        "camelcase": {
-          "version": "4.1.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
-          "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
-        },
-        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
-          "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8="
-        },
-        "string-width": {
-          "version": "2.1.1",
-          "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
-          "integrity": "sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw=="
-        },
-        "strip-ansi": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
-          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8="
-        }
-      }
-    },
     "brace-expansion": {
       "version": "1.1.8",
       "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.8.tgz",
       "integrity": "sha1-wHshHHyVLsH479Uad+8NHTmQopI="
     },
     "braces": {
-      "version": "1.8.5",
-      "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
-      "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/braces/-/braces-2.2.2.tgz",
+      "integrity": "sha1-JB+GjCsmkNn+vu5afIP7vyXQCxs="
     },
     "brorand": {
       "version": "1.1.0",
@@ -3613,11 +2603,6 @@
       "resolved": "https://registry.npmjs.org/browserify-des/-/browserify-des-1.0.0.tgz",
       "integrity": "sha1-2qJ3cXRwki7S/hhZQRihdUOXId0="
     },
-    "browserify-mime": {
-      "version": "1.2.9",
-      "resolved": "https://registry.npmjs.org/browserify-mime/-/browserify-mime-1.2.9.tgz",
-      "integrity": "sha1-rrGvKN5sDXpqLOQK22j/GEIq8x8="
-    },
     "browserify-rsa": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz",
@@ -3634,21 +2619,14 @@
       "integrity": "sha1-uzX4pRn2AOD6a4SFJByXnQFB+y0="
     },
     "browserslist": {
-      "version": "1.3.6",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.3.6.tgz",
-      "integrity": "sha1-lS/0jVZGPTtTj4XvL46t39KEsTM="
+      "version": "1.7.7",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
+      "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk="
     },
     "buffer": {
       "version": "4.9.1",
       "resolved": "https://registry.npmjs.org/buffer/-/buffer-4.9.1.tgz",
-      "integrity": "sha1-bRu2AbB6TvztlwlBMgkwJ8lbwpg=",
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        }
-      }
+      "integrity": "sha1-bRu2AbB6TvztlwlBMgkwJ8lbwpg="
     },
     "buffer-indexof": {
       "version": "1.1.1",
@@ -3675,21 +2653,16 @@
       "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz",
       "integrity": "sha1-fZcZb51br39pNeJZhVSe3SpsIzk="
     },
-    "cache-swap": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/cache-swap/-/cache-swap-0.3.0.tgz",
-      "integrity": "sha1-HFQaoQilAQb2ML3Zj+HeyLoTP1E="
+    "cache-base": {
+      "version": "0.8.5",
+      "resolved": "https://registry.npmjs.org/cache-base/-/cache-base-0.8.5.tgz",
+      "integrity": "sha1-YM6zUEAh7O7HAR/TOEt/TpVym/o="
     },
     "callsite": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/callsite/-/callsite-1.0.0.tgz",
       "integrity": "sha1-KAOY5dZkvXQDi28JBRU+borxvCA="
     },
-    "camel-case": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/camel-case/-/camel-case-3.0.0.tgz",
-      "integrity": "sha1-yjw2iKTpzzpM2nd9xNy8cTJJz3M="
-    },
     "camelcase": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz",
@@ -3706,19 +2679,14 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000717",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000717.tgz",
-      "integrity": "sha1-J931/szdM4yZpiyXiMJpT5n2ftc="
+      "version": "1.0.30000718",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000718.tgz",
+      "integrity": "sha1-hs3ZeYcwJVSTTGHhBvTkcPFvmTw="
     },
     "caniuse-lite": {
-      "version": "1.0.30000717",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000717.tgz",
-      "integrity": "sha1-RTmxJq94fB1IUZRN4isr2HgNNhI="
-    },
-    "capture-stack-trace": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/capture-stack-trace/-/capture-stack-trace-1.0.0.tgz",
-      "integrity": "sha1-Sm+gc5nCa7pH8LJJa00PtAjFVQ0="
+      "version": "1.0.30000718",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000718.tgz",
+      "integrity": "sha1-DdJCkL6xExCy2A9rcKgjwqZab60="
     },
     "cardinal": {
       "version": "1.0.0",
@@ -3730,64 +2698,37 @@
       "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz",
       "integrity": "sha1-G2gcIf+EAzyCZUMJBolCDRhxUdw="
     },
-    "casperjs": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/casperjs/-/casperjs-1.1.3.tgz",
-      "integrity": "sha1-llPecx+KpE0JFaaboiMxZLsur5Q="
-    },
     "center-align": {
       "version": "0.1.3",
       "resolved": "https://registry.npmjs.org/center-align/-/center-align-0.1.3.tgz",
-      "integrity": "sha1-qg0yYptu6XIgBBHL1EYckHvCt60="
+      "integrity": "sha1-qg0yYptu6XIgBBHL1EYckHvCt60=",
+      "dependencies": {
+        "lazy-cache": {
+          "version": "1.0.4",
+          "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-1.0.4.tgz",
+          "integrity": "sha1-odePw6UEdMuAhF07O24dpJpEbo4="
+        }
+      }
     },
     "chai": {
-      "version": "3.5.0",
-      "resolved": "https://registry.npmjs.org/chai/-/chai-3.5.0.tgz",
-      "integrity": "sha1-TQJjewZ/6Vi9v906QOxW/vc3Mkc="
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/chai/-/chai-4.1.1.tgz",
+      "integrity": "sha1-ZuISeebzxkFf+CMYeCJ5AOIXGzk="
     },
     "chalk": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
-      "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ==",
-      "dependencies": {
-        "ansi-styles": {
-          "version": "3.2.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
-          "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
-        },
-        "has-flag": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
-          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
-        },
-        "supports-color": {
-          "version": "4.2.1",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
-          "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
-        }
-      }
+      "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ=="
     },
-    "charenc": {
-      "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/charenc/-/charenc-0.0.2.tgz",
-      "integrity": "sha1-wKHS86cJLgN3S/qD8UwPxXkKhmc="
+    "check-error": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/check-error/-/check-error-1.0.2.tgz",
+      "integrity": "sha1-V00xLt2Iu13YkS6Sht1sCu1KrII="
     },
     "cheerio": {
       "version": "0.22.0",
       "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-0.22.0.tgz",
-      "integrity": "sha1-qbqoYKP5tZWmuBsahocxIe06Jp4=",
-      "dependencies": {
-        "lodash.defaults": {
-          "version": "4.2.0",
-          "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-4.2.0.tgz",
-          "integrity": "sha1-0JF4cW/+pN3p5ft7N/bwgCJ0WAw="
-        },
-        "lodash.merge": {
-          "version": "4.6.0",
-          "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.0.tgz",
-          "integrity": "sha1-aYhLoUSsM/5plzemCG3v+t0PicU="
-        }
-      }
+      "integrity": "sha1-qbqoYKP5tZWmuBsahocxIe06Jp4="
     },
     "chokidar": {
       "version": "1.7.0",
@@ -3804,27 +2745,44 @@
       "resolved": "https://registry.npmjs.org/clap/-/clap-1.2.0.tgz",
       "integrity": "sha1-WckP4+E3EEdG/xlGmiemNP9oyFc=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
         }
       }
     },
-    "clean-css": {
-      "version": "4.1.7",
-      "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.7.tgz",
-      "integrity": "sha1-ua6k+FZ5iJzz6ui0A0nsTr390DI="
-    },
-    "cli-boxes": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/cli-boxes/-/cli-boxes-1.0.0.tgz",
-      "integrity": "sha1-T6kXw+WclKAEzWH47lCdplFocUM="
-    },
-    "cli-cursor": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-1.0.2.tgz",
-      "integrity": "sha1-ZNo/fValRBLll5S9Ytw1KV6PKYc="
+    "class-utils": {
+      "version": "0.3.5",
+      "resolved": "https://registry.npmjs.org/class-utils/-/class-utils-0.3.5.tgz",
+      "integrity": "sha1-F+eTEDdQ+WJ7IXbqNM/RtWWQPIA=",
+      "dependencies": {
+        "define-property": {
+          "version": "0.2.5",
+          "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
+          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY="
+        },
+        "is-descriptor": {
+          "version": "0.1.6",
+          "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
+          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
+        },
+        "kind-of": {
+          "version": "5.0.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
+          "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
+        }
+      }
     },
     "cli-table": {
       "version": "0.3.1",
@@ -3843,26 +2801,23 @@
       "resolved": "https://registry.npmjs.org/cli-usage/-/cli-usage-0.1.4.tgz",
       "integrity": "sha1-fAHg3HBsI0s5yTODjI4gshdXduI="
     },
-    "cli-width": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-1.1.1.tgz",
-      "integrity": "sha1-pNKT72frt7iNSk1CwMzwDE0eNm0="
-    },
     "cliui": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
-      "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
+      "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE=",
+      "dependencies": {
+        "wordwrap": {
+          "version": "0.0.2",
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
+          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
+        }
+      }
     },
     "clone": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.2.tgz",
       "integrity": "sha1-Jgt6meux7f4kdTgXX3gyQ8sZ0Uk="
     },
-    "clone-buffer": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/clone-buffer/-/clone-buffer-1.0.0.tgz",
-      "integrity": "sha1-4+JbIHrE5wGvch4staFnksrD3Fg="
-    },
     "clone-deep": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-0.3.0.tgz",
@@ -3872,19 +2827,14 @@
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/for-own/-/for-own-1.0.0.tgz",
           "integrity": "sha1-xjMy9BXO3EsE2/5wz4NklMU8tEs="
+        },
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
         }
       }
     },
-    "clone-stats": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-0.0.1.tgz",
-      "integrity": "sha1-uI+UqCzzi4eR1YBG6kAprYjKmdE="
-    },
-    "cloneable-readable": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/cloneable-readable/-/cloneable-readable-1.0.0.tgz",
-      "integrity": "sha1-pikNQT8hemEjL5XkWP84QYz7ARc="
-    },
     "co": {
       "version": "4.6.0",
       "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
@@ -3900,6 +2850,11 @@
       "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz",
       "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c="
     },
+    "collection-visit": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/collection-visit/-/collection-visit-0.2.3.tgz",
+      "integrity": "sha1-L2JIPK7MlfCDuaRUo+6eYTmteVc="
+    },
     "color": {
       "version": "0.11.4",
       "resolved": "https://registry.npmjs.org/color/-/color-0.11.4.tgz",
@@ -3935,6 +2890,11 @@
       "resolved": "https://registry.npmjs.org/colors/-/colors-1.1.2.tgz",
       "integrity": "sha1-FopHAXVran9RoSzgyXv6KMCE7WM="
     },
+    "combine-lists": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/combine-lists/-/combine-lists-1.0.1.tgz",
+      "integrity": "sha1-RYwH4J4NkA/Ci3Cj/sLazR0st/Y="
+    },
     "combined-stream": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz",
@@ -3951,9 +2911,9 @@
       "integrity": "sha1-AMYIq33Nk4l8AAllGx06jh5zu9E="
     },
     "component-emitter": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.1.2.tgz",
-      "integrity": "sha1-KWWU8nU9qmOZbSrwjRWpURbJrsM="
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz",
+      "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY="
     },
     "component-inherit": {
       "version": "0.0.3",
@@ -3966,39 +2926,14 @@
       "integrity": "sha1-FnGKdd4oPtjmBAQWJaIGRYZ5fYo="
     },
     "compression": {
-      "version": "1.5.2",
-      "resolved": "https://registry.npmjs.org/compression/-/compression-1.5.2.tgz",
-      "integrity": "sha1-sDuNhub4rSloPLqN+R3cb/x3s5U=",
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/compression/-/compression-1.7.0.tgz",
+      "integrity": "sha1-AwyfGY8WQ6BX13anOOki2kNzAS0=",
       "dependencies": {
-        "accepts": {
-          "version": "1.2.13",
-          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.2.13.tgz",
-          "integrity": "sha1-5fHzkoxtlf2WVYw27D2dDeSm7Oo="
-        },
         "bytes": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.1.0.tgz",
-          "integrity": "sha1-rJPEEOL/ycx89LRks4KJBn9eR7Q="
-        },
-        "debug": {
-          "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
-        },
-        "ms": {
-          "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
-        },
-        "negotiator": {
-          "version": "0.5.3",
-          "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.5.3.tgz",
-          "integrity": "sha1-Jp1cR2gQ7JLtvntsLygxY4T5p+g="
-        },
-        "vary": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/vary/-/vary-1.0.1.tgz",
-          "integrity": "sha1-meSYFWaihhGN+yuBc1ffeZM3bRA="
+          "version": "2.5.0",
+          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.5.0.tgz",
+          "integrity": "sha1-TJQj6i0lLCcMQbK97+/5u2tiwGo="
         }
       }
     },
@@ -4010,74 +2945,18 @@
     "concat-stream": {
       "version": "1.6.0",
       "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.0.tgz",
-      "integrity": "sha1-CqxmL9Ur54lk1VMvaUeE5wEQrPc=",
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        }
-      }
-    },
-    "configstore": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.1.tgz",
-      "integrity": "sha512-5oNkD/L++l0O6xGXxb1EWS7SivtjfGQlRyxJsYgE0Z495/L81e2h4/d3r969hoPXuFItzNOKMtsXgYG4c7dYvw=="
+      "integrity": "sha1-CqxmL9Ur54lk1VMvaUeE5wEQrPc="
     },
     "connect": {
       "version": "3.6.3",
       "resolved": "https://registry.npmjs.org/connect/-/connect-3.6.3.tgz",
-      "integrity": "sha512-GLSZqgjVxPvGYVD/2vz//gS201MEXk4b7t3nHV6OVnTdDNWi/Gm7Rpxs/ybvljPWvULys/wrzIV3jB3YvEc3nQ==",
-      "dependencies": {
-        "debug": {
-          "version": "2.6.8",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
-          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
-        }
-      }
+      "integrity": "sha512-GLSZqgjVxPvGYVD/2vz//gS201MEXk4b7t3nHV6OVnTdDNWi/Gm7Rpxs/ybvljPWvULys/wrzIV3jB3YvEc3nQ=="
     },
     "connect-history-api-fallback": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.3.0.tgz",
       "integrity": "sha1-5R0X+PDvDbkKZP20feMFFVbp8Wk="
     },
-    "connect-livereload": {
-      "version": "0.5.4",
-      "resolved": "https://registry.npmjs.org/connect-livereload/-/connect-livereload-0.5.4.tgz",
-      "integrity": "sha1-gBV9E3HJ83zBQDmrGJWXDRGdw7w="
-    },
-    "connect-timeout": {
-      "version": "1.6.2",
-      "resolved": "https://registry.npmjs.org/connect-timeout/-/connect-timeout-1.6.2.tgz",
-      "integrity": "sha1-3ppexh4zoStu2qt7XwYumMWZuI4=",
-      "dependencies": {
-        "debug": {
-          "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
-        },
-        "http-errors": {
-          "version": "1.3.1",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
-          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
-        },
-        "ms": {
-          "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
-        }
-      }
-    },
     "console-browserify": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.1.0.tgz",
@@ -4089,9 +2968,9 @@
       "integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4="
     },
     "constants-browserify": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-0.0.1.tgz",
-      "integrity": "sha1-kld9tSe6bEzwpFaNhLwDH0QeIfI="
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz",
+      "integrity": "sha1-wguW2MYXdIqvHBYCF2DNJ/y4y3U="
     },
     "content-disposition": {
       "version": "0.5.2",
@@ -4113,23 +2992,16 @@
       "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.3.1.tgz",
       "integrity": "sha1-5+Ch+e9DtMi6klxcWpboBtFoc7s="
     },
-    "cookie-parser": {
-      "version": "1.3.5",
-      "resolved": "https://registry.npmjs.org/cookie-parser/-/cookie-parser-1.3.5.tgz",
-      "integrity": "sha1-nXVVcPtdF4kHcSJ6AjFNm+fPg1Y=",
-      "dependencies": {
-        "cookie": {
-          "version": "0.1.3",
-          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz",
-          "integrity": "sha1-5zSlwUF/zkctWu+Cw4HKu2TRpDU="
-        }
-      }
-    },
     "cookie-signature": {
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
       "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw="
     },
+    "copy-descriptor": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/copy-descriptor/-/copy-descriptor-0.1.1.tgz",
+      "integrity": "sha1-Z29us8OZl8LuGsOpJP1hJHSPV40="
+    },
     "core-js": {
       "version": "2.5.0",
       "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.5.0.tgz",
@@ -4143,61 +3015,34 @@
     "cosmiconfig": {
       "version": "2.2.2",
       "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-2.2.2.tgz",
-      "integrity": "sha512-GiNXLwAFPYHy25XmTPpafYvn3CLAkJ8FLsscq78MQd1Kh0OU6Yzhn4eV2MVF4G9WEQZoWEGltatdR+ntGPMl5A=="
+      "integrity": "sha512-GiNXLwAFPYHy25XmTPpafYvn3CLAkJ8FLsscq78MQd1Kh0OU6Yzhn4eV2MVF4G9WEQZoWEGltatdR+ntGPMl5A==",
+      "dependencies": {
+        "minimist": {
+          "version": "1.2.0",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
+          "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
+        }
+      }
     },
     "cpx": {
       "version": "1.5.0",
       "resolved": "https://registry.npmjs.org/cpx/-/cpx-1.5.0.tgz",
       "integrity": "sha1-GFvgGFEdhycN7czCkxceN2VauI8="
     },
-    "crc": {
-      "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/crc/-/crc-3.3.0.tgz",
-      "integrity": "sha1-+mIuG8OIvyVzCQgta2UgDOZwkLo="
-    },
     "create-ecdh": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.0.tgz",
       "integrity": "sha1-iIxyNZbN92EvZJgjPuvXo1MBc30="
     },
-    "create-error-class": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/create-error-class/-/create-error-class-3.0.2.tgz",
-      "integrity": "sha1-Br56vvlHo/FKMP1hBnHUAbyot7Y="
-    },
     "create-hash": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/create-hash/-/create-hash-1.1.3.tgz",
-      "integrity": "sha1-YGBCrIuSYnUPSDyt2rD1gZFy2P0=",
-      "dependencies": {
-        "ripemd160": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz",
-          "integrity": "sha1-D0WEKVxTo2KK9+bXmsohzlfRxuc="
-        },
-        "sha.js": {
-          "version": "2.4.8",
-          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz",
-          "integrity": "sha1-NwaMLEdra69ALRSknGf1l5IfY08="
-        }
-      }
+      "integrity": "sha1-YGBCrIuSYnUPSDyt2rD1gZFy2P0="
     },
     "create-hmac": {
       "version": "1.1.6",
       "resolved": "https://registry.npmjs.org/create-hmac/-/create-hmac-1.1.6.tgz",
-      "integrity": "sha1-rLniIaThe9sHbpBlfEK5PjcmzwY=",
-      "dependencies": {
-        "ripemd160": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz",
-          "integrity": "sha1-D0WEKVxTo2KK9+bXmsohzlfRxuc="
-        },
-        "sha.js": {
-          "version": "2.4.8",
-          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz",
-          "integrity": "sha1-NwaMLEdra69ALRSknGf1l5IfY08="
-        }
-      }
+      "integrity": "sha1-rLniIaThe9sHbpBlfEK5PjcmzwY="
     },
     "cross-spawn": {
       "version": "3.0.1",
@@ -4211,30 +3056,15 @@
         }
       }
     },
-    "crypt": {
-      "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/crypt/-/crypt-0.0.2.tgz",
-      "integrity": "sha1-iNf/fsDfuG9xPch7u0LQRNPmxBs="
-    },
     "cryptiles": {
       "version": "2.0.5",
       "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz",
       "integrity": "sha1-O9/s3GCBR8HGcgL6KR59ylnqo7g="
     },
     "crypto-browserify": {
-      "version": "3.2.8",
-      "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.2.8.tgz",
-      "integrity": "sha1-ubEdvm2WUd2IKgHmzEZ99xjs8Yk="
-    },
-    "crypto-random-string": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-1.0.0.tgz",
-      "integrity": "sha1-ojD2T1aDEOFJgAmUB5DsmVRbyn4="
-    },
-    "csrf": {
-      "version": "3.0.6",
-      "resolved": "https://registry.npmjs.org/csrf/-/csrf-3.0.6.tgz",
-      "integrity": "sha1-thEg3c7q/JHnbtUxO7XAsmZ7cQo="
+      "version": "3.11.1",
+      "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.1.tgz",
+      "integrity": "sha512-Na7ZlwCOqoaW5RwUK1WpXws2kv8mNhWdTlzob0UXulk6G9BDbyiJaGTYBIX61Ozn9l1EPPJpICZb4DaOpT9NlQ=="
     },
     "css-color-names": {
       "version": "0.0.4",
@@ -4251,6 +3081,11 @@
       "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.5.tgz",
       "integrity": "sha512-/FJmsDD8e6xZOBHMFShN/BCjnrEybq0spYaTZ1QoZ10/jhUa1LDDojQELu/JJ1ykZZjt0nSwkYrb2Mfx3bZx3Q==",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -4263,26 +3098,16 @@
             }
           }
         },
-        "loader-utils": {
-          "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
-          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
-        },
-        "lodash.camelcase": {
-          "version": "4.3.0",
-          "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz",
-          "integrity": "sha1-soqmKIorn8ZRA1x3EfZathkDMaY="
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
         },
-        "source-list-map": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-2.0.0.tgz",
-          "integrity": "sha512-I2UmuJSRr/T8jisiROLU3A3ltr+swpniSmNPI4Ml3ZCX6tVnDsuZzK7F2hl5jTqbZBWCEKlj5HRQiPExXLgE8A=="
-        },
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
@@ -4295,6 +3120,11 @@
       "resolved": "https://registry.npmjs.org/css-modules-loader-core/-/css-modules-loader-core-1.1.0.tgz",
       "integrity": "sha1-WQhmgpShvs0mGuCkziGwtVHyHRY=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -4307,6 +3137,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "6.0.1",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
@@ -4344,6 +3179,16 @@
       "resolved": "https://registry.npmjs.org/cssnano/-/cssnano-3.10.0.tgz",
       "integrity": "sha1-Tzj2zqK5sX+gFJDyPx3GjqZcHDg=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "autoprefixer": {
+          "version": "6.7.7",
+          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.7.7.tgz",
+          "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -4356,6 +3201,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -4373,23 +3223,6 @@
       "resolved": "https://registry.npmjs.org/csso/-/csso-2.3.2.tgz",
       "integrity": "sha1-3dUsWHAz9J6Utx/FVWnyUuj/X4U="
     },
-    "csurf": {
-      "version": "1.8.3",
-      "resolved": "https://registry.npmjs.org/csurf/-/csurf-1.8.3.tgz",
-      "integrity": "sha1-I/KhO/HY/OHQyZZYg5RELLqGpWo=",
-      "dependencies": {
-        "cookie": {
-          "version": "0.1.3",
-          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz",
-          "integrity": "sha1-5zSlwUF/zkctWu+Cw4HKu2TRpDU="
-        },
-        "http-errors": {
-          "version": "1.3.1",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
-          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
-        }
-      }
-    },
     "currently-unhandled": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz",
@@ -4400,11 +3233,6 @@
       "resolved": "https://registry.npmjs.org/custom-event/-/custom-event-1.0.1.tgz",
       "integrity": "sha1-XQKkaFCt8bSjF5RqOSj8y1v9BCU="
     },
-    "cyclist": {
-      "version": "0.2.2",
-      "resolved": "https://registry.npmjs.org/cyclist/-/cyclist-0.2.2.tgz",
-      "integrity": "sha1-GzN5LhHpFKL9bW7WRHRkRE5fpkA="
-    },
     "d": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/d/-/d-1.0.0.tgz",
@@ -4428,39 +3256,29 @@
       "integrity": "sha1-6vQ5/U1ISK105cx9vvIAZyueNFs="
     },
     "dateformat": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-2.0.0.tgz",
-      "integrity": "sha1-J0Pjq7XD/CRi5SfcpEXgTp9N7hc="
-    },
-    "deasync": {
-      "version": "0.1.10",
-      "resolved": "https://registry.npmjs.org/deasync/-/deasync-0.1.10.tgz",
-      "integrity": "sha1-TkpoNvvgR3vV+Qgwi9KpZVfV1/4="
+      "version": "1.0.12",
+      "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
+      "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk="
     },
     "debug": {
-      "version": "2.6.7",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.7.tgz",
-      "integrity": "sha1-krrR9tBbu2u6Isyoi80OyJTChh4="
+      "version": "2.6.8",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
+      "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
     },
     "decamelize": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
       "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA="
     },
-    "decomment": {
-      "version": "0.8.8",
-      "resolved": "https://registry.npmjs.org/decomment/-/decomment-0.8.8.tgz",
-      "integrity": "sha512-xVbmniKld/kjjmoHjT0Ex35aa16zw29WEzSAflBcMawjqDtZlrR6wkSwYV0mwJYytDz8JEAYia5Pl8IJRXdWLg=="
-    },
     "deep-eql": {
-      "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-0.1.3.tgz",
-      "integrity": "sha1-71WKyrjeJSBs1xOQbXTlaTDrafI=",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-2.0.2.tgz",
+      "integrity": "sha1-sbrAblbwp2d3aG1Qyf63XC7XZ5o=",
       "dependencies": {
         "type-detect": {
-          "version": "0.1.1",
-          "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-0.1.1.tgz",
-          "integrity": "sha1-C6XsKohWQORw6k6FBZcZANrFiCI="
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-3.0.0.tgz",
+          "integrity": "sha1-RtDMhVOrt7E6NSsNbeov1Y8tm1U="
         }
       }
     },
@@ -4469,32 +3287,20 @@
       "resolved": "https://registry.npmjs.org/deep-equal/-/deep-equal-1.0.1.tgz",
       "integrity": "sha1-9dJgKStmDghO/0zbyfCK0yR0SLU="
     },
-    "deep-extend": {
-      "version": "0.4.2",
-      "resolved": "https://registry.npmjs.org/deep-extend/-/deep-extend-0.4.2.tgz",
-      "integrity": "sha1-SLaZwn4zS/ifEIkr5DL25MfTSn8="
-    },
     "deep-is": {
       "version": "0.1.3",
       "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz",
       "integrity": "sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ="
     },
-    "defaults": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/defaults/-/defaults-1.0.3.tgz",
-      "integrity": "sha1-xlYFHpgX2f8I7YgUd/P+QBnz730="
-    },
     "define-properties": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.1.2.tgz",
-      "integrity": "sha1-g6c/L+pWmJj7c3GTyPhzyvbUXJQ=",
-      "dependencies": {
-        "object-keys": {
-          "version": "1.0.11",
-          "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.0.11.tgz",
-          "integrity": "sha1-xUYBd4rVYPEULODgG8yotW0TQm0="
-        }
-      }
+      "integrity": "sha1-g6c/L+pWmJj7c3GTyPhzyvbUXJQ="
+    },
+    "define-property": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/define-property/-/define-property-1.0.0.tgz",
+      "integrity": "sha1-dp66rz9KY6rTr56NMEybvnm/sOY="
     },
     "defined": {
       "version": "1.0.0",
@@ -4502,9 +3308,16 @@
       "integrity": "sha1-yY2bzvdWdBiOEQlpFRGZ45sfppM="
     },
     "del": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/del/-/del-2.2.2.tgz",
-      "integrity": "sha1-wSyYHQZ4RshLyvhiz/kw2Qf/0ag="
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/del/-/del-3.0.0.tgz",
+      "integrity": "sha1-U+z2mf/LyzljdpGrE7rxYIGXZuU=",
+      "dependencies": {
+        "pify": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
+          "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY="
+        }
+      }
     },
     "delayed-stream": {
       "version": "1.0.0",
@@ -4521,11 +3334,6 @@
       "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.1.tgz",
       "integrity": "sha1-V4O04cRZ8G+lyif5kfPQbnoxA1k="
     },
-    "deprecated": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/deprecated/-/deprecated-0.0.1.tgz",
-      "integrity": "sha1-+cmvVGSvoeepcUWKi97yqpTVuxk="
-    },
     "des.js": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/des.js/-/des.js-1.0.0.tgz",
@@ -4536,10 +3344,10 @@
       "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.0.4.tgz",
       "integrity": "sha1-l4hXRCxEdJ5CBmE+N5RiBYJqvYA="
     },
-    "detect-file": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/detect-file/-/detect-file-0.1.0.tgz",
-      "integrity": "sha1-STXe39lIhkjgBrASlWbpOGcR6mM="
+    "detect-indent": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/detect-indent/-/detect-indent-4.0.0.tgz",
+      "integrity": "sha1-920GQ1LN9Docts5hnE7jqUdd4gg="
     },
     "detect-node": {
       "version": "2.0.3",
@@ -4613,48 +3421,11 @@
       "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.5.1.tgz",
       "integrity": "sha1-3NhIiib1Y9YQeeSMn3t+Mjc2gs8="
     },
-    "dot-prop": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-4.2.0.tgz",
-      "integrity": "sha512-tUMXrxlExSW6U2EXiiKGSBVdYgtV8qlHL+C10TsW4PURY/ic+eaysnSkwB4kA/mBlCyy/IKDJ+Lc3wbWeaXtuQ=="
-    },
     "duplexer": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz",
       "integrity": "sha1-rOb/gIwc5mtX0ev5eXessCM0z8E="
     },
-    "duplexer2": {
-      "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.0.2.tgz",
-      "integrity": "sha1-xhTc9n4vsUmVqRcR5aYX6KYKMds="
-    },
-    "duplexer3": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/duplexer3/-/duplexer3-0.1.4.tgz",
-      "integrity": "sha1-7gHdHKwO08vH/b6jfcCo8c4ALOI="
-    },
-    "duplexify": {
-      "version": "3.5.1",
-      "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-3.5.1.tgz",
-      "integrity": "sha512-j5goxHTwVED1Fpe5hh3q9R93Kip0Bg2KVAt4f8CEYM3UEwYcPSvWbXaUQOzdX/HtiNomipv+gU7ASQPDbV7pGQ==",
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        }
-      }
-    },
     "ecc-jsbn": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.1.tgz",
@@ -4696,22 +3467,10 @@
       "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.12.tgz",
       "integrity": "sha1-U4tm8+5izRq1HsMjgp0flIDHS+s="
     },
-    "end-of-stream": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.1.0.tgz",
-      "integrity": "sha1-6TUyWLqpEIll78QcsO+K3i88+wc=",
-      "dependencies": {
-        "once": {
-          "version": "1.3.3",
-          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz",
-          "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA="
-        }
-      }
-    },
     "engine.io": {
-      "version": "1.8.4",
-      "resolved": "https://registry.npmjs.org/engine.io/-/engine.io-1.8.4.tgz",
-      "integrity": "sha1-d7zhK4Dl1gQpM3/sOw2vaR68kAM=",
+      "version": "1.8.3",
+      "resolved": "https://registry.npmjs.org/engine.io/-/engine.io-1.8.3.tgz",
+      "integrity": "sha1-jef5eJXSDTm4X4ju7nd7K9QrE9Q=",
       "dependencies": {
         "debug": {
           "version": "2.3.3",
@@ -4726,15 +3485,10 @@
       }
     },
     "engine.io-client": {
-      "version": "1.8.4",
-      "resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-1.8.4.tgz",
-      "integrity": "sha1-n+hd7iWFPKa6viW9KtaHEIY+kcI=",
+      "version": "1.8.3",
+      "resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-1.8.3.tgz",
+      "integrity": "sha1-F5jtk0USRkU9TG9jXXogH+lA1as=",
       "dependencies": {
-        "component-emitter": {
-          "version": "1.2.1",
-          "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz",
-          "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY="
-        },
         "debug": {
           "version": "2.3.3",
           "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
@@ -4744,11 +3498,6 @@
           "version": "0.7.2",
           "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
           "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
-        },
-        "ws": {
-          "version": "1.1.2",
-          "resolved": "https://registry.npmjs.org/ws/-/ws-1.1.2.tgz",
-          "integrity": "sha1-iiRPoFJAHgjJiGz0SoUYnh/UBn8="
         }
       }
     },
@@ -4758,16 +3507,9 @@
       "integrity": "sha1-k3sHnwAH0Ik+xW1GyyILjLQ1Igo="
     },
     "enhanced-resolve": {
-      "version": "0.9.1",
-      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-0.9.1.tgz",
-      "integrity": "sha1-TW5omzcl+GCQknzMhs2fFjW4ni4=",
-      "dependencies": {
-        "memory-fs": {
-          "version": "0.2.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.2.0.tgz",
-          "integrity": "sha1-8rslNovBIeORwlIN6Slpyu4KApA="
-        }
-      }
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.3.0.tgz",
+      "integrity": "sha512-2qbxE7ek3YxPJ1ML6V+satHkzHpJQKWkRHmRx6mfAoW59yP8YH8BFplbegSP+u2hBd6B6KCOpvJQ3dZAP+hkpg=="
     },
     "ent": {
       "version": "2.2.0",
@@ -4784,11 +3526,6 @@
       "resolved": "https://registry.npmjs.org/enzyme/-/enzyme-2.7.0.tgz",
       "integrity": "sha1-dyR3gAVHyiUUzAryWOZHwWau6Jk=",
       "dependencies": {
-        "lodash": {
-          "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
-        },
         "uuid": {
           "version": "2.0.3",
           "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz",
@@ -4806,11 +3543,6 @@
       "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.1.tgz",
       "integrity": "sha1-+FWobOYa3E6GIcPNoh56dhLDqNw="
     },
-    "errorhandler": {
-      "version": "1.4.3",
-      "resolved": "https://registry.npmjs.org/errorhandler/-/errorhandler-1.4.3.tgz",
-      "integrity": "sha1-t7cO2PNZ6duICS8tIMD4MUIK2D8="
-    },
     "es-abstract": {
       "version": "1.8.0",
       "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.8.0.tgz",
@@ -4822,14 +3554,9 @@
       "integrity": "sha1-RTVSSKiJeQNLZ5Lhm7gfK3l13Q0="
     },
     "es5-ext": {
-      "version": "0.10.29",
-      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.29.tgz",
-      "integrity": "sha512-KXla9NXo5sdaEkGSmbFPYgjH6m75kxsthL6GDRSug/Y2OiMoYm0I9giL39j4cgmaFmAbkIFJ6gG+SGKnLSmOvA=="
-    },
-    "es6-collections": {
-      "version": "0.5.6",
-      "resolved": "https://registry.npmjs.org/es6-collections/-/es6-collections-0.5.6.tgz",
-      "integrity": "sha1-VVLoAK0SwYIM2ivUp5rn27A9iaI="
+      "version": "0.10.30",
+      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.30.tgz",
+      "integrity": "sha1-cUGhaDZpfbq/qq7uQUlc4p9SyTk="
     },
     "es6-iterator": {
       "version": "2.0.1",
@@ -4856,11 +3583,6 @@
       "resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.1.tgz",
       "integrity": "sha1-vwDvT9q2uhtG7Le2KbTH7VcVzHc="
     },
-    "es6-templates": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/es6-templates/-/es6-templates-0.2.3.tgz",
-      "integrity": "sha1-XLmsn7He1usSOTQrgdeSu7QHjuQ="
-    },
     "es6-weak-map": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/es6-weak-map/-/es6-weak-map-2.0.2.tgz",
@@ -4881,11 +3603,6 @@
       "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-1.8.1.tgz",
       "integrity": "sha1-WltTr0aTEQvrsIZ6o0MN07cKEBg=",
       "dependencies": {
-        "esprima": {
-          "version": "2.7.3",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz",
-          "integrity": "sha1-luO3DVd59q1JzQMmc9HDEnZ7pYE="
-        },
         "source-map": {
           "version": "0.2.0",
           "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.2.0.tgz",
@@ -4907,9 +3624,9 @@
       }
     },
     "esprima": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.0.tgz",
-      "integrity": "sha512-oftTcaMu/EGrEIu904mWteKIv8vMuOgGYo7EhVJJN00R/EED9DCua/xxHRdYnKtcECzVg7xOWhflvJMnqcFZjw=="
+      "version": "2.7.3",
+      "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz",
+      "integrity": "sha1-luO3DVd59q1JzQMmc9HDEnZ7pYE="
     },
     "esrecurse": {
       "version": "4.2.0",
@@ -4934,20 +3651,15 @@
       "integrity": "sha1-Cr9PHKpbyx96nYrMbepPqqBLrJs="
     },
     "etag": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/etag/-/etag-1.7.0.tgz",
-      "integrity": "sha1-A9MLX2fdbmMtKUXTDWZScxo01dg="
+      "version": "1.8.0",
+      "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.0.tgz",
+      "integrity": "sha1-b2Ma7zNtbEY2K1F2QETOIWvjwFE="
     },
     "event-emitter": {
       "version": "0.3.5",
       "resolved": "https://registry.npmjs.org/event-emitter/-/event-emitter-0.3.5.tgz",
       "integrity": "sha1-34xp7vFkeSPHFXuc6DhAYQsCzDk="
     },
-    "event-stream": {
-      "version": "3.0.20",
-      "resolved": "https://registry.npmjs.org/event-stream/-/event-stream-3.0.20.tgz",
-      "integrity": "sha1-A4u7LqnqkDhbJvvBhU0LU58qvqM="
-    },
     "eventemitter3": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-1.2.0.tgz",
@@ -4985,20 +3697,15 @@
         }
       }
     },
-    "exit-hook": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/exit-hook/-/exit-hook-1.1.1.tgz",
-      "integrity": "sha1-8FyiM7SMBdVP/wd2XfhQfpXAL/g="
-    },
     "expand-braces": {
       "version": "0.1.2",
       "resolved": "https://registry.npmjs.org/expand-braces/-/expand-braces-0.1.2.tgz",
       "integrity": "sha1-SIsdHSRRyz06axks/AMPRMWFX+o=",
       "dependencies": {
-        "array-slice": {
-          "version": "0.2.3",
-          "resolved": "https://registry.npmjs.org/array-slice/-/array-slice-0.2.3.tgz",
-          "integrity": "sha1-3Tz7gO15c6dRF82sabC5nshhhvU="
+        "array-unique": {
+          "version": "0.2.1",
+          "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
+          "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM="
         },
         "braces": {
           "version": "0.1.5",
@@ -5023,76 +3730,68 @@
       }
     },
     "expand-brackets": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
-      "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s="
+      "version": "2.1.4",
+      "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-2.1.4.tgz",
+      "integrity": "sha1-t3c14xXOMPa27/D4OwQVGiJEliI=",
+      "dependencies": {
+        "define-property": {
+          "version": "0.2.5",
+          "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
+          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY="
+        },
+        "is-descriptor": {
+          "version": "0.1.6",
+          "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
+          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
+        },
+        "kind-of": {
+          "version": "5.0.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
+          "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
+        }
+      }
     },
     "expand-range": {
       "version": "1.8.2",
       "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz",
-      "integrity": "sha1-opnv/TNf4nIeuujiV+x5ZE/IUzc="
-    },
-    "expand-tilde": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-1.2.2.tgz",
-      "integrity": "sha1-C4HrqJflo9MdHD0QL48BRB5VlEk="
-    },
-    "express": {
-      "version": "4.14.1",
-      "resolved": "https://registry.npmjs.org/express/-/express-4.14.1.tgz",
-      "integrity": "sha1-ZGwjf3ZvFIwhIK/wc4F7nk1+DTM=",
+      "integrity": "sha1-opnv/TNf4nIeuujiV+x5ZE/IUzc=",
       "dependencies": {
-        "debug": {
-          "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
+        "fill-range": {
+          "version": "2.2.3",
+          "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz",
+          "integrity": "sha1-ULd9/X5Gm8dJJHCWNpn+eoSFpyM="
         },
-        "finalhandler": {
-          "version": "0.5.1",
-          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.5.1.tgz",
-          "integrity": "sha1-LEANjUUwk1vCMlScX6OF7Afeb80="
+        "is-number": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz",
+          "integrity": "sha1-Afy7s5NGOlSPL0ZszhbezknbkI8="
         },
-        "ms": {
-          "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+        "isobject": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
+          "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk="
         },
-        "qs": {
-          "version": "6.2.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-6.2.0.tgz",
-          "integrity": "sha1-O3hIwDwt7OaalSKw+ujEEm10Xzs="
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
         }
       }
     },
-    "express-session": {
-      "version": "1.11.3",
-      "resolved": "https://registry.npmjs.org/express-session/-/express-session-1.11.3.tgz",
-      "integrity": "sha1-XMmPP1/4Ttg1+Ry/CqvQxxB0AK8=",
+    "express": {
+      "version": "4.15.4",
+      "resolved": "https://registry.npmjs.org/express/-/express-4.15.4.tgz",
+      "integrity": "sha1-Ay4iU0ic+PzgJma+yj0R7XotrtE=",
       "dependencies": {
-        "cookie": {
-          "version": "0.1.3",
-          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz",
-          "integrity": "sha1-5zSlwUF/zkctWu+Cw4HKu2TRpDU="
-        },
-        "debug": {
-          "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
-        },
-        "depd": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz",
-          "integrity": "sha1-gK7GTJ1tl+ZcwqnKqTwKpqv3Oqo="
-        },
-        "ms": {
-          "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+        "path-to-regexp": {
+          "version": "0.1.7",
+          "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
+          "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
         },
-        "uid-safe": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/uid-safe/-/uid-safe-2.0.0.tgz",
-          "integrity": "sha1-p/PGymSh9qXQTsDvPkw9U2cxcTc="
+        "qs": {
+          "version": "6.5.0",
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.5.0.tgz",
+          "integrity": "sha512-fjVFjW9yhqMhVGwRExCXLhJKrLlkYSaxNWdyc9rmHlrVZbk35YHH312dFd7191uQeXkI3mKLZTIbSvIeFwFemg=="
         }
       }
     },
@@ -5107,9 +3806,38 @@
       "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8="
     },
     "extglob": {
-      "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
-      "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/extglob/-/extglob-1.1.0.tgz",
+      "integrity": "sha1-Bni04s5FwOTlD15er7Gw2rW05CQ=",
+      "dependencies": {
+        "define-property": {
+          "version": "0.2.5",
+          "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
+          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY="
+        },
+        "is-descriptor": {
+          "version": "0.1.6",
+          "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
+          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
+        },
+        "kind-of": {
+          "version": "5.0.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
+          "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
+        },
+        "to-regex": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/to-regex/-/to-regex-2.1.0.tgz",
+          "integrity": "sha1-4606QM/hGVWaBa6kPkyu+sxekB0=",
+          "dependencies": {
+            "regex-not": {
+              "version": "0.1.2",
+              "resolved": "https://registry.npmjs.org/regex-not/-/regex-not-0.1.2.tgz",
+              "integrity": "sha1-vH8cSUSxGINT0H3uuRK5TgreJds="
+            }
+          }
+        }
+      }
     },
     "extract-zip": {
       "version": "1.6.5",
@@ -5121,11 +3849,6 @@
           "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
           "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
-        "minimist": {
-          "version": "0.0.8",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
-          "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0="
-        },
         "mkdirp": {
           "version": "0.5.0",
           "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.0.tgz",
@@ -5143,18 +3866,6 @@
       "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.3.0.tgz",
       "integrity": "sha1-lpGEQOMEGnpBT4xS48V06zw+HgU="
     },
-    "fancy-log": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/fancy-log/-/fancy-log-1.3.0.tgz",
-      "integrity": "sha1-Rb4X0Cu5kX1gzP/UmVyZnmyMmUg=",
-      "dependencies": {
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
-        }
-      }
-    },
     "fast-deep-equal": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-1.0.0.tgz",
@@ -5192,16 +3903,6 @@
       "resolved": "https://registry.npmjs.org/fd-slicer/-/fd-slicer-1.0.1.tgz",
       "integrity": "sha1-i1vL2ewyfFBBv5qwI/1nUPEXfmU="
     },
-    "figures": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz",
-      "integrity": "sha1-y+Hjr/zxzUS4DK3+0o3Hk6lwHS4="
-    },
-    "file-loader": {
-      "version": "0.8.5",
-      "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.8.5.tgz",
-      "integrity": "sha1-knXQMf54DyfUf19K8CvUNxPMFRs="
-    },
     "filename-regex": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz",
@@ -5213,26 +3914,14 @@
       "integrity": "sha1-/I+iPdtO+eXgq24eZPZ5okpWdh8="
     },
     "fill-range": {
-      "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz",
-      "integrity": "sha1-ULd9/X5Gm8dJJHCWNpn+eoSFpyM="
-    },
-    "filled-array": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/filled-array/-/filled-array-1.1.0.tgz",
-      "integrity": "sha1-w8T2xmO5I0WamqKZEtLQMfFQf4Q="
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-4.0.0.tgz",
+      "integrity": "sha1-1USBHUKPmOsGpj3EAtJAPDKMOPc="
     },
     "finalhandler": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.4.tgz",
-      "integrity": "sha512-16l/r8RgzlXKmFOhZpHBztvye+lAhC5SU7hXavnerC9UfZqZxxXl3BzL8MhffPT3kF61lj9Oav2LKEzh0ei7tg==",
-      "dependencies": {
-        "debug": {
-          "version": "2.6.8",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
-          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
-        }
-      }
+      "integrity": "sha512-16l/r8RgzlXKmFOhZpHBztvye+lAhC5SU7hXavnerC9UfZqZxxXl3BzL8MhffPT3kF61lj9Oav2LKEzh0ei7tg=="
     },
     "find-index": {
       "version": "0.1.1",
@@ -5244,33 +3933,6 @@
       "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
       "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8="
     },
-    "findup-sync": {
-      "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-0.4.3.tgz",
-      "integrity": "sha1-QAQ5Kee8YK3wt/SCfExudaDeyhI="
-    },
-    "fined": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/fined/-/fined-1.1.0.tgz",
-      "integrity": "sha1-s33IRLdqL15wgeiE98CuNE8VNHY=",
-      "dependencies": {
-        "expand-tilde": {
-          "version": "2.0.2",
-          "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-2.0.2.tgz",
-          "integrity": "sha1-l+gBqgUt8CRU3kawK/YhZCzchQI="
-        }
-      }
-    },
-    "first-chunk-stream": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/first-chunk-stream/-/first-chunk-stream-1.0.0.tgz",
-      "integrity": "sha1-Wb+1DNkF9g18OUzT2ayqtOatk04="
-    },
-    "flagged-respawn": {
-      "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/flagged-respawn/-/flagged-respawn-0.3.2.tgz",
-      "integrity": "sha1-/xke3c1wiKZ1smEP/8l2vpuAdLU="
-    },
     "flatten": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz",
@@ -5301,45 +3963,35 @@
       "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
       "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE="
     },
-    "fork-stream": {
-      "version": "0.0.4",
-      "resolved": "https://registry.npmjs.org/fork-stream/-/fork-stream-0.0.4.tgz",
-      "integrity": "sha1-24Sfznf2cIpfjzhq5TOgkHtUrnA="
-    },
     "form-data": {
       "version": "2.1.4",
       "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
       "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE="
     },
     "formatio": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.1.1.tgz",
-      "integrity": "sha1-XtPM1jZVEJc4NGXZlhmRAOhhYek="
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.2.0.tgz",
+      "integrity": "sha1-87IWfZBoxGmKjVH092CjmlTYGOs="
     },
     "forwarded": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.0.tgz",
       "integrity": "sha1-Ge+YdMSuHCl7zweP3mOgm2aoQ2M="
     },
-    "fresh": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.3.0.tgz",
-      "integrity": "sha1-ZR+DjiJCTnVm3hYdg1jKoZn4PU8="
-    },
-    "from": {
-      "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/from/-/from-0.1.7.tgz",
-      "integrity": "sha1-g8YK/Fi5xWmXAH7Rp2izqzA6RP4="
+    "fragment-cache": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/fragment-cache/-/fragment-cache-0.2.1.tgz",
+      "integrity": "sha1-QpD60n8T6Jvn8zeZxrxaCr//DRk="
     },
-    "fs-exists-sync": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/fs-exists-sync/-/fs-exists-sync-0.1.0.tgz",
-      "integrity": "sha1-mC1ok6+RjnLQjeyehnP/K1qNat0="
+    "fresh": {
+      "version": "0.5.0",
+      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.0.tgz",
+      "integrity": "sha1-9HTKXmqSRtb9jglTz6m5yAWvp44="
     },
     "fs-extra": {
-      "version": "0.26.7",
-      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz",
-      "integrity": "sha1-muH92UiXeY7at20JGM9C0MMYT6k="
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-1.0.0.tgz",
+      "integrity": "sha1-zTzl9+fLYUWIP8rjGR6Yd/hYeVA="
     },
     "fs.realpath": {
       "version": "1.0.0",
@@ -5351,15 +4003,10 @@
       "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
       "integrity": "sha1-XB+x8RdHcRTwYyoOtLcbPLD9MXE="
     },
-    "ftp": {
-      "version": "0.3.10",
-      "resolved": "https://registry.npmjs.org/ftp/-/ftp-0.3.10.tgz",
-      "integrity": "sha1-kZfYYa2BQvPmPVqDv+TFn3MwiF0="
-    },
     "function-bind": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.0.tgz",
-      "integrity": "sha1-FhdnFMgBeY5Ojyz391KUZ7tKV3E="
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
+      "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A=="
     },
     "function.prototype.name": {
       "version": "1.0.3",
@@ -5372,1004 +4019,123 @@
       "integrity": "sha1-LANAXHU4w51+s3sxcCLjJfsBi/c="
     },
     "gaze": {
-      "version": "0.5.2",
-      "resolved": "https://registry.npmjs.org/gaze/-/gaze-0.5.2.tgz",
-      "integrity": "sha1-QLcJU30k0dRXZ9takIaJ3+aaxE8="
-    },
-    "generate-function": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/generate-function/-/generate-function-2.0.0.tgz",
-      "integrity": "sha1-aFj+fAlpt9TpCTM3ZHrHn2DfvnQ="
-    },
-    "generate-object-property": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/generate-object-property/-/generate-object-property-1.2.0.tgz",
-      "integrity": "sha1-nA4cQDCM6AT0eDYYuTf6iPmdUNA="
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz",
+      "integrity": "sha1-hHIkZ3rbiHDWeSV+0ziP22HkAQU="
     },
     "generic-names": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/generic-names/-/generic-names-1.0.2.tgz",
-      "integrity": "sha1-4lt/7OtbWo8o9flyp8z+V+Virc0="
+      "integrity": "sha1-4lt/7OtbWo8o9flyp8z+V+Virc0=",
+      "dependencies": {
+        "loader-utils": {
+          "version": "0.2.17",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz",
+          "integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g="
+        }
+      }
     },
     "get-caller-file": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz",
       "integrity": "sha1-9wLmMSfn4jHBYKgMFVSstw1QR+U="
     },
+    "get-func-name": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/get-func-name/-/get-func-name-2.0.0.tgz",
+      "integrity": "sha1-6td0q+5y4gQJQzoGY2YCPdaIekE="
+    },
     "get-stdin": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz",
-      "integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4="
-    },
-    "get-stream": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz",
-      "integrity": "sha1-jpQ9E1jcN1VQVOy+LtsFqhdO3hQ="
-    },
-    "getpass": {
-      "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
-      "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo=",
-      "dependencies": {
-        "assert-plus": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
-        }
-      }
-    },
-    "git-rev": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/git-rev/-/git-rev-0.2.1.tgz",
-      "integrity": "sha1-jMvSCSs0W8LJFJVIOW31SWRspj8="
-    },
-    "github": {
-      "version": "7.3.2",
-      "resolved": "https://registry.npmjs.org/github/-/github-7.3.2.tgz",
-      "integrity": "sha1-/hDN5pZDUsXZHhGnYW0m1f+2+Hs="
-    },
-    "glamor": {
-      "version": "2.20.40",
-      "resolved": "https://registry.npmjs.org/glamor/-/glamor-2.20.40.tgz",
-      "integrity": "sha512-DNXCd+c14N9QF8aAKrfl4xakPk5FdcFwmH7sD0qnC0Pr7xoZ5W9yovhUrY/dJc3psfGGXC58vqQyRtuskyUJxA=="
-    },
-    "glob": {
-      "version": "7.1.2",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
-      "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ=="
-    },
-    "glob-base": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz",
-      "integrity": "sha1-27Fk9iIbHAscz4Kuoyi0l98Oo8Q="
-    },
-    "glob-escape": {
-      "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/glob-escape/-/glob-escape-0.0.2.tgz",
-      "integrity": "sha1-nCf3gh7RwTd1gvPv2VWOP2dWKO0="
-    },
-    "glob-parent": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz",
-      "integrity": "sha1-gTg9ctsFT8zPUzbaqQLxgvbtuyg="
-    },
-    "glob-stream": {
-      "version": "3.1.18",
-      "resolved": "https://registry.npmjs.org/glob-stream/-/glob-stream-3.1.18.tgz",
-      "integrity": "sha1-kXCl8St5Awb9/lmPMT+PeVT9FDs=",
-      "dependencies": {
-        "glob": {
-          "version": "4.5.3",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-4.5.3.tgz",
-          "integrity": "sha1-xstz0yJsHv7wTePFbQEvAzd+4V8="
-        },
-        "minimatch": {
-          "version": "2.0.10",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-2.0.10.tgz",
-          "integrity": "sha1-jQh8OcazjAAbl/ynzm0OHoCvusc="
-        },
-        "readable-stream": {
-          "version": "1.0.34",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
-          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
-        },
-        "through2": {
-          "version": "0.6.5",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
-          "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg="
-        }
-      }
-    },
-    "glob-watcher": {
-      "version": "0.0.6",
-      "resolved": "https://registry.npmjs.org/glob-watcher/-/glob-watcher-0.0.6.tgz",
-      "integrity": "sha1-uVtKjfdLOcgymLDAXJeLTZo7cQs="
-    },
-    "glob2base": {
-      "version": "0.0.12",
-      "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz",
-      "integrity": "sha1-nUGbPijxLoOjYhZKJ3BVkiycDVY="
-    },
-    "global-modules": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-0.2.3.tgz",
-      "integrity": "sha1-6lo77ULG1s6ZWk+KEmm12uIjgo0="
-    },
-    "global-prefix": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-0.1.5.tgz",
-      "integrity": "sha1-jTvGuNo8qBEqFg2NSW/wRiv+948="
-    },
-    "globby": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/globby/-/globby-5.0.0.tgz",
-      "integrity": "sha1-69hGZ8oNuzMLmbz8aOrCvFQ3Dg0="
-    },
-    "globule": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/globule/-/globule-0.1.0.tgz",
-      "integrity": "sha1-2cjt3h2nnRJaFRt5UzuXhnY0auU=",
-      "dependencies": {
-        "glob": {
-          "version": "3.1.21",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-3.1.21.tgz",
-          "integrity": "sha1-0p4KBV3qUTj00H7UDomC6DwgZs0="
-        },
-        "graceful-fs": {
-          "version": "1.2.3",
-          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-1.2.3.tgz",
-          "integrity": "sha1-FaSAaldUfLLS2/J/QuiajDRRs2Q="
-        },
-        "inherits": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/inherits/-/inherits-1.0.2.tgz",
-          "integrity": "sha1-ykMJ2t7mtUzAuNJH6NfHoJdb3Js="
-        },
-        "lodash": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-1.0.2.tgz",
-          "integrity": "sha1-j1dWDIO1n8JwvT1WG2kAQ0MOJVE="
-        },
-        "minimatch": {
-          "version": "0.2.14",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.2.14.tgz",
-          "integrity": "sha1-x054BXT2PG+aCQ6Q775u9TpqdWo="
-        }
-      }
-    },
-    "glogg": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/glogg/-/glogg-1.0.0.tgz",
-      "integrity": "sha1-f+DxmfV6yQbPUS/urY+Q7kooT8U="
-    },
-    "got": {
-      "version": "6.7.1",
-      "resolved": "https://registry.npmjs.org/got/-/got-6.7.1.tgz",
-      "integrity": "sha1-JAzQV4WpoY5WHcG0S0HHY+8ejbA="
-    },
-    "graceful-fs": {
-      "version": "4.1.11",
-      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz",
-      "integrity": "sha1-Dovf5NHduIVNZOBOp8AOKgJuVlg="
-    },
-    "graceful-readlink": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz",
-      "integrity": "sha1-TK+tdrxi8C+gObL5Tpo906ORpyU="
-    },
-    "growl": {
-      "version": "1.9.2",
-      "resolved": "https://registry.npmjs.org/growl/-/growl-1.9.2.tgz",
-      "integrity": "sha1-Dqd0NxXbjY3ixe3hd14bRayFwC8="
-    },
-    "growly": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz",
-      "integrity": "sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE="
-    },
-    "gulp": {
-      "version": "3.9.1",
-      "resolved": "https://registry.npmjs.org/gulp/-/gulp-3.9.1.tgz",
-      "integrity": "sha1-VxzkWSjdQK9lFPxAEYZgFsE4RbQ=",
-      "dependencies": {
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
-        },
-        "semver": {
-          "version": "4.3.6",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz",
-          "integrity": "sha1-MAvG4OhjdPe6YQaLWx7NV/xlMto="
-        }
-      }
-    },
-    "gulp-cache": {
-      "version": "0.4.6",
-      "resolved": "https://registry.npmjs.org/gulp-cache/-/gulp-cache-0.4.6.tgz",
-      "integrity": "sha1-LQO1LbT2pVOuHVvvAeSD6Qfp95Y=",
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        },
-        "vinyl": {
-          "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz",
-          "integrity": "sha1-XIgDbPVl5d8FVYv8kR+GVt8hiIQ="
-        }
-      }
-    },
-    "gulp-changed": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/gulp-changed/-/gulp-changed-1.3.2.tgz",
-      "integrity": "sha1-nvyNMl+YBcx2aP3059YNSxQQ8s8="
-    },
-    "gulp-clean-css": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/gulp-clean-css/-/gulp-clean-css-3.0.4.tgz",
-      "integrity": "sha1-DFrY0EVAfIjzwrnwNXCWOWfc/VQ="
-    },
-    "gulp-clip-empty-files": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/gulp-clip-empty-files/-/gulp-clip-empty-files-0.1.2.tgz",
-      "integrity": "sha1-vumATiU7vaVc+8Em6NuuZDPtzMg="
-    },
-    "gulp-clone": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/gulp-clone/-/gulp-clone-1.0.0.tgz",
-      "integrity": "sha1-mubGVr2cTzae6AXu9WV4a8gQBbA=",
-      "dependencies": {
-        "ansi-regex": {
-          "version": "0.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-0.2.1.tgz",
-          "integrity": "sha1-DY6UaWej2BQ/k+JOKYUl/BsiNfk="
-        },
-        "ansi-styles": {
-          "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-1.1.0.tgz",
-          "integrity": "sha1-6uy/Zs1waIJ2Cy9GkVgrj1XXp94="
-        },
-        "chalk": {
-          "version": "0.5.1",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-0.5.1.tgz",
-          "integrity": "sha1-Zjs6ZItotV0EaQ1JFnqoN4WPIXQ="
-        },
-        "dateformat": {
-          "version": "1.0.12",
-          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
-          "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk="
-        },
-        "gulp-util": {
-          "version": "2.2.20",
-          "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-2.2.20.tgz",
-          "integrity": "sha1-1xRuVyiRC9jwR6awseVJvCLb1kw=",
-          "dependencies": {
-            "through2": {
-              "version": "0.5.1",
-              "resolved": "https://registry.npmjs.org/through2/-/through2-0.5.1.tgz",
-              "integrity": "sha1-390BLrnHAOIyP9M084rGIqs3Lac="
-            }
-          }
-        },
-        "has-ansi": {
-          "version": "0.1.0",
-          "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-0.1.0.tgz",
-          "integrity": "sha1-hPJlqujA5qiKEtcCKJS3VoiUxi4="
-        },
-        "lodash._reinterpolate": {
-          "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-2.4.1.tgz",
-          "integrity": "sha1-TxInqlqHEfxjL1sHofRgequLMiI="
-        },
-        "lodash.escape": {
-          "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-2.4.1.tgz",
-          "integrity": "sha1-LOEsXghNsKV92l5dHu659dF1o7Q="
-        },
-        "lodash.keys": {
-          "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz",
-          "integrity": "sha1-SN6kbfj/djKxDXBrissmWR4rNyc="
-        },
-        "lodash.template": {
-          "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-2.4.1.tgz",
-          "integrity": "sha1-nmEQB+32KRKal0qzxIuBez4c8g0="
-        },
-        "lodash.templatesettings": {
-          "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-2.4.1.tgz",
-          "integrity": "sha1-6nbHXRHrhtTb6JqDiTu4YZKaxpk="
-        },
-        "minimist": {
-          "version": "0.2.0",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.0.tgz",
-          "integrity": "sha1-Tf/lJdriuGTGbC4jxicdev3s784="
-        },
-        "readable-stream": {
-          "version": "1.0.34",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
-          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
-        },
-        "strip-ansi": {
-          "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-0.3.0.tgz",
-          "integrity": "sha1-JfSOoiynkYfzF0pNuHWTR7sSYiA="
-        },
-        "supports-color": {
-          "version": "0.2.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-0.2.0.tgz",
-          "integrity": "sha1-2S3iaU6z9nMjlz1649i1W0wiGQo="
-        },
-        "through2": {
-          "version": "0.4.2",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.4.2.tgz",
-          "integrity": "sha1-2/WGYDEVHsg1K7bE22SiKSqEC5s=",
-          "dependencies": {
-            "xtend": {
-              "version": "2.1.2",
-              "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz",
-              "integrity": "sha1-bv7MKk2tjmlixJAbM3znuoe10os="
-            }
-          }
-        },
-        "vinyl": {
-          "version": "0.2.3",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.2.3.tgz",
-          "integrity": "sha1-vKk4IJWC7FpJrVOKAPofEl5RMlI="
-        },
-        "xtend": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/xtend/-/xtend-3.0.0.tgz",
-          "integrity": "sha1-XM50B7r2Qsunvs2laBEcST9ZZlo="
-        }
-      }
-    },
-    "gulp-connect": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/gulp-connect/-/gulp-connect-5.0.0.tgz",
-      "integrity": "sha1-8v3zBq6RFGg2jCKF8teC8T7dr04=",
-      "dependencies": {
-        "body-parser": {
-          "version": "1.13.3",
-          "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.13.3.tgz",
-          "integrity": "sha1-wIzzMMM1jhUQFqBXRvE/ApyX+pc="
-        },
-        "bytes": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.1.0.tgz",
-          "integrity": "sha1-rJPEEOL/ycx89LRks4KJBn9eR7Q="
-        },
-        "connect": {
-          "version": "2.30.2",
-          "resolved": "https://registry.npmjs.org/connect/-/connect-2.30.2.tgz",
-          "integrity": "sha1-jam8vooFTT0xjXTf7JA7XDmhtgk="
-        },
-        "cookie": {
-          "version": "0.1.3",
-          "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.1.3.tgz",
-          "integrity": "sha1-5zSlwUF/zkctWu+Cw4HKu2TRpDU="
-        },
-        "debug": {
-          "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
-        },
-        "depd": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz",
-          "integrity": "sha1-gK7GTJ1tl+ZcwqnKqTwKpqv3Oqo="
-        },
-        "escape-html": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.2.tgz",
-          "integrity": "sha1-130y+pjjjC9BroXpJ44ODmuhAiw="
-        },
-        "event-stream": {
-          "version": "3.3.4",
-          "resolved": "https://registry.npmjs.org/event-stream/-/event-stream-3.3.4.tgz",
-          "integrity": "sha1-SrTJoPWlTbkzi0w02Gv86PSzVXE="
-        },
-        "finalhandler": {
-          "version": "0.4.0",
-          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.4.0.tgz",
-          "integrity": "sha1-llpS2ejQXSuFdUhUH7ibU6JJfZs="
-        },
-        "http-errors": {
-          "version": "1.3.1",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
-          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
-        },
-        "iconv-lite": {
-          "version": "0.4.11",
-          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.11.tgz",
-          "integrity": "sha1-LstC/SlHRJIiCaLnxATayHk9it4="
-        },
-        "map-stream": {
-          "version": "0.1.0",
-          "resolved": "https://registry.npmjs.org/map-stream/-/map-stream-0.1.0.tgz",
-          "integrity": "sha1-5WqpTEyAVaFkBKBnS3jyFffI4ZQ="
-        },
-        "mime": {
-          "version": "1.3.4",
-          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz",
-          "integrity": "sha1-EV+eO2s9rylZmDyzjxSaLUDrXVM="
-        },
-        "ms": {
-          "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
-        },
-        "qs": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-4.0.0.tgz",
-          "integrity": "sha1-wx2bdOwn33XlQ6hseHKO2NRiNgc="
-        },
-        "range-parser": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.0.3.tgz",
-          "integrity": "sha1-aHKCNTXGkuLCoBA4Jq/YLC4P8XU="
-        },
-        "raw-body": {
-          "version": "2.1.7",
-          "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.1.7.tgz",
-          "integrity": "sha1-rf6s4uT7MJgFgBTQjActzFl1h3Q=",
-          "dependencies": {
-            "bytes": {
-              "version": "2.4.0",
-              "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz",
-              "integrity": "sha1-fZcZb51br39pNeJZhVSe3SpsIzk="
-            },
-            "iconv-lite": {
-              "version": "0.4.13",
-              "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.13.tgz",
-              "integrity": "sha1-H4irpKsLFQjoMSrMOTRfNumS4vI="
-            }
-          }
-        },
-        "send": {
-          "version": "0.13.2",
-          "resolved": "https://registry.npmjs.org/send/-/send-0.13.2.tgz",
-          "integrity": "sha1-dl52B8gFVFK7pvCwUllTUJhgNt4=",
-          "dependencies": {
-            "depd": {
-              "version": "1.1.1",
-              "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.1.tgz",
-              "integrity": "sha1-V4O04cRZ8G+lyif5kfPQbnoxA1k="
-            },
-            "escape-html": {
-              "version": "1.0.3",
-              "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
-              "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg="
-            },
-            "statuses": {
-              "version": "1.2.1",
-              "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.2.1.tgz",
-              "integrity": "sha1-3e1FzBglbVHtQK7BQkidXGECbSg="
-            }
-          }
-        },
-        "serve-static": {
-          "version": "1.10.3",
-          "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.10.3.tgz",
-          "integrity": "sha1-zlpuzTEB/tXsCYJ9rCKpwpv7BTU=",
-          "dependencies": {
-            "escape-html": {
-              "version": "1.0.3",
-              "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
-              "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg="
-            }
-          }
-        },
-        "split": {
-          "version": "0.3.3",
-          "resolved": "https://registry.npmjs.org/split/-/split-0.3.3.tgz",
-          "integrity": "sha1-zQ7qXmOiEd//frDwkcQTPi0N0o8="
-        }
-      }
-    },
-    "gulp-decomment": {
-      "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/gulp-decomment/-/gulp-decomment-0.1.3.tgz",
-      "integrity": "sha1-q6CMjhbzh3bQhtNuMV8ZpbGjFjU="
-    },
-    "gulp-flatten": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/gulp-flatten/-/gulp-flatten-0.2.0.tgz",
-      "integrity": "sha1-iS1RfjjXkA/UVM+aHgIQMA6S6wY="
-    },
-    "gulp-if": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/gulp-if/-/gulp-if-2.0.2.tgz",
-      "integrity": "sha1-pJe351cwBQQcqivIt92jyARE1ik="
-    },
-    "gulp-karma": {
-      "version": "0.0.5",
-      "resolved": "https://registry.npmjs.org/gulp-karma/-/gulp-karma-0.0.5.tgz",
-      "integrity": "sha1-RLoZejEFTlyXOlujOUITwUKAOVg=",
-      "dependencies": {
-        "ansi-regex": {
-          "version": "0.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-0.2.1.tgz",
-          "integrity": "sha1-DY6UaWej2BQ/k+JOKYUl/BsiNfk="
-        },
-        "ansi-styles": {
-          "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-1.1.0.tgz",
-          "integrity": "sha1-6uy/Zs1waIJ2Cy9GkVgrj1XXp94="
-        },
-        "chalk": {
-          "version": "0.5.1",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-0.5.1.tgz",
-          "integrity": "sha1-Zjs6ZItotV0EaQ1JFnqoN4WPIXQ="
-        },
-        "dateformat": {
-          "version": "1.0.12",
-          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
-          "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk="
-        },
-        "gulp-util": {
-          "version": "2.2.20",
-          "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-2.2.20.tgz",
-          "integrity": "sha1-1xRuVyiRC9jwR6awseVJvCLb1kw="
-        },
-        "has-ansi": {
-          "version": "0.1.0",
-          "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-0.1.0.tgz",
-          "integrity": "sha1-hPJlqujA5qiKEtcCKJS3VoiUxi4="
-        },
-        "lodash._reinterpolate": {
-          "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-2.4.1.tgz",
-          "integrity": "sha1-TxInqlqHEfxjL1sHofRgequLMiI="
-        },
-        "lodash.escape": {
-          "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-2.4.1.tgz",
-          "integrity": "sha1-LOEsXghNsKV92l5dHu659dF1o7Q="
-        },
-        "lodash.keys": {
-          "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz",
-          "integrity": "sha1-SN6kbfj/djKxDXBrissmWR4rNyc="
-        },
-        "lodash.template": {
-          "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-2.4.1.tgz",
-          "integrity": "sha1-nmEQB+32KRKal0qzxIuBez4c8g0="
-        },
-        "lodash.templatesettings": {
-          "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-2.4.1.tgz",
-          "integrity": "sha1-6nbHXRHrhtTb6JqDiTu4YZKaxpk="
-        },
-        "minimist": {
-          "version": "0.2.0",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.2.0.tgz",
-          "integrity": "sha1-Tf/lJdriuGTGbC4jxicdev3s784="
-        },
-        "readable-stream": {
-          "version": "1.0.34",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
-          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
-        },
-        "strip-ansi": {
-          "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-0.3.0.tgz",
-          "integrity": "sha1-JfSOoiynkYfzF0pNuHWTR7sSYiA="
-        },
-        "supports-color": {
-          "version": "0.2.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-0.2.0.tgz",
-          "integrity": "sha1-2S3iaU6z9nMjlz1649i1W0wiGQo="
-        },
-        "through2": {
-          "version": "0.5.1",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.5.1.tgz",
-          "integrity": "sha1-390BLrnHAOIyP9M084rGIqs3Lac=",
-          "dependencies": {
-            "xtend": {
-              "version": "3.0.0",
-              "resolved": "https://registry.npmjs.org/xtend/-/xtend-3.0.0.tgz",
-              "integrity": "sha1-XM50B7r2Qsunvs2laBEcST9ZZlo="
-            }
-          }
-        },
-        "vinyl": {
-          "version": "0.2.3",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.2.3.tgz",
-          "integrity": "sha1-vKk4IJWC7FpJrVOKAPofEl5RMlI="
-        },
-        "xtend": {
-          "version": "2.1.2",
-          "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz",
-          "integrity": "sha1-bv7MKk2tjmlixJAbM3znuoe10os="
-        }
-      }
-    },
-    "gulp-match": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/gulp-match/-/gulp-match-1.0.3.tgz",
-      "integrity": "sha1-kcfA1/Kb7NZgbVfYCn+Hdqh6uo4="
-    },
-    "gulp-open": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/gulp-open/-/gulp-open-2.0.0.tgz",
-      "integrity": "sha1-oW9n6VzqiyBhtjo7jDibxVm44c4="
-    },
-    "gulp-phantomcss": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/gulp-phantomcss/-/gulp-phantomcss-0.3.0.tgz",
-      "integrity": "sha1-Hu0Vyz5BQw0AH5qUVg+/1Pihd1k=",
-      "dependencies": {
-        "async": {
-          "version": "2.5.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
-          "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw==",
-          "dependencies": {
-            "lodash": {
-              "version": "4.17.4",
-              "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-              "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
-            }
-          }
-        },
-        "caseless": {
-          "version": "0.11.0",
-          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz",
-          "integrity": "sha1-cVuW6phBWTzDMGeSP17GDr2k99c="
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
-        },
-        "concat-stream": {
-          "version": "1.5.0",
-          "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.5.0.tgz",
-          "integrity": "sha1-U/fUPFHF5D+ByP3QMyHGMb5o1hE="
-        },
-        "dateformat": {
-          "version": "1.0.12",
-          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
-          "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk="
-        },
-        "debug": {
-          "version": "0.7.4",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-0.7.4.tgz",
-          "integrity": "sha1-BuHqgILCyxTjmAbiLi9vdX+Srzk="
-        },
-        "extract-zip": {
-          "version": "1.5.0",
-          "resolved": "https://registry.npmjs.org/extract-zip/-/extract-zip-1.5.0.tgz",
-          "integrity": "sha1-ksz22B73Cp+kwXRxFMzvbYaIpsQ="
-        },
-        "form-data": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/form-data/-/form-data-1.0.1.tgz",
-          "integrity": "sha1-rjFduaSQf6BlUCMEpm13M0de43w="
-        },
-        "gulp-util": {
-          "version": "3.0.7",
-          "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.7.tgz",
-          "integrity": "sha1-eJJcS4+LSQBawBoBHFV+YhiUHLs="
-        },
-        "har-validator": {
-          "version": "2.0.6",
-          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz",
-          "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0="
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "lodash": {
-          "version": "3.10.1",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
-          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
-        },
-        "mkdirp": {
-          "version": "0.5.0",
-          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.0.tgz",
-          "integrity": "sha1-HXMHam35hs2TROFecfzAWkyavxI=",
-          "dependencies": {
-            "minimist": {
-              "version": "0.0.8",
-              "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
-              "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0="
-            }
-          }
-        },
-        "node-uuid": {
-          "version": "1.4.8",
-          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz",
-          "integrity": "sha1-sEDrCSOWivq/jTL7HxfxFn/auQc="
-        },
-        "object-assign": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz",
-          "integrity": "sha1-m+3VygiXlJvKR+f/QIBi1Un1h/I="
-        },
-        "phantomjs-prebuilt": {
-          "version": "2.1.7",
-          "resolved": "https://registry.npmjs.org/phantomjs-prebuilt/-/phantomjs-prebuilt-2.1.7.tgz",
-          "integrity": "sha1-yQvxuXcvoZeZQzH88/ZwmaloU8o="
-        },
-        "qs": {
-          "version": "5.2.1",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-5.2.1.tgz",
-          "integrity": "sha1-gB/uAw4LlFDWOFrcSKTMVbRK7fw="
-        },
-        "readable-stream": {
-          "version": "2.0.6",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz",
-          "integrity": "sha1-j5A0HmilPMySh4jaz80Rs265t44="
-        },
-        "request": {
-          "version": "2.67.0",
-          "resolved": "https://registry.npmjs.org/request/-/request-2.67.0.tgz",
-          "integrity": "sha1-ivdHgOK/EeoK6aqWXBHxGv0nJ0I="
-        },
-        "tough-cookie": {
-          "version": "2.2.2",
-          "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.2.2.tgz",
-          "integrity": "sha1-yDoYMPTl7wuT7yo0iOck+N4Basc="
-        },
-        "tunnel-agent": {
-          "version": "0.4.3",
-          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz",
-          "integrity": "sha1-Y3PbdpCf5XDgjXNYM2Xtgop07us="
-        },
-        "which": {
-          "version": "1.2.14",
-          "resolved": "https://registry.npmjs.org/which/-/which-1.2.14.tgz",
-          "integrity": "sha1-mofEN48D6CfOyvGs31bHNsAcFOU="
-        }
-      }
-    },
-    "gulp-plumber": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/gulp-plumber/-/gulp-plumber-1.1.0.tgz",
-      "integrity": "sha1-8SF2wtBCL2AwbCQv/2oBo5T6ugk="
-    },
-    "gulp-postcss": {
-      "version": "6.3.0",
-      "resolved": "https://registry.npmjs.org/gulp-postcss/-/gulp-postcss-6.3.0.tgz",
-      "integrity": "sha1-M+6XI+WcMC8z1wf8S3OYsQ8DK/8=",
-      "dependencies": {
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
-          "dependencies": {
-            "supports-color": {
-              "version": "2.0.0",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-            }
-          }
-        },
-        "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
-        }
-      }
+      "integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4="
     },
-    "gulp-prompt": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/gulp-prompt/-/gulp-prompt-0.2.0.tgz",
-      "integrity": "sha1-l2DJC72H6AAigzDrrHTWWcwt23g="
+    "get-stream": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz",
+      "integrity": "sha1-jpQ9E1jcN1VQVOy+LtsFqhdO3hQ="
+    },
+    "get-value": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/get-value/-/get-value-2.0.6.tgz",
+      "integrity": "sha1-3BXKHGcjh8p2vTesCjlbogQqLCg="
     },
-    "gulp-replace": {
-      "version": "0.5.4",
-      "resolved": "https://registry.npmjs.org/gulp-replace/-/gulp-replace-0.5.4.tgz",
-      "integrity": "sha1-aaZ5FLvRPFYr/xT1BKQDeWqg2qk=",
+    "getpass": {
+      "version": "0.1.7",
+      "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
+      "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo=",
       "dependencies": {
-        "isarray": {
+        "assert-plus": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
         }
       }
     },
-    "gulp-sass": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/gulp-sass/-/gulp-sass-3.1.0.tgz",
-      "integrity": "sha1-U9xLaKH13f5EJKtMJHZVJpqLdLc="
+    "github": {
+      "version": "7.3.2",
+      "resolved": "https://registry.npmjs.org/github/-/github-7.3.2.tgz",
+      "integrity": "sha1-/hDN5pZDUsXZHhGnYW0m1f+2+Hs="
     },
-    "gulp-sourcemaps": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/gulp-sourcemaps/-/gulp-sourcemaps-1.6.0.tgz",
-      "integrity": "sha1-uG/zSdgBzrVuHZ59x7vLS33uYAw=",
-      "dependencies": {
-        "strip-bom": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
-          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
-        },
-        "vinyl": {
-          "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz",
-          "integrity": "sha1-XIgDbPVl5d8FVYv8kR+GVt8hiIQ="
-        }
-      }
+    "glamor": {
+      "version": "2.20.40",
+      "resolved": "https://registry.npmjs.org/glamor/-/glamor-2.20.40.tgz",
+      "integrity": "sha512-DNXCd+c14N9QF8aAKrfl4xakPk5FdcFwmH7sD0qnC0Pr7xoZ5W9yovhUrY/dJc3psfGGXC58vqQyRtuskyUJxA=="
     },
-    "gulp-texttojs": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/gulp-texttojs/-/gulp-texttojs-1.0.3.tgz",
-      "integrity": "sha1-SIWgEDXrQfNiPEzADP21Ci+tl3Q=",
-      "dependencies": {
-        "lodash": {
-          "version": "2.4.2",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-2.4.2.tgz",
-          "integrity": "sha1-+t2DS5aDBz2hebPq5tnA0VBT9z4="
-        },
-        "readable-stream": {
-          "version": "1.0.34",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
-          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
-        },
-        "through2": {
-          "version": "0.4.2",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.4.2.tgz",
-          "integrity": "sha1-2/WGYDEVHsg1K7bE22SiKSqEC5s="
-        },
-        "xtend": {
-          "version": "2.1.2",
-          "resolved": "https://registry.npmjs.org/xtend/-/xtend-2.1.2.tgz",
-          "integrity": "sha1-bv7MKk2tjmlixJAbM3znuoe10os="
-        }
-      }
+    "glob": {
+      "version": "7.1.2",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
+      "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ=="
     },
-    "gulp-typescript": {
-      "version": "3.1.7",
-      "resolved": "https://registry.npmjs.org/gulp-typescript/-/gulp-typescript-3.1.7.tgz",
-      "integrity": "sha1-2IYAqRQVPxHAnJpcqMJWHsdaSXg=",
-      "dependencies": {
-        "glob": {
-          "version": "5.0.15",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
-          "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
-        },
-        "glob-parent": {
-          "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-3.1.0.tgz",
-          "integrity": "sha1-nmr2KZ2NO9K9QEMIMr0RPfkGxa4="
-        },
-        "glob-stream": {
-          "version": "5.3.5",
-          "resolved": "https://registry.npmjs.org/glob-stream/-/glob-stream-5.3.5.tgz",
-          "integrity": "sha1-pVZlqajM3EGRWofHAeMtTgFvrSI=",
-          "dependencies": {
-            "isarray": {
-              "version": "0.0.1",
-              "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
-              "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
-            },
-            "readable-stream": {
-              "version": "1.0.34",
-              "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
-              "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
-            },
-            "string_decoder": {
-              "version": "0.10.31",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
-              "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
-            },
-            "through2": {
-              "version": "0.6.5",
-              "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
-              "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg="
-            }
-          }
-        },
-        "is-extglob": {
-          "version": "2.1.1",
-          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
-          "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI="
-        },
-        "is-glob": {
-          "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz",
-          "integrity": "sha1-e6WuJCF4BKxwcHuWkiVnSGzD6Eo="
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "ordered-read-streams": {
-          "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.3.0.tgz",
-          "integrity": "sha1-cTfmmzKYuzQiR6G77jiByA4v14s="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        },
-        "strip-bom": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
-          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
-        },
-        "unique-stream": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-2.2.1.tgz",
-          "integrity": "sha1-WqADz76Uxf+GbE59ZouxxNuts2k="
-        },
-        "vinyl": {
-          "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz",
-          "integrity": "sha1-XIgDbPVl5d8FVYv8kR+GVt8hiIQ="
-        },
-        "vinyl-fs": {
-          "version": "2.4.4",
-          "resolved": "https://registry.npmjs.org/vinyl-fs/-/vinyl-fs-2.4.4.tgz",
-          "integrity": "sha1-vm/zJwy1Xf19MGNkDegfJddTIjk="
-        }
-      }
+    "glob-base": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz",
+      "integrity": "sha1-27Fk9iIbHAscz4Kuoyi0l98Oo8Q="
     },
-    "gulp-util": {
-      "version": "3.0.8",
-      "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.8.tgz",
-      "integrity": "sha1-AFTh50RQLifATBh8PsxQXdVLu08=",
-      "dependencies": {
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
-        },
-        "object-assign": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz",
-          "integrity": "sha1-m+3VygiXlJvKR+f/QIBi1Un1h/I="
-        }
-      }
+    "glob-parent": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz",
+      "integrity": "sha1-gTg9ctsFT8zPUzbaqQLxgvbtuyg="
     },
-    "gulplog": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/gulplog/-/gulplog-1.0.0.tgz",
-      "integrity": "sha1-4oxNRdBey77YGDY86PnFkmIp/+U="
+    "glob2base": {
+      "version": "0.0.12",
+      "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz",
+      "integrity": "sha1-nUGbPijxLoOjYhZKJ3BVkiycDVY="
+    },
+    "globals": {
+      "version": "9.18.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-9.18.0.tgz",
+      "integrity": "sha512-S0nG3CLEQiY/ILxqtztTWH/3iRRdyBLw6KMDxnKMchrtbj2OFmehVh0WUCfW3DUrIgx/qFrJPICrq4Z4sTR9UQ=="
+    },
+    "globby": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
+      "integrity": "sha1-9abXDoOV4hyFj7BInWTfAkJNUGw="
+    },
+    "globule": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/globule/-/globule-1.2.0.tgz",
+      "integrity": "sha1-HcScaCLdnoovoAuiopUAboZkvQk="
+    },
+    "graceful-fs": {
+      "version": "4.1.11",
+      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz",
+      "integrity": "sha1-Dovf5NHduIVNZOBOp8AOKgJuVlg="
+    },
+    "graceful-readlink": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz",
+      "integrity": "sha1-TK+tdrxi8C+gObL5Tpo906ORpyU="
+    },
+    "growl": {
+      "version": "1.9.2",
+      "resolved": "https://registry.npmjs.org/growl/-/growl-1.9.2.tgz",
+      "integrity": "sha1-Dqd0NxXbjY3ixe3hd14bRayFwC8="
     },
-    "gutil": {
-      "version": "1.6.4",
-      "resolved": "https://registry.npmjs.org/gutil/-/gutil-1.6.4.tgz",
-      "integrity": "sha1-d8+fqgWMBHbWO506xfvgTgcvbNI="
+    "growly": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz",
+      "integrity": "sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE="
     },
     "gzip-size": {
       "version": "3.0.0",
@@ -6401,7 +4167,14 @@
     "har-validator": {
       "version": "4.2.1",
       "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz",
-      "integrity": "sha1-M0gdDxu/9gDdID11gSpqX7oALio="
+      "integrity": "sha1-M0gdDxu/9gDdID11gSpqX7oALio=",
+      "dependencies": {
+        "ajv": {
+          "version": "4.11.8",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz",
+          "integrity": "sha1-gv+wKynmYq5TvcIK8VlHcGc5xTY="
+        }
+      }
     },
     "has": {
       "version": "1.0.1",
@@ -6416,7 +4189,14 @@
     "has-binary": {
       "version": "0.1.7",
       "resolved": "https://registry.npmjs.org/has-binary/-/has-binary-0.1.7.tgz",
-      "integrity": "sha1-aOYesWIQyVRaClzOBqhzkS/h5ow="
+      "integrity": "sha1-aOYesWIQyVRaClzOBqhzkS/h5ow=",
+      "dependencies": {
+        "isarray": {
+          "version": "0.0.1",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
+        }
+      }
     },
     "has-cors": {
       "version": "1.1.0",
@@ -6424,20 +4204,32 @@
       "integrity": "sha1-XkdHk/fqmEPRu5nCPu9J/xJv/zk="
     },
     "has-flag": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
-      "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
-    },
-    "has-gulplog": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/has-gulplog/-/has-gulplog-0.1.0.tgz",
-      "integrity": "sha1-ZBTIKRNpfaUVkDl9r7EvIpZ4Ec4="
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
+      "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
     },
     "has-unicode": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz",
       "integrity": "sha1-4Ob+aijPUROIVeCG0Wkedx3iqLk="
     },
+    "has-value": {
+      "version": "0.3.1",
+      "resolved": "https://registry.npmjs.org/has-value/-/has-value-0.3.1.tgz",
+      "integrity": "sha1-ex9YutpiyoJ+wKIHgCVlSEWZXh8=",
+      "dependencies": {
+        "isobject": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
+          "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk="
+        }
+      }
+    },
+    "has-values": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/has-values/-/has-values-0.1.4.tgz",
+      "integrity": "sha1-bWHeldkd/Km5oCCJrThL/49it3E="
+    },
     "hash-base": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/hash-base/-/hash-base-2.0.2.tgz",
@@ -6458,11 +4250,6 @@
       "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz",
       "integrity": "sha1-B4REvXwWQLD+VA0sm3PVlnjo4cQ="
     },
-    "he": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/he/-/he-1.1.1.tgz",
-      "integrity": "sha1-k0EP0hsAlzUVH4howvJx80J+I/0="
-    },
     "highlight.js": {
       "version": "9.12.0",
       "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-9.12.0.tgz",
@@ -6478,11 +4265,6 @@
       "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz",
       "integrity": "sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0="
     },
-    "homedir-polyfill": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.1.tgz",
-      "integrity": "sha1-TCu8inWJmP7r9e1oWA921GdotLw="
-    },
     "hosted-git-info": {
       "version": "2.5.0",
       "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.5.0.tgz",
@@ -6491,24 +4273,7 @@
     "hpack.js": {
       "version": "2.1.6",
       "resolved": "https://registry.npmjs.org/hpack.js/-/hpack.js-2.1.6.tgz",
-      "integrity": "sha1-h3dMCUnlE/QuhFdbPEVoH63ioLI=",
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        }
-      }
+      "integrity": "sha1-h3dMCUnlE/QuhFdbPEVoH63ioLI="
     },
     "html-comment-regex": {
       "version": "1.1.1",
@@ -6520,56 +4285,10 @@
       "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-1.2.1.tgz",
       "integrity": "sha1-DfKTUfByEWNRXfueVUPl9u7VFi8="
     },
-    "html-loader": {
-      "version": "0.4.5",
-      "resolved": "https://registry.npmjs.org/html-loader/-/html-loader-0.4.5.tgz",
-      "integrity": "sha1-X7zYfNY6XEmn/OL+VvQl4Fcpxow=",
-      "dependencies": {
-        "loader-utils": {
-          "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
-          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
-        }
-      }
-    },
-    "html-minifier": {
-      "version": "3.5.3",
-      "resolved": "https://registry.npmjs.org/html-minifier/-/html-minifier-3.5.3.tgz",
-      "integrity": "sha512-iKRzQQDuTCsq0Ultbi/mfJJnR0D3AdZKTq966Gsp92xkmAPCV4Xi08qhJ0Dl3ZAWemSgJ7qZK+UsZc0gFqK6wg==",
-      "dependencies": {
-        "uglify-js": {
-          "version": "3.0.28",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.0.28.tgz",
-          "integrity": "sha512-0h/qGay016GG2lVav3Kz174F3T2Vjlz2v6HCt+WDQpoXfco0hWwF5gHK9yh88mUYvIC+N7Z8NT8WpjSp1yoqGA=="
-        }
-      }
-    },
     "htmlparser2": {
       "version": "3.9.2",
       "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.9.2.tgz",
-      "integrity": "sha1-G9+HrMoPP55T+k/M6w9LTLsAszg=",
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        }
-      }
-    },
-    "http-browserify": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/http-browserify/-/http-browserify-1.7.0.tgz",
-      "integrity": "sha1-M3la3nLfiKz7/TZ3PO/tp2RzWyA="
+      "integrity": "sha1-G9+HrMoPP55T+k/M6w9LTLsAszg="
     },
     "http-deceiver": {
       "version": "1.2.7",
@@ -6591,20 +4310,64 @@
       "resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-0.17.4.tgz",
       "integrity": "sha1-ZC6ISIUdZvCdTxJJEoRtuutBuDM=",
       "dependencies": {
-        "is-extglob": {
-          "version": "2.1.1",
-          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
-          "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI="
+        "arr-diff": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
+          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8="
+        },
+        "array-unique": {
+          "version": "0.2.1",
+          "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
+          "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM="
+        },
+        "braces": {
+          "version": "1.8.5",
+          "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
+          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
+        },
+        "expand-brackets": {
+          "version": "0.1.5",
+          "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
+          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s="
+        },
+        "extglob": {
+          "version": "0.3.2",
+          "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
+          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE=",
+          "dependencies": {
+            "is-extglob": {
+              "version": "1.0.0",
+              "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
+              "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
+            }
+          }
         },
         "is-glob": {
           "version": "3.1.0",
           "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz",
           "integrity": "sha1-e6WuJCF4BKxwcHuWkiVnSGzD6Eo="
         },
-        "lodash": {
-          "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+        },
+        "micromatch": {
+          "version": "2.3.11",
+          "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
+          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU=",
+          "dependencies": {
+            "is-extglob": {
+              "version": "1.0.0",
+              "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
+              "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
+            },
+            "is-glob": {
+              "version": "2.0.1",
+              "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz",
+              "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM="
+            }
+          }
         }
       }
     },
@@ -6614,9 +4377,9 @@
       "integrity": "sha1-33LiZwZs0Kxn+3at+OE0qPvPkb8="
     },
     "https-browserify": {
-      "version": "0.0.0",
-      "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.0.tgz",
-      "integrity": "sha1-s//f5zSyo9Sp79WOhlTJH86G6v0="
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz",
+      "integrity": "sha1-P5E2XKvmC3ftDruiS0VOPgnZWoI="
     },
     "https-proxy-agent": {
       "version": "1.0.0",
@@ -6653,16 +4416,6 @@
       "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.3.1.tgz",
       "integrity": "sha1-jM/OkhVyCMEgsq+tftBcERFMCG4="
     },
-    "import-lazy": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/import-lazy/-/import-lazy-2.1.0.tgz",
-      "integrity": "sha1-BWmOPUXIjo1+nZLLBYTnfwlvPkM="
-    },
-    "imurmurhash": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz",
-      "integrity": "sha1-khi5srkoojixPcT7a21XbyMUU+o="
-    },
     "in-publish": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/in-publish/-/in-publish-2.0.0.tgz",
@@ -6693,37 +4446,10 @@
       "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
       "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4="
     },
-    "ini": {
-      "version": "1.3.4",
-      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.4.tgz",
-      "integrity": "sha1-BTfLedr1m1mhpRff9wbIbsA5Fi4="
-    },
-    "inline-style-prefixer": {
-      "version": "3.0.7",
-      "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-3.0.7.tgz",
-      "integrity": "sha1-DMyS5ZAv5uDSjZdcQlhEP4gGFfg="
-    },
-    "inpath": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/inpath/-/inpath-1.0.2.tgz",
-      "integrity": "sha1-SsIZcQ7Hpy9GD/lL9CTdPvDlKBc="
-    },
-    "inquirer": {
-      "version": "0.10.1",
-      "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-0.10.1.tgz",
-      "integrity": "sha1-6iXkzmnKFF4FyZ5G3P7AXkASWUo=",
-      "dependencies": {
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
-        },
-        "lodash": {
-          "version": "3.10.1",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
-          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
-        }
-      }
+    "inline-style-prefixer": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-3.0.7.tgz",
+      "integrity": "sha1-DMyS5ZAv5uDSjZdcQlhEP4gGFfg="
     },
     "internal-ip": {
       "version": "1.2.0",
@@ -6755,21 +4481,23 @@
       "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.4.0.tgz",
       "integrity": "sha1-KWrKh4qCGBbluF0KKFqZvP9FgvA="
     },
-    "is": {
-      "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/is/-/is-3.2.1.tgz",
-      "integrity": "sha1-0Kwq1V63sL7JJqUmb2xmKqqD3KU="
-    },
-    "is-absolute": {
-      "version": "0.2.6",
-      "resolved": "https://registry.npmjs.org/is-absolute/-/is-absolute-0.2.6.tgz",
-      "integrity": "sha1-IN5p89uULvLYe5wto28XIjWxtes="
-    },
     "is-absolute-url": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/is-absolute-url/-/is-absolute-url-2.1.0.tgz",
       "integrity": "sha1-UFMN+4T8yap9vnhS6Do3uTufKqY="
     },
+    "is-accessor-descriptor": {
+      "version": "0.1.6",
+      "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
+      "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
+      "dependencies": {
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+        }
+      }
+    },
     "is-arrayish": {
       "version": "0.2.1",
       "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
@@ -6795,11 +4523,35 @@
       "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.1.3.tgz",
       "integrity": "sha1-hut1OSgF3cM69xySoO7fdO52BLI="
     },
+    "is-data-descriptor": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
+      "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
+      "dependencies": {
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+        }
+      }
+    },
     "is-date-object": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.1.tgz",
       "integrity": "sha1-mqIOtq7rv/d/vTPnTKAbM1gdOhY="
     },
+    "is-descriptor": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-1.0.1.tgz",
+      "integrity": "sha512-G3fFVFTqfaqu7r4YuSBHKBAuOaLz8Sy7ekklUpFEliaLMP1Y2ZjoN9jS62YWCAPQrQpMUQSitRlrzibbuCZjdA==",
+      "dependencies": {
+        "kind-of": {
+          "version": "5.0.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
+          "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
+        }
+      }
+    },
     "is-directory": {
       "version": "0.3.1",
       "resolved": "https://registry.npmjs.org/is-directory/-/is-directory-0.3.1.tgz",
@@ -6821,9 +4573,9 @@
       "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik="
     },
     "is-extglob": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
-      "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
+      "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI="
     },
     "is-finite": {
       "version": "1.0.2",
@@ -6838,27 +4590,31 @@
     "is-glob": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz",
-      "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM="
-    },
-    "is-my-json-valid": {
-      "version": "2.16.0",
-      "resolved": "https://registry.npmjs.org/is-my-json-valid/-/is-my-json-valid-2.16.0.tgz",
-      "integrity": "sha1-8Hndm/2uZe4gOKrorLyGqxCeNpM="
-    },
-    "is-npm": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-npm/-/is-npm-1.0.0.tgz",
-      "integrity": "sha1-8vtjpl5JBbQGyGBydloaTceTufQ="
+      "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM=",
+      "dependencies": {
+        "is-extglob": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
+          "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
+        }
+      }
     },
     "is-number": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz",
-      "integrity": "sha1-Afy7s5NGOlSPL0ZszhbezknbkI8="
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/is-number/-/is-number-3.0.0.tgz",
+      "integrity": "sha1-JP1iAaR4LPUFYcgQJ2r8fRLXEZU=",
+      "dependencies": {
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+        }
+      }
     },
-    "is-obj": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-1.0.1.tgz",
-      "integrity": "sha1-PkcprB9f3gJc19g6iW2rn09n2w8="
+    "is-odd": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-odd/-/is-odd-1.0.0.tgz",
+      "integrity": "sha1-O4qTLrAos3dcObsJ6RdnrM22kIg="
     },
     "is-path-cwd": {
       "version": "1.0.0",
@@ -6883,14 +4639,7 @@
     "is-plain-object": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.4.tgz",
-      "integrity": "sha512-h5PpgXkWitc38BBMYawTYMWJHFZJVnBquFE57xFpjB8pJFiF6gZ+bU+WyI/yqXiFR5mdLsgYNaPe8uao6Uv9Og==",
-      "dependencies": {
-        "isobject": {
-          "version": "3.0.1",
-          "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.1.tgz",
-          "integrity": "sha1-TkMekrEalzFjaqH5yNHMvP2reN8="
-        }
-      }
+      "integrity": "sha512-h5PpgXkWitc38BBMYawTYMWJHFZJVnBquFE57xFpjB8pJFiF6gZ+bU+WyI/yqXiFR5mdLsgYNaPe8uao6Uv9Og=="
     },
     "is-posix-bracket": {
       "version": "0.1.1",
@@ -6902,31 +4651,11 @@
       "resolved": "https://registry.npmjs.org/is-primitive/-/is-primitive-2.0.0.tgz",
       "integrity": "sha1-IHurkWOEmcB7Kt8kCkGochADRXU="
     },
-    "is-property": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/is-property/-/is-property-1.0.2.tgz",
-      "integrity": "sha1-V/4cTkhHTt1lsJkR8msc1Ald2oQ="
-    },
-    "is-redirect": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-redirect/-/is-redirect-1.0.0.tgz",
-      "integrity": "sha1-HQPd7VO9jbDzDCbk+V02/HyH3CQ="
-    },
     "is-regex": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.0.4.tgz",
       "integrity": "sha1-VRdIm1RwkbCTDglWVM7SXul+lJE="
     },
-    "is-relative": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/is-relative/-/is-relative-0.2.1.tgz",
-      "integrity": "sha1-0n9MfVFtF1+2ENuEu+7yPDvJeqU="
-    },
-    "is-retry-allowed": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/is-retry-allowed/-/is-retry-allowed-1.1.0.tgz",
-      "integrity": "sha1-EaBgVotnM5REAz0BJaYaINVk+zQ="
-    },
     "is-stream": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz",
@@ -6952,30 +4681,15 @@
       "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz",
       "integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo="
     },
-    "is-unc-path": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/is-unc-path/-/is-unc-path-0.1.2.tgz",
-      "integrity": "sha1-arBTpyVzwQJQ/0FqOBTDUXivObk="
-    },
     "is-utf8": {
       "version": "0.2.1",
       "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz",
       "integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI="
     },
-    "is-valid-glob": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/is-valid-glob/-/is-valid-glob-0.3.0.tgz",
-      "integrity": "sha1-1LVcafUYhvm2XHDWwmItN+KfSP4="
-    },
-    "is-windows": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-0.2.0.tgz",
-      "integrity": "sha1-3hqm1j6indJIc3tp8f+LgALSEIw="
-    },
     "isarray": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
-      "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+      "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
     },
     "isbinaryfile": {
       "version": "3.0.2",
@@ -6988,16 +4702,9 @@
       "integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA="
     },
     "isobject": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
-      "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk=",
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        }
-      }
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.1.tgz",
+      "integrity": "sha1-TkMekrEalzFjaqH5yNHMvP2reN8="
     },
     "isomorphic-fetch": {
       "version": "2.2.1",
@@ -7014,16 +4721,16 @@
       "resolved": "https://registry.npmjs.org/istanbul/-/istanbul-0.4.5.tgz",
       "integrity": "sha1-ZcfXPUxNqE1POsMQuRj7C4Azczs=",
       "dependencies": {
-        "esprima": {
-          "version": "2.7.3",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz",
-          "integrity": "sha1-luO3DVd59q1JzQMmc9HDEnZ7pYE="
-        },
         "glob": {
           "version": "5.0.15",
           "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
           "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "resolve": {
           "version": "1.1.7",
           "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz",
@@ -7042,37 +4749,27 @@
       }
     },
     "istanbul-instrumenter-loader": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/istanbul-instrumenter-loader/-/istanbul-instrumenter-loader-0.2.0.tgz",
-      "integrity": "sha1-ZD5OXk6PlGaGOimpd9KDqzcsAZw="
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/istanbul-instrumenter-loader/-/istanbul-instrumenter-loader-3.0.0.tgz",
+      "integrity": "sha512-alLSEFX06ApU75sm5oWcaVNaiss/bgMRiWTct3g0P0ZZTKjR+6QiCcuVOKDI1kWJgwHEnIXsv/dWm783kPpmtw=="
     },
-    "istextorbinary": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/istextorbinary/-/istextorbinary-1.0.2.tgz",
-      "integrity": "sha1-rOGTVNGpoBc+/rEITOD4ewrX3s8="
+    "istanbul-lib-coverage": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-1.1.1.tgz",
+      "integrity": "sha512-0+1vDkmzxqJIn5rcoEqapSB4DmPxE31EtI2dF2aCkV5esN9EWHxZ0dwgDClivMXJqE7zaYQxq30hj5L0nlTN5Q=="
     },
-    "jade": {
-      "version": "0.26.3",
-      "resolved": "https://registry.npmjs.org/jade/-/jade-0.26.3.tgz",
-      "integrity": "sha1-jxDXl32NefL2/4YqgbBRPMslaGw=",
+    "istanbul-lib-instrument": {
+      "version": "1.7.5",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-instrument/-/istanbul-lib-instrument-1.7.5.tgz",
+      "integrity": "sha1-rbWW+PDLi5XnOSBjUaOKWGryGx4=",
       "dependencies": {
-        "commander": {
-          "version": "0.6.1",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-0.6.1.tgz",
-          "integrity": "sha1-+mihT2qUXVTbvlDYzbMyDp47GgY="
-        },
-        "mkdirp": {
-          "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.3.0.tgz",
-          "integrity": "sha1-G79asbqCevI1dRQ0kEJkVfSB/h4="
+        "semver": {
+          "version": "5.4.1",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
+          "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg=="
         }
       }
     },
-    "jju": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/jju/-/jju-1.3.0.tgz",
-      "integrity": "sha1-2t2e8BkkvHKLA/L3l5vb1i96Kqo="
-    },
     "js-base64": {
       "version": "2.1.9",
       "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.1.9.tgz",
@@ -7084,9 +4781,9 @@
       "integrity": "sha1-mGbfOVECEw449/mWvOtlRDIJwls="
     },
     "js-yaml": {
-      "version": "3.9.1",
-      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.9.1.tgz",
-      "integrity": "sha512-CbcG379L1e+mWBnLvHWWeLs8GyV/EMw862uLI3c+GxVyDHWZcjZinwuBd3iW2pgxgIlksW/1vNJa4to+RvDOww=="
+      "version": "3.7.0",
+      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.7.0.tgz",
+      "integrity": "sha1-XJZ93YN6m/3KXy3oQlOr6KHAO4A="
     },
     "jsbn": {
       "version": "0.1.1",
@@ -7144,11 +4841,6 @@
       "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz",
       "integrity": "sha1-LHS27kHZPKUbe1qu6PUDYx0lKnM="
     },
-    "jsonpointer": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/jsonpointer/-/jsonpointer-4.0.1.tgz",
-      "integrity": "sha1-T9kss04OnbPInIYi7PUfm5eMbLk="
-    },
     "jsprim": {
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.1.tgz",
@@ -7161,21 +4853,16 @@
         }
       }
     },
-    "jszip": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/jszip/-/jszip-2.5.0.tgz",
-      "integrity": "sha1-dET9hVHd8+XacZj+oMkbyDCMwnQ="
+    "just-extend": {
+      "version": "1.1.22",
+      "resolved": "https://registry.npmjs.org/just-extend/-/just-extend-1.1.22.tgz",
+      "integrity": "sha1-MzCvdWyralQnAMZLLk5KoGLVL/8="
     },
     "karma": {
-      "version": "0.13.22",
-      "resolved": "https://registry.npmjs.org/karma/-/karma-0.13.22.tgz",
-      "integrity": "sha1-B3ULG9Bj1+fnuRvNLmNU2PKqh0Q=",
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/karma/-/karma-1.7.0.tgz",
+      "integrity": "sha1-b3oaQGRG+i4YfslTmGmPTO5HYmk=",
       "dependencies": {
-        "bluebird": {
-          "version": "2.11.0",
-          "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-2.11.0.tgz",
-          "integrity": "sha1-U0uQM8AiyVecVro7Plpcqvu2UOE="
-        },
         "lodash": {
           "version": "3.10.1",
           "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
@@ -7184,31 +4871,48 @@
       }
     },
     "karma-coverage": {
-      "version": "0.5.5",
-      "resolved": "https://registry.npmjs.org/karma-coverage/-/karma-coverage-0.5.5.tgz",
-      "integrity": "sha1-sNWLECXVnVxmICYxhvHVj11TSMU=",
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/karma-coverage/-/karma-coverage-1.1.1.tgz",
+      "integrity": "sha1-Wv+LOc9plNwi3kyENix2ABtjfPY=",
       "dependencies": {
-        "dateformat": {
-          "version": "1.0.12",
-          "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
-          "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk="
+        "lodash": {
+          "version": "3.10.1",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
+          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
         }
       }
     },
     "karma-mocha": {
-      "version": "0.2.2",
-      "resolved": "https://registry.npmjs.org/karma-mocha/-/karma-mocha-0.2.2.tgz",
-      "integrity": "sha1-OI7ZF9oV3LGW0bkVwZNO+AMZP44="
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/karma-mocha/-/karma-mocha-1.3.0.tgz",
+      "integrity": "sha1-7qrH/8DiAetjxGdEDStpx883eL8=",
+      "dependencies": {
+        "minimist": {
+          "version": "1.2.0",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
+          "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
+        }
+      }
     },
     "karma-mocha-clean-reporter": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/karma-mocha-clean-reporter/-/karma-mocha-clean-reporter-0.0.1.tgz",
       "integrity": "sha1-6G961LxefGLX8uJC3ydRzPk/Rvo=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
         }
       }
     },
@@ -7220,14 +4924,7 @@
     "karma-sinon-chai": {
       "version": "1.3.1",
       "resolved": "https://registry.npmjs.org/karma-sinon-chai/-/karma-sinon-chai-1.3.1.tgz",
-      "integrity": "sha1-RjNBlJTZ4thIeH3XYFMDGFn1t/U=",
-      "dependencies": {
-        "lolex": {
-          "version": "1.6.0",
-          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
-          "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
-        }
-      }
+      "integrity": "sha1-RjNBlJTZ4thIeH3XYFMDGFn1t/U="
     },
     "karma-webpack": {
       "version": "2.0.4",
@@ -7239,6 +4936,11 @@
           "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz",
           "integrity": "sha1-rqdNXmHB+JlhO/ZL2mbUx48v0X0="
         },
+        "loader-utils": {
+          "version": "0.2.17",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz",
+          "integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g="
+        },
         "lodash": {
           "version": "3.10.1",
           "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
@@ -7257,51 +4959,19 @@
       "integrity": "sha1-edk9LTM2PW/dKXCzNdkUGtWR15s="
     },
     "kind-of": {
-      "version": "3.2.2",
-      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-      "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-4.0.0.tgz",
+      "integrity": "sha1-IIE989cSkosgc3hpGkUGb65y3Vc="
     },
     "klaw": {
       "version": "1.3.1",
       "resolved": "https://registry.npmjs.org/klaw/-/klaw-1.3.1.tgz",
       "integrity": "sha1-QIhDO0azsbolnXh4XY6W9zugJDk="
     },
-    "latest-version": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-3.1.0.tgz",
-      "integrity": "sha1-ogU4P+oyKzO1rjsYq+4NwvNW7hU="
-    },
     "lazy-cache": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-1.0.4.tgz",
-      "integrity": "sha1-odePw6UEdMuAhF07O24dpJpEbo4="
-    },
-    "lazy-req": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/lazy-req/-/lazy-req-1.1.0.tgz",
-      "integrity": "sha1-va6+rTD42CQDnODOFJ1Nqge6H6w="
-    },
-    "lazystream": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/lazystream/-/lazystream-1.0.0.tgz",
-      "integrity": "sha1-9plf4PggOS9hOWvolGJAe7dxaOQ=",
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        }
-      }
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-2.0.2.tgz",
+      "integrity": "sha1-uRkKT5EzVGlIQIWfio9whNiCImQ="
     },
     "lcid": {
       "version": "1.0.0",
@@ -7313,37 +4983,10 @@
       "resolved": "https://registry.npmjs.org/levn/-/levn-0.3.0.tgz",
       "integrity": "sha1-OwmSTt+fCDwEkP3UwLxEIeBHZO4="
     },
-    "liftoff": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/liftoff/-/liftoff-2.3.0.tgz",
-      "integrity": "sha1-qY8v9nGD2Lp8+soQVIvX/wVQs4U="
-    },
-    "livereload-js": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/livereload-js/-/livereload-js-2.2.2.tgz",
-      "integrity": "sha1-bIclfmSKtHW8JOoldFftzB+NC8I="
-    },
     "load-json-file": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
-      "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
-      "dependencies": {
-        "strip-bom": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
-          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
-        }
-      }
-    },
-    "load-themed-styles": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/load-themed-styles/-/load-themed-styles-1.2.0.tgz",
-      "integrity": "sha1-R6uq2LC7kxBtXX8Bq4DcIL85IDw="
-    },
-    "load-themed-styles-loader": {
-      "version": "0.0.3",
-      "resolved": "https://registry.npmjs.org/load-themed-styles-loader/-/load-themed-styles-loader-0.0.3.tgz",
-      "integrity": "sha1-zmFd1QkLzjvCYcnYE6tHmHdHya8="
+      "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA="
     },
     "loader-runner": {
       "version": "2.3.0",
@@ -7351,9 +4994,9 @@
       "integrity": "sha1-9IKuqC1UPgeSFwDVpG7yb9rGuKI="
     },
     "loader-utils": {
-      "version": "0.2.17",
-      "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz",
-      "integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g="
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
+      "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
     },
     "locate-path": {
       "version": "2.0.0",
@@ -7368,9 +5011,9 @@
       }
     },
     "lodash": {
-      "version": "4.15.0",
-      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.15.0.tgz",
-      "integrity": "sha1-MWI5HY8BQKoiz49rPDTWt/Y9Oqk="
+      "version": "4.17.4",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+      "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
     },
     "lodash._arraycopy": {
       "version": "3.0.0",
@@ -7388,9 +5031,9 @@
       "integrity": "sha1-jDigmVAPIVrQnlnxci/QxSv+Ck4="
     },
     "lodash._baseclone": {
-      "version": "4.5.7",
-      "resolved": "https://registry.npmjs.org/lodash._baseclone/-/lodash._baseclone-4.5.7.tgz",
-      "integrity": "sha1-zkKt4IOE711i+nfDD2GkbmhvhDQ="
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/lodash._baseclone/-/lodash._baseclone-3.3.0.tgz",
+      "integrity": "sha1-MDUZv2OT/n5C802LYw73eU41Qrc="
     },
     "lodash._basecopy": {
       "version": "3.0.1",
@@ -7407,103 +5050,21 @@
       "resolved": "https://registry.npmjs.org/lodash._basefor/-/lodash._basefor-3.0.3.tgz",
       "integrity": "sha1-dVC06SGO8J+tJDQ7YSAhx5tMIMI="
     },
-    "lodash._basetostring": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/lodash._basetostring/-/lodash._basetostring-3.0.1.tgz",
-      "integrity": "sha1-0YYdh3+CSlL2aYMtyvPuFVZqB9U="
-    },
-    "lodash._basevalues": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._basevalues/-/lodash._basevalues-3.0.0.tgz",
-      "integrity": "sha1-W3dXYoAr3j0yl1A+JjAIIP32Ybc="
-    },
     "lodash._bindcallback": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/lodash._bindcallback/-/lodash._bindcallback-3.0.1.tgz",
       "integrity": "sha1-5THCdkTPi1epnhftlbNcdIeJOS4="
     },
-    "lodash._createcompounder": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._createcompounder/-/lodash._createcompounder-3.0.0.tgz",
-      "integrity": "sha1-XdLLVTctbnDg4jkvsjBNZjEJEHU="
-    },
-    "lodash._escapehtmlchar": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/lodash._escapehtmlchar/-/lodash._escapehtmlchar-2.4.1.tgz",
-      "integrity": "sha1-32fDu2t+jh6DGrSL+geVuSr+iZ0="
-    },
-    "lodash._escapestringchar": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/lodash._escapestringchar/-/lodash._escapestringchar-2.4.1.tgz",
-      "integrity": "sha1-7P4iYYoq3lC/7qQ5N+Ud9m8O23I="
-    },
     "lodash._getnative": {
       "version": "3.9.1",
       "resolved": "https://registry.npmjs.org/lodash._getnative/-/lodash._getnative-3.9.1.tgz",
       "integrity": "sha1-VwvH3t5G1hzc3mh9ZdPuy6o6r/U="
     },
-    "lodash._htmlescapes": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/lodash._htmlescapes/-/lodash._htmlescapes-2.4.1.tgz",
-      "integrity": "sha1-MtFL8IRLbeb4tioFG09nwii2JMs="
-    },
     "lodash._isiterateecall": {
       "version": "3.0.9",
       "resolved": "https://registry.npmjs.org/lodash._isiterateecall/-/lodash._isiterateecall-3.0.9.tgz",
       "integrity": "sha1-UgOte6Ql+uhCRg5pbbnPPmqsBXw="
     },
-    "lodash._isnative": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/lodash._isnative/-/lodash._isnative-2.4.1.tgz",
-      "integrity": "sha1-PqZAS3hKe+g2x7V1gOHN95sUgyw="
-    },
-    "lodash._objecttypes": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/lodash._objecttypes/-/lodash._objecttypes-2.4.1.tgz",
-      "integrity": "sha1-fAt/admKH3ZSn4kLDNsbTf7BHBE="
-    },
-    "lodash._reescape": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reescape/-/lodash._reescape-3.0.0.tgz",
-      "integrity": "sha1-Kx1vXf4HyKNVdT5fJ/rH8c3hYWo="
-    },
-    "lodash._reevaluate": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reevaluate/-/lodash._reevaluate-3.0.0.tgz",
-      "integrity": "sha1-WLx0xAZklTrgsSTYBpltrKQx4u0="
-    },
-    "lodash._reinterpolate": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz",
-      "integrity": "sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0="
-    },
-    "lodash._reunescapedhtml": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/lodash._reunescapedhtml/-/lodash._reunescapedhtml-2.4.1.tgz",
-      "integrity": "sha1-dHxPxAED6zu4oJduVx96JlnpO6c=",
-      "dependencies": {
-        "lodash.keys": {
-          "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz",
-          "integrity": "sha1-SN6kbfj/djKxDXBrissmWR4rNyc="
-        }
-      }
-    },
-    "lodash._root": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/lodash._root/-/lodash._root-3.0.1.tgz",
-      "integrity": "sha1-+6HEUkwZ7ppfgTa0YJ8BfPTe1pI="
-    },
-    "lodash._shimkeys": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/lodash._shimkeys/-/lodash._shimkeys-2.4.1.tgz",
-      "integrity": "sha1-bpzJZm/wgfC1psl4uD4kLmlJ0gM="
-    },
-    "lodash._stack": {
-      "version": "4.1.3",
-      "resolved": "https://registry.npmjs.org/lodash._stack/-/lodash._stack-4.1.3.tgz",
-      "integrity": "sha1-dRqnbBuWSwR+dtFPxyoJP8teLdA="
-    },
     "lodash.assign": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/lodash.assign/-/lodash.assign-4.2.0.tgz",
@@ -7520,14 +5081,9 @@
       "integrity": "sha1-euMBfpOWIqwxt9fX3LGzTbFpDTU="
     },
     "lodash.camelcase": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-3.0.1.tgz",
-      "integrity": "sha1-kyyLh/ikN3iXxnGXUzKC+Xrqwpg="
-    },
-    "lodash.clone": {
-      "version": "4.5.0",
-      "resolved": "https://registry.npmjs.org/lodash.clone/-/lodash.clone-4.5.0.tgz",
-      "integrity": "sha1-GVhwRQ9aExkkeN9Lw9I9LeoZB7Y="
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz",
+      "integrity": "sha1-soqmKIorn8ZRA1x3EfZathkDMaY="
     },
     "lodash.clonedeep": {
       "version": "4.5.0",
@@ -7539,27 +5095,10 @@
       "resolved": "https://registry.npmjs.org/lodash.create/-/lodash.create-3.1.1.tgz",
       "integrity": "sha1-1/KEnw29p+BGgruM1yqwIkYd6+c="
     },
-    "lodash.deburr": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/lodash.deburr/-/lodash.deburr-3.2.0.tgz",
-      "integrity": "sha1-baj1QzSjZqfPTEx2742Aqhs2XtU="
-    },
     "lodash.defaults": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-2.4.1.tgz",
-      "integrity": "sha1-p+iIXwXmiFEUS24SqPNngCa8TFQ=",
-      "dependencies": {
-        "lodash.keys": {
-          "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz",
-          "integrity": "sha1-SN6kbfj/djKxDXBrissmWR4rNyc="
-        }
-      }
-    },
-    "lodash.escape": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/lodash.escape/-/lodash.escape-3.2.0.tgz",
-      "integrity": "sha1-mV7g3BjBtIzJLv+ucaEKq1tIdpg="
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-4.2.0.tgz",
+      "integrity": "sha1-0JF4cW/+pN3p5ft7N/bwgCJ0WAw="
     },
     "lodash.filter": {
       "version": "4.6.0",
@@ -7576,11 +5115,6 @@
       "resolved": "https://registry.npmjs.org/lodash.foreach/-/lodash.foreach-4.5.0.tgz",
       "integrity": "sha1-Gmo16s5AEoDH8G3d7DUWWrJ+PlM="
     },
-    "lodash.get": {
-      "version": "4.4.2",
-      "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
-      "integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk="
-    },
     "lodash.isarguments": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz",
@@ -7591,55 +5125,25 @@
       "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz",
       "integrity": "sha1-eeTriMNqgSKvhvhEqpvNhRtfu1U="
     },
-    "lodash.isequal": {
-      "version": "4.5.0",
-      "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
-      "integrity": "sha1-QVxEePK8wwEgwizhDtMib30+GOA="
-    },
-    "lodash.isobject": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/lodash.isobject/-/lodash.isobject-2.4.1.tgz",
-      "integrity": "sha1-Wi5H/mmVPx7mMafrof5k0tBlWPU="
-    },
-    "lodash.isplainobject": {
-      "version": "4.0.6",
-      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
-      "integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs="
-    },
-    "lodash.isstring": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/lodash.isstring/-/lodash.isstring-4.0.1.tgz",
-      "integrity": "sha1-1SfftUVuynzJu5XV2ur4i6VKVFE="
-    },
     "lodash.keys": {
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz",
       "integrity": "sha1-TbwEcrFWvlCgsoaFXRvQsMZWCYo="
     },
-    "lodash.keysin": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/lodash.keysin/-/lodash.keysin-4.2.0.tgz",
-      "integrity": "sha1-jMP7NcLZSsxEOhhj4C+kB5nqbyg="
-    },
     "lodash.map": {
       "version": "4.6.0",
       "resolved": "https://registry.npmjs.org/lodash.map/-/lodash.map-4.6.0.tgz",
       "integrity": "sha1-dx7Hg540c9nEzeKLGTlMNWL09tM="
     },
-    "lodash.mapvalues": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/lodash.mapvalues/-/lodash.mapvalues-4.6.0.tgz",
-      "integrity": "sha1-G6+lAF3p3W9PJmaMMMo3IwzJaJw="
-    },
     "lodash.memoize": {
       "version": "4.1.2",
       "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz",
       "integrity": "sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4="
     },
     "lodash.merge": {
-      "version": "4.3.5",
-      "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.3.5.tgz",
-      "integrity": "sha1-VOWMTyCD2f7MsVeaYPdLCT1yrRc="
+      "version": "4.6.0",
+      "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.0.tgz",
+      "integrity": "sha1-aYhLoUSsM/5plzemCG3v+t0PicU="
     },
     "lodash.mergewith": {
       "version": "4.6.0",
@@ -7661,16 +5165,6 @@
       "resolved": "https://registry.npmjs.org/lodash.reject/-/lodash.reject-4.6.0.tgz",
       "integrity": "sha1-gNZJLcFHCGS79YNTO2UfQqn1JBU="
     },
-    "lodash.rest": {
-      "version": "4.0.5",
-      "resolved": "https://registry.npmjs.org/lodash.rest/-/lodash.rest-4.0.5.tgz",
-      "integrity": "sha1-lU73UEkmIDjJbR/Jiyj9r58Hcqo="
-    },
-    "lodash.restparam": {
-      "version": "3.6.1",
-      "resolved": "https://registry.npmjs.org/lodash.restparam/-/lodash.restparam-3.6.1.tgz",
-      "integrity": "sha1-k2pOMJ7zMKdkXtQUWYbIWuWyCAU="
-    },
     "lodash.some": {
       "version": "4.6.0",
       "resolved": "https://registry.npmjs.org/lodash.some/-/lodash.some-4.6.0.tgz",
@@ -7681,16 +5175,6 @@
       "resolved": "https://registry.npmjs.org/lodash.tail/-/lodash.tail-4.1.1.tgz",
       "integrity": "sha1-0jM6NtnncXyK0vfKyv7HwytERmQ="
     },
-    "lodash.template": {
-      "version": "3.6.2",
-      "resolved": "https://registry.npmjs.org/lodash.template/-/lodash.template-3.6.2.tgz",
-      "integrity": "sha1-+M3sxhaaJVvpCYrosMU9N4kx0U8="
-    },
-    "lodash.templatesettings": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-3.1.1.tgz",
-      "integrity": "sha1-+zB4RHU7Zrnxr6VOJix0UwfbqOU="
-    },
     "lodash.toarray": {
       "version": "4.4.0",
       "resolved": "https://registry.npmjs.org/lodash.toarray/-/lodash.toarray-4.4.0.tgz",
@@ -7701,32 +5185,25 @@
       "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz",
       "integrity": "sha1-0CJTc662Uq3BvILklFM5qEJ1R3M="
     },
-    "lodash.values": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/lodash.values/-/lodash.values-2.4.1.tgz",
-      "integrity": "sha1-q/UUQ2s8twUAFieXjLzzCxKA7qQ=",
-      "dependencies": {
-        "lodash.keys": {
-          "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz",
-          "integrity": "sha1-SN6kbfj/djKxDXBrissmWR4rNyc="
-        }
-      }
-    },
-    "lodash.words": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/lodash.words/-/lodash.words-3.2.0.tgz",
-      "integrity": "sha1-TiqGSbwIdFsXxpWxo86P7llmI7M="
-    },
     "log-symbols": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-1.0.2.tgz",
       "integrity": "sha1-N2/3tY6jCGoPCfrMdGF+ylAeGhg=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
         }
       }
     },
@@ -7735,6 +5212,11 @@
       "resolved": "https://registry.npmjs.org/log4js/-/log4js-0.6.38.tgz",
       "integrity": "sha1-LElBFmldb7JUgJQ9P8hy5mKlIv0=",
       "dependencies": {
+        "isarray": {
+          "version": "0.0.1",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
+        },
         "readable-stream": {
           "version": "1.0.34",
           "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
@@ -7744,6 +5226,11 @@
           "version": "4.3.6",
           "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz",
           "integrity": "sha1-MAvG4OhjdPe6YQaLWx7NV/xlMto="
+        },
+        "string_decoder": {
+          "version": "0.10.31",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
         }
       }
     },
@@ -7753,9 +5240,9 @@
       "integrity": "sha1-lbOD+Ro8J1b9SrCTZn5DCRYfK80="
     },
     "lolex": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.4.0.tgz",
-      "integrity": "sha1-LycSsbwYDendzF06epbvPAuxYq0="
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
+      "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
     },
     "longest": {
       "version": "1.0.1",
@@ -7772,31 +5259,16 @@
       "resolved": "https://registry.npmjs.org/loud-rejection/-/loud-rejection-1.6.0.tgz",
       "integrity": "sha1-W0b4AUft7leIcPCG0Eghz5mOVR8="
     },
-    "lower-case": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-1.1.4.tgz",
-      "integrity": "sha1-miyr0bno4K6ZOkv31YdcOcQujqw="
-    },
-    "lowercase-keys": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.0.tgz",
-      "integrity": "sha1-TjNms55/VFfjXxMkvfb4jQv8cwY="
-    },
     "lru-cache": {
-      "version": "2.7.3",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.7.3.tgz",
-      "integrity": "sha1-bUUk6LlV+V1PW1iFHOId1y+06VI="
+      "version": "2.2.4",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.2.4.tgz",
+      "integrity": "sha1-bGWGGb7PFAMdDQtZSxYELOTcBj0="
     },
     "macaddress": {
       "version": "0.2.8",
       "resolved": "https://registry.npmjs.org/macaddress/-/macaddress-0.2.8.tgz",
       "integrity": "sha1-WQTcU3w57G2+/q6QIycTX6hRHxI="
     },
-    "make-dir": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-1.0.0.tgz",
-      "integrity": "sha1-l6ARdR6R3YfPre9Ygy67BJNt6Xg="
-    },
     "map-cache": {
       "version": "0.2.2",
       "resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz",
@@ -7807,10 +5279,10 @@
       "resolved": "https://registry.npmjs.org/map-obj/-/map-obj-1.0.1.tgz",
       "integrity": "sha1-2TPOuSBdgr3PSIb2dCvcK03qFG0="
     },
-    "map-stream": {
-      "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/map-stream/-/map-stream-0.0.7.tgz",
-      "integrity": "sha1-ih8HiW2CsQkmvTdEokIACfiJdKg="
+    "map-visit": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/map-visit/-/map-visit-0.1.5.tgz",
+      "integrity": "sha1-2+Q5J85VJbgN/BVzpE1oxR8mgWs="
     },
     "marked": {
       "version": "0.3.6",
@@ -7822,22 +5294,27 @@
       "resolved": "https://registry.npmjs.org/marked-terminal/-/marked-terminal-1.7.0.tgz",
       "integrity": "sha1-yMRgiBx3LHYEtkNnAH7l938SWQQ=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
         }
       }
     },
     "math-expression-evaluator": {
       "version": "1.2.17",
       "resolved": "https://registry.npmjs.org/math-expression-evaluator/-/math-expression-evaluator-1.2.17.tgz",
-      "integrity": "sha1-3oGf282E3M2PrlnGrreWFbnSZqw="
-    },
-    "md5": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/md5/-/md5-2.2.1.tgz",
-      "integrity": "sha1-U6s41f48iJG6RlMp6iP6wFQBJvk="
+      "integrity": "sha1-3oGf282E3M2PrlnGrreWFbnSZqw="
     },
     "md5.js": {
       "version": "1.3.4",
@@ -7864,83 +5341,34 @@
     "memory-fs": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.4.1.tgz",
-      "integrity": "sha1-OpoguEYlI+RHz7x+i7gO1me/xVI=",
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        }
-      }
+      "integrity": "sha1-OpoguEYlI+RHz7x+i7gO1me/xVI="
     },
     "meow": {
       "version": "3.7.0",
       "resolved": "https://registry.npmjs.org/meow/-/meow-3.7.0.tgz",
-      "integrity": "sha1-cstmi0JSKCkKu/qFaJJYcwioAfs="
+      "integrity": "sha1-cstmi0JSKCkKu/qFaJJYcwioAfs=",
+      "dependencies": {
+        "minimist": {
+          "version": "1.2.0",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
+          "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
+        }
+      }
     },
     "merge-descriptors": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.1.tgz",
       "integrity": "sha1-sAqqVW3YtEVoFQ7J0blT8/kMu2E="
     },
-    "merge-stream": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-1.0.1.tgz",
-      "integrity": "sha1-QEEgLVCKNCugAXQAjfDCUbjBNeE=",
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        }
-      }
-    },
-    "merge2": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.0.3.tgz",
-      "integrity": "sha1-+kT4siYmFaty8ICKQB1HinDjlNs="
-    },
-    "method-override": {
-      "version": "2.3.9",
-      "resolved": "https://registry.npmjs.org/method-override/-/method-override-2.3.9.tgz",
-      "integrity": "sha1-vRUfLONM8Bp2ykAKuVwBKxAtj3E=",
-      "dependencies": {
-        "debug": {
-          "version": "2.6.8",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
-          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
-        }
-      }
-    },
     "methods": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz",
       "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4="
     },
     "micromatch": {
-      "version": "2.3.11",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
-      "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-3.0.4.tgz",
+      "integrity": "sha1-FUPx0EgTRHrIUgAcX1qTNAF4bR0="
     },
     "miller-rabin": {
       "version": "4.0.0",
@@ -7948,9 +5376,9 @@
       "integrity": "sha1-SmL7HUKTPAVYOYL0xxb2+55sbT0="
     },
     "mime": {
-      "version": "1.3.6",
-      "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.6.tgz",
-      "integrity": "sha1-WR2E02U6awtKO5343lqoEI5y5eA="
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/mime/-/mime-1.4.0.tgz",
+      "integrity": "sha512-n9ChLv77+QQEapYz8lV+rIZAW3HhAPW2CXnzb1GN5uMkuczshwvkW7XPsbzU0ZQN3sP47Er2KVkp2p3KyqZKSQ=="
     },
     "mime-db": {
       "version": "1.29.0",
@@ -7983,9 +5411,14 @@
       "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA=="
     },
     "minimist": {
+      "version": "0.0.8",
+      "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
+      "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0="
+    },
+    "mixin-deep": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
-      "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
+      "resolved": "https://registry.npmjs.org/mixin-deep/-/mixin-deep-1.2.0.tgz",
+      "integrity": "sha1-0CuMb4ttS49ZgtP9AJxJGYUcP+I="
     },
     "mixin-object": {
       "version": "2.0.1",
@@ -8002,59 +5435,47 @@
     "mkdirp": {
       "version": "0.5.1",
       "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
-      "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
-      "dependencies": {
-        "minimist": {
-          "version": "0.0.8",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
-          "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0="
-        }
-      }
+      "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM="
     },
     "mocha": {
-      "version": "2.5.3",
-      "resolved": "https://registry.npmjs.org/mocha/-/mocha-2.5.3.tgz",
-      "integrity": "sha1-FhvlvetJZ3HrmzV0UFC2IrWu/Fg=",
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz",
+      "integrity": "sha1-0pt0KNP1LILi5l3x7LcGThqrv7U=",
       "dependencies": {
         "commander": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/commander/-/commander-2.3.0.tgz",
-          "integrity": "sha1-/UMOiJgy7DU7ms0d4hfBHLPu+HM="
+          "version": "2.9.0",
+          "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
+          "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q="
         },
         "debug": {
-          "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
+          "version": "2.6.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz",
+          "integrity": "sha1-vFlryr52F/Edn6FTYe3tVgi4SZs="
         },
         "diff": {
-          "version": "1.4.0",
-          "resolved": "https://registry.npmjs.org/diff/-/diff-1.4.0.tgz",
-          "integrity": "sha1-fyjS657nsVqX79ic5j3P2qPMur8="
-        },
-        "escape-string-regexp": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.2.tgz",
-          "integrity": "sha1-Tbwv5nTnGUnK8/smlc5/LcHZqNE="
+          "version": "3.2.0",
+          "resolved": "https://registry.npmjs.org/diff/-/diff-3.2.0.tgz",
+          "integrity": "sha1-yc45Okt8vQsFinJck98pkCeGj/k="
         },
         "glob": {
-          "version": "3.2.11",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-3.2.11.tgz",
-          "integrity": "sha1-Spc/Y1uRkPcV0QmH1cAP0oFevj0="
+          "version": "7.1.1",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz",
+          "integrity": "sha1-gFIR3wT6rxxjo2ADBs31reULLsg="
         },
-        "minimatch": {
-          "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-0.3.0.tgz",
-          "integrity": "sha1-J12O2qxPG7MyZHIInnlJyDlGmd0="
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "ms": {
-          "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+          "version": "0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
+          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
         },
         "supports-color": {
-          "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-1.2.0.tgz",
-          "integrity": "sha1-/x7R5hFp0Gs88tWI4YixjYhH4X4="
+          "version": "3.1.2",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz",
+          "integrity": "sha1-cqJiiU2dQIuVbKBf83su2KbiotU="
         }
       }
     },
@@ -8063,84 +5484,6 @@
       "resolved": "https://registry.npmjs.org/mocha-clean/-/mocha-clean-0.4.0.tgz",
       "integrity": "sha1-CbaYXDIYFhQDIeED593ktIdgkhw="
     },
-    "mocha-loader": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/mocha-loader/-/mocha-loader-1.1.1.tgz",
-      "integrity": "sha1-Ocm3jErWmrxTPtAuLas5gkTKM6s=",
-      "dependencies": {
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
-          "dependencies": {
-            "supports-color": {
-              "version": "2.0.0",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-            }
-          }
-        },
-        "css-loader": {
-          "version": "0.23.1",
-          "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.23.1.tgz",
-          "integrity": "sha1-n6I/K1wJZSNZEK1ezvO4o2OQ/lA=",
-          "dependencies": {
-            "loader-utils": {
-              "version": "0.2.17",
-              "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz",
-              "integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g="
-            }
-          }
-        },
-        "css-selector-tokenizer": {
-          "version": "0.5.4",
-          "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.5.4.tgz",
-          "integrity": "sha1-E5uv00o1/QwUKEhwSeBpnm9qLCE="
-        },
-        "loader-utils": {
-          "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
-          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
-        },
-        "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
-        },
-        "style-loader": {
-          "version": "0.13.2",
-          "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.13.2.tgz",
-          "integrity": "sha1-dFMzhM9pjHEEx5URULSXF63C87s="
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
-        }
-      }
-    },
-    "morgan": {
-      "version": "1.6.1",
-      "resolved": "https://registry.npmjs.org/morgan/-/morgan-1.6.1.tgz",
-      "integrity": "sha1-X9gYOYxoGcuiinzWZk8pL+HAu/I=",
-      "dependencies": {
-        "debug": {
-          "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
-        },
-        "depd": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/depd/-/depd-1.0.1.tgz",
-          "integrity": "sha1-gK7GTJ1tl+ZcwqnKqTwKpqv3Oqo="
-        },
-        "ms": {
-          "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
-        }
-      }
-    },
     "ms": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
@@ -8156,41 +5499,21 @@
       "resolved": "https://registry.npmjs.org/multicast-dns-service-types/-/multicast-dns-service-types-1.1.0.tgz",
       "integrity": "sha1-iZ8R2WhuXgXLkbNdXw5jt3PPyQE="
     },
-    "multiparty": {
-      "version": "3.3.2",
-      "resolved": "https://registry.npmjs.org/multiparty/-/multiparty-3.3.2.tgz",
-      "integrity": "sha1-Nd5oBNwZZD5SSfPT473GyM4wHT8="
-    },
-    "multipipe": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/multipipe/-/multipipe-0.1.2.tgz",
-      "integrity": "sha1-Ko8t33Du1WTf8tV/HhoTfZ8FB4s="
-    },
-    "mute-stream": {
-      "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.7.tgz",
-      "integrity": "sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s="
-    },
     "nan": {
       "version": "2.6.2",
       "resolved": "https://registry.npmjs.org/nan/-/nan-2.6.2.tgz",
       "integrity": "sha1-5P805slf37WuzAjeZZb0NgWn20U="
     },
+    "nanomatch": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.0.tgz",
+      "integrity": "sha1-dv2z1K52F+N3GeekBHuECFfAyxw="
+    },
     "native-promise-only": {
       "version": "0.8.1",
       "resolved": "https://registry.npmjs.org/native-promise-only/-/native-promise-only-0.8.1.tgz",
       "integrity": "sha1-IKMYwwy0X3H+et+/eyHJnBRy7xE="
     },
-    "natives": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/natives/-/natives-1.1.0.tgz",
-      "integrity": "sha1-6f+EFBimsux6SV6TmYT3jxY+bjE="
-    },
-    "ncname": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/ncname/-/ncname-1.0.0.tgz",
-      "integrity": "sha1-W1etGLHKCShk72Kwse2BlPODtxw="
-    },
     "negotiator": {
       "version": "0.6.1",
       "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.1.tgz",
@@ -8201,10 +5524,10 @@
       "resolved": "https://registry.npmjs.org/netrc/-/netrc-0.1.4.tgz",
       "integrity": "sha1-a+lPysqNd63gqWcNxGCRTJRHJEQ="
     },
-    "no-case": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/no-case/-/no-case-2.3.1.tgz",
-      "integrity": "sha1-euuhxzpSGEJlVUt9wDuvcg34AIE="
+    "nise": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/nise/-/nise-1.0.1.tgz",
+      "integrity": "sha1-DakrEKhU6XwPSW9sKEWjASgLPu8="
     },
     "node-emoji": {
       "version": "1.8.1",
@@ -8217,67 +5540,78 @@
       "integrity": "sha512-xZZUq2yDhKMIn/UgG5q//IZSNLJIwW2QxS14CNH5spuiXkITM2pUitjdq58yLSaU7m4M0wBNaM2Gh/ggY4YJig=="
     },
     "node-forge": {
-      "version": "0.7.1",
-      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.7.1.tgz",
-      "integrity": "sha1-naYR6giYL0uUIGs760zJZl8gwwA="
+      "version": "0.6.33",
+      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.6.33.tgz",
+      "integrity": "sha1-RjgRh59XPUUVWtap9D3ClujoXrw="
     },
     "node-gyp": {
       "version": "3.6.2",
       "resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-3.6.2.tgz",
-      "integrity": "sha1-m/vlRWIoYoSDjnUOrAUpWFP6HGA="
+      "integrity": "sha1-m/vlRWIoYoSDjnUOrAUpWFP6HGA=",
+      "dependencies": {
+        "semver": {
+          "version": "5.3.0",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz",
+          "integrity": "sha1-myzl094C0XxgEq0yaqa00M9U+U8="
+        }
+      }
     },
     "node-libs-browser": {
-      "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-0.6.0.tgz",
-      "integrity": "sha1-JEgG1E0xngSLyGB7XMTq+aKdLjw="
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz",
+      "integrity": "sha1-o6WeyXAkmFtG6Vg3lkb5bEthZkY=",
+      "dependencies": {
+        "string_decoder": {
+          "version": "0.10.31",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
+        }
+      }
     },
     "node-notifier": {
-      "version": "5.0.2",
-      "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-5.0.2.tgz",
-      "integrity": "sha1-RDhEn+aeMh+UHO+UOYaweXAycBs="
+      "version": "4.6.1",
+      "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-4.6.1.tgz",
+      "integrity": "sha1-BW0UJE89zBzq3+aK+c/wxUc6M/M=",
+      "dependencies": {
+        "lodash.clonedeep": {
+          "version": "3.0.2",
+          "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-3.0.2.tgz",
+          "integrity": "sha1-oKHkDYKl6on/WxR7hETtY9koJ9s="
+        },
+        "minimist": {
+          "version": "1.2.0",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
+          "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
+        },
+        "semver": {
+          "version": "5.4.1",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
+          "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg=="
+        }
+      }
     },
     "node-sass": {
       "version": "4.5.3",
       "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.5.3.tgz",
       "integrity": "sha1-0JydEXlkEjnRuX/8YjH9zsU+FWg=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
         },
-        "gaze": {
-          "version": "1.1.2",
-          "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz",
-          "integrity": "sha1-hHIkZ3rbiHDWeSV+0ziP22HkAQU="
-        },
-        "globule": {
-          "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/globule/-/globule-1.2.0.tgz",
-          "integrity": "sha1-HcScaCLdnoovoAuiopUAboZkvQk="
-        },
-        "lodash": {
-          "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
         }
       }
     },
-    "node-status-codes": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/node-status-codes/-/node-status-codes-1.0.0.tgz",
-      "integrity": "sha1-WuVUHQJGRdMqWPzdyc7s6nrjrC8="
-    },
-    "node-zip": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/node-zip/-/node-zip-1.1.1.tgz",
-      "integrity": "sha1-lNGtZ0o81GoViN1zb0qaeMdX62I="
-    },
-    "node.extend": {
-      "version": "1.1.6",
-      "resolved": "https://registry.npmjs.org/node.extend/-/node.extend-1.1.6.tgz",
-      "integrity": "sha1-p7iCyC1sk6SGOlUEvV3o7IYli5Y="
-    },
     "nopt": {
       "version": "3.0.6",
       "resolved": "https://registry.npmjs.org/nopt/-/nopt-3.0.6.tgz",
@@ -8343,45 +5677,62 @@
       "resolved": "https://registry.npmjs.org/object-component/-/object-component-0.0.3.tgz",
       "integrity": "sha1-8MaapQ78lbhmwYb0AKM3acsvEpE="
     },
+    "object-copy": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/object-copy/-/object-copy-0.1.0.tgz",
+      "integrity": "sha1-fn2Fi3gb18mRpBupde04EnVOmYw=",
+      "dependencies": {
+        "define-property": {
+          "version": "0.2.5",
+          "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
+          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY="
+        },
+        "is-descriptor": {
+          "version": "0.1.6",
+          "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
+          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg==",
+          "dependencies": {
+            "kind-of": {
+              "version": "5.0.2",
+              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
+              "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
+            }
+          }
+        },
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+        }
+      }
+    },
     "object-is": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.0.1.tgz",
       "integrity": "sha1-CqYOyZiaCz7Xlc9NBvYs8a1lObY="
     },
     "object-keys": {
-      "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-0.4.0.tgz",
-      "integrity": "sha1-KKaq50KN0sOpLz2V8hM13SBOAzY="
-    },
-    "object.assign": {
-      "version": "4.0.4",
-      "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.0.4.tgz",
-      "integrity": "sha1-scnMBE7xuf5jYG/BQau7MuFHMMw=",
-      "dependencies": {
-        "object-keys": {
-          "version": "1.0.11",
-          "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.0.11.tgz",
-          "integrity": "sha1-xUYBd4rVYPEULODgG8yotW0TQm0="
-        }
-      }
+      "version": "1.0.11",
+      "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.0.11.tgz",
+      "integrity": "sha1-xUYBd4rVYPEULODgG8yotW0TQm0="
     },
-    "object.defaults": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/object.defaults/-/object.defaults-1.1.0.tgz",
-      "integrity": "sha1-On+GgzS0B96gbaFtiNXNKeQ1/s8=",
+    "object-visit": {
+      "version": "0.3.4",
+      "resolved": "https://registry.npmjs.org/object-visit/-/object-visit-0.3.4.tgz",
+      "integrity": "sha1-rhXPhvCy/dVRdxY2RIRSxUw9qCk=",
       "dependencies": {
-        "for-own": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/for-own/-/for-own-1.0.0.tgz",
-          "integrity": "sha1-xjMy9BXO3EsE2/5wz4NklMU8tEs="
-        },
         "isobject": {
-          "version": "3.0.1",
-          "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.1.tgz",
-          "integrity": "sha1-TkMekrEalzFjaqH5yNHMvP2reN8="
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
+          "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk="
         }
       }
     },
+    "object.assign": {
+      "version": "4.0.4",
+      "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.0.4.tgz",
+      "integrity": "sha1-scnMBE7xuf5jYG/BQau7MuFHMMw="
+    },
     "object.entries": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/object.entries/-/object.entries-1.0.4.tgz",
@@ -8395,14 +5746,7 @@
     "object.pick": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/object.pick/-/object.pick-1.3.0.tgz",
-      "integrity": "sha1-h6EKxMFpS9Lhy/U1kaZhQftd10c=",
-      "dependencies": {
-        "isobject": {
-          "version": "3.0.1",
-          "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.1.tgz",
-          "integrity": "sha1-TkMekrEalzFjaqH5yNHMvP2reN8="
-        }
-      }
+      "integrity": "sha1-h6EKxMFpS9Lhy/U1kaZhQftd10c="
     },
     "object.values": {
       "version": "1.0.4",
@@ -8420,9 +5764,9 @@
       "integrity": "sha1-JKwXdDPkou6REP5DWAutBZ+gBQk="
     },
     "office-ui-fabric-react": {
-      "version": "4.35.2",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.35.2.tgz",
-      "integrity": "sha512-2WYTwGBWOT4QcGGIhR0ksJYETlzkeTqQ/ZOjhlJMFnU/X97ofW6rHiCi+tGrBugmBkUUlGoEBPLt8azpph4G3g=="
+      "version": "4.37.5",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.37.5.tgz",
+      "integrity": "sha512-yCYM2BoESLdWjnsflQ3FTDJCeJikqfLJgSSlbKYtieJajhPKcDeulHmmhMEKEXA3xmcC8fsRxG2hQnmZKf52yA=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -8439,11 +5783,6 @@
       "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
       "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E="
     },
-    "onetime": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/onetime/-/onetime-1.1.0.tgz",
-      "integrity": "sha1-ofeDj4MUxRbwXs78vEzP4EtO14k="
-    },
     "open": {
       "version": "0.0.5",
       "resolved": "https://registry.npmjs.org/open/-/open-0.0.5.tgz",
@@ -8462,14 +5801,7 @@
     "optimist": {
       "version": "0.6.1",
       "resolved": "https://registry.npmjs.org/optimist/-/optimist-0.6.1.tgz",
-      "integrity": "sha1-2j6nRob6IaGaERwybpDrFaAZZoY=",
-      "dependencies": {
-        "minimist": {
-          "version": "0.0.10",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.10.tgz",
-          "integrity": "sha1-3j+YVD2/lggr5IrRoMfNqDYwHc8="
-        }
-      }
+      "integrity": "sha1-2j6nRob6IaGaERwybpDrFaAZZoY="
     },
     "optionator": {
       "version": "0.8.2",
@@ -8488,28 +5820,6 @@
       "resolved": "https://registry.npmjs.org/options/-/options-0.0.6.tgz",
       "integrity": "sha1-7CLTEoBrtT5zF3Pnza788cZDEo8="
     },
-    "orchestrator": {
-      "version": "0.3.8",
-      "resolved": "https://registry.npmjs.org/orchestrator/-/orchestrator-0.3.8.tgz",
-      "integrity": "sha1-FOfp4nZPcxX7rBhOUGx6pt+UrX4=",
-      "dependencies": {
-        "end-of-stream": {
-          "version": "0.1.5",
-          "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-0.1.5.tgz",
-          "integrity": "sha1-jhdyBsPICDfYVjLouTWd/osvbq8="
-        },
-        "once": {
-          "version": "1.3.3",
-          "resolved": "https://registry.npmjs.org/once/-/once-1.3.3.tgz",
-          "integrity": "sha1-suJhVXzkwxTsgwTz+oJmPkKXyiA="
-        }
-      }
-    },
-    "ordered-read-streams": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-0.1.0.tgz",
-      "integrity": "sha1-/VZamvjrRHO6abbtijQ1LLVS8SY="
-    },
     "original": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/original/-/original-1.0.0.tgz",
@@ -8523,9 +5833,9 @@
       }
     },
     "os-browserify": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.1.2.tgz",
-      "integrity": "sha1-ScoCk+CxlZCl9d4Qx/JlphfY/lQ="
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz",
+      "integrity": "sha1-Y/xMzuXS13Y9Jrv4YBB45sLgBE8="
     },
     "os-homedir": {
       "version": "1.0.2",
@@ -8567,68 +5877,33 @@
       "resolved": "https://registry.npmjs.org/p-map/-/p-map-1.1.1.tgz",
       "integrity": "sha1-BfXkrpegaDcbwqXMhr+9vBnErno="
     },
-    "package-json": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/package-json/-/package-json-4.0.1.tgz",
-      "integrity": "sha1-iGmgQBJTZhxMTKPabCEh7VVfXu0="
-    },
     "pako": {
       "version": "0.2.9",
       "resolved": "https://registry.npmjs.org/pako/-/pako-0.2.9.tgz",
       "integrity": "sha1-8/dSL073gjSNqBYbrZ7P1Rv4OnU="
     },
-    "parallel-transform": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/parallel-transform/-/parallel-transform-1.1.0.tgz",
-      "integrity": "sha1-1BDwZbBdojCB/NEPKIVMKb2jOwY=",
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        }
-      }
-    },
-    "param-case": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/param-case/-/param-case-2.1.1.tgz",
-      "integrity": "sha1-35T9jPZTHs915r75oIWPvHK+Ikc="
-    },
     "parse-asn1": {
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.0.tgz",
       "integrity": "sha1-N8T5t+06tlx0gXtfJICTf7+XxxI="
     },
-    "parse-filepath": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/parse-filepath/-/parse-filepath-1.0.1.tgz",
-      "integrity": "sha1-FZ1hVdQ5BNFsEO9piRHaHpGWm3M="
-    },
     "parse-glob": {
       "version": "3.0.4",
       "resolved": "https://registry.npmjs.org/parse-glob/-/parse-glob-3.0.4.tgz",
-      "integrity": "sha1-ssN2z7EfNVE7rdFz7wu246OIORw="
+      "integrity": "sha1-ssN2z7EfNVE7rdFz7wu246OIORw=",
+      "dependencies": {
+        "is-extglob": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
+          "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
+        }
+      }
     },
     "parse-json": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz",
       "integrity": "sha1-9ID0BDTvgHQfhGkJn43qGPVaTck="
     },
-    "parse-passwd": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/parse-passwd/-/parse-passwd-1.0.0.tgz",
-      "integrity": "sha1-bVuTSkVpk7I9N/QKOC1vFmao5cY="
-    },
     "parsejson": {
       "version": "0.0.3",
       "resolved": "https://registry.npmjs.org/parsejson/-/parsejson-0.0.3.tgz",
@@ -8649,16 +5924,16 @@
       "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.1.tgz",
       "integrity": "sha1-yKuMkiO6NIiKpkopeyiFO+wY2lY="
     },
+    "pascalcase": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/pascalcase/-/pascalcase-0.1.1.tgz",
+      "integrity": "sha1-s2PlXoAGym/iF4TS2yK9FdeRfxQ="
+    },
     "path-browserify": {
       "version": "0.0.0",
       "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-0.0.0.tgz",
       "integrity": "sha1-oLhwcpquIUAFt9UDLsLLuw+0RRo="
     },
-    "path-dirname": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/path-dirname/-/path-dirname-1.0.2.tgz",
-      "integrity": "sha1-zDPSTVJeCZpTiMAzbG4yuRYGCeA="
-    },
     "path-exists": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
@@ -8684,57 +5959,32 @@
       "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.5.tgz",
       "integrity": "sha1-PBrfhx6pzWyUMbbqK9dKD/BVxME="
     },
-    "path-root": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/path-root/-/path-root-0.1.1.tgz",
-      "integrity": "sha1-mkpoFMrBwM1zNgqV8yCDyOpHRbc="
-    },
-    "path-root-regex": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/path-root-regex/-/path-root-regex-0.1.2.tgz",
-      "integrity": "sha1-v8zcjfWxLcUsi0PsONGNcsBLqW0="
-    },
     "path-to-regexp": {
-      "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
-      "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.7.0.tgz",
+      "integrity": "sha1-Wf3g9DW62suhA6hOnTvGTpa5k30=",
+      "dependencies": {
+        "isarray": {
+          "version": "0.0.1",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
+        }
+      }
     },
     "path-type": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
       "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE="
     },
-    "pause": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/pause/-/pause-0.1.0.tgz",
-      "integrity": "sha1-68ikqGGf8LioGsFRPDQ0/0af23Q="
-    },
-    "pause-stream": {
-      "version": "0.0.11",
-      "resolved": "https://registry.npmjs.org/pause-stream/-/pause-stream-0.0.11.tgz",
-      "integrity": "sha1-/lo0sMvOErWqaitAPuLnO2AvFEU="
+    "pathval": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/pathval/-/pathval-1.1.0.tgz",
+      "integrity": "sha1-uULm1L3mUwBe9rcTYd74cn0GReA="
     },
     "pbkdf2": {
       "version": "3.0.13",
       "resolved": "https://registry.npmjs.org/pbkdf2/-/pbkdf2-3.0.13.tgz",
-      "integrity": "sha512-+dCHxDH+djNtjgWmvVC/my3SYBAKpKNqKSjLkp+GtWWYe4XPE+e/PSD2aCanlEZZnqPk2uekTKNC/ccbwd2X2Q==",
-      "dependencies": {
-        "ripemd160": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz",
-          "integrity": "sha1-D0WEKVxTo2KK9+bXmsohzlfRxuc="
-        },
-        "sha.js": {
-          "version": "2.4.8",
-          "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz",
-          "integrity": "sha1-NwaMLEdra69ALRSknGf1l5IfY08="
-        }
-      }
-    },
-    "pbkdf2-compat": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/pbkdf2-compat/-/pbkdf2-compat-2.0.1.tgz",
-      "integrity": "sha1-tuDI+plJTZTgURV1gCpZpcFC8og="
+      "integrity": "sha512-+dCHxDH+djNtjgWmvVC/my3SYBAKpKNqKSjLkp+GtWWYe4XPE+e/PSD2aCanlEZZnqPk2uekTKNC/ccbwd2X2Q=="
     },
     "pend": {
       "version": "1.2.0",
@@ -8746,11 +5996,6 @@
       "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-0.2.0.tgz",
       "integrity": "sha1-M+8wxcd9TqIcWlOGnZG1bY8lVeU="
     },
-    "phantomcss": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/phantomcss/-/phantomcss-1.1.3.tgz",
-      "integrity": "sha1-4+N98YNapNYWcLnyzbiIVipjMMM="
-    },
     "phantomjs-polyfill": {
       "version": "0.0.2",
       "resolved": "https://registry.npmjs.org/phantomjs-polyfill/-/phantomjs-polyfill-0.0.2.tgz",
@@ -8766,11 +6011,6 @@
           "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.0.5.tgz",
           "integrity": "sha1-eILzCt3lskDM+n99eMVIMwlRrkI="
         },
-        "fs-extra": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-1.0.0.tgz",
-          "integrity": "sha1-zTzl9+fLYUWIP8rjGR6Yd/hYeVA="
-        },
         "which": {
           "version": "1.2.14",
           "resolved": "https://registry.npmjs.org/which/-/which-1.2.14.tgz",
@@ -8778,11 +6018,6 @@
         }
       }
     },
-    "pidof": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/pidof/-/pidof-1.0.2.tgz",
-      "integrity": "sha1-+6Dq4cgzWhHrgJn10PPvvEXLTpA="
-    },
     "pify": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
@@ -8798,38 +6033,31 @@
       "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz",
       "integrity": "sha1-ITXW36ejWMBprJsXh3YogihFD/o="
     },
-    "pkg-conf": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/pkg-conf/-/pkg-conf-1.1.3.tgz",
-      "integrity": "sha1-N45W1v0T6Iv7b0ol33qD+qvduls="
-    },
     "portfinder": {
       "version": "1.0.13",
       "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.13.tgz",
       "integrity": "sha1-uzLs2HwnEErm7kS1o8y/Drsa7ek="
     },
+    "posix-character-classes": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/posix-character-classes/-/posix-character-classes-0.1.1.tgz",
+      "integrity": "sha1-AerA/jta9xoqbAL+q7jB/vfgDqs="
+    },
     "postcss": {
-      "version": "6.0.9",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.9.tgz",
-      "integrity": "sha512-bBE2AHNEBhF23TfET6AA/lFP8ah+qHOZoFJEflFG+HgvVLdTmMOrocx/4LVVDIn3w6jUssw1q2Exk1cc9UOI8w==",
-      "dependencies": {
-        "has-flag": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
-          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
-        },
-        "supports-color": {
-          "version": "4.2.1",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
-          "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
-        }
-      }
+      "version": "6.0.10",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.10.tgz",
+      "integrity": "sha512-7WOpqea/cQHH1XUXdN1mqoFFmhigW3KAXJ+ssMOk/f6mKmwqFgqqdwsnjLGH+wuY+kwaJvT4whHcfKt5kWga0A=="
     },
     "postcss-calc": {
       "version": "5.3.1",
       "resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-5.3.1.tgz",
       "integrity": "sha1-d7rnypKK2FcW4v2kLyYb98HWW14=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -8842,6 +6070,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -8859,6 +6092,11 @@
       "resolved": "https://registry.npmjs.org/postcss-colormin/-/postcss-colormin-2.2.2.tgz",
       "integrity": "sha1-ZjFBfV8OkJo9fsJrJMio0eT5bks=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -8871,6 +6109,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -8888,6 +6131,11 @@
       "resolved": "https://registry.npmjs.org/postcss-convert-values/-/postcss-convert-values-2.6.1.tgz",
       "integrity": "sha1-u9hZPFwf0uPRwyK7kl3K6Nrk1i0=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -8900,6 +6148,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -8917,6 +6170,11 @@
       "resolved": "https://registry.npmjs.org/postcss-discard-comments/-/postcss-discard-comments-2.0.4.tgz",
       "integrity": "sha1-vv6J+v1bPazlzM5Rt2uBUUvgDj0=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -8929,6 +6187,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -8946,6 +6209,11 @@
       "resolved": "https://registry.npmjs.org/postcss-discard-duplicates/-/postcss-discard-duplicates-2.1.0.tgz",
       "integrity": "sha1-uavye4isGIFYpesSq8riAmO5GTI=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -8958,6 +6226,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -8975,6 +6248,11 @@
       "resolved": "https://registry.npmjs.org/postcss-discard-empty/-/postcss-discard-empty-2.1.0.tgz",
       "integrity": "sha1-0rS9nVztXr2Nyt52QMfXzX9PkrU=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -8987,6 +6265,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -9004,6 +6287,11 @@
       "resolved": "https://registry.npmjs.org/postcss-discard-overridden/-/postcss-discard-overridden-0.1.1.tgz",
       "integrity": "sha1-ix6vVU9ob7KIzYdMVWZ7CqNmjVg=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -9016,6 +6304,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -9033,6 +6326,11 @@
       "resolved": "https://registry.npmjs.org/postcss-discard-unused/-/postcss-discard-unused-2.2.3.tgz",
       "integrity": "sha1-vOMLLMWR/8Y0Mitfs0ZLbZNPRDM=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -9045,6 +6343,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -9062,6 +6365,11 @@
       "resolved": "https://registry.npmjs.org/postcss-filter-plugins/-/postcss-filter-plugins-2.0.2.tgz",
       "integrity": "sha1-bYWGJTTXNaxCDkqFgG4fXUKG2Ew=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -9074,6 +6382,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -9102,44 +6415,20 @@
       "integrity": "sha1-dFdoEWWZrKLwCfrUJrABdQSdjZI="
     },
     "postcss-loader": {
-      "version": "1.3.3",
-      "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-1.3.3.tgz",
-      "integrity": "sha1-piHqH6KQYqg5cqRvVEhncTAZFus=",
-      "dependencies": {
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
-          "dependencies": {
-            "supports-color": {
-              "version": "2.0.0",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-            }
-          }
-        },
-        "loader-utils": {
-          "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
-          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
-        },
-        "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
-        }
-      }
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-2.0.6.tgz",
+      "integrity": "sha512-HIq7yy1hh9KI472Y38iSRV4WupZUNy6zObkxQM/ZuInoaE2+PyX4NcO6jjP5HG5mXL7j5kcNEl0fAG4Kva7O9w=="
     },
     "postcss-merge-idents": {
       "version": "2.1.7",
       "resolved": "https://registry.npmjs.org/postcss-merge-idents/-/postcss-merge-idents-2.1.7.tgz",
       "integrity": "sha1-TFUwMTwI4dWzu/PSu8dH4njuonA=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -9152,6 +6441,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -9169,6 +6463,11 @@
       "resolved": "https://registry.npmjs.org/postcss-merge-longhand/-/postcss-merge-longhand-2.0.2.tgz",
       "integrity": "sha1-I9kM0Sewp3mUkVMyc5A0oaTz1lg=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -9181,6 +6480,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -9198,10 +6502,10 @@
       "resolved": "https://registry.npmjs.org/postcss-merge-rules/-/postcss-merge-rules-2.1.2.tgz",
       "integrity": "sha1-0d9d+qexrMO+VT8OnhDofGG19yE=",
       "dependencies": {
-        "browserslist": {
-          "version": "1.7.7",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
-          "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk="
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
         },
         "chalk": {
           "version": "1.1.3",
@@ -9215,6 +6519,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -9237,6 +6546,11 @@
       "resolved": "https://registry.npmjs.org/postcss-minify-font-values/-/postcss-minify-font-values-1.0.5.tgz",
       "integrity": "sha1-S1jttWZB66fIR0qzUmyv17vey2k=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -9249,6 +6563,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -9266,6 +6585,11 @@
       "resolved": "https://registry.npmjs.org/postcss-minify-gradients/-/postcss-minify-gradients-1.0.5.tgz",
       "integrity": "sha1-Xb2hE3NwP4PPtKPqOIHY11/15uE=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -9278,6 +6602,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -9295,6 +6624,11 @@
       "resolved": "https://registry.npmjs.org/postcss-minify-params/-/postcss-minify-params-1.2.2.tgz",
       "integrity": "sha1-rSzgcTc7lDs9kwo/pZo1jCjW8fM=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -9307,6 +6641,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -9324,6 +6663,11 @@
       "resolved": "https://registry.npmjs.org/postcss-minify-selectors/-/postcss-minify-selectors-2.1.1.tgz",
       "integrity": "sha1-ssapjAByz5G5MtGkllCBFDEXNb8=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -9336,6 +6680,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -9378,6 +6727,11 @@
       "resolved": "https://registry.npmjs.org/postcss-normalize-charset/-/postcss-normalize-charset-1.1.1.tgz",
       "integrity": "sha1-757nEhLX/nWceO0WL2HtYrXLk/E=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -9390,6 +6744,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -9407,6 +6766,11 @@
       "resolved": "https://registry.npmjs.org/postcss-normalize-url/-/postcss-normalize-url-3.0.8.tgz",
       "integrity": "sha1-EI90s/L82viRov+j6kWSJ5/HgiI=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -9419,6 +6783,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -9436,6 +6805,11 @@
       "resolved": "https://registry.npmjs.org/postcss-ordered-values/-/postcss-ordered-values-2.2.3.tgz",
       "integrity": "sha1-7sbCpntsQSqNsgQud/6NpD+VwR0=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -9448,6 +6822,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -9465,6 +6844,11 @@
       "resolved": "https://registry.npmjs.org/postcss-reduce-idents/-/postcss-reduce-idents-2.4.0.tgz",
       "integrity": "sha1-wsbSDMlYKE9qv75j92Cb9AkFmtM=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -9477,6 +6861,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -9494,6 +6883,11 @@
       "resolved": "https://registry.npmjs.org/postcss-reduce-initial/-/postcss-reduce-initial-1.0.1.tgz",
       "integrity": "sha1-aPgGlfBF0IJjqHmtJA343WT2ROo=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -9506,6 +6900,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -9523,6 +6922,11 @@
       "resolved": "https://registry.npmjs.org/postcss-reduce-transforms/-/postcss-reduce-transforms-1.0.4.tgz",
       "integrity": "sha1-/3b02CEkN7McKYpC0uFEQCV3GuE=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -9535,6 +6939,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -9557,6 +6966,11 @@
       "resolved": "https://registry.npmjs.org/postcss-svgo/-/postcss-svgo-2.1.6.tgz",
       "integrity": "sha1-tt8YqmE7Zm4TPwittSGcJoSsEI0=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -9569,6 +6983,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -9586,6 +7005,11 @@
       "resolved": "https://registry.npmjs.org/postcss-unique-selectors/-/postcss-unique-selectors-2.0.2.tgz",
       "integrity": "sha1-mB1X0p3csz57Hf4f1DuGSfkzyh0=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -9598,6 +7022,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -9620,6 +7049,11 @@
       "resolved": "https://registry.npmjs.org/postcss-zindex/-/postcss-zindex-2.2.0.tgz",
       "integrity": "sha1-0hCd3AVbka9n/EyzsCWUZjnSryI=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -9632,6 +7066,11 @@
             }
           }
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
         "postcss": {
           "version": "5.2.17",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
@@ -9659,16 +7098,6 @@
       "resolved": "https://registry.npmjs.org/preserve/-/preserve-0.2.0.tgz",
       "integrity": "sha1-gV7R9uvGWSb4ZbMQwHE7yzMVzks="
     },
-    "pretty-hrtime": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz",
-      "integrity": "sha1-t+PqQkNaTJsnWdmeDyAesZWALuE="
-    },
-    "private": {
-      "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/private/-/private-0.1.7.tgz",
-      "integrity": "sha1-aM5eih7woju1cMwoU3tTMqumPvE="
-    },
     "process": {
       "version": "0.11.10",
       "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
@@ -9724,6 +7153,11 @@
       "resolved": "https://registry.npmjs.org/q/-/q-1.5.0.tgz",
       "integrity": "sha1-3QG6ydBtMObyGa7LglPunr3DCPE="
     },
+    "qjobs": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/qjobs/-/qjobs-1.1.5.tgz",
+      "integrity": "sha1-ZZ3p8s+NzCehSBJ28gU3cnI4LnM="
+    },
     "qs": {
       "version": "6.4.0",
       "resolved": "https://registry.npmjs.org/qs/-/qs-6.4.0.tgz",
@@ -9744,39 +7178,15 @@
       "resolved": "https://registry.npmjs.org/querystring-es3/-/querystring-es3-0.2.1.tgz",
       "integrity": "sha1-nsYfeQSYdXB9aUFFlv2Qek1xHnM="
     },
-    "querystringify": {
-      "version": "0.0.4",
-      "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-0.0.4.tgz",
-      "integrity": "sha1-DPf4T5Rj/wrlHExLFC2VvjdyTZw="
-    },
-    "random-bytes": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/random-bytes/-/random-bytes-1.0.0.tgz",
-      "integrity": "sha1-T2ih3Arli9P7lYSMMDJNt11kNgs="
-    },
-    "randomatic": {
-      "version": "1.1.7",
-      "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-1.1.7.tgz",
-      "integrity": "sha512-D5JUjPyJbaJDkuAazpVnSfVkLlpeO3wDlPROTMLGKG1zMFNFRgrciKo1ltz/AzNTkqE0HzDx655QOL51N06how==",
-      "dependencies": {
-        "is-number": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/is-number/-/is-number-3.0.0.tgz",
-          "integrity": "sha1-JP1iAaR4LPUFYcgQJ2r8fRLXEZU=",
-          "dependencies": {
-            "kind-of": {
-              "version": "3.2.2",
-              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-              "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
-            }
-          }
-        },
-        "kind-of": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-4.0.0.tgz",
-          "integrity": "sha1-IIE989cSkosgc3hpGkUGb65y3Vc="
-        }
-      }
+    "querystringify": {
+      "version": "0.0.4",
+      "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-0.0.4.tgz",
+      "integrity": "sha1-DPf4T5Rj/wrlHExLFC2VvjdyTZw="
+    },
+    "randomatic": {
+      "version": "1.1.7",
+      "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-1.1.7.tgz",
+      "integrity": "sha512-D5JUjPyJbaJDkuAazpVnSfVkLlpeO3wDlPROTMLGKG1zMFNFRgrciKo1ltz/AzNTkqE0HzDx655QOL51N06how=="
     },
     "randombytes": {
       "version": "2.0.5",
@@ -9798,11 +7208,6 @@
       "resolved": "https://registry.npmjs.org/raw-loader/-/raw-loader-0.5.1.tgz",
       "integrity": "sha1-DD0L6u2KAclm2Xh793goElKpeao="
     },
-    "rc": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/rc/-/rc-1.2.1.tgz",
-      "integrity": "sha1-LgPo5C7kULjLPc5lvhv4l04d/ZU="
-    },
     "react": {
       "version": "15.4.2",
       "resolved": "https://registry.npmjs.org/react/-/react-15.4.2.tgz",
@@ -9823,33 +7228,6 @@
       "resolved": "https://registry.npmjs.org/react-highlight/-/react-highlight-0.9.0.tgz",
       "integrity": "sha1-1e3udEzLhon3k4eUtqG1VLsVDrc="
     },
-    "read": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/read/-/read-1.0.7.tgz",
-      "integrity": "sha1-s9oZvQUkMal2cdRKQmNK33ELQMQ="
-    },
-    "read-all-stream": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/read-all-stream/-/read-all-stream-3.1.0.tgz",
-      "integrity": "sha1-NcPhd/IHjveJ7kv6+kNzB06u9Po=",
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        }
-      }
-    },
     "read-pkg": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
@@ -9861,60 +7239,14 @@
       "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI="
     },
     "readable-stream": {
-      "version": "1.1.14",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
-      "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk="
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
+      "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
     },
     "readdirp": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-2.1.0.tgz",
-      "integrity": "sha1-TtCtBg3zBzMAxIRANz9y0cxkLXg=",
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        }
-      }
-    },
-    "readline2": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/readline2/-/readline2-1.0.1.tgz",
-      "integrity": "sha1-QQWWCP/BVHV7cV2ZidGZ/783LjU=",
-      "dependencies": {
-        "mute-stream": {
-          "version": "0.0.5",
-          "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.5.tgz",
-          "integrity": "sha1-j7+rsKmKJT0xhDMfno3rc3L6xsA="
-        }
-      }
-    },
-    "recast": {
-      "version": "0.11.23",
-      "resolved": "https://registry.npmjs.org/recast/-/recast-0.11.23.tgz",
-      "integrity": "sha1-RR/TAEqx5N+bTktmN2sqIZEkYtM=",
-      "dependencies": {
-        "esprima": {
-          "version": "3.1.3",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz",
-          "integrity": "sha1-/cpRzuYTOJXjyI1TXOSdv/YqRjM="
-        }
-      }
-    },
-    "rechoir": {
-      "version": "0.6.2",
-      "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz",
-      "integrity": "sha1-hSBLVNuoLVdC4oyWdW70OvUOM4Q="
+      "integrity": "sha1-TtCtBg3zBzMAxIRANz9y0cxkLXg="
     },
     "redent": {
       "version": "1.0.0",
@@ -9972,21 +7304,16 @@
       "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.3.tgz",
       "integrity": "sha1-mxpsNdTQ3871cRrmUejp09cRQUU="
     },
+    "regex-not": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/regex-not/-/regex-not-1.0.0.tgz",
+      "integrity": "sha1-Qvg+OXcWIt+CawKvF2Ul1qXxV/k="
+    },
     "regexpu-core": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-1.0.0.tgz",
       "integrity": "sha1-hqdj9Y7k18L2sQLkdkBQ3n7ZDGs="
     },
-    "registry-auth-token": {
-      "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/registry-auth-token/-/registry-auth-token-3.3.1.tgz",
-      "integrity": "sha1-+w0yie4Nmtosu1KvXf5mywcNMAY="
-    },
-    "registry-url": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/registry-url/-/registry-url-3.1.0.tgz",
-      "integrity": "sha1-PU74cPc93h138M+aOBQyRE4XSUI="
-    },
     "regjsgen": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.2.0.tgz",
@@ -9997,11 +7324,6 @@
       "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz",
       "integrity": "sha1-fuj4Tcb6eS0/0K4ijSS9lJ6tIFw="
     },
-    "relateurl": {
-      "version": "0.2.7",
-      "resolved": "https://registry.npmjs.org/relateurl/-/relateurl-0.2.7.tgz",
-      "integrity": "sha1-VNvzd+UUQKypCkzSdGANP/LYiKk="
-    },
     "remove-trailing-separator": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.1.0.tgz",
@@ -10022,33 +7344,6 @@
       "resolved": "https://registry.npmjs.org/repeating/-/repeating-2.0.1.tgz",
       "integrity": "sha1-UhTFOpJtNVJwdSf7q0FdvAjQbdo="
     },
-    "replace-ext": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-0.0.1.tgz",
-      "integrity": "sha1-KbvZIHinOfC8zitO5B6DeVNSKSQ="
-    },
-    "replacestream": {
-      "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/replacestream/-/replacestream-4.0.2.tgz",
-      "integrity": "sha1-DEFAcH5PAyP1DeBEhRcIz1i8N70=",
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        }
-      }
-    },
     "request": {
       "version": "2.81.0",
       "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz",
@@ -10089,20 +7384,10 @@
       "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.4.0.tgz",
       "integrity": "sha512-aW7sVKPufyHqOmyyLzg/J+8606v5nevBgaliIlV7nUpVMsDnoBGV/cbSLNjZAg9q0Cfd/+easKVKQ8vOu8fn1Q=="
     },
-    "resolve-dir": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/resolve-dir/-/resolve-dir-0.1.1.tgz",
-      "integrity": "sha1-shklmlYC+sXFxJatiUpujMQwJh4="
-    },
-    "response-time": {
-      "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/response-time/-/response-time-2.3.2.tgz",
-      "integrity": "sha1-/6cbq5UtYvfB1Jt0NDVfvGjf/Fo="
-    },
-    "restore-cursor": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-1.0.1.tgz",
-      "integrity": "sha1-NGYfRohjJ/7SmRR5FSJS35LapUE="
+    "resolve-url": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/resolve-url/-/resolve-url-0.2.1.tgz",
+      "integrity": "sha1-LGN/53yJOv0qZj/iGqkIAGjiBSo="
     },
     "right-align": {
       "version": "0.1.3",
@@ -10115,39 +7400,24 @@
       "integrity": "sha1-wjOOxkPfeht/5cVPqG9XQopV8z0="
     },
     "ripemd160": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-0.2.0.tgz",
-      "integrity": "sha1-K/GYveFnys+lHAqSjoS2i74XH84="
-    },
-    "rndm": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/rndm/-/rndm-1.2.0.tgz",
-      "integrity": "sha1-8z/pz7Urv9UgqhgyO8ZdsRCht2w="
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz",
+      "integrity": "sha1-D0WEKVxTo2KK9+bXmsohzlfRxuc="
     },
     "rtl-css-js": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.1.3.tgz",
       "integrity": "sha1-JHyZl21jSk7XjfwN+KF/9lQMii8="
     },
-    "run-async": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/run-async/-/run-async-0.1.0.tgz",
-      "integrity": "sha1-yK1KXhEGYeQCp9IbUw4AnyX444k="
-    },
-    "rx-lite": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/rx-lite/-/rx-lite-3.1.2.tgz",
-      "integrity": "sha1-Gc5QLKVyZl87ZHsQk5+X/RYV8QI="
-    },
     "safe-buffer": {
       "version": "5.1.1",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.1.tgz",
       "integrity": "sha512-kKvNJn6Mm93gAczWVJg7wH+wGYWNrDHdWvpUmHyEsgCtIwwo3bqPtV4tR5tuPaUhTOo/kvhVwd8XwwOllGYkbg=="
     },
     "samsam": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.1.2.tgz",
-      "integrity": "sha1-vsEf3IOp/aBjQBIQ5AF2wwJNFWc="
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.2.1.tgz",
+      "integrity": "sha1-7dOQk6MYQ3DLhZJDsr3yVefY6mc="
     },
     "sass-graph": {
       "version": "2.2.4",
@@ -10159,15 +7429,15 @@
           "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
           "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
         },
+        "cliui": {
+          "version": "3.2.0",
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
+          "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
+        },
         "yargs": {
           "version": "7.1.0",
           "resolved": "https://registry.npmjs.org/yargs/-/yargs-7.1.0.tgz",
           "integrity": "sha1-a6MY6xaWFyf10oT46gA+jWFU0Mg="
-        },
-        "yargs-parser": {
-          "version": "5.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-5.0.0.tgz",
-          "integrity": "sha1-J17PDX/+Bcd+ZOfIbkzZS/DhIoo="
         }
       }
     },
@@ -10181,11 +7451,6 @@
           "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
           "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw=="
         },
-        "loader-utils": {
-          "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
-          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
-        },
         "pify": {
           "version": "3.0.0",
           "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
@@ -10194,14 +7459,14 @@
       }
     },
     "sax": {
-      "version": "0.5.2",
-      "resolved": "https://registry.npmjs.org/sax/-/sax-0.5.2.tgz",
-      "integrity": "sha1-c1/6o5oc/4/7lZjwIjq9sDqfsuo="
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz",
+      "integrity": "sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw=="
     },
-    "script-loader": {
-      "version": "0.7.0",
-      "resolved": "https://registry.npmjs.org/script-loader/-/script-loader-0.7.0.tgz",
-      "integrity": "sha1-aF3H5waeDe56kmdPDrxbD1W6pew="
+    "schema-utils": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-0.3.0.tgz",
+      "integrity": "sha1-9YdyIs4+kx7a4DnxfrNxbnE3+M8="
     },
     "scss-tokenizer": {
       "version": "0.2.3",
@@ -10223,128 +7488,55 @@
     "selfsigned": {
       "version": "1.10.1",
       "resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-1.10.1.tgz",
-      "integrity": "sha1-v4y3uDJWxFUeMTR8YxF3jbme7FI=",
-      "dependencies": {
-        "node-forge": {
-          "version": "0.6.33",
-          "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.6.33.tgz",
-          "integrity": "sha1-RjgRh59XPUUVWtap9D3ClujoXrw="
-        }
-      }
+      "integrity": "sha1-v4y3uDJWxFUeMTR8YxF3jbme7FI="
     },
     "semver": {
-      "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz",
-      "integrity": "sha1-myzl094C0XxgEq0yaqa00M9U+U8="
-    },
-    "semver-diff": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/semver-diff/-/semver-diff-2.1.0.tgz",
-      "integrity": "sha1-S7uEN8jTfksM8aaP1ybsbWRdbTY="
+      "version": "5.0.3",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-5.0.3.tgz",
+      "integrity": "sha1-d0Zt5YnNXTyV8TiqeLxWmjy10no="
     },
     "send": {
-      "version": "0.14.2",
-      "resolved": "https://registry.npmjs.org/send/-/send-0.14.2.tgz",
-      "integrity": "sha1-ObBDiz9RC+Xcb2Z6EfcWiTaM3u8=",
+      "version": "0.15.4",
+      "resolved": "https://registry.npmjs.org/send/-/send-0.15.4.tgz",
+      "integrity": "sha1-mF+qPihLAnPHkzZKNcZze9k5Bbk=",
       "dependencies": {
-        "debug": {
-          "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo=",
-          "dependencies": {
-            "ms": {
-              "version": "0.7.1",
-              "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-              "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
-            }
-          }
-        },
-        "http-errors": {
-          "version": "1.5.1",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.5.1.tgz",
-          "integrity": "sha1-eIwNLB3iyBuebowBhDtrl+uSB1A="
-        },
         "mime": {
           "version": "1.3.4",
           "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz",
           "integrity": "sha1-EV+eO2s9rylZmDyzjxSaLUDrXVM="
-        },
-        "ms": {
-          "version": "0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
-          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
-        },
-        "setprototypeof": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.0.2.tgz",
-          "integrity": "sha1-gaVSFB7BBLiOic44MQOtXGZWTQg="
-        }
-      }
-    },
-    "sequencify": {
-      "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/sequencify/-/sequencify-0.0.7.tgz",
-      "integrity": "sha1-kM/xnQLgcCf9dn9erT57ldHnOAw="
-    },
-    "serve-favicon": {
-      "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/serve-favicon/-/serve-favicon-2.3.2.tgz",
-      "integrity": "sha1-3UGeJo3gEqtysxnTN/IQUBP5OB8=",
-      "dependencies": {
-        "ms": {
-          "version": "0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
-          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
         }
       }
     },
     "serve-index": {
-      "version": "1.7.3",
-      "resolved": "https://registry.npmjs.org/serve-index/-/serve-index-1.7.3.tgz",
-      "integrity": "sha1-egV/xu4o3GP2RWbl+lexEahq7NI=",
-      "dependencies": {
-        "accepts": {
-          "version": "1.2.13",
-          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.2.13.tgz",
-          "integrity": "sha1-5fHzkoxtlf2WVYw27D2dDeSm7Oo="
-        },
-        "debug": {
-          "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
-        },
-        "http-errors": {
-          "version": "1.3.1",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
-          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
-        },
-        "ms": {
-          "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
-        },
-        "negotiator": {
-          "version": "0.5.3",
-          "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.5.3.tgz",
-          "integrity": "sha1-Jp1cR2gQ7JLtvntsLygxY4T5p+g="
-        }
-      }
+      "version": "1.9.0",
+      "resolved": "https://registry.npmjs.org/serve-index/-/serve-index-1.9.0.tgz",
+      "integrity": "sha1-0rKA/FYNYW7oG0i/D6gqvtJIXOc="
     },
     "serve-static": {
-      "version": "1.11.2",
-      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.11.2.tgz",
-      "integrity": "sha1-LPmIm9RDWjIMw2iVyapXvWYuasc="
+      "version": "1.12.4",
+      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.12.4.tgz",
+      "integrity": "sha1-m2qpjutyU8Tu3Ewfb9vKYJkBqWE="
     },
     "set-blocking": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
       "integrity": "sha1-BF+XgtARrppoA93TgrJDkrPYkPc="
     },
+    "set-getter": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/set-getter/-/set-getter-0.1.0.tgz",
+      "integrity": "sha1-12nBgsnVpR9AkUXy+6guXoboA3Y="
+    },
     "set-immediate-shim": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/set-immediate-shim/-/set-immediate-shim-1.0.1.tgz",
       "integrity": "sha1-SysbJ+uAip+NzEgaWOXlb1mfP2E="
     },
+    "set-value": {
+      "version": "0.4.3",
+      "resolved": "https://registry.npmjs.org/set-value/-/set-value-0.4.3.tgz",
+      "integrity": "sha1-fbCPnT0i3H945Trzw79GZuzfzPE="
+    },
     "setimmediate": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/setimmediate/-/setimmediate-1.0.5.tgz",
@@ -10356,9 +7548,9 @@
       "integrity": "sha1-ZlZ+NwQ+608E2RvWWMDL77VbjgQ="
     },
     "sha.js": {
-      "version": "2.2.6",
-      "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.2.6.tgz",
-      "integrity": "sha1-F93t3F9yL7ZlAWWIlUYZd4ZzFbo="
+      "version": "2.4.8",
+      "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz",
+      "integrity": "sha1-NwaMLEdra69ALRSknGf1l5IfY08="
     },
     "shallow-clone": {
       "version": "0.1.2",
@@ -10397,62 +7589,66 @@
       "resolved": "https://registry.npmjs.org/shellwords/-/shellwords-0.1.1.tgz",
       "integrity": "sha512-vFwSUfQvqybiICwZY5+DAWIPLKsWO31Q91JSKl3UYv+K5c2QRPzn0qzec6QPu1Qc9eHYItiP3NdJqNVqetYAww=="
     },
-    "sigmund": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/sigmund/-/sigmund-1.0.1.tgz",
-      "integrity": "sha1-P/IfGYytIXX587eBhT/ZTQ0ZtZA="
-    },
     "signal-exit": {
       "version": "3.0.2",
       "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.2.tgz",
       "integrity": "sha1-tf3AjxKH6hF4Yo5BXiUTK3NkbG0="
     },
     "sinon": {
-      "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/sinon/-/sinon-2.3.2.tgz",
-      "integrity": "sha1-xDqcVw8yuqwRWVBc/u0ZEIhV34k=",
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/sinon/-/sinon-3.2.1.tgz",
+      "integrity": "sha512-KY3OLOWpek/I4NGAMHetuutVgS2aRgMR5g5/1LSYvPJ3qo2BopIvk3esFztPxF40RWf/NNNJzdFPriSkXUVK3A==",
       "dependencies": {
-        "formatio": {
-          "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.2.0.tgz",
-          "integrity": "sha1-87IWfZBoxGmKjVH092CjmlTYGOs="
-        },
         "lolex": {
-          "version": "1.6.0",
-          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
-          "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
-        },
-        "path-to-regexp": {
-          "version": "1.7.0",
-          "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.7.0.tgz",
-          "integrity": "sha1-Wf3g9DW62suhA6hOnTvGTpa5k30="
-        },
-        "samsam": {
-          "version": "1.2.1",
-          "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.2.1.tgz",
-          "integrity": "sha1-7dOQk6MYQ3DLhZJDsr3yVefY6mc="
-        },
-        "type-detect": {
-          "version": "4.0.3",
-          "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.0.3.tgz",
-          "integrity": "sha1-Dj8mcLRAmbC0bChNE2p+9Jx0wuo="
+          "version": "2.1.2",
+          "resolved": "https://registry.npmjs.org/lolex/-/lolex-2.1.2.tgz",
+          "integrity": "sha1-JpS5U8nqTQE+W4v7qJHJkQJbJik="
         }
       }
     },
     "sinon-chai": {
-      "version": "2.10.0",
-      "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.10.0.tgz",
-      "integrity": "sha1-arMAi7jK6ZKedE12ZXS0zzXzS1s="
+      "version": "2.13.0",
+      "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.13.0.tgz",
+      "integrity": "sha512-hRNu/TlYEp4Rw5IbzO8ykGoZMSG489PGUx1rvePpHGrtl20cXivRBgtr/EWYxIwL9EOO9+on04nd9k3tW8tVww=="
     },
-    "sliced": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/sliced/-/sliced-1.0.1.tgz",
-      "integrity": "sha1-CzpmK10Ewxd7GSa+qCsD+Dei70E="
+    "snapdragon": {
+      "version": "0.8.1",
+      "resolved": "https://registry.npmjs.org/snapdragon/-/snapdragon-0.8.1.tgz",
+      "integrity": "sha1-4StUh/re0+PeoKyR6UAL91tAE3A=",
+      "dependencies": {
+        "define-property": {
+          "version": "0.2.5",
+          "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
+          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY="
+        },
+        "is-descriptor": {
+          "version": "0.1.6",
+          "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
+          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
+        },
+        "kind-of": {
+          "version": "5.0.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
+          "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
+        }
+      }
     },
-    "slide": {
-      "version": "1.1.6",
-      "resolved": "https://registry.npmjs.org/slide/-/slide-1.1.6.tgz",
-      "integrity": "sha1-VusCfWW00tzmyy4tMsTUr8nh1wc="
+    "snapdragon-node": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/snapdragon-node/-/snapdragon-node-2.1.1.tgz",
+      "integrity": "sha512-O27l4xaMYt/RSQ5TR3vpWCAB5Kb/czIcqUFOM/C4fYcLnbZUc1PkjTAMjof2pBWaSTwOUd6qUHcFGVGj7aIwnw=="
+    },
+    "snapdragon-util": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/snapdragon-util/-/snapdragon-util-3.0.1.tgz",
+      "integrity": "sha512-mbKkMdQKsjX4BAL4bRYTj21edOf8cN7XHdYUJEe+Zn99hVEYcMvKPct1IqNe7+AZPirn8BCDOQBHQZknqmKlZQ==",
+      "dependencies": {
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+        }
+      }
     },
     "sntp": {
       "version": "1.0.9",
@@ -10460,9 +7656,9 @@
       "integrity": "sha1-ZUEYTMkK7qbG57NeJlkIJEPGYZg="
     },
     "socket.io": {
-      "version": "1.7.4",
-      "resolved": "https://registry.npmjs.org/socket.io/-/socket.io-1.7.4.tgz",
-      "integrity": "sha1-L37O3DORvy1cc+KR/iM+bjTU3QA=",
+      "version": "1.7.3",
+      "resolved": "https://registry.npmjs.org/socket.io/-/socket.io-1.7.3.tgz",
+      "integrity": "sha1-uK+cq6AJSeVo42nxMn6pvp6iRhs=",
       "dependencies": {
         "debug": {
           "version": "2.3.3",
@@ -10499,15 +7695,10 @@
       }
     },
     "socket.io-client": {
-      "version": "1.7.4",
-      "resolved": "https://registry.npmjs.org/socket.io-client/-/socket.io-client-1.7.4.tgz",
-      "integrity": "sha1-7J+CA1btme9tNX8HVtZIcXvdQoE=",
+      "version": "1.7.3",
+      "resolved": "https://registry.npmjs.org/socket.io-client/-/socket.io-client-1.7.3.tgz",
+      "integrity": "sha1-sw6GqhDV7zVGYBwJzeR2Xjgdo3c=",
       "dependencies": {
-        "component-emitter": {
-          "version": "1.2.1",
-          "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz",
-          "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY="
-        },
         "debug": {
           "version": "2.3.3",
           "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
@@ -10525,11 +7716,21 @@
       "resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-2.3.1.tgz",
       "integrity": "sha1-3VMgJRA85Clpcya+/WQAX8/ltKA=",
       "dependencies": {
+        "component-emitter": {
+          "version": "1.1.2",
+          "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.1.2.tgz",
+          "integrity": "sha1-KWWU8nU9qmOZbSrwjRWpURbJrsM="
+        },
         "debug": {
           "version": "2.2.0",
           "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
           "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
+        "isarray": {
+          "version": "0.0.1",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
+        },
         "ms": {
           "version": "0.7.1",
           "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
@@ -10567,9 +7768,9 @@
       "integrity": "sha1-RBttTTRnmPG05J6JIK37oOVD+a0="
     },
     "source-list-map": {
-      "version": "0.1.8",
-      "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-0.1.8.tgz",
-      "integrity": "sha1-xVCyq1Qn9rPyH1r+rYjE9Vh7IQY="
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-2.0.0.tgz",
+      "integrity": "sha512-I2UmuJSRr/T8jisiROLU3A3ltr+swpniSmNPI4Ml3ZCX6tVnDsuZzK7F2hl5jTqbZBWCEKlj5HRQiPExXLgE8A=="
     },
     "source-map": {
       "version": "0.5.7",
@@ -10586,6 +7787,11 @@
           "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz",
           "integrity": "sha1-rqdNXmHB+JlhO/ZL2mbUx48v0X0="
         },
+        "loader-utils": {
+          "version": "0.2.17",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz",
+          "integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g="
+        },
         "source-map": {
           "version": "0.1.43",
           "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz",
@@ -10593,10 +7799,20 @@
         }
       }
     },
-    "sparkles": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/sparkles/-/sparkles-1.0.0.tgz",
-      "integrity": "sha1-Gsu/tZJDbRC76PeFt8xvgoFQEsM="
+    "source-map-resolve": {
+      "version": "0.5.0",
+      "resolved": "https://registry.npmjs.org/source-map-resolve/-/source-map-resolve-0.5.0.tgz",
+      "integrity": "sha1-/K0LZLcK+ydpnkJZUMtevNQQvCA="
+    },
+    "source-map-support": {
+      "version": "0.4.16",
+      "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.4.16.tgz",
+      "integrity": "sha512-A6vlydY7H/ljr4L2UOhDSajQdZQ6dMD7cLH0pzwcmwLyc9u8PNI4WGtnfDDzX7uzGL6c/T+ORL97Zlh+S4iOrg=="
+    },
+    "source-map-url": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/source-map-url/-/source-map-url-0.4.0.tgz",
+      "integrity": "sha1-PpNdfd1zYxuXZZlW1VEo6HtQhKM="
     },
     "spdx-correct": {
       "version": "1.0.2",
@@ -10616,46 +7832,17 @@
     "spdy": {
       "version": "3.4.7",
       "resolved": "https://registry.npmjs.org/spdy/-/spdy-3.4.7.tgz",
-      "integrity": "sha1-Qv9B7OXMD5mjpsKKq7c/XDsDrLw=",
-      "dependencies": {
-        "debug": {
-          "version": "2.6.8",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
-          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
-        }
-      }
+      "integrity": "sha1-Qv9B7OXMD5mjpsKKq7c/XDsDrLw="
     },
     "spdy-transport": {
       "version": "2.0.20",
       "resolved": "https://registry.npmjs.org/spdy-transport/-/spdy-transport-2.0.20.tgz",
-      "integrity": "sha1-c15yBUxIayNU/onnAiVgBKOazk0=",
-      "dependencies": {
-        "debug": {
-          "version": "2.6.8",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
-          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        }
-      }
+      "integrity": "sha1-c15yBUxIayNU/onnAiVgBKOazk0="
     },
-    "split": {
-      "version": "0.2.10",
-      "resolved": "https://registry.npmjs.org/split/-/split-0.2.10.tgz",
-      "integrity": "sha1-Zwl8YB1pfOE2j0GPBs0gHPBSGlc="
+    "split-string": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/split-string/-/split-string-2.1.1.tgz",
+      "integrity": "sha1-r0sG2CFWBCZEbDzZMc2mGJQNN9A="
     },
     "sprintf-js": {
       "version": "1.0.3",
@@ -10674,6 +7861,28 @@
         }
       }
     },
+    "static-extend": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/static-extend/-/static-extend-0.1.2.tgz",
+      "integrity": "sha1-YICcOcv/VTNyJv1eC1IPNB8ftcY=",
+      "dependencies": {
+        "define-property": {
+          "version": "0.2.5",
+          "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
+          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY="
+        },
+        "is-descriptor": {
+          "version": "0.1.6",
+          "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
+          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
+        },
+        "kind-of": {
+          "version": "5.0.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
+          "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
+        }
+      }
+    },
     "statuses": {
       "version": "1.3.1",
       "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.3.1.tgz",
@@ -10682,71 +7891,22 @@
     "stdout-stream": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/stdout-stream/-/stdout-stream-1.4.0.tgz",
-      "integrity": "sha1-osfIWH5U2UJ+qe2zrD8s1SLfN4s=",
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        }
-      }
+      "integrity": "sha1-osfIWH5U2UJ+qe2zrD8s1SLfN4s="
     },
     "stream-browserify": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-1.0.0.tgz",
-      "integrity": "sha1-v5tKv7QrJ011FHnkTg/yZWtvEZM="
-    },
-    "stream-combiner": {
-      "version": "0.0.4",
-      "resolved": "https://registry.npmjs.org/stream-combiner/-/stream-combiner-0.0.4.tgz",
-      "integrity": "sha1-TV5DPBhSYd3mI8o/RMWGvPXErRQ="
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz",
+      "integrity": "sha1-ZiZu5fm9uZQKTkUUyvtDu3Hlyds="
     },
     "stream-consume": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/stream-consume/-/stream-consume-0.1.0.tgz",
       "integrity": "sha1-pB6tGm1ggc63n2WwYZAbbY89HQ8="
     },
-    "stream-counter": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/stream-counter/-/stream-counter-0.2.0.tgz",
-      "integrity": "sha1-3tJmVWMZyLDiIoErnPOyb6fZR94="
-    },
     "stream-http": {
       "version": "2.7.2",
-      "resolved": "https://registry.npmjs.org/stream-http/-/stream-http-2.7.2.tgz",
-      "integrity": "sha512-c0yTD2rbQzXtSsFSVhtpvY/vS6u066PcXOX9kBB3mSO76RiUQzL340uJkGBWnlBg4/HZzqiUXtaVA7wcRcJgEw==",
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        }
-      }
-    },
-    "stream-shift": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/stream-shift/-/stream-shift-1.0.0.tgz",
-      "integrity": "sha1-1cdSgl5TZ+eG944Y5EXqIjoVWVI="
+      "resolved": "https://registry.npmjs.org/stream-http/-/stream-http-2.7.2.tgz",
+      "integrity": "sha512-c0yTD2rbQzXtSsFSVhtpvY/vS6u066PcXOX9kBB3mSO76RiUQzL340uJkGBWnlBg4/HZzqiUXtaVA7wcRcJgEw=="
     },
     "strict-uri-encode": {
       "version": "1.1.0",
@@ -10754,9 +7914,9 @@
       "integrity": "sha1-J5siXfHVgrH1TmWt3UNS4Y+qBxM="
     },
     "string_decoder": {
-      "version": "0.10.31",
-      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
-      "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+      "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
     },
     "string-hash": {
       "version": "1.1.3",
@@ -10779,21 +7939,9 @@
       "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8="
     },
     "strip-bom": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-1.0.0.tgz",
-      "integrity": "sha1-hbiGLzhEtabV7IRnqTWYFzo295Q="
-    },
-    "strip-bom-stream": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/strip-bom-stream/-/strip-bom-stream-1.0.0.tgz",
-      "integrity": "sha1-5xRDmFd9Uaa+0PoZlPoF9D/ZiO4=",
-      "dependencies": {
-        "strip-bom": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
-          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
-        }
-      }
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
+      "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
     },
     "strip-eof": {
       "version": "1.0.0",
@@ -10805,95 +7953,48 @@
       "resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-1.0.1.tgz",
       "integrity": "sha1-DHlipq3vp7vUrDZkYKY4VSrhoKI="
     },
-    "strip-json-comments": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz",
-      "integrity": "sha1-PFMZQukIwml8DsNEhYwobHygpgo="
-    },
     "style-loader": {
-      "version": "0.17.0",
-      "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.17.0.tgz",
-      "integrity": "sha1-6CVLzNt690vVgnTjYQe01atN8xA=",
-      "dependencies": {
-        "loader-utils": {
-          "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
-          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
-        }
-      }
+      "version": "0.18.2",
+      "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.18.2.tgz",
+      "integrity": "sha512-WPpJPZGUxWYHWIUMNNOYqql7zh85zGmr84FdTVWq52WTIkqlW9xSxD3QYWi/T31cqn9UNSsietVEgGn2aaSCzw=="
     },
     "subarg": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/subarg/-/subarg-1.0.0.tgz",
-      "integrity": "sha1-9izxdYHplrSPyWVpn1TAauJouNI="
-    },
-    "sudo": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/sudo/-/sudo-1.0.3.tgz",
-      "integrity": "sha1-zPKGaRIPi3T4K4Rt/38clRIO/yA="
+      "integrity": "sha1-9izxdYHplrSPyWVpn1TAauJouNI=",
+      "dependencies": {
+        "minimist": {
+          "version": "1.2.0",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
+          "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
+        }
+      }
     },
     "supports-color": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-      "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
+      "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
     },
     "svgo": {
       "version": "0.7.2",
       "resolved": "https://registry.npmjs.org/svgo/-/svgo-0.7.2.tgz",
-      "integrity": "sha1-n1dyQTlSE1xv779Ar+ak+qiLS7U=",
-      "dependencies": {
-        "esprima": {
-          "version": "2.7.3",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz",
-          "integrity": "sha1-luO3DVd59q1JzQMmc9HDEnZ7pYE="
-        },
-        "js-yaml": {
-          "version": "3.7.0",
-          "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.7.0.tgz",
-          "integrity": "sha1-XJZ93YN6m/3KXy3oQlOr6KHAO4A="
-        },
-        "sax": {
-          "version": "1.2.4",
-          "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz",
-          "integrity": "sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw=="
-        }
-      }
-    },
-    "symbol": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/symbol/-/symbol-0.2.3.tgz",
-      "integrity": "sha1-O5hzuKkB5Hxu/iFSajrDcu8ou8c="
+      "integrity": "sha1-n1dyQTlSE1xv779Ar+ak+qiLS7U="
     },
     "tapable": {
-      "version": "0.1.10",
-      "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.1.10.tgz",
-      "integrity": "sha1-KcNXB8K3DlDQdIK10gLo7URtr9Q="
+      "version": "0.2.8",
+      "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.8.tgz",
+      "integrity": "sha1-mTcqXJmb8t8WCvwNdL7U9HlIzSI="
     },
     "tar": {
       "version": "2.2.1",
       "resolved": "https://registry.npmjs.org/tar/-/tar-2.2.1.tgz",
       "integrity": "sha1-jk0qJWwOIYXGsYrWlK7JaLg8sdE="
     },
-    "term-size": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/term-size/-/term-size-1.2.0.tgz",
-      "integrity": "sha1-RYuDiH8oj8Vtb/+/rSYuJmOO+mk="
-    },
-    "ternary-stream": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/ternary-stream/-/ternary-stream-2.0.1.tgz",
-      "integrity": "sha1-Bk5Im0tb9gumpre8fy9cJ07Pgmk="
-    },
     "text-encoding": {
       "version": "0.6.4",
       "resolved": "https://registry.npmjs.org/text-encoding/-/text-encoding-0.6.4.tgz",
       "integrity": "sha1-45mpgiV6J22uQou5KEXLcb3CbRk="
     },
-    "textextensions": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/textextensions/-/textextensions-1.0.2.tgz",
-      "integrity": "sha1-ZUhjk+4fK7A5pgy7oFsLaL2VAdI="
-    },
     "throttleit": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/throttleit/-/throttleit-1.0.0.tgz",
@@ -10904,133 +8005,25 @@
       "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
       "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU="
     },
-    "through2": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/through2/-/through2-2.0.3.tgz",
-      "integrity": "sha1-AARWmzfHx0ujnEPzzteNGtlBQL4=",
-      "dependencies": {
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        }
-      }
-    },
-    "through2-concurrent": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/through2-concurrent/-/through2-concurrent-1.1.1.tgz",
-      "integrity": "sha1-EctOpMnjG8puTB5tukjRxyjDUks="
-    },
-    "through2-filter": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/through2-filter/-/through2-filter-2.0.0.tgz",
-      "integrity": "sha1-YLxVoNrLdghdsfna6Zq0P4PWIuw="
-    },
     "thunky": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/thunky/-/thunky-0.1.0.tgz",
       "integrity": "sha1-vzAUaCTituZ7Dy16Ssi+smkIaE4="
     },
-    "tildify": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/tildify/-/tildify-1.2.0.tgz",
-      "integrity": "sha1-3OwD9V3Km3qj5bBPIYF+tW5jWIo="
-    },
     "time-stamp": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/time-stamp/-/time-stamp-1.1.0.tgz",
-      "integrity": "sha1-dkpaEa9QVhkhsTPztE5hhofg9cM="
-    },
-    "timed-out": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-4.0.1.tgz",
-      "integrity": "sha1-8y6srFoXW+ol1/q1Zas+2HQe9W8="
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/time-stamp/-/time-stamp-2.0.0.tgz",
+      "integrity": "sha1-lcakRTDhW6jW9KPsuMOj+sRto1c="
     },
     "timers-browserify": {
-      "version": "1.4.2",
-      "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-1.4.2.tgz",
-      "integrity": "sha1-ycWLV1voQHN1y14kYtrO50NZ9B0="
-    },
-    "tiny-lr": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/tiny-lr/-/tiny-lr-0.2.1.tgz",
-      "integrity": "sha1-s/26gC5dVqM8L28QeUsy5Hescp0=",
-      "dependencies": {
-        "body-parser": {
-          "version": "1.14.2",
-          "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.14.2.tgz",
-          "integrity": "sha1-EBXLH+LEQ4WCWVgdtTMy+NDPUPk=",
-          "dependencies": {
-            "qs": {
-              "version": "5.2.0",
-              "resolved": "https://registry.npmjs.org/qs/-/qs-5.2.0.tgz",
-              "integrity": "sha1-qfMRQq9GjLcrJbMBNrokVoNJFr4="
-            }
-          }
-        },
-        "bytes": {
-          "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.2.0.tgz",
-          "integrity": "sha1-/TVGSkA/b5EXwt42Cez/nK4ABYg="
-        },
-        "debug": {
-          "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
-        },
-        "http-errors": {
-          "version": "1.3.1",
-          "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.3.1.tgz",
-          "integrity": "sha1-GX4izevUGYWF6GlO9nhhl7ke2UI="
-        },
-        "iconv-lite": {
-          "version": "0.4.13",
-          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.13.tgz",
-          "integrity": "sha1-H4irpKsLFQjoMSrMOTRfNumS4vI="
-        },
-        "ms": {
-          "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
-        },
-        "qs": {
-          "version": "5.1.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-5.1.0.tgz",
-          "integrity": "sha1-TZMuXH6kEcynajEtOaYGIA/VDNk="
-        },
-        "raw-body": {
-          "version": "2.1.7",
-          "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.1.7.tgz",
-          "integrity": "sha1-rf6s4uT7MJgFgBTQjActzFl1h3Q=",
-          "dependencies": {
-            "bytes": {
-              "version": "2.4.0",
-              "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz",
-              "integrity": "sha1-fZcZb51br39pNeJZhVSe3SpsIzk="
-            }
-          }
-        }
-      }
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.4.tgz",
+      "integrity": "sha512-uZYhyU3EX8O7HQP+J9fTVYwsq90Vr68xPEFo7yrVImIxYvHgukBEgOB/SgGoorWVTzGM/3Z+wUNnboA4M8jWrg=="
     },
     "tmp": {
-      "version": "0.0.33",
-      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.33.tgz",
-      "integrity": "sha512-jRCJlojKnZ3addtTOjdIqoRuPEKBvNXcGYqzO6zWZX8KfKEpnGY5jfggJQ3EjKuu8D4bJRr0y+cYJFmYbImXGw=="
-    },
-    "to-absolute-glob": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/to-absolute-glob/-/to-absolute-glob-0.1.1.tgz",
-      "integrity": "sha1-HN+kcqnvUMI57maZm2YsoOs5k38="
+      "version": "0.0.31",
+      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.31.tgz",
+      "integrity": "sha1-jzirlDjhcxXl29izZX6L+yd65Kc="
     },
     "to-array": {
       "version": "0.1.4",
@@ -11042,52 +8035,64 @@
       "resolved": "https://registry.npmjs.org/to-arraybuffer/-/to-arraybuffer-1.0.1.tgz",
       "integrity": "sha1-fSKbH8xjfkZsoIEYCDanqr/4P0M="
     },
-    "to-iso-string": {
-      "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/to-iso-string/-/to-iso-string-0.0.2.tgz",
-      "integrity": "sha1-TcGeZk38y+Jb2NtQiwDG2hWCVdE="
+    "to-fast-properties": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-1.0.3.tgz",
+      "integrity": "sha1-uDVx+k2MJbguIxsG46MFXeTKGkc="
+    },
+    "to-object-path": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/to-object-path/-/to-object-path-0.3.0.tgz",
+      "integrity": "sha1-KXWIt7Dn4KwI4E5nL4XB9JmeF68=",
+      "dependencies": {
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+        }
+      }
+    },
+    "to-regex": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/to-regex/-/to-regex-3.0.1.tgz",
+      "integrity": "sha1-FTWL7kosg712N3uh3ASdDxiDeq4=",
+      "dependencies": {
+        "define-property": {
+          "version": "0.2.5",
+          "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
+          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY="
+        },
+        "is-descriptor": {
+          "version": "0.1.6",
+          "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
+          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
+        },
+        "kind-of": {
+          "version": "5.0.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
+          "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
+        }
+      }
+    },
+    "to-regex-range": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-2.1.1.tgz",
+      "integrity": "sha1-fIDBe53+vlmeJzZ+DU3VWQFB2zg="
     },
     "tough-cookie": {
       "version": "2.3.2",
       "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.2.tgz",
       "integrity": "sha1-8IH3bkyFcg5sN6X6ztc3FQ2EByo="
     },
-    "tr46": {
-      "version": "0.0.3",
-      "resolved": "https://registry.npmjs.org/tr46/-/tr46-0.0.3.tgz",
-      "integrity": "sha1-gYT9NH2snNwYWZLzpmIuFLnZq2o="
-    },
     "trim-newlines": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/trim-newlines/-/trim-newlines-1.0.0.tgz",
       "integrity": "sha1-WIeWa7WCpFA6QetST301ARgVphM="
     },
-    "try-json-parse": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/try-json-parse/-/try-json-parse-0.1.1.tgz",
-      "integrity": "sha1-jbAWIuh35RuDFAyu58gIZK05DII="
-    },
-    "ts-loader": {
-      "version": "2.3.3",
-      "resolved": "https://registry.npmjs.org/ts-loader/-/ts-loader-2.3.3.tgz",
-      "integrity": "sha512-BX/BZF2BWr4wKrzw+sI3eam04cocz46HX/ERt2YZZYTgyOdUPlRnuVoukKaFIGyTE3vo5uYYGTCvKuKiUJUffg==",
-      "dependencies": {
-        "enhanced-resolve": {
-          "version": "3.4.1",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.4.1.tgz",
-          "integrity": "sha1-BCHjOf1xQZs9oT0Smzl5BAIwR24="
-        },
-        "loader-utils": {
-          "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
-          "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
-        },
-        "tapable": {
-          "version": "0.2.8",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.8.tgz",
-          "integrity": "sha1-mTcqXJmb8t8WCvwNdL7U9HlIzSI="
-        }
-      }
+    "trim-right": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/trim-right/-/trim-right-1.0.1.tgz",
+      "integrity": "sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM="
     },
     "tslib": {
       "version": "1.7.1",
@@ -11095,9 +8100,16 @@
       "integrity": "sha1-vIAEFkaRkjp5/oN4u+s9ogF1OOw="
     },
     "tslint": {
-      "version": "5.5.0",
-      "resolved": "https://registry.npmjs.org/tslint/-/tslint-5.5.0.tgz",
-      "integrity": "sha1-EOjas+MGH6YelELozuOYKs8gpqo="
+      "version": "5.7.0",
+      "resolved": "https://registry.npmjs.org/tslint/-/tslint-5.7.0.tgz",
+      "integrity": "sha1-wl4NDJL6EgHCvDDoROCOaCtPNVI=",
+      "dependencies": {
+        "semver": {
+          "version": "5.4.1",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
+          "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg=="
+        }
+      }
     },
     "tslint-microsoft-contrib": {
       "version": "5.0.1",
@@ -11116,15 +8128,10 @@
       "resolved": "https://registry.npmjs.org/tslint-react/-/tslint-react-3.2.0.tgz",
       "integrity": "sha1-hR+1BSAcY9A0PFFybmNk9+mtLpk="
     },
-    "tsscmp": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/tsscmp/-/tsscmp-1.0.5.tgz",
-      "integrity": "sha1-fcSjOvcVgatDN9qR2FylQn69mpc="
-    },
     "tsutils": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.8.0.tgz",
-      "integrity": "sha1-AWAXNymzvxOGKN0UoVN+AIUdgUo="
+      "version": "2.8.1",
+      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.8.1.tgz",
+      "integrity": "sha1-N3FATnyp8L7fXZGaR6SxiQpo7/8="
     },
     "tty-browserify": {
       "version": "0.0.0",
@@ -11148,9 +8155,9 @@
       "integrity": "sha1-WITKtRLPHTVeP7eE8wgEsrUg23I="
     },
     "type-detect": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-1.0.0.tgz",
-      "integrity": "sha1-diIXzAbbJY7EiQihKY6LlRIejqI="
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.0.3.tgz",
+      "integrity": "sha1-Dj8mcLRAmbC0bChNE2p+9Jx0wuo="
     },
     "type-is": {
       "version": "1.6.15",
@@ -11182,21 +8189,6 @@
           "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
           "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
         },
-        "cliui": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
-          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE="
-        },
-        "window-size": {
-          "version": "0.1.0",
-          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
-          "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
-        },
-        "wordwrap": {
-          "version": "0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
-          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
-        },
         "yargs": {
           "version": "3.10.0",
           "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
@@ -11207,49 +8199,23 @@
     "uglify-to-browserify": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/uglify-to-browserify/-/uglify-to-browserify-1.0.2.tgz",
-      "integrity": "sha1-bgkk1r2mta/jSeOabWMoUKD4grc="
+      "integrity": "sha1-bgkk1r2mta/jSeOabWMoUKD4grc=",
+      "optional": true
     },
     "uglifyjs-webpack-plugin": {
       "version": "0.4.6",
       "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-0.4.6.tgz",
-      "integrity": "sha1-uVH0q7a9YX5m9j64kUmOORdj4wk=",
-      "dependencies": {
-        "source-list-map": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-2.0.0.tgz",
-          "integrity": "sha512-I2UmuJSRr/T8jisiROLU3A3ltr+swpniSmNPI4Ml3ZCX6tVnDsuZzK7F2hl5jTqbZBWCEKlj5HRQiPExXLgE8A=="
-        },
-        "webpack-sources": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-1.0.1.tgz",
-          "integrity": "sha512-05tMxipUCwHqYaVS8xc7sYPTly8PzXayRCB4dTxLhWTqlKUiwH6ezmEe0OSreL1c30LAuA3Zqmc+uEBUGFJDjw=="
-        }
-      }
-    },
-    "uid-safe": {
-      "version": "2.1.4",
-      "resolved": "https://registry.npmjs.org/uid-safe/-/uid-safe-2.1.4.tgz",
-      "integrity": "sha1-Otbzg2jG1MjHXsF2I/t5qh0HHYE="
+      "integrity": "sha1-uVH0q7a9YX5m9j64kUmOORdj4wk="
     },
     "ultron": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.0.2.tgz",
       "integrity": "sha1-rOEWq1V80Zc4ak6I9GhTeMiy5Po="
     },
-    "unc-path-regex": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/unc-path-regex/-/unc-path-regex-0.1.2.tgz",
-      "integrity": "sha1-5z3T17DXxe2G+6xrCufYxqadUPo="
-    },
-    "underscore": {
-      "version": "1.4.4",
-      "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.4.4.tgz",
-      "integrity": "sha1-YaajIBBiKvoHljvzJSA88SI51gQ="
-    },
-    "underscore.string": {
-      "version": "3.3.4",
-      "resolved": "https://registry.npmjs.org/underscore.string/-/underscore.string-3.3.4.tgz",
-      "integrity": "sha1-LCo/n4PmR2L9xF5s6sZRQoZCE9s="
+    "union-value": {
+      "version": "0.2.4",
+      "resolved": "https://registry.npmjs.org/union-value/-/union-value-0.2.4.tgz",
+      "integrity": "sha1-c3UVJ4ZnkFfns3qmdug0aPwCdPA="
     },
     "uniq": {
       "version": "1.0.1",
@@ -11266,47 +8232,25 @@
       "resolved": "https://registry.npmjs.org/uniqs/-/uniqs-2.0.0.tgz",
       "integrity": "sha1-/+3ks2slKQaW5uFl1KWe25mOawI="
     },
-    "unique-stream": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-1.0.0.tgz",
-      "integrity": "sha1-1ZpKdUJ0R9mqbJHnAmP40mpLEEs="
-    },
-    "unique-string": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/unique-string/-/unique-string-1.0.0.tgz",
-      "integrity": "sha1-nhBXzKhRq7kzmPizOuGHuZyuwRo="
-    },
     "unpipe": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz",
       "integrity": "sha1-sr9O6FFKrmFltIF4KdIbLvSZBOw="
     },
-    "unzip-response": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-2.0.1.tgz",
-      "integrity": "sha1-0vD3N9FrBhXnKmk17QQhRXLVb5c="
-    },
-    "update-notifier": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-2.2.0.tgz",
-      "integrity": "sha1-G1g3z5DAc22IYncytmHBOPht5y8=",
-      "dependencies": {
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
-        }
-      }
+    "unset-value": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/unset-value/-/unset-value-0.1.2.tgz",
+      "integrity": "sha1-UGgQuGfyfCpabpsEgzYx9t5Y0xA="
     },
-    "upper-case": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/upper-case/-/upper-case-1.1.3.tgz",
-      "integrity": "sha1-9rRQHC7EzdJrp4vnIilh3ndiFZg="
+    "urix": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/urix/-/urix-0.1.0.tgz",
+      "integrity": "sha1-2pN/emLiH+wf0Y1Js1wpNQZ6bHI="
     },
     "url": {
-      "version": "0.10.3",
-      "resolved": "https://registry.npmjs.org/url/-/url-0.10.3.tgz",
-      "integrity": "sha1-Ah5NnHcF8hu/N9A861h2dAJ3TGQ=",
+      "version": "0.11.0",
+      "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
+      "integrity": "sha1-ODjpfPxgUh63PFJajlW/3Z4uKPE=",
       "dependencies": {
         "punycode": {
           "version": "1.3.2",
@@ -11327,27 +8271,32 @@
         }
       }
     },
-    "url-parse-lax": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/url-parse-lax/-/url-parse-lax-1.0.0.tgz",
-      "integrity": "sha1-evjzA2Rem9eaJy56FKxovAYJ2nM="
-    },
-    "user-home": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/user-home/-/user-home-1.1.1.tgz",
-      "integrity": "sha1-K1viOjK2Onyd640PKNSFcko98ZA="
+    "use": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/use/-/use-2.0.2.tgz",
+      "integrity": "sha1-riig1y+TvyJCKhii43mZMRLeyOg=",
+      "dependencies": {
+        "define-property": {
+          "version": "0.2.5",
+          "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
+          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY="
+        },
+        "is-descriptor": {
+          "version": "0.1.6",
+          "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
+          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
+        },
+        "kind-of": {
+          "version": "5.0.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
+          "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
+        }
+      }
     },
     "useragent": {
       "version": "2.2.1",
       "resolved": "https://registry.npmjs.org/useragent/-/useragent-2.2.1.tgz",
-      "integrity": "sha1-z1k+9PLRdYdei7ZY6pLhik/QbY4=",
-      "dependencies": {
-        "lru-cache": {
-          "version": "2.2.4",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.2.4.tgz",
-          "integrity": "sha1-bGWGGb7PFAMdDQtZSxYELOTcBj0="
-        }
-      }
+      "integrity": "sha1-z1k+9PLRdYdei7ZY6pLhik/QbY4="
     },
     "util": {
       "version": "0.10.3",
@@ -11376,26 +8325,11 @@
       "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.1.0.tgz",
       "integrity": "sha512-DIWtzUkw04M4k3bf1IcpS2tngXEL26YUD2M0tMDUpnUrz2hgzUBlD55a4FjdLGPvfHxS6uluGWvaVEqgBcVa+g=="
     },
-    "v8flags": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/v8flags/-/v8flags-2.1.1.tgz",
-      "integrity": "sha1-qrGh+jDUX4jdMhFIh1rALAtV5bQ="
-    },
-    "vali-date": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/vali-date/-/vali-date-1.0.0.tgz",
-      "integrity": "sha1-G5BKWWCfsyjvB4E4Qgk09rhnCaY="
-    },
     "validate-npm-package-license": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.1.tgz",
       "integrity": "sha1-KAS6vnEq0zeUWaz74kdGqywwP7w="
     },
-    "validator": {
-      "version": "5.7.0",
-      "resolved": "https://registry.npmjs.org/validator/-/validator-5.7.0.tgz",
-      "integrity": "sha1-eoelgUa2laxIYHEUHAxJ1n2gXlw="
-    },
     "vary": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.1.tgz",
@@ -11418,80 +8352,6 @@
         }
       }
     },
-    "vhost": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/vhost/-/vhost-3.0.2.tgz",
-      "integrity": "sha1-L7HezUxGaqiLD5NBrzPcGv8keNU="
-    },
-    "vinyl": {
-      "version": "0.5.3",
-      "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.5.3.tgz",
-      "integrity": "sha1-sEVbOPxeDPMNQyUTLkYZcMIJHN4="
-    },
-    "vinyl-fs": {
-      "version": "0.3.14",
-      "resolved": "https://registry.npmjs.org/vinyl-fs/-/vinyl-fs-0.3.14.tgz",
-      "integrity": "sha1-mmhRzhysHBzqX+hsCTHWIMLPqeY=",
-      "dependencies": {
-        "clone": {
-          "version": "0.2.0",
-          "resolved": "https://registry.npmjs.org/clone/-/clone-0.2.0.tgz",
-          "integrity": "sha1-xhJqkK1Pctv1rNskPMN3JP6T/B8="
-        },
-        "graceful-fs": {
-          "version": "3.0.11",
-          "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-3.0.11.tgz",
-          "integrity": "sha1-dhPHeKGv6mLyXGMKCG1/Osu92Bg="
-        },
-        "readable-stream": {
-          "version": "1.0.34",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
-          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
-        },
-        "through2": {
-          "version": "0.6.5",
-          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
-          "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg="
-        },
-        "vinyl": {
-          "version": "0.4.6",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-0.4.6.tgz",
-          "integrity": "sha1-LzVsh6VQolVGHza76ypbqL94SEc="
-        }
-      }
-    },
-    "vinyl-ftp": {
-      "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/vinyl-ftp/-/vinyl-ftp-0.6.0.tgz",
-      "integrity": "sha1-L7Q+xNWKLkwGtAblac7ps6pd+Mo=",
-      "dependencies": {
-        "clone": {
-          "version": "2.1.1",
-          "resolved": "https://registry.npmjs.org/clone/-/clone-2.1.1.tgz",
-          "integrity": "sha1-0hfR6WERjjrJpLi7oyhVU79kfNs="
-        },
-        "clone-stats": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-1.0.0.tgz",
-          "integrity": "sha1-s3gt/4u1R04Yuba/D9/ngvh3doA="
-        },
-        "replace-ext": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-1.0.0.tgz",
-          "integrity": "sha1-3mMSg3P8v3w8z6TeWkgMRaZ5WOs="
-        },
-        "vinyl": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-2.1.0.tgz",
-          "integrity": "sha1-Ah+cLPlR1rk5lDyJ617lrdT9kkw="
-        }
-      }
-    },
-    "vinyl-sourcemaps-apply": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/vinyl-sourcemaps-apply/-/vinyl-sourcemaps-apply-0.2.1.tgz",
-      "integrity": "sha1-q2VJ1h0XLCsbh75cUI0jnI74dwU="
-    },
     "vm-browserify": {
       "version": "0.0.4",
       "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-0.0.4.tgz",
@@ -11503,14 +8363,14 @@
       "integrity": "sha1-wGavtYK7HLQSjWDqkjkulNXp2+w="
     },
     "watchpack": {
-      "version": "0.2.9",
-      "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-0.2.9.tgz",
-      "integrity": "sha1-Yuqkq15bo1/fwBgnVibjwPXj+ws=",
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.4.0.tgz",
+      "integrity": "sha1-ShRyvLuVK9Cpu0A2gB+VTfs5+qw=",
       "dependencies": {
         "async": {
-          "version": "0.9.2",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz",
-          "integrity": "sha1-rqdNXmHB+JlhO/ZL2mbUx48v0X0="
+          "version": "2.5.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
+          "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw=="
         }
       }
     },
@@ -11519,109 +8379,114 @@
       "resolved": "https://registry.npmjs.org/wbuf/-/wbuf-1.7.2.tgz",
       "integrity": "sha1-1pe5nx9ZUS3ydRvkJ2nBWAtYAf4="
     },
-    "webidl-conversions": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-3.0.1.tgz",
-      "integrity": "sha1-JFNCdeKnvGvnvIZhHMFq4KVlSHE="
-    },
     "webpack": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-2.2.1.tgz",
-      "integrity": "sha1-e7HXKuIIfdGkr1Jq/sFe7RfdpHU=",
+      "version": "3.5.5",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-3.5.5.tgz",
+      "integrity": "sha512-qeUx4nIbeLL53qqNTs3kObPBMkUVDrOjEfp/hTvMlx21qL2MsGNr8/tXCoX/lS12dLl9qtZaXv2qfBEctPScDg==",
       "dependencies": {
         "acorn": {
-          "version": "4.0.13",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
-          "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c="
+          "version": "5.1.1",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.1.1.tgz",
+          "integrity": "sha512-vOk6uEMctu0vQrvuSqFdJyqj1Q0S5VTDL79qtjo+DhRr+1mmaD+tluFSCZqhvi/JUhXSzoZN2BhtstaPEeE8cw=="
+        },
+        "ansi-regex": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg="
         },
         "async": {
           "version": "2.5.0",
           "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
           "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw=="
         },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz",
-          "integrity": "sha1-wguW2MYXdIqvHBYCF2DNJ/y4y3U="
+        "camelcase": {
+          "version": "4.1.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
+          "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
         },
-        "crypto-browserify": {
-          "version": "3.11.1",
-          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.1.tgz",
-          "integrity": "sha512-Na7ZlwCOqoaW5RwUK1WpXws2kv8mNhWdTlzob0UXulk6G9BDbyiJaGTYBIX61Ozn9l1EPPJpICZb4DaOpT9NlQ=="
+        "cliui": {
+          "version": "3.2.0",
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
+          "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0=",
+          "dependencies": {
+            "string-width": {
+              "version": "1.0.2",
+              "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
+              "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
+            }
+          }
         },
         "enhanced-resolve": {
           "version": "3.4.1",
           "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.4.1.tgz",
           "integrity": "sha1-BCHjOf1xQZs9oT0Smzl5BAIwR24="
         },
-        "https-browserify": {
-          "version": "0.0.1",
-          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz",
-          "integrity": "sha1-P5E2XKvmC3ftDruiS0VOPgnZWoI="
+        "find-up": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz",
+          "integrity": "sha1-RdG35QbHF93UgndaK3eSCjwMV6c="
         },
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+        "load-json-file": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
+          "integrity": "sha1-eUfkIUmvgNaWy/eXvKq8/h/inKg="
         },
-        "node-libs-browser": {
+        "os-locale": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-2.1.0.tgz",
+          "integrity": "sha512-3sslG3zJbEYcaC4YVAvDorjGxc7tv6KVATnLPZONiljsUncvihe9BQoVCEs0RZ1kmf4Hk9OBqlZfJZWI4GanKA=="
+        },
+        "path-type": {
           "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz",
-          "integrity": "sha1-o6WeyXAkmFtG6Vg3lkb5bEthZkY="
+          "resolved": "https://registry.npmjs.org/path-type/-/path-type-2.0.0.tgz",
+          "integrity": "sha1-8BLMuEFbcJb8LaoQVMPXI4lZTHM="
         },
-        "os-browserify": {
-          "version": "0.2.1",
-          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz",
-          "integrity": "sha1-Y/xMzuXS13Y9Jrv4YBB45sLgBE8="
+        "read-pkg": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-2.0.0.tgz",
+          "integrity": "sha1-jvHAYjxqbbDcZxPEv6xGMysjaPg="
         },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ==",
+        "read-pkg-up": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-2.0.0.tgz",
+          "integrity": "sha1-a3KoBImE4MQeeVEP1en6mbO1Sb4="
+        },
+        "string-width": {
+          "version": "2.1.1",
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
+          "integrity": "sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw==",
           "dependencies": {
-            "string_decoder": {
-              "version": "1.0.3",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-              "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
+            "is-fullwidth-code-point": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
+              "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8="
+            },
+            "strip-ansi": {
+              "version": "4.0.0",
+              "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+              "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8="
             }
           }
         },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz",
-          "integrity": "sha1-ZiZu5fm9uZQKTkUUyvtDu3Hlyds="
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
-        },
-        "tapable": {
-          "version": "0.2.8",
-          "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.8.tgz",
-          "integrity": "sha1-mTcqXJmb8t8WCvwNdL7U9HlIzSI="
+        "strip-bom": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
+          "integrity": "sha1-IzTBjpx1n3vdVv3vfprj1YjmjtM="
         },
-        "timers-browserify": {
-          "version": "2.0.4",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.4.tgz",
-          "integrity": "sha512-uZYhyU3EX8O7HQP+J9fTVYwsq90Vr68xPEFo7yrVImIxYvHgukBEgOB/SgGoorWVTzGM/3Z+wUNnboA4M8jWrg=="
+        "which-module": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.0.tgz",
+          "integrity": "sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho="
         },
-        "url": {
-          "version": "0.11.0",
-          "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
-          "integrity": "sha1-ODjpfPxgUh63PFJajlW/3Z4uKPE=",
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
-              "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
-            }
-          }
+        "yargs": {
+          "version": "8.0.2",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-8.0.2.tgz",
+          "integrity": "sha1-YpmpBVsc78lp/355wdkY3Osiw2A="
         },
-        "watchpack": {
-          "version": "1.4.0",
-          "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.4.0.tgz",
-          "integrity": "sha1-ShRyvLuVK9Cpu0A2gB+VTfs5+qw="
+        "yargs-parser": {
+          "version": "7.0.0",
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-7.0.0.tgz",
+          "integrity": "sha1-jQrELxbqVd69MyyvTEA4s+P139k="
         }
       }
     },
@@ -11635,60 +8500,25 @@
           "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.1.1.tgz",
           "integrity": "sha512-vOk6uEMctu0vQrvuSqFdJyqj1Q0S5VTDL79qtjo+DhRr+1mmaD+tluFSCZqhvi/JUhXSzoZN2BhtstaPEeE8cw=="
         },
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
         },
-        "debug": {
-          "version": "2.6.8",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
-          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
-        },
-        "etag": {
-          "version": "1.8.0",
-          "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.0.tgz",
-          "integrity": "sha1-b2Ma7zNtbEY2K1F2QETOIWvjwFE="
-        },
-        "express": {
-          "version": "4.15.4",
-          "resolved": "https://registry.npmjs.org/express/-/express-4.15.4.tgz",
-          "integrity": "sha1-Ay4iU0ic+PzgJma+yj0R7XotrtE="
-        },
-        "fresh": {
-          "version": "0.5.0",
-          "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.0.tgz",
-          "integrity": "sha1-9HTKXmqSRtb9jglTz6m5yAWvp44="
-        },
-        "lodash": {
-          "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
-        },
-        "mime": {
-          "version": "1.3.4",
-          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz",
-          "integrity": "sha1-EV+eO2s9rylZmDyzjxSaLUDrXVM="
-        },
-        "qs": {
-          "version": "6.5.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-6.5.0.tgz",
-          "integrity": "sha512-fjVFjW9yhqMhVGwRExCXLhJKrLlkYSaxNWdyc9rmHlrVZbk35YHH312dFd7191uQeXkI3mKLZTIbSvIeFwFemg=="
-        },
         "safe-buffer": {
           "version": "5.0.1",
           "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
           "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
         },
-        "send": {
-          "version": "0.15.4",
-          "resolved": "https://registry.npmjs.org/send/-/send-0.15.4.tgz",
-          "integrity": "sha1-mF+qPihLAnPHkzZKNcZze9k5Bbk="
-        },
-        "serve-static": {
-          "version": "1.12.4",
-          "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.12.4.tgz",
-          "integrity": "sha1-m2qpjutyU8Tu3Ewfb9vKYJkBqWE="
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
         },
         "ultron": {
           "version": "1.1.0",
@@ -11702,56 +8532,20 @@
         }
       }
     },
-    "webpack-core": {
-      "version": "0.6.9",
-      "resolved": "https://registry.npmjs.org/webpack-core/-/webpack-core-0.6.9.tgz",
-      "integrity": "sha1-/FcViMhVjad76e+23r3Fo7FyvcI=",
-      "dependencies": {
-        "source-map": {
-          "version": "0.4.4",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
-          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s="
-        }
-      }
-    },
     "webpack-dev-middleware": {
       "version": "1.12.0",
       "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-1.12.0.tgz",
-      "integrity": "sha1-007++y7dp+HTtdvgcolRMhllFwk=",
-      "dependencies": {
-        "time-stamp": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/time-stamp/-/time-stamp-2.0.0.tgz",
-          "integrity": "sha1-lcakRTDhW6jW9KPsuMOj+sRto1c="
-        }
-      }
+      "integrity": "sha1-007++y7dp+HTtdvgcolRMhllFwk="
     },
     "webpack-dev-server": {
       "version": "2.7.1",
       "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.7.1.tgz",
       "integrity": "sha1-IVgPWgjNBlxxFEz29hw0W8pZqLg=",
       "dependencies": {
-        "del": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/del/-/del-3.0.0.tgz",
-          "integrity": "sha1-U+z2mf/LyzljdpGrE7rxYIGXZuU="
-        },
-        "globby": {
-          "version": "6.1.0",
-          "resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
-          "integrity": "sha1-9abXDoOV4hyFj7BInWTfAkJNUGw=",
-          "dependencies": {
-            "pify": {
-              "version": "2.3.0",
-              "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
-              "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
-            }
-          }
-        },
-        "pify": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
-          "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY="
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -11768,177 +8562,12 @@
     "webpack-notifier": {
       "version": "1.5.0",
       "resolved": "https://registry.npmjs.org/webpack-notifier/-/webpack-notifier-1.5.0.tgz",
-      "integrity": "sha1-wBAAfUSM68NN78mezyiPpejGuvY=",
-      "dependencies": {
-        "lodash._baseclone": {
-          "version": "3.3.0",
-          "resolved": "https://registry.npmjs.org/lodash._baseclone/-/lodash._baseclone-3.3.0.tgz",
-          "integrity": "sha1-MDUZv2OT/n5C802LYw73eU41Qrc="
-        },
-        "lodash.clonedeep": {
-          "version": "3.0.2",
-          "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-3.0.2.tgz",
-          "integrity": "sha1-oKHkDYKl6on/WxR7hETtY9koJ9s="
-        },
-        "node-notifier": {
-          "version": "4.6.1",
-          "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-4.6.1.tgz",
-          "integrity": "sha1-BW0UJE89zBzq3+aK+c/wxUc6M/M="
-        }
-      }
+      "integrity": "sha1-wBAAfUSM68NN78mezyiPpejGuvY="
     },
     "webpack-sources": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-0.1.5.tgz",
-      "integrity": "sha1-qh86vw8NdNtxEcQOUAuE+WZkB1A="
-    },
-    "webpack-split-by-path": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/webpack-split-by-path/-/webpack-split-by-path-2.0.0.tgz",
-      "integrity": "sha1-K2p1MB82lfc9h4jZkMTwxxVn4rA="
-    },
-    "webpack-stream": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/webpack-stream/-/webpack-stream-3.2.0.tgz",
-      "integrity": "sha1-Oh0WD7EdQXJ7fObzL3IkZPmLIYY=",
-      "dependencies": {
-        "browserify-aes": {
-          "version": "0.4.0",
-          "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-0.4.0.tgz",
-          "integrity": "sha1-BnFJtmjfMcS1hTPgLQHoBthgjiw="
-        },
-        "camelcase": {
-          "version": "1.2.1",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
-          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
-        },
-        "cliui": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
-          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE="
-        },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz",
-          "integrity": "sha1-wguW2MYXdIqvHBYCF2DNJ/y4y3U="
-        },
-        "crypto-browserify": {
-          "version": "3.3.0",
-          "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.3.0.tgz",
-          "integrity": "sha1-ufx1u0oO1h3PHNXa6W6zDJw+UGw="
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz",
-          "integrity": "sha1-P5E2XKvmC3ftDruiS0VOPgnZWoI="
-        },
-        "interpret": {
-          "version": "0.6.6",
-          "resolved": "https://registry.npmjs.org/interpret/-/interpret-0.6.6.tgz",
-          "integrity": "sha1-/s16GOfOXKar+5U+H4YhOknxYls="
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
-        },
-        "memory-fs": {
-          "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.3.0.tgz",
-          "integrity": "sha1-e8xrYp46Q+hx1+Kaymrop/FcuyA="
-        },
-        "node-libs-browser": {
-          "version": "0.7.0",
-          "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-0.7.0.tgz",
-          "integrity": "sha1-PicsCBnjCJNeJmdECNevDhSRuDs=",
-          "dependencies": {
-            "string_decoder": {
-              "version": "0.10.31",
-              "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
-              "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
-            }
-          }
-        },
-        "os-browserify": {
-          "version": "0.2.1",
-          "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz",
-          "integrity": "sha1-Y/xMzuXS13Y9Jrv4YBB45sLgBE8="
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-          "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
-        },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz",
-          "integrity": "sha1-ZiZu5fm9uZQKTkUUyvtDu3Hlyds="
-        },
-        "string_decoder": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-          "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
-        },
-        "timers-browserify": {
-          "version": "2.0.4",
-          "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.4.tgz",
-          "integrity": "sha512-uZYhyU3EX8O7HQP+J9fTVYwsq90Vr68xPEFo7yrVImIxYvHgukBEgOB/SgGoorWVTzGM/3Z+wUNnboA4M8jWrg=="
-        },
-        "uglify-js": {
-          "version": "2.7.5",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.7.5.tgz",
-          "integrity": "sha1-RhLAx7qu4rp8SH3kkErhIgefLKg=",
-          "dependencies": {
-            "async": {
-              "version": "0.2.10",
-              "resolved": "https://registry.npmjs.org/async/-/async-0.2.10.tgz",
-              "integrity": "sha1-trvgsGdLnXGXCMo43owjfLUmw9E="
-            }
-          }
-        },
-        "url": {
-          "version": "0.11.0",
-          "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
-          "integrity": "sha1-ODjpfPxgUh63PFJajlW/3Z4uKPE=",
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
-              "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
-            }
-          }
-        },
-        "vinyl": {
-          "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz",
-          "integrity": "sha1-XIgDbPVl5d8FVYv8kR+GVt8hiIQ="
-        },
-        "webpack": {
-          "version": "1.15.0",
-          "resolved": "https://registry.npmjs.org/webpack/-/webpack-1.15.0.tgz",
-          "integrity": "sha1-T/MfU9sDM55VFkqdRo7gMklo/pg="
-        },
-        "window-size": {
-          "version": "0.1.0",
-          "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
-          "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
-        },
-        "wordwrap": {
-          "version": "0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
-          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
-        },
-        "yargs": {
-          "version": "3.10.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
-          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
-        }
-      }
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-1.0.1.tgz",
+      "integrity": "sha512-05tMxipUCwHqYaVS8xc7sYPTly8PzXayRCB4dTxLhWTqlKUiwH6ezmEe0OSreL1c30LAuA3Zqmc+uEBUGFJDjw=="
     },
     "websocket-driver": {
       "version": "0.6.5",
@@ -11951,14 +8580,9 @@
       "integrity": "sha1-domUmcGEtu91Q3fC27DNbLVdKec="
     },
     "whatwg-fetch": {
-      "version": "0.11.0",
-      "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-0.11.0.tgz",
-      "integrity": "sha1-RrHRjQqpmVWXHvGi9arFBq3SiBU="
-    },
-    "whatwg-url": {
-      "version": "4.7.1",
-      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-4.7.1.tgz",
-      "integrity": "sha1-303C4/JaY7H6WzLtbWwTlXfWkN4="
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-2.0.3.tgz",
+      "integrity": "sha1-nITsLc9oGH/wC8ZOEnS0QhduHIQ="
     },
     "whet.extend": {
       "version": "0.9.9",
@@ -11980,15 +8604,10 @@
       "resolved": "https://registry.npmjs.org/wide-align/-/wide-align-1.1.2.tgz",
       "integrity": "sha512-ijDLlyQ7s6x1JgCLur53osjm/UXUYD9+0PbYKrBsYisYXzCxN+HC3mYDNy/dWdmf3AwqwU3CXwDCvsNgGK1S0w=="
     },
-    "widest-line": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/widest-line/-/widest-line-1.0.0.tgz",
-      "integrity": "sha1-DAnIXCqUaD0Nfq+O4JfVZL8OEFw="
-    },
     "window-size": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.2.0.tgz",
-      "integrity": "sha1-tDFbtCFKPXBY6+7okuE/ok2YsHU="
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
+      "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
     },
     "wordwrap": {
       "version": "0.0.3",
@@ -12005,56 +8624,21 @@
       "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
       "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8="
     },
-    "write-file-atomic": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.3.0.tgz",
-      "integrity": "sha512-xuPeK4OdjWqtfi59ylvVL0Yn35SF3zgcAcv7rBPFHVaEapaDr4GdGgm3j7ckTwH9wHL7fGmgfAnb0+THrHb8tA=="
-    },
     "ws": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-1.1.4.tgz",
-      "integrity": "sha1-V/QNA2gy5fUFVmKjl8Tedu1mv2E="
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-1.1.2.tgz",
+      "integrity": "sha1-iiRPoFJAHgjJiGz0SoUYnh/UBn8="
     },
     "wtf-8": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/wtf-8/-/wtf-8-1.0.0.tgz",
       "integrity": "sha1-OS2LotDxw00e4tYw8V0O+2jhBIo="
     },
-    "xdg-basedir": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-3.0.0.tgz",
-      "integrity": "sha1-SWsswQnsqNus/i3HK2A8F8WHCtQ="
-    },
-    "xml": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/xml/-/xml-1.0.1.tgz",
-      "integrity": "sha1-eLpyAgApxbyHuKgaPPzXS0ovweU="
-    },
-    "xml-char-classes": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/xml-char-classes/-/xml-char-classes-1.0.0.tgz",
-      "integrity": "sha1-ZGV4SKIP/F31g6Qq2KJ3tFErvE0="
-    },
-    "xml2js": {
-      "version": "0.2.7",
-      "resolved": "https://registry.npmjs.org/xml2js/-/xml2js-0.2.7.tgz",
-      "integrity": "sha1-GDhRi7AXQcrgh4urSRXklMMjBq8="
-    },
-    "xmlbuilder": {
-      "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/xmlbuilder/-/xmlbuilder-0.4.3.tgz",
-      "integrity": "sha1-xGFLp04K0ZbmCcknLNnh3bKKilg="
-    },
     "xmlhttprequest-ssl": {
       "version": "1.5.3",
       "resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-1.5.3.tgz",
       "integrity": "sha1-GFqIjATspGw+QHDZn3tJ3jUomS0="
     },
-    "xregexp": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/xregexp/-/xregexp-2.0.0.tgz",
-      "integrity": "sha1-UqY+VsoLhKfzpfPWGHLxJq16WUM="
-    },
     "xtend": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.1.tgz",
@@ -12080,6 +8664,11 @@
           "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
           "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
         },
+        "cliui": {
+          "version": "3.2.0",
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
+          "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
+        },
         "yargs-parser": {
           "version": "4.2.1",
           "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz",
@@ -12088,9 +8677,9 @@
       }
     },
     "yargs-parser": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-2.4.1.tgz",
-      "integrity": "sha1-hVaN488VD/SfpRgl8DqMiA3cxcQ=",
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-5.0.0.tgz",
+      "integrity": "sha1-J17PDX/+Bcd+ZOfIbkzZS/DhIoo=",
       "dependencies": {
         "camelcase": {
           "version": "3.0.0",
@@ -12108,11 +8697,6 @@
       "version": "0.1.2",
       "resolved": "https://registry.npmjs.org/yeast/-/yeast-0.1.2.tgz",
       "integrity": "sha1-AI4G2AlDIMNy28L47XagymyKxBk="
-    },
-    "z-schema": {
-      "version": "3.17.0",
-      "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-3.17.0.tgz",
-      "integrity": "sha1-RCs4+denr3rke/z8NWhz6GFq0bc="
     }
   }
 }
\ No newline at end of file
diff --git a/common/config/rush/pinned-versions.json b/common/config/rush/pinned-versions.json
index fe43ebf76a1ad..3ceb125d414f5 100644
--- a/common/config/rush/pinned-versions.json
+++ b/common/config/rush/pinned-versions.json
@@ -2,12 +2,5 @@
   "react": "15.4.2",
   "react-addons-test-utils": "15.4.2",
   "react-dom": "15.4.2",
-  "enzyme": "2.7.0",
-  "webpack": "2.2.1",
-  "tslint": "5.5.0",
-  "tslint-microsoft-contrib": "5.0.1",
-  "karma-sinon-chai": "1.3.1",
-  "typescript": "2.4.2",
-  "sinon-chai": "2.10.0",
-  "sinon": "2.3.2"
+  "enzyme": "2.7.0"
 }
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index baa2d58b9129d..016aac0c72539 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -11,11 +11,10 @@
   "license": "MIT",
   "scripts": {
     "build": "node ../../scripts/build.js",
-    "clean": "gulp clean",
-    "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.serve.config.js --open"
+    "clean": "node ../../scripts/clean.js",
+    "start": "node ../../scripts/start.js"
   },
   "devDependencies": {
-    "@microsoft/web-library-build": "^3.2.1",
     "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.0",
     "@types/es6-promise": "0.0.32",
@@ -25,22 +24,12 @@
     "@types/react-addons-test-utils": "0.14.18",
     "@types/react-dom": "15.5.1",
     "@types/webpack-env": "1.13.0",
-    "css-loader": "^0.28.0",
     "enzyme": "^2.7.0",
     "es6-promise": "^4.1.0",
-    "gulp": "~3.9.1",
-    "mocha": "^3.3.0",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
-    "react-dom": "^15.4.2",
-    "sass-loader": "^6.0.3",
-    "style-loader": "^0.17.0",
-    "source-map-loader": "^0.2.1",
-    "ts-loader": "^2.1.0",
-    "typescript": "2.4.2",
-    "webpack-dev-server": "^2.4.1",
-    "webpack": "^3.4.1"
+    "react-dom": "^15.4.2"
   },
   "peerDependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
@@ -52,6 +41,6 @@
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.4.0 <5.0.0",
-    "tslib": "^1.6.0"
+    "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/example-app-base/tsconfig.json b/packages/example-app-base/tsconfig.json
index 77bb1c4318a09..80e659ee5b76e 100644
--- a/packages/example-app-base/tsconfig.json
+++ b/packages/example-app-base/tsconfig.json
@@ -11,6 +11,7 @@
     "noImplicitAny": false,
     "strictNullChecks": true,
     "moduleResolution": "node",
+    "outDir": "lib",
     "lib": [
       "es2017",
       "dom"
@@ -21,10 +22,7 @@
       "webpack-env"
     ]
   },
-  "exclude": [
-    "node_modules",
-    "dist",
-    "lib",
-    "lib-amd"
+  "include": [
+    "src"
   ]
 }
\ No newline at end of file
diff --git a/packages/example-app-base/webpack.serve.config.js b/packages/example-app-base/webpack.serve.config.js
index b12eac3dd6649..c3d47b048a54f 100644
--- a/packages/example-app-base/webpack.serve.config.js
+++ b/packages/example-app-base/webpack.serve.config.js
@@ -1,6 +1,7 @@
 const path = require('path');
+const resources = require('../../scripts/tasks/webpack-resources');
 
-module.exports = {
+module.exports = resources.createServeConfig({
   entry: './src/index.demo.tsx',
 
   output: {
@@ -11,38 +12,5 @@ module.exports = {
   externals: {
     'react': 'React',
     'react-dom': 'ReactDOM'
-  },
-
-  resolve: {
-    extensions: ['.js', '.ts', '.tsx']
-  },
-
-  devtool: 'source-map',
-
-  devServer: {
-    inline: true,
-    port: 4322
-  },
-
-  module: {
-    loaders: [
-      {
-        test: /\.tsx?$/,
-        loader: 'ts-loader',
-        exclude: [
-          /node_modules/
-        ]
-      },
-      {
-        test: /\.scss$/,
-        use: [{
-          loader: "style-loader" // creates style nodes from JS strings
-        }, {
-          loader: "css-loader" // translates CSS into CommonJS
-        }, {
-          loader: "sass-loader" // compiles Sass to CSS
-        }]
-      }
-    ]
-  },
-}
+  }
+});
diff --git a/packages/experiments/karma.config.js b/packages/experiments/karma.config.js
index 6eb13997c250b..ed6389cbbf12b 100644
--- a/packages/experiments/karma.config.js
+++ b/packages/experiments/karma.config.js
@@ -4,12 +4,10 @@
 // Generated on Thu Oct 08 2015 18:13:05 GMT-0700 (PDT)
 
 let path = require('path');
-let build = require('@microsoft/web-library-build');
-let webpack = require('webpack');
-let buildConfig = build.getConfig();
-let configResources = build.karma.resources;
-let bindPolyfillPath = configResources.bindPolyfillPath;
+let resources = require('../../scripts/tasks/karma-resources');
+let bindPolyfillPath = resources.bindPolyfillPath;
 let debugRun = (process.argv.indexOf('--debug') > -1);
+let webpack = resources.webpack;
 
 module.exports = function (config) {
   let karmaConfig = {
@@ -23,7 +21,9 @@ module.exports = function (config) {
 
 
     // list of files / patterns to load in the browser
-    files: [bindPolyfillPath].concat([path.join(buildConfig.libFolder, 'common/tests.js')]),
+    files: resources.files.concat([
+      path.join('lib', 'common/tests.js')
+    ]),
 
     // list of files to exclude
     exclude: [],
@@ -41,20 +41,21 @@ module.exports = function (config) {
           debugRun ? {} : {
             test: /\.js/,
             exclude: /(test|node_modules|bower_components)/,
-            loader: configResources.istanbulInstrumenterLoaderPath,
+            loader: resources.istanbulInstrumenterLoaderPath,
             enforce: 'post'
           }
         ],
       },
       externals: {
         'cheerio': 'window',
-        'react/addons': true,
-        'react/lib/ExecutionEnvironment': true,
-        'react/lib/ReactContext': true
+        // 'react/addons': true,
+        // 'react/lib/ExecutionEnvironment': true,
+        // 'react/lib/ReactContext': true
       },
       resolve: {
         modules: [
-          buildConfig.libFolder,
+          path.resolve(__dirname, 'lib'),
+          path.resolve('../../scripts/node_modules'),
           'node_modules'
         ]
       },
@@ -72,10 +73,10 @@ module.exports = function (config) {
     // preprocess matching files before serving them to the browser
     // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
     preprocessors: {
-      [path.join(buildConfig.libFolder, '/**/*.js')]: ['webpack']
+      [path.join('lib', '/**/*.js')]: ['webpack']
     },
 
-    plugins: configResources.plugins.concat([
+    plugins: resources.plugins.concat([
     ]),
 
     // test results reporter to use
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index aef57fa5640dc..9c09e324e0111 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -11,11 +11,10 @@
   "license": "MIT",
   "scripts": {
     "build": "node ../../scripts/build.js",
-    "clean": "gulp clean",
-    "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.serve.config.js --open"
+    "clean": "node ../../scripts/clean.js",
+    "start": "node ../../scripts/start.js"
   },
   "devDependencies": {
-    "@microsoft/web-library-build": "^3.2.1",
     "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.0",
     "@types/es6-promise": "^0.0.32",
@@ -28,43 +27,23 @@
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
     "@uifabric/example-app-base": ">=4.2.4 <5.0.0",
-    "autoprefixer": "^6.7.6",
-    "chai": "^3.5.0",
-    "css-loader": "^0.28.0",
     "enzyme": "^2.7.0",
     "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
     "es6-map": "^0.1.5",
-    "git-rev": "0.2.1",
-    "gulp": "~3.9.1",
-    "gutil": "1.6.4",
     "highlight.js": "^9.6.0",
-    "load-themed-styles-loader": "^0.0.3",
-    "mocha": "^3.3.0",
-    "mocha-loader": "^1.1.1",
-    "node-sass": "^4.5.0",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
-    "postcss-loader": "^1.3.3",
-    "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
     "react-dom": "^15.4.2",
     "react-highlight": "0.9.0",
-    "sass-loader": "^6.0.3",
-    "sinon": "^2.3.2",
-    "source-map-loader": "^0.2.1",
-    "style-loader": "^0.17.0",
-    "ts-loader": "^2.0.1",
-    "typescript": "2.4.2",
-    "vinyl-ftp": "0.6.0",
-    "webpack": "^3.4.1",
-    "webpack-bundle-analyzer": "^2.2.1",
-    "webpack-dev-server": "^2.4.1",
-    "webpack-notifier": "^1.5.0"
+    "sinon": "^2.3.2"
   },
   "dependencies": {
-    "@microsoft/load-themed-styles": "^1.5.1",
-    "office-ui-fabric-react": ">=4.37.7 <5.0.0"
+    "@microsoft/load-themed-styles": "^1.7.2",
+    "@uifabric/utilities": ">=4.10.2 <5.0.0",
+    "office-ui-fabric-react": ">=4.37.7 <5.0.0",
+    "tslib": "^1.7.1"
   },
   "peerDependencies": {
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/packages/experiments/tsconfig.json b/packages/experiments/tsconfig.json
index 27c99b10fb390..9bb24edb7a532 100644
--- a/packages/experiments/tsconfig.json
+++ b/packages/experiments/tsconfig.json
@@ -1,6 +1,7 @@
 {
   "compilerOptions": {
     "baseUrl": ".",
+    "outDir": "dist",
     "target": "es5",
     "module": "commonjs",
     "jsx": "react",
@@ -31,4 +32,4 @@
   "include": [
     "src"
   ]
-}
+}
\ No newline at end of file
diff --git a/packages/experiments/webpack.config.js b/packages/experiments/webpack.config.js
index 2a5df0d6b187b..651d805482d27 100644
--- a/packages/experiments/webpack.config.js
+++ b/packages/experiments/webpack.config.js
@@ -1,5 +1,25 @@
-let configs = [
-  require('./webpack.lib.config')
-];
+const path = require('path');
+const resources = require('../../scripts/tasks/webpack-resources');
 
-module.exports = configs;
\ No newline at end of file
+const BUNDLE_NAME = 'experiments';
+const IS_PRODUCTION = process.argv.indexOf('--production') > -1;
+
+module.exports = resources.createConfig(
+  BUNDLE_NAME,
+  IS_PRODUCTION,
+  {
+    entry: {
+      [BUNDLE_NAME]: './lib/index.js'
+    },
+
+    output: {
+      libraryTarget: 'var',
+      library: 'Fabric'
+    },
+
+    externals: [
+      { 'react': 'React' },
+      { 'react-dom': 'ReactDOM' }
+    ]
+  }
+);
diff --git a/packages/experiments/webpack.lib.config.js b/packages/experiments/webpack.lib.config.js
deleted file mode 100644
index 3e959f22f78fb..0000000000000
--- a/packages/experiments/webpack.lib.config.js
+++ /dev/null
@@ -1,77 +0,0 @@
-'use strict';
-
-/** Note: this require may need to be fixed to point to the build that exports the gulp-core-build-webpack instance. */
-let build = require('@microsoft/web-library-build');
-let webpackTaskResources = build.webpack.resources;
-let webpack = webpackTaskResources.webpack;
-let path = require('path');
-let buildConfig = build.getConfig();
-let BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
-
-const BUNDLE_NAME = 'experiments';
-const BUNDLE_TEST = 'fabric-test';
-const IS_PRODUCTION = process.argv.indexOf('--production') > -1;
-
-// Create an array of configs, prepopulated with a debug (non-minified) build.
-let configs = [
-  createConfig(false)
-];
-
-// Create a production config if applicable.
-if (IS_PRODUCTION) {
-  configs.push(createConfig(true));
-}
-
-// Helper to create the config.
-function createConfig(isProduction) {
-  let webpackConfig = {
-
-    entry: {
-      [BUNDLE_NAME]: './lib/index.js'
-    },
-
-    output: {
-      libraryTarget: 'var',
-      library: 'Fabric',
-      path: path.join(__dirname, buildConfig.distFolder),
-      publicPath: '/dist/',
-      filename: `[name]${isProduction ? '.min' : ''}.js`
-    },
-
-    devtool: 'source-map',
-
-    externals: [
-      {
-        'react': 'React',
-      },
-      {
-        'react-dom': 'ReactDOM'
-      }
-    ],
-
-    plugins: [
-      new BundleAnalyzerPlugin({
-        analyzerMode: 'static',
-        reportFilename: BUNDLE_NAME + '.stats.html',
-        openAnalyzer: false
-      })
-    ]
-  };
-
-  if (isProduction) {
-    webpackConfig.plugins.push(
-      new webpack.DefinePlugin({
-        'process.env.NODE_ENV': JSON.stringify('production')
-      }),
-      new webpack.optimize.UglifyJsPlugin({
-        minimize: true,
-        compress: {
-          warnings: false
-        }
-      }));
-  }
-
-  return webpackConfig;
-}
-
-module.exports = configs;
\ No newline at end of file
diff --git a/packages/experiments/webpack.serve.config.js b/packages/experiments/webpack.serve.config.js
index 4af8bb2dfd4bd..5e1a6492ce696 100644
--- a/packages/experiments/webpack.serve.config.js
+++ b/packages/experiments/webpack.serve.config.js
@@ -1,10 +1,10 @@
-let path = require('path');
-let webpack = require('webpack');
-let WebpackNotifierPlugin = require('webpack-notifier');
+const path = require('path');
+const resources = require('../../scripts/tasks/webpack-resources');
+const webpack = resources.webpack;
 
 const PACKAGE_NAME = require('./package.json').name;
 
-module.exports = {
+module.exports = resources.createServeConfig({
   entry: './src/demo/index.tsx',
 
   output: {
@@ -22,69 +22,6 @@ module.exports = {
       'experiments/lib': path.join(__dirname, 'src'),
       'Props.ts.js': 'Props',
       'Example.tsx.js': 'Example'
-    },
-    extensions: ['.ts', '.tsx', '.js']
-  },
-
-  devtool: 'source-map',
-
-  devServer: {
-    inline: true,
-    port: 4321
-  },
-
-  module: {
-    loaders: [
-      {
-        test: [/\.tsx?$/],
-        loader: 'ts-loader',
-        exclude: [
-          /node_modules/,
-          /\.scss.ts$/
-        ]
-      },
-      {
-        test: /\.scss$/,
-        enforce: 'pre',
-        exclude: [
-          /node_modules/
-        ],
-        use: [
-          {
-            loader: "load-themed-styles-loader", // creates style nodes from JS strings
-          },
-          {
-            loader: "css-loader", // translates CSS into CommonJS
-            options: {
-              modules: true,
-              importLoaders: 2,
-              localIdentName: '[name]_[local]_[hash:base64:5]',
-              minimize: false
-            }
-          },
-          {
-            loader: 'postcss-loader',
-
-            options: {
-              plugins: function () {
-                return [
-                  require('autoprefixer')
-                ];
-              }
-            }
-          },
-          {
-            loader: "sass-loader",
-          }
-        ]
-      }
-    ]
-  },
-
-  plugins: [
-    new webpack.DefinePlugin({
-      'process.env.NODE_ENV': JSON.stringify('production')
-    }),
-    new WebpackNotifierPlugin()
-  ]
-}
+    }
+  }
+});
diff --git a/packages/merge-styles/karma.config.js b/packages/merge-styles/karma.config.js
index a706b978e8741..0dc91c71db96f 100644
--- a/packages/merge-styles/karma.config.js
+++ b/packages/merge-styles/karma.config.js
@@ -4,9 +4,7 @@
 // Generated on Thu Oct 08 2015 18:13:05 GMT-0700 (PDT)
 
 let path = require('path');
-let build = require('@microsoft/web-library-build');
-let buildConfig = build.getConfig();
-let configResources = build.karma.resources;
+let configResources = require('../../scripts/tasks/karma-resources');
 let bindPolyfillPath = configResources.bindPolyfillPath;
 let debugRun = (process.argv.indexOf('--debug') > -1);
 
@@ -22,7 +20,9 @@ module.exports = function (config) {
 
 
     // list of files / patterns to load in the browser
-    files: [bindPolyfillPath].concat([path.join(buildConfig.libFolder, '**', '*.test.js')]),
+    files: configResources.files.concat([
+      path.join('lib', '**', '*.test.js')
+    ]),
 
 
     // list of files to exclude
@@ -55,7 +55,7 @@ module.exports = function (config) {
       },
       resolve: {
         modules: [
-          buildConfig.libFolder,
+          'lib',
           'node_modules'
         ]
       }
@@ -68,7 +68,7 @@ module.exports = function (config) {
     // preprocess matching files before serving them to the browser
     // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
     preprocessors: {
-      [path.join(buildConfig.libFolder, '/**/*.js')]: ['webpack']
+      [path.join('lib', '/**/*.js')]: ['webpack']
     },
 
     plugins: configResources.plugins.concat([
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index b52161b7f62d0..a8399b8cd027f 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -11,11 +11,9 @@
   "license": "MIT",
   "scripts": {
     "build": "node ../../scripts/build.js",
-    "clean": "gulp clean",
-    "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js"
+    "clean": "node ../../scripts/clean.js"
   },
   "devDependencies": {
-    "@microsoft/web-library-build": "^3.2.1",
     "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.0",
     "@types/es6-promise": "^0.0.32",
@@ -29,18 +27,11 @@
     "@types/webpack-env": "1.13.0",
     "enzyme": "^2.7.0",
     "es6-map": "^0.1.5",
-    "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
-    "gulp": "~3.9.1",
-    "mocha": "^3.3.0",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
-    "react-dom": "^15.4.2",
-    "sinon": "^2.3.2",
-    "source-map-loader": "^0.2.1",
-    "typescript": "2.4.2",
-    "webpack-bundle-analyzer": "^2.2.1"
+    "react-dom": "^15.4.2"
   },
   "dependencies": {
     "tslib": "^1.7.1"
diff --git a/packages/merge-styles/src/transforms/kebabRules.test.ts b/packages/merge-styles/src/transforms/kebabRules.test.ts
index 7fe3d58730a82..1670d6ada3971 100644
--- a/packages/merge-styles/src/transforms/kebabRules.test.ts
+++ b/packages/merge-styles/src/transforms/kebabRules.test.ts
@@ -1,5 +1,6 @@
 import { kebabRules } from './kebabRules';
-import { expect } from 'chai';
+
+const { expect } = chai;
 
 describe('kebabRules', () => {
 
diff --git a/packages/merge-styles/src/transforms/prefixRules.test.ts b/packages/merge-styles/src/transforms/prefixRules.test.ts
index a6f99c41c7676..4f98cdea3d57e 100644
--- a/packages/merge-styles/src/transforms/prefixRules.test.ts
+++ b/packages/merge-styles/src/transforms/prefixRules.test.ts
@@ -1,6 +1,6 @@
 import { prefixRules } from './prefixRules';
 import { setVendorSettings } from '../getVendorSettings';
-import { expect } from 'chai';
+const { expect } = chai;
 
 const AUTO_TRANSLATED_RULES = [
   'user-select'
diff --git a/packages/merge-styles/src/transforms/provideUnits.test.ts b/packages/merge-styles/src/transforms/provideUnits.test.ts
index 0ef378d822e20..49f76a9922d6e 100644
--- a/packages/merge-styles/src/transforms/provideUnits.test.ts
+++ b/packages/merge-styles/src/transforms/provideUnits.test.ts
@@ -1,6 +1,6 @@
 import { provideUnits } from './provideUnits';
 
-import { expect } from 'chai';
+const { expect } = chai;
 
 describe('provideUnits', () => {
   it('can provide units', () => {
diff --git a/packages/merge-styles/tsconfig.json b/packages/merge-styles/tsconfig.json
index 4b43fb784f7e2..fd37bdf5317cb 100644
--- a/packages/merge-styles/tsconfig.json
+++ b/packages/merge-styles/tsconfig.json
@@ -1,6 +1,7 @@
 {
   "compilerOptions": {
     "target": "es5",
+    "outDir": "lib",
     "module": "commonjs",
     "lib": [
       "es2017",
@@ -20,12 +21,7 @@
       "webpack-env"
     ]
   },
-  "exclude": [
-    "api",
-    "temp",
-    "node_modules",
-    "dist",
-    "lib",
-    "lib-amd"
+  "include": [
+    "src"
   ]
 }
\ No newline at end of file
diff --git a/packages/merge-styles/webpack.config.js b/packages/merge-styles/webpack.config.js
index a85316c212134..837a9532ca54e 100644
--- a/packages/merge-styles/webpack.config.js
+++ b/packages/merge-styles/webpack.config.js
@@ -1,57 +1,20 @@
-'use strict';
-
-/** Note: this require may need to be fixed to point to the build that exports the gulp-core-build-webpack instance. */
-let build = require('@microsoft/web-library-build');
-let webpackTaskResources = build.webpack.resources;
-let webpack = webpackTaskResources.webpack;
-let path = require('path');
-let buildConfig = build.getConfig();
-let BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
+const path = require('path');
+const resources = require('../../scripts/tasks/webpack-resources');
+const webpack = resources.webpack;
 
 const BUNDLE_NAME = 'merge-styles';
 
-let webpackConfig = {
-
-  entry: {
-    [BUNDLE_NAME]: './lib/index.js'
-  },
-
-  output: {
-    libraryTarget: 'var',
-    library: 'MergeStyles',
-    path: path.join(__dirname, buildConfig.distFolder),
-    publicPath: '/dist/',
-    filename: `[name].min.js`
-  },
-
-  devtool: 'source-map',
-
-  externals: [
-    {
-      'tslib': {
-        commonjs: 'tslib',
-        amd: 'tslib'
-      }
+module.exports = resources.createConfig(
+  BUNDLE_NAME,
+  true,
+  {
+    entry: {
+      [BUNDLE_NAME]: './lib/index.js'
+    },
+
+    output: {
+      libraryTarget: 'var',
+      library: 'MergeStyles'
     }
-  ],
-
-  plugins: [
-    new BundleAnalyzerPlugin({
-      analyzerMode: 'static',
-      reportFilename: BUNDLE_NAME + '.stats.html',
-      openAnalyzer: false
-    }),
-    new webpack.DefinePlugin({
-      'process.env.NODE_ENV': JSON.stringify('production')
-    }),
-    new webpack.optimize.UglifyJsPlugin({
-      minimize: true,
-      compress: {
-        warnings: false
-      }
-    })
-  ]
-};
-
-
-module.exports = webpackConfig;
+  }
+);
diff --git a/packages/office-ui-fabric-react-tslint/package.json b/packages/office-ui-fabric-react-tslint/package.json
index 5fb9fef220a95..00662585a66af 100644
--- a/packages/office-ui-fabric-react-tslint/package.json
+++ b/packages/office-ui-fabric-react-tslint/package.json
@@ -8,7 +8,6 @@
     "build": "node -v"
   },
   "devDependencies": {
-    "@microsoft/gulp-core-build-typescript": "^3.3.1",
     "tslint-react": "^3.2.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-tslint/tslint.json b/packages/office-ui-fabric-react-tslint/tslint.json
index 003df4bc8c6a2..38265b4842de9 100644
--- a/packages/office-ui-fabric-react-tslint/tslint.json
+++ b/packages/office-ui-fabric-react-tslint/tslint.json
@@ -1,6 +1,5 @@
 {
   "extends": [
-    "@microsoft/gulp-core-build-typescript/lib/defaultTslint.json",
     "tslint-react"
   ],
   "rules": {
@@ -52,9 +51,6 @@
       "property-declaration",
       "member-variable-declaration"
     ],
-    "no-unused-expression": [
-      false
-    ],
     "prefer-const": false,
     "quotemark": [
       true,
@@ -73,7 +69,6 @@
     "whitespace": [
       false
     ],
-    "no-trailing-whitespace": false,
     "no-switch-case-fall-through": false,
     "variable-name": [
       true,
@@ -81,6 +76,101 @@
       "allow-leading-underscore",
       "allow-pascal-case",
       "ban-keywords"
-    ]
+    ],
+    "class-name": true,
+    "comment-format": [
+      true,
+      "check-space"
+    ],
+    "curly": true,
+    "eofline": false,
+    "forin": true,
+    "indent": [
+      true,
+      "spaces",
+      2
+    ],
+    "interface-name": [
+      true,
+      "always-prefix"
+    ],
+    "label-position": true,
+    "member-access": true,
+    "member-ordering": [
+      true,
+      {
+        "order": [
+          "public-static-field",
+          "protected-static-field",
+          "private-static-field",
+          "public-instance-field",
+          "protected-instance-field",
+          "private-instance-field",
+          "public-static-method",
+          "protected-static-method",
+          "private-static-method",
+          "public-constructor",
+          "public-instance-method",
+          "protected-constructor",
+          "protected-instance-method",
+          "private-constructor",
+          "private-instance-method"
+        ]
+      }
+    ],
+    "missing-optional-annotation": true,
+    "no-any": true,
+    "no-bitwise": true,
+    "no-consecutive-blank-lines": true,
+    "no-console": [
+      true,
+      "debug",
+      "info",
+      "time",
+      "timeEnd",
+      "trace"
+    ],
+    "no-constant-condition": true,
+    "no-construct": true,
+    "no-debugger": true,
+    "no-duplicate-case": true,
+    "no-duplicate-parameter-names": true,
+    "no-empty": true,
+    "no-eval": true,
+    "no-function-expression": true,
+    "no-internal-module": true,
+    "no-shadowed-variable": true,
+    "no-string-literal": true,
+    "no-trailing-whitespace": true,
+    "no-unnecessary-semicolons": true,
+    "no-unused-expression": false,
+    "no-unused-variable": true,
+    "no-use-before-declare": true,
+    "no-with-statement": true,
+    "no-var-keyword": true,
+    "object-literal-sort-keys": false,
+    "one-line": [
+      true,
+      "check-open-brace",
+      "check-catch",
+      "check-else",
+      "check-whitespace"
+    ],
+    "semicolon": [
+      true,
+      "always"
+    ],
+    "typedef-whitespace": [
+      true,
+      {
+        "call-signature": "nospace",
+        "index-signature": "nospace",
+        "parameter": "nospace",
+        "property-declaration": "nospace",
+        "variable-declaration": "nospace"
+      }
+    ],
+    "use-named-parameter": true,
+    "valid-typeof": true
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/gulpfile.js b/packages/office-ui-fabric-react/gulpfile.js
deleted file mode 100644
index 0a19a9842a919..0000000000000
--- a/packages/office-ui-fabric-react/gulpfile.js
+++ /dev/null
@@ -1,80 +0,0 @@
-'use strict';
-
-let build = require('@microsoft/web-library-build');
-let serial = build.serial;
-let parallel = build.parallel;
-let buildConfig = build.getConfig();
-let gulp = require('gulp');
-let configFile = "./ftpconfig.json";
-let fs = require('fs');
-let path = require('path');
-let del = require('del');
-let gulpConnect = require('gulp-connect');
-
-let isProduction = process.argv.indexOf('--production') >= 0;
-let isNuke = process.argv.indexOf('nuke') >= 0;
-let {
-  libFolder,
-  distFolder,
-  packageFolder = ''
-} = buildConfig;
-
-// let visualTestClean = build.subTask('visualTestClean', (gulp, options, done) => {
-//   return del(['visualtests/results/*png']).then(() => done());
-// });
-
-// let visualTest = build.subTask('visualtest', (gulp, options, done) => {
-//   gulpConnect.server({
-//     port: 43210,
-//     livereload: false,
-//     directoryListing: false
-//   });
-//   if (!options.args['debug']) {
-//     let matchFile = options.args['match'] || '';
-
-//     let casperJs = require('gulp-phantomcss');
-//     gulp.src(['lib/**/*' + matchFile + '.visualtest.js'])
-//       .pipe(casperJs(
-//         {
-//           screenshots: 'visualtests/baseline',
-//           comparisonResultRoot: 'visualtests/results'
-//         })).on('end', done);
-//   }
-// });
-
-
-// Always fail on test failures.
-build.karma.setConfig({
-  failBuildOnErrors: true
-});
-
-// Use css modules.
-build.sass.setConfig({
-  useCSSModules: true,
-  moduleExportName: ''
-});
-
-// Copy fabric-core to dist to be published with fabric-react.
-build.preCopy.setConfig({
-  shouldFlatten: false,
-  copyTo: {
-    [path.join(distFolder, 'sass')]: [
-      'node_modules/office-ui-fabric-core/dist/sass/**/*.*'
-    ],
-    [path.join(distFolder, 'css')]: [
-      'node_modules/office-ui-fabric-core/dist/css/**/*.*'
-    ]
-  }
-});
-
-// Short aliases for subtasks.
-build.task('webpack', build.webpack);
-build.task('tslint', build.tslint);
-build.task('ts', build.typescript);
-build.task('sass', build.serial(build.preCopy, build.sass));
-build.task('karma', build.karma);
-build.task('test', serial(build.sass, build.typescript, build.karma));
-// build.task('visualtest', serial(build.sass, build.typescript, build.webpack, visualTestClean, visualTest));
-
-// initialize tasks.
-build.initialize(gulp);
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/karma.config.js b/packages/office-ui-fabric-react/karma.config.js
index 6eb13997c250b..0345baa89db5e 100644
--- a/packages/office-ui-fabric-react/karma.config.js
+++ b/packages/office-ui-fabric-react/karma.config.js
@@ -4,12 +4,9 @@
 // Generated on Thu Oct 08 2015 18:13:05 GMT-0700 (PDT)
 
 let path = require('path');
-let build = require('@microsoft/web-library-build');
-let webpack = require('webpack');
-let buildConfig = build.getConfig();
-let configResources = build.karma.resources;
-let bindPolyfillPath = configResources.bindPolyfillPath;
+let resources = require('../../scripts/tasks/karma-resources');
 let debugRun = (process.argv.indexOf('--debug') > -1);
+let webpack = require('../../scripts/tasks/webpack-resources').webpack;
 
 module.exports = function (config) {
   let karmaConfig = {
@@ -23,7 +20,7 @@ module.exports = function (config) {
 
 
     // list of files / patterns to load in the browser
-    files: [bindPolyfillPath].concat([path.join(buildConfig.libFolder, 'common/tests.js')]),
+    files: resources.files.concat([path.join('lib', 'common/tests.js')]),
 
     // list of files to exclude
     exclude: [],
@@ -41,7 +38,7 @@ module.exports = function (config) {
           debugRun ? {} : {
             test: /\.js/,
             exclude: /(test|node_modules|bower_components)/,
-            loader: configResources.istanbulInstrumenterLoaderPath,
+            loader: resources.istanbulInstrumenterLoaderPath,
             enforce: 'post'
           }
         ],
@@ -54,7 +51,8 @@ module.exports = function (config) {
       },
       resolve: {
         modules: [
-          buildConfig.libFolder,
+          path.resolve(__dirname, 'lib'),
+          path.resolve('../../scripts/node_modules'),
           'node_modules'
         ]
       },
@@ -72,10 +70,10 @@ module.exports = function (config) {
     // preprocess matching files before serving them to the browser
     // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
     preprocessors: {
-      [path.join(buildConfig.libFolder, '/**/*.js')]: ['webpack']
+      [path.join('lib', '/**/*.js')]: ['webpack']
     },
 
-    plugins: configResources.plugins.concat([
+    plugins: resources.plugins.concat([
     ]),
 
     // test results reporter to use
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 18bc2c2196b60..6c8dc38a672ff 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -11,12 +11,10 @@
   "license": "MIT",
   "scripts": {
     "build": "node ../../scripts/build.js",
-    "clean": "gulp clean",
-    "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.serve.config.js --open"
+    "clean": "node ../../scripts/clean.js",
+    "start": "node ../../scripts/start.js"
   },
   "devDependencies": {
-    "@microsoft/load-themed-styles": "^1.5.1",
-    "@microsoft/web-library-build": "^3.2.1",
     "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.0",
     "@types/es6-promise": "^0.0.32",
@@ -29,51 +27,26 @@
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
     "@uifabric/example-app-base": ">=4.2.4 <5.0.0",
-    "autoprefixer": "^6.7.6",
-    "chai": "^3.5.0",
-    "css-loader": "^0.28.0",
     "enzyme": "^2.7.0",
     "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
     "es6-map": "^0.1.5",
-    "git-rev": "0.2.1",
-    "gulp": "~3.9.1",
-    "gulp-phantomcss": "~0.3.0",
-    "gulp-prompt": "^0.2.0",
-    "gulp-util": "3.0.8",
-    "gutil": "1.6.4",
     "highlight.js": "^9.6.0",
-    "load-themed-styles-loader": "^0.0.3",
-    "mocha": "^3.3.0",
-    "mocha-loader": "^1.1.1",
-    "node-sass": "^4.5.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
-    "postcss-loader": "^1.3.3",
-    "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
     "react-dom": "^15.4.2",
     "react-highlight": "0.9.0",
     "resemblejs": "~2.2.3",
-    "sass-loader": "^6.0.3",
-    "sinon": "^2.3.2",
-    "source-map-loader": "^0.2.1",
-    "style-loader": "^0.17.0",
-    "ts-loader": "^2.0.1",
-    "vinyl-ftp": "0.6.0",
-    "webpack": "^3.4.1",
-    "webpack-bundle-analyzer": "^2.2.1",
-    "webpack-dev-server": "^2.4.1",
-    "webpack-notifier": "^1.5.0",
-    "webpack-split-by-path": "2.0.0"
+    "sinon": "^2.3.2"
   },
   "dependencies": {
-    "@microsoft/load-themed-styles": "^1.5.1",
+    "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/utilities": ">=4.11.1 <5.0.0",
     "@uifabric/styling": ">=0.21.1 <1.0.0",
     "prop-types": "^15.5.10",
-    "tslib": "^1.6.0"
+    "tslib": "^1.7.1"
   },
   "peerDependencies": {
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
index 0378ac0d0b587..d2e05ede55012 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
@@ -188,12 +188,12 @@ export interface IDetailsListProps extends React.Props<DetailsList>, IWithViewpo
   compact?: boolean;
 
   /**
-  * Boolean value to enable render page caching. This is an experimental performance optimization 
+  * Boolean value to enable render page caching. This is an experimental performance optimization
   * that is off by default.
   * @defaultValue false
   */
   usePageCache?: boolean;
-  
+
   /**
    * Optional callback to determine whether the list should be rendered in full, or virtualized.
    * Virtualization will add and remove pages of items as the user scrolls them into the visible range.
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
index e0e1712c6cd98..85e97e519a075 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
@@ -5,14 +5,13 @@ import * as ReactTestUtils from 'react-addons-test-utils';
 /* tslint:enable:no-unused-variable */
 import { mount, shallow } from 'enzyme';
 import { setRTL } from '../../Utilities';
-import * as chai from 'chai';
-let { expect } = chai;
-
 import { Facepile } from './Facepile';
 import { IFacepilePersona, OverflowButtonType } from './Facepile.Props';
 import { Persona, PersonaSize } from '../Persona';
 import { TestImages } from '../../common/TestImages';
 
+const { expect } = chai;
+
 describe('Facepile', () => {
   const facepilePersonas: IFacepilePersona[] = [
     {
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
index 5bc8c6d1b3ae7..4567873af1d46 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
@@ -9,7 +9,7 @@ import { KeyCodes } from '../../Utilities';
 import { FocusZone } from './FocusZone';
 import { FocusZoneDirection } from './FocusZone.Props';
 
-import { assert } from 'chai';
+const { assert } = chai;
 
 describe('FocusZone', () => {
   let lastFocusedElement: HTMLElement | undefined;
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts
index e69f360a2ed56..40ac3c1d8f6e4 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts
@@ -86,12 +86,12 @@ export interface IGroupedListProps extends React.Props<GroupedList> {
   /** Optional callback when the group expand state changes between all collapsed and at least one group is expanded. */
   onGroupExpandStateChanged?: (isSomeGroupExpanded: boolean) => void;
 
-  /** 
-   * boolean to control if pages containing unchanged items should be cached, this is a perf optimization 
+  /**
+   * boolean to control if pages containing unchanged items should be cached, this is a perf optimization
    * The same property in List.Props
    */
   usePageCache?: boolean;
-  
+
   /**
    * Optional callback to determine whether the list should be rendered in full, or virtualized.
    * Virtualization will add and remove pages of items as the user scrolls them into the visible range.
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.test.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.test.tsx
index 5549df033dacd..090e2162578d3 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { shallow } from 'enzyme';
-import { expect } from 'chai';
+const { expect } = chai;
 import { OverflowSet } from './OverflowSet';
 import * as sinon from 'sinon';
 
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
index e444dbf0cad6b..ed03c2dfaf5ba 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
@@ -244,12 +244,12 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
 
   @autobind
   private _onRenderBody(props: IPanelProps): JSX.Element {
-    const contentClass = css( 
-      'ms-Panel-content', 
-      styles.content, 
-      props.isFooterAtBottom && styles.contentGrow 
+    const contentClass = css(
+      'ms-Panel-content',
+      styles.content,
+      props.isFooterAtBottom && styles.contentGrow
     );
-    
+
     return (
       <div ref={ this._resolveRef('_content') } className={ contentClass } >
         { props.children }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
index 9ace8710fdb59..1c0d6976e23b8 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
@@ -4,7 +4,6 @@ import { setRTL } from '../../Utilities';
 import { Persona } from './Persona';
 import { PersonaInitialsColor } from './Persona.Props';
 import { shallow, ShallowWrapper } from 'enzyme';
-import * as chai from 'chai';
 import * as stylesImport from './Persona.scss';
 const styles: any = stylesImport;
 
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
index b8d42ae913f59..26fc8c4ac144d 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import { shallow } from 'enzyme';
-import { expect } from 'chai';
+const { expect } = chai;
 import { ResizeGroup, IResizeGroupState, getNextResizeGroupStateProvider, getMeasurementCache } from './ResizeGroup';
 import { IResizeGroupProps } from './ResizeGroup.Props';
 import * as sinon from 'sinon';
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index c7177136030ae..d03f35c821c86 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -227,7 +227,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
    * Gets the selection start of the text field
    */
   public get selectionStart(): number {
-    return this._textElement ? this._textElement.selectionStart : -1;    
+    return this._textElement ? this._textElement.selectionStart : -1;
   }
 
   /**
diff --git a/packages/office-ui-fabric-react/tsconfig.json b/packages/office-ui-fabric-react/tsconfig.json
index 1f1c998e76fe6..48de7717292e6 100644
--- a/packages/office-ui-fabric-react/tsconfig.json
+++ b/packages/office-ui-fabric-react/tsconfig.json
@@ -1,6 +1,7 @@
 {
   "compilerOptions": {
     "baseUrl": ".",
+    "outDir": "lib",
     "target": "es5",
     "module": "commonjs",
     "jsx": "react",
@@ -27,10 +28,7 @@
       ]
     }
   },
-  "exclude": [
-    "node_modules",
-    "dist",
-    "lib",
-    "lib-amd"
+  "include": [
+    "src"
   ]
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/webpack.config.js b/packages/office-ui-fabric-react/webpack.config.js
index 8da3d58b8f788..e05525ba5c174 100644
--- a/packages/office-ui-fabric-react/webpack.config.js
+++ b/packages/office-ui-fabric-react/webpack.config.js
@@ -1,46 +1,22 @@
-'use strict';
-
-/** Note: this require may need to be fixed to point to the build that exports the gulp-core-build-webpack instance. */
-let build = require('@microsoft/web-library-build');
-let webpackTaskResources = build.webpack.resources;
-let webpack = webpackTaskResources.webpack;
 let path = require('path');
-let buildConfig = build.getConfig();
-let BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
+const resources = require('../../scripts/tasks/webpack-resources');
 
 const BUNDLE_NAME = 'office-ui-fabric-react';
-const BUNDLE_TEST = 'fabric-test';
 const IS_PRODUCTION = process.argv.indexOf('--production') > -1;
 
-// Create an array of configs, prepopulated with a debug (non-minified) build.
-let configs = [
-  createConfig(false)
-];
-
-// Create a production config if applicable.
-if (IS_PRODUCTION) {
-  configs.push(createConfig(true));
-}
-
-// Helper to create the config.
-function createConfig(isProduction) {
-  let webpackConfig = {
-
+module.exports = resources.createConfig(
+  BUNDLE_NAME,
+  IS_PRODUCTION,
+  {
     entry: {
-      [BUNDLE_TEST]: './lib/VisualTestRoot.js',
       [BUNDLE_NAME]: './lib/index.js'
     },
 
     output: {
       libraryTarget: 'var',
-      library: 'Fabric',
-      path: path.join(__dirname, buildConfig.distFolder),
-      publicPath: '/dist/',
-      filename: `[name]${isProduction ? '.min' : ''}.js`
+      library: 'Fabric'
     },
 
-    devtool: 'source-map',
-
     externals: [
       {
         'react': 'React',
@@ -48,31 +24,6 @@ function createConfig(isProduction) {
       {
         'react-dom': 'ReactDOM'
       }
-    ],
-
-    plugins: [
-      new BundleAnalyzerPlugin({
-        analyzerMode: 'static',
-        reportFilename: BUNDLE_NAME + '.stats.html',
-        openAnalyzer: false
-      })
     ]
-  };
-
-  if (isProduction) {
-    webpackConfig.plugins.push(
-      new webpack.DefinePlugin({
-        'process.env.NODE_ENV': JSON.stringify('production')
-      }),
-      new webpack.optimize.UglifyJsPlugin({
-        minimize: true,
-        compress: {
-          warnings: false
-        }
-      }));
   }
-
-  return webpackConfig;
-}
-
-module.exports = configs;
\ No newline at end of file
+);
diff --git a/packages/office-ui-fabric-react/webpack.serve.config.js b/packages/office-ui-fabric-react/webpack.serve.config.js
index 9d2f49739be82..9031ba5bfe918 100644
--- a/packages/office-ui-fabric-react/webpack.serve.config.js
+++ b/packages/office-ui-fabric-react/webpack.serve.config.js
@@ -1,14 +1,11 @@
 let path = require('path');
-let webpack = require('webpack');
-let WebpackNotifierPlugin = require('webpack-notifier');
+let resources = require('../../scripts/tasks/webpack-resources');
 
-const PACKAGE_NAME = require('./package.json').name;
-
-module.exports = {
+module.exports = resources.createServeConfig({
   entry: './src/demo/index.tsx',
 
   output: {
-    filename: 'demo-app.js',
+    filename: 'demo-app.js'
   },
 
   externals: {
@@ -22,69 +19,6 @@ module.exports = {
       'office-ui-fabric-react/lib': path.join(__dirname, 'src'),
       'Props.ts.js': 'Props',
       'Example.tsx.js': 'Example'
-    },
-    extensions: ['.ts', '.tsx', '.js']
-  },
-
-  devtool: 'source-map',
-
-  devServer: {
-    inline: true,
-    port: 4321
-  },
-
-  module: {
-    loaders: [
-      {
-        test: [/\.tsx?$/],
-        loader: 'ts-loader',
-        exclude: [
-          /node_modules/,
-          /\.scss.ts$/
-        ]
-      },
-      {
-        test: /\.scss$/,
-        enforce: 'pre',
-        exclude: [
-          /node_modules/
-        ],
-        use: [
-          {
-            loader: "load-themed-styles-loader", // creates style nodes from JS strings
-          },
-          {
-            loader: "css-loader", // translates CSS into CommonJS
-            options: {
-              modules: true,
-              importLoaders: 2,
-              localIdentName: '[name]_[local]_[hash:base64:5]',
-              minimize: false
-            }
-          },
-          {
-            loader: 'postcss-loader',
-
-            options: {
-              plugins: function () {
-                return [
-                  require('autoprefixer')
-                ];
-              }
-            }
-          },
-          {
-            loader: "sass-loader",
-          }
-        ]
-      }
-    ]
-  },
-
-  plugins: [
-    new webpack.DefinePlugin({
-      'process.env.NODE_ENV': JSON.stringify('production')
-    }),
-    new WebpackNotifierPlugin()
-  ]
-}
+    }
+  }
+});
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 7d0165893ae77..314a971a84aa8 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -5,14 +5,11 @@
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
   "scripts": {
-    "start": "node node_modules/webpack-dev-server/bin/webpack-dev-server.js --config webpack.serve.config.js --open",
-    "clean": "gulp clean",
-    "build": "node ../../scripts/build.js"
+    "build": "node ../../scripts/build.js",
+    "clean": "node ../../scripts/clean.js",
+    "start": "node ../../scripts/start.js"
   },
   "devDependencies": {
-    "@microsoft/sp-build-web": "^1.1.0",
-    "@microsoft/sp-module-interfaces": "^1.1.0",
-    "@microsoft/web-library-build": "^3.2.1",
     "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.0",
     "@types/mocha": "2.2.39",
@@ -21,33 +18,19 @@
     "@types/react-dom": "15.5.1",
     "@types/webpack-env": "1.13.0",
     "@uifabric/example-app-base": ">=4.1.1 <5.0.0",
-    "chai": "^3.5.0",
     "enzyme": "^2.7.0",
     "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
     "es6-map": "^0.1.5",
-    "gulp": "~3.9.1",
-    "mocha": "^3.2.0",
-    "mocha-loader": "^1.1.1",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
-    "react-dom": "^15.4.2",
-    "source-map-loader": "^0.2.1",
-    "ts-loader": "^2.1.0",
-    "typescript": "2.4.2",
-    "uglifyjs-webpack-plugin": "^0.4.3",
-    "webpack": "^3.4.1",
-    "webpack-bundle-analyzer": "^2.2.1",
-    "webpack-dev-server": "^2.4.1",
-    "webpack-notifier": "^1.5.0",
-    "webpack-split-by-path": "2.0.0"
+    "react-dom": "^15.4.2"
   },
   "dependencies": {
-    "@microsoft/load-themed-styles": "^1.5.1",
     "@uifabric/utilities": ">=4.11.1 <5.0.0",
-    "tslib": "^1.6.0",
-    "rtl-css-js": "^1.1.1",
-    "glamor": "^2.20.24"
+    "tslib": "^1.7.1",
+    "rtl-css-js": "^1.1.3",
+    "glamor": "^2.20.40"
   }
 }
\ No newline at end of file
diff --git a/packages/styling/src/interfaces/ISemanticColors.ts b/packages/styling/src/interfaces/ISemanticColors.ts
index a250348b1ae30..af1ee0c014960 100644
--- a/packages/styling/src/interfaces/ISemanticColors.ts
+++ b/packages/styling/src/interfaces/ISemanticColors.ts
@@ -1,18 +1,18 @@
 /**
  * The collection of semantic slots for colors used in themes.
  *
- * ## Naming Convention 
+ * ## Naming Convention
  *
- * The name of a semantic slot can quickly tell you how it’s meant to be used. It generally follows this format: 
+ * The name of a semantic slot can quickly tell you how it’s meant to be used. It generally follows this format:
  *
- * [category name][element name][checked state][hovered/pressed/disabled state]  
- * [category name] – The “family” that this slot belongs to. 
- * [element name] – The name of the thing being targeted, such as the background or border. 
+ * [category name][element name][checked state][hovered/pressed/disabled state]
+ * [category name] – The “family” that this slot belongs to.
+ * [element name] – The name of the thing being targeted, such as the background or border.
  * [checked state] – Whether the thing is checked. We assume things are unchecked by default, so no need to specify the unchecked state.
- * (We used “checked” to refer to anything that is on, selected, toggled, highlighted, emphasized, etc.) 
+ * (We used “checked” to refer to anything that is on, selected, toggled, highlighted, emphasized, etc.)
  * [hovered/pressed/disabled state] – One of these states, if applicable. Each of these states are mutually exclusive.
- * Pressed styles overwrite hovered styles, and disabled elements cannot be hovered or pressed.   
- *  
+ * Pressed styles overwrite hovered styles, and disabled elements cannot be hovered or pressed.
+ *
  * ## Base Slots
  *
  * A basic set of slots that provide many default body styles, such as text, subtext, disabled colors, and so on.
@@ -26,18 +26,18 @@
  * will always want errors to be some shade of red, but we will need to tweak the exact shade so it's
  * legible depending on whether it's an inverted theme or not.
  * Invariant colors should almost never be changed by the theme, the defaults should suffice.
- *  
- * ## Input Controls 
+ *
+ * ## Input Controls
  *
  * This category contains input components commonly used to denote state, including radio buttons,
- * check boxes, toggle switches, sliders, progress bars, and more. 
- *  
- * ## Menus 
+ * check boxes, toggle switches, sliders, progress bars, and more.
+ *
+ * ## Menus
+ *
+ * Any kind of popup menus uses this category.
  *
- * Any kind of popup menus uses this category. 
- *  
  * ## Lists
- *  
+ *
  * Lists differ from menus in that they are designed to show infinite amounts of items, often scroll,
  * and have a large and complex interaction surface.
  * This category covers all kinds of lists, whether they're typical one-item-per-row lists (like DetailsList) or ones with a tiled layout.
diff --git a/packages/styling/tsconfig.json b/packages/styling/tsconfig.json
index b3619a4010871..73dec4f4a170e 100644
--- a/packages/styling/tsconfig.json
+++ b/packages/styling/tsconfig.json
@@ -1,6 +1,7 @@
 {
   "compilerOptions": {
     "baseUrl": ".",
+    "outDir": "lib",
     "target": "es5",
     "module": "commonjs",
     "jsx": "react",
@@ -27,12 +28,7 @@
       ]
     }
   },
-  "exclude": [
-    "node_modules",
-    "dist",
-    "lib",
-    "lib-amd",
-    "api",
-    "temp"
+  "include": [
+    "src"
   ]
 }
\ No newline at end of file
diff --git a/packages/utilities/api/utilities.api.ts b/packages/utilities/api/utilities.api.ts
index 1c9fe98f170fa..268a86ac67688 100644
--- a/packages/utilities/api/utilities.api.ts
+++ b/packages/utilities/api/utilities.api.ts
@@ -43,7 +43,7 @@ class AutoScroll {
 // WARNING: _warnDeprecations has incomplete type information
 // WARNING: _warnMutuallyExclusive has incomplete type information
 // @public
-class BaseComponent<P extends IBaseProps, S> extends React.Component<P, S> {
+class BaseComponent<P extends IBaseProps, S = {}> extends React.Component<P, S> {
   constructor(props?: P, context?: any);
   protected readonly _async: Async;
   protected readonly _disposables: IDisposable[];
@@ -105,8 +105,10 @@ class FabricPerformance {
   public static summary: IPerfSummary;
 }
 
+export function find < T >(array: T[], cb: (item: T, index: number) => boolean): T | undefined;
+
 // @public
-export function findIndex < T >(array: T[], cb: (item: any, index: number) => boolean): number;
+export function findIndex < T >(array: T[], cb: (item: T, index: number) => boolean): number;
 
 // @public
 export function findScrollableParent(startingElement: HTMLElement): HTMLElement | null;
@@ -451,6 +453,8 @@ class Rectangle {
   readonly width: number;
 }
 
+export function removeElement < T >(array: T[], index: number): T[];
+
 // WARNING: Because this definition is explicitly marked as @internal, an underscore prefix ("_") should be added to its name
 // @internal
 export function setMemoizeWeakMap(weakMap: any): void;
diff --git a/packages/utilities/karma.config.js b/packages/utilities/karma.config.js
index a706b978e8741..e3c221580db52 100644
--- a/packages/utilities/karma.config.js
+++ b/packages/utilities/karma.config.js
@@ -4,11 +4,9 @@
 // Generated on Thu Oct 08 2015 18:13:05 GMT-0700 (PDT)
 
 let path = require('path');
-let build = require('@microsoft/web-library-build');
-let buildConfig = build.getConfig();
-let configResources = build.karma.resources;
-let bindPolyfillPath = configResources.bindPolyfillPath;
+// let bindPolyfillPath = resources.bindPolyfillPath;
 let debugRun = (process.argv.indexOf('--debug') > -1);
+let resources = require('../../scripts/tasks/karma-resources');
 
 module.exports = function (config) {
   let karmaConfig = {
@@ -22,7 +20,9 @@ module.exports = function (config) {
 
 
     // list of files / patterns to load in the browser
-    files: [bindPolyfillPath].concat([path.join(buildConfig.libFolder, '**', '*.test.js')]),
+    files: resources.files.concat([
+      path.join('lib', '**', '*.test.js')
+    ]),
 
 
     // list of files to exclude
@@ -42,11 +42,12 @@ module.exports = function (config) {
           debugRun ? {} : {
             test: /\.js/,
             exclude: /(test|node_modules|bower_components)/,
-            loader: configResources.istanbulInstrumenterLoaderPath,
+            loader: resources.istanbulInstrumenterLoaderPath,
             enforce: 'post'
           }
         ],
       },
+
       externals: {
         'cheerio': 'window',
         'react/addons': true,
@@ -55,8 +56,8 @@ module.exports = function (config) {
       },
       resolve: {
         modules: [
-          buildConfig.libFolder,
-          'node_modules'
+          path.resolve(__dirname, 'lib'),
+          path.resolve(__dirname, 'node_modules')
         ]
       }
     },
@@ -68,10 +69,10 @@ module.exports = function (config) {
     // preprocess matching files before serving them to the browser
     // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
     preprocessors: {
-      [path.join(buildConfig.libFolder, '/**/*.js')]: ['webpack']
+      [path.join('lib', '/**/*.js')]: ['webpack']
     },
 
-    plugins: configResources.plugins.concat([
+    plugins: resources.plugins.concat([
     ]),
 
     // test results reporter to use
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 90eed5ca13195..69a4f90ea2b9c 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -10,12 +10,10 @@
   },
   "license": "MIT",
   "scripts": {
-    "tslint": "node ../../scripts/tslint.js",
     "build": "node ../../scripts/build.js",
-    "clean": "gulp clean"
+    "clean": "node ../../scripts/clean.js"
   },
   "devDependencies": {
-    "@microsoft/web-library-build": "^3.2.1",
     "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.0",
     "@types/es6-promise": "^0.0.32",
@@ -31,19 +29,16 @@
     "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
     "es6-map": "^0.1.5",
-    "gulp": "~3.9.1",
-    "mocha": "^3.3.0",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
     "react-dom": "^15.4.2",
-    "sinon": "^2.3.2",
-    "source-map-loader": "^0.2.1",
-    "typescript": "2.4.2"
+    "sinon": "^2.3.2"
   },
   "dependencies": {
+    "@microsoft/load-themed-styles": "^1.7.2",
     "prop-types": "^15.5.10",
-    "tslib": "^1.6.0"
+    "tslib": "^1.7.1"
   },
   "peerDependencies": {
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
diff --git a/packages/utilities/src/warn.test.ts b/packages/utilities/src/warn.test.ts
index 600390d63e620..91accd94c5bed 100644
--- a/packages/utilities/src/warn.test.ts
+++ b/packages/utilities/src/warn.test.ts
@@ -4,8 +4,8 @@ import {
   warnMutuallyExclusive,
   warnConditionallyRequiredProps
 } from './warn';
-import { expect } from 'chai';
 
+let { expect } = chai;
 let _lastWarning: string | undefined;
 
 describe('warnDeprecations', () => {
diff --git a/packages/utilities/tsconfig.json b/packages/utilities/tsconfig.json
index 1623e98fb4227..1a6505460b499 100644
--- a/packages/utilities/tsconfig.json
+++ b/packages/utilities/tsconfig.json
@@ -1,6 +1,7 @@
 {
   "compilerOptions": {
     "target": "es5",
+    "outDir": "lib",
     "module": "commonjs",
     "lib": [
       "es2017",
@@ -21,12 +22,7 @@
       "webpack-env"
     ]
   },
-  "exclude": [
-    "api",
-    "temp",
-    "node_modules",
-    "dist",
-    "lib",
-    "lib-amd"
+  "include": [
+    "src"
   ]
 }
\ No newline at end of file
diff --git a/scripts/build.js b/scripts/build.js
index eb4cfae43cb49..bd68e5c73e5d8 100644
--- a/scripts/build.js
+++ b/scripts/build.js
@@ -2,7 +2,7 @@ const chalk = require('chalk');
 const fs = require('fs');
 const path = require('path');
 const { logStartTask, logEndTask, logEndBuild } = require('./logging');
-
+const packageName = getPackageName();
 const isProduction = process.argv.indexOf('--production') > -1;
 
 let tasks = [
@@ -30,7 +30,7 @@ promise.then(() => {
   if (hasFailures) {
     process.exitCode = 1;
   }
-  logEndBuild(getPackageName(), !hasFailures, buildStartTime);
+  logEndBuild(packageName, !hasFailures, buildStartTime);
 });
 
 function runTask(task) {
@@ -38,12 +38,12 @@ function runTask(task) {
 
   return Promise.resolve()
     .then(() => !hasFailures && Promise.resolve()
-      .then(() => logStartTask(task))
+      .then(() => logStartTask(packageName, task))
       .then(() => require('./tasks/' + task)({ isProduction }))
-      .then(() => logEndTask(task, taskStartTime))
+      .then(() => logEndTask(packageName, task, taskStartTime))
       .catch((e) => {
         hasFailures = true;
-        logEndTask(task, taskStartTime, e);
+        logEndTask(packageName, task, taskStartTime, e);
       }));
 }
 
diff --git a/scripts/clean.js b/scripts/clean.js
new file mode 100644
index 0000000000000..8264c37807e85
--- /dev/null
+++ b/scripts/clean.js
@@ -0,0 +1,13 @@
+const rimraf = require('rimraf').sync;
+const path = require('path');
+
+[
+  'lib',
+  'temp',
+  'dist',
+  'lib-amd',
+  'lib-es6',
+  'coverage'
+].forEach(folder => {
+  rimraf(path.resolve(process.cwd(), folder));
+});
\ No newline at end of file
diff --git a/scripts/logging.js b/scripts/logging.js
index 95eb906dfedcf..31a16613aa06e 100644
--- a/scripts/logging.js
+++ b/scripts/logging.js
@@ -1,18 +1,21 @@
 const chalk = require('chalk');
 
-module.exports.logStartTask = (task) => {
+const isProduction = process.argv.indexOf('--production') > -1;
+const isVerbose = process.argv.indexOf('--verbose') > -1;
+
+module.exports.logStartTask = (packageName, task) => {
   console.log(
     `${
-    chalk.white('[') + chalk.gray(new Date().toLocaleTimeString({ hour12: false })) + chalk.white('] Starting:')
-    } ${
+    getTimePrefix(packageName)
+    } Starting: ${
     chalk.cyan(task)
     }`);
 };
 
-module.exports.logEndTask = (task, startTime, errorMessage) => {
+module.exports.logEndTask = (packageName, task, startTime, errorMessage) => {
   console.log(
     `${
-    getTimePrefix()
+    getTimePrefix(packageName)
     } ${
     getPassFail(errorMessage === undefined)
     }: ${
@@ -25,19 +28,19 @@ module.exports.logEndTask = (task, startTime, errorMessage) => {
 }
 
 module.exports.logStatus = (taskStatus) => {
-  console.log('  ' + taskStatus);
+  if (isProduction || isVerbose) {
+    console.log('  ' + taskStatus);
+  }
 }
 
 module.exports.logEndBuild = (packageName, passed, startTime) => {
   console.log();
   console.log(
     `${
-    getTimePrefix()
-    } ${
-    chalk.grey('===') + chalk.white('[ ') + chalk.cyan(packageName) + chalk.white(' ]') +
+    chalk.grey('============') + chalk.white('[ ') + chalk.cyan(packageName) + chalk.white(' ]') +
     chalk.grey('=') + chalk.white('[ ') + getPassFail(passed) + chalk.white(' ]') +
     chalk.grey('=') + chalk.white('[ ') + getDuration(startTime) + chalk.white(' ]') +
-    chalk.grey('===')
+    chalk.grey('============')
     }
   `);
 }
@@ -51,11 +54,12 @@ function getPassFail(passed) {
   return passed ? chalk.green('Pass') : chalk.red('Error');
 }
 
-function getTimePrefix() {
-  return `[${
+function getTimePrefix(packageName) {
+  return `[${chalk.magenta(packageName)} ${
     chalk.gray(new Date().toLocaleTimeString({ hour12: false }))
     }]`;
 }
+
 function formatTime(milliseconds) {
   if (milliseconds >= 1000) {
     return (milliseconds / 1000) + 's';
diff --git a/scripts/package.json b/scripts/package.json
index 9a40062b98992..802b4d578ad8a 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -7,19 +7,46 @@
     "build": "node -v"
   },
   "devDependencies": {
-    "@microsoft/load-themed-styles": "^1.5.1",
+    "@microsoft/load-themed-styles": "^1.7.2",
+    "@microsoft/loader-load-themed-styles": "^1.4.2",
     "autoprefixer": "^7.1.2",
+    "awesome-typescript-loader": "^3.2.3",
     "chalk": "^2.1.0",
+    "chai": "^4.1.1",
     "cpx": "^1.5.0",
+    "css-loader": "^0.28.5",
     "github": "^7.0.0",
     "glob": "^7.1.2",
-    "gulp": "^3.9.1",
+    "gzip-size": "^3.0.0",
+    "istanbul-instrumenter-loader": "^3.0.0",
+    "json-loader": "^0.5.7",
+    "karma": "^1.7.0",
+    "karma-coverage": "^1.1.1",
+    "karma-mocha": "^1.3.0",
+    "karma-mocha-clean-reporter": "^0.0.1",
+    "karma-phantomjs-launcher": "^1.0.4",
+    "karma-sinon-chai": "^1.3.1",
+    "karma-webpack": "^2.0.4",
     "node-sass": "^4.5.3",
+    "open": "^0.0.5",
+    "phantomjs-polyfill": "^0.0.2",
     "postcss": "^6.0.9",
+    "postcss-loader": "^2.0.6",
     "postcss-modules": "^0.8.0",
+    "raw-loader": "^0.5.1",
+    "sass-loader": "^6.0.6",
+    "sinon": "^3.2.1",
+    "sinon-chai": "^2.13.0",
+    "source-map-loader": "^0.2.1",
+    "style-loader": "^0.18.2",
     "tslint": "^5.6.0",
     "tslint-microsoft-contrib": "^5.0.1",
     "typescript": "2.4.2",
+    "uglifyjs-webpack-plugin": "^0.4.6",
+    "webpack": "^3.5.5",
+    "webpack-bundle-analyzer": "^2.9.0",
+    "webpack-dev-server": "^2.7.1",
+    "webpack-notifier": "^1.5.0",
     "yargs": "^6.5.0"
   }
 }
\ No newline at end of file
diff --git a/scripts/start.js b/scripts/start.js
new file mode 100644
index 0000000000000..77c0dd33f82b8
--- /dev/null
+++ b/scripts/start.js
@@ -0,0 +1,13 @@
+const webpack = require('webpack');
+const WebpackDevServer = require('webpack-dev-server');
+const path = require('path');
+const fs = require('fs');
+
+const configPath = path.resolve(process.cwd(), 'webpack.serve.config.js');
+
+if (fs.existsSync(configPath)) {
+  const webpackDevServerPath = path.resolve(__dirname, './node_modules/webpack-dev-server/bin/webpack-dev-server.js');
+  const execSync = require('./exec-sync');
+
+  execSync(`node ${webpackDevServerPath} --config ${configPath} --open`);
+}
diff --git a/scripts/tasks/karma-resources.js b/scripts/tasks/karma-resources.js
new file mode 100644
index 0000000000000..afc7811d43270
--- /dev/null
+++ b/scripts/tasks/karma-resources.js
@@ -0,0 +1,19 @@
+module.exports = {
+
+  istanbulInstrumenterLoaderPath: require.resolve('istanbul-instrumenter-loader'),
+
+  files: [
+    require.resolve('phantomjs-polyfill/bind-polyfill.js')
+  ],
+
+  plugins: [
+    require('karma-webpack'),
+    require('karma-mocha'),
+    require('karma-coverage'),
+    require('karma-mocha-clean-reporter'),
+    require('karma-phantomjs-launcher'),
+    require('karma-sinon-chai')
+  ],
+
+  webpack: require('webpack')
+};
diff --git a/scripts/tasks/karma.js b/scripts/tasks/karma.js
index e02861a7f3e51..84416b310c4b9 100644
--- a/scripts/tasks/karma.js
+++ b/scripts/tasks/karma.js
@@ -1,11 +1,12 @@
 module.exports = function (options) {
   let path = require('path');
   let fs = require('fs');
-  let karmaPath = path.join(process.cwd(), 'karma.config.js');
+  let karmaPath = path.resolve(__dirname, '../node_modules/karma/bin/karma');
+  let karmaConfigPath = path.join(process.cwd(), 'karma.config.js');
 
-  if (fs.existsSync(karmaPath)) {
+  if (fs.existsSync(karmaConfigPath)) {
     const execSync = require('../exec-sync');
 
-    execSync('gulp karma' + (options.isProduction ? ' --production' : ''));
+    execSync(`node ${karmaPath} start ${karmaConfigPath}`);
   }
 };
diff --git a/scripts/tasks/serve.js b/scripts/tasks/serve.js
deleted file mode 100644
index e69de29bb2d1d..0000000000000
diff --git a/scripts/tasks/tslint.js b/scripts/tasks/tslint.js
index 3d15fec52aa27..83ee5fce24e01 100644
--- a/scripts/tasks/tslint.js
+++ b/scripts/tasks/tslint.js
@@ -1,6 +1,7 @@
 module.exports = function (options) {
   const execSync = require('../exec-sync');
   const path = require('path');
+  const fs = require('fs');
   const msCustomRulesMain = require.resolve('tslint-microsoft-contrib');
   const rulesPath = path.dirname(msCustomRulesMain);
   const projectPath = path.resolve(process.cwd(), 'tsconfig.json');
diff --git a/scripts/tasks/webpack-resources.js b/scripts/tasks/webpack-resources.js
new file mode 100644
index 0000000000000..89055d59c1bdc
--- /dev/null
+++ b/scripts/tasks/webpack-resources.js
@@ -0,0 +1,208 @@
+const webpack = require('webpack');
+const path = require('path');
+
+module.exports = {
+  webpack,
+
+  createConfig(packageName, isProduction, customConfig, onlyProduction) {
+
+    const resolveLoader = {
+      modules: [
+        path.resolve(__dirname, '../node_modules'),
+        path.resolve(process.cwd(), 'node_modules')
+      ]
+    };
+
+    const module = {
+      noParse: [/autoit.js/],
+      loaders: [
+        {
+          test: /\.js$/,
+          loader: 'source-map-loader',
+          enforce: 'pre'
+        },
+        {
+          test: /\.json$/,
+          loader: 'json-loader'
+        }
+      ]
+    };
+
+    const stats = 'errors-only';
+    const devtool = 'source-map';
+    const configs = [];
+
+    if (!onlyProduction) {
+      configs.push(merge(
+        {
+          output: {
+            filename: `[name].js`,
+            path: path.resolve(process.cwd(), 'dist')
+          },
+          resolveLoader,
+          module,
+          stats,
+          devtool,
+          plugins: getPlugins(packageName, false)
+        },
+        customConfig
+      ));
+    }
+
+    if (isProduction) {
+      configs.push(merge({
+        output: {
+          filename: `[name].min.js`,
+          path: path.resolve(process.cwd(), 'dist')
+        },
+        resolveLoader,
+        module,
+        stats,
+        devtool,
+        plugins: getPlugins(packageName, true)
+      }, customConfig));
+    }
+
+    return configs;
+  },
+
+  createServeConfig(customConfig) {
+    const WebpackNotifierPlugin = require('webpack-notifier');
+
+    return merge(
+      {
+        devServer: {
+          inline: true,
+          port: 4321,
+        },
+
+        resolveLoader: {
+          modules: [
+            path.resolve(__dirname, '../node_modules'),
+            path.resolve(process.cwd(), 'node_modules')
+          ]
+        },
+
+        resolve: {
+          extensions: ['.ts', '.tsx', '.js']
+        },
+
+        devtool: 'source-map',
+
+        module: {
+          loaders: [
+            {
+              test: [/\.json$/],
+              enforce: 'pre',
+              loader: 'json',
+              exclude: [
+                /node_modules/
+              ]
+            },
+            {
+              test: [/\.tsx?$/],
+              loader: 'awesome-typescript-loader',
+              exclude: [
+                /node_modules/,
+                /\.scss.ts$/
+              ]
+            },
+            {
+              test: /\.scss$/,
+              enforce: 'pre',
+              exclude: [
+                /node_modules/
+              ],
+              use: [
+                {
+                  loader: "@microsoft/loader-load-themed-styles", // creates style nodes from JS strings
+                },
+                {
+                  loader: "css-loader", // translates CSS into CommonJS
+                  options: {
+                    modules: true,
+                    importLoaders: 2,
+                    localIdentName: '[name]_[local]_[hash:base64:5]',
+                    minimize: false
+                  }
+                },
+                {
+                  loader: 'postcss-loader',
+
+                  options: {
+                    plugins: function () {
+                      return [
+                        require('autoprefixer')
+                      ];
+                    }
+                  }
+                },
+                {
+                  loader: 'sass-loader',
+                }
+              ]
+            }
+          ]
+        },
+
+        plugins: [
+          new WebpackNotifierPlugin()
+        ]
+      },
+      customConfig
+    );
+  }
+
+};
+
+function merge(obj1, obj2) {
+  const merged = Object.assign({}, obj1);
+
+  for (prop in obj2) {
+    const sourceValue = obj2[prop];
+    const targetValue = obj1[prop];
+
+    if (sourceValue && Array.isArray(sourceValue) && targetValue && Array.isArray(targetValue)) {
+      merged[prop] = targetValue.concat(sourceValue);
+    } else if (typeof targetValue === 'object' && typeof sourceValue === 'object') {
+      merged[prop] = merge(targetValue, sourceValue);
+    } else {
+      merged[prop] = sourceValue;
+    }
+  }
+
+  return merged;
+}
+
+function getPlugins(
+  bundleName,
+  isProduction
+) {
+  const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
+  const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
+  const plugins = [];
+
+  if (isProduction) {
+    plugins.push(
+      new webpack.DefinePlugin({
+        'process.env.NODE_ENV': JSON.stringify('production')
+      }),
+      new UglifyJsPlugin({
+        uglifyOptions: {
+          compress: true,
+          warnings: false
+        }
+      }),
+      new BundleAnalyzerPlugin({
+        analyzerMode: 'static',
+        reportFilename: bundleName + '.stats.html',
+        openAnalyzer: false,
+        generateStatsFile: true,
+        statsFilename: bundleName + '.stats.json',
+        logLevel: 'warn'
+      })
+    );
+  }
+
+  return plugins;
+}
\ No newline at end of file
diff --git a/scripts/tasks/webpack.js b/scripts/tasks/webpack.js
index 35367a06beb4e..292d63dc144c6 100644
--- a/scripts/tasks/webpack.js
+++ b/scripts/tasks/webpack.js
@@ -1,14 +1,66 @@
 module.exports = function (options) {
-  let path = require('path');
-  let fs = require('fs');
-  let webpackConfigPath = path.join(process.cwd(), 'webpack.config.js');
+  const path = require('path');
+  const fs = require('fs');
 
-  if (fs.existsSync(webpackConfigPath)) {
-    // const execSync = require('./exec-sync');
-    // execSync('webpack --config webpack.config.js' + (options.isProduction ? ' --production' : ''));
+  const webpackConfigPath = path.join(process.cwd(), 'webpack.config.js');
 
-    const execSync = require('../exec-sync');
+  if (fs.existsSync(webpackConfigPath)) {
+    const webpack = require('webpack');
+    const config = flatten(require(webpackConfigPath));
 
-    execSync('gulp webpack' + (options.isProduction ? ' --production' : ''));
+    return new Promise((resolve, reject) => {
+      webpack(config, (err, stats) => {
+        if (err || stats.hasErrors()) {
+          reject(err);
+        } else {
+          _printStats(stats);
+          resolve();
+        }
+      });
+    });
   }
 };
+
+function _printStats(stats, isProduction) {
+  const { logStatus } = require('../logging');
+  const chalk = require('chalk');
+  const path = require('path');
+
+  for (const stat of stats.stats) {
+    if (stat.compilation && stat.compilation.assets) {
+      for (const asset in stat.compilation.assets) {
+        const assetInfo = stat.compilation.assets[asset];
+        const assetPath = path.relative(process.cwd(), assetInfo.existsAt);
+
+        if (asset.endsWith('.min.js')) {
+          const gzipSize = require('gzip-size');
+          const fs = require('fs');
+          const content = fs.readFileSync(assetInfo.existsAt, 'utf8');
+          const size = gzipSize.sync(content);
+
+          logStatus(`Created bundle "${chalk.cyan(assetPath)}" (gzipped: ${getFileSize(size)})`);
+        } else if (asset.endsWith('.js')) {
+          logStatus(`Created bundle "${chalk.cyan(assetPath)}"`);
+        }
+      }
+    }
+  }
+}
+
+function flatten(arr) {
+  return arr.reduce(function (flat, toFlatten) {
+    return flat.concat(Array.isArray(toFlatten) ? flatten(toFlatten) : toFlatten);
+  }, []);
+}
+
+function getFileSize(size) {
+  const chalk = require('chalk');
+  let sizeString = '';
+
+  if (size < 1024) {
+    sizeString = size + ' bytes';
+  } else {
+    sizeString = (Math.round(1000 * size / 1024) / 1000) + ' KB'
+  }
+  return chalk.cyan(sizeString);
+}
\ No newline at end of file

From 3057b27ec363804bf03846f33a0bd0a3f84d0c63 Mon Sep 17 00:00:00 2001
From: Su Su <s@warmsea.net>
Date: Wed, 30 Aug 2017 23:48:02 +0800
Subject: [PATCH 0530/1641] CommandBar: data-command-key to use key (#2661)

* Fix data-command-key to key.

* Generate change file.

* Use itemKey.
---
 .../data-command-key_2017-08-29-12-37.json            | 11 +++++++++++
 .../src/components/CommandBar/CommandBar.tsx          |  8 ++++----
 2 files changed, 15 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/data-command-key_2017-08-29-12-37.json

diff --git a/common/changes/office-ui-fabric-react/data-command-key_2017-08-29-12-37.json b/common/changes/office-ui-fabric-react/data-command-key_2017-08-29-12-37.json
new file mode 100644
index 0000000000000..ed06ecfcaa095
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/data-command-key_2017-08-29-12-37.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix data-command-key to key instead of index.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "s@warmsea.net"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 199a228a288ac..a651cb2f016c5 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -124,7 +124,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
                   }) }
                   onClick={ this._onOverflowClick }
                   role='menuitem'
-                  aria-expanded={this.state.expandedMenuItemKey === OVERFLOW_KEY}
+                  aria-expanded={ this.state.expandedMenuItemKey === OVERFLOW_KEY }
                   aria-label={ this.props.elipisisAriaLabel || '' }
                   aria-haspopup={ true }
                   data-automation-id='commandBarOverflow'
@@ -183,7 +183,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
             id={ this._id + item.key }
             className={ className }
             onClick={ (ev) => this._onItemClick(ev, item) }
-            data-command-key={ index }
+            data-command-key={ itemKey }
             aria-haspopup={ hasSubmenuItems(item) }
             aria-expanded={ hasSubmenuItems(item) ? expandedMenuItemKey === item.key : undefined }
             role='menuitem'
@@ -207,7 +207,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
             id={ this._id + item.key }
             className={ className }
             href={ item.href }
-            data-command-key={ index }
+            data-command-key={ itemKey }
             aria-haspopup={ hasSubmenuItems(item) }
             role='menuitem'
             aria-label={ item.ariaLabel }
@@ -226,7 +226,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
             { ...getNativeProps(item, divProperties) }
             id={ this._id + item.key }
             className={ className }
-            data-command-key={ index }
+            data-command-key={ itemKey }
             aria-haspopup={ hasSubmenuItems(item) }
           >
             { (hasIcon) ? this._renderIcon(item) : (null) }

From ee34cf68c25e072751ecbcf82976a257943e5609 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Wed, 30 Aug 2017 11:21:04 -0700
Subject: [PATCH 0531/1641] comboBox: Loosen requirements for when to rerender
 (#2674)

* Loosen when the comboBox rerenders to happen when any of the selectedKey, value, or options change

* rush change

* Update jspurlin-ComboBoxRerenderFix_2017-08-30-16-34.json
---
 ...jspurlin-ComboBoxRerenderFix_2017-08-30-16-34.json | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.tsx              |  6 ++++--
 2 files changed, 15 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxRerenderFix_2017-08-30-16-34.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxRerenderFix_2017-08-30-16-34.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxRerenderFix_2017-08-30-16-34.json
new file mode 100644
index 0000000000000..d58a6a210f2fa
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxRerenderFix_2017-08-30-16-34.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Loosen the re-rendering requirement",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index e14e012a1e2a7..2bb16b3f63a16 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -145,8 +145,10 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   }
 
   public componentWillReceiveProps(newProps: IComboBoxProps) {
-    // Update the selectedIndex and currentOptions state if the selectedKey or options have changed
-    if (((newProps.selectedKey || newProps.value) && newProps.selectedKey !== this.props.selectedKey) ||
+    // Update the selectedIndex and currentOptions state if
+    // the selectedKey, value, or options have changed
+    if (newProps.selectedKey !== this.props.selectedKey ||
+      newProps.value !== this.props.value ||
       newProps.options !== this.props.options) {
       let index: number = this._getSelectedIndex(newProps.options, newProps.selectedKey);
       this.setState({

From b59ae4e8dbe5f47638279c88a4b5b5978e9f0fc0 Mon Sep 17 00:00:00 2001
From: Christopher Schleiden <cschleiden@live.de>
Date: Wed, 30 Aug 2017 11:44:52 -0700
Subject: [PATCH 0532/1641] Update settings.json in root to hide generated
 .scss TS  modules (#2677)

---
 .vscode/settings.json | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.vscode/settings.json b/.vscode/settings.json
index aa7f6036fb24d..41a5372b59608 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -14,7 +14,7 @@
     "**/.DS_Store": true,
     "**/bower_components": true,
     "**/coverage": true,
-    "**/*.scss.ts": false
+    "**/*.scss.ts": true
   },
   "files.watcherExclude": {
     "**/.git/objects/**": true,
@@ -43,4 +43,4 @@
   "editor.formatOnSave": true,
   "typescript.tsdk": "./common/temp/node_modules/typescript/lib",
   "tslint.autoFixOnSave": false
-}
\ No newline at end of file
+}

From b98edd1a253e498bb7b298cfa50ae76eee44b7db Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 30 Aug 2017 13:08:00 -0700
Subject: [PATCH 0533/1641] Tooltip: support custom maxWidth (#2663)

* Added maxWidth prop to allow overriding default maxWidth

* Added change file
---
 .../tooltip-custom-maxwidth_2017-08-29-16-36.json  | 11 +++++++++++
 .../src/components/Tooltip/Tooltip.Props.ts        |  6 ++++++
 .../src/components/Tooltip/Tooltip.scss            |  1 -
 .../src/components/Tooltip/Tooltip.tsx             | 14 ++++++++------
 4 files changed, 25 insertions(+), 7 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/tooltip-custom-maxwidth_2017-08-29-16-36.json

diff --git a/common/changes/office-ui-fabric-react/tooltip-custom-maxwidth_2017-08-29-16-36.json b/common/changes/office-ui-fabric-react/tooltip-custom-maxwidth_2017-08-29-16-36.json
new file mode 100644
index 0000000000000..ae76cbe40d085
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/tooltip-custom-maxwidth_2017-08-29-16-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Tooltip: Added support for custom maxWidth values",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.Props.ts b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.Props.ts
index 7a1934fcab13c..ad7f40feeab7c 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.Props.ts
@@ -39,6 +39,12 @@ export interface ITooltipProps extends React.HTMLAttributes<HTMLDivElement | Too
    */
   delay?: TooltipDelay;
 
+  /**
+   * Max width of tooltip
+   * @default 364px
+   */
+  maxWidth?: string | null;
+
   /**
    * Element to anchor the Tooltip to.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.scss b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.scss
index 8c05c27381e7f..0fd0f0032be80 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.scss
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.scss
@@ -7,7 +7,6 @@
 // Tooltip styles
 
 .root {
-  max-width: 364px;
   background: $ms-color-white;
   padding: 8px;
   pointer-events: none;
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
index c84e5b3316ef8..3ab93e854191b 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
@@ -12,7 +12,7 @@ import { Callout } from '../../Callout';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import * as stylesImport from './Tooltip.scss';
 const styles: any = stylesImport;
-import { AnimationClassNames } from '../../Styling';
+import { AnimationClassNames, mergeStyles } from '../../Styling';
 
 export class Tooltip extends BaseComponent<ITooltipProps, any> {
 
@@ -20,6 +20,7 @@ export class Tooltip extends BaseComponent<ITooltipProps, any> {
   public static defaultProps = {
     directionalHint: DirectionalHint.topCenter,
     delay: TooltipDelay.medium,
+    maxWidth: '364px',
     calloutProps: {
       isBeakVisible: true,
       beakWidth: 16,
@@ -38,18 +39,19 @@ export class Tooltip extends BaseComponent<ITooltipProps, any> {
       directionalHintForRTL,
       delay,
       id,
+      maxWidth,
       onRenderContent = this._onRenderContent
   } = this.props;
 
     return (
       <Callout
-        className={ css(
+        className={ mergeStyles(
           'ms-Tooltip',
           AnimationClassNames.fadeIn200,
-          styles.root, {
-            [styles.hasMediumDelay]: delay === TooltipDelay.medium
-          }
-        ) }
+          styles.root,
+          (delay === TooltipDelay.medium) && styles.hasMediumDelay,
+          (maxWidth !== null) && { maxWidth: maxWidth }
+        ) as string }
         targetElement={ targetElement }
         directionalHint={ directionalHint }
         directionalHintForRTL={ directionalHintForRTL }

From 5f87c4581c21e9ed06bbd5c3d3c83ae2bbe91571 Mon Sep 17 00:00:00 2001
From: Ben Truelove <betrue@microsoft.com>
Date: Wed, 30 Aug 2017 14:08:16 -0700
Subject: [PATCH 0534/1641] Changed size of check to 18px. (#2675)

* Changed size of check to 18px.

* changelist

* Update betrue-18pxCheck_2017-08-30-17-53.json
---
 .../betrue-18pxCheck_2017-08-30-17-53.json            | 11 +++++++++++
 .../src/components/Check/Check.scss                   |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/betrue-18pxCheck_2017-08-30-17-53.json

diff --git a/common/changes/office-ui-fabric-react/betrue-18pxCheck_2017-08-30-17-53.json b/common/changes/office-ui-fabric-react/betrue-18pxCheck_2017-08-30-17-53.json
new file mode 100644
index 0000000000000..59195b3f2ad9a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/betrue-18pxCheck_2017-08-30-17-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Check: Increased size of check to 18px",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "betrue@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.scss b/packages/office-ui-fabric-react/src/components/Check/Check.scss
index 4a2aa12a47aea..e8291063b8d32 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.scss
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.scss
@@ -7,7 +7,7 @@
 // --------------------------------------------------
 // Check styles
 
-$checkBoxHeight: 16px;
+$checkBoxHeight: 18px;
 
 .root {
   line-height: 1;

From 7d9c47c1240c0877a023c3fb181b7870a695416a Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 31 Aug 2017 00:19:18 -0700
Subject: [PATCH 0535/1641] Fix RTL/LTR toggle in demo pages (#2647)

* Add local storage helper methods

* RTL with persistence

* Reload the page when switching to RTL on the demo page

* Rush change

* don't set RTL on read

* Use session storage, make persistance off by default.

* update comments

* Addd typedef to function signature

* fix tslint
---
 .../local-storage-rtl_2017-08-28-15-55.json   | 11 ++++++
 .../local-storage-rtl_2017-08-28-15-55.json   | 11 ++++++
 .../src/components/Header/Header.tsx          | 19 ++++-----
 packages/utilities/src/localStorage.ts        | 26 +++++++++++++
 packages/utilities/src/rtl.ts                 | 39 +++++++++++--------
 packages/utilities/src/sessionStorage.ts      | 26 +++++++++++++
 6 files changed, 103 insertions(+), 29 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/local-storage-rtl_2017-08-28-15-55.json
 create mode 100644 common/changes/@uifabric/utilities/local-storage-rtl_2017-08-28-15-55.json
 create mode 100644 packages/utilities/src/localStorage.ts
 create mode 100644 packages/utilities/src/sessionStorage.ts

diff --git a/common/changes/@uifabric/example-app-base/local-storage-rtl_2017-08-28-15-55.json b/common/changes/@uifabric/example-app-base/local-storage-rtl_2017-08-28-15-55.json
new file mode 100644
index 0000000000000..4cc702589f386
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/local-storage-rtl_2017-08-28-15-55.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Refresh the page when swtiching languages to make sure that memoized styles are recomputed",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/local-storage-rtl_2017-08-28-15-55.json b/common/changes/@uifabric/utilities/local-storage-rtl_2017-08-28-15-55.json
new file mode 100644
index 0000000000000..7567f3231724d
--- /dev/null
+++ b/common/changes/@uifabric/utilities/local-storage-rtl_2017-08-28-15-55.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "RTL: Persist rtl settings between sessions",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/src/components/Header/Header.tsx b/packages/example-app-base/src/components/Header/Header.tsx
index 35ddd2982508d..eb8b2b1ad8644 100644
--- a/packages/example-app-base/src/components/Header/Header.tsx
+++ b/packages/example-app-base/src/components/Header/Header.tsx
@@ -26,11 +26,12 @@ export interface IHeaderState {
     target: HTMLElement,
     items: IContextualMenuItem[]
   };
-  isRTLEnabled?: boolean;
 }
 
 @withResponsiveMode
 export class Header extends React.Component<IHeaderProps, IHeaderState> {
+  private _isRTLEnabled: boolean;
+
   constructor(props: IHeaderProps) {
     super(props);
 
@@ -39,9 +40,9 @@ export class Header extends React.Component<IHeaderProps, IHeaderState> {
     this._onRTLToggled = this._onRTLToggled.bind(this);
     this._onMenuClick = this._onMenuClick.bind(this);
 
+    this._isRTLEnabled = getRTL();
     this.state = {
-      contextMenu: undefined,
-      isRTLEnabled: getRTL()
+      contextMenu: undefined
     };
   }
 
@@ -121,21 +122,15 @@ export class Header extends React.Component<IHeaderProps, IHeaderState> {
   private _getOptionMenuItems(): IContextualMenuItem[] {
     return [{
       key: 'isRTL',
-      name: `Render in ${this.state.isRTLEnabled ? 'LTR' : 'RTL'}`,
+      name: `Render in ${this._isRTLEnabled ? 'LTR' : 'RTL'}`,
       icon: 'Settings',
       onClick: this._onRTLToggled
     }];
   }
 
   private _onRTLToggled(ev: React.MouseEvent<HTMLElement>): void {
-    let { isRTLEnabled } = this.state;
-
-    setRTL(!isRTLEnabled);
-
-    this.setState({
-      isRTLEnabled: !isRTLEnabled,
-      contextMenu: undefined
-    });
+    setRTL(!this._isRTLEnabled);
+    location.reload();
   }
 
   private _onDismiss(): void {
diff --git a/packages/utilities/src/localStorage.ts b/packages/utilities/src/localStorage.ts
new file mode 100644
index 0000000000000..d8417b063d5a1
--- /dev/null
+++ b/packages/utilities/src/localStorage.ts
@@ -0,0 +1,26 @@
+/**
+ * Fetches an item from local storage without throwing an exception
+ * @param key The key of the item to fetch from local storage
+ */
+export function getItem(key: string): string | null {
+  let result = null;
+  try {
+    result = window.localStorage.getItem(key);
+  } catch (e) {
+    /* Eat the exception */
+  }
+  return result;
+}
+
+/**
+ * Inserts an item into local storage without throwing an exception
+ * @param key The key of the item to add to local storage
+ * @param data The data to put into local storage
+ */
+export function setItem(key: string, data: string): void {
+  try {
+    window.localStorage.setItem(key, data);
+  } catch (e) {
+    /* Eat the exception */
+  }
+}
\ No newline at end of file
diff --git a/packages/utilities/src/rtl.ts b/packages/utilities/src/rtl.ts
index f27ea75c2c2dd..2cec71d69074d 100644
--- a/packages/utilities/src/rtl.ts
+++ b/packages/utilities/src/rtl.ts
@@ -1,46 +1,51 @@
 import { KeyCodes } from './KeyCodes';
+import { getDocument } from './dom';
+import { getItem, setItem } from './sessionStorage';
+
+const RTL_LOCAL_STORAGE_KEY = 'isRTL';
 
 // Default to undefined so that we initialize on first read.
 let _isRTL: boolean | undefined;
 
 /**
  * Gets the rtl state of the page (returns true if in rtl.)
- *
- * @public
  */
 export function getRTL(): boolean {
-  let isRTL: boolean = _isRTL as boolean;
+  if (_isRTL === undefined) {
+    let doc = getDocument();
+
+    let savedRTL = getItem(RTL_LOCAL_STORAGE_KEY);
 
-  if (isRTL === undefined) {
-    let doc = typeof document === 'undefined' ? undefined : document;
+    if (savedRTL !== null) {
+      _isRTL = savedRTL === '1';
+    }
 
-    if (doc && doc.documentElement) {
-      isRTL = doc.documentElement.getAttribute('dir') === 'rtl';
+    if (_isRTL === undefined && doc) {
+      _isRTL = doc.documentElement.getAttribute('dir') === 'rtl';
     }
   }
 
-  return isRTL;
+  return !!_isRTL;
 }
 
 /**
  * Sets the rtl state of the page (by adjusting the dir attribute of the html element.)
- *
- * @public
  */
-export function setRTL(isRTL: boolean): void {
-  let doc = typeof document === 'undefined' ? undefined : document;
-
-  if (doc && doc.documentElement) {
+export function setRTL(isRTL: boolean, persistSetting: boolean = false): void {
+  let doc = getDocument();
+  if (doc) {
     doc.documentElement.setAttribute('dir', isRTL ? 'rtl' : 'ltr');
   }
 
+  if (persistSetting) {
+    setItem(RTL_LOCAL_STORAGE_KEY, isRTL ? '1' : '0');
+  }
+
   _isRTL = isRTL;
 }
 
 /**
  * Returns the given key, but flips right/left arrows if necessary.
- *
- * @public
  */
 export function getRTLSafeKeyCode(key: number): number {
   if (getRTL()) {
@@ -52,4 +57,4 @@ export function getRTLSafeKeyCode(key: number): number {
   }
 
   return key;
-}
+}
\ No newline at end of file
diff --git a/packages/utilities/src/sessionStorage.ts b/packages/utilities/src/sessionStorage.ts
new file mode 100644
index 0000000000000..283ddffa62e63
--- /dev/null
+++ b/packages/utilities/src/sessionStorage.ts
@@ -0,0 +1,26 @@
+/**
+ * Fetches an item from session storage without throwing an exception
+ * @param key The key of the item to fetch from session storage
+ */
+export function getItem(key: string): string | null {
+  let result = null;
+  try {
+    result = window.sessionStorage.getItem(key);
+  } catch (e) {
+    /* Eat the exception */
+  }
+  return result;
+}
+
+/**
+ * Inserts an item into session storage without throwing an exception
+ * @param key The key of the item to add to session storage
+ * @param data The data to put into session storage
+ */
+export function setItem(key: string, data: string): void {
+  try {
+    window.sessionStorage.setItem(key, data);
+  } catch (e) {
+    /* Eat the exception */
+  }
+}
\ No newline at end of file

From 98b8267ac0047f9b49718fda669da77fa361ec8a Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 31 Aug 2017 08:24:15 -0700
Subject: [PATCH 0536/1641] Fix publish build (#2688)

* Add @types/node

* Rush change
---
 apps/fabric-website/package.json              |   1 +
 .../fix-publish_2017-08-31-15-14.json         |  11 +
 common/config/rush/npm-shrinkwrap.json        | 687 ++++++++++++++++--
 3 files changed, 627 insertions(+), 72 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/fix-publish_2017-08-31-15-14.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index bc0c7b6676a70..726cffd6e9f55 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -20,6 +20,7 @@
     "@types/enzyme": "2.8.0",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "2.2.39",
+    "@types/node": "8.0.26",
     "@types/prop-types": "15.5.1",
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
diff --git a/common/changes/@uifabric/fabric-website/fix-publish_2017-08-31-15-14.json b/common/changes/@uifabric/fabric-website/fix-publish_2017-08-31-15-14.json
new file mode 100644
index 0000000000000..61d0093600c95
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/fix-publish_2017-08-31-15-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Add @types/node dependency",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index b0d35e422fdad..348eee741deb5 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -4,17 +4,17 @@
   "lockfileVersion": 1,
   "dependencies": {
     "@microsoft/load-themed-styles": {
-      "version": "1.7.2",
-      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.2.tgz",
-      "integrity": "sha1-Hv4yu8cRKZBl7RMYEg5olF9LZ0E="
+      "version": "1.7.3",
+      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.3.tgz",
+      "integrity": "sha1-vECKxo5op1L8tB9QMUkco2hSPr0="
     },
     "@microsoft/loader-load-themed-styles": {
-      "version": "1.4.2",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.4.2.tgz",
-      "integrity": "sha1-uppUNhnV2V+BXJige3eSxxaE0nM="
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.5.0.tgz",
+      "integrity": "sha1-zt/Y9nepJoVnM8C1Y4RkNaChJ8E="
     },
     "@rush-temp/build": {
-      "version": "file:projects/build",
+      "version": "file:projects\\build",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -347,7 +347,7 @@
       }
     },
     "@rush-temp/example-app-base": {
-      "version": "file:projects/example-app-base",
+      "version": "file:projects\\example-app-base",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -582,7 +582,7 @@
       }
     },
     "@rush-temp/experiments": {
-      "version": "file:projects/experiments",
+      "version": "file:projects\\experiments",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -833,7 +833,7 @@
       }
     },
     "@rush-temp/fabric-website": {
-      "version": "file:projects/fabric-website",
+      "version": "file:projects\\fabric-website",
       "dependencies": {
         "@types/react-addons-test-utils": {
           "version": "0.14.19",
@@ -1080,7 +1080,7 @@
       }
     },
     "@rush-temp/merge-styles": {
-      "version": "file:projects/merge-styles",
+      "version": "file:projects\\merge-styles",
       "dependencies": {
         "commander": {
           "version": "2.9.0",
@@ -1109,7 +1109,7 @@
       }
     },
     "@rush-temp/office-ui-fabric-react": {
-      "version": "file:projects/office-ui-fabric-react",
+      "version": "file:projects\\office-ui-fabric-react",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1360,10 +1360,10 @@
       }
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
-      "version": "file:projects/office-ui-fabric-react-tslint"
+      "version": "file:projects\\office-ui-fabric-react-tslint"
     },
     "@rush-temp/ssr-tests": {
-      "version": "file:projects/ssr-tests",
+      "version": "file:projects\\ssr-tests",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1592,7 +1592,7 @@
       }
     },
     "@rush-temp/styling": {
-      "version": "file:projects/styling",
+      "version": "file:projects\\styling",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1787,7 +1787,7 @@
       }
     },
     "@rush-temp/test-bundle-button": {
-      "version": "file:projects/test-bundle-button",
+      "version": "file:projects\\test-bundle-button",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1956,10 +1956,10 @@
       }
     },
     "@rush-temp/todo-app": {
-      "version": "file:projects/todo-app"
+      "version": "file:projects\\todo-app"
     },
     "@rush-temp/utilities": {
-      "version": "file:projects/utilities",
+      "version": "file:projects\\utilities",
       "dependencies": {
         "commander": {
           "version": "2.9.0",
@@ -2026,6 +2026,11 @@
       "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.39.tgz",
       "integrity": "sha1-9o1j24tpw46VWLQHNSXPlsT3qCk="
     },
+    "@types/node": {
+      "version": "8.0.26",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-8.0.26.tgz",
+      "integrity": "sha512-wbKN0MB4XsjdnSE04HiCzLoBDirGCM6zXrqavSj44nZnPFYpnrTF64E9O6Xmf0ca/IuKK/BHUcXwMiwk92gW6Q=="
+    },
     "@types/prop-types": {
       "version": "15.5.1",
       "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.5.1.tgz",
@@ -2062,19 +2067,19 @@
       "integrity": "sha1-MEQ4FkfhHulzxa8uklMjkw9pHYA="
     },
     "@uifabric/example-app-base": {
-      "version": "4.2.3",
-      "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-4.2.3.tgz",
-      "integrity": "sha512-aCLzsLbgzckDeQyK+bzNOXd9nLMRFsZCpS8VmQIdOn9w30q5gECqNC3SZpRZrJ8Pew+N5REpWPNS0Hp++N+AUQ=="
+      "version": "4.2.4",
+      "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-4.2.4.tgz",
+      "integrity": "sha512-L5NF7mzoZVIZ65u/blapDjzuVnPSnlyOWqDMjhV8BohpJks/crkSmCx8VqHx3a1aq9m++zQYrUwmBkqRZtIpnw=="
     },
     "@uifabric/styling": {
-      "version": "0.20.2",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.20.2.tgz",
-      "integrity": "sha512-POAynLm1clX1j+k7NGgV1PbXGTtofMYcxhpVmI1T9nRdo5pBHt8MuSH9GL4P255tkClW84bJe7l8b6eklcXa4g=="
+      "version": "0.21.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.21.1.tgz",
+      "integrity": "sha512-SlQwGCtqnN7SIklqi534nLMTVfjLkaK1QGmTxGq5BQutz/tiJNVIJ7hVuRMNI669TNu0Gf+nkIFPcEn56DxavQ=="
     },
     "@uifabric/utilities": {
-      "version": "4.10.3",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.10.3.tgz",
-      "integrity": "sha512-fmOaqFNHC/hlxvNNvltPnWvcgvHcGH9WR9CL7svnxDBdIncLwSeRpS+C2byCizjaIVWbkk/NEPh/esD6nrSktg=="
+      "version": "4.11.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.11.1.tgz",
+      "integrity": "sha512-5jqVkf90oEfRaaVvVjxcTknZtck/ULmLh/Usv3/Pc0SRW3m9JTfUdzaPTNYs7BrwtNXzCt9sII0RPcuJfLq/0g=="
     },
     "abbrev": {
       "version": "1.0.9",
@@ -2564,9 +2569,9 @@
       "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8="
     },
     "bowser": {
-      "version": "1.7.2",
-      "resolved": "https://registry.npmjs.org/bowser/-/bowser-1.7.2.tgz",
-      "integrity": "sha1-uUzGklumteB8QhpY5gHORhEmRXI="
+      "version": "1.7.3",
+      "resolved": "https://registry.npmjs.org/bowser/-/bowser-1.7.3.tgz",
+      "integrity": "sha1-UEvbQxGMqNucu63yj9YPJlr5bk8="
     },
     "brace-expansion": {
       "version": "1.1.8",
@@ -2679,14 +2684,14 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000718",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000718.tgz",
-      "integrity": "sha1-hs3ZeYcwJVSTTGHhBvTkcPFvmTw="
+      "version": "1.0.30000721",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000721.tgz",
+      "integrity": "sha1-zcUu/o+C3RORZhW3job3BOzmGAI="
     },
     "caniuse-lite": {
-      "version": "1.0.30000718",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000718.tgz",
-      "integrity": "sha1-DdJCkL6xExCy2A9rcKgjwqZab60="
+      "version": "1.0.30000721",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000721.tgz",
+      "integrity": "sha1-kxohp72FAWMAMo0h8SbYS3NDfTU="
     },
     "cardinal": {
       "version": "1.0.0",
@@ -3077,9 +3082,9 @@
       "integrity": "sha1-msfgL3Y8+F2UAXZmVl7WiltfMhU="
     },
     "css-loader": {
-      "version": "0.28.5",
-      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.5.tgz",
-      "integrity": "sha512-/FJmsDD8e6xZOBHMFShN/BCjnrEybq0spYaTZ1QoZ10/jhUa1LDDojQELu/JJ1ykZZjt0nSwkYrb2Mfx3bZx3Q==",
+      "version": "0.28.7",
+      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.7.tgz",
+      "integrity": "sha512-GxMpax8a/VgcfRrVy0gXD6yLd5ePYbXX/5zGgTVYp4wXtJklS8Z2VaUArJgc//f6/Dzil7BaJObdSv8eKKCPgg==",
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -3443,9 +3448,9 @@
       "integrity": "sha1-zIcsFoiArjxxiXYv1f/ACJbJUYo="
     },
     "electron-to-chromium": {
-      "version": "1.3.18",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.18.tgz",
-      "integrity": "sha1-PcyZ2j5rZl9qu8ccKK1Ros1zGpw="
+      "version": "1.3.19",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.19.tgz",
+      "integrity": "sha1-c9l7DosFqnds7fPNzn/cBTgDdnU="
     },
     "elliptic": {
       "version": "6.4.0",
@@ -3544,9 +3549,9 @@
       "integrity": "sha1-+FWobOYa3E6GIcPNoh56dhLDqNw="
     },
     "es-abstract": {
-      "version": "1.8.0",
-      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.8.0.tgz",
-      "integrity": "sha512-Cf9/h5MrXtExM20gSS55YFrGKCyPrRBjIVBtVyy8vmlsDfe0NPKMWj65tPLgzyfPuapWxh5whpXCtW4+AW5mRg=="
+      "version": "1.8.1",
+      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.8.1.tgz",
+      "integrity": "sha512-G6pkMLdmxF3dh4hbuYuQiku29rRqo9p5+iRf7mZTEELT/xZ/D9Vzg04ddlvzJuJuCmZp1WBbfbVLZEeygYNkpw=="
     },
     "es-to-primitive": {
       "version": "1.1.1",
@@ -3998,6 +4003,549 @@
       "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
       "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
     },
+    "fsevents": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.2.tgz",
+      "integrity": "sha512-Sn44E5wQW4bTHXvQmvSHwqbuiXtduD6Rrjm2ZtUEGbyrig+nUH3t/QD4M4/ZXViY556TBpRgZkHLDx3JxPwxiw==",
+      "optional": true,
+      "dependencies": {
+        "abbrev": {
+          "version": "1.1.0",
+          "bundled": true,
+          "optional": true
+        },
+        "ajv": {
+          "version": "4.11.8",
+          "bundled": true,
+          "optional": true
+        },
+        "ansi-regex": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "aproba": {
+          "version": "1.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "are-we-there-yet": {
+          "version": "1.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "asn1": {
+          "version": "0.2.3",
+          "bundled": true,
+          "optional": true
+        },
+        "assert-plus": {
+          "version": "0.2.0",
+          "bundled": true,
+          "optional": true
+        },
+        "asynckit": {
+          "version": "0.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "aws-sign2": {
+          "version": "0.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "aws4": {
+          "version": "1.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "balanced-match": {
+          "version": "0.4.2",
+          "bundled": true
+        },
+        "bcrypt-pbkdf": {
+          "version": "1.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "block-stream": {
+          "version": "0.0.9",
+          "bundled": true
+        },
+        "boom": {
+          "version": "2.10.1",
+          "bundled": true
+        },
+        "brace-expansion": {
+          "version": "1.1.7",
+          "bundled": true
+        },
+        "buffer-shims": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "caseless": {
+          "version": "0.12.0",
+          "bundled": true,
+          "optional": true
+        },
+        "co": {
+          "version": "4.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "code-point-at": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "combined-stream": {
+          "version": "1.0.5",
+          "bundled": true
+        },
+        "concat-map": {
+          "version": "0.0.1",
+          "bundled": true
+        },
+        "console-control-strings": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "core-util-is": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "cryptiles": {
+          "version": "2.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "dashdash": {
+          "version": "1.14.1",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "debug": {
+          "version": "2.6.8",
+          "bundled": true,
+          "optional": true
+        },
+        "deep-extend": {
+          "version": "0.4.2",
+          "bundled": true,
+          "optional": true
+        },
+        "delayed-stream": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "delegates": {
+          "version": "1.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "ecc-jsbn": {
+          "version": "0.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "extend": {
+          "version": "3.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "extsprintf": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "forever-agent": {
+          "version": "0.6.1",
+          "bundled": true,
+          "optional": true
+        },
+        "form-data": {
+          "version": "2.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "fs.realpath": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "fstream": {
+          "version": "1.0.11",
+          "bundled": true
+        },
+        "fstream-ignore": {
+          "version": "1.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "gauge": {
+          "version": "2.7.4",
+          "bundled": true,
+          "optional": true
+        },
+        "getpass": {
+          "version": "0.1.7",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "glob": {
+          "version": "7.1.2",
+          "bundled": true
+        },
+        "graceful-fs": {
+          "version": "4.1.11",
+          "bundled": true
+        },
+        "har-schema": {
+          "version": "1.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "har-validator": {
+          "version": "4.2.1",
+          "bundled": true,
+          "optional": true
+        },
+        "has-unicode": {
+          "version": "2.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "hawk": {
+          "version": "3.1.3",
+          "bundled": true,
+          "optional": true
+        },
+        "hoek": {
+          "version": "2.16.3",
+          "bundled": true
+        },
+        "http-signature": {
+          "version": "1.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "inflight": {
+          "version": "1.0.6",
+          "bundled": true
+        },
+        "inherits": {
+          "version": "2.0.3",
+          "bundled": true
+        },
+        "ini": {
+          "version": "1.3.4",
+          "bundled": true,
+          "optional": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "is-typedarray": {
+          "version": "1.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "isstream": {
+          "version": "0.1.2",
+          "bundled": true,
+          "optional": true
+        },
+        "jodid25519": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "jsbn": {
+          "version": "0.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "json-schema": {
+          "version": "0.2.3",
+          "bundled": true,
+          "optional": true
+        },
+        "json-stable-stringify": {
+          "version": "1.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "json-stringify-safe": {
+          "version": "5.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "jsonify": {
+          "version": "0.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "jsprim": {
+          "version": "1.4.0",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "mime-db": {
+          "version": "1.27.0",
+          "bundled": true
+        },
+        "mime-types": {
+          "version": "2.1.15",
+          "bundled": true
+        },
+        "minimatch": {
+          "version": "3.0.4",
+          "bundled": true
+        },
+        "minimist": {
+          "version": "0.0.8",
+          "bundled": true
+        },
+        "mkdirp": {
+          "version": "0.5.1",
+          "bundled": true
+        },
+        "ms": {
+          "version": "2.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "node-pre-gyp": {
+          "version": "0.6.36",
+          "bundled": true,
+          "optional": true
+        },
+        "nopt": {
+          "version": "4.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "npmlog": {
+          "version": "4.1.0",
+          "bundled": true,
+          "optional": true
+        },
+        "number-is-nan": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "oauth-sign": {
+          "version": "0.8.2",
+          "bundled": true,
+          "optional": true
+        },
+        "object-assign": {
+          "version": "4.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "once": {
+          "version": "1.4.0",
+          "bundled": true
+        },
+        "os-homedir": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "os-tmpdir": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "osenv": {
+          "version": "0.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "path-is-absolute": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "performance-now": {
+          "version": "0.2.0",
+          "bundled": true,
+          "optional": true
+        },
+        "process-nextick-args": {
+          "version": "1.0.7",
+          "bundled": true
+        },
+        "punycode": {
+          "version": "1.4.1",
+          "bundled": true,
+          "optional": true
+        },
+        "qs": {
+          "version": "6.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "rc": {
+          "version": "1.2.1",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "minimist": {
+              "version": "1.2.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "bundled": true
+        },
+        "request": {
+          "version": "2.81.0",
+          "bundled": true,
+          "optional": true
+        },
+        "rimraf": {
+          "version": "2.6.1",
+          "bundled": true
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "bundled": true
+        },
+        "semver": {
+          "version": "5.3.0",
+          "bundled": true,
+          "optional": true
+        },
+        "set-blocking": {
+          "version": "2.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "signal-exit": {
+          "version": "3.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "sntp": {
+          "version": "1.0.9",
+          "bundled": true,
+          "optional": true
+        },
+        "sshpk": {
+          "version": "1.13.0",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "string_decoder": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "string-width": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "stringstream": {
+          "version": "0.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "strip-ansi": {
+          "version": "3.0.1",
+          "bundled": true
+        },
+        "strip-json-comments": {
+          "version": "2.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "tar": {
+          "version": "2.2.1",
+          "bundled": true
+        },
+        "tar-pack": {
+          "version": "3.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "tough-cookie": {
+          "version": "2.3.2",
+          "bundled": true,
+          "optional": true
+        },
+        "tunnel-agent": {
+          "version": "0.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "tweetnacl": {
+          "version": "0.14.5",
+          "bundled": true,
+          "optional": true
+        },
+        "uid-number": {
+          "version": "0.0.6",
+          "bundled": true,
+          "optional": true
+        },
+        "util-deprecate": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "uuid": {
+          "version": "3.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "verror": {
+          "version": "1.3.6",
+          "bundled": true,
+          "optional": true
+        },
+        "wide-align": {
+          "version": "1.1.2",
+          "bundled": true,
+          "optional": true
+        },
+        "wrappy": {
+          "version": "1.0.2",
+          "bundled": true
+        }
+      }
+    },
     "fstream": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
@@ -4859,9 +5407,9 @@
       "integrity": "sha1-MzCvdWyralQnAMZLLk5KoGLVL/8="
     },
     "karma": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/karma/-/karma-1.7.0.tgz",
-      "integrity": "sha1-b3oaQGRG+i4YfslTmGmPTO5HYmk=",
+      "version": "1.7.1",
+      "resolved": "https://registry.npmjs.org/karma/-/karma-1.7.1.tgz",
+      "integrity": "sha512-k5pBjHDhmkdaUccnC7gE3mBzZjcxyxYsYVaqiL2G5AqlfLyBO5nw2VdNK+O16cveEPd/gIOWULH7gkiYYwVNHg==",
       "dependencies": {
         "lodash": {
           "version": "3.10.1",
@@ -4922,9 +5470,9 @@
       "integrity": "sha1-0jyjSAG9qYY60xjju0vUBisTrNI="
     },
     "karma-sinon-chai": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/karma-sinon-chai/-/karma-sinon-chai-1.3.1.tgz",
-      "integrity": "sha1-RjNBlJTZ4thIeH3XYFMDGFn1t/U="
+      "version": "1.3.2",
+      "resolved": "https://registry.npmjs.org/karma-sinon-chai/-/karma-sinon-chai-1.3.2.tgz",
+      "integrity": "sha512-JbV4xobGA4srGuR30YQszmgzv4YpKHpkQWSEBCBBj7OrCMSW4/9GIwtGLHMk/3sT94/b5zveVMR2CV5V2Y3dOg=="
     },
     "karma-webpack": {
       "version": "2.0.4",
@@ -5500,9 +6048,9 @@
       "integrity": "sha1-iZ8R2WhuXgXLkbNdXw5jt3PPyQE="
     },
     "nan": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/nan/-/nan-2.6.2.tgz",
-      "integrity": "sha1-5P805slf37WuzAjeZZb0NgWn20U="
+      "version": "2.7.0",
+      "resolved": "https://registry.npmjs.org/nan/-/nan-2.7.0.tgz",
+      "integrity": "sha1-2Vv3IeyHfgjbJ27T/G63j5CDrUY="
     },
     "nanomatch": {
       "version": "1.2.0",
@@ -5764,9 +6312,9 @@
       "integrity": "sha1-JKwXdDPkou6REP5DWAutBZ+gBQk="
     },
     "office-ui-fabric-react": {
-      "version": "4.37.5",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.37.5.tgz",
-      "integrity": "sha512-yCYM2BoESLdWjnsflQ3FTDJCeJikqfLJgSSlbKYtieJajhPKcDeulHmmhMEKEXA3xmcC8fsRxG2hQnmZKf52yA=="
+      "version": "4.37.7",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.37.7.tgz",
+      "integrity": "sha512-bdWrZtY1Z//s2vN9lgsdSxxye836QcOXpcd8ZNyq/dArqeJYamKwXWRGWOY2uOdKxjkt63u85lhdccP9ZKoCQg=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -7375,9 +7923,9 @@
       "integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8="
     },
     "resemblejs": {
-      "version": "2.2.4",
-      "resolved": "https://registry.npmjs.org/resemblejs/-/resemblejs-2.2.4.tgz",
-      "integrity": "sha1-g1JeKtt333fIrQhqGyUQ8DJ2DAg="
+      "version": "2.2.6",
+      "resolved": "https://registry.npmjs.org/resemblejs/-/resemblejs-2.2.6.tgz",
+      "integrity": "sha512-o4sxCTSwTxx5hBFXYn5rsgMuLQT8kufJ5vzKYcRwWhCWERKN4dqZwiMx7+nRrcXouWmiFGD9A486yS4Z1a2PQQ=="
     },
     "resolve": {
       "version": "1.4.0",
@@ -7971,9 +8519,9 @@
       }
     },
     "supports-color": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.2.1.tgz",
-      "integrity": "sha512-qxzYsob3yv6U+xMzPrv170y8AwGP7i74g+pbixCfD6rgso8BscLT2qXIuz6TpOaiJZ3mFgT5O9lyT9nMU4LfaA=="
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.4.0.tgz",
+      "integrity": "sha512-rKC3+DyXWgK0ZLKwmRsrkyHVZAjNkfzeehuFWdGGcqGDTZFH73+RH6S/RDAAxl9GusSjZSUWYLmT9N5pzXFOXQ=="
     },
     "svgo": {
       "version": "0.7.2",
@@ -8129,9 +8677,9 @@
       "integrity": "sha1-hR+1BSAcY9A0PFFybmNk9+mtLpk="
     },
     "tsutils": {
-      "version": "2.8.1",
-      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.8.1.tgz",
-      "integrity": "sha1-N3FATnyp8L7fXZGaR6SxiQpo7/8="
+      "version": "2.8.2",
+      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.8.2.tgz",
+      "integrity": "sha1-LBSGukMSYIRbCsb5Aq/Z1wio6mo="
     },
     "tty-browserify": {
       "version": "0.0.0",
@@ -8554,11 +9102,6 @@
         }
       }
     },
-    "webpack-node-externals": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/webpack-node-externals/-/webpack-node-externals-1.6.0.tgz",
-      "integrity": "sha1-Iyxi7GCSsQBjWj0p2DwXRxKN+b0="
-    },
     "webpack-notifier": {
       "version": "1.5.0",
       "resolved": "https://registry.npmjs.org/webpack-notifier/-/webpack-notifier-1.5.0.tgz",
@@ -8699,4 +9242,4 @@
       "integrity": "sha1-AI4G2AlDIMNy28L47XagymyKxBk="
     }
   }
-}
\ No newline at end of file
+}

From c1cc611c15c766de9e747c5d16759b0e95e0e4c3 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 31 Aug 2017 15:41:57 +0000
Subject: [PATCH 0537/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 22 +++++++++
 apps/fabric-website/CHANGELOG.md              |  9 +++-
 apps/fabric-website/package.json              |  6 +--
 .../local-storage-rtl_2017-08-28-15-55.json   | 11 -----
 .../fix-publish_2017-08-31-15-14.json         | 11 -----
 .../local-storage-rtl_2017-08-28-15-55.json   | 11 -----
 ...-hover-card-pref-fix_2017-08-28-23-48.json | 11 -----
 .../betrue-18pxCheck_2017-08-30-17-53.json    | 11 -----
 .../data-command-key_2017-08-29-12-37.json    | 11 -----
 ...-ComboBoxRerenderFix_2017-08-30-16-34.json | 11 -----
 ...ToTodayFunctionality_2017-08-23-20-36.json | 11 -----
 ...ltip-custom-maxwidth_2017-08-29-16-36.json | 11 -----
 packages/example-app-base/CHANGELOG.json      | 19 +++++++
 packages/example-app-base/CHANGELOG.md        |  9 +++-
 packages/example-app-base/package.json        |  4 +-
 packages/experiments/package.json             |  6 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 49 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 17 ++++++-
 packages/office-ui-fabric-react/package.json  |  6 +--
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 ++++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  2 +-
 23 files changed, 157 insertions(+), 116 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/local-storage-rtl_2017-08-28-15-55.json
 delete mode 100644 common/changes/@uifabric/fabric-website/fix-publish_2017-08-31-15-14.json
 delete mode 100644 common/changes/@uifabric/utilities/local-storage-rtl_2017-08-28-15-55.json
 delete mode 100644 common/changes/office-ui-fabric-react/anihan-hover-card-pref-fix_2017-08-28-23-48.json
 delete mode 100644 common/changes/office-ui-fabric-react/betrue-18pxCheck_2017-08-30-17-53.json
 delete mode 100644 common/changes/office-ui-fabric-react/data-command-key_2017-08-29-12-37.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxRerenderFix_2017-08-30-16-34.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-calendarGoToTodayFunctionality_2017-08-23-20-36.json
 delete mode 100644 common/changes/office-ui-fabric-react/tooltip-custom-maxwidth_2017-08-29-16-36.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index b085e1eee4423..04fecd062e023 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.7.5",
+      "tag": "@uifabric/fabric-website_v4.7.5",
+      "date": "Thu, 31 Aug 2017 15:41:56 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "98b8267ac0047f9b49718fda669da77fa361ec8a",
+            "comment": "Add @types/node dependency"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=4.2.4 <5.0.0` to `>=4.2.5 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.37.7 <5.0.0` to `>=4.38.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.7.4",
       "tag": "@uifabric/fabric-website_v4.7.4",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 4f45c6df0b5df..f83d21433dfd7 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Tue, 29 Aug 2017 20:55:35 GMT and should not be manually modified.
+This log was last generated on Thu, 31 Aug 2017 15:41:56 GMT and should not be manually modified.
+
+## 4.7.5
+Thu, 31 Aug 2017 15:41:56 GMT
+
+### Patches
+
+- Add @types/node dependency
 
 ## 4.7.4
 Tue, 29 Aug 2017 20:55:35 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 726cffd6e9f55..a91c12324f665 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.7.4",
+  "version": "4.7.5",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -41,10 +41,10 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/example-app-base": ">=4.2.4 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.5 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=4.37.7 <5.0.0",
+    "office-ui-fabric-react": ">=4.38.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/local-storage-rtl_2017-08-28-15-55.json b/common/changes/@uifabric/example-app-base/local-storage-rtl_2017-08-28-15-55.json
deleted file mode 100644
index 4cc702589f386..0000000000000
--- a/common/changes/@uifabric/example-app-base/local-storage-rtl_2017-08-28-15-55.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Refresh the page when swtiching languages to make sure that memoized styles are recomputed",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/fix-publish_2017-08-31-15-14.json b/common/changes/@uifabric/fabric-website/fix-publish_2017-08-31-15-14.json
deleted file mode 100644
index 61d0093600c95..0000000000000
--- a/common/changes/@uifabric/fabric-website/fix-publish_2017-08-31-15-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Add @types/node dependency",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/local-storage-rtl_2017-08-28-15-55.json b/common/changes/@uifabric/utilities/local-storage-rtl_2017-08-28-15-55.json
deleted file mode 100644
index 7567f3231724d..0000000000000
--- a/common/changes/@uifabric/utilities/local-storage-rtl_2017-08-28-15-55.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "RTL: Persist rtl settings between sessions",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/anihan-hover-card-pref-fix_2017-08-28-23-48.json b/common/changes/office-ui-fabric-react/anihan-hover-card-pref-fix_2017-08-28-23-48.json
deleted file mode 100644
index 9e29d8a9cb9f3..0000000000000
--- a/common/changes/office-ui-fabric-react/anihan-hover-card-pref-fix_2017-08-28-23-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "HoverCard: Improved performance of expanding animation.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "anihan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/betrue-18pxCheck_2017-08-30-17-53.json b/common/changes/office-ui-fabric-react/betrue-18pxCheck_2017-08-30-17-53.json
deleted file mode 100644
index 59195b3f2ad9a..0000000000000
--- a/common/changes/office-ui-fabric-react/betrue-18pxCheck_2017-08-30-17-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Check: Increased size of check to 18px",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "betrue@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/data-command-key_2017-08-29-12-37.json b/common/changes/office-ui-fabric-react/data-command-key_2017-08-29-12-37.json
deleted file mode 100644
index ed06ecfcaa095..0000000000000
--- a/common/changes/office-ui-fabric-react/data-command-key_2017-08-29-12-37.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix data-command-key to key instead of index.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "s@warmsea.net"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxRerenderFix_2017-08-30-16-34.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxRerenderFix_2017-08-30-16-34.json
deleted file mode 100644
index d58a6a210f2fa..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxRerenderFix_2017-08-30-16-34.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Loosen the re-rendering requirement",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/kegorr-calendarGoToTodayFunctionality_2017-08-23-20-36.json b/common/changes/office-ui-fabric-react/kegorr-calendarGoToTodayFunctionality_2017-08-23-20-36.json
deleted file mode 100644
index 63939411eeea0..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-calendarGoToTodayFunctionality_2017-08-23-20-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Updating goToToday to include onSelectDate function if defined so that this button behaves like a date has been picked",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/tooltip-custom-maxwidth_2017-08-29-16-36.json b/common/changes/office-ui-fabric-react/tooltip-custom-maxwidth_2017-08-29-16-36.json
deleted file mode 100644
index ae76cbe40d085..0000000000000
--- a/common/changes/office-ui-fabric-react/tooltip-custom-maxwidth_2017-08-29-16-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Tooltip: Added support for custom maxWidth values",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 8034f5315e3d2..baff10ce5fe49 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "4.2.5",
+      "tag": "@uifabric/example-app-base_v4.2.5",
+      "date": "Thu, 31 Aug 2017 15:41:56 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "7d9c47c1240c0877a023c3fb181b7870a695416a",
+            "comment": "Refresh the page when swtiching languages to make sure that memoized styles are recomputed"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.11.1 <5.0.0` to `>=4.12.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.2.4",
       "tag": "@uifabric/example-app-base_v4.2.4",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index 709f844247391..bf498b20d7b57 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Tue, 29 Aug 2017 20:55:35 GMT and should not be manually modified.
+This log was last generated on Thu, 31 Aug 2017 15:41:56 GMT and should not be manually modified.
+
+## 4.2.5
+Thu, 31 Aug 2017 15:41:56 GMT
+
+### Patches
+
+- Refresh the page when swtiching languages to make sure that memoized styles are recomputed
 
 ## 4.2.4
 Tue, 29 Aug 2017 20:55:35 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 016aac0c72539..2e30674054941 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "4.2.4",
+  "version": "4.2.5",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -37,7 +37,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=0.21.1 <1.0.0",
-    "@uifabric/utilities": ">=4.11.1 <5.0.0",
+    "@uifabric/utilities": ">=4.12.0 <5.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react": ">=4.4.0 <5.0.0",
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 9c09e324e0111..43cd6dbeacba2 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -26,7 +26,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=4.2.4 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.5 <5.0.0",
     "enzyme": "^2.7.0",
     "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
@@ -41,8 +41,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=4.10.2 <5.0.0",
-    "office-ui-fabric-react": ">=4.37.7 <5.0.0",
+    "@uifabric/utilities": ">=4.12.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.38.0 <5.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index feca27468e891..662f4bfa64921 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,55 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.38.0",
+      "tag": "office-ui-fabric-react_v4.38.0",
+      "date": "Thu, 31 Aug 2017 15:41:56 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Aniket Handa <atneik@users.noreply.github.com>",
+            "commit": "10f28f39fa209f5060e640ed836cd923c146e4e1",
+            "comment": "HoverCard: Improved performance of expanding animation."
+          },
+          {
+            "author": "Ben Truelove <betrue@microsoft.com>",
+            "commit": "5f87c4581c21e9ed06bbd5c3d3c83ae2bbe91571",
+            "comment": "Check: Increased size of check to 18px"
+          },
+          {
+            "author": "Su Su <s@warmsea.net>",
+            "commit": "3057b27ec363804bf03846f33a0bd0a3f84d0c63",
+            "comment": "Fix data-command-key to key instead of index."
+          },
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "ee34cf68c25e072751ecbcf82976a257943e5609",
+            "comment": "ComboBox: Loosen the re-rendering requirement"
+          }
+        ],
+        "minor": [
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "0e28d77ec626cac7a3b4b923fe4411879fae5225",
+            "comment": "Updating goToToday to include onSelectDate function if defined so that this button behaves like a date has been picked"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "b98edd1a253e498bb7b298cfa50ae76eee44b7db",
+            "comment": "Tooltip: Added support for custom maxWidth values"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.11.1 <5.0.0` to `>=4.12.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=4.2.4 <5.0.0` to `>=4.2.5 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.37.7",
       "tag": "office-ui-fabric-react_v4.37.7",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 3296fa7aebdbe..d097b0176336a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,21 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 29 Aug 2017 20:55:35 GMT and should not be manually modified.
+This log was last generated on Thu, 31 Aug 2017 15:41:56 GMT and should not be manually modified.
+
+## 4.38.0
+Thu, 31 Aug 2017 15:41:56 GMT
+
+### Minor changes
+
+- Updating goToToday to include onSelectDate function if defined so that this button behaves like a date has been picked
+- Tooltip: Added support for custom maxWidth values
+
+### Patches
+
+- HoverCard: Improved performance of expanding animation.
+- Check: Increased size of check to 18px
+- Fix data-command-key to key instead of index.
+- ComboBox: Loosen the re-rendering requirement
 
 ## 4.37.7
 Tue, 29 Aug 2017 20:55:35 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 6c8dc38a672ff..05f728132d09f 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.37.7",
+  "version": "4.38.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -26,7 +26,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=4.2.4 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.5 <5.0.0",
     "enzyme": "^2.7.0",
     "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=4.11.1 <5.0.0",
+    "@uifabric/utilities": ">=4.12.0 <5.0.0",
     "@uifabric/styling": ">=0.21.1 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 314a971a84aa8..a7b858e4d0308 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -28,7 +28,7 @@
     "react-dom": "^15.4.2"
   },
   "dependencies": {
-    "@uifabric/utilities": ">=4.11.1 <5.0.0",
+    "@uifabric/utilities": ">=4.12.0 <5.0.0",
     "tslib": "^1.7.1",
     "rtl-css-js": "^1.1.3",
     "glamor": "^2.20.40"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 4091d3bcc84c4..b4453cb35945f 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.12.0",
+      "tag": "@uifabric/utilities_v4.12.0",
+      "date": "Thu, 31 Aug 2017 15:41:56 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "7d9c47c1240c0877a023c3fb181b7870a695416a",
+            "comment": "RTL: Persist rtl settings between sessions"
+          }
+        ]
+      }
+    },
     {
       "version": "4.11.1",
       "tag": "@uifabric/utilities_v4.11.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 6539f8c5a07fa..d8da26d9dc921 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Tue, 29 Aug 2017 20:55:35 GMT and should not be manually modified.
+This log was last generated on Thu, 31 Aug 2017 15:41:56 GMT and should not be manually modified.
+
+## 4.12.0
+Thu, 31 Aug 2017 15:41:56 GMT
+
+### Minor changes
+
+- RTL: Persist rtl settings between sessions
 
 ## 4.11.1
 Tue, 29 Aug 2017 20:55:35 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 69a4f90ea2b9c..245604153830f 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.11.1",
+  "version": "4.12.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From fd435b3657df001d9a90b1ad0fc2e312a6643fa0 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 31 Aug 2017 11:24:14 -0700
Subject: [PATCH 0538/1641] Persist RTL setting in example-app-base (#2691)

* Example app base dependency cleanup

* Rush change

* Call SetRTL when we read from localStorage
---
 ...mple-app-base-persist_2017-08-31-16-13.json | 11 +++++++++++
 common/config/rush/npm-shrinkwrap.json         | 18 +++++++++---------
 packages/example-app-base/package.json         |  5 +----
 .../src/components/Header/Header.tsx           |  4 ++--
 .../PropertiesTable/PropertiesTable.tsx        |  2 +-
 packages/utilities/src/rtl.ts                  |  5 ++---
 6 files changed, 26 insertions(+), 19 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/example-app-base-persist_2017-08-31-16-13.json

diff --git a/common/changes/@uifabric/example-app-base/example-app-base-persist_2017-08-31-16-13.json b/common/changes/@uifabric/example-app-base/example-app-base-persist_2017-08-31-16-13.json
new file mode 100644
index 0000000000000..48603bbbf546c
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/example-app-base-persist_2017-08-31-16-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Persist RTL setting between page refreshes",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 348eee741deb5..8e27cec5f432e 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -2067,9 +2067,9 @@
       "integrity": "sha1-MEQ4FkfhHulzxa8uklMjkw9pHYA="
     },
     "@uifabric/example-app-base": {
-      "version": "4.2.4",
-      "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-4.2.4.tgz",
-      "integrity": "sha512-L5NF7mzoZVIZ65u/blapDjzuVnPSnlyOWqDMjhV8BohpJks/crkSmCx8VqHx3a1aq9m++zQYrUwmBkqRZtIpnw=="
+      "version": "4.2.5",
+      "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-4.2.5.tgz",
+      "integrity": "sha512-o18n/zKj8KTQ2JDHBoQtjUPRJkd0I3lwAK017+3UlA/Suh0V3AxjfXSN+4v1hq7SAcjTnoaMctJ0q+ux+/61ww=="
     },
     "@uifabric/styling": {
       "version": "0.21.1",
@@ -2077,9 +2077,9 @@
       "integrity": "sha512-SlQwGCtqnN7SIklqi534nLMTVfjLkaK1QGmTxGq5BQutz/tiJNVIJ7hVuRMNI669TNu0Gf+nkIFPcEn56DxavQ=="
     },
     "@uifabric/utilities": {
-      "version": "4.11.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.11.1.tgz",
-      "integrity": "sha512-5jqVkf90oEfRaaVvVjxcTknZtck/ULmLh/Usv3/Pc0SRW3m9JTfUdzaPTNYs7BrwtNXzCt9sII0RPcuJfLq/0g=="
+      "version": "4.12.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.12.0.tgz",
+      "integrity": "sha512-Udgu19qBxsT+s5Z50OhM/tMAok3WBlB6lUkxVjs8W8ZeGkPefqp5T6vb5o4pKZNrjM4poYDVVBe3veJTmEXR2Q=="
     },
     "abbrev": {
       "version": "1.0.9",
@@ -6312,9 +6312,9 @@
       "integrity": "sha1-JKwXdDPkou6REP5DWAutBZ+gBQk="
     },
     "office-ui-fabric-react": {
-      "version": "4.37.7",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.37.7.tgz",
-      "integrity": "sha512-bdWrZtY1Z//s2vN9lgsdSxxye836QcOXpcd8ZNyq/dArqeJYamKwXWRGWOY2uOdKxjkt63u85lhdccP9ZKoCQg=="
+      "version": "4.38.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.38.0.tgz",
+      "integrity": "sha512-xrPQzOcv8uud2MgFkNi2yNMUuv66Iv1j+xb1T5N1G2XzZBtGkwk/2Zeg6x6ZndYKVJffY2FlXW6PvMZOh14Kjw=="
     },
     "on-finished": {
       "version": "2.3.0",
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 2e30674054941..c9c33f7e91c66 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -36,11 +36,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.21.1 <1.0.0",
-    "@uifabric/utilities": ">=4.12.0 <5.0.0",
     "highlight.js": "^9.9.0",
-    "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react": ">=4.4.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.38.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/example-app-base/src/components/Header/Header.tsx b/packages/example-app-base/src/components/Header/Header.tsx
index eb8b2b1ad8644..9a3be29eaef61 100644
--- a/packages/example-app-base/src/components/Header/Header.tsx
+++ b/packages/example-app-base/src/components/Header/Header.tsx
@@ -9,7 +9,7 @@ import { FocusZone, FocusZoneDirection } from 'office-ui-fabric-react/lib/FocusZ
 import { withResponsiveMode, ResponsiveMode } from 'office-ui-fabric-react/lib/utilities/decorators/withResponsiveMode';
 import { Icon } from 'office-ui-fabric-react/lib/Icon';
 import './Header.scss';
-import { FontClassNames } from '@uifabric/styling/lib/index';
+import { FontClassNames } from 'office-ui-fabric-react/lib/Styling';
 
 export interface IHeaderProps {
   title: string;
@@ -129,7 +129,7 @@ export class Header extends React.Component<IHeaderProps, IHeaderState> {
   }
 
   private _onRTLToggled(ev: React.MouseEvent<HTMLElement>): void {
-    setRTL(!this._isRTLEnabled);
+    setRTL(!this._isRTLEnabled, true);
     location.reload();
   }
 
diff --git a/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx b/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx
index 808c84316294b..5fd9cf9777063 100644
--- a/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx
+++ b/packages/example-app-base/src/components/PropertiesTable/PropertiesTable.tsx
@@ -8,7 +8,7 @@ import {
   IEnumProperty,
   InterfacePropertyType
 } from '../../utilities/parser/index';
-import { FontClassNames } from '@uifabric/styling/lib/index';
+import { FontClassNames } from 'office-ui-fabric-react/lib/Styling';
 
 export interface IPropertiesTableProps {
   title?: string;
diff --git a/packages/utilities/src/rtl.ts b/packages/utilities/src/rtl.ts
index 2cec71d69074d..3e80c51a9d93f 100644
--- a/packages/utilities/src/rtl.ts
+++ b/packages/utilities/src/rtl.ts
@@ -12,14 +12,13 @@ let _isRTL: boolean | undefined;
  */
 export function getRTL(): boolean {
   if (_isRTL === undefined) {
-    let doc = getDocument();
-
     let savedRTL = getItem(RTL_LOCAL_STORAGE_KEY);
-
     if (savedRTL !== null) {
       _isRTL = savedRTL === '1';
+      setRTL(_isRTL);
     }
 
+    let doc = getDocument();
     if (_isRTL === undefined && doc) {
       _isRTL = doc.documentElement.getAttribute('dir') === 'rtl';
     }

From 9a5a9e2f3583ffda8e60a155f96c800e28a9af47 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Thu, 31 Aug 2017 12:09:59 -0700
Subject: [PATCH 0539/1641] Layout group (#2692)

* layout group

* Updated props

* link fixes

* lint fixes and suggestions

* missing semi colon
---
 packages/experiments/package.json             |  1 +
 packages/experiments/src/LayoutGroup.ts       |  2 +
 .../LayoutGroup/LayoutGroup.props.ts          | 24 +++++
 .../components/LayoutGroup/LayoutGroup.tsx    | 80 +++++++++++++++
 .../LayoutGroup/LayoutGroupPage.tsx           | 57 +++++++++++
 .../examples/LayoutGroup.Basic.Example.tsx    | 98 +++++++++++++++++++
 .../src/components/LayoutGroup/index.ts       |  3 +
 .../experiments/src/demo/AppDefinition.tsx    |  6 ++
 8 files changed, 271 insertions(+)
 create mode 100644 packages/experiments/src/LayoutGroup.ts
 create mode 100644 packages/experiments/src/components/LayoutGroup/LayoutGroup.props.ts
 create mode 100644 packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx
 create mode 100644 packages/experiments/src/components/LayoutGroup/LayoutGroupPage.tsx
 create mode 100644 packages/experiments/src/components/LayoutGroup/examples/LayoutGroup.Basic.Example.tsx
 create mode 100644 packages/experiments/src/components/LayoutGroup/index.ts

diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 43cd6dbeacba2..b9ac4927bbe6b 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -41,6 +41,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
+    "@uifabric/styling": ">=0.21.1 <1.0.0",
     "@uifabric/utilities": ">=4.12.0 <5.0.0",
     "office-ui-fabric-react": ">=4.38.0 <5.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/src/LayoutGroup.ts b/packages/experiments/src/LayoutGroup.ts
new file mode 100644
index 0000000000000..deee55c6ce084
--- /dev/null
+++ b/packages/experiments/src/LayoutGroup.ts
@@ -0,0 +1,2 @@
+
+export * from './components/LayoutGroup/index';
diff --git a/packages/experiments/src/components/LayoutGroup/LayoutGroup.props.ts b/packages/experiments/src/components/LayoutGroup/LayoutGroup.props.ts
new file mode 100644
index 0000000000000..b46afd6386eae
--- /dev/null
+++ b/packages/experiments/src/components/LayoutGroup/LayoutGroup.props.ts
@@ -0,0 +1,24 @@
+
+import * as React from 'react';
+import { IBaseProps } from 'office-ui-fabric-react/lib/Utilities';
+import { LayoutGroup } from './LayoutGroup';
+
+export interface ILayoutGroupProps extends IBaseProps, React.HTMLAttributes<LayoutGroup> {
+  /**
+   * Direction in which the child elements will be layed out.
+   * @default vertical
+   */
+  direction?: 'vertical' | 'horizontal';
+
+  /**
+   * Number of pixels between each element. No gap applied to last child.
+   * @default 8
+   */
+  gap?: number;
+
+  /**
+   * Method in which children fit into the layout group. Most useful with horizontal direction.
+   * @default start
+   */
+  justify?: 'start' | 'end' | 'center' | 'fill';
+}
diff --git a/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx b/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx
new file mode 100644
index 0000000000000..3d977ef8266d7
--- /dev/null
+++ b/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx
@@ -0,0 +1,80 @@
+
+import * as React from 'react';
+import { ILayoutGroupProps } from './LayoutGroup.props';
+import { mergeStyles } from '@uifabric/styling';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+
+export class LayoutGroup extends React.Component<ILayoutGroupProps, {}> {
+
+  public static defaultProps: ILayoutGroupProps = {
+    gap: 8,
+    direction: 'vertical',
+    justify: 'start'
+  };
+
+  public render(): JSX.Element | null {
+    const {
+      children,
+      direction,
+      gap,
+      justify
+    } = this.props;
+
+    const numberOfChildren = React.Children.count(children);
+
+    const group = React.Children.map(children, (child: React.ReactChild, i: number) => {
+      const isLastChild = i === numberOfChildren - 1;
+
+      return (
+        <div
+          className={
+            mergeStyles(
+              'ms-LayoutGroup-item',
+              direction === 'horizontal' && !isLastChild && {
+                marginRight: gap + 'px'
+              },
+              direction === 'vertical' && !isLastChild && {
+                marginBottom: gap + 'px'
+              },
+              justify === 'fill' && {
+                flexBasis: 0,
+                flexGrow: 1
+              }
+
+            ) as string
+          }
+        >
+          { child }
+        </div>
+      );
+    });
+
+    return (
+      <div
+        className={
+          mergeStyles(
+            'ms-LayoutGroup',
+            {
+              display: 'flex',
+              flexDirection: direction === 'horizontal' ? 'row' : 'column',
+              justifyContent: this._getJustify(justify)
+            }
+          ) as string
+        }
+      >
+        { group }
+      </div>
+    );
+  }
+
+  @autobind
+  private _getJustify(justify: string | undefined): string {
+    if (justify === 'end') {
+      return 'flex-end';
+    } else if (justify === 'center') {
+      return 'center';
+    } else {
+      return 'flex-start';
+    }
+  }
+}
diff --git a/packages/experiments/src/components/LayoutGroup/LayoutGroupPage.tsx b/packages/experiments/src/components/LayoutGroup/LayoutGroupPage.tsx
new file mode 100644
index 0000000000000..96edc7e0d916d
--- /dev/null
+++ b/packages/experiments/src/components/LayoutGroup/LayoutGroupPage.tsx
@@ -0,0 +1,57 @@
+import * as React from 'react';
+import {
+  ExampleCard,
+  IComponentDemoPageProps,
+  ComponentPage,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+
+import { LayoutGroupBasicExample } from './examples/LayoutGroup.Basic.Example';
+const LayoutGroupBasicExampleCode =
+  require('!raw-loader!experiments/src/components/LayoutGroup/examples/LayoutGroup.Basic.Example.tsx') as string;
+
+export class LayoutGroupPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render(): JSX.Element {
+    return (
+      <ComponentPage
+        title='LayoutGroup'
+        componentName='LayoutGroup'
+        exampleCards={
+          <div>
+            <ExampleCard title='Folder Cover' isOptIn={ true } code={ LayoutGroupBasicExampleCode }>
+              <LayoutGroupBasicExample />
+            </ExampleCard>
+          </div>
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!experiments/src/components/LayoutGroup/LayoutGroup.props.ts')
+            ] }
+          />
+        }
+        overview={
+          <div />
+        }
+        bestPractices={
+          <div />
+        }
+        dos={
+          <div>
+            <ul>
+              <li>Use them to represent a folder which may contain visual content.</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul>
+              <li>To represent the concept of a folder as opposed to an actual folder item.</li>
+            </ul>
+          </div>
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }
+      />
+    );
+  }
+}
diff --git a/packages/experiments/src/components/LayoutGroup/examples/LayoutGroup.Basic.Example.tsx b/packages/experiments/src/components/LayoutGroup/examples/LayoutGroup.Basic.Example.tsx
new file mode 100644
index 0000000000000..56e84992583ce
--- /dev/null
+++ b/packages/experiments/src/components/LayoutGroup/examples/LayoutGroup.Basic.Example.tsx
@@ -0,0 +1,98 @@
+
+import * as React from 'react';
+import { LayoutGroup } from '../LayoutGroup';
+import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
+import { Dropdown } from 'office-ui-fabric-react/lib/Dropdown';
+import { TextField } from 'office-ui-fabric-react/lib/TextField';
+import { ChoiceGroup } from 'office-ui-fabric-react/lib/ChoiceGroup';
+import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
+import { Label } from 'office-ui-fabric-react/lib/Label';
+
+export class LayoutGroupBasicExample extends React.Component<{}, {}> {
+  public render(): JSX.Element {
+    return (
+      <div>
+        <h3>Layout Group</h3>
+
+        <LayoutGroup gap={ 20 } direction='vertical'>
+          <h2 >A List of Inputs</h2>
+          <Dropdown
+            placeHolder='Select an Option'
+            label='Basic uncontrolled example:'
+            id='Basicdrop1'
+            ariaLabel='Basic dropdown example'
+            options={
+              [
+                { key: 'A', text: 'Option a' },
+                { key: 'B', text: 'Option b' },
+                { key: 'C', text: 'Option c' },
+                { key: 'D', text: 'Option d' },
+                { key: 'E', text: 'Option e' },
+                { key: 'F', text: 'Option f' },
+                { key: 'G', text: 'Option g' },
+                { key: 'H', text: 'Option h' },
+                { key: 'I', text: 'Option i' },
+                { key: 'J', text: 'Option j' },
+              ]
+            }
+          />
+          <LayoutGroup gap={ 20 } direction='horizontal' justify='fill'>
+            <TextField label='TextField with a placeholder' placeholder='Now I am a Placeholder' ariaLabel='Please enter text here' />
+            <TextField label='TextField with an icon' iconProps={ { iconName: 'Calendar' } } />
+          </LayoutGroup>
+
+          <LayoutGroup gap={ 20 } direction='horizontal' justify='fill'>
+            <ChoiceGroup
+              defaultSelectedKey='B'
+              options={ [
+                {
+                  key: 'A',
+                  text: 'Option A'
+                },
+                {
+                  key: 'B',
+                  text: 'Option B',
+                },
+                {
+                  key: 'C',
+                  text: 'Option C',
+                  disabled: true
+                },
+                {
+                  key: 'D',
+                  text: 'Option D',
+                  disabled: true
+                }
+              ] }
+              label='Pick one'
+              required={ true }
+            />
+            <LayoutGroup gap={ 10 }>
+              <Label>Pick a few</Label>
+              <Checkbox
+                label='Checkbox A'
+              />
+              <Checkbox
+                label='Checkbox A'
+              />
+              <Checkbox
+                label='Checkbox A'
+              />
+              <Checkbox
+                label='Checkbox A'
+              />
+              <Checkbox
+                label='Checkbox A'
+              />
+            </LayoutGroup>
+          </LayoutGroup>
+
+          <PrimaryButton>
+            Submit
+          </PrimaryButton>
+
+        </LayoutGroup>
+      </div>
+    );
+  }
+}
diff --git a/packages/experiments/src/components/LayoutGroup/index.ts b/packages/experiments/src/components/LayoutGroup/index.ts
new file mode 100644
index 0000000000000..0da62dab98d62
--- /dev/null
+++ b/packages/experiments/src/components/LayoutGroup/index.ts
@@ -0,0 +1,3 @@
+
+export * from './LayoutGroup.props';
+export * from './LayoutGroup';
diff --git a/packages/experiments/src/demo/AppDefinition.tsx b/packages/experiments/src/demo/AppDefinition.tsx
index b8c2b1c7189e1..b262e1a972458 100644
--- a/packages/experiments/src/demo/AppDefinition.tsx
+++ b/packages/experiments/src/demo/AppDefinition.tsx
@@ -22,6 +22,12 @@ export const AppDefinition: IAppDefinition = {
           name: 'FolderCover',
           url: '#/examples/foldercover'
         },
+        {
+          component: require<any>('../components/LayoutGroup/LayoutGroupPage').LayoutGroupPage,
+          key: 'LayoutGroup',
+          name: 'LayoutGroup',
+          url: '#/examples/layoutgroup'
+        },
         {
           component: require<any>('../components/Tile/TilePage').TilePage,
           key: 'Tile',

From deaa838ce0d07e1ff2bf4a414a41d88c787d987d Mon Sep 17 00:00:00 2001
From: Marc Fargas <telenieko@telenieko.com>
Date: Thu, 31 Aug 2017 22:07:32 +0200
Subject: [PATCH 0540/1641] Remove missing content from Contents (#2694)

The "Contents" index in README.md includes references to sections that do not exist.
---
 README.md | 2 --
 1 file changed, 2 deletions(-)

diff --git a/README.md b/README.md
index 3954990de16ff..63daf15a9bebd 100644
--- a/README.md
+++ b/README.md
@@ -13,8 +13,6 @@ Fabric React is a responsive, mobile-first collection of robust components desig
 - [Get started](#get-started)
 - [Testing](#testing)
 - [Advanced usage](#advanced-usage)
-- [Roadmap](#roadmap)
-- [Trello board](#trello-board)
 - [Browser support](#browser-support)
 - [Contribute to Fabric React](#contribute-to-fabric-react)
 - [Licenses](#licenses)

From 12102f19df80c0eb6116e599bdfdce055389372a Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 31 Aug 2017 14:13:35 -0700
Subject: [PATCH 0541/1641] Add resize group to fabric-website (#2696)

* Update json loader name from json to json-loader

* Add resize group to component page

* Rush change

* Revert "Update json loader name from json to json-loader"

This reverts commit b76b38ca5563e390cede6e1c52b88cc4a82bb410.
---
 .../src/components/App/AppState.tsx           |  6 ++++
 .../Components/ResizeGroupComponentPage.tsx   | 33 +++++++++++++++++++
 ...ize-group-to-website_2017-08-31-20-40.json | 11 +++++++
 ...ize-group-to-website_2017-08-31-20-40.json | 11 +++++++
 .../ResizeGroup/ResizeGroupPage.tsx           |  1 +
 5 files changed, 62 insertions(+)
 create mode 100644 apps/fabric-website/src/pages/Components/ResizeGroupComponentPage.tsx
 create mode 100644 common/changes/@uifabric/fabric-website/add-resize-group-to-website_2017-08-31-20-40.json
 create mode 100644 common/changes/office-ui-fabric-react/add-resize-group-to-website_2017-08-31-20-40.json

diff --git a/apps/fabric-website/src/components/App/AppState.tsx b/apps/fabric-website/src/components/App/AppState.tsx
index 75bd7ae75e4b8..547f3ea1dfb24 100644
--- a/apps/fabric-website/src/components/App/AppState.tsx
+++ b/apps/fabric-website/src/components/App/AppState.tsx
@@ -290,6 +290,12 @@ export const AppState: IAppState = {
           component: () => <LoadingComponent title='Rating' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/RatingComponentPage').RatingComponentPage))
         },
+        {
+          title: 'ResizeGroup',
+          url: '#/components/resizegroup',
+          component: () => <LoadingComponent title='ResizeGroup' />,
+          getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/ResizeGroupComponentPage').ResizeGroupComponentPage))
+        },
         {
           title: 'SearchBox',
           url: '#/components/searchbox',
diff --git a/apps/fabric-website/src/pages/Components/ResizeGroupComponentPage.tsx b/apps/fabric-website/src/pages/Components/ResizeGroupComponentPage.tsx
new file mode 100644
index 0000000000000..5588bddd728c0
--- /dev/null
+++ b/apps/fabric-website/src/pages/Components/ResizeGroupComponentPage.tsx
@@ -0,0 +1,33 @@
+import * as React from 'react';
+import { ResizeGroupPage } from 'office-ui-fabric-react/lib/components/ResizeGroup/ResizeGroupPage';
+import { PageHeader } from '../../components/PageHeader/PageHeader';
+import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+
+export class ResizeGroupComponentPage extends React.Component<any, any> {
+  public render() {
+    return (
+      <div ref='pageElement'>
+        <ComponentPage>
+          <PageHeader pageTitle='ResizeGroupPage' backgroundColor='#038387'
+            links={
+              [
+                {
+                  'text': 'Overview',
+                  'location': 'Overview'
+                },
+                {
+                  'text': 'Variants',
+                  'location': 'Variants'
+                },
+                {
+                  'text': 'Implementation',
+                  'location': 'Implementation'
+                }
+              ]
+            } />
+          <ResizeGroupPage isHeaderVisible={ false } />
+        </ComponentPage>
+      </div>
+    );
+  }
+}
diff --git a/common/changes/@uifabric/fabric-website/add-resize-group-to-website_2017-08-31-20-40.json b/common/changes/@uifabric/fabric-website/add-resize-group-to-website_2017-08-31-20-40.json
new file mode 100644
index 0000000000000..ca05fc0e82b1b
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/add-resize-group-to-website_2017-08-31-20-40.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Publish resize group on fabric-website",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/add-resize-group-to-website_2017-08-31-20-40.json b/common/changes/office-ui-fabric-react/add-resize-group-to-website_2017-08-31-20-40.json
new file mode 100644
index 0000000000000..5a348849528ac
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/add-resize-group-to-website_2017-08-31-20-40.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Respect ths isHeader property on the ResizeGroup demo page",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
index a529096e397f5..c833bb8fa6e05 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
@@ -92,6 +92,7 @@ export class ResizeGroupPage extends React.Component<any, any> {
             </ul>
           </div>
         }
+        isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
   }

From 55878db9b288ea9ad5e86a357158358e3a238e49 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 31 Aug 2017 15:26:45 -0700
Subject: [PATCH 0542/1641] BaseButton: Set the right classname on the menu
 icon (#2697)

* The menu icon has the wrong classname applied in base button

* Rush change
---
 ...chrisgo-basebutton_menu_icon_2017-08-31-22-13.json | 11 +++++++++++
 .../src/components/Button/BaseButton.tsx              |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/chrisgo-basebutton_menu_icon_2017-08-31-22-13.json

diff --git a/common/changes/office-ui-fabric-react/chrisgo-basebutton_menu_icon_2017-08-31-22-13.json b/common/changes/office-ui-fabric-react/chrisgo-basebutton_menu_icon_2017-08-31-22-13.json
new file mode 100644
index 0000000000000..e90586f47ec51
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/chrisgo-basebutton_menu_icon_2017-08-31-22-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "BaseButton: Put the right classname on the menu icon",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index ee15cb9d8a6cc..7faeac17093d4 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -337,7 +337,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       menuIconProps ?
         <Icon
           { ...menuIconProps }
-          className={ this._classNames.icon }
+          className={ this._classNames.menuIcon }
         />
         :
         null

From abb748f678c2b75c3019f2f75044e1b1b32b229f Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 31 Aug 2017 15:27:47 -0700
Subject: [PATCH 0543/1641] Integrating Jest in merge-styles (#2682)

* Updating to use jest.

* Tweaking to use a custom reporter.

* Pressing f5 now is able to run tests in the current project and hit debugger; statements.

* Adding coverage option for production builds.

* Fixing ssr-tests to webpack correctly, fixing webpack task to output errors correctly.

* Fixing regex to not run js files.
---
 .vscode/launch.json                           |   25 +-
 apps/ssr-tests/webpack.config.js              |    1 +
 common/config/rush/npm-shrinkwrap.json        | 2645 ++++++++++-------
 packages/merge-styles/jest.config.js          |    3 +
 packages/merge-styles/karma.config.js         |  111 -
 packages/merge-styles/package.json            |    6 +-
 packages/merge-styles/src/common/tests.ts     |   16 -
 .../merge-styles/src/concatStyleSets.test.ts  |    3 +-
 packages/merge-styles/src/fontFace.test.ts    |    3 +-
 packages/merge-styles/src/keyframes.test.ts   |    5 +-
 .../merge-styles/src/mergeStyleSets.test.ts   |    5 +-
 packages/merge-styles/src/mergeStyles.test.ts |   17 +-
 packages/merge-styles/src/server.test.ts      |    6 +-
 .../merge-styles/src/styleToClassName.test.ts |   45 +-
 .../src/transforms/kebabRules.test.ts         |    6 +-
 .../src/transforms/prefixRules.test.ts        |   11 +-
 .../src/transforms/provideUnits.test.ts       |    8 +-
 .../src/transforms/rtlifyRules.test.ts        |   10 +-
 packages/merge-styles/tsconfig.json           |    4 +-
 scripts/build.js                              |    1 +
 scripts/debug-test.js                         |   13 +
 scripts/exec-sync.js                          |    4 +-
 scripts/find-config.js                        |   21 +
 scripts/package.json                          |    2 +
 scripts/start-test.js                         |    3 +
 scripts/tasks/jest-reporter.js                |   18 +
 scripts/tasks/jest-resources.js               |   24 +
 scripts/tasks/jest.js                         |   16 +
 scripts/tasks/sass.js                         |   87 +-
 scripts/tasks/webpack.js                      |    7 +-
 30 files changed, 1783 insertions(+), 1343 deletions(-)
 create mode 100644 packages/merge-styles/jest.config.js
 delete mode 100644 packages/merge-styles/karma.config.js
 delete mode 100644 packages/merge-styles/src/common/tests.ts
 create mode 100644 scripts/debug-test.js
 create mode 100644 scripts/find-config.js
 create mode 100644 scripts/start-test.js
 create mode 100644 scripts/tasks/jest-reporter.js
 create mode 100644 scripts/tasks/jest-resources.js
 create mode 100644 scripts/tasks/jest.js

diff --git a/.vscode/launch.json b/.vscode/launch.json
index 8ef25390f8459..ea7d8e1ca1891 100644
--- a/.vscode/launch.json
+++ b/.vscode/launch.json
@@ -2,7 +2,27 @@
   "version": "0.2.0",
   "configurations": [
     {
-      "name": "Launch",
+      "name": "Debug test",
+      "type": "node",
+      "request": "launch",
+      "program": "${workspaceRoot}/scripts/debug-test.js",
+      "cwd": "${fileDirname}",
+      "stopOnEntry": false,
+      "args": [
+        "-i"
+      ],
+      "runtimeExecutable": null,
+      "runtimeArgs": [
+        "--nolazy",
+        "--debug"
+      ],
+      "env": {
+        "NODE_ENV": "development"
+      },
+      "sourceMaps": true
+    },
+    {
+      "name": "Debug build",
       "type": "node",
       "request": "launch",
       "program": "${workspaceRoot}/scripts/build.js",
@@ -20,8 +40,7 @@
       ],
       "env": {
         "NODE_ENV": "development"
-      },
-      "sourceMaps": false
+      }
     },
     {
       "name": "Run ssr tests",
diff --git a/apps/ssr-tests/webpack.config.js b/apps/ssr-tests/webpack.config.js
index 9c15a6ffe071b..9f91f0ab47266 100644
--- a/apps/ssr-tests/webpack.config.js
+++ b/apps/ssr-tests/webpack.config.js
@@ -21,6 +21,7 @@ module.exports = resources.createConfig(
       alias: {
         'office-ui-fabric-react/src': path.join(__dirname, '../../packages/office-ui-fabric-react/src'),
         'office-ui-fabric-react/lib': path.join(__dirname, '../../packages/office-ui-fabric-react/lib'),
+        '@uifabric/styling/lib': path.join(__dirname, '../../packages/styling/lib'),
         'Props.ts.js': 'Props'
       },
       extensions: ['.js', '.tsx']
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 8e27cec5f432e..d93b33b49876b 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -4,17 +4,17 @@
   "lockfileVersion": 1,
   "dependencies": {
     "@microsoft/load-themed-styles": {
-      "version": "1.7.3",
-      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.3.tgz",
-      "integrity": "sha1-vECKxo5op1L8tB9QMUkco2hSPr0="
+      "version": "1.7.4",
+      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.4.tgz",
+      "integrity": "sha1-3SU9gMgiCRPSerBu5WxLLsRR89M="
     },
     "@microsoft/loader-load-themed-styles": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.5.0.tgz",
-      "integrity": "sha1-zt/Y9nepJoVnM8C1Y4RkNaChJ8E="
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.5.1.tgz",
+      "integrity": "sha1-Y1VyRApbBFYM35zrC7OKTVbGSfQ="
     },
     "@rush-temp/build": {
-      "version": "file:projects\\build",
+      "version": "file:projects/build",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -347,7 +347,7 @@
       }
     },
     "@rush-temp/example-app-base": {
-      "version": "file:projects\\example-app-base",
+      "version": "file:projects/example-app-base",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -582,7 +582,7 @@
       }
     },
     "@rush-temp/experiments": {
-      "version": "file:projects\\experiments",
+      "version": "file:projects/experiments",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -833,7 +833,7 @@
       }
     },
     "@rush-temp/fabric-website": {
-      "version": "file:projects\\fabric-website",
+      "version": "file:projects/fabric-website",
       "dependencies": {
         "@types/react-addons-test-utils": {
           "version": "0.14.19",
@@ -1080,7 +1080,7 @@
       }
     },
     "@rush-temp/merge-styles": {
-      "version": "file:projects\\merge-styles",
+      "version": "file:projects/merge-styles",
       "dependencies": {
         "commander": {
           "version": "2.9.0",
@@ -1109,7 +1109,7 @@
       }
     },
     "@rush-temp/office-ui-fabric-react": {
-      "version": "file:projects\\office-ui-fabric-react",
+      "version": "file:projects/office-ui-fabric-react",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1360,10 +1360,10 @@
       }
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
-      "version": "file:projects\\office-ui-fabric-react-tslint"
+      "version": "file:projects/office-ui-fabric-react-tslint"
     },
     "@rush-temp/ssr-tests": {
-      "version": "file:projects\\ssr-tests",
+      "version": "file:projects/ssr-tests",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1592,7 +1592,7 @@
       }
     },
     "@rush-temp/styling": {
-      "version": "file:projects\\styling",
+      "version": "file:projects/styling",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1787,7 +1787,7 @@
       }
     },
     "@rush-temp/test-bundle-button": {
-      "version": "file:projects\\test-bundle-button",
+      "version": "file:projects/test-bundle-button",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1956,10 +1956,10 @@
       }
     },
     "@rush-temp/todo-app": {
-      "version": "file:projects\\todo-app"
+      "version": "file:projects/todo-app"
     },
     "@rush-temp/utilities": {
-      "version": "file:projects\\utilities",
+      "version": "file:projects/utilities",
       "dependencies": {
         "commander": {
           "version": "2.9.0",
@@ -2021,6 +2021,11 @@
       "resolved": "https://registry.npmjs.org/@types/highlight.js/-/highlight.js-9.1.9.tgz",
       "integrity": "sha1-7WM2lV6vIzt163kjubHzc9BF7wE="
     },
+    "@types/jest": {
+      "version": "20.0.8",
+      "resolved": "https://registry.npmjs.org/@types/jest/-/jest-20.0.8.tgz",
+      "integrity": "sha512-+vFMPCwOffrTy685X9Kj+Iz83I56Q8j0JK6xvsm6TA5qxbtPUJZcXtJY05WMGlhCKp/9qbpRCwyOp6GkMuyuLg=="
+    },
     "@types/mocha": {
       "version": "2.2.39",
       "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.39.tgz",
@@ -2081,6 +2086,11 @@
       "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.12.0.tgz",
       "integrity": "sha512-Udgu19qBxsT+s5Z50OhM/tMAok3WBlB6lUkxVjs8W8ZeGkPefqp5T6vb5o4pKZNrjM4poYDVVBe3veJTmEXR2Q=="
     },
+    "abab": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/abab/-/abab-1.0.3.tgz",
+      "integrity": "sha1-uB3l9ydOxOdW15fNg08wNkJyTl0="
+    },
     "abbrev": {
       "version": "1.0.9",
       "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.0.9.tgz",
@@ -2101,6 +2111,11 @@
       "resolved": "https://registry.npmjs.org/acorn-dynamic-import/-/acorn-dynamic-import-2.0.2.tgz",
       "integrity": "sha1-x1K9IQvvZ5UBtsbLf8hPj0cVjMQ="
     },
+    "acorn-globals": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/acorn-globals/-/acorn-globals-3.1.0.tgz",
+      "integrity": "sha1-/YJw9x+7SZawBPqIDuXUZXOnMb8="
+    },
     "after": {
       "version": "0.8.2",
       "resolved": "https://registry.npmjs.org/after/-/after-0.8.2.tgz",
@@ -2143,6 +2158,11 @@
       "resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz",
       "integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU="
     },
+    "ansi-escapes": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz",
+      "integrity": "sha1-06ioOzGapneTZisT52HHkRQiMG4="
+    },
     "ansi-html": {
       "version": "0.0.7",
       "resolved": "https://registry.npmjs.org/ansi-html/-/ansi-html-0.0.7.tgz",
@@ -2210,6 +2230,11 @@
         }
       }
     },
+    "append-transform": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/append-transform/-/append-transform-0.4.0.tgz",
+      "integrity": "sha1-126/jKlNJ24keja61EpLdKthGZE="
+    },
     "aproba": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.1.2.tgz",
@@ -2240,6 +2265,11 @@
       "resolved": "https://registry.npmjs.org/arr-union/-/arr-union-3.1.0.tgz",
       "integrity": "sha1-45sJrqne+Gao8gbiiK9jkZuuOcQ="
     },
+    "array-equal": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/array-equal/-/array-equal-1.0.0.tgz",
+      "integrity": "sha1-jCpe8kcv2ep0KwTHenUJO6J1fJM="
+    },
     "array-filter": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/array-filter/-/array-filter-0.0.1.tgz",
@@ -2290,6 +2320,11 @@
       "resolved": "https://registry.npmjs.org/arraybuffer.slice/-/arraybuffer.slice-0.0.6.tgz",
       "integrity": "sha1-8zshWfBTKj8xB6JywMz70a0peco="
     },
+    "arrify": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz",
+      "integrity": "sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0="
+    },
     "asap": {
       "version": "2.0.6",
       "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz",
@@ -2321,9 +2356,9 @@
       "integrity": "sha1-E8pRXYYgbaC6xm6DTdOX2HWBCUw="
     },
     "async": {
-      "version": "1.5.2",
-      "resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz",
-      "integrity": "sha1-7GphrlZIDAw8skHJVhjiCJL5Zyo="
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
+      "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw=="
     },
     "async-each": {
       "version": "1.0.1",
@@ -2394,6 +2429,11 @@
         }
       }
     },
+    "babel-core": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-core/-/babel-core-6.26.0.tgz",
+      "integrity": "sha1-rzL3izGm/O8RnIew/Y2XU/A6C7g="
+    },
     "babel-generator": {
       "version": "6.26.0",
       "resolved": "https://registry.npmjs.org/babel-generator/-/babel-generator-6.26.0.tgz",
@@ -2406,11 +2446,51 @@
         }
       }
     },
+    "babel-helpers": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helpers/-/babel-helpers-6.24.1.tgz",
+      "integrity": "sha1-NHHenK7DiOXIUOWX5Yom3fN2ArI="
+    },
+    "babel-jest": {
+      "version": "20.0.3",
+      "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-20.0.3.tgz",
+      "integrity": "sha1-5KA7E9wQOJ4UD8ZF0J/8TO0wFnE="
+    },
     "babel-messages": {
       "version": "6.23.0",
       "resolved": "https://registry.npmjs.org/babel-messages/-/babel-messages-6.23.0.tgz",
       "integrity": "sha1-8830cDhYA1sqKVHG7F7fbGLyYw4="
     },
+    "babel-plugin-istanbul": {
+      "version": "4.1.4",
+      "resolved": "https://registry.npmjs.org/babel-plugin-istanbul/-/babel-plugin-istanbul-4.1.4.tgz",
+      "integrity": "sha1-GN3oS/POMp/d8/QQP66SFFbY5Yc="
+    },
+    "babel-plugin-jest-hoist": {
+      "version": "20.0.3",
+      "resolved": "https://registry.npmjs.org/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-20.0.3.tgz",
+      "integrity": "sha1-r+3IU70/jcNUjqZx++adA8wsF2c="
+    },
+    "babel-plugin-transform-es2015-modules-commonjs": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-modules-commonjs/-/babel-plugin-transform-es2015-modules-commonjs-6.26.0.tgz",
+      "integrity": "sha1-DYOUApt9xqvhqX7xgeAHWN0uXYo="
+    },
+    "babel-plugin-transform-strict-mode": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-strict-mode/-/babel-plugin-transform-strict-mode-6.24.1.tgz",
+      "integrity": "sha1-1fr3qleKZbvlkc9e2uBKDGcCB1g="
+    },
+    "babel-preset-jest": {
+      "version": "20.0.3",
+      "resolved": "https://registry.npmjs.org/babel-preset-jest/-/babel-preset-jest-20.0.3.tgz",
+      "integrity": "sha1-y6yq3stdaJyh4d4TYOv8ZoYsF4o="
+    },
+    "babel-register": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-register/-/babel-register-6.26.0.tgz",
+      "integrity": "sha1-btAhFz4vy0htestFxgCahW9kcHE="
+    },
     "babel-runtime": {
       "version": "6.26.0",
       "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz",
@@ -2543,6 +2623,11 @@
           "version": "2.6.7",
           "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.7.tgz",
           "integrity": "sha1-krrR9tBbu2u6Isyoi80OyJTChh4="
+        },
+        "iconv-lite": {
+          "version": "0.4.15",
+          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.15.tgz",
+          "integrity": "sha1-/iZaIYrGpXz+hUkn6dBMGYJe3es="
         }
       }
     },
@@ -2588,6 +2673,18 @@
       "resolved": "https://registry.npmjs.org/brorand/-/brorand-1.1.0.tgz",
       "integrity": "sha1-EsJe/kCkXjwyPrhnWgoM5XsiNx8="
     },
+    "browser-resolve": {
+      "version": "1.11.2",
+      "resolved": "https://registry.npmjs.org/browser-resolve/-/browser-resolve-1.11.2.tgz",
+      "integrity": "sha1-j/CbCixCFxihBRwmCzLkj0QpOM4=",
+      "dependencies": {
+        "resolve": {
+          "version": "1.1.7",
+          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz",
+          "integrity": "sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs="
+        }
+      }
+    },
     "browser-stdout": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/browser-stdout/-/browser-stdout-1.3.0.tgz",
@@ -2628,6 +2725,11 @@
       "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
       "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk="
     },
+    "bser": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/bser/-/bser-2.0.0.tgz",
+      "integrity": "sha1-mseNPtXZFYBP2HrLFYvHlxR6Fxk="
+    },
     "buffer": {
       "version": "4.9.1",
       "resolved": "https://registry.npmjs.org/buffer/-/buffer-4.9.1.tgz",
@@ -2668,15 +2770,27 @@
       "resolved": "https://registry.npmjs.org/callsite/-/callsite-1.0.0.tgz",
       "integrity": "sha1-KAOY5dZkvXQDi28JBRU+borxvCA="
     },
+    "callsites": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/callsites/-/callsites-2.0.0.tgz",
+      "integrity": "sha1-BuuE8A7qQT2oav/vrL/7Ngk7PFA="
+    },
     "camelcase": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz",
-      "integrity": "sha1-fB0W1nmhu+WcoCys7PsBHiAfWh8="
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
+      "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
     },
     "camelcase-keys": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/camelcase-keys/-/camelcase-keys-2.1.0.tgz",
-      "integrity": "sha1-MIvur/3ygRkFHvodkyITyRuPkuc="
+      "integrity": "sha1-MIvur/3ygRkFHvodkyITyRuPkuc=",
+      "dependencies": {
+        "camelcase": {
+          "version": "2.1.1",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz",
+          "integrity": "sha1-fB0W1nmhu+WcoCys7PsBHiAfWh8="
+        }
+      }
     },
     "caniuse-api": {
       "version": "1.6.1",
@@ -2740,6 +2854,11 @@
       "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-1.7.0.tgz",
       "integrity": "sha1-eY5ol3gVHIB2tLNg5e3SjNortGg="
     },
+    "ci-info": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-1.0.0.tgz",
+      "integrity": "sha1-3FKF8rTiUYIWg2gcOBwziPRuxTQ="
+    },
     "cipher-base": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/cipher-base/-/cipher-base-1.0.4.tgz",
@@ -2987,6 +3106,11 @@
       "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.2.tgz",
       "integrity": "sha1-t9ETrueo3Se9IRM8TcJSnfFyHu0="
     },
+    "content-type-parser": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/content-type-parser/-/content-type-parser-1.0.1.tgz",
+      "integrity": "sha1-w+VpiMU8ZRJ/tG1AMqOpACRv3JQ="
+    },
     "convert-source-map": {
       "version": "1.5.0",
       "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.5.0.tgz",
@@ -3008,9 +3132,9 @@
       "integrity": "sha1-Z29us8OZl8LuGsOpJP1hJHSPV40="
     },
     "core-js": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.5.0.tgz",
-      "integrity": "sha1-VpwFCRi+ZIazg3VSAorgRmtxcIY="
+      "version": "2.5.1",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.5.1.tgz",
+      "integrity": "sha1-rmh03GaTd4m4B1T/VCjfZoGcpQs="
     },
     "core-util-is": {
       "version": "1.0.2",
@@ -3228,6 +3352,16 @@
       "resolved": "https://registry.npmjs.org/csso/-/csso-2.3.2.tgz",
       "integrity": "sha1-3dUsWHAz9J6Utx/FVWnyUuj/X4U="
     },
+    "cssom": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/cssom/-/cssom-0.3.2.tgz",
+      "integrity": "sha1-uANhcMefB6kP8vFuIihAJ6JDhIs="
+    },
+    "cssstyle": {
+      "version": "0.2.37",
+      "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-0.2.37.tgz",
+      "integrity": "sha1-VBCXI0yyUTyDzu06zdwn/yeYfVQ="
+    },
     "currently-unhandled": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz",
@@ -3297,6 +3431,11 @@
       "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz",
       "integrity": "sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ="
     },
+    "default-require-extensions": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/default-require-extensions/-/default-require-extensions-1.0.0.tgz",
+      "integrity": "sha1-836hXT4T/9m0N9M+GnW1+5eHTLg="
+    },
     "define-properties": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.1.2.tgz",
@@ -3685,6 +3824,11 @@
       "resolved": "https://registry.npmjs.org/evp_bytestokey/-/evp_bytestokey-1.0.2.tgz",
       "integrity": "sha512-ni0r0lrm7AOzsh2qC5mi9sj8S0gmj5fLNjfFpxN05FB4tAVZEKotbkjOtLPqTCX/CXT7NsUr6juZb4IFJeNNdA=="
     },
+    "exec-sh": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/exec-sh/-/exec-sh-0.2.0.tgz",
+      "integrity": "sha1-FPdd4/INKG75MwmbLOUKkDWc7xA="
+    },
     "execa": {
       "version": "0.7.0",
       "resolved": "https://registry.npmjs.org/execa/-/execa-0.7.0.tgz",
@@ -3891,6 +4035,11 @@
       "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz",
       "integrity": "sha1-TkkvjQTftviQA1B/btvy1QHnxvQ="
     },
+    "fb-watchman": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/fb-watchman/-/fb-watchman-2.0.0.tgz",
+      "integrity": "sha1-VOmr99+i8mzZsWNsWIwa/AXeXVg="
+    },
     "fbjs": {
       "version": "0.8.14",
       "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.14.tgz",
@@ -3913,6 +4062,11 @@
       "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz",
       "integrity": "sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY="
     },
+    "fileset": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/fileset/-/fileset-2.0.3.tgz",
+      "integrity": "sha1-jnVIqW08wjJ+5eZ0FocjozO7oqA="
+    },
     "filesize": {
       "version": "3.5.10",
       "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.5.10.tgz",
@@ -3934,9 +4088,9 @@
       "integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ="
     },
     "find-up": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
-      "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8="
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz",
+      "integrity": "sha1-RdG35QbHF93UgndaK3eSCjwMV6c="
     },
     "flatten": {
       "version": "1.0.2",
@@ -4003,720 +4157,182 @@
       "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
       "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
     },
-    "fsevents": {
+    "fstream": {
+      "version": "1.0.11",
+      "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
+      "integrity": "sha1-XB+x8RdHcRTwYyoOtLcbPLD9MXE="
+    },
+    "function-bind": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
+      "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A=="
+    },
+    "function.prototype.name": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.0.3.tgz",
+      "integrity": "sha512-5EblxZUdioXi2JiMZ9FUbwYj40eQ9MFHyzFLBSPdlRl3SO8l7SLWuAnQ/at/1Wi4hjJwME/C5WpF2ZfAc8nGNw=="
+    },
+    "gauge": {
+      "version": "2.7.4",
+      "resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz",
+      "integrity": "sha1-LANAXHU4w51+s3sxcCLjJfsBi/c="
+    },
+    "gaze": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.2.tgz",
-      "integrity": "sha512-Sn44E5wQW4bTHXvQmvSHwqbuiXtduD6Rrjm2ZtUEGbyrig+nUH3t/QD4M4/ZXViY556TBpRgZkHLDx3JxPwxiw==",
-      "optional": true,
+      "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz",
+      "integrity": "sha1-hHIkZ3rbiHDWeSV+0ziP22HkAQU="
+    },
+    "generic-names": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/generic-names/-/generic-names-1.0.2.tgz",
+      "integrity": "sha1-4lt/7OtbWo8o9flyp8z+V+Virc0=",
       "dependencies": {
-        "abbrev": {
-          "version": "1.1.0",
-          "bundled": true,
-          "optional": true
+        "loader-utils": {
+          "version": "0.2.17",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz",
+          "integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g="
+        }
+      }
+    },
+    "get-caller-file": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz",
+      "integrity": "sha1-9wLmMSfn4jHBYKgMFVSstw1QR+U="
+    },
+    "get-func-name": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/get-func-name/-/get-func-name-2.0.0.tgz",
+      "integrity": "sha1-6td0q+5y4gQJQzoGY2YCPdaIekE="
+    },
+    "get-stdin": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz",
+      "integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4="
+    },
+    "get-stream": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz",
+      "integrity": "sha1-jpQ9E1jcN1VQVOy+LtsFqhdO3hQ="
+    },
+    "get-value": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/get-value/-/get-value-2.0.6.tgz",
+      "integrity": "sha1-3BXKHGcjh8p2vTesCjlbogQqLCg="
+    },
+    "getpass": {
+      "version": "0.1.7",
+      "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
+      "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo=",
+      "dependencies": {
+        "assert-plus": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
+        }
+      }
+    },
+    "github": {
+      "version": "7.3.2",
+      "resolved": "https://registry.npmjs.org/github/-/github-7.3.2.tgz",
+      "integrity": "sha1-/hDN5pZDUsXZHhGnYW0m1f+2+Hs="
+    },
+    "glamor": {
+      "version": "2.20.40",
+      "resolved": "https://registry.npmjs.org/glamor/-/glamor-2.20.40.tgz",
+      "integrity": "sha512-DNXCd+c14N9QF8aAKrfl4xakPk5FdcFwmH7sD0qnC0Pr7xoZ5W9yovhUrY/dJc3psfGGXC58vqQyRtuskyUJxA=="
+    },
+    "glob": {
+      "version": "7.1.2",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
+      "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ=="
+    },
+    "glob-base": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz",
+      "integrity": "sha1-27Fk9iIbHAscz4Kuoyi0l98Oo8Q="
+    },
+    "glob-parent": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz",
+      "integrity": "sha1-gTg9ctsFT8zPUzbaqQLxgvbtuyg="
+    },
+    "glob2base": {
+      "version": "0.0.12",
+      "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz",
+      "integrity": "sha1-nUGbPijxLoOjYhZKJ3BVkiycDVY="
+    },
+    "globals": {
+      "version": "9.18.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-9.18.0.tgz",
+      "integrity": "sha512-S0nG3CLEQiY/ILxqtztTWH/3iRRdyBLw6KMDxnKMchrtbj2OFmehVh0WUCfW3DUrIgx/qFrJPICrq4Z4sTR9UQ=="
+    },
+    "globby": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
+      "integrity": "sha1-9abXDoOV4hyFj7BInWTfAkJNUGw="
+    },
+    "globule": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/globule/-/globule-1.2.0.tgz",
+      "integrity": "sha1-HcScaCLdnoovoAuiopUAboZkvQk="
+    },
+    "graceful-fs": {
+      "version": "4.1.11",
+      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz",
+      "integrity": "sha1-Dovf5NHduIVNZOBOp8AOKgJuVlg="
+    },
+    "graceful-readlink": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz",
+      "integrity": "sha1-TK+tdrxi8C+gObL5Tpo906ORpyU="
+    },
+    "growl": {
+      "version": "1.9.2",
+      "resolved": "https://registry.npmjs.org/growl/-/growl-1.9.2.tgz",
+      "integrity": "sha1-Dqd0NxXbjY3ixe3hd14bRayFwC8="
+    },
+    "growly": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz",
+      "integrity": "sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE="
+    },
+    "gzip-size": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-3.0.0.tgz",
+      "integrity": "sha1-VGGI6b3DN/Zzdy+BZgRks4nc5SA="
+    },
+    "handle-thing": {
+      "version": "1.2.5",
+      "resolved": "https://registry.npmjs.org/handle-thing/-/handle-thing-1.2.5.tgz",
+      "integrity": "sha1-/Xqtcmvxpf0W38KbL3pmAdJxOcQ="
+    },
+    "handlebars": {
+      "version": "4.0.10",
+      "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.0.10.tgz",
+      "integrity": "sha1-PTDHGLCaPZbyPqTMH0A8TTup/08=",
+      "dependencies": {
+        "async": {
+          "version": "1.5.2",
+          "resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz",
+          "integrity": "sha1-7GphrlZIDAw8skHJVhjiCJL5Zyo="
         },
-        "ajv": {
-          "version": "4.11.8",
-          "bundled": true,
-          "optional": true
-        },
-        "ansi-regex": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "aproba": {
-          "version": "1.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "are-we-there-yet": {
-          "version": "1.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "asn1": {
-          "version": "0.2.3",
-          "bundled": true,
-          "optional": true
-        },
-        "assert-plus": {
-          "version": "0.2.0",
-          "bundled": true,
-          "optional": true
-        },
-        "asynckit": {
-          "version": "0.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "aws-sign2": {
-          "version": "0.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "aws4": {
-          "version": "1.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "balanced-match": {
-          "version": "0.4.2",
-          "bundled": true
-        },
-        "bcrypt-pbkdf": {
-          "version": "1.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "block-stream": {
-          "version": "0.0.9",
-          "bundled": true
-        },
-        "boom": {
-          "version": "2.10.1",
-          "bundled": true
-        },
-        "brace-expansion": {
-          "version": "1.1.7",
-          "bundled": true
-        },
-        "buffer-shims": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "caseless": {
-          "version": "0.12.0",
-          "bundled": true,
-          "optional": true
-        },
-        "co": {
-          "version": "4.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "code-point-at": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "combined-stream": {
-          "version": "1.0.5",
-          "bundled": true
-        },
-        "concat-map": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "console-control-strings": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "core-util-is": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "cryptiles": {
-          "version": "2.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "dashdash": {
-          "version": "1.14.1",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true,
-          "optional": true
-        },
-        "deep-extend": {
-          "version": "0.4.2",
-          "bundled": true,
-          "optional": true
-        },
-        "delayed-stream": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "delegates": {
-          "version": "1.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "ecc-jsbn": {
-          "version": "0.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "extend": {
-          "version": "3.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "extsprintf": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "forever-agent": {
-          "version": "0.6.1",
-          "bundled": true,
-          "optional": true
-        },
-        "form-data": {
-          "version": "2.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "fs.realpath": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "fstream": {
-          "version": "1.0.11",
-          "bundled": true
-        },
-        "fstream-ignore": {
-          "version": "1.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "gauge": {
-          "version": "2.7.4",
-          "bundled": true,
-          "optional": true
-        },
-        "getpass": {
-          "version": "0.1.7",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "glob": {
-          "version": "7.1.2",
-          "bundled": true
-        },
-        "graceful-fs": {
-          "version": "4.1.11",
-          "bundled": true
-        },
-        "har-schema": {
-          "version": "1.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "har-validator": {
-          "version": "4.2.1",
-          "bundled": true,
-          "optional": true
-        },
-        "has-unicode": {
-          "version": "2.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "hawk": {
-          "version": "3.1.3",
-          "bundled": true,
-          "optional": true
-        },
-        "hoek": {
-          "version": "2.16.3",
-          "bundled": true
-        },
-        "http-signature": {
-          "version": "1.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "inflight": {
-          "version": "1.0.6",
-          "bundled": true
-        },
-        "inherits": {
-          "version": "2.0.3",
-          "bundled": true
-        },
-        "ini": {
-          "version": "1.3.4",
-          "bundled": true,
-          "optional": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "is-typedarray": {
-          "version": "1.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "isstream": {
-          "version": "0.1.2",
-          "bundled": true,
-          "optional": true
-        },
-        "jodid25519": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "jsbn": {
-          "version": "0.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "json-schema": {
-          "version": "0.2.3",
-          "bundled": true,
-          "optional": true
-        },
-        "json-stable-stringify": {
-          "version": "1.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "json-stringify-safe": {
-          "version": "5.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "jsonify": {
-          "version": "0.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "jsprim": {
-          "version": "1.4.0",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "mime-db": {
-          "version": "1.27.0",
-          "bundled": true
-        },
-        "mime-types": {
-          "version": "2.1.15",
-          "bundled": true
-        },
-        "minimatch": {
-          "version": "3.0.4",
-          "bundled": true
-        },
-        "minimist": {
-          "version": "0.0.8",
-          "bundled": true
-        },
-        "mkdirp": {
-          "version": "0.5.1",
-          "bundled": true
-        },
-        "ms": {
-          "version": "2.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "node-pre-gyp": {
-          "version": "0.6.36",
-          "bundled": true,
-          "optional": true
-        },
-        "nopt": {
-          "version": "4.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "npmlog": {
-          "version": "4.1.0",
-          "bundled": true,
-          "optional": true
-        },
-        "number-is-nan": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "oauth-sign": {
-          "version": "0.8.2",
-          "bundled": true,
-          "optional": true
-        },
-        "object-assign": {
-          "version": "4.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "once": {
-          "version": "1.4.0",
-          "bundled": true
-        },
-        "os-homedir": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "os-tmpdir": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "osenv": {
-          "version": "0.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "path-is-absolute": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "performance-now": {
-          "version": "0.2.0",
-          "bundled": true,
-          "optional": true
-        },
-        "process-nextick-args": {
-          "version": "1.0.7",
-          "bundled": true
-        },
-        "punycode": {
-          "version": "1.4.1",
-          "bundled": true,
-          "optional": true
-        },
-        "qs": {
-          "version": "6.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "rc": {
-          "version": "1.2.1",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "minimist": {
-              "version": "1.2.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "readable-stream": {
-          "version": "2.2.9",
-          "bundled": true
-        },
-        "request": {
-          "version": "2.81.0",
-          "bundled": true,
-          "optional": true
-        },
-        "rimraf": {
-          "version": "2.6.1",
-          "bundled": true
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "bundled": true
-        },
-        "semver": {
-          "version": "5.3.0",
-          "bundled": true,
-          "optional": true
-        },
-        "set-blocking": {
-          "version": "2.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "signal-exit": {
-          "version": "3.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "sntp": {
-          "version": "1.0.9",
-          "bundled": true,
-          "optional": true
-        },
-        "sshpk": {
-          "version": "1.13.0",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "string_decoder": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "stringstream": {
-          "version": "0.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "strip-ansi": {
-          "version": "3.0.1",
-          "bundled": true
-        },
-        "strip-json-comments": {
-          "version": "2.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "tar": {
-          "version": "2.2.1",
-          "bundled": true
-        },
-        "tar-pack": {
-          "version": "3.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "tough-cookie": {
-          "version": "2.3.2",
-          "bundled": true,
-          "optional": true
-        },
-        "tunnel-agent": {
-          "version": "0.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "tweetnacl": {
-          "version": "0.14.5",
-          "bundled": true,
-          "optional": true
-        },
-        "uid-number": {
-          "version": "0.0.6",
-          "bundled": true,
-          "optional": true
-        },
-        "util-deprecate": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "uuid": {
-          "version": "3.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "verror": {
-          "version": "1.3.6",
-          "bundled": true,
-          "optional": true
-        },
-        "wide-align": {
-          "version": "1.1.2",
-          "bundled": true,
-          "optional": true
-        },
-        "wrappy": {
-          "version": "1.0.2",
-          "bundled": true
-        }
-      }
-    },
-    "fstream": {
-      "version": "1.0.11",
-      "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
-      "integrity": "sha1-XB+x8RdHcRTwYyoOtLcbPLD9MXE="
-    },
-    "function-bind": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
-      "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A=="
-    },
-    "function.prototype.name": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.0.3.tgz",
-      "integrity": "sha512-5EblxZUdioXi2JiMZ9FUbwYj40eQ9MFHyzFLBSPdlRl3SO8l7SLWuAnQ/at/1Wi4hjJwME/C5WpF2ZfAc8nGNw=="
-    },
-    "gauge": {
-      "version": "2.7.4",
-      "resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz",
-      "integrity": "sha1-LANAXHU4w51+s3sxcCLjJfsBi/c="
-    },
-    "gaze": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz",
-      "integrity": "sha1-hHIkZ3rbiHDWeSV+0ziP22HkAQU="
-    },
-    "generic-names": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/generic-names/-/generic-names-1.0.2.tgz",
-      "integrity": "sha1-4lt/7OtbWo8o9flyp8z+V+Virc0=",
-      "dependencies": {
-        "loader-utils": {
-          "version": "0.2.17",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz",
-          "integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g="
-        }
-      }
-    },
-    "get-caller-file": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz",
-      "integrity": "sha1-9wLmMSfn4jHBYKgMFVSstw1QR+U="
-    },
-    "get-func-name": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/get-func-name/-/get-func-name-2.0.0.tgz",
-      "integrity": "sha1-6td0q+5y4gQJQzoGY2YCPdaIekE="
-    },
-    "get-stdin": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz",
-      "integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4="
-    },
-    "get-stream": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz",
-      "integrity": "sha1-jpQ9E1jcN1VQVOy+LtsFqhdO3hQ="
-    },
-    "get-value": {
-      "version": "2.0.6",
-      "resolved": "https://registry.npmjs.org/get-value/-/get-value-2.0.6.tgz",
-      "integrity": "sha1-3BXKHGcjh8p2vTesCjlbogQqLCg="
-    },
-    "getpass": {
-      "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
-      "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo=",
-      "dependencies": {
-        "assert-plus": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
-        }
-      }
-    },
-    "github": {
-      "version": "7.3.2",
-      "resolved": "https://registry.npmjs.org/github/-/github-7.3.2.tgz",
-      "integrity": "sha1-/hDN5pZDUsXZHhGnYW0m1f+2+Hs="
-    },
-    "glamor": {
-      "version": "2.20.40",
-      "resolved": "https://registry.npmjs.org/glamor/-/glamor-2.20.40.tgz",
-      "integrity": "sha512-DNXCd+c14N9QF8aAKrfl4xakPk5FdcFwmH7sD0qnC0Pr7xoZ5W9yovhUrY/dJc3psfGGXC58vqQyRtuskyUJxA=="
-    },
-    "glob": {
-      "version": "7.1.2",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
-      "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ=="
-    },
-    "glob-base": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz",
-      "integrity": "sha1-27Fk9iIbHAscz4Kuoyi0l98Oo8Q="
-    },
-    "glob-parent": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz",
-      "integrity": "sha1-gTg9ctsFT8zPUzbaqQLxgvbtuyg="
-    },
-    "glob2base": {
-      "version": "0.0.12",
-      "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz",
-      "integrity": "sha1-nUGbPijxLoOjYhZKJ3BVkiycDVY="
-    },
-    "globals": {
-      "version": "9.18.0",
-      "resolved": "https://registry.npmjs.org/globals/-/globals-9.18.0.tgz",
-      "integrity": "sha512-S0nG3CLEQiY/ILxqtztTWH/3iRRdyBLw6KMDxnKMchrtbj2OFmehVh0WUCfW3DUrIgx/qFrJPICrq4Z4sTR9UQ=="
-    },
-    "globby": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
-      "integrity": "sha1-9abXDoOV4hyFj7BInWTfAkJNUGw="
-    },
-    "globule": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/globule/-/globule-1.2.0.tgz",
-      "integrity": "sha1-HcScaCLdnoovoAuiopUAboZkvQk="
-    },
-    "graceful-fs": {
-      "version": "4.1.11",
-      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz",
-      "integrity": "sha1-Dovf5NHduIVNZOBOp8AOKgJuVlg="
-    },
-    "graceful-readlink": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz",
-      "integrity": "sha1-TK+tdrxi8C+gObL5Tpo906ORpyU="
-    },
-    "growl": {
-      "version": "1.9.2",
-      "resolved": "https://registry.npmjs.org/growl/-/growl-1.9.2.tgz",
-      "integrity": "sha1-Dqd0NxXbjY3ixe3hd14bRayFwC8="
-    },
-    "growly": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz",
-      "integrity": "sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE="
-    },
-    "gzip-size": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-3.0.0.tgz",
-      "integrity": "sha1-VGGI6b3DN/Zzdy+BZgRks4nc5SA="
-    },
-    "handle-thing": {
-      "version": "1.2.5",
-      "resolved": "https://registry.npmjs.org/handle-thing/-/handle-thing-1.2.5.tgz",
-      "integrity": "sha1-/Xqtcmvxpf0W38KbL3pmAdJxOcQ="
-    },
-    "handlebars": {
-      "version": "4.0.10",
-      "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.0.10.tgz",
-      "integrity": "sha1-PTDHGLCaPZbyPqTMH0A8TTup/08=",
-      "dependencies": {
-        "source-map": {
-          "version": "0.4.4",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
-          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s="
-        }
-      }
-    },
-    "har-schema": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-1.0.5.tgz",
-      "integrity": "sha1-0mMTX0MwfALGAq/I/pWXDAFRNp4="
-    },
-    "har-validator": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz",
-      "integrity": "sha1-M0gdDxu/9gDdID11gSpqX7oALio=",
-      "dependencies": {
+        "source-map": {
+          "version": "0.4.4",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
+          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s="
+        }
+      }
+    },
+    "har-schema": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-1.0.5.tgz",
+      "integrity": "sha1-0mMTX0MwfALGAq/I/pWXDAFRNp4="
+    },
+    "har-validator": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz",
+      "integrity": "sha1-M0gdDxu/9gDdID11gSpqX7oALio=",
+      "dependencies": {
         "ajv": {
           "version": "4.11.8",
           "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz",
@@ -4813,6 +4429,11 @@
       "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz",
       "integrity": "sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0="
     },
+    "home-or-tmp": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/home-or-tmp/-/home-or-tmp-2.0.0.tgz",
+      "integrity": "sha1-42w/LSyufXRqhX440Y1fMqeILbg="
+    },
     "hosted-git-info": {
       "version": "2.5.0",
       "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.5.0.tgz",
@@ -4828,6 +4449,11 @@
       "resolved": "https://registry.npmjs.org/html-comment-regex/-/html-comment-regex-1.1.1.tgz",
       "integrity": "sha1-ZouTd26q5V696POtRkswekljYl4="
     },
+    "html-encoding-sniffer": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-1.0.1.tgz",
+      "integrity": "sha1-eb96eF6klf5mFl5zQVPzY/9UN9o="
+    },
     "html-entities": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-1.2.1.tgz",
@@ -4940,381 +4566,900 @@
       "integrity": "sha1-MRYKNpMK2vH8BMYHT360FGXU7Es="
     },
     "iconv-lite": {
-      "version": "0.4.15",
-      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.15.tgz",
-      "integrity": "sha1-/iZaIYrGpXz+hUkn6dBMGYJe3es="
+      "version": "0.4.13",
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.13.tgz",
+      "integrity": "sha1-H4irpKsLFQjoMSrMOTRfNumS4vI="
+    },
+    "icss-replace-symbols": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/icss-replace-symbols/-/icss-replace-symbols-1.1.0.tgz",
+      "integrity": "sha1-Bupvg2ead0njhs/h/oEq5dsiPe0="
+    },
+    "icss-utils": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-2.1.0.tgz",
+      "integrity": "sha1-g/Cg7DeL8yRheLbCrZE28TWxyWI="
+    },
+    "ieee754": {
+      "version": "1.1.8",
+      "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.8.tgz",
+      "integrity": "sha1-vjPUCsEO8ZJnAfbwii2G+/0a0+Q="
+    },
+    "immutability-helper": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.3.1.tgz",
+      "integrity": "sha1-jM/OkhVyCMEgsq+tftBcERFMCG4="
+    },
+    "in-publish": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/in-publish/-/in-publish-2.0.0.tgz",
+      "integrity": "sha1-4g/146KvwmkDILbcVSaCqcf631E="
+    },
+    "indent-string": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-2.1.0.tgz",
+      "integrity": "sha1-ji1INIdCEhtKghi3oTfppSBJ3IA="
+    },
+    "indexes-of": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/indexes-of/-/indexes-of-1.0.1.tgz",
+      "integrity": "sha1-8w9xbI4r00bHtn0985FVZqfAVgc="
+    },
+    "indexof": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/indexof/-/indexof-0.0.1.tgz",
+      "integrity": "sha1-gtwzbSMrkGIXnQWrMpOmYFn9Q10="
+    },
+    "inflight": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
+      "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk="
+    },
+    "inherits": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
+      "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4="
+    },
+    "inline-style-prefixer": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-3.0.7.tgz",
+      "integrity": "sha1-DMyS5ZAv5uDSjZdcQlhEP4gGFfg="
+    },
+    "internal-ip": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/internal-ip/-/internal-ip-1.2.0.tgz",
+      "integrity": "sha1-rp+/k7mEh4eF1QqN4bNWlWBYz1w="
+    },
+    "interpret": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.0.3.tgz",
+      "integrity": "sha1-y8NcYu7uc/Gat7EKgBURQBr8D5A="
+    },
+    "invariant": {
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.2.tgz",
+      "integrity": "sha1-nh9WrArNtr8wMwbzOL47IErmA2A="
+    },
+    "invert-kv": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/invert-kv/-/invert-kv-1.0.0.tgz",
+      "integrity": "sha1-EEqOSqym09jNFXqO+L+rLXo//bY="
+    },
+    "ip": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/ip/-/ip-1.1.5.tgz",
+      "integrity": "sha1-vd7XARQpCCjAoDnnLvJfWq7ENUo="
+    },
+    "ipaddr.js": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.4.0.tgz",
+      "integrity": "sha1-KWrKh4qCGBbluF0KKFqZvP9FgvA="
+    },
+    "is-absolute-url": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-absolute-url/-/is-absolute-url-2.1.0.tgz",
+      "integrity": "sha1-UFMN+4T8yap9vnhS6Do3uTufKqY="
+    },
+    "is-accessor-descriptor": {
+      "version": "0.1.6",
+      "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
+      "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
+      "dependencies": {
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+        }
+      }
+    },
+    "is-arrayish": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
+      "integrity": "sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0="
+    },
+    "is-binary-path": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-1.0.1.tgz",
+      "integrity": "sha1-dfFmQrSA8YenEcgUFh/TpKdlWJg="
+    },
+    "is-buffer": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.5.tgz",
+      "integrity": "sha1-Hzsm72E7IUuIy8ojzGwB2Hlh7sw="
+    },
+    "is-builtin-module": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-1.0.0.tgz",
+      "integrity": "sha1-VAVy0096wxGfj3bDDLwbHgN6/74="
+    },
+    "is-callable": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.1.3.tgz",
+      "integrity": "sha1-hut1OSgF3cM69xySoO7fdO52BLI="
+    },
+    "is-ci": {
+      "version": "1.0.10",
+      "resolved": "https://registry.npmjs.org/is-ci/-/is-ci-1.0.10.tgz",
+      "integrity": "sha1-9zkzayYyNlBhqdSCcM1WrjNpMY4="
+    },
+    "is-data-descriptor": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
+      "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
+      "dependencies": {
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+        }
+      }
+    },
+    "is-date-object": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.1.tgz",
+      "integrity": "sha1-mqIOtq7rv/d/vTPnTKAbM1gdOhY="
+    },
+    "is-descriptor": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-1.0.1.tgz",
+      "integrity": "sha512-G3fFVFTqfaqu7r4YuSBHKBAuOaLz8Sy7ekklUpFEliaLMP1Y2ZjoN9jS62YWCAPQrQpMUQSitRlrzibbuCZjdA==",
+      "dependencies": {
+        "kind-of": {
+          "version": "5.0.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
+          "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
+        }
+      }
+    },
+    "is-directory": {
+      "version": "0.3.1",
+      "resolved": "https://registry.npmjs.org/is-directory/-/is-directory-0.3.1.tgz",
+      "integrity": "sha1-YTObbyR1/Hcv2cnYP1yFddwVSuE="
+    },
+    "is-dotfile": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/is-dotfile/-/is-dotfile-1.0.3.tgz",
+      "integrity": "sha1-pqLzL/0t+wT1yiXs0Pa4PPeYoeE="
+    },
+    "is-equal-shallow": {
+      "version": "0.1.3",
+      "resolved": "https://registry.npmjs.org/is-equal-shallow/-/is-equal-shallow-0.1.3.tgz",
+      "integrity": "sha1-IjgJj8Ih3gvPpdnqxMRdY4qhxTQ="
+    },
+    "is-extendable": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
+      "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik="
+    },
+    "is-extglob": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
+      "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI="
+    },
+    "is-finite": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/is-finite/-/is-finite-1.0.2.tgz",
+      "integrity": "sha1-zGZ3aVYCvlUO8R6LSqYwU0K20Ko="
+    },
+    "is-fullwidth-code-point": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
+      "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
+    },
+    "is-glob": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz",
+      "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM=",
+      "dependencies": {
+        "is-extglob": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
+          "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
+        }
+      }
+    },
+    "is-number": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/is-number/-/is-number-3.0.0.tgz",
+      "integrity": "sha1-JP1iAaR4LPUFYcgQJ2r8fRLXEZU=",
+      "dependencies": {
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+        }
+      }
+    },
+    "is-odd": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-odd/-/is-odd-1.0.0.tgz",
+      "integrity": "sha1-O4qTLrAos3dcObsJ6RdnrM22kIg="
+    },
+    "is-path-cwd": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-1.0.0.tgz",
+      "integrity": "sha1-0iXsIxMuie3Tj9p2dHLmLmXxEG0="
+    },
+    "is-path-in-cwd": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-1.0.0.tgz",
+      "integrity": "sha1-ZHdYK4IU1gI0YJRWcAO+ip6sBNw="
+    },
+    "is-path-inside": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-1.0.0.tgz",
+      "integrity": "sha1-/AbloWg/vaE95mev9xe7wQpI838="
+    },
+    "is-plain-obj": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-1.1.0.tgz",
+      "integrity": "sha1-caUMhCnfync8kqOQpKA7OfzVHT4="
+    },
+    "is-plain-object": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.4.tgz",
+      "integrity": "sha512-h5PpgXkWitc38BBMYawTYMWJHFZJVnBquFE57xFpjB8pJFiF6gZ+bU+WyI/yqXiFR5mdLsgYNaPe8uao6Uv9Og=="
     },
-    "icss-replace-symbols": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/icss-replace-symbols/-/icss-replace-symbols-1.1.0.tgz",
-      "integrity": "sha1-Bupvg2ead0njhs/h/oEq5dsiPe0="
+    "is-posix-bracket": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz",
+      "integrity": "sha1-MzTceXdDaOkvAW5vvAqI9c1ua8Q="
     },
-    "icss-utils": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-2.1.0.tgz",
-      "integrity": "sha1-g/Cg7DeL8yRheLbCrZE28TWxyWI="
+    "is-primitive": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/is-primitive/-/is-primitive-2.0.0.tgz",
+      "integrity": "sha1-IHurkWOEmcB7Kt8kCkGochADRXU="
     },
-    "ieee754": {
-      "version": "1.1.8",
-      "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.8.tgz",
-      "integrity": "sha1-vjPUCsEO8ZJnAfbwii2G+/0a0+Q="
+    "is-regex": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.0.4.tgz",
+      "integrity": "sha1-VRdIm1RwkbCTDglWVM7SXul+lJE="
     },
-    "immutability-helper": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.3.1.tgz",
-      "integrity": "sha1-jM/OkhVyCMEgsq+tftBcERFMCG4="
+    "is-stream": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz",
+      "integrity": "sha1-EtSj3U5o4Lec6428hBc66A2RykQ="
     },
-    "in-publish": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/in-publish/-/in-publish-2.0.0.tgz",
-      "integrity": "sha1-4g/146KvwmkDILbcVSaCqcf631E="
+    "is-subset": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/is-subset/-/is-subset-0.1.1.tgz",
+      "integrity": "sha1-ilkRfZMt4d4A8kX83TnOQ/HpOaY="
     },
-    "indent-string": {
+    "is-svg": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-2.1.0.tgz",
-      "integrity": "sha1-ji1INIdCEhtKghi3oTfppSBJ3IA="
+      "resolved": "https://registry.npmjs.org/is-svg/-/is-svg-2.1.0.tgz",
+      "integrity": "sha1-z2EJDaDZ77yrhyLeum8DIgjbsOk="
     },
-    "indexes-of": {
+    "is-symbol": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/indexes-of/-/indexes-of-1.0.1.tgz",
-      "integrity": "sha1-8w9xbI4r00bHtn0985FVZqfAVgc="
+      "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.0.1.tgz",
+      "integrity": "sha1-PMWfAAJRlLarLjjbrmaJJWtmBXI="
     },
-    "indexof": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/indexof/-/indexof-0.0.1.tgz",
-      "integrity": "sha1-gtwzbSMrkGIXnQWrMpOmYFn9Q10="
+    "is-typedarray": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz",
+      "integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo="
     },
-    "inflight": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
-      "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk="
+    "is-utf8": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz",
+      "integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI="
     },
-    "inherits": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
-      "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4="
+    "isarray": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+      "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
     },
-    "inline-style-prefixer": {
-      "version": "3.0.7",
-      "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-3.0.7.tgz",
-      "integrity": "sha1-DMyS5ZAv5uDSjZdcQlhEP4gGFfg="
+    "isbinaryfile": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/isbinaryfile/-/isbinaryfile-3.0.2.tgz",
+      "integrity": "sha1-Sj6XTsDLqQBNP8bN5yCeppNopiE="
     },
-    "internal-ip": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/internal-ip/-/internal-ip-1.2.0.tgz",
-      "integrity": "sha1-rp+/k7mEh4eF1QqN4bNWlWBYz1w="
+    "isexe": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
+      "integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA="
     },
-    "interpret": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.0.3.tgz",
-      "integrity": "sha1-y8NcYu7uc/Gat7EKgBURQBr8D5A="
+    "isobject": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.1.tgz",
+      "integrity": "sha1-TkMekrEalzFjaqH5yNHMvP2reN8="
     },
-    "invariant": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.2.tgz",
-      "integrity": "sha1-nh9WrArNtr8wMwbzOL47IErmA2A="
+    "isomorphic-fetch": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz",
+      "integrity": "sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk="
     },
-    "invert-kv": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/invert-kv/-/invert-kv-1.0.0.tgz",
-      "integrity": "sha1-EEqOSqym09jNFXqO+L+rLXo//bY="
+    "isstream": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz",
+      "integrity": "sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo="
     },
-    "ip": {
-      "version": "1.1.5",
-      "resolved": "https://registry.npmjs.org/ip/-/ip-1.1.5.tgz",
-      "integrity": "sha1-vd7XARQpCCjAoDnnLvJfWq7ENUo="
+    "istanbul": {
+      "version": "0.4.5",
+      "resolved": "https://registry.npmjs.org/istanbul/-/istanbul-0.4.5.tgz",
+      "integrity": "sha1-ZcfXPUxNqE1POsMQuRj7C4Azczs=",
+      "dependencies": {
+        "async": {
+          "version": "1.5.2",
+          "resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz",
+          "integrity": "sha1-7GphrlZIDAw8skHJVhjiCJL5Zyo="
+        },
+        "glob": {
+          "version": "5.0.15",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
+          "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
+        },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
+        "resolve": {
+          "version": "1.1.7",
+          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz",
+          "integrity": "sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        },
+        "wordwrap": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz",
+          "integrity": "sha1-J1hIEIkUVqQXHI0CJkQa3pDLyus="
+        }
+      }
     },
-    "ipaddr.js": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.4.0.tgz",
-      "integrity": "sha1-KWrKh4qCGBbluF0KKFqZvP9FgvA="
+    "istanbul-api": {
+      "version": "1.1.13",
+      "resolved": "https://registry.npmjs.org/istanbul-api/-/istanbul-api-1.1.13.tgz",
+      "integrity": "sha1-cZf2RBNgDr3+xjR6LcPU4D+X7Vo="
     },
-    "is-absolute-url": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/is-absolute-url/-/is-absolute-url-2.1.0.tgz",
-      "integrity": "sha1-UFMN+4T8yap9vnhS6Do3uTufKqY="
+    "istanbul-instrumenter-loader": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/istanbul-instrumenter-loader/-/istanbul-instrumenter-loader-3.0.0.tgz",
+      "integrity": "sha512-alLSEFX06ApU75sm5oWcaVNaiss/bgMRiWTct3g0P0ZZTKjR+6QiCcuVOKDI1kWJgwHEnIXsv/dWm783kPpmtw=="
     },
-    "is-accessor-descriptor": {
-      "version": "0.1.6",
-      "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
-      "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
+    "istanbul-lib-coverage": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-1.1.1.tgz",
+      "integrity": "sha512-0+1vDkmzxqJIn5rcoEqapSB4DmPxE31EtI2dF2aCkV5esN9EWHxZ0dwgDClivMXJqE7zaYQxq30hj5L0nlTN5Q=="
+    },
+    "istanbul-lib-hook": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-hook/-/istanbul-lib-hook-1.0.7.tgz",
+      "integrity": "sha512-3U2HB9y1ZV9UmFlE12Fx+nPtFqIymzrqCksrXujm3NVbAZIJg/RfYgO1XiIa0mbmxTjWpVEVlkIZJ25xVIAfkQ=="
+    },
+    "istanbul-lib-instrument": {
+      "version": "1.7.5",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-instrument/-/istanbul-lib-instrument-1.7.5.tgz",
+      "integrity": "sha1-rbWW+PDLi5XnOSBjUaOKWGryGx4=",
       "dependencies": {
-        "kind-of": {
-          "version": "3.2.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+        "semver": {
+          "version": "5.4.1",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
+          "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg=="
         }
       }
     },
-    "is-arrayish": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
-      "integrity": "sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0="
-    },
-    "is-binary-path": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-1.0.1.tgz",
-      "integrity": "sha1-dfFmQrSA8YenEcgUFh/TpKdlWJg="
-    },
-    "is-buffer": {
-      "version": "1.1.5",
-      "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.5.tgz",
-      "integrity": "sha1-Hzsm72E7IUuIy8ojzGwB2Hlh7sw="
+    "istanbul-lib-report": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-report/-/istanbul-lib-report-1.1.1.tgz",
+      "integrity": "sha512-tvF+YmCmH4thnez6JFX06ujIA19WPa9YUiwjc1uALF2cv5dmE3It8b5I8Ob7FHJ70H9Y5yF+TDkVa/mcADuw1Q==",
+      "dependencies": {
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
     },
-    "is-builtin-module": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-1.0.0.tgz",
-      "integrity": "sha1-VAVy0096wxGfj3bDDLwbHgN6/74="
+    "istanbul-lib-source-maps": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-source-maps/-/istanbul-lib-source-maps-1.2.1.tgz",
+      "integrity": "sha512-mukVvSXCn9JQvdJl8wP/iPhqig0MRtuWuD4ZNKo6vB2Ik//AmhAKe3QnPN02dmkRe3lTudFk3rzoHhwU4hb94w=="
     },
-    "is-callable": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.1.3.tgz",
-      "integrity": "sha1-hut1OSgF3cM69xySoO7fdO52BLI="
+    "istanbul-reports": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/istanbul-reports/-/istanbul-reports-1.1.2.tgz",
+      "integrity": "sha1-D7Lj9qqZIr085F0F2KtNXo4HvU8="
     },
-    "is-data-descriptor": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
-      "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
+    "jest": {
+      "version": "20.0.4",
+      "resolved": "https://registry.npmjs.org/jest/-/jest-20.0.4.tgz",
+      "integrity": "sha1-PdJgwpidba1nix6cxNkZRPbWAqw=",
       "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "arr-diff": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
+          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8="
+        },
+        "array-unique": {
+          "version": "0.2.1",
+          "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
+          "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM="
+        },
+        "braces": {
+          "version": "1.8.5",
+          "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
+          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
+        },
+        "camelcase": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
+          "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
+        "cliui": {
+          "version": "3.2.0",
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
+          "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
+        },
+        "expand-brackets": {
+          "version": "0.1.5",
+          "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
+          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s="
+        },
+        "extglob": {
+          "version": "0.3.2",
+          "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
+          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
+        },
+        "is-extglob": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
+          "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
+        },
+        "jest-cli": {
+          "version": "20.0.4",
+          "resolved": "https://registry.npmjs.org/jest-cli/-/jest-cli-20.0.4.tgz",
+          "integrity": "sha1-5TKxnYiuW8bEF+iwWTpv6VSx3JM="
+        },
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
           "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+        },
+        "micromatch": {
+          "version": "2.3.11",
+          "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
+          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+        },
+        "yargs": {
+          "version": "7.1.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-7.1.0.tgz",
+          "integrity": "sha1-a6MY6xaWFyf10oT46gA+jWFU0Mg="
         }
       }
     },
-    "is-date-object": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.1.tgz",
-      "integrity": "sha1-mqIOtq7rv/d/vTPnTKAbM1gdOhY="
+    "jest-changed-files": {
+      "version": "20.0.3",
+      "resolved": "https://registry.npmjs.org/jest-changed-files/-/jest-changed-files-20.0.3.tgz",
+      "integrity": "sha1-k5TVzGXEOEBhSb7xv01Sto4D4/g="
     },
-    "is-descriptor": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-1.0.1.tgz",
-      "integrity": "sha512-G3fFVFTqfaqu7r4YuSBHKBAuOaLz8Sy7ekklUpFEliaLMP1Y2ZjoN9jS62YWCAPQrQpMUQSitRlrzibbuCZjdA==",
+    "jest-config": {
+      "version": "20.0.4",
+      "resolved": "https://registry.npmjs.org/jest-config/-/jest-config-20.0.4.tgz",
+      "integrity": "sha1-43kwqyIXyRNgXv8T5712PsSPruo=",
       "dependencies": {
-        "kind-of": {
-          "version": "5.0.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
-          "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
         }
       }
     },
-    "is-directory": {
-      "version": "0.3.1",
-      "resolved": "https://registry.npmjs.org/is-directory/-/is-directory-0.3.1.tgz",
-      "integrity": "sha1-YTObbyR1/Hcv2cnYP1yFddwVSuE="
-    },
-    "is-dotfile": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/is-dotfile/-/is-dotfile-1.0.3.tgz",
-      "integrity": "sha1-pqLzL/0t+wT1yiXs0Pa4PPeYoeE="
-    },
-    "is-equal-shallow": {
-      "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/is-equal-shallow/-/is-equal-shallow-0.1.3.tgz",
-      "integrity": "sha1-IjgJj8Ih3gvPpdnqxMRdY4qhxTQ="
-    },
-    "is-extendable": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz",
-      "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik="
+    "jest-diff": {
+      "version": "20.0.3",
+      "resolved": "https://registry.npmjs.org/jest-diff/-/jest-diff-20.0.3.tgz",
+      "integrity": "sha1-gfKI/Z5nXw+yPHXxwrGURf5YZhc=",
+      "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+        }
+      }
     },
-    "is-extglob": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
-      "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI="
+    "jest-docblock": {
+      "version": "20.0.3",
+      "resolved": "https://registry.npmjs.org/jest-docblock/-/jest-docblock-20.0.3.tgz",
+      "integrity": "sha1-F76phDQswz2DxQ++FUXqDvqkRxI="
     },
-    "is-finite": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/is-finite/-/is-finite-1.0.2.tgz",
-      "integrity": "sha1-zGZ3aVYCvlUO8R6LSqYwU0K20Ko="
+    "jest-environment-jsdom": {
+      "version": "20.0.3",
+      "resolved": "https://registry.npmjs.org/jest-environment-jsdom/-/jest-environment-jsdom-20.0.3.tgz",
+      "integrity": "sha1-BIqKwS7iJfcZBBdxODS7mZeH3pk="
     },
-    "is-fullwidth-code-point": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
-      "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
+    "jest-environment-node": {
+      "version": "20.0.3",
+      "resolved": "https://registry.npmjs.org/jest-environment-node/-/jest-environment-node-20.0.3.tgz",
+      "integrity": "sha1-1Ii8RhKvLCRumG6K52caCZFj1AM="
     },
-    "is-glob": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz",
-      "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM=",
+    "jest-haste-map": {
+      "version": "20.0.4",
+      "resolved": "https://registry.npmjs.org/jest-haste-map/-/jest-haste-map-20.0.4.tgz",
+      "integrity": "sha1-ZT61XIic48Ah97lGk/IKQVm63wM=",
       "dependencies": {
+        "arr-diff": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
+          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8="
+        },
+        "array-unique": {
+          "version": "0.2.1",
+          "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
+          "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM="
+        },
+        "braces": {
+          "version": "1.8.5",
+          "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
+          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
+        },
+        "expand-brackets": {
+          "version": "0.1.5",
+          "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
+          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s="
+        },
+        "extglob": {
+          "version": "0.3.2",
+          "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
+          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
+        },
         "is-extglob": {
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
           "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
-        }
-      }
-    },
-    "is-number": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/is-number/-/is-number-3.0.0.tgz",
-      "integrity": "sha1-JP1iAaR4LPUFYcgQJ2r8fRLXEZU=",
-      "dependencies": {
+        },
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
           "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+        },
+        "micromatch": {
+          "version": "2.3.11",
+          "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
+          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
         }
       }
     },
-    "is-odd": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-odd/-/is-odd-1.0.0.tgz",
-      "integrity": "sha1-O4qTLrAos3dcObsJ6RdnrM22kIg="
-    },
-    "is-path-cwd": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-1.0.0.tgz",
-      "integrity": "sha1-0iXsIxMuie3Tj9p2dHLmLmXxEG0="
-    },
-    "is-path-in-cwd": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-1.0.0.tgz",
-      "integrity": "sha1-ZHdYK4IU1gI0YJRWcAO+ip6sBNw="
-    },
-    "is-path-inside": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-1.0.0.tgz",
-      "integrity": "sha1-/AbloWg/vaE95mev9xe7wQpI838="
-    },
-    "is-plain-obj": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-1.1.0.tgz",
-      "integrity": "sha1-caUMhCnfync8kqOQpKA7OfzVHT4="
-    },
-    "is-plain-object": {
-      "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.4.tgz",
-      "integrity": "sha512-h5PpgXkWitc38BBMYawTYMWJHFZJVnBquFE57xFpjB8pJFiF6gZ+bU+WyI/yqXiFR5mdLsgYNaPe8uao6Uv9Og=="
-    },
-    "is-posix-bracket": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz",
-      "integrity": "sha1-MzTceXdDaOkvAW5vvAqI9c1ua8Q="
-    },
-    "is-primitive": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/is-primitive/-/is-primitive-2.0.0.tgz",
-      "integrity": "sha1-IHurkWOEmcB7Kt8kCkGochADRXU="
-    },
-    "is-regex": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.0.4.tgz",
-      "integrity": "sha1-VRdIm1RwkbCTDglWVM7SXul+lJE="
-    },
-    "is-stream": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz",
-      "integrity": "sha1-EtSj3U5o4Lec6428hBc66A2RykQ="
-    },
-    "is-subset": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/is-subset/-/is-subset-0.1.1.tgz",
-      "integrity": "sha1-ilkRfZMt4d4A8kX83TnOQ/HpOaY="
-    },
-    "is-svg": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/is-svg/-/is-svg-2.1.0.tgz",
-      "integrity": "sha1-z2EJDaDZ77yrhyLeum8DIgjbsOk="
-    },
-    "is-symbol": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.0.1.tgz",
-      "integrity": "sha1-PMWfAAJRlLarLjjbrmaJJWtmBXI="
-    },
-    "is-typedarray": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz",
-      "integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo="
+    "jest-jasmine2": {
+      "version": "20.0.4",
+      "resolved": "https://registry.npmjs.org/jest-jasmine2/-/jest-jasmine2-20.0.4.tgz",
+      "integrity": "sha1-/MWxQReA2RHQQpAu8YWehS5g1eE=",
+      "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+        }
+      }
     },
-    "is-utf8": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz",
-      "integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI="
+    "jest-matcher-utils": {
+      "version": "20.0.3",
+      "resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-20.0.3.tgz",
+      "integrity": "sha1-s6a443yld4A7CDKpixZPRLeBVhI=",
+      "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+        }
+      }
     },
-    "isarray": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-      "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+    "jest-matchers": {
+      "version": "20.0.3",
+      "resolved": "https://registry.npmjs.org/jest-matchers/-/jest-matchers-20.0.3.tgz",
+      "integrity": "sha1-ymnbHDLbWm9wf6XgQBq7VXAN/WA="
     },
-    "isbinaryfile": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/isbinaryfile/-/isbinaryfile-3.0.2.tgz",
-      "integrity": "sha1-Sj6XTsDLqQBNP8bN5yCeppNopiE="
+    "jest-message-util": {
+      "version": "20.0.3",
+      "resolved": "https://registry.npmjs.org/jest-message-util/-/jest-message-util-20.0.3.tgz",
+      "integrity": "sha1-auwoRDBvyw5udNV5bBAG2W/dgxw=",
+      "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "arr-diff": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
+          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8="
+        },
+        "array-unique": {
+          "version": "0.2.1",
+          "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
+          "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM="
+        },
+        "braces": {
+          "version": "1.8.5",
+          "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
+          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
+        "expand-brackets": {
+          "version": "0.1.5",
+          "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
+          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s="
+        },
+        "extglob": {
+          "version": "0.3.2",
+          "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
+          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
+        },
+        "is-extglob": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
+          "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
+        },
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+        },
+        "micromatch": {
+          "version": "2.3.11",
+          "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
+          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+        }
+      }
     },
-    "isexe": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
-      "integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA="
+    "jest-mock": {
+      "version": "20.0.3",
+      "resolved": "https://registry.npmjs.org/jest-mock/-/jest-mock-20.0.3.tgz",
+      "integrity": "sha1-i8Bw6QQUqhVcEajWTIaaDVxx2lk="
     },
-    "isobject": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.1.tgz",
-      "integrity": "sha1-TkMekrEalzFjaqH5yNHMvP2reN8="
+    "jest-regex-util": {
+      "version": "20.0.3",
+      "resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-20.0.3.tgz",
+      "integrity": "sha1-hburXRM+RGJbGfr4xqpRItCF12I="
     },
-    "isomorphic-fetch": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz",
-      "integrity": "sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk="
+    "jest-resolve": {
+      "version": "20.0.4",
+      "resolved": "https://registry.npmjs.org/jest-resolve/-/jest-resolve-20.0.4.tgz",
+      "integrity": "sha1-lEiz6La6/BVHlETGSZBFt//ll6U="
     },
-    "isstream": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz",
-      "integrity": "sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo="
+    "jest-resolve-dependencies": {
+      "version": "20.0.3",
+      "resolved": "https://registry.npmjs.org/jest-resolve-dependencies/-/jest-resolve-dependencies-20.0.3.tgz",
+      "integrity": "sha1-bhSntxevDyyzZnxUneQK8Bexcjo="
     },
-    "istanbul": {
-      "version": "0.4.5",
-      "resolved": "https://registry.npmjs.org/istanbul/-/istanbul-0.4.5.tgz",
-      "integrity": "sha1-ZcfXPUxNqE1POsMQuRj7C4Azczs=",
+    "jest-runtime": {
+      "version": "20.0.4",
+      "resolved": "https://registry.npmjs.org/jest-runtime/-/jest-runtime-20.0.4.tgz",
+      "integrity": "sha1-osgCIZxCA/dU3xQE5JAYYWnRJNg=",
       "dependencies": {
-        "glob": {
-          "version": "5.0.15",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
-          "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
         },
-        "has-flag": {
+        "arr-diff": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
+          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8="
+        },
+        "array-unique": {
+          "version": "0.2.1",
+          "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
+          "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM="
+        },
+        "braces": {
+          "version": "1.8.5",
+          "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
+          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
+        },
+        "camelcase": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
+          "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
+        "cliui": {
+          "version": "3.2.0",
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
+          "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
+        },
+        "expand-brackets": {
+          "version": "0.1.5",
+          "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
+          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s="
+        },
+        "extglob": {
+          "version": "0.3.2",
+          "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
+          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
+        },
+        "is-extglob": {
           "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
-          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
+          "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
         },
-        "resolve": {
-          "version": "1.1.7",
-          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz",
-          "integrity": "sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs="
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+        },
+        "micromatch": {
+          "version": "2.3.11",
+          "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
+          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
+        },
+        "strip-bom": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
+          "integrity": "sha1-IzTBjpx1n3vdVv3vfprj1YjmjtM="
         },
         "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
         },
-        "wordwrap": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz",
-          "integrity": "sha1-J1hIEIkUVqQXHI0CJkQa3pDLyus="
+        "yargs": {
+          "version": "7.1.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-7.1.0.tgz",
+          "integrity": "sha1-a6MY6xaWFyf10oT46gA+jWFU0Mg="
         }
       }
     },
-    "istanbul-instrumenter-loader": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/istanbul-instrumenter-loader/-/istanbul-instrumenter-loader-3.0.0.tgz",
-      "integrity": "sha512-alLSEFX06ApU75sm5oWcaVNaiss/bgMRiWTct3g0P0ZZTKjR+6QiCcuVOKDI1kWJgwHEnIXsv/dWm783kPpmtw=="
+    "jest-snapshot": {
+      "version": "20.0.3",
+      "resolved": "https://registry.npmjs.org/jest-snapshot/-/jest-snapshot-20.0.3.tgz",
+      "integrity": "sha1-W4R+GtsaTZCFKn+fElCG4YfHZWY=",
+      "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+        }
+      }
     },
-    "istanbul-lib-coverage": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-1.1.1.tgz",
-      "integrity": "sha512-0+1vDkmzxqJIn5rcoEqapSB4DmPxE31EtI2dF2aCkV5esN9EWHxZ0dwgDClivMXJqE7zaYQxq30hj5L0nlTN5Q=="
+    "jest-util": {
+      "version": "20.0.3",
+      "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-20.0.3.tgz",
+      "integrity": "sha1-DAf32A2C9OWmfG+LnD/n9lz9Mq0=",
+      "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+        }
+      }
     },
-    "istanbul-lib-instrument": {
-      "version": "1.7.5",
-      "resolved": "https://registry.npmjs.org/istanbul-lib-instrument/-/istanbul-lib-instrument-1.7.5.tgz",
-      "integrity": "sha1-rbWW+PDLi5XnOSBjUaOKWGryGx4=",
+    "jest-validate": {
+      "version": "20.0.3",
+      "resolved": "https://registry.npmjs.org/jest-validate/-/jest-validate-20.0.3.tgz",
+      "integrity": "sha1-0M/R3k9XnymEhJJcKA+PHZTsPKs=",
       "dependencies": {
-        "semver": {
-          "version": "5.4.1",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
-          "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg=="
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
         }
       }
     },
@@ -5339,6 +5484,11 @@
       "integrity": "sha1-peZUwuWi3rXyAdls77yoDA7y9RM=",
       "optional": true
     },
+    "jsdom": {
+      "version": "9.12.0",
+      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-9.12.0.tgz",
+      "integrity": "sha1-6MVG//ywbADUgzyoRBD+1/igl9Q="
+    },
     "jsesc": {
       "version": "0.5.0",
       "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
@@ -5526,6 +5676,11 @@
       "resolved": "https://registry.npmjs.org/lcid/-/lcid-1.0.0.tgz",
       "integrity": "sha1-MIrMr6C8SDo4Z7S28rlQYlHRuDU="
     },
+    "leven": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/leven/-/leven-2.1.0.tgz",
+      "integrity": "sha1-wuep93IJTe6dNCAq6KzORoeHVYA="
+    },
     "levn": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/levn/-/levn-0.3.0.tgz",
@@ -5548,15 +5703,8 @@
     },
     "locate-path": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-2.0.0.tgz",
-      "integrity": "sha1-K1aLJl7slExtnA3pw9u7ygNUzY4=",
-      "dependencies": {
-        "path-exists": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-3.0.0.tgz",
-          "integrity": "sha1-zg6+ql94yxiSXqfYENe1mwEP1RU="
-        }
-      }
+      "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-2.0.0.tgz",
+      "integrity": "sha1-K1aLJl7slExtnA3pw9u7ygNUzY4="
     },
     "lodash": {
       "version": "4.17.4",
@@ -5817,6 +5965,11 @@
       "resolved": "https://registry.npmjs.org/macaddress/-/macaddress-0.2.8.tgz",
       "integrity": "sha1-WQTcU3w57G2+/q6QIycTX6hRHxI="
     },
+    "makeerror": {
+      "version": "1.0.11",
+      "resolved": "https://registry.npmjs.org/makeerror/-/makeerror-1.0.11.tgz",
+      "integrity": "sha1-4BpckQnyr3lmDk6LlYd5AYT1qWw="
+    },
     "map-cache": {
       "version": "0.2.2",
       "resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz",
@@ -5903,6 +6056,11 @@
         }
       }
     },
+    "merge": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/merge/-/merge-1.2.0.tgz",
+      "integrity": "sha1-dTHjnUlJwoGma4xabgJl6LBYlNo="
+    },
     "merge-descriptors": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.1.tgz",
@@ -6062,6 +6220,11 @@
       "resolved": "https://registry.npmjs.org/native-promise-only/-/native-promise-only-0.8.1.tgz",
       "integrity": "sha1-IKMYwwy0X3H+et+/eyHJnBRy7xE="
     },
+    "natural-compare": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz",
+      "integrity": "sha1-Sr6/7tdUHywnrPspvbvRXI1bpPc="
+    },
     "negotiator": {
       "version": "0.6.1",
       "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.1.tgz",
@@ -6104,6 +6267,11 @@
         }
       }
     },
+    "node-int64": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/node-int64/-/node-int64-0.4.0.tgz",
+      "integrity": "sha1-h6kGXNs1XTGC2PlM4RGIuCXGijs="
+    },
     "node-libs-browser": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz",
@@ -6117,20 +6285,10 @@
       }
     },
     "node-notifier": {
-      "version": "4.6.1",
-      "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-4.6.1.tgz",
-      "integrity": "sha1-BW0UJE89zBzq3+aK+c/wxUc6M/M=",
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-5.1.2.tgz",
+      "integrity": "sha1-L6nhJgX6EACdRFSdb82KY93g5P8=",
       "dependencies": {
-        "lodash.clonedeep": {
-          "version": "3.0.2",
-          "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-3.0.2.tgz",
-          "integrity": "sha1-oKHkDYKl6on/WxR7hETtY9koJ9s="
-        },
-        "minimist": {
-          "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
-          "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
-        },
         "semver": {
           "version": "5.4.1",
           "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
@@ -6210,6 +6368,11 @@
       "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz",
       "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0="
     },
+    "nwmatcher": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/nwmatcher/-/nwmatcher-1.4.1.tgz",
+      "integrity": "sha1-eumwew6oBNt+JfBctf5Al9TklJ8="
+    },
     "oauth-sign": {
       "version": "0.8.2",
       "resolved": "https://registry.npmjs.org/oauth-sign/-/oauth-sign-0.8.2.tgz",
@@ -6452,6 +6615,11 @@
       "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz",
       "integrity": "sha1-9ID0BDTvgHQfhGkJn43qGPVaTck="
     },
+    "parse5": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/parse5/-/parse5-1.5.1.tgz",
+      "integrity": "sha1-m387DeMr543CQBsXVzzK8Pb1nZQ="
+    },
     "parsejson": {
       "version": "0.0.3",
       "resolved": "https://registry.npmjs.org/parsejson/-/parsejson-0.0.3.tgz",
@@ -6483,9 +6651,9 @@
       "integrity": "sha1-oLhwcpquIUAFt9UDLsLLuw+0RRo="
     },
     "path-exists": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
-      "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s="
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-3.0.0.tgz",
+      "integrity": "sha1-zg6+ql94yxiSXqfYENe1mwEP1RU="
     },
     "path-is-absolute": {
       "version": "1.0.1",
@@ -6581,10 +6749,22 @@
       "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz",
       "integrity": "sha1-ITXW36ejWMBprJsXh3YogihFD/o="
     },
+    "pkg-dir": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-2.0.0.tgz",
+      "integrity": "sha1-9tXREJ4Z1j7fQo4L1X4Sd3YVM0s="
+    },
     "portfinder": {
       "version": "1.0.13",
       "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.13.tgz",
-      "integrity": "sha1-uzLs2HwnEErm7kS1o8y/Drsa7ek="
+      "integrity": "sha1-uzLs2HwnEErm7kS1o8y/Drsa7ek=",
+      "dependencies": {
+        "async": {
+          "version": "1.5.2",
+          "resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz",
+          "integrity": "sha1-7GphrlZIDAw8skHJVhjiCJL5Zyo="
+        }
+      }
     },
     "posix-character-classes": {
       "version": "0.1.1",
@@ -7646,6 +7826,16 @@
       "resolved": "https://registry.npmjs.org/preserve/-/preserve-0.2.0.tgz",
       "integrity": "sha1-gV7R9uvGWSb4ZbMQwHE7yzMVzks="
     },
+    "pretty-format": {
+      "version": "20.0.3",
+      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-20.0.3.tgz",
+      "integrity": "sha1-Ag41ClYKH+GpjcO+tsz/s4beixQ="
+    },
+    "private": {
+      "version": "0.1.7",
+      "resolved": "https://registry.npmjs.org/private/-/private-0.1.7.tgz",
+      "integrity": "sha1-aM5eih7woju1cMwoU3tTMqumPvE="
+    },
     "process": {
       "version": "0.11.10",
       "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
@@ -7749,7 +7939,14 @@
     "raw-body": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.2.0.tgz",
-      "integrity": "sha1-mUl2z2pQlqQRYoQEkvC9xdbn+5Y="
+      "integrity": "sha1-mUl2z2pQlqQRYoQEkvC9xdbn+5Y=",
+      "dependencies": {
+        "iconv-lite": {
+          "version": "0.4.15",
+          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.15.tgz",
+          "integrity": "sha1-/iZaIYrGpXz+hUkn6dBMGYJe3es="
+        }
+      }
     },
     "raw-loader": {
       "version": "0.5.1",
@@ -7784,7 +7981,19 @@
     "read-pkg-up": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
-      "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI="
+      "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI=",
+      "dependencies": {
+        "find-up": {
+          "version": "1.1.2",
+          "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
+          "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8="
+        },
+        "path-exists": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
+          "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s="
+        }
+      }
     },
     "readable-stream": {
       "version": "2.3.3",
@@ -7967,6 +8176,28 @@
       "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.2.1.tgz",
       "integrity": "sha1-7dOQk6MYQ3DLhZJDsr3yVefY6mc="
     },
+    "sane": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/sane/-/sane-1.6.0.tgz",
+      "integrity": "sha1-lhDEUjB6E10pwf3+JUcDQYDEZ3U=",
+      "dependencies": {
+        "bser": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/bser/-/bser-1.0.2.tgz",
+          "integrity": "sha1-OBEWlwsqbe6lZG3RXdcnhES1YWk="
+        },
+        "fb-watchman": {
+          "version": "1.9.2",
+          "resolved": "https://registry.npmjs.org/fb-watchman/-/fb-watchman-1.9.2.tgz",
+          "integrity": "sha1-okz0eCf4LTj7Waaa1wt247auc4M="
+        },
+        "minimist": {
+          "version": "1.2.0",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
+          "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
+        }
+      }
+    },
     "sass-graph": {
       "version": "2.2.4",
       "resolved": "https://registry.npmjs.org/sass-graph/-/sass-graph-2.2.4.tgz",
@@ -7994,11 +8225,6 @@
       "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-6.0.6.tgz",
       "integrity": "sha512-c3/Zc+iW+qqDip6kXPYLEgsAu2lf4xz0EZDplB7EmSUMda12U1sGJPetH55B/j9eu0bTtKzKlNPWWyYC7wFNyQ==",
       "dependencies": {
-        "async": {
-          "version": "2.5.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
-          "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw=="
-        },
         "pify": {
           "version": "3.0.0",
           "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
@@ -8159,6 +8385,11 @@
       "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.13.0.tgz",
       "integrity": "sha512-hRNu/TlYEp4Rw5IbzO8ykGoZMSG489PGUx1rvePpHGrtl20cXivRBgtr/EWYxIwL9EOO9+on04nd9k3tW8tVww=="
     },
+    "slash": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/slash/-/slash-1.0.0.tgz",
+      "integrity": "sha1-xB8vbDn8FtHNF61LXYlhFK5HDVU="
+    },
     "snapdragon": {
       "version": "0.8.1",
       "resolved": "https://registry.npmjs.org/snapdragon/-/snapdragon-0.8.1.tgz",
@@ -8471,6 +8702,11 @@
       "resolved": "https://registry.npmjs.org/string-hash/-/string-hash-1.1.3.tgz",
       "integrity": "sha1-6Kr8CsGFW0Zmkp7X3RJ1311sgRs="
     },
+    "string-length": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/string-length/-/string-length-1.0.1.tgz",
+      "integrity": "sha1-VpcPscOFWOnnC3KL894mmsRa36w="
+    },
     "string-width": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
@@ -8528,6 +8764,11 @@
       "resolved": "https://registry.npmjs.org/svgo/-/svgo-0.7.2.tgz",
       "integrity": "sha1-n1dyQTlSE1xv779Ar+ak+qiLS7U="
     },
+    "symbol-tree": {
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.2.tgz",
+      "integrity": "sha1-rifbOPZgp64uHDt9G8KQgZuFGeY="
+    },
     "tapable": {
       "version": "0.2.8",
       "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.8.tgz",
@@ -8538,11 +8779,63 @@
       "resolved": "https://registry.npmjs.org/tar/-/tar-2.2.1.tgz",
       "integrity": "sha1-jk0qJWwOIYXGsYrWlK7JaLg8sdE="
     },
+    "test-exclude": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/test-exclude/-/test-exclude-4.1.1.tgz",
+      "integrity": "sha512-35+Asrsk3XHJDBgf/VRFexPgh3UyETv8IAn/LRTiZjVy6rjPVqdEk8dJcJYBzl1w0XCJM48lvTy8SfEsCWS4nA==",
+      "dependencies": {
+        "arr-diff": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
+          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8="
+        },
+        "array-unique": {
+          "version": "0.2.1",
+          "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
+          "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM="
+        },
+        "braces": {
+          "version": "1.8.5",
+          "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
+          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
+        },
+        "expand-brackets": {
+          "version": "0.1.5",
+          "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
+          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s="
+        },
+        "extglob": {
+          "version": "0.3.2",
+          "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
+          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
+        },
+        "is-extglob": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
+          "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
+        },
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+        },
+        "micromatch": {
+          "version": "2.3.11",
+          "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
+          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
+        }
+      }
+    },
     "text-encoding": {
       "version": "0.6.4",
       "resolved": "https://registry.npmjs.org/text-encoding/-/text-encoding-0.6.4.tgz",
       "integrity": "sha1-45mpgiV6J22uQou5KEXLcb3CbRk="
     },
+    "throat": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/throat/-/throat-3.2.0.tgz",
+      "integrity": "sha512-/EY8VpvlqJ+sFtLPeOgc8Pl7kQVOWv0woD87KTXVHPIAE842FGT+rokxIhe8xIUP1cfgrkt0as0vDLjDiMtr8w=="
+    },
     "throttleit": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/throttleit/-/throttleit-1.0.0.tgz",
@@ -8573,6 +8866,11 @@
       "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.31.tgz",
       "integrity": "sha1-jzirlDjhcxXl29izZX6L+yd65Kc="
     },
+    "tmpl": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/tmpl/-/tmpl-1.0.4.tgz",
+      "integrity": "sha1-I2QN17QtAEM5ERQIIOXPRA5SHdE="
+    },
     "to-array": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/to-array/-/to-array-0.1.4.tgz",
@@ -8632,6 +8930,11 @@
       "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.2.tgz",
       "integrity": "sha1-8IH3bkyFcg5sN6X6ztc3FQ2EByo="
     },
+    "tr46": {
+      "version": "0.0.3",
+      "resolved": "https://registry.npmjs.org/tr46/-/tr46-0.0.3.tgz",
+      "integrity": "sha1-gYT9NH2snNwYWZLzpmIuFLnZq2o="
+    },
     "trim-newlines": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/trim-newlines/-/trim-newlines-1.0.0.tgz",
@@ -8642,6 +8945,107 @@
       "resolved": "https://registry.npmjs.org/trim-right/-/trim-right-1.0.1.tgz",
       "integrity": "sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM="
     },
+    "ts-jest": {
+      "version": "20.0.13",
+      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-20.0.13.tgz",
+      "integrity": "sha512-GWQSJxQg9EOwQ81oWZTAh39SdKFaNVelPBbxRPRa9Mjly0jFbYIw0upk3Vfohtnd5RjEa3BdPBc+nA95cayTzQ==",
+      "dependencies": {
+        "ansi-regex": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg="
+        },
+        "camelcase": {
+          "version": "4.1.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
+          "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
+        },
+        "cliui": {
+          "version": "3.2.0",
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
+          "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0=",
+          "dependencies": {
+            "string-width": {
+              "version": "1.0.2",
+              "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
+              "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
+            }
+          }
+        },
+        "fs-extra": {
+          "version": "4.0.1",
+          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-4.0.1.tgz",
+          "integrity": "sha1-f8DGyJV/mD9X8waiTlud3Y0N2IA="
+        },
+        "jsonfile": {
+          "version": "3.0.1",
+          "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-3.0.1.tgz",
+          "integrity": "sha1-pezG9l9T9mLEQVx2daAzHQmS7GY="
+        },
+        "load-json-file": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
+          "integrity": "sha1-eUfkIUmvgNaWy/eXvKq8/h/inKg="
+        },
+        "os-locale": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-2.1.0.tgz",
+          "integrity": "sha512-3sslG3zJbEYcaC4YVAvDorjGxc7tv6KVATnLPZONiljsUncvihe9BQoVCEs0RZ1kmf4Hk9OBqlZfJZWI4GanKA=="
+        },
+        "path-type": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/path-type/-/path-type-2.0.0.tgz",
+          "integrity": "sha1-8BLMuEFbcJb8LaoQVMPXI4lZTHM="
+        },
+        "read-pkg": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-2.0.0.tgz",
+          "integrity": "sha1-jvHAYjxqbbDcZxPEv6xGMysjaPg="
+        },
+        "read-pkg-up": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-2.0.0.tgz",
+          "integrity": "sha1-a3KoBImE4MQeeVEP1en6mbO1Sb4="
+        },
+        "string-width": {
+          "version": "2.1.1",
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
+          "integrity": "sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw==",
+          "dependencies": {
+            "is-fullwidth-code-point": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
+              "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8="
+            },
+            "strip-ansi": {
+              "version": "4.0.0",
+              "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+              "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8="
+            }
+          }
+        },
+        "strip-bom": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
+          "integrity": "sha1-IzTBjpx1n3vdVv3vfprj1YjmjtM="
+        },
+        "which-module": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.0.tgz",
+          "integrity": "sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho="
+        },
+        "yargs": {
+          "version": "8.0.2",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-8.0.2.tgz",
+          "integrity": "sha1-YpmpBVsc78lp/355wdkY3Osiw2A="
+        },
+        "yargs-parser": {
+          "version": "7.0.0",
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-7.0.0.tgz",
+          "integrity": "sha1-jQrELxbqVd69MyyvTEA4s+P139k="
+        }
+      }
+    },
     "tslib": {
       "version": "1.7.1",
       "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.7.1.tgz",
@@ -8732,11 +9136,6 @@
       "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.8.29.tgz",
       "integrity": "sha1-KcVzMUgFe7Th913zW3qcty5qWd0=",
       "dependencies": {
-        "camelcase": {
-          "version": "1.2.1",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
-          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
-        },
         "yargs": {
           "version": "3.10.0",
           "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
@@ -8780,6 +9179,11 @@
       "resolved": "https://registry.npmjs.org/uniqs/-/uniqs-2.0.0.tgz",
       "integrity": "sha1-/+3ks2slKQaW5uFl1KWe25mOawI="
     },
+    "universalify": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.1.tgz",
+      "integrity": "sha1-+nG63UQ3r0wUiEHjs7Fl+enlkLc="
+    },
     "unpipe": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz",
@@ -8910,23 +9314,31 @@
       "resolved": "https://registry.npmjs.org/void-elements/-/void-elements-2.0.1.tgz",
       "integrity": "sha1-wGavtYK7HLQSjWDqkjkulNXp2+w="
     },
+    "walker": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/walker/-/walker-1.0.7.tgz",
+      "integrity": "sha1-L3+bj9ENZ3JisYqITijRlhjgKPs="
+    },
+    "watch": {
+      "version": "0.10.0",
+      "resolved": "https://registry.npmjs.org/watch/-/watch-0.10.0.tgz",
+      "integrity": "sha1-d3mLLaD5kQ1ZXxrOWwwiWFIfIdw="
+    },
     "watchpack": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.4.0.tgz",
-      "integrity": "sha1-ShRyvLuVK9Cpu0A2gB+VTfs5+qw=",
-      "dependencies": {
-        "async": {
-          "version": "2.5.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
-          "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw=="
-        }
-      }
+      "integrity": "sha1-ShRyvLuVK9Cpu0A2gB+VTfs5+qw="
     },
     "wbuf": {
       "version": "1.7.2",
       "resolved": "https://registry.npmjs.org/wbuf/-/wbuf-1.7.2.tgz",
       "integrity": "sha1-1pe5nx9ZUS3ydRvkJ2nBWAtYAf4="
     },
+    "webidl-conversions": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-4.0.2.tgz",
+      "integrity": "sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg=="
+    },
     "webpack": {
       "version": "3.5.5",
       "resolved": "https://registry.npmjs.org/webpack/-/webpack-3.5.5.tgz",
@@ -8942,11 +9354,6 @@
           "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
           "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg="
         },
-        "async": {
-          "version": "2.5.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
-          "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw=="
-        },
         "camelcase": {
           "version": "4.1.0",
           "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
@@ -8969,11 +9376,6 @@
           "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.4.1.tgz",
           "integrity": "sha1-BCHjOf1xQZs9oT0Smzl5BAIwR24="
         },
-        "find-up": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz",
-          "integrity": "sha1-RdG35QbHF93UgndaK3eSCjwMV6c="
-        },
         "load-json-file": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
@@ -9105,7 +9507,29 @@
     "webpack-notifier": {
       "version": "1.5.0",
       "resolved": "https://registry.npmjs.org/webpack-notifier/-/webpack-notifier-1.5.0.tgz",
-      "integrity": "sha1-wBAAfUSM68NN78mezyiPpejGuvY="
+      "integrity": "sha1-wBAAfUSM68NN78mezyiPpejGuvY=",
+      "dependencies": {
+        "lodash.clonedeep": {
+          "version": "3.0.2",
+          "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-3.0.2.tgz",
+          "integrity": "sha1-oKHkDYKl6on/WxR7hETtY9koJ9s="
+        },
+        "minimist": {
+          "version": "1.2.0",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
+          "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
+        },
+        "node-notifier": {
+          "version": "4.6.1",
+          "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-4.6.1.tgz",
+          "integrity": "sha1-BW0UJE89zBzq3+aK+c/wxUc6M/M="
+        },
+        "semver": {
+          "version": "5.4.1",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
+          "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg=="
+        }
+      }
     },
     "webpack-sources": {
       "version": "1.0.1",
@@ -9122,11 +9546,28 @@
       "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.1.tgz",
       "integrity": "sha1-domUmcGEtu91Q3fC27DNbLVdKec="
     },
+    "whatwg-encoding": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-1.0.1.tgz",
+      "integrity": "sha1-PGxFGhmO567FWx7GHQkgxngBpfQ="
+    },
     "whatwg-fetch": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-2.0.3.tgz",
       "integrity": "sha1-nITsLc9oGH/wC8ZOEnS0QhduHIQ="
     },
+    "whatwg-url": {
+      "version": "4.8.0",
+      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-4.8.0.tgz",
+      "integrity": "sha1-0pgaqRSMHgCkHFphMRZqtGg7vMA=",
+      "dependencies": {
+        "webidl-conversions": {
+          "version": "3.0.1",
+          "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-3.0.1.tgz",
+          "integrity": "sha1-JFNCdeKnvGvnvIZhHMFq4KVlSHE="
+        }
+      }
+    },
     "whet.extend": {
       "version": "0.9.9",
       "resolved": "https://registry.npmjs.org/whet.extend/-/whet.extend-0.9.9.tgz",
@@ -9157,6 +9598,11 @@
       "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.3.tgz",
       "integrity": "sha1-o9XabNXAvAAI03I0u68b7WMFkQc="
     },
+    "worker-farm": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/worker-farm/-/worker-farm-1.5.0.tgz",
+      "integrity": "sha512-DHRiUggxtbruaTwnLDm2/BRDKZIoOYvrgYUj5Bam4fU6Gtvc0FaEyoswFPBjMXAweGW2H4BDNIpy//1yXXuaqQ=="
+    },
     "wrap-ansi": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
@@ -9177,6 +9623,11 @@
       "resolved": "https://registry.npmjs.org/wtf-8/-/wtf-8-1.0.0.tgz",
       "integrity": "sha1-OS2LotDxw00e4tYw8V0O+2jhBIo="
     },
+    "xml-name-validator": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-2.0.1.tgz",
+      "integrity": "sha1-TYuPHszTQZqjYgYb7O9RXh5VljU="
+    },
     "xmlhttprequest-ssl": {
       "version": "1.5.3",
       "resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-1.5.3.tgz",
@@ -9242,4 +9693,4 @@
       "integrity": "sha1-AI4G2AlDIMNy28L47XagymyKxBk="
     }
   }
-}
+}
\ No newline at end of file
diff --git a/packages/merge-styles/jest.config.js b/packages/merge-styles/jest.config.js
new file mode 100644
index 0000000000000..a92c71220a900
--- /dev/null
+++ b/packages/merge-styles/jest.config.js
@@ -0,0 +1,3 @@
+let { createConfig } = require('../../scripts/tasks/jest-resources');
+
+module.exports = createConfig();
diff --git a/packages/merge-styles/karma.config.js b/packages/merge-styles/karma.config.js
deleted file mode 100644
index 0dc91c71db96f..0000000000000
--- a/packages/merge-styles/karma.config.js
+++ /dev/null
@@ -1,111 +0,0 @@
-'use strict';
-
-// Karma configuration
-// Generated on Thu Oct 08 2015 18:13:05 GMT-0700 (PDT)
-
-let path = require('path');
-let configResources = require('../../scripts/tasks/karma-resources');
-let bindPolyfillPath = configResources.bindPolyfillPath;
-let debugRun = (process.argv.indexOf('--debug') > -1);
-
-module.exports = function (config) {
-  let karmaConfig = {
-
-    // base path that will be used to resolve all patterns (eg. files, exclude)
-    basePath: '.',
-
-    // frameworks to use
-    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
-    frameworks: ['mocha', 'sinon-chai'],
-
-
-    // list of files / patterns to load in the browser
-    files: configResources.files.concat([
-      path.join('lib', '**', '*.test.js')
-    ]),
-
-
-    // list of files to exclude
-    exclude: [],
-
-
-    // webpack config for bundling tests.
-    webpack: {
-      devtool: 'source-map',
-      module: {
-        loaders: [
-          {
-            test: /sinon\.js$/,
-            loader: 'imports?define=>false',
-            enforce: 'pre'
-          },
-          debugRun ? {} : {
-            test: /\.js/,
-            exclude: /(test|node_modules|bower_components)/,
-            loader: configResources.istanbulInstrumenterLoaderPath,
-            enforce: 'post'
-          }
-        ],
-      },
-      externals: {
-        'cheerio': 'window',
-        'react/addons': true,
-        'react/lib/ExecutionEnvironment': true,
-        'react/lib/ReactContext': true
-      },
-      resolve: {
-        modules: [
-          'lib',
-          'node_modules'
-        ]
-      }
-    },
-
-    webpackMiddleware: {
-      noInfo: true
-    },
-
-    // preprocess matching files before serving them to the browser
-    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
-    preprocessors: {
-      [path.join('lib', '/**/*.js')]: ['webpack']
-    },
-
-    plugins: configResources.plugins.concat([
-    ]),
-
-    // test results reporter to use
-    // possible values: 'dots', 'progress'
-    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
-    reporters: ['mocha-clean', 'coverage'],
-
-
-    // web server port
-    port: 9876,
-
-
-    // enable / disable colors in the output (reporters and logs)
-    colors: true,
-
-
-    // level of logging
-    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
-    logLevel: config.LOG_INFO,
-
-
-    // enable / disable watching file and executing tests whenever any file changes
-    autoWatch: false,
-
-
-    // start these browsers
-    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
-    browsers: ['PhantomJS'],
-
-
-    // Continuous Integration mode
-    // if true, Karma captures browsers, runs the tests and exits
-    singleRun: true
-  };
-
-  config.set(karmaConfig);
-};
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index a8399b8cd027f..7fd64d978ad65 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -11,11 +11,11 @@
   "license": "MIT",
   "scripts": {
     "build": "node ../../scripts/build.js",
-    "clean": "node ../../scripts/clean.js"
+    "clean": "node ../../scripts/clean.js",
+    "start-test": "node ../../scripts/start-test.js"
   },
   "devDependencies": {
-    "@types/chai": "3.4.35",
-    "@types/enzyme": "2.8.0",
+    "@types/jest": "^20.0.8",
     "@types/es6-promise": "^0.0.32",
     "@types/es6-weak-map": "1.2.0",
     "@types/mocha": "2.2.39",
diff --git a/packages/merge-styles/src/common/tests.ts b/packages/merge-styles/src/common/tests.ts
deleted file mode 100644
index 460f057cc9862..0000000000000
--- a/packages/merge-styles/src/common/tests.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-// Polyfills
-import 'es6-map/implement';
-
-/**
- * This is a test entry point to help karma-webpack find all tests in the project.
- **/
-
-// Before loading modules, treat errors and warnings as test failures.
-console.error = console.warn = (warning: string) => {
-  throw new Error(warning);
-};
-
-const testContext = require.context('..', true, /.+\.test\.js?$/);
-
-testContext.keys().forEach(testContext);
-module.exports = testContext;
diff --git a/packages/merge-styles/src/concatStyleSets.test.ts b/packages/merge-styles/src/concatStyleSets.test.ts
index 4d7e59d8cfe1e..2e39f2d1305f0 100644
--- a/packages/merge-styles/src/concatStyleSets.test.ts
+++ b/packages/merge-styles/src/concatStyleSets.test.ts
@@ -1,6 +1,5 @@
 import { concatStyleSets } from './concatStyleSets';
 import { IStyle } from './IStyle';
-const { expect } = chai;
 
 describe('concatStyleSets', () => {
   it('can concat style sets', () => {
@@ -22,7 +21,7 @@ describe('concatStyleSets', () => {
       }
     );
 
-    expect(result).eqls({
+    expect(result).toEqual({
       root: [
         { background: 'red' },
         {
diff --git a/packages/merge-styles/src/fontFace.test.ts b/packages/merge-styles/src/fontFace.test.ts
index 722e1340be8c0..3aab715c8659b 100644
--- a/packages/merge-styles/src/fontFace.test.ts
+++ b/packages/merge-styles/src/fontFace.test.ts
@@ -4,7 +4,6 @@ import {
   InjectionMode
 } from './Stylesheet';
 
-const { expect } = chai;
 const _stylesheet: Stylesheet = Stylesheet.getInstance();
 
 _stylesheet.setConfig({ injectionMode: InjectionMode.none });
@@ -15,6 +14,6 @@ describe('fontFace', () => {
       fontFamily: 'Segoe UI',
       src: 'url("foo")'
     });
-    expect(_stylesheet.getRules()).equals('@font-face{font-family:Segoe UI;src:url("foo");}');
+    expect(_stylesheet.getRules()).toEqual('@font-face{font-family:Segoe UI;src:url("foo");}');
   });
 });
\ No newline at end of file
diff --git a/packages/merge-styles/src/keyframes.test.ts b/packages/merge-styles/src/keyframes.test.ts
index 573a4fb8d3379..064596cd05d35 100644
--- a/packages/merge-styles/src/keyframes.test.ts
+++ b/packages/merge-styles/src/keyframes.test.ts
@@ -4,7 +4,6 @@ import {
   InjectionMode
 } from './Stylesheet';
 
-const { expect } = chai;
 const _stylesheet: Stylesheet = Stylesheet.getInstance();
 
 _stylesheet.setConfig({ injectionMode: InjectionMode.none });
@@ -24,7 +23,7 @@ describe('keyframes', () => {
       }
     });
 
-    expect(_stylesheet.getRules()).equals(
+    expect(_stylesheet.getRules()).toEqual(
       '@keyframes css-0{from{opacity:0;}to{opacity:1;}}'
     );
   });
@@ -42,7 +41,7 @@ describe('keyframes', () => {
       }
     });
 
-    expect(_stylesheet.getRules()).equals(
+    expect(_stylesheet.getRules()).toEqual(
       '@keyframes css-0{0%{opacity:0;}50%{opacity:0.8;}100%{opacity:1;}}'
     );
   });
diff --git a/packages/merge-styles/src/mergeStyleSets.test.ts b/packages/merge-styles/src/mergeStyleSets.test.ts
index 3736931fb58c8..55d20b51755e7 100644
--- a/packages/merge-styles/src/mergeStyleSets.test.ts
+++ b/packages/merge-styles/src/mergeStyleSets.test.ts
@@ -4,7 +4,6 @@ import {
   InjectionMode
 } from './Stylesheet';
 
-const { expect } = chai;
 const _stylesheet: Stylesheet = Stylesheet.getInstance();
 
 _stylesheet.setConfig({ injectionMode: InjectionMode.none });
@@ -35,13 +34,13 @@ describe('mergeStyleSets', () => {
       }
     );
 
-    expect(result).eqls({
+    expect(result).toEqual({
       root: 'css-0',
       a: 'css-1',
       b: 'css-2'
     });
 
-    expect(_stylesheet.getRules()).equals(
+    expect(_stylesheet.getRules()).toEqual(
       '.css-0{background:red;}.css-0:hover{background:yellow;}' +
       '.css-1{background:white;}' +
       '.css-2{background:blue;}'
diff --git a/packages/merge-styles/src/mergeStyles.test.ts b/packages/merge-styles/src/mergeStyles.test.ts
index a251bbe9e1245..39a19e4329d10 100644
--- a/packages/merge-styles/src/mergeStyles.test.ts
+++ b/packages/merge-styles/src/mergeStyles.test.ts
@@ -4,7 +4,6 @@ import {
   InjectionMode
 } from './Stylesheet';
 
-const { expect } = chai;
 const _stylesheet: Stylesheet = Stylesheet.getInstance();
 
 _stylesheet.setConfig({ injectionMode: InjectionMode.none });
@@ -15,32 +14,32 @@ describe('mergeStyles', () => {
   });
 
   it('can join strings', () => {
-    expect(mergeStyles('a', false, null, undefined, 'b')).equals('a b');
+    expect(mergeStyles('a', false, null, undefined, 'b')).toEqual('a b');
   });
 
   it('can join arrays of strings', () => {
-    expect(mergeStyles(['a', 'b', 'c'], false, null, undefined)).equals('a b c');
+    expect(mergeStyles(['a', 'b', 'c'], false, null, undefined)).toEqual('a b c');
   });
 
   it('can mix styles and classnames together', () => {
-    expect(mergeStyles('foo', { background: 'red' })).equals('foo css-0');
-    expect(_stylesheet.getRules()).equals('.css-0{background:red;}');
+    expect(mergeStyles('foo', { background: 'red' })).toEqual('foo css-0');
+    expect(_stylesheet.getRules()).toEqual('.css-0{background:red;}');
   });
 
   it('can remerge styles', () => {
     const className: string = mergeStyles({ background: 'red', color: 'black' });
     const newClassName = mergeStyles(className, { color: 'white' });
 
-    expect(className).equals('css-0');
-    expect(newClassName).equals('css-1');
-    expect(_stylesheet.getRules()).equals(
+    expect(className).toEqual('css-0');
+    expect(newClassName).toEqual('css-1');
+    expect(_stylesheet.getRules()).toEqual(
       '.css-0{background:red;color:black;}.css-1{background:red;color:white;}'
     );
   });
 
   it('can normalize margins', () => {
     mergeStyles({ margin: '4px' }, { marginRight: '8px' });
-    expect(_stylesheet.getRules()).equals(
+    expect(_stylesheet.getRules()).toEqual(
       '.css-0{margin-top:4px;margin-right:8px;margin-bottom:4px;margin-left:4px;}'
     );
   });
diff --git a/packages/merge-styles/src/server.test.ts b/packages/merge-styles/src/server.test.ts
index 68a9ec7c343ba..65179847b1a0f 100644
--- a/packages/merge-styles/src/server.test.ts
+++ b/packages/merge-styles/src/server.test.ts
@@ -3,8 +3,6 @@ import {
   mergeStyleSets
 } from './mergeStyleSets';
 
-const { expect } = chai;
-
 describe('staticRender', () => {
   it('can render content', () => {
 
@@ -18,7 +16,7 @@ describe('staticRender', () => {
       return `<div class="${classNames.root}">Hello!</div>`;
     });
 
-    expect(html).equals(`<div class="css-0">Hello!</div>`);
-    expect(css).equals(`.css-0{background:red;}`);
+    expect(html).toEqual(`<div class="css-0">Hello!</div>`);
+    expect(css).toEqual(`.css-0{background:red;}`);
   });
 });
\ No newline at end of file
diff --git a/packages/merge-styles/src/styleToClassName.test.ts b/packages/merge-styles/src/styleToClassName.test.ts
index ba11f25e031aa..e7ceed1f05327 100644
--- a/packages/merge-styles/src/styleToClassName.test.ts
+++ b/packages/merge-styles/src/styleToClassName.test.ts
@@ -6,7 +6,6 @@ import {
   Stylesheet
 } from './Stylesheet';
 
-const { expect } = chai;
 const _stylesheet: Stylesheet = Stylesheet.getInstance();
 
 _stylesheet.setConfig({ injectionMode: InjectionMode.none });
@@ -19,18 +18,18 @@ describe('styleToClassName', () => {
   it('can register classes and avoid re-registering', () => {
     let className = styleToClassName({ background: 'red' });
 
-    expect(className).equals('css-0');
-    expect(_stylesheet.getRules()).equals('.css-0{background:red;}');
+    expect(className).toEqual('css-0');
+    expect(_stylesheet.getRules()).toEqual('.css-0{background:red;}');
 
     className = styleToClassName({ background: 'red' });
 
-    expect(className).equals('css-0');
-    expect(_stylesheet.getRules()).equals('.css-0{background:red;}');
+    expect(className).toEqual('css-0');
+    expect(_stylesheet.getRules()).toEqual('.css-0{background:red;}');
 
     className = styleToClassName({ background: 'green' });
 
-    expect(className).equals('css-1');
-    expect(_stylesheet.getRules()).equals('.css-0{background:red;}.css-1{background:green;}');
+    expect(className).toEqual('css-1');
+    expect(_stylesheet.getRules()).toEqual('.css-0{background:red;}.css-1{background:green;}');
   });
 
   it('can register pseudo selectors', () => {
@@ -40,8 +39,8 @@ describe('styleToClassName', () => {
       }
     });
 
-    expect(className).equals('css-0');
-    expect(_stylesheet.getRules()).equals('.css-0:hover{background:red;}');
+    expect(className).toEqual('css-0');
+    expect(_stylesheet.getRules()).toEqual('.css-0:hover{background:red;}');
   });
 
   it('can register parent and sibling selectors', () => {
@@ -52,8 +51,8 @@ describe('styleToClassName', () => {
       }
     });
 
-    expect(className).equals('css-0');
-    expect(_stylesheet.getRules()).equals('.css-0 .child{background:red;}.parent .css-0{background:green;}');
+    expect(className).toEqual('css-0');
+    expect(_stylesheet.getRules()).toEqual('.css-0 .child{background:red;}.parent .css-0{background:green;}');
   });
 
   it('can merge rules', () => {
@@ -65,42 +64,42 @@ describe('styleToClassName', () => {
       { backgroundColor: 'green' }
     );
 
-    expect(className).equals('css-0');
-    expect(_stylesheet.getRules()).equals('.css-0{background-color:green;color:white;}');
+    expect(className).toEqual('css-0');
+    expect(_stylesheet.getRules()).toEqual('.css-0{background-color:green;color:white;}');
 
     className = styleToClassName({ backgroundColor: 'green', color: 'white' });
-    expect(className).equals('css-0');
+    expect(className).toEqual('css-0');
   });
 
   it('returns blank string with no input', () => {
-    expect(styleToClassName()).equals('');
+    expect(styleToClassName()).toEqual('');
   });
 
   it('can preserve displayName in names', () => {
-    expect(styleToClassName({ displayName: 'DisplayName', background: 'red' })).equals('DisplayName-0');
-    expect(_stylesheet.getRules()).equals('.DisplayName-0{background:red;}');
+    expect(styleToClassName({ displayName: 'DisplayName', background: 'red' })).toEqual('DisplayName-0');
+    expect(_stylesheet.getRules()).toEqual('.DisplayName-0{background:red;}');
   });
 
   it('can flip rtl and add units', () => {
     setRTL(true);
 
     styleToClassName({ left: 40 });
-    expect(_stylesheet.getRules()).equals('.css-0{right:40px;}');
+    expect(_stylesheet.getRules()).toEqual('.css-0{right:40px;}');
 
     setRTL(false);
   });
 
   it('can prefix webkit specific things', () => {
     styleToClassName({ WebkitFontSmoothing: 'none' });
-    expect(_stylesheet.getRules()).equals('.css-0{-webkit-font-smoothing:none;}');
+    expect(_stylesheet.getRules()).toEqual('.css-0{-webkit-font-smoothing:none;}');
   });
 
   it('can expand previously defined rules', () => {
     const className = styleToClassName({ background: 'red' });
     const newClassName = styleToClassName(className, { color: 'white' });
 
-    expect(newClassName).equals('css-1');
-    expect(_stylesheet.getRules()).equals('.css-0{background:red;}.css-1{background:red;color:white;}');
+    expect(newClassName).toEqual('css-1');
+    expect(_stylesheet.getRules()).toEqual('.css-0{background:red;}.css-1{background:red;color:white;}');
   });
 
   it('can expand an array of rules', () => {
@@ -108,7 +107,7 @@ describe('styleToClassName', () => {
       { background: 'red' },
       { background: 'white' }
     ]);
-    expect(_stylesheet.getRules()).equals('.css-0{background:white;}');
+    expect(_stylesheet.getRules()).toEqual('.css-0{background:white;}');
   });
 
   it('can expand increased specificity rules', () => {
@@ -120,6 +119,6 @@ describe('styleToClassName', () => {
       }
     });
 
-    expect(_stylesheet.getRules()).equals('.css-0.css-0.css-0{background:red;}');
+    expect(_stylesheet.getRules()).toEqual('.css-0.css-0.css-0{background:red;}');
   });
 });
diff --git a/packages/merge-styles/src/transforms/kebabRules.test.ts b/packages/merge-styles/src/transforms/kebabRules.test.ts
index 1670d6ada3971..210a236ff754d 100644
--- a/packages/merge-styles/src/transforms/kebabRules.test.ts
+++ b/packages/merge-styles/src/transforms/kebabRules.test.ts
@@ -1,7 +1,5 @@
 import { kebabRules } from './kebabRules';
 
-const { expect } = chai;
-
 describe('kebabRules', () => {
 
   it('can kebab the names', () => {
@@ -12,7 +10,7 @@ describe('kebabRules', () => {
 
     kebabRules(rules, 0);
 
-    expect(rules).eqls([
+    expect(rules).toEqual([
       'background-color',
       '#cAcAcA'
     ]);
@@ -26,7 +24,7 @@ describe('kebabRules', () => {
 
     kebabRules(rules, 0);
 
-    expect(rules).eqls([
+    expect(rules).toEqual([
       '-webkit-font-smoothing',
       'antialiased'
     ]);
diff --git a/packages/merge-styles/src/transforms/prefixRules.test.ts b/packages/merge-styles/src/transforms/prefixRules.test.ts
index 4f98cdea3d57e..d037633e6917e 100644
--- a/packages/merge-styles/src/transforms/prefixRules.test.ts
+++ b/packages/merge-styles/src/transforms/prefixRules.test.ts
@@ -1,13 +1,12 @@
 import { prefixRules } from './prefixRules';
 import { setVendorSettings } from '../getVendorSettings';
-const { expect } = chai;
 
 const AUTO_TRANSLATED_RULES = [
   'user-select'
 ];
 
 describe('prefixRules', () => {
-  after(() => {
+  afterAll(() => {
     setVendorSettings(undefined);
   });
 
@@ -18,7 +17,7 @@ describe('prefixRules', () => {
       setVendorSettings({ isWebkit: true });
       prefixRules(rules, 0);
 
-      expect(rules).eql([
+      expect(rules).toEqual([
         rule, 'none',
         '-webkit-' + rule, 'none'
       ]);
@@ -31,7 +30,7 @@ describe('prefixRules', () => {
 
       setVendorSettings({ isMoz: true });
       prefixRules(rules, 0);
-      expect(rules).eql([
+      expect(rules).toEqual([
         rule, 'none',
         '-moz-' + rule, 'none'
       ]);
@@ -44,7 +43,7 @@ describe('prefixRules', () => {
 
       setVendorSettings({ isMs: true });
       prefixRules(rules, 0);
-      expect(rules).eql([
+      expect(rules).toEqual([
         rule, 'none',
         '-ms-' + rule, 'none'
       ]);
@@ -57,7 +56,7 @@ describe('prefixRules', () => {
 
       setVendorSettings({ isOpera: true });
       prefixRules(rules, 0);
-      expect(rules).eql([
+      expect(rules).toEqual([
         rule, 'none',
         '-o-' + rule, 'none'
       ]);
diff --git a/packages/merge-styles/src/transforms/provideUnits.test.ts b/packages/merge-styles/src/transforms/provideUnits.test.ts
index 49f76a9922d6e..459ab0ee37c02 100644
--- a/packages/merge-styles/src/transforms/provideUnits.test.ts
+++ b/packages/merge-styles/src/transforms/provideUnits.test.ts
@@ -1,7 +1,5 @@
 import { provideUnits } from './provideUnits';
 
-const { expect } = chai;
-
 describe('provideUnits', () => {
   it('can provide units', () => {
     [
@@ -15,7 +13,7 @@ describe('provideUnits', () => {
 
       provideUnits(testSet, 0);
 
-      expect(testSet).eql([property, '1px']);
+      expect(testSet).toEqual([property, '1px']);
     });
   });
 
@@ -39,7 +37,7 @@ describe('provideUnits', () => {
       provideUnits(testSet, 6);
       provideUnits(testSet, 8);
 
-      expect(testSet).eql([
+      expect(testSet).toEqual([
         property, '1px',
         property + 'Left', '1px',
         property + 'Right', '1px',
@@ -57,7 +55,7 @@ describe('provideUnits', () => {
 
     provideUnits(testSet, 0);
 
-    expect(testSet).eql(['opacity', 0]);
+    expect(testSet).toEqual(['opacity', 0]);
   });
 
 });
\ No newline at end of file
diff --git a/packages/merge-styles/src/transforms/rtlifyRules.test.ts b/packages/merge-styles/src/transforms/rtlifyRules.test.ts
index e2ce99fd79ebb..209a367045edc 100644
--- a/packages/merge-styles/src/transforms/rtlifyRules.test.ts
+++ b/packages/merge-styles/src/transforms/rtlifyRules.test.ts
@@ -1,14 +1,12 @@
 import { setRTL, rtlifyRules } from './rtlifyRules';
 
-const { expect } = chai;
-
 describe('rtlifyRules', () => {
 
-  before(() => {
+  beforeAll(() => {
     setRTL(true);
   });
 
-  after(() => {
+  afterAll(() => {
     setRTL(false);
   });
 
@@ -39,7 +37,7 @@ describe('rtlifyRules', () => {
       [['box-shadow', '-42px 0 red'], ['box-shadow', '42px 0 red']]
     ].forEach((test: string[][]) => {
       rtlifyRules(test[0], 0);
-      expect(test[0]).eqls(test[1]);
+      expect(test[0]).toEqual(test[1]);
     });
   });
 
@@ -48,7 +46,7 @@ describe('rtlifyRules', () => {
 
     rtlifyRules(rules, 0);
 
-    expect(rules).eqls(['cursor', 'hand']);
+    expect(rules).toEqual(['cursor', 'hand']);
   });
 
 });
diff --git a/packages/merge-styles/tsconfig.json b/packages/merge-styles/tsconfig.json
index fd37bdf5317cb..0da240cd5b6fb 100644
--- a/packages/merge-styles/tsconfig.json
+++ b/packages/merge-styles/tsconfig.json
@@ -16,9 +16,7 @@
     "forceConsistentCasingInFileNames": true,
     "moduleResolution": "node",
     "types": [
-      "chai",
-      "mocha",
-      "webpack-env"
+      "jest"
     ]
   },
   "include": [
diff --git a/scripts/build.js b/scripts/build.js
index bd68e5c73e5d8..48f11c5a0db2d 100644
--- a/scripts/build.js
+++ b/scripts/build.js
@@ -11,6 +11,7 @@ let tasks = [
   'tslint',
   'ts',
   'karma',
+  'jest',
   'webpack'
 ];
 
diff --git a/scripts/debug-test.js b/scripts/debug-test.js
new file mode 100644
index 0000000000000..70ac7d87037fe
--- /dev/null
+++ b/scripts/debug-test.js
@@ -0,0 +1,13 @@
+const path = require('path');
+const findConfig = require('./find-config');
+
+const configPath = findConfig('jest.config.js');
+const rushPath = findConfig('rush.json');
+
+if (!configPath || !rushPath) {
+  console.log(
+    'Unable to find jest.config.js relative to currently opened file. Run debug-test from an open source file in a jest enabled project.');
+} else {
+  process.chdir(path.dirname(configPath));
+  require(path.resolve(path.dirname(rushPath), 'scripts/node_modules/jest-cli/bin/jest'));
+}
diff --git a/scripts/exec-sync.js b/scripts/exec-sync.js
index 4a989911be35a..84b3b41e26363 100644
--- a/scripts/exec-sync.js
+++ b/scripts/exec-sync.js
@@ -8,14 +8,14 @@ const SEPARATOR = process.platform === 'win32' ? ';' : ':',
 
 env.PATH = path.resolve('./node_modules/.bin') + SEPARATOR + env.PATH;
 
-function myExecSync(cmd, displayName) {
+function myExecSync(cmd, displayName, cwd = process.cwd()) {
   let returnValue = 0;
   let start = new Date().getTime();
 
   logStatus(chalk.gray('Executing: ') + chalk.cyan(displayName || cmd));
 
   const output = execSync(cmd, {
-    cwd: process.cwd(),
+    cwd,
     env: env,
     stdio: 'inherit'
   });
diff --git a/scripts/find-config.js b/scripts/find-config.js
new file mode 100644
index 0000000000000..c941c7b68c102
--- /dev/null
+++ b/scripts/find-config.js
@@ -0,0 +1,21 @@
+function findConfig(configName) {
+  const fs = require('fs');
+  const path = require('path');
+  const rootPath = path.resolve('/');
+
+  let cwd = process.cwd();
+
+  while (cwd !== rootPath) {
+    const configPath = path.join(cwd, configName);
+
+    if (fs.existsSync(configPath)) {
+      return configPath;
+    }
+
+    cwd = path.dirname(cwd);
+  }
+
+  return undefined;
+}
+
+module.exports = findConfig;
diff --git a/scripts/package.json b/scripts/package.json
index 802b4d578ad8a..d3213049d4a53 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -20,6 +20,8 @@
     "gzip-size": "^3.0.0",
     "istanbul-instrumenter-loader": "^3.0.0",
     "json-loader": "^0.5.7",
+    "jest": "^20.0.4",
+    "ts-jest": "^20.0.13",
     "karma": "^1.7.0",
     "karma-coverage": "^1.1.1",
     "karma-mocha": "^1.3.0",
diff --git a/scripts/start-test.js b/scripts/start-test.js
new file mode 100644
index 0000000000000..aa49cb957d653
--- /dev/null
+++ b/scripts/start-test.js
@@ -0,0 +1,3 @@
+require('./tasks/jest')({
+  'args': '--watch'
+});;
diff --git a/scripts/tasks/jest-reporter.js b/scripts/tasks/jest-reporter.js
new file mode 100644
index 0000000000000..1ee04c7034c25
--- /dev/null
+++ b/scripts/tasks/jest-reporter.js
@@ -0,0 +1,18 @@
+const DefaultReporter = require('jest-cli/build/reporters/DefaultReporter');
+
+/**
+ * The purpose of this custom reporter is to prevent Jest from logging to stderr
+ * when there are no errors.
+ */
+class JestReporter extends DefaultReporter {
+  constructor(globalConfig) {
+    super(globalConfig);
+  }
+
+  log(message) {
+    process.stdout.write(message + '\n');
+  }
+
+}
+
+module.exports = JestReporter;
diff --git a/scripts/tasks/jest-resources.js b/scripts/tasks/jest-resources.js
new file mode 100644
index 0000000000000..718b611da7b1d
--- /dev/null
+++ b/scripts/tasks/jest-resources.js
@@ -0,0 +1,24 @@
+const path = require('path');
+
+module.exports = {
+  createConfig: () => (
+    {
+      moduleNameMapper: {
+        'ts-jest': path.resolve(__dirname, '../node_modules/ts-jest')
+      },
+      "transform": {
+        ".(ts|tsx)": path.resolve(__dirname, '../node_modules/ts-jest/preprocessor.js')
+      },
+      "reporters": [
+        path.resolve(__dirname, './jest-reporter.js')
+      ],
+      "testRegex": "(/__tests__/.*|\\.(test|spec))\\.(ts|tsx)$",
+      "moduleFileExtensions": [
+        "ts",
+        "tsx",
+        "js",
+        "jsx",
+        "json"
+      ]
+    })
+};
diff --git a/scripts/tasks/jest.js b/scripts/tasks/jest.js
new file mode 100644
index 0000000000000..f81dd422518cf
--- /dev/null
+++ b/scripts/tasks/jest.js
@@ -0,0 +1,16 @@
+module.exports = function (options) {
+  const path = require('path');
+  const fs = require('fs');
+  const execSync = require('../exec-sync');
+  const findConfig = require('../find-config');
+
+  const jestPath = path.resolve(__dirname, '../node_modules/jest/bin/jest');
+  const jestConfigPath = findConfig('jest.config.js');
+  const coverage = (options.isProduction) ? ' --coverage' : '';
+
+  if (fs.existsSync(jestConfigPath)) {
+    const command = `node ${jestPath} --config ${jestConfigPath} ${coverage} ${options.args || ''}`;
+
+    execSync(command, undefined, path.dirname(jestConfigPath));
+  }
+};
diff --git a/scripts/tasks/sass.js b/scripts/tasks/sass.js
index 749dba37bb1a0..0b70a00e71f97 100644
--- a/scripts/tasks/sass.js
+++ b/scripts/tasks/sass.js
@@ -1,16 +1,7 @@
 module.exports = function (options) {
-  const execSync = require('../exec-sync');
   const glob = require('glob');
-  const sass = require('node-sass');
   const path = require('path');
-  const fs = require('fs');
-  const postcss = require('postcss');
-  const { splitStyles } = require("@microsoft/load-themed-styles");
-  const autoprefixer = require('autoprefixer')({ browsers: ['> 1%', 'last 2 versions', 'ie >= 11'] });
-  const modules = require('postcss-modules')({
-    getJSON,
-    generateScopedName
-  });
+
   const _fileNameToClassMap = {};
 
   // Return a promise.
@@ -18,36 +9,50 @@ module.exports = function (options) {
 
   function processFiles() {
     const promises = [];
-
-    glob.sync(path.resolve(process.cwd(), 'src/**/*.scss')).forEach(fileName => {
-      fileName = path.resolve(fileName);
-
-      promises.push(new Promise((resolve, reject) => {
-        sass.render(
-          {
-            file: fileName,
-            outputStyle: 'compressed',
-            importer: patchSassUrl,
-            includePaths: [
-              path.resolve(process.cwd(), 'node_modules')
-            ]
-          },
-          (err, result) => {
-            if (err) {
-              reject(path.relative(process.cwd(), fileName) + ': ' + err);
-            } else {
-              const css = result.css.toString();
-
-              postcss([autoprefixer, modules])
-                .process(css, { from: fileName })
-                .then(result => {
-                  fs.writeFileSync(fileName + '.ts', createTypeScriptModule(fileName, result.css));
-                  resolve();
-                });
-            }
-          });
-      }));
-    });
+    const files = glob.sync(path.resolve(process.cwd(), 'src/**/*.scss'));
+
+    if (files.length) {
+      const execSync = require('../exec-sync');
+      const sass = require('node-sass');
+      const fs = require('fs');
+      const postcss = require('postcss');
+      const autoprefixer = require('autoprefixer')({ browsers: ['> 1%', 'last 2 versions', 'ie >= 11'] });
+      const modules = require('postcss-modules')({
+        getJSON,
+        generateScopedName
+      });
+
+      files.forEach(fileName => {
+
+        fileName = path.resolve(fileName);
+
+        promises.push(new Promise((resolve, reject) => {
+          sass.render(
+            {
+              file: fileName,
+              outputStyle: 'compressed',
+              importer: patchSassUrl,
+              includePaths: [
+                path.resolve(process.cwd(), 'node_modules')
+              ]
+            },
+            (err, result) => {
+              if (err) {
+                reject(path.relative(process.cwd(), fileName) + ': ' + err);
+              } else {
+                const css = result.css.toString();
+
+                postcss([autoprefixer, modules])
+                  .process(css, { from: fileName })
+                  .then(result => {
+                    fs.writeFileSync(fileName + '.ts', createTypeScriptModule(fileName, result.css));
+                    resolve();
+                  });
+              }
+            });
+        }));
+      });
+    }
 
     return Promise.all(promises);
   }
@@ -63,6 +68,8 @@ module.exports = function (options) {
   }
 
   function createTypeScriptModule(fileName, css) {
+    const { splitStyles } = require("@microsoft/load-themed-styles");
+
     // Create a source file.
     const source = [
       `/* tslint:disable */`,
diff --git a/scripts/tasks/webpack.js b/scripts/tasks/webpack.js
index 292d63dc144c6..7acf420cdf91c 100644
--- a/scripts/tasks/webpack.js
+++ b/scripts/tasks/webpack.js
@@ -11,7 +11,12 @@ module.exports = function (options) {
     return new Promise((resolve, reject) => {
       webpack(config, (err, stats) => {
         if (err || stats.hasErrors()) {
-          reject(err);
+          const chalk = require('chalk');
+          let errorStats = stats.toJson('errors-only');
+          errorStats.errors.forEach(error => {
+            console.log(chalk.red(error));
+          })
+          reject(`Webpack failed with ${errorStats.errors.length} error(s).`);
         } else {
           _printStats(stats);
           resolve();

From 02d0358d39021ab96b27eb1ad78f595e3891d9a5 Mon Sep 17 00:00:00 2001
From: Junle Li <lijunle@gmail.com>
Date: Fri, 1 Sep 2017 06:30:59 +0800
Subject: [PATCH 0544/1641] Add FullWidth icon (#2689)

* Add FullWidth icon to icon name and codes list.

* Run rush change.

* Update the comment for styling package change file.

* Update IconCodes.ts
---
 .../@uifabric/styling/master_2017-08-31-16-34.json    | 11 +++++++++++
 .../master_2017-08-31-16-34.json                      | 11 +++++++++++
 .../src/components/Icon/IconName.ts                   |  1 +
 packages/styling/src/styles/IconCodes.ts              |  4 ++++
 4 files changed, 27 insertions(+)
 create mode 100644 common/changes/@uifabric/styling/master_2017-08-31-16-34.json
 create mode 100644 common/changes/office-ui-fabric-react/master_2017-08-31-16-34.json

diff --git a/common/changes/@uifabric/styling/master_2017-08-31-16-34.json b/common/changes/@uifabric/styling/master_2017-08-31-16-34.json
new file mode 100644
index 0000000000000..72096e96cb1cd
--- /dev/null
+++ b/common/changes/@uifabric/styling/master_2017-08-31-16-34.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "Add FullWidth icon.",
+      "packageName": "@uifabric/styling",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "lijunle@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2017-08-31-16-34.json b/common/changes/office-ui-fabric-react/master_2017-08-31-16-34.json
new file mode 100644
index 0000000000000..6e48201842acf
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2017-08-31-16-34.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add FullWidth icon.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lijunle@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Icon/IconName.ts b/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
index 6b41fd25130b1..4a641588699bc 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
@@ -391,6 +391,7 @@ export type IconName =
   'FullCircleMask' |
   'FullHistory' |
   'FullScreen' |
+  'FullWidth' |
   'Generate' |
   'Giftbox' |
   'GiftboxOpen' |
diff --git a/packages/styling/src/styles/IconCodes.ts b/packages/styling/src/styles/IconCodes.ts
index a614c31bcd888..555ad9be94fa3 100644
--- a/packages/styling/src/styles/IconCodes.ts
+++ b/packages/styling/src/styles/IconCodes.ts
@@ -1275,6 +1275,10 @@ export const IconCodes = {
    * Icon code with the value '\uE740'.
    */
   fullScreen: '\uE740',
+  /**
+   * Icon code with the value '\uF2FE'.
+   */
+  fullWidth: '\uF2FE',
   /**
    * Icon code with the value '\uE9DA'.
    */

From fded8a25de72a6469ac2a3419e7d687e766a4ae3 Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Thu, 31 Aug 2017 15:32:25 -0700
Subject: [PATCH 0545/1641] Swatchcolorpicker correctlyupdate (#2680)

* fixed it so that the swatchcolorpicker will correctly update if the selected index passed in does not exist

* adding change file

* adding chnage file

* cleaned change file
---
 ...hcolorpicker-correctlyupdate_2017-08-29-22-12.json | 11 +++++++++++
 .../SwatchColorPicker/SwatchColorPicker.tsx           |  3 +--
 2 files changed, 12 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/swatchcolorpicker-correctlyupdate_2017-08-29-22-12.json

diff --git a/common/changes/office-ui-fabric-react/swatchcolorpicker-correctlyupdate_2017-08-29-22-12.json b/common/changes/office-ui-fabric-react/swatchcolorpicker-correctlyupdate_2017-08-29-22-12.json
new file mode 100644
index 0000000000000..0b56f5642a3d4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/swatchcolorpicker-correctlyupdate_2017-08-29-22-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SwatchColorPicker: Fixed so it will deselect the current items if there is a selected id passed in that does not exist in the color list",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
index 40d3efe39749b..fc8995d22a0bd 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
@@ -58,8 +58,7 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
       newSelectedIndex = this._getSelectedIndex(newProps.colorCells, newProps.selectedId);
     }
 
-    if (newSelectedIndex !== undefined &&
-      newSelectedIndex !== this.state.selectedIndex) {
+    if (newSelectedIndex !== this.state.selectedIndex) {
       this.setState({
         selectedIndex: newSelectedIndex
       });

From f8c4a896fa35d23c3fcbda2d3e5d98b87f9d98af Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 31 Aug 2017 15:40:17 -0700
Subject: [PATCH 0546/1641] Update json loader name from json to json-loader
 (#2695)

---
 scripts/tasks/webpack-resources.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/scripts/tasks/webpack-resources.js b/scripts/tasks/webpack-resources.js
index 89055d59c1bdc..50f89e2f3be1f 100644
--- a/scripts/tasks/webpack-resources.js
+++ b/scripts/tasks/webpack-resources.js
@@ -94,7 +94,7 @@ module.exports = {
             {
               test: [/\.json$/],
               enforce: 'pre',
-              loader: 'json',
+              loader: 'json-loader',
               exclude: [
                 /node_modules/
               ]

From 9cd0df8633aca2afde1ba2c2e811434939c13bf1 Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Thu, 31 Aug 2017 16:49:27 -0700
Subject: [PATCH 0547/1641] Calendar date culture formating (#2651)

* no message

* no message

* Adding option to add date formatting to calendar

* Adding change file

* Updating text for props

* Updating definition

* Updating based on PR feedback

* Updating dateTimeFormatter prop based on feedback

* added dateTimeFormatter callback for formatting mmmm d, yyyy.  Updated aria labels with dateTimeFormatter
---
 ...DateCultureFormating_2017-08-28-17-55.json | 11 ++++++
 .../src/components/Calendar/Calendar.Props.ts | 38 ++++++++++++++-----
 .../src/components/Calendar/Calendar.scss     |  6 +--
 .../src/components/Calendar/Calendar.test.tsx | 14 ++-----
 .../src/components/Calendar/Calendar.tsx      | 14 ++++++-
 .../src/components/Calendar/CalendarDay.tsx   | 15 ++++----
 .../src/components/Calendar/CalendarMonth.tsx | 11 +++---
 7 files changed, 71 insertions(+), 38 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-CalendarDateCultureFormating_2017-08-28-17-55.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-CalendarDateCultureFormating_2017-08-28-17-55.json b/common/changes/office-ui-fabric-react/kegorr-CalendarDateCultureFormating_2017-08-28-17-55.json
new file mode 100644
index 0000000000000..af04c9b070803
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-CalendarDateCultureFormating_2017-08-28-17-55.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Calendar: Adding option to add date formatting to calendar",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
index 91b9eb4664e9b..9ee8f13ab73fb 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
@@ -104,6 +104,11 @@ export interface ICalendarProps extends React.Props<Calendar> {
   * Customize navigation icons using ICalendarIconStrings
   */
   navigationIcons?: ICalendarIconStrings;
+
+  /**
+  * Apply additional formating to dates, for example localized date formatting.
+  */
+  dateTimeFormatter?: ICalendarFormatDateCallbacks;
 }
 
 export interface ICalendarStrings {
@@ -155,16 +160,6 @@ export interface ICalendarStrings {
    * Aria-label for the "next year" button.
    */
   nextYearAriaLabel?: string;
-
-  /**
-  * Aria-label for the "month picker" header. When showMonthPickerAsOverlay is true the header becomes clickable.
-  */
-  monthPickerAriaLabel?: string;
-
-  /**
-  * Aria-label for the "day picker" header. When showMonthPickerAsOverlay is true the header becomes clickable.
-  */
-  dayPickerAriaLabel?: string;
 }
 
 export interface ICalendarIconStrings {
@@ -180,4 +175,27 @@ export interface ICalendarIconStrings {
   */
   rightNavigation?: string;
 
+}
+
+export interface ICalendarFormatDateCallbacks {
+  /**
+ * Callback to apply formatting to mmmm d, yyyy formated dates
+ */
+  formatMonthDayYear: (date: Date, strings?: ICalendarStrings) => string;
+
+  /**
+  * Callback to apply formatting to the month and year in the Day Picker header
+  */
+  formatMonthYear: (date: Date, strings?: ICalendarStrings) => string;
+
+  /**
+  * Callback to apply formatting to the days in the Day Picker calendar
+  */
+  formatDay: (date: Date) => string;
+
+  /**
+  * Callback to apply formatting to the year in the Month Picker header
+  */
+  formatYear: (date: Date) => string;
+
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
index 0458d5201e560..00277ead941a8 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
@@ -70,7 +70,7 @@ $Calendar-dayPicker-margin: 10px;
 
 
 // The month and year labels.
-.month,
+.monthAndYear,
 .year {
   display: inline-block;
   @include ms-font-xl;
@@ -83,7 +83,7 @@ $Calendar-dayPicker-margin: 10px;
   }
 }
 
-.month {
+.monthAndYear {
   @include margin-left(15px);
 }
 
@@ -439,7 +439,7 @@ $Calendar-dayPicker-margin: 10px;
       position: absolute;
     }
     // Size and position of the month and year labels.
-    .month {
+    .monthAndYear {
       @include margin-left(12px);
     }
 
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
index ab4e21b617a11..c74c111d5e81d 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
@@ -101,12 +101,9 @@ describe('Calendar', () => {
       let today = new Date();
       let monthName = dayPickerStrings.months[today.getMonth()];
       let year = today.getFullYear();
-      let dayPickerMonth = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-month');
+      let dayPickerMonth = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-monthAndYear');
       expect(dayPickerMonth).to.not.be.undefined;
-      expect(dayPickerMonth.textContent).to.equal(monthName);
-      let dayPickerYear = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-year');
-      expect(dayPickerYear).to.not.be.undefined;
-      expect(dayPickerYear.textContent).to.equal(year.toString());
+      expect(dayPickerMonth.textContent).to.equal(monthName + ' ' + year.toString());
     });
 
     it('Verify first day of week', () => {
@@ -164,12 +161,9 @@ describe('Calendar', () => {
 
     it('Verify day picker header', () => {
       let monthName = dayPickerStrings.months[defaultDate.getMonth()];
-      let dayPickerMonth = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-month');
+      let dayPickerMonth = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-monthAndYear');
       expect(dayPickerMonth).to.not.be.undefined;
-      expect(dayPickerMonth.textContent).to.equal(monthName);
-      let dayPickerYear = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-year');
-      expect(dayPickerYear).to.not.be.undefined;
-      expect(dayPickerYear.textContent).to.equal(defaultDate.getFullYear().toString());
+      expect(dayPickerMonth.textContent).to.equal(monthName + ' ' + defaultDate.getFullYear().toString());
     });
 
     it('Verify first day of week', () => {
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index 6093064ccf14b..9e895c616d79b 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { ICalendar, ICalendarProps, ICalendarIconStrings } from './Calendar.Props';
+import { ICalendar, ICalendarProps, ICalendarStrings, ICalendarIconStrings, ICalendarFormatDateCallbacks } from './Calendar.Props';
 import { DayOfWeek, DateRangeType } from '../../utilities/dateValues/DateValues';
 import { CalendarDay } from './CalendarDay';
 import { CalendarMonth } from './CalendarMonth';
@@ -20,6 +20,13 @@ let iconStrings: ICalendarIconStrings = {
   rightNavigation: rightArrow
 };
 
+let dateTimeFormatterCallbacks: ICalendarFormatDateCallbacks = {
+  formatMonthDayYear: (date: Date, strings: ICalendarStrings) => (strings.months[date.getMonth()] + ' ' + date.getDate() + ', ' + date.getFullYear()),
+  formatMonthYear: (date: Date, strings: ICalendarStrings) => (strings.months[date.getMonth()] + ' ' + date.getFullYear()),
+  formatDay: (date: Date) => date.getDate().toString(),
+  formatYear: (date: Date) => date.getFullYear().toString()
+};
+
 export interface ICalendarState {
   /** The currently focused date in the calendar, but not necessarily selected */
   navigatedDate?: Date;
@@ -49,7 +56,8 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     showGoToToday: true,
     strings: null,
     highlightCurrentMonth: false,
-    navigationIcons: iconStrings
+    navigationIcons: iconStrings,
+    dateTimeFormatter: dateTimeFormatterCallbacks
   };
 
   public refs: {
@@ -140,6 +148,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   strings={ strings! }
                   onHeaderSelect={ onHeaderSelect }
                   navigationIcons={ navigationIcons! }
+                  dateTimeFormatter={ this.props.dateTimeFormatter! }
                   ref='dayPicker' />
                 }
 
@@ -151,6 +160,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   highlightCurrentMonth={ highlightCurrentMonth! }
                   onHeaderSelect={ onHeaderSelect }
                   navigationIcons={ navigationIcons! }
+                  dateTimeFormatter={ this.props.dateTimeFormatter! }
                   ref='monthPicker' /> }
 
                 { showGoToToday &&
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index c63d376199e08..ec87346e42b2d 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -8,7 +8,7 @@ import {
   getRTL,
   getRTLSafeKeyCode
 } from '../../Utilities';
-import { ICalendarStrings, ICalendarIconStrings } from './Calendar.Props';
+import { ICalendarStrings, ICalendarIconStrings, ICalendarFormatDateCallbacks } from './Calendar.Props';
 import { DayOfWeek, DateRangeType } from '../../utilities/dateValues/DateValues';
 import { FocusZone } from '../../FocusZone';
 import { Icon } from '../../Icon';
@@ -51,6 +51,7 @@ export interface ICalendarDayProps extends React.Props<CalendarDay> {
   navigationIcons: ICalendarIconStrings;
   today?: Date;
   onHeaderSelect?: (focus: boolean) => void;
+  dateTimeFormatter: ICalendarFormatDateCallbacks;
 }
 
 export interface ICalendarDayState {
@@ -86,7 +87,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
 
   public render() {
     let { activeDescendantId, weeks } = this.state;
-    let { firstDayOfWeek, strings, navigatedDate, navigationIcons } = this.props;
+    let { firstDayOfWeek, strings, navigatedDate, navigationIcons, dateTimeFormatter } = this.props;
     let dayPickerId = getId('DatePickerDay-dayPicker');
     let monthAndYearId = getId('DatePickerDay-monthAndYear');
     let leftNavigationIcon = navigationIcons.leftNavigation;
@@ -96,8 +97,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
       <div className={ css('ms-DatePicker-dayPicker', styles.dayPicker) } id={ dayPickerId }>
         <div className={ css('ms-DatePicker-header', styles.header) } >
           <div aria-live='polite' aria-relevant='text' aria-atomic='true' id={ monthAndYearId }>
-            <div className={ css('ms-DatePicker-month', styles.month) }>{ strings.months[navigatedDate.getMonth()] }</div>
-            <div className={ css('ms-DatePicker-year', styles.year) }>{ navigatedDate.getFullYear() }</div>
+            <div className={ css('ms-DatePicker-monthAndYear', styles.month) }>{ dateTimeFormatter.formatMonthYear(navigatedDate, strings) }</div>
           </div>
         </div>
         <div className={ css('ms-DatePicker-monthComponents', styles.monthComponents) }>
@@ -129,7 +129,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
                 className={ css('ms-DatePicker-headerToggleView js-showMonthPicker', styles.headerToggleView) }
                 onClick={ this._onHeaderSelect }
                 onKeyDown={ this._onHeaderKeyDown }
-                aria-label={ strings.monthPickerAriaLabel }
+                aria-label={ dateTimeFormatter.formatMonthYear(navigatedDate, strings) }
                 role='button'
                 tabIndex={ 0 }
               />
@@ -178,13 +178,12 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
                         onKeyDown={ (ev: React.KeyboardEvent<HTMLElement>) =>
                           this._navigateMonthEdge(ev, day.originalDate, weekIndex, dayIndex) }
                         aria-selected={ day.isSelected }
-                        aria-label={ day.originalDate.toLocaleString ?
-                          day.originalDate.toLocaleString([], { day: 'numeric', month: 'long', year: 'numeric' }) : day.originalDate.getDate() }
+                        aria-label={ dateTimeFormatter.formatMonthDayYear(day.originalDate, strings) }
                         id={ compareDates(navigatedDate, day.originalDate) ? activeDescendantId : undefined }
                         data-is-focusable={ true }
                         ref={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : undefined }
                         key={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : undefined } >
-                        <span aria-hidden='true'>{ day.date }</span>
+                        <span aria-hidden='true'>{ dateTimeFormatter.formatDay(day.originalDate) }</span>
                       </div>
                     </td>
                   ) }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
index 41671e9746675..9a843eaab7794 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
@@ -6,7 +6,7 @@ import {
   getRTL,
   autobind
 } from '../../Utilities';
-import { ICalendarStrings, ICalendarIconStrings } from './Calendar.Props';
+import { ICalendarStrings, ICalendarIconStrings, ICalendarFormatDateCallbacks } from './Calendar.Props';
 import { FocusZone } from '../../FocusZone';
 import { addYears, setMonth } from '../../utilities/dateMath/DateMath';
 import { Icon } from '../../Icon';
@@ -22,6 +22,7 @@ export interface ICalendarMonthProps extends React.Props<CalendarMonth> {
   highlightCurrentMonth: boolean;
   onHeaderSelect?: (focus: boolean) => void;
   navigationIcons: ICalendarIconStrings;
+  dateTimeFormatter: ICalendarFormatDateCallbacks;
 }
 
 export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
@@ -48,14 +49,14 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
 
   public render() {
 
-    let { navigatedDate, strings, today, highlightCurrentMonth, navigationIcons } = this.props;
+    let { navigatedDate, strings, today, highlightCurrentMonth, navigationIcons, dateTimeFormatter } = this.props;
     let leftNavigationIcon = navigationIcons.leftNavigation;
     let rightNavigationIcon = navigationIcons.rightNavigation;
 
     return (
       <div className={ css('ms-DatePicker-monthPicker', styles.monthPicker) }>
         <div className={ css('ms-DatePicker-header', styles.header) }>
-          <div className={ css('ms-DatePicker-currentYear js-showYearPicker', styles.currentYear) }>{ navigatedDate.getFullYear() }</div>
+          <div className={ css('ms-DatePicker-currentYear js-showYearPicker', styles.currentYear) }>{ dateTimeFormatter.formatYear(navigatedDate) }</div>
           <div className={ css('ms-DatePicker-yearComponents', styles.yearComponents) }>
             <div className={ css('ms-DatePicker-navContainer', styles.navContainer) }>
               <span
@@ -84,7 +85,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
                 className={ css('ms-DatePicker-headerToggleView js-showYearPicker', styles.headerToggleView) }
                 onClick={ this._onHeaderSelect }
                 onKeyDown={ this._onHeaderKeyDown }
-                aria-label={ strings.dayPickerAriaLabel }
+                aria-label={ dateTimeFormatter.formatYear(navigatedDate) }
                 role='button'
                 tabIndex={ 0 }
               />
@@ -106,7 +107,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
                 }
                 key={ index }
                 onClick={ this._selectMonthCallbacks[index] }
-                aria-label={ setMonth(navigatedDate, index).toLocaleString([], { month: 'long', year: 'numeric' }) }
+                aria-label={ dateTimeFormatter.formatMonthYear(navigatedDate, strings) }
                 data-is-focusable={ true }
                 ref={ navigatedDate.getMonth() === index ? 'navigatedMonth' : undefined }
               >

From 698632d5cc6e2564f3b745e3c1919ff020fb6004 Mon Sep 17 00:00:00 2001
From: Marena Richardson <marena.richardson@gmail.com>
Date: Thu, 31 Aug 2017 18:07:36 -0700
Subject: [PATCH 0548/1641] Add warning foreground color semantic slot (#2693)

* warning foreground semantic slot

* change file

* Address pr comments
---
 ...ing-foreground-semantic-slot_2017-08-31-18-28.json | 11 +++++++++++
 packages/styling/src/interfaces/ISemanticColors.ts    |  4 ++++
 packages/styling/src/styles/theme.ts                  |  1 +
 3 files changed, 16 insertions(+)
 create mode 100644 common/changes/@uifabric/styling/add-warning-foreground-semantic-slot_2017-08-31-18-28.json

diff --git a/common/changes/@uifabric/styling/add-warning-foreground-semantic-slot_2017-08-31-18-28.json b/common/changes/@uifabric/styling/add-warning-foreground-semantic-slot_2017-08-31-18-28.json
new file mode 100644
index 0000000000000..36b06c5e5b3ee
--- /dev/null
+++ b/common/changes/@uifabric/styling/add-warning-foreground-semantic-slot_2017-08-31-18-28.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Add a new semantic slot for the warning foreground color",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "maricha@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/styling/src/interfaces/ISemanticColors.ts b/packages/styling/src/interfaces/ISemanticColors.ts
index af1ee0c014960..5df167f306ad0 100644
--- a/packages/styling/src/interfaces/ISemanticColors.ts
+++ b/packages/styling/src/interfaces/ISemanticColors.ts
@@ -105,6 +105,10 @@ export interface ISemanticColors {
    * Background for warning messages.
    */
   warningBackground: string;
+  /**
+   * Foreground color for warning highlights
+   */
+  warningHighlight: string;
 
   //// Input controls slots (text fields, checkboxes, radios...)
 
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index 4813f0e773d39..ce8a5f2c75262 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -96,6 +96,7 @@ function _makeSemanticColorsFromPalette(p: IPalette, isInverted: boolean): ISema
     errorText: !isInverted ? p.redDark : '#ff5f5f',
     blockingBackground: !isInverted ? 'rgba(234, 67, 0, .2)' : 'rgba(234, 67, 0, .5)',
     warningBackground: !isInverted ? 'rgba(255, 185, 0, .2)' : 'rgba(255, 251, 0, .6)',
+    warningHighlight: !isInverted ? '#ffb900' : '#fff100',
 
     inputBorder: p.neutralTertiary,
     inputBorderHovered: p.neutralPrimary,

From 4abdaf1edf760d227dabfa4c99c9c476d7fcbda7 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 1 Sep 2017 09:33:41 -0700
Subject: [PATCH 0549/1641] Making jest always run serially, adding support to
 skip tasks. (#2709)

* Updating build task to support disabling unused tasks.

* Updating jest to run serially for production builds.

* Updates to jest script.

* disabling some tasks.
---
 packages/merge-styles/package.json |  5 +++++
 scripts/build.js                   | 19 +++++++++++++++----
 scripts/tasks/jest.js              | 20 +++++++++++++++++---
 3 files changed, 37 insertions(+), 7 deletions(-)

diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index 7fd64d978ad65..7af6c81645ca4 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -14,6 +14,11 @@
     "clean": "node ../../scripts/clean.js",
     "start-test": "node ../../scripts/start-test.js"
   },
+  "disabledTasks": [
+    "sass",
+    "copy",
+    "karma"
+  ],
   "devDependencies": {
     "@types/jest": "^20.0.8",
     "@types/es6-promise": "^0.0.32",
diff --git a/scripts/build.js b/scripts/build.js
index 48f11c5a0db2d..cee14bdd94a31 100644
--- a/scripts/build.js
+++ b/scripts/build.js
@@ -2,7 +2,13 @@ const chalk = require('chalk');
 const fs = require('fs');
 const path = require('path');
 const { logStartTask, logEndTask, logEndBuild } = require('./logging');
-const packageName = getPackageName();
+const package = getPackage();
+
+if (!package) {
+  return;
+}
+
+const packageName = package.name;
 const isProduction = process.argv.indexOf('--production') > -1;
 
 let tasks = [
@@ -15,6 +21,11 @@ let tasks = [
   'webpack'
 ];
 
+// Filter disabled tasks if specified in the package.json.
+if (package.disabledTasks) {
+  tasks = tasks.filter(task => package.disabledTasks.indexOf(task) < 0);
+}
+
 if (process.argv.length >= 3 && process.argv[2].indexOf('--') === -1) {
   tasks = [process.argv[2]];
 }
@@ -48,12 +59,12 @@ function runTask(task) {
       }));
 }
 
-function getPackageName() {
+function getPackage() {
   let packagePath = path.resolve(process.cwd(), 'package.json');
 
   if (fs.existsSync(packagePath)) {
-    return JSON.parse(fs.readFileSync(packagePath, 'utf8')).name;
+    return JSON.parse(fs.readFileSync(packagePath, 'utf8'));
   }
 
-  return '';
+  return undefined;
 }
\ No newline at end of file
diff --git a/scripts/tasks/jest.js b/scripts/tasks/jest.js
index f81dd422518cf..063afc7cd9814 100644
--- a/scripts/tasks/jest.js
+++ b/scripts/tasks/jest.js
@@ -4,12 +4,26 @@ module.exports = function (options) {
   const execSync = require('../exec-sync');
   const findConfig = require('../find-config');
 
-  const jestPath = path.resolve(__dirname, '../node_modules/jest/bin/jest');
   const jestConfigPath = findConfig('jest.config.js');
-  const coverage = (options.isProduction) ? ' --coverage' : '';
 
   if (fs.existsSync(jestConfigPath)) {
-    const command = `node ${jestPath} --config ${jestConfigPath} ${coverage} ${options.args || ''}`;
+    const jestPath = path.resolve(__dirname, '../node_modules/jest/bin/jest');
+
+    const args = [
+      // Specify the config file.
+      `--config ${jestConfigPath}`,
+
+      // Run tests in serial (parallel builds seem to hang rush.)
+      `--runInBand`,
+
+      // In production builds, produce coverage information.
+      options.isProduction && '--coverage',
+
+      // Pass in custom arguments.
+      options.args
+    ].filter(arg => !!arg).join(' ');
+
+    const command = `node ${jestPath} ${args}`;
 
     execSync(command, undefined, path.dirname(jestConfigPath));
   }

From 4c5aa46769a93acfaa017f3a09d15b8e2f04c322 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 1 Sep 2017 09:51:58 -0700
Subject: [PATCH 0550/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 22 ++++++++++
 apps/fabric-website/CHANGELOG.md              |  9 +++-
 apps/fabric-website/package.json              |  6 +--
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...ple-app-base-persist_2017-08-31-16-13.json | 11 -----
 ...ize-group-to-website_2017-08-31-20-40.json | 11 -----
 ...ground-semantic-slot_2017-08-31-18-28.json | 11 -----
 .../styling/master_2017-08-31-16-34.json      | 11 -----
 ...ize-group-to-website_2017-08-31-20-40.json | 11 -----
 ...basebutton_menu_icon_2017-08-31-22-13.json | 11 -----
 ...DateCultureFormating_2017-08-28-17-55.json | 11 -----
 .../master_2017-08-31-16-34.json              | 11 -----
 ...cker-correctlyupdate_2017-08-29-22-12.json | 11 -----
 packages/example-app-base/CHANGELOG.json      | 14 ++++++
 packages/example-app-base/CHANGELOG.md        |  9 +++-
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/package.json             |  6 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 44 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 16 ++++++-
 packages/office-ui-fabric-react/package.json  |  6 +--
 packages/styling/CHANGELOG.json               | 21 +++++++++
 packages/styling/CHANGELOG.md                 | 13 +++++-
 packages/styling/package.json                 |  2 +-
 25 files changed, 158 insertions(+), 117 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/example-app-base-persist_2017-08-31-16-13.json
 delete mode 100644 common/changes/@uifabric/fabric-website/add-resize-group-to-website_2017-08-31-20-40.json
 delete mode 100644 common/changes/@uifabric/styling/add-warning-foreground-semantic-slot_2017-08-31-18-28.json
 delete mode 100644 common/changes/@uifabric/styling/master_2017-08-31-16-34.json
 delete mode 100644 common/changes/office-ui-fabric-react/add-resize-group-to-website_2017-08-31-20-40.json
 delete mode 100644 common/changes/office-ui-fabric-react/chrisgo-basebutton_menu_icon_2017-08-31-22-13.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-CalendarDateCultureFormating_2017-08-28-17-55.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2017-08-31-16-34.json
 delete mode 100644 common/changes/office-ui-fabric-react/swatchcolorpicker-correctlyupdate_2017-08-29-22-12.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 04fecd062e023..dc7993357fd56 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "4.7.6",
+      "tag": "@uifabric/fabric-website_v4.7.6",
+      "date": "Fri, 01 Sep 2017 16:51:57 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "12102f19df80c0eb6116e599bdfdce055389372a",
+            "comment": "Publish resize group on fabric-website"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=4.2.5 <5.0.0` to `>=4.2.6 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.38.0 <5.0.0` to `>=4.39.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.7.5",
       "tag": "@uifabric/fabric-website_v4.7.5",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index f83d21433dfd7..8fd3ced599ae7 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Thu, 31 Aug 2017 15:41:56 GMT and should not be manually modified.
+This log was last generated on Fri, 01 Sep 2017 16:51:57 GMT and should not be manually modified.
+
+## 4.7.6
+Fri, 01 Sep 2017 16:51:57 GMT
+
+### Patches
+
+- Publish resize group on fabric-website
 
 ## 4.7.5
 Thu, 31 Aug 2017 15:41:56 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index a91c12324f665..50043f7f954a4 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.7.5",
+  "version": "4.7.6",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -41,10 +41,10 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/example-app-base": ">=4.2.5 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.6 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=4.38.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.39.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 761c1b12b59f3..14d54e72e8bda 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.37.7 <5.0.0",
+    "office-ui-fabric-react": ">=4.39.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 0a8058190655b..333a565bdfadd 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -26,7 +26,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.37.7 <5.0.0",
+    "office-ui-fabric-react": ">=4.39.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index fdf8165dbb8db..300fdeba9555a 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -24,7 +24,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=4.37.7 <5.0.0",
+    "office-ui-fabric-react": ">=4.39.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/example-app-base/example-app-base-persist_2017-08-31-16-13.json b/common/changes/@uifabric/example-app-base/example-app-base-persist_2017-08-31-16-13.json
deleted file mode 100644
index 48603bbbf546c..0000000000000
--- a/common/changes/@uifabric/example-app-base/example-app-base-persist_2017-08-31-16-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Persist RTL setting between page refreshes",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/add-resize-group-to-website_2017-08-31-20-40.json b/common/changes/@uifabric/fabric-website/add-resize-group-to-website_2017-08-31-20-40.json
deleted file mode 100644
index ca05fc0e82b1b..0000000000000
--- a/common/changes/@uifabric/fabric-website/add-resize-group-to-website_2017-08-31-20-40.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Publish resize group on fabric-website",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/add-warning-foreground-semantic-slot_2017-08-31-18-28.json b/common/changes/@uifabric/styling/add-warning-foreground-semantic-slot_2017-08-31-18-28.json
deleted file mode 100644
index 36b06c5e5b3ee..0000000000000
--- a/common/changes/@uifabric/styling/add-warning-foreground-semantic-slot_2017-08-31-18-28.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Add a new semantic slot for the warning foreground color",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "maricha@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/master_2017-08-31-16-34.json b/common/changes/@uifabric/styling/master_2017-08-31-16-34.json
deleted file mode 100644
index 72096e96cb1cd..0000000000000
--- a/common/changes/@uifabric/styling/master_2017-08-31-16-34.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "Add FullWidth icon.",
-      "packageName": "@uifabric/styling",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "lijunle@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/add-resize-group-to-website_2017-08-31-20-40.json b/common/changes/office-ui-fabric-react/add-resize-group-to-website_2017-08-31-20-40.json
deleted file mode 100644
index 5a348849528ac..0000000000000
--- a/common/changes/office-ui-fabric-react/add-resize-group-to-website_2017-08-31-20-40.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Respect ths isHeader property on the ResizeGroup demo page",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/chrisgo-basebutton_menu_icon_2017-08-31-22-13.json b/common/changes/office-ui-fabric-react/chrisgo-basebutton_menu_icon_2017-08-31-22-13.json
deleted file mode 100644
index e90586f47ec51..0000000000000
--- a/common/changes/office-ui-fabric-react/chrisgo-basebutton_menu_icon_2017-08-31-22-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "BaseButton: Put the right classname on the menu icon",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kegorr-CalendarDateCultureFormating_2017-08-28-17-55.json b/common/changes/office-ui-fabric-react/kegorr-CalendarDateCultureFormating_2017-08-28-17-55.json
deleted file mode 100644
index af04c9b070803..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-CalendarDateCultureFormating_2017-08-28-17-55.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Calendar: Adding option to add date formatting to calendar",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2017-08-31-16-34.json b/common/changes/office-ui-fabric-react/master_2017-08-31-16-34.json
deleted file mode 100644
index 6e48201842acf..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2017-08-31-16-34.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add FullWidth icon.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lijunle@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/swatchcolorpicker-correctlyupdate_2017-08-29-22-12.json b/common/changes/office-ui-fabric-react/swatchcolorpicker-correctlyupdate_2017-08-29-22-12.json
deleted file mode 100644
index 0b56f5642a3d4..0000000000000
--- a/common/changes/office-ui-fabric-react/swatchcolorpicker-correctlyupdate_2017-08-29-22-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SwatchColorPicker: Fixed so it will deselect the current items if there is a selected id passed in that does not exist in the color list",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index baff10ce5fe49..269889938bb57 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "4.2.6",
+      "tag": "@uifabric/example-app-base_v4.2.6",
+      "date": "Fri, 01 Sep 2017 16:51:57 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "fd435b3657df001d9a90b1ad0fc2e312a6643fa0",
+            "comment": "Persist RTL setting between page refreshes"
+          }
+        ]
+      }
+    },
     {
       "version": "4.2.5",
       "tag": "@uifabric/example-app-base_v4.2.5",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index bf498b20d7b57..e04965b35b1cb 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Thu, 31 Aug 2017 15:41:56 GMT and should not be manually modified.
+This log was last generated on Fri, 01 Sep 2017 16:51:57 GMT and should not be manually modified.
+
+## 4.2.6
+Fri, 01 Sep 2017 16:51:57 GMT
+
+### Patches
+
+- Persist RTL setting between page refreshes
 
 ## 4.2.5
 Thu, 31 Aug 2017 15:41:56 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index c9c33f7e91c66..b8e1f1348995d 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "4.2.5",
+  "version": "4.2.6",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index b9ac4927bbe6b..3ba445be55771 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -26,7 +26,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=4.2.5 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.6 <5.0.0",
     "enzyme": "^2.7.0",
     "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
@@ -41,9 +41,9 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/styling": ">=0.21.1 <1.0.0",
+    "@uifabric/styling": ">=0.22.0 <1.0.0",
     "@uifabric/utilities": ">=4.12.0 <5.0.0",
-    "office-ui-fabric-react": ">=4.38.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.39.0 <5.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 662f4bfa64921..6cc5ca0108eb5 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,50 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.39.0",
+      "tag": "office-ui-fabric-react_v4.39.0",
+      "date": "Fri, 01 Sep 2017 16:51:57 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "12102f19df80c0eb6116e599bdfdce055389372a",
+            "comment": "Respect ths isHeader property on the ResizeGroup demo page"
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "55878db9b288ea9ad5e86a357158358e3a238e49",
+            "comment": "BaseButton: Put the right classname on the menu icon"
+          },
+          {
+            "author": "Junle Li <lijunle@gmail.com>",
+            "commit": "02d0358d39021ab96b27eb1ad78f595e3891d9a5",
+            "comment": "Add FullWidth icon."
+          },
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "fded8a25de72a6469ac2a3419e7d687e766a4ae3",
+            "comment": "SwatchColorPicker: Fixed so it will deselect the current items if there is a selected id passed in that does not exist in the color list"
+          }
+        ],
+        "minor": [
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "9cd0df8633aca2afde1ba2c2e811434939c13bf1",
+            "comment": "Calendar: Adding option to add date formatting to calendar"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.21.1 <1.0.0` to `>=0.22.0 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=4.2.5 <5.0.0` to `>=4.2.6 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.38.0",
       "tag": "office-ui-fabric-react_v4.38.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index d097b0176336a..a71cfc1b136b4 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,20 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 31 Aug 2017 15:41:56 GMT and should not be manually modified.
+This log was last generated on Fri, 01 Sep 2017 16:51:57 GMT and should not be manually modified.
+
+## 4.39.0
+Fri, 01 Sep 2017 16:51:57 GMT
+
+### Minor changes
+
+- Calendar: Adding option to add date formatting to calendar
+
+### Patches
+
+- Respect ths isHeader property on the ResizeGroup demo page
+- BaseButton: Put the right classname on the menu icon
+- Add FullWidth icon.
+- SwatchColorPicker: Fixed so it will deselect the current items if there is a selected id passed in that does not exist in the color list
 
 ## 4.38.0
 Thu, 31 Aug 2017 15:41:56 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 05f728132d09f..63debd7b7db2d 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.38.0",
+  "version": "4.39.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -26,7 +26,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=4.2.5 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.6 <5.0.0",
     "enzyme": "^2.7.0",
     "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
@@ -44,7 +44,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/utilities": ">=4.12.0 <5.0.0",
-    "@uifabric/styling": ">=0.21.1 <1.0.0",
+    "@uifabric/styling": ">=0.22.0 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index f1234bd556333..ea9ed31b9f31c 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,27 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.22.0",
+      "tag": "@uifabric/styling_v0.22.0",
+      "date": "Fri, 01 Sep 2017 16:51:57 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Marena Richardson <marena.richardson@gmail.com>",
+            "commit": "698632d5cc6e2564f3b745e3c1919ff020fb6004",
+            "comment": "Add a new semantic slot for the warning foreground color"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Junle Li <lijunle@gmail.com>",
+            "commit": "02d0358d39021ab96b27eb1ad78f595e3891d9a5",
+            "comment": "Add FullWidth icon."
+          }
+        ]
+      }
+    },
     {
       "version": "0.21.1",
       "tag": "@uifabric/styling_v0.21.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index b1e325dc4b86c..cfac4c4d15d4c 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Tue, 29 Aug 2017 20:55:35 GMT and should not be manually modified.
+This log was last generated on Fri, 01 Sep 2017 16:51:57 GMT and should not be manually modified.
+
+## 0.22.0
+Fri, 01 Sep 2017 16:51:57 GMT
+
+### Minor changes
+
+- Add a new semantic slot for the warning foreground color
+
+### Patches
+
+- Add FullWidth icon.
 
 ## 0.21.1
 Tue, 29 Aug 2017 20:55:35 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index a7b858e4d0308..9bd4dfcd3ee60 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.21.1",
+  "version": "0.22.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 2ac7d28b38f8540783b021498cb8e5773355e342 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Fri, 1 Sep 2017 10:32:53 -0700
Subject: [PATCH 0551/1641] Add change file for RTL Utilities changes (#2711)

* Update comment on rtl.ts

* Rush change
---
 .../utilities/utilities_change_2017-09-01-17-22.json  | 11 +++++++++++
 packages/utilities/src/rtl.ts                         |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/@uifabric/utilities/utilities_change_2017-09-01-17-22.json

diff --git a/common/changes/@uifabric/utilities/utilities_change_2017-09-01-17-22.json b/common/changes/@uifabric/utilities/utilities_change_2017-09-01-17-22.json
new file mode 100644
index 0000000000000..a216ef5ac0703
--- /dev/null
+++ b/common/changes/@uifabric/utilities/utilities_change_2017-09-01-17-22.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Set the RTL language when the language is read from session storage",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/src/rtl.ts b/packages/utilities/src/rtl.ts
index 3e80c51a9d93f..feffb62defd0a 100644
--- a/packages/utilities/src/rtl.ts
+++ b/packages/utilities/src/rtl.ts
@@ -12,6 +12,7 @@ let _isRTL: boolean | undefined;
  */
 export function getRTL(): boolean {
   if (_isRTL === undefined) {
+    // Fabric supports persisting the RTL setting between page refreshes via session storage
     let savedRTL = getItem(RTL_LOCAL_STORAGE_KEY);
     if (savedRTL !== null) {
       _isRTL = savedRTL === '1';

From 1c46c95973a57d78cf9321570039f5022bca9866 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 1 Sep 2017 18:06:55 +0000
Subject: [PATCH 0552/1641] Applying package updates.

---
 .../utilities_change_2017-09-01-17-22.json         | 11 -----------
 packages/experiments/package.json                  |  2 +-
 packages/office-ui-fabric-react/package.json       |  2 +-
 packages/styling/package.json                      |  2 +-
 packages/utilities/CHANGELOG.json                  | 14 ++++++++++++++
 packages/utilities/CHANGELOG.md                    |  9 ++++++++-
 packages/utilities/package.json                    |  2 +-
 7 files changed, 26 insertions(+), 16 deletions(-)
 delete mode 100644 common/changes/@uifabric/utilities/utilities_change_2017-09-01-17-22.json

diff --git a/common/changes/@uifabric/utilities/utilities_change_2017-09-01-17-22.json b/common/changes/@uifabric/utilities/utilities_change_2017-09-01-17-22.json
deleted file mode 100644
index a216ef5ac0703..0000000000000
--- a/common/changes/@uifabric/utilities/utilities_change_2017-09-01-17-22.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Set the RTL language when the language is read from session storage",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 3ba445be55771..740b19a06bf41 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -42,7 +42,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/styling": ">=0.22.0 <1.0.0",
-    "@uifabric/utilities": ">=4.12.0 <5.0.0",
+    "@uifabric/utilities": ">=4.12.1 <5.0.0",
     "office-ui-fabric-react": ">=4.39.0 <5.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 63debd7b7db2d..7947d0959794e 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=4.12.0 <5.0.0",
+    "@uifabric/utilities": ">=4.12.1 <5.0.0",
     "@uifabric/styling": ">=0.22.0 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 9bd4dfcd3ee60..59cd18ca0edf7 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -28,7 +28,7 @@
     "react-dom": "^15.4.2"
   },
   "dependencies": {
-    "@uifabric/utilities": ">=4.12.0 <5.0.0",
+    "@uifabric/utilities": ">=4.12.1 <5.0.0",
     "tslib": "^1.7.1",
     "rtl-css-js": "^1.1.3",
     "glamor": "^2.20.40"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index b4453cb35945f..8fa257ebcb7b9 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.12.1",
+      "tag": "@uifabric/utilities_v4.12.1",
+      "date": "Fri, 01 Sep 2017 18:06:55 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "2ac7d28b38f8540783b021498cb8e5773355e342",
+            "comment": "Set the RTL language when the language is read from session storage"
+          }
+        ]
+      }
+    },
     {
       "version": "4.12.0",
       "tag": "@uifabric/utilities_v4.12.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index d8da26d9dc921..e25790b90f2de 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Thu, 31 Aug 2017 15:41:56 GMT and should not be manually modified.
+This log was last generated on Fri, 01 Sep 2017 18:06:55 GMT and should not be manually modified.
+
+## 4.12.1
+Fri, 01 Sep 2017 18:06:55 GMT
+
+### Patches
+
+- Set the RTL language when the language is read from session storage
 
 ## 4.12.0
 Thu, 31 Aug 2017 15:41:56 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 245604153830f..4b1304b09f7e6 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.12.0",
+  "version": "4.12.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From b4eee571f31db3c0950938e40aafea9313f73003 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Fri, 1 Sep 2017 11:37:28 -0700
Subject: [PATCH 0553/1641] Icons: Added textDocument back into the icon list
 (#2710)

* Fixed textdocument icon

* Change file
---
 .../styling/textDocument-icon_2017-09-01-17-16.json   | 11 +++++++++++
 packages/styling/src/styles/IconCodes.ts              |  4 ++++
 2 files changed, 15 insertions(+)
 create mode 100644 common/changes/@uifabric/styling/textDocument-icon_2017-09-01-17-16.json

diff --git a/common/changes/@uifabric/styling/textDocument-icon_2017-09-01-17-16.json b/common/changes/@uifabric/styling/textDocument-icon_2017-09-01-17-16.json
new file mode 100644
index 0000000000000..55dc0ca9c452d
--- /dev/null
+++ b/common/changes/@uifabric/styling/textDocument-icon_2017-09-01-17-16.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Icons: Added textDocument back into the icon list",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/styling/src/styles/IconCodes.ts b/packages/styling/src/styles/IconCodes.ts
index 555ad9be94fa3..e29766ff7a423 100644
--- a/packages/styling/src/styles/IconCodes.ts
+++ b/packages/styling/src/styles/IconCodes.ts
@@ -2599,6 +2599,10 @@ export const IconCodes = {
    * Icon code with the value '\uEDC3'.
    */
   textField: '\uEDC3',
+  /**
+   * Icon code with the value '\uF029'.
+   */
+  textDocument: '\uF029',
   /**
    * Icon code with the value '\uE7B6'.
    */

From e3d92561e750fe211769c86ed13a2ee6a8fd4605 Mon Sep 17 00:00:00 2001
From: Eddie Liu <leddie24@gmail.com>
Date: Fri, 1 Sep 2017 13:02:44 -0700
Subject: [PATCH 0554/1641] DetailsList: Adjust position for sort icon in
 DetailsHeader (#2701)

* Adjust position for nearIcon

* Adjust css so it's only for sortIcon instead of nearIcon

* Add change file
---
 ...etailslist-sortIcon-position_2017-09-01-18-24.json | 11 +++++++++++
 .../src/components/DetailsList/DetailsHeader.scss     |  6 ++++++
 .../src/components/DetailsList/DetailsHeader.tsx      |  2 +-
 3 files changed, 18 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-edwliu-detailslist-sortIcon-position_2017-09-01-18-24.json

diff --git a/common/changes/office-ui-fabric-react/v-edwliu-detailslist-sortIcon-position_2017-09-01-18-24.json b/common/changes/office-ui-fabric-react/v-edwliu-detailslist-sortIcon-position_2017-09-01-18-24.json
new file mode 100644
index 0000000000000..d47c99cc4f4da
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-edwliu-detailslist-sortIcon-position_2017-09-01-18-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsHeader: Adjust sortIcon position",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-edwliu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
index c7e5e0ea9c4a1..b7290407d1b9d 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
@@ -135,6 +135,12 @@ $isPaddedMargin: 24px;
   color: $iconForegroundColor;
   opacity: 1;
   @include ms-padding-left(8px);
+
+  &.sortIcon {
+    @include ms-padding-left(4px);
+    position: relative;
+    top: 1px;
+  }
 }
 
 .cell .filterChevron {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index 9cd944351a7ad..353c8627bbbf8 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -279,7 +279,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
                           ) }
 
                           { column.isSorted && (
-                            <Icon className={ styles.nearIcon } iconName={ column.isSortedDescending ? 'SortDown' : 'SortUp' } />
+                            <Icon className={ css(styles.nearIcon, styles.sortIcon) } iconName={ column.isSortedDescending ? 'SortDown' : 'SortUp' } />
                           ) }
 
                           { column.isGrouped && (

From 57ea45fbfaf4f4ee89a4da54a0a4beab7b16051b Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Fri, 1 Sep 2017 16:19:30 -0400
Subject: [PATCH 0555/1641] Add support for pre-computation of Tile and
 FolderCover size (experiments) (#2679)

* Add TileSize props

* Add fitContentToBounds function to math utilities

* Add size pre-computation to Tile

* Add size pre-computation to FolderCover

* Update Tile to use ISelection interface

* Update change output

* Fix FolderCover index reference

* Add const enums for layout values

* Touch up examples for Tiles

* More documentation for fitContentToBounds
---
 .../tile-size_2017-08-30-19-24.json           |  11 +
 .../utilities/tile-size_2017-08-30-19-24.json |  11 +
 packages/experiments/src/FolderCover.ts       |   2 +-
 .../components/FolderCover/FolderCover.tsx    |  49 ++++
 .../examples/FolderCover.Basic.Example.tsx    |  85 +++++--
 .../src/components/Tile/Tile.Props.ts         |  27 ++-
 .../experiments/src/components/Tile/Tile.tsx  |  58 +++++
 .../Tile/examples/Tile.Document.Example.tsx   | 212 ++++++++----------
 .../Tile/examples/Tile.Example.scss           |  16 +-
 .../Tile/examples/Tile.Folder.Example.tsx     | 140 +++++++-----
 .../Tile/examples/Tile.Media.Example.tsx      | 159 +++++++------
 .../TilesList/examples/TilesList.Example.scss |   4 +
 .../examples/TilesList.Media.Example.tsx      |  31 ++-
 packages/utilities/karma.config.js            |   3 +-
 packages/utilities/src/ISize.ts               |   5 +
 packages/utilities/src/index.ts               |   1 +
 packages/utilities/src/math.test.ts           | 149 ++++++++++++
 packages/utilities/src/math.ts                |  86 ++++++-
 18 files changed, 764 insertions(+), 285 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/tile-size_2017-08-30-19-24.json
 create mode 100644 common/changes/@uifabric/utilities/tile-size_2017-08-30-19-24.json
 create mode 100644 packages/experiments/src/components/TilesList/examples/TilesList.Example.scss
 create mode 100644 packages/utilities/src/ISize.ts
 create mode 100644 packages/utilities/src/math.test.ts

diff --git a/common/changes/@uifabric/experiments/tile-size_2017-08-30-19-24.json b/common/changes/@uifabric/experiments/tile-size_2017-08-30-19-24.json
new file mode 100644
index 0000000000000..be54a9859fed7
--- /dev/null
+++ b/common/changes/@uifabric/experiments/tile-size_2017-08-30-19-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Add size pre-computation support to Tile and FolderCover",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/tile-size_2017-08-30-19-24.json b/common/changes/@uifabric/utilities/tile-size_2017-08-30-19-24.json
new file mode 100644
index 0000000000000..54ede634e3f45
--- /dev/null
+++ b/common/changes/@uifabric/utilities/tile-size_2017-08-30-19-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Add ISize interface and fitContentToBounds utility function",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/FolderCover.ts b/packages/experiments/src/FolderCover.ts
index 4424108cdefde..7570e92e9340b 100644
--- a/packages/experiments/src/FolderCover.ts
+++ b/packages/experiments/src/FolderCover.ts
@@ -1,2 +1,2 @@
 
-export * from './components/FolderCover';
+export * from './components/FolderCover/index';
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.tsx b/packages/experiments/src/components/FolderCover/FolderCover.tsx
index bb86f116121b4..c7c3fdbaca176 100644
--- a/packages/experiments/src/components/FolderCover/FolderCover.tsx
+++ b/packages/experiments/src/components/FolderCover/FolderCover.tsx
@@ -2,6 +2,7 @@
 import * as React from 'react';
 import { IFolderCoverProps, FolderCoverSize, FolderCoverType } from './FolderCover.Props';
 import { css } from 'office-ui-fabric-react/lib/Utilities';
+import { ISize } from '@uifabric/utilities';
 import * as FolderCoverStylesModule from './FolderCover.scss';
 
 // tslint:disable-next-line:no-any
@@ -11,8 +12,29 @@ export interface IFolderCoverState {
   // TODO Add animation support for drag/drop events.
 }
 
+const enum FolderCoverLayoutValues {
+  smallWidth = 72,
+  smallHeight = 52,
+  largeWidth = 112,
+  largeHeight = 80,
+  contentPadding = 4
+}
+
 const ASSET_CDN_BASE_URL = 'https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets';
 
+const SIZES: {
+  [P in FolderCoverSize]: ISize;
+} = {
+    small: {
+      width: FolderCoverLayoutValues.smallWidth - FolderCoverLayoutValues.contentPadding * 2,
+      height: FolderCoverLayoutValues.smallHeight - FolderCoverLayoutValues.contentPadding * 2
+    },
+    large: {
+      width: FolderCoverLayoutValues.largeWidth - FolderCoverLayoutValues.contentPadding * 2,
+      height: FolderCoverLayoutValues.largeHeight - FolderCoverLayoutValues.contentPadding * 2
+    }
+  };
+
 const ASSETS: {
   [P in FolderCoverSize]: {
     [T in FolderCoverType]: {
@@ -85,3 +107,30 @@ export class FolderCover extends React.Component<IFolderCoverProps, IFolderCover
     );
   }
 }
+
+export interface IFolderCoverLayout {
+  contentSize: ISize;
+}
+
+export function getFolderCoverLayout(element: JSX.Element): IFolderCoverLayout {
+  const folderCoverProps: IFolderCoverProps = element.props;
+
+  const {
+    folderCoverSize = 'large'
+  } = folderCoverProps;
+
+  return {
+    contentSize: SIZES[folderCoverSize]
+  };
+}
+
+export function renderFolderCoverWithLayout(element: JSX.Element, props: Partial<IFolderCoverProps>): JSX.Element {
+  const Tag = element.type;
+
+  return (
+    <Tag
+      { ...element.props }
+      { ...props }
+    />
+  );
+}
diff --git a/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx b/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx
index d33ec98e044ed..c1f4e895386ec 100644
--- a/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx
+++ b/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx
@@ -1,41 +1,92 @@
 
 import * as React from 'react';
-import { FolderCover } from '../FolderCover';
+import { FolderCover, getFolderCoverLayout, renderFolderCoverWithLayout } from '../FolderCover';
+import { IFolderCoverProps } from '../FolderCover.Props';
+import { ISize, fitContentToBounds } from '@uifabric/utilities';
+
+interface IFolderCoverWithImageProps extends IFolderCoverProps {
+  originalImageSize: ISize;
+}
+
+const FolderCoverWithImage: React.StatelessComponent<IFolderCoverWithImageProps> = (props: IFolderCoverWithImageProps): JSX.Element => {
+  const {
+    originalImageSize,
+    ...folderCoverProps
+  } = props;
+
+  const folderCover = (
+    <FolderCover
+      { ...folderCoverProps }
+    />
+  );
+
+  const {
+    contentSize
+  } = getFolderCoverLayout(folderCover);
+
+  const imageSize = fitContentToBounds({
+    contentSize: originalImageSize,
+    boundsSize: contentSize,
+    mode: 'cover'
+  });
+
+  return renderFolderCoverWithLayout(folderCover, {
+    children: (
+      <img src={ `//placehold.it/${Math.round(imageSize.width)}x${Math.round(imageSize.height)}` } />
+    )
+  });
+};
 
 export class FolderCoverBasicExample extends React.Component<{}, {}> {
   public render(): JSX.Element {
     return (
       <div>
         <h3>Large Default Cover</h3>
-        <FolderCover
+        <FolderCoverWithImage
+          originalImageSize={
+            {
+              width: 200,
+              height: 150
+            }
+          }
           folderCoverSize='large'
           metadata={ 20 }
-        >
-          <img src='//placehold.it/104x72' />
-        </FolderCover>
+        />
         <h3>Small Default Cover</h3>
-        <FolderCover
+        <FolderCoverWithImage
+          originalImageSize={
+            {
+              width: 200,
+              height: 150
+            }
+          }
           folderCoverSize='small'
           metadata={ 15 }
-        >
-          <img src='//placehold.it/64x44' />
-        </FolderCover>
+        />
         <h3>Large Media Cover</h3>
-        <FolderCover
+        <FolderCoverWithImage
+          originalImageSize={
+            {
+              width: 200,
+              height: 150
+            }
+          }
           folderCoverSize='large'
           folderCoverType='media'
           metadata={ 20 }
-        >
-          <img src='//placehold.it/104x72' />
-        </FolderCover>
+        />
         <h3>Small Media Cover</h3>
-        <FolderCover
+        <FolderCoverWithImage
+          originalImageSize={
+            {
+              width: 200,
+              height: 150
+            }
+          }
           folderCoverSize='small'
           folderCoverType='media'
           metadata={ 15 }
-        >
-          <img src='//placehold.it/64x44' />
-        </FolderCover>
+        />
       </div>
     );
   }
diff --git a/packages/experiments/src/components/Tile/Tile.Props.ts b/packages/experiments/src/components/Tile/Tile.Props.ts
index d99f71913d82d..9fd37772f2a38 100644
--- a/packages/experiments/src/components/Tile/Tile.Props.ts
+++ b/packages/experiments/src/components/Tile/Tile.Props.ts
@@ -1,9 +1,28 @@
 
 import * as React from 'react';
-import { IBaseProps } from 'office-ui-fabric-react/lib/Utilities';
-import { Selection } from 'office-ui-fabric-react/lib/Selection';
+import { IBaseProps, ISize } from 'office-ui-fabric-react/lib/Utilities';
+import { ISelection } from 'office-ui-fabric-react/lib/Selection';
+
+export type TileSize = keyof {
+  small: 'small',
+  large: 'large'
+};
 
 export interface ITileProps extends IBaseProps, React.AllHTMLAttributes<HTMLSpanElement | HTMLAnchorElement> {
+  /**
+   * The intended dimensions for the Tile.
+   *
+   * @type {ISize}
+   * @memberof ITileProps
+   */
+  contentSize?: ISize;
+  /**
+   * The breakpoint size for the Tile.
+   *
+   * @type {TileSize}
+   * @memberof ITileProps
+   */
+  tileSize?: TileSize;
   /**
    * Index of the item in the selection controller.
    *
@@ -14,10 +33,10 @@ export interface ITileProps extends IBaseProps, React.AllHTMLAttributes<HTMLSpan
   /**
    * Selection controller for the item rendered in the tile.
    *
-   * @type {Selection}
+   * @type {ISelection}
    * @memberof ITileProps
    */
-  selection?: Selection;
+  selection?: ISelection;
   /**
    * Name to use on the nameplate for the tile.
    *
diff --git a/packages/experiments/src/components/Tile/Tile.tsx b/packages/experiments/src/components/Tile/Tile.tsx
index 8be050d0b6a91..1673e800a1ec3 100644
--- a/packages/experiments/src/components/Tile/Tile.tsx
+++ b/packages/experiments/src/components/Tile/Tile.tsx
@@ -4,6 +4,7 @@ import { ITileProps } from './Tile.Props';
 import { Check } from 'office-ui-fabric-react/lib/Check';
 import { SELECTION_CHANGE } from 'office-ui-fabric-react/lib/Selection';
 import { css, BaseComponent, autobind, getId } from 'office-ui-fabric-react/lib/Utilities';
+import { ISize } from '@uifabric/utilities';
 import * as TileStylesModule from './Tile.scss';
 import * as SignalStylesModule from '../signals/Signals.scss';
 
@@ -12,6 +13,13 @@ const TileStyles: any = TileStylesModule;
 const SignalStyles: any = SignalStylesModule;
 // tslint:enable:no-any
 
+const enum TileLayoutValues {
+  nameplatePadding = 12,
+  nameplateNameHeight = 20,
+  nameplateActivityHeight = 20,
+  foregroundMargin = 16
+}
+
 export interface ITileState {
   isSelected?: boolean;
 }
@@ -274,3 +282,53 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
     });
   }
 }
+
+export interface ITileLayout {
+  foregroundSize?: ISize | undefined;
+  backgroundSize?: ISize | undefined;
+}
+
+export function getTileLayout(tileElement: JSX.Element): ITileLayout {
+  const tileProps: ITileProps = tileElement.props;
+
+  const {
+    contentSize
+  } = tileProps;
+
+  if (!contentSize) {
+    return {};
+  }
+
+  const width = contentSize.width;
+
+  let nameplateHeight = 0;
+
+  if (tileProps.itemName || tileProps.itemActivity) {
+    nameplateHeight += TileLayoutValues.nameplatePadding * 2; // 12px top/bottom padding.
+    if (tileProps.itemName) {
+      nameplateHeight += TileLayoutValues.nameplateNameHeight;
+    }
+    if (tileProps.itemActivity) {
+      nameplateHeight += TileLayoutValues.nameplateActivityHeight;
+    }
+  }
+
+  return {
+    foregroundSize: {
+      width: width - TileLayoutValues.foregroundMargin * 2,
+      height: contentSize.height - TileLayoutValues.foregroundMargin - nameplateHeight
+    },
+    backgroundSize: contentSize
+  };
+}
+
+export function renderTileWithLayout(tileElement: JSX.Element, props: Partial<ITileProps>): JSX.Element {
+  const Tag = tileElement.type;
+
+  return (
+    <Tag
+      { ...tileElement.props }
+      { ...props }
+    />
+  );
+}
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
index d801d8bcd223d..75480194dc6d3 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
@@ -1,6 +1,6 @@
 
 import * as React from 'react';
-import { Tile } from '../Tile';
+import { Tile, getTileLayout, renderTileWithLayout } from '../Tile';
 import { css } from 'office-ui-fabric-react/lib/Utilities';
 import {
   SignalField,
@@ -10,140 +10,106 @@ import {
   SharedSignal
 } from '../../signals/Signals';
 import { lorem } from '@uifabric/example-app-base';
+import { ISize, fitContentToBounds } from '@uifabric/utilities';
 import * as TileExampleStylesModule from './Tile.Example.scss';
 
 // tslint:disable-next-line:no-any
 const TileExampleStyles = TileExampleStylesModule as any;
 
-export class TileDocumentExample extends React.Component<{}, {}> {
-  public render(): JSX.Element {
-    return (
-      <div>
-        <h3>Tiny document thumbnail</h3>
-        <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
-          <Tile
-            itemName={
-              <SignalField
-                before={
-                  <TrendingSignal />
-                }
-              >
-                { lorem(2) }
-              </SignalField>
-            }
-            itemActivity={
-              <SignalField
-                before={
-                  <CommentsSignal>{ '12' }</CommentsSignal>
-                }
-              >
-                { lorem(2) }
-              </SignalField>
-            }
-            foreground={
-              <img
-                src={ `//placehold.it/40x40` }
-                style={
-                  {
-                    display: 'block'
-                  }
-                }
-              />
-            }
-            showForegroundFrame={ true }
-          />
-        </div>
-        <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
-          <Tile
-            itemName={
-              <SignalField
-                before={
-                  <TrendingSignal />
-                }
-              >
-                { lorem(2) }
-              </SignalField>
-            }
-            itemActivity={
-              <SignalField
-                before={
-                  <CommentsSignal>{ '12' }</CommentsSignal>
-                }
-              >
-                { lorem(2) }
-              </SignalField>
-            }
-            foreground={
-              <img
-                src={ `//placehold.it/80x120` }
-                style={
-                  {
-                    display: 'block'
-                  }
-                }
-              />
-            }
-            showForegroundFrame={ true }
-          />
-        </div>
-        <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
-          <Tile
-            itemName={
-              <SignalField
-                before={
-                  <TrendingSignal />
-                }
-              >
-                { lorem(2) }
-              </SignalField>
+interface IDocumentTileWithThumbnailProps {
+  originalImageSize: ISize;
+}
+
+const DocumentTileWithThumbnail: React.StatelessComponent<IDocumentTileWithThumbnailProps> =
+  (props: IDocumentTileWithThumbnailProps): JSX.Element => {
+    const tile = (
+      <Tile
+        contentSize={
+          {
+            width: 200,
+            height: 200
+          }
+        }
+        itemName={
+          <SignalField
+            before={
+              <TrendingSignal />
             }
-            itemActivity={
-              <SignalField
-                before={
-                  <CommentsSignal>{ '12' }</CommentsSignal>
-                }
-              >
-                { lorem(2) }
-              </SignalField>
+          >
+            { lorem(2) }
+          </SignalField>
+        }
+        itemActivity={
+          <SignalField
+            before={
+              <CommentsSignal>{ '12' }</CommentsSignal>
             }
-            foreground={
+          >
+            { lorem(2) }
+          </SignalField>
+        }
+        foreground={
+          <span />
+        }
+        showForegroundFrame={ true }
+      />
+    );
+
+    const {
+      foregroundSize = { width: 0, height: 0 }
+    } = getTileLayout(tile);
+
+    const imageSize = fitContentToBounds({
+      contentSize: props.originalImageSize,
+      boundsSize: foregroundSize,
+      mode: 'contain'
+    });
+
+    return (
+      <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
+        {
+          renderTileWithLayout(tile, {
+            foreground: (
               <img
-                src={ `//placehold.it/168x96` }
-                style={
-                  {
-                    display: 'block'
-                  }
-                }
+                src={ `//placehold.it/${Math.round(imageSize.width)}x${Math.round(imageSize.height)}` }
+                className={ css(TileExampleStyles.tileImage) }
               />
+            )
+          })
+        }
+      </div>
+    );
+  };
+
+export class TileDocumentExample extends React.Component<{}, {}> {
+  public render(): JSX.Element {
+    return (
+      <div>
+        <h3>Document thumbnail</h3>
+        <DocumentTileWithThumbnail
+          originalImageSize={
+            {
+              width: 40,
+              height: 40
             }
-            showForegroundFrame={ true }
-          />
-        </div>
-        <h3>Maximum-sized document thumbnail</h3>
-        <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
-          <Tile
-            itemName={
-              <SignalField
-                before={
-                  <NewSignal />
-                }
-              >
-                { lorem(10) }
-              </SignalField>
+          }
+        />
+        <DocumentTileWithThumbnail
+          originalImageSize={
+            {
+              width: 200,
+              height: 150
             }
-            foreground={
-              <img
-                src={ `//placehold.it/168x120` }
-                style={
-                  {
-                    display: 'block'
-                  }
-                }
-              />
+          }
+        />
+        <DocumentTileWithThumbnail
+          originalImageSize={
+            {
+              width: 150,
+              height: 200
             }
-            showForegroundFrame={ true }
-          />
-        </div>
+          }
+        />
         <h3>Document icon</h3>
         <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
           <Tile
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Example.scss b/packages/experiments/src/components/Tile/examples/Tile.Example.scss
index 2a9180ffb2347..74528fdf42824 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Example.scss
+++ b/packages/experiments/src/components/Tile/examples/Tile.Example.scss
@@ -5,19 +5,11 @@
   margin: 4px;
 }
 
-.landscapeTile {
-  width: 250px;
-  height: 200px;
-}
-
-.portraitTile {
-  width: 175px;
-  height: 200px;
-}
-
 .squareTile {
-  display: inline-block;
-  position: relative;
   width: 200px;
   height: 200px;
 }
+
+.tileImage {
+  display: block;
+}
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
index 7acb612bf8a04..1a9b98ad322b8 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
@@ -5,75 +5,107 @@ import { css } from 'office-ui-fabric-react/lib/Utilities';
 import {
   SignalField,
   NewSignal,
-  CommentsSignal,
-  TrendingSignal
+  CommentsSignal
 } from '../../signals/Signals';
-import { FolderCover } from '../../FolderCover/FolderCover';
+import { FolderCover, getFolderCoverLayout, renderFolderCoverWithLayout } from '../../FolderCover/FolderCover';
+import { FolderCoverType } from '../../FolderCover/FolderCover.Props';
 import { lorem } from '@uifabric/example-app-base';
+import { ISize, fitContentToBounds } from '@uifabric/utilities';
 import * as TileExampleStylesModule from './Tile.Example.scss';
 
 // tslint:disable-next-line:no-any
 const TileExampleStyles = TileExampleStylesModule as any;
 
+interface IFolderTileWithThumbnailProps {
+  folderCoverType?: FolderCoverType;
+  originalImageSize: ISize;
+}
+
+const FolderTileWithThumbnail: React.StatelessComponent<IFolderTileWithThumbnailProps> =
+  (props: IFolderTileWithThumbnailProps): JSX.Element => {
+    const folderCover = (
+      <FolderCover
+        folderCoverType={ props.folderCoverType }
+      />
+    );
+
+    const {
+      contentSize
+    } = getFolderCoverLayout(folderCover);
+
+    const imageSize = fitContentToBounds({
+      contentSize: props.originalImageSize,
+      boundsSize: contentSize,
+      mode: 'contain'
+    });
+
+    return (
+      <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
+        <Tile
+          itemName={
+            <SignalField
+              before={
+                <NewSignal />
+              }
+            >
+              { lorem(2) }
+            </SignalField>
+          }
+          itemActivity={
+            <SignalField
+              before={
+                <CommentsSignal>{ '12' }</CommentsSignal>
+              }
+            >
+              { lorem(2) }
+            </SignalField>
+          }
+          foreground={
+            renderFolderCoverWithLayout(folderCover, {
+              children: (
+                <img
+                  src={ `//placehold.it/${Math.round(imageSize.width)}x${Math.round(imageSize.height)}` }
+                  className={ css(TileExampleStyles.tileImage) }
+                />
+              )
+            })
+          }
+        />
+      </div>
+    );
+  };
+
 export class TileFolderExample extends React.Component<{}, {}> {
   public render(): JSX.Element {
     return (
       <div>
         <h3>Folder</h3>
-        <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
-          <Tile
-            itemName={
-              <SignalField
-                before={
-                  <NewSignal />
-                }
-              >
-                { lorem(2) }
-              </SignalField>
-            }
-            itemActivity={
-              <SignalField
-                before={
-                  <CommentsSignal>{ '12' }</CommentsSignal>
-                }
-              >
-                { lorem(2) }
-              </SignalField>
-            }
-            foreground={
-              <FolderCover />
-            }
-          />
-        </div>
-        <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
-          <Tile
-            itemName={
-              <SignalField
-                before={
-                  <TrendingSignal />
-                }
-              >
-                { lorem(2) }
-              </SignalField>
+        <FolderTileWithThumbnail
+          originalImageSize={
+            {
+              width: 400,
+              height: 300
             }
-            itemActivity={
-              <SignalField
-                before={
-                  <CommentsSignal>{ '12' }</CommentsSignal>
-                }
-              >
-                { lorem(2) }
-              </SignalField>
+          }
+        />
+        <FolderTileWithThumbnail
+          originalImageSize={
+            {
+              width: 300,
+              height: 400
             }
-            foreground={
-              <FolderCover
-                folderCoverType='media'
-              >
-                <img src='//placehold.it/104x72' />
-              </FolderCover>
+          }
+          folderCoverType='media'
+        />
+        <FolderTileWithThumbnail
+          originalImageSize={
+            {
+              width: 40,
+              height: 40
             }
-          />
-        </div>
+          }
+          folderCoverType='media'
+        />
       </div>
     );
   }
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
index aea7fc60173fb..de3474b2dc884 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
@@ -1,13 +1,13 @@
 
 import * as React from 'react';
-import { Tile } from '../Tile';
+import { Tile, getTileLayout, renderTileWithLayout } from '../Tile';
 import { Icon } from 'office-ui-fabric-react/lib/Icon';
 import { css } from 'office-ui-fabric-react/lib/Utilities';
+import { ISize, fitContentToBounds } from '@uifabric/utilities';
 import {
   SignalField,
   Signal,
   NewSignal,
-  CommentsSignal,
   SharedSignal,
   MentionSignal
 } from '../../signals/Signals';
@@ -17,78 +17,109 @@ import * as TileExampleStylesModule from './Tile.Example.scss';
 // tslint:disable-next-line:no-any
 const TileExampleStyles = TileExampleStylesModule as any;
 
+interface IImageTileProps {
+  tileSize: ISize;
+  originalImageSize: ISize;
+}
+
+const ImageTile: React.StatelessComponent<IImageTileProps> = (props: IImageTileProps): JSX.Element => {
+  const tile = (
+    <Tile
+      contentSize={ props.tileSize }
+      itemName={
+        <SignalField
+          before={
+            <NewSignal />
+          }
+        >
+          { lorem(2) }
+        </SignalField>
+      }
+      itemActivity={
+        <SignalField
+          before={
+            [<Signal key={ 0 }><Icon iconName='play' /></Signal>, <MentionSignal key={ 1 } />]
+          }
+        >
+          { lorem(6) }
+        </SignalField>
+      }
+      background={
+        <span /> // Placeholder content
+      }
+      showBackgroundFrame={ true }
+    />
+  );
+
+  const {
+    backgroundSize
+  } = getTileLayout(tile);
+
+  const imageSize = fitContentToBounds({
+    contentSize: props.originalImageSize,
+    boundsSize: backgroundSize || { width: 0, height: 0 },
+    mode: 'cover'
+  });
+
+  return (
+    <div
+      className={ css(TileExampleStyles.tile) }
+      // tslint:disable-next-line:jsx-ban-props
+      style={
+        {
+          width: `${props.tileSize.width}px`,
+          height: `${props.tileSize.height}px`
+        }
+      }
+    >
+      {
+        renderTileWithLayout(tile, {
+          background: (
+            <img
+              className={ css(TileExampleStyles.tileImage) }
+              src={ `//placehold.it/${Math.round(imageSize.width)}x${Math.round(imageSize.height)}` }
+            />
+          )
+        })
+      }
+    </div>
+  );
+};
+
 export class TileMediaExample extends React.Component<{}, {}> {
   public render(): JSX.Element {
     return (
       <div>
         <h3>Landscape</h3>
-        <div className={ css(TileExampleStyles.tile, TileExampleStyles.landscapeTile) }>
-          <Tile
-            itemName={
-              <SignalField
-                before={
-                  <NewSignal />
-                }
-              >
-                { lorem(2) }
-              </SignalField>
-            }
-            itemActivity={
-              <SignalField
-                before={
-                  [<Signal key={ 0 }><Icon iconName='play' /></Signal>, <MentionSignal key={ 1 } />]
-                }
-              >
-                { lorem(6) }
-              </SignalField>
+        <ImageTile
+          tileSize={
+            {
+              width: 250,
+              height: 200
             }
-            background={
-              <img
-                src={ `//placehold.it/250x200` }
-                style={
-                  {
-                    display: 'block'
-                  }
-                }
-              />
+          }
+          originalImageSize={
+            {
+              width: 400,
+              height: 300
             }
-            showBackgroundFrame={ true }
-          />
-        </div>
+          }
+        />
         <h3>Portrait</h3>
-        <div className={ css(TileExampleStyles.tile, TileExampleStyles.portraitTile) }>
-          <Tile
-            itemName={
-              <SignalField
-                before={
-                  <NewSignal />
-                }
-              >
-                { lorem(1) }
-              </SignalField>
+        <ImageTile
+          tileSize={
+            {
+              width: 200,
+              height: 250
             }
-            itemActivity={
-              <SignalField
-                before={
-                  <CommentsSignal>{ '6' }</CommentsSignal>
-                }
-              >
-                { lorem(6) }
-              </SignalField>
+          }
+          originalImageSize={
+            {
+              width: 300,
+              height: 400
             }
-            background={
-              <img
-                src={ `//placehold.it/175x200` }
-                style={
-                  {
-                    display: 'block'
-                  }
-                }
-              />
-            }
-            showBackgroundFrame={ true }
-          />
-        </div>
+          }
+        />
         <h3>No preview</h3>
         <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
           <Tile
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Example.scss b/packages/experiments/src/components/TilesList/examples/TilesList.Example.scss
new file mode 100644
index 0000000000000..221bbc222dc32
--- /dev/null
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Example.scss
@@ -0,0 +1,4 @@
+
+.tileImage {
+  display: block;
+}
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
index 36f13df3118e1..6e72543cc54d9 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
@@ -4,12 +4,16 @@ import {
   TilesList,
   ITileSize
 } from '../../TilesList';
-import { Tile } from '../../../Tile';
+import { Tile, getTileLayout, renderTileWithLayout } from '../../../Tile';
 import { Selection, SelectionZone } from 'office-ui-fabric-react/lib/Selection';
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { AnimationClassNames } from 'office-ui-fabric-react/lib/Styling';
 import { IExampleGroup, IExampleItem, createGroup, createMediaItems, getTileCells } from './ExampleHelpers';
+import * as TilesListExampleStylesModule from './TilesList.Example.scss';
+
+// tslint:disable-next-line:no-any
+const TilesListExampleStyles = TilesListExampleStylesModule as any;
 
 function createGroups(): IExampleGroup[] {
   let offset = 0;
@@ -80,24 +84,35 @@ export class TilesListMediaExample extends React.Component<{}, {}> {
 
   @autobind
   private _onRenderMediaCell(item: IExampleItem, finalSize: ITileSize): JSX.Element {
-    return (
+    const tile = (
       <Tile
+        contentSize={ finalSize }
         className={ AnimationClassNames.fadeIn400 }
         selection={ this._selection }
         selectionIndex={ item.index }
         background={
-          <img
-            style={ { display: 'block' } }
-            src={
-              `//placehold.it/${Math.round(finalSize.width)}x${Math.round(finalSize.height)}`
-            }
-          />
+          <span /> // Placeholder
         }
         showBackgroundFrame={ true }
         itemName={ item.name }
         itemActivity={ item.key }
       />
     );
+
+    const {
+      backgroundSize = { width: 0, height: 0 }
+    } = getTileLayout(tile);
+
+    return renderTileWithLayout(tile, {
+      background: (
+        <img
+          className={ TilesListExampleStyles.tileImage }
+          src={
+            `//placehold.it/${Math.round(backgroundSize.width)}x${Math.round(backgroundSize.height)}`
+          }
+        />
+      )
+    });
   }
 
   @autobind
diff --git a/packages/utilities/karma.config.js b/packages/utilities/karma.config.js
index e3c221580db52..f15fb0199280f 100644
--- a/packages/utilities/karma.config.js
+++ b/packages/utilities/karma.config.js
@@ -52,7 +52,8 @@ module.exports = function (config) {
         'cheerio': 'window',
         'react/addons': true,
         'react/lib/ExecutionEnvironment': true,
-        'react/lib/ReactContext': true
+        'react/lib/ReactContext': true,
+        'chai': true
       },
       resolve: {
         modules: [
diff --git a/packages/utilities/src/ISize.ts b/packages/utilities/src/ISize.ts
new file mode 100644
index 0000000000000..92c6a3a0e0a81
--- /dev/null
+++ b/packages/utilities/src/ISize.ts
@@ -0,0 +1,5 @@
+
+export interface ISize {
+  width: number;
+  height: number;
+}
diff --git a/packages/utilities/src/index.ts b/packages/utilities/src/index.ts
index a908e44991390..852e621c83ad0 100644
--- a/packages/utilities/src/index.ts
+++ b/packages/utilities/src/index.ts
@@ -10,6 +10,7 @@ export * from './IDisposable';
 export * from './IPoint';
 export * from './IRectangle';
 export * from './IRenderFunction';
+export * from './ISize';
 export * from './KeyCodes';
 export * from './Rectangle';
 export * from './array';
diff --git a/packages/utilities/src/math.test.ts b/packages/utilities/src/math.test.ts
new file mode 100644
index 0000000000000..3482b61557e4c
--- /dev/null
+++ b/packages/utilities/src/math.test.ts
@@ -0,0 +1,149 @@
+
+import { fitContentToBounds } from './math';
+import { expect } from 'chai';
+
+describe('math', () => {
+  describe('#fitContentToBounds', () => {
+    describe('with contain', () => {
+      it('shrinks to fit horizontal', () => {
+        expect(fitContentToBounds({
+          contentSize: {
+            width: 400,
+            height: 300
+          },
+          boundsSize: {
+            width: 200,
+            height: 200
+          },
+          mode: 'contain'
+        })).to.deep.equal({
+          width: 200,
+          height: 150
+        });
+      });
+
+      it('shrinks to fit vertical', () => {
+        expect(fitContentToBounds({
+          contentSize: {
+            width: 300,
+            height: 400
+          },
+          boundsSize: {
+            width: 200,
+            height: 200
+          },
+          mode: 'contain'
+        })).to.deep.equal({
+          width: 150,
+          height: 200
+        });
+      });
+
+      it('does not expand by default', () => {
+        expect(fitContentToBounds({
+          contentSize: {
+            width: 100,
+            height: 75
+          },
+          boundsSize: {
+            width: 200,
+            height: 200
+          },
+          mode: 'contain'
+        })).to.deep.equal({
+          width: 100,
+          height: 75
+        });
+      });
+
+      it('expands if permitted', () => {
+        expect(fitContentToBounds({
+          contentSize: {
+            width: 100,
+            height: 75
+          },
+          boundsSize: {
+            width: 200,
+            height: 200
+          },
+          mode: 'contain',
+          maxScale: 2
+        })).to.deep.equal({
+          width: 200,
+          height: 150
+        });
+      });
+    });
+
+    describe('with cover', () => {
+      it('shrinks to fit horizontal', () => {
+        expect(fitContentToBounds({
+          contentSize: {
+            width: 600,
+            height: 400
+          },
+          boundsSize: {
+            width: 200,
+            height: 200
+          },
+          mode: 'cover'
+        })).to.deep.equal({
+          width: 300,
+          height: 200
+        });
+      });
+
+      it('shrinks to fit vertical', () => {
+        expect(fitContentToBounds({
+          contentSize: {
+            width: 400,
+            height: 600
+          },
+          boundsSize: {
+            width: 200,
+            height: 200
+          },
+          mode: 'cover'
+        })).to.deep.equal({
+          width: 200,
+          height: 300
+        });
+      });
+
+      it('does not expand by default', () => {
+        expect(fitContentToBounds({
+          contentSize: {
+            width: 100,
+            height: 50
+          },
+          boundsSize: {
+            width: 200,
+            height: 200
+          },
+          mode: 'cover'
+        })).to.deep.equal({
+          width: 100,
+          height: 50
+        });
+      });
+
+      it('expands if permitted', () => {
+        expect(fitContentToBounds({
+          contentSize: {
+            width: 100,
+            height: 50
+          },
+          boundsSize: {
+            width: 200,
+            height: 200
+          },
+          mode: 'cover',
+          maxScale: 4
+        })).to.deep.equal({
+          width: 400,
+          height: 200
+        });
+      });
+    });
+  });
+});
diff --git a/packages/utilities/src/math.ts b/packages/utilities/src/math.ts
index c0449cb83a1b1..2eae208b5490e 100644
--- a/packages/utilities/src/math.ts
+++ b/packages/utilities/src/math.ts
@@ -1,4 +1,6 @@
 import { IPoint } from './IPoint';
+import { ISize } from './ISize';
+
 /**
  * Determines the distance between two points.
  *
@@ -8,4 +10,86 @@ export function getDistanceBetweenPoints(point1: IPoint, point2: IPoint): number
   let distance = Math.sqrt(Math.pow(point1.x - point2.x, 2) + Math.pow(point1.y - point2.y, 2));
 
   return distance;
-}
\ No newline at end of file
+}
+
+/**
+ * The available fit modes. These should match the fit modes for CSS.
+ */
+export type FitMode = 'contain' | 'cover';
+
+/**
+ * Options for fitting content sizes into bounding sizes.
+ *
+ * @export
+ * @interface IFitContentToBoundsOptions
+ */
+export interface IFitContentToBoundsOptions {
+  /**
+   * The size of the content to fit to the bounds.
+   * The output will be proportional to this value.
+   *
+   * @type {ISize}
+   * @memberof IFitContentToBoundsOptions
+   */
+  contentSize: ISize;
+  /**
+   * The size of the bounds.
+   *
+   * @type {ISize}
+   * @memberof IFitContentToBoundsOptions
+   */
+  boundsSize: ISize;
+  /**
+   * The fit mode to apply, either 'contain' or 'cover'.
+   *
+   * @type {FitMode}
+   * @memberof IFitContentToBoundsOptions
+   */
+  mode: FitMode;
+  /**
+   * An optional maximum scale factor to apply. The default is 1.
+   * Use Infinity for an unbounded resize.
+   *
+   * @type {number}
+   * @memberof IFitContentToBoundsOptions
+   */
+  maxScale?: number;
+}
+
+/**
+ * Produces a proportionally-scaled version of an input content size when fit to a bounding size.
+ * Given a `contentSize` and a `boundsSize`, this function scales `contentSize` proportionally
+ * using either `contain` or `cover` fit behaviors.
+ * Use this function to pre-calculate the layout for the CSS `object-fit` and `background-fit` behaviors.
+ * With `contain`, the output size must be the largest it can be while completely within the `boundsSize`.
+ * With `cover`, the output size must be the smallest it can be while completely around the `boundsSize`.
+ * By default, there is a `maxScale` value of 1, which prevents the `contentSize` from being scaled larger.
+ *
+ * @param options the options for the bounds fit operation
+ */
+export function fitContentToBounds(options: IFitContentToBoundsOptions): ISize {
+  const {
+    contentSize,
+    boundsSize,
+    mode = 'contain',
+    maxScale = 1
+  } = options;
+
+  const contentAspectRatio = contentSize.width / contentSize.height;
+  const boundsAspectRatio = boundsSize.width / boundsSize.height;
+
+  let scale: number;
+
+  if (mode === 'contain' ? contentAspectRatio > boundsAspectRatio : contentAspectRatio < boundsAspectRatio) {
+    scale = boundsSize.width / contentSize.width;
+  } else {
+    scale = boundsSize.height / contentSize.height;
+  }
+
+  const finalScale = Math.min(maxScale, scale);
+
+  return {
+    width: contentSize.width * finalScale,
+    height: contentSize.height * finalScale
+  };
+}

From e515c5c9aa5aae20ef89cf32ae3e9adeb1fbaaf5 Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Fri, 1 Sep 2017 14:49:10 -0700
Subject: [PATCH 0556/1641] Calendar: Updating styles to match new OWA calendar
 (#2565)

* no message

* no message

* Merge branch 'master' into kegorr/CalendarStyles

# Conflicts:
#	package-lock.json
#	package.json
#	packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
#	packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
#	packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
#	packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx

* Resolving merge conflicts

* Updating styles

* Updating calendar styles

* Updating styles

* Updating calendar styles

* Updating calendar styles

* updating calendar styles

* Removing dependencies

Removing extra dependencies

* Fixing gulp test errors (local gulp test is showing no errors - may be using wrong location to test...)

* Ran npm i and then gulp test to resolve errors

* Removed the rounded corners.  Dates that should have rounded corners in OWA are marked with classes so that rounded corners can be added.  Fixed bug - When month is highlighted and you navigated to the next/previous month we should not show highlighting from previous month.

* Adding border radius (commented out) so that it can be uncommented when rounded corners is released across fabric.

* Fixing some errors

* Fixing errors

* Updating _findWeekCorners() based on feedback

* Updates to _findCornerIndexes()

* centering container

* Fixing problems from merge

* Changing to device-width for media query
---
 ...egorr-CalendarStyles_2017-08-21-18-44.json |  11 +
 .../src/components/Calendar/Calendar.Props.ts |   8 +-
 .../src/components/Calendar/Calendar.scss     | 370 ++++++++----------
 .../src/components/Calendar/Calendar.tsx      |  10 +-
 .../src/components/Calendar/CalendarDay.tsx   | 299 +++++++++-----
 .../src/components/Calendar/CalendarMonth.tsx |  33 +-
 .../src/components/Calendar/CalendarPage.tsx  |   5 +-
 .../examples/Calendar.Inline.Example.tsx      |   3 +-
 8 files changed, 417 insertions(+), 322 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-CalendarStyles_2017-08-21-18-44.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-CalendarStyles_2017-08-21-18-44.json b/common/changes/office-ui-fabric-react/kegorr-CalendarStyles_2017-08-21-18-44.json
new file mode 100644
index 0000000000000..fab0e91057b49
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-CalendarStyles_2017-08-21-18-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Updating Calendar component styles to match new OWA calendar styles for the Calendar team.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
index 9ee8f13ab73fb..0b6e04bcce533 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
@@ -164,14 +164,14 @@ export interface ICalendarStrings {
 
 export interface ICalendarIconStrings {
   /**
-  * FabricMDL2Icons name for the left navigation icon
-  * @defaultvalue  'ChevronLeft'
+  * FabricMDL2Icons name for the left navigation icon.  Previous default: ChevronLeft.
+  * @defaultvalue  'Up'
   */
   leftNavigation?: string;
 
   /**
-  * FabricMDL2Icons name for the right navigation icon
-  * @defaultvalue  'ChevronRight'
+  * FabricMDL2Icons name for the right navigation icon.  Previous default: ChevronRight.
+  * @defaultvalue  'Down'
   */
   rightNavigation?: string;
 
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
index 00277ead941a8..62b808f80f974 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
@@ -25,8 +25,6 @@ $Calendar-dayPicker-margin: 10px;
 .holder {
   -webkit-overflow-scrolling: touch;
   @include ms-borderBox;
-  background: $ms-color-white;
-  min-width: 300px;
   display: none;
 }
 
@@ -53,6 +51,7 @@ $Calendar-dayPicker-margin: 10px;
 .wrap {
   margin: -1px;
   padding: 9px;
+  display: flex;
 }
 
 
@@ -64,6 +63,7 @@ $Calendar-dayPicker-margin: 10px;
 
 // The header containing the month and year.
 .header {
+  display: inline-flex;
   height: $Calendar-day;
   line-height: 44px;
 }
@@ -76,6 +76,7 @@ $Calendar-dayPicker-margin: 10px;
   @include ms-font-xl;
   color: $ms-color-neutralPrimary;
   margin-top: -1px;
+  font-weight: $ms-font-weight-semilight;
 
   &:hover {
     color: $ms-color-themeDark;
@@ -84,11 +85,11 @@ $Calendar-dayPicker-margin: 10px;
 }
 
 .monthAndYear {
-  @include margin-left(15px);
+  @include margin-left(10px);
 }
 
 .year {
-  @include margin-left(15px);
+  @include margin-left(10px);
 }
 
 
@@ -99,6 +100,7 @@ $Calendar-dayPicker-margin: 10px;
   border-spacing: 0;
   table-layout: fixed;
   font-size: inherit;
+  margin-top: 10px;
 
   td {
     margin: 0;
@@ -119,6 +121,7 @@ $Calendar-dayPicker-margin: 10px;
   line-height: $Calendar-day;
   @include ms-font-m-plus;
   color: $ms-color-neutralPrimary;
+  // border-radius: 2px;
 }
 
 
@@ -150,8 +153,7 @@ $Calendar-dayPicker-margin: 10px;
 .dayIsFocused:hover,
 .dayIsUnfocused:hover {
   cursor: pointer;
-  color: $ms-color-black;
-  background: $ms-color-neutralLight;
+  background: $ms-color-neutralTertiaryAlt;
 }
 
 .day.dayIsHighlighted.dayIsFocused {
@@ -162,14 +164,18 @@ $Calendar-dayPicker-margin: 10px;
 .dayIsHighlighted:hover,
 .pickerIsFocused .dayIsHighlighted {
   cursor: pointer;
-  color: $ms-color-white;
-  background: $ms-color-themePrimary;
 
   @media screen and (-ms-high-contrast: active) {
     border: 1px solid Highlight;
   }
 }
 
+.dayIsUnfocused:active, .dayIsFocused:active, .dayIsHighlighted{
+  &.day{
+    color: $ms-color-black;
+    background: $ms-color-themeLight;
+  }
+}
 
 // Disabled and highlighted dates.
 .dayIsHighlighted.dayDisabled,
@@ -177,27 +183,38 @@ $Calendar-dayPicker-margin: 10px;
   background: $ms-color-neutralTertiary;
 }
 
+// Today.
+.dayIsToday, .pickerIsFocused .dayIsToday {
+  position: relative;
+  color: $ms-color-white;
+  background-color: $ms-color-themePrimary;
+  font-weight: 600;
+}
+
+// Highlighted date squares
+.dayBackground, .weekBackground, .monthBackground{
+    background: $ms-color-neutralLight;
+}
 
-// Month and year pickers, hidden on small screens by default.
-.monthPicker,
-.yearPicker {
-  display: none;
+.dayBackground{
+  // border-radius: 2px;
 }
 
+.weekBackground{
+    &:first-child{
+      // border-radius: 2px 0px 0px 2px;
+    }
 
-// Month and year previous/next components.
-.monthComponents {
-  position: absolute;
-  top: 9px;
-  @include ms-right(9px);
-  @include ms-left(9px);
+    &:last-child{
+      // border-radius: 0px 2px 2px 0px;
+    }
 }
 
-.yearComponents,
+// Month and year previous/next components.
+.monthComponents,.yearComponents,
 .decadeComponents {
-  position: absolute;
-  @include ms-right(10px);
-  top: -2px;
+  display: inline-flex;
+  margin-left: 3px;
 }
 
 .prevMonth,
@@ -209,12 +226,11 @@ $Calendar-dayPicker-margin: 10px;
   width: $Calendar-day;
   height: $Calendar-day;
   display: block;
-  @include margin-left(10px);
   text-align: center;
   line-height: $Calendar-day;
   text-align: center;
   font-size: $ms-icon-size-m;
-  color: $ms-color-neutralSecondary;
+  color: $ms-color-neutralDark;
   position: relative;
   top: 2px;
 
@@ -229,10 +245,9 @@ $Calendar-dayPicker-margin: 10px;
 // button is necessary to toggle the month view.
 .headerToggleView {
   height: $Calendar-day;
-  @include ms-left(0px);
   position: absolute;
-  top: 0px;
-  width: 140px;
+  top: 9px;
+  width: 130px;
   cursor: pointer;
 }
 
@@ -248,33 +263,22 @@ $Calendar-dayPicker-margin: 10px;
   color: $ms-color-neutralPrimary;
   height: $Calendar-day;
   line-height: $Calendar-day;
-  @include margin-left(15px);
-}
-
-// The current year is blue and actionable.
-.currentYear {
-  color: $ms-color-themePrimary;
-
-  &:hover {
-    color: $ms-color-themeDark;
-    cursor: pointer;
-  }
+  @include margin-left(10px);
+  font-weight: $ms-font-weight-semilight;
 }
 
-
 // A grid of month or year options, which pushes them over
 // five pixels for horizontal centering and moves them down.
 .optionGrid {
   position: relative;
   height: 210px;
   width: 280px;
-  @include margin(10px, 0, 0px, 5px);
+  @include margin(12px, 0, 0, 0);
 }
 
 // Button to select a different month.
 .monthOption,
 .yearOption {
-  background-color: $ms-color-neutralLighter;
   width: 60px;
   height: 60px;
   line-height: 60px;
@@ -284,8 +288,10 @@ $Calendar-dayPicker-margin: 10px;
   @include ms-font-s-plus;
   color: $ms-color-neutralPrimary;
   text-align: center;
+  // border-radius: 2px;
 
   &:hover {
+    color: $ms-color-black;
     background-color: $ms-color-neutralTertiaryAlt;
     outline: 1px solid transparent;
   }
@@ -294,6 +300,7 @@ $Calendar-dayPicker-margin: 10px;
     background-color: $ms-color-neutralPrimary;
     color: $ms-color-white;
   }
+
 }
 
 
@@ -302,20 +309,25 @@ $Calendar-dayPicker-margin: 10px;
   bottom: 9px;
   color: $ms-color-themePrimary;
   cursor: pointer;
-  @include ms-font-s-plus;
+  @include ms-font-s;
   color: $ms-color-neutralPrimary;
   height: 30px;
   line-height: 30px;
   padding: 0 10px;
   position: absolute !important;
-  @include ms-right(3px);
+  @include ms-right(13px);
 
   &:hover {
+    color: $ms-color-themePrimary;
     outline: 1px solid transparent;
   }
+
+  &:active {
+    color: $ms-color-themeDark;
+  }
 }
 
-//additional 30px margin needed when "Go to today" button is visible
+// Additional 30px margin needed when "Go to today" button is visible
 .wrap.goTodaySpacing{
   margin-bottom: 30px;
 }
@@ -337,43 +349,37 @@ $Calendar-dayPicker-margin: 10px;
   }
 }
 
-
- .pickerOnlyMonthPickerVisible {
-
-  .yearComponents,
-  .decadeComponents {
-    top: 9px;
-  }
- }
-
 // 460px and up.
 //
 // On screens that can fit it, we show the month picker next to the day picker if we have it enabled.
-@media (min-width: 460px) {
+@media (min-device-width: 460px) {
 
-    $Calendar-day: 30px;
+  $Calendar-day: 28px;
+  $Calendar-month: 40px;
 
-    // Update the spacing and text for the day and month pickers
+  .wrap {
+    padding: 4px 7px;
+  }
+  // Update the spacing and text for the day and month pickers
 
-    .header {
-      height: $Calendar-day;
-      line-height: $Calendar-day;
-    }
+  .dayPicker,.monthPicker {
+    min-height: 214px;
+  }
+
+  .header {
+    height: $Calendar-day;
+    line-height: $Calendar-day;
+  }
 
   // Calendar day cells are smaller.
   .day,
   .weekday {
     width: $Calendar-day;
     height: $Calendar-day;
-    line-height: 28px;
-    font-weight: $ms-font-weight-semibold;
+    line-height: $Calendar-day;
     font-size: $ms-font-size-s;
   }
 
-  // Size the month components to the day picker's new width
-  .monthComponents,.yearComponents {
-    width: 210px;
-  }
 
   // Reduce the size of arrows to change month/year.
   .prevMonth,
@@ -382,23 +388,18 @@ $Calendar-dayPicker-margin: 10px;
   .nextYear,
   .prevDecade,
   .nextDecade {
-    font-size: $ms-icon-size-s;
+    font-size: 14px;
     width: 24px;
     height: 24px;
     line-height: 24px;
   }
 
   .holder {
-    min-width: 230px;
+    width: 212px;
+    height: 240px;
   }
 
-  // Update header text styles.
-  .month,
-  .year {
-    font-weight: $ms-font-weight-semilight;
-  }
-
-  .month,
+  .monthAndYear,
   .year {
     font-size: 17px;
     color: $ms-color-neutralPrimary;
@@ -409,43 +410,36 @@ $Calendar-dayPicker-margin: 10px;
     }
   }
 
-  // Show the day picker and month picker side-by-side, if enabled
-  .pickerIsMonthPickerVisible {
+  // Without modifying the Pickadate JS, this transparent
+  // button is necessary to toggle the month view.
+  .headerToggleView {
+    height: $Calendar-day;
+    @include ms-left(70px);
+  }
+
+  // Show month picker, if enabled
+  .monthPickerVisible {
     // Swap margin for padding so that the border extends the full height.
     .dayPicker {
       margin: -$Calendar-dayPicker-margin 0;
       padding: $Calendar-dayPicker-margin 0;
     }
+
     // Contains the calendar view for picking a day.
     .dayPicker {
       @include ms-borderBox;
       @include border-right(1px, solid, $ms-color-neutralLight);
-      width: 220px;
-      min-height: ( $Calendar-day * 8 ) - $Calendar-dayPicker-margin;
-    }
-
-    .holder {
-      width: 440px;
+      width: 212px;
+      min-height: 214px;
     }
     // Show the month picker.
     .monthPicker {
       display: block;
     }
-    // Style the month and year pickers.
-    .monthPicker,
-    .yearPicker {
-      top: 9px;
-      @include ms-left(238px);
-      position: absolute;
-    }
-    // Size and position of the month and year labels.
-    .monthAndYear {
-      @include margin-left(12px);
-    }
 
     .optionGrid {
-      width: 200px;
-      @include margin(10px, 0, 0, 0);
+      height: 150px;
+      width: 212px;
     }
     // This component is only used on small displays.
     .toggleMonthView {
@@ -458,22 +452,25 @@ $Calendar-dayPicker-margin: 10px;
       margin: 0;
       height: $Calendar-day;
       line-height: 26px;
-      padding: 0 10px;
       display: inline-block;
     }
 
     // Reduce the size of the month buttons.
     .monthOption,
     .yearOption {
-      width: 40px;
-      height: 40px;
-      line-height: 38px;
+      width: $Calendar-month;
+      height: $Calendar-month;
+      line-height: $Calendar-month;
       font-size: 12px;
-      @include margin(0, 10px, 10px, 0);
+      @include margin(0, 11px, 11px, 0);
 
       &:hover {
         outline: 1px solid transparent;
       }
+
+      &:nth-child(4n+4){
+        @include margin(0, 0px, 11px, 0);
+      }
     }
     // Position the "Go to today" button below the month picker.
     .goToday {
@@ -482,11 +479,11 @@ $Calendar-dayPicker-margin: 10px;
       height: $Calendar-day;
       line-height: $Calendar-day;
       padding: 0 10px;
-      @include ms-right(3px);
+      @include ms-right(10px);
       @include text-align(right);
       top: 199px;
     }
-    //When date and month picker are side-by-side and "Go to today" button is visible no additional margin is needed
+    // When date and month picker are side-by-side and "Go to today" button is visible no additional margin is needed
     .wrap.goTodaySpacing{
       margin-bottom: 0px;
     }
@@ -511,121 +508,52 @@ $Calendar-dayPicker-margin: 10px;
     }
   }
 
-  // Show the month picker over date picker (1 column layout), if enabled
-  .overlayedCalendars {
-    // Show the month picker.
-
-    .holder {
-      width: 230px;
+  .calendarsInline{
+    .wrap {
+      padding: 9px 12px;
     }
 
-    .monthPicker {
-      display: block;
-    }
-    // Style the month and year pickers.
-    .monthPicker,
-    .yearPicker {
-      top: 0px;
-      @include ms-left(0px);
-      position: relative;
-    }
-
-    .currentYear,
-    .currentDecade {
-      padding:0px;
+    .holder {
+      width: 440px;
+      height: auto;
     }
 
-    .optionGrid{
-      margin: 10px 0 0 10px;
+    .table{
+      margin-right: 12px
     }
-    // Arrows need to be in the same spot as the calendar
-    // when switching between the two
-    .yearComponents,
-    .decadeComponents {
-      @include ms-right(2px);
+    .monthPicker{
+      margin-left: 13px;
     }
 
-    // Position the "Go to today" button below the month picker.
     .goToday {
-      @include ms-right(5px);
-      bottom: 9px;
-    }
-  }
-
-  // if only the month picker is visible, don't show day picker
-  .pickerOnlyMonthPickerVisible {
-    // Hide the day picking components.
-    .dayPicker,
-    .monthComponents {
-      display: none;
-    }
-
-    // Show the month picking components.
-    .monthPicker {
-      display: block;
-    }
-
-    .holder {
-      width: 296px;
-    }
-
-    .currentYear {
-      height: $Calendar-day;
-      line-height: $Calendar-day;
-    }
-
-    .wrap.goTodaySpacing{
-      margin-bottom: 30px;
+      @include ms-right(13px);
     }
   }
 }
 
 // On smaller screens the month button toggles to the picking months state.
-@media (max-width: 459px) {
+@media (max-device-width: 459px) {
 
-  //Stop elements from going off screen
+  // Stop elements from going off screen
   .holder {
     width: 300px;
   }
 
-  // State: The picker is showing the month components.
-  .root.isPickingMonths {
-
-    // Hide the day picking components.
-    .dayPicker,
-    .monthComponents {
+  .calendarsInline{
+    // Month and year pickers, hidden on small screens by default.
+    .monthPicker,
+    .yearPicker {
       display: none;
     }
-
-    // Show the month picking components.
-    .monthPicker {
-      display: block;
-    }
-
   }
 
-  // Do not hide Month picker if it is the only calendar
-  .pickerOnlyMonthPickerVisible, .overlayedCalendars{
-    .monthPicker{
-      display: block;
-    }
-
-    .optionGrid{
-      height: 210px;
-      width: 280px;
-    }
-
-    //keep arrows in place when switching between calendar and month overlay
-    .yearComponents,
-    .decadeComponents {
-      @include ms-right(9px);
-      top: 9px;
-    }
+  .headerToggleView{
+    left: 100px;
   }
 
-  //additional 30px margin needed when "Go to today" button is visible
-  .wrap.goTodaySpacing{
-    margin-bottom: 30px;
+  // position year components so they do not move when switching between calendars (overlayed calendars)
+  .yearComponents {
+    margin-top: 2px;
   }
 }
 
@@ -635,7 +563,7 @@ $Calendar-dayPicker-margin: 10px;
 
 .wrap span:focus,
 .wrap div:focus {
-  @include focus-border(1px, $ms-color-themePrimary);
+  @include focus-border(1px, $ms-color-neutralSecondary);
 }
 
 .goToday {
@@ -649,10 +577,58 @@ $Calendar-dayPicker-margin: 10px;
   display: inline-block;
 }
 
-.navContainer {
-  @include float('right')
+.nextMonth,
+.nextYear {
+  margin-left: 3px;
+}
+
+.monthIsHighlighted{
+  background-color: $ms-color-themeLight;
+
+  &.monthOption:hover{
+    background-color: $ms-color-themeLight;
+  }
 }
 
 .monthIsCurrentMonth {
+  font-weight: 600;
+  color: $ms-color-white;
+  background-color: $ms-color-themePrimary;
+
+  &.monthOption:hover{
+    font-weight: 600;
+    color: $ms-color-white;
+    background-color: $ms-color-themePrimary;
+  }
+}
+
+.monthOption:active{
   background-color: $ms-color-themeLight;
 }
+
+
+// Highlighted Month date styling.
+// Border-radius to be updated once rolled out across fabric
+.topLeftCornerDate{
+  border-radius: 0;
+}
+
+.topRightCornerDate{
+  border-radius: 0;
+}
+
+.bottomLeftCornerDate{
+  border-radius: 0;
+}
+
+.bottomRightCornerDate{
+  border-radius: 0;
+}
+
+.singleTopDate{
+  border-radius: 0;
+}
+
+.singleBottomDate{
+  border-radius: 0;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index 9e895c616d79b..9717400dc6b0c 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -13,8 +13,8 @@ import {
 import * as stylesImport from './Calendar.scss';
 const styles: any = stylesImport;
 
-const leftArrow: string = 'ChevronLeft';
-const rightArrow: string = 'ChevronRight';
+const leftArrow: string = 'Up';
+const rightArrow: string = 'Down';
 let iconStrings: ICalendarIconStrings = {
   leftNavigation: leftArrow,
   rightNavigation: rightArrow
@@ -119,7 +119,6 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     let { firstDayOfWeek, dateRangeType, strings, showMonthPickerAsOverlay, autoNavigateOnSelection, showGoToToday, highlightCurrentMonth, navigationIcons } = this.props;
     let { selectedDate, navigatedDate, isMonthPickerVisible, isDayPickerVisible } = this.state;
     let onHeaderSelect = showMonthPickerAsOverlay ? this._onHeaderSelect : undefined;
-    let showSmallMonthPicker = (isMonthPickerVisible && isDayPickerVisible) || (showMonthPickerAsOverlay && isMonthPickerVisible);
 
     return (
       <div className={ css(rootClass, styles.root) } ref='root' role='application'>
@@ -128,9 +127,8 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
           styles.picker,
           styles.pickerIsOpened,
           styles.pickerIsFocused,
-          showSmallMonthPicker && ('is-monthPickerVisible ' + styles.pickerIsMonthPickerVisible),
-          isMonthPickerVisible && !isDayPickerVisible && !showMonthPickerAsOverlay && ('is-onlymonthPickerVisible ' + styles.pickerOnlyMonthPickerVisible),
-          showMonthPickerAsOverlay && styles.overlayedCalendars,
+          isMonthPickerVisible && ('ms-DatePicker-monthPickerVisible ' + styles.monthPickerVisible),
+          isMonthPickerVisible && isDayPickerVisible && ('ms-DatePicker-calendarsInline ' + styles.calendarsInline),
         ) } >
           <div className={ css('ms-DatePicker-holder ms-slideDownIn10', styles.holder) } onKeyDown={ this._onDatePickerPopupKeyDown }>
             <div className={ css('ms-DatePicker-frame', styles.frame) }>
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index ec87346e42b2d..cb5fb3c325b12 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -59,6 +59,10 @@ export interface ICalendarDayState {
   weeks?: IDayInfo[][];
 }
 
+interface IWeekCorners {
+  [key: string]: string;
+}
+
 export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDayState> {
   public refs: {
     [key: string]: React.ReactInstance;
@@ -87,111 +91,124 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
 
   public render() {
     let { activeDescendantId, weeks } = this.state;
-    let { firstDayOfWeek, strings, navigatedDate, navigationIcons, dateTimeFormatter } = this.props;
+    let { firstDayOfWeek, strings, navigatedDate, navigationIcons, dateRangeType, selectedDate, dateTimeFormatter } = this.props;
     let dayPickerId = getId('DatePickerDay-dayPicker');
     let monthAndYearId = getId('DatePickerDay-monthAndYear');
     let leftNavigationIcon = navigationIcons.leftNavigation;
     let rightNavigationIcon = navigationIcons.rightNavigation;
 
+    // When the month is highlighted get the corner dates so that styles can be added to them
+    let weekCorners: IWeekCorners = {};
+    if (dateRangeType === DateRangeType.Month && selectedDate.getMonth() === navigatedDate.getMonth() && selectedDate.getFullYear() === navigatedDate.getFullYear()) {
+      // navigatedDate is on the current month and current year
+      weekCorners = this._getWeekCornerStyles(weeks!);
+    }
+
     return (
       <div className={ css('ms-DatePicker-dayPicker', styles.dayPicker) } id={ dayPickerId }>
+      <div className={ css('ms-DatePicker-monthComponents', styles.monthComponents) }>
+        <div className={ css('ms-DatePicker-navContainer', styles.navContainer) }>
+          <span
+            className={ css('ms-DatePicker-prevMonth js-prevMonth', styles.prevMonth) }
+            onClick={ this._onSelectPrevMonth }
+            onKeyDown={ this._onPrevMonthKeyDown }
+            aria-controls={ dayPickerId }
+            aria-label={ strings.prevMonthAriaLabel }
+            role='button'
+            tabIndex={ 0 }>
+            <Icon iconName={ getRTL() ? rightNavigationIcon : leftNavigationIcon } />
+          </span >
+          <span
+            className={ css('ms-DatePicker-nextMonth js-nextMonth', styles.nextMonth) }
+            onClick={ this._onSelectNextMonth }
+            onKeyDown={ this._onNextMonthKeyDown }
+            aria-controls={ dayPickerId }
+            aria-label={ strings.nextMonthAriaLabel }
+            role='button'
+            tabIndex={ 0 }>
+            <Icon iconName={ getRTL() ? leftNavigationIcon : rightNavigationIcon } />
+          </span >
+        </div >
+      </div >
         <div className={ css('ms-DatePicker-header', styles.header) } >
-          <div aria-live='polite' aria-relevant='text' aria-atomic='true' id={ monthAndYearId }>
-            <div className={ css('ms-DatePicker-monthAndYear', styles.month) }>{ dateTimeFormatter.formatMonthYear(navigatedDate, strings) }</div>
-          </div>
+        <div aria-live='polite' aria-relevant='text' aria-atomic='true' id={ monthAndYearId }>
+          <div className={ css('ms-DatePicker-monthAndYear', styles.monthAndYear) }>{ dateTimeFormatter.formatMonthYear(navigatedDate, strings) }</div>
         </div>
-        <div className={ css('ms-DatePicker-monthComponents', styles.monthComponents) }>
-          <div className={ css('ms-DatePicker-navContainer', styles.navContainer) }>
-            <span
-              className={ css('ms-DatePicker-prevMonth js-prevMonth', styles.prevMonth) }
-              onClick={ this._onSelectPrevMonth }
-              onKeyDown={ this._onPrevMonthKeyDown }
-              aria-controls={ dayPickerId }
-              aria-label={ strings.prevMonthAriaLabel }
+        {
+          this.props.onHeaderSelect ?
+            <div
+              className={ css('ms-DatePicker-headerToggleView js-showMonthPicker', styles.headerToggleView) }
+              onClick={ this._onHeaderSelect }
+              onKeyDown={ this._onHeaderKeyDown }
+              aria-label={ dateTimeFormatter.formatMonthYear(navigatedDate, strings) }
               role='button'
-              tabIndex={ 0 }>
-              <Icon iconName={ getRTL() ? rightNavigationIcon : leftNavigationIcon } />
-            </span >
-            <span
-              className={ css('ms-DatePicker-nextMonth js-nextMonth', styles.nextMonth) }
-              onClick={ this._onSelectNextMonth }
-              onKeyDown={ this._onNextMonthKeyDown }
-              aria-controls={ dayPickerId }
-              aria-label={ strings.nextMonthAriaLabel }
-              role='button'
-              tabIndex={ 0 }>
-              <Icon iconName={ getRTL() ? leftNavigationIcon : rightNavigationIcon } />
-            </span >
-          </div >
-          {
-            this.props.onHeaderSelect ?
-              <div
-                className={ css('ms-DatePicker-headerToggleView js-showMonthPicker', styles.headerToggleView) }
-                onClick={ this._onHeaderSelect }
-                onKeyDown={ this._onHeaderKeyDown }
-                aria-label={ dateTimeFormatter.formatMonthYear(navigatedDate, strings) }
-                role='button'
-                tabIndex={ 0 }
-              />
-              :
-              null
-          }
-        </div >
-        <FocusZone>
-          <table
-            className={ css('ms-DatePicker-table', styles.table) }
-            aria-readonly='true'
-            aria-multiselectable='false'
-            aria-labelledby={ monthAndYearId }
-            aria-activedescendant={ activeDescendantId }
-          >
-            <thead>
-              <tr>
-                { strings.shortDays.map((val, index) =>
-                  <th
-                    className={ css('ms-DatePicker-weekday', styles.weekday) }
-                    scope='col'
-                    key={ index }
-                    title={ strings.days[(index + firstDayOfWeek) % DAYS_IN_WEEK] }
-                    aria-label={ strings.days[(index + firstDayOfWeek) % DAYS_IN_WEEK] }>
-                    { strings.shortDays[(index + firstDayOfWeek) % DAYS_IN_WEEK] }
-                  </th>) }
+              tabIndex={ 0 }
+            />
+            :
+            null
+        }
+      </div>
+      <FocusZone>
+        <table
+          className={ css('ms-DatePicker-table', styles.table) }
+          aria-readonly='true'
+          aria-multiselectable='false'
+          aria-labelledby={ monthAndYearId }
+          aria-activedescendant={ activeDescendantId }
+        >
+          <thead>
+            <tr>
+              { strings.shortDays.map((val, index) =>
+                <th
+                  className={ css('ms-DatePicker-weekday', styles.weekday) }
+                  scope='col'
+                  key={ index }
+                  title={ strings.days[(index + firstDayOfWeek) % DAYS_IN_WEEK] }
+                  aria-label={ strings.days[(index + firstDayOfWeek) % DAYS_IN_WEEK] }>
+                  { strings.shortDays[(index + firstDayOfWeek) % DAYS_IN_WEEK] }
+                </th>) }
+            </tr>
+          </thead>
+          <tbody>
+            { weeks!.map((week, weekIndex) =>
+              <tr key={ weekIndex } >
+                { week.map((day, dayIndex) =>
+                  <td key={ day.key } className={ css(
+                    {
+                      ['ms-DatePicker-weekBackground ' + styles.weekBackground]: day.isSelected && dateRangeType === DateRangeType.Week,
+                      ['ms-DatePicker-monthBackground ' + styles.monthBackground + ' ' + this._getHighlightedCornerStyle(weekCorners, dayIndex, weekIndex)]: day.isInMonth && day.isSelected && dateRangeType === DateRangeType.Month,
+                      ['ms-DatePicker-dayBackground ' + styles.dayBackground]: day.isSelected && dateRangeType === DateRangeType.Day
+                    }) }
+                  >
+                    <div
+                      className={ css(
+                        'ms-DatePicker-day',
+                        styles.day,
+                        {
+                          ['ms-DatePicker-day--infocus ' + styles.dayIsFocused]: day.isInMonth,
+                          ['ms-DatePicker-day--outfocus ' + styles.dayIsUnfocused]: !day.isInMonth,
+                          ['ms-DatePicker-day--today ' + styles.dayIsToday]: day.isToday,
+                          ['ms-DatePicker-day--highlighted ' + styles.dayIsHighlighted]: day.isSelected && dateRangeType === DateRangeType.Day
+                        }) }
+                      role='button'
+                      onClick={ day.onSelected }
+                      onKeyDown={ (ev: React.KeyboardEvent<HTMLElement>) =>
+                        this._navigateMonthEdge(ev, day.originalDate, weekIndex, dayIndex) }
+                      aria-selected={ day.isSelected }
+                      aria-label={ dateTimeFormatter.formatMonthDayYear(day.originalDate, strings) }
+                      id={ compareDates(navigatedDate, day.originalDate) ? activeDescendantId : undefined }
+                      data-is-focusable={ true }
+                      ref={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : undefined }
+                      key={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : undefined } >
+                      <span aria-hidden='true'>{ dateTimeFormatter.formatDay(day.originalDate) }</span>
+                    </div>
+                  </td>
+                ) }
               </tr>
-            </thead>
-            <tbody>
-              { weeks!.map((week, weekIndex) =>
-                <tr key={ weekIndex }>
-                  { week.map((day, dayIndex) =>
-                    <td key={ day.key }>
-                      <div
-                        className={ css(
-                          'ms-DatePicker-day',
-                          styles.day,
-                          {
-                            ['ms-DatePicker-day--infocus ' + styles.dayIsFocused]: day.isInMonth,
-                            ['ms-DatePicker-day--outfocus ' + styles.dayIsUnfocused]: !day.isInMonth,
-                            ['ms-DatePicker-day--today ' + styles.dayIsToday]: day.isToday,
-                            ['ms-DatePicker-day--highlighted ' + styles.dayIsHighlighted]: day.isSelected
-                          }) }
-                        role='button'
-                        onClick={ day.onSelected }
-                        onKeyDown={ (ev: React.KeyboardEvent<HTMLElement>) =>
-                          this._navigateMonthEdge(ev, day.originalDate, weekIndex, dayIndex) }
-                        aria-selected={ day.isSelected }
-                        aria-label={ dateTimeFormatter.formatMonthDayYear(day.originalDate, strings) }
-                        id={ compareDates(navigatedDate, day.originalDate) ? activeDescendantId : undefined }
-                        data-is-focusable={ true }
-                        ref={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : undefined }
-                        key={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : undefined } >
-                        <span aria-hidden='true'>{ dateTimeFormatter.formatDay(day.originalDate) }</span>
-                      </div>
-                    </td>
-                  ) }
-                </tr>
-              ) }
-            </tbody>
-          </table>
-        </FocusZone>
+            ) }
+          </tbody>
+        </table>
+      </FocusZone>
       </div >
     );
   }
@@ -203,6 +220,100 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
     }
   }
 
+  private _findCornerIndexes(week: IDayInfo[]) {
+
+    let cornerIndexes = [];
+
+    for (let i = 0, length = week.length; i < length; i++) {
+
+      let day = week[i];
+      if (day.isInMonth) {
+        cornerIndexes.push(i);
+      }
+
+    }
+
+    if (cornerIndexes.length > 2) {
+      cornerIndexes.splice(1, cornerIndexes.length - 2);
+    }
+
+    return cornerIndexes;
+  }
+
+  private _populateCornerStyles(
+    weekCornersStyled: any,
+    weekIndex: number,
+    cornerIndexes: number[],
+    singleCornerStyle: string,
+    leftCornerStyle: string,
+    rightCornerStyle: string) {
+
+    let cornersLength = cornerIndexes.length;
+    if (cornersLength > 0) {
+
+      if (cornersLength == 1) {
+
+        weekCornersStyled[weekIndex + '_' + cornerIndexes[0]] = singleCornerStyle;
+
+      } else if (cornersLength == 2) {
+
+        weekCornersStyled[weekIndex + '_' + cornerIndexes[0]] = leftCornerStyle;
+        weekCornersStyled[weekIndex + '_' + cornerIndexes[1]] = rightCornerStyle;
+      }
+
+      if (weekIndex == 0) {
+
+        // check if second week needs corner styles
+        if (cornerIndexes[0] != 0) {
+          weekCornersStyled['1_0'] = leftCornerStyle;
+        }
+
+      } else {
+
+        // Assume we are on the last week. Check if second-to-last week needs corner styles
+        let lastDayIndex = DAYS_IN_WEEK - 1;
+        if (cornerIndexes[cornersLength - 1] != lastDayIndex) {
+          weekCornersStyled[(weekIndex - 1) + '_' + lastDayIndex] = rightCornerStyle;
+        }
+
+      }
+    }
+  }
+
+  private _getWeekCornerStyles(weeks: IDayInfo[][]) {
+
+    let weekCornersStyled: any = {};
+    let numberOfWeeks = weeks.length;
+    let indexesFirstWeek = this._findCornerIndexes(weeks[0]);
+    let indexesLastWeek = this._findCornerIndexes(weeks[numberOfWeeks - 1]);
+
+    this._populateCornerStyles(
+      weekCornersStyled,
+      0 /* week index */,
+      indexesFirstWeek,
+      'ms-DatePicker-singleTopDate ' + styles.singleTopDate,
+      'ms-DatePicker-topLeftCornerDate ' + styles.topLeftCornerDate,
+      'ms-DatePicker-topRightCornerDate ' + styles.topRightCornerDate
+    );
+
+    this._populateCornerStyles(
+      weekCornersStyled,
+      weeks.length - 1 /* week index */,
+      indexesLastWeek,
+      'ms-DatePicker-singleBottomDate ' + styles.singleBottomDate,
+      'ms-DatePicker-bottomLeftCornerDate ' + styles.bottomLeftCornerDate,
+      'ms-DatePicker-bottomRightCornerDate ' + styles.bottomRightCornerDate
+    );
+
+    return weekCornersStyled;
+  }
+
+  private _getHighlightedCornerStyle(weekCorners: IWeekCorners, dayIndex: number, weekIndex: number) {
+    let cornerStyle = weekCorners[weekIndex + '_' + dayIndex] ? weekCorners[weekIndex + '_' + dayIndex] : '';
+
+    return cornerStyle;
+  }
+
   private _navigateMonthEdge(ev: React.KeyboardEvent<HTMLElement>, date: Date, weekIndex: number, dayIndex: number) {
     if (weekIndex === 0 && ev.which === KeyCodes.up) {
       this.props.onNavigateDate(addWeeks(date, -1), true);
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
index 9a843eaab7794..153f58d009dca 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
@@ -55,8 +55,6 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
 
     return (
       <div className={ css('ms-DatePicker-monthPicker', styles.monthPicker) }>
-        <div className={ css('ms-DatePicker-header', styles.header) }>
-          <div className={ css('ms-DatePicker-currentYear js-showYearPicker', styles.currentYear) }>{ dateTimeFormatter.formatYear(navigatedDate) }</div>
           <div className={ css('ms-DatePicker-yearComponents', styles.yearComponents) }>
             <div className={ css('ms-DatePicker-navContainer', styles.navContainer) }>
               <span
@@ -79,19 +77,21 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
               </span>
             </div>
           </div>
-          {
-            this.props.onHeaderSelect ?
-              <div
-                className={ css('ms-DatePicker-headerToggleView js-showYearPicker', styles.headerToggleView) }
-                onClick={ this._onHeaderSelect }
-                onKeyDown={ this._onHeaderKeyDown }
-                aria-label={ dateTimeFormatter.formatYear(navigatedDate) }
-                role='button'
-                tabIndex={ 0 }
-              />
-              :
-              null
-          }
+          <div className={ css('ms-DatePicker-header', styles.header) }>
+            <div className={ css('ms-DatePicker-currentYear js-showYearPicker', styles.currentYear) }>{ dateTimeFormatter.formatYear(navigatedDate) }</div>
+            {
+              this.props.onHeaderSelect ?
+                <div
+                  className={ css('ms-DatePicker-headerToggleView js-showYearPicker', styles.headerToggleView) }
+                  onClick={ this._onHeaderSelect }
+                  onKeyDown={ this._onHeaderKeyDown }
+                  aria-label={ dateTimeFormatter.formatYear(navigatedDate) }
+                  role='button'
+                  tabIndex={ 0 }
+                />
+                :
+                null
+            }
         </div>
         <FocusZone>
           <div className={ css('ms-DatePicker-optionGrid', styles.optionGrid) }>
@@ -102,7 +102,8 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
                   css('ms-DatePicker-monthOption',
                     styles.monthOption,
                     {
-                      ['ms-DatePicker-day--today ' + styles.monthIsCurrentMonth]: highlightCurrentMonth && this._isCurrentMonth(index, navigatedDate.getFullYear(), today!)
+                      ['ms-DatePicker-day--today ' + styles.monthIsCurrentMonth]: highlightCurrentMonth && this._isCurrentMonth(index, navigatedDate.getFullYear(), today!),
+                      ['ms-DatePicker-day--highlighted ' + styles.monthIsHighlighted]: highlightCurrentMonth && (navigatedDate.getMonth() === index)
                     })
                 }
                 key={ index }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
index 9dd97aa02310a..13e49229faa19 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
@@ -8,7 +8,6 @@ import {
 import { DateRangeType } from 'office-ui-fabric-react/lib/Calendar';
 import { CalendarButtonExample } from './examples/Calendar.Button.Example';
 import { CalendarInlineExample } from './examples/Calendar.Inline.Example';
-
 const CalendarButtonExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx') as string;
 const CalendarInlineExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx') as string;
 
@@ -26,10 +25,10 @@ export class CalendarPage extends React.Component<IComponentDemoPageProps, any>
             </ExampleCard>
             <ExampleCard title='Inline Calendar with overlayed month picker when header is clicked' code={ CalendarInlineExampleCode }>
               <CalendarInlineExample showMonthPickerAsOverlay={ true } highlightCurrentMonth={ true } dateRangeType={ DateRangeType.Day } autoNavigateOnSelection={ false }
-                showGoToToday={ true } />
+                showGoToToday={ false } />
             </ExampleCard>
             <ExampleCard title='Inline Calendar with month picker' code={ CalendarInlineExampleCode }>
-              <CalendarInlineExample dateRangeType={ DateRangeType.Day } autoNavigateOnSelection={ false }
+              <CalendarInlineExample dateRangeType={ DateRangeType.Day } autoNavigateOnSelection={ false } highlightCurrentMonth={ true }
                 showGoToToday={ true } />
             </ExampleCard>
             <ExampleCard title='Inline Calendar with week selection' code={ CalendarInlineExampleCode }>
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
index a9b68e8df3652..07dfd9c920d83 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
@@ -94,8 +94,7 @@ export class CalendarInlineExample extends React.Component<ICalendarInlineExampl
 
   public render() {
     let divStyle: React.CSSProperties = {
-      height: '340px',
-      width: '400px'
+      height: '340px'
     };
 
     let buttonStyle: React.CSSProperties = {

From 25690f7cbef4c2501362b5bbb936ada662c4e85d Mon Sep 17 00:00:00 2001
From: Ben Truelove <betrue@microsoft.com>
Date: Fri, 1 Sep 2017 17:03:01 -0700
Subject: [PATCH 0557/1641] Betrue/fix check (#2715)

* Fixed low check placement in Chrome and changed from 50% transform trick to use Flex Box.

* changelist

* Update Check.scss

* Fixed issues with z-order and container backwardsness

* Update Check.scss

* Update betrue-fixCheck_2017-09-01-18-18.json

* Update betrue-fixCheck_2017-09-01-18-18.json
---
 .../betrue-fixCheck_2017-09-01-18-18.json     | 11 ++++++
 .../src/components/Check/Check.scss           | 35 ++++++++++---------
 2 files changed, 29 insertions(+), 17 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/betrue-fixCheck_2017-09-01-18-18.json

diff --git a/common/changes/office-ui-fabric-react/betrue-fixCheck_2017-09-01-18-18.json b/common/changes/office-ui-fabric-react/betrue-fixCheck_2017-09-01-18-18.json
new file mode 100644
index 0000000000000..0f244d5795f33
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/betrue-fixCheck_2017-09-01-18-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Check: Fixed Chrome-specific alignment for the checkmark within the circle.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "betrue@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.scss b/packages/office-ui-fabric-react/src/components/Check/Check.scss
index e8291063b8d32..c65ac42c18899 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.scss
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.scss
@@ -11,16 +11,25 @@ $checkBoxHeight: 18px;
 
 .root {
   line-height: 1;
-  width: $checkBoxHeight - 2px;
-  height: $checkBoxHeight - 2px;
+  width: $checkBoxHeight;
+  height: $checkBoxHeight;
   vertical-align: top;
   position: relative;
+  display: flex;
+  align-items: stretch;
+  justify-content: center;
+
   @include ms-user-select(none);
-  background: $ms-color-white;
-  border-radius: $checkBoxHeight;
 
-  &.rootIsChecked {
+  &.rootIsChecked:before {
     background: $ms-color-themePrimary;
+    content: '';
+    position: absolute;
+    left: 1px;
+    right: 1px;
+    bottom: 1px;
+    top: 1px;
+    border-radius: 50%;
   }
 }
 
@@ -32,16 +41,11 @@ $checkBoxHeight: 18px;
 
 .circle,
 .check {
-  position: absolute;
-  height: $checkBoxHeight;
-  width: $checkBoxHeight;
-  transform: translate(-50%, -50%);
   font-size: $checkBoxHeight;
 }
 
 .circle {
-  top: 50%;
-  left: 50%;
+  position: absolute;
   color: $ms-color-neutralTertiaryAlt;
 
   @media screen and (-ms-high-contrast: active) {
@@ -54,12 +58,9 @@ $checkBoxHeight: 18px;
 }
 
 .check {
-  width: auto;
-  height: auto;
+  position: absolute;
   color: $ms-color-neutralTertiaryAlt;
   font-size: 16px;
-  top: 40%;
-  left: 53%;
 }
 
 .rootIsChecked .check {
@@ -67,7 +68,7 @@ $checkBoxHeight: 18px;
   font-weight: 900;
 
   @media screen and (-ms-high-contrast: active) {
-    border-radius: 10px;
+    border-radius: 9px;
     border: 1px solid WindowText;
   }
-}
\ No newline at end of file
+}

From df87ad7d594994115a307e1e15e20614c37c4a75 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Fri, 1 Sep 2017 17:05:44 -0700
Subject: [PATCH 0558/1641] Re-enabled 'jsx-no-bind' tslint rule in Fabric pkg
 (#2704)

* Re-enable 'jsx-no-bind' rule and implement autobind where needed

* Update tslint.json
---
 .../DatePicker/examples/DatePicker.Basic.Example.tsx  |  4 +++-
 .../examples/DetailsList.CustomColumns.Example.tsx    |  5 +++--
 .../Dialog/examples/Dialog.Basic.Example.tsx          | 11 +++++++----
 .../Dialog/examples/Dialog.Blocking.Example.tsx       | 11 +++++++----
 .../Dialog/examples/Dialog.LargeHeader.Example.tsx    | 11 +++++++----
 .../examples/FocusTrapZone.Box.Click.Example.tsx      | 10 +++++++---
 .../examples/FocusTrapZone.Box.Example.tsx            | 10 +++++++---
 ...FocusTrapZone.Box.FocusOnCustomElement.Example.tsx | 10 +++++++---
 .../components/Modal/examples/Modal.Basic.Example.tsx |  7 +++++--
 .../Panel/examples/Panel.Custom.Example.tsx           |  8 ++++++--
 .../Panel/examples/Panel.LargeFixed.Example.tsx       |  8 ++++++--
 .../Pivot/examples/Pivot.OnChange.Example.tsx         |  2 +-
 .../examples/PeoplePicker.Types.Example.tsx           |  3 ++-
 .../components/pickers/Suggestions/Suggestions.tsx    |  4 ++--
 .../pickers/examples/Picker.CustomResult.Example.tsx  |  4 +++-
 .../pickers/examples/TagPicker.Basic.Example.tsx      |  7 +++++--
 .../src/utilities/decorators/withContainsFocus.tsx    |  4 +++-
 packages/office-ui-fabric-react/tslint.json           |  3 +--
 18 files changed, 82 insertions(+), 40 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx
index c48d5814a4737..4a6846aabdfd8 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { autobind } from '../../../Utilities';
 import { Dropdown, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
 import { DatePicker, DayOfWeek, IDatePickerStrings } from 'office-ui-fabric-react/lib/DatePicker';
 
@@ -112,12 +113,13 @@ export class DatePickerBasicExample extends React.Component<any, IDatePickerBasi
             }
           ] }
           selectedKey={ DayOfWeek[firstDayOfWeek!] }
-          onChanged={ this._onDropdownChanged.bind(this) }
+          onChanged={ this._onDropdownChanged }
         />
       </div>
     );
   }
 
+  @autobind
   private _onDropdownChanged(option: IDropdownOption) {
     this.setState({
       firstDayOfWeek: (DayOfWeek as any)[option.key]
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
index ec21a419e209e..b27af71837e20 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
@@ -2,7 +2,7 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import { createListItems } from '@uifabric/example-app-base';
-
+import { autobind } from '../../../Utilities';
 import { Link } from 'office-ui-fabric-react/lib/Link';
 import { Image, ImageFit } from 'office-ui-fabric-react/lib/Image';
 import {
@@ -40,12 +40,13 @@ export class DetailsListCustomColumnsExample extends React.Component<{}, IDetail
         setKey='set'
         columns={ columns }
         onRenderItemColumn={ _renderItemColumn }
-        onColumnHeaderClick={ this._onColumnClick.bind(this) }
+        onColumnHeaderClick={ this._onColumnClick }
         onItemInvoked={ (item, index) => alert(`Item ${item.name} at index ${index} has been invoked.`) }
         onColumnHeaderContextMenu={ (column, ev) => console.log(`column ${column!.key} contextmenu opened.`) } />
     );
   }
 
+  @autobind
   private _onColumnClick(event: React.MouseEvent<HTMLElement>, column: IColumn) {
     let { sortedItems, columns } = this.state;
     let isSortedDescending = column.isSortedDescending;
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
index 63e1f9b24576b..e5fe30e18aba6 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { autobind } from '../../../Utilities';
 import { Dialog, DialogType, DialogFooter } from 'office-ui-fabric-react/lib/Dialog';
 import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { ChoiceGroup } from 'office-ui-fabric-react/lib/ChoiceGroup';
@@ -18,7 +19,7 @@ export class DialogBasicExample extends React.Component<any, any> {
       <div>
         <DefaultButton
           description='Opens the Sample Dialog'
-          onClick={ this._showDialog.bind(this) }
+          onClick={ this._showDialog }
           text='Open Dialog'
         />
         <label id='myLabelId' className='screenReaderOnly'>My sample Label</label>
@@ -26,7 +27,7 @@ export class DialogBasicExample extends React.Component<any, any> {
 
         <Dialog
           hidden={ this.state.hideDialog }
-          onDismiss={ this._closeDialog.bind(this) }
+          onDismiss={ this._closeDialog }
           dialogContentProps={ {
             type: DialogType.normal,
             title: 'All emails together',
@@ -60,18 +61,20 @@ export class DialogBasicExample extends React.Component<any, any> {
           />
           { null /** You can also include null values as the result of conditionals */ }
           <DialogFooter>
-            <PrimaryButton onClick={ this._closeDialog.bind(this) } text='Save' />
-            <DefaultButton onClick={ this._closeDialog.bind(this) } text='Cancel' />
+            <PrimaryButton onClick={ this._closeDialog } text='Save' />
+            <DefaultButton onClick={ this._closeDialog } text='Cancel' />
           </DialogFooter>
         </Dialog>
       </div>
     );
   }
 
+  @autobind
   private _showDialog() {
     this.setState({ hideDialog: false });
   }
 
+  @autobind
   private _closeDialog() {
     this.setState({ hideDialog: true });
   }
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx
index 61ad7bd88f397..7e738a7a80550 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { autobind } from '../../../Utilities';
 import { Dialog, DialogType, DialogFooter } from 'office-ui-fabric-react/lib/Dialog';
 import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { ChoiceGroup } from 'office-ui-fabric-react/lib/ChoiceGroup';
@@ -17,12 +18,12 @@ export class DialogBlockingExample extends React.Component<any, any> {
       <div>
         <DefaultButton
           description='Opens the Sample Dialog'
-          onClick={ this._showDialog.bind(this) }
+          onClick={ this._showDialog }
           text='Open Dialog'
         />
         <Dialog
           hidden={ this.state.hideDialog }
-          onDismiss={ this._closeDialog.bind(this) }
+          onDismiss={ this._closeDialog }
           dialogContentProps={ {
             type: DialogType.normal,
             title: 'All emails together',
@@ -53,18 +54,20 @@ export class DialogBlockingExample extends React.Component<any, any> {
             onChange={ this._onChoiceChanged }
           />
           <DialogFooter>
-            <PrimaryButton onClick={ this._closeDialog.bind(this) } text='Save' />
-            <DefaultButton onClick={ this._closeDialog.bind(this) } text='Cancel' />
+            <PrimaryButton onClick={ this._closeDialog } text='Save' />
+            <DefaultButton onClick={ this._closeDialog } text='Cancel' />
           </DialogFooter>
         </Dialog>
       </div>
     );
   }
 
+  @autobind
   private _showDialog() {
     this.setState({ hideDialog: false });
   }
 
+  @autobind
   private _closeDialog() {
     this.setState({ hideDialog: true });
   }
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.LargeHeader.Example.tsx b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.LargeHeader.Example.tsx
index def7282ae5432..ef0cae588597a 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.LargeHeader.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.LargeHeader.Example.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { autobind } from '../../../Utilities';
 import { Dialog, DialogType, DialogFooter } from 'office-ui-fabric-react/lib/Dialog';
 import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { ChoiceGroup } from 'office-ui-fabric-react/lib/ChoiceGroup';
@@ -17,12 +18,12 @@ export class DialogLargeHeaderExample extends React.Component<any, any> {
       <div>
         <DefaultButton
           description='Opens the Sample Dialog'
-          onClick={ this._showDialog.bind(this) }
+          onClick={ this._showDialog }
           text='Open Dialog'
         />
         <Dialog
           hidden={ this.state.hideDialog }
-          onDismiss={ this._closeDialog.bind(this) }
+          onDismiss={ this._closeDialog }
           dialogContentProps={ {
             type: DialogType.largeHeader,
             title: 'All emails together',
@@ -53,18 +54,20 @@ export class DialogLargeHeaderExample extends React.Component<any, any> {
             onChange={ this._onChoiceChanged }
           />
           <DialogFooter>
-            <PrimaryButton onClick={ this._closeDialog.bind(this) } text='Save' />
-            <DefaultButton onClick={ this._closeDialog.bind(this) } text='Cancel' />
+            <PrimaryButton onClick={ this._closeDialog } text='Save' />
+            <DefaultButton onClick={ this._closeDialog } text='Cancel' />
           </DialogFooter>
         </Dialog>
       </div>
     );
   }
 
+  @autobind
   private _showDialog() {
     this.setState({ hideDialog: false });
   }
 
+  @autobind
   private _closeDialog() {
     this.setState({ hideDialog: true });
   }
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
index 13c7f83d7376b..15ad645167567 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
@@ -3,6 +3,7 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
 import * as ReactDOM from 'react-dom';
+import { autobind } from '../../../Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { FocusTrapZone } from 'office-ui-fabric-react/lib/FocusTrapZone';
 import { Link } from 'office-ui-fabric-react/lib/Link';
@@ -32,7 +33,7 @@ export default class BoxNoClickExample extends React.Component<React.HTMLAttribu
       <div>
         <DefaultButton
           description='Focuses inside the FocusTrapZone'
-          onClick={ this._onButtonClickHandler.bind(this) }
+          onClick={ this._onButtonClickHandler }
           text='Go to Trap Zone'
         />
 
@@ -65,7 +66,7 @@ export default class BoxNoClickExample extends React.Component<React.HTMLAttribu
         <Toggle
           componentRef={ t => this._toggle = t }
           checked={ isToggled }
-          onChanged={ this._onFocusTrapZoneToggleChanged.bind(this) }
+          onChanged={ this._onFocusTrapZoneToggleChanged }
           label='Focus Trap Zone'
           onText='On'
           offText='Off' />
@@ -74,7 +75,7 @@ export default class BoxNoClickExample extends React.Component<React.HTMLAttribu
             return (
               <DefaultButton
                 description='Exit Focus Trap Zone'
-                onClick={ this._onExitButtonClickHandler.bind(this) }
+                onClick={ this._onExitButtonClickHandler }
                 text='Exit Focus Trap Zone'
               />
             );
@@ -84,18 +85,21 @@ export default class BoxNoClickExample extends React.Component<React.HTMLAttribu
     );
   }
 
+  @autobind
   private _onButtonClickHandler() {
     this.setState({
       isToggled: true
     });
   }
 
+  @autobind
   private _onExitButtonClickHandler() {
     this.setState({
       isToggled: false
     });
   }
 
+  @autobind
   private _onFocusTrapZoneToggleChanged(isToggled: boolean) {
     this.setState({
       isToggled: isToggled
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
index 15569205edf38..f951a91b8a47c 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
@@ -3,6 +3,7 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
 import * as ReactDOM from 'react-dom';
+import { autobind } from '../../../Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { FocusTrapZone } from 'office-ui-fabric-react/lib/FocusTrapZone';
 import { Link } from 'office-ui-fabric-react/lib/Link';
@@ -32,7 +33,7 @@ export default class BoxExample extends React.Component<React.HTMLAttributes<HTM
       <div>
         <DefaultButton
           description='Focuses inside the FocusTrapZone'
-          onClick={ this._onButtonClickHandler.bind(this) }
+          onClick={ this._onButtonClickHandler }
           text='Go to Trap Zone'
         />
 
@@ -65,7 +66,7 @@ export default class BoxExample extends React.Component<React.HTMLAttributes<HTM
         <Toggle
           componentRef={ toggle => this._toggle = toggle }
           checked={ isChecked }
-          onChanged={ this._onFocusTrapZoneToggleChanged.bind(this) }
+          onChanged={ this._onFocusTrapZoneToggleChanged }
           label='Focus Trap Zone'
           onText='On'
           offText='Off' />
@@ -74,7 +75,7 @@ export default class BoxExample extends React.Component<React.HTMLAttributes<HTM
             return (
               <DefaultButton
                 description='Exit Focus Trap Zone'
-                onClick={ this._onExitButtonClickHandler.bind(this) }
+                onClick={ this._onExitButtonClickHandler }
                 text='Exit Focus Trap Zone'
               />
             );
@@ -84,18 +85,21 @@ export default class BoxExample extends React.Component<React.HTMLAttributes<HTM
     );
   }
 
+  @autobind
   private _onButtonClickHandler() {
     this.setState({
       isChecked: true
     });
   }
 
+  @autobind
   private _onExitButtonClickHandler() {
     this.setState({
       isChecked: false
     });
   }
 
+  @autobind
   private _onFocusTrapZoneToggleChanged(isChecked: boolean) {
     this.setState({
       isChecked: isChecked
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
index c70c395419f5f..a72b09788d7d1 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
@@ -3,6 +3,7 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
 import * as ReactDOM from 'react-dom';
+import { autobind } from '../../../Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { FocusTrapZone } from 'office-ui-fabric-react/lib/FocusTrapZone';
 import { Link } from 'office-ui-fabric-react/lib/Link';
@@ -31,7 +32,7 @@ export default class BoxExample extends React.Component<React.HTMLAttributes<HTM
     return (
       <div>
         <DefaultButton
-          onClick={ this._onButtonClickHandler.bind(this) }
+          onClick={ this._onButtonClickHandler }
           text='Go to Trap Zone'
         />
         { (() => {
@@ -64,7 +65,7 @@ export default class BoxExample extends React.Component<React.HTMLAttributes<HTM
           <Toggle
             componentRef={ t => this._toggle = t }
             checked={ isChecked }
-            onChanged={ this._onFocusTrapZoneToggleChanged.bind(this) }
+            onChanged={ this._onFocusTrapZoneToggleChanged }
             label='Focus Trap Zone'
             onText='On'
             offText='Off' />
@@ -74,7 +75,7 @@ export default class BoxExample extends React.Component<React.HTMLAttributes<HTM
             return (
               <DefaultButton
                 description='Exit Focus Trap Zone'
-                onClick={ this._onExitButtonClickHandler.bind(this) }
+                onClick={ this._onExitButtonClickHandler }
                 text='Exit Focus Trap Zone'
               />
             );
@@ -84,18 +85,21 @@ export default class BoxExample extends React.Component<React.HTMLAttributes<HTM
     );
   }
 
+  @autobind
   private _onButtonClickHandler() {
     this.setState({
       isChecked: true
     });
   }
 
+  @autobind
   private _onExitButtonClickHandler() {
     this.setState({
       isChecked: false
     });
   }
 
+  @autobind
   private _onFocusTrapZoneToggleChanged(isChecked: boolean) {
     this.setState({
       isChecked: isChecked
diff --git a/packages/office-ui-fabric-react/src/components/Modal/examples/Modal.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Modal/examples/Modal.Basic.Example.tsx
index af8ac4c80f23c..731c129918c6e 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/examples/Modal.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Modal/examples/Modal.Basic.Example.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { autobind } from '../../../Utilities';
 import { Modal } from 'office-ui-fabric-react/lib/Modal';
 import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { ChoiceGroup } from 'office-ui-fabric-react/lib/ChoiceGroup';
@@ -18,12 +19,12 @@ export class ModalBasicExample extends React.Component<any, any> {
       <div>
         <DefaultButton
           description='Opens the Sample Modal'
-          onClick={ this._showModal.bind(this) }
+          onClick={ this._showModal }
           text='Open Modal'
         />
         <Modal
           isOpen={ this.state.showModal }
-          onDismiss={ this._closeModal.bind(this) }
+          onDismiss={ this._closeModal }
           isBlocking={ false }
           containerClassName='ms-modalExample-container'
         >
@@ -42,10 +43,12 @@ export class ModalBasicExample extends React.Component<any, any> {
     );
   }
 
+  @autobind
   private _showModal() {
     this.setState({ showModal: true });
   }
 
+  @autobind
   private _closeModal() {
     this.setState({ showModal: false });
   }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Custom.Example.tsx
index e1bcec7de9d6b..b8dd74375c76d 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Custom.Example.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { autobind } from '../../../Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
@@ -17,11 +18,11 @@ export class PanelCustomExample extends React.Component<any, any> {
         <DefaultButton
           text='Open Panel'
           description='Opens the Sample Panel'
-          onClick={ this._showPanel.bind(this) }
+          onClick={ this._showPanel }
         />
         <Panel
           isOpen={ this.state.showPanel }
-          onDismiss={ this._closePanel.bind(this) }
+          onDismiss={ this._closePanel }
           type={ PanelType.custom }
           customWidth='888px'
           headerText='Custom Panel with custom 888px width'
@@ -32,9 +33,12 @@ export class PanelCustomExample extends React.Component<any, any> {
     );
   }
 
+  @autobind
   private _showPanel() {
     this.setState({ showPanel: true });
   }
+
+  @autobind
   private _closePanel() {
     this.setState({ showPanel: false });
   }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LargeFixed.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LargeFixed.Example.tsx
index 469716df1079b..63a7e5912165d 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LargeFixed.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LargeFixed.Example.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { autobind } from '../../../Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
@@ -16,12 +17,12 @@ export class PanelLargeFixedExample extends React.Component<any, any> {
       <div>
         <DefaultButton
           description='Opens the Sample Panel'
-          onClick={ this._showPanel.bind(this) }
+          onClick={ this._showPanel }
           text='Open Panel'
         />
         <Panel
           isOpen={ this.state.showPanel }
-          onDismiss={ this._closePanel.bind(this) }
+          onDismiss={ this._closePanel }
           type={ PanelType.largeFixed }
           headerText='Large Panel'
         >
@@ -31,9 +32,12 @@ export class PanelLargeFixedExample extends React.Component<any, any> {
     );
   }
 
+  @autobind
   private _showPanel() {
     this.setState({ showPanel: true });
   }
+
+  @autobind
   private _closePanel() {
     this.setState({ showPanel: false });
   }
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.OnChange.Example.tsx b/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.OnChange.Example.tsx
index 18b51c3c11e38..703c04d967d07 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.OnChange.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.OnChange.Example.tsx
@@ -11,7 +11,7 @@ export class PivotOnChangeExample extends React.Component<any, any> {
   public render() {
     return (
       <div>
-        <Pivot linkSize={ PivotLinkSize.large } linkFormat={ PivotLinkFormat.tabs } onLinkClick={ this.onLinkClick.bind(this) }>
+        <Pivot linkSize={ PivotLinkSize.large } linkFormat={ PivotLinkFormat.tabs } onLinkClick={ this.onLinkClick }>
           <PivotItem linkText='Foo'>
             <Label>Pivot #1</Label>
           </PivotItem>
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index aa4c087397019..ee13a14a75baf 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -274,7 +274,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
           className={ 'ms-PeoplePicker' }
           key={ 'controlled' }
           selectedItems={ this.state.currentSelectedItems }
-          onChange={ this._onItemsChange.bind(this) }
+          onChange={ this._onItemsChange }
           inputProps={ {
             onBlur: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onBlur called'),
             onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called')
@@ -296,6 +296,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     );
   }
 
+  @autobind
   private _onItemsChange(items: any[]) {
     this.setState({
       currentSelectedItems: items
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index 2c160e7f60e10..1cc4a23f9bd6a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -63,7 +63,6 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
 
   constructor(suggestionsProps: ISuggestionsProps<T>) {
     super(suggestionsProps);
-    this._getMoreResults = this._getMoreResults.bind(this);
   }
 
   public componentDidUpdate() {
@@ -125,7 +124,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
             componentRef={ this._resolveRef('_searchForMoreButton') }
             className={ css('ms-SearchMore-button', styles.searchMoreButton) }
             iconProps={ { iconName: 'Search' } }
-            onClick={ this._getMoreResults.bind(this) }
+            onClick={ this._getMoreResults }
             onKeyDown={ this._onKeyDown }
           >
             { searchForMoreText }
@@ -208,6 +207,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
       </div>);
   }
 
+  @autobind
   private _getMoreResults() {
     if (this.props.onGetMoreResults) {
       this.props.onGetMoreResults();
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
index 58e17fe4eac3c..7c8b66c5b41ef 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { autobind } from '../../../Utilities';
 import { FocusZone } from 'office-ui-fabric-react/lib/FocusZone';
 import { SelectionZone } from 'office-ui-fabric-react/lib/DetailsList';
 import {
@@ -331,7 +332,7 @@ export class PickerCustomResultExample extends React.Component<any, IPeoplePicke
   public render() {
     return (
       <div>
-        <Checkbox label='Disable Document Picker' checked={ this.state.isPickerDisabled } onChange={ this._onDisabledButtonClick.bind(this) } />
+        <Checkbox label='Disable Document Picker' checked={ this.state.isPickerDisabled } onChange={ this._onDisabledButtonClick } />
         <DocumentPicker
           onRenderSuggestionsItem={ SuggestedBigItem as any }
           onResolveSuggestions={ this._onFilterChanged }
@@ -354,6 +355,7 @@ export class PickerCustomResultExample extends React.Component<any, IPeoplePicke
     );
   }
 
+  @autobind
   private _onDisabledButtonClick(): void {
     this.setState({
       isPickerDisabled: !this.state.isPickerDisabled
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
index 5851b72517201..24b96f496da30 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { autobind } from '../../../Utilities';
 import { TagPicker } from 'office-ui-fabric-react/lib/components/pickers/TagPicker/TagPicker';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { ITagPickerDemoPageState } from 'office-ui-fabric-react/lib/components/pickers/examples/ITagPickerDemoPageState';
@@ -32,9 +33,9 @@ export class TagPickerBasicExample extends React.Component<{}, ITagPickerDemoPag
   public render() {
     return (
       <div>
-        <Checkbox label='Disable Tag Picker' checked={ this.state.isPickerDisabled } onChange={ this._onDisabledButtonClick.bind(this) } />
+        <Checkbox label='Disable Tag Picker' checked={ this.state.isPickerDisabled } onChange={ this._onDisabledButtonClick } />
         <TagPicker ref='tagPicker'
-          onResolveSuggestions={ this._onFilterChanged.bind(this) }
+          onResolveSuggestions={ this._onFilterChanged }
           getTextFromItem={ (item: any) => { return item.name; } }
           pickerSuggestionsProps={
             {
@@ -54,12 +55,14 @@ export class TagPickerBasicExample extends React.Component<{}, ITagPickerDemoPag
     );
   }
 
+  @autobind
   private _onDisabledButtonClick(): void {
     this.setState({
       isPickerDisabled: !this.state.isPickerDisabled
     });
   }
 
+  @autobind
   private _onFilterChanged(filterText: string, tagList: { key: string, name: string }[]) {
     return filterText ? _testTags.filter(tag => tag.name.toLowerCase().indexOf(filterText.toLowerCase()) === 0).filter(item => !this._listContainsDocument(item, tagList)) : [];
   }
diff --git a/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx b/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx
index bfd0c0042f8b6..6a72b85ff2338 100644
--- a/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx
@@ -20,6 +20,8 @@ export function withContainsFocus<P extends { containsFocus?: boolean }, S>(Comp
 
       this._delayedSetContainsFocus = this._async.debounce(this._setContainsFocus, 20);
       this._updateComposedComponentRef = this._updateComposedComponentRef.bind(this);
+      this._handleFocus = this._handleFocus.bind(this);
+      this._handleBlur = this._handleBlur.bind(this);
     }
 
     public componentWillUnmount() {
@@ -30,7 +32,7 @@ export function withContainsFocus<P extends { containsFocus?: boolean }, S>(Comp
       let { containsFocus } = this.state;
 
       return (
-        <div ref='root' onFocus={ this._handleFocus.bind(this) } onBlur={ this._handleBlur.bind(this) }>
+        <div ref='root' onFocus={ this._handleFocus } onBlur={ this._handleBlur }>
           <ComposedComponent
             ref={ this._updateComposedComponentRef }
             containsFocus={ containsFocus }
diff --git a/packages/office-ui-fabric-react/tslint.json b/packages/office-ui-fabric-react/tslint.json
index 2659ae28c7851..de56775cbc65b 100644
--- a/packages/office-ui-fabric-react/tslint.json
+++ b/packages/office-ui-fabric-react/tslint.json
@@ -8,7 +8,6 @@
     "jsx-key": false,
     "jsx-boolean-value": false,
     "no-unused-variable": false,
-    "jsx-no-bind": false,
     "jsx-no-multiline-js": false,
     "jsx-alignment": false,
     "jsx-wrap-multiline": false,
@@ -30,4 +29,4 @@
       false
     ]
   }
-}
\ No newline at end of file
+}

From 90afb09e5415260469ecb29953f038893649c629 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Fri, 1 Sep 2017 17:07:26 -0700
Subject: [PATCH 0559/1641] Re-enable 'triple-equals' rule in Fabric pkg
 (#2702)

---
 .../src/components/Button/BaseButton.tsx                    | 2 +-
 .../src/components/Calendar/Calendar.tsx                    | 2 +-
 .../src/components/Calendar/CalendarDay.tsx                 | 2 +-
 .../Calendar/examples/Calendar.Inline.Example.tsx           | 6 +++---
 .../office-ui-fabric-react/src/components/Panel/Panel.tsx   | 2 +-
 .../src/utilities/dateMath/DateMath.ts                      | 4 ++--
 packages/office-ui-fabric-react/tslint.json                 | 1 -
 7 files changed, 9 insertions(+), 10 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 7faeac17093d4..b4ed68f61eaa7 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -97,7 +97,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       iconProps && iconProps.className,
       disabled!,
       checked!,
-      this.state.menuProps != null && !this.props.split
+      !!this.state.menuProps && !this.props.split
     );
 
     const { _ariaDescriptionId, _labelId, _descriptionId } = this;
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index 9717400dc6b0c..5aa87718e36e1 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -275,7 +275,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
 
   @autobind
   private _handleEscKey(ev: React.KeyboardEvent<HTMLElement>) {
-    if (this.props.onDismiss != null) {
+    if (this.props.onDismiss) {
       this.props.onDismiss();
     }
   }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index cb5fb3c325b12..394ba0674c32a 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -342,7 +342,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
     let { onSelectDate, dateRangeType, firstDayOfWeek, navigatedDate, autoNavigateOnSelection } = this.props;
 
     let dateRange = getDateRangeArray(selectedDate, dateRangeType, firstDayOfWeek);
-    if (onSelectDate != null) {
+    if (onSelectDate) {
       onSelectDate(selectedDate, dateRange);
     }
 
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
index 07dfd9c920d83..832aaf747a45c 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
@@ -102,7 +102,7 @@ export class CalendarInlineExample extends React.Component<ICalendarInlineExampl
     };
 
     let dateRangeString: string | null = null;
-    if (this.state.selectedDateRange != null) {
+    if (this.state.selectedDateRange) {
       let rangeStart = this.state.selectedDateRange[0];
       let rangeEnd = this.state.selectedDateRange[this.state.selectedDateRange.length - 1];
       dateRangeString = rangeStart.toLocaleDateString() + '-' + rangeEnd.toLocaleDateString();
@@ -111,11 +111,11 @@ export class CalendarInlineExample extends React.Component<ICalendarInlineExampl
     return (
       <div style={ divStyle }>
         { <div>
-          Selected date(s): <span>{ this.state.selectedDate == null ? 'Not set' : this.state.selectedDate.toLocaleString() }</span>
+          Selected date(s): <span>{ !this.state.selectedDate ? 'Not set' : this.state.selectedDate.toLocaleString() }</span>
         </div> }
         <div>
           Selected dates:
-          <span> { dateRangeString == null ? 'Not set' : dateRangeString }</span>
+          <span> { !dateRangeString ? 'Not set' : dateRangeString }</span>
         </div>
         <Calendar
           onSelectDate={ this._onSelectDate }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
index ed03c2dfaf5ba..fee4d44ec4a58 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
@@ -261,7 +261,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
   private _onRenderFooter(props: IPanelProps): JSX.Element | null {
     let { isFooterSticky } = this.state;
     let { onRenderFooterContent = null } = this.props;
-    if (onRenderFooterContent != null) {
+    if (onRenderFooterContent) {
       return (
         <div className={ css('ms-Panel-footer', styles.footer, isFooterSticky && styles.footerIsSticky) } >
           <div className={ css('ms-Panel-footerInner', styles.footerInner) }>
diff --git a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
index dc558d624e91c..ce35a7390df7b 100644
--- a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
+++ b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
@@ -86,9 +86,9 @@ export function setMonth(date: Date, month: number): Date {
  * @return {boolean} True if the two dates represent the same date (regardless of time-of-day), false otherwise.
  */
 export function compareDates(date1: Date, date2: Date): boolean {
-  if (date1 == null && date2 == null) {
+  if (!date1 && !date2) {
     return true;
-  } else if (date1 == null || date2 == null) {
+  } else if (!date1 || !date2) {
     return false;
   } else {
     return (date1.getFullYear() === date2.getFullYear()
diff --git a/packages/office-ui-fabric-react/tslint.json b/packages/office-ui-fabric-react/tslint.json
index de56775cbc65b..7d0ae3b7798f4 100644
--- a/packages/office-ui-fabric-react/tslint.json
+++ b/packages/office-ui-fabric-react/tslint.json
@@ -3,7 +3,6 @@
     "office-ui-fabric-react-tslint"
   ],
   "rules": {
-    "triple-equals": false,
     "jsx-no-string-ref": false,
     "jsx-key": false,
     "jsx-boolean-value": false,

From 54e7d928b4e4dfe9b1817fdfbbde6c00b7e46cdc Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 1 Sep 2017 17:35:06 -0700
Subject: [PATCH 0560/1641] Unbreaking the build. It seems that a merge
 conflict made it through.

---
 packages/experiments/webpack.config.js        |   2 +-
 .../src/components/Calendar/CalendarDay.tsx   | 208 +++++++++---------
 2 files changed, 105 insertions(+), 105 deletions(-)

diff --git a/packages/experiments/webpack.config.js b/packages/experiments/webpack.config.js
index 651d805482d27..03853809cfc19 100644
--- a/packages/experiments/webpack.config.js
+++ b/packages/experiments/webpack.config.js
@@ -14,7 +14,7 @@ module.exports = resources.createConfig(
 
     output: {
       libraryTarget: 'var',
-      library: 'Fabric'
+      library: 'FabricExperiments'
     },
 
     externals: [
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index 394ba0674c32a..fd0dd1cb40da9 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -106,109 +106,109 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
 
     return (
       <div className={ css('ms-DatePicker-dayPicker', styles.dayPicker) } id={ dayPickerId }>
-      <div className={ css('ms-DatePicker-monthComponents', styles.monthComponents) }>
-        <div className={ css('ms-DatePicker-navContainer', styles.navContainer) }>
-          <span
-            className={ css('ms-DatePicker-prevMonth js-prevMonth', styles.prevMonth) }
-            onClick={ this._onSelectPrevMonth }
-            onKeyDown={ this._onPrevMonthKeyDown }
-            aria-controls={ dayPickerId }
-            aria-label={ strings.prevMonthAriaLabel }
-            role='button'
-            tabIndex={ 0 }>
-            <Icon iconName={ getRTL() ? rightNavigationIcon : leftNavigationIcon } />
-          </span >
-          <span
-            className={ css('ms-DatePicker-nextMonth js-nextMonth', styles.nextMonth) }
-            onClick={ this._onSelectNextMonth }
-            onKeyDown={ this._onNextMonthKeyDown }
-            aria-controls={ dayPickerId }
-            aria-label={ strings.nextMonthAriaLabel }
-            role='button'
-            tabIndex={ 0 }>
-            <Icon iconName={ getRTL() ? leftNavigationIcon : rightNavigationIcon } />
-          </span >
+        <div className={ css('ms-DatePicker-monthComponents', styles.monthComponents) }>
+          <div className={ css('ms-DatePicker-navContainer', styles.navContainer) }>
+            <span
+              className={ css('ms-DatePicker-prevMonth js-prevMonth', styles.prevMonth) }
+              onClick={ this._onSelectPrevMonth }
+              onKeyDown={ this._onPrevMonthKeyDown }
+              aria-controls={ dayPickerId }
+              aria-label={ strings.prevMonthAriaLabel }
+              role='button'
+              tabIndex={ 0 }>
+              <Icon iconName={ getRTL() ? rightNavigationIcon : leftNavigationIcon } />
+            </span >
+            <span
+              className={ css('ms-DatePicker-nextMonth js-nextMonth', styles.nextMonth) }
+              onClick={ this._onSelectNextMonth }
+              onKeyDown={ this._onNextMonthKeyDown }
+              aria-controls={ dayPickerId }
+              aria-label={ strings.nextMonthAriaLabel }
+              role='button'
+              tabIndex={ 0 }>
+              <Icon iconName={ getRTL() ? leftNavigationIcon : rightNavigationIcon } />
+            </span >
+          </div >
         </div >
-      </div >
         <div className={ css('ms-DatePicker-header', styles.header) } >
-        <div aria-live='polite' aria-relevant='text' aria-atomic='true' id={ monthAndYearId }>
-          <div className={ css('ms-DatePicker-monthAndYear', styles.monthAndYear) }>{ dateTimeFormatter.formatMonthYear(navigatedDate, strings) }</div>
+          <div aria-live='polite' aria-relevant='text' aria-atomic='true' id={ monthAndYearId }>
+            <div className={ css('ms-DatePicker-monthAndYear', styles.monthAndYear) }>{ dateTimeFormatter.formatMonthYear(navigatedDate, strings) }</div>
+          </div>
+          {
+            this.props.onHeaderSelect ?
+              <div
+                className={ css('ms-DatePicker-headerToggleView js-showMonthPicker', styles.headerToggleView) }
+                onClick={ this._onHeaderSelect }
+                onKeyDown={ this._onHeaderKeyDown }
+                aria-label={ dateTimeFormatter.formatMonthYear(navigatedDate, strings) }
+                role='button'
+                tabIndex={ 0 }
+              />
+              :
+              null
+          }
         </div>
-        {
-          this.props.onHeaderSelect ?
-            <div
-              className={ css('ms-DatePicker-headerToggleView js-showMonthPicker', styles.headerToggleView) }
-              onClick={ this._onHeaderSelect }
-              onKeyDown={ this._onHeaderKeyDown }
-              aria-label={ dateTimeFormatter.formatMonthYear(navigatedDate, strings) }
-              role='button'
-              tabIndex={ 0 }
-            />
-            :
-            null
-        }
-      </div>
-      <FocusZone>
-        <table
-          className={ css('ms-DatePicker-table', styles.table) }
-          aria-readonly='true'
-          aria-multiselectable='false'
-          aria-labelledby={ monthAndYearId }
-          aria-activedescendant={ activeDescendantId }
-        >
-          <thead>
-            <tr>
-              { strings.shortDays.map((val, index) =>
-                <th
-                  className={ css('ms-DatePicker-weekday', styles.weekday) }
-                  scope='col'
-                  key={ index }
-                  title={ strings.days[(index + firstDayOfWeek) % DAYS_IN_WEEK] }
-                  aria-label={ strings.days[(index + firstDayOfWeek) % DAYS_IN_WEEK] }>
-                  { strings.shortDays[(index + firstDayOfWeek) % DAYS_IN_WEEK] }
-                </th>) }
-            </tr>
-          </thead>
-          <tbody>
-            { weeks!.map((week, weekIndex) =>
-              <tr key={ weekIndex } >
-                { week.map((day, dayIndex) =>
-                  <td key={ day.key } className={ css(
-                    {
-                      ['ms-DatePicker-weekBackground ' + styles.weekBackground]: day.isSelected && dateRangeType === DateRangeType.Week,
-                      ['ms-DatePicker-monthBackground ' + styles.monthBackground + ' ' + this._getHighlightedCornerStyle(weekCorners, dayIndex, weekIndex)]: day.isInMonth && day.isSelected && dateRangeType === DateRangeType.Month,
-                      ['ms-DatePicker-dayBackground ' + styles.dayBackground]: day.isSelected && dateRangeType === DateRangeType.Day
-                    }) }
-                  >
-                    <div
-                      className={ css(
-                        'ms-DatePicker-day',
-                        styles.day,
-                        {
-                          ['ms-DatePicker-day--infocus ' + styles.dayIsFocused]: day.isInMonth,
-                          ['ms-DatePicker-day--outfocus ' + styles.dayIsUnfocused]: !day.isInMonth,
-                          ['ms-DatePicker-day--today ' + styles.dayIsToday]: day.isToday,
-                          ['ms-DatePicker-day--highlighted ' + styles.dayIsHighlighted]: day.isSelected && dateRangeType === DateRangeType.Day
-                        }) }
-                      role='button'
-                      onClick={ day.onSelected }
-                      onKeyDown={ (ev: React.KeyboardEvent<HTMLElement>) =>
-                        this._navigateMonthEdge(ev, day.originalDate, weekIndex, dayIndex) }
-                      aria-selected={ day.isSelected }
-                      aria-label={ dateTimeFormatter.formatMonthDayYear(day.originalDate, strings) }
-                      id={ compareDates(navigatedDate, day.originalDate) ? activeDescendantId : undefined }
-                      data-is-focusable={ true }
-                      ref={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : undefined }
-                      key={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : undefined } >
-                      <span aria-hidden='true'>{ dateTimeFormatter.formatDay(day.originalDate) }</span>
-                    </div>
-                  </td>
-                ) }
+        <FocusZone>
+          <table
+            className={ css('ms-DatePicker-table', styles.table) }
+            aria-readonly='true'
+            aria-multiselectable='false'
+            aria-labelledby={ monthAndYearId }
+            aria-activedescendant={ activeDescendantId }
+          >
+            <thead>
+              <tr>
+                { strings.shortDays.map((val, index) =>
+                  <th
+                    className={ css('ms-DatePicker-weekday', styles.weekday) }
+                    scope='col'
+                    key={ index }
+                    title={ strings.days[(index + firstDayOfWeek) % DAYS_IN_WEEK] }
+                    aria-label={ strings.days[(index + firstDayOfWeek) % DAYS_IN_WEEK] }>
+                    { strings.shortDays[(index + firstDayOfWeek) % DAYS_IN_WEEK] }
+                  </th>) }
               </tr>
-            ) }
-          </tbody>
-        </table>
-      </FocusZone>
+            </thead>
+            <tbody>
+              { weeks!.map((week, weekIndex) =>
+                <tr key={ weekIndex } >
+                  { week.map((day, dayIndex) =>
+                    <td key={ day.key } className={ css(
+                      {
+                        ['ms-DatePicker-weekBackground ' + styles.weekBackground]: day.isSelected && dateRangeType === DateRangeType.Week,
+                        ['ms-DatePicker-monthBackground ' + styles.monthBackground + ' ' + this._getHighlightedCornerStyle(weekCorners, dayIndex, weekIndex)]: day.isInMonth && day.isSelected && dateRangeType === DateRangeType.Month,
+                        ['ms-DatePicker-dayBackground ' + styles.dayBackground]: day.isSelected && dateRangeType === DateRangeType.Day
+                      }) }
+                    >
+                      <div
+                        className={ css(
+                          'ms-DatePicker-day',
+                          styles.day,
+                          {
+                            ['ms-DatePicker-day--infocus ' + styles.dayIsFocused]: day.isInMonth,
+                            ['ms-DatePicker-day--outfocus ' + styles.dayIsUnfocused]: !day.isInMonth,
+                            ['ms-DatePicker-day--today ' + styles.dayIsToday]: day.isToday,
+                            ['ms-DatePicker-day--highlighted ' + styles.dayIsHighlighted]: day.isSelected && dateRangeType === DateRangeType.Day
+                          }) }
+                        role='button'
+                        onClick={ day.onSelected }
+                        onKeyDown={ (ev: React.KeyboardEvent<HTMLElement>) =>
+                          this._navigateMonthEdge(ev, day.originalDate, weekIndex, dayIndex) }
+                        aria-selected={ day.isSelected }
+                        aria-label={ dateTimeFormatter.formatMonthDayYear(day.originalDate, strings) }
+                        id={ compareDates(navigatedDate, day.originalDate) ? activeDescendantId : undefined }
+                        data-is-focusable={ true }
+                        ref={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : undefined }
+                        key={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : undefined } >
+                        <span aria-hidden='true'>{ dateTimeFormatter.formatDay(day.originalDate) }</span>
+                      </div>
+                    </td>
+                  ) }
+                </tr>
+              ) }
+            </tbody>
+          </table>
+        </FocusZone>
       </div >
     );
   }
@@ -251,20 +251,20 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
     let cornersLength = cornerIndexes.length;
     if (cornersLength > 0) {
 
-      if (cornersLength == 1) {
+      if (cornersLength === 1) {
 
         weekCornersStyled[weekIndex + '_' + cornerIndexes[0]] = singleCornerStyle;
 
-      } else if (cornersLength == 2) {
+      } else if (cornersLength === 2) {
 
         weekCornersStyled[weekIndex + '_' + cornerIndexes[0]] = leftCornerStyle;
         weekCornersStyled[weekIndex + '_' + cornerIndexes[1]] = rightCornerStyle;
       }
 
-      if (weekIndex == 0) {
+      if (weekIndex === 0) {
 
         // check if second week needs corner styles
-        if (cornerIndexes[0] != 0) {
+        if (cornerIndexes[0] !== 0) {
           weekCornersStyled['1_0'] = leftCornerStyle;
         }
 
@@ -272,7 +272,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
 
         // Assume we are on the last week. Check if second-to-last week needs corner styles
         let lastDayIndex = DAYS_IN_WEEK - 1;
-        if (cornerIndexes[cornersLength - 1] != lastDayIndex) {
+        if (cornerIndexes[cornersLength - 1] !== lastDayIndex) {
           weekCornersStyled[(weekIndex - 1) + '_' + lastDayIndex] = rightCornerStyle;
         }
 

From 7836034345ccf0f347adece0c2c20ba5d63ddcf7 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Fri, 1 Sep 2017 17:36:21 -0700
Subject: [PATCH 0561/1641] Update shrinkwrap to get example-app-base RTL fixes
 (#2716)

* Update minimum version of fabric required for example-app-base. Run rush generate.

* Rush change
---
 ...xample-app-base-deps_2017-09-01-18-33.json |  11 +
 common/config/rush/npm-shrinkwrap.json        | 630 ++++++++++++++++--
 packages/example-app-base/package.json        |   2 +-
 3 files changed, 595 insertions(+), 48 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/update-example-app-base-deps_2017-09-01-18-33.json

diff --git a/common/changes/@uifabric/example-app-base/update-example-app-base-deps_2017-09-01-18-33.json b/common/changes/@uifabric/example-app-base/update-example-app-base-deps_2017-09-01-18-33.json
new file mode 100644
index 0000000000000..1a4ef166cef2b
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/update-example-app-base-deps_2017-09-01-18-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Update fabric-dependency version",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index d93b33b49876b..c856623b9866e 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -14,7 +14,7 @@
       "integrity": "sha1-Y1VyRApbBFYM35zrC7OKTVbGSfQ="
     },
     "@rush-temp/build": {
-      "version": "file:projects/build",
+      "version": "file:projects\\build",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -347,7 +347,7 @@
       }
     },
     "@rush-temp/example-app-base": {
-      "version": "file:projects/example-app-base",
+      "version": "file:projects\\example-app-base",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -582,7 +582,7 @@
       }
     },
     "@rush-temp/experiments": {
-      "version": "file:projects/experiments",
+      "version": "file:projects\\experiments",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -833,7 +833,7 @@
       }
     },
     "@rush-temp/fabric-website": {
-      "version": "file:projects/fabric-website",
+      "version": "file:projects\\fabric-website",
       "dependencies": {
         "@types/react-addons-test-utils": {
           "version": "0.14.19",
@@ -1080,7 +1080,7 @@
       }
     },
     "@rush-temp/merge-styles": {
-      "version": "file:projects/merge-styles",
+      "version": "file:projects\\merge-styles",
       "dependencies": {
         "commander": {
           "version": "2.9.0",
@@ -1109,7 +1109,7 @@
       }
     },
     "@rush-temp/office-ui-fabric-react": {
-      "version": "file:projects/office-ui-fabric-react",
+      "version": "file:projects\\office-ui-fabric-react",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1360,10 +1360,10 @@
       }
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
-      "version": "file:projects/office-ui-fabric-react-tslint"
+      "version": "file:projects\\office-ui-fabric-react-tslint"
     },
     "@rush-temp/ssr-tests": {
-      "version": "file:projects/ssr-tests",
+      "version": "file:projects\\ssr-tests",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1592,7 +1592,7 @@
       }
     },
     "@rush-temp/styling": {
-      "version": "file:projects/styling",
+      "version": "file:projects\\styling",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1787,7 +1787,7 @@
       }
     },
     "@rush-temp/test-bundle-button": {
-      "version": "file:projects/test-bundle-button",
+      "version": "file:projects\\test-bundle-button",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1956,10 +1956,10 @@
       }
     },
     "@rush-temp/todo-app": {
-      "version": "file:projects/todo-app"
+      "version": "file:projects\\todo-app"
     },
     "@rush-temp/utilities": {
-      "version": "file:projects/utilities",
+      "version": "file:projects\\utilities",
       "dependencies": {
         "commander": {
           "version": "2.9.0",
@@ -2072,19 +2072,19 @@
       "integrity": "sha1-MEQ4FkfhHulzxa8uklMjkw9pHYA="
     },
     "@uifabric/example-app-base": {
-      "version": "4.2.5",
-      "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-4.2.5.tgz",
-      "integrity": "sha512-o18n/zKj8KTQ2JDHBoQtjUPRJkd0I3lwAK017+3UlA/Suh0V3AxjfXSN+4v1hq7SAcjTnoaMctJ0q+ux+/61ww=="
+      "version": "4.2.6",
+      "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-4.2.6.tgz",
+      "integrity": "sha512-rRhD4dnpSklqMQs6zofsaFG5iYn0fahqWYG+TfdtNVFqrj9CyDBxzuRDE2VwVRDUn5qjQNT0h7rw21Hdrl0+Lg=="
     },
     "@uifabric/styling": {
-      "version": "0.21.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.21.1.tgz",
-      "integrity": "sha512-SlQwGCtqnN7SIklqi534nLMTVfjLkaK1QGmTxGq5BQutz/tiJNVIJ7hVuRMNI669TNu0Gf+nkIFPcEn56DxavQ=="
+      "version": "0.22.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.22.0.tgz",
+      "integrity": "sha512-tmILPrBGdaUBcbK+hebGN52wk2X37Wh+t3seik8lsWYx5rB/mSJuaM2AI747HhHZnubP2WhgRDJ/gLvlKWUiiQ=="
     },
     "@uifabric/utilities": {
-      "version": "4.12.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.12.0.tgz",
-      "integrity": "sha512-Udgu19qBxsT+s5Z50OhM/tMAok3WBlB6lUkxVjs8W8ZeGkPefqp5T6vb5o4pKZNrjM4poYDVVBe3veJTmEXR2Q=="
+      "version": "4.12.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.12.1.tgz",
+      "integrity": "sha512-X1CcA36VLiIQmGAgxV8F4R/PZ9yDwZS6NB65H19koMAfHGJaFniQTtNm0fBNEIJTLXToFzSloMuWXkacIXFh0w=="
     },
     "abab": {
       "version": "1.0.3",
@@ -2830,9 +2830,9 @@
       }
     },
     "chai": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/chai/-/chai-4.1.1.tgz",
-      "integrity": "sha1-ZuISeebzxkFf+CMYeCJ5AOIXGzk="
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/chai/-/chai-4.1.2.tgz",
+      "integrity": "sha1-D2RYS6ZC8PKs4oBiefTwbKI61zw="
     },
     "chalk": {
       "version": "2.1.0",
@@ -3410,16 +3410,9 @@
       "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA="
     },
     "deep-eql": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-2.0.2.tgz",
-      "integrity": "sha1-sbrAblbwp2d3aG1Qyf63XC7XZ5o=",
-      "dependencies": {
-        "type-detect": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-3.0.0.tgz",
-          "integrity": "sha1-RtDMhVOrt7E6NSsNbeov1Y8tm1U="
-        }
-      }
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-3.0.0.tgz",
+      "integrity": "sha512-9zef2MtjASSE1Pts2Nm6Yh5MTVdVh+s4Qt/e+jPV6qTBhqTc0WOEaWnLvLKGxky0gwZGmcY6TnUqyCD6fNs5Lg=="
     },
     "deep-equal": {
       "version": "1.0.1",
@@ -3587,9 +3580,9 @@
       "integrity": "sha1-zIcsFoiArjxxiXYv1f/ACJbJUYo="
     },
     "electron-to-chromium": {
-      "version": "1.3.19",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.19.tgz",
-      "integrity": "sha1-c9l7DosFqnds7fPNzn/cBTgDdnU="
+      "version": "1.3.20",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.20.tgz",
+      "integrity": "sha1-Lu3VzLrn3cVX9orR/OnBcukV5OU="
     },
     "elliptic": {
       "version": "6.4.0",
@@ -4157,6 +4150,549 @@
       "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
       "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
     },
+    "fsevents": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.2.tgz",
+      "integrity": "sha512-Sn44E5wQW4bTHXvQmvSHwqbuiXtduD6Rrjm2ZtUEGbyrig+nUH3t/QD4M4/ZXViY556TBpRgZkHLDx3JxPwxiw==",
+      "optional": true,
+      "dependencies": {
+        "abbrev": {
+          "version": "1.1.0",
+          "bundled": true,
+          "optional": true
+        },
+        "ajv": {
+          "version": "4.11.8",
+          "bundled": true,
+          "optional": true
+        },
+        "ansi-regex": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "aproba": {
+          "version": "1.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "are-we-there-yet": {
+          "version": "1.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "asn1": {
+          "version": "0.2.3",
+          "bundled": true,
+          "optional": true
+        },
+        "assert-plus": {
+          "version": "0.2.0",
+          "bundled": true,
+          "optional": true
+        },
+        "asynckit": {
+          "version": "0.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "aws-sign2": {
+          "version": "0.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "aws4": {
+          "version": "1.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "balanced-match": {
+          "version": "0.4.2",
+          "bundled": true
+        },
+        "bcrypt-pbkdf": {
+          "version": "1.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "block-stream": {
+          "version": "0.0.9",
+          "bundled": true
+        },
+        "boom": {
+          "version": "2.10.1",
+          "bundled": true
+        },
+        "brace-expansion": {
+          "version": "1.1.7",
+          "bundled": true
+        },
+        "buffer-shims": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "caseless": {
+          "version": "0.12.0",
+          "bundled": true,
+          "optional": true
+        },
+        "co": {
+          "version": "4.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "code-point-at": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "combined-stream": {
+          "version": "1.0.5",
+          "bundled": true
+        },
+        "concat-map": {
+          "version": "0.0.1",
+          "bundled": true
+        },
+        "console-control-strings": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "core-util-is": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "cryptiles": {
+          "version": "2.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "dashdash": {
+          "version": "1.14.1",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "debug": {
+          "version": "2.6.8",
+          "bundled": true,
+          "optional": true
+        },
+        "deep-extend": {
+          "version": "0.4.2",
+          "bundled": true,
+          "optional": true
+        },
+        "delayed-stream": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "delegates": {
+          "version": "1.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "ecc-jsbn": {
+          "version": "0.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "extend": {
+          "version": "3.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "extsprintf": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "forever-agent": {
+          "version": "0.6.1",
+          "bundled": true,
+          "optional": true
+        },
+        "form-data": {
+          "version": "2.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "fs.realpath": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "fstream": {
+          "version": "1.0.11",
+          "bundled": true
+        },
+        "fstream-ignore": {
+          "version": "1.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "gauge": {
+          "version": "2.7.4",
+          "bundled": true,
+          "optional": true
+        },
+        "getpass": {
+          "version": "0.1.7",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "glob": {
+          "version": "7.1.2",
+          "bundled": true
+        },
+        "graceful-fs": {
+          "version": "4.1.11",
+          "bundled": true
+        },
+        "har-schema": {
+          "version": "1.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "har-validator": {
+          "version": "4.2.1",
+          "bundled": true,
+          "optional": true
+        },
+        "has-unicode": {
+          "version": "2.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "hawk": {
+          "version": "3.1.3",
+          "bundled": true,
+          "optional": true
+        },
+        "hoek": {
+          "version": "2.16.3",
+          "bundled": true
+        },
+        "http-signature": {
+          "version": "1.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "inflight": {
+          "version": "1.0.6",
+          "bundled": true
+        },
+        "inherits": {
+          "version": "2.0.3",
+          "bundled": true
+        },
+        "ini": {
+          "version": "1.3.4",
+          "bundled": true,
+          "optional": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "is-typedarray": {
+          "version": "1.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "isstream": {
+          "version": "0.1.2",
+          "bundled": true,
+          "optional": true
+        },
+        "jodid25519": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "jsbn": {
+          "version": "0.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "json-schema": {
+          "version": "0.2.3",
+          "bundled": true,
+          "optional": true
+        },
+        "json-stable-stringify": {
+          "version": "1.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "json-stringify-safe": {
+          "version": "5.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "jsonify": {
+          "version": "0.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "jsprim": {
+          "version": "1.4.0",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "mime-db": {
+          "version": "1.27.0",
+          "bundled": true
+        },
+        "mime-types": {
+          "version": "2.1.15",
+          "bundled": true
+        },
+        "minimatch": {
+          "version": "3.0.4",
+          "bundled": true
+        },
+        "minimist": {
+          "version": "0.0.8",
+          "bundled": true
+        },
+        "mkdirp": {
+          "version": "0.5.1",
+          "bundled": true
+        },
+        "ms": {
+          "version": "2.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "node-pre-gyp": {
+          "version": "0.6.36",
+          "bundled": true,
+          "optional": true
+        },
+        "nopt": {
+          "version": "4.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "npmlog": {
+          "version": "4.1.0",
+          "bundled": true,
+          "optional": true
+        },
+        "number-is-nan": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "oauth-sign": {
+          "version": "0.8.2",
+          "bundled": true,
+          "optional": true
+        },
+        "object-assign": {
+          "version": "4.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "once": {
+          "version": "1.4.0",
+          "bundled": true
+        },
+        "os-homedir": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "os-tmpdir": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "osenv": {
+          "version": "0.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "path-is-absolute": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "performance-now": {
+          "version": "0.2.0",
+          "bundled": true,
+          "optional": true
+        },
+        "process-nextick-args": {
+          "version": "1.0.7",
+          "bundled": true
+        },
+        "punycode": {
+          "version": "1.4.1",
+          "bundled": true,
+          "optional": true
+        },
+        "qs": {
+          "version": "6.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "rc": {
+          "version": "1.2.1",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "minimist": {
+              "version": "1.2.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "bundled": true
+        },
+        "request": {
+          "version": "2.81.0",
+          "bundled": true,
+          "optional": true
+        },
+        "rimraf": {
+          "version": "2.6.1",
+          "bundled": true
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "bundled": true
+        },
+        "semver": {
+          "version": "5.3.0",
+          "bundled": true,
+          "optional": true
+        },
+        "set-blocking": {
+          "version": "2.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "signal-exit": {
+          "version": "3.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "sntp": {
+          "version": "1.0.9",
+          "bundled": true,
+          "optional": true
+        },
+        "sshpk": {
+          "version": "1.13.0",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "string_decoder": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "string-width": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "stringstream": {
+          "version": "0.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "strip-ansi": {
+          "version": "3.0.1",
+          "bundled": true
+        },
+        "strip-json-comments": {
+          "version": "2.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "tar": {
+          "version": "2.2.1",
+          "bundled": true
+        },
+        "tar-pack": {
+          "version": "3.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "tough-cookie": {
+          "version": "2.3.2",
+          "bundled": true,
+          "optional": true
+        },
+        "tunnel-agent": {
+          "version": "0.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "tweetnacl": {
+          "version": "0.14.5",
+          "bundled": true,
+          "optional": true
+        },
+        "uid-number": {
+          "version": "0.0.6",
+          "bundled": true,
+          "optional": true
+        },
+        "util-deprecate": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "uuid": {
+          "version": "3.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "verror": {
+          "version": "1.3.6",
+          "bundled": true,
+          "optional": true
+        },
+        "wide-align": {
+          "version": "1.1.2",
+          "bundled": true,
+          "optional": true
+        },
+        "wrappy": {
+          "version": "1.0.2",
+          "bundled": true
+        }
+      }
+    },
     "fstream": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
@@ -6475,9 +7011,9 @@
       "integrity": "sha1-JKwXdDPkou6REP5DWAutBZ+gBQk="
     },
     "office-ui-fabric-react": {
-      "version": "4.38.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.38.0.tgz",
-      "integrity": "sha512-xrPQzOcv8uud2MgFkNi2yNMUuv66Iv1j+xb1T5N1G2XzZBtGkwk/2Zeg6x6ZndYKVJffY2FlXW6PvMZOh14Kjw=="
+      "version": "4.39.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.39.0.tgz",
+      "integrity": "sha512-KGLv63POjuVgUm9+uITzCSX1z6XDDWs0b1Z22jMEWa9IR8B/SYTXyQ+24u1zdr0zeRKr58NPXNOwd3YK7AbBvg=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -8057,9 +8593,9 @@
       "integrity": "sha512-/aA0kLeRb5N9K0d4fw7ooEbI+xDe+DKD499EQqygGqeS8N3xto15p09uY2xj7ixP81sNPXvRLnAQIqdVStgb1A=="
     },
     "regex-cache": {
-      "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.3.tgz",
-      "integrity": "sha1-mxpsNdTQ3871cRrmUejp09cRQUU="
+      "version": "0.4.4",
+      "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.4.tgz",
+      "integrity": "sha512-nVIZwtCjkC9YgvWkpM55B5rBhBYRZhAaJbgcFYXXsHnbZ9UZI9nnVWYZpBlCqv9ho2eZryPnWrZGsOdPwVWXWQ=="
     },
     "regex-not": {
       "version": "1.0.0",
@@ -8946,9 +9482,9 @@
       "integrity": "sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM="
     },
     "ts-jest": {
-      "version": "20.0.13",
-      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-20.0.13.tgz",
-      "integrity": "sha512-GWQSJxQg9EOwQ81oWZTAh39SdKFaNVelPBbxRPRa9Mjly0jFbYIw0upk3Vfohtnd5RjEa3BdPBc+nA95cayTzQ==",
+      "version": "20.0.14",
+      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-20.0.14.tgz",
+      "integrity": "sha512-aygKypLeCKVCpAqxEjpE5j4y4lBbh14UU+puQk/LcH3yBT0nRFQs0NzQoE6vgxhg6p1kl4Q5BkfiJdnuGwzqIg==",
       "dependencies": {
         "ansi-regex": {
           "version": "3.0.0",
@@ -9693,4 +10229,4 @@
       "integrity": "sha1-AI4G2AlDIMNy28L47XagymyKxBk="
     }
   }
-}
\ No newline at end of file
+}
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index b8e1f1348995d..1958f0d195f7d 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -37,7 +37,7 @@
   },
   "dependencies": {
     "highlight.js": "^9.9.0",
-    "office-ui-fabric-react": ">=4.38.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.39.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file

From 0dabdf36b003831b8c36b7d3174f4bcdfdfd2261 Mon Sep 17 00:00:00 2001
From: zhangjingjingbupt <30819290+zhangjingjingbupt@users.noreply.github.com>
Date: Sat, 2 Sep 2017 14:27:39 +0800
Subject: [PATCH 0562/1641] Slider: add vertical rendering mode (#2529)

* temp

* add vertical slider

* add options members

* add change file

* Update Slider.tsx

fixed some linting errors

* change top to be max; fix some error

* Update Slider.Props.ts

* fix sass

* clean up code

* fix comment

* Update t-zhajin-addverticalslider_2017-08-17-02-27.json

* fix comment

* Update Slider.tsx

* Update Slider.tsx
---
 ...in-addverticalslider_2017-08-17-02-27.json |  11 ++
 .../src/components/Slider/Slider.Props.ts     |  13 +-
 .../src/components/Slider/Slider.scss         | 141 ++++++++++++------
 .../src/components/Slider/Slider.tsx          |  69 ++++++---
 .../Slider/examples/Slider.Basic.Example.scss |  15 +-
 .../Slider/examples/Slider.Basic.Example.tsx  |  92 ++++++++----
 6 files changed, 240 insertions(+), 101 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/t-zhajin-addverticalslider_2017-08-17-02-27.json

diff --git a/common/changes/office-ui-fabric-react/t-zhajin-addverticalslider_2017-08-17-02-27.json b/common/changes/office-ui-fabric-react/t-zhajin-addverticalslider_2017-08-17-02-27.json
new file mode 100644
index 0000000000000..308575bd9ab93
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/t-zhajin-addverticalslider_2017-08-17-02-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Slider: adding `vertical` property to render as a vertical slider.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "t-zhajin@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.Props.ts b/packages/office-ui-fabric-react/src/components/Slider/Slider.Props.ts
index 0335797db4947..888ff777591a8 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.Props.ts
@@ -43,14 +43,14 @@ export interface ISliderProps {
   max?: number;
 
   /**
-   * The diffrrence between the two adjacent values of the Slider
+   * The difference between the two adjacent values of the Slider
    * @default 1
    */
   step?: number;
 
   /**
    * Whether to show the value on the right of the Slider.
-   * If you want to show the value by yourself, you may want to set this value to false.
+   * @default true
    */
   showValue?: boolean;
 
@@ -65,12 +65,17 @@ export interface ISliderProps {
   ariaLabel?: string;
 
   /**
-   * Whether or not the Slider is disabled.
+   * Optional flag to render the slider vertically. Defaults to rendering horizontal.
+   */
+  vertical?: boolean;
+
+  /**
+   * Optional flag to render the Slider as disabled.
    */
   disabled?: boolean;
 
   /**
-  * Optional className for slider.
+  * Optional className to attach to the slider root element.
   */
   className?: string;
 
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.scss b/packages/office-ui-fabric-react/src/components/Slider/Slider.scss
index d01a99107ecc5..3f400ed7d7a69 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.scss
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.scss
@@ -7,20 +7,112 @@
 
 .titleLabel {
   padding: 0;
-}
+ }
 
 .line {
   display: flex;
   position: relative;
-  width: 100%;
 }
 
-.line span {
-  height: 4px;
+.line .lineContainer {
   border-radius: 4px;
   box-sizing: border-box;
 }
 
+.container {
+  display: flex;
+  flex-wrap: nowrap;
+  align-items: center;
+}
+
+.valueLabel {
+  flex-shrink: 1;
+  width: 30px;
+  line-height: 1;
+}
+
+.slideBox {
+  @include focus-border();
+  background: transparent;
+  border: none;
+  flex-grow: 1;
+  line-height: 28px;
+}
+
+.slideBox .thumb {
+  border: 2px solid $ms-color-neutralSecondary;
+  box-sizing: border-box;
+  background: $ms-color-white;
+  display: block;
+  width: 16px;
+  height: 16px;
+  position: absolute;
+  border-radius: 10px;
+}
+
+.rootIsHorizontal {
+  .line {
+    width: 100%;
+  }
+
+  .line .lineContainer {
+    height: 4px;
+  }
+
+  .slideBox {
+    height: 28px;
+    padding: 0 8px; // Make room for thumb at ends of line
+  }
+
+  .slideBox .thumb {
+    top: -6px;
+    @include transform-translateX(-50%);
+  }
+
+  .valueLabel {
+    margin: 0 8px;
+  }
+}
+
+.rootIsVertical {
+  margin-right: 8px;
+
+  .line {
+    height: 100%;
+    width: 4px;
+    margin: 0 auto;
+    flex-direction: column-reverse;
+  }
+
+  .line .lineContainer {
+    width: 4px;
+    height: 100%;
+  }
+
+  .slideBox {
+    height: 100%;
+    width: 28px;
+    padding: 8px 0; // Make room for thumb at bottom of line
+  }
+
+  .slideBox .thumb {
+    left: -6px;
+    margin: 0 auto;
+    transform: translateY(8px);
+  }
+
+  .container {
+    flex-direction: column;
+    height: 100%;
+    text-align: center;
+    margin: 8px 0;
+  }
+
+  .valueLabel {
+    margin: 0 auto;
+  }
+}
+
 .activeSection {
   background: $ms-color-neutralSecondary;
 
@@ -55,47 +147,6 @@
     transition: width $ms-animation-duration-3 $ms-animation-ease-1;
   }
 }
-.slideBox {
-  background: transparent;
-  border: none;
-  padding: 0;
-  margin: 0;
-}
-
-.slideBox .thumb {
-  border: 2px solid $ms-color-neutralSecondary;
-  box-sizing: border-box;
-  background: $ms-color-white;
-  display: block;
-  width: 16px;
-  height: 16px;
-  position: absolute;
-  top: -6px;
-  border-radius: 10px;
-  @include transform-translateX(-50%);
-}
-
-.container {
-  display: flex;
-  align-items: center;
-  flex-wrap: nowrap;
-}
-
-
-.slideBox {
-  @include focus-border();
-  flex-grow: 1;
-  height: 28px;
-  line-height: 28px;
-  padding: 0 8px; // Make room for thumb at ends of line
-}
-
-.valueLabel {
-  flex-shrink: 1;
-  width: 30px;
-  margin: 0 8px;
-  line-height: 1;
-}
 
 .rootIsEnabled {
 
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
index f4bbd77ccd771..f48ac4204cf58 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
@@ -30,6 +30,7 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     max: 10,
     showValue: true,
     disabled: false,
+    vertical: false,
     buttonProps: {}
   };
 
@@ -83,11 +84,12 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
       max,
       min,
       showValue,
-      buttonProps
+      buttonProps,
+      vertical
     } = this.props;
     const { value, renderedValue } = this.state;
     const thumbOffsetPercent: number = (renderedValue! - min!) / (max! - min!) * 100;
-
+    const lengthString = vertical ? 'height' : 'width';
     const onMouseDownProp: {} = disabled ? {} : { onMouseDown: this._onMouseDownOrTouchStart };
     const onTouchStartProp: {} = disabled ? {} : { onTouchStart: this._onMouseDownOrTouchStart };
     const onKeyDownProp: {} = disabled ? {} : { onKeyDown: this._onKeyDown };
@@ -96,7 +98,9 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
       <div
         className={ css('ms-Slider', styles.root, className, {
           ['ms-Slider-enabled ' + styles.rootIsEnabled]: !disabled,
-          ['ms-Slider-disabled ' + styles.rootIsDisabled]: disabled
+          ['ms-Slider-disabled ' + styles.rootIsDisabled]: disabled,
+          ['ms-Slider-row ' + styles.rootIsHorizontal]: !vertical,
+          ['ms-Slider-column ' + styles.rootIsVertical]: vertical
         }) }
         ref='root'>
         { label && (
@@ -133,12 +137,16 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
                 ref='thumb'
                 className={ css('ms-Slider-thumb', styles.thumb) }
                 { ...ariaLabel ? { 'aria-label': ariaLabel } : {} }
-                style={ getRTL() ?
-                  { 'right': thumbOffsetPercent + '%' } :
-                  { 'left': thumbOffsetPercent + '%' } }
+                style={ this._getThumbStyle(vertical, thumbOffsetPercent) }
+              />
+              <span
+                className={ css('ms-Slider-active', styles.lineContainer, styles.activeSection) }
+                style={ { [lengthString]: thumbOffsetPercent + '%' } }
+              />
+              <span
+                 className={ css('ms-Slider-inactive', styles.lineContainer, styles.inactiveSection) }
+                 style={ { [lengthString]: (100 - thumbOffsetPercent) + '%' } }
               />
-              <span className={ css('ms-Slider-active', styles.activeSection) } style={ { 'width': thumbOffsetPercent + '%' } }></span>
-              <span className={ css('ms-Slider-inactive', styles.inactiveSection) } style={ { 'width': (100 - thumbOffsetPercent) + '%' } }></span>
             </div>
           </button>
           { showValue && <Label className={ css('ms-Slider-value', styles.valueLabel) }>{ value }</Label> }
@@ -146,7 +154,6 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
       </div>
     ) as React.ReactElement<{}>;
   }
-
   public focus(): void {
     if (this.refs.thumb) {
       this.refs.thumb.focus();
@@ -157,6 +164,13 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     return this.state.value;
   }
 
+  private _getThumbStyle(vertical: boolean | undefined, thumbOffsetPercent: number): any {
+    let direction: string = vertical ? 'bottom' : (getRTL() ? 'right' : 'left');
+    return {
+      [direction]: thumbOffsetPercent + '%'
+    };
+  }
+
   @autobind
   private _onMouseDownOrTouchStart(event: MouseEvent | TouchEvent): void {
     if (event.type === 'mousedown') {
@@ -166,7 +180,6 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
       this._events.on(window, 'touchmove', this._onMouseMoveOrTouchMove, true);
       this._events.on(window, 'touchend', this._onMouseUpOrTouchEnd, true);
     }
-
     this._onMouseMoveOrTouchMove(event, true);
   }
 
@@ -175,18 +188,19 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     const { max, min, step } = this.props;
     const steps: number = (max! - min!) / step!;
     const sliderPositionRect: ClientRect = this.refs.sliderLine.getBoundingClientRect();
-    const sliderLength: number = sliderPositionRect.width;
+    const sliderLength: number = !this.props.vertical ? sliderPositionRect.width : sliderPositionRect.height;
     const stepLength: number = sliderLength / steps;
     let currentSteps: number | undefined;
+    let distance: number | undefined;
 
-    if (event.type === 'mousedown' || event.type === 'mousemove') {
-      currentSteps = getRTL() ?
-        (sliderPositionRect.right - (event as MouseEvent).clientX) / stepLength :
-        ((event as MouseEvent).clientX - sliderPositionRect.left) / stepLength;
-    } else if (event.type === 'touchstart' || event.type === 'touchmove') {
-      currentSteps = getRTL() ?
-        (sliderPositionRect.right - (event as TouchEvent).touches[0].clientX) / stepLength :
-        ((event as TouchEvent).touches[0].clientX - sliderPositionRect.left) / stepLength;
+    if (!this.props.vertical) {
+      let left: number | undefined = this._getPosition(event, this.props.vertical);
+      distance = getRTL() ? sliderPositionRect.right - left! : left! - sliderPositionRect.left;
+      currentSteps = distance / stepLength;
+    } else {
+      let bottom: number | undefined = this._getPosition(event, this.props.vertical);
+      distance = sliderPositionRect.bottom - bottom!;
+      currentSteps = distance / stepLength;
     }
 
     let currentValue: number | undefined;
@@ -210,6 +224,20 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     }
   }
 
+  private _getPosition(event: MouseEvent | TouchEvent, vertical: boolean | undefined): number | undefined {
+    let currentPosition: number | undefined;
+    switch (event.type) {
+      case 'mousedown':
+      case 'mousemove':
+        currentPosition = !vertical ? (event as MouseEvent).clientX : (event as MouseEvent).clientY;
+        break;
+      case 'touchstart':
+      case 'touchmove':
+        currentPosition = !vertical ? (event as TouchEvent).touches[0].clientX : (event as TouchEvent).touches[0].clientY;
+        break;
+    }
+    return currentPosition;
+  }
   private _updateValue(value: number, renderedValue: number) {
     let valueChanged = value !== this.state.value;
 
@@ -225,7 +253,6 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
 
   @autobind
   private _onMouseUpOrTouchEnd(): void {
-
     // Synchronize the renderedValue to the actual value.
     this.setState({
       renderedValue: this.state.value
@@ -271,4 +298,4 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     event.stopPropagation();
   }
 
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/Slider/examples/Slider.Basic.Example.scss b/packages/office-ui-fabric-react/src/components/Slider/examples/Slider.Basic.Example.scss
index ec0433ba18cfc..4d2ba68a5da11 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/examples/Slider.Basic.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/Slider/examples/Slider.Basic.Example.scss
@@ -1,7 +1,20 @@
 :global {
 
+  .ms-basicSlider {
+    display: flex;
+    flex-direction: column;
+    max-width: 500px;
+  }
   .ms-SliderBasicExample {
     max-width: 300px;
   }
-
+  .ms-SliderVertical {
+    padding-top:20px;
+    display: flex;
+    height: 200px;
+    flex-direction: row;
+  }
+  .ms-verticalBox {
+    display: flex;
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Slider/examples/Slider.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Slider/examples/Slider.Basic.Example.tsx
index e83506e459e12..fb97c86d5d5ec 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/examples/Slider.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/examples/Slider.Basic.Example.tsx
@@ -13,38 +13,70 @@ export class SliderBasicExample extends React.Component<any, any> {
 
   public render() {
     return (
-      <div className='ms-SliderBasicExample'>
-
-        <Slider
-          label='Basic example:'
-          min={ 1 }
-          max={ 3 }
-          step={ 1 }
-          defaultValue={ 2 }
-          showValue={ true }
-          onChange={ (value) => console.log(value) }
-        />
-
-        <Slider
-          label='Disabled example:'
-          min={ 50 }
-          max={ 500 }
-          step={ 50 }
-          defaultValue={ 300 }
-          showValue={ true }
-          disabled={ true }
-        />
-
-        <Slider
-          label='Controlled example:'
-          max={ 10 }
-          value={ this.state.value }
-          onChange={ value => this.setState({ value }) }
-          showValue={ true }
-        />
+      <div className='ms-basicSlider'>
+        <div className='ms-SliderBasicExample'>
 
+          <Slider
+            label='Basic example:'
+            min={ 1 }
+            max={ 3 }
+            step={ 1 }
+            defaultValue={ 2 }
+            showValue={ true }
+            onChange={ (value) => console.log(value) }
+          />
+          <Slider
+            label='Disabled example:'
+            min={ 50 }
+            max={ 500 }
+            step={ 50 }
+            defaultValue={ 300 }
+            showValue={ true }
+            disabled={ true }
+          />
+          <Slider
+            label='Controlled example:'
+            max={ 10 }
+            value={ this.state.value }
+            onChange={ value => this.setState({ value }) }
+            showValue={ true }
+          />
+        </div>
+        <div className='ms-SliderVertical '>
+          <div className='ms-verticalBox'>
+            <Slider
+              label='Basic example:'
+              min={ 1 }
+              max={ 3 }
+              step={ 1 }
+              defaultValue={ 2 }
+              showValue={ true }
+              vertical={ true }
+              onChange={ (value) => console.log(value) }
+            />
+          </div>
+          <div className='ms-verticalBox'>
+            <Slider
+              label='Disabled example:'
+              min={ 50 }
+              max={ 500 }
+              step={ 50 }
+              defaultValue={ 300 }
+              showValue={ true }
+              vertical={ true }
+              disabled={ true }
+            />
+          </div>
+          <div className='ms-verticalBox'>
+            <Slider
+              label='Controlled example:'
+              max={ 10 }
+              vertical={ true }
+              showValue={ true }
+            />
+          </div>
+        </div>
       </div>
     );
   }
-
 }

From 671cf2c8f2c3ab4ce9c33a390cc074ebca36bf5c Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 4 Sep 2017 03:16:56 -0700
Subject: [PATCH 0563/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  4 +-
 ...xample-app-base-deps_2017-09-01-18-33.json | 11 -----
 .../tile-size_2017-08-30-19-24.json           | 11 -----
 .../textDocument-icon_2017-09-01-17-16.json   | 11 -----
 .../utilities/tile-size_2017-08-30-19-24.json | 11 -----
 .../betrue-fixCheck_2017-09-01-18-18.json     | 11 -----
 ...egorr-CalendarStyles_2017-08-21-18-44.json | 11 -----
 ...in-addverticalslider_2017-08-17-02-27.json | 11 -----
 ...st-sortIcon-position_2017-09-01-18-24.json | 11 -----
 packages/example-app-base/CHANGELOG.json      | 14 +++++++
 packages/example-app-base/CHANGELOG.md        |  9 +++-
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/CHANGELOG.json           | 28 +++++++++++++
 packages/experiments/CHANGELOG.md             |  9 +++-
 packages/experiments/package.json             | 10 ++---
 .../office-ui-fabric-react/CHANGELOG.json     | 42 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 ++++++-
 packages/office-ui-fabric-react/package.json  |  8 ++--
 packages/styling/CHANGELOG.json               | 19 +++++++++
 packages/styling/CHANGELOG.md                 |  9 +++-
 packages/styling/package.json                 |  4 +-
 packages/utilities/CHANGELOG.json             | 14 +++++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  2 +-
 24 files changed, 178 insertions(+), 108 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/update-example-app-base-deps_2017-09-01-18-33.json
 delete mode 100644 common/changes/@uifabric/experiments/tile-size_2017-08-30-19-24.json
 delete mode 100644 common/changes/@uifabric/styling/textDocument-icon_2017-09-01-17-16.json
 delete mode 100644 common/changes/@uifabric/utilities/tile-size_2017-08-30-19-24.json
 delete mode 100644 common/changes/office-ui-fabric-react/betrue-fixCheck_2017-09-01-18-18.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-CalendarStyles_2017-08-21-18-44.json
 delete mode 100644 common/changes/office-ui-fabric-react/t-zhajin-addverticalslider_2017-08-17-02-27.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-edwliu-detailslist-sortIcon-position_2017-09-01-18-24.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 50043f7f954a4..ce9f07a857fbf 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -41,10 +41,10 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/example-app-base": ">=4.2.6 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.7 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=4.39.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.40.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/update-example-app-base-deps_2017-09-01-18-33.json b/common/changes/@uifabric/example-app-base/update-example-app-base-deps_2017-09-01-18-33.json
deleted file mode 100644
index 1a4ef166cef2b..0000000000000
--- a/common/changes/@uifabric/example-app-base/update-example-app-base-deps_2017-09-01-18-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Update fabric-dependency version",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/tile-size_2017-08-30-19-24.json b/common/changes/@uifabric/experiments/tile-size_2017-08-30-19-24.json
deleted file mode 100644
index be54a9859fed7..0000000000000
--- a/common/changes/@uifabric/experiments/tile-size_2017-08-30-19-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Add size pre-computation support to Tile and FolderCover",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/textDocument-icon_2017-09-01-17-16.json b/common/changes/@uifabric/styling/textDocument-icon_2017-09-01-17-16.json
deleted file mode 100644
index 55dc0ca9c452d..0000000000000
--- a/common/changes/@uifabric/styling/textDocument-icon_2017-09-01-17-16.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Icons: Added textDocument back into the icon list",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/tile-size_2017-08-30-19-24.json b/common/changes/@uifabric/utilities/tile-size_2017-08-30-19-24.json
deleted file mode 100644
index 54ede634e3f45..0000000000000
--- a/common/changes/@uifabric/utilities/tile-size_2017-08-30-19-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Add ISize interface and fitContentToBounds utility function",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/betrue-fixCheck_2017-09-01-18-18.json b/common/changes/office-ui-fabric-react/betrue-fixCheck_2017-09-01-18-18.json
deleted file mode 100644
index 0f244d5795f33..0000000000000
--- a/common/changes/office-ui-fabric-react/betrue-fixCheck_2017-09-01-18-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Check: Fixed Chrome-specific alignment for the checkmark within the circle.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "betrue@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/kegorr-CalendarStyles_2017-08-21-18-44.json b/common/changes/office-ui-fabric-react/kegorr-CalendarStyles_2017-08-21-18-44.json
deleted file mode 100644
index fab0e91057b49..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-CalendarStyles_2017-08-21-18-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Updating Calendar component styles to match new OWA calendar styles for the Calendar team.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/t-zhajin-addverticalslider_2017-08-17-02-27.json b/common/changes/office-ui-fabric-react/t-zhajin-addverticalslider_2017-08-17-02-27.json
deleted file mode 100644
index 308575bd9ab93..0000000000000
--- a/common/changes/office-ui-fabric-react/t-zhajin-addverticalslider_2017-08-17-02-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Slider: adding `vertical` property to render as a vertical slider.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "t-zhajin@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/v-edwliu-detailslist-sortIcon-position_2017-09-01-18-24.json b/common/changes/office-ui-fabric-react/v-edwliu-detailslist-sortIcon-position_2017-09-01-18-24.json
deleted file mode 100644
index d47c99cc4f4da..0000000000000
--- a/common/changes/office-ui-fabric-react/v-edwliu-detailslist-sortIcon-position_2017-09-01-18-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsHeader: Adjust sortIcon position",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-edwliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 269889938bb57..edb1a46da8f52 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "4.2.7",
+      "tag": "@uifabric/example-app-base_v4.2.7",
+      "date": "Mon, 04 Sep 2017 10:16:56 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "7836034345ccf0f347adece0c2c20ba5d63ddcf7",
+            "comment": "Update fabric-dependency version"
+          }
+        ]
+      }
+    },
     {
       "version": "4.2.6",
       "tag": "@uifabric/example-app-base_v4.2.6",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index e04965b35b1cb..f34b0612e1d19 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Fri, 01 Sep 2017 16:51:57 GMT and should not be manually modified.
+This log was last generated on Mon, 04 Sep 2017 10:16:56 GMT and should not be manually modified.
+
+## 4.2.7
+Mon, 04 Sep 2017 10:16:56 GMT
+
+### Patches
+
+- Update fabric-dependency version
 
 ## 4.2.6
 Fri, 01 Sep 2017 16:51:57 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 1958f0d195f7d..f7cc51416f8b8 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "4.2.6",
+  "version": "4.2.7",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 6c3f26568a612..6cc4051941a2e 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,34 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "0.4.0",
+      "tag": "@uifabric/experiments_v0.4.0",
+      "date": "Mon, 04 Sep 2017 10:16:56 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "57ea45fbfaf4f4ee89a4da54a0a4beab7b16051b",
+            "comment": "Add size pre-computation support to Tile and FolderCover"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.22.0 <1.0.0` to `>=0.22.1 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.12.1 <5.0.0` to `>=4.13.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.39.0 <5.0.0` to `>=4.40.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=4.2.6 <5.0.0` to `>=4.2.7 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.3.0",
       "tag": "@uifabric/experiments_v0.3.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index a0a5f85f5f98b..6e32b4e62c3de 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Tue, 29 Aug 2017 20:55:35 GMT and should not be manually modified.
+This log was last generated on Mon, 04 Sep 2017 10:16:56 GMT and should not be manually modified.
+
+## 0.4.0
+Mon, 04 Sep 2017 10:16:56 GMT
+
+### Minor changes
+
+- Add size pre-computation support to Tile and FolderCover
 
 ## 0.3.0
 Tue, 29 Aug 2017 20:55:35 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 740b19a06bf41..c2b78f06f770b 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -26,7 +26,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=4.2.6 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.7 <5.0.0",
     "enzyme": "^2.7.0",
     "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
@@ -41,9 +41,9 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/styling": ">=0.22.0 <1.0.0",
-    "@uifabric/utilities": ">=4.12.1 <5.0.0",
-    "office-ui-fabric-react": ">=4.39.0 <5.0.0",
+    "@uifabric/styling": ">=0.22.1 <1.0.0",
+    "@uifabric/utilities": ">=4.13.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.40.0 <5.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 6cc5ca0108eb5..d0a66ee360337 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,48 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.40.0",
+      "tag": "office-ui-fabric-react_v4.40.0",
+      "date": "Mon, 04 Sep 2017 10:16:56 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Ben Truelove <betrue@microsoft.com>",
+            "commit": "25690f7cbef4c2501362b5bbb936ada662c4e85d",
+            "comment": "Check: Fixed Chrome-specific alignment for the checkmark within the circle."
+          },
+          {
+            "author": "zhangjingjingbupt <30819290+zhangjingjingbupt@users.noreply.github.com>",
+            "commit": "0dabdf36b003831b8c36b7d3174f4bcdfdfd2261",
+            "comment": "Slider: adding `vertical` property to render as a vertical slider."
+          },
+          {
+            "author": "Eddie Liu <leddie24@gmail.com>",
+            "commit": "e3d92561e750fe211769c86ed13a2ee6a8fd4605",
+            "comment": "DetailsHeader: Adjust sortIcon position"
+          }
+        ],
+        "minor": [
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "e515c5c9aa5aae20ef89cf32ae3e9adeb1fbaaf5",
+            "comment": "Updating Calendar component styles to match new OWA calendar styles for the Calendar team."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.12.1 <5.0.0` to `>=4.13.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.22.0 <1.0.0` to `>=0.22.1 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=4.2.6 <5.0.0` to `>=4.2.7 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.39.0",
       "tag": "office-ui-fabric-react_v4.39.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index a71cfc1b136b4..105ab561155b5 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 01 Sep 2017 16:51:57 GMT and should not be manually modified.
+This log was last generated on Mon, 04 Sep 2017 10:16:56 GMT and should not be manually modified.
+
+## 4.40.0
+Mon, 04 Sep 2017 10:16:56 GMT
+
+### Minor changes
+
+- Updating Calendar component styles to match new OWA calendar styles for the Calendar team.
+
+### Patches
+
+- Check: Fixed Chrome-specific alignment for the checkmark within the circle.
+- Slider: adding `vertical` property to render as a vertical slider.
+- DetailsHeader: Adjust sortIcon position
 
 ## 4.39.0
 Fri, 01 Sep 2017 16:51:57 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 7947d0959794e..18db94c82887e 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.39.0",
+  "version": "4.40.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -26,7 +26,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=4.2.6 <5.0.0",
+    "@uifabric/example-app-base": ">=4.2.7 <5.0.0",
     "enzyme": "^2.7.0",
     "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
@@ -43,8 +43,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=4.12.1 <5.0.0",
-    "@uifabric/styling": ">=0.22.0 <1.0.0",
+    "@uifabric/utilities": ">=4.13.0 <5.0.0",
+    "@uifabric/styling": ">=0.22.1 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index ea9ed31b9f31c..0c0037248b3fb 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.22.1",
+      "tag": "@uifabric/styling_v0.22.1",
+      "date": "Mon, 04 Sep 2017 10:16:56 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "b4eee571f31db3c0950938e40aafea9313f73003",
+            "comment": "Icons: Added textDocument back into the icon list"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.12.1 <5.0.0` to `>=4.13.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.22.0",
       "tag": "@uifabric/styling_v0.22.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index cfac4c4d15d4c..d250ef68e49f0 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 01 Sep 2017 16:51:57 GMT and should not be manually modified.
+This log was last generated on Mon, 04 Sep 2017 10:16:56 GMT and should not be manually modified.
+
+## 0.22.1
+Mon, 04 Sep 2017 10:16:56 GMT
+
+### Patches
+
+- Icons: Added textDocument back into the icon list
 
 ## 0.22.0
 Fri, 01 Sep 2017 16:51:57 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 59cd18ca0edf7..1b1b0d07b156e 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.22.0",
+  "version": "0.22.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -28,7 +28,7 @@
     "react-dom": "^15.4.2"
   },
   "dependencies": {
-    "@uifabric/utilities": ">=4.12.1 <5.0.0",
+    "@uifabric/utilities": ">=4.13.0 <5.0.0",
     "tslib": "^1.7.1",
     "rtl-css-js": "^1.1.3",
     "glamor": "^2.20.40"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 8fa257ebcb7b9..c9339d33bd0bc 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.13.0",
+      "tag": "@uifabric/utilities_v4.13.0",
+      "date": "Mon, 04 Sep 2017 10:16:56 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "57ea45fbfaf4f4ee89a4da54a0a4beab7b16051b",
+            "comment": "Add ISize interface and fitContentToBounds utility function"
+          }
+        ]
+      }
+    },
     {
       "version": "4.12.1",
       "tag": "@uifabric/utilities_v4.12.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index e25790b90f2de..6018c2668591c 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Fri, 01 Sep 2017 18:06:55 GMT and should not be manually modified.
+This log was last generated on Mon, 04 Sep 2017 10:16:56 GMT and should not be manually modified.
+
+## 4.13.0
+Mon, 04 Sep 2017 10:16:56 GMT
+
+### Minor changes
+
+- Add ISize interface and fitContentToBounds utility function
 
 ## 4.12.1
 Fri, 01 Sep 2017 18:06:55 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 4b1304b09f7e6..bb9f2773d5878 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.12.1",
+  "version": "4.13.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From aabfe574769721a9d7f385920be84cfac3f90a34 Mon Sep 17 00:00:00 2001
From: Aniket Handa <atneik@users.noreply.github.com>
Date: Mon, 4 Sep 2017 17:05:35 -0700
Subject: [PATCH 0564/1641] HoverCard: Support change in expanded card height.
 Add callbacks upon card visible/hide (#2718)

* Flush ExpandingCard if height changes

* Add rush change

* Update anihan-hoverCard-fix_2017-09-02-00-35.json

* Update for height fix, visible and hide callbacks

* Update comment
---
 .../anihan-hoverCard-fix_2017-09-02-00-35.json        | 11 +++++++++++
 .../src/components/Callout/CalloutContent.tsx         |  8 ++++++--
 .../src/components/HoverCard/ExpandingCard.styles.ts  |  4 ++--
 .../src/components/HoverCard/HoverCard.Props.ts       | 10 ++++++++++
 .../src/components/HoverCard/HoverCard.tsx            |  2 ++
 .../HoverCard/examples/HoverCard.Target.Example.tsx   |  4 +++-
 6 files changed, 34 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/anihan-hoverCard-fix_2017-09-02-00-35.json

diff --git a/common/changes/office-ui-fabric-react/anihan-hoverCard-fix_2017-09-02-00-35.json b/common/changes/office-ui-fabric-react/anihan-hoverCard-fix_2017-09-02-00-35.json
new file mode 100644
index 0000000000000..98342a4f52284
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/anihan-hoverCard-fix_2017-09-02-00-35.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "HoverCard: Support change in expanded card height. Add callbacks upon card visible/hide",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "anihan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index 06ebdc22ae32e..6c4723e964755 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -88,6 +88,10 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
     if (newProps.gapSpace !== this.props.gapSpace || this.props.beakWidth !== newProps.beakWidth) {
       this._maxHeight = undefined;
     }
+
+    if (newProps.finalHeight !== this.props.finalHeight) {
+      this._setHeightOffsetEveryFrame();
+    }
   }
 
   public componentDidMount() {
@@ -172,7 +176,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
             ariaDescribedBy={ ariaDescribedBy }
             ariaLabelledBy={ ariaLabelledBy }
             className={ css('ms-Callout-main', styles.main, {
-              [styles.overFlowYHidden]: finalHeight
+              [styles.overFlowYHidden]: !!finalHeight
             }) }
             onDismiss={ this.dismiss }
             shouldRestoreFocus={ true }
@@ -354,7 +358,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
   private _setHeightOffsetEveryFrame(): void {
     if (this._calloutElement && this.props.finalHeight) {
       this._setHeightOffsetTimer = this._async.requestAnimationFrame(() => {
-        const calloutMainElem = this._calloutElement.firstChild as HTMLElement;
+        const calloutMainElem = this._calloutElement.lastChild as HTMLElement;
         const cardScrollHeight: number = calloutMainElem.scrollHeight;
         const cardCurrHeight: number = calloutMainElem.offsetHeight;
         const scrollDiff: number = cardScrollHeight - cardCurrHeight;
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
index f798f4605e48f..68136c9b059ca 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
@@ -36,8 +36,8 @@ export const getStyles = memoizeFunction((
         position: 'relative',
         display: 'block',
         top: '0',
-        left: '0',
-        right: '0',
+        left: '24px',
+        width: '292px',
         height: '1px',
         'background-color': theme.palette.neutralLighter
       })
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts
index 775835cb3e235..25cfb34eb44aa 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts
@@ -67,6 +67,16 @@ export interface IHoverCardProps extends React.HTMLAttributes<HTMLDivElement | H
    * Optional target element to tag hover card on
    */
   target?: HTMLElement | string;
+
+  /**
+   * Callback when card becomes visible
+   */
+  onCardVisible?: () => void;
+
+  /**
+   * Callback when card hides
+   */
+  onCardHide?: () => void;
 }
 
 export interface IHoverCardStyles {
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
index cb54f36a0c997..9748bee57b00a 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
@@ -71,10 +71,12 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
             mode: ExpandingCardMode.expanded
           });
         }, this.props.expandedCardOpenDelay!);
+        this.props.onCardVisible && this.props.onCardVisible();
       } else {
         this.setState({
           mode: ExpandingCardMode.compact
         });
+        this.props.onCardHide && this.props.onCardHide();
       }
     }
   }
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
index 273750fe37f31..b4ed9a09f6ac3 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
@@ -49,6 +49,8 @@ class HoverCardField extends BaseComponent<IHoverCardFieldProps, IHoverCardField
             expandingCardProps={ this.props.expandingCardProps }
             target={ this.state.contentRendered }
             cardDismissDelay={ 300 }
+            onCardVisible={ () => console.log('onCardVisible') }
+            onCardHide={ () => console.log('onCardHide') }
           />
         }
       </div>
@@ -91,7 +93,7 @@ export class HoverCardTargetExample extends BaseComponent<{}, IHoverCardExampleS
       onRenderCompactCard: this._onRenderCompactCard,
       onRenderExpandedCard: this._onRenderExpandedCard,
       renderData: item,
-      directionalHint: DirectionalHint.rightCenter,
+      directionalHint: DirectionalHint.rightTopEdge,
       gapSpace: 16
     };
 

From 798ea36bd60137fef02582899ce6f6aaf2ed6afd Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 5 Sep 2017 10:41:27 -0700
Subject: [PATCH 0565/1641] Utilities package: moving from karma to jest
 (#2721)

* Updates the utilities package to use jest instead of karma.

* undo

* Removing karma config.

* Update package.json

* Update memoize.test.ts
---
 .vscode/settings.json                         |   2 +-
 common/config/rush/npm-shrinkwrap.json        | 593 +-----------------
 packages/utilities/jest.config.js             |   3 +
 packages/utilities/karma.config.js            | 113 ----
 packages/utilities/package.json               |  19 +-
 packages/utilities/src/BaseComponent.test.tsx |   8 +-
 packages/utilities/src/EventGroup.test.ts     |  86 ++-
 packages/utilities/src/array.test.ts          |  23 +-
 packages/utilities/src/autobind.test.ts       |   5 +-
 packages/utilities/src/common/tests.ts        |  17 -
 packages/utilities/src/css.test.ts            |  10 +-
 packages/utilities/src/customizable.test.tsx  |  10 +-
 packages/utilities/src/dom.test.ts            |  20 +-
 packages/utilities/src/focus.test.tsx         |  29 +-
 packages/utilities/src/initials.test.ts       |  50 +-
 packages/utilities/src/math.test.ts           |  18 +-
 packages/utilities/src/memoize.test.ts        | 104 ++-
 packages/utilities/src/object.test.ts         |  13 +-
 packages/utilities/src/overflow.test.ts       |  69 +-
 packages/utilities/src/properties.test.ts     |  20 +-
 packages/utilities/src/rtl.test.ts            |   6 +-
 packages/utilities/src/scroll.test.ts         |  28 -
 packages/utilities/src/warn.test.ts           |  15 +-
 packages/utilities/tsconfig.json              |   4 +-
 scripts/start-test.js                         |   2 +-
 scripts/tasks/jest-resources.js               |   6 +
 26 files changed, 254 insertions(+), 1019 deletions(-)
 create mode 100644 packages/utilities/jest.config.js
 delete mode 100644 packages/utilities/karma.config.js
 delete mode 100644 packages/utilities/src/common/tests.ts
 delete mode 100644 packages/utilities/src/scroll.test.ts

diff --git a/.vscode/settings.json b/.vscode/settings.json
index 41a5372b59608..8807589f04b73 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -43,4 +43,4 @@
   "editor.formatOnSave": true,
   "typescript.tsdk": "./common/temp/node_modules/typescript/lib",
   "tslint.autoFixOnSave": false
-}
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index c856623b9866e..4f14cb5ce650a 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -14,7 +14,7 @@
       "integrity": "sha1-Y1VyRApbBFYM35zrC7OKTVbGSfQ="
     },
     "@rush-temp/build": {
-      "version": "file:projects\\build",
+      "version": "file:projects/build",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -347,7 +347,7 @@
       }
     },
     "@rush-temp/example-app-base": {
-      "version": "file:projects\\example-app-base",
+      "version": "file:projects/example-app-base",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -582,7 +582,7 @@
       }
     },
     "@rush-temp/experiments": {
-      "version": "file:projects\\experiments",
+      "version": "file:projects/experiments",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -833,7 +833,7 @@
       }
     },
     "@rush-temp/fabric-website": {
-      "version": "file:projects\\fabric-website",
+      "version": "file:projects/fabric-website",
       "dependencies": {
         "@types/react-addons-test-utils": {
           "version": "0.14.19",
@@ -1080,7 +1080,7 @@
       }
     },
     "@rush-temp/merge-styles": {
-      "version": "file:projects\\merge-styles",
+      "version": "file:projects/merge-styles",
       "dependencies": {
         "commander": {
           "version": "2.9.0",
@@ -1109,7 +1109,7 @@
       }
     },
     "@rush-temp/office-ui-fabric-react": {
-      "version": "file:projects\\office-ui-fabric-react",
+      "version": "file:projects/office-ui-fabric-react",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1360,10 +1360,10 @@
       }
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
-      "version": "file:projects\\office-ui-fabric-react-tslint"
+      "version": "file:projects/office-ui-fabric-react-tslint"
     },
     "@rush-temp/ssr-tests": {
-      "version": "file:projects\\ssr-tests",
+      "version": "file:projects/ssr-tests",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1592,7 +1592,7 @@
       }
     },
     "@rush-temp/styling": {
-      "version": "file:projects\\styling",
+      "version": "file:projects/styling",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1787,7 +1787,7 @@
       }
     },
     "@rush-temp/test-bundle-button": {
-      "version": "file:projects\\test-bundle-button",
+      "version": "file:projects/test-bundle-button",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1956,10 +1956,10 @@
       }
     },
     "@rush-temp/todo-app": {
-      "version": "file:projects\\todo-app"
+      "version": "file:projects/todo-app"
     },
     "@rush-temp/utilities": {
-      "version": "file:projects\\utilities",
+      "version": "file:projects/utilities",
       "dependencies": {
         "commander": {
           "version": "2.9.0",
@@ -4150,549 +4150,6 @@
       "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
       "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
     },
-    "fsevents": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.2.tgz",
-      "integrity": "sha512-Sn44E5wQW4bTHXvQmvSHwqbuiXtduD6Rrjm2ZtUEGbyrig+nUH3t/QD4M4/ZXViY556TBpRgZkHLDx3JxPwxiw==",
-      "optional": true,
-      "dependencies": {
-        "abbrev": {
-          "version": "1.1.0",
-          "bundled": true,
-          "optional": true
-        },
-        "ajv": {
-          "version": "4.11.8",
-          "bundled": true,
-          "optional": true
-        },
-        "ansi-regex": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "aproba": {
-          "version": "1.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "are-we-there-yet": {
-          "version": "1.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "asn1": {
-          "version": "0.2.3",
-          "bundled": true,
-          "optional": true
-        },
-        "assert-plus": {
-          "version": "0.2.0",
-          "bundled": true,
-          "optional": true
-        },
-        "asynckit": {
-          "version": "0.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "aws-sign2": {
-          "version": "0.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "aws4": {
-          "version": "1.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "balanced-match": {
-          "version": "0.4.2",
-          "bundled": true
-        },
-        "bcrypt-pbkdf": {
-          "version": "1.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "block-stream": {
-          "version": "0.0.9",
-          "bundled": true
-        },
-        "boom": {
-          "version": "2.10.1",
-          "bundled": true
-        },
-        "brace-expansion": {
-          "version": "1.1.7",
-          "bundled": true
-        },
-        "buffer-shims": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "caseless": {
-          "version": "0.12.0",
-          "bundled": true,
-          "optional": true
-        },
-        "co": {
-          "version": "4.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "code-point-at": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "combined-stream": {
-          "version": "1.0.5",
-          "bundled": true
-        },
-        "concat-map": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "console-control-strings": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "core-util-is": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "cryptiles": {
-          "version": "2.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "dashdash": {
-          "version": "1.14.1",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true,
-          "optional": true
-        },
-        "deep-extend": {
-          "version": "0.4.2",
-          "bundled": true,
-          "optional": true
-        },
-        "delayed-stream": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "delegates": {
-          "version": "1.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "ecc-jsbn": {
-          "version": "0.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "extend": {
-          "version": "3.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "extsprintf": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "forever-agent": {
-          "version": "0.6.1",
-          "bundled": true,
-          "optional": true
-        },
-        "form-data": {
-          "version": "2.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "fs.realpath": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "fstream": {
-          "version": "1.0.11",
-          "bundled": true
-        },
-        "fstream-ignore": {
-          "version": "1.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "gauge": {
-          "version": "2.7.4",
-          "bundled": true,
-          "optional": true
-        },
-        "getpass": {
-          "version": "0.1.7",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "glob": {
-          "version": "7.1.2",
-          "bundled": true
-        },
-        "graceful-fs": {
-          "version": "4.1.11",
-          "bundled": true
-        },
-        "har-schema": {
-          "version": "1.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "har-validator": {
-          "version": "4.2.1",
-          "bundled": true,
-          "optional": true
-        },
-        "has-unicode": {
-          "version": "2.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "hawk": {
-          "version": "3.1.3",
-          "bundled": true,
-          "optional": true
-        },
-        "hoek": {
-          "version": "2.16.3",
-          "bundled": true
-        },
-        "http-signature": {
-          "version": "1.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "inflight": {
-          "version": "1.0.6",
-          "bundled": true
-        },
-        "inherits": {
-          "version": "2.0.3",
-          "bundled": true
-        },
-        "ini": {
-          "version": "1.3.4",
-          "bundled": true,
-          "optional": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "is-typedarray": {
-          "version": "1.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "isstream": {
-          "version": "0.1.2",
-          "bundled": true,
-          "optional": true
-        },
-        "jodid25519": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "jsbn": {
-          "version": "0.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "json-schema": {
-          "version": "0.2.3",
-          "bundled": true,
-          "optional": true
-        },
-        "json-stable-stringify": {
-          "version": "1.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "json-stringify-safe": {
-          "version": "5.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "jsonify": {
-          "version": "0.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "jsprim": {
-          "version": "1.4.0",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "mime-db": {
-          "version": "1.27.0",
-          "bundled": true
-        },
-        "mime-types": {
-          "version": "2.1.15",
-          "bundled": true
-        },
-        "minimatch": {
-          "version": "3.0.4",
-          "bundled": true
-        },
-        "minimist": {
-          "version": "0.0.8",
-          "bundled": true
-        },
-        "mkdirp": {
-          "version": "0.5.1",
-          "bundled": true
-        },
-        "ms": {
-          "version": "2.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "node-pre-gyp": {
-          "version": "0.6.36",
-          "bundled": true,
-          "optional": true
-        },
-        "nopt": {
-          "version": "4.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "npmlog": {
-          "version": "4.1.0",
-          "bundled": true,
-          "optional": true
-        },
-        "number-is-nan": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "oauth-sign": {
-          "version": "0.8.2",
-          "bundled": true,
-          "optional": true
-        },
-        "object-assign": {
-          "version": "4.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "once": {
-          "version": "1.4.0",
-          "bundled": true
-        },
-        "os-homedir": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "os-tmpdir": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "osenv": {
-          "version": "0.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "path-is-absolute": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "performance-now": {
-          "version": "0.2.0",
-          "bundled": true,
-          "optional": true
-        },
-        "process-nextick-args": {
-          "version": "1.0.7",
-          "bundled": true
-        },
-        "punycode": {
-          "version": "1.4.1",
-          "bundled": true,
-          "optional": true
-        },
-        "qs": {
-          "version": "6.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "rc": {
-          "version": "1.2.1",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "minimist": {
-              "version": "1.2.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "readable-stream": {
-          "version": "2.2.9",
-          "bundled": true
-        },
-        "request": {
-          "version": "2.81.0",
-          "bundled": true,
-          "optional": true
-        },
-        "rimraf": {
-          "version": "2.6.1",
-          "bundled": true
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "bundled": true
-        },
-        "semver": {
-          "version": "5.3.0",
-          "bundled": true,
-          "optional": true
-        },
-        "set-blocking": {
-          "version": "2.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "signal-exit": {
-          "version": "3.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "sntp": {
-          "version": "1.0.9",
-          "bundled": true,
-          "optional": true
-        },
-        "sshpk": {
-          "version": "1.13.0",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "string_decoder": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "stringstream": {
-          "version": "0.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "strip-ansi": {
-          "version": "3.0.1",
-          "bundled": true
-        },
-        "strip-json-comments": {
-          "version": "2.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "tar": {
-          "version": "2.2.1",
-          "bundled": true
-        },
-        "tar-pack": {
-          "version": "3.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "tough-cookie": {
-          "version": "2.3.2",
-          "bundled": true,
-          "optional": true
-        },
-        "tunnel-agent": {
-          "version": "0.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "tweetnacl": {
-          "version": "0.14.5",
-          "bundled": true,
-          "optional": true
-        },
-        "uid-number": {
-          "version": "0.0.6",
-          "bundled": true,
-          "optional": true
-        },
-        "util-deprecate": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "uuid": {
-          "version": "3.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "verror": {
-          "version": "1.3.6",
-          "bundled": true,
-          "optional": true
-        },
-        "wide-align": {
-          "version": "1.1.2",
-          "bundled": true,
-          "optional": true
-        },
-        "wrappy": {
-          "version": "1.0.2",
-          "bundled": true
-        }
-      }
-    },
     "fstream": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
@@ -6623,14 +6080,14 @@
       "integrity": "sha512-n9ChLv77+QQEapYz8lV+rIZAW3HhAPW2CXnzb1GN5uMkuczshwvkW7XPsbzU0ZQN3sP47Er2KVkp2p3KyqZKSQ=="
     },
     "mime-db": {
-      "version": "1.29.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.29.0.tgz",
-      "integrity": "sha1-SNJtI1WJZRcErFkWygYAGRQmaHg="
+      "version": "1.30.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.30.0.tgz",
+      "integrity": "sha1-dMZD2i3Z1qRTmZY0ZbJtXKfXHwE="
     },
     "mime-types": {
-      "version": "2.1.16",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.16.tgz",
-      "integrity": "sha1-K4WKUuXs1RbbiXrCvodIeDBpjiM="
+      "version": "2.1.17",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.17.tgz",
+      "integrity": "sha1-Cdejk/A+mVp5+K+Fe3Cp4KsWVXo="
     },
     "mimic-fn": {
       "version": "1.1.0",
@@ -8698,9 +8155,9 @@
       "integrity": "sha1-D0WEKVxTo2KK9+bXmsohzlfRxuc="
     },
     "rtl-css-js": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.1.3.tgz",
-      "integrity": "sha1-JHyZl21jSk7XjfwN+KF/9lQMii8="
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.2.0.tgz",
+      "integrity": "sha1-+GeLbCwlB8ivIstpEgfIDIfRz5Q="
     },
     "safe-buffer": {
       "version": "5.1.1",
@@ -9120,9 +8577,9 @@
       "integrity": "sha1-/K0LZLcK+ydpnkJZUMtevNQQvCA="
     },
     "source-map-support": {
-      "version": "0.4.16",
-      "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.4.16.tgz",
-      "integrity": "sha512-A6vlydY7H/ljr4L2UOhDSajQdZQ6dMD7cLH0pzwcmwLyc9u8PNI4WGtnfDDzX7uzGL6c/T+ORL97Zlh+S4iOrg=="
+      "version": "0.4.17",
+      "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.4.17.tgz",
+      "integrity": "sha512-30c1Ch8FSjV0FwC253iftbbj0dU/OXoSg1LAEGZJUlGgjTNj6cu+DVqJWWIZJY5RXLWV4eFtR+4ouo0VIOYOTg=="
     },
     "source-map-url": {
       "version": "0.4.0",
@@ -10229,4 +9686,4 @@
       "integrity": "sha1-AI4G2AlDIMNy28L47XagymyKxBk="
     }
   }
-}
+}
\ No newline at end of file
diff --git a/packages/utilities/jest.config.js b/packages/utilities/jest.config.js
new file mode 100644
index 0000000000000..ffb2cd8b04514
--- /dev/null
+++ b/packages/utilities/jest.config.js
@@ -0,0 +1,3 @@
+let { createConfig } = require('../../scripts/tasks/jest-resources');
+
+module.exports = createConfig();
\ No newline at end of file
diff --git a/packages/utilities/karma.config.js b/packages/utilities/karma.config.js
deleted file mode 100644
index f15fb0199280f..0000000000000
--- a/packages/utilities/karma.config.js
+++ /dev/null
@@ -1,113 +0,0 @@
-'use strict';
-
-// Karma configuration
-// Generated on Thu Oct 08 2015 18:13:05 GMT-0700 (PDT)
-
-let path = require('path');
-// let bindPolyfillPath = resources.bindPolyfillPath;
-let debugRun = (process.argv.indexOf('--debug') > -1);
-let resources = require('../../scripts/tasks/karma-resources');
-
-module.exports = function (config) {
-  let karmaConfig = {
-
-    // base path that will be used to resolve all patterns (eg. files, exclude)
-    basePath: '.',
-
-    // frameworks to use
-    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
-    frameworks: ['mocha', 'sinon-chai'],
-
-
-    // list of files / patterns to load in the browser
-    files: resources.files.concat([
-      path.join('lib', '**', '*.test.js')
-    ]),
-
-
-    // list of files to exclude
-    exclude: [],
-
-
-    // webpack config for bundling tests.
-    webpack: {
-      devtool: 'source-map',
-      module: {
-        loaders: [
-          {
-            test: /sinon\.js$/,
-            loader: 'imports?define=>false',
-            enforce: 'pre'
-          },
-          debugRun ? {} : {
-            test: /\.js/,
-            exclude: /(test|node_modules|bower_components)/,
-            loader: resources.istanbulInstrumenterLoaderPath,
-            enforce: 'post'
-          }
-        ],
-      },
-
-      externals: {
-        'cheerio': 'window',
-        'react/addons': true,
-        'react/lib/ExecutionEnvironment': true,
-        'react/lib/ReactContext': true,
-        'chai': true
-      },
-      resolve: {
-        modules: [
-          path.resolve(__dirname, 'lib'),
-          path.resolve(__dirname, 'node_modules')
-        ]
-      }
-    },
-
-    webpackMiddleware: {
-      noInfo: true
-    },
-
-    // preprocess matching files before serving them to the browser
-    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
-    preprocessors: {
-      [path.join('lib', '/**/*.js')]: ['webpack']
-    },
-
-    plugins: resources.plugins.concat([
-    ]),
-
-    // test results reporter to use
-    // possible values: 'dots', 'progress'
-    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
-    reporters: ['mocha-clean', 'coverage'],
-
-
-    // web server port
-    port: 9876,
-
-
-    // enable / disable colors in the output (reporters and logs)
-    colors: true,
-
-
-    // level of logging
-    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
-    logLevel: config.LOG_INFO,
-
-
-    // enable / disable watching file and executing tests whenever any file changes
-    autoWatch: false,
-
-
-    // start these browsers
-    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
-    browsers: ['PhantomJS'],
-
-
-    // Continuous Integration mode
-    // if true, Karma captures browsers, runs the tests and exits
-    singleRun: true
-  };
-
-  config.set(karmaConfig);
-};
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index bb9f2773d5878..7cd92ab554bf5 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -11,24 +11,23 @@
   "license": "MIT",
   "scripts": {
     "build": "node ../../scripts/build.js",
-    "clean": "node ../../scripts/clean.js"
+    "clean": "node ../../scripts/clean.js",
+    "start-test": "node ../../scripts/start-test.js"
   },
+  "disabledTasks": [
+    "copy",
+    "karma",
+    "webpack"
+  ],
   "devDependencies": {
-    "@types/chai": "3.4.35",
+    "@types/jest": "20.0.8",
     "@types/enzyme": "2.8.0",
-    "@types/es6-promise": "^0.0.32",
-    "@types/es6-weak-map": "1.2.0",
-    "@types/mocha": "2.2.39",
     "@types/prop-types": "15.5.1",
     "@types/react": "15.0.38",
     "@types/react-addons-test-utils": "0.14.18",
     "@types/react-dom": "15.5.1",
     "@types/sinon": "2.2.2",
-    "@types/webpack-env": "1.13.0",
     "enzyme": "^2.7.0",
-    "es6-promise": "^4.1.0",
-    "es6-weak-map": "^2.0.2",
-    "es6-map": "^0.1.5",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
@@ -44,4 +43,4 @@
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/utilities/src/BaseComponent.test.tsx b/packages/utilities/src/BaseComponent.test.tsx
index 15387518b0dff..35cb9529491c7 100644
--- a/packages/utilities/src/BaseComponent.test.tsx
+++ b/packages/utilities/src/BaseComponent.test.tsx
@@ -5,8 +5,6 @@ import * as React from 'react';
 import * as ReactTestUtils from 'react-addons-test-utils';
 import { BaseComponent } from './BaseComponent';
 
-let { assert, expect } = chai;
-
 let _originalOnError = BaseComponent.onError;
 
 class TestComponent extends BaseComponent<{}, {}> {
@@ -81,13 +79,13 @@ describe('BaseComponent', () => {
       <Foo />
     ) as any;
 
-    expect(component.root).to.exist;
+    expect(component.root).toBeDefined();
   });
 });
 
 function _buildTestFor(methodName: string): void {
   it(`calls the error logger on ${methodName} exception`, () => {
-    let lastErrorMessage = null;
+    let lastErrorMessage;
 
     BaseComponent.onError = (errorMessage: string | undefined) => lastErrorMessage = errorMessage;
 
@@ -95,6 +93,6 @@ function _buildTestFor(methodName: string): void {
 
     (c as any)[methodName]();
 
-    assert(lastErrorMessage !== null, 'Error callback not called');
+    expect(lastErrorMessage).toBeDefined();
   });
 }
\ No newline at end of file
diff --git a/packages/utilities/src/EventGroup.test.ts b/packages/utilities/src/EventGroup.test.ts
index 28e9ec056a09a..2f1a7fa942ed0 100644
--- a/packages/utilities/src/EventGroup.test.ts
+++ b/packages/utilities/src/EventGroup.test.ts
@@ -1,7 +1,5 @@
 import { EventGroup } from './EventGroup';
 
-let { expect } = chai;
-
 describe('EventGroup', () => {
   it('can observe an HTML element event', () => {
     let timesCalled = 0;
@@ -18,15 +16,15 @@ describe('EventGroup', () => {
     ev.initEvent('click', true, true);
 
     sourceButton.dispatchEvent(ev);
-    expect(timesCalled).to.equal(1);
+    expect(timesCalled).toEqual(1);
 
     sourceButton.dispatchEvent(ev);
-    expect(timesCalled).to.equal(2);
+    expect(timesCalled).toEqual(2);
 
     eg.dispose();
 
     sourceButton.dispatchEvent(ev);
-    expect(timesCalled).to.equal(2);
+    expect(timesCalled).toEqual(2);
   });
 
   it('can observe an object event', () => {
@@ -43,26 +41,26 @@ describe('EventGroup', () => {
 
     sourceEvents.declare(['foo', 'bar']);
 
-    expect(EventGroup.isDeclared(sourceObject, 'foo')).to.equal(true);
-    expect(EventGroup.isDeclared(sourceObject, 'bar')).to.equal(true);
-    expect(EventGroup.isDeclared(sourceObject, 'baz')).to.equal(false);
+    expect(EventGroup.isDeclared(sourceObject, 'foo')).toEqual(true);
+    expect(EventGroup.isDeclared(sourceObject, 'bar')).toEqual(true);
+    expect(EventGroup.isDeclared(sourceObject, 'baz')).toEqual(false);
 
     parentEvents.on(sourceObject, 'foo, bar', parent.cb);
 
-    expect(EventGroup.isObserved(sourceObject, 'foo')).to.equal(true);
-    expect(EventGroup.isObserved(sourceObject, 'bar')).to.equal(true);
-    expect(EventGroup.isObserved(sourceObject, 'baz')).to.equal(false);
+    expect(EventGroup.isObserved(sourceObject, 'foo')).toEqual(true);
+    expect(EventGroup.isObserved(sourceObject, 'bar')).toEqual(true);
+    expect(EventGroup.isObserved(sourceObject, 'baz')).toEqual(false);
 
     sourceEvents.raise('foo');
-    expect(timesCalled).to.equal(1);
+    expect(timesCalled).toEqual(1);
 
     sourceEvents.raise('bar');
-    expect(timesCalled).to.equal(2);
+    expect(timesCalled).toEqual(2);
 
     parentEvents.dispose();
 
     sourceEvents.raise('thing');
-    expect(timesCalled).to.equal(2);
+    expect(timesCalled).toEqual(2);
   });
 
   it('can bubble object events', () => {
@@ -99,17 +97,17 @@ describe('EventGroup', () => {
     // bubble up to the root.
     grandChildEvents.raise('foo', null, true);
 
-    expect(rootCalled).to.equal(1);
-    expect(childCalled).to.equal(1);
-    expect(grandChildCalled).to.equal(1);
+    expect(rootCalled).toEqual(1);
+    expect(childCalled).toEqual(1);
+    expect(grandChildCalled).toEqual(1);
 
     // cancel at the child.
     childResponse = false;
     grandChildEvents.raise('foo', null, true);
 
-    expect(rootCalled).to.equal(1);
-    expect(childCalled).to.equal(2);
-    expect(grandChildCalled).to.equal(2);
+    expect(rootCalled).toEqual(1);
+    expect(childCalled).toEqual(2);
+    expect(grandChildCalled).toEqual(2);
 
     // dispose all.
     rootEvents.dispose();
@@ -118,9 +116,9 @@ describe('EventGroup', () => {
 
     grandChildEvents.raise('foo', null, true);
 
-    expect(rootCalled).to.equal(1);
-    expect(childCalled).to.equal(2);
-    expect(grandChildCalled).to.equal(2);
+    expect(rootCalled).toEqual(1);
+    expect(childCalled).toEqual(2);
+    expect(grandChildCalled).toEqual(2);
   });
 
   it('can cancelBubble/preventDefault if false is returned on an element event callback', () => {
@@ -156,21 +154,21 @@ describe('EventGroup', () => {
       grandChildButton.dispatchEvent(ev);
 
       // verify we bubble.
-      expect(childCalled).to.equal(1, 'child not 1');
-      expect(rootCalled).to.equal(1);
+      expect(childCalled).toEqual(1);
+      expect(rootCalled).toEqual(1);
 
       // now return false at the child, shouldn't hit root.
       childResponse = false;
       grandChildButton.dispatchEvent(ev);
-      expect(childCalled).to.equal(2);
-      expect(rootCalled).to.equal(1);
+      expect(childCalled).toEqual(2);
+      expect(rootCalled).toEqual(1);
 
       parentEvents.dispose();
 
       grandChildButton.dispatchEvent(ev);
 
-      expect(childCalled).to.equal(2);
-      expect(rootCalled).to.equal(1);
+      expect(childCalled).toEqual(2);
+      expect(rootCalled).toEqual(1);
     } finally {
       document.body.removeChild(rootDiv);
 
@@ -197,39 +195,39 @@ describe('EventGroup', () => {
     parentEvents.on(sourceObject, 'foo', parent.cb2);
 
     sourceEvents.raise('foo');
-    expect(cb1Called).to.equal(1);
-    expect(cb1Called).to.equal(1);
+    expect(cb1Called).toEqual(1);
+    expect(cb1Called).toEqual(1);
 
     // remove one.
     parentEvents.off(sourceObject, 'foo', parent.cb1);
     sourceEvents.raise('foo');
-    expect(cb1Called).to.equal(1);
-    expect(cb2Called).to.equal(2);
+    expect(cb1Called).toEqual(1);
+    expect(cb2Called).toEqual(2);
 
     // attach it again.
     parentEvents.on(sourceObject, 'foo', parent.cb1);
     sourceEvents.raise('foo');
-    expect(cb1Called).to.equal(2);
-    expect(cb2Called).to.equal(3);
+    expect(cb1Called).toEqual(2);
+    expect(cb2Called).toEqual(3);
 
     // detatch both based on event name.
     parentEvents.off(sourceObject, 'foo');
     sourceEvents.raise('foo');
-    expect(cb1Called).to.equal(2);
-    expect(cb2Called).to.equal(3);
+    expect(cb1Called).toEqual(2);
+    expect(cb2Called).toEqual(3);
 
     // attach it again.
     parentEvents.on(sourceObject, 'foo', parent.cb1);
     parentEvents.on(sourceObject, 'foo', parent.cb2);
     sourceEvents.raise('foo');
-    expect(cb1Called).to.equal(3);
-    expect(cb2Called).to.equal(4);
+    expect(cb1Called).toEqual(3);
+    expect(cb2Called).toEqual(4);
 
     // detach based on object.
     parentEvents.off(sourceObject);
     sourceEvents.raise('foo');
-    expect(cb1Called).to.equal(3);
-    expect(cb2Called).to.equal(4);
+    expect(cb1Called).toEqual(3);
+    expect(cb2Called).toEqual(4);
   });
 
   it('can raise custom html events', () => {
@@ -246,14 +244,14 @@ describe('EventGroup', () => {
 
     EventGroup.raise(sourceButton, 'foobar');
 
-    expect(timesCalled).to.equal(1);
+    expect(timesCalled).toEqual(1);
 
     EventGroup.raise(sourceButton, 'foobar');
-    expect(timesCalled).to.equal(2);
+    expect(timesCalled).toEqual(2);
 
     eg.dispose();
 
     EventGroup.raise(sourceButton, 'foobar');
-    expect(timesCalled).to.equal(2);
+    expect(timesCalled).toEqual(2);
   });
 });
diff --git a/packages/utilities/src/array.test.ts b/packages/utilities/src/array.test.ts
index 8478acd8a46ba..c2f774d3cd20a 100644
--- a/packages/utilities/src/array.test.ts
+++ b/packages/utilities/src/array.test.ts
@@ -1,5 +1,4 @@
 import { findIndex, find, createArray, removeIndex } from './array';
-let { expect } = chai;
 
 describe('array utils tests', () => {
   describe('findIndex tests', () => {
@@ -7,21 +6,21 @@ describe('array utils tests', () => {
       const array = [0, 1, 2];
       const index = findIndex(array, () => false);
 
-      expect(index).equals(-1);
+      expect(index).toEqual(-1);
     });
 
     it('should return the correct index when the predicate satisfies the condition', () => {
       const array = [0, 1, 2];
       const index = findIndex(array, (elem: number) => elem === 1);
 
-      expect(index).equals(1);
+      expect(index).toEqual(1);
     });
 
     it('should return the first index when repeated elements satisfy the predicate', () => {
       const array = [0, 1, 2, 2];
       const index = findIndex(array, (elem: number) => elem === 2);
 
-      expect(index).equals(2);
+      expect(index).toEqual(2);
     });
   });
 
@@ -30,21 +29,21 @@ describe('array utils tests', () => {
       const array = [0, 1, 2];
       const item = find(array, () => false);
 
-      expect(item).equals(undefined);
+      expect(item).toEqual(undefined);
     });
 
     it('should return the correct item when the predicate satisfies the condition', () => {
       const array = [{ id: 0 }, { id: 1 }, { id: 2 }, { id: 3 }];
       const item = find(array, (elem: { id: number }) => elem.id === 1);
 
-      expect(item).equals(array[1]);
+      expect(item).toEqual(array[1]);
     });
 
     it('should return the first index when repeated elements satisfy the predicate', () => {
       const array = [8, 9, 10, 11];
       const item = find(array, (elem: number) => elem === 10);
 
-      expect(item).equals(10);
+      expect(item).toEqual(10);
     });
   });
 
@@ -52,7 +51,7 @@ describe('array utils tests', () => {
     it('creates an array while invoking the callback', () => {
       let result = createArray(4, (index: number) => String.fromCharCode('a'.charCodeAt(0) + index));
 
-      expect(result).to.deep.equal(['a', 'b', 'c', 'd']);
+      expect(result).toEqual(['a', 'b', 'c', 'd']);
     });
   });
 
@@ -60,25 +59,25 @@ describe('array utils tests', () => {
     it('should return a new array instead of mutating the existing array', () => {
       const array = [0, 1, 2];
       const result = removeIndex(array, 0);
-      expect(result).to.not.equal(array);
+      expect(result).not.toBe(array);
     });
 
     it('should remove the first element of the array', () => {
       const array = [0, 1, 2];
       const result = removeIndex(array, 0);
-      expect(result).to.deep.equal([1, 2]);
+      expect(result).toEqual([1, 2]);
     });
 
     it('should remove the last element of the array', () => {
       const array = [0, 1, 2];
       const result = removeIndex(array, 2);
-      expect(result).to.deep.equal([0, 1]);
+      expect(result).toEqual([0, 1]);
     });
 
     it('should remove the element in the middle of the array', () => {
       const array = [0, 1, 2];
       const result = removeIndex(array, 1);
-      expect(result).to.deep.equal([0, 2]);
+      expect(result).toEqual([0, 2]);
     });
   });
 });
\ No newline at end of file
diff --git a/packages/utilities/src/autobind.test.ts b/packages/utilities/src/autobind.test.ts
index c119af377f1f6..a04a12eba2cd4 100644
--- a/packages/utilities/src/autobind.test.ts
+++ b/packages/utilities/src/autobind.test.ts
@@ -1,4 +1,3 @@
-let { expect } = chai;
 import { autobind } from './autobind';
 
 class Greeter {
@@ -16,7 +15,7 @@ describe('autobind', () => {
     let greeter = new Greeter();
     let sayHello = greeter.sayHello;
 
-    expect(sayHello()).equals('hello', 'autobind did not bind the sayHello method to the object instance.');
+    expect(sayHello()).toEqual('hello');
   });
 
   it('does not bind again every time method is called', () => {
@@ -25,6 +24,6 @@ describe('autobind', () => {
     const sayHello1 = greeter.sayHello;
     const sayHello2 = greeter.sayHello;
 
-    expect(sayHello1).equals(sayHello2, 'autobind did not cache the bound method.');
+    expect(sayHello1).toEqual(sayHello2);
   });
 });
diff --git a/packages/utilities/src/common/tests.ts b/packages/utilities/src/common/tests.ts
deleted file mode 100644
index 13fa7bc7d3b38..0000000000000
--- a/packages/utilities/src/common/tests.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-// Polyfills
-import 'es6-weak-map/implement';
-import 'es6-map/implement';
-
-/**
- * This is a test entry point to help karma-webpack find all tests in the project.
- **/
-
-// Before loading modules, treat errors and warnings as test failures.
-console.error = console.warn = (warning: string) => {
-  throw new Error(warning);
-};
-
-const testContext = require.context('..', true, /.+\.test\.js?$/);
-
-testContext.keys().forEach(testContext);
-module.exports = testContext;
diff --git a/packages/utilities/src/css.test.ts b/packages/utilities/src/css.test.ts
index b6c6595569922..d9bb6442b6f12 100644
--- a/packages/utilities/src/css.test.ts
+++ b/packages/utilities/src/css.test.ts
@@ -1,21 +1,19 @@
 import { css } from './css';
 
-let { expect } = chai;
-
 describe('css', () => {
   it('can join classes', () => {
-    expect(css('a', 'b', 'c')).equals('a b c');
+    expect(css('a', 'b', 'c')).toEqual('a b c');
   });
 
   it('can handle null/undefined/false/blanks', () => {
-    expect(css('a', null, undefined, false, 'b', 'c')).equals('a b c');
+    expect(css('a', null, undefined, false, 'b', 'c')).toEqual('a b c');
   });
 
   it('can handle an object with a toString', () => {
-    expect(css('a', { toString: () => 'b' }, 'c')).equals('a b c');
+    expect(css('a', { toString: () => 'b' }, 'c')).toEqual('a b c');
   });
 
   it('can handle a class map', () => {
-    expect(css('a', { 'b': true, 'z': false }, 'c')).equals('a b c');
+    expect(css('a', { 'b': true, 'z': false }, 'c')).toEqual('a b c');
   });
 });
diff --git a/packages/utilities/src/customizable.test.tsx b/packages/utilities/src/customizable.test.tsx
index d16320432650b..d518178097dad 100644
--- a/packages/utilities/src/customizable.test.tsx
+++ b/packages/utilities/src/customizable.test.tsx
@@ -4,8 +4,6 @@ import { customizable } from './customizable';
 import { Customizer } from './Customizer';
 import { GlobalSettings } from './GlobalSettings';
 
-let { expect } = chai;
-
 @customizable(['name', 'name2'])
 class Foo extends React.Component<{ field: string; }, {}> {
   public name: any;
@@ -20,20 +18,20 @@ describe('customizable', () => {
   it('can inject customizations', () => {
     GlobalSettings.setValue('name', 'defaultName');
 
-    expect(ReactDOM.renderToStaticMarkup(<Foo field='name' />)).equals('<div>defaultName</div>');
-    expect(ReactDOM.renderToStaticMarkup(<Foo field='name2' />)).equals('<div></div>');
+    expect(ReactDOM.renderToStaticMarkup(<Foo field='name' />)).toEqual('<div>defaultName</div>');
+    expect(ReactDOM.renderToStaticMarkup(<Foo field='name2' />)).toEqual('<div></div>');
 
     expect(ReactDOM.renderToStaticMarkup(
       <Customizer settings={ { name: 'customName' } }>
         <Foo field='name' />
       </Customizer>
-    )).equals('<div>customName</div>');
+    )).toEqual('<div>customName</div>');
 
     expect(ReactDOM.renderToStaticMarkup(
       <Customizer settings={ { name2: 'customName' } }>
         <Foo field='name2' />
       </Customizer>
-    )).equals('<div>customName</div>');
+    )).toEqual('<div>customName</div>');
   });
 
 });
diff --git a/packages/utilities/src/dom.test.ts b/packages/utilities/src/dom.test.ts
index b5660f47f2f7c..25499fe042dbb 100644
--- a/packages/utilities/src/dom.test.ts
+++ b/packages/utilities/src/dom.test.ts
@@ -6,8 +6,6 @@ import {
   elementContains
 } from './dom';
 
-const { expect } = chai;
-
 let unattachedSvg = document.createElement('svg');
 let unattachedDiv = document.createElement('div');
 let parentDiv = document.createElement('div');
@@ -17,23 +15,23 @@ parentDiv.appendChild(childDiv);
 
 describe('elementContains', () => {
   it('can find a child', () => {
-    expect(elementContains(parentDiv, childDiv)).equals(true);
+    expect(elementContains(parentDiv, childDiv)).toEqual(true);
   });
 
   it('can return false on an unattached child', () => {
-    expect(elementContains(parentDiv, unattachedDiv)).equals(false);
+    expect(elementContains(parentDiv, unattachedDiv)).toEqual(false);
   });
 
   it('can return false on a null child', () => {
-    expect(elementContains(parentDiv, null)).equals(false);
+    expect(elementContains(parentDiv, null)).toEqual(false);
   });
 
   it('can return false on a null parent', () => {
-    expect(elementContains(null, null)).equals(false);
+    expect(elementContains(null, null)).toEqual(false);
   });
 
   it('can return false when parent is an svg', () => {
-    expect(elementContains(unattachedSvg, unattachedDiv)).equals(false);
+    expect(elementContains(unattachedSvg, unattachedDiv)).toEqual(false);
   });
 });
 
@@ -44,15 +42,15 @@ describe('getParent', () => {
     childSvg.appendChild(svgRectangle);
     parentDiv.appendChild(childSvg);
 
-    expect(getParent(svgRectangle)).equals(childSvg);
-    expect(getParent(childSvg)).equals(parentDiv);
+    expect(getParent(svgRectangle)).toEqual(childSvg);
+    expect(getParent(childSvg)).toEqual(parentDiv);
   });
 });
 
 describe('getWindow', () => {
   it('returns undefined in server environment', () => {
     setSSR(true);
-    expect(getWindow()).equals(undefined);
+    expect(getWindow()).toEqual(undefined);
     setSSR(false);
   });
 });
@@ -60,7 +58,7 @@ describe('getWindow', () => {
 describe('getDocument', () => {
   it('returns undefined in server environment', () => {
     setSSR(true);
-    expect(getDocument()).equals(undefined);
+    expect(getDocument()).toEqual(undefined);
     setSSR(false);
   });
 });
diff --git a/packages/utilities/src/focus.test.tsx b/packages/utilities/src/focus.test.tsx
index 9abc71b98930c..23b9d0747d7ae 100644
--- a/packages/utilities/src/focus.test.tsx
+++ b/packages/utilities/src/focus.test.tsx
@@ -1,11 +1,8 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
-
 import * as ReactDOM from 'react-dom';
 import * as ReactTestUtils from 'react-addons-test-utils';
-let { expect } = chai;
-
 import { isElementVisible, isElementTabbable } from './focus';
 
 let _hiddenElement: HTMLElement | undefined;
@@ -40,15 +37,15 @@ function _initialize(): void {
 describe('isElementVisible', () => {
   beforeEach(() => _initialize());
   it('returns false if data-is-visible is false', () => {
-    expect(isElementVisible(_hiddenElement)).equals(false, 'Element is not visible');
+    expect(isElementVisible(_hiddenElement)).toEqual(false);
   });
 
   it('returns true if data-is-visible is true', () => {
-    expect(isElementVisible(_visibleElement)).equals(true, 'Element is visible');
+    expect(isElementVisible(_visibleElement)).toEqual(true);
   });
 
   it('returns true if data-is-visible is undefined but element is visible', () => {
-    expect(isElementVisible(_element)).equals(true, 'Element is visible but data-is-visible is undefined');
+    expect(isElementVisible(_element)).toEqual(true);
   });
 
 });
@@ -56,13 +53,13 @@ describe('isElementVisible', () => {
 describe('isElementTabbable', () => {
 
   it('returns false on null', () => {
-    expect(isElementVisible(null)).is.false;
+    expect(isElementVisible(null)).toEqual(false);
   });
 
   it('returns false on normal divs', () => {
     let div = document.createElement('div');
 
-    expect(isElementTabbable(div)).is.false;
+    expect(isElementTabbable(div)).toEqual(false);
   });
 
   it('returns false on disabled buttons', () => {
@@ -70,32 +67,32 @@ describe('isElementTabbable', () => {
 
     button.setAttribute('disabled', 'true');
 
-    expect(isElementTabbable(button)).is.false;
+    expect(isElementTabbable(button)).toEqual(false);
 
   });
 
   it('returns true on buttons', () => {
     let button = document.createElement('button');
 
-    expect(isElementTabbable(button)).is.true;
+    expect(isElementTabbable(button)).toEqual(true);
   });
 
   it('returns true on anchors', () => {
     let anchor = document.createElement('a');
 
-    expect(isElementTabbable(anchor)).is.true;
+    expect(isElementTabbable(anchor)).toEqual(true);
   });
 
   it('returns true on input elements', () => {
     let input = document.createElement('input');
 
-    expect(isElementTabbable(input)).is.true;
+    expect(isElementTabbable(input)).toEqual(true);
   });
 
   it('returns true on textarea elements', () => {
     let textarea = document.createElement('textarea');
 
-    expect(isElementTabbable(textarea)).is.true;
+    expect(isElementTabbable(textarea)).toEqual(true);
   });
 
   it('works with tabbable divs', () => {
@@ -103,7 +100,7 @@ describe('isElementTabbable', () => {
 
     div.tabIndex = 0;
 
-    expect(isElementTabbable(div)).is.true;
+    expect(isElementTabbable(div)).toEqual(true);
   });
 
   it('returns true with role=button divs', () => {
@@ -111,7 +108,7 @@ describe('isElementTabbable', () => {
 
     div.setAttribute('role', 'button');
 
-    expect(isElementTabbable(div)).is.true;
+    expect(isElementTabbable(div)).toEqual(true);
   });
 
   it('returns false with role=button disabled buttons', () => {
@@ -120,7 +117,7 @@ describe('isElementTabbable', () => {
     button.setAttribute('role', 'button');
     button.setAttribute('disabled', 'true');
 
-    expect(isElementTabbable(button)).is.false;
+    expect(isElementTabbable(button)).toEqual(false);
   });
 
 });
\ No newline at end of file
diff --git a/packages/utilities/src/initials.test.ts b/packages/utilities/src/initials.test.ts
index 462004f6a2c91..9d76d15b22e14 100644
--- a/packages/utilities/src/initials.test.ts
+++ b/packages/utilities/src/initials.test.ts
@@ -1,104 +1,102 @@
 import { getInitials } from './initials';
 
-let { expect } = chai;
-
 describe('getInitials', () => {
   it('handles null inputs', () => {
     let result = getInitials(null, false);
-    expect(result).to.equal('');
+    expect(result).toEqual('');
 
     result = getInitials(undefined, false);
-    expect(result).to.equal('');
+    expect(result).toEqual('');
   });
 
   it('calculates an expected initials in LTR', () => {
     let result = getInitials('Kat Larrson', false);
-    expect(result).to.equal('KL');
+    expect(result).toEqual('KL');
   });
 
   it('calculates an expected initials in LTR for non-ASCII characters', () => {
     let result = getInitials('Írissa Þórðardóttir', false);
-    expect(result).to.equal('ÍÞ');
+    expect(result).toEqual('ÍÞ');
 
     result = getInitials('Øyvind Åsen', false);
-    expect(result).to.equal('ØÅ');
+    expect(result).toEqual('ØÅ');
   });
 
   it('calculates an expected initials in LTR with a hypen', () => {
     let result = getInitials('David Zearing-Goff', false);
-    expect(result).to.equal('DZ');
+    expect(result).toEqual('DZ');
   });
 
   it('calculates an expected initials in LTR with numbers', () => {
     let result = getInitials('4lex 4loo', false);
-    expect(result).to.equal('44');
+    expect(result).toEqual('44');
   });
 
   it('calculates an expected initials in LTR with parentheses', () => {
     let result = getInitials('David (The man) Goff', false);
-    expect(result).to.equal('DG');
+    expect(result).toEqual('DG');
   });
 
   it('calculates an expected initials in LTR with multiple parentheses, extra spaces, and unwanted characters', () => {
     let result = getInitials(' !@#$%^&*()=+ (Alpha) David   (The man) `~<>,./?[]{}|\   Goff   (Gamma)    ', false);
-    expect(result).to.equal('DG');
+    expect(result).toEqual('DG');
   });
 
   it('calculates an expected initials in RTL if one was not specified', () => {
     let result = getInitials('Kat Larrson', true);
-    expect(result).to.equal('LK');
+    expect(result).toEqual('LK');
   });
 
   it('calculates an expected initials in LTR for names with multiple components', () => {
     let result = getInitials('A', false);
-    expect(result).to.equal('A');
+    expect(result).toEqual('A');
 
     result = getInitials('A B', false);
-    expect(result).to.equal('AB');
+    expect(result).toEqual('AB');
 
     result = getInitials('A B C', false);
-    expect(result).to.equal('AC');
+    expect(result).toEqual('AC');
 
     result = getInitials('A B C D', false);
-    expect(result).to.equal('A');
+    expect(result).toEqual('A');
   });
 
   it('calculates an expected initials for Arabic names', () => {
     let result = getInitials('خسرو رحیمی', true);
-    expect(result).to.equal('');
+    expect(result).toEqual('');
   });
 
   it('calculates an expected initials for Chinese names', () => {
     let result = getInitials('桂英', false);
-    expect(result).to.equal('');
+    expect(result).toEqual('');
 
     result = getInitials('佳', false);
-    expect(result).to.equal('');
+    expect(result).toEqual('');
 
     result = getInitials('宋智洋', false);
-    expect(result).to.equal('');
+    expect(result).toEqual('');
   });
 
   it('calculates an expected initials for Korean names', () => {
     let result = getInitials('강현', false);
-    expect(result).to.equal('');
+    expect(result).toEqual('');
 
     result = getInitials('최종래', false);
-    expect(result).to.equal('');
+    expect(result).toEqual('');
 
     result = getInitials('남궁 성종', false);
-    expect(result).to.equal('');
+    expect(result).toEqual('');
   });
 
   it('calculates an expected initials for Japanese names', () => {
     let result = getInitials('松田', false);
-    expect(result).to.equal('');
+    expect(result).toEqual('');
 
     result = getInitials('海野', false);
-    expect(result).to.equal('');
+    expect(result).toEqual('');
 
     result = getInitials('かり', false);
-    expect(result).to.equal('');
+    expect(result).toEqual('');
   });
 
 });
diff --git a/packages/utilities/src/math.test.ts b/packages/utilities/src/math.test.ts
index 3482b61557e4c..a3a8f0b705682 100644
--- a/packages/utilities/src/math.test.ts
+++ b/packages/utilities/src/math.test.ts
@@ -1,6 +1,4 @@
-
 import { fitContentToBounds } from './math';
-import { expect } from 'chai';
 
 describe('math', () => {
   describe('#fitContentToBounds', () => {
@@ -16,7 +14,7 @@ describe('math', () => {
             height: 200
           },
           mode: 'contain'
-        })).to.deep.equal({
+        })).toEqual({
           width: 200,
           height: 150
         });
@@ -33,7 +31,7 @@ describe('math', () => {
             height: 200
           },
           mode: 'contain'
-        })).to.deep.equal({
+        })).toEqual({
           width: 150,
           height: 200
         });
@@ -50,7 +48,7 @@ describe('math', () => {
             height: 200
           },
           mode: 'contain'
-        })).to.deep.equal({
+        })).toEqual({
           width: 100,
           height: 75
         });
@@ -68,7 +66,7 @@ describe('math', () => {
           },
           mode: 'contain',
           maxScale: 2
-        })).to.deep.equal({
+        })).toEqual({
           width: 200,
           height: 150
         });
@@ -87,7 +85,7 @@ describe('math', () => {
             height: 200
           },
           mode: 'cover'
-        })).to.deep.equal({
+        })).toEqual({
           width: 300,
           height: 200
         });
@@ -104,7 +102,7 @@ describe('math', () => {
             height: 200
           },
           mode: 'cover'
-        })).to.deep.equal({
+        })).toEqual({
           width: 200,
           height: 300
         });
@@ -121,7 +119,7 @@ describe('math', () => {
             height: 200
           },
           mode: 'cover'
-        })).to.deep.equal({
+        })).toEqual({
           width: 100,
           height: 50
         });
@@ -139,7 +137,7 @@ describe('math', () => {
           },
           mode: 'cover',
           maxScale: 4
-        })).to.deep.equal({
+        })).toEqual({
           width: 400,
           height: 200
         });
diff --git a/packages/utilities/src/memoize.test.ts b/packages/utilities/src/memoize.test.ts
index ca9d57891af9d..c75c09939ce30 100644
--- a/packages/utilities/src/memoize.test.ts
+++ b/packages/utilities/src/memoize.test.ts
@@ -1,23 +1,13 @@
-import { memoize, memoizeFunction, setMemoizeWeakMap } from './memoize';
-import weakMapPolyfill = require('es6-weak-map');
-
-let { expect } = chai;
+import { memoize, memoizeFunction } from './memoize';
 
 describe('memoizeFunction', () => {
-  before(() => {
-    setMemoizeWeakMap(weakMapPolyfill);
-  });
-
-  after(() => {
-    setMemoizeWeakMap(undefined);
-  });
 
   it('can return a cached result with a no args function', () => {
     let _timesCalled = 0;
     let memoizeFunctiondTimesCalled = memoizeFunction(() => ++_timesCalled);
 
-    expect(memoizeFunctiondTimesCalled()).equals(1);
-    expect(memoizeFunctiondTimesCalled()).equals(1);
+    expect(memoizeFunctiondTimesCalled()).toEqual(1);
+    expect(memoizeFunctiondTimesCalled()).toEqual(1);
   });
 
   it('can return a cached result with a 2 arg function', () => {
@@ -26,12 +16,12 @@ describe('memoizeFunction', () => {
     let objA = { val: 'a' };
     let objB = { val: 'b' };
 
-    expect(combine(objA, objA)).equals('aa1');
-    expect(combine(objA, objA)).equals('aa1');
-    expect(combine(objA, objB)).equals('ab2');
-    expect(combine(objA, objB)).equals('ab2');
-    expect(combine(objB, objA)).equals('ba3');
-    expect(combine(objB, objA)).equals('ba3');
+    expect(combine(objA, objA)).toEqual('aa1');
+    expect(combine(objA, objA)).toEqual('aa1');
+    expect(combine(objA, objB)).toEqual('ab2');
+    expect(combine(objA, objB)).toEqual('ab2');
+    expect(combine(objB, objA)).toEqual('ba3');
+    expect(combine(objB, objA)).toEqual('ba3');
   });
 
   it('can return a cached result with falsy args', () => {
@@ -40,10 +30,10 @@ describe('memoizeFunction', () => {
     let objA = { val: 'a' };
     let objB = { val: 'b' };
 
-    expect(combine(objA, objA)).equals('aa1');
-    expect(combine(objA, undefined)).equals('a2');
-    expect(combine(null, objB)).equals('b3');
-    expect(combine(false, 0)).equals('4');
+    expect(combine(objA, objA)).toEqual('aa1');
+    expect(combine(objA, undefined)).toEqual('a2');
+    expect(combine(null, objB)).toEqual('b3');
+    expect(combine(false, 0)).toEqual('4');
   });
 
   it('works if you pass less arguments on subsequent calls', () => {
@@ -53,12 +43,12 @@ describe('memoizeFunction', () => {
       b: string = ''
     ) => a + b + count++);
 
-    expect(func('hi', 'world')).equals('hiworld0');
-    expect(func('hi', 'world')).equals('hiworld0');
-    expect(func('hi')).equals('hi1');
-    expect(func('hi')).equals('hi1');
-    expect(func()).equals('2');
-    expect(func()).equals('2');
+    expect(func('hi', 'world')).toEqual('hiworld0');
+    expect(func('hi', 'world')).toEqual('hiworld0');
+    expect(func('hi')).toEqual('hi1');
+    expect(func('hi')).toEqual('hi1');
+    expect(func()).toEqual('2');
+    expect(func()).toEqual('2');
   });
 
   it('works if you pass more arguments on subsequent calls', () => {
@@ -68,12 +58,12 @@ describe('memoizeFunction', () => {
       b: string = ''
     ) => a + b + count++);
 
-    expect(func()).equals('0');
-    expect(func()).equals('0');
-    expect(func('hi')).equals('hi1');
-    expect(func('hi')).equals('hi1');
-    expect(func('hi', 'world')).equals('hiworld2');
-    expect(func('hi', 'world')).equals('hiworld2');
+    expect(func()).toEqual('0');
+    expect(func()).toEqual('0');
+    expect(func('hi')).toEqual('hi1');
+    expect(func('hi')).toEqual('hi1');
+    expect(func('hi', 'world')).toEqual('hiworld2');
+    expect(func('hi', 'world')).toEqual('hiworld2');
   });
 
   it('resets after resetCount limit is reached.', () => {
@@ -82,26 +72,19 @@ describe('memoizeFunction', () => {
       a: string
     ) => a + count++, 1);
 
-    expect(func('a')).equals('a0');
-    expect(func('a')).equals('a0');
-    expect(func('b')).equals('b1');
-    expect(func('b')).equals('b2');
-    expect(func('b')).equals('b2');
-    expect(func('a')).equals('a3');
-    expect(func('a')).equals('a4');
-    expect(func('a')).equals('a4');
+    expect(func('a')).toEqual('a0');
+    expect(func('a')).toEqual('a0');
+    expect(func('b')).toEqual('b1');
+    expect(func('b')).toEqual('b2');
+    expect(func('b')).toEqual('b2');
+    expect(func('a')).toEqual('a3');
+    expect(func('a')).toEqual('a4');
+    expect(func('a')).toEqual('a4');
   });
 
 });
 
 describe('memoize', () => {
-  before(() => {
-    setMemoizeWeakMap(weakMapPolyfill);
-  });
-
-  after(() => {
-    setMemoizeWeakMap(undefined);
-  });
 
   it('can work on multiple instances of a class', () => {
     let _count = 0;
@@ -116,23 +99,10 @@ describe('memoize', () => {
 
     let f = new Foo();
 
-    expect(f.bar('hi')).equals('hi0');
-    expect(f.bar('hi')).equals('hi0');
-    expect(f.bar('bye')).equals('bye1');
-    expect(f.bar('bye')).equals('bye1');
+    expect(f.bar('hi')).toEqual('hi0');
+    expect(f.bar('hi')).toEqual('hi0');
+    expect(f.bar('bye')).toEqual('bye1');
+    expect(f.bar('bye')).toEqual('bye1');
   });
 
 });
-
-describe('memoizeFunctionWithoutPolyfill', () => {
-  it('passes through function without polyfill', () => {
-    let count = 0;
-    let func = memoizeFunction((
-      a: string
-    ) => a + count++, 1);
-
-    expect(func('a')).equals('a0');
-    expect(func('a')).equals('a1');
-    expect(func('a')).equals('a2');
-  });
-});
diff --git a/packages/utilities/src/object.test.ts b/packages/utilities/src/object.test.ts
index b665d9a5872d3..12f21f5b59793 100644
--- a/packages/utilities/src/object.test.ts
+++ b/packages/utilities/src/object.test.ts
@@ -1,7 +1,5 @@
 import { assign, filteredAssign } from './object';
 
-let { assert, expect } = chai;
-
 describe('assign', () => {
   it('can copy an object', () => {
     let source = {
@@ -15,10 +13,9 @@ describe('assign', () => {
     let resultTarget = {};
     let result = assign(resultTarget, source);
 
-    assert(result !== source, 'result was same as source');
-    assert(result === resultTarget, 'target was not returned');
-
-    expect(result).to.eql(source, 'result did not equal source');
+    expect(result).not.toBe(source);
+    expect(result).toBe(resultTarget);
+    expect(result).toEqual(source);
   });
 });
 
@@ -30,7 +27,7 @@ describe('filteredAssign', () => {
     };
     let result = filteredAssign((propName: string) => propName !== 'b', {}, source);
 
-    expect(result.a).to.equal(1);
-    expect(result.b).to.equal(undefined, 'b was not excluded');
+    expect(result.a).toEqual(1);
+    expect(result.b).toBeUndefined();
   });
 });
\ No newline at end of file
diff --git a/packages/utilities/src/overflow.test.ts b/packages/utilities/src/overflow.test.ts
index 29b95c84bc662..014b8359090da 100644
--- a/packages/utilities/src/overflow.test.ts
+++ b/packages/utilities/src/overflow.test.ts
@@ -4,53 +4,38 @@ import {
   hasOverflow
 } from './overflow';
 
-let { expect } = chai;
-
 describe('overflow', () => {
-  let content: HTMLDivElement;
-  let element: HTMLDivElement;
-
-  beforeEach(() => {
-    content = document.createElement('div');
-    content.style.minWidth = '200px';
-    content.style.minHeight = '200px';
-
-    element = document.createElement('div');
-    element.style.overflow = 'auto';
-    element.style.maxWidth = '100px';
-    element.style.maxHeight = '100px';
-    element.appendChild(content);
-
-    // Add to dom to force layout
-    document.body.appendChild(element);
-  });
-
-  afterEach(() => {
-    element.remove();
-  });
-
-  it('detects overflow', () => {
-    expect(hasOverflow(element)).to.be.true;
-
-    content.style.minWidth = '50px';
-    content.style.minHeight = '50px';
-
-    expect(hasOverflow(element)).to.be.false;
+  it('returns false when no overflow is present', () => {
+    expect(hasOverflow({
+      clientWidth: 10,
+      clientHeight: 10,
+      scrollWidth: 10,
+      scrollHeight: 10
+    } as any)).toEqual(false);
   });
 
   it('detects horizontal overflow', () => {
-    expect(hasHorizontalOverflow(element)).to.be.true;
-
-    content.style.minWidth = '50px';
-
-    expect(hasHorizontalOverflow(element)).to.be.false;
+    const elementWithOverflow = {
+      clientWidth: 10,
+      clientHeight: 10,
+      scrollWidth: 20,
+      scrollHeight: 10
+    };
+
+    expect(hasOverflow(elementWithOverflow as any)).toEqual(true);
+    expect(hasHorizontalOverflow(elementWithOverflow as any)).toEqual(true);
   });
 
   it('detects vertical overflow', () => {
-    expect(hasVerticalOverflow(element)).to.be.true;
-
-    content.style.minHeight = '50px';
-
-    expect(hasVerticalOverflow(element)).to.be.false;
+    const elementWithOverflow = {
+      clientWidth: 10,
+      clientHeight: 10,
+      scrollWidth: 10,
+      scrollHeight: 20
+    };
+
+    expect(hasOverflow(elementWithOverflow as any)).toEqual(true);
+    expect(hasVerticalOverflow(elementWithOverflow as any)).toEqual(true);
   });
-});
\ No newline at end of file
+
+});
diff --git a/packages/utilities/src/properties.test.ts b/packages/utilities/src/properties.test.ts
index b3b8621cdceed..2e814aca6e774 100644
--- a/packages/utilities/src/properties.test.ts
+++ b/packages/utilities/src/properties.test.ts
@@ -3,7 +3,6 @@ import {
   divProperties
 } from './properties';
 import * as React from 'react';
-let { expect } = chai;
 
 describe('getNativeProps', () => {
 
@@ -11,14 +10,14 @@ describe('getNativeProps', () => {
     let result = getNativeProps<React.HTMLAttributes<HTMLDivElement>>({
       'data-automation-id': 1
     }, divProperties);
-    expect((result as any)['data-automation-id']).equals(1);
+    expect((result as any)['data-automation-id']).toEqual(1);
   });
 
   it('can pass through aria tags', () => {
     let result = getNativeProps<React.HTMLAttributes<HTMLDivElement>>({
       'aria-label': 1
     }, divProperties);
-    expect((result as any)['aria-label']).equals(1);
+    expect((result as any)['aria-label']).toEqual(1);
   });
 
   it('can pass through basic div properties and events', () => {
@@ -27,10 +26,11 @@ describe('getNativeProps', () => {
       onClick: () => { /* no-op */ },
       onClickCapture: () => { /* no-op */ }
     }, divProperties);
-    expect(result.className).equals('foo');
-    expect(result.onClick).is.instanceof(Function, 'onClick not function');
+    expect(result.className).toEqual('foo');
+    expect(typeof result.onClick).toEqual('function');
+
     // tslint:disable-next-line:no-string-literal
-    expect((result as any)['onClickCapture']).is.instanceof(Function, 'onClickCapture not function');
+    expect(typeof (result as any)['onClickCapture']).toEqual('function');
   });
 
   it('can remove unexpected properties', () => {
@@ -38,15 +38,15 @@ describe('getNativeProps', () => {
       'foobar': 1,
       className: 'hi'
     }, divProperties);
-    expect(result.className).equals('hi');
-    expect((result as any)['foobar']).equals(undefined); // tslint:disable-line:no-string-literal
+    expect(result.className).toEqual('hi');
+    expect((result as any)['foobar']).toEqual(undefined); // tslint:disable-line:no-string-literal
   });
 
   it('can exclude properties', () => {
     let result = getNativeProps<any>({ a: 1, b: 2 }, ['a', 'b'], ['b']);
 
-    expect(result.a).to.exist;
-    expect(result.b).to.not.exist;
+    expect(result.a).toBeDefined();
+    expect(result.b).toBeUndefined();
   });
 
 });
\ No newline at end of file
diff --git a/packages/utilities/src/rtl.test.ts b/packages/utilities/src/rtl.test.ts
index a41a5847db8ad..ff7f809a0407f 100644
--- a/packages/utilities/src/rtl.test.ts
+++ b/packages/utilities/src/rtl.test.ts
@@ -1,17 +1,15 @@
 import { getRTL, setRTL } from './rtl';
 import { setSSR } from './dom';
 
-let { expect } = chai;
-
 describe('rtl', () => {
   it('can set and get the rtl setting on the server', () => {
     setSSR(true);
 
     setRTL(true);
-    expect(getRTL()).is.true;
+    expect(getRTL()).toEqual(true);
 
     setRTL(false);
-    expect(getRTL()).is.false;
+    expect(getRTL()).toEqual(false);
 
     setSSR(false);
   });
diff --git a/packages/utilities/src/scroll.test.ts b/packages/utilities/src/scroll.test.ts
deleted file mode 100644
index 9759c14b79cc2..0000000000000
--- a/packages/utilities/src/scroll.test.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-import {
-  disableBodyScroll,
-  enableBodyScroll
-} from './scroll';
-
-let { expect } = chai;
-
-describe('setBodyScroll', () => {
-  it('can disable/enable scroll', () => {
-    let style;
-
-    disableBodyScroll();
-    style = getComputedStyle(document.body);
-    expect(style.overflow).equals('hidden', 'overflow was not hidden.');
-
-    disableBodyScroll();
-    style = getComputedStyle(document.body);
-    expect(style.overflow).equals('hidden', 'overflow did not stay hidden.');
-
-    enableBodyScroll();
-    style = getComputedStyle(document.body);
-    expect(style.overflow).equals('hidden', 'overflow did not stay hidden on first enable.');
-
-    enableBodyScroll();
-    style = getComputedStyle(document.body);
-    expect(style.overflow).equals('visible', 'overflow did not become visible on second enable.');
-  });
-});
\ No newline at end of file
diff --git a/packages/utilities/src/warn.test.ts b/packages/utilities/src/warn.test.ts
index 91accd94c5bed..4cc4b7040af72 100644
--- a/packages/utilities/src/warn.test.ts
+++ b/packages/utilities/src/warn.test.ts
@@ -5,7 +5,6 @@ import {
   warnConditionallyRequiredProps
 } from './warn';
 
-let { expect } = chai;
 let _lastWarning: string | undefined;
 
 describe('warnDeprecations', () => {
@@ -18,17 +17,17 @@ describe('warnDeprecations', () => {
 
   it('does not warn when unnecessary', () => {
     warnDeprecations('Foo', { bar: 1 }, { 'foo': null } as any);
-    expect(_lastWarning).equals(undefined);
+    expect(_lastWarning).toEqual(undefined);
   });
 
   it('can warn on a deprecated prop', () => {
     warnDeprecations('Foo', { foo: 1 }, { 'foo': null } as any);
-    expect(_lastWarning).equals(`Foo property 'foo' was used but has been deprecated.`);
+    expect(_lastWarning).toEqual(`Foo property 'foo' was used but has been deprecated.`);
   });
 
   it('can warn on a deprecated prop with replacement', () => {
     warnDeprecations('Foo', { foo: 1 }, { 'foo': 'bar' });
-    expect(_lastWarning).equals(`Foo property 'foo' was used but has been deprecated. Use 'bar' instead.`);
+    expect(_lastWarning).toEqual(`Foo property 'foo' was used but has been deprecated. Use 'bar' instead.`);
   });
 });
 
@@ -42,12 +41,12 @@ describe('warnMutuallyExclusive', () => {
 
   it('does not warn when unnecessary', () => {
     warnMutuallyExclusive('Foo', { foo: 1 }, { 'foo': 'bar' });
-    expect(_lastWarning).equals(undefined);
+    expect(_lastWarning).toEqual(undefined);
   });
 
   it('can warn on mutual exlusive props', () => {
     warnMutuallyExclusive('Foo', { foo: 1, bar: 1 }, { 'foo': 'bar' } as any);
-    expect(_lastWarning).equals(`Foo property 'foo' is mutually exclusive with 'bar'. Use one or the other.`);
+    expect(_lastWarning).toEqual(`Foo property 'foo' is mutually exclusive with 'bar'. Use one or the other.`);
   });
 });
 
@@ -61,11 +60,11 @@ describe('warnConditionallyRequiredProps', () => {
 
   it('does not warn when unnecessary', () => {
     warnConditionallyRequiredProps('Foo', { Foo: 1, Bar: 1 }, ['Foo', 'Bar'], 'Foo', 'foo' === 'foo');
-    expect(_lastWarning).equals(undefined);
+    expect(_lastWarning).toEqual(undefined);
   });
 
   it('can warn on required props', () => {
     warnConditionallyRequiredProps('Foo', { Foo: 1, bar: 1 }, ['Foo', 'Bar'], 'Foo', 'foo' === 'foo');
-    expect(_lastWarning).equals(`Foo property 'Bar' is required when 'Foo' is used.'`);
+    expect(_lastWarning).toEqual(`Foo property 'Bar' is required when 'Foo' is used.'`);
   });
 });
diff --git a/packages/utilities/tsconfig.json b/packages/utilities/tsconfig.json
index 1a6505460b499..91bde3c819ddb 100644
--- a/packages/utilities/tsconfig.json
+++ b/packages/utilities/tsconfig.json
@@ -17,9 +17,7 @@
     "forceConsistentCasingInFileNames": true,
     "moduleResolution": "node",
     "types": [
-      "chai",
-      "mocha",
-      "webpack-env"
+      "jest"
     ]
   },
   "include": [
diff --git a/scripts/start-test.js b/scripts/start-test.js
index aa49cb957d653..12593916a820e 100644
--- a/scripts/start-test.js
+++ b/scripts/start-test.js
@@ -1,3 +1,3 @@
 require('./tasks/jest')({
-  'args': '--watch'
+  'args': '--watch -i'
 });;
diff --git a/scripts/tasks/jest-resources.js b/scripts/tasks/jest-resources.js
index 718b611da7b1d..b1f577f0f421a 100644
--- a/scripts/tasks/jest-resources.js
+++ b/scripts/tasks/jest-resources.js
@@ -1,6 +1,12 @@
 const path = require('path');
 
 module.exports = {
+  createRawConfig: () => (
+    {
+      rootDir: 'lib',
+      "testRegex": "(/__tests__/.*|\\.(test|spec))\\.js$",
+    }
+  ),
   createConfig: () => (
     {
       moduleNameMapper: {

From 017faf1afb99aaa2e3307c09c50c84edb94fc2b4 Mon Sep 17 00:00:00 2001
From: Eddie Liu <leddie24@gmail.com>
Date: Tue, 5 Sep 2017 11:25:06 -0700
Subject: [PATCH 0566/1641] Fix scrollablepane not removing stickyContainer on
 componentUnmount (#2698)

* Fix scrollablepane not removing stickyContainer on componentUnmount
Fix Sticky not removing itself on componentUnmount
Unsubscribe Sticky on unmount

* Set height as inherit for scrollablePane

* Add change file
---
 ...scrollablepane-fixes_2017-09-01-18-23.json | 11 +++
 .../ScrollablePane/ScrollablePane.scss        |  1 +
 .../ScrollablePane/ScrollablePane.tsx         | 95 +++++++++++--------
 .../src/components/Sticky/Sticky.tsx          | 20 ++++
 4 files changed, 85 insertions(+), 42 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-edwliu-scrollablepane-fixes_2017-09-01-18-23.json

diff --git a/common/changes/office-ui-fabric-react/v-edwliu-scrollablepane-fixes_2017-09-01-18-23.json b/common/changes/office-ui-fabric-react/v-edwliu-scrollablepane-fixes_2017-09-01-18-23.json
new file mode 100644
index 0000000000000..1b79d6f877553
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-edwliu-scrollablepane-fixes_2017-09-01-18-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ScrollablePane: Fix component to remove stickyContainer element on component unmount.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-edwliu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.scss b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.scss
index f1f8a72e83790..603fce30cc860 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.scss
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.scss
@@ -3,6 +3,7 @@
 .root {
   overflow-y: auto;
   max-height: inherit;
+  height: inherit;
   -webkit-overflow-scrolling: touch;
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
index e8078ec0cd4c2..3de20c5e103ad 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
@@ -29,25 +29,27 @@ export class ScrollablePane extends BaseComponent<IScrollablePaneProps, {}> {
     stickyBelow: HTMLElement;
   };
 
-  private _subscribers: Function[];
-  private _stickyAbove: Sticky[];
-  private _stickyBelow: Sticky[];
+  private _subscribers: Set<Function>;
+  private _stickyAbove: Set<Sticky>;
+  private _stickyBelow: Set<Sticky>;
 
   constructor(props: IScrollablePaneProps) {
     super(props);
-    this._subscribers = [];
-    this._stickyAbove = [];
-    this._stickyBelow = [];
+    this._subscribers = new Set<Function>();
+    this._stickyAbove = new Set<Sticky>();
+    this._stickyBelow = new Set<Sticky>();
   }
 
   public getChildContext() {
     return {
       scrollablePane: {
         subscribe: this.subscribe,
+        unsubscribe: this.unsubscribe,
         addStickyHeader: this.addStickyHeader,
         removeStickyHeader: this.removeStickyHeader,
         addStickyFooter: this.addStickyFooter,
         removeStickyFooter: this.removeStickyFooter,
+        notifySubscribers: this.notifySubscribers
       }
     };
   }
@@ -55,27 +57,25 @@ export class ScrollablePane extends BaseComponent<IScrollablePaneProps, {}> {
   public componentDidMount() {
     const { root, stickyContainer, stickyAbove, stickyBelow } = this.refs;
 
-    this._events.on(root, 'scroll', this._notifySubscribers);
+    this._events.on(root, 'scroll', this.notifySubscribers);
     this._events.on(window, 'resize', this._onWindowResize);
     setTimeout(() => {
       this._resizeContainer();
       if (stickyContainer.parentElement && root.parentElement) {
         stickyContainer.parentElement.removeChild(stickyContainer);
         root.parentElement.insertBefore(stickyContainer, root.nextSibling);
-        this._notifySubscribers();
-        if (this._stickyAbove.length > 1) {
-          this._sortStickies(this._stickyAbove, stickyAbove);
-        }
-        if (this._stickyBelow.length > 1) {
-          this._sortStickies(this._stickyBelow, stickyBelow);
-        }
+        this.notifySubscribers();
       }
     }, 500);
   }
 
   public componentWillUnmount() {
+    const { stickyContainer } = this.refs;
     this._events.off(this.refs.root);
     this._events.off(window);
+    if (stickyContainer.parentElement) {
+      stickyContainer.parentElement.removeChild(stickyContainer);
+    }
   }
 
   public render() {
@@ -97,7 +97,12 @@ export class ScrollablePane extends BaseComponent<IScrollablePaneProps, {}> {
 
   @autobind
   public subscribe(handler: (headerBound: ClientRect, footerBound: ClientRect) => void) {
-    this._subscribers = this._subscribers.concat(handler);
+    this._subscribers.add(handler);
+  }
+
+  @autobind
+  public unsubscribe(handler: (headerBound: ClientRect, footerBound: ClientRect) => void) {
+    this._subscribers.delete(handler);
   }
 
   @autobind
@@ -126,12 +131,26 @@ export class ScrollablePane extends BaseComponent<IScrollablePaneProps, {}> {
     this._removeSticky(sticky, this._stickyBelow, this.refs.stickyBelow);
   }
 
-  private _addSticky(sticky: Sticky, stickyList: Sticky[], container: HTMLElement, addStickyToContainer: () => void) {
-    if (stickyList.indexOf(sticky) < 0) {
-      stickyList.push(sticky);
+  @autobind
+  public notifySubscribers(sort?: boolean): void {
+    const { stickyAbove, stickyBelow } = this.refs;
+    this._subscribers.forEach((handle) => {
+      handle(stickyAbove.getBoundingClientRect(), stickyBelow.getBoundingClientRect());
+    });
+    if (this._stickyAbove.size > 1) {
+      this._sortStickies(this._stickyAbove, stickyAbove);
+    }
+    if (this._stickyBelow.size > 1) {
+      this._sortStickies(this._stickyBelow, stickyBelow);
+    }
+  }
+
+  private _addSticky(sticky: Sticky, stickyList: Set<Sticky>, container: HTMLElement, addStickyToContainer: () => void) {
+    if (!stickyList.has(sticky)) {
+      stickyList.add(sticky);
       addStickyToContainer();
       sticky.content.addEventListener('transitionend',
-        this._setPlaceholderHeights.bind(null, stickyList, container),
+        this._setPlaceholderHeights.bind(null, stickyList),
         false);
       if (sticky.props.stickyClassName) {
         setTimeout(() => {
@@ -140,17 +159,16 @@ export class ScrollablePane extends BaseComponent<IScrollablePaneProps, {}> {
           }
         }, 1);
       }
-      this._notifySubscribers();
-      this._setPlaceholderHeights(stickyList, container);
+      this.notifySubscribers();
+      this._setPlaceholderHeights(stickyList);
     }
   }
 
-  private _removeSticky(sticky: Sticky, stickyList: Sticky[], container: HTMLElement) {
-    const indexOfSticky = stickyList.indexOf(sticky);
-    if (indexOfSticky >= 0) {
+  private _removeSticky(sticky: Sticky, stickyList: Set<Sticky>, container: HTMLElement) {
+    if (stickyList.has(sticky)) {
       sticky.content.removeEventListener('transitionend',
         this._setPlaceholderHeights.bind(null, stickyList, container));
-      stickyList.splice(indexOfSticky, 1);
+      stickyList.delete(sticky);
     }
   }
 
@@ -158,9 +176,9 @@ export class ScrollablePane extends BaseComponent<IScrollablePaneProps, {}> {
     const { stickyAbove, stickyBelow } = this.refs;
     setTimeout(() => {
       this._resizeContainer();
-      this._notifySubscribers();
-      this._setPlaceholderHeights(this._stickyAbove, stickyAbove);
-      this._setPlaceholderHeights(this._stickyBelow, stickyBelow);
+      this.notifySubscribers();
+      this._setPlaceholderHeights(this._stickyAbove);
+      this._setPlaceholderHeights(this._stickyBelow);
     }, 5);
   }
 
@@ -178,29 +196,22 @@ export class ScrollablePane extends BaseComponent<IScrollablePaneProps, {}> {
   }
 
   @autobind
-  private _setPlaceholderHeights(stickies: Sticky[], element: HTMLElement) {
-    const { stickyAbove, stickyBelow } = this.refs;
+  private _setPlaceholderHeights(stickies: Set<Sticky>) {
     stickies.forEach((sticky, idx) => {
-      sticky.setPlaceholderHeight(element.children[idx].clientHeight);
+      sticky.setPlaceholderHeight(sticky.content.clientHeight);
     });
   }
 
-  private _sortStickies(stickyList: Sticky[], container: HTMLElement): void {
-    stickyList.sort((a, b) => {
+  private _sortStickies(stickyList: Set<Sticky>, container: HTMLElement): void {
+    let stickyArr = Array.from(stickyList);
+    stickyArr = stickyArr.sort((a, b) => {
       return a.refs.root.offsetTop - b.refs.root.offsetTop;
     });
     while (container.lastChild) {
-      this.refs.stickyBelow.removeChild(container.lastChild);
+      container.removeChild(container.lastChild);
     }
-    stickyList.forEach((sticky) => {
+    stickyArr.forEach((sticky) => {
       container.appendChild(sticky.content);
     });
   }
-
-  private _notifySubscribers() {
-    const { stickyAbove, stickyBelow } = this.refs;
-    this._subscribers.forEach((handle) => {
-      handle(stickyAbove.getBoundingClientRect(), stickyBelow.getBoundingClientRect());
-    });
-  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
index 5351fe104deb4..a441253d8dafc 100644
--- a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
+++ b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
@@ -40,10 +40,12 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
   public context: {
     scrollablePane: {
       subscribe: (handler: Function) => void;
+      unsubscribe: (handler: Function) => void;
       addStickyHeader: (sticky: Sticky) => void;
       removeStickyHeader: (sticky: Sticky) => void;
       addStickyFooter: (sticky: Sticky) => void;
       removeStickyFooter: (sticky: Sticky) => void;
+      notifySubscribers: (sort?: boolean) => void;
     }
   };
 
@@ -69,6 +71,23 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
     this.content.style.background = this._getBackground();
     ReactDOM.render(<div>{ this.props.children }</div>, this.content);
     this.refs.root.appendChild(this.content);
+    this.context.scrollablePane.notifySubscribers(true);
+  }
+
+  public componentWillUnmount() {
+    const { isStickyTop, isStickyBottom } = this.state;
+    const { scrollablePane } = this.context;
+    if (isStickyTop) {
+      this._resetSticky(() => {
+        scrollablePane.removeStickyHeader(this);
+      });
+    }
+    if (isStickyBottom) {
+      this._resetSticky(() => {
+        scrollablePane.removeStickyFooter(this);
+      });
+    }
+    scrollablePane.unsubscribe(this._onScrollEvent);
   }
 
   public componentDidUpdate(prevProps: IStickyProps, prevState: IStickyState) {
@@ -135,6 +154,7 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
       isStickyBottom: canStickyFooter && ((!isStickyBottom && bottom >= footerBound.top) || (isStickyBottom && top > footerBound.top))
     });
   }
+
   private _setSticky(callback: () => void) {
     if (this.content.parentElement) {
       this.content.parentElement.removeChild(this.content);

From bf7abdfd174cf7f51e3ca5f39bb5bba476210d4a Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 5 Sep 2017 12:37:46 -0700
Subject: [PATCH 0567/1641] Added booleans to bestpractices

---
 ghdocs/BESTPRACTICES.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ghdocs/BESTPRACTICES.md b/ghdocs/BESTPRACTICES.md
index bb52e61eab4da..2d3d873343e49 100644
--- a/ghdocs/BESTPRACTICES.md
+++ b/ghdocs/BESTPRACTICES.md
@@ -67,7 +67,7 @@ interface IButton {
 
 ## Naming guidance
 
-### Flags
+### Flags(Booleans)
 
 Property flags should be as consistent as possible with given html guidelines.
 

From 9d2dc9540265de67d34c20f61a112b8eb47d3cf2 Mon Sep 17 00:00:00 2001
From: jijizz <liu_zhi8@hotmail.com>
Date: Tue, 5 Sep 2017 13:18:51 -0700
Subject: [PATCH 0568/1641] List should virtualize on correct props (#2672)

* give up-to-date property to shouldVirtualize

* rush change

* Update zhiliu-shouldVirtualizeOnCorrectProps_2017-08-29-23-12.json

* fix lint error

* Update List.tsx

* Update List.tsx

* Update List.tsx

* Update List.tsx

* Update List.tsx

* Update List.tsx

* Update List.tsx

* Update List.tsx

* Update List.tsx

* Update List.tsx

* Update List.tsx
---
 ...ualizeOnCorrectProps_2017-08-29-23-12.json | 11 +++++++
 .../src/components/List/List.tsx              | 32 +++++++++----------
 2 files changed, 27 insertions(+), 16 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/zhiliu-shouldVirtualizeOnCorrectProps_2017-08-29-23-12.json

diff --git a/common/changes/office-ui-fabric-react/zhiliu-shouldVirtualizeOnCorrectProps_2017-08-29-23-12.json b/common/changes/office-ui-fabric-react/zhiliu-shouldVirtualizeOnCorrectProps_2017-08-29-23-12.json
new file mode 100644
index 0000000000000..ff6e304d82c6a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/zhiliu-shouldVirtualizeOnCorrectProps_2017-08-29-23-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "List: fixing minor issue around using the `shouldVirtualize` prop.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "zhiliu@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index 28881e8fd474c..134c7752931bb 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -344,11 +344,11 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     );
   }
 
-  private _shouldVirtualize(): boolean {
+  private _shouldVirtualize(props: IListProps = this.props): boolean {
     const {
       onShouldVirtualize
-    } = this.props;
-    return !onShouldVirtualize || onShouldVirtualize(this.props);
+    } = props;
+    return !onShouldVirtualize || onShouldVirtualize(props);
   }
 
   /**
@@ -535,18 +535,14 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     this.forceUpdate();
   }
 
-  private _updatePages(props?: IListProps) {
-    let { items, startIndex, renderCount } = (props || this.props);
-
-    renderCount = this._getRenderCount(props);
-
+  private _updatePages(props: IListProps = this.props) {
     // console.log('updating pages');
 
     if (!this._requiredRect) {
       this._updateRenderRects(props);
     }
 
-    let newListState = this._buildPages(items as any[], startIndex as number, renderCount);
+    let newListState = this._buildPages(props);
     let oldListPages = this.state.pages;
 
     this.setState(newListState, () => {
@@ -558,7 +554,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
         this._materializedRect = null;
         if (!this._hasCompletedFirstRender) {
           this._hasCompletedFirstRender = true;
-          this._updatePages();
+          this._updatePages(props);
         } else {
           this._onAsyncScroll();
         }
@@ -675,7 +671,11 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   }
 
   /** Build up the pages that should be rendered. */
-  private _buildPages(items: any[], startIndex: number, renderCount: number): IListState {
+  private _buildPages(props: IListProps): IListState {
+    let { items, startIndex, renderCount, getPageHeight } = props;
+
+    renderCount = this._getRenderCount(props);
+
     const materializedRect = { ...EMPTY_RECT };
     const pages: IPage[] = [];
 
@@ -683,17 +683,17 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     let pageTop = 0;
     let currentSpacer = null;
     let focusedIndex = this._focusedIndex;
-    let endIndex = startIndex + renderCount;
-    const shouldVirtualize = this._shouldVirtualize();
+    let endIndex = startIndex! + renderCount;
+    const shouldVirtualize = this._shouldVirtualize(props);
 
     // First render is very important to track; when we render cells, we have no idea of estimated page height.
     // So we should default to rendering only the first page so that we can get information.
     // However if the user provides a measure function, let's just assume they know the right heights.
-    let isFirstRender = this._estimatedPageHeight === 0 && !this.props.getPageHeight;
+    let isFirstRender = this._estimatedPageHeight === 0 && !getPageHeight;
 
     const allowedRect = this._allowedRect;
 
-    for (let itemIndex = startIndex; itemIndex < endIndex; itemIndex += itemsPerPage) {
+    for (let itemIndex = startIndex!; itemIndex < endIndex; itemIndex += itemsPerPage) {
       const pageSpecification = this._getPageSpecification(itemIndex, allowedRect);
       const pageHeight = pageSpecification.height;
       const pageData = pageSpecification.data;
@@ -720,7 +720,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
         }
 
         let itemsInPage = Math.min(itemsPerPage, endIndex - itemIndex);
-        let newPage = this._createPage(undefined, items.slice(itemIndex, itemIndex + itemsInPage), itemIndex, undefined, undefined, pageData);
+        let newPage = this._createPage(undefined, items!.slice(itemIndex, itemIndex + itemsInPage), itemIndex, undefined, undefined, pageData);
 
         newPage.top = pageTop;
         newPage.height = pageHeight;

From dc814239a9a35c160c8dc08f9eb4f2b2f9abb54d Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Tue, 5 Sep 2017 13:24:17 -0700
Subject: [PATCH 0569/1641] First pass removing unused variables from Fabric
 pkg (#2733)

---
 .../src/components/Breadcrumb/Breadcrumb.tsx       |  4 +---
 .../Button/ActionButton/ActionButton.styles.ts     |  4 ----
 .../src/components/Button/BaseButton.tsx           | 13 +------------
 .../Button/CommandButton/CommandButton.tsx         |  1 -
 .../Button/CompoundButton/CompoundButton.styles.ts |  4 ----
 .../Button/DefaultButton/DefaultButton.styles.ts   |  1 -
 .../Button/IconButton/IconButton.styles.ts         |  3 ---
 .../Button/SplitButton/SplitButton.styles.ts       |  3 ---
 .../src/components/Calendar/Calendar.tsx           |  2 +-
 .../src/components/Calendar/CalendarDay.tsx        |  2 --
 .../src/components/Checkbox/Checkbox.tsx           |  1 -
 .../src/components/ComboBox/ComboBox.styles.ts     |  7 +++----
 .../src/components/ComboBox/ComboBox.tsx           |  1 -
 .../components/ContextualMenu/ContextualMenu.tsx   | 14 --------------
 .../src/components/Fabric/Fabric.tsx               |  1 +
 .../src/components/FocusZone/FocusZone.tsx         |  4 ----
 .../src/components/Link/Link.tsx                   |  2 --
 .../src/components/ResizeGroup/ResizeGroup.tsx     |  2 +-
 .../src/components/TextField/TextField.tsx         |  1 -
 .../src/components/Tooltip/Tooltip.tsx             |  1 -
 .../components/pickers/AutoFill/BaseAutoFill.tsx   |  1 -
 21 files changed, 8 insertions(+), 64 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
index 35cfe4b408519..fe573ba4f70e8 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
@@ -31,8 +31,6 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
     maxDisplayedItems: 999
   };
 
-  private _id: string;
-
   constructor(props: IBreadcrumbProps) {
     super(props);
   }
@@ -69,7 +67,7 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
 
   @autobind
   private _onRenderBreadcrumb(data: IBreadCrumbData) {
-    let { className, ariaLabel, items, onRenderItem = this._onRenderItem } = data.props;
+    let { className, ariaLabel, onRenderItem = this._onRenderItem } = data.props;
     let { renderedOverflowItems, renderedItems } = data;
 
     let contextualItems = renderedOverflowItems.map(
diff --git a/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.styles.ts
index 74edbe405ea5a..595dd6b173cbd 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.styles.ts
@@ -7,9 +7,6 @@ import { memoizeFunction } from '../../../Utilities';
 import {
   getStyles as getBaseButtonStyles
 } from '../BaseButton.styles';
-import {
-  getStyles as getSplitButtonStyles
-} from '../SplitButton/SplitButton.styles';
 
 const DEFAULT_BUTTON_HEIGHT = '40px';
 const DEFAULT_PADDING = '0 4px';
@@ -21,7 +18,6 @@ export const getStyles = memoizeFunction((
   focusColor?: string
 ): IButtonStyles => {
   let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
-  let splitButtonStyles: IButtonStyles = getSplitButtonStyles(theme);
   let actionButtonStyles: IButtonStyles = {
     root: {
       borderWidth: '0',
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index b4ed68f61eaa7..73bff3e41208f 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -187,8 +187,6 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   private _onRenderContent(tag: any, buttonProps: IButtonProps): JSX.Element {
     let props = this.props;
     let {
-      baseClassName,
-      styles,
       menuIconName,
       menuIconProps,
       menuProps,
@@ -220,12 +218,8 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   @autobind
   private _onRenderIcon(buttonProps?: IButtonProps, defaultRender?: IRenderFunction<IButtonProps>): JSX.Element | null {
     let {
-      baseClassName,
-      disabled,
       icon,
-      iconProps,
-      styles,
-      checked
+      iconProps
        } = this.props;
 
     if (icon || iconProps) {
@@ -247,8 +241,6 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   private _onRenderText(): JSX.Element | null {
     let {
       children,
-      disabled,
-      styles,
       text
             } = this.props;
 
@@ -320,9 +312,6 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   @autobind
   private _onRenderMenuIcon(props: IButtonProps): JSX.Element | null {
     let {
-      baseClassName,
-      checked,
-      disabled,
       menuIconName,
       menuIconProps
        } = this.props;
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx
index 06a1e9d40fec8..7bf6ff9316380 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandButton/CommandButton.tsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { ActionButton } from '../ActionButton/ActionButton';
 
 export const CommandButton = ActionButton;
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
index 888db7bf0da47..53c2b7a4ec943 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
@@ -11,10 +11,6 @@ import {
   getStyles as getSplitButtonStyles
 } from '../SplitButton/SplitButton.styles';
 
-const DEFAULT_BUTTON_HEIGHT = '32px';
-const DEFAULT_BUTTON_MINWIDTH = '80px';
-const DEFAULT_PADDING = '0 16px';
-
 export const getStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: IButtonStyles
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
index e0cd64673e72b..02abd73daee15 100644
--- a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
@@ -14,7 +14,6 @@ import {
 
 const DEFAULT_BUTTON_HEIGHT = '32px';
 const DEFAULT_BUTTON_MINWIDTH = '80px';
-const DEFAULT_PADDING = '0 16px';
 
 export const getStyles = memoizeFunction((
   theme: ITheme,
diff --git a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
index 06432043fe7d5..418aa3d3b62d8 100644
--- a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
@@ -11,9 +11,6 @@ import {
   getStyles as getSplitButtonStyles
 } from '../SplitButton/SplitButton.styles';
 
-const DEFAULT_BUTTON_HEIGHT = '32px';
-const DEFAULT_PADDING = '0 4px';
-
 export const getStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: IButtonStyles
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
index 7a9e90dc363d4..f613dce8686f5 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
@@ -5,9 +5,6 @@ import {
 } from '../../../Styling';
 import { memoizeFunction } from '../../../Utilities';
 
-const DEFAULT_BUTTON_HEIGHT = '32px';
-const DEFAULT_PADDING = '0 4px';
-
 export const getStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: IButtonStyles
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index 5aa87718e36e1..15a6f98a09c84 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -231,7 +231,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
   @autobind
   private _onGotoToday() {
 
-    let { onSelectDate, dateRangeType, firstDayOfWeek, today } = this.props;
+    let { dateRangeType, firstDayOfWeek, today } = this.props;
 
     let dates = getDateRangeArray(today!, dateRangeType!, firstDayOfWeek!);
 
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index fd0dd1cb40da9..b776a9ce409c7 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -82,8 +82,6 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
   }
 
   public componentWillReceiveProps(nextProps: ICalendarDayProps) {
-    const { navigatedDate, selectedDate, today } = nextProps;
-
     this.setState({
       weeks: this._getWeeks(nextProps)
     });
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
index 6e2f00a216144..933c0df675c1b 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
@@ -79,7 +79,6 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
       defaultChecked,
       disabled,
       inputProps,
-      label,
       name,
       boxSide,
       theme,
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index ce05fec67f052..2e5682c3133cf 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -21,7 +21,7 @@ const ComboxBoxCaretDownWidth = '32px';
 const ComboBoxOptionHeight = '36px';
 
 const getDisabledStyles = memoizeFunction((theme: ITheme): IStyle => {
-  const { semanticColors, palette } = theme;
+  const { semanticColors } = theme;
   return {
     backgroundColor: semanticColors.disabledBackground,
     borderColor: semanticColors.disabledBackground,
@@ -35,7 +35,6 @@ const getDisabledStyles = memoizeFunction((theme: ITheme): IStyle => {
 });
 
 const getListOptionHighContrastStyles = memoizeFunction((theme: ITheme): IStyle => {
-  const { semanticColors, palette } = theme;
   return {
     [MS_HIGHCONTRAST_ACTIVE]: {
       backgroundColor: 'Highlight',
@@ -51,7 +50,7 @@ export const getOptionStyles = memoizeFunction((
   customOptionStylesForCurrentOption?: Partial<IComboBoxOptionStyles>,
 ): IComboBoxOptionStyles => {
 
-  const { semanticColors, fonts, palette } = theme;
+  const { semanticColors, palette } = theme;
 
   const ComboBoxOptionBackgroundSelected = semanticColors.menuItemBackgroundChecked;
   const ComboBoxOptionBackgroundHovered = semanticColors.menuItemBackgroundHovered;
@@ -145,7 +144,7 @@ export const getCaretDownButtonStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: Partial<IButtonStyles>,
 ): IButtonStyles => {
-  const { semanticColors, fonts, palette } = theme;
+  const { palette } = theme;
 
   const caretButtonTextColor = palette.neutralDark;
   const caretButtonBackgroundHovered = palette.neutralQuaternaryAlt;
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 2bb16b3f63a16..e779364ecf192 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -8,7 +8,6 @@ import {
   IconButton
 } from '../../Button';
 import { BaseAutoFill } from '../pickers/AutoFill/BaseAutoFill';
-import { IBaseAutoFillProps } from '../pickers/AutoFill/BaseAutoFill.Props';
 import {
   autobind,
   BaseComponent,
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 650a624a5c24d..9cee311e4ac3a 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -54,14 +54,6 @@ enum VerticalAlignmentHint {
   bottom
 }
 
-interface IMenuSizeWindowSizeInfo {
-  hostRect: IRect;
-  targetRect: IRect;
-  menuRect: IRect;
-  windowSize: any;
-  gapSpace: number;
-}
-
 interface IRect {
   left: number;
   top: number;
@@ -71,12 +63,6 @@ interface IRect {
   height: number;
 }
 
-interface IParsedDirectionalHint {
-  contextualMenuType: ContextualMenuType;
-  horizontalAlignmentHint: HorizontalAlignmentHint;
-  verticalAlignmentHint: VerticalAlignmentHint;
-}
-
 export function hasSubmenuItems(item: IContextualMenuItem) {
   let submenuItems = getSubmenuItems(item);
 
diff --git a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
index 01ad2c39d8941..e1967ff5d78d7 100644
--- a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
+++ b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
@@ -43,6 +43,7 @@ if (typeof (document) === 'object' && document.documentElement && !document.docu
 
 @customizable(['theme'])
 export class Fabric extends BaseComponent<IFabricProps, IFabricState> {
+  // tslint:disable-next-line:no-unused-variable
   private _root: HTMLElement;
 
   constructor() {
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 14346d699a2a5..36d41d1cc08c4 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -584,8 +584,6 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   }
 
   private _moveFocusLeft(): boolean {
-    const topAlignment = this._focusAlignment.top;
-
     if (this._moveFocus(getRTL(), (activeRect: ClientRect, targetRect: ClientRect) => {
       let distance = -1;
 
@@ -608,8 +606,6 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   }
 
   private _moveFocusRight(): boolean {
-    const topAlignment = this._focusAlignment.top;
-
     if (this._moveFocus(!getRTL(), (activeRect: ClientRect, targetRect: ClientRect) => {
       let distance = -1;
 
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.tsx b/packages/office-ui-fabric-react/src/components/Link/Link.tsx
index c065dd2f76396..473eb8361ae76 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.tsx
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.tsx
@@ -16,8 +16,6 @@ interface IMyScreen extends Screen {
   top: number;
 }
 
-declare var screen: IMyScreen;
-
 export class Link extends BaseComponent<ILinkProps, any> implements ILink {
   private _link: HTMLElement;
 
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index 00fea97d17202..485a7f0a2b669 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -287,7 +287,7 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
   }
 
   public render() {
-    const { onRenderData, data } = this.props;
+    const { onRenderData } = this.props;
     const { dataToMeasure, renderedData } = this.state;
 
     return (
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index d03f35c821c86..816fc480efdd0 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -278,7 +278,6 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
   }
 
   private _getTextElementClassName(): string {
-    const errorMessage = this._errorMessage;
     let textFieldClassName: string;
 
     if (this.props.multiline && !this.props.resizable) {
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
index 3ab93e854191b..cea2f62b11608 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
@@ -33,7 +33,6 @@ export class Tooltip extends BaseComponent<ITooltipProps, any> {
   public render() {
     const {
       targetElement,
-      content,
       calloutProps,
       directionalHint,
       directionalHintForRTL,
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
index 0043f0e2aed0d..531d27db7ba8a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
@@ -85,7 +85,6 @@ export class BaseAutoFill extends BaseComponent<IBaseAutoFillProps, IBaseAutoFil
   public componentDidUpdate() {
     let value = this._value;
     let {
-      defaultVisibleValue,
       suggestedDisplayValue,
       shouldSelectFullInputValueInComponentDidUpdate
     } = this.props;

From 00a0ba14044b14f75c2a470cdd5cd0738e2a67df Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 5 Sep 2017 20:36:48 +0000
Subject: [PATCH 0570/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...anihan-hoverCard-fix_2017-09-02-00-35.json | 11 ---------
 ...scrollablepane-fixes_2017-09-01-18-23.json | 11 ---------
 ...ualizeOnCorrectProps_2017-08-29-23-12.json | 11 ---------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 24 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 11 ++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 11 files changed, 40 insertions(+), 40 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/anihan-hoverCard-fix_2017-09-02-00-35.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-edwliu-scrollablepane-fixes_2017-09-01-18-23.json
 delete mode 100644 common/changes/office-ui-fabric-react/zhiliu-shouldVirtualizeOnCorrectProps_2017-08-29-23-12.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index ce9f07a857fbf..42fb2aa5fad79 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -44,7 +44,7 @@
     "@uifabric/example-app-base": ">=4.2.7 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=4.40.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.40.1 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 14d54e72e8bda..00020590bf0fe 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.39.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.40.1 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 333a565bdfadd..2254f69e11ca1 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -26,7 +26,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.39.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.40.1 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 300fdeba9555a..4b8c51a9c0169 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -24,7 +24,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=4.39.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.40.1 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/anihan-hoverCard-fix_2017-09-02-00-35.json b/common/changes/office-ui-fabric-react/anihan-hoverCard-fix_2017-09-02-00-35.json
deleted file mode 100644
index 98342a4f52284..0000000000000
--- a/common/changes/office-ui-fabric-react/anihan-hoverCard-fix_2017-09-02-00-35.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "HoverCard: Support change in expanded card height. Add callbacks upon card visible/hide",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "anihan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-edwliu-scrollablepane-fixes_2017-09-01-18-23.json b/common/changes/office-ui-fabric-react/v-edwliu-scrollablepane-fixes_2017-09-01-18-23.json
deleted file mode 100644
index 1b79d6f877553..0000000000000
--- a/common/changes/office-ui-fabric-react/v-edwliu-scrollablepane-fixes_2017-09-01-18-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ScrollablePane: Fix component to remove stickyContainer element on component unmount.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-edwliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/zhiliu-shouldVirtualizeOnCorrectProps_2017-08-29-23-12.json b/common/changes/office-ui-fabric-react/zhiliu-shouldVirtualizeOnCorrectProps_2017-08-29-23-12.json
deleted file mode 100644
index ff6e304d82c6a..0000000000000
--- a/common/changes/office-ui-fabric-react/zhiliu-shouldVirtualizeOnCorrectProps_2017-08-29-23-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "List: fixing minor issue around using the `shouldVirtualize` prop.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "zhiliu@microsoft.com"
-}
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index c2b78f06f770b..40220a4ee85ed 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/styling": ">=0.22.1 <1.0.0",
     "@uifabric/utilities": ">=4.13.0 <5.0.0",
-    "office-ui-fabric-react": ">=4.40.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.40.1 <5.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index d0a66ee360337..4d5cc256ae829 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.40.1",
+      "tag": "office-ui-fabric-react_v4.40.1",
+      "date": "Tue, 05 Sep 2017 20:36:48 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Aniket Handa <atneik@users.noreply.github.com>",
+            "commit": "aabfe574769721a9d7f385920be84cfac3f90a34",
+            "comment": "HoverCard: Support change in expanded card height. Add callbacks upon card visible/hide"
+          },
+          {
+            "author": "Eddie Liu <leddie24@gmail.com>",
+            "commit": "017faf1afb99aaa2e3307c09c50c84edb94fc2b4",
+            "comment": "ScrollablePane: Fix component to remove stickyContainer element on component unmount."
+          },
+          {
+            "author": "jijizz <liu_zhi8@hotmail.com>",
+            "commit": "9d2dc9540265de67d34c20f61a112b8eb47d3cf2",
+            "comment": "List: fixing minor issue around using the `shouldVirtualize` prop."
+          }
+        ]
+      }
+    },
     {
       "version": "4.40.0",
       "tag": "office-ui-fabric-react_v4.40.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 105ab561155b5..11e98d576fe83 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,15 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 04 Sep 2017 10:16:56 GMT and should not be manually modified.
+This log was last generated on Tue, 05 Sep 2017 20:36:48 GMT and should not be manually modified.
+
+## 4.40.1
+Tue, 05 Sep 2017 20:36:48 GMT
+
+### Patches
+
+- HoverCard: Support change in expanded card height. Add callbacks upon card visible/hide
+- ScrollablePane: Fix component to remove stickyContainer element on component unmount.
+- List: fixing minor issue around using the `shouldVirtualize` prop.
 
 ## 4.40.0
 Mon, 04 Sep 2017 10:16:56 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 18db94c82887e..46cbe6d67d92f 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.40.0",
+  "version": "4.40.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 10771104576cbaaa2dac7d3d434976225354eb50 Mon Sep 17 00:00:00 2001
From: Spencer Elliott <me@elliottsj.com>
Date: Tue, 5 Sep 2017 14:33:13 -0700
Subject: [PATCH 0571/1641] Allow rendering empty GroupedList headers (#2732)

---
 .../grouped-list-empty_2017-09-05-18-20.json  | 11 ++++
 .../examples/DetailsList.Grouped.Example.tsx  | 55 ++++++++-----------
 .../GroupedList/GroupedList.Props.ts          |  6 ++
 .../components/GroupedList/GroupedList.tsx    | 12 ++--
 .../src/utilities/selection/Selection.ts      |  4 ++
 5 files changed, 52 insertions(+), 36 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/grouped-list-empty_2017-09-05-18-20.json

diff --git a/common/changes/office-ui-fabric-react/grouped-list-empty_2017-09-05-18-20.json b/common/changes/office-ui-fabric-react/grouped-list-empty_2017-09-05-18-20.json
new file mode 100644
index 0000000000000..6581303a9e925
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/grouped-list-empty_2017-09-05-18-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Allow rendering empty GroupedList headers",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "spelliot@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
index 52ad7a6f25ab6..fc2c0322d6215 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
@@ -50,37 +50,6 @@ let _items = [
   }
 ];
 
-function groupBy(items: any[], fieldName: string) {
-  let groups = items.reduce((currentGroups, currentItem, index) => {
-    let lastCurrentGroup = currentGroups[currentGroups.length - 1];
-    let fieldValue = currentItem[fieldName];
-
-    if (!lastCurrentGroup || lastCurrentGroup.value !== fieldValue) {
-      currentGroups.push({
-        key: 'group' + fieldValue + index,
-        name: `By "${fieldValue}"`,
-        value: fieldValue,
-        startIndex: index,
-        level: 0,
-        count: 0
-      });
-    }
-    if (lastCurrentGroup) {
-      lastCurrentGroup.count = index - lastCurrentGroup.startIndex;
-    }
-    return currentGroups;
-  }, []);
-
-  // Fix last group count
-  let lastGroup = groups[groups.length - 1];
-
-  if (lastGroup) {
-    lastGroup.count = items.length - lastGroup.startIndex;
-  }
-
-  return groups;
-}
-
 export class DetailsListGroupedExample extends React.Component<any, any> {
   constructor() {
     super();
@@ -98,10 +67,32 @@ export class DetailsListGroupedExample extends React.Component<any, any> {
         <DefaultButton onClick={ () => this._addItem() } text='Add an item' />
         <DetailsList
           items={ items }
-          groups={ groupBy(items, 'color') }
+          groups={ [
+            {
+              key: 'groupred0',
+              name: 'By "red"',
+              startIndex: 0,
+              count: 2
+            },
+            {
+              key: 'groupgreen2',
+              name: 'By "green"',
+              startIndex: 2,
+              count: 0
+            },
+            {
+              key: 'groupblue2',
+              name: 'By "blue"',
+              startIndex: 2,
+              count: 3
+            }
+          ] }
           columns={ _columns }
           ariaLabelForSelectAllCheckbox='Toggle selection for all items'
           ariaLabelForSelectionColumn='Toggle selection'
+          groupProps={ {
+            showEmptyGroups: true
+          } }
         />
       </Fabric>
     );
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts
index 40ac3c1d8f6e4..785dfecdd88f7 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts
@@ -203,6 +203,12 @@ export interface IGroupRenderProps {
    * @default CheckboxVisibility.visible
    */
   collapseAllVisibility?: CollapseAllVisibility;
+
+  /**
+   * Boolean indicating if empty groups are shown
+   * @defaultvalue false
+   */
+  showEmptyGroups?: boolean;
 }
 
 export interface IGroupDividerProps {
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
index 055d6438f28b9..2b96894f06b8c 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
@@ -100,8 +100,8 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
               items={ groups }
               onRenderCell={ this._renderGroup }
               getItemCountForPage={ () => 1 }
-              usePageCache = { usePageCache }
-              onShouldVirtualize = { onShouldVirtualize }
+              usePageCache={ usePageCache }
+              onShouldVirtualize={ onShouldVirtualize }
             />
           )
         }
@@ -160,7 +160,11 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
     let footerProps = assign({}, groupProps!.footerProps, dividerProps);
     let groupNestingDepth = this._getGroupNestingDepth();
 
-    return (!group || group.count > 0) ? (
+    if (!groupProps!.showEmptyGroups && group && group.count === 0) {
+      return null;
+    }
+
+    return (
       <GroupedListSection
         ref={ 'group_' + groupIndex }
         key={ this._getGroupKey(group, groupIndex) }
@@ -182,7 +186,7 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
         selection={ selection }
         viewport={ viewport }
       />
-    ) : null;
+    );
   }
 
   private _getGroupKey(group: IGroup, index: number): string {
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts b/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
index 0d1014da79145..59116b8f83383 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
@@ -172,6 +172,10 @@ export class Selection implements ISelection {
   }
 
   public isRangeSelected(fromIndex: number, count: number): boolean {
+    if (count === 0) {
+      return false;
+    }
+
     let endIndex = fromIndex + count;
 
     for (let i = fromIndex; i < endIndex; i++) {

From 13a6d8f297136b60c552fbf80dffc4ebe2cc4d68 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Tue, 5 Sep 2017 18:11:51 -0700
Subject: [PATCH 0572/1641] First and second pass fixing 'jsx-alignment' for
 tslint in Fabric pkg (#2742)

* First pass re-enabling 'jsx-alignment' tslint rule in Fabric pkg

* Second pass re-enabling 'jsx-alignment' tslint rule in Fabric pkg
---
 .../src/VisualTestRoot.tsx                    |  3 +-
 .../components/ActivityItem/ActivityItem.tsx  |  3 +-
 .../src/components/Breadcrumb/Breadcrumb.tsx  |  6 +-
 .../src/components/Button/BaseButton.tsx      |  3 +-
 .../src/components/Calendar/Calendar.tsx      | 27 ++++---
 .../src/components/Calendar/CalendarDay.tsx   | 26 ++++---
 .../src/components/Calendar/CalendarMonth.tsx | 74 ++++++++++---------
 .../src/components/Callout/CalloutContent.tsx |  3 +-
 .../src/components/Check/Check.tsx            | 12 +--
 .../components/ChoiceGroup/ChoiceGroup.tsx    | 26 ++++---
 .../components/ColorPicker/ColorSlider.tsx    |  3 +-
 .../src/components/ComboBox/ComboBox.tsx      | 12 ++-
 .../src/components/CommandBar/CommandBar.tsx  | 22 +++---
 .../ContextualMenu/ContextualMenu.tsx         | 21 ++++--
 .../components/DetailsList/DetailsHeader.tsx  |  3 +-
 .../components/DetailsList/DetailsList.tsx    |  9 ++-
 .../src/components/DetailsList/DetailsRow.tsx |  6 +-
 .../DetailsList/DetailsRowFields.tsx          |  6 +-
 .../components/DocumentCard/DocumentCard.tsx  |  3 +-
 .../DocumentCard/DocumentCardActivity.tsx     |  8 +-
 .../DocumentCard/DocumentCardLocation.tsx     | 10 ++-
 .../DocumentCard/DocumentCardPreview.tsx      | 13 +++-
 .../src/components/Dropdown/Dropdown.tsx      | 19 +++--
 .../FocusTrapZone/FocusTrapZone.tsx           |  3 +-
 .../components/GroupedList/GroupHeader.tsx    |  9 ++-
 .../components/HoverCard/ExpandingCard.tsx    | 11 +--
 .../src/components/Icon/Icon.tsx              | 11 +--
 .../src/components/Label/Label.tsx            |  3 +-
 .../src/components/List/List.tsx              |  9 ++-
 .../MarqueeSelection/MarqueeSelection.tsx     | 10 ++-
 .../src/components/MessageBar/MessageBar.tsx  | 29 +++++---
 .../src/components/Modal/Modal.tsx            |  3 +-
 .../src/components/Nav/Nav.tsx                | 18 +++--
 .../src/components/Panel/Panel.tsx            |  3 +-
 .../src/components/Persona/Persona.tsx        |  3 +-
 .../src/components/Pivot/Pivot.tsx            | 16 ++--
 .../src/components/Pivot/PivotItem.tsx        |  3 +-
 .../src/components/Popup/Popup.tsx            |  3 +-
 .../ProgressIndicator/ProgressIndicator.tsx   |  3 +-
 .../src/components/Rating/Rating.tsx          | 22 ++++--
 .../ScrollablePane/ScrollablePane.tsx         |  3 +-
 .../src/components/Slider/Slider.tsx          |  7 +-
 .../src/components/SpinButton/SpinButton.tsx  |  8 +-
 .../src/components/Spinner/Spinner.tsx        | 22 +++---
 .../TeachingBubble/TeachingBubbleContent.tsx  | 14 ++--
 .../pickers/AutoFill/BaseAutoFill.tsx         |  3 +-
 .../src/components/pickers/BasePicker.tsx     | 27 ++++---
 .../PeoplePickerItems/SelectedItemDefault.tsx |  6 +-
 .../pickers/Suggestions/Suggestions.tsx       | 23 ++++--
 .../components/pickers/TagPicker/TagItem.tsx  |  3 +-
 .../src/utilities/grid/Grid.tsx               |  9 ++-
 51 files changed, 370 insertions(+), 232 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/VisualTestRoot.tsx b/packages/office-ui-fabric-react/src/VisualTestRoot.tsx
index 5748011362299..03b129c7f57bb 100644
--- a/packages/office-ui-fabric-react/src/VisualTestRoot.tsx
+++ b/packages/office-ui-fabric-react/src/VisualTestRoot.tsx
@@ -69,7 +69,8 @@ function _getAppRoutes(): JSX.Element[] {
       <Route
         key={ pathIndex }
         path={ '#/' + url }
-        getComponent={ getPath(path) } />);
+        getComponent={ getPath(path) }
+      />);
   });
   return routes;
 }
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
index f476313bb3d96..d135265f2380a 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
@@ -128,7 +128,8 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
             className={ this._classNames.activityPersona }
             size={ showSize16Personas ? PersonaSize.size16 : PersonaSize.extraSmall }
             hidePersonaDetails={ true }
-            style={ style } />
+            style={ style }
+          />
         );
       });
       personaElement = <div className={ this._classNames.personaContainer }>{ personaList }</div>;
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
index fe573ba4f70e8..a3d55ff3fdf73 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
@@ -113,7 +113,8 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
                   { onRenderItem(item, this._onRenderItem) }
                   <Icon
                     className={ css('ms-Breadcrumb-chevron', styles.chevron) }
-                    iconName={ getRTL() ? 'ChevronLeft' : 'ChevronRight' } />
+                    iconName={ getRTL() ? 'ChevronLeft' : 'ChevronRight' }
+                  />
                 </li>
               )) }
           </ol>
@@ -130,7 +131,8 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
           className={ css('ms-Breadcrumb-itemLink', styles.itemLink) }
           href={ item.href }
           aria-current={ item.isCurrentItem ? 'page' : null }
-          onClick={ this._onBreadcrumbClicked.bind(this, item) }>
+          onClick={ this._onBreadcrumbClicked.bind(this, item) }
+        >
           <TooltipHost
             content={ item.text }
             overflowMode={ TooltipOverflowMode.Parent }
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 73bff3e41208f..18f3d87fa676c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -407,7 +407,8 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         disabled={ this.props.disabled }
         onClick={ this._onToggleMenu }
         menuProps={ undefined }
-        iconProps={ menuIconProps } />
+        iconProps={ menuIconProps }
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index 15a6f98a09c84..d0aa124ec2569 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -122,14 +122,16 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
 
     return (
       <div className={ css(rootClass, styles.root) } ref='root' role='application'>
-        <div className={ css(
-          'ms-DatePicker-picker ms-DatePicker-picker--opened ms-DatePicker-picker--focused',
-          styles.picker,
-          styles.pickerIsOpened,
-          styles.pickerIsFocused,
-          isMonthPickerVisible && ('ms-DatePicker-monthPickerVisible ' + styles.monthPickerVisible),
-          isMonthPickerVisible && isDayPickerVisible && ('ms-DatePicker-calendarsInline ' + styles.calendarsInline),
-        ) } >
+        <div
+          className={ css(
+            'ms-DatePicker-picker ms-DatePicker-picker--opened ms-DatePicker-picker--focused',
+            styles.picker,
+            styles.pickerIsOpened,
+            styles.pickerIsFocused,
+            isMonthPickerVisible && ('ms-DatePicker-monthPickerVisible ' + styles.monthPickerVisible),
+            isMonthPickerVisible && isDayPickerVisible && ('ms-DatePicker-calendarsInline ' + styles.calendarsInline),
+          ) }
+        >
           <div className={ css('ms-DatePicker-holder ms-slideDownIn10', styles.holder) } onKeyDown={ this._onDatePickerPopupKeyDown }>
             <div className={ css('ms-DatePicker-frame', styles.frame) }>
               <div className={ css('ms-DatePicker-wrap', styles.wrap, showGoToToday && styles.goTodaySpacing) }>
@@ -147,7 +149,8 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   onHeaderSelect={ onHeaderSelect }
                   navigationIcons={ navigationIcons! }
                   dateTimeFormatter={ this.props.dateTimeFormatter! }
-                  ref='dayPicker' />
+                  ref='dayPicker'
+                />
                 }
 
                 { isMonthPickerVisible && <CalendarMonth
@@ -159,7 +162,8 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   onHeaderSelect={ onHeaderSelect }
                   navigationIcons={ navigationIcons! }
                   dateTimeFormatter={ this.props.dateTimeFormatter! }
-                  ref='monthPicker' /> }
+                  ref='monthPicker'
+                /> }
 
                 { showGoToToday &&
                   <span
@@ -167,7 +171,8 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                     className={ css('ms-DatePicker-goToday js-goToday', styles.goToday) }
                     onClick={ this._onGotoToday }
                     onKeyDown={ this._onGotoTodayKeyDown }
-                    tabIndex={ 0 }>
+                    tabIndex={ 0 }
+                  >
                     { strings!.goToToday }
                   </span>
                 }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index b776a9ce409c7..5fca3e35fca59 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -113,7 +113,8 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
               aria-controls={ dayPickerId }
               aria-label={ strings.prevMonthAriaLabel }
               role='button'
-              tabIndex={ 0 }>
+              tabIndex={ 0 }
+            >
               <Icon iconName={ getRTL() ? rightNavigationIcon : leftNavigationIcon } />
             </span >
             <span
@@ -123,7 +124,8 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
               aria-controls={ dayPickerId }
               aria-label={ strings.nextMonthAriaLabel }
               role='button'
-              tabIndex={ 0 }>
+              tabIndex={ 0 }
+            >
               <Icon iconName={ getRTL() ? leftNavigationIcon : rightNavigationIcon } />
             </span >
           </div >
@@ -162,7 +164,8 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
                     scope='col'
                     key={ index }
                     title={ strings.days[(index + firstDayOfWeek) % DAYS_IN_WEEK] }
-                    aria-label={ strings.days[(index + firstDayOfWeek) % DAYS_IN_WEEK] }>
+                    aria-label={ strings.days[(index + firstDayOfWeek) % DAYS_IN_WEEK] }
+                  >
                     { strings.shortDays[(index + firstDayOfWeek) % DAYS_IN_WEEK] }
                   </th>) }
               </tr>
@@ -171,12 +174,14 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
               { weeks!.map((week, weekIndex) =>
                 <tr key={ weekIndex } >
                   { week.map((day, dayIndex) =>
-                    <td key={ day.key } className={ css(
-                      {
-                        ['ms-DatePicker-weekBackground ' + styles.weekBackground]: day.isSelected && dateRangeType === DateRangeType.Week,
-                        ['ms-DatePicker-monthBackground ' + styles.monthBackground + ' ' + this._getHighlightedCornerStyle(weekCorners, dayIndex, weekIndex)]: day.isInMonth && day.isSelected && dateRangeType === DateRangeType.Month,
-                        ['ms-DatePicker-dayBackground ' + styles.dayBackground]: day.isSelected && dateRangeType === DateRangeType.Day
-                      }) }
+                    <td
+                      key={ day.key }
+                      className={ css(
+                        {
+                          ['ms-DatePicker-weekBackground ' + styles.weekBackground]: day.isSelected && dateRangeType === DateRangeType.Week,
+                          ['ms-DatePicker-monthBackground ' + styles.monthBackground + ' ' + this._getHighlightedCornerStyle(weekCorners, dayIndex, weekIndex)]: day.isInMonth && day.isSelected && dateRangeType === DateRangeType.Month,
+                          ['ms-DatePicker-dayBackground ' + styles.dayBackground]: day.isSelected && dateRangeType === DateRangeType.Day
+                        }) }
                     >
                       <div
                         className={ css(
@@ -197,7 +202,8 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
                         id={ compareDates(navigatedDate, day.originalDate) ? activeDescendantId : undefined }
                         data-is-focusable={ true }
                         ref={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : undefined }
-                        key={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : undefined } >
+                        key={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : undefined }
+                      >
                         <span aria-hidden='true'>{ dateTimeFormatter.formatDay(day.originalDate) }</span>
                       </div>
                     </td>
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
index 153f58d009dca..a53ad931652cd 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
@@ -55,43 +55,45 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
 
     return (
       <div className={ css('ms-DatePicker-monthPicker', styles.monthPicker) }>
-          <div className={ css('ms-DatePicker-yearComponents', styles.yearComponents) }>
-            <div className={ css('ms-DatePicker-navContainer', styles.navContainer) }>
-              <span
-                className={ css('ms-DatePicker-prevYear js-prevYear', styles.prevYear) }
-                onClick={ this._onSelectPrevYear }
-                onKeyDown={ this._onSelectPrevYearKeyDown }
-                aria-label={ strings.prevYearAriaLabel }
-                role='button'
-                tabIndex={ 0 }>
-                <Icon iconName={ getRTL() ? rightNavigationIcon : leftNavigationIcon } />
-              </span>
-              <span
-                className={ css('ms-DatePicker-nextYear js-nextYear', styles.nextYear) }
-                onClick={ this._onSelectNextYear }
-                onKeyDown={ this._onSelectNextYearKeyDown }
-                aria-label={ strings.nextYearAriaLabel }
-                role='button'
-                tabIndex={ 0 }>
-                <Icon iconName={ getRTL() ? leftNavigationIcon : rightNavigationIcon } />
-              </span>
-            </div>
+        <div className={ css('ms-DatePicker-yearComponents', styles.yearComponents) }>
+          <div className={ css('ms-DatePicker-navContainer', styles.navContainer) }>
+            <span
+              className={ css('ms-DatePicker-prevYear js-prevYear', styles.prevYear) }
+              onClick={ this._onSelectPrevYear }
+              onKeyDown={ this._onSelectPrevYearKeyDown }
+              aria-label={ strings.prevYearAriaLabel }
+              role='button'
+              tabIndex={ 0 }
+            >
+              <Icon iconName={ getRTL() ? rightNavigationIcon : leftNavigationIcon } />
+            </span>
+            <span
+              className={ css('ms-DatePicker-nextYear js-nextYear', styles.nextYear) }
+              onClick={ this._onSelectNextYear }
+              onKeyDown={ this._onSelectNextYearKeyDown }
+              aria-label={ strings.nextYearAriaLabel }
+              role='button'
+              tabIndex={ 0 }
+            >
+              <Icon iconName={ getRTL() ? leftNavigationIcon : rightNavigationIcon } />
+            </span>
           </div>
-          <div className={ css('ms-DatePicker-header', styles.header) }>
-            <div className={ css('ms-DatePicker-currentYear js-showYearPicker', styles.currentYear) }>{ dateTimeFormatter.formatYear(navigatedDate) }</div>
-            {
-              this.props.onHeaderSelect ?
-                <div
-                  className={ css('ms-DatePicker-headerToggleView js-showYearPicker', styles.headerToggleView) }
-                  onClick={ this._onHeaderSelect }
-                  onKeyDown={ this._onHeaderKeyDown }
-                  aria-label={ dateTimeFormatter.formatYear(navigatedDate) }
-                  role='button'
-                  tabIndex={ 0 }
-                />
-                :
-                null
-            }
+        </div>
+        <div className={ css('ms-DatePicker-header', styles.header) }>
+          <div className={ css('ms-DatePicker-currentYear js-showYearPicker', styles.currentYear) }>{ dateTimeFormatter.formatYear(navigatedDate) }</div>
+          {
+            this.props.onHeaderSelect ?
+              <div
+                className={ css('ms-DatePicker-headerToggleView js-showYearPicker', styles.headerToggleView) }
+                onClick={ this._onHeaderSelect }
+                onKeyDown={ this._onHeaderKeyDown }
+                aria-label={ dateTimeFormatter.formatYear(navigatedDate) }
+                role='button'
+                tabIndex={ 0 }
+              />
+              :
+              null
+          }
         </div>
         <FocusZone>
           <div className={ css('ms-DatePicker-optionGrid', styles.optionGrid) }>
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index 6c4723e964755..b0fe97e6a7c4c 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -180,7 +180,8 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
             }) }
             onDismiss={ this.dismiss }
             shouldRestoreFocus={ true }
-            style={ { maxHeight: contentMaxHeight, backgroundColor: backgroundColor } }>
+            style={ { maxHeight: contentMaxHeight, backgroundColor: backgroundColor } }
+          >
             { children }
           </Popup>
         </div>
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.tsx b/packages/office-ui-fabric-react/src/components/Check/Check.tsx
index 2fef18f5a634d..83961f24d8dea 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.tsx
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.tsx
@@ -39,11 +39,13 @@ export class Check extends BaseComponent<ICheckProps, {}> {
     isChecked = isChecked || checked;
 
     return (
-      <div className={ css(
-        'ms-Check',
-        styles.root,
-        isChecked && ('is-checked ' + styles.rootIsChecked)
-      ) }>
+      <div
+        className={ css(
+          'ms-Check',
+          styles.root,
+          isChecked && ('is-checked ' + styles.rootIsChecked)
+        ) }
+      >
         { Icon({
           className: 'ms-Check-circle ' + styles.circle,
           iconName: 'CircleRing'
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
index 1b9c5c25a6f6f..58ce4dd728c6b 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
@@ -162,12 +162,13 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
         {
           option.imageSrc && (
             <div className={ css('ms-ChoiceField-innerField', styles.innerField) }>
-              <div className={ css(
-                'ms-ChoiceField-imageWrapper',
-                styles.imageWrapper,
-                {
-                  ['is-hidden ' + styles.imageWrapperIsHidden]: option.checked
-                }) }
+              <div
+                className={ css(
+                  'ms-ChoiceField-imageWrapper',
+                  styles.imageWrapper,
+                  {
+                    ['is-hidden ' + styles.imageWrapperIsHidden]: option.checked
+                  }) }
               >
                 <Image
                   src={ option.imageSrc }
@@ -175,12 +176,13 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
                   height={ option.imageSize ? option.imageSize.height : undefined }
                 />
               </div>
-              <div className={ css(
-                'ms-ChoiceField-imageWrapper',
-                styles.imageWrapper,
-                {
-                  ['is-hidden ' + styles.imageWrapperIsHidden]: !option.checked
-                }) }
+              <div
+                className={ css(
+                  'ms-ChoiceField-imageWrapper',
+                  styles.imageWrapper,
+                  {
+                    ['is-hidden ' + styles.imageWrapperIsHidden]: !option.checked
+                  }) }
               >
                 <Image
                   src={ option.selectedImageSrc }
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
index f1941d5fd47dd..57c4851505053 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
@@ -72,7 +72,8 @@ export class ColorSlider extends BaseComponent<IColorSliderProps, IColorSliderSt
           className,
           isAdjusting && 'is-adjusting'
         ) }
-        onMouseDown={ this._onMouseDown }>
+        onMouseDown={ this._onMouseDown }
+      >
         <div className={ css('ms-ColorPicker-sliderOverlay', styles.sliderOverlay) } style={ overlayStyle } />
         <div className={ css('ms-ColorPicker-thumb is-slider', styles.thumb, styles.thumbIsSlider) } style={ { left: currentPercentage + '%' } } />
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index e779364ecf192..5a9fb80343e71 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -278,7 +278,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
             defaultVisibleValue={ this._currentVisibleValue }
             suggestedDisplayValue={ suggestedDisplayValue }
             updateValueInWillReceiveProps={ this._onUpdateValueInAutoFillWillReceiveProps }
-            shouldSelectFullInputValueInComponentDidUpdate={ this._onShouldSelectFullInputValueInAutoFillComponentDidUpdate } />
+            shouldSelectFullInputValueInComponentDidUpdate={ this._onShouldSelectFullInputValueInAutoFillComponentDidUpdate }
+          />
           <IconButton
             className={ 'ms-ComboBox-CaretDown-button' }
             styles={ this._getCaretButtonStyles() }
@@ -287,7 +288,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
             tabIndex={ -1 }
             onClick={ this._onComboBoxClick }
             iconProps={ buttonIconProps }
-            disabled={ disabled } />
+            disabled={ disabled }
+          />
         </div>
 
         { isOpen && (
@@ -296,7 +298,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         {
           errorMessage &&
           <div
-            className={ this._classNames.errorMessage }>
+            className={ this._classNames.errorMessage }
+          >
             { errorMessage }
           </div>
         }
@@ -817,7 +820,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       return <div
         role='separator'
         key={ key }
-        className={ this._classNames.divider } />;
+        className={ this._classNames.divider }
+      />;
     }
     return null;
   }
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index a651cb2f016c5..37fdeb4fdd28d 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -90,17 +90,21 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
       searchBox = (
         <div className={ css('ms-CommandBarSearch', styles.search) } ref='searchSurface'>
           <input className={ css('ms-CommandBarSearch-input', styles.searchInput) } type='text' placeholder={ searchPlaceholderText } />
-          <div className={ css(
-            'ms-CommandBarSearch-iconWrapper ms-CommandBarSearch-iconSearchWrapper',
-            styles.searchIconWrapper, styles.searchIconSearchWrapper) }>
+          <div
+            className={ css(
+              'ms-CommandBarSearch-iconWrapper ms-CommandBarSearch-iconSearchWrapper',
+              styles.searchIconWrapper, styles.searchIconSearchWrapper) }
+          >
             { Icon({ iconName: 'Search' }) }
           </div>
-          <div className={ css(
-            'ms-CommandBarSearch-iconWrapper ms-CommandBarSearch-iconClearWrapper',
-            FontClassNames.small,
-            styles.searchIconWrapper,
-            styles.searchIconClearWrapper
-          ) }>
+          <div
+            className={ css(
+              'ms-CommandBarSearch-iconWrapper ms-CommandBarSearch-iconClearWrapper',
+              FontClassNames.small,
+              styles.searchIconWrapper,
+              styles.searchIconClearWrapper
+            ) }
+          >
             <Icon iconName='cancel' />
           </div>
         </div>
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 9cee311e4ac3a..ad3b36754033f 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -239,7 +239,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
           setInitialFocus={ shouldFocusOnMount }
           onDismiss={ this.props.onDismiss }
           bounds={ bounds }
-          directionalHintFixed={ directionalHintFixed }>
+          directionalHintFixed={ directionalHintFixed }
+        >
           <div style={ contextMenuStyle } ref={ (host: HTMLDivElement) => this._host = host } id={ id } className={ css('ms-ContextualMenu-container', className) }>
             { (items && items.length) ? (
               <FocusZone
@@ -252,7 +253,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
                   aria-label={ ariaLabel }
                   aria-labelledby={ labelElementId }
                   className={ css('ms-ContextualMenu-list is-open', styles.list) }
-                  onKeyDown={ this._onKeyDown }>
+                  onKeyDown={ this._onKeyDown }
+                >
                   { items.map((item, index) => {
                     if (item.itemType === ContextualMenuItemType.Divider ||
                       item.itemType === ContextualMenuItemType.Header) {
@@ -302,7 +304,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       role='presentation'
       title={ title }
       key={ key }
-      className={ css('ms-ContextualMenu-item', styles.item, className) }>
+      className={ css('ms-ContextualMenu-item', styles.item, className) }
+    >
       { content }
     </li>;
   }
@@ -312,7 +315,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       return <li
         role='separator'
         key={ 'separator-' + index }
-        className={ css('ms-ContextualMenu-divider', styles.divider, className) } />;
+        className={ css('ms-ContextualMenu-divider', styles.divider, className) }
+      />;
     }
     return null;
   }
@@ -350,7 +354,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
           aria-setsize={ totalItemCount }
           aria-disabled={ item.isDisabled }
           style={ item.style }
-          onClick={ this._onAnchorClick.bind(this, item) }>
+          onClick={ this._onAnchorClick.bind(this, item) }
+        >
           { this._renderMenuItemChildren(item, index, hasCheckmarks, hasIcons) }
         </a>
       </div>);
@@ -413,7 +418,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
           <Icon
             iconName={ isItemChecked === true ? 'CheckMark' : 'CustomIcon' }
             className={ css('ms-ContextualMenu-icon', styles.icon) }
-            onClick={ this._onItemClick.bind(this, item) } />
+            onClick={ this._onItemClick.bind(this, item) }
+          />
         ) : (null) }
         { (hasIcons) ? (
           this._renderIcon(item)
@@ -423,7 +429,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
           <Icon
             iconName={ getRTL() ? 'ChevronLeft' : 'ChevronRight' }
             { ...item.submenuIconProps }
-            className={ css('ms-ContextualMenu-submenuIcon', styles.submenuIcon, item.submenuIconProps ? item.submenuIconProps.className : '') } />
+            className={ css('ms-ContextualMenu-submenuIcon', styles.submenuIcon, item.submenuIconProps ? item.submenuIconProps.className : '') }
+          />
         ) : (null) }
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index 353c8627bbbf8..63692000f612d 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -164,7 +164,8 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
               aria-labelledby={ `${this._id}-check` }
               onClick={ this._onSelectAllClicked }
               aria-colindex={ 0 }
-              role='columnheader' >
+              role='columnheader'
+            >
               {
                 onRenderColumnHeaderTooltip({
                   hostClassName: css(styles.checkTooltip),
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 3d970102770fa..959f2a304d79a 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -267,12 +267,15 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
         data-automationid='DetailsList'
         data-is-scrollable='false'
         aria-label={ ariaLabel }
-        { ...(shouldApplyApplicationRole ? { role: 'application' } : {}) }>
-        <div role='grid'
+        { ...(shouldApplyApplicationRole ? { role: 'application' } : {}) }
+      >
+        <div
+          role='grid'
           aria-label={ ariaLabelForGrid }
           aria-rowcount={ (isHeaderVisible ? 1 : 0) + (items ? items.length : 0) }
           aria-colcount={ (selectAllVisibility !== SelectAllVisibility.none ? 1 : 0) + (adjustedColumns ? adjustedColumns.length : 0) }
-          aria-readonly='true'>
+          aria-readonly='true'
+        >
           <div onKeyDown={ this._onHeaderKeyDown } role='presentation'>
             { isHeaderVisible && onRenderDetailsHeader({
               componentRef: this._resolveRef('_header'),
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index 83ef855cb4588..0d4f65053c959 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -249,7 +249,8 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
             item={ item }
             itemIndex={ itemIndex }
             columnStartIndex={ showCheckbox ? 1 : 0 }
-            onRenderItemColumn={ onRenderItemColumn } />
+            onRenderItemColumn={ onRenderItemColumn }
+          />
         ) }
 
         { columnMeasureInfo && (
@@ -263,7 +264,8 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
               item={ item }
               itemIndex={ itemIndex }
               columnStartIndex={ (showCheckbox ? 1 : 0) + columns.length }
-              onRenderItemColumn={ onRenderItemColumn } />
+              onRenderItemColumn={ onRenderItemColumn }
+            />
           </span>
         ) }
       </FocusZone>
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
index c1f306ba981e3..0cbf9176df31d 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
@@ -40,7 +40,8 @@ export class DetailsRowFields extends BaseComponent<IDetailsRowFieldsProps, IDet
       <div
         className={ css('ms-DetailsRow-fields', styles.fields) }
         data-automationid='DetailsRowFields'
-        role='presentation'>
+        role='presentation'
+      >
         { columns.map((column, columnIndex) => (
           <div
             key={ columnIndex }
@@ -54,7 +55,8 @@ export class DetailsRowFields extends BaseComponent<IDetailsRowFieldsProps, IDet
             ) }
             style={ { width: column.calculatedWidth! + INNER_PADDING + (column.isPadded ? ISPADDED_WIDTH : 0) } }
             data-automationid='DetailsRowCell'
-            data-automation-key={ column.key }>
+            data-automation-key={ column.key }
+          >
             { cellContent[columnIndex] }
           </div>
         )) }
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx
index 874f685fb1c55..9f6f34f176c4f 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx
@@ -55,7 +55,8 @@ export class DocumentCard extends BaseComponent<IDocumentCardProps, any> {
         }
         onKeyDown={ actionable ? this._onKeyDown : undefined }
         onClick={ actionable ? this._onClick : undefined }
-        style={ style }>
+        style={ style }
+      >
         { children }
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx
index e24974c16d14c..426224f8f1e4d 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx
@@ -11,9 +11,11 @@ export class DocumentCardActivity extends BaseComponent<IDocumentCardActivityPro
 
     return (
       people && people.length > 0 &&
-      <div className={ css('ms-DocumentCardActivity', styles.activity, {
-        ['ms-DocumentCardActivity--multiplePeople ' + styles.activityIsMultiplePeople]: people.length > 1
-      }) }>
+      <div
+        className={ css('ms-DocumentCardActivity', styles.activity, {
+          ['ms-DocumentCardActivity--multiplePeople ' + styles.activityIsMultiplePeople]: people.length > 1
+        }) }
+      >
         { this._renderAvatars(people) }
         <div className={ css('ms-DocumentCardActivity-details', styles.activityDetails) }>
           <span className={ css('ms-DocumentCardActivity-name', styles.name) }>{ this._getNameString(people) }</span>
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardLocation.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardLocation.tsx
index 159c0a7a185f0..4f62cca40b32e 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardLocation.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardLocation.tsx
@@ -9,8 +9,14 @@ export class DocumentCardLocation extends BaseComponent<IDocumentCardLocationPro
     let { location, locationHref, ariaLabel, onClick } = this.props;
 
     return (
-      <a className={ css('ms-DocumentCardLocation', styles.location) }
-        href={ locationHref } onClick={ onClick } aria-label={ ariaLabel }>{ location }</a>
+      <a
+        className={ css('ms-DocumentCardLocation', styles.location) }
+        href={ locationHref }
+        onClick={ onClick }
+        aria-label={ ariaLabel }
+      >
+        { location }
+      </a>
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx
index 24062dc2be593..2b3ad1ac44a26 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx
@@ -35,8 +35,10 @@ export class DocumentCardPreview extends BaseComponent<IDocumentCardPreviewProps
     }
 
     return (
-      <div className={ css('ms-DocumentCardPreview', styles.preview, isFileList && ('is-fileList ' + styles.previewIsFileList)) }
-        style={ style }>
+      <div
+        className={ css('ms-DocumentCardPreview', styles.preview, isFileList && ('is-fileList ' + styles.previewIsFileList)) }
+        style={ style }
+      >
         { preview }
       </div>
     );
@@ -59,7 +61,9 @@ export class DocumentCardPreview extends BaseComponent<IDocumentCardPreviewProps
         height={ height }
         imageFit={ imageFit }
         src={ previewImage.previewImageSrc }
-        role='presentation' alt='' />
+        role='presentation'
+        alt=''
+      />
     );
 
     let icon;
@@ -97,7 +101,8 @@ export class DocumentCardPreview extends BaseComponent<IDocumentCardPreviewProps
           role='presentation'
           alt=''
           width='16px'
-          height='16px' />
+          height='16px'
+        />
         <a href={ file.url }>{ file.name }</a>
       </li>
     ));
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index bbb86d9485694..c8dbaa91c5d9b 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -202,7 +202,8 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
         {
           errorMessage &&
           <div
-            className={ css(styles.errorMessage) }>
+            className={ css(styles.errorMessage) }
+          >
             { errorMessage }
           </div>
         }
@@ -421,7 +422,8 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
       return <div
         role='separator'
         key={ key }
-        className={ css('ms-Dropdown-divider', styles.divider) } />;
+        className={ css('ms-Dropdown-divider', styles.divider) }
+      />;
     }
     return null;
   }
@@ -430,8 +432,10 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     const { onRenderOption = this._onRenderOption } = this.props;
     const { key } = item;
     return (
-      <div key={ key }
-        className={ css('ms-Dropdown-header', styles.header) }>
+      <div
+        key={ key }
+        className={ css('ms-Dropdown-header', styles.header) }
+      >
         { onRenderOption(item, this._onRenderOption) }
       </div>);
   }
@@ -465,7 +469,9 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
           aria-selected={ this.state.selectedIndex === item.index ? 'true' : 'false' }
           ariaLabel={ item.ariaLabel || item.text }
           title={ item.text }
-        > { onRenderOption(item, this._onRenderOption) }</CommandButton>
+        >
+          { onRenderOption(item, this._onRenderOption) }
+        </CommandButton>
         :
         <Checkbox
           id={ id + '-list' + item.index }
@@ -485,7 +491,8 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
           role='option'
           aria-selected={ isItemSelected ? 'true' : 'false' }
           checked={ isItemSelected }
-        >{ onRenderOption(item, this._onRenderOption) } </Checkbox>
+        >{ onRenderOption(item, this._onRenderOption) }
+        </Checkbox>
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
index 434fb18309a4e..b98cf5aeb755b 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
@@ -93,7 +93,8 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
         className={ className }
         ref='root'
         aria-labelledby={ ariaLabelledBy }
-        onKeyDown={ this._onKeyboardHandler }>
+        onKeyDown={ this._onKeyboardHandler }
+      >
         { this.props.children }
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
index ee737ad3d8b8c..085fb27424135 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
@@ -73,7 +73,8 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
         style={ viewport ? { minWidth: viewport.width } : {} }
         onClick={ this._onHeaderClick }
         aria-label={ group.ariaLabel || group.name }
-        data-is-focusable={ true } >
+        data-is-focusable={ true }
+      >
 
         <FocusZone className={ styles.groupHeaderContainer } direction={ FocusZoneDirection.horizontal }>
 
@@ -82,7 +83,8 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
               type='button'
               className={ css('ms-GroupHeader-check', styles.check) }
               data-selection-toggle={ true }
-              onClick={ this._onToggleSelectGroupClick } >
+              onClick={ this._onToggleSelectGroupClick }
+            >
               <Check checked={ currentlySelected } />
             </button>
           ) : (selectionMode !== SelectionMode.none ? GroupSpacer({ count: 1 }) : null)
@@ -96,7 +98,8 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
           <button
             type='button'
             className={ css('ms-GroupHeader-expand', styles.expand) }
-            onClick={ this._onToggleCollapse }>
+            onClick={ this._onToggleCollapse }
+          >
             <Icon
               className={ css(
                 isCollapsed && ('is-collapsed ' + styles.expandIsCollapsed)
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
index 0e5893cbb3736..42a5458254cf1 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
@@ -118,11 +118,12 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
     });
 
     return (
-      <div className={ mergeStyles(
-        this._styles.expandedCard,
-        this.props.mode === ExpandingCardMode.expanded && this.state.firstFrameRendered && { height: this.props.expandedCardHeight + 'px' },
-        this.state.needsScroll && { 'overflow-y': 'auto' }
-      ) as string }
+      <div
+        className={ mergeStyles(
+          this._styles.expandedCard,
+          this.props.mode === ExpandingCardMode.expanded && this.state.firstFrameRendered && { height: this.props.expandedCardHeight + 'px' },
+          this.state.needsScroll && { 'overflow-y': 'auto' }
+        ) as string }
         ref={ this._resolveRef('_expandedElem') }
       >
         <div className={ this._styles.expandedCardScroll as string }>
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
index 5b69cb1202ca3..e6631889c1497 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
@@ -31,11 +31,12 @@ export const Icon = (props: IIconProps): JSX.Element => {
     );
 
     return (
-      <div className={
-        css(
-          containerClassName,
-          styles.root
-        ) }
+      <div
+        className={
+          css(
+            containerClassName,
+            styles.root
+          ) }
       >
         <Image { ...props.imageProps as any } />
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.tsx b/packages/office-ui-fabric-react/src/components/Label/Label.tsx
index 49c232769d87f..cb0772e58d23c 100644
--- a/packages/office-ui-fabric-react/src/components/Label/Label.tsx
+++ b/packages/office-ui-fabric-react/src/components/Label/Label.tsx
@@ -17,7 +17,8 @@ export class Label extends BaseComponent<ILabelProps, any> {
           className,
           disabled && ('is-disabled ' + styles.isDisabled),
           required && ('is-required ' + styles.isRequired)
-        ) }>
+        ) }
+      >
         { children }
       </label>
     );
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index 134c7752931bb..95d6ae68eace5 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -441,19 +441,20 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       }
 
       return (
-        <div role={ cellRole }
+        <div
+          role={ cellRole }
           className={ css('ms-List-cell') }
           key={ itemKey }
           data-list-index={ index }
-          data-automationid='ListCell'>
+          data-automationid='ListCell'
+        >
           { onRenderCell && onRenderCell(item, index) }
         </div>
       );
     });
 
     return (
-      <div
-        { ...divProps }>
+      <div { ...divProps }>
         { cells }
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
index 090980beece07..aa70b9789547a 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
@@ -100,10 +100,12 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
             ) }
             style={ dragRect }
           >
-            <div className={ css(
-              'ms-MarqueeSelection-boxFill',
-              styles.boxFill
-            ) } />
+            <div
+              className={ css(
+                'ms-MarqueeSelection-boxFill',
+                styles.boxFill
+              ) }
+            />
           </div>
         ) }
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
index 72115d5e0b57d..84777fef287b9 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
@@ -51,9 +51,11 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
 
   private _getActionsDiv(): JSX.Element | null {
     if (this.props.actions) {
-      return <div className={ this.props.isMultiline ?
-        ('ms-MessageBar-actions ' + styles.actions) :
-        ('ms-MessageBar-actionsOneline ' + styles.actionsOneline) }>
+      return <div
+        className={ this.props.isMultiline ?
+          ('ms-MessageBar-actions ' + styles.actions) :
+          ('ms-MessageBar-actionsOneline ' + styles.actionsOneline) }
+      >
         { this.props.actions }
       </div>;
     }
@@ -123,7 +125,8 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
           )
         }
         role='status'
-        aria-live={ this._getAnnouncementPriority() }>
+        aria-live={ this._getAnnouncementPriority() }
+      >
         <div className={ css(styles.content, 'ms-MessageBar-content') }>
           { this._getIconSpan() }
           { this._renderInnerText() }
@@ -136,14 +139,16 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
 
   private _renderSingleLine(): React.ReactElement<React.HTMLAttributes<HTMLAreaElement>> {
     return (
-      <div className={
-        css(this._getClassName(),
-          'ms-MessageBar-singleline',
-          styles.singleline,
-          this.props.onDismiss && 'ms-MessageBar-dismissalOneline ' + styles.rootIsOneline,
-          this.props.actions && styles.actionableOneline
-        )
-      } >
+      <div
+        className={
+          css(this._getClassName(),
+            'ms-MessageBar-singleline',
+            styles.singleline,
+            this.props.onDismiss && 'ms-MessageBar-dismissalOneline ' + styles.rootIsOneline,
+            this.props.actions && styles.actionableOneline
+          )
+        }
+      >
         <div className={ css(styles.content, 'ms-MessageBar-content') }>
           { this._getIconSpan() }
           { this._renderInnerText() }
diff --git a/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx b/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
index a34bda5d6a1d9..848eb53c2a708 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
+++ b/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
@@ -126,7 +126,8 @@ export class Modal extends BaseComponent<IModalProps, IDialogState> {
                 isClickableOutsideFocusTrap={ isClickableOutsideFocusTrap ? isClickableOutsideFocusTrap : !isBlocking }
                 ignoreExternalFocusing={ ignoreExternalFocusing }
                 forceFocusInsideTrap={ forceFocusInsideTrap }
-                firstFocusableSelector={ firstFocusableSelector }>
+                firstFocusableSelector={ firstFocusableSelector }
+              >
                 { this.props.children }
               </FocusTrapZone>
             </div>
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
index 03562411711c6..0fc55ecd91ed3 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
@@ -108,13 +108,15 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
 
     return (
       <FocusZone direction={ FocusZoneDirection.vertical }>
-        <nav role='navigation'
+        <nav
+          role='navigation'
           className={ css(
             'ms-Nav',
             styles.root,
             className,
             isOnTop && css('is-onTop', styles.rootIsOnTop, AnimationClassNames.slideRightIn40)
-          ) }>
+          ) }
+        >
           { groupElements }
         </nav>
       </FocusZone>
@@ -167,7 +169,8 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
         href={ link.url }
         iconProps={ { iconName: link.icon } }
         description={ link.title || link.name }
-        onClick={ this._onNavButtonLinkClicked.bind(this, link) }>
+        onClick={ this._onNavButtonLinkClicked.bind(this, link) }
+      >
         { link.name }
       </CommandButton>);
   }
@@ -178,7 +181,8 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
     const paddingBefore: string = `${_indentationSize * nestingLevel}px`;
 
     return (
-      <div key={ link.key || linkIndex }
+      <div
+        key={ link.key || linkIndex }
         className={ css(
           'ms-Nav-compositeLink',
           styles.compositeLink,
@@ -186,7 +190,8 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
           isLinkSelected && 'is-selected',
           !!link.isExpanded && styles.compositeLinkIsExpanded,
           isLinkSelected && styles.compositeLinkIsSelected
-        ) }>
+        ) }
+      >
         { (link.links && link.links.length > 0 ?
           <button
             style={ { [isRtl ? 'marginRight' : 'marginLeft']: paddingBefore } }
@@ -242,7 +247,8 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
           'ms-Nav-group',
           styles.group,
           isGroupExpanded && ('is-expanded ' + styles.groupIsExpanded)
-        ) }>
+        ) }
+      >
         { (group.name ?
           <button
             className={ css('ms-Nav-chevronButton ms-Nav-chevronButton--group ms-Nav-groupHeaderFontSize', styles.chevronButton, styles.chevronButtonIsGroup, styles.groupHeaderFontSize) }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
index fee4d44ec4a58..89d5e9da87488 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
@@ -120,7 +120,8 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
         <Popup
           role='dialog'
           ariaLabelledBy={ headerText && headerTextId }
-          onDismiss={ this.dismiss }>
+          onDismiss={ this.dismiss }
+        >
           <div
             className={
               css(
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index db0a29fe2f304..21ba20b389314 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -178,7 +178,8 @@ export class Persona extends BaseComponent<IPersonaProps, IPersonaState> {
               alt={ imageAlt }
               shouldFadeIn={ imageShouldFadeIn }
               shouldStartVisible={ imageShouldStartVisible }
-              onLoadingStateChange={ this._onPhotoLoadingStateChange } />
+              onLoadingStateChange={ this._onPhotoLoadingStateChange }
+            />
           </div>
         ) }
         { presenceElement }
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
index 8f172ecd029ce..7353ccf87fc6c 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
@@ -105,10 +105,12 @@ export class Pivot extends BaseComponent<IPivotProps, IPivotState> {
   private _renderPivotLinks() {
     return (
       <FocusZone direction={ FocusZoneDirection.horizontal }>
-        <ul className={ css('ms-Pivot', styles.root,
-          { ['ms-Pivot--large ' + styles.rootIsLarge]: this.props.linkSize === PivotLinkSize.large },
-          { ['ms-Pivot--tabs ' + styles.rootIsTabs]: this.props.linkFormat === PivotLinkFormat.tabs }) }
-          role='tablist'>
+        <ul
+          className={ css('ms-Pivot', styles.root,
+            { ['ms-Pivot--large ' + styles.rootIsLarge]: this.props.linkSize === PivotLinkSize.large },
+            { ['ms-Pivot--tabs ' + styles.rootIsTabs]: this.props.linkFormat === PivotLinkFormat.tabs }) }
+          role='tablist'
+        >
           { this.state.links.map(this._renderLink) }
         </ul>
       </FocusZone>
@@ -146,7 +148,8 @@ export class Pivot extends BaseComponent<IPivotProps, IPivotState> {
         onKeyPress={ this._onKeyPress.bind(this, itemKey) }
         ariaLabel={ link.ariaLabel }
         role='tab'
-        aria-selected={ this.state.selectedKey === itemKey }>
+        aria-selected={ this.state.selectedKey === itemKey }
+      >
         { linkContent }
       </CommandButton>
     );
@@ -182,7 +185,8 @@ export class Pivot extends BaseComponent<IPivotProps, IPivotState> {
     return (
       <div
         role='tabpanel'
-        aria-labelledby={ selectedTabId }>
+        aria-labelledby={ selectedTabId }
+      >
         { React.Children.toArray(this.props.children)[index] }
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/PivotItem.tsx b/packages/office-ui-fabric-react/src/components/Pivot/PivotItem.tsx
index 2a047bf74840a..90db0e917daa2 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/PivotItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/PivotItem.tsx
@@ -11,7 +11,8 @@ export class PivotItem extends BaseComponent<IPivotItemProps, {}> {
   public render() {
     return (
       <div
-        { ...getNativeProps(this.props, divProperties) }>
+        { ...getNativeProps(this.props, divProperties) }
+      >
         { this.props.children }
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
index 3428f9068e0f7..d65de7ac4c895 100644
--- a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
+++ b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
@@ -66,7 +66,8 @@ export class Popup extends BaseComponent<IPopupProps, {}> {
         aria-label={ ariaLabel }
         aria-labelledby={ ariaLabelledBy }
         aria-describedby={ ariaDescribedBy }
-        onKeyDown={ this._onKeyDown }>
+        onKeyDown={ this._onKeyDown }
+      >
         { this.props.children }
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx
index 993f8e7948e3c..791c6c867e0b5 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx
@@ -57,7 +57,8 @@ export class ProgressIndicator extends BaseComponent<IProgressIndicatorProps, {}
             aria-valuemin='0'
             aria-valuemax='100'
             aria-valuenow={ percentComplete.toFixed().toString() }
-            aria-valuetext={ ariaValueText }>
+            aria-valuetext={ ariaValueText }
+          >
           </div>
         </div>
         <div className={ css('ms-ProgressIndicator-itemDescription', styles.itemDescription) }>{ description }</div>
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx b/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
index 4357035d17abf..d7af7b5180257 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
@@ -49,9 +49,12 @@ export class Rating extends BaseComponent<IRatingProps, IRatingState> {
       stars.push(this._renderStar(i));
     }
 
-    return <div className={ css('ms-Rating', this.props.className, {
-      ['ms-Rating--large ' + styles.rootIsLarge]: this.props.size === RatingSize.Large
-    }) } role='application'>
+    return <div
+      className={ css('ms-Rating', this.props.className, {
+        ['ms-Rating--large ' + styles.rootIsLarge]: this.props.size === RatingSize.Large
+      }) }
+      role='application'
+    >
       <div className={ css('ms-Rating-container', styles.container) } role='radiogroup' aria-labelledby={ this.props.ariaLabelId }>
         { stars }
       </div>
@@ -61,11 +64,14 @@ export class Rating extends BaseComponent<IRatingProps, IRatingState> {
   private _renderStar(rating: number): JSX.Element {
     const inputId = `${this._id}-${rating}`;
 
-    return <div className={ css('ms-Rating-star', styles.star, {
-      ['is-selected ' + styles.starIsSelected]: rating <= (this.state.rating as number),
-      ['is-inFocus ' + styles.starIsInFocus]: rating === this.state.focusedRating,
-      ['is-disabled ' + styles.starIsDisabled]: this.props.disabled
-    }) } key={ rating }>
+    return <div
+      className={ css('ms-Rating-star', styles.star, {
+        ['is-selected ' + styles.starIsSelected]: rating <= (this.state.rating as number),
+        ['is-inFocus ' + styles.starIsInFocus]: rating === this.state.focusedRating,
+        ['is-disabled ' + styles.starIsDisabled]: this.props.disabled
+      }) }
+      key={ rating }
+    >
       <input
         className={ css('ms-Rating-input', styles.input) }
         type='radio'
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
index 3de20c5e103ad..734dc221f015b 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
@@ -85,7 +85,8 @@ export class ScrollablePane extends BaseComponent<IScrollablePaneProps, {}> {
       <div
         ref='root'
         className={ css('ms-ScrollablePane', styles.root, className) }
-        data-is-scrollable={ true }>
+        data-is-scrollable={ true }
+      >
         <div ref='stickyContainer' className={ styles.stickyContainer }>
           <div ref='stickyAbove' className={ styles.stickyAbove } />
           <div ref='stickyBelow' className={ styles.stickyBelow } />
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
index f48ac4204cf58..3603355ab401a 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
@@ -102,7 +102,8 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
           ['ms-Slider-row ' + styles.rootIsHorizontal]: !vertical,
           ['ms-Slider-column ' + styles.rootIsVertical]: vertical
         }) }
-        ref='root'>
+        ref='root'
+      >
         { label && (
           <Label className={ styles.titleLabel } { ...ariaLabel ? {} : { 'htmlFor': this._id } }>
             { label }
@@ -144,8 +145,8 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
                 style={ { [lengthString]: thumbOffsetPercent + '%' } }
               />
               <span
-                 className={ css('ms-Slider-inactive', styles.lineContainer, styles.inactiveSection) }
-                 style={ { [lengthString]: (100 - thumbOffsetPercent) + '%' } }
+                className={ css('ms-Slider-inactive', styles.lineContainer, styles.inactiveSection) }
+                style={ { [lengthString]: (100 - thumbOffsetPercent) + '%' } }
               />
             </div>
           </button>
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index 00baae970a85f..4cc482123238f 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -159,7 +159,9 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
             <Label
               id={ this._labelId }
               htmlFor={ this._inputId }
-              className={ classNames.label }>{ label }
+              className={ classNames.label }
+            >
+              { label }
             </Label>
           }
         </div> }
@@ -222,7 +224,9 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
             <Label
               id={ this._labelId }
               htmlFor={ this._inputId }
-              className={ classNames.label }>{ label }
+              className={ classNames.label }
+            >
+              { label }
             </Label>
           }
         </div>
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx
index 04633f55b5cc5..e46e78a70ff7a 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx
+++ b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx
@@ -16,16 +16,18 @@ export class Spinner extends BaseComponent<ISpinnerProps, any> {
 
     return (
       <div className={ css('ms-Spinner', styles.root, className) }>
-        <div className={ css('ms-Spinner-circle', styles.circle,
-          {
-            ['ms-Spinner--xSmall ' + styles.circleIsXSmall]: size === SpinnerSize.xSmall,
-            ['ms-Spinner--small ' + styles.circleIsSmall]: size === SpinnerSize.small,
-            ['ms-Spinner--medium ' + styles.circleIsMedium]: size === SpinnerSize.medium,
-            ['ms-Spinner--large ' + styles.circleIsLarge]: size === SpinnerSize.large,
-            ['ms-Spinner--normal ' + styles.circleIsTypeMedium]: type === SpinnerType.normal, // TODO remove deprecated value at >= 2.0.0
-            ['ms-Spinner--large ' + styles.circleIsTypeLarge]: type === SpinnerType.large // TODO remove deprecated value at >= 2.0.0
-          })
-        }>
+        <div
+          className={ css('ms-Spinner-circle', styles.circle,
+            {
+              ['ms-Spinner--xSmall ' + styles.circleIsXSmall]: size === SpinnerSize.xSmall,
+              ['ms-Spinner--small ' + styles.circleIsSmall]: size === SpinnerSize.small,
+              ['ms-Spinner--medium ' + styles.circleIsMedium]: size === SpinnerSize.medium,
+              ['ms-Spinner--large ' + styles.circleIsLarge]: size === SpinnerSize.large,
+              ['ms-Spinner--normal ' + styles.circleIsTypeMedium]: type === SpinnerType.normal, // TODO remove deprecated value at >= 2.0.0
+              ['ms-Spinner--large ' + styles.circleIsTypeLarge]: type === SpinnerType.large // TODO remove deprecated value at >= 2.0.0
+            })
+          }
+        >
         </div>
         {
           label && <div className={ css('ms-Spinner-label', styles.label) }>{ label }</div>
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubbleContent.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubbleContent.tsx
index 0c8ede6f0775b..c0f6a47e2e559 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubbleContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubbleContent.tsx
@@ -56,12 +56,14 @@ export class TeachingBubbleContent extends BaseComponent<ITeachingBubbleProps, I
 
     if (headline) {
       headerContent = (
-        <div className={ css(
-          'ms-TeachingBubble-header',
-          hasCondensedHeadline ?
-            'ms-TeachingBubble-header--small ' + styles.headerIsSmall :
-            'ms-TeachingBubble-header--large ' + styles.headerIsLarge
-        ) }>
+        <div
+          className={ css(
+            'ms-TeachingBubble-header',
+            hasCondensedHeadline ?
+              'ms-TeachingBubble-header--small ' + styles.headerIsSmall :
+              'ms-TeachingBubble-header--large ' + styles.headerIsLarge
+          ) }
+        >
           <p className={ css('ms-TeachingBubble-headline', styles.headline) } >
             { headline }
           </p>
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
index 531d27db7ba8a..91b654b2186da 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
@@ -116,7 +116,8 @@ export class BaseAutoFill extends BaseComponent<IBaseAutoFillProps, IBaseAutoFil
     } = this.state;
 
     const nativeProps = getNativeProps(this.props, inputProperties);
-    return <input { ...nativeProps}
+    return <input
+      { ...nativeProps}
       ref={ this._resolveRef('_inputElement') }
       value={ displayValue }
       autoCapitalize={ 'off' }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 53c5cc57b5182..c7d73e8c35259 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -148,11 +148,13 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
         className={ css(
           'ms-BasePicker',
           className ? className : '') }
-        onKeyDown={ this.onKeyDown } >
+        onKeyDown={ this.onKeyDown }
+      >
         <FocusZone
           ref={ this._resolveRef('focusZone') }
           direction={ FocusZoneDirection.bidirectional }
-          isInnerZoneKeystroke={ this._isFocusZoneInnerKeystroke }>
+          isInnerZoneKeystroke={ this._isFocusZoneInnerKeystroke }
+        >
           <SelectionZone selection={ this.selection } selectionMode={ SelectionMode.multiple }>
             <div className={ css('ms-BasePicker-text', styles.pickerText) } role={ 'list' }>
               { this.renderItems() }
@@ -194,7 +196,8 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
         gapSpace={ 5 }
         targetElement={ this.input.inputElement }
         onDismiss={ this.dismissSuggestions }
-        directionalHint={ getRTL() ? DirectionalHint.bottomRightEdge : DirectionalHint.bottomLeftEdge }>
+        directionalHint={ getRTL() ? DirectionalHint.bottomRightEdge : DirectionalHint.bottomLeftEdge }
+      >
         <TypedSuggestion
           onRenderSuggestion={ this.props.onRenderSuggestionsItem }
           onSuggestionClick={ this.onSuggestionClick }
@@ -634,11 +637,15 @@ export class BasePickerListBelow<T, P extends IBasePickerProps<T>> extends BaseP
 
     return (
       <div>
-        <div ref={ this._resolveRef('root') }
+        <div
+          ref={ this._resolveRef('root') }
           className={ css('ms-BasePicker', className ? className : '') }
-          onKeyDown={ this.onKeyDown } >
-          <SelectionZone selection={ this.selection }
-            selectionMode={ SelectionMode.multiple }>
+          onKeyDown={ this.onKeyDown }
+        >
+          <SelectionZone
+            selection={ this.selection }
+            selectionMode={ SelectionMode.multiple }
+          >
             <div className={ css('ms-BasePicker-text', styles.pickerText) }>
               <BaseAutoFill
                 { ...inputProps as any }
@@ -660,11 +667,13 @@ export class BasePickerListBelow<T, P extends IBasePickerProps<T>> extends BaseP
           </SelectionZone>
         </div>
         { this.renderSuggestions() }
-        <FocusZone ref={ this._resolveRef('focusZone') }
+        <FocusZone
+          ref={ this._resolveRef('focusZone') }
           className='ms-BasePicker-selectedItems'
           isCircularNavigation={ true }
           direction={ FocusZoneDirection.bidirectional }
-          isInnerZoneKeystroke={ this._isFocusZoneInnerKeystroke } >
+          isInnerZoneKeystroke={ this._isFocusZoneInnerKeystroke }
+        >
           { this.renderItems() }
         </FocusZone>
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
index f1bc9e65c6238..9d317ae8b5428 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
@@ -32,10 +32,12 @@ export const SelectedItemDefault: (props: IPeoplePickerItemProps) => JSX.Element
       data-is-sub-focuszone={ true }
       data-selection-index={ index }
       role={ 'listitem' }
-      aria-labelledby={ 'selectedItemPersona-' + itemId } >
+      aria-labelledby={ 'selectedItemPersona-' + itemId }
+    >
       <div
         className={ css('ms-PickerItem-content', styles.itemContent) }
-        id={ 'selectedItemPersona-' + itemId } >
+        id={ 'selectedItemPersona-' + itemId }
+      >
         <Persona
           { ...item }
           presence={ item.presence !== undefined ? item.presence : PersonaPresence.none }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index 1cc4a23f9bd6a..f1c784bfa0f6b 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -102,10 +102,12 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
     let headerText = isMostRecentlyUsedVisible && mostRecentlyUsedHeaderText ? mostRecentlyUsedHeaderText : null;
     let footerTitle = (suggestions.length >= (resultsMaximumNumber as number)) ? resultsFooterFull : resultsFooter;
     return (
-      <div className={ css(
-        'ms-Suggestions',
-        className ? className : '',
-        styles.root) }>
+      <div
+        className={ css(
+          'ms-Suggestions',
+          className ? className : '',
+          styles.root) }
+      >
         { headerText ?
           (<div className={ css('ms-Suggestions-title', styles.suggestionsTitle) }>
             { headerText }
@@ -145,7 +147,9 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
         { (!isLoading && !isSearching && suggestions && suggestions.length > 0 && suggestionsAvailableAlertText) ?
           (<span
             role='alert'
-            className={ css('ms-Suggestions-suggestionsAvailable', styles.suggestionsAvailable) }>{ suggestionsAvailableAlertText }
+            className={ css('ms-Suggestions-suggestionsAvailable', styles.suggestionsAvailable) }
+          >
+            { suggestionsAvailableAlertText }
           </span>) : (null)
         }
       </div>
@@ -182,13 +186,16 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
       <div
         className={ css('ms-Suggestions-container', styles.suggestionsContainer) }
         id='suggestion-list'
-        role='menu'>
+        role='menu'
+      >
         { suggestions.map((suggestion, index) =>
-          <div ref={ this._resolveRef(suggestion.selected ? '_selectedElement' : '') }
+          <div
+            ref={ this._resolveRef(suggestion.selected ? '_selectedElement' : '') }
             // tslint:disable-next-line:no-string-literal
             key={ (suggestion.item as any)['key'] ? (suggestion.item as any)['key'] : index }
             id={ 'sug-' + index }
-            role='menuitem'>
+            role='menuitem'
+          >
             <TypedSuggestionsItem
               id={ 'sug-item' + index }
               suggestionModel={ suggestion }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx
index d9bf674bd8d7e..f9bfe5facac87 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx
@@ -16,7 +16,8 @@ export const TagItem = (props: IPickerItemProps<ITag>) => (
       props.selected && styles.isSelected) }
     key={ props.index }
     data-selection-index={ props.index }
-    data-is-focusable={ !props.disabled && true }>
+    data-is-focusable={ !props.disabled && true }
+  >
     <span className={ css('ms-TagItem-text', styles.tagItemText) } aria-label={ props.children }>{ props.children }</span>
     { !props.disabled &&
       <span className={ css('ms-TagItem-close', styles.tagItemClose) } onClick={ props.onRemoveItem }>
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx b/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
index 6598605294aba..831760b86fa37 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
@@ -44,20 +44,23 @@ export class Grid extends BaseComponent<IGridProps, {}> {
           role={ 'grid' }
           aria-posinset={ positionInSet }
           aria-setsize={ setSize }
-          style={ { padding: '2px', outline: 'none' } }>
+          style={ { padding: '2px', outline: 'none' } }
+        >
           <tbody>
             {
               rowsOfItems.map((rows: any[], rowIndex) => {
                 return (
                   <tr
                     role={ 'row' }
-                    key={ this._id + '-' + rowIndex + '-row' }>
+                    key={ this._id + '-' + rowIndex + '-row' }
+                  >
                     { rows.map((cell) => {
                       return (
                         <td
                           role={ 'presentation' }
                           key={ this._id + '-' + cell.index + '-cell' }
-                          style={ { padding: '0px' } }>
+                          style={ { padding: '0px' } }
+                        >
                           { onRenderItem(cell, cell.index) }
                         </td>
                       );

From 14ee3c44e210998f4d41b395f9c91625481c8d3b Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Tue, 5 Sep 2017 18:21:20 -0700
Subject: [PATCH 0573/1641] Third pass fixing 'jsx-alignment' for tslint in
 Fabric pkg (#2743)

* Third pass fixing 'jsx-alignment' for tslint in Fabric pkg

* Update Callout.test.tsx

* Update Callout.test.tsx
---
 .../components/Breadcrumb/BreadcrumbPage.tsx  |  9 ++--
 .../Breadcrumb/BreadcrumbPage.visualtest.tsx  |  3 +-
 .../examples/Breadcrumb.Basic.Example.tsx     |  6 ++-
 .../examples/Breadcrumb.Static.Example.tsx    |  3 +-
 .../src/components/Button/Button.test.tsx     | 18 ++++---
 .../src/components/Button/ButtonPage.tsx      |  3 +-
 .../Button/ButtonPage.visualtest.tsx          | 37 ++++++++-----
 .../Button/examples/Button.Anchor.Example.tsx |  3 +-
 .../Button/examples/Button.Icon.Example.tsx   |  3 +-
 .../examples/Button.ScreenReader.Example.tsx  |  3 +-
 .../Button/examples/Button.Swap.Example.tsx   |  6 ++-
 .../src/components/Calendar/CalendarPage.tsx  | 53 ++++++++++++++-----
 .../src/components/Callout/Callout.test.tsx   | 22 ++++----
 .../src/components/Callout/CalloutPage.tsx    |  3 +-
 .../examples/Callout.Cover.Example.tsx        |  3 +-
 .../examples/Callout.Directional.Example.tsx  |  9 ++--
 .../src/components/Checkbox/CheckboxPage.tsx  |  3 +-
 .../Checkbox/CheckboxPage.visualtest.tsx      | 14 +++--
 .../ChoiceGroup/ChoiceGroupPage.tsx           |  3 +-
 .../ChoiceGroupPage.visualtest.tsx            | 18 ++++---
 .../ColorPicker/ColorPickerPage.tsx           |  6 ++-
 .../src/components/ComboBox/ComboBoxPage.tsx  |  3 +-
 .../components/CommandBar/CommandBarPage.tsx  |  3 +-
 .../examples/CommandBar.Basic.Example.tsx     |  6 ++-
 .../CommandBar.Customization.Example.tsx      | 17 +++---
 .../ContextualMenu/ContextualMenuPage.tsx     |  3 +-
 .../ContextualMenu.Checkmarks.Example.tsx     |  3 +-
 .../ContextualMenu.Customization.Example.tsx  |  3 +-
 .../ContextualMenu.Directional.Example.tsx    | 12 +++--
 29 files changed, 187 insertions(+), 91 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx
index c386afa82933b..9344366657605 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx
@@ -26,12 +26,14 @@ export class BreadcrumbPage extends React.Component<IComponentDemoPageProps, any
           <div>
             <ExampleCard
               title='Simple breadcrumb'
-              code={ BreadcrumbBasicExampleCode }>
+              code={ BreadcrumbBasicExampleCode }
+            >
               <BreadcrumbBasicExample />
             </ExampleCard>
             <ExampleCard
               title='Static width'
-              code={ BreadcrumbStaticExampleCode }>
+              code={ BreadcrumbStaticExampleCode }
+            >
               <BreadcrumbStaticExample />
             </ExampleCard>
           </div>
@@ -69,7 +71,8 @@ export class BreadcrumbPage extends React.Component<IComponentDemoPageProps, any
             </ul>
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.visualtest.tsx
index 87155b8a21ee2..ca2f73cab719b 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.visualtest.tsx
@@ -17,7 +17,8 @@ export default class BreadcrumbVPage extends React.Component<any, any> {
           { text: 'This is folder 4', 'key': 'f4', onClick: () => { return; } },
           { text: 'This is folder 5', 'key': 'f5', onClick: () => { return; } },
         ] }
-        maxDisplayedItems={ 3 } />
+        maxDisplayedItems={ 3 }
+      />
     </div>;
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
index b92d7ea2152b8..bfff3bb652a0c 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
@@ -29,7 +29,8 @@ export class BreadcrumbBasicExample extends React.Component<any, any> {
             { text: 'This is folder 5', 'key': 'f5', onClick: this._onBreadcrumbItemClicked, isCurrentItem: true },
           ] }
           maxDisplayedItems={ 6 }
-          ariaLabel={ 'Website breadcrumb' } />
+          ariaLabel={ 'Website breadcrumb' }
+        />
         <Breadcrumb
           items={ [
             { text: 'Files', 'key': 'Files', href: '#/examples/breadcrumb', onClick: this._onBreadcrumbItemClicked },
@@ -40,7 +41,8 @@ export class BreadcrumbBasicExample extends React.Component<any, any> {
             { text: 'This is link 5', 'key': 'l5', href: '#/examples/breadcrumb', onClick: this._onBreadcrumbItemClicked, isCurrentItem: true },
           ] }
           maxDisplayedItems={ 3 }
-          ariaLabel={ 'Website breadcrumb' } />
+          ariaLabel={ 'Website breadcrumb' }
+        />
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx
index 370ecd765cbe0..81730a07d6b8a 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx
@@ -31,7 +31,8 @@ export class BreadcrumbStaticExample extends React.Component<any, any> {
           // Returning undefined to OnReduceData tells the breadcrumb not to shrink
           onReduceData={ (data) => undefined }
           maxDisplayedItems={ 3 }
-          ariaLabel={ 'Website breadcrumb' } />
+          ariaLabel={ 'Website breadcrumb' }
+        />
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
index 87ea960af7637..fdd5c7de15d68 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
@@ -55,7 +55,8 @@ describe('DefaultButton', () => {
     button = ReactTestUtils.renderIntoDocument<any>(
       <DefaultButton
         href='http://www.microsoft.com'
-        target='_blank'>
+        target='_blank'
+      >
         Hello
       </DefaultButton>
     );
@@ -68,7 +69,8 @@ describe('DefaultButton', () => {
       <DefaultButton
         href='http://www.microsoft.com'
         target='_blank'
-        aria-label='MyLabel'>
+        aria-label='MyLabel'
+      >
         Hello
       </DefaultButton>
     );
@@ -81,7 +83,8 @@ describe('DefaultButton', () => {
       <DefaultButton
         href='http://www.microsoft.com'
         target='_blank'
-        aria-labelledby='someid'>
+        aria-labelledby='someid'
+      >
         Hello
       </DefaultButton>
     );
@@ -95,7 +98,8 @@ describe('DefaultButton', () => {
         href='http://www.microsoft.com'
         target='_blank'
         ariaDescription='This description is not visible'
-        styles={ { screenReaderText: 'some-screenreader-class' } }>
+        styles={ { screenReaderText: 'some-screenreader-class' } }
+      >
         Hello
       </DefaultButton>
     );
@@ -108,7 +112,8 @@ describe('DefaultButton', () => {
       <IconButton
         iconProps={ { iconName: 'Emoji2' } }
         ariaDescription='Description on icon button'
-        styles={ { screenReaderText: 'some-screenreader-class' } } />
+        styles={ { screenReaderText: 'some-screenreader-class' } }
+      />
     );
     renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
     expect(renderedDOM.getAttribute('aria-label') === null);
@@ -118,7 +123,8 @@ describe('DefaultButton', () => {
     button = ReactTestUtils.renderIntoDocument<any>(
       <CompoundButton
         description='Some awesome description'
-        ariaDescription='Description on icon button'>
+        ariaDescription='Description on icon button'
+      >
         And this is the label
       </CompoundButton>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
index d42fab182f936..b308c796ce180 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
@@ -146,7 +146,8 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
             </ul>
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.visualtest.tsx
index 3fe9d8f7f542b..5a5b4f1e6c753 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.visualtest.tsx
@@ -26,37 +26,50 @@ export default class ButtonVPage extends React.Component<any, any> {
         <IconButton id={ 'IconButtonChecked' } checked={ true } iconProps={ { iconName } } />
       </div>&nbsp;
       <div style={ { backgroundColor: 'white' } }>
-        <CommandButton id='CommandButton'
+        <CommandButton
+          id='CommandButton'
           icon='AddFriend'
-          text='Command Button' />
+          text='Command Button'
+        />
       </div>&nbsp;
       <div style={ { backgroundColor: 'white' } }>
-        <CommandButton id='CommandButtonDisabled' icon='AddFriend'
+        <CommandButton
+          id='CommandButtonDisabled'
+          icon='AddFriend'
           disabled={ true }
-          text='Command Button' />
+          text='Command Button'
+        />
       </div >&nbsp;
       <div style={ { backgroundColor: 'white' } }>
-        <CommandButton id='CommandButtonChecked'
+        <CommandButton
+          id='CommandButtonChecked'
           checked={ true }
           icon='AddFriend'
-          text='Command Button' />
+          text='Command Button'
+        />
       </div>&nbsp;
       <div>
-        <CompoundButton id='CompoundButton'
+        <CompoundButton
+          id='CompoundButton'
           description='You can create a new account here.'
-          text='Compound Button' />
+          text='Compound Button'
+        />
       </div>&nbsp;
       <div>
-        <CompoundButton id='CompoundButtonDisabled'
+        <CompoundButton
+          id='CompoundButtonDisabled'
           disabled={ true }
           description='You can create a new account here.'
-          text='Compound Button' />
+          text='Compound Button'
+        />
       </div>&nbsp;
       <div>
-        <CompoundButton id='CompoundButtonChecked'
+        <CompoundButton
+          id='CompoundButtonChecked'
           checked={ true }
           description='You can create a new account here.'
-          text='Compound Button' />
+          text='Compound Button'
+        />
       </div>&nbsp;
       <div>
         <PrimaryButton id='PrimaryButton' icon='Add' text='Primary Button' />
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
index 75273071d7c38..8028fd829f563 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
@@ -24,7 +24,8 @@ export class ButtonAnchorExample extends React.Component<IButtonProps, {}> {
           checked={ checked }
           href='http://bing.com'
           target='_blank'
-          title='Let us bing!'>
+          title='Let us bing!'
+        >
           Bing
         </PrimaryButton>
       </div >
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx
index 06bf11e75b558..8b23e1930ba4c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx
@@ -18,7 +18,8 @@ export class ButtonIconExample extends React.Component<IButtonProps, {}> {
           checked={ checked }
           iconProps={ { iconName: 'Emoji2' } }
           title='Emoji'
-          ariaLabel='Emoji' />
+          ariaLabel='Emoji'
+        />
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx
index d7695f5a31d4e..0c3a1a2180a08 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx
@@ -17,7 +17,8 @@ export class ButtonScreenReaderExample extends React.Component<IButtonProps, {}>
           data-automation-id='test'
           disabled={ disabled }
           checked={ checked }
-          ariaDescription='This is aria description used for screen reader.'>
+          ariaDescription='This is aria description used for screen reader.'
+        >
           Aria Description
         </PrimaryButton>
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
index 7079d62dd5059..2402558e429fd 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
@@ -49,14 +49,16 @@ export class ButtonSwapExample extends React.Component<IButtonProps, IButtonSwap
         ref={ this._setButtonRef }
         disabled={ disabled }
         checked={ checked }
-        onClick={ this._onClick }>
+        onClick={ this._onClick }
+      >
         { text }
       </PrimaryButton>
       : <DefaultButton
         ref={ this._setButtonRef }
         disabled={ disabled }
         checked={ checked }
-        onClick={ this._onClick }>
+        onClick={ this._onClick }
+      >
         { text }
       </DefaultButton>;
 
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
index 13e49229faa19..e5f3ecc08d146 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
@@ -20,28 +20,54 @@ export class CalendarPage extends React.Component<IComponentDemoPageProps, any>
         exampleCards={
           <div>
             <ExampleCard title='Inline Calendar' code={ CalendarInlineExampleCode }>
-              <CalendarInlineExample isMonthPickerVisible={ false } dateRangeType={ DateRangeType.Day } autoNavigateOnSelection={ false }
-                showGoToToday={ false } />
+              <CalendarInlineExample
+                isMonthPickerVisible={ false }
+                dateRangeType={ DateRangeType.Day }
+                autoNavigateOnSelection={ false }
+                showGoToToday={ false }
+              />
             </ExampleCard>
             <ExampleCard title='Inline Calendar with overlayed month picker when header is clicked' code={ CalendarInlineExampleCode }>
-              <CalendarInlineExample showMonthPickerAsOverlay={ true } highlightCurrentMonth={ true } dateRangeType={ DateRangeType.Day } autoNavigateOnSelection={ false }
-                showGoToToday={ false } />
+              <CalendarInlineExample
+                showMonthPickerAsOverlay={ true }
+                highlightCurrentMonth={ true }
+                dateRangeType={ DateRangeType.Day }
+                autoNavigateOnSelection={ false }
+                showGoToToday={ false }
+              />
             </ExampleCard>
             <ExampleCard title='Inline Calendar with month picker' code={ CalendarInlineExampleCode }>
-              <CalendarInlineExample dateRangeType={ DateRangeType.Day } autoNavigateOnSelection={ false } highlightCurrentMonth={ true }
-                showGoToToday={ true } />
+              <CalendarInlineExample
+                dateRangeType={ DateRangeType.Day }
+                autoNavigateOnSelection={ false }
+                highlightCurrentMonth={ true }
+                showGoToToday={ true }
+              />
             </ExampleCard>
             <ExampleCard title='Inline Calendar with week selection' code={ CalendarInlineExampleCode }>
-              <CalendarInlineExample dateRangeType={ DateRangeType.Week } autoNavigateOnSelection={ true }
-                showGoToToday={ true } showNavigateButtons={ true } />
+              <CalendarInlineExample
+                dateRangeType={ DateRangeType.Week }
+                autoNavigateOnSelection={ true }
+                showGoToToday={ true }
+                showNavigateButtons={ true }
+              />
             </ExampleCard>
             <ExampleCard title='Inline Calendar with month selection' code={ CalendarInlineExampleCode }>
-              <CalendarInlineExample dateRangeType={ DateRangeType.Month } autoNavigateOnSelection={ true }
-                showGoToToday={ true } showNavigateButtons={ true } />
+              <CalendarInlineExample
+                dateRangeType={ DateRangeType.Month }
+                autoNavigateOnSelection={ true }
+                showGoToToday={ true }
+                showNavigateButtons={ true }
+              />
             </ExampleCard>
             <ExampleCard title='Inline Calendar with month picker and no day picker' code={ CalendarInlineExampleCode }>
-              <CalendarInlineExample dateRangeType={ DateRangeType.Month } autoNavigateOnSelection={ false }
-                showGoToToday={ true } highlightCurrentMonth={ true } isDayPickerVisible={ false } />
+              <CalendarInlineExample
+                dateRangeType={ DateRangeType.Month }
+                autoNavigateOnSelection={ false }
+                showGoToToday={ true }
+                highlightCurrentMonth={ true }
+                isDayPickerVisible={ false }
+              />
             </ExampleCard>
             <ExampleCard title='Calendar launched from a button' code={ CalendarButtonExampleCode }>
               <CalendarButtonExample />
@@ -86,7 +112,8 @@ export class CalendarPage extends React.Component<IComponentDemoPageProps, any>
             </ul>
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx b/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
index 7811d3fd1268c..d513a414592ec 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
@@ -22,10 +22,10 @@ describe('Callout', () => {
           <Callout
             target='#target'
             directionalHint={ DirectionalHint.topLeftEdge }
-            >
+          >
             <div>
               Content
-                        </div>
+            </div>
           </Callout>
         </div>
       );
@@ -49,10 +49,10 @@ describe('Callout', () => {
           <Callout
             target={ eventTarget }
             directionalHint={ DirectionalHint.topLeftEdge }
-            >
+          >
             <div>
               Content
-                        </div>
+            </div>
           </Callout>
         </div>
       );
@@ -74,10 +74,10 @@ describe('Callout', () => {
           <Callout
             target={ targetElement }
             directionalHint={ DirectionalHint.topLeftEdge }
-            >
+          >
             <div>
               Content
-                        </div>
+            </div>
           </Callout>
         </div>
       );
@@ -99,10 +99,10 @@ describe('Callout', () => {
           <Callout
             targetElement={ targetElement }
             directionalHint={ DirectionalHint.topLeftEdge }
-            >
+          >
             <div>
               Content
-                        </div>
+            </div>
           </Callout>
         </div>
       );
@@ -120,10 +120,10 @@ describe('Callout', () => {
         <div>
           <Callout
             directionalHint={ DirectionalHint.topLeftEdge }
-            >
+          >
             <div>
               Content
-                        </div>
+            </div>
           </Callout>
         </div>
       );
@@ -155,7 +155,7 @@ describe('Callout', () => {
             target='#target'
             directionalHint={ DirectionalHint.topLeftEdge }
             onDismiss={ onDismiss }
-            >
+          >
             <div>
               Content
             </div>
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
index ffd7cb30feec0..f2e47e75050bf 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
@@ -92,7 +92,8 @@ export class CalloutPage extends React.Component<IComponentDemoPageProps, any> {
             </ul>
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
index 6734b2a42624a..723ed6f3bc418 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
@@ -52,7 +52,8 @@ export class CalloutCoverExample extends React.Component<any, ICalloutCoverExamp
             label='Directional hint'
             selectedKey={ DirectionalHint[directionalHint!] }
             options={ DIRECTION_OPTIONS }
-            onChanged={ this._onDirectionalChanged } />
+            onChanged={ this._onDirectionalChanged }
+          />
         </div>
         <div className='ms-CalloutCoverExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton! }>
           <DefaultButton
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
index d558049eaf9c3..3006a71438432 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
@@ -56,19 +56,22 @@ export class CalloutDirectionalExample extends React.Component<any, ICalloutDire
             label='Gap Space'
             min={ 0 }
             defaultValue={ 0 }
-            onChange={ this._onGapSlider } />
+            onChange={ this._onGapSlider }
+          />
           { isBeakVisible &&
             (<Slider
               max={ 50 }
               label='Beak Width'
               min={ 10 }
               defaultValue={ 16 }
-              onChange={ this._onBeakWidthSlider } />) }
+              onChange={ this._onBeakWidthSlider }
+            />) }
           <Dropdown
             label='Directional hint'
             selectedKey={ DirectionalHint[directionalHint!] }
             options={ DIRECTION_OPTIONS }
-            onChanged={ this._onDirectionalChanged } />
+            onChanged={ this._onDirectionalChanged }
+          />
         </div>
         <div className='ms-CalloutExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton! }>
           <DefaultButton
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx
index 2f5023579e481..8474d654a410f 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx
@@ -72,7 +72,8 @@ export class CheckboxPage extends React.Component<IComponentDemoPageProps, any>
         related={
           <a href='https://dev.office.com/fabric-js/Components/CheckBox/CheckBox.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.visualtest.tsx
index 558c0a2bba8f4..8739bfdead97e 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.visualtest.tsx
@@ -5,11 +5,17 @@ import * as React from 'react';
 export default class CheckboxVPage extends React.Component<any, any> {
   public render() {
     return <div style={ { backgroundColor: 'white' } } >
-      <Checkbox className='Checkbox' label='Check Box'
-        defaultChecked={ true } />
-      <Checkbox className='CheckboxDisabled' label='Check Box Disabled'
+      <Checkbox
+        className='Checkbox'
+        label='Check Box'
         defaultChecked={ true }
-        disabled={ true } />
+      />
+      <Checkbox
+        className='CheckboxDisabled'
+        label='Check Box Disabled'
+        defaultChecked={ true }
+        disabled={ true }
+      />
     </div>;
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx
index 3412510f42d24..a3651b1e0ba11 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx
@@ -86,7 +86,8 @@ export class ChoiceGroupPage extends React.Component<IComponentDemoPageProps, {}
         related={
           <a href='https://dev.office.com/fabric-js/Components/ChoiceFieldGroup/ChoiceFieldGroup.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.visualtest.tsx
index db3a7f83ab99c..58326df40da3e 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.visualtest.tsx
@@ -6,7 +6,8 @@ export default class ChoiceGroupVPage extends React.Component<any, any> {
   public render() {
     return <div>
       <div style={ { backgroundColor: 'white' } }>
-        <ChoiceGroup label='Choice Group'
+        <ChoiceGroup
+          label='Choice Group'
           className='ChoiceGroup'
           defaultSelectedKey='pie'
           options={
@@ -18,10 +19,12 @@ export default class ChoiceGroupVPage extends React.Component<any, any> {
               key: 'pie',
               text: 'Pie chart'
             }]
-          } />
+          }
+        />
       </div>&nbsp;
       <div style={ { backgroundColor: 'white' } }>
-        <ChoiceGroup label='Choice Group Icon'
+        <ChoiceGroup
+          label='Choice Group Icon'
           className='ChoiceGroupIcon'
           defaultSelectedKey='week'
           options={
@@ -35,10 +38,12 @@ export default class ChoiceGroupVPage extends React.Component<any, any> {
               iconProps: { iconName: 'CalendarWeek' },
               text: 'Week'
             }]
-          } />
+          }
+        />
       </div>&nbsp;
       <div style={ { backgroundColor: 'white' } }>
-        <ChoiceGroup label='Choice Group Disabled'
+        <ChoiceGroup
+          label='Choice Group Disabled'
           className='ChoiceGroupDisabled'
           defaultSelectedKey='pie'
           disabled={ true }
@@ -51,7 +56,8 @@ export default class ChoiceGroupVPage extends React.Component<any, any> {
               key: 'pie',
               text: 'Pie chart'
             }]
-          } />
+          }
+        />
       </div>&nbsp;
     </div>;
   }
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPickerPage.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPickerPage.tsx
index 54a26b481738a..081481b70f63a 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPickerPage.tsx
@@ -18,7 +18,8 @@ export class ColorPickerPage extends React.Component<IComponentDemoPageProps, {}
         exampleCards={
           <ExampleCard
             title='ColorPicker'
-            code={ ColorPickerBasicExampleCode }>
+            code={ ColorPickerBasicExampleCode }
+          >
             <ColorPickerBasicExample />
           </ExampleCard>
         }
@@ -32,7 +33,8 @@ export class ColorPickerPage extends React.Component<IComponentDemoPageProps, {}
         overview={
           <div>ColorPicker is used to allow a user to select a color</div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
index 5be3cc7cf10b2..5d2611c8cb686 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
@@ -59,7 +59,8 @@ export class ComboBoxPage extends React.Component<IComponentDemoPageProps, {}> {
         related={
           <a href='https://dev.office.com/fabric-js/Components/ComboBox/ComboBox.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx
index ccf27698d003b..c2599c6bdd11d 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx
@@ -82,7 +82,8 @@ export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}>
         related={
           <a href='https://dev.office.com/fabric-js/Components/CommandBar/CommandBar.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
index 30359948d8d4f..b1419899bf243 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
@@ -47,13 +47,15 @@ export class CommandBarBasicExample extends React.Component<any, any> {
           checked={ namesVisible }
           onChanged={ areNamesVisible => this.setState({ areNamesVisible }) }
           onText='Visible'
-          offText='Hidden' />
+          offText='Hidden'
+        />
         <Toggle
           label='Show icons'
           checked={ iconsVisible }
           onChanged={ areIconsVisible => this.setState({ areIconsVisible }) }
           onText='Visible'
-          offText='Hidden' />
+          offText='Hidden'
+        />
         <CommandBar
           isSearchBoxVisible={ searchBoxVisible }
           searchPlaceholderText='Search...'
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
index fbd5675a27cb3..e4c8ad78ea020 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
@@ -69,14 +69,18 @@ export class CommandBarCustomizationExample extends React.Component<{}, ISplitDr
 
     return (
       <div>
-        <div className={ css(
-          styles.customButtonContainer,
-          darkerBG
-        ) } ref={ ref => this.container = ref! }>
+        <div
+          className={ css(
+            styles.customButtonContainer,
+            darkerBG
+          ) }
+          ref={ ref => this.container = ref! }
+        >
           <CommandButton
             className={ mainBtnClassName }
             iconProps={ { iconName: 'Add' } }
-            text='New' />
+            text='New'
+          />
           <span className={ styles.splitter }>|</span>
           <CommandButton
             onClick={ this._onClickChevron }
@@ -84,7 +88,8 @@ export class CommandBarCustomizationExample extends React.Component<{}, ISplitDr
             menuProps={ {
               className: css('ms-CommandBar-menuHost'),
               items: item.subMenuProps!.items
-            } } />
+            } }
+          />
         </div>
       </div >
     );
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
index 140fd2a9e553a..6f819c6988d69 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
@@ -89,7 +89,8 @@ export class ContextualMenuPage extends React.Component<IComponentDemoPageProps,
         related={
           <a href='https://dev.office.com/fabric-js/Components/ContextualMenu/ContextualMenu.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
index a0dde5c663b5f..414e2bfef0548 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
@@ -31,7 +31,8 @@ export class ContextualMenuCheckmarksExample extends React.Component<any, IConte
     return (
       <div>
         <DefaultButton
-          onClick={ this._onClick } id='ContextualMenuButton2'
+          onClick={ this._onClick }
+          id='ContextualMenuButton2'
           text='Click for ContextualMenu'
         />
         { this.state.isContextMenuVisible ? (
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
index d58dc19b60f3a..23017abe9b40d 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
@@ -239,7 +239,8 @@ export class ContextualMenuCustomizationExample extends React.Component<any, ICo
               <div>
                 <span
                   className='ms-ContextualMenu-icon ms-ContextualMenu-customizationExample-categorySwatch'
-                  style={ { backgroundColor: category.color } } />
+                  style={ { backgroundColor: category.color } }
+                />
                 <span className='ms-ContextualMenu-itemText'>
                   { category.name }
                 </span>
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
index f071c5d8692c3..58e58a14137d2 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
@@ -80,19 +80,22 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
             label='Gap Space'
             min={ 0 }
             defaultValue={ 0 }
-            onChange={ this._onGapSlider } />
+            onChange={ this._onGapSlider }
+          />
           { isBeakVisible &&
             (<Slider
               max={ 50 }
               label='Beak Width'
               min={ 10 }
               defaultValue={ 10 }
-              onChange={ this._onBeakWidthSlider } />) }
+              onChange={ this._onBeakWidthSlider }
+            />) }
           <Dropdown
             label='Directional hint'
             selectedKey={ DirectionalHint[directionalHint!] }
             options={ DIRECTION_OPTIONS }
-            onChanged={ this._onDirectionalChanged } />
+            onChanged={ this._onDirectionalChanged }
+          />
           { getRTL() &&
             <Checkbox label='Use RTL directional hint' checked={ useDirectionalHintForRtl } onChange={ this._onUseRtlHintChange } />
           }
@@ -102,7 +105,8 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
               selectedKey={ DirectionalHint[directionalHintForRTL!] }
               options={ DIRECTION_OPTIONS }
               onChanged={ this._onDirectionalRtlChanged }
-              disabled={ !useDirectionalHintForRtl } />
+              disabled={ !useDirectionalHintForRtl }
+            />
           }
         </div>
         <div className='ms-ContextualMenuDirectionalExample-buttonArea' ref='menuButton'>

From 5535d4993cccecd9ee860e6ff1a96445d686c46c Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 5 Sep 2017 18:21:39 -0700
Subject: [PATCH 0574/1641] Updating jest. (#2746)

---
 common/config/rush/npm-shrinkwrap.json | 507 ++++++++++---------------
 scripts/package.json                   |   4 +-
 scripts/tasks/jest-reporter.js         |   2 +-
 3 files changed, 200 insertions(+), 313 deletions(-)

diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 4f14cb5ce650a..ed51282b4809f 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -2072,19 +2072,19 @@
       "integrity": "sha1-MEQ4FkfhHulzxa8uklMjkw9pHYA="
     },
     "@uifabric/example-app-base": {
-      "version": "4.2.6",
-      "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-4.2.6.tgz",
-      "integrity": "sha512-rRhD4dnpSklqMQs6zofsaFG5iYn0fahqWYG+TfdtNVFqrj9CyDBxzuRDE2VwVRDUn5qjQNT0h7rw21Hdrl0+Lg=="
+      "version": "4.2.7",
+      "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-4.2.7.tgz",
+      "integrity": "sha512-hy790+Zhsc3E75RWZHoZ7JRK0Mk+j0nf9rhwQZ7eA1+88ZuNo/6eBdeLC/5LynS7Fz35VVnMYWWFKxWumdrOxA=="
     },
     "@uifabric/styling": {
-      "version": "0.22.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.22.0.tgz",
-      "integrity": "sha512-tmILPrBGdaUBcbK+hebGN52wk2X37Wh+t3seik8lsWYx5rB/mSJuaM2AI747HhHZnubP2WhgRDJ/gLvlKWUiiQ=="
+      "version": "0.22.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.22.1.tgz",
+      "integrity": "sha512-wbWlJUVtvUoxdK2ux/m6M+mO3xkAdM0FQNitghomRE+0X14GwlujYnQDGCOyw5+bcLYMpGB/qy6J1QyCBh5AoQ=="
     },
     "@uifabric/utilities": {
-      "version": "4.12.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.12.1.tgz",
-      "integrity": "sha512-X1CcA36VLiIQmGAgxV8F4R/PZ9yDwZS6NB65H19koMAfHGJaFniQTtNm0fBNEIJTLXToFzSloMuWXkacIXFh0w=="
+      "version": "4.13.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.13.0.tgz",
+      "integrity": "sha512-fptKRD3yhvcfyRHV5tPKBY3IGmdyhrXV4svyrxgCEI44gDXurxS83PQeCf86X4+J03FtuNDo/nQYkUDMTBJCFg=="
     },
     "abab": {
       "version": "1.0.3",
@@ -2159,9 +2159,9 @@
       "integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU="
     },
     "ansi-escapes": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz",
-      "integrity": "sha1-06ioOzGapneTZisT52HHkRQiMG4="
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-2.0.0.tgz",
+      "integrity": "sha1-W65SvkJIeN2Xg+iRDj/Cki6DyBs="
     },
     "ansi-html": {
       "version": "0.0.7",
@@ -2452,9 +2452,9 @@
       "integrity": "sha1-NHHenK7DiOXIUOWX5Yom3fN2ArI="
     },
     "babel-jest": {
-      "version": "20.0.3",
-      "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-20.0.3.tgz",
-      "integrity": "sha1-5KA7E9wQOJ4UD8ZF0J/8TO0wFnE="
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-21.0.0.tgz",
+      "integrity": "sha512-MfZq0KK4tB7V3bCSHrzBa/F8lkhAjnG40asnaBHXdeOiFSOH7eTcVlU4pNz2jsdqclqhc0kO2mkGajKlZRqBKQ=="
     },
     "babel-messages": {
       "version": "6.23.0",
@@ -2467,9 +2467,9 @@
       "integrity": "sha1-GN3oS/POMp/d8/QQP66SFFbY5Yc="
     },
     "babel-plugin-jest-hoist": {
-      "version": "20.0.3",
-      "resolved": "https://registry.npmjs.org/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-20.0.3.tgz",
-      "integrity": "sha1-r+3IU70/jcNUjqZx++adA8wsF2c="
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-21.0.0.tgz",
+      "integrity": "sha512-Vn5qE/9mebjmdLNZkLTNCWsYS2U4dBAHOENQt5JPSVBP/kw26vy/M9H+byo4wHGF6n99dn9k4RO04DEhnjRI3Q=="
     },
     "babel-plugin-transform-es2015-modules-commonjs": {
       "version": "6.26.0",
@@ -2482,9 +2482,9 @@
       "integrity": "sha1-1fr3qleKZbvlkc9e2uBKDGcCB1g="
     },
     "babel-preset-jest": {
-      "version": "20.0.3",
-      "resolved": "https://registry.npmjs.org/babel-preset-jest/-/babel-preset-jest-20.0.3.tgz",
-      "integrity": "sha1-y6yq3stdaJyh4d4TYOv8ZoYsF4o="
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/babel-preset-jest/-/babel-preset-jest-21.0.0.tgz",
+      "integrity": "sha512-AFTR98CHu62hdQgNyHyvbapM2Ke0ETqZKgIBd26cLCu2HNs6BIeF4HbqosfICHJAF2lFHkTz6d3xHrolsQ9Lcw=="
     },
     "babel-register": {
       "version": "6.26.0",
@@ -2691,9 +2691,9 @@
       "integrity": "sha1-81HTKWnTL6XXpVZxVCY9korjvR8="
     },
     "browserify-aes": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.6.tgz",
-      "integrity": "sha1-Xncl297x/Vkw1OurSFZ85FHEigo="
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.8.tgz",
+      "integrity": "sha512-WYCMOT/PtGTlpOKFht0YJFYcPy6pLCR98CtWfzK13zoynLlBMvAdEMSRGmgnJCw2M2j/5qxBkinZQFobieM8dQ=="
     },
     "browserify-cipher": {
       "version": "1.0.0",
@@ -2798,14 +2798,14 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000721",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000721.tgz",
-      "integrity": "sha1-zcUu/o+C3RORZhW3job3BOzmGAI="
+      "version": "1.0.30000725",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000725.tgz",
+      "integrity": "sha1-IPIxPXlAHgL2GEDzlpi8jFWIEaY="
     },
     "caniuse-lite": {
-      "version": "1.0.30000721",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000721.tgz",
-      "integrity": "sha1-kxohp72FAWMAMo0h8SbYS3NDfTU="
+      "version": "1.0.30000725",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000725.tgz",
+      "integrity": "sha1-T6ZjcjI8b/RsihugP53Nc9ehyzk="
     },
     "cardinal": {
       "version": "1.0.0",
@@ -2855,9 +2855,9 @@
       "integrity": "sha1-eY5ol3gVHIB2tLNg5e3SjNortGg="
     },
     "ci-info": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-1.0.0.tgz",
-      "integrity": "sha1-3FKF8rTiUYIWg2gcOBwziPRuxTQ="
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-1.1.1.tgz",
+      "integrity": "sha512-vHDDF/bP9RYpTWtUhpJRhCFdvvp3iDWvEbuDbWgvjUrNGV1MXJrE0MPcwGtEled04m61iwdBLUIHZtDgzWS4ZQ=="
     },
     "cipher-base": {
       "version": "1.0.4",
@@ -3497,9 +3497,9 @@
       "integrity": "sha1-gGZJMmzqp8qjMG112YXqJ0i6kTw="
     },
     "diff": {
-      "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/diff/-/diff-3.3.0.tgz",
-      "integrity": "sha512-w0XZubFWn0Adlsapj9EAWX0FqWdO4tz8kc3RiYdWLh4k/V8PTb6i0SMgXt0vRM3zyKnT8tKO7mUlieRQHIjMNg=="
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/diff/-/diff-3.3.1.tgz",
+      "integrity": "sha512-MKPHZDMB0o6yHyDryUOScqZibp914ksXwAMYMTHj6KO8UeKsRYNJD3oNCKjTqZon+V488P7N/HzXF8t7ZR95ww=="
     },
     "diffie-hellman": {
       "version": "5.0.2",
@@ -3681,9 +3681,9 @@
       "integrity": "sha1-+FWobOYa3E6GIcPNoh56dhLDqNw="
     },
     "es-abstract": {
-      "version": "1.8.1",
-      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.8.1.tgz",
-      "integrity": "sha512-G6pkMLdmxF3dh4hbuYuQiku29rRqo9p5+iRf7mZTEELT/xZ/D9Vzg04ddlvzJuJuCmZp1WBbfbVLZEeygYNkpw=="
+      "version": "1.8.2",
+      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.8.2.tgz",
+      "integrity": "sha512-dvhwFL3yjQxNNsOWx6exMlaDrRHCRGMQlnx5lsXDCZ/J7G/frgIIl94zhZSp/galVAYp7VzPi1OrAHta89/yGQ=="
     },
     "es-to-primitive": {
       "version": "1.1.1",
@@ -3813,9 +3813,9 @@
       "integrity": "sha1-Cs7ehJ7X3RzMMsgRuxG5RNTykjI="
     },
     "evp_bytestokey": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/evp_bytestokey/-/evp_bytestokey-1.0.2.tgz",
-      "integrity": "sha512-ni0r0lrm7AOzsh2qC5mi9sj8S0gmj5fLNjfFpxN05FB4tAVZEKotbkjOtLPqTCX/CXT7NsUr6juZb4IFJeNNdA=="
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/evp_bytestokey/-/evp_bytestokey-1.0.3.tgz",
+      "integrity": "sha512-/f2Go4TognH/KvCISP7OUsHn85hT9nUkxxA9BEWxFn+Oj9o8ZNLm/40hdlgSLyuOimsrTKLUMEorQexp/aPQeA=="
     },
     "exec-sh": {
       "version": "0.2.0",
@@ -3920,6 +3920,11 @@
         }
       }
     },
+    "expect": {
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/expect/-/expect-21.0.0.tgz",
+      "integrity": "sha512-uPFxiEqdzxQLRw426WAifJWPsGZaE3gldlP7NX1tJ8pWmClCIMEFTII41ExuzEYaIwXjMLugmVq7cbUzAEBShw=="
+    },
     "express": {
       "version": "4.15.4",
       "resolved": "https://registry.npmjs.org/express/-/express-4.15.4.tgz",
@@ -4583,6 +4588,11 @@
       "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.3.1.tgz",
       "integrity": "sha1-jM/OkhVyCMEgsq+tftBcERFMCG4="
     },
+    "imurmurhash": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz",
+      "integrity": "sha1-khi5srkoojixPcT7a21XbyMUU+o="
+    },
     "in-publish": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/in-publish/-/in-publish-2.0.0.tgz",
@@ -4926,9 +4936,9 @@
       }
     },
     "istanbul-api": {
-      "version": "1.1.13",
-      "resolved": "https://registry.npmjs.org/istanbul-api/-/istanbul-api-1.1.13.tgz",
-      "integrity": "sha1-cZf2RBNgDr3+xjR6LcPU4D+X7Vo="
+      "version": "1.1.14",
+      "resolved": "https://registry.npmjs.org/istanbul-api/-/istanbul-api-1.1.14.tgz",
+      "integrity": "sha1-JbxXAffGgMD//5E95G42GaOm5oA="
     },
     "istanbul-instrumenter-loader": {
       "version": "3.0.0",
@@ -4946,9 +4956,9 @@
       "integrity": "sha512-3U2HB9y1ZV9UmFlE12Fx+nPtFqIymzrqCksrXujm3NVbAZIJg/RfYgO1XiIa0mbmxTjWpVEVlkIZJ25xVIAfkQ=="
     },
     "istanbul-lib-instrument": {
-      "version": "1.7.5",
-      "resolved": "https://registry.npmjs.org/istanbul-lib-instrument/-/istanbul-lib-instrument-1.7.5.tgz",
-      "integrity": "sha1-rbWW+PDLi5XnOSBjUaOKWGryGx4=",
+      "version": "1.8.0",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-instrument/-/istanbul-lib-instrument-1.8.0.tgz",
+      "integrity": "sha1-ZvbJQhzJ7EcE928tsIS6kHiitTI=",
       "dependencies": {
         "semver": {
           "version": "5.4.1",
@@ -4985,14 +4995,14 @@
       "integrity": "sha1-D7Lj9qqZIr085F0F2KtNXo4HvU8="
     },
     "jest": {
-      "version": "20.0.4",
-      "resolved": "https://registry.npmjs.org/jest/-/jest-20.0.4.tgz",
-      "integrity": "sha1-PdJgwpidba1nix6cxNkZRPbWAqw=",
+      "version": "21.0.1",
+      "resolved": "https://registry.npmjs.org/jest/-/jest-21.0.1.tgz",
+      "integrity": "sha512-KLoBNahMA7gnAHbZ7msoivm8G52Emh4Qe4cYwInuJLwlUZRWfFFAHjao1fQ8iyiikp9eWgJcE94IJkZ58XVtmA==",
       "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        "ansi-regex": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg="
         },
         "arr-diff": {
           "version": "2.0.0",
@@ -5014,15 +5024,22 @@
           "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
           "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
         },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
-        },
         "cliui": {
           "version": "3.2.0",
           "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
-          "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
+          "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0=",
+          "dependencies": {
+            "ansi-regex": {
+              "version": "2.1.1",
+              "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
+              "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
+            },
+            "strip-ansi": {
+              "version": "3.0.1",
+              "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
+              "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8="
+            }
+          }
         },
         "expand-brackets": {
           "version": "0.1.5",
@@ -5040,9 +5057,9 @@
           "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
         },
         "jest-cli": {
-          "version": "20.0.4",
-          "resolved": "https://registry.npmjs.org/jest-cli/-/jest-cli-20.0.4.tgz",
-          "integrity": "sha1-5TKxnYiuW8bEF+iwWTpv6VSx3JM="
+          "version": "21.0.1",
+          "resolved": "https://registry.npmjs.org/jest-cli/-/jest-cli-21.0.1.tgz",
+          "integrity": "sha512-y0j2vSETbdpkkrusqSYehhKQj1K0g8gB3L9vT3aTCppAjGO2aoWfql7HNv8jIF1bdmt+ssUPChWYgL1CUbpOcw=="
         },
         "kind-of": {
           "version": "3.2.2",
@@ -5054,10 +5071,10 @@
           "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
           "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
         },
-        "supports-color": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+        "strip-ansi": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8="
         },
         "yargs": {
           "version": "7.1.0",
@@ -5067,73 +5084,44 @@
       }
     },
     "jest-changed-files": {
-      "version": "20.0.3",
-      "resolved": "https://registry.npmjs.org/jest-changed-files/-/jest-changed-files-20.0.3.tgz",
-      "integrity": "sha1-k5TVzGXEOEBhSb7xv01Sto4D4/g="
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/jest-changed-files/-/jest-changed-files-21.0.0.tgz",
+      "integrity": "sha512-6xmPTJfRK6rmOTRFZ9Lc9Eyk/ov4H24Ts77bV/PkbSl4T29/e8w3QYxMhrcOLu4Ie561TdCRgq+NISWNojCYdQ=="
     },
     "jest-config": {
-      "version": "20.0.4",
-      "resolved": "https://registry.npmjs.org/jest-config/-/jest-config-20.0.4.tgz",
-      "integrity": "sha1-43kwqyIXyRNgXv8T5712PsSPruo=",
-      "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
-        },
-        "supports-color": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-        }
-      }
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/jest-config/-/jest-config-21.0.0.tgz",
+      "integrity": "sha512-a0na/HLdnZdjFbBFd/VwRp47XyFBJqGPl1fgBHcOnNrM8ss7O6yxOY57GiA8whzOx3JC03edE5iNOZ4RDHbOAQ=="
     },
     "jest-diff": {
-      "version": "20.0.3",
-      "resolved": "https://registry.npmjs.org/jest-diff/-/jest-diff-20.0.3.tgz",
-      "integrity": "sha1-gfKI/Z5nXw+yPHXxwrGURf5YZhc=",
-      "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
-        },
-        "supports-color": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-        }
-      }
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/jest-diff/-/jest-diff-21.0.0.tgz",
+      "integrity": "sha512-AsMhrVl9aJtz5E0fvNgXD2abNc4BLT3AfUZGzw2WBlPOLjnQ9VsnByI86d63fNRMZJQTE870YDLZNQtbat1IPw=="
     },
     "jest-docblock": {
-      "version": "20.0.3",
-      "resolved": "https://registry.npmjs.org/jest-docblock/-/jest-docblock-20.0.3.tgz",
-      "integrity": "sha1-F76phDQswz2DxQ++FUXqDvqkRxI="
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/jest-docblock/-/jest-docblock-21.0.0.tgz",
+      "integrity": "sha512-nhcLynqskWevUQQ3ZJcIO/5v8bpshydwMOgN9Wsszc6Ri8HVaegGIpbrz/ALzMrSeQ4njAUfXVeY7WDMOPbm2w=="
     },
     "jest-environment-jsdom": {
-      "version": "20.0.3",
-      "resolved": "https://registry.npmjs.org/jest-environment-jsdom/-/jest-environment-jsdom-20.0.3.tgz",
-      "integrity": "sha1-BIqKwS7iJfcZBBdxODS7mZeH3pk="
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/jest-environment-jsdom/-/jest-environment-jsdom-21.0.0.tgz",
+      "integrity": "sha512-w+at4edF/Cgc20INKxy0g3of1kLCVKFjhRsUvBfW+arMTQ5rKTCcg8+suQ5VmOeXh/d2DgRmLBAoyAixnJiffA=="
     },
     "jest-environment-node": {
-      "version": "20.0.3",
-      "resolved": "https://registry.npmjs.org/jest-environment-node/-/jest-environment-node-20.0.3.tgz",
-      "integrity": "sha1-1Ii8RhKvLCRumG6K52caCZFj1AM="
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/jest-environment-node/-/jest-environment-node-21.0.0.tgz",
+      "integrity": "sha512-oSolLYaUWe1KtXw9bexGw4X3x5gV6qk4B67SwwthfaY+gLjHOqFK8Q9NWbDvfOAdWxDz2K7vSzP63DHsLdmY6w=="
+    },
+    "jest-get-type": {
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/jest-get-type/-/jest-get-type-21.0.0.tgz",
+      "integrity": "sha512-JE2NylM4fkuEI3W4n8+lcebJ/Fk6+msny4JgRP85I0LUlNqqs7lv19YTwbP6h3YLh7nVITndvVDixZyI/AZjQw=="
     },
     "jest-haste-map": {
-      "version": "20.0.4",
-      "resolved": "https://registry.npmjs.org/jest-haste-map/-/jest-haste-map-20.0.4.tgz",
-      "integrity": "sha1-ZT61XIic48Ah97lGk/IKQVm63wM=",
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/jest-haste-map/-/jest-haste-map-21.0.0.tgz",
+      "integrity": "sha512-Hc7FfB3W1braN64iczZggBzjmpsc2yG+HQxXM45qQHtB9xqX2gANbyx5REE3p9FPcxHg11mgwiSIpD4UOQIMpw==",
       "dependencies": {
         "arr-diff": {
           "version": "2.0.0",
@@ -5178,64 +5166,20 @@
       }
     },
     "jest-jasmine2": {
-      "version": "20.0.4",
-      "resolved": "https://registry.npmjs.org/jest-jasmine2/-/jest-jasmine2-20.0.4.tgz",
-      "integrity": "sha1-/MWxQReA2RHQQpAu8YWehS5g1eE=",
-      "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
-        },
-        "supports-color": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-        }
-      }
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/jest-jasmine2/-/jest-jasmine2-21.0.0.tgz",
+      "integrity": "sha512-zWu/7j/xxUGS6Qj5LaMDSLKa+voNtjUNBuDwckxSoZqJIFgP+sq8zhvUQzAFEHpqXwZ14CaOJTNUSHCHd1ad+g=="
     },
     "jest-matcher-utils": {
-      "version": "20.0.3",
-      "resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-20.0.3.tgz",
-      "integrity": "sha1-s6a443yld4A7CDKpixZPRLeBVhI=",
-      "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
-        },
-        "supports-color": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-        }
-      }
-    },
-    "jest-matchers": {
-      "version": "20.0.3",
-      "resolved": "https://registry.npmjs.org/jest-matchers/-/jest-matchers-20.0.3.tgz",
-      "integrity": "sha1-ymnbHDLbWm9wf6XgQBq7VXAN/WA="
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-21.0.0.tgz",
+      "integrity": "sha512-obYczfXWsEOBNLIDaDQQN9OjpWFKhaUPEgtLBnu/Yp4kz0PyjvvftHE2pOY1v3a0rRkWIQYjfYUybyRE/BNg5Q=="
     },
     "jest-message-util": {
-      "version": "20.0.3",
-      "resolved": "https://registry.npmjs.org/jest-message-util/-/jest-message-util-20.0.3.tgz",
-      "integrity": "sha1-auwoRDBvyw5udNV5bBAG2W/dgxw=",
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/jest-message-util/-/jest-message-util-21.0.0.tgz",
+      "integrity": "sha512-NSgzgIMZx0FpqERApgZNWzO3g5DOtJDCKjpm0QFIgKdiWWLkLI+S3eeG+yaGboVZ03aiS3nxi1j2wE0f6GnKhQ==",
       "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
-        },
         "arr-diff": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
@@ -5251,11 +5195,6 @@
           "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
           "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
         },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
-        },
         "expand-brackets": {
           "version": "0.1.5",
           "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
@@ -5280,44 +5219,46 @@
           "version": "2.3.11",
           "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
           "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
-        },
-        "supports-color": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
         }
       }
     },
     "jest-mock": {
-      "version": "20.0.3",
-      "resolved": "https://registry.npmjs.org/jest-mock/-/jest-mock-20.0.3.tgz",
-      "integrity": "sha1-i8Bw6QQUqhVcEajWTIaaDVxx2lk="
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/jest-mock/-/jest-mock-21.0.0.tgz",
+      "integrity": "sha512-QZQqZ40iXr510cFGj8yY/tCxfDXDdulmEjgBS0CbHub6ILU79OXF84sSSHDD0elc9WDuzMFoSFF4IrXPBDmtWQ=="
     },
     "jest-regex-util": {
-      "version": "20.0.3",
-      "resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-20.0.3.tgz",
-      "integrity": "sha1-hburXRM+RGJbGfr4xqpRItCF12I="
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-21.0.0.tgz",
+      "integrity": "sha512-4xVhz33XZpeoNCplooEBc0PdOW7BCydT8wqvGlgxEzteUWXvctFdvMwzqdUv7ZjCN3QRMZ04SVruHlkMsAH6Eg=="
     },
     "jest-resolve": {
-      "version": "20.0.4",
-      "resolved": "https://registry.npmjs.org/jest-resolve/-/jest-resolve-20.0.4.tgz",
-      "integrity": "sha1-lEiz6La6/BVHlETGSZBFt//ll6U="
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/jest-resolve/-/jest-resolve-21.0.0.tgz",
+      "integrity": "sha512-Ic5dYWG9dwH97EPDtWUD8R9So3siDO5vRUS9Pi+lP2b0MveOxqLp5cMyiLubBf3sgGvICICSVLcG4+HUJmdZeQ=="
     },
     "jest-resolve-dependencies": {
-      "version": "20.0.3",
-      "resolved": "https://registry.npmjs.org/jest-resolve-dependencies/-/jest-resolve-dependencies-20.0.3.tgz",
-      "integrity": "sha1-bhSntxevDyyzZnxUneQK8Bexcjo="
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/jest-resolve-dependencies/-/jest-resolve-dependencies-21.0.0.tgz",
+      "integrity": "sha512-GB2BFAvt8IsoGuOu1SZ4sRq/m3gljH81BLU99JKJSvU0dURjli3FEaPh6cHqZ2HyqyCPEdxI2Rx+mUkasXz9Mg=="
+    },
+    "jest-runner": {
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/jest-runner/-/jest-runner-21.0.0.tgz",
+      "integrity": "sha512-FFOUM6C0kNxgxVVmItoxi/UWNYWq4rn+uWj7HC4tMexjEfZb8esL8CvJ8DSDW+cVwfKEg/UqXpHJcUaFzE1k2w==",
+      "dependencies": {
+        "throat": {
+          "version": "3.2.0",
+          "resolved": "https://registry.npmjs.org/throat/-/throat-3.2.0.tgz",
+          "integrity": "sha512-/EY8VpvlqJ+sFtLPeOgc8Pl7kQVOWv0woD87KTXVHPIAE842FGT+rokxIhe8xIUP1cfgrkt0as0vDLjDiMtr8w=="
+        }
+      }
     },
     "jest-runtime": {
-      "version": "20.0.4",
-      "resolved": "https://registry.npmjs.org/jest-runtime/-/jest-runtime-20.0.4.tgz",
-      "integrity": "sha1-osgCIZxCA/dU3xQE5JAYYWnRJNg=",
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/jest-runtime/-/jest-runtime-21.0.0.tgz",
+      "integrity": "sha512-qgYWvuLrk5G1oaahRqKkeTZud+O0BJYEFbw/BPBaO5N3Z9Q0H8LtLxiR1RH7KiHjg/BMKhcQCvZ5nN3HPAfIpw==",
       "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
-        },
         "arr-diff": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
@@ -5338,11 +5279,6 @@
           "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
           "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
         },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
-        },
         "cliui": {
           "version": "3.2.0",
           "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
@@ -5378,11 +5314,6 @@
           "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
           "integrity": "sha1-IzTBjpx1n3vdVv3vfprj1YjmjtM="
         },
-        "supports-color": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-        },
         "yargs": {
           "version": "7.1.0",
           "resolved": "https://registry.npmjs.org/yargs/-/yargs-7.1.0.tgz",
@@ -5391,70 +5322,19 @@
       }
     },
     "jest-snapshot": {
-      "version": "20.0.3",
-      "resolved": "https://registry.npmjs.org/jest-snapshot/-/jest-snapshot-20.0.3.tgz",
-      "integrity": "sha1-W4R+GtsaTZCFKn+fElCG4YfHZWY=",
-      "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
-        },
-        "supports-color": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-        }
-      }
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/jest-snapshot/-/jest-snapshot-21.0.0.tgz",
+      "integrity": "sha512-WTwe9Q9I57167nB9VwPOVf8qE0DkOxJalMzFTNTfeW9rSOJfNFIL3ZFn0xSgO+dV5F3HSVcoJSVjxsMpI95DCQ=="
     },
     "jest-util": {
-      "version": "20.0.3",
-      "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-20.0.3.tgz",
-      "integrity": "sha1-DAf32A2C9OWmfG+LnD/n9lz9Mq0=",
-      "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
-        },
-        "supports-color": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-        }
-      }
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-21.0.0.tgz",
+      "integrity": "sha512-ojeYhnFUhGiZ7qsvCa5GV8ZvO5eM9Ha4Z39y7iUjs7Ws2y6JzLVmeh64vkcYf8C+IzwazcHan5vj6O8ESbsr4g=="
     },
     "jest-validate": {
-      "version": "20.0.3",
-      "resolved": "https://registry.npmjs.org/jest-validate/-/jest-validate-20.0.3.tgz",
-      "integrity": "sha1-0M/R3k9XnymEhJJcKA+PHZTsPKs=",
-      "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
-        },
-        "supports-color": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-        }
-      }
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/jest-validate/-/jest-validate-21.0.0.tgz",
+      "integrity": "sha512-mwqGTj4vqzRHiyZpN0sRWFqSkq3lklQWlYAOZsZ2O13prSX1y21PDXI87SfLdAgsp+NOJgX8ZC/3UZ0DiKDL5Q=="
     },
     "js-base64": {
       "version": "2.1.9",
@@ -6468,9 +6348,9 @@
       "integrity": "sha1-JKwXdDPkou6REP5DWAutBZ+gBQk="
     },
     "office-ui-fabric-react": {
-      "version": "4.39.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.39.0.tgz",
-      "integrity": "sha512-KGLv63POjuVgUm9+uITzCSX1z6XDDWs0b1Z22jMEWa9IR8B/SYTXyQ+24u1zdr0zeRKr58NPXNOwd3YK7AbBvg=="
+      "version": "4.40.1",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.40.1.tgz",
+      "integrity": "sha512-MR+SFJCwQe7w6NJ3zlV6cdPSIlS5iA2sNYBD0ndwf8AImvDGAl2pnRodtX78A2FiMsvuoejELcek6TlMv2uwXQ=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -6561,6 +6441,11 @@
       "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.4.tgz",
       "integrity": "sha1-Qv5tWVPfBsgGS+bxdsPQWqqjRkQ="
     },
+    "p-cancelable": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/p-cancelable/-/p-cancelable-0.3.0.tgz",
+      "integrity": "sha512-RVbZPLso8+jFeq1MfNvgXtCRED2raz/dKpacfTNxsx6pLEpEomM7gah6VeHSYV3+vo0OAi4MkArtQcWWXuQoyw=="
+    },
     "p-finally": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/p-finally/-/p-finally-1.0.0.tgz",
@@ -7820,9 +7705,16 @@
       "integrity": "sha1-gV7R9uvGWSb4ZbMQwHE7yzMVzks="
     },
     "pretty-format": {
-      "version": "20.0.3",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-20.0.3.tgz",
-      "integrity": "sha1-Ag41ClYKH+GpjcO+tsz/s4beixQ="
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-21.0.0.tgz",
+      "integrity": "sha512-xICDS0AgbFdP8RNDxi58hOWfm7CDjC88PPx49PA8GmBs6WBwWEMLRT6lU0mtX9snTBBMncQxDNs4rMloCjZwuA==",
+      "dependencies": {
+        "ansi-regex": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg="
+        }
+      }
     },
     "private": {
       "version": "0.1.7",
@@ -8155,9 +8047,9 @@
       "integrity": "sha1-D0WEKVxTo2KK9+bXmsohzlfRxuc="
     },
     "rtl-css-js": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.2.0.tgz",
-      "integrity": "sha1-+GeLbCwlB8ivIstpEgfIDIfRz5Q="
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.3.0.tgz",
+      "integrity": "sha1-TJhtJEbOLYY4mnFu2MFIllf8oDc="
     },
     "safe-buffer": {
       "version": "5.1.1",
@@ -8170,20 +8062,10 @@
       "integrity": "sha1-7dOQk6MYQ3DLhZJDsr3yVefY6mc="
     },
     "sane": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/sane/-/sane-1.6.0.tgz",
-      "integrity": "sha1-lhDEUjB6E10pwf3+JUcDQYDEZ3U=",
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/sane/-/sane-2.0.0.tgz",
+      "integrity": "sha1-mct58h9KU6adTQzZV8LbBAJLjrI=",
       "dependencies": {
-        "bser": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/bser/-/bser-1.0.2.tgz",
-          "integrity": "sha1-OBEWlwsqbe6lZG3RXdcnhES1YWk="
-        },
-        "fb-watchman": {
-          "version": "1.9.2",
-          "resolved": "https://registry.npmjs.org/fb-watchman/-/fb-watchman-1.9.2.tgz",
-          "integrity": "sha1-okz0eCf4LTj7Waaa1wt247auc4M="
-        },
         "minimist": {
           "version": "1.2.0",
           "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
@@ -8825,9 +8707,9 @@
       "integrity": "sha1-45mpgiV6J22uQou5KEXLcb3CbRk="
     },
     "throat": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/throat/-/throat-3.2.0.tgz",
-      "integrity": "sha512-/EY8VpvlqJ+sFtLPeOgc8Pl7kQVOWv0woD87KTXVHPIAE842FGT+rokxIhe8xIUP1cfgrkt0as0vDLjDiMtr8w=="
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/throat/-/throat-4.1.0.tgz",
+      "integrity": "sha1-iQN8vJLFarGJJua6TLsgDhVnKmo="
     },
     "throttleit": {
       "version": "1.0.0",
@@ -8939,9 +8821,9 @@
       "integrity": "sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM="
     },
     "ts-jest": {
-      "version": "20.0.14",
-      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-20.0.14.tgz",
-      "integrity": "sha512-aygKypLeCKVCpAqxEjpE5j4y4lBbh14UU+puQk/LcH3yBT0nRFQs0NzQoE6vgxhg6p1kl4Q5BkfiJdnuGwzqIg==",
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-21.0.0.tgz",
+      "integrity": "sha512-rCNWnrnLLQfE2hb9zrtzuw5MzF0/yLCMdLP9PON+Mce9rV9auBLB+XgY9oZN7Wly7fpwIFwImCk7EVrfUXUfvw==",
       "dependencies": {
         "ansi-regex": {
           "version": "3.0.0",
@@ -9338,9 +9220,9 @@
       "integrity": "sha512-qeUx4nIbeLL53qqNTs3kObPBMkUVDrOjEfp/hTvMlx21qL2MsGNr8/tXCoX/lS12dLl9qtZaXv2qfBEctPScDg==",
       "dependencies": {
         "acorn": {
-          "version": "5.1.1",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.1.1.tgz",
-          "integrity": "sha512-vOk6uEMctu0vQrvuSqFdJyqj1Q0S5VTDL79qtjo+DhRr+1mmaD+tluFSCZqhvi/JUhXSzoZN2BhtstaPEeE8cw=="
+          "version": "5.1.2",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.1.2.tgz",
+          "integrity": "sha512-o96FZLJBPY1lvTuJylGA9Bk3t/GKPPJG8H0ydQQl01crzwJgspa4AEIq/pVTXigmK0PHVQhiAtn8WMBLL9D2WA=="
         },
         "ansi-regex": {
           "version": "3.0.0",
@@ -9439,9 +9321,9 @@
       "integrity": "sha1-tYvDTMMLJ//brz0AvyerpvopxuM=",
       "dependencies": {
         "acorn": {
-          "version": "5.1.1",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.1.1.tgz",
-          "integrity": "sha512-vOk6uEMctu0vQrvuSqFdJyqj1Q0S5VTDL79qtjo+DhRr+1mmaD+tluFSCZqhvi/JUhXSzoZN2BhtstaPEeE8cw=="
+          "version": "5.1.2",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.1.2.tgz",
+          "integrity": "sha512-o96FZLJBPY1lvTuJylGA9Bk3t/GKPPJG8H0ydQQl01crzwJgspa4AEIq/pVTXigmK0PHVQhiAtn8WMBLL9D2WA=="
         },
         "ansi-styles": {
           "version": "2.2.1",
@@ -9606,6 +9488,11 @@
       "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
       "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8="
     },
+    "write-file-atomic": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.3.0.tgz",
+      "integrity": "sha512-xuPeK4OdjWqtfi59ylvVL0Yn35SF3zgcAcv7rBPFHVaEapaDr4GdGgm3j7ckTwH9wHL7fGmgfAnb0+THrHb8tA=="
+    },
     "ws": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/ws/-/ws-1.1.2.tgz",
diff --git a/scripts/package.json b/scripts/package.json
index d3213049d4a53..754f70ba265e6 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -20,8 +20,8 @@
     "gzip-size": "^3.0.0",
     "istanbul-instrumenter-loader": "^3.0.0",
     "json-loader": "^0.5.7",
-    "jest": "^20.0.4",
-    "ts-jest": "^20.0.13",
+    "jest": "^21.0.1",
+    "ts-jest": "^21.0.0",
     "karma": "^1.7.0",
     "karma-coverage": "^1.1.1",
     "karma-mocha": "^1.3.0",
diff --git a/scripts/tasks/jest-reporter.js b/scripts/tasks/jest-reporter.js
index 1ee04c7034c25..03ad965025178 100644
--- a/scripts/tasks/jest-reporter.js
+++ b/scripts/tasks/jest-reporter.js
@@ -1,4 +1,4 @@
-const DefaultReporter = require('jest-cli/build/reporters/DefaultReporter');
+const DefaultReporter = require('jest-cli/build/reporters/default_reporter');
 
 /**
  * The purpose of this custom reporter is to prevent Jest from logging to stderr

From 69d7fc2930c655276882b3552af369775c073faf Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 5 Sep 2017 18:22:05 -0700
Subject: [PATCH 0575/1641] Updating the readme. (#2735)

* Updating the readme.

* Updating the TOC.

* Update README.md
---
 README.md | 78 ++++++++++++++++++++++++++++++++-----------------------
 1 file changed, 46 insertions(+), 32 deletions(-)

diff --git a/README.md b/README.md
index 63daf15a9bebd..e0fb8e5bcf491 100644
--- a/README.md
+++ b/README.md
@@ -9,37 +9,21 @@ Fabric React is a responsive, mobile-first collection of robust components desig
 
 ## Contents
 
-- [View the docs](#view-the-docs)
-- [Get started](#get-started)
-- [Testing](#testing)
-- [Advanced usage](#advanced-usage)
+- [Using Fabric React](#using-fabric-react)
 - [Browser support](#browser-support)
+- [Server-side rendering](#server-side-rendering)
+- [Advanced usage](#advanced-usage)
 - [Contribute to Fabric React](#contribute-to-fabric-react)
+- [Building the repo](#building-the-repo)
+- [Testing](#testing)
+- [Advanced building tips](#advanced-building-tips)
 - [Licenses](#licenses)
 - [Changelog](#changelog)
 
+### Using Fabric React
 
-## View the docs
-
-Before you get started, **make sure you have [node.js](https://nodejs.org/) and [git](https://git-scm.com/) installed.**
-
-To view the documentation including examples, contracts, component status, and to add functionality or fix issues locally, you can:
-
-1. `npm install -g gulp`
-2. `git clone https://github.com/OfficeDev/office-ui-fabric-react.git`
-3. `npm install`
-4. `npm start`
-
-This will run `gulp serve` from the office-ui-fabric-react package folder, which will open a web browser with the example page. You can make changes to the code which will automatically build and refresh the page using live-reload.
-
-To build all packages in the repo, you can use `npm run build`.
-
-## Get started
-
-### Tutorial
 [Here is a step by step tutorial](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/README.md) on how to build a simple React app with an Office UI Fabric React component.
 
-### Integrate into an existing project
 Integrating components into your project depends heavily on your setup. The recommended setup is to use a bundler such as Webpack which can resolve NPM package imports in your code and can bundle the specific things you import.
 
 Within an npm project, you should install the package and save it as a dependency:
@@ -62,7 +46,11 @@ const MyPage = () => (<div><Button>I am a button.</Button></div>);
 ReactDOM.render(<MyPage />, document.body.firstChild);
 ```
 
-## Rendering Fabric components on the server (SSR)
+## Browser support
+
+Fabric React supports many commonly used browsers. See the [browser support doc](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/BROWSERSUPPORT.md) for more information.
+
+## Server-side rendering
 
 If you need to render Fabric components on the server side in a node environment, there is a way to do this. The basic idea is that you need to tell the styles loader to pipe styles into a variable, which you can later use to inject into your page. Example:
 
@@ -98,23 +86,49 @@ console.log(
 
 Note: we are evaluating a more robust theming and style loading approach, which will allow a much more flexible server rendering approach, so this syntax may be simplified in the future.
 
-## Testing
-
-For testing see our [testing documentation](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/TESTING.md).
-
 ## Advanced usage
 
 For advanced usage including info about module vs. path-based imports, using an AMD bundler like Require, and deployment features, see our [advanced documentation](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/ADVANCED.md).
 
-## Browser support
+## Contribute to Fabric React
 
-Fabric React supports many commonly used browsers. See the [browser support doc](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/BROWSERSUPPORT.md) for more information.
+Please take a look at our [contribution guidelines](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/CONTRIBUTING.md) for more info.
 
+## Building the repo
 
-## Contribute to Fabric React
+Before you get started, **make sure you have [node.js](https://nodejs.org/) and [git](https://git-scm.com/) installed.**
 
-We're excited to share our development of this project with folks outside of the company, but please keep in mind that we're moving towards a v1 state which requires that we stay focused on reaching that goal. With this in mind, take a look at our [contribution guidelines](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/CONTRIBUTING.md) for more info on how we plan to look at issues, how to structure your commit messages, and more.
+To view the documentation including examples, contracts, component status, and to add functionality or fix issues locally, you can:
 
+1. `git clone https://github.com/OfficeDev/office-ui-fabric-react.git`
+2. `npm install`
+3. `npm start`
+
+This will start a demo page from the office-ui-fabric-react package folder, which will open a web browser with the example page. You can make changes to the code which will automatically build and refresh the page using live-reload.
+
+To build and run tests for all packages in the repo, you can run `npm run build` from the root.
+
+To build individual packages within the `packages/*/` folders, you can use `npm run build` in each individually. Note that because the packages are symlinked together, you must manage building dependencies in the right order, or use the `rush` tool to build to the specific package you want. (See advanced tips below.)
+
+## Testing
+
+For testing see our [testing documentation](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/TESTING.md).
+
+## Advanced building tips
+
+The repo contains many packages, each which may have dependencies on each other. You can use the rush tool to build projects in the correct order, if you have it globally installed.
+
+```bash
+npm install -g @microsoft/rush
+```
+
+To use rush to build, you can run `rush build`, which will incrementally build the entire repo (only build what has changed since the last build.)
+
+To can also build up to a specific project using the `--to <package>` argument. For example, to build up to `office-ui-fabric-react`, you can run:
+
+```bash
+rush build --to office-ui-fabric-react
+```
 
 ## Licenses
 

From 5dbc0c7e4ee96b25d1e987fdce304024fc32634b Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Tue, 5 Sep 2017 18:22:47 -0700
Subject: [PATCH 0576/1641] Third pass removing unused variables from Fabric
 pkg (#2737)

---
 packages/office-ui-fabric-react/src/VisualTestRoot.tsx    | 1 -
 .../src/components/ActivityItem/ActivityItem.tsx          | 1 -
 .../Breadcrumb/examples/Breadcrumb.Basic.Example.tsx      | 2 --
 .../Breadcrumb/examples/Breadcrumb.Static.Example.tsx     | 2 --
 .../src/components/Button/Button.test.tsx                 | 3 ---
 .../src/components/Button/ButtonPage.tsx                  | 1 -
 .../components/Button/examples/Button.Action.Example.tsx  | 3 ---
 .../Callout/examples/Callout.Nested.Example.tsx           | 2 --
 .../ChoiceGroup/examples/ChoiceGroup.Custom.Example.tsx   | 2 +-
 .../ChoiceGroup/examples/ChoiceGroup.Icon.Example.tsx     | 3 +--
 .../ComboBox/examples/ComboBox.CustomStyled.Example.tsx   | 8 +-------
 .../DetailsList/examples/DetailsList.Basic.Example.tsx    | 4 ----
 .../examples/DetailsList.Documents.Example.tsx            | 1 -
 .../DetailsList/examples/DetailsList.DragDrop.Example.tsx | 5 +----
 .../src/components/Dialog/Dialog.test.tsx                 | 1 -
 .../Dropdown/examples/Dropdown.Custom.Example.tsx         | 2 --
 .../examples/FocusTrapZone.Box.Click.Example.tsx          | 1 -
 .../FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx  | 1 -
 .../FocusTrapZone.Box.FocusOnCustomElement.Example.tsx    | 1 -
 .../examples/FocusTrapZone.Nested.Example.tsx             | 5 +----
 .../HoverCard/examples/HoverCard.Basic.Example.tsx        | 4 ++--
 .../HoverCard/examples/HoverCard.Target.Example.tsx       | 4 ++--
 22 files changed, 9 insertions(+), 48 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/VisualTestRoot.tsx b/packages/office-ui-fabric-react/src/VisualTestRoot.tsx
index 03b129c7f57bb..b99afeb8f30f9 100644
--- a/packages/office-ui-fabric-react/src/VisualTestRoot.tsx
+++ b/packages/office-ui-fabric-react/src/VisualTestRoot.tsx
@@ -9,7 +9,6 @@ import { setBaseUrl } from './Utilities';
 setBaseUrl('./dist/');
 
 let rootElement: HTMLElement;
-let currentBreakpoint;
 let scrollDistance: number;
 let requireContext = require.context('./components', true, /Page.visualtest$/);
 
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
index d135265f2380a..6f4c31c32376b 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
@@ -30,7 +30,6 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
 
   public render() {
     let {
-      className,
       onRenderIcon = this._onRenderIcon,
       onRenderActivityDescription = this._onRenderActivityDescription,
       onRenderComments = this._onRenderComments,
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
index bfff3bb652a0c..760e17f23732c 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
@@ -9,8 +9,6 @@ import {
   autobind
 } from '../../../Utilities';
 
-import { Link } from 'office-ui-fabric-react/lib/Link';
-
 export class BreadcrumbBasicExample extends React.Component<any, any> {
   constructor() {
     super();
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx
index 81730a07d6b8a..dd90dc35fc37a 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx
@@ -9,8 +9,6 @@ import {
   autobind
 } from '../../../Utilities';
 
-import { Link } from 'office-ui-fabric-react/lib/Link';
-
 export class BreadcrumbStaticExample extends React.Component<any, any> {
   constructor() {
     super();
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
index fdd5c7de15d68..5ecaf7eb1820d 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
@@ -233,7 +233,6 @@ describe('DefaultButton', () => {
   });
 
   it('Tapping menu button of SplitButton expands menu', () => {
-    let didClick = false;
     const button = ReactTestUtils.renderIntoDocument<any>(
       <DefaultButton
         data-automation-id='test'
@@ -286,7 +285,6 @@ describe('DefaultButton', () => {
         } }
       />
     );
-    const splitButtonDOM = ReactDOM.findDOMNode(renderedDOM as React.ReactInstance);
     const menuButtonDOM: HTMLButtonElement = renderedDOM.getElementsByClassName('ms-Button--default')[0] as HTMLButtonElement;
     ReactTestUtils.Simulate.click(menuButtonDOM);
     expect(didClick).to.equal(true);
@@ -418,7 +416,6 @@ describe('DefaultButton', () => {
         } }
       />
     );
-    const splitButtonDOM = ReactDOM.findDOMNode(renderedDOM as React.ReactInstance);
     const menuButtonDOM: HTMLButtonElement = renderedDOM.getElementsByClassName('ms-Button--default')[0] as HTMLButtonElement;
     ReactTestUtils.Simulate.click(menuButtonDOM);
     expect(didClick).to.equal(false);
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
index b308c796ce180..baa1c6e4e2c1c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
@@ -31,7 +31,6 @@ const ButtonScreenReaderExampleCode = require('!raw-loader!office-ui-fabric-reac
 const ButtonContextualMenuExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.ContextualMenu.Example.tsx') as string;
 const ButtonSwapExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx') as string;
 const ButtonSplitExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx') as string;
-const ButtonSplitCustomExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx') as string;
 
 export interface IButtonDemoPageState {
   areButtonsDisabled?: boolean;
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx
index 1ed3f196bc95d..0a61b3fb88463 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx
@@ -3,9 +3,6 @@ import {
   ActionButton,
   IButtonProps
 } from 'office-ui-fabric-react/lib/Button';
-import {
-  Label
-} from 'office-ui-fabric-react/lib/Label';
 
 export class ButtonActionExample extends React.Component<IButtonProps, any> {
   public constructor() {
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx
index b240333f27b01..83e574862b0e3 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx
@@ -4,8 +4,6 @@ import { Callout } from 'office-ui-fabric-react/lib/Callout';
 import { CommandBar } from 'office-ui-fabric-react/lib/CommandBar';
 import './CalloutExample.scss';
 
-import { items } from '../../CommandBar/examples/data';
-
 export interface ICalloutBaiscExampleState {
   isCalloutVisible?: boolean;
 }
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Custom.Example.tsx
index 39025c701f4ef..8a73251c158c2 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Custom.Example.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { ChoiceGroup, IChoiceGroupOption } from 'office-ui-fabric-react/lib/ChoiceGroup';
+import { ChoiceGroup } from 'office-ui-fabric-react/lib/ChoiceGroup';
 import { autobind, css } from 'office-ui-fabric-react/lib/Utilities';
 import { Dropdown } from 'office-ui-fabric-react/lib/Dropdown';
 
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Icon.Example.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Icon.Example.tsx
index 8e3d338f9c5e9..cf5b0418f466b 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Icon.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Icon.Example.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
-import { ChoiceGroup, IChoiceGroupOption } from 'office-ui-fabric-react/lib/ChoiceGroup';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { ChoiceGroup } from 'office-ui-fabric-react/lib/ChoiceGroup';
 
 export class ChoiceGroupIconExample extends React.Component<any, any> {
   public render() {
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.CustomStyled.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.CustomStyled.Example.tsx
index 728414abe404b..72f8c9353b689 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.CustomStyled.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.CustomStyled.Example.tsx
@@ -1,14 +1,8 @@
 import * as React from 'react';
 import {
-  ComboBox,
-  IComboBoxOption
+  ComboBox
 } from 'office-ui-fabric-react/lib/ComboBox';
 import './ComboBox.Basic.Example.scss';
-import {
-  assign,
-  autobind
-} from 'office-ui-fabric-react/lib/Utilities';
-import { SelectableOptionMenuItemType } from 'office-ui-fabric-react/lib/utilities/selectableOption/SelectableOption.Props';
 
 export class ComboBoxCustomStyledExample extends React.Component<any, any> {
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
index 3bd3f1c7e2eb4..cc8c1d5f09d03 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
@@ -5,13 +5,9 @@ import { TextField } from 'office-ui-fabric-react/lib/TextField';
 import {
   DetailsList,
   DetailsListLayoutMode,
-  IDetailsHeaderProps,
   Selection,
   IColumn
 } from 'office-ui-fabric-react/lib/DetailsList';
-import {
-  IRenderFunction
-} from 'office-ui-fabric-react/lib/Utilities';
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
 
 let _items: any[] = [];
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
index 8a44b89ca6e81..b095c78f4a6f0 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
@@ -10,7 +10,6 @@ import {
   IColumn
 } from 'office-ui-fabric-react/lib/DetailsList';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
-import { Icon } from 'office-ui-fabric-react/lib/Icon';
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
 import { lorem } from '@uifabric/example-app-base';
 import './DetailsListExample.scss';
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx
index 314e52208a4d2..a86e2b6fa6caf 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx
@@ -2,14 +2,11 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import { Link } from 'office-ui-fabric-react/lib/Link';
-import { TextField } from 'office-ui-fabric-react/lib/TextField';
 import { DetailsList, Selection } from 'office-ui-fabric-react/lib/DetailsList';
-import { IDetailsRowProps, DetailsRow, IColumn } from 'office-ui-fabric-react/lib/DetailsList';
+import { IColumn } from 'office-ui-fabric-react/lib/DetailsList';
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
 import {
-  IDragDropHelper,
   IDragDropEvents,
-  IDragDropOptions,
   IDragDropContext
 } from 'office-ui-fabric-react/lib/utilities/dragdrop/interfaces';
 import { createListItems } from '@uifabric/example-app-base';
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
index d1e54c6f65040..e72ab083c564f 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
@@ -1,7 +1,6 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
-import * as ReactDOM from 'react-dom';
 
 let { expect } = chai;
 import { mount } from 'enzyme';
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
index ecf2a75b5a3d5..629e80b1e3ce6 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
@@ -13,8 +13,6 @@ export class DropdownCustomExample extends React.Component<any, any> {
   }
 
   public render() {
-    let { selectedItem } = this.state;
-
     return (
       <div className='dropdownExample'>
 
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
index 15ad645167567..c080b6bfaba4a 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
@@ -2,7 +2,6 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
-import * as ReactDOM from 'react-dom';
 import { autobind } from '../../../Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { FocusTrapZone } from 'office-ui-fabric-react/lib/FocusTrapZone';
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
index f951a91b8a47c..3f7d1296eccb3 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
@@ -2,7 +2,6 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
-import * as ReactDOM from 'react-dom';
 import { autobind } from '../../../Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { FocusTrapZone } from 'office-ui-fabric-react/lib/FocusTrapZone';
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
index a72b09788d7d1..55620ca519279 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
@@ -2,7 +2,6 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
-import * as ReactDOM from 'react-dom';
 import { autobind } from '../../../Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { FocusTrapZone } from 'office-ui-fabric-react/lib/FocusTrapZone';
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx
index 94fbc1a7e8e83..f776bc2c6931c 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx
@@ -4,12 +4,9 @@ import * as React from 'react';
 
 /* tslint:disable:no-string-literal */
 
-import * as ReactDOM from 'react-dom';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { FocusTrapZone } from 'office-ui-fabric-react/lib/FocusTrapZone';
-import { Link } from 'office-ui-fabric-react/lib/Link';
-import { TextField } from 'office-ui-fabric-react/lib/TextField';
-import { Toggle, IToggle } from 'office-ui-fabric-react/lib/Toggle';
+import { Toggle } from 'office-ui-fabric-react/lib/Toggle';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import './FocusTrapZone.Box.Example.scss';
 
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx
index a149884c89971..ea4df20c6d85d 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx
@@ -1,13 +1,13 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
-import { BaseComponent, IRenderFunction } from 'office-ui-fabric-react/lib/Utilities';
+import { BaseComponent } from 'office-ui-fabric-react/lib/Utilities';
 import {
   HoverCard,
   IExpandingCardProps
 } from 'office-ui-fabric-react/lib/HoverCard';
 import { DetailsList, buildColumns, IColumn } from 'office-ui-fabric-react/lib/DetailsList';
-import { autobind, css } from 'office-ui-fabric-react/lib/Utilities';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { createListItems } from '@uifabric/example-app-base';
 import './HoverCard.Example.scss';
 
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
index b4ed9a09f6ac3..b71be589ebf92 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
@@ -2,14 +2,14 @@
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
-import { BaseComponent, IRenderFunction } from 'office-ui-fabric-react/lib/Utilities';
+import { BaseComponent } from 'office-ui-fabric-react/lib/Utilities';
 import {
   HoverCard,
   IExpandingCardProps
 } from 'office-ui-fabric-react/lib/HoverCard';
 import { DetailsList, buildColumns, IColumn } from 'office-ui-fabric-react/lib/DetailsList';
 import { DirectionalHint } from 'office-ui-fabric-react/lib/common/DirectionalHint';
-import { autobind, css } from 'office-ui-fabric-react/lib/Utilities';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { createListItems } from '@uifabric/example-app-base';
 import './HoverCard.Example.scss';
 

From 246e162e1c5573cc597d33e6c1726dbc8c6e457c Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Tue, 5 Sep 2017 18:31:51 -0700
Subject: [PATCH 0577/1641] Second pass removing unused variables from Fabric
 pkg (#2736)

---
 .../src/components/DatePicker/DatePicker.tsx           |  2 +-
 .../src/components/DetailsList/DetailsHeader.tsx       |  3 +--
 .../src/components/DetailsList/DetailsList.tsx         |  2 +-
 .../src/components/Dialog/Dialog.tsx                   |  3 ---
 .../src/components/Dropdown/Dropdown.tsx               |  3 ++-
 .../src/components/Facepile/Facepile.tsx               |  1 -
 .../src/components/HoverCard/ExpandingCard.tsx         |  8 +++-----
 .../src/components/HoverCard/HoverCard.tsx             |  2 +-
 .../src/components/List/List.tsx                       | 10 ++++------
 .../src/components/Modal/Modal.tsx                     |  2 +-
 .../src/components/Panel/Panel.tsx                     |  6 +-----
 .../src/components/Persona/Persona.tsx                 |  3 ---
 .../src/components/SearchBox/SearchBox.Props.ts        |  1 -
 .../src/components/SpinButton/SpinButton.styles.ts     |  6 +++---
 .../src/components/SpinButton/SpinButton.tsx           |  1 -
 .../src/components/Spinner/Spinner.tsx                 |  2 +-
 .../src/components/Sticky/Sticky.tsx                   |  3 ---
 .../components/SwatchColorPicker/SwatchColorPicker.tsx |  7 ++-----
 .../src/components/Toggle/Toggle.classNames.ts         |  1 -
 .../src/components/Toggle/Toggle.tsx                   |  9 ++-------
 .../PeoplePickerItems/SuggestionItemDefault.tsx        |  2 --
 .../src/components/pickers/Suggestions/Suggestions.tsx |  8 +-------
 .../office-ui-fabric-react/src/utilities/grid/Grid.tsx |  6 +-----
 .../src/utilities/grid/GridCell.tsx                    |  9 +--------
 24 files changed, 26 insertions(+), 74 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index d0c98f442d5ec..84aad37f631e1 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -376,7 +376,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
 
   @autobind
   private _validateTextInput() {
-    let { isRequired, allowTextInput, strings, formatDate, parseDateFromString, onSelectDate } = this.props;
+    let { isRequired, allowTextInput, strings, parseDateFromString, onSelectDate } = this.props;
     const inputValue = this.state.formattedDate;
 
     // Do validation only if DatePicker's popup is dismissed
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index 63692000f612d..d51341e9479df 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -219,7 +219,6 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
         {
           columns.map((column: IColumn, columnIndex: number) => {
             const previousColumnIndex = columnIndex - 1;
-            const previousColumn = columns[previousColumnIndex];
 
             return (
               [
@@ -335,7 +334,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
   private _renderColumnSizer(columnIndex: number) {
     const { columns } = this.props;
     const column = this.props.columns[columnIndex];
-    const { isSizing, columnResizeDetails } = this.state;
+    const { columnResizeDetails } = this.state;
 
     return (
       <div
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 959f2a304d79a..b80311c4062f1 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -1,7 +1,6 @@
 
 import * as React from 'react';
 import * as stylesImport from './DetailsList.scss';
-import * as ReactDOM from 'react-dom';
 
 import {
   BaseComponent,
@@ -69,6 +68,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   };
 
   // References
+  // tslint:disable-next-line:no-unused-variable
   private _root: HTMLElement;
   private _header: IDetailsHeader;
   private _groupedList: GroupedList;
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
index c76205e095f82..648a346accd14 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
@@ -60,8 +60,6 @@ export class Dialog extends BaseComponent<IDialogProps, {}> {
 
   public render() {
     let {
-      ariaDescribedById,
-      ariaLabelledById,
       elementToFocusOnDismiss,
       firstFocusableSelector,
       forceFocusInsideTrap,
@@ -74,7 +72,6 @@ export class Dialog extends BaseComponent<IDialogProps, {}> {
       onDismiss,
       onDismissed,
       onLayerDidMount,
-      onLayerMounted,
       responsiveMode,
       subText,
       title,
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index c8dbaa91c5d9b..8f20f19b5201a 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -52,6 +52,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
 
   private _focusZone: FocusZone;
   private _dropDown: HTMLDivElement;
+  // tslint:disable-next-line:no-unused-variable
   private _dropdownLabel: HTMLElement;
   private _id: string;
 
@@ -218,7 +219,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   public setSelectedIndex(index: number) {
-    let { onChanged, options, selectedKey, selectedKeys, multiSelect } = this.props;
+    let { onChanged, options, selectedKey, multiSelect } = this.props;
     let { selectedIndex, selectedIndexes } = this.state;
     let checked: boolean = selectedIndexes ? selectedIndexes.indexOf(index) > -1 : false;
 
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
index 5a0e031fbcddf..dc41a2a447b21 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
@@ -50,7 +50,6 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
       maxDisplayablePersonas,
       overflowButtonProps,
       overflowButtonType,
-      ariaDescription,
       className,
       personas,
       showAddButton
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
index 42a5458254cf1..06c44827d193b 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
@@ -7,8 +7,7 @@ import {
   getNativeProps,
   divProperties,
   customizable,
-  autobind,
-  getRTL
+  autobind
 } from '../../Utilities';
 import { IExpandingCardProps, IExpandingCardStyles, ExpandingCardMode } from './ExpandingCard.Props';
 import { Callout, ICallout } from '../../Callout';
@@ -32,6 +31,7 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
   };
 
   private _styles: IExpandingCardStyles;
+  // tslint:disable-next-line:no-unused-variable
   private _callout: ICallout;
   private _expandedElem: HTMLDivElement;
 
@@ -59,11 +59,8 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
   public render() {
     const {
       targetElement,
-      id,
       theme,
       styles: customStyles,
-      onRenderCompactCard,
-      onRenderExpandedCard,
       compactCardHeight,
       expandedCardHeight
     } = this.props;
@@ -134,6 +131,7 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
   }
 
   @autobind
+  // tslint:disable-next-line:no-unused-variable
   private _checkNeedsScroll(): void {
     if (this._expandedElem) {
       this._async.requestAnimationFrame(() => {
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
index 9748bee57b00a..a3e9a95a8e552 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
@@ -31,6 +31,7 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
 
   // The wrapping div that gets the hover events
   private _hoverCard: HTMLElement;
+  // tslint:disable-next-line:no-unused-variable
   private _expandingCard: ExpandingCard;
   private _dismissTimerId: number;
   private _openTimerId: number;
@@ -87,7 +88,6 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
       expandingCardProps,
       children,
       id,
-      instantOpenOnClick,
       setAriaDescribedBy = true,
       styles: customStyles
     } = this.props;
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index 95d6ae68eace5..dd8542d3b12bc 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -11,7 +11,7 @@ import {
   IRenderFunction,
   autobind
 } from '../../Utilities';
-import { IList, IListProps, IPage, IPageProps, IPageSpecification } from './List.Props';
+import { IList, IListProps, IPage, IPageProps } from './List.Props';
 
 const RESIZE_DELAY = 16;
 const MIN_SCROLL_UPDATE_DELAY = 100;
@@ -278,9 +278,8 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   }
 
   public shouldComponentUpdate(newProps: IListProps, newState: IListState) {
-    let { renderedWindowsAhead, renderedWindowsBehind } = this.props;
     let { pages: oldPages } = this.state;
-    let { pages: newPages, measureVersion } = newState;
+    let { pages: newPages } = newState;
     let shouldComponentUpdate = false;
 
     if (newProps.items === this.props.items &&
@@ -315,8 +314,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   public render() {
     const {
       className,
-      role,
-      onRenderPage = this._onRenderPage
+      role
     } = this.props;
     const {
       pages = []
@@ -359,7 +357,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   }
 
   private _renderPage(page: IPage): JSX.Element {
-    let { onRenderCell, role, usePageCache } = this.props;
+    let { usePageCache } = this.props;
     let cachedPage;
     // if usePageCache is set and cached page element can be found, just return cached page
     if (usePageCache) {
diff --git a/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx b/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
index 848eb53c2a708..b6e35ef5f8be4 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
+++ b/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
@@ -94,7 +94,7 @@ export class Modal extends BaseComponent<IModalProps, IDialogState> {
       titleAriaId,
       subtitleAriaId,
     } = this.props;
-    let { id, isOpen, isVisible } = this.state;
+    let { isOpen, isVisible } = this.state;
 
     const modalClassName = css(
       'ms-Modal',
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
index 89d5e9da87488..55f5f125b6035 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
@@ -68,9 +68,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
 
   public render() {
     let {
-      children,
       className = '',
-      closeButtonAriaLabel,
       elementToFocusOnDismiss,
       firstFocusableSelector,
       forceFocusInsideTrap,
@@ -82,13 +80,12 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
       layerProps,
       type,
       customWidth,
-      headerClassName,
       onRenderNavigation = this._onRenderNavigation,
       onRenderHeader = this._onRenderHeader,
       onRenderBody = this._onRenderBody,
       onRenderFooter = this._onRenderFooter
     } = this.props;
-    let { isOpen, isAnimating, id, isFooterSticky } = this.state;
+    let { isOpen, isAnimating, id } = this.state;
     let isLeft = type === PanelType.smallFixedNear ? true : false;
     let isRTL = getRTL();
     let isOnRightSide = isRTL ? isLeft : !isLeft;
@@ -230,7 +227,6 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
       headerClassName = '',
     } = props;
 
-    const { id } = this.state;
     if (headerText) {
       return (
         <div className={ css('ms-Panel-header', styles.header) }>
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index 21ba20b389314..abe16df9beeca 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -85,9 +85,6 @@ export class Persona extends BaseComponent<IPersonaProps, IPersonaState> {
       initialsColor,
       presence,
       primaryText,
-      secondaryText,
-      tertiaryText,
-      optionalText,
       hidePersonaDetails,
       imageShouldFadeIn,
       onRenderInitials = this._onRenderInitials,
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts
index 56ea4d445b71c..23b13ab39c5d0 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { SearchBox } from './SearchBox';
 
 export interface ISearchBox {
   /**
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
index 5b629238fb20c..bfd9b762fa184 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
@@ -11,7 +11,7 @@ import {
 const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
 
 const _getDisabledStyles = memoizeFunction((theme: ITheme): IStyle => {
-  const { semanticColors, palette } = theme;
+  const { palette } = theme;
 
   const SpinButtonTextColorDisabled = palette.neutralTertiaryAlt;
   const SpinButtonBackgroundColorDisabled = palette.neutralLighter;
@@ -35,7 +35,7 @@ export const getArrowButtonStyles = memoizeFunction((
   customSpecificArrowStyles?: Partial<IButtonStyles>,
 ): IButtonStyles => {
 
-  const { semanticColors, fonts, palette } = theme;
+  const { palette } = theme;
 
   const ArrowButtonTextColor = palette.neutralPrimary;
   const ArrowButtonTextColorPressed = palette.white;
@@ -111,7 +111,7 @@ export const getStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: Partial<ISpinButtonStyles>
 ): ISpinButtonStyles => {
-  const { semanticColors, fonts, palette } = theme;
+  const { fonts, palette } = theme;
 
   const SpinButtonRootBorderColor = palette.neutralTertiaryAlt;
   const SpinButtonRootBorderColorHovered = palette.neutralSecondary;
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index 4cc482123238f..11ace977a02b8 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -70,7 +70,6 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
   private _currentStepFunctionHandle: number;
   private _initialStepDelay = 400;
   private _stepDelay = 75;
-  private _formattedValidUnitOptions: string[] = [];
 
   constructor(props: ISpinButtonProps) {
     super(props);
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx
index e46e78a70ff7a..55419bd0751cb 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx
+++ b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx
@@ -34,7 +34,7 @@ export class Spinner extends BaseComponent<ISpinnerProps, any> {
         }
         {
           statusMessage &&
-          <div role='status' aria-live={ this.props.ariaLive }>
+          <div role='status' aria-live={ ariaLive }>
             <DelayedRender>
               <div className={ styles.screenReaderOnly }>{ statusMessage }</div>
             </DelayedRender>
diff --git a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
index a441253d8dafc..fc1fe2a3de1ba 100644
--- a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
+++ b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
@@ -8,10 +8,8 @@ import {
   BaseComponent,
   autobind
 } from '../../Utilities';
-import { ScrollablePane } from '../../ScrollablePane';
 import { IStickyProps, StickyPositionType } from './Sticky.Props';
 import * as stylesImport from './Sticky.scss';
-const styles: any = stylesImport;
 
 export interface IStickyState {
   isStickyTop: boolean;
@@ -65,7 +63,6 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
       throw new TypeError('Expected Sticky to be mounted within ScrollablePane');
     }
     const { scrollablePane } = this.context;
-    const { stickyClassName } = this.props;
     scrollablePane.subscribe(this._onScrollEvent);
     this.content = document.createElement('div');
     this.content.style.background = this._getBackground();
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
index fc8995d22a0bd..bf4ebf038216b 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
@@ -15,7 +15,6 @@ import { getColorFromString } from '../../utilities/color/colors';
 import { Grid } from '../../utilities/grid/Grid';
 import { GridCell } from '../../utilities/grid/GridCell';
 import { IGridCellProps } from '../../utilities/grid/GridCell.Props';
-import { CommandButton } from '../../Button';
 import * as stylesImport from './SwatchColorPicker.scss';
 const styles: any = stylesImport;
 
@@ -67,14 +66,11 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
 
   public render() {
     let {
-      disabled,
       colorCells,
-      columnCount,
       positionInSet,
       setSize,
       shouldFocusCircularNavigate,
-      className,
-      onCellFocused
+      className
     } = this.props;
 
     return (
@@ -217,6 +213,7 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
    * Clear the colors by calling the given callbacks
    * @param callbacks - The callbacks to handle the clear operation
    */
+  // tsline:disable-next-line:no-unused-variable
   private _clearColors(callbacks: ((id?: string, color?: string) => void)[]) {
     callbacks.forEach((callback) => {
       if (callback) {
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
index cf4fb04a594d0..d98be41ff195d 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
@@ -34,7 +34,6 @@ export const getClassNames = memoizeFunction((
   const pillBorderColor = semanticColors.inputBorder;
   const pillBorderHoveredColor = semanticColors.inputBorderHovered;
   const pillBorderDisabledColor = semanticColors.disabledText;
-  const toggleFocusBorderColor = semanticColors.focusBorder;
   const textDisabledColor = semanticColors.disabledText;
 
   styles = styles || {};
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
index 0304b5e1f9de5..9c62fb0aa788f 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
@@ -4,21 +4,16 @@ import {
   autobind,
   getId,
   inputProperties,
-  getNativeProps,
-  memoize
+  getNativeProps
 } from '../../Utilities';
 import {
   IToggleProps,
-  IToggle,
-  IToggleStyles
+  IToggle
 } from './Toggle.Props';
 import { Label } from '../../Label';
 import {
   customizable
 } from '../../Utilities';
-import {
-  mergeStyles
-} from '../../Styling';
 import { getClassNames } from './Toggle.classNames';
 
 export interface IToggleState {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
index c0843534f3be5..d6f1bfc965f33 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
@@ -8,7 +8,6 @@ import * as stylesImport from '../PeoplePicker.scss';
 const styles: any = stylesImport;
 
 export const SuggestionItemNormal: (persona: IPersonaProps, suggestionProps?: IBasePickerSuggestionsProps) => JSX.Element = (personaProps: IPersonaProps, suggestionItemProps?: ISuggestionItemProps<any>) => {
-  let { onRemoveItem, onClick, showRemoveButton } = suggestionItemProps!;
   return (
     <div className={ css('ms-PeoplePicker-personaContent', styles.peoplePickerPersonaContent) }>
       <Persona
@@ -23,7 +22,6 @@ export const SuggestionItemNormal: (persona: IPersonaProps, suggestionProps?: IB
 };
 
 export const SuggestionItemSmall: (persona: IPersonaProps, suggestionProps?: IBasePickerSuggestionsProps) => JSX.Element = (personaProps: IPersonaProps, suggestionItemProps?: ISuggestionItemProps<any>) => {
-  let { onRemoveItem, onClick } = suggestionItemProps!;
   return (
     <div className={ css('ms-PeoplePicker-personaContent', styles.peoplePickerPersonaContent) }>
       <Persona
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index f1c784bfa0f6b..dd8fe1e141f8a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -19,11 +19,8 @@ export class SuggestionsItem<T> extends BaseComponent<ISuggestionItemProps<T>, {
       RenderSuggestion,
       onClick,
       className,
-      onRemoveItem,
-      showRemoveButton,
-      id
+      onRemoveItem
     } = this.props;
-    let itemProps = assign({}, suggestionModel.item, { onRemoveItem });
     return (
       <div
         className={ css(
@@ -71,7 +68,6 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
 
   public render() {
     let {
-      suggestionsHeaderText,
       mostRecentlyUsedHeaderText,
       searchForMoreText,
       className,
@@ -87,8 +83,6 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
       resultsMaximumNumber,
       resultsFooterFull,
       resultsFooter,
-      isResultsFooterVisible,
-      showRemoveButtons,
       suggestionsAvailableAlertText
     } = this.props;
 
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx b/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
index 831760b86fa37..b099f3ea358ea 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
@@ -6,7 +6,6 @@ import {
 } from '../../Utilities';
 import { FocusZone } from '../../FocusZone';
 import { IGridProps } from './Grid.Props';
-import { GridCell } from './GridCell';
 
 export class Grid extends BaseComponent<IGridProps, {}> {
 
@@ -23,10 +22,7 @@ export class Grid extends BaseComponent<IGridProps, {}> {
       columnCount,
       onRenderItem,
       positionInSet,
-      setSize,
-      shouldFocusCircularNavigate,
-      containerClassName,
-      onBlur
+      setSize
     } = this.props;
 
     // Array to store the cells in the correct row index
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx b/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx
index 0d551eed3258f..e48173e15da34 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import {
   autobind,
-  BaseComponent,
   css,
   getId,
 } from '../../Utilities';
@@ -16,8 +15,6 @@ export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P,
     id: getId('gridCell')
   };
 
-  private _id: string;
-
   public render() {
     let {
       item,
@@ -26,9 +23,6 @@ export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P,
       role,
       selected,
       disabled,
-      onClick,
-      onHover,
-      onFocus,
       onRenderItem,
       cellDisabledStyle,
       cellIsSelectedStyle,
@@ -91,8 +85,7 @@ export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P,
   private _onMouseLeave() {
     let {
       onHover,
-      disabled,
-      item
+      disabled
       } = this.props as P;
 
     if (onHover && !disabled) {

From fc36154613e5f0e415169911bcc04117869c1cf8 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Tue, 5 Sep 2017 18:42:31 -0700
Subject: [PATCH 0578/1641] Fourth pass fixing 'jsx-alignment' for tslint in
 Fabric pkg (#2744)

---
 .../src/components/DatePicker/DatePickerPage.tsx     |  3 ++-
 .../src/components/DetailsList/DetailsListPage.tsx   |  3 ++-
 .../examples/DetailsList.CustomColumns.Example.tsx   |  3 ++-
 .../DetailsList.CustomGroupHeaders.Example.tsx       |  6 ++++--
 .../examples/DetailsList.Documents.Example.tsx       | 12 ++++++++----
 .../examples/DetailsList.NavigatingFocus.Example.tsx |  3 ++-
 .../src/components/Dialog/Dialog.test.tsx            | 12 ++++++++----
 .../src/components/Dialog/DialogPage.tsx             |  3 ++-
 .../src/components/Dialog/DialogPage.visualtest.tsx  |  3 ++-
 .../src/components/DocumentCard/DocumentCardPage.tsx |  3 ++-
 .../DocumentCard/DocumentCardPage.visualtest.tsx     |  3 ++-
 .../examples/DocumentCard.Basic.Example.tsx          |  3 ++-
 .../examples/DocumentCard.Compact.Example.tsx        |  9 ++++++---
 .../examples/DocumentCard.Complete.Example.tsx       |  3 ++-
 .../src/components/Dropdown/DropdownPage.tsx         |  3 ++-
 .../src/components/Facepile/Facepile.test.tsx        |  3 ++-
 .../src/components/Facepile/FacepilePage.tsx         |  3 ++-
 .../components/Facepile/FacepilePage.visualtest.tsx  |  6 ++++--
 .../components/FocusTrapZone/FocusTrapZonePage.tsx   |  3 ++-
 .../examples/FocusTrapZone.Box.Click.Example.tsx     |  3 ++-
 .../examples/FocusTrapZone.Box.Example.tsx           |  3 ++-
 ...ocusTrapZone.Box.FocusOnCustomElement.Example.tsx |  3 ++-
 .../examples/FocusTrapZone.Nested.Example.tsx        |  3 ++-
 .../src/components/FocusZone/FocusZone.test.tsx      | 12 ++++++++----
 .../src/components/FocusZone/FocusZonePage.tsx       |  3 ++-
 .../FocusZone/examples/FocusZone.List.Example.tsx    |  6 ++++--
 .../FocusZone/examples/FocusZone.Photos.Example.tsx  |  6 ++++--
 27 files changed, 84 insertions(+), 42 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
index e06c53fd06620..32b828a3c0a3b 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
@@ -73,7 +73,8 @@ export class DatePickerPage extends React.Component<IComponentDemoPageProps, {}>
         related={
           <a href='https://dev.office.com/fabric-js/Components/DatePicker/DatePicker.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
index c2b44a6d14846..be631a7a21b78 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
@@ -118,7 +118,8 @@ export class DetailsListPage extends React.Component<IComponentDemoPageProps, {}
             </ul>
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
index b27af71837e20..1fafb4bf1fb25 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
@@ -42,7 +42,8 @@ export class DetailsListCustomColumnsExample extends React.Component<{}, IDetail
         onRenderItemColumn={ _renderItemColumn }
         onColumnHeaderClick={ this._onColumnClick }
         onItemInvoked={ (item, index) => alert(`Item ${item.name} at index ${index} has been invoked.`) }
-        onColumnHeaderContextMenu={ (column, ev) => console.log(`column ${column!.key} contextmenu opened.`) } />
+        onColumnHeaderContextMenu={ (column, ev) => console.log(`column ${column!.key} contextmenu opened.`) }
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomGroupHeaders.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomGroupHeaders.Example.tsx
index d60077bdfdd1f..b85af609917ea 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomGroupHeaders.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomGroupHeaders.Example.tsx
@@ -33,12 +33,14 @@ export class DetailsListCustomGroupHeadersExample extends React.Component<any, a
                 <div className='DetailsListExample-customHeaderLinkSet'>
                   <Link
                     className='DetailsListExample-customHeaderLink'
-                    onClick={ () => props!.onToggleSelectGroup!(props!.group!) }>
+                    onClick={ () => props!.onToggleSelectGroup!(props!.group!) }
+                  >
                     { props!.isSelected ? 'Remove selection' : 'Select group' }
                   </Link>
                   <Link
                     className='DetailsListExample-customHeaderLink'
-                    onClick={ () => props!.onToggleCollapse!(props!.group!) }>
+                    onClick={ () => props!.onToggleCollapse!(props!.group!) }
+                  >
                     { props!.group!.isCollapsed ? 'Expand group' : 'Collapse group' }
                   </Link>
                 </div>
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
index b095c78f4a6f0..7bd412efb52ac 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
@@ -107,7 +107,8 @@ export class DetailsListDocumentsExample extends React.Component<any, IDetailsLi
           return (
             <img
               src={ item.iconName }
-              className={ 'DetailsListExample-documentIconImage' } />
+              className={ 'DetailsListExample-documentIconImage' }
+            />
           );
         }
       },
@@ -137,7 +138,8 @@ export class DetailsListDocumentsExample extends React.Component<any, IDetailsLi
         onRender: (item: IDocument) => {
           return (
             <span
-              data-is-focusable={ true }>
+              data-is-focusable={ true }
+            >
               { item.dateModified }
             </span>
           );
@@ -156,7 +158,8 @@ export class DetailsListDocumentsExample extends React.Component<any, IDetailsLi
         onRender: (item: IDocument) => {
           return (
             <span
-              data-is-focusable={ true }>
+              data-is-focusable={ true }
+            >
               { item.modifiedBy }
             </span>
           );
@@ -175,7 +178,8 @@ export class DetailsListDocumentsExample extends React.Component<any, IDetailsLi
         onRender: (item: IDocument) => {
           return (
             <span
-              data-is-focusable={ true }>
+              data-is-focusable={ true }
+            >
               { item.fileSize }
             </span>
           );
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
index 79491a6cf0f6a..458465451886d 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
@@ -20,7 +20,8 @@ export class DetailsListNavigatingFocusExample extends React.Component<{}, IDeta
       onRender: item =>
         <Link
           key={ item }
-          onClick={ () => this._navigate(item) }>
+          onClick={ () => this._navigate(item) }
+        >
           { item }
         </Link>,
     } as IColumn,
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
index e72ab083c564f..1015b771abb82 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
@@ -21,7 +21,8 @@ describe('Dialog', () => {
     const wrapper = mount(
       <Dialog
         hidden={ false }
-        modalProps={ { onDismissed: handleDismissed } } />
+        modalProps={ { onDismissed: handleDismissed } }
+      />
     );
 
     expect(document.querySelector('[role="dialog"]')).to.not.be.null;
@@ -50,7 +51,8 @@ describe('Dialog', () => {
           type: DialogType.normal,
           title: 'sample title',
           subText: 'Sample subtext'
-        } } />
+        } }
+      />
     );
 
     const dialogHTML = document.querySelector('[role="dialog"]');
@@ -73,7 +75,8 @@ describe('Dialog', () => {
           type: DialogType.normal,
           title: 'sample title',
           subText: 'Sample subtext'
-        } } />
+        } }
+      />
     );
 
     const dialogHTML = document.querySelector('[role="dialog"]');
@@ -96,7 +99,8 @@ describe('Dialog', () => {
           type: DialogType.normal,
           title: 'sample title',
           subText: 'Sample subtext'
-        } } />
+        } }
+      />
     );
 
     const dialogHTML = document.querySelector('[role="dialog"]');
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx
index 0c0c7b7538d57..a4dd435f9c67f 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx
@@ -82,7 +82,8 @@ export class DialogPage extends React.Component<IComponentDemoPageProps, {}> {
         related={
           <a href='https://dev.office.com/fabric-js/Components/Dialog/Dialog.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.visualtest.tsx
index 25b30cdc5c4d1..2472afcdca145 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.visualtest.tsx
@@ -11,7 +11,8 @@ export default class DialogVPage extends React.Component<any, any> {
         className='Dialog'
         title='All emails together'
         subText='Your Inbox has changed.'
-        isBlocking={ false }>
+        isBlocking={ false }
+      >
         <DialogFooter>
           <Button >Save</Button>
           <Button >Cancel</Button>
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx
index b62f0208e7904..ad21632f15b4e 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx
@@ -75,7 +75,8 @@ export class DocumentCardPage extends React.Component<IComponentDemoPageProps, {
             </ul>
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.visualtest.tsx
index 3f13332956c58..8f049f089664f 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.visualtest.tsx
@@ -20,7 +20,8 @@ export default class DocumentCardVPage extends React.Component<any, any> {
         <DocumentCardPreview { ...previewProps } />
         <DocumentCardTitle
           title='Document Card'
-          shouldTruncate={ true } />
+          shouldTruncate={ true }
+        />
         <DocumentCardActivity
           activity='Created a few minutes ago'
           people={
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Basic.Example.tsx
index 13343f6453888..d22f0d18d04c6 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Basic.Example.tsx
@@ -31,7 +31,8 @@ export class DocumentCardBasicExample extends React.Component<any, any> {
         <DocumentCardPreview { ...previewProps } />
         <DocumentCardTitle
           title='Large_file_name_with_underscores_used_to_separate_all_of_the_words_and_there_are_so_many_words_it_needs_truncating.pptx'
-          shouldTruncate={ true } />
+          shouldTruncate={ true }
+        />
         <DocumentCardActivity
           activity='Created a few minutes ago'
           people={
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Compact.Example.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Compact.Example.tsx
index 7810259cce4e9..63669e4b000ac 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Compact.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Compact.Example.tsx
@@ -61,7 +61,8 @@ export class DocumentCardCompactExample extends React.Component<any, any> {
           <div className='ms-DocumentCard-details'>
             <DocumentCardTitle
               title='4 files were uploaded'
-              shouldTruncate={ true } />
+              shouldTruncate={ true }
+            />
             <DocumentCardActivity
               activity='Created a few minutes ago'
               people={
@@ -78,7 +79,8 @@ export class DocumentCardCompactExample extends React.Component<any, any> {
           <div className='ms-DocumentCard-details'>
             <DocumentCardTitle
               title='Revenue stream proposal fiscal year 2016 version02.pptx'
-              shouldTruncate={ true } />
+              shouldTruncate={ true }
+            />
             <DocumentCardActivity
               activity='Created a few minutes ago'
               people={
@@ -95,7 +97,8 @@ export class DocumentCardCompactExample extends React.Component<any, any> {
           <div className='ms-DocumentCard-details'>
             <DocumentCardTitle
               title='View and share files'
-              shouldTruncate={ true } />
+              shouldTruncate={ true }
+            />
             <DocumentCardActivity
               activity='Created a few minutes ago'
               people={
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx
index 48bb4c5fb7ba5..d68afb2d60515 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx
@@ -143,7 +143,8 @@ export class DocumentCardCompleteExample extends React.Component<any, any> {
           <div className='ms-DocumentCard-details'>
             <DocumentCardTitle
               title='View and share files'
-              shouldTruncate={ true } />
+              shouldTruncate={ true }
+            />
             <DocumentCardActivity
               activity='Created a few minutes ago'
               people={
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
index d43f945a4212b..991e22b0b399d 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
@@ -62,7 +62,8 @@ export class DropdownPage extends React.Component<IComponentDemoPageProps, {}> {
         related={
           <a href='https://dev.office.com/fabric-js/Components/Dropdown/Dropdown.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
index 85e97e519a075..0400979d41d60 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
@@ -82,7 +82,8 @@ describe('Facepile', () => {
 
     it('renders without descriptive overflow button if overflowButtonProps are not null and maximum personas are not exceeded', () => {
       const wrapper = ReactTestUtils.renderIntoDocument(
-        <Facepile personas={ [] }
+        <Facepile
+          personas={ [] }
           overflowButtonProps={ {} }
           overflowButtonType={ OverflowButtonType.descriptive }
         />);
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx b/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx
index 960e6239b1415..b6231f52b017e 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx
@@ -99,7 +99,8 @@ export class FacepilePage extends React.Component<IComponentDemoPageProps, {}> {
         related={
           <a href='https://dev.office.com/fabric-js/Components/FacePile/FacePile.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.visualtest.tsx
index bfa29d80e2d31..21f7e869eef6b 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.visualtest.tsx
@@ -6,7 +6,8 @@ export default class FacepileVPage extends React.Component<any, any> {
   public render() {
     return <div>
       <label>Basic Facepile:</label>
-      <Facepile className='Facepile'
+      <Facepile
+        className='Facepile'
         personas={ [{
           imageUrl: './images/persona-female.png',
           personaName: 'Annie Lindqvist',
@@ -18,7 +19,8 @@ export default class FacepileVPage extends React.Component<any, any> {
           personaName: 'Aaron Reid',
           imageInitials: 'AR',
           data: '$1,000'
-        }] } />
+        }] }
+      />
     </div>;
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZonePage.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZonePage.tsx
index b1dd12fca4918..43f2d7fb10416 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZonePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZonePage.tsx
@@ -55,7 +55,8 @@ export class FocusTrapZonePage extends React.Component<IComponentDemoPageProps,
             <span> is used to trap the focus in any html element. Pressing tab will circle focus within the inner focusable elements of the FocusTrapZone.</span>
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
index c080b6bfaba4a..e173325130ba3 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
@@ -68,7 +68,8 @@ export default class BoxNoClickExample extends React.Component<React.HTMLAttribu
           onChanged={ this._onFocusTrapZoneToggleChanged }
           label='Focus Trap Zone'
           onText='On'
-          offText='Off' />
+          offText='Off'
+        />
         { (() => {
           if (isToggled) {
             return (
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
index 3f7d1296eccb3..766627e07a449 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
@@ -68,7 +68,8 @@ export default class BoxExample extends React.Component<React.HTMLAttributes<HTM
           onChanged={ this._onFocusTrapZoneToggleChanged }
           label='Focus Trap Zone'
           onText='On'
-          offText='Off' />
+          offText='Off'
+        />
         { (() => {
           if (isChecked) {
             return (
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
index 55620ca519279..f8d18a8b72148 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
@@ -67,7 +67,8 @@ export default class BoxExample extends React.Component<React.HTMLAttributes<HTM
             onChanged={ this._onFocusTrapZoneToggleChanged }
             label='Focus Trap Zone'
             onText='On'
-            offText='Off' />
+            offText='Off'
+          />
         </div>
         { (() => {
           if (isChecked) {
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx
index f776bc2c6931c..08150bee5ab2d 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx
@@ -33,7 +33,8 @@ class FocusTrapComponent extends React.Component<IFocusTrapComponentProps, IFocu
           onChanged={ this._onFocusTrapZoneToggleChanged }
           label='Focus Trap Zone'
           onText='On'
-          offText='Off' />
+          offText='Off'
+        />
         {
           this.props.children
         }
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
index 4567873af1d46..881de42d6316c 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
@@ -425,12 +425,14 @@ describe('FocusZone', () => {
       <div { ...{ onFocusCapture: _onFocus } }>
         <FocusZone
           direction={ FocusZoneDirection.horizontal }
-          isInnerZoneKeystroke={ (e: React.KeyboardEvent<HTMLElement>) => e.which === KeyCodes.enter }>
+          isInnerZoneKeystroke={ (e: React.KeyboardEvent<HTMLElement>) => e.which === KeyCodes.enter }
+        >
           <button className='a'>a</button>
           <div
             className='b'
             data-is-focusable={ true }
-            data-is-sub-focuszone={ true }>
+            data-is-sub-focuszone={ true }
+          >
             <button className='bsub'>bsub</button>
           </div>
           <button className='c'>c</button>
@@ -510,12 +512,14 @@ describe('FocusZone', () => {
       <div { ...{ onFocusCapture: _onFocus } }>
         <FocusZone
           direction={ FocusZoneDirection.horizontal }
-          isInnerZoneKeystroke={ (e: React.KeyboardEvent<HTMLElement>) => e.which === KeyCodes.enter }>
+          isInnerZoneKeystroke={ (e: React.KeyboardEvent<HTMLElement>) => e.which === KeyCodes.enter }
+        >
           <button className='a'>a</button>
           <FocusZone
             direction={ FocusZoneDirection.horizontal }
             className='b'
-            data-is-focusable={ true }>
+            data-is-focusable={ true }
+          >
             <button className='bsub'>bsub</button>
           </FocusZone>
           <button className='c'>c</button>
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZonePage.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZonePage.tsx
index cf9dac7660436..6a1b8b118e5b7 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZonePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZonePage.tsx
@@ -46,7 +46,8 @@ export class FocusZonePage extends React.Component<IComponentDemoPageProps, {}>
             <p>Using a FocusZone is simple. Just wrap a bunch of content inside of a FocusZone, and arrows and tabbling will be handled for you! See examples below.</p>
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.List.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.List.Example.tsx
index c274a7ed4ff48..405f2bff5d08e 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.List.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.List.Example.tsx
@@ -55,7 +55,8 @@ export class FocusZoneListExample extends React.Component<any, any> {
         className='ms-FocusZoneListExample'
         direction={ FocusZoneDirection.vertical }
         isCircularNavigation={ true }
-        isInnerZoneKeystroke={ (ev) => (ev.which === getRTLSafeKeyCode(KeyCodes.right)) }>
+        isInnerZoneKeystroke={ (ev) => (ev.which === getRTLSafeKeyCode(KeyCodes.right)) }
+      >
         { ITEMS.map((item, index) => (
           <DetailsRow
             key={ index }
@@ -63,7 +64,8 @@ export class FocusZoneListExample extends React.Component<any, any> {
             itemIndex={ index }
             columns={ COLUMNS }
             selectionMode={ SelectionMode.single }
-            selection={ this._selection } />
+            selection={ this._selection }
+          />
         )) }
       </FocusZone>
     );
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Photos.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Photos.Example.tsx
index c875658e13d03..a4c2015e1f284 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Photos.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Photos.Example.tsx
@@ -20,7 +20,8 @@ const PHOTOS = createArray(25, () => {
 export const FocusZonePhotosExample = () => (
   <FocusZone
     elementType='ul'
-    className='ms-FocusZoneExamples-photoList'>
+    className='ms-FocusZoneExamples-photoList'
+  >
     { PHOTOS.map((photo, index) => (
       <li
         key={ index }
@@ -29,7 +30,8 @@ export const FocusZonePhotosExample = () => (
         aria-setsize={ PHOTOS.length }
         aria-label='Photo'
         data-is-focusable={ true }
-        onClick={ () => console.log('clicked') }>
+        onClick={ () => console.log('clicked') }
+      >
         <Image src={ photo.url } width={ photo.width } height={ photo.height } />
       </li>
     )) }

From 6729f822e201a9ddce2f180d306ada8a73404fe7 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Tue, 5 Sep 2017 18:43:13 -0700
Subject: [PATCH 0579/1641] Fifth pass fixing 'jsx-alignment' for tslint in
 Fabric pkg (#2745)

---
 .../GroupedList/GroupedListPage.tsx           |  3 ++-
 .../src/components/Icon/IconPage.tsx          |  3 ++-
 .../src/components/Image/ImagePage.tsx        |  3 ++-
 .../src/components/Label/LabelPage.tsx        |  3 ++-
 .../src/components/Layer/LayerPage.tsx        |  3 ++-
 .../Layer/examples/Layer.Basic.Example.tsx    |  3 ++-
 .../Layer/examples/Layer.Hosted.Example.tsx   |  6 +++--
 .../src/components/Link/LinkPage.tsx          |  3 ++-
 .../src/components/List/ListPage.tsx          |  3 ++-
 .../List/examples/List.Grid.Example.tsx       |  3 ++-
 .../List/examples/List.Scrolling.Example.tsx  | 21 +++++++++-------
 .../MarqueeSelection.Basic.Example.tsx        |  6 +++--
 .../components/MessageBar/MessageBarPage.tsx  |  6 +++--
 .../examples/MessageBar.Basic.Example.tsx     | 24 ++++++++++++-------
 .../src/components/Modal/ModalPage.tsx        |  3 ++-
 .../src/components/Nav/NavPage.tsx            |  3 ++-
 .../examples/Nav.FabricDemoApp.Example.tsx    | 14 ++++++-----
 .../examples/OverflowSet.Basic.Example.tsx    |  3 ++-
 .../examples/OverflowSet.Custom.Example.tsx   |  2 +-
 .../src/components/Overlay/OverlayPage.tsx    |  3 ++-
 .../Overlay/examples/Overlay.Dark.Example.tsx |  3 ++-
 .../src/components/Panel/Panel.test.tsx       |  3 ++-
 .../src/components/Panel/PanelPage.tsx        |  3 ++-
 .../Panel/examples/Panel.Footer.Example.tsx   |  3 ++-
 .../examples/Panel.SmallRight.Example.tsx     |  3 ++-
 .../src/components/Persona/PersonaPage.tsx    |  3 ++-
 .../examples/Persona.Basic.Example.tsx        |  3 ++-
 .../src/components/pickers/PickersPage.tsx    |  3 ++-
 .../examples/Picker.CustomResult.Example.tsx  |  3 ++-
 .../examples/TagPicker.Basic.Example.tsx      |  3 ++-
 30 files changed, 96 insertions(+), 52 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListPage.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListPage.tsx
index a884f202228db..135812e02c6fb 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListPage.tsx
@@ -37,7 +37,8 @@ export class GroupedListPage extends React.Component<IComponentDemoPageProps, {}
         overview={
           <p>Allows you to render a set of items as multiple lists with various grouping properties.</p>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx b/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx
index 1e35605de0d17..271404f12f306 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx
@@ -65,7 +65,8 @@ export class IconPage extends React.Component<IComponentDemoPageProps, {}> {
             </ul>
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx b/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx
index 0967da5ea7545..ed458286539b7 100644
--- a/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx
@@ -60,7 +60,8 @@ export class ImagePage extends React.Component<IComponentDemoPageProps, {}> {
             Images render an image. The borders have been added to these examples in order to help visualize empty space in the image frame.
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx b/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx
index a9ad1137e0cfd..c0191fbe2ea77 100644
--- a/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx
@@ -57,7 +57,8 @@ export class LabelPage extends React.Component<IComponentDemoPageProps, any> {
         related={
           <a href='https://dev.office.com/fabric-js/Components/Label/Label.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Layer/LayerPage.tsx b/packages/office-ui-fabric-react/src/components/Layer/LayerPage.tsx
index 52800b489fc6c..d8dbc15086b42 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/LayerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/LayerPage.tsx
@@ -68,7 +68,8 @@ export class LayerPage extends React.Component<IComponentDemoPageProps, {}> {
             </ul>
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
index b92da5b4a5840..94f85a664c17e 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
@@ -64,7 +64,8 @@ export class LayerBasicExample extends BaseComponent<any, any> {
         <Checkbox
           label='Wrap the content box belowed in a Layer'
           checked={ showLayer }
-          onChange={ (ev, checked) => this.setState({ showLayer: checked }) } />
+          onChange={ (ev, checked) => this.setState({ showLayer: checked }) }
+        />
 
         { showLayer ? (
           <Layer>
diff --git a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
index 836fb4de2bc1a..fe2e37634e58f 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
@@ -27,7 +27,8 @@ export class LayerHostedExample extends React.Component<any, any> {
         <Toggle
           label='Show host'
           checked={ showHost }
-          onChanged={ checked => this.setState({ showHost: checked }) } />
+          onChanged={ checked => this.setState({ showHost: checked }) }
+        />
 
         { showHost && (
           <LayerHost id='layerhost1' className='LayerExample-customHost' />
@@ -40,7 +41,8 @@ export class LayerHostedExample extends React.Component<any, any> {
         <Checkbox
           label='Render the box below in a Layer and target it at hostId=layerhost1'
           checked={ showLayer }
-          onChange={ (ev, checked) => this.setState({ showLayer: checked }) } />
+          onChange={ (ev, checked) => this.setState({ showLayer: checked }) }
+        />
 
         { showLayer ? (
           <Layer
diff --git a/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx b/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx
index 4a769739d967c..0429ecc611777 100644
--- a/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx
@@ -63,7 +63,8 @@ export class LinkPage extends React.Component<IComponentDemoPageProps, {}> {
         related={
           <a href='https://dev.office.com/fabric-js/Components/Link/Link.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/List/ListPage.tsx b/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
index d22c223ddcd2d..ca9e6de7103fb 100644
--- a/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
@@ -64,7 +64,8 @@ export class ListPage extends React.Component<IComponentDemoPageProps, {}> {
         related={
           <a href='https://dev.office.com/fabric-js/Components/List/List.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx b/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx
index 871d6e0ffa571..b983ae5930e22 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx
@@ -40,7 +40,8 @@ export class ListGridExample extends React.Component<IListGridExampleProps, any>
               data-is-focusable={ true }
               style={ {
                 width: (100 / this._columnCount) + '%'
-              } }>
+              } }
+            >
               <div className='ms-ListGridExample-sizer'>
                 <div className='msListGridExample-padder'>
                   <img src={ item.thumbnail } className='ms-ListGridExample-image' />
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx b/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx
index 2891a84f99277..61a0aa6c1a8c0 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx
@@ -49,9 +49,12 @@ export class ListScrollingExample extends React.Component<IListScrollingExampleP
 
         <div>
           Scroll item index:
-          <TextField value={ this.state.selectedIndex.toString(10) } onChanged={ (value) => {
-            this._scroll(parseInt(value, 10) || 0);
-          } } />
+          <TextField
+            value={ this.state.selectedIndex.toString(10) }
+            onChanged={ (value) => {
+              this._scroll(parseInt(value, 10) || 0);
+            } }
+          />
         </div>
 
         <div className='ms-ListScrollingExample-container' data-is-scrollable={ true }>
@@ -69,11 +72,13 @@ export class ListScrollingExample extends React.Component<IListScrollingExampleP
             } }
             onRenderCell={ (item, index: number) => (
               <div className='ms-ListScrollingExample-itemCell' data-is-focusable={ true }>
-                <div className={ css(
-                  'ms-ListScrollingExample-itemContent',
-                  (index % 2 === 0) && 'ms-ListScrollingExample-itemContent-even',
-                  (index % 2 === 1) && 'ms-ListScrollingExample-itemContent-odd'
-                ) }>
+                <div
+                  className={ css(
+                    'ms-ListScrollingExample-itemContent',
+                    (index % 2 === 0) && 'ms-ListScrollingExample-itemContent-even',
+                    (index % 2 === 1) && 'ms-ListScrollingExample-itemContent-odd'
+                  ) }
+                >
                   { index } &nbsp; { item.name }
                 </div>
               </div>
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
index 48d873c851525..ae60abdc8be05 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
@@ -63,7 +63,8 @@ export class MarqueeSelectionBasicExample extends React.Component<{}, IMarqueeSe
         <Checkbox
           label='Is marquee enabled'
           defaultChecked={ true }
-          onChange={ (ev, isMarqueeEnabled) => this.setState({ isMarqueeEnabled: isMarqueeEnabled! }) } />
+          onChange={ (ev, isMarqueeEnabled) => this.setState({ isMarqueeEnabled: isMarqueeEnabled! }) }
+        />
         <p>Drag a rectangle around the items below to select them:</p>
         <ul className='ms-MarqueeSelectionBasicExample-photoList'>
           { PHOTOS.map((photo, index) => (
@@ -76,7 +77,8 @@ export class MarqueeSelectionBasicExample extends React.Component<{}, IMarqueeSe
               data-is-focusable={ true }
               data-selection-index={ index }
               onClick={ () => console.log('clicked') }
-              style={ { width: photo.width, height: photo.height } }>
+              style={ { width: photo.width, height: photo.height } }
+            >
               { index }
             </div>
           )) }
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBarPage.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBarPage.tsx
index e775731b9d81d..28259d724db67 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBarPage.tsx
@@ -18,7 +18,8 @@ export class MessageBarPage extends React.Component<IComponentDemoPageProps, {}>
         exampleCards={
           <ExampleCard
             title='Various MessageBar types'
-            code={ MessageBarBasicExampleCode }>
+            code={ MessageBarBasicExampleCode }
+          >
             <MessageBarBasicExample />
           </ExampleCard>
         }
@@ -61,7 +62,8 @@ export class MessageBarPage extends React.Component<IComponentDemoPageProps, {}>
         related={
           <a href='https://dev.office.com/fabric-js/Components/MessageBar/MessageBar.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx
index c04737a043651..324ccbe124d2e 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx
@@ -16,14 +16,19 @@ export const MessageBarBasicExample = () => (
     <MessageBar
       messageBarType={ MessageBarType.error }
       isMultiline={ false }
-      onDismiss={ () => { console.log('test'); } }>
-      Error - lorem ipsum dolor sit amet, a elit sem interdum consectetur adipiscing elit. <Link href='www.bing.com'>Visit our website</Link></MessageBar>
+      onDismiss={ () => { console.log('test'); } }
+    >
+      Error - lorem ipsum dolor sit amet, a elit sem interdum consectetur adipiscing elit. <Link href='www.bing.com'>Visit our website</Link>
+    </MessageBar>
 
     <Label>Blocked MessageBar - single line no buttons</Label>
-    <MessageBar messageBarType={ MessageBarType.blocked }
+    <MessageBar
+      messageBarType={ MessageBarType.blocked }
       isMultiline={ false }
-      onDismiss={ () => { console.log('test'); } }>
-      Blocked - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi luctus, purus a lobortis tristique, odio augue pharetra metus, ac placerat nunc mi nec dui. Vestibulum aliquam et nunc semper scelerisque. Curabitur vitae orci nec quam condimentum porttitor et sed lacus. Vivamus ac efficitur leo. Cras faucibus mauris libero, ac placerat erat euismod et. Donec pulvinar commodo odio sit amet faucibus. In hac habitasse platea dictumst. Duis eu ante commodo, condimentum nibh pellentesque, laoreet enim. Fusce massa lorem, ultrices eu mi a, fermentum suscipit magna. Integer porta purus pulvinar, hendrerit felis eget, condimentum mauris. <Link href='www.bing.com'>Visit our website</Link></MessageBar>
+      onDismiss={ () => { console.log('test'); } }
+    >
+      Blocked - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi luctus, purus a lobortis tristique, odio augue pharetra metus, ac placerat nunc mi nec dui. Vestibulum aliquam et nunc semper scelerisque. Curabitur vitae orci nec quam condimentum porttitor et sed lacus. Vivamus ac efficitur leo. Cras faucibus mauris libero, ac placerat erat euismod et. Donec pulvinar commodo odio sit amet faucibus. In hac habitasse platea dictumst. Duis eu ante commodo, condimentum nibh pellentesque, laoreet enim. Fusce massa lorem, ultrices eu mi a, fermentum suscipit magna. Integer porta purus pulvinar, hendrerit felis eget, condimentum mauris. <Link href='www.bing.com'>Visit our website</Link>
+    </MessageBar>
 
     <Label>SevereWarning MessageBar - multiline (default)</Label>
     <MessageBar
@@ -33,7 +38,8 @@ export const MessageBarBasicExample = () => (
           <DefaultButton>Yes</DefaultButton>
           <DefaultButton>No</DefaultButton>
         </div>
-      }>
+      }
+    >
       <span>SevereWarning - lorem ipsum dolor sit amet, a elit sem interdum consectetur adipiscing elit.</span>
       <Link href='www.bing.com'>Visit our website</Link>
     </MessageBar>
@@ -47,7 +53,8 @@ export const MessageBarBasicExample = () => (
         </div>
       }
       messageBarType={ MessageBarType.success }
-      isMultiline={ false }>
+      isMultiline={ false }
+    >
       Success - Lorem ipsum dolor sit amet <Link href='www.bing.com'>Visit our website</Link>
     </MessageBar>
 
@@ -61,7 +68,8 @@ export const MessageBarBasicExample = () => (
           <DefaultButton>Yes</DefaultButton>
           <DefaultButton>No</DefaultButton>
         </div>
-      }>
+      }
+    >
       Warning - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi luctus, purus a lobortis tristique, odio augue pharetra metus, ac placerat nunc mi nec dui. Vestibulum aliquam et nunc semper scelerisque. Curabitur vitae orci nec quam condimentum porttitor et sed lacus. Vivamus ac efficitur leo. Cras faucibus mauris libero, ac placerat erat euismod et. Donec pulvinar commodo odio sit amet faucibus. In hac habitasse platea dictumst. Duis eu ante commodo, condimentum nibh pellentesque, laoreet enim. Fusce massa lorem, ultrices eu mi a, fermentum suscipit magna. Integer porta purus pulvinar, hendrerit felis eget, condimentum mauris.<Link href='www.bing.com'>Visit our website</Link>
     </MessageBar>
   </div>
diff --git a/packages/office-ui-fabric-react/src/components/Modal/ModalPage.tsx b/packages/office-ui-fabric-react/src/components/Modal/ModalPage.tsx
index 6e8ff3941cc4d..967f6d9ba3ee0 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/ModalPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Modal/ModalPage.tsx
@@ -58,7 +58,8 @@ export class ModalPage extends React.Component<IComponentDemoPageProps, {}> {
             </ul>
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Nav/NavPage.tsx b/packages/office-ui-fabric-react/src/components/Nav/NavPage.tsx
index 9ee245d4f6f4b..cbbf211a466b8 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/NavPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/NavPage.tsx
@@ -73,7 +73,8 @@ export class NavPage extends React.Component<IComponentDemoPageProps, {}> {
             </ul>
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.FabricDemoApp.Example.tsx b/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.FabricDemoApp.Example.tsx
index 806fae76b295a..9598b22e54d02 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.FabricDemoApp.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.FabricDemoApp.Example.tsx
@@ -6,12 +6,14 @@ import { Nav } from 'office-ui-fabric-react/lib/Nav';
 export class NavFabricDemoAppExample extends React.Component<any, any> {
   public render() {
     return (
-      <Nav groups={ AppDefinition.examplePages } onRenderLink={ (link: any) => ([
-        <span key={ 1 } className='Nav-linkText'>{ link.name }</span>,
-        (link.status !== undefined ?
-          <span key={ 2 } className={ 'Nav-linkFlair ' + 'is-state' + link.status } >{ ExampleStatus[link.status] }</span> :
-          null)
-      ]) }
+      <Nav
+        groups={ AppDefinition.examplePages }
+        onRenderLink={ (link: any) => ([
+          <span key={ 1 } className='Nav-linkText'>{ link.name }</span>,
+          (link.status !== undefined ?
+            <span key={ 2 } className={ 'Nav-linkFlair ' + 'is-state' + link.status } >{ ExampleStatus[link.status] }</span> :
+            null)
+        ]) }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Basic.Example.tsx
index 44c7a5eb5fda6..6bd3a19c07d44 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Basic.Example.tsx
@@ -62,7 +62,8 @@ export class OverflowSetBasicExample extends BaseComponent<any, any> {
             <Link
               className={ css(styles.overflowLinks) }
               onClick={ item.onClick }
-            >{ item.name }</Link>
+            >{ item.name }
+            </Link>
           );
         } }
       />
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx
index 3e1098626ebdf..0dac778781b5a 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx
@@ -131,7 +131,7 @@ export class OverflowSetCustomExample extends BaseComponent<any, any> {
               iconProps={ { iconName: item.icon } }
               menuProps={ item.subMenuProps }
               text={ item.name }
-            >  </DefaultButton>
+            />
           );
         } }
       />
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx b/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx
index d2ba7bbbdc250..024193ef69397 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx
@@ -62,7 +62,8 @@ export class OverlayPage extends React.Component<IComponentDemoPageProps, {}> {
         related={
           <a href='https://dev.office.com/fabric-js/Components/Overlay/Overlay.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Dark.Example.tsx b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Dark.Example.tsx
index 3bf7c9e31de84..06eeea415f5a3 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Dark.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Dark.Example.tsx
@@ -23,7 +23,8 @@ export class OverlayDarkExample extends React.Component<any, any> {
         { isOverlayVisible && (
           <Overlay
             isDarkThemed={ true }
-            onClick={ () => this.setState({ isOverlayVisible: false }) }>
+            onClick={ () => this.setState({ isOverlayVisible: false }) }
+          >
             <div className='OverlayExample-content'>
               <p>I am content within the overlay.</p>
             </div>
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.test.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.test.tsx
index 425fa56b8aed2..7ae9e1c64b9f0 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.test.tsx
@@ -26,7 +26,8 @@ describe('Panel', () => {
       <Panel
         isOpen={ true }
         onDismiss={ () => { dismissCalled = true; } }
-        onDismissed={ () => dismissedCalled = true } />,
+        onDismissed={ () => dismissedCalled = true }
+      />,
       div) as any;
 
     panel.dismiss();
diff --git a/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx b/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
index ecc8ab8d09bde..68085c2aa5fb0 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
@@ -119,7 +119,8 @@ export class PanelPage extends React.Component<IComponentDemoPageProps, {}> {
         related={
           <a href='https://dev.office.com/fabric-js/Components/Panel/Panel.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Footer.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Footer.Example.tsx
index 1336754455219..ca87067d68841 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Footer.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Footer.Example.tsx
@@ -29,7 +29,8 @@ export class PanelFooterExample extends React.Component<any, any> {
               <div>
                 <PrimaryButton
                   onClick={ this._onClosePanel }
-                  style={ { 'marginRight': '8px' } } >
+                  style={ { 'marginRight': '8px' } }
+                >
                   Save
                 </PrimaryButton>
                 <DefaultButton
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallRight.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallRight.Example.tsx
index ab2567a34294a..617728ab6d884 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallRight.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallRight.Example.tsx
@@ -31,7 +31,8 @@ export class PanelSmallRightExample extends React.Component<any, any> {
               <div>
                 <PrimaryButton
                   onClick={ this._onClosePanel }
-                  style={ { 'marginRight': '8px' } } >
+                  style={ { 'marginRight': '8px' } }
+                >
                   Save
                 </PrimaryButton>
                 <DefaultButton
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
index 54a6190464a4f..3a8df5a163354 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
@@ -74,7 +74,8 @@ export class PersonaPage extends React.Component<IComponentDemoPageProps, {}> {
         related={
           <a href='https://dev.office.com/fabric-js/Components/Persona/Persona.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
index 75710da45a62f..3f8611d50c594 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
@@ -34,7 +34,8 @@ export class PersonaBasicExample extends React.Component<React.Props<PersonaBasi
           <Checkbox
             label='Include persona details'
             checked={ renderPersonaDetails }
-            onChange={ (ev, checked) => { this.setState({ renderPersonaDetails: checked }); } } />
+            onChange={ (ev, checked) => { this.setState({ renderPersonaDetails: checked }); } }
+          />
         </div>
 
         <Persona
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PickersPage.tsx b/packages/office-ui-fabric-react/src/components/pickers/PickersPage.tsx
index 5e30a5802ee29..e50c743812aa7 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PickersPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PickersPage.tsx
@@ -41,7 +41,8 @@ export class PickersPage extends React.Component<IComponentDemoPageProps, {}> {
             <span> are used to pick recipients.</span>
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
index 7c8b66c5b41ef..15e83d5f216d1 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
@@ -282,7 +282,8 @@ export const SuggestedBigItem: (documentProps: IFullDocumentCardProps, itemProps
     <Persona
       imageUrl={ documentPreviewProps && documentPreviewProps.previewImages[0].previewImageSrc }
       primaryText={ documentTitleProps && documentTitleProps.title }
-      size={ PersonaSize.small } />
+      size={ PersonaSize.small }
+    />
   );
 };
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
index 24b96f496da30..bf4c79df9d0ca 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
@@ -34,7 +34,8 @@ export class TagPickerBasicExample extends React.Component<{}, ITagPickerDemoPag
     return (
       <div>
         <Checkbox label='Disable Tag Picker' checked={ this.state.isPickerDisabled } onChange={ this._onDisabledButtonClick } />
-        <TagPicker ref='tagPicker'
+        <TagPicker
+          ref='tagPicker'
           onResolveSuggestions={ this._onFilterChanged }
           getTextFromItem={ (item: any) => { return item.name; } }
           pickerSuggestionsProps={

From a5683807f109b73ca896dffa5007366636f820e1 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 6 Sep 2017 10:16:32 +0000
Subject: [PATCH 0580/1641] Applying package updates.

---
 apps/fabric-website/package.json                   |  2 +-
 apps/ssr-tests/package.json                        |  2 +-
 apps/test-bundle-button/package.json               |  2 +-
 apps/todo-app/package.json                         |  2 +-
 .../grouped-list-empty_2017-09-05-18-20.json       | 11 -----------
 packages/experiments/package.json                  |  2 +-
 packages/office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md       |  9 ++++++++-
 packages/office-ui-fabric-react/package.json       |  2 +-
 9 files changed, 28 insertions(+), 18 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/grouped-list-empty_2017-09-05-18-20.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 42fb2aa5fad79..324618729ec9b 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -44,7 +44,7 @@
     "@uifabric/example-app-base": ">=4.2.7 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=4.40.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.41.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 00020590bf0fe..d8f4d1cd440f7 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.40.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.41.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 2254f69e11ca1..772f5e0f0ec2c 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -26,7 +26,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.40.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.41.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 4b8c51a9c0169..56bdbe78adf3b 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -24,7 +24,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=4.40.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.41.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/grouped-list-empty_2017-09-05-18-20.json b/common/changes/office-ui-fabric-react/grouped-list-empty_2017-09-05-18-20.json
deleted file mode 100644
index 6581303a9e925..0000000000000
--- a/common/changes/office-ui-fabric-react/grouped-list-empty_2017-09-05-18-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Allow rendering empty GroupedList headers",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "spelliot@microsoft.com"
-}
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 40220a4ee85ed..250548ecae4c0 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/styling": ">=0.22.1 <1.0.0",
     "@uifabric/utilities": ">=4.13.0 <5.0.0",
-    "office-ui-fabric-react": ">=4.40.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.41.0 <5.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 4d5cc256ae829..a9929f0f2bb5e 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.41.0",
+      "tag": "office-ui-fabric-react_v4.41.0",
+      "date": "Wed, 06 Sep 2017 10:16:32 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Spencer Elliott <me@elliottsj.com>",
+            "commit": "10771104576cbaaa2dac7d3d434976225354eb50",
+            "comment": "Allow rendering empty GroupedList headers"
+          }
+        ]
+      }
+    },
     {
       "version": "4.40.1",
       "tag": "office-ui-fabric-react_v4.40.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 11e98d576fe83..7af61f04d0e42 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 05 Sep 2017 20:36:48 GMT and should not be manually modified.
+This log was last generated on Wed, 06 Sep 2017 10:16:32 GMT and should not be manually modified.
+
+## 4.41.0
+Wed, 06 Sep 2017 10:16:32 GMT
+
+### Minor changes
+
+- Allow rendering empty GroupedList headers
 
 ## 4.40.1
 Tue, 05 Sep 2017 20:36:48 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 46cbe6d67d92f..859074fb5651f 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.40.1",
+  "version": "4.41.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 19c7d3ad379a5f9c10f16e9a2a4e2726db21bd45 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Wed, 6 Sep 2017 09:59:03 -0700
Subject: [PATCH 0581/1641] Fix minor alignment issues with Signals (#2734)

* Fix minor alignment issues with SignalField

* Update change output
---
 .../experiments/signals_2017-09-05-19-23.json       | 11 +++++++++++
 .../experiments/src/components/signals/Signals.scss |  2 ++
 .../experiments/src/components/signals/Signals.tsx  | 13 +++++++++++--
 3 files changed, 24 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/signals_2017-09-05-19-23.json

diff --git a/common/changes/@uifabric/experiments/signals_2017-09-05-19-23.json b/common/changes/@uifabric/experiments/signals_2017-09-05-19-23.json
new file mode 100644
index 0000000000000..7eb4739a334e4
--- /dev/null
+++ b/common/changes/@uifabric/experiments/signals_2017-09-05-19-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Fix minor alignment issues with SignalField",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/signals/Signals.scss b/packages/experiments/src/components/signals/Signals.scss
index 7b4e6efe9f094..91b8b6cf1d868 100644
--- a/packages/experiments/src/components/signals/Signals.scss
+++ b/packages/experiments/src/components/signals/Signals.scss
@@ -4,6 +4,7 @@
 .signal {
   display: inline-block;
   margin: 0 4px;
+  position: relative;
 
   &:first-child {
     @include margin-left(0);
@@ -68,6 +69,7 @@
 
 .shared {
   color: $ms-color-neutralSecondary;
+  top: 1px;
 }
 
 .missingMetadata {
diff --git a/packages/experiments/src/components/signals/Signals.tsx b/packages/experiments/src/components/signals/Signals.tsx
index b42a7e8e62cfb..d5e428bba4dd6 100644
--- a/packages/experiments/src/components/signals/Signals.tsx
+++ b/packages/experiments/src/components/signals/Signals.tsx
@@ -18,8 +18,17 @@ export interface ISignalFieldProps extends React.HTMLAttributes<HTMLSpanElement>
  * Pass the main value as the children.
  */
 export const SignalField: React.StatelessComponent<ISignalFieldProps> = (props: ISignalFieldProps): JSX.Element => {
-  return (
-    <span className={ SignalStyles.signalField }>
+  const {
+    before,
+    after,
+    className,
+    ...spanProps
+  } = props;
+  return (
+    <span
+      { ...spanProps }
+      className={ css(SignalStyles.signalField, className) }
+    >
       { props.before }
       <span className={ SignalStyles.signalFieldValue }>
         { props.children }

From 635eb7474f7c71379dd52989736112786a9114aa Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 6 Sep 2017 13:48:57 -0700
Subject: [PATCH 0582/1641] fixed commandbar experiments bug

---
 packages/experiments/src/components/CommandBar/CommandBar.tsx | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/packages/experiments/src/components/CommandBar/CommandBar.tsx b/packages/experiments/src/components/CommandBar/CommandBar.tsx
index 0b2692833d361..0e7d87703720e 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBar.tsx
@@ -184,10 +184,9 @@ export class CommandBar extends BaseComponent<ICommandBarProps, {}> implements I
     let { buttonStyles } = this.props;
 
     if (item.onRender) { return item.onRender(item); }
-
     const commandButtonProps: ICommandBarItemProps = {
       ...item,
-      styles: { root: { height: COMMANDBAR_HEIGHT }, ...item.buttonStyles, ...buttonStyles },
+      styles: { root: { height: COMMANDBAR_HEIGHT }, ...item.styles, ...buttonStyles },
       className: css(styles.commandButton, item.className),
       text: !item.iconOnly ? item.name : '',
       menuProps: item.subMenuProps,

From 410d0e751e045102354d4da01b514a31ff0a2b8d Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Wed, 6 Sep 2017 15:45:35 -0700
Subject: [PATCH 0583/1641] Add presentation hooks for Tile and FolderCover
 (#2756)

* Add hooks to control visibility of Tile and FolderCover parts

* Add examples for presentation hooks for Tile

* Update change output

* Fix nameplate heights and bounding boxes
---
 .../tile-states_2017-09-06-18-16.json         | 11 +++
 .../FolderCover/FolderCover.Props.ts          | 26 ++++++
 .../components/FolderCover/FolderCover.scss   |  8 ++
 .../components/FolderCover/FolderCover.tsx    | 28 +++---
 .../src/components/Tile/Tile.Props.ts         | 16 ++++
 .../experiments/src/components/Tile/Tile.scss | 91 +++++++++++++------
 .../experiments/src/components/Tile/Tile.tsx  | 44 ++++++---
 .../Tile/examples/Tile.Document.Example.tsx   | 69 ++++++++++++--
 .../Tile/examples/Tile.Media.Example.tsx      | 63 +++++++++++--
 .../src/components/signals/Signals.scss       |  2 +
 10 files changed, 292 insertions(+), 66 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/tile-states_2017-09-06-18-16.json

diff --git a/common/changes/@uifabric/experiments/tile-states_2017-09-06-18-16.json b/common/changes/@uifabric/experiments/tile-states_2017-09-06-18-16.json
new file mode 100644
index 0000000000000..0140adfafbb68
--- /dev/null
+++ b/common/changes/@uifabric/experiments/tile-states_2017-09-06-18-16.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Add presentation hooks for Tile and FolderCover",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.Props.ts b/packages/experiments/src/components/FolderCover/FolderCover.Props.ts
index 6bff688f05f93..f4729ea86777e 100644
--- a/packages/experiments/src/components/FolderCover/FolderCover.Props.ts
+++ b/packages/experiments/src/components/FolderCover/FolderCover.Props.ts
@@ -12,7 +12,33 @@ export type FolderCoverType =
   'media';
 
 export interface IFolderCoverProps extends IBaseProps, React.HTMLAttributes<FolderCover> {
+  /**
+   * The breakpoint size of the folder cover.
+   *
+   * @type {FolderCoverSize}
+   * @memberof IFolderCoverProps
+   */
   folderCoverSize?: FolderCoverSize;
+  /**
+   * The display type of the folder cover.
+   *
+   * @type {FolderCoverType}
+   * @memberof IFolderCoverProps
+   */
   folderCoverType?: FolderCoverType;
+  /**
+   * Whether or not the content should be hidden, even if specified.
+   * Use this to "fade in" the content once it is loaded.
+   *
+   * @type {boolean}
+   * @memberof IFolderCoverProps
+   */
+  hideContent?: boolean;
+  /**
+   * A metadata value to display on the folder cover.
+   *
+   * @type {(React.ReactNode[] | React.ReactNode)}
+   * @memberof IFolderCoverProps
+   */
   metadata?: React.ReactNode[] | React.ReactNode;
 }
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.scss b/packages/experiments/src/components/FolderCover/FolderCover.scss
index 875aa12e57c7f..2be7b89021561 100644
--- a/packages/experiments/src/components/FolderCover/FolderCover.scss
+++ b/packages/experiments/src/components/FolderCover/FolderCover.scss
@@ -43,6 +43,14 @@
   flex-direction: column;
   align-items: center;
   overflow: hidden;
+  box-shadow: 0 1px 3px 1px rgba(1, 1, 0, 0.05);
+  opacity: 1;
+
+  transition: opacity 0.2s linear;
+
+  .hideContent & {
+    opacity: 0;
+  }
 
   &,
   .isSmall & {
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.tsx b/packages/experiments/src/components/FolderCover/FolderCover.tsx
index c7c3fdbaca176..e8cea4626f585 100644
--- a/packages/experiments/src/components/FolderCover/FolderCover.tsx
+++ b/packages/experiments/src/components/FolderCover/FolderCover.tsx
@@ -69,7 +69,8 @@ export class FolderCover extends React.Component<IFolderCoverProps, IFolderCover
   public render(): JSX.Element | null {
     const {
       folderCoverSize: size = 'large',
-      folderCoverType: type = 'default'
+      folderCoverType: type = 'default',
+      hideContent = false
     } = this.props;
 
     const assets = ASSETS[size][type];
@@ -77,27 +78,32 @@ export class FolderCover extends React.Component<IFolderCoverProps, IFolderCover
     return (
       <div
         className={ css(FolderCoverStyles.root, {
-          [FolderCoverStyles.isSmall]: size === 'small',
-          [FolderCoverStyles.isLarge]: size === 'large',
-          [FolderCoverStyles.isDefault]: type === 'default',
-          [FolderCoverStyles.isMedia]: type === 'media'
+          [`ms-FolderCover--isSmall ${FolderCoverStyles.isSmall}`]: size === 'small',
+          [`ms-FolderCover--isLarge ${FolderCoverStyles.isLarge}`]: size === 'large',
+          [`ms-FolderCover--isDefault ${FolderCoverStyles.isDefault}`]: type === 'default',
+          [`ms-FolderCover--isMedia ${FolderCoverStyles.isMedia}`]: type === 'media',
+          [`ms-FolderCover--hideContent ${FolderCoverStyles.hideContent}`]: hideContent
         }) }
       >
         <img
-          className={ css(FolderCoverStyles.back) }
+          className={ css('ms-FolderCover-back', FolderCoverStyles.back) }
           src={ assets.back }
         />
-        <span className={ css(FolderCoverStyles.content) }>
-          { this.props.children }
-        </span>
+        {
+          this.props.children ? (
+            <span className={ css('ms-FolderCover-content', FolderCoverStyles.content) }>
+              { this.props.children }
+            </span>
+          ) : null
+        }
         <img
-          className={ css(FolderCoverStyles.front) }
+          className={ css('ms-FolderCover-front', FolderCoverStyles.front) }
           src={ assets.front }
         />
         {
           this.props.metadata ?
             (
-              <span className={ css(FolderCoverStyles.metadata) }>
+              <span className={ css('ms-FolderCover-metadata', FolderCoverStyles.metadata) }>
                 { this.props.metadata }
               </span>
             ) :
diff --git a/packages/experiments/src/components/Tile/Tile.Props.ts b/packages/experiments/src/components/Tile/Tile.Props.ts
index 9fd37772f2a38..41b13b88b220a 100644
--- a/packages/experiments/src/components/Tile/Tile.Props.ts
+++ b/packages/experiments/src/components/Tile/Tile.Props.ts
@@ -65,6 +65,14 @@ export interface ITileProps extends IBaseProps, React.AllHTMLAttributes<HTMLSpan
    * @memberof ITileProps
    */
   showBackgroundFrame?: boolean;
+  /**
+   * Whether or not to hide the background, regardless of whether it is present.
+   * Use this to control when the background "fades in" if the content needs to be loaded.
+   *
+   * @type {boolean}
+   * @memberof ITileProps
+   */
+  hideBackground?: boolean;
   /**
    * Content to render as the foreground of the tile, bounded by padding and the nameplate.
    *
@@ -79,6 +87,14 @@ export interface ITileProps extends IBaseProps, React.AllHTMLAttributes<HTMLSpan
    * @memberof ITileProps
    */
   showForegroundFrame?: boolean;
+  /**
+   * Whether or not to hide the foreground, regardless of whether it is present.
+   * Use this to control when the foreground "fades in" if the content needs to be loaded.
+   *
+   * @type {boolean}
+   * @memberof ITileProps
+   */
+  hideForeground?: boolean;
   /**
    * The accessible label for the selection checkbox.
    *
diff --git a/packages/experiments/src/components/Tile/Tile.scss b/packages/experiments/src/components/Tile/Tile.scss
index 4b024e0020b12..31680a55ef4df 100644
--- a/packages/experiments/src/components/Tile/Tile.scss
+++ b/packages/experiments/src/components/Tile/Tile.scss
@@ -10,6 +10,7 @@
   bottom: 0;
   left: 0;
   right: 0;
+  z-index: 0; // Reset the stacking context.
   background-color: $ms-color-white;
   transition: transform 0.1s linear;
   color: $ms-color-neutralPrimary;
@@ -93,12 +94,18 @@
   text-decoration: none;
 }
 
-.frame {
+.foreground {
   margin: auto;
   position: relative;
   overflow: hidden;
   max-width: 100%;
   max-height: 100%;
+  opacity: 1;
+  transition: opacity 0.2s linear;
+
+  &.foregroundHide {
+    opacity: 0;
+  }
 
   &.hasForegroundFrame {
     margin: auto auto 0 auto;
@@ -154,11 +161,6 @@ button.check {
   padding: 6px;
 }
 
-.content {
-  position: relative;
-  flex: 1;
-}
-
 .background {
   position: absolute;
   top: 0;
@@ -166,25 +168,48 @@ button.check {
   right: 0;
   bottom: 0;
   overflow: hidden;
+
+  opacity: 1;
+
+  transition: opacity 0.2s linear;
+
+  &.backgroundHide {
+    opacity: 0;
+  }
 }
 
-.foreground {
-  top: 16px;
-  left: 16px;
-  right: 16px;
+.aboveNameplate {
+  flex: 1;
+  position: relative;
+  margin: 16px 16px 0 16px;
+}
+
+.content {
+  position: absolute;
+  top: 0;
+  left: 0;
   bottom: 0;
-  flex-grow: 1;
+  right: 0;
   display: flex;
   flex-direction: column;
   align-items: center;
-  position: absolute;
 }
 
 .nameplate {
   display: block;
+  position: relative;
   margin: auto 0 0 0;
   padding: 12px 8px;
   text-align: center;
+  z-index: 0;
+
+  .name {
+    transition: color 0.2s linear;
+  }
+
+  .activity {
+    transition: color 0.2s linear;
+  }
 
   .tile.hasBackgroundFrame & {
     padding: 12px 10px;
@@ -219,8 +244,8 @@ button.check {
   font-weight: $ms-font-weight-regular;
   font-size: $ms-font-size-m;
   color: $ms-color-neutralPrimary;
-  height: 20px;
-  line-height: 20px;
+  height: 17px;
+  line-height: 17px;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
@@ -233,8 +258,8 @@ button.check {
   font-weight: $ms-font-weight-regular;
   font-size: $ms-font-size-s;
   color: #767676;
-  height: 16px;
-  line-height: 16px;
+  height: 14px;
+  line-height: 14px;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
@@ -249,28 +274,36 @@ button.check {
 
 .hasBackground {
   .nameplate {
-    position: relative;
-    background-image: linear-gradient(to top, rgba(#000, 0.65) 0%, rgba(#000, 0.65 * 0.85) 70%, rgba(#000, 0.30 * 0.85) 100%);
-
     &:before {
       position: absolute;
       content: '';
       display: block;
-      height: 12px;
-      bottom: 100%;
+      top: -12px;
+      bottom: 0;
       left: 0;
       right: 0;
-      background-image: linear-gradient(to top, rgba(#000, 0.30 * 0.85) 0%, rgba(#000, 0) 100%);
+      background-image: linear-gradient(to top, rgba(#000, 0.65) 0%, rgba(#000, 0.65 * 0.85) 55%, rgba(#000, 0.65 * 0.30) 80%, rgba(#000, 0) 100%);
+      z-index: -1;
+      transition: opacity 0.2s linear;
+      opacity: 0;
     }
   }
 
-  .name {
-    color: $ms-color-white;
-    text-shadow: 0.5px 0.5px 2px rgba(#000, 0.55);
-  }
+  &.showBackground {
+    .name {
+      color: $ms-color-white;
+      text-shadow: 0.5px 0.5px 2px rgba(#000, 0.55);
+    }
 
-  .activity {
-    color: $ms-color-white;
-    text-shadow: 0.5px 0.5px 2px rgba(#000, 0.55);
+    .activity {
+      color: $ms-color-white;
+      text-shadow: 0.5px 0.5px 2px rgba(#000, 0.55);
+    }
+
+    .nameplate {
+      &:before {
+        opacity: 1;
+      }
+    }
   }
 }
diff --git a/packages/experiments/src/components/Tile/Tile.tsx b/packages/experiments/src/components/Tile/Tile.tsx
index 1673e800a1ec3..086ef9c715307 100644
--- a/packages/experiments/src/components/Tile/Tile.tsx
+++ b/packages/experiments/src/components/Tile/Tile.tsx
@@ -15,8 +15,9 @@ const SignalStyles: any = SignalStylesModule;
 
 const enum TileLayoutValues {
   nameplatePadding = 12,
-  nameplateNameHeight = 20,
-  nameplateActivityHeight = 20,
+  nameplateNameHeight = 17,
+  nameplateMargin = 4,
+  nameplateActivityHeight = 14,
   foregroundMargin = 16
 }
 
@@ -113,6 +114,8 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
       foreground,
       showBackgroundFrame = false,
       showForegroundFrame = false,
+      hideBackground = false,
+      hideForeground = false,
       itemName,
       itemActivity,
       componentRef,
@@ -136,7 +139,9 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
           [`ms-Tile--hasBackgroundFrame ${TileStyles.hasBackgroundFrame}`]: showBackgroundFrame,
           [`ms-Tile--isSelected ${TileStyles.selected} ${SignalStyles.selected}`]: isSelected,
           [`ms-Tile--isSelectable ${TileStyles.selectable}`]: isSelectable,
-          [`ms-Tile--hasBackground ${TileStyles.hasBackground} ${SignalStyles.dark}`]: !!background
+          [`ms-Tile--hasBackground ${TileStyles.hasBackground}`]: !!background,
+          [SignalStyles.dark]: !!background && !hideBackground,
+          [`ms-Tile--showBackground ${TileStyles.showBackground}`]: !hideBackground
         }) }
         data-is-focusable={ true }
         data-is-sub-focuszone={ true }
@@ -150,13 +155,15 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
         >
           {
             background ? this._onRenderBackground({
-              background: background
+              background: background,
+              hideBackground
             }) : null
           }
           {
             foreground ? this._onRenderForeground({
               foreground: foreground,
-              showForegroundFrame: showForegroundFrame
+              showForegroundFrame: showForegroundFrame,
+              hideForeground
             }) : null
           }
           {
@@ -176,12 +183,18 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
   }
 
   private _onRenderBackground({
-    background
+    background,
+    hideBackground
   }: {
-      background: React.ReactNode | React.ReactNode[]
+      background: React.ReactNode | React.ReactNode[];
+      hideBackground: boolean;
     }): JSX.Element {
     return (
-      <span className={ css('ms-Tile-background', TileStyles.background) }>
+      <span
+        className={ css('ms-Tile-background', TileStyles.background, {
+          [`ms-Tile-background--hide ${TileStyles.backgroundHide}`]: hideBackground
+        }) }
+      >
         { background }
       </span>
     );
@@ -189,24 +202,27 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
 
   private _onRenderForeground({
     foreground,
-    showForegroundFrame
+    showForegroundFrame,
+    hideForeground
   }: {
       foreground: React.ReactNode | React.ReactNode[];
       showForegroundFrame: boolean;
+      hideForeground: boolean;
     }): JSX.Element {
     return (
       <span
         role='presentation'
-        className={ css('ms-Tile-content', TileStyles.content) }
+        className={ css('ms-Tile-aboveNameplate', TileStyles.aboveNameplate) }
       >
         <span
           role='presentation'
-          className={ css('ms-Tile-foreground', TileStyles.foreground) }
+          className={ css('ms-Tile-content', TileStyles.content) }
         >
           <span
             role='presentation'
-            className={ css('ms-Tile-frame', TileStyles.frame, {
-              [`ms-Tile-frame--hasForegroundFrame ${TileStyles.hasForegroundFrame}`]: showForegroundFrame
+            className={ css('ms-Tile-foreground', TileStyles.foreground, {
+              [`ms-Tile-foreground--hasFrame ${TileStyles.hasForegroundFrame}`]: showForegroundFrame,
+              [`ms-Tile-foreground--hide ${TileStyles.foregroundHide}`]: hideForeground
             }) }
           >
             { foreground }
@@ -309,7 +325,7 @@ export function getTileLayout(tileElement: JSX.Element): ITileLayout {
       nameplateHeight += TileLayoutValues.nameplateNameHeight;
     }
     if (tileProps.itemActivity) {
-      nameplateHeight += TileLayoutValues.nameplateActivityHeight;
+      nameplateHeight += TileLayoutValues.nameplateActivityHeight + TileLayoutValues.nameplateMargin;
     }
   }
 
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
index 75480194dc6d3..b6ea791a54d85 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
@@ -1,7 +1,8 @@
 
 import * as React from 'react';
 import { Tile, getTileLayout, renderTileWithLayout } from '../Tile';
-import { css } from 'office-ui-fabric-react/lib/Utilities';
+import { css, autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import {
   SignalField,
   NewSignal,
@@ -16,8 +17,29 @@ import * as TileExampleStylesModule from './Tile.Example.scss';
 // tslint:disable-next-line:no-any
 const TileExampleStyles = TileExampleStylesModule as any;
 
+const ITEMS: { name: string; activity: string; }[] = [
+  {
+    name: lorem(2),
+    activity: lorem(6),
+  },
+  {
+    name: lorem(2),
+    activity: lorem(6),
+  },
+  {
+    name: lorem(2),
+    activity: lorem(6),
+  },
+  {
+    name: lorem(2),
+    activity: lorem(6),
+  }
+];
+
 interface IDocumentTileWithThumbnailProps {
   originalImageSize: ISize;
+  showForeground: boolean;
+  item: typeof ITEMS[0];
 }
 
 const DocumentTileWithThumbnail: React.StatelessComponent<IDocumentTileWithThumbnailProps> =
@@ -36,7 +58,7 @@ const DocumentTileWithThumbnail: React.StatelessComponent<IDocumentTileWithThumb
               <TrendingSignal />
             }
           >
-            { lorem(2) }
+            { props.item.name }
           </SignalField>
         }
         itemActivity={
@@ -45,12 +67,13 @@ const DocumentTileWithThumbnail: React.StatelessComponent<IDocumentTileWithThumb
               <CommentsSignal>{ '12' }</CommentsSignal>
             }
           >
-            { lorem(2) }
+            { props.item.activity }
           </SignalField>
         }
         foreground={
           <span />
         }
+        hideForeground={ !props.showForeground }
         showForegroundFrame={ true }
       />
     );
@@ -81,10 +104,31 @@ const DocumentTileWithThumbnail: React.StatelessComponent<IDocumentTileWithThumb
     );
   };
 
-export class TileDocumentExample extends React.Component<{}, {}> {
+export interface ITileDocumentExampleState {
+  imagesLoaded: boolean;
+}
+
+export class TileDocumentExample extends React.Component<{}, ITileDocumentExampleState> {
+  constructor() {
+    super();
+
+    this.state = {
+      imagesLoaded: true
+    };
+  }
+
   public render(): JSX.Element {
+    const {
+      imagesLoaded
+    } = this.state;
+
     return (
       <div>
+        <Checkbox
+          label='Show images as loaded'
+          checked={ imagesLoaded }
+          onChange={ this._onImagesLoadedChanged }
+        />
         <h3>Document thumbnail</h3>
         <DocumentTileWithThumbnail
           originalImageSize={
@@ -93,6 +137,8 @@ export class TileDocumentExample extends React.Component<{}, {}> {
               height: 40
             }
           }
+          showForeground={ imagesLoaded }
+          item={ ITEMS[0] }
         />
         <DocumentTileWithThumbnail
           originalImageSize={
@@ -101,6 +147,8 @@ export class TileDocumentExample extends React.Component<{}, {}> {
               height: 150
             }
           }
+          showForeground={ imagesLoaded }
+          item={ ITEMS[1] }
         />
         <DocumentTileWithThumbnail
           originalImageSize={
@@ -109,6 +157,8 @@ export class TileDocumentExample extends React.Component<{}, {}> {
               height: 200
             }
           }
+          showForeground={ imagesLoaded }
+          item={ ITEMS[2] }
         />
         <h3>Document icon</h3>
         <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
@@ -119,7 +169,7 @@ export class TileDocumentExample extends React.Component<{}, {}> {
                   <NewSignal />
                 }
               >
-                { lorem(1) }
+                { ITEMS[3].name }
               </SignalField>
             }
             itemActivity={
@@ -129,7 +179,7 @@ export class TileDocumentExample extends React.Component<{}, {}> {
                     <SharedSignal />
                   }
                 >
-                  { lorem(3) }
+                  { ITEMS[3].activity }
                 </SignalField>
               )
             }
@@ -154,4 +204,11 @@ export class TileDocumentExample extends React.Component<{}, {}> {
       </div>
     );
   }
+
+  @autobind
+  private _onImagesLoadedChanged(event: React.FormEvent<HTMLInputElement>, checked: boolean): void {
+    this.setState({
+      imagesLoaded: checked
+    });
+  }
 }
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
index de3474b2dc884..f2dcf66e1df8d 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
@@ -2,7 +2,8 @@
 import * as React from 'react';
 import { Tile, getTileLayout, renderTileWithLayout } from '../Tile';
 import { Icon } from 'office-ui-fabric-react/lib/Icon';
-import { css } from 'office-ui-fabric-react/lib/Utilities';
+import { css, autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { ISize, fitContentToBounds } from '@uifabric/utilities';
 import {
   SignalField,
@@ -14,12 +15,29 @@ import {
 import { lorem } from '@uifabric/example-app-base';
 import * as TileExampleStylesModule from './Tile.Example.scss';
 
+const ITEMS: { name: string; activity: string; }[] = [
+  {
+    name: lorem(2),
+    activity: lorem(6),
+  },
+  {
+    name: lorem(2),
+    activity: lorem(6),
+  },
+  {
+    name: lorem(2),
+    activity: lorem(6),
+  }
+];
+
 // tslint:disable-next-line:no-any
 const TileExampleStyles = TileExampleStylesModule as any;
 
 interface IImageTileProps {
   tileSize: ISize;
   originalImageSize: ISize;
+  showBackground: boolean;
+  item: typeof ITEMS[0];
 }
 
 const ImageTile: React.StatelessComponent<IImageTileProps> = (props: IImageTileProps): JSX.Element => {
@@ -32,7 +50,7 @@ const ImageTile: React.StatelessComponent<IImageTileProps> = (props: IImageTileP
             <NewSignal />
           }
         >
-          { lorem(2) }
+          { props.item.name }
         </SignalField>
       }
       itemActivity={
@@ -41,12 +59,13 @@ const ImageTile: React.StatelessComponent<IImageTileProps> = (props: IImageTileP
             [<Signal key={ 0 }><Icon iconName='play' /></Signal>, <MentionSignal key={ 1 } />]
           }
         >
-          { lorem(6) }
+          { props.item.activity }
         </SignalField>
       }
       background={
         <span /> // Placeholder content
       }
+      hideBackground={ !props.showBackground }
       showBackgroundFrame={ true }
     />
   );
@@ -86,10 +105,31 @@ const ImageTile: React.StatelessComponent<IImageTileProps> = (props: IImageTileP
   );
 };
 
-export class TileMediaExample extends React.Component<{}, {}> {
+export interface ITileMediaExampleState {
+  imagesLoaded: boolean;
+}
+
+export class TileMediaExample extends React.Component<{}, ITileMediaExampleState> {
+  constructor() {
+    super();
+
+    this.state = {
+      imagesLoaded: true
+    };
+  }
+
   public render(): JSX.Element {
+    const {
+      imagesLoaded
+    } = this.state;
+
     return (
       <div>
+        <Checkbox
+          label='Show images as loaded'
+          checked={ imagesLoaded }
+          onChange={ this._onImagesLoadedChanged }
+        />
         <h3>Landscape</h3>
         <ImageTile
           tileSize={
@@ -98,12 +138,14 @@ export class TileMediaExample extends React.Component<{}, {}> {
               height: 200
             }
           }
+          item={ ITEMS[0] }
           originalImageSize={
             {
               width: 400,
               height: 300
             }
           }
+          showBackground={ imagesLoaded }
         />
         <h3>Portrait</h3>
         <ImageTile
@@ -113,12 +155,14 @@ export class TileMediaExample extends React.Component<{}, {}> {
               height: 250
             }
           }
+          item={ ITEMS[1] }
           originalImageSize={
             {
               width: 300,
               height: 400
             }
           }
+          showBackground={ imagesLoaded }
         />
         <h3>No preview</h3>
         <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
@@ -129,7 +173,7 @@ export class TileMediaExample extends React.Component<{}, {}> {
                   <NewSignal />
                 }
               >
-                { lorem(2) }
+                { ITEMS[2].name }
               </SignalField>
             }
             itemActivity={
@@ -142,7 +186,7 @@ export class TileMediaExample extends React.Component<{}, {}> {
                     ]
                   }
                 >
-                  { lorem(8) }
+                  { ITEMS[2].name }
                 </SignalField>
               )
             }
@@ -155,4 +199,11 @@ export class TileMediaExample extends React.Component<{}, {}> {
       </div>
     );
   }
+
+  @autobind
+  private _onImagesLoadedChanged(event: React.FormEvent<HTMLInputElement>, checked: boolean): void {
+    this.setState({
+      imagesLoaded: checked
+    });
+  }
 }
diff --git a/packages/experiments/src/components/signals/Signals.scss b/packages/experiments/src/components/signals/Signals.scss
index 91b8b6cf1d868..94a35b20183e3 100644
--- a/packages/experiments/src/components/signals/Signals.scss
+++ b/packages/experiments/src/components/signals/Signals.scss
@@ -85,6 +85,8 @@
 }
 
 .signal {
+  transition: color 0.2s linear;
+
   .dark &,
   .dark.selected {
     color: $ms-color-white;

From 88fce95c6a4369a57affdcd4f81bd4d060c39daf Mon Sep 17 00:00:00 2001
From: Max Vaysburd <max@angrykitten.com>
Date: Wed, 6 Sep 2017 16:10:08 -0700
Subject: [PATCH 0584/1641] Button icon states (#2758)

* Add expandedHovered state to button control.

* Add change file
---
 .../button_icon_states_2017-09-06-18-41.json          | 11 +++++++++++
 .../src/components/Button/BaseButton.classNames.ts    |  6 +++++-
 .../src/components/Button/Button.Props.ts             | 10 ++++++++++
 3 files changed, 26 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/button_icon_states_2017-09-06-18-41.json

diff --git a/common/changes/office-ui-fabric-react/button_icon_states_2017-09-06-18-41.json b/common/changes/office-ui-fabric-react/button_icon_states_2017-09-06-18-41.json
new file mode 100644
index 0000000000000..61c01f87793c6
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/button_icon_states_2017-09-06-18-41.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added rootExpandedHovered and iconExpandedHovered to IButtonStyles interface.  These entries are for specifying on hover style for expanded state.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "maxvay@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
index 3170717efe779..ba9210a8dac37 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
@@ -33,7 +33,11 @@ export const getClassNames = memoizeFunction((
       ],
       expanded && [
         'is-expanded',
-        styles.rootExpanded
+        styles.rootExpanded,
+        {
+          ':hover .ms-Button-icon': styles.iconExpandedHovered,
+          ':hover': styles.rootExpandedHovered
+        }
       ],
       disabled && [
         'is-disabled',
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
index 1007020062649..a5f932d12819c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
@@ -242,6 +242,11 @@ export interface IButtonStyles {
   */
   rootCheckedDisabled?: IStyle;
 
+  /**
+* Style override applied to the root on hover in a expanded state on hover
+*/
+  rootExpandedHovered?: IStyle;
+
   /**
    * Style for the flexbox container within the root element.
    */
@@ -267,6 +272,11 @@ export interface IButtonStyles {
    */
   iconExpanded?: IStyle;
 
+  /**
+ * Style for the icon on the near side of the label when expanded and hovered.
+ */
+  iconExpandedHovered?: IStyle;
+
   /**
    * Style override for the icon when the button is disabled.
    */

From 59db16443e9a9eb067736f2ce480be2bc23a0def Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Wed, 6 Sep 2017 18:05:58 -0700
Subject: [PATCH 0585/1641] Support auto-focus for TilesList [Experiments]
 (#2738)

* Support auto-focus for TilesList

* Update change output
---
 .../experiments/tiles-focus_2017-09-05-21-46.json | 11 +++++++++++
 .../src/components/TilesList/TilesList.Props.ts   | 11 ++++++++++-
 .../src/components/TilesList/TilesList.tsx        | 15 +++++++++++++++
 3 files changed, 36 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/experiments/tiles-focus_2017-09-05-21-46.json

diff --git a/common/changes/@uifabric/experiments/tiles-focus_2017-09-05-21-46.json b/common/changes/@uifabric/experiments/tiles-focus_2017-09-05-21-46.json
new file mode 100644
index 0000000000000..bc250784a7c47
--- /dev/null
+++ b/common/changes/@uifabric/experiments/tiles-focus_2017-09-05-21-46.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Support auto-focus for TilesList",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/TilesList/TilesList.Props.ts b/packages/experiments/src/components/TilesList/TilesList.Props.ts
index ab31035b628c5..ae414e2e30881 100644
--- a/packages/experiments/src/components/TilesList/TilesList.Props.ts
+++ b/packages/experiments/src/components/TilesList/TilesList.Props.ts
@@ -2,6 +2,7 @@
 import * as React from 'react';
 import { IBaseProps } from 'office-ui-fabric-react/lib/Utilities';
 import { TilesList } from './TilesList';
+import { IFocusZone } from 'office-ui-fabric-react/lib/FocusZone';
 
 export interface ITilesGridItem<TItem> {
   /**
@@ -82,7 +83,7 @@ export interface ITileSize {
   height: number;
 }
 
-export interface ITilesListProps<TItem> extends IBaseProps, React.HTMLAttributes<TilesList<TItem>> {
+export interface ITilesListProps<TItem> extends IBaseProps, React.Props<TilesList<TItem>>, React.HTMLAttributes<HTMLDivElement> {
   /**
    * An array of items to assign to the list.
    * This should be complete and not contain any holes.
@@ -94,4 +95,12 @@ export interface ITilesListProps<TItem> extends IBaseProps, React.HTMLAttributes
    * The desired number of content cells to render per page.
    */
   cellsPerPage?: number;
+  /**
+   * Component ref for the focus zone within the list. Use this to control auto-focus.
+   */
+  focusZoneComponentRef?: (focusZone: IFocusZone) => void;
+  /**
+   * Callback for when the active element within the list's FocusZone changes.
+   */
+  onActiveElementChanged?: (element: HTMLElement) => void;
 }
diff --git a/packages/experiments/src/components/TilesList/TilesList.tsx b/packages/experiments/src/components/TilesList/TilesList.tsx
index 0fb0f966ba42a..8ce5e44cb7614 100644
--- a/packages/experiments/src/components/TilesList/TilesList.tsx
+++ b/packages/experiments/src/components/TilesList/TilesList.tsx
@@ -95,9 +95,24 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
       cells
     } = this.state;
 
+    const {
+      className,
+      onActiveElementChanged,
+      items,
+      cellsPerPage,
+      ref,
+      focusZoneComponentRef,
+      ...divProps
+    } = this.props;
+
     return (
       <FocusZone
+        { ...divProps }
+        ref={ ref as ((element: FocusZone | null) => void) }
+        componentRef={ focusZoneComponentRef }
+        className={ css('ms-TilesList', className) }
         direction={ FocusZoneDirection.bidirectional }
+        onActiveElementChanged={ this.props.onActiveElementChanged }
       >
         <List
           items={ cells }

From 32afe85d347c6113de0bd06722212db4bb62b454 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Wed, 6 Sep 2017 23:03:18 -0700
Subject: [PATCH 0586/1641] Final pass fixing 'jsx-alignment' for tslint in
 Fabric pkg (#2753)

* Final pass fixing 'jsx-alignment' for tslint in Fabric pkg

* Final pass fixing 'jsx-alignment' for tslint in Fabric pkg

* Additional jsx alignment fixes
---
 .../MarqueeSelection/MarqueeSelectionPage.tsx |  3 ++-
 .../src/components/Pivot/PivotPage.tsx        |  3 ++-
 .../Pivot/examples/Pivot.Separate.Example.tsx |  6 +++--
 .../ProgressIndicatorPage.tsx                 |  3 ++-
 .../ProgressIndicator.Basic.Example.tsx       |  3 ++-
 .../src/components/Rating/Rating.test.tsx     |  6 ++---
 .../src/components/Rating/RatingPage.tsx      |  3 ++-
 .../examples/ResizeGroup.FlexBox.Example.tsx  |  3 ++-
 .../ResizeGroup.OverflowSet.Example.tsx       |  3 ++-
 .../ScrollablePane/ScrollablePanePage.tsx     |  3 ++-
 .../ScrollablePane.Default.Example.tsx        |  3 ++-
 .../components/SearchBox/SearchBoxPage.tsx    |  3 ++-
 .../src/components/Slider/SliderPage.tsx      |  3 ++-
 .../components/SpinButton/SpinButtonPage.tsx  | 21 ++++++++++-----
 .../src/components/Spinner/SpinnerPage.tsx    |  6 +++--
 .../SwatchColorPickerPage.tsx                 |  3 ++-
 .../SwatchColorPicker.Basic.Example.tsx       | 12 ++++++---
 .../components/TextField/TextFieldPage.tsx    |  3 ++-
 .../examples/TextField.Basic.Example.tsx      |  4 ++-
 .../src/components/Theme/ThemePage.tsx        |  3 ++-
 .../src/components/Toggle/Toggle.test.tsx     | 11 +++++---
 .../src/components/Toggle/TogglePage.tsx      |  3 ++-
 .../Toggle/TogglePage.visualtest.tsx          |  3 ++-
 .../examples/Tooltip.Overflow.Example.tsx     | 27 +++++++++++--------
 .../pickers/AutoFill/BaseAutoFill.test.tsx    | 21 ++++++++++-----
 .../SelectedItemWithMenu.tsx                  |  3 ++-
 .../pickers/PeoplePicker/PeoplePickerPage.tsx |  3 ++-
 .../examples/PeoplePicker.Types.Example.tsx   | 15 +++++++----
 .../src/utilities/selection/SelectionPage.tsx |  3 ++-
 .../selection/SelectionZone.test.tsx          |  3 ++-
 .../examples/Selection.Basic.Example.tsx      |  3 ++-
 packages/office-ui-fabric-react/tslint.json   |  3 +--
 32 files changed, 126 insertions(+), 69 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelectionPage.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelectionPage.tsx
index ee3b9d7d2cea6..e73ad4eabcd6b 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelectionPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelectionPage.tsx
@@ -38,7 +38,8 @@ export class MarqueeSelectionPage extends React.Component<IComponentDemoPageProp
             </p>
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx b/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx
index 6541fab6c0508..ef15ef93251f6 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx
@@ -116,7 +116,8 @@ export class PivotPage extends React.Component<IComponentDemoPageProps, {}> {
         related={
           <a href='https://dev.office.com/fabric-js/Components/Pivot/Pivot.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.Separate.Example.tsx b/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.Separate.Example.tsx
index 7736a8b36e1ce..419c123d60dc2 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.Separate.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.Separate.Example.tsx
@@ -18,12 +18,14 @@ export class PivotSeparateExample extends React.Component<any, any> {
             width: 100,
             height: this.state.selectedKey === 'squareRed' ? 100 : 200,
             background: this.state.selectedKey === 'rectangleGreen' ? 'green' : 'red'
-          } } />
+          } }
+        />
         <Pivot
           selectedKey={ this.state.selectedKey }
           onLinkClick={ this._handleLinkClick }
           headersOnly={ true }
-          getTabId={ this._getTabId }>
+          getTabId={ this._getTabId }
+        >
           <PivotItem linkText='Rectangle red' itemKey='rectangleRed' />
           <PivotItem linkText='Square red' itemKey='squareRed' />
           <PivotItem linkText='Rectangle green' itemKey='rectangleGreen' />
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx
index 48b98493e6626..26ec9f5bcb80d 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx
@@ -80,7 +80,8 @@ export class ProgressIndicatorPage extends React.Component<IComponentDemoPagePro
         related={
           <a href='https://dev.office.com/fabric-js/Components/ProgressIndicator/ProgressIndicator.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Basic.Example.tsx
index eb782259495e0..2a06d6bd0ee61 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Basic.Example.tsx
@@ -43,7 +43,8 @@ export class ProgressIndicatorBasicExample extends React.Component<any, IProgres
       <ProgressIndicator
         label='Example title'
         description='Example description'
-        percentComplete={ percentComplete } />
+        percentComplete={ percentComplete }
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx b/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
index 76aa99ffecca3..351fdef2f0d9e 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
@@ -18,7 +18,7 @@ describe('Rating', () => {
       rating = ReactTestUtils.renderIntoDocument<Rating>(
         <Rating
           rating={ 2 }
-          />
+        />
       );
     } catch (e) {
       exception = e;
@@ -59,7 +59,7 @@ describe('Rating', () => {
       rating = ReactTestUtils.renderIntoDocument<Rating>(
         <Rating
           rating={ 10 }
-          />
+        />
       );
     } catch (e) {
       exception = e;
@@ -86,7 +86,7 @@ describe('Rating', () => {
       choiceGroup = ReactTestUtils.renderIntoDocument<Rating>(
         <Rating
           disabled={ true }
-          />
+        />
       );
     } catch (e) {
       exception = e;
diff --git a/packages/office-ui-fabric-react/src/components/Rating/RatingPage.tsx b/packages/office-ui-fabric-react/src/components/Rating/RatingPage.tsx
index 41ded11f8c3d7..6bad227164bc0 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/RatingPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/RatingPage.tsx
@@ -51,7 +51,8 @@ export class RatingPage extends React.Component<IComponentDemoPageProps, {}> {
             </ul>
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx
index 938ee1b0e9d36..b7bb50389f514 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx
@@ -44,7 +44,8 @@ function renderBoxWithLabels(count: number, backgroundColor: string): JSX.Elemen
     result.push(<BoxWithLabel
       label={ `${i}` }
       backgroundColor={ backgroundColor }
-      key={ `${backgroundColor}-${i}` } />);
+      key={ `${backgroundColor}-${i}` }
+    />);
   }
   return result;
 }
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
index fbb687254813b..e409a826664a4 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
@@ -120,7 +120,8 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<{}, IResizeGrou
                 { key: '50', text: '50' },
                 { key: '75', text: '75' },
                 { key: '100', text: '100' },
-                { key: '200', text: '200' }] } />
+                { key: '200', text: '200' }] }
+            />
           </div>
         </div>
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
index d4fb4e24c8449..e1bd9eee8080a 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
@@ -61,7 +61,8 @@ export class ScrollablePanePage extends React.Component<IComponentDemoPageProps,
             </ul>
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx
index 0bb74ec723dfe..29174059cae19 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx
@@ -42,7 +42,8 @@ export class ScrollablePaneDefaultExample extends React.Component<any, any> {
       <div key={ index }>
         <Sticky
           stickyPosition={ StickyPositionType.Both }
-          stickyClassName='largeFont'>
+          stickyClassName='largeFont'
+        >
           <div className='sticky' style={ style }>
             Sticky Component #{ index + 1 }
           </div>
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
index e0500d8bd7a56..3b9b112f3be22 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
@@ -120,7 +120,8 @@ export class SearchBoxPage extends React.Component<IComponentDemoPageProps, {}>
         related={
           <a href='https://dev.office.com/fabric-js/Components/SearchBox/SearchBox.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Slider/SliderPage.tsx b/packages/office-ui-fabric-react/src/components/Slider/SliderPage.tsx
index 2490fd4bb8bca..4fd4bed12631d 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/SliderPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/SliderPage.tsx
@@ -61,7 +61,8 @@ export class SliderPage extends React.Component<IComponentDemoPageProps, {}> {
             </ul>
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
index a920ebf0ce916..0ca315ff15959 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
@@ -29,32 +29,38 @@ export class SpinButtonPage extends React.Component<IComponentDemoPageProps, {}>
           <div>
             <ExampleCard
               title={ 'Basic SpinButton' }
-              code={ SpinButtonBasicExampleCode }>
+              code={ SpinButtonBasicExampleCode }
+            >
               <SpinButtonBasicExample />
             </ExampleCard>
             <ExampleCard
               title={ 'Basic Disabled SpinButton' }
-              code={ SpinButtonBasicDisabledExampleCode }>
+              code={ SpinButtonBasicDisabledExampleCode }
+            >
               <SpinButtonBasicDisabledExample />
             </ExampleCard>
             <ExampleCard
               title={ 'Stateful SpinButton' }
-              code={ SpinButtonBasicExampleCode }>
+              code={ SpinButtonBasicExampleCode }
+            >
               <SpinButtonStatefulExample />
             </ExampleCard>
             <ExampleCard
               title={ 'Basic SpinButton With Icon' }
-              code={ SpinButtonBasicWithIconExampleCode }>
+              code={ SpinButtonBasicWithIconExampleCode }
+            >
               <SpinButtonBasicWithIconExample />
             </ExampleCard>
             <ExampleCard
               title={ 'Basic SpinButton With Icon and Positioned at the End' }
-              code={ SpinButtonBasicWithEndPositionExampleCode }>
+              code={ SpinButtonBasicWithEndPositionExampleCode }
+            >
               <SpinButtonBasicWithEndPositionExample />
             </ExampleCard>
             <ExampleCard
               title={ 'Custom Styled SpinButton' }
-              code={ SpinButtonCustomStyledExampleCode }>
+              code={ SpinButtonCustomStyledExampleCode }
+            >
               <SpinButtonCustomStyledExample />
             </ExampleCard>
 
@@ -98,7 +104,8 @@ export class SpinButtonPage extends React.Component<IComponentDemoPageProps, {}>
         related={
           <a href='https://dev.office.com/fabric-js/Components/SpinButton/SpinButton.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/SpinnerPage.tsx b/packages/office-ui-fabric-react/src/components/Spinner/SpinnerPage.tsx
index 11ed3e40fd2d7..b1f1058bdefd8 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/SpinnerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Spinner/SpinnerPage.tsx
@@ -18,7 +18,8 @@ export class SpinnerPage extends React.Component<IComponentDemoPageProps, {}> {
         exampleCards={
           <ExampleCard
             title='Various Spinner Types'
-            code={ SpinnerBasicExampleCode }>
+            code={ SpinnerBasicExampleCode }
+          >
             <SpinnerBasicExample />
           </ExampleCard>
         }
@@ -61,7 +62,8 @@ export class SpinnerPage extends React.Component<IComponentDemoPageProps, {}> {
         related={
           <a href='https://dev.office.com/fabric-js/Components/Spinner/Spinner.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx
index db248d82ee604..ce73b3a58ec0e 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx
@@ -52,7 +52,8 @@ export class SwatchColorPickerPage extends React.Component<IComponentDemoPagePro
         related={
           <a href='https://dev.office.com/fabric-js/Components/SwatchColorPicker/SwatchColorPicker.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
index 981bc80887b0a..3ee6ae1ae90fe 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
@@ -33,7 +33,8 @@ export class SwatchColorPickerBasicExample extends React.Component<any, IBasicSw
               { id: 'c', label: 'blue', color: '#0000ff' },
               { id: 'd', label: 'red', color: '#ff0000' }
             ]
-          } />
+          }
+        />
         <div>Simple square swatch color picker:</div>
         <SwatchColorPicker
           columnCount={ 4 }
@@ -45,7 +46,8 @@ export class SwatchColorPickerBasicExample extends React.Component<any, IBasicSw
               { id: 'c', label: 'blue', color: '#0000ff' },
               { id: 'd', label: 'red', color: '#ff0000' }
             ]
-          } />
+          }
+        />
         <div>Simple swatch color picker with multiple rows that updates it's icon color and shows a preview color:</div>
         <div style={ { color: this.state.previewColor ? this.state.previewColor : this.state.color ? this.state.color : null, fontSize: '24px' } } >Sample Text</div>
         <SwatchColorPicker
@@ -70,7 +72,8 @@ export class SwatchColorPickerBasicExample extends React.Component<any, IBasicSw
               { id: 'n', label: 'yellow', color: 'yellow' }
 
             ]
-          } />
+          }
+        />
         <div>Simple disabled circle swatch color picker:</div>
         <SwatchColorPicker
           disabled={ true }
@@ -83,7 +86,8 @@ export class SwatchColorPickerBasicExample extends React.Component<any, IBasicSw
               { id: 'c', label: 'blue', color: '#0000ff' },
               { id: 'd', label: 'red', color: '#ff0000' }
             ]
-          } />
+          }
+        />
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
index b6e316ce98873..b97b598e3f901 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
@@ -76,7 +76,8 @@ export class TextFieldPage extends React.Component<IComponentDemoPageProps, {}>
         related={
           <a href='https://dev.office.com/fabric-js/Components/TextField/TextField.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
index fb14814e5ef94..44358fbbb2544 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
@@ -8,7 +8,9 @@ export class TextFieldBasicExample extends React.Component<any, any> {
     return (
       <div>
         <TextField
-          label='Default TextField' onChanged={ this._onChanged } />
+          label='Default TextField'
+          onChanged={ this._onChanged }
+        />
         <TextField label='Disabled TextField' disabled={ true } placeholder='Placeholder text' />
         <TextField label='Required TextField' required={ true } />
         <TextField label='TextField with a placeholder' placeholder='Now I am a Placeholder' ariaLabel='Please enter text here' />
diff --git a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
index b4af8e828feed..bca395975b390 100644
--- a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
@@ -86,7 +86,8 @@ export class ThemePage extends React.Component<any, any> {
               isBeakVisible={ false }
               gapSpace={ 10 }
               targetElement={ colorPickerProps.targetElement }
-              onDismiss={ this._onPickerDismiss }>
+              onDismiss={ this._onPickerDismiss }
+            >
 
               <ColorPicker
                 color={ colorPickerProps.value }
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
index c470125009a67..fb9e16d6b9152 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
@@ -94,10 +94,13 @@ describe('Toggle', () => {
     const onSubmit = sinon.spy();
 
     const wrapper = mount(
-      <form action='#' onSubmit={ (e) => {
-        onSubmit();
-        e.preventDefault();
-      } }>
+      <form
+        action='#'
+        onSubmit={ (e) => {
+          onSubmit();
+          e.preventDefault();
+        } }
+      >
         <Toggle
           componentRef={ ref => component = ref }
           label='Label'
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
index 6be030a3240b7..53b20931dd719 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
@@ -69,7 +69,8 @@ export class TogglePage extends React.Component<IComponentDemoPageProps, {}> {
         related={
           <a href='https://dev.office.com/fabric-js/Components/Toggle/Toggle.html'>Fabric JS</a>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.visualtest.tsx
index ee97289523d0f..24329c93036e8 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.visualtest.tsx
@@ -12,7 +12,8 @@ export default class ToggleVPage extends React.Component<any, any> {
         onAriaLabel='This toggle is checked. Press to uncheck.'
         offAriaLabel='This toggle is unchecked. Press to check.'
         onText='On'
-        offText='Off' />
+        offText='Off'
+      />
     </div>;
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/examples/Tooltip.Overflow.Example.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/examples/Tooltip.Overflow.Example.tsx
index 8b5835fb47220..94d59f0839a8d 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/examples/Tooltip.Overflow.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/examples/Tooltip.Overflow.Example.tsx
@@ -30,21 +30,26 @@ export class TooltipOverflowExample extends BaseComponent<{}, ITooltipOverflowEx
       <div>
         <DefaultButton onClick={ () => this.setState({ overflow: !this.state.overflow }) }>Toggle showing overflow</DefaultButton>
 
-        <div style={ {
-          marginTop: '40px'
-        } }>
-          <div style={ {
-            overflow: 'hidden',
-            textOverflow: 'ellipsis',
-            whiteSpace: this.state.overflow && 'nowrap',
-            width: this.state.overflow && '200px',
-            border: '1px solid black'
-          } }>
+        <div
+          style={ {
+            marginTop: '40px'
+          } }
+        >
+          <div
+            style={ {
+              overflow: 'hidden',
+              textOverflow: 'ellipsis',
+              whiteSpace: this.state.overflow && 'nowrap',
+              width: this.state.overflow && '200px',
+              border: '1px solid black'
+            } }
+          >
             <TooltipHost
               content='This is the tooltip'
               id={ this.tooltipId }
               overflowMode={ TooltipOverflowMode.Parent }
-              onTooltipToggle={ isTooltipVisible => this.setState({ isTooltipVisible }) }>
+              onTooltipToggle={ isTooltipVisible => this.setState({ isTooltipVisible }) }
+            >
               <span aria-describedby={ this.state.isTooltipVisible ? this.tooltipId : undefined }>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec volutpat lectus ut magna sodales, sit amet accumsan arcu accumsan. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</span>
             </TooltipHost>
           </div>
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.test.tsx b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.test.tsx
index 58081b001ee28..3a1e406ab5af0 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.test.tsx
@@ -18,7 +18,8 @@ describe('BaseAutoFill', () => {
     let component = ReactDOM.render(
       <BaseAutoFill
         ref={ (c) => autoFill = c! }
-        suggestedDisplayValue='hello' />,
+        suggestedDisplayValue='hello'
+      />,
       baseNode
     );
     autoFillInput = ReactDOM.findDOMNode(component as React.ReactInstance) as HTMLInputElement;
@@ -35,7 +36,8 @@ describe('BaseAutoFill', () => {
             done();
           }
         }
-        suggestedDisplayValue='hello' />,
+        suggestedDisplayValue='hello'
+      />,
       baseNode
     );
     autoFillInput.value = 'hel';
@@ -50,7 +52,8 @@ describe('BaseAutoFill', () => {
             done();
           }
         }
-        suggestedDisplayValue='hello' />, baseNode);
+        suggestedDisplayValue='hello'
+      />, baseNode);
     assert(autoFill.inputElement.value === 'hello');
 
   });
@@ -69,7 +72,8 @@ describe('BaseAutoFill', () => {
             done();
           }
         }
-        suggestedDisplayValue='hello' />,
+        suggestedDisplayValue='hello'
+      />,
       baseNode
     );
     ReactTestUtils.Simulate.change(autoFillInput);
@@ -82,7 +86,8 @@ describe('BaseAutoFill', () => {
     ReactDOM.render(
       <BaseAutoFill
         ref={ (c) => autoFill = c! }
-        suggestedDisplayValue='hello' />,
+        suggestedDisplayValue='hello'
+      />,
       baseNode
     );
 
@@ -105,7 +110,8 @@ describe('BaseAutoFill', () => {
     ReactDOM.render(
       <BaseAutoFill
         ref={ (c) => autoFill = c! }
-        suggestedDisplayValue='hello' />,
+        suggestedDisplayValue='hello'
+      />,
       baseNode
     );
 
@@ -123,7 +129,8 @@ describe('BaseAutoFill', () => {
     ReactDOM.render(
       <BaseAutoFill
         ref={ (c) => autoFill = c! }
-        suggestedDisplayValue='hello' />,
+        suggestedDisplayValue='hello'
+      />,
       baseNode
     );
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
index 6b5e125b39aad..4f9229871c827 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
@@ -59,7 +59,8 @@ export class SelectedItemWithMenu extends BaseComponent<IPeoplePickerItemWithMen
               shouldFocusOnMount={ true }
               targetElement={ this.refs.ellipsisRef }
               onDismiss={ this._onCloseContextualMenu }
-              directionalHint={ DirectionalHint.bottomAutoEdge } />)
+              directionalHint={ DirectionalHint.bottomAutoEdge }
+            />)
             : null }
         </FocusZone>
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerPage.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerPage.tsx
index 2d0800b186bf2..e7541d08c8954 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerPage.tsx
@@ -61,7 +61,8 @@ export class PeoplePickerPage extends React.Component<IComponentDemoPageProps, {
               <li>Use the PeoplePicker without sufficient space</li>
             </ul>
           </div>
-        }>
+        }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index ee13a14a75baf..8abf154972261 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -103,7 +103,8 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
       <div>
         { currentPicker }
         <div className={ 'dropdown-div' }>
-          <Dropdown label='Select People Picker Type'
+          <Dropdown
+            label='Select People Picker Type'
             options={ [
               { key: 1, text: 'Normal' },
               { key: 2, text: 'Compact' },
@@ -119,11 +120,13 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
           <Toggle
             label='Delay Suggestion Results'
             defaultChecked={ false }
-            onChanged={ this._toggleDelayResultsChange } />
+            onChanged={ this._toggleDelayResultsChange }
+          />
         </div>
         <PrimaryButton
           text='Set focus'
-          onClick={ this._onSetFocusButtonClicked } />
+          onClick={ this._onSetFocusButtonClicked }
+        />
       </div>
     );
   }
@@ -283,12 +286,14 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
         />
         <label> Click to Add a person </label>
         { controlledItems.map(item => <div>
-          <DefaultButton className='controlledPickerButton'
+          <DefaultButton
+            className='controlledPickerButton'
             onClick={ () => {
               this.setState({
                 currentSelectedItems: this.state.currentSelectedItems!.concat([item])
               });
-            } }>
+            } }
+          >
             <Persona { ...item} />
           </DefaultButton>
         </div>) }
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionPage.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionPage.tsx
index 14f167f7809ee..5b16aa1bc711c 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionPage.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionPage.tsx
@@ -53,7 +53,8 @@ export class SelectionPage extends React.Component<IComponentDemoPageProps, {}>
             </ul>
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      >
       </ComponentPage>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
index a07ca5f841d67..da8b22ea6986d 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
@@ -35,7 +35,8 @@ function _initializeSelection(selectionMode = SelectionMode.multiple) {
     <SelectionZone
       selection={ _selection }
       selectionMode={ selectionMode }
-      onItemInvoked={ (item) => { _onItemInvokeCalled++; _lastItemInvoked = item; } }>
+      onItemInvoked={ (item) => { _onItemInvokeCalled++; _lastItemInvoked = item; } }
+    >
 
       <button id='toggleAll' data-selection-all-toggle={ true }>Toggle all selected</button>
 
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx b/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
index 4f7df1d3662e4..1793511e32ed1 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
@@ -95,7 +95,8 @@ export class SelectionBasicExample extends React.Component<any, ISelectionBasicE
         <MarqueeSelection selection={ selection } isEnabled={ selection.mode === SelectionMode.multiple } >
           <SelectionZone
             selection={ selection }
-            onItemInvoked={ (item) => alert('item invoked: ' + item.name) }>
+            onItemInvoked={ (item) => alert('item invoked: ' + item.name) }
+          >
             { items.map((item, index) => (
               <SelectionItemExample
                 ref={ 'detailsGroup_' + index }
diff --git a/packages/office-ui-fabric-react/tslint.json b/packages/office-ui-fabric-react/tslint.json
index 7d0ae3b7798f4..8c8f4aa94550f 100644
--- a/packages/office-ui-fabric-react/tslint.json
+++ b/packages/office-ui-fabric-react/tslint.json
@@ -8,7 +8,6 @@
     "jsx-boolean-value": false,
     "no-unused-variable": false,
     "jsx-no-multiline-js": false,
-    "jsx-alignment": false,
     "jsx-wrap-multiline": false,
     "jsx-self-close": false,
     "jsx-no-lambda": false,
@@ -28,4 +27,4 @@
       false
     ]
   }
-}
+}
\ No newline at end of file

From 4cccb7c2915e5478dbc94205efb9f3e38bcaee94 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Wed, 6 Sep 2017 23:04:45 -0700
Subject: [PATCH 0587/1641] Final pass removing unused variables from Fabric
 pkg (#2755)

* Final pass removing unused variables from Fabric pkg

* Final pass removing unused variables from Fabric pkg

* Removed additional unused variables
---
 .../examples/ChoiceGroup.Image.Example.tsx    |  1 -
 .../src/components/ComboBox/ComboBox.tsx      |  1 -
 .../ContextualMenu/ContextualMenu.tsx         | 27 -------------------
 .../components/DetailsList/DetailsHeader.tsx  |  2 --
 .../src/components/Link/Link.tsx              |  5 ----
 .../List/examples/List.Basic.Example.tsx      |  5 +---
 .../Modal/examples/Modal.Basic.Example.tsx    |  3 +--
 .../OverflowSet/OverflowSet.test.tsx          |  4 +--
 .../OverflowSet/OverflowSetPage.tsx           |  1 -
 .../examples/Persona.Basic.Example.tsx        |  1 -
 .../examples/Persona.CustomRender.Example.tsx |  5 +---
 .../Pivot/examples/Pivot.Separate.Example.tsx |  2 --
 .../ResizeGroup/ResizeGroup.test.tsx          |  3 ---
 .../ResizeGroup/ResizeGroupPage.tsx           |  1 -
 .../examples/ResizeGroup.FlexBox.Example.tsx  |  2 +-
 .../ResizeGroup.OverflowSet.Example.tsx       |  2 +-
 .../ScrollablePane/ScrollablePane.tsx         |  3 +--
 .../src/components/Slider/Slider.test.tsx     |  2 +-
 .../components/SpinButton/SpinButton.test.tsx |  5 ----
 .../components/SpinButton/SpinButtonPage.tsx  |  1 -
 .../examples/SpinButton.Stateful.Example.tsx  |  2 +-
 .../src/components/Sticky/Sticky.tsx          |  1 -
 .../SwatchColorPicker.test.tsx                |  4 ---
 .../SwatchColorPicker/SwatchColorPicker.tsx   | 13 ---------
 .../SwatchColorPicker.Basic.Example.tsx       |  3 ---
 .../components/TextField/TextField.test.tsx   |  2 +-
 .../examples/TextField.Basic.Example.tsx      |  1 -
 .../src/components/Theme/ThemePage.tsx        |  2 +-
 .../examples/Tooltip.Overflow.Example.tsx     |  2 +-
 .../components/pickers/BasePicker.test.tsx    |  5 ++--
 .../examples/PeoplePicker.Types.Example.tsx   |  3 +--
 .../pickers/Suggestions/Suggestions.tsx       |  1 -
 .../examples/Picker.CustomResult.Example.tsx  |  8 +-----
 .../examples/Selection.Basic.Example.tsx      |  4 +--
 packages/office-ui-fabric-react/tslint.json   |  1 -
 35 files changed, 19 insertions(+), 109 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Image.Example.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Image.Example.tsx
index a235f735c8b05..b73fbadc9592a 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Image.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Image.Example.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import { ChoiceGroup, IChoiceGroupOption } from 'office-ui-fabric-react/lib/ChoiceGroup';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { TestImages } from '../../../common/TestImages';
 
 /**
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 5a9fb80343e71..690ca9b6463b2 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -784,7 +784,6 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     } = this.props;
 
     let id = this._id;
-    let { selectedIndex } = this.state;
 
     return (
       <div
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index ad3b36754033f..99695e7f0498a 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -36,33 +36,6 @@ export interface IContextualMenuState {
   submenuDirection?: DirectionalHint;
 }
 
-enum ContextualMenuType {
-  vertical,
-  horizontal
-}
-
-enum HorizontalAlignmentHint {
-  auto,
-  left,
-  center,
-  right
-}
-
-enum VerticalAlignmentHint {
-  top,
-  center,
-  bottom
-}
-
-interface IRect {
-  left: number;
-  top: number;
-  right: number;
-  bottom: number;
-  width: number;
-  height: number;
-}
-
 export function hasSubmenuItems(item: IContextualMenuItem) {
   let submenuItems = getSubmenuItems(item);
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index d51341e9479df..15c873a31b80e 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -218,8 +218,6 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
         { GroupSpacer({ count: groupNestingDepth! - 1 }) }
         {
           columns.map((column: IColumn, columnIndex: number) => {
-            const previousColumnIndex = columnIndex - 1;
-
             return (
               [
                 <div
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.tsx b/packages/office-ui-fabric-react/src/components/Link/Link.tsx
index 473eb8361ae76..4dc25e04b5064 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.tsx
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.tsx
@@ -11,11 +11,6 @@ import { ILink, ILinkProps } from './Link.Props';
 import * as stylesImport from './Link.scss';
 const styles: any = stylesImport;
 
-interface IMyScreen extends Screen {
-  left: number;
-  top: number;
-}
-
 export class Link extends BaseComponent<ILinkProps, any> implements ILink {
   private _link: HTMLElement;
 
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx
index 268b203c8eb37..2095b9cb16326 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx
@@ -1,8 +1,5 @@
 import * as React from 'react';
-import {
-  css,
-  getRTL
-} from 'office-ui-fabric-react/lib/Utilities';
+import { getRTL } from 'office-ui-fabric-react/lib/Utilities';
 import { FocusZone, FocusZoneDirection } from 'office-ui-fabric-react/lib/FocusZone';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
 import { Image, ImageFit } from 'office-ui-fabric-react/lib/Image';
diff --git a/packages/office-ui-fabric-react/src/components/Modal/examples/Modal.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Modal/examples/Modal.Basic.Example.tsx
index 731c129918c6e..d6c35096a3c8c 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/examples/Modal.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Modal/examples/Modal.Basic.Example.tsx
@@ -1,8 +1,7 @@
 import * as React from 'react';
 import { autobind } from '../../../Utilities';
 import { Modal } from 'office-ui-fabric-react/lib/Modal';
-import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
-import { ChoiceGroup } from 'office-ui-fabric-react/lib/ChoiceGroup';
+import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import './Modal.Basic.Example.scss';
 
 export class ModalBasicExample extends React.Component<any, any> {
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.test.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.test.tsx
index 090e2162578d3..632b6eb3c39af 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.test.tsx
@@ -8,7 +8,7 @@ describe('OverflowSet', () => {
   it('does not render overflow when there are no overflow items', () => {
     const onRenderItem = sinon.spy();
     const onRenderOverflowButton = sinon.spy();
-    const wrapper = shallow(<OverflowSet onRenderItem={ onRenderItem } onRenderOverflowButton={ onRenderOverflowButton } />);
+    shallow(<OverflowSet onRenderItem={ onRenderItem } onRenderOverflowButton={ onRenderOverflowButton } />);
 
     expect(onRenderOverflowButton.called).to.equal(false);
   });
@@ -16,7 +16,7 @@ describe('OverflowSet', () => {
   it('does not render overflow when overflow items is an empty array', () => {
     const onRenderItem = sinon.spy();
     const onRenderOverflowButton = sinon.spy();
-    const wrapper = shallow(<OverflowSet onRenderItem={ onRenderItem } onRenderOverflowButton={ onRenderOverflowButton } overflowItems={ [] } />);
+    shallow(<OverflowSet onRenderItem={ onRenderItem } onRenderOverflowButton={ onRenderOverflowButton } overflowItems={ [] } />);
 
     expect(onRenderOverflowButton.called).to.equal(false);
   });
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSetPage.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSetPage.tsx
index 16b0f8f653fcf..42b0a30fc028e 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSetPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSetPage.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { Link } from 'office-ui-fabric-react/lib/Link';
 import { LayerHost } from 'office-ui-fabric-react/lib/Layer';
 import {
   ExampleCard,
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
index 3f8611d50c594..bc82072c81efb 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
@@ -5,7 +5,6 @@ import {
   PersonaPresence
 } from 'office-ui-fabric-react/lib/Persona';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
-import { Label } from 'office-ui-fabric-react/lib/Label';
 import { TestImages } from '../../../common/TestImages';
 
 const examplePersona = {
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx
index fbc10bbc233df..d9df0bc788a30 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx
@@ -1,8 +1,5 @@
 import * as React from 'react';
-import {
-  autobind,
-  css
-} from 'office-ui-fabric-react/lib/Utilities';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import {
   IPersonaProps,
   Persona,
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.Separate.Example.tsx b/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.Separate.Example.tsx
index 419c123d60dc2..dca3616205a32 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.Separate.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.Separate.Example.tsx
@@ -1,6 +1,4 @@
 import * as React from 'react';
-import { Label } from 'office-ui-fabric-react/lib/Label';
-import { Button } from 'office-ui-fabric-react/lib/Button';
 import { Pivot, PivotItem } from 'office-ui-fabric-react/lib/Pivot';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
index 26fc8c4ac144d..f90fb812a9634 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import * as ReactDOM from 'react-dom';
 import { shallow } from 'enzyme';
 const { expect } = chai;
 import { ResizeGroup, IResizeGroupState, getNextResizeGroupStateProvider, getMeasurementCache } from './ResizeGroup';
@@ -241,9 +240,7 @@ describe('ResizeGroup', () => {
     });
 
     it('does not crash when the container size is set and there is no dataToMeasure', () => {
-      const dataToMeasure = { foo: 'bar' };
       const resizeGroupProps = getRequiredResizeGroupProps();
-      const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'shrink', };
       const getNextResizeGroupState = getNextResizeGroupStateProvider().getNextState;
       const getMeasuredElementWidthStub = sinon.stub();
 
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
index c833bb8fa6e05..f10a66f09cf63 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { Link } from 'office-ui-fabric-react/lib/Link';
 import { LayerHost } from 'office-ui-fabric-react/lib/Layer';
 import {
   ExampleCard,
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx
index b7bb50389f514..30fd589a4d30c 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { BaseComponent, memoizeFunction } from 'office-ui-fabric-react/lib/Utilities';
-import { mergeStyles, IStyle } from 'office-ui-fabric-react/lib/Styling';
+import { mergeStyles } from 'office-ui-fabric-react/lib/Styling';
 import { ResizeGroup } from 'office-ui-fabric-react/lib/ResizeGroup';
 
 const leftRightBoxClassName =
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
index e409a826664a4..00009f37a81bf 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { BaseComponent, autobind } from 'office-ui-fabric-react/lib/Utilities';
-import { DefaultButton, PrimaryButton } from 'office-ui-fabric-react/lib/Button';
+import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { ResizeGroup } from 'office-ui-fabric-react/lib/ResizeGroup';
 import { OverflowSet } from '../../OverflowSet';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
index 734dc221f015b..ec5ccdf7cb3da 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
@@ -55,7 +55,7 @@ export class ScrollablePane extends BaseComponent<IScrollablePaneProps, {}> {
   }
 
   public componentDidMount() {
-    const { root, stickyContainer, stickyAbove, stickyBelow } = this.refs;
+    const { root, stickyContainer } = this.refs;
 
     this._events.on(root, 'scroll', this.notifySubscribers);
     this._events.on(window, 'resize', this._onWindowResize);
@@ -174,7 +174,6 @@ export class ScrollablePane extends BaseComponent<IScrollablePaneProps, {}> {
   }
 
   private _onWindowResize() {
-    const { stickyAbove, stickyBelow } = this.refs;
     setTimeout(() => {
       this._resizeContainer();
       this.notifySubscribers();
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
index 0359a3dbb2b25..41cbd12b8a69a 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
@@ -83,7 +83,7 @@ describe('Slider', () => {
   it('can read the current value', () => {
     let slider: ISlider | undefined;
 
-    let component = ReactTestUtils.renderIntoDocument(
+    ReactTestUtils.renderIntoDocument(
       <Slider label='slider' defaultValue={ 12 } min={ 0 } max={ 100 } componentRef={ s => slider = s } />
     );
     expect(slider!.value).equals(12);
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
index 55d284f31b3e6..1f175db962334 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
@@ -512,7 +512,6 @@ describe('SpinButton', () => {
     const exampleLabelValue: string = 'SpinButton';
     const exampleMinValue: number = 2;
     const exampleMaxValue: number = 22;
-    const exampleDefaultValue: string = '12';
     const exampleStepValue: number = 2;
 
     const renderedDOM: HTMLElement = renderIntoDocument(
@@ -535,8 +534,6 @@ describe('SpinButton', () => {
 
   it('should use 0 as defaultvalue if neither value, defaultValue nor min are passed', () => {
     const exampleLabelValue: string = 'SpinButton';
-    const exampleDefaultValue: string = '12';
-    const exampleStepValue: number = 2;
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <SpinButton
@@ -553,8 +550,6 @@ describe('SpinButton', () => {
 
   it('should use the default onIncrement function when no value, defaultValue nor onIncrement function is passed', () => {
     const exampleLabelValue: string = 'SpinButton';
-    const exampleDefaultValue: string = '12';
-    const exampleStepValue: number = 2;
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <SpinButton
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
index 0ca315ff15959..0d8604b439057 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
@@ -14,7 +14,6 @@ import { SpinButtonCustomStyledExample } from './examples/SpinButton.CustomStyle
 
 const SpinButtonBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx') as string;
 const SpinButtonBasicDisabledExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicDisabled.Example.tsx') as string;
-const SpinButtonStatefulExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx') as string;
 const SpinButtonBasicWithIconExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx') as string;
 const SpinButtonBasicWithEndPositionExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithEndPosition.Example.tsx') as string;
 const SpinButtonCustomStyledExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.CustomStyled.Example.tsx') as string;
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
index 410464d8982ee..ed1f84cd0a063 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { SpinButton, ISpinButtonState, ISpinButtonProps } from 'office-ui-fabric-react/lib/SpinButton';
+import { SpinButton } from 'office-ui-fabric-react/lib/SpinButton';
 
 export class SpinButtonStatefulExample extends React.Component<any, any> {
   public render() {
diff --git a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
index fc1fe2a3de1ba..646b4d04c6516 100644
--- a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
+++ b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
@@ -9,7 +9,6 @@ import {
   autobind
 } from '../../Utilities';
 import { IStickyProps, StickyPositionType } from './Sticky.Props';
-import * as stylesImport from './Sticky.scss';
 
 export interface IStickyState {
   isStickyTop: boolean;
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
index 92dd14a9d2022..ce10c9b6a91c8 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
@@ -48,10 +48,6 @@ describe('SwatchColorPicker', () => {
     let tableElements = container.querySelectorAll('table[role="grid"]');
     let tableRowElements = container.querySelectorAll('tr[role="row"]');
     let tableCellElements = container.querySelectorAll('button[role="gridcell"]');
-    let headingElements = container.querySelectorAll('[role="heading"]');
-    let dividerElements = container.querySelectorAll('[role="separator"]');
-    let menuitems = container.querySelectorAll('button[role="menuitem"]');
-    let buttons = container.querySelectorAll('button[role="button"]');
     let setSizeElements = container.querySelectorAll('[aria-setsize]');
     let posInSetElements = container.querySelectorAll('[aria-posinset]');
 
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
index bf4ebf038216b..c5075ae685cd2 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
@@ -208,17 +208,4 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
       });
     }
   }
-
-  /**
-   * Clear the colors by calling the given callbacks
-   * @param callbacks - The callbacks to handle the clear operation
-   */
-  // tsline:disable-next-line:no-unused-variable
-  private _clearColors(callbacks: ((id?: string, color?: string) => void)[]) {
-    callbacks.forEach((callback) => {
-      if (callback) {
-        callback();
-      }
-    });
-  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
index 3ee6ae1ae90fe..f87a56d92d630 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
@@ -7,9 +7,6 @@ export interface IBasicSwatchColorPickerExampleState {
 }
 
 export class SwatchColorPickerBasicExample extends React.Component<any, IBasicSwatchColorPickerExampleState> {
-
-  private width: number = 4;
-
   constructor(props: any) {
     super(props);
 
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
index 4815399c51dd6..f049e5f9a43d4 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
@@ -357,7 +357,7 @@ describe('TextField', () => {
       expect(selectedText).to.equal(initialValue);
     };
 
-    const renderedDOM: HTMLElement = renderIntoDocument(
+    renderIntoDocument(
       <TextField
         ref={ (t) => textField = t! }
         defaultValue={ initialValue }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
index 44358fbbb2544..d3bb020884993 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
-import { Icon } from 'office-ui-fabric-react/lib/Icon';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 
 export class TextFieldBasicExample extends React.Component<any, any> {
diff --git a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
index bca395975b390..912a820ddbbc0 100644
--- a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { loadTheme, FontClassNames, ITheme, IPalette } from 'office-ui-fabric-react/lib/Styling';
+import { loadTheme, FontClassNames, IPalette } from 'office-ui-fabric-react/lib/Styling';
 import { Highlight } from '@uifabric/example-app-base';
 import { defaultTheme } from './defaultTheme';
 import { Callout } from 'office-ui-fabric-react/lib/Callout';
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/examples/Tooltip.Overflow.Example.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/examples/Tooltip.Overflow.Example.tsx
index 94d59f0839a8d..36e8402bdd334 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/examples/Tooltip.Overflow.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/examples/Tooltip.Overflow.Example.tsx
@@ -1,7 +1,7 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
-import { BaseComponent, css, getId } from 'office-ui-fabric-react/lib/Utilities';
+import { BaseComponent, getId } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import {
   TooltipHost,
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
index 05479c9942f56..a8e2740053887 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
@@ -98,7 +98,6 @@ describe('Pickers', () => {
       input.value = 'bl';
       ReactTestUtils.Simulate.change(input);
 
-      let suggestions = document.querySelector('.ms-Suggestions') as HTMLInputElement;
       let suggestionOptions = document.querySelectorAll('.ms-Suggestions-itemButton');
       ReactTestUtils.Simulate.click(suggestionOptions[0]);
       expect(picker.items.length).to.be.equal(1, 'There was not only 1 item selected');
@@ -111,7 +110,7 @@ describe('Pickers', () => {
     it('will still render with itemLimit set to 0', () => {
       let root = document.createElement('div');
       document.body.appendChild(root);
-      let picker: TypedBasePicker = ReactDOM.render(
+      ReactDOM.render(
         <BasePickerWithType
           onResolveSuggestions={ onResolveSuggestions }
           onRenderItem={ (props: IPickerItemProps<{ key: string, name: string }>) => <div key={ props.item.name }>{ basicRenderer(props) }</div> }
@@ -218,7 +217,7 @@ describe('Pickers', () => {
     it('fires change events correctly for controlled components', (done) => {
       let root = document.createElement('div');
       document.body.appendChild(root);
-      let picker: TagPicker = ReactDOM.render(
+      ReactDOM.render(
         <TagPicker
           onResolveSuggestions={ onResolveSuggestions }
           selectedItems={ [] }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index 8abf154972261..c81fbb5363d6e 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -8,8 +8,7 @@ import {
 } from 'office-ui-fabric-react/lib/Utilities';
 import { Dropdown, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
 import { Toggle } from 'office-ui-fabric-react/lib/Toggle';
-import { IPersonaProps, Persona, PersonaSize } from 'office-ui-fabric-react/lib/Persona';
-import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { IPersonaProps, Persona } from 'office-ui-fabric-react/lib/Persona';
 import {
   CompactPeoplePicker,
   IBasePickerSuggestionsProps,
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index dd8fe1e141f8a..d846814431b22 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -3,7 +3,6 @@ import {
   BaseComponent,
   css,
   autobind,
-  assign,
   KeyCodes
 } from '../../../Utilities';
 import { CommandButton, IconButton, IButton } from '../../../Button';
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
index 15e83d5f216d1..f7545f734de67 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
@@ -1,7 +1,5 @@
 import * as React from 'react';
 import { autobind } from '../../../Utilities';
-import { FocusZone } from 'office-ui-fabric-react/lib/FocusZone';
-import { SelectionZone } from 'office-ui-fabric-react/lib/DetailsList';
 import {
   IDocumentCardActionsProps,
   IDocumentCardPreviewProps,
@@ -21,9 +19,7 @@ import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import {
   IBasePickerProps,
   BasePickerListBelow,
-  BaseAutoFill,
   IPickerItemProps,
-  ISuggestionsProps,
   ISuggestionItemProps
 } from 'office-ui-fabric-react/lib/Pickers';
 import './Picker.CustomResult.Example.scss';
@@ -275,9 +271,7 @@ export const SuggestedBigItem: (documentProps: IFullDocumentCardProps, itemProps
     documentPreviewProps,
     documentTitleProps
   } = documentProps;
-  let {
-    onClick
-  } = itemProps;
+
   return (
     <Persona
       imageUrl={ documentPreviewProps && documentPreviewProps.previewImages[0].previewImageSrc }
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx b/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
index 1793511e32ed1..8de800c3d92b4 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
@@ -35,7 +35,7 @@ export interface ISelectionItemExampleProps {
  */
 export class SelectionItemExample extends React.Component<ISelectionItemExampleProps, {}> {
   public render() {
-    let { item, itemIndex, selection, selectionMode } = this.props;
+    let { item, itemIndex, selection } = this.props;
     let isSelected = false;
 
     if (selection && itemIndex !== undefined) {
@@ -87,7 +87,7 @@ export class SelectionBasicExample extends React.Component<any, ISelectionBasicE
   }
 
   public render() {
-    let { items, selection, selectionMode } = this.state;
+    let { items, selection } = this.state;
 
     return (
       <div className='ms-SelectionBasicExample'>
diff --git a/packages/office-ui-fabric-react/tslint.json b/packages/office-ui-fabric-react/tslint.json
index 8c8f4aa94550f..a032b7ce22dfa 100644
--- a/packages/office-ui-fabric-react/tslint.json
+++ b/packages/office-ui-fabric-react/tslint.json
@@ -6,7 +6,6 @@
     "jsx-no-string-ref": false,
     "jsx-key": false,
     "jsx-boolean-value": false,
-    "no-unused-variable": false,
     "jsx-no-multiline-js": false,
     "jsx-wrap-multiline": false,
     "jsx-self-close": false,

From 4df2e769a72b290ac2fda4f0dc54f928d4f67663 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 6 Sep 2017 23:05:35 -0700
Subject: [PATCH 0588/1641] Experiments fabric export (#2760)

* Remove the global fabric export in experiments. keep experimentalcommandbar fallback

* changefile
---
 .../experiments-fabric-export_2017-09-06-20-01.json   | 11 +++++++++++
 packages/experiments/src/index.ts                     |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/experiments/experiments-fabric-export_2017-09-06-20-01.json

diff --git a/common/changes/@uifabric/experiments/experiments-fabric-export_2017-09-06-20-01.json b/common/changes/@uifabric/experiments/experiments-fabric-export_2017-09-06-20-01.json
new file mode 100644
index 0000000000000..36146eb140bdb
--- /dev/null
+++ b/common/changes/@uifabric/experiments/experiments-fabric-export_2017-09-06-20-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Removed global fabric export",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/index.ts b/packages/experiments/src/index.ts
index b20ef73f0126c..ce7a32b91e947 100644
--- a/packages/experiments/src/index.ts
+++ b/packages/experiments/src/index.ts
@@ -1,2 +1,2 @@
-export * from 'office-ui-fabric-react';
+export { CommandBar } from './CommandBar';
 export { CommandBar as ExperimentCommandBar } from './CommandBar';
\ No newline at end of file

From d52a454962cbbcec7774e163f86052175cf075f1 Mon Sep 17 00:00:00 2001
From: "David Wilson (VSNC)" <dawilson@microsoft.com>
Date: Thu, 7 Sep 2017 02:08:36 -0400
Subject: [PATCH 0589/1641] ContextualMenu: Add onRenderSubMenu prop. (#2751)

* ContextualMenu: Add onRenderSubMenu prop.

* Update onRenderSubMenu_2017-09-05-20-01.json
---
 .../onRenderSubMenu_2017-09-05-20-01.json             | 11 +++++++++++
 .../components/ContextualMenu/ContextualMenu.Props.ts |  6 +++++-
 .../src/components/ContextualMenu/ContextualMenu.tsx  |  9 +++++++--
 3 files changed, 23 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/onRenderSubMenu_2017-09-05-20-01.json

diff --git a/common/changes/office-ui-fabric-react/onRenderSubMenu_2017-09-05-20-01.json b/common/changes/office-ui-fabric-react/onRenderSubMenu_2017-09-05-20-01.json
new file mode 100644
index 0000000000000..f563d7cfc095b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/onRenderSubMenu_2017-09-05-20-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: `onRenderSubMenu` prop added to allow the overriding of submenu rendering.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dawilson@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
index 6a8a760d816ed..dd14b8a1edac6 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
@@ -6,7 +6,8 @@ import { IIconProps } from '../Icon/Icon.Props';
 import { ICalloutProps } from '../../Callout';
 import {
   IPoint,
-  IRectangle
+  IRectangle,
+  IRenderFunction
 } from '../../Utilities';
 import { IWithResponsiveModeState } from '../../utilities/decorators/withResponsiveMode';
 export { DirectionalHint } from '../../common/DirectionalHint';
@@ -181,6 +182,9 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
    * Pass in custom callout props
    */
   calloutProps?: ICalloutProps;
+
+  /** Method to call when trying to render a submenu. */
+  onRenderSubMenu?: IRenderFunction<IContextualMenuProps>;
 }
 
 export interface IContextualMenuItem {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 99695e7f0498a..44011dbdee363 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -165,7 +165,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       useTargetWidth,
       directionalHintFixed,
       shouldFocusOnMount,
-      calloutProps } = this.props;
+      calloutProps,
+      onRenderSubMenu = this._onRenderSubMenu } = this.props;
 
     let hasIcons = !!(items && items.some(item => !!item.icon || !!item.iconProps));
     let hasCheckmarks = !!(items && items.some(item => !!item.canCheck));
@@ -238,7 +239,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
                 </ul>
               </FocusZone>
             ) : (null) }
-            { submenuProps && <ContextualMenu { ...submenuProps } /> }
+            { submenuProps && onRenderSubMenu(submenuProps, this._onRenderSubMenu) }
           </div>
         </Callout>
       );
@@ -247,6 +248,10 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     }
   }
 
+  private _onRenderSubMenu(subMenuProps: IContextualMenuProps) {
+    return <ContextualMenu { ...subMenuProps } />;
+  }
+
   private _renderMenuItem(item: IContextualMenuItem, index: number, focusableElementIndex: number, totalItemCount: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
     let renderedItems: React.ReactNode[] = [];
 

From 98a5c4414e6b600520e494b1fff4e4c7be44c42e Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 7 Sep 2017 10:09:51 +0000
Subject: [PATCH 0590/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 ...iments-fabric-export_2017-09-06-20-01.json | 11 ------
 .../experiments/signals_2017-09-05-19-23.json | 11 ------
 .../tile-states_2017-09-06-18-16.json         | 11 ------
 .../tiles-focus_2017-09-05-21-46.json         | 11 ------
 .../button_icon_states_2017-09-06-18-41.json  | 11 ------
 .../onRenderSubMenu_2017-09-05-20-01.json     | 11 ------
 packages/experiments/CHANGELOG.json           | 36 +++++++++++++++++++
 packages/experiments/CHANGELOG.md             | 15 +++++++-
 packages/experiments/package.json             |  4 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 19 ++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 16 files changed, 85 insertions(+), 75 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/experiments-fabric-export_2017-09-06-20-01.json
 delete mode 100644 common/changes/@uifabric/experiments/signals_2017-09-05-19-23.json
 delete mode 100644 common/changes/@uifabric/experiments/tile-states_2017-09-06-18-16.json
 delete mode 100644 common/changes/@uifabric/experiments/tiles-focus_2017-09-05-21-46.json
 delete mode 100644 common/changes/office-ui-fabric-react/button_icon_states_2017-09-06-18-41.json
 delete mode 100644 common/changes/office-ui-fabric-react/onRenderSubMenu_2017-09-05-20-01.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 324618729ec9b..639088239a399 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -44,7 +44,7 @@
     "@uifabric/example-app-base": ">=4.2.7 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=4.41.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.42.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index d8f4d1cd440f7..e2c2e581142e2 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.41.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.42.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 772f5e0f0ec2c..bc640f4d15503 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -26,7 +26,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.41.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.42.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 56bdbe78adf3b..011e8651fac23 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -24,7 +24,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=4.41.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.42.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/experiments/experiments-fabric-export_2017-09-06-20-01.json b/common/changes/@uifabric/experiments/experiments-fabric-export_2017-09-06-20-01.json
deleted file mode 100644
index 36146eb140bdb..0000000000000
--- a/common/changes/@uifabric/experiments/experiments-fabric-export_2017-09-06-20-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Removed global fabric export",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/signals_2017-09-05-19-23.json b/common/changes/@uifabric/experiments/signals_2017-09-05-19-23.json
deleted file mode 100644
index 7eb4739a334e4..0000000000000
--- a/common/changes/@uifabric/experiments/signals_2017-09-05-19-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Fix minor alignment issues with SignalField",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/tile-states_2017-09-06-18-16.json b/common/changes/@uifabric/experiments/tile-states_2017-09-06-18-16.json
deleted file mode 100644
index 0140adfafbb68..0000000000000
--- a/common/changes/@uifabric/experiments/tile-states_2017-09-06-18-16.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Add presentation hooks for Tile and FolderCover",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/tiles-focus_2017-09-05-21-46.json b/common/changes/@uifabric/experiments/tiles-focus_2017-09-05-21-46.json
deleted file mode 100644
index bc250784a7c47..0000000000000
--- a/common/changes/@uifabric/experiments/tiles-focus_2017-09-05-21-46.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Support auto-focus for TilesList",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/button_icon_states_2017-09-06-18-41.json b/common/changes/office-ui-fabric-react/button_icon_states_2017-09-06-18-41.json
deleted file mode 100644
index 61c01f87793c6..0000000000000
--- a/common/changes/office-ui-fabric-react/button_icon_states_2017-09-06-18-41.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added rootExpandedHovered and iconExpandedHovered to IButtonStyles interface.  These entries are for specifying on hover style for expanded state.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "maxvay@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/onRenderSubMenu_2017-09-05-20-01.json b/common/changes/office-ui-fabric-react/onRenderSubMenu_2017-09-05-20-01.json
deleted file mode 100644
index f563d7cfc095b..0000000000000
--- a/common/changes/office-ui-fabric-react/onRenderSubMenu_2017-09-05-20-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: `onRenderSubMenu` prop added to allow the overriding of submenu rendering.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dawilson@microsoft.com"
-}
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 6cc4051941a2e..db9bc3d57b1b4 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,42 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "0.5.0",
+      "tag": "@uifabric/experiments_v0.5.0",
+      "date": "Thu, 07 Sep 2017 10:09:51 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "4df2e769a72b290ac2fda4f0dc54f928d4f67663",
+            "comment": "Removed global fabric export"
+          },
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "410d0e751e045102354d4da01b514a31ff0a2b8d",
+            "comment": "Add presentation hooks for Tile and FolderCover"
+          },
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "59db16443e9a9eb067736f2ce480be2bc23a0def",
+            "comment": "Support auto-focus for TilesList"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "19c7d3ad379a5f9c10f16e9a2a4e2726db21bd45",
+            "comment": "Fix minor alignment issues with SignalField"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.41.0 <5.0.0` to `>=4.42.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.4.0",
       "tag": "@uifabric/experiments_v0.4.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 6e32b4e62c3de..044958599d609 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Mon, 04 Sep 2017 10:16:56 GMT and should not be manually modified.
+This log was last generated on Thu, 07 Sep 2017 10:09:51 GMT and should not be manually modified.
+
+## 0.5.0
+Thu, 07 Sep 2017 10:09:51 GMT
+
+### Minor changes
+
+- Removed global fabric export
+- Add presentation hooks for Tile and FolderCover
+- Support auto-focus for TilesList
+
+### Patches
+
+- Fix minor alignment issues with SignalField
 
 ## 0.4.0
 Mon, 04 Sep 2017 10:16:56 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 250548ecae4c0..c9b9118d9ac7b 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,7 +43,7 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/styling": ">=0.22.1 <1.0.0",
     "@uifabric/utilities": ">=4.13.0 <5.0.0",
-    "office-ui-fabric-react": ">=4.41.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.42.0 <5.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index a9929f0f2bb5e..ae8f36042fde6 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.42.0",
+      "tag": "office-ui-fabric-react_v4.42.0",
+      "date": "Thu, 07 Sep 2017 10:09:51 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Max Vaysburd <max@angrykitten.com>",
+            "commit": "88fce95c6a4369a57affdcd4f81bd4d060c39daf",
+            "comment": "Added rootExpandedHovered and iconExpandedHovered to IButtonStyles interface.  These entries are for specifying on hover style for expanded state."
+          },
+          {
+            "author": "David Wilson (VSNC) <dawilson@microsoft.com>",
+            "commit": "d52a454962cbbcec7774e163f86052175cf075f1",
+            "comment": "ContextualMenu: `onRenderSubMenu` prop added to allow the overriding of submenu rendering."
+          }
+        ]
+      }
+    },
     {
       "version": "4.41.0",
       "tag": "office-ui-fabric-react_v4.41.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 7af61f04d0e42..ceaf200fd0227 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 06 Sep 2017 10:16:32 GMT and should not be manually modified.
+This log was last generated on Thu, 07 Sep 2017 10:09:51 GMT and should not be manually modified.
+
+## 4.42.0
+Thu, 07 Sep 2017 10:09:51 GMT
+
+### Minor changes
+
+- Added rootExpandedHovered and iconExpandedHovered to IButtonStyles interface.  These entries are for specifying on hover style for expanded state.
+- ContextualMenu: `onRenderSubMenu` prop added to allow the overriding of submenu rendering.
 
 ## 4.41.0
 Wed, 06 Sep 2017 10:16:32 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 859074fb5651f..353fefe044ec2 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.41.0",
+  "version": "4.42.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From b9f50d4f7b730c994cfcb78fcfe211414c916c38 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Thu, 7 Sep 2017 10:08:26 -0700
Subject: [PATCH 0591/1641] Better callout example

---
 .../src/components/Callout/CalloutPage.tsx                    | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
index f2e47e75050bf..1a83bae67125f 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
@@ -5,7 +5,7 @@ import {
   IComponentDemoPageProps,
   PropertiesTableSet
 } from '@uifabric/example-app-base';
-import { textOnlyItems } from '../CommandBar/examples/data';
+import { items } from '../CommandBar/examples/data';
 
 import { CalloutBasicExample } from './examples/Callout.Basic.Example';
 import { CalloutNestedExample } from './examples/Callout.Nested.Example';
@@ -19,7 +19,7 @@ const CalloutCoverExampleCode = require('!raw-loader!office-ui-fabric-react/src/
 
 export class CalloutPage extends React.Component<IComponentDemoPageProps, any> {
   public render() {
-    let cmdBarParamsTextAndIcons: any = { items: textOnlyItems, farItems: null };
+    let cmdBarParamsTextAndIcons: any = { items: items, farItems: null };
 
     return (
       <ComponentPage

From ba939aa63ea69430544a896f196ce461e48bef4b Mon Sep 17 00:00:00 2001
From: thomas-bak <thomasbak@gmail.com>
Date: Thu, 7 Sep 2017 19:30:01 +0200
Subject: [PATCH 0592/1641] New GroupedList footer in complement to Show All
 link (#2750)

* Replaced GroupFooter with GroupShowAll and added new GroupFooter with same behavior as GroupHeader.
TODO: make GroupFooter default rendering less prominent or only render when overriden

* GroupFooter now only renders when property footerText is set

* Added default value for showAllLinkText property

* Show All link now collapses with group

* Added back isShowAllVisible check

* Removed unused import "autobind"

* Removed unused import "Link"
---
 .../components/GroupedList/GroupFooter.scss   |  3 +-
 .../components/GroupedList/GroupFooter.tsx    | 16 ++-----
 .../components/GroupedList/GroupHeader.tsx    |  4 +-
 .../components/GroupedList/GroupShowAll.scss  | 11 +++++
 .../components/GroupedList/GroupShowAll.tsx   | 47 +++++++++++++++++++
 .../GroupedList/GroupedList.Props.ts          | 17 +++++--
 .../components/GroupedList/GroupedList.tsx    |  5 +-
 .../GroupedList/GroupedListSection.tsx        | 30 ++++++++++--
 .../examples/GroupedList.Custom.Example.scss  |  6 +++
 .../examples/GroupedList.Custom.Example.tsx   |  2 +-
 10 files changed, 116 insertions(+), 25 deletions(-)
 create mode 100644 packages/office-ui-fabric-react/src/components/GroupedList/GroupShowAll.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/GroupedList/GroupShowAll.tsx

diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.scss b/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.scss
index 6167d9c92733a..bc2da367ba8ee 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.scss
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.scss
@@ -2,8 +2,7 @@
 
 .root {
   position: relative;
-  padding: 10px 84px;
-  cursor: pointer;
+  padding: 5px 38px;
 
   :global(.ms-Link) {
     font-size: $ms-font-size-s;
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.tsx
index 28f82171a1ca4..a196f5fac76b0 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.tsx
@@ -1,10 +1,8 @@
 import * as React from 'react';
 import {
   BaseComponent,
-  autobind,
   css
 } from '../../Utilities';
-import { Link } from '../../Link';
 import { IGroupDividerProps } from './GroupedList.Props';
 import { GroupSpacer } from './GroupSpacer';
 import * as stylesImport from './GroupFooter.scss';
@@ -12,24 +10,16 @@ const styles: any = stylesImport;
 
 export class GroupFooter extends BaseComponent<IGroupDividerProps, {}> {
   public render(): JSX.Element | null {
-    let { group, groupLevel, showAllLinkText } = this.props;
+    let { group, groupLevel, footerText } = this.props;
 
-    if (group) {
+    if (group && footerText) {
       return (
         <div className={ css('ms-groupFooter', styles.root) }>
           { GroupSpacer({ count: groupLevel! }) }
-          <Link onClick={ this._onSummarizeClick }>{ showAllLinkText }</Link>
+          { footerText }
         </div>
       );
     }
     return null;
   }
-
-  @autobind
-  private _onSummarizeClick(ev: React.MouseEvent<HTMLElement>) {
-    this.props.onToggleSummarize!(this.props.group!);
-
-    ev.stopPropagation();
-    ev.preventDefault();
-  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
index 085fb27424135..9703ee83c2e2b 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
@@ -111,9 +111,9 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
           <div className={ css('ms-GroupHeader-title', styles.title) }>
             <span>{ group.name }</span>
             {
-              // hasMoreData flag is set when grouping is throttle by SPO server which in turn resorts to regular
+              // hasMoreData flag is set when grouping is throttled by SPO server which in turn resorts to regular
               // sorting to simulate grouping behaviors, in which case group count is the number of items returned
-              // so far. That's the reasons we need to use "+" to show we might have more items than count
+              // so far. That's the reason we need to use "+" to show we might have more items than count
               // indicates.
             }
             <span className={ styles.headerCount }>({ group.count }{ group.hasMoreData && '+' })</span>
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupShowAll.scss b/packages/office-ui-fabric-react/src/components/GroupedList/GroupShowAll.scss
new file mode 100644
index 0000000000000..6167d9c92733a
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupShowAll.scss
@@ -0,0 +1,11 @@
+@import '../../common/common';
+
+.root {
+  position: relative;
+  padding: 10px 84px;
+  cursor: pointer;
+
+  :global(.ms-Link) {
+    font-size: $ms-font-size-s;
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupShowAll.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupShowAll.tsx
new file mode 100644
index 0000000000000..c2ad5346e540a
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupShowAll.tsx
@@ -0,0 +1,47 @@
+import * as React from 'react';
+import {
+  BaseComponent,
+  autobind,
+  css
+} from '../../Utilities';
+import { Link } from '../../Link';
+import { IGroupDividerProps } from './GroupedList.Props';
+import { GroupSpacer } from './GroupSpacer';
+import * as stylesImport from './GroupShowAll.scss';
+const styles: any = stylesImport;
+
+export interface IGroupDividerProps {
+  /**
+ * The Show All link text.
+ * @default 'Show All'
+ */
+  showAllLinkText: string;
+}
+
+export class GroupShowAll extends BaseComponent<IGroupDividerProps, {}> {
+  public static defaultProps: IGroupDividerProps = {
+    showAllLinkText: 'Show All'
+  };
+
+  public render(): JSX.Element | null {
+    let { group, groupLevel, showAllLinkText } = this.props;
+
+    if (group) {
+      return (
+        <div className={ css('ms-groupFooter', styles.root) }>
+          { GroupSpacer({ count: groupLevel! }) }
+          <Link onClick={ this._onSummarizeClick }>{ showAllLinkText }</Link>
+        </div>
+      );
+    }
+    return null;
+  }
+
+  @autobind
+  private _onSummarizeClick(ev: React.MouseEvent<HTMLElement>) {
+    this.props.onToggleSummarize!(this.props.group!);
+
+    ev.stopPropagation();
+    ev.preventDefault();
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts
index 785dfecdd88f7..43d0f18f075d7 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts
@@ -185,6 +185,9 @@ export interface IGroupRenderProps {
   /** Information to pass in to the group header. */
   headerProps?: IGroupDividerProps;
 
+  /** Information to pass in to the group Show all footer. */
+  showAllProps?: IGroupDividerProps;
+
   /** Information to pass in to the group footer. */
   footerProps?: IGroupDividerProps;
 
@@ -194,7 +197,12 @@ export interface IGroupRenderProps {
   onRenderHeader?: IRenderFunction<IGroupDividerProps>;
 
   /**
-   * Override which allows the caller to provider a customer footer.
+   * Override which allows the caller to provide a custom Show All link.
+   */
+  onRenderShowAll?: IRenderFunction<IGroupDividerProps>;
+
+  /**
+   * Override which allows the caller to provide a custom footer.
    */
   onRenderFooter?: IRenderFunction<IGroupDividerProps>;
 
@@ -245,10 +253,13 @@ export interface IGroupDividerProps {
   /** The selection mode of the list the group lives within. */
   selectionMode?: SelectionMode;
 
-  /** Text to display for the group footer show all link. */
+  /** Text to display for the group footer. */
+  footerText?: string;
+
+  /** Text to display for the group "Show All" link. */
   showAllLinkText?: string;
 
-  /** Callback for when the "Show All" link in group footer is clicked */
+  /** Callback for when the group "Show All" link is clicked */
   onToggleSummarize?: (group: IGroup) => void;
 
   /** Callback for when the group header is clicked. */
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
index 2b96894f06b8c..4a8236a7a3910 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
@@ -157,6 +157,7 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
     };
 
     let headerProps = assign({}, groupProps!.headerProps, dividerProps);
+    let showAllProps = assign({}, groupProps!.showAllProps, dividerProps);
     let footerProps = assign({}, groupProps!.footerProps, dividerProps);
     let groupNestingDepth = this._getGroupNestingDepth();
 
@@ -181,9 +182,11 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
         items={ items }
         onRenderCell={ onRenderCell }
         onRenderGroupHeader={ groupProps!.onRenderHeader }
+        onRenderGroupShowAll={ groupProps!.onRenderShowAll }
         onRenderGroupFooter={ groupProps!.onRenderFooter }
         selectionMode={ selectionMode }
         selection={ selection }
+        showAllProps={ showAllProps }
         viewport={ viewport }
       />
     );
@@ -254,7 +257,7 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
   @autobind
   private _onToggleSummarize(group: IGroup) {
     let { groupProps } = this.props;
-    let onToggleSummarize = groupProps && groupProps.footerProps && groupProps.footerProps.onToggleSummarize;
+    let onToggleSummarize = groupProps && groupProps.showAllProps && groupProps.showAllProps.onToggleSummarize;
 
     if (onToggleSummarize) {
       onToggleSummarize(group);
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
index a22908d440e1f..c7eb4c27b25da 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
@@ -23,8 +23,9 @@ import {
   SELECTION_CHANGE
 } from '../../utilities/selection/index';
 
-import { GroupFooter } from './GroupFooter';
 import { GroupHeader } from './GroupHeader';
+import { GroupShowAll } from './GroupShowAll';
+import { GroupFooter } from './GroupFooter';
 
 import {
   List
@@ -89,12 +90,18 @@ export interface IGroupedListSectionProps extends React.Props<GroupedListSection
   /** Controls how/if the details list manages selection. */
   selectionMode?: SelectionMode;
 
+  /** Information to pass in to the group Show All footer. */
+  showAllProps?: IGroupDividerProps;
+
   /** Optional Viewport, provided by the parent component. */
   viewport?: IViewport;
 
   /** Override for rendering the group header. */
   onRenderGroupHeader?: IRenderFunction<IGroupDividerProps>;
 
+  /** Override for rendering the group Show All link. */
+  onRenderGroupShowAll?: IRenderFunction<IGroupDividerProps>;
+
   /** Override for rendering the group footer. */
   onRenderGroupFooter?: IRenderFunction<IGroupDividerProps>;
 }
@@ -169,15 +176,17 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
       group,
       groupIndex,
       headerProps,
+      showAllProps,
       footerProps,
       viewport,
       selectionMode,
       onRenderGroupHeader = this._onRenderGroupHeader,
+      onRenderGroupShowAll = this._onRenderGroupShowAll,
       onRenderGroupFooter = this._onRenderGroupFooter
     } = this.props;
     let { isSelected } = this.state;
     let renderCount = group && getGroupItemLimit ? getGroupItemLimit(group) : Infinity;
-    let isFooterVisible = group && !group.children && !group.isCollapsed && !group.isShowingAll &&
+    let isShowAllVisible = group && !group.children && !group.isCollapsed && !group.isShowingAll &&
       (group.count > renderCount || group.hasMoreData);
     let hasNestedGroups = group && group.children && group.children.length > 0;
 
@@ -190,6 +199,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
       selectionMode: selectionMode
     };
     let groupHeaderProps: IGroupDividerProps = assign({}, headerProps, dividerProps);
+    let groupShowAllProps: IGroupDividerProps = assign({}, showAllProps, dividerProps);
     let groupFooterProps: IGroupDividerProps = assign({}, footerProps, dividerProps);
 
     return (
@@ -215,7 +225,12 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
                 this._onRenderGroup(renderCount)
             )
         }
-        { isFooterVisible && onRenderGroupFooter(groupFooterProps, this._onRenderGroupFooter) }
+        {
+          group && group.isCollapsed ?
+            null :
+            isShowAllVisible && onRenderGroupShowAll(groupShowAllProps, this._onRenderGroupShowAll)
+        }
+        { onRenderGroupFooter(groupFooterProps, this._onRenderGroupFooter) }
       </div>
     );
   }
@@ -256,6 +271,11 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
     return <GroupHeader { ...props } />;
   }
 
+  @autobind
+  private _onRenderGroupShowAll(props: IGroupDividerProps) {
+    return <GroupShowAll { ...props } />;
+  }
+
   @autobind
   private _onRenderGroupFooter(props: IGroupDividerProps) {
     return <GroupFooter { ...props } />;
@@ -303,6 +323,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
       groupNestingDepth,
       items,
       headerProps,
+      showAllProps,
       footerProps,
       listProps,
       onRenderCell,
@@ -310,6 +331,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
       selectionMode,
       viewport,
       onRenderGroupHeader,
+      onRenderGroupShowAll,
       onRenderGroupFooter
     } = this.props;
 
@@ -331,8 +353,10 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
         onRenderCell={ onRenderCell }
         selection={ selection }
         selectionMode={ selectionMode }
+        showAllProps={ showAllProps }
         viewport={ viewport }
         onRenderGroupHeader={ onRenderGroupHeader }
+        onRenderGroupShowAll={ onRenderGroupShowAll }
         onRenderGroupFooter={ onRenderGroupFooter }
       />
     ) : null;
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.scss b/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.scss
index a95067930d24b..377574f1fa47c 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.scss
@@ -1,6 +1,7 @@
 :global {
 
   .ms-GroupedListExample-header,
+  .ms-GroupedListExample-showall,
   .ms-GroupedListExample-footer {
     min-width: 300px;
     min-height: 40px;
@@ -8,6 +9,11 @@
     padding-left: 16px;
   }
 
+  .ms-GroupedListExample-showall {
+    cursor: pointer;
+    padding-left: 32px;
+  }
+
   .ms-GroupedListExample-name {
     display: inline-block;
     overflow: hidden;
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx
index 018f2c5090c7b..aae5162d7fef1 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx
@@ -60,7 +60,7 @@ export class GroupedListCustomExample extends React.Component<any, any> {
 
   private _onRenderFooter(props: IGroupDividerProps): JSX.Element {
     return (
-      <div className={ css('ms-GroupedListExample-footer', FontClassNames.xLarge) }>
+      <div className={ css('ms-GroupedListExample-footer', FontClassNames.large) }>
         This is a custom footer for { props.group!.name }
       </div>
     );

From 20cf30afccaf99a2d1a92a642bfb0b9a1359c365 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Thu, 7 Sep 2017 13:13:25 -0700
Subject: [PATCH 0593/1641] Add manual breakpoint size support to Tile
 [experiments] (#2764)

* Add support for Tile breakpoint sizes

* Update Tile examples to use breakpoint sizes

* Fix page width calculation bug in TilesList

* Update change output
---
 .../tile-sizes_2017-09-06-23-27.json          | 11 +++
 .../experiments/src/components/Tile/Tile.scss | 17 ++++-
 .../experiments/src/components/Tile/Tile.tsx  | 58 +++++++++++++---
 .../Tile/examples/Tile.Document.Example.tsx   |  8 +--
 .../Tile/examples/Tile.Example.scss           | 12 +++-
 .../Tile/examples/Tile.Folder.Example.tsx     | 69 +++++++++++++++++--
 .../Tile/examples/Tile.Media.Example.tsx      |  2 +-
 .../src/components/TilesList/TilesList.tsx    |  2 +-
 8 files changed, 153 insertions(+), 26 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/tile-sizes_2017-09-06-23-27.json

diff --git a/common/changes/@uifabric/experiments/tile-sizes_2017-09-06-23-27.json b/common/changes/@uifabric/experiments/tile-sizes_2017-09-06-23-27.json
new file mode 100644
index 0000000000000..eb034aa3bdf82
--- /dev/null
+++ b/common/changes/@uifabric/experiments/tile-sizes_2017-09-06-23-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Add breakpoint size support to Tile",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Tile/Tile.scss b/packages/experiments/src/components/Tile/Tile.scss
index 31680a55ef4df..423dffebaa940 100644
--- a/packages/experiments/src/components/Tile/Tile.scss
+++ b/packages/experiments/src/components/Tile/Tile.scss
@@ -242,13 +242,24 @@ button.check {
 .name {
   display: block;
   font-weight: $ms-font-weight-regular;
-  font-size: $ms-font-size-m;
   color: $ms-color-neutralPrimary;
-  height: 17px;
-  line-height: 17px;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
+
+  &,
+  .isLarge & {
+    font-size: $ms-font-size-m;
+    height: 17px;
+    line-height: 17px;
+  }
+
+  .isSmall & {
+    font-size: $ms-font-size-s;
+    height: 14px;
+    line-height: 14px;
+  }
+
   @include preserveExtenders();
 }
 
diff --git a/packages/experiments/src/components/Tile/Tile.tsx b/packages/experiments/src/components/Tile/Tile.tsx
index 086ef9c715307..0b1e32de6669f 100644
--- a/packages/experiments/src/components/Tile/Tile.tsx
+++ b/packages/experiments/src/components/Tile/Tile.tsx
@@ -1,6 +1,6 @@
 
 import * as React from 'react';
-import { ITileProps } from './Tile.Props';
+import { ITileProps, TileSize } from './Tile.Props';
 import { Check } from 'office-ui-fabric-react/lib/Check';
 import { SELECTION_CHANGE } from 'office-ui-fabric-react/lib/Selection';
 import { css, BaseComponent, autobind, getId } from 'office-ui-fabric-react/lib/Utilities';
@@ -15,9 +15,11 @@ const SignalStyles: any = SignalStylesModule;
 
 const enum TileLayoutValues {
   nameplatePadding = 12,
-  nameplateNameHeight = 17,
+  largeNameplateNameHeight = 17,
+  smallNameplateNameHeight = 14,
   nameplateMargin = 4,
-  nameplateActivityHeight = 14,
+  largeNameplateActivityHeight = 14,
+  smallNameplateActivityHeight = 14,
   foregroundMargin = 16
 }
 
@@ -25,6 +27,31 @@ export interface ITileState {
   isSelected?: boolean;
 }
 
+const SIZES: {
+  [P in TileSize]: {
+    nameplatePadding: number;
+    nameplateNameHeight: number;
+    nameplateMargin: number;
+    nameplateActivityHeight: number;
+    foregroundMargin: number;
+  };
+} = {
+    small: {
+      nameplatePadding: TileLayoutValues.nameplatePadding,
+      nameplateNameHeight: TileLayoutValues.smallNameplateNameHeight,
+      nameplateMargin: TileLayoutValues.nameplateMargin,
+      nameplateActivityHeight: TileLayoutValues.smallNameplateActivityHeight,
+      foregroundMargin: TileLayoutValues.foregroundMargin
+    },
+    large: {
+      nameplatePadding: TileLayoutValues.nameplatePadding,
+      nameplateNameHeight: TileLayoutValues.largeNameplateNameHeight,
+      nameplateMargin: TileLayoutValues.nameplateMargin,
+      nameplateActivityHeight: TileLayoutValues.largeNameplateActivityHeight,
+      foregroundMargin: TileLayoutValues.foregroundMargin
+    }
+  };
+
 /**
  * A tile provides a frame for a potentially-selectable item which displays its contents prominently.
  *
@@ -120,6 +147,8 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
       itemActivity,
       componentRef,
       className,
+      tileSize = 'large',
+      contentSize,
       ...aProps
     } = this.props;
 
@@ -136,6 +165,8 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
         aria-labelledby={ this._nameId }
         aria-describedby={ this._activityId }
         className={ css('ms-Tile', className, TileStyles.tile, {
+          [`ms-Tile--isSmall ${TileStyles.isSmall}`]: tileSize === 'small',
+          [`ms-Tile--isLarge ${TileStyles.isLarge}`]: tileSize === 'large',
           [`ms-Tile--hasBackgroundFrame ${TileStyles.hasBackgroundFrame}`]: showBackgroundFrame,
           [`ms-Tile--isSelected ${TileStyles.selected} ${SignalStyles.selected}`]: isSelected,
           [`ms-Tile--isSelectable ${TileStyles.selectable}`]: isSelectable,
@@ -308,7 +339,8 @@ export function getTileLayout(tileElement: JSX.Element): ITileLayout {
   const tileProps: ITileProps = tileElement.props;
 
   const {
-    contentSize
+    contentSize,
+    tileSize = 'large'
   } = tileProps;
 
   if (!contentSize) {
@@ -317,22 +349,30 @@ export function getTileLayout(tileElement: JSX.Element): ITileLayout {
 
   const width = contentSize.width;
 
+  const {
+    nameplatePadding,
+    nameplateMargin,
+    nameplateActivityHeight,
+    nameplateNameHeight,
+    foregroundMargin
+  } = SIZES[tileSize];
+
   let nameplateHeight = 0;
 
   if (tileProps.itemName || tileProps.itemActivity) {
-    nameplateHeight += TileLayoutValues.nameplatePadding * 2; // 12px top/bottom padding.
+    nameplateHeight += nameplatePadding * 2; // 12px top/bottom padding.
     if (tileProps.itemName) {
-      nameplateHeight += TileLayoutValues.nameplateNameHeight;
+      nameplateHeight += nameplateNameHeight;
     }
     if (tileProps.itemActivity) {
-      nameplateHeight += TileLayoutValues.nameplateActivityHeight + TileLayoutValues.nameplateMargin;
+      nameplateHeight += nameplateActivityHeight + nameplateMargin;
     }
   }
 
   return {
     foregroundSize: {
-      width: width - TileLayoutValues.foregroundMargin * 2,
-      height: contentSize.height - TileLayoutValues.foregroundMargin - nameplateHeight
+      width: width - foregroundMargin * 2,
+      height: contentSize.height - foregroundMargin - nameplateHeight
     },
     backgroundSize: contentSize
   };
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
index b6ea791a54d85..c7230a9d59cd3 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
@@ -48,8 +48,8 @@ const DocumentTileWithThumbnail: React.StatelessComponent<IDocumentTileWithThumb
       <Tile
         contentSize={
           {
-            width: 200,
-            height: 200
+            width: 176,
+            height: 171
           }
         }
         itemName={
@@ -89,7 +89,7 @@ const DocumentTileWithThumbnail: React.StatelessComponent<IDocumentTileWithThumb
     });
 
     return (
-      <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
+      <div className={ css(TileExampleStyles.tile, TileExampleStyles.largeTile) }>
         {
           renderTileWithLayout(tile, {
             foreground: (
@@ -161,7 +161,7 @@ export class TileDocumentExample extends React.Component<{}, ITileDocumentExampl
           item={ ITEMS[2] }
         />
         <h3>Document icon</h3>
-        <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
+        <div className={ css(TileExampleStyles.tile, TileExampleStyles.largeTile) }>
           <Tile
             itemName={
               <SignalField
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Example.scss b/packages/experiments/src/components/Tile/examples/Tile.Example.scss
index 74528fdf42824..63ef84b1424c7 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Example.scss
+++ b/packages/experiments/src/components/Tile/examples/Tile.Example.scss
@@ -5,11 +5,17 @@
   margin: 4px;
 }
 
-.squareTile {
-  width: 200px;
-  height: 200px;
+.smallTile {
+  width: 138px;
+  height: 135px;
 }
 
+.largeTile {
+  width: 176px;
+  height: 171px;
+}
+
+
 .tileImage {
   display: block;
 }
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
index 1a9b98ad322b8..716fe3d67408f 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
@@ -1,7 +1,8 @@
 
 import * as React from 'react';
 import { Tile } from '../Tile';
-import { css } from 'office-ui-fabric-react/lib/Utilities';
+import { css, autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import {
   SignalField,
   NewSignal,
@@ -16,15 +17,33 @@ import * as TileExampleStylesModule from './Tile.Example.scss';
 // tslint:disable-next-line:no-any
 const TileExampleStyles = TileExampleStylesModule as any;
 
+const ITEMS: { name: string; activity: string; }[] = [
+  {
+    name: lorem(2),
+    activity: lorem(6),
+  },
+  {
+    name: lorem(2),
+    activity: lorem(6),
+  },
+  {
+    name: lorem(2),
+    activity: lorem(6),
+  }
+];
+
 interface IFolderTileWithThumbnailProps {
   folderCoverType?: FolderCoverType;
   originalImageSize: ISize;
+  size: 'small' | 'large';
+  item: typeof ITEMS[0];
 }
 
 const FolderTileWithThumbnail: React.StatelessComponent<IFolderTileWithThumbnailProps> =
   (props: IFolderTileWithThumbnailProps): JSX.Element => {
     const folderCover = (
       <FolderCover
+        folderCoverSize={ props.size }
         folderCoverType={ props.folderCoverType }
       />
     );
@@ -40,15 +59,21 @@ const FolderTileWithThumbnail: React.StatelessComponent<IFolderTileWithThumbnail
     });
 
     return (
-      <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
+      <div
+        className={ css(TileExampleStyles.tile, {
+          [TileExampleStyles.largeTile]: props.size === 'large',
+          [TileExampleStyles.smallTile]: props.size === 'small'
+        }) }
+      >
         <Tile
+          tileSize={ props.size }
           itemName={
             <SignalField
               before={
                 <NewSignal />
               }
             >
-              { lorem(2) }
+              { props.item.name }
             </SignalField>
           }
           itemActivity={
@@ -57,7 +82,7 @@ const FolderTileWithThumbnail: React.StatelessComponent<IFolderTileWithThumbnail
                 <CommentsSignal>{ '12' }</CommentsSignal>
               }
             >
-              { lorem(2) }
+              { props.item.activity }
             </SignalField>
           }
           foreground={
@@ -75,10 +100,31 @@ const FolderTileWithThumbnail: React.StatelessComponent<IFolderTileWithThumbnail
     );
   };
 
-export class TileFolderExample extends React.Component<{}, {}> {
+export interface ITileFolderExampleState {
+  size: 'small' | 'large';
+}
+
+export class TileFolderExample extends React.Component<{}, ITileFolderExampleState> {
+  constructor() {
+    super();
+
+    this.state = {
+      size: 'large'
+    };
+  }
+
   public render(): JSX.Element {
+    const {
+      size
+    } = this.state;
+
     return (
       <div>
+        <Checkbox
+          label='Use large tiles'
+          checked={ size === 'large' }
+          onChange={ this._onIsLargeChanged }
+        />
         <h3>Folder</h3>
         <FolderTileWithThumbnail
           originalImageSize={
@@ -87,6 +133,8 @@ export class TileFolderExample extends React.Component<{}, {}> {
               height: 300
             }
           }
+          item={ ITEMS[0] }
+          size={ size }
         />
         <FolderTileWithThumbnail
           originalImageSize={
@@ -95,7 +143,9 @@ export class TileFolderExample extends React.Component<{}, {}> {
               height: 400
             }
           }
+          item={ ITEMS[1] }
           folderCoverType='media'
+          size={ size }
         />
         <FolderTileWithThumbnail
           originalImageSize={
@@ -104,9 +154,18 @@ export class TileFolderExample extends React.Component<{}, {}> {
               height: 40
             }
           }
+          item={ ITEMS[2] }
           folderCoverType='media'
+          size={ size }
         />
       </div>
     );
   }
+
+  @autobind
+  private _onIsLargeChanged(event: React.FormEvent<HTMLInputElement>, checked: boolean): void {
+    this.setState({
+      size: checked ? 'large' : 'small'
+    });
+  }
 }
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
index f2dcf66e1df8d..e82dfd331eb47 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
@@ -165,7 +165,7 @@ export class TileMediaExample extends React.Component<{}, ITileMediaExampleState
           showBackground={ imagesLoaded }
         />
         <h3>No preview</h3>
-        <div className={ css(TileExampleStyles.tile, TileExampleStyles.squareTile) }>
+        <div className={ css(TileExampleStyles.tile, TileExampleStyles.largeTile) }>
           <Tile
             itemName={
               <SignalField
diff --git a/packages/experiments/src/components/TilesList/TilesList.tsx b/packages/experiments/src/components/TilesList/TilesList.tsx
index 8ce5e44cb7614..2b8f42cf75733 100644
--- a/packages/experiments/src/components/TilesList/TilesList.tsx
+++ b/packages/experiments/src/components/TilesList/TilesList.tsx
@@ -189,7 +189,7 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
 
       const renderedCells: React.ReactNode[] = [];
 
-      const width = data.pageWidths[i];
+      const width = data.pageWidths[page.startIndex + i];
 
       for (; i < endIndex && cells[i].grid === grid; i++) {
         // For each cell in the current grid.

From 6857963fe1ac223c3224fb7a4361c7457983da95 Mon Sep 17 00:00:00 2001
From: Spencer Elliott <me@elliottsj.com>
Date: Thu, 7 Sep 2017 14:38:09 -0700
Subject: [PATCH 0594/1641] Add scrollToIndex to GroupedList, DetailsList
 (#2772)

---
 .../scrolltoindex_2017-09-07-18-51.json               | 11 +++++++++++
 .../src/components/DetailsList/DetailsList.Props.ts   |  4 ++--
 .../src/components/DetailsList/DetailsList.tsx        |  5 +++++
 .../src/components/GroupedList/GroupedList.Props.ts   |  3 ++-
 .../src/components/GroupedList/GroupedList.tsx        |  4 ++++
 5 files changed, 24 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/scrolltoindex_2017-09-07-18-51.json

diff --git a/common/changes/office-ui-fabric-react/scrolltoindex_2017-09-07-18-51.json b/common/changes/office-ui-fabric-react/scrolltoindex_2017-09-07-18-51.json
new file mode 100644
index 0000000000000..ab405683d59bd
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/scrolltoindex_2017-09-07-18-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add scrollToIndex to GroupedList, DetailsList",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "spelliot@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
index d2e05ede55012..71f1c9d01155a 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
@@ -17,11 +17,11 @@ import {
 import { IDetailsRowProps } from '../DetailsList/DetailsRow';
 import { IDetailsHeaderProps } from './DetailsHeader';
 import { IWithViewportProps, IViewport } from '../../utilities/decorators/withViewport';
-import { IListProps } from '../List/index';
+import { IList, IListProps } from '../List/index';
 
 export { IDetailsHeaderProps };
 
-export interface IDetailsList {
+export interface IDetailsList extends IList {
   /**
    * Ensures that the list content is updated. Call this in cases where the list prop updates don't change, but the list
    * still needs to be re-evaluated. For example, if a sizer bar is adjusted and causes the list width to change, you can
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index b80311c4062f1..437b01d1379ce 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -120,6 +120,11 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     this._initialFocusedIndex = props.initialFocusedIndex;
   }
 
+  public scrollToIndex(index: number, measureItem?: (itemIndex: number) => number): void {
+    this._list && this._list.scrollToIndex(index, measureItem);
+    this._groupedList && this._groupedList.scrollToIndex(index, measureItem);
+  }
+
   public componentWillUnmount() {
     if (this._dragDropHelper) {
       this._dragDropHelper.dispose();
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts
index 43d0f18f075d7..2b6584e452f67 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts
@@ -3,6 +3,7 @@ import {
   GroupedList
 } from './GroupedList';
 import {
+  IList,
   IListProps
 } from '../../List';
 import { IRenderFunction } from '../../Utilities';
@@ -22,7 +23,7 @@ export enum CollapseAllVisibility {
   visible = 1
 }
 
-export interface IGroupedList {
+export interface IGroupedList extends IList {
   /**
    * Ensures that the list content is updated. Call this in cases where the list prop updates don't change, but the list
    * still needs to be re-evaluated. For example, if a sizer bar is adjusted and causes the list width to change, you can
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
index 4a8236a7a3910..cfffa3600036e 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
@@ -54,6 +54,10 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
     };
   }
 
+  public scrollToIndex(index: number, measureItem?: (itemIndex: number) => number): void {
+    this.refs.list && this.refs.list.scrollToIndex(index, measureItem);
+  }
+
   public componentWillReceiveProps(newProps: IGroupedListProps) {
     let {
       groups,

From 66e534d2165671f4efa367627570eec336d50d71 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Thu, 7 Sep 2017 17:47:29 -0700
Subject: [PATCH 0595/1641] Button docs & add primary props, and abstract out
 primary/standard theme (#2446)

* new button themes

* new primary prop for buttons

* linting fixes

* Update Button.Props.ts
---
 .../src/components/Button/Button.Props.ts     |  6 ++
 .../src/components/Button/ButtonPage.tsx      | 13 ++--
 .../src/components/Button/ButtonThemes.ts     | 65 +++++++++++++++++
 .../CompoundButton/CompoundButton.styles.ts   | 69 +++++++++++++++----
 .../Button/CompoundButton/CompoundButton.tsx  |  6 +-
 .../DefaultButton/DefaultButton.styles.ts     | 39 ++++-------
 .../Button/DefaultButton/DefaultButton.tsx    |  6 +-
 .../PrimaryButton/PrimaryButton.styles.ts     | 65 -----------------
 .../Button/PrimaryButton/PrimaryButton.tsx    |  8 +--
 .../Button/examples/Button.Basic.Example.scss |  6 ++
 .../examples/Button.Compound.Example.tsx      | 31 ++++++---
 .../examples/Button.Default.Example.tsx       | 21 ++++--
 .../examples/Button.Primary.Example.tsx       | 26 -------
 13 files changed, 200 insertions(+), 161 deletions(-)
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx

diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
index a5f932d12819c..447230fb9eb01 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
@@ -26,6 +26,12 @@ export interface IButtonProps extends React.AllHTMLAttributes<HTMLAnchorElement
    */
   href?: string;
 
+  /**
+   * Changes the visual presentation of the button to be emphasized (if defined)
+   * @default false
+   */
+  primary?: boolean;
+
   /**
    * Unique id to identify the item. Typically a duplicate of key value.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
index baa1c6e4e2c1c..e5bacfe281408 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
@@ -8,7 +8,6 @@ import {
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { ButtonDefaultExample } from './examples/Button.Default.Example';
 import { ButtonContextualMenuExample } from './examples/Button.ContextualMenu.Example';
-import { ButtonPrimaryExample } from './examples/Button.Primary.Example';
 import { ButtonCompoundExample } from './examples/Button.Compound.Example';
 import { ButtonActionExample } from './examples/Button.Action.Example';
 import { ButtonCommandBarExample } from './examples/Button.CommandBar.Example';
@@ -21,7 +20,6 @@ import './examples/Button.Basic.Example.scss';
 import { Link } from '../../Link';
 
 const ButtonDefaultExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx') as string;
-const ButtonPrimaryExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx') as string;
 const ButtonCompoundExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx') as string;
 const ButtonActionExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx') as string;
 const ButtonCommandBarExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.CommandBar.Example.tsx') as string;
@@ -53,14 +51,13 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
         componentName='ButtonExample'
         exampleCards={
           <div>
-            <Checkbox label='Disable buttons' checked={ this.state.areButtonsDisabled } onChange={ this._onDisabledChanged.bind(this) } />
-            <Checkbox label='Mark as checked' checked={ this.state.areButtonsChecked } onChange={ this._onToggledChanged.bind(this) } />
-            <ExampleCard title='Default Button' code={ ButtonDefaultExampleCode }>
+            <div style={ { marginBottom: '20px' } }>
+              <Checkbox label='Disable buttons' checked={ this.state.areButtonsDisabled } onChange={ this._onDisabledChanged.bind(this) } />
+              <Checkbox label='Mark as checked' checked={ this.state.areButtonsChecked } onChange={ this._onToggledChanged.bind(this) } />
+            </div>
+            <ExampleCard title='Button' code={ ButtonDefaultExampleCode }>
               <ButtonDefaultExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
-            <ExampleCard title='Primary Button' code={ ButtonPrimaryExampleCode }>
-              <ButtonPrimaryExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
-            </ExampleCard>
             <ExampleCard title='Compound Button' code={ ButtonCompoundExampleCode }>
               <ButtonCompoundExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts b/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
new file mode 100644
index 0000000000000..eb63b24fe3f9f
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
@@ -0,0 +1,65 @@
+import { IButtonStyles } from './Button.Props';
+import { ITheme } from '../../Styling';
+
+export function standardStyles(theme: ITheme): IButtonStyles {
+  return {
+    root: {
+      backgroundColor: theme.palette.neutralLighter,
+      color: theme.palette.neutralPrimary
+    },
+
+    rootHovered: {
+      backgroundColor: theme.palette.neutralLight,
+      color: theme.palette.black
+    },
+
+    rootPressed: {
+      backgroundColor: theme.palette.neutralTertiaryAlt,
+      color: theme.palette.neutralDark
+    },
+
+    rootExpanded: {
+      backgroundColor: theme.palette.neutralTertiaryAlt,
+      color: theme.palette.neutralDark
+    },
+
+    rootChecked: {
+      backgroundColor: theme.palette.neutralTertiaryAlt,
+      color: theme.palette.neutralDark
+    },
+  };
+}
+
+export function primaryStyles(theme: ITheme): IButtonStyles {
+  return {
+    root: {
+      backgroundColor: theme.palette.themePrimary,
+      color: theme.palette.white
+    },
+
+    rootHovered: {
+      backgroundColor: theme.palette.themeDark,
+      color: theme.palette.white
+    },
+
+    rootPressed: {
+      backgroundColor: theme.palette.themePrimary,
+      color: theme.palette.white
+    },
+
+    rootExpanded: {
+      backgroundColor: theme.palette.themePrimary,
+      color: theme.palette.white
+    },
+
+    rootChecked: {
+      backgroundColor: theme.palette.themeDark,
+      color: theme.palette.white,
+    },
+
+    rootCheckedHovered: {
+      backgroundColor: theme.palette.neutralLight,
+      color: theme.palette.black
+    }
+  };
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
index 53c2b7a4ec943..9c773e8368784 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
@@ -1,24 +1,33 @@
 import { IButtonStyles } from '../Button.Props';
 import {
   ITheme,
-  mergeStyleSets
+  mergeStyleSets,
+  FontWeights
 } from '../../../Styling';
 import { memoizeFunction } from '../../../Utilities';
 import {
-  getStyles as getDefaultButtonStyles
-} from '../DefaultButton/DefaultButton.styles';
+  getStyles as getBaseButtonStyles
+} from '../BaseButton.styles';
 import {
   getStyles as getSplitButtonStyles
 } from '../SplitButton/SplitButton.styles';
+import {
+  primaryStyles,
+  standardStyles
+} from '../ButtonThemes';
+
+const DEFAULT_BUTTON_HEIGHT = '32px';
+const DEFAULT_BUTTON_MINWIDTH = '80px';
+const DEFAULT_PADDING = '0 16px';
 
 export const getStyles = memoizeFunction((
   theme: ITheme,
-  customStyles?: IButtonStyles
+  customStyles?: IButtonStyles,
+  primary?: boolean,
+  focusInset?: string,
+  focusColor?: string
 ): IButtonStyles => {
-  let defaultButtonStyles: IButtonStyles = getDefaultButtonStyles(
-    theme,
-    customStyles
-  );
+  let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme, focusInset, focusColor);
   let splitButtonStyles: IButtonStyles = getSplitButtonStyles(theme);
   let compoundButtonStyles: IButtonStyles = {
     root: {
@@ -37,17 +46,24 @@ export const getStyles = memoizeFunction((
 
     label: {
       margin: '0 0 5px',
-      lineHeight: '100%'
+      lineHeight: '100%',
+      fontWeight: FontWeights.semibold
     },
-
     description: [
       theme.fonts.small,
       {
-        color: theme.palette.neutralSecondary,
         lineHeight: '100%'
       }
     ],
 
+  };
+
+  let standardCompoundTheme: IButtonStyles = {
+
+    description: {
+      color: theme.palette.neutralSecondary,
+    },
+
     descriptionHovered: {
       color: theme.palette.neutralDark
     },
@@ -63,8 +79,37 @@ export const getStyles = memoizeFunction((
     descriptionDisabled: {
       color: 'inherit'
     }
+  };
+
+  let primaryCompoundTheme: IButtonStyles = {
+
+    description: {
+      color: theme.palette.white,
+    },
+
+    descriptionHovered: {
+      color: theme.palette.white
+    },
+
+    descriptionPressed: {
+      color: 'inherit'
+    },
+
+    descriptionChecked: {
+      color: 'inherit'
+    },
 
+    descriptionDisabled: {
+      color: 'inherit'
+    }
   };
 
-  return mergeStyleSets(defaultButtonStyles, compoundButtonStyles, splitButtonStyles, customStyles)!;
+  return mergeStyleSets(
+    baseButtonStyles,
+    compoundButtonStyles,
+    primary ? primaryStyles(theme) : standardStyles(theme),
+    primary ? primaryCompoundTheme : standardCompoundTheme,
+    splitButtonStyles,
+    customStyles
+  )!;
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
index 54e8867ba572e..bf20c23380273 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
@@ -13,12 +13,12 @@ export class CompoundButton extends BaseComponent<IButtonProps, {}> {
   protected _shouldUpdateComponentRef = false;
 
   public render() {
-    let { styles, theme } = this.props;
+    let { primary = false, styles, theme } = this.props;
     return (
       <BaseButton
         { ...this.props }
-        variantClassName='ms-Button--compound'
-        styles={ getStyles(theme!, styles) }
+        variantClassName={ primary ? 'ms-Button--compoundPrimary' : 'ms-Button--compound' }
+        styles={ getStyles(theme!, styles, primary) }
         onRenderIcon={ nullRender }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
index 02abd73daee15..84e7c31524c10 100644
--- a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
@@ -12,14 +12,20 @@ import {
   getStyles as getSplitButtonStyles
 } from '../SplitButton/SplitButton.styles';
 
+import {
+  primaryStyles,
+  standardStyles
+} from '../ButtonThemes';
+
 const DEFAULT_BUTTON_HEIGHT = '32px';
 const DEFAULT_BUTTON_MINWIDTH = '80px';
 
 export const getStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: IButtonStyles,
+  primary?: boolean,
   focusInset?: string,
-  focusColor?: string
+  focusColor?: string,
 ): IButtonStyles => {
   let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme, focusInset, focusColor);
   let splitButtonStyles: IButtonStyles = getSplitButtonStyles(theme);
@@ -27,34 +33,17 @@ export const getStyles = memoizeFunction((
     root: {
       minWidth: DEFAULT_BUTTON_MINWIDTH,
       height: DEFAULT_BUTTON_HEIGHT,
-      backgroundColor: theme.palette.neutralLighter,
-      color: theme.palette.neutralPrimary
-    },
-
-    rootHovered: {
-      backgroundColor: theme.palette.neutralLight,
-      color: theme.palette.black
-    },
-
-    rootPressed: {
-      backgroundColor: theme.palette.neutralTertiaryAlt,
-      color: theme.palette.neutralDark
     },
-
-    rootExpanded: {
-      backgroundColor: theme.palette.neutralTertiaryAlt,
-      color: theme.palette.neutralDark
-    },
-
-    rootChecked: {
-      backgroundColor: theme.palette.neutralTertiaryAlt,
-      color: theme.palette.neutralDark
-    },
-
     label: {
       fontWeight: FontWeights.semibold
     }
   };
 
-  return mergeStyleSets(baseButtonStyles, defaultButtonStyles, splitButtonStyles, customStyles)!;
+  return mergeStyleSets(
+    baseButtonStyles,
+    defaultButtonStyles,
+    primary ? primaryStyles(theme) : standardStyles(theme),
+    splitButtonStyles,
+    customStyles
+  )!;
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
index b2b22b57d386b..35fe96852dc47 100644
--- a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
@@ -13,13 +13,13 @@ export class DefaultButton extends BaseComponent<IButtonProps, {}> {
   protected _shouldUpdateComponentRef = false;
 
   public render() {
-    const { styles, theme } = this.props;
+    const { primary = false, styles, theme } = this.props;
 
     return (
       <BaseButton
         { ...this.props }
-        variantClassName='ms-Button--default'
-        styles={ getStyles(theme!, styles) }
+        variantClassName={ primary ? 'ms-Button--primary' : 'ms-Button--default' }
+        styles={ getStyles(theme!, styles, primary) }
         onRenderDescription={ nullRender }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
deleted file mode 100644
index f389a32d6de63..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.styles.ts
+++ /dev/null
@@ -1,65 +0,0 @@
-import { IButtonStyles } from '../Button.Props';
-import {
-  ITheme,
-  mergeStyleSets
-} from '../../../Styling';
-import { memoizeFunction } from '../../../Utilities';
-import {
-  getStyles as getDefaultButtonStyles
-} from '../DefaultButton/DefaultButton.styles';
-import {
-  getStyles as getSplitButtonStyles
-} from '../SplitButton/SplitButton.styles';
-
-const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
-
-export const getStyles = memoizeFunction((
-  theme: ITheme,
-  customStyles?: IButtonStyles
-): IButtonStyles => {
-  let { palette } = theme;
-  let splitButtonStyles: IButtonStyles = getSplitButtonStyles(theme);
-  let defaultButtonStyles: IButtonStyles = getDefaultButtonStyles(
-    theme,
-    customStyles,
-    '0px',
-    palette.white
-  );
-  let primaryButtonStyles: IButtonStyles = {
-    root: {
-      backgroundColor: palette.themePrimary,
-      color: palette.white,
-      [MS_HIGHCONTRAST_ACTIVE]: {
-        borderColor: 'Highlight',
-        color: 'Highlight'
-      }
-    },
-
-    rootHovered: {
-      backgroundColor: palette.themeDark,
-      color: palette.white
-    },
-
-    rootPressed: {
-      backgroundColor: palette.themePrimary,
-      color: palette.white
-    },
-
-    rootExpanded: {
-      backgroundColor: palette.themePrimary,
-      color: palette.white
-    },
-
-    rootChecked: {
-      backgroundColor: palette.themeDark,
-      color: palette.white,
-    },
-
-    rootCheckedHovered: {
-      backgroundColor: theme.palette.neutralLight,
-      color: theme.palette.black
-    }
-  };
-
-  return mergeStyleSets(defaultButtonStyles, primaryButtonStyles, splitButtonStyles, customStyles)!;
-});
diff --git a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
index 74a64ece7403f..dd09fb1675a06 100644
--- a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
@@ -1,9 +1,8 @@
 import * as React from 'react';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
 import { ThemeSettingName } from '../../../Styling';
-import { BaseButton } from '../BaseButton';
+import { DefaultButton } from '../';
 import { IButtonProps } from '../Button.Props';
-import { getStyles } from './PrimaryButton.styles';
 
 @customizable([ThemeSettingName])
 
@@ -17,11 +16,10 @@ export class PrimaryButton extends BaseComponent<IButtonProps, {}> {
     const { theme, styles } = this.props;
 
     return (
-      <BaseButton
+      <DefaultButton
         { ...this.props }
-        variantClassName='ms-Button--primary'
+        primary={ true }
         onRenderDescription={ nullRender }
-        styles={ getStyles(theme!, styles) }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Basic.Example.scss b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Basic.Example.scss
index d261f009021ff..7ac8403fca70e 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Basic.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Basic.Example.scss
@@ -2,4 +2,10 @@
   .ms-BasicButtonsExample .ms-Button {
     margin: 10px 0;
   }
+  .ms-BasicButtonsTwoUp {
+    display: flex;
+    & > * {
+      flex-grow: 1;
+    }
+  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx
index d626df339bd38..a59636dad93a9 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx
@@ -14,15 +14,28 @@ export class ButtonCompoundExample extends React.Component<IButtonProps, {}> {
     let { disabled, checked } = this.props;
 
     return (
-      <div className='ms-BasicButtonsExample'>
-        <Label>Compound button</Label>
-        <CompoundButton
-          description='You can create a new account here.'
-          disabled={ disabled }
-          checked={ checked }
-        >
-          Create account
-        </CompoundButton>
+      <div className='ms-BasicButtonsExample ms-BasicButtonsTwoUp'>
+        <div>
+          <Label>Standard</Label>
+          <CompoundButton
+            description='You can create a new account here.'
+            disabled={ disabled }
+            checked={ checked }
+          >
+            Create account
+          </CompoundButton>
+        </div>
+        <div>
+          <Label>Primary</Label>
+          <CompoundButton
+            primary={ true }
+            description='You can create a new account here.'
+            disabled={ disabled }
+            checked={ checked }
+          >
+            Create account
+          </CompoundButton>
+        </div>
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
index d6d2e05f8f239..bfa33a6185c74 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
@@ -1,20 +1,31 @@
 import * as React from 'react';
-import { DefaultButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
+import { DefaultButton, PrimaryButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
+import { Label } from 'office-ui-fabric-react/lib/Label';
 
 export class ButtonDefaultExample extends React.Component<IButtonProps, {}> {
   public render() {
     let { disabled, checked } = this.props;
 
     return (
-      <div className='ms-BasicButtonsExample'>
+      <div className='ms-BasicButtonsExample ms-BasicButtonsTwoUp'>
         <div>
+          <Label>Standard</Label>
           <DefaultButton
             data-automation-id='test'
             disabled={ disabled }
             checked={ checked }
-            iconProps={ { iconName: 'Add' } }
-            description='I am a description'
-            text='Create account'
+            text='Butjon'
+          />
+        </div>
+        <div>
+          <Label>Primary</Label>
+          <DefaultButton
+            primary={ true }
+            data-automation-id='test'
+            disabled={ disabled }
+            checked={ checked }
+            text='Butjon'
+            onClick={ () => alert('Clicked') }
           />
         </div>
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
deleted file mode 100644
index ccfceb56e3e13..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
+++ /dev/null
@@ -1,26 +0,0 @@
-import * as React from 'react';
-import { PrimaryButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
-import { Label } from 'office-ui-fabric-react/lib/Label';
-
-export class ButtonPrimaryExample extends React.Component<IButtonProps, {}> {
-  public constructor() {
-    super();
-  }
-
-  public render() {
-    let { disabled, checked } = this.props;
-
-    return (
-      <div className='ms-BasicButtonsExample'>
-        <Label>Primary button</Label>
-        <PrimaryButton
-          data-automation-id='test'
-          disabled={ disabled }
-          checked={ checked }
-          text='Create account'
-          onClick={ () => alert('Clicked') }
-        />
-      </div>
-    );
-  }
-}

From 126f8036a2bc3e3b1ecb056db6e8d30f02d9ac3a Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 7 Sep 2017 17:57:07 -0700
Subject: [PATCH 0596/1641] DetailsList: fixing alignment, horiz scroll issues.
 (#2779)

* Fixing the checks which are messing up the rows in the details list and also screwing up the horizontal scroll.

* Adding change file.
---
 .../fix-check_2017-09-07-23-02.json                   | 11 +++++++++++
 .../src/components/DetailsList/DetailsRowCheck.scss   |  7 ++++++-
 2 files changed, 17 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-check_2017-09-07-23-02.json

diff --git a/common/changes/office-ui-fabric-react/fix-check_2017-09-07-23-02.json b/common/changes/office-ui-fabric-react/fix-check_2017-09-07-23-02.json
new file mode 100644
index 0000000000000..fabb645f5867f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-check_2017-09-07-23-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: Fixing alignment issues due to recent changes in Check.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
index 6dd484999fe3f..8982858c82e36 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
@@ -18,8 +18,13 @@
 }
 
 button.check {
-  padding: 3px;
+  height: 20px;
+  width: 20px;
+  padding: 0;
   margin: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
 
 .owner {

From 0f46f265f759e4793af2f424ce24bf18c5f579cd Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 7 Sep 2017 18:08:11 -0700
Subject: [PATCH 0597/1641] Fixing tslint.

---
 .../components/Button/CompoundButton/CompoundButton.styles.ts | 4 ----
 .../src/components/Button/PrimaryButton/PrimaryButton.tsx     | 3 ---
 .../src/components/Button/examples/Button.Default.Example.tsx | 2 +-
 3 files changed, 1 insertion(+), 8 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
index 9c773e8368784..6402b1142102d 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
@@ -16,10 +16,6 @@ import {
   standardStyles
 } from '../ButtonThemes';
 
-const DEFAULT_BUTTON_HEIGHT = '32px';
-const DEFAULT_BUTTON_MINWIDTH = '80px';
-const DEFAULT_PADDING = '0 16px';
-
 export const getStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: IButtonStyles,
diff --git a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
index dd09fb1675a06..abe548f86bccb 100644
--- a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
@@ -5,7 +5,6 @@ import { DefaultButton } from '../';
 import { IButtonProps } from '../Button.Props';
 
 @customizable([ThemeSettingName])
-
 export class PrimaryButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Set this BaseComponent._resolveComponentRef to false, bypassing resolution of componentRef.
@@ -13,8 +12,6 @@ export class PrimaryButton extends BaseComponent<IButtonProps, {}> {
   protected _shouldUpdateComponentRef = false;
 
   public render() {
-    const { theme, styles } = this.props;
-
     return (
       <DefaultButton
         { ...this.props }
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
index bfa33a6185c74..8177424c463cd 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { DefaultButton, PrimaryButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
+import { DefaultButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
 import { Label } from 'office-ui-fabric-react/lib/Label';
 
 export class ButtonDefaultExample extends React.Component<IButtonProps, {}> {

From ebde5bae7f28a13f3a838db51c63d66b1d2d1328 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Fri, 8 Sep 2017 00:00:26 -0700
Subject: [PATCH 0598/1641] Adjust alignments for Tile [experiments] (#2774)

* Fix alignment of Tile foreground and background using flexbox

* Update change output
---
 .../tile-background_2017-09-07-18-53.json           | 11 +++++++++++
 packages/experiments/src/components/Tile/Tile.scss  | 13 ++++++++++---
 packages/experiments/src/components/Tile/Tile.tsx   |  5 +----
 3 files changed, 22 insertions(+), 7 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/tile-background_2017-09-07-18-53.json

diff --git a/common/changes/@uifabric/experiments/tile-background_2017-09-07-18-53.json b/common/changes/@uifabric/experiments/tile-background_2017-09-07-18-53.json
new file mode 100644
index 0000000000000..220a7328739ce
--- /dev/null
+++ b/common/changes/@uifabric/experiments/tile-background_2017-09-07-18-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Fix alignment of Tile foreground and background using flexbox",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Tile/Tile.scss b/packages/experiments/src/components/Tile/Tile.scss
index 423dffebaa940..80c3a53a45dfd 100644
--- a/packages/experiments/src/components/Tile/Tile.scss
+++ b/packages/experiments/src/components/Tile/Tile.scss
@@ -95,7 +95,6 @@
 }
 
 .foreground {
-  margin: auto;
   position: relative;
   overflow: hidden;
   max-width: 100%;
@@ -107,8 +106,7 @@
     opacity: 0;
   }
 
-  &.hasForegroundFrame {
-    margin: auto auto 0 auto;
+  .hasForegroundFrame & {
     background-color: $ms-color-white;
     box-shadow: 0 1px 3px 1px rgba(1, 1, 0, 0.05);
 
@@ -168,6 +166,10 @@ button.check {
   right: 0;
   bottom: 0;
   overflow: hidden;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
 
   opacity: 1;
 
@@ -193,6 +195,11 @@ button.check {
   display: flex;
   flex-direction: column;
   align-items: center;
+  justify-content: center;
+
+  .hasForegroundFrame & {
+    justify-content: flex-end;
+  }
 }
 
 .nameplate {
diff --git a/packages/experiments/src/components/Tile/Tile.tsx b/packages/experiments/src/components/Tile/Tile.tsx
index 0b1e32de6669f..b81c2ff04031c 100644
--- a/packages/experiments/src/components/Tile/Tile.tsx
+++ b/packages/experiments/src/components/Tile/Tile.tsx
@@ -168,6 +168,7 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
           [`ms-Tile--isSmall ${TileStyles.isSmall}`]: tileSize === 'small',
           [`ms-Tile--isLarge ${TileStyles.isLarge}`]: tileSize === 'large',
           [`ms-Tile--hasBackgroundFrame ${TileStyles.hasBackgroundFrame}`]: showBackgroundFrame,
+          [`ms-Tile--hasForegroundFrame ${TileStyles.hasForegroundFrame}`]: showForegroundFrame,
           [`ms-Tile--isSelected ${TileStyles.selected} ${SignalStyles.selected}`]: isSelected,
           [`ms-Tile--isSelectable ${TileStyles.selectable}`]: isSelectable,
           [`ms-Tile--hasBackground ${TileStyles.hasBackground}`]: !!background,
@@ -193,7 +194,6 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
           {
             foreground ? this._onRenderForeground({
               foreground: foreground,
-              showForegroundFrame: showForegroundFrame,
               hideForeground
             }) : null
           }
@@ -233,11 +233,9 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
 
   private _onRenderForeground({
     foreground,
-    showForegroundFrame,
     hideForeground
   }: {
       foreground: React.ReactNode | React.ReactNode[];
-      showForegroundFrame: boolean;
       hideForeground: boolean;
     }): JSX.Element {
     return (
@@ -252,7 +250,6 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
           <span
             role='presentation'
             className={ css('ms-Tile-foreground', TileStyles.foreground, {
-              [`ms-Tile-foreground--hasFrame ${TileStyles.hasForegroundFrame}`]: showForegroundFrame,
               [`ms-Tile-foreground--hide ${TileStyles.foregroundHide}`]: hideForeground
             }) }
           >

From fb6dc35746f1388363589cce46d20c36ccb371d5 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 8 Sep 2017 10:16:28 +0000
Subject: [PATCH 0599/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../tile-background_2017-09-07-18-53.json     | 11 ---------
 .../tile-sizes_2017-09-06-23-27.json          | 11 ---------
 .../fix-check_2017-09-07-23-02.json           | 11 ---------
 .../scrolltoindex_2017-09-07-18-51.json       | 11 ---------
 packages/experiments/CHANGELOG.json           | 24 +++++++++++++++++++
 packages/experiments/CHANGELOG.md             | 10 +++++++-
 packages/experiments/package.json             |  4 ++--
 .../office-ui-fabric-react/CHANGELOG.json     | 21 ++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 13 +++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 14 files changed, 73 insertions(+), 53 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/tile-background_2017-09-07-18-53.json
 delete mode 100644 common/changes/@uifabric/experiments/tile-sizes_2017-09-06-23-27.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-check_2017-09-07-23-02.json
 delete mode 100644 common/changes/office-ui-fabric-react/scrolltoindex_2017-09-07-18-51.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 639088239a399..764b883216df1 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -44,7 +44,7 @@
     "@uifabric/example-app-base": ">=4.2.7 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=4.42.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.43.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index e2c2e581142e2..18f4cf58c5387 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.42.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.43.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index bc640f4d15503..cdccfd565c5d9 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -26,7 +26,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.42.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.43.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 011e8651fac23..03e5cab26c34a 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -24,7 +24,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=4.42.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.43.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/experiments/tile-background_2017-09-07-18-53.json b/common/changes/@uifabric/experiments/tile-background_2017-09-07-18-53.json
deleted file mode 100644
index 220a7328739ce..0000000000000
--- a/common/changes/@uifabric/experiments/tile-background_2017-09-07-18-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Fix alignment of Tile foreground and background using flexbox",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/tile-sizes_2017-09-06-23-27.json b/common/changes/@uifabric/experiments/tile-sizes_2017-09-06-23-27.json
deleted file mode 100644
index eb034aa3bdf82..0000000000000
--- a/common/changes/@uifabric/experiments/tile-sizes_2017-09-06-23-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Add breakpoint size support to Tile",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-check_2017-09-07-23-02.json b/common/changes/office-ui-fabric-react/fix-check_2017-09-07-23-02.json
deleted file mode 100644
index fabb645f5867f..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-check_2017-09-07-23-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: Fixing alignment issues due to recent changes in Check.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/scrolltoindex_2017-09-07-18-51.json b/common/changes/office-ui-fabric-react/scrolltoindex_2017-09-07-18-51.json
deleted file mode 100644
index ab405683d59bd..0000000000000
--- a/common/changes/office-ui-fabric-react/scrolltoindex_2017-09-07-18-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add scrollToIndex to GroupedList, DetailsList",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "spelliot@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index db9bc3d57b1b4..5dc3088d30f59 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "0.5.1",
+      "tag": "@uifabric/experiments_v0.5.1",
+      "date": "Fri, 08 Sep 2017 10:16:28 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "ebde5bae7f28a13f3a838db51c63d66b1d2d1328",
+            "comment": "Fix alignment of Tile foreground and background using flexbox"
+          },
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "20cf30afccaf99a2d1a92a642bfb0b9a1359c365",
+            "comment": "Add breakpoint size support to Tile"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.42.0 <5.0.0` to `>=4.43.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.5.0",
       "tag": "@uifabric/experiments_v0.5.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 044958599d609..590c9074a00ea 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Thu, 07 Sep 2017 10:09:51 GMT and should not be manually modified.
+This log was last generated on Fri, 08 Sep 2017 10:16:28 GMT and should not be manually modified.
+
+## 0.5.1
+Fri, 08 Sep 2017 10:16:28 GMT
+
+### Patches
+
+- Fix alignment of Tile foreground and background using flexbox
+- Add breakpoint size support to Tile
 
 ## 0.5.0
 Thu, 07 Sep 2017 10:09:51 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index c9b9118d9ac7b..3391f92354445 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "0.5.0",
+  "version": "0.5.1",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,7 +43,7 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/styling": ">=0.22.1 <1.0.0",
     "@uifabric/utilities": ">=4.13.0 <5.0.0",
-    "office-ui-fabric-react": ">=4.42.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.43.0 <5.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index ae8f36042fde6..955056938094a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,27 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.43.0",
+      "tag": "office-ui-fabric-react_v4.43.0",
+      "date": "Fri, 08 Sep 2017 10:16:28 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "126f8036a2bc3e3b1ecb056db6e8d30f02d9ac3a",
+            "comment": "DetailsList: Fixing alignment issues due to recent changes in Check."
+          }
+        ],
+        "minor": [
+          {
+            "author": "Spencer Elliott <me@elliottsj.com>",
+            "commit": "6857963fe1ac223c3224fb7a4361c7457983da95",
+            "comment": "Add scrollToIndex to GroupedList, DetailsList"
+          }
+        ]
+      }
+    },
     {
       "version": "4.42.0",
       "tag": "office-ui-fabric-react_v4.42.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index ceaf200fd0227..f4275b4f4b2f7 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 07 Sep 2017 10:09:51 GMT and should not be manually modified.
+This log was last generated on Fri, 08 Sep 2017 10:16:28 GMT and should not be manually modified.
+
+## 4.43.0
+Fri, 08 Sep 2017 10:16:28 GMT
+
+### Minor changes
+
+- Add scrollToIndex to GroupedList, DetailsList
+
+### Patches
+
+- DetailsList: Fixing alignment issues due to recent changes in Check.
 
 ## 4.42.0
 Thu, 07 Sep 2017 10:09:51 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 353fefe044ec2..d06e1d600e807 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.42.0",
+  "version": "4.43.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 61705c67b8b6ae1563f68f299242c14806977c64 Mon Sep 17 00:00:00 2001
From: LU Hu <luh@microsoft.com>
Date: Sat, 9 Sep 2017 04:48:56 +0800
Subject: [PATCH 0600/1641] Add tool tip for text of Persona (#2748)

* Add tool tip to text of Persona.

* Add change file.

* Use fabric tooltip
---
 .../master_2017-09-06-07-08.json                      | 11 +++++++++++
 .../src/components/Persona/Persona.tsx                |  6 +++++-
 2 files changed, 16 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/master_2017-09-06-07-08.json

diff --git a/common/changes/office-ui-fabric-react/master_2017-09-06-07-08.json b/common/changes/office-ui-fabric-react/master_2017-09-06-07-08.json
new file mode 100644
index 0000000000000..92e916e7e1327
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2017-09-06-07-08.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add tool tip to text of Persona.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "luh@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index abe16df9beeca..cd7ebad9aed3f 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -11,6 +11,7 @@ import {
 } from '../../Utilities';
 import { Icon } from '../../Icon';
 import { Image, ImageFit, ImageLoadState } from '../../Image';
+import { TooltipHost, TooltipOverflowMode } from '../../Tooltip';
 import {
   IPersonaProps,
   PersonaInitialsColor,
@@ -189,7 +190,10 @@ export class Persona extends BaseComponent<IPersonaProps, IPersonaState> {
   private _renderElement(text: string | undefined, className: string, render?: IRenderFunction<IPersonaProps>): JSX.Element {
     return (
       <div className={ className }>
-        { render ? render(this.props) : text }
+        { render
+          ? render(this.props)
+          : <TooltipHost content={ text } overflowMode={ TooltipOverflowMode.Parent }>{ text }</TooltipHost>
+        }
       </div>
     );
   }

From a19c7cc3986c2ef7e799f595fc46798fb5e09a48 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 8 Sep 2017 18:31:31 -0700
Subject: [PATCH 0601/1641] Check: Addressing issues found with IE11. (#2794)

* Fix.

* Adding change file.
---
 .../fix-check-again_2017-09-09-01-08.json             | 11 +++++++++++
 .../src/components/Check/Check.scss                   | 10 +++++-----
 2 files changed, 16 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-check-again_2017-09-09-01-08.json

diff --git a/common/changes/office-ui-fabric-react/fix-check-again_2017-09-09-01-08.json b/common/changes/office-ui-fabric-react/fix-check-again_2017-09-09-01-08.json
new file mode 100644
index 0000000000000..b4764a5093e48
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-check-again_2017-09-09-01-08.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Check: Updating css to look great on IE11.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.scss b/packages/office-ui-fabric-react/src/components/Check/Check.scss
index c65ac42c18899..48a561ea1369f 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.scss
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.scss
@@ -15,9 +15,6 @@ $checkBoxHeight: 18px;
   height: $checkBoxHeight;
   vertical-align: top;
   position: relative;
-  display: flex;
-  align-items: stretch;
-  justify-content: center;
 
   @include ms-user-select(none);
 
@@ -42,10 +39,14 @@ $checkBoxHeight: 18px;
 .circle,
 .check {
   font-size: $checkBoxHeight;
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: $checkBoxHeight;
+  height: $checkBoxHeight;
 }
 
 .circle {
-  position: absolute;
   color: $ms-color-neutralTertiaryAlt;
 
   @media screen and (-ms-high-contrast: active) {
@@ -58,7 +59,6 @@ $checkBoxHeight: 18px;
 }
 
 .check {
-  position: absolute;
   color: $ms-color-neutralTertiaryAlt;
   font-size: 16px;
 }

From a805612b2e1d8ecf0055b393811d0543a451e423 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Sat, 9 Sep 2017 01:39:37 +0000
Subject: [PATCH 0602/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../fix-check-again_2017-09-09-01-08.json     | 11 -----------
 .../master_2017-09-06-07-08.json              | 11 -----------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 10 files changed, 34 insertions(+), 29 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/fix-check-again_2017-09-09-01-08.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2017-09-06-07-08.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 764b883216df1..4be2564af5c71 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -44,7 +44,7 @@
     "@uifabric/example-app-base": ">=4.2.7 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=4.43.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.43.1 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 18f4cf58c5387..488644b764d5b 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.43.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.43.1 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index cdccfd565c5d9..07a99cd82381c 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -26,7 +26,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.43.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.43.1 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 03e5cab26c34a..891dad98b7666 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -24,7 +24,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=4.43.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.43.1 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/fix-check-again_2017-09-09-01-08.json b/common/changes/office-ui-fabric-react/fix-check-again_2017-09-09-01-08.json
deleted file mode 100644
index b4764a5093e48..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-check-again_2017-09-09-01-08.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Check: Updating css to look great on IE11.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2017-09-06-07-08.json b/common/changes/office-ui-fabric-react/master_2017-09-06-07-08.json
deleted file mode 100644
index 92e916e7e1327..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2017-09-06-07-08.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add tool tip to text of Persona.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "luh@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 3391f92354445..072ae9f5b0d18 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/styling": ">=0.22.1 <1.0.0",
     "@uifabric/utilities": ">=4.13.0 <5.0.0",
-    "office-ui-fabric-react": ">=4.43.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.43.1 <5.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 955056938094a..cdeecbde15790 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.43.1",
+      "tag": "office-ui-fabric-react_v4.43.1",
+      "date": "Sat, 09 Sep 2017 01:39:37 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "a19c7cc3986c2ef7e799f595fc46798fb5e09a48",
+            "comment": "Check: Updating css to look great on IE11."
+          },
+          {
+            "author": "LU Hu <luh@microsoft.com>",
+            "commit": "61705c67b8b6ae1563f68f299242c14806977c64",
+            "comment": "Add tool tip to text of Persona."
+          }
+        ]
+      }
+    },
     {
       "version": "4.43.0",
       "tag": "office-ui-fabric-react_v4.43.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index f4275b4f4b2f7..efe048c0de493 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 08 Sep 2017 10:16:28 GMT and should not be manually modified.
+This log was last generated on Sat, 09 Sep 2017 01:39:37 GMT and should not be manually modified.
+
+## 4.43.1
+Sat, 09 Sep 2017 01:39:37 GMT
+
+### Patches
+
+- Check: Updating css to look great on IE11.
+- Add tool tip to text of Persona.
 
 ## 4.43.0
 Fri, 08 Sep 2017 10:16:28 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index d06e1d600e807..dfab28c542567 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.43.0",
+  "version": "4.43.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From eca3d17992576760e7b6b55d74f2d7a2b85e3a21 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 8 Sep 2017 22:34:27 -0700
Subject: [PATCH 0603/1641] Adding getIconClassName helper to Fabric 4 to make
 the Fabric 5 transition easier. (#2790)

* Adding icon helpers.

* Adding change files.
---
 .../add-icon-helpers_2017-09-08-22-14.json    | 11 +++++++
 .../add-icon-helpers_2017-09-08-22-14.json    | 11 +++++++
 .../src/components/Icon/Icon.Props.ts         |  6 +---
 .../src/components/Icon/IconName.ts           |  6 +++-
 .../styling/src/classNames/IconClassNames.ts  |  5 ++-
 packages/styling/src/styles/IconCodes.ts      |  6 ++++
 .../styling/src/utilities/getIconClassName.ts | 33 +++++++++++++++++++
 packages/styling/src/utilities/index.ts       |  5 ++-
 8 files changed, 75 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/add-icon-helpers_2017-09-08-22-14.json
 create mode 100644 common/changes/office-ui-fabric-react/add-icon-helpers_2017-09-08-22-14.json
 create mode 100644 packages/styling/src/utilities/getIconClassName.ts

diff --git a/common/changes/@uifabric/styling/add-icon-helpers_2017-09-08-22-14.json b/common/changes/@uifabric/styling/add-icon-helpers_2017-09-08-22-14.json
new file mode 100644
index 0000000000000..5fca9542490d8
--- /dev/null
+++ b/common/changes/@uifabric/styling/add-icon-helpers_2017-09-08-22-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Adding the `getIconClassName` function, which will provide a way for partners to generate a given icon class name. This replaces the implicit `ms-Icon--*` pattern being used now, as well as using IconClassNames, which will go away in Fabric 5.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/add-icon-helpers_2017-09-08-22-14.json b/common/changes/office-ui-fabric-react/add-icon-helpers_2017-09-08-22-14.json
new file mode 100644
index 0000000000000..d83551b47c9c0
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/add-icon-helpers_2017-09-08-22-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Icon: tweaked `iconName` to take in a string, rather than IconCode. The type safety can't be enforced in Fabric 5 which will support whatever subsets the customer registers.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts b/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
index 91c093a1bc997..2c4e67fa6e2b6 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { IconName } from './IconName';
 import { IImageProps } from '../Image/Image.Props';
 import { IStyle } from '../../Styling';
 
@@ -37,11 +36,8 @@ export interface IIconStyles {
 export interface IIconProps extends React.HTMLAttributes<HTMLElement> {
   /**
    * The name of the icon to use from the icon font.
-   *
-   * @type {(IconName | string | null)}
-   * @memberOf IIconProps
    */
-  iconName?: IconName | string | null;
+  iconName?: string | null;
 
   /**
    * Optional styling for the elements within the Icon.
diff --git a/packages/office-ui-fabric-react/src/components/Icon/IconName.ts b/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
index 4a641588699bc..ed15b4021bad7 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
@@ -1,4 +1,8 @@
-// Please keep alphabetized
+/**
+ * This is being removed from the styling package in Fabric 5 and moved into a dedicated
+ * icons package.
+ * @deprecated
+ */
 export type IconName =
   // These icons are not in the font.
   'CustomIcon' |
diff --git a/packages/styling/src/classNames/IconClassNames.ts b/packages/styling/src/classNames/IconClassNames.ts
index fa0ed98f3caf4..e979e7edbe94f 100644
--- a/packages/styling/src/classNames/IconClassNames.ts
+++ b/packages/styling/src/classNames/IconClassNames.ts
@@ -4,7 +4,10 @@ import {
 } from '../utilities/index';
 
 /**
- * All class names for all Fabric icons.
+ * Deprecated: All class names for all Fabric icons.
+ * NOTE: This is deprecated, being replaced with a getIconClassName function.
+ *
+ * @deprecated
  */
 export const IconClassNames: {[key in keyof typeof IconCodes]?: string } = {};
 
diff --git a/packages/styling/src/styles/IconCodes.ts b/packages/styling/src/styles/IconCodes.ts
index e29766ff7a423..ab5efd03748f6 100644
--- a/packages/styling/src/styles/IconCodes.ts
+++ b/packages/styling/src/styles/IconCodes.ts
@@ -1,3 +1,9 @@
+/**
+ * This is being removed in Fabric 5 due to the need to support arbitrary icon names
+ * for variable subsetting. Please use getIconClassName if you need the icon code, or
+ * render an <Icon /> component which will abstract how the icon is rendered.
+ * @deprecated
+ */
 export const IconCodes = {
   /**
    * Icon code with the value '\uED68'.
diff --git a/packages/styling/src/utilities/getIconClassName.ts b/packages/styling/src/utilities/getIconClassName.ts
new file mode 100644
index 0000000000000..92cef84521729
--- /dev/null
+++ b/packages/styling/src/utilities/getIconClassName.ts
@@ -0,0 +1,33 @@
+import {
+  IconClassNames
+} from '../classNames/IconClassNames';
+
+let _lowerCaseIconMap: { [key: string]: string };
+
+/**
+ * Gets an icon classname, given an icon name (case insensitive.) The class name can be attached to
+ * an I tag with no additional classnames. This will render the icon code using a ::before pseudo-selector.
+ *
+ * @public
+ */
+export function getIconClassName(name: string): string {
+  if (!name) {
+    return '';
+  }
+
+  // Make the lookup case insensitive. Note that this implementation is different in Fabric 5, but this method
+  // is being added sooner to make it easier to transition products.
+  name = name.toLowerCase();
+
+  if (!_lowerCaseIconMap) {
+    _lowerCaseIconMap = {};
+
+    for (let iconName in IconClassNames) {
+      if (IconClassNames.hasOwnProperty(iconName)) {
+        _lowerCaseIconMap[iconName.toLowerCase()] = iconName;
+      }
+    }
+  }
+
+  return IconClassNames[_lowerCaseIconMap[name.toLowerCase()]] || '';
+}
diff --git a/packages/styling/src/utilities/index.ts b/packages/styling/src/utilities/index.ts
index 26d203ec8ceea..6b8f0bfb89ec9 100644
--- a/packages/styling/src/utilities/index.ts
+++ b/packages/styling/src/utilities/index.ts
@@ -6,4 +6,7 @@ export {
 } from './mergeStyleSets';
 export {
   buildClassMap
-} from './buildClassMap';
\ No newline at end of file
+} from './buildClassMap';
+export {
+  getIconClassName
+} from './getIconClassName';
\ No newline at end of file

From 59f40046748c54c5e82257f5639bd46a6ca4ce32 Mon Sep 17 00:00:00 2001
From: Serkan Inci <serkan.inci@hotmail.com>
Date: Sat, 9 Sep 2017 13:01:15 -0400
Subject: [PATCH 0604/1641] CommandBar: Fixing wrong positioning for overflow
 (#2776)

* Fixing wrong positioning for overflow menu, when overflow menu open and CommandBar is updated

* Adding config change.

* Update master_2017-09-07-20-08.json
---
 .../master_2017-09-07-20-08.json                      | 11 +++++++++++
 .../src/components/CommandBar/CommandBar.tsx          |  1 -
 2 files changed, 11 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/master_2017-09-07-20-08.json

diff --git a/common/changes/office-ui-fabric-react/master_2017-09-07-20-08.json b/common/changes/office-ui-fabric-react/master_2017-09-07-20-08.json
new file mode 100644
index 0000000000000..eaa74094a7012
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2017-09-07-20-08.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "CommandBar: Fixing wrong positioning for overflow menu, when overflow menu open and CommandBar is updated",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "serkani@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 37fdeb4fdd28d..ff13de70a054b 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -400,7 +400,6 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
   private _getStateFromProps(nextProps: ICommandBarProps): ICommandBarState {
     return {
       renderedItems: nextProps.items || [],
-      renderedOverflowItems: undefined,
       contextualMenuProps: this._getContextualMenuPropsAfterUpdate(
         nextProps.items.concat(nextProps.farItems!),
         nextProps.overflowItems!)!,

From 8276fbb7eeef8cdd3b496604925db8266be8922b Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 11 Sep 2017 10:08:07 +0000
Subject: [PATCH 0605/1641] Applying package updates.

---
 .../add-icon-helpers_2017-09-08-22-14.json    | 11 --------
 .../add-icon-helpers_2017-09-08-22-14.json    | 11 --------
 .../master_2017-09-07-20-08.json              | 11 --------
 packages/experiments/package.json             |  4 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 26 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 13 +++++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/CHANGELOG.json               | 14 ++++++++++
 packages/styling/CHANGELOG.md                 |  9 ++++++-
 packages/styling/package.json                 |  2 +-
 10 files changed, 65 insertions(+), 40 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/add-icon-helpers_2017-09-08-22-14.json
 delete mode 100644 common/changes/office-ui-fabric-react/add-icon-helpers_2017-09-08-22-14.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2017-09-07-20-08.json

diff --git a/common/changes/@uifabric/styling/add-icon-helpers_2017-09-08-22-14.json b/common/changes/@uifabric/styling/add-icon-helpers_2017-09-08-22-14.json
deleted file mode 100644
index 5fca9542490d8..0000000000000
--- a/common/changes/@uifabric/styling/add-icon-helpers_2017-09-08-22-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Adding the `getIconClassName` function, which will provide a way for partners to generate a given icon class name. This replaces the implicit `ms-Icon--*` pattern being used now, as well as using IconClassNames, which will go away in Fabric 5.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/add-icon-helpers_2017-09-08-22-14.json b/common/changes/office-ui-fabric-react/add-icon-helpers_2017-09-08-22-14.json
deleted file mode 100644
index d83551b47c9c0..0000000000000
--- a/common/changes/office-ui-fabric-react/add-icon-helpers_2017-09-08-22-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Icon: tweaked `iconName` to take in a string, rather than IconCode. The type safety can't be enforced in Fabric 5 which will support whatever subsets the customer registers.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2017-09-07-20-08.json b/common/changes/office-ui-fabric-react/master_2017-09-07-20-08.json
deleted file mode 100644
index eaa74094a7012..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2017-09-07-20-08.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "CommandBar: Fixing wrong positioning for overflow menu, when overflow menu open and CommandBar is updated",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "serkani@microsoft.com"
-}
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 072ae9f5b0d18..3ccd9715c1dd1 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -41,9 +41,9 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/styling": ">=0.22.1 <1.0.0",
+    "@uifabric/styling": ">=0.23.0 <1.0.0",
     "@uifabric/utilities": ">=4.13.0 <5.0.0",
-    "office-ui-fabric-react": ">=4.43.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.44.0 <5.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index cdeecbde15790..7b0e4a9593442 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.44.0",
+      "tag": "office-ui-fabric-react_v4.44.0",
+      "date": "Mon, 11 Sep 2017 10:08:07 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "eca3d17992576760e7b6b55d74f2d7a2b85e3a21",
+            "comment": "Icon: tweaked `iconName` to take in a string, rather than IconCode. The type safety can't be enforced in Fabric 5 which will support whatever subsets the customer registers."
+          }
+        ],
+        "patch": [
+          {
+            "author": "Serkan Inci <serkan.inci@hotmail.com>",
+            "commit": "59f40046748c54c5e82257f5639bd46a6ca4ce32",
+            "comment": "CommandBar: Fixing wrong positioning for overflow menu, when overflow menu open and CommandBar is updated"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.22.1 <1.0.0` to `>=0.23.0 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.43.1",
       "tag": "office-ui-fabric-react_v4.43.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index efe048c0de493..14ca7e41f6f4a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Sat, 09 Sep 2017 01:39:37 GMT and should not be manually modified.
+This log was last generated on Mon, 11 Sep 2017 10:08:07 GMT and should not be manually modified.
+
+## 4.44.0
+Mon, 11 Sep 2017 10:08:07 GMT
+
+### Minor changes
+
+- Icon: tweaked `iconName` to take in a string, rather than IconCode. The type safety can't be enforced in Fabric 5 which will support whatever subsets the customer registers.
+
+### Patches
+
+- CommandBar: Fixing wrong positioning for overflow menu, when overflow menu open and CommandBar is updated
 
 ## 4.43.1
 Sat, 09 Sep 2017 01:39:37 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index dfab28c542567..fcc2308d22360 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.43.1",
+  "version": "4.44.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/utilities": ">=4.13.0 <5.0.0",
-    "@uifabric/styling": ">=0.22.1 <1.0.0",
+    "@uifabric/styling": ">=0.23.0 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 0c0037248b3fb..4211789accc41 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.23.0",
+      "tag": "@uifabric/styling_v0.23.0",
+      "date": "Mon, 11 Sep 2017 10:08:07 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "eca3d17992576760e7b6b55d74f2d7a2b85e3a21",
+            "comment": "Adding the `getIconClassName` function, which will provide a way for partners to generate a given icon class name. This replaces the implicit `ms-Icon--*` pattern being used now, as well as using IconClassNames, which will go away in Fabric 5."
+          }
+        ]
+      }
+    },
     {
       "version": "0.22.1",
       "tag": "@uifabric/styling_v0.22.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index d250ef68e49f0..87870af0eb2f8 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Mon, 04 Sep 2017 10:16:56 GMT and should not be manually modified.
+This log was last generated on Mon, 11 Sep 2017 10:08:07 GMT and should not be manually modified.
+
+## 0.23.0
+Mon, 11 Sep 2017 10:08:07 GMT
+
+### Minor changes
+
+- Adding the `getIconClassName` function, which will provide a way for partners to generate a given icon class name. This replaces the implicit `ms-Icon--*` pattern being used now, as well as using IconClassNames, which will go away in Fabric 5.
 
 ## 0.22.1
 Mon, 04 Sep 2017 10:16:56 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 1b1b0d07b156e..e6d6e970987cb 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.22.1",
+  "version": "0.23.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 78da91b485c66020572cf39c8e89f480201f62c6 Mon Sep 17 00:00:00 2001
From: Su Su <s@warmsea.net>
Date: Mon, 11 Sep 2017 23:39:08 +0800
Subject: [PATCH 0606/1641] Mix native props to Nav items. (#2795)

* Mix native props to Nav items.

* Add change file.
---
 .../office-ui-fabric-react/nav_2017-09-09-14-56.json  | 11 +++++++++++
 .../office-ui-fabric-react/src/components/Nav/Nav.tsx |  3 +++
 2 files changed, 14 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/nav_2017-09-09-14-56.json

diff --git a/common/changes/office-ui-fabric-react/nav_2017-09-09-14-56.json b/common/changes/office-ui-fabric-react/nav_2017-09-09-14-56.json
new file mode 100644
index 0000000000000..cdc6159a597cd
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/nav_2017-09-09-14-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Mix native props to Nav items.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "s@warmsea.net"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
index 0fc55ecd91ed3..cc2863e1a95bc 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
@@ -3,6 +3,8 @@ import {
   autobind,
   BaseComponent,
   css,
+  divProperties,
+  getNativeProps,
   getRTL
 } from '../../Utilities';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
@@ -182,6 +184,7 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
 
     return (
       <div
+        { ...getNativeProps(link, divProperties) }
         key={ link.key || linkIndex }
         className={ css(
           'ms-Nav-compositeLink',

From 50f32d1f57ddc19896859706988532d802e58c21 Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Mon, 11 Sep 2017 09:20:39 -0700
Subject: [PATCH 0607/1641] Picker Fixes: fixed suggestionsHeaderText bug and
 backspace bug. (#2770)

* fixed two minor picker bugs

* adding in change file

* improved readability
---
 .../minor-pickerfixes_2017-09-07-16-52.json           | 11 +++++++++++
 .../src/components/pickers/BasePicker.tsx             |  2 ++
 .../components/pickers/Suggestions/Suggestions.tsx    | 10 +++++++---
 3 files changed, 20 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/minor-pickerfixes_2017-09-07-16-52.json

diff --git a/common/changes/office-ui-fabric-react/minor-pickerfixes_2017-09-07-16-52.json b/common/changes/office-ui-fabric-react/minor-pickerfixes_2017-09-07-16-52.json
new file mode 100644
index 0000000000000..1d307c8aaf599
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/minor-pickerfixes_2017-09-07-16-52.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Pickers: Fixed a bug where suggestionsHeaderText would not display, also fixed backspace event propagating even when it was handled.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index c7d73e8c35259..2e15ef718956d 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -421,6 +421,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
       case KeyCodes.backspace:
         this.onBackspace(ev);
+        ev.stopPropagation();
         break;
 
       case KeyCodes.del:
@@ -433,6 +434,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
         } else {
           this.onBackspace(ev);
         }
+        ev.stopPropagation();
         break;
 
       case KeyCodes.up:
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index d846814431b22..1cf2fefa6fbaf 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -82,7 +82,8 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
       resultsMaximumNumber,
       resultsFooterFull,
       resultsFooter,
-      suggestionsAvailableAlertText
+      suggestionsAvailableAlertText,
+      suggestionsHeaderText
     } = this.props;
 
     let noResults = () => {
@@ -91,8 +92,11 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
           { noResultsFoundText }
         </div> : null;
     };
-
-    let headerText = isMostRecentlyUsedVisible && mostRecentlyUsedHeaderText ? mostRecentlyUsedHeaderText : null;
+    // MostRecently Used text should supercede the header text if it's there and available.
+    let headerText: string | undefined = suggestionsHeaderText;
+    if (isMostRecentlyUsedVisible && mostRecentlyUsedHeaderText) {
+      headerText = mostRecentlyUsedHeaderText;
+    }
     let footerTitle = (suggestions.length >= (resultsMaximumNumber as number)) ? resultsFooterFull : resultsFooter;
     return (
       <div

From ec3bd72dd9a215594f95bd18ade01676ceefeb29 Mon Sep 17 00:00:00 2001
From: Christopher Schleiden <cschleiden@live.de>
Date: Mon, 11 Sep 2017 09:57:45 -0700
Subject: [PATCH 0608/1641] DetailsList: Use keys for _activeRows management
 (#2778)

* DetailsList: Use keys for _activeRows management

* Fix formatting

* CR feedback

* Update users-cschleid-useKeyForActiveRows_2017-09-07-21-59.json

Dummy commit to trigger build
---
 ...-useKeyForActiveRows_2017-09-07-21-59.json | 11 ++++
 .../components/DetailsList/DetailsList.tsx    | 52 ++++++++++++++-----
 2 files changed, 49 insertions(+), 14 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-cschleid-useKeyForActiveRows_2017-09-07-21-59.json

diff --git a/common/changes/office-ui-fabric-react/users-cschleid-useKeyForActiveRows_2017-09-07-21-59.json b/common/changes/office-ui-fabric-react/users-cschleid-useKeyForActiveRows_2017-09-07-21-59.json
new file mode 100644
index 0000000000000..448a117c90c01
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-cschleid-useKeyForActiveRows_2017-09-07-21-59.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: Update activeRows management to use item keys",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "cschleid@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 437b01d1379ce..13904d3ae5c78 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -133,9 +133,13 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
 
   public componentDidUpdate(prevProps: any, prevState: any) {
     if (this._initialFocusedIndex !== undefined) {
-      const row = this._activeRows[this._initialFocusedIndex];
-      if (row) {
-        this._setFocusToRowIfPending(row);
+      const item = this.props.items[this._initialFocusedIndex];
+      if (item) {
+        const itemKey = this._getItemKey(item, this._initialFocusedIndex);
+        const row = this._activeRows[itemKey];
+        if (row) {
+          this._setFocusToRowIfPending(row);
+        }
       }
     }
 
@@ -463,21 +467,21 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   }
 
   private _onRowDidMount(row: DetailsRow) {
-    let { onRowDidMount } = this.props;
-    let index = row.props.itemIndex;
-
-    this._activeRows[index] = row; // this is used for column auto resize
+    const { item, itemIndex } = row.props;
+    const itemKey = this._getItemKey(item, itemIndex);
+    this._activeRows[itemKey] = row; // this is used for column auto resize
 
     this._setFocusToRowIfPending(row);
 
+    const { onRowDidMount } = this.props;
     if (onRowDidMount) {
-      onRowDidMount(row.props.item, index);
+      onRowDidMount(item, itemIndex);
     }
   }
 
   private _setFocusToRowIfPending(row: DetailsRow) {
-    let index = row.props.itemIndex;
-    if (this._initialFocusedIndex !== undefined && index === this._initialFocusedIndex) {
+    const { itemIndex } = row.props;
+    if (this._initialFocusedIndex !== undefined && itemIndex === this._initialFocusedIndex) {
       if (this._selectionZone) {
         this._selectionZone.ignoreNextFocus();
       }
@@ -491,12 +495,13 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
 
   private _onRowWillUnmount(row: DetailsRow) {
     let { onRowWillUnmount } = this.props;
-    let index = row.props.itemIndex;
 
-    delete this._activeRows[index];
-    this._events.off(row.refs.root);
+    const { item, itemIndex } = row.props;
+    const itemKey = this._getItemKey(item, itemIndex);
+    delete this._activeRows[itemKey];
+
     if (onRowWillUnmount) {
-      onRowWillUnmount(row.props.item, index);
+      onRowWillUnmount(item, itemIndex);
     }
   }
 
@@ -719,6 +724,25 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       onActiveItemChanged(items[index], index, ev);
     }
   }
+
+  private _getItemKey(item: any, itemIndex: number): string | number {
+    const { getKey } = this.props;
+
+    let itemKey: string | number | undefined = undefined;
+    if (item) {
+      itemKey = item.key;
+    }
+
+    if (getKey) {
+      itemKey = getKey(item, itemIndex);
+    }
+
+    if (!itemKey) {
+      itemKey = itemIndex;
+    }
+
+    return itemKey;
+  }
 }
 
 export function buildColumns(

From 1b885ff4a5b392b121d8251ccf2601d667e2e946 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Mon, 11 Sep 2017 12:19:24 -0500
Subject: [PATCH 0609/1641] SplitButton: Menu target should be the entire
 control instead (#2798)

* Make the target for the split button menu be the entire button instead of just the menu launcher.

* Rush change

* Use resolve ref
---
 .../split-button-menu-anchor_2017-09-11-13-13.json    | 11 +++++++++++
 .../src/components/Button/BaseButton.tsx              |  4 +++-
 2 files changed, 14 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/split-button-menu-anchor_2017-09-11-13-13.json

diff --git a/common/changes/office-ui-fabric-react/split-button-menu-anchor_2017-09-11-13-13.json b/common/changes/office-ui-fabric-react/split-button-menu-anchor_2017-09-11-13-13.json
new file mode 100644
index 0000000000000..86a6aaf7a2b9f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/split-button-menu-anchor_2017-09-11-13-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SplitButton: Update the menu launcher target for a split button to be the entire control instead of just the menu launching portion",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 18f3d87fa676c..8e0cd4a9d9395 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -46,6 +46,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   };
 
   private _buttonElement: HTMLElement;
+  private _splitButtonContainer: HTMLElement;
   private _labelId: string;
   private _descriptionId: string;
   private _ariaDescriptionId: string;
@@ -341,7 +342,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         directionalHint={ DirectionalHint.bottomLeftEdge }
         {...menuProps}
         className={ 'ms-BaseButton-menuhost ' + menuProps.className }
-        target={ this._buttonElement }
+        target={ this._isSplitButton ? this._splitButtonContainer : this._buttonElement }
         labelElementId={ this._labelId }
         onDismiss={ this._onToggleMenu }
       />
@@ -373,6 +374,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         className={ css(disabled ? styles!.splitButtonContainerDisabled : styles!.splitButtonContainer) }
         tabIndex={ 0 }
         onKeyDown={ this.props.disabled ? undefined : this._onSplitButtonKeyDown }
+        ref={ this._resolveRef('_splitButtonContainer') }
       >
         <span aria-hidden={ true } style={ { 'display': 'flex' } }>
           { this._onRenderContent(tag, buttonProps) }

From 4507629a84b12d34710a1c4a3dcdcfb1d0cd3706 Mon Sep 17 00:00:00 2001
From: Boris Emorine <boris.emorine@gmail.com>
Date: Mon, 11 Sep 2017 11:42:16 -0700
Subject: [PATCH 0610/1641] Menu Sections (#2515)

* Implement color scheme in the ContextualMenu control to enable alternative theming.

* Implement the bar and unit tests and component page

* Revert "Implement color scheme in the ContextualMenu control to enable alternative theming."

This reverts commit 4f830cd8c55269368e73bfc6d0cd69430776b977.

* Don't render an empty icon for an icon-less header menu item.

* Revert "Implement Document Title Bar"

* Add section to contextual menus.

* Add change log

* Minor fixes

* Fix unnecessary ternary

* Merge styles withing classNames file for ContextualMenu

* Update ContextualMenu.classNames.ts

* Update ContextualMenu.tsx

* Update ContextualMenu.tsx
---
 .../boemor-menuSections_2017-08-16-01-53.json |  11 +
 .../ContextualMenu/ContextualMenu.Props.ts    |  55 ++++-
 .../ContextualMenu.classNames.ts              |  28 +++
 .../ContextualMenu/ContextualMenu.test.tsx    |  49 +++++
 .../ContextualMenu/ContextualMenu.tsx         | 125 +++++++++---
 .../ContextualMenu/ContextualMenuPage.tsx     |   5 +
 .../examples/ContextualMenu.Basic.Example.tsx |   1 +
 .../ContextualMenu.Section.Example.tsx        | 193 ++++++++++++++++++
 8 files changed, 438 insertions(+), 29 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/boemor-menuSections_2017-08-16-01-53.json
 create mode 100644 packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/boemor-menuSections_2017-08-16-01-53.json b/common/changes/office-ui-fabric-react/boemor-menuSections_2017-08-16-01-53.json
new file mode 100644
index 0000000000000..2f78d6a5dd370
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/boemor-menuSections_2017-08-16-01-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add sections to contextual menus",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "boemor@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
index dd14b8a1edac6..07c09adc9ae11 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
@@ -4,6 +4,7 @@ import { DirectionalHint } from '../../common/DirectionalHint';
 import { FocusZoneDirection } from '../../FocusZone';
 import { IIconProps } from '../Icon/Icon.Props';
 import { ICalloutProps } from '../../Callout';
+import { ITheme, IStyle } from '../../Styling';
 import {
   IPoint,
   IRectangle,
@@ -15,7 +16,8 @@ export { DirectionalHint } from '../../common/DirectionalHint';
 export enum ContextualMenuItemType {
   Normal = 0,
   Divider = 1,
-  Header = 2
+  Header = 2,
+  Section = 3
 }
 
 export interface IContextualMenu {
@@ -183,6 +185,21 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
    */
   calloutProps?: ICalloutProps;
 
+  /**
+   * Optional title to be displayed on top of the menu.
+   */
+  title?: string;
+
+  /**
+   * Custom styling for the contextual menu.
+   */
+  styles?: IContextualMenuStyles;
+
+  /**
+   * Theme provided by HOC.
+   */
+  theme?: ITheme;
+
   /** Method to call when trying to render a submenu. */
   onRenderSubMenu?: IRenderFunction<IContextualMenuProps>;
 }
@@ -285,6 +302,12 @@ export interface IContextualMenuItem {
    */
   subMenuProps?: IContextualMenuProps;
 
+  /**
+   *  Properties to apply to render this item as a section.
+   *  This prop is mutually exclusive with subMenuProps.
+   */
+  sectionProps?: IContextualMenuSection;
+
   /**
    * Additional css class to apply to the menu item
    * @defaultvalue undefined
@@ -334,3 +357,33 @@ export interface IContextualMenuItem {
    */
   [propertyName: string]: any;
 }
+
+export interface IContextualMenuSection extends React.Props<ContextualMenu> {
+
+  /**
+   * The items to include inside the section.
+   */
+  items: IContextualMenuItem[];
+
+  /**
+   * The optional section title.
+   */
+  title?: IContextualMenuItem;
+
+  /**
+   * If set to true, the section will display a divider at the top of the section.
+   */
+  topDivider?: boolean;
+
+  /**
+   * If set to true, the section will display a divider at the bottom of the section.
+   */
+  bottomDivider?: boolean;
+}
+
+export interface IContextualMenuStyles {
+  /**
+   * Style override for the contextual menu title.
+   */
+  title: IStyle;
+}
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
new file mode 100644
index 0000000000000..e056f7f4ad8be
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
@@ -0,0 +1,28 @@
+import { memoizeFunction } from '../../Utilities';
+import { mergeStyleSets, ITheme } from '../../Styling';
+import { IContextualMenuStyles } from './ContextualMenu.Props';
+
+export interface IContextualMenuClassNames {
+  title?: string;
+}
+
+export const getClassNames = memoizeFunction((
+  styles: IContextualMenuStyles,
+  theme: ITheme,
+): IContextualMenuClassNames => {
+
+  styles = styles || {};
+
+  return mergeStyleSets({
+    title: [{
+      fontSize: '16px',
+      paddingRight: '14px',
+      paddingLeft: '14px',
+      paddingBottom: '5px',
+      paddingTop: '5px',
+      backgroundColor: theme.palette.neutralLight
+    },
+    styles.title
+    ]
+  });
+});
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
index c6ca1fb463562..baa47df069e0a 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
@@ -244,6 +244,55 @@ describe('ContextualMenu', () => {
     expect(headerTwo.firstElementChild!.className).to.contain('header', 'The final item was not a header');
   });
 
+  it('renders sections properly', () => {
+    const items: IContextualMenuItem[] = [
+      {
+        name: 'TestText 1',
+        key: 'TestKey1',
+        itemType: ContextualMenuItemType.Section,
+        sectionProps: {
+          topDivider: true,
+          bottomDivider: true,
+          items: [
+            {
+              name: 'TestText 2',
+              key: 'TestKey3'
+            },
+            {
+              name: 'TestText 3',
+              key: 'TestKey3',
+            }
+          ]
+        }
+      }, {
+        name: 'TestText 4',
+        key: 'TestKey4',
+        itemType: ContextualMenuItemType.Section,
+        sectionProps: {
+          items: [
+            {
+              name: 'TestText 5',
+              key: 'TestKey5'
+            },
+            {
+              name: 'TestText 6',
+              key: 'TestKey6',
+            }
+          ]
+        }
+      }
+    ];
+
+    ReactTestUtils.renderIntoDocument<ContextualMenu>(
+      <ContextualMenu
+        items={ items }
+      />
+    );
+
+    let menuItems = document.querySelectorAll('li');
+    expect(menuItems.length).to.be.eq(8, 'This menu has an incorrect number of items');
+  });
+
   it('does not return a value if no items are given', () => {
     ReactTestUtils.renderIntoDocument<ContextualMenu>(
       <ContextualMenu
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 44011dbdee363..165512dabc4e7 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -2,6 +2,8 @@ import * as React from 'react';
 import { IContextualMenuProps, IContextualMenuItem, ContextualMenuItemType } from './ContextualMenu.Props';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
+import { getClassNames } from './ContextualMenu.classNames';
+import { ThemeSettingName } from '../../Styling';
 import {
   BaseComponent,
   anchorProperties,
@@ -14,7 +16,8 @@ import {
   autobind,
   KeyCodes,
   getDocument,
-  getWindow
+  getWindow,
+  customizable
 } from '../../Utilities';
 import { withResponsiveMode, ResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
 import { Callout } from '../../Callout';
@@ -67,6 +70,7 @@ function getIsChecked(item: IContextualMenuItem): boolean | null | undefined {
   return null;
 }
 
+@customizable([ThemeSettingName])
 @withResponsiveMode
 export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContextualMenuState> {
   // The default ContextualMenu properties have no items and beak, the default submenu direction is right and top.
@@ -165,10 +169,30 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       useTargetWidth,
       directionalHintFixed,
       shouldFocusOnMount,
+      title,
+      styles: customStyles,
+      theme,
       calloutProps,
-      onRenderSubMenu = this._onRenderSubMenu } = this.props;
+      onRenderSubMenu = this._onRenderSubMenu
+    } = this.props;
+
+    const classNames = getClassNames(customStyles!, theme!);
+    let hasIcons = itemsHaveIcons(items);
+
+    function itemsHaveIcons(contextualMenuItems: IContextualMenuItem[]): boolean {
+      for (const item of contextualMenuItems) {
+        if (!!item.icon || !!item.iconProps) {
+          return true;
+        }
+
+        if (item.itemType === ContextualMenuItemType.Section && item.sectionProps && itemsHaveIcons(item.sectionProps.items)) {
+          return true;
+        }
+      }
+
+      return false;
+    }
 
-    let hasIcons = !!(items && items.some(item => !!item.icon || !!item.iconProps));
     let hasCheckmarks = !!(items && items.some(item => !!item.canCheck));
     const submenuProps = this.state.expandedMenuItemKey ? this._getSubmenuProps() : null;
 
@@ -216,6 +240,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
           directionalHintFixed={ directionalHintFixed }
         >
           <div style={ contextMenuStyle } ref={ (host: HTMLDivElement) => this._host = host } id={ id } className={ css('ms-ContextualMenu-container', className) }>
+            { title && <div className={ classNames.title } role='heading' aria-level={ 1 }> { title } </div> }
             { (items && items.length) ? (
               <FocusZone
                 className={ css('ms-ContextualMenu is-open', styles.root) }
@@ -254,11 +279,9 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
   private _renderMenuItem(item: IContextualMenuItem, index: number, focusableElementIndex: number, totalItemCount: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
     let renderedItems: React.ReactNode[] = [];
-
     if (item.name === '-') {
       item.itemType = ContextualMenuItemType.Divider;
     }
-
     switch (item.itemType) {
       case ContextualMenuItemType.Divider:
         renderedItems.push(this._renderSeparator(index, item.className));
@@ -268,6 +291,9 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
         let headerItem = this._renderHeaderMenuItem(item, index, hasCheckmarks, hasIcons);
         renderedItems.push(this._renderListItem(headerItem, item.key || index, item.className, item.title));
         break;
+      case ContextualMenuItemType.Section:
+        renderedItems.push(this._renderSectionItem(item, index, hasCheckmarks, hasIcons));
+        break;
       default:
         let menuItem = this._renderNormalItem(item, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons);
         renderedItems.push(this._renderListItem(menuItem, item.key || index, item.className, item.title));
@@ -277,24 +303,57 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     return renderedItems;
   }
 
+  private _renderSectionItem(item: IContextualMenuItem, index: number, hasCheckmarks: boolean, hasIcons: boolean) {
+    const section = item.sectionProps;
+    if (!section) {
+      return;
+    }
+
+    let headerItem = section.title && this._renderHeaderMenuItem(section.title, index, hasCheckmarks, hasIcons);
+
+    if (section.items && section.items.length > 0) {
+      return (
+        <li
+          role='presentation'
+          key={ section.key }
+        >
+          <div role='group'>
+            <ul className={ css('ms-ContextualMenu-list is-open', styles.list) }>
+              { section.topDivider && this._renderSeparator(index, undefined, true, true) }
+              { headerItem && this._renderListItem(headerItem, item.key || index, item.className, item.title) }
+              { section.items.map((contextualMenuItem, itemsIndex) => (
+                this._renderMenuItem(contextualMenuItem, itemsIndex, itemsIndex, section.items.length, hasCheckmarks, hasIcons)
+              )) }
+              { section.bottomDivider && this._renderSeparator(index, undefined, false, true) }
+            </ul>
+          </div>
+        </li>
+      );
+    }
+  }
+
   private _renderListItem(content: React.ReactNode, key: string | number, className?: string, title?: string) {
-    return <li
-      role='presentation'
-      title={ title }
-      key={ key }
-      className={ css('ms-ContextualMenu-item', styles.item, className) }
-    >
-      { content }
-    </li>;
-  }
-
-  private _renderSeparator(index: number, className?: string): React.ReactNode {
-    if (index > 0) {
-      return <li
-        role='separator'
-        key={ 'separator-' + index }
-        className={ css('ms-ContextualMenu-divider', styles.divider, className) }
-      />;
+    return (
+      <li
+        role='presentation'
+        title={ title }
+        key={ key }
+        className={ css('ms-ContextualMenu-item', styles.item, className) }
+      >
+        { content }
+      </li>
+    );
+  }
+
+  private _renderSeparator(index: number, className?: string, top?: boolean, fromSection?: boolean): React.ReactNode {
+    if (fromSection || index > 0) {
+      return (
+        <li
+          role='separator'
+          key={ 'separator-' + index + (top === undefined ? '' : (top ? '-top' : '-bottom')) }
+          className={ css('ms-ContextualMenu-divider', styles.divider, className) }
+        />
+      );
     }
     return null;
   }
@@ -311,7 +370,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
   private _renderHeaderMenuItem(item: IContextualMenuItem, index: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
     return (
-      <div className={ css('ms-ContextualMenu-header', styles.header) } style={ item.style }>
+      <div className={ css('ms-ContextualMenu-header', styles.header) } style={ item.style } role='heading' aria-level={ this.props.title ? 2 : 1 }>
         { this._renderMenuItemChildren(item, index, hasCheckmarks, hasIcons) }
       </div>);
   }
@@ -416,7 +475,6 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
   private _renderIcon(item: IContextualMenuItem) {
     // Only present to allow continued use of item.icon which is deprecated.
-
     let iconProps: IIconProps = item.iconProps ? item.iconProps : {
       iconName: item.icon
     };
@@ -512,7 +570,6 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       if (this.state.expandedMenuItemKey) {
         this._onSubMenuDismiss();
       }
-
       this.setState({
         expandedMenuItemKey: item.key,
         submenuTarget: target
@@ -542,15 +599,27 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
         assign(submenuProps, item.subMenuProps);
       }
     }
-
     return submenuProps;
-
   }
 
   private _findItemByKey(key: string): IContextualMenuItem | undefined {
     let { items } = this.props;
+    return this._findItemByKeyFromItems(key, items);
+  }
+
+  /**
+   * Returns the item that mathes a given key if any.
+   * @param key The key of the item to match
+   * @param items The items to look for the key
+   */
+  private _findItemByKeyFromItems(key: string, items: IContextualMenuItem[]): IContextualMenuItem | undefined {
     for (const item of items) {
-      if (item.key && item.key === key) {
+      if (item.itemType === ContextualMenuItemType.Section && item.sectionProps) {
+        const match = this._findItemByKeyFromItems(key, item.sectionProps.items);
+        if (match) {
+          return match;
+        }
+      } else if (item.key && item.key === key) {
         return item;
       }
     }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
index 6f819c6988d69..436dd67fe6a75 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
@@ -6,12 +6,14 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { ContextualMenuBasicExample } from './examples/ContextualMenu.Basic.Example';
+import { ContextualMenuSectionExample } from './examples/ContextualMenu.Section.Example';
 import { ContextualMenuCheckmarksExample } from './examples/ContextualMenu.Checkmarks.Example';
 import { ContextualMenuDirectionalExample } from './examples/ContextualMenu.Directional.Example';
 import { ContextualMenuCustomizationExample } from './examples/ContextualMenu.Customization.Example';
 import { ContextualMenuHeaderExample } from './examples/ContextualMenu.Header.Example';
 
 const ContextualMenuBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx') as string;
+const ContextualMenuSectionExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx') as string;
 const ContextualMenuCheckmarksExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx') as string;
 const ContextualMenuDirectionalExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx') as string;
 const ContextualMenuCustomizationExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx') as string;
@@ -28,6 +30,9 @@ export class ContextualMenuPage extends React.Component<IComponentDemoPageProps,
             <ExampleCard title='ContextualMenu' code={ ContextualMenuBasicExampleCode }>
               <ContextualMenuBasicExample />
             </ExampleCard>
+            <ExampleCard title='ContextualMenu section example' code={ ContextualMenuSectionExampleCode }>
+              <ContextualMenuSectionExample />
+            </ExampleCard>
             <ExampleCard title='ContextualMenu checked menus example' code={ ContextualMenuCheckmarksExampleCode }>
               <ContextualMenuCheckmarksExample />
             </ExampleCard>
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx
index 870c602ed044c..24e3d4af2f275 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx
@@ -25,6 +25,7 @@ export class ContextualMenuBasicExample extends React.Component<any, any> {
         <DefaultButton onClick={ this._onClick } id='ContextualMenuButton1' text='Click for ContextualMenu' />
         { this.state.isContextMenuVisible ? (
           <ContextualMenu
+            title='My Menu'
             shouldFocusOnMount={ true }
             target={ this.state.target }
             onDismiss={ this._onDismiss }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx
new file mode 100644
index 0000000000000..daeaf5fa36cbc
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx
@@ -0,0 +1,193 @@
+import * as React from 'react';
+import { ContextualMenu, ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { Callout, DirectionalHint } from 'office-ui-fabric-react/lib/Callout';
+import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
+import { getRTL } from 'office-ui-fabric-react/lib/Utilities';
+import './ContextualMenuExample.scss';
+
+export class ContextualMenuSectionExample extends React.Component<any, any> {
+
+  constructor() {
+    super();
+    this.state = {
+      isContextMenuVisible: false,
+      showCallout: false
+    };
+    this._onClick = this._onClick.bind(this);
+    this._onDismiss = this._onDismiss.bind(this);
+  }
+
+  public render() {
+    let { showCallout } = this.state;
+
+    return (
+      <div>
+        <DefaultButton onClick={ this._onClick } id='ContextualMenuButton1' text='Click for ContextualMenu' />
+        { this.state.isContextMenuVisible ? (
+          <ContextualMenu
+            shouldFocusOnMount={ true }
+            target={ this.state.target }
+            onDismiss={ this._onDismiss }
+            title='My Menu'
+            directionalHint={ getRTL() ? DirectionalHint.bottomRightEdge : DirectionalHint.bottomLeftEdge }
+            items={
+              [
+                {
+                  key: 'section',
+                  itemType: ContextualMenuItemType.Section,
+                  sectionProps: {
+                    topDivider: true,
+                    bottomDivider: true,
+                    title: {
+                      key: 'Actions',
+                      itemType: ContextualMenuItemType.Header,
+                      name: 'Actions'
+                    },
+                    items: [
+                      {
+                        key: 'newItem',
+                        name: 'New',
+                        iconProps: {
+                          iconName: 'Add'
+                        },
+                        subMenuProps: {
+                          items: [
+                            {
+                              key: 'emailMessage',
+                              name: 'Email message',
+                              title: 'Create an email'
+                            },
+                            {
+                              key: 'calendarEvent',
+                              name: 'Calendar event',
+                              title: 'Create a calendar event',
+                            }
+                          ],
+                        }
+                      },
+                      {
+                        key: 'upload',
+                        onClick: () => {
+                          this.setState({ showCallout: true });
+                        },
+                        iconProps: {
+                          iconName: 'Upload',
+                          style: {
+                            color: 'salmon'
+                          }
+                        },
+                        name: 'Upload (Custom Color)',
+                        title: 'Upload a file'
+                      }
+                    ]
+                  }
+                },
+                {
+                  key: 'section',
+                  itemType: ContextualMenuItemType.Section,
+                  sectionProps: {
+                    title: {
+                      key: 'Navigation',
+                      itemType: ContextualMenuItemType.Header,
+                      name: 'Social'
+                    },
+                    items: [
+                      {
+                        key: 'share',
+                        iconProps: {
+                          iconName: 'Share'
+                        },
+                        subMenuProps: {
+                          items: [
+                            {
+                              key: 'sharetoemail',
+                              name: 'Share to Email',
+                              iconProps: {
+                                iconName: 'Mail'
+                              },
+                            },
+                            {
+                              key: 'sharetofacebook',
+                              name: 'Share to Facebook',
+                            },
+                            {
+                              key: 'sharetotwitter',
+                              name: 'Share to Twitter',
+                              iconProps: {
+                                iconName: 'Share'
+                              },
+                              subMenuProps: {
+                                items: [
+                                  {
+                                    key: 'sharetoemail_1',
+                                    name: 'Share to Email',
+                                    title: 'Share to Email',
+                                    iconProps: {
+                                      iconName: 'Mail'
+                                    },
+                                  },
+                                  {
+                                    key: 'sharetofacebook_1',
+                                    name: 'Share to Facebook',
+                                    title: 'Share to Facebook',
+                                  },
+                                  {
+                                    key: 'sharetotwitter_1',
+                                    name: 'Share to Twitter',
+                                    title: 'Share to Twitter',
+                                    iconProps: {
+                                      iconName: 'Share'
+                                    }
+                                  },
+                                ],
+                              },
+                            },
+                          ],
+                        },
+                        name: 'Share'
+                      },
+                      {
+                        key: 'print',
+                        iconProps: {
+                          iconName: 'Print'
+                        },
+                        name: 'Print'
+                      },
+                      {
+                        key: 'music',
+                        iconProps: {
+                          iconName: 'MusicInCollectionFill'
+                        },
+                        name: 'Music',
+                      },
+
+                    ]
+                  }
+                }
+              ]
+            }
+          />) : (null) }
+
+        { showCallout && (
+          <Callout
+            setInitialFocus={ true }
+            onDismiss={ () => this.setState({ showCallout: false }) }
+          >
+            <DefaultButton
+              onClick={ () => this.setState({ showCallout: false }) }
+              text='Hello world'
+            />
+          </Callout>
+        ) }
+      </div>
+    );
+  }
+
+  private _onClick(event: React.MouseEvent<any>) {
+    this.setState({ target: event.currentTarget, isContextMenuVisible: true });
+  }
+
+  private _onDismiss(event: any) {
+    this.setState({ isContextMenuVisible: false });
+  }
+}

From ac1613307947170307bd3df04c193d45c02f85f2 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Mon, 11 Sep 2017 15:11:04 -0500
Subject: [PATCH 0611/1641] Button: Add support for adding a divider for Split
 Buttons (#2780)

* Add a function that allows rendering a divider between the menu button and main button for a split button

* Rush change

* Get split button classnames

* Extract a function for rendering the divider.

* Fix tslint.

* Extract split button example styles to another file

* Remove unused import, add missing semicolon
---
 ...split-button-divider_2017-09-08-00-37.json | 11 ++++++++
 .../src/components/Button/BaseButton.tsx      | 27 ++++++++++++-------
 .../src/components/Button/Button.Props.ts     |  6 +++++
 .../SplitButton/SplitButton.classNames.ts     |  4 ++-
 .../examples/Button.Split.Example.styles.ts   | 10 +++++++
 .../Button/examples/Button.Split.Example.tsx  |  7 ++---
 6 files changed, 51 insertions(+), 14 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/split-button-divider_2017-09-08-00-37.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.styles.ts

diff --git a/common/changes/office-ui-fabric-react/split-button-divider_2017-09-08-00-37.json b/common/changes/office-ui-fabric-react/split-button-divider_2017-09-08-00-37.json
new file mode 100644
index 0000000000000..bc638fca7b354
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/split-button-divider_2017-09-08-00-37.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Button: Add support for dividers in split buttons",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 8e0cd4a9d9395..dcdc77f75dbe5 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -17,7 +17,7 @@ import { DirectionalHint } from '../../common/DirectionalHint';
 import { ContextualMenu, IContextualMenuProps } from '../../ContextualMenu';
 import { IButtonProps, IButton } from './Button.Props';
 import { IButtonClassNames, getClassNames } from './BaseButton.classNames';
-import { getClassNames as getSplitButtonClassNames } from './SplitButton/SplitButton.classNames';
+import { getClassNames as getSplitButtonClassNames, ISplitButtonClassNames } from './SplitButton/SplitButton.classNames';
 
 export interface IBaseButtonProps extends IButtonProps {
   baseClassName?: string;
@@ -360,9 +360,12 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   private _onRenderSplitButtonContent(tag: any, buttonProps: IButtonProps): JSX.Element {
     const {
       styles,
-      disabled
+      disabled,
+      checked
     } = this.props;
 
+    const classNames = styles && getSplitButtonClassNames(styles!, !!disabled, !!this.state.menuProps, !!checked);
+
     return (
       <div
         aria-labelledby={ buttonProps.ariaLabel }
@@ -376,21 +379,27 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         onKeyDown={ this.props.disabled ? undefined : this._onSplitButtonKeyDown }
         ref={ this._resolveRef('_splitButtonContainer') }
       >
+
         <span aria-hidden={ true } style={ { 'display': 'flex' } }>
           { this._onRenderContent(tag, buttonProps) }
-          { this._onRenderSplitButtonMenuButton() }
+          { this._onRenderSplitButtonDivider(classNames) }
+          { this._onRenderSplitButtonMenuButton(classNames) }
         </span>
       </div >
     );
   }
 
-  private _onRenderSplitButtonMenuButton(): JSX.Element {
+  private _onRenderSplitButtonDivider(classNames: ISplitButtonClassNames | undefined): JSX.Element | null {
+    if (classNames && classNames.divider) {
+      return <span className={ classNames.divider } />;
+    }
+    return null;
+  }
+
+  private _onRenderSplitButtonMenuButton(classNames: ISplitButtonClassNames | undefined): JSX.Element {
     let {
       menuIconName,
-      menuIconProps,
-      styles,
-      disabled,
-      checked
+      menuIconProps
     } = this.props;
 
     if (menuIconProps === undefined) {
@@ -399,8 +408,6 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       };
     }
 
-    const classNames = styles ? getSplitButtonClassNames(styles!, disabled || false, !!this.state.menuProps, checked || false) : undefined;
-
     return (
       <BaseButton
         tabIndex={ -1 }
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
index 447230fb9eb01..65dde1ca39a4e 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
@@ -363,6 +363,12 @@ export interface IButtonStyles {
    */
   splitButtonContainerDisabled?: IStyle;
 
+  /**
+   * Style override for the divider element that appears between the button and menu button
+   * for a split button.
+   */
+  splitButtonDivider?: IStyle;
+
   /**
    * Style override for the SplitButton menu button
    */
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts
index 3d552ebe1b130..87e1d8f70e05d 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts
@@ -6,6 +6,7 @@ export interface ISplitButtonClassNames {
   root?: string;
   icon?: string;
   flexContainer?: string;
+  divider?: string;
 }
 
 export const getClassNames = memoizeFunction((
@@ -28,6 +29,7 @@ export const getClassNames = memoizeFunction((
       ]
     ) as string,
     icon: (disabled ? mergeStyles(styles.splitButtonMenuIcon, styles.splitButtonMenuIconDisabled) : styles.splitButtonMenuIcon) as string,
-    flexContainer: styles.splitButtonFlexContainer as string
+    flexContainer: styles.splitButtonFlexContainer as string,
+    divider: styles.splitButtonDivider as string
   };
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.styles.ts b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.styles.ts
new file mode 100644
index 0000000000000..3ecab1824cced
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.styles.ts
@@ -0,0 +1,10 @@
+import { memoizeFunction } from 'office-ui-fabric-react/lib/Utilities';
+import { IButtonStyles } from 'office-ui-fabric-react/lib/Button';
+
+export const getCustomSplitButtonStyles = memoizeFunction((): IButtonStyles => {
+  return {
+    splitButtonMenuButton: { backgroundColor: 'white', width: '10px' },
+    splitButtonMenuIcon: { fontSize: '7px' },
+    splitButtonDivider: { borderLeft: '1px solid #c8c8c8' }
+  };
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
index 5c3c4a57aa8ef..4f235f9022131 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
@@ -1,6 +1,7 @@
 import * as React from 'react';
-import { DefaultButton, IconButton, IButtonProps, IButtonStyles } from 'office-ui-fabric-react/lib/Button';
+import { DefaultButton, IconButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
 import { Label } from 'office-ui-fabric-react/lib/Label';
+import { getCustomSplitButtonStyles } from './Button.Split.Example.styles';
 
 export class ButtonSplitExample extends React.Component<IButtonProps, {}> {
   public constructor() {
@@ -47,7 +48,7 @@ export class ButtonSplitCustomExample extends React.Component<IButtonProps, {}>
 
   public render() {
     let { disabled, checked } = this.props;
-    const style: IButtonStyles = { splitButtonMenuButton: { backgroundColor: 'white', width: '10px' }, splitButtonMenuIcon: { fontSize: '7px' } };
+    const customSplitButtonStyles = getCustomSplitButtonStyles();
 
     return (
       <div>
@@ -60,7 +61,7 @@ export class ButtonSplitCustomExample extends React.Component<IButtonProps, {}>
           text='Create account'
           onClick={ () => alert('Clicked') }
           split={ true }
-          styles={ style }
+          styles={ customSplitButtonStyles }
           menuProps={ {
             items: [
               {

From bb12bfd38b0ecd888f8ca3093b189441a0f25d59 Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Mon, 11 Sep 2017 14:22:02 -0700
Subject: [PATCH 0612/1641] Calendar: fix arrows on month picker only (#2802)

* no message

* no message

* Updating functionality for arrows when month picker - only is selected

* Change file

* Fixed alignment issue in IE
---
 ...xArrowsOnMonthPickerOnly_2017-09-11-18-36.json | 11 +++++++++++
 .../src/components/Calendar/Calendar.scss         | 12 ++++++++++++
 .../src/components/Calendar/Calendar.tsx          | 11 ++++-------
 .../src/components/Calendar/CalendarPage.tsx      |  6 ++++++
 .../Calendar/examples/Calendar.Button.Example.tsx | 15 +++++++++++++--
 5 files changed, 46 insertions(+), 9 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-Calendar-FixArrowsOnMonthPickerOnly_2017-09-11-18-36.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-Calendar-FixArrowsOnMonthPickerOnly_2017-09-11-18-36.json b/common/changes/office-ui-fabric-react/kegorr-Calendar-FixArrowsOnMonthPickerOnly_2017-09-11-18-36.json
new file mode 100644
index 0000000000000..4fc3edc15ff04
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-Calendar-FixArrowsOnMonthPickerOnly_2017-09-11-18-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Calendar: Arrows (when month picker only) do not navigate correctly.  Fixed this and fixed position.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
index 62b808f80f974..b7ec4b36a9036 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
@@ -521,6 +521,11 @@ $Calendar-dayPicker-margin: 10px;
     .table{
       margin-right: 12px
     }
+
+     .dayPicker {
+      width: auto;
+    }
+
     .monthPicker{
       margin-left: 13px;
     }
@@ -529,6 +534,13 @@ $Calendar-dayPicker-margin: 10px;
       @include ms-right(13px);
     }
   }
+
+  //when month picker is only visible
+  .monthPickerOnly{
+    .wrap{
+      padding: 10px 7px;
+    }
+  }
 }
 
 // On smaller screens the month button toggles to the picking months state.
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index d0aa124ec2569..d7c967799ef94 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -119,6 +119,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     let { firstDayOfWeek, dateRangeType, strings, showMonthPickerAsOverlay, autoNavigateOnSelection, showGoToToday, highlightCurrentMonth, navigationIcons } = this.props;
     let { selectedDate, navigatedDate, isMonthPickerVisible, isDayPickerVisible } = this.state;
     let onHeaderSelect = showMonthPickerAsOverlay ? this._onHeaderSelect : undefined;
+    let monthPickerOnly = !showMonthPickerAsOverlay && !isDayPickerVisible;
 
     return (
       <div className={ css(rootClass, styles.root) } ref='root' role='application'>
@@ -130,6 +131,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
             styles.pickerIsFocused,
             isMonthPickerVisible && ('ms-DatePicker-monthPickerVisible ' + styles.monthPickerVisible),
             isMonthPickerVisible && isDayPickerVisible && ('ms-DatePicker-calendarsInline ' + styles.calendarsInline),
+            monthPickerOnly && ('ms-DatePicker-monthPickerOnly ' + styles.monthPickerOnly)
           ) }
         >
           <div className={ css('ms-DatePicker-holder ms-slideDownIn10', styles.holder) } onKeyDown={ this._onDatePickerPopupKeyDown }>
@@ -199,13 +201,8 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
 
   @autobind
   private _onNavigateDate(date: Date, focusOnNavigatedDay: boolean) {
-    if (this.props.isDayPickerVisible) {
-      this._navigateDay(date);
-      this._focusOnUpdate = focusOnNavigatedDay;
-    } else {
-      // if only the month picker is shown, select the chosen month
-      this._onSelectDate(date);
-    }
+    this._navigateDay(date);
+    this._focusOnUpdate = focusOnNavigatedDay;
   }
 
   @autobind
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
index e5f3ecc08d146..a1d892c89bf46 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
@@ -72,6 +72,12 @@ export class CalendarPage extends React.Component<IComponentDemoPageProps, any>
             <ExampleCard title='Calendar launched from a button' code={ CalendarButtonExampleCode }>
               <CalendarButtonExample />
             </ExampleCard>
+            <ExampleCard title='Month picker launched from a button' code={ CalendarButtonExampleCode }>
+              <CalendarButtonExample
+                isDayPickerVisible={ false }
+                buttonString={ 'Click for Month Picker' }
+              />
+            </ExampleCard>
           </div>
         }
         propertiesTables={
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
index 0923c544f9d20..f915f9b9897dc 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
@@ -65,7 +65,17 @@ export interface ICalendarButtonExampleState {
   selectedDate: Date | null;
 }
 
-export class CalendarButtonExample extends React.Component<any, ICalendarButtonExampleState> {
+export interface ICalendarButtonExampleProps {
+  isDayPickerVisible?: boolean;
+  buttonString?: string;
+}
+
+export class CalendarButtonExample extends React.Component<ICalendarButtonExampleProps, ICalendarButtonExampleState> {
+  public static defaultProps: ICalendarButtonExampleProps = {
+    isDayPickerVisible: true,
+    buttonString: 'Click for Calendar'
+  };
+
   private _calendarButtonElement: HTMLElement;
 
   public constructor() {
@@ -87,7 +97,7 @@ export class CalendarButtonExample extends React.Component<any, ICalendarButtonE
         <div ref={ (calendarBtn) => this._calendarButtonElement = calendarBtn! }>
           <DefaultButton
             onClick={ this._onClick }
-            text={ !this.state.selectedDate ? 'Click for Calendar' : this.state.selectedDate.toLocaleDateString() }
+            text={ !this.state.selectedDate ? this.props.buttonString : this.state.selectedDate.toLocaleDateString() }
           />
         </div>
         { this.state.showCalendar && (
@@ -108,6 +118,7 @@ export class CalendarButtonExample extends React.Component<any, ICalendarButtonE
               value={ this.state.selectedDate! }
               firstDayOfWeek={ DayOfWeek.Sunday }
               strings={ DayPickerStrings }
+              isDayPickerVisible={ this.props.isDayPickerVisible }
             >
             </Calendar>
           </Callout>

From 5ae36cdf70861f2394d26860828e835b8e3f104f Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Mon, 11 Sep 2017 16:23:08 -0700
Subject: [PATCH 0613/1641] MessageBar: Added word-break to fix long word bug
 (#2803)

* Added word-break to message bar

* change file
---
 .../message-bar-truncation_2017-09-11-22-15.json      | 11 +++++++++++
 .../src/components/MessageBar/MessageBar.scss         |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/message-bar-truncation_2017-09-11-22-15.json

diff --git a/common/changes/office-ui-fabric-react/message-bar-truncation_2017-09-11-22-15.json b/common/changes/office-ui-fabric-react/message-bar-truncation_2017-09-11-22-15.json
new file mode 100644
index 0000000000000..03a0d3db5c79c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/message-bar-truncation_2017-09-11-22-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "MessageBar: Added word-break to fix long words in message bar",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
index 0440a08aa19ed..d3f76cc7bdc79 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
@@ -15,7 +15,7 @@
   box-sizing: border-box;
   display: flex;
   position: relative;
-
+  word-break: break-word;
   .icon {
     @include padding-right(8px);
     color: $ms-color-info;

From f332b945c27793cdf4e3defc74e25ebca97e5197 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Mon, 11 Sep 2017 17:24:22 -0700
Subject: [PATCH 0614/1641] Demo app deployments - script to post Github
 status, bundle demo-app, update karma config (#2800)

* Bundle and copy demo app on build

* Run npm install

* Update github deploy status

* Update github deploy status config

* Change deploy github config repo to erichdev

* Update deploy github status to get latest commit ID

* Text updates, use assign instead of object destructuring

* Pushing just to trigger build

* One more test push

* Get deploy status from argv

* Forcing build

* Forcing build

* Update karma config

* Refactor deploy based on status

* Bundle and copy demo app on build

* Run npm install

* Update github deploy status

* Update github deploy status config

* Change deploy github config repo to erichdev

* Update deploy github status to get latest commit ID

* Text updates, use assign instead of object destructuring

* Pushing just to trigger build

* One more test push

* Get deploy status from argv

* Forcing build

* Forcing build

* Update karma config

* Refactor deploy based on status

* Update deploy script to correct repo
---
 .../config/pre-copy.json                      |  3 +
 .../office-ui-fabric-react/karma.config.js    | 10 ++-
 .../office-ui-fabric-react/webpack.config.js  | 25 +++++-
 scripts/deploy-github-status.js               | 87 +++++++++++++++++++
 4 files changed, 120 insertions(+), 5 deletions(-)
 create mode 100644 scripts/deploy-github-status.js

diff --git a/packages/office-ui-fabric-react/config/pre-copy.json b/packages/office-ui-fabric-react/config/pre-copy.json
index be6f0a795c4d4..5a7270ad2fa15 100644
--- a/packages/office-ui-fabric-react/config/pre-copy.json
+++ b/packages/office-ui-fabric-react/config/pre-copy.json
@@ -1,5 +1,8 @@
 {
   "copyTo": {
+    "dist": [
+      "index.html"
+    ],
     "dist/sass": [
       "node_modules/office-ui-fabric-core/dist/sass/**/*"
     ],
diff --git a/packages/office-ui-fabric-react/karma.config.js b/packages/office-ui-fabric-react/karma.config.js
index 0345baa89db5e..8bdff41ec5fe8 100644
--- a/packages/office-ui-fabric-react/karma.config.js
+++ b/packages/office-ui-fabric-react/karma.config.js
@@ -106,7 +106,15 @@ module.exports = function (config) {
 
     // Continuous Integration mode
     // if true, Karma captures browsers, runs the tests and exits
-    singleRun: true
+    singleRun: true,
+
+    // on disconnect, makes karma to launch another phantonJs window to restart the testcases
+    browserDisconnectTolerance: 5,
+
+    // these settings help reduce the timeouts to begin with.
+    browserNoActivityTimeout: 60000,
+    browserDisconnectTimeout: 30000,
+    captureTimeout: 60000,
   };
 
   config.set(karmaConfig);
diff --git a/packages/office-ui-fabric-react/webpack.config.js b/packages/office-ui-fabric-react/webpack.config.js
index e05525ba5c174..5ebc0cf4719fb 100644
--- a/packages/office-ui-fabric-react/webpack.config.js
+++ b/packages/office-ui-fabric-react/webpack.config.js
@@ -4,13 +4,20 @@ const resources = require('../../scripts/tasks/webpack-resources');
 const BUNDLE_NAME = 'office-ui-fabric-react';
 const IS_PRODUCTION = process.argv.indexOf('--production') > -1;
 
+let entry = {
+  [BUNDLE_NAME]: './lib/index.js'
+};
+
+// In production builds, produce the demo-app bundle.
+if (IS_PRODUCTION) {
+  entry['demo-app'] = './lib/demo/index.js';
+}
+
 module.exports = resources.createConfig(
   BUNDLE_NAME,
   IS_PRODUCTION,
   {
-    entry: {
-      [BUNDLE_NAME]: './lib/index.js'
-    },
+    entry,
 
     output: {
       libraryTarget: 'var',
@@ -24,6 +31,16 @@ module.exports = resources.createConfig(
       {
         'react-dom': 'ReactDOM'
       }
-    ]
+    ],
+
+    resolve: {
+      alias: {
+        'office-ui-fabric-react/src': path.join(__dirname, 'src'),
+        'office-ui-fabric-react/lib': path.join(__dirname, 'lib'),
+        'Props.ts.js': 'Props',
+        'Example.tsx.js': 'Example'
+      }
+    }
+
   }
 );
diff --git a/scripts/deploy-github-status.js b/scripts/deploy-github-status.js
new file mode 100644
index 0000000000000..a8a1ea5a9a33a
--- /dev/null
+++ b/scripts/deploy-github-status.js
@@ -0,0 +1,87 @@
+let argv = require('yargs').argv;
+let GitHubApi = require('github');
+
+const REPO_DETAILS = {
+  owner: "OfficeDev",
+  repo: "office-ui-fabric-react",
+};
+
+let statusConfig = Object.assign({},
+  REPO_DETAILS,
+  {
+    state: argv.state,
+    description: "PR deployed. Click \"Details\" to view site",
+    context: "VSTS: Deploy Demo"
+  });
+
+let pr = parsePRNumber();
+
+if (!argv.token) {
+  throw new Error("No token specified. Use --token=<token> to provide a token.");
+}
+
+// Authenticate with github.
+let github = new GitHubApi({ debug: argv.debug });
+
+github.authenticate({
+  type: 'token',
+  token: argv.token
+});
+
+getLatestCommitFromPR();
+
+function createStatus(sha) {
+  setDescription(); // Based on status of build - pending or success
+
+  github.repos.createStatus(Object.assign({}, statusConfig, { sha }),
+    (err, res) => {
+      if (err) {
+        throw new Error(`Failed to deploy pull request #${pr}. \n ${err}`);
+      }
+
+      console.log(`Successfully deployed pull request #${pr}`);
+    });
+}
+
+
+function getLatestCommitFromPR() {
+  github.pullRequests.get(Object.assign({}, REPO_DETAILS, { number: pr }), onGetLatestCommit);
+}
+
+function onGetLatestCommit(err, res) {
+  if (err)
+    throw new Error(`Failed to get latest commit. \n ${err}`);
+
+  // Extract the head sha from response. See https://developer.github.com/v3/pulls/#get-a-single-pull-request for full response details
+  if (res.head && res.head.sha)
+    createStatus(res.head.sha);
+}
+
+/*
+The PR ID is input in the format 'refs/pull/12/merge'. This function returns just the number.
+*/
+function parsePRNumber() {
+  let splitString;
+
+  if (argv.prID) {
+    splitString = argv.prID.split('/');
+  }
+
+  if (!argv.prID || !splitString[2])
+    throw new Error(`Failed to get PR number. \n ${err}`);
+
+  return splitString[2];
+}
+
+/*
+Set status text that will be posted to Github.
+*/
+function setDescription() {
+  if (argv.state === 'pending') {
+    statusConfig.description = 'Deployment pending.';
+  }
+  else if (argv.state === 'success') {
+    statusConfig.description = 'PR deployed. Click "Details" to view demo app.';
+    statusConfig.target_url = 'http://odsp-ext.azurewebsites.net/fabric-deploy-test/' + argv.prID;
+  }
+}

From f88e5bb7fcb6c32dc2cdd42f482456af42ed8c32 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Mon, 11 Sep 2017 17:26:29 -0700
Subject: [PATCH 0615/1641] Re-enable tslint 'jsx-wrap-multiline', fixed
 multiline issues (#2806)

* Re-enable tslint multiline, fixed multiline issues

* Remove unnecessary space

* Remove unnecessary space
---
 .../Breadcrumb/BreadcrumbPage.visualtest.tsx  |  30 +--
 .../src/components/Button/BaseButton.tsx      |  10 +-
 .../Button/ButtonPage.visualtest.tsx          | 222 +++++++++---------
 .../Button/examples/Button.Swap.Example.tsx   |  35 +--
 .../Checkbox/CheckboxPage.visualtest.tsx      |  28 ++-
 .../ChoiceGroupPage.visualtest.tsx            | 104 ++++----
 .../src/components/ComboBox/ComboBox.tsx      |  12 +-
 .../ComboBox/ComboBoxPage.visualtest.tsx      |  44 ++--
 .../src/components/CommandBar/CommandBar.tsx  | 146 ++++++------
 .../CommandBar/CommandBarPage.visualtest.tsx  |  62 ++---
 .../ContextualMenuPage.visualtest.tsx         |  42 ++--
 .../components/DetailsList/DetailsHeader.tsx  |   8 +-
 .../DetailsListPage.visualtest.tsx            |  32 +--
 .../DetailsList.NavigatingFocus.Example.tsx   |  14 +-
 .../Dialog/DialogPage.visualtest.tsx          |  30 +--
 .../DocumentCard/DocumentCardActivity.tsx     |  22 +-
 .../DocumentCardPage.visualtest.tsx           |  37 +--
 .../src/components/Dropdown/Dropdown.tsx      | 148 ++++++------
 .../src/components/Facepile/Facepile.tsx      | 160 +++++++------
 .../Facepile/FacepilePage.visualtest.tsx      |  38 +--
 .../components/Label/LabelPage.visualtest.tsx |   8 +-
 .../src/components/Layer/Layer.tsx            |   8 +-
 .../src/components/MessageBar/MessageBar.tsx  |  16 +-
 .../src/components/Persona/Persona.tsx        |  40 ++--
 .../src/components/Pivot/Pivot.tsx            |  20 +-
 .../examples/Pivot.IconCount.Example.tsx      |  10 +-
 .../src/components/Rating/Rating.tsx          |  74 +++---
 .../examples/ResizeGroup.FlexBox.Example.tsx  |  12 +-
 .../Toggle/TogglePage.visualtest.tsx          |  26 +-
 .../Tooltip/TooltipPage.visualtest.tsx        |  14 +-
 .../pickers/AutoFill/BaseAutoFill.tsx         |  22 +-
 .../pickers/Suggestions/Suggestions.tsx       |   8 +-
 .../src/utilities/grid/Grid.test.tsx          |  40 ++--
 packages/office-ui-fabric-react/tslint.json   |   2 -
 34 files changed, 807 insertions(+), 717 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.visualtest.tsx
index ca2f73cab719b..5993af2b0afe7 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.visualtest.tsx
@@ -5,20 +5,22 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 export default class BreadcrumbVPage extends React.Component<any, any> {
   public render() {
-    return <div style={ { width: '600px' } }>
-      <Breadcrumb
-        className='Breadcrumb'
+    return (
+      <div style={ { width: '600px' } }>
+        <Breadcrumb
+          className='Breadcrumb'
 
-        items={ [
-          { text: 'Files', 'key': 'Files' },
-          { text: 'This is folder 1', 'key': 'f1', onClick: () => { return; } },
-          { text: 'This is folder 2', 'key': 'f2', onClick: () => { return; } },
-          { text: 'This is folder 3', 'key': 'f3', onClick: () => { return; } },
-          { text: 'This is folder 4', 'key': 'f4', onClick: () => { return; } },
-          { text: 'This is folder 5', 'key': 'f5', onClick: () => { return; } },
-        ] }
-        maxDisplayedItems={ 3 }
-      />
-    </div>;
+          items={ [
+            { text: 'Files', 'key': 'Files' },
+            { text: 'This is folder 1', 'key': 'f1', onClick: () => { return; } },
+            { text: 'This is folder 2', 'key': 'f2', onClick: () => { return; } },
+            { text: 'This is folder 3', 'key': 'f3', onClick: () => { return; } },
+            { text: 'This is folder 4', 'key': 'f4', onClick: () => { return; } },
+            { text: 'This is folder 5', 'key': 'f5', onClick: () => { return; } },
+          ] }
+          maxDisplayedItems={ 3 }
+        />
+      </div>
+    );
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index dcdc77f75dbe5..61bb2a57808c9 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -325,10 +325,12 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
 
     return (
       menuIconProps ?
-        <Icon
-          { ...menuIconProps }
-          className={ this._classNames.menuIcon }
-        />
+        (
+          <Icon
+            { ...menuIconProps }
+            className={ this._classNames.menuIcon }
+          />
+        )
         :
         null
     );
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.visualtest.tsx
index 5a5b4f1e6c753..039f277000bbf 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.visualtest.tsx
@@ -6,131 +6,133 @@ import * as React from 'react';
 export default class ButtonVPage extends React.Component<any, any> {
   public render() {
     let iconName: IconName = 'Snow';
-    return <div>
+    return (
       <div>
-        <label> Default Button:   </label>
-        <DefaultButton id='DefaultButton' icon='Add' text='Default Button' />
-      </div>
-      <div>
-        <label> Default Button Disabled:   </label>&nbsp;
+        <div>
+          <label> Default Button:   </label>
+          <DefaultButton id='DefaultButton' icon='Add' text='Default Button' />
+        </div>
+        <div>
+          <label> Default Button Disabled:   </label>&nbsp;
         <DefaultButton id='DefaultButtonDisabled' disabled={ true } icon='Add' text='Default Button' />
-      </div>&nbsp;
+        </div>&nbsp;
       <div>
-        <label> Default Button Checked:   </label>
-        <DefaultButton id='DefaultButtonChecked' icon='Add' checked={ true } text='Default Button' />
-      </div>&nbsp;
+          <label> Default Button Checked:   </label>
+          <DefaultButton id='DefaultButtonChecked' icon='Add' checked={ true } text='Default Button' />
+        </div>&nbsp;
       <div style={ { backgroundColor: 'white' } }>
-        <IconButton id={ 'IconButton' } iconProps={ { iconName } } />
-      </div>&nbsp;
+          <IconButton id={ 'IconButton' } iconProps={ { iconName } } />
+        </div>&nbsp;
       <div style={ { backgroundColor: 'white' } }>
-        <IconButton id={ 'IconButtonChecked' } checked={ true } iconProps={ { iconName } } />
-      </div>&nbsp;
+          <IconButton id={ 'IconButtonChecked' } checked={ true } iconProps={ { iconName } } />
+        </div>&nbsp;
       <div style={ { backgroundColor: 'white' } }>
-        <CommandButton
-          id='CommandButton'
-          icon='AddFriend'
-          text='Command Button'
-        />
-      </div>&nbsp;
+          <CommandButton
+            id='CommandButton'
+            icon='AddFriend'
+            text='Command Button'
+          />
+        </div>&nbsp;
       <div style={ { backgroundColor: 'white' } }>
-        <CommandButton
-          id='CommandButtonDisabled'
-          icon='AddFriend'
-          disabled={ true }
-          text='Command Button'
-        />
-      </div >&nbsp;
+          <CommandButton
+            id='CommandButtonDisabled'
+            icon='AddFriend'
+            disabled={ true }
+            text='Command Button'
+          />
+        </div >&nbsp;
       <div style={ { backgroundColor: 'white' } }>
-        <CommandButton
-          id='CommandButtonChecked'
-          checked={ true }
-          icon='AddFriend'
-          text='Command Button'
-        />
-      </div>&nbsp;
+          <CommandButton
+            id='CommandButtonChecked'
+            checked={ true }
+            icon='AddFriend'
+            text='Command Button'
+          />
+        </div>&nbsp;
       <div>
-        <CompoundButton
-          id='CompoundButton'
-          description='You can create a new account here.'
-          text='Compound Button'
-        />
-      </div>&nbsp;
+          <CompoundButton
+            id='CompoundButton'
+            description='You can create a new account here.'
+            text='Compound Button'
+          />
+        </div>&nbsp;
       <div>
-        <CompoundButton
-          id='CompoundButtonDisabled'
-          disabled={ true }
-          description='You can create a new account here.'
-          text='Compound Button'
-        />
-      </div>&nbsp;
+          <CompoundButton
+            id='CompoundButtonDisabled'
+            disabled={ true }
+            description='You can create a new account here.'
+            text='Compound Button'
+          />
+        </div>&nbsp;
       <div>
-        <CompoundButton
-          id='CompoundButtonChecked'
-          checked={ true }
-          description='You can create a new account here.'
-          text='Compound Button'
-        />
-      </div>&nbsp;
+          <CompoundButton
+            id='CompoundButtonChecked'
+            checked={ true }
+            description='You can create a new account here.'
+            text='Compound Button'
+          />
+        </div>&nbsp;
       <div>
-        <PrimaryButton id='PrimaryButton' icon='Add' text='Primary Button' />
-      </div >&nbsp;
+          <PrimaryButton id='PrimaryButton' icon='Add' text='Primary Button' />
+        </div >&nbsp;
       <div>
-        <PrimaryButton id='PrimaryButtonDisabled' disabled={ true } icon='Add' text='Primary Button' />
-      </div >&nbsp;
+          <PrimaryButton id='PrimaryButtonDisabled' disabled={ true } icon='Add' text='Primary Button' />
+        </div >&nbsp;
       <div>
-        <PrimaryButton id='PrimaryButtonToggled' checked={ true } icon='Add' text='Primary Button' />
-      </div >&nbsp;
+          <PrimaryButton id='PrimaryButtonToggled' checked={ true } icon='Add' text='Primary Button' />
+        </div >&nbsp;
 
       <div>
-        <DefaultButton
-          id='ContextualButton'
-          disabled={ false }
-          icon='Add'
-          text='New'
-          menuProps={ {
-            className: 'ContextualButtonMenu',
-            id: 'ContextualButtonMenu',
-            items: [
-              {
-                key: 'emailMessage',
-                name: 'Email message',
-                icon: 'Mail'
-              },
-              {
-                key: 'calendarEvent',
-                name: 'Calendar event',
-                icon: 'Calendar'
-              }
-            ]
-          }
-          }
-        >
-        </DefaultButton>
-        <DefaultButton
-          id='ContextualButtonToggled'
-          checked={ true }
-          icon='Add'
-          text='New'
-          menuProps={ {
-            className: 'ContextualButtonMenu',
-            id: 'ContextualButtonMenu',
-            items: [
-              {
-                key: 'emailMessage',
-                name: 'Email message',
-                icon: 'Mail'
-              },
-              {
-                key: 'calendarEvent',
-                name: 'Calendar event',
-                icon: 'Calendar'
-              }
-            ]
-          }
-          }
-        >
-        </DefaultButton>
-      </div >
-    </div>;
+          <DefaultButton
+            id='ContextualButton'
+            disabled={ false }
+            icon='Add'
+            text='New'
+            menuProps={ {
+              className: 'ContextualButtonMenu',
+              id: 'ContextualButtonMenu',
+              items: [
+                {
+                  key: 'emailMessage',
+                  name: 'Email message',
+                  icon: 'Mail'
+                },
+                {
+                  key: 'calendarEvent',
+                  name: 'Calendar event',
+                  icon: 'Calendar'
+                }
+              ]
+            }
+            }
+          >
+          </DefaultButton>
+          <DefaultButton
+            id='ContextualButtonToggled'
+            checked={ true }
+            icon='Add'
+            text='New'
+            menuProps={ {
+              className: 'ContextualButtonMenu',
+              id: 'ContextualButtonMenu',
+              items: [
+                {
+                  key: 'emailMessage',
+                  name: 'Email message',
+                  icon: 'Mail'
+                },
+                {
+                  key: 'calendarEvent',
+                  name: 'Calendar event',
+                  icon: 'Calendar'
+                }
+              ]
+            }
+            }
+          >
+          </DefaultButton>
+        </div >
+      </div>
+    );
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
index 2402558e429fd..fd26c26fd108b 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
@@ -45,22 +45,25 @@ export class ButtonSwapExample extends React.Component<IButtonProps, IButtonSwap
 
     // determine which button to render
     let button = isPrimary
-      ? <PrimaryButton
-        ref={ this._setButtonRef }
-        disabled={ disabled }
-        checked={ checked }
-        onClick={ this._onClick }
-      >
-        { text }
-      </PrimaryButton>
-      : <DefaultButton
-        ref={ this._setButtonRef }
-        disabled={ disabled }
-        checked={ checked }
-        onClick={ this._onClick }
-      >
-        { text }
-      </DefaultButton>;
+      ? (
+        <PrimaryButton
+          ref={ this._setButtonRef }
+          disabled={ disabled }
+          checked={ checked }
+          onClick={ this._onClick }
+        >
+          { text }
+        </PrimaryButton>
+      ) : (
+        <DefaultButton
+          ref={ this._setButtonRef }
+          disabled={ disabled }
+          checked={ checked }
+          onClick={ this._onClick }
+        >
+          { text }
+        </DefaultButton>
+      );
 
     return (
       <div className='ms-BasicButtonsExample'>
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.visualtest.tsx
index 8739bfdead97e..b582a5a3ba971 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.visualtest.tsx
@@ -4,18 +4,20 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 export default class CheckboxVPage extends React.Component<any, any> {
   public render() {
-    return <div style={ { backgroundColor: 'white' } } >
-      <Checkbox
-        className='Checkbox'
-        label='Check Box'
-        defaultChecked={ true }
-      />
-      <Checkbox
-        className='CheckboxDisabled'
-        label='Check Box Disabled'
-        defaultChecked={ true }
-        disabled={ true }
-      />
-    </div>;
+    return (
+      <div style={ { backgroundColor: 'white' } } >
+        <Checkbox
+          className='Checkbox'
+          label='Check Box'
+          defaultChecked={ true }
+        />
+        <Checkbox
+          className='CheckboxDisabled'
+          label='Check Box Disabled'
+          defaultChecked={ true }
+          disabled={ true }
+        />
+      </div>
+    );
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.visualtest.tsx
index 58326df40da3e..e0c803ad240f5 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.visualtest.tsx
@@ -4,61 +4,63 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 export default class ChoiceGroupVPage extends React.Component<any, any> {
   public render() {
-    return <div>
-      <div style={ { backgroundColor: 'white' } }>
-        <ChoiceGroup
-          label='Choice Group'
-          className='ChoiceGroup'
-          defaultSelectedKey='pie'
-          options={
-            [{
-              key: 'bar',
-              text: 'Bar chart'
+    return (
+      <div>
+        <div style={ { backgroundColor: 'white' } }>
+          <ChoiceGroup
+            label='Choice Group'
+            className='ChoiceGroup'
+            defaultSelectedKey='pie'
+            options={
+              [{
+                key: 'bar',
+                text: 'Bar chart'
 
-            }, {
-              key: 'pie',
-              text: 'Pie chart'
-            }]
-          }
-        />
-      </div>&nbsp;
+              }, {
+                key: 'pie',
+                text: 'Pie chart'
+              }]
+            }
+          />
+        </div>&nbsp;
       <div style={ { backgroundColor: 'white' } }>
-        <ChoiceGroup
-          label='Choice Group Icon'
-          className='ChoiceGroupIcon'
-          defaultSelectedKey='week'
-          options={
-            [{
-              key: 'day',
-              iconProps: { iconName: 'CalendarDay' },
-              text: 'Day'
+          <ChoiceGroup
+            label='Choice Group Icon'
+            className='ChoiceGroupIcon'
+            defaultSelectedKey='week'
+            options={
+              [{
+                key: 'day',
+                iconProps: { iconName: 'CalendarDay' },
+                text: 'Day'
 
-            }, {
-              key: 'week',
-              iconProps: { iconName: 'CalendarWeek' },
-              text: 'Week'
-            }]
-          }
-        />
-      </div>&nbsp;
+              }, {
+                key: 'week',
+                iconProps: { iconName: 'CalendarWeek' },
+                text: 'Week'
+              }]
+            }
+          />
+        </div>&nbsp;
       <div style={ { backgroundColor: 'white' } }>
-        <ChoiceGroup
-          label='Choice Group Disabled'
-          className='ChoiceGroupDisabled'
-          defaultSelectedKey='pie'
-          disabled={ true }
-          options={
-            [{
-              key: 'bar',
-              text: 'Bar chart'
+          <ChoiceGroup
+            label='Choice Group Disabled'
+            className='ChoiceGroupDisabled'
+            defaultSelectedKey='pie'
+            disabled={ true }
+            options={
+              [{
+                key: 'bar',
+                text: 'Bar chart'
 
-            }, {
-              key: 'pie',
-              text: 'Pie chart'
-            }]
-          }
-        />
-      </div>&nbsp;
-    </div>;
+              }, {
+                key: 'pie',
+                text: 'Pie chart'
+              }]
+            }
+          />
+        </div>&nbsp;
+    </div>
+    );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 690ca9b6463b2..4016d264d879f 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -816,11 +816,13 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     let { index, key } = item;
 
     if (index && index > 0) {
-      return <div
-        role='separator'
-        key={ key }
-        className={ this._classNames.divider }
-      />;
+      return (
+        <div
+          role='separator'
+          key={ key }
+          className={ this._classNames.divider }
+        />
+      );
     }
     return null;
   }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.visualtest.tsx
index c95f82094d94f..8ca9420d8cf24 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.visualtest.tsx
@@ -4,26 +4,28 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 export default class ComboBoxVPage extends React.Component<any, any> {
   public render() {
-    return <div >
-      <ComboBox
-        defaultSelectedKey='C'
-        label='Basic uncontrolled example (allowFreeform: T, AutoComplete: T):'
-        id='Basicdrop1'
-        ariaLabel='Basic ComboBox example'
-        allowFreeform={ true }
-        autoComplete='on'
-        options={
-          [
-            { key: 'A', text: 'Option a' },
-            { key: 'B', text: 'Option b' },
-            { key: 'C', text: 'Option c' },
-            { key: 'D', text: 'Option d' },
-            { key: 'E', text: 'Option e' },
-            { key: 'F', text: 'Option f' },
-            { key: 'G', text: 'Option g' },
-          ]
-        }
-      />
-    </div>;
+    return (
+      <div >
+        <ComboBox
+          defaultSelectedKey='C'
+          label='Basic uncontrolled example (allowFreeform: T, AutoComplete: T):'
+          id='Basicdrop1'
+          ariaLabel='Basic ComboBox example'
+          allowFreeform={ true }
+          autoComplete='on'
+          options={
+            [
+              { key: 'A', text: 'Option a' },
+              { key: 'B', text: 'Option b' },
+              { key: 'C', text: 'Option c' },
+              { key: 'D', text: 'Option d' },
+              { key: 'E', text: 'Option e' },
+              { key: 'F', text: 'Option f' },
+              { key: 'G', text: 'Option g' },
+            ]
+          }
+        />
+      </div>
+    );
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index ff13de70a054b..7e62707cc629f 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -165,9 +165,11 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
 
   private _renderItemInCommandBar(item: IContextualMenuItem, index: number, expandedMenuItemKey: string, isFarItem?: boolean) {
     if (item.onRender) {
-      return <div className={ css('ms-CommandBarItem', styles.item, item.className) } key={ item.key } ref={ item.key }>
-        { item.onRender(item) }
-      </div>;
+      return (
+        <div className={ css('ms-CommandBarItem', styles.item, item.className) } key={ item.key } ref={ item.key }>
+          { item.onRender(item) }
+        </div>
+      );
     }
 
     const itemKey = item.key || String(index);
@@ -179,74 +181,76 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
     );
     let hasIcon = !!item.icon || !!item.iconProps;
 
-    return <div className={ css('ms-CommandBarItem', styles.item, item.className) } key={ itemKey } ref={ itemKey }>
-      { (() => {
-        if (isLink) {
-          return <button
-            { ...getNativeProps(item, buttonProperties) }
-            id={ this._id + item.key }
-            className={ className }
-            onClick={ (ev) => this._onItemClick(ev, item) }
-            data-command-key={ itemKey }
-            aria-haspopup={ hasSubmenuItems(item) }
-            aria-expanded={ hasSubmenuItems(item) ? expandedMenuItemKey === item.key : undefined }
-            role='menuitem'
-            aria-label={ item.ariaLabel }
-          >
-            { (hasIcon) ? this._renderIcon(item) : (null) }
-            { (!!item.name) && (
-              <span
-                className={ css('ms-CommandBarItem-commandText', styles.itemCommandText) }
-              >
-                { item.name }
-              </span>
-            ) }
-            { hasSubmenuItems(item) ? (
-              <Icon className={ css('ms-CommandBarItem-chevronDown', styles.itemChevronDown) } iconName='ChevronDown' />
-            ) : (null) }
-          </button>;
-        } else if (item.href) {
-          return <a
-            { ...getNativeProps(item, anchorProperties) }
-            id={ this._id + item.key }
-            className={ className }
-            href={ item.href }
-            data-command-key={ itemKey }
-            aria-haspopup={ hasSubmenuItems(item) }
-            role='menuitem'
-            aria-label={ item.ariaLabel }
-          >
-            { (hasIcon) ? this._renderIcon(item) : (null) }
-            { (!!item.name) && (
-              <span
-                className={ css('ms-CommandBarItem-commandText', styles.itemCommandText) }
-              >
-                { item.name }
-              </span>
-            ) }
-          </a>;
-        } else {
-          return <div
-            { ...getNativeProps(item, divProperties) }
-            id={ this._id + item.key }
-            className={ className }
-            data-command-key={ itemKey }
-            aria-haspopup={ hasSubmenuItems(item) }
-          >
-            { (hasIcon) ? this._renderIcon(item) : (null) }
-            { (!!item.name) && (
-              <span
-                className={ css('ms-CommandBarItem-commandText', styles.itemCommandText) }
-                aria-hidden='true'
-                role='presentation'
-              >
-                { item.name }
-              </span>
-            ) }
-          </div>;
-        }
-      })() }
-    </div>;
+    return (
+      <div className={ css('ms-CommandBarItem', styles.item, item.className) } key={ itemKey } ref={ itemKey }>
+        { (() => {
+          if (isLink) {
+            return <button
+              { ...getNativeProps(item, buttonProperties) }
+              id={ this._id + item.key }
+              className={ className }
+              onClick={ (ev) => this._onItemClick(ev, item) }
+              data-command-key={ itemKey }
+              aria-haspopup={ hasSubmenuItems(item) }
+              aria-expanded={ hasSubmenuItems(item) ? expandedMenuItemKey === item.key : undefined }
+              role='menuitem'
+              aria-label={ item.ariaLabel }
+            >
+              { (hasIcon) ? this._renderIcon(item) : (null) }
+              { (!!item.name) && (
+                <span
+                  className={ css('ms-CommandBarItem-commandText', styles.itemCommandText) }
+                >
+                  { item.name }
+                </span>
+              ) }
+              { hasSubmenuItems(item) ? (
+                <Icon className={ css('ms-CommandBarItem-chevronDown', styles.itemChevronDown) } iconName='ChevronDown' />
+              ) : (null) }
+            </button>;
+          } else if (item.href) {
+            return <a
+              { ...getNativeProps(item, anchorProperties) }
+              id={ this._id + item.key }
+              className={ className }
+              href={ item.href }
+              data-command-key={ itemKey }
+              aria-haspopup={ hasSubmenuItems(item) }
+              role='menuitem'
+              aria-label={ item.ariaLabel }
+            >
+              { (hasIcon) ? this._renderIcon(item) : (null) }
+              { (!!item.name) && (
+                <span
+                  className={ css('ms-CommandBarItem-commandText', styles.itemCommandText) }
+                >
+                  { item.name }
+                </span>
+              ) }
+            </a>;
+          } else {
+            return <div
+              { ...getNativeProps(item, divProperties) }
+              id={ this._id + item.key }
+              className={ className }
+              data-command-key={ itemKey }
+              aria-haspopup={ hasSubmenuItems(item) }
+            >
+              { (hasIcon) ? this._renderIcon(item) : (null) }
+              { (!!item.name) && (
+                <span
+                  className={ css('ms-CommandBarItem-commandText', styles.itemCommandText) }
+                  aria-hidden='true'
+                  role='presentation'
+                >
+                  { item.name }
+                </span>
+              ) }
+            </div>;
+          }
+        })() }
+      </div>
+    );
   }
 
   private _renderIcon(item: IContextualMenuItem) {
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.visualtest.tsx
index ded60b395750a..53a5381d4dc70 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.visualtest.tsx
@@ -4,35 +4,37 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 export default class CommandBarVPage extends React.Component<any, any> {
   public render() {
-    return <div style={ { width: '600px' } }>
-      <CommandBar
-        className='CommandBar'
-        items={
-          [
-            {
-              key: 'new',
-              name: 'New',
-              icon: 'Add',
-              onClick: () => { return; },
-              items: [
-                {
-                  key: 'emailMessage',
-                  name: 'Email message',
-                  icon: 'Mail'
-                },
-                {
-                  key: 'calendarEvent',
-                  name: 'Calendar event',
-                  icon: 'Calendar'
-                }
-              ]
-            },
-            {
-              key: 'upload',
-              name: 'Upload',
-              icon: 'Upload'
-            }] }
-      />
-    </div>;
+    return (
+      <div style={ { width: '600px' } }>
+        <CommandBar
+          className='CommandBar'
+          items={
+            [
+              {
+                key: 'new',
+                name: 'New',
+                icon: 'Add',
+                onClick: () => { return; },
+                items: [
+                  {
+                    key: 'emailMessage',
+                    name: 'Email message',
+                    icon: 'Mail'
+                  },
+                  {
+                    key: 'calendarEvent',
+                    name: 'Calendar event',
+                    icon: 'Calendar'
+                  }
+                ]
+              },
+              {
+                key: 'upload',
+                name: 'Upload',
+                icon: 'Upload'
+              }] }
+        />
+      </div>
+    );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.visualtest.tsx
index 82e00898d0346..11e1141920812 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.visualtest.tsx
@@ -4,27 +4,29 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 export default class ContextualMenuVPage extends React.Component<any, any> {
   public render() {
-    return <div>
+    return (
       <div>
-        <ContextualMenu
-          id='ContextualMenu'
-          shouldFocusOnMount={ false }
-          items={
-            [{
-              key: 'new',
-              name: 'New',
-              icon: 'Add',
-              onClick: () => alert('New')
-            },
-            {
-              key: 'upload',
-              name: 'Upload',
-              icon: 'Upload',
-              onClick: () => alert('upload')
-            }]
-          }
-        />
+        <div>
+          <ContextualMenu
+            id='ContextualMenu'
+            shouldFocusOnMount={ false }
+            items={
+              [{
+                key: 'new',
+                name: 'New',
+                icon: 'Add',
+                onClick: () => alert('New')
+              },
+              {
+                key: 'upload',
+                name: 'Upload',
+                icon: 'Upload',
+                onClick: () => alert('upload')
+              }]
+            }
+          />
+        </div>
       </div>
-    </div>;
+    );
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index 15c873a31b80e..b14f22756e71e 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -357,9 +357,11 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
 
   @autobind
   private _onRenderColumnHeaderTooltip(tooltipHostProps: ITooltipHostProps, defaultRender?: IRenderFunction<ITooltipHostProps>) {
-    return <span className={ tooltipHostProps.hostClassName }> {
-      tooltipHostProps.children
-    }</span >;
+    return (
+      <span className={ tooltipHostProps.hostClassName }>
+        { tooltipHostProps.children }
+      </span >
+    );
   }
 
   /**
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.visualtest.tsx
index 9d7cb19867977..ee9e828c11b63 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.visualtest.tsx
@@ -5,20 +5,22 @@ import * as React from 'react';
 export default class DetailsListVPage extends React.Component<any, any> {
 
   public render() {
-    return <div style={ { width: '600px' } }>
-      <DetailsList
-        className='DetailsList'
-        items={ [{
-          key: 'score',
-          name: 'Score',
-          fieldName: 'score'
-        },
-        {
-          key: 'name',
-          name: 'Name',
-          fieldName: 'Name'
-        }] }
-      />
-    </div>;
+    return (
+      <div style={ { width: '600px' } }>
+        <DetailsList
+          className='DetailsList'
+          items={ [{
+            key: 'score',
+            name: 'Score',
+            fieldName: 'score'
+          },
+          {
+            key: 'name',
+            name: 'Name',
+            fieldName: 'Name'
+          }] }
+        />
+      </div>
+    );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
index 458465451886d..47dca720f430f 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
@@ -18,12 +18,14 @@ export class DetailsListNavigatingFocusExample extends React.Component<{}, IDeta
     {
       name: 'File path',
       onRender: item =>
-        <Link
-          key={ item }
-          onClick={ () => this._navigate(item) }
-        >
-          { item }
-        </Link>,
+        (
+          <Link
+            key={ item }
+            onClick={ () => this._navigate(item) }
+          >
+            { item }
+          </Link>
+        ),
     } as IColumn,
     {
       name: 'Size',
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.visualtest.tsx
index 2472afcdca145..8171c240ea6ce 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.visualtest.tsx
@@ -5,19 +5,21 @@ import { Button } from './../Button/index';
 
 export default class DialogVPage extends React.Component<any, any> {
   public render() {
-    return <div>
-      <Dialog
-        hidden={ false }
-        className='Dialog'
-        title='All emails together'
-        subText='Your Inbox has changed.'
-        isBlocking={ false }
-      >
-        <DialogFooter>
-          <Button >Save</Button>
-          <Button >Cancel</Button>
-        </DialogFooter>
-      </Dialog>
-    </div>;
+    return (
+      <div>
+        <Dialog
+          hidden={ false }
+          className='Dialog'
+          title='All emails together'
+          subText='Your Inbox has changed.'
+          isBlocking={ false }
+        >
+          <DialogFooter>
+            <Button >Save</Button>
+            <Button >Cancel</Button>
+          </DialogFooter>
+        </Dialog>
+      </div>
+    );
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx
index 426224f8f1e4d..5d3b19520a658 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx
@@ -11,17 +11,19 @@ export class DocumentCardActivity extends BaseComponent<IDocumentCardActivityPro
 
     return (
       people && people.length > 0 &&
-      <div
-        className={ css('ms-DocumentCardActivity', styles.activity, {
-          ['ms-DocumentCardActivity--multiplePeople ' + styles.activityIsMultiplePeople]: people.length > 1
-        }) }
-      >
-        { this._renderAvatars(people) }
-        <div className={ css('ms-DocumentCardActivity-details', styles.activityDetails) }>
-          <span className={ css('ms-DocumentCardActivity-name', styles.name) }>{ this._getNameString(people) }</span>
-          <span className={ css('ms-DocumentCardActivity-activity', styles.activityActivity) }>{ activity }</span>
+      (
+        <div
+          className={ css('ms-DocumentCardActivity', styles.activity, {
+            ['ms-DocumentCardActivity--multiplePeople ' + styles.activityIsMultiplePeople]: people.length > 1
+          }) }
+        >
+          { this._renderAvatars(people) }
+          <div className={ css('ms-DocumentCardActivity-details', styles.activityDetails) }>
+            <span className={ css('ms-DocumentCardActivity-name', styles.name) }>{ this._getNameString(people) }</span>
+            <span className={ css('ms-DocumentCardActivity-activity', styles.activityActivity) }>{ activity }</span>
+          </div>
         </div>
-      </div>
+      )
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.visualtest.tsx
index 8f049f089664f..d6465b03c1649 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.visualtest.tsx
@@ -15,23 +15,24 @@ export default class DocumentCardVPage extends React.Component<any, any> {
         }
       ],
     };
-    return <div >
-      <DocumentCard className='DocumentCard'>
-        <DocumentCardPreview { ...previewProps } />
-        <DocumentCardTitle
-          title='Document Card'
-          shouldTruncate={ true }
-        />
-        <DocumentCardActivity
-          activity='Created a few minutes ago'
-          people={
-            [
-              { name: 'Annie Lindqvist', profileImageSrc: 'images/persona-female.png' }
-            ]
-          }
-        />
-      </DocumentCard>
-
-    </div>;
+    return (
+      <div >
+        <DocumentCard className='DocumentCard'>
+          <DocumentCardPreview { ...previewProps } />
+          <DocumentCardTitle
+            title='Document Card'
+            shouldTruncate={ true }
+          />
+          <DocumentCardActivity
+            activity='Created a few minutes ago'
+            people={
+              [
+                { name: 'Annie Lindqvist', profileImageSrc: 'images/persona-female.png' }
+              ]
+            }
+          />
+        </DocumentCard>
+      </div>
+    );
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 8f20f19b5201a..d90191c0a0a6e 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -348,31 +348,35 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
 
     return (
       isSmall ?
-        <Panel
-          className={ css('ms-Dropdown-panel', styles.panel) }
-          isOpen={ true }
-          isLightDismiss={ true }
-          onDismissed={ this._onDismiss }
-          hasCloseButton={ false }
-        >
-          { onRenderList(props, this._onRenderList) }
-        </Panel>
+        (
+          <Panel
+            className={ css('ms-Dropdown-panel', styles.panel) }
+            isOpen={ true }
+            isLightDismiss={ true }
+            onDismissed={ this._onDismiss }
+            hasCloseButton={ false }
+          >
+            { onRenderList(props, this._onRenderList) }
+          </Panel>
+        )
         :
-        <Callout
-          isBeakVisible={ false }
-          gapSpace={ 0 }
-          doNotLayer={ false }
-          directionalHintFixed={ true }
-          directionalHint={ DirectionalHint.bottomLeftEdge }
-          { ...calloutProps }
-          className={ css('ms-Dropdown-callout', styles.callout, calloutProps ? calloutProps.className : undefined) }
-          targetElement={ this._dropDown }
-          onDismiss={ this._onDismiss }
-          onPositioned={ this._onPositioned }
-          calloutWidth={ dropdownWidth || this._dropDown.clientWidth }
-        >
-          { onRenderList(props, this._onRenderList) }
-        </Callout>
+        (
+          <Callout
+            isBeakVisible={ false }
+            gapSpace={ 0 }
+            doNotLayer={ false }
+            directionalHintFixed={ true }
+            directionalHint={ DirectionalHint.bottomLeftEdge }
+            { ...calloutProps }
+            className={ css('ms-Dropdown-callout', styles.callout, calloutProps ? calloutProps.className : undefined) }
+            targetElement={ this._dropDown }
+            onDismiss={ this._onDismiss }
+            onPositioned={ this._onPositioned }
+            calloutWidth={ dropdownWidth || this._dropDown.clientWidth }
+          >
+            { onRenderList(props, this._onRenderList) }
+          </Callout>
+        )
     );
   }
 
@@ -420,11 +424,13 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   private _renderSeparator(item: IDropdownOption): JSX.Element | null {
     let { index, key } = item;
     if (index! > 0) {
-      return <div
-        role='separator'
-        key={ key }
-        className={ css('ms-Dropdown-divider', styles.divider) }
-      />;
+      return (
+        <div
+          role='separator'
+          key={ key }
+          className={ css('ms-Dropdown-divider', styles.divider) }
+        />
+      );
     }
     return null;
   }
@@ -453,47 +459,51 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     }
     return (
       !this.props.multiSelect ?
-        <CommandButton
-          id={ id + '-list' + item.index }
-          ref={ Dropdown.Option + item.index }
-          key={ item.key }
-          data-index={ item.index }
-          data-is-focusable={ true }
-          className={ css(
-            'ms-Dropdown-item', styles.item, {
-              ['is-selected ' + styles.itemIsSelected]: this.state.selectedIndex === item.index,
-              ['is-disabled ' + styles.itemIsDisabled]: this.props.disabled === true
-            }
-          ) }
-          onClick={ () => this._onItemClick(item.index!) }
-          role='option'
-          aria-selected={ this.state.selectedIndex === item.index ? 'true' : 'false' }
-          ariaLabel={ item.ariaLabel || item.text }
-          title={ item.text }
-        >
-          { onRenderOption(item, this._onRenderOption) }
-        </CommandButton>
+        (
+          <CommandButton
+            id={ id + '-list' + item.index }
+            ref={ Dropdown.Option + item.index }
+            key={ item.key }
+            data-index={ item.index }
+            data-is-focusable={ true }
+            className={ css(
+              'ms-Dropdown-item', styles.item, {
+                ['is-selected ' + styles.itemIsSelected]: this.state.selectedIndex === item.index,
+                ['is-disabled ' + styles.itemIsDisabled]: this.props.disabled === true
+              }
+            ) }
+            onClick={ () => this._onItemClick(item.index!) }
+            role='option'
+            aria-selected={ this.state.selectedIndex === item.index ? 'true' : 'false' }
+            ariaLabel={ item.ariaLabel || item.text }
+            title={ item.text }
+          >
+            { onRenderOption(item, this._onRenderOption) }
+          </CommandButton>
+        )
         :
-        <Checkbox
-          id={ id + '-list' + item.index }
-          ref={ Dropdown.Option + item.index }
-          key={ item.key }
-          data-index={ item.index }
-          data-is-focusable={ true }
-          onChange={ () => this._onItemClick(item.index!) }
-          label={ item.text }
-          className={ css(
-            'ms-ColumnManagementPanel-checkbox',
-            'ms-Dropdown-item', styles.item, {
-              ['is-selected ' + styles.itemIsSelected]: isItemSelected,
-              ['is-disabled ' + styles.itemIsDisabled]: isItemSelected
-            }
-          ) }
-          role='option'
-          aria-selected={ isItemSelected ? 'true' : 'false' }
-          checked={ isItemSelected }
-        >{ onRenderOption(item, this._onRenderOption) }
-        </Checkbox>
+        (
+          <Checkbox
+            id={ id + '-list' + item.index }
+            ref={ Dropdown.Option + item.index }
+            key={ item.key }
+            data-index={ item.index }
+            data-is-focusable={ true }
+            onChange={ () => this._onItemClick(item.index!) }
+            label={ item.text }
+            className={ css(
+              'ms-ColumnManagementPanel-checkbox',
+              'ms-Dropdown-item', styles.item, {
+                ['is-selected ' + styles.itemIsSelected]: isItemSelected,
+                ['is-disabled ' + styles.itemIsDisabled]: isItemSelected
+              }
+            ) }
+            role='option'
+            aria-selected={ isItemSelected ? 'true' : 'false' }
+            checked={ isItemSelected }
+          >{ onRenderOption(item, this._onRenderOption) }
+          </Checkbox>
+        )
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
index dc41a2a447b21..55249bcb357bb 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
@@ -102,46 +102,52 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
 
   private _getPersonaControl(persona: IFacepilePersona): JSX.Element {
     let { getPersonaProps, personaSize } = this.props;
-    return <Persona
-      imageInitials={ persona.imageInitials }
-      imageUrl={ persona.imageUrl }
-      initialsColor={ persona.initialsColor }
-      primaryText={ persona.personaName }
-      size={ personaSize }
-      hidePersonaDetails={ true }
-      {...(getPersonaProps ? getPersonaProps(persona) : null) }
-    />;
+    return (
+      <Persona
+        imageInitials={ persona.imageInitials }
+        imageUrl={ persona.imageUrl }
+        initialsColor={ persona.initialsColor }
+        primaryText={ persona.personaName }
+        size={ personaSize }
+        hidePersonaDetails={ true }
+        {...(getPersonaProps ? getPersonaProps(persona) : null) }
+      />
+    );
   }
 
   private _getElementWithOnClickEvent(personaControl: JSX.Element, persona: IFacepilePersona, index: number): JSX.Element {
-    return <BaseButton
-      { ...getNativeProps(persona, buttonProperties) }
-      key={ (!!persona.imageUrl ? 'i' : '') + index }
-      data-is-focusable={ true }
-      role='option'
-      className={ css('ms-Facepile-itemButton ms-Facepile-person', styles.itemButton) }
-      title={ persona.personaName }
-      onClick={ this._onPersonaClick.bind(this, persona) }
-      onMouseMove={ this._onPersonaMouseMove.bind(this, persona) }
-      onMouseOut={ this._onPersonaMouseOut.bind(this, persona) }
-    >
-      { personaControl }
-    </BaseButton>;
+    return (
+      <BaseButton
+        { ...getNativeProps(persona, buttonProperties) }
+        key={ (!!persona.imageUrl ? 'i' : '') + index }
+        data-is-focusable={ true }
+        role='option'
+        className={ css('ms-Facepile-itemButton ms-Facepile-person', styles.itemButton) }
+        title={ persona.personaName }
+        onClick={ this._onPersonaClick.bind(this, persona) }
+        onMouseMove={ this._onPersonaMouseMove.bind(this, persona) }
+        onMouseOut={ this._onPersonaMouseOut.bind(this, persona) }
+      >
+        { personaControl }
+      </BaseButton>
+    );
   }
 
   private _getElementWithoutOnClickEvent(personaControl: JSX.Element, persona: IFacepilePersona, index: number): JSX.Element {
-    return <div
-      { ...getNativeProps(persona, divProperties) }
-      key={ (!!persona.imageUrl ? 'i' : '') + index }
-      data-is-focusable={ true }
-      role='option'
-      className={ css('ms-Facepile-itemButton ms-Facepile-person', styles.itemButton) }
-      title={ persona.personaName }
-      onMouseMove={ this._onPersonaMouseMove.bind(this, persona) }
-      onMouseOut={ this._onPersonaMouseOut.bind(this, persona) }
-    >
-      { personaControl }
-    </div>;
+    return (
+      <div
+        { ...getNativeProps(persona, divProperties) }
+        key={ (!!persona.imageUrl ? 'i' : '') + index }
+        data-is-focusable={ true }
+        role='option'
+        className={ css('ms-Facepile-itemButton ms-Facepile-person', styles.itemButton) }
+        title={ persona.personaName }
+        onMouseMove={ this._onPersonaMouseMove.bind(this, persona) }
+        onMouseOut={ this._onPersonaMouseOut.bind(this, persona) }
+      >
+        { personaControl }
+      </div>
+    );
   }
 
   private _getOverflowElement(numPersonasToShow: number): JSX.Element | null {
@@ -165,55 +171,61 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
 
     let personaNames: string = personas.slice(numPersonasToShow).map((p: IFacepilePersona) => p.personaName).join(', ');
 
-    return <BaseButton
-      { ...overflowButtonProps}
-      ariaDescription={ personaNames }
-      className={ css('ms-Facepile-descriptiveOverflowButton', 'ms-Facepile-itemButton', styles.descriptiveOverflowButton, styles.itemButton) }
-    >
-      <Persona
-        title={ personaNames }
-        size={ personaSize }
-        hidePersonaDetails={ true }
-        onRenderInitials={ () => {
-          return (
-            <span>{ '+' + numPersonasNotPictured }</span>
-          );
-        } }
-      />
-    </BaseButton>;
+    return (
+      <BaseButton
+        { ...overflowButtonProps}
+        ariaDescription={ personaNames }
+        className={ css('ms-Facepile-descriptiveOverflowButton', 'ms-Facepile-itemButton', styles.descriptiveOverflowButton, styles.itemButton) }
+      >
+        <Persona
+          title={ personaNames }
+          size={ personaSize }
+          hidePersonaDetails={ true }
+          onRenderInitials={ () => {
+            return (
+              <span>{ '+' + numPersonasNotPictured }</span>
+            );
+          } }
+        />
+      </BaseButton>
+    );
   }
 
   private _getIconElement(icon: string): JSX.Element {
     let { overflowButtonProps, personaSize } = this.props;
 
-    return <BaseButton
-      {...overflowButtonProps}
-      className={ css('ms-Facepile-overflowButton', 'ms-Facepile-itemButton', styles.overflowButton, styles.itemButton) }
-    >
-      <Persona
-        size={ personaSize }
-        hidePersonaDetails={ true }
-        onRenderInitials={ () => (
-          <Icon iconName={ icon } />
-        ) }
-      />
-    </BaseButton>;
+    return (
+      <BaseButton
+        {...overflowButtonProps}
+        className={ css('ms-Facepile-overflowButton', 'ms-Facepile-itemButton', styles.overflowButton, styles.itemButton) }
+      >
+        <Persona
+          size={ personaSize }
+          hidePersonaDetails={ true }
+          onRenderInitials={ () => (
+            <Icon iconName={ icon } />
+          ) }
+        />
+      </BaseButton>
+    );
   }
 
   private _getAddNewElement(): JSX.Element {
     let { addButtonProps, personaSize } = this.props;
-    return <BaseButton
-      {...addButtonProps}
-      className={ css('ms-Facepile-addButton', 'ms-Facepile-itemButton', styles.itemButton, styles.addButton) }
-    >
-      <Persona
-        size={ personaSize }
-        hidePersonaDetails={ true }
-        onRenderInitials={ () => (
-          <Icon iconName='AddFriend' />
-        ) }
-      />
-    </BaseButton>;
+    return (
+      <BaseButton
+        {...addButtonProps}
+        className={ css('ms-Facepile-addButton', 'ms-Facepile-itemButton', styles.itemButton, styles.addButton) }
+      >
+        <Persona
+          size={ personaSize }
+          hidePersonaDetails={ true }
+          onRenderInitials={ () => (
+            <Icon iconName='AddFriend' />
+          ) }
+        />
+      </BaseButton>
+    );
   }
 
   private _onPersonaClick(persona: IFacepilePersona, ev?: React.MouseEvent<HTMLElement>): void {
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.visualtest.tsx
index 21f7e869eef6b..18d86e8414d10 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.visualtest.tsx
@@ -4,23 +4,25 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 export default class FacepileVPage extends React.Component<any, any> {
   public render() {
-    return <div>
-      <label>Basic Facepile:</label>
-      <Facepile
-        className='Facepile'
-        personas={ [{
-          imageUrl: './images/persona-female.png',
-          personaName: 'Annie Lindqvist',
-          imageInitials: 'AL',
-          data: '50%'
-        },
-        {
-          imageUrl: './images/persona-male.png',
-          personaName: 'Aaron Reid',
-          imageInitials: 'AR',
-          data: '$1,000'
-        }] }
-      />
-    </div>;
+    return (
+      <div>
+        <label>Basic Facepile:</label>
+        <Facepile
+          className='Facepile'
+          personas={ [{
+            imageUrl: './images/persona-female.png',
+            personaName: 'Annie Lindqvist',
+            imageInitials: 'AL',
+            data: '50%'
+          },
+          {
+            imageUrl: './images/persona-male.png',
+            personaName: 'Aaron Reid',
+            imageInitials: 'AR',
+            data: '$1,000'
+          }] }
+        />
+      </div>
+    );
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Label/LabelPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Label/LabelPage.visualtest.tsx
index 196601c608490..18e2f06feadef 100644
--- a/packages/office-ui-fabric-react/src/components/Label/LabelPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/Label/LabelPage.visualtest.tsx
@@ -4,13 +4,15 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 export default class LabelVPage extends React.Component<any, any> {
   public render() {
-    return <div>
+    return (
       <div>
-        <div><Label className='Label'>I'm a Label</Label></div>&nbsp;
+        <div>
+          <div><Label className='Label'>I'm a Label</Label></div>&nbsp;
            <div><Label className='LabelDisabled' disabled={ true }>I'm a disabled Label</Label></div>&nbsp;
            <div><Label className='LabelRequired' required={ true }>I'm a required Label</Label></div>&nbsp;
         </div>
 
-    </div>;
+      </div>
+    );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx b/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx
index 3a16f726cd7d4..9d82019ab6bfe 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx
@@ -88,9 +88,11 @@ export class Layer extends BaseComponent<ILayerProps, {}> {
       // Using this 'unstable' method allows us to retain the React context across the layer projection.
       ReactDOM.unstable_renderSubtreeIntoContainer(
         this,
-        <Fabric className={ css('ms-Layer-content', styles.content) }>
-          { this.props.children }
-        </Fabric>,
+        (
+          <Fabric className={ css('ms-Layer-content', styles.content) }>
+            { this.props.children }
+          </Fabric>
+        ),
         this._layerElement,
         () => {
           if (!this._hasMounted) {
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
index 84777fef287b9..fc1ae9b3afc7f 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
@@ -51,13 +51,15 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
 
   private _getActionsDiv(): JSX.Element | null {
     if (this.props.actions) {
-      return <div
-        className={ this.props.isMultiline ?
-          ('ms-MessageBar-actions ' + styles.actions) :
-          ('ms-MessageBar-actionsOneline ' + styles.actionsOneline) }
-      >
-        { this.props.actions }
-      </div>;
+      return (
+        <div
+          className={ this.props.isMultiline ?
+            ('ms-MessageBar-actions ' + styles.actions) :
+            ('ms-MessageBar-actionsOneline ' + styles.actionsOneline) }
+        >
+          { this.props.actions }
+        </div>
+      );
     }
     return null;
   }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index cd7ebad9aed3f..026ef8f58e340 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -125,25 +125,27 @@ export class Persona extends BaseComponent<IPersonaProps, IPersonaState> {
     }
 
     let divProps = getNativeProps(this.props, divProperties);
-    let personaDetails = <div className={ css('ms-Persona-details', styles.details) }>
-      { this._renderElement(
-        this.props.primaryText,
-        css('ms-Persona-primaryText', styles.primaryText),
-        onRenderPrimaryText) }
-      { this._renderElement(
-        this.props.secondaryText,
-        css('ms-Persona-secondaryText', styles.secondaryText),
-        onRenderSecondaryText) }
-      { this._renderElement(
-        this.props.tertiaryText,
-        css('ms-Persona-tertiaryText', styles.tertiaryText),
-        onRenderTertiaryText) }
-      { this._renderElement(
-        this.props.optionalText,
-        css('ms-Persona-optionalText', styles.optionalText),
-        onRenderOptionalText) }
-      { this.props.children }
-    </div>;
+    let personaDetails = (
+      <div className={ css('ms-Persona-details', styles.details) }>
+        { this._renderElement(
+          this.props.primaryText,
+          css('ms-Persona-primaryText', styles.primaryText),
+          onRenderPrimaryText) }
+        { this._renderElement(
+          this.props.secondaryText,
+          css('ms-Persona-secondaryText', styles.secondaryText),
+          onRenderSecondaryText) }
+        { this._renderElement(
+          this.props.tertiaryText,
+          css('ms-Persona-tertiaryText', styles.tertiaryText),
+          onRenderTertiaryText) }
+        { this._renderElement(
+          this.props.optionalText,
+          css('ms-Persona-optionalText', styles.optionalText),
+          onRenderOptionalText) }
+        { this.props.children }
+      </div>
+    );
 
     return (
       <div
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
index 7353ccf87fc6c..72c531c7ac7a9 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
@@ -159,15 +159,17 @@ export class Pivot extends BaseComponent<IPivotProps, IPivotState> {
   private _renderLinkContent(link: IPivotItemProps): JSX.Element {
     const { itemCount, itemIcon, linkText } = link;
 
-    return <span className={ css('ms-Pivot-link-content') }>
-      { itemIcon !== undefined && (
-        <span className={ css('ms-Pivot-icon', styles.icon) }>
-          <Icon iconName={ itemIcon } />
-        </span>
-      ) }
-      { linkText !== undefined && <span className={ css('ms-Pivot-text', styles.text) }> { link.linkText }</span> }
-      { itemCount !== undefined && <span className={ css('ms-Pivot-count', styles.count) } > ({ itemCount })</span> }
-    </span>;
+    return (
+      <span className={ css('ms-Pivot-link-content') }>
+        { itemIcon !== undefined && (
+          <span className={ css('ms-Pivot-icon', styles.icon) }>
+            <Icon iconName={ itemIcon } />
+          </span>
+        ) }
+        { linkText !== undefined && <span className={ css('ms-Pivot-text', styles.text) }> { link.linkText }</span> }
+        { itemCount !== undefined && <span className={ css('ms-Pivot-count', styles.count) } > ({ itemCount })</span> }
+      </span>
+    );
   }
 
   /**
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.IconCount.Example.tsx b/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.IconCount.Example.tsx
index 046087da2afc0..bd8be4a772a45 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.IconCount.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.IconCount.Example.tsx
@@ -33,9 +33,11 @@ export class PivotIconCountExample extends React.Component<any, any> {
   }
 
   private _customRenderer(link: IPivotItemProps, defaultRenderer: (link: IPivotItemProps) => JSX.Element): JSX.Element {
-    return <span>
-      { defaultRenderer(link) }
-      <Icon iconName='Airplane' style={ { 'color': 'red' } } />
-    </span>;
+    return (
+      <span>
+        { defaultRenderer(link) }
+        <Icon iconName='Airplane' style={ { 'color': 'red' } } />
+      </span>
+    );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx b/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
index d7af7b5180257..d47c366441514 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
@@ -49,47 +49,51 @@ export class Rating extends BaseComponent<IRatingProps, IRatingState> {
       stars.push(this._renderStar(i));
     }
 
-    return <div
-      className={ css('ms-Rating', this.props.className, {
-        ['ms-Rating--large ' + styles.rootIsLarge]: this.props.size === RatingSize.Large
-      }) }
-      role='application'
-    >
-      <div className={ css('ms-Rating-container', styles.container) } role='radiogroup' aria-labelledby={ this.props.ariaLabelId }>
-        { stars }
+    return (
+      <div
+        className={ css('ms-Rating', this.props.className, {
+          ['ms-Rating--large ' + styles.rootIsLarge]: this.props.size === RatingSize.Large
+        }) }
+        role='application'
+      >
+        <div className={ css('ms-Rating-container', styles.container) } role='radiogroup' aria-labelledby={ this.props.ariaLabelId }>
+          { stars }
+        </div>
       </div>
-    </div>;
+    );
   }
 
   private _renderStar(rating: number): JSX.Element {
     const inputId = `${this._id}-${rating}`;
 
-    return <div
-      className={ css('ms-Rating-star', styles.star, {
-        ['is-selected ' + styles.starIsSelected]: rating <= (this.state.rating as number),
-        ['is-inFocus ' + styles.starIsInFocus]: rating === this.state.focusedRating,
-        ['is-disabled ' + styles.starIsDisabled]: this.props.disabled
-      }) }
-      key={ rating }
-    >
-      <input
-        className={ css('ms-Rating-input', styles.input) }
-        type='radio'
-        name={ this._id }
-        id={ inputId }
-        value={ rating }
-        aria-labelledby={ `${this._labelId}-${rating}` }
-        disabled={ this.props.disabled }
-        checked={ rating === this.state.rating }
-        onChange={ this._onChange.bind(this, rating) }
-        onFocus={ this._onFocus.bind(this, rating) }
-        onBlur={ this._onBlur.bind(this, rating) }
-      />
-      <label className={ css('ms-Rating-label', styles.label) } htmlFor={ inputId }>
-        { this._getLabel(rating) }
-        { this._getIcon() }
-      </label>
-    </div>;
+    return (
+      <div
+        className={ css('ms-Rating-star', styles.star, {
+          ['is-selected ' + styles.starIsSelected]: rating <= (this.state.rating as number),
+          ['is-inFocus ' + styles.starIsInFocus]: rating === this.state.focusedRating,
+          ['is-disabled ' + styles.starIsDisabled]: this.props.disabled
+        }) }
+        key={ rating }
+      >
+        <input
+          className={ css('ms-Rating-input', styles.input) }
+          type='radio'
+          name={ this._id }
+          id={ inputId }
+          value={ rating }
+          aria-labelledby={ `${this._labelId}-${rating}` }
+          disabled={ this.props.disabled }
+          checked={ rating === this.state.rating }
+          onChange={ this._onChange.bind(this, rating) }
+          onFocus={ this._onFocus.bind(this, rating) }
+          onBlur={ this._onBlur.bind(this, rating) }
+        />
+        <label className={ css('ms-Rating-label', styles.label) } htmlFor={ inputId }>
+          { this._getLabel(rating) }
+          { this._getIcon() }
+        </label>
+      </div>
+    );
   }
 
   private _onFocus(value: number, ev: React.FocusEvent<HTMLElement>): void {
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx
index 30fd589a4d30c..05f35d8609320 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx
@@ -41,11 +41,13 @@ const BoxWithLabel: React.StatelessComponent<IBoxWithLabelProps> =
 function renderBoxWithLabels(count: number, backgroundColor: string): JSX.Element[] {
   let result: JSX.Element[] = [];
   for (let i = 1; i <= count; i += 1) {
-    result.push(<BoxWithLabel
-      label={ `${i}` }
-      backgroundColor={ backgroundColor }
-      key={ `${backgroundColor}-${i}` }
-    />);
+    result.push(
+      <BoxWithLabel
+        label={ `${i}` }
+        backgroundColor={ backgroundColor }
+        key={ `${backgroundColor}-${i}` }
+      />
+    );
   }
   return result;
 }
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.visualtest.tsx
index 24329c93036e8..0f39c0a787f29 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.visualtest.tsx
@@ -4,16 +4,18 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 export default class ToggleVPage extends React.Component<any, any> {
   public render() {
-    return <div >
-      <Toggle
-        className='Toggle'
-        defaultChecked={ true }
-        label='Enabled and checked'
-        onAriaLabel='This toggle is checked. Press to uncheck.'
-        offAriaLabel='This toggle is unchecked. Press to check.'
-        onText='On'
-        offText='Off'
-      />
-    </div>;
+    return (
+      <div>
+        <Toggle
+          className='Toggle'
+          defaultChecked={ true }
+          label='Enabled and checked'
+          onAriaLabel='This toggle is checked. Press to uncheck.'
+          offAriaLabel='This toggle is unchecked. Press to check.'
+          onText='On'
+          offText='Off'
+        />
+      </div>
+    );
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.visualtest.tsx
index 8f517f5d28b1b..d6cb82d750f5a 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.visualtest.tsx
@@ -5,10 +5,12 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 export default class TooltipVPage extends React.Component<any, any> {
   public render() {
-    return <div >
-      <TooltipHost content='This is the tooltip' id='Tooltip' calloutProps={ { gapSpace: 25 } }>
-        <DefaultButton id='TooltipButton' aria-describedby='myID'>Hover Over Me</DefaultButton>
-      </TooltipHost>
-    </div>;
+    return (
+      <div>
+        <TooltipHost content='This is the tooltip' id='Tooltip' calloutProps={ { gapSpace: 25 } }>
+          <DefaultButton id='TooltipButton' aria-describedby='myID'>Hover Over Me</DefaultButton>
+        </TooltipHost>
+      </div>
+    );
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
index 91b654b2186da..76b1a9c160bc2 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
@@ -116,16 +116,18 @@ export class BaseAutoFill extends BaseComponent<IBaseAutoFillProps, IBaseAutoFil
     } = this.state;
 
     const nativeProps = getNativeProps(this.props, inputProperties);
-    return <input
-      { ...nativeProps}
-      ref={ this._resolveRef('_inputElement') }
-      value={ displayValue }
-      autoCapitalize={ 'off' }
-      autoComplete={ 'off' }
-      onChange={ this._onChange }
-      onKeyDown={ this._onKeyDown }
-      onClick={ this.props.onClick ? this.props.onClick : this._onClick }
-    />;
+    return (
+      <input
+        { ...nativeProps}
+        ref={ this._resolveRef('_inputElement') }
+        value={ displayValue }
+        autoCapitalize={ 'off' }
+        autoComplete={ 'off' }
+        onChange={ this._onChange }
+        onKeyDown={ this._onKeyDown }
+        onClick={ this.props.onClick ? this.props.onClick : this._onClick }
+      />
+    );
   }
 
   public focus() {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index 1cf2fefa6fbaf..883f6d954400c 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -88,9 +88,11 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
 
     let noResults = () => {
       return noResultsFoundText ?
-        <div role='alert' className={ css('ms-Suggestions-none', styles.suggestionsNone) }>
-          { noResultsFoundText }
-        </div> : null;
+        (
+          <div role='alert' className={ css('ms-Suggestions-none', styles.suggestionsNone) }>
+            { noResultsFoundText }
+          </div>
+        ) : null;
     };
     // MostRecently Used text should supercede the header text if it's there and available.
     let headerText: string | undefined = suggestionsHeaderText;
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx b/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx
index b0b0e54b95dad..f04262d154d42 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx
@@ -22,11 +22,13 @@ const DEFAULT_ITEMS: any[] = [
 describe('Grid', () => {
 
   it('Can render a grid with width of four', () => {
-    let wrapper = shallow(<Grid
-      items={ DEFAULT_ITEMS }
-      columnCount={ 4 }
-      onRenderItem={ (item: any, index: number) => { return <DefaultButton role='gridcell'>item.text</DefaultButton>; } }
-    />);
+    let wrapper = shallow(
+      <Grid
+        items={ DEFAULT_ITEMS }
+        columnCount={ 4 }
+        onRenderItem={ (item: any, index: number) => { return <DefaultButton role='gridcell'>item.text</DefaultButton>; } }
+      />
+    );
     expect(wrapper.find('table[role="grid"]').length).to.equal(1, 'expect to have one table with role="grid"');
     expect(wrapper.find('tr[role="row"]').length).to.equal(2, 'expect to have 2 rows with role="row"');
     expect(wrapper.find('td [role="gridcell"]').length).to.equal(8, 'expect to have 8 cells with role="gridcell"');
@@ -34,11 +36,13 @@ describe('Grid', () => {
     expect(wrapper.find('[aria-setsize]').length).to.equal(0, 'expect to not have aria-setsize set');
   });
   it('Can render a grid with width of 2', () => {
-    let wrapper = shallow(<Grid
-      items={ DEFAULT_ITEMS }
-      columnCount={ 2 }
-      onRenderItem={ (item: any, index: number) => { return <DefaultButton role='gridcell'>item.text</DefaultButton>; } }
-    />);
+    let wrapper = shallow(
+      <Grid
+        items={ DEFAULT_ITEMS }
+        columnCount={ 2 }
+        onRenderItem={ (item: any, index: number) => { return <DefaultButton role='gridcell'>item.text</DefaultButton>; } }
+      />
+    );
     expect(wrapper.find('table[role="grid"]').length).to.equal(1, 'expect to have one table with role="grid"');
     expect(wrapper.find('tr[role="row"]').length).to.equal(4, 'expect to have 2 rows with role="row"');
     expect(wrapper.find('td [role="gridcell"]').length).to.equal(8, 'expect to have 8 cells with role="gridcell"');
@@ -46,13 +50,15 @@ describe('Grid', () => {
     expect(wrapper.find('[aria-setsize]').length).to.equal(0, 'expect to not have aria-setsize set');
   });
   it('Can render a grid with posInSet and setSize', () => {
-    let wrapper = shallow(<Grid
-      items={ DEFAULT_ITEMS }
-      columnCount={ 2 }
-      onRenderItem={ (item: any, index: number) => { return <DefaultButton role='gridcell'>item.text</DefaultButton>; } }
-      positionInSet={ 1 }
-      setSize={ 2 }
-    />);
+    let wrapper = shallow(
+      <Grid
+        items={ DEFAULT_ITEMS }
+        columnCount={ 2 }
+        onRenderItem={ (item: any, index: number) => { return <DefaultButton role='gridcell'>item.text</DefaultButton>; } }
+        positionInSet={ 1 }
+        setSize={ 2 }
+      />
+    );
     expect(wrapper.find('table[role="grid"]').length).to.equal(1, 'expect to have one table with role="grid"');
     expect(wrapper.find('tr[role="row"]').length).to.equal(4, 'expect to have 2 rows with role="row"');
     expect(wrapper.find('td [role="gridcell"]').length).to.equal(8, 'expect to have 8 cells with role="gridcell"');
diff --git a/packages/office-ui-fabric-react/tslint.json b/packages/office-ui-fabric-react/tslint.json
index a032b7ce22dfa..adc4238d53cb5 100644
--- a/packages/office-ui-fabric-react/tslint.json
+++ b/packages/office-ui-fabric-react/tslint.json
@@ -6,8 +6,6 @@
     "jsx-no-string-ref": false,
     "jsx-key": false,
     "jsx-boolean-value": false,
-    "jsx-no-multiline-js": false,
-    "jsx-wrap-multiline": false,
     "jsx-self-close": false,
     "jsx-no-lambda": false,
     "jsx-ban-props": false,

From 8619cf13781be21dcb5a3969a4d20df883311e83 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 12 Sep 2017 10:10:22 +0000
Subject: [PATCH 0616/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../boemor-menuSections_2017-08-16-01-53.json | 11 ----
 ...owsOnMonthPickerOnly_2017-09-11-18-36.json | 11 ----
 ...ssage-bar-truncation_2017-09-11-22-15.json | 11 ----
 .../minor-pickerfixes_2017-09-07-16-52.json   | 11 ----
 .../nav_2017-09-09-14-56.json                 | 11 ----
 ...split-button-divider_2017-09-08-00-37.json | 11 ----
 ...t-button-menu-anchor_2017-09-11-13-13.json | 11 ----
 ...-useKeyForActiveRows_2017-09-07-21-59.json | 11 ----
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 51 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 19 ++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 16 files changed, 75 insertions(+), 95 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/boemor-menuSections_2017-08-16-01-53.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-Calendar-FixArrowsOnMonthPickerOnly_2017-09-11-18-36.json
 delete mode 100644 common/changes/office-ui-fabric-react/message-bar-truncation_2017-09-11-22-15.json
 delete mode 100644 common/changes/office-ui-fabric-react/minor-pickerfixes_2017-09-07-16-52.json
 delete mode 100644 common/changes/office-ui-fabric-react/nav_2017-09-09-14-56.json
 delete mode 100644 common/changes/office-ui-fabric-react/split-button-divider_2017-09-08-00-37.json
 delete mode 100644 common/changes/office-ui-fabric-react/split-button-menu-anchor_2017-09-11-13-13.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-cschleid-useKeyForActiveRows_2017-09-07-21-59.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 4be2564af5c71..fdc8cbb254bc4 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -44,7 +44,7 @@
     "@uifabric/example-app-base": ">=4.2.7 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=4.43.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.45.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 488644b764d5b..4aa34a87905b7 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.43.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.45.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 07a99cd82381c..102e4c184c146 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -26,7 +26,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.43.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.45.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 891dad98b7666..667fb7fcc8a79 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -24,7 +24,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=4.43.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.45.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/boemor-menuSections_2017-08-16-01-53.json b/common/changes/office-ui-fabric-react/boemor-menuSections_2017-08-16-01-53.json
deleted file mode 100644
index 2f78d6a5dd370..0000000000000
--- a/common/changes/office-ui-fabric-react/boemor-menuSections_2017-08-16-01-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add sections to contextual menus",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "boemor@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kegorr-Calendar-FixArrowsOnMonthPickerOnly_2017-09-11-18-36.json b/common/changes/office-ui-fabric-react/kegorr-Calendar-FixArrowsOnMonthPickerOnly_2017-09-11-18-36.json
deleted file mode 100644
index 4fc3edc15ff04..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-Calendar-FixArrowsOnMonthPickerOnly_2017-09-11-18-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Calendar: Arrows (when month picker only) do not navigate correctly.  Fixed this and fixed position.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/message-bar-truncation_2017-09-11-22-15.json b/common/changes/office-ui-fabric-react/message-bar-truncation_2017-09-11-22-15.json
deleted file mode 100644
index 03a0d3db5c79c..0000000000000
--- a/common/changes/office-ui-fabric-react/message-bar-truncation_2017-09-11-22-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "MessageBar: Added word-break to fix long words in message bar",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/minor-pickerfixes_2017-09-07-16-52.json b/common/changes/office-ui-fabric-react/minor-pickerfixes_2017-09-07-16-52.json
deleted file mode 100644
index 1d307c8aaf599..0000000000000
--- a/common/changes/office-ui-fabric-react/minor-pickerfixes_2017-09-07-16-52.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Pickers: Fixed a bug where suggestionsHeaderText would not display, also fixed backspace event propagating even when it was handled.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/nav_2017-09-09-14-56.json b/common/changes/office-ui-fabric-react/nav_2017-09-09-14-56.json
deleted file mode 100644
index cdc6159a597cd..0000000000000
--- a/common/changes/office-ui-fabric-react/nav_2017-09-09-14-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Mix native props to Nav items.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "s@warmsea.net"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/split-button-divider_2017-09-08-00-37.json b/common/changes/office-ui-fabric-react/split-button-divider_2017-09-08-00-37.json
deleted file mode 100644
index bc638fca7b354..0000000000000
--- a/common/changes/office-ui-fabric-react/split-button-divider_2017-09-08-00-37.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Button: Add support for dividers in split buttons",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/split-button-menu-anchor_2017-09-11-13-13.json b/common/changes/office-ui-fabric-react/split-button-menu-anchor_2017-09-11-13-13.json
deleted file mode 100644
index 86a6aaf7a2b9f..0000000000000
--- a/common/changes/office-ui-fabric-react/split-button-menu-anchor_2017-09-11-13-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SplitButton: Update the menu launcher target for a split button to be the entire control instead of just the menu launching portion",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-cschleid-useKeyForActiveRows_2017-09-07-21-59.json b/common/changes/office-ui-fabric-react/users-cschleid-useKeyForActiveRows_2017-09-07-21-59.json
deleted file mode 100644
index 448a117c90c01..0000000000000
--- a/common/changes/office-ui-fabric-react/users-cschleid-useKeyForActiveRows_2017-09-07-21-59.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: Update activeRows management to use item keys",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "cschleid@microsoft.com"
-}
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 3ccd9715c1dd1..29caec30c5d57 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/styling": ">=0.23.0 <1.0.0",
     "@uifabric/utilities": ">=4.13.0 <5.0.0",
-    "office-ui-fabric-react": ">=4.44.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.45.0 <5.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 7b0e4a9593442..ce973705b28dd 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,57 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.45.0",
+      "tag": "office-ui-fabric-react_v4.45.0",
+      "date": "Tue, 12 Sep 2017 10:10:21 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Boris Emorine <boris.emorine@gmail.com>",
+            "commit": "4507629a84b12d34710a1c4a3dcdcfb1d0cd3706",
+            "comment": "Add sections to contextual menus"
+          },
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "bb12bfd38b0ecd888f8ca3093b189441a0f25d59",
+            "comment": "Calendar: Arrows (when month picker only) do not navigate correctly.  Fixed this and fixed position."
+          }
+        ],
+        "patch": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "5ae36cdf70861f2394d26860828e835b8e3f104f",
+            "comment": "MessageBar: Added word-break to fix long words in message bar"
+          },
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "50f32d1f57ddc19896859706988532d802e58c21",
+            "comment": "Pickers: Fixed a bug where suggestionsHeaderText would not display, also fixed backspace event propagating even when it was handled."
+          },
+          {
+            "author": "Su Su <s@warmsea.net>",
+            "commit": "78da91b485c66020572cf39c8e89f480201f62c6",
+            "comment": "Mix native props to Nav items."
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "ac1613307947170307bd3df04c193d45c02f85f2",
+            "comment": "Button: Add support for dividers in split buttons"
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "1b885ff4a5b392b121d8251ccf2601d667e2e946",
+            "comment": "SplitButton: Update the menu launcher target for a split button to be the entire control instead of just the menu launching portion"
+          },
+          {
+            "author": "Christopher Schleiden <cschleiden@live.de>",
+            "commit": "ec3bd72dd9a215594f95bd18ade01676ceefeb29",
+            "comment": "DetailsList: Update activeRows management to use item keys"
+          }
+        ]
+      }
+    },
     {
       "version": "4.44.0",
       "tag": "office-ui-fabric-react_v4.44.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 14ca7e41f6f4a..e088d50205ee7 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,23 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 11 Sep 2017 10:08:07 GMT and should not be manually modified.
+This log was last generated on Tue, 12 Sep 2017 10:10:21 GMT and should not be manually modified.
+
+## 4.45.0
+Tue, 12 Sep 2017 10:10:21 GMT
+
+### Minor changes
+
+- Add sections to contextual menus
+- Calendar: Arrows (when month picker only) do not navigate correctly.  Fixed this and fixed position.
+
+### Patches
+
+- MessageBar: Added word-break to fix long words in message bar
+- Pickers: Fixed a bug where suggestionsHeaderText would not display, also fixed backspace event propagating even when it was handled.
+- Mix native props to Nav items.
+- Button: Add support for dividers in split buttons
+- SplitButton: Update the menu launcher target for a split button to be the entire control instead of just the menu launching portion
+- DetailsList: Update activeRows management to use item keys
 
 ## 4.44.0
 Mon, 11 Sep 2017 10:08:07 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index fcc2308d22360..a70699ef88054 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.44.0",
+  "version": "4.45.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 2bf79bd23bfa95a01b3d4a198fef886ae8e6bba0 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <mgodbolt@microsoft.com>
Date: Tue, 12 Sep 2017 09:04:38 -0700
Subject: [PATCH 0617/1641] Fixed collapseing logic to look at all items

---
 .../src/components/DetailsList/DetailsList.tsx                  | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 13904d3ae5c78..0a5b3249783d9 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -619,7 +619,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     let lastIndex = adjustedColumns.length - 1;
 
     // Remove collapsable columns.
-    while (lastIndex > 1 && totalWidth > availableWidth) {
+    while (lastIndex > -1 && totalWidth > availableWidth) {
       let column = adjustedColumns[lastIndex];
 
       if (column.isCollapsable) {

From 0e756bf2e9f4182183117b350e6a44b58c4d17d4 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <mgodbolt@microsoft.com>
Date: Tue, 12 Sep 2017 09:05:29 -0700
Subject: [PATCH 0618/1641] change file

---
 .../master_2017-09-12-16-05.json                      | 11 +++++++++++
 1 file changed, 11 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/master_2017-09-12-16-05.json

diff --git a/common/changes/office-ui-fabric-react/master_2017-09-12-16-05.json b/common/changes/office-ui-fabric-react/master_2017-09-12-16-05.json
new file mode 100644
index 0000000000000..c020e8fbf51ef
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2017-09-12-16-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailList: Fixed collapsing logic to look at all items including first 2",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file

From 9db000a49c481b20e02ad50517a737472d2d7d54 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <mgodbolt@microsoft.com>
Date: Tue, 12 Sep 2017 09:07:43 -0700
Subject: [PATCH 0619/1641] Reverting changes

---
 .../src/components/DetailsList/DetailsList.tsx                  | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 0a5b3249783d9..13904d3ae5c78 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -619,7 +619,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     let lastIndex = adjustedColumns.length - 1;
 
     // Remove collapsable columns.
-    while (lastIndex > -1 && totalWidth > availableWidth) {
+    while (lastIndex > 1 && totalWidth > availableWidth) {
       let column = adjustedColumns[lastIndex];
 
       if (column.isCollapsable) {

From 281013959f89749cff469544d6fa64a17011936e Mon Sep 17 00:00:00 2001
From: Micah Godbolt <mgodbolt@microsoft.com>
Date: Tue, 12 Sep 2017 09:08:28 -0700
Subject: [PATCH 0620/1641] removing extra change file

---
 .../master_2017-09-12-16-05.json                      | 11 -----------
 1 file changed, 11 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/master_2017-09-12-16-05.json

diff --git a/common/changes/office-ui-fabric-react/master_2017-09-12-16-05.json b/common/changes/office-ui-fabric-react/master_2017-09-12-16-05.json
deleted file mode 100644
index c020e8fbf51ef..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2017-09-12-16-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailList: Fixed collapsing logic to look at all items including first 2",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file

From 9f12afd7ed79b9e63a9bb1d1dcae9e7277489079 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 12 Sep 2017 09:46:11 -0700
Subject: [PATCH 0621/1641] Update experiments exports (#2809)

* Added components to experiments exports

* Change file
---
 .../update-experiments-exports_2017-09-12-16-36.json  | 11 +++++++++++
 packages/experiments/src/index.ts                     |  4 ++++
 2 files changed, 15 insertions(+)
 create mode 100644 common/changes/@uifabric/experiments/update-experiments-exports_2017-09-12-16-36.json

diff --git a/common/changes/@uifabric/experiments/update-experiments-exports_2017-09-12-16-36.json b/common/changes/@uifabric/experiments/update-experiments-exports_2017-09-12-16-36.json
new file mode 100644
index 0000000000000..12bf9c619473c
--- /dev/null
+++ b/common/changes/@uifabric/experiments/update-experiments-exports_2017-09-12-16-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Added LayoutGroup, FolderCover, Tile and TilesList to exports",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/index.ts b/packages/experiments/src/index.ts
index ce7a32b91e947..7fe886277ffed 100644
--- a/packages/experiments/src/index.ts
+++ b/packages/experiments/src/index.ts
@@ -1,2 +1,6 @@
 export { CommandBar } from './CommandBar';
+export { LayoutGroup } from './LayoutGroup';
+export { FolderCover } from './FolderCover';
+export { Tile } from './Tile';
+export { TilesList } from './TilesList';
 export { CommandBar as ExperimentCommandBar } from './CommandBar';
\ No newline at end of file

From 1468fcd5016e6b499b3d462db2de0ef4085e7579 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 12 Sep 2017 10:10:23 -0700
Subject: [PATCH 0622/1641] DetailsList: Fix column resize (#2808)

* Fixed detaillist resize

* Adding changefile

* Update detailList-resize_2017-09-12-16-09.json
---
 .../detailList-resize_2017-09-12-16-09.json           | 11 +++++++++++
 .../src/components/DetailsList/DetailsList.tsx        |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/detailList-resize_2017-09-12-16-09.json

diff --git a/common/changes/office-ui-fabric-react/detailList-resize_2017-09-12-16-09.json b/common/changes/office-ui-fabric-react/detailList-resize_2017-09-12-16-09.json
new file mode 100644
index 0000000000000..99ab36dda3d0f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/detailList-resize_2017-09-12-16-09.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: Fixed collapsing logic to look at all items including first 2",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 13904d3ae5c78..0a5b3249783d9 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -619,7 +619,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     let lastIndex = adjustedColumns.length - 1;
 
     // Remove collapsable columns.
-    while (lastIndex > 1 && totalWidth > availableWidth) {
+    while (lastIndex > -1 && totalWidth > availableWidth) {
       let column = adjustedColumns[lastIndex];
 
       if (column.isCollapsable) {

From d07499a8a812bc8467f152ea1aee325e02e6ab6c Mon Sep 17 00:00:00 2001
From: Serkan Inci <serkan.inci@hotmail.com>
Date: Tue, 12 Sep 2017 13:15:23 -0400
Subject: [PATCH 0623/1641] Fixing circular dependencies in imports (#2810)

* Fixing circular dependency issues.

* Adding config changes.
---
 .../@uifabric/styling/master_2017-09-12-17-03.json    | 11 +++++++++++
 .../master_2017-09-12-17-03.json                      | 11 +++++++++++
 .../components/Button/PrimaryButton/PrimaryButton.tsx |  2 +-
 packages/styling/src/classNames/IconClassNames.ts     |  2 +-
 packages/styling/src/styles/getFocusStyle.ts          |  2 +-
 5 files changed, 25 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/master_2017-09-12-17-03.json
 create mode 100644 common/changes/office-ui-fabric-react/master_2017-09-12-17-03.json

diff --git a/common/changes/@uifabric/styling/master_2017-09-12-17-03.json b/common/changes/@uifabric/styling/master_2017-09-12-17-03.json
new file mode 100644
index 0000000000000..c9d7629b52db5
--- /dev/null
+++ b/common/changes/@uifabric/styling/master_2017-09-12-17-03.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Fixing circular dependency issue.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "serkani@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2017-09-12-17-03.json b/common/changes/office-ui-fabric-react/master_2017-09-12-17-03.json
new file mode 100644
index 0000000000000..3adfd3f78cc71
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2017-09-12-17-03.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixing circular dependency issue in PrimaryButton.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "serkani@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
index abe548f86bccb..4a8c121008bd9 100644
--- a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
 import { ThemeSettingName } from '../../../Styling';
-import { DefaultButton } from '../';
+import { DefaultButton } from '../DefaultButton/DefaultButton';
 import { IButtonProps } from '../Button.Props';
 
 @customizable([ThemeSettingName])
diff --git a/packages/styling/src/classNames/IconClassNames.ts b/packages/styling/src/classNames/IconClassNames.ts
index e979e7edbe94f..d10c22d2775ed 100644
--- a/packages/styling/src/classNames/IconClassNames.ts
+++ b/packages/styling/src/classNames/IconClassNames.ts
@@ -1,7 +1,7 @@
 import { IconCodes, DefaultFontStyles } from '../styles/index';
 import {
   mergeStyles
-} from '../utilities/index';
+} from '../utilities/mergeStyles';
 
 /**
  * Deprecated: All class names for all Fabric icons.
diff --git a/packages/styling/src/styles/getFocusStyle.ts b/packages/styling/src/styles/getFocusStyle.ts
index cb66fbaf6ca41..685fe7f353e3b 100644
--- a/packages/styling/src/styles/getFocusStyle.ts
+++ b/packages/styling/src/styles/getFocusStyle.ts
@@ -1,4 +1,4 @@
-import { mergeStyles } from '../utilities/index';
+import { mergeStyles } from '../utilities/mergeStyles';
 import { IProcessedStyle, ITheme } from '../interfaces/index';
 import { parent } from '../glamorExports';
 

From dbb844d656424208faf0d082d754c2cf0cde8117 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Tue, 12 Sep 2017 10:15:54 -0700
Subject: [PATCH 0624/1641] Re-enable tslint rule 'jsx-self-close' (#2807)

---
 .../components/Breadcrumb/BreadcrumbPage.tsx  |  5 +--
 .../src/components/Button/ButtonPage.tsx      |  5 +--
 .../Button/ButtonPage.visualtest.tsx          | 44 +++++++++----------
 .../Button.ContextualMenu.Example.tsx         |  3 +-
 .../src/components/Calendar/CalendarPage.tsx  |  5 +--
 .../examples/Calendar.Button.Example.tsx      |  3 +-
 .../examples/Calendar.Inline.Example.tsx      |  3 +-
 .../src/components/Callout/CalloutPage.tsx    |  5 +--
 .../src/components/Checkbox/CheckboxPage.tsx  |  5 +--
 .../ChoiceGroup/ChoiceGroupPage.tsx           |  5 +--
 .../ColorPicker/ColorPickerPage.tsx           |  3 +-
 .../src/components/ComboBox/ComboBoxPage.tsx  |  7 ++-
 .../components/CommandBar/CommandBarPage.tsx  |  5 +--
 .../ContextualMenu/ContextualMenu.test.tsx    |  3 +-
 .../ContextualMenu/ContextualMenuPage.tsx     |  5 +--
 .../src/components/DatePicker/DatePicker.tsx  |  3 +-
 .../components/DatePicker/DatePickerPage.tsx  |  5 +--
 .../DetailsList/DetailsListPage.tsx           |  5 +--
 .../src/components/Dialog/DialogPage.tsx      |  5 +--
 .../DocumentCard/DocumentCardPage.tsx         |  5 +--
 .../src/components/Dropdown/DropdownPage.tsx  |  7 ++-
 .../src/components/Facepile/FacepilePage.tsx  |  5 +--
 .../FocusTrapZone/FocusTrapZonePage.tsx       |  3 +-
 .../components/FocusZone/FocusZone.test.tsx   |  2 +-
 .../components/FocusZone/FocusZonePage.tsx    |  3 +-
 .../GroupedList/GroupedListPage.tsx           |  3 +-
 .../src/components/Icon/IconPage.tsx          |  5 +--
 .../src/components/Image/ImagePage.tsx        |  3 +-
 .../src/components/Label/LabelPage.tsx        |  5 +--
 .../src/components/Layer/LayerPage.tsx        |  5 +--
 .../src/components/Link/LinkPage.tsx          |  5 +--
 .../src/components/List/ListPage.tsx          |  3 +-
 .../MarqueeSelection/MarqueeSelectionPage.tsx |  3 +-
 .../components/MessageBar/MessageBarPage.tsx  |  5 +--
 .../src/components/Modal/ModalPage.tsx        |  5 +--
 .../src/components/Nav/NavPage.tsx            |  5 +--
 .../src/components/Overlay/OverlayPage.tsx    |  5 +--
 .../src/components/Panel/PanelPage.tsx        |  5 +--
 .../src/components/Persona/PersonaPage.tsx    |  5 +--
 .../src/components/Pivot/PivotPage.tsx        |  5 +--
 .../ProgressIndicator/ProgressIndicator.tsx   |  5 +--
 .../ProgressIndicatorPage.tsx                 |  5 +--
 .../src/components/Rating/RatingPage.tsx      |  5 +--
 .../ScrollablePane/ScrollablePanePage.tsx     |  5 +--
 .../components/SearchBox/SearchBoxPage.tsx    |  5 +--
 .../src/components/Slider/SliderPage.tsx      |  5 +--
 .../src/components/SpinButton/SpinButton.tsx  |  4 +-
 .../components/SpinButton/SpinButtonPage.tsx  |  5 +--
 .../src/components/Spinner/Spinner.tsx        |  3 +-
 .../src/components/Spinner/SpinnerPage.tsx    |  5 +--
 .../SwatchColorPickerPage.tsx                 |  3 +-
 .../components/TextField/TextFieldPage.tsx    |  5 +--
 .../src/components/Toggle/TogglePage.tsx      |  5 +--
 .../src/components/Tooltip/TooltipHost.tsx    |  3 +-
 .../pickers/PeoplePicker/PeoplePickerPage.tsx |  3 +-
 .../src/components/pickers/PickersPage.tsx    |  3 +-
 .../src/utilities/selection/SelectionPage.tsx |  3 +-
 .../selection/SelectionZone.test.tsx          |  2 +-
 packages/office-ui-fabric-react/tslint.json   |  1 -
 59 files changed, 117 insertions(+), 174 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx
index 9344366657605..0a793af047cfa 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx
@@ -55,7 +55,7 @@ export class BreadcrumbPage extends React.Component<IComponentDemoPageProps, any
           <a href='https://dev.office.com/fabric-js/Components/Breadcrumb/Breadcrumb.html'>Fabric JS</a>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -72,8 +72,7 @@ export class BreadcrumbPage extends React.Component<IComponentDemoPageProps, any
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
index e5bacfe281408..07941f8a4e0cc 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
@@ -112,7 +112,7 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
           <a href='https://dev.office.com/fabric-js/Components/Button/Button.html'>Fabric JS</a>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -143,8 +143,7 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.visualtest.tsx
index 039f277000bbf..50265c5751279 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.visualtest.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.visualtest.tsx
@@ -14,37 +14,37 @@ export default class ButtonVPage extends React.Component<any, any> {
         </div>
         <div>
           <label> Default Button Disabled:   </label>&nbsp;
-        <DefaultButton id='DefaultButtonDisabled' disabled={ true } icon='Add' text='Default Button' />
+        <DefaultButton id='DefaultButtonDisabled' disabled={true} icon='Add' text='Default Button' />
         </div>&nbsp;
       <div>
           <label> Default Button Checked:   </label>
-          <DefaultButton id='DefaultButtonChecked' icon='Add' checked={ true } text='Default Button' />
+          <DefaultButton id='DefaultButtonChecked' icon='Add' checked={true} text='Default Button' />
         </div>&nbsp;
-      <div style={ { backgroundColor: 'white' } }>
-          <IconButton id={ 'IconButton' } iconProps={ { iconName } } />
+      <div style={{ backgroundColor: 'white' }}>
+          <IconButton id={'IconButton'} iconProps={{ iconName }} />
         </div>&nbsp;
-      <div style={ { backgroundColor: 'white' } }>
-          <IconButton id={ 'IconButtonChecked' } checked={ true } iconProps={ { iconName } } />
+      <div style={{ backgroundColor: 'white' }}>
+          <IconButton id={'IconButtonChecked'} checked={true} iconProps={{ iconName }} />
         </div>&nbsp;
-      <div style={ { backgroundColor: 'white' } }>
+      <div style={{ backgroundColor: 'white' }}>
           <CommandButton
             id='CommandButton'
             icon='AddFriend'
             text='Command Button'
           />
         </div>&nbsp;
-      <div style={ { backgroundColor: 'white' } }>
+      <div style={{ backgroundColor: 'white' }}>
           <CommandButton
             id='CommandButtonDisabled'
             icon='AddFriend'
-            disabled={ true }
+            disabled={true}
             text='Command Button'
           />
         </div >&nbsp;
-      <div style={ { backgroundColor: 'white' } }>
+      <div style={{ backgroundColor: 'white' }}>
           <CommandButton
             id='CommandButtonChecked'
-            checked={ true }
+            checked={true}
             icon='AddFriend'
             text='Command Button'
           />
@@ -59,7 +59,7 @@ export default class ButtonVPage extends React.Component<any, any> {
       <div>
           <CompoundButton
             id='CompoundButtonDisabled'
-            disabled={ true }
+            disabled={true}
             description='You can create a new account here.'
             text='Compound Button'
           />
@@ -67,7 +67,7 @@ export default class ButtonVPage extends React.Component<any, any> {
       <div>
           <CompoundButton
             id='CompoundButtonChecked'
-            checked={ true }
+            checked={true}
             description='You can create a new account here.'
             text='Compound Button'
           />
@@ -76,19 +76,19 @@ export default class ButtonVPage extends React.Component<any, any> {
           <PrimaryButton id='PrimaryButton' icon='Add' text='Primary Button' />
         </div >&nbsp;
       <div>
-          <PrimaryButton id='PrimaryButtonDisabled' disabled={ true } icon='Add' text='Primary Button' />
+          <PrimaryButton id='PrimaryButtonDisabled' disabled={true} icon='Add' text='Primary Button' />
         </div >&nbsp;
       <div>
-          <PrimaryButton id='PrimaryButtonToggled' checked={ true } icon='Add' text='Primary Button' />
+          <PrimaryButton id='PrimaryButtonToggled' checked={true} icon='Add' text='Primary Button' />
         </div >&nbsp;
 
       <div>
           <DefaultButton
             id='ContextualButton'
-            disabled={ false }
+            disabled={false}
             icon='Add'
             text='New'
-            menuProps={ {
+            menuProps={{
               className: 'ContextualButtonMenu',
               id: 'ContextualButtonMenu',
               items: [
@@ -105,14 +105,13 @@ export default class ButtonVPage extends React.Component<any, any> {
               ]
             }
             }
-          >
-          </DefaultButton>
+          />
           <DefaultButton
             id='ContextualButtonToggled'
-            checked={ true }
+            checked={true}
             icon='Add'
             text='New'
-            menuProps={ {
+            menuProps={{
               className: 'ContextualButtonMenu',
               id: 'ContextualButtonMenu',
               items: [
@@ -129,8 +128,7 @@ export default class ButtonVPage extends React.Component<any, any> {
               ]
             }
             }
-          >
-          </DefaultButton>
+          />
         </div >
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.ContextualMenu.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.ContextualMenu.Example.tsx
index 497a76c02876c..0c1d67f49d371 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.ContextualMenu.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.ContextualMenu.Example.tsx
@@ -29,8 +29,7 @@ export class ButtonContextualMenuExample extends React.Component<IButtonProps, {
               ]
             }
             }
-          >
-          </DefaultButton>
+          />
         </div>
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
index a1d892c89bf46..f499b0c8e2ce6 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
@@ -95,7 +95,7 @@ export class CalendarPage extends React.Component<IComponentDemoPageProps, any>
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -119,8 +119,7 @@ export class CalendarPage extends React.Component<IComponentDemoPageProps, any>
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
index f915f9b9897dc..c1b7e5d5e24d9 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
@@ -119,8 +119,7 @@ export class CalendarButtonExample extends React.Component<ICalendarButtonExampl
               firstDayOfWeek={ DayOfWeek.Sunday }
               strings={ DayPickerStrings }
               isDayPickerVisible={ this.props.isDayPickerVisible }
-            >
-            </Calendar>
+            />
           </Callout>
         )
         }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
index 832aaf747a45c..e750f147d9897 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
@@ -130,8 +130,7 @@ export class CalendarInlineExample extends React.Component<ICalendarInlineExampl
           highlightCurrentMonth={ this.props.highlightCurrentMonth }
           isDayPickerVisible={ this.props.isDayPickerVisible }
           showMonthPickerAsOverlay={ this.props.showMonthPickerAsOverlay }
-        >
-        </Calendar>
+        />
         { this.props.showNavigateButtons &&
           <div>
             <DefaultButton style={ buttonStyle } onClick={ this._goPrevious } text='Previous' />
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
index 1a83bae67125f..f7d3d9b779e2d 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
@@ -64,7 +64,7 @@ export class CalloutPage extends React.Component<IComponentDemoPageProps, any> {
           <a href='https://dev.office.com/fabric-js/Components/Callout/Callout.html'>Fabric JS</a>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -93,8 +93,7 @@ export class CalloutPage extends React.Component<IComponentDemoPageProps, any> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx
index 8474d654a410f..68fca4a8e6ef6 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx
@@ -51,7 +51,7 @@ export class CheckboxPage extends React.Component<IComponentDemoPageProps, any>
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -73,8 +73,7 @@ export class CheckboxPage extends React.Component<IComponentDemoPageProps, any>
           <a href='https://dev.office.com/fabric-js/Components/CheckBox/CheckBox.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx
index a3651b1e0ba11..08701ebd9fd40 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx
@@ -60,7 +60,7 @@ export class ChoiceGroupPage extends React.Component<IComponentDemoPageProps, {}
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -87,8 +87,7 @@ export class ChoiceGroupPage extends React.Component<IComponentDemoPageProps, {}
           <a href='https://dev.office.com/fabric-js/Components/ChoiceFieldGroup/ChoiceFieldGroup.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPickerPage.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPickerPage.tsx
index 081481b70f63a..aebc8ba34169a 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPickerPage.tsx
@@ -34,8 +34,7 @@ export class ColorPickerPage extends React.Component<IComponentDemoPageProps, {}
           <div>ColorPicker is used to allow a user to select a color</div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
index 5d2611c8cb686..6e60cf21b5ed5 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
@@ -42,7 +42,7 @@ export class ComboBoxPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -54,14 +54,13 @@ export class ComboBoxPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         donts={
-          <div></div>
+          <div />
         }
         related={
           <a href='https://dev.office.com/fabric-js/Components/ComboBox/ComboBox.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx
index c2599c6bdd11d..7f27fc79af71a 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx
@@ -57,7 +57,7 @@ export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}>
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -83,8 +83,7 @@ export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}>
           <a href='https://dev.office.com/fabric-js/Components/CommandBar/CommandBar.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
index baa47df069e0a..d44de32fe343a 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
@@ -394,8 +394,7 @@ describe('ContextualMenu', () => {
             }
             menuMounted = true;
           } }
-        >
-        </ContextualMenu>
+        />
       </div>
     );
     expect(menuMounted).to.be.equal(true, 'Menu opened callback was not properly called');
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
index 436dd67fe6a75..88676c60a381c 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
@@ -69,7 +69,7 @@ export class ContextualMenuPage extends React.Component<IComponentDemoPageProps,
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -95,8 +95,7 @@ export class ContextualMenuPage extends React.Component<IComponentDemoPageProps,
           <a href='https://dev.office.com/fabric-js/Components/ContextualMenu/ContextualMenu.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 84aad37f631e1..2a61d49c327d8 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -230,8 +230,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
               firstDayOfWeek={ firstDayOfWeek }
               strings={ strings! }
               ref={ this._resolveRef('_calendar') }
-            >
-            </Calendar>
+            />
           </Callout>
         ) }
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
index 32b828a3c0a3b..7199233a1a936 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
@@ -47,7 +47,7 @@ export class DatePickerPage extends React.Component<IComponentDemoPageProps, {}>
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -74,8 +74,7 @@ export class DatePickerPage extends React.Component<IComponentDemoPageProps, {}>
           <a href='https://dev.office.com/fabric-js/Components/DatePicker/DatePicker.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
index be631a7a21b78..9d8e5a83325f3 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
@@ -97,7 +97,7 @@ export class DetailsListPage extends React.Component<IComponentDemoPageProps, {}
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -119,8 +119,7 @@ export class DetailsListPage extends React.Component<IComponentDemoPageProps, {}
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx
index a4dd435f9c67f..89670988fd681 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx
@@ -53,7 +53,7 @@ export class DialogPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -83,8 +83,7 @@ export class DialogPage extends React.Component<IComponentDemoPageProps, {}> {
           <a href='https://dev.office.com/fabric-js/Components/Dialog/Dialog.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx
index ad21632f15b4e..a032ff065c2ea 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx
@@ -56,7 +56,7 @@ export class DocumentCardPage extends React.Component<IComponentDemoPageProps, {
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -76,8 +76,7 @@ export class DocumentCardPage extends React.Component<IComponentDemoPageProps, {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
index 991e22b0b399d..f9c397e5a70a7 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
@@ -45,7 +45,7 @@ export class DropdownPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -57,14 +57,13 @@ export class DropdownPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         donts={
-          <div></div>
+          <div />
         }
         related={
           <a href='https://dev.office.com/fabric-js/Components/Dropdown/Dropdown.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx b/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx
index b6231f52b017e..b5e634b35ce07 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx
@@ -76,7 +76,7 @@ export class FacepilePage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -100,8 +100,7 @@ export class FacepilePage extends React.Component<IComponentDemoPageProps, {}> {
           <a href='https://dev.office.com/fabric-js/Components/FacePile/FacePile.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZonePage.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZonePage.tsx
index 43f2d7fb10416..b228b1cea1dbc 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZonePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZonePage.tsx
@@ -56,8 +56,7 @@ export class FocusTrapZonePage extends React.Component<IComponentDemoPageProps,
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
index 881de42d6316c..8c11e04e98a2d 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
@@ -600,7 +600,7 @@ describe('FocusZone', () => {
     let buttonB: any;
     const component = ReactTestUtils.renderIntoDocument(
       <div { ...{ onFocusCapture: _onFocus } }>
-        <textarea className='t'></textarea>
+        <textarea className='t' />
         <FocusZone ref={ (focus) => { focusZone = focus; } }>
           <button className='a' ref={ (button) => { buttonA = button; } }>a</button>
           <button className='b' ref={ (button) => { buttonB = button; } }>b</button>
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZonePage.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZonePage.tsx
index 6a1b8b118e5b7..75505c77e9088 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZonePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZonePage.tsx
@@ -47,8 +47,7 @@ export class FocusZonePage extends React.Component<IComponentDemoPageProps, {}>
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListPage.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListPage.tsx
index 135812e02c6fb..bd80b03b02478 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListPage.tsx
@@ -38,8 +38,7 @@ export class GroupedListPage extends React.Component<IComponentDemoPageProps, {}
           <p>Allows you to render a set of items as multiple lists with various grouping properties.</p>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx b/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx
index 271404f12f306..f4dde5d79ed92 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx
@@ -47,7 +47,7 @@ export class IconPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -66,8 +66,7 @@ export class IconPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx b/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx
index ed458286539b7..1880926481601 100644
--- a/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx
@@ -61,8 +61,7 @@ export class ImagePage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx b/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx
index c0191fbe2ea77..7b566e2bc285e 100644
--- a/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx
@@ -35,7 +35,7 @@ export class LabelPage extends React.Component<IComponentDemoPageProps, any> {
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -58,8 +58,7 @@ export class LabelPage extends React.Component<IComponentDemoPageProps, any> {
           <a href='https://dev.office.com/fabric-js/Components/Label/Label.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Layer/LayerPage.tsx b/packages/office-ui-fabric-react/src/components/Layer/LayerPage.tsx
index d8dbc15086b42..a505044001446 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/LayerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/LayerPage.tsx
@@ -49,7 +49,7 @@ export class LayerPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -69,8 +69,7 @@ export class LayerPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx b/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx
index 0429ecc611777..a856149693b35 100644
--- a/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx
@@ -39,7 +39,7 @@ export class LinkPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -64,8 +64,7 @@ export class LinkPage extends React.Component<IComponentDemoPageProps, {}> {
           <a href='https://dev.office.com/fabric-js/Components/Link/Link.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/List/ListPage.tsx b/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
index ca9e6de7103fb..eef31c5171ccf 100644
--- a/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
@@ -65,8 +65,7 @@ export class ListPage extends React.Component<IComponentDemoPageProps, {}> {
           <a href='https://dev.office.com/fabric-js/Components/List/List.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelectionPage.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelectionPage.tsx
index e73ad4eabcd6b..d1e497e7ba5cb 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelectionPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelectionPage.tsx
@@ -39,8 +39,7 @@ export class MarqueeSelectionPage extends React.Component<IComponentDemoPageProp
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBarPage.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBarPage.tsx
index 28259d724db67..3657c164f49fe 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBarPage.tsx
@@ -38,7 +38,7 @@ export class MessageBarPage extends React.Component<IComponentDemoPageProps, {}>
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -63,8 +63,7 @@ export class MessageBarPage extends React.Component<IComponentDemoPageProps, {}>
           <a href='https://dev.office.com/fabric-js/Components/MessageBar/MessageBar.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Modal/ModalPage.tsx b/packages/office-ui-fabric-react/src/components/Modal/ModalPage.tsx
index 967f6d9ba3ee0..5004f48c0bc71 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/ModalPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Modal/ModalPage.tsx
@@ -41,7 +41,7 @@ export class ModalPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -59,8 +59,7 @@ export class ModalPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Nav/NavPage.tsx b/packages/office-ui-fabric-react/src/components/Nav/NavPage.tsx
index cbbf211a466b8..d71e40ad0523b 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/NavPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/NavPage.tsx
@@ -52,7 +52,7 @@ export class NavPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -74,8 +74,7 @@ export class NavPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx b/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx
index 024193ef69397..87d83683343a6 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx
@@ -42,7 +42,7 @@ export class OverlayPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -63,8 +63,7 @@ export class OverlayPage extends React.Component<IComponentDemoPageProps, {}> {
           <a href='https://dev.office.com/fabric-js/Components/Overlay/Overlay.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx b/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
index 68085c2aa5fb0..1c35b49980fd5 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
@@ -98,7 +98,7 @@ export class PanelPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -120,8 +120,7 @@ export class PanelPage extends React.Component<IComponentDemoPageProps, {}> {
           <a href='https://dev.office.com/fabric-js/Components/Panel/Panel.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
index 3a8df5a163354..94ac8fde15e53 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
@@ -52,7 +52,7 @@ export class PersonaPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -75,8 +75,7 @@ export class PersonaPage extends React.Component<IComponentDemoPageProps, {}> {
           <a href='https://dev.office.com/fabric-js/Components/Persona/Persona.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx b/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx
index ef15ef93251f6..1325185073ee1 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx
@@ -94,7 +94,7 @@ export class PivotPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -117,8 +117,7 @@ export class PivotPage extends React.Component<IComponentDemoPageProps, {}> {
           <a href='https://dev.office.com/fabric-js/Components/Pivot/Pivot.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx
index 791c6c867e0b5..2b432fa324896 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx
@@ -45,7 +45,7 @@ export class ProgressIndicator extends BaseComponent<IProgressIndicatorProps, {}
       <div className={ css('ms-ProgressIndicator', styles.root, className) }>
         <div className={ css('ms-ProgressIndicator-itemName', styles.itemName) }>{ label }</div>
         <div className={ css('ms-ProgressIndicator-itemProgress', styles.itemProgress) }>
-          <div className={ css('ms-ProgressIndicator-progressTrack', styles.progressTrack) }></div>
+          <div className={ css('ms-ProgressIndicator-progressTrack', styles.progressTrack) } />
           <div
             className={ css(
               'ms-ProgressIndicator-progressBar',
@@ -58,8 +58,7 @@ export class ProgressIndicator extends BaseComponent<IProgressIndicatorProps, {}
             aria-valuemax='100'
             aria-valuenow={ percentComplete.toFixed().toString() }
             aria-valuetext={ ariaValueText }
-          >
-          </div>
+          />
         </div>
         <div className={ css('ms-ProgressIndicator-itemDescription', styles.itemDescription) }>{ description }</div>
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx
index 26ec9f5bcb80d..cd177bdbac15d 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx
@@ -55,7 +55,7 @@ export class ProgressIndicatorPage extends React.Component<IComponentDemoPagePro
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -81,8 +81,7 @@ export class ProgressIndicatorPage extends React.Component<IComponentDemoPagePro
           <a href='https://dev.office.com/fabric-js/Components/ProgressIndicator/ProgressIndicator.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Rating/RatingPage.tsx b/packages/office-ui-fabric-react/src/components/Rating/RatingPage.tsx
index 6bad227164bc0..5fc563fd7ff58 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/RatingPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/RatingPage.tsx
@@ -35,7 +35,7 @@ export class RatingPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -52,8 +52,7 @@ export class RatingPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
index e1bd9eee8080a..790722a01b892 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
@@ -43,7 +43,7 @@ export class ScrollablePanePage extends React.Component<IComponentDemoPageProps,
           </div>
         }
         bestPractices={
-          <div></div>
+          <div/>
         }
         dos={
           <div>
@@ -62,8 +62,7 @@ export class ScrollablePanePage extends React.Component<IComponentDemoPageProps,
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
index 3b9b112f3be22..c0d402f01eeb1 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
@@ -87,7 +87,7 @@ export class SearchBoxPage extends React.Component<IComponentDemoPageProps, {}>
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -121,8 +121,7 @@ export class SearchBoxPage extends React.Component<IComponentDemoPageProps, {}>
           <a href='https://dev.office.com/fabric-js/Components/SearchBox/SearchBox.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Slider/SliderPage.tsx b/packages/office-ui-fabric-react/src/components/Slider/SliderPage.tsx
index 4fd4bed12631d..d10764a2de9e1 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/SliderPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/SliderPage.tsx
@@ -38,7 +38,7 @@ export class SliderPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -62,8 +62,7 @@ export class SliderPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index 11ace977a02b8..55859b775aaf2 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -153,7 +153,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
     return (
       <div className={ classNames.root }>
         { labelPosition !== Position.bottom && <div className={ classNames.labelWrapper }>
-          { iconProps && <Icon iconName={ iconProps.iconName } className={ classNames.icon } aria-hidden='true'></Icon> }
+          { iconProps && <Icon iconName={ iconProps.iconName } className={ classNames.icon } aria-hidden='true' /> }
           { label &&
             <Label
               id={ this._labelId }
@@ -218,7 +218,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
           </span>
         </div>
         { labelPosition === Position.bottom && <div className={ classNames.labelWrapper }>
-          { iconProps && <Icon iconName={ iconProps.iconName } className={ classNames.icon } aria-hidden='true'></Icon> }
+          { iconProps && <Icon iconName={ iconProps.iconName } className={ classNames.icon } aria-hidden='true' /> }
           { label &&
             <Label
               id={ this._labelId }
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
index 0d8604b439057..83a1f8acde28b 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
@@ -80,7 +80,7 @@ export class SpinButtonPage extends React.Component<IComponentDemoPageProps, {}>
           </div>
         }
         bestPractices={
-          <div></div>
+          <div/>
         }
         dos={
           <div>
@@ -104,8 +104,7 @@ export class SpinButtonPage extends React.Component<IComponentDemoPageProps, {}>
           <a href='https://dev.office.com/fabric-js/Components/SpinButton/SpinButton.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx
index 55419bd0751cb..cbaca34de6459 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx
+++ b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx
@@ -27,8 +27,7 @@ export class Spinner extends BaseComponent<ISpinnerProps, any> {
               ['ms-Spinner--large ' + styles.circleIsTypeLarge]: type === SpinnerType.large // TODO remove deprecated value at >= 2.0.0
             })
           }
-        >
-        </div>
+        />
         {
           label && <div className={ css('ms-Spinner-label', styles.label) }>{ label }</div>
         }
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/SpinnerPage.tsx b/packages/office-ui-fabric-react/src/components/Spinner/SpinnerPage.tsx
index b1f1058bdefd8..92461ca532e1d 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/SpinnerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Spinner/SpinnerPage.tsx
@@ -38,7 +38,7 @@ export class SpinnerPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -63,8 +63,7 @@ export class SpinnerPage extends React.Component<IComponentDemoPageProps, {}> {
           <a href='https://dev.office.com/fabric-js/Components/Spinner/Spinner.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx
index ce73b3a58ec0e..1934695fb57b3 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx
@@ -53,8 +53,7 @@ export class SwatchColorPickerPage extends React.Component<IComponentDemoPagePro
           <a href='https://dev.office.com/fabric-js/Components/SwatchColorPicker/SwatchColorPicker.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
index b97b598e3f901..ae76cc9b7a10e 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
@@ -42,7 +42,7 @@ export class TextFieldPage extends React.Component<IComponentDemoPageProps, {}>
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -77,8 +77,7 @@ export class TextFieldPage extends React.Component<IComponentDemoPageProps, {}>
           <a href='https://dev.office.com/fabric-js/Components/TextField/TextField.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
index 53b20931dd719..53a733bafacae 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
@@ -48,7 +48,7 @@ export class TogglePage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -70,8 +70,7 @@ export class TogglePage extends React.Component<IComponentDemoPageProps, {}> {
           <a href='https://dev.office.com/fabric-js/Components/Toggle/Toggle.html'>Fabric JS</a>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
index 734b921a871ac..d777e23ad5623 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
@@ -77,8 +77,7 @@ export class TooltipHost extends BaseComponent<ITooltipHostProps, ITooltipHostSt
             calloutProps={ assign(calloutProps, { onDismiss: this._onTooltipCallOutDismiss }) }
             { ...getNativeProps(this.props, divProperties) }
             { ...tooltipProps }
-          >
-          </Tooltip>
+          />
         ) }
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerPage.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerPage.tsx
index e7541d08c8954..4822a1afb8edd 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerPage.tsx
@@ -62,8 +62,7 @@ export class PeoplePickerPage extends React.Component<IComponentDemoPageProps, {
             </ul>
           </div>
         }
-      >
-      </ComponentPage>
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PickersPage.tsx b/packages/office-ui-fabric-react/src/components/pickers/PickersPage.tsx
index e50c743812aa7..eb33023b4cc64 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PickersPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PickersPage.tsx
@@ -42,8 +42,7 @@ export class PickersPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionPage.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionPage.tsx
index 5b16aa1bc711c..7eae905e116b1 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionPage.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionPage.tsx
@@ -54,8 +54,7 @@ export class SelectionPage extends React.Component<IComponentDemoPageProps, {}>
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-      >
-      </ComponentPage>
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
index da8b22ea6986d..13315a3b8d7ea 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
@@ -54,7 +54,7 @@ function _initializeSelection(selectionMode = SelectionMode.multiple) {
         <button id='toggle2' data-selection-toggle={ true }>Toggle</button>
       </div>
 
-      <div id='surface3' data-selection-index='3'></div>
+      <div id='surface3' data-selection-index='3' />
 
     </SelectionZone>
   );
diff --git a/packages/office-ui-fabric-react/tslint.json b/packages/office-ui-fabric-react/tslint.json
index adc4238d53cb5..79de33369b414 100644
--- a/packages/office-ui-fabric-react/tslint.json
+++ b/packages/office-ui-fabric-react/tslint.json
@@ -6,7 +6,6 @@
     "jsx-no-string-ref": false,
     "jsx-key": false,
     "jsx-boolean-value": false,
-    "jsx-self-close": false,
     "jsx-no-lambda": false,
     "jsx-ban-props": false,
     "max-line-length": [

From 29b09b69ed37307ba0af92b9fd428f60e20ef363 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 12 Sep 2017 10:41:25 -0700
Subject: [PATCH 0625/1641] Applying package updates.

---
 ...-experiments-exports_2017-09-12-16-36.json | 11 ---------
 .../styling/master_2017-09-12-17-03.json      | 11 ---------
 .../detailList-resize_2017-09-12-16-09.json   | 11 ---------
 .../master_2017-09-12-17-03.json              | 11 ---------
 packages/experiments/CHANGELOG.json           | 22 +++++++++++++++++
 packages/experiments/CHANGELOG.md             |  9 ++++++-
 packages/experiments/package.json             |  6 ++---
 .../office-ui-fabric-react/CHANGELOG.json     | 24 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++++-
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/CHANGELOG.json               | 14 +++++++++++
 packages/styling/CHANGELOG.md                 |  9 ++++++-
 packages/styling/package.json                 |  2 +-
 13 files changed, 91 insertions(+), 53 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/update-experiments-exports_2017-09-12-16-36.json
 delete mode 100644 common/changes/@uifabric/styling/master_2017-09-12-17-03.json
 delete mode 100644 common/changes/office-ui-fabric-react/detailList-resize_2017-09-12-16-09.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2017-09-12-17-03.json

diff --git a/common/changes/@uifabric/experiments/update-experiments-exports_2017-09-12-16-36.json b/common/changes/@uifabric/experiments/update-experiments-exports_2017-09-12-16-36.json
deleted file mode 100644
index 12bf9c619473c..0000000000000
--- a/common/changes/@uifabric/experiments/update-experiments-exports_2017-09-12-16-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Added LayoutGroup, FolderCover, Tile and TilesList to exports",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/master_2017-09-12-17-03.json b/common/changes/@uifabric/styling/master_2017-09-12-17-03.json
deleted file mode 100644
index c9d7629b52db5..0000000000000
--- a/common/changes/@uifabric/styling/master_2017-09-12-17-03.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Fixing circular dependency issue.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "serkani@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/detailList-resize_2017-09-12-16-09.json b/common/changes/office-ui-fabric-react/detailList-resize_2017-09-12-16-09.json
deleted file mode 100644
index 99ab36dda3d0f..0000000000000
--- a/common/changes/office-ui-fabric-react/detailList-resize_2017-09-12-16-09.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: Fixed collapsing logic to look at all items including first 2",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/master_2017-09-12-17-03.json b/common/changes/office-ui-fabric-react/master_2017-09-12-17-03.json
deleted file mode 100644
index 3adfd3f78cc71..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2017-09-12-17-03.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixing circular dependency issue in PrimaryButton.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "serkani@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 5dc3088d30f59..22a376b01cab7 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "0.6.0",
+      "tag": "@uifabric/experiments_v0.6.0",
+      "date": "Tue, 12 Sep 2017 17:41:25 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "9f12afd7ed79b9e63a9bb1d1dcae9e7277489079",
+            "comment": "Added LayoutGroup, FolderCover, Tile and TilesList to exports"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.23.0 <1.0.0` to `>=0.23.1 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.45.0 <5.0.0` to `>=4.45.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.5.1",
       "tag": "@uifabric/experiments_v0.5.1",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 590c9074a00ea..0a4c6ef77ede6 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Fri, 08 Sep 2017 10:16:28 GMT and should not be manually modified.
+This log was last generated on Tue, 12 Sep 2017 17:41:25 GMT and should not be manually modified.
+
+## 0.6.0
+Tue, 12 Sep 2017 17:41:25 GMT
+
+### Minor changes
+
+- Added LayoutGroup, FolderCover, Tile and TilesList to exports
 
 ## 0.5.1
 Fri, 08 Sep 2017 10:16:28 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 29caec30c5d57..56cfe1578c1ee 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "0.5.1",
+  "version": "0.6.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -41,9 +41,9 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/styling": ">=0.23.0 <1.0.0",
+    "@uifabric/styling": ">=0.23.1 <1.0.0",
     "@uifabric/utilities": ">=4.13.0 <5.0.0",
-    "office-ui-fabric-react": ">=4.45.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.45.1 <5.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index ce973705b28dd..7ce67e034169e 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.45.1",
+      "tag": "office-ui-fabric-react_v4.45.1",
+      "date": "Tue, 12 Sep 2017 17:41:25 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "1468fcd5016e6b499b3d462db2de0ef4085e7579",
+            "comment": "DetailsList: Fixed collapsing logic to look at all items including first 2"
+          },
+          {
+            "author": "Serkan Inci <serkan.inci@hotmail.com>",
+            "commit": "d07499a8a812bc8467f152ea1aee325e02e6ab6c",
+            "comment": "Fixing circular dependency issue in PrimaryButton."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.23.0 <1.0.0` to `>=0.23.1 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.45.0",
       "tag": "office-ui-fabric-react_v4.45.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index e088d50205ee7..7bc40702420c9 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 12 Sep 2017 10:10:21 GMT and should not be manually modified.
+This log was last generated on Tue, 12 Sep 2017 17:41:25 GMT and should not be manually modified.
+
+## 4.45.1
+Tue, 12 Sep 2017 17:41:25 GMT
+
+### Patches
+
+- DetailsList: Fixed collapsing logic to look at all items including first 2
+- Fixing circular dependency issue in PrimaryButton.
 
 ## 4.45.0
 Tue, 12 Sep 2017 10:10:21 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index a70699ef88054..7068e92aba05d 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.45.0",
+  "version": "4.45.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/utilities": ">=4.13.0 <5.0.0",
-    "@uifabric/styling": ">=0.23.0 <1.0.0",
+    "@uifabric/styling": ">=0.23.1 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 4211789accc41..bc43899425222 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.23.1",
+      "tag": "@uifabric/styling_v0.23.1",
+      "date": "Tue, 12 Sep 2017 17:41:25 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Serkan Inci <serkan.inci@hotmail.com>",
+            "commit": "d07499a8a812bc8467f152ea1aee325e02e6ab6c",
+            "comment": "Fixing circular dependency issue."
+          }
+        ]
+      }
+    },
     {
       "version": "0.23.0",
       "tag": "@uifabric/styling_v0.23.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 87870af0eb2f8..b8b70b66f481b 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Mon, 11 Sep 2017 10:08:07 GMT and should not be manually modified.
+This log was last generated on Tue, 12 Sep 2017 17:41:25 GMT and should not be manually modified.
+
+## 0.23.1
+Tue, 12 Sep 2017 17:41:25 GMT
+
+### Patches
+
+- Fixing circular dependency issue.
 
 ## 0.23.0
 Mon, 11 Sep 2017 10:08:07 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index e6d6e970987cb..d0a47a807b1c7 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.23.0",
+  "version": "0.23.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From f49723ef1425284a918fc79cf8e6db8f9ed3964e Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Tue, 12 Sep 2017 10:55:38 -0700
Subject: [PATCH 0626/1641] Calendar: Fixing some accessibility issues (#2799)

* no message

* no message

* Adding accessibility updates: screen reader not reading aria-selection state in IE/Edge.  Use hidden strings.

* Updating accessibility

* Updating

* Updating accessibility

* Updates to accessibility

* Change file

* Updates based on PR feedback
---
 ...alendarAccessibility_2017-09-11-16-45.json | 11 ++++
 .../src/components/Calendar/Calendar.Props.ts |  3 +-
 .../src/components/Calendar/Calendar.scss     | 58 ++++++++-----------
 .../src/components/Calendar/CalendarDay.tsx   | 29 +++++-----
 .../src/components/Calendar/CalendarMonth.tsx | 42 ++++++++------
 5 files changed, 78 insertions(+), 65 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-CalendarAccessibility_2017-09-11-16-45.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-CalendarAccessibility_2017-09-11-16-45.json b/common/changes/office-ui-fabric-react/kegorr-CalendarAccessibility_2017-09-11-16-45.json
new file mode 100644
index 0000000000000..ea5aa535d2594
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-CalendarAccessibility_2017-09-11-16-45.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Calendar:  Updating accessibility, fixing headers aria box, fixing selected/unselected state in day and month picker, updating aria-label for next/previous buttons, fixing arial label for months in month picker.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
index 0b6e04bcce533..54bfeea234472 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
@@ -160,6 +160,7 @@ export interface ICalendarStrings {
    * Aria-label for the "next year" button.
    */
   nextYearAriaLabel?: string;
+
 }
 
 export interface ICalendarIconStrings {
@@ -198,4 +199,4 @@ export interface ICalendarFormatDateCallbacks {
   */
   formatYear: (date: Date) => string;
 
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
index b7ec4b36a9036..4ebee1a148afb 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
@@ -63,6 +63,7 @@ $Calendar-dayPicker-margin: 10px;
 
 // The header containing the month and year.
 .header {
+  position: relative;
   display: inline-flex;
   height: $Calendar-day;
   line-height: 44px;
@@ -77,19 +78,15 @@ $Calendar-dayPicker-margin: 10px;
   color: $ms-color-neutralPrimary;
   margin-top: -1px;
   font-weight: $ms-font-weight-semilight;
-
-  &:hover {
-    color: $ms-color-themeDark;
-    cursor: pointer;
-  }
+  padding: 0 5px;
 }
 
 .monthAndYear {
-  @include margin-left(10px);
+  @include margin-left(5px);
 }
 
 .year {
-  @include margin-left(10px);
+  @include margin-left(5px);
 }
 
 
@@ -217,6 +214,10 @@ $Calendar-dayPicker-margin: 10px;
   margin-left: 3px;
 }
 
+.yearComponents{
+  margin-left: 3px;
+}
+
 .prevMonth,
 .nextMonth,
 .prevYear,
@@ -243,27 +244,21 @@ $Calendar-dayPicker-margin: 10px;
 
 // Without modifying the Pickadate JS, this transparent
 // button is necessary to toggle the month view.
-.headerToggleView {
-  height: $Calendar-day;
-  position: absolute;
-  top: 9px;
-  width: 130px;
+.headerToggleView:hover {
+  color: $ms-color-neutralSecondary;
   cursor: pointer;
 }
 
-.wrap div.headerToggleView:focus {
-  position: absolute;
-}
-
 // Text showing the currently-selected year.
 .currentYear,
 .currentDecade {
   display: block;
+  padding: 0 5px;
   @include ms-font-xl;
   color: $ms-color-neutralPrimary;
   height: $Calendar-day;
   line-height: $Calendar-day;
-  @include margin-left(10px);
+  @include margin-left(5px);
   font-weight: $ms-font-weight-semilight;
 }
 
@@ -358,7 +353,7 @@ $Calendar-dayPicker-margin: 10px;
   $Calendar-month: 40px;
 
   .wrap {
-    padding: 4px 7px;
+    padding: 4px 8px;
   }
   // Update the spacing and text for the day and month pickers
 
@@ -403,22 +398,19 @@ $Calendar-dayPicker-margin: 10px;
   .year {
     font-size: 17px;
     color: $ms-color-neutralPrimary;
-
-    &:hover {
-      color: $ms-color-neutralPrimary;
-      cursor: default;
-    }
   }
 
-  // Without modifying the Pickadate JS, this transparent
-  // button is necessary to toggle the month view.
-  .headerToggleView {
-    height: $Calendar-day;
-    @include ms-left(70px);
+  .yearComponents{
+    margin-left: 1px;
   }
 
   // Show month picker, if enabled
   .monthPickerVisible {
+
+    .wrap {
+      padding: 4px 10px;
+    }
+
     // Swap margin for padding so that the border extends the full height.
     .dayPicker {
       margin: -$Calendar-dayPicker-margin 0;
@@ -479,7 +471,7 @@ $Calendar-dayPicker-margin: 10px;
       height: $Calendar-day;
       line-height: $Calendar-day;
       padding: 0 10px;
-      @include ms-right(10px);
+      @include ms-right(8px);
       @include text-align(right);
       top: 199px;
     }
@@ -559,10 +551,6 @@ $Calendar-dayPicker-margin: 10px;
     }
   }
 
-  .headerToggleView{
-    left: 100px;
-  }
-
   // position year components so they do not move when switching between calendars (overlayed calendars)
   .yearComponents {
     margin-top: 2px;
@@ -587,6 +575,10 @@ $Calendar-dayPicker-margin: 10px;
 .nextYear,
 .prevYear {
   display: inline-block;
+
+  &:hover{
+    background-color: $ms-color-neutralTertiaryAlt;
+  }
 }
 
 .nextMonth,
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index 5fca3e35fca59..e5187ca05b6eb 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -111,7 +111,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
               onClick={ this._onSelectPrevMonth }
               onKeyDown={ this._onPrevMonthKeyDown }
               aria-controls={ dayPickerId }
-              aria-label={ strings.prevMonthAriaLabel }
+              aria-label={ strings.prevMonthAriaLabel ? strings.prevMonthAriaLabel + ' ' + strings.months[addMonths(navigatedDate, -1).getMonth()] : undefined }
               role='button'
               tabIndex={ 0 }
             >
@@ -122,7 +122,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
               onClick={ this._onSelectNextMonth }
               onKeyDown={ this._onNextMonthKeyDown }
               aria-controls={ dayPickerId }
-              aria-label={ strings.nextMonthAriaLabel }
+              aria-label={ strings.nextMonthAriaLabel ? strings.nextMonthAriaLabel + ' ' + strings.months[addMonths(navigatedDate, 1).getMonth()] : undefined }
               role='button'
               tabIndex={ 0 }
             >
@@ -132,21 +132,23 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
         </div >
         <div className={ css('ms-DatePicker-header', styles.header) } >
           <div aria-live='polite' aria-relevant='text' aria-atomic='true' id={ monthAndYearId }>
-            <div className={ css('ms-DatePicker-monthAndYear', styles.monthAndYear) }>{ dateTimeFormatter.formatMonthYear(navigatedDate, strings) }</div>
-          </div>
-          {
-            this.props.onHeaderSelect ?
+            { this.props.onHeaderSelect ?
               <div
-                className={ css('ms-DatePicker-headerToggleView js-showMonthPicker', styles.headerToggleView) }
+                className={ css('ms-DatePicker-monthAndYear js-showMonthPicker', styles.monthAndYear, styles.headerToggleView) }
                 onClick={ this._onHeaderSelect }
                 onKeyDown={ this._onHeaderKeyDown }
                 aria-label={ dateTimeFormatter.formatMonthYear(navigatedDate, strings) }
                 role='button'
                 tabIndex={ 0 }
-              />
+              >
+                { dateTimeFormatter.formatMonthYear(navigatedDate, strings) }
+              </div>
               :
-              null
-          }
+              <div className={ css('ms-DatePicker-monthAndYear', styles.monthAndYear) }>
+                { dateTimeFormatter.formatMonthYear(navigatedDate, strings) }
+              </div>
+            }
+          </div>
         </div>
         <FocusZone>
           <table
@@ -161,6 +163,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
                 { strings.shortDays.map((val, index) =>
                   <th
                     className={ css('ms-DatePicker-weekday', styles.weekday) }
+                    role='grid'
                     scope='col'
                     key={ index }
                     title={ strings.days[(index + firstDayOfWeek) % DAYS_IN_WEEK] }
@@ -172,7 +175,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
             </thead>
             <tbody>
               { weeks!.map((week, weekIndex) =>
-                <tr key={ weekIndex } >
+                <tr key={ weekIndex } role='row'>
                   { week.map((day, dayIndex) =>
                     <td
                       key={ day.key }
@@ -193,13 +196,13 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
                             ['ms-DatePicker-day--today ' + styles.dayIsToday]: day.isToday,
                             ['ms-DatePicker-day--highlighted ' + styles.dayIsHighlighted]: day.isSelected && dateRangeType === DateRangeType.Day
                           }) }
-                        role='button'
+                        role='gridcell'
                         onClick={ day.onSelected }
                         onKeyDown={ (ev: React.KeyboardEvent<HTMLElement>) =>
                           this._navigateMonthEdge(ev, day.originalDate, weekIndex, dayIndex) }
-                        aria-selected={ day.isSelected }
                         aria-label={ dateTimeFormatter.formatMonthDayYear(day.originalDate, strings) }
                         id={ compareDates(navigatedDate, day.originalDate) ? activeDescendantId : undefined }
+                        aria-selected={ day.isSelected }
                         data-is-focusable={ true }
                         ref={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : undefined }
                         key={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : undefined }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
index a53ad931652cd..d1da67a448ce5 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
@@ -61,7 +61,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
               className={ css('ms-DatePicker-prevYear js-prevYear', styles.prevYear) }
               onClick={ this._onSelectPrevYear }
               onKeyDown={ this._onSelectPrevYearKeyDown }
-              aria-label={ strings.prevYearAriaLabel }
+              aria-label={ strings.prevYearAriaLabel ? strings.prevYearAriaLabel + ' ' + dateTimeFormatter.formatYear(addYears(navigatedDate, -1)) : undefined }
               role='button'
               tabIndex={ 0 }
             >
@@ -71,7 +71,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
               className={ css('ms-DatePicker-nextYear js-nextYear', styles.nextYear) }
               onClick={ this._onSelectNextYear }
               onKeyDown={ this._onSelectNextYearKeyDown }
-              aria-label={ strings.nextYearAriaLabel }
+              aria-label={ strings.nextYearAriaLabel ? strings.nextYearAriaLabel + ' ' + dateTimeFormatter.formatYear(addYears(navigatedDate, 1)) : undefined }
               role='button'
               tabIndex={ 0 }
             >
@@ -80,26 +80,31 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
           </div>
         </div>
         <div className={ css('ms-DatePicker-header', styles.header) }>
-          <div className={ css('ms-DatePicker-currentYear js-showYearPicker', styles.currentYear) }>{ dateTimeFormatter.formatYear(navigatedDate) }</div>
-          {
-            this.props.onHeaderSelect ?
-              <div
-                className={ css('ms-DatePicker-headerToggleView js-showYearPicker', styles.headerToggleView) }
-                onClick={ this._onHeaderSelect }
-                onKeyDown={ this._onHeaderKeyDown }
-                aria-label={ dateTimeFormatter.formatYear(navigatedDate) }
-                role='button'
-                tabIndex={ 0 }
-              />
-              :
-              null
+          { this.props.onHeaderSelect ?
+            <div
+              className={ css('ms-DatePicker-currentYear js-showYearPicker', styles.currentYear, styles.headerToggleView) }
+              onClick={ this._onHeaderSelect }
+              onKeyDown={ this._onHeaderKeyDown }
+              aria-label={ dateTimeFormatter.formatYear(navigatedDate) }
+              role='button'
+              tabIndex={ 0 }
+            >
+              { dateTimeFormatter.formatYear(navigatedDate) }
+            </div>
+            :
+            <div className={ css('ms-DatePicker-currentYear js-showYearPicker', styles.currentYear) }>
+              { dateTimeFormatter.formatYear(navigatedDate) }
+            </div>
           }
         </div>
         <FocusZone>
-          <div className={ css('ms-DatePicker-optionGrid', styles.optionGrid) }>
+          <div
+            className={ css('ms-DatePicker-optionGrid', styles.optionGrid) }
+            role='grid'
+          >
             { strings.shortMonths.map((month, index) =>
               <span
-                role='button'
+                role='gridcell'
                 className={
                   css('ms-DatePicker-monthOption',
                     styles.monthOption,
@@ -110,7 +115,8 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
                 }
                 key={ index }
                 onClick={ this._selectMonthCallbacks[index] }
-                aria-label={ dateTimeFormatter.formatMonthYear(navigatedDate, strings) }
+                aria-label={ dateTimeFormatter.formatMonthYear(setMonth(navigatedDate, index), strings) }
+                aria-selected={ this._isCurrentMonth(index, navigatedDate.getFullYear(), today!) || (navigatedDate.getMonth() === index) }
                 data-is-focusable={ true }
                 ref={ navigatedDate.getMonth() === index ? 'navigatedMonth' : undefined }
               >

From 8a8343d979e0ff55ce24a1e1e649793ce9020f08 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Tue, 12 Sep 2017 15:06:32 -0700
Subject: [PATCH 0627/1641] Add signal support to FolderCover [experiments]
 (#2793)

* Add signal prop to FolderCover

* Add support for folder cover signals

* Update change output
---
 .../folder-signal_2017-09-09-00-12.json       | 11 +++++
 .../FolderCover/FolderCover.Props.ts          |  7 ++++
 .../components/FolderCover/FolderCover.scss   | 40 ++++++++++++++++---
 .../components/FolderCover/FolderCover.tsx    | 12 ++++++
 .../examples/FolderCover.Basic.Example.tsx    | 18 ++++++++-
 5 files changed, 82 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/folder-signal_2017-09-09-00-12.json

diff --git a/common/changes/@uifabric/experiments/folder-signal_2017-09-09-00-12.json b/common/changes/@uifabric/experiments/folder-signal_2017-09-09-00-12.json
new file mode 100644
index 0000000000000..3bd214e8af25a
--- /dev/null
+++ b/common/changes/@uifabric/experiments/folder-signal_2017-09-09-00-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Add support for folder cover signals",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.Props.ts b/packages/experiments/src/components/FolderCover/FolderCover.Props.ts
index f4729ea86777e..788aa68937193 100644
--- a/packages/experiments/src/components/FolderCover/FolderCover.Props.ts
+++ b/packages/experiments/src/components/FolderCover/FolderCover.Props.ts
@@ -34,6 +34,13 @@ export interface IFolderCoverProps extends IBaseProps, React.HTMLAttributes<Fold
    * @memberof IFolderCoverProps
    */
   hideContent?: boolean;
+  /**
+   * A signal to display on the folder cover.
+   *
+   * @type {(React.ReactNode[] | React.ReactNode)}
+   * @memberof IFolderCoverProps
+   */
+  signal?: React.ReactNode[] | React.ReactNode;
   /**
    * A metadata value to display on the folder cover.
    *
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.scss b/packages/experiments/src/components/FolderCover/FolderCover.scss
index 2be7b89021561..e63124837348b 100644
--- a/packages/experiments/src/components/FolderCover/FolderCover.scss
+++ b/packages/experiments/src/components/FolderCover/FolderCover.scss
@@ -5,6 +5,8 @@
   display: inline-flex;
   position: relative;
   vertical-align: bottom;
+  flex-direction: row;
+  align-items: flex-end;
 
   &,
   &.isSmall {
@@ -63,15 +65,16 @@
 }
 
 .metadata {
-  position: absolute;
   display: block;
-  right: 8px;
-  left: 8px;
+  @include margin-right(8px);
+  flex: 1 1;
   @include text-align(right);
   white-space: nowrap;
   text-overflow: ellipsis;
+  overflow: hidden;
   font-weight: $ms-font-weight-regular;
   color: $ms-color-white;
+  position: relative;
 
   &,
   &.isSmall {
@@ -84,10 +87,37 @@
 
   &,
   &.isDefault {
-    bottom: 8px;
+    margin-bottom: 8px;
+  }
+
+  .isMedia & {
+    margin-bottom: 4px;
+  }
+}
+
+.signal {
+  display: block;
+  position: relative;
+  margin-bottom: 8px;
+  @include margin-left(8px);
+  @include margin-right(4px);
+
+  &,
+  &.isSmall {
+    font-size: $ms-font-size-l;
+  }
+
+  .isLarge & {
+    font-size: $ms-font-size-xl;
+  }
+
+
+  &,
+  &.isDefault {
+    margin-bottom: 8px;
   }
 
   .isMedia & {
-    bottom: 4px;
+    margin-bottom: 4px;
   }
 }
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.tsx b/packages/experiments/src/components/FolderCover/FolderCover.tsx
index e8cea4626f585..bf455709830e9 100644
--- a/packages/experiments/src/components/FolderCover/FolderCover.tsx
+++ b/packages/experiments/src/components/FolderCover/FolderCover.tsx
@@ -4,9 +4,12 @@ import { IFolderCoverProps, FolderCoverSize, FolderCoverType } from './FolderCov
 import { css } from 'office-ui-fabric-react/lib/Utilities';
 import { ISize } from '@uifabric/utilities';
 import * as FolderCoverStylesModule from './FolderCover.scss';
+import * as SignalStylesModule from '../signals/Signals.scss';
 
 // tslint:disable-next-line:no-any
 const FolderCoverStyles = FolderCoverStylesModule as any;
+// tslint:disable-next-line:no-any
+const SignalStyles = SignalStylesModule as any;
 
 export interface IFolderCoverState {
   // TODO Add animation support for drag/drop events.
@@ -100,6 +103,15 @@ export class FolderCover extends React.Component<IFolderCoverProps, IFolderCover
           className={ css('ms-FolderCover-front', FolderCoverStyles.front) }
           src={ assets.front }
         />
+        {
+          this.props.signal ?
+            (
+              <span className={ css('ms-FolderCover-signal', FolderCoverStyles.signal, SignalStyles.dark) }>
+                { this.props.signal }
+              </span>
+            ) :
+            null
+        }
         {
           this.props.metadata ?
             (
diff --git a/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx b/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx
index c1f4e895386ec..9f4a3db05d3f7 100644
--- a/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx
+++ b/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx
@@ -3,6 +3,8 @@ import * as React from 'react';
 import { FolderCover, getFolderCoverLayout, renderFolderCoverWithLayout } from '../FolderCover';
 import { IFolderCoverProps } from '../FolderCover.Props';
 import { ISize, fitContentToBounds } from '@uifabric/utilities';
+import { SharedSignal } from '../../signals/Signals';
+import { lorem } from '@uifabric/example-app-base';
 
 interface IFolderCoverWithImageProps extends IFolderCoverProps {
   originalImageSize: ISize;
@@ -51,6 +53,7 @@ export class FolderCoverBasicExample extends React.Component<{}, {}> {
           }
           folderCoverSize='large'
           metadata={ 20 }
+          signal={ <SharedSignal /> }
         />
         <h3>Small Default Cover</h3>
         <FolderCoverWithImage
@@ -73,7 +76,7 @@ export class FolderCoverBasicExample extends React.Component<{}, {}> {
           }
           folderCoverSize='large'
           folderCoverType='media'
-          metadata={ 20 }
+          metadata={ lorem(5) }
         />
         <h3>Small Media Cover</h3>
         <FolderCoverWithImage
@@ -87,6 +90,19 @@ export class FolderCoverBasicExample extends React.Component<{}, {}> {
           folderCoverType='media'
           metadata={ 15 }
         />
+        <h3>Shared Cover</h3>
+        <FolderCoverWithImage
+          originalImageSize={
+            {
+              width: 200,
+              height: 150
+            }
+          }
+          folderCoverSize='small'
+          folderCoverType='media'
+          metadata={ 15 }
+          signal={ <SharedSignal /> }
+        />
       </div>
     );
   }

From c5904b5a36fd58694f4d59d634610068b98a87b9 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Tue, 12 Sep 2017 15:51:55 -0700
Subject: [PATCH 0628/1641] SwatchColorPicker fix uncaught exception if
 colorCells array is empty (#2815) (#2821)

* Initial checkin for fixing the uncaught exception in the SwatchColorPicker if an empty colorCells array is sent in

* remove the warning

* rush change
---
 ...rPickerEmptyArrayFix_--2815-_2017-09-12-22-02.json | 11 +++++++++++
 .../SwatchColorPicker/SwatchColorPicker.tsx           |  8 ++++++--
 2 files changed, 17 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerEmptyArrayFix_--2815-_2017-09-12-22-02.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerEmptyArrayFix_--2815-_2017-09-12-22-02.json b/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerEmptyArrayFix_--2815-_2017-09-12-22-02.json
new file mode 100644
index 0000000000000..a411655429483
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerEmptyArrayFix_--2815-_2017-09-12-22-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "[SwatchColorPicker] Fix uncaught exception when colorCells is empty",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
index c5075ae685cd2..3718284a76637 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
@@ -67,17 +67,21 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
   public render() {
     let {
       colorCells,
+      columnCount,
       positionInSet,
       setSize,
       shouldFocusCircularNavigate,
       className
     } = this.props;
 
+    if (colorCells.length < 1 || columnCount < 1) {
+      return null;
+    }
+
     return (
       <Grid
-        key={ this._id + colorCells[0].id + '-grid' }
         items={ colorCells.map((item, index) => { return { ...item, index }; }) }
-        columnCount={ this.props.columnCount }
+        columnCount={ columnCount }
         onRenderItem={ this._renderOption }
         positionInSet={ positionInSet && positionInSet }
         setSize={ setSize && setSize }

From 561e832554ebdbbfc44e219370b56f019571bf38 Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Tue, 12 Sep 2017 17:05:26 -0700
Subject: [PATCH 0629/1641] Calendar: Month-picker-only selection bug fixed
 (#2822)

* no message

* no message

* updating calendar's month-picke-only functionality

* Updating positions to match current styles

* fixed bug
month-picker-only months not closing popup when selected

* Change file

* Updating order

* Fixing missing items from merge conflict

* Adding missing parenthesis

* Fixing double line space error
---
 ...r-MiniMonthOnlyDateSelection_2017-09-12-22-41.json | 11 +++++++++++
 .../src/components/Calendar/Calendar.scss             |  2 +-
 .../src/components/Calendar/Calendar.tsx              | 10 ++++++++--
 .../src/components/Calendar/CalendarPage.tsx          |  1 +
 .../Calendar/examples/Calendar.Button.Example.tsx     |  2 ++
 5 files changed, 23 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-Calendar-MiniMonthOnlyDateSelection_2017-09-12-22-41.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-Calendar-MiniMonthOnlyDateSelection_2017-09-12-22-41.json b/common/changes/office-ui-fabric-react/kegorr-Calendar-MiniMonthOnlyDateSelection_2017-09-12-22-41.json
new file mode 100644
index 0000000000000..6b84fd4c66cc9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-Calendar-MiniMonthOnlyDateSelection_2017-09-12-22-41.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Calendar: Month-picker-only selection bug fixed",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
index 4ebee1a148afb..d4d44de4e6e0a 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
@@ -530,7 +530,7 @@ $Calendar-dayPicker-margin: 10px;
   //when month picker is only visible
   .monthPickerOnly{
     .wrap{
-      padding: 10px 7px;
+      padding: 10px;
     }
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index d7c967799ef94..c8047ef1121e3 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -201,8 +201,14 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
 
   @autobind
   private _onNavigateDate(date: Date, focusOnNavigatedDay: boolean) {
-    this._navigateDay(date);
-    this._focusOnUpdate = focusOnNavigatedDay;
+
+    if (this.props.isDayPickerVisible || (!this.props.isDayPickerVisible && !focusOnNavigatedDay)) {
+      this._navigateDay(date);
+      this._focusOnUpdate = focusOnNavigatedDay;
+    } else {
+      // if only the month picker is shown, select the chosen month
+      this._onSelectDate(date);
+    }
   }
 
   @autobind
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
index f499b0c8e2ce6..2bece6d1c3257 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
@@ -75,6 +75,7 @@ export class CalendarPage extends React.Component<IComponentDemoPageProps, any>
             <ExampleCard title='Month picker launched from a button' code={ CalendarButtonExampleCode }>
               <CalendarButtonExample
                 isDayPickerVisible={ false }
+                highlightCurrentMonth={ true }
                 buttonString={ 'Click for Month Picker' }
               />
             </ExampleCard>
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
index c1b7e5d5e24d9..63c5128cc0c14 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
@@ -67,6 +67,7 @@ export interface ICalendarButtonExampleState {
 
 export interface ICalendarButtonExampleProps {
   isDayPickerVisible?: boolean;
+  highlightCurrentMonth?: boolean;
   buttonString?: string;
 }
 
@@ -119,6 +120,7 @@ export class CalendarButtonExample extends React.Component<ICalendarButtonExampl
               firstDayOfWeek={ DayOfWeek.Sunday }
               strings={ DayPickerStrings }
               isDayPickerVisible={ this.props.isDayPickerVisible }
+              highlightCurrentMonth={ this.props.highlightCurrentMonth }
             />
           </Callout>
         )

From b691aa97525304884029629d2f40f14dc663f0bb Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 12 Sep 2017 17:54:49 -0700
Subject: [PATCH 0630/1641] Adding MoreVertical icon. (#2826)

* Adding 'MoreVertical' icon.

* Adding change files.
---
 .../styling/more-vertical_2017-09-13-00-53.json       | 11 +++++++++++
 .../more-vertical_2017-09-13-00-53.json               | 11 +++++++++++
 .../src/components/Icon/IconName.ts                   |  1 +
 packages/styling/src/styles/IconCodes.ts              |  4 ++++
 4 files changed, 27 insertions(+)
 create mode 100644 common/changes/@uifabric/styling/more-vertical_2017-09-13-00-53.json
 create mode 100644 common/changes/office-ui-fabric-react/more-vertical_2017-09-13-00-53.json

diff --git a/common/changes/@uifabric/styling/more-vertical_2017-09-13-00-53.json b/common/changes/@uifabric/styling/more-vertical_2017-09-13-00-53.json
new file mode 100644
index 0000000000000..7c430b4d9274b
--- /dev/null
+++ b/common/changes/@uifabric/styling/more-vertical_2017-09-13-00-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Adding `MoreVertical` icon.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/more-vertical_2017-09-13-00-53.json b/common/changes/office-ui-fabric-react/more-vertical_2017-09-13-00-53.json
new file mode 100644
index 0000000000000..6434352cc992c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/more-vertical_2017-09-13-00-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Adding `MoreVertical` icon.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Icon/IconName.ts b/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
index ed15b4021bad7..868afe472af26 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
@@ -512,6 +512,7 @@ export type IconName =
   'Money' |
   'More' |
   'MoreSports' |
+  'MoreVertical' |
   'Move' |
   'MoveToFolder' |
   'MSNLogo' |
diff --git a/packages/styling/src/styles/IconCodes.ts b/packages/styling/src/styles/IconCodes.ts
index ab5efd03748f6..27ad3cbb015a5 100644
--- a/packages/styling/src/styles/IconCodes.ts
+++ b/packages/styling/src/styles/IconCodes.ts
@@ -1689,6 +1689,10 @@ export const IconCodes = {
    * Icon code with the value '\uEB22'.
    */
   moreSports: '\uEB22',
+  /**
+   * Icon code with the value '\uF2BC'.
+   */
+  moreVertical: '\uF2BC',
   /**
    * Icon code with the value '\uE7C2'.
    */

From 8bdeecd13d844686832aa9b57f05f2a287347ce7 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Tue, 12 Sep 2017 17:55:53 -0700
Subject: [PATCH 0631/1641] Third pass removing lambda expressions from jsx
 (#2824)

---
 .../examples/DetailsList.Advanced.Example.tsx | 11 ++--
 .../examples/DetailsList.Basic.Example.tsx    | 15 ++++-
 .../examples/DetailsList.Compact.Example.tsx  | 14 ++++-
 .../DetailsList.CustomColumns.Example.tsx     | 12 +++-
 ...DetailsList.CustomGroupHeaders.Example.tsx | 12 +++-
 .../DetailsList.Documents.Example.tsx         | 20 ++++++-
 .../examples/DetailsList.DragDrop.Example.tsx |  6 +-
 .../examples/DetailsList.Grouped.Example.tsx  |  5 +-
 .../DetailsList.NavigatingFocus.Example.tsx   | 16 ++++--
 .../DocumentCard.Complete.Example.tsx         |  6 +-
 .../examples/Dropdown.Basic.Example.tsx       | 36 +++++++-----
 .../examples/Facepile.Basic.Example.tsx       | 56 +++++++++++++------
 .../examples/Facepile.Overflow.Example.tsx    | 30 +++++++---
 .../FocusTrapZone.Box.Click.Example.tsx       |  7 ++-
 .../examples/FocusTrapZone.Box.Example.tsx    |  7 ++-
 ...pZone.Box.FocusOnCustomElement.Example.tsx |  7 ++-
 16 files changed, 190 insertions(+), 70 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
index 0c3a00cd2ed0e..f29cc2307b8ef 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
@@ -140,10 +140,7 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
           ariaLabelForListHeader='Column headers. Use menus to perform column operations like sort and filter'
           ariaLabelForSelectAllCheckbox='Toggle selection for all items'
           ariaLabelForSelectionColumn='Toggle selection'
-          onRenderMissingItem={ (index) => {
-            this._onDataMiss(index as number);
-            return null;
-          } }
+          onRenderMissingItem={ this._onRenderMissingItem }
         />
 
         { contextualMenuProps && (
@@ -173,6 +170,12 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
     }
   }
 
+  @autobind
+  private _onRenderMissingItem(index: number): null {
+    this._onDataMiss(index as number);
+    return null;
+  }
+
   @autobind
   private _onToggleLazyLoad() {
     let { isLazyLoaded } = this.state;
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
index cc8c1d5f09d03..4e8cce004deac 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
@@ -9,6 +9,7 @@ import {
   IColumn
 } from 'office-ui-fabric-react/lib/DetailsList';
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 
 let _items: any[] = [];
 
@@ -68,7 +69,7 @@ export class DetailsListBasicExample extends React.Component<any, any> {
         <div>{ selectionDetails }</div>
         <TextField
           label='Filter by name:'
-          onChanged={ text => this.setState({ items: text ? _items.filter(i => i.name.toLowerCase().indexOf(text) > -1) : _items }) }
+          onChanged={ this._onChanged }
         />
         <MarqueeSelection selection={ this._selection }>
           <DetailsList
@@ -80,7 +81,7 @@ export class DetailsListBasicExample extends React.Component<any, any> {
             selectionPreservedOnEmptyClick={ true }
             ariaLabelForSelectionColumn='Toggle selection'
             ariaLabelForSelectAllCheckbox='Toggle selection for all items'
-            onItemInvoked={ (item) => alert(`Item invoked: ${item.name}`) }
+            onItemInvoked={ this._onItemInvoked }
           />
         </MarqueeSelection>
       </div>
@@ -99,4 +100,14 @@ export class DetailsListBasicExample extends React.Component<any, any> {
         return `${selectionCount} items selected`;
     }
   }
+
+  @autobind
+  private _onChanged(text: any): void {
+    this.setState({ items: text ? _items.filter(i => i.name.toLowerCase().indexOf(text) > -1) : _items });
+  }
+
+  private _onItemInvoked(item: any): void {
+    alert(`Item invoked: ${item.name}`);
+  }
+
 }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Compact.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Compact.Example.tsx
index 3daf6e2e9c595..321ac9d4fc1ee 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Compact.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Compact.Example.tsx
@@ -8,6 +8,7 @@ import {
   Selection
 } from 'office-ui-fabric-react/lib/DetailsList';
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 
 let _items: {
   key: number,
@@ -69,7 +70,7 @@ export class DetailsListCompactExample extends React.Component<any, any> {
         <div>{ selectionDetails }</div>
         <TextField
           label='Filter by name:'
-          onChanged={ text => this.setState({ items: text ? _items.filter(i => i.name.toLowerCase().indexOf(text) > -1) : _items }) }
+          onChanged={ this._onChanged }
         />
         <MarqueeSelection selection={ this._selection }>
           <DetailsList
@@ -79,7 +80,7 @@ export class DetailsListCompactExample extends React.Component<any, any> {
             layoutMode={ DetailsListLayoutMode.fixedColumns }
             selection={ this._selection }
             selectionPreservedOnEmptyClick={ true }
-            onItemInvoked={ (item) => alert(`Item invoked: ${item.name}`) }
+            onItemInvoked={ this._onItemInvoked }
             compact={ true }
           />
         </MarqueeSelection>
@@ -99,4 +100,13 @@ export class DetailsListCompactExample extends React.Component<any, any> {
         return `${selectionCount} items selected`;
     }
   }
+
+  @autobind
+  private _onChanged(text: any): void {
+    this.setState({ items: text ? _items.filter(i => i.name.toLowerCase().indexOf(text) > -1) : _items });
+  }
+
+  private _onItemInvoked(item: any): void {
+    alert(`Item invoked: ${item.name}`);
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
index 1fafb4bf1fb25..a798064e9bdc6 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
@@ -41,8 +41,8 @@ export class DetailsListCustomColumnsExample extends React.Component<{}, IDetail
         columns={ columns }
         onRenderItemColumn={ _renderItemColumn }
         onColumnHeaderClick={ this._onColumnClick }
-        onItemInvoked={ (item, index) => alert(`Item ${item.name} at index ${index} has been invoked.`) }
-        onColumnHeaderContextMenu={ (column, ev) => console.log(`column ${column!.key} contextmenu opened.`) }
+        onItemInvoked={ this._onItemInvoked }
+        onColumnHeaderContextMenu={ this._onColumnHeaderContextMenu }
       />
     );
   }
@@ -83,6 +83,14 @@ export class DetailsListCustomColumnsExample extends React.Component<{}, IDetail
       })
     });
   }
+
+  private _onColumnHeaderContextMenu(column: IColumn | undefined, ev: React.MouseEvent<HTMLElement> | undefined): void {
+    console.log(`column ${column!.key} contextmenu opened.`);
+  }
+
+  private _onItemInvoked(item: any, index: number | undefined): void {
+    alert(`Item ${item.name} at index ${index} has been invoked.`);
+  }
 }
 
 function _buildColumns() {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomGroupHeaders.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomGroupHeaders.Example.tsx
index b85af609917ea..e748cf51e859f 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomGroupHeaders.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomGroupHeaders.Example.tsx
@@ -2,7 +2,7 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import { Link } from 'office-ui-fabric-react/lib/Link';
-import { DetailsList, IGroup } from 'office-ui-fabric-react/lib/DetailsList';
+import { DetailsList, IGroup, IGroupDividerProps } from 'office-ui-fabric-react/lib/DetailsList';
 import { createListItems, createGroups } from '@uifabric/example-app-base';
 import './DetailsListExample.scss';
 
@@ -33,13 +33,13 @@ export class DetailsListCustomGroupHeadersExample extends React.Component<any, a
                 <div className='DetailsListExample-customHeaderLinkSet'>
                   <Link
                     className='DetailsListExample-customHeaderLink'
-                    onClick={ () => props!.onToggleSelectGroup!(props!.group!) }
+                    onClick={ this._onClick(props!) }
                   >
                     { props!.isSelected ? 'Remove selection' : 'Select group' }
                   </Link>
                   <Link
                     className='DetailsListExample-customHeaderLink'
-                    onClick={ () => props!.onToggleCollapse!(props!.group!) }
+                    onClick={ this._onClick(props!) }
                   >
                     { props!.group!.isCollapsed ? 'Expand group' : 'Collapse group' }
                   </Link>
@@ -57,4 +57,10 @@ export class DetailsListCustomGroupHeadersExample extends React.Component<any, a
     );
   }
 
+  private _onClick(props: IGroupDividerProps) {
+    return () => {
+      props.onToggleSelectGroup!(props.group!);
+    };
+  }
+
 }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
index 7bd412efb52ac..ca69ad4f51b78 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
@@ -207,14 +207,14 @@ export class DetailsListDocumentsExample extends React.Component<any, IDetailsLi
         <Toggle
           label='Enable Compact Mode'
           checked={ isCompactMode }
-          onChanged={ checked => this.setState({ isCompactMode: checked }) }
+          onChanged={ this._onChangeToggle }
           onText='Compact'
           offText='Normal'
         />
         <div>{ selectionDetails }</div>
         <TextField
           label='Filter by name:'
-          onChanged={ text => this.setState({ items: text ? _items.filter(i => i.name.toLowerCase().indexOf(text) > -1) : _items }) }
+          onChanged={ this._onChangeText }
         />
         <MarqueeSelection selection={ this._selection }>
           <DetailsList
@@ -226,13 +226,27 @@ export class DetailsListDocumentsExample extends React.Component<any, IDetailsLi
             isHeaderVisible={ true }
             selection={ this._selection }
             selectionPreservedOnEmptyClick={ true }
-            onItemInvoked={ (item) => alert(`Item invoked: ${item.name}`) }
+            onItemInvoked={ this._onItemInvoked }
           />
         </MarqueeSelection>
       </div>
     );
   }
 
+  @autobind
+  private _onChangeToggle(checked: boolean): void {
+    this.setState({ isCompactMode: checked });
+  }
+
+  @autobind
+  private _onChangeText(text: any): void {
+    this.setState({ items: text ? _items.filter(i => i.name.toLowerCase().indexOf(text) > -1) : _items });
+  }
+
+  private _onItemInvoked(item: any): void {
+    alert(`Item invoked: ${item.name}`);
+  }
+
   private _randomDate(start: Date, end: Date): { value: number; dateFormatted: string; } {
     const date: Date = new Date(start.getTime() + Math.random() * (end.getTime() - start.getTime()));
     const dateData = {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx
index a86e2b6fa6caf..631a52536ca56 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx
@@ -42,7 +42,7 @@ export class DetailsListDragDropExample extends React.Component<any, any> {
             items={ items }
             selection={ this._selection }
             selectionPreservedOnEmptyClick={ true }
-            onItemInvoked={ (item) => { alert(`Item invoked: ${item.name}`); } }
+            onItemInvoked={ this._onItemInvoked }
             onRenderItemColumn={ this._onRenderItemColumn }
             dragDropEvents={ this._getDragDropEvents() }
           />
@@ -73,6 +73,10 @@ export class DetailsListDragDropExample extends React.Component<any, any> {
     };
   }
 
+  private _onItemInvoked(item: any): void {
+    alert(`Item invoked: ${item.name}`);
+  }
+
   private _onRenderItemColumn(item: any, index: number, column: IColumn) {
     if (column.key === 'name') {
       return <Link data-selection-invoke={ true }>{ item[column.key] }</Link>;
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
index fc2c0322d6215..6fd1aae1a41b7 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
@@ -64,7 +64,10 @@ export class DetailsListGroupedExample extends React.Component<any, any> {
 
     return (
       <Fabric className='foo'>
-        <DefaultButton onClick={ () => this._addItem() } text='Add an item' />
+        <DefaultButton
+          onClick={ this._addItem }
+          text='Add an item'
+        />
         <DetailsList
           items={ items }
           groups={ [
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
index 47dca720f430f..2791fa3b30cb0 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { DetailsList, IColumn } from 'office-ui-fabric-react/lib/DetailsList';
 import { Link } from 'office-ui-fabric-react/lib/Link';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import './DetailsListExample.scss';
 
 export interface IDetailsListNavigatingFocusExampleState {
@@ -21,7 +22,7 @@ export class DetailsListNavigatingFocusExample extends React.Component<{}, IDeta
         (
           <Link
             key={ item }
-            onClick={ () => this._navigate(item) }
+            onClick={ this._navigate(item) }
           >
             { item }
           </Link>
@@ -43,11 +44,14 @@ export class DetailsListNavigatingFocusExample extends React.Component<{}, IDeta
     );
   }
 
-  private _navigate(name: string) {
-    this.setState({
-      items: generateItems(name + '/'),
-      initialFocusedIndex: 0,
-    });
+  @autobind
+  private _navigate(name: string): () => void {
+    return (): void => {
+      this.setState({
+        items: generateItems(name + '/'),
+        initialFocusedIndex: 0,
+      });
+    };
   }
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx
index d68afb2d60515..9d178ba8166b5 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx
@@ -87,7 +87,7 @@ export class DocumentCardCompleteExample extends React.Component<any, any> {
     return (
       <div>
         <DocumentCard
-          onClick={ () => { console.log('You clicked the card.'); } }
+          onClick={ this._onClick }
         >
           <DocumentCardPreview { ...previewProps } />
           <DocumentCardLocation location='Marketing Documents' locationHref='http://microsoft.com' ariaLabel='Location, Marketing Documents' />
@@ -159,4 +159,8 @@ export class DocumentCardCompleteExample extends React.Component<any, any> {
     );
   }
 
+  private _onClick(): void {
+    console.log('You clicked the card.');
+  }
+
 }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
index 184c20410f8b6..f58077ed5d2b4 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
@@ -38,8 +38,8 @@ export class DropdownBasicExample extends React.Component<any, any> {
               { key: 'J', text: 'Option j' },
             ]
           }
-          onFocus={ () => console.log('onFocus called') }
-          onBlur={ () => console.log('onBlur called') }
+          onFocus={ this._log('onFocus called') }
+          onBlur={ this._log('onBlur called') }
         />
 
         <Dropdown
@@ -56,17 +56,17 @@ export class DropdownBasicExample extends React.Component<any, any> {
               { key: 'G', text: 'Option g' },
             ]
           }
-          onFocus={ () => console.log('onFocus called') }
-          onBlur={ () => console.log('onBlur called') }
+          onFocus={ this._log('onFocus called') }
+          onBlur={ this._log('onBlur called') }
           disabled={ true }
         />
 
         <Dropdown
           label='Controlled example:'
           selectedKey={ selectedItem && selectedItem.key }
-          onChanged={ (item) => this.setState({ selectedItem: item }) }
-          onFocus={ () => console.log('onFocus called') }
-          onBlur={ () => console.log('onBlur called') }
+          onChanged={ this.changeState }
+          onFocus={ this._log('onFocus called') }
+          onBlur={ this._log('onBlur called') }
           placeHolder='Select an Option'
           options={
             [
@@ -86,9 +86,9 @@ export class DropdownBasicExample extends React.Component<any, any> {
           placeHolder='Select options'
           label='Multi-Select uncontrolled example:'
           defaultSelectedKeys={ ['Apple', 'Banana'] }
-          onChanged={ (item) => this.changeState(item) }
-          onFocus={ () => console.log('onFocus called') }
-          onBlur={ () => console.log('onBlur called') }
+          onChanged={ this.changeState }
+          onFocus={ this._log('onFocus called') }
+          onBlur={ this._log('onBlur called') }
           multiSelect
           options={
             [
@@ -110,9 +110,9 @@ export class DropdownBasicExample extends React.Component<any, any> {
           placeHolder='Select options'
           label='Multi-Select controlled example:'
           selectedKeys={ selectedItem && selectedItem.key }
-          onChanged={ (item) => this.onChangeMultiSelect(item) }
-          onFocus={ () => console.log('onFocus called') }
-          onBlur={ () => console.log('onBlur called') }
+          onChanged={ this.onChangeMultiSelect }
+          onFocus={ this._log('onFocus called') }
+          onBlur={ this._log('onBlur called') }
           multiSelect
           options={
             [
@@ -145,8 +145,8 @@ export class DropdownBasicExample extends React.Component<any, any> {
             ]
           }
           disabled={ true }
-          onFocus={ () => console.log('onFocus called') }
-          onBlur={ () => console.log('onBlur called') }
+          onFocus={ this._log('onFocus called') }
+          onBlur={ this._log('onBlur called') }
         />
       </div>
 
@@ -192,4 +192,10 @@ export class DropdownBasicExample extends React.Component<any, any> {
     return newArray;
   }
 
+  private _log(str: string): () => void {
+    return (): void => {
+      console.log(str);
+    };
+  }
+
 }
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
index 90bcfba545f9b..482258e660b3e 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
@@ -3,11 +3,13 @@ import {
   Checkbox,
   Dropdown,
   Facepile,
+  IDropdownOption,
   IFacepilePersona,
   IFacepileProps,
   PersonaSize,
   Slider
 } from 'office-ui-fabric-react/lib/index';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { facepilePersonas } from './FacepileExampleData';
 import './Facepile.Examples.scss';
 
@@ -65,21 +67,13 @@ export class FacepileBasicExample extends React.Component<any, IFacepileBasicExa
             step={ 1 }
             showValue={ true }
             value={ numberOfFaces }
-            onChange={ value => this.setState((prevState: IFacepileBasicExampleState) => {
-              prevState.numberOfFaces = value;
-              return prevState;
-            }) }
+            onChange={ this._onChangePersonaNumber }
           />
         </div>
         <Checkbox
           label='Fade In'
           checked={ this.state.imagesFadeIn }
-          onChange={ (ev, checked) => {
-            this.setState((prevState: IFacepileBasicExampleState) => {
-              prevState.imagesFadeIn = checked!;
-              return prevState;
-            });
-          } }
+          onChange={ this._onChangeFadeIn }
         />
         <Dropdown
           label='Persona Size:'
@@ -90,10 +84,7 @@ export class FacepileBasicExample extends React.Component<any, IFacepileBasicExa
               { key: PersonaSize.extraExtraSmall, text: PersonaSize[PersonaSize.extraExtraSmall] }
             ]
           }
-          onChanged={ value => this.setState((prevState: IFacepileBasicExampleState) => {
-            prevState.personaSize = value.key as PersonaSize;
-            return prevState;
-          }) }
+          onChanged={ this._onChangePersonaSize }
         />
         <Dropdown
           label='Additional Data:'
@@ -104,12 +95,41 @@ export class FacepileBasicExample extends React.Component<any, IFacepileBasicExa
               { key: ExtraDataType.name, text: ExtraDataType[ExtraDataType.name] }
             ]
           }
-          onChanged={ value => this.setState((prevState: IFacepileBasicExampleState) => {
-            prevState.extraDataType = value.key as ExtraDataType;
-            return prevState;
-          }) }
+          onChanged={ this._onChangeAddtlData }
         />
       </div>
     );
   }
+
+  @autobind
+  private _onChangeAddtlData(value: IDropdownOption): void {
+    this.setState((prevState: IFacepileBasicExampleState): IFacepileBasicExampleState => {
+      prevState.extraDataType = value.key as ExtraDataType;
+      return prevState;
+    });
+  }
+
+  @autobind
+  private _onChangeFadeIn(ev: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean): void {
+    this.setState((prevState: IFacepileBasicExampleState): IFacepileBasicExampleState => {
+      prevState.imagesFadeIn = checked!;
+      return prevState;
+    });
+  }
+
+  @autobind
+  private _onChangePersonaNumber(value: number): void {
+    this.setState((prevState: IFacepileBasicExampleState): IFacepileBasicExampleState => {
+      prevState.numberOfFaces = value;
+      return prevState;
+    });
+  }
+
+  @autobind
+  private _onChangePersonaSize(value: IDropdownOption): void {
+    this.setState((prevState: IFacepileBasicExampleState): IFacepileBasicExampleState => {
+      prevState.personaSize = value.key as PersonaSize;
+      return prevState;
+    });
+  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx
index dc6c13d20b464..269de4e0e97a3 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx
@@ -4,8 +4,9 @@ import {
   Facepile,
   OverflowButtonType,
 } from 'office-ui-fabric-react/lib/Facepile';
-import { Dropdown } from 'office-ui-fabric-react/lib/Dropdown';
+import { Dropdown, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
 import { Slider } from 'office-ui-fabric-react/lib/Slider';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { facepilePersonas } from './FacepileExampleData';
 import './Facepile.Examples.scss';
 
@@ -52,10 +53,7 @@ export class FacepileOverflowExample extends React.Component<any, IFacepileOverf
             step={ 1 }
             showValue={ true }
             value={ this.state.displayedPersonas }
-            onChange={ value => this.setState((prevState: IFacepileOverflowExampleState) => {
-              prevState.displayedPersonas = value;
-              return prevState;
-            }) }
+            onChange={ this._onChangePersonaNumber }
           />
         </div>
         <Dropdown
@@ -69,12 +67,26 @@ export class FacepileOverflowExample extends React.Component<any, IFacepileOverf
               { key: OverflowButtonType.more, text: OverflowButtonType[OverflowButtonType.more] },
             ]
           }
-          onChanged={ value => this.setState((prevState: IFacepileOverflowExampleState) => {
-            prevState.overflowButtonType = value.key as OverflowButtonType;
-            return prevState;
-          }) }
+          onChanged={ this._onChangeType
+          }
         />
       </div>
     );
   }
+
+  @autobind
+  private _onChangePersonaNumber(value: number): void {
+    this.setState((prevState: IFacepileOverflowExampleState): IFacepileOverflowExampleState => {
+      prevState.displayedPersonas = value;
+      return prevState;
+    });
+  }
+
+  @autobind
+  private _onChangeType(value: IDropdownOption): void {
+    this.setState((prevState: IFacepileOverflowExampleState): IFacepileOverflowExampleState => {
+      prevState.overflowButtonType = value.key as OverflowButtonType;
+      return prevState;
+    });
+  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
index e173325130ba3..603cc4800d9ed 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
@@ -63,7 +63,7 @@ export default class BoxNoClickExample extends React.Component<React.HTMLAttribu
         <TextField label='Default TextField' placeholder='Input inside Focus Trap Zone' className='' />
         <Link href='' className='' >Hyperlink inside FocusTrapZone</Link><br /><br />
         <Toggle
-          componentRef={ t => this._toggle = t }
+          componentRef={ this._setRef }
           checked={ isToggled }
           onChanged={ this._onFocusTrapZoneToggleChanged }
           label='Focus Trap Zone'
@@ -105,4 +105,9 @@ export default class BoxNoClickExample extends React.Component<React.HTMLAttribu
       isToggled: isToggled
     }, () => this._toggle.focus());
   }
+
+  @autobind
+  private _setRef(toggle: IToggle): void {
+    this._toggle = toggle;
+  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
index 766627e07a449..dcd1a73565524 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
@@ -63,7 +63,7 @@ export default class BoxExample extends React.Component<React.HTMLAttributes<HTM
         <TextField label='Default TextField' placeholder='Input inside Focus Trap Zone' className='' />
         <Link href='' className='' >Hyperlink inside FocusTrapZone</Link><br /><br />
         <Toggle
-          componentRef={ toggle => this._toggle = toggle }
+          componentRef={ this._setRef }
           checked={ isChecked }
           onChanged={ this._onFocusTrapZoneToggleChanged }
           label='Focus Trap Zone'
@@ -105,4 +105,9 @@ export default class BoxExample extends React.Component<React.HTMLAttributes<HTM
       isChecked: isChecked
     }, () => this._toggle.focus());
   }
+
+  @autobind
+  private _setRef(toggle: IToggle): void {
+    this._toggle = toggle;
+  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
index f8d18a8b72148..7210625cc0c3f 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
@@ -62,7 +62,7 @@ export default class BoxExample extends React.Component<React.HTMLAttributes<HTM
         <Link href='' className='' >Hyperlink inside FocusTrapZone</Link><br /><br />
         <div className='shouldFocus input'>
           <Toggle
-            componentRef={ t => this._toggle = t }
+            componentRef={ this._setRef }
             checked={ isChecked }
             onChanged={ this._onFocusTrapZoneToggleChanged }
             label='Focus Trap Zone'
@@ -105,4 +105,9 @@ export default class BoxExample extends React.Component<React.HTMLAttributes<HTM
       isChecked: isChecked
     }, () => this._toggle.focus());
   }
+
+  @autobind
+  private _setRef(toggle: IToggle): void {
+    this._toggle = toggle;
+  }
 }
\ No newline at end of file

From 71304a1b3d4b1d36a02ea5ebc74e78b52765b8bb Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 12 Sep 2017 18:32:28 -0700
Subject: [PATCH 0632/1641] getLanguage: use common helpers to avoid Edge
 exception. (#2825)

* Fixing Edge crash issue in getLanguage.

* Adding change file.
---
 .../utilities/lang-fix_2017-09-13-00-19.json  | 11 ++++++++++
 packages/utilities/src/language.ts            | 22 +++++++------------
 2 files changed, 19 insertions(+), 14 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/lang-fix_2017-09-13-00-19.json

diff --git a/common/changes/@uifabric/utilities/lang-fix_2017-09-13-00-19.json b/common/changes/@uifabric/utilities/lang-fix_2017-09-13-00-19.json
new file mode 100644
index 0000000000000..f46de366d7bbd
--- /dev/null
+++ b/common/changes/@uifabric/utilities/lang-fix_2017-09-13-00-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "getLanguage: Use localStorage wrapper helpers to avoid exceptions thrown by the browser when accessing localStorage.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/src/language.ts b/packages/utilities/src/language.ts
index 5315e4787ad4e..4c6464794c7be 100644
--- a/packages/utilities/src/language.ts
+++ b/packages/utilities/src/language.ts
@@ -1,4 +1,5 @@
-import { getDocument, getWindow } from './dom';
+import { getDocument } from './dom';
+import { getItem, setItem } from './localStorage';
 
 // Default to undefined so that we initialize on first read.
 let _language: string | null;
@@ -11,15 +12,10 @@ let _language: string | null;
 export function getLanguage(): string | null {
   if (_language === undefined) {
     let doc = getDocument();
-    let win = getWindow();
+    const savedLanguage = getItem('language');
 
-    // tslint:disable-next-line:no-string-literal
-    if (win && win['localStorage']) {
-      let savedLanguage = localStorage.getItem('language');
-
-      if (savedLanguage !== null) {
-        _language = savedLanguage;
-      }
+    if (savedLanguage !== null) {
+      _language = savedLanguage;
     }
 
     if (_language === undefined && doc) {
@@ -27,7 +23,7 @@ export function getLanguage(): string | null {
     }
 
     if (_language === undefined) {
-      setLanguage('en', false);
+      _language = 'en';
     }
   }
 
@@ -46,10 +42,8 @@ export function setLanguage(language: string, avoidPersisting: boolean = false):
     doc.documentElement.setAttribute('lang', language);
   }
 
-  let win = getWindow();
-  // tslint:disable-next-line:no-string-literal
-  if (win && win['localStorage'] && !avoidPersisting) {
-    localStorage.setItem('language', language);
+  if (!avoidPersisting) {
+    setItem('language', language);
   }
 
   _language = language;

From a9c9fe6749234556ffd31598c7547bdf4560423d Mon Sep 17 00:00:00 2001
From: Eddie Liu <leddie24@gmail.com>
Date: Wed, 13 Sep 2017 15:42:11 -0700
Subject: [PATCH 0633/1641] DetailsList: Update Check sizing so padding is
 included in button rather than parent element (#2812)

* Update Check container padding to be part of the containing button, rather than the parent element so target size is larger.

* Add change file

* Remove 6px 8px padding on DetailsRowCheck
---
 ...liu-detailslist-check-sizing_2017-09-12-17-33.json | 11 +++++++++++
 .../src/components/DetailsList/DetailsHeader.scss     |  2 +-
 .../src/components/DetailsList/DetailsRow.scss        |  4 ++++
 .../src/components/DetailsList/DetailsRowCheck.scss   |  4 ++--
 4 files changed, 18 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-edwliu-detailslist-check-sizing_2017-09-12-17-33.json

diff --git a/common/changes/office-ui-fabric-react/v-edwliu-detailslist-check-sizing_2017-09-12-17-33.json b/common/changes/office-ui-fabric-react/v-edwliu-detailslist-check-sizing_2017-09-12-17-33.json
new file mode 100644
index 0000000000000..92e776b9b9aec
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-edwliu-detailslist-check-sizing_2017-09-12-17-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: Update DetailsRow Check target size to be larger",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-edwliu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
index b7290407d1b9d..9fe5588c7f179 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
@@ -53,7 +53,7 @@ $isPaddedMargin: 24px;
 
   &.cellIsCheck {
     position: relative;
-    padding: 6px 8px;
+    padding: 0;
     margin: 0;
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
index 90805592a1750..60a8573dc29bb 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
@@ -166,6 +166,10 @@ $detailsList-item-focus-meta-text-color: $ms-color-neutralDark;
   overflow: hidden;
   text-overflow: ellipsis;
 
+  &.checkCell {
+    padding: 0;
+  }
+
   & > button {
     max-width: 100%;
   }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
index 8982858c82e36..e19f3fe646dd4 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
@@ -18,8 +18,8 @@
 }
 
 button.check {
-  height: 20px;
-  width: 20px;
+  height: 100%;
+  width: 40px;
   padding: 0;
   margin: 0;
   display: flex;

From cf7593444b8d873daa760caddb21f1665342b716 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 13 Sep 2017 16:08:36 -0700
Subject: [PATCH 0634/1641] Check: alignment is much better... (#2841)

* Updating check styling again.

* Better alignment in safari.

* Update check-again_2017-09-13-22-27.json
---
 .../check-again_2017-09-13-22-27.json                 | 11 +++++++++++
 .../src/components/Check/Check.scss                   |  3 +++
 2 files changed, 14 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/check-again_2017-09-13-22-27.json

diff --git a/common/changes/office-ui-fabric-react/check-again_2017-09-13-22-27.json b/common/changes/office-ui-fabric-react/check-again_2017-09-13-22-27.json
new file mode 100644
index 0000000000000..115602877ed42
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/check-again_2017-09-13-22-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Check: better alignment of the check mark.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.scss b/packages/office-ui-fabric-react/src/components/Check/Check.scss
index 48a561ea1369f..e7daa21b69aa2 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.scss
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.scss
@@ -44,6 +44,8 @@ $checkBoxHeight: 18px;
   top: 0;
   width: $checkBoxHeight;
   height: $checkBoxHeight;
+  text-align: center;
+  vertical-align: middle;
 }
 
 .circle {
@@ -61,6 +63,7 @@ $checkBoxHeight: 18px;
 .check {
   color: $ms-color-neutralTertiaryAlt;
   font-size: 16px;
+  left: .5px;
 }
 
 .rootIsChecked .check {

From de854cef78eefe5409eb581c7a2073bdb88015f5 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 14 Sep 2017 00:34:57 +0000
Subject: [PATCH 0635/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../folder-signal_2017-09-09-00-12.json       | 11 -----
 .../more-vertical_2017-09-13-00-53.json       | 11 -----
 .../utilities/lang-fix_2017-09-13-00-19.json  | 11 -----
 .../check-again_2017-09-13-22-27.json         | 11 -----
 ...mptyArrayFix_--2815-_2017-09-12-22-02.json | 11 -----
 ...nthOnlyDateSelection_2017-09-12-22-41.json | 11 -----
 ...alendarAccessibility_2017-09-11-16-45.json | 11 -----
 .../more-vertical_2017-09-13-00-53.json       | 11 -----
 ...ilslist-check-sizing_2017-09-12-17-33.json | 11 -----
 packages/experiments/CHANGELOG.json           | 25 ++++++++++
 packages/experiments/CHANGELOG.md             |  9 +++-
 packages/experiments/package.json             |  8 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 49 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 17 ++++++-
 packages/office-ui-fabric-react/package.json  |  6 +--
 packages/styling/CHANGELOG.json               | 19 +++++++
 packages/styling/CHANGELOG.md                 |  9 +++-
 packages/styling/package.json                 |  4 +-
 packages/utilities/CHANGELOG.json             | 14 ++++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  4 +-
 25 files changed, 162 insertions(+), 118 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/folder-signal_2017-09-09-00-12.json
 delete mode 100644 common/changes/@uifabric/styling/more-vertical_2017-09-13-00-53.json
 delete mode 100644 common/changes/@uifabric/utilities/lang-fix_2017-09-13-00-19.json
 delete mode 100644 common/changes/office-ui-fabric-react/check-again_2017-09-13-22-27.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerEmptyArrayFix_--2815-_2017-09-12-22-02.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-Calendar-MiniMonthOnlyDateSelection_2017-09-12-22-41.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-CalendarAccessibility_2017-09-11-16-45.json
 delete mode 100644 common/changes/office-ui-fabric-react/more-vertical_2017-09-13-00-53.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-edwliu-detailslist-check-sizing_2017-09-12-17-33.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index fdc8cbb254bc4..fde92a7514c48 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -44,7 +44,7 @@
     "@uifabric/example-app-base": ">=4.2.7 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=4.45.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.46.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 4aa34a87905b7..b23b31b6c8297 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.45.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.46.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 102e4c184c146..565b95799971c 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -26,7 +26,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.45.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.46.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 667fb7fcc8a79..45694da1a08fd 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -24,7 +24,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=4.45.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.46.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/experiments/folder-signal_2017-09-09-00-12.json b/common/changes/@uifabric/experiments/folder-signal_2017-09-09-00-12.json
deleted file mode 100644
index 3bd214e8af25a..0000000000000
--- a/common/changes/@uifabric/experiments/folder-signal_2017-09-09-00-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Add support for folder cover signals",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/more-vertical_2017-09-13-00-53.json b/common/changes/@uifabric/styling/more-vertical_2017-09-13-00-53.json
deleted file mode 100644
index 7c430b4d9274b..0000000000000
--- a/common/changes/@uifabric/styling/more-vertical_2017-09-13-00-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Adding `MoreVertical` icon.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/lang-fix_2017-09-13-00-19.json b/common/changes/@uifabric/utilities/lang-fix_2017-09-13-00-19.json
deleted file mode 100644
index f46de366d7bbd..0000000000000
--- a/common/changes/@uifabric/utilities/lang-fix_2017-09-13-00-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "getLanguage: Use localStorage wrapper helpers to avoid exceptions thrown by the browser when accessing localStorage.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/check-again_2017-09-13-22-27.json b/common/changes/office-ui-fabric-react/check-again_2017-09-13-22-27.json
deleted file mode 100644
index 115602877ed42..0000000000000
--- a/common/changes/office-ui-fabric-react/check-again_2017-09-13-22-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Check: better alignment of the check mark.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerEmptyArrayFix_--2815-_2017-09-12-22-02.json b/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerEmptyArrayFix_--2815-_2017-09-12-22-02.json
deleted file mode 100644
index a411655429483..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerEmptyArrayFix_--2815-_2017-09-12-22-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "[SwatchColorPicker] Fix uncaught exception when colorCells is empty",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kegorr-Calendar-MiniMonthOnlyDateSelection_2017-09-12-22-41.json b/common/changes/office-ui-fabric-react/kegorr-Calendar-MiniMonthOnlyDateSelection_2017-09-12-22-41.json
deleted file mode 100644
index 6b84fd4c66cc9..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-Calendar-MiniMonthOnlyDateSelection_2017-09-12-22-41.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Calendar: Month-picker-only selection bug fixed",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kegorr-CalendarAccessibility_2017-09-11-16-45.json b/common/changes/office-ui-fabric-react/kegorr-CalendarAccessibility_2017-09-11-16-45.json
deleted file mode 100644
index ea5aa535d2594..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-CalendarAccessibility_2017-09-11-16-45.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Calendar:  Updating accessibility, fixing headers aria box, fixing selected/unselected state in day and month picker, updating aria-label for next/previous buttons, fixing arial label for months in month picker.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/more-vertical_2017-09-13-00-53.json b/common/changes/office-ui-fabric-react/more-vertical_2017-09-13-00-53.json
deleted file mode 100644
index 6434352cc992c..0000000000000
--- a/common/changes/office-ui-fabric-react/more-vertical_2017-09-13-00-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Adding `MoreVertical` icon.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-edwliu-detailslist-check-sizing_2017-09-12-17-33.json b/common/changes/office-ui-fabric-react/v-edwliu-detailslist-check-sizing_2017-09-12-17-33.json
deleted file mode 100644
index 92e776b9b9aec..0000000000000
--- a/common/changes/office-ui-fabric-react/v-edwliu-detailslist-check-sizing_2017-09-12-17-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: Update DetailsRow Check target size to be larger",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-edwliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 22a376b01cab7..bbbd829c1b738 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,31 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "0.7.0",
+      "tag": "@uifabric/experiments_v0.7.0",
+      "date": "Thu, 14 Sep 2017 00:34:57 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "8a8343d979e0ff55ce24a1e1e649793ce9020f08",
+            "comment": "Add support for folder cover signals"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.23.1 <1.0.0` to `>=0.24.0 <1.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.13.0 <5.0.0` to `>=4.13.1 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.45.1 <5.0.0` to `>=4.46.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.6.0",
       "tag": "@uifabric/experiments_v0.6.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 0a4c6ef77ede6..1beb825f6e3de 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Tue, 12 Sep 2017 17:41:25 GMT and should not be manually modified.
+This log was last generated on Thu, 14 Sep 2017 00:34:57 GMT and should not be manually modified.
+
+## 0.7.0
+Thu, 14 Sep 2017 00:34:57 GMT
+
+### Minor changes
+
+- Add support for folder cover signals
 
 ## 0.6.0
 Tue, 12 Sep 2017 17:41:25 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 56cfe1578c1ee..980027ad8e651 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "0.6.0",
+  "version": "0.7.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -41,9 +41,9 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/styling": ">=0.23.1 <1.0.0",
-    "@uifabric/utilities": ">=4.13.0 <5.0.0",
-    "office-ui-fabric-react": ">=4.45.1 <5.0.0",
+    "@uifabric/styling": ">=0.24.0 <1.0.0",
+    "@uifabric/utilities": ">=4.13.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.46.0 <5.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 7ce67e034169e..646b578b0f69d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,55 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.46.0",
+      "tag": "office-ui-fabric-react_v4.46.0",
+      "date": "Thu, 14 Sep 2017 00:34:57 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "cf7593444b8d873daa760caddb21f1665342b716",
+            "comment": "Check: better alignment of the check mark."
+          },
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "c5904b5a36fd58694f4d59d634610068b98a87b9",
+            "comment": "[SwatchColorPicker] Fix uncaught exception when colorCells is empty"
+          },
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "561e832554ebdbbfc44e219370b56f019571bf38",
+            "comment": "Calendar: Month-picker-only selection bug fixed"
+          },
+          {
+            "author": "Eddie Liu <leddie24@gmail.com>",
+            "commit": "a9c9fe6749234556ffd31598c7547bdf4560423d",
+            "comment": "DetailsList: Update DetailsRow Check target size to be larger"
+          }
+        ],
+        "minor": [
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "f49723ef1425284a918fc79cf8e6db8f9ed3964e",
+            "comment": "Calendar:  Updating accessibility, fixing headers aria box, fixing selected/unselected state in day and month picker, updating aria-label for next/previous buttons, fixing arial label for months in month picker."
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "b691aa97525304884029629d2f40f14dc663f0bb",
+            "comment": "Adding `MoreVertical` icon."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.13.0 <5.0.0` to `>=4.13.1 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.23.1 <1.0.0` to `>=0.24.0 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.45.1",
       "tag": "office-ui-fabric-react_v4.45.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 7bc40702420c9..b2a74335bdbc2 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,21 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 12 Sep 2017 17:41:25 GMT and should not be manually modified.
+This log was last generated on Thu, 14 Sep 2017 00:34:57 GMT and should not be manually modified.
+
+## 4.46.0
+Thu, 14 Sep 2017 00:34:57 GMT
+
+### Minor changes
+
+- Calendar:  Updating accessibility, fixing headers aria box, fixing selected/unselected state in day and month picker, updating aria-label for next/previous buttons, fixing arial label for months in month picker.
+- Adding `MoreVertical` icon.
+
+### Patches
+
+- Check: better alignment of the check mark.
+- [SwatchColorPicker] Fix uncaught exception when colorCells is empty
+- Calendar: Month-picker-only selection bug fixed
+- DetailsList: Update DetailsRow Check target size to be larger
 
 ## 4.45.1
 Tue, 12 Sep 2017 17:41:25 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 7068e92aba05d..7e020ccd8d2c3 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.45.1",
+  "version": "4.46.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,8 +43,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=4.13.0 <5.0.0",
-    "@uifabric/styling": ">=0.23.1 <1.0.0",
+    "@uifabric/utilities": ">=4.13.1 <5.0.0",
+    "@uifabric/styling": ">=0.24.0 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index bc43899425222..40316749f30fd 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.24.0",
+      "tag": "@uifabric/styling_v0.24.0",
+      "date": "Thu, 14 Sep 2017 00:34:57 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "b691aa97525304884029629d2f40f14dc663f0bb",
+            "comment": "Adding `MoreVertical` icon."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.13.0 <5.0.0` to `>=4.13.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.23.1",
       "tag": "@uifabric/styling_v0.23.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index b8b70b66f481b..e128df8e93a54 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Tue, 12 Sep 2017 17:41:25 GMT and should not be manually modified.
+This log was last generated on Thu, 14 Sep 2017 00:34:57 GMT and should not be manually modified.
+
+## 0.24.0
+Thu, 14 Sep 2017 00:34:57 GMT
+
+### Minor changes
+
+- Adding `MoreVertical` icon.
 
 ## 0.23.1
 Tue, 12 Sep 2017 17:41:25 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index d0a47a807b1c7..652529e4d3424 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.23.1",
+  "version": "0.24.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -28,7 +28,7 @@
     "react-dom": "^15.4.2"
   },
   "dependencies": {
-    "@uifabric/utilities": ">=4.13.0 <5.0.0",
+    "@uifabric/utilities": ">=4.13.1 <5.0.0",
     "tslib": "^1.7.1",
     "rtl-css-js": "^1.1.3",
     "glamor": "^2.20.40"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index c9339d33bd0bc..5f7e80465088c 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.13.1",
+      "tag": "@uifabric/utilities_v4.13.1",
+      "date": "Thu, 14 Sep 2017 00:34:57 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "71304a1b3d4b1d36a02ea5ebc74e78b52765b8bb",
+            "comment": "getLanguage: Use localStorage wrapper helpers to avoid exceptions thrown by the browser when accessing localStorage."
+          }
+        ]
+      }
+    },
     {
       "version": "4.13.0",
       "tag": "@uifabric/utilities_v4.13.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 6018c2668591c..7d6d73102baf4 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Mon, 04 Sep 2017 10:16:56 GMT and should not be manually modified.
+This log was last generated on Thu, 14 Sep 2017 00:34:57 GMT and should not be manually modified.
+
+## 4.13.1
+Thu, 14 Sep 2017 00:34:57 GMT
+
+### Patches
+
+- getLanguage: Use localStorage wrapper helpers to avoid exceptions thrown by the browser when accessing localStorage.
 
 ## 4.13.0
 Mon, 04 Sep 2017 10:16:56 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 7cd92ab554bf5..0c84c6cf47695 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.13.0",
+  "version": "4.13.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,4 +43,4 @@
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   }
-}
+}
\ No newline at end of file

From bd33f70885615750558e10dfb9aca8eabe12ca1b Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Wed, 13 Sep 2017 19:03:18 -0700
Subject: [PATCH 0636/1641] Extract PersonaCoin and PersonaPresence from
 Persona (#2839)

* Extract PersonaCoin and PersonaPresence from Persona

* Use mount instead of shallow in Persona test

* Export PersonaCoin

* Fix Persona styling

* Update Facepile to use PersonaCoin

* Change Persona uses to PersonaCoin when hiding details

* Pass only PersonaCoin props that are used directly

* Add change file

* Fixed missing  imageInitials props
---
 .../persona-refactor_2017-09-14-01-39.json    |  11 +
 .../office-ui-fabric-react/src/PersonaCoin.ts |   3 +
 .../components/ActivityItem/ActivityItem.tsx  |   6 +-
 .../DocumentCard/DocumentCardActivity.tsx     |   6 +-
 .../src/components/Facepile/Facepile.test.tsx |  11 +-
 .../src/components/Facepile/Facepile.tsx      |  16 +-
 .../src/components/Persona/Persona.test.tsx   |  28 +--
 .../src/components/Persona/Persona.tsx        | 197 +++---------------
 .../src/components/Persona/PersonaCoin.tsx    | 177 ++++++++++++++++
 .../components/Persona/PersonaPresence.tsx    |  57 +++++
 10 files changed, 312 insertions(+), 200 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/persona-refactor_2017-09-14-01-39.json
 create mode 100644 packages/office-ui-fabric-react/src/PersonaCoin.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Persona/PersonaPresence.tsx

diff --git a/common/changes/office-ui-fabric-react/persona-refactor_2017-09-14-01-39.json b/common/changes/office-ui-fabric-react/persona-refactor_2017-09-14-01-39.json
new file mode 100644
index 0000000000000..ac0a9cc92b79d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/persona-refactor_2017-09-14-01-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Refactor `Persona` to extract `PersonaCoin` and `PersonaPresence` so image/status can be rendered alone without Tooltip. Added `PersonaCoin` to top level exports",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "a.erich@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/PersonaCoin.ts b/packages/office-ui-fabric-react/src/PersonaCoin.ts
new file mode 100644
index 0000000000000..695908e3ab8c0
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/PersonaCoin.ts
@@ -0,0 +1,3 @@
+export * from './components/Persona/PersonaCoin';
+export * from './components/Persona/Persona.Props';
+export * from './components/Persona/PersonaConsts';
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
index 6f4c31c32376b..214b7ec0dffae 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
@@ -6,7 +6,8 @@ import { autobind, BaseComponent, memoize } from '../../Utilities';
 import { IActivityItemProps, IActivityItemStyles } from './ActivityItem.Props';
 import { mergeStyles } from '../../Styling';
 import { getStyles } from './ActivityItem.styles';
-import { Persona, PersonaSize } from 'office-ui-fabric-react/lib/Persona';
+import { PersonaSize } from 'office-ui-fabric-react/lib/Persona';
+import { PersonaCoin } from 'office-ui-fabric-react/lib/PersonaCoin';
 import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
 
 export interface IActivityItemClassNames {
@@ -120,13 +121,12 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
       }
       activityPersonas.filter((person, index) => index < personaLimit).forEach((person, index) => {
         personaList.push(
-          <Persona
+          <PersonaCoin
             {...person}
             // tslint:disable-next-line:no-string-literal
             key={ person['key'] ? person['key'] : index }
             className={ this._classNames.activityPersona }
             size={ showSize16Personas ? PersonaSize.size16 : PersonaSize.extraSmall }
-            hidePersonaDetails={ true }
             style={ style }
           />
         );
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx
index 5d3b19520a658..314298eb40d08 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx
@@ -1,7 +1,8 @@
 import * as React from 'react';
 import { BaseComponent, css } from '../../Utilities';
 import { IDocumentCardActivityProps, IDocumentCardActivityPerson } from './DocumentCard.Props';
-import { Persona, PersonaSize } from '../../Persona';
+import { PersonaSize } from '../../Persona';
+import { PersonaCoin } from '../../PersonaCoin';
 import * as stylesImport from './DocumentCard.scss';
 const styles: any = stylesImport;
 
@@ -40,10 +41,9 @@ export class DocumentCardActivity extends BaseComponent<IDocumentCardActivityPro
 
     return (
       <div className={ css('ms-DocumentCardActivity-avatar', styles.avatar) }>
-        <Persona
+        <PersonaCoin
           imageInitials={ person.initials }
           primaryText={ person.name }
-          hidePersonaDetails={ true }
           imageUrl={ person.profileImageSrc }
           initialsColor={ person.initialsColor }
           role='persentation'
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
index 0400979d41d60..1acc8ac09d678 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
@@ -7,7 +7,8 @@ import { mount, shallow } from 'enzyme';
 import { setRTL } from '../../Utilities';
 import { Facepile } from './Facepile';
 import { IFacepilePersona, OverflowButtonType } from './Facepile.Props';
-import { Persona, PersonaSize } from '../Persona';
+import { PersonaSize } from '../Persona';
+import { PersonaCoin } from '../../PersonaCoin';
 import { TestImages } from '../../common/TestImages';
 
 const { expect } = chai;
@@ -166,9 +167,9 @@ describe('Facepile', () => {
           personas={ facepilePersonas }
           personaSize={ PersonaSize.extraExtraSmall }
         />);
-      let faces = wrapper.find(Persona);
+      let faces = wrapper.find(PersonaCoin);
       expect(faces).to.have.length(facepilePersonas.length, 'XXSmall personas should render');
-      wrapper.find(Persona).forEach((node) => {
+      wrapper.find(PersonaCoin).forEach((node) => {
         expect(node.html()).to.contain('ms-Persona--xxs');
       });
 
@@ -178,9 +179,9 @@ describe('Facepile', () => {
           personas={ facepilePersonas }
           personaSize={ PersonaSize.small }
         />);
-      faces = wrapper.find(Persona);
+      faces = wrapper.find(PersonaCoin);
       expect(faces).to.have.length(facepilePersonas.length, 'Small personas should render');
-      wrapper.find(Persona).forEach((node) => {
+      wrapper.find(PersonaCoin).forEach((node) => {
         expect(node.html()).to.contain('ms-Persona--sm');
       });
     });
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
index 55249bcb357bb..b6f1c548bc6b8 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
@@ -23,9 +23,9 @@ import {
   Icon
 } from '../../Icon';
 import {
-  Persona,
+  PersonaCoin,
   PersonaSize
-} from '../../Persona';
+} from '../../PersonaCoin';
 import * as stylesImport from './Facepile.scss';
 const styles: any = stylesImport;
 
@@ -103,13 +103,12 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
   private _getPersonaControl(persona: IFacepilePersona): JSX.Element {
     let { getPersonaProps, personaSize } = this.props;
     return (
-      <Persona
+      <PersonaCoin
         imageInitials={ persona.imageInitials }
         imageUrl={ persona.imageUrl }
         initialsColor={ persona.initialsColor }
         primaryText={ persona.personaName }
         size={ personaSize }
-        hidePersonaDetails={ true }
         {...(getPersonaProps ? getPersonaProps(persona) : null) }
       />
     );
@@ -177,10 +176,9 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
         ariaDescription={ personaNames }
         className={ css('ms-Facepile-descriptiveOverflowButton', 'ms-Facepile-itemButton', styles.descriptiveOverflowButton, styles.itemButton) }
       >
-        <Persona
+        <PersonaCoin
           title={ personaNames }
           size={ personaSize }
-          hidePersonaDetails={ true }
           onRenderInitials={ () => {
             return (
               <span>{ '+' + numPersonasNotPictured }</span>
@@ -199,9 +197,8 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
         {...overflowButtonProps}
         className={ css('ms-Facepile-overflowButton', 'ms-Facepile-itemButton', styles.overflowButton, styles.itemButton) }
       >
-        <Persona
+        <PersonaCoin
           size={ personaSize }
-          hidePersonaDetails={ true }
           onRenderInitials={ () => (
             <Icon iconName={ icon } />
           ) }
@@ -217,9 +214,8 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
         {...addButtonProps}
         className={ css('ms-Facepile-addButton', 'ms-Facepile-itemButton', styles.itemButton, styles.addButton) }
       >
-        <Persona
+        <PersonaCoin
           size={ personaSize }
-          hidePersonaDetails={ true }
           onRenderInitials={ () => (
             <Icon iconName='AddFriend' />
           ) }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
index 1c0d6976e23b8..47495676d2c1d 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 import { setRTL } from '../../Utilities';
 import { Persona } from './Persona';
 import { PersonaInitialsColor } from './Persona.Props';
-import { shallow, ShallowWrapper } from 'enzyme';
+import { mount, ReactWrapper } from 'enzyme';
 import * as stylesImport from './Persona.scss';
 const styles: any = stylesImport;
 
@@ -18,38 +18,38 @@ describe('Persona', () => {
 
   describe('initials and colors', () => {
     it('renders with expected initialsColor if none was provided', () => {
-      const wrapper = shallow(<Persona primaryText='Kat Larrson' />);
+      const wrapper = mount(<Persona primaryText='Kat Larrson' />);
       let result = wrapper.find('.' + styles.initialsIsRed);
       expect(result).to.have.length(1);
 
-      const wrapper2 = shallow(<Persona primaryText='Annie Lindqvist' />);
+      const wrapper2 = mount(<Persona primaryText='Annie Lindqvist' />);
       result = wrapper2.find('.' + styles.initialsIsDarkRed);
       expect(result).to.have.length(1);
     });
 
     it('uses provided initialsColor if one was specified', () => {
-      const wrapper = shallow(<Persona primaryText='Kat Larrson' initialsColor={ PersonaInitialsColor.lightBlue } />);
+      const wrapper = mount(<Persona primaryText='Kat Larrson' initialsColor={ PersonaInitialsColor.lightBlue } />);
       let result = wrapper.find('.' + styles.initialsIsLightBlue);
       expect(result).to.have.length(1);
     });
 
     it('calculates an expected initials in LTR if one was not specified', () => {
-      let wrapper = shallow(<Persona primaryText='Kat Larrson' />);
+      let wrapper = mount(<Persona primaryText='Kat Larrson' />);
       let result = wrapper.find('.' + styles.initials);
       expect(result).to.have.length(1);
       expect(result.text()).to.equal('KL');
 
-      wrapper = shallow(<Persona primaryText='David Zearing-Goff' />);
+      wrapper = mount(<Persona primaryText='David Zearing-Goff' />);
       result = wrapper.find('.' + styles.initials);
       expect(result).to.have.length(1);
       expect(result.text()).to.equal('DZ');
 
-      wrapper = shallow(<Persona primaryText='4lex 4loo' />);
+      wrapper = mount(<Persona primaryText='4lex 4loo' />);
       result = wrapper.find('.' + styles.initials);
       expect(result).to.have.length(1);
       expect(result.text()).to.equal('44');
 
-      wrapper = shallow(<Persona primaryText='David (The man) Goff' />);
+      wrapper = mount(<Persona primaryText='David (The man) Goff' />);
       result = wrapper.find('.' + styles.initials);
       expect(result).to.have.length(1);
       expect(result.text()).to.equal('DG');
@@ -57,7 +57,7 @@ describe('Persona', () => {
 
     it('calculates an expected initials in RTL if one was not specified', () => {
       setRTL(true);
-      const wrapper = shallow(<Persona primaryText='Kat Larrson' />);
+      const wrapper = mount(<Persona primaryText='Kat Larrson' />);
       let result = wrapper.find('.' + styles.initials);
       expect(result).to.have.length(1);
       expect(result.text()).to.equal('LK');
@@ -67,7 +67,7 @@ describe('Persona', () => {
 
     it('uses provided initial', () => {
       setRTL(true);
-      const wrapper = shallow(<Persona primaryText='Kat Larrson' imageInitials='AT' />);
+      const wrapper = mount(<Persona primaryText='Kat Larrson' imageInitials='AT' />);
       let result = wrapper.find('.' + styles.initials);
       expect(result).to.have.length(1);
       expect(result.text()).to.equal('AT');
@@ -78,15 +78,15 @@ describe('Persona', () => {
 
   describe('image', () => {
     it('renders empty alt text by default', () => {
-      const wrapper = shallow(<Persona primaryText='Kat Larrson' imageUrl={ testImage1x1 } />);
-      const image: ShallowWrapper<React.ImgHTMLAttributes<any>, any> = wrapper.find('Image');
+      const wrapper = mount(<Persona primaryText='Kat Larrson' imageUrl={ testImage1x1 } />);
+      const image: ReactWrapper<React.ImgHTMLAttributes<any>, any> = wrapper.find('Image');
 
       expect(image.props().alt).to.equal('');
     });
 
     it('renders its given alt text', () => {
-      const wrapper = shallow(<Persona primaryText='Kat Larrson' imageUrl={ testImage1x1 } imageAlt='ALT TEXT' />);
-      const image: ShallowWrapper<React.ImgHTMLAttributes<any>, any> = wrapper.find('Image');
+      const wrapper = mount(<Persona primaryText='Kat Larrson' imageUrl={ testImage1x1 } imageAlt='ALT TEXT' />);
+      const image: ReactWrapper<React.ImgHTMLAttributes<any>, any> = wrapper.find('Image');
 
       expect(image.props().alt).to.equal('ALT TEXT');
     });
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index 026ef8f58e340..8505d88e94382 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -4,125 +4,66 @@ import {
   autobind,
   css,
   divProperties,
-  getInitials,
   getNativeProps,
-  getRTL,
   IRenderFunction
 } from '../../Utilities';
-import { Icon } from '../../Icon';
-import { Image, ImageFit, ImageLoadState } from '../../Image';
 import { TooltipHost, TooltipOverflowMode } from '../../Tooltip';
+import { PersonaCoin } from './PersonaCoin';
 import {
   IPersonaProps,
-  PersonaInitialsColor,
-  PersonaPresence,
+  PersonaPresence as PersonaPresenceEnum,
   PersonaSize
 } from './Persona.Props';
-import {
-  PERSONA_INITIALS_COLOR,
-  PERSONA_PRESENCE,
-  PERSONA_SIZE
-} from './PersonaConsts';
 import * as stylesImport from './Persona.scss';
 const styles: any = stylesImport;
 
-const SIZE_TO_PIXELS = {
-  [PersonaSize.extraExtraSmall]: 24,
-  [PersonaSize.size28]: 28,
-  [PersonaSize.tiny]: 30,
-  [PersonaSize.extraSmall]: 32,
-  [PersonaSize.small]: 40,
-  [PersonaSize.regular]: 48,
-  [PersonaSize.large]: 72,
-  [PersonaSize.extraLarge]: 100
-};
-
-// The RGB color swatches
-const COLOR_SWATCHES_LOOKUP: PersonaInitialsColor[] = [
-  PersonaInitialsColor.lightGreen,
-  PersonaInitialsColor.lightBlue,
-  PersonaInitialsColor.lightPink,
-  PersonaInitialsColor.green,
-  PersonaInitialsColor.darkGreen,
-  PersonaInitialsColor.pink,
-  PersonaInitialsColor.magenta,
-  PersonaInitialsColor.purple,
-  PersonaInitialsColor.black,
-  PersonaInitialsColor.teal,
-  PersonaInitialsColor.blue,
-  PersonaInitialsColor.darkBlue,
-  PersonaInitialsColor.orange,
-  PersonaInitialsColor.darkRed,
-  PersonaInitialsColor.red
-];
-
-const COLOR_SWATCHES_NUM_ENTRIES = COLOR_SWATCHES_LOOKUP.length;
-
-export interface IPersonaState {
-  isImageLoaded?: boolean;
-}
-
-export class Persona extends BaseComponent<IPersonaProps, IPersonaState> {
+export class Persona extends BaseComponent<IPersonaProps, {}> {
   public static defaultProps: IPersonaProps = {
     primaryText: '',
     size: PersonaSize.regular,
-    presence: PersonaPresence.none,
+    presence: PersonaPresenceEnum.none,
     imageAlt: ''
   };
 
   constructor(props: IPersonaProps) {
     super(props);
-
-    this.state = {
-      isImageLoaded: false,
-    };
   }
 
   public render() {
     let {
-      className,
-      imageUrl,
-      imageAlt,
-      initialsColor,
-      presence,
-      primaryText,
       hidePersonaDetails,
-      imageShouldFadeIn,
-      onRenderInitials = this._onRenderInitials,
       onRenderPrimaryText,
       onRenderSecondaryText,
       onRenderTertiaryText,
       onRenderOptionalText,
-      imageShouldStartVisible
     } = this.props;
     let size = this.props.size as PersonaSize;
 
-    initialsColor = initialsColor !== undefined && initialsColor !== null ? initialsColor : this._getColorFromName(primaryText);
+    // These properties are to be explicitly passed into PersonaCoin because they are the only props directly used
+    let {
+      className,
+      imageUrl,
+      imageAlt,
+      imageInitials,
+      initialsColor,
+      presence,
+      primaryText,
+      imageShouldFadeIn,
+      imageShouldStartVisible
+     } = this.props;
 
-    let presenceElement = null;
-    if (presence !== PersonaPresence.none) {
-      let userPresence = PersonaPresence[presence as PersonaPresence],
-        statusIcon = null;
-      switch (userPresence) {
-        case 'online':
-          userPresence = 'SkypeCheck';
-          break;
-        case 'away':
-          userPresence = 'SkypeClock';
-          break;
-        case 'dnd':
-          userPresence = 'SkypeMinus';
-          break;
-        default:
-          userPresence = '';
-      }
-      if (userPresence) {
-        statusIcon = (
-          <Icon className={ css('ms-Persona-presenceIcon', styles.presenceIcon) } iconName={ userPresence } />
-        );
-      }
-      presenceElement = <div className={ css('ms-Persona-presence', styles.presence) }>{ statusIcon }</div>;
-    }
+    let personaCoinProps = {
+      className,
+      imageUrl,
+      imageAlt,
+      imageInitials,
+      initialsColor,
+      presence,
+      primaryText,
+      imageShouldFadeIn,
+      imageShouldStartVisible,
+      size
+    };
 
     let divProps = getNativeProps(this.props, divProperties);
     let personaDetails = (
@@ -148,42 +89,10 @@ export class Persona extends BaseComponent<IPersonaProps, IPersonaState> {
     );
 
     return (
-      <div
-        { ...divProps }
-        className={ css('ms-Persona', styles.root, className, PERSONA_SIZE[size], PERSONA_PRESENCE[presence as PersonaPresence], this.props.showSecondaryText ? styles.showSecondaryText : '') }
-      >
-        { size !== PersonaSize.tiny && (
-          <div className={ css('ms-Persona-imageArea', styles.imageArea) }>
-            {
-              !this.state.isImageLoaded &&
-              (
-                <div
-                  className={ css(
-                    'ms-Persona-initials',
-                    styles.initials,
-                    PERSONA_INITIALS_COLOR[initialsColor]
-                  ) }
-                  aria-hidden='true'
-                >
-                  { onRenderInitials(this.props, this._onRenderInitials) }
-                </div>
-              )
-            }
-            <Image
-              className={ css('ms-Persona-image', styles.image) }
-              imageFit={ ImageFit.cover }
-              src={ imageUrl }
-              width={ SIZE_TO_PIXELS[size] }
-              height={ SIZE_TO_PIXELS[size] }
-              alt={ imageAlt }
-              shouldFadeIn={ imageShouldFadeIn }
-              shouldStartVisible={ imageShouldStartVisible }
-              onLoadingStateChange={ this._onPhotoLoadingStateChange }
-            />
-          </div>
-        ) }
-        { presenceElement }
-        { (!hidePersonaDetails || (size === PersonaSize.tiny)) && personaDetails }
+      <div { ...divProps }>
+        <PersonaCoin { ...personaCoinProps }>
+          { (!hidePersonaDetails || (size === PersonaSize.tiny)) && personaDetails }
+        </PersonaCoin>
       </div>
     );
   }
@@ -199,46 +108,4 @@ export class Persona extends BaseComponent<IPersonaProps, IPersonaState> {
       </div>
     );
   }
-
-  @autobind
-  private _onRenderInitials(props: IPersonaProps): JSX.Element {
-    let {
-      imageInitials,
-      primaryText
-    } = props;
-
-    let isRTL = getRTL();
-
-    imageInitials = imageInitials || getInitials(primaryText, isRTL);
-
-    return (
-      <span>{ imageInitials }</span>
-    );
-  }
-
-  private _getColorFromName(displayName: string | undefined): PersonaInitialsColor {
-    let color = PersonaInitialsColor.blue;
-    if (!displayName) {
-      return color;
-    }
-
-    let hashCode = 0;
-    for (let iLen: number = displayName.length - 1; iLen >= 0; iLen--) {
-      const ch: number = displayName.charCodeAt(iLen);
-      const shift: number = iLen % 8;
-      // tslint:disable-next-line:no-bitwise
-      hashCode ^= (ch << shift) + (ch >> (8 - shift));
-    }
-
-    color = COLOR_SWATCHES_LOOKUP[hashCode % COLOR_SWATCHES_NUM_ENTRIES];
-
-    return color;
-  }
-
-  @autobind
-  private _onPhotoLoadingStateChange(loadState: ImageLoadState) {
-    this.setState({
-      isImageLoaded: loadState === ImageLoadState.loaded
-    });
-  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
new file mode 100644
index 0000000000000..e792c2350f189
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
@@ -0,0 +1,177 @@
+import * as React from 'react';
+import {
+  autobind,
+  css,
+  divProperties,
+  getInitials,
+  getNativeProps,
+  getRTL
+} from '../../Utilities';
+import { Image, ImageFit, ImageLoadState } from '../../Image';
+import { PersonaPresence } from './PersonaPresence';
+import {
+  IPersonaProps,
+  PersonaPresence as PersonaPresenceEnum,
+  PersonaInitialsColor,
+  PersonaSize
+} from './Persona.Props';
+import {
+  PERSONA_INITIALS_COLOR,
+  PERSONA_PRESENCE,
+  PERSONA_SIZE
+} from './PersonaConsts';
+import * as stylesImport from './Persona.scss';
+const styles: any = stylesImport;
+
+const SIZE_TO_PIXELS = {
+  [PersonaSize.extraExtraSmall]: 24,
+  [PersonaSize.size28]: 28,
+  [PersonaSize.tiny]: 30,
+  [PersonaSize.extraSmall]: 32,
+  [PersonaSize.small]: 40,
+  [PersonaSize.regular]: 48,
+  [PersonaSize.large]: 72,
+  [PersonaSize.extraLarge]: 100
+};
+
+const COLOR_SWATCHES_LOOKUP: PersonaInitialsColor[] = [
+  PersonaInitialsColor.lightGreen,
+  PersonaInitialsColor.lightBlue,
+  PersonaInitialsColor.lightPink,
+  PersonaInitialsColor.green,
+  PersonaInitialsColor.darkGreen,
+  PersonaInitialsColor.pink,
+  PersonaInitialsColor.magenta,
+  PersonaInitialsColor.purple,
+  PersonaInitialsColor.black,
+  PersonaInitialsColor.teal,
+  PersonaInitialsColor.blue,
+  PersonaInitialsColor.darkBlue,
+  PersonaInitialsColor.orange,
+  PersonaInitialsColor.darkRed,
+  PersonaInitialsColor.red
+];
+
+const COLOR_SWATCHES_NUM_ENTRIES = COLOR_SWATCHES_LOOKUP.length;
+
+export interface IPersonaState {
+  isImageLoaded?: boolean;
+}
+
+export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
+  public static defaultProps: IPersonaProps = {
+    primaryText: '',
+    size: PersonaSize.regular,
+    presence: PersonaPresenceEnum.none,
+    imageAlt: ''
+  };
+
+  constructor(props: IPersonaProps) {
+    super(props);
+
+    this.state = {
+      isImageLoaded: false,
+    };
+  }
+
+  public render(): JSX.Element | null {
+    let {
+      className,
+      imageUrl,
+      imageAlt,
+      initialsColor,
+      presence,
+      primaryText,
+      imageShouldFadeIn,
+      onRenderInitials = this._onRenderInitials,
+      imageShouldStartVisible
+     } = this.props;
+
+    let size = this.props.size as PersonaSize;
+    let divProps = getNativeProps(this.props, divProperties);
+
+    initialsColor = initialsColor !== undefined && initialsColor !== null ? initialsColor : this._getColorFromName(primaryText);
+
+    return (
+      <div
+        { ...divProps }
+        className={ css('ms-Persona', styles.root, className, PERSONA_SIZE[size], PERSONA_PRESENCE[presence as PersonaPresenceEnum], this.props.showSecondaryText ? styles.showSecondaryText : '') }
+      >
+        { size !== PersonaSize.tiny && (
+          <div className={ css('ms-Persona-imageArea', styles.imageArea) }>
+            {
+              !this.state.isImageLoaded &&
+              (
+                <div
+                  className={ css(
+                    'ms-Persona-initials',
+                    styles.initials,
+                    PERSONA_INITIALS_COLOR[initialsColor]
+                  ) }
+                  aria-hidden='true'
+                >
+                  { onRenderInitials(this.props, this._onRenderInitials) }
+                </div>
+              )
+            }
+            <Image
+              className={ css('ms-Persona-image', styles.image) }
+              imageFit={ ImageFit.cover }
+              src={ imageUrl }
+              width={ SIZE_TO_PIXELS[size] }
+              height={ SIZE_TO_PIXELS[size] }
+              alt={ imageAlt }
+              shouldFadeIn={ imageShouldFadeIn }
+              shouldStartVisible={ imageShouldStartVisible }
+              onLoadingStateChange={ this._onPhotoLoadingStateChange }
+            />
+          </div>
+        ) }
+        <PersonaPresence { ...this.props } />
+        { this.props.children }
+      </div>
+    );
+  }
+
+  private _getColorFromName(displayName: string | undefined): PersonaInitialsColor {
+    let color = PersonaInitialsColor.blue;
+    if (!displayName) {
+      return color;
+    }
+
+    let hashCode = 0;
+    for (let iLen: number = displayName.length - 1; iLen >= 0; iLen--) {
+      const ch: number = displayName.charCodeAt(iLen);
+      const shift: number = iLen % 8;
+      // tslint:disable-next-line:no-bitwise
+      hashCode ^= (ch << shift) + (ch >> (8 - shift));
+    }
+
+    color = COLOR_SWATCHES_LOOKUP[hashCode % COLOR_SWATCHES_NUM_ENTRIES];
+
+    return color;
+  }
+
+  @autobind
+  private _onRenderInitials(props: IPersonaProps): JSX.Element {
+    let {
+      imageInitials,
+      primaryText
+    } = props;
+
+    let isRTL = getRTL();
+
+    imageInitials = imageInitials || getInitials(primaryText, isRTL);
+
+    return (
+      <span>{ imageInitials }</span>
+    );
+  }
+
+  @autobind
+  private _onPhotoLoadingStateChange(loadState: ImageLoadState) {
+    this.setState({
+      isImageLoaded: loadState === ImageLoadState.loaded
+    });
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaPresence.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaPresence.tsx
new file mode 100644
index 0000000000000..e14c1fea81115
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaPresence.tsx
@@ -0,0 +1,57 @@
+import * as React from 'react';
+import {
+  autobind,
+  css
+} from '../../Utilities';
+import { Icon } from '../../Icon';
+import {
+  IPersonaProps,
+  PersonaPresence as PersonaPresenceEnum
+} from './Persona.Props';
+import * as stylesImport from './Persona.scss';
+const styles: any = stylesImport;
+
+export class PersonaPresence extends React.Component<IPersonaProps, {}> {
+  constructor(props: IPersonaProps) {
+    super(props);
+  }
+
+  public render(): JSX.Element | null {
+    let { presence } = this.props;
+
+    if (presence === PersonaPresenceEnum.none) {
+      return null;
+    }
+
+    return (
+      <div className={ css('ms-Persona-presence', styles.presence) }>
+        <Icon className={ css('ms-Persona-presenceIcon', styles.presenceIcon) } iconName={ this._determineIcon() } />
+      </div>
+    );
+  }
+
+  @autobind
+  private _determineIcon(): string | undefined {
+    let { presence } = this.props;
+
+    if (presence !== PersonaPresenceEnum.none) {
+      let userPresence = PersonaPresenceEnum[presence as PersonaPresenceEnum];
+
+      switch (userPresence) {
+        case 'online':
+          userPresence = 'SkypeCheck';
+          break;
+        case 'away':
+          userPresence = 'SkypeClock';
+          break;
+        case 'dnd':
+          userPresence = 'SkypeMinus';
+          break;
+        default:
+          userPresence = '';
+      }
+
+      return userPresence;
+    }
+  }
+}
\ No newline at end of file

From e438cfa78495bab7de5653ae661b1d50555d5861 Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Wed, 13 Sep 2017 19:04:30 -0700
Subject: [PATCH 0637/1641] Callout: Make updatePosition async (#2827)

* Made update position async. Also fixed bug where contextualmenu submenu would sometimes have beak

* adding change file

* fixing broken contextualmenu test
---
 .../callout-async_2017-09-13-01-04.json       | 11 ++++++
 .../src/components/Callout/CalloutContent.tsx |  8 +++--
 .../ContextualMenu/ContextualMenu.test.tsx    | 36 ++++++++++++++-----
 .../ContextualMenu/ContextualMenu.tsx         |  3 +-
 scripts/tasks/webpack-resources.js            |  2 +-
 5 files changed, 47 insertions(+), 13 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/callout-async_2017-09-13-01-04.json

diff --git a/common/changes/office-ui-fabric-react/callout-async_2017-09-13-01-04.json b/common/changes/office-ui-fabric-react/callout-async_2017-09-13-01-04.json
new file mode 100644
index 0000000000000..c7a29621a0324
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/callout-async_2017-09-13-01-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Callout: Made updatePosition async. Contextualmenu: Fixed a bug where sometimes a submenu would have a beak.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index b0fe97e6a7c4c..5f5e0fd3f2ccf 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -70,7 +70,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
 
   public componentDidUpdate() {
     this._setInitialFocus();
-    this._updatePosition();
+    this._updateAsyncPosition();
   }
 
   public componentWillMount() {
@@ -246,10 +246,12 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       this.props.onLayerMounted();
     }
 
-    this._updatePosition();
+    this._updateAsyncPosition();
     this._setHeightOffsetEveryFrame();
   }
-
+  private _updateAsyncPosition() {
+    this._async.requestAnimationFrame(() => this._updatePosition());
+  }
   private _updatePosition() {
     let { positions } = this.state;
     let hostElement: HTMLElement = this._hostElement;
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
index d44de32fe343a..083c66d9b159c 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
@@ -1,7 +1,7 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
-
+import { Promise } from 'es6-promise';
 import * as ReactTestUtils from 'react-addons-test-utils';
 import {
   KeyCodes,
@@ -305,7 +305,7 @@ describe('ContextualMenu', () => {
 
   });
 
-  it('correctly focuses the first element', () => {
+  it('correctly focuses the first element', (done) => {
     const items: IContextualMenuItem[] = [
       {
         name: 'TestText 1',
@@ -324,11 +324,21 @@ describe('ContextualMenu', () => {
       />
     );
 
-    let focusedItem = document.querySelector('.testkey1')!.firstChild;
-    expect(document.activeElement).to.be.eq(focusedItem, 'The first element was not focused');
+    new Promise<any>(resolve => {
+      let focusedItem;
+      for (let i = 0; i < 20; i++) {
+        focusedItem = document.querySelector('.testkey1')!.firstChild;
+        if (focusedItem === document.activeElement) {
+          break;
+        }
+      }
+      expect(document.activeElement).to.be.eq(focusedItem, 'The first element was not focused');
+      done();
+      resolve();
+    }).catch(done());
   });
 
-  it('will not focus the first element when shouldFocusOnMount is false', () => {
+  it('will not focus the first element when shouldFocusOnMount is false', (done) => {
     const items: IContextualMenuItem[] = [
       {
         name: 'TestText 1',
@@ -344,12 +354,22 @@ describe('ContextualMenu', () => {
     ReactTestUtils.renderIntoDocument<ContextualMenu>(
       <ContextualMenu
         items={ items }
-        shouldFocusOnMount={ false }
+        shouldFocusOnMount={ true }
       />
     );
+    new Promise(resolve => {
+      let focusedItem;
+      for (let i = 0; i < 20; i++) {
+        focusedItem = document.querySelector('.testkey1')!.firstChild;
+        if (focusedItem === document.activeElement) {
+          break;
+        }
+      }
+      expect(document.activeElement).to.be.not.eq(focusedItem, 'The first element was not focused');
+      done();
+      resolve();
+    }).catch(done);
 
-    let focusedItem = document.querySelector('.testkey1')!.firstChild;
-    expect(document.activeElement).to.be.not.eq(focusedItem, 'The first element was not focused');
   });
 
   it('ContextualMenu menuOpened callback is called only when menu is available', () => {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 165512dabc4e7..f45c826bf5d96 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -592,7 +592,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
         shouldFocusOnMount: true,
         directionalHint: getRTL() ? DirectionalHint.leftTopEdge : DirectionalHint.rightTopEdge,
         className: this.props.className,
-        gapSpace: 0
+        gapSpace: 0,
+        isBeakVisible: false
       };
 
       if (item.subMenuProps) {
diff --git a/scripts/tasks/webpack-resources.js b/scripts/tasks/webpack-resources.js
index 50f89e2f3be1f..cc4e795488fd4 100644
--- a/scripts/tasks/webpack-resources.js
+++ b/scripts/tasks/webpack-resources.js
@@ -73,7 +73,7 @@ module.exports = {
       {
         devServer: {
           inline: true,
-          port: 4321,
+          port: 4322,
         },
 
         resolveLoader: {

From a71475843c34437681d9b9848861c533fc50c078 Mon Sep 17 00:00:00 2001
From: dzearing <dzearing@hotmail.com>
Date: Wed, 13 Sep 2017 20:34:31 -0700
Subject: [PATCH 0638/1641] Fixing hardcoded width of check.

---
 .../src/components/DetailsList/DetailsList.tsx                  | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 0a5b3249783d9..db5eac79cef25 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -49,7 +49,7 @@ export interface IDetailsListState {
 }
 
 const MIN_COLUMN_WIDTH = 100; // this is the global min width
-const CHECKBOX_WIDTH = 36;
+const CHECKBOX_WIDTH = 40;
 const GROUP_EXPAND_WIDTH = 36;
 const DEFAULT_INNER_PADDING = 16;
 const ISPADDED_WIDTH = 24;

From 4655cb8b3c8fc66c3514d501ad3db3f56c414432 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 14 Sep 2017 03:17:39 -0700
Subject: [PATCH 0639/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../callout-async_2017-09-13-01-04.json       | 11 -----------
 .../persona-refactor_2017-09-14-01-39.json    | 11 -----------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 10 files changed, 34 insertions(+), 29 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/callout-async_2017-09-13-01-04.json
 delete mode 100644 common/changes/office-ui-fabric-react/persona-refactor_2017-09-14-01-39.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index fde92a7514c48..9e0d55b2e0725 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -44,7 +44,7 @@
     "@uifabric/example-app-base": ">=4.2.7 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=4.46.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.46.1 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index b23b31b6c8297..abb5866e476a9 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.46.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.46.1 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 565b95799971c..7c57d60885017 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -26,7 +26,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.46.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.46.1 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 45694da1a08fd..c4b9c9290e8df 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -24,7 +24,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=4.46.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.46.1 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/callout-async_2017-09-13-01-04.json b/common/changes/office-ui-fabric-react/callout-async_2017-09-13-01-04.json
deleted file mode 100644
index c7a29621a0324..0000000000000
--- a/common/changes/office-ui-fabric-react/callout-async_2017-09-13-01-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Callout: Made updatePosition async. Contextualmenu: Fixed a bug where sometimes a submenu would have a beak.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/persona-refactor_2017-09-14-01-39.json b/common/changes/office-ui-fabric-react/persona-refactor_2017-09-14-01-39.json
deleted file mode 100644
index ac0a9cc92b79d..0000000000000
--- a/common/changes/office-ui-fabric-react/persona-refactor_2017-09-14-01-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Refactor `Persona` to extract `PersonaCoin` and `PersonaPresence` so image/status can be rendered alone without Tooltip. Added `PersonaCoin` to top level exports",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "a.erich@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 980027ad8e651..189362b375890 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/styling": ">=0.24.0 <1.0.0",
     "@uifabric/utilities": ">=4.13.1 <5.0.0",
-    "office-ui-fabric-react": ">=4.46.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.46.1 <5.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 646b578b0f69d..d85666475dc4c 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.46.1",
+      "tag": "office-ui-fabric-react_v4.46.1",
+      "date": "Thu, 14 Sep 2017 10:17:39 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "e438cfa78495bab7de5653ae661b1d50555d5861",
+            "comment": "Callout: Made updatePosition async. Contextualmenu: Fixed a bug where sometimes a submenu would have a beak."
+          },
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "bd33f70885615750558e10dfb9aca8eabe12ca1b",
+            "comment": "Refactor `Persona` to extract `PersonaCoin` and `PersonaPresence` so image/status can be rendered alone without Tooltip. Added `PersonaCoin` to top level exports"
+          }
+        ]
+      }
+    },
     {
       "version": "4.46.0",
       "tag": "office-ui-fabric-react_v4.46.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index b2a74335bdbc2..2adebbb555ecf 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 14 Sep 2017 00:34:57 GMT and should not be manually modified.
+This log was last generated on Thu, 14 Sep 2017 10:17:39 GMT and should not be manually modified.
+
+## 4.46.1
+Thu, 14 Sep 2017 10:17:39 GMT
+
+### Patches
+
+- Callout: Made updatePosition async. Contextualmenu: Fixed a bug where sometimes a submenu would have a beak.
+- Refactor `Persona` to extract `PersonaCoin` and `PersonaPresence` so image/status can be rendered alone without Tooltip. Added `PersonaCoin` to top level exports
 
 ## 4.46.0
 Thu, 14 Sep 2017 00:34:57 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 7e020ccd8d2c3..07770c8ad34b4 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.46.0",
+  "version": "4.46.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From acdbb9021ae55b63c7a72189892e62347b410090 Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Thu, 14 Sep 2017 10:47:33 -0700
Subject: [PATCH 0640/1641] Calendar: Adding week numbers to calendar (option
 property showWeekNumbers) (#2638)

* no message

* no message

* Adding support for calendar week numbers

* adding week numbers and OWA date functions

* Adding week number functionality

* Merge issue - going to grab overwritten content

* Merge completed

* Adding week numbers to calendar

* Updating week numbers

* Updating missing semicolon and "var" to "let"

* Styles approved for week numbers.  Updating styles.

* Change file

* Updating daysInMonth function.  Month numbers start at 1, not 0.

* missed merge on CalendarDay.  Merging this file.  Also updating alignment in scss file.

* Removed classname during merge by mistake

* I'm not sure why this file wasn't committed....

* Updating based on feedback

* Testing week numbers when start of week is not Sunday

* Adjusting week number calculations to include additional calculations when firstDayOfWeek is not Sunday.

* Working on week numbers function

* Adding week numbers example to example page

* Fixing build errors

* Updated PR based on feedback

* Updating PR based on feedback

* Updating comments
---
 ...-CalendarWeekNumbers_2017-08-25-21-29.json | 11 ++++
 .../src/components/Calendar/Calendar.Props.ts |  6 ++
 .../src/components/Calendar/Calendar.scss     | 41 ++++++++++++-
 .../src/components/Calendar/Calendar.tsx      |  2 +
 .../src/components/Calendar/CalendarDay.tsx   | 59 ++++++++++++++++++-
 .../src/components/Calendar/CalendarPage.tsx  |  9 +++
 .../examples/Calendar.Inline.Example.tsx      |  2 +
 .../src/utilities/dateMath/DateMath.ts        | 44 ++++++++++++++
 8 files changed, 170 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-CalendarWeekNumbers_2017-08-25-21-29.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-CalendarWeekNumbers_2017-08-25-21-29.json b/common/changes/office-ui-fabric-react/kegorr-CalendarWeekNumbers_2017-08-25-21-29.json
new file mode 100644
index 0000000000000..884590ee1c2e5
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-CalendarWeekNumbers_2017-08-25-21-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Calendar:  Adding week numbers to calendar",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
index 54bfeea234472..6cbab471eaefc 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
@@ -105,6 +105,12 @@ export interface ICalendarProps extends React.Props<Calendar> {
   */
   navigationIcons?: ICalendarIconStrings;
 
+  /**
+  * Whether the calendar should show the week number (weeks 1 to 53) before each week row
+  * @defaultvalue false
+  */
+  showWeekNumbers?: boolean;
+
   /**
   * Apply additional formating to dates, for example localized date formatting.
   */
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
index d4d44de4e6e0a..2718440d5215d 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
@@ -109,7 +109,6 @@ $Calendar-dayPicker-margin: 10px;
   }
 }
 
-
 // The days on the calendar.
 .day, .weekday {
   width: $Calendar-day;
@@ -207,6 +206,30 @@ $Calendar-dayPicker-margin: 10px;
     }
 }
 
+.showWeekNumbers{
+  .weekNumbers{
+    position: absolute;
+    margin-top: $Calendar-day;
+    border-right: 1px solid $ms-color-neutralLight;
+    box-sizing: border-box;
+    width: 30px;
+    .day{
+      color: $ms-color-neutralSecondary;
+      &.weekIsHighlighted{
+        color: $ms-color-black;
+      }
+    }
+  }
+  .table{
+    &:not(.weekNumbers){
+      margin-left: 30px;
+    }
+    .day, .weekday{
+      width: 30px;
+    }
+  }
+}
+
 // Month and year previous/next components.
 .monthComponents,.yearComponents,
 .decadeComponents {
@@ -404,6 +427,22 @@ $Calendar-dayPicker-margin: 10px;
     margin-left: 1px;
   }
 
+  .showWeekNumbers{
+    .weekNumbers{
+      margin-top: $Calendar-day;
+      width: 26px;
+      margin-left: -7px
+    }
+    .table{
+      &:not(.weekNumbers){
+        margin-left: 19px;
+      }
+      .day, .weekday{
+        width: 26px;
+      }
+    }
+  }
+
   // Show month picker, if enabled
   .monthPickerVisible {
 
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index c8047ef1121e3..98b86d809f047 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -57,6 +57,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     strings: null,
     highlightCurrentMonth: false,
     navigationIcons: iconStrings,
+    showWeekNumbers: false,
     dateTimeFormatter: dateTimeFormatterCallbacks
   };
 
@@ -150,6 +151,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   strings={ strings! }
                   onHeaderSelect={ onHeaderSelect }
                   navigationIcons={ navigationIcons! }
+                  showWeekNumbers={ this.props.showWeekNumbers }
                   dateTimeFormatter={ this.props.dateTimeFormatter! }
                   ref='dayPicker'
                 />
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index e5187ca05b6eb..24ed8605a3d98 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -19,7 +19,8 @@ import {
   compareDates,
   compareDatePart,
   getDateRangeArray,
-  isInDateRangeArray
+  isInDateRangeArray,
+  getWeekNumber
 } from '../../utilities/dateMath/DateMath';
 
 import * as stylesImport from './Calendar.scss';
@@ -51,6 +52,7 @@ export interface ICalendarDayProps extends React.Props<CalendarDay> {
   navigationIcons: ICalendarIconStrings;
   today?: Date;
   onHeaderSelect?: (focus: boolean) => void;
+  showWeekNumbers?: boolean;
   dateTimeFormatter: ICalendarFormatDateCallbacks;
 }
 
@@ -89,11 +91,13 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
 
   public render() {
     let { activeDescendantId, weeks } = this.state;
-    let { firstDayOfWeek, strings, navigatedDate, navigationIcons, dateRangeType, selectedDate, dateTimeFormatter } = this.props;
+    let { firstDayOfWeek, strings, navigatedDate, selectedDate, dateRangeType, navigationIcons, showWeekNumbers, dateTimeFormatter } = this.props;
     let dayPickerId = getId('DatePickerDay-dayPicker');
     let monthAndYearId = getId('DatePickerDay-monthAndYear');
     let leftNavigationIcon = navigationIcons.leftNavigation;
     let rightNavigationIcon = navigationIcons.rightNavigation;
+    let weekNumbers = showWeekNumbers ? this._getWeekNumbersInMonth(weeks!.length, firstDayOfWeek, navigatedDate) : null;
+    let selectedDateWeekNumber = showWeekNumbers ? getWeekNumber(selectedDate, firstDayOfWeek) : undefined;
 
     // When the month is highlighted get the corner dates so that styles can be added to them
     let weekCorners: IWeekCorners = {};
@@ -103,7 +107,13 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
     }
 
     return (
-      <div className={ css('ms-DatePicker-dayPicker', styles.dayPicker) } id={ dayPickerId }>
+      <div
+        className={ css('ms-DatePicker-dayPicker',
+          styles.dayPicker,
+          showWeekNumbers && 'ms-DatePicker-showWeekNumbers' && styles.showWeekNumbers
+        ) }
+        id={ dayPickerId }
+      >
         <div className={ css('ms-DatePicker-monthComponents', styles.monthComponents) }>
           <div className={ css('ms-DatePicker-navContainer', styles.navContainer) }>
             <span
@@ -151,6 +161,33 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
           </div>
         </div>
         <FocusZone>
+          {
+            showWeekNumbers ?
+              <table
+                className={ css('ms-DatePicker-weekNumbers', styles.weekNumbers, 'ms-DatePicker-table', styles.table) }
+              >
+                <tbody>
+                  { weekNumbers!.map((weekNumber, index) =>
+                    <tr key={ index }>
+                      <td>
+                        <div
+                          className={ css(
+                            'ms-DatePicker-day',
+                            styles.day,
+                            {
+                              ['ms-DatePicker-week--highlighted ' + styles.weekIsHighlighted]: selectedDateWeekNumber === weekNumber
+                            }
+                          ) }
+                        >
+                          <span>{ weekNumber }</span>
+                        </div>
+                      </td>
+                    </tr>
+                  ) }
+                </tbody>
+              </table>
+              : null
+          }
           <table
             className={ css('ms-DatePicker-table', styles.table) }
             aria-readonly='true'
@@ -449,4 +486,20 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
 
     return weeks;
   }
+
+  // Returns the week numbers for each week in a month.  Week numbers are 1 - 52 (53) in a year
+  private _getWeekNumbersInMonth(weeksInMonth: number, firstDayOfWeek: DayOfWeek, navigatedDate: Date) {
+    let selectedYear = navigatedDate.getFullYear();
+    let selectedMonth = navigatedDate.getMonth();
+    let firstDayOfMonth = new Date(selectedYear, selectedMonth, 1);
+
+    let firstWeekNumber = getWeekNumber(firstDayOfMonth, firstDayOfWeek);
+
+    let weeksArray = [];
+    for (let i = 0; i < weeksInMonth; i++) {
+      weeksArray.push(firstWeekNumber + i);
+    }
+
+    return weeksArray;
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
index 2bece6d1c3257..2d83adeb69371 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
@@ -60,6 +60,15 @@ export class CalendarPage extends React.Component<IComponentDemoPageProps, any>
                 showNavigateButtons={ true }
               />
             </ExampleCard>
+            <ExampleCard title='Inline Calendar with week numbers' code={ CalendarInlineExampleCode }>
+              <CalendarInlineExample
+                isMonthPickerVisible={ false }
+                dateRangeType={ DateRangeType.Day }
+                autoNavigateOnSelection={ false }
+                showGoToToday={ false }
+                showWeekNumbers={ true }
+              />
+            </ExampleCard>
             <ExampleCard title='Inline Calendar with month picker and no day picker' code={ CalendarInlineExampleCode }>
               <CalendarInlineExample
                 dateRangeType={ DateRangeType.Month }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
index e750f147d9897..21d375938ed17 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
@@ -75,6 +75,7 @@ export interface ICalendarInlineExampleProps {
   highlightCurrentMonth?: boolean;
   isDayPickerVisible?: boolean;
   showMonthPickerAsOverlay?: boolean;
+  showWeekNumbers?: boolean;
 }
 
 export class CalendarInlineExample extends React.Component<ICalendarInlineExampleProps, ICalendarInlineExampleState> {
@@ -130,6 +131,7 @@ export class CalendarInlineExample extends React.Component<ICalendarInlineExampl
           highlightCurrentMonth={ this.props.highlightCurrentMonth }
           isDayPickerVisible={ this.props.isDayPickerVisible }
           showMonthPickerAsOverlay={ this.props.showMonthPickerAsOverlay }
+          showWeekNumbers={ this.props.showWeekNumbers }
         />
         { this.props.showNavigateButtons &&
           <div>
diff --git a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
index ce35a7390df7b..711bb4fde5ceb 100644
--- a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
+++ b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
@@ -198,4 +198,48 @@ function getDatePartHashValue(date: Date) {
   /* tslint:disable:no-bitwise */
   return date.getDate() + (date.getMonth() << 5) + (date.getFullYear() << 9);
   /* tslint:enable:no-bitwise */
+}
+
+/**
+ * Returns the week number for a date.
+ * Week numbers are 1 - 52 (53) in a year
+ * @param {Date} date - A date to find the week number for.
+ * @param {DayOfWeek} firstDayOfWeek - The first day of the week (0-6, Sunday = 0)
+ * @return {Number} The week's number in the year.
+ */
+export function getWeekNumber(date: Date, firstDayOfWeek: DayOfWeek) {
+  let num = getDayOfYear(date) - 1;
+  let num2 = date.getDay() - (num % 7);
+  let num3 = ((num2 - firstDayOfWeek) + 14) % 7;
+  return Math.floor(((num + num3) / 7) + 1);
+}
+
+/**
+ * Returns the day number for a date in a year
+ * The number of days since January 1st in the particular year.
+ * @param {Date} date - A date to find the day number for.
+ * @return {Number} The day's number in the year.
+ */
+function getDayOfYear(date: Date) {
+  let month = date.getMonth();
+  let year = date.getFullYear();
+  let daysUntilDate = 0;
+
+  for (let i = 0; i < month; i++) {
+    daysUntilDate += daysInMonth((i + 1), year);
+  }
+
+  daysUntilDate += date.getDate();
+
+  return daysUntilDate;
+}
+
+/**
+ * Returns the number of days in the month
+ * @param {number} month - The month number to target (months 1-12).
+ * @param {number} year - The year to target.
+ * @return {Number} The number of days in the month.
+ */
+function daysInMonth(month: number, year: number) {
+  return new Date(year, month, 0).getDate();
 }
\ No newline at end of file

From 14202292db345d3c736f805186de469a016b7675 Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Thu, 14 Sep 2017 14:43:06 -0700
Subject: [PATCH 0641/1641] DatePicker: Updated calendar icon interactivity
 (#2842)

* no message

* no message

* Testing fix for this bug

* When using text input hovering on Calendar should show pointer and not text-input cursor.
Adding interactable calendar icon in date picker.

* Change file
---
 ...tePicker-HoverInteractionBug_2017-09-13-23-11.json | 11 +++++++++++
 .../src/components/DatePicker/DatePicker.scss         |  2 ++
 .../src/components/DatePicker/DatePicker.tsx          |  7 +++++++
 .../src/components/Icon/Icon.Props.ts                 |  5 +++++
 .../src/components/Icon/Icon.tsx                      |  3 +++
 5 files changed, 28 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-DatePicker-HoverInteractionBug_2017-09-13-23-11.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-DatePicker-HoverInteractionBug_2017-09-13-23-11.json b/common/changes/office-ui-fabric-react/kegorr-DatePicker-HoverInteractionBug_2017-09-13-23-11.json
new file mode 100644
index 0000000000000..528ccbf1250ac
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-DatePicker-HoverInteractionBug_2017-09-13-23-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DatePicker: Hovering over calendar icon in text input does not change cursor to pointer.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss
index a7b29764025c0..1573b658d9741 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss
@@ -35,6 +35,8 @@
 // Insert a calendar icon over the date field.
 .eventWithLabel {
   @include ms-DatePicker-event();
+  pointer-events: initial;
+  cursor: pointer;
   bottom:5px;
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 2a61d49c327d8..98b081df47ffc 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -198,6 +198,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
             borderless={ borderless }
             iconProps={ {
               iconName: 'Calendar',
+              onClicked: this._onIconClick,
               className: css(
                 label ? 'ms-DatePicker-event--with-label' : 'ms-DatePicker-event--without-label',
                 label ? styles.eventWithLabel : styles.eventWithoutLabel
@@ -332,6 +333,12 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     }
   }
 
+  @autobind
+  private _onIconClick(ev: React.MouseEvent<HTMLElement>) {
+    ev.stopPropagation();
+    this._onTextFieldClick(ev);
+  }
+
   private _showDatePickerPopup() {
     if (!this.state.isDatePickerShown) {
       this._preventFocusOpeningPicker = true;
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts b/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
index 2c4e67fa6e2b6..d02c9cdc90b35 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
@@ -64,4 +64,9 @@ export interface IIconProps extends React.HTMLAttributes<HTMLElement> {
    * @memberOf IIconProps
    */
   imageProps?: IImageProps;
+
+  /**
+   * Callback for the onClick event.
+   */
+  onClicked?: (ev: React.MouseEvent<HTMLElement>) => void;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
index e6631889c1497..0541e5e3dbf8a 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
@@ -16,9 +16,11 @@ export const Icon = (props: IIconProps): JSX.Element => {
   let {
     ariaLabel,
     className,
+    onClicked,
     styles: customStyles,
     iconName
    } = props;
+
   let styles = getStyles(undefined, customStyles);
 
   if (props.iconType === IconType.image || props.iconType === IconType.Image) {
@@ -59,6 +61,7 @@ export const Icon = (props: IIconProps): JSX.Element => {
             styles.root,
             props.className
           ) }
+        onClick={ onClicked }
       >
         { (IconCodes as any)[iconMemberName] }
       </i>

From 7f6604ebb63d8b420c6d92de4f70c60872a62c5f Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Thu, 14 Sep 2017 21:34:31 -0700
Subject: [PATCH 0642/1641] Prevent touch input from starting a Marquee
 Selection (#2860)

* Prevent marquee selection from triggering on Touch events

* Update change output
---
 .../touch-marquee_2017-09-14-23-42.json       | 11 ++++++
 .../MarqueeSelection/MarqueeSelection.tsx     | 37 ++++++++++++++++++-
 2 files changed, 46 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/touch-marquee_2017-09-14-23-42.json

diff --git a/common/changes/office-ui-fabric-react/touch-marquee_2017-09-14-23-42.json b/common/changes/office-ui-fabric-react/touch-marquee_2017-09-14-23-42.json
new file mode 100644
index 0000000000000..dfa83d59a917e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/touch-marquee_2017-09-14-23-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Prevent touch events from triggering marquee selection",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
index aa70b9789547a..b03c183cfabf6 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
@@ -50,6 +50,7 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
   private _scrollableParent: HTMLElement;
   private _scrollableSurface: HTMLElement;
   private _scrollTop: number;
+  private _isTouch: boolean;
 
   constructor(props: IMarqueeSelectionProps) {
     super(props);
@@ -64,10 +65,22 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
     this._scrollableSurface = this._scrollableParent === window as any ? document.body : this._scrollableParent;
     // When scroll events come from window, we need to read scrollTop values from the body.
 
+    const hitTarget = this.props.isDraggingConstrainedToRoot ? this.refs.root : this._scrollableSurface;
+
     this._events.on(
-      this.props.isDraggingConstrainedToRoot ? this.refs.root : this._scrollableSurface,
+      hitTarget,
       'mousedown',
       this._onMouseDown);
+    this._events.on(
+      hitTarget,
+      'touchstart',
+      this._onTouchStart,
+      true);
+    this._events.on(
+      hitTarget,
+      'pointerdown',
+      this._onPointerDown,
+      true);
   }
 
   public componentWillUnmount() {
@@ -149,7 +162,7 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
       return;
     }
 
-    if (isEnabled && !this._isDragStartInSelection(ev) && (!onShouldStartSelection || onShouldStartSelection(ev))) {
+    if (!this._isTouch && isEnabled && !this._isDragStartInSelection(ev) && (!onShouldStartSelection || onShouldStartSelection(ev))) {
       if (this._scrollableSurface && ev.button === 0) {
         this._selectedIndicies = {};
         this._events.on(window, 'mousemove', this._onAsyncMouseMove);
@@ -165,6 +178,26 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
     }
   }
 
+  @autobind
+  private _onTouchStart(ev: TouchEvent) {
+    this._isTouch = true;
+
+    this._async.setTimeout(() => {
+      this._isTouch = false;
+    }, 0);
+  }
+
+  @autobind
+  private _onPointerDown(ev: PointerEvent) {
+    if (ev.pointerType === 'touch') {
+      this._isTouch = true;
+
+      this._async.setTimeout(() => {
+        this._isTouch = false;
+      }, 0);
+    }
+  }
+
   private _getRootRect(): IRectangle {
     return {
       left: this._rootRect.left,

From 72545f3da76a593c6787e7cb1d55a99008005991 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Thu, 14 Sep 2017 21:41:44 -0700
Subject: [PATCH 0643/1641] Primary split button (#2845)

* SplitButton: fixed primary styles

* change file

* Update Button.Split.Example.tsx
---
 ...primary-split-button_2017-09-14-16-39.json | 11 +++
 .../src/components/Button/ButtonThemes.ts     | 87 ++++++++++++++++++-
 .../Button/SplitButton/SplitButton.styles.ts  | 34 +-------
 .../Button/examples/Button.Basic.Example.scss |  3 +
 .../examples/Button.Default.Example.tsx       |  2 +-
 .../Button/examples/Button.Split.Example.tsx  | 78 +++++++++++------
 6 files changed, 157 insertions(+), 58 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/primary-split-button_2017-09-14-16-39.json

diff --git a/common/changes/office-ui-fabric-react/primary-split-button_2017-09-14-16-39.json b/common/changes/office-ui-fabric-react/primary-split-button_2017-09-14-16-39.json
new file mode 100644
index 0000000000000..c74c1490a5177
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/primary-split-button_2017-09-14-16-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SplitButton: Fixed primary theme, updated documentation",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts b/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
index eb63b24fe3f9f..81a43009ea5d5 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
@@ -27,6 +27,47 @@ export function standardStyles(theme: ITheme): IButtonStyles {
       backgroundColor: theme.palette.neutralTertiaryAlt,
       color: theme.palette.neutralDark
     },
+
+    // Split button styles
+    splitButtonContainer: {
+      ':hover': {
+        borderColor: theme.palette.neutralLight
+      },
+      ':focus': {
+        borderColor: theme.palette.neutralDark
+      }
+    },
+
+    splitButtonMenuButton: {
+      color: theme.palette.white,
+      backgroundColor: theme.palette.neutralLighter,
+      ':hover': {
+        backgroundColor: theme.palette.neutralLight
+      },
+    },
+
+    splitButtonMenuButtonDisabled: {
+      backgroundColor: theme.palette.neutralLighter,
+      ':hover': {
+        backgroundColor: theme.palette.neutralLighter,
+      }
+    },
+
+    splitButtonMenuButtonChecked: {
+      backgroundColor: theme.palette.themePrimary,
+    },
+
+    splitButtonMenuButtonExpanded: {
+      backgroundColor: theme.palette.neutralLight,
+    },
+
+    splitButtonMenuIcon: {
+      color: theme.palette.neutralPrimary
+    },
+
+    splitButtonMenuIconDisabled: {
+      color: theme.palette.neutralTertiary
+    },
   };
 }
 
@@ -48,7 +89,7 @@ export function primaryStyles(theme: ITheme): IButtonStyles {
     },
 
     rootExpanded: {
-      backgroundColor: theme.palette.themePrimary,
+      backgroundColor: theme.palette.themeDark,
       color: theme.palette.white
     },
 
@@ -60,6 +101,48 @@ export function primaryStyles(theme: ITheme): IButtonStyles {
     rootCheckedHovered: {
       backgroundColor: theme.palette.neutralLight,
       color: theme.palette.black
-    }
+    },
+
+    // Split button styles
+    splitButtonContainer: {
+      ':hover': {
+        borderColor: theme.palette.neutralLight
+      },
+      ':focus': {
+        borderColor: theme.palette.neutralDark
+      }
+    },
+
+    splitButtonMenuButton: {
+      backgroundColor: theme.palette.themePrimary,
+      color: theme.palette.white,
+      ':hover': {
+        backgroundColor: theme.palette.themeDark
+      },
+    },
+
+    splitButtonMenuButtonDisabled: {
+      backgroundColor: theme.palette.neutralLighter,
+      ':hover': {
+        backgroundColor: theme.palette.neutralLighter,
+      }
+    },
+
+    splitButtonMenuButtonChecked: {
+      backgroundColor: theme.palette.themeDark,
+    },
+
+    splitButtonMenuButtonExpanded: {
+      backgroundColor: theme.palette.themeDark,
+    },
+
+    splitButtonMenuIcon: {
+      color: theme.palette.white
+    },
+
+    splitButtonMenuIconDisabled: {
+      color: theme.palette.neutralTertiary
+    },
+
   };
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
index f613dce8686f5..e8d4d397c5adf 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
@@ -15,54 +15,35 @@ export const getStyles = memoizeFunction((
       display: 'inline-block',
       border: '1px solid transparent',
       ':hover': {
-        border: '1px solid',
-        borderColor: theme.palette.neutralLight
+        border: '1px solid'
       },
       ':focus': {
         outline: 'none!important',
-        border: '1px solid',
-        borderColor: theme.palette.neutralDark
+        border: '1px solid'
       }
     },
 
-    splitButtonContainerDisabled: {
-    },
-
     splitButtonMenuButton: {
       padding: '6px',
       height: 'auto',
-      color: theme.palette.white,
       boxSizing: 'border-box',
       border: '1px solid transparent',
+      outline: 'transparent',
       userSelect: 'none',
       display: 'inline-block',
       textDecoration: 'none',
       textAlign: 'center',
       cursor: 'pointer',
       verticalAlign: 'top',
-      width: '32px',
-      backgroundColor: theme.palette.neutralLighter,
-      ':hover': {
-        backgroundColor: theme.palette.neutralLight
-      },
+      width: '32px'
     },
 
     splitButtonMenuButtonDisabled: {
-      backgroundColor: theme.palette.neutralLighter,
       ':hover': {
-        backgroundColor: theme.palette.neutralLighter,
         cursor: 'default'
       }
     },
 
-    splitButtonMenuIcon: {
-      color: theme.palette.neutralPrimary
-    },
-
-    splitButtonMenuIconDisabled: {
-      color: theme.palette.neutralTertiary
-    },
-
     splitButtonFlexContainer: {
       display: 'flex',
       height: '100%',
@@ -70,13 +51,6 @@ export const getStyles = memoizeFunction((
       justifyContent: 'center',
       alignItems: 'center'
     },
-    splitButtonMenuButtonChecked: {
-      backgroundColor: theme.palette.themePrimary,
-    },
-
-    splitButtonMenuButtonExpanded: {
-      backgroundColor: theme.palette.neutralLight,
-    },
   };
 
   return mergeStyleSets(splitButtonStyles, customStyles)!;
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Basic.Example.scss b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Basic.Example.scss
index 7ac8403fca70e..748891141c6c0 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Basic.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Basic.Example.scss
@@ -7,5 +7,8 @@
     & > * {
       flex-grow: 1;
     }
+    .ms-Label {
+      margin-bottom: 10px;
+    }
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
index 8177424c463cd..ddd8004c2f64f 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
@@ -7,7 +7,7 @@ export class ButtonDefaultExample extends React.Component<IButtonProps, {}> {
     let { disabled, checked } = this.props;
 
     return (
-      <div className='ms-BasicButtonsExample ms-BasicButtonsTwoUp'>
+      <div className='ms-BasicButtonsTwoUp'>
         <div>
           <Label>Standard</Label>
           <DefaultButton
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
index 4f235f9022131..be8c8913514b1 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
@@ -12,30 +12,58 @@ export class ButtonSplitExample extends React.Component<IButtonProps, {}> {
     let { disabled, checked } = this.props;
 
     return (
-      <div>
-        <Label>Split button</Label>
-        <DefaultButton
-          data-automation-id='test'
-          disabled={ disabled }
-          checked={ checked }
-          text='Create account'
-          onClick={ () => alert('Clicked') }
-          split={ true }
-          menuProps={ {
-            items: [
-              {
-                key: 'emailMessage',
-                name: 'Email message',
-                icon: 'Mail'
-              },
-              {
-                key: 'calendarEvent',
-                name: 'Calendar event',
-                icon: 'Calendar'
-              }
-            ]
-          } }
-        />
+      <div className='ms-BasicButtonsTwoUp'>
+        <div>
+          <Label>Standard</Label>
+          <DefaultButton
+            data-automation-id='test'
+            disabled={ disabled }
+            checked={ checked }
+            text='Create account'
+            onClick={ () => alert('Clicked') }
+            split={ true }
+            menuProps={ {
+              items: [
+                {
+                  key: 'emailMessage',
+                  name: 'Email message',
+                  icon: 'Mail'
+                },
+                {
+                  key: 'calendarEvent',
+                  name: 'Calendar event',
+                  icon: 'Calendar'
+                }
+              ]
+            } }
+          />
+        </div>
+        <div>
+          <Label>Primary</Label>
+          <DefaultButton
+            primary
+            data-automation-id='test'
+            disabled={ disabled }
+            checked={ checked }
+            text='Create account'
+            onClick={ () => alert('Clicked') }
+            split={ true }
+            menuProps={ {
+              items: [
+                {
+                  key: 'emailMessage',
+                  name: 'Email message',
+                  icon: 'Mail'
+                },
+                {
+                  key: 'calendarEvent',
+                  name: 'Calendar event',
+                  icon: 'Calendar'
+                }
+              ]
+            } }
+          />
+        </div>
       </div>
     );
   }
@@ -80,4 +108,4 @@ export class ButtonSplitCustomExample extends React.Component<IButtonProps, {}>
       </div>
     );
   }
-}
\ No newline at end of file
+}

From 632ffffa9863e0ab4f0546681d63fda1e4bfdaf0 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Thu, 14 Sep 2017 21:49:08 -0700
Subject: [PATCH 0644/1641] Add shadows to folder covers [experiments] (#2855)

* Add folder cover shadows

* Fix display type of tile cover frame

* Add folder shadows to Tile example

* Update change output
---
 .../folder-shadows_2017-09-14-23-43.json      | 11 ++++++++
 .../components/FolderCover/FolderCover.scss   | 28 ++++++++++++-------
 .../components/FolderCover/FolderCover.tsx    | 13 ++++++++-
 .../experiments/src/components/Tile/Tile.scss |  1 +
 .../Tile/examples/Tile.Example.scss           |  4 +++
 .../Tile/examples/Tile.Folder.Example.tsx     | 20 +++++++------
 6 files changed, 58 insertions(+), 19 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/folder-shadows_2017-09-14-23-43.json

diff --git a/common/changes/@uifabric/experiments/folder-shadows_2017-09-14-23-43.json b/common/changes/@uifabric/experiments/folder-shadows_2017-09-14-23-43.json
new file mode 100644
index 0000000000000..6d9454365d63b
--- /dev/null
+++ b/common/changes/@uifabric/experiments/folder-shadows_2017-09-14-23-43.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Add folder cover shadows",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.scss b/packages/experiments/src/components/FolderCover/FolderCover.scss
index e63124837348b..1d4af68f0eb72 100644
--- a/packages/experiments/src/components/FolderCover/FolderCover.scss
+++ b/packages/experiments/src/components/FolderCover/FolderCover.scss
@@ -20,6 +20,14 @@
   }
 }
 
+.shadow {
+  display: block;
+  position: absolute;
+  left: -3px;
+  right: -3px;
+  bottom: -4px;
+}
+
 .front {
   display: block;
   position: absolute;
@@ -41,11 +49,11 @@
   left: 4px;
   right: 4px;
   bottom: 4px;
+  top: 4px;
   display: flex;
   flex-direction: column;
   align-items: center;
-  overflow: hidden;
-  box-shadow: 0 1px 3px 1px rgba(1, 1, 0, 0.05);
+  justify-content: center;
   opacity: 1;
 
   transition: opacity 0.2s linear;
@@ -53,15 +61,15 @@
   .hideContent & {
     opacity: 0;
   }
+}
 
-  &,
-  .isSmall & {
-    max-height: 52px - 8px;
-  }
-
-  .isLarge & {
-    max-height: 80px - 8px;
-  }
+.frame {
+  display: inline-block;
+  position: relative;
+  overflow: hidden;
+  max-width: 100%;
+  max-height: 100%;
+  box-shadow: 0 1px 3px 2px rgba(1, 1, 0, 0.2);
 }
 
 .metadata {
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.tsx b/packages/experiments/src/components/FolderCover/FolderCover.tsx
index bf455709830e9..20a9c8164712d 100644
--- a/packages/experiments/src/components/FolderCover/FolderCover.tsx
+++ b/packages/experiments/src/components/FolderCover/FolderCover.tsx
@@ -41,6 +41,7 @@ const SIZES: {
 const ASSETS: {
   [P in FolderCoverSize]: {
     [T in FolderCoverType]: {
+      shadow: string;
       back: string;
       front: string;
     };
@@ -48,20 +49,24 @@ const ASSETS: {
 } = {
     small: {
       default: {
+        shadow: `${ASSET_CDN_BASE_URL}/foldericons/72x52_shadow_empty.png`,
         back: `${ASSET_CDN_BASE_URL}/foldericons/s-ldefaultback.png`,
         front: `${ASSET_CDN_BASE_URL}/foldericons/s-ldefaultfront.png`
       },
       media: {
+        shadow: `${ASSET_CDN_BASE_URL}/foldericons/72x52_shadow_empty.png`,
         back: `${ASSET_CDN_BASE_URL}/foldericons/s-lphotoback.png`,
         front: `${ASSET_CDN_BASE_URL}/foldericons/s-lphotosfront.png`
       }
     },
     large: {
       default: {
+        shadow: `${ASSET_CDN_BASE_URL}/foldericons/112x80_shadow_empty.png`,
         back: `${ASSET_CDN_BASE_URL}/foldericons/xxxxl-xldefaultback.png`,
         front: `${ASSET_CDN_BASE_URL}/foldericons/xxxxl-xldefaultfront.png`
       },
       media: {
+        shadow: `${ASSET_CDN_BASE_URL}/foldericons/112x80_shadow_empty.png`,
         back: `${ASSET_CDN_BASE_URL}/foldericons/xxxxl-xlphotoback.png`,
         front: `${ASSET_CDN_BASE_URL}/foldericons/xxxxl-xlphotofront.png`
       }
@@ -88,6 +93,10 @@ export class FolderCover extends React.Component<IFolderCoverProps, IFolderCover
           [`ms-FolderCover--hideContent ${FolderCoverStyles.hideContent}`]: hideContent
         }) }
       >
+        <img
+          className={ css('ms-FolderCover-shadow', FolderCoverStyles.shadow) }
+          src={ assets.shadow }
+        />
         <img
           className={ css('ms-FolderCover-back', FolderCoverStyles.back) }
           src={ assets.back }
@@ -95,7 +104,9 @@ export class FolderCover extends React.Component<IFolderCoverProps, IFolderCover
         {
           this.props.children ? (
             <span className={ css('ms-FolderCover-content', FolderCoverStyles.content) }>
-              { this.props.children }
+              <span className={ css('ms-FolderCover-frame', FolderCoverStyles.frame) }>
+                { this.props.children }
+              </span>
             </span>
           ) : null
         }
diff --git a/packages/experiments/src/components/Tile/Tile.scss b/packages/experiments/src/components/Tile/Tile.scss
index 80c3a53a45dfd..0777c1b7a76a9 100644
--- a/packages/experiments/src/components/Tile/Tile.scss
+++ b/packages/experiments/src/components/Tile/Tile.scss
@@ -95,6 +95,7 @@
 }
 
 .foreground {
+  display: inline-block;
   position: relative;
   overflow: hidden;
   max-width: 100%;
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Example.scss b/packages/experiments/src/components/Tile/examples/Tile.Example.scss
index 63ef84b1424c7..1d7a5954af3d0 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Example.scss
+++ b/packages/experiments/src/components/Tile/examples/Tile.Example.scss
@@ -15,6 +15,10 @@
   height: 171px;
 }
 
+.tileFolder {
+  display: inline-block;
+  margin: 3px;
+}
 
 .tileImage {
   display: block;
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
index 716fe3d67408f..73d582fcf6e6f 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
@@ -86,14 +86,18 @@ const FolderTileWithThumbnail: React.StatelessComponent<IFolderTileWithThumbnail
             </SignalField>
           }
           foreground={
-            renderFolderCoverWithLayout(folderCover, {
-              children: (
-                <img
-                  src={ `//placehold.it/${Math.round(imageSize.width)}x${Math.round(imageSize.height)}` }
-                  className={ css(TileExampleStyles.tileImage) }
-                />
-              )
-            })
+            <span className={ css(TileExampleStylesModule.tileFolder) }>
+              {
+                renderFolderCoverWithLayout(folderCover, {
+                  children: (
+                    <img
+                      src={ `//placehold.it/${Math.round(imageSize.width)}x${Math.round(imageSize.height)}` }
+                      className={ css(TileExampleStyles.tileImage) }
+                    />
+                  )
+                })
+              }
+            </span>
           }
         />
       </div>

From 939fa2b1b7126309d51b53017e95c0e3ee28652c Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 15 Sep 2017 10:19:50 +0000
Subject: [PATCH 0645/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../folder-shadows_2017-09-14-23-43.json      | 11 -------
 ...-CalendarWeekNumbers_2017-08-25-21-29.json | 11 -------
 ...-HoverInteractionBug_2017-09-13-23-11.json | 11 -------
 ...primary-split-button_2017-09-14-16-39.json | 11 -------
 .../touch-marquee_2017-09-14-23-42.json       | 11 -------
 packages/experiments/CHANGELOG.json           | 19 ++++++++++++
 packages/experiments/CHANGELOG.md             |  9 +++++-
 packages/experiments/package.json             |  4 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 31 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 ++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 15 files changed, 79 insertions(+), 64 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/folder-shadows_2017-09-14-23-43.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-CalendarWeekNumbers_2017-08-25-21-29.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-DatePicker-HoverInteractionBug_2017-09-13-23-11.json
 delete mode 100644 common/changes/office-ui-fabric-react/primary-split-button_2017-09-14-16-39.json
 delete mode 100644 common/changes/office-ui-fabric-react/touch-marquee_2017-09-14-23-42.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 9e0d55b2e0725..2b06ce6abbb01 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -44,7 +44,7 @@
     "@uifabric/example-app-base": ">=4.2.7 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=4.46.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.47.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index abb5866e476a9..8e18dbce9078e 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.46.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.47.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 7c57d60885017..c0bdfe861b0f1 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -26,7 +26,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.46.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.47.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index c4b9c9290e8df..cbc4344df2a27 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -24,7 +24,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=4.46.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.47.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/experiments/folder-shadows_2017-09-14-23-43.json b/common/changes/@uifabric/experiments/folder-shadows_2017-09-14-23-43.json
deleted file mode 100644
index 6d9454365d63b..0000000000000
--- a/common/changes/@uifabric/experiments/folder-shadows_2017-09-14-23-43.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Add folder cover shadows",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kegorr-CalendarWeekNumbers_2017-08-25-21-29.json b/common/changes/office-ui-fabric-react/kegorr-CalendarWeekNumbers_2017-08-25-21-29.json
deleted file mode 100644
index 884590ee1c2e5..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-CalendarWeekNumbers_2017-08-25-21-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Calendar:  Adding week numbers to calendar",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kegorr-DatePicker-HoverInteractionBug_2017-09-13-23-11.json b/common/changes/office-ui-fabric-react/kegorr-DatePicker-HoverInteractionBug_2017-09-13-23-11.json
deleted file mode 100644
index 528ccbf1250ac..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-DatePicker-HoverInteractionBug_2017-09-13-23-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DatePicker: Hovering over calendar icon in text input does not change cursor to pointer.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/primary-split-button_2017-09-14-16-39.json b/common/changes/office-ui-fabric-react/primary-split-button_2017-09-14-16-39.json
deleted file mode 100644
index c74c1490a5177..0000000000000
--- a/common/changes/office-ui-fabric-react/primary-split-button_2017-09-14-16-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SplitButton: Fixed primary theme, updated documentation",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/touch-marquee_2017-09-14-23-42.json b/common/changes/office-ui-fabric-react/touch-marquee_2017-09-14-23-42.json
deleted file mode 100644
index dfa83d59a917e..0000000000000
--- a/common/changes/office-ui-fabric-react/touch-marquee_2017-09-14-23-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Prevent touch events from triggering marquee selection",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index bbbd829c1b738..6e2edc1e41c9b 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "0.7.1",
+      "tag": "@uifabric/experiments_v0.7.1",
+      "date": "Fri, 15 Sep 2017 10:19:50 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "632ffffa9863e0ab4f0546681d63fda1e4bfdaf0",
+            "comment": "Add folder cover shadows"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.46.1 <5.0.0` to `>=4.47.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.7.0",
       "tag": "@uifabric/experiments_v0.7.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 1beb825f6e3de..1299e77e71ed5 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Thu, 14 Sep 2017 00:34:57 GMT and should not be manually modified.
+This log was last generated on Fri, 15 Sep 2017 10:19:50 GMT and should not be manually modified.
+
+## 0.7.1
+Fri, 15 Sep 2017 10:19:50 GMT
+
+### Patches
+
+- Add folder cover shadows
 
 ## 0.7.0
 Thu, 14 Sep 2017 00:34:57 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 189362b375890..99578c06a4ea0 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "0.7.0",
+  "version": "0.7.1",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,7 +43,7 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/styling": ">=0.24.0 <1.0.0",
     "@uifabric/utilities": ">=4.13.1 <5.0.0",
-    "office-ui-fabric-react": ">=4.46.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.47.0 <5.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index d85666475dc4c..dbee94f791b09 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,37 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.47.0",
+      "tag": "office-ui-fabric-react_v4.47.0",
+      "date": "Fri, 15 Sep 2017 10:19:50 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "acdbb9021ae55b63c7a72189892e62347b410090",
+            "comment": "Calendar:  Adding week numbers to calendar"
+          },
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "14202292db345d3c736f805186de469a016b7675",
+            "comment": "DatePicker: Hovering over calendar icon in text input does not change cursor to pointer."
+          }
+        ],
+        "patch": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "72545f3da76a593c6787e7cb1d55a99008005991",
+            "comment": "SplitButton: Fixed primary theme, updated documentation"
+          },
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "7f6604ebb63d8b420c6d92de4f70c60872a62c5f",
+            "comment": "Prevent touch events from triggering marquee selection"
+          }
+        ]
+      }
+    },
     {
       "version": "4.46.1",
       "tag": "office-ui-fabric-react_v4.46.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 2adebbb555ecf..c69ecb197b8b9 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 14 Sep 2017 10:17:39 GMT and should not be manually modified.
+This log was last generated on Fri, 15 Sep 2017 10:19:50 GMT and should not be manually modified.
+
+## 4.47.0
+Fri, 15 Sep 2017 10:19:50 GMT
+
+### Minor changes
+
+- Calendar:  Adding week numbers to calendar
+- DatePicker: Hovering over calendar icon in text input does not change cursor to pointer.
+
+### Patches
+
+- SplitButton: Fixed primary theme, updated documentation
+- Prevent touch events from triggering marquee selection
 
 ## 4.46.1
 Thu, 14 Sep 2017 10:17:39 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 07770c8ad34b4..840b99fb8f781 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.46.1",
+  "version": "4.47.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From ed78bd102529ecb5dc0500aaadd720a3b95e2a71 Mon Sep 17 00:00:00 2001
From: dmarcey <demarcey@microsoft.com>
Date: Fri, 15 Sep 2017 14:28:20 -0400
Subject: [PATCH 0646/1641] =?UTF-8?q?Allow=20consumers=20of=20onItemContex?=
 =?UTF-8?q?tualMenu=20a=20way=20to=20stop=20ev.preventDefau=E2=80=A6=20(#2?=
 =?UTF-8?q?836)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Allow consumers of onItemContextualMenu a way to stop ev.preventDefault from being called.

* Added change file.

* Only skip preventing default if true is returned by onItemContextMenu

* Adding missing !.
---
 ...marcey-onItemPreventDefault_2017-09-13-18-07.json | 11 +++++++++++
 .../src/components/DetailsList/DetailsList.Props.ts  |  4 ++--
 .../examples/DetailsList.Advanced.Example.tsx        |  5 ++++-
 .../src/utilities/selection/SelectionZone.tsx        | 12 +++++++++---
 4 files changed, 26 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-demarcey-onItemPreventDefault_2017-09-13-18-07.json

diff --git a/common/changes/office-ui-fabric-react/users-demarcey-onItemPreventDefault_2017-09-13-18-07.json b/common/changes/office-ui-fabric-react/users-demarcey-onItemPreventDefault_2017-09-13-18-07.json
new file mode 100644
index 0000000000000..ab2e2be25fdf7
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-demarcey-onItemPreventDefault_2017-09-13-18-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Allow onItemContextMenu a way to cancel preventDefault() call.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "demarcey@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
index 71f1c9d01155a..4169ecc777f92 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
@@ -118,8 +118,8 @@ export interface IDetailsListProps extends React.Props<DetailsList>, IWithViewpo
   /** Callback for when a given row has been invoked (by pressing enter while it is selected.) */
   onItemInvoked?: (item?: any, index?: number, ev?: Event) => void;
 
-  /** Callback for when the context menu of an item has been accessed. */
-  onItemContextMenu?: (item?: any, index?: number, ev?: Event) => void;
+  /** Callback for when the context menu of an item has been accessed. If undefined or false are returned, ev.preventDefault() will be called.*/
+  onItemContextMenu?: (item?: any, index?: number, ev?: Event) => void | boolean;
 
   /**
    *  If provided, will allow the caller to override the default row rendering.
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
index f29cc2307b8ef..4b0409924d9bc 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
@@ -448,7 +448,10 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
   }
 
   @autobind
-  private _onItemContextMenu(item: any, index: number) {
+  private _onItemContextMenu(item: any, index: number, ev: MouseEvent) {
+    if ((ev.target as HTMLElement).nodeName === 'A') {
+      return true;
+    }
     console.log('Item context menu invoked', item, index);
   }
 
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
index 5115f4e37dac1..163534d1b8b4a 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
@@ -47,7 +47,7 @@ export interface ISelectionZoneProps extends React.Props<SelectionZone> {
   selectionPreservedOnEmptyClick?: boolean;
   isSelectedOnFocus?: boolean;
   onItemInvoked?: (item?: any, index?: number, ev?: Event) => void;
-  onItemContextMenu?: (item?: any, index?: number, ev?: Event) => void;
+  onItemContextMenu?: (item?: any, index?: number, ev?: Event) => void | boolean;
 }
 
 export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
@@ -227,8 +227,14 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
 
       if (itemRoot) {
         const index = this._getItemIndex(itemRoot);
-        onItemContextMenu(selection.getItems()[index], index, ev.nativeEvent);
-        ev.preventDefault();
+        const skipPreventDefault = onItemContextMenu(selection.getItems()[index], index, ev.nativeEvent);
+
+        // In order to keep back compat, if the value here is undefined, then we should still
+        // call preventDefault(). Only in the case where true is explicitly returned should
+        // the call be skipped.
+        if (!skipPreventDefault) {
+          ev.preventDefault();
+        }
       }
     }
   }

From 77bf0179913877383f87dbe5eb4c200f3cf67dcd Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Fri, 15 Sep 2017 13:42:11 -0700
Subject: [PATCH 0647/1641] DatePicker-vertical scroll bug (#2859)

* no message

* no message

* Fixing vertical scroll issue when go to today button is present in certain scenarios

* Change file
---
 ...er-verticalScrollBug_2017-09-15-01-03.json | 11 ++++++++++
 .../src/components/Calendar/Calendar.scss     | 21 ++++++++++++++++---
 .../src/components/Calendar/Calendar.tsx      |  3 ++-
 3 files changed, 31 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-DatePicker-verticalScrollBug_2017-09-15-01-03.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-DatePicker-verticalScrollBug_2017-09-15-01-03.json b/common/changes/office-ui-fabric-react/kegorr-DatePicker-verticalScrollBug_2017-09-15-01-03.json
new file mode 100644
index 0000000000000..46104b013438e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-DatePicker-verticalScrollBug_2017-09-15-01-03.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DatePicker-fixing vertical scrollbar bug",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
index 2718440d5215d..51797c1c5328d 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
@@ -376,7 +376,7 @@ $Calendar-dayPicker-margin: 10px;
   $Calendar-month: 40px;
 
   .wrap {
-    padding: 4px 8px;
+    padding: 9px 8px;
   }
   // Update the spacing and text for the day and month pickers
 
@@ -414,7 +414,7 @@ $Calendar-dayPicker-margin: 10px;
 
   .holder {
     width: 212px;
-    height: 240px;
+    height: auto;
   }
 
   .monthAndYear,
@@ -427,6 +427,10 @@ $Calendar-dayPicker-margin: 10px;
     margin-left: 1px;
   }
 
+  .goToday {
+    padding: 0 3px;
+  }
+
   .showWeekNumbers{
     .weekNumbers{
       margin-top: $Calendar-day;
@@ -447,7 +451,7 @@ $Calendar-dayPicker-margin: 10px;
   .monthPickerVisible {
 
     .wrap {
-      padding: 4px 10px;
+      padding: 10px;
     }
 
     // Swap margin for padding so that the border extends the full height.
@@ -563,6 +567,7 @@ $Calendar-dayPicker-margin: 10px;
 
     .goToday {
       @include ms-right(13px);
+      padding: 0 10px;
     }
   }
 
@@ -572,6 +577,16 @@ $Calendar-dayPicker-margin: 10px;
       padding: 10px;
     }
   }
+
+  .monthPickerAsOverlay{
+    .wrap {
+      padding-top: 4px;
+      padding-bottom: 4px;
+    }
+    .holder{
+      height: 240px;
+    }
+  }
 }
 
 // On smaller screens the month button toggles to the picking months state.
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index 98b86d809f047..11d6f7a676566 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -132,7 +132,8 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
             styles.pickerIsFocused,
             isMonthPickerVisible && ('ms-DatePicker-monthPickerVisible ' + styles.monthPickerVisible),
             isMonthPickerVisible && isDayPickerVisible && ('ms-DatePicker-calendarsInline ' + styles.calendarsInline),
-            monthPickerOnly && ('ms-DatePicker-monthPickerOnly ' + styles.monthPickerOnly)
+            monthPickerOnly && ('ms-DatePicker-monthPickerOnly ' + styles.monthPickerOnly),
+            showMonthPickerAsOverlay && ('ms-DatePicker-monthPickerAsOverlay ' + styles.monthPickerAsOverlay),
           ) }
         >
           <div className={ css('ms-DatePicker-holder ms-slideDownIn10', styles.holder) } onKeyDown={ this._onDatePickerPopupKeyDown }>

From 38bbc24a0e3f1b97bbc646e4783372a9657f3dee Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Fri, 15 Sep 2017 14:40:29 -0700
Subject: [PATCH 0648/1641] DatePicker-Adding new props from Calendar component
 (#2853)

* no message

* no message

* Adding Calendar props to DatePicker

* Change file
---
 ...tePicker-PropsUpdate_2017-09-14-22-29.json | 11 +++++++
 .../components/DatePicker/DatePicker.Props.ts | 29 +++++++++++++++++++
 .../src/components/DatePicker/DatePicker.tsx  | 10 +++++++
 3 files changed, 50 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-DatePicker-PropsUpdate_2017-09-14-22-29.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-DatePicker-PropsUpdate_2017-09-14-22-29.json b/common/changes/office-ui-fabric-react/kegorr-DatePicker-PropsUpdate_2017-09-14-22-29.json
new file mode 100644
index 0000000000000..7f19013be60a1
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-DatePicker-PropsUpdate_2017-09-14-22-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DatePicker-Adding new props from Calendar component",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
index c28c4bb549a22..d78567003d0d5 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { DatePicker } from './DatePicker';
 import { DayOfWeek } from '../../Calendar';
+import { ICalendarFormatDateCallbacks } from '../Calendar/Calendar.Props';
 
 export interface IDatePicker {
 
@@ -52,6 +53,12 @@ export interface IDatePickerProps extends React.Props<DatePicker> {
    */
   isMonthPickerVisible?: boolean;
 
+  /**
+  * Show month picker on top of date picker when visible.
+  * @defaultvalue false
+  */
+  showMonthPickerAsOverlay?: boolean;
+
   /**
    * Whether the DatePicker allows input a date string directly or not
    * @defaultvalue false
@@ -97,6 +104,23 @@ export interface IDatePickerProps extends React.Props<DatePicker> {
    */
   strings?: IDatePickerStrings;
 
+  /**
+  * Whether the month picker should highlight the current month
+  * @defaultvalue false
+  */
+  highlightCurrentMonth?: boolean;
+
+  /**
+  * Whether the calendar should show the week number (weeks 1 to 53) before each week row
+  * @defaultvalue false
+  */
+  showWeekNumbers?: boolean;
+
+  /**
+   * Whether the "Go to today" link should be shown or not
+   */
+  showGoToToday?: boolean;
+
   /**
    * Determines if DatePicker has a border.
    * @defaultvalue false
@@ -107,6 +131,11 @@ export interface IDatePickerProps extends React.Props<DatePicker> {
    * Optional Classname for datepicker root element .
    */
   className?: string;
+
+  /**
+  * Apply additional formating to dates, for example localized date formatting.
+  */
+  dateTimeFormatter?: ICalendarFormatDateCallbacks;
 }
 
 export interface IDatePickerStrings {
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 98b081df47ffc..6232975801aa3 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -108,9 +108,14 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     firstDayOfWeek: DayOfWeek.Sunday,
     isRequired: false,
     isMonthPickerVisible: true,
+    showMonthPickerAsOverlay: false,
     strings: DEFAULT_STRINGS,
+    highlightCurrentMonth: false,
     borderless: false,
     pickerAriaLabel: 'Calender',
+    showWeekNumbers: false,
+    showGoToToday: true,
+    dateTimeFormatter: undefined
   };
 
   public refs: {
@@ -227,9 +232,14 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
               onSelectDate={ this._onSelectDate }
               onDismiss={ this._calendarDismissed }
               isMonthPickerVisible={ this.props.isMonthPickerVisible }
+              showMonthPickerAsOverlay={ this.props.showMonthPickerAsOverlay }
               value={ selectedDate }
               firstDayOfWeek={ firstDayOfWeek }
               strings={ strings! }
+              highlightCurrentMonth={ this.props.highlightCurrentMonth }
+              showWeekNumbers={ this.props.showWeekNumbers }
+              showGoToToday={ this.props.showGoToToday }
+              dateTimeFormatter={ this.props.dateTimeFormatter }
               ref={ this._resolveRef('_calendar') }
             />
           </Callout>

From 93fd9214ba07ff85220a1800e80597b1d957318d Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Sat, 16 Sep 2017 11:17:34 -0700
Subject: [PATCH 0649/1641] Fix up accessibility hooks for TilesList
 [experiments] (#2865)

* Force Check background to use body background color

* Add support in Tile for aria label and description

* Hide most of FolderCover from ARIA

* Pass aria-label through to all Signals

* Set List role to presentation by default in TilesList

* Add accessible role to TilesList examples

* Update change output
---
 .../tile-aria_2017-09-15-22-49.json           |  11 ++
 .../tile-aria_2017-09-15-22-49.json           |  11 ++
 .../FolderCover/FolderCover.Props.ts          |   2 +-
 .../components/FolderCover/FolderCover.tsx    |   8 +-
 .../src/components/Tile/Tile.Props.ts         |  14 ++
 .../experiments/src/components/Tile/Tile.scss |   8 ++
 .../experiments/src/components/Tile/Tile.tsx  |  46 +++++--
 .../src/components/TilesList/TilesList.tsx    |   3 +
 .../examples/TilesList.Document.Example.tsx   |   8 +-
 .../examples/TilesList.Media.Example.tsx      |   6 +-
 .../src/components/signals/Signals.tsx        | 122 +++++++++++++++---
 .../src/components/Check/Check.scss           |  14 +-
 12 files changed, 216 insertions(+), 37 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/tile-aria_2017-09-15-22-49.json
 create mode 100644 common/changes/office-ui-fabric-react/tile-aria_2017-09-15-22-49.json

diff --git a/common/changes/@uifabric/experiments/tile-aria_2017-09-15-22-49.json b/common/changes/@uifabric/experiments/tile-aria_2017-09-15-22-49.json
new file mode 100644
index 0000000000000..6a7202466d576
--- /dev/null
+++ b/common/changes/@uifabric/experiments/tile-aria_2017-09-15-22-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Add accessibility hooks for Tile, TilesList, and FolderCover",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/tile-aria_2017-09-15-22-49.json b/common/changes/office-ui-fabric-react/tile-aria_2017-09-15-22-49.json
new file mode 100644
index 0000000000000..b0557d106c023
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/tile-aria_2017-09-15-22-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Force Check to use the page background color",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.Props.ts b/packages/experiments/src/components/FolderCover/FolderCover.Props.ts
index 788aa68937193..60f0e3d938417 100644
--- a/packages/experiments/src/components/FolderCover/FolderCover.Props.ts
+++ b/packages/experiments/src/components/FolderCover/FolderCover.Props.ts
@@ -11,7 +11,7 @@ export type FolderCoverType =
   'default' |
   'media';
 
-export interface IFolderCoverProps extends IBaseProps, React.HTMLAttributes<FolderCover> {
+export interface IFolderCoverProps extends IBaseProps, React.Props<FolderCover>, React.HTMLAttributes<HTMLDivElement> {
   /**
    * The breakpoint size of the folder cover.
    *
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.tsx b/packages/experiments/src/components/FolderCover/FolderCover.tsx
index 20a9c8164712d..48ae8303bddd0 100644
--- a/packages/experiments/src/components/FolderCover/FolderCover.tsx
+++ b/packages/experiments/src/components/FolderCover/FolderCover.tsx
@@ -78,13 +78,16 @@ export class FolderCover extends React.Component<IFolderCoverProps, IFolderCover
     const {
       folderCoverSize: size = 'large',
       folderCoverType: type = 'default',
-      hideContent = false
+      hideContent = false,
+      ref,
+      ...divProps
     } = this.props;
 
     const assets = ASSETS[size][type];
 
     return (
       <div
+        { ...divProps }
         className={ css(FolderCoverStyles.root, {
           [`ms-FolderCover--isSmall ${FolderCoverStyles.isSmall}`]: size === 'small',
           [`ms-FolderCover--isLarge ${FolderCoverStyles.isLarge}`]: size === 'large',
@@ -94,10 +97,12 @@ export class FolderCover extends React.Component<IFolderCoverProps, IFolderCover
         }) }
       >
         <img
+          aria-hidden={ true }
           className={ css('ms-FolderCover-shadow', FolderCoverStyles.shadow) }
           src={ assets.shadow }
         />
         <img
+          aria-hidden={ true }
           className={ css('ms-FolderCover-back', FolderCoverStyles.back) }
           src={ assets.back }
         />
@@ -111,6 +116,7 @@ export class FolderCover extends React.Component<IFolderCoverProps, IFolderCover
           ) : null
         }
         <img
+          aria-hidden={ true }
           className={ css('ms-FolderCover-front', FolderCoverStyles.front) }
           src={ assets.front }
         />
diff --git a/packages/experiments/src/components/Tile/Tile.Props.ts b/packages/experiments/src/components/Tile/Tile.Props.ts
index 41b13b88b220a..fc55a8419a458 100644
--- a/packages/experiments/src/components/Tile/Tile.Props.ts
+++ b/packages/experiments/src/components/Tile/Tile.Props.ts
@@ -95,6 +95,20 @@ export interface ITileProps extends IBaseProps, React.AllHTMLAttributes<HTMLSpan
    * @memberof ITileProps
    */
   hideForeground?: boolean;
+  /**
+   * The accessible label representing the tile and its content.
+   *
+   * @type {string}
+   * @memberof ITileProps
+   */
+  ariaLabel?: string;
+  /**
+   * The accessible label providing description or instructions for the tile.
+   *
+   * @type {string}
+   * @memberof ITileProps
+   */
+  descriptionAriaLabel?: string;
   /**
    * The accessible label for the selection checkbox.
    *
diff --git a/packages/experiments/src/components/Tile/Tile.scss b/packages/experiments/src/components/Tile/Tile.scss
index 0777c1b7a76a9..f29a338072e02 100644
--- a/packages/experiments/src/components/Tile/Tile.scss
+++ b/packages/experiments/src/components/Tile/Tile.scss
@@ -76,6 +76,14 @@
   }
 }
 
+.label {
+  @include ms-screenReaderOnly;
+}
+
+.description {
+  @include ms-screenReaderOnly;
+}
+
 .link {
   @include focus-clear();
 
diff --git a/packages/experiments/src/components/Tile/Tile.tsx b/packages/experiments/src/components/Tile/Tile.tsx
index b81c2ff04031c..0223e4714307b 100644
--- a/packages/experiments/src/components/Tile/Tile.tsx
+++ b/packages/experiments/src/components/Tile/Tile.tsx
@@ -62,6 +62,8 @@ const SIZES: {
 export class Tile extends BaseComponent<ITileProps, ITileState> {
   private _nameId: string;
   private _activityId: string;
+  private _labelId: string;
+  private _descriptionId: string;
 
   // tslint:disable-next-line:no-any
   constructor(props: ITileProps, context: any) {
@@ -69,6 +71,8 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
 
     this._nameId = getId('Tile-name');
     this._activityId = getId('Tile-activity');
+    this._labelId = getId('Tile-label');
+    this._descriptionId = getId('Tile-description');
 
     const {
       selectionIndex = -1,
@@ -149,7 +153,11 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
       className,
       tileSize = 'large',
       contentSize,
-      ...aProps
+      ariaLabel,
+      descriptionAriaLabel,
+      href,
+      onClick,
+      ...divProps
     } = this.props;
 
     const isSelectable = !!selection && selectionIndex > -1;
@@ -158,12 +166,12 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
       isSelected = false
     } = this.state;
 
-    const Tag = aProps.href ? 'a' : 'span';
-
     return (
       <div
-        aria-labelledby={ this._nameId }
-        aria-describedby={ this._activityId }
+        aria-selected={ isSelected }
+        { ...divProps }
+        aria-labelledby={ ariaLabel ? this._labelId : this._nameId }
+        aria-describedby={ descriptionAriaLabel ? this._descriptionId : this._activityId }
         className={ css('ms-Tile', className, TileStyles.tile, {
           [`ms-Tile--isSmall ${TileStyles.isSmall}`]: tileSize === 'small',
           [`ms-Tile--isLarge ${TileStyles.isLarge}`]: tileSize === 'large',
@@ -180,11 +188,22 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
         data-disable-click-on-enter={ true }
         data-selection-index={ (selectionIndex > -1) ? selectionIndex : undefined }
       >
-        <Tag
-          { ...aProps }
+        <a
+          href={ href }
+          onClick={ onClick }
           data-selection-invoke={ (selectionIndex > -1) ? true : undefined }
           className={ css('ms-Tile-link', TileStyles.link) }
         >
+          {
+            ariaLabel ? (
+              <span
+                id={ this._labelId }
+                className={ css('ms-Tile-label', TileStylesModule.label) }
+              >
+                { ariaLabel }
+              </span>
+            ) : null
+          }
           {
             background ? this._onRenderBackground({
               background: background,
@@ -203,7 +222,17 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
               activity: itemActivity
             }) : null
           }
-        </Tag>
+        </a>
+        {
+          descriptionAriaLabel ? (
+            <span
+              id={ this._descriptionId }
+              className={ css('ms-Tile-description', TileStylesModule.description) }
+            >
+              { descriptionAriaLabel }
+            </span>
+          ) : null
+        }
         {
           isSelectable ? this._onRenderCheck({
             isSelected: isSelected
@@ -306,6 +335,7 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
         className={ css('ms-Tile-check', TileStyles.check) }
         data-selection-toggle={ true }
         role='checkbox'
+        aria-checked={ isSelected }
       >
         <Check
           checked={ isSelected }
diff --git a/packages/experiments/src/components/TilesList/TilesList.tsx b/packages/experiments/src/components/TilesList/TilesList.tsx
index 2b8f42cf75733..a3f3edc9009ab 100644
--- a/packages/experiments/src/components/TilesList/TilesList.tsx
+++ b/packages/experiments/src/components/TilesList/TilesList.tsx
@@ -101,12 +101,14 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
       items,
       cellsPerPage,
       ref,
+      role,
       focusZoneComponentRef,
       ...divProps
     } = this.props;
 
     return (
       <FocusZone
+        role={ role }
         { ...divProps }
         ref={ ref as ((element: FocusZone | null) => void) }
         componentRef={ focusZoneComponentRef }
@@ -116,6 +118,7 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
       >
         <List
           items={ cells }
+          role={ role ? 'presentation' : undefined }
           getPageSpecification={ this._getPageSpecification }
           onRenderPage={ this._onRenderPage }
         />
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
index 1aee9da9ef2f6..5e319ef50ee81 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
@@ -61,6 +61,7 @@ export class TilesListDocumentExample extends React.Component<{}, {}> {
             onItemInvoked={ this._onItemInvoked }
           >
             <TilesListType
+              role='list'
               items={ items }
             />
           </SelectionZone>
@@ -81,9 +82,12 @@ export class TilesListDocumentExample extends React.Component<{}, {}> {
   private _onRenderDocumentCell(item: IExampleItem): JSX.Element {
     return (
       <Tile
+        role='listitem'
+        aria-setsize={ ITEMS.length }
+        aria-posinset={ item.index }
         className={ AnimationClassNames.fadeIn400 }
         selection={ this._selection }
-        selectionIndex={ ITEMS.indexOf(item) }
+        selectionIndex={ item.index }
         foreground={
           <img
             src={
@@ -109,7 +113,7 @@ export class TilesListDocumentExample extends React.Component<{}, {}> {
   @autobind
   private _onRenderHeader(item: IExampleItem): JSX.Element {
     return (
-      <div>
+      <div role='presentation'>
         <h3>{ item.name }</h3>
       </div>
     );
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
index 6e72543cc54d9..066601a93e831 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
@@ -66,6 +66,7 @@ export class TilesListMediaExample extends React.Component<{}, {}> {
             onItemInvoked={ this._onItemInvoked }
           >
             <TilesListType
+              role='list'
               items={ items }
             />
           </SelectionZone>
@@ -86,6 +87,9 @@ export class TilesListMediaExample extends React.Component<{}, {}> {
   private _onRenderMediaCell(item: IExampleItem, finalSize: ITileSize): JSX.Element {
     const tile = (
       <Tile
+        role='listitem'
+        aria-setsize={ ITEMS.length }
+        aria-posinset={ item.index }
         contentSize={ finalSize }
         className={ AnimationClassNames.fadeIn400 }
         selection={ this._selection }
@@ -118,7 +122,7 @@ export class TilesListMediaExample extends React.Component<{}, {}> {
   @autobind
   private _onRenderHeader(item: IExampleItem): JSX.Element {
     return (
-      <div>
+      <div role='presentation'>
         <h3>{ item.name }</h3>
       </div>
     );
diff --git a/packages/experiments/src/components/signals/Signals.tsx b/packages/experiments/src/components/signals/Signals.tsx
index d5e428bba4dd6..cdd226b513b1c 100644
--- a/packages/experiments/src/components/signals/Signals.tsx
+++ b/packages/experiments/src/components/signals/Signals.tsx
@@ -45,50 +45,89 @@ export interface ISignalProps extends React.HTMLAttributes<HTMLSpanElement> {
 export type Signal = React.StatelessComponent<ISignalProps>;
 
 export const Signal: Signal = (props: ISignalProps): JSX.Element => {
+  const {
+    ariaLabel,
+    ...spanProps
+  } = props;
+
   return (
-    <span className={ css(SignalStyles.signal) }>{ props.children }</span>
+    <span
+      aria-label={ props.ariaLabel }
+      { ...spanProps }
+      className={ css(SignalStyles.signal) }
+    >
+      { props.children }
+    </span>
   );
 };
 
 export const YouCheckedOutSignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
-    <Icon className={ css(SignalStyles.signal, SignalStyles.youCheckedOutl) } iconName='' /> // TODO get correct icon
+    <Icon
+      ariaLabel={ props.ariaLabel }
+      className={ css(SignalStyles.signal, SignalStyles.youCheckedOutl) }
+      iconName=''
+    /> // TODO get correct icon
   );
 };
 
 export const BlockedSignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
-    <Icon className={ css(SignalStyles.signal, SignalStyles.blocked) } iconName='blocked2' />
+    <Icon
+      ariaLabel={ props.ariaLabel }
+      className={ css(SignalStyles.signal, SignalStyles.blocked) }
+      iconName='blocked2'
+    />
   );
 };
 
 export const MissingMetadataSignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
-    <Icon className={ css(SignalStyles.signal, SignalStyles.missingMetadata) } iconName='info' />
+    <Icon
+      ariaLabel={ props.ariaLabel }
+      className={ css(SignalStyles.signal, SignalStyles.missingMetadata) }
+      iconName='info'
+    />
   );
 };
 
 export const WarningSignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
-    <Icon className={ css(SignalStyles.signal, SignalStyles.warning) } iconName='warning' />
+    <Icon
+      ariaLabel={ props.ariaLabel }
+      className={ css(SignalStyles.signal, SignalStyles.warning) }
+      iconName='warning'
+    />
   );
 };
 
 export const AwaitingApprovalSignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
-    <Icon className={ css(SignalStyles.signal, SignalStyles.awaitingApproval) } iconName='documentmanagement' /> // TODO get correct icon
+    <Icon
+      ariaLabel={ props.ariaLabel }
+      className={ css(SignalStyles.signal, SignalStyles.awaitingApproval) }
+      iconName='documentmanagement'
+    /> // TODO get correct icon
   );
 };
 
 export const TrendingSignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
-    <Icon className={ css(SignalStyles.signal, SignalStyles.trending) } iconName='market' />
+    <Icon
+      ariaLabel={ props.ariaLabel }
+      className={ css(SignalStyles.signal, SignalStyles.trending) }
+      iconName='market'
+    />
   );
 };
 
 export const SomeoneCheckedOutSignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
-    <Icon className={ css(SignalStyles.signal, SignalStyles.someoneCheckedOut) } iconName='navigateforward' /> // TODO get correct icon
+    <Icon
+      ariaLabel={ props.ariaLabel }
+      className={ css(SignalStyles.signal, SignalStyles.someoneCheckedOut) }
+      iconName='navigateforward'
+    /> // TODO get correct icon
   );
 };
 
@@ -96,9 +135,21 @@ export const SomeoneCheckedOutSignal: Signal = (props: ISignalProps): JSX.Elemen
  * Renders a signal marking the proceeding content as new.
  */
 export const NewSignal: Signal = (props: ISignalProps): JSX.Element => {
+  const {
+    ariaLabel,
+    ...spanProps
+  } = props;
+
   return (
-    <span className={ css(SignalStyles.signal, SignalStyles.newItem) }>
-      <Icon className={ css(SignalStyles.newIcon) } iconName='glimmer' />
+    <span
+      { ...spanProps }
+      className={ css(SignalStyles.signal, SignalStyles.newItem) }
+    >
+      <Icon
+        ariaLabel={ props.ariaLabel }
+        className={ css(SignalStyles.newIcon) }
+        iconName='glimmer'
+      />
     </span>
   );
 };
@@ -107,8 +158,17 @@ export const NewSignal: Signal = (props: ISignalProps): JSX.Element => {
  * Renders a signal for a live-edit scenario.
  */
 export const LiveEditSignal: Signal = (props: ISignalProps): JSX.Element => {
+  const {
+    ariaLabel,
+    ...spanProps
+  } = props;
+
   return (
-    <span className={ css(SignalStyles.signal, SignalStyles.liveEdit) }>
+    <span
+      aria-label={ ariaLabel }
+      { ...spanProps }
+      className={ css(SignalStyles.signal, SignalStyles.liveEdit) }
+    >
       { props.children }
     </span>
   );
@@ -116,7 +176,11 @@ export const LiveEditSignal: Signal = (props: ISignalProps): JSX.Element => {
 
 export const MentionSignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
-    <Icon className={ css(SignalStyles.signal, SignalStyles.mention) } iconName='accounts' />
+    <Icon
+      ariaLabel={ props.ariaLabel }
+      className={ css(SignalStyles.signal, SignalStyles.mention) }
+      iconName='accounts'
+    />
   );
 };
 
@@ -124,9 +188,21 @@ export const MentionSignal: Signal = (props: ISignalProps): JSX.Element => {
  * Renders a signal for a number of comments.
  */
 export const CommentsSignal: Signal = (props: ISignalProps): JSX.Element => {
+  const {
+    ariaLabel,
+    ...spanProps
+  } = props;
+
   return (
-    <span className={ css(SignalStyles.signal, SignalStyles.comments) }>
-      <Icon className={ css(SignalStyles.commentsIcon) } iconName='MessageFill' />
+    <span
+      { ...spanProps }
+      className={ css(SignalStyles.signal, SignalStyles.comments) }
+    >
+      <Icon
+        ariaLabel={ props.ariaLabel }
+        className={ css(SignalStyles.commentsIcon) }
+        iconName='MessageFill'
+      />
       {
         props.children ? (
           <span className={ css(SignalStyles.commentsCount) }>
@@ -140,18 +216,30 @@ export const CommentsSignal: Signal = (props: ISignalProps): JSX.Element => {
 
 export const UnseenEditSignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
-    <Icon className={ css(SignalStyles.signal, SignalStyles.unseenEdit) } iconName='edit' /> // TODO get correct icon
+    <Icon
+      ariaLabel={ props.ariaLabel }
+      className={ css(SignalStyles.signal, SignalStyles.unseenEdit) }
+      iconName='edit'
+    /> // TODO get correct icon
   );
 };
 
 export const ReadOnlySignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
-    <Icon className={ css(SignalStyles.signal, SignalStyles.readOnly) } iconName='' /> // TODO get correct icon
+    <Icon
+      ariaLabel={ props.ariaLabel }
+      className={ css(SignalStyles.signal, SignalStyles.readOnly) }
+      iconName=''
+    /> // TODO get correct icon
   );
 };
 
 export const SharedSignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
-    <Icon className={ css(SignalStyles.signal, SignalStyles.shared) } iconName='people' />
+    <Icon
+      ariaLabel={ props.ariaLabel }
+      className={ css(SignalStyles.signal, SignalStyles.shared) }
+      iconName='people'
+    />
   );
 };
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.scss b/packages/office-ui-fabric-react/src/components/Check/Check.scss
index e7daa21b69aa2..5882028ec936a 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.scss
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.scss
@@ -18,8 +18,7 @@ $checkBoxHeight: 18px;
 
   @include ms-user-select(none);
 
-  &.rootIsChecked:before {
-    background: $ms-color-themePrimary;
+  &:before {
     content: '';
     position: absolute;
     left: 1px;
@@ -27,13 +26,14 @@ $checkBoxHeight: 18px;
     bottom: 1px;
     top: 1px;
     border-radius: 50%;
+    opacity: 1;
+    background: $bodyBackgroundColor;
   }
-}
 
-.root:hover,
-.root:focus,
-.rootIsChecked {
-  opacity: 1;
+  &.rootIsChecked:before {
+    background: $ms-color-themePrimary;
+    opacity: 1;
+  }
 }
 
 .circle,

From 411c448da81f6aafa586e9ca835afc2f93c96356 Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Sat, 16 Sep 2017 12:02:35 -0700
Subject: [PATCH 0650/1641] Changing font size of activity icons (#2834)

* Changing font size of activity icons

* rush change
---
 .../v-krbrow-activity-icon-font_2017-09-15-16-17.json | 11 +++++++++++
 .../v-krbrow-activity-icon-font_2017-09-15-16-17.json | 11 +++++++++++
 .../v-krbrow-activity-icon-font_2017-09-15-16-17.json | 11 +++++++++++
 .../components/ActivityItem/ActivityItem.styles.ts    |  2 +-
 4 files changed, 34 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/styling/v-krbrow-activity-icon-font_2017-09-15-16-17.json
 create mode 100644 common/changes/@uifabric/utilities/v-krbrow-activity-icon-font_2017-09-15-16-17.json
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-activity-icon-font_2017-09-15-16-17.json

diff --git a/common/changes/@uifabric/styling/v-krbrow-activity-icon-font_2017-09-15-16-17.json b/common/changes/@uifabric/styling/v-krbrow-activity-icon-font_2017-09-15-16-17.json
new file mode 100644
index 0000000000000..3040d62c30bc0
--- /dev/null
+++ b/common/changes/@uifabric/styling/v-krbrow-activity-icon-font_2017-09-15-16-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/v-krbrow-activity-icon-font_2017-09-15-16-17.json b/common/changes/@uifabric/utilities/v-krbrow-activity-icon-font_2017-09-15-16-17.json
new file mode 100644
index 0000000000000..a1ca6e66cf82c
--- /dev/null
+++ b/common/changes/@uifabric/utilities/v-krbrow-activity-icon-font_2017-09-15-16-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-activity-icon-font_2017-09-15-16-17.json b/common/changes/office-ui-fabric-react/v-krbrow-activity-icon-font_2017-09-15-16-17.json
new file mode 100644
index 0000000000000..e954fcf1d6b32
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-activity-icon-font_2017-09-15-16-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ActivityItem: Descreasing icon font size.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
index a38ef14eacac4..06c3332831cf4 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
@@ -10,7 +10,7 @@ import { IActivityItemStyles } from './ActivityItem.Props';
 
 const DEFAULT_PERSONA_SIZE = '32px';
 const COMPACT_PERSONA_SIZE = '16px';
-const DEFAULT_ICON_SIZE = '24px';
+const DEFAULT_ICON_SIZE = '16px';
 const COMPACT_ICON_SIZE = '13px';
 
 export const getStyles = memoizeFunction((

From 4650c9758ba909132c3c68ef77feead446e8b747 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 18 Sep 2017 10:18:23 +0000
Subject: [PATCH 0651/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../tile-aria_2017-09-15-22-49.json           | 11 ------
 ...w-activity-icon-font_2017-09-15-16-17.json | 11 ------
 ...w-activity-icon-font_2017-09-15-16-17.json | 11 ------
 ...tePicker-PropsUpdate_2017-09-14-22-29.json | 11 ------
 ...er-verticalScrollBug_2017-09-15-01-03.json | 11 ------
 .../tile-aria_2017-09-15-22-49.json           | 11 ------
 ...onItemPreventDefault_2017-09-13-18-07.json | 11 ------
 ...w-activity-icon-font_2017-09-15-16-17.json | 11 ------
 packages/experiments/CHANGELOG.json           | 19 ++++++++++
 packages/experiments/CHANGELOG.md             |  9 ++++-
 packages/experiments/package.json             |  4 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 36 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 16 ++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 18 files changed, 85 insertions(+), 97 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/tile-aria_2017-09-15-22-49.json
 delete mode 100644 common/changes/@uifabric/styling/v-krbrow-activity-icon-font_2017-09-15-16-17.json
 delete mode 100644 common/changes/@uifabric/utilities/v-krbrow-activity-icon-font_2017-09-15-16-17.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-DatePicker-PropsUpdate_2017-09-14-22-29.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-DatePicker-verticalScrollBug_2017-09-15-01-03.json
 delete mode 100644 common/changes/office-ui-fabric-react/tile-aria_2017-09-15-22-49.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-demarcey-onItemPreventDefault_2017-09-13-18-07.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-activity-icon-font_2017-09-15-16-17.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 2b06ce6abbb01..f9a491a336813 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -44,7 +44,7 @@
     "@uifabric/example-app-base": ">=4.2.7 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=4.47.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.48.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 8e18dbce9078e..209fa6fc29a99 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.47.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.48.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index c0bdfe861b0f1..b54de42158b32 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -26,7 +26,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.47.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.48.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index cbc4344df2a27..7ae26fdbcbdf3 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -24,7 +24,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=4.47.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.48.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/experiments/tile-aria_2017-09-15-22-49.json b/common/changes/@uifabric/experiments/tile-aria_2017-09-15-22-49.json
deleted file mode 100644
index 6a7202466d576..0000000000000
--- a/common/changes/@uifabric/experiments/tile-aria_2017-09-15-22-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Add accessibility hooks for Tile, TilesList, and FolderCover",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/v-krbrow-activity-icon-font_2017-09-15-16-17.json b/common/changes/@uifabric/styling/v-krbrow-activity-icon-font_2017-09-15-16-17.json
deleted file mode 100644
index 3040d62c30bc0..0000000000000
--- a/common/changes/@uifabric/styling/v-krbrow-activity-icon-font_2017-09-15-16-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/v-krbrow-activity-icon-font_2017-09-15-16-17.json b/common/changes/@uifabric/utilities/v-krbrow-activity-icon-font_2017-09-15-16-17.json
deleted file mode 100644
index a1ca6e66cf82c..0000000000000
--- a/common/changes/@uifabric/utilities/v-krbrow-activity-icon-font_2017-09-15-16-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kegorr-DatePicker-PropsUpdate_2017-09-14-22-29.json b/common/changes/office-ui-fabric-react/kegorr-DatePicker-PropsUpdate_2017-09-14-22-29.json
deleted file mode 100644
index 7f19013be60a1..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-DatePicker-PropsUpdate_2017-09-14-22-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DatePicker-Adding new props from Calendar component",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kegorr-DatePicker-verticalScrollBug_2017-09-15-01-03.json b/common/changes/office-ui-fabric-react/kegorr-DatePicker-verticalScrollBug_2017-09-15-01-03.json
deleted file mode 100644
index 46104b013438e..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-DatePicker-verticalScrollBug_2017-09-15-01-03.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DatePicker-fixing vertical scrollbar bug",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/tile-aria_2017-09-15-22-49.json b/common/changes/office-ui-fabric-react/tile-aria_2017-09-15-22-49.json
deleted file mode 100644
index b0557d106c023..0000000000000
--- a/common/changes/office-ui-fabric-react/tile-aria_2017-09-15-22-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Force Check to use the page background color",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-demarcey-onItemPreventDefault_2017-09-13-18-07.json b/common/changes/office-ui-fabric-react/users-demarcey-onItemPreventDefault_2017-09-13-18-07.json
deleted file mode 100644
index ab2e2be25fdf7..0000000000000
--- a/common/changes/office-ui-fabric-react/users-demarcey-onItemPreventDefault_2017-09-13-18-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Allow onItemContextMenu a way to cancel preventDefault() call.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "demarcey@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-activity-icon-font_2017-09-15-16-17.json b/common/changes/office-ui-fabric-react/v-krbrow-activity-icon-font_2017-09-15-16-17.json
deleted file mode 100644
index e954fcf1d6b32..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-activity-icon-font_2017-09-15-16-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ActivityItem: Descreasing icon font size.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 6e2edc1e41c9b..9b0e9196692d5 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "0.8.0",
+      "tag": "@uifabric/experiments_v0.8.0",
+      "date": "Mon, 18 Sep 2017 10:18:23 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "93fd9214ba07ff85220a1800e80597b1d957318d",
+            "comment": "Add accessibility hooks for Tile, TilesList, and FolderCover"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.47.0 <5.0.0` to `>=4.48.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.7.1",
       "tag": "@uifabric/experiments_v0.7.1",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 1299e77e71ed5..19a8f966ae5e7 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Fri, 15 Sep 2017 10:19:50 GMT and should not be manually modified.
+This log was last generated on Mon, 18 Sep 2017 10:18:23 GMT and should not be manually modified.
+
+## 0.8.0
+Mon, 18 Sep 2017 10:18:23 GMT
+
+### Minor changes
+
+- Add accessibility hooks for Tile, TilesList, and FolderCover
 
 ## 0.7.1
 Fri, 15 Sep 2017 10:19:50 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 99578c06a4ea0..cae5a81a9afb8 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "0.7.1",
+  "version": "0.8.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,7 +43,7 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/styling": ">=0.24.0 <1.0.0",
     "@uifabric/utilities": ">=4.13.1 <5.0.0",
-    "office-ui-fabric-react": ">=4.47.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.48.0 <5.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index dbee94f791b09..52e6941fc966c 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,42 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.48.0",
+      "tag": "office-ui-fabric-react_v4.48.0",
+      "date": "Mon, 18 Sep 2017 10:18:23 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "38bbc24a0e3f1b97bbc646e4783372a9657f3dee",
+            "comment": "DatePicker-Adding new props from Calendar component"
+          }
+        ],
+        "patch": [
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "77bf0179913877383f87dbe5eb4c200f3cf67dcd",
+            "comment": "DatePicker-fixing vertical scrollbar bug"
+          },
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "93fd9214ba07ff85220a1800e80597b1d957318d",
+            "comment": "Force Check to use the page background color"
+          },
+          {
+            "author": "dmarcey <demarcey@microsoft.com>",
+            "commit": "ed78bd102529ecb5dc0500aaadd720a3b95e2a71",
+            "comment": "Allow onItemContextMenu a way to cancel preventDefault() call."
+          },
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "411c448da81f6aafa586e9ca835afc2f93c96356",
+            "comment": "ActivityItem: Descreasing icon font size."
+          }
+        ]
+      }
+    },
     {
       "version": "4.47.0",
       "tag": "office-ui-fabric-react_v4.47.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index c69ecb197b8b9..d8442d32f7ee6 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,20 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 15 Sep 2017 10:19:50 GMT and should not be manually modified.
+This log was last generated on Mon, 18 Sep 2017 10:18:23 GMT and should not be manually modified.
+
+## 4.48.0
+Mon, 18 Sep 2017 10:18:23 GMT
+
+### Minor changes
+
+- DatePicker-Adding new props from Calendar component
+
+### Patches
+
+- DatePicker-fixing vertical scrollbar bug
+- Force Check to use the page background color
+- Allow onItemContextMenu a way to cancel preventDefault() call.
+- ActivityItem: Descreasing icon font size.
 
 ## 4.47.0
 Fri, 15 Sep 2017 10:19:50 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 840b99fb8f781..71847e3794f9d 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.47.0",
+  "version": "4.48.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From f5ab885321b6b1eb7ecaf8a3470ccd11ae80253e Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Mon, 18 Sep 2017 09:37:48 -0700
Subject: [PATCH 0652/1641] Layout group tweaks (#2823)

* Changed gap to layoutGap, updated docs

* change file
---
 .../layout-group-tweaks_2017-09-12-23-22.json | 11 ++++++++++
 .../LayoutGroup/LayoutGroup.props.ts          |  6 +++---
 .../components/LayoutGroup/LayoutGroup.tsx    | 21 +++++++++++++------
 .../examples/LayoutGroup.Basic.Example.tsx    |  8 +++----
 4 files changed, 33 insertions(+), 13 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/layout-group-tweaks_2017-09-12-23-22.json

diff --git a/common/changes/@uifabric/experiments/layout-group-tweaks_2017-09-12-23-22.json b/common/changes/@uifabric/experiments/layout-group-tweaks_2017-09-12-23-22.json
new file mode 100644
index 0000000000000..c68347a559066
--- /dev/null
+++ b/common/changes/@uifabric/experiments/layout-group-tweaks_2017-09-12-23-22.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "LayoutGroup: Changed gap to layoutGap and updated docs",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/LayoutGroup/LayoutGroup.props.ts b/packages/experiments/src/components/LayoutGroup/LayoutGroup.props.ts
index b46afd6386eae..81ee358025bbc 100644
--- a/packages/experiments/src/components/LayoutGroup/LayoutGroup.props.ts
+++ b/packages/experiments/src/components/LayoutGroup/LayoutGroup.props.ts
@@ -3,7 +3,7 @@ import * as React from 'react';
 import { IBaseProps } from 'office-ui-fabric-react/lib/Utilities';
 import { LayoutGroup } from './LayoutGroup';
 
-export interface ILayoutGroupProps extends IBaseProps, React.HTMLAttributes<LayoutGroup> {
+export interface ILayoutGroupProps extends IBaseProps, React.HTMLAttributes<LayoutGroup | HTMLDivElement> {
   /**
    * Direction in which the child elements will be layed out.
    * @default vertical
@@ -11,10 +11,10 @@ export interface ILayoutGroupProps extends IBaseProps, React.HTMLAttributes<Layo
   direction?: 'vertical' | 'horizontal';
 
   /**
-   * Number of pixels between each element. No gap applied to last child.
+   * Number of pixels between each element. No layoutGap applied to last child.
    * @default 8
    */
-  gap?: number;
+  layoutGap?: number;
 
   /**
    * Method in which children fit into the layout group. Most useful with horizontal direction.
diff --git a/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx b/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx
index 3d977ef8266d7..962361e02e6f4 100644
--- a/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx
+++ b/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx
@@ -2,12 +2,16 @@
 import * as React from 'react';
 import { ILayoutGroupProps } from './LayoutGroup.props';
 import { mergeStyles } from '@uifabric/styling';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+import {
+  autobind,
+  getNativeProps,
+  divProperties
+} from 'office-ui-fabric-react/lib/Utilities';
 
 export class LayoutGroup extends React.Component<ILayoutGroupProps, {}> {
 
   public static defaultProps: ILayoutGroupProps = {
-    gap: 8,
+    layoutGap: 8,
     direction: 'vertical',
     justify: 'start'
   };
@@ -16,25 +20,28 @@ export class LayoutGroup extends React.Component<ILayoutGroupProps, {}> {
     const {
       children,
       direction,
-      gap,
-      justify
+      layoutGap,
+      justify,
     } = this.props;
 
+    let divProps = getNativeProps(this.props, divProperties);
+
     const numberOfChildren = React.Children.count(children);
 
     const group = React.Children.map(children, (child: React.ReactChild, i: number) => {
       const isLastChild = i === numberOfChildren - 1;
 
+      // Render individual item
       return (
         <div
           className={
             mergeStyles(
               'ms-LayoutGroup-item',
               direction === 'horizontal' && !isLastChild && {
-                marginRight: gap + 'px'
+                marginRight: layoutGap + 'px'
               },
               direction === 'vertical' && !isLastChild && {
-                marginBottom: gap + 'px'
+                marginBottom: layoutGap + 'px'
               },
               justify === 'fill' && {
                 flexBasis: 0,
@@ -49,8 +56,10 @@ export class LayoutGroup extends React.Component<ILayoutGroupProps, {}> {
       );
     });
 
+    // Render all items
     return (
       <div
+        { ...divProps }
         className={
           mergeStyles(
             'ms-LayoutGroup',
diff --git a/packages/experiments/src/components/LayoutGroup/examples/LayoutGroup.Basic.Example.tsx b/packages/experiments/src/components/LayoutGroup/examples/LayoutGroup.Basic.Example.tsx
index 56e84992583ce..fbddd8c7e9a83 100644
--- a/packages/experiments/src/components/LayoutGroup/examples/LayoutGroup.Basic.Example.tsx
+++ b/packages/experiments/src/components/LayoutGroup/examples/LayoutGroup.Basic.Example.tsx
@@ -14,7 +14,7 @@ export class LayoutGroupBasicExample extends React.Component<{}, {}> {
       <div>
         <h3>Layout Group</h3>
 
-        <LayoutGroup gap={ 20 } direction='vertical'>
+        <LayoutGroup layoutGap={ 20 } direction='vertical'>
           <h2 >A List of Inputs</h2>
           <Dropdown
             placeHolder='Select an Option'
@@ -36,12 +36,12 @@ export class LayoutGroupBasicExample extends React.Component<{}, {}> {
               ]
             }
           />
-          <LayoutGroup gap={ 20 } direction='horizontal' justify='fill'>
+          <LayoutGroup layoutGap={ 20 } direction='horizontal' justify='fill'>
             <TextField label='TextField with a placeholder' placeholder='Now I am a Placeholder' ariaLabel='Please enter text here' />
             <TextField label='TextField with an icon' iconProps={ { iconName: 'Calendar' } } />
           </LayoutGroup>
 
-          <LayoutGroup gap={ 20 } direction='horizontal' justify='fill'>
+          <LayoutGroup layoutGap={ 20 } direction='horizontal' justify='fill'>
             <ChoiceGroup
               defaultSelectedKey='B'
               options={ [
@@ -67,7 +67,7 @@ export class LayoutGroupBasicExample extends React.Component<{}, {}> {
               label='Pick one'
               required={ true }
             />
-            <LayoutGroup gap={ 10 }>
+            <LayoutGroup layoutGap={ 10 }>
               <Label>Pick a few</Label>
               <Checkbox
                 label='Checkbox A'

From f1a3c0a0653ca6b335077a95f8791ed42c610230 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Mon, 18 Sep 2017 15:42:09 -0700
Subject: [PATCH 0653/1641] Dropdown selected (#2868)

* Fixed logic in showing selected option

* Changefile

* Update Dropdown.test.tsx
---
 .../master_2017-09-18-20-37.json                | 11 +++++++++++
 .../src/components/Dropdown/Dropdown.test.tsx   | 17 ++++++++++++++++-
 .../src/components/Dropdown/Dropdown.tsx        |  2 +-
 3 files changed, 28 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/master_2017-09-18-20-37.json

diff --git a/common/changes/office-ui-fabric-react/master_2017-09-18-20-37.json b/common/changes/office-ui-fabric-react/master_2017-09-18-20-37.json
new file mode 100644
index 0000000000000..2f884f1dbcc66
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2017-09-18-20-37.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: Fixed logic to support selected options in single select scenario",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
index f735e8bd97393..b941e070c97be 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
@@ -67,6 +67,21 @@ describe('Dropdown', () => {
     expect(titleElement.textContent).equals('');
   });
 
+  it('Renders a selected item if option specifies selected', () => {
+    let container = document.createElement('div');
+
+    ReactDOM.render(
+      <Dropdown
+        label='testgroup'
+        options={ [{ key: '1', text: '1', selected: true }, { key: '2', text: '2' },] }
+      />,
+      container);
+    let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+
+    expect(titleElement.textContent).equals('1');
+  });
+
   it('Renders a selected item in uncontrolled case', () => {
     let container = document.createElement('div');
 
@@ -197,4 +212,4 @@ describe('Dropdown', () => {
     titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
     expect(titleElement.textContent).equals('4');
   });
-});
\ No newline at end of file
+});
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index d90191c0a0a6e..1f2961bf0bf73 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -560,7 +560,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
 
   private _getSelectedIndex(options: IDropdownOption[], selectedKey: string | number): number {
     // tslint:disable-next-line:triple-equals
-    return findIndex(options, (option => ((option.isSelected || option.selected || (selectedKey != null)) && option.key === selectedKey)));
+    return findIndex(options, (option => ((option.isSelected || option.selected) || (selectedKey != null) && option.key === selectedKey)));
   }
 
   @autobind

From 33a1ecb618a10f68de8a47cedfc0982b5ad562b2 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Mon, 18 Sep 2017 15:43:18 -0700
Subject: [PATCH 0654/1641] Fourth pass removing lambda expressions from jsx in
 Fabric (#2828)

* Fourth pass removing lambda expressions from jsx in Fabric

* Fixed issue with Image test
---
 .../components/FocusZone/FocusZone.test.tsx   | 10 ++-
 .../examples/FocusZone.List.Example.tsx       |  6 +-
 .../examples/FocusZone.Photos.Example.tsx     |  6 +-
 .../examples/GroupedList.Custom.Example.tsx   | 11 ++-
 .../examples/HoverCard.Target.Example.tsx     | 10 ++-
 .../src/components/Image/Image.test.tsx       | 11 ++-
 .../Layer/examples/Layer.Basic.Example.tsx    |  8 +-
 .../Layer/examples/Layer.Hosted.Example.tsx   | 25 ++++++-
 .../List/examples/List.Basic.Example.tsx      | 44 ++++++-----
 .../List/examples/List.Grid.Example.tsx       | 40 +++++-----
 .../List/examples/List.Scrolling.Example.tsx  | 73 +++++++++++--------
 .../MarqueeSelection.Basic.Example.tsx        | 15 +++-
 .../examples/MessageBar.Basic.Example.tsx     |  9 ++-
 .../examples/Nav.FabricDemoApp.Example.tsx    | 16 ++--
 .../examples/OverflowSet.Basic.Example.tsx    | 43 ++++++-----
 .../examples/OverflowSet.Custom.Example.tsx   | 53 ++++++++------
 16 files changed, 239 insertions(+), 141 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
index 8c11e04e98a2d..f43ed5d5387dd 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
@@ -421,11 +421,14 @@ describe('FocusZone', () => {
   });
 
   it('skips subzone elements until manually entered', () => {
+    const isInnerZoneKeystroke = (e: React.KeyboardEvent<HTMLElement>): boolean =>
+      e.which === KeyCodes.enter;
+
     const component = ReactTestUtils.renderIntoDocument(
       <div { ...{ onFocusCapture: _onFocus } }>
         <FocusZone
           direction={ FocusZoneDirection.horizontal }
-          isInnerZoneKeystroke={ (e: React.KeyboardEvent<HTMLElement>) => e.which === KeyCodes.enter }
+          isInnerZoneKeystroke={ isInnerZoneKeystroke }
         >
           <button className='a'>a</button>
           <div
@@ -508,11 +511,14 @@ describe('FocusZone', () => {
   });
 
   it('skips child focusZone elements until manually entered', () => {
+    const isInnerZoneKeystroke = (e: React.KeyboardEvent<HTMLElement>): boolean =>
+    e.which === KeyCodes.enter;
+
     const component = ReactTestUtils.renderIntoDocument(
       <div { ...{ onFocusCapture: _onFocus } }>
         <FocusZone
           direction={ FocusZoneDirection.horizontal }
-          isInnerZoneKeystroke={ (e: React.KeyboardEvent<HTMLElement>) => e.which === KeyCodes.enter }
+          isInnerZoneKeystroke={ isInnerZoneKeystroke }
         >
           <button className='a'>a</button>
           <FocusZone
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.List.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.List.Example.tsx
index 405f2bff5d08e..ee694a45bbbb0 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.List.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.List.Example.tsx
@@ -55,7 +55,7 @@ export class FocusZoneListExample extends React.Component<any, any> {
         className='ms-FocusZoneListExample'
         direction={ FocusZoneDirection.vertical }
         isCircularNavigation={ true }
-        isInnerZoneKeystroke={ (ev) => (ev.which === getRTLSafeKeyCode(KeyCodes.right)) }
+        isInnerZoneKeystroke={ this._isInnerZoneKeystroke }
       >
         { ITEMS.map((item, index) => (
           <DetailsRow
@@ -71,4 +71,8 @@ export class FocusZoneListExample extends React.Component<any, any> {
     );
   }
 
+  private _isInnerZoneKeystroke(ev: React.KeyboardEvent<HTMLElement>): boolean {
+    return ev.which === getRTLSafeKeyCode(KeyCodes.right);
+  }
+
 }
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Photos.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Photos.Example.tsx
index a4c2015e1f284..1ceaf2e425ea8 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Photos.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Photos.Example.tsx
@@ -17,6 +17,10 @@ const PHOTOS = createArray(25, () => {
   };
 });
 
+const log = (): void => {
+  console.log('clicked');
+};
+
 export const FocusZonePhotosExample = () => (
   <FocusZone
     elementType='ul'
@@ -30,7 +34,7 @@ export const FocusZonePhotosExample = () => (
         aria-setsize={ PHOTOS.length }
         aria-label='Photo'
         data-is-focusable={ true }
-        onClick={ () => console.log('clicked') }
+        onClick={ log }
       >
         <Image src={ photo.url } width={ photo.width } height={ photo.height } />
       </li>
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx
index aae5162d7fef1..8d642cd1a4536 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx
@@ -50,10 +50,19 @@ export class GroupedListCustomExample extends React.Component<any, any> {
   }
 
   private _onRenderHeader(props: IGroupDividerProps): JSX.Element {
+    const toggleCollapse = (): void => {
+      props.onToggleCollapse!(props.group!);
+    };
+
     return (
       <div className={ css('ms-GroupedListExample-header', FontClassNames.xLarge) }>
         This is a custom header for { props.group!.name }
-        &nbsp;(<Link onClick={ () => props.onToggleCollapse!(props.group!) }>{ props.group!.isCollapsed ? 'Expand' : 'Collapse' }</Link>)
+        &nbsp;
+        (
+          <Link onClick={ toggleCollapse }>
+          { props.group!.isCollapsed ? 'Expand' : 'Collapse' }
+        </Link>
+        )
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
index b71be589ebf92..207acdda15fc7 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
@@ -49,13 +49,19 @@ class HoverCardField extends BaseComponent<IHoverCardFieldProps, IHoverCardField
             expandingCardProps={ this.props.expandingCardProps }
             target={ this.state.contentRendered }
             cardDismissDelay={ 300 }
-            onCardVisible={ () => console.log('onCardVisible') }
-            onCardHide={ () => console.log('onCardHide') }
+            onCardVisible={ this._log('onCardVisible') }
+            onCardHide={ this._log('onCardHide') }
           />
         }
       </div>
     );
   }
+
+  private _log(text: string): () => void {
+    return (): void => {
+      console.log(text);
+    };
+  }
 }
 
 export class HoverCardTargetExample extends BaseComponent<{}, IHoverCardExampleState> {
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
index d6f4d09151263..601bd8863c971 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
@@ -20,12 +20,12 @@ const brokenImage = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgFcSJAAAAC0lEQVQ
 describe('Image', () => {
 
   it('renders an image', (done) => {
+    const returnDone = (): void => done();
+
     ReactTestUtils.renderIntoDocument(
       <Image
         src={ testImage1x1 }
-        onLoad={ () => {
-          done();
-        } }
+        onLoad={ returnDone }
       />
     );
   });
@@ -129,12 +129,11 @@ describe('Image', () => {
   });
 
   it('allows onError events to be attached', (done) => {
+    const returnDone = (): void => done();
     ReactTestUtils.renderIntoDocument(
       <Image
         src={ brokenImage }
-        onError={ () => {
-          done();
-        } }
+        onError={ returnDone }
       />
     );
   });
diff --git a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
index 94f85a664c17e..fc50acd53c880 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
@@ -4,6 +4,7 @@ import './Layer.Example.scss';
 import { BaseComponent } from 'office-ui-fabric-react/lib/Utilities';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { Layer } from 'office-ui-fabric-react/lib/Layer';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { AnimationClassNames } from '../../../Styling';
 
 export class LayerContentExample extends BaseComponent<any, any> {
@@ -64,7 +65,7 @@ export class LayerBasicExample extends BaseComponent<any, any> {
         <Checkbox
           label='Wrap the content box belowed in a Layer'
           checked={ showLayer }
-          onChange={ (ev, checked) => this.setState({ showLayer: checked }) }
+          onChange={ this._onChange }
         />
 
         { showLayer ? (
@@ -78,4 +79,9 @@ export class LayerBasicExample extends BaseComponent<any, any> {
       </div>
     );
   }
+
+  @autobind
+  private _onChange(ev: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean): void {
+    this.setState({ showLayer: checked });
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
index fe2e37634e58f..43a77954bcb70 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { Layer, LayerHost } from 'office-ui-fabric-react/lib/Layer';
 import { Toggle } from 'office-ui-fabric-react/lib/Toggle';
@@ -27,7 +28,7 @@ export class LayerHostedExample extends React.Component<any, any> {
         <Toggle
           label='Show host'
           checked={ showHost }
-          onChanged={ checked => this.setState({ showHost: checked }) }
+          onChanged={ this._onChangeToggle }
         />
 
         { showHost && (
@@ -41,14 +42,14 @@ export class LayerHostedExample extends React.Component<any, any> {
         <Checkbox
           label='Render the box below in a Layer and target it at hostId=layerhost1'
           checked={ showLayer }
-          onChange={ (ev, checked) => this.setState({ showLayer: checked }) }
+          onChange={ this._onChangeCheckbox }
         />
 
         { showLayer ? (
           <Layer
             hostId='layerhost1'
-            onLayerDidMount={ () => console.log('didmount') }
-            onLayerWillUnmount={ () => console.log('willunmount') }
+            onLayerDidMount={ this._log('didmount') }
+            onLayerWillUnmount={ this._log('willunmount') }
           >
             { content }
           </Layer>
@@ -59,4 +60,20 @@ export class LayerHostedExample extends React.Component<any, any> {
       </div>
     );
   }
+
+  private _log(text: string): () => void {
+    return (): void => {
+      console.log(text);
+    };
+  }
+
+  @autobind
+  private _onChangeCheckbox(ev: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean): void {
+    this.setState({ showLayer: checked });
+  }
+
+  @autobind
+  private _onChangeToggle(checked: boolean): void {
+    this.setState({ showHost: checked });
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx
index 2095b9cb16326..1801030ef64a6 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx
@@ -38,26 +38,7 @@ export class ListBasicExample extends React.Component<IListBasicExampleProps, an
         <TextField label={ 'Filter by name' + resultCountText } onBeforeChange={ this._onFilterChanged } />
         <List
           items={ items }
-          onRenderCell={ (item, index) => (
-            <div className='ms-ListBasicExample-itemCell' data-is-focusable={ true }>
-              <Image
-                className='ms-ListBasicExample-itemImage'
-                src={ item.thumbnail }
-                width={ 50 }
-                height={ 50 }
-                imageFit={ ImageFit.cover }
-              />
-              <div className='ms-ListBasicExample-itemContent'>
-                <div className='ms-ListBasicExample-itemName'>{ item.name }</div>
-                <div className='ms-ListBasicExample-itemIndex'>{ `Item ${index}` }</div>
-                <div className='ms-ListBasicExample-itemDesc'>{ item.description }</div>
-              </div>
-              <Icon
-                className='ms-ListBasicExample-chevron'
-                iconName={ getRTL() ? 'ChevronLeft' : 'ChevronRight' }
-              />
-            </div>
-          ) }
+          onRenderCell={ this._onRenderCell }
         />
       </FocusZone>
     );
@@ -73,4 +54,27 @@ export class ListBasicExample extends React.Component<IListBasicExampleProps, an
         items
     });
   }
+
+  private _onRenderCell(item: any, index: number | undefined): JSX.Element {
+    return (
+      <div className='ms-ListBasicExample-itemCell' data-is-focusable={ true }>
+        <Image
+          className='ms-ListBasicExample-itemImage'
+          src={ item.thumbnail }
+          width={ 50 }
+          height={ 50 }
+          imageFit={ ImageFit.cover }
+        />
+        <div className='ms-ListBasicExample-itemContent'>
+          <div className='ms-ListBasicExample-itemName'>{ item.name }</div>
+          <div className='ms-ListBasicExample-itemIndex'>{ `Item ${index}` }</div>
+          <div className='ms-ListBasicExample-itemDesc'>{ item.description }</div>
+        </div>
+        <Icon
+          className='ms-ListBasicExample-chevron'
+          iconName={ getRTL() ? 'ChevronLeft' : 'ChevronRight' }
+        />
+      </div>
+    );
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx b/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx
index b983ae5930e22..d426594e3b57e 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx
@@ -34,24 +34,7 @@ export class ListGridExample extends React.Component<IListGridExampleProps, any>
           getItemCountForPage={ this._getItemCountForPage }
           getPageHeight={ this._getPageHeight }
           renderedWindowsAhead={ 4 }
-          onRenderCell={ (item, index) => (
-            <div
-              className='ms-ListGridExample-tile'
-              data-is-focusable={ true }
-              style={ {
-                width: (100 / this._columnCount) + '%'
-              } }
-            >
-              <div className='ms-ListGridExample-sizer'>
-                <div className='msListGridExample-padder'>
-                  <img src={ item.thumbnail } className='ms-ListGridExample-image' />
-                  <span className='ms-ListGridExample-label'>
-                    { `item ${index}` }
-                  </span>
-                </div>
-              </div>
-            </div>
-          ) }
+          onRenderCell={ this._onRenderCell }
         />
       </FocusZone>
     );
@@ -70,4 +53,25 @@ export class ListGridExample extends React.Component<IListGridExampleProps, any>
   private _getPageHeight(itemIndex: number, surfaceRect: IRectangle) {
     return this._rowHeight * ROWS_PER_PAGE;
   }
+
+  private _onRenderCell(item: any, index: number | undefined): JSX.Element {
+    return (
+      <div
+        className='ms-ListGridExample-tile'
+        data-is-focusable={ true }
+        style={ {
+          width: (100 / this._columnCount) + '%'
+        } }
+      >
+        <div className='ms-ListGridExample-sizer'>
+          <div className='msListGridExample-padder'>
+            <img src={ item.thumbnail } className='ms-ListGridExample-image' />
+            <span className='ms-ListGridExample-label'>
+              { `item ${index}` }
+            </span>
+          </div>
+        </div>
+      </div>
+    );
+  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx b/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx
index 61a0aa6c1a8c0..0ae19f07b449a 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx
@@ -41,19 +41,17 @@ export class ListScrollingExample extends React.Component<IListScrollingExampleP
     return (
       <FocusZone direction={ FocusZoneDirection.vertical }>
         <div>
-          <DefaultButton onClick={ () => this._scrollRelative(-10) }>-10</DefaultButton>
-          <DefaultButton onClick={ () => this._scrollRelative(-1) }>-1</DefaultButton>
-          <DefaultButton onClick={ () => this._scrollRelative(1) }>+1</DefaultButton>
-          <DefaultButton onClick={ () => this._scrollRelative(10) }>+10</DefaultButton>
+          <DefaultButton onClick={ this._scrollRelative(-10) }>-10</DefaultButton>
+          <DefaultButton onClick={ this._scrollRelative(-1) }>-1</DefaultButton>
+          <DefaultButton onClick={ this._scrollRelative(1) }>+1</DefaultButton>
+          <DefaultButton onClick={ this._scrollRelative(10) }>+10</DefaultButton>
         </div>
 
         <div>
           Scroll item index:
           <TextField
             value={ this.state.selectedIndex.toString(10) }
-            onChanged={ (value) => {
-              this._scroll(parseInt(value, 10) || 0);
-            } }
+            onChanged={ this._onChangeText }
           />
         </div>
 
@@ -61,36 +59,49 @@ export class ListScrollingExample extends React.Component<IListScrollingExampleP
           <List
             ref={ this._resolveList }
             items={ items }
-            getPageHeight={ (idx: number) => {
-              let h = 0;
-              for (let i = idx; i < idx + numberOfItemsOnPage; ++i) {
-                const isEvenRow = i % 2 === 0;
-
-                h += isEvenRow ? evenItemHeight : oddItemHeight;
-              }
-              return h;
-            } }
-            onRenderCell={ (item, index: number) => (
-              <div className='ms-ListScrollingExample-itemCell' data-is-focusable={ true }>
-                <div
-                  className={ css(
-                    'ms-ListScrollingExample-itemContent',
-                    (index % 2 === 0) && 'ms-ListScrollingExample-itemContent-even',
-                    (index % 2 === 1) && 'ms-ListScrollingExample-itemContent-odd'
-                  ) }
-                >
-                  { index } &nbsp; { item.name }
-                </div>
-              </div>
-            ) }
+            getPageHeight={ this._getPageHeight }
+            onRenderCell={ this._onRenderCell }
           />
         </div>
       </FocusZone>
     );
   }
 
-  private _scrollRelative(delta: number): void {
-    this._scroll(this.state.selectedIndex + delta);
+  private _getPageHeight(idx: number): number {
+    let h = 0;
+    for (let i = idx; i < idx + numberOfItemsOnPage; ++i) {
+      const isEvenRow = i % 2 === 0;
+
+      h += isEvenRow ? evenItemHeight : oddItemHeight;
+    }
+    return h;
+  }
+
+  @autobind
+  private _onChangeText(value: any): void {
+    this._scroll(parseInt(value, 10) || 0);
+  }
+
+  private _onRenderCell(item: any, index: number): JSX.Element {
+    return (
+      <div className='ms-ListScrollingExample-itemCell' data-is-focusable={ true }>
+        <div
+          className={ css(
+            'ms-ListScrollingExample-itemContent',
+            (index % 2 === 0) && 'ms-ListScrollingExample-itemContent-even',
+            (index % 2 === 1) && 'ms-ListScrollingExample-itemContent-odd'
+          ) }
+        >
+          { index } &nbsp; { item.name }
+        </div>
+      </div>
+    );
+  }
+
+  private _scrollRelative(delta: number): () => void {
+    return (): void => {
+      this._scroll(this.state.selectedIndex + delta);
+    };
   }
 
   private _scroll(index: number) {
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
index ae60abdc8be05..18332c57e66aa 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
@@ -3,6 +3,7 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
 import {
+  autobind,
   css,
   createArray
 } from 'office-ui-fabric-react/lib/Utilities';
@@ -63,7 +64,7 @@ export class MarqueeSelectionBasicExample extends React.Component<{}, IMarqueeSe
         <Checkbox
           label='Is marquee enabled'
           defaultChecked={ true }
-          onChange={ (ev, isMarqueeEnabled) => this.setState({ isMarqueeEnabled: isMarqueeEnabled! }) }
+          onChange={ this._onChange }
         />
         <p>Drag a rectangle around the items below to select them:</p>
         <ul className='ms-MarqueeSelectionBasicExample-photoList'>
@@ -76,7 +77,7 @@ export class MarqueeSelectionBasicExample extends React.Component<{}, IMarqueeSe
               ) }
               data-is-focusable={ true }
               data-selection-index={ index }
-              onClick={ () => console.log('clicked') }
+              onClick={ this._log('clicked') }
               style={ { width: photo.width, height: photo.height } }
             >
               { index }
@@ -87,4 +88,14 @@ export class MarqueeSelectionBasicExample extends React.Component<{}, IMarqueeSe
     );
   }
 
+  private _log(text: string): () => void {
+    return (): void => {
+      console.log(text);
+    };
+  }
+
+  @autobind
+  private _onChange(ev: React.FormEvent<HTMLElement | HTMLInputElement>, isMarqueeEnabled: boolean | undefined): void {
+    this.setState({ isMarqueeEnabled: isMarqueeEnabled! });
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx
index 324ccbe124d2e..3d8d35360d86d 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx
@@ -7,6 +7,9 @@ import { Label } from 'office-ui-fabric-react/lib/Label';
 import { MessageBar, MessageBarType } from 'office-ui-fabric-react/lib/MessageBar';
 import './MessageBar.Basic.Example.scss';
 
+const log = (text: string): () => void =>
+  (): void => console.log(text);
+
 export const MessageBarBasicExample = () => (
   <div className='ms-BasicMessageBarsExample'>
     <Label>Info/Default MessageBar</Label>
@@ -16,7 +19,7 @@ export const MessageBarBasicExample = () => (
     <MessageBar
       messageBarType={ MessageBarType.error }
       isMultiline={ false }
-      onDismiss={ () => { console.log('test'); } }
+      onDismiss={ log('test') }
     >
       Error - lorem ipsum dolor sit amet, a elit sem interdum consectetur adipiscing elit. <Link href='www.bing.com'>Visit our website</Link>
     </MessageBar>
@@ -25,7 +28,7 @@ export const MessageBarBasicExample = () => (
     <MessageBar
       messageBarType={ MessageBarType.blocked }
       isMultiline={ false }
-      onDismiss={ () => { console.log('test'); } }
+      onDismiss={ log('test') }
     >
       Blocked - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi luctus, purus a lobortis tristique, odio augue pharetra metus, ac placerat nunc mi nec dui. Vestibulum aliquam et nunc semper scelerisque. Curabitur vitae orci nec quam condimentum porttitor et sed lacus. Vivamus ac efficitur leo. Cras faucibus mauris libero, ac placerat erat euismod et. Donec pulvinar commodo odio sit amet faucibus. In hac habitasse platea dictumst. Duis eu ante commodo, condimentum nibh pellentesque, laoreet enim. Fusce massa lorem, ultrices eu mi a, fermentum suscipit magna. Integer porta purus pulvinar, hendrerit felis eget, condimentum mauris. <Link href='www.bing.com'>Visit our website</Link>
     </MessageBar>
@@ -60,7 +63,7 @@ export const MessageBarBasicExample = () => (
 
     <Label>Warning MessageBar</Label>
     <MessageBar
-      onDismiss={ () => { console.log('test'); } }
+      onDismiss={ log('test') }
       messageBarType={ MessageBarType.warning }
       ariaLabel='Aria help text here'
       actions={
diff --git a/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.FabricDemoApp.Example.tsx b/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.FabricDemoApp.Example.tsx
index 9598b22e54d02..f8de41dab438c 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.FabricDemoApp.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.FabricDemoApp.Example.tsx
@@ -8,14 +8,18 @@ export class NavFabricDemoAppExample extends React.Component<any, any> {
     return (
       <Nav
         groups={ AppDefinition.examplePages }
-        onRenderLink={ (link: any) => ([
-          <span key={ 1 } className='Nav-linkText'>{ link.name }</span>,
-          (link.status !== undefined ?
-            <span key={ 2 } className={ 'Nav-linkFlair ' + 'is-state' + link.status } >{ ExampleStatus[link.status] }</span> :
-            null)
-        ]) }
+        onRenderLink={ this._onRenderLink }
       />
     );
   }
 
+  private _onRenderLink(link: any): (JSX.Element | null)[] {
+    return ([
+      <span key={ 1 } className='Nav-linkText'>{ link.name }</span>,
+      (link.status !== undefined ?
+        <span key={ 2 } className={ 'Nav-linkFlair ' + 'is-state' + link.status } >{ ExampleStatus[link.status] }</span> :
+        null)
+    ]);
+  }
+
 }
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Basic.Example.tsx
index 6bd3a19c07d44..4eaef3e1be1f5 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Basic.Example.tsx
@@ -5,6 +5,7 @@ import { BaseComponent, css } from 'office-ui-fabric-react/lib/Utilities';
 import { IconButton } from 'office-ui-fabric-react/lib/Button';
 import { Link } from 'office-ui-fabric-react/lib/Link';
 import {
+  IOverflowSetItemProps,
   OverflowSet
 } from 'office-ui-fabric-react/lib/OverflowSet';
 
@@ -47,25 +48,29 @@ export class OverflowSetBasicExample extends BaseComponent<any, any> {
           }
         ]
         }
-        onRenderOverflowButton={ (overflowItems) => {
-          return (
-            <IconButton
-              className={ css(styles.overflowButton) }
-              iconProps={ { iconName: 'More' } }
-              menuIconProps={ undefined }
-              menuProps={ { items: overflowItems! } }
-            />
-          );
-        } }
-        onRenderItem={ (item) => {
-          return (
-            <Link
-              className={ css(styles.overflowLinks) }
-              onClick={ item.onClick }
-            >{ item.name }
-            </Link>
-          );
-        } }
+        onRenderOverflowButton={ this._onRenderOverflowButton }
+        onRenderItem={ this._onRenderItem }
+      />
+    );
+  }
+
+  private _onRenderItem(item: IOverflowSetItemProps): JSX.Element {
+    return (
+      <Link
+        className={ css(styles.overflowLinks) }
+        onClick={ item.onClick }
+      >{ item.name }
+      </Link>
+    );
+  }
+
+  private _onRenderOverflowButton(overflowItems: any[] | undefined): JSX.Element {
+    return (
+      <IconButton
+        className={ css(styles.overflowButton) }
+        iconProps={ { iconName: 'More' } }
+        menuIconProps={ undefined }
+        menuProps={ { items: overflowItems! } }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx
index 0dac778781b5a..9f008d0a9f786 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx
@@ -5,6 +5,7 @@ import { BaseComponent, css } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { SearchBox } from 'office-ui-fabric-react/lib/SearchBox';
 import {
+  IOverflowSetItemProps,
   OverflowSet
 } from 'office-ui-fabric-react/lib/OverflowSet';
 
@@ -110,30 +111,34 @@ export class OverflowSetCustomExample extends BaseComponent<any, any> {
           }
         ]
         }
-        onRenderOverflowButton={ (overflowItems) => {
-          return (
-            <DefaultButton
-              className={ css(styles.overflowButton) }
-              iconProps={ { iconName: 'More' } }
-              menuIconProps={ undefined }
-              menuProps={ { items: overflowItems! } }
-            />
-          );
-        } }
-        onRenderItem={ (item) => {
-          if (item.onRender) {
-            return (
-              item.onRender(item)
-            );
-          }
-          return (
-            <DefaultButton
-              iconProps={ { iconName: item.icon } }
-              menuProps={ item.subMenuProps }
-              text={ item.name }
-            />
-          );
-        } }
+        onRenderOverflowButton={ this._onRenderOverflowButton }
+        onRenderItem={ this._onRenderItem }
+      />
+    );
+  }
+
+  private _onRenderItem(item: IOverflowSetItemProps): JSX.Element {
+    if (item.onRender) {
+      return (
+        item.onRender(item)
+      );
+    }
+    return (
+      <DefaultButton
+        iconProps={ { iconName: item.icon } }
+        menuProps={ item.subMenuProps }
+        text={ item.name }
+      />
+    );
+  }
+
+  private _onRenderOverflowButton(overflowItems: any[] | undefined): JSX.Element {
+    return (
+      <DefaultButton
+        className={ css(styles.overflowButton) }
+        iconProps={ { iconName: 'More' } }
+        menuIconProps={ undefined }
+        menuProps={ { items: overflowItems! } }
       />
     );
   }

From c6c23967f279d9fad26005800628a2e98f3eb8f9 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Mon, 18 Sep 2017 19:22:02 -0500
Subject: [PATCH 0655/1641] SplitButton: Properly cascade container styles to
 the disabled state (#2817)

* SplitButton container styles

* Remove unused import

* Rush change
---
 ...plit-button-container-styles_2017-09-12-21-30.json | 11 +++++++++++
 .../src/components/Button/BaseButton.tsx              |  5 ++---
 .../Button/SplitButton/SplitButton.classNames.ts      |  2 ++
 3 files changed, 15 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/split-button-container-styles_2017-09-12-21-30.json

diff --git a/common/changes/office-ui-fabric-react/split-button-container-styles_2017-09-12-21-30.json b/common/changes/office-ui-fabric-react/split-button-container-styles_2017-09-12-21-30.json
new file mode 100644
index 0000000000000..fd0e38ce1a3b4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/split-button-container-styles_2017-09-12-21-30.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SplitButton: Properly cascade container styles to the disabled state",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 61bb2a57808c9..8bbe4045106aa 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -8,8 +8,7 @@ import {
   buttonProperties,
   getId,
   getNativeProps,
-  KeyCodes,
-  css,
+  KeyCodes
 } from '../../Utilities';
 import { mergeStyles, hideText } from '../../Styling';
 import { Icon, IIconProps } from '../../Icon';
@@ -376,7 +375,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         aria-expanded={ this._isExpanded }
         aria-pressed={ this.props.checked }
         aria-describedby={ buttonProps.ariaDescription }
-        className={ css(disabled ? styles!.splitButtonContainerDisabled : styles!.splitButtonContainer) }
+        className={ classNames && classNames.splitButtonContainer }
         tabIndex={ 0 }
         onKeyDown={ this.props.disabled ? undefined : this._onSplitButtonKeyDown }
         ref={ this._resolveRef('_splitButtonContainer') }
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts
index 87e1d8f70e05d..23dd5906cde21 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts
@@ -5,6 +5,7 @@ import { IButtonStyles } from '../Button.Props';
 export interface ISplitButtonClassNames {
   root?: string;
   icon?: string;
+  splitButtonContainer?: string;
   flexContainer?: string;
   divider?: string;
 }
@@ -28,6 +29,7 @@ export const getClassNames = memoizeFunction((
         styles.splitButtonMenuButtonChecked
       ]
     ) as string,
+    splitButtonContainer: mergeStyles(styles.splitButtonContainer, disabled && [styles.splitButtonContainerDisabled]) as string,
     icon: (disabled ? mergeStyles(styles.splitButtonMenuIcon, styles.splitButtonMenuIconDisabled) : styles.splitButtonMenuIcon) as string,
     flexContainer: styles.splitButtonFlexContainer as string,
     divider: styles.splitButtonDivider as string

From 3bb193abf39423d1e9a6701789b16aad5363ce0c Mon Sep 17 00:00:00 2001
From: John Miller <rubixws@gmail.com>
Date: Mon, 18 Sep 2017 21:07:38 -0700
Subject: [PATCH 0656/1641] Added label to Persona example Component in website
 (#2631) (#2869)

* Added label to Persona example Component in website (#2631)

* Added label to Persona Example and respaced to fit

* Added change file

* Added non ms- class for label

* Added missing Label tag
---
 .../add-persona-label_2017-08-25-18-24.json      | 11 +++++++++++
 .../Persona/examples/Persona.Basic.Example.tsx   | 16 ++++++++++++++++
 .../Persona/examples/PersonaExample.scss         |  4 ++++
 3 files changed, 31 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/add-persona-label_2017-08-25-18-24.json

diff --git a/common/changes/office-ui-fabric-react/add-persona-label_2017-08-25-18-24.json b/common/changes/office-ui-fabric-react/add-persona-label_2017-08-25-18-24.json
new file mode 100644
index 0000000000000..4ebb80707666b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/add-persona-label_2017-08-25-18-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added label to Persona example components.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
index bc82072c81efb..c0489ef1f74c1 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
@@ -5,6 +5,7 @@ import {
   PersonaPresence
 } from 'office-ui-fabric-react/lib/Persona';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
+import { Label } from 'office-ui-fabric-react/lib/Label';
 import { TestImages } from '../../../common/TestImages';
 
 const examplePersona = {
@@ -37,47 +38,62 @@ export class PersonaBasicExample extends React.Component<React.Props<PersonaBasi
           />
         </div>
 
+        <Label className='example-label'>Tiny Persona (12px)</Label>
         <Persona
           { ...examplePersona }
           size={ PersonaSize.tiny }
           presence={ PersonaPresence.offline }
           hidePersonaDetails={ !renderPersonaDetails }
         />
+
+        <Label className='example-label'>Extra Extra Small Persona (24px)</Label>
         <Persona
           { ...examplePersona }
           size={ PersonaSize.extraExtraSmall }
           presence={ PersonaPresence.none }
           hidePersonaDetails={ !renderPersonaDetails }
         />
+
+        <Label className='example-label'>Size 28 Persona (28px)</Label>
         <Persona
           { ...examplePersona }
           size={ PersonaSize.size28 }
           presence={ PersonaPresence.none }
           hidePersonaDetails={ !renderPersonaDetails }
         />
+
+        <Label className='example-label'>Extra Small Persona (32px)</Label>
         <Persona
           { ...examplePersona }
           size={ PersonaSize.extraSmall }
           presence={ PersonaPresence.online }
           hidePersonaDetails={ !renderPersonaDetails }
         />
+
+        <Label className='example-label'>Small Persona (40px)</Label>
         <Persona
           { ...examplePersona }
           size={ PersonaSize.small }
           presence={ PersonaPresence.away }
           hidePersonaDetails={ !renderPersonaDetails }
         />
+
+        <Label className='example-label'>Medium Persona (48px)</Label>
         <Persona
           { ...examplePersona }
           hidePersonaDetails={ !renderPersonaDetails }
           presence={ PersonaPresence.busy }
         />
+
+        <Label className='example-label'>Large Persona (72px)</Label>
         <Persona
           { ...examplePersona }
           size={ PersonaSize.large }
           presence={ PersonaPresence.dnd }
           hidePersonaDetails={ !renderPersonaDetails }
         />
+
+        <Label className='example-label'>Extra Large Persona (100px)</Label>
         <Persona
           { ...examplePersona }
           size={ PersonaSize.extraLarge }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/PersonaExample.scss b/packages/office-ui-fabric-react/src/components/Persona/examples/PersonaExample.scss
index dbf7aec425b85..eacbd1da8d60c 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/PersonaExample.scss
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/PersonaExample.scss
@@ -2,4 +2,8 @@
   .ms-JobIconExample {
     margin-right: 5px;
   }
+
+  .example-label {
+    margin: 10px 0;
+  }
 }
\ No newline at end of file

From c258bfc71bb9d3a9aca60d75553d1db57410a343 Mon Sep 17 00:00:00 2001
From: John Miller <rubixws@gmail.com>
Date: Mon, 18 Sep 2017 22:20:14 -0700
Subject: [PATCH 0657/1641] Removed JS References from the fabric website and
 corresponding component pages. (#2870)

* Fixing conflicts with component pages

* Jsx tag

* Jsx tag

* Jsx tag

* Jsx tag

* Jsx tag

* Jsx tag

* Jsx tag

* Jsx tag

* Jsx tag

* Jsx tag

* Jsx tag

* Jsx tag

* Jsx tag

* Jsx tag

* Jsx tag

* Jsx tag

* Jsx tag

* Jsx tag

* Jsx tag

* Jsx tag

* Jsx tag

* Jsx tag

* Jsx tag

* Jsx tag
---
 apps/fabric-website/package.json                |  2 +-
 .../src/pages/GetStarted/GetStartedPage.tsx     | 17 +++--------------
 .../src/pages/HomePage/HomePage.tsx             |  7 +------
 .../src/pages/Overviews/ComponentsPage.tsx      |  4 ++--
 .../src/pages/Overviews/StylesPage.tsx          |  4 ++--
 ...lynam-rm-fabricjs-refs_2017-08-24-18-05.json | 11 +++++++++++
 .../components/Breadcrumb/BreadcrumbPage.tsx    |  5 +----
 .../src/components/Button/ButtonPage.tsx        |  5 +----
 .../src/components/Callout/CalloutPage.tsx      |  5 +----
 .../src/components/Checkbox/CheckboxPage.tsx    |  3 ---
 .../components/ChoiceGroup/ChoiceGroupPage.tsx  |  3 ---
 .../src/components/ComboBox/ComboBoxPage.tsx    |  3 ---
 .../components/CommandBar/CommandBarPage.tsx    |  3 ---
 .../ContextualMenu/ContextualMenuPage.tsx       |  3 ---
 .../components/DatePicker/DatePickerPage.tsx    |  3 ---
 .../src/components/Dialog/DialogPage.tsx        |  3 ---
 .../src/components/Dropdown/DropdownPage.tsx    |  3 ---
 .../src/components/Facepile/FacepilePage.tsx    |  3 ---
 .../src/components/Label/LabelPage.tsx          |  3 ---
 .../src/components/Link/LinkPage.tsx            |  3 ---
 .../src/components/List/ListPage.tsx            |  3 ---
 .../components/MessageBar/MessageBarPage.tsx    |  3 ---
 .../src/components/Overlay/OverlayPage.tsx      |  3 ---
 .../src/components/Panel/PanelPage.tsx          |  3 ---
 .../src/components/Persona/PersonaPage.tsx      |  3 ---
 .../src/components/Pivot/PivotPage.tsx          |  3 ---
 .../ProgressIndicator/ProgressIndicatorPage.tsx |  3 ---
 .../src/components/SearchBox/SearchBoxPage.tsx  |  3 ---
 .../components/SpinButton/SpinButtonPage.tsx    |  3 ---
 .../src/components/Spinner/SpinnerPage.tsx      |  3 ---
 .../SwatchColorPicker/SwatchColorPickerPage.tsx |  3 ---
 .../src/components/TextField/TextFieldPage.tsx  |  3 ---
 .../src/components/Toggle/TogglePage.tsx        |  3 ---
 .../pickers/PeoplePicker/PeoplePickerPage.tsx   |  5 +----
 34 files changed, 24 insertions(+), 113 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/emlynam-rm-fabricjs-refs_2017-08-24-18-05.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index f9a491a336813..7eaa7e4307bc6 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -47,4 +47,4 @@
     "office-ui-fabric-react": ">=4.48.0 <5.0.0",
     "tslib": "^1.7.1"
   }
-}
\ No newline at end of file
+}
diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
index 652b4bdd1d8e5..2ea0b5d2f889c 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
@@ -72,7 +72,7 @@ export class GetStartedPage extends React.Component<any, any> {
             </div>
             <div className={ diagramStyles.or }>or</div>
             <ul className={ diagramStyles.components }>
-              <li className={ css(diagramStyles.component, diagramStyles.featuredComponent) }>
+              <li className={ diagramStyles.component }>
                 <div className={ diagramStyles.graphics }>
                   <img className={ diagramStyles.componentImage } src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/diagram-components-many.svg' } width='175' height='90' alt='Illustrated Diagram of many components' />
                   <img className={ diagramStyles.coreImage } src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/diagram-core.svg' } alt='Illustrated representation of Fabric cores styles and libraries.' />
@@ -83,17 +83,6 @@ export class GetStartedPage extends React.Component<any, any> {
                   <a href='#/components'>See components</a>
                 </div>
               </li>
-              <li className={ diagramStyles.component }>
-                <div className={ diagramStyles.graphics }>
-                  <img className={ diagramStyles.componentImage } src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/diagram-components-few.svg' } width='175' height='90' alt='Illustrated Diagram of few components' />
-                  <img className={ diagramStyles.coreImage } src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/diagram-core.svg' } alt='Illustrated representation of Fabric cores styles and libraries.' />
-                </div>
-                <div className={ diagramStyles.content }>
-                  <span className={ diagramStyles.headline }>Fabric JS</span>
-                  <span className={ diagramStyles.description }>Simple, visuals-focused components that you can extend, rework, and use</span>
-                  <a href='#/fabric-js'>Learn more</a>
-                </div>
-              </li>
               <li className={ diagramStyles.component }>
                 <div className={ diagramStyles.graphics }>
                   <img className={ diagramStyles.componentImage } src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/diagram-components-few.svg' } width='175' height='90' alt='Illustrated Diagram of few components' />
@@ -182,7 +171,7 @@ ReactDOM.render(<MyPage />, document.body.firstChild);`
                   `<span class="ms-font-su ms-fontColor-themePrimary">Big blue text</span>`
                 }
               </CodeBlock>
-              <p>To reference all the assets available in Fabric Core, see the <a href='#/styles'>styles page</a>. To use components, see <a href='#/get-started#react'>Fabric React</a>, <a href='#/fabric-js'>Fabric JS</a>, or <a href='#/angular-js'>ngOfficeUIFabric</a>.</p>
+              <p>To reference all the assets available in Fabric Core, see the <a href='#/styles'>styles page</a>. To use components, see <a href='#/get-started#react'>Fabric React</a> or <a href='#/angular-js'>ngOfficeUIFabric</a>.</p>
             </li>
           </ol>
 
@@ -199,4 +188,4 @@ ReactDOM.render(<MyPage />, document.body.firstChild);`
     );
   }
 
-}
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/pages/HomePage/HomePage.tsx b/apps/fabric-website/src/pages/HomePage/HomePage.tsx
index ef78accc2db11..a6a1b10742fd7 100644
--- a/apps/fabric-website/src/pages/HomePage/HomePage.tsx
+++ b/apps/fabric-website/src/pages/HomePage/HomePage.tsx
@@ -23,11 +23,6 @@ export class HomePage extends React.Component<any, any> {
             <span className={ styles.flavorDescription }>Fabric&rsquo;s robust, up-to-date components are built with React</span>
             <a href='#/components' className={ styles.button }>See components</a>
           </div>
-          <div className={ styles.flavor }>
-            <span className={ styles.flavorTitle }>Fabric JS</span>
-            <span className={ styles.flavorDescription }>Lightweight and simple components in vanilla JavaScript</span>
-            <a href='#/fabric-js'>Learn more</a>
-          </div>
           <div className={ styles.flavor }>
             <span className={ styles.flavorTitle }>AngularJS</span>
             <span className={ styles.flavorDescription }>Community-driven project for Angular apps</span>
@@ -91,4 +86,4 @@ export class HomePage extends React.Component<any, any> {
     );
   }
 
-}
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/pages/Overviews/ComponentsPage.tsx b/apps/fabric-website/src/pages/Overviews/ComponentsPage.tsx
index 20cc9086f7ece..fab9d0a7da145 100644
--- a/apps/fabric-website/src/pages/Overviews/ComponentsPage.tsx
+++ b/apps/fabric-website/src/pages/Overviews/ComponentsPage.tsx
@@ -23,11 +23,11 @@ export class ComponentsPage extends React.Component<any, any> {
             </li>
           </ul>
           <p>After you&rsquo;ve explored the components, <a href='#/get-started'>get started with Fabric React in your project</a>.</p>
-          <p>Fabric comes in many flavors so you can choose the one that works for you. Check out <a href='#/fabric-js'>Fabric JS</a>, <a href='#/angular-js'>ngOfficeUIFabric</a>, and <a href='#/fabric-ios'>Fabric iOS</a> to learn more about each option.</p>
+          <p>Fabric comes in many flavors so you can choose the one that works for you. Check out <a href='#/angular-js'>ngOfficeUIFabric</a> and <a href='#/fabric-ios'>Fabric iOS</a> to learn more about each option.</p>
           <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/components-header.svg' } width='284' height='388' alt='Illustrated representation of a DatePicker and Persona list control.' />
         </div>
       </div>
     );
   }
 
-}
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/pages/Overviews/StylesPage.tsx b/apps/fabric-website/src/pages/Overviews/StylesPage.tsx
index 7f6c87858c733..755bc3a65a7e3 100644
--- a/apps/fabric-website/src/pages/Overviews/StylesPage.tsx
+++ b/apps/fabric-website/src/pages/Overviews/StylesPage.tsx
@@ -21,7 +21,7 @@ export class StylesPage extends React.Component<any, any> {
               <span className={ styles.description }>Making a custom component? These elements of our design language help you get started.</span>
             </li>
           </ul>
-          <p>You can get the core styling with <a href='#/get-started#react'>Fabric React</a>, <a href='#/fabric-js'>Fabric JS</a>, or just <a href='#/get-started#core'>Fabric Core</a> on its own.</p>
+          <p>You can get the core styling with <a href='#/get-started#react'>Fabric React</a> or just <a href='#/get-started#core'>Fabric Core</a> on its own.</p>
           <p>Fabric&rsquo;s components use the core styling. To learn more about the fully-styled controls, check out the <a href='#/components'>components</a> page.</p>
           <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/styles-header.svg' } width='225' height='388' alt='Graphic showing elements of color and type' />
         </div>
@@ -29,4 +29,4 @@ export class StylesPage extends React.Component<any, any> {
     );
   }
 
-}
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/emlynam-rm-fabricjs-refs_2017-08-24-18-05.json b/common/changes/@uifabric/fabric-website/emlynam-rm-fabricjs-refs_2017-08-24-18-05.json
new file mode 100644
index 0000000000000..4bc0c3e69f3ce
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/emlynam-rm-fabricjs-refs_2017-08-24-18-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Removed references to FabricJS from the website.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx
index 0a793af047cfa..c7289e8c8e0df 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx
@@ -51,9 +51,6 @@ export class BreadcrumbPage extends React.Component<IComponentDemoPageProps, any
             <p>Breadcrumbs are typically placed, in horizontal form, under the masthead or navigation of an experience, above the primary content area.</p>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/Breadcrumb/Breadcrumb.html'>Fabric JS</a>
-        }
         bestPractices={
           <div />
         }
@@ -75,4 +72,4 @@ export class BreadcrumbPage extends React.Component<IComponentDemoPageProps, any
       />
     );
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
index 07941f8a4e0cc..566f2c4964250 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
@@ -108,9 +108,6 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
             <p>Note that both iconProps and menuIconProps take <Link href='#/examples/icon'>IIconProps</Link> to specify name and type.</p>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/Button/Button.html'>Fabric JS</a>
-        }
         bestPractices={
           <div />
         }
@@ -158,4 +155,4 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
       areButtonsChecked: toggled
     });
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
index f7d3d9b779e2d..6c5e8b2859112 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
@@ -60,9 +60,6 @@ export class CalloutPage extends React.Component<IComponentDemoPageProps, any> {
             <p>Real-world examples of this implementation can be seen in administrative interfaces where a particularly difficult-to-understand concept is paired with the iconClassNames.info "i" icon. In this example, Callout - with its tip text - is opened when the user clicks on or hovers over the icon.</p>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/Callout/Callout.html'>Fabric JS</a>
-        }
         bestPractices={
           <div />
         }
@@ -96,4 +93,4 @@ export class CalloutPage extends React.Component<IComponentDemoPageProps, any> {
       />
     );
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx
index 68fca4a8e6ef6..33a4d32388da8 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx
@@ -69,9 +69,6 @@ export class CheckboxPage extends React.Component<IComponentDemoPageProps, any>
             </ul>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/CheckBox/CheckBox.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx
index 08701ebd9fd40..ae5598ea478a2 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx
@@ -83,9 +83,6 @@ export class ChoiceGroupPage extends React.Component<IComponentDemoPageProps, {}
             </ul>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/ChoiceFieldGroup/ChoiceFieldGroup.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
index 6e60cf21b5ed5..a6d243b2ad99e 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
@@ -56,9 +56,6 @@ export class ComboBoxPage extends React.Component<IComponentDemoPageProps, {}> {
         donts={
           <div />
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/ComboBox/ComboBox.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx
index 7f27fc79af71a..60bd7f60a3292 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx
@@ -79,9 +79,6 @@ export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}>
             </ul>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/CommandBar/CommandBar.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
index 88676c60a381c..b5c042a74db86 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
@@ -91,9 +91,6 @@ export class ContextualMenuPage extends React.Component<IComponentDemoPageProps,
             </ul>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/ContextualMenu/ContextualMenu.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
index 7199233a1a936..0a9e13069016e 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
@@ -70,9 +70,6 @@ export class DatePickerPage extends React.Component<IComponentDemoPageProps, {}>
             </ul>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/DatePicker/DatePicker.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx
index 89670988fd681..324497073f1d2 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx
@@ -79,9 +79,6 @@ export class DialogPage extends React.Component<IComponentDemoPageProps, {}> {
             </ul>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/Dialog/Dialog.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
index f9c397e5a70a7..ea8f7ebe7002f 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
@@ -59,9 +59,6 @@ export class DropdownPage extends React.Component<IComponentDemoPageProps, {}> {
         donts={
           <div />
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/Dropdown/Dropdown.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx b/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx
index b5e634b35ce07..9139390919b3c 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx
@@ -96,9 +96,6 @@ export class FacepilePage extends React.Component<IComponentDemoPageProps, {}> {
             </ul>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/FacePile/FacePile.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx b/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx
index 7b566e2bc285e..0663e0a484c6c 100644
--- a/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx
@@ -54,9 +54,6 @@ export class LabelPage extends React.Component<IComponentDemoPageProps, any> {
             </ul>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/Label/Label.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx b/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx
index a856149693b35..075fd74b2ef60 100644
--- a/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx
@@ -60,9 +60,6 @@ export class LinkPage extends React.Component<IComponentDemoPageProps, {}> {
             </ul>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/Link/Link.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/List/ListPage.tsx b/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
index eef31c5171ccf..ac8fcc5c5e0c2 100644
--- a/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
@@ -61,9 +61,6 @@ export class ListPage extends React.Component<IComponentDemoPageProps, {}> {
             </p>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/List/List.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBarPage.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBarPage.tsx
index 3657c164f49fe..7cff834bfd0c4 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBarPage.tsx
@@ -59,9 +59,6 @@ export class MessageBarPage extends React.Component<IComponentDemoPageProps, {}>
             </ul>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/MessageBar/MessageBar.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx b/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx
index 87d83683343a6..8d5a1ae00944e 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx
@@ -59,9 +59,6 @@ export class OverlayPage extends React.Component<IComponentDemoPageProps, {}> {
             </ul>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/Overlay/Overlay.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx b/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
index 1c35b49980fd5..a0fda6c363889 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
@@ -116,9 +116,6 @@ export class PanelPage extends React.Component<IComponentDemoPageProps, {}> {
             </ul>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/Panel/Panel.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
index 94ac8fde15e53..f139d501599b6 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
@@ -71,9 +71,6 @@ export class PersonaPage extends React.Component<IComponentDemoPageProps, {}> {
             </ul>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/Persona/Persona.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx b/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx
index 1325185073ee1..bc872cb3de80d 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx
@@ -113,9 +113,6 @@ export class PivotPage extends React.Component<IComponentDemoPageProps, {}> {
             </ul>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/Pivot/Pivot.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx
index cd177bdbac15d..58ac0c3ea94bc 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx
@@ -77,9 +77,6 @@ export class ProgressIndicatorPage extends React.Component<IComponentDemoPagePro
             </ul>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/ProgressIndicator/ProgressIndicator.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
index c0d402f01eeb1..73b7d690e1267 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
@@ -117,9 +117,6 @@ export class SearchBoxPage extends React.Component<IComponentDemoPageProps, {}>
             </ul>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/SearchBox/SearchBox.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
index 83a1f8acde28b..c707f1de202fa 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
@@ -100,9 +100,6 @@ export class SpinButtonPage extends React.Component<IComponentDemoPageProps, {}>
             </ul>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/SpinButton/SpinButton.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/SpinnerPage.tsx b/packages/office-ui-fabric-react/src/components/Spinner/SpinnerPage.tsx
index 92461ca532e1d..c8a1837f67241 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/SpinnerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Spinner/SpinnerPage.tsx
@@ -59,9 +59,6 @@ export class SpinnerPage extends React.Component<IComponentDemoPageProps, {}> {
             </ul>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/Spinner/Spinner.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx
index 1934695fb57b3..c701ca3cec469 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx
@@ -49,9 +49,6 @@ export class SwatchColorPickerPage extends React.Component<IComponentDemoPagePro
             </ul>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/SwatchColorPicker/SwatchColorPicker.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
index ae76cc9b7a10e..e417e2fc7be4e 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
@@ -73,9 +73,6 @@ export class TextFieldPage extends React.Component<IComponentDemoPageProps, {}>
             </ul>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/TextField/TextField.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
index 53a733bafacae..8b64e691b47ca 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
@@ -66,9 +66,6 @@ export class TogglePage extends React.Component<IComponentDemoPageProps, {}> {
             </ul>
           </div>
         }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/Toggle/Toggle.html'>Fabric JS</a>
-        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerPage.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerPage.tsx
index 4822a1afb8edd..3c38f8d37ea7f 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerPage.tsx
@@ -37,9 +37,6 @@ export class PeoplePickerPage extends React.Component<IComponentDemoPageProps, {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
-        related={
-          <a href='https://dev.office.com/fabric-js/Components/PeoplePicker/PeoplePicker.html'>Fabric JS</a>
-        }
         bestPractices={
           <div>The PeoplePicker is used to select one or more entities, such as people or groups. Entry points for PeoplePickers are typically specialized TextField-like input fields known as a "well", which are used to search for recipients from a list. When a recipient is selected from the list, it is added to the well as a specialized Persona that can be interacted with or removed. Clicking on a Persona from the well should invoke a PersonaCard or open a profile pane for that recipient.</div>
         }
@@ -66,4 +63,4 @@ export class PeoplePickerPage extends React.Component<IComponentDemoPageProps, {
     );
   }
 
-}
+}
\ No newline at end of file

From 726a015a94fb23c229784649926901665c3d9d8f Mon Sep 17 00:00:00 2001
From: John Miller <rubixws@gmail.com>
Date: Mon, 18 Sep 2017 22:44:03 -0700
Subject: [PATCH 0658/1641] Cleaning up component samples including shared
 language and spacing. (#2871)

* Resolving conflicts with Component pages

* Removed trailing whitespace and unused import

* Fixed jsx alignment

* Fixed jsx alignment

* Removed rogue blank line

* Fixed jsx alignment

* Jsx alignment and trailing whitespace

* Aligned tag

* Closing tag alignment

* Removed forbidden bind

* Removed forbidden bind

* Added missing Label import
---
 ...red-component-styles_2017-08-31-17-18.json | 11 +++++++++++
 .../components/ExampleCard/ExampleCard.scss   |  2 +-
 .../src/common/_exampleStyles.scss            | 11 +++++++++++
 .../src/common/_variables.scss                |  2 ++
 .../components/Breadcrumb/BreadcrumbPage.tsx  |  4 ++--
 .../examples/Breadcrumb.Basic.Example.tsx     | 10 +++++++---
 .../src/components/Button/ButtonPage.tsx      | 19 ++++++++++++++-----
 .../src/components/Callout/CalloutPage.tsx    |  8 ++++----
 .../examples/Callout.Directional.Example.tsx  | 10 ++++++++--
 .../ChoiceGroup/ChoiceGroupPage.tsx           |  8 ++++----
 .../examples/ChoiceGroup.Basic.Example.tsx    | 18 ------------------
 .../ColorPicker/ColorPickerPage.tsx           |  4 ++--
 .../ContextualMenu/ContextualMenuPage.tsx     | 10 +++++-----
 .../ContextualMenu.Directional.Example.tsx    | 15 +++++++++++++--
 .../components/DatePicker/DatePickerPage.tsx  |  4 ++--
 .../examples/Facepile.Basic.Example.tsx       |  2 ++
 .../Layer/examples/Layer.Basic.Example.tsx    |  2 ++
 .../Layer/examples/Layer.Hosted.Example.tsx   |  4 +++-
 .../MarqueeSelection.Basic.Example.tsx        |  2 ++
 .../examples/Persona.Basic.Example.tsx        |  4 +++-
 .../examples/Picker.CustomResult.Example.tsx  |  9 ++++++++-
 .../examples/TagPicker.Basic.Example.tsx      |  8 +++++++-
 22 files changed, 113 insertions(+), 54 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/shared-component-styles_2017-08-31-17-18.json
 create mode 100644 packages/office-ui-fabric-react/src/common/_exampleStyles.scss
 create mode 100644 packages/office-ui-fabric-react/src/common/_variables.scss

diff --git a/common/changes/office-ui-fabric-react/shared-component-styles_2017-08-31-17-18.json b/common/changes/office-ui-fabric-react/shared-component-styles_2017-08-31-17-18.json
new file mode 100644
index 0000000000000..68c7b58e2a86e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/shared-component-styles_2017-08-31-17-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added shared styling to accommodate shared spacing between common elements in example components on the website. Also began to add consistency in the language.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/src/components/ExampleCard/ExampleCard.scss b/packages/example-app-base/src/components/ExampleCard/ExampleCard.scss
index f8a3dc776c802..1446d102617ee 100644
--- a/packages/example-app-base/src/components/ExampleCard/ExampleCard.scss
+++ b/packages/example-app-base/src/components/ExampleCard/ExampleCard.scss
@@ -2,7 +2,7 @@
 
 :global {
   .ExampleCard {
-    margin-bottom: 20px;
+    margin: 20px 0;
   }
 
   .ExampleCard-header {
diff --git a/packages/office-ui-fabric-react/src/common/_exampleStyles.scss b/packages/office-ui-fabric-react/src/common/_exampleStyles.scss
new file mode 100644
index 0000000000000..87d3d4dd23ed5
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/common/_exampleStyles.scss
@@ -0,0 +1,11 @@
+@import './variables';
+
+:global {
+  .exampleCheckbox {
+    margin: $exampleCheckbox-margin;
+  }
+
+  .exampleLabel {
+    margin: $exampleLabel-margin;
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/common/_variables.scss b/packages/office-ui-fabric-react/src/common/_variables.scss
new file mode 100644
index 0000000000000..01c323c17e05c
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/common/_variables.scss
@@ -0,0 +1,2 @@
+$exampleLabel-margin: 10px 0;
+$exampleCheckbox-margin: 10px 0;
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx
index c7289e8c8e0df..22e346b2d9a91 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx
@@ -25,13 +25,13 @@ export class BreadcrumbPage extends React.Component<IComponentDemoPageProps, any
         exampleCards={
           <div>
             <ExampleCard
-              title='Simple breadcrumb'
+              title='Default Breadcrumb'
               code={ BreadcrumbBasicExampleCode }
             >
               <BreadcrumbBasicExample />
             </ExampleCard>
             <ExampleCard
-              title='Static width'
+              title='Breadcrumb with static width '
               code={ BreadcrumbStaticExampleCode }
             >
               <BreadcrumbStaticExample />
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
index 760e17f23732c..7957a72d13c1f 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
@@ -4,10 +4,11 @@ import * as React from 'react';
 import {
   Breadcrumb, IBreadcrumbItem
 } from 'office-ui-fabric-react/lib/Breadcrumb';
-
 import {
   autobind
 } from '../../../Utilities';
+import { Label } from 'office-ui-fabric-react/lib/Label';
+import '../../../common/_exampleStyles.scss';
 
 export class BreadcrumbBasicExample extends React.Component<any, any> {
   constructor() {
@@ -17,6 +18,7 @@ export class BreadcrumbBasicExample extends React.Component<any, any> {
   public render() {
     return (
       <div>
+        <Label className='exampleLabel'>With maxDisplayedItems set to six</Label>
         <Breadcrumb
           items={ [
             { text: 'Files', 'key': 'Files', onClick: this._onBreadcrumbItemClicked },
@@ -24,11 +26,13 @@ export class BreadcrumbBasicExample extends React.Component<any, any> {
             { text: 'This is folder 2', 'key': 'f2', onClick: this._onBreadcrumbItemClicked },
             { text: 'This is folder 3', 'key': 'f3', onClick: this._onBreadcrumbItemClicked },
             { text: 'This is folder 4', 'key': 'f4', onClick: this._onBreadcrumbItemClicked },
-            { text: 'This is folder 5', 'key': 'f5', onClick: this._onBreadcrumbItemClicked, isCurrentItem: true },
+            { text: 'This is folder 5', 'key': 'f5', onClick: this._onBreadcrumbItemClicked, isCurrentItem: true }
           ] }
           maxDisplayedItems={ 6 }
           ariaLabel={ 'Website breadcrumb' }
         />
+
+        <Label className='exampleLabel'>With maxDisplayedItems set to three</Label>
         <Breadcrumb
           items={ [
             { text: 'Files', 'key': 'Files', href: '#/examples/breadcrumb', onClick: this._onBreadcrumbItemClicked },
@@ -36,7 +40,7 @@ export class BreadcrumbBasicExample extends React.Component<any, any> {
             { text: 'This is link 2', 'key': 'l2', href: '#/examples/breadcrumb', onClick: this._onBreadcrumbItemClicked },
             { text: 'This is link 3 with a long name', 'key': 'l3', href: '#/examples/breadcrumb', onClick: this._onBreadcrumbItemClicked },
             { text: 'This is link 4', 'key': 'l4', href: '#/examples/breadcrumb', onClick: this._onBreadcrumbItemClicked },
-            { text: 'This is link 5', 'key': 'l5', href: '#/examples/breadcrumb', onClick: this._onBreadcrumbItemClicked, isCurrentItem: true },
+            { text: 'This is link 5', 'key': 'l5', href: '#/examples/breadcrumb', onClick: this._onBreadcrumbItemClicked, isCurrentItem: true }
           ] }
           maxDisplayedItems={ 3 }
           ariaLabel={ 'Website breadcrumb' }
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
index 566f2c4964250..ef3ff8df0f777 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
@@ -17,6 +17,7 @@ import { ButtonScreenReaderExample } from './examples/Button.ScreenReader.Exampl
 import { ButtonSwapExample } from './examples/Button.Swap.Example';
 import { ButtonSplitExample, ButtonSplitCustomExample } from './examples/Button.Split.Example';
 import './examples/Button.Basic.Example.scss';
+import '../../common/_exampleStyles.scss';
 import { Link } from '../../Link';
 
 const ButtonDefaultExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx') as string;
@@ -51,11 +52,19 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
         componentName='ButtonExample'
         exampleCards={
           <div>
-            <div style={ { marginBottom: '20px' } }>
-              <Checkbox label='Disable buttons' checked={ this.state.areButtonsDisabled } onChange={ this._onDisabledChanged.bind(this) } />
-              <Checkbox label='Mark as checked' checked={ this.state.areButtonsChecked } onChange={ this._onToggledChanged.bind(this) } />
-            </div>
-            <ExampleCard title='Button' code={ ButtonDefaultExampleCode }>
+            <Checkbox
+              className='exampleCheckbox'
+              label='Disable buttons'
+              checked={ this.state.areButtonsDisabled }
+              onChange={ this._onDisabledChanged.bind(this) }
+            />
+            <Checkbox
+              className='exampleCheckbox'
+              label='Mark as checked'
+              checked={ this.state.areButtonsChecked }
+              onChange={ this._onToggledChanged.bind(this) }
+            />
+            <ExampleCard title='Default Button' code={ ButtonDefaultExampleCode }>
               <ButtonDefaultExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
             <ExampleCard title='Compound Button' code={ ButtonCompoundExampleCode }>
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
index 6c5e8b2859112..879034313bf17 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
@@ -27,16 +27,16 @@ export class CalloutPage extends React.Component<IComponentDemoPageProps, any> {
         componentName='CalloutExample'
         exampleCards={
           <div>
-            <ExampleCard title='Simple callout' code={ CalloutBasicExampleCode }>
+            <ExampleCard title='Default Callout' code={ CalloutBasicExampleCode }>
               <CalloutBasicExample />
             </ExampleCard>
-            <ExampleCard title='Nested callout... Callout with a commandbar with a sub menu' code={ CalloutNestedExampleCode }>
+            <ExampleCard title='Nested Callout... Callout with a commandbar with a sub menu' code={ CalloutNestedExampleCode }>
               <CalloutNestedExample { ...cmdBarParamsTextAndIcons } />
             </ExampleCard>
-            <ExampleCard title='Callout directional example' code={ CalloutDirectionalExampleCode }>
+            <ExampleCard title='Callout with directional hint' code={ CalloutDirectionalExampleCode }>
               <CalloutDirectionalExample />
             </ExampleCard>
-            <ExampleCard title='Callout cover example' code={ CalloutCoverExampleCode }>
+            <ExampleCard title='Callout with cover' code={ CalloutCoverExampleCode }>
               <CalloutCoverExample />
             </ExampleCard>
           </div>
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
index 3006a71438432..4fb43e17c1785 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
@@ -6,6 +6,7 @@ import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { Slider } from 'office-ui-fabric-react/lib/Slider';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import './CalloutExample.scss';
+import '../../../common/_exampleStyles.scss';
 
 export interface ICalloutDirectionalExampleState {
   isCalloutVisible?: boolean;
@@ -50,7 +51,12 @@ export class CalloutDirectionalExample extends React.Component<any, ICalloutDire
     return (
       <div className='ms-CalloutExample'>
         <div className='ms-CalloutExample-configArea'>
-          <Checkbox label='Show beak' checked={ isBeakVisible } onChange={ this._onShowBeakChange } />
+          <Checkbox
+            className='exampleCheckbox'
+            label='Show beak'
+            checked={ isBeakVisible }
+            onChange={ this._onShowBeakChange }
+          />
           <Slider
             max={ 30 }
             label='Gap Space'
@@ -149,4 +155,4 @@ export class CalloutDirectionalExample extends React.Component<any, ICalloutDire
       beakWidth: value
     });
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx
index ae5598ea478a2..de1fcc024933a 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx
@@ -23,16 +23,16 @@ export class ChoiceGroupPage extends React.Component<IComponentDemoPageProps, {}
         componentName='ChoiceGroupExample'
         exampleCards={
           <div>
-            <ExampleCard title='ChoiceGroups' code={ ChoiceGroupBasicExampleCode }>
+            <ExampleCard title='Default ChoiceGroup' code={ ChoiceGroupBasicExampleCode }>
               <ChoiceGroupBasicExample />
             </ExampleCard>
-            <ExampleCard title='ChoiceGroups' code={ ChoiceGroupCustomExampleCode }>
+            <ExampleCard title='ChoiceGroup with dropdown' code={ ChoiceGroupCustomExampleCode }>
               <ChoiceGroupCustomExample />
             </ExampleCard>
-            <ExampleCard title='ChoiceGroups using Images' code={ ChoiceGroupImageExampleCode }>
+            <ExampleCard title='ChoiceGroups with images' code={ ChoiceGroupImageExampleCode }>
               <ChoiceGroupImageExample />
             </ExampleCard>
-            <ExampleCard title='ChoiceGroups using Icons' code={ ChoiceGroupIconExampleCode }>
+            <ExampleCard title='ChoiceGroup with icons' code={ ChoiceGroupIconExampleCode }>
               <ChoiceGroupIconExample />
             </ExampleCard>
           </div>
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Basic.Example.tsx
index 4ff1b13133b11..ff3dbb5521e60 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Basic.Example.tsx
@@ -48,24 +48,6 @@ export class ChoiceGroupBasicExample extends React.Component<any, IChoiceGroupBa
           label='Pick one'
           required={ true }
         />
-        <ChoiceGroup
-          defaultSelectedKey='A'
-          options={ [
-            {
-              key: 'A',
-              text: 'Option A',
-              disabled: true
-            },
-            {
-              key: 'B',
-              text: 'Option B',
-              disabled: true
-            }
-          ] }
-          onChange={ this._onChange }
-          label='Pick one'
-          required={ true }
-        />
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPickerPage.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPickerPage.tsx
index aebc8ba34169a..a2290b0d58c4d 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPickerPage.tsx
@@ -17,7 +17,7 @@ export class ColorPickerPage extends React.Component<IComponentDemoPageProps, {}
         componentName='ColorPickerExample'
         exampleCards={
           <ExampleCard
-            title='ColorPicker'
+            title='Default ColorPicker'
             code={ ColorPickerBasicExampleCode }
           >
             <ColorPickerBasicExample />
@@ -37,4 +37,4 @@ export class ColorPickerPage extends React.Component<IComponentDemoPageProps, {}
       />
     );
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
index b5c042a74db86..b113111121291 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
@@ -27,22 +27,22 @@ export class ContextualMenuPage extends React.Component<IComponentDemoPageProps,
         componentName='ContextualMenuExample'
         exampleCards={
           <div>
-            <ExampleCard title='ContextualMenu' code={ ContextualMenuBasicExampleCode }>
+            <ExampleCard title='Default ContextualMenu' code={ ContextualMenuBasicExampleCode }>
               <ContextualMenuBasicExample />
             </ExampleCard>
             <ExampleCard title='ContextualMenu section example' code={ ContextualMenuSectionExampleCode }>
               <ContextualMenuSectionExample />
             </ExampleCard>
-            <ExampleCard title='ContextualMenu checked menus example' code={ ContextualMenuCheckmarksExampleCode }>
+            <ExampleCard title='ContextualMenu with checked menus' code={ ContextualMenuCheckmarksExampleCode }>
               <ContextualMenuCheckmarksExample />
             </ExampleCard>
-            <ExampleCard title='ContextualMenu beak/direction test' code={ ContextualMenuDirectionalExampleCode }>
+            <ExampleCard title='ContextualMenu with beak/direction test' code={ ContextualMenuDirectionalExampleCode }>
               <ContextualMenuDirectionalExample />
             </ExampleCard>
-            <ExampleCard title='ContextualMenu customization example' code={ ContextualMenuCustomizationExampleCode }>
+            <ExampleCard title='ContextualMenu wtih customization' code={ ContextualMenuCustomizationExampleCode }>
               <ContextualMenuCustomizationExample />
             </ExampleCard>
-            <ExampleCard title='ContextualMenu header example' code={ ContextualMenuHeaderExampleCode }>
+            <ExampleCard title='ContextualMenu with header' code={ ContextualMenuHeaderExampleCode }>
               <ContextualMenuHeaderExample />
             </ExampleCard>
           </div>
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
index 58e58a14137d2..648659b1d4eeb 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
@@ -7,6 +7,7 @@ import { Slider } from 'office-ui-fabric-react/lib/Slider';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
 import { autobind, getRTL } from 'office-ui-fabric-react/lib/Utilities';
 import './ContextualMenuExample.scss';
+import '../../../common/_exampleStyles.scss';
 
 export interface IContextualMenuDirectionalExampleState {
   isContextualMenuVisible?: boolean;
@@ -73,8 +74,18 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
     return (
       <div className='ms-ContextualMenuDirectionalExample'>
         <div className='ms-ContextualMenuDirectionalExample-configArea'>
-          <Checkbox label='Show beak' checked={ isBeakVisible } onChange={ this._onShowBeakChange } />
-          <Checkbox label='Fix Edge' checked={ edgeFixed } onChange={ this._onFixEdgeChange } />
+          <Checkbox
+            className='exampleCheckbox'
+            label='Show beak'
+            checked={ isBeakVisible }
+            onChange={ this._onShowBeakChange }
+          />
+          <Checkbox
+            className='exampleCheckbox'
+            label='Fix Edge'
+            checked={ edgeFixed }
+            onChange={ this._onFixEdgeChange }
+          />
           <Slider
             max={ 20 }
             label='Gap Space'
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
index 0a9e13069016e..70144038e2f96 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
@@ -21,10 +21,10 @@ export class DatePickerPage extends React.Component<IComponentDemoPageProps, {}>
         componentName='DatePickerExample'
         exampleCards={
           <div>
-            <ExampleCard title='DatePicker' code={ DatePickerBasicExampleCode }>
+            <ExampleCard title='Default DatePicker' code={ DatePickerBasicExampleCode }>
               <DatePickerBasicExample />
             </ExampleCard>
-            <ExampleCard title='DatePicker as required field' code={ DatePickerRequiredExampleCode }>
+            <ExampleCard title='DatePicker with required field' code={ DatePickerRequiredExampleCode }>
               <DatePickerRequiredExample />
             </ExampleCard>
             <ExampleCard title='DatePicker allows input date string' code={ DatePickerInputExampleCode }>
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
index 482258e660b3e..b2ae60df58ec6 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
@@ -12,6 +12,7 @@ import {
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { facepilePersonas } from './FacepileExampleData';
 import './Facepile.Examples.scss';
+import '../../../common/_exampleStyles.scss';
 
 export enum ExtraDataType {
   none = 0,
@@ -71,6 +72,7 @@ export class FacepileBasicExample extends React.Component<any, IFacepileBasicExa
           />
         </div>
         <Checkbox
+          className='exampleCheckbox'
           label='Fade In'
           checked={ this.state.imagesFadeIn }
           onChange={ this._onChangeFadeIn }
diff --git a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
index fc50acd53c880..471887ac246ca 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
@@ -1,6 +1,7 @@
 import * as React from 'react'; // tslint:disable-line:no-unused-variable
 import * as PropTypes from 'prop-types';
 import './Layer.Example.scss';
+import '../../../common/_exampleStyles.scss';
 import { BaseComponent } from 'office-ui-fabric-react/lib/Utilities';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { Layer } from 'office-ui-fabric-react/lib/Layer';
@@ -63,6 +64,7 @@ export class LayerBasicExample extends BaseComponent<any, any> {
       <div>
 
         <Checkbox
+          className='exampleCheckbox'
           label='Wrap the content box belowed in a Layer'
           checked={ showLayer }
           onChange={ this._onChange }
diff --git a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
index 43a77954bcb70..7671401cada9f 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
@@ -4,6 +4,7 @@ import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { Layer, LayerHost } from 'office-ui-fabric-react/lib/Layer';
 import { Toggle } from 'office-ui-fabric-react/lib/Toggle';
 import './Layer.Example.scss';
+import '../../../common/_exampleStyles.scss';
 import { AnimationClassNames } from '../../../Styling';
 
 export class LayerHostedExample extends React.Component<any, any> {
@@ -40,6 +41,7 @@ export class LayerHostedExample extends React.Component<any, any> {
         </p>
 
         <Checkbox
+          className='exampleCheckbox'
           label='Render the box below in a Layer and target it at hostId=layerhost1'
           checked={ showLayer }
           onChange={ this._onChangeCheckbox }
@@ -76,4 +78,4 @@ export class LayerHostedExample extends React.Component<any, any> {
   private _onChangeToggle(checked: boolean): void {
     this.setState({ showHost: checked });
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
index 18332c57e66aa..800bc3d59ed5c 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
@@ -10,6 +10,7 @@ import {
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { MarqueeSelection, Selection, IObjectWithKey } from 'office-ui-fabric-react/lib/MarqueeSelection';
 import './MarqueeSelection.Basic.Example.scss';
+import '../../../common/_exampleStyles.scss';
 
 interface IPhoto extends IObjectWithKey {
   url: string;
@@ -62,6 +63,7 @@ export class MarqueeSelectionBasicExample extends React.Component<{}, IMarqueeSe
     return (
       <MarqueeSelection selection={ this._selection } isEnabled={ this.state.isMarqueeEnabled }>
         <Checkbox
+          className='exampleCheckbox'
           label='Is marquee enabled'
           defaultChecked={ true }
           onChange={ this._onChange }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
index c0489ef1f74c1..ecda1b99d1e2b 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
@@ -7,6 +7,7 @@ import {
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { Label } from 'office-ui-fabric-react/lib/Label';
 import { TestImages } from '../../../common/TestImages';
+import '../../../common/_exampleStyles.scss';
 
 const examplePersona = {
   imageUrl: TestImages.personaFemale,
@@ -47,6 +48,7 @@ export class PersonaBasicExample extends React.Component<React.Props<PersonaBasi
         />
 
         <Label className='example-label'>Extra Extra Small Persona (24px)</Label>
+
         <Persona
           { ...examplePersona }
           size={ PersonaSize.extraExtraSmall }
@@ -100,7 +102,7 @@ export class PersonaBasicExample extends React.Component<React.Props<PersonaBasi
           presence={ PersonaPresence.blocked }
           hidePersonaDetails={ !renderPersonaDetails }
         />
-      </div>
+      </div >
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
index f7545f734de67..5c03e51e886fc 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
@@ -23,6 +23,7 @@ import {
   ISuggestionItemProps
 } from 'office-ui-fabric-react/lib/Pickers';
 import './Picker.CustomResult.Example.scss';
+import '../../../common/_exampleStyles.scss';
 import { TestImages } from '../../../common/TestImages';
 import { IButtonProps } from 'office-ui-fabric-react/lib/Button';
 
@@ -327,7 +328,13 @@ export class PickerCustomResultExample extends React.Component<any, IPeoplePicke
   public render() {
     return (
       <div>
-        <Checkbox label='Disable Document Picker' checked={ this.state.isPickerDisabled } onChange={ this._onDisabledButtonClick } />
+
+        <Checkbox
+          className='exampleCheckbox'
+          label='Disable Document Picker'
+          checked={ this.state.isPickerDisabled }
+          onChange={ this._onDisabledButtonClick }
+        />
         <DocumentPicker
           onRenderSuggestionsItem={ SuggestedBigItem as any }
           onResolveSuggestions={ this._onFilterChanged }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
index bf4c79df9d0ca..1b3be8beaa018 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
@@ -3,6 +3,7 @@ import { autobind } from '../../../Utilities';
 import { TagPicker } from 'office-ui-fabric-react/lib/components/pickers/TagPicker/TagPicker';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { ITagPickerDemoPageState } from 'office-ui-fabric-react/lib/components/pickers/examples/ITagPickerDemoPageState';
+import '../../../common/_exampleStyles.scss';
 
 let _testTags = [
   'black',
@@ -33,7 +34,12 @@ export class TagPickerBasicExample extends React.Component<{}, ITagPickerDemoPag
   public render() {
     return (
       <div>
-        <Checkbox label='Disable Tag Picker' checked={ this.state.isPickerDisabled } onChange={ this._onDisabledButtonClick } />
+        <Checkbox
+          className='exampleCheckbox'
+          label='Disable Tag Picker'
+          checked={ this.state.isPickerDisabled }
+          onChange={ this._onDisabledButtonClick }
+        />
         <TagPicker
           ref='tagPicker'
           onResolveSuggestions={ this._onFilterChanged }

From 284b96aef2e2665bc135b64b63699056e45070c6 Mon Sep 17 00:00:00 2001
From: John Miller <rubixws@gmail.com>
Date: Mon, 18 Sep 2017 22:48:09 -0700
Subject: [PATCH 0659/1641] Added alt text prop for Image component and example
 on website (#2872)

* Added alt text prop for Image component and example on website

* Removed alt text prop

* Jsx closing tags
---
 .../alt-image-text_2017-08-25-19-14.json            | 11 +++++++++++
 .../src/components/Image/Image.Props.ts             |  2 +-
 .../src/components/Image/ImagePage.tsx              | 13 +++++++++++++
 .../Image/examples/Image.Center.Example.tsx         |  6 +++---
 .../Image/examples/Image.Contain.Example.tsx        |  6 +++---
 .../Image/examples/Image.Cover.Example.tsx          |  6 +++---
 .../Image/examples/Image.Default.Example.tsx        | 10 +++++-----
 .../Image/examples/Image.MaximizeFrame.Example.tsx  |  6 +++---
 .../Image/examples/Image.None.Example.tsx           |  6 +++---
 9 files changed, 45 insertions(+), 21 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/alt-image-text_2017-08-25-19-14.json

diff --git a/common/changes/office-ui-fabric-react/alt-image-text_2017-08-25-19-14.json b/common/changes/office-ui-fabric-react/alt-image-text_2017-08-25-19-14.json
new file mode 100644
index 0000000000000..beecf262ce840
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/alt-image-text_2017-08-25-19-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added an optional alt text prop for the Image component and example on the website.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.Props.ts b/packages/office-ui-fabric-react/src/components/Image/Image.Props.ts
index 50891a4d3fdc3..7fb7bec3c9de3 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.Props.ts
@@ -56,7 +56,7 @@ export interface IImageProps extends React.ImgHTMLAttributes<HTMLImageElement> {
   onLoadingStateChange?: (loadState: ImageLoadState) => void;
 
   /**
-   * Specified the cover style to be used for this image. If not
+   * Specifies the cover style to be used for this image. If not
    * specified, this will be dynamically calculated based on the
    * aspect ratio for the image.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx b/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx
index 1880926481601..da433b0a0320e 100644
--- a/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx
@@ -60,6 +60,19 @@ export class ImagePage extends React.Component<IComponentDemoPageProps, {}> {
             Images render an image. The borders have been added to these examples in order to help visualize empty space in the image frame.
           </div>
         }
+        bestPractices={
+          <div/>
+        }
+        dos={
+          <div>
+            <ul>
+              <li>Provide descriptive values for the alt text attribute for all images.</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div/>
+        }
         isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Image/examples/Image.Center.Example.tsx b/packages/office-ui-fabric-react/src/components/Image/examples/Image.Center.Example.tsx
index 3a9dd4cc7f5d0..c344aba4c759f 100644
--- a/packages/office-ui-fabric-react/src/components/Image/examples/Image.Center.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/examples/Image.Center.Example.tsx
@@ -20,11 +20,11 @@ export class ImageCenterExample extends React.Component<any, any> {
       <div>
         <p>Setting the imageFit property to "center" behaves the same as "none", while centering the image within the frame.</p>
         <Label>The image is larger than the frame, so all sides are cropped to center the image.</Label>
-        <Image  { ...imageProps as any } src='http://placehold.it/800x300' />
+        <Image  { ...imageProps as any } src='http://placehold.it/800x300' alt='Example implementation of the property image fit using the center value on an image larger than the frame.' />
         <br />
         <Label>The image is smaller than the frame, so there is empty space within the frame. The image is centered in the available space.</Label>
-        <Image  { ...imageProps as any } src='http://placehold.it/100x100' />
+        <Image  { ...imageProps as any } src='http://placehold.it/100x100' alt='Example implementation of the property image fit using the center value on an image smaller than the frame.' />
       </div>
     );
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Image/examples/Image.Contain.Example.tsx b/packages/office-ui-fabric-react/src/components/Image/examples/Image.Contain.Example.tsx
index 199024f6390ba..b331d2a82e523 100644
--- a/packages/office-ui-fabric-react/src/components/Image/examples/Image.Contain.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/examples/Image.Contain.Example.tsx
@@ -17,11 +17,11 @@ export class ImageContainExample extends React.Component<any, any> {
       <div>
         <p>Setting the imageFit property to "contain" will scale the image up or down to fit the frame, while maintaining its natural aspect ratio and without cropping the image.</p>
         <Label>The image has a wider aspect ratio (more landscape) than the frame, so the image is scaled to fit the width and centered in the available vertical space.</Label>
-        <Image { ...imageProps as any } width={ 200 } height={ 200 } />
+        <Image { ...imageProps as any } alt='Example implementation of the property image fit using the contain value on an image wider than the frame.' width={ 200 } height={ 200 } />
         <br />
         <Label>The image has a taller aspect ratio (more portrait) than the frame, so the image is scaled to fit the height and centered in the available horizontal space.</Label>
-        <Image { ...imageProps as any } width={ 300 } height={ 50 } />
+        <Image { ...imageProps as any } alt='Example implementation of the property image fit using the contain value on an image taller than the frame.' width={ 300 } height={ 50 } />
       </div>
     );
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Image/examples/Image.Cover.Example.tsx b/packages/office-ui-fabric-react/src/components/Image/examples/Image.Cover.Example.tsx
index fe4d0565468af..8d38ff7bbe9a6 100644
--- a/packages/office-ui-fabric-react/src/components/Image/examples/Image.Cover.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/examples/Image.Cover.Example.tsx
@@ -17,11 +17,11 @@ export class ImageCoverExample extends React.Component<any, any> {
       <div>
         <p>Setting the imageFit property to "cover" will cause the image to scale up or down proportionally, while cropping from either the top and bottom or sides to completely fill the frame.</p>
         <Label>The image has a wider aspect ratio (more landscape) than the frame, so the image is scaled to fit the height and the sides are cropped evenly.</Label>
-        <Image { ...imageProps as any } width={ 150 } height={ 250 } />
+        <Image { ...imageProps as any } alt='Example implementation of the property image fit using the cover value on an image wider than the frame.' width={ 150 } height={ 250 } />
         <br />
         <Label>The image has a taller aspect ratio (more portrait) than the frame, so the image is scaled to fit the width and the top and bottom are cropped evenly.</Label>
-        <Image { ...imageProps as any } width={ 250 } height={ 150 } />
+        <Image { ...imageProps as any } alt='Example implementation of the property image fit using the cover value on an image taller than the frame.' width={ 250 } height={ 150 } />
       </div>
     );
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Image/examples/Image.Default.Example.tsx b/packages/office-ui-fabric-react/src/components/Image/examples/Image.Default.Example.tsx
index ff147f59ab0be..12f31376505f8 100644
--- a/packages/office-ui-fabric-react/src/components/Image/examples/Image.Default.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/examples/Image.Default.Example.tsx
@@ -8,17 +8,17 @@ export class ImageDefaultExample extends React.Component<any, any> {
       <div>
         <p>With no imageFit property set, the width and height props control the size of the frame. Depending on which of those props is used, the image may scale to fit the frame.</p>
         <Label>Without a width or height specified, the frame remains at its natural size and the image will not be scaled.</Label>
-        <Image src='http://placehold.it/350x150' />
+        <Image src='http://placehold.it/350x150' alt='Example implementation with no image fit property and no height or width is specified.' />
         <br />
         <Label>If only a width is provided, the frame will be set to that width. The image will scale proportionally to fill the available width.</Label>
-        <Image src='http://placehold.it/350x150' width={ 600 } />
+        <Image src='http://placehold.it/350x150' alt='Example implementation with no image fit property and only width is specified.' width={ 600 } />
         <br />
         <Label>If only a height is provided, the frame will be set to that height. The image will scale proportionally to fill the available height.</Label>
-        <Image src='http://placehold.it/350x150' height={ 100 } />
+        <Image src='http://placehold.it/350x150' alt='Example implementation with no image fit property and only height is specified.' height={ 100 } />
         <br />
         <Label>If both width and height are provided, the frame will be set to that width and height. The image will scale to fill both the available width and height. <strong>This may result in a distorted image.</strong></Label>
-        <Image src='http://placehold.it/350x150' width={ 100 } height={ 100 } />
+        <Image src='http://placehold.it/350x150' alt='Example implementation with no image fit property and height or width is specified.' width={ 100 } height={ 100 } />
       </div>
     );
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Image/examples/Image.MaximizeFrame.Example.tsx b/packages/office-ui-fabric-react/src/components/Image/examples/Image.MaximizeFrame.Example.tsx
index 9333d6fb60097..2a587775324df 100644
--- a/packages/office-ui-fabric-react/src/components/Image/examples/Image.MaximizeFrame.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/examples/Image.MaximizeFrame.Example.tsx
@@ -19,14 +19,14 @@ export class ImageMaximizeFrameExample extends React.Component<any, any> {
         <p>Where the exact width and height of the image's frame is not known, such as when sizing an image as a percentage of its parent, you can use the "maximizeFrame" prop to expand the frame to fill the parent element.</p>
         <Label>The image is placed within a landscape container.</Label>
         <div style={ { width: '200px', height: '100px' } }>
-          <Image { ...imageProps as any } />
+          <Image { ...imageProps as any } alt='Example implementation of the property maximize frame with a landscape container.' />
         </div>
         <br />
         <Label>The image is placed within a portrait container.</Label>
         <div style={ { width: '100px', height: '200px' } }>
-          <Image { ...imageProps as any } />
+          <Image { ...imageProps as any } alt='Example implementation of the property maximize frame with a portrait container' />
         </div>
       </div>
     );
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Image/examples/Image.None.Example.tsx b/packages/office-ui-fabric-react/src/components/Image/examples/Image.None.Example.tsx
index 2e583fd02f87a..68b4ffe8ff116 100644
--- a/packages/office-ui-fabric-react/src/components/Image/examples/Image.None.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/examples/Image.None.Example.tsx
@@ -19,11 +19,11 @@ export class ImageNoneExample extends React.Component<any, any> {
       <div>
         <p>By setting the imageFit property to "none", the image will remain at its natural size, even if the frame is made larger or smaller by setting the width and height props.</p>
         <Label>The image is larger than the frame, so it is cropped to fit. The image is positioned at the upper left of the frame.</Label>
-        <Image  { ...imageProps as any } />
+        <Image  { ...imageProps as any } alt='Example implementation of the property image fit using the none value on an image larger than the frame.' />
         <br />
         <Label>The image is smaller than the frame, so there is empty space within the frame. The image is positioned at the upper left of the frame.</Label>
-        <Image  { ...imageProps as any } src='http://placehold.it/100x100' />
+        <Image  { ...imageProps as any } src='http://placehold.it/100x100' alt='Example implementation of the property image fit using the none value on an image smaller than the frame.' />
       </div>
     );
   }
-}
+}
\ No newline at end of file

From adc11d66a038207b537d2e65eefebe9c639bdbcb Mon Sep 17 00:00:00 2001
From: John Miller <rubixws@gmail.com>
Date: Mon, 18 Sep 2017 22:56:29 -0700
Subject: [PATCH 0660/1641] Update dropdown state styles to match XD spec
 (#2731) (#2873)

* Updated dropdown styles to match designed states

* Added change file
---
 .../dropdown-state_2017-09-05-17-45.json      | 11 ++++++
 .../src/components/Dropdown/Dropdown.scss     | 39 +++++++++----------
 2 files changed, 29 insertions(+), 21 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/dropdown-state_2017-09-05-17-45.json

diff --git a/common/changes/office-ui-fabric-react/dropdown-state_2017-09-05-17-45.json b/common/changes/office-ui-fabric-react/dropdown-state_2017-09-05-17-45.json
new file mode 100644
index 0000000000000..39b0f5c3c7c22
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/dropdown-state_2017-09-05-17-45.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Updated dropdown state styles to match the XD specs.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
index 36ec971b58e2d..f3b5cf92abccd 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
@@ -49,25 +49,18 @@ $DropDown-item-height: 32px;
     .title,
     .caretDown {
       color: $ms-color-black;
-
-      @media screen and (-ms-high-contrast: active) {
-        color: $ms-color-contrastBlackSelected;
-      }
-
-      @media screen and (-ms-high-contrast: black-on-white) {
-        color: $ms-color-contrastWhiteSelected;
-      }
     }
+
     .titleIsPlaceHolder {
       color: $ms-color-neutralSecondary;
     }
   }
 
   &:hover,
-  &:active {
-    .title {
-      border-color: $ms-color-themePrimary;
-
+  &:active,
+  &:focus {
+    .title,
+    .caretDown {
       @media screen and (-ms-high-contrast: active) {
         border-color: $ms-color-contrastBlackSelected;
       }
@@ -78,17 +71,21 @@ $DropDown-item-height: 32px;
     }
   }
 
-  &:focus {
+  &:hover {
     .title {
-      border-color: $ms-color-themePrimary;
+      border-color: $ms-color-neutralDark;
+    }
+  }
 
-      @media screen and (-ms-high-contrast: active) {
-        border-color: $ms-color-contrastBlackSelected;
-      }
+  &:active {
+    .title {
+      border-color: $ms-color-themeDark;
+    }
+  }
 
-      @media screen and (-ms-high-contrast: black-on-white) {
-        border-color: $ms-color-contrastWhiteSelected;
-      }
+  &:focus {
+    .title {
+      border-color: $ms-color-themePrimary;
     }
   }
 
@@ -102,7 +99,7 @@ $DropDown-item-height: 32px;
 .root.rootIsDisabled {
   .title {
     background-color: $ms-color-neutralLighter;
-    border-color: $ms-color-neutralLighter;
+    border: none;
     color: $ms-color-neutralTertiary;
     cursor: default;
 

From 5c586f0d68efe83ed9eb7fa95e2f8926c566122d Mon Sep 17 00:00:00 2001
From: John Miller <rubixws@gmail.com>
Date: Mon, 18 Sep 2017 23:14:31 -0700
Subject: [PATCH 0661/1641] Revised alt text best practices for Image Component
 in website. (#2875)

* Revised alt text best practices for Image Component in website, removed alt prop.

* Jsx closing tags
---
 .../alt-text-revision_2017-09-01-17-27.json     | 11 +++++++++++
 .../alt-text-revision_2017-09-01-17-27.json     | 11 +++++++++++
 .../components/ComponentPage/ComponentPage.scss |  5 +++++
 .../src/components/Image/ImagePage.tsx          | 17 ++++++++++++++---
 4 files changed, 41 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/alt-text-revision_2017-09-01-17-27.json
 create mode 100644 common/changes/office-ui-fabric-react/alt-text-revision_2017-09-01-17-27.json

diff --git a/common/changes/@uifabric/fabric-website/alt-text-revision_2017-09-01-17-27.json b/common/changes/@uifabric/fabric-website/alt-text-revision_2017-09-01-17-27.json
new file mode 100644
index 0000000000000..3c396acc0a971
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/alt-text-revision_2017-09-01-17-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Revised alt text best practes for ImageComponent.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/alt-text-revision_2017-09-01-17-27.json b/common/changes/office-ui-fabric-react/alt-text-revision_2017-09-01-17-27.json
new file mode 100644
index 0000000000000..043dff563fb88
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/alt-text-revision_2017-09-01-17-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Revised alt text best practices for Image Component in website, removed alt prop.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss b/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss
index bb53b303bdb96..ed0b0bef2fb63 100644
--- a/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss
+++ b/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss
@@ -153,6 +153,11 @@ $dontColor: #A61E22;
     li {
       list-style: disc;
       margin-bottom: 20px;
+
+      ul li {
+        list-style: circle;
+        margin-bottom: 0;
+      }
     }
 
     &:first-child {
diff --git a/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx b/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx
index da433b0a0320e..f1b9318079076 100644
--- a/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx
@@ -61,17 +61,28 @@ export class ImagePage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         bestPractices={
-          <div/>
+          <div />
         }
         dos={
           <div>
             <ul>
-              <li>Provide descriptive values for the alt text attribute for all images.</li>
+              <li>
+                Provide descriptive values for the alt text attribute for all images.
+                If alt text isn't provided for images, the image information is inaccessible, for example, to people who cannot see and use a screen reader that reads aloud the information on a page.
+                <ul>
+                  <li>Consider context. If the image represents a function, be sure to indicate that. If it is to be consumed with other objects on the page, consider that as well.</li>
+                  <li>Make the description brief but accurate. Use one sentence, two at the most.</li>
+                </ul>
+              </li>
             </ul>
           </div>
         }
         donts={
-          <div/>
+          <div>
+            <ul>
+              <li>Repeat information in your alt text that is already on the page. Don't use "image of" or "graphic of" to describe it, as that is already apparent to the reader.</li>
+            </ul>
+          </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
       />

From 055dd03c8ad9d74843f2bc3445d529a3c1fd8cb5 Mon Sep 17 00:00:00 2001
From: John Miller <rubixws@gmail.com>
Date: Tue, 19 Sep 2017 00:02:24 -0700
Subject: [PATCH 0662/1641] Visual bug fixes for adoption of UHF for website
 (#2877)

* Visual bug fixes for adoption of UHF for website

* Adding change files.
---
 apps/fabric-website/homepage.htm              |  94 +++++++++++++++
 apps/fabric-website/index.html                |  69 +----------
 .../src/components/App/App.scss               |  89 +++++---------
 .../fabric-website/src/components/App/App.tsx |  43 ++-----
 .../src/components/Footer/Footer.scss         | 111 ------------------
 .../src/components/Footer/Footer.tsx          |  46 --------
 .../src/components/Nav/Nav.module.scss        |   2 -
 .../PageHeader/PageHeader.module.scss         |   8 +-
 .../src/pages/BlogPage/BlogItem.scss          |   4 +-
 .../src/pages/BlogPage/BlogPage.module.scss   |   2 +-
 .../GetStartedPage.diagram.module.scss        |   8 +-
 .../GetStarted/GetStartedPage.module.scss     |   8 +-
 .../src/pages/HomePage/HomePage.module.scss   |  14 +--
 .../src/pages/Overviews/Overviews.module.scss |   4 +-
 .../ResourcesPage/ResourcesPage.module.scss   |  10 +-
 .../BrandIconsPage/BrandIconsPage.module.scss |   4 +-
 apps/fabric-website/src/styles/_mixins.scss   |  16 +--
 .../fabric-website/src/styles/_overrides.scss |   2 +-
 .../fabric-website/src/styles/_variables.scss |  17 ++-
 apps/fabric-website/webpack.config.js         |   2 +-
 apps/fabric-website/webpack.serve.config.js   |   2 -
 .../fabric-website-v5.0_2017-09-12-17-22.json |  11 ++
 .../fabric-website-v5.0_2017-09-12-17-22.json |  11 ++
 .../fabric-website-v5.0_2017-09-12-17-22.json |  11 ++
 .../uhf-visual-bugs_2017-09-06-21-49.json     |  11 ++
 .../fabric-website-v5.0_2017-09-12-17-22.json |  11 ++
 .../fabric-website-v5.0_2017-09-12-17-22.json |  11 ++
 .../fabric-website-v5.0_2017-09-12-17-22.json |  11 ++
 .../uhf-visual-bugs_2017-09-06-21-49.json     |  11 ++
 .../example-app-base/src/common/_common.scss  |   3 +
 .../ComponentPage/ComponentPage.scss          |   2 +-
 .../src/common/_common.scss                   |   3 +
 .../src/components/Breadcrumb/Breadcrumb.scss |   2 +-
 .../src/components/Panel/Panel.scss           |   4 +-
 .../src/components/Pivot/Pivot.scss           |   2 +-
 35 files changed, 287 insertions(+), 372 deletions(-)
 create mode 100644 apps/fabric-website/homepage.htm
 delete mode 100644 apps/fabric-website/src/components/Footer/Footer.scss
 delete mode 100644 apps/fabric-website/src/components/Footer/Footer.tsx
 create mode 100644 common/changes/@uifabric/example-app-base/fabric-website-v5.0_2017-09-12-17-22.json
 create mode 100644 common/changes/@uifabric/experiments/fabric-website-v5.0_2017-09-12-17-22.json
 create mode 100644 common/changes/@uifabric/fabric-website/fabric-website-v5.0_2017-09-12-17-22.json
 create mode 100644 common/changes/@uifabric/fabric-website/uhf-visual-bugs_2017-09-06-21-49.json
 create mode 100644 common/changes/@uifabric/styling/fabric-website-v5.0_2017-09-12-17-22.json
 create mode 100644 common/changes/@uifabric/utilities/fabric-website-v5.0_2017-09-12-17-22.json
 create mode 100644 common/changes/office-ui-fabric-react/fabric-website-v5.0_2017-09-12-17-22.json
 create mode 100644 common/changes/office-ui-fabric-react/uhf-visual-bugs_2017-09-06-21-49.json

diff --git a/apps/fabric-website/homepage.htm b/apps/fabric-website/homepage.htm
new file mode 100644
index 0000000000000..11a61b2de1d47
--- /dev/null
+++ b/apps/fabric-website/homepage.htm
@@ -0,0 +1,94 @@
+<style>
+  body,
+  html {
+    margin: 0;
+    padding: 0;
+  }
+
+  .loading {
+    align-items: center;
+    background-color: #212121;
+    display: flex;
+    height: 100vh;
+    justify-content: center;
+  }
+</style>
+<div id="main">
+  <div class="loading">
+    <img class="loadingImage" src="https://static2.sharepointonline.com/files/fabric/fabric-website/images/spinner.gif" alt="Loading"
+      width="32" height="32" />
+  </div>
+</div>
+
+<script type="text/javascript">
+  var isProduction = false;
+  var isDogfood = false;
+  var isLocal = false;
+  var today = new Date();
+  var date = today.getFullYear() + '-' + (today.getMonth() + 1) + '-' + today.getDate();
+  var entryPointFilename = 'fabric-sitev5';
+
+  // Query params
+  var noCompress = getParameterByName('noCompress') === 'true';
+  var devUrl = getParameterByName('devUrl');
+  var dogfood = getParameterByName('isDogfood');
+  var production = getParameterByName('isProduction');
+
+  // @TODO: change this to only check for production
+  switch (true) {
+    case location.hostname === 'dev.office.com' || production:
+      isProduction = true;
+      break;
+    case location.hostname === 'officedevcentersite-devx.azurewebsites.net' || location.hostname === 'devx.microsoft-tst.com' || dogfood:
+      isDogfood = true;
+      break;
+    case location.hostname === 'officedevcentersite-release.azurewebsites.net':
+      isProduction = true;
+      break;
+  }
+
+  function loadScript(n) {
+    for (var i = 0; i < n.length; i++) {
+      var s = document.createElement('script');
+      s.src = n[i];
+      s.async = false;
+      document.body.appendChild(s);
+    }
+  }
+
+  function getParameterByName(name, url) {
+    if (!url) {
+      url = window.location.href;
+    }
+    name = name.replace(/[\[\]]/g, "\\$&");
+    var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
+      results = regex.exec(url);
+    if (!results) return null;
+    if (!results[2]) return '';
+    return decodeURIComponent(results[2].replace(/\+/g, " "));
+  }
+
+  var baseProductionUrl = 'https://static2.sharepointonline.com/files/fabric/fabric-website/dist/';
+  var baseDogfoodUrl = 'https://static2df.sharepointonline.com/files/fabric/fabric-website/dist/';
+
+  var scripts = [];
+
+  if (devUrl) {
+    scripts.push(devUrl);
+  } else if (isDogfood) {
+    if (noCompress) {
+      scripts.push(baseDogfoodUrl + entryPointFilename + '.min.js?date=' + Date.now());
+    } else {
+      scripts.push(baseDogfoodUrl + entryPointFilename + '.js?date=' + Date.now());
+    }
+  } else {
+    if (noCompress) {
+      scripts.push(baseProductionUrl + entryPointFilename + '.js?date=' + date);
+    } else {
+      scripts.push(baseProductionUrl + entryPointFilename + '.min.js?date=' + date);
+    }
+  }
+
+  loadScript(scripts);
+
+</script>
\ No newline at end of file
diff --git a/apps/fabric-website/index.html b/apps/fabric-website/index.html
index 84aec05a78105..e4300b4a62ebb 100644
--- a/apps/fabric-website/index.html
+++ b/apps/fabric-website/index.html
@@ -19,7 +19,6 @@
     .loading {
       align-items: center;
       background-color: #212121;
-      border-top: 50px solid #000;
       display: flex;
       height: 100vh;
       justify-content: center;
@@ -36,25 +35,6 @@
   </div>
 
   <script type="text/javascript">
-    var isProduction = false;
-    var isDogfood = false;
-    var isLocal = false;
-    var today = new Date();
-    var date = today.getFullYear() + '-' + (today.getMonth() + 1) + '-' + today.getDate();
-    switch (true) {
-      case location.hostname === 'dev.office.com':
-        isProduction = true;
-        break;
-      case location.hostname === 'officedevcentersite-devx.azurewebsites.net':
-        isDogfood = true;
-        break;
-      case location.hostname === 'officedevcentersite-release.azurewebsites.net':
-        isProduction = true;
-        break;
-      case location.hostname === 'localhost':
-        isLocal = true;
-    }
-
     function loadScript(n) {
       for (var i = 0; i < n.length; i++) {
         var s = document.createElement('script');
@@ -64,55 +44,12 @@
       }
     }
 
-    function getParameterByName(name, url) {
-      if (!url) {
-        url = window.location.href;
-      }
-      name = name.replace(/[\[\]]/g, "\\$&");
-      var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
-        results = regex.exec(url);
-      if (!results) return null;
-      if (!results[2]) return '';
-      return decodeURIComponent(results[2].replace(/\+/g, " "));
-    }
-
-    var reactProduction = [
-      '//cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react.min.js',
-      '//cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react-dom.min.js'
-    ];
-
-    var reactDevelopment = [
+    var scripts = [
       '//cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react.js',
-      '//cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react-dom.js'
+      '//cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react-dom.js',
+      '/fabric-sitev5.js'
     ];
 
-    var baseProductionUrl = "https://static2.sharepointonline.com/files/fabric/fabric-website/dist/";
-    var baseDogfoodUrl = "https://static2df.sharepointonline.com/files/fabric/fabric-website/dist/";
-
-    var scripts = [];
-    var noCompress = getParameterByName('noCompress') === 'true';
-
-    if (isLocal) {
-      scripts.push.apply(scripts, reactDevelopment);
-      scripts.push('fabric-website.js');
-    } else if (isDogfood) {
-      if (noCompress) {
-        scripts.push.apply(scripts, reactDevelopment);
-        scripts.push(baseDogfoodUrl + 'fabric-site.min.js?date=' + Date.now());
-      } else {
-        scripts.push.apply(scripts, reactProduction);
-        scripts.push(baseDogfoodUrl + 'fabric-site.js?date=' + Date.now());
-      }
-    } else {
-      if (noCompress) {
-        scripts.push.apply(scripts, reactDevelopment);
-        scripts.push(baseProductionUrl + 'fabric-site.js?date=' + date);
-      } else {
-        scripts.push.apply(scripts, reactProduction);
-        scripts.push(baseProductionUrl + 'fabric-site.min.js?date=' + date);
-      }
-    }
-
     loadScript(scripts);
   </script>
   <script>
diff --git a/apps/fabric-website/src/components/App/App.scss b/apps/fabric-website/src/components/App/App.scss
index 90f73c7314f9e..34585fe736497 100644
--- a/apps/fabric-website/src/components/App/App.scss
+++ b/apps/fabric-website/src/components/App/App.scss
@@ -5,6 +5,8 @@
   .App {
     background-color: $ms-color-neutralDark;
     justify-content: center;
+    padding-left: 5%; // % matches UHF breakpoint sizes
+    padding-right: 5%; // % matches UHF breakpoint sizes
   }
 
   // Element that wraps everything except for the header
@@ -16,38 +18,6 @@
     padding-top: $Header-height; // Keep content from being covered by the header
   }
 
-  .App-mobileNavBar {
-    @include contentPadding(0, 0);
-    background: $ms-color-neutralDark;
-    color: $ms-color-white;
-    display: flex;
-    height: $App-mobileNavBarHeight;
-    left: 0;
-    position: fixed;
-    right: 0;
-    z-index: 600;
-
-    .menuButton {
-      color: $ms-color-white;
-      font-size: $font-size-big;
-      font-weight: $ms-font-weight-regular;
-      height: $App-mobileNavBarHeight;
-      line-height: $App-mobileNavBarHeight;
-      @include ms-margin-right(12px);
-      padding: 0;
-
-      &:focus {
-        outline: 0;
-      }
-    }
-
-    .siteTitle {
-      font-size: $font-size-big;
-      font-weight: $ms-font-weight-light;
-      line-height: $App-mobileNavBarHeight - 2;
-    }
-  }
-
   // Nav is hidden off screen by default
   .App-nav {
     -webkit-overflow-scrolling: touch; // Improves scrolling performance
@@ -55,7 +25,7 @@
     @include ms-left(-$Nav-width);
     overflow-y: auto;
     position: fixed;
-    top: $Header-height + $App-mobileNavBarHeight;
+    top: $Header-height;
     transition: $ms-animation-duration-2 $ms-animation-ease-1;
     @include ms-transition-property(left);
     width: $Nav-width;
@@ -66,7 +36,6 @@
     background-color: $ms-color-neutralLighter;
     flex-grow: 1;
     left: 0;
-    margin-top: $App-mobileNavBarHeight; // Move it down below the mobile nav bar
     overflow: hidden;
     position: relative;
     transition: all $ms-animation-duration-2 $ms-animation-ease-1;
@@ -85,36 +54,20 @@
 
   }
 
-  // Overlay to dim content and dismiss the mobile nav (hidden by default)
-  .App-mobileNavOverlay {
-    display: none;
-  }
-
   // When the nav is open (smaller screens only) push the content over and prevent app from scrolling
-  @media screen and (max-width: $ms-screen-max-lg) {
+  @media screen and (max-width: $uhf-screen-min-mobile) {
+    .App {
+      padding: 0;
+    }
+
     .App.is-navOpen {
       bottom: 0;
       left: 0;
       overflow: hidden;
-      position: absolute;
+      position: fixed;
       right: 0;
       top: 0;
 
-      .App-mobileNavBar {
-        @include ms-padding-left(36px); // Align to menu items
-      }
-
-      .App-mobileNavOverlay {
-        background: transparent;
-        bottom: 0;
-        display: block;
-        position: absolute;
-        @include ms-left($Nav-width);
-        @include ms-right(0);
-        top: 0;
-        z-index: 1;
-      }
-
       .App-nav {
         @include ms-left(0);
       }
@@ -127,15 +80,11 @@
   }
 
   // Show the nav at all times, to the left of the content
-  @media screen and (min-width: $ms-screen-min-xl) {
+  @media screen and (min-width: $uhf-screen-min-mobile) {
     .App-wrapper {
       flex-direction: row;
     }
 
-    .App-mobileNavBar {
-      display: none;
-    }
-
     .App-nav {
       @include ms-left(auto);
       top: auto; // Mobile nav bar is no longer there
@@ -144,7 +93,7 @@
     }
 
     .App-content {
-      margin-top: 0; // Mobile nav bar is no longer there
+      margin-top: 0;
       flex-grow: unset;
       width: calc(100% - #{$Nav-width});
     }
@@ -161,4 +110,20 @@
     }
   }
 
+  @media only screen and (max-width: $uhf-screen-max-lg) and (min-width: $uhf-screen-min-mobile) {
+    .App {
+      @include ms-padding-right(24px);
+      @include ms-padding-left(6px);
+    }
+
+    .App-nav {
+      @include ms-margin-left(18px);
+    }
+  }
 }
+
+@media only screen and (max-width: $uhf-screen-min-mobile) {
+  .App {
+    padding: 0;
+  }
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/components/App/App.tsx b/apps/fabric-website/src/components/App/App.tsx
index 6f507ee1f428f..3ac9e058f9880 100644
--- a/apps/fabric-website/src/components/App/App.tsx
+++ b/apps/fabric-website/src/components/App/App.tsx
@@ -3,8 +3,6 @@ import './App.scss';
 import { AppState } from './AppState';
 import { css } from 'office-ui-fabric-react/lib/Utilities';
 import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
-import { Footer } from '../Footer/Footer';
-import { Header } from '../Header/Header';
 import { Nav } from '../Nav/Nav';
 
 export interface IAppProps extends React.Props<App> {
@@ -28,56 +26,37 @@ export class App extends React.Component<IAppProps, any> {
     let { isNavOpen } = this.state;
 
     let toggleIcon;
-    let siteTitle;
     if (isNavOpen) {
       toggleIcon = <i className='ms-Icon ms-Icon--ChromeClose' />;
-      siteTitle = '';
     } else {
       toggleIcon = <i className='ms-Icon ms-Icon--GlobalNavButton' />;
-      siteTitle = <div className='siteTitle'>Fabric</div>;
     }
 
     return (
-      <Fabric className={ css(
-        'App',
-        isNavOpen && 'is-navOpen'
-      ) }>
-        <Header />
+      <Fabric
+        className={ css(
+          'App',
+          isNavOpen && 'is-navOpen'
+        ) }
+      >
         <div className='App-wrapper'>
-          <div className='App-mobileNavBar'>
-            <button className='menuButton' onClick={ this._onNavToggleClicked.bind(this) }>
-              { toggleIcon }
-            </button>
-            { siteTitle }
-          </div>
-          <div className='App-mobileNavOverlay' onClick={ this._onOverlayClicked.bind(this) } />
           <div className='App-nav'>
-            <Nav pages={ AppState.pages } onLinkClick={ this._onNavItemClicked.bind(this) } />
+            <Nav
+              pages={ AppState.pages }
+              onLinkClick={ this._onNavItemClicked.bind(this) }
+            />
           </div>
           <div className='App-content' data-is-scrollable='true'>
             { this.props.children }
           </div>
         </div>
-        <Footer />
       </Fabric>
     );
   }
 
-  private _onNavToggleClicked(ev: MouseEvent) {
-    this.setState({
-      isNavOpen: !this.state.isNavOpen
-    });
-  }
-
-  private _onOverlayClicked(ev: MouseEvent) {
-    this.setState({
-      isNavOpen: false
-    });
-  }
-
   private _onNavItemClicked(ev: MouseEvent) {
     this.setState({
       isNavOpen: false
     });
   }
-}
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/components/Footer/Footer.scss b/apps/fabric-website/src/components/Footer/Footer.scss
deleted file mode 100644
index d4d080aaec1d7..0000000000000
--- a/apps/fabric-website/src/components/Footer/Footer.scss
+++ /dev/null
@@ -1,111 +0,0 @@
-@import '../../styles/variables';
-@import '../../styles/mixins';
-
-:global {
-  .od-OfficeFooter {
-    background: $ms-color-black;
-    color: $ms-color-white;
-    font-weight: $ms-font-weight-regular;
-    font-size: $ms-font-size-m;
-    padding: 32px 20px;
-    position: relative;
-
-    ul, li {
-      list-style: none;
-      @include ms-margin-left(0);
-      @include ms-padding-left(0);
-    }
-  }
-
-  .od-OfficeFooter-primary,
-  .od-OfficeFooter-secondary {
-    display: flex;
-    margin: 0 auto;
-    max-width: 1300px;
-  }
-
-  .od-OfficeFooter-primary {
-    flex-direction: column;
-    position: relative;
-  }
-
-  .od-OfficeFooter-secondary {
-    align-items: flex-end;
-    justify-content: space-between;
-  }
-
-  .od-OfficeFooter-heading {
-    font-weight: $ms-font-weight-semibold;
-    font-size: $ms-font-size-l;
-    white-space: nowrap;
-  }
-
-  .od-OfficeFooter-linkList {
-    margin-bottom: 40px;
-  }
-
-  .od-OfficeFooter-list {
-    li {
-      margin: 16px 0;
-      padding: 4px 0;
-    }
-
-    li a {
-      color: $ms-color-white;
-      display: block;
-    }
-  }
-
-  .od-OfficeFooter-list--secondary {
-    margin-bottom: 0;
-
-    li {
-      margin: 4px 0;
-    }
-  }
-
-  .od-OfficeFooter-microsoft {
-    margin-bottom: 8px;
-    @include ms-margin-left(8px);
-    @include ms-text-align(right);
-
-    img {
-      margin-bottom: 12px;
-    }
-  }
-
-  @media (min-width: $ms-screen-min-md) {
-
-    .od-OfficeFooter-primary {
-      flex-direction: row;
-      justify-content: space-between;
-    }
-
-    .od-OfficeFooter-linkList {
-      margin-bottom: 0;
-      @include ms-padding-right(40px);
-    }
-
-    .od-OfficeFooter-list--secondary {
-      margin-bottom: 0;
-      flex-grow: 1;
-      justify-content: flex-end;
-      display: flex;
-      flex-direction: row;
-
-      li {
-        @include ms-margin-left(20px);
-      }
-    }
-  }
-
-  @media (min-width: $ms-screen-min-lg) {
-    .od-OfficeFooter-primary {
-      justify-content: flex-start;
-    }
-
-    .od-OfficeFooter-linkList {
-      @include ms-margin-right(120px);
-    }
-  }
-}
diff --git a/apps/fabric-website/src/components/Footer/Footer.tsx b/apps/fabric-website/src/components/Footer/Footer.tsx
deleted file mode 100644
index 5beb7a827bffb..0000000000000
--- a/apps/fabric-website/src/components/Footer/Footer.tsx
+++ /dev/null
@@ -1,46 +0,0 @@
-import * as React from 'react';
-import './Footer.scss';
-
-export interface IFooterProps {
-}
-
-export interface IFooterState {
-}
-
-export class Footer extends React.Component<IFooterProps, IFooterState> {
-  public render() {
-    return (
-      <footer className='od-OfficeFooter'>
-        <div className='od-OfficeFooter-primary'>
-          <div className='od-OfficeFooter-linkList'>
-            <div className='od-OfficeFooter-heading'>Community Resources</div>
-            <ul className='od-OfficeFooter-list'>
-              <li><a href='https://www.yammer.com/itpronetwork' target='_blank'>Office 365 Technical Network</a></li>
-              <li><a href='http://social.msdn.microsoft.com/Forums/office/en-US/home?category=apps,officedev,sharepoint,exchangeserver,lync,msproject' target='_blank'>MSDN Forums</a></li>
-              <li><a href='http://officespdev.uservoice.com/' target='_blank'>UserVoice</a></li>
-              <li><a href='http://stackoverflow.com/questions/tagged/ms-office' target='_blank'>Stack Overflow</a></li>
-            </ul>
-          </div>
-          <div className='od-OfficeFooter-linkList'>
-            <div className='od-OfficeFooter-heading'>Follow Fabric</div>
-            <ul className='od-OfficeFooter-list'>
-              <li><a href='https://twitter.com/officeuifabric' target='_blank'>Twitter</a></li>
-              <li><a href='https://github.com/OfficeDev/?query=office-ui-fabric' target='_blank'>GitHub</a></li>
-            </ul>
-          </div>
-        </div>
-        <div className='od-OfficeFooter-secondary'>
-          <ul className='od-OfficeFooter-list od-OfficeFooter-list--secondary'>
-            <li><a href='http://www.microsoft.com/info/privacy.mspx' target='_blank'>Privacy</a></li>
-            <li><a href='http://msdn.microsoft.com/en-US/cc300389' target='_blank'>Terms of use</a></li>
-            <li><a href='http://www.microsoft.com/library/toolbar/3.0/trademarks/en-us.mspx' target='_blank'>Trademarks</a></li>
-          </ul>
-          <div className='od-OfficeFooter-microsoft'>
-            <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/logo-microsoft.png' } width='123' height='24' alt='Microsoft logo' />
-            <div>&copy; 2016 Microsoft</div>
-          </div>
-        </div>
-      </footer>
-    );
-  }
-}
diff --git a/apps/fabric-website/src/components/Nav/Nav.module.scss b/apps/fabric-website/src/components/Nav/Nav.module.scss
index 69123ef5f80d9..70b5dff61783e 100644
--- a/apps/fabric-website/src/components/Nav/Nav.module.scss
+++ b/apps/fabric-website/src/components/Nav/Nav.module.scss
@@ -95,8 +95,6 @@ $nav-group-header-height: 40px;
 
 // Second-level links
 .isSubMenu {
-  @include ms-margin-left(8px);
-
   .link {
     a {
       color: $ms-color-neutralTertiary;
diff --git a/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss b/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss
index 34f23034572d4..5249cf43d4272 100644
--- a/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss
+++ b/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss
@@ -36,13 +36,13 @@
   display: none;
 }
 
-@media screen and (max-width: $ms-screen-max-md) {
+@media screen and (max-width: $uhf-screen-max-mobile) {
   .pageHeader {
     margin-bottom: -2px;
   }
 }
 
-@media screen and (min-width: $ms-screen-min-lg) {
+@media screen and (min-width: $uhf-screen-min-mobile) {
   .pageHeader {
     height: $PageHeader-fullHeight;
 
@@ -51,7 +51,7 @@
         box-shadow: 0 10px 30px -10px rgba(0,0,0,.2);
         max-width: $App-maximumWidth - $Nav-width;
         position: fixed;
-        top: $Header-height + $App-mobileNavBarHeight;
+        top: $Header-height;
         width: 100%;
         z-index: $ms-zIndex-1;
         height: $PageHeader-attachedTitleHeight + $PageHeader-navHeight;
@@ -132,4 +132,4 @@
       top: $Header-height;
     }
   }
-}
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/pages/BlogPage/BlogItem.scss b/apps/fabric-website/src/pages/BlogPage/BlogItem.scss
index 2c7de8ab80375..5a749746a4d40 100644
--- a/apps/fabric-website/src/pages/BlogPage/BlogItem.scss
+++ b/apps/fabric-website/src/pages/BlogPage/BlogItem.scss
@@ -74,11 +74,11 @@ $BlogItem-dateColumnWidth: 120px;
     font-size: $ms-font-size-m;
   }
 
-  @media screen and (min-width: $ms-screen-min-lg) {
+  @media screen and (min-width: $uhf-screen-min-mobile) {
     // Place date to left instead of on top
     .BlogItem-contentColumn {
       padding-left: $BlogItem-dateColumnWidth;
       padding-top: 0;
     }
   }
-}
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/pages/BlogPage/BlogPage.module.scss b/apps/fabric-website/src/pages/BlogPage/BlogPage.module.scss
index 7962de473ed48..706b5d65d2791 100644
--- a/apps/fabric-website/src/pages/BlogPage/BlogPage.module.scss
+++ b/apps/fabric-website/src/pages/BlogPage/BlogPage.module.scss
@@ -11,7 +11,7 @@
   min-height: 80px; // Enough height to fit angle
 }
 
-@media screen and (min-width: $ms-screen-min-lg) {
+@media screen and (min-width: $uhf-screen-min-mobile) {
   .angle {
     margin-top: 0; // Move back down to ensure room for in-page nav
     min-height: 120px;
diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.diagram.module.scss b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.diagram.module.scss
index 1495957e1c383..429c6cc6ffdb4 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.diagram.module.scss
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.diagram.module.scss
@@ -85,7 +85,7 @@
   width: 100%;
 
   // Horizontal layout on large screens
-  @media screen and (min-width: $ms-screen-min-lg) {
+  @media screen and (min-width: $uhf-screen-min-mobile) {
     flex-direction: row;
     margin-top: 40px;
   }
@@ -112,7 +112,7 @@
   }
 
   // Horizontal layout
-  @media screen and (min-width: $ms-screen-min-lg) {
+  @media screen and (min-width: $uhf-screen-min-mobile) {
     flex-direction: column;
     margin: 0 0 0 16px;
 
@@ -143,7 +143,7 @@
   flex-shrink: 0;
   padding: 20px;
 
-  @media screen and (min-width: $ms-screen-min-lg) {
+  @media screen and (min-width: $uhf-screen-min-mobile) {
     width: 100%;
   }
 }
@@ -174,4 +174,4 @@
   flex-grow: 1;
   margin-bottom: 20px;
   width: 100%;
-}
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
index c86a773b6d335..8a0fe250fba7a 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
@@ -23,7 +23,7 @@
   }
 }
 
-@media screen and (min-width: $ms-screen-min-lg) {
+@media screen and (min-width: $uhf-screen-min-mobile) {
   .designSection,
   .structureSection,
   .instructionsSection {
@@ -76,13 +76,13 @@
   }
 }
 
-@media screen and (max-width: $ms-screen-max-md) {
+@media screen and (max-width: $uhf-screen-max-mobile) {
   .designSection .feature {
     float: none;
   }
 }
 
-@media screen and (min-width: $ms-screen-min-lg) {
+@media screen and (min-width: $uhf-screen-min-mobile) {
   img {
     margin-bottom: 20px;
   }
@@ -150,7 +150,7 @@
   }
 }
 
-@media screen and (min-width: $ms-screen-min-lg) {
+@media screen and (min-width: $uhf-screen-min-mobile) {
   .steps {
     li {
       @include ms-padding-left(56px);
diff --git a/apps/fabric-website/src/pages/HomePage/HomePage.module.scss b/apps/fabric-website/src/pages/HomePage/HomePage.module.scss
index 99f5004900ac6..a6660d9be914e 100644
--- a/apps/fabric-website/src/pages/HomePage/HomePage.module.scss
+++ b/apps/fabric-website/src/pages/HomePage/HomePage.module.scss
@@ -29,9 +29,9 @@
     background-position: center bottom;
     background-repeat: no-repeat;
     background-size: contain;
-    bottom: -10px;
+    bottom: $svg-hero-bottom-alignment;
     content: '';
-    height: 70px;
+    height: 89px;
     left: -10px;
     position: absolute;
     right: -10px;
@@ -73,7 +73,7 @@
   margin-top: 16px;
 }
 
-@media screen and (min-width: $ms-screen-min-lg) {
+@media screen and (min-width: $uhf-screen-min-mobile) {
   .hero {
     padding-bottom: 120px;
   }
@@ -146,7 +146,7 @@
   text-align: center;
 }
 
-@media screen and (min-width: $ms-screen-min-lg) {
+@media screen and (min-width: $uhf-screen-min-mobile) {
   .flavors {
     flex-direction: row;
     padding-bottom: 72px;
@@ -227,7 +227,7 @@
   background-color: $ms-color-neutralLight;
 }
 
-@media screen and (min-width: $ms-screen-min-lg) {
+@media screen and (min-width: $uhf-screen-min-mobile) {
   .product {
     flex-direction: row;
     padding-bottom: 60px;
@@ -326,7 +326,7 @@
   }
 }
 
-@media screen and (min-width: $ms-screen-min-lg) {
+@media screen and (min-width: $uhf-screen-min-mobile) {
   .featureList {
     flex-direction: row;
     flex-wrap: wrap;
@@ -345,4 +345,4 @@
   .trademark {
     margin-top: 72px;
   }
-}
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/pages/Overviews/Overviews.module.scss b/apps/fabric-website/src/pages/Overviews/Overviews.module.scss
index 96a99c02201ac..75bfc86f77f72 100644
--- a/apps/fabric-website/src/pages/Overviews/Overviews.module.scss
+++ b/apps/fabric-website/src/pages/Overviews/Overviews.module.scss
@@ -72,7 +72,7 @@
   width: 50%;
 }
 
-@media screen and (min-width: $ms-screen-min-lg) {
+@media screen and (min-width: $uhf-screen-min-mobile) {
   .features {
     flex-direction: row;
 
@@ -101,4 +101,4 @@
     @include ms-right(120px);
     z-index: 500;
   }
-}
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss
index 8926bafd8f1da..edf175f5b79fc 100644
--- a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss
+++ b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss
@@ -92,7 +92,7 @@
   }
 }
 
-@media screen and (min-width: $ms-screen-min-lg) {
+@media screen and (min-width: $uhf-screen-min-mobile) {
   .angle {
     margin-top: 0; // Move back down to ensure room for in-page nav
     min-height: 120px;
@@ -105,10 +105,4 @@
   .reachOut {
     margin-bottom: 60px;
   }
-}
-
-@media screen and (min-width: $ms-screen-min-lg) {
-  .reachOut {
-    margin-bottom: 80px;
-  }
-}
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss
index 7bee21dff5a2a..1c3d2db2aaa55 100644
--- a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss
+++ b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss
@@ -48,7 +48,7 @@
   }
 }
 
-@media screen and (min-width: $ms-screen-min-lg) {
+@media screen and (min-width: $uhf-screen-min-mobile) {
   .iconList {
     li {
       width: 50%;
@@ -62,4 +62,4 @@
       width: 33%;
     }
   }
-}
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/styles/_mixins.scss b/apps/fabric-website/src/styles/_mixins.scss
index 5e8c524abede9..fd4d8e7dd0be0 100644
--- a/apps/fabric-website/src/styles/_mixins.scss
+++ b/apps/fabric-website/src/styles/_mixins.scss
@@ -1,8 +1,10 @@
+@import './variables';
+
 // Apply content padding, based on device size
 @mixin contentPadding($paddingTop:0px, $paddingBottom:$contentPaddingBottom) {
   padding: $paddingTop $contentPadding-sm $paddingBottom $contentPadding-sm;
 
-  @media screen and (min-width: $ms-screen-min-lg) {
+  @media screen and (min-width: $uhf-screen-min-mobile) {
     padding: $paddingTop $contentPadding-lg $paddingBottom $contentPadding-lg;
   }
 
@@ -16,7 +18,7 @@
   margin-left: -$contentPadding-sm;
   margin-right: -$contentPadding-sm;
 
-  @media screen and (min-width: $ms-screen-min-lg) {
+  @media screen and (min-width: $uhf-screen-min-mobile) {
     margin-left: -$contentPadding-lg;
     margin-right: -$contentPadding-lg;
   }
@@ -38,9 +40,9 @@
   position: relative;
 
   &::after {
-    bottom: 0;
+    bottom: $svg-angle-bottom-alignment;
     content: '';
-    height: 70px;
+    height: 82px;
     left: -10px;
     pointer-events: none;
     position: absolute;
@@ -67,8 +69,8 @@
       background-position: center bottom;
     }
 
-    @media screen and (min-width: $ms-screen-min-lg) {
-      height: 140px; // Make room for wider angle
+    @media screen and (min-width: $uhf-screen-min-mobile) {
+      height: 150px; // Make room for wider angle
     }
   }
 }
@@ -106,4 +108,4 @@
     background-color: $foregroundColor;
     color: $backgroundColor;
   }
-}
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/styles/_overrides.scss b/apps/fabric-website/src/styles/_overrides.scss
index b773f25c562e2..4f8e02e302521 100644
--- a/apps/fabric-website/src/styles/_overrides.scss
+++ b/apps/fabric-website/src/styles/_overrides.scss
@@ -11,7 +11,7 @@
 
   // Modifier to increase the Grid's gutters depending on screen size
   .ms-Grid--wide {
-    @media screen and (min-width: $ms-screen-min-lg) {
+    @media screen and (min-width: $uhf-screen-min-mobile) {
       margin: 0 (-$contentPadding-lg / 2);
       padding: 0 ($contentPadding-lg / 2);
 
diff --git a/apps/fabric-website/src/styles/_variables.scss b/apps/fabric-website/src/styles/_variables.scss
index 8419ec6c32e23..df35bd8fbcccd 100644
--- a/apps/fabric-website/src/styles/_variables.scss
+++ b/apps/fabric-website/src/styles/_variables.scss
@@ -39,8 +39,15 @@ $color-blog-light: #bad80a;
 $color-blog-lighter: #d1ec3c;
 
 // Component variables
-$App-maximumWidth: 1300px;
-$App-mobileNavBarHeight: 48px;
+$App-maximumWidth: 1600px;
+
+//SVG
+// With the increase in App-maximumWidth for UHF adoption,
+// this makes sure the "V" in the hero stays visable at different breakpoints
+$svg-hero-bottom-alignment: -3px;
+// With the increase in App-maximumWidth for UHF adoption,
+// this gets rid of a thin white gap under component page angles
+$svg-angle-bottom-alignment: -1px;
 
 $CodeBlock-toggleButtonHeight: 28px;
 
@@ -74,5 +81,9 @@ $contentPadding-lg: 32px;
 $contentPadding-xl: 40px;
 $contentPaddingBottom: 100px;
 
+// Screen sizes that align with UHF breakpoints
+$uhf-screen-min-mobile: 768px;
+$uhf-screen-max-mobile: ($uhf-screen-min-mobile - 1);
+$uhf-screen-max-lg: 1083px;
 
-$baseURL: ' https://static2.sharepointonline.com/files/fabric/';
+$baseURL: ' https://static2.sharepointonline.com/files/fabric/';
\ No newline at end of file
diff --git a/apps/fabric-website/webpack.config.js b/apps/fabric-website/webpack.config.js
index 8b09feed450ad..8448d155b1210 100644
--- a/apps/fabric-website/webpack.config.js
+++ b/apps/fabric-website/webpack.config.js
@@ -11,7 +11,7 @@ if (isDogfood) {
 } else if (!isProduction) {
   publicPath = "/dist/";
 }
-const PACKAGE_NAME = 'fabric-site';
+const PACKAGE_NAME = 'fabric-sitev5';
 
 module.exports = resources.createConfig(
   PACKAGE_NAME,
diff --git a/apps/fabric-website/webpack.serve.config.js b/apps/fabric-website/webpack.serve.config.js
index bc30e2427dec1..0e87e38525180 100644
--- a/apps/fabric-website/webpack.serve.config.js
+++ b/apps/fabric-website/webpack.serve.config.js
@@ -1,8 +1,6 @@
 let path = require('path');
 let resources = require('../../scripts/tasks/webpack-resources');
 
-const PACKAGE_NAME = require('./package.json').name;
-
 module.exports = resources.createServeConfig({
   entry: './src/root.tsx',
 
diff --git a/common/changes/@uifabric/example-app-base/fabric-website-v5.0_2017-09-12-17-22.json b/common/changes/@uifabric/example-app-base/fabric-website-v5.0_2017-09-12-17-22.json
new file mode 100644
index 0000000000000..849b54c704779
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/fabric-website-v5.0_2017-09-12-17-22.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "rubixws@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/fabric-website-v5.0_2017-09-12-17-22.json b/common/changes/@uifabric/experiments/fabric-website-v5.0_2017-09-12-17-22.json
new file mode 100644
index 0000000000000..2b4eb4e169fe2
--- /dev/null
+++ b/common/changes/@uifabric/experiments/fabric-website-v5.0_2017-09-12-17-22.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/experiments",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "rubixws@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/fabric-website-v5.0_2017-09-12-17-22.json b/common/changes/@uifabric/fabric-website/fabric-website-v5.0_2017-09-12-17-22.json
new file mode 100644
index 0000000000000..8f95b05daae17
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/fabric-website-v5.0_2017-09-12-17-22.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Major site revisions, component updates, removal of dev office header and footer, infrastructure updates and improvements, webpack config updates.",
+      "type": "major"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "rubixws@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/uhf-visual-bugs_2017-09-06-21-49.json b/common/changes/@uifabric/fabric-website/uhf-visual-bugs_2017-09-06-21-49.json
new file mode 100644
index 0000000000000..f50d0054b517e
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/uhf-visual-bugs_2017-09-06-21-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Visual bug fixes for UHF adoption for website",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/fabric-website-v5.0_2017-09-12-17-22.json b/common/changes/@uifabric/styling/fabric-website-v5.0_2017-09-12-17-22.json
new file mode 100644
index 0000000000000..464a67d8c85a8
--- /dev/null
+++ b/common/changes/@uifabric/styling/fabric-website-v5.0_2017-09-12-17-22.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "rubixws@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/fabric-website-v5.0_2017-09-12-17-22.json b/common/changes/@uifabric/utilities/fabric-website-v5.0_2017-09-12-17-22.json
new file mode 100644
index 0000000000000..61730dc2feec6
--- /dev/null
+++ b/common/changes/@uifabric/utilities/fabric-website-v5.0_2017-09-12-17-22.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "rubixws@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fabric-website-v5.0_2017-09-12-17-22.json b/common/changes/office-ui-fabric-react/fabric-website-v5.0_2017-09-12-17-22.json
new file mode 100644
index 0000000000000..55432625cd7c9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fabric-website-v5.0_2017-09-12-17-22.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "office-ui-fabric-react",
+      "type": "none"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "rubixws@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/uhf-visual-bugs_2017-09-06-21-49.json b/common/changes/office-ui-fabric-react/uhf-visual-bugs_2017-09-06-21-49.json
new file mode 100644
index 0000000000000..0594c85f192d3
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/uhf-visual-bugs_2017-09-06-21-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Visual bug fixes for UHF adoption for website",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/src/common/_common.scss b/packages/example-app-base/src/common/_common.scss
index 56c0e7b28b5d3..83759f9fbf647 100644
--- a/packages/example-app-base/src/common/_common.scss
+++ b/packages/example-app-base/src/common/_common.scss
@@ -4,3 +4,6 @@
 @import './focusBorder';
 @import './semanticColorVariables';
 
+// Screen sizes that align with UHF breakpoints for the website
+$uhf-screen-min-mobile: 768px;
+$uhf-screen-max-mobile: ($uhf-screen-min-mobile - 1);
\ No newline at end of file
diff --git a/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss b/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss
index ed0b0bef2fb63..64cab6d2ea179 100644
--- a/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss
+++ b/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss
@@ -169,7 +169,7 @@ $dontColor: #A61E22;
     background-color: #e74856;
   }
 
-  @media screen and (min-width: $ms-screen-min-lg) {
+  @media screen and (min-width: $uhf-screen-min-mobile) {
     .ComponentPage-doSection {
       margin-bottom: -10px; // Trim last list item
       width: calc(50% - 60px);
diff --git a/packages/office-ui-fabric-react/src/common/_common.scss b/packages/office-ui-fabric-react/src/common/_common.scss
index 823b00129b134..f3d4e84709aab 100644
--- a/packages/office-ui-fabric-react/src/common/_common.scss
+++ b/packages/office-ui-fabric-react/src/common/_common.scss
@@ -4,3 +4,6 @@
 @import './focusBorder';
 @import './semanticColorVariables';
 
+// Screen sizes that align with UHF breakpoints for the website
+$uhf-screen-min-mobile: 768px;
+$uhf-screen-max-mobile: ($uhf-screen-min-mobile - 1);
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss
index 1f1d8a4b56943..21e1860d640d9 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss
@@ -101,7 +101,7 @@ $Breadcrumb-chevron-sm: 8px;
   outline: transparent;
 }
 
-@media screen and (max-width: $ms-screen-max-md) {
+@media screen and (max-width: $uhf-screen-max-mobile) {
   // margin: 11px 0 1px;
 
   .listItem .itemLink {
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.scss b/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
index 64b0e8ddc444b..87d35b9dbd045 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
@@ -108,7 +108,7 @@ $CommandBarHeight: 44px;
 .root.rootIsXLarge,
 .root.rootIsCustom {
   .main {
-    @media (min-width: $ms-screen-min-lg) {
+    @media (min-width: $uhf-screen-min-mobile) {
       @include ms-left($Panel-margin-md);
       width: auto;
     }
@@ -228,7 +228,7 @@ $CommandBarHeight: 44px;
   padding-left: 16px;
   padding-right: 16px;
 
-  @media (min-width: $ms-screen-min-lg) {
+  @media (min-width: $uhf-screen-min-mobile) {
     padding-left: 32px;
     padding-right: 32px;
   }
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.scss b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.scss
index d77255b1575f8..77ab0e0124b05 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.scss
+++ b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.scss
@@ -229,7 +229,7 @@
 
 // @TODO: Confirm that this component is not responsive.
 //
-// @media (min-width: $ms-screen-min-lg) {
+// @media (min-width: $uhf-screen-min-mobile) {
 //   .link {
 //     font-size: $ms-font-size-m;
 //   }

From 219d6cb38f1c2af59d5d463ceabe576ecfe682e8 Mon Sep 17 00:00:00 2001
From: John Miller <rubixws@gmail.com>
Date: Tue, 19 Sep 2017 00:13:42 -0700
Subject: [PATCH 0663/1641] General component cleanup for website (#2876)

---
 ...al-component-cleanup_2017-09-07-21-42.json | 11 ++++++++
 .../examples/Breadcrumb.Basic.Example.tsx     |  9 ++++---
 .../src/components/Button/ButtonPage.tsx      | 11 ++++----
 .../examples/Callout.Directional.Example.tsx  |  6 +++--
 .../ContextualMenu/ContextualMenuPage.tsx     |  2 +-
 .../ContextualMenu.Directional.Example.tsx    |  7 ++---
 .../src/components/Dialog/DialogPage.tsx      |  6 ++---
 .../Dialog/examples/Dialog.Basic.Example.tsx  | 24 -----------------
 .../examples/Dialog.Blocking.Example.tsx      | 26 +------------------
 .../DocumentCard/DocumentCardPage.tsx         |  6 ++---
 .../examples/Facepile.Basic.Example.tsx       |  5 ++--
 .../Layer/examples/Layer.Basic.Example.tsx    |  4 ++-
 .../Layer/examples/Layer.Hosted.Example.tsx   |  7 ++---
 .../MarqueeSelection.Basic.Example.tsx        |  5 ++--
 .../examples/Persona.Basic.Example.tsx        | 25 +++++++-----------
 .../src/components/Pivot/PivotPage.tsx        |  2 +-
 .../Pivot/examples/Pivot.Basic.Example.tsx    |  4 ++-
 .../ProgressIndicatorPage.tsx                 |  2 +-
 .../components/SearchBox/SearchBoxPage.tsx    |  4 +--
 .../src/components/Toggle/TogglePage.tsx      |  2 +-
 .../src/components/Tooltip/TooltipPage.tsx    |  4 +--
 .../examples/Picker.CustomResult.Example.tsx  | 11 ++++----
 .../examples/TagPicker.Basic.Example.tsx      |  5 ++--
 23 files changed, 80 insertions(+), 108 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/general-component-cleanup_2017-09-07-21-42.json

diff --git a/common/changes/office-ui-fabric-react/general-component-cleanup_2017-09-07-21-42.json b/common/changes/office-ui-fabric-react/general-component-cleanup_2017-09-07-21-42.json
new file mode 100644
index 0000000000000..814a8195bdacd
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/general-component-cleanup_2017-09-07-21-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Cleaned up Default Dialogue to more cleanly represent the default state. Reformated exampleStyles imports to work towards more modularity. Typo and language fixes.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
index 7957a72d13c1f..9872b95af8692 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
@@ -8,7 +8,8 @@ import {
   autobind
 } from '../../../Utilities';
 import { Label } from 'office-ui-fabric-react/lib/Label';
-import '../../../common/_exampleStyles.scss';
+import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
+const exampleStyles: any = exampleStylesImport;
 
 export class BreadcrumbBasicExample extends React.Component<any, any> {
   constructor() {
@@ -18,7 +19,7 @@ export class BreadcrumbBasicExample extends React.Component<any, any> {
   public render() {
     return (
       <div>
-        <Label className='exampleLabel'>With maxDisplayedItems set to six</Label>
+        <Label className={ exampleStyles.exampleLabel }>With maxDisplayedItems set to six</Label>
         <Breadcrumb
           items={ [
             { text: 'Files', 'key': 'Files', onClick: this._onBreadcrumbItemClicked },
@@ -32,7 +33,7 @@ export class BreadcrumbBasicExample extends React.Component<any, any> {
           ariaLabel={ 'Website breadcrumb' }
         />
 
-        <Label className='exampleLabel'>With maxDisplayedItems set to three</Label>
+        <Label className={ exampleStyles.exampleLabel }>With maxDisplayedItems set to three</Label>
         <Breadcrumb
           items={ [
             { text: 'Files', 'key': 'Files', href: '#/examples/breadcrumb', onClick: this._onBreadcrumbItemClicked },
@@ -45,7 +46,7 @@ export class BreadcrumbBasicExample extends React.Component<any, any> {
           maxDisplayedItems={ 3 }
           ariaLabel={ 'Website breadcrumb' }
         />
-      </div>
+      </div >
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
index ef3ff8df0f777..bfc7817bce9c1 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
@@ -5,7 +5,6 @@ import {
   ComponentPage,
   PropertiesTableSet
 } from '@uifabric/example-app-base';
-import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { ButtonDefaultExample } from './examples/Button.Default.Example';
 import { ButtonContextualMenuExample } from './examples/Button.ContextualMenu.Example';
 import { ButtonCompoundExample } from './examples/Button.Compound.Example';
@@ -16,9 +15,11 @@ import { ButtonAnchorExample } from './examples/Button.Anchor.Example';
 import { ButtonScreenReaderExample } from './examples/Button.ScreenReader.Example';
 import { ButtonSwapExample } from './examples/Button.Swap.Example';
 import { ButtonSplitExample, ButtonSplitCustomExample } from './examples/Button.Split.Example';
-import './examples/Button.Basic.Example.scss';
-import '../../common/_exampleStyles.scss';
+import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { Link } from '../../Link';
+import './examples/Button.Basic.Example.scss';
+import * as exampleStylesImport from '../../common/_exampleStyles.scss';
+const exampleStyles: any = exampleStylesImport;
 
 const ButtonDefaultExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx') as string;
 const ButtonCompoundExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx') as string;
@@ -53,13 +54,13 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
         exampleCards={
           <div>
             <Checkbox
-              className='exampleCheckbox'
+              className={ exampleStyles.exampleCheckbox }
               label='Disable buttons'
               checked={ this.state.areButtonsDisabled }
               onChange={ this._onDisabledChanged.bind(this) }
             />
             <Checkbox
-              className='exampleCheckbox'
+              className={ exampleStyles.exampleCheckbox }
               label='Mark as checked'
               checked={ this.state.areButtonsChecked }
               onChange={ this._onToggledChanged.bind(this) }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
index 4fb43e17c1785..cd1abd5537659 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
@@ -6,7 +6,9 @@ import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { Slider } from 'office-ui-fabric-react/lib/Slider';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import './CalloutExample.scss';
-import '../../../common/_exampleStyles.scss';
+
+import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
+const exampleStyles: any = exampleStylesImport;
 
 export interface ICalloutDirectionalExampleState {
   isCalloutVisible?: boolean;
@@ -52,7 +54,7 @@ export class CalloutDirectionalExample extends React.Component<any, ICalloutDire
       <div className='ms-CalloutExample'>
         <div className='ms-CalloutExample-configArea'>
           <Checkbox
-            className='exampleCheckbox'
+            className={ exampleStyles.exampleCheckbox }
             label='Show beak'
             checked={ isBeakVisible }
             onChange={ this._onShowBeakChange }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
index b113111121291..261c337b0d0ed 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
@@ -39,7 +39,7 @@ export class ContextualMenuPage extends React.Component<IComponentDemoPageProps,
             <ExampleCard title='ContextualMenu with beak/direction test' code={ ContextualMenuDirectionalExampleCode }>
               <ContextualMenuDirectionalExample />
             </ExampleCard>
-            <ExampleCard title='ContextualMenu wtih customization' code={ ContextualMenuCustomizationExampleCode }>
+            <ExampleCard title='ContextualMenu with customization' code={ ContextualMenuCustomizationExampleCode }>
               <ContextualMenuCustomizationExample />
             </ExampleCard>
             <ExampleCard title='ContextualMenu with header' code={ ContextualMenuHeaderExampleCode }>
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
index 648659b1d4eeb..ad49b644f4b6e 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
@@ -7,7 +7,8 @@ import { Slider } from 'office-ui-fabric-react/lib/Slider';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
 import { autobind, getRTL } from 'office-ui-fabric-react/lib/Utilities';
 import './ContextualMenuExample.scss';
-import '../../../common/_exampleStyles.scss';
+import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
+const exampleStyles: any = exampleStylesImport;
 
 export interface IContextualMenuDirectionalExampleState {
   isContextualMenuVisible?: boolean;
@@ -75,13 +76,13 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
       <div className='ms-ContextualMenuDirectionalExample'>
         <div className='ms-ContextualMenuDirectionalExample-configArea'>
           <Checkbox
-            className='exampleCheckbox'
+            className={ exampleStyles.exampleCheckbox }
             label='Show beak'
             checked={ isBeakVisible }
             onChange={ this._onShowBeakChange }
           />
           <Checkbox
-            className='exampleCheckbox'
+            className={ exampleStyles.exampleCheckbox }
             label='Fix Edge'
             checked={ edgeFixed }
             onChange={ this._onFixEdgeChange }
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx
index 324497073f1d2..5534d8d3610a7 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx
@@ -21,16 +21,16 @@ export class DialogPage extends React.Component<IComponentDemoPageProps, {}> {
         componentName='DialogExample'
         exampleCards={
           <div>
-            <ExampleCard title='Dialog' code={ DialogBasicExampleCode }>
+            <ExampleCard title='Default Dialog' code={ DialogBasicExampleCode }>
               <DialogBasicExample />
             </ExampleCard>
-            <ExampleCard title='Dialog Large Header' code={ DialogLargeHeaderExampleCode }>
+            <ExampleCard title='Dialog with large header and ChoiceGroup' code={ DialogLargeHeaderExampleCode }>
               <p>
                 Use this Dialog sparingly, when calling extra attention to the content. It can be used in situations where you want to teach the user something or notify them of an important change.
               </p>
               <DialogLargeHeaderExample />
             </ExampleCard>
-            <ExampleCard title='Dialog Blocking' code={ DialogBlockingExampleCode }>
+            <ExampleCard title='Blocking Dialog' code={ DialogBlockingExampleCode }>
               <p>
                 A blocking Dialog disables all other actions and commands on the page behind it. They should be used very sparingly, only when it is critical that the user makes a choice or provides information before they can proceed. Blocking Dialogs are generally used for irreversible or potentially destructive tasks.
               </p>
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
index e5fe30e18aba6..34c3299fc7d0c 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import { autobind } from '../../../Utilities';
 import { Dialog, DialogType, DialogFooter } from 'office-ui-fabric-react/lib/Dialog';
 import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
-import { ChoiceGroup } from 'office-ui-fabric-react/lib/ChoiceGroup';
 import './Dialog.Basic.Example.scss';
 
 export class DialogBasicExample extends React.Component<any, any> {
@@ -40,25 +39,6 @@ export class DialogBasicExample extends React.Component<any, any> {
             containerClassName: 'ms-dialogMainOverride'
           } }
         >
-          <ChoiceGroup
-            options={ [
-              {
-                key: 'A',
-                text: 'Option A'
-              },
-              {
-                key: 'B',
-                text: 'Option B',
-                checked: true
-              },
-              {
-                key: 'C',
-                text: 'Option C',
-                disabled: true
-              }
-            ] }
-            onChange={ this._onChoiceChanged }
-          />
           { null /** You can also include null values as the result of conditionals */ }
           <DialogFooter>
             <PrimaryButton onClick={ this._closeDialog } text='Save' />
@@ -78,8 +58,4 @@ export class DialogBasicExample extends React.Component<any, any> {
   private _closeDialog() {
     this.setState({ hideDialog: true });
   }
-
-  private _onChoiceChanged() {
-    console.log('Choice option change');
-  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx
index 7e738a7a80550..164897924538c 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import { autobind } from '../../../Utilities';
 import { Dialog, DialogType, DialogFooter } from 'office-ui-fabric-react/lib/Dialog';
 import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
-import { ChoiceGroup } from 'office-ui-fabric-react/lib/ChoiceGroup';
 
 export class DialogBlockingExample extends React.Component<any, any> {
 
@@ -34,25 +33,6 @@ export class DialogBlockingExample extends React.Component<any, any> {
             containerClassName: 'ms-dialogMainOverride'
           } }
         >
-          <ChoiceGroup
-            options={ [
-              {
-                key: 'A',
-                text: 'Option A'
-              },
-              {
-                key: 'B',
-                text: 'Option B',
-                checked: true
-              },
-              {
-                key: 'C',
-                text: 'Option C',
-                disabled: true
-              }
-            ] }
-            onChange={ this._onChoiceChanged }
-          />
           <DialogFooter>
             <PrimaryButton onClick={ this._closeDialog } text='Save' />
             <DefaultButton onClick={ this._closeDialog } text='Cancel' />
@@ -71,8 +51,4 @@ export class DialogBlockingExample extends React.Component<any, any> {
   private _closeDialog() {
     this.setState({ hideDialog: true });
   }
-
-  private _onChoiceChanged() {
-    console.log('Choice option change');
-  }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx
index a032ff065c2ea..47172909ff8be 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx
@@ -21,19 +21,19 @@ export class DocumentCardPage extends React.Component<IComponentDemoPageProps, {
         componentName='DocumentCardExample'
         exampleCards={
           <div>
-            <ExampleCard title='DocumentCard Basic' code={ DocumentCardBasicExampleCode }>
+            <ExampleCard title='Default DocumentCard' code={ DocumentCardBasicExampleCode }>
               <p>
                 The default configuration for a card represents a single file, with space to denote the last significant event and the person involved.
               </p>
               <DocumentCardBasicExample />
             </ExampleCard>
-            <ExampleCard title='DocumentCard Complete' code={ DocumentCardCompleteExampleCode }>
+            <ExampleCard title='DocumentCard with multiple items, commands, and views' code={ DocumentCardCompleteExampleCode }>
               <p>
                 This example shows a couple of optional abilities, including being able to have a card represent multiple items, being able to expose up to three relevant commands, and showing the number of views in the bottom right corner.
               </p>
               <DocumentCardCompleteExample />
             </ExampleCard>
-            <ExampleCard title='DocumentCard Compact Layout' code={ DocumentCardCompactExampleCode }>
+            <ExampleCard title='DocumentCard with compact layout ' code={ DocumentCardCompactExampleCode }>
               <p>
                 When showing a card on a mobile device or a similarly narrow layout, you may choose this Compact layout which helps the filename remain scannable while giving roomy space for a preview thumbnail.
               </p>
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
index b2ae60df58ec6..86f39974d0ab5 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
@@ -12,7 +12,8 @@ import {
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { facepilePersonas } from './FacepileExampleData';
 import './Facepile.Examples.scss';
-import '../../../common/_exampleStyles.scss';
+import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
+const exampleStyles: any = exampleStylesImport;
 
 export enum ExtraDataType {
   none = 0,
@@ -72,7 +73,7 @@ export class FacepileBasicExample extends React.Component<any, IFacepileBasicExa
           />
         </div>
         <Checkbox
-          className='exampleCheckbox'
+          className={ exampleStyles.exampleCheckbox }
           label='Fade In'
           checked={ this.state.imagesFadeIn }
           onChange={ this._onChangeFadeIn }
diff --git a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
index 471887ac246ca..107bd313aa08f 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
@@ -7,6 +7,8 @@ import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { Layer } from 'office-ui-fabric-react/lib/Layer';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { AnimationClassNames } from '../../../Styling';
+import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
+const exampleStyles: any = exampleStylesImport;
 
 export class LayerContentExample extends BaseComponent<any, any> {
   public static contextTypes = {
@@ -64,7 +66,7 @@ export class LayerBasicExample extends BaseComponent<any, any> {
       <div>
 
         <Checkbox
-          className='exampleCheckbox'
+          className={ exampleStyles.exampleCheckbox }
           label='Wrap the content box belowed in a Layer'
           checked={ showLayer }
           onChange={ this._onChange }
diff --git a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
index 7671401cada9f..0cd120823d2dc 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
@@ -3,9 +3,10 @@ import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { Layer, LayerHost } from 'office-ui-fabric-react/lib/Layer';
 import { Toggle } from 'office-ui-fabric-react/lib/Toggle';
-import './Layer.Example.scss';
-import '../../../common/_exampleStyles.scss';
 import { AnimationClassNames } from '../../../Styling';
+import './Layer.Example.scss';
+import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
+const exampleStyles: any = exampleStylesImport;
 
 export class LayerHostedExample extends React.Component<any, any> {
   constructor() {
@@ -41,7 +42,7 @@ export class LayerHostedExample extends React.Component<any, any> {
         </p>
 
         <Checkbox
-          className='exampleCheckbox'
+          className={ exampleStyles.exampleCheckbox }
           label='Render the box below in a Layer and target it at hostId=layerhost1'
           checked={ showLayer }
           onChange={ this._onChangeCheckbox }
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
index 800bc3d59ed5c..4524217a18b6a 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
@@ -10,7 +10,8 @@ import {
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { MarqueeSelection, Selection, IObjectWithKey } from 'office-ui-fabric-react/lib/MarqueeSelection';
 import './MarqueeSelection.Basic.Example.scss';
-import '../../../common/_exampleStyles.scss';
+import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
+const exampleStyles: any = exampleStylesImport;
 
 interface IPhoto extends IObjectWithKey {
   url: string;
@@ -63,7 +64,7 @@ export class MarqueeSelectionBasicExample extends React.Component<{}, IMarqueeSe
     return (
       <MarqueeSelection selection={ this._selection } isEnabled={ this.state.isMarqueeEnabled }>
         <Checkbox
-          className='exampleCheckbox'
+          className={ exampleStyles.exampleCheckbox }
           label='Is marquee enabled'
           defaultChecked={ true }
           onChange={ this._onChange }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
index ecda1b99d1e2b..dd99288d5a95d 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
@@ -7,7 +7,8 @@ import {
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { Label } from 'office-ui-fabric-react/lib/Label';
 import { TestImages } from '../../../common/TestImages';
-import '../../../common/_exampleStyles.scss';
+import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
+const exampleStyles: any = exampleStylesImport;
 
 const examplePersona = {
   imageUrl: TestImages.personaFemale,
@@ -39,32 +40,28 @@ export class PersonaBasicExample extends React.Component<React.Props<PersonaBasi
           />
         </div>
 
-        <Label className='example-label'>Tiny Persona (12px)</Label>
+        <Label className={ exampleStyles.exampleLabel }>Tiny Persona (12px)</Label>
         <Persona
           { ...examplePersona }
           size={ PersonaSize.tiny }
           presence={ PersonaPresence.offline }
           hidePersonaDetails={ !renderPersonaDetails }
         />
-
-        <Label className='example-label'>Extra Extra Small Persona (24px)</Label>
-
+        <Label className={ exampleStyles.exampleLabel }>Extra Extra Small Persona (24px)</Label>
         <Persona
           { ...examplePersona }
           size={ PersonaSize.extraExtraSmall }
           presence={ PersonaPresence.none }
           hidePersonaDetails={ !renderPersonaDetails }
         />
-
-        <Label className='example-label'>Size 28 Persona (28px)</Label>
+        <Label className={ exampleStyles.exampleLabel }>Size 28 Persona (28px)</Label>
         <Persona
           { ...examplePersona }
           size={ PersonaSize.size28 }
           presence={ PersonaPresence.none }
           hidePersonaDetails={ !renderPersonaDetails }
         />
-
-        <Label className='example-label'>Extra Small Persona (32px)</Label>
+        <Label className={ exampleStyles.exampleLabel }>Extra Small Persona (32px)</Label>
         <Persona
           { ...examplePersona }
           size={ PersonaSize.extraSmall }
@@ -72,30 +69,28 @@ export class PersonaBasicExample extends React.Component<React.Props<PersonaBasi
           hidePersonaDetails={ !renderPersonaDetails }
         />
 
-        <Label className='example-label'>Small Persona (40px)</Label>
+        <Label className={ exampleStyles.exampleLabel }>Small Persona (40px)</Label>
         <Persona
           { ...examplePersona }
           size={ PersonaSize.small }
           presence={ PersonaPresence.away }
           hidePersonaDetails={ !renderPersonaDetails }
         />
-
-        <Label className='example-label'>Medium Persona (48px)</Label>
+        <Label className={ exampleStyles.exampleLabel }>Medium Persona (48px)</Label>
         <Persona
           { ...examplePersona }
           hidePersonaDetails={ !renderPersonaDetails }
           presence={ PersonaPresence.busy }
         />
 
-        <Label className='example-label'>Large Persona (72px)</Label>
+        <Label className={ exampleStyles.exampleLabel }>Large Persona (72px)</Label>
         <Persona
           { ...examplePersona }
           size={ PersonaSize.large }
           presence={ PersonaPresence.dnd }
           hidePersonaDetails={ !renderPersonaDetails }
         />
-
-        <Label className='example-label'>Extra Large Persona (100px)</Label>
+        <Label className={ exampleStyles.exampleLabel }>Extra Large Persona (100px)</Label>
         <Persona
           { ...examplePersona }
           size={ PersonaSize.extraLarge }
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx b/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx
index bc872cb3de80d..e9520cd10c9a9 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx
@@ -35,7 +35,7 @@ export class PivotPage extends React.Component<IComponentDemoPageProps, {}> {
         componentName='PivotExample'
         exampleCards={
           <div>
-            <ExampleCard title='Basic example' code={ PivotBasicExampleCode }>
+            <ExampleCard title='Default Pivot' code={ PivotBasicExampleCode }>
               <PivotBasicExample />
             </ExampleCard>
             <ExampleCard title='Count and Icon' code={ PivotIconCountExampleCode }>
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.Basic.Example.tsx
index 7c872ab9abe92..4b1efa1d9964a 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.Basic.Example.tsx
@@ -1,6 +1,8 @@
 import * as React from 'react';
 import { Label } from 'office-ui-fabric-react/lib/Label';
 import { Pivot, PivotItem } from 'office-ui-fabric-react/lib/Pivot';
+import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
+const exampleStyles: any = exampleStylesImport;
 
 export class PivotBasicExample extends React.Component<any, any> {
   public render() {
@@ -8,7 +10,7 @@ export class PivotBasicExample extends React.Component<any, any> {
       <div>
         <Pivot>
           <PivotItem linkText='My Files'>
-            <Label>Pivot #1</Label>
+            <Label className={ exampleStyles.exampleLabel }>Pivot #1</Label>
           </PivotItem>
           <PivotItem linkText='Recent'>
             <Label>Pivot #2</Label>
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx
index 58ac0c3ea94bc..fb9efaabce5cd 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx
@@ -15,7 +15,7 @@ export class ProgressIndicatorPage extends React.Component<IComponentDemoPagePro
         title='ProgressIndicator'
         componentName='ProgressIndicatorExample'
         exampleCards={
-          <ExampleCard title='ProgressIndicator' code={ ProgressIndicatorBasicExampleCode }>
+          <ExampleCard title='Default ProgressIndicator' code={ ProgressIndicatorBasicExampleCode }>
             <ProgressIndicatorBasicExample />
           </ExampleCard>
         }
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
index 73b7d690e1267..4d0c2998f91f5 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
@@ -20,10 +20,10 @@ export class SearchBoxPage extends React.Component<IComponentDemoPageProps, {}>
         componentName='SearchBoxExample'
         exampleCards={
           <div>
-            <ExampleCard title='SearchBox' code={ SearchBoxSmallExampleCode }>
+            <ExampleCard title='Default SearchBox' code={ SearchBoxSmallExampleCode }>
               <SearchBoxSmallExample />
             </ExampleCard>
-            <ExampleCard title='SearchBox - No Parent Container' code={ SearchBoxFullSizeExampleCode }>
+            <ExampleCard title='SearchBox with no parent container' code={ SearchBoxFullSizeExampleCode }>
               <SearchBoxFullSizeExample />
             </ExampleCard>
           </div>
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
index 8b64e691b47ca..4bb3199936333 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
@@ -17,7 +17,7 @@ export class TogglePage extends React.Component<IComponentDemoPageProps, {}> {
         title='Toggle'
         componentName='ToggleExample'
         exampleCards={
-          <ExampleCard title='Toggle' code={ ToggleBasicExampleCode }>
+          <ExampleCard title='Default Toggles' code={ ToggleBasicExampleCode }>
             <ToggleBasicExample />
           </ExampleCard>
         }
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.tsx
index a8728bfff5a14..c750f005e56da 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.tsx
@@ -24,11 +24,11 @@ export class TooltipPage extends React.Component<any, any> {
         componentName='TooltipExample'
         exampleCards={
           <LayerHost>
-            <ExampleCard title='Tooltip' code={ TooltipBasicExampleCode }>
+            <ExampleCard title='Default Tooltip' code={ TooltipBasicExampleCode }>
               <TooltipBasicExample />
             </ExampleCard>
 
-            <ExampleCard title='Custom Tooltip' code={ TooltipCustomExampleCode }>
+            <ExampleCard title='Tooltip with list' code={ TooltipCustomExampleCode }>
               <TooltipCustomExample />
             </ExampleCard>
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
index 5c03e51e886fc..740786f5740bf 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
@@ -22,10 +22,12 @@ import {
   IPickerItemProps,
   ISuggestionItemProps
 } from 'office-ui-fabric-react/lib/Pickers';
-import './Picker.CustomResult.Example.scss';
-import '../../../common/_exampleStyles.scss';
+
 import { TestImages } from '../../../common/TestImages';
 import { IButtonProps } from 'office-ui-fabric-react/lib/Button';
+import './Picker.CustomResult.Example.scss';
+import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
+const exampleStyles: any = exampleStylesImport;
 
 export interface IPeoplePickerExampleState {
   contextualMenuVisible?: boolean;
@@ -328,9 +330,8 @@ export class PickerCustomResultExample extends React.Component<any, IPeoplePicke
   public render() {
     return (
       <div>
-
         <Checkbox
-          className='exampleCheckbox'
+          className={ exampleStyles.exampleCheckbox }
           label='Disable Document Picker'
           checked={ this.state.isPickerDisabled }
           onChange={ this._onDisabledButtonClick }
@@ -353,7 +354,7 @@ export class PickerCustomResultExample extends React.Component<any, IPeoplePicke
             onBlur: () => console.log('onBlur called')
           } }
         />
-      </div>
+      </div >
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
index 1b3be8beaa018..fd3bd30bd39aa 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
@@ -3,7 +3,8 @@ import { autobind } from '../../../Utilities';
 import { TagPicker } from 'office-ui-fabric-react/lib/components/pickers/TagPicker/TagPicker';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { ITagPickerDemoPageState } from 'office-ui-fabric-react/lib/components/pickers/examples/ITagPickerDemoPageState';
-import '../../../common/_exampleStyles.scss';
+import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
+const exampleStyles: any = exampleStylesImport;
 
 let _testTags = [
   'black',
@@ -35,7 +36,7 @@ export class TagPickerBasicExample extends React.Component<{}, ITagPickerDemoPag
     return (
       <div>
         <Checkbox
-          className='exampleCheckbox'
+          className={ exampleStyles.exampleCheckbox }
           label='Disable Tag Picker'
           checked={ this.state.isPickerDisabled }
           onChange={ this._onDisabledButtonClick }

From 571153678e2b5d90a181d606012db2967decee3e Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 19 Sep 2017 10:08:55 +0000
Subject: [PATCH 0664/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 36 +++++++++++++
 apps/fabric-website/CHANGELOG.md              | 15 +++++-
 apps/fabric-website/package.json              |  6 +--
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 .../fabric-website-v5.0_2017-09-12-17-22.json | 11 ----
 .../fabric-website-v5.0_2017-09-12-17-22.json | 11 ----
 .../layout-group-tweaks_2017-09-12-23-22.json | 11 ----
 .../alt-text-revision_2017-09-01-17-27.json   | 11 ----
 ...nam-rm-fabricjs-refs_2017-08-24-18-05.json | 11 ----
 .../fabric-website-v5.0_2017-09-12-17-22.json | 11 ----
 .../uhf-visual-bugs_2017-09-06-21-49.json     | 11 ----
 .../fabric-website-v5.0_2017-09-12-17-22.json | 11 ----
 .../fabric-website-v5.0_2017-09-12-17-22.json | 11 ----
 .../add-persona-label_2017-08-25-18-24.json   | 11 ----
 .../alt-image-text_2017-08-25-19-14.json      | 11 ----
 .../alt-text-revision_2017-09-01-17-27.json   | 11 ----
 .../dropdown-state_2017-09-05-17-45.json      | 11 ----
 .../fabric-website-v5.0_2017-09-12-17-22.json | 11 ----
 ...al-component-cleanup_2017-09-07-21-42.json | 11 ----
 .../master_2017-09-18-20-37.json              | 11 ----
 ...red-component-styles_2017-08-31-17-18.json | 11 ----
 ...ton-container-styles_2017-09-12-21-30.json | 11 ----
 .../uhf-visual-bugs_2017-09-06-21-49.json     | 11 ----
 packages/experiments/CHANGELOG.json           | 19 +++++++
 packages/experiments/CHANGELOG.md             |  9 +++-
 packages/experiments/package.json             |  4 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 54 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 17 +++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 31 files changed, 156 insertions(+), 221 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/fabric-website-v5.0_2017-09-12-17-22.json
 delete mode 100644 common/changes/@uifabric/experiments/fabric-website-v5.0_2017-09-12-17-22.json
 delete mode 100644 common/changes/@uifabric/experiments/layout-group-tweaks_2017-09-12-23-22.json
 delete mode 100644 common/changes/@uifabric/fabric-website/alt-text-revision_2017-09-01-17-27.json
 delete mode 100644 common/changes/@uifabric/fabric-website/emlynam-rm-fabricjs-refs_2017-08-24-18-05.json
 delete mode 100644 common/changes/@uifabric/fabric-website/fabric-website-v5.0_2017-09-12-17-22.json
 delete mode 100644 common/changes/@uifabric/fabric-website/uhf-visual-bugs_2017-09-06-21-49.json
 delete mode 100644 common/changes/@uifabric/styling/fabric-website-v5.0_2017-09-12-17-22.json
 delete mode 100644 common/changes/@uifabric/utilities/fabric-website-v5.0_2017-09-12-17-22.json
 delete mode 100644 common/changes/office-ui-fabric-react/add-persona-label_2017-08-25-18-24.json
 delete mode 100644 common/changes/office-ui-fabric-react/alt-image-text_2017-08-25-19-14.json
 delete mode 100644 common/changes/office-ui-fabric-react/alt-text-revision_2017-09-01-17-27.json
 delete mode 100644 common/changes/office-ui-fabric-react/dropdown-state_2017-09-05-17-45.json
 delete mode 100644 common/changes/office-ui-fabric-react/fabric-website-v5.0_2017-09-12-17-22.json
 delete mode 100644 common/changes/office-ui-fabric-react/general-component-cleanup_2017-09-07-21-42.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2017-09-18-20-37.json
 delete mode 100644 common/changes/office-ui-fabric-react/shared-component-styles_2017-08-31-17-18.json
 delete mode 100644 common/changes/office-ui-fabric-react/split-button-container-styles_2017-09-12-21-30.json
 delete mode 100644 common/changes/office-ui-fabric-react/uhf-visual-bugs_2017-09-06-21-49.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index dc7993357fd56..2f760ffe7223a 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,42 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.0.0",
+      "tag": "@uifabric/fabric-website_v5.0.0",
+      "date": "Tue, 19 Sep 2017 10:08:55 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "John Miller <rubixws@gmail.com>",
+            "commit": "5c586f0d68efe83ed9eb7fa95e2f8926c566122d",
+            "comment": "Revised alt text best practes for ImageComponent."
+          },
+          {
+            "author": "John Miller <rubixws@gmail.com>",
+            "commit": "c258bfc71bb9d3a9aca60d75553d1db57410a343",
+            "comment": "Removed references to FabricJS from the website."
+          },
+          {
+            "author": "John Miller <rubixws@gmail.com>",
+            "commit": "055dd03c8ad9d74843f2bc3445d529a3c1fd8cb5",
+            "comment": "Visual bug fixes for UHF adoption for website"
+          }
+        ],
+        "major": [
+          {
+            "author": "John Miller <rubixws@gmail.com>",
+            "commit": "055dd03c8ad9d74843f2bc3445d529a3c1fd8cb5",
+            "comment": "Major site revisions, component updates, removal of dev office header and footer, infrastructure updates and improvements, webpack config updates."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.48.0 <5.0.0` to `>=4.48.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.7.6",
       "tag": "@uifabric/fabric-website_v4.7.6",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 8fd3ced599ae7..171fa99daed6f 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Fri, 01 Sep 2017 16:51:57 GMT and should not be manually modified.
+This log was last generated on Tue, 19 Sep 2017 10:08:55 GMT and should not be manually modified.
+
+## 5.0.0
+Tue, 19 Sep 2017 10:08:55 GMT
+
+### Breaking changes
+
+- Major site revisions, component updates, removal of dev office header and footer, infrastructure updates and improvements, webpack config updates.
+
+### Patches
+
+- Revised alt text best practes for ImageComponent.
+- Removed references to FabricJS from the website.
+- Visual bug fixes for UHF adoption for website
 
 ## 4.7.6
 Fri, 01 Sep 2017 16:51:57 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 7eaa7e4307bc6..57dd3d18a72c7 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "4.7.6",
+  "version": "5.0.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
     "@uifabric/example-app-base": ">=4.2.7 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=4.48.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.48.1 <5.0.0",
     "tslib": "^1.7.1"
   }
-}
+}
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 209fa6fc29a99..25c1b75d7b118 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.48.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.48.1 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index b54de42158b32..7fd02d59eba43 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -26,7 +26,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.48.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.48.1 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 7ae26fdbcbdf3..7d9515cdf0120 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -24,7 +24,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=4.48.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.48.1 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/example-app-base/fabric-website-v5.0_2017-09-12-17-22.json b/common/changes/@uifabric/example-app-base/fabric-website-v5.0_2017-09-12-17-22.json
deleted file mode 100644
index 849b54c704779..0000000000000
--- a/common/changes/@uifabric/example-app-base/fabric-website-v5.0_2017-09-12-17-22.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "rubixws@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/fabric-website-v5.0_2017-09-12-17-22.json b/common/changes/@uifabric/experiments/fabric-website-v5.0_2017-09-12-17-22.json
deleted file mode 100644
index 2b4eb4e169fe2..0000000000000
--- a/common/changes/@uifabric/experiments/fabric-website-v5.0_2017-09-12-17-22.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/experiments",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "rubixws@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/layout-group-tweaks_2017-09-12-23-22.json b/common/changes/@uifabric/experiments/layout-group-tweaks_2017-09-12-23-22.json
deleted file mode 100644
index c68347a559066..0000000000000
--- a/common/changes/@uifabric/experiments/layout-group-tweaks_2017-09-12-23-22.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "LayoutGroup: Changed gap to layoutGap and updated docs",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/alt-text-revision_2017-09-01-17-27.json b/common/changes/@uifabric/fabric-website/alt-text-revision_2017-09-01-17-27.json
deleted file mode 100644
index 3c396acc0a971..0000000000000
--- a/common/changes/@uifabric/fabric-website/alt-text-revision_2017-09-01-17-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Revised alt text best practes for ImageComponent.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/emlynam-rm-fabricjs-refs_2017-08-24-18-05.json b/common/changes/@uifabric/fabric-website/emlynam-rm-fabricjs-refs_2017-08-24-18-05.json
deleted file mode 100644
index 4bc0c3e69f3ce..0000000000000
--- a/common/changes/@uifabric/fabric-website/emlynam-rm-fabricjs-refs_2017-08-24-18-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Removed references to FabricJS from the website.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/fabric-website-v5.0_2017-09-12-17-22.json b/common/changes/@uifabric/fabric-website/fabric-website-v5.0_2017-09-12-17-22.json
deleted file mode 100644
index 8f95b05daae17..0000000000000
--- a/common/changes/@uifabric/fabric-website/fabric-website-v5.0_2017-09-12-17-22.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Major site revisions, component updates, removal of dev office header and footer, infrastructure updates and improvements, webpack config updates.",
-      "type": "major"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "rubixws@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/uhf-visual-bugs_2017-09-06-21-49.json b/common/changes/@uifabric/fabric-website/uhf-visual-bugs_2017-09-06-21-49.json
deleted file mode 100644
index f50d0054b517e..0000000000000
--- a/common/changes/@uifabric/fabric-website/uhf-visual-bugs_2017-09-06-21-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Visual bug fixes for UHF adoption for website",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/fabric-website-v5.0_2017-09-12-17-22.json b/common/changes/@uifabric/styling/fabric-website-v5.0_2017-09-12-17-22.json
deleted file mode 100644
index 464a67d8c85a8..0000000000000
--- a/common/changes/@uifabric/styling/fabric-website-v5.0_2017-09-12-17-22.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "rubixws@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/fabric-website-v5.0_2017-09-12-17-22.json b/common/changes/@uifabric/utilities/fabric-website-v5.0_2017-09-12-17-22.json
deleted file mode 100644
index 61730dc2feec6..0000000000000
--- a/common/changes/@uifabric/utilities/fabric-website-v5.0_2017-09-12-17-22.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "rubixws@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/add-persona-label_2017-08-25-18-24.json b/common/changes/office-ui-fabric-react/add-persona-label_2017-08-25-18-24.json
deleted file mode 100644
index 4ebb80707666b..0000000000000
--- a/common/changes/office-ui-fabric-react/add-persona-label_2017-08-25-18-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added label to Persona example components.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/alt-image-text_2017-08-25-19-14.json b/common/changes/office-ui-fabric-react/alt-image-text_2017-08-25-19-14.json
deleted file mode 100644
index beecf262ce840..0000000000000
--- a/common/changes/office-ui-fabric-react/alt-image-text_2017-08-25-19-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added an optional alt text prop for the Image component and example on the website.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/alt-text-revision_2017-09-01-17-27.json b/common/changes/office-ui-fabric-react/alt-text-revision_2017-09-01-17-27.json
deleted file mode 100644
index 043dff563fb88..0000000000000
--- a/common/changes/office-ui-fabric-react/alt-text-revision_2017-09-01-17-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Revised alt text best practices for Image Component in website, removed alt prop.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/dropdown-state_2017-09-05-17-45.json b/common/changes/office-ui-fabric-react/dropdown-state_2017-09-05-17-45.json
deleted file mode 100644
index 39b0f5c3c7c22..0000000000000
--- a/common/changes/office-ui-fabric-react/dropdown-state_2017-09-05-17-45.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Updated dropdown state styles to match the XD specs.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fabric-website-v5.0_2017-09-12-17-22.json b/common/changes/office-ui-fabric-react/fabric-website-v5.0_2017-09-12-17-22.json
deleted file mode 100644
index 55432625cd7c9..0000000000000
--- a/common/changes/office-ui-fabric-react/fabric-website-v5.0_2017-09-12-17-22.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "office-ui-fabric-react",
-      "type": "none"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "rubixws@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/general-component-cleanup_2017-09-07-21-42.json b/common/changes/office-ui-fabric-react/general-component-cleanup_2017-09-07-21-42.json
deleted file mode 100644
index 814a8195bdacd..0000000000000
--- a/common/changes/office-ui-fabric-react/general-component-cleanup_2017-09-07-21-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Cleaned up Default Dialogue to more cleanly represent the default state. Reformated exampleStyles imports to work towards more modularity. Typo and language fixes.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2017-09-18-20-37.json b/common/changes/office-ui-fabric-react/master_2017-09-18-20-37.json
deleted file mode 100644
index 2f884f1dbcc66..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2017-09-18-20-37.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: Fixed logic to support selected options in single select scenario",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/shared-component-styles_2017-08-31-17-18.json b/common/changes/office-ui-fabric-react/shared-component-styles_2017-08-31-17-18.json
deleted file mode 100644
index 68c7b58e2a86e..0000000000000
--- a/common/changes/office-ui-fabric-react/shared-component-styles_2017-08-31-17-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added shared styling to accommodate shared spacing between common elements in example components on the website. Also began to add consistency in the language.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/split-button-container-styles_2017-09-12-21-30.json b/common/changes/office-ui-fabric-react/split-button-container-styles_2017-09-12-21-30.json
deleted file mode 100644
index fd0e38ce1a3b4..0000000000000
--- a/common/changes/office-ui-fabric-react/split-button-container-styles_2017-09-12-21-30.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SplitButton: Properly cascade container styles to the disabled state",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/uhf-visual-bugs_2017-09-06-21-49.json b/common/changes/office-ui-fabric-react/uhf-visual-bugs_2017-09-06-21-49.json
deleted file mode 100644
index 0594c85f192d3..0000000000000
--- a/common/changes/office-ui-fabric-react/uhf-visual-bugs_2017-09-06-21-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Visual bug fixes for UHF adoption for website",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 9b0e9196692d5..d88b48b6e9f38 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "0.9.0",
+      "tag": "@uifabric/experiments_v0.9.0",
+      "date": "Tue, 19 Sep 2017 10:08:55 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "f5ab885321b6b1eb7ecaf8a3470ccd11ae80253e",
+            "comment": "LayoutGroup: Changed gap to layoutGap and updated docs"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.48.0 <5.0.0` to `>=4.48.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.8.0",
       "tag": "@uifabric/experiments_v0.8.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 19a8f966ae5e7..643bde60829e7 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Mon, 18 Sep 2017 10:18:23 GMT and should not be manually modified.
+This log was last generated on Tue, 19 Sep 2017 10:08:55 GMT and should not be manually modified.
+
+## 0.9.0
+Tue, 19 Sep 2017 10:08:55 GMT
+
+### Minor changes
+
+- LayoutGroup: Changed gap to layoutGap and updated docs
 
 ## 0.8.0
 Mon, 18 Sep 2017 10:18:23 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index cae5a81a9afb8..9ef8af120756d 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "0.8.0",
+  "version": "0.9.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,7 +43,7 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/styling": ">=0.24.0 <1.0.0",
     "@uifabric/utilities": ">=4.13.1 <5.0.0",
-    "office-ui-fabric-react": ">=4.48.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.48.1 <5.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 52e6941fc966c..2df14836dd2c1 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,60 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.48.1",
+      "tag": "office-ui-fabric-react_v4.48.1",
+      "date": "Tue, 19 Sep 2017 10:08:55 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "John Miller <rubixws@gmail.com>",
+            "commit": "3bb193abf39423d1e9a6701789b16aad5363ce0c",
+            "comment": "Added label to Persona example components."
+          },
+          {
+            "author": "John Miller <rubixws@gmail.com>",
+            "commit": "284b96aef2e2665bc135b64b63699056e45070c6",
+            "comment": "Added an optional alt text prop for the Image component and example on the website."
+          },
+          {
+            "author": "John Miller <rubixws@gmail.com>",
+            "commit": "5c586f0d68efe83ed9eb7fa95e2f8926c566122d",
+            "comment": "Revised alt text best practices for Image Component in website, removed alt prop."
+          },
+          {
+            "author": "John Miller <rubixws@gmail.com>",
+            "commit": "adc11d66a038207b537d2e65eefebe9c639bdbcb",
+            "comment": "Updated dropdown state styles to match the XD specs."
+          },
+          {
+            "author": "John Miller <rubixws@gmail.com>",
+            "commit": "219d6cb38f1c2af59d5d463ceabe576ecfe682e8",
+            "comment": "Cleaned up Default Dialogue to more cleanly represent the default state. Reformated exampleStyles imports to work towards more modularity. Typo and language fixes."
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "f1a3c0a0653ca6b335077a95f8791ed42c610230",
+            "comment": "Dropdown: Fixed logic to support selected options in single select scenario"
+          },
+          {
+            "author": "John Miller <rubixws@gmail.com>",
+            "commit": "726a015a94fb23c229784649926901665c3d9d8f",
+            "comment": "Added shared styling to accommodate shared spacing between common elements in example components on the website. Also began to add consistency in the language."
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "c6c23967f279d9fad26005800628a2e98f3eb8f9",
+            "comment": "SplitButton: Properly cascade container styles to the disabled state"
+          },
+          {
+            "author": "John Miller <rubixws@gmail.com>",
+            "commit": "055dd03c8ad9d74843f2bc3445d529a3c1fd8cb5",
+            "comment": "Visual bug fixes for UHF adoption for website"
+          }
+        ]
+      }
+    },
     {
       "version": "4.48.0",
       "tag": "office-ui-fabric-react_v4.48.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index d8442d32f7ee6..e33defc77bf17 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,21 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 18 Sep 2017 10:18:23 GMT and should not be manually modified.
+This log was last generated on Tue, 19 Sep 2017 10:08:55 GMT and should not be manually modified.
+
+## 4.48.1
+Tue, 19 Sep 2017 10:08:55 GMT
+
+### Patches
+
+- Added label to Persona example components.
+- Added an optional alt text prop for the Image component and example on the website.
+- Revised alt text best practices for Image Component in website, removed alt prop.
+- Updated dropdown state styles to match the XD specs.
+- Cleaned up Default Dialogue to more cleanly represent the default state. Reformated exampleStyles imports to work towards more modularity. Typo and language fixes.
+- Dropdown: Fixed logic to support selected options in single select scenario
+- Added shared styling to accommodate shared spacing between common elements in example components on the website. Also began to add consistency in the language.
+- SplitButton: Properly cascade container styles to the disabled state
+- Visual bug fixes for UHF adoption for website
 
 ## 4.48.0
 Mon, 18 Sep 2017 10:18:23 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 71847e3794f9d..79f5c44fddae2 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.48.0",
+  "version": "4.48.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 7fadf0b0aa27ce0a245280e7867881cef1add967 Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Tue, 19 Sep 2017 10:38:09 -0700
Subject: [PATCH 0665/1641] Changing high-contrast mode colors to system colors
 (#2589)

* Highcontrast system colors and minor fixes for breadcrumb-dropdown

* High contrast system colors and minor fixes for facepile-tooltip

* Fixing everything becoming invisible when selecting in highcontrast mode.

* rush change

* Changing selected detail list item colors in high-contrast mode

* More HC details list fixes for black-on-white

* Adjusting HC styling of rating.

* Changing to use high-contrast mixin
---
 .../src/components/App/App.scss               | 13 +---
 .../components/DONavigation/DONavigation.scss | 10 +--
 .../DONavigation/DONavigationLink.scss        |  8 +--
 .../components/DOSearchBox/DOSearchBox.scss   |  6 +-
 .../src/components/Header/Header.scss         | 19 ++----
 .../PageHeader/PageHeader.module.scss         | 12 +---
 .../src/pages/HomePage/HomePage.module.scss   |  9 +--
 .../Styles/AnimationsPage/AnimationsPage.scss |  6 +-
 .../Styles/LayoutPage/LayoutPage.module.scss  |  6 +-
 ...ntrast-system-colors_2017-08-23-16-39.json | 11 +++
 ...ntrast-system-colors_2017-08-23-16-39.json | 11 +++
 .../src/common/_common.scss                   |  3 +-
 .../src/common/_highContrast.scss             | 17 +++++
 .../src/components/Calendar/Calendar.scss     |  4 +-
 .../src/components/Callout/Callout.scss       |  7 +-
 .../src/components/Check/Check.scss           | 10 +--
 .../components/ChoiceGroup/ChoiceGroup.scss   | 68 ++++---------------
 .../components/ComboBox/ComboBox.styles.ts    |  8 ++-
 .../src/components/CommandBar/CommandBar.scss | 33 +++------
 .../components/DetailsList/DetailsHeader.scss |  5 ++
 .../components/DetailsList/DetailsRow.scss    | 26 ++++++-
 .../src/components/Dropdown/Dropdown.scss     | 64 +++++------------
 .../HoverCard/ExpandingCard.styles.ts         |  7 +-
 .../src/components/Label/Label.scss           |  4 ++
 .../src/components/Link/Link.scss             |  5 ++
 .../MarqueeSelection/MarqueeSelection.scss    | 12 ++++
 .../src/components/MessageBar/MessageBar.scss |  9 +--
 .../src/components/Modal/Modal.scss           |  2 +-
 .../src/components/Overlay/Overlay.scss       |  4 ++
 .../src/components/Panel/Panel.scss           |  2 +-
 .../src/components/Persona/Persona.scss       | 63 ++++++-----------
 .../src/components/Pivot/Pivot.scss           | 17 ++---
 .../ProgressIndicator/ProgressIndicator.scss  |  8 +--
 .../src/components/Rating/Rating.scss         | 35 ++++++++++
 .../ScrollablePane/ScrollablePane.scss        |  8 +++
 .../src/components/SearchBox/SearchBox.scss   |  7 +-
 .../src/components/Slider/Slider.scss         | 59 ++++------------
 .../src/components/Spinner/Spinner.scss       |  2 +-
 .../src/components/TextField/TextField.scss   | 24 ++-----
 .../PeoplePickerItems/PickerItemsDefault.scss | 22 +++---
 .../pickers/Suggestions/Suggestions.scss      |  8 +--
 .../components/pickers/TagPicker/TagItem.scss |  4 +-
 42 files changed, 288 insertions(+), 370 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/v-krbrow-highcontrast-system-colors_2017-08-23-16-39.json
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-highcontrast-system-colors_2017-08-23-16-39.json
 create mode 100644 packages/office-ui-fabric-react/src/common/_highContrast.scss

diff --git a/apps/fabric-website/src/components/App/App.scss b/apps/fabric-website/src/components/App/App.scss
index 34585fe736497..b9981ffb9b061 100644
--- a/apps/fabric-website/src/components/App/App.scss
+++ b/apps/fabric-website/src/components/App/App.scss
@@ -41,17 +41,10 @@
     transition: all $ms-animation-duration-2 $ms-animation-ease-1;
 
     @include high-contrast {
-      border-right: 1px solid $ms-color-white;
-      border-left: 1px solid $ms-color-white;
-      border-bottom: 1px solid $ms-color-white;
+      border-right: 1px solid WindowText;
+      border-left: 1px solid WindowText;
+      border-bottom: 1px solid WindowText;
     }
-
-    @include high-contrast-black-on-white  {
-      border-right: 1px solid $ms-color-black;
-      border-left: 1px solid $ms-color-black;
-      border-bottom: 1px solid $ms-color-black;
-    }
-
   }
 
   // When the nav is open (smaller screens only) push the content over and prevent app from scrolling
diff --git a/apps/fabric-website/src/components/DONavigation/DONavigation.scss b/apps/fabric-website/src/components/DONavigation/DONavigation.scss
index c2afcfab0bfde..92c94db0a8680 100644
--- a/apps/fabric-website/src/components/DONavigation/DONavigation.scss
+++ b/apps/fabric-website/src/components/DONavigation/DONavigation.scss
@@ -79,11 +79,7 @@ $od-Navigation-columnPadding: 30px;
     }
 
     @include high-contrast {
-      border: 1px solid $ms-color-white;
-    }
-
-    @include high-contrast-black-on-white  {
-      border: 1px solid $ms-color-black;
+      border: 1px solid WindowText;
     }
   }
 
@@ -105,11 +101,11 @@ $od-Navigation-columnPadding: 30px;
       color: $ms-color-white;
 
       @include high-contrast {
-        box-shadow: inset 0px 0px 0px 1px $ms-color-white;
+        box-shadow: inset 0px 0px 0px 1px WindowText;
       }
 
       @include high-contrast-black-on-white  {
-        box-shadow: inset 0px 0px 0px 1px $high-contrast-purpleBG;
+        box-shadow: inset 0px 0px 0px 1px Highlight;
       }
     }
 
diff --git a/apps/fabric-website/src/components/DONavigation/DONavigationLink.scss b/apps/fabric-website/src/components/DONavigation/DONavigationLink.scss
index a076b881aa13d..b4d2078758edd 100644
--- a/apps/fabric-website/src/components/DONavigation/DONavigationLink.scss
+++ b/apps/fabric-website/src/components/DONavigation/DONavigationLink.scss
@@ -22,11 +22,11 @@
       box-shadow: inset 0px 0px 0px 1px $ms-color-white;
 
       @include high-contrast {
-        box-shadow: inset 0px 0px 0px 1px $ms-color-white;
+        box-shadow: inset 0px 0px 0px 1px WindowText;
       }
 
       @include high-contrast-black-on-white  {
-        box-shadow: inset 0px 0px 0px 1px $high-contrast-purpleBG;
+        box-shadow: inset 0px 0px 0px 1px Highlight;
       }
     }
 
@@ -51,10 +51,6 @@
       @include high-contrast {
       transition: none;
       }
-
-      @include high-contrast-black-on-white {
-        transition: none;
-      }
     }
 
     // Responsive changes
diff --git a/apps/fabric-website/src/components/DOSearchBox/DOSearchBox.scss b/apps/fabric-website/src/components/DOSearchBox/DOSearchBox.scss
index d8fd1488884e5..60318d55964d8 100644
--- a/apps/fabric-website/src/components/DOSearchBox/DOSearchBox.scss
+++ b/apps/fabric-website/src/components/DOSearchBox/DOSearchBox.scss
@@ -20,11 +20,7 @@
     }
 
     @include high-contrast {
-      border: 1px solid $ms-color-white;
-    }
-
-    @include high-contrast-black-on-white  {
-      border: 1px solid $ms-color-black;
+      border: 1px solid WindowText;
     }
   }
 
diff --git a/apps/fabric-website/src/components/Header/Header.scss b/apps/fabric-website/src/components/Header/Header.scss
index db1ca99552df4..631cf8b7f48f3 100644
--- a/apps/fabric-website/src/components/Header/Header.scss
+++ b/apps/fabric-website/src/components/Header/Header.scss
@@ -17,12 +17,7 @@
     z-index: 600;
 
     @include high-contrast {
-      border: 1px solid $ms-color-white;
-      border-top: 0;
-    }
-
-    @include high-contrast-black-on-white  {
-      border: 1px solid $ms-color-black;
+      border: 1px solid WindowText;
       border-top: 0;
     }
   }
@@ -72,15 +67,9 @@
     }
 
     @include high-contrast {
-      border: 1px solid $ms-color-white;
+      border: 1px solid WindowText;
       border-top: 0;
     }
-
-    @include high-contrast-black-on-white  {
-      border: 1px solid $ms-color-black;
-      border-top: 0;
-    }
-
   }
 
   .od-Header-hamburgerButton {
@@ -100,11 +89,11 @@
       box-shadow: inset 0px 0px 0px 1px $ms-color-white;
 
       @include high-contrast {
-        box-shadow: inset 0px 0px 0px 1px $ms-color-white;
+        box-shadow: inset 0px 0px 0px 1px WindowText;
       }
 
       @include high-contrast-black-on-white  {
-        box-shadow: inset 0px 0px 0px 1px $high-contrast-purpleBG;
+        box-shadow: inset 0px 0px 0px 1px Highlight;
       }
     }
   }
diff --git a/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss b/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss
index 5249cf43d4272..92bd9bb17fd2c 100644
--- a/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss
+++ b/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss
@@ -13,11 +13,7 @@
   margin-bottom: 2px;
 
   @include high-contrast {
-    border-bottom: 1px solid $ms-color-white;
-  }
-
-  @include high-contrast-black-on-white  {
-    border-bottom: 1px solid $ms-color-black;
+    border-bottom: 1px solid WindowText;
   }
 }
 
@@ -57,11 +53,7 @@
         height: $PageHeader-attachedTitleHeight + $PageHeader-navHeight;
 
         @include high-contrast {
-          @include ms-border-right(1px, solid, $ms-color-white);
-        }
-
-        @include high-contrast-black-on-white  {
-          @include ms-border-right(1px, solid, $ms-color-black);
+          @include ms-border-right(1px, solid, WindowText);
         }
       }
 
diff --git a/apps/fabric-website/src/pages/HomePage/HomePage.module.scss b/apps/fabric-website/src/pages/HomePage/HomePage.module.scss
index a6660d9be914e..4fe833178f50c 100644
--- a/apps/fabric-website/src/pages/HomePage/HomePage.module.scss
+++ b/apps/fabric-website/src/pages/HomePage/HomePage.module.scss
@@ -184,13 +184,8 @@
   font-weight: $ms-font-weight-semilight;
 
   @include high-contrast {
-    border-top: 1px solid $ms-color-white;
-    border-bottom: 1px solid $ms-color-white;
-  }
-
-  @include high-contrast-black-on-white  {
-    border-top: 1px solid $ms-color-black;
-    border-bottom: 1px solid $ms-color-black;
+    border-top: 1px solid WindowText;
+    border-bottom: 1px solid WindowText;
   }
 }
 
diff --git a/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.scss b/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.scss
index 0dbb27ab6523c..f539fdfb1caa0 100644
--- a/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.scss
+++ b/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.scss
@@ -35,11 +35,7 @@
     background-color: $ms-color-themePrimary;
 
     @include high-contrast {
-    background-color: $ms-color-white;
-    }
-
-    @include high-contrast-black-on-white  {
-    background-color: $ms-color-black;
+    background-color: WindowText;
     }
   }
 
diff --git a/apps/fabric-website/src/pages/Styles/LayoutPage/LayoutPage.module.scss b/apps/fabric-website/src/pages/Styles/LayoutPage/LayoutPage.module.scss
index 0bd138e3273b7..c17d9701cccba 100644
--- a/apps/fabric-website/src/pages/Styles/LayoutPage/LayoutPage.module.scss
+++ b/apps/fabric-website/src/pages/Styles/LayoutPage/LayoutPage.module.scss
@@ -12,11 +12,7 @@
 
 .demoBlockCol {
   @include high-contrast {
-    border: 1px solid $ms-color-white;
-  }
-  
-  @include high-contrast-black-on-white {
-      border: 1px solid $ms-color-black;
+    border: 1px solid WindowText;
   }
 }
 
diff --git a/common/changes/@uifabric/fabric-website/v-krbrow-highcontrast-system-colors_2017-08-23-16-39.json b/common/changes/@uifabric/fabric-website/v-krbrow-highcontrast-system-colors_2017-08-23-16-39.json
new file mode 100644
index 0000000000000..dd240ff4678c5
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/v-krbrow-highcontrast-system-colors_2017-08-23-16-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Changing high-contrast colors to system colors",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-highcontrast-system-colors_2017-08-23-16-39.json b/common/changes/office-ui-fabric-react/v-krbrow-highcontrast-system-colors_2017-08-23-16-39.json
new file mode 100644
index 0000000000000..9695b50223125
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-highcontrast-system-colors_2017-08-23-16-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Changing high-contrast colors to system colors",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/common/_common.scss b/packages/office-ui-fabric-react/src/common/_common.scss
index f3d4e84709aab..ec398a744b116 100644
--- a/packages/office-ui-fabric-react/src/common/_common.scss
+++ b/packages/office-ui-fabric-react/src/common/_common.scss
@@ -3,7 +3,8 @@
 @import './themeOverrides';
 @import './focusBorder';
 @import './semanticColorVariables';
+@import './highContrast';
 
 // Screen sizes that align with UHF breakpoints for the website
 $uhf-screen-min-mobile: 768px;
-$uhf-screen-max-mobile: ($uhf-screen-min-mobile - 1);
\ No newline at end of file
+$uhf-screen-max-mobile: ($uhf-screen-min-mobile - 1);
diff --git a/packages/office-ui-fabric-react/src/common/_highContrast.scss b/packages/office-ui-fabric-react/src/common/_highContrast.scss
new file mode 100644
index 0000000000000..833eb712a288e
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/common/_highContrast.scss
@@ -0,0 +1,17 @@
+@mixin high-contrast {
+  @media screen and (-ms-high-contrast: active) {
+    @content;
+  }
+}
+
+@mixin high-contrast-black-on-white {
+  @media screen and (-ms-high-contrast: black-on-white) {
+   @content;
+  }
+}
+
+@mixin high-contrast-white-on-black {
+  @media screen and (-ms-high-contrast: white-on-black) {
+   @content;
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
index 51797c1c5328d..d74c1df2f76cb 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
@@ -126,7 +126,7 @@ $Calendar-dayPicker-margin: 10px;
   position: relative;
   background-color: $ms-color-themeLight;
 
-  @media screen and (-ms-high-contrast: active) {
+  @include high-contrast {
     border: 1px solid WindowText;
   }
 }
@@ -161,7 +161,7 @@ $Calendar-dayPicker-margin: 10px;
 .pickerIsFocused .dayIsHighlighted {
   cursor: pointer;
 
-  @media screen and (-ms-high-contrast: active) {
+  @include high-contrast {
     border: 1px solid Highlight;
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
index edcfdbf22c9d5..8e047db632190 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
@@ -29,11 +29,8 @@ $Callout-smallbeak-slant-width: 16px;
 
   @include focus-clear();
 
-  @media screen and (-ms-high-contrast: active) {
-    border: 1px solid $ms-color-white;
-  }
-  @media screen and (-ms-high-contrast: black-on-white) {
-    border: 1px solid $ms-color-black;
+  @include high-contrast {
+    border: 1px solid WindowText;
   }
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.scss b/packages/office-ui-fabric-react/src/components/Check/Check.scss
index 5882028ec936a..d9f438ba48399 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.scss
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.scss
@@ -51,7 +51,7 @@ $checkBoxHeight: 18px;
 .circle {
   color: $ms-color-neutralTertiaryAlt;
 
-  @media screen and (-ms-high-contrast: active) {
+  @include high-contrast {
     display: none;
   }
 }
@@ -70,8 +70,10 @@ $checkBoxHeight: 18px;
   color: $ms-color-white;
   font-weight: 900;
 
-  @media screen and (-ms-high-contrast: active) {
-    border-radius: 9px;
-    border: 1px solid WindowText;
+  @include high-contrast {
+    border-radius: 10px;
+    border: none;
+    background: Window;
+    color: WindowText;
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
index 23e36feed1b8b..b401b8e86d5d7 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
@@ -126,12 +126,8 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
     &::before { // the circle
       border: 2px solid $radioButton-border-selected-color;
 
-      @media screen and (-ms-high-contrast: active) {
-        border-color: $ms-color-contrastBlackSelected;
-      }
-
-      @media screen and (-ms-high-contrast: black-on-white) {
-        border-color: $ms-color-contrastWhiteSelected;
+      @include high-contrast {
+        border-color: Highlight;
       }
     }
 
@@ -142,12 +138,8 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
       width: 10px;
       height: 10px;
 
-      @media screen and (-ms-high-contrast: active) {
-        border-color: $ms-color-contrastBlackSelected;
-      }
-
-      @media screen and (-ms-high-contrast: black-on-white) {
-        border-color: $ms-color-contrastWhiteSelected;
+      @include high-contrast {
+        border-color: Highlight;
       }
     }
 
@@ -168,24 +160,16 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
       background-color: $radioButton-background-unselected-disabled-color;
       border-color: $radioButton-border-disabled-color;
 
-      @media screen and (-ms-high-contrast: active) {
-        border-color: $ms-color-contrastBlackDisabled;
-      }
-
-      @media screen and (-ms-high-contrast: black-on-white) {
-        border-color: $ms-color-contrastWhiteDisabled;
+      @include high-contrast {
+        border-color: GrayText;
       }
     }
 
     :global(.ms-Label) {
       color: $radioButton-text-disabled-color;
 
-      @media screen and (-ms-high-contrast: active) {
-        color: $ms-color-contrastBlackDisabled;
-      }
-
-      @media screen and (-ms-high-contrast: black-on-white) {
-        color: $ms-color-contrastWhiteDisabled;
+      @include high-contrast {
+        color: GrayText;
       }
     }
   }
@@ -336,38 +320,13 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
     line-height: $iconSize;
     height: $iconSize;
   }
-
-}
-
-
-@mixin highContrast-border($active-color, $bw-color, $size: 2px) {
-  @media screen and (-ms-high-contrast: active) {
-    border: $size solid $active-color;
-  }
-
-  @media screen and (-ms-high-contrast: black-on-white) {
-    border: $size solid $bw-color;
-  }
-}
-
-@mixin highContrast-color($active-color, $bw-color) {
-  @media screen and (-ms-high-contrast: active) {
-    color: $active-color;
-  }
-
-  @media screen and (-ms-high-contrast: black-on-white) {
-    color: $bw-color;
-  }
 }
 
 :global(.ms-Fabric.is-focusVisible) .choiceFieldIsInFocus {
   @include focus-border(1px, $ms-color-neutralPrimary, 1px, false);
 
-  @media screen and (-ms-high-contrast: active) {
-     @include focus-border(1px, $ms-color-white, 2px, false);
-  }
-  @media screen and (-ms-high-contrast: black-on-white) {
-    @include focus-border(1px, $ms-color-black, 2px, false);
+  @include high-contrast {
+     @include focus-border(1px, WindowText, 2px, false);
   }
 }
 
@@ -375,11 +334,8 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
   &.choiceFieldIsImage, &.choiceFieldIsIcon {
     @include focus-border(0, $ms-color-neutralPrimary, 1px, false);
 
-    @media screen and (-ms-high-contrast: active) {
-      @include focus-border(1px, $ms-color-white, 2px, false);
-    }
-    @media screen and (-ms-high-contrast: black-on-white) {
-      @include focus-border(1px, $ms-color-black, 3px, false);
+    @include high-contrast {
+      @include focus-border(1px, WindowText, 2px, false);
     }
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index 2e5682c3133cf..92243c0c25c35 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -40,6 +40,7 @@ const getListOptionHighContrastStyles = memoizeFunction((theme: ITheme): IStyle
       backgroundColor: 'Highlight',
       borderColor: 'Highlight',
       color: 'HighlightText',
+      '-ms-high-contrast-adjust': 'none'
     },
   };
 });
@@ -164,6 +165,7 @@ export const getCaretDownButtonStyles = memoizeFunction((
         backgroundColor: 'ButtonFace',
         borderColor: 'ButtonText',
         color: 'ButtonText',
+        '-ms-high-contrast-adjust': 'none'
       }
     },
     rootHovered: {
@@ -242,14 +244,16 @@ export const getStyles = memoizeFunction((
       borderColor: ComboBoxRootBorderColorHovered,
       [MS_HIGHCONTRAST_ACTIVE]: {
         color: 'HighlightText',
-        borderColor: 'Highlight'
+        borderColor: 'Highlight',
+        '-ms-high-contrast-adjust': 'none'
       },
     },
     rootFocused: {
       borderColor: ComboBoxRootBorderColorHovered,
       [MS_HIGHCONTRAST_ACTIVE]: {
         color: 'HighlightText',
-        borderColor: 'Highlight'
+        borderColor: 'Highlight',
+        '-ms-high-contrast-adjust': 'none'
       },
     },
     rootDisabled: getDisabledStyles(theme),
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss
index 84d0af8002b9e..962e02d0cdac5 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss
@@ -120,12 +120,8 @@ $SearchBox-sidePadding: 8px; // padding in input on left and right sides without
   cursor: pointer;
   &:hover,
   &.itemLinkIsExpanded {
-    @media screen and (-ms-high-contrast: active) {
-      @include focus-border(0px, $ms-color-white, 1px, false);
-      }
-
-    @media screen and (-ms-high-contrast: black-on-white) {
-      @include focus-border(0px, $ms-color-black, 1px, false);
+    @include high-contrast {
+      @include focus-border(0px, WindowText, 1px, false);
     }
   }
 
@@ -210,15 +206,11 @@ $SearchBox-sidePadding: 8px; // padding in input on left and right sides without
   border-color: transparent; // give a base state for animation
   @include border-right(1px, solid, $ms-color-neutralLight);
 
-  @media screen and (-ms-high-contrast: active) {
-    @include border-right(1px, solid, $ms-color-white);
+  @include high-contrast {
+    @include border-right(1px, solid, WindowText);
     z-index: 10;
   }
 
-  @media screen and (-ms-high-contrast: black-on-white) {
-    @include border-right(1px, solid, $ms-color-black);
-  }
-
   &:before {
     position: absolute;
     content: ' ';
@@ -232,12 +224,8 @@ $SearchBox-sidePadding: 8px; // padding in input on left and right sides without
   &:hover {
     color: $ms-color-themePrimary;
 
-    @media screen and (-ms-high-contrast: active) {
-      @include focus-border(0px, $ms-color-white, 1px, false);
-    }
-
-    @media screen and (-ms-high-contrast: black-on-white) {
-      @include focus-border(0px, $ms-color-black, 1px, false);
+    @include high-contrast {
+      @include focus-border(0px, WindowText, 1px, false);
     }
   }
 }
@@ -255,12 +243,8 @@ $SearchBox-sidePadding: 8px; // padding in input on left and right sides without
   cursor: pointer;
   font-size: $ms-font-size-m;
 
-  @media screen and (-ms-high-contrast: active) {
-    @include border-left($SearchBox-height, solid, $ms-color-black);
-  }
-
-  @media screen and (-ms-high-contrast: black-on-white) {
-    @include border-left($SearchBox-height, solid, $ms-color-white);
+  @include high-contrast {
+    @include border-left($SearchBox-height, solid, Window);
   }
 
   // remove default iOS styles on input boxes
@@ -302,6 +286,7 @@ $SearchBox-sidePadding: 8px; // padding in input on left and right sides without
   cursor: pointer;
   position: absolute;
   text-align: center;
+  -ms-high-contrast-adjust: none;
 }
 
 // New rules
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
index 9fe5588c7f179..0cd22a6c82358 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
@@ -181,6 +181,11 @@ $isPaddedMargin: 24px;
   bottom: 0;
   cursor: ew-resize;
   background: rgba(255, 255, 255, 0);
+
+  @include high-contrast {
+    background: transparent;
+    -ms-high-contrast-adjust: none;
+  }
 }
 
 .cell .collapseButton {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
index 60a8573dc29bb..22f44bd1d8b8b 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
@@ -97,10 +97,16 @@ $detailsList-item-focus-meta-text-color: $ms-color-neutralDark;
     // Selected State Header cell
     &.isRowHeader {
       color: $detailsList-item-selected-text-color;
+
+      @include high-contrast {
+        color: HighlightText;
+      }
     }
 
-    @media screen and (-ms-high-contrast: active) {
-      color: Highlight;
+    @include high-contrast {
+      background: Highlight;
+      color: HighlightText;
+      -ms-high-contrast-adjust: none;
     }
   }
 
@@ -124,9 +130,17 @@ $detailsList-item-focus-meta-text-color: $ms-color-neutralDark;
     .cell {
       color: $detailsList-item-selected-hover-meta-text-color;
 
+      @include high-contrast {
+        color: HighlightText;
+      }
+
       // Selected State hover Header cell
       &.isRowHeader {
         color: $detailsList-item-selected-hover-text-color;
+
+        @include high-contrast {
+          color: HighlightText;
+        }
       }
     }
   }
@@ -139,9 +153,17 @@ $detailsList-item-focus-meta-text-color: $ms-color-neutralDark;
     .cell {
       color: $detailsList-item-focus-meta-text-color;
 
+      @include high-contrast {
+        color: HighlightText;
+      }
+
       // Row header cell
       &.isRowHeader {
         color: $detailsList-item-focus-header-text-color;
+
+        @include high-contrast {
+          color: HighlightText;
+        }
       }
     }
   }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
index f3b5cf92abccd..1fbe031b8671d 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
@@ -14,20 +14,10 @@ $DropDown-item-height: 32px;
 
 // Mixin for high contrast mode link states
 @mixin highContrastListItemState {
-  @media screen and (-ms-high-contrast: active) {
-    background-color: $ms-color-contrastBlackSelected;
-    border-color: $ms-color-contrastBlackSelected;
-    color: $ms-color-black;
-
-    &:focus {
-      border-color: $ms-color-black;
-    }
-  }
-
-  @media screen and (-ms-high-contrast: black-on-white) {
-    background-color: $ms-color-contrastWhiteSelected;
-    border-color: $ms-color-contrastWhiteSelected;
-    color: $ms-color-white;
+  @include high-contrast {
+    background-color: Highlight;
+    border-color: Highlight;
+    color: HighlightText;
   }
 
   @include highContrastAdjust();
@@ -49,6 +39,11 @@ $DropDown-item-height: 32px;
     .title,
     .caretDown {
       color: $ms-color-black;
+
+      @include high-contrast {
+        // Using Highlight for text here specifically to match the border color that indicates focus on dropdown root elements.
+        color: Highlight;
+      }
     }
 
     .titleIsPlaceHolder {
@@ -56,21 +51,6 @@ $DropDown-item-height: 32px;
     }
   }
 
-  &:hover,
-  &:active,
-  &:focus {
-    .title,
-    .caretDown {
-      @media screen and (-ms-high-contrast: active) {
-        border-color: $ms-color-contrastBlackSelected;
-      }
-
-      @media screen and (-ms-high-contrast: black-on-white) {
-        border-color: $ms-color-contrastWhiteSelected;
-      }
-    }
-  }
-
   &:hover {
     .title {
       border-color: $ms-color-neutralDark;
@@ -103,15 +83,11 @@ $DropDown-item-height: 32px;
     color: $ms-color-neutralTertiary;
     cursor: default;
 
-    @media screen and (-ms-high-contrast: active) {
-      border-color: $ms-color-contrastBlackDisabled;
-      color: $ms-color-contrastBlackDisabled;
+    @include high-contrast {
+      border-color: GrayText;
+      color: GrayText;
     }
 
-    @media screen and (-ms-high-contrast: black-on-white) {
-      border-color: $ms-color-contrastWhiteDisabled;
-      color: $ms-color-contrastWhiteDisabled;
-    }
     &.titleIsError {
         border-color: $ms-color-error;
     }
@@ -120,12 +96,8 @@ $DropDown-item-height: 32px;
   .caretDown {
     color: $ms-color-neutralTertiary;
 
-    @media screen and (-ms-high-contrast: active) {
-      color: $ms-color-contrastBlackDisabled;
-    }
-
-    @media screen and (-ms-high-contrast: black-on-white) {
-      color: $ms-color-contrastWhiteDisabled;
+    @include high-contrast {
+      color: GrayText;
     }
   }
 }
@@ -207,12 +179,8 @@ $DropDown-item-height: 32px;
   overflow-wrap: break-word;
   text-align: left;
 
-  @media screen and (-ms-high-contrast: active) {
-    border-color: $ms-color-black;
-  }
-
-  @media screen and (-ms-high-contrast: black-on-white) {
-    border-color: $ms-color-white;
+  @include high-contrast {
+    border-color: Window;
   }
 
   &:hover {
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
index 68136c9b059ca..838f51dba9198 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
@@ -6,6 +6,8 @@ import {
   ITheme
 } from '../../Styling';
 
+const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
+
 export const getStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: IExpandingCardStyles
@@ -17,7 +19,10 @@ export const getStyles = memoizeFunction((
       'pointer-events': 'none',
       '.ms-Callout': {
         'box-shadow': '0 0 20px rgba(0, 0, 0, .2)',
-        border: 'none'
+        border: 'none',
+        [MS_HIGHCONTRAST_ACTIVE]: {
+          border: '1px solid WindowText',
+        }
       }
     },
     compactCard: {
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.scss b/packages/office-ui-fabric-react/src/components/Label/Label.scss
index 1439a0861f9b9..ca61206dc19d9 100644
--- a/packages/office-ui-fabric-react/src/components/Label/Label.scss
+++ b/packages/office-ui-fabric-react/src/components/Label/Label.scss
@@ -26,4 +26,8 @@
 
 .isDisabled {
   @include ms-Label-is-disabled;
+
+  @include high-contrast {
+    color: GrayText;
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.scss b/packages/office-ui-fabric-react/src/components/Link/Link.scss
index cb666cb3acfe3..48c950f938686 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.scss
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.scss
@@ -38,6 +38,11 @@ button.root {
   cursor: pointer;
   display: inline;
   font-size: inherit; // Ensure that we inherit font size, rather than the browser's default.
+
+  @include high-contrast {
+    // Using Highlight here so we still have a themeable system color that is different from both window text and link text.
+    color: Highlight;
+  }
 }
 
 // Link implemented as an anchor.
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.scss b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.scss
index 515dad1022c3e..07464faacbbea 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.scss
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.scss
@@ -12,6 +12,10 @@
   top: 0;
   right: 0;
   bottom: 0;
+
+  @include high-contrast {
+    background: none;
+  }
 }
 
 .box {
@@ -20,6 +24,10 @@
   border: 1px solid $ms-color-themePrimary;
   pointer-events: none;
   z-index: $ms-zIndex-front;
+
+  @include high-contrast {
+    border-color: Highlight;
+  }
 }
 
 .boxFill {
@@ -31,4 +39,8 @@
   top: 0;
   right: 0;
   bottom: 0;
+
+  @include high-contrast {
+    background: none;
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
index d3f76cc7bdc79..d8da2d1699524 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
@@ -122,13 +122,8 @@
     left: 0;
     top: 0;
     margin: 0;
-    @media screen and (-ms-high-contrast: active) {
-        border: 1px solid $ms-color-white;
-        content: ' ';
-    }
-
-    @media screen and (-ms-high-contrast: black-on-white) {
-        border: 1px solid $ms-color-black;
+    @include high-contrast {
+        border: 1px solid WindowText;
         content: ' ';
     }
   }
diff --git a/packages/office-ui-fabric-react/src/components/Modal/Modal.scss b/packages/office-ui-fabric-react/src/components/Modal/Modal.scss
index 6dea7dd629d85..c9c2874c8c6f3 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/Modal.scss
+++ b/packages/office-ui-fabric-react/src/components/Modal/Modal.scss
@@ -27,7 +27,7 @@
   }
 
   :global(.ms-Overlay) {
-    @media screen and (-ms-high-contrast: active) {
+    @include high-contrast {
       opacity: 0;
     }
   }
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.scss b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.scss
index 25b9b60049dac..19c709336ac24 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.scss
+++ b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.scss
@@ -26,4 +26,8 @@
   &.rootIsDark {
     background-color: $ms-color-blackTranslucent40;
   }
+
+  @include high-contrast {
+    border: 1px solid WindowText;
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.scss b/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
index 87d35b9dbd045..89045637148ba 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
@@ -178,7 +178,7 @@ $CommandBarHeight: 44px;
     cursor: pointer;
     pointer-events: auto;
 
-    @media screen and (-ms-high-contrast: active) {
+    @include high-contrast {
       opacity: 0;
     }
   }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
index 3a33d209fa869..f185ac6c272fb 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
@@ -94,12 +94,8 @@ $ms-Persona-presenceSizeXl: 28px;
   width: $ms-Persona-sizeMd;
   border-radius: 50%;
 
-  @media screen and (-ms-high-contrast: active) {
-    border: 1px solid $ms-color-white;
-  }
-
-  @media screen and (-ms-high-contrast: black-on-white) {
-    border: 1px solid $ms-color-black;
+  @include high-contrast {
+    border: 1px solid WindowText;
   }
 
   .image {
@@ -205,16 +201,10 @@ $ms-Persona-presenceSizeXl: 28px;
   -ms-high-contrast-adjust: none;
   // This is a temporary local fix and should be removed once Fabric Core 6.0 is released.
 
-  @media screen and (-ms-high-contrast: active) {
-    border-color: $ms-color-black;
-    color: $ms-color-black;
-    background-color: $ms-color-white;
-  }
-
-  @media screen and (-ms-high-contrast: black-on-white) {
-    border-color: $ms-color-white;
-    color: $ms-color-white;
-    background-color: $ms-color-black;
+  @include high-contrast {
+    border-color: Window;
+    color: Window;
+    background-color: WindowText;
   }
 
   .presenceIcon {
@@ -223,12 +213,8 @@ $ms-Persona-presenceSizeXl: 28px;
     line-height: $ms-Persona-presenceSizeMd;
     vertical-align: top;
 
-    @media screen and (-ms-high-contrast: active) {
-      color: $ms-color-black;
-    }
-
-    @media screen and (-ms-high-contrast: black-on-white) {
-      color: $ms-color-white;
+    @include high-contrast {
+      color: Window;
     }
   }
 }
@@ -291,13 +277,9 @@ $ms-Persona-presenceSizeXl: 28px;
     @include ms-left(0);
     border: 0;
 
-    @media screen and (-ms-high-contrast: active) {
+    @include high-contrast {
       top: 9px;
-      border: 1px solid $ms-color-white;
-    }
-
-    @media screen and (-ms-high-contrast: black-on-white) {
-      border: 1px solid $ms-color-black;
+      border: 1px solid WindowText;
     }
   }
 
@@ -731,8 +713,8 @@ $ms-Persona-presenceSizeXl: 28px;
   .presence {
     background-color: $ms-color-presence-available;
 
-    @media screen and (-ms-high-contrast: active) {
-      background-color: $ms-color-white;
+    @include high-contrast {
+      background-color: WindowText;
     }
 
     @media screen and (-ms-high-contrast: black-on-white) {
@@ -748,12 +730,8 @@ $ms-Persona-presenceSizeXl: 28px;
   .presence {
     background-color: $ms-color-presence-away;
 
-    @media screen and (-ms-high-contrast: active) {
-      background-color: $ms-color-white;
-    }
-
-    @media screen and (-ms-high-contrast: black-on-white) {
-      background-color: $ms-color-black;
+    @include high-contrast {
+      background-color: WindowText;
     }
   }
 
@@ -793,11 +771,9 @@ $ms-Persona-presenceSizeXl: 28px;
       @include ms-left(0);
     }
 
-
-
-    @media screen and (-ms-high-contrast: active) {
+    @include high-contrast {
       color: $ms-color-contrastBlackDisabled;
-      background-color: $ms-color-black;
+      background-color: Window;
 
       &::before {
         box-shadow: 0 0 0 2px $ms-color-contrastBlackDisabled inset;
@@ -810,7 +786,6 @@ $ms-Persona-presenceSizeXl: 28px;
 
     @media screen and (-ms-high-contrast: black-on-white) {
       color: $ms-color-contrastWhiteDisabled;
-      background-color: $ms-color-white;
 
       &::before {
         box-shadow: 0 0 0 2px $ms-color-contrastWhiteDisabled inset;
@@ -846,7 +821,7 @@ $ms-Persona-presenceSizeXl: 28px;
   .presence {
     background-color: $ms-color-presence-busy-average;
 
-    @media screen and (-ms-high-contrast: active) {
+    @include high-contrast {
       background-color: $ms-color-contrastBlackDisabled;
     }
 
@@ -863,7 +838,7 @@ $ms-Persona-presenceSizeXl: 28px;
   .presence {
     background-color: $ms-color-presence-dnd-background;
 
-    @media screen and (-ms-high-contrast: active) {
+    @include high-contrast {
       color: $ms-color-black;
       background-color: $ms-color-contrastBlackDisabled;
 
@@ -889,7 +864,7 @@ $ms-Persona-presenceSizeXl: 28px;
   .presence {
     background-color: $ms-color-presence-offline;
 
-    @media screen and (-ms-high-contrast: active) {
+    @include high-contrast {
       background-color: $ms-color-contrastBlackDisabled;
       box-shadow: 0 0 0 1px $ms-color-white inset;
     }
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.scss b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.scss
index 77ab0e0124b05..32794504855ad 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.scss
+++ b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.scss
@@ -95,12 +95,8 @@
       box-sizing: border-box;
       border-bottom: 2px solid $ms-color-themePrimary;
 
-      @media screen and (-ms-high-contrast: active) {
-        border-bottom-color: $ms-color-white;
-      }
-
-      @media screen and (-ms-high-contrast: black-on-white) {
-        border-bottom-color: $ms-color-black;
+      @include high-contrast {
+        border-bottom-color: WindowText;
       }
     }
   }
@@ -197,11 +193,8 @@
         content: '';
         height: auto;
 
-        @media screen and (-ms-high-contrast: active) {
-          border: 1px solid $ms-color-white;
-        }
-        @media screen and (-ms-high-contrast: black-on-white) {
-          border: 1px solid $ms-color-black;
+        @include high-contrast {
+          border: 1px solid WindowText;
         }
       }
     }
@@ -242,7 +235,7 @@
 // }
 
 // All high contrast styling rules
-@media screen and (-ms-high-contrast: active) {
+@include high-contrast {
   .root.rootIsTabs {
     .link {
       &.linkIsSelected {
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
index 7295c88314a6e..8b26b66c7e0a6 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
@@ -53,12 +53,8 @@ $ProgressIndicatorTextHeight: 18px;
   transition: width .3s ease;
   width: 0;
 
-  @media screen and (-ms-high-contrast: active) {
-    background-color: $ms-color-white;
-  }
-
-  @media screen and (-ms-high-contrast: black-on-white) {
-    background-color: $ms-color-black;
+  @include high-contrast {
+    background-color: WindowText;
   }
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.scss b/packages/office-ui-fabric-react/src/components/Rating/Rating.scss
index 2c220e06ace4c..6404a1304a267 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.scss
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.scss
@@ -23,12 +23,27 @@ $Rating-largeIconSize: 20px;
     .star:not(.starIsDisabled) {
       color: $Rating-selectedColor;
 
+      @include high-contrast {
+        color: HighlightText;
+        background-color: Highlight;
+        -ms-high-contrast-adjust: none;
+      }
+
       &.star:hover {
         color: $Rating-hoverColor;
 
+        @include high-contrast {
+          color: HighlightText;
+        }
+
         & ~ .star {
           // Set default color for any star after hovered one
           color: $Rating-defaultColor;
+
+          @include high-contrast {
+            color: GrayText;
+            background-color: Window;
+          }
         }
       }
     }
@@ -41,13 +56,29 @@ $Rating-largeIconSize: 20px;
 
     color: $Rating-defaultColor;
 
+    @include high-contrast {
+      color: WindowText;
+      -ms-high-contrast-adjust: none;
+    }
+
     &.starIsSelected {
       color: $Rating-selectedColor;
+
+      @include high-contrast {
+        color: HighlightText;
+        background-color: Highlight;
+        -ms-high-contrast-adjust: none;
+      }
     }
 
     &.starIsDisabled {
       color: $Rating-disabledColor;
 
+      @include high-contrast {
+        color: GrayText;
+        background-color: Window;
+      }
+
       .label {
         cursor: default;
       }
@@ -62,6 +93,10 @@ $Rating-largeIconSize: 20px;
 
       // Reserve space for focus styling
       border: 1px solid transparent;
+
+      @include high-contrast {
+        border-color: Window;
+      }
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.scss b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.scss
index 603fce30cc860..43cc1c7576648 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.scss
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.scss
@@ -23,8 +23,16 @@
 
 .stickyAbove {
   top: 0;
+
+  @include high-contrast {
+    border-bottom: 1px solid WindowText;
+  }
 }
 
 .stickyBelow {
   bottom: 0;
+
+  @include high-contrast {
+    border-top: 1px solid WindowText;
+  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
index 0b60f8064070f..bcbf4c78dd130 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
@@ -19,11 +19,8 @@
   @include padding(0, 0, 0, 8px);
   border: 1px solid $ms-color-neutralTertiary;
   height: 32px;
-  @media screen and (-ms-high-contrast: active) {
-    border: 1px solid $ms-color-white;
-  }
-  @media screen and (-ms-high-contrast: black-on-white) {
-    border: 1px solid $ms-color-black;
+  @include high-contrast {
+    border: 1px solid WindowText;
   }
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.scss b/packages/office-ui-fabric-react/src/components/Slider/Slider.scss
index 3f400ed7d7a69..39a3a55dff091 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.scss
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.scss
@@ -116,24 +116,16 @@
 .activeSection {
   background: $ms-color-neutralSecondary;
 
-  @media screen and (-ms-high-contrast: active) {
-    background-color: $ms-color-white;
-  }
-
-  @media screen and (-ms-high-contrast: black-on-white) {
-    background-color: $ms-color-black;
+  @include high-contrast {
+    background-color: WindowText;
   }
 }
 
 .inactiveSection {
   background: $ms-color-neutralTertiaryAlt;
 
-  @media screen and (-ms-high-contrast: active) {
-    border: 1px solid $ms-color-white;
-  }
-
-  @media screen and (-ms-high-contrast: black-on-white) {
-    border: 1px solid $ms-color-black;
+  @include high-contrast {
+    border: 1px solid WindowText;
   }
 }
 
@@ -156,36 +148,24 @@
     .thumb {
       border: 2px solid $ms-color-themePrimary;
 
-      @media screen and (-ms-high-contrast: active) {
-        border-color: $ms-color-contrastBlackSelected;
-      }
-
-      @media screen and (-ms-high-contrast: black-on-white) {
-        border-color: $ms-color-contrastWhiteSelected;
+      @include high-contrast {
+        border-color: Highlight;
       }
     }
 
     .activeSection {
       background-color: $ms-color-themePrimary;
 
-      @media screen and (-ms-high-contrast: active) {
-        background-color: $ms-color-contrastBlackSelected;
-      }
-
-      @media screen and (-ms-high-contrast: black-on-white) {
-        background-color: $ms-color-contrastWhiteSelected;
+      @include high-contrast {
+        background-color: Highlight;
       }
     }
 
     .inactiveSection {
       background-color: $ms-color-themeLight;
 
-      @media screen and (-ms-high-contrast: active) {
-        border-color: $ms-color-contrastBlackSelected;
-      }
-
-      @media screen and (-ms-high-contrast: black-on-white) {
-        border-color: $ms-color-contrastWhiteSelected;
+      @include high-contrast {
+        border-color: Highlight;
       }
     }
   }
@@ -204,25 +184,16 @@
   .thumb {
     border-color: $ms-color-neutralTertiaryAlt;
 
-    @media screen and (-ms-high-contrast: active) {
-      border-color: $ms-color-contrastBlackDisabled;
-    }
-
-    @media screen and (-ms-high-contrast: black-on-white) {
-      border-color: $ms-color-contrastWhiteDisabled;
+    @include high-contrast {
+      border-color: GrayText;
     }
   }
 
   .activeSection,
   .inactiveSection {
-    @media screen and (-ms-high-contrast: active) {
-      background-color: $ms-color-contrastBlackDisabled;
-      border-color: $ms-color-contrastBlackDisabled;
-    }
-
-    @media screen and (-ms-high-contrast: black-on-white) {
-      background-color: $ms-color-contrastWhiteDisabled;
-      border-color: $ms-color-contrastWhiteDisabled;
+    @include high-contrast {
+      background-color: GrayText;
+      border-color: GrayText;
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss
index fa7a26b274288..de35c90a91761 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss
+++ b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss
@@ -59,7 +59,7 @@ $borderSize: 1.5px;
   }
 }
 
-@media screen and (-ms-high-contrast: active) {
+@include high-contrast {
   .root {
     > .circle {
         border-top-style: none;
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index 01131c7b381d9..2fe80f856de68 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -66,12 +66,8 @@ $field-error-color: $errorTextColor;
 
   &:hover,
   &.fieldGroupIsFocused {
-    @media screen and (-ms-high-contrast: active) {
-      border-color: $ms-color-contrastBlackSelected;
-    }
-
-    @media screen and (-ms-high-contrast: black-on-white) {
-      border-color: $ms-color-contrastWhiteSelected;
+    @include high-contrast {
+      border-color: Highlight;
     }
   }
 
@@ -175,12 +171,8 @@ $field-error-color: $errorTextColor;
   &:hover:not(.rootIsDisabled) {
     border-color: $field-border-hover-color;
 
-    @media screen and (-ms-high-contrast: active) {
-      border-color: $ms-color-contrastBlackSelected;
-    }
-
-    @media screen and (-ms-high-contrast: black-on-white) {
-      border-color: $ms-color-contrastWhiteSelected;
+    @include high-contrast {
+      border-color: Highlight;
     }
   }
 
@@ -221,12 +213,8 @@ $field-error-color: $errorTextColor;
   &.rootIsActive {
     border-color: $field-border-focus-color;
 
-    @media screen and (-ms-high-contrast: active) {
-      border-color: $ms-color-contrastBlackSelected;
-    }
-
-    @media screen and (-ms-high-contrast: black-on-white) {
-      border-color: $ms-color-contrastWhiteSelected;
+    @include high-contrast {
+      border-color: Highlight;
     }
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
index c1aad4738c3c4..f14f2bb7b8c13 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
@@ -26,11 +26,19 @@
     // Setting global values here to override persona's normal behavior specifically in this selected variation
     :global(.ms-Persona-primaryText) {
       color: $ms-color-white;
+
+      @include high-contrast {
+        color: HighlightText;
+      }
     }
 
     .removeButton {
       :global(.ms-Button-icon) {
         color: $ms-color-white;
+
+        @include high-contrast {
+          color: HighlightText;
+        }
       }
 
       &:hover {
@@ -39,8 +47,10 @@
       }
     }
 
-    @media screen and (-ms-high-contrast: active) {
-      border: 1px solid $ms-color-themePrimary;
+    @include high-contrast {
+      border-color: Highlight;
+      background: Highlight;
+      -ms-high-contrast-adjust: none;
     }
   }
 
@@ -69,12 +79,8 @@
     }
   }
 
-  @media screen and (-ms-high-contrast: active) {
-    border: 1px solid $ms-color-white;
-  }
-
-  @media screen and (-ms-high-contrast: black-on-white) {
-    border: 1px solid $ms-color-black;
+  @include high-contrast {
+    border: 1px solid WindowText;
   }
 
   .itemContent {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
index 5be836ef3e4ae..82d9e4fda8cd0 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
@@ -26,12 +26,8 @@
       background: $ms-color-neutralTertiaryAlt;
     }
 
-    @media screen and (-ms-high-contrast: active) {
-      border: 1px solid $ms-color-white;
-    }
-
-    @media screen and (-ms-high-contrast: black-on-white) {
-      border: 1px solid $ms-color-black;
+    @include high-contrast {
+      border: 1px solid WindowText;
     }
 
     .closeButton {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.scss b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.scss
index affc79b0c84fb..b3537a46c4252 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.scss
@@ -20,7 +20,7 @@
   &.isSelected {
     background: $ms-color-neutralQuaternary;
 
-    @media screen and (-ms-high-contrast: active) {
+    @include high-contrast {
       border: 1px solid WindowFrame;
     }
 
@@ -29,7 +29,7 @@
     }
   }
 
-  @media screen and (-ms-high-contrast: active) {
+  @include high-contrast {
     border: 1px solid WindowText;
   }
 }

From 2ff3cc2d838c9c21ffe47808121bf0062e62c762 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 19 Sep 2017 10:56:20 -0700
Subject: [PATCH 0666/1641] Searchbox: added onEscape, onClearClick props
 (#2730)

* Added onEscape prop to searchbox

* Change file

* Change console log back to ev

* Add onClearClick as prop to fix other issue

* Added IEventHandler

* Added a check for defaultPrevented

* Fixed linting errors

* Fixed 'any' on the onClear function
---
 .../searchbox-onEscape_2017-09-05-16-37.json  | 11 +++++++
 .../components/SearchBox/SearchBox.Props.ts   | 10 +++++++
 .../src/components/SearchBox/SearchBox.tsx    | 30 ++++++++++++-------
 .../examples/SearchBox.Small.Example.tsx      |  6 ++++
 4 files changed, 46 insertions(+), 11 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/searchbox-onEscape_2017-09-05-16-37.json

diff --git a/common/changes/office-ui-fabric-react/searchbox-onEscape_2017-09-05-16-37.json b/common/changes/office-ui-fabric-react/searchbox-onEscape_2017-09-05-16-37.json
new file mode 100644
index 0000000000000..e43ef14e193c5
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/searchbox-onEscape_2017-09-05-16-37.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SearchBox: Added onEscape prop",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "micahgodbolt@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts
index 23b13ab39c5d0..2e2d802631e82 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts
@@ -30,6 +30,16 @@ export interface ISearchBoxProps extends React.InputHTMLAttributes<HTMLInputElem
    */
   onSearch?: (newValue: any) => void;
 
+  /**
+   * Callback executed when the user clears the search box by either clicking 'X' or hitting escape.
+   */
+  onClear?: (ev?: any) => void;
+
+  /**
+   * Callback executed when the user presses escape in the search box.
+   */
+  onEscape?: (ev?: any) => void;
+
   /**
    * Deprecated at v0.52.2, use 'onChange' instead.
    * @deprecated
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
index a7f27e1c7c6a8..4b4af9192d420 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
@@ -78,7 +78,7 @@ export class SearchBox extends BaseComponent<ISearchBoxProps, ISearchBoxState> {
         />
         <div
           className={ css('ms-SearchBox-clearButton', styles.clearButton) }
-          onClick={ this._onClearClick }
+          onClick={ this._onClear }
         >
           <Icon iconName='Clear' />
         </div>
@@ -96,16 +96,20 @@ export class SearchBox extends BaseComponent<ISearchBoxProps, ISearchBoxState> {
   }
 
   @autobind
-  private _onClearClick(ev?: any) {
-    this._latestValue = '';
-    this.setState({
-      value: ''
-    });
-    this._callOnChange('');
-    ev.stopPropagation();
-    ev.preventDefault();
+  private _onClear(ev: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) {
+    this.props.onClear && this.props.onClear(ev);
+    if (!ev.defaultPrevented) {
+      this._latestValue = '';
+      this.setState({
+        value: ''
+      });
+      this._callOnChange('');
+      ev.stopPropagation();
+      ev.preventDefault();
+
+      this._inputElement.focus();
+    }
 
-    this._inputElement.focus();
   }
 
   @autobind
@@ -123,10 +127,14 @@ export class SearchBox extends BaseComponent<ISearchBoxProps, ISearchBoxState> {
 
   @autobind
   private _onKeyDown(ev: React.KeyboardEvent<HTMLInputElement>) {
+
     switch (ev.which) {
 
       case KeyCodes.escape:
-        this._onClearClick(ev);
+        this.props.onEscape && this.props.onEscape(ev);
+        if (!ev.defaultPrevented) {
+          this._onClear(ev);
+        }
         break;
 
       case KeyCodes.enter:
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Small.Example.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Small.Example.tsx
index 0d5997cb77369..1a0b292fec23c 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Small.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Small.Example.tsx
@@ -9,6 +9,12 @@ export class SearchBoxSmallExample extends React.Component<any, any> {
     return (
       <div className='ms-SearchBoxSmallExample'>
         <SearchBox
+          onEscape={ (ev) => {
+            console.log('Custom onEscape Called');
+          } }
+          onClear={ (ev) => {
+            console.log('Custom onClear Called');
+          } }
           onChange={ (newValue) => console.log('SearchBox onChange fired: ' + newValue) }
           onSearch={ (newValue) => console.log('SearchBox onSearch fired: ' + newValue) }
           onFocus={ () => console.log('onFocus called') }

From d760d81856ba4acf60b52eadc299dfa8210bc1f2 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 19 Sep 2017 12:54:29 -0700
Subject: [PATCH 0667/1641] Modal: Updated padding in example to fix RTL
 support (#2884)

* Modal, fix RTL example

* add change file
---
 .../modal-docs_2017-09-19-18-46.json                  | 11 +++++++++++
 .../Modal/examples/Modal.Basic.Example.scss           |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/modal-docs_2017-09-19-18-46.json

diff --git a/common/changes/office-ui-fabric-react/modal-docs_2017-09-19-18-46.json b/common/changes/office-ui-fabric-react/modal-docs_2017-09-19-18-46.json
new file mode 100644
index 0000000000000..7e342b1405863
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/modal-docs_2017-09-19-18-46.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Modal: Updated padding in example to fix RTL support",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Modal/examples/Modal.Basic.Example.scss b/packages/office-ui-fabric-react/src/components/Modal/examples/Modal.Basic.Example.scss
index 83fce2ef9ee4c..228296e9165b0 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/examples/Modal.Basic.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/Modal/examples/Modal.Basic.Example.scss
@@ -16,7 +16,7 @@
       align-items: center;
       @include ms-font-xxl;
       @include ms-fontWeight-semibold;
-      padding-left: 28px;
+      padding: 0 28px;
       min-height: 40px;
     }
 

From d9d7806fc211a326161c407b28f908e1bc7ee3df Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Tue, 19 Sep 2017 17:37:34 -0500
Subject: [PATCH 0668/1641] Button: Add ability to dismiss menu from IButton
 interface (#2878)

* Refactor ContextualMenu customization example.

* Update checkmarks example

* Update directional contextual menu

* Update ContextualMenu.Header.Example

* Update menu section example

* Update contextual menu basic example

* Fix tslint issues

* Add API to the button interface to dismiss menus

* Rush change

* Update contextual-menu-example-refactor_2017-09-19-00-04.json
---
 ...enu-example-refactor_2017-09-19-00-04.json |  11 +
 .../src/components/Button/BaseButton.tsx      |   4 +
 .../src/components/Button/Button.Props.ts     |   5 +
 .../examples/ContextualMenu.Basic.Example.tsx | 283 ++++++------
 .../ContextualMenu.Checkmarks.Example.tsx     | 165 +++----
 .../ContextualMenu.Customization.Example.tsx  | 420 +++++++++---------
 .../ContextualMenu.Directional.Example.tsx    |  38 +-
 .../ContextualMenu.Header.Example.tsx         | 173 ++++----
 .../ContextualMenu.Section.Example.tsx        | 279 ++++++------
 9 files changed, 648 insertions(+), 730 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/contextual-menu-example-refactor_2017-09-19-00-04.json

diff --git a/common/changes/office-ui-fabric-react/contextual-menu-example-refactor_2017-09-19-00-04.json b/common/changes/office-ui-fabric-react/contextual-menu-example-refactor_2017-09-19-00-04.json
new file mode 100644
index 0000000000000..59e0cb212e23c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/contextual-menu-example-refactor_2017-09-19-00-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Button: Add the ability to dismiss any open menus from the button interface",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 8bbe4045106aa..456ca5783c88c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -184,6 +184,10 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     }
   }
 
+  public dismissMenu(): void {
+    this.setState({ menuProps: null });
+  }
+
   private _onRenderContent(tag: any, buttonProps: IButtonProps): JSX.Element {
     let props = this.props;
     let {
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
index 65dde1ca39a4e..16c4ea1d04c1c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
@@ -11,6 +11,11 @@ export interface IButton {
    * Sets focus to the button.
    */
   focus: () => void;
+
+  /**
+   * If there is a menu associated with this button and it is visible, this will dismiss the menu
+   */
+  dismissMenu: () => void;
 }
 
 export interface IButtonProps extends React.AllHTMLAttributes<HTMLAnchorElement | HTMLButtonElement | BaseButton | Button> {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx
index 24e3d4af2f275..64eb9cdcb64f3 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx
@@ -1,8 +1,7 @@
 import * as React from 'react';
-import { ContextualMenu, ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
-import { Callout, DirectionalHint } from 'office-ui-fabric-react/lib/Callout';
+import { ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { Callout } from 'office-ui-fabric-react/lib/Callout';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
-import { getRTL } from 'office-ui-fabric-react/lib/Utilities';
 import './ContextualMenuExample.scss';
 
 export class ContextualMenuBasicExample extends React.Component<any, any> {
@@ -10,11 +9,8 @@ export class ContextualMenuBasicExample extends React.Component<any, any> {
   constructor() {
     super();
     this.state = {
-      isContextMenuVisible: false,
       showCallout: false
     };
-    this._onClick = this._onClick.bind(this);
-    this._onDismiss = this._onDismiss.bind(this);
   }
 
   public render() {
@@ -22,154 +18,151 @@ export class ContextualMenuBasicExample extends React.Component<any, any> {
 
     return (
       <div>
-        <DefaultButton onClick={ this._onClick } id='ContextualMenuButton1' text='Click for ContextualMenu' />
-        { this.state.isContextMenuVisible ? (
-          <ContextualMenu
-            title='My Menu'
-            shouldFocusOnMount={ true }
-            target={ this.state.target }
-            onDismiss={ this._onDismiss }
-            directionalHint={ getRTL() ? DirectionalHint.bottomRightEdge : DirectionalHint.bottomLeftEdge }
-            items={
-              [
-                {
-                  key: 'newItem',
-                  iconProps: {
-                    iconName: 'Add'
-                  },
-                  subMenuProps: {
-                    items: [
-                      {
-                        key: 'emailMessage',
-                        name: 'Email message',
-                        title: 'Create an email'
-                      },
-                      {
-                        key: 'calendarEvent',
-                        name: 'Calendar event',
-                        title: 'Create a calendar event',
-                      }
-                    ],
-                  },
-                  name: 'New'
+        <DefaultButton
+          id='ContextualMenuButton1'
+          text='Click for ContextualMenu'
+          menuProps={ {
+            title: 'My Menu',
+            shouldFocusOnMount: true,
+            items: [
+              {
+                key: 'newItem',
+                iconProps: {
+                  iconName: 'Add'
                 },
-                {
-                  key: 'upload',
-                  onClick: () => {
-                    this.setState({ showCallout: true });
-                  },
-                  iconProps: {
-                    iconName: 'Upload',
-                    style: {
-                      color: 'salmon'
+                subMenuProps: {
+                  items: [
+                    {
+                      key: 'emailMessage',
+                      name: 'Email message',
+                      title: 'Create an email'
+                    },
+                    {
+                      key: 'calendarEvent',
+                      name: 'Calendar event',
+                      title: 'Create a calendar event',
                     }
-                  },
-                  name: 'Upload (Custom Color)',
-                  title: 'Upload a file'
-                },
-                {
-                  key: 'divider_1',
-                  itemType: ContextualMenuItemType.Divider
-                },
-                {
-                  key: 'rename',
-                  name: 'Rename'
+                  ],
                 },
-                {
-                  key: 'properties',
-                  name: 'Properties'
+                name: 'New'
+              },
+              {
+                key: 'upload',
+                onClick: () => {
+                  this.setState({ showCallout: true });
                 },
-                {
-                  key: 'disabled',
-                  name: 'Disabled item',
-                  disabled: true,
+                iconProps: {
+                  iconName: 'Upload',
+                  style: {
+                    color: 'salmon'
+                  }
                 },
-                {
-                  key: 'divider_2',
-                  itemType: ContextualMenuItemType.Divider
+                name: 'Upload (Custom Color)',
+                title: 'Upload a file'
+              },
+              {
+                key: 'divider_1',
+                itemType: ContextualMenuItemType.Divider
+              },
+              {
+                key: 'rename',
+                name: 'Rename'
+              },
+              {
+                key: 'properties',
+                name: 'Properties'
+              },
+              {
+                key: 'disabled',
+                name: 'Disabled item',
+                disabled: true,
+              },
+              {
+                key: 'divider_2',
+                itemType: ContextualMenuItemType.Divider
+              },
+              {
+                key: 'share',
+                iconProps: {
+                  iconName: 'Share'
                 },
-                {
-                  key: 'share',
-                  iconProps: {
-                    iconName: 'Share'
-                  },
-                  subMenuProps: {
-                    items: [
-                      {
-                        key: 'sharetoemail',
-                        name: 'Share to Email',
-                        iconProps: {
-                          iconName: 'Mail'
-                        },
+                subMenuProps: {
+                  items: [
+                    {
+                      key: 'sharetoemail',
+                      name: 'Share to Email',
+                      iconProps: {
+                        iconName: 'Mail'
                       },
-                      {
-                        key: 'sharetofacebook',
-                        name: 'Share to Facebook',
+                    },
+                    {
+                      key: 'sharetofacebook',
+                      name: 'Share to Facebook',
+                    },
+                    {
+                      key: 'sharetotwitter',
+                      name: 'Share to Twitter',
+                      iconProps: {
+                        iconName: 'Share'
                       },
-                      {
-                        key: 'sharetotwitter',
-                        name: 'Share to Twitter',
-                        iconProps: {
-                          iconName: 'Share'
-                        },
-                        subMenuProps: {
-                          items: [
-                            {
-                              key: 'sharetoemail_1',
-                              name: 'Share to Email',
-                              title: 'Share to Email',
-                              iconProps: {
-                                iconName: 'Mail'
-                              },
+                      subMenuProps: {
+                        items: [
+                          {
+                            key: 'sharetoemail_1',
+                            name: 'Share to Email',
+                            title: 'Share to Email',
+                            iconProps: {
+                              iconName: 'Mail'
                             },
-                            {
-                              key: 'sharetofacebook_1',
-                              name: 'Share to Facebook',
-                              title: 'Share to Facebook',
-                            },
-                            {
-                              key: 'sharetotwitter_1',
-                              name: 'Share to Twitter',
-                              title: 'Share to Twitter',
-                              iconProps: {
-                                iconName: 'Share'
-                              }
-                            },
-                          ],
-                        },
+                          },
+                          {
+                            key: 'sharetofacebook_1',
+                            name: 'Share to Facebook',
+                            title: 'Share to Facebook',
+                          },
+                          {
+                            key: 'sharetotwitter_1',
+                            name: 'Share to Twitter',
+                            title: 'Share to Twitter',
+                            iconProps: {
+                              iconName: 'Share'
+                            }
+                          },
+                        ],
                       },
-                    ],
-                  },
-                  name: 'Share'
-                },
-                {
-                  key: 'print',
-                  iconProps: {
-                    iconName: 'Print'
-                  },
-                  name: 'Print'
+                    },
+                  ],
                 },
-                {
-                  key: 'music',
-                  iconProps: {
-                    iconName: 'MusicInCollectionFill'
-                  },
-                  name: 'Music',
+                name: 'Share'
+              },
+              {
+                key: 'print',
+                iconProps: {
+                  iconName: 'Print'
                 },
-                {
-                  key: 'divider_3',
-                  itemType: ContextualMenuItemType.Divider,
+                name: 'Print'
+              },
+              {
+                key: 'music',
+                iconProps: {
+                  iconName: 'MusicInCollectionFill'
                 },
-                {
-                  key: 'Bing',
-                  name: 'Go to Bing',
-                  target: '_blank',
-                  href: 'http://www.bing.com'
-                },
-              ]
-            }
-          />) : (null) }
-
+                name: 'Music',
+              },
+              {
+                key: 'divider_3',
+                itemType: ContextualMenuItemType.Divider,
+              },
+              {
+                key: 'Bing',
+                name: 'Go to Bing',
+                target: '_blank',
+                href: 'http://www.bing.com'
+              },
+            ]
+          }
+          }
+        />
         { showCallout && (
           <Callout
             setInitialFocus={ true }
@@ -184,12 +177,4 @@ export class ContextualMenuBasicExample extends React.Component<any, any> {
       </div>
     );
   }
-
-  private _onClick(event: React.MouseEvent<any>) {
-    this.setState({ target: event.currentTarget, isContextMenuVisible: true });
-  }
-
-  private _onDismiss(event: any) {
-    this.setState({ isContextMenuVisible: false });
-  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
index 414e2bfef0548..9714b4e60dc28 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
@@ -1,11 +1,10 @@
 import * as React from 'react';
-import { ContextualMenu, IContextualMenuItem, DirectionalHint, ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { IContextualMenuItem, ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import './ContextualMenuExample.scss';
 
 export interface IContextualMenuMultiselectExampleState {
   selection?: { [key: string]: boolean };
-  isContextMenuVisible?: boolean;
 }
 
 let keys: string[] = ['newItem', 'share', 'mobile', 'enablePrint', 'enableMusic', 'newSub', 'emailMessage', 'calendarEvent'];
@@ -16,12 +15,9 @@ export class ContextualMenuCheckmarksExample extends React.Component<any, IConte
     super();
 
     this._onToggleSelect = this._onToggleSelect.bind(this);
-    this._onClick = this._onClick.bind(this);
-    this._onDismiss = this._onDismiss.bind(this);
 
     this.state = {
       selection: {},
-      isContextMenuVisible: false
     };
   }
 
@@ -29,86 +25,80 @@ export class ContextualMenuCheckmarksExample extends React.Component<any, IConte
     let { selection } = this.state;
 
     return (
-      <div>
-        <DefaultButton
-          onClick={ this._onClick }
-          id='ContextualMenuButton2'
-          text='Click for ContextualMenu'
-        />
-        { this.state.isContextMenuVisible ? (
-          <ContextualMenu
-            target='#ContextualMenuButton2'
-            shouldFocusOnMount={ false }
-            onDismiss={ this._onDismiss }
-            directionalHint={ DirectionalHint.bottomLeftEdge }
-            items={
-              [
-                {
-                  key: keys[0],
-                  name: 'New',
-                  canCheck: true,
-                  isChecked: selection![keys[0]],
-                  onClick: this._onToggleSelect
-                },
-                {
-                  key: keys[1],
-                  name: 'Share',
-                  canCheck: true,
-                  isChecked: selection![keys[1]],
-                  onClick: this._onToggleSelect
-                },
-                {
-                  key: keys[2],
-                  name: 'Mobile',
-                  canCheck: true,
-                  isChecked: selection![keys[2]],
-                  onClick: this._onToggleSelect
-                },
-                {
-                  key: 'divider_1',
-                  itemType: ContextualMenuItemType.Divider
-                },
+      <DefaultButton
+        id='ContextualMenuButton2'
+        text='Click for ContextualMenu'
+        menuProps={
+          {
+            shouldFocusOnMount: false,
+            items:
+            [
+              {
+                key: keys[0],
+                name: 'New',
+                canCheck: true,
+                isChecked: selection![keys[0]],
+                onClick: this._onToggleSelect
+              },
+              {
+                key: keys[1],
+                name: 'Share',
+                canCheck: true,
+                isChecked: selection![keys[1]],
+                onClick: this._onToggleSelect
+              },
+              {
+                key: keys[2],
+                name: 'Mobile',
+                canCheck: true,
+                isChecked: selection![keys[2]],
+                onClick: this._onToggleSelect
+              },
+              {
+                key: 'divider_1',
+                itemType: ContextualMenuItemType.Divider
+              },
 
-                {
-                  key: keys[3],
-                  name: 'Print',
-                  canCheck: true,
-                  isChecked: selection![keys[3]],
-                  onClick: this._onToggleSelect
-                },
-                {
-                  key: keys[4],
-                  name: 'Music',
-                  canCheck: true,
-                  isChecked: selection![keys[4]],
-                  onClick: this._onToggleSelect
-                },
-                {
-                  key: keys[5],
-                  subMenuProps: {
-                    items: [
-                      {
-                        key: keys[6],
-                        name: 'Email message',
-                        canCheck: true,
-                        isChecked: selection![keys[6]],
-                        onClick: this._onToggleSelect
-                      },
-                      {
-                        key: keys[7],
-                        name: 'Calendar event',
-                        canCheck: true,
-                        isChecked: selection![keys[7]],
-                        onClick: this._onToggleSelect
-                      }
-                    ],
-                  },
-                  name: 'New'
+              {
+                key: keys[3],
+                name: 'Print',
+                canCheck: true,
+                isChecked: selection![keys[3]],
+                onClick: this._onToggleSelect
+              },
+              {
+                key: keys[4],
+                name: 'Music',
+                canCheck: true,
+                isChecked: selection![keys[4]],
+                onClick: this._onToggleSelect
+              },
+              {
+                key: keys[5],
+                subMenuProps: {
+                  items: [
+                    {
+                      key: keys[6],
+                      name: 'Email message',
+                      canCheck: true,
+                      isChecked: selection![keys[6]],
+                      onClick: this._onToggleSelect
+                    },
+                    {
+                      key: keys[7],
+                      name: 'Calendar event',
+                      canCheck: true,
+                      isChecked: selection![keys[7]],
+                      onClick: this._onToggleSelect
+                    }
+                  ],
                 },
-              ]
-            }
-          />) : (null) }
-      </div>
+                name: 'New'
+              },
+            ]
+          }
+        }
+      />
     );
   }
 
@@ -121,13 +111,4 @@ export class ContextualMenuCheckmarksExample extends React.Component<any, IConte
       selection: selection
     });
   }
-
-  private _onClick(event: React.MouseEvent<HTMLButtonElement>) {
-    this.setState({ isContextMenuVisible: true });
-  }
-
-  private _onDismiss() {
-    this.setState({ isContextMenuVisible: false });
-  }
-
 }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
index 23017abe9b40d..e099000a59cf0 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
@@ -1,231 +1,224 @@
 import * as React from 'react';
-import { ContextualMenu, DirectionalHint, ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
-import { DefaultButton, IconButton } from 'office-ui-fabric-react/lib/Button';
+import { DirectionalHint, ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { DefaultButton, IconButton, IButton } from 'office-ui-fabric-react/lib/Button';
 import { FocusZoneDirection } from 'office-ui-fabric-react/lib/FocusZone';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import './ContextualMenuExample.scss';
 
-export interface IContextualMenuMultiselectExampleState {
-  selection?: { [key: string]: boolean };
-  isContextMenuVisible?: boolean;
-}
-
-export class ContextualMenuCustomizationExample extends React.Component<any, IContextualMenuMultiselectExampleState> {
-
-  constructor() {
-    super();
-    this._onClick = this._onClick.bind(this);
-    this._onDismiss = this._onDismiss.bind(this);
-    this.state = {
-      selection: {},
-      isContextMenuVisible: false
-    };
-  }
+export class ContextualMenuCustomizationExample extends React.Component<{}, {}> {
+  private _button: IButton | undefined;
 
   public render() {
     return (
-      <div>
-        <DefaultButton
-          onClick={ this._onClick }
-          className='ContextualMenuButton3'
-          text='Click for ContextualMenu'
-        />
-        { this.state.isContextMenuVisible ? (
-          <ContextualMenu
-            target='.ContextualMenuButton3'
-            shouldFocusOnMount={ false }
-            onDismiss={ this._onDismiss }
-            directionalHint={ DirectionalHint.bottomLeftEdge }
-            className='ms-ContextualMenu-customizationExample'
-            items={
-              [
-                {
-                  key: 'newItem',
-                  icon: 'Add',
-                  subMenuProps: {
-                    items: [
-                      {
-                        key: 'emailMessage',
-                        name: 'Email message',
-                      },
-                      {
-                        key: 'calendarEvent',
-                        name: 'Calendar event',
-                      }
-                    ],
-                  },
-                  name: 'New'
+      <DefaultButton
+        componentRef={ (button) => this._button = button }
+        className='ContextualMenuButton3'
+        text='Click for ContextualMenu'
+        menuProps={
+          {
+            shouldFocusOnMount: false,
+            directionalHint: DirectionalHint.bottomLeftEdge,
+            className: 'ms-ContextualMenu-customizationExample',
+            items:
+            [
+              {
+                key: 'newItem',
+                icon: 'Add',
+                subMenuProps: {
+                  items: [
+                    {
+                      key: 'emailMessage',
+                      name: 'Email message',
+                    },
+                    {
+                      key: 'calendarEvent',
+                      name: 'Calendar event',
+                    }
+                  ],
                 },
-                {
-                  key: 'upload',
-                  icon: 'Upload',
-                  name: 'Upload'
+                name: 'New'
+              },
+              {
+                key: 'upload',
+                icon: 'Upload',
+                name: 'Upload'
+              },
+              {
+                key: 'divider_1',
+                itemType: ContextualMenuItemType.Divider
+              },
+              {
+                key: 'charm',
+                name: 'Charm',
+                className: 'Charm-List',
+                subMenuProps: {
+                  arrowDirection: FocusZoneDirection.bidirectional,
+                  items: [
+                    {
+                      key: 'none',
+                      name: 'None'
+                    },
+                    {
+                      key: 'bulb',
+                      name: 'Lightbulb',
+                      onRender: this._renderCharmMenuItem,
+                      className: 'ms-ContextualMenu-customizationExample-item'
+                    },
+                    {
+                      key: 'run',
+                      name: 'Running',
+                      onRender: this._renderCharmMenuItem,
+                      className: 'ms-ContextualMenu-customizationExample-item'
+                    },
+                    {
+                      key: 'plane',
+                      name: 'Airplane',
+                      onRender: this._renderCharmMenuItem,
+                      className: 'ms-ContextualMenu-customizationExample-item'
+                    },
+                    {
+                      key: 'page',
+                      name: 'Page',
+                      onRender: this._renderCharmMenuItem,
+                      className: 'ms-ContextualMenu-customizationExample-item'
+                    },
+                    {
+                      key: 'cake',
+                      name: 'Cake',
+                      onRender: this._renderCharmMenuItem,
+                      className: 'ms-ContextualMenu-customizationExample-item'
+                    },
+                    {
+                      key: 'soccer',
+                      name: 'Soccer',
+                      onRender: this._renderCharmMenuItem,
+                      className: 'ms-ContextualMenu-customizationExample-item'
+                    },
+                    {
+                      key: 'home',
+                      name: 'Home',
+                      onRender: this._renderCharmMenuItem,
+                      className: 'ms-ContextualMenu-customizationExample-item'
+                    },
+                    {
+                      key: 'emoji',
+                      name: 'Emoji2',
+                      onRender: this._renderCharmMenuItem,
+                      className: 'ms-ContextualMenu-customizationExample-item'
+                    },
+                    {
+                      key: 'work',
+                      name: 'Work',
+                      onRender: this._renderCharmMenuItem,
+                      className: 'ms-ContextualMenu-customizationExample-item'
+                    },
+                    {
+                      key: 'coffee',
+                      name: 'Coffee',
+                      onRender: this._renderCharmMenuItem,
+                      className: 'ms-ContextualMenu-customizationExample-item'
+                    },
+                    {
+                      key: 'people',
+                      name: 'People',
+                      onRender: this._renderCharmMenuItem,
+                      className: 'ms-ContextualMenu-customizationExample-item'
+                    },
+                    {
+                      key: 'stopwatch',
+                      name: 'Stopwatch',
+                      onRender: this._renderCharmMenuItem,
+                      className: 'ms-ContextualMenu-customizationExample-item'
+                    },
+                    {
+                      key: 'music',
+                      name: 'MusicInCollectionFill',
+                      onRender: this._renderCharmMenuItem,
+                      className: 'ms-ContextualMenu-customizationExample-item'
+                    },
+                    {
+                      key: 'lock',
+                      name: 'Lock',
+                      onRender: this._renderCharmMenuItem,
+                      className: 'ms-ContextualMenu-customizationExample-item'
+                    }
+                  ]
                 },
-                {
-                  key: 'divider_1',
-                  itemType: ContextualMenuItemType.Divider
+              },
+              {
+                key: 'categories',
+                name: 'Categorize',
+                subMenuProps: {
+                  items: [
+                    {
+                      key: 'categories',
+                      name: 'categories',
+                      categoryList: [
+                        {
+                          name: 'Personal',
+                          color: 'yellow'
+                        },
+                        {
+                          name: 'Work',
+                          color: 'green'
+                        },
+                        {
+                          name: 'Birthday',
+                          color: 'blue'
+                        },
+                        {
+                          name: 'Spam',
+                          color: 'grey'
+                        },
+                        {
+                          name: 'Urgent',
+                          color: 'red'
+                        },
+                        {
+                          name: 'Hobbies',
+                          color: 'black'
+                        },
+                      ],
+                      onRender: this._renderCategoriesList
+                    },
+                    {
+                      key: 'divider_1',
+                      itemType: ContextualMenuItemType.Divider
+                    },
+                    {
+                      key: 'clear',
+                      name: 'Clear categories'
+                    },
+                    {
+                      key: 'manage',
+                      name: 'Manage categories'
+                    }
+                  ]
                 },
-                {
-                  key: 'charm',
-                  name: 'Charm',
-                  className: 'Charm-List',
-                  subMenuProps: {
-                    arrowDirection: FocusZoneDirection.bidirectional,
-                    items: [
-                      {
-                        key: 'none',
-                        name: 'None'
-                      },
-                      {
-                        key: 'bulb',
-                        name: 'Lightbulb',
-                        onRender: this._renderCharmMenuItem,
-                        className: 'ms-ContextualMenu-customizationExample-item'
-                      },
-                      {
-                        key: 'run',
-                        name: 'Running',
-                        onRender: this._renderCharmMenuItem,
-                        className: 'ms-ContextualMenu-customizationExample-item'
-                      },
-                      {
-                        key: 'plane',
-                        name: 'Airplane',
-                        onRender: this._renderCharmMenuItem,
-                        className: 'ms-ContextualMenu-customizationExample-item'
-                      },
-                      {
-                        key: 'page',
-                        name: 'Page',
-                        onRender: this._renderCharmMenuItem,
-                        className: 'ms-ContextualMenu-customizationExample-item'
-                      },
-                      {
-                        key: 'cake',
-                        name: 'Cake',
-                        onRender: this._renderCharmMenuItem,
-                        className: 'ms-ContextualMenu-customizationExample-item'
-                      },
-                      {
-                        key: 'soccer',
-                        name: 'Soccer',
-                        onRender: this._renderCharmMenuItem,
-                        className: 'ms-ContextualMenu-customizationExample-item'
-                      },
-                      {
-                        key: 'home',
-                        name: 'Home',
-                        onRender: this._renderCharmMenuItem,
-                        className: 'ms-ContextualMenu-customizationExample-item'
-                      },
-                      {
-                        key: 'emoji',
-                        name: 'Emoji2',
-                        onRender: this._renderCharmMenuItem,
-                        className: 'ms-ContextualMenu-customizationExample-item'
-                      },
-                      {
-                        key: 'work',
-                        name: 'Work',
-                        onRender: this._renderCharmMenuItem,
-                        className: 'ms-ContextualMenu-customizationExample-item'
-                      },
-                      {
-                        key: 'coffee',
-                        name: 'Coffee',
-                        onRender: this._renderCharmMenuItem,
-                        className: 'ms-ContextualMenu-customizationExample-item'
-                      },
-                      {
-                        key: 'people',
-                        name: 'People',
-                        onRender: this._renderCharmMenuItem,
-                        className: 'ms-ContextualMenu-customizationExample-item'
-                      },
-                      {
-                        key: 'stopwatch',
-                        name: 'Stopwatch',
-                        onRender: this._renderCharmMenuItem,
-                        className: 'ms-ContextualMenu-customizationExample-item'
-                      },
-                      {
-                        key: 'music',
-                        name: 'MusicInCollectionFill',
-                        onRender: this._renderCharmMenuItem,
-                        className: 'ms-ContextualMenu-customizationExample-item'
-                      },
-                      {
-                        key: 'lock',
-                        name: 'Lock',
-                        onRender: this._renderCharmMenuItem,
-                        className: 'ms-ContextualMenu-customizationExample-item'
-                      }
-                    ]
-                  },
-                },
-                {
-                  key: 'categories',
-                  name: 'Categorize',
-                  subMenuProps: {
-                    items: [
-                      {
-                        key: 'categories',
-                        name: 'categories',
-                        categoryList: [
-                          {
-                            name: 'Personal',
-                            color: 'yellow'
-                          },
-                          {
-                            name: 'Work',
-                            color: 'green'
-                          },
-                          {
-                            name: 'Birthday',
-                            color: 'blue'
-                          },
-                          {
-                            name: 'Spam',
-                            color: 'grey'
-                          },
-                          {
-                            name: 'Urgent',
-                            color: 'red'
-                          },
-                          {
-                            name: 'Hobbies',
-                            color: 'black'
-                          },
-                        ],
-                        onRender: this._renderCategoriesList
-                      },
-                      {
-                        key: 'divider_1',
-                        itemType: ContextualMenuItemType.Divider
-                      },
-                      {
-                        key: 'clear',
-                        name: 'Clear categories'
-                      },
-                      {
-                        key: 'manage',
-                        name: 'Manage categories'
-                      }
-                    ]
-                  },
-                }
-              ]
-            }
-          />) : null }
-      </div>
+              }
+            ]
+          }
+        }
+
+      />
     );
   }
 
+  @autobind
+  private _dismissMenu() {
+    if (this._button) {
+      this._button.dismissMenu();
+    }
+  }
+
+  @autobind
   private _renderCharmMenuItem(item: any) {
     return (
       <IconButton
         iconProps={ { iconName: item.name } }
         className='ms-ContextualMenu-customizationExample-icon ms-ContextualMenu-link'
         data-is-focusable={ true }
+        onClick={ this._dismissMenu }
       />
     );
   }
@@ -251,13 +244,4 @@ export class ContextualMenuCustomizationExample extends React.Component<any, ICo
       </ul>
     );
   }
-
-  private _onClick(event: any) {
-    this.setState({ isContextMenuVisible: true });
-  }
-
-  private _onDismiss(event: any) {
-    this.setState({ isContextMenuVisible: false });
-  }
-
 }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
index ad49b644f4b6e..cd3e7d2f1f27c 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
-import { ContextualMenu, DirectionalHint, ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { DirectionalHint, ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
 import { Dropdown, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
 import { Slider } from 'office-ui-fabric-react/lib/Slider';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
@@ -11,7 +11,6 @@ import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
 const exampleStyles: any = exampleStylesImport;
 
 export interface IContextualMenuDirectionalExampleState {
-  isContextualMenuVisible?: boolean;
   directionalHint?: DirectionalHint;
   directionalHintForRTL?: DirectionalHint;
   useDirectionalHintForRtl?: boolean;
@@ -49,7 +48,6 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
     super();
 
     this.state = {
-      isContextualMenuVisible: false,
       isBeakVisible: false,
       directionalHint: DirectionalHint.bottomLeftEdge,
       directionalHintForRTL: DirectionalHint.bottomLeftEdge,
@@ -68,7 +66,6 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
       edgeFixed,
       gapSpace,
       isBeakVisible,
-      isContextualMenuVisible,
       useDirectionalHintForRtl
     } = this.state;
 
@@ -123,20 +120,15 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
         </div>
         <div className='ms-ContextualMenuDirectionalExample-buttonArea' ref='menuButton'>
           <DefaultButton
-            onClick={ this._onShowMenuClicked }
-            text={ isContextualMenuVisible ? 'Hide context menu' : 'Show context menu' }
-          />
-        </div>
-        { isContextualMenuVisible ? (
-          <ContextualMenu
-            target={ this.refs.menuButton }
-            isBeakVisible={ isBeakVisible }
-            directionalHint={ directionalHint }
-            directionalHintForRTL={ useDirectionalHintForRtl ? directionalHintForRTL : undefined }
-            gapSpace={ gapSpace }
-            beakWidth={ beakWidth }
-            directionalHintFixed={ edgeFixed }
-            items={
+            text='Show context menu'
+            menuProps={ {
+              isBeakVisible: isBeakVisible,
+              directionalHint: directionalHint,
+              directionalHintForRTL: useDirectionalHintForRtl ? directionalHintForRTL : undefined,
+              gapSpace: gapSpace,
+              beakWidth: beakWidth,
+              directionalHintFixed: edgeFixed,
+              items:
               [
                 {
                   key: 'newItem',
@@ -204,8 +196,9 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
                 },
               ]
             }
+            }
           />
-        ) : (null) }
+        </div>
       </div>
     );
   }
@@ -231,13 +224,6 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
     });
   }
 
-  @autobind
-  private _onShowMenuClicked() {
-    this.setState({
-      isContextualMenuVisible: !this.state.isContextualMenuVisible
-    });
-  }
-
   @autobind
   private _onDirectionalChanged(option: IDropdownOption) {
     this.setState({
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Header.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Header.Example.tsx
index df6d54a09f7aa..779121c596699 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Header.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Header.Example.tsx
@@ -1,116 +1,93 @@
 import * as React from 'react';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
-import { ContextualMenu, DirectionalHint } from 'office-ui-fabric-react/lib/ContextualMenu';
-import { getRTL } from 'office-ui-fabric-react/lib/Utilities';
 import './ContextualMenuExample.scss';
 
-export class ContextualMenuHeaderExample extends React.Component<any, any> {
-
-  constructor() {
-    super();
-    this.state = {
-      isContextMenuVisible: false
-    };
-    this._onClick = this._onClick.bind(this);
-    this._onDismiss = this._onDismiss.bind(this);
-  }
+export class ContextualMenuHeaderExample extends React.Component<{}, {}> {
 
   public render() {
 
     return (
-      <div>
-        <DefaultButton onClick={ this._onClick } id='ContextualMenuButton1' text='Click for ContextualMenu' />
-        { this.state.isContextMenuVisible ? (
-          <ContextualMenu
-            shouldFocusOnMount={ true }
-            target={ this.state.target }
-            onDismiss={ this._onDismiss }
-            directionalHint={ getRTL() ? DirectionalHint.bottomRightEdge : DirectionalHint.bottomLeftEdge }
-            items={
-              [
-                {
-                  key: 'Actions',
-                  itemType: 2,
-                  name: 'Actions'
-                },
-                {
-                  key: 'upload',
-                  iconProps: {
-                    iconName: 'Upload',
-                    style: {
-                      color: 'salmon'
-                    }
-                  },
-                  name: 'Upload',
-                  title: 'Upload a file'
+      <DefaultButton
+        id='ContextualMenuButton1'
+        text='Click for ContextualMenu'
+        menuProps={
+          {
+            shouldFocusOnMount: true,
+            items: [
+              {
+                key: 'Actions',
+                itemType: 2,
+                name: 'Actions'
+              },
+              {
+                key: 'upload',
+                iconProps: {
+                  iconName: 'Upload',
+                  style: {
+                    color: 'salmon'
+                  }
                 },
-                {
-                  key: 'rename',
-                  name: 'Rename'
+                name: 'Upload',
+                title: 'Upload a file'
+              },
+              {
+                key: 'rename',
+                name: 'Rename'
+              },
+              {
+                key: 'share',
+                iconProps: {
+                  iconName: 'Share'
                 },
-                {
-                  key: 'share',
-                  iconProps: {
-                    iconName: 'Share'
-                  },
-                  subMenuProps: {
-                    items: [
-                      {
-                        key: 'sharetoemail',
-                        name: 'Share to Email',
-                        iconProps: {
-                          iconName: 'Mail'
-                        },
+                subMenuProps: {
+                  items: [
+                    {
+                      key: 'sharetoemail',
+                      name: 'Share to Email',
+                      iconProps: {
+                        iconName: 'Mail'
                       },
-                      {
-                        key: 'sharetofacebook',
-                        name: 'Share to Facebook',
+                    },
+                    {
+                      key: 'sharetofacebook',
+                      name: 'Share to Facebook',
+                    },
+                    {
+                      key: 'sharetotwitter',
+                      name: 'Share to Twitter',
+                      iconProps: {
+                        iconName: 'Share'
                       },
-                      {
-                        key: 'sharetotwitter',
-                        name: 'Share to Twitter',
-                        iconProps: {
-                          iconName: 'Share'
-                        },
-                      },
-                    ],
-                  },
-                  name: 'Sharing'
-                },
-                {
-                  key: 'navigation',
-                  itemType: 2,
-                  name: 'Navigation'
-                },
-                {
-                  key: 'properties',
-                  name: 'Properties'
+                    },
+                  ],
                 },
-                {
-                  key: 'print',
-                  iconProps: {
-                    iconName: 'Print'
-                  },
-                  name: 'Print'
+                name: 'Sharing'
+              },
+              {
+                key: 'navigation',
+                itemType: 2,
+                name: 'Navigation'
+              },
+              {
+                key: 'properties',
+                name: 'Properties'
+              },
+              {
+                key: 'print',
+                iconProps: {
+                  iconName: 'Print'
                 },
+                name: 'Print'
+              },
 
-                {
-                  key: 'Bing',
-                  name: 'Go to Bing',
-                  href: 'http://www.bing.com'
-                },
-              ]
-            }
-          />) : (null) }
-      </div>
+              {
+                key: 'Bing',
+                name: 'Go to Bing',
+                href: 'http://www.bing.com'
+              },
+            ]
+          } }
+      />
     );
   }
-
-  private _onClick(event: React.MouseEvent<any>) {
-    this.setState({ target: event.target, isContextMenuVisible: true });
-  }
-
-  private _onDismiss(event: any) {
-    this.setState({ isContextMenuVisible: false });
-  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx
index daeaf5fa36cbc..86a6ec635237c 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx
@@ -1,8 +1,7 @@
 import * as React from 'react';
-import { ContextualMenu, ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
-import { Callout, DirectionalHint } from 'office-ui-fabric-react/lib/Callout';
+import { ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { Callout } from 'office-ui-fabric-react/lib/Callout';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
-import { getRTL } from 'office-ui-fabric-react/lib/Utilities';
 import './ContextualMenuExample.scss';
 
 export class ContextualMenuSectionExample extends React.Component<any, any> {
@@ -10,11 +9,8 @@ export class ContextualMenuSectionExample extends React.Component<any, any> {
   constructor() {
     super();
     this.state = {
-      isContextMenuVisible: false,
       showCallout: false
     };
-    this._onClick = this._onClick.bind(this);
-    this._onDismiss = this._onDismiss.bind(this);
   }
 
   public render() {
@@ -22,152 +18,149 @@ export class ContextualMenuSectionExample extends React.Component<any, any> {
 
     return (
       <div>
-        <DefaultButton onClick={ this._onClick } id='ContextualMenuButton1' text='Click for ContextualMenu' />
-        { this.state.isContextMenuVisible ? (
-          <ContextualMenu
-            shouldFocusOnMount={ true }
-            target={ this.state.target }
-            onDismiss={ this._onDismiss }
-            title='My Menu'
-            directionalHint={ getRTL() ? DirectionalHint.bottomRightEdge : DirectionalHint.bottomLeftEdge }
-            items={
-              [
-                {
-                  key: 'section',
-                  itemType: ContextualMenuItemType.Section,
-                  sectionProps: {
-                    topDivider: true,
-                    bottomDivider: true,
-                    title: {
-                      key: 'Actions',
-                      itemType: ContextualMenuItemType.Header,
-                      name: 'Actions'
-                    },
-                    items: [
-                      {
-                        key: 'newItem',
-                        name: 'New',
-                        iconProps: {
-                          iconName: 'Add'
-                        },
-                        subMenuProps: {
-                          items: [
-                            {
-                              key: 'emailMessage',
-                              name: 'Email message',
-                              title: 'Create an email'
-                            },
-                            {
-                              key: 'calendarEvent',
-                              name: 'Calendar event',
-                              title: 'Create a calendar event',
-                            }
-                          ],
-                        }
+        <DefaultButton
+          id='ContextualMenuButton1'
+          text='Click for ContextualMenu'
+          menuProps={ {
+            title: 'My Menu',
+            items:
+            [
+              {
+                key: 'section',
+                itemType: ContextualMenuItemType.Section,
+                sectionProps: {
+                  topDivider: true,
+                  bottomDivider: true,
+                  title: {
+                    key: 'Actions',
+                    itemType: ContextualMenuItemType.Header,
+                    name: 'Actions'
+                  },
+                  items: [
+                    {
+                      key: 'newItem',
+                      name: 'New',
+                      iconProps: {
+                        iconName: 'Add'
                       },
-                      {
-                        key: 'upload',
-                        onClick: () => {
-                          this.setState({ showCallout: true });
-                        },
-                        iconProps: {
-                          iconName: 'Upload',
-                          style: {
-                            color: 'salmon'
+                      subMenuProps: {
+                        items: [
+                          {
+                            key: 'emailMessage',
+                            name: 'Email message',
+                            title: 'Create an email'
+                          },
+                          {
+                            key: 'calendarEvent',
+                            name: 'Calendar event',
+                            title: 'Create a calendar event',
                           }
-                        },
-                        name: 'Upload (Custom Color)',
-                        title: 'Upload a file'
+                        ],
                       }
-                    ]
-                  }
-                },
-                {
-                  key: 'section',
-                  itemType: ContextualMenuItemType.Section,
-                  sectionProps: {
-                    title: {
-                      key: 'Navigation',
-                      itemType: ContextualMenuItemType.Header,
-                      name: 'Social'
                     },
-                    items: [
-                      {
-                        key: 'share',
-                        iconProps: {
-                          iconName: 'Share'
-                        },
-                        subMenuProps: {
-                          items: [
-                            {
-                              key: 'sharetoemail',
-                              name: 'Share to Email',
-                              iconProps: {
-                                iconName: 'Mail'
-                              },
+                    {
+                      key: 'upload',
+                      onClick: () => {
+                        this.setState({ showCallout: true });
+                      },
+                      iconProps: {
+                        iconName: 'Upload',
+                        style: {
+                          color: 'salmon'
+                        }
+                      },
+                      name: 'Upload (Custom Color)',
+                      title: 'Upload a file'
+                    }
+                  ]
+                }
+              },
+              {
+                key: 'section',
+                itemType: ContextualMenuItemType.Section,
+                sectionProps: {
+                  title: {
+                    key: 'Navigation',
+                    itemType: ContextualMenuItemType.Header,
+                    name: 'Social'
+                  },
+                  items: [
+                    {
+                      key: 'share',
+                      iconProps: {
+                        iconName: 'Share'
+                      },
+                      subMenuProps: {
+                        items: [
+                          {
+                            key: 'sharetoemail',
+                            name: 'Share to Email',
+                            iconProps: {
+                              iconName: 'Mail'
                             },
-                            {
-                              key: 'sharetofacebook',
-                              name: 'Share to Facebook',
+                          },
+                          {
+                            key: 'sharetofacebook',
+                            name: 'Share to Facebook',
+                          },
+                          {
+                            key: 'sharetotwitter',
+                            name: 'Share to Twitter',
+                            iconProps: {
+                              iconName: 'Share'
                             },
-                            {
-                              key: 'sharetotwitter',
-                              name: 'Share to Twitter',
-                              iconProps: {
-                                iconName: 'Share'
-                              },
-                              subMenuProps: {
-                                items: [
-                                  {
-                                    key: 'sharetoemail_1',
-                                    name: 'Share to Email',
-                                    title: 'Share to Email',
-                                    iconProps: {
-                                      iconName: 'Mail'
-                                    },
-                                  },
-                                  {
-                                    key: 'sharetofacebook_1',
-                                    name: 'Share to Facebook',
-                                    title: 'Share to Facebook',
+                            subMenuProps: {
+                              items: [
+                                {
+                                  key: 'sharetoemail_1',
+                                  name: 'Share to Email',
+                                  title: 'Share to Email',
+                                  iconProps: {
+                                    iconName: 'Mail'
                                   },
-                                  {
-                                    key: 'sharetotwitter_1',
-                                    name: 'Share to Twitter',
-                                    title: 'Share to Twitter',
-                                    iconProps: {
-                                      iconName: 'Share'
-                                    }
-                                  },
-                                ],
-                              },
+                                },
+                                {
+                                  key: 'sharetofacebook_1',
+                                  name: 'Share to Facebook',
+                                  title: 'Share to Facebook',
+                                },
+                                {
+                                  key: 'sharetotwitter_1',
+                                  name: 'Share to Twitter',
+                                  title: 'Share to Twitter',
+                                  iconProps: {
+                                    iconName: 'Share'
+                                  }
+                                },
+                              ],
                             },
-                          ],
-                        },
-                        name: 'Share'
+                          },
+                        ],
                       },
-                      {
-                        key: 'print',
-                        iconProps: {
-                          iconName: 'Print'
-                        },
-                        name: 'Print'
+                      name: 'Share'
+                    },
+                    {
+                      key: 'print',
+                      iconProps: {
+                        iconName: 'Print'
                       },
-                      {
-                        key: 'music',
-                        iconProps: {
-                          iconName: 'MusicInCollectionFill'
-                        },
-                        name: 'Music',
+                      name: 'Print'
+                    },
+                    {
+                      key: 'music',
+                      iconProps: {
+                        iconName: 'MusicInCollectionFill'
                       },
+                      name: 'Music',
+                    },
 
-                    ]
-                  }
+                  ]
                 }
-              ]
-            }
-          />) : (null) }
-
+              }
+            ]
+          }
+          }
+        />
         { showCallout && (
           <Callout
             setInitialFocus={ true }
@@ -182,12 +175,4 @@ export class ContextualMenuSectionExample extends React.Component<any, any> {
       </div>
     );
   }
-
-  private _onClick(event: React.MouseEvent<any>) {
-    this.setState({ target: event.currentTarget, isContextMenuVisible: true });
-  }
-
-  private _onDismiss(event: any) {
-    this.setState({ isContextMenuVisible: false });
-  }
 }

From bee114bcae16ea1de91895899f49ecf2d66dff5d Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 19 Sep 2017 15:47:32 -0700
Subject: [PATCH 0669/1641] Storybook vtest (#2867)

* init storybook

* Updated screener storybook

* CHange to typescript

* update storybook

* Fixed screener component

* more button organization

* Add to travis

* update shrinkwrap

* removed unnecessary packages

* update vr-test package

* remove chai/mocha from types
---
 .travis.yml                                   |    3 +-
 apps/vr-tests/.storybook/addons.js            |    5 +
 apps/vr-tests/.storybook/config.js            |    9 +
 apps/vr-tests/.storybook/webpack.config.js    |   40 +
 apps/vr-tests/index.html                      |   18 +
 apps/vr-tests/package.json                    |   36 +
 apps/vr-tests/screener.config.js              |    7 +
 .../src/stories/Breadcrumb.stories.tsx        |   40 +
 apps/vr-tests/src/stories/Button.stories.tsx  |  128 +
 apps/vr-tests/src/stories/index.tsx           |   18 +
 apps/vr-tests/tsconfig.json                   |   19 +
 apps/vr-tests/tslint.json                     |   11 +
 common/config/rush/npm-shrinkwrap.json        | 3832 ++++++++++++++---
 package.json                                  |    3 +-
 rush.json                                     |    5 +
 scripts/tasks/jest-reporter.js                |    2 +-
 16 files changed, 3510 insertions(+), 666 deletions(-)
 create mode 100644 apps/vr-tests/.storybook/addons.js
 create mode 100644 apps/vr-tests/.storybook/config.js
 create mode 100644 apps/vr-tests/.storybook/webpack.config.js
 create mode 100644 apps/vr-tests/index.html
 create mode 100644 apps/vr-tests/package.json
 create mode 100644 apps/vr-tests/screener.config.js
 create mode 100644 apps/vr-tests/src/stories/Breadcrumb.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/Button.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/index.tsx
 create mode 100644 apps/vr-tests/tsconfig.json
 create mode 100644 apps/vr-tests/tslint.json

diff --git a/.travis.yml b/.travis.yml
index 28ef2764c908b..591c216df9546 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -2,4 +2,5 @@ language: node_js
 node_js:
   - '7'
 script:
-  - npm run buildfast
\ No newline at end of file
+  - npm run buildfast
+  - npm run vrtest
\ No newline at end of file
diff --git a/apps/vr-tests/.storybook/addons.js b/apps/vr-tests/.storybook/addons.js
new file mode 100644
index 0000000000000..2bd629b1df312
--- /dev/null
+++ b/apps/vr-tests/.storybook/addons.js
@@ -0,0 +1,5 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import '@storybook/addons';
+import '@storybook/addon-options/register';
+import 'storybook-readme/register';
+import '@storybook/addon-actions/register';
\ No newline at end of file
diff --git a/apps/vr-tests/.storybook/config.js b/apps/vr-tests/.storybook/config.js
new file mode 100644
index 0000000000000..1dd9bf2f103d2
--- /dev/null
+++ b/apps/vr-tests/.storybook/config.js
@@ -0,0 +1,9 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as storybook from '@storybook/react';
+import { setOptions } from '@storybook/addon-options';
+
+setOptions({
+  name: 'Fabric'
+});
+
+storybook.configure(() => require('../src/stories/index'), module);
\ No newline at end of file
diff --git a/apps/vr-tests/.storybook/webpack.config.js b/apps/vr-tests/.storybook/webpack.config.js
new file mode 100644
index 0000000000000..e1f313a9edc64
--- /dev/null
+++ b/apps/vr-tests/.storybook/webpack.config.js
@@ -0,0 +1,40 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+
+module.exports = {
+  module: {
+    rules: [
+      {
+        test: /.css$/,
+        loaders: ['style-loader', 'css-loader'],
+      },
+      {
+        test: /\.tsx?$/,
+        exclude: /node_modules/,
+        loaders: ['babel-loader', 'awesome-typescript-loader'],
+      },
+      {
+        test: /\.(gif|jpg|jpeg|png|svg)$/,
+        loader: 'file-loader?name=[name].[ext]',
+      },
+      {
+        test: /\.(woff|woff2|ttf)$/,
+        loader: 'file-loader?name=[name].[ext]',
+      },
+      {
+        test: /\.md$/,
+        loader: 'raw-loader',
+      },
+    ],
+  },
+  resolve: {
+    // This replaces Storybook's resolve.extensions so we need to provide all of these
+    extensions: [
+      '.js',
+      '.json',
+      '.jsx',
+      '.ts',
+      '.tsx',
+      '.md',
+    ],
+  },
+};
\ No newline at end of file
diff --git a/apps/vr-tests/index.html b/apps/vr-tests/index.html
new file mode 100644
index 0000000000000..5fd2c3c069444
--- /dev/null
+++ b/apps/vr-tests/index.html
@@ -0,0 +1,18 @@
+<!doctype html>
+<html dir="ltr">
+
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+
+  <title>Todo App</title>
+  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react.min.js"></script>
+  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react-dom.min.js"></script>
+</head>
+
+<body>
+  <script type="text/javascript" src="todo-app.js"></script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
new file mode 100644
index 0000000000000..673c9ab8d38ba
--- /dev/null
+++ b/apps/vr-tests/package.json
@@ -0,0 +1,36 @@
+{
+  "name": "vr-tests",
+  "description": "Visual Regression Tests for Office UI Fabric React",
+  "version": "1.0.0",
+  "private": true,
+  "scripts": {
+    "build": "",
+    "clean": "",
+    "screener": "screener-storybook --conf screener.config.js --debug",
+    "storybook": "start-storybook --port 5555"
+  },
+  "devDependencies": {
+    "@storybook/addon-options": "=3.2.3",
+    "@storybook/react": "^3.2.3",
+    "@types/react": "15.0.38",
+    "@types/react-dom": "15.5.1",
+    "@types/storybook__react": "=3.0.5",
+    "css-loader": "=0.27.3",
+    "file-loader": "=0.11.1",
+    "postcss-loader": "=1.3.3",
+    "raw-loader": "=0.5.1",
+    "style-loader": "=0.16.1",
+    "awesome-typescript-loader": "^3.2.3",
+    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
+    "screener-storybook": "^0.9.0",
+    "screener-runner": "^0.6.19",
+    "storybook-readme": "=3.0.6"
+  },
+  "dependencies": {
+    "office-ui-fabric-react": ">=4.45.0 <5.0.0",
+    "react": "^15.4.2",
+    "react-dom": "^15.4.2",
+    "typescript": "2.4.2",
+    "tslib": "^1.7.1"
+  }
+}
\ No newline at end of file
diff --git a/apps/vr-tests/screener.config.js b/apps/vr-tests/screener.config.js
new file mode 100644
index 0000000000000..9a42828204330
--- /dev/null
+++ b/apps/vr-tests/screener.config.js
@@ -0,0 +1,7 @@
+module.exports = {
+  projectRepo: 'OfficeDev/office-ui-fabric-react',
+  storybookConfigDir: '.storybook',
+  apiKey: 'ff2096ee-7c7d-4e80-824b-9114ff43549c',
+  resolution: '1024x768',
+  failureExitCode: 0
+};
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Breadcrumb.stories.tsx b/apps/vr-tests/src/stories/Breadcrumb.stories.tsx
new file mode 100644
index 0000000000000..5b886de540e93
--- /dev/null
+++ b/apps/vr-tests/src/stories/Breadcrumb.stories.tsx
@@ -0,0 +1,40 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from './index';
+import { Breadcrumb } from 'office-ui-fabric-react';
+
+storiesOf('Breadcrumb', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener steps={ new Screener.Steps()
+      .hover('.ms-Breadcrumb-overflowButton')
+      .snapshot('hover')
+      .click('.ms-Breadcrumb-overflowButton') // opening the dropdown
+      .hover('.ms-Breadcrumb-overflowButton') // moving the mouse a bit to let dropdown open.
+      .snapshot('click')
+      .click('.ms-Breadcrumb-overflowButton') // closing the dropdown
+      .hover('.ms-Breadcrumb-list li:nth-child(2)')
+      .snapshot('longTitleHover')
+      .hover('.ms-Breadcrumb-list li:nth-child(3)')
+      .snapshot('shortTitleHover')
+      .end()
+    }>
+      { story() }
+    </Screener>
+  ))
+  .add('default', () => (
+    <Breadcrumb
+      items={ [
+        { text: 'Files', 'key': 'Files', href: '#/examples/breadcrumb' },
+        { text: 'This is link 1', 'key': 'l1', href: '#/examples/breadcrumb' },
+        { text: 'This is link 2', 'key': 'l2', href: '#/examples/breadcrumb' },
+        { text: 'This is link 3 with a long name', 'key': 'l3', href: '#/examples/breadcrumb' },
+        { text: 'This is link 4', 'key': 'l4', href: '#/examples/breadcrumb' },
+        { text: 'This is link 5', 'key': 'l5', href: '#/examples/breadcrumb', isCurrentItem: true },
+      ] }
+      maxDisplayedItems={ 3 }
+      ariaLabel={ 'Website breadcrumb' }
+    />
+  ))
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Button.stories.tsx b/apps/vr-tests/src/stories/Button.stories.tsx
new file mode 100644
index 0000000000000..41dd522156907
--- /dev/null
+++ b/apps/vr-tests/src/stories/Button.stories.tsx
@@ -0,0 +1,128 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from './index';
+import { DefaultButton, ActionButton, CompoundButton, IButtonProps, CommandBarButton } from 'office-ui-fabric-react';
+
+const baseProps: IButtonProps = {
+  iconProps: {
+    iconName: 'AddFriend'
+  },
+  children: 'Butjon',
+  description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor'
+}
+
+const commandProps: IButtonProps = {
+  'iconProps': { iconName: 'Add' },
+  'text': 'Create account',
+  'onClick': () => alert('Clicked'),
+  'menuProps': {
+    items: [
+      {
+        key: 'emailMessage',
+        name: 'Email message',
+        icon: 'Mail'
+      },
+      {
+        key: 'calendarEvent',
+        name: 'Calendar event',
+        icon: 'Calendar'
+      }
+    ]
+  }
+}
+
+storiesOf('Button Default', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener steps={ new Steps()
+      .hover('.ms-Button')
+      .snapshot('hover')
+      .end()
+    }>
+      { story() }
+    </Screener>
+  ))
+  .add('default', () => (<DefaultButton {...baseProps} ></DefaultButton>))
+  .add('default disabled', () => (<DefaultButton {...baseProps} disabled></DefaultButton>))
+  .add('default checked', () => (<DefaultButton {...baseProps} checked></DefaultButton>))
+  .add('primary', () => (<DefaultButton {...baseProps} primary></DefaultButton>))
+  .add('primary disabled', () => (<DefaultButton {...baseProps} primary disabled></DefaultButton>))
+  .add('primary checked', () => (<DefaultButton {...baseProps} primary checked></DefaultButton>))
+
+storiesOf('Button Action', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener steps={ new Steps()
+      .hover('.ms-Button')
+      .snapshot('hover')
+      .end()
+    }>
+      { story() }
+    </Screener>
+  ))
+  .add('action', () => (<ActionButton {...baseProps} ></ActionButton>))
+  .add('action disabled', () => (<ActionButton {...baseProps} disabled></ActionButton>))
+  .add('action checked', () => (<ActionButton {...baseProps} checked></ActionButton>))
+
+
+storiesOf('Button Compound', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener steps={ new Steps()
+      .hover('.ms-Button')
+      .snapshot('hover')
+      .end()
+    }>
+      { story() }
+    </Screener>
+  ))
+  .add('Compound', () => (<CompoundButton {...baseProps} ></CompoundButton>))
+  .add('Compound disabled', () => (<CompoundButton {...baseProps} disabled></CompoundButton>))
+  .add('Compound checked', () => (<CompoundButton {...baseProps} checked></CompoundButton>))
+  .add('Compound Primary', () => (<CompoundButton {...baseProps} primary></CompoundButton>))
+  .add('Compound Primary disabled', () => (<CompoundButton {...baseProps} primary disabled></CompoundButton>))
+  .add('Compound Primary checked', () => (<CompoundButton {...baseProps} primary checked></CompoundButton>))
+
+storiesOf('Button Command', module)
+  .addDecorator(story => <div style={ { display: 'flex', alignItems: 'stretch', height: '40px' } }>{ story() }</div>)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener steps={ new Steps()
+      .hover('.ms-Button')
+      .snapshot('hover')
+      .click('.ms-Button')
+      .hover('.ms-Button')
+      .snapshot('open')
+      .end()
+    }>
+      { story() }
+    </Screener>
+  ))
+  .add('Command', () => (<CommandBarButton {...commandProps} ></CommandBarButton>))
+  .add('Command disabled', () => (<CommandBarButton {...commandProps} disabled></CommandBarButton>))
+  .add('Command checked', () => (<CommandBarButton {...commandProps} checked></CommandBarButton>))
+
+storiesOf('Button Split', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener steps={ new Steps()
+      .hover('.ms-Button:nth-child(1)')
+      .snapshot('hover main')
+      .hover('.ms-Button:nth-child(2)')
+      .snapshot('hover split')
+      .click('.ms-Button:nth-child(2)')
+      .hover('.ms-Button')
+      .snapshot('open')
+      .end()
+    }>
+      { story() }
+    </Screener>
+  ))
+  .add('default', () => (<DefaultButton {...commandProps} split={ true }></DefaultButton>))
+  .add('default disabled', () => (<DefaultButton {...commandProps} disabled split={ true }></DefaultButton>))
+  .add('default checked', () => (<DefaultButton {...commandProps} checked split={ true }></DefaultButton>))
+  .add('primary', () => (<DefaultButton {...commandProps} primary split={ true }></DefaultButton>))
+  .add('primary disabled', () => (<DefaultButton {...commandProps} primary disabled split={ true }></DefaultButton>))
+  .add('primary checked', () => (<DefaultButton {...commandProps} primary checked split={ true }></DefaultButton>))
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/index.tsx b/apps/vr-tests/src/stories/index.tsx
new file mode 100644
index 0000000000000..9f2213c191f4d
--- /dev/null
+++ b/apps/vr-tests/src/stories/index.tsx
@@ -0,0 +1,18 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import { Fabric } from 'office-ui-fabric-react';
+
+
+// Wrap all stories in a Fabric component for proper styling
+export const FabricDecorator = (story) => (
+  <Fabric>
+    <p>
+      { story() }
+    </p>
+  </Fabric>
+);
+
+// Import component stories
+
+import './Button.stories';
+import './Breadcrumb.stories';
diff --git a/apps/vr-tests/tsconfig.json b/apps/vr-tests/tsconfig.json
new file mode 100644
index 0000000000000..69d520d4e2e7c
--- /dev/null
+++ b/apps/vr-tests/tsconfig.json
@@ -0,0 +1,19 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "outDir": "lib",
+    "module": "commonjs",
+    "jsx": "react",
+    "declaration": true,
+    "sourceMap": true,
+    "experimentalDecorators": true,
+    "forceConsistentCasingInFileNames": true,
+    "moduleResolution": "node",
+    "types": [
+      "webpack-env"
+    ]
+  },
+  "include": [
+    "src"
+  ]
+}
\ No newline at end of file
diff --git a/apps/vr-tests/tslint.json b/apps/vr-tests/tslint.json
new file mode 100644
index 0000000000000..cd3b575b4545f
--- /dev/null
+++ b/apps/vr-tests/tslint.json
@@ -0,0 +1,11 @@
+{
+  "extends": [
+    "office-ui-fabric-react-tslint"
+  ],
+  "rules": {
+    "no-any": false,
+    "typedef": [
+      false
+    ]
+  }
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index ed51282b4809f..f895be61d47da 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -3,6 +3,11 @@
   "version": "0.0.0",
   "lockfileVersion": 1,
   "dependencies": {
+    "@hypnosphi/fuse.js": {
+      "version": "3.0.9",
+      "resolved": "https://registry.npmjs.org/@hypnosphi/fuse.js/-/fuse.js-3.0.9.tgz",
+      "integrity": "sha1-6pn2EhtKjwZbTHH4VZXbJxRJiAc="
+    },
     "@microsoft/load-themed-styles": {
       "version": "1.7.4",
       "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.4.tgz",
@@ -14,7 +19,7 @@
       "integrity": "sha1-Y1VyRApbBFYM35zrC7OKTVbGSfQ="
     },
     "@rush-temp/build": {
-      "version": "file:projects/build",
+      "version": "file:projects\\build",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -194,6 +199,10 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "pify": {
+          "version": "2.3.0",
+          "bundled": true
+        },
         "qs": {
           "version": "6.5.0",
           "bundled": true
@@ -347,7 +356,7 @@
       }
     },
     "@rush-temp/example-app-base": {
-      "version": "file:projects/example-app-base",
+      "version": "file:projects\\example-app-base",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -455,6 +464,10 @@
           "version": "3.5.0",
           "bundled": true
         },
+        "ms": {
+          "version": "0.7.2",
+          "bundled": true
+        },
         "node-libs-browser": {
           "version": "2.0.0",
           "bundled": true
@@ -503,6 +516,14 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "source-map": {
+          "version": "0.1.43",
+          "bundled": true
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "bundled": true
+        },
         "stream-browserify": {
           "version": "2.0.1",
           "bundled": true
@@ -547,16 +568,34 @@
         },
         "watchpack": {
           "version": "1.4.0",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            }
+          }
         },
         "webpack": {
           "version": "3.5.5",
           "bundled": true,
           "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            },
             "has-flag": {
               "version": "2.0.0",
               "bundled": true
             },
+            "loader-utils": {
+              "version": "1.1.0",
+              "bundled": true
+            },
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            },
             "supports-color": {
               "version": "4.2.1",
               "bundled": true
@@ -565,7 +604,13 @@
         },
         "webpack-sources": {
           "version": "1.0.1",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
         },
         "which-module": {
           "version": "2.0.0",
@@ -582,7 +627,7 @@
       }
     },
     "@rush-temp/experiments": {
-      "version": "file:projects/experiments",
+      "version": "file:projects\\experiments",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -833,7 +878,7 @@
       }
     },
     "@rush-temp/fabric-website": {
-      "version": "file:projects/fabric-website",
+      "version": "file:projects\\fabric-website",
       "dependencies": {
         "@types/react-addons-test-utils": {
           "version": "0.14.19",
@@ -1005,6 +1050,14 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "source-map": {
+          "version": "0.1.43",
+          "bundled": true
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "bundled": true
+        },
         "stream-browserify": {
           "version": "2.0.1",
           "bundled": true
@@ -1045,25 +1098,61 @@
         },
         "watchpack": {
           "version": "1.4.0",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            }
+          }
         },
         "webpack": {
           "version": "3.5.5",
           "bundled": true,
           "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            },
+            "camelcase": {
+              "version": "4.1.0",
+              "bundled": true
+            },
             "has-flag": {
               "version": "2.0.0",
               "bundled": true
             },
+            "loader-utils": {
+              "version": "1.1.0",
+              "bundled": true
+            },
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            },
             "supports-color": {
               "version": "4.2.1",
               "bundled": true
+            },
+            "yargs": {
+              "version": "8.0.2",
+              "bundled": true
+            },
+            "yargs-parser": {
+              "version": "7.0.0",
+              "bundled": true
             }
           }
         },
         "webpack-sources": {
           "version": "1.0.1",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
         },
         "which-module": {
           "version": "2.0.0",
@@ -1080,7 +1169,7 @@
       }
     },
     "@rush-temp/merge-styles": {
-      "version": "file:projects/merge-styles",
+      "version": "file:projects\\merge-styles",
       "dependencies": {
         "commander": {
           "version": "2.9.0",
@@ -1109,7 +1198,7 @@
       }
     },
     "@rush-temp/office-ui-fabric-react": {
-      "version": "file:projects/office-ui-fabric-react",
+      "version": "file:projects\\office-ui-fabric-react",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1281,6 +1370,14 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "source-map": {
+          "version": "0.1.43",
+          "bundled": true
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "bundled": true
+        },
         "stream-browserify": {
           "version": "2.0.1",
           "bundled": true
@@ -1325,16 +1422,34 @@
         },
         "watchpack": {
           "version": "1.4.0",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            }
+          }
         },
         "webpack": {
           "version": "3.5.5",
           "bundled": true,
           "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            },
             "has-flag": {
               "version": "2.0.0",
               "bundled": true
             },
+            "loader-utils": {
+              "version": "1.1.0",
+              "bundled": true
+            },
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            },
             "supports-color": {
               "version": "4.2.1",
               "bundled": true
@@ -1343,7 +1458,13 @@
         },
         "webpack-sources": {
           "version": "1.0.1",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
         },
         "which-module": {
           "version": "2.0.0",
@@ -1360,10 +1481,10 @@
       }
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
-      "version": "file:projects/office-ui-fabric-react-tslint"
+      "version": "file:projects\\office-ui-fabric-react-tslint"
     },
     "@rush-temp/ssr-tests": {
-      "version": "file:projects/ssr-tests",
+      "version": "file:projects\\ssr-tests",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1491,6 +1612,10 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "pify": {
+          "version": "2.3.0",
+          "bundled": true
+        },
         "read-pkg": {
           "version": "2.0.0",
           "bundled": true
@@ -1592,7 +1717,7 @@
       }
     },
     "@rush-temp/styling": {
-      "version": "file:projects/styling",
+      "version": "file:projects\\styling",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1712,6 +1837,14 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "source-map": {
+          "version": "0.1.43",
+          "bundled": true
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "bundled": true
+        },
         "stream-browserify": {
           "version": "2.0.1",
           "bundled": true
@@ -1752,16 +1885,34 @@
         },
         "watchpack": {
           "version": "1.4.0",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            }
+          }
         },
         "webpack": {
           "version": "3.5.5",
           "bundled": true,
           "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            },
             "has-flag": {
               "version": "2.0.0",
               "bundled": true
             },
+            "loader-utils": {
+              "version": "1.1.0",
+              "bundled": true
+            },
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            },
             "supports-color": {
               "version": "4.2.1",
               "bundled": true
@@ -1770,7 +1921,13 @@
         },
         "webpack-sources": {
           "version": "1.0.1",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
         },
         "which-module": {
           "version": "2.0.0",
@@ -1787,7 +1944,7 @@
       }
     },
     "@rush-temp/test-bundle-button": {
-      "version": "file:projects/test-bundle-button",
+      "version": "file:projects\\test-bundle-button",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1891,6 +2048,14 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "source-map": {
+          "version": "0.1.43",
+          "bundled": true
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "bundled": true
+        },
         "stream-browserify": {
           "version": "2.0.1",
           "bundled": true
@@ -1931,15 +2096,41 @@
         },
         "watchpack": {
           "version": "1.4.0",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            }
+          }
         },
         "webpack": {
           "version": "3.5.5",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "1.1.0",
+              "bundled": true
+            },
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
         },
         "webpack-sources": {
           "version": "1.0.1",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
         },
         "which-module": {
           "version": "2.0.0",
@@ -1956,11 +2147,15 @@
       }
     },
     "@rush-temp/todo-app": {
-      "version": "file:projects/todo-app"
+      "version": "file:projects\\todo-app"
     },
     "@rush-temp/utilities": {
-      "version": "file:projects/utilities",
+      "version": "file:projects\\utilities",
       "dependencies": {
+        "async": {
+          "version": "0.9.2",
+          "bundled": true
+        },
         "commander": {
           "version": "2.9.0",
           "bundled": true
@@ -1981,16 +2176,164 @@
           "version": "3.5.0",
           "bundled": true
         },
+        "ms": {
+          "version": "0.7.2",
+          "bundled": true
+        },
         "sinon": {
           "version": "2.4.1",
           "bundled": true
         },
+        "source-map": {
+          "version": "0.1.43",
+          "bundled": true
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "bundled": true
+        },
         "supports-color": {
           "version": "3.1.2",
           "bundled": true
         }
       }
     },
+    "@rush-temp/vr-tests": {
+      "version": "file:projects\\vr-tests",
+      "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "bundled": true
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "bundled": true,
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
+        },
+        "has-flag": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "bundled": true
+        },
+        "postcss-loader": {
+          "version": "1.3.3",
+          "bundled": true
+        },
+        "style-loader": {
+          "version": "0.16.1",
+          "bundled": true
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "bundled": true
+        }
+      }
+    },
+    "@storybook/addon-actions": {
+      "version": "3.2.6",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-actions/-/addon-actions-3.2.6.tgz",
+      "integrity": "sha512-YuWOyC/sLvD2kicVem7JVAaFmnWmOXZI9OMWJHMjnH3znb6UjDpMQz5espDna/fF7rT9KEw9J+uwsM1rAxim1g=="
+    },
+    "@storybook/addon-links": {
+      "version": "3.2.6",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-links/-/addon-links-3.2.6.tgz",
+      "integrity": "sha512-6Vl5S+pTVJDKyGymn8v6IQwUkhO2PbHk14y0rmvQ93ivIWeoonA0H0TdDWSgLiuyMpqxxKu3f0tiZfLVnuSSpg=="
+    },
+    "@storybook/addon-options": {
+      "version": "3.2.3",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-options/-/addon-options-3.2.3.tgz",
+      "integrity": "sha1-6jdA0onUKc52fpaZvzpkfddBWS0="
+    },
+    "@storybook/addons": {
+      "version": "3.2.6",
+      "resolved": "https://registry.npmjs.org/@storybook/addons/-/addons-3.2.6.tgz",
+      "integrity": "sha512-i/sHbvEeMnnnLiPeXmE/b0OaVH5IM4U8CsdTh44RGjQVCnKstPpEhjD+hzPlhKFQnAtk9+vUxphvCWBgy6VouA=="
+    },
+    "@storybook/channel-postmessage": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/@storybook/channel-postmessage/-/channel-postmessage-3.2.0.tgz",
+      "integrity": "sha1-YS/1MSC/JmZgy5MousmtZxIoovc="
+    },
+    "@storybook/channels": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-3.2.0.tgz",
+      "integrity": "sha1-11OVIS23a0njM19QzOW8djzwtcY="
+    },
+    "@storybook/components": {
+      "version": "3.2.7",
+      "resolved": "https://registry.npmjs.org/@storybook/components/-/components-3.2.7.tgz",
+      "integrity": "sha1-fUxyIYUSYOQja7s++CpklLI+Xsk="
+    },
+    "@storybook/react": {
+      "version": "3.2.8",
+      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-3.2.8.tgz",
+      "integrity": "sha1-fUPvRQVZt887PswXzFTVoJ1epAI=",
+      "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "css-loader": {
+          "version": "0.28.7",
+          "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.7.tgz",
+          "integrity": "sha512-GxMpax8a/VgcfRrVy0gXD6yLd5ePYbXX/5zGgTVYp4wXtJklS8Z2VaUArJgc//f6/Dzil7BaJObdSv8eKKCPgg=="
+        },
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
+          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
+          "dependencies": {
+            "chalk": {
+              "version": "1.1.3",
+              "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+              "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+              "dependencies": {
+                "supports-color": {
+                  "version": "2.0.0",
+                  "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+                  "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+                }
+              }
+            }
+          }
+        },
+        "style-loader": {
+          "version": "0.17.0",
+          "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.17.0.tgz",
+          "integrity": "sha1-6CVLzNt690vVgnTjYQe01atN8xA="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
+    },
+    "@storybook/react-fuzzy": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/@storybook/react-fuzzy/-/react-fuzzy-0.4.0.tgz",
+      "integrity": "sha1-KWHoofbBr8zpfp6aFNHf6dkGEIc="
+    },
+    "@storybook/ui": {
+      "version": "3.2.7",
+      "resolved": "https://registry.npmjs.org/@storybook/ui/-/ui-3.2.7.tgz",
+      "integrity": "sha1-wH3VUj4sg9n4rFp5gsMFzFnzTng="
+    },
     "@types/chai": {
       "version": "3.4.35",
       "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.35.tgz",
@@ -2066,6 +2409,11 @@
       "resolved": "https://registry.npmjs.org/@types/sinon/-/sinon-2.2.2.tgz",
       "integrity": "sha1-qA2khougisysvOTTcnbzXhugpS8="
     },
+    "@types/storybook__react": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/@types/storybook__react/-/storybook__react-3.0.5.tgz",
+      "integrity": "sha512-febLx40iQWoQKVaEMpxdzkJnqncPHoRivlilc3JhHJiRuBY1Mqa1yTKcvQ5RiFAYFIuv4x+bRuSIXErk5v41Bg=="
+    },
     "@types/webpack-env": {
       "version": "1.13.0",
       "resolved": "https://registry.npmjs.org/@types/webpack-env/-/webpack-env-1.13.0.tgz",
@@ -2077,14 +2425,14 @@
       "integrity": "sha512-hy790+Zhsc3E75RWZHoZ7JRK0Mk+j0nf9rhwQZ7eA1+88ZuNo/6eBdeLC/5LynS7Fz35VVnMYWWFKxWumdrOxA=="
     },
     "@uifabric/styling": {
-      "version": "0.22.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.22.1.tgz",
-      "integrity": "sha512-wbWlJUVtvUoxdK2ux/m6M+mO3xkAdM0FQNitghomRE+0X14GwlujYnQDGCOyw5+bcLYMpGB/qy6J1QyCBh5AoQ=="
+      "version": "0.24.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.24.0.tgz",
+      "integrity": "sha512-Qmye+KeUqScYCPpCFgOQmOshIelXFhokEFNSa4PIVZMWYjl3JfpXDRogEL8gRgyl3qC4fcZas4GJxPfGswifyA=="
     },
     "@uifabric/utilities": {
-      "version": "4.13.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.13.0.tgz",
-      "integrity": "sha512-fptKRD3yhvcfyRHV5tPKBY3IGmdyhrXV4svyrxgCEI44gDXurxS83PQeCf86X4+J03FtuNDo/nQYkUDMTBJCFg=="
+      "version": "4.13.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.13.1.tgz",
+      "integrity": "sha512-jGSQ3E+GXey1N6y3wvKX+7D3dexf4vKZOybdynEu7i6ZZMaQzTuQwsQp4kmaneFS4edylfhNWcHebgKKPAbGxA=="
     },
     "abab": {
       "version": "1.0.3",
@@ -2126,6 +2474,11 @@
       "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-2.1.1.tgz",
       "integrity": "sha1-1t4Q1a9hMtW9aSQn1G/FOFOQlMc="
     },
+    "airbnb-js-shims": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/airbnb-js-shims/-/airbnb-js-shims-1.3.0.tgz",
+      "integrity": "sha512-Y/9jgf3uEdNyeWPUV1N49FowM/qMIiKSTkRUpYT4jpHkSADfTiRVwI8Mm6o4CIxhnBK1uMf4RIYNYKwwILMCAQ=="
+    },
     "ajv": {
       "version": "5.2.2",
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-5.2.2.tgz",
@@ -2159,9 +2512,9 @@
       "integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU="
     },
     "ansi-escapes": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-2.0.0.tgz",
-      "integrity": "sha1-W65SvkJIeN2Xg+iRDj/Cki6DyBs="
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-3.0.0.tgz",
+      "integrity": "sha512-O/klc27mWNUigtv0F8NJWbLF00OcegQalkqKURWdosW08YZKi4m6CnSUSvIZG1otNJbTWhN01Hhz389DW7mvDQ=="
     },
     "ansi-html": {
       "version": "0.0.7",
@@ -2213,11 +2566,6 @@
           "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
           "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
         },
-        "is-extglob": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
-          "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
-        },
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
@@ -2275,6 +2623,11 @@
       "resolved": "https://registry.npmjs.org/array-filter/-/array-filter-0.0.1.tgz",
       "integrity": "sha1-fajPLiZijtcygDWB/SH2fKzS7uw="
     },
+    "array-find": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/array-find/-/array-find-1.0.0.tgz",
+      "integrity": "sha1-bI4obRHtdoMn+OYuzuhzU8o+eLg="
+    },
     "array-find-index": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/array-find-index/-/array-find-index-1.0.2.tgz",
@@ -2285,6 +2638,11 @@
       "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
       "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI="
     },
+    "array-includes": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/array-includes/-/array-includes-3.0.3.tgz",
+      "integrity": "sha1-GEtI9i2S10UrsxsyMWXH+L0CJm0="
+    },
     "array-map": {
       "version": "0.0.0",
       "resolved": "https://registry.npmjs.org/array-map/-/array-map-0.0.0.tgz",
@@ -2355,6 +2713,16 @@
       "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-1.0.2.tgz",
       "integrity": "sha1-E8pRXYYgbaC6xm6DTdOX2HWBCUw="
     },
+    "ast-types": {
+      "version": "0.9.11",
+      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.9.11.tgz",
+      "integrity": "sha1-NxF3u1kjL/XOqh0J7lytcFsaWqk="
+    },
+    "astral-regex": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/astral-regex/-/astral-regex-1.0.0.tgz",
+      "integrity": "sha512-+Ryf6g3BKoRc7jfp7ad8tM4TtMiaWvbF/1/sQcZPkkS7ag3D5nMBCe2UfOTONtAkaG0tO0ij3C5Lwmf1EiyjHg=="
+    },
     "async": {
       "version": "2.5.0",
       "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
@@ -2380,10 +2748,15 @@
       "resolved": "https://registry.npmjs.org/atob/-/atob-2.0.3.tgz",
       "integrity": "sha1-GcenYEc3dEaPILLS0DNyrX1Mv10="
     },
+    "autolinker": {
+      "version": "0.15.3",
+      "resolved": "https://registry.npmjs.org/autolinker/-/autolinker-0.15.3.tgz",
+      "integrity": "sha1-NCQX2PLzRhsUzwkIjV7fh5HcmDI="
+    },
     "autoprefixer": {
-      "version": "7.1.3",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-7.1.3.tgz",
-      "integrity": "sha512-zGy6aRrZjWhR+25n89jYkpLXutg6xdDGKKnVNzkfamnnhK3mYchkKj5GJR14aJiU0x4UqZ1+N728tkFNUL5N2g==",
+      "version": "7.1.4",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-7.1.4.tgz",
+      "integrity": "sha512-MB1XybOJqu1uAwpfSilAa1wSURNc4W310CFKvMj1fNaJBFxr1PGgz72vZaPr9ryKGqs2vYZ6jDyJ0aiGELjsoA==",
       "dependencies": {
         "browserslist": {
           "version": "2.4.0",
@@ -2446,45 +2819,636 @@
         }
       }
     },
+    "babel-helper-bindify-decorators": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-bindify-decorators/-/babel-helper-bindify-decorators-6.24.1.tgz",
+      "integrity": "sha1-FMGeXxQte0fxmlJDHlKxzLxAozA="
+    },
+    "babel-helper-builder-binary-assignment-operator-visitor": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-builder-binary-assignment-operator-visitor/-/babel-helper-builder-binary-assignment-operator-visitor-6.24.1.tgz",
+      "integrity": "sha1-zORReto1b0IgvK6KAsKzRvmlZmQ="
+    },
+    "babel-helper-builder-react-jsx": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-helper-builder-react-jsx/-/babel-helper-builder-react-jsx-6.26.0.tgz",
+      "integrity": "sha1-Of+DE7dci2Xc7/HzHTg+D/KkCKA="
+    },
+    "babel-helper-call-delegate": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-call-delegate/-/babel-helper-call-delegate-6.24.1.tgz",
+      "integrity": "sha1-7Oaqzdx25Bw0YfiL/Fdb0Nqi340="
+    },
+    "babel-helper-define-map": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-helper-define-map/-/babel-helper-define-map-6.26.0.tgz",
+      "integrity": "sha1-pfVtq0GiX5fstJjH66ypgZ+Vvl8="
+    },
+    "babel-helper-evaluate-path": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-helper-evaluate-path/-/babel-helper-evaluate-path-0.2.0.tgz",
+      "integrity": "sha512-0EK9TUKMxHL549hWDPkQoS7R0Ozg1CDLheVBHYds2B2qoAvmr9ejY3zOXFsrICK73TN7bPhU14PBeKc8jcBTwg=="
+    },
+    "babel-helper-explode-assignable-expression": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-explode-assignable-expression/-/babel-helper-explode-assignable-expression-6.24.1.tgz",
+      "integrity": "sha1-8luCz33BBDPFX3BZLVdGQArCLKo="
+    },
+    "babel-helper-explode-class": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-explode-class/-/babel-helper-explode-class-6.24.1.tgz",
+      "integrity": "sha1-fcKjkQ3uAHBW4eMdZAztPVTqqes="
+    },
+    "babel-helper-flip-expressions": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-helper-flip-expressions/-/babel-helper-flip-expressions-0.2.0.tgz",
+      "integrity": "sha512-rAsPA1pWBc7e2E6HepkP2e1sXugT+Oq/VCqhyuHJ8aJ2d/ifwnJfd4Qxjm21qlW43AN8tqaeByagKK6wECFMSw=="
+    },
+    "babel-helper-function-name": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-function-name/-/babel-helper-function-name-6.24.1.tgz",
+      "integrity": "sha1-00dbjAPtmCQqJbSDUasYOZ01gKk="
+    },
+    "babel-helper-get-function-arity": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-get-function-arity/-/babel-helper-get-function-arity-6.24.1.tgz",
+      "integrity": "sha1-j3eCqpNAfEHTqlCQj4mwMbG2hT0="
+    },
+    "babel-helper-hoist-variables": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-hoist-variables/-/babel-helper-hoist-variables-6.24.1.tgz",
+      "integrity": "sha1-HssnaJydJVE+rbyZFKc/VAi+enY="
+    },
+    "babel-helper-is-nodes-equiv": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-is-nodes-equiv/-/babel-helper-is-nodes-equiv-0.0.1.tgz",
+      "integrity": "sha1-NOmzALFHnd2Y7HfqC76TQt/jloQ="
+    },
+    "babel-helper-is-void-0": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-helper-is-void-0/-/babel-helper-is-void-0-0.2.0.tgz",
+      "integrity": "sha512-Axj1AYuD0E3Dl7nT3KxROP7VekEofz3XtEljzURf3fABalLpr8PamtgLFt+zuxtaCxRf9iuZmbAMMYWri5Bazw=="
+    },
+    "babel-helper-mark-eval-scopes": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-helper-mark-eval-scopes/-/babel-helper-mark-eval-scopes-0.2.0.tgz",
+      "integrity": "sha512-KJuwrOUcHbvbh6he4xRXZFLaivK9DF9o3CrvpWnK1Wp0B+1ANYABXBMgwrnNFIDK/AvicxQ9CNr8wsgivlp4Aw=="
+    },
+    "babel-helper-optimise-call-expression": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-optimise-call-expression/-/babel-helper-optimise-call-expression-6.24.1.tgz",
+      "integrity": "sha1-96E0J7qfc/j0+pk8VKl4gtEkQlc="
+    },
+    "babel-helper-regex": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-helper-regex/-/babel-helper-regex-6.26.0.tgz",
+      "integrity": "sha1-MlxZ+QL4LyS3T6zu0DY5VPZJXnI="
+    },
+    "babel-helper-remap-async-to-generator": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-remap-async-to-generator/-/babel-helper-remap-async-to-generator-6.24.1.tgz",
+      "integrity": "sha1-XsWBgnrXI/7N04HxySg5BnbkVRs="
+    },
+    "babel-helper-remove-or-void": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-helper-remove-or-void/-/babel-helper-remove-or-void-0.2.0.tgz",
+      "integrity": "sha512-1Z41upf/XR+PwY7Nd+F15Jo5BiQi5205ZXUuKed3yoyQgDkMyoM7vAdjEJS/T+M6jy32sXjskMUgms4zeiVtRA=="
+    },
+    "babel-helper-replace-supers": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-replace-supers/-/babel-helper-replace-supers-6.24.1.tgz",
+      "integrity": "sha1-v22/5Dk40XNpohPKiov3S2qQqxo="
+    },
+    "babel-helper-to-multiple-sequence-expressions": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-helper-to-multiple-sequence-expressions/-/babel-helper-to-multiple-sequence-expressions-0.2.0.tgz",
+      "integrity": "sha512-ij9lpfdP3+Zc/7kNwa+NXbTrUlsYEWPwt/ugmQO0qflzLrveTIkbfOqQztvitk81aG5NblYDQXDlRohzu3oa8Q=="
+    },
     "babel-helpers": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-helpers/-/babel-helpers-6.24.1.tgz",
       "integrity": "sha1-NHHenK7DiOXIUOWX5Yom3fN2ArI="
     },
     "babel-jest": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-21.0.0.tgz",
-      "integrity": "sha512-MfZq0KK4tB7V3bCSHrzBa/F8lkhAjnG40asnaBHXdeOiFSOH7eTcVlU4pNz2jsdqclqhc0kO2mkGajKlZRqBKQ=="
+      "version": "21.0.2",
+      "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-21.0.2.tgz",
+      "integrity": "sha512-7nF+URWcIVX3A9DiLRcuwq86a+Phl+wXN/fwlSO4boTP/GmLLVyIQTui3th7tbA8F3L5xkYEO0e3NSf7oB/BJQ=="
+    },
+    "babel-loader": {
+      "version": "7.1.2",
+      "resolved": "https://registry.npmjs.org/babel-loader/-/babel-loader-7.1.2.tgz",
+      "integrity": "sha512-jRwlFbINAeyDStqK6Dd5YuY0k5YuzQUvlz2ZamuXrXmxav3pNqe9vfJ402+2G+OmlJSXxCOpB6Uz0INM7RQe2A=="
     },
     "babel-messages": {
       "version": "6.23.0",
       "resolved": "https://registry.npmjs.org/babel-messages/-/babel-messages-6.23.0.tgz",
       "integrity": "sha1-8830cDhYA1sqKVHG7F7fbGLyYw4="
     },
+    "babel-plugin-check-es2015-constants": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-check-es2015-constants/-/babel-plugin-check-es2015-constants-6.22.0.tgz",
+      "integrity": "sha1-NRV7EBQm/S/9PaP3XH0ekYNbv4o="
+    },
+    "babel-plugin-dynamic-import-node": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/babel-plugin-dynamic-import-node/-/babel-plugin-dynamic-import-node-1.0.2.tgz",
+      "integrity": "sha1-rbW8j0iokxFUA5WunwzD7UsQuy4="
+    },
     "babel-plugin-istanbul": {
-      "version": "4.1.4",
-      "resolved": "https://registry.npmjs.org/babel-plugin-istanbul/-/babel-plugin-istanbul-4.1.4.tgz",
-      "integrity": "sha1-GN3oS/POMp/d8/QQP66SFFbY5Yc="
+      "version": "4.1.5",
+      "resolved": "https://registry.npmjs.org/babel-plugin-istanbul/-/babel-plugin-istanbul-4.1.5.tgz",
+      "integrity": "sha1-Z2DN2Xf0EdPhdbsGTyvDJ9mbK24="
     },
     "babel-plugin-jest-hoist": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-21.0.0.tgz",
-      "integrity": "sha512-Vn5qE/9mebjmdLNZkLTNCWsYS2U4dBAHOENQt5JPSVBP/kw26vy/M9H+byo4wHGF6n99dn9k4RO04DEhnjRI3Q=="
+      "version": "21.0.2",
+      "resolved": "https://registry.npmjs.org/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-21.0.2.tgz",
+      "integrity": "sha512-iQeYbiM0lr5TCW42qvGkBBoy0rTx6SPppRFT7NwvdnSwNOGMI8+1Oc27SF5wJbCvAY7x5KScP3f0TKtunl+NRw=="
+    },
+    "babel-plugin-minify-builtins": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-minify-builtins/-/babel-plugin-minify-builtins-0.2.0.tgz",
+      "integrity": "sha512-4i+8ntaS8gwVUcOz5y+zE+55OVOl2nTbmHV51D4wAIiKcRI8U5K//ip1GHfhsgk/NJrrHK7h97Oy5jpqt0Iixg=="
+    },
+    "babel-plugin-minify-constant-folding": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-minify-constant-folding/-/babel-plugin-minify-constant-folding-0.2.0.tgz",
+      "integrity": "sha512-B3ffQBEUQ8ydlIkYv2MkZtTCbV7FAkWAV7NkyhcXlGpD10PaCxNGQ/B9oguXGowR1m16Q5nGhvNn8Pkn1MO6Hw=="
+    },
+    "babel-plugin-minify-dead-code-elimination": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-minify-dead-code-elimination/-/babel-plugin-minify-dead-code-elimination-0.2.0.tgz",
+      "integrity": "sha512-zE7y3pRyzA4zK5nBou0kTcwUTSQ/AiFrynt1cIEYN7vcO2gS9ZFZoI0aO9JYLUdct5fsC1vfB35408yrzTyVfg=="
+    },
+    "babel-plugin-minify-flip-comparisons": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-minify-flip-comparisons/-/babel-plugin-minify-flip-comparisons-0.2.0.tgz",
+      "integrity": "sha512-QOqXSEmD/LhT3LpM1WCyzAGcQZYYKJF7oOHvS6QbpomHenydrV53DMdPX2mK01icBExKZcJAHF209wvDBa+CSg=="
+    },
+    "babel-plugin-minify-guarded-expressions": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-minify-guarded-expressions/-/babel-plugin-minify-guarded-expressions-0.2.0.tgz",
+      "integrity": "sha512-5+NSPdRQ9mnrHaA+zFj+D5OzmSiv90EX5zGH6cWQgR/OUqmCHSDqgTRPFvOctgpo8MJyO7Rt7ajs2UfLnlAwYg=="
+    },
+    "babel-plugin-minify-infinity": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-minify-infinity/-/babel-plugin-minify-infinity-0.2.0.tgz",
+      "integrity": "sha512-U694vrla1lN6vDHWGrR832t3a/A2eh+kyl019LxEE2+sS4VTydyOPRsAOIYAdJegWRA4cMX1lm9azAN0cLIr8g=="
+    },
+    "babel-plugin-minify-mangle-names": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-minify-mangle-names/-/babel-plugin-minify-mangle-names-0.2.0.tgz",
+      "integrity": "sha512-Gixuak1/CO7VCdjn15/8Bxe/QsAtDG4zPbnsNoe1mIJGCIH/kcmSjFhMlGJtXDQZd6EKzeMfA5WmX9+jvGRefw=="
+    },
+    "babel-plugin-minify-numeric-literals": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-minify-numeric-literals/-/babel-plugin-minify-numeric-literals-0.2.0.tgz",
+      "integrity": "sha512-VcLpb+r1YS7+RIOXdRsFVLLqoh22177USpHf+JM/g1nZbzdqENmfd5v534MLAbRErhbz6SyK+NQViVzVtBxu8g=="
+    },
+    "babel-plugin-minify-replace": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-minify-replace/-/babel-plugin-minify-replace-0.2.0.tgz",
+      "integrity": "sha512-SEW6zoSVxh3OH6E1LCgyhhTWMnCv+JIRu5h5IlJDA11tU4ZeSF7uPQcO4vN/o52+FssRB26dmzJ/8D+z0QPg5Q=="
+    },
+    "babel-plugin-minify-simplify": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-minify-simplify/-/babel-plugin-minify-simplify-0.2.0.tgz",
+      "integrity": "sha512-Mj3Mwy2zVosMfXDWXZrQH5/uMAyfJdmDQ1NVqit+ArbHC3LlXVzptuyC1JxTyai/wgFvjLaichm/7vSUshkWqw=="
+    },
+    "babel-plugin-minify-type-constructors": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-minify-type-constructors/-/babel-plugin-minify-type-constructors-0.2.0.tgz",
+      "integrity": "sha512-NiOvvA9Pq6bki6nP4BayXwT5GZadw7DJFDDzHmkpnOQpENWe8RtHtKZM44MG1R6EQ5XxgbLdsdhswIzTkFlO5g=="
+    },
+    "babel-plugin-react-docgen": {
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-react-docgen/-/babel-plugin-react-docgen-1.7.0.tgz",
+      "integrity": "sha512-0Pw0sdu3W+NfVS048dqMetujQH6gXxCgd2tQGmUmgP/iNNlSbd7aDFj0e8xDmuZQRMy6UNC29zhMpnJJ0xc5BQ=="
+    },
+    "babel-plugin-syntax-async-functions": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-async-functions/-/babel-plugin-syntax-async-functions-6.13.0.tgz",
+      "integrity": "sha1-ytnK0RkbWtY0vzCuCHI5HgZHvpU="
+    },
+    "babel-plugin-syntax-async-generators": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-async-generators/-/babel-plugin-syntax-async-generators-6.13.0.tgz",
+      "integrity": "sha1-a8lj67FuzLrmuStZbrfzXDQqi5o="
+    },
+    "babel-plugin-syntax-class-constructor-call": {
+      "version": "6.18.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-class-constructor-call/-/babel-plugin-syntax-class-constructor-call-6.18.0.tgz",
+      "integrity": "sha1-nLnTn+Q8hgC+yBRkVt3L1OGnZBY="
+    },
+    "babel-plugin-syntax-class-properties": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-class-properties/-/babel-plugin-syntax-class-properties-6.13.0.tgz",
+      "integrity": "sha1-1+sjt5oxf4VDlixQW4J8fWysJ94="
+    },
+    "babel-plugin-syntax-decorators": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-decorators/-/babel-plugin-syntax-decorators-6.13.0.tgz",
+      "integrity": "sha1-MSVjtNvePMgGzuPkFszurd0RrAs="
+    },
+    "babel-plugin-syntax-do-expressions": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-do-expressions/-/babel-plugin-syntax-do-expressions-6.13.0.tgz",
+      "integrity": "sha1-V0d1YTmqJtOQ0JQQsDdEugfkeW0="
+    },
+    "babel-plugin-syntax-dynamic-import": {
+      "version": "6.18.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-dynamic-import/-/babel-plugin-syntax-dynamic-import-6.18.0.tgz",
+      "integrity": "sha1-jWomIpyDdFqZgqRBBRVyyqF5sdo="
+    },
+    "babel-plugin-syntax-exponentiation-operator": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-exponentiation-operator/-/babel-plugin-syntax-exponentiation-operator-6.13.0.tgz",
+      "integrity": "sha1-nufoM3KQ2pUoggGmpX9BcDF4MN4="
+    },
+    "babel-plugin-syntax-export-extensions": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-export-extensions/-/babel-plugin-syntax-export-extensions-6.13.0.tgz",
+      "integrity": "sha1-cKFITw+QiaToStRLrDU8lbmxJyE="
+    },
+    "babel-plugin-syntax-flow": {
+      "version": "6.18.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-flow/-/babel-plugin-syntax-flow-6.18.0.tgz",
+      "integrity": "sha1-TDqyCiryaqIM0lmVw5jE63AxDI0="
+    },
+    "babel-plugin-syntax-function-bind": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-function-bind/-/babel-plugin-syntax-function-bind-6.13.0.tgz",
+      "integrity": "sha1-SMSV8Xe98xqYHnMvVa3AvdJgH0Y="
+    },
+    "babel-plugin-syntax-jsx": {
+      "version": "6.18.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz",
+      "integrity": "sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY="
+    },
+    "babel-plugin-syntax-object-rest-spread": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz",
+      "integrity": "sha1-/WU28rzhODb/o6VFjEkDpZe7O/U="
+    },
+    "babel-plugin-syntax-trailing-function-commas": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-trailing-function-commas/-/babel-plugin-syntax-trailing-function-commas-6.22.0.tgz",
+      "integrity": "sha1-ugNgk3+NBuQBgKQ/4NVhb/9TLPM="
+    },
+    "babel-plugin-transform-async-generator-functions": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-async-generator-functions/-/babel-plugin-transform-async-generator-functions-6.24.1.tgz",
+      "integrity": "sha1-8FiQAUX9PpkHpt3yjaWfIVJYpds="
+    },
+    "babel-plugin-transform-async-to-generator": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-async-to-generator/-/babel-plugin-transform-async-to-generator-6.24.1.tgz",
+      "integrity": "sha1-ZTbjeK/2yx1VF6wOQOs+n8jQh2E="
+    },
+    "babel-plugin-transform-class-constructor-call": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-class-constructor-call/-/babel-plugin-transform-class-constructor-call-6.24.1.tgz",
+      "integrity": "sha1-gNwoVQWsBn3LjWxl4vbxGrd2Xvk="
+    },
+    "babel-plugin-transform-class-properties": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-class-properties/-/babel-plugin-transform-class-properties-6.24.1.tgz",
+      "integrity": "sha1-anl2PqYdM9NvN7YRqp3vgagbRqw="
+    },
+    "babel-plugin-transform-decorators": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-decorators/-/babel-plugin-transform-decorators-6.24.1.tgz",
+      "integrity": "sha1-eIAT2PjGtSIr33s0Q5Df13Vp4k0="
+    },
+    "babel-plugin-transform-do-expressions": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-do-expressions/-/babel-plugin-transform-do-expressions-6.22.0.tgz",
+      "integrity": "sha1-KMyvkoEtlJws0SgfaQyP3EaK6bs="
+    },
+    "babel-plugin-transform-es2015-arrow-functions": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-arrow-functions/-/babel-plugin-transform-es2015-arrow-functions-6.22.0.tgz",
+      "integrity": "sha1-RSaSy3EdX3ncf4XkQM5BufJE0iE="
+    },
+    "babel-plugin-transform-es2015-block-scoped-functions": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-block-scoped-functions/-/babel-plugin-transform-es2015-block-scoped-functions-6.22.0.tgz",
+      "integrity": "sha1-u8UbSflk1wy42OC5ToICRs46YUE="
+    },
+    "babel-plugin-transform-es2015-block-scoping": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-block-scoping/-/babel-plugin-transform-es2015-block-scoping-6.26.0.tgz",
+      "integrity": "sha1-1w9SmcEwjQXBL0Y4E7CgnnOxiV8="
+    },
+    "babel-plugin-transform-es2015-classes": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-classes/-/babel-plugin-transform-es2015-classes-6.24.1.tgz",
+      "integrity": "sha1-WkxYpQyclGHlZLSyo7+ryXolhNs="
+    },
+    "babel-plugin-transform-es2015-computed-properties": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-computed-properties/-/babel-plugin-transform-es2015-computed-properties-6.24.1.tgz",
+      "integrity": "sha1-b+Ko0WiV1WNPTNmZttNICjCBWbM="
+    },
+    "babel-plugin-transform-es2015-destructuring": {
+      "version": "6.23.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-destructuring/-/babel-plugin-transform-es2015-destructuring-6.23.0.tgz",
+      "integrity": "sha1-mXux8auWf2gtKwh2/jWNYOdlxW0="
+    },
+    "babel-plugin-transform-es2015-duplicate-keys": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-duplicate-keys/-/babel-plugin-transform-es2015-duplicate-keys-6.24.1.tgz",
+      "integrity": "sha1-c+s9MQypaePvnskcU3QabxV2Qj4="
+    },
+    "babel-plugin-transform-es2015-for-of": {
+      "version": "6.23.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-for-of/-/babel-plugin-transform-es2015-for-of-6.23.0.tgz",
+      "integrity": "sha1-9HyVsrYT3x0+zC/bdXNiPHUkhpE="
+    },
+    "babel-plugin-transform-es2015-function-name": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-function-name/-/babel-plugin-transform-es2015-function-name-6.24.1.tgz",
+      "integrity": "sha1-g0yJhTvDaxrw86TF26qU/Y6sqos="
+    },
+    "babel-plugin-transform-es2015-literals": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-literals/-/babel-plugin-transform-es2015-literals-6.22.0.tgz",
+      "integrity": "sha1-T1SgLWzWbPkVKAAZox0xklN3yi4="
+    },
+    "babel-plugin-transform-es2015-modules-amd": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-modules-amd/-/babel-plugin-transform-es2015-modules-amd-6.24.1.tgz",
+      "integrity": "sha1-Oz5UAXI5hC1tGcMBHEvS8AoA0VQ="
     },
     "babel-plugin-transform-es2015-modules-commonjs": {
       "version": "6.26.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-modules-commonjs/-/babel-plugin-transform-es2015-modules-commonjs-6.26.0.tgz",
       "integrity": "sha1-DYOUApt9xqvhqX7xgeAHWN0uXYo="
     },
+    "babel-plugin-transform-es2015-modules-systemjs": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-modules-systemjs/-/babel-plugin-transform-es2015-modules-systemjs-6.24.1.tgz",
+      "integrity": "sha1-/4mhQrkRmpBhlfXxBuzzBdlAfSM="
+    },
+    "babel-plugin-transform-es2015-modules-umd": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-modules-umd/-/babel-plugin-transform-es2015-modules-umd-6.24.1.tgz",
+      "integrity": "sha1-rJl+YoXNGO1hdq22B9YCNErThGg="
+    },
+    "babel-plugin-transform-es2015-object-super": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-object-super/-/babel-plugin-transform-es2015-object-super-6.24.1.tgz",
+      "integrity": "sha1-JM72muIcuDp/hgPa0CH1cusnj40="
+    },
+    "babel-plugin-transform-es2015-parameters": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-parameters/-/babel-plugin-transform-es2015-parameters-6.24.1.tgz",
+      "integrity": "sha1-V6w1GrScrxSpfNE7CfZv3wpiXys="
+    },
+    "babel-plugin-transform-es2015-shorthand-properties": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-shorthand-properties/-/babel-plugin-transform-es2015-shorthand-properties-6.24.1.tgz",
+      "integrity": "sha1-JPh11nIch2YbvZmkYi5R8U3jiqA="
+    },
+    "babel-plugin-transform-es2015-spread": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-spread/-/babel-plugin-transform-es2015-spread-6.22.0.tgz",
+      "integrity": "sha1-1taKmfia7cRTbIGlQujdnxdG+NE="
+    },
+    "babel-plugin-transform-es2015-sticky-regex": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-sticky-regex/-/babel-plugin-transform-es2015-sticky-regex-6.24.1.tgz",
+      "integrity": "sha1-AMHNsaynERLN8M9hJsLta0V8zbw="
+    },
+    "babel-plugin-transform-es2015-template-literals": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-template-literals/-/babel-plugin-transform-es2015-template-literals-6.22.0.tgz",
+      "integrity": "sha1-qEs0UPfp+PH2g51taH2oS7EjbY0="
+    },
+    "babel-plugin-transform-es2015-typeof-symbol": {
+      "version": "6.23.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-typeof-symbol/-/babel-plugin-transform-es2015-typeof-symbol-6.23.0.tgz",
+      "integrity": "sha1-3sCfHN3/lLUqxz1QXITfWdzOs3I="
+    },
+    "babel-plugin-transform-es2015-unicode-regex": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-unicode-regex/-/babel-plugin-transform-es2015-unicode-regex-6.24.1.tgz",
+      "integrity": "sha1-04sS9C6nMj9yk4fxinxa4frrNek=",
+      "dependencies": {
+        "regexpu-core": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-2.0.0.tgz",
+          "integrity": "sha1-SdA4g3uNz4v6W5pCE5k45uoq4kA="
+        }
+      }
+    },
+    "babel-plugin-transform-exponentiation-operator": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-exponentiation-operator/-/babel-plugin-transform-exponentiation-operator-6.24.1.tgz",
+      "integrity": "sha1-KrDJx/MJj6SJB3cruBP+QejeOg4="
+    },
+    "babel-plugin-transform-export-extensions": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-export-extensions/-/babel-plugin-transform-export-extensions-6.22.0.tgz",
+      "integrity": "sha1-U3OLR+deghhYnuqUbLvTkQm75lM="
+    },
+    "babel-plugin-transform-flow-strip-types": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-flow-strip-types/-/babel-plugin-transform-flow-strip-types-6.22.0.tgz",
+      "integrity": "sha1-hMtnKTXUNxT9wyvOhFaNh0Qc988="
+    },
+    "babel-plugin-transform-function-bind": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-function-bind/-/babel-plugin-transform-function-bind-6.22.0.tgz",
+      "integrity": "sha1-xvuOlqwpajELjPjqQBRiQH3fapc="
+    },
+    "babel-plugin-transform-inline-consecutive-adds": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-inline-consecutive-adds/-/babel-plugin-transform-inline-consecutive-adds-0.2.0.tgz",
+      "integrity": "sha512-GlhOuLOQ28ua9prg0hT33HslCrEmz9xWXy9ZNZSACppCyRxxRW+haYtRgm7uYXCcd0q8ggCWD2pfWEJp5iiZfQ=="
+    },
+    "babel-plugin-transform-member-expression-literals": {
+      "version": "6.8.5",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-member-expression-literals/-/babel-plugin-transform-member-expression-literals-6.8.5.tgz",
+      "integrity": "sha512-Ux3ligf+ukzWaCbBYOstDuFBhRgMiJHlpJBKV4P47qtzVkd0lg1ddPj9fqIJqAM0n+CvxipyrZrnNnw3CdtQCg=="
+    },
+    "babel-plugin-transform-merge-sibling-variables": {
+      "version": "6.8.6",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-merge-sibling-variables/-/babel-plugin-transform-merge-sibling-variables-6.8.6.tgz",
+      "integrity": "sha512-o5Jioq553HtEAUN5uty7ELJMenXIxHI3PIs1yLqYWYQwP6mg6IPVAJ+U7i4zr9XGF/kb2RGsdehglGTV+vngqA=="
+    },
+    "babel-plugin-transform-minify-booleans": {
+      "version": "6.8.3",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-minify-booleans/-/babel-plugin-transform-minify-booleans-6.8.3.tgz",
+      "integrity": "sha512-bPbUhkeN2Nc0KH0/A19GwQGj8w+CvdJzyu8t59VoEDgsNMQ9Bopzi5DrVkrSsVjbYUaZpzq/DYLrH+wD5K2Tig=="
+    },
+    "babel-plugin-transform-object-rest-spread": {
+      "version": "6.23.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-object-rest-spread/-/babel-plugin-transform-object-rest-spread-6.23.0.tgz",
+      "integrity": "sha1-h11ryb52HFiirj/u5dxIldjH+SE="
+    },
+    "babel-plugin-transform-property-literals": {
+      "version": "6.8.5",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-property-literals/-/babel-plugin-transform-property-literals-6.8.5.tgz",
+      "integrity": "sha512-MmiQsQ5AcIaRZMJD0zY5C4H3xuHm06/nWgtOsz7AXV44VEIXIlPiJ39IFYJ4Qx67/fEm8zJAedzR8t+B7d10Bg=="
+    },
+    "babel-plugin-transform-react-constant-elements": {
+      "version": "6.23.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-react-constant-elements/-/babel-plugin-transform-react-constant-elements-6.23.0.tgz",
+      "integrity": "sha1-LxGb9NLN1F65uqrldAU8YE9hR90="
+    },
+    "babel-plugin-transform-react-display-name": {
+      "version": "6.25.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-react-display-name/-/babel-plugin-transform-react-display-name-6.25.0.tgz",
+      "integrity": "sha1-Z+K/Hx6ck6sI25Z5LgU5K/LMKNE="
+    },
+    "babel-plugin-transform-react-jsx": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-react-jsx/-/babel-plugin-transform-react-jsx-6.24.1.tgz",
+      "integrity": "sha1-hAoCjn30YN/DotKfDA2R9jduZqM="
+    },
+    "babel-plugin-transform-react-jsx-self": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-react-jsx-self/-/babel-plugin-transform-react-jsx-self-6.22.0.tgz",
+      "integrity": "sha1-322AqdomEqEh5t3XVYvL7PBuY24="
+    },
+    "babel-plugin-transform-react-jsx-source": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-react-jsx-source/-/babel-plugin-transform-react-jsx-source-6.22.0.tgz",
+      "integrity": "sha1-ZqwSFT9c0tF7PBkmj0vwGX9E7NY="
+    },
+    "babel-plugin-transform-regenerator": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-regenerator/-/babel-plugin-transform-regenerator-6.26.0.tgz",
+      "integrity": "sha1-4HA2lvveJ/Cj78rPi03KL3s6jy8="
+    },
+    "babel-plugin-transform-regexp-constructors": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-regexp-constructors/-/babel-plugin-transform-regexp-constructors-0.2.0.tgz",
+      "integrity": "sha512-7IsQ6aQx6LAaOqy97/PthTf+5Nx9grZww3r6E62IdWe76Yr8KsuwVjxzqSPQvESJqTE3EMADQ9S0RtwWDGNG9Q=="
+    },
+    "babel-plugin-transform-remove-console": {
+      "version": "6.8.5",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-remove-console/-/babel-plugin-transform-remove-console-6.8.5.tgz",
+      "integrity": "sha512-uuCKvtweCyIvvC8fi92EcWRtO2Kt5KMNMRK6BhpDXdeb3sxvGM7453RSmgeu4DlKns3OlvY9Ep5Q9m5a7RQAgg=="
+    },
+    "babel-plugin-transform-remove-debugger": {
+      "version": "6.8.5",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-remove-debugger/-/babel-plugin-transform-remove-debugger-6.8.5.tgz",
+      "integrity": "sha512-InDQDdHPOLJKM+G6oXrEesf+P29QFBmcTXID+TAvZziVz+38xe2VO/Bn3FcRcRtnOOycbgsJkUNp9jIK+ist6g=="
+    },
+    "babel-plugin-transform-remove-undefined": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-remove-undefined/-/babel-plugin-transform-remove-undefined-0.2.0.tgz",
+      "integrity": "sha512-O8v57tPMHkp89kA4ZfQEYds/pzgvz/QYerBJjIuL5/Jc7RnvMVRA5gJY9zFKP7WayW8WOSBV4vh8Y8FJRio+ow=="
+    },
+    "babel-plugin-transform-runtime": {
+      "version": "6.23.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-runtime/-/babel-plugin-transform-runtime-6.23.0.tgz",
+      "integrity": "sha1-iEkNRGUC6puOfvsP4J7E2ZR5se4="
+    },
+    "babel-plugin-transform-simplify-comparison-operators": {
+      "version": "6.8.5",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-simplify-comparison-operators/-/babel-plugin-transform-simplify-comparison-operators-6.8.5.tgz",
+      "integrity": "sha512-B3HlBZb+Uq86nRj5yNPO6pJ3noEdqHvzYkEYoUWtrsWTv48ZIRatYlumoOiif/v8llF13YjYjx9zhyznDx+N9g=="
+    },
     "babel-plugin-transform-strict-mode": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-strict-mode/-/babel-plugin-transform-strict-mode-6.24.1.tgz",
       "integrity": "sha1-1fr3qleKZbvlkc9e2uBKDGcCB1g="
     },
+    "babel-plugin-transform-undefined-to-void": {
+      "version": "6.8.3",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-undefined-to-void/-/babel-plugin-transform-undefined-to-void-6.8.3.tgz",
+      "integrity": "sha512-goYwp8dMrzHD6x9GjZ2M85Mk2vxf1h85CnUgAjfftUnlJvzF4uj5MrbReHBTbjQ96C8CuRzvhYZ3tv8H3Sc1ZA=="
+    },
+    "babel-preset-env": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/babel-preset-env/-/babel-preset-env-1.6.0.tgz",
+      "integrity": "sha512-OVgtQRuOZKckrILgMA5rvctvFZPv72Gua9Rt006AiPoB0DJKGN07UmaQA+qRrYgK71MVct8fFhT0EyNWYorVew==",
+      "dependencies": {
+        "browserslist": {
+          "version": "2.4.0",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.4.0.tgz",
+          "integrity": "sha512-aM2Gt4x9bVlCUteADBS6JP0F+2tMWKM1jQzUulVROtdFWFIcIVvY76AJbr7GDqy0eDhn+PcnpzzivGxY4qiaKQ=="
+        },
+        "semver": {
+          "version": "5.4.1",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
+          "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg=="
+        }
+      }
+    },
+    "babel-preset-flow": {
+      "version": "6.23.0",
+      "resolved": "https://registry.npmjs.org/babel-preset-flow/-/babel-preset-flow-6.23.0.tgz",
+      "integrity": "sha1-5xIYiHCFrpoktb5Baa/7WZgWxJ0="
+    },
     "babel-preset-jest": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/babel-preset-jest/-/babel-preset-jest-21.0.0.tgz",
-      "integrity": "sha512-AFTR98CHu62hdQgNyHyvbapM2Ke0ETqZKgIBd26cLCu2HNs6BIeF4HbqosfICHJAF2lFHkTz6d3xHrolsQ9Lcw=="
+      "version": "21.0.2",
+      "resolved": "https://registry.npmjs.org/babel-preset-jest/-/babel-preset-jest-21.0.2.tgz",
+      "integrity": "sha512-WyzCFIoU+ga307hPnobHL9eRrZlpZYHQf7M3yOtimAwrLAgNFoSfin7ZVw903+zz81ZLuowZMKWCd0w3PNpAhg=="
+    },
+    "babel-preset-minify": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-preset-minify/-/babel-preset-minify-0.2.0.tgz",
+      "integrity": "sha512-mR8Q44RmMzm18bM2Lqd9uiPopzk5GDCtVuquNbLFmX6lOKnqWoenaNBxnWW0UhBFC75lEHTIgNGCbnsRI0pJVw=="
+    },
+    "babel-preset-react": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-preset-react/-/babel-preset-react-6.24.1.tgz",
+      "integrity": "sha1-umnfrqRfw+xjm2pOzqbhdwLJE4A="
+    },
+    "babel-preset-react-app": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/babel-preset-react-app/-/babel-preset-react-app-3.0.2.tgz",
+      "integrity": "sha512-UwRU1ppOl1JQEXnCXy8aFsKtvSkn1pNQULveOGZsytfrlHUYu9gU+D+zPYY6yMcAtbvQ4hFs+uA0bpPNwR9++Q==",
+      "dependencies": {
+        "babel-plugin-transform-regenerator": {
+          "version": "6.24.1",
+          "resolved": "https://registry.npmjs.org/babel-plugin-transform-regenerator/-/babel-plugin-transform-regenerator-6.24.1.tgz",
+          "integrity": "sha1-uNowWtQ8PJm0hI5P5AN7dw0jxBg="
+        },
+        "babel-preset-env": {
+          "version": "1.5.2",
+          "resolved": "https://registry.npmjs.org/babel-preset-env/-/babel-preset-env-1.5.2.tgz",
+          "integrity": "sha1-zUrpCm6Utwn5c3SzPl+LmDVWre8="
+        },
+        "browserslist": {
+          "version": "2.4.0",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.4.0.tgz",
+          "integrity": "sha512-aM2Gt4x9bVlCUteADBS6JP0F+2tMWKM1jQzUulVROtdFWFIcIVvY76AJbr7GDqy0eDhn+PcnpzzivGxY4qiaKQ=="
+        },
+        "regenerator-transform": {
+          "version": "0.9.11",
+          "resolved": "https://registry.npmjs.org/regenerator-transform/-/regenerator-transform-0.9.11.tgz",
+          "integrity": "sha1-On0GdSDLe3F2dp61/4aGkb7+EoM="
+        },
+        "semver": {
+          "version": "5.4.1",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
+          "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg=="
+        }
+      }
+    },
+    "babel-preset-stage-0": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-preset-stage-0/-/babel-preset-stage-0-6.24.1.tgz",
+      "integrity": "sha1-VkLRUEL5E4TX5a+LyIsduVsDnmo="
+    },
+    "babel-preset-stage-1": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-preset-stage-1/-/babel-preset-stage-1-6.24.1.tgz",
+      "integrity": "sha1-dpLNfc1oSZB+auSgqFWJz7niv7A="
+    },
+    "babel-preset-stage-2": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-preset-stage-2/-/babel-preset-stage-2-6.24.1.tgz",
+      "integrity": "sha1-2eKWD7PXEYfw5k7sYrwHdnIZvcE="
+    },
+    "babel-preset-stage-3": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-preset-stage-3/-/babel-preset-stage-3-6.24.1.tgz",
+      "integrity": "sha1-g2raCp56f6N8sTj7kyb4eTSkg5U="
     },
     "babel-register": {
       "version": "6.26.0",
@@ -2527,31 +3491,9 @@
       "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c="
     },
     "base": {
-      "version": "0.11.1",
-      "resolved": "https://registry.npmjs.org/base/-/base-0.11.1.tgz",
-      "integrity": "sha1-s2p/ERE4U6NCoVaR2Y4tzIpswnA=",
-      "dependencies": {
-        "define-property": {
-          "version": "0.2.5",
-          "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
-          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY="
-        },
-        "is-descriptor": {
-          "version": "0.1.6",
-          "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
-          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
-        },
-        "isobject": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
-          "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk="
-        },
-        "kind-of": {
-          "version": "5.0.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
-          "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
-        }
-      }
+      "version": "0.11.2",
+      "resolved": "https://registry.npmjs.org/base/-/base-0.11.2.tgz",
+      "integrity": "sha512-5T6P4xPgpp0YDFvSWwEZ4NoE3aM4QBQXDzmVbraCkFj8zHM+mba8SyqB5DbZWyR7mYHo6Y7BdQo3MoA4m0TeQg=="
     },
     "base64-arraybuffer": {
       "version": "0.1.5",
@@ -2585,9 +3527,14 @@
       "integrity": "sha1-QIZrnhueC1W0gYlDEeaPr/rrxSI="
     },
     "big.js": {
-      "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/big.js/-/big.js-3.1.3.tgz",
-      "integrity": "sha1-TK2iGTZS6zyp7I5VyQFWacmAaXg="
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/big.js/-/big.js-3.2.0.tgz",
+      "integrity": "sha512-+hN/Zh2D08Mx65pZ/4g5bsmNiZUuChDiQfTUQ7qJr4/kuopCr88xZsAXv6mBoZEsUI4OuGHlX59qE94K2mMW8Q=="
+    },
+    "binary": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/binary/-/binary-0.3.0.tgz",
+      "integrity": "sha1-n2BVO8XOjDOG87VTz/R0Yq3sqnk="
     },
     "binary-extensions": {
       "version": "1.10.0",
@@ -2615,19 +3562,19 @@
       "integrity": "sha512-ItfYfPLkWHUjckQCk8xC+LwxgK8NYcXywGigJgSwOP8Y2iyWT4f2vsZnoOXTTbo+o5yXmIUJ4gn5538SO5S3gA=="
     },
     "body-parser": {
-      "version": "1.17.2",
-      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.17.2.tgz",
-      "integrity": "sha1-+IkqvI+eYn1Crtr7yma/WrmRBO4=",
+      "version": "1.18.1",
+      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.18.1.tgz",
+      "integrity": "sha512-KL2pZpGvy6xuZHgYUznB1Zfw4AoGMApfRanT5NafeLvglbaSM+4CCtmlyYOv66oYXqvKL1xpaFb94V/AZVUnYg==",
       "dependencies": {
-        "debug": {
-          "version": "2.6.7",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.7.tgz",
-          "integrity": "sha1-krrR9tBbu2u6Isyoi80OyJTChh4="
-        },
         "iconv-lite": {
-          "version": "0.4.15",
-          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.15.tgz",
-          "integrity": "sha1-/iZaIYrGpXz+hUkn6dBMGYJe3es="
+          "version": "0.4.19",
+          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.19.tgz",
+          "integrity": "sha512-oTZqweIP51xaGPI4uPa56/Pri/480R+mo7SeU+YETByQNhDG55ycFyNLIgta9vXhILrxXDmF7ZGhqZIcuN0gJQ=="
+        },
+        "qs": {
+          "version": "6.5.1",
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.5.1.tgz",
+          "integrity": "sha512-eRzhrN1WSINYCDCbrz796z37LOe3m5tmW7RQf6oBntukAG1nmovJvhnwHHRMAfeoItc1m2Hk02WER2aQ/iqs+A=="
         }
       }
     },
@@ -2668,6 +3615,11 @@
       "resolved": "https://registry.npmjs.org/braces/-/braces-2.2.2.tgz",
       "integrity": "sha1-JB+GjCsmkNn+vu5afIP7vyXQCxs="
     },
+    "brcast": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/brcast/-/brcast-3.0.1.tgz",
+      "integrity": "sha512-eI3yqf9YEqyGl9PCNTR46MGvDylGtaHjalcz6Q3fAPnP/PhpKkkve52vFdfGpwp4VUvK6LUr4TQN+2stCrEwTg=="
+    },
     "brorand": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/brorand/-/brorand-1.1.0.tgz",
@@ -2745,6 +3697,23 @@
       "resolved": "https://registry.npmjs.org/buffer-xor/-/buffer-xor-1.0.3.tgz",
       "integrity": "sha1-JuYe0UIvtw3ULm42cp7VHYVf6Nk="
     },
+    "buffers": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/buffers/-/buffers-0.1.1.tgz",
+      "integrity": "sha1-skV5w77U1tOWru5tmorn9Ugqt7s="
+    },
+    "build": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/build/-/build-0.1.4.tgz",
+      "integrity": "sha1-cH/gJv/O3crL/c3zVur9pk8VEEY=",
+      "dependencies": {
+        "uglify-js": {
+          "version": "1.3.5",
+          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-1.3.5.tgz",
+          "integrity": "sha1-S1v/+Rhu/7qoiOTJ6UvZ/EyUkp0="
+        }
+      }
+    },
     "builtin-modules": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz",
@@ -2756,14 +3725,14 @@
       "integrity": "sha1-hZgoeOIbmOHGZCXgPQF0eI9Wnug="
     },
     "bytes": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.4.0.tgz",
-      "integrity": "sha1-fZcZb51br39pNeJZhVSe3SpsIzk="
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.0.0.tgz",
+      "integrity": "sha1-0ygVQE1olpn4Wk6k+odV3ROpYEg="
     },
     "cache-base": {
-      "version": "0.8.5",
-      "resolved": "https://registry.npmjs.org/cache-base/-/cache-base-0.8.5.tgz",
-      "integrity": "sha1-YM6zUEAh7O7HAR/TOEt/TpVym/o="
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/cache-base/-/cache-base-1.0.1.tgz",
+      "integrity": "sha512-AKcdTnFSWATd5/GCPRxr2ChwIJ85CeyrEyjRHlKxQ56d4XJMGym0uAiKn0xbLOGOl3+yRpOTi484dVCEc5AUzQ=="
     },
     "callsite": {
       "version": "1.0.0",
@@ -2798,20 +3767,25 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000725",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000725.tgz",
-      "integrity": "sha1-IPIxPXlAHgL2GEDzlpi8jFWIEaY="
+      "version": "1.0.30000733",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000733.tgz",
+      "integrity": "sha1-OmJbxBx6n5nVnWRVKFfdGvDt2dQ="
     },
     "caniuse-lite": {
-      "version": "1.0.30000725",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000725.tgz",
-      "integrity": "sha1-T6ZjcjI8b/RsihugP53Nc9ehyzk="
+      "version": "1.0.30000733",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000733.tgz",
+      "integrity": "sha1-6/xIJUEXzAxmGXpFNstDl6bPvM0="
     },
     "cardinal": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/cardinal/-/cardinal-1.0.0.tgz",
       "integrity": "sha1-UOIcGwqjdyn5N33vGWtanOyTLuk="
     },
+    "case-sensitive-paths-webpack-plugin": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/case-sensitive-paths-webpack-plugin/-/case-sensitive-paths-webpack-plugin-2.1.1.tgz",
+      "integrity": "sha1-PSnO2MHxJL9vU4Rvs/WJRzH9yQk="
+    },
     "caseless": {
       "version": "0.12.0",
       "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz",
@@ -2834,6 +3808,16 @@
       "resolved": "https://registry.npmjs.org/chai/-/chai-4.1.2.tgz",
       "integrity": "sha1-D2RYS6ZC8PKs4oBiefTwbKI61zw="
     },
+    "chain-function": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/chain-function/-/chain-function-1.0.0.tgz",
+      "integrity": "sha1-DUqzfn4Y6tC9xHuSB2QRjOWHM9w="
+    },
+    "chainsaw": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/chainsaw/-/chainsaw-0.1.0.tgz",
+      "integrity": "sha1-XqtQsor+WAdNDVgpE4iCi15fvJg="
+    },
     "chalk": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
@@ -2865,9 +3849,9 @@
       "integrity": "sha512-Kkht5ye6ZGmwv40uUDZztayT2ThLQGfnj/T71N/XzeZeo3nf8foyW7zGTsPYkEya3m5f3cAypH+qe7YOrM1U2Q=="
     },
     "clap": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/clap/-/clap-1.2.0.tgz",
-      "integrity": "sha1-WckP4+E3EEdG/xlGmiemNP9oyFc=",
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/clap/-/clap-1.2.2.tgz",
+      "integrity": "sha1-aD9vk6MgeU0Sk4bXSyodLWb+3n4=",
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -2900,14 +3884,14 @@
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
           "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
-        },
-        "kind-of": {
-          "version": "5.0.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
-          "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
         }
       }
     },
+    "classnames": {
+      "version": "2.2.5",
+      "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.2.5.tgz",
+      "integrity": "sha1-+zgB1FNGdknvNgPH1hoCvRKb3m0="
+    },
     "cli-table": {
       "version": "0.3.1",
       "resolved": "https://registry.npmjs.org/cli-table/-/cli-table-0.3.1.tgz",
@@ -2975,9 +3959,9 @@
       "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c="
     },
     "collection-visit": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/collection-visit/-/collection-visit-0.2.3.tgz",
-      "integrity": "sha1-L2JIPK7MlfCDuaRUo+6eYTmteVc="
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/collection-visit/-/collection-visit-1.0.0.tgz",
+      "integrity": "sha1-S8A3PBZLwykbTTaMgpzxqApZ3KA="
     },
     "color": {
       "version": "0.11.4",
@@ -3029,6 +4013,16 @@
       "resolved": "https://registry.npmjs.org/commander/-/commander-2.11.0.tgz",
       "integrity": "sha512-b0553uYA5YAEGgyYIGYROzKQ7X5RAqedkfjiZxwi0kL1g3bOaBNNZfYkzt/CL0umgD5wc9Jec2FbB98CjkMRvQ=="
     },
+    "common-tags": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/common-tags/-/common-tags-1.4.0.tgz",
+      "integrity": "sha1-EYe+Tz1M8MBCfUP3Tu8fc1AWFMA="
+    },
+    "commondir": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/commondir/-/commondir-1.0.1.tgz",
+      "integrity": "sha1-3dgA2gxmEnOTzKWVDqloo6rxJTs="
+    },
     "component-bind": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/component-bind/-/component-bind-1.0.0.tgz",
@@ -3071,6 +4065,11 @@
       "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.0.tgz",
       "integrity": "sha1-CqxmL9Ur54lk1VMvaUeE5wEQrPc="
     },
+    "configstore": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.1.tgz",
+      "integrity": "sha512-5oNkD/L++l0O6xGXxb1EWS7SivtjfGQlRyxJsYgE0Z495/L81e2h4/d3r969hoPXuFItzNOKMtsXgYG4c7dYvw=="
+    },
     "connect": {
       "version": "3.6.3",
       "resolved": "https://registry.npmjs.org/connect/-/connect-3.6.3.tgz",
@@ -3102,9 +4101,9 @@
       "integrity": "sha1-DPaLud318r55YcOoUXjLhdunjLQ="
     },
     "content-type": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.2.tgz",
-      "integrity": "sha1-t9ETrueo3Se9IRM8TcJSnfFyHu0="
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.4.tgz",
+      "integrity": "sha512-hIP3EEPs8tB9AT1L+NUqtwOAps4mk2Zob89MWXMHjHWg9milF/j4osnnQLXBCBFBk/tvIG/tUc9mOUJiPBhPXA=="
     },
     "content-type-parser": {
       "version": "1.0.1",
@@ -3174,16 +4173,9 @@
       "integrity": "sha1-rLniIaThe9sHbpBlfEK5PjcmzwY="
     },
     "cross-spawn": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-3.0.1.tgz",
-      "integrity": "sha1-ElYDfsufDF9549bvE14wdwGEuYI=",
-      "dependencies": {
-        "lru-cache": {
-          "version": "4.1.1",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.1.tgz",
-          "integrity": "sha512-q4spe4KTfsAS1SUHLO0wz8Qiyf1+vMIAgpRYioFYDMNqKfHQbg+AVDH3i4fvpl71/P1L0dBl+fQi+P37UYf0ew=="
-        }
-      }
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-5.1.0.tgz",
+      "integrity": "sha1-6L0O/uWPz/b4+UUQoKVUu/ojVEk="
     },
     "cryptiles": {
       "version": "2.0.5",
@@ -3195,20 +4187,25 @@
       "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.1.tgz",
       "integrity": "sha512-Na7ZlwCOqoaW5RwUK1WpXws2kv8mNhWdTlzob0UXulk6G9BDbyiJaGTYBIX61Ozn9l1EPPJpICZb4DaOpT9NlQ=="
     },
+    "crypto-random-string": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-1.0.0.tgz",
+      "integrity": "sha1-ojD2T1aDEOFJgAmUB5DsmVRbyn4="
+    },
     "css-color-names": {
       "version": "0.0.4",
       "resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz",
       "integrity": "sha1-gIrcLnnPhHOAabZGyyDsJ762KeA="
     },
     "css-in-js-utils": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/css-in-js-utils/-/css-in-js-utils-1.0.3.tgz",
-      "integrity": "sha1-msfgL3Y8+F2UAXZmVl7WiltfMhU="
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/css-in-js-utils/-/css-in-js-utils-2.0.0.tgz",
+      "integrity": "sha512-yuWmPMD9FLi50Xf3k8W8oO3WM1eVnxEGCldCLyfusQ+CgivFk0s23yst4ooW6tfxMuSa03S6uUEga9UhX6GRrA=="
     },
     "css-loader": {
-      "version": "0.28.7",
-      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.7.tgz",
-      "integrity": "sha512-GxMpax8a/VgcfRrVy0gXD6yLd5ePYbXX/5zGgTVYp4wXtJklS8Z2VaUArJgc//f6/Dzil7BaJObdSv8eKKCPgg==",
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.27.3.tgz",
+      "integrity": "sha1-aatvR7ab+xtazuYbrCqrFDAv8Nw=",
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -3237,6 +4234,11 @@
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
         },
+        "source-list-map": {
+          "version": "0.1.8",
+          "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-0.1.8.tgz",
+          "integrity": "sha1-xVCyq1Qn9rPyH1r+rYjE9Vh7IQY="
+        },
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
@@ -3303,6 +4305,11 @@
       "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-0.1.0.tgz",
       "integrity": "sha1-yBSQPkViM3GgR3tAEJqq++6t27Q="
     },
+    "cssmin": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/cssmin/-/cssmin-0.3.2.tgz",
+      "integrity": "sha1-3c5MVHtRCuDVlKjx+/iq+OLFwA0="
+    },
     "cssnano": {
       "version": "3.10.0",
       "resolved": "https://registry.npmjs.org/cssnano/-/cssnano-3.10.0.tgz",
@@ -3372,6 +4379,11 @@
       "resolved": "https://registry.npmjs.org/custom-event/-/custom-event-1.0.1.tgz",
       "integrity": "sha1-XQKkaFCt8bSjF5RqOSj8y1v9BCU="
     },
+    "cycle": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/cycle/-/cycle-1.0.3.tgz",
+      "integrity": "sha1-IegLK+hYD5i0aPN5QwZisEbDStI="
+    },
     "d": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/d/-/d-1.0.0.tgz",
@@ -3409,10 +4421,32 @@
       "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
       "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA="
     },
+    "decompress-zip": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/decompress-zip/-/decompress-zip-0.3.0.tgz",
+      "integrity": "sha1-rjvLfjTGWHmt/nfhnDD4ZgK0vbA=",
+      "dependencies": {
+        "isarray": {
+          "version": "0.0.1",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
+        },
+        "readable-stream": {
+          "version": "1.1.14",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
+          "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk="
+        },
+        "string_decoder": {
+          "version": "0.10.31",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
+        }
+      }
+    },
     "deep-eql": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-3.0.0.tgz",
-      "integrity": "sha512-9zef2MtjASSE1Pts2Nm6Yh5MTVdVh+s4Qt/e+jPV6qTBhqTc0WOEaWnLvLKGxky0gwZGmcY6TnUqyCD6fNs5Lg=="
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-3.0.1.tgz",
+      "integrity": "sha512-+QeIQyN5ZuO+3Uk5DYh6/1eKO0m0YmJFGNmFHGACpf1ClL1nmlV/p4gNgbl2pJGxgXb4faqo6UE+M5ACEMyVcw=="
     },
     "deep-equal": {
       "version": "1.0.1",
@@ -3424,6 +4458,11 @@
       "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz",
       "integrity": "sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ="
     },
+    "default-gateway": {
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/default-gateway/-/default-gateway-2.5.0.tgz",
+      "integrity": "sha512-Mb+xi1aktPE+Uz5RmS3vU6Kr1fDqRvlMX3M5eneBai7LkldzM+WPjaUpz396taZgOgSw4s+CJGvd6VJJ/9W0dQ=="
+    },
     "default-require-extensions": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/default-require-extensions/-/default-require-extensions-1.0.0.tgz",
@@ -3447,14 +4486,7 @@
     "del": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/del/-/del-3.0.0.tgz",
-      "integrity": "sha1-U+z2mf/LyzljdpGrE7rxYIGXZuU=",
-      "dependencies": {
-        "pify": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
-          "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY="
-        }
-      }
+      "integrity": "sha1-U+z2mf/LyzljdpGrE7rxYIGXZuU="
     },
     "delayed-stream": {
       "version": "1.0.0",
@@ -3521,6 +4553,16 @@
       "resolved": "https://registry.npmjs.org/dns-txt/-/dns-txt-2.0.2.tgz",
       "integrity": "sha1-uR2Ab10nGI5Ks+fRB9iBocxGQrY="
     },
+    "doctrine": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-2.0.0.tgz",
+      "integrity": "sha1-xz2NKQnSIpHhoAejlYBNqLZl/mM="
+    },
+    "dom-helpers": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-3.2.1.tgz",
+      "integrity": "sha1-MgPgf+0he9H0JLAZc1WC/Deyglo="
+    },
     "dom-serialize": {
       "version": "2.2.1",
       "resolved": "https://registry.npmjs.org/dom-serialize/-/dom-serialize-2.2.1.tgz",
@@ -3538,6 +4580,11 @@
         }
       }
     },
+    "dom-walk": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/dom-walk/-/dom-walk-0.1.1.tgz",
+      "integrity": "sha1-ZyIm3HTI95mtNTB9+TaroRrNYBg="
+    },
     "domain-browser": {
       "version": "1.1.7",
       "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.1.7.tgz",
@@ -3558,6 +4605,11 @@
       "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.5.1.tgz",
       "integrity": "sha1-3NhIiib1Y9YQeeSMn3t+Mjc2gs8="
     },
+    "dot-prop": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-4.2.0.tgz",
+      "integrity": "sha512-tUMXrxlExSW6U2EXiiKGSBVdYgtV8qlHL+C10TsW4PURY/ic+eaysnSkwB4kA/mBlCyy/IKDJ+Lc3wbWeaXtuQ=="
+    },
     "duplexer": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz",
@@ -3580,9 +4632,9 @@
       "integrity": "sha1-zIcsFoiArjxxiXYv1f/ACJbJUYo="
     },
     "electron-to-chromium": {
-      "version": "1.3.20",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.20.tgz",
-      "integrity": "sha1-Lu3VzLrn3cVX9orR/OnBcukV5OU="
+      "version": "1.3.21",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.21.tgz",
+      "integrity": "sha1-qWfr3P6O0Ag/wkTRiUAiqOgRPqI="
     },
     "elliptic": {
       "version": "6.4.0",
@@ -3695,6 +4747,11 @@
       "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.30.tgz",
       "integrity": "sha1-cUGhaDZpfbq/qq7uQUlc4p9SyTk="
     },
+    "es5-shim": {
+      "version": "4.5.9",
+      "resolved": "https://registry.npmjs.org/es5-shim/-/es5-shim-4.5.9.tgz",
+      "integrity": "sha1-Kh4rnlg/9f7Qwgo+4svz91IwpcA="
+    },
     "es6-iterator": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.1.tgz",
@@ -3715,6 +4772,11 @@
       "resolved": "https://registry.npmjs.org/es6-set/-/es6-set-0.1.5.tgz",
       "integrity": "sha1-0rPsXU2ADO2BjbU40ol02wpzzLE="
     },
+    "es6-shim": {
+      "version": "0.35.3",
+      "resolved": "https://registry.npmjs.org/es6-shim/-/es6-shim-0.35.3.tgz",
+      "integrity": "sha1-m/tzY/7//4emzbbNk+QF7DxLbyY="
+    },
     "es6-symbol": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.1.tgz",
@@ -3736,29 +4798,21 @@
       "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ="
     },
     "escodegen": {
-      "version": "1.8.1",
-      "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-1.8.1.tgz",
-      "integrity": "sha1-WltTr0aTEQvrsIZ6o0MN07cKEBg=",
+      "version": "1.9.0",
+      "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-1.9.0.tgz",
+      "integrity": "sha512-v0MYvNQ32bzwoG2OSFzWAkuahDQHK92JBN0pTAALJ4RIxEZe766QJPDR8Hqy7XNUy5K3fnVL76OqYAdc4TZEIw==",
       "dependencies": {
-        "source-map": {
-          "version": "0.2.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.2.0.tgz",
-          "integrity": "sha1-2rc/vPwrqBm03gO9b26qSBZLP50=",
-          "optional": true
+        "esprima": {
+          "version": "3.1.3",
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz",
+          "integrity": "sha1-/cpRzuYTOJXjyI1TXOSdv/YqRjM="
         }
       }
     },
     "escope": {
       "version": "3.6.0",
       "resolved": "https://registry.npmjs.org/escope/-/escope-3.6.0.tgz",
-      "integrity": "sha1-4Bl16BJ4GhY6ba392AOY3GTIicM=",
-      "dependencies": {
-        "estraverse": {
-          "version": "4.2.0",
-          "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-4.2.0.tgz",
-          "integrity": "sha1-De4/7TH81GlhjOc0IJn8GvoL2xM="
-        }
-      }
+      "integrity": "sha1-4Bl16BJ4GhY6ba392AOY3GTIicM="
     },
     "esprima": {
       "version": "2.7.3",
@@ -3768,19 +4822,12 @@
     "esrecurse": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.2.0.tgz",
-      "integrity": "sha1-+pVo2Y04I/mkHZHpAtyrnqblsWM=",
-      "dependencies": {
-        "estraverse": {
-          "version": "4.2.0",
-          "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-4.2.0.tgz",
-          "integrity": "sha1-De4/7TH81GlhjOc0IJn8GvoL2xM="
-        }
-      }
+      "integrity": "sha1-+pVo2Y04I/mkHZHpAtyrnqblsWM="
     },
     "estraverse": {
-      "version": "1.9.3",
-      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-1.9.3.tgz",
-      "integrity": "sha1-r2fy3JIlgkFZUJJgkaQAXSnJu0Q="
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-4.2.0.tgz",
+      "integrity": "sha1-De4/7TH81GlhjOc0IJn8GvoL2xM="
     },
     "esutils": {
       "version": "2.0.2",
@@ -3788,9 +4835,9 @@
       "integrity": "sha1-Cr9PHKpbyx96nYrMbepPqqBLrJs="
     },
     "etag": {
-      "version": "1.8.0",
-      "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.0.tgz",
-      "integrity": "sha1-b2Ma7zNtbEY2K1F2QETOIWvjwFE="
+      "version": "1.8.1",
+      "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz",
+      "integrity": "sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc="
     },
     "event-emitter": {
       "version": "0.3.5",
@@ -3818,26 +4865,19 @@
       "integrity": "sha512-/f2Go4TognH/KvCISP7OUsHn85hT9nUkxxA9BEWxFn+Oj9o8ZNLm/40hdlgSLyuOimsrTKLUMEorQexp/aPQeA=="
     },
     "exec-sh": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/exec-sh/-/exec-sh-0.2.0.tgz",
-      "integrity": "sha1-FPdd4/INKG75MwmbLOUKkDWc7xA="
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/exec-sh/-/exec-sh-0.2.1.tgz",
+      "integrity": "sha512-aLt95pexaugVtQerpmE51+4QfWrNc304uez7jvj6fWnN8GeEHpttB8F36n8N7uVhUMbH/1enbxQ9HImZ4w/9qg=="
     },
     "execa": {
       "version": "0.7.0",
       "resolved": "https://registry.npmjs.org/execa/-/execa-0.7.0.tgz",
-      "integrity": "sha1-lEvs00zEHuMqY6n68nrVpl/Fl3c=",
-      "dependencies": {
-        "cross-spawn": {
-          "version": "5.1.0",
-          "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-5.1.0.tgz",
-          "integrity": "sha1-6L0O/uWPz/b4+UUQoKVUu/ojVEk="
-        },
-        "lru-cache": {
-          "version": "4.1.1",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.1.tgz",
-          "integrity": "sha512-q4spe4KTfsAS1SUHLO0wz8Qiyf1+vMIAgpRYioFYDMNqKfHQbg+AVDH3i4fvpl71/P1L0dBl+fQi+P37UYf0ew=="
-        }
-      }
+      "integrity": "sha1-lEvs00zEHuMqY6n68nrVpl/Fl3c="
+    },
+    "exenv": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/exenv/-/exenv-1.2.2.tgz",
+      "integrity": "sha1-KueOhdmJQVhnCwPUe+wfA72Ru50="
     },
     "expand-braces": {
       "version": "0.1.2",
@@ -3885,11 +4925,6 @@
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
           "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
-        },
-        "kind-of": {
-          "version": "5.0.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
-          "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
         }
       }
     },
@@ -3921,9 +4956,9 @@
       }
     },
     "expect": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/expect/-/expect-21.0.0.tgz",
-      "integrity": "sha512-uPFxiEqdzxQLRw426WAifJWPsGZaE3gldlP7NX1tJ8pWmClCIMEFTII41ExuzEYaIwXjMLugmVq7cbUzAEBShw=="
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/expect/-/expect-21.1.0.tgz",
+      "integrity": "sha512-gBmUVy+A4+brj/MnuiwLe+MIMfSffWUmZMNjKHrMkB0cpkAjnFdwHAxs6MvYeh4+14ocp+SfKp4ebNEhkbV3YQ=="
     },
     "express": {
       "version": "4.15.4",
@@ -3953,38 +4988,9 @@
       "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8="
     },
     "extglob": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/extglob/-/extglob-1.1.0.tgz",
-      "integrity": "sha1-Bni04s5FwOTlD15er7Gw2rW05CQ=",
-      "dependencies": {
-        "define-property": {
-          "version": "0.2.5",
-          "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
-          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY="
-        },
-        "is-descriptor": {
-          "version": "0.1.6",
-          "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
-          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
-        },
-        "kind-of": {
-          "version": "5.0.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
-          "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
-        },
-        "to-regex": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/to-regex/-/to-regex-2.1.0.tgz",
-          "integrity": "sha1-4606QM/hGVWaBa6kPkyu+sxekB0=",
-          "dependencies": {
-            "regex-not": {
-              "version": "0.1.2",
-              "resolved": "https://registry.npmjs.org/regex-not/-/regex-not-0.1.2.tgz",
-              "integrity": "sha1-vH8cSUSxGINT0H3uuRK5TgreJds="
-            }
-          }
-        }
-      }
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/extglob/-/extglob-2.0.2.tgz",
+      "integrity": "sha512-I0+eZBH+jFGL8F5BnIz2ON2nKCjTS3AS3H/5PeSmCp7UVC70Ym8IhdRiQly2juKYQ//f7z1aj1BRpQniFJoU1w=="
     },
     "extract-zip": {
       "version": "1.6.5",
@@ -4013,6 +5019,11 @@
       "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.3.0.tgz",
       "integrity": "sha1-lpGEQOMEGnpBT4xS48V06zw+HgU="
     },
+    "eyes": {
+      "version": "0.1.8",
+      "resolved": "https://registry.npmjs.org/eyes/-/eyes-0.1.8.tgz",
+      "integrity": "sha1-Ys8SAjTGg3hdkCNIqADvPgzCC8A="
+    },
     "fast-deep-equal": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-1.0.0.tgz",
@@ -4023,6 +5034,11 @@
       "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
       "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc="
     },
+    "fast-memoize": {
+      "version": "2.2.8",
+      "resolved": "https://registry.npmjs.org/fast-memoize/-/fast-memoize-2.2.8.tgz",
+      "integrity": "sha512-3ppTC3fZ9Vwtjslx8DkhSIbI9PH1nM4pobuTHQINOxTxchG8n3SDGZ8L6jbatGJCGLKR+gbkNWKFN4E1iUROSA=="
+    },
     "fastparse": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.1.tgz",
@@ -4039,9 +5055,9 @@
       "integrity": "sha1-VOmr99+i8mzZsWNsWIwa/AXeXVg="
     },
     "fbjs": {
-      "version": "0.8.14",
-      "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.14.tgz",
-      "integrity": "sha1-0dviviVMNakeCfMfnNUKQLKg7Rw=",
+      "version": "0.8.15",
+      "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.15.tgz",
+      "integrity": "sha1-TwaV/fzBbDfAsH+s7Iy0xAkWhbk=",
       "dependencies": {
         "core-js": {
           "version": "1.2.7",
@@ -4055,6 +5071,11 @@
       "resolved": "https://registry.npmjs.org/fd-slicer/-/fd-slicer-1.0.1.tgz",
       "integrity": "sha1-i1vL2ewyfFBBv5qwI/1nUPEXfmU="
     },
+    "file-loader": {
+      "version": "0.11.1",
+      "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.11.1.tgz",
+      "integrity": "sha1-azKO4SNKcp5OR9Njdd1tNcDh24Q="
+    },
     "filename-regex": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz",
@@ -4080,6 +5101,11 @@
       "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.4.tgz",
       "integrity": "sha512-16l/r8RgzlXKmFOhZpHBztvye+lAhC5SU7hXavnerC9UfZqZxxXl3BzL8MhffPT3kF61lj9Oav2LKEzh0ei7tg=="
     },
+    "find-cache-dir": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/find-cache-dir/-/find-cache-dir-1.0.0.tgz",
+      "integrity": "sha1-kojj6ePMN0hxfTnq3hfPcfww7m8="
+    },
     "find-index": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
@@ -4131,9 +5157,9 @@
       "integrity": "sha1-87IWfZBoxGmKjVH092CjmlTYGOs="
     },
     "forwarded": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.0.tgz",
-      "integrity": "sha1-Ge+YdMSuHCl7zweP3mOgm2aoQ2M="
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.2.tgz",
+      "integrity": "sha1-mMI9qxF1ZXuMBXPozszZGw/xjIQ="
     },
     "fragment-cache": {
       "version": "0.2.1",
@@ -4155,6 +5181,549 @@
       "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
       "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
     },
+    "fsevents": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.2.tgz",
+      "integrity": "sha512-Sn44E5wQW4bTHXvQmvSHwqbuiXtduD6Rrjm2ZtUEGbyrig+nUH3t/QD4M4/ZXViY556TBpRgZkHLDx3JxPwxiw==",
+      "optional": true,
+      "dependencies": {
+        "abbrev": {
+          "version": "1.1.0",
+          "bundled": true,
+          "optional": true
+        },
+        "ajv": {
+          "version": "4.11.8",
+          "bundled": true,
+          "optional": true
+        },
+        "ansi-regex": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "aproba": {
+          "version": "1.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "are-we-there-yet": {
+          "version": "1.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "asn1": {
+          "version": "0.2.3",
+          "bundled": true,
+          "optional": true
+        },
+        "assert-plus": {
+          "version": "0.2.0",
+          "bundled": true,
+          "optional": true
+        },
+        "asynckit": {
+          "version": "0.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "aws-sign2": {
+          "version": "0.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "aws4": {
+          "version": "1.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "balanced-match": {
+          "version": "0.4.2",
+          "bundled": true
+        },
+        "bcrypt-pbkdf": {
+          "version": "1.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "block-stream": {
+          "version": "0.0.9",
+          "bundled": true
+        },
+        "boom": {
+          "version": "2.10.1",
+          "bundled": true
+        },
+        "brace-expansion": {
+          "version": "1.1.7",
+          "bundled": true
+        },
+        "buffer-shims": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "caseless": {
+          "version": "0.12.0",
+          "bundled": true,
+          "optional": true
+        },
+        "co": {
+          "version": "4.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "code-point-at": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "combined-stream": {
+          "version": "1.0.5",
+          "bundled": true
+        },
+        "concat-map": {
+          "version": "0.0.1",
+          "bundled": true
+        },
+        "console-control-strings": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "core-util-is": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "cryptiles": {
+          "version": "2.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "dashdash": {
+          "version": "1.14.1",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "debug": {
+          "version": "2.6.8",
+          "bundled": true,
+          "optional": true
+        },
+        "deep-extend": {
+          "version": "0.4.2",
+          "bundled": true,
+          "optional": true
+        },
+        "delayed-stream": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "delegates": {
+          "version": "1.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "ecc-jsbn": {
+          "version": "0.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "extend": {
+          "version": "3.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "extsprintf": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "forever-agent": {
+          "version": "0.6.1",
+          "bundled": true,
+          "optional": true
+        },
+        "form-data": {
+          "version": "2.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "fs.realpath": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "fstream": {
+          "version": "1.0.11",
+          "bundled": true
+        },
+        "fstream-ignore": {
+          "version": "1.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "gauge": {
+          "version": "2.7.4",
+          "bundled": true,
+          "optional": true
+        },
+        "getpass": {
+          "version": "0.1.7",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "glob": {
+          "version": "7.1.2",
+          "bundled": true
+        },
+        "graceful-fs": {
+          "version": "4.1.11",
+          "bundled": true
+        },
+        "har-schema": {
+          "version": "1.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "har-validator": {
+          "version": "4.2.1",
+          "bundled": true,
+          "optional": true
+        },
+        "has-unicode": {
+          "version": "2.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "hawk": {
+          "version": "3.1.3",
+          "bundled": true,
+          "optional": true
+        },
+        "hoek": {
+          "version": "2.16.3",
+          "bundled": true
+        },
+        "http-signature": {
+          "version": "1.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "inflight": {
+          "version": "1.0.6",
+          "bundled": true
+        },
+        "inherits": {
+          "version": "2.0.3",
+          "bundled": true
+        },
+        "ini": {
+          "version": "1.3.4",
+          "bundled": true,
+          "optional": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "is-typedarray": {
+          "version": "1.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "isstream": {
+          "version": "0.1.2",
+          "bundled": true,
+          "optional": true
+        },
+        "jodid25519": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "jsbn": {
+          "version": "0.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "json-schema": {
+          "version": "0.2.3",
+          "bundled": true,
+          "optional": true
+        },
+        "json-stable-stringify": {
+          "version": "1.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "json-stringify-safe": {
+          "version": "5.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "jsonify": {
+          "version": "0.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "jsprim": {
+          "version": "1.4.0",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "mime-db": {
+          "version": "1.27.0",
+          "bundled": true
+        },
+        "mime-types": {
+          "version": "2.1.15",
+          "bundled": true
+        },
+        "minimatch": {
+          "version": "3.0.4",
+          "bundled": true
+        },
+        "minimist": {
+          "version": "0.0.8",
+          "bundled": true
+        },
+        "mkdirp": {
+          "version": "0.5.1",
+          "bundled": true
+        },
+        "ms": {
+          "version": "2.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "node-pre-gyp": {
+          "version": "0.6.36",
+          "bundled": true,
+          "optional": true
+        },
+        "nopt": {
+          "version": "4.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "npmlog": {
+          "version": "4.1.0",
+          "bundled": true,
+          "optional": true
+        },
+        "number-is-nan": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "oauth-sign": {
+          "version": "0.8.2",
+          "bundled": true,
+          "optional": true
+        },
+        "object-assign": {
+          "version": "4.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "once": {
+          "version": "1.4.0",
+          "bundled": true
+        },
+        "os-homedir": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "os-tmpdir": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "osenv": {
+          "version": "0.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "path-is-absolute": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "performance-now": {
+          "version": "0.2.0",
+          "bundled": true,
+          "optional": true
+        },
+        "process-nextick-args": {
+          "version": "1.0.7",
+          "bundled": true
+        },
+        "punycode": {
+          "version": "1.4.1",
+          "bundled": true,
+          "optional": true
+        },
+        "qs": {
+          "version": "6.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "rc": {
+          "version": "1.2.1",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "minimist": {
+              "version": "1.2.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "bundled": true
+        },
+        "request": {
+          "version": "2.81.0",
+          "bundled": true,
+          "optional": true
+        },
+        "rimraf": {
+          "version": "2.6.1",
+          "bundled": true
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "bundled": true
+        },
+        "semver": {
+          "version": "5.3.0",
+          "bundled": true,
+          "optional": true
+        },
+        "set-blocking": {
+          "version": "2.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "signal-exit": {
+          "version": "3.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "sntp": {
+          "version": "1.0.9",
+          "bundled": true,
+          "optional": true
+        },
+        "sshpk": {
+          "version": "1.13.0",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "string_decoder": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "string-width": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "stringstream": {
+          "version": "0.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "strip-ansi": {
+          "version": "3.0.1",
+          "bundled": true
+        },
+        "strip-json-comments": {
+          "version": "2.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "tar": {
+          "version": "2.2.1",
+          "bundled": true
+        },
+        "tar-pack": {
+          "version": "3.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "tough-cookie": {
+          "version": "2.3.2",
+          "bundled": true,
+          "optional": true
+        },
+        "tunnel-agent": {
+          "version": "0.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "tweetnacl": {
+          "version": "0.14.5",
+          "bundled": true,
+          "optional": true
+        },
+        "uid-number": {
+          "version": "0.0.6",
+          "bundled": true,
+          "optional": true
+        },
+        "util-deprecate": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "uuid": {
+          "version": "3.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "verror": {
+          "version": "1.3.6",
+          "bundled": true,
+          "optional": true
+        },
+        "wide-align": {
+          "version": "1.1.2",
+          "bundled": true,
+          "optional": true
+        },
+        "wrappy": {
+          "version": "1.0.2",
+          "bundled": true
+        }
+      }
+    },
     "fstream": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
@@ -4170,16 +5739,38 @@
       "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.0.3.tgz",
       "integrity": "sha512-5EblxZUdioXi2JiMZ9FUbwYj40eQ9MFHyzFLBSPdlRl3SO8l7SLWuAnQ/at/1Wi4hjJwME/C5WpF2ZfAc8nGNw=="
     },
+    "fuse.js": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/fuse.js/-/fuse.js-3.1.0.tgz",
+      "integrity": "sha1-kGIUbEcVUhibD2eLT1oVVzGuOzw="
+    },
     "gauge": {
       "version": "2.7.4",
       "resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz",
-      "integrity": "sha1-LANAXHU4w51+s3sxcCLjJfsBi/c="
+      "integrity": "sha1-LANAXHU4w51+s3sxcCLjJfsBi/c=",
+      "dependencies": {
+        "string-width": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
+          "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
+        }
+      }
     },
     "gaze": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz",
       "integrity": "sha1-hHIkZ3rbiHDWeSV+0ziP22HkAQU="
     },
+    "generate-function": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/generate-function/-/generate-function-2.0.0.tgz",
+      "integrity": "sha1-aFj+fAlpt9TpCTM3ZHrHn2DfvnQ="
+    },
+    "generate-object-property": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/generate-object-property/-/generate-object-property-1.2.0.tgz",
+      "integrity": "sha1-nA4cQDCM6AT0eDYYuTf6iPmdUNA="
+    },
     "generic-names": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/generic-names/-/generic-names-1.0.2.tgz",
@@ -4202,6 +5793,11 @@
       "resolved": "https://registry.npmjs.org/get-func-name/-/get-func-name-2.0.0.tgz",
       "integrity": "sha1-6td0q+5y4gQJQzoGY2YCPdaIekE="
     },
+    "get-port": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/get-port/-/get-port-3.2.0.tgz",
+      "integrity": "sha1-3Xzn3hh8Bsi/NTeWrHHgmfCYDrw="
+    },
     "get-stdin": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz",
@@ -4239,6 +5835,11 @@
       "resolved": "https://registry.npmjs.org/glamor/-/glamor-2.20.40.tgz",
       "integrity": "sha512-DNXCd+c14N9QF8aAKrfl4xakPk5FdcFwmH7sD0qnC0Pr7xoZ5W9yovhUrY/dJc3psfGGXC58vqQyRtuskyUJxA=="
     },
+    "glamorous": {
+      "version": "4.9.2",
+      "resolved": "https://registry.npmjs.org/glamorous/-/glamorous-4.9.2.tgz",
+      "integrity": "sha512-1mKYHbAvBtbHsCBnECcCHlAuU3qUptbDzWWuQpFmlkjDuYAbuZcZr3UOk8nw+hG0tWXGyO4nuhKv//JgdpiMEw=="
+    },
     "glob": {
       "version": "7.1.2",
       "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
@@ -4259,6 +5860,18 @@
       "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz",
       "integrity": "sha1-nUGbPijxLoOjYhZKJ3BVkiycDVY="
     },
+    "global": {
+      "version": "4.3.2",
+      "resolved": "https://registry.npmjs.org/global/-/global-4.3.2.tgz",
+      "integrity": "sha1-52mJJopsdMOJCLEwWxD8DjlOnQ8=",
+      "dependencies": {
+        "process": {
+          "version": "0.5.2",
+          "resolved": "https://registry.npmjs.org/process/-/process-0.5.2.tgz",
+          "integrity": "sha1-FjjYqONML0QKkduVq5rrZ3/Bhc8="
+        }
+      }
+    },
     "globals": {
       "version": "9.18.0",
       "resolved": "https://registry.npmjs.org/globals/-/globals-9.18.0.tgz",
@@ -4267,7 +5880,14 @@
     "globby": {
       "version": "6.1.0",
       "resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
-      "integrity": "sha1-9abXDoOV4hyFj7BInWTfAkJNUGw="
+      "integrity": "sha1-9abXDoOV4hyFj7BInWTfAkJNUGw=",
+      "dependencies": {
+        "pify": {
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+          "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
+        }
+      }
     },
     "globule": {
       "version": "1.2.0",
@@ -4376,22 +5996,22 @@
       "integrity": "sha1-4Ob+aijPUROIVeCG0Wkedx3iqLk="
     },
     "has-value": {
-      "version": "0.3.1",
-      "resolved": "https://registry.npmjs.org/has-value/-/has-value-0.3.1.tgz",
-      "integrity": "sha1-ex9YutpiyoJ+wKIHgCVlSEWZXh8=",
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/has-value/-/has-value-1.0.0.tgz",
+      "integrity": "sha1-GLKB2lhbHFxR3vJMkw7SmgvmsXc="
+    },
+    "has-values": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/has-values/-/has-values-1.0.0.tgz",
+      "integrity": "sha1-lbC2P+whRmGab+V/51Yo1aOe/k8=",
       "dependencies": {
-        "isobject": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
-          "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk="
+        "kind-of": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-4.0.0.tgz",
+          "integrity": "sha1-IIE989cSkosgc3hpGkUGb65y3Vc="
         }
       }
     },
-    "has-values": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/has-values/-/has-values-0.1.4.tgz",
-      "integrity": "sha1-bWHeldkd/Km5oCCJrThL/49it3E="
-    },
     "hash-base": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/hash-base/-/hash-base-2.0.2.tgz",
@@ -4427,6 +6047,11 @@
       "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz",
       "integrity": "sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0="
     },
+    "hoist-non-react-statics": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-1.2.0.tgz",
+      "integrity": "sha1-qkSM8JhtVcxAdzsXF0t90GbLfPs="
+    },
     "home-or-tmp": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/home-or-tmp/-/home-or-tmp-2.0.0.tgz",
@@ -4447,6 +6072,11 @@
       "resolved": "https://registry.npmjs.org/html-comment-regex/-/html-comment-regex-1.1.1.tgz",
       "integrity": "sha1-ZouTd26q5V696POtRkswekljYl4="
     },
+    "html-element-attributes": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/html-element-attributes/-/html-element-attributes-1.3.0.tgz",
+      "integrity": "sha1-8G69/OIt6XnbggICZcrFQfsX1Pw="
+    },
     "html-encoding-sniffer": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-1.0.1.tgz",
@@ -4457,6 +6087,11 @@
       "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-1.2.1.tgz",
       "integrity": "sha1-DfKTUfByEWNRXfueVUPl9u7VFi8="
     },
+    "html-tag-names": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/html-tag-names/-/html-tag-names-1.1.2.tgz",
+      "integrity": "sha1-9lFolkxanIJnXv2ogoddyyqHXCI="
+    },
     "htmlparser2": {
       "version": "3.9.2",
       "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.9.2.tgz",
@@ -4472,6 +6107,11 @@
       "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.2.tgz",
       "integrity": "sha1-CgAsyFcHGSp+eUbO7cERVfYOxzY="
     },
+    "http-parser-js": {
+      "version": "0.4.6",
+      "resolved": "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.4.6.tgz",
+      "integrity": "sha1-GVJz9YcExFLWcQdr4gEyndNB3FU="
+    },
     "http-proxy": {
       "version": "1.16.2",
       "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.16.2.tgz",
@@ -4514,6 +6154,11 @@
             }
           }
         },
+        "is-extglob": {
+          "version": "2.1.1",
+          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
+          "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI="
+        },
         "is-glob": {
           "version": "3.1.0",
           "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz",
@@ -4584,9 +6229,14 @@
       "integrity": "sha1-vjPUCsEO8ZJnAfbwii2G+/0a0+Q="
     },
     "immutability-helper": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.3.1.tgz",
-      "integrity": "sha1-jM/OkhVyCMEgsq+tftBcERFMCG4="
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.4.0.tgz",
+      "integrity": "sha512-rW/L/56ZMo9NStMK85kFrUFFGy4NeJbCdhfrDHIZrFfxYtuwuxD+dT3mWMcdmrNO61hllc60AeGglCRhfZ1dZw=="
+    },
+    "immutable": {
+      "version": "3.8.1",
+      "resolved": "https://registry.npmjs.org/immutable/-/immutable-3.8.1.tgz",
+      "integrity": "sha1-IAgH8Rqw9ycQ6khVQt4IgHX2jNI="
     },
     "imurmurhash": {
       "version": "0.1.4",
@@ -4624,19 +6274,26 @@
       "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4="
     },
     "inline-style-prefixer": {
-      "version": "3.0.7",
-      "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-3.0.7.tgz",
-      "integrity": "sha1-DMyS5ZAv5uDSjZdcQlhEP4gGFfg="
+      "version": "3.0.8",
+      "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-3.0.8.tgz",
+      "integrity": "sha1-hVG45bTVcyROZqNLBPfTIHaitTQ="
     },
     "internal-ip": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/internal-ip/-/internal-ip-1.2.0.tgz",
-      "integrity": "sha1-rp+/k7mEh4eF1QqN4bNWlWBYz1w="
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/internal-ip/-/internal-ip-2.0.3.tgz",
+      "integrity": "sha512-XxJMiJOjXbb9LlwH6SVTsnUPymYACunXzKg3dqU+HIC+xYIkUhMyTiT/H6xxPmhlE4zHq50lKlx0CZlyN2C76Q==",
+      "dependencies": {
+        "ipaddr.js": {
+          "version": "1.5.2",
+          "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.5.2.tgz",
+          "integrity": "sha1-1LUFvemUaYfM8PxY2QEP+WB+P6A="
+        }
+      }
     },
     "interpret": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.0.3.tgz",
-      "integrity": "sha1-y8NcYu7uc/Gat7EKgBURQBr8D5A="
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.0.4.tgz",
+      "integrity": "sha1-ggzdWIuGj/sZGoCVBtbJyPISsbA="
     },
     "invariant": {
       "version": "2.2.2",
@@ -4653,6 +6310,11 @@
       "resolved": "https://registry.npmjs.org/ip/-/ip-1.1.5.tgz",
       "integrity": "sha1-vd7XARQpCCjAoDnnLvJfWq7ENUo="
     },
+    "ip-regex": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/ip-regex/-/ip-regex-2.1.0.tgz",
+      "integrity": "sha1-+ni/XS5pE8kRzp+BnuUUa7bYROk="
+    },
     "ipaddr.js": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.4.0.tgz",
@@ -4725,20 +6387,18 @@
     "is-descriptor": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-1.0.1.tgz",
-      "integrity": "sha512-G3fFVFTqfaqu7r4YuSBHKBAuOaLz8Sy7ekklUpFEliaLMP1Y2ZjoN9jS62YWCAPQrQpMUQSitRlrzibbuCZjdA==",
-      "dependencies": {
-        "kind-of": {
-          "version": "5.0.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
-          "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
-        }
-      }
+      "integrity": "sha512-G3fFVFTqfaqu7r4YuSBHKBAuOaLz8Sy7ekklUpFEliaLMP1Y2ZjoN9jS62YWCAPQrQpMUQSitRlrzibbuCZjdA=="
     },
     "is-directory": {
       "version": "0.3.1",
       "resolved": "https://registry.npmjs.org/is-directory/-/is-directory-0.3.1.tgz",
       "integrity": "sha1-YTObbyR1/Hcv2cnYP1yFddwVSuE="
     },
+    "is-dom": {
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/is-dom/-/is-dom-1.0.9.tgz",
+      "integrity": "sha1-SDgy1SlyBz3hK5/j9gMghw2oNw0="
+    },
     "is-dotfile": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/is-dotfile/-/is-dotfile-1.0.3.tgz",
@@ -4755,9 +6415,9 @@
       "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik="
     },
     "is-extglob": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
-      "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI="
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
+      "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
     },
     "is-finite": {
       "version": "1.0.2",
@@ -4769,17 +6429,20 @@
       "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
       "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
     },
+    "is-function": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/is-function/-/is-function-1.0.1.tgz",
+      "integrity": "sha1-Es+5i2W1fdPRk6MSH19uL0N2ArU="
+    },
     "is-glob": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz",
-      "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM=",
-      "dependencies": {
-        "is-extglob": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
-          "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
-        }
-      }
+      "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM="
+    },
+    "is-my-json-valid": {
+      "version": "2.16.1",
+      "resolved": "https://registry.npmjs.org/is-my-json-valid/-/is-my-json-valid-2.16.1.tgz",
+      "integrity": "sha512-ochPsqWS1WXj8ZnMIV0vnNXooaMhp7cyL4FMSIPKTtnV0Ha/T19G2b9kkhcNsabV9bxYkze7/aLZJb/bYuFduQ=="
     },
     "is-number": {
       "version": "3.0.0",
@@ -4793,6 +6456,11 @@
         }
       }
     },
+    "is-obj": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-1.0.1.tgz",
+      "integrity": "sha1-PkcprB9f3gJc19g6iW2rn09n2w8="
+    },
     "is-odd": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/is-odd/-/is-odd-1.0.0.tgz",
@@ -4833,6 +6501,11 @@
       "resolved": "https://registry.npmjs.org/is-primitive/-/is-primitive-2.0.0.tgz",
       "integrity": "sha1-IHurkWOEmcB7Kt8kCkGochADRXU="
     },
+    "is-property": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/is-property/-/is-property-1.0.2.tgz",
+      "integrity": "sha1-V/4cTkhHTt1lsJkR8msc1Ald2oQ="
+    },
     "is-regex": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.0.4.tgz",
@@ -4868,6 +6541,11 @@
       "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz",
       "integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI="
     },
+    "is-wsl": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-1.1.0.tgz",
+      "integrity": "sha1-HxbkqiKwTRM2tmGIpmrzxgDDpm0="
+    },
     "isarray": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
@@ -4878,6 +6556,11 @@
       "resolved": "https://registry.npmjs.org/isbinaryfile/-/isbinaryfile-3.0.2.tgz",
       "integrity": "sha1-Sj6XTsDLqQBNP8bN5yCeppNopiE="
     },
+    "isemail": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/isemail/-/isemail-2.2.1.tgz",
+      "integrity": "sha1-A1PT2aYpUQgMJiwqoKQrjqjp4qY="
+    },
     "isexe": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
@@ -4908,6 +6591,16 @@
           "resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz",
           "integrity": "sha1-7GphrlZIDAw8skHJVhjiCJL5Zyo="
         },
+        "escodegen": {
+          "version": "1.8.1",
+          "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-1.8.1.tgz",
+          "integrity": "sha1-WltTr0aTEQvrsIZ6o0MN07cKEBg="
+        },
+        "estraverse": {
+          "version": "1.9.3",
+          "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-1.9.3.tgz",
+          "integrity": "sha1-r2fy3JIlgkFZUJJgkaQAXSnJu0Q="
+        },
         "glob": {
           "version": "5.0.15",
           "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
@@ -4923,6 +6616,12 @@
           "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz",
           "integrity": "sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs="
         },
+        "source-map": {
+          "version": "0.2.0",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.2.0.tgz",
+          "integrity": "sha1-2rc/vPwrqBm03gO9b26qSBZLP50=",
+          "optional": true
+        },
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
@@ -4994,10 +6693,15 @@
       "resolved": "https://registry.npmjs.org/istanbul-reports/-/istanbul-reports-1.1.2.tgz",
       "integrity": "sha1-D7Lj9qqZIr085F0F2KtNXo4HvU8="
     },
+    "items": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/items/-/items-2.1.1.tgz",
+      "integrity": "sha1-i9FtnIOxlSneWuoyGsqtp4NkoZg="
+    },
     "jest": {
-      "version": "21.0.1",
-      "resolved": "https://registry.npmjs.org/jest/-/jest-21.0.1.tgz",
-      "integrity": "sha512-KLoBNahMA7gnAHbZ7msoivm8G52Emh4Qe4cYwInuJLwlUZRWfFFAHjao1fQ8iyiikp9eWgJcE94IJkZ58XVtmA==",
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/jest/-/jest-21.1.0.tgz",
+      "integrity": "sha512-yPxhkAyxCymLkpZakAGm8VGNQB04HgD5bhYCQHBcIGCbH5oYHZDekkt/FBtFC2vPcyWG+dsKCqvmys/1kQYjKA==",
       "dependencies": {
         "ansi-regex": {
           "version": "3.0.0",
@@ -5020,9 +6724,9 @@
           "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
         },
         "camelcase": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
-          "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
+          "version": "4.1.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
+          "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
         },
         "cliui": {
           "version": "3.2.0",
@@ -5034,6 +6738,11 @@
               "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
               "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
             },
+            "string-width": {
+              "version": "1.0.2",
+              "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
+              "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
+            },
             "strip-ansi": {
               "version": "3.0.1",
               "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
@@ -5051,77 +6760,111 @@
           "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
           "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
         },
-        "is-extglob": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
-          "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
-        },
         "jest-cli": {
-          "version": "21.0.1",
-          "resolved": "https://registry.npmjs.org/jest-cli/-/jest-cli-21.0.1.tgz",
-          "integrity": "sha512-y0j2vSETbdpkkrusqSYehhKQj1K0g8gB3L9vT3aTCppAjGO2aoWfql7HNv8jIF1bdmt+ssUPChWYgL1CUbpOcw=="
+          "version": "21.1.0",
+          "resolved": "https://registry.npmjs.org/jest-cli/-/jest-cli-21.1.0.tgz",
+          "integrity": "sha512-ISnDjHv9m0nCrSKFC+Cnr9SotaWHYRP+TK81vMtPwkV+/70JbfYJT6ZnuqgqyAnTYE4f/aCe6uyMPKHAVT1RpA=="
         },
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
           "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
         },
+        "load-json-file": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
+          "integrity": "sha1-eUfkIUmvgNaWy/eXvKq8/h/inKg=",
+          "dependencies": {
+            "pify": {
+              "version": "2.3.0",
+              "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+              "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
+            }
+          }
+        },
         "micromatch": {
           "version": "2.3.11",
           "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
           "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
         },
+        "path-type": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/path-type/-/path-type-2.0.0.tgz",
+          "integrity": "sha1-8BLMuEFbcJb8LaoQVMPXI4lZTHM=",
+          "dependencies": {
+            "pify": {
+              "version": "2.3.0",
+              "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+              "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
+            }
+          }
+        },
+        "read-pkg": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-2.0.0.tgz",
+          "integrity": "sha1-jvHAYjxqbbDcZxPEv6xGMysjaPg="
+        },
+        "read-pkg-up": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-2.0.0.tgz",
+          "integrity": "sha1-a3KoBImE4MQeeVEP1en6mbO1Sb4="
+        },
         "strip-ansi": {
           "version": "4.0.0",
           "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
           "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8="
         },
+        "strip-bom": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
+          "integrity": "sha1-IzTBjpx1n3vdVv3vfprj1YjmjtM="
+        },
         "yargs": {
-          "version": "7.1.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-7.1.0.tgz",
-          "integrity": "sha1-a6MY6xaWFyf10oT46gA+jWFU0Mg="
+          "version": "9.0.1",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-9.0.1.tgz",
+          "integrity": "sha1-UqzCP+7Kw0BCB47njAwAf1CF20w="
         }
       }
     },
     "jest-changed-files": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/jest-changed-files/-/jest-changed-files-21.0.0.tgz",
-      "integrity": "sha512-6xmPTJfRK6rmOTRFZ9Lc9Eyk/ov4H24Ts77bV/PkbSl4T29/e8w3QYxMhrcOLu4Ie561TdCRgq+NISWNojCYdQ=="
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/jest-changed-files/-/jest-changed-files-21.1.0.tgz",
+      "integrity": "sha512-OnjMoORBVG9Jko6Bc3UGJPx9G1PNsETiqpQXZ6wPU3fk1gtxhKYE4Mgdk28ER/CWeg7bzGUcaragLf1lf1tzbQ=="
     },
     "jest-config": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/jest-config/-/jest-config-21.0.0.tgz",
-      "integrity": "sha512-a0na/HLdnZdjFbBFd/VwRp47XyFBJqGPl1fgBHcOnNrM8ss7O6yxOY57GiA8whzOx3JC03edE5iNOZ4RDHbOAQ=="
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/jest-config/-/jest-config-21.1.0.tgz",
+      "integrity": "sha512-RQnWwHRSIRvtyJQeZTpXUmsNYVVr/qu3XWfV3FTFkDsxHQi6Sj5sfUK5FHCNUCXIuFTs+r3qbYoMz2q8rdm/EA=="
     },
     "jest-diff": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/jest-diff/-/jest-diff-21.0.0.tgz",
-      "integrity": "sha512-AsMhrVl9aJtz5E0fvNgXD2abNc4BLT3AfUZGzw2WBlPOLjnQ9VsnByI86d63fNRMZJQTE870YDLZNQtbat1IPw=="
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/jest-diff/-/jest-diff-21.1.0.tgz",
+      "integrity": "sha512-mGJinKrAB6hj1cpO1FOuDCfgILozGvYi4Zpk8GrxmNgdd9/9llIA2Xzu5879Fa4ayh7lb9ej2NdvuNLMCjbrMg=="
     },
     "jest-docblock": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/jest-docblock/-/jest-docblock-21.0.0.tgz",
-      "integrity": "sha512-nhcLynqskWevUQQ3ZJcIO/5v8bpshydwMOgN9Wsszc6Ri8HVaegGIpbrz/ALzMrSeQ4njAUfXVeY7WDMOPbm2w=="
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/jest-docblock/-/jest-docblock-21.1.0.tgz",
+      "integrity": "sha512-ai3olFJ/3cSd60klaRIcC/Cb44/RsJ69qS8uXxfWXEbnbDqjcbl5K8Z5ekfY15hgVZGSAiLz7pOwfjIBE/yJVw=="
     },
     "jest-environment-jsdom": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/jest-environment-jsdom/-/jest-environment-jsdom-21.0.0.tgz",
-      "integrity": "sha512-w+at4edF/Cgc20INKxy0g3of1kLCVKFjhRsUvBfW+arMTQ5rKTCcg8+suQ5VmOeXh/d2DgRmLBAoyAixnJiffA=="
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/jest-environment-jsdom/-/jest-environment-jsdom-21.1.0.tgz",
+      "integrity": "sha512-sMcGlN11SnnuJKzR5oJ5LsDRzHEBLUeMRImDbvxyusNW9l17wAEsoLuAWbv0W8crZTTwjRO6/mitpNF3PmVsMg=="
     },
     "jest-environment-node": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/jest-environment-node/-/jest-environment-node-21.0.0.tgz",
-      "integrity": "sha512-oSolLYaUWe1KtXw9bexGw4X3x5gV6qk4B67SwwthfaY+gLjHOqFK8Q9NWbDvfOAdWxDz2K7vSzP63DHsLdmY6w=="
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/jest-environment-node/-/jest-environment-node-21.1.0.tgz",
+      "integrity": "sha512-Lv/pcK2zq2DZKL/q7+u8mrlSeXmaMGgmJOx0+Ew+FxYKdSzO0jpEUTEfzQOnMvpSWMqjKUYLDYkCPCBFcOX93w=="
     },
     "jest-get-type": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/jest-get-type/-/jest-get-type-21.0.0.tgz",
-      "integrity": "sha512-JE2NylM4fkuEI3W4n8+lcebJ/Fk6+msny4JgRP85I0LUlNqqs7lv19YTwbP6h3YLh7nVITndvVDixZyI/AZjQw=="
+      "version": "21.0.2",
+      "resolved": "https://registry.npmjs.org/jest-get-type/-/jest-get-type-21.0.2.tgz",
+      "integrity": "sha512-4KvNzzXMXeapGaMWd+SL5e47zcMn8KTWjom6Fl3avxVXnbKS7abD1p4xWe4ToAZfgNoYNsQ9Av/mnWMnZK/Z4A=="
     },
     "jest-haste-map": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/jest-haste-map/-/jest-haste-map-21.0.0.tgz",
-      "integrity": "sha512-Hc7FfB3W1braN64iczZggBzjmpsc2yG+HQxXM45qQHtB9xqX2gANbyx5REE3p9FPcxHg11mgwiSIpD4UOQIMpw==",
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/jest-haste-map/-/jest-haste-map-21.1.0.tgz",
+      "integrity": "sha512-a7chVtmpzRgRkYDL4eZgRuXZUlos1JOC7Dam3WryXGiD/1GNj+QONt6jcsAzDZohzs9XYg2EkjyGxIAXcNipBg==",
       "dependencies": {
         "arr-diff": {
           "version": "2.0.0",
@@ -5148,11 +6891,6 @@
           "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
           "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
         },
-        "is-extglob": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
-          "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
-        },
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
@@ -5166,19 +6904,19 @@
       }
     },
     "jest-jasmine2": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/jest-jasmine2/-/jest-jasmine2-21.0.0.tgz",
-      "integrity": "sha512-zWu/7j/xxUGS6Qj5LaMDSLKa+voNtjUNBuDwckxSoZqJIFgP+sq8zhvUQzAFEHpqXwZ14CaOJTNUSHCHd1ad+g=="
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/jest-jasmine2/-/jest-jasmine2-21.1.0.tgz",
+      "integrity": "sha512-YjbAaXN6K5f8rtwPVxkMRIYNZGB5GiJcApcj/5ER7uGJrqJMqyCklMAPZR5Gq8XPzzuDVfoB2h7kxyOGVqaxrw=="
     },
     "jest-matcher-utils": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-21.0.0.tgz",
-      "integrity": "sha512-obYczfXWsEOBNLIDaDQQN9OjpWFKhaUPEgtLBnu/Yp4kz0PyjvvftHE2pOY1v3a0rRkWIQYjfYUybyRE/BNg5Q=="
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-21.1.0.tgz",
+      "integrity": "sha512-V/Xindf+VY5UM+oz9Nhsv0Ql93lRcKS7tHtVoXtlXkZXoXpydHwuezkLLCpZkH/Uew5y2OyDZpnlxPvEalJZng=="
     },
     "jest-message-util": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/jest-message-util/-/jest-message-util-21.0.0.tgz",
-      "integrity": "sha512-NSgzgIMZx0FpqERApgZNWzO3g5DOtJDCKjpm0QFIgKdiWWLkLI+S3eeG+yaGboVZ03aiS3nxi1j2wE0f6GnKhQ==",
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/jest-message-util/-/jest-message-util-21.1.0.tgz",
+      "integrity": "sha512-BwKrjR4HvGoodYw3PFh95IU4qDk3nVOf3LqOKRaaR6486bJM8IZIlxWR8yfxhAN7nDGBDco/TR+U50WcPgzvgA==",
       "dependencies": {
         "arr-diff": {
           "version": "2.0.0",
@@ -5205,11 +6943,6 @@
           "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
           "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
         },
-        "is-extglob": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
-          "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
-        },
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
@@ -5223,41 +6956,34 @@
       }
     },
     "jest-mock": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/jest-mock/-/jest-mock-21.0.0.tgz",
-      "integrity": "sha512-QZQqZ40iXr510cFGj8yY/tCxfDXDdulmEjgBS0CbHub6ILU79OXF84sSSHDD0elc9WDuzMFoSFF4IrXPBDmtWQ=="
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/jest-mock/-/jest-mock-21.1.0.tgz",
+      "integrity": "sha512-iwING4rMP1rhepAj/MVPHVxGltwwR+Lfmiy9ARevQ7XDZ/zF7h+KPFeOFMSMGvV5/dS05PHhwRjFzrjvkybNLw=="
     },
     "jest-regex-util": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-21.0.0.tgz",
-      "integrity": "sha512-4xVhz33XZpeoNCplooEBc0PdOW7BCydT8wqvGlgxEzteUWXvctFdvMwzqdUv7ZjCN3QRMZ04SVruHlkMsAH6Eg=="
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-21.1.0.tgz",
+      "integrity": "sha512-1QiJa6nvdzVgDhY1FTG3fl+2eYrCQGQoIeGaVPjt9+VmxsQ/BwZD6aglH0z6ZK/uEXZPAaj1XaemKM9tC6VVlQ=="
     },
     "jest-resolve": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/jest-resolve/-/jest-resolve-21.0.0.tgz",
-      "integrity": "sha512-Ic5dYWG9dwH97EPDtWUD8R9So3siDO5vRUS9Pi+lP2b0MveOxqLp5cMyiLubBf3sgGvICICSVLcG4+HUJmdZeQ=="
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/jest-resolve/-/jest-resolve-21.1.0.tgz",
+      "integrity": "sha512-HKh0pnf2SwR3hDaToONjHrR9ds282QFkxCA9xMet3JpsdLL24oRYMLSQ7jtepZfA6EP+XycRE6RfcMBD8emetg=="
     },
     "jest-resolve-dependencies": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/jest-resolve-dependencies/-/jest-resolve-dependencies-21.0.0.tgz",
-      "integrity": "sha512-GB2BFAvt8IsoGuOu1SZ4sRq/m3gljH81BLU99JKJSvU0dURjli3FEaPh6cHqZ2HyqyCPEdxI2Rx+mUkasXz9Mg=="
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/jest-resolve-dependencies/-/jest-resolve-dependencies-21.1.0.tgz",
+      "integrity": "sha512-Xj0mzS+Gh6ERgf9ofr5/vuqtyvTh4pAp4aVe6OkiZ4cLxUl6zQ6wByXMX0CLq0hwojFYmwwt+v3+fOAV7PqHPg=="
     },
     "jest-runner": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/jest-runner/-/jest-runner-21.0.0.tgz",
-      "integrity": "sha512-FFOUM6C0kNxgxVVmItoxi/UWNYWq4rn+uWj7HC4tMexjEfZb8esL8CvJ8DSDW+cVwfKEg/UqXpHJcUaFzE1k2w==",
-      "dependencies": {
-        "throat": {
-          "version": "3.2.0",
-          "resolved": "https://registry.npmjs.org/throat/-/throat-3.2.0.tgz",
-          "integrity": "sha512-/EY8VpvlqJ+sFtLPeOgc8Pl7kQVOWv0woD87KTXVHPIAE842FGT+rokxIhe8xIUP1cfgrkt0as0vDLjDiMtr8w=="
-        }
-      }
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/jest-runner/-/jest-runner-21.1.0.tgz",
+      "integrity": "sha512-EXFqEQRHSo6ksBrT+vRNoBRfIVVepQF56JfTczzXLs+dIKcq3DDKaiMkkehBc2LdHzm/e63qbhz2aeQn64qqlA=="
     },
     "jest-runtime": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/jest-runtime/-/jest-runtime-21.0.0.tgz",
-      "integrity": "sha512-qgYWvuLrk5G1oaahRqKkeTZud+O0BJYEFbw/BPBaO5N3Z9Q0H8LtLxiR1RH7KiHjg/BMKhcQCvZ5nN3HPAfIpw==",
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/jest-runtime/-/jest-runtime-21.1.0.tgz",
+      "integrity": "sha512-BNc1v8Cs6bjnti1JBCSGIJdSI/6MIGMMCiY+MpoyWXhoZGNLkUKGw7073lZtOo0PC/RZcXMDy1DcZXHH7YHKQw==",
       "dependencies": {
         "arr-diff": {
           "version": "2.0.0",
@@ -5275,14 +7001,21 @@
           "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
         },
         "camelcase": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
-          "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
+          "version": "4.1.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
+          "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
         },
         "cliui": {
           "version": "3.2.0",
           "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
-          "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
+          "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0=",
+          "dependencies": {
+            "string-width": {
+              "version": "1.0.2",
+              "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
+              "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
+            }
+          }
         },
         "expand-brackets": {
           "version": "0.1.5",
@@ -5294,52 +7027,84 @@
           "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
           "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
         },
-        "is-extglob": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
-          "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
-        },
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
           "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
         },
+        "load-json-file": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
+          "integrity": "sha1-eUfkIUmvgNaWy/eXvKq8/h/inKg="
+        },
         "micromatch": {
           "version": "2.3.11",
           "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
           "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
         },
+        "path-type": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/path-type/-/path-type-2.0.0.tgz",
+          "integrity": "sha1-8BLMuEFbcJb8LaoQVMPXI4lZTHM="
+        },
+        "pify": {
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+          "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
+        },
+        "read-pkg": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-2.0.0.tgz",
+          "integrity": "sha1-jvHAYjxqbbDcZxPEv6xGMysjaPg="
+        },
+        "read-pkg-up": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-2.0.0.tgz",
+          "integrity": "sha1-a3KoBImE4MQeeVEP1en6mbO1Sb4="
+        },
         "strip-bom": {
           "version": "3.0.0",
           "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
           "integrity": "sha1-IzTBjpx1n3vdVv3vfprj1YjmjtM="
         },
         "yargs": {
-          "version": "7.1.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-7.1.0.tgz",
-          "integrity": "sha1-a6MY6xaWFyf10oT46gA+jWFU0Mg="
+          "version": "9.0.1",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-9.0.1.tgz",
+          "integrity": "sha1-UqzCP+7Kw0BCB47njAwAf1CF20w="
         }
       }
     },
     "jest-snapshot": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/jest-snapshot/-/jest-snapshot-21.0.0.tgz",
-      "integrity": "sha512-WTwe9Q9I57167nB9VwPOVf8qE0DkOxJalMzFTNTfeW9rSOJfNFIL3ZFn0xSgO+dV5F3HSVcoJSVjxsMpI95DCQ=="
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/jest-snapshot/-/jest-snapshot-21.1.0.tgz",
+      "integrity": "sha512-oYASKqxO/Ghbdd96z/3KSQ1y4YUtqrQVzSKbnz3yjGsi1nu3AXMPmjRCM/CZXL+H+DAIgMirj5Uq0dZOxo6Bnw=="
     },
     "jest-util": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-21.0.0.tgz",
-      "integrity": "sha512-ojeYhnFUhGiZ7qsvCa5GV8ZvO5eM9Ha4Z39y7iUjs7Ws2y6JzLVmeh64vkcYf8C+IzwazcHan5vj6O8ESbsr4g=="
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-21.1.0.tgz",
+      "integrity": "sha512-PJxaShBieLpB55NV4+loIZHiOlfZHjAGzVRp9BDzrr2m70UxQViDJenNdz4edJMWXJLjp817t1QrWi+LjcRaKw=="
     },
     "jest-validate": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/jest-validate/-/jest-validate-21.0.0.tgz",
-      "integrity": "sha512-mwqGTj4vqzRHiyZpN0sRWFqSkq3lklQWlYAOZsZ2O13prSX1y21PDXI87SfLdAgsp+NOJgX8ZC/3UZ0DiKDL5Q=="
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/jest-validate/-/jest-validate-21.1.0.tgz",
+      "integrity": "sha512-xS0cyErNWpsLFlGkn/b87pk/Mv7J+mCTs8hQ4KmtOIIoM1sHYobXII8AtkoN8FC7E3+Ptxjo+/3xWk6LK1dKcw=="
+    },
+    "joi": {
+      "version": "9.2.0",
+      "resolved": "https://registry.npmjs.org/joi/-/joi-9.2.0.tgz",
+      "integrity": "sha1-M4WseQGSEwy+Iw6ALsAskhW7/to=",
+      "dependencies": {
+        "hoek": {
+          "version": "4.2.0",
+          "resolved": "https://registry.npmjs.org/hoek/-/hoek-4.2.0.tgz",
+          "integrity": "sha512-v0XCLxICi9nPfYrS9RL8HbYnXi9obYAeLbSP00BmnZwCK9+Ih9WOjoZ8YoHCoav2csqn4FOz4Orldsy2dmDwmQ=="
+        }
+      }
     },
     "js-base64": {
-      "version": "2.1.9",
-      "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.1.9.tgz",
-      "integrity": "sha1-8OgK4DmkvWVLXygfyT8EqRSn/M4="
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.3.2.tgz",
+      "integrity": "sha512-Y2/+DnfJJXT1/FCwUebUhLWb3QihxiSC42+ctHLGogmW2jPY6LCapMdFZXRvVP2z6qyKW7s6qncE/9gSqZiArw=="
     },
     "js-tokens": {
       "version": "3.0.2",
@@ -5367,6 +7132,11 @@
       "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
       "integrity": "sha1-597mbjXW/Bb3EP6R1c9p9w8IkR0="
     },
+    "jsmin": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/jsmin/-/jsmin-1.0.1.tgz",
+      "integrity": "sha1-570NzWSWw79IYyNb9GGj2YqjuYw="
+    },
     "json-loader": {
       "version": "0.5.7",
       "resolved": "https://registry.npmjs.org/json-loader/-/json-loader-0.5.7.tgz",
@@ -5412,6 +7182,11 @@
       "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz",
       "integrity": "sha1-LHS27kHZPKUbe1qu6PUDYx0lKnM="
     },
+    "jsonpointer": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/jsonpointer/-/jsonpointer-4.0.1.tgz",
+      "integrity": "sha1-T9kss04OnbPInIYi7PUfm5eMbLk="
+    },
     "jsprim": {
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.1.tgz",
@@ -5429,6 +7204,18 @@
       "resolved": "https://registry.npmjs.org/just-extend/-/just-extend-1.1.22.tgz",
       "integrity": "sha1-MzCvdWyralQnAMZLLk5KoGLVL/8="
     },
+    "jxLoader": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/jxLoader/-/jxLoader-0.1.1.tgz",
+      "integrity": "sha1-ATTqUUTlM7WU/B/yX/GU4jXFPs0=",
+      "dependencies": {
+        "js-yaml": {
+          "version": "0.3.7",
+          "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-0.3.7.tgz",
+          "integrity": "sha1-1znY7oZGHlSzVNan19HyrZoWf2I="
+        }
+      }
+    },
     "karma": {
       "version": "1.7.1",
       "resolved": "https://registry.npmjs.org/karma/-/karma-1.7.1.tgz",
@@ -5529,10 +7316,15 @@
       "resolved": "https://registry.npmjs.org/kew/-/kew-0.7.0.tgz",
       "integrity": "sha1-edk9LTM2PW/dKXCzNdkUGtWR15s="
     },
+    "keycode": {
+      "version": "2.1.9",
+      "resolved": "https://registry.npmjs.org/keycode/-/keycode-2.1.9.tgz",
+      "integrity": "sha1-lkojxU5IiUBbSGGlyfBIDUUUHfo="
+    },
     "kind-of": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-4.0.0.tgz",
-      "integrity": "sha1-IIE989cSkosgc3hpGkUGb65y3Vc="
+      "version": "5.0.2",
+      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
+      "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
     },
     "klaw": {
       "version": "1.3.1",
@@ -5562,7 +7354,14 @@
     "load-json-file": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
-      "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA="
+      "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
+      "dependencies": {
+        "pify": {
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+          "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
+        }
+      }
     },
     "loader-runner": {
       "version": "2.3.0",
@@ -5579,11 +7378,21 @@
       "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-2.0.0.tgz",
       "integrity": "sha1-K1aLJl7slExtnA3pw9u7ygNUzY4="
     },
+    "lock": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/lock/-/lock-0.1.4.tgz",
+      "integrity": "sha1-/sfervF+fDoKVeHaBCgD4l2RdF0="
+    },
     "lodash": {
       "version": "4.17.4",
       "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
       "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
     },
+    "lodash-es": {
+      "version": "4.17.4",
+      "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.4.tgz",
+      "integrity": "sha1-3MHXVS4VCgZABzupyzHXDwMpUOc="
+    },
     "lodash._arraycopy": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/lodash._arraycopy/-/lodash._arraycopy-3.0.0.tgz",
@@ -5664,6 +7473,11 @@
       "resolved": "https://registry.npmjs.org/lodash.create/-/lodash.create-3.1.1.tgz",
       "integrity": "sha1-1/KEnw29p+BGgruM1yqwIkYd6+c="
     },
+    "lodash.debounce": {
+      "version": "4.0.8",
+      "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
+      "integrity": "sha1-gteb/zCmfEAF/9XiUVMArZyk168="
+    },
     "lodash.defaults": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-4.2.0.tgz",
@@ -5679,11 +7493,21 @@
       "resolved": "https://registry.npmjs.org/lodash.flatten/-/lodash.flatten-4.4.0.tgz",
       "integrity": "sha1-8xwiIlqWMtK7+OSt2+8kCqdlph8="
     },
+    "lodash.flattendeep": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/lodash.flattendeep/-/lodash.flattendeep-4.4.0.tgz",
+      "integrity": "sha1-+wMJF/hqMTTlvJvsDWngAT3f7bI="
+    },
     "lodash.foreach": {
       "version": "4.5.0",
       "resolved": "https://registry.npmjs.org/lodash.foreach/-/lodash.foreach-4.5.0.tgz",
       "integrity": "sha1-Gmo16s5AEoDH8G3d7DUWWrJ+PlM="
     },
+    "lodash.get": {
+      "version": "4.4.2",
+      "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
+      "integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk="
+    },
     "lodash.isarguments": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz",
@@ -5694,6 +7518,11 @@
       "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz",
       "integrity": "sha1-eeTriMNqgSKvhvhEqpvNhRtfu1U="
     },
+    "lodash.isplainobject": {
+      "version": "4.0.6",
+      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
+      "integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs="
+    },
     "lodash.keys": {
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz",
@@ -5739,6 +7568,11 @@
       "resolved": "https://registry.npmjs.org/lodash.some/-/lodash.some-4.6.0.tgz",
       "integrity": "sha1-G7nzFO9ri63tE7VJFpsqlF62jk0="
     },
+    "lodash.sortby": {
+      "version": "4.7.0",
+      "resolved": "https://registry.npmjs.org/lodash.sortby/-/lodash.sortby-4.7.0.tgz",
+      "integrity": "sha1-7dFMgk4sycHgsKG0K7UhBRakJDg="
+    },
     "lodash.tail": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/lodash.tail/-/lodash.tail-4.1.1.tgz",
@@ -5804,9 +7638,9 @@
       }
     },
     "loglevel": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/loglevel/-/loglevel-1.4.1.tgz",
-      "integrity": "sha1-lbOD+Ro8J1b9SrCTZn5DCRYfK80="
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/loglevel/-/loglevel-1.5.0.tgz",
+      "integrity": "sha512-OQ2jhWI5G2qsvO0UFNyCQWgKl/tFiwuPIXxELzACeUO2FqstN/R7mmL09+nhv6xOWVPPojQO1A90sCEoJSgBcQ=="
     },
     "lolex": {
       "version": "1.6.0",
@@ -5829,20 +7663,44 @@
       "integrity": "sha1-W0b4AUft7leIcPCG0Eghz5mOVR8="
     },
     "lru-cache": {
-      "version": "2.2.4",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.2.4.tgz",
-      "integrity": "sha1-bGWGGb7PFAMdDQtZSxYELOTcBj0="
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.1.tgz",
+      "integrity": "sha512-q4spe4KTfsAS1SUHLO0wz8Qiyf1+vMIAgpRYioFYDMNqKfHQbg+AVDH3i4fvpl71/P1L0dBl+fQi+P37UYf0ew=="
     },
     "macaddress": {
       "version": "0.2.8",
       "resolved": "https://registry.npmjs.org/macaddress/-/macaddress-0.2.8.tgz",
       "integrity": "sha1-WQTcU3w57G2+/q6QIycTX6hRHxI="
     },
+    "make-dir": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-1.0.0.tgz",
+      "integrity": "sha1-l6ARdR6R3YfPre9Ygy67BJNt6Xg=",
+      "dependencies": {
+        "pify": {
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+          "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
+        }
+      }
+    },
     "makeerror": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/makeerror/-/makeerror-1.0.11.tgz",
       "integrity": "sha1-4BpckQnyr3lmDk6LlYd5AYT1qWw="
     },
+    "mantra-core": {
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/mantra-core/-/mantra-core-1.7.0.tgz",
+      "integrity": "sha1-qMg+jO6D72pzgxMVGf6AMa1UY4Y=",
+      "dependencies": {
+        "react-komposer": {
+          "version": "1.13.1",
+          "resolved": "https://registry.npmjs.org/react-komposer/-/react-komposer-1.13.1.tgz",
+          "integrity": "sha1-S4rEvMcTI710E9yrlcgxGX9Q7tA="
+        }
+      }
+    },
     "map-cache": {
       "version": "0.2.2",
       "resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz",
@@ -5854,9 +7712,9 @@
       "integrity": "sha1-2TPOuSBdgr3PSIb2dCvcK03qFG0="
     },
     "map-visit": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/map-visit/-/map-visit-0.1.5.tgz",
-      "integrity": "sha1-2+Q5J85VJbgN/BVzpE1oxR8mgWs="
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/map-visit/-/map-visit-1.0.0.tgz",
+      "integrity": "sha1-7Nyo8TFE5mDxtb1B8S80edmN+48="
     },
     "marked": {
       "version": "0.3.6",
@@ -5945,9 +7803,9 @@
       "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4="
     },
     "micromatch": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-3.0.4.tgz",
-      "integrity": "sha1-FUPx0EgTRHrIUgAcX1qTNAF4bR0="
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-3.1.0.tgz",
+      "integrity": "sha512-3StSelAE+hnRvMs8IdVW7Uhk8CVed5tp+kLLGlBP6WiRAXS21GPGu/Nat4WNPXj2Eoc24B02SaeoyozPMfj0/g=="
     },
     "miller-rabin": {
       "version": "4.0.0",
@@ -5974,6 +7832,11 @@
       "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-1.1.0.tgz",
       "integrity": "sha1-5md4PZLonb00KBi1IwudYqZyrRg="
     },
+    "min-document": {
+      "version": "2.19.0",
+      "resolved": "https://registry.npmjs.org/min-document/-/min-document-2.19.0.tgz",
+      "integrity": "sha1-e9KC4/WELtKVu3SM3Z8f+iyCRoU="
+    },
     "minimalistic-assert": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.0.tgz",
@@ -6016,6 +7879,16 @@
       "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
       "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM="
     },
+    "mkpath": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/mkpath/-/mkpath-0.1.0.tgz",
+      "integrity": "sha1-dVSm+Nhxg0zJe1RisSLEwSTW3pE="
+    },
+    "mobx": {
+      "version": "2.7.0",
+      "resolved": "https://registry.npmjs.org/mobx/-/mobx-2.7.0.tgz",
+      "integrity": "sha1-zz2C0YwMp/RY2PKiQIF7PcflSgE="
+    },
     "mocha": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz",
@@ -6063,6 +7936,16 @@
       "resolved": "https://registry.npmjs.org/mocha-clean/-/mocha-clean-0.4.0.tgz",
       "integrity": "sha1-CbaYXDIYFhQDIeED593ktIdgkhw="
     },
+    "moment": {
+      "version": "2.18.1",
+      "resolved": "https://registry.npmjs.org/moment/-/moment-2.18.1.tgz",
+      "integrity": "sha1-w2GT3Tzhwu7SrbfIAtu8d6gbHA8="
+    },
+    "moo-server": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/moo-server/-/moo-server-1.3.0.tgz",
+      "integrity": "sha1-XceVaVZaENbv7VQ5SR5p0jkuWPE="
+    },
     "ms": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
@@ -6084,9 +7967,9 @@
       "integrity": "sha1-2Vv3IeyHfgjbJ27T/G63j5CDrUY="
     },
     "nanomatch": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.0.tgz",
-      "integrity": "sha1-dv2z1K52F+N3GeekBHuECFfAyxw="
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.3.tgz",
+      "integrity": "sha512-HqDMQWJlwpXbfKDpAnkc6AJQh5PFqVlrjYbruDjYVAS+05TQUb1qhIde4G9jMzHbs/u6bgEok1jMAV4yJzoh+w=="
     },
     "native-promise-only": {
       "version": "0.8.1",
@@ -6108,10 +7991,20 @@
       "resolved": "https://registry.npmjs.org/netrc/-/netrc-0.1.4.tgz",
       "integrity": "sha1-a+lPysqNd63gqWcNxGCRTJRHJEQ="
     },
+    "ngrok": {
+      "version": "2.2.22",
+      "resolved": "https://registry.npmjs.org/ngrok/-/ngrok-2.2.22.tgz",
+      "integrity": "sha1-j3YmTmMFedJSSu+yOzG/5OFeEOs="
+    },
     "nise": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/nise/-/nise-1.0.1.tgz",
-      "integrity": "sha1-DakrEKhU6XwPSW9sKEWjASgLPu8="
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/nise/-/nise-1.1.0.tgz",
+      "integrity": "sha512-lIFidCxB0mJGyq1i33tLRNojtMoYX95EAI7WQEU+/ees0w6hvXZQHZ7WD130Tjeh5+YJAUVLfQ3k/s9EA8jj+w=="
+    },
+    "node-dir": {
+      "version": "0.1.17",
+      "resolved": "https://registry.npmjs.org/node-dir/-/node-dir-0.1.17.tgz",
+      "integrity": "sha1-X1Zl2TNRM1yqvvjxxVRRbPXx5OU="
     },
     "node-emoji": {
       "version": "1.8.1",
@@ -6119,9 +8012,9 @@
       "integrity": "sha512-+ktMAh1Jwas+TnGodfCfjUbJKoANqPaJFN0z0iqh41eqD8dvguNzcitVSBSVK1pidz0AqGbLKcoVuVLRVZ/aVg=="
     },
     "node-fetch": {
-      "version": "1.7.2",
-      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.2.tgz",
-      "integrity": "sha512-xZZUq2yDhKMIn/UgG5q//IZSNLJIwW2QxS14CNH5spuiXkITM2pUitjdq58yLSaU7m4M0wBNaM2Gh/ggY4YJig=="
+      "version": "1.7.3",
+      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.3.tgz",
+      "integrity": "sha512-NhZ4CsKx7cYm2vSrBAr2PvFOe6sWDf0UYLRqA6svUYg7+/TSfVAu49jYC4BvQ4Sms9SZgdqGBgroqfDhJdTyKQ=="
     },
     "node-forge": {
       "version": "0.6.33",
@@ -6184,6 +8077,11 @@
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
         },
+        "cross-spawn": {
+          "version": "3.0.1",
+          "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-3.0.1.tgz",
+          "integrity": "sha1-ElYDfsufDF9549bvE14wdwGEuYI="
+        },
         "supports-color": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
@@ -6301,16 +8199,9 @@
       "integrity": "sha1-xUYBd4rVYPEULODgG8yotW0TQm0="
     },
     "object-visit": {
-      "version": "0.3.4",
-      "resolved": "https://registry.npmjs.org/object-visit/-/object-visit-0.3.4.tgz",
-      "integrity": "sha1-rhXPhvCy/dVRdxY2RIRSxUw9qCk=",
-      "dependencies": {
-        "isobject": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
-          "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk="
-        }
-      }
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/object-visit/-/object-visit-1.0.1.tgz",
+      "integrity": "sha1-95xEk68MU3e1n+OdOV5BBC3QRbs="
     },
     "object.assign": {
       "version": "4.0.4",
@@ -6322,6 +8213,11 @@
       "resolved": "https://registry.npmjs.org/object.entries/-/object.entries-1.0.4.tgz",
       "integrity": "sha1-G/mk3SKI9bM/Opk9JXZh8F0WGl8="
     },
+    "object.getownpropertydescriptors": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/object.getownpropertydescriptors/-/object.getownpropertydescriptors-2.0.3.tgz",
+      "integrity": "sha1-h1jIRvW0B62rDyNuCYbxSwUcqhY="
+    },
     "object.omit": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/object.omit/-/object.omit-2.0.1.tgz",
@@ -6343,14 +8239,14 @@
       "integrity": "sha1-EEEktsYCxnlogaBCVB0220OlJk4="
     },
     "office-ui-fabric-core": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-7.2.0.tgz",
-      "integrity": "sha1-JKwXdDPkou6REP5DWAutBZ+gBQk="
+      "version": "7.3.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-7.3.0.tgz",
+      "integrity": "sha1-43rwTiOwkfZTYNsknbi7DzEpH2A="
     },
     "office-ui-fabric-react": {
-      "version": "4.40.1",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.40.1.tgz",
-      "integrity": "sha512-MR+SFJCwQe7w6NJ3zlV6cdPSIlS5iA2sNYBD0ndwf8AImvDGAl2pnRodtX78A2FiMsvuoejELcek6TlMv2uwXQ=="
+      "version": "4.48.1",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.48.1.tgz",
+      "integrity": "sha512-SOfhxkDB62vGP6ozRA1oT+8lfbGliRwsf9t5cYszRf4LB4Wf7OzrSso+M0+GFLBbTcAA0+2qPM3vFAsV+B/3tg=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -6378,9 +8274,9 @@
       "integrity": "sha1-XG2ixdflgx6P+jlklQ+NZnSskLg="
     },
     "opn": {
-      "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/opn/-/opn-4.0.2.tgz",
-      "integrity": "sha1-erwi5kTf9jsKltWrfyeQwPAavJU="
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/opn/-/opn-5.1.0.tgz",
+      "integrity": "sha512-iPNl7SyM8L30Rm1sjGdLLheyHVw5YXVfi3SKWJzBI7efxRwHojfRFjwE/OLM6qp9xJYMgab8WicTU1cPoY+Hpg=="
     },
     "optimist": {
       "version": "0.6.1",
@@ -6427,9 +8323,9 @@
       "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M="
     },
     "os-locale": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
-      "integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk="
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-2.1.0.tgz",
+      "integrity": "sha512-3sslG3zJbEYcaC4YVAvDorjGxc7tv6KVATnLPZONiljsUncvihe9BQoVCEs0RZ1kmf4Hk9OBqlZfJZWI4GanKA=="
     },
     "os-tmpdir": {
       "version": "1.0.2",
@@ -6462,9 +8358,9 @@
       "integrity": "sha1-IKAQOyIqcMj9OcwuWAaA893l7EM="
     },
     "p-map": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/p-map/-/p-map-1.1.1.tgz",
-      "integrity": "sha1-BfXkrpegaDcbwqXMhr+9vBnErno="
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/p-map/-/p-map-1.2.0.tgz",
+      "integrity": "sha512-r6zKACMNhjPJMTl8KcFH4li//gkrXWfbD6feV8l6doRHlzljFWGJ2AP6iKaCJXyZmAUMOPtvbW7EXkbWO/pLEA=="
     },
     "pako": {
       "version": "0.2.9",
@@ -6479,14 +8375,7 @@
     "parse-glob": {
       "version": "3.0.4",
       "resolved": "https://registry.npmjs.org/parse-glob/-/parse-glob-3.0.4.tgz",
-      "integrity": "sha1-ssN2z7EfNVE7rdFz7wu246OIORw=",
-      "dependencies": {
-        "is-extglob": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
-          "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
-        }
-      }
+      "integrity": "sha1-ssN2z7EfNVE7rdFz7wu246OIORw="
     },
     "parse-json": {
       "version": "2.2.0",
@@ -6514,9 +8403,9 @@
       "integrity": "sha1-gCBKUNTbt3m/3G6+J3jZDkvOMgo="
     },
     "parseurl": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.1.tgz",
-      "integrity": "sha1-yKuMkiO6NIiKpkopeyiFO+wY2lY="
+      "version": "1.3.2",
+      "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.2.tgz",
+      "integrity": "sha1-/CidTtiZMRlGDBViUyYs3I3mW/M="
     },
     "pascalcase": {
       "version": "0.1.1",
@@ -6568,7 +8457,14 @@
     "path-type": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
-      "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE="
+      "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE=",
+      "dependencies": {
+        "pify": {
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+          "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
+        }
+      }
     },
     "pathval": {
       "version": "1.1.0",
@@ -6576,9 +8472,9 @@
       "integrity": "sha1-uULm1L3mUwBe9rcTYd74cn0GReA="
     },
     "pbkdf2": {
-      "version": "3.0.13",
-      "resolved": "https://registry.npmjs.org/pbkdf2/-/pbkdf2-3.0.13.tgz",
-      "integrity": "sha512-+dCHxDH+djNtjgWmvVC/my3SYBAKpKNqKSjLkp+GtWWYe4XPE+e/PSD2aCanlEZZnqPk2uekTKNC/ccbwd2X2Q=="
+      "version": "3.0.14",
+      "resolved": "https://registry.npmjs.org/pbkdf2/-/pbkdf2-3.0.14.tgz",
+      "integrity": "sha512-gjsZW9O34fm0R7PaLHRJmLLVfSoesxztjPjE9o6R+qtVJij90ltg1joIovN9GKrRW3t1PzhDDG3UMEMFfZ+1wA=="
     },
     "pend": {
       "version": "1.2.0",
@@ -6613,9 +8509,9 @@
       }
     },
     "pify": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
-      "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
+      "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY="
     },
     "pinkie": {
       "version": "2.0.4",
@@ -6632,6 +8528,11 @@
       "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-2.0.0.tgz",
       "integrity": "sha1-9tXREJ4Z1j7fQo4L1X4Sd3YVM0s="
     },
+    "podda": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/podda/-/podda-1.2.2.tgz",
+      "integrity": "sha1-FbDtvTNK3hRYEzQ/Xs+cEKcc9QA="
+    },
     "portfinder": {
       "version": "1.0.13",
       "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.13.tgz",
@@ -6650,9 +8551,9 @@
       "integrity": "sha1-AerA/jta9xoqbAL+q7jB/vfgDqs="
     },
     "postcss": {
-      "version": "6.0.10",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.10.tgz",
-      "integrity": "sha512-7WOpqea/cQHH1XUXdN1mqoFFmhigW3KAXJ+ssMOk/f6mKmwqFgqqdwsnjLGH+wuY+kwaJvT4whHcfKt5kWga0A=="
+      "version": "6.0.11",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.11.tgz",
+      "integrity": "sha512-DsnIzznNRQprsGTALpkC0xjDygo+QcOd+qVjP9+RjyzrPiyYOXBGOwoJ4rAiiE4lu6JggQ/jW4niY24WLxuncg=="
     },
     "postcss-calc": {
       "version": "5.3.1",
@@ -7005,6 +8906,11 @@
         }
       }
     },
+    "postcss-flexbugs-fixes": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/postcss-flexbugs-fixes/-/postcss-flexbugs-fixes-3.2.0.tgz",
+      "integrity": "sha512-0AuD9HG1Ey3/3nqPWu9yqf7rL0KCPu5VgjDsjf5mzEcuo9H/z8nco/fljKgjsOUrZypa95MI0kS4xBZeBzz2lw=="
+    },
     "postcss-load-config": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-1.2.0.tgz",
@@ -7705,9 +9611,9 @@
       "integrity": "sha1-gV7R9uvGWSb4ZbMQwHE7yzMVzks="
     },
     "pretty-format": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-21.0.0.tgz",
-      "integrity": "sha512-xICDS0AgbFdP8RNDxi58hOWfm7CDjC88PPx49PA8GmBs6WBwWEMLRT6lU0mtX9snTBBMncQxDNs4rMloCjZwuA==",
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-21.1.0.tgz",
+      "integrity": "sha512-041BVxr2pp7uGG8slfw43ysRXSaBIVqo5Li03BwI3K1/9oENlhkEEYWPkHpDzj7NlJ3GZte+Tv/DId5g2PLduA==",
       "dependencies": {
         "ansi-regex": {
           "version": "3.0.0",
@@ -7741,6 +9647,16 @@
       "resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz",
       "integrity": "sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg=="
     },
+    "promise.prototype.finally": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/promise.prototype.finally/-/promise.prototype.finally-3.0.1.tgz",
+      "integrity": "sha512-5o2ue0smn+Wn6tdkqN4wxB27lCu84UrladpMRQ3fm1tEkewOrhAGSOHwj15SRU+oE/ParFTou6XG3Jhgyb9sjw=="
+    },
+    "promised-io": {
+      "version": "0.3.5",
+      "resolved": "https://registry.npmjs.org/promised-io/-/promised-io-0.3.5.tgz",
+      "integrity": "sha1-StIXuzZYvKrplGsXqGaOzYUeE1Y="
+    },
     "prop-types": {
       "version": "15.5.10",
       "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.5.10.tgz",
@@ -7806,10 +9722,29 @@
       "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-0.0.4.tgz",
       "integrity": "sha1-DPf4T5Rj/wrlHExLFC2VvjdyTZw="
     },
+    "radium": {
+      "version": "0.19.4",
+      "resolved": "https://registry.npmjs.org/radium/-/radium-0.19.4.tgz",
+      "integrity": "sha1-VqpJ/eYYHS9eH6V7RxD/0MI96CA=",
+      "dependencies": {
+        "inline-style-prefixer": {
+          "version": "2.0.5",
+          "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-2.0.5.tgz",
+          "integrity": "sha1-wVPH6I/YT+9cYC6VqBaLJ3BnH+c="
+        }
+      }
+    },
     "randomatic": {
       "version": "1.1.7",
       "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-1.1.7.tgz",
-      "integrity": "sha512-D5JUjPyJbaJDkuAazpVnSfVkLlpeO3wDlPROTMLGKG1zMFNFRgrciKo1ltz/AzNTkqE0HzDx655QOL51N06how=="
+      "integrity": "sha512-D5JUjPyJbaJDkuAazpVnSfVkLlpeO3wDlPROTMLGKG1zMFNFRgrciKo1ltz/AzNTkqE0HzDx655QOL51N06how==",
+      "dependencies": {
+        "kind-of": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-4.0.0.tgz",
+          "integrity": "sha1-IIE989cSkosgc3hpGkUGb65y3Vc="
+        }
+      }
     },
     "randombytes": {
       "version": "2.0.5",
@@ -7822,14 +9757,14 @@
       "integrity": "sha1-9JvmtIeJTdxA3MlKMi9hEJLgDV4="
     },
     "raw-body": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.2.0.tgz",
-      "integrity": "sha1-mUl2z2pQlqQRYoQEkvC9xdbn+5Y=",
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.3.2.tgz",
+      "integrity": "sha1-vNYMd9Prk83gBQKVw/N5OJvIj4k=",
       "dependencies": {
         "iconv-lite": {
-          "version": "0.4.15",
-          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.15.tgz",
-          "integrity": "sha1-/iZaIYrGpXz+hUkn6dBMGYJe3es="
+          "version": "0.4.19",
+          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.19.tgz",
+          "integrity": "sha512-oTZqweIP51xaGPI4uPa56/Pri/480R+mo7SeU+YETByQNhDG55ycFyNLIgta9vXhILrxXDmF7ZGhqZIcuN0gJQ=="
         }
       }
     },
@@ -7848,16 +9783,105 @@
       "resolved": "https://registry.npmjs.org/react-addons-test-utils/-/react-addons-test-utils-15.4.2.tgz",
       "integrity": "sha1-k7yqcY/K5zYNQuj7HAl1bMNjAqI="
     },
+    "react-docgen": {
+      "version": "2.18.0",
+      "resolved": "https://registry.npmjs.org/react-docgen/-/react-docgen-2.18.0.tgz",
+      "integrity": "sha512-6AEkA5QqtgkW4xvw9fy2AdXTo308wmnHx4A1oTZBZfciuZsaq0j2iTnv+5wKroV4nWo3JF+EQ72SjWO1U7YZZA==",
+      "dependencies": {
+        "babylon": {
+          "version": "5.8.38",
+          "resolved": "https://registry.npmjs.org/babylon/-/babylon-5.8.38.tgz",
+          "integrity": "sha1-7JsSCxG/bM1Bc6GL8hfmC3mFn/0="
+        }
+      }
+    },
     "react-dom": {
       "version": "15.4.2",
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-15.4.2.tgz",
       "integrity": "sha1-AVNj8FsKH9Uq6e/dOgBg2QaVII8="
     },
+    "react-dom-factories": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/react-dom-factories/-/react-dom-factories-1.0.1.tgz",
+      "integrity": "sha1-xQaSrF/xrbOdht/m2+NIXaz1hFU="
+    },
     "react-highlight": {
       "version": "0.9.0",
       "resolved": "https://registry.npmjs.org/react-highlight/-/react-highlight-0.9.0.tgz",
       "integrity": "sha1-1e3udEzLhon3k4eUtqG1VLsVDrc="
     },
+    "react-html-attributes": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/react-html-attributes/-/react-html-attributes-1.4.1.tgz",
+      "integrity": "sha1-l7XscQ2miDNZjIvm+JrENiFoQKU="
+    },
+    "react-icon-base": {
+      "version": "2.0.7",
+      "resolved": "https://registry.npmjs.org/react-icon-base/-/react-icon-base-2.0.7.tgz",
+      "integrity": "sha1-C9GHNr1s55ym1pzoOHoH+41M7/4=",
+      "dependencies": {
+        "prop-types": {
+          "version": "15.5.8",
+          "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.5.8.tgz",
+          "integrity": "sha1-a3suFBCDvjjIWVqlH8VXdccZk5Q="
+        }
+      }
+    },
+    "react-icons": {
+      "version": "2.2.5",
+      "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-2.2.5.tgz",
+      "integrity": "sha1-+UJQHCGkzARWziu+5QMsk/YFHc8="
+    },
+    "react-inspector": {
+      "version": "2.1.4",
+      "resolved": "https://registry.npmjs.org/react-inspector/-/react-inspector-2.1.4.tgz",
+      "integrity": "sha1-ISP6t09orjE2+9AjkvrbdkMm0E0="
+    },
+    "react-komposer": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/react-komposer/-/react-komposer-2.0.0.tgz",
+      "integrity": "sha1-uWRzgBSptK7klKg8C1uDPWYHKpA="
+    },
+    "react-modal": {
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-2.3.2.tgz",
+      "integrity": "sha512-m+urZGPk+RfUrGj0b8uraZ2dQQo/AABZ+s6aZeZxEpbhMwWZ4WhVr03iYbWTvSatSnC+5x9c2k6qm95N1ybohg=="
+    },
+    "react-remarkable": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/react-remarkable/-/react-remarkable-1.1.1.tgz",
+      "integrity": "sha1-N5CKyViUV20NORh70om8LLtaxt4="
+    },
+    "react-simple-di": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/react-simple-di/-/react-simple-di-1.2.0.tgz",
+      "integrity": "sha1-3eDlv2ifOR7yqwLJBDshP+I5xtA="
+    },
+    "react-split-pane": {
+      "version": "0.1.66",
+      "resolved": "https://registry.npmjs.org/react-split-pane/-/react-split-pane-0.1.66.tgz",
+      "integrity": "sha512-k4F0+BaHkPn0WclipkxEDL18Td2Ocgu+XzhOZznGngWk2l3mB5ujX7jxd5DSa8spHIuCGKQXzgjrk7rc2Y5BUQ=="
+    },
+    "react-stubber": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/react-stubber/-/react-stubber-1.0.0.tgz",
+      "integrity": "sha1-Qe4srHLU1P1wpjiW2pjhNzm4Rig="
+    },
+    "react-style-proptype": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/react-style-proptype/-/react-style-proptype-3.0.0.tgz",
+      "integrity": "sha1-ieC2RvJmxlarsPDdggLb1QNsMeY="
+    },
+    "react-transition-group": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-1.2.0.tgz",
+      "integrity": "sha1-tR/JIbDDg1p+98Vxx5/ILHPpIE8="
+    },
+    "react-treebeard": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/react-treebeard/-/react-treebeard-2.0.3.tgz",
+      "integrity": "sha512-fqSmx0RPuUxvG5kQantyW89HnOCjz6e53o3AajuaXSVWL8O8tXNUCoSdxaO6xScXpujIV+iVaYUGBpOm5Pdhiw=="
+    },
     "read-pkg": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
@@ -7890,6 +9914,23 @@
       "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-2.1.0.tgz",
       "integrity": "sha1-TtCtBg3zBzMAxIRANz9y0cxkLXg="
     },
+    "recast": {
+      "version": "0.12.6",
+      "resolved": "https://registry.npmjs.org/recast/-/recast-0.12.6.tgz",
+      "integrity": "sha1-Sw+4L+sdELO9YtNJQ0Jtmz7TDUw=",
+      "dependencies": {
+        "esprima": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.0.tgz",
+          "integrity": "sha512-oftTcaMu/EGrEIu904mWteKIv8vMuOgGYo7EhVJJN00R/EED9DCua/xxHRdYnKtcECzVg7xOWhflvJMnqcFZjw=="
+        }
+      }
+    },
+    "rechoir": {
+      "version": "0.6.2",
+      "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz",
+      "integrity": "sha1-hSBLVNuoLVdC4oyWdW70OvUOM4Q="
+    },
     "redent": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/redent/-/redent-1.0.0.tgz",
@@ -7931,16 +9972,26 @@
         }
       }
     },
+    "redux": {
+      "version": "3.7.2",
+      "resolved": "https://registry.npmjs.org/redux/-/redux-3.7.2.tgz",
+      "integrity": "sha512-pNqnf9q1hI5HHZRBkj3bAngGZW/JMCmexDlOxw4XagXY2o1327nHH54LoTjiPJ0gizoqPDRqWyX/00g0hD6w+A=="
+    },
     "regenerate": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.3.2.tgz",
-      "integrity": "sha1-0ZQcZ7rUN+G+dkM63Vs4X5WxkmA="
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.3.3.tgz",
+      "integrity": "sha512-jVpo1GadrDAK59t/0jRx5VxYWQEDkkEKi6+HjE3joFVLfDOh9Xrdh0dF1eSq+BI/SwvTQ44gSscJ8N5zYL61sg=="
     },
     "regenerator-runtime": {
       "version": "0.11.0",
       "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.0.tgz",
       "integrity": "sha512-/aA0kLeRb5N9K0d4fw7ooEbI+xDe+DKD499EQqygGqeS8N3xto15p09uY2xj7ixP81sNPXvRLnAQIqdVStgb1A=="
     },
+    "regenerator-transform": {
+      "version": "0.10.1",
+      "resolved": "https://registry.npmjs.org/regenerator-transform/-/regenerator-transform-0.10.1.tgz",
+      "integrity": "sha512-PJepbvDbuK1xgIgnau7Y90cwaAmO/LCLMI2mPvaXq2heGMR3aWW5/BQvYrhJ8jgmQjXewXvBjzfqKcVOmhjZ6Q=="
+    },
     "regex-cache": {
       "version": "0.4.4",
       "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.4.tgz",
@@ -7966,6 +10017,18 @@
       "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz",
       "integrity": "sha1-fuj4Tcb6eS0/0K4ijSS9lJ6tIFw="
     },
+    "remarkable": {
+      "version": "1.7.1",
+      "resolved": "https://registry.npmjs.org/remarkable/-/remarkable-1.7.1.tgz",
+      "integrity": "sha1-qspJchALZqZCpjoQIcpLrBvjv/Y=",
+      "dependencies": {
+        "argparse": {
+          "version": "0.1.16",
+          "resolved": "https://registry.npmjs.org/argparse/-/argparse-0.1.16.tgz",
+          "integrity": "sha1-z9AeD7uj1srtBJ+9dY1A9lGW9Xw="
+        }
+      }
+    },
     "remove-trailing-separator": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.1.0.tgz",
@@ -7996,6 +10059,16 @@
       "resolved": "https://registry.npmjs.org/request-progress/-/request-progress-2.0.1.tgz",
       "integrity": "sha1-XTa7V5YcZzqlt4jbyBQf3yO0Tgg="
     },
+    "request-promise": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/request-promise/-/request-promise-4.1.1.tgz",
+      "integrity": "sha1-JgIeT29W/Uwwn2vx69jJepWsH7U="
+    },
+    "request-promise-core": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/request-promise-core/-/request-promise-core-1.1.1.tgz",
+      "integrity": "sha1-Pu4AssWqgyOc+wTFcA2jb4HNCLY="
+    },
     "require-directory": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
@@ -8037,9 +10110,9 @@
       "integrity": "sha1-YTObci/mo1FWiSENJOFMlhSGE+8="
     },
     "rimraf": {
-      "version": "2.6.1",
-      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.1.tgz",
-      "integrity": "sha1-wjOOxkPfeht/5cVPqG9XQopV8z0="
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.2.tgz",
+      "integrity": "sha512-lreewLK/BlghmxtfH36YYVg1i8IAce4TI7oao75I1g245+6BctqTVQiBP3YUJ9C6DQOXJmkYR9X9fCLtCOJc5w=="
     },
     "ripemd160": {
       "version": "2.0.1",
@@ -8047,9 +10120,9 @@
       "integrity": "sha1-D0WEKVxTo2KK9+bXmsohzlfRxuc="
     },
     "rtl-css-js": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.3.0.tgz",
-      "integrity": "sha1-TJhtJEbOLYY4mnFu2MFIllf8oDc="
+      "version": "1.4.2",
+      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.4.2.tgz",
+      "integrity": "sha512-B8FeAyK3MLawmJK5BD1qo52MzNoOZw2FjoO43SkU0PQXX2v4H6jd+mRgpk7a78FgxNq4cbdbZudyD+uPGKJXHg=="
     },
     "safe-buffer": {
       "version": "5.1.1",
@@ -8088,35 +10161,294 @@
           "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
           "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
         },
+        "os-locale": {
+          "version": "1.4.0",
+          "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
+          "integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk="
+        },
+        "string-width": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
+          "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
+        },
+        "which-module": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/which-module/-/which-module-1.0.0.tgz",
+          "integrity": "sha1-u6Y8qGGUiZT/MHc2CJ47lgJsKk8="
+        },
         "yargs": {
           "version": "7.1.0",
           "resolved": "https://registry.npmjs.org/yargs/-/yargs-7.1.0.tgz",
           "integrity": "sha1-a6MY6xaWFyf10oT46gA+jWFU0Mg="
+        },
+        "yargs-parser": {
+          "version": "5.0.0",
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-5.0.0.tgz",
+          "integrity": "sha1-J17PDX/+Bcd+ZOfIbkzZS/DhIoo="
         }
       }
     },
     "sass-loader": {
       "version": "6.0.6",
       "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-6.0.6.tgz",
-      "integrity": "sha512-c3/Zc+iW+qqDip6kXPYLEgsAu2lf4xz0EZDplB7EmSUMda12U1sGJPetH55B/j9eu0bTtKzKlNPWWyYC7wFNyQ==",
+      "integrity": "sha512-c3/Zc+iW+qqDip6kXPYLEgsAu2lf4xz0EZDplB7EmSUMda12U1sGJPetH55B/j9eu0bTtKzKlNPWWyYC7wFNyQ=="
+    },
+    "sax": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz",
+      "integrity": "sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw=="
+    },
+    "schema-utils": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-0.3.0.tgz",
+      "integrity": "sha1-9YdyIs4+kx7a4DnxfrNxbnE3+M8="
+    },
+    "screener-runner": {
+      "version": "0.6.19",
+      "resolved": "https://registry.npmjs.org/screener-runner/-/screener-runner-0.6.19.tgz",
+      "integrity": "sha1-tW//NG0Xf0Bn0IVFgOHsDiICvdg=",
       "dependencies": {
-        "pify": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
-          "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY="
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "bluebird": {
+          "version": "3.4.7",
+          "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.4.7.tgz",
+          "integrity": "sha1-9y12C+Cbf3bQjtj66Ysomo0F+rM="
+        },
+        "bytes": {
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.3.0.tgz",
+          "integrity": "sha1-1baAoWW2IBc5rLYRVCqrwtjOsHA="
+        },
+        "caseless": {
+          "version": "0.11.0",
+          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz",
+          "integrity": "sha1-cVuW6phBWTzDMGeSP17GDr2k99c="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
+        "commander": {
+          "version": "2.9.0",
+          "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
+          "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q="
+        },
+        "compression": {
+          "version": "1.6.2",
+          "resolved": "https://registry.npmjs.org/compression/-/compression-1.6.2.tgz",
+          "integrity": "sha1-zOsSHsydCcUtetDDNQ6pPd1AK8M="
+        },
+        "connect": {
+          "version": "3.5.1",
+          "resolved": "https://registry.npmjs.org/connect/-/connect-3.5.1.tgz",
+          "integrity": "sha1-bTDXpjx/FwhXprOqazY9lz3KWI4="
+        },
+        "debug": {
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
+        },
+        "finalhandler": {
+          "version": "0.5.1",
+          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.5.1.tgz",
+          "integrity": "sha1-LEANjUUwk1vCMlScX6OF7Afeb80="
+        },
+        "har-validator": {
+          "version": "2.0.6",
+          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz",
+          "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0="
+        },
+        "lodash": {
+          "version": "4.16.6",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.16.6.tgz",
+          "integrity": "sha1-0iyaxmAojzhD4Wun0rXQbMon13c="
+        },
+        "ms": {
+          "version": "0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+        },
+        "node-uuid": {
+          "version": "1.4.8",
+          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz",
+          "integrity": "sha1-sEDrCSOWivq/jTL7HxfxFn/auQc="
+        },
+        "qs": {
+          "version": "6.3.2",
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.3.2.tgz",
+          "integrity": "sha1-51vV9uJoEioqDgvaYwslUMFmUCw="
+        },
+        "request": {
+          "version": "2.78.0",
+          "resolved": "https://registry.npmjs.org/request/-/request-2.78.0.tgz",
+          "integrity": "sha1-4cjew0bhyBkjskrNszfxHeyr6cw="
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+        },
+        "tunnel-agent": {
+          "version": "0.4.3",
+          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz",
+          "integrity": "sha1-Y3PbdpCf5XDgjXNYM2Xtgop07us="
+        }
+      }
+    },
+    "screener-storybook": {
+      "version": "0.9.0",
+      "resolved": "https://registry.npmjs.org/screener-storybook/-/screener-storybook-0.9.0.tgz",
+      "integrity": "sha1-3B+TbY+7OQGdL0K7tfYMCOKy5Yc=",
+      "dependencies": {
+        "acorn": {
+          "version": "2.7.0",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-2.7.0.tgz",
+          "integrity": "sha1-q259nYhqrKiwhbwzEreaGYQz8Oc="
+        },
+        "acorn-globals": {
+          "version": "1.0.9",
+          "resolved": "https://registry.npmjs.org/acorn-globals/-/acorn-globals-1.0.9.tgz",
+          "integrity": "sha1-VbtemGkVB7dFedBRNBMhfDgMVM8="
+        },
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "bluebird": {
+          "version": "3.4.7",
+          "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.4.7.tgz",
+          "integrity": "sha1-9y12C+Cbf3bQjtj66Ysomo0F+rM="
+        },
+        "bytes": {
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.3.0.tgz",
+          "integrity": "sha1-1baAoWW2IBc5rLYRVCqrwtjOsHA="
+        },
+        "caseless": {
+          "version": "0.11.0",
+          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz",
+          "integrity": "sha1-cVuW6phBWTzDMGeSP17GDr2k99c="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
+        "commander": {
+          "version": "2.9.0",
+          "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
+          "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q="
+        },
+        "compression": {
+          "version": "1.6.2",
+          "resolved": "https://registry.npmjs.org/compression/-/compression-1.6.2.tgz",
+          "integrity": "sha1-zOsSHsydCcUtetDDNQ6pPd1AK8M="
+        },
+        "connect": {
+          "version": "3.5.1",
+          "resolved": "https://registry.npmjs.org/connect/-/connect-3.5.1.tgz",
+          "integrity": "sha1-bTDXpjx/FwhXprOqazY9lz3KWI4="
+        },
+        "debug": {
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
+        },
+        "finalhandler": {
+          "version": "0.5.1",
+          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.5.1.tgz",
+          "integrity": "sha1-LEANjUUwk1vCMlScX6OF7Afeb80="
+        },
+        "har-validator": {
+          "version": "2.0.6",
+          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz",
+          "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0="
+        },
+        "hoek": {
+          "version": "4.2.0",
+          "resolved": "https://registry.npmjs.org/hoek/-/hoek-4.2.0.tgz",
+          "integrity": "sha512-v0XCLxICi9nPfYrS9RL8HbYnXi9obYAeLbSP00BmnZwCK9+Ih9WOjoZ8YoHCoav2csqn4FOz4Orldsy2dmDwmQ=="
+        },
+        "joi": {
+          "version": "10.0.6",
+          "resolved": "https://registry.npmjs.org/joi/-/joi-10.0.6.tgz",
+          "integrity": "sha1-26y78wtNu50o72cW2CxFgLsEwJY="
+        },
+        "jsdom": {
+          "version": "9.8.3",
+          "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-9.8.3.tgz",
+          "integrity": "sha1-/eKcEJwyoRMeC2xlkU5kGY+Xw3A="
+        },
+        "ms": {
+          "version": "0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+        },
+        "node-uuid": {
+          "version": "1.4.8",
+          "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz",
+          "integrity": "sha1-sEDrCSOWivq/jTL7HxfxFn/auQc="
+        },
+        "qs": {
+          "version": "6.3.2",
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.3.2.tgz",
+          "integrity": "sha1-51vV9uJoEioqDgvaYwslUMFmUCw="
+        },
+        "screener-runner": {
+          "version": "0.7.0",
+          "resolved": "https://registry.npmjs.org/screener-runner/-/screener-runner-0.7.0.tgz",
+          "integrity": "sha1-wTtBdC65b6rZWpFFgi2fg1oibQg=",
+          "dependencies": {
+            "joi": {
+              "version": "9.2.0",
+              "resolved": "https://registry.npmjs.org/joi/-/joi-9.2.0.tgz",
+              "integrity": "sha1-M4WseQGSEwy+Iw6ALsAskhW7/to="
+            },
+            "lodash": {
+              "version": "4.16.6",
+              "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.16.6.tgz",
+              "integrity": "sha1-0iyaxmAojzhD4Wun0rXQbMon13c="
+            },
+            "request": {
+              "version": "2.78.0",
+              "resolved": "https://registry.npmjs.org/request/-/request-2.78.0.tgz",
+              "integrity": "sha1-4cjew0bhyBkjskrNszfxHeyr6cw="
+            }
+          }
+        },
+        "semver": {
+          "version": "5.3.0",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz",
+          "integrity": "sha1-myzl094C0XxgEq0yaqa00M9U+U8="
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+        },
+        "tunnel-agent": {
+          "version": "0.4.3",
+          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz",
+          "integrity": "sha1-Y3PbdpCf5XDgjXNYM2Xtgop07us="
+        },
+        "webidl-conversions": {
+          "version": "3.0.1",
+          "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-3.0.1.tgz",
+          "integrity": "sha1-JFNCdeKnvGvnvIZhHMFq4KVlSHE="
+        },
+        "whatwg-url": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-3.1.0.tgz",
+          "integrity": "sha1-e9yuSQ+SGu9kUftnOexrvY6Qe/Y="
         }
       }
     },
-    "sax": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz",
-      "integrity": "sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw=="
-    },
-    "schema-utils": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-0.3.0.tgz",
-      "integrity": "sha1-9YdyIs4+kx7a4DnxfrNxbnE3+M8="
-    },
     "scss-tokenizer": {
       "version": "0.2.3",
       "resolved": "https://registry.npmjs.org/scss-tokenizer/-/scss-tokenizer-0.2.3.tgz",
@@ -8156,6 +10488,18 @@
         }
       }
     },
+    "serve-favicon": {
+      "version": "2.4.4",
+      "resolved": "https://registry.npmjs.org/serve-favicon/-/serve-favicon-2.4.4.tgz",
+      "integrity": "sha1-QS3ddJZRUcn3TAgo811QxSUCEN4=",
+      "dependencies": {
+        "fresh": {
+          "version": "0.5.1",
+          "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.1.tgz",
+          "integrity": "sha1-w6CLzsD83MIj7fOyPrMn8fn8v1w="
+        }
+      }
+    },
     "serve-index": {
       "version": "1.9.0",
       "resolved": "https://registry.npmjs.org/serve-index/-/serve-index-1.9.0.tgz",
@@ -8182,9 +10526,16 @@
       "integrity": "sha1-SysbJ+uAip+NzEgaWOXlb1mfP2E="
     },
     "set-value": {
-      "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/set-value/-/set-value-0.4.3.tgz",
-      "integrity": "sha1-fbCPnT0i3H945Trzw79GZuzfzPE="
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/set-value/-/set-value-2.0.0.tgz",
+      "integrity": "sha512-hw0yxk9GT/Hr5yJEYnHNKYXkIA8mVJgd9ditYZCe16ZczcaELYYcfvaXesNACk2O8O0nTiPQcQhGUQj8JLzeeg==",
+      "dependencies": {
+        "split-string": {
+          "version": "3.0.2",
+          "resolved": "https://registry.npmjs.org/split-string/-/split-string-3.0.2.tgz",
+          "integrity": "sha512-d6myUSfwmBz1izkY4r7r7I0PL41rh21qUDYK1OgclmGHeoqQoujduGxMbzw6BlF3HKmJR4sMpbWVo7/Xzg4YBQ=="
+        }
+      }
     },
     "setimmediate": {
       "version": "1.0.5",
@@ -8218,6 +10569,11 @@
         }
       }
     },
+    "shallowequal": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/shallowequal/-/shallowequal-0.2.2.tgz",
+      "integrity": "sha1-HjL9W8q2rWiKSBLLDMBO/HXHAU4="
+    },
     "shebang-command": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-1.2.0.tgz",
@@ -8233,6 +10589,11 @@
       "resolved": "https://registry.npmjs.org/shell-quote/-/shell-quote-1.6.1.tgz",
       "integrity": "sha1-9HgZSczkAmlxJ0MOo7PFR29IF2c="
     },
+    "shelljs": {
+      "version": "0.7.8",
+      "resolved": "https://registry.npmjs.org/shelljs/-/shelljs-0.7.8.tgz",
+      "integrity": "sha1-3svPh0sNHl+3LhSxZKloMEjprLM="
+    },
     "shellwords": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/shellwords/-/shellwords-0.1.1.tgz",
@@ -8244,9 +10605,9 @@
       "integrity": "sha1-tf3AjxKH6hF4Yo5BXiUTK3NkbG0="
     },
     "sinon": {
-      "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/sinon/-/sinon-3.2.1.tgz",
-      "integrity": "sha512-KY3OLOWpek/I4NGAMHetuutVgS2aRgMR5g5/1LSYvPJ3qo2BopIvk3esFztPxF40RWf/NNNJzdFPriSkXUVK3A==",
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/sinon/-/sinon-3.3.0.tgz",
+      "integrity": "sha512-/flfGfIxIRXSvZBHJzIf3iAyGYkmMQq6SQjA0cx9SOuVuq+4ZPPO4LJtH1Ce0Lznax1KSG1U6Dad85wIcSW19w==",
       "dependencies": {
         "lolex": {
           "version": "2.1.2",
@@ -8279,11 +10640,6 @@
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
           "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
-        },
-        "kind-of": {
-          "version": "5.0.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
-          "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
         }
       }
     },
@@ -8459,9 +10815,9 @@
       "integrity": "sha1-/K0LZLcK+ydpnkJZUMtevNQQvCA="
     },
     "source-map-support": {
-      "version": "0.4.17",
-      "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.4.17.tgz",
-      "integrity": "sha512-30c1Ch8FSjV0FwC253iftbbj0dU/OXoSg1LAEGZJUlGgjTNj6cu+DVqJWWIZJY5RXLWV4eFtR+4ouo0VIOYOTg=="
+      "version": "0.4.18",
+      "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.4.18.tgz",
+      "integrity": "sha512-try0/JqxPLF9nOjvSta7tVondkP5dwgyLDjVoyMDlmjugT2lRZ1OfsrYTkCd2hkDnJTKRbO/Rl3orm8vlsUzbA=="
     },
     "source-map-url": {
       "version": "0.4.0",
@@ -8515,6 +10871,11 @@
         }
       }
     },
+    "stack-trace": {
+      "version": "0.0.10",
+      "resolved": "https://registry.npmjs.org/stack-trace/-/stack-trace-0.0.10.tgz",
+      "integrity": "sha1-VHxws0fo0ytOEI6hoqFZ5f3eGcA="
+    },
     "static-extend": {
       "version": "0.1.2",
       "resolved": "https://registry.npmjs.org/static-extend/-/static-extend-0.1.2.tgz",
@@ -8529,11 +10890,6 @@
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
           "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
-        },
-        "kind-of": {
-          "version": "5.0.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
-          "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
         }
       }
     },
@@ -8547,6 +10903,16 @@
       "resolved": "https://registry.npmjs.org/stdout-stream/-/stdout-stream-1.4.0.tgz",
       "integrity": "sha1-osfIWH5U2UJ+qe2zrD8s1SLfN4s="
     },
+    "stealthy-require": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/stealthy-require/-/stealthy-require-1.1.1.tgz",
+      "integrity": "sha1-NbCYdbT/SfJqd35QmzCQoyJr8ks="
+    },
+    "storybook-readme": {
+      "version": "3.0.6",
+      "resolved": "https://registry.npmjs.org/storybook-readme/-/storybook-readme-3.0.6.tgz",
+      "integrity": "sha1-R1oUpbOdx6hcQjQxJTor8fWxx4Y="
+    },
     "stream-browserify": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz",
@@ -8578,14 +10944,58 @@
       "integrity": "sha1-6Kr8CsGFW0Zmkp7X3RJ1311sgRs="
     },
     "string-length": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/string-length/-/string-length-2.0.0.tgz",
+      "integrity": "sha1-1A27aGo6zpYMHP/KVivyxF+DY+0=",
+      "dependencies": {
+        "ansi-regex": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg="
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8="
+        }
+      }
+    },
+    "string-raw": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/string-length/-/string-length-1.0.1.tgz",
-      "integrity": "sha1-VpcPscOFWOnnC3KL894mmsRa36w="
+      "resolved": "https://registry.npmjs.org/string-raw/-/string-raw-1.0.1.tgz",
+      "integrity": "sha1-Ab4mZaHPosV1IMkQaY9sonakxyY="
     },
     "string-width": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
-      "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
+      "integrity": "sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw==",
+      "dependencies": {
+        "ansi-regex": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg="
+        },
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
+          "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8="
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8="
+        }
+      }
+    },
+    "string.prototype.padend": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/string.prototype.padend/-/string.prototype.padend-3.0.0.tgz",
+      "integrity": "sha1-86rvfBcZ8XDF6rHDK/eA2W4h8vA="
+    },
+    "string.prototype.padstart": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/string.prototype.padstart/-/string.prototype.padstart-3.0.0.tgz",
+      "integrity": "sha1-W8+tOfRkm7LQMSkuGbzwtRDUskI="
     },
     "stringstream": {
       "version": "0.0.5",
@@ -8634,11 +11044,21 @@
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.4.0.tgz",
       "integrity": "sha512-rKC3+DyXWgK0ZLKwmRsrkyHVZAjNkfzeehuFWdGGcqGDTZFH73+RH6S/RDAAxl9GusSjZSUWYLmT9N5pzXFOXQ=="
     },
+    "svg-tag-names": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/svg-tag-names/-/svg-tag-names-1.1.1.tgz",
+      "integrity": "sha1-lkGynvcQJe4JTHBD983efZn71Qo="
+    },
     "svgo": {
       "version": "0.7.2",
       "resolved": "https://registry.npmjs.org/svgo/-/svgo-0.7.2.tgz",
       "integrity": "sha1-n1dyQTlSE1xv779Ar+ak+qiLS7U="
     },
+    "symbol-observable": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/symbol-observable/-/symbol-observable-1.0.4.tgz",
+      "integrity": "sha1-Kb9hXUqnEhvdiYsi1LP5vE4qoD0="
+    },
     "symbol-tree": {
       "version": "3.2.2",
       "resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.2.tgz",
@@ -8684,11 +11104,6 @@
           "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
           "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
         },
-        "is-extglob": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-1.0.0.tgz",
-          "integrity": "sha1-rEaBd8SUNAWgkvyPKXYMb/xiBsA="
-        },
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
@@ -8736,6 +11151,11 @@
       "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.4.tgz",
       "integrity": "sha512-uZYhyU3EX8O7HQP+J9fTVYwsq90Vr68xPEFo7yrVImIxYvHgukBEgOB/SgGoorWVTzGM/3Z+wUNnboA4M8jWrg=="
     },
+    "timespan": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/timespan/-/timespan-2.3.0.tgz",
+      "integrity": "sha1-SQLOBAvRPYRcj1myfp1ZutbzmSk="
+    },
     "tmp": {
       "version": "0.0.31",
       "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.31.tgz",
@@ -8787,11 +11207,6 @@
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
           "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
-        },
-        "kind-of": {
-          "version": "5.0.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
-          "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
         }
       }
     },
@@ -8800,6 +11215,30 @@
       "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-2.1.1.tgz",
       "integrity": "sha1-fIDBe53+vlmeJzZ+DU3VWQFB2zg="
     },
+    "topo": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/topo/-/topo-2.0.2.tgz",
+      "integrity": "sha1-zVYVdSU5BXwNwEkaYhw7xvvh0YI=",
+      "dependencies": {
+        "hoek": {
+          "version": "4.2.0",
+          "resolved": "https://registry.npmjs.org/hoek/-/hoek-4.2.0.tgz",
+          "integrity": "sha512-v0XCLxICi9nPfYrS9RL8HbYnXi9obYAeLbSP00BmnZwCK9+Ih9WOjoZ8YoHCoav2csqn4FOz4Orldsy2dmDwmQ=="
+        }
+      }
+    },
+    "touch": {
+      "version": "0.0.3",
+      "resolved": "https://registry.npmjs.org/touch/-/touch-0.0.3.tgz",
+      "integrity": "sha1-Ua7z1ElXHU8oel2Hyci0kYGg2x0=",
+      "dependencies": {
+        "nopt": {
+          "version": "1.0.10",
+          "resolved": "https://registry.npmjs.org/nopt/-/nopt-1.0.10.tgz",
+          "integrity": "sha1-bd0hvSoxQXuScn3Vhfim83YI6+4="
+        }
+      }
+    },
     "tough-cookie": {
       "version": "2.3.2",
       "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.2.tgz",
@@ -8810,6 +11249,11 @@
       "resolved": "https://registry.npmjs.org/tr46/-/tr46-0.0.3.tgz",
       "integrity": "sha1-gYT9NH2snNwYWZLzpmIuFLnZq2o="
     },
+    "traverse": {
+      "version": "0.3.9",
+      "resolved": "https://registry.npmjs.org/traverse/-/traverse-0.3.9.tgz",
+      "integrity": "sha1-cXuPIgzAu3tE5AUUwisui7xw2Lk="
+    },
     "trim-newlines": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/trim-newlines/-/trim-newlines-1.0.0.tgz",
@@ -8821,15 +11265,10 @@
       "integrity": "sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM="
     },
     "ts-jest": {
-      "version": "21.0.0",
-      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-21.0.0.tgz",
-      "integrity": "sha512-rCNWnrnLLQfE2hb9zrtzuw5MzF0/yLCMdLP9PON+Mce9rV9auBLB+XgY9oZN7Wly7fpwIFwImCk7EVrfUXUfvw==",
+      "version": "21.0.1",
+      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-21.0.1.tgz",
+      "integrity": "sha512-MIX8uMMr7FSRT56GASXUxeorEs3x2iO+JwkVzUHwxjzld4+UtPMZ9EEUpX7JU7eFKDkXaD1aAIVnuNrg15Xnuw==",
       "dependencies": {
-        "ansi-regex": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
-          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg="
-        },
         "camelcase": {
           "version": "4.1.0",
           "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
@@ -8848,30 +11287,30 @@
           }
         },
         "fs-extra": {
-          "version": "4.0.1",
-          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-4.0.1.tgz",
-          "integrity": "sha1-f8DGyJV/mD9X8waiTlud3Y0N2IA="
+          "version": "4.0.2",
+          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-4.0.2.tgz",
+          "integrity": "sha1-+RcExT0bRh+JNFKwwwfZmXZHq2s="
         },
         "jsonfile": {
-          "version": "3.0.1",
-          "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-3.0.1.tgz",
-          "integrity": "sha1-pezG9l9T9mLEQVx2daAzHQmS7GY="
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-4.0.0.tgz",
+          "integrity": "sha1-h3Gq4HmbZAdrdmQPygWPnBDjPss="
         },
         "load-json-file": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
           "integrity": "sha1-eUfkIUmvgNaWy/eXvKq8/h/inKg="
         },
-        "os-locale": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-2.1.0.tgz",
-          "integrity": "sha512-3sslG3zJbEYcaC4YVAvDorjGxc7tv6KVATnLPZONiljsUncvihe9BQoVCEs0RZ1kmf4Hk9OBqlZfJZWI4GanKA=="
-        },
         "path-type": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/path-type/-/path-type-2.0.0.tgz",
           "integrity": "sha1-8BLMuEFbcJb8LaoQVMPXI4lZTHM="
         },
+        "pify": {
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+          "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
+        },
         "read-pkg": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-2.0.0.tgz",
@@ -8882,42 +11321,15 @@
           "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-2.0.0.tgz",
           "integrity": "sha1-a3KoBImE4MQeeVEP1en6mbO1Sb4="
         },
-        "string-width": {
-          "version": "2.1.1",
-          "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
-          "integrity": "sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw==",
-          "dependencies": {
-            "is-fullwidth-code-point": {
-              "version": "2.0.0",
-              "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
-              "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8="
-            },
-            "strip-ansi": {
-              "version": "4.0.0",
-              "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
-              "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8="
-            }
-          }
-        },
         "strip-bom": {
           "version": "3.0.0",
           "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
           "integrity": "sha1-IzTBjpx1n3vdVv3vfprj1YjmjtM="
         },
-        "which-module": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.0.tgz",
-          "integrity": "sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho="
-        },
         "yargs": {
           "version": "8.0.2",
           "resolved": "https://registry.npmjs.org/yargs/-/yargs-8.0.2.tgz",
           "integrity": "sha1-YpmpBVsc78lp/355wdkY3Osiw2A="
-        },
-        "yargs-parser": {
-          "version": "7.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-7.0.0.tgz",
-          "integrity": "sha1-jQrELxbqVd69MyyvTEA4s+P139k="
         }
       }
     },
@@ -9034,10 +11446,27 @@
       "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.0.2.tgz",
       "integrity": "sha1-rOEWq1V80Zc4ak6I9GhTeMiy5Po="
     },
+    "underscore": {
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.7.0.tgz",
+      "integrity": "sha1-a7rwh3UA02vjTsqlhODbn+8DUgk="
+    },
+    "underscore.string": {
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/underscore.string/-/underscore.string-2.4.0.tgz",
+      "integrity": "sha1-jN2PusTi0uoefi6Al8QvRCKA+Fs="
+    },
     "union-value": {
-      "version": "0.2.4",
-      "resolved": "https://registry.npmjs.org/union-value/-/union-value-0.2.4.tgz",
-      "integrity": "sha1-c3UVJ4ZnkFfns3qmdug0aPwCdPA="
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/union-value/-/union-value-1.0.0.tgz",
+      "integrity": "sha1-XHHDTLW61dzr4+oM0IIHulqhrqQ=",
+      "dependencies": {
+        "set-value": {
+          "version": "0.4.3",
+          "resolved": "https://registry.npmjs.org/set-value/-/set-value-0.4.3.tgz",
+          "integrity": "sha1-fbCPnT0i3H945Trzw79GZuzfzPE="
+        }
+      }
     },
     "uniq": {
       "version": "1.0.1",
@@ -9054,6 +11483,11 @@
       "resolved": "https://registry.npmjs.org/uniqs/-/uniqs-2.0.0.tgz",
       "integrity": "sha1-/+3ks2slKQaW5uFl1KWe25mOawI="
     },
+    "unique-string": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/unique-string/-/unique-string-1.0.0.tgz",
+      "integrity": "sha1-nhBXzKhRq7kzmPizOuGHuZyuwRo="
+    },
     "universalify": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.1.tgz",
@@ -9065,9 +11499,28 @@
       "integrity": "sha1-sr9O6FFKrmFltIF4KdIbLvSZBOw="
     },
     "unset-value": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/unset-value/-/unset-value-0.1.2.tgz",
-      "integrity": "sha1-UGgQuGfyfCpabpsEgzYx9t5Y0xA="
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/unset-value/-/unset-value-1.0.0.tgz",
+      "integrity": "sha1-g3aHP30jNRef+x5vw6jtDfyKtVk=",
+      "dependencies": {
+        "has-value": {
+          "version": "0.3.1",
+          "resolved": "https://registry.npmjs.org/has-value/-/has-value-0.3.1.tgz",
+          "integrity": "sha1-ex9YutpiyoJ+wKIHgCVlSEWZXh8=",
+          "dependencies": {
+            "isobject": {
+              "version": "2.1.0",
+              "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
+              "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk="
+            }
+          }
+        },
+        "has-values": {
+          "version": "0.1.4",
+          "resolved": "https://registry.npmjs.org/has-values/-/has-values-0.1.4.tgz",
+          "integrity": "sha1-bWHeldkd/Km5oCCJrThL/49it3E="
+        }
+      }
     },
     "urix": {
       "version": "0.1.0",
@@ -9086,6 +11539,18 @@
         }
       }
     },
+    "url-loader": {
+      "version": "0.5.9",
+      "resolved": "https://registry.npmjs.org/url-loader/-/url-loader-0.5.9.tgz",
+      "integrity": "sha512-B7QYFyvv+fOBqBVeefsxv6koWWtjmHaMFT6KZWti4KRw8YUD/hOU+3AECvXuzyVawIBx3z7zQRejXCDSO5kk1Q==",
+      "dependencies": {
+        "mime": {
+          "version": "1.3.6",
+          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.6.tgz",
+          "integrity": "sha1-WR2E02U6awtKO5343lqoEI5y5eA="
+        }
+      }
+    },
     "url-parse": {
       "version": "1.1.9",
       "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.1.9.tgz",
@@ -9112,18 +11577,20 @@
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
           "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
-        },
-        "kind-of": {
-          "version": "5.0.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
-          "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
         }
       }
     },
     "useragent": {
       "version": "2.2.1",
       "resolved": "https://registry.npmjs.org/useragent/-/useragent-2.2.1.tgz",
-      "integrity": "sha1-z1k+9PLRdYdei7ZY6pLhik/QbY4="
+      "integrity": "sha1-z1k+9PLRdYdei7ZY6pLhik/QbY4=",
+      "dependencies": {
+        "lru-cache": {
+          "version": "2.2.4",
+          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.2.4.tgz",
+          "integrity": "sha1-bGWGGb7PFAMdDQtZSxYELOTcBj0="
+        }
+      }
     },
     "util": {
       "version": "0.10.3",
@@ -9162,6 +11629,23 @@
       "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.1.tgz",
       "integrity": "sha1-Z1Neu2lMHVIldFeYRmUyP1h+jTc="
     },
+    "velocity-animate": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/velocity-animate/-/velocity-animate-1.5.0.tgz",
+      "integrity": "sha1-/Idx2N/hE2/wKnB+EPuwlXxLAw8="
+    },
+    "velocity-react": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/velocity-react/-/velocity-react-1.3.3.tgz",
+      "integrity": "sha1-1tRyds/Ivip1Yjh5sgFArFjBuCs=",
+      "dependencies": {
+        "lodash": {
+          "version": "3.10.1",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
+          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
+        }
+      }
+    },
     "vendors": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/vendors/-/vendors-1.0.1.tgz",
@@ -9194,6 +11678,11 @@
       "resolved": "https://registry.npmjs.org/walker/-/walker-1.0.7.tgz",
       "integrity": "sha1-L3+bj9ENZ3JisYqITijRlhjgKPs="
     },
+    "warning": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/warning/-/warning-3.0.0.tgz",
+      "integrity": "sha1-MuU3fLVy3kqwR1O9+IIcAe1gW3w="
+    },
     "watch": {
       "version": "0.10.0",
       "resolved": "https://registry.npmjs.org/watch/-/watch-0.10.0.tgz",
@@ -9215,20 +11704,15 @@
       "integrity": "sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg=="
     },
     "webpack": {
-      "version": "3.5.5",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-3.5.5.tgz",
-      "integrity": "sha512-qeUx4nIbeLL53qqNTs3kObPBMkUVDrOjEfp/hTvMlx21qL2MsGNr8/tXCoX/lS12dLl9qtZaXv2qfBEctPScDg==",
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-3.6.0.tgz",
+      "integrity": "sha512-OsHT3D0W0KmPPh60tC7asNnOmST6bKTiR90UyEdT9QYoaJ4OYN4Gg7WK1k3VxHK07ZoiYWPsKvlS/gAjwL/vRA==",
       "dependencies": {
         "acorn": {
           "version": "5.1.2",
           "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.1.2.tgz",
           "integrity": "sha512-o96FZLJBPY1lvTuJylGA9Bk3t/GKPPJG8H0ydQQl01crzwJgspa4AEIq/pVTXigmK0PHVQhiAtn8WMBLL9D2WA=="
         },
-        "ansi-regex": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
-          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg="
-        },
         "camelcase": {
           "version": "4.1.0",
           "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
@@ -9256,16 +11740,16 @@
           "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
           "integrity": "sha1-eUfkIUmvgNaWy/eXvKq8/h/inKg="
         },
-        "os-locale": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-2.1.0.tgz",
-          "integrity": "sha512-3sslG3zJbEYcaC4YVAvDorjGxc7tv6KVATnLPZONiljsUncvihe9BQoVCEs0RZ1kmf4Hk9OBqlZfJZWI4GanKA=="
-        },
         "path-type": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/path-type/-/path-type-2.0.0.tgz",
           "integrity": "sha1-8BLMuEFbcJb8LaoQVMPXI4lZTHM="
         },
+        "pify": {
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+          "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
+        },
         "read-pkg": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-2.0.0.tgz",
@@ -9276,42 +11760,15 @@
           "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-2.0.0.tgz",
           "integrity": "sha1-a3KoBImE4MQeeVEP1en6mbO1Sb4="
         },
-        "string-width": {
-          "version": "2.1.1",
-          "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
-          "integrity": "sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw==",
-          "dependencies": {
-            "is-fullwidth-code-point": {
-              "version": "2.0.0",
-              "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
-              "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8="
-            },
-            "strip-ansi": {
-              "version": "4.0.0",
-              "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
-              "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8="
-            }
-          }
-        },
         "strip-bom": {
           "version": "3.0.0",
           "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
           "integrity": "sha1-IzTBjpx1n3vdVv3vfprj1YjmjtM="
         },
-        "which-module": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.0.tgz",
-          "integrity": "sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho="
-        },
         "yargs": {
           "version": "8.0.2",
           "resolved": "https://registry.npmjs.org/yargs/-/yargs-8.0.2.tgz",
           "integrity": "sha1-YpmpBVsc78lp/355wdkY3Osiw2A="
-        },
-        "yargs-parser": {
-          "version": "7.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-7.0.0.tgz",
-          "integrity": "sha1-jQrELxbqVd69MyyvTEA4s+P139k="
         }
       }
     },
@@ -9363,21 +11820,14 @@
       "integrity": "sha1-007++y7dp+HTtdvgcolRMhllFwk="
     },
     "webpack-dev-server": {
-      "version": "2.7.1",
-      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.7.1.tgz",
-      "integrity": "sha1-IVgPWgjNBlxxFEz29hw0W8pZqLg=",
-      "dependencies": {
-        "has-flag": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
-          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
-        }
-      }
+      "version": "2.8.2",
+      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.8.2.tgz",
+      "integrity": "sha512-wD9bs+Z1uwvf3Jc+8ZkyMI0Xi+aJJYjC2UZplOWoo/vStelK5Mv62X2uXYEYIQEjy9wJQMzC0fEFqQsg7vVEIg=="
+    },
+    "webpack-hot-middleware": {
+      "version": "2.19.1",
+      "resolved": "https://registry.npmjs.org/webpack-hot-middleware/-/webpack-hot-middleware-2.19.1.tgz",
+      "integrity": "sha512-2x60xmz7XBCNN/Drol+7i85E/5RrNrf+ivOPCgrxhP1F3q3WxpVjjvj8n8fOS1bS9oTRKEDfBYVAtkxqsG7LwQ=="
     },
     "webpack-notifier": {
       "version": "1.5.0",
@@ -9412,14 +11862,14 @@
       "integrity": "sha512-05tMxipUCwHqYaVS8xc7sYPTly8PzXayRCB4dTxLhWTqlKUiwH6ezmEe0OSreL1c30LAuA3Zqmc+uEBUGFJDjw=="
     },
     "websocket-driver": {
-      "version": "0.6.5",
-      "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.6.5.tgz",
-      "integrity": "sha1-XLJVbOuF9Dc8bYI4qmkchFThOjY="
+      "version": "0.7.0",
+      "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.7.0.tgz",
+      "integrity": "sha1-DK+dLXVdk67gSdS90NP+LMoqJOs="
     },
     "websocket-extensions": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.1.tgz",
-      "integrity": "sha1-domUmcGEtu91Q3fC27DNbLVdKec="
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.2.tgz",
+      "integrity": "sha1-Dhh4HeYpoYMIzhSBZQ9n/6JpOl0="
     },
     "whatwg-encoding": {
       "version": "1.0.1",
@@ -9454,20 +11904,44 @@
       "integrity": "sha512-xcJpopdamTuY5duC/KnTTNBraPK54YwpenP4lzxU8H91GudWpFv38u0CKjclE1Wi2EH2EDz5LRcHcKbCIzqGyg=="
     },
     "which-module": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/which-module/-/which-module-1.0.0.tgz",
-      "integrity": "sha1-u6Y8qGGUiZT/MHc2CJ47lgJsKk8="
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.0.tgz",
+      "integrity": "sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho="
     },
     "wide-align": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/wide-align/-/wide-align-1.1.2.tgz",
-      "integrity": "sha512-ijDLlyQ7s6x1JgCLur53osjm/UXUYD9+0PbYKrBsYisYXzCxN+HC3mYDNy/dWdmf3AwqwU3CXwDCvsNgGK1S0w=="
+      "integrity": "sha512-ijDLlyQ7s6x1JgCLur53osjm/UXUYD9+0PbYKrBsYisYXzCxN+HC3mYDNy/dWdmf3AwqwU3CXwDCvsNgGK1S0w==",
+      "dependencies": {
+        "string-width": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
+          "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
+        }
+      }
     },
     "window-size": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
       "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
     },
+    "winston": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/winston/-/winston-2.3.1.tgz",
+      "integrity": "sha1-C0hCDZeMAYBM8CMLZIhhWYIloRk=",
+      "dependencies": {
+        "async": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/async/-/async-1.0.0.tgz",
+          "integrity": "sha1-+PwEyjoTeErenhZBr5hXjPvWR6k="
+        },
+        "colors": {
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/colors/-/colors-1.0.3.tgz",
+          "integrity": "sha1-BDP0TYCWgP3rYO0mDxsMJi6CpAs="
+        }
+      }
+    },
     "wordwrap": {
       "version": "0.0.3",
       "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.3.tgz",
@@ -9481,13 +11955,25 @@
     "wrap-ansi": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
-      "integrity": "sha1-2Pw9KE3QV5T+hJc8rs3Rz4JP3YU="
+      "integrity": "sha1-2Pw9KE3QV5T+hJc8rs3Rz4JP3YU=",
+      "dependencies": {
+        "string-width": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
+          "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
+        }
+      }
     },
     "wrappy": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
       "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8="
     },
+    "wrench": {
+      "version": "1.3.9",
+      "resolved": "https://registry.npmjs.org/wrench/-/wrench-1.3.9.tgz",
+      "integrity": "sha1-bxPsNRRTF+spLKX2UxORskQRFBE="
+    },
     "write-file-atomic": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.3.0.tgz",
@@ -9503,6 +11989,11 @@
       "resolved": "https://registry.npmjs.org/wtf-8/-/wtf-8-1.0.0.tgz",
       "integrity": "sha1-OS2LotDxw00e4tYw8V0O+2jhBIo="
     },
+    "xdg-basedir": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-3.0.0.tgz",
+      "integrity": "sha1-SWsswQnsqNus/i3HK2A8F8WHCtQ="
+    },
     "xml-name-validator": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-2.0.1.tgz",
@@ -9543,6 +12034,21 @@
           "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
           "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
         },
+        "os-locale": {
+          "version": "1.4.0",
+          "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
+          "integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk="
+        },
+        "string-width": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
+          "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
+        },
+        "which-module": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/which-module/-/which-module-1.0.0.tgz",
+          "integrity": "sha1-u6Y8qGGUiZT/MHc2CJ47lgJsKk8="
+        },
         "yargs-parser": {
           "version": "4.2.1",
           "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz",
@@ -9551,14 +12057,14 @@
       }
     },
     "yargs-parser": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-5.0.0.tgz",
-      "integrity": "sha1-J17PDX/+Bcd+ZOfIbkzZS/DhIoo=",
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-7.0.0.tgz",
+      "integrity": "sha1-jQrELxbqVd69MyyvTEA4s+P139k=",
       "dependencies": {
         "camelcase": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
-          "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
+          "version": "4.1.0",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
+          "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
         }
       }
     },
@@ -9573,4 +12079,4 @@
       "integrity": "sha1-AI4G2AlDIMNy28L47XagymyKxBk="
     }
   }
-}
\ No newline at end of file
+}
diff --git a/package.json b/package.json
index a20050805670c..f23eee053dd4d 100644
--- a/package.json
+++ b/package.json
@@ -15,6 +15,7 @@
     "_rushRebuildFast": "node node_modules/@microsoft/rush/bin/rush rebuild --verbose",
     "postinstall": "npm run _rushInstall && npm run _rushBuildToFabric",
     "test": "npm run _rushBuild",
+    "vrtest": "cd apps && cd vr-tests && npm run screener",
     "start": "cd packages && cd office-ui-fabric-react && npm start",
     "build": "npm run _rushRebuild",
     "buildfast": "npm run _rushBuild",
@@ -25,4 +26,4 @@
   "devDependencies": {
     "@microsoft/rush": "3.0.12"
   }
-}
+}
\ No newline at end of file
diff --git a/rush.json b/rush.json
index 5754358787356..f506d16c3c14f 100644
--- a/rush.json
+++ b/rush.json
@@ -52,6 +52,11 @@
       "projectFolder": "apps/ssr-tests",
       "shouldPublish": false
     },
+    {
+      "packageName": "vr-tests",
+      "projectFolder": "apps/vr-tests",
+      "shouldPublish": false
+    },
     {
       "packageName": "todo-app",
       "projectFolder": "apps/todo-app",
diff --git a/scripts/tasks/jest-reporter.js b/scripts/tasks/jest-reporter.js
index 03ad965025178..207c43efb9615 100644
--- a/scripts/tasks/jest-reporter.js
+++ b/scripts/tasks/jest-reporter.js
@@ -1,4 +1,4 @@
-const DefaultReporter = require('jest-cli/build/reporters/default_reporter');
+const DefaultReporter = require('jest-cli/build/reporters/default_reporter').default;
 
 /**
  * The purpose of this custom reporter is to prevent Jest from logging to stderr

From 5177563534e111a3c09c22ce8421ec1619a6ec2c Mon Sep 17 00:00:00 2001
From: Chris Mohr <chrismohr@users.noreply.github.com>
Date: Tue, 19 Sep 2017 15:49:12 -0700
Subject: [PATCH 0670/1641] allow 'chevron down' icon on Dropdown to be
 customized (#2886)

* allow chevron down icon on Dropdown to be customized by adding _onRenderChevronDownIcon

* add change file

* update name to match the className of the element
---
 .../custom_dropdown_chevron_2017-09-19-20-39.json   | 11 +++++++++++
 .../src/components/Dropdown/Dropdown.Props.ts       |  5 +++++
 .../src/components/Dropdown/Dropdown.tsx            | 13 +++++++++++--
 .../Dropdown/examples/Dropdown.Basic.Example.scss   |  7 +++++++
 .../Dropdown/examples/Dropdown.Custom.Example.tsx   |  7 +++++++
 5 files changed, 41 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/custom_dropdown_chevron_2017-09-19-20-39.json

diff --git a/common/changes/office-ui-fabric-react/custom_dropdown_chevron_2017-09-19-20-39.json b/common/changes/office-ui-fabric-react/custom_dropdown_chevron_2017-09-19-20-39.json
new file mode 100644
index 0000000000000..d10ac01c34388
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/custom_dropdown_chevron_2017-09-19-20-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "allow 'chevron down' icon on Dropdown to be customized",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chrismo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
index 9973bc70e9dda..d441055d3603f 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
@@ -30,6 +30,11 @@ export interface IDropdownProps extends ISelectableDroppableTextProps<HTMLDivEle
    */
   onRenderTitle?: IRenderFunction<IDropdownOption | IDropdownOption[]>;
 
+  /**
+   * Optional custom renderer for chevron icon
+   */
+  onRenderCaretDown?: IRenderFunction<IDropdownProps>;
+
   /**
    * Custom width for dropdown. If value is 0, width of the input field is used.
    * @default 0
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 1f2961bf0bf73..c36ee2d7d4f8f 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -132,7 +132,8 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
       errorMessage,
       onRenderTitle = this._onRenderTitle,
       onRenderContainer = this._onRenderContainer,
-      onRenderPlaceHolder = this._onRenderPlaceHolder
+      onRenderPlaceHolder = this._onRenderPlaceHolder,
+      onRenderCaretDown = this._onRenderCaretDown
     } = this.props;
     let { isOpen, selectedIndex, selectedIndexes } = this.state;
     let selectedOption = this.props.multiSelect ? selectedIndexes && this._getAllSelectedOptions(options, selectedIndexes)
@@ -195,7 +196,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
                 onRenderPlaceHolder(this.props, this._onRenderPlaceHolder)
             }
           </span>
-          <Icon className={ css('ms-Dropdown-caretDown', styles.caretDown) } iconName='ChevronDown' />
+          { onRenderCaretDown(this.props, this._onRenderCaretDown) }
         </div>
         { isOpen && (
           onRenderContainer(this.props, this._onRenderContainer)
@@ -380,6 +381,14 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     );
   }
 
+  // Render Chevron Down Icon
+  @autobind
+  private _onRenderCaretDown(props: IDropdownProps): JSX.Element {
+    return (
+      <Icon className={ css('ms-Dropdown-caretDown', styles.caretDown) } iconName='ChevronDown' />
+    );
+  }
+
   // Render List of items
   @autobind
   private _onRenderList(props: IDropdownProps): JSX.Element {
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss
index 08458ffadaad1..8a919bebd8e0e 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss
@@ -8,4 +8,11 @@
   .dropdownExample-placeholder {
     display: flex;
   }
+  .dropdownExample-chevronDownIcon {
+    right: 12px;
+    position: absolute;
+    top: 1px;
+    height: 32px;
+    line-height: 30px;
+  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
index 629e80b1e3ce6..cb289a30bb2f9 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
@@ -24,6 +24,7 @@ export class DropdownCustomExample extends React.Component<any, any> {
           onRenderPlaceHolder={ this._onRenderPlaceHolder }
           onRenderTitle={ this._onRenderOption }
           onRenderOption={ this._onRenderOption }
+          onRenderCaretDown={ this._onRenderCaretDown }
           options={
             [
               { key: 'Header', text: 'Actions', itemType: DropdownMenuItemType.Header },
@@ -77,4 +78,10 @@ export class DropdownCustomExample extends React.Component<any, any> {
     );
   }
 
+  private _onRenderCaretDown = (props: IDropdownProps): JSX.Element => {
+    return (
+      <Icon className='dropdownExample-chevronDownIcon' iconName='CirclePlus' />
+    );
+  }
+
 }

From bc44b9542dcf9df07dfcc2c3dadee0cae6c16a1a Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Tue, 19 Sep 2017 18:56:59 -0500
Subject: [PATCH 0671/1641] ContextualMenu: Change the type of MenuSection
 title to string  (#2888)

* The title for a section should be a string

* Update key

* Rush change
---
 .../menu-section-title-type_2017-09-19-22-42.json    | 11 +++++++++++
 .../ContextualMenu/ContextualMenu.Props.ts           |  2 +-
 .../src/components/ContextualMenu/ContextualMenu.tsx | 10 +++++++++-
 .../examples/ContextualMenu.Section.Example.tsx      | 12 ++----------
 4 files changed, 23 insertions(+), 12 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/menu-section-title-type_2017-09-19-22-42.json

diff --git a/common/changes/office-ui-fabric-react/menu-section-title-type_2017-09-19-22-42.json b/common/changes/office-ui-fabric-react/menu-section-title-type_2017-09-19-22-42.json
new file mode 100644
index 0000000000000..a5ef42c7d076f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/menu-section-title-type_2017-09-19-22-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: Update the type of the title property on a menu section to be of type string",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
index 07c09adc9ae11..6aa47964f540d 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
@@ -368,7 +368,7 @@ export interface IContextualMenuSection extends React.Props<ContextualMenu> {
   /**
    * The optional section title.
    */
-  title?: IContextualMenuItem;
+  title?: string;
 
   /**
    * If set to true, the section will display a divider at the top of the section.
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index f45c826bf5d96..3629752a02177 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -309,7 +309,15 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       return;
     }
 
-    let headerItem = section.title && this._renderHeaderMenuItem(section.title, index, hasCheckmarks, hasIcons);
+    let headerItem;
+    if (section.title) {
+      const headerContextualMenuItem: IContextualMenuItem = {
+        key: `section-${section.title}-title`,
+        itemType: ContextualMenuItemType.Header,
+        name: section.title
+      };
+      headerItem = this._renderHeaderMenuItem(headerContextualMenuItem, index, hasCheckmarks, hasIcons);
+    }
 
     if (section.items && section.items.length > 0) {
       return (
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx
index 86a6ec635237c..4f95bf2fab327 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx
@@ -31,11 +31,7 @@ export class ContextualMenuSectionExample extends React.Component<any, any> {
                 sectionProps: {
                   topDivider: true,
                   bottomDivider: true,
-                  title: {
-                    key: 'Actions',
-                    itemType: ContextualMenuItemType.Header,
-                    name: 'Actions'
-                  },
+                  title: 'Actions',
                   items: [
                     {
                       key: 'newItem',
@@ -79,11 +75,7 @@ export class ContextualMenuSectionExample extends React.Component<any, any> {
                 key: 'section',
                 itemType: ContextualMenuItemType.Section,
                 sectionProps: {
-                  title: {
-                    key: 'Navigation',
-                    itemType: ContextualMenuItemType.Header,
-                    name: 'Social'
-                  },
+                  title: 'Social',
                   items: [
                     {
                       key: 'share',

From a92836fc83100d7b251e9ae453b092a45f0e989c Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 20 Sep 2017 10:19:01 +0000
Subject: [PATCH 0672/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 19 +++++++++
 apps/fabric-website/CHANGELOG.md              |  9 +++-
 apps/fabric-website/package.json              |  4 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...ntrast-system-colors_2017-08-23-16-39.json | 11 -----
 ...enu-example-refactor_2017-09-19-00-04.json | 11 -----
 ...tom_dropdown_chevron_2017-09-19-20-39.json | 11 -----
 ...u-section-title-type_2017-09-19-22-42.json | 11 -----
 .../modal-docs_2017-09-19-18-46.json          | 11 -----
 .../searchbox-onEscape_2017-09-05-16-37.json  | 11 -----
 ...ntrast-system-colors_2017-08-23-16-39.json | 11 -----
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 41 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 17 +++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 18 files changed, 92 insertions(+), 87 deletions(-)
 delete mode 100644 common/changes/@uifabric/fabric-website/v-krbrow-highcontrast-system-colors_2017-08-23-16-39.json
 delete mode 100644 common/changes/office-ui-fabric-react/contextual-menu-example-refactor_2017-09-19-00-04.json
 delete mode 100644 common/changes/office-ui-fabric-react/custom_dropdown_chevron_2017-09-19-20-39.json
 delete mode 100644 common/changes/office-ui-fabric-react/menu-section-title-type_2017-09-19-22-42.json
 delete mode 100644 common/changes/office-ui-fabric-react/modal-docs_2017-09-19-18-46.json
 delete mode 100644 common/changes/office-ui-fabric-react/searchbox-onEscape_2017-09-05-16-37.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-highcontrast-system-colors_2017-08-23-16-39.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 2f760ffe7223a..064a719e11234 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.0.1",
+      "tag": "@uifabric/fabric-website_v5.0.1",
+      "date": "Wed, 20 Sep 2017 10:19:01 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "7fadf0b0aa27ce0a245280e7867881cef1add967",
+            "comment": "Changing high-contrast colors to system colors"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.48.1 <5.0.0` to `>=4.49.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.0",
       "tag": "@uifabric/fabric-website_v5.0.0",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 171fa99daed6f..dca6cd4ba221e 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Tue, 19 Sep 2017 10:08:55 GMT and should not be manually modified.
+This log was last generated on Wed, 20 Sep 2017 10:19:01 GMT and should not be manually modified.
+
+## 5.0.1
+Wed, 20 Sep 2017 10:19:01 GMT
+
+### Patches
+
+- Changing high-contrast colors to system colors
 
 ## 5.0.0
 Tue, 19 Sep 2017 10:08:55 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 57dd3d18a72c7..6d1aa3b3bfe75 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.0.0",
+  "version": "5.0.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
     "@uifabric/example-app-base": ">=4.2.7 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=4.48.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.49.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 25c1b75d7b118..3ee2ad3824a01 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.48.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.49.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 7fd02d59eba43..96aa0a6870999 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -26,7 +26,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.48.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.49.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 7d9515cdf0120..27225b9b675d0 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -24,7 +24,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=4.48.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.49.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 673c9ab8d38ba..35d8dfeae3e19 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -27,7 +27,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.45.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.49.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/fabric-website/v-krbrow-highcontrast-system-colors_2017-08-23-16-39.json b/common/changes/@uifabric/fabric-website/v-krbrow-highcontrast-system-colors_2017-08-23-16-39.json
deleted file mode 100644
index dd240ff4678c5..0000000000000
--- a/common/changes/@uifabric/fabric-website/v-krbrow-highcontrast-system-colors_2017-08-23-16-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Changing high-contrast colors to system colors",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/contextual-menu-example-refactor_2017-09-19-00-04.json b/common/changes/office-ui-fabric-react/contextual-menu-example-refactor_2017-09-19-00-04.json
deleted file mode 100644
index 59e0cb212e23c..0000000000000
--- a/common/changes/office-ui-fabric-react/contextual-menu-example-refactor_2017-09-19-00-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Button: Add the ability to dismiss any open menus from the button interface",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/custom_dropdown_chevron_2017-09-19-20-39.json b/common/changes/office-ui-fabric-react/custom_dropdown_chevron_2017-09-19-20-39.json
deleted file mode 100644
index d10ac01c34388..0000000000000
--- a/common/changes/office-ui-fabric-react/custom_dropdown_chevron_2017-09-19-20-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "allow 'chevron down' icon on Dropdown to be customized",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chrismo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/menu-section-title-type_2017-09-19-22-42.json b/common/changes/office-ui-fabric-react/menu-section-title-type_2017-09-19-22-42.json
deleted file mode 100644
index a5ef42c7d076f..0000000000000
--- a/common/changes/office-ui-fabric-react/menu-section-title-type_2017-09-19-22-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: Update the type of the title property on a menu section to be of type string",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/modal-docs_2017-09-19-18-46.json b/common/changes/office-ui-fabric-react/modal-docs_2017-09-19-18-46.json
deleted file mode 100644
index 7e342b1405863..0000000000000
--- a/common/changes/office-ui-fabric-react/modal-docs_2017-09-19-18-46.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Modal: Updated padding in example to fix RTL support",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/searchbox-onEscape_2017-09-05-16-37.json b/common/changes/office-ui-fabric-react/searchbox-onEscape_2017-09-05-16-37.json
deleted file mode 100644
index e43ef14e193c5..0000000000000
--- a/common/changes/office-ui-fabric-react/searchbox-onEscape_2017-09-05-16-37.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SearchBox: Added onEscape prop",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "micahgodbolt@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-highcontrast-system-colors_2017-08-23-16-39.json b/common/changes/office-ui-fabric-react/v-krbrow-highcontrast-system-colors_2017-08-23-16-39.json
deleted file mode 100644
index 9695b50223125..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-highcontrast-system-colors_2017-08-23-16-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Changing high-contrast colors to system colors",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 9ef8af120756d..93a8739b496df 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/styling": ">=0.24.0 <1.0.0",
     "@uifabric/utilities": ">=4.13.1 <5.0.0",
-    "office-ui-fabric-react": ">=4.48.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.49.0 <5.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 2df14836dd2c1..7f489ccb145d8 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,47 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.49.0",
+      "tag": "office-ui-fabric-react_v4.49.0",
+      "date": "Wed, 20 Sep 2017 10:19:01 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "d9d7806fc211a326161c407b28f908e1bc7ee3df",
+            "comment": "Button: Add the ability to dismiss any open menus from the button interface"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "d760d81856ba4acf60b52eadc299dfa8210bc1f2",
+            "comment": "Modal: Updated padding in example to fix RTL support"
+          },
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "7fadf0b0aa27ce0a245280e7867881cef1add967",
+            "comment": "Changing high-contrast colors to system colors"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Chris Mohr <chrismohr@users.noreply.github.com>",
+            "commit": "5177563534e111a3c09c22ce8421ec1619a6ec2c",
+            "comment": "allow 'chevron down' icon on Dropdown to be customized"
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "bc44b9542dcf9df07dfcc2c3dadee0cae6c16a1a",
+            "comment": "ContextualMenu: Update the type of the title property on a menu section to be of type string"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "2ff3cc2d838c9c21ffe47808121bf0062e62c762",
+            "comment": "SearchBox: Added onEscape prop"
+          }
+        ]
+      }
+    },
     {
       "version": "4.48.1",
       "tag": "office-ui-fabric-react_v4.48.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index e33defc77bf17..cfbe4fe8a82f9 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,21 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 19 Sep 2017 10:08:55 GMT and should not be manually modified.
+This log was last generated on Wed, 20 Sep 2017 10:19:01 GMT and should not be manually modified.
+
+## 4.49.0
+Wed, 20 Sep 2017 10:19:01 GMT
+
+### Minor changes
+
+- allow 'chevron down' icon on Dropdown to be customized
+- ContextualMenu: Update the type of the title property on a menu section to be of type string
+- SearchBox: Added onEscape prop
+
+### Patches
+
+- Button: Add the ability to dismiss any open menus from the button interface
+- Modal: Updated padding in example to fix RTL support
+- Changing high-contrast colors to system colors
 
 ## 4.48.1
 Tue, 19 Sep 2017 10:08:55 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 79f5c44fddae2..d700b423dabd0 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.48.1",
+  "version": "4.49.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 40e1ef1d6ac5ee498888e7200fd15af754d7b665 Mon Sep 17 00:00:00 2001
From: John Miller <rubixws@gmail.com>
Date: Wed, 20 Sep 2017 03:48:38 -0700
Subject: [PATCH 0673/1641] Website V5 - Website updates only. (#2879)

* Adding one more case for the new testing area

* Adding change file

* Update version from num to range (#2619)

* Changed where Fabric Core and Fabric React versions were drawing from so that it would appear as a number instead of a range

* Added change file

* Switched some font colors to achieve minimum contrast requirement on website (#2648)

* Adjusted font colors to achieve minimum contrast requirement

* Adjusted neutral theme's font color

* Added change file

* Adding dev script option in index.html

* Resolving Conflicts With Cherry Pick

* Revised left nav to coordinate with new design for UHF adoption (#2630)

* Revised left nav to coordinate with new design for UHF adoption

* Renamed flag to be more clear about what it's targeting

* Updated from isTopNavHeader to isTopNavLink

* Revised flag name to reference UHF

* Resolving conflicts with Webpack conifg and package.json

* Devx website updates and removing FocusZone on Nav

* Clean up Brand Icons page (#2717)

* Brand icons page cleanup

* Added change files

* Changed back json formatting & removed :global from css

* Updated website's initial loading spinner gif to mimic the Fabric spinner component (#2713)

* Initial loading spinner gif changed to mimic spinner component

* Added change file

* Website infra updates (#2773)

* Adding specific HTML file for the production/devx site

* Changing entrypoint for the fabric-website to fabric-websitev5.js

* Removing FocusZone because it was causing React to load twice and break the website.

* Fixing error with uhf webpack config

* Removing old dev.office.com header and navigation

* Added a couple parameters to force the site to use production or dogfood.

* Changed the site config to the new fabric-websitev5 entry point name

* explicity set the output filename to fabric-websitev5 in the uhf webpack config

* Added a dogfood script

* Changed the chunk names so they are unique.

* Conflicts from master merge resolved, website build fixes, and linting error fixes

* Updated self-closing tag formatting

* Deleted old webpack site config

* Cleaned up homepage.htm and removed unused variables

* Added dogfood task

* Made changes to webpack config to allow for dogfood task

* Changing site name

* Added entry to launch.json, added a new build Debug build Dogfood and renamed the other build to Debug Build Production

* Updated array search to indexOf and changed the entryPointFileName for when isDogfood is true

* Changed the dogfood script to only contain the --dogfood argument.

* Cleaning up the webpack.config file, updated the logic for choosing an entry point/filename for webpack and added a timestamp to the chunk names so they don't overwrite each other on the CDN.

* Removed Yargs, added an argv property to pass to the task and pipe it through webpack.config.js files that export a function with (argv) as the parameter

* Correcting entrypoint filename error

* Updating shrinkwrap

* Adding new debug task Pt1

* Fixing issue with jest

* Fixing linting errors

* Removing unused jest testing script

* Revert "Removing unused jest testing script"

This reverts commit 3c33a0a576f58e2d1f838c5b391161fd26c0c2d7.

* Removing old page index-devx.html

* Removing Jest

* Changed entry point html file to fabric-sitev5 webpack serve config

* Added extra condition to nav links so they show up in localhost
---
 .vscode/launch.json                           |   24 +-
 apps/fabric-website/homepage.htm              |   68 +-
 apps/fabric-website/index.html                |   52 +-
 apps/fabric-website/package.json              |    7 +-
 .../src/components/App/App.scss               |    1 -
 .../src/components/App/AppState.tsx           |    8 +-
 .../src/components/CodeBlock/CodeBlock.tsx    |    4 +-
 .../src/components/Header/Header.scss         |    1 -
 .../src/components/Header/Header.tsx          |   15 -
 .../src/components/Nav/Nav.Props.ts           |    8 +-
 .../src/components/Nav/Nav.module.scss        |   35 -
 .../fabric-website/src/components/Nav/Nav.tsx |   31 +-
 .../src/data/brand-icons-monochrome.json      |    6 +-
 .../src/data/colors-neutral.json              |    4 +-
 .../fabric-website/src/data/colors-theme.json |    6 +-
 .../src/pages/HomePage/HomePage.tsx           |    5 +-
 .../BrandIconsPage/BrandIconsPage.module.scss |    4 +
 .../Styles/BrandIconsPage/BrandIconsPage.tsx  |   14 +-
 apps/fabric-website/webpack.config.js         |   87 +-
 apps/fabric-website/webpack.serve.config.js   |   17 +-
 .../webpack.uhf.serve.config.js               |   50 +
 .../brand-icons-page_2017-09-01-22-47.json    |   11 +
 ...ric-website-splitone_2017-09-18-21-07.json |   11 +
 .../new-spinner-gif_2017-09-01-18-13.json     |   11 +
 ...h-text-accessibility_2017-08-28-16-16.json |   11 +
 ...on-from-num-to-range_2017-08-24-22-58.json |   11 +
 .../brand-icons-page_2017-09-01-22-47.json    |   11 +
 common/config/rush/npm-shrinkwrap.json        | 1038 +++++++----------
 .../components/DatePicker/DatePickerPage.tsx  |    1 -
 .../src/components/Panel/PanelPage.tsx        |    1 -
 .../src/components/Persona/PersonaPage.tsx    |    1 -
 .../examples/Persona.Basic.Example.tsx        |    1 +
 .../components/SearchBox/SearchBoxPage.tsx    |    1 -
 .../components/SpinButton/SpinButtonPage.tsx  |    2 +-
 scripts/build.js                              |    2 +-
 scripts/package.json                          |    1 +
 scripts/start.js                              |   18 +-
 scripts/tasks/webpack.js                      |   13 +-
 38 files changed, 771 insertions(+), 821 deletions(-)
 create mode 100644 apps/fabric-website/webpack.uhf.serve.config.js
 create mode 100644 common/changes/@uifabric/fabric-website/brand-icons-page_2017-09-01-22-47.json
 create mode 100644 common/changes/@uifabric/fabric-website/miljo-fabric-website-splitone_2017-09-18-21-07.json
 create mode 100644 common/changes/@uifabric/fabric-website/new-spinner-gif_2017-09-01-18-13.json
 create mode 100644 common/changes/@uifabric/fabric-website/swatch-text-accessibility_2017-08-28-16-16.json
 create mode 100644 common/changes/@uifabric/fabric-website/update-version-from-num-to-range_2017-08-24-22-58.json
 create mode 100644 common/changes/office-ui-fabric-react/brand-icons-page_2017-09-01-22-47.json

diff --git a/.vscode/launch.json b/.vscode/launch.json
index ea7d8e1ca1891..2d0d8b0fc9038 100644
--- a/.vscode/launch.json
+++ b/.vscode/launch.json
@@ -22,7 +22,7 @@
       "sourceMaps": true
     },
     {
-      "name": "Debug build",
+      "name": "Debug build Production",
       "type": "node",
       "request": "launch",
       "program": "${workspaceRoot}/scripts/build.js",
@@ -42,6 +42,28 @@
         "NODE_ENV": "development"
       }
     },
+    {
+      "name": "Debug build Dogfood",
+      "type": "node",
+      "request": "launch",
+      "program": "${workspaceRoot}/scripts/build.js",
+      "stopOnEntry": false,
+      "args": [
+        "webpack",
+        "--",
+        "--production",
+        "--dogfood"
+      ],
+      "cwd": "${workspaceRoot}/apps/fabric-website",
+      "runtimeExecutable": null,
+      "runtimeArgs": [
+        "--nolazy",
+        "--debug"
+      ],
+      "env": {
+        "NODE_ENV": "development"
+      }
+    },
     {
       "name": "Run ssr tests",
       "type": "node",
diff --git a/apps/fabric-website/homepage.htm b/apps/fabric-website/homepage.htm
index 11a61b2de1d47..1699835101d08 100644
--- a/apps/fabric-website/homepage.htm
+++ b/apps/fabric-website/homepage.htm
@@ -8,14 +8,16 @@
   .loading {
     align-items: center;
     background-color: #212121;
+    border-top: 50px solid #000;
     display: flex;
     height: 100vh;
     justify-content: center;
   }
 </style>
+
 <div id="main">
   <div class="loading">
-    <img class="loadingImage" src="https://static2.sharepointonline.com/files/fabric/fabric-website/images/spinner.gif" alt="Loading"
+    <img class="loadingImage" src="https://static2.sharepointonline.com/files/fabric/fabric-website/images/loading.gif" alt="Loading"
       width="32" height="32" />
   </div>
 </div>
@@ -23,30 +25,37 @@
 <script type="text/javascript">
   var isProduction = false;
   var isDogfood = false;
-  var isLocal = false;
+  var now = Date.now();
   var today = new Date();
-  var date = today.getFullYear() + '-' + (today.getMonth() + 1) + '-' + today.getDate();
+  var todaysDate = today.getFullYear() + '-' + (today.getMonth() + 1) + '-' + today.getDate();
   var entryPointFilename = 'fabric-sitev5';
+  var baseProductionUrl = 'https://static2.sharepointonline.com/files/fabric/fabric-website/dist/';
+  var baseDogfoodUrl = 'https://static2df.sharepointonline.com/files/fabric/fabric-website/dist/';
 
   // Query params
-  var noCompress = getParameterByName('noCompress') === 'true';
-  var devUrl = getParameterByName('devUrl');
-  var dogfood = getParameterByName('isDogfood');
-  var production = getParameterByName('isProduction');
+  var devUrlParam = getParameterByName('devUrl');
+  var dogfoodParam = getParameterByName('isDogfood');
+  var productionParam = getParameterByName('isProduction');
+
+  if (location.hostname == 'developer.microsoft.com' || productionParam) {
+    isProduction = true;
+  } else if (location.hostname.indexOf('devx') > -1 || dogfoodParam) {
+    isDogfood = true;
+    entryPointFilename = 'fabric-sitev5-df';
+  }
+
+  var scripts = [];
 
-  // @TODO: change this to only check for production
-  switch (true) {
-    case location.hostname === 'dev.office.com' || production:
-      isProduction = true;
-      break;
-    case location.hostname === 'officedevcentersite-devx.azurewebsites.net' || location.hostname === 'devx.microsoft-tst.com' || dogfood:
-      isDogfood = true;
-      break;
-    case location.hostname === 'officedevcentersite-release.azurewebsites.net':
-      isProduction = true;
-      break;
+  if (devUrlParam) {
+    scripts.push(devUrlParam);
+  } else if (isDogfood) {
+    scripts.push(baseDogfoodUrl + entryPointFilename + '.js?date=' + now);
+  } else {
+    scripts.push(baseProductionUrl + entryPointFilename + '.min.js?date=' + todaysDate);
   }
 
+  loadScript(scripts);
+
   function loadScript(n) {
     for (var i = 0; i < n.length; i++) {
       var s = document.createElement('script');
@@ -68,27 +77,4 @@
     return decodeURIComponent(results[2].replace(/\+/g, " "));
   }
 
-  var baseProductionUrl = 'https://static2.sharepointonline.com/files/fabric/fabric-website/dist/';
-  var baseDogfoodUrl = 'https://static2df.sharepointonline.com/files/fabric/fabric-website/dist/';
-
-  var scripts = [];
-
-  if (devUrl) {
-    scripts.push(devUrl);
-  } else if (isDogfood) {
-    if (noCompress) {
-      scripts.push(baseDogfoodUrl + entryPointFilename + '.min.js?date=' + Date.now());
-    } else {
-      scripts.push(baseDogfoodUrl + entryPointFilename + '.js?date=' + Date.now());
-    }
-  } else {
-    if (noCompress) {
-      scripts.push(baseProductionUrl + entryPointFilename + '.js?date=' + date);
-    } else {
-      scripts.push(baseProductionUrl + entryPointFilename + '.min.js?date=' + date);
-    }
-  }
-
-  loadScript(scripts);
-
 </script>
\ No newline at end of file
diff --git a/apps/fabric-website/index.html b/apps/fabric-website/index.html
index e4300b4a62ebb..952a273f2da31 100644
--- a/apps/fabric-website/index.html
+++ b/apps/fabric-website/index.html
@@ -29,7 +29,7 @@
 <body>
   <div id="main">
     <div class="loading">
-      <img class="loadingImage" src="https://static2.sharepointonline.com/files/fabric/fabric-website/images/loading.gif" alt="Loading"
+      <img class="loadingImage" src="https://static2.sharepointonline.com/files/fabric/fabric-website/images/spinner.gif" alt="Loading"
         width="32" height="32" />
     </div>
   </div>
@@ -52,56 +52,6 @@
 
     loadScript(scripts);
   </script>
-  <script>
-    // DesignDev Google Analytics
-    (function (i, s, o, g, r, a, m) {
-      i['GoogleAnalyticsObject'] = r; i[r] = i[r] || function () {
-        (i[r].q = i[r].q || []).push(arguments)
-      }, i[r].l = 1 * new Date(); a = s.createElement(o),
-        m = s.getElementsByTagName(o)[0]; a.async = 1; a.src = g; m.parentNode.insertBefore(a, m)
-    })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');
-    ga('create', 'UA-84911004-1', 'auto');
-    ga('send', 'pageview');
-  </script>
-  <script type="text/javascript">
-    var varSegmentation = 0; var varClickTracking = 1; var varCustomerTracking = 1; var varAutoFirePV = 1; var Route = "50000";
-    var Ctrl = "SD300"; var script = document.createElement('script'); script.setAttribute('type', 'text/javascript'); script.src
-      = (window.location.protocol) + "//c.microsoft.com/ms.js"; document.getElementsByTagName('head')[0].appendChild(script);
-  </script>
-  <noscript><img alt="" width="1" height="1" src="http://c.microsoft.com/trans_pixel.aspx" /></noscript>
-  <script>
-      // OfficeDev Google Analytics
-      (function (i, s, o, g, r, a, m) {
-        i['GoogleAnalyticsObject'] = r; i[r] = i[r] || function () {
-          (i[r].q = i[r].q || []).push(arguments)
-        }, i[r].l = 1 * new Date(); a = s.createElement(o),
-          m = s.getElementsByTagName(o)[0]; a.async = 1; a.src = g; m.parentNode.insertBefore(a, m)
-      })(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');
-
-      if (window.location.host.indexOf('localhost') != -1 || window.location.host.indexOf('azurewebsites') != -1) {
-        ga('create', 'UA-65962112-1', 'auto'); //staging and Dev GA
-      } else {
-        ga('create', 'UA-54271502-1', 'auto'); //prod GA
-      }
-      ga('require', 'displayfeatures');
-      ga('require', 'linkid', 'linkid.js');
-      ga('send', 'pageview');
-  </script>
-  <script>
-      // OfficeDev App Insights Telemetry
-      var appInsightInstrumentationKey = "26fb3bba-0fdf-4493-b54e-e974c37cc5bc"; //prod Key
-      if (window.location.host.toLowerCase().indexOf('localhost') != -1 || window.location.host.toLowerCase().indexOf('azurewebsites') != -1) {
-        appInsightInstrumentationKey = "49bc8c7a-c997-4078-819c-f5d51d975aeb"; //staging key
-      }
-      var appInsights = window.appInsights || function (config) {
-        function s(config) { t[config] = function () { var i = arguments; t.queue.push(function () { t[config].apply(t, i) }) } } var t = { config: config }, r = document, f = window, e = "script", o = r.createElement(e), i, u; for (o.src = config.url || "//az416426.vo.msecnd.net/scripts/a/ai.0.js", r.getElementsByTagName(e)[0].parentNode.appendChild(o), t.cookie = r.cookie, t.queue = [], i = ["Event", "Exception", "Metric", "PageView", "Trace"]; i.length;) s("track" + i.pop()); return config.disableExceptionTracking || (i = "onerror", s("_" + i), u = f[i], f[i] = function (config, r, f, e, o) { var s = u && u(config, r, f, e, o); return s !== !0 && t["_" + i](config, r, f, e, o), s }), t
-      }({
-        instrumentationKey: appInsightInstrumentationKey
-      });
-      window.appInsights = appInsights;
-      appInsights.trackPageView();
-  </script>
-
 </body>
 
 </html>
\ No newline at end of file
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 6d1aa3b3bfe75..b90f925bd109e 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -12,7 +12,9 @@
     "build": "node ../../scripts/build.js",
     "clean": "node ../../scripts/clean.js",
     "start": "node ../../scripts/start.js",
-    "production": "node --max_old_space_size=8192 ../../scripts/build.js --production"
+    "production": "node --max_old_space_size=8192 ../../scripts/build.js --production",
+    "dogfood": "node --max_old_space_size=8192 ../../scripts/build.js --dogfood",
+    "startuhf": "node ../../scripts/start.js --webpackConfig webpack.uhf.serve.config.js"
   },
   "license": "MIT",
   "devDependencies": {
@@ -37,7 +39,8 @@
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
     "react-dom": "^15.4.2",
-    "react-highlight": "0.9.0"
+    "react-highlight": "0.9.0",
+    "write-file-webpack-plugin": "^4.1.0"
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
diff --git a/apps/fabric-website/src/components/App/App.scss b/apps/fabric-website/src/components/App/App.scss
index b9981ffb9b061..0faada3ca8a21 100644
--- a/apps/fabric-website/src/components/App/App.scss
+++ b/apps/fabric-website/src/components/App/App.scss
@@ -15,7 +15,6 @@
     flex-direction: column;
     margin: 0 auto;
     max-width: $App-maximumWidth;
-    padding-top: $Header-height; // Keep content from being covered by the header
   }
 
   // Nav is hidden off screen by default
diff --git a/apps/fabric-website/src/components/App/AppState.tsx b/apps/fabric-website/src/components/App/AppState.tsx
index 547f3ea1dfb24..9266734d4993c 100644
--- a/apps/fabric-website/src/components/App/AppState.tsx
+++ b/apps/fabric-website/src/components/App/AppState.tsx
@@ -25,19 +25,22 @@ export const AppState: IAppState = {
       title: 'Fabric',
       url: '#/',
       className: 'fabricPage',
+      isHomePage: true,
+      isUhfLink: true,
       component: require<any>('../../pages/HomePage/HomePage').HomePage,
-      isHomePage: true
     },
     {
       title: 'Get started',
       url: '#/get-started',
       className: 'getStartedPage',
+      isUhfLink: true,
       component: require<any>('../../pages/GetStarted/GetStartedPage').GetStartedPage,
     },
     {
       title: 'Styles',
       url: '#/styles',
       className: 'stylesPage',
+      isUhfLink: true,
       getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Overviews/StylesPage').StylesPage)),
       pages: [
         {
@@ -87,6 +90,7 @@ export const AppState: IAppState = {
       title: 'Components',
       url: '#/components',
       className: 'componentsPage',
+      isUhfLink: true,
       component: require<any>('../../pages/Overviews/ComponentsPage').ComponentsPage,
       pages: [
         {
@@ -388,12 +392,14 @@ export const AppState: IAppState = {
       title: 'Resources',
       url: '#/resources',
       className: 'resourcesPage',
+      isUhfLink: true,
       getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/ResourcesPage/ResourcesPage').ResourcesPage))
     },
     {
       title: 'Blog',
       url: '#/blog',
       className: 'blogPage',
+      isUhfLink: true,
       getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/BlogPage/BlogPage').BlogPage))
     },
     {
diff --git a/apps/fabric-website/src/components/CodeBlock/CodeBlock.tsx b/apps/fabric-website/src/components/CodeBlock/CodeBlock.tsx
index 869df7be29064..e5d8ce6a6f775 100644
--- a/apps/fabric-website/src/components/CodeBlock/CodeBlock.tsx
+++ b/apps/fabric-website/src/components/CodeBlock/CodeBlock.tsx
@@ -1,9 +1,9 @@
 import * as React from 'react';
 import { css } from 'office-ui-fabric-react/lib/Utilities';
 import * as stylesImport from './CodeBlock.module.scss';
-const styles: any = stylesImport;
+import * as  Highlight from 'react-highlight';
 
-const Highlight = require('react-highlight');
+const styles: any = stylesImport;
 
 export interface ICodeBlockProps extends React.HTMLAttributes<HTMLElement> {
   /**
diff --git a/apps/fabric-website/src/components/Header/Header.scss b/apps/fabric-website/src/components/Header/Header.scss
index 631cf8b7f48f3..bb59ec122f9d3 100644
--- a/apps/fabric-website/src/components/Header/Header.scss
+++ b/apps/fabric-website/src/components/Header/Header.scss
@@ -6,7 +6,6 @@
 
 :global {
   .od-Header {
-    background-color: $ms-color-black;
     height: $od-Header-height;
     left: 0;
     padding: 0 8px;
diff --git a/apps/fabric-website/src/components/Header/Header.tsx b/apps/fabric-website/src/components/Header/Header.tsx
index b3fecf807b6ae..b0d4955be45f2 100644
--- a/apps/fabric-website/src/components/Header/Header.tsx
+++ b/apps/fabric-website/src/components/Header/Header.tsx
@@ -1,6 +1,4 @@
 import * as React from 'react';
-import { DONavigation } from '../DONavigation/DONavigation';
-import { DOSearchBox } from '../DOSearchBox/DOSearchBox';
 import './Header.scss';
 
 export interface IHeaderProps {
@@ -14,19 +12,6 @@ export class Header extends React.Component<IHeaderProps, IHeaderState> {
   public render() {
     return (
       <header className='od-Header'>
-        <div className='od-Header-banner'>
-          <div className='od-Header-logo'>
-            <a className='od-Logo-link' href='http://dev.office.com/' aria-label='Back to Office Dev Center website'>
-              <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/logo-office-dev.svg' } width='190' height='48' alt='Office dev center logo image' />
-            </a>
-          </div>
-          <div className='od-Header-searchContainer'>
-            <DOSearchBox />
-          </div>
-        </div>
-        <div className='od-Header-navigationContainer'>
-          <DONavigation />
-        </div>
         <button className='od-Header-hamburgerButton' role='menu' aria-label='Mobile menu, press enter to open'>
           <i className='ms-Icon ms-Icon--menu2' aria-hidden='true' />
         </button>
diff --git a/apps/fabric-website/src/components/Nav/Nav.Props.ts b/apps/fabric-website/src/components/Nav/Nav.Props.ts
index 1c54a2e0b7a5e..6a784cae26007 100644
--- a/apps/fabric-website/src/components/Nav/Nav.Props.ts
+++ b/apps/fabric-website/src/components/Nav/Nav.Props.ts
@@ -53,4 +53,10 @@ export interface INavPage {
    * @default false
    */
   isHomePage?: boolean;
-}
+
+  /**
+   * Whether this link appears in the UHF header nav.
+   * @default false
+   */
+  isUhfLink?: boolean;
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/components/Nav/Nav.module.scss b/apps/fabric-website/src/components/Nav/Nav.module.scss
index 70b5dff61783e..24eaa2eb3acb0 100644
--- a/apps/fabric-website/src/components/Nav/Nav.module.scss
+++ b/apps/fabric-website/src/components/Nav/Nav.module.scss
@@ -6,7 +6,6 @@ $nav-group-header-height: 40px;
   padding-top: 20px;
   @include ms-padding-right(12px);
   padding-bottom: 60px;
-  @include ms-padding-left(36px);
 }
 
 .link {
@@ -29,40 +28,6 @@ $nav-group-header-height: 40px;
   &.hasActiveChild {
     color: $ms-color-white;
     position: relative;
-
-    &::before {
-      content: '';
-      width: 2px;
-      height: 20px;
-      background: $ms-color-neutralTertiary;
-      position: absolute;
-      top: 3px;
-      @include ms-left(-16px);
-    }
-
-    &.fabricPage::before {
-      background-color: $color-home-medium;
-    }
-
-    &.getStartedPage::before {
-      background-color: $color-getStarted-medium;
-    }
-
-    &.stylesPage::before {
-      background-color: $color-styles-medium;
-    }
-
-    &.componentsPage::before {
-      background-color: $color-components-darker;
-    }
-
-    &.resourcesPage::before {
-      background-color: $color-resources-medium;
-    }
-
-    &.resourcesPage::before {
-      background-color: $color-blog-medium;
-    }
   }
 
 
diff --git a/apps/fabric-website/src/components/Nav/Nav.tsx b/apps/fabric-website/src/components/Nav/Nav.tsx
index fab1b9c0da8ad..c90ee4e817034 100644
--- a/apps/fabric-website/src/components/Nav/Nav.tsx
+++ b/apps/fabric-website/src/components/Nav/Nav.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import { css } from 'office-ui-fabric-react/lib/Utilities';
-import { FocusZone, FocusZoneDirection } from 'office-ui-fabric-react/lib/FocusZone';
 import * as stylesImport from './Nav.module.scss';
 const styles: any = stylesImport;
 import {
@@ -25,11 +24,9 @@ export class Nav extends React.Component<INavProps, INavState> {
       : null;
 
     return (
-      <FocusZone direction={ FocusZoneDirection.vertical } >
-        <nav className={ styles.nav } role='navigation'>
-          { links }
-        </nav>
-      </FocusZone>
+      <nav className={ styles.nav } role='navigation'>
+        { links }
+      </nav>
     );
   }
 
@@ -48,14 +45,18 @@ export class Nav extends React.Component<INavProps, INavState> {
         page.isHomePage ? styles.isHomePage : '',
         page.className ? styles[page.className] : ''
       ) } key={ linkIndex }>
-        <a
-          href={ page.url }
-          onClick={ this.props.onLinkClick }
-          title={ title }
-          aria-label={ ariaLabel }
-        >
-          { page.title }
-        </a>
+
+        { page.isUhfLink && location.hostname !== 'localhost' ?
+          '' : <a
+            href={ page.url }
+            onClick={ this.props.onLinkClick }
+            title={ title }
+            aria-label={ ariaLabel }
+          >
+            { page.title }
+          </a>
+        }
+
         { childLinks }
       </li>
     );
@@ -134,4 +135,4 @@ function _hasActiveChild(page: INavPage): boolean {
   }
 
   return hasActiveChild;
-}
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/data/brand-icons-monochrome.json b/apps/fabric-website/src/data/brand-icons-monochrome.json
index 916b5d7daeb17..02af45d9ac39a 100644
--- a/apps/fabric-website/src/data/brand-icons-monochrome.json
+++ b/apps/fabric-website/src/data/brand-icons-monochrome.json
@@ -1,19 +1,15 @@
 [
   { "name": "AADLogo" },
   { "name": "AccessLogo" },
-  { "name": "AlchemyLogo" },
-  { "name": "AppForOfficeLogo" },
   { "name": "ATPLogo" },
   { "name": "AzureLogo" },
   { "name": "BingLogo" },
   { "name": "BookingsLogo" },
   { "name": "ClassNotebookLogo" },
   { "name": "ClassroomLogo" },
-  { "name": "CollabsDBLogo" },
   { "name": "DelveAnalyticsLogo" },
   { "name": "DelveLogo" },
   { "name": "DocsLogo" },
-  { "name": "DynamicsCRMLogo" },
   { "name": "DynamicSMBLogo" },
   { "name": "EdgeLogo" },
   { "name": "ExcelDocument" },
@@ -45,4 +41,4 @@
   { "name": "WordDocument" },
   { "name": "WordLogo" },
   { "name": "YammerLogo" }
-]
+]
\ No newline at end of file
diff --git a/apps/fabric-website/src/data/colors-neutral.json b/apps/fabric-website/src/data/colors-neutral.json
index b7934fc6e9b08..62922afea26bc 100644
--- a/apps/fabric-website/src/data/colors-neutral.json
+++ b/apps/fabric-website/src/data/colors-neutral.json
@@ -27,7 +27,7 @@
   {
     "name": "neutralTertiary",
     "value": "#a6a6a6",
-    "labelColorClass": "ms-fontColor-white"
+    "labelColorClass": "ms-fontColor-black"
   },
   {
     "name": "neutralTertiaryAlt",
@@ -54,4 +54,4 @@
     "value": "#ffffff",
     "labelColorClass": "ms-fontColor-black"
   }
-]
+]
\ No newline at end of file
diff --git a/apps/fabric-website/src/data/colors-theme.json b/apps/fabric-website/src/data/colors-theme.json
index 2002f86d6e9e0..36a66766846fe 100644
--- a/apps/fabric-website/src/data/colors-theme.json
+++ b/apps/fabric-website/src/data/colors-theme.json
@@ -22,12 +22,12 @@
   {
     "name": "themeSecondary",
     "value": "#2b88d8",
-    "labelColorClass": "ms-fontColor-white"
+    "labelColorClass": "ms-fontColor-black"
   },
   {
     "name": "themeTertiary",
     "value": "#71afe5",
-    "labelColorClass": "ms-fontColor-white"
+    "labelColorClass": "ms-fontColor-black"
   },
   {
     "name": "themeLight",
@@ -44,4 +44,4 @@
     "value": "#eff6fc",
     "labelColorClass": "ms-fontColor-black"
   }
-]
+]
\ No newline at end of file
diff --git a/apps/fabric-website/src/pages/HomePage/HomePage.tsx b/apps/fabric-website/src/pages/HomePage/HomePage.tsx
index a6a1b10742fd7..ac39ba5775e9a 100644
--- a/apps/fabric-website/src/pages/HomePage/HomePage.tsx
+++ b/apps/fabric-website/src/pages/HomePage/HomePage.tsx
@@ -3,7 +3,8 @@ import { css } from 'office-ui-fabric-react/lib/Utilities';
 import * as stylesImport from './HomePage.module.scss';
 const styles: any = stylesImport;
 
-const packageData = require('../../../package.json');
+const corePackageData = require('../../../node_modules/office-ui-fabric-core/package.json');
+const reactPackageData = require('../../../node_modules/office-ui-fabric-react/package.json');
 
 export class HomePage extends React.Component<any, any> {
   public render() {
@@ -13,7 +14,7 @@ export class HomePage extends React.Component<any, any> {
           <h1 className={ styles.title }>Office UI Fabric</h1>
           <span className={ styles.tagline }>The official front-end framework for building experiences that fit seamlessly into Office and Office 365.</span>
           <a href='#/get-started' className={ css(styles.button, styles.primaryButton) }>Get started</a>
-          <span className={ styles.version }>Fabric Core { packageData.dependencies['office-ui-fabric-core'] } and Fabric React { packageData.dependencies['office-ui-fabric-react'] }</span>
+          <span className={ styles.version }>Fabric Core { corePackageData.version } and Fabric React { reactPackageData.version }</span>
         </div>
 
         <div className={ styles.flavors }>
diff --git a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss
index 1c3d2db2aaa55..325b394f4d892 100644
--- a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss
+++ b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss
@@ -1,5 +1,9 @@
 @import '../../../styles/variables';
 
+.paragraphInGrid {
+    padding-left: 12px;
+}
+
 .exampleIcons {
   align-items: center;
   display: flex;
diff --git a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
index 53867fa771cf5..c84a604bac0b8 100644
--- a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
@@ -58,7 +58,7 @@ export class BrandIconsPage extends React.Component<any, any> {
         <div className='ms-Grid ms-Grid--wide'>
           <div className='ms-Grid-row'>
             <div className='ms-Grid-col ms-sm12 ms-lg6'>
-              <p>Use product icons to help your users transition between Microsoft products. Product icons represent an app or brand. Do not use a product icon to create a new document of that type. For example, do not create a Word document from a Word product icon.</p>
+              <p className={ styles.paragraphInGrid }>Use product icons to help your users transition between Microsoft products. Product icons represent an app or brand. Do not use a product icon to create a new document of that type. For example, do not create a Word document from a Word product icon.</p>
             </div>
             <div className='ms-Grid-col ms-sm12 ms-lg6'>
               <ul className={ styles.exampleIcons }>
@@ -80,7 +80,7 @@ export class BrandIconsPage extends React.Component<any, any> {
         <div className='ms-Grid ms-Grid--wide'>
           <div className='ms-Grid-row'>
             <div className='ms-Grid-col ms-sm12 ms-lg6'>
-              <p>Use document icons to indicate to users that they are creating a new document of that type. Make sure that a document of the type that the icon represents loads when the user selects the icon. Document icons should always represent Microsoft Office documents. For example, do not use a Word .docx icon to open a .txt file.</p>
+              <p className={ styles.paragraphInGrid }>Use document icons to indicate to users that they are creating a new document of that type. Make sure that a document of the type that the icon represents loads when the user selects the icon. Document icons should always represent Microsoft Office documents. For example, do not use a Word .docx icon to open a .txt file.</p>
             </div>
             <div className='ms-Grid-col ms-sm12 ms-lg6'>
               <ul className={ styles.exampleIcons }>
@@ -102,10 +102,10 @@ export class BrandIconsPage extends React.Component<any, any> {
         <div className='ms-Grid ms-Grid--wide'>
           <div className='ms-Grid-row'>
             <div className='ms-Grid-col ms-sm12 ms-lg6'>
-              <p>Multicolor product and document icons look best at 16x16, 48x48, and 96x96 px sizes in the UI of Microsoft products. Fabric provides these icons in both SVG and PNG formats. SVGs are more versatile but are not supported by all browsers. PNGs are supported by most browsers, but require many sizes to remain visually crisp.</p>
-              <p>PNGs come in 16x16, 32x32, 48x48, and 96x96 pixel sizes. Where possible, use the default sizes to prevent artifacts and split pixels. Otherwise, use a size that is close to one of the default sizes.</p>
-              <p>Because SVGs are vectors, you can resize them more easily. They come in two sizes: 16x16 and 48x48 px. Use the size that most closely maps to what you need for your experience for the best quality.</p>
-              <p>Monochrome product icons that are included in the icon font are subject to the branding guidelines, but you can reference them just like other icons noted in the <a href='#/styles/icons'>icons section</a>.</p>
+              <p className={ styles.paragraphInGrid }>Multicolor product and document icons look best at 16x16, 48x48, and 96x96 px sizes in the UI of Microsoft products. Fabric provides these icons in both SVG and PNG formats. SVGs are more versatile but are not supported by all browsers. PNGs are supported by most browsers, but require many sizes to remain visually crisp.</p>
+              <p className={ styles.paragraphInGrid }>PNGs come in 16x16, 32x32, 48x48, and 96x96 pixel sizes. Where possible, use the default sizes to prevent artifacts and split pixels. Otherwise, use a size that is close to one of the default sizes.</p>
+              <p className={ styles.paragraphInGrid }>Because SVGs are vectors, you can resize them more easily. They come in two sizes: 16x16 and 48x48 px. Use the size that most closely maps to what you need for your experience for the best quality.</p>
+              <p className={ styles.paragraphInGrid }>Monochrome product icons that are included in the icon font are subject to the branding guidelines, but you can reference them just like other icons noted in the <a href='#/styles/icons'>icons section</a>.</p>
             </div>
             <div className='ms-Grid-col ms-sm12 ms-lg6'>
               <ul className={ styles.exampleIcons }>
@@ -140,7 +140,7 @@ export class BrandIconsPage extends React.Component<any, any> {
         <div className='ms-Grid ms-Grid--wide'>
           <div className='ms-Grid-row'>
             <div className='ms-Grid-col ms-sm12 ms-lg6'>
-              <p>Fabric provides multicolor icons of each type and size at different resolutions to accommodate pixel densities and scaling factors across mobile, laptop, and desktop screens. Choose the right resolution for your viewport to avoid icons that appear blurry. The resolution guidance doesn&rsquo;t apply to the monochrome font icons.</p>
+              <p className={ styles.paragraphInGrid }>Fabric provides multicolor icons of each type and size at different resolutions to accommodate pixel densities and scaling factors across mobile, laptop, and desktop screens. Choose the right resolution for your viewport to avoid icons that appear blurry. The resolution guidance doesn&rsquo;t apply to the monochrome font icons.</p>
             </div>
             <div className='ms-Grid-col ms-sm12 ms-lg6'>
               <Table content={ svgResolutionData } />
diff --git a/apps/fabric-website/webpack.config.js b/apps/fabric-website/webpack.config.js
index 8448d155b1210..6275f32875ad0 100644
--- a/apps/fabric-website/webpack.config.js
+++ b/apps/fabric-website/webpack.config.js
@@ -1,46 +1,55 @@
-const path = require('path');
-const resources = require('../../scripts/tasks/webpack-resources');
+module.exports = function (argv) {
+  const path = require('path');
+  const resources = require('../../scripts/tasks/webpack-resources');
+  const version = require('./package.json').version;
+  const isDogfoodArg = argv.indexOf('--dogfood') > -1;
+  const isProductionArg = argv.indexOf('--production') > -1;
+  const now = Date.now();
 
-const isProduction = process.argv.indexOf('--production') > -1;
-const isDogfood = process.argv.indexOf('--dogfood') > -1;
-const version = require('./package.json').version;
-let publicPath = 'https://static2.sharepointonline.com/files/fabric/fabric-website/dist/';
+  // Production defaults
+  let minFileNamePart = '';
+  let entryPointName = 'fabric-sitev5';
+  let publicPath = 'https://static2.sharepointonline.com/files/fabric/fabric-website/dist/';
 
-if (isDogfood) {
-  publicPath = 'https://static2df.sharepointonline.com/files/fabric/fabric-website/dist/';
-} else if (!isProduction) {
-  publicPath = "/dist/";
-}
-const PACKAGE_NAME = 'fabric-sitev5';
-
-module.exports = resources.createConfig(
-  PACKAGE_NAME,
-  isProduction,
-  {
-    entry: {
-      [PACKAGE_NAME]: './lib/root.js'
-    },
-
-    output: {
-      publicPath: publicPath,
-      chunkFilename: `${PACKAGE_NAME}-${version}-[name].min.js`
-    },
+  // Dogfood overrides
+  if (isDogfoodArg) {
+    publicPath = 'https://static2df.sharepointonline.com/files/fabric/fabric-website/dist/';
+    entryPointName = 'fabric-sitev5-df';
+  } else if (!isProductionArg) {
+    publicPath = "/dist/";
+  } else {
+    minFileNamePart = '.min';
+  }
 
-    externals: [
-      {
-        'react': 'React'
+  return resources.createConfig(
+    entryPointName,
+    isProductionArg,
+    {
+      entry: {
+        [entryPointName]: './lib/root.js'
       },
-      {
-        'react-dom': 'ReactDOM'
+
+      output: {
+        publicPath: publicPath,
+        chunkFilename: `${entryPointName}-${version}-[name]-${now}${minFileNamePart}.js`
       },
-    ],
 
-    resolve: {
-      alias: {
-        'office-ui-fabric-react/src': path.join(__dirname, 'node_modules/office-ui-fabric-react/src'),
-        'office-ui-fabric-react/lib': path.join(__dirname, 'node_modules/office-ui-fabric-react/lib')
-      }
+      externals: [
+        {
+          'react': 'React'
+        },
+        {
+          'react-dom': 'ReactDOM'
+        },
+      ],
+
+      resolve: {
+        alias: {
+          'office-ui-fabric-react/src': path.join(__dirname, 'node_modules/office-ui-fabric-react/src'),
+          'office-ui-fabric-react/lib': path.join(__dirname, 'node_modules/office-ui-fabric-react/lib')
+        }
+      },
     },
-  },
-  true /* only production */
-);
+    isProductionArg /* only production */
+  );
+}
diff --git a/apps/fabric-website/webpack.serve.config.js b/apps/fabric-website/webpack.serve.config.js
index 0e87e38525180..5a2191ef9a671 100644
--- a/apps/fabric-website/webpack.serve.config.js
+++ b/apps/fabric-website/webpack.serve.config.js
@@ -1,12 +1,21 @@
+
 let path = require('path');
 let resources = require('../../scripts/tasks/webpack-resources');
+const devServerConfig = {
+  inline: true,
+  port: 4321
+};
+
+const outputConfig = {
+  filename: 'fabric-sitev5.js'
+}
 
 module.exports = resources.createServeConfig({
   entry: './src/root.tsx',
 
-  output: {
-    filename: 'fabric-website.js',
-  },
+  output: outputConfig,
+
+  devServer: devServerConfig,
 
   externals: {
     'react': 'React',
@@ -21,5 +30,5 @@ module.exports = resources.createServeConfig({
       'Example.tsx.js': 'Example'
     }
   }
-
 });
+
diff --git a/apps/fabric-website/webpack.uhf.serve.config.js b/apps/fabric-website/webpack.uhf.serve.config.js
new file mode 100644
index 0000000000000..4e0fa2d8a562c
--- /dev/null
+++ b/apps/fabric-website/webpack.uhf.serve.config.js
@@ -0,0 +1,50 @@
+/**
+ * NOTE: This config file is for when you want to build and serve the website
+ * for the purpose of testing your local changes with the UHF.
+ * Using this will considerably slow down the build and serve process
+ * but will allow you to access the output file on your local machine.
+ */
+
+const path = require('path');
+const PACKAGE_NAME = require('./package.json').name;
+const resources = require('../../scripts/tasks/webpack-resources');
+const WriteFilePlugin = require('write-file-webpack-plugin');
+const HOST_NAME = require('os').hostname();
+const version = require('./package.json').version;
+const isProduction = process.argv.indexOf('--production') > -1;
+const minFileNamePart = isProduction ? '.min' : '';
+const entryPointFilename = 'fabric-sitev5';
+
+module.exports = resources.createServeConfig({
+  entry: './src/root.tsx',
+  output: {
+    filename: entryPointFilename + '.js',
+    path: path.join(__dirname, 'dist'),
+    publicPath: '/dist/',
+    chunkFilename: `${entryPointFilename}-${version}-[name]${minFileNamePart}.js`
+  },
+
+  devServer: {
+    host: HOST_NAME,
+    disableHostCheck: true
+  },
+
+  externals: {
+    'react': 'React',
+    'react-dom': 'ReactDOM'
+  },
+
+  resolve: {
+    alias: {
+      'office-ui-fabric-react/src': path.join(__dirname, 'node_modules/office-ui-fabric-react/src'),
+      'office-ui-fabric-react/lib': path.join(__dirname, 'node_modules/office-ui-fabric-react/lib'),
+      'Props.ts.js': 'Props',
+      'Example.tsx.js': 'Example'
+    }
+  },
+
+  plugins: [
+    new WriteFilePlugin()
+  ]
+
+});
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/brand-icons-page_2017-09-01-22-47.json b/common/changes/@uifabric/fabric-website/brand-icons-page_2017-09-01-22-47.json
new file mode 100644
index 0000000000000..c2753f9bfbbf6
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/brand-icons-page_2017-09-01-22-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Brand icons page clean up.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/miljo-fabric-website-splitone_2017-09-18-21-07.json b/common/changes/@uifabric/fabric-website/miljo-fabric-website-splitone_2017-09-18-21-07.json
new file mode 100644
index 0000000000000..eb196eccf1eb1
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/miljo-fabric-website-splitone_2017-09-18-21-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Added a test case for dogfood check",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "miljo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/new-spinner-gif_2017-09-01-18-13.json b/common/changes/@uifabric/fabric-website/new-spinner-gif_2017-09-01-18-13.json
new file mode 100644
index 0000000000000..996d32d38994e
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/new-spinner-gif_2017-09-01-18-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Initial loading spinner gif changed to mimic our spinner component.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/swatch-text-accessibility_2017-08-28-16-16.json b/common/changes/@uifabric/fabric-website/swatch-text-accessibility_2017-08-28-16-16.json
new file mode 100644
index 0000000000000..0fcc4a694ae12
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/swatch-text-accessibility_2017-08-28-16-16.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Switched some font colors on theme and neutral color swatches from white to black to achieve minimum contrast requirement of 4.5:1 for accessibility.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/update-version-from-num-to-range_2017-08-24-22-58.json b/common/changes/@uifabric/fabric-website/update-version-from-num-to-range_2017-08-24-22-58.json
new file mode 100644
index 0000000000000..447364cad729d
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/update-version-from-num-to-range_2017-08-24-22-58.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Changed where Fabric Core and Fabric React versions were drawing from so that they would appear as a number instead of a range.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/brand-icons-page_2017-09-01-22-47.json b/common/changes/office-ui-fabric-react/brand-icons-page_2017-09-01-22-47.json
new file mode 100644
index 0000000000000..c80c151412069
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/brand-icons-page_2017-09-01-22-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Brand icons page clean up.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index f895be61d47da..78b15c89171c4 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -21,30 +21,6 @@
     "@rush-temp/build": {
       "version": "file:projects\\build",
       "dependencies": {
-        "acorn": {
-          "version": "5.1.1",
-          "bundled": true
-        },
-        "ajv": {
-          "version": "5.2.2",
-          "bundled": true
-        },
-        "ajv-keywords": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "ansi-regex": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "ansi-styles": {
-          "version": "2.2.1",
-          "bundled": true
-        },
-        "async": {
-          "version": "2.5.0",
-          "bundled": true
-        },
         "autoprefixer": {
           "version": "7.1.2",
           "bundled": true
@@ -53,305 +29,13 @@
           "version": "2.3.3",
           "bundled": true
         },
-        "camelcase": {
-          "version": "4.1.0",
-          "bundled": true
-        },
-        "cliui": {
-          "version": "3.2.0",
-          "bundled": true,
-          "dependencies": {
-            "ansi-regex": {
-              "version": "2.1.1",
-              "bundled": true
-            },
-            "is-fullwidth-code-point": {
-              "version": "1.0.0",
-              "bundled": true
-            },
-            "string-width": {
-              "version": "1.0.2",
-              "bundled": true
-            },
-            "strip-ansi": {
-              "version": "3.0.1",
-              "bundled": true
-            }
-          }
-        },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "crypto-browserify": {
-          "version": "3.11.1",
-          "bundled": true
-        },
-        "css-loader": {
-          "version": "0.28.5",
-          "bundled": true,
-          "dependencies": {
-            "ansi-regex": {
-              "version": "2.1.1",
-              "bundled": true
-            },
-            "chalk": {
-              "version": "1.1.3",
-              "bundled": true,
-              "dependencies": {
-                "supports-color": {
-                  "version": "2.0.0",
-                  "bundled": true
-                }
-              }
-            },
-            "has-flag": {
-              "version": "1.0.0",
-              "bundled": true
-            },
-            "postcss": {
-              "version": "5.2.17",
-              "bundled": true
-            },
-            "strip-ansi": {
-              "version": "3.0.1",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "3.2.3",
-              "bundled": true
-            }
-          }
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true
-        },
-        "enhanced-resolve": {
-          "version": "3.4.1",
-          "bundled": true
-        },
-        "etag": {
-          "version": "1.8.0",
-          "bundled": true
-        },
-        "express": {
-          "version": "4.15.4",
-          "bundled": true
-        },
-        "find-up": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "fresh": {
-          "version": "0.5.0",
-          "bundled": true
-        },
-        "has-flag": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "load-json-file": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "loader-utils": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "lodash.camelcase": {
-          "version": "4.3.0",
-          "bundled": true
-        },
-        "mime": {
-          "version": "1.3.4",
-          "bundled": true
-        },
-        "node-libs-browser": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "os-browserify": {
-          "version": "0.2.1",
-          "bundled": true
-        },
-        "os-locale": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "path-to-regexp": {
-          "version": "0.1.7",
-          "bundled": true
-        },
-        "path-type": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "pify": {
-          "version": "2.3.0",
-          "bundled": true
-        },
-        "qs": {
-          "version": "6.5.0",
-          "bundled": true
-        },
-        "read-pkg": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg-up": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "bundled": true,
-          "dependencies": {
-            "string_decoder": {
-              "version": "1.0.3",
-              "bundled": true
-            }
-          }
-        },
         "semver": {
           "version": "5.4.1",
           "bundled": true
         },
-        "send": {
-          "version": "0.15.4",
-          "bundled": true
-        },
-        "serve-static": {
-          "version": "1.12.4",
-          "bundled": true
-        },
-        "source-list-map": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "bundled": true
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "strip-ansi": {
-          "version": "4.0.0",
-          "bundled": true
-        },
-        "strip-bom": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "4.2.1",
-          "bundled": true
-        },
-        "tapable": {
-          "version": "0.2.8",
-          "bundled": true
-        },
-        "timers-browserify": {
-          "version": "2.0.4",
-          "bundled": true
-        },
         "tslint": {
           "version": "5.6.0",
           "bundled": true
-        },
-        "ultron": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "url": {
-          "version": "0.11.0",
-          "bundled": true,
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "bundled": true
-            }
-          }
-        },
-        "watchpack": {
-          "version": "1.4.0",
-          "bundled": true
-        },
-        "webpack": {
-          "version": "3.5.5",
-          "bundled": true,
-          "dependencies": {
-            "yargs": {
-              "version": "8.0.2",
-              "bundled": true
-            }
-          }
-        },
-        "webpack-bundle-analyzer": {
-          "version": "2.9.0",
-          "bundled": true,
-          "dependencies": {
-            "ansi-regex": {
-              "version": "2.1.1",
-              "bundled": true
-            },
-            "chalk": {
-              "version": "1.1.3",
-              "bundled": true
-            },
-            "lodash": {
-              "version": "4.17.4",
-              "bundled": true
-            },
-            "strip-ansi": {
-              "version": "3.0.1",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "2.0.0",
-              "bundled": true
-            }
-          }
-        },
-        "webpack-sources": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "which-module": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "ws": {
-          "version": "2.3.1",
-          "bundled": true,
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "bundled": true
-            }
-          }
-        },
-        "yargs-parser": {
-          "version": "7.0.0",
-          "bundled": true
         }
       }
     },
@@ -382,24 +66,6 @@
           "version": "4.1.0",
           "bundled": true
         },
-        "chalk": {
-          "version": "1.1.3",
-          "bundled": true,
-          "dependencies": {
-            "ansi-regex": {
-              "version": "2.1.1",
-              "bundled": true
-            },
-            "strip-ansi": {
-              "version": "3.0.1",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "2.0.0",
-              "bundled": true
-            }
-          }
-        },
         "commander": {
           "version": "2.9.0",
           "bundled": true
@@ -412,13 +78,15 @@
           "version": "3.11.1",
           "bundled": true
         },
-        "css-loader": {
-          "version": "0.28.5",
-          "bundled": true
-        },
         "debug": {
           "version": "2.6.8",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "ms": {
+              "version": "2.0.0",
+              "bundled": true
+            }
+          }
         },
         "diff": {
           "version": "3.2.0",
@@ -456,10 +124,6 @@
           "version": "1.1.0",
           "bundled": true
         },
-        "lodash.camelcase": {
-          "version": "4.3.0",
-          "bundled": true
-        },
         "mocha": {
           "version": "3.5.0",
           "bundled": true
@@ -484,16 +148,6 @@
           "version": "2.0.0",
           "bundled": true
         },
-        "postcss": {
-          "version": "5.2.17",
-          "bundled": true,
-          "dependencies": {
-            "supports-color": {
-              "version": "3.2.3",
-              "bundled": true
-            }
-          }
-        },
         "read-pkg": {
           "version": "2.0.0",
           "bundled": true
@@ -522,7 +176,17 @@
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "0.9.2",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "0.2.17",
+              "bundled": true
+            }
+          }
         },
         "stream-browserify": {
           "version": "2.0.1",
@@ -540,10 +204,6 @@
           "version": "3.0.0",
           "bundled": true
         },
-        "style-loader": {
-          "version": "0.17.0",
-          "bundled": true
-        },
         "supports-color": {
           "version": "3.1.2",
           "bundled": true
@@ -691,10 +351,6 @@
           "version": "3.11.1",
           "bundled": true
         },
-        "css-loader": {
-          "version": "0.28.5",
-          "bundled": true
-        },
         "debug": {
           "version": "2.6.8",
           "bundled": true
@@ -735,10 +391,6 @@
           "version": "1.1.0",
           "bundled": true
         },
-        "lodash.camelcase": {
-          "version": "4.3.0",
-          "bundled": true
-        },
         "mocha": {
           "version": "3.5.0",
           "bundled": true
@@ -769,10 +421,6 @@
             }
           }
         },
-        "postcss-loader": {
-          "version": "1.3.3",
-          "bundled": true
-        },
         "read-pkg": {
           "version": "2.0.0",
           "bundled": true
@@ -815,10 +463,6 @@
           "version": "3.0.0",
           "bundled": true
         },
-        "style-loader": {
-          "version": "0.17.0",
-          "bundled": true
-        },
         "supports-color": {
           "version": "3.1.2",
           "bundled": true
@@ -946,10 +590,6 @@
           "version": "3.11.1",
           "bundled": true
         },
-        "css-loader": {
-          "version": "0.28.5",
-          "bundled": true
-        },
         "debug": {
           "version": "2.6.8",
           "bundled": true
@@ -990,10 +630,6 @@
           "version": "1.1.0",
           "bundled": true
         },
-        "lodash.camelcase": {
-          "version": "4.3.0",
-          "bundled": true
-        },
         "mocha": {
           "version": "3.5.0",
           "bundled": true
@@ -1018,14 +654,26 @@
           "version": "5.2.17",
           "bundled": true,
           "dependencies": {
+            "source-map": {
+              "version": "0.5.7",
+              "bundled": true
+            },
             "supports-color": {
               "version": "3.2.3",
               "bundled": true
             }
           }
         },
-        "postcss-loader": {
-          "version": "1.3.3",
+        "react": {
+          "version": "15.6.1",
+          "bundled": true
+        },
+        "react-dom": {
+          "version": "15.6.1",
+          "bundled": true
+        },
+        "react-highlight": {
+          "version": "0.9.0",
           "bundled": true
         },
         "read-pkg": {
@@ -1046,6 +694,10 @@
             }
           }
         },
+        "sinon": {
+          "version": "2.4.1",
+          "bundled": true
+        },
         "source-list-map": {
           "version": "2.0.0",
           "bundled": true
@@ -1056,7 +708,17 @@
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "0.9.2",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "0.2.17",
+              "bundled": true
+            }
+          }
         },
         "stream-browserify": {
           "version": "2.0.1",
@@ -1262,10 +924,6 @@
           "version": "3.11.1",
           "bundled": true
         },
-        "css-loader": {
-          "version": "0.28.5",
-          "bundled": true
-        },
         "debug": {
           "version": "2.6.8",
           "bundled": true
@@ -1306,10 +964,6 @@
           "version": "1.1.0",
           "bundled": true
         },
-        "lodash.camelcase": {
-          "version": "4.3.0",
-          "bundled": true
-        },
         "mocha": {
           "version": "3.5.0",
           "bundled": true
@@ -1334,16 +988,16 @@
           "version": "5.2.17",
           "bundled": true,
           "dependencies": {
+            "source-map": {
+              "version": "0.5.7",
+              "bundled": true
+            },
             "supports-color": {
               "version": "3.2.3",
               "bundled": true
             }
           }
         },
-        "postcss-loader": {
-          "version": "1.3.3",
-          "bundled": true
-        },
         "read-pkg": {
           "version": "2.0.0",
           "bundled": true
@@ -1376,7 +1030,17 @@
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "0.9.2",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "0.2.17",
+              "bundled": true
+            }
+          }
         },
         "stream-browserify": {
           "version": "2.0.1",
@@ -1394,10 +1058,6 @@
           "version": "3.0.0",
           "bundled": true
         },
-        "style-loader": {
-          "version": "0.17.0",
-          "bundled": true
-        },
         "supports-color": {
           "version": "3.1.2",
           "bundled": true
@@ -1843,7 +1503,17 @@
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "0.9.2",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "0.2.17",
+              "bundled": true
+            }
+          }
         },
         "stream-browserify": {
           "version": "2.0.1",
@@ -2054,7 +1724,17 @@
         },
         "source-map-loader": {
           "version": "0.2.1",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "0.9.2",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "0.2.17",
+              "bundled": true
+            }
+          }
         },
         "stream-browserify": {
           "version": "2.0.1",
@@ -2162,7 +1842,13 @@
         },
         "debug": {
           "version": "2.6.8",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "ms": {
+              "version": "2.0.0",
+              "bundled": true
+            }
+          }
         },
         "diff": {
           "version": "3.2.0",
@@ -2216,6 +1902,10 @@
             }
           }
         },
+        "css-loader": {
+          "version": "0.27.3",
+          "bundled": true
+        },
         "has-flag": {
           "version": "1.0.0",
           "bundled": true
@@ -2228,6 +1918,10 @@
           "version": "1.3.3",
           "bundled": true
         },
+        "source-list-map": {
+          "version": "0.1.8",
+          "bundled": true
+        },
         "style-loader": {
           "version": "0.16.1",
           "bundled": true
@@ -2278,49 +1972,10 @@
       "resolved": "https://registry.npmjs.org/@storybook/react/-/react-3.2.8.tgz",
       "integrity": "sha1-fUPvRQVZt887PswXzFTVoJ1epAI=",
       "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
-        },
-        "css-loader": {
-          "version": "0.28.7",
-          "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.7.tgz",
-          "integrity": "sha512-GxMpax8a/VgcfRrVy0gXD6yLd5ePYbXX/5zGgTVYp4wXtJklS8Z2VaUArJgc//f6/Dzil7BaJObdSv8eKKCPgg=="
-        },
-        "has-flag": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
-          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
-        },
-        "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs=",
-          "dependencies": {
-            "chalk": {
-              "version": "1.1.3",
-              "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-              "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
-              "dependencies": {
-                "supports-color": {
-                  "version": "2.0.0",
-                  "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-                  "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-                }
-              }
-            }
-          }
-        },
         "style-loader": {
           "version": "0.17.0",
           "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.17.0.tgz",
           "integrity": "sha1-6CVLzNt690vVgnTjYQe01atN8xA="
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
         }
       }
     },
@@ -2584,9 +2239,9 @@
       "integrity": "sha1-126/jKlNJ24keja61EpLdKthGZE="
     },
     "aproba": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.1.2.tgz",
-      "integrity": "sha512-ZpYajIfO0j2cOFTO955KUMIKNmj6zhX8kVztMAxFsDaMwz+9Z9SV0uou2pC9HJqcfpffOsjnbrDMvkNy+9RXPw=="
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.2.0.tgz",
+      "integrity": "sha512-Y9J6ZjXtoYh8RnXVCMOU/ttDmk1aBjunq9vO0ta5x85WDQiQfUF9sIPBITdbiiIVcBo03Hi3jMxigBtsddlXRw=="
     },
     "are-we-there-yet": {
       "version": "1.1.4",
@@ -2613,6 +2268,11 @@
       "resolved": "https://registry.npmjs.org/arr-union/-/arr-union-3.1.0.tgz",
       "integrity": "sha1-45sJrqne+Gao8gbiiK9jkZuuOcQ="
     },
+    "array-back": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/array-back/-/array-back-2.0.0.tgz",
+      "integrity": "sha512-eJv4pLLufP3g5kcZry0j6WXpIbzYw9GUB4mVJZno9wfwiBxbizTnHCw3VJb07cBihbFX48Y7oSrW9y+gt4glyw=="
+    },
     "array-equal": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/array-equal/-/array-equal-1.0.0.tgz",
@@ -2704,9 +2364,9 @@
       "integrity": "sha1-mZEtWRg2tab1s0XA8H7vwI/GXZE="
     },
     "assert-plus": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-0.2.0.tgz",
-      "integrity": "sha1-104bh+ev/A24qttwIfP+SBAasjQ="
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+      "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
     },
     "assertion-error": {
       "version": "1.0.2",
@@ -2771,9 +2431,9 @@
       "integrity": "sha512-zGGD6j6jYYtIOBtfhtnrbNB3dlDThVdgF9CQhkPqBwPUUsyJOHNxj9d2LOmVJY1PlBoNPABoDeyRfphIDeYGxA=="
     },
     "aws-sign2": {
-      "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz",
-      "integrity": "sha1-FDQt0428yU0OW4fXY81jYSwOeU8="
+      "version": "0.7.0",
+      "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.7.0.tgz",
+      "integrity": "sha1-tG6JCTSpWR8tL2+G1+ap8bP+dqg="
     },
     "aws4": {
       "version": "1.6.0",
@@ -3570,11 +3230,6 @@
           "version": "0.4.19",
           "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.19.tgz",
           "integrity": "sha512-oTZqweIP51xaGPI4uPa56/Pri/480R+mo7SeU+YETByQNhDG55ycFyNLIgta9vXhILrxXDmF7ZGhqZIcuN0gJQ=="
-        },
-        "qs": {
-          "version": "6.5.1",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-6.5.1.tgz",
-          "integrity": "sha512-eRzhrN1WSINYCDCbrz796z37LOe3m5tmW7RQf6oBntukAG1nmovJvhnwHHRMAfeoItc1m2Hk02WER2aQ/iqs+A=="
         }
       }
     },
@@ -3596,9 +3251,9 @@
       "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24="
     },
     "boom": {
-      "version": "2.10.1",
-      "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
-      "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8="
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/boom/-/boom-4.3.1.tgz",
+      "integrity": "sha1-T4owBctKfjiJ90kDD9JbluAdLjE="
     },
     "bowser": {
       "version": "1.7.3",
@@ -4008,6 +3663,11 @@
       "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz",
       "integrity": "sha1-k4NwpXtKUd6ix3wV1cX9+JUWQAk="
     },
+    "command-line-args": {
+      "version": "4.0.7",
+      "resolved": "https://registry.npmjs.org/command-line-args/-/command-line-args-4.0.7.tgz",
+      "integrity": "sha512-aUdPvQRAyBvQd2n7jXcsMDz68ckBJELXNzBybCHOibUWEg0mWTnaYCSRU8h9R+aNRSvDihJtssSRCiDRpLaezA=="
+    },
     "commander": {
       "version": "2.11.0",
       "resolved": "https://registry.npmjs.org/commander/-/commander-2.11.0.tgz",
@@ -4172,15 +3832,27 @@
       "resolved": "https://registry.npmjs.org/create-hmac/-/create-hmac-1.1.6.tgz",
       "integrity": "sha1-rLniIaThe9sHbpBlfEK5PjcmzwY="
     },
+    "create-react-class": {
+      "version": "15.6.0",
+      "resolved": "https://registry.npmjs.org/create-react-class/-/create-react-class-15.6.0.tgz",
+      "integrity": "sha1-q0SEl8JlZuHilBPogyB9V8/nvtQ="
+    },
     "cross-spawn": {
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-5.1.0.tgz",
       "integrity": "sha1-6L0O/uWPz/b4+UUQoKVUu/ojVEk="
     },
     "cryptiles": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz",
-      "integrity": "sha1-O9/s3GCBR8HGcgL6KR59ylnqo7g="
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-3.1.2.tgz",
+      "integrity": "sha1-qJ+7Ig9c4l7FboxKqKT9e1sNKf4=",
+      "dependencies": {
+        "boom": {
+          "version": "5.2.0",
+          "resolved": "https://registry.npmjs.org/boom/-/boom-5.2.0.tgz",
+          "integrity": "sha512-Z5BTk6ZRe4tXXQlkqftmsAUANpXmuwlsF5Oov8ThoMbQRzdGTA1ngYRW160GexgOgjsFOKJz0LYhoNi+2AMBUw=="
+        }
+      }
     },
     "crypto-browserify": {
       "version": "3.11.1",
@@ -4203,9 +3875,9 @@
       "integrity": "sha512-yuWmPMD9FLi50Xf3k8W8oO3WM1eVnxEGCldCLyfusQ+CgivFk0s23yst4ooW6tfxMuSa03S6uUEga9UhX6GRrA=="
     },
     "css-loader": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.27.3.tgz",
-      "integrity": "sha1-aatvR7ab+xtazuYbrCqrFDAv8Nw=",
+      "version": "0.28.7",
+      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.7.tgz",
+      "integrity": "sha512-GxMpax8a/VgcfRrVy0gXD6yLd5ePYbXX/5zGgTVYp4wXtJklS8Z2VaUArJgc//f6/Dzil7BaJObdSv8eKKCPgg==",
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -4234,11 +3906,6 @@
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
           "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
         },
-        "source-list-map": {
-          "version": "0.1.8",
-          "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-0.1.8.tgz",
-          "integrity": "sha1-xVCyq1Qn9rPyH1r+rYjE9Vh7IQY="
-        },
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
@@ -4392,14 +4059,7 @@
     "dashdash": {
       "version": "1.14.1",
       "resolved": "https://registry.npmjs.org/dashdash/-/dashdash-1.14.1.tgz",
-      "integrity": "sha1-hTz6D3y+L+1d4gMmuN1YEDX24vA=",
-      "dependencies": {
-        "assert-plus": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
-        }
-      }
+      "integrity": "sha1-hTz6D3y+L+1d4gMmuN1YEDX24vA="
     },
     "date-now": {
       "version": "0.1.4",
@@ -5111,6 +4771,18 @@
       "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
       "integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ="
     },
+    "find-replace": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/find-replace/-/find-replace-1.0.3.tgz",
+      "integrity": "sha1-uI5zZNLZyVlVnziMZmcNYTBEH6A=",
+      "dependencies": {
+        "array-back": {
+          "version": "1.0.4",
+          "resolved": "https://registry.npmjs.org/array-back/-/array-back-1.0.4.tgz",
+          "integrity": "sha1-ZEun8JX3/898Q7Xw3DnTwfA8Bjs="
+        }
+      }
+    },
     "find-up": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz",
@@ -5147,9 +4819,9 @@
       "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE="
     },
     "form-data": {
-      "version": "2.1.4",
-      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
-      "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE="
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.3.1.tgz",
+      "integrity": "sha1-b7lPvXGIUwbXPRXMSX/kzE7NRL8="
     },
     "formatio": {
       "version": "1.2.0",
@@ -5816,14 +5488,7 @@
     "getpass": {
       "version": "0.1.7",
       "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
-      "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo=",
-      "dependencies": {
-        "assert-plus": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
-        }
-      }
+      "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo="
     },
     "github": {
       "version": "7.3.2",
@@ -5942,21 +5607,14 @@
       }
     },
     "har-schema": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-1.0.5.tgz",
-      "integrity": "sha1-0mMTX0MwfALGAq/I/pWXDAFRNp4="
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-2.0.0.tgz",
+      "integrity": "sha1-qUwiJOvKwEeCoNkDVSHyRzW37JI="
     },
     "har-validator": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz",
-      "integrity": "sha1-M0gdDxu/9gDdID11gSpqX7oALio=",
-      "dependencies": {
-        "ajv": {
-          "version": "4.11.8",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz",
-          "integrity": "sha1-gv+wKynmYq5TvcIK8VlHcGc5xTY="
-        }
-      }
+      "version": "5.0.3",
+      "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-5.0.3.tgz",
+      "integrity": "sha1-ukAsJmGU8VlW7xXg/PJCmT9qff0="
     },
     "has": {
       "version": "1.0.1",
@@ -6028,9 +5686,9 @@
       "integrity": "sha1-eNfL/B5tZjA/55g3NlmEUXsvbuE="
     },
     "hawk": {
-      "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz",
-      "integrity": "sha1-B4REvXwWQLD+VA0sm3PVlnjo4cQ="
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/hawk/-/hawk-6.0.2.tgz",
+      "integrity": "sha512-miowhl2+U7Qle4vdLqDdPt9m09K6yZhkLDTWGoUiUzrQCn+mHHSmfJgAyGaLRZbPmTqfFFjRV1QWCW0VWUJBbQ=="
     },
     "highlight.js": {
       "version": "9.12.0",
@@ -6043,9 +5701,9 @@
       "integrity": "sha1-0nRXAQJabHdabFRXk+1QL8DGSaE="
     },
     "hoek": {
-      "version": "2.16.3",
-      "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz",
-      "integrity": "sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0="
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/hoek/-/hoek-4.2.0.tgz",
+      "integrity": "sha512-v0XCLxICi9nPfYrS9RL8HbYnXi9obYAeLbSP00BmnZwCK9+Ih9WOjoZ8YoHCoav2csqn4FOz4Orldsy2dmDwmQ=="
     },
     "hoist-non-react-statics": {
       "version": "1.2.0",
@@ -6189,9 +5847,9 @@
       }
     },
     "http-signature": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz",
-      "integrity": "sha1-33LiZwZs0Kxn+3at+OE0qPvPkb8="
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.2.0.tgz",
+      "integrity": "sha1-muzZJRFHcvPZW2WmCruPfBj7rOE="
     },
     "https-browserify": {
       "version": "0.0.1",
@@ -7092,14 +6750,7 @@
     "joi": {
       "version": "9.2.0",
       "resolved": "https://registry.npmjs.org/joi/-/joi-9.2.0.tgz",
-      "integrity": "sha1-M4WseQGSEwy+Iw6ALsAskhW7/to=",
-      "dependencies": {
-        "hoek": {
-          "version": "4.2.0",
-          "resolved": "https://registry.npmjs.org/hoek/-/hoek-4.2.0.tgz",
-          "integrity": "sha512-v0XCLxICi9nPfYrS9RL8HbYnXi9obYAeLbSP00BmnZwCK9+Ih9WOjoZ8YoHCoav2csqn4FOz4Orldsy2dmDwmQ=="
-        }
-      }
+      "integrity": "sha1-M4WseQGSEwy+Iw6ALsAskhW7/to="
     },
     "js-base64": {
       "version": "2.3.2",
@@ -7190,14 +6841,7 @@
     "jsprim": {
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.1.tgz",
-      "integrity": "sha1-MT5mvB5cwG5Di8G3SZwuXFastqI=",
-      "dependencies": {
-        "assert-plus": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
-        }
-      }
+      "integrity": "sha1-MT5mvB5cwG5Di8G3SZwuXFastqI="
     },
     "just-extend": {
       "version": "1.1.22",
@@ -8482,9 +8126,9 @@
       "integrity": "sha1-elfrVQpng/kRUzH89GY9XI4AelA="
     },
     "performance-now": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-0.2.0.tgz",
-      "integrity": "sha1-M+8wxcd9TqIcWlOGnZG1bY8lVeU="
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz",
+      "integrity": "sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns="
     },
     "phantomjs-polyfill": {
       "version": "0.0.2",
@@ -8496,11 +8140,86 @@
       "resolved": "https://registry.npmjs.org/phantomjs-prebuilt/-/phantomjs-prebuilt-2.1.15.tgz",
       "integrity": "sha1-IPhugtM0nFBZF1J3RbekEeCLOQM=",
       "dependencies": {
+        "ajv": {
+          "version": "4.11.8",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz",
+          "integrity": "sha1-gv+wKynmYq5TvcIK8VlHcGc5xTY="
+        },
+        "assert-plus": {
+          "version": "0.2.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-0.2.0.tgz",
+          "integrity": "sha1-104bh+ev/A24qttwIfP+SBAasjQ="
+        },
+        "aws-sign2": {
+          "version": "0.6.0",
+          "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz",
+          "integrity": "sha1-FDQt0428yU0OW4fXY81jYSwOeU8="
+        },
+        "boom": {
+          "version": "2.10.1",
+          "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
+          "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8="
+        },
+        "cryptiles": {
+          "version": "2.0.5",
+          "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz",
+          "integrity": "sha1-O9/s3GCBR8HGcgL6KR59ylnqo7g="
+        },
         "es6-promise": {
           "version": "4.0.5",
           "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.0.5.tgz",
           "integrity": "sha1-eILzCt3lskDM+n99eMVIMwlRrkI="
         },
+        "form-data": {
+          "version": "2.1.4",
+          "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
+          "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE="
+        },
+        "har-schema": {
+          "version": "1.0.5",
+          "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-1.0.5.tgz",
+          "integrity": "sha1-0mMTX0MwfALGAq/I/pWXDAFRNp4="
+        },
+        "har-validator": {
+          "version": "4.2.1",
+          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz",
+          "integrity": "sha1-M0gdDxu/9gDdID11gSpqX7oALio="
+        },
+        "hawk": {
+          "version": "3.1.3",
+          "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz",
+          "integrity": "sha1-B4REvXwWQLD+VA0sm3PVlnjo4cQ="
+        },
+        "hoek": {
+          "version": "2.16.3",
+          "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz",
+          "integrity": "sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0="
+        },
+        "http-signature": {
+          "version": "1.1.1",
+          "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz",
+          "integrity": "sha1-33LiZwZs0Kxn+3at+OE0qPvPkb8="
+        },
+        "performance-now": {
+          "version": "0.2.0",
+          "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-0.2.0.tgz",
+          "integrity": "sha1-M+8wxcd9TqIcWlOGnZG1bY8lVeU="
+        },
+        "qs": {
+          "version": "6.4.0",
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.4.0.tgz",
+          "integrity": "sha1-E+JtKK1rD/qpExLNO/cI7TUecjM="
+        },
+        "request": {
+          "version": "2.81.0",
+          "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz",
+          "integrity": "sha1-xpKJRqDgbF+Nb4qTM0af/aRimKA="
+        },
+        "sntp": {
+          "version": "1.0.9",
+          "resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz",
+          "integrity": "sha1-ZUEYTMkK7qbG57NeJlkIJEPGYZg="
+        },
         "which": {
           "version": "1.2.14",
           "resolved": "https://registry.npmjs.org/which/-/which-1.2.14.tgz",
@@ -9698,9 +9417,9 @@
       "integrity": "sha1-ZZ3p8s+NzCehSBJ28gU3cnI4LnM="
     },
     "qs": {
-      "version": "6.4.0",
-      "resolved": "https://registry.npmjs.org/qs/-/qs-6.4.0.tgz",
-      "integrity": "sha1-E+JtKK1rD/qpExLNO/cI7TUecjM="
+      "version": "6.5.1",
+      "resolved": "https://registry.npmjs.org/qs/-/qs-6.5.1.tgz",
+      "integrity": "sha512-eRzhrN1WSINYCDCbrz796z37LOe3m5tmW7RQf6oBntukAG1nmovJvhnwHHRMAfeoItc1m2Hk02WER2aQ/iqs+A=="
     },
     "query-string": {
       "version": "4.3.4",
@@ -10050,9 +9769,9 @@
       "integrity": "sha1-UhTFOpJtNVJwdSf7q0FdvAjQbdo="
     },
     "request": {
-      "version": "2.81.0",
-      "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz",
-      "integrity": "sha1-xpKJRqDgbF+Nb4qTM0af/aRimKA="
+      "version": "2.82.0",
+      "resolved": "https://registry.npmjs.org/request/-/request-2.82.0.tgz",
+      "integrity": "sha512-/QWqfmyTfQ4OYs6EhB1h2wQsX9ZxbuNePCvCm0Mdz/mxw73mjdg0D4QdIl0TQBFs35CZmMXLjk0iCGK395CUDg=="
     },
     "request-progress": {
       "version": "2.0.1",
@@ -10213,11 +9932,26 @@
           "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
           "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
         },
+        "assert-plus": {
+          "version": "0.2.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-0.2.0.tgz",
+          "integrity": "sha1-104bh+ev/A24qttwIfP+SBAasjQ="
+        },
+        "aws-sign2": {
+          "version": "0.6.0",
+          "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz",
+          "integrity": "sha1-FDQt0428yU0OW4fXY81jYSwOeU8="
+        },
         "bluebird": {
           "version": "3.4.7",
           "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.4.7.tgz",
           "integrity": "sha1-9y12C+Cbf3bQjtj66Ysomo0F+rM="
         },
+        "boom": {
+          "version": "2.10.1",
+          "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
+          "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8="
+        },
         "bytes": {
           "version": "2.3.0",
           "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.3.0.tgz",
@@ -10248,6 +9982,11 @@
           "resolved": "https://registry.npmjs.org/connect/-/connect-3.5.1.tgz",
           "integrity": "sha1-bTDXpjx/FwhXprOqazY9lz3KWI4="
         },
+        "cryptiles": {
+          "version": "2.0.5",
+          "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz",
+          "integrity": "sha1-O9/s3GCBR8HGcgL6KR59ylnqo7g="
+        },
         "debug": {
           "version": "2.2.0",
           "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
@@ -10258,11 +9997,31 @@
           "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.5.1.tgz",
           "integrity": "sha1-LEANjUUwk1vCMlScX6OF7Afeb80="
         },
+        "form-data": {
+          "version": "2.1.4",
+          "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
+          "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE="
+        },
         "har-validator": {
           "version": "2.0.6",
           "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz",
           "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0="
         },
+        "hawk": {
+          "version": "3.1.3",
+          "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz",
+          "integrity": "sha1-B4REvXwWQLD+VA0sm3PVlnjo4cQ="
+        },
+        "hoek": {
+          "version": "2.16.3",
+          "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz",
+          "integrity": "sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0="
+        },
+        "http-signature": {
+          "version": "1.1.1",
+          "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz",
+          "integrity": "sha1-33LiZwZs0Kxn+3at+OE0qPvPkb8="
+        },
         "lodash": {
           "version": "4.16.6",
           "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.16.6.tgz",
@@ -10288,6 +10047,11 @@
           "resolved": "https://registry.npmjs.org/request/-/request-2.78.0.tgz",
           "integrity": "sha1-4cjew0bhyBkjskrNszfxHeyr6cw="
         },
+        "sntp": {
+          "version": "1.0.9",
+          "resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz",
+          "integrity": "sha1-ZUEYTMkK7qbG57NeJlkIJEPGYZg="
+        },
         "supports-color": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
@@ -10315,26 +10079,48 @@
           "resolved": "https://registry.npmjs.org/acorn-globals/-/acorn-globals-1.0.9.tgz",
           "integrity": "sha1-VbtemGkVB7dFedBRNBMhfDgMVM8="
         },
+        "ajv": {
+          "version": "4.11.8",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz",
+          "integrity": "sha1-gv+wKynmYq5TvcIK8VlHcGc5xTY="
+        },
         "ansi-styles": {
           "version": "2.2.1",
           "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
           "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
         },
+        "assert-plus": {
+          "version": "0.2.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-0.2.0.tgz",
+          "integrity": "sha1-104bh+ev/A24qttwIfP+SBAasjQ="
+        },
+        "aws-sign2": {
+          "version": "0.6.0",
+          "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz",
+          "integrity": "sha1-FDQt0428yU0OW4fXY81jYSwOeU8="
+        },
         "bluebird": {
           "version": "3.4.7",
           "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.4.7.tgz",
           "integrity": "sha1-9y12C+Cbf3bQjtj66Ysomo0F+rM="
         },
+        "boom": {
+          "version": "2.10.1",
+          "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
+          "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8=",
+          "dependencies": {
+            "hoek": {
+              "version": "2.16.3",
+              "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz",
+              "integrity": "sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0="
+            }
+          }
+        },
         "bytes": {
           "version": "2.3.0",
           "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.3.0.tgz",
           "integrity": "sha1-1baAoWW2IBc5rLYRVCqrwtjOsHA="
         },
-        "caseless": {
-          "version": "0.11.0",
-          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz",
-          "integrity": "sha1-cVuW6phBWTzDMGeSP17GDr2k99c="
-        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -10355,6 +10141,11 @@
           "resolved": "https://registry.npmjs.org/connect/-/connect-3.5.1.tgz",
           "integrity": "sha1-bTDXpjx/FwhXprOqazY9lz3KWI4="
         },
+        "cryptiles": {
+          "version": "2.0.5",
+          "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz",
+          "integrity": "sha1-O9/s3GCBR8HGcgL6KR59ylnqo7g="
+        },
         "debug": {
           "version": "2.2.0",
           "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
@@ -10365,15 +10156,37 @@
           "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.5.1.tgz",
           "integrity": "sha1-LEANjUUwk1vCMlScX6OF7Afeb80="
         },
+        "form-data": {
+          "version": "2.1.4",
+          "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
+          "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE="
+        },
+        "har-schema": {
+          "version": "1.0.5",
+          "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-1.0.5.tgz",
+          "integrity": "sha1-0mMTX0MwfALGAq/I/pWXDAFRNp4="
+        },
         "har-validator": {
-          "version": "2.0.6",
-          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz",
-          "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0="
+          "version": "4.2.1",
+          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz",
+          "integrity": "sha1-M0gdDxu/9gDdID11gSpqX7oALio="
         },
-        "hoek": {
-          "version": "4.2.0",
-          "resolved": "https://registry.npmjs.org/hoek/-/hoek-4.2.0.tgz",
-          "integrity": "sha512-v0XCLxICi9nPfYrS9RL8HbYnXi9obYAeLbSP00BmnZwCK9+Ih9WOjoZ8YoHCoav2csqn4FOz4Orldsy2dmDwmQ=="
+        "hawk": {
+          "version": "3.1.3",
+          "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz",
+          "integrity": "sha1-B4REvXwWQLD+VA0sm3PVlnjo4cQ=",
+          "dependencies": {
+            "hoek": {
+              "version": "2.16.3",
+              "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz",
+              "integrity": "sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0="
+            }
+          }
+        },
+        "http-signature": {
+          "version": "1.1.1",
+          "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz",
+          "integrity": "sha1-33LiZwZs0Kxn+3at+OE0qPvPkb8="
         },
         "joi": {
           "version": "10.0.6",
@@ -10395,16 +10208,36 @@
           "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz",
           "integrity": "sha1-sEDrCSOWivq/jTL7HxfxFn/auQc="
         },
+        "performance-now": {
+          "version": "0.2.0",
+          "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-0.2.0.tgz",
+          "integrity": "sha1-M+8wxcd9TqIcWlOGnZG1bY8lVeU="
+        },
         "qs": {
-          "version": "6.3.2",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-6.3.2.tgz",
-          "integrity": "sha1-51vV9uJoEioqDgvaYwslUMFmUCw="
+          "version": "6.4.0",
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.4.0.tgz",
+          "integrity": "sha1-E+JtKK1rD/qpExLNO/cI7TUecjM="
+        },
+        "request": {
+          "version": "2.81.0",
+          "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz",
+          "integrity": "sha1-xpKJRqDgbF+Nb4qTM0af/aRimKA="
         },
         "screener-runner": {
           "version": "0.7.0",
           "resolved": "https://registry.npmjs.org/screener-runner/-/screener-runner-0.7.0.tgz",
           "integrity": "sha1-wTtBdC65b6rZWpFFgi2fg1oibQg=",
           "dependencies": {
+            "caseless": {
+              "version": "0.11.0",
+              "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz",
+              "integrity": "sha1-cVuW6phBWTzDMGeSP17GDr2k99c="
+            },
+            "har-validator": {
+              "version": "2.0.6",
+              "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz",
+              "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0="
+            },
             "joi": {
               "version": "9.2.0",
               "resolved": "https://registry.npmjs.org/joi/-/joi-9.2.0.tgz",
@@ -10415,10 +10248,20 @@
               "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.16.6.tgz",
               "integrity": "sha1-0iyaxmAojzhD4Wun0rXQbMon13c="
             },
+            "qs": {
+              "version": "6.3.2",
+              "resolved": "https://registry.npmjs.org/qs/-/qs-6.3.2.tgz",
+              "integrity": "sha1-51vV9uJoEioqDgvaYwslUMFmUCw="
+            },
             "request": {
               "version": "2.78.0",
               "resolved": "https://registry.npmjs.org/request/-/request-2.78.0.tgz",
               "integrity": "sha1-4cjew0bhyBkjskrNszfxHeyr6cw="
+            },
+            "tunnel-agent": {
+              "version": "0.4.3",
+              "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz",
+              "integrity": "sha1-Y3PbdpCf5XDgjXNYM2Xtgop07us="
             }
           }
         },
@@ -10427,16 +10270,23 @@
           "resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz",
           "integrity": "sha1-myzl094C0XxgEq0yaqa00M9U+U8="
         },
+        "sntp": {
+          "version": "1.0.9",
+          "resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz",
+          "integrity": "sha1-ZUEYTMkK7qbG57NeJlkIJEPGYZg=",
+          "dependencies": {
+            "hoek": {
+              "version": "2.16.3",
+              "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz",
+              "integrity": "sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0="
+            }
+          }
+        },
         "supports-color": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
           "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
         },
-        "tunnel-agent": {
-          "version": "0.4.3",
-          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz",
-          "integrity": "sha1-Y3PbdpCf5XDgjXNYM2Xtgop07us="
-        },
         "webidl-conversions": {
           "version": "3.0.1",
           "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-3.0.1.tgz",
@@ -10661,9 +10511,9 @@
       }
     },
     "sntp": {
-      "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz",
-      "integrity": "sha1-ZUEYTMkK7qbG57NeJlkIJEPGYZg="
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/sntp/-/sntp-2.0.2.tgz",
+      "integrity": "sha1-UGQRDwr4X3z9t9a2ekACjOUrSys="
     },
     "socket.io": {
       "version": "1.7.3",
@@ -10862,14 +10712,7 @@
     "sshpk": {
       "version": "1.13.1",
       "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.13.1.tgz",
-      "integrity": "sha1-US322mKHFEMW3EwY/hzx2UBzm+M=",
-      "dependencies": {
-        "assert-plus": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
-        }
-      }
+      "integrity": "sha1-US322mKHFEMW3EwY/hzx2UBzm+M="
     },
     "stack-trace": {
       "version": "0.0.10",
@@ -11116,6 +10959,18 @@
         }
       }
     },
+    "test-value": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/test-value/-/test-value-2.1.0.tgz",
+      "integrity": "sha1-Edpv9nDzRxpztiXKTz/c97t0gpE=",
+      "dependencies": {
+        "array-back": {
+          "version": "1.0.4",
+          "resolved": "https://registry.npmjs.org/array-back/-/array-back-1.0.4.tgz",
+          "integrity": "sha1-ZEun8JX3/898Q7Xw3DnTwfA8Bjs="
+        }
+      }
+    },
     "text-encoding": {
       "version": "0.6.4",
       "resolved": "https://registry.npmjs.org/text-encoding/-/text-encoding-0.6.4.tgz",
@@ -11218,14 +11073,7 @@
     "topo": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/topo/-/topo-2.0.2.tgz",
-      "integrity": "sha1-zVYVdSU5BXwNwEkaYhw7xvvh0YI=",
-      "dependencies": {
-        "hoek": {
-          "version": "4.2.0",
-          "resolved": "https://registry.npmjs.org/hoek/-/hoek-4.2.0.tgz",
-          "integrity": "sha512-v0XCLxICi9nPfYrS9RL8HbYnXi9obYAeLbSP00BmnZwCK9+Ih9WOjoZ8YoHCoav2csqn4FOz4Orldsy2dmDwmQ=="
-        }
-      }
+      "integrity": "sha1-zVYVdSU5BXwNwEkaYhw7xvvh0YI="
     },
     "touch": {
       "version": "0.0.3",
@@ -11413,6 +11261,11 @@
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.4.2.tgz",
       "integrity": "sha1-+DlfhdRZJ2BnyYiqQYN6j4KHCEQ="
     },
+    "typical": {
+      "version": "2.6.1",
+      "resolved": "https://registry.npmjs.org/typical/-/typical-2.6.1.tgz",
+      "integrity": "sha1-XAgOXWYcu+OCWdLnCjxyU+hziB0="
+    },
     "ua-parser-js": {
       "version": "0.7.14",
       "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.14.tgz",
@@ -11654,14 +11507,7 @@
     "verror": {
       "version": "1.10.0",
       "resolved": "https://registry.npmjs.org/verror/-/verror-1.10.0.tgz",
-      "integrity": "sha1-OhBcoXBTr1XW4nDB+CiGguGNpAA=",
-      "dependencies": {
-        "assert-plus": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-          "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
-        }
-      }
+      "integrity": "sha1-OhBcoXBTr1XW4nDB+CiGguGNpAA="
     },
     "vm-browserify": {
       "version": "0.0.4",
@@ -11979,6 +11825,28 @@
       "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.3.0.tgz",
       "integrity": "sha512-xuPeK4OdjWqtfi59ylvVL0Yn35SF3zgcAcv7rBPFHVaEapaDr4GdGgm3j7ckTwH9wHL7fGmgfAnb0+THrHb8tA=="
     },
+    "write-file-webpack-plugin": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/write-file-webpack-plugin/-/write-file-webpack-plugin-4.1.0.tgz",
+      "integrity": "sha512-KkFZtNeeuSjig5sACrd0n1ybrpd4CS8P5J2TGEklS7UGGlz+iISAxJf426XwaQ2TTlTAq1LTXRBWTTEYjy5e4A==",
+      "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+        }
+      }
+    },
     "ws": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/ws/-/ws-1.1.2.tgz",
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
index 70144038e2f96..5876ca1b38d08 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
@@ -74,5 +74,4 @@ export class DatePickerPage extends React.Component<IComponentDemoPageProps, {}>
       />
     );
   }
-
 }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx b/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
index a0fda6c363889..fbe95276afea9 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
@@ -120,5 +120,4 @@ export class PanelPage extends React.Component<IComponentDemoPageProps, {}> {
       />
     );
   }
-
 }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
index f139d501599b6..663e67c12993c 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
@@ -75,5 +75,4 @@ export class PersonaPage extends React.Component<IComponentDemoPageProps, {}> {
       />
     );
   }
-
 }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
index dd99288d5a95d..5f64976b432cf 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
@@ -7,6 +7,7 @@ import {
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { Label } from 'office-ui-fabric-react/lib/Label';
 import { TestImages } from '../../../common/TestImages';
+
 import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
 const exampleStyles: any = exampleStylesImport;
 
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
index 4d0c2998f91f5..47b614222d5a0 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
@@ -121,5 +121,4 @@ export class SearchBoxPage extends React.Component<IComponentDemoPageProps, {}>
       />
     );
   }
-
 }
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
index c707f1de202fa..65b454fc27fc9 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
@@ -80,7 +80,7 @@ export class SpinButtonPage extends React.Component<IComponentDemoPageProps, {}>
           </div>
         }
         bestPractices={
-          <div/>
+          <div />
         }
         dos={
           <div>
diff --git a/scripts/build.js b/scripts/build.js
index cee14bdd94a31..f083bde9e63ee 100644
--- a/scripts/build.js
+++ b/scripts/build.js
@@ -51,7 +51,7 @@ function runTask(task) {
   return Promise.resolve()
     .then(() => !hasFailures && Promise.resolve()
       .then(() => logStartTask(packageName, task))
-      .then(() => require('./tasks/' + task)({ isProduction }))
+      .then(() => require('./tasks/' + task)({ isProduction, argv: process.argv }))
       .then(() => logEndTask(packageName, task, taskStartTime))
       .catch((e) => {
         hasFailures = true;
diff --git a/scripts/package.json b/scripts/package.json
index 754f70ba265e6..ec95dba9ad352 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -13,6 +13,7 @@
     "awesome-typescript-loader": "^3.2.3",
     "chalk": "^2.1.0",
     "chai": "^4.1.1",
+    "command-line-args": "^4.0.7",
     "cpx": "^1.5.0",
     "css-loader": "^0.28.5",
     "github": "^7.0.0",
diff --git a/scripts/start.js b/scripts/start.js
index 77c0dd33f82b8..ca3be6bf15a49 100644
--- a/scripts/start.js
+++ b/scripts/start.js
@@ -2,8 +2,24 @@ const webpack = require('webpack');
 const WebpackDevServer = require('webpack-dev-server');
 const path = require('path');
 const fs = require('fs');
+const commandLineArgs = require('command-line-args');
 
-const configPath = path.resolve(process.cwd(), 'webpack.serve.config.js');
+const optionDefinitions = [
+  {
+    name: 'webpackConfig',
+    alias: 'w',
+    type: String
+  }
+];
+
+const options = commandLineArgs(optionDefinitions);
+let webpackConfigFilePath = 'webpack.serve.config.js';
+
+if (options && options.webpackConfig) {
+  webpackConfigFilePath = options.webpackConfig;
+}
+
+const configPath = path.resolve(process.cwd(), webpackConfigFilePath);
 
 if (fs.existsSync(configPath)) {
   const webpackDevServerPath = path.resolve(__dirname, './node_modules/webpack-dev-server/bin/webpack-dev-server.js');
diff --git a/scripts/tasks/webpack.js b/scripts/tasks/webpack.js
index 7acf420cdf91c..b9c0d82a4f085 100644
--- a/scripts/tasks/webpack.js
+++ b/scripts/tasks/webpack.js
@@ -6,7 +6,18 @@ module.exports = function (options) {
 
   if (fs.existsSync(webpackConfigPath)) {
     const webpack = require('webpack');
-    const config = flatten(require(webpackConfigPath));
+
+    const configLoader = require(webpackConfigPath);
+    let config;
+
+    // If the loaded webpack config is a function
+    // call it with the original process.argv arguments from build.js.
+    if (typeof configLoader == 'function') {
+      config = configLoader(options.argv);
+    } else {
+      config = configLoader;
+    }
+    config = flatten(config);
 
     return new Promise((resolve, reject) => {
       webpack(config, (err, stats) => {

From f1181d7ce3abf9a899e677ac1ffd60b19062c2f1 Mon Sep 17 00:00:00 2001
From: Chris Mohr <chrismohr@users.noreply.github.com>
Date: Wed, 20 Sep 2017 09:21:00 -0700
Subject: [PATCH 0674/1641] fix comments and example code for Dropdown (#2891)

---
 .../update_dropdown_comment_2017-09-19-23-14.json     | 11 +++++++++++
 .../src/components/Dropdown/Dropdown.tsx              |  2 +-
 .../Dropdown/examples/Dropdown.Basic.Example.scss     |  2 +-
 .../Dropdown/examples/Dropdown.Custom.Example.tsx     |  2 +-
 4 files changed, 14 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/update_dropdown_comment_2017-09-19-23-14.json

diff --git a/common/changes/office-ui-fabric-react/update_dropdown_comment_2017-09-19-23-14.json b/common/changes/office-ui-fabric-react/update_dropdown_comment_2017-09-19-23-14.json
new file mode 100644
index 0000000000000..7145923020678
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/update_dropdown_comment_2017-09-19-23-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "fix comments and example code for onRenderCaretDown prop of Dropdown component",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chrismo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index c36ee2d7d4f8f..e90f4e26efeb7 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -381,7 +381,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     );
   }
 
-  // Render Chevron Down Icon
+  // Render Caret Down Icon
   @autobind
   private _onRenderCaretDown(props: IDropdownProps): JSX.Element {
     return (
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss
index 8a919bebd8e0e..581a6d3c111d5 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss
@@ -8,7 +8,7 @@
   .dropdownExample-placeholder {
     display: flex;
   }
-  .dropdownExample-chevronDownIcon {
+  .dropdownExample-caretDownIcon {
     right: 12px;
     position: absolute;
     top: 1px;
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
index cb289a30bb2f9..c4b45457b8173 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
@@ -80,7 +80,7 @@ export class DropdownCustomExample extends React.Component<any, any> {
 
   private _onRenderCaretDown = (props: IDropdownProps): JSX.Element => {
     return (
-      <Icon className='dropdownExample-chevronDownIcon' iconName='CirclePlus' />
+      <Icon className='dropdownExample-caretDownIcon' iconName='CirclePlus' />
     );
   }
 

From 88967a31ae2225810c19f0b22471aa9b0c742d12 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Wed, 20 Sep 2017 10:22:24 -0700
Subject: [PATCH 0675/1641] Add icon support for compound button (#2788)

* initial checkin

* simplify some rendering

* remove test examples and tweak the styling

* rush change

* update some of the styling

* Fix list errors
---
 ...ortForCompoundButton_2017-09-08-19-02.json | 11 +++++
 .../Button/BaseButton.classNames.ts           |  6 +++
 .../components/Button/BaseButton.styles.ts    |  5 ++-
 .../src/components/Button/BaseButton.tsx      | 44 +++++++++++++++----
 .../src/components/Button/Button.Props.ts     |  5 +++
 .../CompoundButton/CompoundButton.styles.ts   | 15 ++++++-
 .../Button/CompoundButton/CompoundButton.tsx  |  3 +-
 7 files changed, 77 insertions(+), 12 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-AddIconSupportForCompoundButton_2017-09-08-19-02.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-AddIconSupportForCompoundButton_2017-09-08-19-02.json b/common/changes/office-ui-fabric-react/jspurlin-AddIconSupportForCompoundButton_2017-09-08-19-02.json
new file mode 100644
index 0000000000000..9683715980e6e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-AddIconSupportForCompoundButton_2017-09-08-19-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add the ability for compoundButtons to have icons",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
index ba9210a8dac37..63f9590df28d9 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
@@ -5,6 +5,7 @@ import { IButtonStyles } from './Button.Props';
 export interface IButtonClassNames {
   root?: string;
   flexContainer?: string;
+  textContainer?: string;
   icon?: string;
   label?: string;
   menuIcon?: string;
@@ -65,6 +66,11 @@ export const getClassNames = memoizeFunction((
       styles.flexContainer
     ) as string,
 
+    textContainer: mergeStyles(
+      'ms-Button-textContainer',
+      styles.textContainer
+    ) as string,
+
     icon: mergeStyles(
       'ms-Button-icon',
       iconClassName,
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
index d549321998413..1f4ed23adb359 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
@@ -65,6 +65,10 @@ export const getStyles = memoizeFunction((
       alignItems: 'center'
     },
 
+    textContainer: {
+      flexGrow: '1'
+    },
+
     icon: iconStyle,
 
     menuIcon: [
@@ -78,6 +82,5 @@ export const getStyles = memoizeFunction((
       margin: '0 4px',
       lineHeight: '100%'
     },
-
   };
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 456ca5783c88c..b6aae3822c822 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -195,8 +195,6 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       menuIconProps,
       menuProps,
       onRenderIcon = this._onRenderIcon,
-      onRenderText = this._onRenderText,
-      onRenderDescription = this._onRenderDescription,
       onRenderAriaDescription = this._onRenderAriaDescription,
       onRenderChildren = this._onRenderChildren,
       onRenderMenu = this._onRenderMenu,
@@ -210,8 +208,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         'div' as any,
         { className: this._classNames.flexContainer },
         onRenderIcon(props, this._onRenderIcon),
-        onRenderText(props, this._onRenderText),
-        onRenderDescription(props, this._onRenderDescription),
+        this._onRenderTextContents(),
         onRenderAriaDescription(props, this._onRenderAriaDescription),
         onRenderChildren(props, this._onRenderChildren),
         !this._isSplitButton && (menuProps || menuIconName || menuIconProps || this.props.onRenderMenuIcon) && onRenderMenuIcon(this.props, this._onRenderMenuIcon),
@@ -241,6 +238,32 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     return null;
   }
 
+  @autobind
+  private _onRenderTextContents(): JSX.Element | (JSX.Element | null)[] {
+    let {
+      text,
+      children,
+      description,
+      onRenderText = this._onRenderText,
+      onRenderDescription = this._onRenderDescription
+    } = this.props;
+
+    if (text || typeof (children) === 'string' || description) {
+      return (
+        <div
+          className={ this._classNames.textContainer }
+        >
+          { onRenderText(this.props, this._onRenderText) }
+          { onRenderDescription(this.props, this._onRenderDescription) }
+        </div>
+      );
+    }
+    return ([
+      onRenderText(this.props, this._onRenderText),
+      onRenderDescription(this.props, this._onRenderDescription)
+    ]);
+  }
+
   @autobind
   private _onRenderText(): JSX.Element | null {
     let {
@@ -255,12 +278,13 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
 
     if (text) {
       return (
-        <span
+        <div
+          key={ this._labelId }
           className={ this._classNames.label }
           id={ this._labelId }
         >
           { text }
-        </span>
+        </div>
       );
     }
 
@@ -289,9 +313,13 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     // ms-Button-description is only shown when the button type is compound.
     // In other cases it will not be displayed.
     return description ? (
-      <span className={ this._classNames.description } id={ this._descriptionId }>
+      <div
+        key={ this._descriptionId }
+        className={ this._classNames.description }
+        id={ this._descriptionId }
+      >
         { description }
-      </span>
+      </div>
     ) : (
         null
       );
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
index 16c4ea1d04c1c..87d970bff22a2 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
@@ -263,6 +263,11 @@ export interface IButtonStyles {
    */
   flexContainer?: IStyle;
 
+  /**
+   * Style for the text container within the flexbox container element (and contains the text and description).
+   */
+  textContainer?: IStyle;
+
   /**
    * Style for the icon on the near side of the label.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
index 6402b1142102d..f1171f3cd9905 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
@@ -34,12 +34,25 @@ export const getStyles = memoizeFunction((
     },
 
     flexContainer: {
-      flexDirection: 'column',
+      flexDirection: 'row',
       alignItems: 'flex-start',
       minWidth: '100%',
       margin: ''
     },
 
+    textContainer: {
+      textAlign: 'left'
+    },
+
+    icon: {
+      fontSize: '2em',
+      lineHeight: '1em',
+      height: '1em',
+      margin: '0px 8px 0px 0px',
+      flexBasis: '1em',
+      flexShrink: '0'
+    },
+
     label: {
       margin: '0 0 5px',
       lineHeight: '100%',
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
index bf20c23380273..da106faaece2c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
-import { BaseComponent, customizable, nullRender } from '../../../Utilities';
+import { BaseComponent, customizable } from '../../../Utilities';
 import { ThemeSettingName } from '../../../Styling';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './CompoundButton.styles';
@@ -19,7 +19,6 @@ export class CompoundButton extends BaseComponent<IButtonProps, {}> {
         { ...this.props }
         variantClassName={ primary ? 'ms-Button--compoundPrimary' : 'ms-Button--compound' }
         styles={ getStyles(theme!, styles, primary) }
-        onRenderIcon={ nullRender }
       />
     );
   }

From 9801f43378b2313aacd87560238da1896b5818b1 Mon Sep 17 00:00:00 2001
From: Boris Emorine <boris.emorine@gmail.com>
Date: Wed, 20 Sep 2017 10:28:44 -0700
Subject: [PATCH 0676/1641] New Feature: Components Checklist (#2846)

* Implement color scheme in the ContextualMenu control to enable alternative theming.

* Implement the bar and unit tests and component page

* Revert "Implement color scheme in the ContextualMenu control to enable alternative theming."

This reverts commit 4f830cd8c55269368e73bfc6d0cd69430776b977.

* Don't render an empty icon for an icon-less header menu item.

* Revert "Implement Document Title Bar"

* Add base implementation for ComponentChecklist

* Add badges

* Change page order

* Fix badges and add first implementation of page

* Fix ts-lint issues

* Made component status page prettier

* Redesign overview of component status page

* Add overview to component status page

* Redesign status section of component status page

* Refactor color string and badge string methods inside ComponentStatus

* Add markup badge

* Add aria-label and role to badges

* Fix table alignment in component status page

* Fix badge links

* Update button's name of component badge status page

* Fix component status page redirection bug

* Remove unused css rules in ComponentStatus

* Set inline calendar showgototoday option as false

* Fix minor types of ComponentStatus

* Fix tslint 'JSX elements with no children must be self-closing' issues in components changed

* Fix various diff issues with pages

* Fix quotation issue on Nav pane

* Update RTL status of components

* Remove 'role=link' from anchors as they are already defined

* Refactor badge anchor creation

* Fix ComponentStatusPage tables headers

* Update test coverage status of components

* Refactor ComponentStatus functions

* Update high contrast badge status of components

* Move ComponentStatus dir from oufr components to demo dir

* Move ComponentStatus props and items from example-app-base to demo dir inside oufr

* Add componentstatus files to demo dir

* Add global setting in ComponentPage props to verify if we should show badges or not

* Add unknown status to component checklist

* Update highcontrast values for components

* Update badges description in Components Checklist page

* Add missing componentstatus to Extended Components pages

* Fix tslint issues with ComponentStatusPage

* Remove uneeded reference from nav pane

* Add checklist file per component and move checklist data there

* Change checklist name from state to status

* Add AllComponents.checklist to retrieve checklist data of all components

* Fix tslint error related to unused import
---
 .../src/components/App/AppState.tsx           |  1 -
 .../ComponentPage/ComponentPage.scss          | 15 ++-
 .../ComponentPage/ComponentPage.tsx           | 92 +++++++++++++++---
 packages/example-app-base/src/index.ts        |  2 +-
 .../Breadcrumb/Breadcrumb.checklist.ts        |  8 ++
 .../components/Breadcrumb/BreadcrumbPage.tsx  |  7 ++
 .../src/components/Button/Button.checklist.ts |  8 ++
 .../src/components/Button/ButtonPage.tsx      |  9 +-
 .../components/Calendar/Calendar.checklist.ts |  8 ++
 .../src/components/Calendar/CalendarPage.tsx  | 43 ++++++--
 .../components/Callout/Callout.checklist.ts   |  9 ++
 .../src/components/Callout/CalloutPage.tsx    |  9 +-
 .../components/Checkbox/Checkbox.checklist.ts |  9 ++
 .../src/components/Checkbox/CheckboxPage.tsx  |  9 +-
 .../ChoiceGroup/ChoiceGroup.checklist.ts      |  9 ++
 .../ChoiceGroup/ChoiceGroupPage.tsx           |  9 +-
 .../ColorPicker/ColorPicker.checklist.ts      |  9 ++
 .../ColorPicker/ColorPickerPage.tsx           |  7 ++
 .../components/ComboBox/ComboBox.checklist.ts |  9 ++
 .../src/components/ComboBox/ComboBoxPage.tsx  |  7 ++
 .../CommandBar/CommandBar.checklist.ts        |  9 ++
 .../components/CommandBar/CommandBarPage.tsx  |  9 +-
 .../ContextualMenu.checklist.ts               |  9 ++
 .../ContextualMenu/ContextualMenuPage.tsx     |  7 ++
 .../DatePicker/DatePicker.checklist.ts        |  9 ++
 .../components/DatePicker/DatePickerPage.tsx  |  7 ++
 .../DetailsList/DetailsList.checklist.ts      |  9 ++
 .../DetailsList/DetailsListPage.tsx           |  8 ++
 .../src/components/Dialog/Dialog.checklist.ts |  9 ++
 .../src/components/Dialog/DialogPage.tsx      |  7 ++
 .../DocumentCard/DocumentCard.checklist.ts    |  9 ++
 .../DocumentCard/DocumentCardPage.tsx         |  7 ++
 .../components/Dropdown/Dropdown.checklist.ts |  9 ++
 .../src/components/Dropdown/DropdownPage.tsx  |  7 ++
 .../components/Facepile/Facepile.checklist.ts |  9 ++
 .../src/components/Facepile/FacepilePage.tsx  |  7 ++
 .../GroupedList/GroupedList.checklist.ts      |  9 ++
 .../GroupedList/GroupedListPage.tsx           |  7 ++
 .../HoverCard/HoverCard.checklist.ts          |  9 ++
 .../components/HoverCard/HoverCardPage.tsx    |  7 ++
 .../src/components/Icon/Icon.checklist.ts     |  9 ++
 .../src/components/Icon/IconPage.tsx          |  7 ++
 .../src/components/Image/Image.checklist.ts   |  9 ++
 .../src/components/Image/ImagePage.tsx        |  7 ++
 .../src/components/Label/Label.checklist.ts   |  9 ++
 .../src/components/Label/LabelPage.tsx        |  7 ++
 .../src/components/Layer/Layer.checklist.ts   |  9 ++
 .../src/components/Layer/LayerPage.tsx        |  7 ++
 .../src/components/Link/Link.checklist.ts     |  9 ++
 .../src/components/Link/LinkPage.tsx          |  7 ++
 .../src/components/List/List.checklist.ts     |  9 ++
 .../src/components/List/ListPage.tsx          |  7 ++
 .../MessageBar/MessageBar.checklist.ts        |  9 ++
 .../components/MessageBar/MessageBarPage.tsx  |  7 ++
 .../src/components/Modal/Modal.checklist.ts   |  9 ++
 .../src/components/Modal/ModalPage.tsx        |  7 ++
 .../src/components/Nav/Nav.checklist.ts       |  9 ++
 .../src/components/Nav/NavPage.tsx            |  7 ++
 .../OverflowSet/OverflowSet.checklist.ts      |  9 ++
 .../OverflowSet/OverflowSetPage.tsx           |  7 ++
 .../components/Overlay/Overlay.checklist.ts   |  9 ++
 .../src/components/Overlay/OverlayPage.tsx    |  7 ++
 .../src/components/Panel/Panel.checklist.ts   |  9 ++
 .../src/components/Panel/PanelPage.tsx        |  7 ++
 .../components/Persona/Persona.checklist.ts   |  9 ++
 .../src/components/Persona/PersonaPage.tsx    |  7 ++
 .../src/components/Pivot/Pivot.checklist.ts   |  9 ++
 .../src/components/Pivot/PivotPage.tsx        |  7 ++
 .../ProgressIndicator.checklist.ts            |  9 ++
 .../ProgressIndicatorPage.tsx                 |  8 ++
 .../src/components/Rating/Rating.checklist.ts |  9 ++
 .../src/components/Rating/RatingPage.tsx      |  7 ++
 .../ResizeGroup/ResizeGroup.checklist.ts      |  9 ++
 .../ResizeGroup/ResizeGroupPage.tsx           |  8 +-
 .../ScrollablePane.checklist.ts               |  9 ++
 .../ScrollablePane/ScrollablePanePage.tsx     |  9 +-
 .../SearchBox/SearchBox.checklist.ts          |  9 ++
 .../components/SearchBox/SearchBoxPage.tsx    |  7 ++
 .../src/components/Slider/Slider.checklist.ts |  9 ++
 .../src/components/Slider/SliderPage.tsx      | 11 ++-
 .../SpinButton/SpinButton.checklist.ts        |  9 ++
 .../components/SpinButton/SpinButtonPage.tsx  |  7 ++
 .../components/Spinner/Spinner.checklist.ts   |  9 ++
 .../src/components/Spinner/SpinnerPage.tsx    |  7 ++
 .../SwatchColorPicker.checklist.ts            |  9 ++
 .../SwatchColorPickerPage.tsx                 |  7 ++
 .../TeachingBubble.checklist.ts               |  9 ++
 .../TeachingBubble/TeachingBubblePage.tsx     |  7 ++
 .../TextField/TextField.checklist.ts          |  9 ++
 .../components/TextField/TextFieldPage.tsx    |  7 ++
 .../src/components/Toggle/Toggle.checklist.ts |  9 ++
 .../src/components/Toggle/TogglePage.tsx      |  7 ++
 .../components/Tooltip/Tooltip.checklist.ts   |  9 ++
 .../src/components/Tooltip/TooltipPage.tsx    |  7 ++
 .../PeoplePicker/PeoplePicker.checklist.ts    |  9 ++
 .../pickers/PeoplePicker/PeoplePickerPage.tsx |  7 ++
 .../components/pickers/Pickers.checklist.ts   |  9 ++
 .../src/components/pickers/PickersPage.tsx    |  7 ++
 .../src/demo/AppDefinition.tsx                | 12 ++-
 .../AllComponents.checklist.ts                | 54 +++++++++++
 .../ComponentStatus/ComponentStatus.Props.ts  | 17 ++++
 .../demo/ComponentStatus/ComponentStatus.scss | 11 +++
 .../demo/ComponentStatus/ComponentStatus.tsx  | 78 +++++++++++++++
 .../ComponentStatus/ComponentStatusPage.scss  | 20 ++++
 .../ComponentStatus/ComponentStatusPage.tsx   | 97 +++++++++++++++++++
 .../ComponentStatus/ComponentStatusState.tsx  | 43 ++++++++
 .../office-ui-fabric-react/src/demo/index.tsx |  2 +
 107 files changed, 1213 insertions(+), 35 deletions(-)
 create mode 100644 packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/Button.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Calendar/Calendar.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Callout/Callout.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Dialog/Dialog.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Facepile/Facepile.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Icon/Icon.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Image/Image.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Label/Label.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Layer/Layer.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Link/Link.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/List/List.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Modal/Modal.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Nav/Nav.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Overlay/Overlay.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Panel/Panel.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Persona/Persona.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Pivot/Pivot.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Rating/Rating.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Slider/Slider.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Spinner/Spinner.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/TextField/TextField.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Toggle/Toggle.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/pickers/Pickers.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/demo/ComponentStatus/AllComponents.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.Props.ts
 create mode 100644 packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.scss
 create mode 100644 packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.tsx
 create mode 100644 packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusPage.scss
 create mode 100644 packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusPage.tsx
 create mode 100644 packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusState.tsx

diff --git a/apps/fabric-website/src/components/App/AppState.tsx b/apps/fabric-website/src/components/App/AppState.tsx
index 9266734d4993c..02eb091ccf1c6 100644
--- a/apps/fabric-website/src/components/App/AppState.tsx
+++ b/apps/fabric-website/src/components/App/AppState.tsx
@@ -83,7 +83,6 @@ export const AppState: IAppState = {
           url: '#/styles/utilities',
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Styles/UtilitiesPage/UtilitiesPage').UtilitiesPage))
         }
-
       ]
     },
     {
diff --git a/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss b/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss
index 64cab6d2ea179..0450f7ac31cdf 100644
--- a/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss
+++ b/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss
@@ -94,7 +94,13 @@ $dontColor: #A61E22;
     }
   }
 
-  .ComponentPage-overviewSection,
+  .ComponentPage-overviewSection {
+    padding-top: 15px;
+    padding-bottom: $componentPagePadding;
+    padding-left: $componentPagePadding;
+    padding-right: $componentPagePadding;
+  }
+
   .ComponentPage-bestPracticesSection,
   .ComponentPage-variantsSection,
   .ComponentPage-implementationSection {
@@ -176,4 +182,11 @@ $dontColor: #A61E22;
     }
   }
 
+  .ComponentPage-componentStatusSection {
+    padding-top: $componentPagePadding;
+    padding-bottom: 0px;
+    padding-left: $componentPagePadding;
+    padding-right: $componentPagePadding;
+  }
+
 }
\ No newline at end of file
diff --git a/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx b/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
index a194339021562..1d0fd41cc339c 100644
--- a/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
+++ b/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
@@ -8,10 +8,15 @@ import {
 } from 'office-ui-fabric-react/lib/Link';
 import './ComponentPage.scss';
 
+export interface IComponentPageSection {
+  title: string;
+  section: JSX.Element;
+}
+
 export interface IComponentPageProps {
   title: string;
   componentName: string;
-  exampleCards: JSX.Element;
+  exampleCards?: JSX.Element;
   propertiesTables?: JSX.Element;
   bestPractices?: JSX.Element;
   dos?: JSX.Element;
@@ -19,12 +24,16 @@ export interface IComponentPageProps {
   overview: JSX.Element;
   related?: JSX.Element;
   isHeaderVisible?: boolean;
+  areBadgesVisible?: boolean;
   className?: string;
+  componentStatus?: JSX.Element;
+  otherSections?: [IComponentPageSection];
 }
 
 export class ComponentPage extends React.Component<IComponentPageProps, {}> {
   public static defaultProps: Partial<IComponentPageProps> = {
-    isHeaderVisible: true
+    isHeaderVisible: true,
+    areBadgesVisible: false
   };
 
   private _baseUrl: string;
@@ -39,7 +48,6 @@ export class ComponentPage extends React.Component<IComponentPageProps, {}> {
   public render(): JSX.Element {
     let {
       componentName,
-      exampleCards,
       overview,
       className
     } = this.props;
@@ -49,6 +57,7 @@ export class ComponentPage extends React.Component<IComponentPageProps, {}> {
         <div className={ componentName }>
           { this._pageHeader() }
           <div className='ComponentPage-body'>
+            { this._getComponentStatusBadges() }
             <div className='ComponentPage-overviewSection'>
               <h2 className='ComponentPage-subHeading' id='Overview'>Overview</h2>
               <div className='ComponentPage-overviewSectionContent'>
@@ -59,14 +68,14 @@ export class ComponentPage extends React.Component<IComponentPageProps, {}> {
               </div>
             </div>
             { this._getDosAndDonts() }
-            <div className='ComponentPage-variantsSection'>
-              <h2 className='ComponentPage-subHeading ComponentPage-variantsTitle' id='Variants'>Variants</h2>
-              { exampleCards }
-            </div>
+            { this._getVariants() }
             { this._getPropertiesTable() }
+            { this.props.otherSections && this.props.otherSections.map((componentPageSection: IComponentPageSection) => {
+              return this._getSection(componentPageSection);
+            }) }
           </div>
-        </div>
-      </div>
+        </div >
+      </div >
     );
   }
 
@@ -103,13 +112,23 @@ export class ComponentPage extends React.Component<IComponentPageProps, {}> {
           <Link { ...{ href: this._baseUrl + '#Overview' } }>Overview</Link>
         </div>
         { links }
-        <div className='ComponentPage-navLink'>
+        { this.props.exampleCards && <div className='ComponentPage-navLink'>
           <Link { ...{ href: this._baseUrl + '#Variants' } }>Variants</Link>
-        </div>
-        <div className='ComponentPage-navLink'>
+        </div> }
+        { this.props.propertiesTables && <div className='ComponentPage-navLink'>
           <Link { ...{ href: this._baseUrl + '#Implementation' } }>Implementation</Link>
-        </div>
-      </div>
+        </div> }
+        { this.props.otherSections && this.props.otherSections.map((componentPageSection: IComponentPageSection, index: number) => {
+          return <div key={ index + 'class' } className='ComponentPage-navLink'>
+            <Link
+              key={ index + componentPageSection.title }
+              { ...{ href: this._baseUrl + '#' + componentPageSection.title } }
+            >
+              { componentPageSection.title }
+            </Link>
+          </div>;
+        }) }
+      </div >
     );
   }
 
@@ -170,4 +189,49 @@ export class ComponentPage extends React.Component<IComponentPageProps, {}> {
       );
     }
   }
+
+  private _getVariants(): JSX.Element | undefined {
+    if (this.props.exampleCards) {
+      return (
+        <div className='ComponentPage-variantsSection'>
+          <h2 className='ComponentPage-subHeading ComponentPage-variantsTitle' id='Variants'>Variants</h2>
+          { this.props.exampleCards }
+        </div>
+      );
+    }
+
+    return undefined;
+  }
+
+  private _getComponentStatusBadges(): JSX.Element | undefined {
+    if (this.props.componentStatus && this.props.areBadgesVisible) {
+      return (
+        <div className='ComponentPage-componentStatusSection'>
+          { this.props.componentStatus }
+        </div>
+      );
+    }
+
+    return undefined;
+  }
+
+  private _getSection(componentPageSection: IComponentPageSection): JSX.Element | undefined {
+    if (this.props.otherSections) {
+      return (
+        <div key={ componentPageSection.title + '-key' }>
+          <div className='ComponentPage-variantsSection'>
+            <h2
+              className='ComponentPage-subHeading ComponentPage-variantsTitle'
+              id={ componentPageSection.title }
+            >
+              { componentPageSection.title }
+            </h2>
+            { componentPageSection.section }
+          </div>
+        </div>
+      );
+    }
+
+    return undefined;
+  }
 }
diff --git a/packages/example-app-base/src/index.ts b/packages/example-app-base/src/index.ts
index eab1d5f4d85c4..c2d2cf3a971f0 100644
--- a/packages/example-app-base/src/index.ts
+++ b/packages/example-app-base/src/index.ts
@@ -13,4 +13,4 @@ export * from './utilities/createApp';
 export * from './utilities/data';
 export * from './utilities/debugging';
 export * from './utilities/examplesOf';
-export * from './utilities/parser/index';
+export * from './utilities/parser/index';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.checklist.ts b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.checklist.ts
new file mode 100644
index 0000000000000..40d9644878cac
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.checklist.ts
@@ -0,0 +1,8 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+export const BreadcrumbStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.fair
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx
index 22e346b2d9a91..f6fe2127f8c8d 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx
@@ -6,6 +6,8 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { BreadcrumbStatus } from './Breadcrumb.checklist';
 import { BreadcrumbBasicExample } from './examples/Breadcrumb.Basic.Example';
 import { BreadcrumbStaticExample } from './examples/Breadcrumb.Static.Example';
 
@@ -69,6 +71,11 @@ export class BreadcrumbPage extends React.Component<IComponentDemoPageProps, any
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...BreadcrumbStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.checklist.ts b/packages/office-ui-fabric-react/src/components/Button/Button.checklist.ts
new file mode 100644
index 0000000000000..120e45a726b17
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.checklist.ts
@@ -0,0 +1,8 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+export const ButtonStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.fail,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.good
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
index bfc7817bce9c1..59d664cc8e8cd 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
@@ -5,6 +5,7 @@ import {
   ComponentPage,
   PropertiesTableSet
 } from '@uifabric/example-app-base';
+import { ButtonStatus } from './Button.checklist';
 import { ButtonDefaultExample } from './examples/Button.Default.Example';
 import { ButtonContextualMenuExample } from './examples/Button.ContextualMenu.Example';
 import { ButtonCompoundExample } from './examples/Button.Compound.Example';
@@ -15,6 +16,7 @@ import { ButtonAnchorExample } from './examples/Button.Anchor.Example';
 import { ButtonScreenReaderExample } from './examples/Button.ScreenReader.Example';
 import { ButtonSwapExample } from './examples/Button.Swap.Example';
 import { ButtonSplitExample, ButtonSplitCustomExample } from './examples/Button.Split.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { Link } from '../../Link';
 import './examples/Button.Basic.Example.scss';
@@ -49,7 +51,7 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
   public render() {
     return (
       <ComponentPage
-        title='Button'
+        title={ 'Button' }
         componentName='ButtonExample'
         exampleCards={
           <div>
@@ -150,6 +152,11 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...ButtonStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.checklist.ts b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.checklist.ts
new file mode 100644
index 0000000000000..9f2de7df1b7dd
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.checklist.ts
@@ -0,0 +1,8 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+export const CalendarStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.good
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
index 2d83adeb69371..95483509ea715 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
@@ -8,6 +8,9 @@ import {
 import { DateRangeType } from 'office-ui-fabric-react/lib/Calendar';
 import { CalendarButtonExample } from './examples/Calendar.Button.Example';
 import { CalendarInlineExample } from './examples/Calendar.Inline.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { CalendarStatus } from './Calendar.checklist';
+
 const CalendarButtonExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx') as string;
 const CalendarInlineExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx') as string;
 
@@ -15,7 +18,7 @@ export class CalendarPage extends React.Component<IComponentDemoPageProps, any>
   public render() {
     return (
       <ComponentPage
-        title='Calendar'
+        title={ 'Calendar' }
         componentName='CalendarExample'
         exampleCards={
           <div>
@@ -27,7 +30,10 @@ export class CalendarPage extends React.Component<IComponentDemoPageProps, any>
                 showGoToToday={ false }
               />
             </ExampleCard>
-            <ExampleCard title='Inline Calendar with overlayed month picker when header is clicked' code={ CalendarInlineExampleCode }>
+            <ExampleCard
+              title='Inline Calendar with overlayed month picker when header is clicked'
+              code={ CalendarInlineExampleCode }
+            >
               <CalendarInlineExample
                 showMonthPickerAsOverlay={ true }
                 highlightCurrentMonth={ true }
@@ -36,7 +42,10 @@ export class CalendarPage extends React.Component<IComponentDemoPageProps, any>
                 showGoToToday={ false }
               />
             </ExampleCard>
-            <ExampleCard title='Inline Calendar with month picker' code={ CalendarInlineExampleCode }>
+            <ExampleCard
+              title='Inline Calendar with month picker'
+              code={ CalendarInlineExampleCode }
+            >
               <CalendarInlineExample
                 dateRangeType={ DateRangeType.Day }
                 autoNavigateOnSelection={ false }
@@ -44,7 +53,10 @@ export class CalendarPage extends React.Component<IComponentDemoPageProps, any>
                 showGoToToday={ true }
               />
             </ExampleCard>
-            <ExampleCard title='Inline Calendar with week selection' code={ CalendarInlineExampleCode }>
+            <ExampleCard
+              title='Inline Calendar with week selection'
+              code={ CalendarInlineExampleCode }
+            >
               <CalendarInlineExample
                 dateRangeType={ DateRangeType.Week }
                 autoNavigateOnSelection={ true }
@@ -52,7 +64,10 @@ export class CalendarPage extends React.Component<IComponentDemoPageProps, any>
                 showNavigateButtons={ true }
               />
             </ExampleCard>
-            <ExampleCard title='Inline Calendar with month selection' code={ CalendarInlineExampleCode }>
+            <ExampleCard
+              title='Inline Calendar with month selection'
+              code={ CalendarInlineExampleCode }
+            >
               <CalendarInlineExample
                 dateRangeType={ DateRangeType.Month }
                 autoNavigateOnSelection={ true }
@@ -78,10 +93,17 @@ export class CalendarPage extends React.Component<IComponentDemoPageProps, any>
                 isDayPickerVisible={ false }
               />
             </ExampleCard>
-            <ExampleCard title='Calendar launched from a button' code={ CalendarButtonExampleCode }>
-              <CalendarButtonExample />
+            <ExampleCard
+              title='Calendar launched from a button'
+              code={ CalendarButtonExampleCode }
+            >
+              <CalendarButtonExample
+              />
             </ExampleCard>
-            <ExampleCard title='Month picker launched from a button' code={ CalendarButtonExampleCode }>
+            <ExampleCard
+              title='Month picker launched from a button'
+              code={ CalendarButtonExampleCode }
+            >
               <CalendarButtonExample
                 isDayPickerVisible={ false }
                 highlightCurrentMonth={ true }
@@ -129,6 +151,11 @@ export class CalendarPage extends React.Component<IComponentDemoPageProps, any>
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...CalendarStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.checklist.ts b/packages/office-ui-fabric-react/src/components/Callout/Callout.checklist.ts
new file mode 100644
index 0000000000000..0e1cc7a786923
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const CalloutStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.fair
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
index 879034313bf17..df66337250736 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
@@ -11,6 +11,8 @@ import { CalloutBasicExample } from './examples/Callout.Basic.Example';
 import { CalloutNestedExample } from './examples/Callout.Nested.Example';
 import { CalloutDirectionalExample } from './examples/Callout.Directional.Example';
 import { CalloutCoverExample } from './examples/Callout.Cover.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { CalloutStatus } from './Callout.checklist';
 
 const CalloutBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Callout/examples/Callout.Basic.Example.tsx') as string;
 const CalloutNestedExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx') as string;
@@ -23,7 +25,7 @@ export class CalloutPage extends React.Component<IComponentDemoPageProps, any> {
 
     return (
       <ComponentPage
-        title='Callout'
+        title={ 'Callout' }
         componentName='CalloutExample'
         exampleCards={
           <div>
@@ -90,6 +92,11 @@ export class CalloutPage extends React.Component<IComponentDemoPageProps, any> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...CalloutStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.checklist.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.checklist.ts
new file mode 100644
index 0000000000000..4800464e32965
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const CheckboxStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.poor
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx
index 33a4d32388da8..fc185da7d4f17 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx
@@ -6,6 +6,8 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { CheckboxBasicExample } from './examples/Checkbox.Basic.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { CheckboxStatus } from './Checkbox.checklist';
 
 const CheckboxBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx') as string;
 
@@ -13,7 +15,7 @@ export class CheckboxPage extends React.Component<IComponentDemoPageProps, any>
   public render() {
     return (
       <ComponentPage
-        title='Checkbox'
+        title={ 'Checkbox' }
         componentName='CheckboxExample'
         exampleCards={
           <ExampleCard title='Checkboxes' code={ CheckboxBasicExampleCode }>
@@ -70,6 +72,11 @@ export class CheckboxPage extends React.Component<IComponentDemoPageProps, any>
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...CheckboxStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.checklist.ts b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.checklist.ts
new file mode 100644
index 0000000000000..6c6fb7830f02e
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const ChoiceGroupStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.fair
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx
index de1fcc024933a..a1060baaf44ef 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx
@@ -9,6 +9,8 @@ import { ChoiceGroupBasicExample } from './examples/ChoiceGroup.Basic.Example';
 import { ChoiceGroupCustomExample } from './examples/ChoiceGroup.Custom.Example';
 import { ChoiceGroupImageExample } from './examples/ChoiceGroup.Image.Example';
 import { ChoiceGroupIconExample } from './examples/ChoiceGroup.Icon.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { ChoiceGroupStatus } from './ChoiceGroup.checklist';
 
 const ChoiceGroupBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Basic.Example.tsx') as string;
 const ChoiceGroupCustomExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Custom.Example.tsx') as string;
@@ -19,7 +21,7 @@ export class ChoiceGroupPage extends React.Component<IComponentDemoPageProps, {}
   public render() {
     return (
       <ComponentPage
-        title='ChoiceGroup'
+        title={ 'ChoiceGroup' }
         componentName='ChoiceGroupExample'
         exampleCards={
           <div>
@@ -84,6 +86,11 @@ export class ChoiceGroupPage extends React.Component<IComponentDemoPageProps, {}
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...ChoiceGroupStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.checklist.ts b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.checklist.ts
new file mode 100644
index 0000000000000..b2ad3d4c74578
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const ColorPickerStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.fail,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.fair
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPickerPage.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPickerPage.tsx
index a2290b0d58c4d..41d5d9946dada 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPickerPage.tsx
@@ -6,6 +6,8 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { ColorPickerBasicExample } from './examples/ColorPicker.Basic.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { ColorPickerStatus } from './ColorPicker.checklist';
 
 const ColorPickerBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ColorPicker/examples/ColorPicker.Basic.Example.tsx') as string;
 
@@ -34,6 +36,11 @@ export class ColorPickerPage extends React.Component<IComponentDemoPageProps, {}
           <div>ColorPicker is used to allow a user to select a color</div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...ColorPickerStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.checklist.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.checklist.ts
new file mode 100644
index 0000000000000..bae3c2b17aa47
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const ComboBoxStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.good
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
index a6d243b2ad99e..ee6a7a7a15252 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
@@ -7,6 +7,8 @@ import {
 } from '@uifabric/example-app-base';
 import { ComboBoxBasicExample } from './examples/ComboBox.Basic.Example';
 import { ComboBoxCustomStyledExample } from './examples/ComboBox.CustomStyled.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { ComboBoxStatus } from './ComboBox.checklist';
 
 const ComboBoxBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx') as string;
 const ComboBoxCustomStyledExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.CustomStyled.Example.tsx') as string;
@@ -57,6 +59,11 @@ export class ComboBoxPage extends React.Component<IComponentDemoPageProps, {}> {
           <div />
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...ComboBoxStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.checklist.ts b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.checklist.ts
new file mode 100644
index 0000000000000..85039e74d8c12
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const CommandBarStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.good
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx
index 60bd7f60a3292..dca34547ee0f7 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx
@@ -9,6 +9,8 @@ import { items, overflowItems, farItems } from './examples/data';
 import { CommandBarBasicExample } from './examples/CommandBar.Basic.Example';
 import { CommandBarNonFocusableItemsExample } from './examples/CommandBar.NonFocusable.Example';
 import { CommandBarCustomizationExample } from './examples/CommandBar.Customization.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { CommandBarStatus } from './CommandBar.checklist';
 
 const CommandBarBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx') as string;
 const CommandBarNoFocusableItemsExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.NonFocusable.Example.tsx') as string;
@@ -20,7 +22,7 @@ export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}>
 
     return (
       <ComponentPage
-        title='CommandBar'
+        title={ 'CommandBar' }
         componentName='CommandBarExample'
         exampleCards={
           <div>
@@ -80,6 +82,11 @@ export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}>
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...CommandBarStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.checklist.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.checklist.ts
new file mode 100644
index 0000000000000..bdc15c79c539e
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const ContextualMenuStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.fail,
+  rtlSupport: ChecklistStatus.fail,
+  testCoverage: ChecklistStatus.good
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
index 261c337b0d0ed..cfa26705a07ae 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
@@ -11,6 +11,8 @@ import { ContextualMenuCheckmarksExample } from './examples/ContextualMenu.Check
 import { ContextualMenuDirectionalExample } from './examples/ContextualMenu.Directional.Example';
 import { ContextualMenuCustomizationExample } from './examples/ContextualMenu.Customization.Example';
 import { ContextualMenuHeaderExample } from './examples/ContextualMenu.Header.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { ContextualMenuStatus } from './ContextualMenu.checklist';
 
 const ContextualMenuBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx') as string;
 const ContextualMenuSectionExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx') as string;
@@ -92,6 +94,11 @@ export class ContextualMenuPage extends React.Component<IComponentDemoPageProps,
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...ContextualMenuStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.checklist.ts b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.checklist.ts
new file mode 100644
index 0000000000000..e15b9914785c9
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const DatePickerStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.none
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
index 5876ca1b38d08..bfaf3c990d5ba 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
@@ -8,6 +8,8 @@ import {
 import { DatePickerBasicExample } from './examples/DatePicker.Basic.Example';
 import { DatePickerRequiredExample } from './examples/DatePicker.Required.Example';
 import { DatePickerInputExample } from './examples/DatePicker.Input.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { DatePickerStatus } from './DatePicker.checklist';
 
 const DatePickerBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx') as string;
 const DatePickerRequiredExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Required.Example.tsx') as string;
@@ -71,6 +73,11 @@ export class DatePickerPage extends React.Component<IComponentDemoPageProps, {}>
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...DatePickerStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.checklist.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.checklist.ts
new file mode 100644
index 0000000000000..3290b807fed1b
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const DetailsListStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.fail,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.poor
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
index 9d8e5a83325f3..7631a1b658fff 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
@@ -6,6 +6,9 @@ import {
   ComponentPage,
   PropertiesTableSet
 } from '@uifabric/example-app-base';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { DetailsListStatus } from './DetailsList.checklist';
+
 import { DetailsListBasicExample } from './examples/DetailsList.Basic.Example';
 const DetailsListBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx') as string;
 
@@ -119,6 +122,11 @@ export class DetailsListPage extends React.Component<IComponentDemoPageProps, {}
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...DetailsListStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.checklist.ts b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.checklist.ts
new file mode 100644
index 0000000000000..5b2d92bc69132
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const DialogStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.fair
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx
index 5534d8d3610a7..f3a29a3e19487 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx
@@ -8,6 +8,8 @@ import {
 import { DialogBasicExample } from './examples/Dialog.Basic.Example';
 import { DialogLargeHeaderExample } from './examples/Dialog.LargeHeader.Example';
 import { DialogBlockingExample } from './examples/Dialog.Blocking.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { DialogStatus } from './Dialog.checklist';
 
 const DialogBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx') as string;
 const DialogLargeHeaderExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Dialog/examples/Dialog.LargeHeader.Example.tsx') as string;
@@ -80,6 +82,11 @@ export class DialogPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...DialogStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.checklist.ts b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.checklist.ts
new file mode 100644
index 0000000000000..162613a626a9e
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const DocumentCardStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.poor
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx
index 47172909ff8be..8fe82fd96cac4 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx
@@ -8,6 +8,8 @@ import {
 import { DocumentCardBasicExample } from './examples/DocumentCard.Basic.Example';
 import { DocumentCardCompleteExample } from './examples/DocumentCard.Complete.Example';
 import { DocumentCardCompactExample } from './examples/DocumentCard.Compact.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { DocumentCardStatus } from './DocumentCard.checklist';
 
 const DocumentCardBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Basic.Example.tsx') as string;
 const DocumentCardCompleteExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx') as string;
@@ -76,6 +78,11 @@ export class DocumentCardPage extends React.Component<IComponentDemoPageProps, {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...DocumentCardStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.checklist.ts b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.checklist.ts
new file mode 100644
index 0000000000000..81b9ad868b078
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const DropdownStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.good
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
index ea8f7ebe7002f..5bf894388958f 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
@@ -7,6 +7,8 @@ import {
 } from '@uifabric/example-app-base';
 import { DropdownBasicExample } from './examples/Dropdown.Basic.Example';
 import { DropdownCustomExample } from './examples/Dropdown.Custom.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { DropdownStatus } from './Dropdown.checklist';
 
 const DropdownBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx') as string;
 const DropdownCustomExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx') as string;
@@ -60,6 +62,11 @@ export class DropdownPage extends React.Component<IComponentDemoPageProps, {}> {
           <div />
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...DropdownStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.checklist.ts b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.checklist.ts
new file mode 100644
index 0000000000000..fc1e45471d7c2
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const FacepileStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.good
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx b/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx
index 9139390919b3c..0a5d631ba4768 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx
@@ -9,6 +9,8 @@ import { FacepileAddFaceExample } from './examples/Facepile.AddFace.Example';
 import { FacepileBasicExample } from './examples/Facepile.Basic.Example';
 import { FacepileOverflowExample } from './examples/Facepile.Overflow.Example';
 import { FontClassNames } from '../../Styling';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { FacepileStatus } from './Facepile.checklist';
 
 const FacepileAddFaceExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Facepile/examples/Facepile.AddFace.Example.tsx') as string;
 const FacepileBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx') as string;
@@ -97,6 +99,11 @@ export class FacepilePage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...FacepileStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.checklist.ts b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.checklist.ts
new file mode 100644
index 0000000000000..1b54a370b7227
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const GroupedListStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.none
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListPage.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListPage.tsx
index bd80b03b02478..fcbfb8208b801 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListPage.tsx
@@ -7,6 +7,8 @@ import {
 } from '@uifabric/example-app-base';
 import { GroupedListBasicExample } from './examples/GroupedList.Basic.Example';
 import { GroupedListCustomExample } from './examples/GroupedList.Custom.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { GroupedListStatus } from './GroupedList.checklist';
 
 const GroupedListBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Basic.Example.tsx') as string;
 const GroupedListCustomExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx') as string;
@@ -38,6 +40,11 @@ export class GroupedListPage extends React.Component<IComponentDemoPageProps, {}
           <p>Allows you to render a set of items as multiple lists with various grouping properties.</p>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...GroupedListStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.checklist.ts b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.checklist.ts
new file mode 100644
index 0000000000000..bbdf32955b900
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const HoverCardStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.fail,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.none
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx
index d7f15e6bd6542..45f83b6e5a816 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx
@@ -8,6 +8,8 @@ import {
 } from '@uifabric/example-app-base';
 import { HoverCardBasicExample } from './examples/HoverCard.Basic.Example';
 import { HoverCardTargetExample } from './examples/HoverCard.Target.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { HoverCardStatus } from './HoverCard.checklist';
 
 import './HoverCardPage.scss';
 
@@ -44,6 +46,11 @@ export class HoverCardPage extends React.Component<any, any> {
             <span> supplement content associated with a specific data element.</span>
           </div>
         }
+        componentStatus={
+          <ComponentStatus
+            {...HoverCardStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.checklist.ts b/packages/office-ui-fabric-react/src/components/Icon/Icon.checklist.ts
new file mode 100644
index 0000000000000..1153265f3dfcb
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const IconStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.none
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx b/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx
index f4dde5d79ed92..1a3df633b5959 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx
@@ -8,6 +8,8 @@ import {
 import { IconBasicExample } from './examples/Icon.Basic.Example';
 import { IconColorExample } from './examples/Icon.Color.Example';
 import { IconImageSheetExample } from './examples/Icon.ImageSheet.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { IconStatus } from './Icon.checklist';
 
 const IconBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Icon/examples/Icon.Basic.Example.tsx') as string;
 const IconColorExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Icon/examples/Icon.Color.Example.tsx') as string;
@@ -66,6 +68,11 @@ export class IconPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...IconStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.checklist.ts b/packages/office-ui-fabric-react/src/components/Image/Image.checklist.ts
new file mode 100644
index 0000000000000..c2c47765cc6e6
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const ImageStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.good
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx b/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx
index f1b9318079076..4cdca42b2b48e 100644
--- a/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx
@@ -12,6 +12,8 @@ import { ImageContainExample } from './examples/Image.Contain.Example';
 import { ImageCoverExample } from './examples/Image.Cover.Example';
 import { ImageNoneExample } from './examples/Image.None.Example';
 import { ImageMaximizeFrameExample } from './examples/Image.MaximizeFrame.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { ImageStatus } from './Image.checklist';
 
 const ImageDefaultExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Image/examples/Image.Default.Example.tsx') as string;
 const ImageCenterExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Image/examples/Image.Center.Example.tsx') as string;
@@ -85,6 +87,11 @@ export class ImagePage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...ImageStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.checklist.ts b/packages/office-ui-fabric-react/src/components/Label/Label.checklist.ts
new file mode 100644
index 0000000000000..ba4f78eda5b3a
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Label/Label.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const LabelStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.good
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx b/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx
index 0663e0a484c6c..c32faf90f29fd 100644
--- a/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx
@@ -6,6 +6,8 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { LabelBasicExample } from './examples/Label.Basic.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { LabelStatus } from './Label.checklist';
 
 const LabelBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Label/examples/Label.Basic.Example.tsx') as string;
 
@@ -55,6 +57,11 @@ export class LabelPage extends React.Component<IComponentDemoPageProps, any> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...LabelStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.checklist.ts b/packages/office-ui-fabric-react/src/components/Layer/Layer.checklist.ts
new file mode 100644
index 0000000000000..24b86d63fb117
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const LayerStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.good
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Layer/LayerPage.tsx b/packages/office-ui-fabric-react/src/components/Layer/LayerPage.tsx
index a505044001446..6230fc5a4fa53 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/LayerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/LayerPage.tsx
@@ -8,6 +8,8 @@ import {
 } from '@uifabric/example-app-base';
 import { LayerBasicExample } from './examples/Layer.Basic.Example';
 import { LayerHostedExample } from './examples/Layer.Hosted.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { LayerStatus } from './Layer.checklist';
 
 const LayerBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx') as string;
 const LayerHostedExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx') as string;
@@ -69,6 +71,11 @@ export class LayerPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...LayerStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.checklist.ts b/packages/office-ui-fabric-react/src/components/Link/Link.checklist.ts
new file mode 100644
index 0000000000000..c716970297cbd
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const LinkStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.none
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx b/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx
index 075fd74b2ef60..4e28bf8181b91 100644
--- a/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx
@@ -6,6 +6,8 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { LinkBasicExample } from './examples/Link.Basic.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { LinkStatus } from './Link.checklist';
 
 let LinkBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Link/examples/Link.Basic.Example.tsx') as string;
 
@@ -61,6 +63,11 @@ export class LinkPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...LinkStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/List/List.checklist.ts b/packages/office-ui-fabric-react/src/components/List/List.checklist.ts
new file mode 100644
index 0000000000000..a132f46f10b20
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/List/List.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const ListStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.fail,
+  rtlSupport: ChecklistStatus.fail,
+  testCoverage: ChecklistStatus.none
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/List/ListPage.tsx b/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
index ac8fcc5c5e0c2..1e2ec931fc568 100644
--- a/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
@@ -9,6 +9,8 @@ import { ListBasicExample } from './examples/List.Basic.Example';
 import { ListGridExample } from './examples/List.Grid.Example';
 import { ListScrollingExample } from './examples/List.Scrolling.Example';
 import { createListItems } from '@uifabric/example-app-base';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { ListStatus } from './List.checklist';
 
 const ListBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx') as string;
 const ListGridExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx') as string;
@@ -62,6 +64,11 @@ export class ListPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...ListStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.checklist.ts b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.checklist.ts
new file mode 100644
index 0000000000000..0767ffb80ddee
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const MessageBarStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.fair
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBarPage.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBarPage.tsx
index 7cff834bfd0c4..efabdbc645e86 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBarPage.tsx
@@ -6,6 +6,8 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { MessageBarBasicExample } from './examples/MessageBar.Basic.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { MessageBarStatus } from './MessageBar.checklist';
 
 const MessageBarBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx') as string;
 
@@ -60,6 +62,11 @@ export class MessageBarPage extends React.Component<IComponentDemoPageProps, {}>
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...MessageBarStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Modal/Modal.checklist.ts b/packages/office-ui-fabric-react/src/components/Modal/Modal.checklist.ts
new file mode 100644
index 0000000000000..fa52bea0df42e
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Modal/Modal.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const ModalStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.fail,
+  testCoverage: ChecklistStatus.none
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Modal/ModalPage.tsx b/packages/office-ui-fabric-react/src/components/Modal/ModalPage.tsx
index 5004f48c0bc71..0fef87a291877 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/ModalPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Modal/ModalPage.tsx
@@ -7,6 +7,8 @@ import {
 } from '@uifabric/example-app-base';
 import { Link } from 'office-ui-fabric-react/lib/Link';
 import { ModalBasicExample } from './examples/Modal.Basic.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { ModalStatus } from './Modal.checklist';
 
 const ModalBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Modal/examples/Modal.Basic.Example.tsx') as string;
 
@@ -59,6 +61,11 @@ export class ModalPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...ModalStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.checklist.ts b/packages/office-ui-fabric-react/src/components/Nav/Nav.checklist.ts
new file mode 100644
index 0000000000000..e722ef184a9c1
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const NavStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.none
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Nav/NavPage.tsx b/packages/office-ui-fabric-react/src/components/Nav/NavPage.tsx
index d71e40ad0523b..2d5c069002932 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/NavPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/NavPage.tsx
@@ -9,6 +9,8 @@ import { NavBasicExample } from './examples/Nav.Basic.Example';
 import { NavFabricDemoAppExample } from './examples/Nav.FabricDemoApp.Example';
 import { NavNestedExample } from './examples/Nav.Nested.Example';
 import { NavByKeysExample } from './examples/Nav.ByKeys.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { NavStatus } from './Nav.checklist';
 
 const NavBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Nav/examples/Nav.Basic.Example.tsx') as string;
 const NavFabricDemoAppExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Nav/examples/Nav.FabricDemoApp.Example.tsx') as string;
@@ -74,6 +76,11 @@ export class NavPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...NavStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.checklist.ts b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.checklist.ts
new file mode 100644
index 0000000000000..d0195578f4853
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const OverflowSetStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.fail,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.poor
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSetPage.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSetPage.tsx
index 42b0a30fc028e..e58fca2f00be0 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSetPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSetPage.tsx
@@ -7,6 +7,8 @@ import {
 } from '@uifabric/example-app-base';
 import { OverflowSetCustomExample } from './examples/OverflowSet.Custom.Example';
 import { OverflowSetBasicExample } from './examples/OverflowSet.Basic.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { OverflowSetStatus } from './OverflowSet.checklist';
 
 const OverflowSetCustomExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx') as string;
 const OverflowSetBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Basic.Example.tsx') as string;
@@ -42,6 +44,11 @@ export class OverflowSetPage extends React.Component<any, any> {
             ] }
           />
         }
+        componentStatus={
+          <ComponentStatus
+            {...OverflowSetStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.checklist.ts b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.checklist.ts
new file mode 100644
index 0000000000000..507b8190f8c5e
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const OverlayStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.fail,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.none
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx b/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx
index 8d5a1ae00944e..b831a74ba0d9e 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx
@@ -7,6 +7,8 @@ import {
 } from '@uifabric/example-app-base';
 import { OverlayDarkExample } from './examples/Overlay.Dark.Example';
 import { OverlayLightExample } from './examples/Overlay.Light.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { OverlayStatus } from './Overlay.checklist';
 
 const OverlayLightExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Overlay/examples/Overlay.Light.Example.tsx') as string;
 const OverlayDarkExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Overlay/examples/Overlay.Dark.Example.tsx') as string;
@@ -60,6 +62,11 @@ export class OverlayPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...OverlayStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.checklist.ts b/packages/office-ui-fabric-react/src/components/Panel/Panel.checklist.ts
new file mode 100644
index 0000000000000..6cc5f104a06ca
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const PanelStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.fair
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx b/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
index fbe95276afea9..592bcfcdef873 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
@@ -17,6 +17,8 @@ import { PanelLightDismissExample } from './examples/Panel.LightDismiss.Example'
 import { PanelNonModalExample } from './examples/Panel.NonModal.Example';
 import { PanelFooterExample } from './examples/Panel.Footer.Example';
 import { FontClassNames } from '../../Styling';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { PanelStatus } from './Panel.checklist';
 
 const PanelSmallRightExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Panel/examples/Panel.SmallRight.Example.tsx') as string;
 const PanelSmallLeftExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Panel/examples/Panel.SmallLeft.Example.tsx') as string;
@@ -117,6 +119,11 @@ export class PanelPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...PanelStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.checklist.ts b/packages/office-ui-fabric-react/src/components/Persona/Persona.checklist.ts
new file mode 100644
index 0000000000000..141afbbd2c317
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const PersonaStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.good
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
index 663e67c12993c..e030d24c0d624 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
@@ -9,6 +9,8 @@ import { PersonaInitialsExample } from './examples/Persona.Initials.Example';
 import { PersonaBasicExample } from './examples/Persona.Basic.Example';
 import { PersonaAlternateExample } from './examples/Persona.Alternate.Example';
 import { PersonaCustomRenderExample } from './examples/Persona.CustomRender.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { PersonaStatus } from './Persona.checklist';
 
 const PersonaInitialsExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Persona/examples/Persona.Initials.Example.tsx') as string;
 const PersonaBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx') as string;
@@ -72,6 +74,11 @@ export class PersonaPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...PersonaStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.checklist.ts b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.checklist.ts
new file mode 100644
index 0000000000000..b444443897df5
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const PivotStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.none
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx b/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx
index e9520cd10c9a9..e93926b85c057 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx
@@ -15,6 +15,8 @@ import { PivotOnChangeExample } from './examples/Pivot.OnChange.Example';
 import { PivotRemoveExample } from './examples/Pivot.Remove.Example';
 import { PivotOverrideExample } from './examples/Pivot.Override.Example';
 import { PivotSeparateExample } from './examples/Pivot.Separate.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { PivotStatus } from './Pivot.checklist';
 
 const PivotRemoveExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Pivot/examples/Pivot.Remove.Example.tsx') as string;
 const PivotBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Pivot/examples/Pivot.Basic.Example.tsx') as string;
@@ -114,6 +116,11 @@ export class PivotPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...PivotStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.checklist.ts b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.checklist.ts
new file mode 100644
index 0000000000000..8c72575be1e78
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const ProgressIndicatorStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.none
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx
index fb9efaabce5cd..f1d9d22a14008 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx
@@ -6,6 +6,9 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { ProgressIndicatorBasicExample } from './examples/ProgressIndicator.Basic.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { ProgressIndicatorStatus } from './ProgressIndicator.checklist';
+
 const ProgressIndicatorBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Basic.Example.tsx') as string;
 
 export class ProgressIndicatorPage extends React.Component<IComponentDemoPageProps, {}> {
@@ -78,6 +81,11 @@ export class ProgressIndicatorPage extends React.Component<IComponentDemoPagePro
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...ProgressIndicatorStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.checklist.ts b/packages/office-ui-fabric-react/src/components/Rating/Rating.checklist.ts
new file mode 100644
index 0000000000000..22de4fed8005c
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const RatingStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.fail,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.good
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Rating/RatingPage.tsx b/packages/office-ui-fabric-react/src/components/Rating/RatingPage.tsx
index 5fc563fd7ff58..4ea8d77409dbe 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/RatingPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/RatingPage.tsx
@@ -6,6 +6,8 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { RatingBasicExample } from './examples/Rating.Basic.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { RatingStatus } from './Rating.checklist';
 
 const RatingBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx') as string;
 
@@ -52,6 +54,11 @@ export class RatingPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...RatingStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.checklist.ts b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.checklist.ts
new file mode 100644
index 0000000000000..feed33c35d411
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const ResizeGroupStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.good
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
index f10a66f09cf63..b105c42dae92e 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
@@ -7,6 +7,8 @@ import {
 } from '@uifabric/example-app-base';
 import { ResizeGroupOverflowSetExample } from './examples/ResizeGroup.OverflowSet.Example';
 import { FlexBoxResizeGroupExample } from './examples/ResizeGroup.FlexBox.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { ResizeGroupStatus } from './ResizeGroup.checklist';
 
 const ResizeGroupBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx') as string;
 
@@ -91,7 +93,11 @@ export class ResizeGroupPage extends React.Component<any, any> {
             </ul>
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...ResizeGroupStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.checklist.ts b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.checklist.ts
new file mode 100644
index 0000000000000..39f39ec073c75
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const ScrollablePaneStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.none
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
index 790722a01b892..97722372986fc 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
@@ -7,6 +7,8 @@ import {
 } from '@uifabric/example-app-base';
 import { ScrollablePaneDefaultExample } from './examples/ScrollablePane.Default.Example';
 import { ScrollablePaneDetailsListExample } from './examples/ScrollablePane.DetailsList.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { ScrollablePaneStatus } from './ScrollablePane.checklist';
 
 const ScrollablePaneDefaultExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx') as string;
 
@@ -43,7 +45,7 @@ export class ScrollablePanePage extends React.Component<IComponentDemoPageProps,
           </div>
         }
         bestPractices={
-          <div/>
+          <div />
         }
         dos={
           <div>
@@ -62,6 +64,11 @@ export class ScrollablePanePage extends React.Component<IComponentDemoPageProps,
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...ScrollablePaneStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.checklist.ts b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.checklist.ts
new file mode 100644
index 0000000000000..aa85969dd764f
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const SearchBoxStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.none
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
index 47b614222d5a0..59789bce9d08a 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
@@ -8,6 +8,8 @@ import {
 import { SearchBoxSmallExample } from './examples/SearchBox.Small.Example';
 import { SearchBoxFullSizeExample } from './examples/SearchBox.FullSize.Example';
 import { FontClassNames } from '../../Styling';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { SearchBoxStatus } from './SearchBox.checklist';
 
 const SearchBoxSmallExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Small.Example.tsx') as string;
 const SearchBoxFullSizeExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.FullSize.Example.tsx') as string;
@@ -118,6 +120,11 @@ export class SearchBoxPage extends React.Component<IComponentDemoPageProps, {}>
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...SearchBoxStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.checklist.ts b/packages/office-ui-fabric-react/src/components/Slider/Slider.checklist.ts
new file mode 100644
index 0000000000000..063d37eccc149
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const SliderStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.fair
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Slider/SliderPage.tsx b/packages/office-ui-fabric-react/src/components/Slider/SliderPage.tsx
index d10764a2de9e1..7b25458b041c7 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/SliderPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/SliderPage.tsx
@@ -6,6 +6,8 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { SliderBasicExample } from './examples/Slider.Basic.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { SliderStatus } from './Slider.checklist';
 
 const SliderBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Slider/examples/Slider.Basic.Example.tsx') as string;
 
@@ -13,10 +15,10 @@ export class SliderPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
     return (
       <ComponentPage
-        title='Slider'
+        title={ 'Slider' }
         componentName='SliderExample'
         exampleCards={
-          <ExampleCard title='Slider' code={ SliderBasicExampleCode }>
+          <ExampleCard title={ 'Slider' } code={ SliderBasicExampleCode }>
             <SliderBasicExample />
           </ExampleCard>
         }
@@ -62,6 +64,11 @@ export class SliderPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...SliderStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.checklist.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.checklist.ts
new file mode 100644
index 0000000000000..43a63ba9e4834
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const SpinButtonStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.fail,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.good
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
index 65b454fc27fc9..8e0caece1d291 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
@@ -11,6 +11,8 @@ import { SpinButtonStatefulExample } from './examples/SpinButton.Stateful.Exampl
 import { SpinButtonBasicWithIconExample } from './examples/SpinButton.BasicWithIcon.Example';
 import { SpinButtonBasicWithEndPositionExample } from './examples/SpinButton.BasicWithEndPosition.Example';
 import { SpinButtonCustomStyledExample } from './examples/SpinButton.CustomStyled.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { SpinButtonStatus } from './SpinButton.checklist';
 
 const SpinButtonBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx') as string;
 const SpinButtonBasicDisabledExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicDisabled.Example.tsx') as string;
@@ -101,6 +103,11 @@ export class SpinButtonPage extends React.Component<IComponentDemoPageProps, {}>
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...SpinButtonStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.checklist.ts b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.checklist.ts
new file mode 100644
index 0000000000000..c4d0d189c4349
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const SpinnerStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.none
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/SpinnerPage.tsx b/packages/office-ui-fabric-react/src/components/Spinner/SpinnerPage.tsx
index c8a1837f67241..29f51b52d0f42 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/SpinnerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Spinner/SpinnerPage.tsx
@@ -6,6 +6,8 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { SpinnerBasicExample } from './examples/Spinner.Basic.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { SpinnerStatus } from './Spinner.checklist';
 
 const SpinnerBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Spinner/examples/Spinner.Basic.Example.tsx') as string;
 
@@ -60,6 +62,11 @@ export class SpinnerPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...SpinnerStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.checklist.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.checklist.ts
new file mode 100644
index 0000000000000..ada46470bee67
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const SwatchColorPickerStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.fail,
+  testCoverage: ChecklistStatus.fair
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx
index c701ca3cec469..ba1d005f60fda 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx
@@ -6,6 +6,8 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { SwatchColorPickerBasicExample } from './examples/SwatchColorPicker.Basic.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { SwatchColorPickerStatus } from './SwatchColorPicker.checklist';
 
 const SwatchColorPickerBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx') as string;
 
@@ -50,6 +52,11 @@ export class SwatchColorPickerPage extends React.Component<IComponentDemoPagePro
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...SwatchColorPickerStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.checklist.ts b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.checklist.ts
new file mode 100644
index 0000000000000..b3fc3e15408a3
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const TeachingBubbleStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.fair
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubblePage.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubblePage.tsx
index 15311eb737915..a81a265ce96db 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubblePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubblePage.tsx
@@ -9,6 +9,8 @@ import {
 import { TeachingBubbleBasicExample } from './examples/TeachingBubble.Basic.Example';
 import { TeachingBubbleCondensedExample } from './examples/TeachingBubble.Condensed.Example';
 import { TeachingBubbleIllustrationExample } from './examples/TeachingBubble.Illustration.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { TeachingBubbleStatus } from './TeachingBubble.checklist';
 
 const TeachingBubbleBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx') as string;
 const TeachingBubbleCondensedExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Condensed.Example.tsx') as string;
@@ -46,6 +48,11 @@ export class TeachingBubblePage extends React.Component<any, any> {
             <span> allow the user to display important hints on their web pages with a callout box.</span>
           </div>
         }
+        componentStatus={
+          <ComponentStatus
+            {...TeachingBubbleStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.checklist.ts b/packages/office-ui-fabric-react/src/components/TextField/TextField.checklist.ts
new file mode 100644
index 0000000000000..26915ee433851
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const TextFieldStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.good
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
index e417e2fc7be4e..2945e47a66ff4 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
@@ -7,6 +7,8 @@ import {
 } from '@uifabric/example-app-base';
 import { TextFieldBasicExample } from './examples/TextField.Basic.Example';
 import { TextFieldErrorMessageExample } from './examples/TextField.ErrorMessage.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { TextFieldStatus } from './TextField.checklist';
 
 const TextFieldBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx') as string;
 const TextFieldErrorMessageExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx') as string;
@@ -74,6 +76,11 @@ export class TextFieldPage extends React.Component<IComponentDemoPageProps, {}>
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...TextFieldStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.checklist.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.checklist.ts
new file mode 100644
index 0000000000000..ad4a838b534d5
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const ToggleStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.good
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
index 4bb3199936333..b8952ad24fd69 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
@@ -7,6 +7,8 @@ import {
 } from '@uifabric/example-app-base';
 import { ToggleBasicExample } from './examples/Toggle.Basic.Example';
 import { FontClassNames } from '../../Styling';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { ToggleStatus } from './Toggle.checklist';
 
 const ToggleBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Toggle/examples/Toggle.Basic.Example.tsx') as string;
 
@@ -67,6 +69,11 @@ export class TogglePage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...ToggleStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.checklist.ts b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.checklist.ts
new file mode 100644
index 0000000000000..c3eb52ccdc630
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const TooltipStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.poor
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.tsx
index c750f005e56da..cb4bf35628943 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.tsx
@@ -9,6 +9,8 @@ import {
 import { TooltipCustomExample } from './examples/Tooltip.Custom.Example';
 import { TooltipBasicExample } from './examples/Tooltip.Basic.Example';
 import { TooltipOverflowExample } from './examples/Tooltip.Overflow.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { TooltipStatus } from './Tooltip.checklist';
 
 import './TooltipPage.scss';
 
@@ -50,6 +52,11 @@ export class TooltipPage extends React.Component<any, any> {
             <span> supplement content associated with a specific UI component.</span>
           </div>
         }
+        componentStatus={
+          <ComponentStatus
+            {...TooltipStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.checklist.ts b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.checklist.ts
new file mode 100644
index 0000000000000..c5eabdc8f0b09
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const PeoplePickerStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.fail,
+  rtlSupport: ChecklistStatus.fail,
+  testCoverage: ChecklistStatus.none
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerPage.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerPage.tsx
index 3c38f8d37ea7f..be8f5bb03c341 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerPage.tsx
@@ -7,6 +7,8 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { PeoplePickerTypesExample } from './examples/PeoplePicker.Types.Example';
+import { ComponentStatus } from '../../../demo/ComponentStatus/ComponentStatus';
+import { PeoplePickerStatus } from './PeoplePicker.checklist';
 
 const PeoplePickerTypesExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx') as string;
 
@@ -59,6 +61,11 @@ export class PeoplePickerPage extends React.Component<IComponentDemoPageProps, {
             </ul>
           </div>
         }
+        componentStatus={
+          <ComponentStatus
+            {...PeoplePickerStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Pickers.checklist.ts b/packages/office-ui-fabric-react/src/components/pickers/Pickers.checklist.ts
new file mode 100644
index 0000000000000..4797f052e46a1
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/pickers/Pickers.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const PickersStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.fail,
+  rtlSupport: ChecklistStatus.fail,
+  testCoverage: ChecklistStatus.good
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PickersPage.tsx b/packages/office-ui-fabric-react/src/components/pickers/PickersPage.tsx
index eb33023b4cc64..490eb22a68635 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PickersPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PickersPage.tsx
@@ -8,6 +8,8 @@ import {
 } from '@uifabric/example-app-base';
 import { PickerCustomResultExample } from './examples/Picker.CustomResult.Example';
 import { TagPickerBasicExample } from './examples/TagPicker.Basic.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { PickersStatus } from './Pickers.checklist';
 
 const TagPickerExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx') as string;
 const PickerCustomResultExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx') as string;
@@ -42,6 +44,11 @@ export class PickersPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...PickersStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
index 9e11f62436516..b581aab573a1e 100644
--- a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
+++ b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
@@ -337,7 +337,13 @@ export const AppDefinition: IAppDefinition = {
           key: 'Theme',
           name: 'Themes',
           url: '#examples/themes'
-        }
+        },
+        {
+          component: require<any>('./ComponentStatus/ComponentStatusPage').ComponentStatusPage,
+          key: 'Components Status',
+          name: 'Components Checklist',
+          url: '#/components-status'
+        },
       ],
       name: 'Utilities'
     }
@@ -348,6 +354,10 @@ export const AppDefinition: IAppDefinition = {
       name: 'Getting started',
       url: '#/'
     },
+    {
+      name: 'Components Checklist',
+      url: '#/components-status'
+    },
     {
       name: 'Fabric',
       url: 'http://dev.office.com/fabric'
diff --git a/packages/office-ui-fabric-react/src/demo/ComponentStatus/AllComponents.checklist.ts b/packages/office-ui-fabric-react/src/demo/ComponentStatus/AllComponents.checklist.ts
new file mode 100644
index 0000000000000..5dbeb6601e4dd
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/demo/ComponentStatus/AllComponents.checklist.ts
@@ -0,0 +1,54 @@
+
+import { IComponentStatusProps } from './ComponentStatus.Props';
+export interface IComponentStatusState {
+  [key: string]: IComponentStatusProps;
+}
+export const AllComponentsStatus: IComponentStatusState = {
+  Breadcrumb: require<any>('../../components/Breadcrumb/Breadcrumb.checklist').BreadcrumbStatus,
+  Button: require<any>('../../components/Button/Button.checklist').ButtonStatus,
+  Calendar: require<any>('../../components/Calendar/Calendar.checklist').CalendarStatus,
+  Callout: require<any>('../../components/Callout/Callout.checklist').CalloutStatus,
+  Checkbox: require<any>('../../components/Checkbox/Checkbox.checklist').CheckboxStatus,
+  ChoiceGroup: require<any>('../../components/ChoiceGroup/ChoiceGroup.checklist').ChoiceGroupStatus,
+  ColorPicker: require<any>('../../components/ColorPicker/ColorPicker.checklist').ColorPickerStatus,
+  ComboBox: require<any>('../../components/ComboBox/ComboBox.checklist').ComboBoxStatus,
+  CommandBar: require<any>('../../components/CommandBar/CommandBar.checklist').CommandBarStatus,
+  ContextualMenu: require<any>('../../components/ContextualMenu/ContextualMenu.checklist').ContextualMenuStatus,
+  DatePicker: require<any>('../../components/DatePicker/DatePicker.checklist').DatePickerStatus,
+  DetailsList: require<any>('../../components/DetailsList/DetailsList.checklist').DetailsListStatus,
+  Dialog: require<any>('../../components/Dialog/Dialog.checklist').DialogStatus,
+  DocumentCard: require<any>('../../components/Calendar/Calendar.checklist').CalendarStatus,
+  Dropdown: require<any>('../../components/Dropdown/Dropdown.checklist').DropdownStatus,
+  Facepile: require<any>('../../components/Facepile/Facepile.checklist').FacepileStatus,
+  GroupedList: require<any>('../../components/GroupedList/GroupedList.checklist').GroupedListStatus,
+  HoverCard: require<any>('../../components/HoverCard/HoverCard.checklist').HoverCardStatus,
+  Icon: require<any>('../../components/Icon/Icon.checklist').IconStatus,
+  Image: require<any>('../../components/Image/Image.checklist').ImageStatus,
+  Label: require<any>('../../components/Label/Label.checklist').LabelStatus,
+  Layer: require<any>('../../components/Layer/Layer.checklist').LayerStatus,
+  Link: require<any>('../../components/Link/Link.checklist').LinkStatus,
+  List: require<any>('../../components/List/List.checklist').ListStatus,
+  MessageBar: require<any>('../../components/MessageBar/MessageBar.checklist').MessageBarStatus,
+  Modal: require<any>('../../components/Modal/Modal.checklist').ModalStatus,
+  Nav: require<any>('../../components/Nav/Nav.checklist').NavStatus,
+  Overlay: require<any>('../../components/Overlay/Overlay.checklist').OverlayStatus,
+  OverflowSet: require<any>('../../components/OverflowSet/OverflowSet.checklist').OverflowSetStatus,
+  Panel: require<any>('../../components/Panel/Panel.checklist').PanelStatus,
+  Persona: require<any>('../../components/Persona/Persona.checklist').PersonaStatus,
+  Pickers: require<any>('../../components/pickers/Pickers.checklist').PickersStatus,
+  PeoplePicker: require<any>('../../components/pickers/PeoplePicker/PeoplePicker.checklist').PeoplePickerStatus,
+  Pivot: require<any>('../../components/Pivot/Pivot.checklist').PivotStatus,
+  ProgressIndicator: require<any>('../../components/ProgressIndicator/ProgressIndicator.checklist').ProgressIndicatorStatus,
+  Rating: require<any>('../../components/Rating/Rating.checklist').RatingStatus,
+  ResizeGroup: require<any>('../../components/ResizeGroup/ResizeGroup.checklist').ResizeGroupStatus,
+  ScrollablePane: require<any>('../../components/ScrollablePane/ScrollablePane.checklist').ScrollablePaneStatus,
+  SearchBox: require<any>('../../components/SearchBox/SearchBox.checklist').SearchBoxStatus,
+  Slider: require<any>('../../components/Slider/Slider.checklist').SliderStatus,
+  Spinner: require<any>('../../components/Spinner/Spinner.checklist').SpinnerStatus,
+  SpinButton: require<any>('../../components/SpinButton/SpinButton.checklist').SpinButtonStatus,
+  SwatchColorPicker: require<any>('../../components/SwatchColorPicker/SwatchColorPicker.checklist').SwatchColorPickerStatus,
+  TeachingBubble: require<any>('../../components/TeachingBubble/TeachingBubble.checklist').TeachingBubbleStatus,
+  TextField: require<any>('../../components/TextField/TextField.checklist').TextFieldStatus,
+  Toggle: require<any>('../../components/Toggle/Toggle.checklist').ToggleStatus,
+  Tooltip: require<any>('../../components/Tooltip/Tooltip.checklist').TooltipStatus,
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.Props.ts b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.Props.ts
new file mode 100644
index 0000000000000..7388bad06d88d
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.Props.ts
@@ -0,0 +1,17 @@
+export interface IComponentStatusProps {
+  keyboardAccessibilitySupport: ChecklistStatus;
+  markupSupport: ChecklistStatus;
+  highContrastSupport: ChecklistStatus;
+  rtlSupport: ChecklistStatus;
+  testCoverage: ChecklistStatus;
+}
+
+export enum ChecklistStatus {
+  unknown = 'Unknown',
+  pass = 'Pass',
+  fail = 'Fail',
+  none = 'No Tests',
+  poor = 'Poor',
+  fair = 'Fair',
+  good = 'Good'
+}
diff --git a/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.scss b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.scss
new file mode 100644
index 0000000000000..59d7492030b6b
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.scss
@@ -0,0 +1,11 @@
+@import '../../common/common';
+
+:global {
+  .ComponentStatus-badge {
+    margin-right: 5px;
+  }
+
+  .ComponentStatus-div {
+    display: inline-block;
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.tsx b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.tsx
new file mode 100644
index 0000000000000..93f9f5d390930
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.tsx
@@ -0,0 +1,78 @@
+import * as React from 'react';
+import { IComponentStatusProps, ChecklistStatus } from './ComponentStatus.Props';
+import './ComponentStatus.scss';
+
+export class ComponentStatus extends React.Component<IComponentStatusProps, {}> {
+
+  public static defaultProps: IComponentStatusProps = {
+    keyboardAccessibilitySupport: ChecklistStatus.fail,
+    markupSupport: ChecklistStatus.fail,
+    highContrastSupport: ChecklistStatus.fail,
+    rtlSupport: ChecklistStatus.fail,
+    testCoverage: ChecklistStatus.none
+  };
+
+  public render(): JSX.Element {
+    const keyboardAccessibilitySubject = 'Keyboard Accessibility';
+    const markupSubject = 'Markup';
+    const highContrastSupportSubject = 'High Contrast';
+    const rtlSubject = 'Right to Left';
+    const testCoverageSubject = 'Test Coverage';
+
+    return (
+      <div className='ComponentStatus-div'>
+        { this._definebadgeAnchor(keyboardAccessibilitySubject, this.props.keyboardAccessibilitySupport) }
+        { this._definebadgeAnchor(markupSubject, this.props.markupSupport) }
+        { this._definebadgeAnchor(highContrastSupportSubject, this.props.highContrastSupport) }
+        { this._definebadgeAnchor(rtlSubject, this.props.rtlSupport) }
+        { this._definebadgeAnchor(testCoverageSubject, this.props.testCoverage) }
+      </div >
+    );
+  }
+
+  private _definebadgeAnchor(subject: string, state: ChecklistStatus): JSX.Element {
+    const ariaLabel = subject + '. ' + state;
+    const color = this._colorForComponentStateStatus(state);
+    return this._badgeAnchor(ariaLabel, color, subject, state);
+  }
+
+  private _badgeAnchor(ariaLabel: string, color: string, subject: string, status: string): JSX.Element {
+    return (
+      <a
+        aria-label={ ariaLabel }
+        href='#/components-status'
+        className='ComponentStatus-badge'
+      >
+        <img
+          src={ this._badgeURL(color, subject, status) }
+        />
+      </a>
+    );
+  }
+
+  private _badgeURL(color: string, subject: String, status: String): string {
+    const badgeBaseURL = 'https://img.shields.io/badge/';
+    const badgeStyle = 'flat';
+    return badgeBaseURL + subject + '-' + status + '-' + color + '.svg' + '?style=' + badgeStyle;
+  }
+
+  private _colorForComponentStateStatus(testCoverageStatus: ChecklistStatus | undefined): string {
+    switch (testCoverageStatus) {
+      case ChecklistStatus.unknown:
+        return 'lightgrey';
+      case ChecklistStatus.fail:
+      case ChecklistStatus.none:
+        return 'red';
+      case ChecklistStatus.poor:
+        return 'yellow';
+      case ChecklistStatus.fair:
+        return 'yellowgreen';
+      case ChecklistStatus.pass:
+      case ChecklistStatus.good:
+        return 'brightgreen';
+    }
+
+    return 'red';
+  }
+
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusPage.scss b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusPage.scss
new file mode 100644
index 0000000000000..be5bd9361ae06
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusPage.scss
@@ -0,0 +1,20 @@
+@import '../../common/common';
+
+:global {
+  .componentTable {
+    border-collapse: collapse;
+    width: 100%;
+  }
+
+  .componentBadgeCell {
+    padding: 8px;
+    text-align: right;
+    border-bottom: 1px solid #ddd;
+  }
+
+  .componentCells {
+    padding: 8px;
+    text-align: left;
+    border-bottom: 1px solid #ddd;
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusPage.tsx b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusPage.tsx
new file mode 100644
index 0000000000000..7e3983cea2f9d
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusPage.tsx
@@ -0,0 +1,97 @@
+import * as React from 'react';
+import { ComponentPage, IComponentPageSection } from '@uifabric/example-app-base';
+import { Link } from '../../Link';
+import { AllComponentsStatus } from './AllComponents.checklist';
+import { ComponentStatusInfoState, IComponentStatusInfoState, InformationLink } from './ComponentStatusState';
+import { ComponentStatus } from './ComponentStatus';
+import './ComponentStatusPage.scss';
+
+export class ComponentStatusPage extends React.Component<{}, {}> {
+  public render() {
+    let sections: [IComponentPageSection] = [{ title: 'Badges', section: this._renderStatusesInfo() }, { title: 'Status', section: this._renderComponents() }];
+
+    return (
+      <ComponentPage
+        title='Components Checklist'
+        componentName='Components Checklist'
+        overview={ this._renderOverView() }
+        otherSections={ sections }
+      />
+    );
+  }
+
+  private _renderOverView(): JSX.Element {
+    return (
+      <div>
+        Badges are used to track a component's status regarding different criteria. They reflect if a component is localizable, accessible and reliable.
+    </div>
+    );
+  }
+
+  private _renderComponents(): JSX.Element {
+    return (
+      <div>
+        <table className='componentTable'>
+          <tbody>
+            { Object.keys(AllComponentsStatus).map((componentName, index) => {
+              return this._renderComponent(componentName);
+            }) }
+          </tbody>
+        </table>
+      </div >
+    );
+  }
+
+  private _renderComponent(componentName: string): JSX.Element {
+    let component = AllComponentsStatus[componentName];
+    return (
+      <tr key={ componentName + '-key' }>
+        <th className='componentCells'><h3>{ componentName } </h3> </th>
+        <td className='componentBadgeCell'><ComponentStatus
+          {...component}
+        /></td>
+      </tr >
+    );
+  }
+
+  private _renderStatusesInfo() {
+    return (
+      <div>
+        <table className='componentTable'>
+          <tbody>
+            <tr>
+              <th className='componentCells'>Name</th>
+              <th className='componentCells'>Description</th>
+              <th className='componentCells'>Success</th>
+            </tr>
+            { ComponentStatusInfoState.map((name) => {
+              return this._renderStatusInfo(name);
+            }) }
+          </tbody>
+        </table>
+      </div>
+    );
+  }
+
+  private _renderStatusInfo(statusInfo: IComponentStatusInfoState) {
+    return (
+      <tr key={ statusInfo.name + '-key' }>
+        <th className='componentCells'> { statusInfo.name } </th>
+        <td className='componentCells'> { statusInfo.description } </td>
+        <td className='componentCells'> { statusInfo.success }
+          { statusInfo.link && this._createLink(statusInfo.link) }
+        </td>
+      </tr>
+    );
+  }
+
+  private _createLink(information: InformationLink): JSX.Element {
+    return (
+      <Link
+        href={ information.link }
+      >
+        { ' ' + information.renderedText }
+      </Link>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusState.tsx b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusState.tsx
new file mode 100644
index 0000000000000..eaa20549e9edf
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusState.tsx
@@ -0,0 +1,43 @@
+export interface IComponentStatusInfoState {
+  name: string;
+  description: string;
+  success: string;
+  link?: InformationLink;
+}
+
+export interface InformationLink {
+  link: string;
+  renderedText: string;
+}
+
+export const ComponentStatusInfoState: [IComponentStatusInfoState] = [
+  {
+    name: 'Keyboard Accessibility Support',
+    description: 'Components should be fully usable with the keyboard.',
+    success: 'For this badge to pass, all of the functionalities of a component needs to be accessible via the keyboard.'
+  },
+  {
+    name: 'Markup Accessibility Support',
+    description: 'Components should be appropriately marked with ARIA attributes so users with assistive technologies can interact with them.',
+    success: 'For this badge to pass, a component needs to be marked with ARIA attributes to describe its behavior for assistive technologies (e.g., screen readers). A component can use ARIA roles, states and properties to inform users of its behavior.',
+    link: {
+      link: 'https://www.w3.org/WAI/intro/aria',
+      renderedText: 'Please refer to W3C for ARIA guidelines.'
+    }
+  },
+  {
+    name: 'High Contrast Support',
+    description: 'Components should display correctly in high contrast mode.',
+    success: 'For this badge to pass, set your operating system to use high contrast and then ensure that the components render correctly.'
+  },
+  {
+    name: 'Right To Left Support',
+    description: 'For localization, components should display correctly in right to left layouts.',
+    success: 'For this badge to pass, ensure RTL (right-to-left) layouts render properly in the sample website by enabling it in the settings (located in the top right corner for LTR layout).'
+  },
+  {
+    name: 'Test Coverage',
+    description: 'To avoid regressions, make sure components are throughly unit-tested.',
+    success: 'For this badge to be marked "good", write unit tests that cover all edge cases and scenarios.'
+  },
+];
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/demo/index.tsx b/packages/office-ui-fabric-react/src/demo/index.tsx
index 38d94b6bb66a7..1f81be09f9a19 100644
--- a/packages/office-ui-fabric-react/src/demo/index.tsx
+++ b/packages/office-ui-fabric-react/src/demo/index.tsx
@@ -7,11 +7,13 @@ import { Router, Route } from 'office-ui-fabric-react/lib/utilities/router/index
 import { GettingStartedPage } from './GettingStartedPage';
 import { setBaseUrl } from 'office-ui-fabric-react/lib/Utilities';
 import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
+import { ComponentPage } from '@uifabric/example-app-base';
 
 import './index.scss';
 import './ColorStyles.scss';
 
 setBaseUrl('./dist/');
+ComponentPage.defaultProps.areBadgesVisible = true;
 
 let rootElement: HTMLElement | null;
 

From 1a9ecf882c70d48ea9cb71deae3cee62d2569045 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Wed, 20 Sep 2017 11:03:37 -0700
Subject: [PATCH 0677/1641] [comboBox] Fix browser zoom render issue (sub-pixel
 rendering) (#2892)

* Update comboBox styling so that it will render better with browser zoom (e.g. sub-pixel rounding issue)

* rush change

* tweak a bit of the styling
---
 ...omboBoxZoomRenderFix_2017-09-19-22-57.json | 11 +++++++++++
 .../components/ComboBox/ComboBox.styles.ts    | 19 +++++++++++++++----
 2 files changed, 26 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxZoomRenderFix_2017-09-19-22-57.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxZoomRenderFix_2017-09-19-22-57.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxZoomRenderFix_2017-09-19-22-57.json
new file mode 100644
index 0000000000000..01a81dabce145
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxZoomRenderFix_2017-09-19-22-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "[ComboBox] Fix slight rendering bug in browser zoom (around sub-pixel rounding)",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index 92243c0c25c35..2248259b2325e 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -212,11 +212,11 @@ export const getStyles = memoizeFunction((
         marginBottom: '10px',
         marginLeft: '0',
 
-        // padding: '0',
+        // padding: '0 32px 0 12px',
         paddingTop: '0',
         paddingRight: ComboxBoxCaretDownWidth,
         paddingBottom: '0',
-        paddingLeft: '0',
+        paddingLeft: '12px',
 
         color: ComboBoxRootTextColor,
         position: 'relative',
@@ -266,12 +266,23 @@ export const getStyles = memoizeFunction((
     input: {
       boxSizing: 'border-box',
       width: '100%',
-      height: '100%',
+      height: '30px',
       borderStyle: 'none',
       outline: 'none',
       font: 'inherit',
       textOverflow: 'ellipsis',
-      paddingLeft: '12px'
+
+      // padding: '0',
+      paddingTop: '0',
+      paddingRight: '0',
+      paddingBottom: '0',
+      paddingLeft: '0',
+
+      // margin: '1px 0px',
+      marginTop: '1px',
+      marginRight: '0px',
+      marginBottom: '1px',
+      marginLeft: '0px',
     },
     inputDisabled: getDisabledStyles(theme),
     errorMessage: {

From 9a6bc7202173c5322242247c0c0b052f437e7bb2 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 20 Sep 2017 11:15:02 -0700
Subject: [PATCH 0678/1641] Update BESTPRACTICES.md (#2895)

---
 ghdocs/BESTPRACTICES.md | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/ghdocs/BESTPRACTICES.md b/ghdocs/BESTPRACTICES.md
index 2d3d873343e49..351d8e0451747 100644
--- a/ghdocs/BESTPRACTICES.md
+++ b/ghdocs/BESTPRACTICES.md
@@ -96,11 +96,12 @@ controlling the disabled state of the input element.)
 ### Event callbacks
 
 Event callbacks should be prefixed with `on`. If it is necessary to target a subject, the subject should be in between `on` and the event
-name.
+name. Always use present tense verbs instead of past tense.
 
 |BAD|GOOD|Notes|
 |---|----|-----|
 |mouseClick|onClick|
+|onClicked|onClick|
 |inputClick, onClickInput|onInputClick|
 
 

From 726494444365d178707d5605e9f6b63e099a0ff2 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Wed, 20 Sep 2017 11:52:52 -0700
Subject: [PATCH 0679/1641] Removed Trello reference from Get Started page on
 website - regression (#2898)

* Re-removed trello reference in favor of github reference

* Added change file
---
 .../src/pages/GetStarted/GetStartedPage.tsx           |  2 +-
 .../trello-regression_2017-09-20-18-17.json           | 11 +++++++++++
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/fabric-website/trello-regression_2017-09-20-18-17.json

diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
index 2ea0b5d2f889c..0dda0ea4fa43e 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
@@ -179,7 +179,7 @@ ReactDOM.render(<MyPage />, document.body.firstChild);`
           <p>You can <a href='https://github.com/OfficeDev/office-ui-fabric-core/releases'>download a copy of Fabric for your project</a> or <a href='https://github.com/OfficeDev/office-ui-fabric-core/blob/master/ghdocs/PACKAGES.md'>add it through a package manager</a>. You can also <a href='https://github.com/OfficeDev/office-ui-fabric-core/blob/master/ghdocs/BUILDING.md'>build your own copy from the source code</a>.</p>
 
           <h3>Need an icon or feature Fabric Core doesn&rsquo;t have?</h3>
-          <p>Check the <a href='https://trello.com/b/sPTXiMzG/office-ui-fabric-core-requests'>Fabric Core Trello board</a> and vote up the request so we can track it. If you don&rsquo;t see an existing card, please <a href='https://github.com/OfficeDev/office-ui-fabric-core/issues'>file an issue in the repository</a> and we&rsquo;ll add the card for you.</p>
+          <p>First, check the <a href='https://github.com/OfficeDev/office-ui-fabric-react/issues'>Fabric React issue queue</a> or <a href='https://github.com/OfficeDev/office-ui-fabric-react/projects'>projects</a> to see if your component has already been requested or is being worked on. If you don't see an existing issue or project for the component you're looking for, please <a href='https://github.com/OfficeDev/office-ui-fabric-react/issues'>file an issue in the repo</a>, and we'll respond if it's being built or on our radar.</p>
         </div>
 
         <p>Usage of Fabric assets, such as fonts and icons, is subject to the <a href='https://static2.sharepointonline.com/files/fabric/assets/license.txt'>assets license agreement</a>.</p>
diff --git a/common/changes/@uifabric/fabric-website/trello-regression_2017-09-20-18-17.json b/common/changes/@uifabric/fabric-website/trello-regression_2017-09-20-18-17.json
new file mode 100644
index 0000000000000..354292ae34220
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/trello-regression_2017-09-20-18-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Removed trello reference from the Get Stated page.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From df65d1d5a44b0058256079c99cb7783233cdfedc Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Wed, 20 Sep 2017 12:17:31 -0700
Subject: [PATCH 0680/1641] Visual bug fixes related to UHF for website (#2889)

* Fixed page header position + home page link colors

* Extended angles to fit new page width

* Added change file

* Fixed header width during scroll + added variables

* Added a class to stop uhf from overriding our link styles

* Updated trademark class

* Added mixins for padding - and moved to media tag

* Reverted to recently updated commit for high-contrst mode

* Deleted rogue spaces
---
 .../src/components/App/App.scss               | 20 +++++++++----------
 .../PageHeader/PageHeader.module.scss         | 16 ++++++++++++---
 .../src/pages/BlogPage/BlogPage.module.scss   |  2 +-
 .../src/pages/HomePage/HomePage.module.scss   |  8 +++++---
 .../src/pages/HomePage/HomePage.tsx           | 10 +++++-----
 .../ResourcesPage/ResourcesPage.module.scss   |  2 +-
 .../fabric-website/src/styles/_variables.scss |  6 ++++++
 .../visual-bug-fixes_2017-09-18-22-20.json    | 11 ++++++++++
 8 files changed, 52 insertions(+), 23 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/visual-bug-fixes_2017-09-18-22-20.json

diff --git a/apps/fabric-website/src/components/App/App.scss b/apps/fabric-website/src/components/App/App.scss
index 0faada3ca8a21..68dba7bef333a 100644
--- a/apps/fabric-website/src/components/App/App.scss
+++ b/apps/fabric-website/src/components/App/App.scss
@@ -2,13 +2,6 @@
 @import '../../styles/mixins';
 
 :global {
-  .App {
-    background-color: $ms-color-neutralDark;
-    justify-content: center;
-    padding-left: 5%; // % matches UHF breakpoint sizes
-    padding-right: 5%; // % matches UHF breakpoint sizes
-  }
-
   // Element that wraps everything except for the header
   .App-wrapper {
     display: flex;
@@ -73,6 +66,13 @@
 
   // Show the nav at all times, to the left of the content
   @media screen and (min-width: $uhf-screen-min-mobile) {
+    .App {
+      background-color: $ms-color-neutralDark;
+      justify-content: center;
+      @include ms-padding-right($App-padding-right-lg);
+      @include ms-padding-left($App-padding-left-lg);
+    }
+
     .App-wrapper {
       flex-direction: row;
     }
@@ -104,8 +104,8 @@
 
   @media only screen and (max-width: $uhf-screen-max-lg) and (min-width: $uhf-screen-min-mobile) {
     .App {
-      @include ms-padding-right(24px);
-      @include ms-padding-left(6px);
+      @include ms-padding-right($App-padding-right-sm);
+      @include ms-padding-left($App-padding-left-sm);
     }
 
     .App-nav {
@@ -118,4 +118,4 @@
   .App {
     padding: 0;
   }
-}
\ No newline at end of file
+}
diff --git a/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss b/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss
index 92bd9bb17fd2c..5a99ccf1b3585 100644
--- a/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss
+++ b/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss
@@ -47,8 +47,8 @@
         box-shadow: 0 10px 30px -10px rgba(0,0,0,.2);
         max-width: $App-maximumWidth - $Nav-width;
         position: fixed;
-        top: $Header-height;
-        width: 100%;
+        top: 0;
+        width: calc(100% - #{$Nav-width} - #{$App-padding-left-lg} - #{$App-padding-right-lg});
         z-index: $ms-zIndex-1;
         height: $PageHeader-attachedTitleHeight + $PageHeader-navHeight;
 
@@ -121,7 +121,17 @@
   // The mobile nav is no longer present, so the attached page header is higher up
   .pageHeader.isAttached {
     .content {
-      top: $Header-height;
+      top: 0;
+    }
+  }
+}
+
+@media only screen and (max-width: $uhf-screen-max-lg) and (min-width: $uhf-screen-min-mobile) {
+  .pageHeader {
+    &.isAttached {
+      .content {
+        width: calc(100% - #{$Nav-width} - #{$App-padding-right-sm} - #{$App-padding-left-sm} - 13px);
+      }
     }
   }
 }
\ No newline at end of file
diff --git a/apps/fabric-website/src/pages/BlogPage/BlogPage.module.scss b/apps/fabric-website/src/pages/BlogPage/BlogPage.module.scss
index 706b5d65d2791..40c7f892013e2 100644
--- a/apps/fabric-website/src/pages/BlogPage/BlogPage.module.scss
+++ b/apps/fabric-website/src/pages/BlogPage/BlogPage.module.scss
@@ -14,6 +14,6 @@
 @media screen and (min-width: $uhf-screen-min-mobile) {
   .angle {
     margin-top: 0; // Move back down to ensure room for in-page nav
-    min-height: 120px;
+    min-height: 148px;
   }
 }
\ No newline at end of file
diff --git a/apps/fabric-website/src/pages/HomePage/HomePage.module.scss b/apps/fabric-website/src/pages/HomePage/HomePage.module.scss
index 4fe833178f50c..12143cd569dff 100644
--- a/apps/fabric-website/src/pages/HomePage/HomePage.module.scss
+++ b/apps/fabric-website/src/pages/HomePage/HomePage.module.scss
@@ -112,7 +112,8 @@
     margin-bottom: 12px;
   }
 
-  a {
+  a,
+  .uhfLinkOverride {
     color: $color-home-lighter;
     font-size: $ms-font-size-m;
     transition: color $ms-animation-duration-2 $ms-animation-ease-1;
@@ -204,7 +205,7 @@
 .productDescription {
   font-size: $ms-font-size-l;
 
-  a, a:visited {
+  a, a:visited, .uhfLinkOverride {
     color: $color-home-medium;
     transition: color $ms-animation-duration-2 $ms-animation-ease-1;
   }
@@ -316,7 +317,8 @@
   margin-top: 32px;
 
   a,
-  a:visited {
+  a:visited,
+  .uhfLinkOverride {
     color: $color-home-lighter;
   }
 }
diff --git a/apps/fabric-website/src/pages/HomePage/HomePage.tsx b/apps/fabric-website/src/pages/HomePage/HomePage.tsx
index ac39ba5775e9a..6d02adadada67 100644
--- a/apps/fabric-website/src/pages/HomePage/HomePage.tsx
+++ b/apps/fabric-website/src/pages/HomePage/HomePage.tsx
@@ -27,19 +27,19 @@ export class HomePage extends React.Component<any, any> {
           <div className={ styles.flavor }>
             <span className={ styles.flavorTitle }>AngularJS</span>
             <span className={ styles.flavorDescription }>Community-driven project for Angular apps</span>
-            <a href='#/angular-js'>Learn more</a>
+            <a className={ styles.uhfLinkOverride } href='#/angular-js'>Learn more</a>
           </div>
           <div className={ styles.flavor }>
             <span className={ styles.flavorTitle }>Fabric iOS</span>
             <span className={ styles.flavorDescription }>Native iOS styling and components written in Swift</span>
-            <a href='#/fabric-ios'>Learn more</a>
+            <a className={ styles.uhfLinkOverride } href='#/fabric-ios'>Learn more</a>
           </div>
         </div>
 
         <div className={ css(styles.product, styles.productSharepoint) }>
           <div>
             <span className={ styles.productTitle }>SharePoint</span>
-            <span className={ styles.productDescription }>New SharePoint experiences are built with Fabric and the SharePoint Framework comes with it baked in to make things simple. <a href='https://dev.office.com/sharepoint/docs/spfx/web-parts/get-started/use-fabric-react-components'>Learn more</a></span>
+            <span className={ styles.productDescription }>New SharePoint experiences are built with Fabric and the SharePoint Framework comes with it baked in to make things simple. <a className={ styles.uhfLinkOverride } href='https://dev.office.com/sharepoint/docs/spfx/web-parts/get-started/use-fabric-react-components'>Learn more</a></span>
           </div>
           <img className={ styles.productImage } src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/home-sharepoint.svg' } width='496' height='300' alt='Illustrated representation of the sharepoint page.' />
         </div>
@@ -47,7 +47,7 @@ export class HomePage extends React.Component<any, any> {
         <div className={ css(styles.product, styles.productAddins) }>
           <div>
             <span className={ styles.productTitle }>Office Add-ins</span>
-            <span className={ styles.productDescription }>Fabric is the official UX design framework for Office Add-ins. With Fabric, add-ins blend seamlessly with Word, Excel, PowerPoint, and Outlook. <a href='http://dev.office.com/docs/add-ins/design/add-in-design'>Learn more</a></span>
+            <span className={ styles.productDescription }>Fabric is the official UX design framework for Office Add-ins. With Fabric, add-ins blend seamlessly with Word, Excel, PowerPoint, and Outlook. <a className={ styles.uhfLinkOverride } href='http://dev.office.com/docs/add-ins/design/add-in-design'>Learn more</a></span>
           </div>
           <img className={ styles.productImage } src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/home-addins.svg' } width='496' height='300' alt='Illustrated representation of an office add-in.' />
         </div>
@@ -81,7 +81,7 @@ export class HomePage extends React.Component<any, any> {
               </a>
             </li>
           </ul>
-          <span className={ styles.trademark }>All trademarks are the property of their respective owners. Usage of Fabric assets, such as fonts and icons, is subject to the <a href='https://static2.sharepointonline.com/files/fabric/assets/license.txt'>assets license agreement</a>.</span>
+          <span className={ styles.trademark }>All trademarks are the property of their respective owners. Usage of Fabric assets, such as fonts and icons, is subject to the <a className={ styles.uhfLinkOverride } href='https://static2.sharepointonline.com/files/fabric/assets/license.txt'>assets license agreement</a>.</span>
         </div>
       </div>
     );
diff --git a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss
index edf175f5b79fc..a1b3728a88d1f 100644
--- a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss
+++ b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss
@@ -95,7 +95,7 @@
 @media screen and (min-width: $uhf-screen-min-mobile) {
   .angle {
     margin-top: 0; // Move back down to ensure room for in-page nav
-    min-height: 120px;
+    min-height: 148px;
   }
 
   .pageTitle {
diff --git a/apps/fabric-website/src/styles/_variables.scss b/apps/fabric-website/src/styles/_variables.scss
index df35bd8fbcccd..236144d5c147e 100644
--- a/apps/fabric-website/src/styles/_variables.scss
+++ b/apps/fabric-website/src/styles/_variables.scss
@@ -41,6 +41,12 @@ $color-blog-lighter: #d1ec3c;
 // Component variables
 $App-maximumWidth: 1600px;
 
+//Padding matches padding at the same UHF breakpoints
+$App-padding-left-lg: 5%;
+$App-padding-right-lg: 5%;
+$App-padding-left-sm: 6px;
+$App-padding-right-sm: 24px;
+
 //SVG
 // With the increase in App-maximumWidth for UHF adoption,
 // this makes sure the "V" in the hero stays visable at different breakpoints
diff --git a/common/changes/@uifabric/fabric-website/visual-bug-fixes_2017-09-18-22-20.json b/common/changes/@uifabric/fabric-website/visual-bug-fixes_2017-09-18-22-20.json
new file mode 100644
index 0000000000000..e306efe3e5f9b
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/visual-bug-fixes_2017-09-18-22-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Visual bug fixes to accommodate UHF",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From 4482809c3554c0147d37cffe8e4fa1e696be0f23 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Wed, 20 Sep 2017 12:27:23 -0700
Subject: [PATCH 0681/1641] Updating website documentation to support Fabric
 Core 7.3.0 (#2890)

* Updated documentation to reference fabric core 7.3.0 instead of 7.2.0

* Added change file

* More documentation updated
---
 .../src/pages/GetStarted/GetStartedPage.tsx           |  2 +-
 apps/fabric-website/src/root.tsx                      |  2 +-
 .../fabric-core-7.3.0_2017-09-19-20-18.json           | 11 +++++++++++
 ghdocs/README.md                                      |  2 +-
 4 files changed, 14 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/fabric-core-7.3.0_2017-09-19-20-18.json

diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
index 0dda0ea4fa43e..48ae49aaf3e38 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
@@ -160,7 +160,7 @@ ReactDOM.render(<MyPage />, document.body.firstChild);`
               <p>Add the following line to the &lt;head&gt; of your webpage:</p>
               <CodeBlock language='html' isLightTheme={ true }>
                 {
-                  `<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/7.2.0/css/fabric.min.css">`
+                  `<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/7.3.0/css/fabric.min.css">`
                 }
               </CodeBlock>
             </li>
diff --git a/apps/fabric-website/src/root.tsx b/apps/fabric-website/src/root.tsx
index c71a4e044411d..ffe22dbece947 100644
--- a/apps/fabric-website/src/root.tsx
+++ b/apps/fabric-website/src/root.tsx
@@ -140,4 +140,4 @@ function addCSSToHeader(fileName: string) {
   headEl.appendChild(linkEl);
 }
 
-addCSSToHeader('https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/7.1.0/css/fabric.min.css');
+addCSSToHeader('https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/7.3.0/css/fabric.min.css');
diff --git a/common/changes/@uifabric/fabric-website/fabric-core-7.3.0_2017-09-19-20-18.json b/common/changes/@uifabric/fabric-website/fabric-core-7.3.0_2017-09-19-20-18.json
new file mode 100644
index 0000000000000..f92d23c027cbf
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/fabric-core-7.3.0_2017-09-19-20-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Updated reference to Fabric Core to the newly released 7.3.0 version.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/ghdocs/README.md b/ghdocs/README.md
index 265018b9cb75a..3b6c30acf5688 100644
--- a/ghdocs/README.md
+++ b/ghdocs/README.md
@@ -124,7 +124,7 @@ You can specify the default direction in your `index.html`. Add the `dir` attrib
 Load Office UI Fabric styles by linking to the Office UI Fabric CDN. Add the following to the `<head`> element:
 
 ```html
-<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/5.0.1/css/fabric.min.css">
+<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/7.3.0/css/fabric.min.css">
 ```
 
 Save the file.

From 1fb8014961e795e420cf615689578b19b19f0f21 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Wed, 20 Sep 2017 15:38:04 -0700
Subject: [PATCH 0682/1641] Adjust Tile and FolderCover alignments and
 behaviors [experiments] (#2880)

* Add minimum and maximum aspect ratios to TilesList

* Fix alignment of SharedSignal

* Enforce minimum size for Tile and FolderCover framed content

* Update Tile examples to showcase frame minimum sizes

* Update change output
---
 .../folder-shared-icon_2017-09-19-00-38.json  | 11 ++++
 .../components/FolderCover/FolderCover.scss   |  8 ++-
 .../experiments/src/components/Tile/Tile.scss |  7 ++-
 .../Tile/examples/Tile.Document.Example.tsx   | 14 ++++++
 .../Tile/examples/Tile.Folder.Example.tsx     | 50 +++++++++++++++----
 .../Tile/examples/Tile.Media.Example.tsx      | 25 +++++++++-
 .../components/TilesList/TilesList.Props.ts   | 17 ++++---
 .../src/components/TilesList/TilesList.tsx    | 14 +++++-
 .../src/components/signals/Signals.scss       |  2 +-
 9 files changed, 126 insertions(+), 22 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/folder-shared-icon_2017-09-19-00-38.json

diff --git a/common/changes/@uifabric/experiments/folder-shared-icon_2017-09-19-00-38.json b/common/changes/@uifabric/experiments/folder-shared-icon_2017-09-19-00-38.json
new file mode 100644
index 0000000000000..87942dd87cd18
--- /dev/null
+++ b/common/changes/@uifabric/experiments/folder-shared-icon_2017-09-19-00-38.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Adjust Tile and FolderCover alignments and behaviors",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "tmichon@microsoft.com"
+}
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.scss b/packages/experiments/src/components/FolderCover/FolderCover.scss
index 1d4af68f0eb72..c19ea5e0c0ec0 100644
--- a/packages/experiments/src/components/FolderCover/FolderCover.scss
+++ b/packages/experiments/src/components/FolderCover/FolderCover.scss
@@ -64,12 +64,18 @@
 }
 
 .frame {
-  display: inline-block;
+  display: inline-flex;
   position: relative;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
   overflow: hidden;
   max-width: 100%;
   max-height: 100%;
   box-shadow: 0 1px 3px 2px rgba(1, 1, 0, 0.2);
+  background-color: $ms-color-white;
+  min-width: 32px;
+  min-height: 32px;
 }
 
 .metadata {
diff --git a/packages/experiments/src/components/Tile/Tile.scss b/packages/experiments/src/components/Tile/Tile.scss
index f29a338072e02..a0b05e30d726a 100644
--- a/packages/experiments/src/components/Tile/Tile.scss
+++ b/packages/experiments/src/components/Tile/Tile.scss
@@ -103,11 +103,14 @@
 }
 
 .foreground {
-  display: inline-block;
+  display: inline-flex;
   position: relative;
   overflow: hidden;
   max-width: 100%;
   max-height: 100%;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
   opacity: 1;
   transition: opacity 0.2s linear;
 
@@ -118,6 +121,8 @@
   .hasForegroundFrame & {
     background-color: $ms-color-white;
     box-shadow: 0 1px 3px 1px rgba(1, 1, 0, 0.05);
+    min-width: 32px;
+    min-height: 32px;
 
     &:after {
       content: '';
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
index c7230a9d59cd3..8102ee1625ae5 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
@@ -30,6 +30,10 @@ const ITEMS: { name: string; activity: string; }[] = [
     name: lorem(2),
     activity: lorem(6),
   },
+  {
+    name: lorem(2),
+    activity: lorem(6),
+  },
   {
     name: lorem(2),
     activity: lorem(6),
@@ -160,6 +164,16 @@ export class TileDocumentExample extends React.Component<{}, ITileDocumentExampl
           showForeground={ imagesLoaded }
           item={ ITEMS[2] }
         />
+        <DocumentTileWithThumbnail
+          originalImageSize={
+            {
+              width: 16,
+              height: 16
+            }
+          }
+          showForeground={ imagesLoaded }
+          item={ ITEMS[3] }
+        />
         <h3>Document icon</h3>
         <div className={ css(TileExampleStyles.tile, TileExampleStyles.largeTile) }>
           <Tile
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
index 73d582fcf6e6f..ab69c10db86b1 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
@@ -6,7 +6,8 @@ import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import {
   SignalField,
   NewSignal,
-  CommentsSignal
+  CommentsSignal,
+  SharedSignal
 } from '../../signals/Signals';
 import { FolderCover, getFolderCoverLayout, renderFolderCoverWithLayout } from '../../FolderCover/FolderCover';
 import { FolderCoverType } from '../../FolderCover/FolderCover.Props';
@@ -17,24 +18,37 @@ import * as TileExampleStylesModule from './Tile.Example.scss';
 // tslint:disable-next-line:no-any
 const TileExampleStyles = TileExampleStylesModule as any;
 
-const ITEMS: { name: string; activity: string; }[] = [
+const ITEMS: { name: string; activity: string; isShared?: boolean; childCount?: number; }[] = [
   {
     name: lorem(2),
     activity: lorem(6),
+    childCount: 4
+  },
+  {
+    name: lorem(2),
+    activity: lorem(6)
+  },
+  {
+    name: lorem(2),
+    activity: lorem(6),
+    isShared: true,
+    childCount: 4
   },
   {
     name: lorem(2),
     activity: lorem(6),
+    childCount: 4
   },
   {
     name: lorem(2),
     activity: lorem(6),
+    childCount: 4
   }
 ];
 
 interface IFolderTileWithThumbnailProps {
   folderCoverType?: FolderCoverType;
-  originalImageSize: ISize;
+  originalImageSize?: ISize;
   size: 'small' | 'large';
   item: typeof ITEMS[0];
 }
@@ -45,6 +59,8 @@ const FolderTileWithThumbnail: React.StatelessComponent<IFolderTileWithThumbnail
       <FolderCover
         folderCoverSize={ props.size }
         folderCoverType={ props.folderCoverType }
+        metadata={ props.item.childCount }
+        signal={ props.item.isShared ? <SharedSignal /> : null }
       />
     );
 
@@ -52,11 +68,11 @@ const FolderTileWithThumbnail: React.StatelessComponent<IFolderTileWithThumbnail
       contentSize
     } = getFolderCoverLayout(folderCover);
 
-    const imageSize = fitContentToBounds({
+    const imageSize = props.originalImageSize ? fitContentToBounds({
       contentSize: props.originalImageSize,
       boundsSize: contentSize,
       mode: 'contain'
-    });
+    }) : undefined;
 
     return (
       <div
@@ -89,12 +105,12 @@ const FolderTileWithThumbnail: React.StatelessComponent<IFolderTileWithThumbnail
             <span className={ css(TileExampleStylesModule.tileFolder) }>
               {
                 renderFolderCoverWithLayout(folderCover, {
-                  children: (
+                  children: imageSize ? (
                     <img
                       src={ `//placehold.it/${Math.round(imageSize.width)}x${Math.round(imageSize.height)}` }
                       className={ css(TileExampleStyles.tileImage) }
                     />
-                  )
+                  ) : null
                 })
               }
             </span>
@@ -140,6 +156,11 @@ export class TileFolderExample extends React.Component<{}, ITileFolderExampleSta
           item={ ITEMS[0] }
           size={ size }
         />
+        <FolderTileWithThumbnail
+          item={ ITEMS[1] }
+          folderCoverType='media'
+          size={ size }
+        />
         <FolderTileWithThumbnail
           originalImageSize={
             {
@@ -147,7 +168,7 @@ export class TileFolderExample extends React.Component<{}, ITileFolderExampleSta
               height: 400
             }
           }
-          item={ ITEMS[1] }
+          item={ ITEMS[2] }
           folderCoverType='media'
           size={ size }
         />
@@ -158,7 +179,18 @@ export class TileFolderExample extends React.Component<{}, ITileFolderExampleSta
               height: 40
             }
           }
-          item={ ITEMS[2] }
+          item={ ITEMS[3] }
+          folderCoverType='media'
+          size={ size }
+        />
+        <FolderTileWithThumbnail
+          originalImageSize={
+            {
+              width: 16,
+              height: 16
+            }
+          }
+          item={ ITEMS[4] }
           folderCoverType='media'
           size={ size }
         />
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
index e82dfd331eb47..62ae165b8b2bd 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
@@ -24,6 +24,10 @@ const ITEMS: { name: string; activity: string; }[] = [
     name: lorem(2),
     activity: lorem(6),
   },
+  {
+    name: lorem(2),
+    activity: lorem(6),
+  },
   {
     name: lorem(2),
     activity: lorem(6),
@@ -164,6 +168,23 @@ export class TileMediaExample extends React.Component<{}, ITileMediaExampleState
           }
           showBackground={ imagesLoaded }
         />
+        <h3>Small Image</h3>
+        <ImageTile
+          tileSize={
+            {
+              width: 200,
+              height: 200
+            }
+          }
+          item={ ITEMS[2] }
+          originalImageSize={
+            {
+              width: 16,
+              height: 16
+            }
+          }
+          showBackground={ imagesLoaded }
+        />
         <h3>No preview</h3>
         <div className={ css(TileExampleStyles.tile, TileExampleStyles.largeTile) }>
           <Tile
@@ -173,7 +194,7 @@ export class TileMediaExample extends React.Component<{}, ITileMediaExampleState
                   <NewSignal />
                 }
               >
-                { ITEMS[2].name }
+                { ITEMS[3].name }
               </SignalField>
             }
             itemActivity={
@@ -186,7 +207,7 @@ export class TileMediaExample extends React.Component<{}, ITileMediaExampleState
                     ]
                   }
                 >
-                  { ITEMS[2].name }
+                  { ITEMS[3].name }
                 </SignalField>
               )
             }
diff --git a/packages/experiments/src/components/TilesList/TilesList.Props.ts b/packages/experiments/src/components/TilesList/TilesList.Props.ts
index ae414e2e30881..622e5e032ae27 100644
--- a/packages/experiments/src/components/TilesList/TilesList.Props.ts
+++ b/packages/experiments/src/components/TilesList/TilesList.Props.ts
@@ -1,6 +1,6 @@
 
 import * as React from 'react';
-import { IBaseProps } from 'office-ui-fabric-react/lib/Utilities';
+import { IBaseProps, ISize } from 'office-ui-fabric-react/lib/Utilities';
 import { TilesList } from './TilesList';
 import { IFocusZone } from 'office-ui-fabric-react/lib/FocusZone';
 
@@ -23,7 +23,7 @@ export interface ITilesGridItem<TItem> {
    * Invoked to render the virtual DOM for the item.
    * This content will be rendered inside the cell allocated for the item.
    */
-  onRender: (content: TItem, finalSize?: ITileSize) => (React.ReactNode | React.ReactNode[]);
+  onRender: (content: TItem, finalSize?: ISize) => (React.ReactNode | React.ReactNode[]);
 }
 
 export const enum TilesGridMode {
@@ -76,12 +76,17 @@ export interface ITilesGridSegment<TItem> {
    * The bottom margin for the grid.
    */
   marginBottom?: number;
+  /**
+   * The minimum aspect ratio for an item in the grid.
+   */
+  minAspectRatio?: number;
+  /**
+   * The maximum aspect ratio for an item in the grid.
+   */
+  maxAspectRatio?: number;
 }
 
-export interface ITileSize {
-  width: number;
-  height: number;
-}
+export { ISize as ITileSize };
 
 export interface ITilesListProps<TItem> extends IBaseProps, React.Props<TilesList<TItem>>, React.HTMLAttributes<HTMLDivElement> {
   /**
diff --git a/packages/experiments/src/components/TilesList/TilesList.tsx b/packages/experiments/src/components/TilesList/TilesList.tsx
index a3f3edc9009ab..cdc5dc9b683e6 100644
--- a/packages/experiments/src/components/TilesList/TilesList.tsx
+++ b/packages/experiments/src/components/TilesList/TilesList.tsx
@@ -11,6 +11,8 @@ const TilesListStyles: any = TilesListStylesModule;
 
 const MAX_TILE_STRETCH = 1.5;
 const CELLS_PER_PAGE = 100;
+const MIN_ASPECT_RATIO = 0.5;
+const MAX_ASPECT_RATIO = 3;
 
 export interface ITilesListState<TItem> {
   cells: ITileCell<TItem>[];
@@ -469,7 +471,9 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
           spacing = 0,
           maxScaleFactor = MAX_TILE_STRETCH,
           marginBottom = 0,
-          marginTop = 0
+          marginTop = 0,
+          minAspectRatio = MIN_ASPECT_RATIO,
+          maxAspectRatio = MAX_ASPECT_RATIO
         } = item;
 
         const grid: ITileGrid = {
@@ -487,8 +491,14 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
             desiredSize
           } = gridItem;
 
+          const aspectRatio = Math.min(
+            maxAspectRatio,
+            Math.max(
+              minAspectRatio,
+              desiredSize && (desiredSize.width / desiredSize.height) || 1));
+
           cells.push({
-            aspectRatio: desiredSize && (desiredSize.width / desiredSize.height) || 1,
+            aspectRatio: aspectRatio,
             content: gridItem.content,
             onRender: gridItem.onRender,
             grid: grid,
diff --git a/packages/experiments/src/components/signals/Signals.scss b/packages/experiments/src/components/signals/Signals.scss
index 94a35b20183e3..1520f2b5eeee1 100644
--- a/packages/experiments/src/components/signals/Signals.scss
+++ b/packages/experiments/src/components/signals/Signals.scss
@@ -69,7 +69,7 @@
 
 .shared {
   color: $ms-color-neutralSecondary;
-  top: 1px;
+  top: 0.1em;
 }
 
 .missingMetadata {

From ee4a6d9178952be0f2e94f500738ef22fec48074 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Wed, 20 Sep 2017 16:09:52 -0700
Subject: [PATCH 0683/1641] Implement alwaysShowCheck behavior for Check
 component (#2907)

* Support alwaysShowCheck behavior in Check control

* Set alwaysShowCheck in DetailsRow

* Set alwaysShowCheck in Tile

* Make alwaysShowCheck the default for Check

* Update change output
---
 .../check-hover_2017-09-20-22-53.json            | 11 +++++++++++
 .../check-hover_2017-09-20-22-53.json            | 11 +++++++++++
 .../experiments/src/components/Tile/Tile.tsx     |  4 +++-
 .../src/components/Check/Check.scss              | 14 ++++++++++++++
 .../src/components/Check/Check.tsx               |  4 +++-
 .../components/DetailsList/DetailsRowCheck.tsx   | 16 ++++++++++++----
 6 files changed, 54 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/check-hover_2017-09-20-22-53.json
 create mode 100644 common/changes/office-ui-fabric-react/check-hover_2017-09-20-22-53.json

diff --git a/common/changes/@uifabric/experiments/check-hover_2017-09-20-22-53.json b/common/changes/@uifabric/experiments/check-hover_2017-09-20-22-53.json
new file mode 100644
index 0000000000000..2d0e96244f87a
--- /dev/null
+++ b/common/changes/@uifabric/experiments/check-hover_2017-09-20-22-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Consume Check hover behavior in Tile",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/check-hover_2017-09-20-22-53.json b/common/changes/office-ui-fabric-react/check-hover_2017-09-20-22-53.json
new file mode 100644
index 0000000000000..550e17b9f9fb7
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/check-hover_2017-09-20-22-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Implement hover and focus trigger behavior for Check component",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Tile/Tile.tsx b/packages/experiments/src/components/Tile/Tile.tsx
index 0223e4714307b..74a35ed92eed9 100644
--- a/packages/experiments/src/components/Tile/Tile.tsx
+++ b/packages/experiments/src/components/Tile/Tile.tsx
@@ -7,10 +7,12 @@ import { css, BaseComponent, autobind, getId } from 'office-ui-fabric-react/lib/
 import { ISize } from '@uifabric/utilities';
 import * as TileStylesModule from './Tile.scss';
 import * as SignalStylesModule from '../signals/Signals.scss';
+import * as CheckStylesModule from 'office-ui-fabric-react/lib/components/Check/Check.scss';
 
 // tslint:disable:no-any
 const TileStyles: any = TileStylesModule;
 const SignalStyles: any = SignalStylesModule;
+const CheckStyles: any = CheckStylesModule;
 // tslint:enable:no-any
 
 const enum TileLayoutValues {
@@ -332,7 +334,7 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
     return (
       <button
         aria-label={ this.props.toggleSelectionAriaLabel }
-        className={ css('ms-Tile-check', TileStyles.check) }
+        className={ css('ms-Tile-check', TileStyles.check, CheckStyles.checkHost) }
         data-selection-toggle={ true }
         role='checkbox'
         aria-checked={ isSelected }
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.scss b/packages/office-ui-fabric-react/src/components/Check/Check.scss
index d9f438ba48399..bcc1db967f2c0 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.scss
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.scss
@@ -34,6 +34,20 @@ $checkBoxHeight: 18px;
     background: $ms-color-themePrimary;
     opacity: 1;
   }
+
+  .check {
+    opacity: 0;
+  }
+
+  .checkHost:hover &,
+  .checkHost:focus &,
+  &:hover,
+  &:focus,
+  &.rootIsChecked {
+    .check {
+      opacity: 1;
+    }
+  }
 }
 
 .circle,
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.tsx b/packages/office-ui-fabric-react/src/components/Check/Check.tsx
index 83961f24d8dea..0141ca290999d 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.tsx
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.tsx
@@ -43,7 +43,9 @@ export class Check extends BaseComponent<ICheckProps, {}> {
         className={ css(
           'ms-Check',
           styles.root,
-          isChecked && ('is-checked ' + styles.rootIsChecked)
+          {
+            [`is-checked ${styles.rootIsChecked}`]: isChecked
+          }
         ) }
       >
         { Icon({
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx
index bef39a9761ee4..5642e3de56d6b 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx
@@ -3,7 +3,12 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import { css } from '../../Utilities';
 import { Check } from '../../Check';
-import * as styles from './DetailsRowCheck.scss';
+import * as DetailsRowCheckStyles from './DetailsRowCheck.scss';
+import * as CheckStylesModule from '../Check/Check.scss';
+
+// tslint:disable:no-any
+const CheckStyles: any = CheckStylesModule;
+// tslint:enable:no-any
 
 export interface IDetailsRowCheckProps extends React.HTMLAttributes<HTMLElement> {
   selected?: boolean;
@@ -33,15 +38,18 @@ export const DetailsRowCheck = (props: IDetailsRowCheckProps) => {
       role='checkbox'
       className={ css(
         'ms-DetailsRow-check',
-        styles.check,
-        !props.canSelect && styles.isDisabled,
+        DetailsRowCheckStyles.check,
+        CheckStyles.checkHost,
+        !props.canSelect && DetailsRowCheckStyles.isDisabled,
         !props.canSelect && 'ms-DetailsRow-check--isDisabled'
       ) }
       aria-checked={ isPressed }
       data-selection-toggle={ true }
       data-automationid='DetailsRowCheck'
     >
-      <Check checked={ isPressed } />
+      <Check
+        checked={ isPressed }
+      />
     </button>
   );
 };

From faef37358c373a6848b8eab6ef4e3df05b5e9697 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Wed, 20 Sep 2017 16:19:24 -0700
Subject: [PATCH 0684/1641] Added section in ResourcesPage for XD Toolkits and
 Assets, including references on other pages, for website (#2903)

* Added references to XD Toolkit around website

* Internal toolkit and font links added to ResourcesPage

* Added links to license pdf, fonts, and toolkit

* Updated links

* Links to lowercase

* Added change file

* Reduced margin bottom per design request
---
 apps/fabric-website/README.md                 |  2 +-
 .../GetStarted/GetStartedPage.module.scss     | 35 ++++++--
 .../src/pages/GetStarted/GetStartedPage.tsx   | 17 +++-
 .../src/pages/HomePage/HomePage.module.scss   | 12 ++-
 .../src/pages/HomePage/HomePage.tsx           |  4 +-
 .../src/pages/Overviews/ComponentsPage.tsx    |  3 +
 .../src/pages/Overviews/Overviews.module.scss | 11 ++-
 .../src/pages/Overviews/StylesPage.tsx        |  3 +
 .../ResourcesPage/ResourcesPage.module.scss   | 17 ++--
 .../src/pages/ResourcesPage/ResourcesPage.tsx | 79 +++++++++++++------
 .../BrandIconsPage/BrandIconsPage.module.scss |  2 +-
 .../Styles/BrandIconsPage/BrandIconsPage.tsx  |  2 +-
 .../fabric-website/src/styles/_variables.scss |  4 +
 .../xd-toolkits-v2_2017-09-20-21-12.json      | 11 +++
 14 files changed, 154 insertions(+), 48 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/xd-toolkits-v2_2017-09-20-21-12.json

diff --git a/apps/fabric-website/README.md b/apps/fabric-website/README.md
index fec997e67b9d3..90ec8e4526209 100644
--- a/apps/fabric-website/README.md
+++ b/apps/fabric-website/README.md
@@ -19,7 +19,7 @@ Before you get started, make sure you have [node.js](https://nodejs.org/), [gulp
 
 All files on the Office UI Fabric React GitHub repository are subject to the MIT license. Please read the License file at the root of the project.
 
-Usage of the fonts referenced in Office UI Fabric files is subject to the [license](https://spoprod-a.akamaihd.net/files/fabric/assets/license.txt).
+Usage of the fonts referenced in Office UI Fabric files is subject to the [license](https://spoprod-a.akamaihd.net/files/fabric/assets/microsoft_fabric_assets_license_agreement_sept092017.pdf).
 
 - - -
 
diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
index 8a0fe250fba7a..45e23a1c92e83 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
@@ -46,6 +46,14 @@
   @include headerAngles($ms-color-neutralPrimary);
   background-color:$color-getStarted-darker;
   color: $ms-color-neutralLighter;
+
+  a, a:visited {
+    border-bottom: 1px solid $ms-color-neutralLight;
+  }
+
+  a, a:hover, a:active {
+    color: $ms-color-neutralLight;
+  }
 }
 
 .feature {
@@ -60,13 +68,6 @@
     width: 80%;
   }
 
-  .title {
-    font-size: $font-size-big;
-    font-weight: $ms-font-weight-semilight;
-    margin-bottom: 20px;
-    width: 100%;
-  }
-
   .description {
     font-weight: $ms-font-weight-semilight;
     font-size: $ms-font-size-l;
@@ -74,6 +75,25 @@
     color: $ms-color-neutralLight;
     max-width: 100%;
   }
+
+  .contentInGrid {
+    padding-left: $contentInGrid;
+  }
+}
+
+.descriptionLarge {
+  display: block;
+  font-size: $ms-font-size-l;
+  margin-top: $contentMargin-vertical;
+  margin-bottom: $contentMargin-vertical;
+  width: 70%;
+}
+
+.title {
+  font-size: $font-size-big;
+  font-weight: $ms-font-weight-semilight;
+  margin-bottom: $contentMargin-vertical;
+  width: 100%;
 }
 
 @media screen and (max-width: $uhf-screen-max-mobile) {
@@ -88,7 +108,6 @@
   }
 }
 
-
 //== Structure section (diagram)
 
 .structureSection {
diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
index 48ae49aaf3e38..6b4ad320e3fdd 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
@@ -19,6 +19,10 @@ export class GetStartedPage extends React.Component<any, any> {
                 'text': 'Design',
                 'location': 'design'
               },
+              {
+                'text': 'Design Toolkit',
+                'location': 'toolkit'
+              },
               {
                 'text': 'Structure',
                 'location': 'structure'
@@ -41,9 +45,9 @@ export class GetStartedPage extends React.Component<any, any> {
           <div className='ms-Grid ms-Grid--wide'>
             <div className='ms-Grid-row'>
               <div className={ css('ms-Grid-col ms-lg4', styles.feature) }>
-                <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/get-started-styles.svg' } alt='Illustration of Typography and color swatches.' />
-                <div className={ styles.title }>Styles</div>
-                <div className={ styles.description }>Fabric gives you access to Segoe, Microsoft&rsquo;s official typeface, along with the color palette, type ramp, icons, and responsive grid for Office 365.</div>
+                <img className={ styles.contentInGrid } src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/get-started-styles.svg' } alt='Illustration of Typography and color swatches.' />
+                <div className={ css(styles.title, styles.contentInGrid) }>Styles</div>
+                <div className={ css(styles.description, styles.contentInGrid) }>Fabric gives you access to Segoe, Microsoft&rsquo;s official typeface, along with the color palette, type ramp, icons, and responsive grid for Office 365.</div>
               </div>
               <div className={ css('ms-Grid-col ms-lg4', styles.feature) }>
                 <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/get-started-icons.svg' } alt='Illustration of Icons' />
@@ -57,6 +61,11 @@ export class GetStartedPage extends React.Component<any, any> {
               </div>
             </div>
           </div>
+          <div id='toolkit'>
+            <span className={ styles.title }>Design Toolkit</span>
+            <span className={ styles.descriptionLarge }>The toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences.</span>
+            <a href='#/resources'>Learn more</a>
+          </div>
         </div>
 
         <div className={ styles.structureSection } id='structure'>
@@ -182,7 +191,7 @@ ReactDOM.render(<MyPage />, document.body.firstChild);`
           <p>First, check the <a href='https://github.com/OfficeDev/office-ui-fabric-react/issues'>Fabric React issue queue</a> or <a href='https://github.com/OfficeDev/office-ui-fabric-react/projects'>projects</a> to see if your component has already been requested or is being worked on. If you don't see an existing issue or project for the component you're looking for, please <a href='https://github.com/OfficeDev/office-ui-fabric-react/issues'>file an issue in the repo</a>, and we'll respond if it's being built or on our radar.</p>
         </div>
 
-        <p>Usage of Fabric assets, such as fonts and icons, is subject to the <a href='https://static2.sharepointonline.com/files/fabric/assets/license.txt'>assets license agreement</a>.</p>
+        <p>Usage of Fabric assets, such as fonts and icons, is subject to the <a href='https://static2.sharepointonline.com/files/fabric/assets/microsoft_fabric_assets_license_agreement_sept092017.pdf'>assets license agreement</a>.</p>
 
       </div>
     );
diff --git a/apps/fabric-website/src/pages/HomePage/HomePage.module.scss b/apps/fabric-website/src/pages/HomePage/HomePage.module.scss
index 12143cd569dff..1ce2364350707 100644
--- a/apps/fabric-website/src/pages/HomePage/HomePage.module.scss
+++ b/apps/fabric-website/src/pages/HomePage/HomePage.module.scss
@@ -260,6 +260,11 @@
   @include fullHeight();
   @include fullWidth();
   background-color: $ms-color-neutralPrimary;
+
+  a,
+  a:visited {
+    color: $color-home-lighter;
+  }
 }
 
 .featuredTitle,
@@ -279,7 +284,11 @@
   font-size: $ms-font-size-l;
   line-height: 1.5;
   margin-bottom: 28px;
-  max-width: 26em;
+  width: 35%;
+
+  &#toolkitDescription {
+    width: 70%;
+  }
 }
 
 .featureList {
@@ -315,6 +324,7 @@
   display: block;
   font-size: $ms-font-size-s;
   margin-top: 32px;
+  margin-bottom: 80px;
 
   a,
   a:visited,
diff --git a/apps/fabric-website/src/pages/HomePage/HomePage.tsx b/apps/fabric-website/src/pages/HomePage/HomePage.tsx
index 6d02adadada67..5887849cfc14a 100644
--- a/apps/fabric-website/src/pages/HomePage/HomePage.tsx
+++ b/apps/fabric-website/src/pages/HomePage/HomePage.tsx
@@ -81,7 +81,9 @@ export class HomePage extends React.Component<any, any> {
               </a>
             </li>
           </ul>
-          <span className={ styles.trademark }>All trademarks are the property of their respective owners. Usage of Fabric assets, such as fonts and icons, is subject to the <a className={ styles.uhfLinkOverride } href='https://static2.sharepointonline.com/files/fabric/assets/license.txt'>assets license agreement</a>.</span>
+          <span className={ styles.trademark }>All trademarks are the property of their respective owners. Usage of Fabric assets, such as fonts and icons, is subject to the <a className={ styles.uhfLinkOverride } href='https://static2.sharepointonline.com/files/fabric/assets/microsoft_fabric_assets_license_agreement_sept092017.pdf'>assets license agreement</a>.</span>
+          <span className={ styles.featuredTitle }>Design Toolkit</span>
+          <span className={ styles.featuredDescription } id={ styles.toolkitDescription }>The toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences. <a className={ styles.uhfLinkOverride } href='#/resources'>Learn more</a></span>
         </div>
       </div>
     );
diff --git a/apps/fabric-website/src/pages/Overviews/ComponentsPage.tsx b/apps/fabric-website/src/pages/Overviews/ComponentsPage.tsx
index fab9d0a7da145..e5fc0f4363a99 100644
--- a/apps/fabric-website/src/pages/Overviews/ComponentsPage.tsx
+++ b/apps/fabric-website/src/pages/Overviews/ComponentsPage.tsx
@@ -25,6 +25,9 @@ export class ComponentsPage extends React.Component<any, any> {
           <p>After you&rsquo;ve explored the components, <a href='#/get-started'>get started with Fabric React in your project</a>.</p>
           <p>Fabric comes in many flavors so you can choose the one that works for you. Check out <a href='#/angular-js'>ngOfficeUIFabric</a> and <a href='#/fabric-ios'>Fabric iOS</a> to learn more about each option.</p>
           <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/components-header.svg' } width='284' height='388' alt='Illustrated representation of a DatePicker and Persona list control.' />
+          <span className={ styles.title }>Design Toolkit</span>
+          <span className={ styles.descriptionLarge }>The toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences.</span>
+          <a href='#/resources'>Learn more</a>
         </div>
       </div>
     );
diff --git a/apps/fabric-website/src/pages/Overviews/Overviews.module.scss b/apps/fabric-website/src/pages/Overviews/Overviews.module.scss
index 75bfc86f77f72..f511fe1a4e416 100644
--- a/apps/fabric-website/src/pages/Overviews/Overviews.module.scss
+++ b/apps/fabric-website/src/pages/Overviews/Overviews.module.scss
@@ -56,8 +56,8 @@
   display: block;
   font-size: $font-size-big;
   font-weight: $ms-font-weight-semilight;
-  margin-bottom: 8px;
-  margin-top: 24px;
+  margin-bottom: $contentMargin-vertical;
+  margin-top: $titleMargin-vertical;
 }
 
 .description {
@@ -67,6 +67,13 @@
   margin-bottom: 12px;
 }
 
+.descriptionLarge {
+  display: block;
+  font-size: $ms-font-size-m;
+  width: 70%;
+  margin-bottom: $contentMargin-vertical;
+}
+
 .secondary {
   padding-top: 80px;
   width: 50%;
diff --git a/apps/fabric-website/src/pages/Overviews/StylesPage.tsx b/apps/fabric-website/src/pages/Overviews/StylesPage.tsx
index 755bc3a65a7e3..38e7d44dbbc92 100644
--- a/apps/fabric-website/src/pages/Overviews/StylesPage.tsx
+++ b/apps/fabric-website/src/pages/Overviews/StylesPage.tsx
@@ -24,6 +24,9 @@ export class StylesPage extends React.Component<any, any> {
           <p>You can get the core styling with <a href='#/get-started#react'>Fabric React</a> or just <a href='#/get-started#core'>Fabric Core</a> on its own.</p>
           <p>Fabric&rsquo;s components use the core styling. To learn more about the fully-styled controls, check out the <a href='#/components'>components</a> page.</p>
           <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/styles-header.svg' } width='225' height='388' alt='Graphic showing elements of color and type' />
+          <span className={ styles.title }>Design Toolkit</span>
+          <span className={ styles.descriptionLarge }>The toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences.</span>
+          <a href='#/resources'>Learn more</a>
         </div>
       </div>
     );
diff --git a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss
index a1b3728a88d1f..13315b47033e8 100644
--- a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss
+++ b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss
@@ -52,18 +52,23 @@
   font-size: $ms-font-size-m;
   line-height: 1.5;
   display: block;
-  margin-bottom: 20px;
+  margin-bottom: $contentMargin-vertical;
+  margin-top: 5px;
 }
 
 .reachOut {
-  margin-bottom: 40px;
-
   a, a:visited {
-    color: $color-resources-darker
+    color: $color-resources-darker;
+  }
+
+  h2 {
+    margin-bottom: 60px;
   }
 }
 
 .related {
+  margin-bottom: 60px;
+
   h2 {
     color: $ms-color-neutralPrimary;
     font-size: $font-size-bigger;
@@ -82,7 +87,7 @@
       height: 6px;
       @include ms-left(0);
       position: absolute;
-      width: 80%;
+      width: 95%;
     }
   }
 
@@ -105,4 +110,4 @@
   .reachOut {
     margin-bottom: 60px;
   }
-}
\ No newline at end of file
+}
diff --git a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
index 5dcc0d36d1278..e8d5b28003449 100644
--- a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
+++ b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
@@ -13,12 +13,16 @@ export class ResourcesPage extends React.Component<any, any> {
           links={
             [
               {
-                'text': 'Reach out',
-                'location': 'reach-out'
+                'text': 'Design Toolkit & Assets',
+                'location': 'toolkit-assets'
+              },
+              {
+                'text': 'Tutorials & Resources',
+                'location': 'tutorials-resources'
               },
               {
-                'text': 'Learn more',
-                'location': 'learn-more'
+                'text': 'Reach out',
+                'location': 'reach-out'
               }
             ]
           }
@@ -27,38 +31,39 @@ export class ResourcesPage extends React.Component<any, any> {
 
         <div className={ styles.angle } />
 
-        <h2 className={ styles.pageTitle }>We want to hear from you</h2>
-
-        <div id='reach-out' className={ styles.reachOut }>
+        <div id='toolkit-assets' className={ styles.related }>
           <div className='ms-Grid ms-Grid--wide'>
             <div className='ms-Grid-row'>
-              <div className={ css('ms-Grid-col ms-sm-12 ms-lg6', styles.channel) }>
-                <div className={ styles.imageWrapper }>
-                  <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/logo-github.svg' } width='128' height='128' alt='Github logo' />
-                </div>
-                <span className={ styles.title }>GitHub</span>
-                <span className={ styles.description }>We&rsquo;re on GitHub, so you can file issues and contribute to the projects.</span>
-                <a href='https://github.com/OfficeDev?query=office-ui-fabric'>See projects</a>
+              <div className='ms-Grid-col ms-sm12 ms-lg4'>
+                <h2>Design Toolkit &amp; Assets</h2>
               </div>
-              <div className={ css('ms-Grid-col ms-sm-12 ms-lg6', styles.channel) }>
-                <div className={ styles.imageWrapper }>
-                  <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/logo-twitter.svg' } width='128' height='128' alt='Twitter logo' />
-                </div>
-                <span className={ styles.title }>Twitter</span>
-                <span className={ styles.description }>Follow us for the latest news, and tweet us with your questions and suggestions.</span>
-                <a href='https://twitter.com/officeuifabric'>Join the conversation</a>
+              <div className={ css('ms-Grid-col ms-sm12 ms-lg8', styles.description) }>
+                <p>To ensure a consistent look and feel for your project, here's where you can leverage essential elements. This section covers design and UI-related downloads for apps designed and built with Fabric.</p>
+
+                <h3>Design Toolkit</h3>
+                <p>The toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences.</p>
+                <ul>
+                  <li><a href='https://static2.sharepointonline.com/files/fabric/fabric-website/files/officeuifabric.xd'>Adobe XD Toolkit</a></li>
+                  <li><a href='https://microsoft.sharepoint.com/teams/OfficeUIFabric97'>Adobe XD Toolkit (Microsoft employees)</a></li>
+                </ul>
+
+                <h3>Fonts</h3>
+                <ul>
+                  <li><a href='https://static2.sharepointonline.com/files/fabric/fabric-website/files/segoeui_fabricmdl2_icon_fonts.zip'>Segoe UI and Fabric MDL2 icon font</a></li>
+                  <li><a href='https://microsoft.sharepoint.com/teams/OfficeUIFabric97/SitePages/Fabric%20MDL2%20Icons.aspx'>Segoe UI and Fabric MDL2 icon font (Microsoft employees)</a></li>
+                </ul>
               </div>
             </div>
           </div>
         </div>
 
-        <div id='learn-more' className={ styles.related }>
+        <div id='tutorials-resources' className={ styles.related }>
           <div className='ms-Grid ms-Grid--wide'>
             <div className='ms-Grid-row'>
               <div className='ms-Grid-col ms-sm12 ms-lg4'>
                 <h2>Learn more with tutorials and resources</h2>
               </div>
-              <div className='ms-Grid-col ms-sm12 ms-lg8'>
+              <div className={ css('ms-Grid-col ms-sm12 ms-lg8', styles.description) }>
                 <p>Use the tutorials and additional resources on this page to learn how to get Fabric running in your projects.</p>
 
                 <h3>Tutorials</h3>
@@ -84,6 +89,34 @@ export class ResourcesPage extends React.Component<any, any> {
           </div>
         </div>
 
+        <div id='reach-out' className={ css(styles.related, styles.reachOut) }>
+          <div className='ms-Grid ms-Grid--wide'>
+            <div className='ms-Grid-row'>
+              <div className='ms-Grid-col ms-sm12 ms-lg4'>
+                <h2>We want to hear from you</h2>
+              </div>
+            </div>
+            <div className='ms-Grid-row'>
+              <div className={ css('ms-Grid-col ms-sm-12 ms-lg6', styles.channel) }>
+                <div className={ styles.imageWrapper }>
+                  <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/logo-github.svg' } width='128' height='128' alt='Github logo' />
+                </div>
+                <span className={ styles.title }>GitHub</span>
+                <span className={ styles.description }>We&rsquo;re on GitHub, so you can file issues and contribute to the projects.</span>
+                <a href='https://github.com/OfficeDev?query=office-ui-fabric'>See projects</a>
+              </div>
+              <div className={ css('ms-Grid-col ms-sm-12 ms-lg6', styles.channel) }>
+                <div className={ styles.imageWrapper }>
+                  <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/logo-twitter.svg' } width='128' height='128' alt='Twitter logo' />
+                </div>
+                <span className={ styles.title }>Twitter</span>
+                <span className={ styles.description }>Follow us for the latest news, and tweet us with your questions and suggestions.</span>
+                <a href='https://twitter.com/officeuifabric'>Join the conversation</a>
+              </div>
+            </div>
+          </div>
+        </div>
+
       </div>
     );
   }
diff --git a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss
index 325b394f4d892..d3374738f4704 100644
--- a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss
+++ b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss
@@ -1,7 +1,7 @@
 @import '../../../styles/variables';
 
 .paragraphInGrid {
-    padding-left: 12px;
+    padding-left: $contentInGrid;
 }
 
 .exampleIcons {
diff --git a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
index c84a604bac0b8..6289b325ba68f 100644
--- a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
@@ -52,7 +52,7 @@ export class BrandIconsPage extends React.Component<any, any> {
         <div className={ pageStyles.u_maxTextWidth }>
           <h2 id='overview'>Overview</h2>
           <p>Fabric includes product and document icons that you can use to connect your experience with other Office and Office 365 endpoints. The icons come in three formats &mdash; SVG and PNG for multicolor and the icon font for monochrome &mdash; in a variety of sizes and resolutions.</p>
-          <p>Usage of these icons is subject to the <a href='https://static2.sharepointonline.com/files/fabric/assets/license.txt'>assets license agreement (DOCX)</a> and our <a href={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/files/office_marketing_guidelines.pdf' }>brand guidelines (PDF)</a>. Please read this document and the resolution/size guidance carefully to ensure that you use our branded icons correctly to create the best experience.</p>
+          <p>Usage of these icons is subject to the <a href='https://static2.sharepointonline.com/files/fabric/assets/microsoft_fabric_assets_license_agreement_sept092017.pdf'>assets license agreement (PDF)</a> and our <a href={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/files/office_marketing_guidelines.pdf' }>brand guidelines (PDF)</a>. Please read this document and the resolution/size guidance carefully to ensure that you use our branded icons correctly to create the best experience.</p>
         </div>
         <h3>Product icons</h3>
         <div className='ms-Grid ms-Grid--wide'>
diff --git a/apps/fabric-website/src/styles/_variables.scss b/apps/fabric-website/src/styles/_variables.scss
index 236144d5c147e..8a602cb134a4f 100644
--- a/apps/fabric-website/src/styles/_variables.scss
+++ b/apps/fabric-website/src/styles/_variables.scss
@@ -86,6 +86,10 @@ $contentPadding-sm: 16px;
 $contentPadding-lg: 32px;
 $contentPadding-xl: 40px;
 $contentPaddingBottom: 100px;
+$contentInGrid: 12px; // Content in a grid wrapped div needs extra padding to align with other page content
+
+$contentMargin-vertical: 16px; // Consistent spacing across pages for titles and descriptions
+$titleMargin-vertical: 32px; // Consistent spacing across pages for titles and descriptions
 
 // Screen sizes that align with UHF breakpoints
 $uhf-screen-min-mobile: 768px;
diff --git a/common/changes/@uifabric/fabric-website/xd-toolkits-v2_2017-09-20-21-12.json b/common/changes/@uifabric/fabric-website/xd-toolkits-v2_2017-09-20-21-12.json
new file mode 100644
index 0000000000000..ef507cfe6c6eb
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/xd-toolkits-v2_2017-09-20-21-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Added section in ResourcePage for XD Toolkits and other assets, includes references on other pages, too.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From 98ac26378c4aa6493d419a720cc759590f5ea37d Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Wed, 20 Sep 2017 19:49:43 -0700
Subject: [PATCH 0685/1641] Round 2 of visual bug fixes for UHF for website
 (#2911)

* Fix blog calendar overlap in mobile

* Fixed blog page, resource page, and get-started page visual bugs

* Added change file

* Renamed classes to get rid of "override" language
---
 .../src/pages/BlogPage/BlogItem.scss          |  4 +++
 .../GetStarted/GetStartedPage.module.scss     | 17 +++++++++--
 .../src/pages/GetStarted/GetStartedPage.tsx   | 28 +++++++++----------
 .../src/pages/HomePage/HomePage.module.scss   |  6 ++--
 .../src/pages/HomePage/HomePage.tsx           | 12 ++++----
 .../ResourcesPage/ResourcesPage.module.scss   |  1 +
 .../src/styles/_typography.scss               |  5 ++--
 .../fabric-website/src/styles/_variables.scss |  4 +++
 .../uhf-visual-bus-v2_2017-09-21-02-05.json   | 11 ++++++++
 9 files changed, 59 insertions(+), 29 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/uhf-visual-bus-v2_2017-09-21-02-05.json

diff --git a/apps/fabric-website/src/pages/BlogPage/BlogItem.scss b/apps/fabric-website/src/pages/BlogPage/BlogItem.scss
index 5a749746a4d40..e970570936eb8 100644
--- a/apps/fabric-website/src/pages/BlogPage/BlogItem.scss
+++ b/apps/fabric-website/src/pages/BlogPage/BlogItem.scss
@@ -53,6 +53,10 @@ $BlogItem-dateColumnWidth: 120px;
     max-width: 50em;
     width: 100%;
     padding-top: 60px;
+
+    h2 {
+      margin: $uhf-h2-margin;
+    }
   }
 
   .BlogItem-title {
diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
index 45e23a1c92e83..7295ea04ef152 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
@@ -47,11 +47,13 @@
   background-color:$color-getStarted-darker;
   color: $ms-color-neutralLighter;
 
-  a, a:visited {
+  a, a:visited,
+  .getStartedLink {
     border-bottom: 1px solid $ms-color-neutralLight;
   }
 
-  a, a:hover, a:active {
+  a, a:hover, a:active,
+  .getStartedLink {
     color: $ms-color-neutralLight;
   }
 }
@@ -130,9 +132,18 @@
     font-size: $ms-font-size-l;
   }
 
-  a {
+  a,
+  .getStartedLink {
     color: $color-getStarted-medium;
   }
+
+  h3 {
+    margin: $uhf-h3-margin;
+  }
+
+  .trademark {
+    margin-top: 80px;
+  }
 }
 
 .steps {
diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
index 6b4ad320e3fdd..dabba8bf4f122 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
@@ -64,7 +64,7 @@ export class GetStartedPage extends React.Component<any, any> {
           <div id='toolkit'>
             <span className={ styles.title }>Design Toolkit</span>
             <span className={ styles.descriptionLarge }>The toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences.</span>
-            <a href='#/resources'>Learn more</a>
+            <a className={ styles.getStartedLink } href='#/resources'>Learn more</a>
           </div>
         </div>
 
@@ -76,7 +76,7 @@ export class GetStartedPage extends React.Component<any, any> {
               <div className={ diagramStyles.text }>
                 <span className={ diagramStyles.headline }>Fabric Core Styles</span>
                 <span className={ diagramStyles.description }>Core elements of the design language, including icons, colors, type, and grid</span>
-                <a href='#/styles'>See styles</a>
+                <a className={ styles.getStartedLink } href='#/styles'>See styles</a>
               </div>
             </div>
             <div className={ diagramStyles.or }>or</div>
@@ -89,7 +89,7 @@ export class GetStartedPage extends React.Component<any, any> {
                 <div className={ diagramStyles.content }>
                   <span className={ diagramStyles.headline }>Fabric React</span>
                   <span className={ diagramStyles.description }>Robust, up-to-date components built with the React framework</span>
-                  <a href='#/components'>See components</a>
+                  <a className={ styles.getStartedLink } href='#/components'>See components</a>
                 </div>
               </li>
               <li className={ diagramStyles.component }>
@@ -100,7 +100,7 @@ export class GetStartedPage extends React.Component<any, any> {
                 <div className={ diagramStyles.content }>
                   <span className={ diagramStyles.headline }>AngularJS</span>
                   <span className={ diagramStyles.description }>Community-driven project to build components for Angular-based apps</span>
-                  <a href='#/angular-js'>Learn more</a>
+                  <a className={ styles.getStartedLink } href='#/angular-js'>Learn more</a>
                 </div>
               </li>
             </ul>
@@ -109,7 +109,7 @@ export class GetStartedPage extends React.Component<any, any> {
 
         <div className={ styles.instructionsSection }>
           <h2 id='react'>Get started with Fabric React</h2>
-          <p>Use NPM to get Fabric components and core styling. All you need is <a href='https://nodejs.org/en/'>node.js</a> and <a href='http://gulpjs.com/'>gulp</a>.</p>
+          <p>Use NPM to get Fabric components and core styling. All you need is <a className={ styles.getStartedLink } href='https://nodejs.org/en/'>node.js</a> and <a className={ styles.getStartedLink } href='http://gulpjs.com/'>gulp</a>.</p>
 
           <ol className={ styles.steps }>
             <li>
@@ -134,7 +134,7 @@ const MyPage = () => (<Fabric><DefaultButton>I am a button.</DefaultButton></Fab
 ReactDOM.render(<MyPage />, document.body.firstChild);`
                 }
               </CodeBlock>
-              <p>For more information about using components, check out the <a href='#/components/'>components page</a>.</p>
+              <p>For more information about using components, check out the <a className={ styles.getStartedLink } href='#/components/'>components page</a>.</p>
             </li>
             <li>
               <p>You can also reference type styles for any text element:</p>
@@ -151,15 +151,15 @@ ReactDOM.render(<MyPage />, document.body.firstChild);`
                   `<i class="ms-Icon ms-Icon--Mail" aria-hidden="true"></i>`
                 }
               </CodeBlock>
-              <p>Components, type, and icons are just a small part of what Fabric has to offer. To reference other assets, including colors, product symbols, and more, see the <a href='#/styles'>styles page</a>.</p>
+              <p>Components, type, and icons are just a small part of what Fabric has to offer. To reference other assets, including colors, product symbols, and more, see the <a className={ styles.getStartedLink } href='#/styles'>styles page</a>.</p>
             </li>
           </ol>
 
           <h3>Other ways to get Fabric React</h3>
-          <p>For advanced scenarios or alternatives to NPM see the <a href='https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/ADVANCED.md'>advanced documentation in the Fabric React repository</a>.</p>
+          <p>For advanced scenarios or alternatives to NPM see the <a className={ styles.getStartedLink } href='https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/ADVANCED.md'>advanced documentation in the Fabric React repository</a>.</p>
 
           <h3>Need a component Fabric React doesn&rsquo;t have?</h3>
-          <p>First, check the <a href='https://github.com/OfficeDev/office-ui-fabric-react/issues'>Fabric React issue queue</a> or <a href='https://github.com/OfficeDev/office-ui-fabric-react/projects'>projects</a> to see if your component has already been requested or is being worked on. If you don't see an existing issue or project for the component you're looking for, please <a href='https://github.com/OfficeDev/office-ui-fabric-react/issues'>file an issue in the repo</a>, and we'll respond if it's being built or on our radar.</p>
+          <p>First, check the <a className={ styles.getStartedLink } href='https://github.com/OfficeDev/office-ui-fabric-react/issues'>Fabric React issue queue</a> or <a className={ styles.getStartedLink } href='https://github.com/OfficeDev/office-ui-fabric-react/projects'>projects</a> to see if your component has already been requested or is being worked on. If you don't see an existing issue or project for the component you're looking for, please <a className={ styles.getStartedLink } href='https://github.com/OfficeDev/office-ui-fabric-react/issues'>file an issue in the repo</a>, and we'll respond if it's being built or on our radar.</p>
 
           <h2 id='core'>Get started with Fabric Core</h2>
           <p>With one reference to our CDN, you can access Fabric&rsquo;s fonts, icons, type styles, colors, grid, and more.</p>
@@ -180,18 +180,18 @@ ReactDOM.render(<MyPage />, document.body.firstChild);`
                   `<span class="ms-font-su ms-fontColor-themePrimary">Big blue text</span>`
                 }
               </CodeBlock>
-              <p>To reference all the assets available in Fabric Core, see the <a href='#/styles'>styles page</a>. To use components, see <a href='#/get-started#react'>Fabric React</a> or <a href='#/angular-js'>ngOfficeUIFabric</a>.</p>
+              <p>To reference all the assets available in Fabric Core, see the <a className={ styles.getStartedLink } href='#/styles'>styles page</a>. To use components, see <a className={ styles.getStartedLink } href='#/get-started#react'>Fabric React</a> or <a className={ styles.getStartedLink } href='#/angular-js'>ngOfficeUIFabric</a>.</p>
             </li>
           </ol>
 
           <h3>Other ways to get Fabric Core</h3>
-          <p>You can <a href='https://github.com/OfficeDev/office-ui-fabric-core/releases'>download a copy of Fabric for your project</a> or <a href='https://github.com/OfficeDev/office-ui-fabric-core/blob/master/ghdocs/PACKAGES.md'>add it through a package manager</a>. You can also <a href='https://github.com/OfficeDev/office-ui-fabric-core/blob/master/ghdocs/BUILDING.md'>build your own copy from the source code</a>.</p>
+          <p>You can <a className={ styles.getStartedLink } href='https://github.com/OfficeDev/office-ui-fabric-core/releases'>download a copy of Fabric for your project</a> or <a className={ styles.getStartedLink } href='https://github.com/OfficeDev/office-ui-fabric-core/blob/master/ghdocs/PACKAGES.md'>add it through a package manager</a>. You can also <a className={ styles.getStartedLink } href='https://github.com/OfficeDev/office-ui-fabric-core/blob/master/ghdocs/BUILDING.md'>build your own copy from the source code</a>.</p>
 
           <h3>Need an icon or feature Fabric Core doesn&rsquo;t have?</h3>
-          <p>First, check the <a href='https://github.com/OfficeDev/office-ui-fabric-react/issues'>Fabric React issue queue</a> or <a href='https://github.com/OfficeDev/office-ui-fabric-react/projects'>projects</a> to see if your component has already been requested or is being worked on. If you don't see an existing issue or project for the component you're looking for, please <a href='https://github.com/OfficeDev/office-ui-fabric-react/issues'>file an issue in the repo</a>, and we'll respond if it's being built or on our radar.</p>
-        </div>
+          <p>First, check the <a className={ styles.getStartedLink } href='https://github.com/OfficeDev/office-ui-fabric-react/issues'>Fabric React issue queue</a> or <a className={ styles.getStartedLink } href='https://github.com/OfficeDev/office-ui-fabric-react/projects'>projects</a> to see if your component has already been requested or is being worked on. If you don't see an existing issue or project for the component you're looking for, please <a className={ styles.getStartedLink } href='https://github.com/OfficeDev/office-ui-fabric-react/issues'>file an issue in the repo</a>, and we'll respond if it's being built or on our radar.</p>
 
-        <p>Usage of Fabric assets, such as fonts and icons, is subject to the <a href='https://static2.sharepointonline.com/files/fabric/assets/microsoft_fabric_assets_license_agreement_sept092017.pdf'>assets license agreement</a>.</p>
+          <p className={ styles.trademark }>Usage of Fabric assets, such as fonts and icons, is subject to the <a className={ styles.getStartedLink } href='https://static2.sharepointonline.com/files/fabric/assets/microsoft_fabric_assets_license_agreement_sept092017.pdf'>assets license agreement</a>.</p>
+        </div>
 
       </div>
     );
diff --git a/apps/fabric-website/src/pages/HomePage/HomePage.module.scss b/apps/fabric-website/src/pages/HomePage/HomePage.module.scss
index 1ce2364350707..88a00143ddb8e 100644
--- a/apps/fabric-website/src/pages/HomePage/HomePage.module.scss
+++ b/apps/fabric-website/src/pages/HomePage/HomePage.module.scss
@@ -113,7 +113,7 @@
   }
 
   a,
-  .uhfLinkOverride {
+  .homePageLink {
     color: $color-home-lighter;
     font-size: $ms-font-size-m;
     transition: color $ms-animation-duration-2 $ms-animation-ease-1;
@@ -205,7 +205,7 @@
 .productDescription {
   font-size: $ms-font-size-l;
 
-  a, a:visited, .uhfLinkOverride {
+  a, a:visited, .homePageLink {
     color: $color-home-medium;
     transition: color $ms-animation-duration-2 $ms-animation-ease-1;
   }
@@ -328,7 +328,7 @@
 
   a,
   a:visited,
-  .uhfLinkOverride {
+  .homePageLink {
     color: $color-home-lighter;
   }
 }
diff --git a/apps/fabric-website/src/pages/HomePage/HomePage.tsx b/apps/fabric-website/src/pages/HomePage/HomePage.tsx
index 5887849cfc14a..5a8008efba13d 100644
--- a/apps/fabric-website/src/pages/HomePage/HomePage.tsx
+++ b/apps/fabric-website/src/pages/HomePage/HomePage.tsx
@@ -27,19 +27,19 @@ export class HomePage extends React.Component<any, any> {
           <div className={ styles.flavor }>
             <span className={ styles.flavorTitle }>AngularJS</span>
             <span className={ styles.flavorDescription }>Community-driven project for Angular apps</span>
-            <a className={ styles.uhfLinkOverride } href='#/angular-js'>Learn more</a>
+            <a className={ styles.homePageLink } href='#/angular-js'>Learn more</a>
           </div>
           <div className={ styles.flavor }>
             <span className={ styles.flavorTitle }>Fabric iOS</span>
             <span className={ styles.flavorDescription }>Native iOS styling and components written in Swift</span>
-            <a className={ styles.uhfLinkOverride } href='#/fabric-ios'>Learn more</a>
+            <a className={ styles.homePageLink } href='#/fabric-ios'>Learn more</a>
           </div>
         </div>
 
         <div className={ css(styles.product, styles.productSharepoint) }>
           <div>
             <span className={ styles.productTitle }>SharePoint</span>
-            <span className={ styles.productDescription }>New SharePoint experiences are built with Fabric and the SharePoint Framework comes with it baked in to make things simple. <a className={ styles.uhfLinkOverride } href='https://dev.office.com/sharepoint/docs/spfx/web-parts/get-started/use-fabric-react-components'>Learn more</a></span>
+            <span className={ styles.productDescription }>New SharePoint experiences are built with Fabric and the SharePoint Framework comes with it baked in to make things simple. <a className={ styles.homePageLink } href='https://dev.office.com/sharepoint/docs/spfx/web-parts/get-started/use-fabric-react-components'>Learn more</a></span>
           </div>
           <img className={ styles.productImage } src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/home-sharepoint.svg' } width='496' height='300' alt='Illustrated representation of the sharepoint page.' />
         </div>
@@ -47,7 +47,7 @@ export class HomePage extends React.Component<any, any> {
         <div className={ css(styles.product, styles.productAddins) }>
           <div>
             <span className={ styles.productTitle }>Office Add-ins</span>
-            <span className={ styles.productDescription }>Fabric is the official UX design framework for Office Add-ins. With Fabric, add-ins blend seamlessly with Word, Excel, PowerPoint, and Outlook. <a className={ styles.uhfLinkOverride } href='http://dev.office.com/docs/add-ins/design/add-in-design'>Learn more</a></span>
+            <span className={ styles.productDescription }>Fabric is the official UX design framework for Office Add-ins. With Fabric, add-ins blend seamlessly with Word, Excel, PowerPoint, and Outlook. <a className={ styles.homePageLink } href='http://dev.office.com/docs/add-ins/design/add-in-design'>Learn more</a></span>
           </div>
           <img className={ styles.productImage } src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/home-addins.svg' } width='496' height='300' alt='Illustrated representation of an office add-in.' />
         </div>
@@ -81,9 +81,9 @@ export class HomePage extends React.Component<any, any> {
               </a>
             </li>
           </ul>
-          <span className={ styles.trademark }>All trademarks are the property of their respective owners. Usage of Fabric assets, such as fonts and icons, is subject to the <a className={ styles.uhfLinkOverride } href='https://static2.sharepointonline.com/files/fabric/assets/microsoft_fabric_assets_license_agreement_sept092017.pdf'>assets license agreement</a>.</span>
+          <span className={ styles.trademark }>All trademarks are the property of their respective owners. Usage of Fabric assets, such as fonts and icons, is subject to the <a className={ styles.homePageLink } href='https://static2.sharepointonline.com/files/fabric/assets/microsoft_fabric_assets_license_agreement_sept092017.pdf'>assets license agreement</a>.</span>
           <span className={ styles.featuredTitle }>Design Toolkit</span>
-          <span className={ styles.featuredDescription } id={ styles.toolkitDescription }>The toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences. <a className={ styles.uhfLinkOverride } href='#/resources'>Learn more</a></span>
+          <span className={ styles.featuredDescription } id={ styles.toolkitDescription }>The toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences. <a className={ styles.homePageLink } href='#/resources'>Learn more</a></span>
         </div>
       </div>
     );
diff --git a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss
index 13315b47033e8..d389e9291355a 100644
--- a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss
+++ b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss
@@ -68,6 +68,7 @@
 
 .related {
   margin-bottom: 60px;
+  @include ms-padding-left($contentInGrid);
 
   h2 {
     color: $ms-color-neutralPrimary;
diff --git a/apps/fabric-website/src/styles/_typography.scss b/apps/fabric-website/src/styles/_typography.scss
index a7ad5d40626cc..654014d617070 100644
--- a/apps/fabric-website/src/styles/_typography.scss
+++ b/apps/fabric-website/src/styles/_typography.scss
@@ -19,13 +19,12 @@
   h2 {
     font-size: $font-size-big;
     font-weight: $ms-font-weight-light;
-    margin-bottom: 4px;
-    margin-top: 48px;
+    margin: $uhf-h2-margin;
   }
 
   h3 {
     font-size: $ms-font-size-l;
-    margin: 40px 0 8px 0;
+    margin: $uhf-h3-margin;
   }
 
   h4 {
diff --git a/apps/fabric-website/src/styles/_variables.scss b/apps/fabric-website/src/styles/_variables.scss
index 8a602cb134a4f..a9c2f85687d15 100644
--- a/apps/fabric-website/src/styles/_variables.scss
+++ b/apps/fabric-website/src/styles/_variables.scss
@@ -96,4 +96,8 @@ $uhf-screen-min-mobile: 768px;
 $uhf-screen-max-mobile: ($uhf-screen-min-mobile - 1);
 $uhf-screen-max-lg: 1083px;
 
+// These variables assist with overriding UHF styles
+$uhf-h3-margin: 40px 0 8px 0;
+$uhf-h2-margin: 48px 0 4px 0;
+
 $baseURL: ' https://static2.sharepointonline.com/files/fabric/';
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/uhf-visual-bus-v2_2017-09-21-02-05.json b/common/changes/@uifabric/fabric-website/uhf-visual-bus-v2_2017-09-21-02-05.json
new file mode 100644
index 0000000000000..1f2c5f9052a28
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/uhf-visual-bus-v2_2017-09-21-02-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Styling to fix UHF header overriding our styles.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From 19d48d6decc07b78a96d37e5f0381d7fe31be892 Mon Sep 17 00:00:00 2001
From: Atul Bagga <bagga.atul@outlook.com>
Date: Thu, 21 Sep 2017 11:24:18 +0530
Subject: [PATCH 0686/1641] Fixing deletion of disabled tags in tagpicker
 (#2883)

* Fixing deletion of disabled tags in picker

* change log file

* incorporated review comments
---
 .../tagpickerDeleteFix_2017-09-19-13-35.json  | 11 ++++++++++
 .../src/components/pickers/BasePicker.tsx     | 22 +++++++++++--------
 2 files changed, 24 insertions(+), 9 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/tagpickerDeleteFix_2017-09-19-13-35.json

diff --git a/common/changes/office-ui-fabric-react/tagpickerDeleteFix_2017-09-19-13-35.json b/common/changes/office-ui-fabric-react/tagpickerDeleteFix_2017-09-19-13-35.json
new file mode 100644
index 0000000000000..8bcf77b1d313f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/tagpickerDeleteFix_2017-09-19-13-35.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Stop delete from happening using delete or backspace when component is in disabled  mode",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "atbagga@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 2e15ef718956d..0d573d6ade46d 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -420,19 +420,23 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
         break;
 
       case KeyCodes.backspace:
-        this.onBackspace(ev);
+        if (!this.props.disabled) {
+            this.onBackspace(ev);
+        }
         ev.stopPropagation();
         break;
 
       case KeyCodes.del:
-        if (this.input && ev.target === this.input.inputElement && this.state.suggestionsVisible && this.suggestionStore.currentIndex !== -1) {
-          if (this.props.onRemoveSuggestion) {
-            (this.props.onRemoveSuggestion as any)(this.suggestionStore.currentSuggestion!.item);
-          }
-          this.suggestionStore.removeSuggestion(this.suggestionStore.currentIndex);
-          this.forceUpdate();
-        } else {
-          this.onBackspace(ev);
+        if (!this.props.disabled) {
+            if (this.input && ev.target === this.input.inputElement && this.state.suggestionsVisible && this.suggestionStore.currentIndex !== -1) {
+                if (this.props.onRemoveSuggestion) {
+                    (this.props.onRemoveSuggestion as any)(this.suggestionStore.currentSuggestion!.item);
+                }
+                this.suggestionStore.removeSuggestion(this.suggestionStore.currentIndex);
+                this.forceUpdate();
+            } else {
+                this.onBackspace(ev);
+            }
         }
         ev.stopPropagation();
         break;

From debfc719c9f082c47caaa902aa1ed1b636f684bf Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 21 Sep 2017 06:23:58 +0000
Subject: [PATCH 0687/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 64 +++++++++++++++++++
 apps/fabric-website/CHANGELOG.md              | 18 +++++-
 apps/fabric-website/package.json              |  4 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../check-hover_2017-09-20-22-53.json         | 11 ----
 .../folder-shared-icon_2017-09-19-00-38.json  | 11 ----
 .../brand-icons-page_2017-09-01-22-47.json    | 11 ----
 .../fabric-core-7.3.0_2017-09-19-20-18.json   | 11 ----
 ...ric-website-splitone_2017-09-18-21-07.json | 11 ----
 .../new-spinner-gif_2017-09-01-18-13.json     | 11 ----
 ...h-text-accessibility_2017-08-28-16-16.json | 11 ----
 .../trello-regression_2017-09-20-18-17.json   | 11 ----
 .../uhf-visual-bus-v2_2017-09-21-02-05.json   | 11 ----
 ...on-from-num-to-range_2017-08-24-22-58.json | 11 ----
 .../visual-bug-fixes_2017-09-18-22-20.json    | 11 ----
 .../xd-toolkits-v2_2017-09-20-21-12.json      | 11 ----
 .../brand-icons-page_2017-09-01-22-47.json    | 11 ----
 .../check-hover_2017-09-20-22-53.json         | 11 ----
 ...ortForCompoundButton_2017-09-08-19-02.json | 11 ----
 ...omboBoxZoomRenderFix_2017-09-19-22-57.json | 11 ----
 .../tagpickerDeleteFix_2017-09-19-13-35.json  | 11 ----
 ...ate_dropdown_comment_2017-09-19-23-14.json | 11 ----
 packages/experiments/CHANGELOG.json           | 26 ++++++++
 packages/experiments/CHANGELOG.md             | 13 +++-
 packages/experiments/package.json             |  4 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 39 +++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 14 +++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 31 files changed, 180 insertions(+), 210 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/check-hover_2017-09-20-22-53.json
 delete mode 100644 common/changes/@uifabric/experiments/folder-shared-icon_2017-09-19-00-38.json
 delete mode 100644 common/changes/@uifabric/fabric-website/brand-icons-page_2017-09-01-22-47.json
 delete mode 100644 common/changes/@uifabric/fabric-website/fabric-core-7.3.0_2017-09-19-20-18.json
 delete mode 100644 common/changes/@uifabric/fabric-website/miljo-fabric-website-splitone_2017-09-18-21-07.json
 delete mode 100644 common/changes/@uifabric/fabric-website/new-spinner-gif_2017-09-01-18-13.json
 delete mode 100644 common/changes/@uifabric/fabric-website/swatch-text-accessibility_2017-08-28-16-16.json
 delete mode 100644 common/changes/@uifabric/fabric-website/trello-regression_2017-09-20-18-17.json
 delete mode 100644 common/changes/@uifabric/fabric-website/uhf-visual-bus-v2_2017-09-21-02-05.json
 delete mode 100644 common/changes/@uifabric/fabric-website/update-version-from-num-to-range_2017-08-24-22-58.json
 delete mode 100644 common/changes/@uifabric/fabric-website/visual-bug-fixes_2017-09-18-22-20.json
 delete mode 100644 common/changes/@uifabric/fabric-website/xd-toolkits-v2_2017-09-20-21-12.json
 delete mode 100644 common/changes/office-ui-fabric-react/brand-icons-page_2017-09-01-22-47.json
 delete mode 100644 common/changes/office-ui-fabric-react/check-hover_2017-09-20-22-53.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-AddIconSupportForCompoundButton_2017-09-08-19-02.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxZoomRenderFix_2017-09-19-22-57.json
 delete mode 100644 common/changes/office-ui-fabric-react/tagpickerDeleteFix_2017-09-19-13-35.json
 delete mode 100644 common/changes/office-ui-fabric-react/update_dropdown_comment_2017-09-19-23-14.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 064a719e11234..1fb111beb8d9e 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,70 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.0.2",
+      "tag": "@uifabric/fabric-website_v5.0.2",
+      "date": "Thu, 21 Sep 2017 06:23:58 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "John Miller <rubixws@gmail.com>",
+            "commit": "40e1ef1d6ac5ee498888e7200fd15af754d7b665",
+            "comment": "Brand icons page clean up."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "4482809c3554c0147d37cffe8e4fa1e696be0f23",
+            "comment": "Updated reference to Fabric Core to the newly released 7.3.0 version."
+          },
+          {
+            "author": "John Miller <rubixws@gmail.com>",
+            "commit": "40e1ef1d6ac5ee498888e7200fd15af754d7b665",
+            "comment": "Added a test case for dogfood check"
+          },
+          {
+            "author": "John Miller <rubixws@gmail.com>",
+            "commit": "40e1ef1d6ac5ee498888e7200fd15af754d7b665",
+            "comment": "Initial loading spinner gif changed to mimic our spinner component."
+          },
+          {
+            "author": "John Miller <rubixws@gmail.com>",
+            "commit": "40e1ef1d6ac5ee498888e7200fd15af754d7b665",
+            "comment": "Switched some font colors on theme and neutral color swatches from white to black to achieve minimum contrast requirement of 4.5:1 for accessibility."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "726494444365d178707d5605e9f6b63e099a0ff2",
+            "comment": "Removed trello reference from the Get Stated page."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "98ac26378c4aa6493d419a720cc759590f5ea37d",
+            "comment": "Styling to fix UHF header overriding our styles."
+          },
+          {
+            "author": "John Miller <rubixws@gmail.com>",
+            "commit": "40e1ef1d6ac5ee498888e7200fd15af754d7b665",
+            "comment": "Changed where Fabric Core and Fabric React versions were drawing from so that they would appear as a number instead of a range."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "df65d1d5a44b0058256079c99cb7783233cdfedc",
+            "comment": "Visual bug fixes to accommodate UHF"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "faef37358c373a6848b8eab6ef4e3df05b5e9697",
+            "comment": "Added section in ResourcePage for XD Toolkits and other assets, includes references on other pages, too."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.49.0 <5.0.0` to `>=4.49.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.1",
       "tag": "@uifabric/fabric-website_v5.0.1",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index dca6cd4ba221e..d9413f3c2c6f6 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,22 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Wed, 20 Sep 2017 10:19:01 GMT and should not be manually modified.
+This log was last generated on Thu, 21 Sep 2017 06:23:58 GMT and should not be manually modified.
+
+## 5.0.2
+Thu, 21 Sep 2017 06:23:58 GMT
+
+### Patches
+
+- Brand icons page clean up.
+- Updated reference to Fabric Core to the newly released 7.3.0 version.
+- Added a test case for dogfood check
+- Initial loading spinner gif changed to mimic our spinner component.
+- Switched some font colors on theme and neutral color swatches from white to black to achieve minimum contrast requirement of 4.5:1 for accessibility.
+- Removed trello reference from the Get Stated page.
+- Styling to fix UHF header overriding our styles.
+- Changed where Fabric Core and Fabric React versions were drawing from so that they would appear as a number instead of a range.
+- Visual bug fixes to accommodate UHF
+- Added section in ResourcePage for XD Toolkits and other assets, includes references on other pages, too.
 
 ## 5.0.1
 Wed, 20 Sep 2017 10:19:01 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index b90f925bd109e..e25f48f436299 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.0.1",
+  "version": "5.0.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,7 +47,7 @@
     "@uifabric/example-app-base": ">=4.2.7 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=4.49.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.49.1 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 3ee2ad3824a01..b501fa2974e09 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.49.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.49.1 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 96aa0a6870999..56d4d162dc40c 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -26,7 +26,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.49.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.49.1 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 27225b9b675d0..95ebb7e09ca29 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -24,7 +24,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=4.49.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.49.1 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 35d8dfeae3e19..bf076b8d4ac6c 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -27,7 +27,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.49.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.49.1 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/experiments/check-hover_2017-09-20-22-53.json b/common/changes/@uifabric/experiments/check-hover_2017-09-20-22-53.json
deleted file mode 100644
index 2d0e96244f87a..0000000000000
--- a/common/changes/@uifabric/experiments/check-hover_2017-09-20-22-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Consume Check hover behavior in Tile",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/folder-shared-icon_2017-09-19-00-38.json b/common/changes/@uifabric/experiments/folder-shared-icon_2017-09-19-00-38.json
deleted file mode 100644
index 87942dd87cd18..0000000000000
--- a/common/changes/@uifabric/experiments/folder-shared-icon_2017-09-19-00-38.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Adjust Tile and FolderCover alignments and behaviors",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "tmichon@microsoft.com"
-}
diff --git a/common/changes/@uifabric/fabric-website/brand-icons-page_2017-09-01-22-47.json b/common/changes/@uifabric/fabric-website/brand-icons-page_2017-09-01-22-47.json
deleted file mode 100644
index c2753f9bfbbf6..0000000000000
--- a/common/changes/@uifabric/fabric-website/brand-icons-page_2017-09-01-22-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Brand icons page clean up.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/fabric-core-7.3.0_2017-09-19-20-18.json b/common/changes/@uifabric/fabric-website/fabric-core-7.3.0_2017-09-19-20-18.json
deleted file mode 100644
index f92d23c027cbf..0000000000000
--- a/common/changes/@uifabric/fabric-website/fabric-core-7.3.0_2017-09-19-20-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Updated reference to Fabric Core to the newly released 7.3.0 version.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/miljo-fabric-website-splitone_2017-09-18-21-07.json b/common/changes/@uifabric/fabric-website/miljo-fabric-website-splitone_2017-09-18-21-07.json
deleted file mode 100644
index eb196eccf1eb1..0000000000000
--- a/common/changes/@uifabric/fabric-website/miljo-fabric-website-splitone_2017-09-18-21-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Added a test case for dogfood check",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "miljo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/new-spinner-gif_2017-09-01-18-13.json b/common/changes/@uifabric/fabric-website/new-spinner-gif_2017-09-01-18-13.json
deleted file mode 100644
index 996d32d38994e..0000000000000
--- a/common/changes/@uifabric/fabric-website/new-spinner-gif_2017-09-01-18-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Initial loading spinner gif changed to mimic our spinner component.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/swatch-text-accessibility_2017-08-28-16-16.json b/common/changes/@uifabric/fabric-website/swatch-text-accessibility_2017-08-28-16-16.json
deleted file mode 100644
index 0fcc4a694ae12..0000000000000
--- a/common/changes/@uifabric/fabric-website/swatch-text-accessibility_2017-08-28-16-16.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Switched some font colors on theme and neutral color swatches from white to black to achieve minimum contrast requirement of 4.5:1 for accessibility.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/trello-regression_2017-09-20-18-17.json b/common/changes/@uifabric/fabric-website/trello-regression_2017-09-20-18-17.json
deleted file mode 100644
index 354292ae34220..0000000000000
--- a/common/changes/@uifabric/fabric-website/trello-regression_2017-09-20-18-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Removed trello reference from the Get Stated page.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/uhf-visual-bus-v2_2017-09-21-02-05.json b/common/changes/@uifabric/fabric-website/uhf-visual-bus-v2_2017-09-21-02-05.json
deleted file mode 100644
index 1f2c5f9052a28..0000000000000
--- a/common/changes/@uifabric/fabric-website/uhf-visual-bus-v2_2017-09-21-02-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Styling to fix UHF header overriding our styles.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/update-version-from-num-to-range_2017-08-24-22-58.json b/common/changes/@uifabric/fabric-website/update-version-from-num-to-range_2017-08-24-22-58.json
deleted file mode 100644
index 447364cad729d..0000000000000
--- a/common/changes/@uifabric/fabric-website/update-version-from-num-to-range_2017-08-24-22-58.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Changed where Fabric Core and Fabric React versions were drawing from so that they would appear as a number instead of a range.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/visual-bug-fixes_2017-09-18-22-20.json b/common/changes/@uifabric/fabric-website/visual-bug-fixes_2017-09-18-22-20.json
deleted file mode 100644
index e306efe3e5f9b..0000000000000
--- a/common/changes/@uifabric/fabric-website/visual-bug-fixes_2017-09-18-22-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Visual bug fixes to accommodate UHF",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/xd-toolkits-v2_2017-09-20-21-12.json b/common/changes/@uifabric/fabric-website/xd-toolkits-v2_2017-09-20-21-12.json
deleted file mode 100644
index ef507cfe6c6eb..0000000000000
--- a/common/changes/@uifabric/fabric-website/xd-toolkits-v2_2017-09-20-21-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Added section in ResourcePage for XD Toolkits and other assets, includes references on other pages, too.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/brand-icons-page_2017-09-01-22-47.json b/common/changes/office-ui-fabric-react/brand-icons-page_2017-09-01-22-47.json
deleted file mode 100644
index c80c151412069..0000000000000
--- a/common/changes/office-ui-fabric-react/brand-icons-page_2017-09-01-22-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Brand icons page clean up.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/check-hover_2017-09-20-22-53.json b/common/changes/office-ui-fabric-react/check-hover_2017-09-20-22-53.json
deleted file mode 100644
index 550e17b9f9fb7..0000000000000
--- a/common/changes/office-ui-fabric-react/check-hover_2017-09-20-22-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Implement hover and focus trigger behavior for Check component",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-AddIconSupportForCompoundButton_2017-09-08-19-02.json b/common/changes/office-ui-fabric-react/jspurlin-AddIconSupportForCompoundButton_2017-09-08-19-02.json
deleted file mode 100644
index 9683715980e6e..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-AddIconSupportForCompoundButton_2017-09-08-19-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add the ability for compoundButtons to have icons",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxZoomRenderFix_2017-09-19-22-57.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxZoomRenderFix_2017-09-19-22-57.json
deleted file mode 100644
index 01a81dabce145..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxZoomRenderFix_2017-09-19-22-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "[ComboBox] Fix slight rendering bug in browser zoom (around sub-pixel rounding)",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/tagpickerDeleteFix_2017-09-19-13-35.json b/common/changes/office-ui-fabric-react/tagpickerDeleteFix_2017-09-19-13-35.json
deleted file mode 100644
index 8bcf77b1d313f..0000000000000
--- a/common/changes/office-ui-fabric-react/tagpickerDeleteFix_2017-09-19-13-35.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Stop delete from happening using delete or backspace when component is in disabled  mode",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "atbagga@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/update_dropdown_comment_2017-09-19-23-14.json b/common/changes/office-ui-fabric-react/update_dropdown_comment_2017-09-19-23-14.json
deleted file mode 100644
index 7145923020678..0000000000000
--- a/common/changes/office-ui-fabric-react/update_dropdown_comment_2017-09-19-23-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "fix comments and example code for onRenderCaretDown prop of Dropdown component",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chrismo@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index d88b48b6e9f38..6cea31094806b 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "0.10.0",
+      "tag": "@uifabric/experiments_v0.10.0",
+      "date": "Thu, 21 Sep 2017 06:23:58 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "ee4a6d9178952be0f2e94f500738ef22fec48074",
+            "comment": "Consume Check hover behavior in Tile"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "1fb8014961e795e420cf615689578b19b19f0f21",
+            "comment": "Adjust Tile and FolderCover alignments and behaviors"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.49.0 <5.0.0` to `>=4.49.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.9.0",
       "tag": "@uifabric/experiments_v0.9.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 643bde60829e7..7a8eae465cef8 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Tue, 19 Sep 2017 10:08:55 GMT and should not be manually modified.
+This log was last generated on Thu, 21 Sep 2017 06:23:58 GMT and should not be manually modified.
+
+## 0.10.0
+Thu, 21 Sep 2017 06:23:58 GMT
+
+### Minor changes
+
+- Adjust Tile and FolderCover alignments and behaviors
+
+### Patches
+
+- Consume Check hover behavior in Tile
 
 ## 0.9.0
 Tue, 19 Sep 2017 10:08:55 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 93a8739b496df..3b29d718febd8 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "0.9.0",
+  "version": "0.10.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,7 +43,7 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/styling": ">=0.24.0 <1.0.0",
     "@uifabric/utilities": ">=4.13.1 <5.0.0",
-    "office-ui-fabric-react": ">=4.49.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.49.1 <5.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 7f489ccb145d8..1053ab5ce7002 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,45 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.49.1",
+      "tag": "office-ui-fabric-react_v4.49.1",
+      "date": "Thu, 21 Sep 2017 06:23:58 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "John Miller <rubixws@gmail.com>",
+            "commit": "40e1ef1d6ac5ee498888e7200fd15af754d7b665",
+            "comment": "Brand icons page clean up."
+          },
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "ee4a6d9178952be0f2e94f500738ef22fec48074",
+            "comment": "Implement hover and focus trigger behavior for Check component"
+          },
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "88967a31ae2225810c19f0b22471aa9b0c742d12",
+            "comment": "Add the ability for compoundButtons to have icons"
+          },
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "1a9ecf882c70d48ea9cb71deae3cee62d2569045",
+            "comment": "[ComboBox] Fix slight rendering bug in browser zoom (around sub-pixel rounding)"
+          },
+          {
+            "author": "Atul Bagga <bagga.atul@outlook.com>",
+            "commit": "19d48d6decc07b78a96d37e5f0381d7fe31be892",
+            "comment": "Stop delete from happening using delete or backspace when component is in disabled  mode"
+          },
+          {
+            "author": "Chris Mohr <chrismohr@users.noreply.github.com>",
+            "commit": "f1181d7ce3abf9a899e677ac1ffd60b19062c2f1",
+            "comment": "fix comments and example code for onRenderCaretDown prop of Dropdown component"
+          }
+        ]
+      }
+    },
     {
       "version": "4.49.0",
       "tag": "office-ui-fabric-react_v4.49.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index cfbe4fe8a82f9..80192ab7d4c8d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,18 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 20 Sep 2017 10:19:01 GMT and should not be manually modified.
+This log was last generated on Thu, 21 Sep 2017 06:23:58 GMT and should not be manually modified.
+
+## 4.49.1
+Thu, 21 Sep 2017 06:23:58 GMT
+
+### Patches
+
+- Brand icons page clean up.
+- Implement hover and focus trigger behavior for Check component
+- Add the ability for compoundButtons to have icons
+- [ComboBox] Fix slight rendering bug in browser zoom (around sub-pixel rounding)
+- Stop delete from happening using delete or backspace when component is in disabled  mode
+- fix comments and example code for onRenderCaretDown prop of Dropdown component
 
 ## 4.49.0
 Wed, 20 Sep 2017 10:19:01 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index d700b423dabd0..be883fb077971 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.49.0",
+  "version": "4.49.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 245bac52797e753e800c8fcd4fb383ae03a1e8d8 Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Wed, 20 Sep 2017 23:30:58 -0700
Subject: [PATCH 0688/1641] Phkuo/theme generator (#2881)

* semantic theming infrastructure

* switch over to use the correct semantic slots, and many bugfixes

* consume semantic tokens for toggle

* add toggle and radio button examples

* progress indicator example

* add more controlSlots to the page

* fix rebase master

* change to 8 shades, temp math for that, hardcoded default theme, and misc stuff

* expose fabric palette slots

* add asBackgroundShade logic for getting shades of background, which are different than usual shades

* semantic theming infrastructure

* switch over to use the correct semantic slots, and many bugfixes

* consume semantic tokens for toggle

* add toggle and radio button examples

* progress indicator example

* add more controlSlots to the page

* fix rebase master

* change to 8 shades, temp math for that, hardcoded default theme, and misc stuff

* expose fabric palette slots

* add asBackgroundShade logic for getting shades of background, which are different than usual shades

* fixes for rebasing upstream

* cleanup of file that should have been removed during rebase

* semantic theming infrastructure

* switch over to use the correct semantic slots, and many bugfixes

* consume semantic tokens for toggle

* add toggle and radio button examples

* progress indicator example

* add more controlSlots to the page

* fix rebase master

* change to 8 shades, temp math for that, hardcoded default theme, and misc stuff

* expose fabric palette slots

* add asBackgroundShade logic for getting shades of background, which are different than usual shades

* semantic theming infrastructure

* switch over to use the correct semantic slots, and many bugfixes

* add toggle and radio button examples

* progress indicator example

* add more controlSlots to the page

* fix rebase master

* change to 8 shades, temp math for that, hardcoded default theme, and misc stuff

* expose fabric palette slots

* add asBackgroundShade logic for getting shades of background, which are different than usual shades

* fixes for rebasing upstream

* cleanup of file that should have been removed during rebase

* temp code for tool to generate shades for inverted themes

* autogenerate theme from image

* fix shade generation logic for neutral in a dark theme, which didnt get reversed properly during the last pass

* ?

* fix naming

* cleanup

* cleanup

* finish tslint cleanup

* document hidden generate-theme-from-img functionality

* remove hacks, fix semantic errors

* lots of cleanup, reorg of page, changing how fabric slots inherit

* bugfixes

* bugfix, abridged theme

* renaming

* change Shades.ts capitalization start

* change Shades.ts to shades.ts finish

* clean up shades.ts

* change files

* more comment cleanup in shades.ts

* some cleanup and bugfix

* add theme generator page to public website

* fix spacing and comments

* add powershell output

* add powershell output and support noncolor rules

* label each color

* more documentation

* Update phkuo-themeGenerator_2017-09-19-02-27.json
---
 .../src/components/App/AppState.tsx           |   5 +
 .../ThemeGeneratorToolPage.tsx                |  20 +
 ...phkuo-themeGenerator_2017-09-19-02-27.json |  11 +
 ...phkuo-themeGenerator_2017-09-19-02-27.json |  11 +
 .../src/ThemeGenerator.ts                     |   1 +
 .../src/common/_semanticColorVariables.scss   |   2 +-
 .../components/ChoiceGroup/ChoiceGroup.scss   |   1 +
 .../ColorPicker/ColorPicker.Props.ts          |   6 +-
 .../components/ColorPicker/ColorPicker.scss   |   8 +
 .../components/ColorPicker/ColorPicker.tsx    |   4 +-
 .../ProgressIndicator/ProgressIndicator.scss  |   2 +-
 .../examples/TeachingBubble.Basic.Example.tsx |   2 +-
 .../src/components/Theme/ThemePage.tsx        |   2 +-
 .../components/ThemeGenerator/IThemeRules.ts  |   5 +
 .../ThemeGenerator/IThemeSlotRule.ts          |  19 +
 .../ThemeGenerator/ThemeGenerator.ts          | 182 +++++++
 .../ThemeGenerator/ThemeGeneratorPage.scss    |  67 +++
 .../ThemeGenerator/ThemeGeneratorPage.tsx     | 513 ++++++++++++++++++
 .../ThemeGenerator/ThemeRulesStandard.ts      | 215 ++++++++
 .../src/components/ThemeGenerator/index.ts    |   4 +
 .../src/demo/AppDefinition.tsx                |   8 +-
 .../src/utilities/color/index.ts              |   1 +
 .../src/utilities/color/shades.ts             | 191 +++++++
 packages/utilities/src/object.ts              |  13 +
 24 files changed, 1283 insertions(+), 10 deletions(-)
 create mode 100644 apps/fabric-website/src/pages/Styles/ThemeGeneratorToolPage/ThemeGeneratorToolPage.tsx
 create mode 100644 common/changes/@uifabric/utilities/phkuo-themeGenerator_2017-09-19-02-27.json
 create mode 100644 common/changes/office-ui-fabric-react/phkuo-themeGenerator_2017-09-19-02-27.json
 create mode 100644 packages/office-ui-fabric-react/src/ThemeGenerator.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeRules.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeSlotRule.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ThemeGenerator/index.ts
 create mode 100644 packages/office-ui-fabric-react/src/utilities/color/shades.ts

diff --git a/apps/fabric-website/src/components/App/AppState.tsx b/apps/fabric-website/src/components/App/AppState.tsx
index 02eb091ccf1c6..4f2a2609cfb65 100644
--- a/apps/fabric-website/src/components/App/AppState.tsx
+++ b/apps/fabric-website/src/components/App/AppState.tsx
@@ -73,6 +73,11 @@ export const AppState: IAppState = {
           url: '#/styles/localization',
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Styles/LocalizationPage/LocalizationPage').LocalizationPage))
         },
+        {
+          title: 'Beta Theme Generator',
+          url: '#/styles/themeGenerator',
+          getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Styles/ThemeGeneratorToolPage/ThemeGeneratorToolPage').ThemeGeneratorToolPage))
+        },
         {
           title: 'Typography',
           url: '#/styles/typography',
diff --git a/apps/fabric-website/src/pages/Styles/ThemeGeneratorToolPage/ThemeGeneratorToolPage.tsx b/apps/fabric-website/src/pages/Styles/ThemeGeneratorToolPage/ThemeGeneratorToolPage.tsx
new file mode 100644
index 0000000000000..54a960c3bd44c
--- /dev/null
+++ b/apps/fabric-website/src/pages/Styles/ThemeGeneratorToolPage/ThemeGeneratorToolPage.tsx
@@ -0,0 +1,20 @@
+import * as React from 'react';
+import { PageHeader } from '../../../components/PageHeader/PageHeader';
+
+import { ThemeGeneratorPage } from 'office-ui-fabric-react/lib/components/ThemeGenerator/ThemeGeneratorPage';
+
+export class ThemeGeneratorToolPage extends React.Component<any, any> {
+  public render() {
+    return (
+      <div>
+        <PageHeader
+          pageTitle='Theme Generator'
+          backgroundColor='#006f94'
+        />
+
+        <ThemeGeneratorPage />
+
+      </div>
+    );
+  }
+}
diff --git a/common/changes/@uifabric/utilities/phkuo-themeGenerator_2017-09-19-02-27.json b/common/changes/@uifabric/utilities/phkuo-themeGenerator_2017-09-19-02-27.json
new file mode 100644
index 0000000000000..97e629a19f051
--- /dev/null
+++ b/common/changes/@uifabric/utilities/phkuo-themeGenerator_2017-09-19-02-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Adding `mapEnumByName` helper.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "phkuo@microsoft.com"
+}
diff --git a/common/changes/office-ui-fabric-react/phkuo-themeGenerator_2017-09-19-02-27.json b/common/changes/office-ui-fabric-react/phkuo-themeGenerator_2017-09-19-02-27.json
new file mode 100644
index 0000000000000..1ddeadd293ff5
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/phkuo-themeGenerator_2017-09-19-02-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Create Theme Generator page",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/ThemeGenerator.ts b/packages/office-ui-fabric-react/src/ThemeGenerator.ts
new file mode 100644
index 0000000000000..08c9290223518
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/ThemeGenerator.ts
@@ -0,0 +1 @@
+export * from './components/ThemeGenerator/index';
diff --git a/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss b/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
index f2e3e1af322a9..ba91bb9502352 100644
--- a/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
+++ b/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
@@ -91,4 +91,4 @@ $listTextColor: $ms-color-neutralPrimary;
 
 $listItemHoverColor: $ms-color-neutralLighter;
 $listItemSelectedColor: $ms-color-neutralQuaternary;
-$listItemSelectedHoverColor: $ms-color-neutralQuaternaryAlt;
+$listItemSelectedHoverColor: $ms-color-neutralQuaternaryAlt;
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
index b401b8e86d5d7..2ceecdfa0d8d8 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
@@ -181,6 +181,7 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
     }
     &::after {
       background-color: $radioButton-dot-disabled-color;
+      border-color: $radioButton-dot-disabled-color;
     }
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts
index d3368bc4f42c3..b278d7599cbbf 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts
@@ -5,17 +5,17 @@ export interface IColorPickerProps {
   componentRef?: () => void;
 
   /**
-   * The CSS-compatible string to describe the color
+   * The CSS-compatible string to describe the initial color
    */
   color: string;
 
   /**
-   * Callback issued when the user changes the color.
+   * Callback issued when the user changes the color
    */
   onColorChanged?: (color: string) => void;
 
   /**
-   * The setting of whether hide alpha control slider.
+   * The setting of whether to hide the alpha control slider.
    */
   alphaSliderHidden?: boolean;
 }
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.scss b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.scss
index e24b85cc1bb37..d9395a3b07398 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.scss
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.scss
@@ -31,6 +31,14 @@
   position: fixed;
 }
 
+.table {
+  table-layout: fixed; // fix IE
+  width: 100%;
+}
+.tableHexCell {
+  width: 25%;
+}
+
 .thumb {
   position: absolute;
   width: 20px;
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
index 8764bf262fce9..70e4b3591e9ca 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
@@ -70,10 +70,10 @@ export class ColorPicker extends BaseComponent<IColorPickerProps, IColorPickerSt
               value={ color.a }
               onChanged={ this._onAChanged }
             />) }
-          <table className='ms-ColorPicker-table' cellPadding='0' cellSpacing='0'>
+          <table className={ css('ms-ColorPicker-table', styles.table) } cellPadding='0' cellSpacing='0'>
             <thead>
               <tr className={ FontClassNames.small }>
-                <td>Hex</td>
+                <td className={ styles.tableHexCell }>Hex</td>
                 <td>Red</td>
                 <td>Green</td>
                 <td>Blue</td>
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
index 8b26b66c7e0a6..7614bef6898b7 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
@@ -62,4 +62,4 @@ $ProgressIndicatorTextHeight: 18px;
   transition-property: width;
   transition-timing-function: linear;
   transition-duration: 150ms;
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx
index 744cdcf63acff..c608bebb997b6 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx
@@ -28,7 +28,7 @@ export class TeachingBubbleBasicExample extends React.Component<any, ITeachingBu
       children: 'Try it out'
     };
     let exampleSecondaryButtonProps: IButtonProps = {
-      children: 'May be later',
+      children: 'Maybe later',
       onClick: this._onDismiss
     };
 
diff --git a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
index 912a820ddbbc0..ffd4e631f50f7 100644
--- a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
@@ -38,7 +38,7 @@ export class ThemePage extends React.Component<any, any> {
     return (
       <div className='Themes'>
         <h1 className={ FontClassNames.xxLarge }>Themes</h1>
-        <p>The entire color pallete of the controls are themeable. We provide a set of sensible defaults, but you can override all colors individually.</p>
+        <p>The entire color palette of the controls are themeable. We provide a set of sensible defaults, but you can override all colors individually.</p>
         <p>To override the themes, you need to call <span className='code'>loadTheme()</span> with the appropriate set of overrides:</p>
 
         <Highlight className='typescript'>
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeRules.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeRules.ts
new file mode 100644
index 0000000000000..adcdda29b8d35
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeRules.ts
@@ -0,0 +1,5 @@
+import { IThemeSlotRule } from './IThemeSlotRule';
+
+export interface IThemeRules {
+  [key: string]: IThemeSlotRule;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeSlotRule.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeSlotRule.ts
new file mode 100644
index 0000000000000..b1507ebcc207b
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeSlotRule.ts
@@ -0,0 +1,19 @@
+import { IColor } from '../../utilities/color/colors';
+import { Shade } from '../../utilities/color/shades';
+
+export interface IThemeSlotRule {
+  /* The name of this theme slot. */
+  name: string;
+  /* The actual color this theme slot is if it is a color. */
+  color?: IColor;
+  /* The value of this slot if it is NOT a color. Must be falsey if not a color. */
+  value?: string;
+  /* The theme slot this slot is based on. */
+  inherits?: IThemeSlotRule;
+  /* If set, this slot is the specified shade of the slot it inherits from. */
+  asShade?: Shade;
+  /* Whether this slot is a background shade, which uses different logic for generating its inheriting-as-shade value. */
+  isBackgroundShade?: boolean;
+  /* Whether this slot has been manually overridden (else, it was automatically generated based on inheritance). */
+  isCustomized?: boolean;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts
new file mode 100644
index 0000000000000..82b620b30f0cb
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts
@@ -0,0 +1,182 @@
+import {
+  IColor,
+  getColorFromString
+} from '../../utilities/color/colors';
+import {
+  isValidShade,
+  getShade,
+  getBackgroundShade
+} from '../../utilities/color/shades';
+import { format } from '../../Utilities';
+
+import { IThemeSlotRule } from './IThemeSlotRule';
+import { IThemeRules } from './IThemeRules';
+
+export class ThemeGenerator {
+
+  /* Sets an IThemeSlotRule to the given color and cascades it to the rest of the theme, updating other IThemeSlotRules in the theme that
+   *   inherit from that color.
+   * isInverted: whether it's a dark theme or not, which affects the algorithm used to generate shades
+   * isCustomization should be true only if it's a user action, and indicates overwriting the slot's inheritance (if any)
+   * overwriteCustomColor: a slot could have a generated color based on its inheritance rules (isCustomized is false), or a custom color
+                            based on user input (isCustomized is true), this bool tells us whether to override existing customized colors */
+  public static setSlot(
+    rule: IThemeSlotRule,
+    color: string | IColor,
+    slotRules: IThemeRules,
+    isInverted = false,
+    isCustomization = false,
+    overwriteCustomColor = true
+  ) {
+    if (!rule.color && rule.value) {
+      // not a color rule
+      return;
+    }
+
+    if (overwriteCustomColor) {
+      let colorAsIColor: IColor;
+      if (typeof color === 'string') {
+        colorAsIColor = getColorFromString(color);
+      } else {
+        colorAsIColor = color;
+      }
+      ThemeGenerator._setSlot(rule, colorAsIColor, slotRules, isInverted, isCustomization, overwriteCustomColor);
+    } else if (rule.color) {
+      ThemeGenerator._setSlot(rule, rule.color, slotRules, isInverted, isCustomization, overwriteCustomColor);
+    }
+  }
+
+  /* Sets the color of each slot based on its rule. Slots that don't inherit must have a color already.
+   * If this completes without error, then the theme is ready to use. (All slots will have a color.)
+   * setSlot() can be called before this, but this must be called before getThemeAs*().
+   * Does not override colors of rules where isCustomized is true (i.e. doesn't override existing customizations).
+   */
+  public static insureSlots(slotRules: IThemeRules, isInverted: boolean) {
+    // Get all the "root" rules, the ones which don't inherit. Then "set" them to trigger updating dependent slots.
+    for (let ruleName in slotRules) {
+      if (slotRules.hasOwnProperty(ruleName)) {
+        let rule: IThemeSlotRule = slotRules[ruleName];
+        if (!rule.inherits && !rule.value) {
+          if (!rule.color) {
+            throw 'A color slot rule that does not inherit must provide its own color.';
+          }
+          ThemeGenerator._setSlot(rule, rule.color, slotRules, isInverted, false, false);
+        }
+      }
+    }
+  }
+
+  /* Gets the JSON-formatted blob that describes the theme, usable with the REST request endpoints
+   * { [theme slot name as string] : [color as string],
+   *  "tokenName": "#f00f00",
+   *  "tokenName2": "#ba2ba2",
+   *   ... }
+   */
+  public static getThemeAsJson(slotRules: IThemeRules): any {
+    let theme: any = {};
+    for (let ruleName in slotRules) {
+      if (slotRules.hasOwnProperty(ruleName)) {
+        let rule: IThemeSlotRule = slotRules[ruleName];
+        theme[rule.name] = rule.color ? rule.color.str : rule.value || '';
+      }
+    }
+    return theme;
+  }
+
+  /* Gets the theme as a list of SASS variables that can be used in code
+   * $tokenName: "[theme:tokenName, default:#f00f00]";
+   * $tokenName2: "[theme:tokenName2, default:#ba2ba2]";
+   * ...
+   */
+  public static getThemeAsSass(slotRules: IThemeRules): any {
+    let sassVarTemplate = '${0}Color: "[theme: {1},\tdefault: {2}]";\n';
+    let output = '';
+
+    for (let ruleName in slotRules) {
+      if (slotRules.hasOwnProperty(ruleName)) {
+        let rule: IThemeSlotRule = slotRules[ruleName];
+        let camelCasedName = rule.name.charAt(0).toLowerCase() + rule.name.slice(1);
+        output += format(sassVarTemplate,
+          camelCasedName,
+          camelCasedName,
+          rule.color ? rule.color.str : rule.value || '');
+      }
+    }
+    return output;
+  }
+
+  /* Gets the theme formatted for PowerShell scripts
+   * @{
+   * "tokenName" = "#f00f00";
+   * "tokenName2" = "#ba2ba2";
+   * ...
+   * }
+   */
+  public static getThemeForPowerShell(slotRules: IThemeRules): any {
+    let psVarTemplate = '"{0}" = "{1}";\n';
+    let output = '';
+
+    for (let ruleName in slotRules) {
+      if (slotRules.hasOwnProperty(ruleName)) {
+        let rule: IThemeSlotRule = slotRules[ruleName];
+        if (rule.value) {
+          // skip this one, it's not a color
+          continue;
+        }
+        let camelCasedName = rule.name.charAt(0).toLowerCase() + rule.name.slice(1);
+        let outputColor = rule.color ? '#' + rule.color.hex : rule.value || '';
+        // powershell endpoint uses the RGBA format
+        if (rule.color && rule.color.a && rule.color.a !== 100) {
+          outputColor += String(rule.color.a.toString(16));
+        }
+        output += format(psVarTemplate,
+          camelCasedName,
+          outputColor);
+      }
+    }
+    return '@{\n' + output + '}';
+  }
+
+  /* Sets the given slot's color to the appropriate color, shading it if necessary.
+     Then, iterates through all other rules (that are this rule's dependents) to update them accordingly.
+     isCustomization=true means it's a user provided color, set it to that raw color
+     isCustomization=false means the rule it's inheriting from changed, so updated using asShade */
+  private static _setSlot(
+    rule: IThemeSlotRule,
+    color: IColor,
+    slotRules: IThemeRules,
+    isInverted: boolean,
+    isCustomization: boolean,
+    overwriteCustomColor = true
+  ) {
+    if (!rule.color && rule.value) {
+      // not a color rule
+      return;
+    }
+
+    if (overwriteCustomColor || !rule.color || !rule.isCustomized || !rule.inherits) { // set the rule's color under these conditions
+      if ((overwriteCustomColor || !rule.isCustomized) && !isCustomization && rule.inherits && isValidShade(rule.asShade)) {
+        // it's inheriting by shade
+        if (rule.isBackgroundShade) {
+          rule.color = getBackgroundShade(color, rule.asShade!, isInverted)!;
+        } else {
+          rule.color = getShade(color, rule.asShade!, isInverted)!;
+        }
+        rule.isCustomized = false;
+      } else {
+        rule.color = color;
+        rule.isCustomized = true;
+      }
+
+      // then run through the rest of the rules and update dependent colors
+      for (let ruleName in slotRules) {
+        if (slotRules.hasOwnProperty(ruleName)) {
+          let ruleToUpdate: IThemeSlotRule = slotRules[ruleName];
+          if (ruleToUpdate.inherits === rule) {
+            ThemeGenerator._setSlot(ruleToUpdate, rule.color, slotRules, isInverted, false, overwriteCustomColor);
+          }
+        }
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.scss b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.scss
new file mode 100644
index 0000000000000..afa727d63e543
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.scss
@@ -0,0 +1,67 @@
+@import '../../common/common';
+:global {
+
+.ms-themer {
+  padding: 12px;
+}
+.ms-themer h3 {
+  margin: 0;
+}
+
+.ms-themer-paletteSlot {
+  text-align: center;
+  flex-basis: 410px;
+}
+
+.ms-themer-swatch {
+  display: inline-block;
+  flex-shrink: 0;
+  height: 36px;
+  width: 36px;
+  margin: 4px;
+}
+
+.ms-themer-swatchBg {
+  padding: 4px;
+  display: inline-block;
+  font-size: 0;
+  .ms-themer-swatch {
+    height: 28px;
+    width: 28px;
+    margin: 2px;
+  }
+}
+
+.ms-themer-example {
+  padding: 20px;
+  max-width: 40%;
+}
+
+.ms-themer-fabricPalette-root {
+  display: flex;
+  > div {
+    padding-left: 20px;
+  }
+}
+
+.ms-themer-accessibilityTable td {
+  padding: 4px;
+  text-align: right;
+}
+
+.ms-themer-slot {
+  display: flex;
+  align-items: center;
+  overflow: auto;
+}
+
+.ms-themer-output-root {
+  display: flex;
+  textarea {
+    height: 400px;
+    width: 300px;
+    background-color: white;
+    color: #333;
+  }
+}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
new file mode 100644
index 0000000000000..a088b382991d1
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
@@ -0,0 +1,513 @@
+import * as React from 'react';
+import './ThemeGeneratorPage.scss';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+
+import { loadTheme } from 'office-ui-fabric-react/lib/Styling';
+import {
+  IColor,
+  getContrastRatio,
+  updateA,
+  isDark,
+  getColorFromString
+} from 'office-ui-fabric-react/lib/utilities/color/index';
+
+import {
+  ThemeGenerator,
+  themeRulesStandardCreator,
+  BaseSlots,
+  FabricSlots,
+  SemanticColorSlots,
+  IThemeSlotRule,
+  IThemeRules
+} from 'office-ui-fabric-react/lib/ThemeGenerator';
+
+import { Callout } from 'office-ui-fabric-react/lib/Callout';
+import { ColorPicker } from 'office-ui-fabric-react/lib/ColorPicker';
+
+import { ChoiceGroup } from 'office-ui-fabric-react/lib/ChoiceGroup';
+import { TeachingBubbleBasicExample } from '../../components/TeachingBubble/examples/TeachingBubble.Basic.Example';
+import { TextFieldBasicExample } from '../TextField/examples/TextField.Basic.Example';
+import { ToggleBasicExample } from '../../components/Toggle/examples/Toggle.Basic.Example';
+import { ProgressIndicatorBasicExample } from '../ProgressIndicator/examples/ProgressIndicator.Basic.Example';
+
+export interface IThemeGeneratorPageState {
+  themeRules: IThemeRules;
+  colorPickerSlotRule: IThemeSlotRule | null;
+  colorPickerElement: HTMLElement | null;
+  colorPickerVisible: boolean;
+}
+
+const BackgroundImageUriKey = 'backgroundImageUri';
+const BackgroundOverlayKey = 'backgroundOverlay';
+
+export class ThemeGeneratorPage extends React.Component<any, IThemeGeneratorPageState> {
+
+  private _imgUrl: string;
+
+  constructor() {
+    super();
+
+    let themeRules = themeRulesStandardCreator();
+    ThemeGenerator.insureSlots(themeRules, isDark(themeRules[BaseSlots[BaseSlots.backgroundColor]].color!));
+
+    this.state = {
+      themeRules: themeRules,
+      colorPickerSlotRule: null,
+      colorPickerElement: null,
+      colorPickerVisible: false
+    };
+  }
+
+  public render() {
+    let { colorPickerVisible, colorPickerSlotRule, colorPickerElement } = this.state;
+
+    let fabricThemeSlots =
+      [this._fabricSlotWidget(FabricSlots.themeDarker),
+      this._fabricSlotWidget(FabricSlots.themeDark),
+      this._fabricSlotWidget(FabricSlots.themeDarkAlt),
+      this._fabricSlotWidget(FabricSlots.themePrimary),
+      this._fabricSlotWidget(FabricSlots.themeSecondary),
+      this._fabricSlotWidget(FabricSlots.themeTertiary),
+      this._fabricSlotWidget(FabricSlots.themeLight),
+      this._fabricSlotWidget(FabricSlots.themeLighter),
+      this._fabricSlotWidget(FabricSlots.themeLighterAlt)];
+    let fabricNeutralForegroundSlots =
+      [this._fabricSlotWidget(FabricSlots.black),
+      this._fabricSlotWidget(FabricSlots.neutralDark),
+      this._fabricSlotWidget(FabricSlots.neutralPrimary),
+      this._fabricSlotWidget(FabricSlots.neutralSecondary),
+      this._fabricSlotWidget(FabricSlots.neutralTertiary)
+      ];
+    let fabricNeutralBackgroundSlots =
+      [this._fabricSlotWidget(FabricSlots.neutralTertiaryAlt),
+      this._fabricSlotWidget(FabricSlots.neutralQuaternary),
+      this._fabricSlotWidget(FabricSlots.neutralQuaternaryAlt),
+      this._fabricSlotWidget(FabricSlots.neutralLight),
+      this._fabricSlotWidget(FabricSlots.neutralLighter),
+      this._fabricSlotWidget(FabricSlots.neutralLighterAlt),
+      this._fabricSlotWidget(FabricSlots.white)];
+
+    let semanticSlots =
+      [this._semanticSlotWidget(SemanticColorSlots.bodyBackground),
+      this._semanticSlotWidget(SemanticColorSlots.bodyText),
+      this._semanticSlotWidget(SemanticColorSlots.disabledBackground),
+      this._semanticSlotWidget(SemanticColorSlots.disabledText)];
+
+    return (
+      <div className='ms-themer'>
+        <p>
+          This is the Theme Generator tool, which helps you easily create all the shades and slots for a custom theme.
+          The theme can be used by Fabric React's styling package, see the <a href='https://github.com/OfficeDev/office-ui-fabric-react/tree/master/packages/styling'>documentation</a>.
+          <br />
+          As you modify one of the three base colors, the theme will update automatically based on predefined rules. You can modify each individual slot below as well.
+        </p>
+
+        {/* Hello! You've found hidden functionality for generating a theme from an image. This uses Microsoft's
+          * Cognitive Vision API, documented here:
+          * https://docs.microsoft.com/en-us/azure/cognitive-services/computer-vision/quickstarts/javascript
+          * We use that API to identify the most prominent background and foreground colors, and the accent color,
+          * and generate a theme based off of those.
+          * Since this API requires a personal subscription key, you'll have to enlist and insert your subscription
+          * key in _makeThemeFromImg() below. Then, just uncomment this section. */}
+        {/*}
+        <div style={ { display: 'flex' } }>
+          <div>URL to image:&nbsp;</div>
+          <input type='text' id='imageUrl' />
+          <button onClick={ this._makeThemeFromImg }>Create theme from image</button>
+        </div>
+        <div id='imageDescription' />
+        <div><img id='imagePreview' style={ { maxHeight: '500px', maxWidth: '800px' } } /></div>
+        {*/}
+
+        {/* the shared popup color picker for slots */ }
+        { colorPickerVisible && colorPickerSlotRule !== null && colorPickerSlotRule !== undefined && colorPickerElement &&
+          <Callout
+            key={ colorPickerSlotRule.name }
+            gapSpace={ 10 }
+            targetElement={ colorPickerElement }
+            setInitialFocus={ true }
+            onDismiss={ this._colorPickerOnDismiss }
+          >
+            <ColorPicker
+              color={ colorPickerSlotRule.color!.str }
+              onColorChanged={ this._semanticSlotRuleChanged.bind(this, colorPickerSlotRule) }
+            />
+          </Callout>
+        }
+
+        {/* the three base slots, prominently displayed at the top of the page */ }
+        <div style={ { display: 'flex' } }>
+          { [this._baseColorSlotPicker(BaseSlots.primaryColor, 'Primary theme color'),
+          this._baseColorSlotPicker(BaseSlots.foregroundColor, 'Body text color'),
+          this._baseColorSlotPicker(BaseSlots.backgroundColor, 'Body background color')] }
+        </div>
+        <br />
+
+        { this._outputSection() }
+        <br />
+
+        <h2>Fabric Palette</h2>
+        <p>The original Fabric palette slots. These are raw colors with no prescriptive uses. Each one is a shade or tint of a base color.</p>
+        <div className={ 'ms-themer-fabricPalette-root' }>
+          <div>{ fabricThemeSlots }</div>
+          <div>
+            <p>generally used for text and foregrounds</p>
+            { fabricNeutralForegroundSlots }
+          </div>
+          <div>
+            <p>generally used for backgrounds</p>
+            { fabricNeutralBackgroundSlots }
+          </div>
+        </div>
+        <br />
+
+        <h2>Semantic Slots</h2>
+        <p>These slots inherit by default from the Fabric palette, and have an intended use as defined by their name. They exist so classes of controls can be easily customized at once. See the <a href='https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/styling/src/interfaces/ISemanticColors.ts'>documentation</a> for more details.</p>
+        <div>{ semanticSlots }</div>
+        <br />
+
+        <h3>Samples</h3>
+        { <div style={ { display: 'flex', flexDirection: 'row' } }>
+          <div className='ms-themer-example'>
+            <TextFieldBasicExample />
+          </div>
+          <div className='ms-themer-example'>
+            <ToggleBasicExample />
+            <ChoiceGroup
+              options={ [
+                {
+                  key: 'A',
+                  text: 'Option A'
+                },
+                {
+                  key: 'B',
+                  text: 'Option B',
+                  checked: true
+                }] }
+              label='Pick one'
+              required={ true }
+            />,
+            <ChoiceGroup
+              options={ [
+                {
+                  key: 'C',
+                  text: 'Option C',
+                  disabled: true
+                },
+                {
+                  key: 'D',
+                  text: 'Option D',
+                  checked: true,
+                  disabled: true
+                }] }
+              label='Pick one'
+              required={ true }
+            />
+          </div>
+          <div className='ms-themer-example'>
+            <TeachingBubbleBasicExample />
+            <br />
+            <ProgressIndicatorBasicExample />
+          </div>
+        </div> }
+
+        <h3>Accessibility</h3>
+        <p>Each pair of colors below should produce legible text and have a minimum contrast ratio of 4.5.</p>
+        <table className='ms-themer-accessibilityTable'><tbody>
+          { [this._accessibilityRow(SemanticColorSlots.bodyText, SemanticColorSlots.bodyBackground),
+          this._accessibilityRow(SemanticColorSlots.disabledText, SemanticColorSlots.bodyBackground),
+          this._accessibilityRow(SemanticColorSlots.disabledText, SemanticColorSlots.disabledBackground)] }
+        </tbody></table>
+      </div>
+    );
+  }
+
+  @autobind
+  /* tslint:disable:no-unused-variable */
+  private _makeThemeFromImg() {
+    /* tslint:enable:no-unused-variable */
+    this._imgUrl = (document.getElementById('imageUrl') as HTMLInputElement).value;
+    (document.getElementById('imagePreview') as HTMLImageElement).src = this._imgUrl;
+
+    if (this._imgUrl) {
+      let xhr = new XMLHttpRequest();
+      xhr.addEventListener('load', this._cognitiveVisionCallback.bind(this));
+      // you may need to change the URL here
+      xhr.open('POST', 'https://westus.api.cognitive.microsoft.com/vision/v1.0/analyze?visualFeatures=Description%2CColor&details=&language=en');
+      xhr.setRequestHeader('Content-Type', 'application/json');
+      alert('You forgot to set the subscription key!');
+      xhr.setRequestHeader('Ocp-Apim-Subscription-Key', 'YourSubscriptionKeyHere'); // put your subscription key here
+      xhr.send('{ "url": "' + this._imgUrl + '" }');
+    } else {
+      // remove related properties from theme
+      let { themeRules } = this.state;
+      if (themeRules.hasOwnProperty(BackgroundImageUriKey)) {
+        delete themeRules[BackgroundImageUriKey];
+      }
+      if (themeRules.hasOwnProperty(BackgroundOverlayKey)) {
+        delete themeRules[BackgroundOverlayKey];
+      }
+      this.setState({ themeRules: themeRules }, this._makeNewTheme);
+    }
+  }
+
+  @autobind
+  private _cognitiveVisionCallback(e: any) {
+    const xhr = e.target;
+    if (xhr.status === 200) {
+      const response = JSON.parse(xhr.response);
+
+      document.getElementById('imageDescription')!.innerHTML = response.description.captions[0].text;
+
+      /* API returns:
+       response.color.accentColor
+       response.color.dominantColorBackground
+       response.color.dominantColorForeground */
+
+      // converts a returned color from a word into a hex value conforming to our palette
+      const getHexFromColor = (color: string, isBg: boolean) => {
+        // todo: could use more logic based on isInverted and isBg
+        switch (color.toLowerCase()) {
+          case 'black': return '#1f1f1f';
+          case 'blue': return '#0078d7';
+          case 'brown': return '#754d12';
+          case 'gray':
+          case 'grey': return isBg ? '#444' : '#ccc';
+          case 'green': return '#107c10';
+          case 'orange': return '#ff8c00';
+          case 'pink': return '#e3008c';
+          case 'purple': return '#5c2d91';
+          case 'red': return '#e81123';
+          case 'teal': return '#008272';
+          case 'white': return '#fff';
+          case 'yellow': return '#fff100';
+        }
+        alert('Error: Unexpected color passed to getHexFromColor(): ' + color);
+        return '#fff';
+      };
+
+      let { themeRules } = this.state;
+      const bgColor = getHexFromColor(response.color.dominantColorBackground, true);
+      const bgColorIsDark = isDark(getColorFromString(bgColor));
+      ThemeGenerator.setSlot(
+        themeRules[BaseSlots[BaseSlots.backgroundColor]],
+        bgColor,
+        themeRules,
+        bgColorIsDark,
+        true,
+        true);
+      ThemeGenerator.setSlot(
+        themeRules[BaseSlots[BaseSlots.primaryColor]],
+        '#' + response.color.accentColor,
+        themeRules,
+        bgColorIsDark,
+        true,
+        true);
+      ThemeGenerator.setSlot(
+        themeRules[BaseSlots[BaseSlots.foregroundColor]],
+        getHexFromColor(response.color.dominantColorForeground, false),
+        themeRules,
+        bgColorIsDark,
+        true,
+        true);
+
+      themeRules[BackgroundImageUriKey] = {
+        name: BackgroundImageUriKey,
+        value: 'url(\'' + this._imgUrl + '\')'
+      };
+      themeRules[BackgroundOverlayKey] = {
+        name: BackgroundOverlayKey,
+        color: updateA((themeRules[BaseSlots[BaseSlots.backgroundColor]]).color!, 50)
+      };
+
+      this.setState({ themeRules: themeRules }, this._makeNewTheme);
+
+    } else {
+      alert('Error ' + xhr.status + ': ' + xhr.statusText);
+    }
+  }
+
+  @autobind
+  private _colorPickerOnDismiss() {
+    this.setState({ colorPickerVisible: false });
+  }
+
+  @autobind
+  private _semanticSlotRuleChanged(slotRule: IThemeSlotRule, color: string) {
+    let { themeRules } = this.state;
+
+    ThemeGenerator.setSlot(slotRule, color, themeRules, isDark(themeRules[BaseSlots[BaseSlots.backgroundColor]].color!), true, true);
+    this.setState({ themeRules: themeRules }, this._makeNewTheme);
+  }
+
+  @autobind
+  private _onSwatchClick(slotRule: IThemeSlotRule, ev: React.MouseEvent<HTMLElement>) {
+    let { colorPickerSlotRule, colorPickerElement } = this.state;
+
+    if (colorPickerSlotRule !== null && colorPickerSlotRule !== undefined && !!colorPickerElement && colorPickerSlotRule === slotRule && colorPickerElement === ev.target) { // same one, close it
+      this.setState({ colorPickerVisible: false, colorPickerSlotRule: null, colorPickerElement: null });
+    } else { // new one, open it
+      this.setState({ colorPickerVisible: true, colorPickerSlotRule: slotRule, colorPickerElement: ev.target as HTMLElement });
+    }
+  }
+
+  @autobind
+  private _slotWidget(slotRule: IThemeSlotRule) {
+    return (
+      <div key={ slotRule.name } className='ms-themer-slot'>
+        { this._colorSquareSwatchWidget(slotRule) }
+        <div>
+          <div>{ slotRule.name }</div>
+          { !slotRule.isCustomized ?
+            <div>Inherits from: { slotRule.inherits!.name }</div>
+            : <div>Customized</div> }
+        </div>
+      </div>
+    );
+  }
+
+  @autobind
+  private _semanticSlotWidget(semanticSlot: SemanticColorSlots) {
+    return this._slotWidget(this.state.themeRules[SemanticColorSlots[semanticSlot]]);
+  }
+
+  @autobind
+  private _fabricSlotWidget(fabricSlot: FabricSlots) {
+    return this._slotWidget(this.state.themeRules[FabricSlots[fabricSlot]]);
+  }
+
+  private _colorSquareSwatchWidget(slotRule: IThemeSlotRule) {
+    return (
+      <div
+        key={ slotRule.name }
+        className='ms-themer-swatch'
+        style={ { backgroundColor: slotRule.color!.str } }
+        onClick={ this._onSwatchClick.bind(this, slotRule) }
+      />
+    );
+  }
+
+  @autobind
+  private _accessibilityRow(foreground: SemanticColorSlots, background: SemanticColorSlots) {
+    let themeRules = this.state.themeRules;
+    let bgc: IColor = themeRules[SemanticColorSlots[background]].color!;
+    let fgc: IColor = themeRules[SemanticColorSlots[foreground]].color!;
+
+    let contrastRatio = getContrastRatio(bgc, fgc);
+    let contrastRatioString = String(contrastRatio);
+    contrastRatioString = contrastRatioString.substr(0, contrastRatioString.indexOf('.') + 3);
+    if (contrastRatio < 4.5) {
+      contrastRatioString = '**' + contrastRatioString + '**';
+    }
+
+    return (
+      <tr key={ String(foreground) + String(background) }>
+        <td style={ { backgroundColor: bgc.str, color: fgc.str } }>The quick brown fox jumps over the lazy dog.</td>
+        <td>{ contrastRatioString }</td>
+        <td>{ SemanticColorSlots[foreground] + ' + ' + SemanticColorSlots[background] }</td>
+      </tr>
+    );
+  }
+
+  @autobind
+  private _outputSection() {
+    const themeRules = this.state.themeRules;
+
+    // strip out the unnecessary shade slots from the final output theme
+    let abridgedTheme: IThemeRules = {};
+    for (let ruleName in themeRules) {
+      if (themeRules.hasOwnProperty(ruleName)) {
+        if (ruleName.indexOf('ColorShade') === -1 && ruleName !== 'primaryColor' && ruleName !== 'backgroundColor' && ruleName !== 'foregroundColor') {
+          abridgedTheme[ruleName] = themeRules[ruleName];
+        }
+      }
+    }
+
+    return (
+      <div>
+        <h2>Output</h2>
+        <div className={ 'ms-themer-output-root' }>
+          <div>
+            <h3>JSON</h3>
+            <textarea
+              readOnly={ true }
+              spellCheck={ false }
+              value={ JSON.stringify(ThemeGenerator.getThemeAsJson(abridgedTheme), void 0, 2) }
+            />
+          </div>
+          <div>
+            <h3>SASS</h3>
+            <textarea
+              readOnly={ true }
+              spellCheck={ false }
+              value={ ThemeGenerator.getThemeAsSass(abridgedTheme) }
+            />
+          </div>
+          <div>
+            <h3>PowerShell</h3>
+            <textarea
+              readOnly={ true }
+              spellCheck={ false }
+              value={ ThemeGenerator.getThemeForPowerShell(abridgedTheme) }
+            />
+          </div>
+        </div>
+      </div>
+    );
+  }
+
+  @autobind
+  private _makeNewTheme() {
+    let themeAsJson: { [key: string]: string } = ThemeGenerator.getThemeAsJson(this.state.themeRules);
+    console.log('New theme...', themeAsJson);
+    document.body.style.backgroundColor = themeAsJson.backgroundColor;
+    document.body.style.color = themeAsJson.bodyText;
+    loadTheme({ palette: themeAsJson });
+  }
+
+  @autobind
+  private _baseColorSlotPicker(baseSlot: BaseSlots, title: string) {
+    function _onColorChanged(newColor: string) {
+      let themeRules = this.state.themeRules;
+      const currentIsDark = isDark(themeRules[BaseSlots[BaseSlots.backgroundColor]].color!);
+      ThemeGenerator.setSlot(
+        themeRules[BaseSlots[baseSlot]],
+        newColor,
+        themeRules,
+        currentIsDark,
+        true,
+        true);
+      if (currentIsDark !== isDark(themeRules[BaseSlots[BaseSlots.backgroundColor]].color!)) {
+        // isInverted got swapped, so need to refresh slots with new shading rules
+        ThemeGenerator.insureSlots(themeRules, !currentIsDark);
+      }
+      this.setState({ themeRules: themeRules }, this._makeNewTheme);
+    }
+
+    return (
+      <div className='ms-themer-paletteSlot' key={ baseSlot }>
+        <h3>{ title }</h3>
+        <div style={ { display: 'inline-block' } }>
+          <ColorPicker
+            key={ 'baseslotcolorpicker' + baseSlot }
+            color={ this.state.themeRules[BaseSlots[baseSlot]].color!.str }
+            /* tslint:disable:jsx-no-bind */
+            onColorChanged={ _onColorChanged.bind(this) }
+          /* tslint:enable:jsx-no-bind */
+          />
+        </div>
+        <div className='ms-themer-swatchBg' style={ { backgroundColor: this.state.themeRules[BaseSlots[baseSlot]].color!.str } }>
+          <div className='ms-themer-swatch' style={ { backgroundColor: this.state.themeRules[BaseSlots[baseSlot]].color!.str } } />
+          { [this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade1']),
+          this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade2']),
+          this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade3']),
+          this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade4']),
+          this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade5']),
+          this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade6']),
+          this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade7']),
+          this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade8'])] }
+        </div>
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
new file mode 100644
index 0000000000000..40df2f017dd54
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
@@ -0,0 +1,215 @@
+import { Shade } from '../../utilities/color/shades';
+import { getColorFromString } from '../../utilities/color/colors';
+import { mapEnumByName } from '../../Utilities';
+
+import { IThemeRules } from './IThemeRules';
+
+/* This is the set of rules for our default theme.
+   We start with three base slots, defining the background, foreground (text), and
+   primary color (sometimes called theme color). Each Fabric slot is generated from
+   shades (or tints) of one of those three, creating the Fabric palette.
+   Then, we have semantic slots, the new thing intended to eventually replace the
+   Fabric palette. The semantic slots inherit from the Fabric palette. */
+
+/* The most minimal set of slots we start with. All other ones can be generated based on rules.
+ * This is not so much an enum as it is a list. The enum is used to insure "type"-safety.
+ * For now, we are only dealing with color. */
+export enum BaseSlots {
+  primaryColor,
+  backgroundColor,
+  foregroundColor
+}
+
+/* The original Fabric palette, only for back-compat. */
+export enum FabricSlots {
+  themePrimary, // BaseSlots.primaryColor, Shade[Shade.Unshaded]);
+  themeLighterAlt, // BaseSlots.primaryColor, Shade[Shade.Shade1]);
+  themeLighter, // BaseSlots.primaryColor, Shade[Shade.Shade2]);
+  themeLight, // BaseSlots.primaryColor, Shade[Shade.Shade3]);
+  themeTertiary, // BaseSlots.primaryColor, Shade[Shade.Shade4]);
+  themeSecondary, // BaseSlots.primaryColor, Shade[Shade.Shade5]);
+  themeDarkAlt, // BaseSlots.primaryColor, Shade[Shade.Shade6]);
+  themeDark, // BaseSlots.primaryColor, Shade[Shade.Shade7]);
+  themeDarker, // BaseSlots.primaryColor, Shade[Shade.Shade8]);
+
+  neutralLighterAlt, // BaseSlots.backgroundColor, Shade[Shade.Shade1]);
+  neutralLighter, // BaseSlots.backgroundColor, Shade[Shade.Shade2]);
+  neutralLight, // BaseSlots.backgroundColor, Shade[Shade.Shade3]);
+  neutralQuaternaryAlt, // BaseSlots.backgroundColor, Shade[Shade.Shade4]);
+  neutralQuaternary, // BaseSlots.backgroundColor, Shade[Shade.Shade5]);
+  neutralTertiaryAlt, // BaseSlots.backgroundColor, Shade[Shade.Shade6]); // bg6 or fg2
+  neutralTertiary, // BaseSlots.foregroundColor, Shade[Shade.Shade3]);
+  // deprecated: neutralSecondaryAlt, // BaseSlots.foregroundColor, Shade[Shade.Shade4]);
+  neutralSecondary, // BaseSlots.foregroundColor, Shade[Shade.Shade5]);
+  neutralPrimaryAlt, // BaseSlots.foregroundColor, Shade[Shade.Shade6]);
+  neutralPrimary, // BaseSlots.foregroundColor, Shade[Shade.Unshaded]);
+  neutralDark, // BaseSlots.foregroundColor, Shade[Shade.Shade7]);
+
+  black, // BaseSlots.foregroundColor, Shade[Shade.Shade8]);
+  white, // BaseSlots.backgroundColor, Shade[Shade.Unshaded]);
+}
+
+/* List of all the semantic color slots for this theme.
+ * This is not so much an enum as it is a list. The enum is used to insure "type"-safety. */
+export enum SemanticColorSlots {
+  bodyBackground,
+  bodyText,
+  disabledBackground,
+  disabledText
+}
+
+export function themeRulesStandardCreator() {
+  let slotRules: IThemeRules = {};
+
+  /*** BASE COLORS and their SHADES */
+  // iterate through each base slot and make the SlotRules for those
+  mapEnumByName(BaseSlots, (baseSlot: string) => {
+    // first make the SlotRule for the unshaded base Color
+    slotRules[baseSlot] = {
+      name: baseSlot,
+      isCustomized: true
+    };
+
+    // then make a rule for each shade of this base color, but skip unshaded
+    mapEnumByName(Shade, (shadeName: string, shadeValue) => {
+      if (shadeName === Shade[Shade.Unshaded]) {
+        return;
+      }
+      slotRules[baseSlot + shadeName] = {
+        name: baseSlot + shadeName,
+        inherits: slotRules[baseSlot],
+        asShade: shadeValue,
+        isCustomized: false,
+        isBackgroundShade: baseSlot === BaseSlots[BaseSlots.backgroundColor] ? true : false
+      };
+      return void 0;
+    });
+
+    return void 0;
+  });
+
+  // set default colors for the base colors
+  slotRules[BaseSlots[BaseSlots.primaryColor]].color = getColorFromString('#0078d7');
+  slotRules[BaseSlots[BaseSlots.backgroundColor]].color = getColorFromString('#fff');
+  slotRules[BaseSlots[BaseSlots.foregroundColor]].color = getColorFromString('#333');
+
+  // set default colors for shades (the slot rules were already created above and will be used if the base colors ever change)
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade1]].color = getColorFromString('#eff6fc');
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade2]].color = getColorFromString('#deecf9');
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade3]].color = getColorFromString('#c7e0f4');
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade4]].color = getColorFromString('#71afe5');
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade5]].color = getColorFromString('#2b88d8');
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade6]].color = getColorFromString('#106ebe');
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade7]].color = getColorFromString('#005a9e');
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade8]].color = getColorFromString('#004578');
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade1]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade2]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade3]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade4]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade5]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade6]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade7]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade8]].isCustomized = true;
+
+  // set default colors for shades (the slot rules were already created above and will be used if the base colors ever change)
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade1]].color = getColorFromString('#eaeaea');
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade2]].color = getColorFromString('#c8c8c8');
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade3]].color = getColorFromString('#a6a6a6');
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade4]].color = getColorFromString('#767676');
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade5]].color = getColorFromString('#666666');
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade6]].color = getColorFromString('#3c3c3c');
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade7]].color = getColorFromString('#212121');
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade8]].color = getColorFromString('#000000');
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade1]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade2]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade3]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade4]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade5]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade6]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade7]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade8]].isCustomized = true;
+
+  function _makeFabricSlotRule(slotName: string, inheritedBase: BaseSlots, inheritedShade: Shade, isBackgroundShade = false) {
+    slotRules[slotName] = {
+      name: slotName,
+      inherits: slotRules[BaseSlots[inheritedBase]],
+      asShade: inheritedShade,
+      isCustomized: false,
+      isBackgroundShade: isBackgroundShade
+    };
+  }
+  _makeFabricSlotRule(FabricSlots[FabricSlots.themePrimary], BaseSlots.primaryColor, Shade.Unshaded);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.themeLighterAlt], BaseSlots.primaryColor, Shade.Shade1);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.themeLighter], BaseSlots.primaryColor, Shade.Shade2);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.themeLight], BaseSlots.primaryColor, Shade.Shade3);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.themeTertiary], BaseSlots.primaryColor, Shade.Shade4);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.themeSecondary], BaseSlots.primaryColor, Shade.Shade5);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.themeDarkAlt], BaseSlots.primaryColor, Shade.Shade6);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.themeDark], BaseSlots.primaryColor, Shade.Shade7);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.themeDarker], BaseSlots.primaryColor, Shade.Shade8);
+
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralLighterAlt], BaseSlots.backgroundColor, Shade.Shade1, true);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralLighter], BaseSlots.backgroundColor, Shade.Shade2, true);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralLight], BaseSlots.backgroundColor, Shade.Shade3, true);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralQuaternaryAlt], BaseSlots.backgroundColor, Shade.Shade4, true);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralQuaternary], BaseSlots.backgroundColor, Shade.Shade5, true);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralTertiaryAlt], BaseSlots.backgroundColor, Shade.Shade6, true); // bg6 or fg2
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralTertiary], BaseSlots.foregroundColor, Shade.Shade3);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralSecondary], BaseSlots.foregroundColor, Shade.Shade5);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralPrimaryAlt], BaseSlots.foregroundColor, Shade.Shade6);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralPrimary], BaseSlots.foregroundColor, Shade.Unshaded);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralDark], BaseSlots.foregroundColor, Shade.Shade7);
+
+  _makeFabricSlotRule(FabricSlots[FabricSlots.black], BaseSlots.foregroundColor, Shade.Shade8);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.white], BaseSlots.backgroundColor, Shade.Unshaded, true);
+
+  // manually set initial colors for the primary-based Fabric slots to match the default theme
+  slotRules[FabricSlots[FabricSlots.themeLighterAlt]].color = getColorFromString('#eff6fc');
+  slotRules[FabricSlots[FabricSlots.themeLighter]].color = getColorFromString('#deecf9');
+  slotRules[FabricSlots[FabricSlots.themeLight]].color = getColorFromString('#c7e0f4');
+  slotRules[FabricSlots[FabricSlots.themeTertiary]].color = getColorFromString('#71afe5');
+  slotRules[FabricSlots[FabricSlots.themeSecondary]].color = getColorFromString('#2b88d8');
+  slotRules[FabricSlots[FabricSlots.themeDarkAlt]].color = getColorFromString('#106ebe');
+  slotRules[FabricSlots[FabricSlots.themeDark]].color = getColorFromString('#005a9e');
+  slotRules[FabricSlots[FabricSlots.themeDarker]].color = getColorFromString('#004578');
+  slotRules[FabricSlots[FabricSlots.themeLighterAlt]].isCustomized = true;
+  slotRules[FabricSlots[FabricSlots.themeLighter]].isCustomized = true;
+  slotRules[FabricSlots[FabricSlots.themeLight]].isCustomized = true;
+  slotRules[FabricSlots[FabricSlots.themeTertiary]].isCustomized = true;
+  slotRules[FabricSlots[FabricSlots.themeSecondary]].isCustomized = true;
+  slotRules[FabricSlots[FabricSlots.themeDarkAlt]].isCustomized = true;
+  slotRules[FabricSlots[FabricSlots.themeDark]].isCustomized = true;
+  slotRules[FabricSlots[FabricSlots.themeDarker]].isCustomized = true;
+
+  // todo: can remove this once we remove these outdated slots from the product
+  let primaryBackground = 'primaryBackground';
+  slotRules[primaryBackground] = {
+    name: primaryBackground,
+    inherits: slotRules[FabricSlots[FabricSlots.white]],
+    isCustomized: false
+  };
+  let primaryText = 'primaryText';
+  slotRules[primaryText] = {
+    name: primaryText,
+    inherits: slotRules[FabricSlots[FabricSlots.neutralPrimary]],
+    isCustomized: false
+  };
+
+  /*** SEMANTIC SLOTS */
+  // create the SlotRule for a semantic slot
+  function _makeSemanticSlotRule(semanticSlot: SemanticColorSlots, inheritedFabricSlot: FabricSlots) {
+    slotRules[SemanticColorSlots[semanticSlot]] = {
+      name: SemanticColorSlots[semanticSlot],
+      inherits: slotRules[FabricSlots[inheritedFabricSlot]],
+      isCustomized: false
+    };
+  }
+
+  // Basics simple content slots
+  _makeSemanticSlotRule(SemanticColorSlots.bodyBackground, FabricSlots.white);
+  _makeSemanticSlotRule(SemanticColorSlots.bodyText, FabricSlots.neutralPrimary);
+  _makeSemanticSlotRule(SemanticColorSlots.disabledBackground, FabricSlots.neutralLighter);
+  _makeSemanticSlotRule(SemanticColorSlots.disabledText, FabricSlots.neutralTertiaryAlt);
+
+  return slotRules;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/index.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/index.ts
new file mode 100644
index 0000000000000..e9dbaa867d220
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/index.ts
@@ -0,0 +1,4 @@
+export * from './ThemeGenerator';
+export * from './IThemeSlotRule';
+export * from './IThemeRules';
+export * from './ThemeRulesStandard';
diff --git a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
index b581aab573a1e..169924b84986a 100644
--- a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
+++ b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
@@ -338,12 +338,18 @@ export const AppDefinition: IAppDefinition = {
           name: 'Themes',
           url: '#examples/themes'
         },
+        {
+          component: require<any>('../components/ThemeGenerator/ThemeGeneratorPage').ThemeGeneratorPage,
+          key: 'Theme Generator',
+          name: 'Beta Theme Generator',
+          url: '#examples/themeGenerator'
+        },
         {
           component: require<any>('./ComponentStatus/ComponentStatusPage').ComponentStatusPage,
           key: 'Components Status',
           name: 'Components Checklist',
           url: '#/components-status'
-        },
+        }
       ],
       name: 'Utilities'
     }
diff --git a/packages/office-ui-fabric-react/src/utilities/color/index.ts b/packages/office-ui-fabric-react/src/utilities/color/index.ts
index 1bae1c0e497ca..9b04c762c9349 100644
--- a/packages/office-ui-fabric-react/src/utilities/color/index.ts
+++ b/packages/office-ui-fabric-react/src/utilities/color/index.ts
@@ -1 +1,2 @@
 export * from './colors';
+export * from './shades';
diff --git a/packages/office-ui-fabric-react/src/utilities/color/shades.ts b/packages/office-ui-fabric-react/src/utilities/color/shades.ts
new file mode 100644
index 0000000000000..8a5178887ca35
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/utilities/color/shades.ts
@@ -0,0 +1,191 @@
+// Technically this should be shades and tints, but for simplicity we'll call everything a shade.
+/* This utility module is used with theming. Given a color to shade, whether the theme is inverted (i.e. is a dark color),
+ * and the desired shade enum, this will return an appropriate shade of that color.
+ */
+import {
+  IColor,
+  MAX_COLOR_RGBA
+} from './colors';
+import * as Colors from './colors';
+import { assign } from '../../Utilities';
+
+// Soften: to get closer to the background color's luminance (softening with a white background would be lightening, with black it'd be darkening)
+// Strongen: opposite of soften
+
+// Luminance multiplier constants for generating shades of a given color
+const WhiteShadeTableBG = [.973, .957, .918, .855, .816, .784, .651, .463]; // white bg
+const BlackTintTableBG = [.463, .55, .651, .784, .816, .855, .918, .957]; // black bg
+const WhiteShadeTable = [.463, .651, .784, .816, .855, .918, .957, .973]; // white fg
+const BlackTintTable = [.463, .55, .651, .784, .816, .855, .918, .957]; // black fg
+const LumTintTable = [.12, .23, .34, .45, .56, .67, .78, .89]; // light (strongen all)
+const LumShadeTable = [.89, .78, .67, .56, .45, .34, .23, .12]; // dark (soften all)
+const ColorTintTable = [.050, .100, .200, .42, .90]; // default soften
+const ColorShadeTable = [.90, .70, .550]; // default strongen
+
+// If the given shade's luminance is below/above these values, we'll swap to using the White/Black tables above
+const c_LuminanceLow = 0.2;
+const c_LuminanceHigh = 0.8;
+
+/** Shades of a given color, from softest to strongest. */
+export enum Shade {
+  Unshaded = 0,
+  Shade1 = 1,
+  Shade2 = 2,
+  Shade3 = 3,
+  Shade4 = 4,
+  Shade5 = 5,
+  Shade6 = 6,
+  Shade7 = 7,
+  Shade8 = 8,
+  // remember to update isValidShade()!
+}
+
+/**
+ * Returns true if the argument is a valid Shade value
+ * @param {Shade} shade The Shade value to validate.
+ */
+export function isValidShade(shade?: Shade): boolean {
+  'use strict';
+  return (typeof shade === 'number') && (shade >= Shade.Unshaded) && (shade <= Shade.Shade8);
+}
+
+function _isBlack(color: IColor): boolean {
+  return color.r === 0 && color.g === 0 && color.b === 0;
+}
+
+function _isWhite(color: IColor): boolean {
+  return color.r === MAX_COLOR_RGBA && color.g === MAX_COLOR_RGBA && color.b === MAX_COLOR_RGBA;
+}
+
+function _darken(hsl: { h: number, s: number, l: number }, factor: number) {
+  return {
+    h: hsl.h,
+    s: hsl.s,
+    l: hsl.l * factor
+  };
+}
+
+function _lighten(hsl: { h: number, s: number, l: number }, factor: number) {
+  return {
+    h: hsl.h,
+    s: hsl.s,
+    l: hsl.l * factor + (100 * (1 - factor))
+  };
+}
+
+export function isDark(color: IColor) {
+  return Colors.hsv2hsl(color.h, color.s, color.v).l < 50;
+}
+
+/**
+ * Given a color and a shade specification, generates the requested shade of the color.
+ * Logic:
+ * if white
+ *  darken via tables defined above
+ * if black
+ *  lighten
+ * if light
+ *  strongen
+ * if dark
+ *  soften
+ * else default
+ *  soften or strongen depending on shade#
+ * @param {IColor} color The base color whose shade is to be computed
+ * @param {Shade} shade The shade of the base color to compute
+ * @param {Boolean} isInverted Default false. Whether the given theme is inverted (reverse strongen/soften logic)
+ */
+export function getShade(color: IColor, shade: Shade, isInverted = false) {
+  'use strict';
+  if (!color) {
+    return null;
+  }
+
+  if (shade === Shade.Unshaded || !isValidShade(shade)) {
+    return color;
+  }
+
+  let hsl = Colors.hsv2hsl(color.h, color.s, color.v);
+  let tableIndex = shade - 1;
+  let _soften = _lighten;
+  let _strongen = _darken;
+  if (isInverted) {
+    // tableIndex = LumTintTable.length - 1 - tableIndex;
+    _soften = _darken;
+    _strongen = _lighten;
+  }
+  if (_isWhite(color)) { // white
+    hsl = _darken(hsl, WhiteShadeTable[tableIndex]);
+  } else if (_isBlack(color)) { // black
+    hsl = _lighten(hsl, BlackTintTable[tableIndex]);
+  } else if (hsl.l / 100 > c_LuminanceHigh) { // light
+    hsl = _strongen(hsl, LumShadeTable[tableIndex]);
+  } else if (hsl.l / 100 < c_LuminanceLow) { // dark
+    hsl = _soften(hsl, LumTintTable[tableIndex]);
+  } else { // default
+    if (tableIndex < ColorTintTable.length) {
+      hsl = _soften(hsl, ColorTintTable[tableIndex]);
+    } else {
+      hsl = _strongen(hsl, ColorShadeTable[tableIndex - ColorTintTable.length]);
+    }
+  }
+
+  return Colors.getColorFromRGBA(assign(Colors.hsl2rgb(hsl.h, hsl.s, hsl.l), { a: color.a }));
+}
+
+// Background shades/tints are generated differently. The provided color will be guaranteed
+//   to be the darkest or lightest one. If it is <50% luminance, it will always be the darkest,
+//   otherwise it will always be the lightest.
+export function getBackgroundShade(color: IColor, shade: Shade, isInverted = false) {
+  'use strict';
+  if (!color) {
+    return null;
+  }
+
+  if (shade === Shade.Unshaded || !isValidShade(shade)) {
+    return color;
+  }
+
+  let hsl = Colors.hsv2hsl(color.h, color.s, color.v);
+  let tableIndex = shade - 1;
+  if (!isInverted) { // lightish
+    hsl = _darken(hsl, WhiteShadeTableBG[tableIndex]);
+  } else { // default: if (hsl.l / 100 < .5) { // darkish
+    hsl = _lighten(hsl, BlackTintTableBG[BlackTintTable.length - 1 - tableIndex]);
+  }
+
+  return Colors.getColorFromRGBA(assign(Colors.hsl2rgb(hsl.h, hsl.s, hsl.l), { a: color.a }));
+}
+
+/* Calculates the contrast ratio between two colors. Used for verifying
+ * color pairs meet minimum accessibility requirements.
+ * See: https://www.w3.org/TR/WCAG20/ section 1.4.3
+ */
+export function getContrastRatio(color1: IColor, color2: IColor) {
+  // Formula defined by: http://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.html#contrast-ratiodef
+  // relative luminance: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef
+
+  /* calculate the intermediate value needed to calculating relative luminance */
+  function _getThing(x: number) {
+    if (x <= .03928) {
+      return x / 12.92;
+    } else {
+      return Math.pow((x + .055) / 1.055, 2.4);
+    }
+  }
+
+  let r1 = _getThing(color1.r / MAX_COLOR_RGBA);
+  let g1 = _getThing(color1.g / MAX_COLOR_RGBA);
+  let b1 = _getThing(color1.b / MAX_COLOR_RGBA);
+  let L1 = (.2126 * r1) + (.7152 * g1) + (.0722 * b1); // relative luminance of first color
+  L1 += .05;
+
+  let r2 = _getThing(color2.r / MAX_COLOR_RGBA);
+  let g2 = _getThing(color2.g / MAX_COLOR_RGBA);
+  let b2 = _getThing(color2.b / MAX_COLOR_RGBA);
+  let L2 = (.2126 * r2) + (.7152 * g2) + (.0722 * b2); // relative luminance of second color
+  L2 += .05;
+
+  // return the lighter color divided by darker
+  return L1 / L2 > 1 ?
+    L1 / L2 : L2 / L1;
+}
\ No newline at end of file
diff --git a/packages/utilities/src/object.ts b/packages/utilities/src/object.ts
index 84dbf94049479..a6bc2020f2929 100644
--- a/packages/utilities/src/object.ts
+++ b/packages/utilities/src/object.ts
@@ -85,3 +85,16 @@ export function getId(prefix?: string): string {
 
   return (prefix || '') + index;
 }
+
+/* Takes an enum and iterates over each value of the enum (as a string), running the callback on each, returning a mapped array.
+ * The callback takes as a first parameter the string that represents the name of the entry, and the second parameter is the
+ * value of that entry, which is the value you'd normally use when using the enum (usually a number).
+ * */
+export function mapEnumByName<T>(theEnum: any, callback: (name?: string, value?: any) => T | undefined): T[] | undefined {
+  // map<any> to satisfy compiler since it doesn't realize we strip out undefineds in the .filter() call
+  return Object.keys(theEnum).map<any>((p: string) => { // map on each property name as a string
+    if (String(Number(p)) !== p) { // if the property is not just a number (because enums in TypeScript will map both ways)
+      return callback(p, theEnum[p]);
+    }
+  }).filter((v: any) => !!v); // only return elements with values
+}
\ No newline at end of file

From 3e60e03af0c452de150cee24dc32d1e89873715f Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 20 Sep 2017 23:33:16 -0700
Subject: [PATCH 0689/1641] Revert "Phkuo/theme generator (#2881)" (#2913)

This reverts commit 245bac52797e753e800c8fcd4fb383ae03a1e8d8.
---
 .../src/components/App/AppState.tsx           |   5 -
 .../ThemeGeneratorToolPage.tsx                |  20 -
 ...phkuo-themeGenerator_2017-09-19-02-27.json |  11 -
 ...phkuo-themeGenerator_2017-09-19-02-27.json |  11 -
 .../src/ThemeGenerator.ts                     |   1 -
 .../src/common/_semanticColorVariables.scss   |   2 +-
 .../components/ChoiceGroup/ChoiceGroup.scss   |   1 -
 .../ColorPicker/ColorPicker.Props.ts          |   6 +-
 .../components/ColorPicker/ColorPicker.scss   |   8 -
 .../components/ColorPicker/ColorPicker.tsx    |   4 +-
 .../ProgressIndicator/ProgressIndicator.scss  |   2 +-
 .../examples/TeachingBubble.Basic.Example.tsx |   2 +-
 .../src/components/Theme/ThemePage.tsx        |   2 +-
 .../components/ThemeGenerator/IThemeRules.ts  |   5 -
 .../ThemeGenerator/IThemeSlotRule.ts          |  19 -
 .../ThemeGenerator/ThemeGenerator.ts          | 182 -------
 .../ThemeGenerator/ThemeGeneratorPage.scss    |  67 ---
 .../ThemeGenerator/ThemeGeneratorPage.tsx     | 513 ------------------
 .../ThemeGenerator/ThemeRulesStandard.ts      | 215 --------
 .../src/components/ThemeGenerator/index.ts    |   4 -
 .../src/demo/AppDefinition.tsx                |   8 +-
 .../src/utilities/color/index.ts              |   1 -
 .../src/utilities/color/shades.ts             | 191 -------
 packages/utilities/src/object.ts              |  13 -
 24 files changed, 10 insertions(+), 1283 deletions(-)
 delete mode 100644 apps/fabric-website/src/pages/Styles/ThemeGeneratorToolPage/ThemeGeneratorToolPage.tsx
 delete mode 100644 common/changes/@uifabric/utilities/phkuo-themeGenerator_2017-09-19-02-27.json
 delete mode 100644 common/changes/office-ui-fabric-react/phkuo-themeGenerator_2017-09-19-02-27.json
 delete mode 100644 packages/office-ui-fabric-react/src/ThemeGenerator.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeRules.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeSlotRule.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.scss
 delete mode 100644 packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/ThemeGenerator/index.ts
 delete mode 100644 packages/office-ui-fabric-react/src/utilities/color/shades.ts

diff --git a/apps/fabric-website/src/components/App/AppState.tsx b/apps/fabric-website/src/components/App/AppState.tsx
index 4f2a2609cfb65..02eb091ccf1c6 100644
--- a/apps/fabric-website/src/components/App/AppState.tsx
+++ b/apps/fabric-website/src/components/App/AppState.tsx
@@ -73,11 +73,6 @@ export const AppState: IAppState = {
           url: '#/styles/localization',
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Styles/LocalizationPage/LocalizationPage').LocalizationPage))
         },
-        {
-          title: 'Beta Theme Generator',
-          url: '#/styles/themeGenerator',
-          getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Styles/ThemeGeneratorToolPage/ThemeGeneratorToolPage').ThemeGeneratorToolPage))
-        },
         {
           title: 'Typography',
           url: '#/styles/typography',
diff --git a/apps/fabric-website/src/pages/Styles/ThemeGeneratorToolPage/ThemeGeneratorToolPage.tsx b/apps/fabric-website/src/pages/Styles/ThemeGeneratorToolPage/ThemeGeneratorToolPage.tsx
deleted file mode 100644
index 54a960c3bd44c..0000000000000
--- a/apps/fabric-website/src/pages/Styles/ThemeGeneratorToolPage/ThemeGeneratorToolPage.tsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import * as React from 'react';
-import { PageHeader } from '../../../components/PageHeader/PageHeader';
-
-import { ThemeGeneratorPage } from 'office-ui-fabric-react/lib/components/ThemeGenerator/ThemeGeneratorPage';
-
-export class ThemeGeneratorToolPage extends React.Component<any, any> {
-  public render() {
-    return (
-      <div>
-        <PageHeader
-          pageTitle='Theme Generator'
-          backgroundColor='#006f94'
-        />
-
-        <ThemeGeneratorPage />
-
-      </div>
-    );
-  }
-}
diff --git a/common/changes/@uifabric/utilities/phkuo-themeGenerator_2017-09-19-02-27.json b/common/changes/@uifabric/utilities/phkuo-themeGenerator_2017-09-19-02-27.json
deleted file mode 100644
index 97e629a19f051..0000000000000
--- a/common/changes/@uifabric/utilities/phkuo-themeGenerator_2017-09-19-02-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Adding `mapEnumByName` helper.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "phkuo@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/phkuo-themeGenerator_2017-09-19-02-27.json b/common/changes/office-ui-fabric-react/phkuo-themeGenerator_2017-09-19-02-27.json
deleted file mode 100644
index 1ddeadd293ff5..0000000000000
--- a/common/changes/office-ui-fabric-react/phkuo-themeGenerator_2017-09-19-02-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Create Theme Generator page",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/ThemeGenerator.ts b/packages/office-ui-fabric-react/src/ThemeGenerator.ts
deleted file mode 100644
index 08c9290223518..0000000000000
--- a/packages/office-ui-fabric-react/src/ThemeGenerator.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './components/ThemeGenerator/index';
diff --git a/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss b/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
index ba91bb9502352..f2e3e1af322a9 100644
--- a/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
+++ b/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
@@ -91,4 +91,4 @@ $listTextColor: $ms-color-neutralPrimary;
 
 $listItemHoverColor: $ms-color-neutralLighter;
 $listItemSelectedColor: $ms-color-neutralQuaternary;
-$listItemSelectedHoverColor: $ms-color-neutralQuaternaryAlt;
\ No newline at end of file
+$listItemSelectedHoverColor: $ms-color-neutralQuaternaryAlt;
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
index 2ceecdfa0d8d8..b401b8e86d5d7 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
@@ -181,7 +181,6 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
     }
     &::after {
       background-color: $radioButton-dot-disabled-color;
-      border-color: $radioButton-dot-disabled-color;
     }
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts
index b278d7599cbbf..d3368bc4f42c3 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts
@@ -5,17 +5,17 @@ export interface IColorPickerProps {
   componentRef?: () => void;
 
   /**
-   * The CSS-compatible string to describe the initial color
+   * The CSS-compatible string to describe the color
    */
   color: string;
 
   /**
-   * Callback issued when the user changes the color
+   * Callback issued when the user changes the color.
    */
   onColorChanged?: (color: string) => void;
 
   /**
-   * The setting of whether to hide the alpha control slider.
+   * The setting of whether hide alpha control slider.
    */
   alphaSliderHidden?: boolean;
 }
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.scss b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.scss
index d9395a3b07398..e24b85cc1bb37 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.scss
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.scss
@@ -31,14 +31,6 @@
   position: fixed;
 }
 
-.table {
-  table-layout: fixed; // fix IE
-  width: 100%;
-}
-.tableHexCell {
-  width: 25%;
-}
-
 .thumb {
   position: absolute;
   width: 20px;
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
index 70e4b3591e9ca..8764bf262fce9 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
@@ -70,10 +70,10 @@ export class ColorPicker extends BaseComponent<IColorPickerProps, IColorPickerSt
               value={ color.a }
               onChanged={ this._onAChanged }
             />) }
-          <table className={ css('ms-ColorPicker-table', styles.table) } cellPadding='0' cellSpacing='0'>
+          <table className='ms-ColorPicker-table' cellPadding='0' cellSpacing='0'>
             <thead>
               <tr className={ FontClassNames.small }>
-                <td className={ styles.tableHexCell }>Hex</td>
+                <td>Hex</td>
                 <td>Red</td>
                 <td>Green</td>
                 <td>Blue</td>
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
index 7614bef6898b7..8b26b66c7e0a6 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
@@ -62,4 +62,4 @@ $ProgressIndicatorTextHeight: 18px;
   transition-property: width;
   transition-timing-function: linear;
   transition-duration: 150ms;
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx
index c608bebb997b6..744cdcf63acff 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx
@@ -28,7 +28,7 @@ export class TeachingBubbleBasicExample extends React.Component<any, ITeachingBu
       children: 'Try it out'
     };
     let exampleSecondaryButtonProps: IButtonProps = {
-      children: 'Maybe later',
+      children: 'May be later',
       onClick: this._onDismiss
     };
 
diff --git a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
index ffd4e631f50f7..912a820ddbbc0 100644
--- a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
@@ -38,7 +38,7 @@ export class ThemePage extends React.Component<any, any> {
     return (
       <div className='Themes'>
         <h1 className={ FontClassNames.xxLarge }>Themes</h1>
-        <p>The entire color palette of the controls are themeable. We provide a set of sensible defaults, but you can override all colors individually.</p>
+        <p>The entire color pallete of the controls are themeable. We provide a set of sensible defaults, but you can override all colors individually.</p>
         <p>To override the themes, you need to call <span className='code'>loadTheme()</span> with the appropriate set of overrides:</p>
 
         <Highlight className='typescript'>
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeRules.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeRules.ts
deleted file mode 100644
index adcdda29b8d35..0000000000000
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeRules.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-import { IThemeSlotRule } from './IThemeSlotRule';
-
-export interface IThemeRules {
-  [key: string]: IThemeSlotRule;
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeSlotRule.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeSlotRule.ts
deleted file mode 100644
index b1507ebcc207b..0000000000000
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeSlotRule.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-import { IColor } from '../../utilities/color/colors';
-import { Shade } from '../../utilities/color/shades';
-
-export interface IThemeSlotRule {
-  /* The name of this theme slot. */
-  name: string;
-  /* The actual color this theme slot is if it is a color. */
-  color?: IColor;
-  /* The value of this slot if it is NOT a color. Must be falsey if not a color. */
-  value?: string;
-  /* The theme slot this slot is based on. */
-  inherits?: IThemeSlotRule;
-  /* If set, this slot is the specified shade of the slot it inherits from. */
-  asShade?: Shade;
-  /* Whether this slot is a background shade, which uses different logic for generating its inheriting-as-shade value. */
-  isBackgroundShade?: boolean;
-  /* Whether this slot has been manually overridden (else, it was automatically generated based on inheritance). */
-  isCustomized?: boolean;
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts
deleted file mode 100644
index 82b620b30f0cb..0000000000000
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts
+++ /dev/null
@@ -1,182 +0,0 @@
-import {
-  IColor,
-  getColorFromString
-} from '../../utilities/color/colors';
-import {
-  isValidShade,
-  getShade,
-  getBackgroundShade
-} from '../../utilities/color/shades';
-import { format } from '../../Utilities';
-
-import { IThemeSlotRule } from './IThemeSlotRule';
-import { IThemeRules } from './IThemeRules';
-
-export class ThemeGenerator {
-
-  /* Sets an IThemeSlotRule to the given color and cascades it to the rest of the theme, updating other IThemeSlotRules in the theme that
-   *   inherit from that color.
-   * isInverted: whether it's a dark theme or not, which affects the algorithm used to generate shades
-   * isCustomization should be true only if it's a user action, and indicates overwriting the slot's inheritance (if any)
-   * overwriteCustomColor: a slot could have a generated color based on its inheritance rules (isCustomized is false), or a custom color
-                            based on user input (isCustomized is true), this bool tells us whether to override existing customized colors */
-  public static setSlot(
-    rule: IThemeSlotRule,
-    color: string | IColor,
-    slotRules: IThemeRules,
-    isInverted = false,
-    isCustomization = false,
-    overwriteCustomColor = true
-  ) {
-    if (!rule.color && rule.value) {
-      // not a color rule
-      return;
-    }
-
-    if (overwriteCustomColor) {
-      let colorAsIColor: IColor;
-      if (typeof color === 'string') {
-        colorAsIColor = getColorFromString(color);
-      } else {
-        colorAsIColor = color;
-      }
-      ThemeGenerator._setSlot(rule, colorAsIColor, slotRules, isInverted, isCustomization, overwriteCustomColor);
-    } else if (rule.color) {
-      ThemeGenerator._setSlot(rule, rule.color, slotRules, isInverted, isCustomization, overwriteCustomColor);
-    }
-  }
-
-  /* Sets the color of each slot based on its rule. Slots that don't inherit must have a color already.
-   * If this completes without error, then the theme is ready to use. (All slots will have a color.)
-   * setSlot() can be called before this, but this must be called before getThemeAs*().
-   * Does not override colors of rules where isCustomized is true (i.e. doesn't override existing customizations).
-   */
-  public static insureSlots(slotRules: IThemeRules, isInverted: boolean) {
-    // Get all the "root" rules, the ones which don't inherit. Then "set" them to trigger updating dependent slots.
-    for (let ruleName in slotRules) {
-      if (slotRules.hasOwnProperty(ruleName)) {
-        let rule: IThemeSlotRule = slotRules[ruleName];
-        if (!rule.inherits && !rule.value) {
-          if (!rule.color) {
-            throw 'A color slot rule that does not inherit must provide its own color.';
-          }
-          ThemeGenerator._setSlot(rule, rule.color, slotRules, isInverted, false, false);
-        }
-      }
-    }
-  }
-
-  /* Gets the JSON-formatted blob that describes the theme, usable with the REST request endpoints
-   * { [theme slot name as string] : [color as string],
-   *  "tokenName": "#f00f00",
-   *  "tokenName2": "#ba2ba2",
-   *   ... }
-   */
-  public static getThemeAsJson(slotRules: IThemeRules): any {
-    let theme: any = {};
-    for (let ruleName in slotRules) {
-      if (slotRules.hasOwnProperty(ruleName)) {
-        let rule: IThemeSlotRule = slotRules[ruleName];
-        theme[rule.name] = rule.color ? rule.color.str : rule.value || '';
-      }
-    }
-    return theme;
-  }
-
-  /* Gets the theme as a list of SASS variables that can be used in code
-   * $tokenName: "[theme:tokenName, default:#f00f00]";
-   * $tokenName2: "[theme:tokenName2, default:#ba2ba2]";
-   * ...
-   */
-  public static getThemeAsSass(slotRules: IThemeRules): any {
-    let sassVarTemplate = '${0}Color: "[theme: {1},\tdefault: {2}]";\n';
-    let output = '';
-
-    for (let ruleName in slotRules) {
-      if (slotRules.hasOwnProperty(ruleName)) {
-        let rule: IThemeSlotRule = slotRules[ruleName];
-        let camelCasedName = rule.name.charAt(0).toLowerCase() + rule.name.slice(1);
-        output += format(sassVarTemplate,
-          camelCasedName,
-          camelCasedName,
-          rule.color ? rule.color.str : rule.value || '');
-      }
-    }
-    return output;
-  }
-
-  /* Gets the theme formatted for PowerShell scripts
-   * @{
-   * "tokenName" = "#f00f00";
-   * "tokenName2" = "#ba2ba2";
-   * ...
-   * }
-   */
-  public static getThemeForPowerShell(slotRules: IThemeRules): any {
-    let psVarTemplate = '"{0}" = "{1}";\n';
-    let output = '';
-
-    for (let ruleName in slotRules) {
-      if (slotRules.hasOwnProperty(ruleName)) {
-        let rule: IThemeSlotRule = slotRules[ruleName];
-        if (rule.value) {
-          // skip this one, it's not a color
-          continue;
-        }
-        let camelCasedName = rule.name.charAt(0).toLowerCase() + rule.name.slice(1);
-        let outputColor = rule.color ? '#' + rule.color.hex : rule.value || '';
-        // powershell endpoint uses the RGBA format
-        if (rule.color && rule.color.a && rule.color.a !== 100) {
-          outputColor += String(rule.color.a.toString(16));
-        }
-        output += format(psVarTemplate,
-          camelCasedName,
-          outputColor);
-      }
-    }
-    return '@{\n' + output + '}';
-  }
-
-  /* Sets the given slot's color to the appropriate color, shading it if necessary.
-     Then, iterates through all other rules (that are this rule's dependents) to update them accordingly.
-     isCustomization=true means it's a user provided color, set it to that raw color
-     isCustomization=false means the rule it's inheriting from changed, so updated using asShade */
-  private static _setSlot(
-    rule: IThemeSlotRule,
-    color: IColor,
-    slotRules: IThemeRules,
-    isInverted: boolean,
-    isCustomization: boolean,
-    overwriteCustomColor = true
-  ) {
-    if (!rule.color && rule.value) {
-      // not a color rule
-      return;
-    }
-
-    if (overwriteCustomColor || !rule.color || !rule.isCustomized || !rule.inherits) { // set the rule's color under these conditions
-      if ((overwriteCustomColor || !rule.isCustomized) && !isCustomization && rule.inherits && isValidShade(rule.asShade)) {
-        // it's inheriting by shade
-        if (rule.isBackgroundShade) {
-          rule.color = getBackgroundShade(color, rule.asShade!, isInverted)!;
-        } else {
-          rule.color = getShade(color, rule.asShade!, isInverted)!;
-        }
-        rule.isCustomized = false;
-      } else {
-        rule.color = color;
-        rule.isCustomized = true;
-      }
-
-      // then run through the rest of the rules and update dependent colors
-      for (let ruleName in slotRules) {
-        if (slotRules.hasOwnProperty(ruleName)) {
-          let ruleToUpdate: IThemeSlotRule = slotRules[ruleName];
-          if (ruleToUpdate.inherits === rule) {
-            ThemeGenerator._setSlot(ruleToUpdate, rule.color, slotRules, isInverted, false, overwriteCustomColor);
-          }
-        }
-      }
-    }
-  }
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.scss b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.scss
deleted file mode 100644
index afa727d63e543..0000000000000
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.scss
+++ /dev/null
@@ -1,67 +0,0 @@
-@import '../../common/common';
-:global {
-
-.ms-themer {
-  padding: 12px;
-}
-.ms-themer h3 {
-  margin: 0;
-}
-
-.ms-themer-paletteSlot {
-  text-align: center;
-  flex-basis: 410px;
-}
-
-.ms-themer-swatch {
-  display: inline-block;
-  flex-shrink: 0;
-  height: 36px;
-  width: 36px;
-  margin: 4px;
-}
-
-.ms-themer-swatchBg {
-  padding: 4px;
-  display: inline-block;
-  font-size: 0;
-  .ms-themer-swatch {
-    height: 28px;
-    width: 28px;
-    margin: 2px;
-  }
-}
-
-.ms-themer-example {
-  padding: 20px;
-  max-width: 40%;
-}
-
-.ms-themer-fabricPalette-root {
-  display: flex;
-  > div {
-    padding-left: 20px;
-  }
-}
-
-.ms-themer-accessibilityTable td {
-  padding: 4px;
-  text-align: right;
-}
-
-.ms-themer-slot {
-  display: flex;
-  align-items: center;
-  overflow: auto;
-}
-
-.ms-themer-output-root {
-  display: flex;
-  textarea {
-    height: 400px;
-    width: 300px;
-    background-color: white;
-    color: #333;
-  }
-}
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
deleted file mode 100644
index a088b382991d1..0000000000000
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
+++ /dev/null
@@ -1,513 +0,0 @@
-import * as React from 'react';
-import './ThemeGeneratorPage.scss';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
-
-import { loadTheme } from 'office-ui-fabric-react/lib/Styling';
-import {
-  IColor,
-  getContrastRatio,
-  updateA,
-  isDark,
-  getColorFromString
-} from 'office-ui-fabric-react/lib/utilities/color/index';
-
-import {
-  ThemeGenerator,
-  themeRulesStandardCreator,
-  BaseSlots,
-  FabricSlots,
-  SemanticColorSlots,
-  IThemeSlotRule,
-  IThemeRules
-} from 'office-ui-fabric-react/lib/ThemeGenerator';
-
-import { Callout } from 'office-ui-fabric-react/lib/Callout';
-import { ColorPicker } from 'office-ui-fabric-react/lib/ColorPicker';
-
-import { ChoiceGroup } from 'office-ui-fabric-react/lib/ChoiceGroup';
-import { TeachingBubbleBasicExample } from '../../components/TeachingBubble/examples/TeachingBubble.Basic.Example';
-import { TextFieldBasicExample } from '../TextField/examples/TextField.Basic.Example';
-import { ToggleBasicExample } from '../../components/Toggle/examples/Toggle.Basic.Example';
-import { ProgressIndicatorBasicExample } from '../ProgressIndicator/examples/ProgressIndicator.Basic.Example';
-
-export interface IThemeGeneratorPageState {
-  themeRules: IThemeRules;
-  colorPickerSlotRule: IThemeSlotRule | null;
-  colorPickerElement: HTMLElement | null;
-  colorPickerVisible: boolean;
-}
-
-const BackgroundImageUriKey = 'backgroundImageUri';
-const BackgroundOverlayKey = 'backgroundOverlay';
-
-export class ThemeGeneratorPage extends React.Component<any, IThemeGeneratorPageState> {
-
-  private _imgUrl: string;
-
-  constructor() {
-    super();
-
-    let themeRules = themeRulesStandardCreator();
-    ThemeGenerator.insureSlots(themeRules, isDark(themeRules[BaseSlots[BaseSlots.backgroundColor]].color!));
-
-    this.state = {
-      themeRules: themeRules,
-      colorPickerSlotRule: null,
-      colorPickerElement: null,
-      colorPickerVisible: false
-    };
-  }
-
-  public render() {
-    let { colorPickerVisible, colorPickerSlotRule, colorPickerElement } = this.state;
-
-    let fabricThemeSlots =
-      [this._fabricSlotWidget(FabricSlots.themeDarker),
-      this._fabricSlotWidget(FabricSlots.themeDark),
-      this._fabricSlotWidget(FabricSlots.themeDarkAlt),
-      this._fabricSlotWidget(FabricSlots.themePrimary),
-      this._fabricSlotWidget(FabricSlots.themeSecondary),
-      this._fabricSlotWidget(FabricSlots.themeTertiary),
-      this._fabricSlotWidget(FabricSlots.themeLight),
-      this._fabricSlotWidget(FabricSlots.themeLighter),
-      this._fabricSlotWidget(FabricSlots.themeLighterAlt)];
-    let fabricNeutralForegroundSlots =
-      [this._fabricSlotWidget(FabricSlots.black),
-      this._fabricSlotWidget(FabricSlots.neutralDark),
-      this._fabricSlotWidget(FabricSlots.neutralPrimary),
-      this._fabricSlotWidget(FabricSlots.neutralSecondary),
-      this._fabricSlotWidget(FabricSlots.neutralTertiary)
-      ];
-    let fabricNeutralBackgroundSlots =
-      [this._fabricSlotWidget(FabricSlots.neutralTertiaryAlt),
-      this._fabricSlotWidget(FabricSlots.neutralQuaternary),
-      this._fabricSlotWidget(FabricSlots.neutralQuaternaryAlt),
-      this._fabricSlotWidget(FabricSlots.neutralLight),
-      this._fabricSlotWidget(FabricSlots.neutralLighter),
-      this._fabricSlotWidget(FabricSlots.neutralLighterAlt),
-      this._fabricSlotWidget(FabricSlots.white)];
-
-    let semanticSlots =
-      [this._semanticSlotWidget(SemanticColorSlots.bodyBackground),
-      this._semanticSlotWidget(SemanticColorSlots.bodyText),
-      this._semanticSlotWidget(SemanticColorSlots.disabledBackground),
-      this._semanticSlotWidget(SemanticColorSlots.disabledText)];
-
-    return (
-      <div className='ms-themer'>
-        <p>
-          This is the Theme Generator tool, which helps you easily create all the shades and slots for a custom theme.
-          The theme can be used by Fabric React's styling package, see the <a href='https://github.com/OfficeDev/office-ui-fabric-react/tree/master/packages/styling'>documentation</a>.
-          <br />
-          As you modify one of the three base colors, the theme will update automatically based on predefined rules. You can modify each individual slot below as well.
-        </p>
-
-        {/* Hello! You've found hidden functionality for generating a theme from an image. This uses Microsoft's
-          * Cognitive Vision API, documented here:
-          * https://docs.microsoft.com/en-us/azure/cognitive-services/computer-vision/quickstarts/javascript
-          * We use that API to identify the most prominent background and foreground colors, and the accent color,
-          * and generate a theme based off of those.
-          * Since this API requires a personal subscription key, you'll have to enlist and insert your subscription
-          * key in _makeThemeFromImg() below. Then, just uncomment this section. */}
-        {/*}
-        <div style={ { display: 'flex' } }>
-          <div>URL to image:&nbsp;</div>
-          <input type='text' id='imageUrl' />
-          <button onClick={ this._makeThemeFromImg }>Create theme from image</button>
-        </div>
-        <div id='imageDescription' />
-        <div><img id='imagePreview' style={ { maxHeight: '500px', maxWidth: '800px' } } /></div>
-        {*/}
-
-        {/* the shared popup color picker for slots */ }
-        { colorPickerVisible && colorPickerSlotRule !== null && colorPickerSlotRule !== undefined && colorPickerElement &&
-          <Callout
-            key={ colorPickerSlotRule.name }
-            gapSpace={ 10 }
-            targetElement={ colorPickerElement }
-            setInitialFocus={ true }
-            onDismiss={ this._colorPickerOnDismiss }
-          >
-            <ColorPicker
-              color={ colorPickerSlotRule.color!.str }
-              onColorChanged={ this._semanticSlotRuleChanged.bind(this, colorPickerSlotRule) }
-            />
-          </Callout>
-        }
-
-        {/* the three base slots, prominently displayed at the top of the page */ }
-        <div style={ { display: 'flex' } }>
-          { [this._baseColorSlotPicker(BaseSlots.primaryColor, 'Primary theme color'),
-          this._baseColorSlotPicker(BaseSlots.foregroundColor, 'Body text color'),
-          this._baseColorSlotPicker(BaseSlots.backgroundColor, 'Body background color')] }
-        </div>
-        <br />
-
-        { this._outputSection() }
-        <br />
-
-        <h2>Fabric Palette</h2>
-        <p>The original Fabric palette slots. These are raw colors with no prescriptive uses. Each one is a shade or tint of a base color.</p>
-        <div className={ 'ms-themer-fabricPalette-root' }>
-          <div>{ fabricThemeSlots }</div>
-          <div>
-            <p>generally used for text and foregrounds</p>
-            { fabricNeutralForegroundSlots }
-          </div>
-          <div>
-            <p>generally used for backgrounds</p>
-            { fabricNeutralBackgroundSlots }
-          </div>
-        </div>
-        <br />
-
-        <h2>Semantic Slots</h2>
-        <p>These slots inherit by default from the Fabric palette, and have an intended use as defined by their name. They exist so classes of controls can be easily customized at once. See the <a href='https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/styling/src/interfaces/ISemanticColors.ts'>documentation</a> for more details.</p>
-        <div>{ semanticSlots }</div>
-        <br />
-
-        <h3>Samples</h3>
-        { <div style={ { display: 'flex', flexDirection: 'row' } }>
-          <div className='ms-themer-example'>
-            <TextFieldBasicExample />
-          </div>
-          <div className='ms-themer-example'>
-            <ToggleBasicExample />
-            <ChoiceGroup
-              options={ [
-                {
-                  key: 'A',
-                  text: 'Option A'
-                },
-                {
-                  key: 'B',
-                  text: 'Option B',
-                  checked: true
-                }] }
-              label='Pick one'
-              required={ true }
-            />,
-            <ChoiceGroup
-              options={ [
-                {
-                  key: 'C',
-                  text: 'Option C',
-                  disabled: true
-                },
-                {
-                  key: 'D',
-                  text: 'Option D',
-                  checked: true,
-                  disabled: true
-                }] }
-              label='Pick one'
-              required={ true }
-            />
-          </div>
-          <div className='ms-themer-example'>
-            <TeachingBubbleBasicExample />
-            <br />
-            <ProgressIndicatorBasicExample />
-          </div>
-        </div> }
-
-        <h3>Accessibility</h3>
-        <p>Each pair of colors below should produce legible text and have a minimum contrast ratio of 4.5.</p>
-        <table className='ms-themer-accessibilityTable'><tbody>
-          { [this._accessibilityRow(SemanticColorSlots.bodyText, SemanticColorSlots.bodyBackground),
-          this._accessibilityRow(SemanticColorSlots.disabledText, SemanticColorSlots.bodyBackground),
-          this._accessibilityRow(SemanticColorSlots.disabledText, SemanticColorSlots.disabledBackground)] }
-        </tbody></table>
-      </div>
-    );
-  }
-
-  @autobind
-  /* tslint:disable:no-unused-variable */
-  private _makeThemeFromImg() {
-    /* tslint:enable:no-unused-variable */
-    this._imgUrl = (document.getElementById('imageUrl') as HTMLInputElement).value;
-    (document.getElementById('imagePreview') as HTMLImageElement).src = this._imgUrl;
-
-    if (this._imgUrl) {
-      let xhr = new XMLHttpRequest();
-      xhr.addEventListener('load', this._cognitiveVisionCallback.bind(this));
-      // you may need to change the URL here
-      xhr.open('POST', 'https://westus.api.cognitive.microsoft.com/vision/v1.0/analyze?visualFeatures=Description%2CColor&details=&language=en');
-      xhr.setRequestHeader('Content-Type', 'application/json');
-      alert('You forgot to set the subscription key!');
-      xhr.setRequestHeader('Ocp-Apim-Subscription-Key', 'YourSubscriptionKeyHere'); // put your subscription key here
-      xhr.send('{ "url": "' + this._imgUrl + '" }');
-    } else {
-      // remove related properties from theme
-      let { themeRules } = this.state;
-      if (themeRules.hasOwnProperty(BackgroundImageUriKey)) {
-        delete themeRules[BackgroundImageUriKey];
-      }
-      if (themeRules.hasOwnProperty(BackgroundOverlayKey)) {
-        delete themeRules[BackgroundOverlayKey];
-      }
-      this.setState({ themeRules: themeRules }, this._makeNewTheme);
-    }
-  }
-
-  @autobind
-  private _cognitiveVisionCallback(e: any) {
-    const xhr = e.target;
-    if (xhr.status === 200) {
-      const response = JSON.parse(xhr.response);
-
-      document.getElementById('imageDescription')!.innerHTML = response.description.captions[0].text;
-
-      /* API returns:
-       response.color.accentColor
-       response.color.dominantColorBackground
-       response.color.dominantColorForeground */
-
-      // converts a returned color from a word into a hex value conforming to our palette
-      const getHexFromColor = (color: string, isBg: boolean) => {
-        // todo: could use more logic based on isInverted and isBg
-        switch (color.toLowerCase()) {
-          case 'black': return '#1f1f1f';
-          case 'blue': return '#0078d7';
-          case 'brown': return '#754d12';
-          case 'gray':
-          case 'grey': return isBg ? '#444' : '#ccc';
-          case 'green': return '#107c10';
-          case 'orange': return '#ff8c00';
-          case 'pink': return '#e3008c';
-          case 'purple': return '#5c2d91';
-          case 'red': return '#e81123';
-          case 'teal': return '#008272';
-          case 'white': return '#fff';
-          case 'yellow': return '#fff100';
-        }
-        alert('Error: Unexpected color passed to getHexFromColor(): ' + color);
-        return '#fff';
-      };
-
-      let { themeRules } = this.state;
-      const bgColor = getHexFromColor(response.color.dominantColorBackground, true);
-      const bgColorIsDark = isDark(getColorFromString(bgColor));
-      ThemeGenerator.setSlot(
-        themeRules[BaseSlots[BaseSlots.backgroundColor]],
-        bgColor,
-        themeRules,
-        bgColorIsDark,
-        true,
-        true);
-      ThemeGenerator.setSlot(
-        themeRules[BaseSlots[BaseSlots.primaryColor]],
-        '#' + response.color.accentColor,
-        themeRules,
-        bgColorIsDark,
-        true,
-        true);
-      ThemeGenerator.setSlot(
-        themeRules[BaseSlots[BaseSlots.foregroundColor]],
-        getHexFromColor(response.color.dominantColorForeground, false),
-        themeRules,
-        bgColorIsDark,
-        true,
-        true);
-
-      themeRules[BackgroundImageUriKey] = {
-        name: BackgroundImageUriKey,
-        value: 'url(\'' + this._imgUrl + '\')'
-      };
-      themeRules[BackgroundOverlayKey] = {
-        name: BackgroundOverlayKey,
-        color: updateA((themeRules[BaseSlots[BaseSlots.backgroundColor]]).color!, 50)
-      };
-
-      this.setState({ themeRules: themeRules }, this._makeNewTheme);
-
-    } else {
-      alert('Error ' + xhr.status + ': ' + xhr.statusText);
-    }
-  }
-
-  @autobind
-  private _colorPickerOnDismiss() {
-    this.setState({ colorPickerVisible: false });
-  }
-
-  @autobind
-  private _semanticSlotRuleChanged(slotRule: IThemeSlotRule, color: string) {
-    let { themeRules } = this.state;
-
-    ThemeGenerator.setSlot(slotRule, color, themeRules, isDark(themeRules[BaseSlots[BaseSlots.backgroundColor]].color!), true, true);
-    this.setState({ themeRules: themeRules }, this._makeNewTheme);
-  }
-
-  @autobind
-  private _onSwatchClick(slotRule: IThemeSlotRule, ev: React.MouseEvent<HTMLElement>) {
-    let { colorPickerSlotRule, colorPickerElement } = this.state;
-
-    if (colorPickerSlotRule !== null && colorPickerSlotRule !== undefined && !!colorPickerElement && colorPickerSlotRule === slotRule && colorPickerElement === ev.target) { // same one, close it
-      this.setState({ colorPickerVisible: false, colorPickerSlotRule: null, colorPickerElement: null });
-    } else { // new one, open it
-      this.setState({ colorPickerVisible: true, colorPickerSlotRule: slotRule, colorPickerElement: ev.target as HTMLElement });
-    }
-  }
-
-  @autobind
-  private _slotWidget(slotRule: IThemeSlotRule) {
-    return (
-      <div key={ slotRule.name } className='ms-themer-slot'>
-        { this._colorSquareSwatchWidget(slotRule) }
-        <div>
-          <div>{ slotRule.name }</div>
-          { !slotRule.isCustomized ?
-            <div>Inherits from: { slotRule.inherits!.name }</div>
-            : <div>Customized</div> }
-        </div>
-      </div>
-    );
-  }
-
-  @autobind
-  private _semanticSlotWidget(semanticSlot: SemanticColorSlots) {
-    return this._slotWidget(this.state.themeRules[SemanticColorSlots[semanticSlot]]);
-  }
-
-  @autobind
-  private _fabricSlotWidget(fabricSlot: FabricSlots) {
-    return this._slotWidget(this.state.themeRules[FabricSlots[fabricSlot]]);
-  }
-
-  private _colorSquareSwatchWidget(slotRule: IThemeSlotRule) {
-    return (
-      <div
-        key={ slotRule.name }
-        className='ms-themer-swatch'
-        style={ { backgroundColor: slotRule.color!.str } }
-        onClick={ this._onSwatchClick.bind(this, slotRule) }
-      />
-    );
-  }
-
-  @autobind
-  private _accessibilityRow(foreground: SemanticColorSlots, background: SemanticColorSlots) {
-    let themeRules = this.state.themeRules;
-    let bgc: IColor = themeRules[SemanticColorSlots[background]].color!;
-    let fgc: IColor = themeRules[SemanticColorSlots[foreground]].color!;
-
-    let contrastRatio = getContrastRatio(bgc, fgc);
-    let contrastRatioString = String(contrastRatio);
-    contrastRatioString = contrastRatioString.substr(0, contrastRatioString.indexOf('.') + 3);
-    if (contrastRatio < 4.5) {
-      contrastRatioString = '**' + contrastRatioString + '**';
-    }
-
-    return (
-      <tr key={ String(foreground) + String(background) }>
-        <td style={ { backgroundColor: bgc.str, color: fgc.str } }>The quick brown fox jumps over the lazy dog.</td>
-        <td>{ contrastRatioString }</td>
-        <td>{ SemanticColorSlots[foreground] + ' + ' + SemanticColorSlots[background] }</td>
-      </tr>
-    );
-  }
-
-  @autobind
-  private _outputSection() {
-    const themeRules = this.state.themeRules;
-
-    // strip out the unnecessary shade slots from the final output theme
-    let abridgedTheme: IThemeRules = {};
-    for (let ruleName in themeRules) {
-      if (themeRules.hasOwnProperty(ruleName)) {
-        if (ruleName.indexOf('ColorShade') === -1 && ruleName !== 'primaryColor' && ruleName !== 'backgroundColor' && ruleName !== 'foregroundColor') {
-          abridgedTheme[ruleName] = themeRules[ruleName];
-        }
-      }
-    }
-
-    return (
-      <div>
-        <h2>Output</h2>
-        <div className={ 'ms-themer-output-root' }>
-          <div>
-            <h3>JSON</h3>
-            <textarea
-              readOnly={ true }
-              spellCheck={ false }
-              value={ JSON.stringify(ThemeGenerator.getThemeAsJson(abridgedTheme), void 0, 2) }
-            />
-          </div>
-          <div>
-            <h3>SASS</h3>
-            <textarea
-              readOnly={ true }
-              spellCheck={ false }
-              value={ ThemeGenerator.getThemeAsSass(abridgedTheme) }
-            />
-          </div>
-          <div>
-            <h3>PowerShell</h3>
-            <textarea
-              readOnly={ true }
-              spellCheck={ false }
-              value={ ThemeGenerator.getThemeForPowerShell(abridgedTheme) }
-            />
-          </div>
-        </div>
-      </div>
-    );
-  }
-
-  @autobind
-  private _makeNewTheme() {
-    let themeAsJson: { [key: string]: string } = ThemeGenerator.getThemeAsJson(this.state.themeRules);
-    console.log('New theme...', themeAsJson);
-    document.body.style.backgroundColor = themeAsJson.backgroundColor;
-    document.body.style.color = themeAsJson.bodyText;
-    loadTheme({ palette: themeAsJson });
-  }
-
-  @autobind
-  private _baseColorSlotPicker(baseSlot: BaseSlots, title: string) {
-    function _onColorChanged(newColor: string) {
-      let themeRules = this.state.themeRules;
-      const currentIsDark = isDark(themeRules[BaseSlots[BaseSlots.backgroundColor]].color!);
-      ThemeGenerator.setSlot(
-        themeRules[BaseSlots[baseSlot]],
-        newColor,
-        themeRules,
-        currentIsDark,
-        true,
-        true);
-      if (currentIsDark !== isDark(themeRules[BaseSlots[BaseSlots.backgroundColor]].color!)) {
-        // isInverted got swapped, so need to refresh slots with new shading rules
-        ThemeGenerator.insureSlots(themeRules, !currentIsDark);
-      }
-      this.setState({ themeRules: themeRules }, this._makeNewTheme);
-    }
-
-    return (
-      <div className='ms-themer-paletteSlot' key={ baseSlot }>
-        <h3>{ title }</h3>
-        <div style={ { display: 'inline-block' } }>
-          <ColorPicker
-            key={ 'baseslotcolorpicker' + baseSlot }
-            color={ this.state.themeRules[BaseSlots[baseSlot]].color!.str }
-            /* tslint:disable:jsx-no-bind */
-            onColorChanged={ _onColorChanged.bind(this) }
-          /* tslint:enable:jsx-no-bind */
-          />
-        </div>
-        <div className='ms-themer-swatchBg' style={ { backgroundColor: this.state.themeRules[BaseSlots[baseSlot]].color!.str } }>
-          <div className='ms-themer-swatch' style={ { backgroundColor: this.state.themeRules[BaseSlots[baseSlot]].color!.str } } />
-          { [this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade1']),
-          this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade2']),
-          this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade3']),
-          this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade4']),
-          this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade5']),
-          this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade6']),
-          this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade7']),
-          this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade8'])] }
-        </div>
-      </div>
-    );
-  }
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
deleted file mode 100644
index 40df2f017dd54..0000000000000
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
+++ /dev/null
@@ -1,215 +0,0 @@
-import { Shade } from '../../utilities/color/shades';
-import { getColorFromString } from '../../utilities/color/colors';
-import { mapEnumByName } from '../../Utilities';
-
-import { IThemeRules } from './IThemeRules';
-
-/* This is the set of rules for our default theme.
-   We start with three base slots, defining the background, foreground (text), and
-   primary color (sometimes called theme color). Each Fabric slot is generated from
-   shades (or tints) of one of those three, creating the Fabric palette.
-   Then, we have semantic slots, the new thing intended to eventually replace the
-   Fabric palette. The semantic slots inherit from the Fabric palette. */
-
-/* The most minimal set of slots we start with. All other ones can be generated based on rules.
- * This is not so much an enum as it is a list. The enum is used to insure "type"-safety.
- * For now, we are only dealing with color. */
-export enum BaseSlots {
-  primaryColor,
-  backgroundColor,
-  foregroundColor
-}
-
-/* The original Fabric palette, only for back-compat. */
-export enum FabricSlots {
-  themePrimary, // BaseSlots.primaryColor, Shade[Shade.Unshaded]);
-  themeLighterAlt, // BaseSlots.primaryColor, Shade[Shade.Shade1]);
-  themeLighter, // BaseSlots.primaryColor, Shade[Shade.Shade2]);
-  themeLight, // BaseSlots.primaryColor, Shade[Shade.Shade3]);
-  themeTertiary, // BaseSlots.primaryColor, Shade[Shade.Shade4]);
-  themeSecondary, // BaseSlots.primaryColor, Shade[Shade.Shade5]);
-  themeDarkAlt, // BaseSlots.primaryColor, Shade[Shade.Shade6]);
-  themeDark, // BaseSlots.primaryColor, Shade[Shade.Shade7]);
-  themeDarker, // BaseSlots.primaryColor, Shade[Shade.Shade8]);
-
-  neutralLighterAlt, // BaseSlots.backgroundColor, Shade[Shade.Shade1]);
-  neutralLighter, // BaseSlots.backgroundColor, Shade[Shade.Shade2]);
-  neutralLight, // BaseSlots.backgroundColor, Shade[Shade.Shade3]);
-  neutralQuaternaryAlt, // BaseSlots.backgroundColor, Shade[Shade.Shade4]);
-  neutralQuaternary, // BaseSlots.backgroundColor, Shade[Shade.Shade5]);
-  neutralTertiaryAlt, // BaseSlots.backgroundColor, Shade[Shade.Shade6]); // bg6 or fg2
-  neutralTertiary, // BaseSlots.foregroundColor, Shade[Shade.Shade3]);
-  // deprecated: neutralSecondaryAlt, // BaseSlots.foregroundColor, Shade[Shade.Shade4]);
-  neutralSecondary, // BaseSlots.foregroundColor, Shade[Shade.Shade5]);
-  neutralPrimaryAlt, // BaseSlots.foregroundColor, Shade[Shade.Shade6]);
-  neutralPrimary, // BaseSlots.foregroundColor, Shade[Shade.Unshaded]);
-  neutralDark, // BaseSlots.foregroundColor, Shade[Shade.Shade7]);
-
-  black, // BaseSlots.foregroundColor, Shade[Shade.Shade8]);
-  white, // BaseSlots.backgroundColor, Shade[Shade.Unshaded]);
-}
-
-/* List of all the semantic color slots for this theme.
- * This is not so much an enum as it is a list. The enum is used to insure "type"-safety. */
-export enum SemanticColorSlots {
-  bodyBackground,
-  bodyText,
-  disabledBackground,
-  disabledText
-}
-
-export function themeRulesStandardCreator() {
-  let slotRules: IThemeRules = {};
-
-  /*** BASE COLORS and their SHADES */
-  // iterate through each base slot and make the SlotRules for those
-  mapEnumByName(BaseSlots, (baseSlot: string) => {
-    // first make the SlotRule for the unshaded base Color
-    slotRules[baseSlot] = {
-      name: baseSlot,
-      isCustomized: true
-    };
-
-    // then make a rule for each shade of this base color, but skip unshaded
-    mapEnumByName(Shade, (shadeName: string, shadeValue) => {
-      if (shadeName === Shade[Shade.Unshaded]) {
-        return;
-      }
-      slotRules[baseSlot + shadeName] = {
-        name: baseSlot + shadeName,
-        inherits: slotRules[baseSlot],
-        asShade: shadeValue,
-        isCustomized: false,
-        isBackgroundShade: baseSlot === BaseSlots[BaseSlots.backgroundColor] ? true : false
-      };
-      return void 0;
-    });
-
-    return void 0;
-  });
-
-  // set default colors for the base colors
-  slotRules[BaseSlots[BaseSlots.primaryColor]].color = getColorFromString('#0078d7');
-  slotRules[BaseSlots[BaseSlots.backgroundColor]].color = getColorFromString('#fff');
-  slotRules[BaseSlots[BaseSlots.foregroundColor]].color = getColorFromString('#333');
-
-  // set default colors for shades (the slot rules were already created above and will be used if the base colors ever change)
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade1]].color = getColorFromString('#eff6fc');
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade2]].color = getColorFromString('#deecf9');
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade3]].color = getColorFromString('#c7e0f4');
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade4]].color = getColorFromString('#71afe5');
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade5]].color = getColorFromString('#2b88d8');
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade6]].color = getColorFromString('#106ebe');
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade7]].color = getColorFromString('#005a9e');
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade8]].color = getColorFromString('#004578');
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade1]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade2]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade3]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade4]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade5]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade6]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade7]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade8]].isCustomized = true;
-
-  // set default colors for shades (the slot rules were already created above and will be used if the base colors ever change)
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade1]].color = getColorFromString('#eaeaea');
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade2]].color = getColorFromString('#c8c8c8');
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade3]].color = getColorFromString('#a6a6a6');
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade4]].color = getColorFromString('#767676');
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade5]].color = getColorFromString('#666666');
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade6]].color = getColorFromString('#3c3c3c');
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade7]].color = getColorFromString('#212121');
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade8]].color = getColorFromString('#000000');
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade1]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade2]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade3]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade4]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade5]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade6]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade7]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade8]].isCustomized = true;
-
-  function _makeFabricSlotRule(slotName: string, inheritedBase: BaseSlots, inheritedShade: Shade, isBackgroundShade = false) {
-    slotRules[slotName] = {
-      name: slotName,
-      inherits: slotRules[BaseSlots[inheritedBase]],
-      asShade: inheritedShade,
-      isCustomized: false,
-      isBackgroundShade: isBackgroundShade
-    };
-  }
-  _makeFabricSlotRule(FabricSlots[FabricSlots.themePrimary], BaseSlots.primaryColor, Shade.Unshaded);
-  _makeFabricSlotRule(FabricSlots[FabricSlots.themeLighterAlt], BaseSlots.primaryColor, Shade.Shade1);
-  _makeFabricSlotRule(FabricSlots[FabricSlots.themeLighter], BaseSlots.primaryColor, Shade.Shade2);
-  _makeFabricSlotRule(FabricSlots[FabricSlots.themeLight], BaseSlots.primaryColor, Shade.Shade3);
-  _makeFabricSlotRule(FabricSlots[FabricSlots.themeTertiary], BaseSlots.primaryColor, Shade.Shade4);
-  _makeFabricSlotRule(FabricSlots[FabricSlots.themeSecondary], BaseSlots.primaryColor, Shade.Shade5);
-  _makeFabricSlotRule(FabricSlots[FabricSlots.themeDarkAlt], BaseSlots.primaryColor, Shade.Shade6);
-  _makeFabricSlotRule(FabricSlots[FabricSlots.themeDark], BaseSlots.primaryColor, Shade.Shade7);
-  _makeFabricSlotRule(FabricSlots[FabricSlots.themeDarker], BaseSlots.primaryColor, Shade.Shade8);
-
-  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralLighterAlt], BaseSlots.backgroundColor, Shade.Shade1, true);
-  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralLighter], BaseSlots.backgroundColor, Shade.Shade2, true);
-  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralLight], BaseSlots.backgroundColor, Shade.Shade3, true);
-  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralQuaternaryAlt], BaseSlots.backgroundColor, Shade.Shade4, true);
-  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralQuaternary], BaseSlots.backgroundColor, Shade.Shade5, true);
-  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralTertiaryAlt], BaseSlots.backgroundColor, Shade.Shade6, true); // bg6 or fg2
-  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralTertiary], BaseSlots.foregroundColor, Shade.Shade3);
-  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralSecondary], BaseSlots.foregroundColor, Shade.Shade5);
-  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralPrimaryAlt], BaseSlots.foregroundColor, Shade.Shade6);
-  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralPrimary], BaseSlots.foregroundColor, Shade.Unshaded);
-  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralDark], BaseSlots.foregroundColor, Shade.Shade7);
-
-  _makeFabricSlotRule(FabricSlots[FabricSlots.black], BaseSlots.foregroundColor, Shade.Shade8);
-  _makeFabricSlotRule(FabricSlots[FabricSlots.white], BaseSlots.backgroundColor, Shade.Unshaded, true);
-
-  // manually set initial colors for the primary-based Fabric slots to match the default theme
-  slotRules[FabricSlots[FabricSlots.themeLighterAlt]].color = getColorFromString('#eff6fc');
-  slotRules[FabricSlots[FabricSlots.themeLighter]].color = getColorFromString('#deecf9');
-  slotRules[FabricSlots[FabricSlots.themeLight]].color = getColorFromString('#c7e0f4');
-  slotRules[FabricSlots[FabricSlots.themeTertiary]].color = getColorFromString('#71afe5');
-  slotRules[FabricSlots[FabricSlots.themeSecondary]].color = getColorFromString('#2b88d8');
-  slotRules[FabricSlots[FabricSlots.themeDarkAlt]].color = getColorFromString('#106ebe');
-  slotRules[FabricSlots[FabricSlots.themeDark]].color = getColorFromString('#005a9e');
-  slotRules[FabricSlots[FabricSlots.themeDarker]].color = getColorFromString('#004578');
-  slotRules[FabricSlots[FabricSlots.themeLighterAlt]].isCustomized = true;
-  slotRules[FabricSlots[FabricSlots.themeLighter]].isCustomized = true;
-  slotRules[FabricSlots[FabricSlots.themeLight]].isCustomized = true;
-  slotRules[FabricSlots[FabricSlots.themeTertiary]].isCustomized = true;
-  slotRules[FabricSlots[FabricSlots.themeSecondary]].isCustomized = true;
-  slotRules[FabricSlots[FabricSlots.themeDarkAlt]].isCustomized = true;
-  slotRules[FabricSlots[FabricSlots.themeDark]].isCustomized = true;
-  slotRules[FabricSlots[FabricSlots.themeDarker]].isCustomized = true;
-
-  // todo: can remove this once we remove these outdated slots from the product
-  let primaryBackground = 'primaryBackground';
-  slotRules[primaryBackground] = {
-    name: primaryBackground,
-    inherits: slotRules[FabricSlots[FabricSlots.white]],
-    isCustomized: false
-  };
-  let primaryText = 'primaryText';
-  slotRules[primaryText] = {
-    name: primaryText,
-    inherits: slotRules[FabricSlots[FabricSlots.neutralPrimary]],
-    isCustomized: false
-  };
-
-  /*** SEMANTIC SLOTS */
-  // create the SlotRule for a semantic slot
-  function _makeSemanticSlotRule(semanticSlot: SemanticColorSlots, inheritedFabricSlot: FabricSlots) {
-    slotRules[SemanticColorSlots[semanticSlot]] = {
-      name: SemanticColorSlots[semanticSlot],
-      inherits: slotRules[FabricSlots[inheritedFabricSlot]],
-      isCustomized: false
-    };
-  }
-
-  // Basics simple content slots
-  _makeSemanticSlotRule(SemanticColorSlots.bodyBackground, FabricSlots.white);
-  _makeSemanticSlotRule(SemanticColorSlots.bodyText, FabricSlots.neutralPrimary);
-  _makeSemanticSlotRule(SemanticColorSlots.disabledBackground, FabricSlots.neutralLighter);
-  _makeSemanticSlotRule(SemanticColorSlots.disabledText, FabricSlots.neutralTertiaryAlt);
-
-  return slotRules;
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/index.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/index.ts
deleted file mode 100644
index e9dbaa867d220..0000000000000
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/index.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export * from './ThemeGenerator';
-export * from './IThemeSlotRule';
-export * from './IThemeRules';
-export * from './ThemeRulesStandard';
diff --git a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
index 169924b84986a..b581aab573a1e 100644
--- a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
+++ b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
@@ -338,18 +338,12 @@ export const AppDefinition: IAppDefinition = {
           name: 'Themes',
           url: '#examples/themes'
         },
-        {
-          component: require<any>('../components/ThemeGenerator/ThemeGeneratorPage').ThemeGeneratorPage,
-          key: 'Theme Generator',
-          name: 'Beta Theme Generator',
-          url: '#examples/themeGenerator'
-        },
         {
           component: require<any>('./ComponentStatus/ComponentStatusPage').ComponentStatusPage,
           key: 'Components Status',
           name: 'Components Checklist',
           url: '#/components-status'
-        }
+        },
       ],
       name: 'Utilities'
     }
diff --git a/packages/office-ui-fabric-react/src/utilities/color/index.ts b/packages/office-ui-fabric-react/src/utilities/color/index.ts
index 9b04c762c9349..1bae1c0e497ca 100644
--- a/packages/office-ui-fabric-react/src/utilities/color/index.ts
+++ b/packages/office-ui-fabric-react/src/utilities/color/index.ts
@@ -1,2 +1 @@
 export * from './colors';
-export * from './shades';
diff --git a/packages/office-ui-fabric-react/src/utilities/color/shades.ts b/packages/office-ui-fabric-react/src/utilities/color/shades.ts
deleted file mode 100644
index 8a5178887ca35..0000000000000
--- a/packages/office-ui-fabric-react/src/utilities/color/shades.ts
+++ /dev/null
@@ -1,191 +0,0 @@
-// Technically this should be shades and tints, but for simplicity we'll call everything a shade.
-/* This utility module is used with theming. Given a color to shade, whether the theme is inverted (i.e. is a dark color),
- * and the desired shade enum, this will return an appropriate shade of that color.
- */
-import {
-  IColor,
-  MAX_COLOR_RGBA
-} from './colors';
-import * as Colors from './colors';
-import { assign } from '../../Utilities';
-
-// Soften: to get closer to the background color's luminance (softening with a white background would be lightening, with black it'd be darkening)
-// Strongen: opposite of soften
-
-// Luminance multiplier constants for generating shades of a given color
-const WhiteShadeTableBG = [.973, .957, .918, .855, .816, .784, .651, .463]; // white bg
-const BlackTintTableBG = [.463, .55, .651, .784, .816, .855, .918, .957]; // black bg
-const WhiteShadeTable = [.463, .651, .784, .816, .855, .918, .957, .973]; // white fg
-const BlackTintTable = [.463, .55, .651, .784, .816, .855, .918, .957]; // black fg
-const LumTintTable = [.12, .23, .34, .45, .56, .67, .78, .89]; // light (strongen all)
-const LumShadeTable = [.89, .78, .67, .56, .45, .34, .23, .12]; // dark (soften all)
-const ColorTintTable = [.050, .100, .200, .42, .90]; // default soften
-const ColorShadeTable = [.90, .70, .550]; // default strongen
-
-// If the given shade's luminance is below/above these values, we'll swap to using the White/Black tables above
-const c_LuminanceLow = 0.2;
-const c_LuminanceHigh = 0.8;
-
-/** Shades of a given color, from softest to strongest. */
-export enum Shade {
-  Unshaded = 0,
-  Shade1 = 1,
-  Shade2 = 2,
-  Shade3 = 3,
-  Shade4 = 4,
-  Shade5 = 5,
-  Shade6 = 6,
-  Shade7 = 7,
-  Shade8 = 8,
-  // remember to update isValidShade()!
-}
-
-/**
- * Returns true if the argument is a valid Shade value
- * @param {Shade} shade The Shade value to validate.
- */
-export function isValidShade(shade?: Shade): boolean {
-  'use strict';
-  return (typeof shade === 'number') && (shade >= Shade.Unshaded) && (shade <= Shade.Shade8);
-}
-
-function _isBlack(color: IColor): boolean {
-  return color.r === 0 && color.g === 0 && color.b === 0;
-}
-
-function _isWhite(color: IColor): boolean {
-  return color.r === MAX_COLOR_RGBA && color.g === MAX_COLOR_RGBA && color.b === MAX_COLOR_RGBA;
-}
-
-function _darken(hsl: { h: number, s: number, l: number }, factor: number) {
-  return {
-    h: hsl.h,
-    s: hsl.s,
-    l: hsl.l * factor
-  };
-}
-
-function _lighten(hsl: { h: number, s: number, l: number }, factor: number) {
-  return {
-    h: hsl.h,
-    s: hsl.s,
-    l: hsl.l * factor + (100 * (1 - factor))
-  };
-}
-
-export function isDark(color: IColor) {
-  return Colors.hsv2hsl(color.h, color.s, color.v).l < 50;
-}
-
-/**
- * Given a color and a shade specification, generates the requested shade of the color.
- * Logic:
- * if white
- *  darken via tables defined above
- * if black
- *  lighten
- * if light
- *  strongen
- * if dark
- *  soften
- * else default
- *  soften or strongen depending on shade#
- * @param {IColor} color The base color whose shade is to be computed
- * @param {Shade} shade The shade of the base color to compute
- * @param {Boolean} isInverted Default false. Whether the given theme is inverted (reverse strongen/soften logic)
- */
-export function getShade(color: IColor, shade: Shade, isInverted = false) {
-  'use strict';
-  if (!color) {
-    return null;
-  }
-
-  if (shade === Shade.Unshaded || !isValidShade(shade)) {
-    return color;
-  }
-
-  let hsl = Colors.hsv2hsl(color.h, color.s, color.v);
-  let tableIndex = shade - 1;
-  let _soften = _lighten;
-  let _strongen = _darken;
-  if (isInverted) {
-    // tableIndex = LumTintTable.length - 1 - tableIndex;
-    _soften = _darken;
-    _strongen = _lighten;
-  }
-  if (_isWhite(color)) { // white
-    hsl = _darken(hsl, WhiteShadeTable[tableIndex]);
-  } else if (_isBlack(color)) { // black
-    hsl = _lighten(hsl, BlackTintTable[tableIndex]);
-  } else if (hsl.l / 100 > c_LuminanceHigh) { // light
-    hsl = _strongen(hsl, LumShadeTable[tableIndex]);
-  } else if (hsl.l / 100 < c_LuminanceLow) { // dark
-    hsl = _soften(hsl, LumTintTable[tableIndex]);
-  } else { // default
-    if (tableIndex < ColorTintTable.length) {
-      hsl = _soften(hsl, ColorTintTable[tableIndex]);
-    } else {
-      hsl = _strongen(hsl, ColorShadeTable[tableIndex - ColorTintTable.length]);
-    }
-  }
-
-  return Colors.getColorFromRGBA(assign(Colors.hsl2rgb(hsl.h, hsl.s, hsl.l), { a: color.a }));
-}
-
-// Background shades/tints are generated differently. The provided color will be guaranteed
-//   to be the darkest or lightest one. If it is <50% luminance, it will always be the darkest,
-//   otherwise it will always be the lightest.
-export function getBackgroundShade(color: IColor, shade: Shade, isInverted = false) {
-  'use strict';
-  if (!color) {
-    return null;
-  }
-
-  if (shade === Shade.Unshaded || !isValidShade(shade)) {
-    return color;
-  }
-
-  let hsl = Colors.hsv2hsl(color.h, color.s, color.v);
-  let tableIndex = shade - 1;
-  if (!isInverted) { // lightish
-    hsl = _darken(hsl, WhiteShadeTableBG[tableIndex]);
-  } else { // default: if (hsl.l / 100 < .5) { // darkish
-    hsl = _lighten(hsl, BlackTintTableBG[BlackTintTable.length - 1 - tableIndex]);
-  }
-
-  return Colors.getColorFromRGBA(assign(Colors.hsl2rgb(hsl.h, hsl.s, hsl.l), { a: color.a }));
-}
-
-/* Calculates the contrast ratio between two colors. Used for verifying
- * color pairs meet minimum accessibility requirements.
- * See: https://www.w3.org/TR/WCAG20/ section 1.4.3
- */
-export function getContrastRatio(color1: IColor, color2: IColor) {
-  // Formula defined by: http://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.html#contrast-ratiodef
-  // relative luminance: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef
-
-  /* calculate the intermediate value needed to calculating relative luminance */
-  function _getThing(x: number) {
-    if (x <= .03928) {
-      return x / 12.92;
-    } else {
-      return Math.pow((x + .055) / 1.055, 2.4);
-    }
-  }
-
-  let r1 = _getThing(color1.r / MAX_COLOR_RGBA);
-  let g1 = _getThing(color1.g / MAX_COLOR_RGBA);
-  let b1 = _getThing(color1.b / MAX_COLOR_RGBA);
-  let L1 = (.2126 * r1) + (.7152 * g1) + (.0722 * b1); // relative luminance of first color
-  L1 += .05;
-
-  let r2 = _getThing(color2.r / MAX_COLOR_RGBA);
-  let g2 = _getThing(color2.g / MAX_COLOR_RGBA);
-  let b2 = _getThing(color2.b / MAX_COLOR_RGBA);
-  let L2 = (.2126 * r2) + (.7152 * g2) + (.0722 * b2); // relative luminance of second color
-  L2 += .05;
-
-  // return the lighter color divided by darker
-  return L1 / L2 > 1 ?
-    L1 / L2 : L2 / L1;
-}
\ No newline at end of file
diff --git a/packages/utilities/src/object.ts b/packages/utilities/src/object.ts
index a6bc2020f2929..84dbf94049479 100644
--- a/packages/utilities/src/object.ts
+++ b/packages/utilities/src/object.ts
@@ -85,16 +85,3 @@ export function getId(prefix?: string): string {
 
   return (prefix || '') + index;
 }
-
-/* Takes an enum and iterates over each value of the enum (as a string), running the callback on each, returning a mapped array.
- * The callback takes as a first parameter the string that represents the name of the entry, and the second parameter is the
- * value of that entry, which is the value you'd normally use when using the enum (usually a number).
- * */
-export function mapEnumByName<T>(theEnum: any, callback: (name?: string, value?: any) => T | undefined): T[] | undefined {
-  // map<any> to satisfy compiler since it doesn't realize we strip out undefineds in the .filter() call
-  return Object.keys(theEnum).map<any>((p: string) => { // map on each property name as a string
-    if (String(Number(p)) !== p) { // if the property is not just a number (because enums in TypeScript will map both ways)
-      return callback(p, theEnum[p]);
-    }
-  }).filter((v: any) => !!v); // only return elements with values
-}
\ No newline at end of file

From 58f501874002d23a5fd7a4f54e250e92ea276d94 Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Thu, 21 Sep 2017 08:54:46 -0700
Subject: [PATCH 0690/1641] Changing -ms-high-contrast-adjust to
 msHighContrastAdjust in comboBox (#2901)

* Changing -ms-high-contrast-adjust to msHighContrastAdjust in comboBox

* rush change
---
 ...brow-comboBox-contrastAdjust_2017-09-20-20-13.json | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.styles.ts        |  8 ++++----
 2 files changed, 15 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-comboBox-contrastAdjust_2017-09-20-20-13.json

diff --git a/common/changes/office-ui-fabric-react/v-krbrow-comboBox-contrastAdjust_2017-09-20-20-13.json b/common/changes/office-ui-fabric-react/v-krbrow-comboBox-contrastAdjust_2017-09-20-20-13.json
new file mode 100644
index 0000000000000..ffcb14badc78c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-comboBox-contrastAdjust_2017-09-20-20-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Changing high-contrast styles to use msHighContrastAdjust",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index 2248259b2325e..86e01eb7aea87 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -40,7 +40,7 @@ const getListOptionHighContrastStyles = memoizeFunction((theme: ITheme): IStyle
       backgroundColor: 'Highlight',
       borderColor: 'Highlight',
       color: 'HighlightText',
-      '-ms-high-contrast-adjust': 'none'
+      msHighContrastAdjust: 'none'
     },
   };
 });
@@ -165,7 +165,7 @@ export const getCaretDownButtonStyles = memoizeFunction((
         backgroundColor: 'ButtonFace',
         borderColor: 'ButtonText',
         color: 'ButtonText',
-        '-ms-high-contrast-adjust': 'none'
+        msHighContrastAdjust: 'none'
       }
     },
     rootHovered: {
@@ -245,7 +245,7 @@ export const getStyles = memoizeFunction((
       [MS_HIGHCONTRAST_ACTIVE]: {
         color: 'HighlightText',
         borderColor: 'Highlight',
-        '-ms-high-contrast-adjust': 'none'
+        msHighContrastAdjust: 'none'
       },
     },
     rootFocused: {
@@ -253,7 +253,7 @@ export const getStyles = memoizeFunction((
       [MS_HIGHCONTRAST_ACTIVE]: {
         color: 'HighlightText',
         borderColor: 'Highlight',
-        '-ms-high-contrast-adjust': 'none'
+        msHighContrastAdjust: 'none'
       },
     },
     rootDisabled: getDisabledStyles(theme),

From 7d3a64d4aa3c5b473bae8a3b817a7ef753d9fecd Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Thu, 21 Sep 2017 15:29:59 -0700
Subject: [PATCH 0691/1641] Theme Generator tool (#2917)

Theme Generator tool
---
 .../src/components/App/AppState.tsx           |   6 +
 .../ThemeGeneratorToolPage.tsx                |  20 +
 ...phkuo-themeGenerator_2017-09-19-02-27.json |  11 +
 ...phkuo-themeGenerator_2017-09-19-02-27.json |  11 +
 .../src/ThemeGenerator.ts                     |   1 +
 .../src/common/_semanticColorVariables.scss   |   2 +-
 .../components/ChoiceGroup/ChoiceGroup.scss   |   1 +
 .../ColorPicker/ColorPicker.Props.ts          |   6 +-
 .../components/ColorPicker/ColorPicker.scss   |   8 +
 .../components/ColorPicker/ColorPicker.tsx    |   4 +-
 .../ProgressIndicator/ProgressIndicator.scss  |   2 +-
 .../examples/TeachingBubble.Basic.Example.tsx |   2 +-
 .../src/components/Theme/ThemePage.tsx        |   2 +-
 .../components/ThemeGenerator/IThemeRules.ts  |   5 +
 .../ThemeGenerator/IThemeSlotRule.ts          |  19 +
 .../ThemeGenerator/ThemeGenerator.ts          | 182 +++++++
 .../ThemeGenerator/ThemeGeneratorPage.scss    |  67 +++
 .../ThemeGenerator/ThemeGeneratorPage.tsx     | 501 ++++++++++++++++++
 .../ThemeGenerator/ThemeRulesStandard.ts      | 215 ++++++++
 .../src/components/ThemeGenerator/index.ts    |   4 +
 .../src/demo/AppDefinition.tsx                |   8 +-
 .../src/utilities/color/index.ts              |   1 +
 .../src/utilities/color/shades.ts             | 191 +++++++
 packages/utilities/src/object.test.ts         |  24 +-
 packages/utilities/src/object.ts              |  13 +
 25 files changed, 1295 insertions(+), 11 deletions(-)
 create mode 100644 apps/fabric-website/src/pages/Styles/ThemeGeneratorToolPage/ThemeGeneratorToolPage.tsx
 create mode 100644 common/changes/@uifabric/utilities/phkuo-themeGenerator_2017-09-19-02-27.json
 create mode 100644 common/changes/office-ui-fabric-react/phkuo-themeGenerator_2017-09-19-02-27.json
 create mode 100644 packages/office-ui-fabric-react/src/ThemeGenerator.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeRules.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeSlotRule.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ThemeGenerator/index.ts
 create mode 100644 packages/office-ui-fabric-react/src/utilities/color/shades.ts

diff --git a/apps/fabric-website/src/components/App/AppState.tsx b/apps/fabric-website/src/components/App/AppState.tsx
index 02eb091ccf1c6..94937f7aa8956 100644
--- a/apps/fabric-website/src/components/App/AppState.tsx
+++ b/apps/fabric-website/src/components/App/AppState.tsx
@@ -73,6 +73,12 @@ export const AppState: IAppState = {
           url: '#/styles/localization',
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Styles/LocalizationPage/LocalizationPage').LocalizationPage))
         },
+        {
+          title: 'Beta Theme Generator',
+          url: '#/styles/themeGenerator',
+          isHiddenFromMainNav: true,
+          getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Styles/ThemeGeneratorToolPage/ThemeGeneratorToolPage').ThemeGeneratorToolPage))
+        },
         {
           title: 'Typography',
           url: '#/styles/typography',
diff --git a/apps/fabric-website/src/pages/Styles/ThemeGeneratorToolPage/ThemeGeneratorToolPage.tsx b/apps/fabric-website/src/pages/Styles/ThemeGeneratorToolPage/ThemeGeneratorToolPage.tsx
new file mode 100644
index 0000000000000..54a960c3bd44c
--- /dev/null
+++ b/apps/fabric-website/src/pages/Styles/ThemeGeneratorToolPage/ThemeGeneratorToolPage.tsx
@@ -0,0 +1,20 @@
+import * as React from 'react';
+import { PageHeader } from '../../../components/PageHeader/PageHeader';
+
+import { ThemeGeneratorPage } from 'office-ui-fabric-react/lib/components/ThemeGenerator/ThemeGeneratorPage';
+
+export class ThemeGeneratorToolPage extends React.Component<any, any> {
+  public render() {
+    return (
+      <div>
+        <PageHeader
+          pageTitle='Theme Generator'
+          backgroundColor='#006f94'
+        />
+
+        <ThemeGeneratorPage />
+
+      </div>
+    );
+  }
+}
diff --git a/common/changes/@uifabric/utilities/phkuo-themeGenerator_2017-09-19-02-27.json b/common/changes/@uifabric/utilities/phkuo-themeGenerator_2017-09-19-02-27.json
new file mode 100644
index 0000000000000..97e629a19f051
--- /dev/null
+++ b/common/changes/@uifabric/utilities/phkuo-themeGenerator_2017-09-19-02-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Adding `mapEnumByName` helper.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "phkuo@microsoft.com"
+}
diff --git a/common/changes/office-ui-fabric-react/phkuo-themeGenerator_2017-09-19-02-27.json b/common/changes/office-ui-fabric-react/phkuo-themeGenerator_2017-09-19-02-27.json
new file mode 100644
index 0000000000000..1ddeadd293ff5
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/phkuo-themeGenerator_2017-09-19-02-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Create Theme Generator page",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/ThemeGenerator.ts b/packages/office-ui-fabric-react/src/ThemeGenerator.ts
new file mode 100644
index 0000000000000..08c9290223518
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/ThemeGenerator.ts
@@ -0,0 +1 @@
+export * from './components/ThemeGenerator/index';
diff --git a/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss b/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
index f2e3e1af322a9..ba91bb9502352 100644
--- a/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
+++ b/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
@@ -91,4 +91,4 @@ $listTextColor: $ms-color-neutralPrimary;
 
 $listItemHoverColor: $ms-color-neutralLighter;
 $listItemSelectedColor: $ms-color-neutralQuaternary;
-$listItemSelectedHoverColor: $ms-color-neutralQuaternaryAlt;
+$listItemSelectedHoverColor: $ms-color-neutralQuaternaryAlt;
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
index b401b8e86d5d7..2ceecdfa0d8d8 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
@@ -181,6 +181,7 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
     }
     &::after {
       background-color: $radioButton-dot-disabled-color;
+      border-color: $radioButton-dot-disabled-color;
     }
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts
index d3368bc4f42c3..b278d7599cbbf 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts
@@ -5,17 +5,17 @@ export interface IColorPickerProps {
   componentRef?: () => void;
 
   /**
-   * The CSS-compatible string to describe the color
+   * The CSS-compatible string to describe the initial color
    */
   color: string;
 
   /**
-   * Callback issued when the user changes the color.
+   * Callback issued when the user changes the color
    */
   onColorChanged?: (color: string) => void;
 
   /**
-   * The setting of whether hide alpha control slider.
+   * The setting of whether to hide the alpha control slider.
    */
   alphaSliderHidden?: boolean;
 }
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.scss b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.scss
index e24b85cc1bb37..d9395a3b07398 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.scss
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.scss
@@ -31,6 +31,14 @@
   position: fixed;
 }
 
+.table {
+  table-layout: fixed; // fix IE
+  width: 100%;
+}
+.tableHexCell {
+  width: 25%;
+}
+
 .thumb {
   position: absolute;
   width: 20px;
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
index 8764bf262fce9..70e4b3591e9ca 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
@@ -70,10 +70,10 @@ export class ColorPicker extends BaseComponent<IColorPickerProps, IColorPickerSt
               value={ color.a }
               onChanged={ this._onAChanged }
             />) }
-          <table className='ms-ColorPicker-table' cellPadding='0' cellSpacing='0'>
+          <table className={ css('ms-ColorPicker-table', styles.table) } cellPadding='0' cellSpacing='0'>
             <thead>
               <tr className={ FontClassNames.small }>
-                <td>Hex</td>
+                <td className={ styles.tableHexCell }>Hex</td>
                 <td>Red</td>
                 <td>Green</td>
                 <td>Blue</td>
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
index 8b26b66c7e0a6..7614bef6898b7 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
@@ -62,4 +62,4 @@ $ProgressIndicatorTextHeight: 18px;
   transition-property: width;
   transition-timing-function: linear;
   transition-duration: 150ms;
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx
index 744cdcf63acff..c608bebb997b6 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx
@@ -28,7 +28,7 @@ export class TeachingBubbleBasicExample extends React.Component<any, ITeachingBu
       children: 'Try it out'
     };
     let exampleSecondaryButtonProps: IButtonProps = {
-      children: 'May be later',
+      children: 'Maybe later',
       onClick: this._onDismiss
     };
 
diff --git a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
index 912a820ddbbc0..ffd4e631f50f7 100644
--- a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
@@ -38,7 +38,7 @@ export class ThemePage extends React.Component<any, any> {
     return (
       <div className='Themes'>
         <h1 className={ FontClassNames.xxLarge }>Themes</h1>
-        <p>The entire color pallete of the controls are themeable. We provide a set of sensible defaults, but you can override all colors individually.</p>
+        <p>The entire color palette of the controls are themeable. We provide a set of sensible defaults, but you can override all colors individually.</p>
         <p>To override the themes, you need to call <span className='code'>loadTheme()</span> with the appropriate set of overrides:</p>
 
         <Highlight className='typescript'>
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeRules.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeRules.ts
new file mode 100644
index 0000000000000..adcdda29b8d35
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeRules.ts
@@ -0,0 +1,5 @@
+import { IThemeSlotRule } from './IThemeSlotRule';
+
+export interface IThemeRules {
+  [key: string]: IThemeSlotRule;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeSlotRule.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeSlotRule.ts
new file mode 100644
index 0000000000000..b1507ebcc207b
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeSlotRule.ts
@@ -0,0 +1,19 @@
+import { IColor } from '../../utilities/color/colors';
+import { Shade } from '../../utilities/color/shades';
+
+export interface IThemeSlotRule {
+  /* The name of this theme slot. */
+  name: string;
+  /* The actual color this theme slot is if it is a color. */
+  color?: IColor;
+  /* The value of this slot if it is NOT a color. Must be falsey if not a color. */
+  value?: string;
+  /* The theme slot this slot is based on. */
+  inherits?: IThemeSlotRule;
+  /* If set, this slot is the specified shade of the slot it inherits from. */
+  asShade?: Shade;
+  /* Whether this slot is a background shade, which uses different logic for generating its inheriting-as-shade value. */
+  isBackgroundShade?: boolean;
+  /* Whether this slot has been manually overridden (else, it was automatically generated based on inheritance). */
+  isCustomized?: boolean;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts
new file mode 100644
index 0000000000000..711bb622439ea
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts
@@ -0,0 +1,182 @@
+import {
+  IColor,
+  getColorFromString
+} from '../../utilities/color/colors';
+import {
+  isValidShade,
+  getShade,
+  getBackgroundShade
+} from '../../utilities/color/shades';
+import { format } from '../../Utilities';
+
+import { IThemeSlotRule } from './IThemeSlotRule';
+import { IThemeRules } from './IThemeRules';
+
+export class ThemeGenerator {
+
+  /* Sets an IThemeSlotRule to the given color and cascades it to the rest of the theme, updating other IThemeSlotRules in the theme that
+   *   inherit from that color.
+   * isInverted: whether it's a dark theme or not, which affects the algorithm used to generate shades
+   * isCustomization should be true only if it's a user action, and indicates overwriting the slot's inheritance (if any)
+   * overwriteCustomColor: a slot could have a generated color based on its inheritance rules (isCustomized is false), or a custom color
+                            based on user input (isCustomized is true), this bool tells us whether to override existing customized colors */
+  public static setSlot(
+    rule: IThemeSlotRule,
+    color: string | IColor,
+    slotRules: IThemeRules,
+    isInverted = false,
+    isCustomization = false,
+    overwriteCustomColor = true
+  ) {
+    if (!rule.color && rule.value) {
+      // not a color rule
+      return;
+    }
+
+    if (overwriteCustomColor) {
+      let colorAsIColor: IColor;
+      if (typeof color === 'string') {
+        colorAsIColor = getColorFromString(color);
+      } else {
+        colorAsIColor = color;
+      }
+      ThemeGenerator._setSlot(rule, colorAsIColor, slotRules, isInverted, isCustomization, overwriteCustomColor);
+    } else if (rule.color) {
+      ThemeGenerator._setSlot(rule, rule.color, slotRules, isInverted, isCustomization, overwriteCustomColor);
+    }
+  }
+
+  /* Sets the color of each slot based on its rule. Slots that don't inherit must have a color already.
+   * If this completes without error, then the theme is ready to use. (All slots will have a color.)
+   * setSlot() can be called before this, but this must be called before getThemeAs*().
+   * Does not override colors of rules where isCustomized is true (i.e. doesn't override existing customizations).
+   */
+  public static insureSlots(slotRules: IThemeRules, isInverted: boolean) {
+    // Get all the "root" rules, the ones which don't inherit. Then "set" them to trigger updating dependent slots.
+    for (let ruleName in slotRules) {
+      if (slotRules.hasOwnProperty(ruleName)) {
+        let rule: IThemeSlotRule = slotRules[ruleName];
+        if (!rule.inherits && !rule.value) {
+          if (!rule.color) {
+            throw 'A color slot rule that does not inherit must provide its own color.';
+          }
+          ThemeGenerator._setSlot(rule, rule.color, slotRules, isInverted, false, false);
+        }
+      }
+    }
+  }
+
+  /* Gets the JSON-formatted blob that describes the theme, usable with the REST request endpoints
+   * { [theme slot name as string] : [color as string],
+   *  "tokenName": "#f00f00",
+   *  "tokenName2": "#ba2ba2",
+   *   ... }
+   */
+  public static getThemeAsJson(slotRules: IThemeRules): any {
+    let theme: any = {};
+    for (let ruleName in slotRules) {
+      if (slotRules.hasOwnProperty(ruleName)) {
+        let rule: IThemeSlotRule = slotRules[ruleName];
+        theme[rule.name] = rule.color ? rule.color.str : rule.value || '';
+      }
+    }
+    return theme;
+  }
+
+  /* Gets the theme as a list of SASS variables that can be used in code
+   * $tokenName: "[theme:tokenName, default:#f00f00]";
+   * $tokenName2: "[theme:tokenName2, default:#ba2ba2]";
+   * ...
+   */
+  public static getThemeAsSass(slotRules: IThemeRules): any {
+    let sassVarTemplate = '${0}Color: "[theme: {1}, default: {2}]";\n';
+    let output = '';
+
+    for (let ruleName in slotRules) {
+      if (slotRules.hasOwnProperty(ruleName)) {
+        let rule: IThemeSlotRule = slotRules[ruleName];
+        let camelCasedName = rule.name.charAt(0).toLowerCase() + rule.name.slice(1);
+        output += format(sassVarTemplate,
+          camelCasedName,
+          camelCasedName,
+          rule.color ? rule.color.str : rule.value || '');
+      }
+    }
+    return output;
+  }
+
+  /* Gets the theme formatted for PowerShell scripts
+   * @{
+   * "tokenName" = "#f00f00";
+   * "tokenName2" = "#ba2ba2";
+   * ...
+   * }
+   */
+  public static getThemeForPowerShell(slotRules: IThemeRules): any {
+    let psVarTemplate = '"{0}" = "{1}";\n';
+    let output = '';
+
+    for (let ruleName in slotRules) {
+      if (slotRules.hasOwnProperty(ruleName)) {
+        let rule: IThemeSlotRule = slotRules[ruleName];
+        if (rule.value) {
+          // skip this one, it's not a color
+          continue;
+        }
+        let camelCasedName = rule.name.charAt(0).toLowerCase() + rule.name.slice(1);
+        let outputColor = rule.color ? '#' + rule.color.hex : rule.value || '';
+        // powershell endpoint uses the RGBA format
+        if (rule.color && rule.color.a && rule.color.a !== 100) {
+          outputColor += String(rule.color.a.toString(16));
+        }
+        output += format(psVarTemplate,
+          camelCasedName,
+          outputColor);
+      }
+    }
+    return '@{\n' + output + '}';
+  }
+
+  /* Sets the given slot's color to the appropriate color, shading it if necessary.
+     Then, iterates through all other rules (that are this rule's dependents) to update them accordingly.
+     isCustomization=true means it's a user provided color, set it to that raw color
+     isCustomization=false means the rule it's inheriting from changed, so updated using asShade */
+  private static _setSlot(
+    rule: IThemeSlotRule,
+    color: IColor,
+    slotRules: IThemeRules,
+    isInverted: boolean,
+    isCustomization: boolean,
+    overwriteCustomColor = true
+  ) {
+    if (!rule.color && rule.value) {
+      // not a color rule
+      return;
+    }
+
+    if (overwriteCustomColor || !rule.color || !rule.isCustomized || !rule.inherits) { // set the rule's color under these conditions
+      if ((overwriteCustomColor || !rule.isCustomized) && !isCustomization && rule.inherits && isValidShade(rule.asShade)) {
+        // it's inheriting by shade
+        if (rule.isBackgroundShade) {
+          rule.color = getBackgroundShade(color, rule.asShade!, isInverted)!;
+        } else {
+          rule.color = getShade(color, rule.asShade!, isInverted)!;
+        }
+        rule.isCustomized = false;
+      } else {
+        rule.color = color;
+        rule.isCustomized = true;
+      }
+
+      // then run through the rest of the rules and update dependent colors
+      for (let ruleName in slotRules) {
+        if (slotRules.hasOwnProperty(ruleName)) {
+          let ruleToUpdate: IThemeSlotRule = slotRules[ruleName];
+          if (ruleToUpdate.inherits === rule) {
+            ThemeGenerator._setSlot(ruleToUpdate, rule.color, slotRules, isInverted, false, overwriteCustomColor);
+          }
+        }
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.scss b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.scss
new file mode 100644
index 0000000000000..62ca291459523
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.scss
@@ -0,0 +1,67 @@
+@import '../../common/common';
+:global {
+
+.ms-themer {
+  padding: 12px;
+}
+.ms-themer h3 {
+  margin: 0;
+}
+
+.ms-themer-paletteSlot {
+  text-align: center;
+  padding: 16px;
+}
+
+.ms-themer-swatch {
+  display: inline-block;
+  flex-shrink: 0;
+  height: 36px;
+  width: 36px;
+  margin: 4px;
+}
+
+.ms-themer-swatchBg {
+  padding: 4px;
+  font-size: 0;
+  .ms-themer-swatch {
+    height: 28px;
+    width: 28px;
+    margin: 2px;
+  }
+}
+
+.ms-themer-example {
+  padding: 20px;
+  max-width: 40%;
+}
+
+.ms-themer-fabricPalette-root {
+  display: flex;
+  > div {
+    padding-left: 20px;
+  }
+}
+
+.ms-themer-accessibilityTable td {
+  padding: 4px;
+  text-align: center;
+}
+
+.ms-themer-slot {
+  display: flex;
+  align-items: center;
+  overflow: auto;
+}
+
+.ms-themer-output-root {
+  display: flex;
+  textarea {
+    height: 400px;
+    width: 280px;
+    margin-right: 28px;
+    background-color: white;
+    color: #333;
+  }
+}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
new file mode 100644
index 0000000000000..12d686bbfaeae
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
@@ -0,0 +1,501 @@
+import * as React from 'react';
+import './ThemeGeneratorPage.scss';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+
+import { loadTheme } from 'office-ui-fabric-react/lib/Styling';
+import {
+  IColor,
+  getContrastRatio,
+  updateA,
+  isDark,
+  getColorFromString
+} from 'office-ui-fabric-react/lib/utilities/color/index';
+
+import {
+  ThemeGenerator,
+  themeRulesStandardCreator,
+  BaseSlots,
+  FabricSlots,
+  IThemeSlotRule,
+  IThemeRules
+} from 'office-ui-fabric-react/lib/ThemeGenerator';
+
+import { Callout } from 'office-ui-fabric-react/lib/Callout';
+import { ColorPicker } from 'office-ui-fabric-react/lib/ColorPicker';
+
+import { ChoiceGroup } from 'office-ui-fabric-react/lib/ChoiceGroup';
+import { TeachingBubbleBasicExample } from '../../components/TeachingBubble/examples/TeachingBubble.Basic.Example';
+import { TextFieldBasicExample } from '../TextField/examples/TextField.Basic.Example';
+import { ToggleBasicExample } from '../../components/Toggle/examples/Toggle.Basic.Example';
+import { ProgressIndicatorBasicExample } from '../ProgressIndicator/examples/ProgressIndicator.Basic.Example';
+
+export interface IThemeGeneratorPageState {
+  themeRules: IThemeRules;
+  colorPickerSlotRule: IThemeSlotRule | null;
+  colorPickerElement: HTMLElement | null;
+  colorPickerVisible: boolean;
+}
+
+const BackgroundImageUriKey = 'backgroundImageUri';
+const BackgroundOverlayKey = 'backgroundOverlay';
+
+export class ThemeGeneratorPage extends React.Component<any, IThemeGeneratorPageState> {
+
+  private _imgUrl: string;
+
+  constructor() {
+    super();
+
+    let themeRules = themeRulesStandardCreator();
+    ThemeGenerator.insureSlots(themeRules, isDark(themeRules[BaseSlots[BaseSlots.backgroundColor]].color!));
+
+    this.state = {
+      themeRules: themeRules,
+      colorPickerSlotRule: null,
+      colorPickerElement: null,
+      colorPickerVisible: false
+    };
+  }
+
+  public render() {
+    let { colorPickerVisible, colorPickerSlotRule, colorPickerElement } = this.state;
+
+    let fabricThemeSlots =
+      [this._fabricSlotWidget(FabricSlots.themeDarker),
+      this._fabricSlotWidget(FabricSlots.themeDark),
+      this._fabricSlotWidget(FabricSlots.themeDarkAlt),
+      this._fabricSlotWidget(FabricSlots.themePrimary),
+      this._fabricSlotWidget(FabricSlots.themeSecondary),
+      this._fabricSlotWidget(FabricSlots.themeTertiary),
+      this._fabricSlotWidget(FabricSlots.themeLight),
+      this._fabricSlotWidget(FabricSlots.themeLighter),
+      this._fabricSlotWidget(FabricSlots.themeLighterAlt)];
+    let fabricNeutralForegroundSlots =
+      [this._fabricSlotWidget(FabricSlots.black),
+      this._fabricSlotWidget(FabricSlots.neutralDark),
+      this._fabricSlotWidget(FabricSlots.neutralPrimary),
+      this._fabricSlotWidget(FabricSlots.neutralSecondary),
+      this._fabricSlotWidget(FabricSlots.neutralTertiary)
+      ];
+    let fabricNeutralBackgroundSlots =
+      [this._fabricSlotWidget(FabricSlots.neutralTertiaryAlt),
+      this._fabricSlotWidget(FabricSlots.neutralQuaternary),
+      this._fabricSlotWidget(FabricSlots.neutralQuaternaryAlt),
+      this._fabricSlotWidget(FabricSlots.neutralLight),
+      this._fabricSlotWidget(FabricSlots.neutralLighter),
+      this._fabricSlotWidget(FabricSlots.neutralLighterAlt),
+      this._fabricSlotWidget(FabricSlots.white)];
+
+    return (
+      <div className='ms-themer'>
+        <p>
+          This tool helps you easily create all the shades and slots for a custom theme.
+          The theme can be used by Fabric React's styling package, see the <a href='https://github.com/OfficeDev/office-ui-fabric-react/tree/master/packages/styling'>documentation</a>.
+          <br />
+          As you modify one of the three base colors, the theme will update automatically based on predefined rules. You can modify each individual slot below as well.
+        </p>
+
+        {/* Hello! You've found hidden functionality for generating a theme from an image. This uses Microsoft's
+          * Cognitive Vision API, documented here:
+          * https://docs.microsoft.com/en-us/azure/cognitive-services/computer-vision/quickstarts/javascript
+          * We use that API to identify the most prominent background and foreground colors, and the accent color,
+          * and generate a theme based off of those.
+          * Since this API requires a personal subscription key, you'll have to enlist and insert your subscription
+          * key in _makeThemeFromImg() below. Then, just uncomment this section. */}
+        {/*}
+        <div style={ { display: 'flex' } }>
+          <div>URL to image:&nbsp;</div>
+          <input type='text' id='imageUrl' />
+          <button onClick={ this._makeThemeFromImg }>Create theme from image</button>
+        </div>
+        <div id='imageDescription' />
+        <div><img id='imagePreview' style={ { maxHeight: '500px', maxWidth: '800px' } } /></div>
+        {*/}
+
+        {/* the shared popup color picker for slots */ }
+        { colorPickerVisible && colorPickerSlotRule !== null && colorPickerSlotRule !== undefined && colorPickerElement &&
+          <Callout
+            key={ colorPickerSlotRule.name }
+            gapSpace={ 10 }
+            targetElement={ colorPickerElement }
+            setInitialFocus={ true }
+            onDismiss={ this._colorPickerOnDismiss }
+          >
+            <ColorPicker
+              color={ colorPickerSlotRule.color!.str }
+              onColorChanged={ this._semanticSlotRuleChanged.bind(this, colorPickerSlotRule) }
+            />
+          </Callout>
+        }
+
+        {/* the three base slots, prominently displayed at the top of the page */ }
+        <div style={ { display: 'flex' } }>
+          { [this._baseColorSlotPicker(BaseSlots.primaryColor, 'Primary theme color'),
+          this._baseColorSlotPicker(BaseSlots.foregroundColor, 'Body text color'),
+          this._baseColorSlotPicker(BaseSlots.backgroundColor, 'Body background color')] }
+        </div>
+        <br />
+
+        { this._outputSection() }
+        <br />
+
+        <h2>Fabric Palette</h2>
+        <p>The original Fabric palette slots. These are raw colors with no prescriptive uses. Each one is a shade or tint of a base color.</p>
+        <div className={ 'ms-themer-fabricPalette-root' }>
+          <div>{ fabricThemeSlots }</div>
+          <div>
+            <p>generally used for text and foregrounds</p>
+            { fabricNeutralForegroundSlots }
+          </div>
+          <div>
+            <p>generally used for backgrounds</p>
+            { fabricNeutralBackgroundSlots }
+          </div>
+        </div>
+        <br />
+
+        <h3>Samples</h3>
+        { <div style={ { display: 'flex', flexDirection: 'row' } }>
+          <div className='ms-themer-example'>
+            <TextFieldBasicExample />
+          </div>
+          <div className='ms-themer-example'>
+            <ToggleBasicExample />
+            <ChoiceGroup
+              options={ [
+                {
+                  key: 'A',
+                  text: 'Option A'
+                },
+                {
+                  key: 'B',
+                  text: 'Option B',
+                  checked: true
+                }] }
+              label='Pick one'
+              required={ true }
+            />,
+            <ChoiceGroup
+              options={ [
+                {
+                  key: 'C',
+                  text: 'Option C',
+                  disabled: true
+                },
+                {
+                  key: 'D',
+                  text: 'Option D',
+                  checked: true,
+                  disabled: true
+                }] }
+              label='Pick one'
+              required={ true }
+            />
+          </div>
+          <div className='ms-themer-example'>
+            <TeachingBubbleBasicExample />
+            <br />
+            <ProgressIndicatorBasicExample />
+          </div>
+        </div> }
+
+        <h3>Accessibility</h3>
+        <p>Each pair of colors below should produce legible text and have a minimum contrast ratio of 4.5.</p>
+        <table className='ms-themer-accessibilityTable'>
+          <thead>
+            <td>Sample text</td>
+            <td>Contrast ratio</td>
+            <td>Slot pair</td>
+          </thead>
+          <tbody>
+            { [this._accessibilityRow(FabricSlots.neutralPrimary, FabricSlots.white)] }
+          </tbody>
+        </table>
+      </div>
+    );
+  }
+
+  @autobind
+  /* tslint:disable:no-unused-variable */
+  private _makeThemeFromImg() {
+    /* tslint:enable:no-unused-variable */
+    this._imgUrl = (document.getElementById('imageUrl') as HTMLInputElement).value;
+    (document.getElementById('imagePreview') as HTMLImageElement).src = this._imgUrl;
+
+    if (this._imgUrl) {
+      let xhr = new XMLHttpRequest();
+      xhr.addEventListener('load', this._cognitiveVisionCallback.bind(this));
+      // you may need to change the URL here
+      xhr.open('POST', 'https://westus.api.cognitive.microsoft.com/vision/v1.0/analyze?visualFeatures=Description%2CColor&details=&language=en');
+      xhr.setRequestHeader('Content-Type', 'application/json');
+      alert('You forgot to set the subscription key!');
+      xhr.setRequestHeader('Ocp-Apim-Subscription-Key', 'YourSubscriptionKeyHere'); // put your subscription key here
+      xhr.send('{ "url": "' + this._imgUrl + '" }');
+    } else {
+      // remove related properties from theme
+      let { themeRules } = this.state;
+      if (themeRules.hasOwnProperty(BackgroundImageUriKey)) {
+        delete themeRules[BackgroundImageUriKey];
+      }
+      if (themeRules.hasOwnProperty(BackgroundOverlayKey)) {
+        delete themeRules[BackgroundOverlayKey];
+      }
+      this.setState({ themeRules: themeRules }, this._makeNewTheme);
+    }
+  }
+
+  @autobind
+  private _cognitiveVisionCallback(e: any) {
+    const xhr = e.target;
+    if (xhr.status === 200) {
+      const response = JSON.parse(xhr.response);
+
+      document.getElementById('imageDescription')!.innerHTML = response.description.captions[0].text;
+
+      /* API returns:
+       response.color.accentColor
+       response.color.dominantColorBackground
+       response.color.dominantColorForeground */
+
+      // converts a returned color from a word into a hex value conforming to our palette
+      const getHexFromColor = (color: string, isBg: boolean) => {
+        // todo: could use more logic based on isInverted and isBg
+        switch (color.toLowerCase()) {
+          case 'black': return '#1f1f1f';
+          case 'blue': return '#0078d7';
+          case 'brown': return '#754d12';
+          case 'gray':
+          case 'grey': return isBg ? '#444' : '#ccc';
+          case 'green': return '#107c10';
+          case 'orange': return '#ff8c00';
+          case 'pink': return '#e3008c';
+          case 'purple': return '#5c2d91';
+          case 'red': return '#e81123';
+          case 'teal': return '#008272';
+          case 'white': return '#fff';
+          case 'yellow': return '#fff100';
+        }
+        alert('Error: Unexpected color passed to getHexFromColor(): ' + color);
+        return '#fff';
+      };
+
+      let { themeRules } = this.state;
+      const bgColor = getHexFromColor(response.color.dominantColorBackground, true);
+      const bgColorIsDark = isDark(getColorFromString(bgColor));
+      ThemeGenerator.setSlot(
+        themeRules[BaseSlots[BaseSlots.backgroundColor]],
+        bgColor,
+        themeRules,
+        bgColorIsDark,
+        true,
+        true);
+      ThemeGenerator.setSlot(
+        themeRules[BaseSlots[BaseSlots.primaryColor]],
+        '#' + response.color.accentColor,
+        themeRules,
+        bgColorIsDark,
+        true,
+        true);
+      ThemeGenerator.setSlot(
+        themeRules[BaseSlots[BaseSlots.foregroundColor]],
+        getHexFromColor(response.color.dominantColorForeground, false),
+        themeRules,
+        bgColorIsDark,
+        true,
+        true);
+
+      themeRules[BackgroundImageUriKey] = {
+        name: BackgroundImageUriKey,
+        value: 'url(\'' + this._imgUrl + '\')'
+      };
+      themeRules[BackgroundOverlayKey] = {
+        name: BackgroundOverlayKey,
+        color: updateA((themeRules[BaseSlots[BaseSlots.backgroundColor]]).color!, 50)
+      };
+
+      this.setState({ themeRules: themeRules }, this._makeNewTheme);
+
+    } else {
+      alert('Error ' + xhr.status + ': ' + xhr.statusText);
+    }
+  }
+
+  @autobind
+  private _colorPickerOnDismiss() {
+    this.setState({ colorPickerVisible: false });
+  }
+
+  @autobind
+  private _semanticSlotRuleChanged(slotRule: IThemeSlotRule, color: string) {
+    let { themeRules } = this.state;
+
+    ThemeGenerator.setSlot(slotRule, color, themeRules, isDark(themeRules[BaseSlots[BaseSlots.backgroundColor]].color!), true, true);
+    this.setState({ themeRules: themeRules }, this._makeNewTheme);
+  }
+
+  @autobind
+  private _onSwatchClick(slotRule: IThemeSlotRule, ev: React.MouseEvent<HTMLElement>) {
+    let { colorPickerSlotRule, colorPickerElement } = this.state;
+
+    if (colorPickerSlotRule !== null && colorPickerSlotRule !== undefined && !!colorPickerElement && colorPickerSlotRule === slotRule && colorPickerElement === ev.target) { // same one, close it
+      this.setState({ colorPickerVisible: false, colorPickerSlotRule: null, colorPickerElement: null });
+    } else { // new one, open it
+      this.setState({ colorPickerVisible: true, colorPickerSlotRule: slotRule, colorPickerElement: ev.target as HTMLElement });
+    }
+  }
+
+  @autobind
+  private _slotWidget(slotRule: IThemeSlotRule) {
+    return (
+      <div key={ slotRule.name } className='ms-themer-slot'>
+        { this._colorSquareSwatchWidget(slotRule) }
+        <div>
+          <div>{ slotRule.name }</div>
+          { !slotRule.isCustomized ?
+            <div>Inherits from: { slotRule.inherits!.name }</div>
+            : <div>Customized</div> }
+        </div>
+      </div>
+    );
+  }
+
+  @autobind
+  private _fabricSlotWidget(fabricSlot: FabricSlots) {
+    return this._slotWidget(this.state.themeRules[FabricSlots[fabricSlot]]);
+  }
+
+  private _colorSquareSwatchWidget(slotRule: IThemeSlotRule) {
+    return (
+      <div
+        key={ slotRule.name }
+        className='ms-themer-swatch'
+        style={ { backgroundColor: slotRule.color!.str } }
+        onClick={ this._onSwatchClick.bind(this, slotRule) }
+      />
+    );
+  }
+
+  @autobind
+  private _accessibilityRow(foreground: FabricSlots, background: FabricSlots) {
+    let themeRules = this.state.themeRules;
+    let bgc: IColor = themeRules[FabricSlots[background]].color!;
+    let fgc: IColor = themeRules[FabricSlots[foreground]].color!;
+
+    let contrastRatio = getContrastRatio(bgc, fgc);
+    let contrastRatioString = String(contrastRatio);
+    contrastRatioString = contrastRatioString.substr(0, contrastRatioString.indexOf('.') + 3);
+    if (contrastRatio < 4.5) {
+      contrastRatioString = '**' + contrastRatioString + '**';
+    }
+
+    return (
+      <tr key={ String(foreground) + String(background) }>
+        <td style={ { backgroundColor: bgc.str, color: fgc.str } }>The quick brown fox jumps over the lazy dog.</td>
+        <td>{ contrastRatioString }</td>
+        <td>{ FabricSlots[foreground] + ' + ' + FabricSlots[background] }</td>
+      </tr>
+    );
+  }
+
+  @autobind
+  private _outputSection() {
+    const themeRules = this.state.themeRules;
+
+    // strip out the unnecessary shade slots from the final output theme
+    let abridgedTheme: IThemeRules = {};
+    for (let ruleName in themeRules) {
+      if (themeRules.hasOwnProperty(ruleName)) {
+        if (ruleName.indexOf('ColorShade') === -1 && ruleName !== 'primaryColor' && ruleName !== 'backgroundColor' && ruleName !== 'foregroundColor') {
+          abridgedTheme[ruleName] = themeRules[ruleName];
+        }
+      }
+    }
+
+    return (
+      <div>
+        <h2>Output</h2>
+        <div className={ 'ms-themer-output-root' }>
+          <div>
+            <h3>JSON</h3>
+            <textarea
+              readOnly={ true }
+              spellCheck={ false }
+              value={ JSON.stringify(ThemeGenerator.getThemeAsJson(abridgedTheme), void 0, 2) }
+            />
+          </div>
+          <div>
+            <h3>SASS</h3>
+            <textarea
+              readOnly={ true }
+              spellCheck={ false }
+              value={ ThemeGenerator.getThemeAsSass(abridgedTheme) }
+            />
+          </div>
+          <div>
+            <h3>PowerShell</h3>
+            <textarea
+              readOnly={ true }
+              spellCheck={ false }
+              value={ ThemeGenerator.getThemeForPowerShell(abridgedTheme) }
+            />
+          </div>
+        </div>
+      </div>
+    );
+  }
+
+  @autobind
+  private _makeNewTheme() {
+    let themeAsJson: { [key: string]: string } = ThemeGenerator.getThemeAsJson(this.state.themeRules);
+    console.log('New theme...', themeAsJson);
+    document.body.style.backgroundColor = themeAsJson.backgroundColor;
+    document.body.style.color = themeAsJson.bodyText;
+    loadTheme({ palette: themeAsJson });
+  }
+
+  @autobind
+  private _baseColorSlotPicker(baseSlot: BaseSlots, title: string) {
+    function _onColorChanged(newColor: string) {
+      let themeRules = this.state.themeRules;
+      const currentIsDark = isDark(themeRules[BaseSlots[BaseSlots.backgroundColor]].color!);
+      ThemeGenerator.setSlot(
+        themeRules[BaseSlots[baseSlot]],
+        newColor,
+        themeRules,
+        currentIsDark,
+        true,
+        true);
+      if (currentIsDark !== isDark(themeRules[BaseSlots[BaseSlots.backgroundColor]].color!)) {
+        // isInverted got swapped, so need to refresh slots with new shading rules
+        ThemeGenerator.insureSlots(themeRules, !currentIsDark);
+      }
+      this.setState({ themeRules: themeRules }, this._makeNewTheme);
+    }
+
+    return (
+      <div className='ms-themer-paletteSlot' key={ baseSlot }>
+        <h3>{ title }</h3>
+        <div>
+          <ColorPicker
+            key={ 'baseslotcolorpicker' + baseSlot }
+            color={ this.state.themeRules[BaseSlots[baseSlot]].color!.str }
+            /* tslint:disable:jsx-no-bind */
+            onColorChanged={ _onColorChanged.bind(this) }
+          /* tslint:enable:jsx-no-bind */
+          />
+        </div>
+        <div className='ms-themer-swatchBg' style={ { backgroundColor: this.state.themeRules[BaseSlots[baseSlot]].color!.str } }>
+          <div className='ms-themer-swatch' style={ { backgroundColor: this.state.themeRules[BaseSlots[baseSlot]].color!.str } } />
+          { [this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade1']),
+          this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade2']),
+          this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade3']),
+          this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade4']),
+          this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade5']),
+          this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade6']),
+          this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade7']),
+          this._colorSquareSwatchWidget(this.state.themeRules[BaseSlots[baseSlot] + 'Shade8'])] }
+        </div>
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
new file mode 100644
index 0000000000000..40df2f017dd54
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
@@ -0,0 +1,215 @@
+import { Shade } from '../../utilities/color/shades';
+import { getColorFromString } from '../../utilities/color/colors';
+import { mapEnumByName } from '../../Utilities';
+
+import { IThemeRules } from './IThemeRules';
+
+/* This is the set of rules for our default theme.
+   We start with three base slots, defining the background, foreground (text), and
+   primary color (sometimes called theme color). Each Fabric slot is generated from
+   shades (or tints) of one of those three, creating the Fabric palette.
+   Then, we have semantic slots, the new thing intended to eventually replace the
+   Fabric palette. The semantic slots inherit from the Fabric palette. */
+
+/* The most minimal set of slots we start with. All other ones can be generated based on rules.
+ * This is not so much an enum as it is a list. The enum is used to insure "type"-safety.
+ * For now, we are only dealing with color. */
+export enum BaseSlots {
+  primaryColor,
+  backgroundColor,
+  foregroundColor
+}
+
+/* The original Fabric palette, only for back-compat. */
+export enum FabricSlots {
+  themePrimary, // BaseSlots.primaryColor, Shade[Shade.Unshaded]);
+  themeLighterAlt, // BaseSlots.primaryColor, Shade[Shade.Shade1]);
+  themeLighter, // BaseSlots.primaryColor, Shade[Shade.Shade2]);
+  themeLight, // BaseSlots.primaryColor, Shade[Shade.Shade3]);
+  themeTertiary, // BaseSlots.primaryColor, Shade[Shade.Shade4]);
+  themeSecondary, // BaseSlots.primaryColor, Shade[Shade.Shade5]);
+  themeDarkAlt, // BaseSlots.primaryColor, Shade[Shade.Shade6]);
+  themeDark, // BaseSlots.primaryColor, Shade[Shade.Shade7]);
+  themeDarker, // BaseSlots.primaryColor, Shade[Shade.Shade8]);
+
+  neutralLighterAlt, // BaseSlots.backgroundColor, Shade[Shade.Shade1]);
+  neutralLighter, // BaseSlots.backgroundColor, Shade[Shade.Shade2]);
+  neutralLight, // BaseSlots.backgroundColor, Shade[Shade.Shade3]);
+  neutralQuaternaryAlt, // BaseSlots.backgroundColor, Shade[Shade.Shade4]);
+  neutralQuaternary, // BaseSlots.backgroundColor, Shade[Shade.Shade5]);
+  neutralTertiaryAlt, // BaseSlots.backgroundColor, Shade[Shade.Shade6]); // bg6 or fg2
+  neutralTertiary, // BaseSlots.foregroundColor, Shade[Shade.Shade3]);
+  // deprecated: neutralSecondaryAlt, // BaseSlots.foregroundColor, Shade[Shade.Shade4]);
+  neutralSecondary, // BaseSlots.foregroundColor, Shade[Shade.Shade5]);
+  neutralPrimaryAlt, // BaseSlots.foregroundColor, Shade[Shade.Shade6]);
+  neutralPrimary, // BaseSlots.foregroundColor, Shade[Shade.Unshaded]);
+  neutralDark, // BaseSlots.foregroundColor, Shade[Shade.Shade7]);
+
+  black, // BaseSlots.foregroundColor, Shade[Shade.Shade8]);
+  white, // BaseSlots.backgroundColor, Shade[Shade.Unshaded]);
+}
+
+/* List of all the semantic color slots for this theme.
+ * This is not so much an enum as it is a list. The enum is used to insure "type"-safety. */
+export enum SemanticColorSlots {
+  bodyBackground,
+  bodyText,
+  disabledBackground,
+  disabledText
+}
+
+export function themeRulesStandardCreator() {
+  let slotRules: IThemeRules = {};
+
+  /*** BASE COLORS and their SHADES */
+  // iterate through each base slot and make the SlotRules for those
+  mapEnumByName(BaseSlots, (baseSlot: string) => {
+    // first make the SlotRule for the unshaded base Color
+    slotRules[baseSlot] = {
+      name: baseSlot,
+      isCustomized: true
+    };
+
+    // then make a rule for each shade of this base color, but skip unshaded
+    mapEnumByName(Shade, (shadeName: string, shadeValue) => {
+      if (shadeName === Shade[Shade.Unshaded]) {
+        return;
+      }
+      slotRules[baseSlot + shadeName] = {
+        name: baseSlot + shadeName,
+        inherits: slotRules[baseSlot],
+        asShade: shadeValue,
+        isCustomized: false,
+        isBackgroundShade: baseSlot === BaseSlots[BaseSlots.backgroundColor] ? true : false
+      };
+      return void 0;
+    });
+
+    return void 0;
+  });
+
+  // set default colors for the base colors
+  slotRules[BaseSlots[BaseSlots.primaryColor]].color = getColorFromString('#0078d7');
+  slotRules[BaseSlots[BaseSlots.backgroundColor]].color = getColorFromString('#fff');
+  slotRules[BaseSlots[BaseSlots.foregroundColor]].color = getColorFromString('#333');
+
+  // set default colors for shades (the slot rules were already created above and will be used if the base colors ever change)
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade1]].color = getColorFromString('#eff6fc');
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade2]].color = getColorFromString('#deecf9');
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade3]].color = getColorFromString('#c7e0f4');
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade4]].color = getColorFromString('#71afe5');
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade5]].color = getColorFromString('#2b88d8');
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade6]].color = getColorFromString('#106ebe');
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade7]].color = getColorFromString('#005a9e');
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade8]].color = getColorFromString('#004578');
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade1]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade2]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade3]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade4]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade5]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade6]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade7]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade8]].isCustomized = true;
+
+  // set default colors for shades (the slot rules were already created above and will be used if the base colors ever change)
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade1]].color = getColorFromString('#eaeaea');
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade2]].color = getColorFromString('#c8c8c8');
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade3]].color = getColorFromString('#a6a6a6');
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade4]].color = getColorFromString('#767676');
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade5]].color = getColorFromString('#666666');
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade6]].color = getColorFromString('#3c3c3c');
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade7]].color = getColorFromString('#212121');
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade8]].color = getColorFromString('#000000');
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade1]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade2]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade3]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade4]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade5]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade6]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade7]].isCustomized = true;
+  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade8]].isCustomized = true;
+
+  function _makeFabricSlotRule(slotName: string, inheritedBase: BaseSlots, inheritedShade: Shade, isBackgroundShade = false) {
+    slotRules[slotName] = {
+      name: slotName,
+      inherits: slotRules[BaseSlots[inheritedBase]],
+      asShade: inheritedShade,
+      isCustomized: false,
+      isBackgroundShade: isBackgroundShade
+    };
+  }
+  _makeFabricSlotRule(FabricSlots[FabricSlots.themePrimary], BaseSlots.primaryColor, Shade.Unshaded);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.themeLighterAlt], BaseSlots.primaryColor, Shade.Shade1);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.themeLighter], BaseSlots.primaryColor, Shade.Shade2);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.themeLight], BaseSlots.primaryColor, Shade.Shade3);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.themeTertiary], BaseSlots.primaryColor, Shade.Shade4);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.themeSecondary], BaseSlots.primaryColor, Shade.Shade5);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.themeDarkAlt], BaseSlots.primaryColor, Shade.Shade6);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.themeDark], BaseSlots.primaryColor, Shade.Shade7);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.themeDarker], BaseSlots.primaryColor, Shade.Shade8);
+
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralLighterAlt], BaseSlots.backgroundColor, Shade.Shade1, true);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralLighter], BaseSlots.backgroundColor, Shade.Shade2, true);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralLight], BaseSlots.backgroundColor, Shade.Shade3, true);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralQuaternaryAlt], BaseSlots.backgroundColor, Shade.Shade4, true);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralQuaternary], BaseSlots.backgroundColor, Shade.Shade5, true);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralTertiaryAlt], BaseSlots.backgroundColor, Shade.Shade6, true); // bg6 or fg2
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralTertiary], BaseSlots.foregroundColor, Shade.Shade3);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralSecondary], BaseSlots.foregroundColor, Shade.Shade5);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralPrimaryAlt], BaseSlots.foregroundColor, Shade.Shade6);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralPrimary], BaseSlots.foregroundColor, Shade.Unshaded);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralDark], BaseSlots.foregroundColor, Shade.Shade7);
+
+  _makeFabricSlotRule(FabricSlots[FabricSlots.black], BaseSlots.foregroundColor, Shade.Shade8);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.white], BaseSlots.backgroundColor, Shade.Unshaded, true);
+
+  // manually set initial colors for the primary-based Fabric slots to match the default theme
+  slotRules[FabricSlots[FabricSlots.themeLighterAlt]].color = getColorFromString('#eff6fc');
+  slotRules[FabricSlots[FabricSlots.themeLighter]].color = getColorFromString('#deecf9');
+  slotRules[FabricSlots[FabricSlots.themeLight]].color = getColorFromString('#c7e0f4');
+  slotRules[FabricSlots[FabricSlots.themeTertiary]].color = getColorFromString('#71afe5');
+  slotRules[FabricSlots[FabricSlots.themeSecondary]].color = getColorFromString('#2b88d8');
+  slotRules[FabricSlots[FabricSlots.themeDarkAlt]].color = getColorFromString('#106ebe');
+  slotRules[FabricSlots[FabricSlots.themeDark]].color = getColorFromString('#005a9e');
+  slotRules[FabricSlots[FabricSlots.themeDarker]].color = getColorFromString('#004578');
+  slotRules[FabricSlots[FabricSlots.themeLighterAlt]].isCustomized = true;
+  slotRules[FabricSlots[FabricSlots.themeLighter]].isCustomized = true;
+  slotRules[FabricSlots[FabricSlots.themeLight]].isCustomized = true;
+  slotRules[FabricSlots[FabricSlots.themeTertiary]].isCustomized = true;
+  slotRules[FabricSlots[FabricSlots.themeSecondary]].isCustomized = true;
+  slotRules[FabricSlots[FabricSlots.themeDarkAlt]].isCustomized = true;
+  slotRules[FabricSlots[FabricSlots.themeDark]].isCustomized = true;
+  slotRules[FabricSlots[FabricSlots.themeDarker]].isCustomized = true;
+
+  // todo: can remove this once we remove these outdated slots from the product
+  let primaryBackground = 'primaryBackground';
+  slotRules[primaryBackground] = {
+    name: primaryBackground,
+    inherits: slotRules[FabricSlots[FabricSlots.white]],
+    isCustomized: false
+  };
+  let primaryText = 'primaryText';
+  slotRules[primaryText] = {
+    name: primaryText,
+    inherits: slotRules[FabricSlots[FabricSlots.neutralPrimary]],
+    isCustomized: false
+  };
+
+  /*** SEMANTIC SLOTS */
+  // create the SlotRule for a semantic slot
+  function _makeSemanticSlotRule(semanticSlot: SemanticColorSlots, inheritedFabricSlot: FabricSlots) {
+    slotRules[SemanticColorSlots[semanticSlot]] = {
+      name: SemanticColorSlots[semanticSlot],
+      inherits: slotRules[FabricSlots[inheritedFabricSlot]],
+      isCustomized: false
+    };
+  }
+
+  // Basics simple content slots
+  _makeSemanticSlotRule(SemanticColorSlots.bodyBackground, FabricSlots.white);
+  _makeSemanticSlotRule(SemanticColorSlots.bodyText, FabricSlots.neutralPrimary);
+  _makeSemanticSlotRule(SemanticColorSlots.disabledBackground, FabricSlots.neutralLighter);
+  _makeSemanticSlotRule(SemanticColorSlots.disabledText, FabricSlots.neutralTertiaryAlt);
+
+  return slotRules;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/index.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/index.ts
new file mode 100644
index 0000000000000..e9dbaa867d220
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/index.ts
@@ -0,0 +1,4 @@
+export * from './ThemeGenerator';
+export * from './IThemeSlotRule';
+export * from './IThemeRules';
+export * from './ThemeRulesStandard';
diff --git a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
index b581aab573a1e..169924b84986a 100644
--- a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
+++ b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
@@ -338,12 +338,18 @@ export const AppDefinition: IAppDefinition = {
           name: 'Themes',
           url: '#examples/themes'
         },
+        {
+          component: require<any>('../components/ThemeGenerator/ThemeGeneratorPage').ThemeGeneratorPage,
+          key: 'Theme Generator',
+          name: 'Beta Theme Generator',
+          url: '#examples/themeGenerator'
+        },
         {
           component: require<any>('./ComponentStatus/ComponentStatusPage').ComponentStatusPage,
           key: 'Components Status',
           name: 'Components Checklist',
           url: '#/components-status'
-        },
+        }
       ],
       name: 'Utilities'
     }
diff --git a/packages/office-ui-fabric-react/src/utilities/color/index.ts b/packages/office-ui-fabric-react/src/utilities/color/index.ts
index 1bae1c0e497ca..9b04c762c9349 100644
--- a/packages/office-ui-fabric-react/src/utilities/color/index.ts
+++ b/packages/office-ui-fabric-react/src/utilities/color/index.ts
@@ -1 +1,2 @@
 export * from './colors';
+export * from './shades';
diff --git a/packages/office-ui-fabric-react/src/utilities/color/shades.ts b/packages/office-ui-fabric-react/src/utilities/color/shades.ts
new file mode 100644
index 0000000000000..8a5178887ca35
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/utilities/color/shades.ts
@@ -0,0 +1,191 @@
+// Technically this should be shades and tints, but for simplicity we'll call everything a shade.
+/* This utility module is used with theming. Given a color to shade, whether the theme is inverted (i.e. is a dark color),
+ * and the desired shade enum, this will return an appropriate shade of that color.
+ */
+import {
+  IColor,
+  MAX_COLOR_RGBA
+} from './colors';
+import * as Colors from './colors';
+import { assign } from '../../Utilities';
+
+// Soften: to get closer to the background color's luminance (softening with a white background would be lightening, with black it'd be darkening)
+// Strongen: opposite of soften
+
+// Luminance multiplier constants for generating shades of a given color
+const WhiteShadeTableBG = [.973, .957, .918, .855, .816, .784, .651, .463]; // white bg
+const BlackTintTableBG = [.463, .55, .651, .784, .816, .855, .918, .957]; // black bg
+const WhiteShadeTable = [.463, .651, .784, .816, .855, .918, .957, .973]; // white fg
+const BlackTintTable = [.463, .55, .651, .784, .816, .855, .918, .957]; // black fg
+const LumTintTable = [.12, .23, .34, .45, .56, .67, .78, .89]; // light (strongen all)
+const LumShadeTable = [.89, .78, .67, .56, .45, .34, .23, .12]; // dark (soften all)
+const ColorTintTable = [.050, .100, .200, .42, .90]; // default soften
+const ColorShadeTable = [.90, .70, .550]; // default strongen
+
+// If the given shade's luminance is below/above these values, we'll swap to using the White/Black tables above
+const c_LuminanceLow = 0.2;
+const c_LuminanceHigh = 0.8;
+
+/** Shades of a given color, from softest to strongest. */
+export enum Shade {
+  Unshaded = 0,
+  Shade1 = 1,
+  Shade2 = 2,
+  Shade3 = 3,
+  Shade4 = 4,
+  Shade5 = 5,
+  Shade6 = 6,
+  Shade7 = 7,
+  Shade8 = 8,
+  // remember to update isValidShade()!
+}
+
+/**
+ * Returns true if the argument is a valid Shade value
+ * @param {Shade} shade The Shade value to validate.
+ */
+export function isValidShade(shade?: Shade): boolean {
+  'use strict';
+  return (typeof shade === 'number') && (shade >= Shade.Unshaded) && (shade <= Shade.Shade8);
+}
+
+function _isBlack(color: IColor): boolean {
+  return color.r === 0 && color.g === 0 && color.b === 0;
+}
+
+function _isWhite(color: IColor): boolean {
+  return color.r === MAX_COLOR_RGBA && color.g === MAX_COLOR_RGBA && color.b === MAX_COLOR_RGBA;
+}
+
+function _darken(hsl: { h: number, s: number, l: number }, factor: number) {
+  return {
+    h: hsl.h,
+    s: hsl.s,
+    l: hsl.l * factor
+  };
+}
+
+function _lighten(hsl: { h: number, s: number, l: number }, factor: number) {
+  return {
+    h: hsl.h,
+    s: hsl.s,
+    l: hsl.l * factor + (100 * (1 - factor))
+  };
+}
+
+export function isDark(color: IColor) {
+  return Colors.hsv2hsl(color.h, color.s, color.v).l < 50;
+}
+
+/**
+ * Given a color and a shade specification, generates the requested shade of the color.
+ * Logic:
+ * if white
+ *  darken via tables defined above
+ * if black
+ *  lighten
+ * if light
+ *  strongen
+ * if dark
+ *  soften
+ * else default
+ *  soften or strongen depending on shade#
+ * @param {IColor} color The base color whose shade is to be computed
+ * @param {Shade} shade The shade of the base color to compute
+ * @param {Boolean} isInverted Default false. Whether the given theme is inverted (reverse strongen/soften logic)
+ */
+export function getShade(color: IColor, shade: Shade, isInverted = false) {
+  'use strict';
+  if (!color) {
+    return null;
+  }
+
+  if (shade === Shade.Unshaded || !isValidShade(shade)) {
+    return color;
+  }
+
+  let hsl = Colors.hsv2hsl(color.h, color.s, color.v);
+  let tableIndex = shade - 1;
+  let _soften = _lighten;
+  let _strongen = _darken;
+  if (isInverted) {
+    // tableIndex = LumTintTable.length - 1 - tableIndex;
+    _soften = _darken;
+    _strongen = _lighten;
+  }
+  if (_isWhite(color)) { // white
+    hsl = _darken(hsl, WhiteShadeTable[tableIndex]);
+  } else if (_isBlack(color)) { // black
+    hsl = _lighten(hsl, BlackTintTable[tableIndex]);
+  } else if (hsl.l / 100 > c_LuminanceHigh) { // light
+    hsl = _strongen(hsl, LumShadeTable[tableIndex]);
+  } else if (hsl.l / 100 < c_LuminanceLow) { // dark
+    hsl = _soften(hsl, LumTintTable[tableIndex]);
+  } else { // default
+    if (tableIndex < ColorTintTable.length) {
+      hsl = _soften(hsl, ColorTintTable[tableIndex]);
+    } else {
+      hsl = _strongen(hsl, ColorShadeTable[tableIndex - ColorTintTable.length]);
+    }
+  }
+
+  return Colors.getColorFromRGBA(assign(Colors.hsl2rgb(hsl.h, hsl.s, hsl.l), { a: color.a }));
+}
+
+// Background shades/tints are generated differently. The provided color will be guaranteed
+//   to be the darkest or lightest one. If it is <50% luminance, it will always be the darkest,
+//   otherwise it will always be the lightest.
+export function getBackgroundShade(color: IColor, shade: Shade, isInverted = false) {
+  'use strict';
+  if (!color) {
+    return null;
+  }
+
+  if (shade === Shade.Unshaded || !isValidShade(shade)) {
+    return color;
+  }
+
+  let hsl = Colors.hsv2hsl(color.h, color.s, color.v);
+  let tableIndex = shade - 1;
+  if (!isInverted) { // lightish
+    hsl = _darken(hsl, WhiteShadeTableBG[tableIndex]);
+  } else { // default: if (hsl.l / 100 < .5) { // darkish
+    hsl = _lighten(hsl, BlackTintTableBG[BlackTintTable.length - 1 - tableIndex]);
+  }
+
+  return Colors.getColorFromRGBA(assign(Colors.hsl2rgb(hsl.h, hsl.s, hsl.l), { a: color.a }));
+}
+
+/* Calculates the contrast ratio between two colors. Used for verifying
+ * color pairs meet minimum accessibility requirements.
+ * See: https://www.w3.org/TR/WCAG20/ section 1.4.3
+ */
+export function getContrastRatio(color1: IColor, color2: IColor) {
+  // Formula defined by: http://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.html#contrast-ratiodef
+  // relative luminance: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef
+
+  /* calculate the intermediate value needed to calculating relative luminance */
+  function _getThing(x: number) {
+    if (x <= .03928) {
+      return x / 12.92;
+    } else {
+      return Math.pow((x + .055) / 1.055, 2.4);
+    }
+  }
+
+  let r1 = _getThing(color1.r / MAX_COLOR_RGBA);
+  let g1 = _getThing(color1.g / MAX_COLOR_RGBA);
+  let b1 = _getThing(color1.b / MAX_COLOR_RGBA);
+  let L1 = (.2126 * r1) + (.7152 * g1) + (.0722 * b1); // relative luminance of first color
+  L1 += .05;
+
+  let r2 = _getThing(color2.r / MAX_COLOR_RGBA);
+  let g2 = _getThing(color2.g / MAX_COLOR_RGBA);
+  let b2 = _getThing(color2.b / MAX_COLOR_RGBA);
+  let L2 = (.2126 * r2) + (.7152 * g2) + (.0722 * b2); // relative luminance of second color
+  L2 += .05;
+
+  // return the lighter color divided by darker
+  return L1 / L2 > 1 ?
+    L1 / L2 : L2 / L1;
+}
\ No newline at end of file
diff --git a/packages/utilities/src/object.test.ts b/packages/utilities/src/object.test.ts
index 12f21f5b59793..cae149f454b6f 100644
--- a/packages/utilities/src/object.test.ts
+++ b/packages/utilities/src/object.test.ts
@@ -1,4 +1,4 @@
-import { assign, filteredAssign } from './object';
+import { assign, filteredAssign, mapEnumByName } from './object';
 
 describe('assign', () => {
   it('can copy an object', () => {
@@ -30,4 +30,26 @@ describe('filteredAssign', () => {
     expect(result.a).toEqual(1);
     expect(result.b).toBeUndefined();
   });
+});
+
+describe('mapEnumByName', () => {
+  it('iterates over all the strings of an enum', () => {
+    enum foo {
+      first,
+      second,
+      third,
+      fourth
+    }
+
+    let result: string[] = [];
+    mapEnumByName(foo, (name: string) => {
+      if (name) {
+        result.push(name);
+      } else {
+        expect(name).not.toBeFalsy;
+      }
+    });
+
+    expect(result).toEqual(['first', 'second', 'third', 'fourth']);
+  });
 });
\ No newline at end of file
diff --git a/packages/utilities/src/object.ts b/packages/utilities/src/object.ts
index 84dbf94049479..a6bc2020f2929 100644
--- a/packages/utilities/src/object.ts
+++ b/packages/utilities/src/object.ts
@@ -85,3 +85,16 @@ export function getId(prefix?: string): string {
 
   return (prefix || '') + index;
 }
+
+/* Takes an enum and iterates over each value of the enum (as a string), running the callback on each, returning a mapped array.
+ * The callback takes as a first parameter the string that represents the name of the entry, and the second parameter is the
+ * value of that entry, which is the value you'd normally use when using the enum (usually a number).
+ * */
+export function mapEnumByName<T>(theEnum: any, callback: (name?: string, value?: any) => T | undefined): T[] | undefined {
+  // map<any> to satisfy compiler since it doesn't realize we strip out undefineds in the .filter() call
+  return Object.keys(theEnum).map<any>((p: string) => { // map on each property name as a string
+    if (String(Number(p)) !== p) { // if the property is not just a number (because enums in TypeScript will map both ways)
+      return callback(p, theEnum[p]);
+    }
+  }).filter((v: any) => !!v); // only return elements with values
+}
\ No newline at end of file

From 6812dbed7f05c698eb687bf7cf3d3481b4fe642b Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Thu, 21 Sep 2017 16:51:00 -0700
Subject: [PATCH 0692/1641] Reinforced typography styles across website pages
 to deal with UHF styling conflicts (#2915)

* Reinforced header tag styles across website pages

* Added change file

* iOS + Angular links fix

* Page navigation bugs

* Updated toolkit lingo and base page className

* The Fabric toolkit -> The Fabric design toolkit

* Re-removed global tag
---
 .../PageHeader/PageHeader.module.scss         |  6 ++++
 .../PageHeaderLink/PageHeaderLink.tsx         | 13 +++-----
 .../Components/BreadcrumbComponentPage.tsx    |  3 +-
 .../pages/Components/ButtonComponentPage.tsx  |  3 +-
 .../pages/Components/CalloutComponentPage.tsx |  3 +-
 .../Components/CheckboxComponentPage.tsx      |  3 +-
 .../Components/ChoiceGroupComponentPage.tsx   |  3 +-
 .../Components/ColorPickerComponentPage.tsx   |  3 +-
 .../Components/ComboBoxComponentPage.tsx      |  3 +-
 .../Components/CommandBarComponentPage.tsx    |  3 +-
 .../Components/ComponentUtilitiesPage.tsx     |  3 +-
 .../ContextualMenuComponentPage.tsx           |  3 +-
 .../Components/DatePickerComponentPage.tsx    |  3 +-
 .../Components/DetailsListComponentPage.tsx   |  3 +-
 .../pages/Components/DialogComponentPage.tsx  |  3 +-
 .../Components/DocumentCardComponentPage.tsx  |  3 +-
 .../Components/DropdownComponentPage.tsx      |  3 +-
 .../Components/FacepileComponentPage.tsx      |  3 +-
 .../Components/FocusTrapZoneUtilityPage.tsx   |  3 +-
 .../pages/Components/FocusZoneUtilityPage.tsx |  3 +-
 .../Components/GroupedListComponentPage.tsx   |  3 +-
 .../pages/Components/ImageComponentPage.tsx   |  3 +-
 .../pages/Components/LabelComponentPage.tsx   |  3 +-
 .../pages/Components/LayerComponentPage.tsx   |  3 +-
 .../pages/Components/LinkComponentPage.tsx    |  3 +-
 .../pages/Components/ListComponentPage.tsx    |  3 +-
 .../MarqueeSelectionUtilityPage.tsx           |  3 +-
 .../Components/MessageBarComponentPage.tsx    |  3 +-
 .../pages/Components/ModalComponentPage.tsx   |  3 +-
 .../src/pages/Components/NavComponentPage.tsx |  3 +-
 .../pages/Components/OverlayComponentPage.tsx |  3 +-
 .../pages/Components/PanelComponentPage.tsx   |  3 +-
 .../Components/PeoplePickerComponentPage.tsx  |  3 +-
 .../pages/Components/PersonaComponentPage.tsx |  3 +-
 .../pages/Components/PickersComponentPage.tsx |  3 +-
 .../pages/Components/PivotComponentPage.tsx   |  3 +-
 .../ProgressIndicatorComponentPage.tsx        |  3 +-
 .../pages/Components/RatingComponentPage.tsx  |  3 +-
 .../Components/ResizeGroupComponentPage.tsx   |  3 +-
 .../Components/SearchBoxComponentPage.tsx     |  3 +-
 .../pages/Components/SelectionUtilityPage.tsx |  3 +-
 .../pages/Components/SliderComponentPage.tsx  |  3 +-
 .../Components/SpinButtonComponentPage.tsx    |  3 +-
 .../pages/Components/SpinnerComponentPage.tsx |  3 +-
 .../SwatchColorPickerComponentPage.tsx        |  3 +-
 .../Components/TextFieldComponentPage.tsx     |  3 +-
 .../pages/Components/ThemesUtilityPage.tsx    |  3 +-
 .../pages/Components/ToggleComponentPage.tsx  |  3 +-
 .../pages/Components/TooltipComponentPage.tsx |  3 +-
 .../GetStarted/GetStartedPage.module.scss     | 12 +++----
 .../src/pages/GetStarted/GetStartedPage.tsx   |  5 +--
 .../src/pages/HomePage/HomePage.module.scss   | 13 ++++++++
 .../src/pages/HomePage/HomePage.tsx           |  2 +-
 .../src/pages/Interstitials/AngularJSPage.tsx |  2 +-
 .../src/pages/Interstitials/FabricIOSPage.tsx |  2 +-
 .../Interstitials/Interstitials.module.scss   | 16 +++++----
 .../src/pages/Overviews/ComponentsPage.tsx    |  2 +-
 .../src/pages/Overviews/StylesPage.tsx        |  2 +-
 .../src/pages/PageStyles.module.scss          | 20 +++++++++++
 .../ResourcesPage/ResourcesPage.module.scss   |  7 +++-
 .../src/pages/ResourcesPage/ResourcesPage.tsx | 33 ++++++++++---------
 .../Styles/AnimationsPage/AnimationsPage.tsx  |  2 +-
 .../Styles/BrandIconsPage/BrandIconsPage.tsx  |  2 +-
 .../pages/Styles/ColorsPage/ColorsPage.tsx    |  2 +-
 .../src/pages/Styles/IconsPage/IconsPage.tsx  |  2 +-
 .../pages/Styles/LayoutPage/LayoutPage.tsx    |  2 +-
 .../LocalizationPage/LocalizationPage.tsx     |  2 +-
 .../Styles/TypographyPage/TypographyPage.tsx  |  2 +-
 .../Styles/UtilitiesPage/UtilitiesPage.tsx    |  2 +-
 .../src/styles/_typography.scss               |  4 +--
 .../fabric-website/src/styles/_variables.scss |  2 ++
 .../uhf-bugs-v3_2017-09-21-17-55.json         | 11 +++++++
 .../src/common/_exampleStyles.scss            | 12 +++----
 73 files changed, 210 insertions(+), 111 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/uhf-bugs-v3_2017-09-21-17-55.json

diff --git a/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss b/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss
index 5a99ccf1b3585..6a5a20ccf4790 100644
--- a/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss
+++ b/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss
@@ -126,6 +126,7 @@
   }
 }
 
+// UHF specific breakpoint
 @media only screen and (max-width: $uhf-screen-max-lg) and (min-width: $uhf-screen-min-mobile) {
   .pageHeader {
     &.isAttached {
@@ -134,4 +135,9 @@
       }
     }
   }
+
+  .pageNav ul li a {
+    @include ms-margin-right(20px);
+    font-size: 14px;
+  }
 }
\ No newline at end of file
diff --git a/apps/fabric-website/src/components/PageHeaderLink/PageHeaderLink.tsx b/apps/fabric-website/src/components/PageHeaderLink/PageHeaderLink.tsx
index 3eb0c27ef7e22..7df2fe10da8d4 100644
--- a/apps/fabric-website/src/components/PageHeaderLink/PageHeaderLink.tsx
+++ b/apps/fabric-website/src/components/PageHeaderLink/PageHeaderLink.tsx
@@ -25,17 +25,12 @@ export class PageHeaderLink extends React.Component<IPageHeaderLink, {}> {
 
   public render() {
     return (
-      <a ref={(a) => {this._els.link = a; }} href={ this.props.href } data-title={ this.props.text }>{ this.props.text }</a>
+      <a ref={ (a) => { this._els.link = a; } } href={ this.props.href } data-title={ this.props.text }>{ this.props.text }</a>
     );
   }
 
   private _setScrollDistance(): number {
-    switch (this.currentBreakpoint) {
-      case ('LG'):
-        return 240;
-      default:
-        return 200;
-    }
+    return 160; // UHF header change the requirement
   }
 
   private _getBreakpoint() {
@@ -65,8 +60,8 @@ export class PageHeaderLink extends React.Component<IPageHeaderLink, {}> {
     }
 
     let scrollTarget = (navigator.userAgent.toLowerCase().indexOf('firefox') > -1) ?
-          document.querySelector('html') :
-          document.querySelector('body');
+      document.querySelector('html') :
+      document.querySelector('body');
 
     Animate.scrollTo(scrollTarget as HTMLElement, {
       duration: 0.3,
diff --git a/apps/fabric-website/src/pages/Components/BreadcrumbComponentPage.tsx b/apps/fabric-website/src/pages/Components/BreadcrumbComponentPage.tsx
index b5842351ce53e..d276e6eefde03 100644
--- a/apps/fabric-website/src/pages/Components/BreadcrumbComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/BreadcrumbComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { BreadcrumbPage } from 'office-ui-fabric-react/lib/components/Breadcrumb/BreadcrumbPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class BreadcrumbComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Breadcrumb' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/ButtonComponentPage.tsx b/apps/fabric-website/src/pages/Components/ButtonComponentPage.tsx
index 96656339b8434..557def4212b0b 100644
--- a/apps/fabric-website/src/pages/Components/ButtonComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ButtonComponentPage.tsx
@@ -2,12 +2,13 @@ import * as React from 'react';
 import { ButtonPage } from 'office-ui-fabric-react/lib/components/Button/ButtonPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class ButtonComponentPage extends React.Component<any, any> {
   public render() {
     return (
 
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Button' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/CalloutComponentPage.tsx b/apps/fabric-website/src/pages/Components/CalloutComponentPage.tsx
index d506ab058975d..f75a934d3b92a 100644
--- a/apps/fabric-website/src/pages/Components/CalloutComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/CalloutComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { CalloutPage } from 'office-ui-fabric-react/lib/components/Callout/CalloutPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class CalloutComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Callout' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/CheckboxComponentPage.tsx b/apps/fabric-website/src/pages/Components/CheckboxComponentPage.tsx
index be3b326b74745..d99002a05bcaf 100644
--- a/apps/fabric-website/src/pages/Components/CheckboxComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/CheckboxComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { CheckboxPage } from 'office-ui-fabric-react/lib/components/Checkbox/CheckboxPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class CheckboxComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Checkbox' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/ChoiceGroupComponentPage.tsx b/apps/fabric-website/src/pages/Components/ChoiceGroupComponentPage.tsx
index f030783049094..723b7e279c686 100644
--- a/apps/fabric-website/src/pages/Components/ChoiceGroupComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ChoiceGroupComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { ChoiceGroupPage } from 'office-ui-fabric-react/lib/components/ChoiceGroup/ChoiceGroupPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class ChoiceGroupComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='ChoiceGroup' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/ColorPickerComponentPage.tsx b/apps/fabric-website/src/pages/Components/ColorPickerComponentPage.tsx
index 4bd2e4aac14f4..20db2063b9096 100644
--- a/apps/fabric-website/src/pages/Components/ColorPickerComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ColorPickerComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { ColorPickerPage } from 'office-ui-fabric-react/lib/components/ColorPicker/ColorPickerPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class ColorPickerComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='ColorPicker' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/ComboBoxComponentPage.tsx b/apps/fabric-website/src/pages/Components/ComboBoxComponentPage.tsx
index dd4467690c113..d28667aeabcd0 100644
--- a/apps/fabric-website/src/pages/Components/ComboBoxComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ComboBoxComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { ComboBoxPage } from 'office-ui-fabric-react/lib/components/ComboBox/ComboBoxPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class ComboBoxComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='ComboBox' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/CommandBarComponentPage.tsx b/apps/fabric-website/src/pages/Components/CommandBarComponentPage.tsx
index 4bf6150db139a..e94c819062b61 100644
--- a/apps/fabric-website/src/pages/Components/CommandBarComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/CommandBarComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { CommandBarPage } from 'office-ui-fabric-react/lib/components/CommandBar/CommandBarPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class CommandBarComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='CommandBar' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/ComponentUtilitiesPage.tsx b/apps/fabric-website/src/pages/Components/ComponentUtilitiesPage.tsx
index 4e6ff877f1316..bf17459fd3717 100644
--- a/apps/fabric-website/src/pages/Components/ComponentUtilitiesPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ComponentUtilitiesPage.tsx
@@ -1,11 +1,12 @@
 import * as React from 'react';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage, IComponentPageProps } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class ComponentUtilitiesPage extends React.Component<IComponentPageProps, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Utilities' backgroundColor='#038387' />
           <h2 className='ComponentPage-subHeading'>Overview</h2>
diff --git a/apps/fabric-website/src/pages/Components/ContextualMenuComponentPage.tsx b/apps/fabric-website/src/pages/Components/ContextualMenuComponentPage.tsx
index 09e3b1bcd19a7..2a005a6a0dfd2 100644
--- a/apps/fabric-website/src/pages/Components/ContextualMenuComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ContextualMenuComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { ContextualMenuPage } from 'office-ui-fabric-react/lib/components/ContextualMenu/ContextualMenuPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class ContextualMenuComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='ContextualMenu' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/DatePickerComponentPage.tsx b/apps/fabric-website/src/pages/Components/DatePickerComponentPage.tsx
index a4d5389df6027..34351c3d78f9f 100644
--- a/apps/fabric-website/src/pages/Components/DatePickerComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/DatePickerComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { DatePickerPage } from 'office-ui-fabric-react/lib/components/DatePicker/DatePickerPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class DatePickerComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='DatePicker' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/DetailsListComponentPage.tsx b/apps/fabric-website/src/pages/Components/DetailsListComponentPage.tsx
index 0d07d24331006..f2162f1e73466 100644
--- a/apps/fabric-website/src/pages/Components/DetailsListComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/DetailsListComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { DetailsListPage } from 'office-ui-fabric-react/lib/components/DetailsList/DetailsListPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class DetailsListComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='DetailsList' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/DialogComponentPage.tsx b/apps/fabric-website/src/pages/Components/DialogComponentPage.tsx
index 34bbb8f2bc013..0d963f4793c04 100644
--- a/apps/fabric-website/src/pages/Components/DialogComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/DialogComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { DialogPage } from 'office-ui-fabric-react/lib/components/Dialog/DialogPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class DialogComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Dialog' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/DocumentCardComponentPage.tsx b/apps/fabric-website/src/pages/Components/DocumentCardComponentPage.tsx
index 898084b87f3f5..f07d9a8419edb 100644
--- a/apps/fabric-website/src/pages/Components/DocumentCardComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/DocumentCardComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { DocumentCardPage } from 'office-ui-fabric-react/lib/components/DocumentCard/DocumentCardPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class DocumentCardComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='DocumentCard' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/DropdownComponentPage.tsx b/apps/fabric-website/src/pages/Components/DropdownComponentPage.tsx
index 6896da9692162..dfb842f62a74c 100644
--- a/apps/fabric-website/src/pages/Components/DropdownComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/DropdownComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { DropdownPage } from 'office-ui-fabric-react/lib/components/Dropdown/DropdownPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class DropdownComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Dropdown' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/FacepileComponentPage.tsx b/apps/fabric-website/src/pages/Components/FacepileComponentPage.tsx
index 19dfa5ec9fa9e..a66ac2fd56f14 100644
--- a/apps/fabric-website/src/pages/Components/FacepileComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/FacepileComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { FacepilePage } from 'office-ui-fabric-react/lib/components/Facepile/FacepilePage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class FacepileComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Facepile' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/FocusTrapZoneUtilityPage.tsx b/apps/fabric-website/src/pages/Components/FocusTrapZoneUtilityPage.tsx
index 080cfa91971db..c7e9b107a45f6 100644
--- a/apps/fabric-website/src/pages/Components/FocusTrapZoneUtilityPage.tsx
+++ b/apps/fabric-website/src/pages/Components/FocusTrapZoneUtilityPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { FocusTrapZonePage } from 'office-ui-fabric-react/lib/components/FocusTrapZone/FocusTrapZonePage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class FocusTrapZoneUtilityPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='FocusTrapZone' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/FocusZoneUtilityPage.tsx b/apps/fabric-website/src/pages/Components/FocusZoneUtilityPage.tsx
index bcfd73d062aea..961cdec0c6c04 100644
--- a/apps/fabric-website/src/pages/Components/FocusZoneUtilityPage.tsx
+++ b/apps/fabric-website/src/pages/Components/FocusZoneUtilityPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { FocusZonePage } from 'office-ui-fabric-react/lib/components/FocusZone/FocusZonePage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class FocusZoneUtilityPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='FocusZone' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/GroupedListComponentPage.tsx b/apps/fabric-website/src/pages/Components/GroupedListComponentPage.tsx
index 39b9a59d2613a..c1b30ecae7394 100644
--- a/apps/fabric-website/src/pages/Components/GroupedListComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/GroupedListComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { GroupedListPage } from 'office-ui-fabric-react/lib/components/GroupedList/GroupedListPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class GroupedListComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='GroupedList' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/ImageComponentPage.tsx b/apps/fabric-website/src/pages/Components/ImageComponentPage.tsx
index b56bc017628c9..fd5ba3eef6504 100644
--- a/apps/fabric-website/src/pages/Components/ImageComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ImageComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { ImagePage } from 'office-ui-fabric-react/lib/components/Image/ImagePage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class ImageComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Image' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/LabelComponentPage.tsx b/apps/fabric-website/src/pages/Components/LabelComponentPage.tsx
index 0e91a40593283..bcd515ffc223f 100644
--- a/apps/fabric-website/src/pages/Components/LabelComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/LabelComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { LabelPage } from 'office-ui-fabric-react/lib/components/Label/LabelPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class LabelComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Label' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/LayerComponentPage.tsx b/apps/fabric-website/src/pages/Components/LayerComponentPage.tsx
index c27364b3496b6..e70bfb15411ab 100644
--- a/apps/fabric-website/src/pages/Components/LayerComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/LayerComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { LayerPage } from 'office-ui-fabric-react/lib/components/Layer/LayerPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class LayerComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Layer' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/LinkComponentPage.tsx b/apps/fabric-website/src/pages/Components/LinkComponentPage.tsx
index c77b8020adb42..a2cc475342a87 100644
--- a/apps/fabric-website/src/pages/Components/LinkComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/LinkComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { LinkPage } from 'office-ui-fabric-react/lib/components/Link/LinkPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class LinkComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Link' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/ListComponentPage.tsx b/apps/fabric-website/src/pages/Components/ListComponentPage.tsx
index 58832cf618184..991a8a3c799e2 100644
--- a/apps/fabric-website/src/pages/Components/ListComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ListComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { ListPage } from 'office-ui-fabric-react/lib/components/List/ListPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class ListComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='List' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/MarqueeSelectionUtilityPage.tsx b/apps/fabric-website/src/pages/Components/MarqueeSelectionUtilityPage.tsx
index 7ad98ace1f702..9dde9e1fb0ee5 100644
--- a/apps/fabric-website/src/pages/Components/MarqueeSelectionUtilityPage.tsx
+++ b/apps/fabric-website/src/pages/Components/MarqueeSelectionUtilityPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { MarqueeSelectionPage } from 'office-ui-fabric-react/lib/components/MarqueeSelection/MarqueeSelectionPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class MarqueeSelectionUtilityPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='MarqueeSelection' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/MessageBarComponentPage.tsx b/apps/fabric-website/src/pages/Components/MessageBarComponentPage.tsx
index 3e9809b7f970a..f46b89f877fbe 100644
--- a/apps/fabric-website/src/pages/Components/MessageBarComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/MessageBarComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { MessageBarPage } from 'office-ui-fabric-react/lib/components/MessageBar/MessageBarPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class MessageBarComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='MessageBar' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/ModalComponentPage.tsx b/apps/fabric-website/src/pages/Components/ModalComponentPage.tsx
index 689b927bdd414..57a01aaac0bc9 100644
--- a/apps/fabric-website/src/pages/Components/ModalComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ModalComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { ModalPage } from 'office-ui-fabric-react/lib/components/Modal/ModalPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class ModalComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Modal' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/NavComponentPage.tsx b/apps/fabric-website/src/pages/Components/NavComponentPage.tsx
index 04978986874ae..6256e255061da 100644
--- a/apps/fabric-website/src/pages/Components/NavComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/NavComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { NavPage } from 'office-ui-fabric-react/lib/components/Nav/NavPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class NavComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Nav' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/OverlayComponentPage.tsx b/apps/fabric-website/src/pages/Components/OverlayComponentPage.tsx
index 66c0760064b16..50c4e675ba21a 100644
--- a/apps/fabric-website/src/pages/Components/OverlayComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/OverlayComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { OverlayPage } from 'office-ui-fabric-react/lib/components/Overlay/OverlayPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class OverlayComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Overlay' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/PanelComponentPage.tsx b/apps/fabric-website/src/pages/Components/PanelComponentPage.tsx
index 7b5440c7530b8..39525ce749d6e 100644
--- a/apps/fabric-website/src/pages/Components/PanelComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/PanelComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { PanelPage } from 'office-ui-fabric-react/lib/components/Panel/PanelPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class PanelComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Panel' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/PeoplePickerComponentPage.tsx b/apps/fabric-website/src/pages/Components/PeoplePickerComponentPage.tsx
index e3bd94b85d273..f44ffae296bba 100644
--- a/apps/fabric-website/src/pages/Components/PeoplePickerComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/PeoplePickerComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { PeoplePickerPage } from 'office-ui-fabric-react/lib/components/pickers/PeoplePicker/PeoplePickerPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class PeoplePickerComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='PeoplePicker' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/PersonaComponentPage.tsx b/apps/fabric-website/src/pages/Components/PersonaComponentPage.tsx
index 44b9622ce095f..d4f6fc356a1ad 100644
--- a/apps/fabric-website/src/pages/Components/PersonaComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/PersonaComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { PersonaPage } from 'office-ui-fabric-react/lib/components/Persona/PersonaPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class PersonaComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Persona' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/PickersComponentPage.tsx b/apps/fabric-website/src/pages/Components/PickersComponentPage.tsx
index 5a379853f9d77..f94833f6f8e1d 100644
--- a/apps/fabric-website/src/pages/Components/PickersComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/PickersComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { PickersPage } from 'office-ui-fabric-react/lib/components/pickers/PickersPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class PickersComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Pickers' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/PivotComponentPage.tsx b/apps/fabric-website/src/pages/Components/PivotComponentPage.tsx
index 2977d21212364..e8398762fffd2 100644
--- a/apps/fabric-website/src/pages/Components/PivotComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/PivotComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { PivotPage } from 'office-ui-fabric-react/lib/components/Pivot/PivotPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class PivotComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Pivot' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/ProgressIndicatorComponentPage.tsx b/apps/fabric-website/src/pages/Components/ProgressIndicatorComponentPage.tsx
index 3e198b7da0cf5..ea171cf34ada6 100644
--- a/apps/fabric-website/src/pages/Components/ProgressIndicatorComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ProgressIndicatorComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { ProgressIndicatorPage } from 'office-ui-fabric-react/lib/components/ProgressIndicator/ProgressIndicatorPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class ProgressIndicatorComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='ProgressIndicator' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/RatingComponentPage.tsx b/apps/fabric-website/src/pages/Components/RatingComponentPage.tsx
index fc5032612e455..425400fe3f25d 100644
--- a/apps/fabric-website/src/pages/Components/RatingComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/RatingComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { RatingPage } from 'office-ui-fabric-react/lib/components/Rating/RatingPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class RatingComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Rating' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/ResizeGroupComponentPage.tsx b/apps/fabric-website/src/pages/Components/ResizeGroupComponentPage.tsx
index 5588bddd728c0..b42ff83880eb2 100644
--- a/apps/fabric-website/src/pages/Components/ResizeGroupComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ResizeGroupComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { ResizeGroupPage } from 'office-ui-fabric-react/lib/components/ResizeGroup/ResizeGroupPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class ResizeGroupComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='ResizeGroupPage' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/SearchBoxComponentPage.tsx b/apps/fabric-website/src/pages/Components/SearchBoxComponentPage.tsx
index 4c7a1d6df9ca8..d061fa96467dc 100644
--- a/apps/fabric-website/src/pages/Components/SearchBoxComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/SearchBoxComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { SearchBoxPage } from 'office-ui-fabric-react/lib/components/SearchBox/SearchBoxPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class SearchBoxComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='SearchBox' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/SelectionUtilityPage.tsx b/apps/fabric-website/src/pages/Components/SelectionUtilityPage.tsx
index 09ab149c501d3..17e72e6f9ecff 100644
--- a/apps/fabric-website/src/pages/Components/SelectionUtilityPage.tsx
+++ b/apps/fabric-website/src/pages/Components/SelectionUtilityPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { SelectionPage } from 'office-ui-fabric-react/lib/utilities/selection/SelectionPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class SelectionUtilityPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Selection' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/SliderComponentPage.tsx b/apps/fabric-website/src/pages/Components/SliderComponentPage.tsx
index 67f486552130c..3e0942992e260 100644
--- a/apps/fabric-website/src/pages/Components/SliderComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/SliderComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { SliderPage } from 'office-ui-fabric-react/lib/components/Slider/SliderPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class SliderComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Slider' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/SpinButtonComponentPage.tsx b/apps/fabric-website/src/pages/Components/SpinButtonComponentPage.tsx
index 9da1685a03e5f..63720a4123f92 100644
--- a/apps/fabric-website/src/pages/Components/SpinButtonComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/SpinButtonComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { SpinButtonPage } from 'office-ui-fabric-react/lib/components/SpinButton/SpinButtonPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class SpinButtonComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='SpinButton' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/SpinnerComponentPage.tsx b/apps/fabric-website/src/pages/Components/SpinnerComponentPage.tsx
index 04fadb5a4d2e9..f49c86830b5a3 100644
--- a/apps/fabric-website/src/pages/Components/SpinnerComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/SpinnerComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { SpinnerPage } from 'office-ui-fabric-react/lib/components/Spinner/SpinnerPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class SpinnerComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Spinner' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/SwatchColorPickerComponentPage.tsx b/apps/fabric-website/src/pages/Components/SwatchColorPickerComponentPage.tsx
index df62880d5e7f6..5f8df73804bc6 100644
--- a/apps/fabric-website/src/pages/Components/SwatchColorPickerComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/SwatchColorPickerComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { SwatchColorPickerPage } from 'office-ui-fabric-react/lib/components/SwatchColorPicker/SwatchColorPickerPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class SwatchColorPickerComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='SwatchColorPicker' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/TextFieldComponentPage.tsx b/apps/fabric-website/src/pages/Components/TextFieldComponentPage.tsx
index fbc314933de1e..3a6667201f028 100644
--- a/apps/fabric-website/src/pages/Components/TextFieldComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/TextFieldComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { TextFieldPage } from 'office-ui-fabric-react/lib/components/TextField/TextFieldPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class TextFieldComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='TextField' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/ThemesUtilityPage.tsx b/apps/fabric-website/src/pages/Components/ThemesUtilityPage.tsx
index 61becc368b20a..81b0c766b8ee9 100644
--- a/apps/fabric-website/src/pages/Components/ThemesUtilityPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ThemesUtilityPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { ThemePage } from 'office-ui-fabric-react/lib/components/Theme/ThemePage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class ThemesUtilityPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Themes' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/ToggleComponentPage.tsx b/apps/fabric-website/src/pages/Components/ToggleComponentPage.tsx
index 18d0051bc2209..f3467d4092592 100644
--- a/apps/fabric-website/src/pages/Components/ToggleComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ToggleComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { TogglePage } from 'office-ui-fabric-react/lib/components/Toggle/TogglePage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class ToggleComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Toggle' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/Components/TooltipComponentPage.tsx b/apps/fabric-website/src/pages/Components/TooltipComponentPage.tsx
index 9eb1b4936295b..13fdb3ac613b9 100644
--- a/apps/fabric-website/src/pages/Components/TooltipComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/TooltipComponentPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { TooltipPage } from 'office-ui-fabric-react/lib/components/Tooltip/TooltipPage';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class TooltipComponentPage extends React.Component<any, any> {
   public render() {
     return (
-      <div ref='pageElement'>
+      <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
           <PageHeader pageTitle='Tooltip' backgroundColor='#038387'
             links={
diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
index 7295ea04ef152..460722261a607 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
@@ -77,10 +77,6 @@
     color: $ms-color-neutralLight;
     max-width: 100%;
   }
-
-  .contentInGrid {
-    padding-left: $contentInGrid;
-  }
 }
 
 .descriptionLarge {
@@ -108,6 +104,10 @@
   img {
     margin-bottom: 20px;
   }
+
+  .contentInGrid {
+    padding-left: $contentInGrid;
+  }
 }
 
 //== Structure section (diagram)
@@ -137,10 +137,6 @@
     color: $color-getStarted-medium;
   }
 
-  h3 {
-    margin: $uhf-h3-margin;
-  }
-
   .trademark {
     margin-top: 80px;
   }
diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
index dabba8bf4f122..4a55b30b71f22 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
@@ -6,11 +6,12 @@ import { PageHeader } from '../../components/PageHeader/PageHeader';
 const diagramStyles: any = require('./GetStartedPage.diagram.module.scss');
 import * as stylesImport from './GetStartedPage.module.scss';
 const styles: any = stylesImport;
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class GetStartedPage extends React.Component<any, any> {
   public render() {
     return (
-      <div id='design'>
+      <div id='design' className={ pageStyles.basePage }>
         <PageHeader
           pageTitle='Get started'
           links={
@@ -63,7 +64,7 @@ export class GetStartedPage extends React.Component<any, any> {
           </div>
           <div id='toolkit'>
             <span className={ styles.title }>Design Toolkit</span>
-            <span className={ styles.descriptionLarge }>The toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences.</span>
+            <span className={ styles.descriptionLarge }>The Fabric design toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences.</span>
             <a className={ styles.getStartedLink } href='#/resources'>Learn more</a>
           </div>
         </div>
diff --git a/apps/fabric-website/src/pages/HomePage/HomePage.module.scss b/apps/fabric-website/src/pages/HomePage/HomePage.module.scss
index 88a00143ddb8e..9f3197f7ec424 100644
--- a/apps/fabric-website/src/pages/HomePage/HomePage.module.scss
+++ b/apps/fabric-website/src/pages/HomePage/HomePage.module.scss
@@ -89,6 +89,12 @@
   }
 }
 
+// UHF specific breakpoint
+@media only screen and (max-width: $uhf-screen-max-lg) and (min-width: $uhf-screen-min-mobile) {
+  .title, .button {
+    text-align: center;
+  }
+}
 
 //== Flavors
 
@@ -172,6 +178,13 @@
   }
 }
 
+// UHF specific breakpoint
+@media only screen and (max-width: $uhf-screen-max-lg) and (min-width: $uhf-screen-min-mobile) {
+  .flavorTitle {
+    text-align: center;
+  }
+}
+
 
 //== Products
 
diff --git a/apps/fabric-website/src/pages/HomePage/HomePage.tsx b/apps/fabric-website/src/pages/HomePage/HomePage.tsx
index 5a8008efba13d..53cbf400a3114 100644
--- a/apps/fabric-website/src/pages/HomePage/HomePage.tsx
+++ b/apps/fabric-website/src/pages/HomePage/HomePage.tsx
@@ -83,7 +83,7 @@ export class HomePage extends React.Component<any, any> {
           </ul>
           <span className={ styles.trademark }>All trademarks are the property of their respective owners. Usage of Fabric assets, such as fonts and icons, is subject to the <a className={ styles.homePageLink } href='https://static2.sharepointonline.com/files/fabric/assets/microsoft_fabric_assets_license_agreement_sept092017.pdf'>assets license agreement</a>.</span>
           <span className={ styles.featuredTitle }>Design Toolkit</span>
-          <span className={ styles.featuredDescription } id={ styles.toolkitDescription }>The toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences. <a className={ styles.homePageLink } href='#/resources'>Learn more</a></span>
+          <span className={ styles.featuredDescription } id={ styles.toolkitDescription }>The Fabric design toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences. <a className={ styles.homePageLink } href='#/resources'>Learn more</a></span>
         </div>
       </div>
     );
diff --git a/apps/fabric-website/src/pages/Interstitials/AngularJSPage.tsx b/apps/fabric-website/src/pages/Interstitials/AngularJSPage.tsx
index 678f664ca1129..74c4406510489 100644
--- a/apps/fabric-website/src/pages/Interstitials/AngularJSPage.tsx
+++ b/apps/fabric-website/src/pages/Interstitials/AngularJSPage.tsx
@@ -18,7 +18,7 @@ export class AngularJSPage extends React.Component<any, any> {
             <div className='ms-Grid-row'>
               <div className='ms-Grid-col ms-sm12 ms-lg8'>
                 <p className={ styles.overviewText }>Using Angular to build out your experience? The ngOfficeUIFabric project makes it easy to use Fabric in Angular-based apps.</p>
-                <p className={ styles.overviewText }>ngOfficeUIFabric is a community effort to build components for Angular-based apps. Watch the Channel 9 video, <a href='https://channel9.msdn.com/Shows/Office-Dev-Show/Office-Dev-Show-Episode-25-Angular-Directives-for-Office-UI-Fabric'>Angular Directives for Office UI Fabric</a>, to learn more about the project.</p>
+                <p className={ styles.overviewText }>ngOfficeUIFabric is a community effort to build components for Angular-based apps. Watch the Channel 9 video, <a className={ styles.overviewLink } href='https://channel9.msdn.com/Shows/Office-Dev-Show/Office-Dev-Show-Episode-25-Angular-Directives-for-Office-UI-Fabric'>Angular Directives for Office UI Fabric</a>, to learn more about the project.</p>
               </div>
               <div className={ css('ms-Grid-col ms-sm12 ms-lg4', styles.overviewImageWrapper) }>
                 <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/logo-angular-black.svg' } width='200' height='200' />
diff --git a/apps/fabric-website/src/pages/Interstitials/FabricIOSPage.tsx b/apps/fabric-website/src/pages/Interstitials/FabricIOSPage.tsx
index 0d9ee3015c473..191551cf64ac7 100644
--- a/apps/fabric-website/src/pages/Interstitials/FabricIOSPage.tsx
+++ b/apps/fabric-website/src/pages/Interstitials/FabricIOSPage.tsx
@@ -17,7 +17,7 @@ export class FabricIOSPage extends React.Component<any, any> {
             <div className='ms-Grid-row'>
               <div className='ms-Grid-col ms-sm12 ms-lg8'>
                 <p className={ styles.overviewText }>Use Fabric styling and components written in native Swift to integrate your iOS experience with Office.</p>
-                <p className={ styles.overviewText }>Fabric iOS includes core design elements along with components that are used in iOS Office products like the <a href='https://itunes.apple.com/us/app/microsoft-sharepoint/id1091505266'>SharePoint iOS app</a>.</p>
+                <p className={ styles.overviewText }>Fabric iOS includes core design elements along with components that are used in iOS Office products like the <a className={ styles.overviewLink } href='https://itunes.apple.com/us/app/microsoft-sharepoint/id1091505266'>SharePoint iOS app</a>.</p>
               </div>
             </div>
           </div>
diff --git a/apps/fabric-website/src/pages/Interstitials/Interstitials.module.scss b/apps/fabric-website/src/pages/Interstitials/Interstitials.module.scss
index 8d2a3d93f4640..59f7e566f8caa 100644
--- a/apps/fabric-website/src/pages/Interstitials/Interstitials.module.scss
+++ b/apps/fabric-website/src/pages/Interstitials/Interstitials.module.scss
@@ -24,13 +24,13 @@
     line-height: 1.25;
     max-width: 500px;
   }
-}
 
-.button {
-  @include ghostButton($color-home-lighter, $color-home-dark);
-  font-size: $ms-font-size-l;
-  margin-top: 32px;
-  display: inline-block;
+  .button {
+    @include ghostButton($color-home-lighter, $color-home-dark);
+    font-size: $ms-font-size-l;
+    margin-top: 32px;
+    display: inline-block;
+  }
 }
 
 .overview {
@@ -40,6 +40,10 @@
     color: $ms-color-neutralPrimary;
     font-size: $ms-font-size-xl;
   }
+
+  .overviewLink {
+    color: $ms-color-themePrimary;
+  }
 }
 
 .overviewImageWrapper {
diff --git a/apps/fabric-website/src/pages/Overviews/ComponentsPage.tsx b/apps/fabric-website/src/pages/Overviews/ComponentsPage.tsx
index e5fc0f4363a99..2ec4f8802be83 100644
--- a/apps/fabric-website/src/pages/Overviews/ComponentsPage.tsx
+++ b/apps/fabric-website/src/pages/Overviews/ComponentsPage.tsx
@@ -26,7 +26,7 @@ export class ComponentsPage extends React.Component<any, any> {
           <p>Fabric comes in many flavors so you can choose the one that works for you. Check out <a href='#/angular-js'>ngOfficeUIFabric</a> and <a href='#/fabric-ios'>Fabric iOS</a> to learn more about each option.</p>
           <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/components-header.svg' } width='284' height='388' alt='Illustrated representation of a DatePicker and Persona list control.' />
           <span className={ styles.title }>Design Toolkit</span>
-          <span className={ styles.descriptionLarge }>The toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences.</span>
+          <span className={ styles.descriptionLarge }>The Fabric design toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences.</span>
           <a href='#/resources'>Learn more</a>
         </div>
       </div>
diff --git a/apps/fabric-website/src/pages/Overviews/StylesPage.tsx b/apps/fabric-website/src/pages/Overviews/StylesPage.tsx
index 38e7d44dbbc92..f908fdc721513 100644
--- a/apps/fabric-website/src/pages/Overviews/StylesPage.tsx
+++ b/apps/fabric-website/src/pages/Overviews/StylesPage.tsx
@@ -25,7 +25,7 @@ export class StylesPage extends React.Component<any, any> {
           <p>Fabric&rsquo;s components use the core styling. To learn more about the fully-styled controls, check out the <a href='#/components'>components</a> page.</p>
           <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/styles-header.svg' } width='225' height='388' alt='Graphic showing elements of color and type' />
           <span className={ styles.title }>Design Toolkit</span>
-          <span className={ styles.descriptionLarge }>The toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences.</span>
+          <span className={ styles.descriptionLarge }>The Fabric design toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences.</span>
           <a href='#/resources'>Learn more</a>
         </div>
       </div>
diff --git a/apps/fabric-website/src/pages/PageStyles.module.scss b/apps/fabric-website/src/pages/PageStyles.module.scss
index 9772f6c943ef0..497dc1de43973 100644
--- a/apps/fabric-website/src/pages/PageStyles.module.scss
+++ b/apps/fabric-website/src/pages/PageStyles.module.scss
@@ -1,3 +1,23 @@
+@import '../styles/variables';
+
+.basePage {
+  h2 {
+    margin: $uhf-h2-margin;
+  }
+
+  h3 {
+    margin: $uhf-h3-margin;
+  }
+
+  h4 {
+    margin: $uhf-h4-margin;
+  }
+
+  p {
+    margin-bottom: $uhf-p-margin-bottom;
+  }
+}
+
 :global {
   .u_maxTextWidth {
     max-width: 50em;
diff --git a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss
index d389e9291355a..56ac6358f6101 100644
--- a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss
+++ b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss
@@ -57,7 +57,8 @@
 }
 
 .reachOut {
-  a, a:visited {
+  a, a:visited,
+  .reachOutLink {
     color: $color-resources-darker;
   }
 
@@ -90,6 +91,10 @@
       position: absolute;
       width: 95%;
     }
+
+    .relatedLink {
+      color: $ms-color-themePrimary;
+    }
   }
 
   p,
diff --git a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
index e8d5b28003449..5c32ab80778f2 100644
--- a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
+++ b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
@@ -3,11 +3,12 @@ import { css } from 'office-ui-fabric-react/lib/Utilities';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 import * as stylesImport from './ResourcesPage.module.scss';
 const styles: any = stylesImport;
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class ResourcesPage extends React.Component<any, any> {
   public render() {
     return (
-      <div>
+      <div className={ pageStyles.basePage }>
         <PageHeader
           pageTitle='Resources'
           links={
@@ -41,16 +42,16 @@ export class ResourcesPage extends React.Component<any, any> {
                 <p>To ensure a consistent look and feel for your project, here's where you can leverage essential elements. This section covers design and UI-related downloads for apps designed and built with Fabric.</p>
 
                 <h3>Design Toolkit</h3>
-                <p>The toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences.</p>
+                <p>The Fabric design toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences.</p>
                 <ul>
-                  <li><a href='https://static2.sharepointonline.com/files/fabric/fabric-website/files/officeuifabric.xd'>Adobe XD Toolkit</a></li>
-                  <li><a href='https://microsoft.sharepoint.com/teams/OfficeUIFabric97'>Adobe XD Toolkit (Microsoft employees)</a></li>
+                  <li><a className={ styles.relatedLink } href='https://static2.sharepointonline.com/files/fabric/fabric-website/files/officeuifabric.xd'>Adobe XD Toolkit</a></li>
+                  <li><a className={ styles.relatedLink } href='https://microsoft.sharepoint.com/teams/OfficeUIFabric97'>Adobe XD Toolkit (Microsoft employees)</a></li>
                 </ul>
 
                 <h3>Fonts</h3>
                 <ul>
-                  <li><a href='https://static2.sharepointonline.com/files/fabric/fabric-website/files/segoeui_fabricmdl2_icon_fonts.zip'>Segoe UI and Fabric MDL2 icon font</a></li>
-                  <li><a href='https://microsoft.sharepoint.com/teams/OfficeUIFabric97/SitePages/Fabric%20MDL2%20Icons.aspx'>Segoe UI and Fabric MDL2 icon font (Microsoft employees)</a></li>
+                  <li><a className={ styles.relatedLink } href='https://static2.sharepointonline.com/files/fabric/fabric-website/files/segoeui_fabricmdl2_icon_fonts.zip'>Segoe UI and Fabric MDL2 icon font</a></li>
+                  <li><a className={ styles.relatedLink } href='https://microsoft.sharepoint.com/teams/OfficeUIFabric97/SitePages/Fabric%20MDL2%20Icons.aspx'>Segoe UI and Fabric MDL2 icon font (Microsoft employees)</a></li>
                 </ul>
               </div>
             </div>
@@ -67,22 +68,22 @@ export class ResourcesPage extends React.Component<any, any> {
                 <p>Use the tutorials and additional resources on this page to learn how to get Fabric running in your projects.</p>
 
                 <h3>Tutorials</h3>
-                <p>Check out <a href='https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/README.md'>Fabric&rsquo;s ToDo tutorial</a> to learn how to make a simple React app using Fabric components.</p>
+                <p>Check out <a className={ styles.relatedLink } href='https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/README.md'>Fabric&rsquo;s ToDo tutorial</a> to learn how to make a simple React app using Fabric components.</p>
 
                 <h3>Add-ins</h3>
                 <p>Fabric is the official UI toolkit for building a coherent user experience in your Office Add-ins. Check out some of these resources to learn more about how to use Fabric in your next Add-in.</p>
                 <ul>
-                  <li><a href='http://dev.office.com/docs/add-ins/overview/office-add-ins'>Add-ins overview</a></li>
-                  <li><a href='http://dev.office.com/docs/add-ins/design/add-in-design'>Using Fabric in your Add-in</a></li>
-                  <li><a href='http://dev.office.com/docs/add-ins/design/ux-design-patterns'>UX design pattern templates for Office Add-ins</a></li>
+                  <li><a className={ styles.relatedLink } href='http://dev.office.com/docs/add-ins/overview/office-add-ins'>Add-ins overview</a></li>
+                  <li><a className={ styles.relatedLink } href='http://dev.office.com/docs/add-ins/design/add-in-design'>Using Fabric in your Add-in</a></li>
+                  <li><a className={ styles.relatedLink } href='http://dev.office.com/docs/add-ins/design/ux-design-patterns'>UX design pattern templates for Office Add-ins</a></li>
                 </ul>
 
                 <h3>SharePoint</h3>
                 <p>SharePoint uses Fabric, so if you&rsquo;re building on top of or within a SharePoint experience, you can be sure that your UI will blend in. Check out these resources to learn more.</p>
                 <ul>
-                  <li><a href='http://dev.office.com/sharepoint/docs/spfx/sharepoint-framework-overview'>SharePoint Framework overview</a></li>
-                  <li><a href='https://github.com/SharePoint/sp-dev-docs/wiki/Design-Great-Webparts'>Design guidance for web parts</a></li>                 <li><a href='http://dev.office.com/sharepoint/docs/spfx/web-parts/get-started/use-fabric-react-components'>How to use Fabric React in a web part</a></li>
-                  <li><a href='https://github.com/SharePoint/sp-dev-docs/wiki'>Get started with the SharePoint Framework and build a HelloWorld web part</a></li>
+                  <li><a className={ styles.relatedLink } href='http://dev.office.com/sharepoint/docs/spfx/sharepoint-framework-overview'>SharePoint Framework overview</a></li>
+                  <li><a className={ styles.relatedLink } href='https://github.com/SharePoint/sp-dev-docs/wiki/Design-Great-Webparts'>Design guidance for web parts</a></li>                 <li><a className={ styles.relatedLink } href='http://dev.office.com/sharepoint/docs/spfx/web-parts/get-started/use-fabric-react-components'>How to use Fabric React in a web part</a></li>
+                  <li><a className={ styles.relatedLink } href='https://github.com/SharePoint/sp-dev-docs/wiki'>Get started with the SharePoint Framework and build a HelloWorld web part</a></li>
                 </ul>
               </div>
             </div>
@@ -103,7 +104,7 @@ export class ResourcesPage extends React.Component<any, any> {
                 </div>
                 <span className={ styles.title }>GitHub</span>
                 <span className={ styles.description }>We&rsquo;re on GitHub, so you can file issues and contribute to the projects.</span>
-                <a href='https://github.com/OfficeDev?query=office-ui-fabric'>See projects</a>
+                <a className={ styles.reachOutLink } href='https://github.com/OfficeDev?query=office-ui-fabric'>See projects</a>
               </div>
               <div className={ css('ms-Grid-col ms-sm-12 ms-lg6', styles.channel) }>
                 <div className={ styles.imageWrapper }>
@@ -111,7 +112,7 @@ export class ResourcesPage extends React.Component<any, any> {
                 </div>
                 <span className={ styles.title }>Twitter</span>
                 <span className={ styles.description }>Follow us for the latest news, and tweet us with your questions and suggestions.</span>
-                <a href='https://twitter.com/officeuifabric'>Join the conversation</a>
+                <a className={ styles.reachOutLink } href='https://twitter.com/officeuifabric'>Join the conversation</a>
               </div>
             </div>
           </div>
@@ -121,4 +122,4 @@ export class ResourcesPage extends React.Component<any, any> {
     );
   }
 
-}
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.tsx b/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.tsx
index 90ef871c5f8ff..e6d5bd33c7076 100644
--- a/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/AnimationsPage/AnimationsPage.tsx
@@ -9,7 +9,7 @@ const animationsData = require('../../../data/animations.json');
 export class AnimationsPage extends React.Component<any, any> {
   public render() {
     return (
-      <div>
+      <div className={ pageStyles.basePage }>
         <PageHeader
           pageTitle='Animations'
           links={
diff --git a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
index 6289b325ba68f..612638ff35294 100644
--- a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
@@ -19,7 +19,7 @@ export class BrandIconsPage extends React.Component<any, any> {
     let documentIcons = documentIconsData;
 
     return (
-      <div>
+      <div className={ pageStyles.basePage }>
         <PageHeader
           pageTitle='Office brand icons'
           links={
diff --git a/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx b/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
index ed12bc44c0d7f..515e02a4e29c9 100644
--- a/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
@@ -14,7 +14,7 @@ const themeColorsData = require('../../../data/colors-theme.json');
 export class ColorsPage extends React.Component<any, any> {
   public render() {
     return (
-      <div>
+      <div className={ pageStyles.basePage }>
         <PageHeader
           pageTitle='Colors'
           links={
diff --git a/apps/fabric-website/src/pages/Styles/IconsPage/IconsPage.tsx b/apps/fabric-website/src/pages/Styles/IconsPage/IconsPage.tsx
index db381f5941a54..7728732259c80 100644
--- a/apps/fabric-website/src/pages/Styles/IconsPage/IconsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/IconsPage/IconsPage.tsx
@@ -9,7 +9,7 @@ const iconData = require('../../../../node_modules/office-ui-fabric-core/src/dat
 export class IconsPage extends React.Component<any, any> {
   public render() {
     return (
-      <div>
+      <div className={ pageStyles.basePage }>
         <PageHeader
           pageTitle='Icons'
           links={
diff --git a/apps/fabric-website/src/pages/Styles/LayoutPage/LayoutPage.tsx b/apps/fabric-website/src/pages/Styles/LayoutPage/LayoutPage.tsx
index 6dc98538bec6c..f4b291598e0aa 100644
--- a/apps/fabric-website/src/pages/Styles/LayoutPage/LayoutPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/LayoutPage/LayoutPage.tsx
@@ -12,7 +12,7 @@ const breakpointsData = require('../../../data/responsive-breakpoints.json');
 export class LayoutPage extends React.Component<any, any> {
   public render() {
     return (
-      <div>
+      <div className={ pageStyles.basePage }>
         <PageHeader
           pageTitle='Responsive Layout'
           links={
diff --git a/apps/fabric-website/src/pages/Styles/LocalizationPage/LocalizationPage.tsx b/apps/fabric-website/src/pages/Styles/LocalizationPage/LocalizationPage.tsx
index bbf164f810592..7530fc307fb06 100644
--- a/apps/fabric-website/src/pages/Styles/LocalizationPage/LocalizationPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/LocalizationPage/LocalizationPage.tsx
@@ -12,7 +12,7 @@ const localizedFontsData = require('../../../data/localized-fonts.json');
 export class LocalizationPage extends React.Component<any, any> {
   public render() {
     return (
-      <div>
+      <div className={ pageStyles.basePage }>
         <PageHeader
           pageTitle='Localization'
           links={
diff --git a/apps/fabric-website/src/pages/Styles/TypographyPage/TypographyPage.tsx b/apps/fabric-website/src/pages/Styles/TypographyPage/TypographyPage.tsx
index 940cf899637be..f92ff1cba16cd 100644
--- a/apps/fabric-website/src/pages/Styles/TypographyPage/TypographyPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/TypographyPage/TypographyPage.tsx
@@ -10,7 +10,7 @@ const typeWeightData = require('../../../data/type-weights.json');
 export class TypographyPage extends React.Component<any, any> {
   public render() {
     return (
-      <div>
+      <div className={ pageStyles.basePage }>
         <PageHeader
           pageTitle='Typography'
           links={
diff --git a/apps/fabric-website/src/pages/Styles/UtilitiesPage/UtilitiesPage.tsx b/apps/fabric-website/src/pages/Styles/UtilitiesPage/UtilitiesPage.tsx
index 4965ec904c25f..8f92a49d61ab0 100644
--- a/apps/fabric-website/src/pages/Styles/UtilitiesPage/UtilitiesPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/UtilitiesPage/UtilitiesPage.tsx
@@ -8,7 +8,7 @@ const utilitiesData = require('../../../data/utilities.json');
 export class UtilitiesPage extends React.Component<any, any> {
   public render() {
     return (
-      <div>
+      <div className={ pageStyles.basePage }>
         <PageHeader pageTitle='Utilities' backgroundColor='#006f94' />
         <div className={ pageStyles.u_maxTextWidth }>
           <h2>Helper utilities</h2>
diff --git a/apps/fabric-website/src/styles/_typography.scss b/apps/fabric-website/src/styles/_typography.scss
index 654014d617070..0ba35a36ec796 100644
--- a/apps/fabric-website/src/styles/_typography.scss
+++ b/apps/fabric-website/src/styles/_typography.scss
@@ -31,14 +31,14 @@
     color: $ms-color-neutralDark;
     font-size: $ms-font-size-m;
     font-weight: $ms-font-weight-semibold;
-    margin: 8px 0;
+    margin: $uhf-h4-margin;
   }
 
   // Paragraphs and lists
   p, ul, ol {
     font-size: $ms-font-size-m;
     font-weight: $ms-font-weight-regular;
-    margin-bottom: 12px;
+    margin-bottom: $uhf-p-margin-bottom;
   }
 
   ol {
diff --git a/apps/fabric-website/src/styles/_variables.scss b/apps/fabric-website/src/styles/_variables.scss
index a9c2f85687d15..6b468b077240b 100644
--- a/apps/fabric-website/src/styles/_variables.scss
+++ b/apps/fabric-website/src/styles/_variables.scss
@@ -99,5 +99,7 @@ $uhf-screen-max-lg: 1083px;
 // These variables assist with overriding UHF styles
 $uhf-h3-margin: 40px 0 8px 0;
 $uhf-h2-margin: 48px 0 4px 0;
+$uhf-h4-margin: 8px 0;
+$uhf-p-margin-bottom: 12px;
 
 $baseURL: ' https://static2.sharepointonline.com/files/fabric/';
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/uhf-bugs-v3_2017-09-21-17-55.json b/common/changes/@uifabric/fabric-website/uhf-bugs-v3_2017-09-21-17-55.json
new file mode 100644
index 0000000000000..30d33467461f4
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/uhf-bugs-v3_2017-09-21-17-55.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Reinforced header tag styles across website pages to manage UHF counter-styles.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/common/_exampleStyles.scss b/packages/office-ui-fabric-react/src/common/_exampleStyles.scss
index 87d3d4dd23ed5..3ac72bf86455d 100644
--- a/packages/office-ui-fabric-react/src/common/_exampleStyles.scss
+++ b/packages/office-ui-fabric-react/src/common/_exampleStyles.scss
@@ -1,11 +1,9 @@
 @import './variables';
 
-:global {
-  .exampleCheckbox {
-    margin: $exampleCheckbox-margin;
-  }
+.exampleCheckbox {
+  margin: $exampleCheckbox-margin;
+}
 
-  .exampleLabel {
-    margin: $exampleLabel-margin;
-  }
+.exampleLabel {
+  margin: $exampleLabel-margin;
 }
\ No newline at end of file

From 78b9c5e3836b49abecf5fad31884c6118ba4f3c7 Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Thu, 21 Sep 2017 20:48:31 -0700
Subject: [PATCH 0693/1641] ActivityItem: Changing interface to use ReactNodes
 instead of IRenderFunctions (#2452)

* Replacing all IRenderFunctions with ReactNodes in the activityItem iterface

* rush change

* Adding activity node examples and documentation.

* Fixing build tests

* Adding original props back in.

* updating rush change file to no longer be a major change

* Adding string type back into timeStamp prop.
---
 ...tivityitem-reactnode_2017-08-09-23-56.json |  11 ++
 .../ActivityItem/ActivityItem.Props.ts        |  27 +++-
 .../ActivityItem/ActivityItem.styles.ts       |   4 +-
 .../components/ActivityItem/ActivityItem.tsx  |  24 ++--
 .../ActivityItem/ActivityItemPage.tsx         |  73 +++++++++++
 .../examples/ActivityItem.Basic.Example.tsx   |  64 ++++++++++
 .../examples/ActivityItem.Compact.Example.tsx |  80 ++++++++++++
 .../examples/ActivityItem.Example.scss        |   9 ++
 .../examples/ActivityItem.Persona.Example.tsx | 117 ++++++++++++++++++
 .../src/demo/AppDefinition.tsx                |   6 +
 10 files changed, 399 insertions(+), 16 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-activityitem-reactnode_2017-08-09-23-56.json
 create mode 100644 packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItemPage.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Basic.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Compact.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Example.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Persona.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/v-krbrow-activityitem-reactnode_2017-08-09-23-56.json b/common/changes/office-ui-fabric-react/v-krbrow-activityitem-reactnode_2017-08-09-23-56.json
new file mode 100644
index 0000000000000..8d1c78ed8a77e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-activityitem-reactnode_2017-08-09-23-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ActivityItem: Adding ReactNodes in the interface in addition to the IRenderFunction props.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.Props.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.Props.ts
index c8fe8346b93d7..d8d714d69de10 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.Props.ts
@@ -6,17 +6,34 @@ import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
 // Please keep alphabetized
 export interface IActivityItemProps extends React.AllHTMLAttributes<HTMLElement> {
   /**
-   * Text describing the activity that occurred and naming the people involved in it.
+   * An element describing the activity that took place. If no activityDescription, activityDescriptionText, or onRenderActivityDescription are included, no description of the activity is shown.
+   */
+  activityDescription?: React.ReactNode[] | React.ReactNode;
+
+  /**
+   * Text describing the activity that occurred and naming the people involved in it. Deprecated, use activityDescription instead.
+   * @deprecated
    */
   activityDescriptionText?: string;
 
   /**
-   * If onRenderIcon is not, then the persona props in this array will be used as the icon for the this activity item.
+   * An element containing an icon shown next to the activity item.
+   */
+  activityIcon?: React.ReactNode;
+
+  /**
+   * If activityIcon is not set, then the persona props in this array will be used as the icon for the this activity item.
    */
   activityPersonas?: Array<IPersonaProps>;
 
   /**
-   * Text of comments or @mention messages.
+   * An element containing the text of comments or @mention messages. If no comments, commentText, or onRenderComments are included, no comments are shown.
+   */
+  comments?: React.ReactNode[] | React.ReactNode;
+
+  /**
+   * Text of comments or @mention messages. Deprecated, use comments instead.
+   * @deprecated
    */
   commentText?: string;
 
@@ -56,9 +73,9 @@ export interface IActivityItemProps extends React.AllHTMLAttributes<HTMLElement>
   styles?: IActivityItemStyles;
 
   /**
-   * Text shown as a timestamp on this activity. If not included, no timestamp is shown.
+   * Element shown as a timestamp on this activity. If not included, no timestamp is shown.
    */
-  timeStamp?: string;
+  timeStamp?: string | React.ReactNode[] | React.ReactNode;
 }
 
 export interface IActivityItemStyles {
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
index 06c3332831cf4..ded6fee6be5a7 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
@@ -57,13 +57,15 @@ export const getStyles = memoizeFunction((
       height: DEFAULT_PERSONA_SIZE,
       fontSize: DEFAULT_ICON_SIZE,
       lineHeight: DEFAULT_ICON_SIZE,
+      marginTop: '3px'
     },
 
     isCompactIcon: {
       height: COMPACT_PERSONA_SIZE,
       fontSize: COMPACT_ICON_SIZE,
       lineHeight: COMPACT_ICON_SIZE,
-      color: theme.palette.themePrimary
+      color: theme.palette.themePrimary,
+      marginTop: '1px'
     },
 
     activityPersona: {
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
index 214b7ec0dffae..841735570d23d 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
@@ -35,7 +35,7 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
       onRenderActivityDescription = this._onRenderActivityDescription,
       onRenderComments = this._onRenderComments,
       onRenderTimeStamp = this._onRenderTimeStamp,
-      styles: customStyles,
+      styles: customStyles
     } = this.props;
 
     this._styles = getStyles(undefined, customStyles);
@@ -49,9 +49,9 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
     return (
       <div className={ this._classNames.root } style={ this.props.style } >
 
-        { (this.props.onRenderIcon || this.props.activityPersonas) &&
+        { (this.props.activityPersonas || this.props.activityIcon || this.props.onRenderIcon) &&
           <div className={ this._classNames.activityTypeIcon }>
-            { onRenderIcon(this.props, this._onRenderIcon) }
+            { onRenderIcon(this.props) }
           </div>
         }
 
@@ -66,18 +66,20 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
   }
 
   @autobind
-  private _onRenderIcon(props: IActivityItemProps): JSX.Element | null {
+  private _onRenderIcon(props: IActivityItemProps): JSX.Element | React.ReactNode | null {
     if (props.activityPersonas) {
       return this._onRenderPersonaArray(props);
+    } else {
+      return this.props.activityIcon;
     }
-
-    return null;
   }
 
   @autobind
   private _onRenderActivityDescription(props: IActivityItemProps): JSX.Element | null {
-    if (props.activityDescriptionText) {
-      return (<span className={ this._classNames.activityText }>{ props.activityDescriptionText }</span>);
+    const activityDescription = props.activityDescription || props.activityDescriptionText;
+
+    if (activityDescription) {
+      return (<span className={ this._classNames.activityText }>{ activityDescription }</span>);
     }
 
     return null;
@@ -85,8 +87,10 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
 
   @autobind
   private _onRenderComments(props: IActivityItemProps): JSX.Element | null {
-    if (!props.isCompact && props.commentText) {
-      return (<div className={ this._classNames.commentText }>{ props.commentText }</div>);
+    const comments = props.comments || props.commentText;
+
+    if (!props.isCompact && props.comments) {
+      return (<div className={ this._classNames.commentText }>{ props.comments }</div>);
     }
 
     return null;
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItemPage.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItemPage.tsx
new file mode 100644
index 0000000000000..0005f85889bb8
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItemPage.tsx
@@ -0,0 +1,73 @@
+import * as React from 'react';
+import {
+  ExampleCard,
+  ComponentPage,
+  IComponentDemoPageProps,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+import './examples/ActivityItem.Example.scss';
+import { ActivityItemBasicExample } from './examples/ActivityItem.Basic.Example';
+import { ActivityItemPersonaExample } from './examples/ActivityItem.Persona.Example';
+import { ActivityItemCompactExample } from './examples/ActivityItem.Compact.Example';
+
+const ActivityItemBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Basic.Example.tsx') as string;
+const ActivityItemPersonaExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Persona.Example.tsx') as string;
+const ActivityItemCompactExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Compact.Example.tsx') as string;
+
+export class ActivityItemPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render() {
+    return (
+      <ComponentPage
+        title='ActivityItem'
+        componentName='ActivityItem'
+        exampleCards={
+          <div>
+            <ExampleCard title='Activity Items with Icons' code={ ActivityItemBasicExampleCode }>
+              <ActivityItemBasicExample />
+            </ExampleCard>
+            <ExampleCard title='Activity Items with Personas' code={ ActivityItemPersonaExampleCode }>
+              <ActivityItemPersonaExample />
+            </ExampleCard>
+            <ExampleCard title='Compact Activity Items' code={ ActivityItemCompactExampleCode }>
+              <ActivityItemCompactExample />
+            </ExampleCard>
+          </div>
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/ActivityItem/ActivityItem.Props.ts')
+            ] }
+          />
+        }
+        overview={
+          <div>
+            <p>
+              ActivityItems represent individual units of a user's activity, such as making a comment, mentioning someone with an @mention, editing a document, or moving a file.
+            </p>
+          </div>
+        }
+        bestPractices={
+          <div></div>
+        }
+        dos={
+          <div>
+            <ul>
+              <li>Use a list of multiple ActivityItems to indicate a history of events relating to a single file, folder, user, or other entity. Alternatively, use a single ActivityItem to indicate the most recent event on an entity.</li>
+              <li>Group multiple similar events occuring near the same time into single ActivityItems.</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul>
+              <li>Use ActivityItems to render large amounts of body text, they are meant to be concise descriptions of a specific activity.</li>
+            </ul>
+          </div>
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }>
+      </ComponentPage>
+    );
+  }
+
+}
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Basic.Example.tsx
new file mode 100644
index 0000000000000..d525c7f96163d
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Basic.Example.tsx
@@ -0,0 +1,64 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+import { ActivityItem } from '../ActivityItem';
+import { TestImages } from '../../../common/TestImages';
+import { Icon } from '../../../Icon';
+import { Link } from '../../../Link';
+
+const activityItemExamples = [
+  {
+    key: 1,
+    activityDescription: [
+      <Link key={ 1 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A name was clicked.'); } } >Philippe Lampros</Link>,
+      <span key={ 2 }> commented</span>
+    ],
+    activityIcon: <Icon iconName={ 'Message' } />,
+    comments: [
+      <span key={ 1 }>Hello! I am making a comment and mentioning </span>,
+      <Link key={ 2 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('An @mentioned name was clicked.'); } } >@Anđela Debeljak</Link>,
+      <span key={ 3 }> in the text of the comment.</span>
+    ],
+    timeStamp: 'Just now'
+  },
+  {
+    key: 2,
+    activityDescription: [
+      <Link key={ 1 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A name was clicked.'); } } >Lisha Refai</Link>,
+      <span key={ 2 }> deleted </span>,
+      <span key={ 3 } className={ 'ms-activityItem-nameText' }>DocumentTitle.docx</span>
+    ],
+    activityIcon: <Icon iconName={ 'Trash' } />,
+    timeStamp: '2 hours ago'
+  },
+  {
+    key: 3,
+    activityDescription: [
+      <Link key={ 1 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A name was clicked.'); } } >Julian Arvidsson</Link>,
+      <span key={ 2 }> moved </span>,
+      <Link key={ 3 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A document was clicked.'); } } >PresentationTitle.pptx</Link>,
+      <span key={ 4 }> to </span>,
+      <Link key={ 5 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A folder was clicked.'); } } >Destination Folder</Link>
+    ],
+    activityIcon: <Icon iconName={ 'FabricMovetoFolder' } />,
+    timeStamp: 'Yesterday'
+  }
+];
+
+export class ActivityItemBasicExample extends React.Component<React.Props<ActivityItemBasicExample>, {}> {
+  public render() {
+    let activityExampleList: Array<JSX.Element> = [];
+    activityItemExamples.forEach((item) => {
+      let props = item;
+      activityExampleList.push(
+        <ActivityItem {...props} key={ item.key } className={ 'ms-activityItem-exampleRoot' } />
+      );
+    });
+
+    return (
+      <div>
+        { activityExampleList }
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Compact.Example.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Compact.Example.tsx
new file mode 100644
index 0000000000000..335079872144d
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Compact.Example.tsx
@@ -0,0 +1,80 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+import { ActivityItem } from '../ActivityItem';
+import { TestImages } from '../../../common/TestImages';
+import { Icon } from '../../../Icon';
+
+const activityItemExamples = [
+  {
+    key: 1,
+    activityDescription: [
+      <span key={ 1 } className={ 'ms-activityItem-nameText' }>Tahlia	Whittle</span>,
+      <span key={ 2 }> edited this file</span>
+    ],
+    activityPersonas: [
+      {
+        imageUrl: TestImages.personaFemale
+      }
+    ],
+    isCompact: true
+  },
+  {
+    key: 2,
+    activityDescription: [
+      <span key={ 1 } className={ 'ms-activityItem-nameText' }>Patrick Loton</span>,
+      <span key={ 2 }> and </span>,
+      <span key={ 3 } className={ 'ms-activityItem-nameText' }> 6 others</span>
+    ],
+    activityPersonas: [
+      {
+        imageInitials: 'PT',
+        primaryText: 'Robert Larsson'
+      },
+      {
+        imageUrl: TestImages.personaMale
+      },
+      {
+        imageInitials: 'EC',
+        primaryText: 'Eduarda Costa'
+      }
+    ],
+    isCompact: true
+  },
+  {
+    key: 3,
+    activityDescription: [
+      <span key={ 1 } className={ 'ms-activityItem-nameText' }>Sabrina De Luca</span>,
+      <span key={ 2 }> added this file</span>
+    ],
+    activityIcon: React.createElement(Icon, { iconName: 'Add' }),
+    isCompact: true
+  },
+  {
+    key: 4,
+    activityDescription: [
+      <span key={ 1 } className={ 'ms-activityItem-nameText' }>Chuan Rojumanong</span>,
+      <span key={ 2 }> shared this file</span>
+    ],
+    activityIcon: React.createElement(Icon, { iconName: 'Share' }),
+    isCompact: true
+  }
+];
+
+export class ActivityItemCompactExample extends React.Component<React.Props<ActivityItemCompactExample>, {}> {
+  public render() {
+    let activityExampleList: Array<JSX.Element> = [];
+    activityItemExamples.forEach((item) => {
+      let props = item;
+      activityExampleList.push(
+        <ActivityItem {...props} key={ item.key } className={ 'ms-activityItem-exampleRoot' } />
+      );
+    });
+
+    return (
+      <div>
+        { activityExampleList }
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Example.scss b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Example.scss
new file mode 100644
index 0000000000000..fd944b732c7d8
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Example.scss
@@ -0,0 +1,9 @@
+:global {
+  .ms-activityItem-exampleRoot {
+    margin-top: 20px;
+  }
+
+  .ms-activityItem-nameText {
+    font-weight: bold;
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Persona.Example.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Persona.Example.tsx
new file mode 100644
index 0000000000000..2d9bd6518f578
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Persona.Example.tsx
@@ -0,0 +1,117 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+import { ActivityItem } from '../ActivityItem';
+import { TestImages } from '../../../common/TestImages';
+import { Icon } from '../../../Icon';
+import { Link } from '../../../Link';
+
+const activityItemExamples = [
+  {
+    key: 1,
+    activityDescription: [
+      <Link key={ 1 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A name was clicked.'); } } >Jack Howden</Link>,
+      <span key={ 2 }> renamed </span>,
+      <span key={ 3 } className={ 'ms-activityItem-nameText' }>DocumentTitle.docx</span>
+    ],
+    activityPersonas: [
+      {
+        imageUrl: TestImages.personaMale
+      }
+    ],
+    comments: 'Hello, this is the text of my basic comment!',
+    timeStamp: '23m ago'
+  },
+  {
+    key: 2,
+    activityDescription: [
+      <Link key={ 1 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A name was clicked.'); } } >Javiera Márquez</Link>,
+      <span key={ 2 }> and </span>,
+      <Link key={ 3 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A name was clicked.'); } } >Amelia Povalіy</Link>,
+      <span key={ 4 }> edited </span>,
+      <Link key={ 5 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A document was clicked.'); } } >SpreadsheetTitle.xlsx</Link>
+    ],
+    activityPersonas: [
+      {
+        imageInitials: 'JM',
+        primaryText: 'Javiera Márquez'
+      },
+      {
+        imageUrl: TestImages.personaFemale
+      }
+    ],
+    timeStamp: '9:27 am'
+  },
+  {
+    key: 3,
+    activityDescription: [
+      <Link key={ 1 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A name was clicked.'); } } >Robert Larsson</Link>,
+      <span key={ 2 }> and </span>,
+      <Link key={ 3 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A name was clicked.'); } } >2 others</Link>,
+      <span key={ 4 }> commented </span>
+    ],
+    activityPersonas: [
+      {
+        imageInitials: 'RL',
+        primaryText: 'Robert Larsson'
+      },
+      {
+        imageUrl: TestImages.personaMale
+      },
+      {
+        imageUrl: TestImages.personaFemale
+      }
+    ],
+    timeStamp: '3 days ago'
+  },
+  {
+    key: 4,
+    activityDescription: [
+      <Link key={ 1 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A name was clicked.'); } } >Jin Cheng</Link>,
+      <span key={ 2 }> and </span>,
+      <Link key={ 3 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A name was clicked.'); } } >5 others</Link>,
+      <span key={ 4 }> edited this file</span>
+    ],
+    activityPersonas: [
+      {
+        imageInitials: 'JC',
+        primaryText: 'Jin Cheng'
+      },
+      {
+        imageUrl: TestImages.personaMale
+      },
+      {
+        imageInitials: 'AL',
+        primaryText: 'Annie Lindqvist'
+      },
+      {
+        imageUrl: TestImages.personaFemale
+      },
+      {
+        imageUrl: TestImages.personaMale
+      },
+      {
+        imageUrl: TestImages.personaMale
+      }
+    ],
+    timeStamp: 'August 3, 2017'
+  }
+];
+
+export class ActivityItemPersonaExample extends React.Component<React.Props<ActivityItemPersonaExample>, {}> {
+  public render() {
+    let activityExampleList: Array<JSX.Element> = [];
+    activityItemExamples.forEach((item) => {
+      let props = item;
+      activityExampleList.push(
+        <ActivityItem {...props} key={ item.key } className={ 'ms-activityItem-exampleRoot' } />
+      );
+    });
+
+    return (
+      <div>
+        { activityExampleList }
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
index 169924b84986a..5958b458dcf75 100644
--- a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
+++ b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
@@ -16,6 +16,12 @@ export const AppDefinition: IAppDefinition = {
   examplePages: [
     {
       links: [
+        {
+          component: require<any>('../components/ActivityItem/ActivityItemPage').ActivityItemPage,
+          key: 'ActivityItem',
+          name: 'ActivityItem',
+          url: '#/examples/activityitem'
+        },
         {
           component: require<any>('../components/Breadcrumb/BreadcrumbPage').BreadcrumbPage,
           key: 'Breadcrumb',

From dece4a9a3f1272697a9529ce7285d16764264776 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Thu, 21 Sep 2017 21:09:50 -0700
Subject: [PATCH 0694/1641] First pass removing lambda in jsx in Fabric pkg
 (#2814)

* First pass removing lambda in jsx in oufr

* Fixed indent

* Added null return back
---
 .../src/components/Breadcrumb/Breadcrumb.tsx  |  3 +-
 .../examples/Breadcrumb.Static.Example.tsx    |  6 +++-
 .../src/components/Calendar/Calendar.test.tsx |  8 ++++-
 .../src/components/Calendar/CalendarDay.tsx   | 11 +++++--
 .../src/components/ComboBox/ComboBox.tsx      | 14 ++++----
 .../src/components/CommandBar/CommandBar.tsx  | 32 ++++++++++---------
 .../components/DetailsList/DetailsList.tsx    | 10 +++++-
 .../src/components/Dropdown/Dropdown.tsx      | 26 +++++++--------
 .../src/components/Facepile/Facepile.tsx      | 31 +++++++++++-------
 .../components/GroupedList/GroupedList.tsx    |  6 +++-
 .../GroupedList/GroupedListSection.tsx        | 15 +++++++--
 .../src/components/SpinButton/SpinButton.tsx  |  4 +--
 .../src/components/Toggle/Toggle.tsx          |  6 +++-
 .../PeoplePickerItems/SelectedItemDefault.tsx |  9 +++++-
 .../pickers/Suggestions/Suggestions.tsx       | 25 +++++++++++----
 15 files changed, 141 insertions(+), 65 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
index a3d55ff3fdf73..bcbf8ca42faa4 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
@@ -24,6 +24,7 @@ export interface IBreadCrumbData {
 }
 
 const OVERFLOW_KEY = 'overflow';
+const nullFunction = (): null => null;
 
 export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
   public static defaultProps: IBreadcrumbProps = {
@@ -95,7 +96,7 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
                   iconProps={ { iconName: 'More' } }
                   role='button'
                   aria-haspopup='true'
-                  onRenderMenuIcon={ () => null }
+                  onRenderMenuIcon={ nullFunction }
                   menuProps={ {
                     items: contextualItems,
                     directionalHint: DirectionalHint.bottomLeftEdge
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx
index dd90dc35fc37a..3a7078a23b1ad 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx
@@ -27,7 +27,7 @@ export class BreadcrumbStaticExample extends React.Component<any, any> {
             { text: 'This is folder 5', 'key': 'f5', onClick: this._onBreadcrumbItemClicked, isCurrentItem: true },
           ] }
           // Returning undefined to OnReduceData tells the breadcrumb not to shrink
-          onReduceData={ (data) => undefined }
+          onReduceData={ this._returnUndefined }
           maxDisplayedItems={ 3 }
           ariaLabel={ 'Website breadcrumb' }
         />
@@ -40,4 +40,8 @@ export class BreadcrumbStaticExample extends React.Component<any, any> {
     console.log(`Breadcrumb item with key "${item.key}" has been clicked.`);
   }
 
+  private _returnUndefined(): undefined {
+    return undefined;
+  }
+
 }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
index c74c111d5e81d..b7971ee2dbffd 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
@@ -147,6 +147,12 @@ describe('Calendar', () => {
 
     before(() => {
       defaultDate = new Date(2017, 2, 16);
+      let onSelectDate = (): (date: Date, dateRangeArray: Date[]) => void => {
+        return (date: Date, dateRangeArray: Date[]): void => {
+          lastSelectedDateRange = dateRangeArray;
+        };
+      };
+
       renderedComponent = ReactTestUtils.renderIntoDocument(
         <Calendar
           strings={ dayPickerStrings }
@@ -155,7 +161,7 @@ describe('Calendar', () => {
           firstDayOfWeek={ DayOfWeek.Tuesday }
           dateRangeType={ DateRangeType.Week }
           autoNavigateOnSelection={ true }
-          onSelectDate={ (date: Date, dateRangeArray: Date[]) => lastSelectedDateRange = dateRangeArray }
+          onSelectDate={ onSelectDate() }
         />) as Calendar;
     });
 
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index 24ed8605a3d98..10d75e0cd2241 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -235,8 +235,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
                           }) }
                         role='gridcell'
                         onClick={ day.onSelected }
-                        onKeyDown={ (ev: React.KeyboardEvent<HTMLElement>) =>
-                          this._navigateMonthEdge(ev, day.originalDate, weekIndex, dayIndex) }
+                        onKeyDown={ this._onDayKeyDown(day.originalDate, weekIndex, dayIndex) }
                         aria-label={ dateTimeFormatter.formatMonthDayYear(day.originalDate, strings) }
                         id={ compareDates(navigatedDate, day.originalDate) ? activeDescendantId : undefined }
                         aria-selected={ day.isSelected }
@@ -381,6 +380,14 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
     }
   }
 
+  @autobind
+  private _onDayKeyDown(originalDate: Date, weekIndex: number, dayIndex: number)
+    : (ev: React.KeyboardEvent<HTMLElement>) => void {
+    return (ev: React.KeyboardEvent<HTMLElement>): void => {
+      this._navigateMonthEdge(ev, originalDate, weekIndex, dayIndex);
+    };
+  }
+
   @autobind
   private _onSelectDate(selectedDate: Date) {
     let { onSelectDate, dateRangeType, firstDayOfWeek, navigatedDate, autoNavigateOnSelection } = this.props;
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 4016d264d879f..a84a777920be3 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -850,7 +850,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         className={ 'ms-ComboBox-option' }
         styles={ this._getCurrentOptionStyles(item) }
         checked={ isSelected }
-        onClick={ () => this._onItemClick(item.index) }
+        onClick={ this._onItemClick(item.index) }
         role='option'
         aria-selected={ isSelected ? 'true' : 'false' }
         ariaLabel={ item.text }
@@ -908,11 +908,13 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * to select the item and also close the menu
    * @param index - the index of the item that was clicked
    */
-  private _onItemClick(index: number | undefined) {
-    this._setSelectedIndex(index as number);
-    this.setState({
-      isOpen: false
-    });
+  private _onItemClick(index: number | undefined): () => void {
+    return (): void => {
+      this._setSelectedIndex(index as number);
+      this.setState({
+        isOpen: false
+      });
+    };
   }
 
   /**
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 7e62707cc629f..5d1c7a53acce0 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -189,7 +189,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
               { ...getNativeProps(item, buttonProperties) }
               id={ this._id + item.key }
               className={ className }
-              onClick={ (ev) => this._onItemClick(ev, item) }
+              onClick={ this._onItemClick(item) }
               data-command-key={ itemKey }
               aria-haspopup={ hasSubmenuItems(item) }
               aria-expanded={ hasSubmenuItems(item) ? expandedMenuItemKey === item.key : undefined }
@@ -351,20 +351,22 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
     });
   }
 
-  private _onItemClick(ev: React.MouseEvent<HTMLButtonElement>, item: IContextualMenuItem) {
-    if (item.key === this.state.expandedMenuItemKey || !hasSubmenuItems(item)) {
-      this._onContextMenuDismiss();
-    } else {
-      this.setState({
-        expandedMenuId: ev.currentTarget.id,
-        expandedMenuItemKey: item.key,
-        contextualMenuProps: this._getContextualMenuPropsFromItem(item),
-        contextualMenuTarget: ev.currentTarget
-      });
-    }
-    if (item.onClick) {
-      item.onClick(ev, item);
-    }
+  private _onItemClick(item: IContextualMenuItem): (ev: React.MouseEvent<HTMLButtonElement>) => void {
+    return (ev: React.MouseEvent<HTMLButtonElement>): void => {
+      if (item.key === this.state.expandedMenuItemKey || !hasSubmenuItems(item)) {
+        this._onContextMenuDismiss();
+      } else {
+        this.setState({
+          expandedMenuId: ev.currentTarget.id,
+          expandedMenuItemKey: item.key,
+          contextualMenuProps: this._getContextualMenuPropsFromItem(item),
+          contextualMenuTarget: ev.currentTarget
+        });
+      }
+      if (item.onClick) {
+        item.onClick(ev, item);
+      }
+    };
   }
 
   @autobind
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index db5eac79cef25..a2b967a09f0e9 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -345,7 +345,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
                       ref={ this._resolveRef('_list') }
                       role='presentation'
                       items={ items }
-                      onRenderCell={ (item, itemIndex) => this._onRenderCell(0, item, itemIndex as number) }
+                      onRenderCell={ this._onRenderListCell(0) }
                       usePageCache={ usePageCache }
                       onShouldVirtualize={ onShouldVirtualize }
                       { ...additionalListProps }
@@ -375,6 +375,14 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     return <DetailsHeader { ...detailsHeaderProps } />;
   }
 
+  @autobind
+  private _onRenderListCell(nestingDepth: number)
+    : (item: any, itemIndex: number) => React.ReactNode {
+    return (item: any, itemIndex: number): React.ReactNode => {
+      return this._onRenderCell(nestingDepth, item, itemIndex as number);
+    };
+  }
+
   private _onRenderCell(nestingDepth: number, item: any, index: number): React.ReactNode {
     let {
       compact,
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index e90f4e26efeb7..5cf2306dde6bc 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -481,7 +481,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
                 ['is-disabled ' + styles.itemIsDisabled]: this.props.disabled === true
               }
             ) }
-            onClick={ () => this._onItemClick(item.index!) }
+            onClick={ this._onItemClick(item.index!) }
             role='option'
             aria-selected={ this.state.selectedIndex === item.index ? 'true' : 'false' }
             ariaLabel={ item.ariaLabel || item.text }
@@ -489,16 +489,14 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
           >
             { onRenderOption(item, this._onRenderOption) }
           </CommandButton>
-        )
-        :
-        (
+        ) : (
           <Checkbox
             id={ id + '-list' + item.index }
             ref={ Dropdown.Option + item.index }
             key={ item.key }
             data-index={ item.index }
             data-is-focusable={ true }
-            onChange={ () => this._onItemClick(item.index!) }
+            onChange={ this._onItemClick(item.index!) }
             label={ item.text }
             className={ css(
               'ms-ColumnManagementPanel-checkbox',
@@ -527,14 +525,16 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     this._focusZone.focus();
   }
 
-  private _onItemClick(index: number) {
-    this.setSelectedIndex(index);
-    if (!this.props.multiSelect) {
-      // only close the callout when it's in single-select mode
-      this.setState({
-        isOpen: false
-      });
-    }
+  private _onItemClick(index: number): () => void {
+    return (): void => {
+      this.setSelectedIndex(index);
+      if (!this.props.multiSelect) {
+        // only close the callout when it's in single-select mode
+        this.setState({
+          isOpen: false
+        });
+      }
+    };
   }
 
   @autobind
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
index b6f1c548bc6b8..73f6de7883bc4 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
@@ -179,11 +179,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
         <PersonaCoin
           title={ personaNames }
           size={ personaSize }
-          onRenderInitials={ () => {
-            return (
-              <span>{ '+' + numPersonasNotPictured }</span>
-            );
-          } }
+          onRenderInitials={ this._renderInitialsNotPictured(numPersonasNotPictured) }
         />
       </BaseButton>
     );
@@ -199,9 +195,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
       >
         <PersonaCoin
           size={ personaSize }
-          onRenderInitials={ () => (
-            <Icon iconName={ icon } />
-          ) }
+          onRenderInitials={ this._renderInitials(icon) }
         />
       </BaseButton>
     );
@@ -209,6 +203,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
 
   private _getAddNewElement(): JSX.Element {
     let { addButtonProps, personaSize } = this.props;
+
     return (
       <BaseButton
         {...addButtonProps}
@@ -216,9 +211,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
       >
         <PersonaCoin
           size={ personaSize }
-          onRenderInitials={ () => (
-            <Icon iconName='AddFriend' />
-          ) }
+          onRenderInitials={ this._renderInitials('AddFriend') }
         />
       </BaseButton>
     );
@@ -241,4 +234,20 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
       persona.onMouseOut(ev, persona);
     }
   }
+
+  private _renderInitials(iconName: string): () => JSX.Element {
+    return (): JSX.Element => {
+      return (
+        <Icon iconName={ iconName } />
+      );
+    };
+  }
+
+  private _renderInitialsNotPictured(numPersonasNotPictured: number): () => JSX.Element {
+    return (): JSX.Element => {
+      return (
+        <span>{ '+' + numPersonasNotPictured }</span>
+      );
+    };
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
index cfffa3600036e..1eab07874e635 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
@@ -103,7 +103,7 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
               ref='list'
               items={ groups }
               onRenderCell={ this._renderGroup }
-              getItemCountForPage={ () => 1 }
+              getItemCountForPage={ this._returnOne }
               usePageCache={ usePageCache }
               onShouldVirtualize={ onShouldVirtualize }
             />
@@ -196,6 +196,10 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
     );
   }
 
+  private _returnOne(): number {
+    return 1;
+  }
+
   private _getGroupKey(group: IGroup, index: number): string {
     return 'group-' + ((group && group.key) ? group.key : String(index));
   }
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
index c7eb4c27b25da..b173968a8698a 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
@@ -219,7 +219,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
                     ref='list'
                     items={ group!.children }
                     onRenderCell={ this._renderSubGroup }
-                    getItemCountForPage={ () => 1 }
+                    getItemCountForPage={ this._returnOne }
                   />
                 ) :
                 this._onRenderGroup(renderCount)
@@ -290,6 +290,13 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
     }
   }
 
+  private _onRenderGroupCell(onRenderCell: any, groupNestingDepth: number | undefined)
+    : (item: any, itemIndex: number | undefined) => React.ReactNode {
+    return (item: any, itemIndex: number | undefined): React.ReactNode => {
+      return onRenderCell(groupNestingDepth, item, itemIndex);
+    };
+  }
+
   private _onRenderGroup(renderCount: number) {
     let {
       group,
@@ -304,7 +311,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
     return (
       <List
         items={ items }
-        onRenderCell={ (item, itemIndex) => onRenderCell(groupNestingDepth, item, itemIndex) }
+        onRenderCell={ this._onRenderGroupCell(onRenderCell, groupNestingDepth) }
         ref={ 'list' }
         renderCount={ Math.min(count, renderCount) }
         startIndex={ startIndex }
@@ -362,6 +369,10 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
     ) : null;
   }
 
+  private _returnOne(): number {
+    return 1;
+  }
+
   private _getGroupKey(group: any, index: number) {
     return 'group-' + ((group && group.key) ? group.key : String(group.level) + String(index));
   }
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index 55859b775aaf2..16af04c74da58 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -198,7 +198,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
               disabled={ disabled }
               iconProps={ incrementButtonIcon }
               aria-hidden='true'
-              onMouseDown={ () => this._onIncrementMouseDown() }
+              onMouseDown={ this._onIncrementMouseDown }
               onMouseLeave={ this._stop }
               onMouseUp={ this._stop }
               tabIndex={ -1 }
@@ -210,7 +210,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
               disabled={ disabled }
               iconProps={ decrementButtonIcon }
               aria-hidden='true'
-              onMouseDown={ () => this._onDecrementMouseDown() }
+              onMouseDown={ this._onDecrementMouseDown }
               onMouseLeave={ this._stop }
               onMouseUp={ this._stop }
               tabIndex={ -1 }
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
index 9c62fb0aa788f..e23e17a449bed 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
@@ -103,7 +103,7 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
             aria-pressed={ isChecked }
             aria-label={ ariaLabel }
             data-is-focusable={ true }
-            onChange={ () => { /* no-op */ } }
+            onChange={ this._noop }
             onClick={ this._onClick }
           >
             <div className={ classNames.thumb } />
@@ -145,4 +145,8 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
     }
   }
 
+  private _noop(): void {
+    /* no-op */
+  }
+
 }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
index 9d317ae8b5428..46812507523d2 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
@@ -19,6 +19,13 @@ export const SelectedItemDefault: (props: IPeoplePickerItemProps) => JSX.Element
   } = peoplePickerItemProps;
 
   const itemId = getId();
+  const onClickIconButton = (removeItem: (() => void) | undefined): () => void => {
+    return (): void => {
+      if (removeItem) {
+        removeItem();
+      }
+    };
+  };
 
   return (
     <div
@@ -45,7 +52,7 @@ export const SelectedItemDefault: (props: IPeoplePickerItemProps) => JSX.Element
         />
       </div>
       <IconButton
-        onClick={ () => { if (onRemoveItem) { onRemoveItem(); } } }
+        onClick={ onClickIconButton(onRemoveItem) }
         iconProps={ { iconName: 'Cancel', style: { fontSize: '12px' } } }
         className={ css('ms-PickerItem-removeButton', styles.removeButton) }
         ariaLabel={ removeButtonAriaLabel }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index 883f6d954400c..08ef11d958c9d 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -199,15 +199,10 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
               id={ 'sug-item' + index }
               suggestionModel={ suggestion }
               RenderSuggestion={ onRenderSuggestion as any }
-              onClick={ (ev: React.MouseEvent<HTMLElement>) => { this.props.onSuggestionClick(ev, suggestion.item, index); } }
+              onClick={ this._onClickTypedSuggestionsItem(suggestion.item, index) }
               className={ suggestionsItemClassName }
               showRemoveButton={ showRemoveButtons }
-              onRemoveItem={ (ev: React.MouseEvent<HTMLElement>) => {
-                let onSuggestionRemove = this.props.onSuggestionRemove!;
-                onSuggestionRemove(ev, suggestion.item, index);
-                ev.stopPropagation();
-              }
-              }
+              onRemoveItem={ this._onRemoveTypedSuggestionsItem(suggestion.item, index) }
             />
           </div>) }
       </div>);
@@ -220,10 +215,26 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
     }
   }
 
+  @autobind
+  private _onClickTypedSuggestionsItem(item: T, index: number): (ev: React.MouseEvent<HTMLElement>) => void {
+    return (ev: React.MouseEvent<HTMLElement>): void => {
+      this.props.onSuggestionClick(ev, item, index);
+    };
+  }
+
   @autobind
   private _onKeyDown(ev: React.KeyboardEvent<HTMLButtonElement>) {
     if ((ev.keyCode === KeyCodes.up || ev.keyCode === KeyCodes.down) && typeof this.props.refocusSuggestions === 'function') {
       this.props.refocusSuggestions(ev.keyCode);
     }
   }
+
+  @autobind
+  private _onRemoveTypedSuggestionsItem(item: T, index: number): (ev: React.MouseEvent<HTMLElement>) => void {
+    return (ev: React.MouseEvent<HTMLElement>): void => {
+      let onSuggestionRemove = this.props.onSuggestionRemove!;
+      onSuggestionRemove(ev, item, index);
+      ev.stopPropagation();
+    };
+  }
 }
\ No newline at end of file

From 7762dcf41869b6bbcfe01eb7009adb2536934ca2 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Thu, 21 Sep 2017 21:21:52 -0700
Subject: [PATCH 0695/1641] Removed 'any' types or disabled no-any rule in
 utilities packages (#2699)

* Remove 'any' or disable rule from Async.ts

* Remove 'any' or disable rule from Async.ts

* Removing 'any' types from utilities pkg

* Remove remaining 'any' types or disable rule in utilities

* Resolve merge conflict

* Minor refactoring

* Fix typo in shallowCompare

* Removed additional any's
---
 packages/utilities/src/Async.ts               | 42 ++++++++++++-------
 packages/utilities/src/AutoScroll.ts          |  1 +
 packages/utilities/src/BaseComponent.test.tsx |  3 ++
 packages/utilities/src/BaseComponent.ts       | 20 ++++++---
 packages/utilities/src/Customizer.tsx         | 16 ++++---
 packages/utilities/src/DelayedRender.tsx      |  4 +-
 packages/utilities/src/EventGroup.ts          | 22 +++++++++-
 packages/utilities/src/GlobalSettings.ts      |  4 ++
 packages/utilities/src/autobind.ts            |  3 ++
 packages/utilities/src/css.ts                 |  2 +
 packages/utilities/src/customizable.test.tsx  |  3 +-
 packages/utilities/src/customizable.tsx       |  8 +++-
 packages/utilities/src/focus.test.tsx         |  3 +-
 packages/utilities/src/focus.ts               |  1 +
 packages/utilities/src/hoist.ts               |  2 +
 packages/utilities/src/memoize.test.ts        |  2 +
 packages/utilities/src/memoize.ts             |  1 +
 packages/utilities/src/object.ts              | 10 +++--
 packages/utilities/src/overflow.test.ts       | 10 ++---
 packages/utilities/src/properties.test.ts     |  8 +++-
 packages/utilities/src/properties.ts          |  2 +-
 packages/utilities/src/scroll.ts              |  1 +
 packages/utilities/src/string.ts              |  2 +
 .../utilities/src/test/injectWrapperMethod.ts |  4 +-
 packages/utilities/src/test/setRenderSpy.ts   |  2 +-
 packages/utilities/src/warn.test.ts           |  3 ++
 packages/utilities/tslint.json                |  4 +-
 27 files changed, 133 insertions(+), 50 deletions(-)

diff --git a/packages/utilities/src/Async.ts b/packages/utilities/src/Async.ts
index 3fb01a9556e6d..8849e926ed2c3 100644
--- a/packages/utilities/src/Async.ts
+++ b/packages/utilities/src/Async.ts
@@ -11,16 +11,17 @@ declare function setInterval(cb: Function, delay: number): number;
  * @public
  */
 export class Async {
-  private _timeoutIds: any = null;
-  private _immediateIds: any = null;
-  private _intervalIds: any = null;
+  private _timeoutIds: { [id: number]: boolean } | null = null;
+  private _immediateIds: { [id: number]: boolean } | null = null;
+  private _intervalIds: { [id: number]: boolean } | null = null;
   private _animationFrameIds: { [id: number]: boolean } | null = null;
   private _isDisposed: boolean;
-  private _parent: any;
+  private _parent: React.ReactNode | null;
+  // tslint:disable-next-line:no-any
   private _onErrorHandler: ((e: any) => void) | undefined;
-  private _noop: any;
-
-  constructor(parent?: any, onError?: (e: any) => void) {
+  private _noop: () => void;
+  // tslint:disable-next-line:no-any
+  constructor(parent?: React.ReactNode, onError?: (e: any) => void) {
     this._isDisposed = false;
     this._parent = parent || null;
     this._onErrorHandler = onError;
@@ -102,7 +103,9 @@ export class Async {
 
           try {
             // Now delete the record and call the callback.
-            delete this._timeoutIds[timeoutId];
+            if (this._timeoutIds) {
+              delete this._timeoutIds[timeoutId];
+            }
             callback.apply(this._parent);
           } catch (e) {
             if (this._onErrorHandler) {
@@ -153,7 +156,9 @@ export class Async {
 
         try {
           // Now delete the record and call the callback.
-          delete this._immediateIds[immediateId];
+          if (this._immediateIds) {
+            delete this._immediateIds[immediateId];
+          }
           callback.apply(this._parent);
         } catch (e) {
           this._logError(e);
@@ -246,7 +251,7 @@ export class Async {
   public throttle<T extends Function>(func: T, wait?: number, options?: {
     leading?: boolean;
     trailing?: boolean;
-  }): T {
+  }): T | (() => void) {
 
     if (this._isDisposed) {
       return this._noop;
@@ -256,7 +261,8 @@ export class Async {
     let leading = true;
     let trailing = true;
     let lastExecuteTime = 0;
-    let lastResult: any;
+    let lastResult: T;
+    // tslint:disable-next-line:no-any
     let lastArgs: any[];
     let timeoutId: number | null = null;
 
@@ -286,7 +292,8 @@ export class Async {
       return lastResult;
     };
 
-    let resultFunction: any = (...args: any[]) => {
+    // tslint:disable-next-line:no-any
+    let resultFunction: () => T = (...args: any[]) => {
       lastArgs = args;
       return callback(true);
     };
@@ -313,7 +320,7 @@ export class Async {
     leading?: boolean;
     maxWait?: number;
     trailing?: boolean;
-  }): T {
+  }): T | (() => void) {
 
     if (this._isDisposed) {
       return this._noop;
@@ -322,10 +329,11 @@ export class Async {
     let waitMS = wait || 0;
     let leading = false;
     let trailing = true;
-    let maxWait: any = null;
+    let maxWait: number | null = null;
     let lastCallTime = 0;
     let lastExecuteTime = (new Date).getTime();
-    let lastResult: any;
+    let lastResult: T;
+    // tslint:disable-next-line:no-any
     let lastArgs: any[];
     let timeoutId: number | null = null;
 
@@ -378,7 +386,8 @@ export class Async {
       return lastResult;
     };
 
-    let resultFunction: any = (...args: any[]) => {
+    // tslint:disable-next-line:no-any
+    let resultFunction: () => T = (...args: any[]) => {
       lastArgs = args;
       return callback(true);
     };
@@ -428,6 +437,7 @@ export class Async {
     }
   }
 
+  // tslint:disable-next-line:no-any
   protected _logError(e: any): void {
     if (this._onErrorHandler) {
       this._onErrorHandler(e);
diff --git a/packages/utilities/src/AutoScroll.ts b/packages/utilities/src/AutoScroll.ts
index b8bf7b5ca1084..fc0afb454f6c1 100644
--- a/packages/utilities/src/AutoScroll.ts
+++ b/packages/utilities/src/AutoScroll.ts
@@ -31,6 +31,7 @@ export class AutoScroll {
     this._incrementScroll = this._incrementScroll.bind(this);
     this._scrollRect = getRect(this._scrollableParent);
 
+    // tslint:disable-next-line:no-any
     if (this._scrollableParent === window as any) {
       this._scrollableParent = document.body;
     }
diff --git a/packages/utilities/src/BaseComponent.test.tsx b/packages/utilities/src/BaseComponent.test.tsx
index 35cb9529491c7..eb28d3f7d8715 100644
--- a/packages/utilities/src/BaseComponent.test.tsx
+++ b/packages/utilities/src/BaseComponent.test.tsx
@@ -45,6 +45,7 @@ class TestComponent extends BaseComponent<{}, {}> {
   }
 
   private _createNullRef(): void {
+    // tslint:disable-next-line:no-any
     let foo: any = null;
 
     // Calling a null
@@ -77,6 +78,7 @@ describe('BaseComponent', () => {
 
     let component = ReactTestUtils.renderIntoDocument(
       <Foo />
+      // tslint:disable-next-line:no-any
     ) as any;
 
     expect(component.root).toBeDefined();
@@ -91,6 +93,7 @@ function _buildTestFor(methodName: string): void {
 
     let c = new TestComponent();
 
+    // tslint:disable-next-line:no-any
     (c as any)[methodName]();
 
     expect(lastErrorMessage).toBeDefined();
diff --git a/packages/utilities/src/BaseComponent.ts b/packages/utilities/src/BaseComponent.ts
index 8655d1344f824..0ea16f1069756 100644
--- a/packages/utilities/src/BaseComponent.ts
+++ b/packages/utilities/src/BaseComponent.ts
@@ -10,7 +10,7 @@ import { warnDeprecations, warnMutuallyExclusive, warnConditionallyRequiredProps
  * @public
  */
 export interface IBaseProps {
-  componentRef?: any;
+  componentRef?: (ref: React.ReactNode | null) => (void | React.ReactNode);
 }
 
 /**
@@ -23,6 +23,7 @@ export class BaseComponent<P extends IBaseProps, S = {}> extends React.Component
    * External consumers should override BaseComponent.onError to hook into error messages that occur from
    * exceptions thrown from within components.
    */
+  // tslint:disable-next-line:no-any
   public static onError: ((errorMessage?: string, ex?: any) => void);
 
   /**
@@ -36,7 +37,7 @@ export class BaseComponent<P extends IBaseProps, S = {}> extends React.Component
   private __async: Async;
   private __events: EventGroup;
   private __disposables: IDisposable[] | null;
-  private __resolves: { [name: string]: (ref: any) => any };
+  private __resolves: { [name: string]: (ref: React.ReactNode) => React.ReactNode };
   private __className: string;
   // tslint:enable:variable-name
 
@@ -45,6 +46,7 @@ export class BaseComponent<P extends IBaseProps, S = {}> extends React.Component
    * @param props - The props for the component.
    * @param context - The context for the component.
    */
+  // tslint:disable-next-line:no-any
   constructor(props?: P, context?: any) {
     super(props, context);
 
@@ -65,6 +67,7 @@ export class BaseComponent<P extends IBaseProps, S = {}> extends React.Component
   /**
    * When the component will receive props, make sure the componentRef is updated.
    */
+  // tslint:disable-next-line:no-any
   public componentWillReceiveProps(newProps?: P, newContext?: any): void {
     this._updateComponentRef(this.props, newProps);
   }
@@ -151,12 +154,14 @@ export class BaseComponent<P extends IBaseProps, S = {}> extends React.Component
    * @param refName - Name of the member to assign the ref to.
    * @returns A function instance keyed from the given refname.
    */
-  protected _resolveRef(refName: string): (ref: any) => any {
+  protected _resolveRef(refName: string): (ref: React.ReactNode) => React.ReactNode {
     if (!this.__resolves) {
       this.__resolves = {};
     }
     if (!this.__resolves[refName]) {
-      this.__resolves[refName] = (ref: any) => {
+      // tslint:disable-next-line:no-any
+      this.__resolves[refName] = (ref: React.ReactNode) => {
+        // tslint:disable-next-line:no-any
         return (this as any)[refName] = ref;
       };
     }
@@ -218,17 +223,20 @@ export class BaseComponent<P extends IBaseProps, S = {}> extends React.Component
  * ensures that the BaseComponent's methods are called before the subclass's. This ensures that
  * componentWillUnmount in the base is called and that things in the _disposables array are disposed.
  */
-function _makeAllSafe(obj: BaseComponent<any, any>, prototype: Object, methodNames: string[]): void {
+function _makeAllSafe(obj: BaseComponent<{}, {}>, prototype: Object, methodNames: string[]): void {
   for (let i = 0, len = methodNames.length; i < len; i++) {
     _makeSafe(obj, prototype, methodNames[i]);
   }
 }
 
-function _makeSafe(obj: BaseComponent<any, any>, prototype: Object, methodName: string): void {
+function _makeSafe(obj: BaseComponent<{}, {}>, prototype: Object, methodName: string): void {
+  // tslint:disable:no-any
   let classMethod = (obj as any)[methodName];
   let prototypeMethod = (prototype as any)[methodName];
+  // tslint:enable:no-any
 
   if (classMethod || prototypeMethod) {
+    // tslint:disable-next-line:no-any
     (obj as any)[methodName] = function (): any {
       let retVal;
 
diff --git a/packages/utilities/src/Customizer.tsx b/packages/utilities/src/Customizer.tsx
index 78605e590d169..79310d828405c 100644
--- a/packages/utilities/src/Customizer.tsx
+++ b/packages/utilities/src/Customizer.tsx
@@ -8,6 +8,7 @@ import { BaseComponent } from './BaseComponent';
  * @internal
  */
 export interface ISettings {
+  // tslint:disable-next-line:no-any
   [key: string]: any;
 }
 
@@ -45,35 +46,38 @@ export interface ICustomizerState {
  */
 export class Customizer extends BaseComponent<ICustomizerProps, ICustomizerState> {
   public static contextTypes: {
-    injectedProps: PropTypes.Requireable<any>;
+    injectedProps: PropTypes.Requireable<{}>;
   } = {
     injectedProps: PropTypes.object
   };
 
   public static childContextTypes: {
-    injectedProps: PropTypes.Requireable<any>;
+    injectedProps: PropTypes.Requireable<{}>;
   } = Customizer.contextTypes;
 
-  constructor(props: any, context: any) {
+  // tslint:disable-next-line:no-any
+  constructor(props: ICustomizerProps, context: any) {
     super(props);
 
     this.state = this._getInjectedProps(props, context);
   }
 
-  public getChildContext(): any {
+  public getChildContext(): ICustomizerState {
     return this.state;
   }
 
-  public componentWillReceiveProps(newProps: any, newContext: any): void {
+  // tslint:disable-next-line:no-any
+  public componentWillReceiveProps(newProps: ICustomizerProps, newContext: any): void {
     this.setState(this._getInjectedProps(newProps, newContext));
   }
 
-  public render(): React.ReactElement<any> {
+  public render(): React.ReactElement<{}> {
     return React.Children.only(this.props.children);
   }
 
   private _getInjectedProps(props: ICustomizerProps, context: ICustomizerState): {
     injectedProps: {
+      // tslint:disable-next-line:no-any
       [x: string]: any;
     };
   } {
diff --git a/packages/utilities/src/DelayedRender.tsx b/packages/utilities/src/DelayedRender.tsx
index 1e63560f1117a..cef9fa5b35bea 100644
--- a/packages/utilities/src/DelayedRender.tsx
+++ b/packages/utilities/src/DelayedRender.tsx
@@ -5,7 +5,7 @@ import * as React from 'react';
  *
  * @public
  */
-export interface IDelayedRenderProps extends React.Props<any> {
+export interface IDelayedRenderProps extends React.Props<{}> {
   /**
    * Number of milliseconds to delay rendering children.
    */
@@ -61,7 +61,7 @@ export class DelayedRender extends React.Component<IDelayedRenderProps, IDelayed
     }
   }
 
-  public render(): React.ReactElement<any> | null {
+  public render(): React.ReactElement<{}> | null {
     return this.state.isRendered ? React.Children.only(this.props.children) : null;
   }
 }
diff --git a/packages/utilities/src/EventGroup.ts b/packages/utilities/src/EventGroup.ts
index b64d1d352b3aa..90a70cb1f6d90 100644
--- a/packages/utilities/src/EventGroup.ts
+++ b/packages/utilities/src/EventGroup.ts
@@ -5,6 +5,7 @@
  *
  * @internal
  */
+// tslint:disable:no-any
 export interface IEventRecord {
   target: any;
   eventName: string;
@@ -14,6 +15,7 @@ export interface IEventRecord {
   objectCallback?: (args?: any) => void;
   useCapture: boolean;
 }
+// tslint:enable:no-any
 
 /**
  * EventRecordsByName interface.
@@ -56,6 +58,7 @@ export interface IDeclaredEventsByName {
 export class EventGroup {
   // tslint:disable-next-line:no-inferrable-types
   private static _uniqueId: number = 0;
+  // tslint:disable-next-line:no-any
   private _parent: any;
   private _eventRecords: IEventRecord[];
   private _id: number = EventGroup._uniqueId++;
@@ -68,8 +71,10 @@ export class EventGroup {
    *
    */
   public static raise(
+    // tslint:disable-next-line:no-any
     target: any,
     eventName: string,
+    // tslint:disable-next-line:no-any
     eventArgs?: any,
     bubbleEvent?: boolean
   ): boolean | undefined {
@@ -80,9 +85,12 @@ export class EventGroup {
         let ev = document.createEvent('HTMLEvents');
 
         ev.initEvent(eventName, bubbleEvent || false, true);
+        // tslint:disable-next-line:no-any
         (ev as any)['args'] = eventArgs;
         retVal = target.dispatchEvent(ev);
+        // tslint:disable-next-line:no-any
       } else if ((document as any)['createEventObject']) { // IE8
+        // tslint:disable-next-line:no-any
         let evObj = (document as any)['createEventObject'](eventArgs);
         // cannot set cancelBubble on evObj, fireEvent will overwrite it
         target.fireEvent('on' + eventName, evObj);
@@ -116,6 +124,7 @@ export class EventGroup {
     return retVal;
   }
 
+  // tslint:disable-next-line:no-any
   public static isObserved(target: any, eventName: string): boolean {
     let events = target && <IEventRecordsByName>target.__events__;
 
@@ -123,12 +132,14 @@ export class EventGroup {
   }
 
   /** Check to see if the target has declared support of the given event. */
+  // tslint:disable-next-line:no-any
   public static isDeclared(target: any, eventName: string): boolean {
     let declaredEvents = target && <IDeclaredEventsByName>target.__declaredEvents;
 
     return !!declaredEvents && !!declaredEvents[eventName];
   }
 
+  // tslint:disable-next-line:no-any
   public static stopPropagation(event: any): void {
     if (event.stopPropagation) {
       event.stopPropagation();
@@ -142,6 +153,7 @@ export class EventGroup {
   }
 
   /** parent: the context in which events attached to non-HTMLElements are called */
+  // tslint:disable-next-line:no-any
   public constructor(parent: any) {
     this._parent = parent;
     this._eventRecords = [];
@@ -157,6 +169,7 @@ export class EventGroup {
   }
 
   /** On the target, attach a set of events, where the events object is a name to function mapping. */
+  // tslint:disable-next-line:no-any
   public onAll(target: any, events: { [key: string]: (args?: any) => void; }, useCapture?: boolean): void {
     for (let eventName in events) {
       if (events.hasOwnProperty(eventName)) {
@@ -168,6 +181,7 @@ export class EventGroup {
   /** On the target, attach an event whose handler will be called in the context of the parent
    * of this instance of EventGroup.
    */
+  // tslint:disable-next-line:no-any
   public on(target: any, eventName: string, callback: (args?: any) => void, useCapture?: boolean): void {
     if (eventName.indexOf(',') > -1) {
       let events = eventName.split(/[ ,]+/);
@@ -195,6 +209,7 @@ export class EventGroup {
       events[eventName].count++;
 
       if (EventGroup._isElement(target)) {
+        // tslint:disable-next-line:no-any
         let processElementEvent = (...args: any[]) => {
           if (this._isDisposed) {
             return;
@@ -233,6 +248,7 @@ export class EventGroup {
           target.attachEvent('on' + eventName, processElementEvent);
         }
       } else {
+        // tslint:disable-next-line:no-any
         let processObjectEvent = (...args: any[]) => {
           if (this._isDisposed) {
             return;
@@ -249,6 +265,7 @@ export class EventGroup {
     }
   }
 
+  // tslint:disable-next-line:no-any
   public off(target?: any, eventName?: string, callback?: (args?: any) => void, useCapture?: boolean): void {
     for (let i = 0; i < this._eventRecords.length; i++) {
       let eventRecord = this._eventRecords[i];
@@ -289,12 +306,13 @@ export class EventGroup {
   }
 
   /** Trigger the given event in the context of this instance of EventGroup. */
-  public raise(eventName: string, eventArgs?: any, bubbleEvent?: boolean): any {
+  // tslint:disable-next-line:no-any
+  public raise(eventName: string, eventArgs?: any, bubbleEvent?: boolean): boolean | undefined {
     return EventGroup.raise(this._parent, eventName, eventArgs, bubbleEvent);
   }
 
   /** Declare an event as being supported by this instance of EventGroup. */
-  public declare(event: any): void {
+  public declare(event: string | string[]): void {
     let declaredEvents = this._parent.__declaredEvents = this._parent.__declaredEvents || {};
 
     if (typeof event === 'string') {
diff --git a/packages/utilities/src/GlobalSettings.ts b/packages/utilities/src/GlobalSettings.ts
index e04f798ef995e..c075f3a78c5e7 100644
--- a/packages/utilities/src/GlobalSettings.ts
+++ b/packages/utilities/src/GlobalSettings.ts
@@ -10,10 +10,12 @@
 const GLOBAL_SETTINGS_PROP_NAME = '__globalSettings__';
 const CALLBACK_STATE_PROP_NAME = '__callbacks__';
 
+// tslint:disable-next-line:no-any
 let _globalSettings: { [key: string]: any } = {};
 let _counter = 0;
 
 if (typeof window !== 'undefined') {
+  // tslint:disable-next-line:no-any
   let win = window as any;
 
   _globalSettings = win[GLOBAL_SETTINGS_PROP_NAME] = win[GLOBAL_SETTINGS_PROP_NAME] || {
@@ -30,7 +32,9 @@ const _callbacks = _globalSettings[CALLBACK_STATE_PROP_NAME];
  */
 export interface IChangeDescription {
   key: string;
+  // tslint:disable-next-line:no-any
   oldValue: any;
+  // tslint:disable-next-line:no-any
   value: any;
 }
 
diff --git a/packages/utilities/src/autobind.ts b/packages/utilities/src/autobind.ts
index fbadce9a70d7b..834ed03d62168 100644
--- a/packages/utilities/src/autobind.ts
+++ b/packages/utilities/src/autobind.ts
@@ -2,9 +2,11 @@
  * Autobind is a utility for binding methods in a class. This simplifies tagging methods as being "bound" to the this pointer
  * so that they can be used in scenarios that simply require a function callback.
  */
+// tslint:disable-next-line:no-any
 export function autobind<T extends Function>(target: any, key: string, descriptor: TypedPropertyDescriptor<T>): {
   configurable: boolean;
   get(): T;
+  // tslint:disable-next-line:no-any
   set(newValue: any): void;
 } | void {
   let fn = descriptor.value;
@@ -34,6 +36,7 @@ export function autobind<T extends Function>(target: any, key: string, descripto
       return fnBound;
     },
 
+    // tslint:disable-next-line:no-any
     set(newValue: any): void {
       Object.defineProperty(this, key, {
         configurable: true,
diff --git a/packages/utilities/src/css.ts b/packages/utilities/src/css.ts
index 734b39337cbf6..0fd2c7e768517 100644
--- a/packages/utilities/src/css.ts
+++ b/packages/utilities/src/css.ts
@@ -38,7 +38,9 @@ export function css(...args: ICssInput[]): string {
       } else if ((arg.hasOwnProperty('toString') && typeof (arg.toString) === 'function')) {
         classes.push(arg.toString());
       } else {
+        // tslint:disable-next-line:no-any
         for (let key in arg as any) {
+          // tslint:disable-next-line:no-any
           if ((arg as any)[key]) {
             classes.push(key);
           }
diff --git a/packages/utilities/src/customizable.test.tsx b/packages/utilities/src/customizable.test.tsx
index d518178097dad..5ac49ef884310 100644
--- a/packages/utilities/src/customizable.test.tsx
+++ b/packages/utilities/src/customizable.test.tsx
@@ -6,9 +6,10 @@ import { GlobalSettings } from './GlobalSettings';
 
 @customizable(['name', 'name2'])
 class Foo extends React.Component<{ field: string; }, {}> {
-  public name: any;
+  public name: string;
 
   public render(): JSX.Element {
+    // tslint:disable-next-line:no-any
     return <div>{ (this.props as any)[this.props.field] }</div>;
   }
 }
diff --git a/packages/utilities/src/customizable.tsx b/packages/utilities/src/customizable.tsx
index a1fea0e72bb62..6ec6dc9d70ebf 100644
--- a/packages/utilities/src/customizable.tsx
+++ b/packages/utilities/src/customizable.tsx
@@ -2,18 +2,22 @@ import * as React from 'react';
 import * as PropTypes from 'prop-types';
 import { GlobalSettings, IChangeDescription } from './GlobalSettings';
 
+// tslint:disable-next-line:no-any
 export function customizable(fields: string[]): <P, S>(ComposedComponent: new (props: P, ...args: any[]) => React.Component<P, S>) => any {
   // tslint:disable-next-line:no-shadowed-variable
   return function customizableFactory<P, S>(
+    // tslint:disable-next-line:no-any
     ComposedComponent: (new (props: P, ...args: any[]) => React.Component<P, S>)
+    // tslint:disable-next-line:no-any
   ): any {
     return class ComponentWithInjectedProps extends React.Component<P, {}> {
       public static contextTypes: {
-        injectedProps: PropTypes.Requireable<any>;
+        injectedProps: PropTypes.Requireable<{}>;
       } = {
         injectedProps: PropTypes.object
       };
 
+      // tslint:disable-next-line:no-any
       constructor(props: P, context: any) {
         super(props, context);
 
@@ -32,12 +36,14 @@ export function customizable(fields: string[]): <P, S>(ComposedComponent: new (p
         let defaultProps = {};
 
         for (let propName of fields) {
+          // tslint:disable-next-line:no-any
           (defaultProps as any)[propName] = (this.context.injectedProps) ?
             this.context.injectedProps[propName] :
             GlobalSettings.getValue(propName);
         }
 
         return (
+          // tslint:disable-next-line:no-any
           <ComposedComponent { ...defaultProps } { ...this.props as any } />
         );
       }
diff --git a/packages/utilities/src/focus.test.tsx b/packages/utilities/src/focus.test.tsx
index 23b9d0747d7ae..1bf2ce94e1896 100644
--- a/packages/utilities/src/focus.test.tsx
+++ b/packages/utilities/src/focus.test.tsx
@@ -9,7 +9,7 @@ let _hiddenElement: HTMLElement | undefined;
 let _visibleElement: HTMLElement | undefined;
 let _element: HTMLElement | undefined;
 
-function renderIntoDocument(element: React.ReactElement<any>): HTMLElement {
+function renderIntoDocument(element: React.ReactElement<{}>): HTMLElement {
   const component = ReactTestUtils.renderIntoDocument(element);
   const renderedDOM: Element = ReactDOM.findDOMNode(component as React.ReactInstance);
   return renderedDOM as HTMLElement;
@@ -31,6 +31,7 @@ function _initialize(): void {
       <button />
     </div>
   ) as HTMLElement;
+  // tslint:disable-next-line:no-any
   (_element as any).isVisible = true;
 }
 
diff --git a/packages/utilities/src/focus.ts b/packages/utilities/src/focus.ts
index 4407854e26369..654d37d0234d8 100644
--- a/packages/utilities/src/focus.ts
+++ b/packages/utilities/src/focus.ts
@@ -208,6 +208,7 @@ export function isElementVisible(element: HTMLElement | undefined | null): boole
   // Fallback to other methods of determining actual visibility.
   return (element.offsetHeight !== 0 ||
     element.offsetParent !== null ||
+    // tslint:disable-next-line:no-any
     (element as any).isVisible === true); // used as a workaround for testing.
 }
 
diff --git a/packages/utilities/src/hoist.ts b/packages/utilities/src/hoist.ts
index 6c84e9eb22a67..4a9b0bad0521e 100644
--- a/packages/utilities/src/hoist.ts
+++ b/packages/utilities/src/hoist.ts
@@ -19,6 +19,7 @@ const REACT_LIFECYCLE_EXCLUSIONS = [
  * @param exclusions - (Optional) What methods to exclude from being hoisted.
  * @returns An array of names of methods that were hoisted.
  */
+// tslint:disable-next-line:no-any
 export function hoistMethods(destination: any, source: any, exclusions: string[] = REACT_LIFECYCLE_EXCLUSIONS): string[] {
   let hoisted: string[] = [];
   for (let methodName in source) {
@@ -44,6 +45,7 @@ export function hoistMethods(destination: any, source: any, exclusions: string[]
  * @param source - The source object upon which methods were hoisted.
  * @param methodNames - An array of method names to unhoist.
  */
+// tslint:disable-next-line:no-any
 export function unhoistMethods(source: any, methodNames: string[]): void {
   methodNames
     .forEach((methodName: string) => delete source[methodName]);
diff --git a/packages/utilities/src/memoize.test.ts b/packages/utilities/src/memoize.test.ts
index c75c09939ce30..9f3ef2ab11f03 100644
--- a/packages/utilities/src/memoize.test.ts
+++ b/packages/utilities/src/memoize.test.ts
@@ -12,6 +12,7 @@ describe('memoizeFunction', () => {
 
   it('can return a cached result with a 2 arg function', () => {
     let _timesCalled = 0;
+    // tslint:disable-next-line:no-any
     let combine = memoizeFunction((obj1: any, obj2: any) => (obj1.val + obj2.val + ++_timesCalled));
     let objA = { val: 'a' };
     let objB = { val: 'b' };
@@ -26,6 +27,7 @@ describe('memoizeFunction', () => {
 
   it('can return a cached result with falsy args', () => {
     let _timesCalled = 0;
+    // tslint:disable-next-line:no-any
     let combine = memoizeFunction((obj1: any, obj2: any) => ((obj1 ? obj1.val : '') + (obj2 ? obj2.val : '') + ++_timesCalled));
     let objA = { val: 'a' };
     let objB = { val: 'b' };
diff --git a/packages/utilities/src/memoize.ts b/packages/utilities/src/memoize.ts
index 0d27893049a07..7b031bf61dc5b 100644
--- a/packages/utilities/src/memoize.ts
+++ b/packages/utilities/src/memoize.ts
@@ -1,3 +1,4 @@
+// tslint:disable:no-any
 declare class WeakMap {
   public get(key: any): any;
   public set(key: any, value: any): void;
diff --git a/packages/utilities/src/object.ts b/packages/utilities/src/object.ts
index a6bc2020f2929..afacac55fe389 100644
--- a/packages/utilities/src/object.ts
+++ b/packages/utilities/src/object.ts
@@ -1,14 +1,16 @@
 // Initialize global window id.
 const CURRENT_ID_PROPERTY = '__currentId__';
 
-declare const process: any;
+declare const process: {};
 
-let _global = (typeof window !== 'undefined' && window) || process;
+// tslint:disable-next-line:no-any
+let _global: any = (typeof window !== 'undefined' && window) || process;
 
 if (_global[CURRENT_ID_PROPERTY] === undefined) {
   _global[CURRENT_ID_PROPERTY] = 0;
 }
 
+// tslint:disable-next-line:no-any
 function checkProperties(a: any, b: any): boolean {
   for (let propName in a) {
     if (a.hasOwnProperty(propName)) {
@@ -26,7 +28,7 @@ function checkProperties(a: any, b: any): boolean {
  *
  * @public
  */
-export function shallowCompare(a: any, b: any): boolean {
+export function shallowCompare<TA, TB>(a: TA, b: TB): boolean {
   return checkProperties(a, b) && checkProperties(b, a);
 }
 
@@ -40,6 +42,7 @@ export function shallowCompare(a: any, b: any): boolean {
  * @param args - One or more objects that will be mixed into the target in the order they are provided.
  * @returns Resulting merged target.
  */
+// tslint:disable-next-line:no-any
 export function assign(target: any, ...args: any[]): any {
   return filteredAssign.apply(this, [null, target].concat(args));
 }
@@ -56,6 +59,7 @@ export function assign(target: any, ...args: any[]): any {
  * @param args - One or more objects that will be mixed into the target in the order they are provided.
  * @returns Resulting merged target.
  */
+// tslint:disable-next-line:no-any
 export function filteredAssign(isAllowed: (propName: string) => boolean, target: any, ...args: any[]): any {
   target = target || {};
 
diff --git a/packages/utilities/src/overflow.test.ts b/packages/utilities/src/overflow.test.ts
index 014b8359090da..13b34abafa748 100644
--- a/packages/utilities/src/overflow.test.ts
+++ b/packages/utilities/src/overflow.test.ts
@@ -11,7 +11,7 @@ describe('overflow', () => {
       clientHeight: 10,
       scrollWidth: 10,
       scrollHeight: 10
-    } as any)).toEqual(false);
+    } as HTMLElement)).toEqual(false);
   });
 
   it('detects horizontal overflow', () => {
@@ -22,8 +22,8 @@ describe('overflow', () => {
       scrollHeight: 10
     };
 
-    expect(hasOverflow(elementWithOverflow as any)).toEqual(true);
-    expect(hasHorizontalOverflow(elementWithOverflow as any)).toEqual(true);
+    expect(hasOverflow(elementWithOverflow as HTMLElement)).toEqual(true);
+    expect(hasHorizontalOverflow(elementWithOverflow as HTMLElement)).toEqual(true);
   });
 
   it('detects vertical overflow', () => {
@@ -34,8 +34,8 @@ describe('overflow', () => {
       scrollHeight: 20
     };
 
-    expect(hasOverflow(elementWithOverflow as any)).toEqual(true);
-    expect(hasVerticalOverflow(elementWithOverflow as any)).toEqual(true);
+    expect(hasOverflow(elementWithOverflow as HTMLElement)).toEqual(true);
+    expect(hasVerticalOverflow(elementWithOverflow as HTMLElement)).toEqual(true);
   });
 
 });
diff --git a/packages/utilities/src/properties.test.ts b/packages/utilities/src/properties.test.ts
index 2e814aca6e774..58a4f110cff19 100644
--- a/packages/utilities/src/properties.test.ts
+++ b/packages/utilities/src/properties.test.ts
@@ -10,6 +10,7 @@ describe('getNativeProps', () => {
     let result = getNativeProps<React.HTMLAttributes<HTMLDivElement>>({
       'data-automation-id': 1
     }, divProperties);
+    // tslint:disable-next-line:no-any
     expect((result as any)['data-automation-id']).toEqual(1);
   });
 
@@ -17,6 +18,7 @@ describe('getNativeProps', () => {
     let result = getNativeProps<React.HTMLAttributes<HTMLDivElement>>({
       'aria-label': 1
     }, divProperties);
+    // tslint:disable-next-line:no-any
     expect((result as any)['aria-label']).toEqual(1);
   });
 
@@ -26,10 +28,11 @@ describe('getNativeProps', () => {
       onClick: () => { /* no-op */ },
       onClickCapture: () => { /* no-op */ }
     }, divProperties);
+
     expect(result.className).toEqual('foo');
     expect(typeof result.onClick).toEqual('function');
 
-    // tslint:disable-next-line:no-string-literal
+    // tslint:disable-next-line:no-string-literal no-any
     expect(typeof (result as any)['onClickCapture']).toEqual('function');
   });
 
@@ -38,11 +41,14 @@ describe('getNativeProps', () => {
       'foobar': 1,
       className: 'hi'
     }, divProperties);
+
     expect(result.className).toEqual('hi');
+    // tslint:disable-next-line:no-any
     expect((result as any)['foobar']).toEqual(undefined); // tslint:disable-line:no-string-literal
   });
 
   it('can exclude properties', () => {
+    // tslint:disable-next-line:no-any
     let result = getNativeProps<any>({ a: 1, b: 2 }, ['a', 'b'], ['b']);
 
     expect(result.a).toBeDefined();
diff --git a/packages/utilities/src/properties.ts b/packages/utilities/src/properties.ts
index 6f948a502b890..a416666ce86a4 100644
--- a/packages/utilities/src/properties.ts
+++ b/packages/utilities/src/properties.ts
@@ -271,7 +271,7 @@ export const imageProperties = divProperties;
  * @param allowedPropsNames-  The array of allowed propnames.
  * @returns The filtered props
  */
-export function getNativeProps<T>(props: any, allowedPropNames: string[], excludedPropNames?: string[]): T {
+export function getNativeProps<T>(props: {}, allowedPropNames: string[], excludedPropNames?: string[]): T {
   return filteredAssign((propName: string) => {
     return (
       (!excludedPropNames || excludedPropNames.indexOf(propName) < 0) && (
diff --git a/packages/utilities/src/scroll.ts b/packages/utilities/src/scroll.ts
index f1cd45dae72f1..81312d8e97477 100644
--- a/packages/utilities/src/scroll.ts
+++ b/packages/utilities/src/scroll.ts
@@ -104,6 +104,7 @@ export function findScrollableParent(startingElement: HTMLElement): HTMLElement
 
   // Fall back to window scroll.
   if (!el || el === document.body) {
+    // tslint:disable-next-line:no-any
     el = window as any;
   }
 
diff --git a/packages/utilities/src/string.ts b/packages/utilities/src/string.ts
index 8b073a2659390..7d98be8930af1 100644
--- a/packages/utilities/src/string.ts
+++ b/packages/utilities/src/string.ts
@@ -13,6 +13,7 @@ const FORMAT_REGEX = /\{\d+\}/g;
  *
  * @public
  */
+// tslint:disable-next-line:no-any
 export function format(s: string, ...values: any[]): string {
   'use strict';
 
@@ -20,6 +21,7 @@ export function format(s: string, ...values: any[]): string {
   // Callback match function
   function replace_func(match: string): string {
     // looks up in the args
+    // tslint:disable-next-line:no-any
     let replacement = args[match.replace(FORMAT_ARGS_REGEX, '') as any];
 
     // catches undefined in nondebug and null in debug and nondebug
diff --git a/packages/utilities/src/test/injectWrapperMethod.ts b/packages/utilities/src/test/injectWrapperMethod.ts
index fae25b3d9c6f1..4e1c9d428ee60 100644
--- a/packages/utilities/src/test/injectWrapperMethod.ts
+++ b/packages/utilities/src/test/injectWrapperMethod.ts
@@ -6,13 +6,15 @@ import { ReactWrapper } from 'enzyme';
  * @param methodName - The name of the method to modify on the wrapper
  * @param fn - The function to run prior to the call of the original method
  */
-export function injectWrapperMethod(wrapper: ReactWrapper<any, any>, methodName: string, fn: () => void): void {
+export function injectWrapperMethod(wrapper: ReactWrapper<{}, {}>, methodName: string, fn: () => void): void {
+  // tslint:disable-next-line:no-any
   const originalMethod = (wrapper.instance() as any)[methodName];
 
   if (typeof originalMethod !== 'function') {
     throw new Error(`Tried to override the method ${methodName} on a ReactWrapper that does not have that function`);
   }
 
+  // tslint:disable-next-line:no-any
   (wrapper.instance() as any)[methodName] = function (prevProps: any): void {
     fn();
     originalMethod.call(this, prevProps);
diff --git a/packages/utilities/src/test/setRenderSpy.ts b/packages/utilities/src/test/setRenderSpy.ts
index 24df0e82a9dfd..bfe4158e639fd 100644
--- a/packages/utilities/src/test/setRenderSpy.ts
+++ b/packages/utilities/src/test/setRenderSpy.ts
@@ -6,7 +6,7 @@ import * as sinon from 'sinon';
  * times the render function was called in a test.
  * @param wrapper - The wrapper around the component instance for which you want to spy upon
  */
-export function setRenderSpy(wrapper: ReactWrapper<any, any>): sinon.SinonSpy {
+export function setRenderSpy(wrapper: ReactWrapper<{}, {}>): sinon.SinonSpy {
   let spy = sinon.spy(wrapper.instance().render);
   wrapper.instance().render = spy;
   return spy;
diff --git a/packages/utilities/src/warn.test.ts b/packages/utilities/src/warn.test.ts
index 4cc4b7040af72..45312379aea4e 100644
--- a/packages/utilities/src/warn.test.ts
+++ b/packages/utilities/src/warn.test.ts
@@ -16,11 +16,13 @@ describe('warnDeprecations', () => {
   afterEach(() => setWarningCallback(undefined));
 
   it('does not warn when unnecessary', () => {
+    // tslint:disable-next-line:no-any
     warnDeprecations('Foo', { bar: 1 }, { 'foo': null } as any);
     expect(_lastWarning).toEqual(undefined);
   });
 
   it('can warn on a deprecated prop', () => {
+    // tslint:disable-next-line:no-any
     warnDeprecations('Foo', { foo: 1 }, { 'foo': null } as any);
     expect(_lastWarning).toEqual(`Foo property 'foo' was used but has been deprecated.`);
   });
@@ -45,6 +47,7 @@ describe('warnMutuallyExclusive', () => {
   });
 
   it('can warn on mutual exlusive props', () => {
+    // tslint:disable-next-line:no-any
     warnMutuallyExclusive('Foo', { foo: 1, bar: 1 }, { 'foo': 'bar' } as any);
     expect(_lastWarning).toEqual(`Foo property 'foo' is mutually exclusive with 'bar'. Use one or the other.`);
   });
diff --git a/packages/utilities/tslint.json b/packages/utilities/tslint.json
index 5d9173ba970da..621ee6ba04605 100644
--- a/packages/utilities/tslint.json
+++ b/packages/utilities/tslint.json
@@ -2,7 +2,5 @@
   "extends": [
     "office-ui-fabric-react-tslint"
   ],
-  "rules": {
-    "no-any": false
-  }
+  "rules": {}
 }
\ No newline at end of file

From 9b49a1ddc762dc96e57080019911dc5b01ee4030 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Thu, 21 Sep 2017 21:23:56 -0700
Subject: [PATCH 0696/1641] Icon on clicked deprecate (#2896)

* Deprecate icon onClicked because native onClick is already available

* Change file

* Removed onclicked alltogether
---
 .../icon-onClicked-deprecate_2017-09-20-17-13.json    | 11 +++++++++++
 package.json                                          |  2 +-
 .../src/components/DatePicker/DatePicker.tsx          |  2 +-
 .../src/components/Icon/Icon.Props.ts                 |  5 -----
 .../src/components/Icon/Icon.tsx                      |  2 --
 5 files changed, 13 insertions(+), 9 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/icon-onClicked-deprecate_2017-09-20-17-13.json

diff --git a/common/changes/office-ui-fabric-react/icon-onClicked-deprecate_2017-09-20-17-13.json b/common/changes/office-ui-fabric-react/icon-onClicked-deprecate_2017-09-20-17-13.json
new file mode 100644
index 0000000000000..c290eacde1f8b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/icon-onClicked-deprecate_2017-09-20-17-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Icon: Deprecate onClicked as onClick is already supported. Updated DatePicker to use onClick",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/package.json b/package.json
index f23eee053dd4d..7b965aed1a5cd 100644
--- a/package.json
+++ b/package.json
@@ -26,4 +26,4 @@
   "devDependencies": {
     "@microsoft/rush": "3.0.12"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 6232975801aa3..4a8eeb4285164 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -203,7 +203,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
             borderless={ borderless }
             iconProps={ {
               iconName: 'Calendar',
-              onClicked: this._onIconClick,
+              onClick: this._onIconClick,
               className: css(
                 label ? 'ms-DatePicker-event--with-label' : 'ms-DatePicker-event--without-label',
                 label ? styles.eventWithLabel : styles.eventWithoutLabel
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts b/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
index d02c9cdc90b35..2c4e67fa6e2b6 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
@@ -64,9 +64,4 @@ export interface IIconProps extends React.HTMLAttributes<HTMLElement> {
    * @memberOf IIconProps
    */
   imageProps?: IImageProps;
-
-  /**
-   * Callback for the onClick event.
-   */
-  onClicked?: (ev: React.MouseEvent<HTMLElement>) => void;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
index 0541e5e3dbf8a..712a526bb63a8 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
@@ -16,7 +16,6 @@ export const Icon = (props: IIconProps): JSX.Element => {
   let {
     ariaLabel,
     className,
-    onClicked,
     styles: customStyles,
     iconName
    } = props;
@@ -61,7 +60,6 @@ export const Icon = (props: IIconProps): JSX.Element => {
             styles.root,
             props.className
           ) }
-        onClick={ onClicked }
       >
         { (IconCodes as any)[iconMemberName] }
       </i>

From 27237524ac78279420c93e0e07d65b44dc5547da Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 21 Sep 2017 21:39:06 -0700
Subject: [PATCH 0697/1641] Update
 icon-onClicked-deprecate_2017-09-20-17-13.json

---
 .../icon-onClicked-deprecate_2017-09-20-17-13.json          | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/common/changes/office-ui-fabric-react/icon-onClicked-deprecate_2017-09-20-17-13.json b/common/changes/office-ui-fabric-react/icon-onClicked-deprecate_2017-09-20-17-13.json
index c290eacde1f8b..4e84a28f09a6a 100644
--- a/common/changes/office-ui-fabric-react/icon-onClicked-deprecate_2017-09-20-17-13.json
+++ b/common/changes/office-ui-fabric-react/icon-onClicked-deprecate_2017-09-20-17-13.json
@@ -2,10 +2,10 @@
   "changes": [
     {
       "packageName": "office-ui-fabric-react",
-      "comment": "Icon: Deprecate onClicked as onClick is already supported. Updated DatePicker to use onClick",
-      "type": "patch"
+      "comment": "Icon: Removed a recently added prop `onClicked` as it is redundant with `onClick`. Updated DatePicker to use `onClick`.",
+      "type": "minor"
     }
   ],
   "packageName": "office-ui-fabric-react",
   "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
+}

From 67a34e0856d57d168f6cbf3acab6987eef56974f Mon Sep 17 00:00:00 2001
From: Joe Martella <martellaj@live.com>
Date: Thu, 21 Sep 2017 22:20:36 -0700
Subject: [PATCH 0698/1641] [Suggestions] Adds an ARIA label prop for
 Suggestions container (#2900)

* Adds ARIA label prop for Suggestions component

* Adds change file
---
 .../joem-suggestions-aria-label_2017-09-20-19-44.json | 11 +++++++++++
 .../src/components/pickers/BasePicker.Props.ts        |  4 ++++
 .../examples/PeoplePicker.Types.Example.tsx           |  3 ++-
 .../pickers/Suggestions/Suggestions.Props.ts          |  4 ++++
 .../components/pickers/Suggestions/Suggestions.tsx    |  4 +++-
 5 files changed, 24 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/joem-suggestions-aria-label_2017-09-20-19-44.json

diff --git a/common/changes/office-ui-fabric-react/joem-suggestions-aria-label_2017-09-20-19-44.json b/common/changes/office-ui-fabric-react/joem-suggestions-aria-label_2017-09-20-19-44.json
new file mode 100644
index 0000000000000..a445ceabd99a2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/joem-suggestions-aria-label_2017-09-20-19-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Adds ARIA label prop for Suggestions component",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joem@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
index 99872b516089e..f1ef12c4a3cb0 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
@@ -179,6 +179,10 @@ export interface IBasePickerSuggestionsProps {
    * Screen reader message to read when there are suggestions available.
    */
   suggestionsAvailableAlertText?: string;
+  /**
+   * An ARIA label for the container that is the parent of the suggestions.
+   */
+  suggestionsContainerAriaLabel?: string;
 }
 
 export enum ValidationState {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index c81fbb5363d6e..3dd288d6b2d00 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -38,7 +38,8 @@ const suggestionProps: IBasePickerSuggestionsProps = {
   noResultsFoundText: 'No results found',
   loadingText: 'Loading',
   showRemoveButtons: true,
-  suggestionsAvailableAlertText: 'People Picker Suggestions available'
+  suggestionsAvailableAlertText: 'People Picker Suggestions available',
+  suggestionsContainerAriaLabel: 'Suggested contacts'
 };
 
 const limitedSearchAdditionalProps: IBasePickerSuggestionsProps = {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts
index 9357a6d4a6398..011f80113c78c 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts
@@ -114,6 +114,10 @@ export interface ISuggestionsProps<T> extends React.Props<any> {
    * A function that resets focus to the expected item in the suggestion list
    */
   refocusSuggestions?: (keyCode: KeyCodes) => void;
+  /**
+   * An ARIA label for the container that is the parent of the suggestions.
+   */
+  suggestionsContainerAriaLabel?: string;
 }
 
 export interface ISuggestionItemProps<T> {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index 08ef11d958c9d..1971e85c8a594 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -174,7 +174,8 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
       onRenderSuggestion,
       suggestionsItemClassName,
       resultsMaximumNumber,
-      showRemoveButtons } = this.props;
+      showRemoveButtons,
+      suggestionsContainerAriaLabel } = this.props;
     let TypedSuggestionsItem = this.SuggestionsItemOfProperType;
 
     if (resultsMaximumNumber) {
@@ -186,6 +187,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
         className={ css('ms-Suggestions-container', styles.suggestionsContainer) }
         id='suggestion-list'
         role='menu'
+        aria-label={ suggestionsContainerAriaLabel }
       >
         { suggestions.map((suggestion, index) =>
           <div

From 30ebd44134e943d7b49d8f809a306de6213013ca Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 22 Sep 2017 10:19:04 -0700
Subject: [PATCH 0699/1641] fix build. (#2923)

---
 .../components/ActivityItem/ActivityItem.tsx    |  4 ++--
 .../ActivityItem/ActivityItemPage.tsx           |  6 +++---
 .../examples/ActivityItem.Basic.Example.tsx     |  1 -
 .../examples/ActivityItem.Persona.Example.tsx   |  1 -
 .../ThemeGenerator/ThemeRulesStandard.ts        |  2 +-
 packages/utilities/src/object.ts                | 17 +++++++++++------
 6 files changed, 17 insertions(+), 14 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
index 841735570d23d..c0c54dda69ba8 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
@@ -89,8 +89,8 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
   private _onRenderComments(props: IActivityItemProps): JSX.Element | null {
     const comments = props.comments || props.commentText;
 
-    if (!props.isCompact && props.comments) {
-      return (<div className={ this._classNames.commentText }>{ props.comments }</div>);
+    if (!props.isCompact && comments) {
+      return (<div className={ this._classNames.commentText }>{ comments }</div>);
     }
 
     return null;
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItemPage.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItemPage.tsx
index 0005f85889bb8..0c9aa496db5d5 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItemPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItemPage.tsx
@@ -48,7 +48,7 @@ export class ActivityItemPage extends React.Component<IComponentDemoPageProps, {
           </div>
         }
         bestPractices={
-          <div></div>
+          <div />
         }
         dos={
           <div>
@@ -65,8 +65,8 @@ export class ActivityItemPage extends React.Component<IComponentDemoPageProps, {
             </ul>
           </div>
         }
-        isHeaderVisible={ this.props.isHeaderVisible }>
-      </ComponentPage>
+        isHeaderVisible={ this.props.isHeaderVisible }
+      />
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Basic.Example.tsx
index d525c7f96163d..6dcf90cbe4942 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Basic.Example.tsx
@@ -2,7 +2,6 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import { ActivityItem } from '../ActivityItem';
-import { TestImages } from '../../../common/TestImages';
 import { Icon } from '../../../Icon';
 import { Link } from '../../../Link';
 
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Persona.Example.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Persona.Example.tsx
index 2d9bd6518f578..2bd4c84d37b8c 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Persona.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Persona.Example.tsx
@@ -3,7 +3,6 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import { ActivityItem } from '../ActivityItem';
 import { TestImages } from '../../../common/TestImages';
-import { Icon } from '../../../Icon';
 import { Link } from '../../../Link';
 
 const activityItemExamples = [
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
index 40df2f017dd54..2f9ebd6741efd 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
@@ -71,7 +71,7 @@ export function themeRulesStandardCreator() {
     };
 
     // then make a rule for each shade of this base color, but skip unshaded
-    mapEnumByName(Shade, (shadeName: string, shadeValue) => {
+    mapEnumByName(Shade, (shadeName: string, shadeValue: Shade) => {
       if (shadeName === Shade[Shade.Unshaded]) {
         return;
       }
diff --git a/packages/utilities/src/object.ts b/packages/utilities/src/object.ts
index afacac55fe389..b75c40bf27bb9 100644
--- a/packages/utilities/src/object.ts
+++ b/packages/utilities/src/object.ts
@@ -94,11 +94,16 @@ export function getId(prefix?: string): string {
  * The callback takes as a first parameter the string that represents the name of the entry, and the second parameter is the
  * value of that entry, which is the value you'd normally use when using the enum (usually a number).
  * */
-export function mapEnumByName<T>(theEnum: any, callback: (name?: string, value?: any) => T | undefined): T[] | undefined {
+export function mapEnumByName<T>(
+  // tslint:disable-next-line:no-any
+  theEnum: any,
+  callback: (name?: string, value?: string | number) => T | undefined
+): (T | undefined)[] | undefined {
   // map<any> to satisfy compiler since it doesn't realize we strip out undefineds in the .filter() call
-  return Object.keys(theEnum).map<any>((p: string) => { // map on each property name as a string
-    if (String(Number(p)) !== p) { // if the property is not just a number (because enums in TypeScript will map both ways)
-      return callback(p, theEnum[p]);
-    }
-  }).filter((v: any) => !!v); // only return elements with values
+  return Object.keys(theEnum).map<T | undefined>(
+    (p: string | number) => { // map on each property name as a string
+      if (String(Number(p)) !== p) { // if the property is not just a number (because enums in TypeScript will map both ways)
+        return callback(p as string, theEnum[p]);
+      }
+    }).filter((v: T | undefined) => !!v); // only return elements with values
 }
\ No newline at end of file

From 8f3882c08165627ec4b0ddea1116ab00fd2e1f2f Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Fri, 22 Sep 2017 10:32:32 -0700
Subject: [PATCH 0700/1641] Visual bugs for website - round 4 (#2920)

* Left nav grandchildren indentation

* Resource page link color fix

* iOS + Angular pages  - added shared page styles for header spacing

* Button anchor example text color

* Added change file

* Testing build error

* Update Button.Anchor.Example.tsx
---
 .../fabric-website/src/components/Nav/Nav.module.scss |  1 +
 .../src/pages/Interstitials/AngularJSPage.tsx         |  3 ++-
 .../src/pages/Interstitials/FabricIOSPage.tsx         |  3 ++-
 .../src/pages/ResourcesPage/ResourcesPage.module.scss |  7 ++++---
 .../fabric-website/uhf-bugs-v4_2017-09-22-03-50.json  | 11 +++++++++++
 .../Button/examples/Button.Anchor.Example.tsx         |  3 ++-
 6 files changed, 22 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/uhf-bugs-v4_2017-09-22-03-50.json

diff --git a/apps/fabric-website/src/components/Nav/Nav.module.scss b/apps/fabric-website/src/components/Nav/Nav.module.scss
index 24eaa2eb3acb0..f6aa96b879caf 100644
--- a/apps/fabric-website/src/components/Nav/Nav.module.scss
+++ b/apps/fabric-website/src/components/Nav/Nav.module.scss
@@ -46,6 +46,7 @@ $nav-group-header-height: 40px;
 
     > .links {
       display: block;
+      @include ms-margin-left(8px);
     }
   }
 }
diff --git a/apps/fabric-website/src/pages/Interstitials/AngularJSPage.tsx b/apps/fabric-website/src/pages/Interstitials/AngularJSPage.tsx
index 74c4406510489..0f2371b9ef90e 100644
--- a/apps/fabric-website/src/pages/Interstitials/AngularJSPage.tsx
+++ b/apps/fabric-website/src/pages/Interstitials/AngularJSPage.tsx
@@ -2,11 +2,12 @@ import * as React from 'react';
 import { css } from 'office-ui-fabric-react/lib/Utilities';
 import * as stylesImport from './Interstitials.module.scss';
 const styles: any = stylesImport;
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class AngularJSPage extends React.Component<any, any> {
   public render() {
     return (
-      <div>
+      <div className={ pageStyles.basePage }>
         <div className={ styles.header }>
           <h1>ngOfficeUIFabric</h1>
           <span>A community-driven project that simplifies implementing Fabric in Angular-based apps</span>
diff --git a/apps/fabric-website/src/pages/Interstitials/FabricIOSPage.tsx b/apps/fabric-website/src/pages/Interstitials/FabricIOSPage.tsx
index 191551cf64ac7..a54ec3b47229e 100644
--- a/apps/fabric-website/src/pages/Interstitials/FabricIOSPage.tsx
+++ b/apps/fabric-website/src/pages/Interstitials/FabricIOSPage.tsx
@@ -1,11 +1,12 @@
 import * as React from 'react';
 import * as stylesImport from './Interstitials.module.scss';
 const styles: any = stylesImport;
+const pageStyles: any = require('../PageStyles.module.scss');
 
 export class FabricIOSPage extends React.Component<any, any> {
   public render() {
     return (
-      <div>
+      <div className={ pageStyles.basePage }>
         <div className={ styles.header }>
           <h1>Office UI Fabric iOS</h1>
           <span>The Office design language for iOS</span>
diff --git a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss
index 56ac6358f6101..e224f6fc3c83d 100644
--- a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss
+++ b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.module.scss
@@ -92,9 +92,10 @@
       width: 95%;
     }
 
-    .relatedLink {
-      color: $ms-color-themePrimary;
-    }
+  }
+
+  .relatedLink {
+    color: $ms-color-themePrimary;
   }
 
   p,
diff --git a/common/changes/@uifabric/fabric-website/uhf-bugs-v4_2017-09-22-03-50.json b/common/changes/@uifabric/fabric-website/uhf-bugs-v4_2017-09-22-03-50.json
new file mode 100644
index 0000000000000..0e738bbe1f49d
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/uhf-bugs-v4_2017-09-22-03-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Visual bug fixes.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
index 8028fd829f563..9e87573fd67d1 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
@@ -25,10 +25,11 @@ export class ButtonAnchorExample extends React.Component<IButtonProps, {}> {
           href='http://bing.com'
           target='_blank'
           title='Let us bing!'
+          style={ { color: '#ffffff' } }
         >
           Bing
         </PrimaryButton>
       </div >
     );
   }
-}
\ No newline at end of file
+}

From a6b7c4406534e85be448ed620b94ff3e7802e196 Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Fri, 22 Sep 2017 11:17:37 -0700
Subject: [PATCH 0701/1641] SplitButton: Fix menu rendering when splitbutton is
 disabled (#2910)

* Fix submenu rendering when splitbutton is disabled

* Run npm run change to explain fix

* Disable menu launch by not setting menuprops in the onClick handler

* Add pointer-events none to splitbutton menu disabled rule
---
 ...malozano-splitButtonDisabled_2017-09-21-01-31.json | 11 +++++++++++
 .../src/components/Button/BaseButton.tsx              |  1 -
 .../Button/SplitButton/SplitButton.styles.ts          |  3 ++-
 3 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/malozano-splitButtonDisabled_2017-09-21-01-31.json

diff --git a/common/changes/office-ui-fabric-react/malozano-splitButtonDisabled_2017-09-21-01-31.json b/common/changes/office-ui-fabric-react/malozano-splitButtonDisabled_2017-09-21-01-31.json
new file mode 100644
index 0000000000000..79e943cae566a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-splitButtonDisabled_2017-09-21-01-31.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SplitButton: Fix menu rendering when splitbutton is disabled",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index b6aae3822c822..72090c31beb56 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -386,7 +386,6 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   private _onToggleMenu(): void {
     const { menuProps } = this.props;
     let currentMenuProps = this.state.menuProps;
-
     this.setState({ menuProps: currentMenuProps ? null : menuProps });
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
index e8d4d397c5adf..83efcbe330227 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
@@ -41,7 +41,8 @@ export const getStyles = memoizeFunction((
     splitButtonMenuButtonDisabled: {
       ':hover': {
         cursor: 'default'
-      }
+      },
+      pointerEvents: 'none',
     },
 
     splitButtonFlexContainer: {

From 79df140f5e26af94aaeb4c64cd5848221ba37758 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Fri, 22 Sep 2017 11:55:40 -0700
Subject: [PATCH 0702/1641] Reordered ButtonPage and made some style changes to
 examples to match toolkit for website (#2926)

* "Any" tslint error

* ActivityItem jsx + unused variable errors

* Removed border on split button hover to match toolkit

* Reordered button page to give priority to toolkit buttons

* Split button height bug fix and naming adjustment

* Added change file

* resolved conflict
---
 .../button-updates-toolkit_2017-09-22-18-17.json     | 11 +++++++++++
 .../src/components/Button/ButtonPage.tsx             | 12 ++++++------
 .../src/components/Button/ButtonThemes.ts            |  6 ------
 .../Button/SplitButton/SplitButton.styles.ts         |  3 ---
 .../Button/examples/Button.Split.Example.tsx         |  3 ++-
 5 files changed, 19 insertions(+), 16 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/button-updates-toolkit_2017-09-22-18-17.json

diff --git a/common/changes/office-ui-fabric-react/button-updates-toolkit_2017-09-22-18-17.json b/common/changes/office-ui-fabric-react/button-updates-toolkit_2017-09-22-18-17.json
new file mode 100644
index 0000000000000..32564ece72e91
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/button-updates-toolkit_2017-09-22-18-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Reordered Buttons on ButtonPage and made some small style changes to match toolkit for website.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
index 59d664cc8e8cd..652c9d1962959 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
@@ -76,8 +76,8 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
             <ExampleCard title='Command Bar Button' code={ ButtonCommandBarExampleCode }>
               <ButtonCommandBarExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
-            <ExampleCard title='Action Button' code={ ButtonActionExampleCode }>
-              <ButtonActionExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
+            <ExampleCard title='Split Button' code={ ButtonSplitExampleCode }>
+              <ButtonSplitExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
             <ExampleCard title='Icon Button' code={ ButtonIconExampleCode }>
               <ButtonIconExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
@@ -85,6 +85,9 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
             <ExampleCard title='Contextual Menu Button' code={ ButtonContextualMenuExampleCode }>
               <ButtonContextualMenuExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
+            <ExampleCard title='Action Button' code={ ButtonActionExampleCode }>
+              <ButtonActionExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
+            </ExampleCard>
             <ExampleCard title='Button Like Anchor' code={ ButtonAnchorExampleCode }>
               <ButtonAnchorExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
@@ -94,10 +97,7 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
             <ExampleCard title='Button Swap with Focus State' code={ ButtonSwapExampleCode }>
               <ButtonSwapExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
-            <ExampleCard title='SplitButton' code={ ButtonSplitExampleCode }>
-              <ButtonSplitExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
-            </ExampleCard>
-            <ExampleCard title='' code={ ButtonSplitExampleCode }>
+            <ExampleCard title='Custom Split Button' code={ ButtonSplitExampleCode }>
               <ButtonSplitCustomExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
           </div>
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts b/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
index 81a43009ea5d5..b474c5d699190 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
@@ -30,9 +30,6 @@ export function standardStyles(theme: ITheme): IButtonStyles {
 
     // Split button styles
     splitButtonContainer: {
-      ':hover': {
-        borderColor: theme.palette.neutralLight
-      },
       ':focus': {
         borderColor: theme.palette.neutralDark
       }
@@ -105,9 +102,6 @@ export function primaryStyles(theme: ITheme): IButtonStyles {
 
     // Split button styles
     splitButtonContainer: {
-      ':hover': {
-        borderColor: theme.palette.neutralLight
-      },
       ':focus': {
         borderColor: theme.palette.neutralDark
       }
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
index 83efcbe330227..9259561005bd2 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
@@ -14,9 +14,6 @@ export const getStyles = memoizeFunction((
       position: 'relative',
       display: 'inline-block',
       border: '1px solid transparent',
-      ':hover': {
-        border: '1px solid'
-      },
       ':focus': {
         outline: 'none!important',
         border: '1px solid'
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
index be8c8913514b1..6c562ee105d25 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
@@ -22,6 +22,7 @@ export class ButtonSplitExample extends React.Component<IButtonProps, {}> {
             text='Create account'
             onClick={ () => alert('Clicked') }
             split={ true }
+            style={ { height: '32px' } }
             menuProps={ {
               items: [
                 {
@@ -80,7 +81,7 @@ export class ButtonSplitCustomExample extends React.Component<IButtonProps, {}>
 
     return (
       <div>
-        <Label>Custom Split button</Label>
+        <Label>Split button with icon and custom styles</Label>
         <IconButton
           data-automation-id='test'
           disabled={ disabled }

From a333587f591ef95142ca3fa3fb492b9be7de881e Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 22 Sep 2017 19:08:51 +0000
Subject: [PATCH 0703/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 24 ++++++++++
 apps/fabric-website/CHANGELOG.md              | 10 +++-
 apps/fabric-website/package.json              |  4 +-
 .../uhf-bugs-v3_2017-09-21-17-55.json         | 11 -----
 .../uhf-bugs-v4_2017-09-22-03-50.json         | 11 -----
 ...phkuo-themeGenerator_2017-09-19-02-27.json | 11 -----
 ...-onClicked-deprecate_2017-09-20-17-13.json | 11 -----
 ...ggestions-aria-label_2017-09-20-19-44.json | 11 -----
 ...-splitButtonDisabled_2017-09-21-01-31.json | 11 -----
 ...phkuo-themeGenerator_2017-09-19-02-27.json | 11 -----
 ...tivityitem-reactnode_2017-08-09-23-56.json | 11 -----
 ...boBox-contrastAdjust_2017-09-20-20-13.json | 11 -----
 packages/experiments/package.json             |  4 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 46 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 17 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 ++++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  2 +-
 20 files changed, 125 insertions(+), 110 deletions(-)
 delete mode 100644 common/changes/@uifabric/fabric-website/uhf-bugs-v3_2017-09-21-17-55.json
 delete mode 100644 common/changes/@uifabric/fabric-website/uhf-bugs-v4_2017-09-22-03-50.json
 delete mode 100644 common/changes/@uifabric/utilities/phkuo-themeGenerator_2017-09-19-02-27.json
 delete mode 100644 common/changes/office-ui-fabric-react/icon-onClicked-deprecate_2017-09-20-17-13.json
 delete mode 100644 common/changes/office-ui-fabric-react/joem-suggestions-aria-label_2017-09-20-19-44.json
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-splitButtonDisabled_2017-09-21-01-31.json
 delete mode 100644 common/changes/office-ui-fabric-react/phkuo-themeGenerator_2017-09-19-02-27.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-activityitem-reactnode_2017-08-09-23-56.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-comboBox-contrastAdjust_2017-09-20-20-13.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 1fb111beb8d9e..d984420577cf6 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.0.3",
+      "tag": "@uifabric/fabric-website_v5.0.3",
+      "date": "Fri, 22 Sep 2017 19:08:51 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "6812dbed7f05c698eb687bf7cf3d3481b4fe642b",
+            "comment": "Reinforced header tag styles across website pages to manage UHF counter-styles."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "8f3882c08165627ec4b0ddea1116ab00fd2e1f2f",
+            "comment": "Visual bug fixes."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=4.49.1 <5.0.0` to `>=4.50.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.2",
       "tag": "@uifabric/fabric-website_v5.0.2",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index d9413f3c2c6f6..52942b0e6c448 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Thu, 21 Sep 2017 06:23:58 GMT and should not be manually modified.
+This log was last generated on Fri, 22 Sep 2017 19:08:51 GMT and should not be manually modified.
+
+## 5.0.3
+Fri, 22 Sep 2017 19:08:51 GMT
+
+### Patches
+
+- Reinforced header tag styles across website pages to manage UHF counter-styles.
+- Visual bug fixes.
 
 ## 5.0.2
 Thu, 21 Sep 2017 06:23:58 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index e25f48f436299..55dab05186c5c 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.0.2",
+  "version": "5.0.3",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,7 +47,7 @@
     "@uifabric/example-app-base": ">=4.2.7 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=4.49.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.50.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/uhf-bugs-v3_2017-09-21-17-55.json b/common/changes/@uifabric/fabric-website/uhf-bugs-v3_2017-09-21-17-55.json
deleted file mode 100644
index 30d33467461f4..0000000000000
--- a/common/changes/@uifabric/fabric-website/uhf-bugs-v3_2017-09-21-17-55.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Reinforced header tag styles across website pages to manage UHF counter-styles.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/uhf-bugs-v4_2017-09-22-03-50.json b/common/changes/@uifabric/fabric-website/uhf-bugs-v4_2017-09-22-03-50.json
deleted file mode 100644
index 0e738bbe1f49d..0000000000000
--- a/common/changes/@uifabric/fabric-website/uhf-bugs-v4_2017-09-22-03-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Visual bug fixes.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/phkuo-themeGenerator_2017-09-19-02-27.json b/common/changes/@uifabric/utilities/phkuo-themeGenerator_2017-09-19-02-27.json
deleted file mode 100644
index 97e629a19f051..0000000000000
--- a/common/changes/@uifabric/utilities/phkuo-themeGenerator_2017-09-19-02-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Adding `mapEnumByName` helper.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "phkuo@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/icon-onClicked-deprecate_2017-09-20-17-13.json b/common/changes/office-ui-fabric-react/icon-onClicked-deprecate_2017-09-20-17-13.json
deleted file mode 100644
index 4e84a28f09a6a..0000000000000
--- a/common/changes/office-ui-fabric-react/icon-onClicked-deprecate_2017-09-20-17-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Icon: Removed a recently added prop `onClicked` as it is redundant with `onClick`. Updated DatePicker to use `onClick`.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/joem-suggestions-aria-label_2017-09-20-19-44.json b/common/changes/office-ui-fabric-react/joem-suggestions-aria-label_2017-09-20-19-44.json
deleted file mode 100644
index a445ceabd99a2..0000000000000
--- a/common/changes/office-ui-fabric-react/joem-suggestions-aria-label_2017-09-20-19-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Adds ARIA label prop for Suggestions component",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joem@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/malozano-splitButtonDisabled_2017-09-21-01-31.json b/common/changes/office-ui-fabric-react/malozano-splitButtonDisabled_2017-09-21-01-31.json
deleted file mode 100644
index 79e943cae566a..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-splitButtonDisabled_2017-09-21-01-31.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SplitButton: Fix menu rendering when splitbutton is disabled",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/phkuo-themeGenerator_2017-09-19-02-27.json b/common/changes/office-ui-fabric-react/phkuo-themeGenerator_2017-09-19-02-27.json
deleted file mode 100644
index 1ddeadd293ff5..0000000000000
--- a/common/changes/office-ui-fabric-react/phkuo-themeGenerator_2017-09-19-02-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Create Theme Generator page",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-activityitem-reactnode_2017-08-09-23-56.json b/common/changes/office-ui-fabric-react/v-krbrow-activityitem-reactnode_2017-08-09-23-56.json
deleted file mode 100644
index 8d1c78ed8a77e..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-activityitem-reactnode_2017-08-09-23-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ActivityItem: Adding ReactNodes in the interface in addition to the IRenderFunction props.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-comboBox-contrastAdjust_2017-09-20-20-13.json b/common/changes/office-ui-fabric-react/v-krbrow-comboBox-contrastAdjust_2017-09-20-20-13.json
deleted file mode 100644
index ffcb14badc78c..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-comboBox-contrastAdjust_2017-09-20-20-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Changing high-contrast styles to use msHighContrastAdjust",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 3b29d718febd8..3e2785e594b38 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -42,8 +42,8 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/styling": ">=0.24.0 <1.0.0",
-    "@uifabric/utilities": ">=4.13.1 <5.0.0",
-    "office-ui-fabric-react": ">=4.49.1 <5.0.0",
+    "@uifabric/utilities": ">=4.14.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.50.0 <5.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 1053ab5ce7002..dcd8d78cbc49c 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,52 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.50.0",
+      "tag": "office-ui-fabric-react_v4.50.0",
+      "date": "Fri, 22 Sep 2017 19:08:51 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "27237524ac78279420c93e0e07d65b44dc5547da",
+            "comment": "Icon: Removed a recently added prop `onClicked` as it is redundant with `onClick`. Updated DatePicker to use `onClick`."
+          },
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "7d3a64d4aa3c5b473bae8a3b817a7ef753d9fecd",
+            "comment": "Create Theme Generator page"
+          },
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "78b9c5e3836b49abecf5fad31884c6118ba4f3c7",
+            "comment": "ActivityItem: Adding ReactNodes in the interface in addition to the IRenderFunction props."
+          }
+        ],
+        "patch": [
+          {
+            "author": "Joe Martella <martellaj@live.com>",
+            "commit": "67a34e0856d57d168f6cbf3acab6987eef56974f",
+            "comment": "Adds ARIA label prop for Suggestions component"
+          },
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "a6b7c4406534e85be448ed620b94ff3e7802e196",
+            "comment": "SplitButton: Fix menu rendering when splitbutton is disabled"
+          },
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "58f501874002d23a5fd7a4f54e250e92ea276d94",
+            "comment": "ComboBox: Changing high-contrast styles to use msHighContrastAdjust"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.13.1 <5.0.0` to `>=4.14.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.49.1",
       "tag": "office-ui-fabric-react_v4.49.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 80192ab7d4c8d..1ff78879d35b1 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,21 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 21 Sep 2017 06:23:58 GMT and should not be manually modified.
+This log was last generated on Fri, 22 Sep 2017 19:08:51 GMT and should not be manually modified.
+
+## 4.50.0
+Fri, 22 Sep 2017 19:08:51 GMT
+
+### Minor changes
+
+- Icon: Removed a recently added prop `onClicked` as it is redundant with `onClick`. Updated DatePicker to use `onClick`.
+- Create Theme Generator page
+- ActivityItem: Adding ReactNodes in the interface in addition to the IRenderFunction props.
+
+### Patches
+
+- Adds ARIA label prop for Suggestions component
+- SplitButton: Fix menu rendering when splitbutton is disabled
+- ComboBox: Changing high-contrast styles to use msHighContrastAdjust
 
 ## 4.49.1
 Thu, 21 Sep 2017 06:23:58 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index be883fb077971..14046abd3de09 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.49.1",
+  "version": "4.50.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=4.13.1 <5.0.0",
+    "@uifabric/utilities": ">=4.14.0 <5.0.0",
     "@uifabric/styling": ">=0.24.0 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 652529e4d3424..2df37104d5e8b 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -28,7 +28,7 @@
     "react-dom": "^15.4.2"
   },
   "dependencies": {
-    "@uifabric/utilities": ">=4.13.1 <5.0.0",
+    "@uifabric/utilities": ">=4.14.0 <5.0.0",
     "tslib": "^1.7.1",
     "rtl-css-js": "^1.1.3",
     "glamor": "^2.20.40"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 5f7e80465088c..00d0e04d1f290 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.14.0",
+      "tag": "@uifabric/utilities_v4.14.0",
+      "date": "Fri, 22 Sep 2017 19:08:51 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "7d3a64d4aa3c5b473bae8a3b817a7ef753d9fecd",
+            "comment": "Adding `mapEnumByName` helper."
+          }
+        ]
+      }
+    },
     {
       "version": "4.13.1",
       "tag": "@uifabric/utilities_v4.13.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 7d6d73102baf4..b5f9ad6e75d70 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Thu, 14 Sep 2017 00:34:57 GMT and should not be manually modified.
+This log was last generated on Fri, 22 Sep 2017 19:08:51 GMT and should not be manually modified.
+
+## 4.14.0
+Fri, 22 Sep 2017 19:08:51 GMT
+
+### Minor changes
+
+- Adding `mapEnumByName` helper.
 
 ## 4.13.1
 Thu, 14 Sep 2017 00:34:57 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 0c84c6cf47695..22238705cf2b9 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.13.1",
+  "version": "4.14.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From a236776eaf98cb829fe4bd22618b34f8154681a8 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 22 Sep 2017 12:57:58 -0700
Subject: [PATCH 0704/1641] Shrinkwrap updated.

---
 common/config/rush/npm-shrinkwrap.json | 2193 ++++++++++++------------
 1 file changed, 1052 insertions(+), 1141 deletions(-)

diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 78b15c89171c4..aa5dca93440a6 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -9,38 +9,17 @@
       "integrity": "sha1-6pn2EhtKjwZbTHH4VZXbJxRJiAc="
     },
     "@microsoft/load-themed-styles": {
-      "version": "1.7.4",
-      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.4.tgz",
-      "integrity": "sha1-3SU9gMgiCRPSerBu5WxLLsRR89M="
+      "version": "1.7.5",
+      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.5.tgz",
+      "integrity": "sha1-KlXL2LP1TOy9I2ycP93AvBNWu8k="
     },
     "@microsoft/loader-load-themed-styles": {
-      "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.5.1.tgz",
-      "integrity": "sha1-Y1VyRApbBFYM35zrC7OKTVbGSfQ="
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.6.0.tgz",
+      "integrity": "sha1-apeiLzpi5UwLUwo+jxSYrSuE19w="
     },
     "@rush-temp/build": {
-      "version": "file:projects\\build",
-      "dependencies": {
-        "autoprefixer": {
-          "version": "7.1.2",
-          "bundled": true
-        },
-        "browserslist": {
-          "version": "2.3.3",
-          "bundled": true
-        },
-        "semver": {
-          "version": "5.4.1",
-          "bundled": true
-        },
-        "tslint": {
-          "version": "5.6.0",
-          "bundled": true
-        }
-      }
-    },
-    "@rush-temp/example-app-base": {
-      "version": "file:projects\\example-app-base",
+      "version": "file:projects/build",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -58,17 +37,47 @@
           "version": "3.0.0",
           "bundled": true
         },
+        "ansi-styles": {
+          "version": "2.2.1",
+          "bundled": true
+        },
         "async": {
           "version": "2.5.0",
           "bundled": true
         },
+        "autoprefixer": {
+          "version": "7.1.2",
+          "bundled": true
+        },
+        "browserslist": {
+          "version": "2.3.3",
+          "bundled": true
+        },
         "camelcase": {
           "version": "4.1.0",
           "bundled": true
         },
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true
+        "cliui": {
+          "version": "3.2.0",
+          "bundled": true,
+          "dependencies": {
+            "ansi-regex": {
+              "version": "2.1.1",
+              "bundled": true
+            },
+            "is-fullwidth-code-point": {
+              "version": "1.0.0",
+              "bundled": true
+            },
+            "string-width": {
+              "version": "1.0.2",
+              "bundled": true
+            },
+            "strip-ansi": {
+              "version": "3.0.1",
+              "bundled": true
+            }
+          }
         },
         "constants-browserify": {
           "version": "1.0.0",
@@ -78,30 +87,68 @@
           "version": "3.11.1",
           "bundled": true
         },
-        "debug": {
-          "version": "2.6.8",
+        "css-loader": {
+          "version": "0.28.5",
           "bundled": true,
           "dependencies": {
-            "ms": {
-              "version": "2.0.0",
+            "ansi-regex": {
+              "version": "2.1.1",
+              "bundled": true
+            },
+            "chalk": {
+              "version": "1.1.3",
+              "bundled": true,
+              "dependencies": {
+                "supports-color": {
+                  "version": "2.0.0",
+                  "bundled": true
+                }
+              }
+            },
+            "has-flag": {
+              "version": "1.0.0",
+              "bundled": true
+            },
+            "postcss": {
+              "version": "5.2.17",
+              "bundled": true
+            },
+            "strip-ansi": {
+              "version": "3.0.1",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "3.2.3",
               "bundled": true
             }
           }
         },
-        "diff": {
-          "version": "3.2.0",
+        "debug": {
+          "version": "2.6.8",
           "bundled": true
         },
         "enhanced-resolve": {
           "version": "3.4.1",
           "bundled": true
         },
+        "etag": {
+          "version": "1.8.0",
+          "bundled": true
+        },
+        "express": {
+          "version": "4.15.4",
+          "bundled": true
+        },
         "find-up": {
           "version": "2.1.0",
           "bundled": true
         },
-        "glob": {
-          "version": "7.1.1",
+        "fresh": {
+          "version": "0.5.0",
+          "bundled": true
+        },
+        "has-flag": {
+          "version": "2.0.0",
           "bundled": true
         },
         "https-browserify": {
@@ -124,12 +171,12 @@
           "version": "1.1.0",
           "bundled": true
         },
-        "mocha": {
-          "version": "3.5.0",
+        "lodash.camelcase": {
+          "version": "4.3.0",
           "bundled": true
         },
-        "ms": {
-          "version": "0.7.2",
+        "mime": {
+          "version": "1.3.4",
           "bundled": true
         },
         "node-libs-browser": {
@@ -144,10 +191,22 @@
           "version": "2.1.0",
           "bundled": true
         },
+        "path-to-regexp": {
+          "version": "0.1.7",
+          "bundled": true
+        },
         "path-type": {
           "version": "2.0.0",
           "bundled": true
         },
+        "pify": {
+          "version": "2.3.0",
+          "bundled": true
+        },
+        "qs": {
+          "version": "6.5.0",
+          "bundled": true
+        },
         "read-pkg": {
           "version": "2.0.0",
           "bundled": true
@@ -166,32 +225,30 @@
             }
           }
         },
-        "source-list-map": {
-          "version": "2.0.0",
+        "semver": {
+          "version": "5.4.1",
           "bundled": true
         },
-        "source-map": {
-          "version": "0.1.43",
+        "send": {
+          "version": "0.15.4",
           "bundled": true
         },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "0.9.2",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "0.2.17",
-              "bundled": true
-            }
-          }
+        "serve-static": {
+          "version": "1.12.4",
+          "bundled": true
+        },
+        "source-list-map": {
+          "version": "2.0.0",
+          "bundled": true
         },
         "stream-browserify": {
           "version": "2.0.1",
           "bundled": true
         },
+        "string_decoder": {
+          "version": "0.10.31",
+          "bundled": true
+        },
         "string-width": {
           "version": "2.1.1",
           "bundled": true
@@ -205,7 +262,7 @@
           "bundled": true
         },
         "supports-color": {
-          "version": "3.1.2",
+          "version": "4.2.1",
           "bundled": true
         },
         "tapable": {
@@ -216,6 +273,14 @@
           "version": "2.0.4",
           "bundled": true
         },
+        "tslint": {
+          "version": "5.6.0",
+          "bundled": true
+        },
+        "ultron": {
+          "version": "1.1.0",
+          "bundled": true
+        },
         "url": {
           "version": "0.11.0",
           "bundled": true,
@@ -226,59 +291,67 @@
             }
           }
         },
+        "utils-merge": {
+          "version": "1.0.0",
+          "bundled": true
+        },
         "watchpack": {
           "version": "1.4.0",
+          "bundled": true
+        },
+        "webpack": {
+          "version": "3.5.5",
           "bundled": true,
           "dependencies": {
-            "async": {
-              "version": "2.5.0",
+            "yargs": {
+              "version": "8.0.2",
               "bundled": true
             }
           }
         },
-        "webpack": {
-          "version": "3.5.5",
+        "webpack-bundle-analyzer": {
+          "version": "2.9.0",
           "bundled": true,
           "dependencies": {
-            "async": {
-              "version": "2.5.0",
+            "ansi-regex": {
+              "version": "2.1.1",
               "bundled": true
             },
-            "has-flag": {
-              "version": "2.0.0",
+            "chalk": {
+              "version": "1.1.3",
               "bundled": true
             },
-            "loader-utils": {
-              "version": "1.1.0",
+            "lodash": {
+              "version": "4.17.4",
               "bundled": true
             },
-            "source-map": {
-              "version": "0.5.6",
+            "strip-ansi": {
+              "version": "3.0.1",
               "bundled": true
             },
             "supports-color": {
-              "version": "4.2.1",
+              "version": "2.0.0",
               "bundled": true
             }
           }
         },
         "webpack-sources": {
           "version": "1.0.1",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            }
-          }
+          "bundled": true
         },
         "which-module": {
           "version": "2.0.0",
           "bundled": true
         },
-        "yargs": {
-          "version": "8.0.2",
-          "bundled": true
+        "ws": {
+          "version": "2.3.1",
+          "bundled": true,
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "bundled": true
+            }
+          }
         },
         "yargs-parser": {
           "version": "7.0.0",
@@ -286,8 +359,8 @@
         }
       }
     },
-    "@rush-temp/experiments": {
-      "version": "file:projects\\experiments",
+    "@rush-temp/example-app-base": {
+      "version": "file:projects/example-app-base",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -309,14 +382,6 @@
           "version": "2.5.0",
           "bundled": true
         },
-        "autoprefixer": {
-          "version": "6.7.7",
-          "bundled": true
-        },
-        "browserslist": {
-          "version": "1.7.7",
-          "bundled": true
-        },
         "camelcase": {
           "version": "4.1.0",
           "bundled": true
@@ -351,9 +416,19 @@
           "version": "3.11.1",
           "bundled": true
         },
+        "css-loader": {
+          "version": "0.28.5",
+          "bundled": true
+        },
         "debug": {
           "version": "2.6.8",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "ms": {
+              "version": "2.0.0",
+              "bundled": true
+            }
+          }
         },
         "diff": {
           "version": "3.2.0",
@@ -391,10 +466,18 @@
           "version": "1.1.0",
           "bundled": true
         },
+        "lodash.camelcase": {
+          "version": "4.3.0",
+          "bundled": true
+        },
         "mocha": {
           "version": "3.5.0",
           "bundled": true
         },
+        "ms": {
+          "version": "0.7.2",
+          "bundled": true
+        },
         "node-libs-browser": {
           "version": "2.0.0",
           "bundled": true
@@ -439,14 +522,28 @@
             }
           }
         },
-        "sinon": {
-          "version": "2.4.1",
-          "bundled": true
-        },
         "source-list-map": {
           "version": "2.0.0",
           "bundled": true
         },
+        "source-map": {
+          "version": "0.1.43",
+          "bundled": true
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "0.9.2",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "0.2.17",
+              "bundled": true
+            }
+          }
+        },
         "stream-browserify": {
           "version": "2.0.1",
           "bundled": true
@@ -463,6 +560,10 @@
           "version": "3.0.0",
           "bundled": true
         },
+        "style-loader": {
+          "version": "0.17.0",
+          "bundled": true
+        },
         "supports-color": {
           "version": "3.1.2",
           "bundled": true
@@ -487,16 +588,34 @@
         },
         "watchpack": {
           "version": "1.4.0",
-          "bundled": true
-        },
-        "webpack": {
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            }
+          }
+        },
+        "webpack": {
           "version": "3.5.5",
           "bundled": true,
           "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            },
             "has-flag": {
               "version": "2.0.0",
               "bundled": true
             },
+            "loader-utils": {
+              "version": "1.1.0",
+              "bundled": true
+            },
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            },
             "supports-color": {
               "version": "4.2.1",
               "bundled": true
@@ -505,7 +624,13 @@
         },
         "webpack-sources": {
           "version": "1.0.1",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
         },
         "which-module": {
           "version": "2.0.0",
@@ -521,13 +646,9 @@
         }
       }
     },
-    "@rush-temp/fabric-website": {
-      "version": "file:projects\\fabric-website",
+    "@rush-temp/experiments": {
+      "version": "file:projects/experiments",
       "dependencies": {
-        "@types/react-addons-test-utils": {
-          "version": "0.14.19",
-          "bundled": true
-        },
         "acorn": {
           "version": "5.1.1",
           "bundled": true
@@ -590,6 +711,10 @@
           "version": "3.11.1",
           "bundled": true
         },
+        "css-loader": {
+          "version": "0.28.5",
+          "bundled": true
+        },
         "debug": {
           "version": "2.6.8",
           "bundled": true
@@ -630,6 +755,10 @@
           "version": "1.1.0",
           "bundled": true
         },
+        "lodash.camelcase": {
+          "version": "4.3.0",
+          "bundled": true
+        },
         "mocha": {
           "version": "3.5.0",
           "bundled": true
@@ -654,26 +783,14 @@
           "version": "5.2.17",
           "bundled": true,
           "dependencies": {
-            "source-map": {
-              "version": "0.5.7",
-              "bundled": true
-            },
             "supports-color": {
               "version": "3.2.3",
               "bundled": true
             }
           }
         },
-        "react": {
-          "version": "15.6.1",
-          "bundled": true
-        },
-        "react-dom": {
-          "version": "15.6.1",
-          "bundled": true
-        },
-        "react-highlight": {
-          "version": "0.9.0",
+        "postcss-loader": {
+          "version": "1.3.3",
           "bundled": true
         },
         "read-pkg": {
@@ -702,24 +819,6 @@
           "version": "2.0.0",
           "bundled": true
         },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "0.9.2",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "0.2.17",
-              "bundled": true
-            }
-          }
-        },
         "stream-browserify": {
           "version": "2.0.1",
           "bundled": true
@@ -736,6 +835,10 @@
           "version": "3.0.0",
           "bundled": true
         },
+        "style-loader": {
+          "version": "0.17.0",
+          "bundled": true
+        },
         "supports-color": {
           "version": "3.1.2",
           "bundled": true
@@ -760,61 +863,25 @@
         },
         "watchpack": {
           "version": "1.4.0",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            }
-          }
+          "bundled": true
         },
         "webpack": {
           "version": "3.5.5",
           "bundled": true,
           "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            },
-            "camelcase": {
-              "version": "4.1.0",
-              "bundled": true
-            },
             "has-flag": {
               "version": "2.0.0",
               "bundled": true
             },
-            "loader-utils": {
-              "version": "1.1.0",
-              "bundled": true
-            },
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            },
             "supports-color": {
               "version": "4.2.1",
               "bundled": true
-            },
-            "yargs": {
-              "version": "8.0.2",
-              "bundled": true
-            },
-            "yargs-parser": {
-              "version": "7.0.0",
-              "bundled": true
             }
           }
         },
         "webpack-sources": {
           "version": "1.0.1",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            }
-          }
+          "bundled": true
         },
         "which-module": {
           "version": "2.0.0",
@@ -830,38 +897,13 @@
         }
       }
     },
-    "@rush-temp/merge-styles": {
-      "version": "file:projects\\merge-styles",
+    "@rush-temp/fabric-website": {
+      "version": "file:projects/fabric-website",
       "dependencies": {
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true
-        },
-        "diff": {
-          "version": "3.2.0",
-          "bundled": true
-        },
-        "glob": {
-          "version": "7.1.1",
-          "bundled": true
-        },
-        "mocha": {
-          "version": "3.5.0",
+        "@types/react-addons-test-utils": {
+          "version": "0.14.19",
           "bundled": true
         },
-        "supports-color": {
-          "version": "3.1.2",
-          "bundled": true
-        }
-      }
-    },
-    "@rush-temp/office-ui-fabric-react": {
-      "version": "file:projects\\office-ui-fabric-react",
-      "dependencies": {
         "acorn": {
           "version": "5.1.1",
           "bundled": true
@@ -924,6 +966,10 @@
           "version": "3.11.1",
           "bundled": true
         },
+        "css-loader": {
+          "version": "0.28.5",
+          "bundled": true
+        },
         "debug": {
           "version": "2.6.8",
           "bundled": true
@@ -964,6 +1010,10 @@
           "version": "1.1.0",
           "bundled": true
         },
+        "lodash.camelcase": {
+          "version": "4.3.0",
+          "bundled": true
+        },
         "mocha": {
           "version": "3.5.0",
           "bundled": true
@@ -998,6 +1048,22 @@
             }
           }
         },
+        "postcss-loader": {
+          "version": "1.3.3",
+          "bundled": true
+        },
+        "react": {
+          "version": "15.6.1",
+          "bundled": true
+        },
+        "react-dom": {
+          "version": "15.6.1",
+          "bundled": true
+        },
+        "react-highlight": {
+          "version": "0.9.0",
+          "bundled": true
+        },
         "read-pkg": {
           "version": "2.0.0",
           "bundled": true
@@ -1098,6 +1164,10 @@
               "version": "2.5.0",
               "bundled": true
             },
+            "camelcase": {
+              "version": "4.1.0",
+              "bundled": true
+            },
             "has-flag": {
               "version": "2.0.0",
               "bundled": true
@@ -1113,6 +1183,14 @@
             "supports-color": {
               "version": "4.2.1",
               "bundled": true
+            },
+            "yargs": {
+              "version": "8.0.2",
+              "bundled": true
+            },
+            "yargs-parser": {
+              "version": "7.0.0",
+              "bundled": true
             }
           }
         },
@@ -1140,11 +1218,37 @@
         }
       }
     },
-    "@rush-temp/office-ui-fabric-react-tslint": {
-      "version": "file:projects\\office-ui-fabric-react-tslint"
+    "@rush-temp/merge-styles": {
+      "version": "file:projects/merge-styles",
+      "dependencies": {
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
+        "debug": {
+          "version": "2.6.8",
+          "bundled": true
+        },
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
+        },
+        "glob": {
+          "version": "7.1.1",
+          "bundled": true
+        },
+        "mocha": {
+          "version": "3.5.0",
+          "bundled": true
+        },
+        "supports-color": {
+          "version": "3.1.2",
+          "bundled": true
+        }
+      }
     },
-    "@rush-temp/ssr-tests": {
-      "version": "file:projects\\ssr-tests",
+    "@rush-temp/office-ui-fabric-react": {
+      "version": "file:projects/office-ui-fabric-react",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1166,29 +1270,33 @@
           "version": "2.5.0",
           "bundled": true
         },
+        "autoprefixer": {
+          "version": "6.7.7",
+          "bundled": true
+        },
+        "browserslist": {
+          "version": "1.7.7",
+          "bundled": true
+        },
         "camelcase": {
           "version": "4.1.0",
           "bundled": true
         },
-        "cliui": {
-          "version": "3.2.0",
+        "chalk": {
+          "version": "1.1.3",
           "bundled": true,
           "dependencies": {
             "ansi-regex": {
               "version": "2.1.1",
               "bundled": true
             },
-            "is-fullwidth-code-point": {
-              "version": "1.0.0",
-              "bundled": true
-            },
-            "string-width": {
-              "version": "1.0.2",
-              "bundled": true
-            },
             "strip-ansi": {
               "version": "3.0.1",
               "bundled": true
+            },
+            "supports-color": {
+              "version": "2.0.0",
+              "bundled": true
             }
           }
         },
@@ -1204,8 +1312,12 @@
           "version": "3.11.1",
           "bundled": true
         },
+        "css-loader": {
+          "version": "0.28.5",
+          "bundled": true
+        },
         "debug": {
-          "version": "2.6.0",
+          "version": "2.6.8",
           "bundled": true
         },
         "diff": {
@@ -1224,10 +1336,6 @@
           "version": "7.1.1",
           "bundled": true
         },
-        "has-flag": {
-          "version": "1.0.0",
-          "bundled": true
-        },
         "https-browserify": {
           "version": "0.0.1",
           "bundled": true
@@ -1248,12 +1356,12 @@
           "version": "1.1.0",
           "bundled": true
         },
-        "mocha": {
-          "version": "3.3.0",
+        "lodash.camelcase": {
+          "version": "4.3.0",
           "bundled": true
         },
-        "ms": {
-          "version": "0.7.2",
+        "mocha": {
+          "version": "3.5.0",
           "bundled": true
         },
         "node-libs-browser": {
@@ -1272,12 +1380,26 @@
           "version": "2.0.0",
           "bundled": true
         },
-        "pify": {
-          "version": "2.3.0",
-          "bundled": true
-        },
-        "read-pkg": {
-          "version": "2.0.0",
+        "postcss": {
+          "version": "5.2.17",
+          "bundled": true,
+          "dependencies": {
+            "source-map": {
+              "version": "0.5.7",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "3.2.3",
+              "bundled": true
+            }
+          }
+        },
+        "postcss-loader": {
+          "version": "1.3.3",
+          "bundled": true
+        },
+        "read-pkg": {
+          "version": "2.0.0",
           "bundled": true
         },
         "read-pkg-up": {
@@ -1294,16 +1416,34 @@
             }
           }
         },
+        "sinon": {
+          "version": "2.4.1",
+          "bundled": true
+        },
         "source-list-map": {
           "version": "2.0.0",
           "bundled": true
         },
-        "stream-browserify": {
-          "version": "2.0.1",
+        "source-map": {
+          "version": "0.1.43",
           "bundled": true
         },
-        "string_decoder": {
-          "version": "0.10.31",
+        "source-map-loader": {
+          "version": "0.2.1",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "0.9.2",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "0.2.17",
+              "bundled": true
+            }
+          }
+        },
+        "stream-browserify": {
+          "version": "2.0.1",
           "bundled": true
         },
         "string-width": {
@@ -1318,6 +1458,10 @@
           "version": "3.0.0",
           "bundled": true
         },
+        "style-loader": {
+          "version": "0.17.0",
+          "bundled": true
+        },
         "supports-color": {
           "version": "3.1.2",
           "bundled": true
@@ -1342,16 +1486,34 @@
         },
         "watchpack": {
           "version": "1.4.0",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            }
+          }
         },
         "webpack": {
           "version": "3.5.5",
           "bundled": true,
           "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            },
             "has-flag": {
               "version": "2.0.0",
               "bundled": true
             },
+            "loader-utils": {
+              "version": "1.1.0",
+              "bundled": true
+            },
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            },
             "supports-color": {
               "version": "4.2.1",
               "bundled": true
@@ -1360,7 +1522,13 @@
         },
         "webpack-sources": {
           "version": "1.0.1",
-          "bundled": true
+          "bundled": true,
+          "dependencies": {
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
         },
         "which-module": {
           "version": "2.0.0",
@@ -1376,8 +1544,11 @@
         }
       }
     },
-    "@rush-temp/styling": {
-      "version": "file:projects\\styling",
+    "@rush-temp/office-ui-fabric-react-tslint": {
+      "version": "file:projects/office-ui-fabric-react-tslint"
+    },
+    "@rush-temp/ssr-tests": {
+      "version": "file:projects/ssr-tests",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1403,6 +1574,28 @@
           "version": "4.1.0",
           "bundled": true
         },
+        "cliui": {
+          "version": "3.2.0",
+          "bundled": true,
+          "dependencies": {
+            "ansi-regex": {
+              "version": "2.1.1",
+              "bundled": true
+            },
+            "is-fullwidth-code-point": {
+              "version": "1.0.0",
+              "bundled": true
+            },
+            "string-width": {
+              "version": "1.0.2",
+              "bundled": true
+            },
+            "strip-ansi": {
+              "version": "3.0.1",
+              "bundled": true
+            }
+          }
+        },
         "commander": {
           "version": "2.9.0",
           "bundled": true
@@ -1416,7 +1609,7 @@
           "bundled": true
         },
         "debug": {
-          "version": "2.6.8",
+          "version": "2.6.0",
           "bundled": true
         },
         "diff": {
@@ -1435,6 +1628,10 @@
           "version": "7.1.1",
           "bundled": true
         },
+        "has-flag": {
+          "version": "1.0.0",
+          "bundled": true
+        },
         "https-browserify": {
           "version": "0.0.1",
           "bundled": true
@@ -1456,7 +1653,11 @@
           "bundled": true
         },
         "mocha": {
-          "version": "3.5.0",
+          "version": "3.3.0",
+          "bundled": true
+        },
+        "ms": {
+          "version": "0.7.2",
           "bundled": true
         },
         "node-libs-browser": {
@@ -1475,6 +1676,10 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "pify": {
+          "version": "2.3.0",
+          "bundled": true
+        },
         "read-pkg": {
           "version": "2.0.0",
           "bundled": true
@@ -1497,28 +1702,14 @@
           "version": "2.0.0",
           "bundled": true
         },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "0.9.2",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "0.2.17",
-              "bundled": true
-            }
-          }
-        },
         "stream-browserify": {
           "version": "2.0.1",
           "bundled": true
         },
+        "string_decoder": {
+          "version": "0.10.31",
+          "bundled": true
+        },
         "string-width": {
           "version": "2.1.1",
           "bundled": true
@@ -1555,34 +1746,16 @@
         },
         "watchpack": {
           "version": "1.4.0",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            }
-          }
+          "bundled": true
         },
         "webpack": {
           "version": "3.5.5",
           "bundled": true,
           "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            },
             "has-flag": {
               "version": "2.0.0",
               "bundled": true
             },
-            "loader-utils": {
-              "version": "1.1.0",
-              "bundled": true
-            },
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            },
             "supports-color": {
               "version": "4.2.1",
               "bundled": true
@@ -1591,13 +1764,7 @@
         },
         "webpack-sources": {
           "version": "1.0.1",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            }
-          }
+          "bundled": true
         },
         "which-module": {
           "version": "2.0.0",
@@ -1613,8 +1780,8 @@
         }
       }
     },
-    "@rush-temp/test-bundle-button": {
-      "version": "file:projects\\test-bundle-button",
+    "@rush-temp/styling": {
+      "version": "file:projects/styling",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1640,6 +1807,10 @@
           "version": "4.1.0",
           "bundled": true
         },
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
         "constants-browserify": {
           "version": "1.0.0",
           "bundled": true
@@ -1648,6 +1819,14 @@
           "version": "3.11.1",
           "bundled": true
         },
+        "debug": {
+          "version": "2.6.8",
+          "bundled": true
+        },
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
+        },
         "enhanced-resolve": {
           "version": "3.4.1",
           "bundled": true
@@ -1656,8 +1835,8 @@
           "version": "2.1.0",
           "bundled": true
         },
-        "has-flag": {
-          "version": "2.0.0",
+        "glob": {
+          "version": "7.1.1",
           "bundled": true
         },
         "https-browserify": {
@@ -1680,6 +1859,10 @@
           "version": "1.1.0",
           "bundled": true
         },
+        "mocha": {
+          "version": "3.5.0",
+          "bundled": true
+        },
         "node-libs-browser": {
           "version": "2.0.0",
           "bundled": true
@@ -1753,7 +1936,7 @@
           "bundled": true
         },
         "supports-color": {
-          "version": "4.2.1",
+          "version": "3.1.2",
           "bundled": true
         },
         "tapable": {
@@ -1792,6 +1975,10 @@
               "version": "2.5.0",
               "bundled": true
             },
+            "has-flag": {
+              "version": "2.0.0",
+              "bundled": true
+            },
             "loader-utils": {
               "version": "1.1.0",
               "bundled": true
@@ -1799,6 +1986,10 @@
             "source-map": {
               "version": "0.5.6",
               "bundled": true
+            },
+            "supports-color": {
+              "version": "4.2.1",
+              "bundled": true
             }
           }
         },
@@ -1826,66 +2017,279 @@
         }
       }
     },
-    "@rush-temp/todo-app": {
-      "version": "file:projects\\todo-app"
-    },
-    "@rush-temp/utilities": {
-      "version": "file:projects\\utilities",
+    "@rush-temp/test-bundle-button": {
+      "version": "file:projects/test-bundle-button",
       "dependencies": {
-        "async": {
-          "version": "0.9.2",
+        "acorn": {
+          "version": "5.1.1",
           "bundled": true
         },
-        "commander": {
-          "version": "2.9.0",
+        "ajv": {
+          "version": "5.2.2",
           "bundled": true
         },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true,
-          "dependencies": {
-            "ms": {
-              "version": "2.0.0",
-              "bundled": true
-            }
-          }
-        },
-        "diff": {
-          "version": "3.2.0",
+        "ajv-keywords": {
+          "version": "2.1.0",
           "bundled": true
         },
-        "glob": {
-          "version": "7.1.1",
+        "ansi-regex": {
+          "version": "3.0.0",
           "bundled": true
         },
-        "mocha": {
-          "version": "3.5.0",
+        "async": {
+          "version": "2.5.0",
           "bundled": true
         },
-        "ms": {
-          "version": "0.7.2",
+        "camelcase": {
+          "version": "4.1.0",
           "bundled": true
         },
-        "sinon": {
-          "version": "2.4.1",
+        "constants-browserify": {
+          "version": "1.0.0",
           "bundled": true
         },
-        "source-map": {
-          "version": "0.1.43",
+        "crypto-browserify": {
+          "version": "3.11.1",
           "bundled": true
         },
-        "source-map-loader": {
-          "version": "0.2.1",
+        "enhanced-resolve": {
+          "version": "3.4.1",
           "bundled": true
         },
-        "supports-color": {
-          "version": "3.1.2",
+        "find-up": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "has-flag": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "https-browserify": {
+          "version": "0.0.1",
+          "bundled": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "load-json-file": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "loader-utils": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "node-libs-browser": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "os-browserify": {
+          "version": "0.2.1",
+          "bundled": true
+        },
+        "os-locale": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "path-type": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg-up": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "readable-stream": {
+          "version": "2.3.3",
+          "bundled": true,
+          "dependencies": {
+            "string_decoder": {
+              "version": "1.0.3",
+              "bundled": true
+            }
+          }
+        },
+        "source-list-map": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "source-map": {
+          "version": "0.1.43",
+          "bundled": true
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "0.9.2",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "0.2.17",
+              "bundled": true
+            }
+          }
+        },
+        "stream-browserify": {
+          "version": "2.0.1",
+          "bundled": true
+        },
+        "string-width": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "bundled": true
+        },
+        "strip-bom": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "supports-color": {
+          "version": "4.2.1",
+          "bundled": true
+        },
+        "tapable": {
+          "version": "0.2.8",
+          "bundled": true
+        },
+        "timers-browserify": {
+          "version": "2.0.4",
+          "bundled": true
+        },
+        "url": {
+          "version": "0.11.0",
+          "bundled": true,
+          "dependencies": {
+            "punycode": {
+              "version": "1.3.2",
+              "bundled": true
+            }
+          }
+        },
+        "watchpack": {
+          "version": "1.4.0",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            }
+          }
+        },
+        "webpack": {
+          "version": "3.5.5",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "1.1.0",
+              "bundled": true
+            },
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
+        },
+        "webpack-sources": {
+          "version": "1.0.1",
+          "bundled": true,
+          "dependencies": {
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
+        },
+        "which-module": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "yargs": {
+          "version": "8.0.2",
+          "bundled": true
+        },
+        "yargs-parser": {
+          "version": "7.0.0",
+          "bundled": true
+        }
+      }
+    },
+    "@rush-temp/todo-app": {
+      "version": "file:projects/todo-app"
+    },
+    "@rush-temp/utilities": {
+      "version": "file:projects/utilities",
+      "dependencies": {
+        "async": {
+          "version": "0.9.2",
+          "bundled": true
+        },
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
+        "debug": {
+          "version": "2.6.8",
+          "bundled": true,
+          "dependencies": {
+            "ms": {
+              "version": "2.0.0",
+              "bundled": true
+            }
+          }
+        },
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
+        },
+        "glob": {
+          "version": "7.1.1",
+          "bundled": true
+        },
+        "mocha": {
+          "version": "3.5.0",
+          "bundled": true
+        },
+        "ms": {
+          "version": "0.7.2",
+          "bundled": true
+        },
+        "sinon": {
+          "version": "2.4.1",
+          "bundled": true
+        },
+        "source-map": {
+          "version": "0.1.43",
+          "bundled": true
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "bundled": true
+        },
+        "supports-color": {
+          "version": "3.1.2",
           "bundled": true
         }
       }
     },
     "@rush-temp/vr-tests": {
-      "version": "file:projects\\vr-tests",
+      "version": "file:projects/vr-tests",
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -1897,8 +2301,7 @@
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+              "bundled": true
             }
           }
         },
@@ -2090,9 +2493,9 @@
       "integrity": "sha512-jGSQ3E+GXey1N6y3wvKX+7D3dexf4vKZOybdynEu7i6ZZMaQzTuQwsQp4kmaneFS4edylfhNWcHebgKKPAbGxA=="
     },
     "abab": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/abab/-/abab-1.0.3.tgz",
-      "integrity": "sha1-uB3l9ydOxOdW15fNg08wNkJyTl0="
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/abab/-/abab-1.0.4.tgz",
+      "integrity": "sha1-X6rZwsB/YN12dw9xzwJbYqY8/U4="
     },
     "abbrev": {
       "version": "1.0.9",
@@ -3222,9 +3625,9 @@
       "integrity": "sha512-ItfYfPLkWHUjckQCk8xC+LwxgK8NYcXywGigJgSwOP8Y2iyWT4f2vsZnoOXTTbo+o5yXmIUJ4gn5538SO5S3gA=="
     },
     "body-parser": {
-      "version": "1.18.1",
-      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.18.1.tgz",
-      "integrity": "sha512-KL2pZpGvy6xuZHgYUznB1Zfw4AoGMApfRanT5NafeLvglbaSM+4CCtmlyYOv66oYXqvKL1xpaFb94V/AZVUnYg==",
+      "version": "1.18.2",
+      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.18.2.tgz",
+      "integrity": "sha1-h2eKGdhLR9hZuDGZvVm84iKxBFQ=",
       "dependencies": {
         "iconv-lite": {
           "version": "0.4.19",
@@ -3422,14 +3825,14 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000733",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000733.tgz",
-      "integrity": "sha1-OmJbxBx6n5nVnWRVKFfdGvDt2dQ="
+      "version": "1.0.30000735",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000735.tgz",
+      "integrity": "sha1-MrxKB+8fJHR0rbYJegMblMqX6po="
     },
     "caniuse-lite": {
-      "version": "1.0.30000733",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000733.tgz",
-      "integrity": "sha1-6/xIJUEXzAxmGXpFNstDl6bPvM0="
+      "version": "1.0.30000735",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000735.tgz",
+      "integrity": "sha1-qrRAFu8kPiFe9D/RND79IpMIQvg="
     },
     "cardinal": {
       "version": "1.0.0",
@@ -3504,9 +3907,9 @@
       "integrity": "sha512-Kkht5ye6ZGmwv40uUDZztayT2ThLQGfnj/T71N/XzeZeo3nf8foyW7zGTsPYkEya3m5f3cAypH+qe7YOrM1U2Q=="
     },
     "clap": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/clap/-/clap-1.2.2.tgz",
-      "integrity": "sha1-aD9vk6MgeU0Sk4bXSyodLWb+3n4=",
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/clap/-/clap-1.2.3.tgz",
+      "integrity": "sha512-4CoL/A3hf90V3VIEjeuhSvlGFEHKzOz+Wfc2IVZc+FaUgU0ZQafJTP49fvnULipOPcAfqhyI2duwQyns6xqjYA==",
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -3712,6 +4115,11 @@
           "version": "2.5.0",
           "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.5.0.tgz",
           "integrity": "sha1-TJQj6i0lLCcMQbK97+/5u2tiwGo="
+        },
+        "debug": {
+          "version": "2.6.8",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
+          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
         }
       }
     },
@@ -3731,9 +4139,16 @@
       "integrity": "sha512-5oNkD/L++l0O6xGXxb1EWS7SivtjfGQlRyxJsYgE0Z495/L81e2h4/d3r969hoPXuFItzNOKMtsXgYG4c7dYvw=="
     },
     "connect": {
-      "version": "3.6.3",
-      "resolved": "https://registry.npmjs.org/connect/-/connect-3.6.3.tgz",
-      "integrity": "sha512-GLSZqgjVxPvGYVD/2vz//gS201MEXk4b7t3nHV6OVnTdDNWi/Gm7Rpxs/ybvljPWvULys/wrzIV3jB3YvEc3nQ=="
+      "version": "3.6.4",
+      "resolved": "https://registry.npmjs.org/connect/-/connect-3.6.4.tgz",
+      "integrity": "sha1-UuoZw4YHMYeEJpKXsCGO0HSgFoc=",
+      "dependencies": {
+        "debug": {
+          "version": "2.6.8",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
+          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
+        }
+      }
     },
     "connect-history-api-fallback": {
       "version": "1.3.0",
@@ -4072,9 +4487,9 @@
       "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk="
     },
     "debug": {
-      "version": "2.6.8",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
-      "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
+      "version": "2.6.9",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
+      "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA=="
     },
     "decamelize": {
       "version": "1.2.0",
@@ -4625,777 +5040,251 @@
       "resolved": "https://registry.npmjs.org/express/-/express-4.15.4.tgz",
       "integrity": "sha1-Ay4iU0ic+PzgJma+yj0R7XotrtE=",
       "dependencies": {
-        "path-to-regexp": {
-          "version": "0.1.7",
-          "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
-          "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
+        "debug": {
+          "version": "2.6.8",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
+          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
         },
-        "qs": {
-          "version": "6.5.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-6.5.0.tgz",
-          "integrity": "sha512-fjVFjW9yhqMhVGwRExCXLhJKrLlkYSaxNWdyc9rmHlrVZbk35YHH312dFd7191uQeXkI3mKLZTIbSvIeFwFemg=="
-        }
-      }
-    },
-    "extend": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz",
-      "integrity": "sha1-p1Xqe8Gt/MWjHOfnYtuq3F5jZEQ="
-    },
-    "extend-shallow": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
-      "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8="
-    },
-    "extglob": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/extglob/-/extglob-2.0.2.tgz",
-      "integrity": "sha512-I0+eZBH+jFGL8F5BnIz2ON2nKCjTS3AS3H/5PeSmCp7UVC70Ym8IhdRiQly2juKYQ//f7z1aj1BRpQniFJoU1w=="
-    },
-    "extract-zip": {
-      "version": "1.6.5",
-      "resolved": "https://registry.npmjs.org/extract-zip/-/extract-zip-1.6.5.tgz",
-      "integrity": "sha1-maBnNbbqIOqbcF13ms/8yHz/BEA=",
-      "dependencies": {
-        "debug": {
-          "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
-        },
-        "mkdirp": {
-          "version": "0.5.0",
-          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.0.tgz",
-          "integrity": "sha1-HXMHam35hs2TROFecfzAWkyavxI="
-        },
-        "ms": {
-          "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
-        }
-      }
-    },
-    "extsprintf": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.3.0.tgz",
-      "integrity": "sha1-lpGEQOMEGnpBT4xS48V06zw+HgU="
-    },
-    "eyes": {
-      "version": "0.1.8",
-      "resolved": "https://registry.npmjs.org/eyes/-/eyes-0.1.8.tgz",
-      "integrity": "sha1-Ys8SAjTGg3hdkCNIqADvPgzCC8A="
-    },
-    "fast-deep-equal": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-1.0.0.tgz",
-      "integrity": "sha1-liVqO8l1WV6zbYLpkp0GDYk0Of8="
-    },
-    "fast-levenshtein": {
-      "version": "2.0.6",
-      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
-      "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc="
-    },
-    "fast-memoize": {
-      "version": "2.2.8",
-      "resolved": "https://registry.npmjs.org/fast-memoize/-/fast-memoize-2.2.8.tgz",
-      "integrity": "sha512-3ppTC3fZ9Vwtjslx8DkhSIbI9PH1nM4pobuTHQINOxTxchG8n3SDGZ8L6jbatGJCGLKR+gbkNWKFN4E1iUROSA=="
-    },
-    "fastparse": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.1.tgz",
-      "integrity": "sha1-0eJkOzipTXWDtHkGDmxK/8lAcfg="
-    },
-    "faye-websocket": {
-      "version": "0.10.0",
-      "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz",
-      "integrity": "sha1-TkkvjQTftviQA1B/btvy1QHnxvQ="
-    },
-    "fb-watchman": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/fb-watchman/-/fb-watchman-2.0.0.tgz",
-      "integrity": "sha1-VOmr99+i8mzZsWNsWIwa/AXeXVg="
-    },
-    "fbjs": {
-      "version": "0.8.15",
-      "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.15.tgz",
-      "integrity": "sha1-TwaV/fzBbDfAsH+s7Iy0xAkWhbk=",
-      "dependencies": {
-        "core-js": {
-          "version": "1.2.7",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
-          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
-        }
-      }
-    },
-    "fd-slicer": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/fd-slicer/-/fd-slicer-1.0.1.tgz",
-      "integrity": "sha1-i1vL2ewyfFBBv5qwI/1nUPEXfmU="
-    },
-    "file-loader": {
-      "version": "0.11.1",
-      "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.11.1.tgz",
-      "integrity": "sha1-azKO4SNKcp5OR9Njdd1tNcDh24Q="
-    },
-    "filename-regex": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz",
-      "integrity": "sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY="
-    },
-    "fileset": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/fileset/-/fileset-2.0.3.tgz",
-      "integrity": "sha1-jnVIqW08wjJ+5eZ0FocjozO7oqA="
-    },
-    "filesize": {
-      "version": "3.5.10",
-      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.5.10.tgz",
-      "integrity": "sha1-/I+iPdtO+eXgq24eZPZ5okpWdh8="
-    },
-    "fill-range": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-4.0.0.tgz",
-      "integrity": "sha1-1USBHUKPmOsGpj3EAtJAPDKMOPc="
-    },
-    "finalhandler": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.4.tgz",
-      "integrity": "sha512-16l/r8RgzlXKmFOhZpHBztvye+lAhC5SU7hXavnerC9UfZqZxxXl3BzL8MhffPT3kF61lj9Oav2LKEzh0ei7tg=="
-    },
-    "find-cache-dir": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/find-cache-dir/-/find-cache-dir-1.0.0.tgz",
-      "integrity": "sha1-kojj6ePMN0hxfTnq3hfPcfww7m8="
-    },
-    "find-index": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
-      "integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ="
-    },
-    "find-replace": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/find-replace/-/find-replace-1.0.3.tgz",
-      "integrity": "sha1-uI5zZNLZyVlVnziMZmcNYTBEH6A=",
-      "dependencies": {
-        "array-back": {
-          "version": "1.0.4",
-          "resolved": "https://registry.npmjs.org/array-back/-/array-back-1.0.4.tgz",
-          "integrity": "sha1-ZEun8JX3/898Q7Xw3DnTwfA8Bjs="
-        }
-      }
-    },
-    "find-up": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz",
-      "integrity": "sha1-RdG35QbHF93UgndaK3eSCjwMV6c="
-    },
-    "flatten": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz",
-      "integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I="
-    },
-    "follow-redirects": {
-      "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-0.0.7.tgz",
-      "integrity": "sha1-NLkLqyqRGqNHVx2pDyK9NuzYqRk="
-    },
-    "for-in": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
-      "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA="
-    },
-    "for-own": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz",
-      "integrity": "sha1-UmXGgaTylNq78XyVCbZ2OqhFEM4="
-    },
-    "foreach": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/foreach/-/foreach-2.0.5.tgz",
-      "integrity": "sha1-C+4AUBiusmDQo6865ljdATbsG5k="
-    },
-    "forever-agent": {
-      "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
-      "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE="
-    },
-    "form-data": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.3.1.tgz",
-      "integrity": "sha1-b7lPvXGIUwbXPRXMSX/kzE7NRL8="
-    },
-    "formatio": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.2.0.tgz",
-      "integrity": "sha1-87IWfZBoxGmKjVH092CjmlTYGOs="
-    },
-    "forwarded": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.2.tgz",
-      "integrity": "sha1-mMI9qxF1ZXuMBXPozszZGw/xjIQ="
-    },
-    "fragment-cache": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/fragment-cache/-/fragment-cache-0.2.1.tgz",
-      "integrity": "sha1-QpD60n8T6Jvn8zeZxrxaCr//DRk="
-    },
-    "fresh": {
-      "version": "0.5.0",
-      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.0.tgz",
-      "integrity": "sha1-9HTKXmqSRtb9jglTz6m5yAWvp44="
-    },
-    "fs-extra": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-1.0.0.tgz",
-      "integrity": "sha1-zTzl9+fLYUWIP8rjGR6Yd/hYeVA="
-    },
-    "fs.realpath": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
-      "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
-    },
-    "fsevents": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.2.tgz",
-      "integrity": "sha512-Sn44E5wQW4bTHXvQmvSHwqbuiXtduD6Rrjm2ZtUEGbyrig+nUH3t/QD4M4/ZXViY556TBpRgZkHLDx3JxPwxiw==",
-      "optional": true,
-      "dependencies": {
-        "abbrev": {
-          "version": "1.1.0",
-          "bundled": true,
-          "optional": true
-        },
-        "ajv": {
-          "version": "4.11.8",
-          "bundled": true,
-          "optional": true
-        },
-        "ansi-regex": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "aproba": {
-          "version": "1.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "are-we-there-yet": {
-          "version": "1.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "asn1": {
-          "version": "0.2.3",
-          "bundled": true,
-          "optional": true
-        },
-        "assert-plus": {
-          "version": "0.2.0",
-          "bundled": true,
-          "optional": true
-        },
-        "asynckit": {
-          "version": "0.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "aws-sign2": {
-          "version": "0.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "aws4": {
-          "version": "1.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "balanced-match": {
-          "version": "0.4.2",
-          "bundled": true
-        },
-        "bcrypt-pbkdf": {
-          "version": "1.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "block-stream": {
-          "version": "0.0.9",
-          "bundled": true
-        },
-        "boom": {
-          "version": "2.10.1",
-          "bundled": true
-        },
-        "brace-expansion": {
-          "version": "1.1.7",
-          "bundled": true
-        },
-        "buffer-shims": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "caseless": {
-          "version": "0.12.0",
-          "bundled": true,
-          "optional": true
-        },
-        "co": {
-          "version": "4.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "code-point-at": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "combined-stream": {
-          "version": "1.0.5",
-          "bundled": true
-        },
-        "concat-map": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "console-control-strings": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "core-util-is": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "cryptiles": {
-          "version": "2.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "dashdash": {
-          "version": "1.14.1",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true,
-          "optional": true
-        },
-        "deep-extend": {
-          "version": "0.4.2",
-          "bundled": true,
-          "optional": true
-        },
-        "delayed-stream": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "delegates": {
-          "version": "1.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "ecc-jsbn": {
-          "version": "0.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "extend": {
-          "version": "3.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "extsprintf": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "forever-agent": {
-          "version": "0.6.1",
-          "bundled": true,
-          "optional": true
-        },
-        "form-data": {
-          "version": "2.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "fs.realpath": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "fstream": {
-          "version": "1.0.11",
-          "bundled": true
-        },
-        "fstream-ignore": {
-          "version": "1.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "gauge": {
-          "version": "2.7.4",
-          "bundled": true,
-          "optional": true
-        },
-        "getpass": {
-          "version": "0.1.7",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "glob": {
-          "version": "7.1.2",
-          "bundled": true
-        },
-        "graceful-fs": {
-          "version": "4.1.11",
-          "bundled": true
-        },
-        "har-schema": {
-          "version": "1.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "har-validator": {
-          "version": "4.2.1",
-          "bundled": true,
-          "optional": true
-        },
-        "has-unicode": {
-          "version": "2.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "hawk": {
-          "version": "3.1.3",
-          "bundled": true,
-          "optional": true
-        },
-        "hoek": {
-          "version": "2.16.3",
-          "bundled": true
-        },
-        "http-signature": {
-          "version": "1.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "inflight": {
-          "version": "1.0.6",
-          "bundled": true
-        },
-        "inherits": {
-          "version": "2.0.3",
-          "bundled": true
-        },
-        "ini": {
-          "version": "1.3.4",
-          "bundled": true,
-          "optional": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "is-typedarray": {
-          "version": "1.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "isstream": {
-          "version": "0.1.2",
-          "bundled": true,
-          "optional": true
-        },
-        "jodid25519": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "jsbn": {
-          "version": "0.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "json-schema": {
-          "version": "0.2.3",
-          "bundled": true,
-          "optional": true
-        },
-        "json-stable-stringify": {
-          "version": "1.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "json-stringify-safe": {
-          "version": "5.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "jsonify": {
-          "version": "0.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "jsprim": {
-          "version": "1.4.0",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "mime-db": {
-          "version": "1.27.0",
-          "bundled": true
-        },
-        "mime-types": {
-          "version": "2.1.15",
-          "bundled": true
-        },
-        "minimatch": {
-          "version": "3.0.4",
-          "bundled": true
-        },
-        "minimist": {
-          "version": "0.0.8",
-          "bundled": true
-        },
-        "mkdirp": {
-          "version": "0.5.1",
-          "bundled": true
-        },
-        "ms": {
-          "version": "2.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "node-pre-gyp": {
-          "version": "0.6.36",
-          "bundled": true,
-          "optional": true
-        },
-        "nopt": {
-          "version": "4.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "npmlog": {
-          "version": "4.1.0",
-          "bundled": true,
-          "optional": true
-        },
-        "number-is-nan": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "oauth-sign": {
-          "version": "0.8.2",
-          "bundled": true,
-          "optional": true
-        },
-        "object-assign": {
-          "version": "4.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "once": {
-          "version": "1.4.0",
-          "bundled": true
-        },
-        "os-homedir": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "os-tmpdir": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "osenv": {
-          "version": "0.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "path-is-absolute": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "performance-now": {
-          "version": "0.2.0",
-          "bundled": true,
-          "optional": true
-        },
-        "process-nextick-args": {
-          "version": "1.0.7",
-          "bundled": true
-        },
-        "punycode": {
-          "version": "1.4.1",
-          "bundled": true,
-          "optional": true
-        },
-        "qs": {
-          "version": "6.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "rc": {
-          "version": "1.2.1",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "minimist": {
-              "version": "1.2.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "readable-stream": {
-          "version": "2.2.9",
-          "bundled": true
-        },
-        "request": {
-          "version": "2.81.0",
-          "bundled": true,
-          "optional": true
-        },
-        "rimraf": {
-          "version": "2.6.1",
-          "bundled": true
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "bundled": true
-        },
-        "semver": {
-          "version": "5.3.0",
-          "bundled": true,
-          "optional": true
-        },
-        "set-blocking": {
-          "version": "2.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "signal-exit": {
-          "version": "3.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "sntp": {
-          "version": "1.0.9",
-          "bundled": true,
-          "optional": true
-        },
-        "sshpk": {
-          "version": "1.13.0",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "string_decoder": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "stringstream": {
-          "version": "0.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "strip-ansi": {
-          "version": "3.0.1",
-          "bundled": true
-        },
-        "strip-json-comments": {
-          "version": "2.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "tar": {
-          "version": "2.2.1",
-          "bundled": true
-        },
-        "tar-pack": {
-          "version": "3.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "tough-cookie": {
-          "version": "2.3.2",
-          "bundled": true,
-          "optional": true
-        },
-        "tunnel-agent": {
-          "version": "0.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "tweetnacl": {
-          "version": "0.14.5",
-          "bundled": true,
-          "optional": true
-        },
-        "uid-number": {
-          "version": "0.0.6",
-          "bundled": true,
-          "optional": true
-        },
-        "util-deprecate": {
-          "version": "1.0.2",
-          "bundled": true
+        "path-to-regexp": {
+          "version": "0.1.7",
+          "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
+          "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
         },
-        "uuid": {
-          "version": "3.0.1",
-          "bundled": true,
-          "optional": true
+        "qs": {
+          "version": "6.5.0",
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.5.0.tgz",
+          "integrity": "sha512-fjVFjW9yhqMhVGwRExCXLhJKrLlkYSaxNWdyc9rmHlrVZbk35YHH312dFd7191uQeXkI3mKLZTIbSvIeFwFemg=="
         },
-        "verror": {
-          "version": "1.3.6",
-          "bundled": true,
-          "optional": true
+        "utils-merge": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.0.tgz",
+          "integrity": "sha1-ApT7kiu5N1FTVBxPcJYjHyh8ivg="
+        }
+      }
+    },
+    "extend": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz",
+      "integrity": "sha1-p1Xqe8Gt/MWjHOfnYtuq3F5jZEQ="
+    },
+    "extend-shallow": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+      "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8="
+    },
+    "extglob": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/extglob/-/extglob-2.0.2.tgz",
+      "integrity": "sha512-I0+eZBH+jFGL8F5BnIz2ON2nKCjTS3AS3H/5PeSmCp7UVC70Ym8IhdRiQly2juKYQ//f7z1aj1BRpQniFJoU1w=="
+    },
+    "extract-zip": {
+      "version": "1.6.5",
+      "resolved": "https://registry.npmjs.org/extract-zip/-/extract-zip-1.6.5.tgz",
+      "integrity": "sha1-maBnNbbqIOqbcF13ms/8yHz/BEA=",
+      "dependencies": {
+        "debug": {
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
-        "wide-align": {
-          "version": "1.1.2",
-          "bundled": true,
-          "optional": true
+        "mkdirp": {
+          "version": "0.5.0",
+          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.0.tgz",
+          "integrity": "sha1-HXMHam35hs2TROFecfzAWkyavxI="
         },
-        "wrappy": {
-          "version": "1.0.2",
-          "bundled": true
+        "ms": {
+          "version": "0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+        }
+      }
+    },
+    "extsprintf": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.3.0.tgz",
+      "integrity": "sha1-lpGEQOMEGnpBT4xS48V06zw+HgU="
+    },
+    "eyes": {
+      "version": "0.1.8",
+      "resolved": "https://registry.npmjs.org/eyes/-/eyes-0.1.8.tgz",
+      "integrity": "sha1-Ys8SAjTGg3hdkCNIqADvPgzCC8A="
+    },
+    "fast-deep-equal": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-1.0.0.tgz",
+      "integrity": "sha1-liVqO8l1WV6zbYLpkp0GDYk0Of8="
+    },
+    "fast-levenshtein": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
+      "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc="
+    },
+    "fast-memoize": {
+      "version": "2.2.8",
+      "resolved": "https://registry.npmjs.org/fast-memoize/-/fast-memoize-2.2.8.tgz",
+      "integrity": "sha512-3ppTC3fZ9Vwtjslx8DkhSIbI9PH1nM4pobuTHQINOxTxchG8n3SDGZ8L6jbatGJCGLKR+gbkNWKFN4E1iUROSA=="
+    },
+    "fastparse": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.1.tgz",
+      "integrity": "sha1-0eJkOzipTXWDtHkGDmxK/8lAcfg="
+    },
+    "faye-websocket": {
+      "version": "0.10.0",
+      "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz",
+      "integrity": "sha1-TkkvjQTftviQA1B/btvy1QHnxvQ="
+    },
+    "fb-watchman": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/fb-watchman/-/fb-watchman-2.0.0.tgz",
+      "integrity": "sha1-VOmr99+i8mzZsWNsWIwa/AXeXVg="
+    },
+    "fbjs": {
+      "version": "0.8.15",
+      "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.15.tgz",
+      "integrity": "sha1-TwaV/fzBbDfAsH+s7Iy0xAkWhbk=",
+      "dependencies": {
+        "core-js": {
+          "version": "1.2.7",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
+          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
+        }
+      }
+    },
+    "fd-slicer": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/fd-slicer/-/fd-slicer-1.0.1.tgz",
+      "integrity": "sha1-i1vL2ewyfFBBv5qwI/1nUPEXfmU="
+    },
+    "file-loader": {
+      "version": "0.11.1",
+      "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.11.1.tgz",
+      "integrity": "sha1-azKO4SNKcp5OR9Njdd1tNcDh24Q="
+    },
+    "filename-regex": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz",
+      "integrity": "sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY="
+    },
+    "fileset": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/fileset/-/fileset-2.0.3.tgz",
+      "integrity": "sha1-jnVIqW08wjJ+5eZ0FocjozO7oqA="
+    },
+    "filesize": {
+      "version": "3.5.10",
+      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.5.10.tgz",
+      "integrity": "sha1-/I+iPdtO+eXgq24eZPZ5okpWdh8="
+    },
+    "fill-range": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-4.0.0.tgz",
+      "integrity": "sha1-1USBHUKPmOsGpj3EAtJAPDKMOPc="
+    },
+    "finalhandler": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.5.tgz",
+      "integrity": "sha1-pwEwPSV6G8gv6lR6M+WuiVMXI98=",
+      "dependencies": {
+        "debug": {
+          "version": "2.6.8",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
+          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
+        }
+      }
+    },
+    "find-cache-dir": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/find-cache-dir/-/find-cache-dir-1.0.0.tgz",
+      "integrity": "sha1-kojj6ePMN0hxfTnq3hfPcfww7m8="
+    },
+    "find-index": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
+      "integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ="
+    },
+    "find-replace": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/find-replace/-/find-replace-1.0.3.tgz",
+      "integrity": "sha1-uI5zZNLZyVlVnziMZmcNYTBEH6A=",
+      "dependencies": {
+        "array-back": {
+          "version": "1.0.4",
+          "resolved": "https://registry.npmjs.org/array-back/-/array-back-1.0.4.tgz",
+          "integrity": "sha1-ZEun8JX3/898Q7Xw3DnTwfA8Bjs="
         }
       }
     },
+    "find-up": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz",
+      "integrity": "sha1-RdG35QbHF93UgndaK3eSCjwMV6c="
+    },
+    "flatten": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz",
+      "integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I="
+    },
+    "follow-redirects": {
+      "version": "0.0.7",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-0.0.7.tgz",
+      "integrity": "sha1-NLkLqyqRGqNHVx2pDyK9NuzYqRk="
+    },
+    "for-in": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
+      "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA="
+    },
+    "for-own": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz",
+      "integrity": "sha1-UmXGgaTylNq78XyVCbZ2OqhFEM4="
+    },
+    "foreach": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/foreach/-/foreach-2.0.5.tgz",
+      "integrity": "sha1-C+4AUBiusmDQo6865ljdATbsG5k="
+    },
+    "forever-agent": {
+      "version": "0.6.1",
+      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
+      "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE="
+    },
+    "form-data": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.3.1.tgz",
+      "integrity": "sha1-b7lPvXGIUwbXPRXMSX/kzE7NRL8="
+    },
+    "formatio": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.2.0.tgz",
+      "integrity": "sha1-87IWfZBoxGmKjVH092CjmlTYGOs="
+    },
+    "forwarded": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.2.tgz",
+      "integrity": "sha1-mMI9qxF1ZXuMBXPozszZGw/xjIQ="
+    },
+    "fragment-cache": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/fragment-cache/-/fragment-cache-0.2.1.tgz",
+      "integrity": "sha1-QpD60n8T6Jvn8zeZxrxaCr//DRk="
+    },
+    "fresh": {
+      "version": "0.5.0",
+      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.0.tgz",
+      "integrity": "sha1-9HTKXmqSRtb9jglTz6m5yAWvp44="
+    },
+    "fs-extra": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-1.0.0.tgz",
+      "integrity": "sha1-zTzl9+fLYUWIP8rjGR6Yd/hYeVA="
+    },
+    "fs.realpath": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
+      "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
+    },
     "fstream": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
@@ -5501,9 +5390,9 @@
       "integrity": "sha512-DNXCd+c14N9QF8aAKrfl4xakPk5FdcFwmH7sD0qnC0Pr7xoZ5W9yovhUrY/dJc3psfGGXC58vqQyRtuskyUJxA=="
     },
     "glamorous": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/glamorous/-/glamorous-4.9.2.tgz",
-      "integrity": "sha512-1mKYHbAvBtbHsCBnECcCHlAuU3qUptbDzWWuQpFmlkjDuYAbuZcZr3UOk8nw+hG0tWXGyO4nuhKv//JgdpiMEw=="
+      "version": "4.9.5",
+      "resolved": "https://registry.npmjs.org/glamorous/-/glamorous-4.9.5.tgz",
+      "integrity": "sha512-yz9D8M8Yfic0LJ37J1GELXztfu5M2SYsu146wzku8Vq/V6N1SSSJWmBtaHB8emEpql9jhFwfh3Fc1lDKllp2Yg=="
     },
     "glob": {
       "version": "7.1.2",
@@ -5766,9 +5655,9 @@
       "integrity": "sha1-CgAsyFcHGSp+eUbO7cERVfYOxzY="
     },
     "http-parser-js": {
-      "version": "0.4.6",
-      "resolved": "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.4.6.tgz",
-      "integrity": "sha1-GVJz9YcExFLWcQdr4gEyndNB3FU="
+      "version": "0.4.8",
+      "resolved": "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.4.8.tgz",
+      "integrity": "sha512-jmHp99g6/fLx0pRNJqzsQgjsclCHAY7NhIeA3/U+bsGNvgbvUCQFQY9m5AYpqpAxY/2VcikfbKpjQozSTiz0jA=="
     },
     "http-proxy": {
       "version": "1.16.2",
@@ -7888,9 +7777,9 @@
       "integrity": "sha1-43rwTiOwkfZTYNsknbi7DzEpH2A="
     },
     "office-ui-fabric-react": {
-      "version": "4.48.1",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.48.1.tgz",
-      "integrity": "sha512-SOfhxkDB62vGP6ozRA1oT+8lfbGliRwsf9t5cYszRf4LB4Wf7OzrSso+M0+GFLBbTcAA0+2qPM3vFAsV+B/3tg=="
+      "version": "4.49.1",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.49.1.tgz",
+      "integrity": "sha512-juFtnQq/NXcW4sxQzjEiZv5FlbSLHWnrOsnP0P4Uk/lHEUDN9tT/SFn6n/W1U1StGq5rjgAG8Ore7WDyEg5fhA=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -10061,13 +9950,18 @@
           "version": "0.4.3",
           "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz",
           "integrity": "sha1-Y3PbdpCf5XDgjXNYM2Xtgop07us="
+        },
+        "utils-merge": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.0.tgz",
+          "integrity": "sha1-ApT7kiu5N1FTVBxPcJYjHyh8ivg="
         }
       }
     },
     "screener-storybook": {
-      "version": "0.9.0",
-      "resolved": "https://registry.npmjs.org/screener-storybook/-/screener-storybook-0.9.0.tgz",
-      "integrity": "sha1-3B+TbY+7OQGdL0K7tfYMCOKy5Yc=",
+      "version": "0.9.1",
+      "resolved": "https://registry.npmjs.org/screener-storybook/-/screener-storybook-0.9.1.tgz",
+      "integrity": "sha1-3SnlbfcHCmwGeMEp9d4psY/f4VA=",
       "dependencies": {
         "acorn": {
           "version": "2.7.0",
@@ -10224,9 +10118,9 @@
           "integrity": "sha1-xpKJRqDgbF+Nb4qTM0af/aRimKA="
         },
         "screener-runner": {
-          "version": "0.7.0",
-          "resolved": "https://registry.npmjs.org/screener-runner/-/screener-runner-0.7.0.tgz",
-          "integrity": "sha1-wTtBdC65b6rZWpFFgi2fg1oibQg=",
+          "version": "0.7.1",
+          "resolved": "https://registry.npmjs.org/screener-runner/-/screener-runner-0.7.1.tgz",
+          "integrity": "sha1-Tt3qLX6/h2iQ8f0aIRb7bKgU02w=",
           "dependencies": {
             "caseless": {
               "version": "0.11.0",
@@ -10287,6 +10181,11 @@
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
           "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
         },
+        "utils-merge": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.0.tgz",
+          "integrity": "sha1-ApT7kiu5N1FTVBxPcJYjHyh8ivg="
+        },
         "webidl-conversions": {
           "version": "3.0.1",
           "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-3.0.1.tgz",
@@ -10331,6 +10230,11 @@
       "resolved": "https://registry.npmjs.org/send/-/send-0.15.4.tgz",
       "integrity": "sha1-mF+qPihLAnPHkzZKNcZze9k5Bbk=",
       "dependencies": {
+        "debug": {
+          "version": "2.6.8",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
+          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
+        },
         "mime": {
           "version": "1.3.4",
           "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz",
@@ -10353,7 +10257,14 @@
     "serve-index": {
       "version": "1.9.0",
       "resolved": "https://registry.npmjs.org/serve-index/-/serve-index-1.9.0.tgz",
-      "integrity": "sha1-0rKA/FYNYW7oG0i/D6gqvtJIXOc="
+      "integrity": "sha1-0rKA/FYNYW7oG0i/D6gqvtJIXOc=",
+      "dependencies": {
+        "debug": {
+          "version": "2.6.8",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
+          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
+        }
+      }
     },
     "serve-static": {
       "version": "1.12.4",
@@ -11088,9 +10999,9 @@
       }
     },
     "tough-cookie": {
-      "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.2.tgz",
-      "integrity": "sha1-8IH3bkyFcg5sN6X6ztc3FQ2EByo="
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.3.tgz",
+      "integrity": "sha1-C2GKVWW23qkL80JdBNVe3EdadWE="
     },
     "tr46": {
       "version": "0.0.3",
@@ -11463,9 +11374,9 @@
       "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8="
     },
     "utils-merge": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.0.tgz",
-      "integrity": "sha1-ApT7kiu5N1FTVBxPcJYjHyh8ivg="
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.1.tgz",
+      "integrity": "sha1-n5VxD1CiZ5R7LMwSR0HBAoQn5xM="
     },
     "uuid": {
       "version": "3.1.0",
@@ -11947,4 +11858,4 @@
       "integrity": "sha1-AI4G2AlDIMNy28L47XagymyKxBk="
     }
   }
-}
+}
\ No newline at end of file

From 85ce9da2221b4aa66670800db12fa24c5a94c4fc Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Fri, 22 Sep 2017 14:06:54 -0700
Subject: [PATCH 0705/1641] Theme Generator: have the bg change with theme
 (#2929)

* have the background actually change with theme in the website

* change file
---
 ...eGeneratorBackground_2017-09-22-20-51.json | 11 ++++++++++
 .../ThemeGenerator/ThemeGeneratorPage.tsx     | 22 +++++++++++++++++++
 2 files changed, 33 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/phkuo-themeGeneratorBackground_2017-09-22-20-51.json

diff --git a/common/changes/office-ui-fabric-react/phkuo-themeGeneratorBackground_2017-09-22-20-51.json b/common/changes/office-ui-fabric-react/phkuo-themeGeneratorBackground_2017-09-22-20-51.json
new file mode 100644
index 0000000000000..bcec603c17cf3
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/phkuo-themeGeneratorBackground_2017-09-22-20-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Theme Generator: have the bg change with the theme",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
index 12d686bbfaeae..04c92dd91fa10 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
@@ -57,6 +57,22 @@ export class ThemeGeneratorPage extends React.Component<any, IThemeGeneratorPage
     };
   }
 
+  public componentWillUnmount(): void {
+    // remove temp styles
+    let root = document.querySelector('.App-content') as HTMLElement;
+    if (root) {
+      root.style.backgroundColor = '';
+      root.style.color = '';
+    }
+    document.body.style.backgroundColor = '';
+    document.body.style.color = '';
+
+    // and apply the default theme to overwrite any existing custom theme
+    let themeRules = themeRulesStandardCreator();
+    ThemeGenerator.insureSlots(themeRules, false);
+    loadTheme({ palette: themeRules });
+  }
+
   public render() {
     let { colorPickerVisible, colorPickerSlotRule, colorPickerElement } = this.state;
 
@@ -448,6 +464,12 @@ export class ThemeGeneratorPage extends React.Component<any, IThemeGeneratorPage
   private _makeNewTheme() {
     let themeAsJson: { [key: string]: string } = ThemeGenerator.getThemeAsJson(this.state.themeRules);
     console.log('New theme...', themeAsJson);
+
+    let root = document.querySelector('.App-content') as HTMLElement;
+    if (root) {
+      root.style.backgroundColor = themeAsJson.backgroundColor;
+      root.style.color = themeAsJson.bodyText;
+    }
     document.body.style.backgroundColor = themeAsJson.backgroundColor;
     document.body.style.color = themeAsJson.bodyText;
     loadTheme({ palette: themeAsJson });

From 96722a134676c400b7a92461174f5e8a93f7d083 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Fri, 22 Sep 2017 18:06:33 -0500
Subject: [PATCH 0706/1641] Utilities: Add utilities for making changes to
 arrays immutably (#2919)

* Add flatten function

* Port over addElementAtIndex and replaceElement

* Fix tests

* Refactor the duplicate code for copying arrays

* Rush change

* Fix tslint

* Rename callback paremeter name

* Update comment

* REmove the copy and mutate funtion, the arrow function overhead worries me.
---
 .../array-utils_2017-09-22-00-57.json         | 11 +++
 packages/utilities/src/array.test.ts          | 81 ++++++++++++++++++-
 packages/utilities/src/array.ts               | 34 ++++++++
 3 files changed, 125 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/utilities/array-utils_2017-09-22-00-57.json

diff --git a/common/changes/@uifabric/utilities/array-utils_2017-09-22-00-57.json b/common/changes/@uifabric/utilities/array-utils_2017-09-22-00-57.json
new file mode 100644
index 0000000000000..c68b10e28a102
--- /dev/null
+++ b/common/changes/@uifabric/utilities/array-utils_2017-09-22-00-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Array: Add utility functions for updating arrays immutably",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/src/array.test.ts b/packages/utilities/src/array.test.ts
index c2f774d3cd20a..895956c578466 100644
--- a/packages/utilities/src/array.test.ts
+++ b/packages/utilities/src/array.test.ts
@@ -1,4 +1,4 @@
-import { findIndex, find, createArray, removeIndex } from './array';
+import { findIndex, find, createArray, removeIndex, flatten, replaceElement, addElementAtIndex } from './array';
 
 describe('array utils tests', () => {
   describe('findIndex tests', () => {
@@ -80,4 +80,83 @@ describe('array utils tests', () => {
       expect(result).toEqual([0, 2]);
     });
   });
+
+  describe('replaceElement tests', () => {
+    it('should return a new array instead of mutating the existing array', () => {
+      const array = [1, 2, 3];
+      const result = replaceElement(array, 3, 1);
+      expect(result).toEqual([1, 3, 3]);
+      expect(result).not.toBe(array);
+    });
+
+    it('should return a new array with the replaced element in the center', () => {
+      const array = ['Zero', 'One', 'Two', 'Three', 'Four'];
+      const result = replaceElement(array, 'owT', 2);
+      expect(result).toEqual(['Zero', 'One', 'owT', 'Three', 'Four']);
+    });
+
+    it('should return a new array with the first element replaced', () => {
+      const array = ['Zero', 'One', 'Two', 'Three', 'Four'];
+      const result = replaceElement(array, 'oreZ', 0);
+      expect(result).toEqual(['oreZ', 'One', 'Two', 'Three', 'Four']);
+    });
+
+    it('should return a new array with the last element replaced', () => {
+      const array = ['Zero', 'One', 'Two', 'Three', 'Four'];
+      const result = replaceElement(array, 'ruoF', 4);
+      expect(result).toEqual(['Zero', 'One', 'Two', 'Three', 'ruoF']);
+    });
+  });
+
+  describe('addElementAddIndex tests', () => {
+    it('should add an element at the start of the array', () => {
+      const array = [2, 3, 4];
+      const result = addElementAtIndex(array, 0, 1);
+      expect(result).toEqual([1, 2, 3, 4]);
+    });
+
+    it('should add an element at the end of the array', () => {
+      const array = [2, 3, 4];
+      const result = addElementAtIndex(array, 3, 5);
+      expect(result).toEqual([2, 3, 4, 5]);
+    });
+
+    it('should add the element in the middle of the array', () => {
+      const array = [2, 3, 4];
+      const result = addElementAtIndex(array, 2, 3.5);
+      expect(result).toEqual([2, 3, 3.5, 4]);
+    });
+  });
+
+  describe('flatten tests', () => {
+    it('does nothing for an empty array', () => {
+      const array: number[] = [];
+      const result = flatten(array);
+      expect(result).toEqual(array);
+    });
+
+    it('does nothing an array with a single element', () => {
+      const array = [1];
+      const result = flatten(array);
+      expect(result).toEqual(array);
+    });
+
+    it('does nothing for an array of numbers', () => {
+      const array = [1, 2, 3];
+      const result = flatten(array);
+      expect(result).toEqual(array);
+    });
+
+    it('flattens an array of arrays', () => {
+      const array = [[1, 2, 3], [4, 6, 8], [20]];
+      const result = flatten(array);
+      expect(result).toEqual([1, 2, 3, 4, 6, 8, 20]);
+    });
+
+    it('flattens an array with numbers and arrays of numbers', () => {
+      const array = [[1, 2, 3], [4, 6, 8], 20, 22, [25, 26, 28]];
+      const result = flatten(array);
+      expect(result).toEqual([1, 2, 3, 4, 6, 8, 20, 22, 25, 26, 28]);
+    });
+  });
 });
\ No newline at end of file
diff --git a/packages/utilities/src/array.ts b/packages/utilities/src/array.ts
index 731082db573ce..989c54b9b8b44 100644
--- a/packages/utilities/src/array.ts
+++ b/packages/utilities/src/array.ts
@@ -78,4 +78,38 @@ export function toMatrix<T>(items: T[], columnCount: number): T[][] {
  */
 export function removeIndex<T>(array: T[], index: number): T[] {
   return array.filter((_: T, i: number) => index !== i);
+}
+
+/**
+ * Given an array, this function returns a new array where the element at a given index has been replaced.
+ * @param array - The array to operate on
+ * @param newElement - The element that will be placed in the new array
+ * @param index - The index of the element that should be replaced
+ */
+export function replaceElement<T>(array: T[], newElement: T, index: number): T[] {
+  const copy = array.slice();
+  copy[index] = newElement;
+  return copy;
+}
+
+/**
+ * Given an array, this function returns a new array where an element has been inserted at the given index.
+ * @param array - The array to operate on
+ * @param index - The index where an element should be inserted
+ * @param itemToAdd - The element to insert
+ */
+export function addElementAtIndex<T>(array: T[], index: number, itemToAdd: T): T[] {
+  const copy = array.slice();
+  copy.splice(index, 0, itemToAdd);
+  return copy;
+}
+
+/**
+ * Given an array where each element is of type T or T[], flatten it into an array of T
+ * @param array - The array where each element can optionally also be an array
+ */
+export function flatten<T>(array: (T | T[])[]): T[] {
+  let result: T[] = [];
+  array.forEach((item: T | T[]): T[] => (result = result.concat(item)));
+  return result;
 }
\ No newline at end of file

From df1dbd17e9a2ed7b08aed6e23e2b6264ef5fc5be Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 22 Sep 2017 16:48:54 -0700
Subject: [PATCH 0707/1641] Screener updates (Micah's changes) (#2932)

* Updated vr-tests to have local and non local testing, updated to 0.9.1

* Fixed travis npm script

* new shrinkwrap

* undo
---
 .travis.yml                            |  2 +-
 apps/vr-tests/package.json             |  3 +-
 apps/vr-tests/screener.config.js       |  3 +-
 apps/vr-tests/screener.local.config.js |  7 ++
 common/config/rush/npm-shrinkwrap.json | 92 +++++++++++---------------
 5 files changed, 51 insertions(+), 56 deletions(-)
 create mode 100644 apps/vr-tests/screener.local.config.js

diff --git a/.travis.yml b/.travis.yml
index 591c216df9546..589b4565139e9 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -3,4 +3,4 @@ node_js:
   - '7'
 script:
   - npm run buildfast
-  - npm run vrtest
\ No newline at end of file
+  - 'if [ "$TRAVIS_PULL_REQUEST" != "false" ]; then npm run vrtest; fi'
\ No newline at end of file
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index bf076b8d4ac6c..bd1e8b911c37e 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -7,6 +7,7 @@
     "build": "",
     "clean": "",
     "screener": "screener-storybook --conf screener.config.js --debug",
+    "screener:local": "screener-storybook --conf screener.local.config.js --debug",
     "storybook": "start-storybook --port 5555"
   },
   "devDependencies": {
@@ -22,7 +23,7 @@
     "style-loader": "=0.16.1",
     "awesome-typescript-loader": "^3.2.3",
     "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
-    "screener-storybook": "^0.9.0",
+    "screener-storybook": "^0.9.1",
     "screener-runner": "^0.6.19",
     "storybook-readme": "=3.0.6"
   },
diff --git a/apps/vr-tests/screener.config.js b/apps/vr-tests/screener.config.js
index 9a42828204330..06ce70285e5fb 100644
--- a/apps/vr-tests/screener.config.js
+++ b/apps/vr-tests/screener.config.js
@@ -1,7 +1,8 @@
 module.exports = {
   projectRepo: 'OfficeDev/office-ui-fabric-react',
   storybookConfigDir: '.storybook',
-  apiKey: 'ff2096ee-7c7d-4e80-824b-9114ff43549c',
+  apiKey: process.env.SCREENER_API_KEY,
   resolution: '1024x768',
+  baseBranch: 'master',
   failureExitCode: 0
 };
\ No newline at end of file
diff --git a/apps/vr-tests/screener.local.config.js b/apps/vr-tests/screener.local.config.js
new file mode 100644
index 0000000000000..c2456f92302a5
--- /dev/null
+++ b/apps/vr-tests/screener.local.config.js
@@ -0,0 +1,7 @@
+module.exports = {
+  projectRepo: 'OfficeDev/office-ui-fabric-react',
+  storybookConfigDir: '.storybook',
+  apiKey: 'ff2096ee-7c7d-4e80-824b-9114ff43549c',
+  resolution: '1024x768',
+  baseBranch: 'master',
+};
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index aa5dca93440a6..90b2f5e56c9b7 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -2336,14 +2336,14 @@
       }
     },
     "@storybook/addon-actions": {
-      "version": "3.2.6",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-actions/-/addon-actions-3.2.6.tgz",
-      "integrity": "sha512-YuWOyC/sLvD2kicVem7JVAaFmnWmOXZI9OMWJHMjnH3znb6UjDpMQz5espDna/fF7rT9KEw9J+uwsM1rAxim1g=="
+      "version": "3.2.10",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-actions/-/addon-actions-3.2.10.tgz",
+      "integrity": "sha512-qdPllhjTQ1W3v04mdtPyko5oifez3c7Zp9zrDmQKwyqCkrik3UFTi0TL3LmKlGZivNnvdCrzP9lkOvd65i+k3A=="
     },
     "@storybook/addon-links": {
-      "version": "3.2.6",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-links/-/addon-links-3.2.6.tgz",
-      "integrity": "sha512-6Vl5S+pTVJDKyGymn8v6IQwUkhO2PbHk14y0rmvQ93ivIWeoonA0H0TdDWSgLiuyMpqxxKu3f0tiZfLVnuSSpg=="
+      "version": "3.2.10",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-links/-/addon-links-3.2.10.tgz",
+      "integrity": "sha512-0Jf8OzWyUYd/v0mRJbyhgujphSvLvX1OpZGV1CWp6nzmQMo7lJHsjZyw+N9vo+UES9r8XuDV91vvKpqetP4aow=="
     },
     "@storybook/addon-options": {
       "version": "3.2.3",
@@ -2351,29 +2351,29 @@
       "integrity": "sha1-6jdA0onUKc52fpaZvzpkfddBWS0="
     },
     "@storybook/addons": {
-      "version": "3.2.6",
-      "resolved": "https://registry.npmjs.org/@storybook/addons/-/addons-3.2.6.tgz",
-      "integrity": "sha512-i/sHbvEeMnnnLiPeXmE/b0OaVH5IM4U8CsdTh44RGjQVCnKstPpEhjD+hzPlhKFQnAtk9+vUxphvCWBgy6VouA=="
+      "version": "3.2.10",
+      "resolved": "https://registry.npmjs.org/@storybook/addons/-/addons-3.2.10.tgz",
+      "integrity": "sha512-TctnzBSvUWRO+v0HxF+gcf4Jjql7VcIpKqEDerdGykPYoXR+l/dQP/59B1R476eHuZecqMO/yl67qB+hJuI/Xg=="
     },
     "@storybook/channel-postmessage": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/@storybook/channel-postmessage/-/channel-postmessage-3.2.0.tgz",
-      "integrity": "sha1-YS/1MSC/JmZgy5MousmtZxIoovc="
+      "version": "3.2.10",
+      "resolved": "https://registry.npmjs.org/@storybook/channel-postmessage/-/channel-postmessage-3.2.10.tgz",
+      "integrity": "sha512-+XzW6hLoO/CZUqLjRQ+asDWPWVwEWFhrmgUKSWGew13U/8EAsNSeOmNh3NHjHrxu1yhPS1lSW+desKGCee4qLQ=="
     },
     "@storybook/channels": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-3.2.0.tgz",
-      "integrity": "sha1-11OVIS23a0njM19QzOW8djzwtcY="
+      "version": "3.2.10",
+      "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-3.2.10.tgz",
+      "integrity": "sha512-PKMn1B1L4REUNK77naWd/m3qJEmlV27Ve1RNRw1xnPJyMRrd+nuMvvjXDu/7kPm1Sg3wpl41khJv/EuJg446Zw=="
     },
     "@storybook/components": {
-      "version": "3.2.7",
-      "resolved": "https://registry.npmjs.org/@storybook/components/-/components-3.2.7.tgz",
-      "integrity": "sha1-fUxyIYUSYOQja7s++CpklLI+Xsk="
+      "version": "3.2.10",
+      "resolved": "https://registry.npmjs.org/@storybook/components/-/components-3.2.10.tgz",
+      "integrity": "sha512-T46B6ej2u/AqhMfB+dggmq4orUMAtponTjYDheYKUBQ6NSubh1H+85gx3FZepmnmJsM9UicV5Yc43wTUYf07xw=="
     },
     "@storybook/react": {
-      "version": "3.2.8",
-      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-3.2.8.tgz",
-      "integrity": "sha1-fUPvRQVZt887PswXzFTVoJ1epAI=",
+      "version": "3.2.10",
+      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-3.2.10.tgz",
+      "integrity": "sha512-YSFX3T2Me7XVQMt0sYbvBQsqkoYEEs4ez3iqyt5bVuD9KTKsfu45zrehagjhiV3HHLIZ3utHpggxCIKRGaWeLA==",
       "dependencies": {
         "style-loader": {
           "version": "0.17.0",
@@ -2388,9 +2388,9 @@
       "integrity": "sha1-KWHoofbBr8zpfp6aFNHf6dkGEIc="
     },
     "@storybook/ui": {
-      "version": "3.2.7",
-      "resolved": "https://registry.npmjs.org/@storybook/ui/-/ui-3.2.7.tgz",
-      "integrity": "sha1-wH3VUj4sg9n4rFp5gsMFzFnzTng="
+      "version": "3.2.10",
+      "resolved": "https://registry.npmjs.org/@storybook/ui/-/ui-3.2.10.tgz",
+      "integrity": "sha512-aV1CE9Sx0OuoWfbGrJHBTez0KFSJJorjoeMctncpkV8pAl7V0cSWyLkE6UQeWEXjw2SW2dk5Zhg1EHYKA8lv1A=="
     },
     "@types/chai": {
       "version": "3.4.35",
@@ -2488,9 +2488,9 @@
       "integrity": "sha512-Qmye+KeUqScYCPpCFgOQmOshIelXFhokEFNSa4PIVZMWYjl3JfpXDRogEL8gRgyl3qC4fcZas4GJxPfGswifyA=="
     },
     "@uifabric/utilities": {
-      "version": "4.13.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.13.1.tgz",
-      "integrity": "sha512-jGSQ3E+GXey1N6y3wvKX+7D3dexf4vKZOybdynEu7i6ZZMaQzTuQwsQp4kmaneFS4edylfhNWcHebgKKPAbGxA=="
+      "version": "4.14.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.14.0.tgz",
+      "integrity": "sha512-+eUtdE/WeY1PidLwLZZhxtHEMMyHFz5GYjtBSVEtPTifkoa8jEl0PZmQjs0tbhXQcSb0tHSKGX0FVPtxPMe5Hw=="
     },
     "abab": {
       "version": "1.0.4",
@@ -4139,16 +4139,9 @@
       "integrity": "sha512-5oNkD/L++l0O6xGXxb1EWS7SivtjfGQlRyxJsYgE0Z495/L81e2h4/d3r969hoPXuFItzNOKMtsXgYG4c7dYvw=="
     },
     "connect": {
-      "version": "3.6.4",
-      "resolved": "https://registry.npmjs.org/connect/-/connect-3.6.4.tgz",
-      "integrity": "sha1-UuoZw4YHMYeEJpKXsCGO0HSgFoc=",
-      "dependencies": {
-        "debug": {
-          "version": "2.6.8",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
-          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
-        }
-      }
+      "version": "3.6.5",
+      "resolved": "https://registry.npmjs.org/connect/-/connect-3.6.5.tgz",
+      "integrity": "sha1-+43ee6B2OHfQ7J352sC0tA5yx9o="
     },
     "connect-history-api-fallback": {
       "version": "1.3.0",
@@ -5182,16 +5175,9 @@
       "integrity": "sha1-1USBHUKPmOsGpj3EAtJAPDKMOPc="
     },
     "finalhandler": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.5.tgz",
-      "integrity": "sha1-pwEwPSV6G8gv6lR6M+WuiVMXI98=",
-      "dependencies": {
-        "debug": {
-          "version": "2.6.8",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
-          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
-        }
-      }
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.6.tgz",
+      "integrity": "sha1-AHrqM9Gk0+QgF/YkhIrVjSEvgU8="
     },
     "find-cache-dir": {
       "version": "1.0.0",
@@ -7777,9 +7763,9 @@
       "integrity": "sha1-43rwTiOwkfZTYNsknbi7DzEpH2A="
     },
     "office-ui-fabric-react": {
-      "version": "4.49.1",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.49.1.tgz",
-      "integrity": "sha512-juFtnQq/NXcW4sxQzjEiZv5FlbSLHWnrOsnP0P4Uk/lHEUDN9tT/SFn6n/W1U1StGq5rjgAG8Ore7WDyEg5fhA=="
+      "version": "4.50.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.50.0.tgz",
+      "integrity": "sha512-UHrhSH1f51CANm9vRNeQb37hnrpj6lrVtZXy6nE8DUoTtAtLizEGkXUHRZ/3RsqIk+8cTpyf9QY0tW51cZYKtQ=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -9728,9 +9714,9 @@
       "integrity": "sha1-D0WEKVxTo2KK9+bXmsohzlfRxuc="
     },
     "rtl-css-js": {
-      "version": "1.4.2",
-      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.4.2.tgz",
-      "integrity": "sha512-B8FeAyK3MLawmJK5BD1qo52MzNoOZw2FjoO43SkU0PQXX2v4H6jd+mRgpk7a78FgxNq4cbdbZudyD+uPGKJXHg=="
+      "version": "1.4.3",
+      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.4.3.tgz",
+      "integrity": "sha512-m8FfSBESumTy3z02xPghMMvtOEgXfZTSSX80VRAktiZUOkCVjPe4qN2aFtMo8GV4L1CUHWXc0Ib6D7b5Na9MNQ=="
     },
     "safe-buffer": {
       "version": "5.1.1",

From 9ad03692ce2dd56df6c5f87b4f9fb3f90eb01b1c Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Fri, 22 Sep 2017 18:35:38 -0700
Subject: [PATCH 0708/1641] Theme Generator: have headings theme (#2933)

* make sure headings theme

* change file
---
 ...phkuo-themeGeneratorHeadings_2017-09-23-00-44.json | 11 +++++++++++
 .../components/ThemeGenerator/ThemeGeneratorPage.scss |  3 +++
 2 files changed, 14 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/phkuo-themeGeneratorHeadings_2017-09-23-00-44.json

diff --git a/common/changes/office-ui-fabric-react/phkuo-themeGeneratorHeadings_2017-09-23-00-44.json b/common/changes/office-ui-fabric-react/phkuo-themeGeneratorHeadings_2017-09-23-00-44.json
new file mode 100644
index 0000000000000..34246eba0bb59
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/phkuo-themeGeneratorHeadings_2017-09-23-00-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "make headings on theme generator page theme",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.scss b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.scss
index 62ca291459523..a03b7501d462b 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.scss
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.scss
@@ -3,6 +3,9 @@
 
 .ms-themer {
   padding: 12px;
+  h2, h3, h4 {
+    color: $ms-color-black;
+  }
 }
 .ms-themer h3 {
   margin: 0;

From 7074f1821c81f41b6508d8a2e373f3a4257e0291 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Fri, 22 Sep 2017 18:43:23 -0700
Subject: [PATCH 0709/1641] ContextualMenu examples - syncing with toolkit -
 plus a couple small website bugs (#2934)

* Contextual menu changes

* XD Toolkit link update

* Split button height still off

* Added change file

* Removed unused variable
---
 .../src/pages/ResourcesPage/ResourcesPage.tsx |   2 +-
 ...ntextualmenu-toolkit_2017-09-22-23-36.json |  11 ++
 .../src/common/_semanticColorVariables.scss   |   6 +-
 .../Button/examples/Button.Split.Example.tsx  |   3 +-
 .../ContextualMenu/ContextualMenuPage.tsx     |  46 ++++--
 .../examples/ContextualMenu.Basic.Example.tsx | 139 +-----------------
 .../ContextualMenu.Customization.Example.tsx  |  14 --
 .../ContextualMenu.Directional.Example.tsx    | 109 ++------------
 .../examples/ContextualMenu.Icon.Example.tsx  |  91 ++++++++++++
 .../ContextualMenu.Section.Example.tsx        | 124 ++--------------
 .../ContextualMenu.Submenu.Example.tsx        |  75 ++++++++++
 .../examples/ContextualMenuExample.scss       |   2 +-
 12 files changed, 256 insertions(+), 366 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/contextualmenu-toolkit_2017-09-22-23-36.json
 create mode 100644 packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Submenu.Example.tsx

diff --git a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
index 5c32ab80778f2..4e36fe65274e5 100644
--- a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
+++ b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
@@ -44,7 +44,7 @@ export class ResourcesPage extends React.Component<any, any> {
                 <h3>Design Toolkit</h3>
                 <p>The Fabric design toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences.</p>
                 <ul>
-                  <li><a className={ styles.relatedLink } href='https://static2.sharepointonline.com/files/fabric/fabric-website/files/officeuifabric.xd'>Adobe XD Toolkit</a></li>
+                  <li><a className={ styles.relatedLink } href='https://static2.sharepointonline.com/files/fabric/fabric-website/files/officeuifabric.zip'>Adobe XD Toolkit</a></li>
                   <li><a className={ styles.relatedLink } href='https://microsoft.sharepoint.com/teams/OfficeUIFabric97'>Adobe XD Toolkit (Microsoft employees)</a></li>
                 </ul>
 
diff --git a/common/changes/office-ui-fabric-react/contextualmenu-toolkit_2017-09-22-23-36.json b/common/changes/office-ui-fabric-react/contextualmenu-toolkit_2017-09-22-23-36.json
new file mode 100644
index 0000000000000..a5255b82b8a18
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/contextualmenu-toolkit_2017-09-22-23-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Updated ContextualMenu examples and page to better reflect the XD Toolkit.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss b/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
index ba91bb9502352..8da4afc2594e1 100644
--- a/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
+++ b/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
@@ -73,15 +73,15 @@ $controlBorderSelectedHoverColor: $ms-color-themePrimary;
 /*** Menus ***/
 $menuBackgroundColor: $ms-color-white;
 $menuBackgroundHoverColor: $ms-color-neutralLighter;
-$menuBackgroundSelectedColor: $ms-color-neutralQuaternaryAlt;
+$menuBackgroundSelectedColor: $ms-color-neutralLight;
 
 $menuTextColor: $ms-color-neutralPrimary;
 $menuTextSelectedColor: $ms-color-black;
 $menuTextDisabledColor: $ms-color-neutralTertiaryAlt;
 
-$menuIconColor: $ms-color-themePrimary;
+$menuIconColor: $ms-color-themeDarkAlt;
 
-$menuHeaderColor: $ms-color-themePrimary;
+$menuHeaderColor: $ms-color-themeDarkAlt;
 
 $menuDividerColor: $ms-color-neutralLight;
 
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
index 6c562ee105d25..92e7820b61b5b 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
@@ -22,7 +22,7 @@ export class ButtonSplitExample extends React.Component<IButtonProps, {}> {
             text='Create account'
             onClick={ () => alert('Clicked') }
             split={ true }
-            style={ { height: '32px' } }
+            style={ { height: '35px' } }
             menuProps={ {
               items: [
                 {
@@ -49,6 +49,7 @@ export class ButtonSplitExample extends React.Component<IButtonProps, {}> {
             text='Create account'
             onClick={ () => alert('Clicked') }
             split={ true }
+            style={ { height: '35px' } }
             menuProps={ {
               items: [
                 {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
index cfa26705a07ae..e4a6b6f4d8823 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
@@ -6,20 +6,22 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { ContextualMenuBasicExample } from './examples/ContextualMenu.Basic.Example';
+import { ContextualMenuIconExample } from './examples/ContextualMenu.Icon.Example';
 import { ContextualMenuSectionExample } from './examples/ContextualMenu.Section.Example';
+import { ContextualMenuSubmenuExample } from './examples/ContextualMenu.Submenu.Example';
 import { ContextualMenuCheckmarksExample } from './examples/ContextualMenu.Checkmarks.Example';
 import { ContextualMenuDirectionalExample } from './examples/ContextualMenu.Directional.Example';
 import { ContextualMenuCustomizationExample } from './examples/ContextualMenu.Customization.Example';
-import { ContextualMenuHeaderExample } from './examples/ContextualMenu.Header.Example';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { ContextualMenuStatus } from './ContextualMenu.checklist';
 
 const ContextualMenuBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx') as string;
+const ContextualMenuIconExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.Example.tsx') as string;
 const ContextualMenuSectionExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx') as string;
+const ContextualMenuSubmenuExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Submenu.Example.tsx') as string;
 const ContextualMenuCheckmarksExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx') as string;
 const ContextualMenuDirectionalExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx') as string;
 const ContextualMenuCustomizationExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx') as string;
-const ContextualMenuHeaderExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Header.Example.tsx') as string;
 
 export class ContextualMenuPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
@@ -29,24 +31,48 @@ export class ContextualMenuPage extends React.Component<IComponentDemoPageProps,
         componentName='ContextualMenuExample'
         exampleCards={
           <div>
-            <ExampleCard title='Default ContextualMenu' code={ ContextualMenuBasicExampleCode }>
+            <ExampleCard
+              title='Default ContextualMenu'
+              code={ ContextualMenuBasicExampleCode }
+            >
               <ContextualMenuBasicExample />
             </ExampleCard>
-            <ExampleCard title='ContextualMenu section example' code={ ContextualMenuSectionExampleCode }>
+            <ExampleCard
+              title='ContextualMenu with icons'
+              code={ ContextualMenuIconExampleCode }
+            >
+              <ContextualMenuIconExample />
+            </ExampleCard>
+            <ExampleCard
+              title='ContextualMenu with submenus'
+              code={ ContextualMenuSubmenuExampleCode }
+            >
+              <ContextualMenuSubmenuExample />
+            </ExampleCard>
+            <ExampleCard
+              title='ContextualMenu with section headers'
+              code={ ContextualMenuSectionExampleCode }
+            >
               <ContextualMenuSectionExample />
             </ExampleCard>
-            <ExampleCard title='ContextualMenu with checked menus' code={ ContextualMenuCheckmarksExampleCode }>
+            <ExampleCard
+              title='ContextualMenu with checkable menu items'
+              code={ ContextualMenuCheckmarksExampleCode }
+            >
               <ContextualMenuCheckmarksExample />
             </ExampleCard>
-            <ExampleCard title='ContextualMenu with beak/direction test' code={ ContextualMenuDirectionalExampleCode }>
+            <ExampleCard
+              title='ContextualMenu with beak and directional settings'
+              code={ ContextualMenuDirectionalExampleCode }
+            >
               <ContextualMenuDirectionalExample />
             </ExampleCard>
-            <ExampleCard title='ContextualMenu with customization' code={ ContextualMenuCustomizationExampleCode }>
+            <ExampleCard
+              title='ContextualMenu with customized submenus'
+              code={ ContextualMenuCustomizationExampleCode }
+            >
               <ContextualMenuCustomizationExample />
             </ExampleCard>
-            <ExampleCard title='ContextualMenu with header' code={ ContextualMenuHeaderExampleCode }>
-              <ContextualMenuHeaderExample />
-            </ExampleCard>
           </div>
         }
         propertiesTables={
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx
index 64eb9cdcb64f3..5132572e3f856 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import { ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
-import { Callout } from 'office-ui-fabric-react/lib/Callout';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import './ContextualMenuExample.scss';
 
@@ -14,52 +13,18 @@ export class ContextualMenuBasicExample extends React.Component<any, any> {
   }
 
   public render() {
-    let { showCallout } = this.state;
-
     return (
       <div>
         <DefaultButton
           id='ContextualMenuButton1'
           text='Click for ContextualMenu'
           menuProps={ {
-            title: 'My Menu',
             shouldFocusOnMount: true,
             items: [
               {
                 key: 'newItem',
-                iconProps: {
-                  iconName: 'Add'
-                },
-                subMenuProps: {
-                  items: [
-                    {
-                      key: 'emailMessage',
-                      name: 'Email message',
-                      title: 'Create an email'
-                    },
-                    {
-                      key: 'calendarEvent',
-                      name: 'Calendar event',
-                      title: 'Create a calendar event',
-                    }
-                  ],
-                },
                 name: 'New'
               },
-              {
-                key: 'upload',
-                onClick: () => {
-                  this.setState({ showCallout: true });
-                },
-                iconProps: {
-                  iconName: 'Upload',
-                  style: {
-                    color: 'salmon'
-                  }
-                },
-                name: 'Upload (Custom Color)',
-                title: 'Upload a file'
-              },
               {
                 key: 'divider_1',
                 itemType: ContextualMenuItemType.Divider
@@ -68,6 +33,10 @@ export class ContextualMenuBasicExample extends React.Component<any, any> {
                 key: 'rename',
                 name: 'Rename'
               },
+              {
+                key: 'edit',
+                name: 'Edit'
+              },
               {
                 key: 'properties',
                 name: 'Properties'
@@ -75,105 +44,11 @@ export class ContextualMenuBasicExample extends React.Component<any, any> {
               {
                 key: 'disabled',
                 name: 'Disabled item',
-                disabled: true,
-              },
-              {
-                key: 'divider_2',
-                itemType: ContextualMenuItemType.Divider
-              },
-              {
-                key: 'share',
-                iconProps: {
-                  iconName: 'Share'
-                },
-                subMenuProps: {
-                  items: [
-                    {
-                      key: 'sharetoemail',
-                      name: 'Share to Email',
-                      iconProps: {
-                        iconName: 'Mail'
-                      },
-                    },
-                    {
-                      key: 'sharetofacebook',
-                      name: 'Share to Facebook',
-                    },
-                    {
-                      key: 'sharetotwitter',
-                      name: 'Share to Twitter',
-                      iconProps: {
-                        iconName: 'Share'
-                      },
-                      subMenuProps: {
-                        items: [
-                          {
-                            key: 'sharetoemail_1',
-                            name: 'Share to Email',
-                            title: 'Share to Email',
-                            iconProps: {
-                              iconName: 'Mail'
-                            },
-                          },
-                          {
-                            key: 'sharetofacebook_1',
-                            name: 'Share to Facebook',
-                            title: 'Share to Facebook',
-                          },
-                          {
-                            key: 'sharetotwitter_1',
-                            name: 'Share to Twitter',
-                            title: 'Share to Twitter',
-                            iconProps: {
-                              iconName: 'Share'
-                            }
-                          },
-                        ],
-                      },
-                    },
-                  ],
-                },
-                name: 'Share'
-              },
-              {
-                key: 'print',
-                iconProps: {
-                  iconName: 'Print'
-                },
-                name: 'Print'
-              },
-              {
-                key: 'music',
-                iconProps: {
-                  iconName: 'MusicInCollectionFill'
-                },
-                name: 'Music',
-              },
-              {
-                key: 'divider_3',
-                itemType: ContextualMenuItemType.Divider,
-              },
-              {
-                key: 'Bing',
-                name: 'Go to Bing',
-                target: '_blank',
-                href: 'http://www.bing.com'
-              },
+                disabled: true
+              }
             ]
-          }
-          }
+          } }
         />
-        { showCallout && (
-          <Callout
-            setInitialFocus={ true }
-            onDismiss={ () => this.setState({ showCallout: false }) }
-          >
-            <DefaultButton
-              onClick={ () => this.setState({ showCallout: false }) }
-              text='Hello world'
-            />
-          </Callout>
-        ) }
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
index e099000a59cf0..ab476799a39f4 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
@@ -23,24 +23,10 @@ export class ContextualMenuCustomizationExample extends React.Component<{}, {}>
             [
               {
                 key: 'newItem',
-                icon: 'Add',
-                subMenuProps: {
-                  items: [
-                    {
-                      key: 'emailMessage',
-                      name: 'Email message',
-                    },
-                    {
-                      key: 'calendarEvent',
-                      name: 'Calendar event',
-                    }
-                  ],
-                },
                 name: 'New'
               },
               {
                 key: 'upload',
-                icon: 'Upload',
                 name: 'Upload'
               },
               {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
index cd3e7d2f1f27c..b49a7ee5d1081 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
@@ -3,7 +3,6 @@ import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { DirectionalHint, ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
 import { Dropdown, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
-import { Slider } from 'office-ui-fabric-react/lib/Slider';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
 import { autobind, getRTL } from 'office-ui-fabric-react/lib/Utilities';
 import './ContextualMenuExample.scss';
@@ -53,7 +52,7 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
       directionalHintForRTL: DirectionalHint.bottomLeftEdge,
       useDirectionalHintForRtl: false,
       gapSpace: 0,
-      beakWidth: 10,
+      beakWidth: 20,
       edgeFixed: false
     };
   }
@@ -78,27 +77,6 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
             checked={ isBeakVisible }
             onChange={ this._onShowBeakChange }
           />
-          <Checkbox
-            className={ exampleStyles.exampleCheckbox }
-            label='Fix Edge'
-            checked={ edgeFixed }
-            onChange={ this._onFixEdgeChange }
-          />
-          <Slider
-            max={ 20 }
-            label='Gap Space'
-            min={ 0 }
-            defaultValue={ 0 }
-            onChange={ this._onGapSlider }
-          />
-          { isBeakVisible &&
-            (<Slider
-              max={ 50 }
-              label='Beak Width'
-              min={ 10 }
-              defaultValue={ 10 }
-              onChange={ this._onBeakWidthSlider }
-            />) }
           <Dropdown
             label='Directional hint'
             selectedKey={ DirectionalHint[directionalHint!] }
@@ -128,72 +106,32 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
               gapSpace: gapSpace,
               beakWidth: beakWidth,
               directionalHintFixed: edgeFixed,
-              items:
-              [
+              items: [
                 {
                   key: 'newItem',
-                  name: 'New',
-                  icon: 'Add',
-                  subMenuProps: {
-                    items: [
-                      {
-                        key: 'emailMessage',
-                        name: 'Email message',
-                      },
-                      {
-                        key: 'calendarEvent',
-                        name: 'Calendar event',
-                      }
-                    ]
-                  },
-                },
-                {
-                  key: 'upload',
-                  name: 'Upload',
-                  icon: 'Upload'
-                },
-                {
-                  key: 'rename',
-                  name: 'Rename',
+                  name: 'New'
                 },
                 {
-                  key: '-',
+                  key: 'divider_1',
                   itemType: ContextualMenuItemType.Divider
                 },
                 {
-                  key: 'share',
-                  name: 'Share',
-                  icon: 'Share',
-                  items: [
-                    {
-                      key: 'sharetoemail',
-                      name: 'Share to Email',
-                      icon: 'Mail'
-                    },
-                    {
-                      key: 'sharetofacebook',
-                      name: 'Share to Facebook',
-                    },
-                    {
-                      key: 'sharetotwitter',
-                      name: 'Share to Twitter',
-                      icon: 'Share'
-                    },
-                  ]
-                },
-                {
-                  key: 'print',
-                  name: 'Print',
-                  icon: 'Print'
+                  key: 'rename',
+                  name: 'Rename'
                 },
                 {
-                  key: 'display',
-                  name: 'display'
+                  key: 'edit',
+                  name: 'Edit'
                 },
                 {
                   key: 'properties',
                   name: 'Properties'
                 },
+                {
+                  key: 'disabled',
+                  name: 'Disabled item',
+                  disabled: true
+                }
               ]
             }
             }
@@ -210,13 +148,6 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
     });
   }
 
-  @autobind
-  private _onFixEdgeChange(ev: React.FormEvent<HTMLElement>, isVisible: boolean) {
-    this.setState({
-      edgeFixed: isVisible
-    });
-  }
-
   @autobind
   private _onUseRtlHintChange(ev: React.FormEvent<HTMLElement>, isVisible: boolean) {
     this.setState({
@@ -238,18 +169,4 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
     });
   }
 
-  @autobind
-  private _onGapSlider(value: number) {
-    this.setState({
-      gapSpace: value
-    });
-  }
-
-  @autobind
-  private _onBeakWidthSlider(value: number) {
-    this.setState({
-      beakWidth: value
-    });
-  }
-
 }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.Example.tsx
new file mode 100644
index 0000000000000..a91f55bd29616
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.Example.tsx
@@ -0,0 +1,91 @@
+import * as React from 'react';
+import { ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { Callout } from 'office-ui-fabric-react/lib/Callout';
+import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
+import './ContextualMenuExample.scss';
+
+export class ContextualMenuIconExample extends React.Component<any, any> {
+
+  constructor() {
+    super();
+    this.state = {
+      showCallout: false
+    };
+  }
+
+  public render() {
+    let { showCallout } = this.state;
+
+    return (
+      <div>
+        <DefaultButton
+          id='ContextualMenuButton2'
+          text='Click for ContextualMenu'
+          menuProps={ {
+            shouldFocusOnMount: true,
+            items: [
+              {
+                key: 'newItem',
+                iconProps: {
+                  iconName: 'Add'
+                },
+                name: 'New'
+              },
+              {
+                key: 'upload',
+                onClick: () => {
+                  this.setState({ showCallout: true });
+                },
+                iconProps: {
+                  iconName: 'Upload',
+                  style: {
+                    color: 'salmon'
+                  }
+                },
+                name: 'Upload (Click for popup)',
+                title: 'Upload a file'
+              },
+              {
+                key: 'divider_1',
+                itemType: ContextualMenuItemType.Divider
+              },
+              {
+                key: 'share',
+                iconProps: {
+                  iconName: 'Share'
+                },
+                name: 'Share'
+              },
+              {
+                key: 'print',
+                iconProps: {
+                  iconName: 'Print'
+                },
+                name: 'Print'
+              },
+              {
+                key: 'music',
+                iconProps: {
+                  iconName: 'MusicInCollectionFill'
+                },
+                name: 'Music',
+              }
+            ]
+          }
+          }
+        />
+        { showCallout && (
+          <Callout
+            setInitialFocus={ true }
+            onDismiss={ () => this.setState({ showCallout: false }) }
+          >
+            <DefaultButton
+              onClick={ () => this.setState({ showCallout: false }) }
+              text='Hello Popup'
+            />
+          </Callout>
+        ) }
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx
index 4f95bf2fab327..696a02cce5a65 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx
@@ -1,28 +1,17 @@
 import * as React from 'react';
 import { ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
-import { Callout } from 'office-ui-fabric-react/lib/Callout';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import './ContextualMenuExample.scss';
 
 export class ContextualMenuSectionExample extends React.Component<any, any> {
 
-  constructor() {
-    super();
-    this.state = {
-      showCallout: false
-    };
-  }
-
   public render() {
-    let { showCallout } = this.state;
-
     return (
       <div>
         <DefaultButton
           id='ContextualMenuButton1'
           text='Click for ContextualMenu'
           menuProps={ {
-            title: 'My Menu',
             items:
             [
               {
@@ -36,37 +25,10 @@ export class ContextualMenuSectionExample extends React.Component<any, any> {
                     {
                       key: 'newItem',
                       name: 'New',
-                      iconProps: {
-                        iconName: 'Add'
-                      },
-                      subMenuProps: {
-                        items: [
-                          {
-                            key: 'emailMessage',
-                            name: 'Email message',
-                            title: 'Create an email'
-                          },
-                          {
-                            key: 'calendarEvent',
-                            name: 'Calendar event',
-                            title: 'Create a calendar event',
-                          }
-                        ],
-                      }
                     },
                     {
-                      key: 'upload',
-                      onClick: () => {
-                        this.setState({ showCallout: true });
-                      },
-                      iconProps: {
-                        iconName: 'Upload',
-                        style: {
-                          color: 'salmon'
-                        }
-                      },
-                      name: 'Upload (Custom Color)',
-                      title: 'Upload a file'
+                      key: 'deleteItem',
+                      name: 'Delete',
                     }
                   ]
                 }
@@ -79,73 +41,30 @@ export class ContextualMenuSectionExample extends React.Component<any, any> {
                   items: [
                     {
                       key: 'share',
-                      iconProps: {
-                        iconName: 'Share'
-                      },
-                      subMenuProps: {
-                        items: [
-                          {
-                            key: 'sharetoemail',
-                            name: 'Share to Email',
-                            iconProps: {
-                              iconName: 'Mail'
-                            },
-                          },
-                          {
-                            key: 'sharetofacebook',
-                            name: 'Share to Facebook',
-                          },
-                          {
-                            key: 'sharetotwitter',
-                            name: 'Share to Twitter',
-                            iconProps: {
-                              iconName: 'Share'
-                            },
-                            subMenuProps: {
-                              items: [
-                                {
-                                  key: 'sharetoemail_1',
-                                  name: 'Share to Email',
-                                  title: 'Share to Email',
-                                  iconProps: {
-                                    iconName: 'Mail'
-                                  },
-                                },
-                                {
-                                  key: 'sharetofacebook_1',
-                                  name: 'Share to Facebook',
-                                  title: 'Share to Facebook',
-                                },
-                                {
-                                  key: 'sharetotwitter_1',
-                                  name: 'Share to Twitter',
-                                  title: 'Share to Twitter',
-                                  iconProps: {
-                                    iconName: 'Share'
-                                  }
-                                },
-                              ],
-                            },
-                          },
-                        ],
-                      },
                       name: 'Share'
                     },
                     {
                       key: 'print',
-                      iconProps: {
-                        iconName: 'Print'
-                      },
                       name: 'Print'
                     },
                     {
                       key: 'music',
-                      iconProps: {
-                        iconName: 'MusicInCollectionFill'
-                      },
                       name: 'Music',
                     },
-
+                  ]
+                }
+              },
+              {
+                key: 'section',
+                itemType: ContextualMenuItemType.Section,
+                sectionProps: {
+                  title: 'Navigation',
+                  items: [
+                    {
+                      key: 'Bing',
+                      name: 'Go to Bing',
+                      href: 'http://www.bing.com'
+                    }
                   ]
                 }
               }
@@ -153,17 +72,6 @@ export class ContextualMenuSectionExample extends React.Component<any, any> {
           }
           }
         />
-        { showCallout && (
-          <Callout
-            setInitialFocus={ true }
-            onDismiss={ () => this.setState({ showCallout: false }) }
-          >
-            <DefaultButton
-              onClick={ () => this.setState({ showCallout: false }) }
-              text='Hello world'
-            />
-          </Callout>
-        ) }
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Submenu.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Submenu.Example.tsx
new file mode 100644
index 0000000000000..5fc9baa0101fa
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Submenu.Example.tsx
@@ -0,0 +1,75 @@
+import * as React from 'react';
+import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
+import './ContextualMenuExample.scss';
+
+export class ContextualMenuSubmenuExample extends React.Component<any, any> {
+
+  public render() {
+    return (
+      <div>
+        <DefaultButton
+          id='ContextualMenuButton2'
+          text='Click for ContextualMenu'
+          menuProps={ {
+            shouldFocusOnMount: true,
+            items: [
+              {
+                key: 'newItem',
+                subMenuProps: {
+                  items: [
+                    {
+                      key: 'emailMessage',
+                      name: 'Email message',
+                      title: 'Create an email'
+                    },
+                    {
+                      key: 'calendarEvent',
+                      name: 'Calendar event',
+                      title: 'Create a calendar event',
+                    }
+                  ],
+                },
+                name: 'New'
+              },
+              {
+                key: 'share',
+                subMenuProps: {
+                  items: [
+                    {
+                      key: 'sharetotwitter',
+                      name: 'Share to Twitter',
+                    },
+                    {
+                      key: 'sharetofacebook',
+                      name: 'Share to Facebook',
+                    },
+                    {
+                      key: 'sharetoemail',
+                      name: 'Share to Email',
+                      subMenuProps: {
+                        items: [
+                          {
+                            key: 'sharetooutlook_1',
+                            name: 'Share to Outlook',
+                            title: 'Share to Outlook',
+                          },
+                          {
+                            key: 'sharetogmail_1',
+                            name: 'Share to Gmail',
+                            title: 'Share to Gmail',
+                          }
+                        ],
+                      },
+                    },
+                  ],
+                },
+                name: 'Share'
+              }
+            ]
+          }
+          }
+        />
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenuExample.scss b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenuExample.scss
index 3427617b297da..83e08bc27f6d4 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenuExample.scss
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenuExample.scss
@@ -15,7 +15,7 @@
       position: absolute;
       vertical-align: top;
       width: 300px;
-      top: 108px;
+      top: 70px;
       margin: 0 100px;
       text-align: center;
   }

From 71131b5967a61747ca817e7205490be124fc4d5e Mon Sep 17 00:00:00 2001
From: "Bryan J. R. Gislason" <bryan-gislason@users.noreply.github.com>
Date: Sat, 23 Sep 2017 00:57:34 -0700
Subject: [PATCH 0710/1641] Dropdown: Add positioning wrapper to caretDown
 (#2930)

* Dropdown: Add positioning wrapper to caretDown

* Add change request file
---
 .../dropdown-update_2017-09-22-21-30.json             | 11 +++++++++++
 .../src/components/Dropdown/Dropdown.scss             | 11 +++++++----
 .../src/components/Dropdown/Dropdown.tsx              |  4 +++-
 .../Dropdown/examples/Dropdown.Basic.Example.scss     |  7 -------
 .../Dropdown/examples/Dropdown.Custom.Example.tsx     |  2 +-
 5 files changed, 22 insertions(+), 13 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/dropdown-update_2017-09-22-21-30.json

diff --git a/common/changes/office-ui-fabric-react/dropdown-update_2017-09-22-21-30.json b/common/changes/office-ui-fabric-react/dropdown-update_2017-09-22-21-30.json
new file mode 100644
index 0000000000000..36ef095c6e8bf
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/dropdown-update_2017-09-22-21-30.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: Adds a positioning wrapper around the caretDown icon",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "brgisla@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
index 1fbe031b8671d..3dad9809f583a 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
@@ -102,17 +102,20 @@ $DropDown-item-height: 32px;
   }
 }
 
-.caretDown {
-  color: $ms-color-neutralDark;
-  font-size: $ms-icon-size-s;
+.caretDownWrapper {
   position: absolute;
   top: 1px; // border
   @include ms-right(12px);
-  pointer-events: none;
   height: $DropDown-height;
   line-height: $DropDown-height - 2px; // height minus the border
 }
 
+.caretDown {
+  color: $ms-color-neutralDark;
+  font-size: $ms-icon-size-s;
+  pointer-events: none;
+}
+
 // Style the new, replacement component
 .title {
   @include ms-normalize;
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 5cf2306dde6bc..ea4628e2c8f3b 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -196,7 +196,9 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
                 onRenderPlaceHolder(this.props, this._onRenderPlaceHolder)
             }
           </span>
-          { onRenderCaretDown(this.props, this._onRenderCaretDown) }
+          <span className={ css('ms-Dropdown-caretDownWrapper', styles.caretDownWrapper) }>
+            { onRenderCaretDown(this.props, this._onRenderCaretDown) }
+          </span>
         </div>
         { isOpen && (
           onRenderContainer(this.props, this._onRenderContainer)
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss
index 581a6d3c111d5..08458ffadaad1 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss
@@ -8,11 +8,4 @@
   .dropdownExample-placeholder {
     display: flex;
   }
-  .dropdownExample-caretDownIcon {
-    right: 12px;
-    position: absolute;
-    top: 1px;
-    height: 32px;
-    line-height: 30px;
-  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
index c4b45457b8173..fbea2b97c9d6e 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
@@ -80,7 +80,7 @@ export class DropdownCustomExample extends React.Component<any, any> {
 
   private _onRenderCaretDown = (props: IDropdownProps): JSX.Element => {
     return (
-      <Icon className='dropdownExample-caretDownIcon' iconName='CirclePlus' />
+      <Icon iconName='CirclePlus' />
     );
   }
 

From 06de5ddaf93b8958ebd0fa5343ab36091b820505 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 23 Sep 2017 10:54:45 -0700
Subject: [PATCH 0711/1641] Adding saucelabs config to unblock ie11 testing.

---
 apps/vr-tests/screener.config.js | 27 +++++++++++++++++++++++++--
 1 file changed, 25 insertions(+), 2 deletions(-)

diff --git a/apps/vr-tests/screener.config.js b/apps/vr-tests/screener.config.js
index 06ce70285e5fb..2c65c241ed1f6 100644
--- a/apps/vr-tests/screener.config.js
+++ b/apps/vr-tests/screener.config.js
@@ -1,8 +1,31 @@
-module.exports = {
+let config = module.exports = {
   projectRepo: 'OfficeDev/office-ui-fabric-react',
   storybookConfigDir: '.storybook',
   apiKey: process.env.SCREENER_API_KEY,
   resolution: '1024x768',
   baseBranch: 'master',
   failureExitCode: 0
-};
\ No newline at end of file
+};
+
+// if (process.env.TRAVIS_BRANCH === 'master') {
+config.browsers = [
+  {
+    browserName: 'internet explorer',
+    version: '11.103'
+  },
+  {
+    browserName: 'chrome'
+  },
+  // {
+  //   browserName: 'firefox'
+  // },
+  // {
+  //   browserName: 'microsoftedge'
+  // }
+];
+
+config.sauce = {
+  username: 'dzearing',
+  accessKey: process.env.SAUCE_API_KEY
+};
+// }
\ No newline at end of file

From 83ec9a20f8957c74c43108f7feab10225bd52105 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 23 Sep 2017 11:18:36 -0700
Subject: [PATCH 0712/1641] Undoing config.

---
 apps/vr-tests/screener.config.js | 28 ++++++++++++++--------------
 1 file changed, 14 insertions(+), 14 deletions(-)

diff --git a/apps/vr-tests/screener.config.js b/apps/vr-tests/screener.config.js
index 2c65c241ed1f6..a42ac0c3ed88f 100644
--- a/apps/vr-tests/screener.config.js
+++ b/apps/vr-tests/screener.config.js
@@ -1,4 +1,4 @@
-let config = module.exports = {
+module.exports = {
   projectRepo: 'OfficeDev/office-ui-fabric-react',
   storybookConfigDir: '.storybook',
   apiKey: process.env.SCREENER_API_KEY,
@@ -8,24 +8,24 @@ let config = module.exports = {
 };
 
 // if (process.env.TRAVIS_BRANCH === 'master') {
-config.browsers = [
-  {
-    browserName: 'internet explorer',
-    version: '11.103'
-  },
-  {
-    browserName: 'chrome'
-  },
+// config.browsers = [
+//   {
+//     browserName: 'internet explorer',
+//     version: '11.103'
+//   },
+//   {
+//     browserName: 'chrome'
+//   },
   // {
   //   browserName: 'firefox'
   // },
   // {
   //   browserName: 'microsoftedge'
   // }
-];
+// ];
 
-config.sauce = {
-  username: 'dzearing',
-  accessKey: process.env.SAUCE_API_KEY
-};
+// config.sauce = {
+//   username: 'dzearing',
+//   accessKey: process.env.SAUCE_API_KEY
+// };
 // }
\ No newline at end of file

From 82f46e239a428fa9e890b403bf5ab22d10a765ed Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 25 Sep 2017 10:19:19 +0000
Subject: [PATCH 0713/1641] Applying package updates.

---
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../array-utils_2017-09-22-00-57.json         | 11 ------
 ...tton-updates-toolkit_2017-09-22-18-17.json | 11 ------
 ...ntextualmenu-toolkit_2017-09-22-23-36.json | 11 ------
 .../dropdown-update_2017-09-22-21-30.json     | 11 ------
 ...eGeneratorBackground_2017-09-22-20-51.json | 11 ------
 ...emeGeneratorHeadings_2017-09-23-00-44.json | 11 ------
 packages/experiments/package.json             |  4 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 39 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 13 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 +++++++
 packages/utilities/CHANGELOG.md               |  9 ++++-
 packages/utilities/package.json               |  2 +-
 18 files changed, 83 insertions(+), 78 deletions(-)
 delete mode 100644 common/changes/@uifabric/utilities/array-utils_2017-09-22-00-57.json
 delete mode 100644 common/changes/office-ui-fabric-react/button-updates-toolkit_2017-09-22-18-17.json
 delete mode 100644 common/changes/office-ui-fabric-react/contextualmenu-toolkit_2017-09-22-23-36.json
 delete mode 100644 common/changes/office-ui-fabric-react/dropdown-update_2017-09-22-21-30.json
 delete mode 100644 common/changes/office-ui-fabric-react/phkuo-themeGeneratorBackground_2017-09-22-20-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/phkuo-themeGeneratorHeadings_2017-09-23-00-44.json

diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index b501fa2974e09..2cbe500332a89 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.49.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.50.1 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 56d4d162dc40c..f24f86c3e116e 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -26,7 +26,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.49.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.50.1 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 95ebb7e09ca29..fc008a8444f0b 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -24,7 +24,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=4.49.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.50.1 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index bd1e8b911c37e..d5eff74129034 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.49.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.50.1 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/utilities/array-utils_2017-09-22-00-57.json b/common/changes/@uifabric/utilities/array-utils_2017-09-22-00-57.json
deleted file mode 100644
index c68b10e28a102..0000000000000
--- a/common/changes/@uifabric/utilities/array-utils_2017-09-22-00-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Array: Add utility functions for updating arrays immutably",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/button-updates-toolkit_2017-09-22-18-17.json b/common/changes/office-ui-fabric-react/button-updates-toolkit_2017-09-22-18-17.json
deleted file mode 100644
index 32564ece72e91..0000000000000
--- a/common/changes/office-ui-fabric-react/button-updates-toolkit_2017-09-22-18-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Reordered Buttons on ButtonPage and made some small style changes to match toolkit for website.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/contextualmenu-toolkit_2017-09-22-23-36.json b/common/changes/office-ui-fabric-react/contextualmenu-toolkit_2017-09-22-23-36.json
deleted file mode 100644
index a5255b82b8a18..0000000000000
--- a/common/changes/office-ui-fabric-react/contextualmenu-toolkit_2017-09-22-23-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Updated ContextualMenu examples and page to better reflect the XD Toolkit.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/dropdown-update_2017-09-22-21-30.json b/common/changes/office-ui-fabric-react/dropdown-update_2017-09-22-21-30.json
deleted file mode 100644
index 36ef095c6e8bf..0000000000000
--- a/common/changes/office-ui-fabric-react/dropdown-update_2017-09-22-21-30.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: Adds a positioning wrapper around the caretDown icon",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "brgisla@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/phkuo-themeGeneratorBackground_2017-09-22-20-51.json b/common/changes/office-ui-fabric-react/phkuo-themeGeneratorBackground_2017-09-22-20-51.json
deleted file mode 100644
index bcec603c17cf3..0000000000000
--- a/common/changes/office-ui-fabric-react/phkuo-themeGeneratorBackground_2017-09-22-20-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Theme Generator: have the bg change with the theme",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/phkuo-themeGeneratorHeadings_2017-09-23-00-44.json b/common/changes/office-ui-fabric-react/phkuo-themeGeneratorHeadings_2017-09-23-00-44.json
deleted file mode 100644
index 34246eba0bb59..0000000000000
--- a/common/changes/office-ui-fabric-react/phkuo-themeGeneratorHeadings_2017-09-23-00-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "make headings on theme generator page theme",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 3e2785e594b38..75b112350f9a9 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -42,8 +42,8 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/styling": ">=0.24.0 <1.0.0",
-    "@uifabric/utilities": ">=4.14.0 <5.0.0",
-    "office-ui-fabric-react": ">=4.50.0 <5.0.0",
+    "@uifabric/utilities": ">=4.14.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.50.1 <5.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index dcd8d78cbc49c..180a67e477dd0 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,45 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.50.1",
+      "tag": "office-ui-fabric-react_v4.50.1",
+      "date": "Mon, 25 Sep 2017 10:19:18 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "79df140f5e26af94aaeb4c64cd5848221ba37758",
+            "comment": "Reordered Buttons on ButtonPage and made some small style changes to match toolkit for website."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "7074f1821c81f41b6508d8a2e373f3a4257e0291",
+            "comment": "Updated ContextualMenu examples and page to better reflect the XD Toolkit."
+          },
+          {
+            "author": "Bryan J. R. Gislason <bryan-gislason@users.noreply.github.com>",
+            "commit": "71131b5967a61747ca817e7205490be124fc4d5e",
+            "comment": "Dropdown: Adds a positioning wrapper around the caretDown icon"
+          },
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "85ce9da2221b4aa66670800db12fa24c5a94c4fc",
+            "comment": "Theme Generator: have the bg change with the theme"
+          },
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "9ad03692ce2dd56df6c5f87b4f9fb3f90eb01b1c",
+            "comment": "make headings on theme generator page theme"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.14.0 <5.0.0` to `>=4.14.1 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.50.0",
       "tag": "office-ui-fabric-react_v4.50.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 1ff78879d35b1..d897c604d2f07 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 22 Sep 2017 19:08:51 GMT and should not be manually modified.
+This log was last generated on Mon, 25 Sep 2017 10:19:18 GMT and should not be manually modified.
+
+## 4.50.1
+Mon, 25 Sep 2017 10:19:18 GMT
+
+### Patches
+
+- Reordered Buttons on ButtonPage and made some small style changes to match toolkit for website.
+- Updated ContextualMenu examples and page to better reflect the XD Toolkit.
+- Dropdown: Adds a positioning wrapper around the caretDown icon
+- Theme Generator: have the bg change with the theme
+- make headings on theme generator page theme
 
 ## 4.50.0
 Fri, 22 Sep 2017 19:08:51 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 14046abd3de09..303fe1690964f 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.50.0",
+  "version": "4.50.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=4.14.0 <5.0.0",
+    "@uifabric/utilities": ">=4.14.1 <5.0.0",
     "@uifabric/styling": ">=0.24.0 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 2df37104d5e8b..e63b836743769 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -28,7 +28,7 @@
     "react-dom": "^15.4.2"
   },
   "dependencies": {
-    "@uifabric/utilities": ">=4.14.0 <5.0.0",
+    "@uifabric/utilities": ">=4.14.1 <5.0.0",
     "tslib": "^1.7.1",
     "rtl-css-js": "^1.1.3",
     "glamor": "^2.20.40"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 00d0e04d1f290..a9121ef6fd7ae 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.14.1",
+      "tag": "@uifabric/utilities_v4.14.1",
+      "date": "Mon, 25 Sep 2017 10:19:18 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "96722a134676c400b7a92461174f5e8a93f7d083",
+            "comment": "Array: Add utility functions for updating arrays immutably"
+          }
+        ]
+      }
+    },
     {
       "version": "4.14.0",
       "tag": "@uifabric/utilities_v4.14.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index b5f9ad6e75d70..8b39fc3e24bba 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Fri, 22 Sep 2017 19:08:51 GMT and should not be manually modified.
+This log was last generated on Mon, 25 Sep 2017 10:19:18 GMT and should not be manually modified.
+
+## 4.14.1
+Mon, 25 Sep 2017 10:19:18 GMT
+
+### Patches
+
+- Array: Add utility functions for updating arrays immutably
 
 ## 4.14.0
 Fri, 22 Sep 2017 19:08:51 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 22238705cf2b9..446c801f83c1f 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.14.0",
+  "version": "4.14.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 4a4c87ad9bd382d245aefaa0d9063f584901b5d9 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Mon, 25 Sep 2017 08:06:38 -0700
Subject: [PATCH 0714/1641] Persona showsecondarytext (#2927)

* Persona, fixed coin not showing secondary text

* Change file

* Move persona content out of persona coin, move classes onto outer container

* Picker: mix in persona props on top of base props to allow for more customization

* Revert example

* Make persona sizes not dependent on being on the root

* Fixed linting errors

* Fixed broken test
---
 ...na-showsecondarytext_2017-09-22-18-30.json | 11 ++++++++
 .../src/components/Facepile/Facepile.test.tsx |  2 +-
 .../src/components/Persona/Persona.scss       | 16 +++++++++++
 .../src/components/Persona/Persona.tsx        | 27 ++++++++++++++-----
 .../src/components/Persona/PersonaCoin.tsx    |  5 +---
 .../SuggestionItemDefault.tsx                 |  4 +--
 6 files changed, 51 insertions(+), 14 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/persona-showsecondarytext_2017-09-22-18-30.json

diff --git a/common/changes/office-ui-fabric-react/persona-showsecondarytext_2017-09-22-18-30.json b/common/changes/office-ui-fabric-react/persona-showsecondarytext_2017-09-22-18-30.json
new file mode 100644
index 0000000000000..094e1d47fcd20
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/persona-showsecondarytext_2017-09-22-18-30.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Persona: Fixed regression in secondary text not showing",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
index 1acc8ac09d678..2c155c5fda089 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
@@ -149,7 +149,7 @@ describe('Facepile', () => {
           overflowButtonType={ OverflowButtonType.downArrow }
         />);
       let facepile = ReactDOM.findDOMNode(wrapper as React.ReactInstance);
-      let addButton = facepile.querySelectorAll('.ms-Facepile-addButton .ms-Persona.ms-Persona--xs');
+      let addButton = facepile.querySelectorAll('.ms-Facepile-addButton .ms-Persona-coin.ms-Persona--xs');
       expect(addButton).to.have.length(1, 'Add button should render');
       let faces = facepile.querySelectorAll('.ms-Facepile-person');
       expect(faces).to.have.length(facepilePersonas.length, 'personas should render');
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
index f185ac6c272fb..dca179310cee7 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
@@ -263,7 +263,9 @@ $ms-Persona-presenceSizeXl: 28px;
 .root.rootIsTiny {
   height: $ms-Persona-sizeTiny;
   min-width: $ms-Persona-sizeTiny;
+}
 
+.rootIsTiny{
   .imageArea {
     overflow: visible;
     background: transparent;
@@ -317,7 +319,9 @@ $ms-Persona-presenceSizeXl: 28px;
   height: $ms-Persona-size16;
   min-width: $ms-Persona-size16;
   overflow: hidden;
+}
 
+.rootIs16 {
   .imageArea {
     box-shadow: 0 0 0 2px $ms-color-white;
   }
@@ -367,7 +371,9 @@ $ms-Persona-presenceSizeXl: 28px;
 .root.rootIsExtraExtraSmall {
   height: $ms-Persona-sizeXs;
   min-width: $ms-Persona-sizeXs;
+}
 
+.rootIsExtraExtraSmall {
   .imageArea,
   .image {
     flex: 0 0 $ms-Persona-sizeXxs;
@@ -434,7 +440,9 @@ $ms-Persona-presenceSizeXl: 28px;
   height: $ms-Persona-size28;
   min-width: $ms-Persona-size28;
   overflow: hidden;
+}
 
+.rootIs28 {
   .imageArea,
   .image {
     flex: 0 0 $ms-Persona-size28;
@@ -500,7 +508,9 @@ $ms-Persona-presenceSizeXl: 28px;
 .root.rootIsExtraSmall {
   height: $ms-Persona-sizeXs;
   min-width: $ms-Persona-sizeXs;
+}
 
+.rootIsExtraSmall {
   .imageArea,
   .image {
     flex: 0 0 $ms-Persona-sizeXs;
@@ -552,7 +562,9 @@ $ms-Persona-presenceSizeXl: 28px;
 .root.rootIsSmall {
   height: $ms-Persona-sizeSm;
   min-width: $ms-Persona-sizeSm;
+}
 
+.rootIsSmall {
   .imageArea,
   .image {
     flex: 0 0 $ms-Persona-sizeSm;
@@ -586,7 +598,9 @@ $ms-Persona-presenceSizeXl: 28px;
 .root.rootIsLarge {
   height: $ms-Persona-sizeLg;
   min-width: $ms-Persona-sizeLg;
+}
 
+.rootIsLarge {
   .imageArea,
   .image {
     flex: 0 0 $ms-Persona-sizeLg;
@@ -628,7 +642,9 @@ $ms-Persona-presenceSizeXl: 28px;
 .root.rootIsExtraLarge {
   height: $ms-Persona-sizeXl;
   min-width: $ms-Persona-sizeXl;
+}
 
+.rootIsExtraLarge {
   .imageArea,
   .image {
     flex: 0 0 $ms-Persona-sizeXl;
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index 8505d88e94382..caaeb5518260d 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -14,6 +14,10 @@ import {
   PersonaPresence as PersonaPresenceEnum,
   PersonaSize
 } from './Persona.Props';
+import {
+  PERSONA_PRESENCE,
+  PERSONA_SIZE
+} from './PersonaConsts';
 import * as stylesImport from './Persona.scss';
 const styles: any = stylesImport;
 
@@ -49,16 +53,15 @@ export class Persona extends BaseComponent<IPersonaProps, {}> {
       presence,
       primaryText,
       imageShouldFadeIn,
-      imageShouldStartVisible
+      imageShouldStartVisible,
+      showSecondaryText
      } = this.props;
 
     let personaCoinProps = {
-      className,
       imageUrl,
       imageAlt,
       imageInitials,
       initialsColor,
-      presence,
       primaryText,
       imageShouldFadeIn,
       imageShouldStartVisible,
@@ -89,10 +92,20 @@ export class Persona extends BaseComponent<IPersonaProps, {}> {
     );
 
     return (
-      <div { ...divProps }>
-        <PersonaCoin { ...personaCoinProps }>
-          { (!hidePersonaDetails || (size === PersonaSize.tiny)) && personaDetails }
-        </PersonaCoin>
+      <div
+        { ...divProps }
+        className={
+          css('ms-Persona',
+            styles.root,
+            className,
+            PERSONA_SIZE[size],
+            PERSONA_PRESENCE[presence as PersonaPresenceEnum],
+            showSecondaryText && styles.showSecondaryText
+          )
+        }
+      >
+        <PersonaCoin { ...personaCoinProps } />
+        { (!hidePersonaDetails || (size === PersonaSize.tiny)) && personaDetails }
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
index e792c2350f189..4aa04ceb71a77 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
@@ -17,7 +17,6 @@ import {
 } from './Persona.Props';
 import {
   PERSONA_INITIALS_COLOR,
-  PERSONA_PRESENCE,
   PERSONA_SIZE
 } from './PersonaConsts';
 import * as stylesImport from './Persona.scss';
@@ -76,11 +75,9 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
 
   public render(): JSX.Element | null {
     let {
-      className,
       imageUrl,
       imageAlt,
       initialsColor,
-      presence,
       primaryText,
       imageShouldFadeIn,
       onRenderInitials = this._onRenderInitials,
@@ -95,7 +92,7 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
     return (
       <div
         { ...divProps }
-        className={ css('ms-Persona', styles.root, className, PERSONA_SIZE[size], PERSONA_PRESENCE[presence as PersonaPresenceEnum], this.props.showSecondaryText ? styles.showSecondaryText : '') }
+        className={ css('ms-Persona-coin', PERSONA_SIZE[size]) }
       >
         { size !== PersonaSize.tiny && (
           <div className={ css('ms-Persona-imageArea', styles.imageArea) }>
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
index d6f1bfc965f33..ab799ea02335a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
@@ -11,11 +11,11 @@ export const SuggestionItemNormal: (persona: IPersonaProps, suggestionProps?: IB
   return (
     <div className={ css('ms-PeoplePicker-personaContent', styles.peoplePickerPersonaContent) }>
       <Persona
-        { ...personaProps }
         presence={ personaProps.presence !== undefined ? personaProps.presence : PersonaPresence.none }
         size={ PersonaSize.extraExtraSmall }
         className={ css('ms-PeoplePicker-Persona', styles.peoplePickerPersona) }
         showSecondaryText={ true }
+        { ...personaProps }
       />
     </div>
   );
@@ -25,10 +25,10 @@ export const SuggestionItemSmall: (persona: IPersonaProps, suggestionProps?: IBa
   return (
     <div className={ css('ms-PeoplePicker-personaContent', styles.peoplePickerPersonaContent) }>
       <Persona
-        { ...personaProps }
         presence={ personaProps.presence !== undefined ? personaProps.presence : PersonaPresence.none }
         size={ PersonaSize.extraExtraSmall }
         className={ css('ms-PeoplePicker-Persona', styles.peoplePickerPersona) }
+        { ...personaProps }
       />
     </div>
   );

From 724a69333e9c1b0833ef6f48c0fd6b49a2bf3a3a Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 25 Sep 2017 13:54:52 -0700
Subject: [PATCH 0715/1641] Adding scoping support for Customizer (#2899)

* Adding missing reference in index.

* Updating Customizer to support scopedSettings. Adding Customizations.applySettings and Customizations.applyScopedSettings.

* adding change files

* Adding index entry.

* Adding displayName and fixing lint.

* Fixing issue using EventGroup in server scenarios.
---
 .../styling/customizer_2017-09-20-19-02.json  | 11 +++
 .../customizer_2017-09-20-19-02.json          | 11 +++
 .../customizer_2017-09-20-19-02.json          | 11 +++
 .../Button/ActionButton/ActionButton.tsx      |  2 +-
 .../CommandBarButton/CommandBarButton.tsx     |  3 +-
 .../Button/CompoundButton/CompoundButton.tsx  |  3 +-
 .../Button/DefaultButton/DefaultButton.tsx    |  3 +-
 .../Button/IconButton/IconButton.tsx          |  3 +-
 .../Button/PrimaryButton/PrimaryButton.tsx    |  3 +-
 .../src/components/Checkbox/Checkbox.tsx      |  2 +-
 .../src/components/ComboBox/ComboBox.tsx      |  2 +-
 .../ContextualMenu/ContextualMenu.tsx         |  3 +-
 .../src/components/Fabric/Fabric.tsx          |  2 +-
 .../components/HoverCard/ExpandingCard.tsx    |  2 +-
 .../src/components/SpinButton/SpinButton.tsx  |  3 +-
 .../src/components/Toggle/Toggle.tsx          |  2 +-
 packages/office-ui-fabric-react/src/index.ts  |  1 +
 packages/styling/src/styles/theme.ts          |  8 +-
 packages/utilities/src/Customizations.test.ts | 51 ++++++++++
 packages/utilities/src/Customizations.ts      | 77 +++++++++++++++
 packages/utilities/src/Customizer.test.tsx    | 94 +++++++++++++++++++
 packages/utilities/src/Customizer.tsx         | 85 ++++++++---------
 packages/utilities/src/EventGroup.ts          |  7 +-
 packages/utilities/src/GlobalSettings.ts      |  4 +-
 packages/utilities/src/customizable.test.tsx  | 47 +++++-----
 packages/utilities/src/customizable.tsx       | 35 ++++---
 packages/utilities/src/index.ts               |  1 +
 scripts/tasks/karma.js                        |  3 +-
 28 files changed, 364 insertions(+), 115 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/customizer_2017-09-20-19-02.json
 create mode 100644 common/changes/@uifabric/utilities/customizer_2017-09-20-19-02.json
 create mode 100644 common/changes/office-ui-fabric-react/customizer_2017-09-20-19-02.json
 create mode 100644 packages/utilities/src/Customizations.test.ts
 create mode 100644 packages/utilities/src/Customizations.ts
 create mode 100644 packages/utilities/src/Customizer.test.tsx

diff --git a/common/changes/@uifabric/styling/customizer_2017-09-20-19-02.json b/common/changes/@uifabric/styling/customizer_2017-09-20-19-02.json
new file mode 100644
index 0000000000000..7615d1ec288f9
--- /dev/null
+++ b/common/changes/@uifabric/styling/customizer_2017-09-20-19-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Updating default theme registration to use the new `Customizations` helper.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@hotmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/customizer_2017-09-20-19-02.json b/common/changes/@uifabric/utilities/customizer_2017-09-20-19-02.json
new file mode 100644
index 0000000000000..78df5e5f30f2c
--- /dev/null
+++ b/common/changes/@uifabric/utilities/customizer_2017-09-20-19-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Updating Customizer to support `scopedSettings` prop. Adding a `Customizations` object for applying global and scoped customizations in non-React environments.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@hotmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/customizer_2017-09-20-19-02.json b/common/changes/office-ui-fabric-react/customizer_2017-09-20-19-02.json
new file mode 100644
index 0000000000000..9c2137921bb50
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/customizer_2017-09-20-19-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Updating components to support scoped customizations.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@hotmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx b/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx
index 65b85a0cf0188..3d98793bd8bcf 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx
@@ -4,7 +4,7 @@ import { BaseComponent, customizable, nullRender } from '../../../Utilities';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './ActionButton.styles';
 
-@customizable(['theme'])
+@customizable('ActionButton', ['theme'])
 export class ActionButton extends BaseComponent<IButtonProps, {}> {
 
   /**
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx
index 50f9be9d8e756..bf54a296e3a77 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx
@@ -1,11 +1,10 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
-import { ThemeSettingName } from '../../../Styling';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './CommandBarButton.styles';
 
-@customizable([ThemeSettingName])
+@customizable('CommandBarButton', ['theme'])
 export class CommandBarButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Tell BaseComponent to bypass resolution of componentRef.
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
index da106faaece2c..92b4b2557846b 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
@@ -1,11 +1,10 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
 import { BaseComponent, customizable } from '../../../Utilities';
-import { ThemeSettingName } from '../../../Styling';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './CompoundButton.styles';
 
-@customizable([ThemeSettingName])
+@customizable('CompoundButton', ['theme'])
 export class CompoundButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Tell BaseComponent to bypass resolution of componentRef.
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
index 35fe96852dc47..e58f8ae5d8b94 100644
--- a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
@@ -1,11 +1,10 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
-import { ThemeSettingName } from '../../../Styling';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './DefaultButton.styles';
 
-@customizable([ThemeSettingName])
+@customizable('DefaultButton', ['theme'])
 export class DefaultButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Tell BaseComponent to bypass resolution of componentRef.
diff --git a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
index e705cbebf0d55..01baa17402449 100644
--- a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
@@ -1,11 +1,10 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
-import { ThemeSettingName } from '../../../Styling';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './IconButton.styles';
 
-@customizable([ThemeSettingName])
+@customizable('IconButton', ['theme'])
 export class IconButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Tell BaseComponent to bypass resolution of componentRef.
diff --git a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
index 4a8c121008bd9..4afad010f9ff4 100644
--- a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
@@ -1,10 +1,9 @@
 import * as React from 'react';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
-import { ThemeSettingName } from '../../../Styling';
 import { DefaultButton } from '../DefaultButton/DefaultButton';
 import { IButtonProps } from '../Button.Props';
 
-@customizable([ThemeSettingName])
+@customizable('PrimaryButton', ['theme'])
 export class PrimaryButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Set this BaseComponent._resolveComponentRef to false, bypassing resolution of componentRef.
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
index 933c0df675c1b..f98a328c33fe9 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
@@ -33,7 +33,7 @@ interface ICheckboxClassNames {
   text: string;
 }
 
-@customizable(['theme'])
+@customizable('Checkbox', ['theme'])
 export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> implements ICheckbox {
   public static defaultProps: ICheckboxProps = {
     boxSide: 'start'
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index a84a777920be3..c806e05cac624 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -64,7 +64,7 @@ enum SearchDirection {
   forward = 1
 }
 
-@customizable(['theme'])
+@customizable('ComboBox', ['theme'])
 export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
   public static defaultProps: IComboBoxProps = {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 3629752a02177..ea17a18754ce0 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -3,7 +3,6 @@ import { IContextualMenuProps, IContextualMenuItem, ContextualMenuItemType } fro
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { getClassNames } from './ContextualMenu.classNames';
-import { ThemeSettingName } from '../../Styling';
 import {
   BaseComponent,
   anchorProperties,
@@ -70,7 +69,7 @@ function getIsChecked(item: IContextualMenuItem): boolean | null | undefined {
   return null;
 }
 
-@customizable([ThemeSettingName])
+@customizable('ContextualMenu', ['theme'])
 @withResponsiveMode
 export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContextualMenuState> {
   // The default ContextualMenu properties have no items and beak, the default submenu direction is right and top.
diff --git a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
index e1967ff5d78d7..bb38452acaa39 100644
--- a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
+++ b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
@@ -41,7 +41,7 @@ if (typeof (document) === 'object' && document.documentElement && !document.docu
   document.documentElement.setAttribute('dir', 'ltr');
 }
 
-@customizable(['theme'])
+@customizable('Fabric', ['theme'])
 export class Fabric extends BaseComponent<IFabricProps, IFabricState> {
   // tslint:disable-next-line:no-unused-variable
   private _root: HTMLElement;
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
index 06c44827d193b..e5117e9e54a3d 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
@@ -21,7 +21,7 @@ export interface IExpandingCardState {
   needsScroll: boolean;
 }
 
-@customizable(['theme'])
+@customizable('ExpandingCard', ['theme'])
 export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpandingCardState> {
   public static defaultProps = {
     compactCardHeight: 156,
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index 16af04c74da58..0278f8be8cc52 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -9,7 +9,6 @@ import {
   autobind,
   customizable
 } from '../../Utilities';
-import { ThemeSettingName } from '../../Styling';
 import {
   ISpinButton,
   ISpinButtonProps,
@@ -43,7 +42,7 @@ export interface ISpinButtonState {
   keyboardSpinDirection: KeyboardSpinDirection;
 }
 
-@customizable([ThemeSettingName])
+@customizable('SpinButton', ['theme'])
 export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState> implements ISpinButton {
 
   public static defaultProps: ISpinButtonProps = {
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
index e23e17a449bed..dfcb2a78a2546 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
@@ -20,7 +20,7 @@ export interface IToggleState {
   isChecked: boolean;
 }
 
-@customizable(['theme'])
+@customizable('Toggle', ['theme'])
 export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements IToggle {
 
   private _id: string;
diff --git a/packages/office-ui-fabric-react/src/index.ts b/packages/office-ui-fabric-react/src/index.ts
index f2c8c88e932a4..a865983785e42 100644
--- a/packages/office-ui-fabric-react/src/index.ts
+++ b/packages/office-ui-fabric-react/src/index.ts
@@ -38,6 +38,7 @@ export * from './Overlay';
 export * from './Panel';
 export * from './Pickers';
 export * from './Persona';
+export * from './PersonaCoin';
 export * from './Pivot';
 export * from './ProgressIndicator';
 export * from './Rating';
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index ce8a5f2c75262..253d7600ea999 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -1,4 +1,4 @@
-import { GlobalSettings } from '@uifabric/utilities/lib/GlobalSettings';
+import { Customizations } from '@uifabric/utilities/lib/Customizations';
 import {
   IPalette,
   ISemanticColors,
@@ -22,7 +22,7 @@ let _theme: ITheme = {
 
 export const ThemeSettingName = 'theme';
 
-if (!GlobalSettings.getValue(ThemeSettingName)) {
+if (!Customizations.getSettings([ThemeSettingName]).theme) {
   let win = typeof window !== 'undefined' ? window : undefined;
 
   // tslint:disable:no-string-literal no-any
@@ -32,7 +32,7 @@ if (!GlobalSettings.getValue(ThemeSettingName)) {
   // tslint:enable:no-string-literal no-any
 
   // Set the default theme.
-  GlobalSettings.setValue(ThemeSettingName, _theme);
+  Customizations.applySettings({ [ThemeSettingName]: _theme });
 }
 
 /**
@@ -51,7 +51,7 @@ export function loadTheme(theme: IPartialTheme): ITheme {
   // Invoke the legacy method of theming the page as well.
   legacyLoadTheme({ ..._theme.palette, ..._theme.semanticColors });
 
-  GlobalSettings.setValue(ThemeSettingName, _theme);
+  Customizations.applySettings({ [ThemeSettingName]: _theme });
 
   return _theme;
 }
diff --git a/packages/utilities/src/Customizations.test.ts b/packages/utilities/src/Customizations.test.ts
new file mode 100644
index 0000000000000..10eec375319bd
--- /dev/null
+++ b/packages/utilities/src/Customizations.test.ts
@@ -0,0 +1,51 @@
+import {
+  Customizations
+} from './Customizations';
+
+describe('Customizations', () => {
+  beforeEach(() => {
+    Customizations.reset();
+  });
+
+  it('can set/get global settings', () => {
+    Customizations.applySettings({ a: 'a', b: 'b' });
+
+    expect(Customizations.getSettings(['a', 'b'])).toEqual({
+      a: 'a',
+      b: 'b'
+    });
+
+    expect(Customizations.getSettings(['a'])).toEqual({
+      a: 'a'
+    });
+
+    expect(Customizations.getSettings(['z'])).toEqual({});
+  });
+
+  it('can set/get scoped settings', () => {
+    Customizations.applyScopedSettings('Foo', { a: 'a', b: 'b' });
+
+    expect(Customizations.getSettings(['a', 'b'], 'Foo')).toEqual({
+      a: 'a',
+      b: 'b'
+    });
+
+    expect(Customizations.getSettings(['a'], 'Bar')).toEqual({});
+  });
+
+  it('can fire changes', () => {
+    let counter = 0;
+    let incCounter = () => counter++;
+
+    Customizations.observe(incCounter);
+
+    Customizations.applyScopedSettings('Foo', { a: 'a', b: 'b' });
+    Customizations.applySettings({ a: 'a', b: 'b' });
+
+    expect(counter).toEqual(2);
+    Customizations.unobserve(incCounter);
+
+    Customizations.applySettings({ a: 'a', b: 'b' });
+    expect(counter).toEqual(2);
+  });
+});
\ No newline at end of file
diff --git a/packages/utilities/src/Customizations.ts b/packages/utilities/src/Customizations.ts
new file mode 100644
index 0000000000000..ecf0cae86a9ff
--- /dev/null
+++ b/packages/utilities/src/Customizations.ts
@@ -0,0 +1,77 @@
+import {
+  GlobalSettings
+} from './GlobalSettings';
+import {
+  EventGroup
+} from './EventGroup';
+
+export interface ICustomizations {
+  // tslint:disable-next-line:no-any
+  settings: { [key: string]: any };
+  // tslint:disable-next-line:no-any
+  scopedSettings: { [key: string]: { [key: string]: any } };
+}
+
+const CustomizationsGlobalKey = 'customizations';
+const NO_CUSTOMIZATIONS = { settings: {}, scopedSettings: {} };
+
+let _allSettings = GlobalSettings.getValue<ICustomizations>(CustomizationsGlobalKey, {
+  settings: {},
+  scopedSettings: {}
+});
+
+const _events = new EventGroup(_allSettings);
+
+export class Customizations {
+  public static reset(): void {
+    _allSettings.settings = {};
+    _allSettings.scopedSettings = {};
+  }
+
+  // tslint:disable-next-line:no-any
+  public static applySettings(settings: { [key: string]: any }): void {
+    _allSettings.settings = { ..._allSettings.settings, ...settings };
+    Customizations._raiseChange();
+  }
+
+  // tslint:disable-next-line:no-any
+  public static applyScopedSettings(scopeName: string, settings: { [key: string]: any }): void {
+    _allSettings.scopedSettings[scopeName] = { ..._allSettings.scopedSettings[scopeName], ...settings };
+    Customizations._raiseChange();
+  }
+
+  public static getSettings(
+    properties: string[],
+    scopeName?: string,
+    localSettings: ICustomizations = NO_CUSTOMIZATIONS
+    // tslint:disable-next-line:no-any
+  ): any {
+    // tslint:disable-next-line:no-any
+    const settings: { [key: string]: any } = {};
+    const localScopedSettings = (scopeName && localSettings.scopedSettings[scopeName]) || {};
+    const globalScopedSettings = (scopeName && _allSettings.scopedSettings[scopeName]) || {};
+
+    for (let property of properties) {
+      settings[property] = (
+        localScopedSettings[property] ||
+        localSettings.settings[property] ||
+        globalScopedSettings[property] ||
+        _allSettings.settings[property]
+      );
+    }
+
+    return settings;
+  }
+
+  public static observe(onChange: () => void): void {
+    _events.on(_allSettings, 'change', onChange);
+  }
+
+  public static unobserve(onChange: () => void): void {
+    _events.off(_allSettings, 'change', onChange);
+  }
+
+  private static _raiseChange(): void {
+    _events.raise('change');
+  }
+}
diff --git a/packages/utilities/src/Customizer.test.tsx b/packages/utilities/src/Customizer.test.tsx
new file mode 100644
index 0000000000000..cfb3004ce966c
--- /dev/null
+++ b/packages/utilities/src/Customizer.test.tsx
@@ -0,0 +1,94 @@
+import * as React from 'react';
+import * as ReactDOM from 'react-dom/server';
+import { customizable } from './customizable';
+import { Customizer } from './Customizer';
+import { Customizations } from './Customizations';
+
+@customizable('Foo', ['field'])
+class Foo extends React.Component<{ field?: string; }, {}> {
+  public render(): JSX.Element {
+    return (
+      <div>{ this.props.field }</div>
+    );
+  }
+}
+
+@customizable('Bar', ['field', 'field2', 'field3'])
+class Bar extends React.Component<{ field?: string; field2?: string, field3?: string }, {}> {
+  public render(): JSX.Element {
+    return (
+      <div>{ this.props.field }{ this.props.field2 }{ this.props.field3 }</div>
+    );
+  }
+}
+
+describe('Customizer', () => {
+  beforeEach(() => {
+    Customizations.reset();
+  });
+
+  it('can provide new defaults', () => {
+    expect(ReactDOM.renderToStaticMarkup(
+      <Customizer settings={ { field: 'customName' } }>
+        <Foo />
+      </Customizer>
+    )).toEqual('<div>customName</div>');
+  });
+
+  it('can pass through global settings', () => {
+    Customizations.applySettings({ 'field': 'globalName' });
+    expect(ReactDOM.renderToStaticMarkup(
+      <Customizer settings={ { nonMatch: 'customName' } }>
+        <Foo />
+      </Customizer>
+    )).toEqual('<div>globalName</div>');
+  });
+
+  it('can override global settings', () => {
+    Customizations.applySettings({ 'field': 'globalName' });
+    expect(ReactDOM.renderToStaticMarkup(
+      <Customizer settings={ { field: 'customName' } }>
+        <Foo />
+      </Customizer>
+    )).toEqual('<div>customName</div>');
+  });
+
+  it('can scope settings to specific components', () => {
+    let scopedSettings = {
+      Foo: { field: 'scopedToFoo' },
+      Bar: { field: 'scopedToBar' }
+    };
+
+    expect(ReactDOM.renderToStaticMarkup(
+      <Customizer scopedSettings={ scopedSettings }>
+        <div>
+          <Foo />
+          <Bar />
+        </div>
+      </Customizer>
+    )).toEqual('<div><div>scopedToFoo</div><div>scopedToBar</div></div>');
+  });
+
+  it('can layer global settings', () => {
+    expect(ReactDOM.renderToStaticMarkup(
+      <Customizer settings={ { field: 'field' } }>
+        <Customizer settings={ { field2: 'field2' } }>
+          <Bar />
+        </Customizer >
+      </Customizer >
+    )).toEqual('<div>fieldfield2</div>');
+  });
+
+  it('can layer scoped settings', () => {
+    Customizations.applySettings({ 'field3': 'field3' });
+
+    expect(ReactDOM.renderToStaticMarkup(
+      <Customizer scopedSettings={ { Bar: { field: 'field' } } }>
+        <Customizer scopedSettings={ { Bar: { field2: 'field2' } } }>
+          <Bar />
+        </Customizer >
+      </Customizer >
+    )).toEqual('<div>fieldfield2field3</div>');
+  });
+
+});
diff --git a/packages/utilities/src/Customizer.tsx b/packages/utilities/src/Customizer.tsx
index 79310d828405c..302818a1fbee8 100644
--- a/packages/utilities/src/Customizer.tsx
+++ b/packages/utilities/src/Customizer.tsx
@@ -1,36 +1,13 @@
 import * as React from 'react';
 import * as PropTypes from 'prop-types';
-import { BaseComponent } from './BaseComponent';
+import { BaseComponent, IBaseProps } from './BaseComponent';
+import { ICustomizations } from './Customizations';
 
-/**
- * Settings interface.
- *
- * @internal
- */
-export interface ISettings {
-  // tslint:disable-next-line:no-any
-  [key: string]: any;
+export interface ICustomizerContext {
+  customizations: ICustomizations;
 }
 
-/**
- * Customizer component props.
- *
- * @public
- */
-export interface ICustomizerProps {
-  componentRef?: () => void;
-
-  settings: ISettings;
-}
-
-/**
- * Customizer component state.
- *
- * @internal
- */
-export interface ICustomizerState {
-  injectedProps?: ISettings;
-}
+export type ICustomizerProps = Partial<ICustomizations> & IBaseProps;
 
 /**
  * The Customizer component allows for default props to be mixed into components which
@@ -44,50 +21,64 @@ export interface ICustomizerState {
  *
  * @public
  */
-export class Customizer extends BaseComponent<ICustomizerProps, ICustomizerState> {
+export class Customizer extends BaseComponent<ICustomizerProps, ICustomizerContext> {
   public static contextTypes: {
-    injectedProps: PropTypes.Requireable<{}>;
+    customizations: PropTypes.Requireable<{}>;
   } = {
-    injectedProps: PropTypes.object
+    customizations: PropTypes.object
   };
 
   public static childContextTypes: {
-    injectedProps: PropTypes.Requireable<{}>;
+    customizations: PropTypes.Requireable<{}>;
   } = Customizer.contextTypes;
 
   // tslint:disable-next-line:no-any
   constructor(props: ICustomizerProps, context: any) {
     super(props);
 
-    this.state = this._getInjectedProps(props, context);
+    this.state = this._getCustomizations(props, context);
   }
 
-  public getChildContext(): ICustomizerState {
+  public getChildContext(): ICustomizerContext {
     return this.state;
   }
 
   // tslint:disable-next-line:no-any
-  public componentWillReceiveProps(newProps: ICustomizerProps, newContext: any): void {
-    this.setState(this._getInjectedProps(newProps, newContext));
+  public componentWillReceiveProps(newProps: any, newContext: any): void {
+    this.setState(this._getCustomizations(newProps, newContext));
   }
 
   public render(): React.ReactElement<{}> {
     return React.Children.only(this.props.children);
   }
 
-  private _getInjectedProps(props: ICustomizerProps, context: ICustomizerState): {
-    injectedProps: {
-      // tslint:disable-next-line:no-any
-      [x: string]: any;
-    };
-  } {
-    let { settings: injectedPropsFromSettings = {} as ISettings } = props;
-    let { injectedProps: injectedPropsFromContext = {} as ISettings } = context;
+  private _getCustomizations(
+    props: ICustomizerProps,
+    context: ICustomizerContext
+  ): ICustomizerContext {
+    let {
+      settings = {},
+      scopedSettings = {}
+    } = props;
+    let {
+      customizations = { settings: {}, scopedSettings: {} }
+    } = context;
+
+    let newScopedSettings = { ...scopedSettings };
+
+    for (let name in customizations.scopedSettings) {
+      if (customizations.scopedSettings.hasOwnProperty(name)) {
+        newScopedSettings[name] = { ...scopedSettings[name], ...customizations.scopedSettings[name] };
+      }
+    }
 
     return {
-      injectedProps: {
-        ...injectedPropsFromContext,
-        ...injectedPropsFromSettings
+      customizations: {
+        settings: {
+          ...settings,
+          ...customizations.settings
+        },
+        scopedSettings: newScopedSettings
       }
     };
   }
diff --git a/packages/utilities/src/EventGroup.ts b/packages/utilities/src/EventGroup.ts
index 90a70cb1f6d90..cb8847aece11a 100644
--- a/packages/utilities/src/EventGroup.ts
+++ b/packages/utilities/src/EventGroup.ts
@@ -149,7 +149,12 @@ export class EventGroup {
   }
 
   private static _isElement(target: HTMLElement): boolean {
-    return !!target && (!!target.addEventListener || target instanceof HTMLElement);
+    return (
+      !!target && (
+        !!target.addEventListener ||
+        (typeof HTMLElement !== 'undefined' && target instanceof HTMLElement)
+      )
+    );
   }
 
   /** parent: the context in which events attached to non-HTMLElements are called */
diff --git a/packages/utilities/src/GlobalSettings.ts b/packages/utilities/src/GlobalSettings.ts
index c075f3a78c5e7..21ac41e08ca25 100644
--- a/packages/utilities/src/GlobalSettings.ts
+++ b/packages/utilities/src/GlobalSettings.ts
@@ -64,7 +64,7 @@ export class GlobalSettings {
     return _globalSettings[key];
   }
 
-  public static setValue<T>(key: string, value: T): void {
+  public static setValue<T>(key: string, value: T): T {
     let oldValue = _globalSettings[key];
 
     if (value !== oldValue) {
@@ -82,6 +82,8 @@ export class GlobalSettings {
         }
       }
     }
+
+    return value;
   }
 
   public static addChangeListener(cb: IChangeEventCallback): void {
diff --git a/packages/utilities/src/customizable.test.tsx b/packages/utilities/src/customizable.test.tsx
index 5ac49ef884310..66e78fa160870 100644
--- a/packages/utilities/src/customizable.test.tsx
+++ b/packages/utilities/src/customizable.test.tsx
@@ -1,38 +1,41 @@
 import * as React from 'react';
 import * as ReactDOM from 'react-dom/server';
 import { customizable } from './customizable';
-import { Customizer } from './Customizer';
-import { GlobalSettings } from './GlobalSettings';
-
-@customizable(['name', 'name2'])
-class Foo extends React.Component<{ field: string; }, {}> {
-  public name: string;
+import { Customizations } from './Customizations';
 
+@customizable('Foo', ['field'])
+class Foo extends React.Component<{ field?: string; }, {}> {
   public render(): JSX.Element {
-    // tslint:disable-next-line:no-any
-    return <div>{ (this.props as any)[this.props.field] }</div>;
+    return <div>{ this.props.field }</div>;
   }
 }
 
 describe('customizable', () => {
+  beforeEach(() => {
+    Customizations.reset();
+  });
 
-  it('can inject customizations', () => {
-    GlobalSettings.setValue('name', 'defaultName');
+  it('can receive global customizations', () => {
+    Customizations.applySettings({ field: 'globalName' });
+    expect(ReactDOM.renderToStaticMarkup(<Foo />)).toEqual('<div>globalName</div>');
+  });
 
-    expect(ReactDOM.renderToStaticMarkup(<Foo field='name' />)).toEqual('<div>defaultName</div>');
-    expect(ReactDOM.renderToStaticMarkup(<Foo field='name2' />)).toEqual('<div></div>');
+  it('can receive scoped customizations', () => {
+    Customizations.applySettings({ field: 'globalName' });
+    Customizations.applyScopedSettings('Foo', { field: 'scopedName' });
+    expect(ReactDOM.renderToStaticMarkup(<Foo />)).toEqual('<div>scopedName</div>');
+  });
 
-    expect(ReactDOM.renderToStaticMarkup(
-      <Customizer settings={ { name: 'customName' } }>
-        <Foo field='name' />
-      </Customizer>
-    )).toEqual('<div>customName</div>');
+  it('can ignore scoped customizations that do not apply', () => {
+    Customizations.applySettings({ field: 'globalName' });
+    Customizations.applyScopedSettings('Bar', { field: 'scopedName' });
+    expect(ReactDOM.renderToStaticMarkup(<Foo />)).toEqual('<div>globalName</div>');
+  });
 
-    expect(ReactDOM.renderToStaticMarkup(
-      <Customizer settings={ { name2: 'customName' } }>
-        <Foo field='name2' />
-      </Customizer>
-    )).toEqual('<div>customName</div>');
+  it('can accept props over global/scoped values', () => {
+    Customizations.applySettings({ field: 'globalName' });
+    Customizations.applyScopedSettings('Foo', { field: 'scopedName' });
+    expect(ReactDOM.renderToStaticMarkup(<Foo field='name' />)).toEqual('<div>name</div>');
   });
 
 });
diff --git a/packages/utilities/src/customizable.tsx b/packages/utilities/src/customizable.tsx
index 6ec6dc9d70ebf..962bde6e14252 100644
--- a/packages/utilities/src/customizable.tsx
+++ b/packages/utilities/src/customizable.tsx
@@ -1,9 +1,13 @@
 import * as React from 'react';
 import * as PropTypes from 'prop-types';
-import { GlobalSettings, IChangeDescription } from './GlobalSettings';
+import { Customizations } from './Customizations';
+
+export function customizable(
+  scope: string,
+  fields: string[]
+  // tslint:disable-next-line:no-any
+): <P, S>(ComposedComponent: new (props: P, ...args: any[]) => React.Component<P, S>) => any {
 
-// tslint:disable-next-line:no-any
-export function customizable(fields: string[]): <P, S>(ComposedComponent: new (props: P, ...args: any[]) => React.Component<P, S>) => any {
   // tslint:disable-next-line:no-shadowed-variable
   return function customizableFactory<P, S>(
     // tslint:disable-next-line:no-any
@@ -11,10 +15,12 @@ export function customizable(fields: string[]): <P, S>(ComposedComponent: new (p
     // tslint:disable-next-line:no-any
   ): any {
     return class ComponentWithInjectedProps extends React.Component<P, {}> {
+      public static displayName: string = 'Customized' + scope;
+
       public static contextTypes: {
-        injectedProps: PropTypes.Requireable<{}>;
+        customizations: PropTypes.Requireable<{}>;
       } = {
-        injectedProps: PropTypes.object
+        customizations: PropTypes.object
       };
 
       // tslint:disable-next-line:no-any
@@ -25,22 +31,15 @@ export function customizable(fields: string[]): <P, S>(ComposedComponent: new (p
       }
 
       public componentDidMount(): void {
-        GlobalSettings.addChangeListener(this._onSettingChanged);
+        Customizations.observe(this._onSettingChanged);
       }
 
       public componentWillUnmount(): void {
-        GlobalSettings.removeChangeListener(this._onSettingChanged);
+        Customizations.unobserve(this._onSettingChanged);
       }
 
       public render(): JSX.Element {
-        let defaultProps = {};
-
-        for (let propName of fields) {
-          // tslint:disable-next-line:no-any
-          (defaultProps as any)[propName] = (this.context.injectedProps) ?
-            this.context.injectedProps[propName] :
-            GlobalSettings.getValue(propName);
-        }
+        const defaultProps = Customizations.getSettings(fields, scope, this.context.customizations);
 
         return (
           // tslint:disable-next-line:no-any
@@ -48,10 +47,8 @@ export function customizable(fields: string[]): <P, S>(ComposedComponent: new (p
         );
       }
 
-      private _onSettingChanged(change: IChangeDescription): void {
-        if (fields.indexOf(change.key) >= 0) {
-          this.forceUpdate();
-        }
+      private _onSettingChanged(): void {
+        this.forceUpdate();
       }
 
     };
diff --git a/packages/utilities/src/index.ts b/packages/utilities/src/index.ts
index 852e621c83ad0..08af844e16553 100644
--- a/packages/utilities/src/index.ts
+++ b/packages/utilities/src/index.ts
@@ -2,6 +2,7 @@ export * from './Async';
 export * from './AutoScroll';
 export * from './BaseComponent';
 export * from './Customizer';
+export * from './Customizations';
 export * from './DelayedRender';
 export * from './EventGroup';
 export * from './FabricPerformance';
diff --git a/scripts/tasks/karma.js b/scripts/tasks/karma.js
index 84416b310c4b9..5dc414173c689 100644
--- a/scripts/tasks/karma.js
+++ b/scripts/tasks/karma.js
@@ -3,10 +3,11 @@ module.exports = function (options) {
   let fs = require('fs');
   let karmaPath = path.resolve(__dirname, '../node_modules/karma/bin/karma');
   let karmaConfigPath = path.join(process.cwd(), 'karma.config.js');
+  let debugRun = (process.argv.indexOf('--debug') > -1);
 
   if (fs.existsSync(karmaConfigPath)) {
     const execSync = require('../exec-sync');
 
-    execSync(`node ${karmaPath} start ${karmaConfigPath}`);
+    execSync(`node ${karmaPath} start ${karmaConfigPath} ${debugRun ? '--debug --single-run=false' : ''}`);
   }
 };

From 691af2e7fe0f43d59a1e3c75ec48d53ad229983f Mon Sep 17 00:00:00 2001
From: "Bryan J. R. Gislason" <bryan-gislason@users.noreply.github.com>
Date: Mon, 25 Sep 2017 17:16:19 -0700
Subject: [PATCH 0716/1641] Dropdown update (#2945)

* Dropdown: add titleIsPlaceHolder class to dropdown title so styles can be overridden

* Add change request file
---
 .../dropdown-update_2017-09-25-23-58.json             | 11 +++++++++++
 .../src/components/Dropdown/Dropdown.tsx              |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/dropdown-update_2017-09-25-23-58.json

diff --git a/common/changes/office-ui-fabric-react/dropdown-update_2017-09-25-23-58.json b/common/changes/office-ui-fabric-react/dropdown-update_2017-09-25-23-58.json
new file mode 100644
index 0000000000000..323386bad76d5
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/dropdown-update_2017-09-25-23-58.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: add titleIsPlaceHolder class to dropdown title so styles can be overridden",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "brgisla@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index ea4628e2c8f3b..d898175e73579 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -181,6 +181,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
             id={ id + '-option' }
             className={ css(
               'ms-Dropdown-title', styles.title,
+              !selectedOption && 'ms-Dropdown-titleIsPlaceHolder',
               !selectedOption && styles.titleIsPlaceHolder,
               (errorMessage && errorMessage.length > 0 ? styles.titleIsError : null))
             }

From 3e4e87a18c78032dc725773538e6e0e38af1aa80 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 26 Sep 2017 10:09:04 +0000
Subject: [PATCH 0717/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 .../styling/customizer_2017-09-20-19-02.json  | 11 -------
 .../customizer_2017-09-20-19-02.json          | 11 -------
 .../customizer_2017-09-20-19-02.json          | 11 -------
 .../dropdown-update_2017-09-25-23-58.json     | 11 -------
 ...na-showsecondarytext_2017-09-22-18-30.json | 11 -------
 packages/experiments/package.json             |  6 ++--
 .../office-ui-fabric-react/CHANGELOG.json     | 32 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 11 ++++++-
 packages/office-ui-fabric-react/package.json  |  6 ++--
 packages/styling/CHANGELOG.json               | 19 +++++++++++
 packages/styling/CHANGELOG.md                 |  9 +++++-
 packages/styling/package.json                 |  4 +--
 packages/utilities/CHANGELOG.json             | 14 ++++++++
 packages/utilities/CHANGELOG.md               |  9 +++++-
 packages/utilities/package.json               |  2 +-
 16 files changed, 101 insertions(+), 68 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/customizer_2017-09-20-19-02.json
 delete mode 100644 common/changes/@uifabric/utilities/customizer_2017-09-20-19-02.json
 delete mode 100644 common/changes/office-ui-fabric-react/customizer_2017-09-20-19-02.json
 delete mode 100644 common/changes/office-ui-fabric-react/dropdown-update_2017-09-25-23-58.json
 delete mode 100644 common/changes/office-ui-fabric-react/persona-showsecondarytext_2017-09-22-18-30.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 55dab05186c5c..cee52b07170f0 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -47,7 +47,7 @@
     "@uifabric/example-app-base": ">=4.2.7 <5.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=4.50.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.50.2 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/customizer_2017-09-20-19-02.json b/common/changes/@uifabric/styling/customizer_2017-09-20-19-02.json
deleted file mode 100644
index 7615d1ec288f9..0000000000000
--- a/common/changes/@uifabric/styling/customizer_2017-09-20-19-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Updating default theme registration to use the new `Customizations` helper.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@hotmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/customizer_2017-09-20-19-02.json b/common/changes/@uifabric/utilities/customizer_2017-09-20-19-02.json
deleted file mode 100644
index 78df5e5f30f2c..0000000000000
--- a/common/changes/@uifabric/utilities/customizer_2017-09-20-19-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Updating Customizer to support `scopedSettings` prop. Adding a `Customizations` object for applying global and scoped customizations in non-React environments.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@hotmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/customizer_2017-09-20-19-02.json b/common/changes/office-ui-fabric-react/customizer_2017-09-20-19-02.json
deleted file mode 100644
index 9c2137921bb50..0000000000000
--- a/common/changes/office-ui-fabric-react/customizer_2017-09-20-19-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Updating components to support scoped customizations.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@hotmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/dropdown-update_2017-09-25-23-58.json b/common/changes/office-ui-fabric-react/dropdown-update_2017-09-25-23-58.json
deleted file mode 100644
index 323386bad76d5..0000000000000
--- a/common/changes/office-ui-fabric-react/dropdown-update_2017-09-25-23-58.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: add titleIsPlaceHolder class to dropdown title so styles can be overridden",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "brgisla@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/persona-showsecondarytext_2017-09-22-18-30.json b/common/changes/office-ui-fabric-react/persona-showsecondarytext_2017-09-22-18-30.json
deleted file mode 100644
index 094e1d47fcd20..0000000000000
--- a/common/changes/office-ui-fabric-react/persona-showsecondarytext_2017-09-22-18-30.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Persona: Fixed regression in secondary text not showing",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 75b112350f9a9..06a646dfe3ddd 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -41,9 +41,9 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/styling": ">=0.24.0 <1.0.0",
-    "@uifabric/utilities": ">=4.14.1 <5.0.0",
-    "office-ui-fabric-react": ">=4.50.1 <5.0.0",
+    "@uifabric/styling": ">=0.24.1 <1.0.0",
+    "@uifabric/utilities": ">=4.15.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.50.2 <5.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 180a67e477dd0..a5158ee4b1821 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,38 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.50.2",
+      "tag": "office-ui-fabric-react_v4.50.2",
+      "date": "Tue, 26 Sep 2017 10:09:04 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "724a69333e9c1b0833ef6f48c0fd6b49a2bf3a3a",
+            "comment": "Updating components to support scoped customizations."
+          },
+          {
+            "author": "Bryan J. R. Gislason <bryan-gislason@users.noreply.github.com>",
+            "commit": "691af2e7fe0f43d59a1e3c75ec48d53ad229983f",
+            "comment": "Dropdown: add titleIsPlaceHolder class to dropdown title so styles can be overridden"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "4a4c87ad9bd382d245aefaa0d9063f584901b5d9",
+            "comment": "Persona: Fixed regression in secondary text not showing"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.14.1 <5.0.0` to `>=4.15.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.24.0 <1.0.0` to `>=0.24.1 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.50.1",
       "tag": "office-ui-fabric-react_v4.50.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index d897c604d2f07..ffefa847f9891 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,15 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 25 Sep 2017 10:19:18 GMT and should not be manually modified.
+This log was last generated on Tue, 26 Sep 2017 10:09:04 GMT and should not be manually modified.
+
+## 4.50.2
+Tue, 26 Sep 2017 10:09:04 GMT
+
+### Patches
+
+- Updating components to support scoped customizations.
+- Dropdown: add titleIsPlaceHolder class to dropdown title so styles can be overridden
+- Persona: Fixed regression in secondary text not showing
 
 ## 4.50.1
 Mon, 25 Sep 2017 10:19:18 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 303fe1690964f..bc923190890b2 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.50.1",
+  "version": "4.50.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,8 +43,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=4.14.1 <5.0.0",
-    "@uifabric/styling": ">=0.24.0 <1.0.0",
+    "@uifabric/utilities": ">=4.15.0 <5.0.0",
+    "@uifabric/styling": ">=0.24.1 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 40316749f30fd..7e78efcfb168c 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.24.1",
+      "tag": "@uifabric/styling_v0.24.1",
+      "date": "Tue, 26 Sep 2017 10:09:04 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "724a69333e9c1b0833ef6f48c0fd6b49a2bf3a3a",
+            "comment": "Updating default theme registration to use the new `Customizations` helper."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.14.1 <5.0.0` to `>=4.15.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.24.0",
       "tag": "@uifabric/styling_v0.24.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index e128df8e93a54..005e4c500ebe3 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 14 Sep 2017 00:34:57 GMT and should not be manually modified.
+This log was last generated on Tue, 26 Sep 2017 10:09:04 GMT and should not be manually modified.
+
+## 0.24.1
+Tue, 26 Sep 2017 10:09:04 GMT
+
+### Patches
+
+- Updating default theme registration to use the new `Customizations` helper.
 
 ## 0.24.0
 Thu, 14 Sep 2017 00:34:57 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index e63b836743769..06e5a859063c5 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.24.0",
+  "version": "0.24.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -28,7 +28,7 @@
     "react-dom": "^15.4.2"
   },
   "dependencies": {
-    "@uifabric/utilities": ">=4.14.1 <5.0.0",
+    "@uifabric/utilities": ">=4.15.0 <5.0.0",
     "tslib": "^1.7.1",
     "rtl-css-js": "^1.1.3",
     "glamor": "^2.20.40"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index a9121ef6fd7ae..845f9e14f60d3 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.15.0",
+      "tag": "@uifabric/utilities_v4.15.0",
+      "date": "Tue, 26 Sep 2017 10:09:04 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "724a69333e9c1b0833ef6f48c0fd6b49a2bf3a3a",
+            "comment": "Updating Customizer to support `scopedSettings` prop. Adding a `Customizations` object for applying global and scoped customizations in non-React environments."
+          }
+        ]
+      }
+    },
     {
       "version": "4.14.1",
       "tag": "@uifabric/utilities_v4.14.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 8b39fc3e24bba..c8071a0f34e12 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Mon, 25 Sep 2017 10:19:18 GMT and should not be manually modified.
+This log was last generated on Tue, 26 Sep 2017 10:09:04 GMT and should not be manually modified.
+
+## 4.15.0
+Tue, 26 Sep 2017 10:09:04 GMT
+
+### Minor changes
+
+- Updating Customizer to support `scopedSettings` prop. Adding a `Customizations` object for applying global and scoped customizations in non-React environments.
 
 ## 4.14.1
 Mon, 25 Sep 2017 10:19:18 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 446c801f83c1f..467ef08177c3a 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.14.1",
+  "version": "4.15.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From ca4f39decd101d78fbd69cbebd901e282fb74282 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 26 Sep 2017 09:49:36 -0700
Subject: [PATCH 0718/1641] Latest merge-styles updates. (#2948)

* merge-styles updates.

* Updates to shrinkwrap.
---
 common/config/rush/npm-shrinkwrap.json        | 190 +++++++++---------
 packages/merge-styles/README.md               |  14 ++
 packages/merge-styles/package.json            |  21 +-
 .../src/{IRawStyle.ts => IRawStyleBase.ts}    |  29 +--
 packages/merge-styles/src/IStyle.ts           |  10 +-
 packages/merge-styles/src/Stylesheet.ts       |  29 ++-
 packages/merge-styles/src/fontFace.ts         |   2 +-
 packages/merge-styles/src/index.ts            |   5 +-
 .../merge-styles/src/styleToClassName.test.ts |   2 +-
 packages/merge-styles/src/styleToClassName.ts |  58 +++---
 .../src/transforms/provideUnits.ts            |  17 +-
 .../src/transforms/rtlifyRules.test.ts        |   4 +-
 .../src/transforms/rtlifyRules.ts             |   4 +-
 packages/utilities/package.json               |   2 +-
 14 files changed, 208 insertions(+), 179 deletions(-)
 rename packages/merge-styles/src/{IRawStyle.ts => IRawStyleBase.ts} (99%)

diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 90b2f5e56c9b7..3bdd398596a2a 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -2412,20 +2412,15 @@
       "resolved": "https://registry.npmjs.org/@types/es6-promise/-/es6-promise-0.0.32.tgz",
       "integrity": "sha1-O89E+x5Cnz33YYjIxth0Rjujcf0="
     },
-    "@types/es6-weak-map": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/@types/es6-weak-map/-/es6-weak-map-1.2.0.tgz",
-      "integrity": "sha1-2fb4WDaaiLvGnvQCOAgfLWu8hhQ="
-    },
     "@types/highlight.js": {
       "version": "9.1.9",
       "resolved": "https://registry.npmjs.org/@types/highlight.js/-/highlight.js-9.1.9.tgz",
       "integrity": "sha1-7WM2lV6vIzt163kjubHzc9BF7wE="
     },
     "@types/jest": {
-      "version": "20.0.8",
-      "resolved": "https://registry.npmjs.org/@types/jest/-/jest-20.0.8.tgz",
-      "integrity": "sha512-+vFMPCwOffrTy685X9Kj+Iz83I56Q8j0JK6xvsm6TA5qxbtPUJZcXtJY05WMGlhCKp/9qbpRCwyOp6GkMuyuLg=="
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.0.tgz",
+      "integrity": "sha512-7W+tgzauU0s467L7SG1GuHKr4jOmMTXOvR78LP6/YfuaM8JNRF+ayV2+vmNmlaBhbNPvckeJfak2aP+7VJ3g5A=="
     },
     "@types/mocha": {
       "version": "2.2.39",
@@ -2483,14 +2478,14 @@
       "integrity": "sha512-hy790+Zhsc3E75RWZHoZ7JRK0Mk+j0nf9rhwQZ7eA1+88ZuNo/6eBdeLC/5LynS7Fz35VVnMYWWFKxWumdrOxA=="
     },
     "@uifabric/styling": {
-      "version": "0.24.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.24.0.tgz",
-      "integrity": "sha512-Qmye+KeUqScYCPpCFgOQmOshIelXFhokEFNSa4PIVZMWYjl3JfpXDRogEL8gRgyl3qC4fcZas4GJxPfGswifyA=="
+      "version": "0.24.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.24.1.tgz",
+      "integrity": "sha512-ISyxQX49b+prLynZdELmN3q6q3ci47EdXwT/AM4HfIPrRaD0j0G80n0/aGWUZeJgZRgqZxleTmhmiIDZH1OEXg=="
     },
     "@uifabric/utilities": {
-      "version": "4.14.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.14.0.tgz",
-      "integrity": "sha512-+eUtdE/WeY1PidLwLZZhxtHEMMyHFz5GYjtBSVEtPTifkoa8jEl0PZmQjs0tbhXQcSb0tHSKGX0FVPtxPMe5Hw=="
+      "version": "4.15.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.15.0.tgz",
+      "integrity": "sha512-HtPcZi8F4GQg/Iv6vjrn5iIUPvOusu8LlmtPEOgYv6ZZAFDK+iLWEH319vMJBiqGo+mPfnrjQfDOjrWPUXoCzQ=="
     },
     "abab": {
       "version": "1.0.4",
@@ -2538,9 +2533,9 @@
       "integrity": "sha512-Y/9jgf3uEdNyeWPUV1N49FowM/qMIiKSTkRUpYT4jpHkSADfTiRVwI8Mm6o4CIxhnBK1uMf4RIYNYKwwILMCAQ=="
     },
     "ajv": {
-      "version": "5.2.2",
-      "resolved": "https://registry.npmjs.org/ajv/-/ajv-5.2.2.tgz",
-      "integrity": "sha1-R8aNaehvXZUxA7AHSpQw3GPaXjk="
+      "version": "5.2.3",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-5.2.3.tgz",
+      "integrity": "sha1-wG9Zh3jETGsWGrr+NGa4GtGBTtI="
     },
     "ajv-keywords": {
       "version": "2.1.0",
@@ -3083,9 +3078,9 @@
       "integrity": "sha512-NiOvvA9Pq6bki6nP4BayXwT5GZadw7DJFDDzHmkpnOQpENWe8RtHtKZM44MG1R6EQ5XxgbLdsdhswIzTkFlO5g=="
     },
     "babel-plugin-react-docgen": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-react-docgen/-/babel-plugin-react-docgen-1.7.0.tgz",
-      "integrity": "sha512-0Pw0sdu3W+NfVS048dqMetujQH6gXxCgd2tQGmUmgP/iNNlSbd7aDFj0e8xDmuZQRMy6UNC29zhMpnJJ0xc5BQ=="
+      "version": "1.8.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-react-docgen/-/babel-plugin-react-docgen-1.8.0.tgz",
+      "integrity": "sha512-rYAV4AthS8WgfEY/LaHeNvrtChXbG8w8pKX42ghPNeEB7ZCdk0Qy/ZzYSdR5ITQxh4ZEDu+pMAqfxu3t9mrK4w=="
     },
     "babel-plugin-syntax-async-functions": {
       "version": "6.13.0",
@@ -3825,14 +3820,14 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000735",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000735.tgz",
-      "integrity": "sha1-MrxKB+8fJHR0rbYJegMblMqX6po="
+      "version": "1.0.30000738",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000738.tgz",
+      "integrity": "sha1-hICavEmjkOWowiSrk2nT+NAaogI="
     },
     "caniuse-lite": {
-      "version": "1.0.30000735",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000735.tgz",
-      "integrity": "sha1-qrRAFu8kPiFe9D/RND79IpMIQvg="
+      "version": "1.0.30000738",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000738.tgz",
+      "integrity": "sha1-GCDDya25oRfjEaW9yh0lvDQojro="
     },
     "cardinal": {
       "version": "1.0.0",
@@ -4241,9 +4236,9 @@
       "integrity": "sha1-rLniIaThe9sHbpBlfEK5PjcmzwY="
     },
     "create-react-class": {
-      "version": "15.6.0",
-      "resolved": "https://registry.npmjs.org/create-react-class/-/create-react-class-15.6.0.tgz",
-      "integrity": "sha1-q0SEl8JlZuHilBPogyB9V8/nvtQ="
+      "version": "15.6.2",
+      "resolved": "https://registry.npmjs.org/create-react-class/-/create-react-class-15.6.2.tgz",
+      "integrity": "sha1-zx7RXxKq1/FO9fLf4F5sQvke8Co="
     },
     "cross-spawn": {
       "version": "5.1.0",
@@ -4700,9 +4695,9 @@
       "integrity": "sha1-zIcsFoiArjxxiXYv1f/ACJbJUYo="
     },
     "electron-to-chromium": {
-      "version": "1.3.21",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.21.tgz",
-      "integrity": "sha1-qWfr3P6O0Ag/wkTRiUAiqOgRPqI="
+      "version": "1.3.22",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.22.tgz",
+      "integrity": "sha1-QyLVLBUUBuPq73StAmdog+hBZBg="
     },
     "elliptic": {
       "version": "6.4.0",
@@ -5029,15 +5024,10 @@
       "integrity": "sha512-gBmUVy+A4+brj/MnuiwLe+MIMfSffWUmZMNjKHrMkB0cpkAjnFdwHAxs6MvYeh4+14ocp+SfKp4ebNEhkbV3YQ=="
     },
     "express": {
-      "version": "4.15.4",
-      "resolved": "https://registry.npmjs.org/express/-/express-4.15.4.tgz",
-      "integrity": "sha1-Ay4iU0ic+PzgJma+yj0R7XotrtE=",
+      "version": "4.15.5",
+      "resolved": "https://registry.npmjs.org/express/-/express-4.15.5.tgz",
+      "integrity": "sha1-ZwI1ypWYiQpa6BcLg9tyK4Qu2Sc=",
       "dependencies": {
-        "debug": {
-          "version": "2.6.8",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
-          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
-        },
         "path-to-regexp": {
           "version": "0.1.7",
           "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
@@ -5133,9 +5123,9 @@
       "integrity": "sha1-VOmr99+i8mzZsWNsWIwa/AXeXVg="
     },
     "fbjs": {
-      "version": "0.8.15",
-      "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.15.tgz",
-      "integrity": "sha1-TwaV/fzBbDfAsH+s7Iy0xAkWhbk=",
+      "version": "0.8.16",
+      "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.16.tgz",
+      "integrity": "sha1-XmdDL1UNxBtXK/VYR7ispk5TN9s=",
       "dependencies": {
         "core-js": {
           "version": "1.2.7",
@@ -5257,9 +5247,9 @@
       "integrity": "sha1-QpD60n8T6Jvn8zeZxrxaCr//DRk="
     },
     "fresh": {
-      "version": "0.5.0",
-      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.0.tgz",
-      "integrity": "sha1-9HTKXmqSRtb9jglTz6m5yAWvp44="
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz",
+      "integrity": "sha1-PYyt2Q2XZWn6g1qx+OSyOhBWBac="
     },
     "fs-extra": {
       "version": "1.0.0",
@@ -5376,9 +5366,9 @@
       "integrity": "sha512-DNXCd+c14N9QF8aAKrfl4xakPk5FdcFwmH7sD0qnC0Pr7xoZ5W9yovhUrY/dJc3psfGGXC58vqQyRtuskyUJxA=="
     },
     "glamorous": {
-      "version": "4.9.5",
-      "resolved": "https://registry.npmjs.org/glamorous/-/glamorous-4.9.5.tgz",
-      "integrity": "sha512-yz9D8M8Yfic0LJ37J1GELXztfu5M2SYsu146wzku8Vq/V6N1SSSJWmBtaHB8emEpql9jhFwfh3Fc1lDKllp2Yg=="
+      "version": "4.9.7",
+      "resolved": "https://registry.npmjs.org/glamorous/-/glamorous-4.9.7.tgz",
+      "integrity": "sha512-4Ts/k1fCvRez1k6xYIuXQqFmVG1RjbpQZOHNCWSteY1Tza4YeyExkj4SypAhCspcAzkjvqaUboaLmSfMmx9uLQ=="
     },
     "glob": {
       "version": "7.1.2",
@@ -7332,9 +7322,9 @@
       "integrity": "sha1-SmL7HUKTPAVYOYL0xxb2+55sbT0="
     },
     "mime": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/mime/-/mime-1.4.0.tgz",
-      "integrity": "sha512-n9ChLv77+QQEapYz8lV+rIZAW3HhAPW2CXnzb1GN5uMkuczshwvkW7XPsbzU0ZQN3sP47Er2KVkp2p3KyqZKSQ=="
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/mime/-/mime-1.4.1.tgz",
+      "integrity": "sha512-KI1+qOZu5DcW6wayYHSzR/tXKCDC5Om4s1z2QJjDULzLcmf3DvzS7oluY4HCTrc+9FiKmWUgeNLg7W3uIQvxtQ=="
     },
     "mime-db": {
       "version": "1.30.0",
@@ -7659,9 +7649,9 @@
       "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0="
     },
     "nwmatcher": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/nwmatcher/-/nwmatcher-1.4.1.tgz",
-      "integrity": "sha1-eumwew6oBNt+JfBctf5Al9TklJ8="
+      "version": "1.4.2",
+      "resolved": "https://registry.npmjs.org/nwmatcher/-/nwmatcher-1.4.2.tgz",
+      "integrity": "sha512-QMkCGQFYp5p+zwU3INntLmz1HMfSx9dMVJMYKmE1yuSf/22Wjo6VPFa405mCLUuQn9lbQvH2DZN9lt10ZNvtAg=="
     },
     "oauth-sign": {
       "version": "0.8.2",
@@ -7763,9 +7753,9 @@
       "integrity": "sha1-43rwTiOwkfZTYNsknbi7DzEpH2A="
     },
     "office-ui-fabric-react": {
-      "version": "4.50.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.50.0.tgz",
-      "integrity": "sha512-UHrhSH1f51CANm9vRNeQb37hnrpj6lrVtZXy6nE8DUoTtAtLizEGkXUHRZ/3RsqIk+8cTpyf9QY0tW51cZYKtQ=="
+      "version": "4.50.2",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.50.2.tgz",
+      "integrity": "sha512-UIRtfmFsE/8UxvhI43mKuMKcLFFl7AM8Bl1qPRYw0XYjDEQqRc3hRH/vGrBZ0PXcqEG3w9I+ceYG88RNNvynrw=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -8145,9 +8135,9 @@
       "integrity": "sha1-AerA/jta9xoqbAL+q7jB/vfgDqs="
     },
     "postcss": {
-      "version": "6.0.11",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.11.tgz",
-      "integrity": "sha512-DsnIzznNRQprsGTALpkC0xjDygo+QcOd+qVjP9+RjyzrPiyYOXBGOwoJ4rAiiE4lu6JggQ/jW4niY24WLxuncg=="
+      "version": "6.0.12",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.12.tgz",
+      "integrity": "sha512-K6SLofXEK43FBSyZ6/ExQV7ji24OEw4tEY6x1CAf7+tcoMWJoO24Rf3rVFVpk+5IQL1e1Cy3sTKfg7hXuLzafg=="
     },
     "postcss-calc": {
       "version": "5.3.1",
@@ -9252,9 +9242,9 @@
       "integrity": "sha1-StIXuzZYvKrplGsXqGaOzYUeE1Y="
     },
     "prop-types": {
-      "version": "15.5.10",
-      "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.5.10.tgz",
-      "integrity": "sha1-J5ffwxJhguOpXj37suiT3ddFYVQ="
+      "version": "15.6.0",
+      "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.6.0.tgz",
+      "integrity": "sha1-zq8IMCL8RrSjX2nhPvda7Q1jmFY="
     },
     "proxy-addr": {
       "version": "1.1.5",
@@ -9395,9 +9385,9 @@
       "integrity": "sha1-AVNj8FsKH9Uq6e/dOgBg2QaVII8="
     },
     "react-dom-factories": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/react-dom-factories/-/react-dom-factories-1.0.1.tgz",
-      "integrity": "sha1-xQaSrF/xrbOdht/m2+NIXaz1hFU="
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/react-dom-factories/-/react-dom-factories-1.0.2.tgz",
+      "integrity": "sha1-63cFxNs2+1AbOqOP91lhaqD/luA="
     },
     "react-highlight": {
       "version": "0.9.0",
@@ -9427,9 +9417,9 @@
       "integrity": "sha1-+UJQHCGkzARWziu+5QMsk/YFHc8="
     },
     "react-inspector": {
-      "version": "2.1.4",
-      "resolved": "https://registry.npmjs.org/react-inspector/-/react-inspector-2.1.4.tgz",
-      "integrity": "sha1-ISP6t09orjE2+9AjkvrbdkMm0E0="
+      "version": "2.1.6",
+      "resolved": "https://registry.npmjs.org/react-inspector/-/react-inspector-2.1.6.tgz",
+      "integrity": "sha512-YAM/GXQq457luk1u00ChwpxZ9MICXAgs+9XqL5DNml/jLJWBApHjbzLbT5rgU1g6MVCKO2TxFPAiLnKNZ70FBg=="
     },
     "react-komposer": {
       "version": "2.0.0",
@@ -9729,9 +9719,9 @@
       "integrity": "sha1-7dOQk6MYQ3DLhZJDsr3yVefY6mc="
     },
     "sane": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/sane/-/sane-2.0.0.tgz",
-      "integrity": "sha1-mct58h9KU6adTQzZV8LbBAJLjrI=",
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/sane/-/sane-2.2.0.tgz",
+      "integrity": "sha512-OSJxhHO0CgPUw3lUm3GhfREAfza45smvEI9ozuFrxKG10GHVo0ryW9FK5VYlLvxj0SV7HVKHW0voYJIRu27GWg==",
       "dependencies": {
         "minimist": {
           "version": "1.2.0",
@@ -9945,9 +9935,9 @@
       }
     },
     "screener-storybook": {
-      "version": "0.9.1",
-      "resolved": "https://registry.npmjs.org/screener-storybook/-/screener-storybook-0.9.1.tgz",
-      "integrity": "sha1-3SnlbfcHCmwGeMEp9d4psY/f4VA=",
+      "version": "0.9.2",
+      "resolved": "https://registry.npmjs.org/screener-storybook/-/screener-storybook-0.9.2.tgz",
+      "integrity": "sha1-6HF44p3DkPM1+yBxwwPCMn30ANg=",
       "dependencies": {
         "acorn": {
           "version": "2.7.0",
@@ -10104,9 +10094,9 @@
           "integrity": "sha1-xpKJRqDgbF+Nb4qTM0af/aRimKA="
         },
         "screener-runner": {
-          "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/screener-runner/-/screener-runner-0.7.1.tgz",
-          "integrity": "sha1-Tt3qLX6/h2iQ8f0aIRb7bKgU02w=",
+          "version": "0.7.2",
+          "resolved": "https://registry.npmjs.org/screener-runner/-/screener-runner-0.7.2.tgz",
+          "integrity": "sha1-FjjwanxTh2jqNbPR4NnPuSUTJRY=",
           "dependencies": {
             "caseless": {
               "version": "0.11.0",
@@ -10212,15 +10202,10 @@
       "integrity": "sha1-d0Zt5YnNXTyV8TiqeLxWmjy10no="
     },
     "send": {
-      "version": "0.15.4",
-      "resolved": "https://registry.npmjs.org/send/-/send-0.15.4.tgz",
-      "integrity": "sha1-mF+qPihLAnPHkzZKNcZze9k5Bbk=",
+      "version": "0.15.6",
+      "resolved": "https://registry.npmjs.org/send/-/send-0.15.6.tgz",
+      "integrity": "sha1-IPI6nJJbdiq4JwX+L52yUqzkfjQ=",
       "dependencies": {
-        "debug": {
-          "version": "2.6.8",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
-          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
-        },
         "mime": {
           "version": "1.3.4",
           "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz",
@@ -10253,9 +10238,9 @@
       }
     },
     "serve-static": {
-      "version": "1.12.4",
-      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.12.4.tgz",
-      "integrity": "sha1-m2qpjutyU8Tu3Ewfb9vKYJkBqWE="
+      "version": "1.12.6",
+      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.12.6.tgz",
+      "integrity": "sha1-uXN3P2NEmTTaVOW+ul4x2fQhFXc="
     },
     "set-blocking": {
       "version": "2.0.0",
@@ -10295,9 +10280,9 @@
       "integrity": "sha1-ZlZ+NwQ+608E2RvWWMDL77VbjgQ="
     },
     "sha.js": {
-      "version": "2.4.8",
-      "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.8.tgz",
-      "integrity": "sha1-NwaMLEdra69ALRSknGf1l5IfY08="
+      "version": "2.4.9",
+      "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.9.tgz",
+      "integrity": "sha512-G8zektVqbiPHrylgew9Zg1VRB1L/DtXNUVAM6q4QLy8NE3qtHlFXTf8VLL4k1Yl6c7NMjtZUTdXV+X44nFaT6A=="
     },
     "shallow-clone": {
       "version": "0.1.2",
@@ -11375,9 +11360,9 @@
       "integrity": "sha1-KAS6vnEq0zeUWaz74kdGqywwP7w="
     },
     "vary": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.1.tgz",
-      "integrity": "sha1-Z1Neu2lMHVIldFeYRmUyP1h+jTc="
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
+      "integrity": "sha1-IpnwLG3tMNSllhsLn3RSShj2NPw="
     },
     "velocity-animate": {
       "version": "1.5.0",
@@ -11427,9 +11412,16 @@
       "integrity": "sha1-MuU3fLVy3kqwR1O9+IIcAe1gW3w="
     },
     "watch": {
-      "version": "0.10.0",
-      "resolved": "https://registry.npmjs.org/watch/-/watch-0.10.0.tgz",
-      "integrity": "sha1-d3mLLaD5kQ1ZXxrOWwwiWFIfIdw="
+      "version": "0.18.0",
+      "resolved": "https://registry.npmjs.org/watch/-/watch-0.18.0.tgz",
+      "integrity": "sha1-KAlUdsbffJDJYxOJkMClQj60uYY=",
+      "dependencies": {
+        "minimist": {
+          "version": "1.2.0",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
+          "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
+        }
+      }
     },
     "watchpack": {
       "version": "1.4.0",
diff --git a/packages/merge-styles/README.md b/packages/merge-styles/README.md
index 8ab309149676f..80727264cd428 100644
--- a/packages/merge-styles/README.md
+++ b/packages/merge-styles/README.md
@@ -217,6 +217,20 @@ export const getClassNames = (
 };
 ```
 
+## RTL support
+
+By default, nearly all of the major rtl-sensitive CSS properties will be auto flipped when the dir="rtl" flag is present on the `HTML` tag of the page.
+
+There are some rare scenarios (linear-gradients, etc) which are not flipped, for the sake of keeping the bundle size to a minimum. If there are missing edge cases, please submit a PR to address.
+
+In rare condition where you want to avoid auto flipping, you can annotate the rule with the `@noflip` directive:
+
+```tsx
+mergeStyles({
+  left: '42px @noflip'
+});
+```
+
 ## Optimizing for performance
 
 Resolving the class names on every render can be an unwanted expense especially in hot spots where things are rendered frequently. To optimize, we recommend 2 guidelines:
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index 7af6c81645ca4..a5b89e789a85e 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -15,28 +15,13 @@
     "start-test": "node ../../scripts/start-test.js"
   },
   "disabledTasks": [
-    "sass",
     "copy",
+    "sass",
     "karma"
   ],
   "devDependencies": {
-    "@types/jest": "^20.0.8",
-    "@types/es6-promise": "^0.0.32",
-    "@types/es6-weak-map": "1.2.0",
-    "@types/mocha": "2.2.39",
-    "@types/prop-types": "15.5.1",
-    "@types/react": "15.0.38",
-    "@types/react-addons-test-utils": "0.14.18",
-    "@types/react-dom": "15.5.1",
-    "@types/sinon": "2.2.2",
-    "@types/webpack-env": "1.13.0",
-    "enzyme": "^2.7.0",
-    "es6-map": "^0.1.5",
-    "es6-weak-map": "^2.0.2",
-    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
-    "react": "^15.4.2",
-    "react-addons-test-utils": "^15.4.2",
-    "react-dom": "^15.4.2"
+    "@types/jest": "21.1.0",
+    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0"
   },
   "dependencies": {
     "tslib": "^1.7.1"
diff --git a/packages/merge-styles/src/IRawStyle.ts b/packages/merge-styles/src/IRawStyleBase.ts
similarity index 99%
rename from packages/merge-styles/src/IRawStyle.ts
rename to packages/merge-styles/src/IRawStyleBase.ts
index a8fbd9aa62a3f..3e1eaf6180a89 100644
--- a/packages/merge-styles/src/IRawStyle.ts
+++ b/packages/merge-styles/src/IRawStyleBase.ts
@@ -157,7 +157,12 @@ export interface IFontFace extends IRawFontStyle {
  *
  * @public
  */
-export interface IRawStyle extends IRawFontStyle {
+export interface IRawStyleBase extends IRawFontStyle {
+  /**
+   * (Ms specific) constrast adjust rule.
+   */
+  MsHighContrastAdjust?: ICSSRule | string;
+
   /**
    * (Moz specific) font smoothing directive.
    */
@@ -577,12 +582,6 @@ export interface IRawStyle extends IRawFontStyle {
    */
   clear?: ICSSRule | string;
 
-  /**
-   * This feature has been removed from the Web standards. Though some
-   * browsers may still support it, it is in the process of being dropped.
-   */
-  clip?: void;
-
   /**
    * Clipping crops an graphic, so that only a portion of the graphic is rendered, or
    * filled. This clip-rule property, when used with the clip-path property, defines
@@ -737,14 +736,14 @@ export interface IRawStyle extends IRawFontStyle {
   /**
    * Shorthand for `flex-grow`, `flex-shrink`, and `flex-basis`.
    */
-  flex?: ICSSRule | ICSSPixelUnitRule;
+  flex?: ICSSRule | string | number;
 
   /**
    * The flex-basis CSS property describes the initial main size of the flex item before
    * any free space is distributed according to the flex factors described in the flex
    * property (flex-grow and flex-shrink).
    */
-  flexBasis?: ICSSRule | string;
+  flexBasis?: ICSSRule | string | number;
 
   /**
    * The flex-direction CSS property describes how flex items are placed in the flex
@@ -762,19 +761,13 @@ export interface IRawStyle extends IRawFontStyle {
    * Specifies the flex grow factor of a flex item.
    * See CSS flex-grow property https://drafts.csswg.org/css-flexbox-1/#flex-grow-property
    */
-  flexGrow?: ICSSRule | number;
-
-  /**
-   * Gets or sets a value that specifies the ordinal group that a flexbox element
-   *  belongs to. This ordinal value identifies the display order for the group.
-   */
-  flexOrder?: ICSSRule | string;
+  flexGrow?: ICSSRule | number | string;
 
   /**
    * Specifies the flex shrink factor of a flex item.
    * See CSS flex-shrink property https://drafts.csswg.org/css-flexbox-1/#flex-shrink-property
    */
-  flexShrink?: ICSSRule | number;
+  flexShrink?: ICSSRule | number | string;
 
   /**
    * Specifies whether flex items are forced into a single line or can be wrapped onto
@@ -931,7 +924,7 @@ export interface IRawStyle extends IRawFontStyle {
    * Specifies the height of an inline block level element.
    * See CSS 2.1 line-height property https://www.w3.org/TR/CSS21/visudet.html#propdef-line-height
    */
-  lineHeight?: ICSSRule | 'normal' | number | ICSSPixelUnitRule | ICSSPercentageRule;
+  lineHeight?: ICSSRule | 'normal' | ICSSPixelUnitRule | ICSSPercentageRule;
 
   /**
    * Shorthand property that sets the list-style-type, list-style-position and
diff --git a/packages/merge-styles/src/IStyle.ts b/packages/merge-styles/src/IStyle.ts
index 4a46df0baaf59..770aa641a178f 100644
--- a/packages/merge-styles/src/IStyle.ts
+++ b/packages/merge-styles/src/IStyle.ts
@@ -1,11 +1,11 @@
-import { IRawStyle } from './IRawStyle';
+import { IRawStyleBase } from './IRawStyleBase';
 
 /**
  * IStyleObject extends a raw style objects, but allows selectors to be defined
  * under the selectors node.
  * @public
  */
-export interface IExtendedRawStyle extends IRawStyle {
+export interface IRawStyle extends IRawStyleBase {
   /**
    * Display name for the style.
    */
@@ -19,11 +19,13 @@ export interface IExtendedRawStyle extends IRawStyle {
   };
 }
 
-export type IStyleBase = IExtendedRawStyle | string | false | null | undefined;
+export type IStyleBase = IRawStyle | string | false | null | undefined;
+
+export interface IStyleBaseArray extends Array<IStyle> { }
 
 /**
  * IStyleObject extends a raw style objects, but allows selectors to be defined
  * under the selectors node.
  * @public
  */
-export type IStyle = IStyleBase | IStyleBase[] | IStyleBase[][] | IStyleBase[][][];
+export type IStyle = IStyleBase | IStyleBaseArray;
diff --git a/packages/merge-styles/src/Stylesheet.ts b/packages/merge-styles/src/Stylesheet.ts
index 5b26b175bffa0..4a285eb9b9c12 100644
--- a/packages/merge-styles/src/Stylesheet.ts
+++ b/packages/merge-styles/src/Stylesheet.ts
@@ -1,5 +1,4 @@
 import { IStyle } from './IStyle';
-
 /**
  * Injection mode for the stylesheet.
  *
@@ -50,7 +49,7 @@ export class Stylesheet {
   private _keyToClassName: { [key: string]: string };
 
   // tslint:disable-next-line:no-any
-  private _classNameToArgs: { [key: string]: any };
+  private _classNameToArgs: { [key: string]: { args: any, rules: string[] } };
 
   /**
    * Gets the singleton instance.
@@ -102,9 +101,17 @@ export class Stylesheet {
    * Used internally to cache information about a class which was
    * registered with the stylesheet.
    */
-  public cacheClassName(className: string, key: string, args: IStyle[]): void {
+  public cacheClassName(
+    className: string,
+    key: string,
+    args: IStyle[],
+    rules: string[]
+  ): void {
     this._keyToClassName[key] = className;
-    this._classNameToArgs[className] = args;
+    this._classNameToArgs[className] = {
+      args,
+      rules
+    };
   }
 
   /**
@@ -120,7 +127,19 @@ export class Stylesheet {
    * previously registered using cacheClassName.
    */
   public argsFromClassName(className: string): IStyle[] | undefined {
-    return this._classNameToArgs[className];
+    const entry = this._classNameToArgs[className];
+
+    return (entry && entry.args);
+  }
+
+  /**
+ * Gets the arguments associated with a given classname which was
+ * previously registered using cacheClassName.
+ */
+  public insertedRulesFromClassName(className: string): string[] | undefined {
+    const entry = this._classNameToArgs[className];
+
+    return (entry && entry.rules);
   }
 
   /**
diff --git a/packages/merge-styles/src/fontFace.ts b/packages/merge-styles/src/fontFace.ts
index 67785016c2b39..fb00ddf59023c 100644
--- a/packages/merge-styles/src/fontFace.ts
+++ b/packages/merge-styles/src/fontFace.ts
@@ -1,5 +1,5 @@
 import { Stylesheet } from './Stylesheet';
-import { IFontFace } from './IRawStyle';
+import { IFontFace } from './IRawStyleBase';
 import { serializeRuleEntries } from './styleToClassName';
 
 /**
diff --git a/packages/merge-styles/src/index.ts b/packages/merge-styles/src/index.ts
index 785f94b3ab876..5b124f37a0e60 100644
--- a/packages/merge-styles/src/index.ts
+++ b/packages/merge-styles/src/index.ts
@@ -1,5 +1,5 @@
 export {
-  IExtendedRawStyle,
+  IRawStyle,
   IStyle
 } from './IStyle';
 
@@ -8,10 +8,9 @@ export {
 } from './IStyleSet';
 
 export {
-  IRawStyle,
   IFontFace,
   IFontWeight
-} from './IRawStyle';
+} from './IRawStyleBase';
 
 export {
   mergeStyles
diff --git a/packages/merge-styles/src/styleToClassName.test.ts b/packages/merge-styles/src/styleToClassName.test.ts
index e7ceed1f05327..948074097379a 100644
--- a/packages/merge-styles/src/styleToClassName.test.ts
+++ b/packages/merge-styles/src/styleToClassName.test.ts
@@ -1,4 +1,3 @@
-import 'es6-map/implement';
 import { setRTL } from './transforms/rtlifyRules';
 import { styleToClassName } from './styleToClassName';
 import {
@@ -11,6 +10,7 @@ const _stylesheet: Stylesheet = Stylesheet.getInstance();
 _stylesheet.setConfig({ injectionMode: InjectionMode.none });
 
 describe('styleToClassName', () => {
+
   beforeEach(() => {
     _stylesheet.reset();
   });
diff --git a/packages/merge-styles/src/styleToClassName.ts b/packages/merge-styles/src/styleToClassName.ts
index 5f298bb37e8a3..4a28eaca9732e 100644
--- a/packages/merge-styles/src/styleToClassName.ts
+++ b/packages/merge-styles/src/styleToClassName.ts
@@ -3,27 +3,36 @@ import { provideUnits } from './transforms/provideUnits';
 import { prefixRules } from './transforms/prefixRules';
 import { kebabRules } from './transforms/kebabRules';
 import { Stylesheet } from './Stylesheet';
-import { IStyle, IExtendedRawStyle } from './IStyle';
+import { IStyle, IRawStyle } from './IStyle';
 
 const DISPLAY_NAME = 'displayName';
 
-function getDisplayName(rules?: Map<string, IStyle>): string | undefined {
-  const rootStyle: IStyle = rules && rules.get('&');
+// tslint:disable-next-line:no-any
+type IDictionary = { [key: string]: any };
 
-  return rootStyle ? (rootStyle as IExtendedRawStyle).displayName : undefined;
+interface IRuleSet {
+  __order: string[];
+  [key: string]: IDictionary;
+}
+
+function getDisplayName(rules?: { [key: string]: IRawStyle }): string | undefined {
+  const rootStyle: IStyle = rules && rules['&'];
+
+  return rootStyle ? (rootStyle as IRawStyle).displayName : undefined;
 }
 
 function extractRules(
   args: IStyle[],
-  rules: Map<string, {}> = new Map<string, {}>(),
+  rules: IRuleSet = { __order: [] },
   currentSelector: string = '&'
-): Map<string, {}> {
+): IRuleSet {
   const stylesheet = Stylesheet.getInstance();
-  let currentRules: {} | undefined = rules.get(currentSelector);
+  let currentRules: IDictionary | undefined = rules[currentSelector] as IDictionary;
 
   if (!currentRules) {
     currentRules = {};
-    rules.set(currentSelector, currentRules);
+    rules[currentSelector] = currentRules;
+    rules.__order.push(currentSelector);
   }
 
   for (const arg of args) {
@@ -72,31 +81,33 @@ function extractRules(
 }
 
 function expandQuads(
-  currentRules: { [key: string]: string },
+  currentRules: IDictionary,
   name: string,
   value: string
 ): void {
-  const parts = value.split(' ');
+  const parts = (typeof value === 'string') ? value.split(' ') : [value];
+
   currentRules[name + 'Top'] = parts[0];
   currentRules[name + 'Right'] = parts[1] || parts[0];
   currentRules[name + 'Bottom'] = parts[2] || parts[0];
   currentRules[name + 'Left'] = parts[3] || parts[1] || parts[0];
 }
 
-function getKeyForRules(rules: Map<string, IStyle>): string | undefined {
+function getKeyForRules(rules: IRuleSet): string | undefined {
   const serialized: string[] = [];
   let hasProps = false;
 
-  rules.forEach((ruleEntries: { [key: string]: string }, selector: string): void => {
+  for (const selector of rules.__order) {
     serialized.push(selector);
+    const rulesForSelector = rules[selector];
 
-    for (const propName in ruleEntries) {
-      if (ruleEntries.hasOwnProperty(propName)) {
+    for (const propName in rulesForSelector) {
+      if (rulesForSelector.hasOwnProperty(propName)) {
         hasProps = true;
-        serialized.push(propName, ruleEntries[propName]);
+        serialized.push(propName, rulesForSelector[propName]);
       }
     }
-  });
+  }
 
   return hasProps ? serialized.join('') : undefined;
 }
@@ -131,7 +142,7 @@ export function serializeRuleEntries(ruleEntries: { [key: string]: string | numb
 }
 
 export function styleToClassName(...args: IStyle[]): string {
-  const rules: Map<string, IStyle> = extractRules(args);
+  const rules: IRuleSet = extractRules(args);
   const key = getKeyForRules(rules);
   let className = '';
 
@@ -142,20 +153,19 @@ export function styleToClassName(...args: IStyle[]): string {
 
     if (!className) {
       className = stylesheet.getClassName(getDisplayName(rules));
-      stylesheet.cacheClassName(className, key, args);
-
-      const ruleSelectors = rules.keys();
-      let selector = ruleSelectors.next().value;
+      const registeredRules: string[] = [];
 
-      while (selector) {
-        const rulesToInsert: string = serializeRuleEntries(rules.get(selector) as {});
+      for (let selector of rules.__order) {
+        const rulesToInsert: string = serializeRuleEntries(rules[selector]);
 
         if (rulesToInsert) {
+          registeredRules.push(selector, rulesToInsert);
           selector = selector.replace(/\&/g, `.${className}`);
           stylesheet.insertRule(`${selector}{${rulesToInsert}}`);
         }
-        selector = ruleSelectors.next().value;
       }
+
+      stylesheet.cacheClassName(className, key, args, registeredRules);
     }
   }
 
diff --git a/packages/merge-styles/src/transforms/provideUnits.ts b/packages/merge-styles/src/transforms/provideUnits.ts
index 9b3c4b5fa2132..86d3997c03bc8 100644
--- a/packages/merge-styles/src/transforms/provideUnits.ts
+++ b/packages/merge-styles/src/transforms/provideUnits.ts
@@ -1,3 +1,16 @@
+const NON_PIXEL_NUMBER_PROPS = [
+  'column-count',
+  'font-weight',
+  'flex-basis',
+  'flex',
+  'flex-grow',
+  'flex-shrink',
+  'opacity',
+  'order',
+  'z-index',
+  'zoom'
+];
+
 export function provideUnits(
   rulePairs: (string | number)[],
   index: number
@@ -6,8 +19,8 @@ export function provideUnits(
   const value = rulePairs[index + 1];
 
   if (
-    name !== 'opacity' &&
-    typeof value === 'number'
+    typeof value === 'number' &&
+    NON_PIXEL_NUMBER_PROPS.indexOf(name as string) === -1
   ) {
     rulePairs[index + 1] = `${value}px`;
   }
diff --git a/packages/merge-styles/src/transforms/rtlifyRules.test.ts b/packages/merge-styles/src/transforms/rtlifyRules.test.ts
index 209a367045edc..74d9f87123a9a 100644
--- a/packages/merge-styles/src/transforms/rtlifyRules.test.ts
+++ b/packages/merge-styles/src/transforms/rtlifyRules.test.ts
@@ -32,7 +32,9 @@ describe('rtlifyRules', () => {
       [['cursor', 'w-resize'], ['cursor', 'e-resize']],
       [['cursor', 'sw-resize'], ['cursor', 'se-resize']],
       [['cursor', 'nw-resize'], ['cursor', 'ne-resize']],
-      [['left', '42px /*noflip*/'], ['left', '42px /*noflip*/']],
+      [['left', '42px /* @noflip */'], ['left', '42px']],
+      [['left', '42px @noflip'], ['left', '42px']],
+      [['left', '42px /*@noflip*/'], ['left', '42px']],
       [['box-shadow', '42px 0 red'], ['box-shadow', '-42px 0 red']],
       [['box-shadow', '-42px 0 red'], ['box-shadow', '42px 0 red']]
     ].forEach((test: string[][]) => {
diff --git a/packages/merge-styles/src/transforms/rtlifyRules.ts b/packages/merge-styles/src/transforms/rtlifyRules.ts
index 59f4ac20e8557..af57b70ffc528 100644
--- a/packages/merge-styles/src/transforms/rtlifyRules.ts
+++ b/packages/merge-styles/src/transforms/rtlifyRules.ts
@@ -9,7 +9,7 @@ const _valueReplacements: { [key: string]: string } = {
   'nw-resize': 'ne-resize'
 };
 
-const NO_FLIP = 'noflip';
+const NO_FLIP = '@noflip';
 
 let _rtl = getRTL();
 
@@ -36,7 +36,7 @@ export function rtlifyRules(
     const value = rulePairs[index + 1] as string;
 
     if (value.indexOf(NO_FLIP) >= 0) {
-      return;
+      rulePairs[index + 1] = value.replace(/\s*(?:\/\*\s*)?\@noflip\b(?:\s*\*\/)?\s*?/g, '');
     } else if (name.indexOf('left') >= 0) {
       rulePairs[index] = name.replace('left', 'right');
     } else if (name.indexOf('right') >= 0) {
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 467ef08177c3a..6e547aea817f4 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -20,7 +20,7 @@
     "webpack"
   ],
   "devDependencies": {
-    "@types/jest": "20.0.8",
+    "@types/jest": "21.1.0",
     "@types/enzyme": "2.8.0",
     "@types/prop-types": "15.5.1",
     "@types/react": "15.0.38",

From 6ee1b94057544f44118d1a2e1846cfdf6df2e014 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 26 Sep 2017 10:31:38 -0700
Subject: [PATCH 0719/1641] Visual test cleanup (#2952)

* Removed old visual testing files

* change file
---
 .../visual-test-cleanup_2017-09-26-16-46.json |  11 +
 ghdocs/VISUALTESTS.md                         |  82 --
 .../CommandBar/CommandBar.visualtest.ts       |  37 -
 .../CommandBar/CommandBarPage.visualtest.tsx  |  42 -
 packages/office-ui-fabric-react/.npmignore    |   3 +-
 .../src/VisualTestRoot.tsx                    |  95 ---
 .../src/VisualTestState.ts                    |  22 -
 .../src/common/VisualTest.ts                  |   1 -
 .../Breadcrumb/Breadcrumb.visualtest.ts       |  29 -
 .../Breadcrumb/BreadcrumbPage.visualtest.tsx  |  26 -
 .../components/Button/Button.visualtest.ts    | 103 ---
 .../Button/ButtonPage.visualtest.tsx          | 136 ----
 .../Checkbox/Checkbox.visualtest.ts           |  29 -
 .../Checkbox/CheckboxPage.visualtest.tsx      |  23 -
 .../ChoiceGroup/ChoiceGroup.visualtest.ts     |  37 -
 .../ChoiceGroupPage.visualtest.tsx            |  66 --
 .../ComboBox/ComboBox.visualtest.ts           |  29 -
 .../ComboBox/ComboBoxPage.visualtest.tsx      |  31 -
 .../CommandBar/CommandBar.visualtest.ts       |  37 -
 .../CommandBar/CommandBarPage.visualtest.tsx  |  40 -
 .../ContextualMenu.visualtest.ts              |  27 -
 .../ContextualMenuPage.visualtest.tsx         |  32 -
 .../DetailsList/DetailsList.visualtest.ts     |  27 -
 .../DetailsListPage.visualtest.tsx            |  26 -
 .../components/Dialog/Dialog.visualtest.ts    |  21 -
 .../Dialog/DialogPage.visualtest.tsx          |  25 -
 .../DocumentCard/DocumentCard.visualtest.ts   |  22 -
 .../DocumentCardPage.visualtest.tsx           |  38 -
 .../Facepile/Facepile.visualtest.ts           |  20 -
 .../Facepile/FacepilePage.visualtest.tsx      |  28 -
 .../src/components/Label/Label.visualtest.ts  |  31 -
 .../components/Label/LabelPage.visualtest.tsx |  18 -
 .../components/Toggle/Toggle.visualtest.ts    |  21 -
 .../Toggle/TogglePage.visualtest.tsx          |  21 -
 .../components/Tooltip/Tooltip.visualtest.ts  |  21 -
 .../Tooltip/TooltipPage.visualtest.tsx        |  16 -
 .../src/visualtest/IRunVisualTest.ts          |   8 -
 .../src/visualtest/PhantomCssInterface.ts     | 753 ------------------
 .../src/visualtest/RunVisualTest.ts           |  82 --
 .../office-ui-fabric-react/visualtest.html    |  66 --
 .../ButtonDefaultDisabled_default_4.png       | Bin 1095 -> 0 bytes
 .../baseline/breadcrumb_default_0.png         | Bin 2017 -> 0 bytes
 .../baseline/breadcrumb_mouseClick_3.png      | Bin 2864 -> 0 bytes
 .../baseline/breadcrumb_mouseDown_2.png       | Bin 2864 -> 0 bytes
 .../baseline/breadcrumb_mouseMove_1.png       | Bin 2889 -> 0 bytes
 .../buttonCommandDisabled_default_14.png      | Bin 1368 -> 0 bytes
 .../baseline/buttonCommand_default_10.png     | Bin 1345 -> 0 bytes
 .../baseline/buttonCommand_mouseClick_13.png  | Bin 1404 -> 0 bytes
 .../baseline/buttonCommand_mouseDown_11.png   | Bin 1404 -> 0 bytes
 .../baseline/buttonCommand_mouseMove_12.png   | Bin 1404 -> 0 bytes
 .../buttonCompoundDisabled_default_19.png     | Bin 2327 -> 0 bytes
 .../baseline/buttonCompound_default_15.png    | Bin 2420 -> 0 bytes
 .../baseline/buttonCompound_mouseClick_16.png | Bin 2420 -> 0 bytes
 .../baseline/buttonCompound_mouseDown_17.png  | Bin 2249 -> 0 bytes
 .../baseline/buttonCompound_mouseMove_18.png  | Bin 2249 -> 0 bytes
 .../buttonContextualMenu_default_24.png       | Bin 1936 -> 0 bytes
 .../baseline/buttonContextual_default_20.png  | Bin 799 -> 0 bytes
 .../buttonContextual_mouseClick_21.png        | Bin 834 -> 0 bytes
 .../buttonContextual_mouseDown_22.png         | Bin 807 -> 0 bytes
 .../buttonContextual_mouseMove_23.png         | Bin 807 -> 0 bytes
 .../baseline/buttonDefault_default_0.png      | Bin 1090 -> 0 bytes
 .../baseline/buttonDefault_mouseClick_1.png   | Bin 1090 -> 0 bytes
 .../baseline/buttonDefault_mouseDown_2.png    | Bin 1186 -> 0 bytes
 .../baseline/buttonDefault_mouseMove_3.png    | Bin 1186 -> 0 bytes
 .../buttonPrimaryDisabled_default_9.png       | Bin 1166 -> 0 bytes
 .../baseline/buttonPrimary_default_5.png      | Bin 1242 -> 0 bytes
 .../baseline/buttonPrimary_mouseClick_6.png   | Bin 1242 -> 0 bytes
 .../baseline/buttonPrimary_mouseDown_7.png    | Bin 1251 -> 0 bytes
 .../baseline/buttonPrimary_mouseMove_8.png    | Bin 1251 -> 0 bytes
 .../baseline/checkboxDisabled_default_4.png   | Bin 1275 -> 0 bytes
 .../baseline/checkbox_default_0.png           | Bin 869 -> 0 bytes
 .../baseline/checkbox_mouseClick_1.png        | Bin 808 -> 0 bytes
 .../baseline/checkbox_mouseDown_3.png         | Bin 872 -> 0 bytes
 .../baseline/checkbox_mouseMove_2.png         | Bin 872 -> 0 bytes
 .../choiceGroupDisabled_default_4.png         | Bin 3518 -> 0 bytes
 .../baseline/choiceGroupIcon_default_5.png    | Bin 3512 -> 0 bytes
 .../baseline/choiceGroupIcon_mouseClick_8.png | Bin 3512 -> 0 bytes
 .../baseline/choiceGroupIcon_mouseDown_7.png  | Bin 3512 -> 0 bytes
 .../baseline/choiceGroupIcon_mouseMove_6.png  | Bin 3512 -> 0 bytes
 .../baseline/choiceGroup_default_0.png        | Bin 3166 -> 0 bytes
 .../baseline/choiceGroup_mouseClick_3.png     | Bin 3518 -> 0 bytes
 .../baseline/choiceGroup_mouseDown_2.png      | Bin 3528 -> 0 bytes
 .../baseline/choiceGroup_mouseMove_1.png      | Bin 3528 -> 0 bytes
 .../baseline/commandBarItem_default_4.png     | Bin 2022 -> 0 bytes
 .../baseline/commandBar_default_0.png         | Bin 1567 -> 0 bytes
 .../baseline/commandBar_mouseClick_3.png      | Bin 1734 -> 0 bytes
 .../baseline/commandBar_mouseDown_2.png       | Bin 1675 -> 0 bytes
 .../baseline/commandBar_mouseMove_1.png       | Bin 1675 -> 0 bytes
 .../baseline/contextualMenu_default_0.png     | Bin 1493 -> 0 bytes
 .../baseline/contextualMenu_mouseClick_3.png  | Bin 1559 -> 0 bytes
 .../baseline/contextualMenu_mouseDown_1.png   | Bin 1559 -> 0 bytes
 .../baseline/contextualMenu_mouseMove_2.png   | Bin 1559 -> 0 bytes
 .../baseline/detailsList_default_0.png        | Bin 2677 -> 0 bytes
 .../baseline/detailsList_mouseClick_3.png     | Bin 3527 -> 0 bytes
 .../baseline/detailsList_mouseDown_1.png      | Bin 3417 -> 0 bytes
 .../baseline/detailsList_mouseMove_2.png      | Bin 3417 -> 0 bytes
 .../visualtests/baseline/dialog_default_0.png | Bin 4231 -> 0 bytes
 .../baseline/dialog_mouseClick_1.png          | Bin 4231 -> 0 bytes
 .../baseline/dialog_mouseDown_2.png           | Bin 4231 -> 0 bytes
 .../baseline/dialog_mouseMove_3.png           | Bin 4231 -> 0 bytes
 .../baseline/documentCard_default_0.png       | Bin 7466 -> 0 bytes
 .../baseline/documentCard_mouseMove_1.png     | Bin 7466 -> 0 bytes
 .../baseline/facepile_default_0.png           | Bin 5163 -> 0 bytes
 .../baseline/labelDisabled_default_1.png      | Bin 853 -> 0 bytes
 .../baseline/labelRequired_default_2.png      | Bin 903 -> 0 bytes
 .../visualtests/baseline/label_default_0.png  | Bin 648 -> 0 bytes
 .../visualtests/baseline/toggle_default_0.png | Bin 1725 -> 0 bytes
 .../baseline/toggle_mouseClick_1.png          | Bin 1876 -> 0 bytes
 .../baseline/toggle_mouseDown_3.png           | Bin 1870 -> 0 bytes
 .../baseline/toggle_mouseMove_2.png           | Bin 1870 -> 0 bytes
 .../baseline/tooltip_mouseClick_0.png         | Bin 630 -> 0 bytes
 .../baseline/tooltip_mouseDown_2.png          | Bin 630 -> 0 bytes
 .../baseline/tooltip_mouseMove_1.png          | Bin 630 -> 0 bytes
 113 files changed, 12 insertions(+), 2170 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/visual-test-cleanup_2017-09-26-16-46.json
 delete mode 100644 ghdocs/VISUALTESTS.md
 delete mode 100644 packages/experiments/src/components/CommandBar/CommandBar.visualtest.ts
 delete mode 100644 packages/experiments/src/components/CommandBar/CommandBarPage.visualtest.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/VisualTestRoot.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/VisualTestState.ts
 delete mode 100644 packages/office-ui-fabric-react/src/common/VisualTest.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.visualtest.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.visualtest.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/components/Button/Button.visualtest.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Button/ButtonPage.visualtest.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.visualtest.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.visualtest.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.visualtest.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.visualtest.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.visualtest.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.visualtest.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.visualtest.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.visualtest.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.visualtest.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.visualtest.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.visualtest.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.visualtest.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/components/Dialog/Dialog.visualtest.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Dialog/DialogPage.visualtest.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.visualtest.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.visualtest.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/components/Facepile/Facepile.visualtest.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.visualtest.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/components/Label/Label.visualtest.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Label/LabelPage.visualtest.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/components/Toggle/Toggle.visualtest.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Toggle/TogglePage.visualtest.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.visualtest.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.visualtest.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/visualtest/IRunVisualTest.ts
 delete mode 100644 packages/office-ui-fabric-react/src/visualtest/PhantomCssInterface.ts
 delete mode 100644 packages/office-ui-fabric-react/src/visualtest/RunVisualTest.ts
 delete mode 100644 packages/office-ui-fabric-react/visualtest.html
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/ButtonDefaultDisabled_default_4.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/breadcrumb_default_0.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/breadcrumb_mouseClick_3.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/breadcrumb_mouseDown_2.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/breadcrumb_mouseMove_1.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonCommandDisabled_default_14.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonCommand_default_10.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonCommand_mouseClick_13.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonCommand_mouseDown_11.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonCommand_mouseMove_12.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonCompoundDisabled_default_19.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonCompound_default_15.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonCompound_mouseClick_16.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonCompound_mouseDown_17.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonCompound_mouseMove_18.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonContextualMenu_default_24.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonContextual_default_20.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonContextual_mouseClick_21.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonContextual_mouseDown_22.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonContextual_mouseMove_23.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonDefault_default_0.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonDefault_mouseClick_1.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonDefault_mouseDown_2.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonDefault_mouseMove_3.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonPrimaryDisabled_default_9.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonPrimary_default_5.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonPrimary_mouseClick_6.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonPrimary_mouseDown_7.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/buttonPrimary_mouseMove_8.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/checkboxDisabled_default_4.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/checkbox_default_0.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/checkbox_mouseClick_1.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/checkbox_mouseDown_3.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/checkbox_mouseMove_2.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/choiceGroupDisabled_default_4.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/choiceGroupIcon_default_5.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/choiceGroupIcon_mouseClick_8.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/choiceGroupIcon_mouseDown_7.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/choiceGroupIcon_mouseMove_6.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/choiceGroup_default_0.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/choiceGroup_mouseClick_3.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/choiceGroup_mouseDown_2.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/choiceGroup_mouseMove_1.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/commandBarItem_default_4.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/commandBar_default_0.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/commandBar_mouseClick_3.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/commandBar_mouseDown_2.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/commandBar_mouseMove_1.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/contextualMenu_default_0.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/contextualMenu_mouseClick_3.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/contextualMenu_mouseDown_1.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/contextualMenu_mouseMove_2.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/detailsList_default_0.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/detailsList_mouseClick_3.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/detailsList_mouseDown_1.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/detailsList_mouseMove_2.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/dialog_default_0.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/dialog_mouseClick_1.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/dialog_mouseDown_2.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/dialog_mouseMove_3.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/documentCard_default_0.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/documentCard_mouseMove_1.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/facepile_default_0.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/labelDisabled_default_1.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/labelRequired_default_2.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/label_default_0.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/toggle_default_0.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/toggle_mouseClick_1.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/toggle_mouseDown_3.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/toggle_mouseMove_2.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/tooltip_mouseClick_0.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/tooltip_mouseDown_2.png
 delete mode 100644 packages/office-ui-fabric-react/visualtests/baseline/tooltip_mouseMove_1.png

diff --git a/common/changes/office-ui-fabric-react/visual-test-cleanup_2017-09-26-16-46.json b/common/changes/office-ui-fabric-react/visual-test-cleanup_2017-09-26-16-46.json
new file mode 100644
index 0000000000000..d05d9d605cb08
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/visual-test-cleanup_2017-09-26-16-46.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Removed old visual testing system to make way for new Screener based system",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/ghdocs/VISUALTESTS.md b/ghdocs/VISUALTESTS.md
deleted file mode 100644
index 5d3d398af3081..0000000000000
--- a/ghdocs/VISUALTESTS.md
+++ /dev/null
@@ -1,82 +0,0 @@
-# Testing
-
-## Basics
-
-Visual testing is still in the early stages and is subject to change.
-
-Our tests are visual tests are built with with [PhantomCSS](https://github.com/Huddle/PhantomCSS) which makes extensive use of [Casperjs](http://casperjs.org/).
-
-In order to have PhantomCSS run you must have python version 2.6 or higher installed.
-
-To run tests:
-
-1. Navigate to packages/office-ui-fabric-react in command prompt.
-2. gulp visualtest --production                          // To generate and comapre the baseline
-3. gulp visualtest --production --match <ComponentName>  // To generate baseline for one component
-4. gulp visualtest --debug                               // To debug components at localhost
-
-To create new tests:
-1. Add a file to the component you want to test named [ComponentName]Page.visualtest.tsx. This is where you will put all of the code for rendering the components you want to test. For example:
-
-CheckBoxPage.visualtest.tsx
-```typescript
-import { Checkbox } from './index';
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-/* tslint:enable:no-unused-variable */
-export default class CheckboxVPage extends React.Component<any, any> {
-  public render() {
-    return <div style={ { backgroundColor: 'white' } } >
-      <Checkbox className='Checkbox' label='Check Box'
-        defaultChecked={ true } />
-      <Checkbox className='CheckboxDisabled' label='Check Box Disabled'
-        defaultChecked={ true }
-        disabled={ true } />
-    </div>;
-  }
-}
-```
-2. Create a file to run the test, named [ComponentName].visualtest.ts . In this file you will need to import Casper and a IPhantomCss. Additionally you will need to declare 2 vars, phantomcss and casper (see below). Then you can use them to perform various functions. The proper start url to give casper is baseUrl + [ComponentName] (For example ` baseUrl + 'checkbox' `). The Most important one is phantomcss.screenshot which actually performs the screenshot tests.
-
-For Example:
-Checkbox.visualtest.ts
-```typescript
-import { Casper } from '../../visualtest/PhantomCssInterface';
-import { baseUrl } from '../../common/VisualTest';
-import { defaultScreenshot, mouseMoveScreenshot, mouseDownScreenshot, mouseClickScreenshot } from '../../visualtest/RunVisualTest';
-import { IRunVisualTest } from '../../visualtest/IRunVisualTest';
-
-declare var casper: Casper;
-
-let componentIds: IRunVisualTest[] = [];  // Array of components
-
-componentIds.push({
-  selector: '.' + 'ms-Checkbox-input',// Selector for event
-  fileName: 'checkbox',// baseline file name
-  imageSelector: '.' + 'Checkbox',// Image selector
-  commands: [defaultScreenshot, mouseClickScreenshot, mouseMoveScreenshot, mouseDownScreenshot] // Events for screen shots refer RunVisualTest.ts
-});
-
-componentIds.push({
-  selector: '.' + 'CheckboxDisabled',
-  fileName: 'checkboxDisabled',
-  commands: [defaultScreenshot]
-});
-
-casper.
-  start(baseUrl + 'checkbox').
-  then(() => {
-    testRunner();
-  });
-
-casper.run(() => { casper.test.done(); });
-```
-3. Add you're test component to VisualTestState.ts You'll just need to add the componentPath.
-```typescript
-'./Checkbox/CheckboxPage.visualtest',
-```
-## Viewing Tests
-To see your test results navigate to the visualtests folder in packages/office-ui-fabric-react. In the base folder you can see current screenshots. In the Results you can see the results of the tests that were run, including failures and the diff screenshot (screenshot being compared to base).
-
-## Updating base screenshot
-To update a base screenshot navigate to visualtest, delete the screenshot you wish to recreate and run gulp visualtest --production again. This will automatically create a new screenshot to be used as base, then check this screenshot into github.
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.visualtest.ts b/packages/experiments/src/components/CommandBar/CommandBar.visualtest.ts
deleted file mode 100644
index 7b02816708ddf..0000000000000
--- a/packages/experiments/src/components/CommandBar/CommandBar.visualtest.ts
+++ /dev/null
@@ -1,37 +0,0 @@
-import { Casper } from 'office-ui-fabric-react/lib/visualtest/PhantomCssInterface';
-import { baseUrl } from 'office-ui-fabric-react/lib/common/VisualTest';
-import {
-  defaultScreenshot, mouseMoveScreenshot, mouseDownScreenshot,
-  mouseClickScreenshot, mouseSingleClickScreenshot, testRunner
-} from 'office-ui-fabric-react/lib/visualtest/RunVisualTest';
-import { IRunVisualTest } from 'office-ui-fabric-react/lib/visualtest/IRunVisualTest';
-declare var casper: Casper;
-let componentIds: IRunVisualTest[] = [];
-
-componentIds.push({
-  selector: '.' + 'ms-CommandBarItem-link',
-  imageSelector: '.' + 'CommandBar',
-  fileName: 'commandBar',
-  commands: [defaultScreenshot, mouseMoveScreenshot, mouseDownScreenshot, mouseClickScreenshot]
-});
-
-componentIds.push({
-  selector: '.' + 'ms-CommandBarItem-link',
-  imageSelector: '.' + 'CommandBar',
-  fileName: 'commandBarItem',
-  commands: [mouseSingleClickScreenshot],
-  childParams: {
-    selector: '.' + 'ms-ContextualMenu-list',
-    imageSelector: '.' + 'ms-ContextualMenu-Callout',
-    fileName: 'commandBarItem',
-    commands: [defaultScreenshot],
-  }
-});
-
-casper.
-  start(baseUrl + 'commandBar').
-  then(() => {
-    testRunner(componentIds);
-  });
-
-casper.run(() => { casper.test.done(); });
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/CommandBarPage.visualtest.tsx b/packages/experiments/src/components/CommandBar/CommandBarPage.visualtest.tsx
deleted file mode 100644
index 58a363630b79b..0000000000000
--- a/packages/experiments/src/components/CommandBar/CommandBarPage.visualtest.tsx
+++ /dev/null
@@ -1,42 +0,0 @@
-/* tslint:disable:jsx-ban-props */
-import { CommandBar } from './index';
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-/* tslint:enable:no-unused-variable */
-
-export default class CommandBarVPage extends React.Component<{}, {}> {
-  public render(): JSX.Element {
-    return (
-      <div style={ { width: '600px' } }>
-        <CommandBar
-          className='CommandBar'
-          items={
-            [
-              {
-                key: 'new',
-                name: 'New',
-                icon: 'Add',
-                onClick: () => { return; },
-                items: [
-                  {
-                    key: 'emailMessage',
-                    name: 'Email message',
-                    icon: 'Mail'
-                  },
-                  {
-                    key: 'calendarEvent',
-                    name: 'Calendar event',
-                    icon: 'Calendar'
-                  }
-                ]
-              },
-              {
-                key: 'upload',
-                name: 'Upload',
-                icon: 'Upload'
-              }] }
-        />
-      </div>
-    );
-  }
-}
diff --git a/packages/office-ui-fabric-react/.npmignore b/packages/office-ui-fabric-react/.npmignore
index 6c28b2fcf1c04..4c286d0b2bc06 100644
--- a/packages/office-ui-fabric-react/.npmignore
+++ b/packages/office-ui-fabric-react/.npmignore
@@ -26,5 +26,4 @@ tsd.json
 tslint.json
 typings
 webpack.config.js
-fabric-test*
-visualtests
\ No newline at end of file
+fabric-test*
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/VisualTestRoot.tsx b/packages/office-ui-fabric-react/src/VisualTestRoot.tsx
deleted file mode 100644
index b99afeb8f30f9..0000000000000
--- a/packages/office-ui-fabric-react/src/VisualTestRoot.tsx
+++ /dev/null
@@ -1,95 +0,0 @@
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-/* tslint:enable:no-unused-variable */
-import * as ReactDOM from 'react-dom';
-import { VisualTestState } from './VisualTestState';
-import { Route, Router } from './utilities/router/index';
-import { setBaseUrl } from './Utilities';
-
-setBaseUrl('./dist/');
-
-let rootElement: HTMLElement;
-let scrollDistance: number;
-let requireContext = require.context('./components', true, /Page.visualtest$/);
-
-// This is mostly taken from the react-website project.
-
-function _routerDidMount() {
-  if (_hasAnchorLink(window.location.hash)) {
-    let hash = _extractAnchorLink(window.location.hash);
-    let el = document.getElementById(hash);
-    let elRect = el!.getBoundingClientRect();
-    let bodySTop = document.body.scrollTop;
-    let currentScrollPosition;
-    currentScrollPosition = bodySTop + elRect.top;
-    document.body.scrollTop = currentScrollPosition - scrollDistance;
-  }
-}
-
-function _hasAnchorLink(path: string) {
-  return (path.match(/#/g) || []).length > 1;
-}
-
-function _extractAnchorLink(path: string) {
-  let split = path.split('#');
-  let cleanedSplit = split.filter((value) => {
-    if (value === '') {
-      return false;
-    } else {
-      return true;
-    }
-  });
-  return cleanedSplit[cleanedSplit.length - 1];
-}
-
-function _onLoad() {
-
-  // Load the app into this element.
-  rootElement = rootElement || document.getElementById('content');
-
-  ReactDOM.render(
-    <div style={ { display: 'inline-block' } }>
-      <Router onNewRouteLoaded={ _routerDidMount }>
-        { _getAppRoutes() }
-      </Router>
-    </div>,
-    rootElement);
-}
-
-function _getAppRoutes(): JSX.Element[] {
-  let routes: JSX.Element[] = [];
-
-  // Create a route for each top level page, and all of its sub pages
-  VisualTestState.componentPath.forEach((path, pathIndex) => {
-    let componentNameIndex = path.lastIndexOf('/');
-    let name = path.substr(componentNameIndex + 1);
-    let url = name.substr(0, name.lastIndexOf('Page.visualtest'));
-    routes.push(
-      <Route
-        key={ pathIndex }
-        path={ '#/' + url }
-        getComponent={ getPath(path) }
-      />);
-  });
-  return routes;
-}
-
-function getPath(path: string) {
-  return ((cb: any) => require.ensure([], () => cb((requireContext(path) as any).default)));
-}
-
-function _onUnload() {
-  if (rootElement) {
-    ReactDOM.unmountComponentAtNode(rootElement);
-  }
-}
-
-let isReady = document.readyState === 'interactive' || document.readyState === 'complete';
-
-if (isReady) {
-  _onLoad();
-} else {
-  window.onload = _onLoad;
-}
-
-window.onunload = _onUnload;
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/VisualTestState.ts b/packages/office-ui-fabric-react/src/VisualTestState.ts
deleted file mode 100644
index e434f34dfe53a..0000000000000
--- a/packages/office-ui-fabric-react/src/VisualTestState.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-export interface IVisualTestState {
-  componentPath: [string];
-}
-
-export const VisualTestState: IVisualTestState = {
-  componentPath: [
-    './Breadcrumb/BreadcrumbPage.visualtest',
-    './Button/ButtonPage.visualtest',
-    './Checkbox/CheckboxPage.visualtest',
-    './ChoiceGroup/ChoiceGroupPage.visualtest',
-    './ComboBox/ComboBoxPage.visualtest',
-    './CommandBar/CommandBarPage.visualtest',
-    './ContextualMenu/ContextualMenuPage.visualtest',
-    './DetailsList/DetailsListPage.visualtest',
-    './Label/LabelPage.visualtest',
-    './DocumentCard/DocumentCardPage.visualtest',
-    './Dialog/DialogPage.visualtest',
-    './Facepile/FacepilePage.visualtest',
-    './Toggle/TogglePage.visualtest',
-    './Tooltip/TooltipPage.visualtest'
-  ]
-};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/common/VisualTest.ts b/packages/office-ui-fabric-react/src/common/VisualTest.ts
deleted file mode 100644
index 5473d51635c4e..0000000000000
--- a/packages/office-ui-fabric-react/src/common/VisualTest.ts
+++ /dev/null
@@ -1 +0,0 @@
-export const baseUrl = 'http://localhost:43210/visualtest.html?#/';
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.visualtest.ts b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.visualtest.ts
deleted file mode 100644
index 741cc29625ecf..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.visualtest.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-import { Casper } from '../../visualtest/PhantomCssInterface';
-import { baseUrl } from '../../common/VisualTest';
-import { defaultScreenshot, mouseMoveScreenshot, mouseDownScreenshot, mouseClickScreenshot, testRunner } from '../../visualtest/RunVisualTest';
-import { IRunVisualTest } from '../../visualtest/IRunVisualTest';
-
-declare var casper: Casper;
-let componentIds: IRunVisualTest[] = [];
-
-componentIds.push({
-  selector: '.' + 'Breadcrumb',
-  fileName: 'breadcrumb',
-  imageSelector: '.' + 'Breadcrumb',
-
-  commands: [defaultScreenshot]
-});
-componentIds.push({
-  selector: '.' + 'ms-Breadcrumb-listItem',
-  fileName: 'breadcrumb',
-  imageSelector: '.' + 'Breadcrumb',
-  commands: [mouseMoveScreenshot, mouseDownScreenshot, mouseClickScreenshot]
-});
-
-casper.
-  start(baseUrl + 'breadcrumb').
-  then(() => {
-    testRunner(componentIds);
-  });
-
-casper.run(() => { casper.test.done(); });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.visualtest.tsx
deleted file mode 100644
index 5993af2b0afe7..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.visualtest.tsx
+++ /dev/null
@@ -1,26 +0,0 @@
-import { Breadcrumb } from './index';
-
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-/* tslint:enable:no-unused-variable */
-export default class BreadcrumbVPage extends React.Component<any, any> {
-  public render() {
-    return (
-      <div style={ { width: '600px' } }>
-        <Breadcrumb
-          className='Breadcrumb'
-
-          items={ [
-            { text: 'Files', 'key': 'Files' },
-            { text: 'This is folder 1', 'key': 'f1', onClick: () => { return; } },
-            { text: 'This is folder 2', 'key': 'f2', onClick: () => { return; } },
-            { text: 'This is folder 3', 'key': 'f3', onClick: () => { return; } },
-            { text: 'This is folder 4', 'key': 'f4', onClick: () => { return; } },
-            { text: 'This is folder 5', 'key': 'f5', onClick: () => { return; } },
-          ] }
-          maxDisplayedItems={ 3 }
-        />
-      </div>
-    );
-  }
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.visualtest.ts b/packages/office-ui-fabric-react/src/components/Button/Button.visualtest.ts
deleted file mode 100644
index dc268c7b803ff..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Button/Button.visualtest.ts
+++ /dev/null
@@ -1,103 +0,0 @@
-import { Casper } from '../../visualtest/PhantomCssInterface';
-import { baseUrl } from '../../common/VisualTest';
-import {
-  defaultScreenshot, mouseMoveScreenshot, mouseDownScreenshot,
-  mouseClickScreenshot, testRunner, mouseSingleClickScreenshot
-} from '../../visualtest/RunVisualTest';
-import { IRunVisualTest } from '../../visualtest/IRunVisualTest';
-declare var casper: Casper;
-let componentIds: IRunVisualTest[] = [];
-
-componentIds.push({
-  selector: '#' + 'DefaultButton',
-  fileName: 'buttonDefault',
-  commands: [defaultScreenshot, mouseClickScreenshot, mouseDownScreenshot, mouseMoveScreenshot]
-});
-componentIds.push({
-  selector: '#' + 'DefaultButtonDisabled',
-  fileName: 'buttonDefaultDisabled',
-  commands: [defaultScreenshot]
-});
-componentIds.push({
-  selector: '#' + 'DefaultButtonChecked',
-  fileName: 'buttonDefaultChecked',
-  commands: [defaultScreenshot]
-});
-
-componentIds.push({
-  selector: '#' + 'PrimaryButton',
-  fileName: 'buttonPrimary',
-  commands: [defaultScreenshot, mouseClickScreenshot, mouseDownScreenshot, mouseMoveScreenshot]
-
-});
-componentIds.push({
-  selector: '#' + 'PrimaryButtonDisabled',
-  fileName: 'buttonPrimaryDisabled',
-  commands: [defaultScreenshot]
-});
-componentIds.push({
-  selector: '#' + 'PrimaryButtonChecked',
-  fileName: 'buttonPrimaryChecked',
-  commands: [defaultScreenshot]
-});
-
-componentIds.push({
-  selector: '#' + 'CommandButton',
-  fileName: 'buttonCommand',
-  commands: [defaultScreenshot, mouseDownScreenshot, mouseMoveScreenshot, mouseClickScreenshot]
-});
-componentIds.push({
-  selector: '#' + 'CommandButtonDisabled',
-  fileName: 'buttonCommandDisabled',
-  commands: [defaultScreenshot]
-});
-componentIds.push({
-  selector: '#' + 'CommandButtonChecked',
-  fileName: 'buttonCommandChecked',
-  commands: [defaultScreenshot]
-});
-
-componentIds.push({
-  selector: '#' + 'CompoundButton',
-  fileName: 'buttonCompound',
-  commands: [defaultScreenshot, mouseClickScreenshot, mouseDownScreenshot, mouseMoveScreenshot]
-});
-componentIds.push({
-  selector: '#' + 'CompoundButtonDisabled',
-  fileName: 'buttonCompoundDisabled',
-  commands: [defaultScreenshot]
-});
-componentIds.push({
-  selector: '#' + 'CompoundButtonChecked',
-  fileName: 'buttonCompoundChecked',
-  commands: [defaultScreenshot]
-});
-
-componentIds.push({
-  selector: '#' + 'ContextualButton',
-  fileName: 'buttonContextual',
-  commands: [defaultScreenshot, mouseClickScreenshot, mouseDownScreenshot, mouseMoveScreenshot]
-});
-componentIds.push({
-  selector: '#' + 'ContextualButton',
-  fileName: 'buttonContextual',
-  commands: [mouseSingleClickScreenshot],
-  childParams: {
-    selector: '.' + 'ms-ContextualMenu-list',
-    fileName: 'buttonContextualMenu',
-    commands: [defaultScreenshot]
-  }
-});
-componentIds.push({
-  selector: '#' + 'ContextualButtonChecked',
-  fileName: 'buttonContextualChecked',
-  commands: [defaultScreenshot, mouseClickScreenshot, mouseDownScreenshot, mouseMoveScreenshot]
-});
-
-casper.
-  start(baseUrl + 'button').
-  then(() => {
-    testRunner(componentIds);
-  });
-
-casper.run(() => { casper.test.done(); });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.visualtest.tsx
deleted file mode 100644
index 50265c5751279..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.visualtest.tsx
+++ /dev/null
@@ -1,136 +0,0 @@
-import { DefaultButton, IconButton, CommandButton, CompoundButton, PrimaryButton } from './index';
-import { IconName } from '../../Icon';
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-/* tslint:enable:no-unused-variable */
-export default class ButtonVPage extends React.Component<any, any> {
-  public render() {
-    let iconName: IconName = 'Snow';
-    return (
-      <div>
-        <div>
-          <label> Default Button:   </label>
-          <DefaultButton id='DefaultButton' icon='Add' text='Default Button' />
-        </div>
-        <div>
-          <label> Default Button Disabled:   </label>&nbsp;
-        <DefaultButton id='DefaultButtonDisabled' disabled={true} icon='Add' text='Default Button' />
-        </div>&nbsp;
-      <div>
-          <label> Default Button Checked:   </label>
-          <DefaultButton id='DefaultButtonChecked' icon='Add' checked={true} text='Default Button' />
-        </div>&nbsp;
-      <div style={{ backgroundColor: 'white' }}>
-          <IconButton id={'IconButton'} iconProps={{ iconName }} />
-        </div>&nbsp;
-      <div style={{ backgroundColor: 'white' }}>
-          <IconButton id={'IconButtonChecked'} checked={true} iconProps={{ iconName }} />
-        </div>&nbsp;
-      <div style={{ backgroundColor: 'white' }}>
-          <CommandButton
-            id='CommandButton'
-            icon='AddFriend'
-            text='Command Button'
-          />
-        </div>&nbsp;
-      <div style={{ backgroundColor: 'white' }}>
-          <CommandButton
-            id='CommandButtonDisabled'
-            icon='AddFriend'
-            disabled={true}
-            text='Command Button'
-          />
-        </div >&nbsp;
-      <div style={{ backgroundColor: 'white' }}>
-          <CommandButton
-            id='CommandButtonChecked'
-            checked={true}
-            icon='AddFriend'
-            text='Command Button'
-          />
-        </div>&nbsp;
-      <div>
-          <CompoundButton
-            id='CompoundButton'
-            description='You can create a new account here.'
-            text='Compound Button'
-          />
-        </div>&nbsp;
-      <div>
-          <CompoundButton
-            id='CompoundButtonDisabled'
-            disabled={true}
-            description='You can create a new account here.'
-            text='Compound Button'
-          />
-        </div>&nbsp;
-      <div>
-          <CompoundButton
-            id='CompoundButtonChecked'
-            checked={true}
-            description='You can create a new account here.'
-            text='Compound Button'
-          />
-        </div>&nbsp;
-      <div>
-          <PrimaryButton id='PrimaryButton' icon='Add' text='Primary Button' />
-        </div >&nbsp;
-      <div>
-          <PrimaryButton id='PrimaryButtonDisabled' disabled={true} icon='Add' text='Primary Button' />
-        </div >&nbsp;
-      <div>
-          <PrimaryButton id='PrimaryButtonToggled' checked={true} icon='Add' text='Primary Button' />
-        </div >&nbsp;
-
-      <div>
-          <DefaultButton
-            id='ContextualButton'
-            disabled={false}
-            icon='Add'
-            text='New'
-            menuProps={{
-              className: 'ContextualButtonMenu',
-              id: 'ContextualButtonMenu',
-              items: [
-                {
-                  key: 'emailMessage',
-                  name: 'Email message',
-                  icon: 'Mail'
-                },
-                {
-                  key: 'calendarEvent',
-                  name: 'Calendar event',
-                  icon: 'Calendar'
-                }
-              ]
-            }
-            }
-          />
-          <DefaultButton
-            id='ContextualButtonToggled'
-            checked={true}
-            icon='Add'
-            text='New'
-            menuProps={{
-              className: 'ContextualButtonMenu',
-              id: 'ContextualButtonMenu',
-              items: [
-                {
-                  key: 'emailMessage',
-                  name: 'Email message',
-                  icon: 'Mail'
-                },
-                {
-                  key: 'calendarEvent',
-                  name: 'Calendar event',
-                  icon: 'Calendar'
-                }
-              ]
-            }
-            }
-          />
-        </div >
-      </div>
-    );
-  }
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.visualtest.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.visualtest.ts
deleted file mode 100644
index 72e84f8b6c43b..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.visualtest.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-import { Casper } from '../../visualtest/PhantomCssInterface';
-import { baseUrl } from '../../common/VisualTest';
-import { defaultScreenshot, mouseMoveScreenshot, mouseDownScreenshot, mouseClickScreenshot, testRunner } from '../../visualtest/RunVisualTest';
-import { IRunVisualTest } from '../../visualtest/IRunVisualTest';
-
-declare var casper: Casper;
-
-let componentIds: IRunVisualTest[] = [];
-
-componentIds.push({
-  selector: '.' + 'ms-Checkbox-input',
-  fileName: 'checkbox',
-  imageSelector: '.' + 'Checkbox',
-  commands: [defaultScreenshot, mouseClickScreenshot, mouseMoveScreenshot, mouseDownScreenshot]
-});
-
-componentIds.push({
-  selector: '.' + 'CheckboxDisabled',
-  fileName: 'checkboxDisabled',
-  commands: [defaultScreenshot]
-});
-
-casper.
-  start(baseUrl + 'checkbox').
-  then(() => {
-    testRunner(componentIds);
-  });
-
-casper.run(() => { casper.test.done(); });
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.visualtest.tsx
deleted file mode 100644
index b582a5a3ba971..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.visualtest.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { Checkbox } from './index';
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-/* tslint:enable:no-unused-variable */
-export default class CheckboxVPage extends React.Component<any, any> {
-  public render() {
-    return (
-      <div style={ { backgroundColor: 'white' } } >
-        <Checkbox
-          className='Checkbox'
-          label='Check Box'
-          defaultChecked={ true }
-        />
-        <Checkbox
-          className='CheckboxDisabled'
-          label='Check Box Disabled'
-          defaultChecked={ true }
-          disabled={ true }
-        />
-      </div>
-    );
-  }
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.visualtest.ts b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.visualtest.ts
deleted file mode 100644
index 68ded3efff741..0000000000000
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.visualtest.ts
+++ /dev/null
@@ -1,37 +0,0 @@
-import { Casper } from '../../visualtest/PhantomCssInterface';
-import { baseUrl } from '../../common/VisualTest';
-import { defaultScreenshot, mouseMoveScreenshot, mouseDownScreenshot, mouseClickScreenshot, testRunner } from '../../visualtest/RunVisualTest';
-import { IRunVisualTest } from '../../visualtest/IRunVisualTest';
-
-declare var casper: Casper;
-
-let componentIds: IRunVisualTest[] = [];
-
-componentIds.push({
-  selector: '.' + 'ms-ChoiceField-field',
-  fileName: 'choiceGroup',
-  imageSelector: '.' + 'ChoiceGroup',
-  commands: [defaultScreenshot, mouseMoveScreenshot, mouseDownScreenshot, mouseClickScreenshot]
-});
-
-componentIds.push({
-  selector: '.' + 'ms-ChoiceField-field',
-  fileName: 'choiceGroupDisabled',
-  imageSelector: '.' + 'ChoiceGroup',
-  commands: [defaultScreenshot]
-});
-
-componentIds.push({
-  selector: '.' + 'ms-ChoiceField',
-  fileName: 'choiceGroupIcon',
-  imageSelector: '.' + 'ChoiceGroupIcon',
-  commands: [defaultScreenshot, mouseMoveScreenshot, mouseDownScreenshot, mouseClickScreenshot]
-});
-
-casper.
-  start(baseUrl + 'choiceGroup').
-  then(() => {
-    testRunner(componentIds);
-  });
-
-casper.run(() => { casper.test.done(); });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.visualtest.tsx
deleted file mode 100644
index e0c803ad240f5..0000000000000
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.visualtest.tsx
+++ /dev/null
@@ -1,66 +0,0 @@
-import { ChoiceGroup } from './index';
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-/* tslint:enable:no-unused-variable */
-export default class ChoiceGroupVPage extends React.Component<any, any> {
-  public render() {
-    return (
-      <div>
-        <div style={ { backgroundColor: 'white' } }>
-          <ChoiceGroup
-            label='Choice Group'
-            className='ChoiceGroup'
-            defaultSelectedKey='pie'
-            options={
-              [{
-                key: 'bar',
-                text: 'Bar chart'
-
-              }, {
-                key: 'pie',
-                text: 'Pie chart'
-              }]
-            }
-          />
-        </div>&nbsp;
-      <div style={ { backgroundColor: 'white' } }>
-          <ChoiceGroup
-            label='Choice Group Icon'
-            className='ChoiceGroupIcon'
-            defaultSelectedKey='week'
-            options={
-              [{
-                key: 'day',
-                iconProps: { iconName: 'CalendarDay' },
-                text: 'Day'
-
-              }, {
-                key: 'week',
-                iconProps: { iconName: 'CalendarWeek' },
-                text: 'Week'
-              }]
-            }
-          />
-        </div>&nbsp;
-      <div style={ { backgroundColor: 'white' } }>
-          <ChoiceGroup
-            label='Choice Group Disabled'
-            className='ChoiceGroupDisabled'
-            defaultSelectedKey='pie'
-            disabled={ true }
-            options={
-              [{
-                key: 'bar',
-                text: 'Bar chart'
-
-              }, {
-                key: 'pie',
-                text: 'Pie chart'
-              }]
-            }
-          />
-        </div>&nbsp;
-    </div>
-    );
-  }
-}
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.visualtest.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.visualtest.ts
deleted file mode 100644
index 300231665fe21..0000000000000
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.visualtest.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-import { Casper } from '../../visualtest/PhantomCssInterface';
-import { baseUrl } from '../../common/VisualTest';
-import { defaultScreenshot, testRunner, mouseClickScreenshot, mouseMoveScreenshot } from '../../visualtest/RunVisualTest';
-import { IRunVisualTest } from '../../visualtest/IRunVisualTest';
-declare var casper: Casper;
-let componentIds: IRunVisualTest[] = [];
-
-componentIds.push(
-  {
-    selector: '.' + 'ms-ComboBox-Input',
-    fileName: 'comboBox_input',
-    imageSelector: '.' + 'ms-ComboBox-Container',
-    commands: [defaultScreenshot, mouseClickScreenshot, mouseMoveScreenshot]
-  },
-  {
-    selector: '.' + 'ms-ComboBox-Button',
-    fileName: 'comboBox_button',
-    imageSelector: '.' + 'ms-comboBox-Container',
-    commands: [defaultScreenshot, mouseClickScreenshot, mouseMoveScreenshot]
-  },
-);
-
-casper.
-  start(baseUrl + 'comboBox').
-  then(() => {
-    testRunner(componentIds);
-  });
-
-casper.run(() => { casper.test.done(); });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.visualtest.tsx
deleted file mode 100644
index 8ca9420d8cf24..0000000000000
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.visualtest.tsx
+++ /dev/null
@@ -1,31 +0,0 @@
-import { ComboBox } from './index';
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-/* tslint:enable:no-unused-variable */
-export default class ComboBoxVPage extends React.Component<any, any> {
-  public render() {
-    return (
-      <div >
-        <ComboBox
-          defaultSelectedKey='C'
-          label='Basic uncontrolled example (allowFreeform: T, AutoComplete: T):'
-          id='Basicdrop1'
-          ariaLabel='Basic ComboBox example'
-          allowFreeform={ true }
-          autoComplete='on'
-          options={
-            [
-              { key: 'A', text: 'Option a' },
-              { key: 'B', text: 'Option b' },
-              { key: 'C', text: 'Option c' },
-              { key: 'D', text: 'Option d' },
-              { key: 'E', text: 'Option e' },
-              { key: 'F', text: 'Option f' },
-              { key: 'G', text: 'Option g' },
-            ]
-          }
-        />
-      </div>
-    );
-  }
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.visualtest.ts b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.visualtest.ts
deleted file mode 100644
index 617816b20dc0e..0000000000000
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.visualtest.ts
+++ /dev/null
@@ -1,37 +0,0 @@
-import { Casper } from '../../visualtest/PhantomCssInterface';
-import { baseUrl } from '../../common/VisualTest';
-import {
-  defaultScreenshot, mouseMoveScreenshot, mouseDownScreenshot,
-  mouseClickScreenshot, mouseSingleClickScreenshot, testRunner
-} from '../../visualtest/RunVisualTest';
-import { IRunVisualTest } from '../../visualtest/IRunVisualTest';
-declare var casper: Casper;
-let componentIds: IRunVisualTest[] = [];
-
-componentIds.push({
-  selector: '.' + 'ms-CommandBarItem-link',
-  imageSelector: '.' + 'CommandBar',
-  fileName: 'commandBar',
-  commands: [defaultScreenshot, mouseMoveScreenshot, mouseDownScreenshot, mouseClickScreenshot]
-});
-
-componentIds.push({
-  selector: '.' + 'ms-CommandBarItem-link',
-  imageSelector: '.' + 'CommandBar',
-  fileName: 'commandBarItem',
-  commands: [mouseSingleClickScreenshot],
-  childParams: {
-    selector: '.' + 'ms-ContextualMenu-list',
-    imageSelector: '.' + 'ms-ContextualMenu-Callout',
-    fileName: 'commandBarItem',
-    commands: [defaultScreenshot],
-  }
-});
-
-casper.
-  start(baseUrl + 'commandBar').
-  then(() => {
-    testRunner(componentIds);
-  });
-
-casper.run(() => { casper.test.done(); });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.visualtest.tsx
deleted file mode 100644
index 53a5381d4dc70..0000000000000
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.visualtest.tsx
+++ /dev/null
@@ -1,40 +0,0 @@
-import { CommandBar } from './index';
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-/* tslint:enable:no-unused-variable */
-export default class CommandBarVPage extends React.Component<any, any> {
-  public render() {
-    return (
-      <div style={ { width: '600px' } }>
-        <CommandBar
-          className='CommandBar'
-          items={
-            [
-              {
-                key: 'new',
-                name: 'New',
-                icon: 'Add',
-                onClick: () => { return; },
-                items: [
-                  {
-                    key: 'emailMessage',
-                    name: 'Email message',
-                    icon: 'Mail'
-                  },
-                  {
-                    key: 'calendarEvent',
-                    name: 'Calendar event',
-                    icon: 'Calendar'
-                  }
-                ]
-              },
-              {
-                key: 'upload',
-                name: 'Upload',
-                icon: 'Upload'
-              }] }
-        />
-      </div>
-    );
-  }
-}
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.visualtest.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.visualtest.ts
deleted file mode 100644
index 4aea5d7f0e6c4..0000000000000
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.visualtest.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import { Casper} from '../../visualtest/PhantomCssInterface';
-import { baseUrl } from '../../common/VisualTest';
-import {
-  defaultScreenshot, mouseMoveScreenshot, mouseDownScreenshot,
-  mouseClickScreenshot, testRunner
-} from '../../visualtest/RunVisualTest';
-import { IRunVisualTest } from '../../visualtest/IRunVisualTest';
-
-declare var casper: Casper;
-
-let componentIds: IRunVisualTest[] = [];
-
-componentIds.push({
-  selector: '.' + 'ms-ContextualMenu-itemText',
-  imageSelector: '#' + 'ContextualMenu',
-  fileName: 'contextualMenu',
-  commands: [defaultScreenshot, mouseDownScreenshot, mouseMoveScreenshot, mouseClickScreenshot]
-
-});
-
-casper.
-  start(baseUrl + 'contextualMenu').
-  then(() => {
-    testRunner(componentIds);
-  });
-
-casper.run(() => { casper.test.done(); });
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.visualtest.tsx
deleted file mode 100644
index 11e1141920812..0000000000000
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.visualtest.tsx
+++ /dev/null
@@ -1,32 +0,0 @@
-import { ContextualMenu } from './index';
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-/* tslint:enable:no-unused-variable */
-export default class ContextualMenuVPage extends React.Component<any, any> {
-  public render() {
-    return (
-      <div>
-        <div>
-          <ContextualMenu
-            id='ContextualMenu'
-            shouldFocusOnMount={ false }
-            items={
-              [{
-                key: 'new',
-                name: 'New',
-                icon: 'Add',
-                onClick: () => alert('New')
-              },
-              {
-                key: 'upload',
-                name: 'Upload',
-                icon: 'Upload',
-                onClick: () => alert('upload')
-              }]
-            }
-          />
-        </div>
-      </div>
-    );
-  }
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.visualtest.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.visualtest.ts
deleted file mode 100644
index ec9d53c381989..0000000000000
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.visualtest.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import { Casper} from '../../visualtest/PhantomCssInterface';
-import { baseUrl } from '../../common/VisualTest';
-import {
-  defaultScreenshot, mouseMoveScreenshot, mouseDownScreenshot,
-  mouseClickScreenshot, testRunner
-} from '../../visualtest/RunVisualTest';
-import { IRunVisualTest } from '../../visualtest/IRunVisualTest';
-
-declare var casper: Casper;
-
-let componentIds: IRunVisualTest[] = [];
-
-componentIds.push({
-  selector: '.' + 'ms-DetailsRow',
-  imageSelector: '.' + 'DetailsList',
-  fileName: 'detailsList',
-  commands: [defaultScreenshot, mouseDownScreenshot, mouseMoveScreenshot, mouseClickScreenshot]
-
-});
-
-casper.
-  start(baseUrl + 'detailsList').
-  then(() => {
-    testRunner(componentIds);
-  });
-
-casper.run(() => { casper.test.done(); });
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.visualtest.tsx
deleted file mode 100644
index ee9e828c11b63..0000000000000
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.visualtest.tsx
+++ /dev/null
@@ -1,26 +0,0 @@
-import { DetailsList } from './index';
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-/* tslint:enable:no-unused-variable */
-export default class DetailsListVPage extends React.Component<any, any> {
-
-  public render() {
-    return (
-      <div style={ { width: '600px' } }>
-        <DetailsList
-          className='DetailsList'
-          items={ [{
-            key: 'score',
-            name: 'Score',
-            fieldName: 'score'
-          },
-          {
-            key: 'name',
-            name: 'Name',
-            fieldName: 'Name'
-          }] }
-        />
-      </div>
-    );
-  }
-}
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.visualtest.ts b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.visualtest.ts
deleted file mode 100644
index 06212f70ff959..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.visualtest.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { Casper} from '../../visualtest/PhantomCssInterface';
-import { baseUrl } from '../../common/VisualTest';
-import { defaultScreenshot, mouseMoveScreenshot, mouseDownScreenshot, mouseClickScreenshot, testRunner } from '../../visualtest/RunVisualTest';
-import { IRunVisualTest } from '../../visualtest/IRunVisualTest';
-declare var casper: Casper;
-
-let componentIds: IRunVisualTest[] = [];
-
-componentIds.push({
-  selector: '.' + 'ms-Dialog-main',
-  fileName: 'dialog',
-  commands: [defaultScreenshot, mouseClickScreenshot, mouseDownScreenshot, mouseMoveScreenshot]
-});
-
-casper.
-  start(baseUrl + 'dialog').
-  then(() => {
-    testRunner(componentIds);
-  });
-
-casper.run(() => { casper.test.done(); });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.visualtest.tsx
deleted file mode 100644
index 8171c240ea6ce..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.visualtest.tsx
+++ /dev/null
@@ -1,25 +0,0 @@
-import * as React from 'react';
-import { Dialog } from './Dialog';
-import { DialogFooter } from './DialogFooter';
-import { Button } from './../Button/index';
-
-export default class DialogVPage extends React.Component<any, any> {
-  public render() {
-    return (
-      <div>
-        <Dialog
-          hidden={ false }
-          className='Dialog'
-          title='All emails together'
-          subText='Your Inbox has changed.'
-          isBlocking={ false }
-        >
-          <DialogFooter>
-            <Button >Save</Button>
-            <Button >Cancel</Button>
-          </DialogFooter>
-        </Dialog>
-      </div>
-    );
-  }
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.visualtest.ts b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.visualtest.ts
deleted file mode 100644
index ecf175ab5628b..0000000000000
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.visualtest.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-import { Casper} from '../../visualtest/PhantomCssInterface';
-import { baseUrl } from '../../common/VisualTest';
-import {
-  defaultScreenshot, mouseMoveScreenshot, testRunner
-} from '../../visualtest/RunVisualTest';
-import { IRunVisualTest } from '../../visualtest/IRunVisualTest';
-declare var casper: Casper;
-let componentIds: IRunVisualTest[] = [];
-
-componentIds.push({
-  selector: '.' + 'DocumentCard',
-  fileName: 'documentCard',
-  commands: [defaultScreenshot, mouseMoveScreenshot]
-});
-
-casper.
-  start(baseUrl + 'documentCard').
-  then(() => {
-    testRunner(componentIds);
-  });
-
-casper.run(() => { casper.test.done(); });
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.visualtest.tsx
deleted file mode 100644
index d6465b03c1649..0000000000000
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.visualtest.tsx
+++ /dev/null
@@ -1,38 +0,0 @@
-import { DocumentCard, DocumentCardPreview, DocumentCardTitle, DocumentCardActivity, IDocumentCardPreviewProps } from './index';
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-/* tslint:enable:no-unused-variable */
-export default class DocumentCardVPage extends React.Component<any, any> {
-  public render() {
-    let previewProps: IDocumentCardPreviewProps = {
-      previewImages: [
-        {
-          name: 'DocumentCard',
-          previewImageSrc: 'dist/document-preview.png',
-          iconSrc: 'dist/icon-ppt.png',
-          width: 318,
-          height: 196
-        }
-      ],
-    };
-    return (
-      <div >
-        <DocumentCard className='DocumentCard'>
-          <DocumentCardPreview { ...previewProps } />
-          <DocumentCardTitle
-            title='Document Card'
-            shouldTruncate={ true }
-          />
-          <DocumentCardActivity
-            activity='Created a few minutes ago'
-            people={
-              [
-                { name: 'Annie Lindqvist', profileImageSrc: 'images/persona-female.png' }
-              ]
-            }
-          />
-        </DocumentCard>
-      </div>
-    );
-  }
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.visualtest.ts b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.visualtest.ts
deleted file mode 100644
index a4eb3c37a5dc3..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.visualtest.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import { Casper } from '../../visualtest/PhantomCssInterface';
-import { baseUrl } from '../../common/VisualTest';
-import { defaultScreenshot, testRunner } from '../../visualtest/RunVisualTest';
-import { IRunVisualTest } from '../../visualtest/IRunVisualTest';
-declare var casper: Casper;
-let componentIds: IRunVisualTest[] = [];
-
-componentIds.push({
-  selector: '.' + 'Facepile',
-  fileName: 'facepile',
-  commands: [defaultScreenshot]
-});
-
-casper.
-  start(baseUrl + 'facepile').
-  then(() => {
-    testRunner(componentIds);
-  });
-
-casper.run(() => { casper.test.done(); });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.visualtest.tsx
deleted file mode 100644
index 18d86e8414d10..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.visualtest.tsx
+++ /dev/null
@@ -1,28 +0,0 @@
-import { Facepile } from './index';
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-/* tslint:enable:no-unused-variable */
-export default class FacepileVPage extends React.Component<any, any> {
-  public render() {
-    return (
-      <div>
-        <label>Basic Facepile:</label>
-        <Facepile
-          className='Facepile'
-          personas={ [{
-            imageUrl: './images/persona-female.png',
-            personaName: 'Annie Lindqvist',
-            imageInitials: 'AL',
-            data: '50%'
-          },
-          {
-            imageUrl: './images/persona-male.png',
-            personaName: 'Aaron Reid',
-            imageInitials: 'AR',
-            data: '$1,000'
-          }] }
-        />
-      </div>
-    );
-  }
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.visualtest.ts b/packages/office-ui-fabric-react/src/components/Label/Label.visualtest.ts
deleted file mode 100644
index 6abe296df9609..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Label/Label.visualtest.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-import { Casper } from '../../visualtest/PhantomCssInterface';
-import { baseUrl } from '../../common/VisualTest';
-import { defaultScreenshot, testRunner } from '../../visualtest/RunVisualTest';
-import { IRunVisualTest } from '../../visualtest/IRunVisualTest';
-declare var casper: Casper;
-let componentIds: IRunVisualTest[] = [];
-
-componentIds.push({
-  selector: '.' + 'Label',
-  fileName: 'label',
-  commands: [defaultScreenshot]
-});
-
-componentIds.push({
-  selector: '.' + 'LabelDisabled',
-  fileName: 'labelDisabled',
-  commands: [defaultScreenshot]
-});
-componentIds.push({
-  selector: '.' + 'LabelRequired',
-  fileName: 'labelRequired',
-  commands: [defaultScreenshot]
-});
-
-casper.
-  start(baseUrl + 'label').
-  then(() => {
-    testRunner(componentIds);
-  });
-
-casper.run(() => { casper.test.done(); });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Label/LabelPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Label/LabelPage.visualtest.tsx
deleted file mode 100644
index 18e2f06feadef..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Label/LabelPage.visualtest.tsx
+++ /dev/null
@@ -1,18 +0,0 @@
-import { Label } from './index';
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-/* tslint:enable:no-unused-variable */
-export default class LabelVPage extends React.Component<any, any> {
-  public render() {
-    return (
-      <div>
-        <div>
-          <div><Label className='Label'>I'm a Label</Label></div>&nbsp;
-           <div><Label className='LabelDisabled' disabled={ true }>I'm a disabled Label</Label></div>&nbsp;
-           <div><Label className='LabelRequired' required={ true }>I'm a required Label</Label></div>&nbsp;
-        </div>
-
-      </div>
-    );
-  }
-}
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.visualtest.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.visualtest.ts
deleted file mode 100644
index 523045078f405..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.visualtest.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { Casper} from '../../visualtest/PhantomCssInterface';
-import { baseUrl } from '../../common/VisualTest';
-import { defaultScreenshot, testRunner, mouseClickScreenshot, mouseMoveScreenshot, mouseDownScreenshot } from '../../visualtest/RunVisualTest';
-import { IRunVisualTest } from '../../visualtest/IRunVisualTest';
-declare var casper: Casper;
-let componentIds: IRunVisualTest[] = [];
-
-componentIds.push({
-  selector: '.' + 'ms-Toggle-button',
-  fileName: 'toggle',
-  imageSelector: '.' + 'Toggle',
-  commands: [defaultScreenshot, mouseClickScreenshot, mouseMoveScreenshot, mouseDownScreenshot]
-});
-
-casper.
-  start(baseUrl + 'toggle').
-  then(() => {
-    testRunner(componentIds);
-  });
-
-casper.run(() => { casper.test.done(); });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.visualtest.tsx
deleted file mode 100644
index 0f39c0a787f29..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.visualtest.tsx
+++ /dev/null
@@ -1,21 +0,0 @@
-import { Toggle } from './index';
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-/* tslint:enable:no-unused-variable */
-export default class ToggleVPage extends React.Component<any, any> {
-  public render() {
-    return (
-      <div>
-        <Toggle
-          className='Toggle'
-          defaultChecked={ true }
-          label='Enabled and checked'
-          onAriaLabel='This toggle is checked. Press to uncheck.'
-          offAriaLabel='This toggle is unchecked. Press to check.'
-          onText='On'
-          offText='Off'
-        />
-      </div>
-    );
-  }
-}
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.visualtest.ts b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.visualtest.ts
deleted file mode 100644
index a014e595faffd..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.visualtest.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { Casper} from '../../visualtest/PhantomCssInterface';
-import { baseUrl } from '../../common/VisualTest';
-import { testRunner, mouseClickScreenshot, mouseMoveScreenshot, mouseDownScreenshot } from '../../visualtest/RunVisualTest';
-import { IRunVisualTest } from '../../visualtest/IRunVisualTest';
-declare var casper: Casper;
-let componentIds: IRunVisualTest[] = [];
-
-componentIds.push({
-  selector: '#' + 'TooltipButton',
-  fileName: 'tooltip',
-  imageSelector: '#' + 'Tooltip',
-  commands: [mouseClickScreenshot, mouseMoveScreenshot, mouseDownScreenshot]
-});
-
-casper.
-  start(baseUrl + 'tooltip').
-  then(() => {
-    testRunner(componentIds);
-  });
-
-casper.run(() => { casper.test.done(); });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.visualtest.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.visualtest.tsx
deleted file mode 100644
index d6cb82d750f5a..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.visualtest.tsx
+++ /dev/null
@@ -1,16 +0,0 @@
-import { TooltipHost } from './index';
-import { DefaultButton } from '../Button/DefaultButton/DefaultButton';
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-/* tslint:enable:no-unused-variable */
-export default class TooltipVPage extends React.Component<any, any> {
-  public render() {
-    return (
-      <div>
-        <TooltipHost content='This is the tooltip' id='Tooltip' calloutProps={ { gapSpace: 25 } }>
-          <DefaultButton id='TooltipButton' aria-describedby='myID'>Hover Over Me</DefaultButton>
-        </TooltipHost>
-      </div>
-    );
-  }
-}
diff --git a/packages/office-ui-fabric-react/src/visualtest/IRunVisualTest.ts b/packages/office-ui-fabric-react/src/visualtest/IRunVisualTest.ts
deleted file mode 100644
index 00ed4f415edcb..0000000000000
--- a/packages/office-ui-fabric-react/src/visualtest/IRunVisualTest.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-
-export interface IRunVisualTest {
-  selector: string;
-  fileName: string;
-  imageSelector?: string;
-  commands: ((params: IRunVisualTest) => void)[];
-  childParams?: IRunVisualTest;
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/visualtest/PhantomCssInterface.ts b/packages/office-ui-fabric-react/src/visualtest/PhantomCssInterface.ts
deleted file mode 100644
index 48015a70faef5..0000000000000
--- a/packages/office-ui-fabric-react/src/visualtest/PhantomCssInterface.ts
+++ /dev/null
@@ -1,753 +0,0 @@
-// This is a temporary hack and should be changed as soon as possible.
-// I'm not sure the cause of these errors but they are as follows:
-// PhantomCSS causes the compiler to throw an error because it cannot find resemble.
-// PhantomJS causes an error because it contains a duplicate definition of require which conflicts
-// with nodejs's definition.
-// Casper does not include the mouse module.
-// I think that all of these can be changed in the DefinitelyTyped repo but I'm not sure how long
-// that would take. Additionally some of these problems could be caused by our build systems.
-// Finally all of these definitions have been taken from DefinitelyTyped, I did not write them myself.
-// The links are:
-// https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/phantomcss/index.d.ts
-// https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/phantomjs/index.d.ts
-// https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/casperjs/index.d.ts
-// This file should be trimmed down or replaced once the DefinitelyTyped files have been fixed.
-import { OutputSettings } from 'resemblejs';
-
-export interface ICasperMouse {
-  down(selector: string): void;
-  move(selector: string): void;
-}
-
-export type Casper = {
-  mouse: ICasperMouse;
-  test: ITester;
-  options: ICasperOptions;
-
-  // Properties
-  __utils__: IClientUtils;
-
-  // Methods
-  back(): Casper;
-  base64encode(url: string, method?: string, data?: any): string;
-  bypass(nb: number): any;
-  click(selector: string): boolean;
-  clickLabel(label: string, tag?: string): boolean;
-  capture(targetFilePath: string, clipRect: IClipRect): Casper;
-  captureBase64(format: string): string;
-  captureBase64(format: string, area: string): string;
-  captureBase64(format: string, area: IClipRect): string;
-  captureBase64(format: string, area: any): string;
-  captureSelector(targetFile: string, selector: string): Casper;
-  clear(): Casper;
-  debugHTML(selector?: string, outer?: boolean): Casper;
-  debugPage(): Casper;
-  die(message: string, status?: number): Casper;
-  download(url: string, target?: string, method?: string, data?: any): Casper;
-  each<T>(array: T[], fn: (this: Casper, item: T, index: number) => void): Casper;
-  echo(message: string, style?: string): Casper;
-  evaluate<T>(fn: () => T, ...args: any[]): T
-  evaluateOrDie(fn: () => any, message?: string, status?: number): Casper;
-  exit(status?: number): Casper;
-  exists(selector: string): boolean;
-  fetchText(selector: string): string;
-  forward(): Casper;
-  log(message: string, level?: string, space?: string): Casper;
-  fill(selector: string, values: any, submit?: boolean): void;
-  fillSelectors(selector: string, values: any, submit?: boolean): void;
-  fillXPath(selector: string, values: any, submit?: boolean): void;
-  getCurrentUrl(): string;
-  getElementAttribute(selector: string, attribute: string): string;
-  getElementsAttribute(selector: string, attribute: string): string;
-  getElementBounds(selector: string): IElementBounds;
-  getElementsBounds(selector: string): IElementBounds[];
-  getElementInfo(selector: string): IElementInfo;
-  getElementsInfo(selector: string): IElementInfo;
-  getFormValues(selector: string): any;
-  getGlobal(name: string): any;
-  getHTML(selector?: string, outer?: boolean): string;
-  getPageContent(): string;
-  getTitle(): string;
-  mouseEvent(type: string, selector: string): boolean;
-  open(location: string, settings: IOpenSettings): Casper;
-  reload(then?: (response: IHttpResponse) => void): Casper;
-  repeat(times: number, then: Function): Casper;
-  resourceExists(test: Function): boolean;
-  resourceExists(test: string): boolean;
-  run(onComplete: Function, time?: number): Casper;
-  scrollTo(x: number, y: number): Casper;
-  scrollToBottom(): Casper;
-  sendKeys(selector: string, keys: string, options?: any): Casper;
-  setHttpAuth(username: string, password: string): Casper;
-  start(url?: string, then?: (response: IHttpResponse) => void): Casper;
-  status(asString: boolean): any;
-  then(fn: (this: Casper) => void): Casper;
-  thenBypass(nb: number): Casper;
-  thenBypassIf(condition: any, nb: number): Casper;
-  thenBypassUnless(condition: any, nb: number): Casper;
-  thenClick(selector: string): Casper;
-  thenEvaluate(fn: () => any, ...args: any[]): Casper;
-  thenOpen(location: string, then?: (response: IHttpResponse) => void): Casper;
-  thenOpen(location: string, options?: IOpenSettings, then?: (response: IHttpResponse) => void): Casper;
-  thenOpenAndEvaluate(location: string, then?: Function, ...args: any[]): Casper;
-  toString(): string;
-  unwait(): Casper;
-  userAgent(agent: string): string;
-  viewport(width: number, height: number): Casper;
-  visible(selector: string): boolean;
-  wait(timeout: number, then?: Function): Casper;
-  waitFor(testFx: Function, then?: Function, onTimeout?: Function, timeout?: number): Casper;
-  waitForAlert(then: Function, onTimeout?: Function, timeout?: number): Casper;
-  waitForPopup(urlPattern: string, then?: Function, onTimeout?: Function, timeout?: number): Casper;
-  waitForPopup(urlPattern: RegExp, then?: Function, onTimeout?: Function, timeout?: number): Casper;
-  waitForUrl(url: string, then?: Function, onTimeout?: Function, timeout?: number): Casper;
-  waitForUrl(url: RegExp, then?: Function, onTimeout?: Function, timeout?: number): Casper;
-  waitForSelector(selector: string, then?: Function, onTimeout?: Function, timeout?: number): Casper;
-  waitWhileSelector(selector: string, then?: Function, onTimeout?: Function, timeout?: number): Casper;
-  waitForResource(testFx: Function, then?: Function, onTimeout?: Function, timeout?: number): Casper;
-  waitForText(pattern: string, then?: Function, onTimeout?: Function, timeout?: number): Casper;
-  waitForText(pattern: RegExp, then?: Function, onTimeout?: Function, timeout?: number): Casper;
-  waitUntilVisible(selector: string, then?: Function, onTimeout?: Function, timeout?: number): Casper;
-  waitWhileVisible(selector: string, then?: Function, onTimeout?: Function, timeout?: number): Casper;
-  warn(message: string): Casper;
-  withFrame(frameInfo: string, then: Function): Casper;
-  withFrame(frameInfo: number, then: Function): Casper;
-  withPopup(popupInfo: string, step: Function): Casper;
-  withPopup(popupInfo: RegExp, step: Function): Casper;
-  zoom(factor: number): Casper;
-  removeAllFilters(filter: string): Casper;
-  setFilter(filter: string, cb: Function): boolean;
-};
-
-export interface IHttpResponse {
-  contentType: string;
-  headers: any[];
-  id: number;
-  redirectURL: string;
-  stage: string;
-  status: number;
-  statusText: string;
-  time: string;
-  url: string;
-}
-
-export interface IOpenSettings {
-  method: string;
-  data: any;
-  headers: any;
-}
-
-export interface IElementBounds {
-  top: number;
-  left: number;
-  width: number;
-  height: number;
-}
-
-export interface IElementInfo {
-  nodeName: string;
-  attributes: any;
-  tag: string;
-  html: string;
-  text: string;
-  x: number;
-  y: number;
-  width: number;
-  height: number;
-  visible: boolean;
-}
-
-export interface ICasperOptions {
-  clientScripts?: any[];
-  exitOnError?: boolean;
-  httpStatusHandlers?: any;
-  logLevel?: string;
-  onAlert?: Function;
-  onDie?: Function;
-  onError?: Function;
-  onLoadError?: Function;
-  onPageInitialized?: Function;
-  onResourceReceived?: Function;
-  onResourceRequested?: Function;
-  onStepComplete?: Function;
-  onStepTimeout?: Function;
-  onTimeout?: Function;
-  onWaitTimeout?: Function;
-  page?: IWebPage;
-  pageSettings?: any;
-  remoteScripts?: any[];
-  safeLogs?: boolean;
-  silentErrors?: boolean;
-  stepTimeout?: number;
-  timeout?: number;
-  verbose?: boolean;
-  viewportSize?: any;
-  retryTimeout?: number;
-  waitTimeout?: number;
-}
-
-export interface IClientUtils {
-  echo(message: string): void;
-  encode(contents: string): void;
-  exists(selector: string): void;
-  findAll(selector: string): void;
-  findOne(selector: string): void;
-  getBase64(url: string, method?: string, data?: any): void;
-  getBinary(url: string, method?: string, data?: any): void;
-  getDocumentHeight(): void;
-  getElementBounds(selector: string): void;
-  getElementsBounds(selector: string): void;
-  getElementByXPath(expression: string, scope?: HTMLElement): void;
-  getElementsByXPath(expression: string, scope?: HTMLElement): void;
-  getFieldValue(inputName: string): void;
-  getFormValues(selector: string): void;
-  mouseEvent(type: string, selector: string): void;
-  removeElementsByXPath(expression: string): void;
-  sendAJAX(url: string, method?: string, data?: any, async?: boolean): void;
-  visible(selector: string): void;
-}
-
-export interface IColorizer {
-  colorize(text: string, styleName: string): void;
-  format(text: string, style: any): void;
-}
-
-export interface ITester {
-  assert(condition: boolean, message?: string): any;
-  assertDoesntExist(selector: string, message?: string): any;
-  assertElementCount(selctor: string, expected: number, message?: string): any;
-  assertEquals(testValue: any, expected: any, message?: string): any;
-  assertEval(fn: Function, message: string, args: any): any;
-  assertEvalEquals(fn: Function, expected: any, message?: string, args?: any): any;
-  assertExists(selector: string, message?: string): any;
-  assertFalsy(subject: any, message?: string): any;
-  assertField(inputName: string, expected: string, message?: string): any;
-  assertFieldName(inputName: string, expected: string, message?: string, options?: any): any;
-  assertFieldCSS(cssSelector: string, expected: string, message?: string): any;
-  assertFieldXPath(xpathSelector: string, expected: string, message?: string): any;
-  assertHttpStatus(status: number, message?: string): any;
-  assertMatch(subject: any, pattern: RegExp, message?: string): any;
-  assertNot(subject: any, message?: string): any;
-  assertNotEquals(testValue: any, expected: any, message?: string): any;
-  assertNotVisible(selector: string, message?: string): any;
-  assertRaises(fn: Function, args: any[], message?: string): any;
-  assertSelectorDoesntHaveText(selector: string, text: string, message?: string): any;
-  assertSelectorExists(selector: string, message?: string): any;
-  assertSelectorHasText(selector: string, text: string, message?: string): any;
-  assertResourceExists(testFx: Function, message?: string): any;
-  assertTextExists(expected: string, message?: string): any;
-  assertTextDoesntExist(unexpected: string, message: string): any;
-  assertTitle(expected: string, message?: string): any;
-  assertTitleMatch(pattern: RegExp, message?: string): any;
-  assertTruthy(subject: any, message?: string): any;
-  assertType(input: any, type: string, message?: string): any;
-  assertInstanceOf(input: any, ctor: Function, message?: string): any;
-  assertUrlMatch(pattern: string, message?: string): any;
-  assertUrlMatch(pattern: RegExp, message?: string): any;
-  assertVisible(selector: string, message?: string): any;
-
-  /* since 1.1 */
-  begin(description: string, planned: number, suite: Function): any;
-  begin(description: string, suite: Function): any;
-  begin(description: string, planned: number, config: Object): any;
-  begin(description: string, config: Object): any;
-
-  colorize(message: string, style: string): any;
-  comment(message: string): any;
-  done(expected?: number): any;
-  error(message: string): any;
-  fail(message: string): any;
-  formatMessage(message: string, style: string): any;
-  getFailures(): ICases;
-  getPasses(): ICases;
-  info(message: string): any;
-  pass(message: string): any;
-  renderResults(exit: boolean, status: number, save: string): any;
-
-  setup(fn: Function): any;
-  skip(nb: number, message: string): any;
-  tearDown(fn: Function): any;
-}
-
-export interface ICases {
-  length: number;
-  cases: ICase[];
-}
-
-export interface ICase {
-  success: boolean;
-  type: string;
-  standard: string;
-  file: string;
-  values: ICaseValues;
-}
-
-export interface ICaseValues {
-  subject: boolean;
-  expected: boolean;
-}
-
-export interface IUtils {
-  betterTypeOf(input: any): any;
-  dump(value: any): any;
-  fileExt(file: string): any;
-  fillBlanks(text: string, pad: number): any;
-  format(f: string, ...args: any[]): any;
-  getPropertyPath(obj: any, path: string): any;
-  inherits(ctor: any, superCtor: any): any;
-  isArray(value: any): any;
-  isCasperObject(value: any): any;
-  isClipRect(value: any): any;
-  isFalsy(subject: any): any;
-  isFunction(value: any): any;
-  isJsFile(file: string): any;
-  isNull(value: any): any;
-  isNumber(value: any): any;
-  isObject(value: any): any;
-  isRegExp(value: any): any;
-  isString(value: any): any;
-  isTruthy(subject: any): any;
-  isType(what: any, type: string): any;
-  isUndefined(value: any): any;
-  isWebPage(what: any): any;
-  mergeObjects(origin: any, add: any): any;
-  node(name: string, attributes: any): any;
-  serialize(value: any): any;
-  unique(array: any[]): any;
-}
-
-export interface IPhantomCSS {
-  outputSettings?: OutputSettings;
-
-  init(options: IPhantomCSSOptions): void;
-  update(options: IPhantomCSSOptions): void;
-
-  /**
-   * Take a screenshot of the targeted HTML element
-   * FileName is required if addIteratorToImage option is set to false
-   */
-  screenshot(target: string, fileName?: string): void;
-
-  /**
-   * Take a screenshot of the targeted HTML element
-   * FileName is required if addIteratorToImage option is set to false
-   */
-  screenshot(target: IClipRect, fileName?: string): void;
-  /**
-   * Take a screenshot of the targeted HTML element
-   * FileName is required if addIteratorToImage option is set to false
-   */
-  screenshot(target: string, timeToWait: number, hideSelector: string, fileName?: string): void;
-
-  compareAll(exclude: string): void;
-  compareAll(exclude: string, diffList: string[], include: string): void;
-  compareMatched(match: string, exclude: string): void;
-  compareMatched(match: RegExp, exclude: RegExp): void;
-  /**
-   * Explicitly define what files you want to compare
-   */
-  compareExplicit(list: string[]): void;
-  /**
-   * Compare image diffs generated in this test run only
-   */
-  compareSession(list?: any[]): void;
-  compareFiles(baseFile: string, diffFiles: string): IPhantomCSSTest;
-  waitForTests(tests: IPhantomCSSTest[]): void;
-  done(): void;
-  /**
-   * Turn off CSS transitions and jQuery animations
-   */
-  turnOffAnimations(): void;
-  getExitStatus(): number;
-  /**
-   * Get a list of image diffs generated in this test run
-   */
-  getCreatedDiffFiles(): Array<string>;
-}
-
-export interface IPhantomCSSTest {
-  filename?: string;
-  error?: boolean;
-  fail?: boolean;
-  success?: boolean;
-  failFile?: string;
-  mismatch?: any;
-}
-
-export interface IPhantomCSSOptions {
-  /**
-      Rebase is useful when you want to create new baseline
-      images without manually deleting the files
-      casperjs demo/test.js --rebase
-  */
-  rebase?: any;
-  /**
-    A reference to a particular Casper instance. Required for SlimerJS.
-   */
-  casper?: Casper;
-  /**
-  libraryRoot is relative to this file and must point to your phantomcss folder (not lib or node_modules). If you are using NPM, this will be './node_modules/phantomcss'.
-  */
-  libraryRoot?: string;
-
-  screenshotRoot?: string;
-  /**
-  By default, failure images are put in the './failures' folder.
-  If failedComparisonsRoot is set to false a separate folder will
-  not be created but failure images can still be found alongside
-  the original and new images.
-  */
-  failedComparisonsRoot?: string;
-
-  /**
-  You might want to keep master/baseline images in a completely
-  different folder to the diffs/failures.  Useful when working
-  with version control systems. By default this resolves to the
-  screenshotRoot folder.
-  */
-  comparisonResultRoot?: string;
-
-  /**
-  Don't add count number to images. If set to false (default), a filename is
-  required when capturing screenshots.
-  */
-  addIteratorToImage: boolean;
-
-  /**
-  Remove results directory tree after run.  Use in conjunction
-  with failedComparisonsRoot to see failed comparisons.
-  */
-  cleanupComparisonImages?: boolean;
-
-  /**
-   * Don't add label to generated failure image
-   */
-  addLabelToFailedImage?: boolean;
-  /**
-  Prefix the screenshot number to the filename, instead of suffixing it
-  */
-  prefixCount?: boolean;
-
-  hideElements?: string;
-  /**
-  Mismatch tolerance defaults to  0.05%. Increasing this value
-  will decrease test coverage
-  */
-  mismatchTolerance?: number;
-  /**
-  * Change the output screenshot filenames for your specific
-  * integration
-  */
-  fileNameGetter?: (rootPath: string, fileName?: string) => string;
-  onPass?: (test: IPhantomCSSTest) => void;
-  onFail?: (test: IPhantomCSSTest) => void;
-  onTimeout?: (test: IPhantomCSSTest) => void;
-  onComplete?: (tests: IPhantomCSSTest[], noOfFails: number, noOfErrors: number) => void;
-  /**
-  Called when creating new baseline images
-  */
-  onNewImage?: (test: IPhantomCSSTest) => void;
-}
-
-// Type definitions for PhantomJS API 1.9
-// Project: https://github.com/ariya/phantomjs/wiki/API-Reference
-// Definitions by: Jed Hunsaker <https://github.com/jedhunsaker>, Mike Keesey <https://github.com/keesey>
-// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
-
-// declare function require(module: string): any;
-
-export interface IPhantom {
-
-  // Properties
-  args: string[];  // DEPRECATED
-  cookies: ICookie[];
-  cookiesEnabled: boolean;
-  libraryPath: string;
-  scriptName: string;  // DEPRECATED
-  version: {
-    major: number;
-    minor: number;
-    patch: number;
-  };
-
-  // Callbacks
-  onError: (msg: string, trace: string[]) => any;
-
-  // Functions
-  addCookie(cookie: ICookie): boolean;
-  clearCookies(): void;
-  deleteCookie(cookieName: string): boolean;
-  exit(returnValue?: any): boolean;
-  injectJs(filename: string): boolean;
-}
-
-export interface ISystem {
-  pid: number;
-  platform: string;
-  os: {
-    architecture: string;
-    name: string;
-    version: string;
-  };
-  env: { [name: string]: string; };
-  args: string[];
-}
-
-export interface IWebPage {
-
-  // Properties
-  canGoBack: boolean;
-  canGoForward: boolean;
-  clipRect: IClipRect;
-  content: string;
-  cookies: ICookie[];
-  customHeaders: { [name: string]: string; };
-  event: any; // :TODO: elaborate this when documentation improves
-  focusedFrameName: string;
-  frameContent: string;
-  frameName: string;
-  framePlainText: string;
-  frameTitle: string;
-  frameUrl: string;
-  framesCount: number;
-  framesName: any; // :TODO: elaborate this when documentation improves
-  libraryPath: string;
-  navigationLocked: boolean;
-  offlineStoragePath: string;
-  offlineStorageQuota: number;
-  ownsPages: boolean;
-  pages: IWebPage[];
-  pagesWindowName: string;
-  paperSize: IPaperSize;
-  plainText: string;
-  scrollPosition: ITopLeft;
-  settings: IWebPageSettings;
-  title: string;
-  url: string;
-  viewportSize: ISize;
-  windowName: string;
-  zoomFactor: number;
-  onCallback: Function;  // EXPERIMENTAL
-
-  // Callbacks
-  onAlert: (msg: string) => any;
-  onClosing: (closingPage: IWebPage) => any;
-  onConfirm: (msg: string) => boolean;
-  onConsoleMessage: (msg: string, lineNum?: number, sourceId?: string) => any;
-  onError: (msg: string, trace: string[]) => any;
-  onFilePicker: (oldFile: string) => string;
-  onInitialized: () => any;
-  onLoadFinished: (status: string) => any;
-  onLoadStarted: () => any;
-  onNavigationRequested: (url: string, type: string, willNavigate: boolean, main: boolean) => any;
-  onPageCreated: (newPage: IWebPage) => any;
-  onPrompt: (msg: string, defaultVal: string) => string;
-  onResourceError: (resourceError: IResourceError) => any;
-  onResourceReceived: (response: IResourceResponse) => any;
-  onResourceRequested: (requestData: IResourceRequest, networkRequest: INetworkRequest) => any;
-  onUrlChanged: (targetUrl: string) => any;
-
-  // Functions
-  addCookie(cookie: ICookie): boolean;
-  childFramesCount(): number;  // DEPRECATED
-  childFramesName(): string;  // DEPRECATED
-  clearCookies(): void;
-  close(): void;
-  currentFrameName(): string;  // DEPRECATED
-  deleteCookie(cookieName: string): boolean;
-  evaluate(fn: Function, ...args: any[]): any;
-  evaluateAsync(fn: Function): void;
-  evaluateJavaScript(str: string): any; // :TODO: elaborate this when documentation improves
-  getPage(windowName: string): IWebPage;
-  go(index: number): void;
-  goBack(): void;
-  goForward(): void;
-  includeJs(url: string, callback: Function): void;
-  injectJs(filename: string): boolean;
-  open(url: string, callback: (status: string) => any): void;
-  open(url: string, method: string, callback: (status: string) => any): void;
-  open(url: string, method: string, data: any, callback: (status: string) => any): void;
-  openUrl(url: string, httpConf: any, settings: any): void; // :TODO: elaborate this when documentation improves
-  release(): void;  // DEPRECATED
-  reload(): void;
-  render(filename: string): void;
-  renderBase64(format: string): string;
-  sendEvent(mouseEventType: string, mouseX?: number, mouseY?: number, button?: string): void;
-  sendEvent(keyboardEventType: string, keyOrKeys: any, aNull?: any, bNull?: any, modifier?: number): void;
-  setContent(content: string, url: string): void;
-  stop(): void;
-  switchToFocusedFrame(): void;
-  switchToFrame(frameName: string): void;
-  switchToFrame(framePosition: number): void;
-  switchToChildFrame(frameName: string): void;
-  switchToChildFrame(framePosition: number): void;
-  switchToMainFrame(): void;  // DEPRECATED
-  switchToParentFrame(): void;  // DEPRECATED
-  uploadFile(selector: string, filename: string): void;
-
-  // Callback triggers
-  closing(closingPage: IWebPage): void;
-  initialized(): void;
-  javaScriptAlertSent(msg: string): void;
-  javaScriptConsoleMessageSent(msg: string, lineNum?: number, sourceId?: string): void;
-  loadFinished(status: string): void;
-  loadStarted(): void;
-  navigationRequested(url: string, type: string, willNavigate: boolean, main: boolean): void;
-  rawPageCreated(newPage: IWebPage): void;
-  resourceReceived(response: IResourceResponse): void;
-  resourceRequested(requestData: IResourceRequest, networkRequest: INetworkRequest): void;
-  urlChanged(targetUrl: string): void;
-}
-
-export interface IResourceError {
-  id: number;
-  url: string;
-  errorCode: string;
-  errorString: string;
-}
-
-export interface IResourceResponse {
-  id: number;
-  url: string;
-  time: Date;
-  headers: { [name: string]: string; };
-  bodySize: number;
-  contentType?: string;
-  redirectURL?: string;
-  stage: string;
-  status: number;
-  statusText: string;
-}
-
-export interface IResourceRequest {
-  id: number;
-  method: string;
-  url: string;
-  time: Date;
-  headers: { [name: string]: string; };
-}
-
-export interface INetworkRequest {
-  abort(): void;
-  changeUrl(url: string): void;
-  setHeader(name: string, value: string): void;
-}
-
-export interface IPaperSize {
-  width?: string;
-  height?: string;
-  border: string;
-  format?: string;
-  orientation?: string;
-}
-
-export interface IWebPageSettings {
-  javascriptEnabled: boolean;
-  loadImages: boolean;
-  localToRemoteUrlAccessEnabled: boolean;
-  userAgent: string;
-  userName: string;
-  password: string;
-  XSSAuditingEnabled: boolean;
-  webSecurityEnabled: boolean;
-  resourceTimeout: number;
-}
-
-export interface IFileSystem {
-
-  // Properties
-  separator: string;
-  workingDirectory: string;
-
-  // Functions
-
-  // Query Functions
-  list(path: string): string[];
-  absolute(path: string): string;
-  exists(path: string): boolean;
-  isDirectory(path: string): boolean;
-  isFile(path: string): boolean;
-  isAbsolute(path: string): boolean;
-  isExecutable(path: string): boolean;
-  isReadable(path: string): boolean;
-  isWritable(path: string): boolean;
-  isLink(path: string): boolean;
-  readLink(path: string): string;
-
-  // Directory Functions
-  changeWorkingDirectory(path: string): void;
-  makeDirectory(path: string): void;
-  makeTree(path: string): void;
-  removeDirectory(path: string): void;
-  removeTree(path: string): void;
-  copyTree(source: string, destination: string): void;
-
-  // File Functions
-  open(path: string, mode: string): IStream;
-  open(path: string, options: { mode: string; charset?: string; }): IStream;
-  read(path: string): string;
-  write(path: string, content: string, mode: string): void;
-  size(path: string): number;
-  remove(path: string): void;
-  copy(source: string, destination: string): void;
-  move(source: string, destination: string): void;
-  touch(path: string): void;
-}
-
-export interface IStream {
-  atEnd(): boolean;
-  close(): void;
-  flush(): void;
-  read(): string;
-  readLine(): string;
-  seek(position: number): void;
-  write(data: string): void;
-  writeLine(data: string): void;
-}
-
-export interface IWebServer {
-  port: number;
-  listen(port: number, cb?: (request: IWebServerRequest, response: IWebServerResponse) => void): boolean;
-  listen(ipAddressPort: string, cb?: (request: IWebServerRequest, response: IWebServerResponse) => void): boolean;
-  close(): void;
-}
-
-export interface IWebServerRequest {
-  method: string;
-  url: string;
-  httpVersion: number;
-  headers: { [name: string]: string; };
-  post: string;
-  postRaw: string;
-}
-
-export interface IWebServerResponse {
-  headers: { [name: string]: string; };
-  statusCode: number;
-  setHeader(name: string, value: string): void;
-  header(name: string): string;
-  setEncoding(encoding: string): void;
-  write(data: string): void;
-  writeHead(statusCode: number, headers?: { [name: string]: string; }): void;
-  close(): void;
-  closeGracefully(): void;
-}
-
-export interface ITopLeft {
-  top: number;
-  left: number;
-}
-
-export interface ISize {
-  width: number;
-  height: number;
-}
-
-export interface IClipRect extends ITopLeft, ISize {
-}
-
-export interface ICookie {
-  name: string;
-  value: string;
-  domain?: string;
-}
diff --git a/packages/office-ui-fabric-react/src/visualtest/RunVisualTest.ts b/packages/office-ui-fabric-react/src/visualtest/RunVisualTest.ts
deleted file mode 100644
index 8ba75fcad103b..0000000000000
--- a/packages/office-ui-fabric-react/src/visualtest/RunVisualTest.ts
+++ /dev/null
@@ -1,82 +0,0 @@
-
-import { Casper, IPhantomCSS } from './PhantomCssInterface';
-import { IRunVisualTest } from './IRunVisualTest';
-declare var phantomcss: IPhantomCSS;
-declare var casper: Casper;
-
-export function defaultScreenshot(params: IRunVisualTest) {
-  let imageSelector = params.imageSelector || params.selector;
-
-  casper.then(() => {
-    phantomcss.screenshot(imageSelector, params.fileName + '_default');
-  });
-  if (params.childParams) {
-    params.childParams.commands.forEach(commandList => {
-      commandList(params.childParams!);
-    });
-  }
-}
-
-export function mouseMoveScreenshot(params: IRunVisualTest) {
-  let imageSelector = params.imageSelector || params.selector;
-
-  casper.then(function () {
-    this.mouse.move(params.selector);
-    phantomcss.screenshot(imageSelector, params.fileName + '_mouseMove');
-  });
-  if (params.childParams) {
-    params.childParams.commands.forEach(commandList => {
-      commandList(params.childParams!);
-    });
-  }
-}
-
-export function mouseDownScreenshot(params: IRunVisualTest) {
-  let imageSelector = params.imageSelector || params.selector;
-
-  casper.then(function () {
-    this.mouse.down(params.selector);
-    phantomcss.screenshot(imageSelector, params.fileName + '_mouseDown');
-  });
-  if (params.childParams) {
-    params.childParams.commands.forEach(commandList => {
-      commandList(params.childParams!);
-    });
-  }
-}
-export function mouseClickScreenshot(params: IRunVisualTest) {
-  let imageSelector = params.imageSelector || params.selector;
-
-  casper.then(function () {
-    this.click(params.selector);
-    phantomcss.screenshot(imageSelector, params.fileName + '_mouseClick');
-  });
-  casper.then(function () {
-    this.click(params.selector);
-  });
-  if (params.childParams) {
-    params.childParams.commands.forEach(commandList => {
-      commandList(params.childParams!);
-    });
-  }
-}
-
-export function mouseSingleClickScreenshot(params: IRunVisualTest) {
-  params.imageSelector = params.imageSelector || params.selector;
-
-  casper.then(function () {
-    this.click(params.selector);
-  });
-  if (params.childParams) {
-    params.childParams.commands.forEach(commandList => {
-      commandList(params.childParams!);
-    });
-  }
-}
-export function testRunner(componentIds: IRunVisualTest[]) {
-  componentIds.forEach(element => {
-    element.commands.forEach(command => {
-      command(element);
-    });
-  });
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/visualtest.html b/packages/office-ui-fabric-react/visualtest.html
deleted file mode 100644
index 06f115527820b..0000000000000
--- a/packages/office-ui-fabric-react/visualtest.html
+++ /dev/null
@@ -1,66 +0,0 @@
-<!doctype html>
-<html dir="ltr">
-
-<head>
-  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
-  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" user-scalable="no" />
-
-  <link rel="stylesheet" href="node_modules/office-ui-fabric-core/dist/css/fabric.min.css"></link>
-  <style>
-    body {
-      background: white;
-    }
-  </style>
-</head>
-
-<body>
-  <br>
-  <h1>
-    <center>Regression Test Results</center>
-  </h1>
-  </br>
-  <div style=float:left;width:30%;margin-left:100px>
-    <div>
-      <h2>Fabric Components</h2>
-    </div>&nbsp;
-    <div><a href="http://localhost:43210/visualtest.html?#/breadcrumb"> Breadcrumb</a></div>&nbsp;
-    <div><a href="http://localhost:43210/visualtest.html?#/button"> Button</a></div>&nbsp;
-    <div><a href="http://localhost:43210/visualtest.html?#/checkBox"> Checkbox</a></div>&nbsp;
-    <div><a href="http://localhost:43210/visualtest.html?#/choiceGroup"> Choice Group</a></div>&nbsp;
-    <div><a href="http://localhost:43210/visualtest.html?#/contextualMenu"> Contextual Menu</a></div>&nbsp;
-    <div><a href="http://localhost:43210/visualtest.html?#/commandBar"> Command Bar</a></div>&nbsp;
-    <div><a href="http://localhost:43210/visualtest.html?#/dialog"> Dialog </a></div>&nbsp;
-    <div><a href="http://localhost:43210/visualtest.html?#/detailsList"> Details List </a></div>&nbsp;
-    <div><a href="http://localhost:43210/visualtest.html?#/documentCard"> Document Card </a></div>&nbsp;
-    <div><a href="http://localhost:43210/visualtest.html?#/facepile"> Facepile </a></div>&nbsp;
-    <div><a href="http://localhost:43210/visualtest.html?#/label"> Label </a></div>&nbsp;
-    <div><a href="http://localhost:43210/visualtest.html?#/toggle"> Toggle </a></div>&nbsp;
-    <div><a href="http://localhost:43210/visualtest.html?#/tooltip"> Tooltip </a></div>&nbsp;
-  </div>
-  <div style=float:left;width:30%;margin-left:100px>
-    <div>
-      <h2>Baseline Images</h2>
-    </div>
-  </div>
-
-  <div id="content"></div>
-  <script type="text/javascript">
-    function loadScript(n) {
-      for (var i = 0; i < n.length; i++) {
-        var s = document.createElement('script');
-        s.src = n[i];
-        s.async = false;
-        document.body.appendChild(s);
-      }
-    }
-    loadScript([
-      '//cdnjs.cloudflare.com/ajax/libs/react/15.4.0/react.js ',
-      '//cdnjs.cloudflare.com/ajax/libs/react/15.4.0/react-dom.js ',
-      'dist/fabric-test.js ']
-    );
-  </script>
-
-</body>
-
-</html>
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/visualtests/baseline/ButtonDefaultDisabled_default_4.png b/packages/office-ui-fabric-react/visualtests/baseline/ButtonDefaultDisabled_default_4.png
deleted file mode 100644
index 45086ce8e5413a4afef4c70a63f8b14860cf588e..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1095
zcmV-N1i1T&P)<h;3K|Lk000e1NJLTq005i-001Be1^@s6=dck&00009a7bBm000ie
z000ie0hKEb8vp<U`AI}URCt{2o54#mTNsC*?{=kzyg{ibDk?%HM7c0p%*s!gZGWtr
z7D5Svt6EH8sew(F!yp5q85IimE@VV)EG?V9y5|9L#yRKxy>sR_=RIfPuWq;dF9Lx>
z{Pood2>xFP!wDQk7*60Q!f*md5rz{uiZGnOQH0?Hjv@>va1>!UfusEW)d|c?Hk%zg
z4+H{uJRW>LA8TuCGso$4I+V+048!2?@NgkH%@b$xK6Z9?2#3QgFE4*6mp>gxXSn;y
z2`82Ng~XC&8CjNz$KyOaJdn@lDVNJL_qWWJ$z&Fi&nP!HH=LiJ&(u~?6l7VZR4P%a
zR6e9JkM39TZA+@x>m7df_V!37lT@o!Ow*jHzhM{vxZUoB=ccMEnx@UvR+1#VUN6AR
zeWq#5qx)5SyOKJMKp=pss_42te1N8DQmfT441;7cNi-S-#>-hYn;n+IMx#Na(ZDba
zVzC(8+uJNJFTW_6ua(fr*wfmL((QJEL0O&Fcl6v&!!8G_Z>!bf_VyM{(+C6t#N+Yd
z7+Gx<Md9k|3Qg0-?tRgG+Zk>WYjCVL+%!#!#UhbN1X-3*Rh34g0SpG$V)VG*@3XtR
zi!94%nl@L7vx}!F%GkLb*=&~M<6{7PKHs}Frs<ldNuf|+b#)a*QSkfy6pO_dm7v*d
zvbniQDwRUhG_J3&XUb(>evIKJ(RCdd%zW0{Y#C0Hq+z?!<7hPc?h<DgPm-jub2}78
zA(P3FOeV?a^TSd<uf{Z8YaAkx2$Ccb3<d$H)oNogt$PoJLI6~&)i?8a4?m`)PL?Ih
zETbjowTId3^=LMmJUu;8DwRGj(FrVLxZQ44Ri$3969@zr7T+2Nm&-NwJ&UnFgCAqK
zySqC8{C+<$nAxmd=+e^CoBb~@FVQrOOeRAl65;6R=u`8Z#-fd2jYF^3!{u_(>-7ML
z#bOK9nUzm4oX%<X6n*OT6SB5Tqagc-`vhlH8C`?ux{ju4q|@o)t}_%0VHgJOcAJfj
z4chJYt24)F`E0k_W7oE}wuU?4=jZ1)bF&_DtJMNveSLju+sDU8V6cV)I5;?%Nz+cl
z?zeb6j$s(o>ve*`;84dZtxod^h6}PkWmk4zIpLIjesBNtVU=RB2n^m-kH_<3R}~6{
z==b}aot*)YN~K<nmrkcCm&;sST#!g4#;%3KVLF`-wOZ}PH9HcC1S=~m6bc1mvDmAI
z%jI&z`;cXMxPE*~(@w+gH?P-=EX(M+PA->wq2n~aocvG2A`K__p8VKds^HH=7*60Q
z!f*md5rz{uildtbfk4b~0!I;s6F7=6oWN0p;RKE%3@30DVK{-K{0Cb9%EbzPjHUnp
N002ovPDHLkV1gbm1QY-O

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/breadcrumb_default_0.png b/packages/office-ui-fabric-react/visualtests/baseline/breadcrumb_default_0.png
deleted file mode 100644
index 659d84bbcf13e60a2bc767d25649740a75dc371c..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 2017
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
X<M0r+Qh_3Xnhn9(Ioa0Oc*Xq-*+J|y

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/breadcrumb_mouseClick_3.png b/packages/office-ui-fabric-react/visualtests/baseline/breadcrumb_mouseClick_3.png
deleted file mode 100644
index 70dda532723a1ed88f363d03b674c70047024283..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 2864
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

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/breadcrumb_mouseDown_2.png b/packages/office-ui-fabric-react/visualtests/baseline/breadcrumb_mouseDown_2.png
deleted file mode 100644
index 70dda532723a1ed88f363d03b674c70047024283..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 2864
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

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/breadcrumb_mouseMove_1.png b/packages/office-ui-fabric-react/visualtests/baseline/breadcrumb_mouseMove_1.png
deleted file mode 100644
index 30904df9fd3598811c431602550c25dd53f9179c..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 2889
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
VU3}l*D?l5A%#5v!>TkNm{~I2>xx@ef

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonCommandDisabled_default_14.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonCommandDisabled_default_14.png
deleted file mode 100644
index eaca7bf169a4208e61bda9f0064d45271952b1ec..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1368
zcma)6`!^E`9G^~dDZ9vJ$+(wj<R%)s&BVO&xMZ{2!7zCpktTa2rd+ypkd{Yz%m`(O
zc`R>w93(N9hP5r@q-8U&EM;bOcmINWzvq0upY#3x^8I|z`J7KqV89t|Eh8-e0HE#T
z?SWQtu?mnM_Nh7u%HgX>Gub<Y0001o{)O7TW5B}zfV!5C2NIK7u}VWF9`pm<G(F4m
z(qbD}Y4(zXyeHlGt`ELg-p$K2)O{gU!j!OdtE_zwE5i1+XXRpv!wWfveHM{!Q)>l$
zesJ3HsM(>qQA>JdRGEerdmP4^2jYcza$(r1)2B~+nduJU4C$F4Qhrgl(9P8^_JE)R
z^{Ty*J~zz%bD`HG-U|qAHmF>hiib`@^D)+c)m<>8&-O%?TlR$A5s5_A8On#83&ilF
z1>U<j3B4?5ugEF(HC|cOLfrH+QQp?<X68wIV^|?;!h!v+EFNO9>H2YHlz_)OPaqVf
ze_d;9ZPiJj3`A&vbXHnBWoE=tS%Rg*Cg|oT8NMKib$gL&nr_tB*B5+$n9nzo$z(`H
zEQ#SG$q|dikk24Nr+Ww8@Z@1tMb}bp@m(}GuhJ8dwYkhrd7s+jUii$g3uW6CVX`#a
zj5S|W{jxs)j1k(LlAP>nV_<HSzh}<A8lv@dUADqI8Px_-9hjDq9APk&e(b`W^92ME
zOh`=JKi0l)C!GKWgFo$TCEAQ>eUzFiK1+h0Qsh~UjZh=)OYgevrY{?h91<rw(ss8$
zWn-*8kLYPKVJp`R3=Fag<r2<O<B{_u5-A@0)&WeyF?1)YDW<sm%WjU1xy#?jo>*?J
z%{eh62H^H}GYO~$%&QoC&`qRD_h`{kBAotn-Q1;GDf|&ybF4j8zG>m-=ZBzd>j*k|
zJl>&F!kcaHBW~4!4=~nraaR&89_p(af^DKg&P~oIbkv`Fj7Z(cbgO<Y6bj!uv?U$p
zK<)gC5;}bC%VOf<;#PhG44%lm#9L9iH2peWey6tubwl9ZVBN_1X(F>;B{Ljh1^qL%
z^33s)XfoL#lLo`@*^tYYB3VY%5tP0~ss@|QzP!q}wN-voDxOyqz5L4L<jo5N`@_si
z#?)5_x`o>jYXkzpwHqybc59gkPpur0E&UyW!<jlc+MJ&yPG{tsRk$}CYpTaLXkRQv
zBsf&f+>>;PB*gN;!NCH%e6Q$*jvB~8+>(^r5;SrJ4i4i!ifGXgMPI+}GQB-dsM7aD
zc|Sr!Y5tV&2WT_%rDXrXrf4w(;f!}>f8Z81zg|`<nkrsY62lqjhGfN;Rkd5<r5czR
zi^T$B><`^9DLISaQ{UGRT=He($12>fI{eOwNuLs@zaG1yevVuxbhpscv@bhg8_~ZY
z=)${lb$6)RYwvoplLW|T(%$&;ms?UUqklO@<%XIm2#du!=oD^WX8bDS&Enkv#^4Cm
zG+V(Ir92TN0f9iT3E23SLNGz_A8{&P4`d>RC$2dW&>=neR&lWvHwq+|_~IOC!=&(t
zfizDR?*LGirt(wnaMWbgXiP8`OKbe>@7{oU&!)jJkN;@rt$0KijUG`b6o_lPr9?P*
z+4xoG>Vh4P1BLoWXJmjqQNf|1?>9E?o}rr1;kdTohv<gZzCOR|KoFl?nV1&)Zhf;q
zlv@_S&7%e}k>4(g&Ze9K1#Kcao$12`A8Xs|v%6NW{OICbAo2MIeF?`v`i(wj77kHt
z%;hp2^ZKgWw$#G0JG(o%9uPOMuUP@`e}~O?H52Q&*!jX`xhg6FKAr&{Ot;9ae*h$#
BnneHr

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonCommand_default_10.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonCommand_default_10.png
deleted file mode 100644
index 1129213c4f809f88a48c7cf56684d090b748143d..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1345
zcmb7^`#aMM0LH&0*^VUSItqJcPaHEek(5ocT5`>8Y`Gn`SY$1mB^;+_qohT1IXLG?
zZbwK@Aw^b}$>UOVTt;)5T;_6&S<cRXaLx~(_x<ht<$a&`j)(i%{a}4C008^3ZZ2MO
z&zA#NQI@N&?ZBwqKqR+-BmhwB`WJ-<=4u82ptOc{arU7UEpjfnnPRoLy8-M&#+D`-
znvtG(7tbR6H~w3Ur6yYaz`0>PNUJbEh=VzO(9l_xLfT{Gc*EKt0J9S3@ey)iov8In
zCF5!Qpm+}o{Nmwg26;eiT9qU0c_($oY`6K<haB2%6{*F9GLh<;N9dG!#oM3uf*9)H
z|3ObKA{YRm8lVq-eWv=XH}NeMZEc3+m$Kh^Dca!yS>^D#r6u~uO70@LQ$Xs7Y?Kj%
zC-pFfF<}C8Tw74fCj}El@a?yu1tld}Ulv`h3%fplE=a4HKrqUW6yi(@apkqO`$Ot=
zs(ct!8e9tv*E$+SwS2z!5GX;QIeu%eetdoD!Fd^@tYXS+Vr0abKsdZZKP6gNI3|r<
zba!nCtOe4ltId~?uZeegf8$p`qB$iDH(_P=7meZuRh!bAZyx>}*MA>jVbL)y?g(x8
z$~q6#P*GC68=-gWG$55qA6;ZeWTK5f@cC$VL{}&hu$wqHRLPBU1iGfLN@(p=`i9dz
zw<!9tQhJRAZ)J=2d1M6HbV^KtkY5@$H#gg_ooq7NupyZq*;vD%(h@GN)h>AI9*Dh(
z+!6PsN(FYq>r%UC{0Cp1@}Lb>RaLD>9*>91gR<X;>xMCVdwY@CJbx5tC~<v#{m(cQ
z?^#PrAru=I9-diTQt}iB>x5!MV`F3Oll1TS#S)p(;wOYWC=9FdWqh1p<-1Y6Nu^Sm
z$Zj^9y;>L0Tls2cW+rhs<@&c^gNv$tB{M;OP7(*72+*UP`i85Y=rk6qN5fVe-2$JP
zoh^eihTjGT1_A(w!wJMCCE0w4Y$V5B^7Sn%FGm|B(di}k2clZHJ!-mtvexUZgfk-j
zrU%6_i$g<0fFvhTW-~Z7WnzgyAg!#@8XFta!)^#h251XC`$~TuZ+}e`f}DQDFE9gW
zs=L{U!#&Tv95dw;Kyh~8F<mR{HzONIRvfp<@wVTmrW70eaVInsCMA-B*qyOaRw#<o
z-`{_W;+S*ILG~Lyg)!z`lKPbnU*7pE?X{^aXdLt?pMaFG?K)E-YWrYjW@~h5$hJZ%
zjRr9{Hzys3xWVpcb+=zz%oP_Ui$O<|0q<pPlVRntpz#yLlpp?>d@rlGtI6qA&gEtZ
z1eYO3MvBkpRm2p0_Pj`hw$dHkY4BH-7tCU@&hTTHQMQcL)kJ>_?apGpFi|*IN6<N-
zqoY$$Ts$;f4F_NH^J_*-hHV*%wo|?&Ek$2;HY}b@)hz(o61$&V&nJ3Bcf2^3y(yTQ
zSZ@tM;4O7r&z?2rS$A`}o`Hc+wyvNIU@(~NO^4#FiDiUn&OD2BoH;fYETK7J>X(7Z
zYYt^_@aX8Mx{8vAx3@Qmxs8JHtd*7JHzSkDtT??<SFW514mK=upRL%ECt2CsgG&20
zA1~T(4tDu}-{oazCOCN46|CdK;1au!8%@)>6ho~!j{q01h&h@M4)92ys5u=j)4#W(
z?X<f4_<SoGOom%}?Xwa>s1XIAopipL8LZu|OGU(f!!;F;mYpIPXPPu&4k{(X(QxR0
aU{}HS<*?%IjLu~FCj!_r?k;s`V){SMfpF>o

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonCommand_mouseClick_13.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonCommand_mouseClick_13.png
deleted file mode 100644
index 0688abbc617271223a85cd3ecc324689b0df4287..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1404
zcmb7^`7_%I7{<TWl`6r?5?58LN)vI0ajc{6)U~Z8DRHH0iK<c}OQ}@VYDlS;$`aLf
zRUL7xs>CMk7Ez4WQQ~TaTBKCsXxuhCvwy(u56}C&^Ugc-zCV2C`Nhx2T|rJm4gdfJ
zPY;)~VlNWQ03;)>P>Z2)u^o!{z$5|yxZ@v5+=GEN0YDnz>Eh&{^6N4+!|Pligu}j!
z$$ISU(S_Powo0NZEyQEU@LulOQGI+C-0iBRxlr+vo@syV{(wGMkAW;@RO=Qj?Beul
z$c53vO1J=*UCA8Gh#Y7qGe-q`MkQCeWr@OcnEs>vbo2_W_4u7N&yYbvf7^Un>e{t=
z)+nh1iaQE&YB%{Pt#teFw-8;(|4@<IJQDzZ5^lU68o9}+DKmf>zC6+^Q*;l~N5Dio
znb}S^VFYs{qS@`?rKxu1@1Dp&N9lX)9;$h%)caX&#{uJk>SnlwO<+YtzO=>f+q^j8
zY&Sxsf9XI9h=1~kkdIMA#55+Y+rMPeXihuTs3J)1j7CP~qAJh<vMe{k#$P5LA?Q5E
zS(lh+@X>M<9DvLmHvYmEL2X&lj?1hB2p#hqR}D`X%!OB04P>-&wCpDOBG0I$k>s-c
zRQfu7sb>CNaEtTB(+yUItDV$w#+B}vj#Jls{(PYt>Tt?8lyo7vVs-t*uF&N1re3q;
z$<jDp@Y*Ghi?SN$_W=DB)L4}p-p*vqw6}&IwK=z@8p@t2UaRJyF3R@Q@Of+zdT2X%
zalsYiDUln}d%G>9eXE<6=_&DsHaiBeklq$_Ot{@7v0E^E_rceUYz&X^x|Rxi;}zCq
zUR-4qP8PMYp<c<BP-r;WG?|x8d37O**BFJ$Z=$D%iJQLBgB<ZF)famqvjC(iPc|u8
zs@?k%)`x8A=tY`z6{U<R-YpYvu=d?eTYA#Bc17%4>Nqksj!lj4Pq5#(!pk<kSU<$^
zX%%(|YNIQOCrEVXMRPwWxiX6JJ=B$AFL^U<-20GkkXo?i?ZHm_4-H^I@R{a}>XW@(
z=k^?NZp<<?bl+^<+Sm}6?asj^#N-w0<j!sGWGZ*gH(?-5t&@~ud`4m<0$|lmMmAr^
z5=dCWv9v~wf+`g*u~zw&06o~){_kyHKVsX{ky{N@nm?)^=l)gxlIM*HHk@fBthr@z
z%1@H3nd9n-<#oNoY1&D)qZ$r2`&tTh>5*rou0MRIQZF3BkD{I<R8rxZVtUl3MDv0M
zn>_!~qA2Y)ogP^2)>E*&W5T+(wl3rdI*)JnLH<g@eU13xsY1aQ>Wb{uoh|$eViX|8
zwBfUlH*TK!b<86Qn?~YmkUlNk;M}4A+#3WAUbu19%pwu?spCbu5g3!l-CKT}q9iX_
zvIOGO6~M7XMcKEOu>I@+haQxipkEVqw*8qUzdrdGp&DGXZe40y_8zTujyXbicH_`y
z#Vkd#5L9Wa6?p@z>DaBAq-!lkW%$xyzf7gvNykU#I(afJ$0gs(t`1zvspu}-rhX{E
z>Z9{Ixq+$bg<}%pm)}Jqe%S5W!1KOm1qnryij~QsL{w1dsZIXZ*BL9OVhn|`q=OA@
zz<#d*Dn3O|PnN$|WgI@$6IhsE@UcrwwJint4Zu2xINX%<fV(v?VGz<RPn=+tBWa?|
zIIX1CiuPye0YNsS{t<BD!5ne&Zkb_#S4`zo>n#x1v~`(+*3w(_Q%+$t`I**~07oT*
z6s}j<%2Ak#6AYL8?r@93WCH{v`)FruYDD^dUDYEIQb^a;<pT85I~rZ-wDR~v5Xt7h
cB~Q@-Ff=gHSCte{E{;>c)78hN{&X1WZww2J4*&oF

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonCommand_mouseDown_11.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonCommand_mouseDown_11.png
deleted file mode 100644
index 0688abbc617271223a85cd3ecc324689b0df4287..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1404
zcmb7^`7_%I7{<TWl`6r?5?58LN)vI0ajc{6)U~Z8DRHH0iK<c}OQ}@VYDlS;$`aLf
zRUL7xs>CMk7Ez4WQQ~TaTBKCsXxuhCvwy(u56}C&^Ugc-zCV2C`Nhx2T|rJm4gdfJ
zPY;)~VlNWQ03;)>P>Z2)u^o!{z$5|yxZ@v5+=GEN0YDnz>Eh&{^6N4+!|Pligu}j!
z$$ISU(S_Powo0NZEyQEU@LulOQGI+C-0iBRxlr+vo@syV{(wGMkAW;@RO=Qj?Beul
z$c53vO1J=*UCA8Gh#Y7qGe-q`MkQCeWr@OcnEs>vbo2_W_4u7N&yYbvf7^Un>e{t=
z)+nh1iaQE&YB%{Pt#teFw-8;(|4@<IJQDzZ5^lU68o9}+DKmf>zC6+^Q*;l~N5Dio
znb}S^VFYs{qS@`?rKxu1@1Dp&N9lX)9;$h%)caX&#{uJk>SnlwO<+YtzO=>f+q^j8
zY&Sxsf9XI9h=1~kkdIMA#55+Y+rMPeXihuTs3J)1j7CP~qAJh<vMe{k#$P5LA?Q5E
zS(lh+@X>M<9DvLmHvYmEL2X&lj?1hB2p#hqR}D`X%!OB04P>-&wCpDOBG0I$k>s-c
zRQfu7sb>CNaEtTB(+yUItDV$w#+B}vj#Jls{(PYt>Tt?8lyo7vVs-t*uF&N1re3q;
z$<jDp@Y*Ghi?SN$_W=DB)L4}p-p*vqw6}&IwK=z@8p@t2UaRJyF3R@Q@Of+zdT2X%
zalsYiDUln}d%G>9eXE<6=_&DsHaiBeklq$_Ot{@7v0E^E_rceUYz&X^x|Rxi;}zCq
zUR-4qP8PMYp<c<BP-r;WG?|x8d37O**BFJ$Z=$D%iJQLBgB<ZF)famqvjC(iPc|u8
zs@?k%)`x8A=tY`z6{U<R-YpYvu=d?eTYA#Bc17%4>Nqksj!lj4Pq5#(!pk<kSU<$^
zX%%(|YNIQOCrEVXMRPwWxiX6JJ=B$AFL^U<-20GkkXo?i?ZHm_4-H^I@R{a}>XW@(
z=k^?NZp<<?bl+^<+Sm}6?asj^#N-w0<j!sGWGZ*gH(?-5t&@~ud`4m<0$|lmMmAr^
z5=dCWv9v~wf+`g*u~zw&06o~){_kyHKVsX{ky{N@nm?)^=l)gxlIM*HHk@fBthr@z
z%1@H3nd9n-<#oNoY1&D)qZ$r2`&tTh>5*rou0MRIQZF3BkD{I<R8rxZVtUl3MDv0M
zn>_!~qA2Y)ogP^2)>E*&W5T+(wl3rdI*)JnLH<g@eU13xsY1aQ>Wb{uoh|$eViX|8
zwBfUlH*TK!b<86Qn?~YmkUlNk;M}4A+#3WAUbu19%pwu?spCbu5g3!l-CKT}q9iX_
zvIOGO6~M7XMcKEOu>I@+haQxipkEVqw*8qUzdrdGp&DGXZe40y_8zTujyXbicH_`y
z#Vkd#5L9Wa6?p@z>DaBAq-!lkW%$xyzf7gvNykU#I(afJ$0gs(t`1zvspu}-rhX{E
z>Z9{Ixq+$bg<}%pm)}Jqe%S5W!1KOm1qnryij~QsL{w1dsZIXZ*BL9OVhn|`q=OA@
zz<#d*Dn3O|PnN$|WgI@$6IhsE@UcrwwJint4Zu2xINX%<fV(v?VGz<RPn=+tBWa?|
zIIX1CiuPye0YNsS{t<BD!5ne&Zkb_#S4`zo>n#x1v~`(+*3w(_Q%+$t`I**~07oT*
z6s}j<%2Ak#6AYL8?r@93WCH{v`)FruYDD^dUDYEIQb^a;<pT85I~rZ-wDR~v5Xt7h
cB~Q@-Ff=gHSCte{E{;>c)78hN{&X1WZww2J4*&oF

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonCommand_mouseMove_12.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonCommand_mouseMove_12.png
deleted file mode 100644
index 0688abbc617271223a85cd3ecc324689b0df4287..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1404
zcmb7^`7_%I7{<TWl`6r?5?58LN)vI0ajc{6)U~Z8DRHH0iK<c}OQ}@VYDlS;$`aLf
zRUL7xs>CMk7Ez4WQQ~TaTBKCsXxuhCvwy(u56}C&^Ugc-zCV2C`Nhx2T|rJm4gdfJ
zPY;)~VlNWQ03;)>P>Z2)u^o!{z$5|yxZ@v5+=GEN0YDnz>Eh&{^6N4+!|Pligu}j!
z$$ISU(S_Powo0NZEyQEU@LulOQGI+C-0iBRxlr+vo@syV{(wGMkAW;@RO=Qj?Beul
z$c53vO1J=*UCA8Gh#Y7qGe-q`MkQCeWr@OcnEs>vbo2_W_4u7N&yYbvf7^Un>e{t=
z)+nh1iaQE&YB%{Pt#teFw-8;(|4@<IJQDzZ5^lU68o9}+DKmf>zC6+^Q*;l~N5Dio
znb}S^VFYs{qS@`?rKxu1@1Dp&N9lX)9;$h%)caX&#{uJk>SnlwO<+YtzO=>f+q^j8
zY&Sxsf9XI9h=1~kkdIMA#55+Y+rMPeXihuTs3J)1j7CP~qAJh<vMe{k#$P5LA?Q5E
zS(lh+@X>M<9DvLmHvYmEL2X&lj?1hB2p#hqR}D`X%!OB04P>-&wCpDOBG0I$k>s-c
zRQfu7sb>CNaEtTB(+yUItDV$w#+B}vj#Jls{(PYt>Tt?8lyo7vVs-t*uF&N1re3q;
z$<jDp@Y*Ghi?SN$_W=DB)L4}p-p*vqw6}&IwK=z@8p@t2UaRJyF3R@Q@Of+zdT2X%
zalsYiDUln}d%G>9eXE<6=_&DsHaiBeklq$_Ot{@7v0E^E_rceUYz&X^x|Rxi;}zCq
zUR-4qP8PMYp<c<BP-r;WG?|x8d37O**BFJ$Z=$D%iJQLBgB<ZF)famqvjC(iPc|u8
zs@?k%)`x8A=tY`z6{U<R-YpYvu=d?eTYA#Bc17%4>Nqksj!lj4Pq5#(!pk<kSU<$^
zX%%(|YNIQOCrEVXMRPwWxiX6JJ=B$AFL^U<-20GkkXo?i?ZHm_4-H^I@R{a}>XW@(
z=k^?NZp<<?bl+^<+Sm}6?asj^#N-w0<j!sGWGZ*gH(?-5t&@~ud`4m<0$|lmMmAr^
z5=dCWv9v~wf+`g*u~zw&06o~){_kyHKVsX{ky{N@nm?)^=l)gxlIM*HHk@fBthr@z
z%1@H3nd9n-<#oNoY1&D)qZ$r2`&tTh>5*rou0MRIQZF3BkD{I<R8rxZVtUl3MDv0M
zn>_!~qA2Y)ogP^2)>E*&W5T+(wl3rdI*)JnLH<g@eU13xsY1aQ>Wb{uoh|$eViX|8
zwBfUlH*TK!b<86Qn?~YmkUlNk;M}4A+#3WAUbu19%pwu?spCbu5g3!l-CKT}q9iX_
zvIOGO6~M7XMcKEOu>I@+haQxipkEVqw*8qUzdrdGp&DGXZe40y_8zTujyXbicH_`y
z#Vkd#5L9Wa6?p@z>DaBAq-!lkW%$xyzf7gvNykU#I(afJ$0gs(t`1zvspu}-rhX{E
z>Z9{Ixq+$bg<}%pm)}Jqe%S5W!1KOm1qnryij~QsL{w1dsZIXZ*BL9OVhn|`q=OA@
zz<#d*Dn3O|PnN$|WgI@$6IhsE@UcrwwJint4Zu2xINX%<fV(v?VGz<RPn=+tBWa?|
zIIX1CiuPye0YNsS{t<BD!5ne&Zkb_#S4`zo>n#x1v~`(+*3w(_Q%+$t`I**~07oT*
z6s}j<%2Ak#6AYL8?r@93WCH{v`)FruYDD^dUDYEIQb^a;<pT85I~rZ-wDR~v5Xt7h
cB~Q@-Ff=gHSCte{E{;>c)78hN{&X1WZww2J4*&oF

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonCompoundDisabled_default_19.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonCompoundDisabled_default_19.png
deleted file mode 100644
index d2b6513b6a8ef94ea5e3e9322de649f15b4c3f0a..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 2327
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
HM2PzrYjaWz

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonCompound_default_15.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonCompound_default_15.png
deleted file mode 100644
index a0baba958f22034963c352304f3aa0d8c6e1cceb..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 2420
zcmb_ec{J4T8vl;`5M#-;S4b1W*h6+2B72K%#=b9MGDeKCWveVTDovE42!lq9tw{)#
zWF})LYVMDer5a<%GWXj#_uN14ANSn%JnwSe_j#W8oM-tw&sA6F)53ysf&c&r+uI?|
z0suq?JlhHIfh#=m+c3E8kF)cN2LO@Re<tL%y2wHBPT3w|b^dbM%B-8+xfKQeA8XrO
z?h!5hVvUM?Yr%uD{x;GSp%eS9vla6)>^$CCB5qVF3TH__vAWesd#!m$BvW%CQ_S%2
zYG7|(#20a5<@<_IWmR6Z+S0;~mhXoMq{%eH%zJD170qn1Y>s7ms_Q}g)Pp@jh!^C*
zO@KSO0uiH^Ux%DR^l1C%*~#!h5A5$vKcW;Mqm6(;_vPee1-ufwsSTA;63_V`nX>pD
z6~!#0qSP<N$KNb1y}r5{L-*M`%Sfu8sxnW;;m8yUrS~XI{B-!MHk2k~Y>Wq(i7^D}
z7mH<s-9lbND8+ToKJ(OQ!*65z2ZV)%AGNfcxHyg7+)drw-D{(`s%DYNWD?sdt)UCC
z+hxaMvDz?8;>O0tw8_ci71!r7lQ)zGFHK#n*%)fx2#tEoS{hNoBqsJowkWBn@B@nW
z;#1Sp==HC3()v%6pWC}e*ku{#a&zkRsV%sG$(5vE|J)BeY-rH@J9T7aWa`+hx53tm
zVl+xki3s?WHqj9zPbBin0F%Cvw)>myvVFSJtv)n1cCBjLfn!QZjf#qz32|DUSXf-t
zOQkZBJnP5u`-@3tqZ4|>#HJ)k35ofsmZ&_05|DoTw&cz(XAY-}0{nx6gIjZdAP-1s
zC$7#wfHLERGl}Jvis`krY7)}YN5!u`?C6kdX=y=Q>;ON0{q3M{XxPjA`LMlR)~_oy
zdwL~jfZ4sf%}J~M&f21ljpe+2Y3`{Z)rM+tVwV(p&wY;bkBbu%l{ck*D|J-HU@#A>
ztNHcx^khc|hlcvv;}-#-M9c5PR~fdn@2)Q%MyX-G3;vYMQiH?$dUHiVlV@<&<|<#j
zK$$4ZK&=U|i4`n~L<(Oazyi={H%=1CRh8GC09yAG6~_<A96UHO6{tmr*;^YO%9&f^
zMj(|Fj@etQN@UK)jBhx&t9x+?FbKfM$Je~ZE-ZRtSmL>~aC>6)QoEQ)F0;^sOUt%C
zvJ#d${<evfcNuU69?w*h$!?H`;HRoh8tUK>1fEn?DMu6xnR`q#k|$TS$Z&FM$GFw3
z)K$bSX)Rw>JRUCy^etgRLrjtQ`^7B<g@tP7<t{p<L+^h7?ob+R`oh|h$nAafriql*
z8_*YRpk7y3cTHpP+GMo5^`jfulrQmYos%bPj1Gy^hkgl4NVxDvw9cck**LO1cJ5`t
z^c{Pj=aVF;sA$wM-n{&eI<GsDphib0rza~GSox(wmka7>R5I(#*Z_lZ%RrRfQeIYe
zKG@4WCpY(8VUUUf_aC>A;nC5r=jRp2#>V2l(jGnDhKh*r02^y_3Y<~q&)@`&NHhBG
zv9V#sPv!t*2S*wI_>m{KH{;&Dd!+p1lWi2;wT~aq{)zBl-3U%#nX?M`0stz`WdM+}
zvxz>(Q3(wTbMy6W7(M^CDW6D`)qukxz{`{^aYHF!YWTu31(T4m`8=|EM3&R??3wmO
zE_uCh7^6vEU${*wx-PBN6VqA=2A`0S5E%P+@89p+VlC?E=wviBG(5&H>j#wBjW_!7
z1Nnu8-&QO4#PNGOCs(6_f`Z)pZ+N<3(yp>w)uth(1xeBp5+D@Ho8BEI_dQq`kW)}N
z?d&Y_?fduV-iAcbl@rkhAf0!2kLlnB4-8DLq6lmdLxd{nd3}90j*gC?^PyW?TLQVg
z+HwUQu>}(mJv>zv6+DLz9}bU*u!@b<;>iGbGAw7D#upYsf%M+bmilsi%z+}vjzD$&
zrFK-FZDpL%AvF6Vdz?;(%+KMZknK4qh>mEsUj2arTaa}0^?Bz9{Aw{ww<|%($#NhD
zbX=_P4J&?|)!u#*psk{xh6UMH9#Ak(0n*!WddVjY3=F<Zm7C#mUc4|(+1|K_400fq
z7VLGUabMP?B8K|>wf+750mIl&j0e*zSQ%&zoP9Kt#_7gju|1#T=9fmQpVrsgq@`K>
z`t_@MMN(1{#J|g|1z{-PzJ-N_d2FYfn;W@4)#1z;Fs=En_wiJZ)Qmce`}z1Bj*N_?
z&CL}N2m~h%j@d8lS?><!{QCNOxM9qQjtmsdbUURqd)e5;gg!Bm2O^1S^15BC6XQF|
z-94wL$J&mNwK!Z}Nu~O9!gS;cJiWcIbrNemDxW?Tkh=aC0TvO!pwWQN*+Mp(4KIRw
z%_72vAJ_y09MO<+m??;)?v>uV=ifTrlC*SKA*wT;{{0kH1Foia4cCymD=C0ecpvj-
z1812Rj@$Ht{kx<HY=?cDedTbp!cS=Uzm=f7yftI+BNaoF#SkWETUH5S;_t!-Eir>l
z$#PpfHMn`IrUnK%85xkvRNv+4R#6p~2Mh`b88cLzv~Qzy*oU(2jD7rPDg0Ngz?jm|
z(qg{3d2~vp3B({YnoO~^UyipYxSl_sm7V?9`o>0NkZXx?8IhPV{=ILs&V$*%!cKPc
z_WnJBR_mJMp6i6!8>MV&o63u7qS_vID$sq8E<>xpoG>UA_VMwNk(H&J2g(a(KWlF0
zts50A9jd}NqZ-X*pn*wAvLKH~1FD;f<LK_$S;EAvLPCzk%yv8}=nj1j*(9gC)G|R2
zG5h7Ad^d}W_mvLifaY$qDRB4jpwnnKuoe|m#6;N5^*j3+$ak)dc#}ch(5B|VS|;Pd
z%vre4(|5tLwiQ%c&sX_HMSoleN`v*&8)tN=5P93&XS=bgrsjBM+#trH!h-nB0Y(ks
zVc+38jEh9$z50U#OU&Lguq6SQcGON|K!giefRYD!zrjQ9*5W${b(PPcHnh(XHHzAZ
zyLo$<GzNi)SdW@4Ub}Ln;(qu4w|DqY7qVp$><c$`xpadAwo!n+jWeRb+CTGO84QYA

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonCompound_mouseClick_16.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonCompound_mouseClick_16.png
deleted file mode 100644
index a0baba958f22034963c352304f3aa0d8c6e1cceb..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 2420
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

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonCompound_mouseDown_17.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonCompound_mouseDown_17.png
deleted file mode 100644
index deeb140e9ba5d1c2f365dcb27805442a1637ac5e..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 2249
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

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonCompound_mouseMove_18.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonCompound_mouseMove_18.png
deleted file mode 100644
index deeb140e9ba5d1c2f365dcb27805442a1637ac5e..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 2249
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

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonContextualMenu_default_24.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonContextualMenu_default_24.png
deleted file mode 100644
index eea359ea2afa9d6d94a787d507692a192aea015c..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1936
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

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonContextual_default_20.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonContextual_default_20.png
deleted file mode 100644
index 275b8cc14271877f7955c509b5569932b64d83d5..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 799
zcmV+)1K|9LP)<h;3K|Lk000e1NJLTq0046U001Be1^@s6Az4Si00009a7bBm000ie
z000ie0hKEb8vp<T(Md!>RA_<in!iiqP#nNN9*2ulC+QHlii3iaAcQz1pp#VkA4raF
zZWSC{EbY=kXg4?UA$1U^sH4TWJe&e<B4{Wbq|S=t-Ee21*VbRx=FGeI8Q=H&UcTXz
z_k9Uu<l*7r2O1^#@~;cf3=S<*A+$_|&@vT5%Tx$0Qz5iWh0rn;Ld#T$#L2X68{4*N
zG#Y(l|0}V|426p;!hx(+E|+Py+XGok6%w~IpIKR1;pF7xUzhQzNUY3kHp|}L9zhVi
zm=^>A8yg$gwjIf@R;yI2)hMUcYIU{lgM)*PoFtG~nd9T*R4Nq?4-a{KeC(MM1ObIY
zf#v08YPA|$TU#_54NTL-^So$YtJMPF^71m8yS=@QX_~Lr5ek9-uF8GHfR36!Nvuo&
z%d!ACJ3H$c_kBOgo1L8n;PmvA>FH?zn$0Ev7Z(>)DwRm^^I80y*PoCkA;K=cQK(PR
z7Qbf=p07h#Ggk8XJo$W{xw*NnnCE!_9dEc&N>Zs5xm=Fh+gsA<G@j?Nwzh_4S=`;-
zaeseLE|(*fO1*OR431mEu?4POg!2+k-`rm!GeY2IK60n8lX#hvlas8juCl+s-xaeg
z3n?Y_dY#eH(T<pDnj9Y=Gchs2`uaKm^YimuU0u;`x8KxaBQh>Ryd-q^B4H>peTpx(
z9T$7I*SJIJ#V5Nz*=&}jrKPU%#l=OWlw4n5Gcz;8&CN~JnhnE1N{N(`ot+&3rlzJi
zIy%DhJnHrO`-<o*G#-&K6qydC^YfmOP`H#RA_ja{V`F2~YBdUlLdW>R!U9iEPn64L
z05&%_qnKeB(aue$(*RM+wJZz6Fy3ECm(ch`0*u7@574k=emX*d>+TYg;d@LXL4h;#
zQ<8BJ;u}5=PK?j3mN_gk&WFzbzai1znVL?tOofQ`1xPbo^v+ZWEmI-1Ooh-g6++8Y
d2rW|~egc523?N930@(ln002ovPDHLkV1fyYaa#ZY

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonContextual_mouseClick_21.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonContextual_mouseClick_21.png
deleted file mode 100644
index 6ea81a22eb777a2ae26a6197ea0b2da13efb0114..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 834
zcmV-I1HJr-P)<h;3K|Lk000e1NJLTq0046U001Be1^@s6Az4Si00009a7bBm000ie
z000ie0hKEb8vp<T^hrcPRA_<in!iiqP#nNNJq{PAPSPQ86$b?;K?re3Kqsm6Kad>V
z+$uP@SlXq7&~9#W52=GVMI9~1B{&7#M9@$=NSzhO-f-7ouRrzLXrB3OdEf6#zu}Yj
zeF;tM>FKG71T>q?j^kJ?HgMiBIbq@ZM;9<EUP~E9q)ZZ9NF(z#y~GZ?TEoh>k1k-`
zyp|`kNcaLWzY>v5iHKxML?lxpBAF5q$&`rD$<%cnUDv5rt36|1l|W^B!o(EbNX}I#
z6lgRWBRQ8Wgl=WFSYKb~?Ck8L%lK4;R%R-d;^5!_*LC~mxvtCh_BOh%`|?Yr5~Whf
z&#Bkz9j*K5=%_6x41`wZ)YKHkVv*zHW1gR%yXLsAOE#NjZEcNmxy<hFF4bxkRaLPp
z%b!=T*8#Y`zV_$t?d_qe>cBcYA+X<6xs4dnR`V~Rl?k9}8UPm;7hU7FZToo(3kv|8
zpPw@~HwQqiRs-Pb>WX5q=nHP`#jU*Fc+~I^dTvOeHaT7Voi%zw|F20VlOdDIu(-I`
z5wk1{pzR6QaUA0DIO%kn`}=zmi3FBqvAMa4rfEDpJn;DVNIIP+9*+<B^(2Ow$Iu0)
zo`cIgM$g<oB9lU3Cf{?Vg9*LNnVA_jHa0jsJnV>Rnug;zR4NrFCMMcqs;Y8&ddl?l
zG+SF+04yynadUG+qtO_u#rh;ogy<)9{32m2GHr5w+m4C;tJ}CizVDsgn^Y>r>gsC8
z_{z!(j^l89d&~U%Ja>0@err|~1;=r49Ebh=eE?=>XE`}J!LlqWmCD<S=qWT9kuVmS
z2Kmd&t`Sd|<jEmMd{vW^la$M4ve|6g`10~HFE1|?3Izamc6R)jqA32#O(YTke#_M~
z4MkDjUPy<~;6wt%g8T+(Trxi$p1?GJ;gRHLKq5hcJ@ZqNG!fzlHU>t3_iZF|TqKQm
z?f?HnsNXXq+KFUJM4%5q5#uFVnGzAnl!!>CL_{(rB9bW)kxYsB4Jb4lGe%=*5&!@I
M07*qoM6N<$f`=J_OaK4?

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonContextual_mouseDown_22.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonContextual_mouseDown_22.png
deleted file mode 100644
index 2fc1a35bf5f4217e75b6c622eebc116b0679e859..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 807
zcmV+?1K9kDP)<h;3K|Lk000e1NJLTq0046U001Be1^@s6Az4Si00009a7bBm000ie
z000ie0hKEb8vp<T*-1n}RA_<inlVW0Kp22O9}nD|N+vs12-r~^9I^$o6{KsWOCh@@
z;MhGVxCoUFhIFmLYz4vLz;134f_74u;#Az<8=j5!S+zdWYVO^)CI5eyyL|cYuF!?S
zVDJlt6#V$=0VvW#$&?5sQzDd1iBK{nLdlc}B~v1lOo>o3B_eY&HBCd)G=d;_GxonS
zSDCSEV7PHAec86n-Q8U(eaS-RDs#ln&JOK%`>TiXt;np*N~Oa7{ysv8ck_f0Y;SL)
zX&S!o1K>Cgj^iXb{eJ(|(tUV%IF^$IGAna=c^TjLIXXIGI2=yQ5kgQdm#I`LbUGdC
z^*TWiV45bL=OyiKZf*d$xVT8#HX02~)BJE8vFj3kYUCkqN?Xm}WL74CWmy26o}NyO
zhhdoH8HNGC$;k<8Yij^pUta@oc6NsE`-$MuUOdWso0ymwSF24aG^D1vPp#4?(=q{e
zcXz4R>k|({p63DMr`&G0OD>nATCH+*b;ZNO1D@w$Sr(RMaeI496h&04RdTu92T#{2
zIW2_Hrx5x_q%H(4r-c4bvwfeRGw5@!6pKX~jRpq?2d`q5Wzp?+>GgUnE-sG6Ow**@
zZnL_&%HG}{0GpeeTwY#se}6yK5}Tkq2;pLAH5jxgy-Ii%>CD376AS78(;%ca^|JGl
z60M0ZVw_Qh4F-ec-f%c%Wo0F~9>sznz_x9g%_i&X>qJqMEY1CXpN)+T0M5_PDHe-F
zQN;1_F`nnq>-8uU3ZI)o>|z)(&e%NWBNAp(nI&2;Ui3?1*PuoVk@BpTmX_#rI+V-h
zvHM$FTRc8KV%s(V&1N%+6$*u<a`X8-0Qr1AS#m!u5++pW{6xY`D)Vh-CG*=6yBLN`
zjE*xWks!gI`7O~MgwP2oQJUj-t7Og!z4YP!pEjBQX`*;W$&`q>9)J|HMOCImD47zW
lWJ-jRDG^GhL@1dO@f)xP79}Z9u)zQT002ovPDHLkV1o82Z5RLm

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonContextual_mouseMove_23.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonContextual_mouseMove_23.png
deleted file mode 100644
index 2fc1a35bf5f4217e75b6c622eebc116b0679e859..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 807
zcmV+?1K9kDP)<h;3K|Lk000e1NJLTq0046U001Be1^@s6Az4Si00009a7bBm000ie
z000ie0hKEb8vp<T*-1n}RA_<inlVW0Kp22O9}nD|N+vs12-r~^9I^$o6{KsWOCh@@
z;MhGVxCoUFhIFmLYz4vLz;134f_74u;#Az<8=j5!S+zdWYVO^)CI5eyyL|cYuF!?S
zVDJlt6#V$=0VvW#$&?5sQzDd1iBK{nLdlc}B~v1lOo>o3B_eY&HBCd)G=d;_GxonS
zSDCSEV7PHAec86n-Q8U(eaS-RDs#ln&JOK%`>TiXt;np*N~Oa7{ysv8ck_f0Y;SL)
zX&S!o1K>Cgj^iXb{eJ(|(tUV%IF^$IGAna=c^TjLIXXIGI2=yQ5kgQdm#I`LbUGdC
z^*TWiV45bL=OyiKZf*d$xVT8#HX02~)BJE8vFj3kYUCkqN?Xm}WL74CWmy26o}NyO
zhhdoH8HNGC$;k<8Yij^pUta@oc6NsE`-$MuUOdWso0ymwSF24aG^D1vPp#4?(=q{e
zcXz4R>k|({p63DMr`&G0OD>nATCH+*b;ZNO1D@w$Sr(RMaeI496h&04RdTu92T#{2
zIW2_Hrx5x_q%H(4r-c4bvwfeRGw5@!6pKX~jRpq?2d`q5Wzp?+>GgUnE-sG6Ow**@
zZnL_&%HG}{0GpeeTwY#se}6yK5}Tkq2;pLAH5jxgy-Ii%>CD376AS78(;%ca^|JGl
z60M0ZVw_Qh4F-ec-f%c%Wo0F~9>sznz_x9g%_i&X>qJqMEY1CXpN)+T0M5_PDHe-F
zQN;1_F`nnq>-8uU3ZI)o>|z)(&e%NWBNAp(nI&2;Ui3?1*PuoVk@BpTmX_#rI+V-h
zvHM$FTRc8KV%s(V&1N%+6$*u<a`X8-0Qr1AS#m!u5++pW{6xY`D)Vh-CG*=6yBLN`
zjE*xWks!gI`7O~MgwP2oQJUj-t7Og!z4YP!pEjBQX`*;W$&`q>9)J|HMOCImD47zW
lWJ-jRDG^GhL@1dO@f)xP79}Z9u)zQT002ovPDHLkV1o82Z5RLm

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonDefault_default_0.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonDefault_default_0.png
deleted file mode 100644
index 7ccc89e7437acce2bcda25ef468e2b2c6c0ccd0d..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1090
zcmeAS@N?(olHy`uVBq!ia0vp^bAVWZgAGVN-yrA=q&N#aB8wRq_>O=u<5X=vX$A)7
zFP<)rAr*7p&bIe>9V2mU{_n!VmroRAmmFqQ7o1X--5#PPyX4Z!Sdo<}t0s$Dm8^X6
zDB#6SE<Q)iSRY4@G9l)|lS(N%8lvolFP<d5{88)d>5;u?<+9_^`@gd<J^Azd9`)Ku
z-{&~g@7=fWA9vG(Blh=Y89x4R;&Cr%#e<)IFK0K<Yf|8u>%KT}&6+g|LY)bTi3dMh
z%=KfRq~dtJ^v<0-KZGt@JnlJ{TwX4IGDT?f=FRb4PxISf3%~oQ(|+gXV*O;pV+SOh
z)g~YO{Mpzgutmjl-tXCI*(Or^jwCO?nzb-$ZB>@`X(Nf`6<4z?Y;FHeI%cu!{?RMT
zt`u10)PDQ^Jy1t1aQ*c}iMHkccCBM(a9TLw{l-u&QH`!gD{~DbTr6bR7|z$;F*$be
zuimn21&fa)88S31%M6>DD4{XcOMr!OZP;n8?aPgSZ(Ox1?044IuIbaoSD($8e{sqS
zvu)AV*8cwf3~ZTK*RKD2XXPK;yJfq3v$k?M3Iu3PZOil8oV)$@)>}88zcaT#R`BfB
z@jZum4?8RjIB@J38_>NWS^=S=2NZf|-su1R*Y4Z5ZwDlr7ilCfwOIZ!B~s3++)02X
zCpVXoL22TN<)(K^fLiV5AOG{mCMD8MN6dL)K*eOvy!`x)J9l;#?c{L{EGR5|s5!0h
zr(v7)(V9!HivzV&W8>qQC6*Wp|1Q*;`m3a?SV~`lhi|U6;%OtPUbe2IN-lw0g8uH1
z%G>p<)ZqEHUAwp#GR$T>C(ruY>B7Viu>QJz&tv015{G-2sb1Fk_T|&P{+qAAE?A{?
z?)-V%rH=bK*qS+7ojjHXF*KY$?HzyIe7&=RfW)tFNpCz2O4qyI*|BRElR?FznfIUR
zm87LTJN!>wT|GdAwbzY#WeC^n*RO?puk-HjO^9ocTi@=W&=9wtoxx-I<$bRzQkmK=
z7bwU$6t6w+SP&z1w6LPMV~4xwZz-3{CK_E#o|D$ZKEHKKswDRK-@mrgrcL|s;X}gA
zi=5TJ_Uzs*z3TS8d)vwm#ED&g)_*5&J0nAPclWy7-FNjG4gzykUw^-Crd6iJ)KnwM
z7rXkxR<~Bz<h?xd_#^*wLr%4X9Tt4CaSe9!o)&a4&w2W<CUR+j27|<%m8VaizH#%W
zWL4%Y50wk=zZaI2urO#$KmEQ>-BU=#(`jv3vqqP5DKPm0)AiZ3&%Seo7ilEr<?;Qj
zk$YM4EB0{e=E!Wh9>eUvKPE1l+!h=OOm)dTvz95&KD+PY!?XJH{%3x;TyUi1Q?eQF
wkrIbC<sD8?e5mxYgTR*-gaAweM1PXkRoZ7#`qca$uux#|boFyt=akR{0Qfrh>;M1&

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonDefault_mouseClick_1.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonDefault_mouseClick_1.png
deleted file mode 100644
index 7ccc89e7437acce2bcda25ef468e2b2c6c0ccd0d..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1090
zcmeAS@N?(olHy`uVBq!ia0vp^bAVWZgAGVN-yrA=q&N#aB8wRq_>O=u<5X=vX$A)7
zFP<)rAr*7p&bIe>9V2mU{_n!VmroRAmmFqQ7o1X--5#PPyX4Z!Sdo<}t0s$Dm8^X6
zDB#6SE<Q)iSRY4@G9l)|lS(N%8lvolFP<d5{88)d>5;u?<+9_^`@gd<J^Azd9`)Ku
z-{&~g@7=fWA9vG(Blh=Y89x4R;&Cr%#e<)IFK0K<Yf|8u>%KT}&6+g|LY)bTi3dMh
z%=KfRq~dtJ^v<0-KZGt@JnlJ{TwX4IGDT?f=FRb4PxISf3%~oQ(|+gXV*O;pV+SOh
z)g~YO{Mpzgutmjl-tXCI*(Or^jwCO?nzb-$ZB>@`X(Nf`6<4z?Y;FHeI%cu!{?RMT
zt`u10)PDQ^Jy1t1aQ*c}iMHkccCBM(a9TLw{l-u&QH`!gD{~DbTr6bR7|z$;F*$be
zuimn21&fa)88S31%M6>DD4{XcOMr!OZP;n8?aPgSZ(Ox1?044IuIbaoSD($8e{sqS
zvu)AV*8cwf3~ZTK*RKD2XXPK;yJfq3v$k?M3Iu3PZOil8oV)$@)>}88zcaT#R`BfB
z@jZum4?8RjIB@J38_>NWS^=S=2NZf|-su1R*Y4Z5ZwDlr7ilCfwOIZ!B~s3++)02X
zCpVXoL22TN<)(K^fLiV5AOG{mCMD8MN6dL)K*eOvy!`x)J9l;#?c{L{EGR5|s5!0h
zr(v7)(V9!HivzV&W8>qQC6*Wp|1Q*;`m3a?SV~`lhi|U6;%OtPUbe2IN-lw0g8uH1
z%G>p<)ZqEHUAwp#GR$T>C(ruY>B7Viu>QJz&tv015{G-2sb1Fk_T|&P{+qAAE?A{?
z?)-V%rH=bK*qS+7ojjHXF*KY$?HzyIe7&=RfW)tFNpCz2O4qyI*|BRElR?FznfIUR
zm87LTJN!>wT|GdAwbzY#WeC^n*RO?puk-HjO^9ocTi@=W&=9wtoxx-I<$bRzQkmK=
z7bwU$6t6w+SP&z1w6LPMV~4xwZz-3{CK_E#o|D$ZKEHKKswDRK-@mrgrcL|s;X}gA
zi=5TJ_Uzs*z3TS8d)vwm#ED&g)_*5&J0nAPclWy7-FNjG4gzykUw^-Crd6iJ)KnwM
z7rXkxR<~Bz<h?xd_#^*wLr%4X9Tt4CaSe9!o)&a4&w2W<CUR+j27|<%m8VaizH#%W
zWL4%Y50wk=zZaI2urO#$KmEQ>-BU=#(`jv3vqqP5DKPm0)AiZ3&%Seo7ilEr<?;Qj
zk$YM4EB0{e=E!Wh9>eUvKPE1l+!h=OOm)dTvz95&KD+PY!?XJH{%3x;TyUi1Q?eQF
wkrIbC<sD8?e5mxYgTR*-gaAweM1PXkRoZ7#`qca$uux#|boFyt=akR{0Qfrh>;M1&

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonDefault_mouseDown_2.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonDefault_mouseDown_2.png
deleted file mode 100644
index b6aed2c646fe3d10b06e52a051d49c8ffdfca5f7..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1186
zcmeAS@N?(olHy`uVBq!ia0vp^bAVWZgAGVN-yrA=q&N#aB8wRq_>O=u<5X=vX$A(C
z5KkA!kcv5PX9s#jhf5s)zijQY$e!s|&T~{1PlrwQyOir;^=n%6O*IRb4L6*AFHt@e
z#U)+RI?YHXg|YRLc=uj^?VNRoZt%QW`s!NyI&G)umkPOtUDIFgit@gaF}Lij+@rmB
zq~H7I?RpZi`Th4v)#rYm`?;_9z5R3R=aWPpe)eEuImmH2josnTeuaaAK8kqo&3!i+
zQ@oWT7HhRD7skwvId<WP(6N7iZhx@2cS@+lG-ScbYh8;je=iaWHha9}+~dvj<sN=|
zTWQnv|MUE$%A1M14!wPP_s3lQlP4qgC^U(?%-R2sC4Y+e<8z$myQH*uzE3|AcGq~~
z<ccXJSBhWcmPu?XZC&($Rq$?aSxw=Eia$|yn?CN2%-JdGm!z_5&8~f>dz<!&vDeLu
z2-^DcVn{YCgH6SrS)XtGikif~_j7x@WbV-$Qb%q`F(^EE%=7i)=ZU@d&n`;%R$%WY
z#>lX?)NJRu_Zt&F+{jaDGJUb)`ID+ttKhipmARX0^EWe>y*9h4w$(q&>xy*rdB2nM
z!n+w&F0YD<PmNq{H~0SEb8~^tQxIHp@WIBrAF6evbLQURyXj{6Jto+oY4SHa#`vI!
zx_;KfZ~bDVdK<-EzHGI)@XWXCqG;Etzf-O+J*rk?^h3PD(dEGL)TxiQ94l^Jv}%)B
zX9DlL`d?NI2^lpnTWeqZ{93KE<KoLhKkjJ7EYvtO(W344T&;_Y2Y%=8YkHtxY;niF
zxuO5?$M0p5U8>PsZUrknv|}xVrU$>7SbES?Q|IfiOBp;#IlkMbADPX&GFkg{)DEY>
zkncVZ9>14=bdGcToL8H_E_@!oi~rECJL~Sm0#mBZ0<kG3-~Vk)`7K#rdCVfNMR#|*
zx2mbGXHwv@X(jxd&*U6xzZw>DbKBzG7v~-Kxax7J;zNaKtu7xhvN+rySxU$6;{U9D
zK6JiY%Uph-gWT`yF*E#3Y*jA&DYEO6&gXoe{l5<MHS{}|o@Z&fD3SF1+Y{3`+ag_-
zmv&QT`p$^2>@zAhS{b`X^7Kmi#ZMdymhKQ*<Fq<&w{&N7)Yoo{k}4@?w!IqP6@W3v
zQX}&%cE%L{x%Yc?K}oKB)tMiquQc~eRm}|NOZ`=|{nVPQ-$f~W>3^OAV`oFO@qMG0
zito$cu`v8mv%9*rw8)x4<$D0bhl|(iB|fcu>b&~hpRei}tF|uMJMZv;yRJ9SAE?So
z^_64U-r;Pe@9_OoUQN5?9@CsZtZU_famsKq|JBx$sdJ=fh3++ZD<AEUxsmh!w!Lf&
zz&M#)wx?EH?c&vd#&>Sk=i=suZjIe%%b%ah=_hw%>q6h|&Ee^Wdq41)TgC3EFrF4x
z5WL*xlTC%=l<)mBYqEY`SS8)5*DUU`<=Rby(o>rc@@IEN{9CR#y-9hS8f&$eYMh@(
r0ZT9p&ybViXbQ7v(p15M|1;fbeOPO_b&@`?&|&a&^>bP0l+XkKr$so4

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonDefault_mouseMove_3.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonDefault_mouseMove_3.png
deleted file mode 100644
index b6aed2c646fe3d10b06e52a051d49c8ffdfca5f7..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1186
zcmeAS@N?(olHy`uVBq!ia0vp^bAVWZgAGVN-yrA=q&N#aB8wRq_>O=u<5X=vX$A(C
z5KkA!kcv5PX9s#jhf5s)zijQY$e!s|&T~{1PlrwQyOir;^=n%6O*IRb4L6*AFHt@e
z#U)+RI?YHXg|YRLc=uj^?VNRoZt%QW`s!NyI&G)umkPOtUDIFgit@gaF}Lij+@rmB
zq~H7I?RpZi`Th4v)#rYm`?;_9z5R3R=aWPpe)eEuImmH2josnTeuaaAK8kqo&3!i+
zQ@oWT7HhRD7skwvId<WP(6N7iZhx@2cS@+lG-ScbYh8;je=iaWHha9}+~dvj<sN=|
zTWQnv|MUE$%A1M14!wPP_s3lQlP4qgC^U(?%-R2sC4Y+e<8z$myQH*uzE3|AcGq~~
z<ccXJSBhWcmPu?XZC&($Rq$?aSxw=Eia$|yn?CN2%-JdGm!z_5&8~f>dz<!&vDeLu
z2-^DcVn{YCgH6SrS)XtGikif~_j7x@WbV-$Qb%q`F(^EE%=7i)=ZU@d&n`;%R$%WY
z#>lX?)NJRu_Zt&F+{jaDGJUb)`ID+ttKhipmARX0^EWe>y*9h4w$(q&>xy*rdB2nM
z!n+w&F0YD<PmNq{H~0SEb8~^tQxIHp@WIBrAF6evbLQURyXj{6Jto+oY4SHa#`vI!
zx_;KfZ~bDVdK<-EzHGI)@XWXCqG;Etzf-O+J*rk?^h3PD(dEGL)TxiQ94l^Jv}%)B
zX9DlL`d?NI2^lpnTWeqZ{93KE<KoLhKkjJ7EYvtO(W344T&;_Y2Y%=8YkHtxY;niF
zxuO5?$M0p5U8>PsZUrknv|}xVrU$>7SbES?Q|IfiOBp;#IlkMbADPX&GFkg{)DEY>
zkncVZ9>14=bdGcToL8H_E_@!oi~rECJL~Sm0#mBZ0<kG3-~Vk)`7K#rdCVfNMR#|*
zx2mbGXHwv@X(jxd&*U6xzZw>DbKBzG7v~-Kxax7J;zNaKtu7xhvN+rySxU$6;{U9D
zK6JiY%Uph-gWT`yF*E#3Y*jA&DYEO6&gXoe{l5<MHS{}|o@Z&fD3SF1+Y{3`+ag_-
zmv&QT`p$^2>@zAhS{b`X^7Kmi#ZMdymhKQ*<Fq<&w{&N7)Yoo{k}4@?w!IqP6@W3v
zQX}&%cE%L{x%Yc?K}oKB)tMiquQc~eRm}|NOZ`=|{nVPQ-$f~W>3^OAV`oFO@qMG0
zito$cu`v8mv%9*rw8)x4<$D0bhl|(iB|fcu>b&~hpRei}tF|uMJMZv;yRJ9SAE?So
z^_64U-r;Pe@9_OoUQN5?9@CsZtZU_famsKq|JBx$sdJ=fh3++ZD<AEUxsmh!w!Lf&
zz&M#)wx?EH?c&vd#&>Sk=i=suZjIe%%b%ah=_hw%>q6h|&Ee^Wdq41)TgC3EFrF4x
z5WL*xlTC%=l<)mBYqEY`SS8)5*DUU`<=Rby(o>rc@@IEN{9CR#y-9hS8f&$eYMh@(
r0ZT9p&ybViXbQ7v(p15M|1;fbeOPO_b&@`?&|&a&^>bP0l+XkKr$so4

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonPrimaryDisabled_default_9.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonPrimaryDisabled_default_9.png
deleted file mode 100644
index 8614dad4f2a6383487b73f6d8f234f7540da10dc..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1166
zcmV;91abR`P)<h;3K|Lk000e1NJLTq005r=001Be1^@s642P;f00009a7bBm000ie
z000ie0hKEb8vp<VKuJVFRCt{2o6k!!TNuYbZ`?A;EA(PCj8=nCNl`5f7qjvPvvA`d
zJG%%f5N08@FzA<oO@=awprur1aql8#-ZV7}ZIXLFAnKXt%yZ80J<s!;BmSz_>;EDU
zxWJg(0}%Xw5#kfLh7g~?HH7#Ct|7!Ha19|ofolly30y;nPv9Ctd;-__%k2St7G2j{
zzAK7?EXxD}fv$Zl%K|`>q@j-OtF+H)b#;|cD1^u3acM-~!?#Ah+W8)P=e2>{OVc#s
z@i-F`6Bvf!2&@y;YL#lWIuO6ZMAI}>Rpt2jnDg`VzWZHWU2$}D^kLgiV`S5=*Xzaa
z_Y;Xk07$3PU2P+gh-3GY@p`>Z1UF5y?|zv~=AC_~wx7nxrQMIPQ<$o%7=}SInRMEc
z$z+R7JRaxl><oa7jSVW53h8tjNs?GuS;6P?Irl9T3KR+jEXzVs6qc8l@pwEP{hghi
z@$~e>`ue)l-}dv-BB<Bvz-#JlpHutz-_GrAd#C4N_pMYaTwh;fnkJGY5e|nP!P~Z)
zrg3p`foYm8a~(7z8~JPsg#rN4X!PAR`+;|(R;v*Xhp{Y+OeVw2%L}TiVp$fsT&~6T
z`T3c(wKY^##Wc;1Y0>s4%QB{E(r7dQXf~T<vsq+W?l~S^*V*0O1z=`orl+lqrfDso
z?N@snK)GBdl}a%+HHD^W%+AhY7zX8Xx#gavQi;XIMWWFtrfG6{dD+)kKFi38PuF#H
zUFY!dkk!>yg27<R^<Engn_w{L*jbj<^1VG}Ei5ebOp9;*`Tc$*NupAz0Dq#H-|z1^
z9!=BO+S+1cV}t$u{hoEKjo0gK`E0-1+W?BiA^`LA^LV{pXEC%dG<&Z0GtFkRACBWI
zjBMJqSM%7|*wA-{&1REQsl?;sBge<bef0?jgOo}oBuV1t=B8t0ZpRjh&*vkP$&k<I
z2f9PI7tHwhc*}b~A|D1L8~N-N{T;^<r>CbJ9v(6~J4+&w=&Mg45WqA|>h(I=Y?j}@
ze}CHVphaN|x!G*Cyeo<_P(S@LgveLqKtG_^_4*!q$5RBE&EzJ%t0H%Jn__QoZ~N-w
z@pw=ag_DyL6h&!Ch23~~cmQ5&E`V4p2EfwN64`8)a=Gl(k#CVC3CpsaG(SB(-LcKC
zZ}a&)vMf7(KB`5B#Sp|Nv)QH4ubuC4z$X7J|2=rOL&V+{pPZb0>d0npZjMwcg{rE3
z+3)P^0I!iqRaK{s42446-QAJP<vRM0L?TR1PLfKcP!xsf>FJJbfj|INRVfyW?Ck8k
z^Yh*O`p*AwjH>v)O1WIdFboojgi~J${xGr|j-O1U(cu369>Xw*#bQEuT@d0M0^8f$
zNRmV>7W=WkC;tS5_=dnohueZzM)s&hF#3G!hC?8Di->#z*AU_pxP}m)z%_*U1g;^(
gCvXiRK7nie2Px38OsfTDFaQ7m07*qoM6N<$f>Yl`ZU6uP

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonPrimary_default_5.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonPrimary_default_5.png
deleted file mode 100644
index 1566304477931a6845e950443ac66ceb5ce5a251..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1242
zcmV<01SR{4P)<h;3K|Lk000e1NJLTq005r=001Be1^@s642P;f00009a7bBm000ie
z000ie0hKEb8vp<Vj7da6RCt{2n^8zxR~X0t#x~LPRxesFv1SQ2v?g@L!m#P+o|4M8
zjED#p`;w=0MA$~hgsw~<#6cEtF#2NX@-hpnt7Q)f_~Iga*=!iB3kun!S@B}+8taHL
z*0$DW581u-CO0v<BsZ6xAB5cd<vaP#x%Yp*^PL+~g-;_X5C{^Wkh%ke|1U&*1j!)c
zBS;1jA3-vR_z03g#7B?}B0hp-5b+TtgNTnH83&~9z+OqYje>J;D2~aw1ZJX7a<;LX
zC;&hpk}PT8_DklN2Bu=Tad!=|<hDdTDi3ANd?&4~n768m@?CmQ6sND<$K#D{1f4ow
zU}Bun*5Zt|wkUB+iQW^1)yHDg#$fn-Q^D;nb<h~=*6eDlG-SK%vhgj1A3np-^a=pL
z@6hJ-9hzR@{VEwYzQt#7mzgfO-Sr+#mcN*-(vYqAa*=Wyk#ZYhF{t_FjI(9>v^T5Z
zcWB{vXu(j`u$w5P+(!5vTAVnd6nt-Adma1^EmCeH#=13NsOp^YMmn3avd&0n6Gl3B
z&t_cQfvH$lf5pzl?74ga;H<6|W8E5loEC#R%U4Gq<b8IIwb;mBe0}Y80Dy}V%UPdQ
zUHv_8TN9(gS3ms?yNQCYrx}No3RrzC>?R5yztte{J*-sV1OFpfeJosNT69_D;@zH4
zz-6ZSn^s?=z@ViOx91ai`;&4T@y92}002MS+sNz7q4z`u$J{H^1^^a=8ngX++*^GP
zy(fx5B#EF?ClDY2ynXx-+&`}3;>0psW*Q&9DZCcNLbl@LX6enoqZpWqVInNNvH3P2
z924PJ8x^~W5}ao)SzrGW&$}${j2C|R41q`z=GW47rioGU_I&6)QM7&eC*J@5FZ}jV
zYu-ARgN<(qj=5K+4FGyir6;QI-?7}9OJB3g=Y-<o#>!pOK}+MV{n!t(+wF32v-#<Z
zmnGj7*4HTTZX1P`x&s)sF$J~xHk^R1jY1%j#CvU&XlBlY6UoBk=eXXZ!KDtms5^9S
z!mK@gDR?hL<fTBinU9;%<#-(N#XAgc_8mnak_0`xP*9th=muP78Yhk@F=%PT&x@OT
zj$3R|a6+!HQ3&3>p?Fc_6iNv)-(lQxx1cxY=dDPc7qhS9!qo?uEPjXnGdq{qH(F{6
zY7<Lt!yAfY)W*OYiVK#)T<GY70Ma!V0CbHn0RTRqS;e5G5f+0Q43&M$0+A%_CJJYD
z>1F;7yD4hp>RV?Ajmf!nKF;J^{#vwDlt6szxR9gJKWS~ncUZ>j!ThyPrE&V&eT;NA
zVbsR#>5<Jhzpi1nUk|H~Ey#cIiUB}66Ip#MUq{}!yN32=6)vA^5RE@Hy@Cgc7ntqW
z!yAg@4!bF8n~6Sw)yJauR2>$t7_#D&o2qjDheNL7+b<S_8bPNH^zZ^-UlCp*+YLu0
z!%)>Y)}TbtsYBQJ5)obwi1<ptqtA{b5J{qIe5qo8Pp$-r_)5TT54Q<vWc#RvAb-lb
z;UExpLNXsgGKlyHl0n2rkPIR|f@Bc!5hR0%k02TU0KhTTn$XuCO#lD@07*qoM6N<$
Ef{vq9pa1{>

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonPrimary_mouseClick_6.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonPrimary_mouseClick_6.png
deleted file mode 100644
index 1566304477931a6845e950443ac66ceb5ce5a251..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1242
zcmV<01SR{4P)<h;3K|Lk000e1NJLTq005r=001Be1^@s642P;f00009a7bBm000ie
z000ie0hKEb8vp<Vj7da6RCt{2n^8zxR~X0t#x~LPRxesFv1SQ2v?g@L!m#P+o|4M8
zjED#p`;w=0MA$~hgsw~<#6cEtF#2NX@-hpnt7Q)f_~Iga*=!iB3kun!S@B}+8taHL
z*0$DW581u-CO0v<BsZ6xAB5cd<vaP#x%Yp*^PL+~g-;_X5C{^Wkh%ke|1U&*1j!)c
zBS;1jA3-vR_z03g#7B?}B0hp-5b+TtgNTnH83&~9z+OqYje>J;D2~aw1ZJX7a<;LX
zC;&hpk}PT8_DklN2Bu=Tad!=|<hDdTDi3ANd?&4~n768m@?CmQ6sND<$K#D{1f4ow
zU}Bun*5Zt|wkUB+iQW^1)yHDg#$fn-Q^D;nb<h~=*6eDlG-SK%vhgj1A3np-^a=pL
z@6hJ-9hzR@{VEwYzQt#7mzgfO-Sr+#mcN*-(vYqAa*=Wyk#ZYhF{t_FjI(9>v^T5Z
zcWB{vXu(j`u$w5P+(!5vTAVnd6nt-Adma1^EmCeH#=13NsOp^YMmn3avd&0n6Gl3B
z&t_cQfvH$lf5pzl?74ga;H<6|W8E5loEC#R%U4Gq<b8IIwb;mBe0}Y80Dy}V%UPdQ
zUHv_8TN9(gS3ms?yNQCYrx}No3RrzC>?R5yztte{J*-sV1OFpfeJosNT69_D;@zH4
zz-6ZSn^s?=z@ViOx91ai`;&4T@y92}002MS+sNz7q4z`u$J{H^1^^a=8ngX++*^GP
zy(fx5B#EF?ClDY2ynXx-+&`}3;>0psW*Q&9DZCcNLbl@LX6enoqZpWqVInNNvH3P2
z924PJ8x^~W5}ao)SzrGW&$}${j2C|R41q`z=GW47rioGU_I&6)QM7&eC*J@5FZ}jV
zYu-ARgN<(qj=5K+4FGyir6;QI-?7}9OJB3g=Y-<o#>!pOK}+MV{n!t(+wF32v-#<Z
zmnGj7*4HTTZX1P`x&s)sF$J~xHk^R1jY1%j#CvU&XlBlY6UoBk=eXXZ!KDtms5^9S
z!mK@gDR?hL<fTBinU9;%<#-(N#XAgc_8mnak_0`xP*9th=muP78Yhk@F=%PT&x@OT
zj$3R|a6+!HQ3&3>p?Fc_6iNv)-(lQxx1cxY=dDPc7qhS9!qo?uEPjXnGdq{qH(F{6
zY7<Lt!yAfY)W*OYiVK#)T<GY70Ma!V0CbHn0RTRqS;e5G5f+0Q43&M$0+A%_CJJYD
z>1F;7yD4hp>RV?Ajmf!nKF;J^{#vwDlt6szxR9gJKWS~ncUZ>j!ThyPrE&V&eT;NA
zVbsR#>5<Jhzpi1nUk|H~Ey#cIiUB}66Ip#MUq{}!yN32=6)vA^5RE@Hy@Cgc7ntqW
z!yAg@4!bF8n~6Sw)yJauR2>$t7_#D&o2qjDheNL7+b<S_8bPNH^zZ^-UlCp*+YLu0
z!%)>Y)}TbtsYBQJ5)obwi1<ptqtA{b5J{qIe5qo8Pp$-r_)5TT54Q<vWc#RvAb-lb
z;UExpLNXsgGKlyHl0n2rkPIR|f@Bc!5hR0%k02TU0KhTTn$XuCO#lD@07*qoM6N<$
Ef{vq9pa1{>

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonPrimary_mouseDown_7.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonPrimary_mouseDown_7.png
deleted file mode 100644
index 206b07dde527184a090fd54cbf560241b5e8944a..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1251
zcmV<91RVQ`P)<h;3K|Lk000e1NJLTq005r=001Be1^@s642P;f00009a7bBm000ie
z000ie0hKEb8vp<Vl}SWFRCt{2n_o;@RUF5^n27{3iX)IzECsi)&Kk?^G8mZ;&`YvT
zDFbE+f1XOf^Z}ch@-hMs1k?EdiCLD=OyZv`*UfesX<zz4ftb0DkW?`vK~e*2qbQT9
zEEv?7`oQj$+ur^GdwYB1`6M^D_jiA%zu#%U=bYcUO>@xoegp)91Uw~m0)+oBM0^Cv
zAmSrP1`!`YGKlyHl0n2rkPIR|f@Bc!5hR0%k02R`q)uSJL>M#g+TmM<YkmzgOY3pl
z7%3G1z!M0In%hB%?$ZFXfE#y$*x1^UD5K1f(V0)%){6UWMQM32wbhC0%TxII@gMLF
z8aROoQFF8eHAhR*5?4&rRwrn?7h~P0G4lG!l-u<+RAHj0E~zcsknOS?+T6xs=n;lp
z0RVv8))?1!*cIUXvYF84HaCM?XiduPuJ@je@fWgX8?qH&JR*!45ylL?R>>`AtS#C{
zSAGO;TO-`IMwAxj!APkPVa#yb8d0Sz<h^f4T_xPMMno7hCVJ{nT9_9%-l&O+nRP}@
z6h=){()`)D1I$89zCzbR_ISPkaOPMECVJ|)e(JT#7~k^Z0?ub|U(=23#n(|+2>|H4
zHWza*r~8A1ZBLXb@UC|WMoNXrzE@E2%puTrFN~B5Z=Kijd=KY6js6e)pzU5*XpP{q
z$i}-pzXl7f;l4CQelCVubhtggmN1_PW5%~*7Xbj%_kT#}%c8bAd9T?c+6Dl6trGr`
zCIo+c47Jq>Pap)}pn)eq066z@8LmuygU)Mnu+SR3dG5uOa@jAk6(2iFZ}!(?fLXvT
z|0?f(q74YkE&nR#XQWiT>*yuxz1fw7%i`X6i=jvG1j492wp(YOcuv9D6QQ;`aeUxY
zyfOJDzP@rHVI9j7+T7;7W{+qa0GMhk005J7yM1v!84Q;U{DH>ymHkYIT69VCI0&-a
z?Xs|=dFQXcMc)-F@^f)sSBA1@3ozDwI;A!r-~A4+RzD9<AdJ^essv}|XjqY~tZ(6Z
z?^*OU98c>GogFa0{r)HKoQlZBK(;d<JEAl3IO3g-Q@Gh*56@R26!kGFwV7F3hlSRl
zN?C}Z79H-cZ0tL3x<$bXS&^U1J3D;KX^oRABFuaha54=r#l7E($VDOh8rr*O;Yxo(
z|Czl@?5WD)l-g`;?ZDw%##mPk9KL1VQW%f&;sOA>H5ULhk52;t-u`?MLoGV!wMxO_
z-xCPKNU3n<$ufU0_)yTs*0;U&RdCI(a&cTqYEiKeL40dyk5lMt+gkAnX7SQzzotK|
zh*V#m!l;SDSXa%y9@%{KMG*dxCeU_oO8yV7wgcFmiD<i*t0QmR2|`zX1eXk2!T7_j
z0KWfa8~%|dIDE^v7knsan^{^1ZTG@dTY(2x+hgKnnw(7jheNL7J1Bas623tLiuxF?
zz9RgKY&RU)Ole^rUMM{b-=G1_<I_ZVaUkLofuANi;R%G%JU*SZzb9t{M0_HU?BO<H
z7uh~)A;_PMZa4^py^xuYAQ?n_1j!)cBS;1jA3-vR_z03g#7B^fe*nuh-Os{oSeF0*
N002ovPDHLkV1g#%ON#&i

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/buttonPrimary_mouseMove_8.png b/packages/office-ui-fabric-react/visualtests/baseline/buttonPrimary_mouseMove_8.png
deleted file mode 100644
index 206b07dde527184a090fd54cbf560241b5e8944a..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1251
zcmV<91RVQ`P)<h;3K|Lk000e1NJLTq005r=001Be1^@s642P;f00009a7bBm000ie
z000ie0hKEb8vp<Vl}SWFRCt{2n_o;@RUF5^n27{3iX)IzECsi)&Kk?^G8mZ;&`YvT
zDFbE+f1XOf^Z}ch@-hMs1k?EdiCLD=OyZv`*UfesX<zz4ftb0DkW?`vK~e*2qbQT9
zEEv?7`oQj$+ur^GdwYB1`6M^D_jiA%zu#%U=bYcUO>@xoegp)91Uw~m0)+oBM0^Cv
zAmSrP1`!`YGKlyHl0n2rkPIR|f@Bc!5hR0%k02R`q)uSJL>M#g+TmM<YkmzgOY3pl
z7%3G1z!M0In%hB%?$ZFXfE#y$*x1^UD5K1f(V0)%){6UWMQM32wbhC0%TxII@gMLF
z8aROoQFF8eHAhR*5?4&rRwrn?7h~P0G4lG!l-u<+RAHj0E~zcsknOS?+T6xs=n;lp
z0RVv8))?1!*cIUXvYF84HaCM?XiduPuJ@je@fWgX8?qH&JR*!45ylL?R>>`AtS#C{
zSAGO;TO-`IMwAxj!APkPVa#yb8d0Sz<h^f4T_xPMMno7hCVJ{nT9_9%-l&O+nRP}@
z6h=){()`)D1I$89zCzbR_ISPkaOPMECVJ|)e(JT#7~k^Z0?ub|U(=23#n(|+2>|H4
zHWza*r~8A1ZBLXb@UC|WMoNXrzE@E2%puTrFN~B5Z=Kijd=KY6js6e)pzU5*XpP{q
z$i}-pzXl7f;l4CQelCVubhtggmN1_PW5%~*7Xbj%_kT#}%c8bAd9T?c+6Dl6trGr`
zCIo+c47Jq>Pap)}pn)eq066z@8LmuygU)Mnu+SR3dG5uOa@jAk6(2iFZ}!(?fLXvT
z|0?f(q74YkE&nR#XQWiT>*yuxz1fw7%i`X6i=jvG1j492wp(YOcuv9D6QQ;`aeUxY
zyfOJDzP@rHVI9j7+T7;7W{+qa0GMhk005J7yM1v!84Q;U{DH>ymHkYIT69VCI0&-a
z?Xs|=dFQXcMc)-F@^f)sSBA1@3ozDwI;A!r-~A4+RzD9<AdJ^essv}|XjqY~tZ(6Z
z?^*OU98c>GogFa0{r)HKoQlZBK(;d<JEAl3IO3g-Q@Gh*56@R26!kGFwV7F3hlSRl
zN?C}Z79H-cZ0tL3x<$bXS&^U1J3D;KX^oRABFuaha54=r#l7E($VDOh8rr*O;Yxo(
z|Czl@?5WD)l-g`;?ZDw%##mPk9KL1VQW%f&;sOA>H5ULhk52;t-u`?MLoGV!wMxO_
z-xCPKNU3n<$ufU0_)yTs*0;U&RdCI(a&cTqYEiKeL40dyk5lMt+gkAnX7SQzzotK|
zh*V#m!l;SDSXa%y9@%{KMG*dxCeU_oO8yV7wgcFmiD<i*t0QmR2|`zX1eXk2!T7_j
z0KWfa8~%|dIDE^v7knsan^{^1ZTG@dTY(2x+hgKnnw(7jheNL7J1Bas623tLiuxF?
zz9RgKY&RU)Ole^rUMM{b-=G1_<I_ZVaUkLofuANi;R%G%JU*SZzb9t{M0_HU?BO<H
z7uh~)A;_PMZa4^py^xuYAQ?n_1j!)cBS;1jA3-vR_z03g#7B^fe*nuh-Os{oSeF0*
N002ovPDHLkV1g#%ON#&i

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/checkboxDisabled_default_4.png b/packages/office-ui-fabric-react/visualtests/baseline/checkboxDisabled_default_4.png
deleted file mode 100644
index d278c2d2eaea3ad294c16282d5d77759dc9593c8..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1275
zcmV<X1O)quP)<h;3K|Lk000e1NJLTq005By001Ni1^@s6iQm}e00009a7bBm000ie
z000ie0hKEb8vp<Vtw}^dRCt{2o4<0~I1q=w+@wj0?2KC<(WL|2y1*OY4fuq71H1ud
zqBcb54!X3Oft!@Rf)qtke{31LTy75Ej0+MX7FhhSyP&KOFE1}IR4N7h@ox{H^53V5
zs8UQ7QKgtFqDnDUM3rKyh$_WY5mk!$xY=xO+Tr8l<4yak{QlHPR4Jy4s8UQ7QKgtF
zqDnCz{|%!#dVHS`H^ktaM#w}Tz&f<t%-U6brqB`6{Eou57ImxPoV9bpRtj_>W88cF
zkqF(E=Ir=iYrjB_3~tr$6Va#p2Od8E#pY>u<&%lf1(FzCtC{?g0wICD^-8@HF%CDb
zS_&P(3*u(u{Riy8xVgHHt!)QiC`<dB_~a5-r?dA92vP_nWog$7qU>)Ypf#%bbpsRa
za7G3{{W7cNTos8*1VoO+BpCOWMHwR&aGXx&ZJ_qMb}&Npo<pWo*jBH)4s;<MMS(Me
zCdPy)HxvEJ#*~W3NRrg@I&0c1c8F+=>Lbq?kY&1AmH{)rjB^@$IFbJ5K0DQZ>T_$~
zuG);5o;nuM-97g|fAHhy@^+Dc0CFaaqIoqZWO~2Fwk?)1orDHu75n-o8%L{UoR}wy
zL(90hVrfUA<`~I~t|LBVjB78}7`gX!{dgf}Cbm;HJl-=1M>}lph)H855|YBbY17OR
zL^3(UB3$Q4=mp!lQ8;N@(DW?0wjDm60$qqSQ?yTnj>(^-K<5Krj_RP-d^>L&)+I3r
z=_sAu@tMyL58Qt`+$$E)RS3o%CaAPQ^79~u6zMV8X;Br8%A{=`+OopVcD-nQa8!<X
zpHOcoQpGshwjKU-#_xAv-ja@NSPY46K8!cVNQ?<(Z(T>_AwmHtHS^KTj%rXj&o<A}
zpD2xy#CDx8FZp(yx1KppX*1b8ibT8J6T8hFUmqX1|Nfob-Hik!f{c?Za%}GLQ<xaL
z-bYrEGks_J&?Dv@ryQj*(X&k!MJAuMu^)rRDo?=T-ZRm>C1pXapB0UB;C)BWD%IqO
z_x(&bistYjUlx50*Xel?qsM;E_%>gj_nDe#$I}MBK0fm2?&&rWNE(#%#Hdjv=l59+
zvfyGRDj289-s5>oEp&lbH$oyNK?ua=deNrXla)RFoM>FD8B$G0pv4mC!jP`iXg_q@
z`GCjzYI!Y<04pI~^6h%wIg`h$3#YRkPn*pRQ<$Kwf!@!G!2KY@iFYO^Pz@^ggm_{X
zooLH3&a^cYqSAZ(sprp-W1!E9Mlq#=FdJ-+fnM~u=;J#nZLwC7LR>G?MTU1r%XB$w
zocTzQ`AW~C#B$EVnEJRHF9y9f@tSW*#HnpKaP0ZDFB?VU+J@*oT^DA9w6yju9Vl!I
zp_>)H(<$Xdn;4vi=lS#Q8Sgz^I<xCo71oQ>p`e{5cY!X2gN?CxPGKy%6@W%dhYw%Q
zp3atb_O;lV&?Q3l9h2MC!H$W3N<(4{Y9U>PZMHLi4=2`RE3f!=@3(&NgRusQ!>2xc
z`}XaoKN+h33iAJ>es@+Wri!RiOchb3m@1-5F(2x0@hhd&NK`4Nil|ad6;Y*_Dxyj;
lRYa9ys)#DZR1sB*`5V)Ea<&es+c^LL002ovPDHLkV1jKtXD$E$

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/checkbox_default_0.png b/packages/office-ui-fabric-react/visualtests/baseline/checkbox_default_0.png
deleted file mode 100644
index 5b42cd34d9726c9dae09919ede9b9691a4e7331d..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 869
zcmeAS@N?(olHy`uVBq!ia0vp^6M<NTgAGV_-oNn_NO2Z;L>4nJ@ErkR#;MwT(hLmD
z;+`&!Ar*7p&fb`J+d!bLUYyk`ReQqCIZR9L{$Se~uF-CH;H>0K&18$Ree5p|d=dP?
zaVu)U+;zd*b1E6iC+MD@HtELFOBN?<8`xi~Ofs;)KR2~{TZE37K@ZnGo3Bhg&-*=7
zLXw3fug-9BGgX@y*bC*J5vcd8nx9cvYV@?=nDGH4gbYZbztTjnhVONMIhb;lCkQB5
zz09fZja+m;W_G_uu-<dlPyRx4=bhd7qvi{LxR}d(K`upe-dR_hMT;D)pIVe>dxr>E
zpX@dKHtofioId&E<}+&d-mTswq|BviGV|dtMlX*o-wXb;E@F<o!MJg{iz$;MYmm&0
z@|#o4l6$95t~;Zg$08~ur{Su4sJeecaBXmhh{d9LU!se@Y?|UFVb{+-B}u+>p^N<e
z$Db-HlBPN^EZ{0-DdL~U!O40>U;VC|hKfr@c%G0z_}_Dzz89|4cAdFhE!eSx>zwk&
z-pgUO(G3j~cNM!oThO#Y<anW5(WPl=qDP!gw9iUXPf@t2zUT1EpEb@)vKqe~YAinV
zYN>jf#no?jV^gw&IbFJfw)AQ$el<I5SpL|7RZ%41+>Yb(pO#iGj^|$8vy3&>z@2IF
zf)`bLwU{O{c}1uGZv9mD`@q-l_B-}jIPIJD_|xh9n%@Q!9nO^+h3ws+#Sv%L{_LL2
zV{ykt2R<HV;#FYV-4Mjk<n(?{^4=LPjDnm$O(j~as~1JLbW6{fH{WM^qfBE=<CVI)
z@;yIK=B>%$)n|InqMmp>?uA@f<VQcQB^En`)c1uJ?znR~;=WSMpIIAPEDMqn*4)$)
zwEjBZMM3n)#=DZ8D?Qe4R9li(KQTnfh0`S>ZE0QqwjS%av>n^hnbnuLXnZWaBPB6q
zv-?rQBIgML4{G0AsG4L>XN(eD#2*p9<(owBQ5j|9DrrxTnSxFY`aOGUS0{F!y7A+H
z*5Z}@ufJNmoy*;FB=xc{!-0h7f{UC#ADW&0TeBmux3)YDITfBg^RGMqO47^|D~_oc
ntupNF$?{QJEHxRy{m1lpddr-D_4CSs`G&#M)z4*}Q$iB};%|J{

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/checkbox_mouseClick_1.png b/packages/office-ui-fabric-react/visualtests/baseline/checkbox_mouseClick_1.png
deleted file mode 100644
index 4945cc9cee97e8ec6ebc40a0ea031add71facf0b..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 808
zcmeAS@N?(olHy`uVBq!ia0vp^6M<NTgAGV_-oNn_NO2Z;L>4nJ@ErkR#;MwT(hLkt
zw>(`OLn`LHoqfCTu>p^3epwJ_w1Bq*cN(Y0!6Z%}PB+f1gBp&yGu9T^KWU$$vC;U7
zR*_h`o4l9?gV}n<Ny+=C1aa{!ZnC$Z+wk$vjE<fx9~U=MHKoN;!V?2~J5Q`Q=8_Wf
zdDH#(;<oBl)z#6L=6+<^!*trW=JvMkABOX|v(w?K&-Qm{csG3iSH|inr!zr7q4HwJ
z{ZA_|`WJr|+?8Urf5KGPB^~#aH5R_E{xZGWIK|oc>5kpcrg;diS2BMV5$YnPJVoeN
z-@{{UULIT0)cT#bTs&fSq)O=&Qy}{@ceT_N5ue|t<b3WBPHt<lUhAQ}=Q{`g*X=xl
zt;$lJ|6+Rrr=AkB+t(+pwef$~-@5o|kG$iLZ!_8LY+3vAVF=&uWhTDSeb<lAy0qnZ
zXKne83d?ERZccsp^ykgjH-h}yoh_#YTfRA$?AN|&ci(@Vv&&4*zL@pIMm*VEvN&h<
zCAsq(-|f49{~%j=I^P}Dm{+2Pho9Qi><(2(P}z5dl_{_-OD<>T1h?9YhVg$DxSaw5
zt~aXhEm3Q}IBUi8o`RJbkqhOMR18FB<^N0*?9kBIn|*u#l<QZOEXzfmud>f(J$U+x
zX@AlgdzMb7<KJ1oFeYu_4q)Yw{CQbodx{XNi%QA==B5qLW}Of`p}C~&|GSD^n_pL#
zlutDbF;{<haO(x}m{pIKYq-eHIo8^*we57*+cS;A%*EZly%iaMJy}jQS(sZJZ__b~
ziVzO^U#pnfIl)Ka&`vGQM;bSE1Rwo~d1$2K(jXk9l<~*DkL_A^`hlHY0xB#O_PhK!
zYpaeNRA_m@oF|*R!@bz-_zQ`}ohnQE1f3ef-M;@@@z7_Q<^Kaq7p2PQ|Fm|y&KuUt
z_(-UViGj_!UqJTP+IjIhN3(VtKfb={;N6)Yb6`npeZya+iz^;475S~dFR*>9F-k&9
kRx(;;C@6Uqr1&3`gk!3L#w(W?VA5ysboFyt=akR{0Ixq~z5oCK

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/checkbox_mouseDown_3.png b/packages/office-ui-fabric-react/visualtests/baseline/checkbox_mouseDown_3.png
deleted file mode 100644
index 3b11af5f7303a28fdccd0b35b65d3836a3730893..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 872
zcmeAS@N?(olHy`uVBq!ia0vp^6M<NTgAGV_-oNn_NO2Z;L>4nJ@ErkR#;MwT(hLmD
zQl2i3Ar*7p&fZ&e#X#Wr|Fjnw3lbMBJ`<s};?i<&&xu#BRx)ZxYI*h_5Du7c#_G?Y
zs@r<K^p!~^OYo0#&#mvLr%dwRv|mzOGE%;??q2L`J=e=7ydtX2;{1CVo_<^`q<M3N
zi<g<!#7VtgOHyFmqp#2Jce7RB^|#LKS-~k~2W3=gex->n-HSBDruR<R#(FWzMY42T
z^Rbk0o%L%A9vDvl%(8Q`i~95BJNDL8x6k7V7un#mViw!kKcAW^T&z=_uCCP;JX|_S
z`*lTSM*HN?!G9|2d(G|h_~!M@We#?loUyY}=+eQ(clljdj<m-eEi4XDIVH#;BzRMy
z;#Tc@ousw?>VLN}<*f`9c-t3pgwHkbz`LpUSqzPMVh`lZS}eX)<<`UV?>d~`)F)|N
zJkI~)S6)T(GzW$N?jr(vXVyux9yD4p-)~p1fXnNE@|S9id2#QzZ1vX&p5C=;gV9Wv
zh;Zc)UakF=ibBs!XS+Ha*s{C)tjv)O#)UoWC!D&lEUj~f!NRECUH%gqUFLt_Qorvv
z-Q|?n3k4phsRsWqPv$o$y=!+@CfsbQgUSQ#%-by!s%EF{d4J4NHc_{E6<741%->(L
z79Hb$W3%X_XobOX5yl?v$Ti#h1PzTcUTyq5vyzEN<=4;ff}c-!31^x#dNC_ES>=m3
zFuhq;lE!oD>s)~thC?OG9hgrjORyQIT`ajQ^Vzh*r}N-5zGB-Tvnwv<#uLvS>vnj?
zlp<mH{qNnDr{=rUs<UR5I;{{omGFH{>$VM_9TQyi0zaiZS={wF)jP4a`LzCicb`PI
zI;n;Y%WkB!?|tR3G=atE+S_xp%sMxQM+gTM@9+>(=WtSR5}z8AzY)k>I^T8fwzOt{
zk6<SMdB-mv_$y~7)xT<`K-Tt}1;<<dzB=E^aoBuA;_TElOXQqZIca~IwpspVzo6HW
zw7A8RKeQTee0>%na{kS&Mb?48cmFavVAs6e_^(#Sq~5x+W$^R|Opd+_|97u{vS^~m
rNjKG?O@W<Lazd0;rKcje{}>m!m7crl_2DHj>o9n_`njxgN@xNAl$3^@

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/checkbox_mouseMove_2.png b/packages/office-ui-fabric-react/visualtests/baseline/checkbox_mouseMove_2.png
deleted file mode 100644
index 3b11af5f7303a28fdccd0b35b65d3836a3730893..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 872
zcmeAS@N?(olHy`uVBq!ia0vp^6M<NTgAGV_-oNn_NO2Z;L>4nJ@ErkR#;MwT(hLmD
zQl2i3Ar*7p&fZ&e#X#Wr|Fjnw3lbMBJ`<s};?i<&&xu#BRx)ZxYI*h_5Du7c#_G?Y
zs@r<K^p!~^OYo0#&#mvLr%dwRv|mzOGE%;??q2L`J=e=7ydtX2;{1CVo_<^`q<M3N
zi<g<!#7VtgOHyFmqp#2Jce7RB^|#LKS-~k~2W3=gex->n-HSBDruR<R#(FWzMY42T
z^Rbk0o%L%A9vDvl%(8Q`i~95BJNDL8x6k7V7un#mViw!kKcAW^T&z=_uCCP;JX|_S
z`*lTSM*HN?!G9|2d(G|h_~!M@We#?loUyY}=+eQ(clljdj<m-eEi4XDIVH#;BzRMy
z;#Tc@ousw?>VLN}<*f`9c-t3pgwHkbz`LpUSqzPMVh`lZS}eX)<<`UV?>d~`)F)|N
zJkI~)S6)T(GzW$N?jr(vXVyux9yD4p-)~p1fXnNE@|S9id2#QzZ1vX&p5C=;gV9Wv
zh;Zc)UakF=ibBs!XS+Ha*s{C)tjv)O#)UoWC!D&lEUj~f!NRECUH%gqUFLt_Qorvv
z-Q|?n3k4phsRsWqPv$o$y=!+@CfsbQgUSQ#%-by!s%EF{d4J4NHc_{E6<741%->(L
z79Hb$W3%X_XobOX5yl?v$Ti#h1PzTcUTyq5vyzEN<=4;ff}c-!31^x#dNC_ES>=m3
zFuhq;lE!oD>s)~thC?OG9hgrjORyQIT`ajQ^Vzh*r}N-5zGB-Tvnwv<#uLvS>vnj?
zlp<mH{qNnDr{=rUs<UR5I;{{omGFH{>$VM_9TQyi0zaiZS={wF)jP4a`LzCicb`PI
zI;n;Y%WkB!?|tR3G=atE+S_xp%sMxQM+gTM@9+>(=WtSR5}z8AzY)k>I^T8fwzOt{
zk6<SMdB-mv_$y~7)xT<`K-Tt}1;<<dzB=E^aoBuA;_TElOXQqZIca~IwpspVzo6HW
zw7A8RKeQTee0>%na{kS&Mb?48cmFavVAs6e_^(#Sq~5x+W$^R|Opd+_|97u{vS^~m
rNjKG?O@W<Lazd0;rKcje{}>m!m7crl_2DHj>o9n_`njxgN@xNAl$3^@

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/choiceGroupDisabled_default_4.png b/packages/office-ui-fabric-react/visualtests/baseline/choiceGroupDisabled_default_4.png
deleted file mode 100644
index 67cbcc3c163c2497dfa688957aba0e46f29ca836..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 3518
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
V#ppnNBKSiF=xP~hRzdB;{sq5Do3H=?

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/choiceGroupIcon_default_5.png b/packages/office-ui-fabric-react/visualtests/baseline/choiceGroupIcon_default_5.png
deleted file mode 100644
index fafd724e6a00b24ac3b1ba91d9784bbd7f923189..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 3512
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

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/choiceGroupIcon_mouseClick_8.png b/packages/office-ui-fabric-react/visualtests/baseline/choiceGroupIcon_mouseClick_8.png
deleted file mode 100644
index fafd724e6a00b24ac3b1ba91d9784bbd7f923189..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 3512
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

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/choiceGroupIcon_mouseDown_7.png b/packages/office-ui-fabric-react/visualtests/baseline/choiceGroupIcon_mouseDown_7.png
deleted file mode 100644
index fafd724e6a00b24ac3b1ba91d9784bbd7f923189..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 3512
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

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/choiceGroupIcon_mouseMove_6.png b/packages/office-ui-fabric-react/visualtests/baseline/choiceGroupIcon_mouseMove_6.png
deleted file mode 100644
index fafd724e6a00b24ac3b1ba91d9784bbd7f923189..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 3512
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

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/choiceGroup_default_0.png b/packages/office-ui-fabric-react/visualtests/baseline/choiceGroup_default_0.png
deleted file mode 100644
index 1fdf3b0c2f9a784ebe8c2898c262a8b0bedfeff4..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 3166
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
V;z*KhEcjsnEYLQlH7L)!{{ZM6(&YdE

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/choiceGroup_mouseClick_3.png b/packages/office-ui-fabric-react/visualtests/baseline/choiceGroup_mouseClick_3.png
deleted file mode 100644
index 67cbcc3c163c2497dfa688957aba0e46f29ca836..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 3518
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
V#ppnNBKSiF=xP~hRzdB;{sq5Do3H=?

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/choiceGroup_mouseDown_2.png b/packages/office-ui-fabric-react/visualtests/baseline/choiceGroup_mouseDown_2.png
deleted file mode 100644
index f6281b464cbb230297a1fb66df83e4ad7dafe640..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 3528
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

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/choiceGroup_mouseMove_1.png b/packages/office-ui-fabric-react/visualtests/baseline/choiceGroup_mouseMove_1.png
deleted file mode 100644
index f6281b464cbb230297a1fb66df83e4ad7dafe640..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 3528
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

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/commandBarItem_default_4.png b/packages/office-ui-fabric-react/visualtests/baseline/commandBarItem_default_4.png
deleted file mode 100644
index 7b1f1bbf925a00b0f8a5555600e023dc51a0f0ea..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 2022
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

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/commandBar_default_0.png b/packages/office-ui-fabric-react/visualtests/baseline/commandBar_default_0.png
deleted file mode 100644
index 381e7b9ed42bfc462772447b38cf1f305fb0d229..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1567
zcma)+`#;lr7{I^0=s0fW<QCn{;V{CKtSHxv$em$xEw@NZC6^(Y@N&sc!z327Hs*R9
z&0J!H9Fdtz3po>!8QGFV=i47}Uax-mJfG)zeLm0Yc|OnQdES}MP8Z~))uaIckVDv6
zy8?i?H>hh%?E&R+?mc60`!&W6c>@6Cdwwjjhr06W03i7qVQt|a_lQ5;8R-^zux~xD
zFk4&Fq1AdtF6*A144K5z%weT2lsohccsjp1mVLzqCbhoTIp*{m@`rtu1@cwdsmI}!
z%~n>F$x#caf-boye-x^xq9qt9sc2X_AqZy^HzNm4huK&>g_R-L5YG26FE5*j0l;&^
z<S{0gRm!ZKm<(tJN<cv?L!lm&2W_8=13--GPaW(a1>(1Y%wZJuPZ4Kh+h)kd_m!rf
z6;4bNf_;SZ9bR)uG$|m3HSa6|U1?D^V|>5eo(%x+MuM{U{Rk_kR4>cQ4^-7r&ORw<
zk6V8t?{P@HS5x%11mC<K%x$KdFHYBVp=(u=Wq_3L)g*BO1l5s<)X>ln>GRgK^{JsT
zh>foo#>-*Hzzee|mSoNOqvZ<=SKeb7aE~>cYlmMLpJk?znpjz8i4`Xj(Cpu{9F`CG
zxqKmb1vY;epeyGnGy=e+C+OJQYm?3j%*oA-h>D70U!S__i3`*|oW~9PrxE&oV~b{(
zY2A%QL6t8f$4@Ce8tY{ezQMTnYNi5vuY7A<MUM@Xwi!~U=4e)io5>Sz>1wl-e2=NB
z>Sp=od5kHNpvf`_K@yZzRH|1)n~=S{bs{(U+-~lX2^Ap4|K|DK>=>;)$s)FY@z5%N
z^?_J)i*HqUL{O0B+}aBy!_R3w&hLbOhdar6WT?dCp*>kqN<z4`5qhT`jTjXQ|FS0+
zm<f1&dD0T%XK17w&kJzDY6NoXtFma%ZVpa;yVCO+Ev6;n8(|D~T8q;vC?}DQkzN0A
zbaK+c4}5r4dd8mYieXkKhwB$M33`JJFB=^|bz)I<=yq2(H#}r%vLQHr?Op1pt+wM2
z?!)2mv6-3Zx|>GDfA;ZQPL)hEO(cLYRk?{SnpC<akw~Q7dAGyowq)5>U>JT8*RB;p
z^z`(obh=|x)5j<Zh5;=b)?yp;Yx}l01)TBmzj<o#Um{`~mk-rK=)a8Xb>o>Hyab_a
zjs4Mr$}r=I463s>Bs}R5))QIxa?-wkXKgOctg5=&p<pG(Pg{|;5P$YC!qq@ER=5KI
zYHYEkfT*3f<o5WHFvxGO`}^+)HF$GGv2eZc_B2-){X!0hLw2QBVi+}-%FLHmrkddK
z!l%=mmx~)<woDp{h9{@(tA#M~23z>$yia_K&E+ww8}l*ViK3Ka%bz%hGe-FM`m({g
z6ABCYCsAm0t*HtCXdTQ?@i>C6^P<z~>aRXaq*-k3U_~NPR8cUoN;>`SOnU;Q+N+L6
zr6Mw|Eh(4E2;sy|_Y0aKy~fVpW19QEZf{54BI%U&?ALM{d(^_Y!{E0%fhj(OpqRHD
zlai8*WP|%|hyh=e<d`<z*XOz=!EW_L!5rOSFxbhKy-DU}=uWKOQUaytqbLG{aW$X)
zoK!XxEAQQz^sHd~oFEoXzqqiS+6unBp}|nJxykj7D=>z^z+ZwQh($&DkkT`^qglgk
znD<#Y9BxJQGQ>!FPuk~6&=DLe#`LOO#;hZ|hB$Zt3Z(2;GY??+>7!a>smngvilbW_
ziySUjmt{cPbsOQWKXuokGMU_t@#$&$;&2&vF|OV;udgD+h?<@*x!qMa{Md|L3=37v
zw5GlIx`TCebQ~~{9U30iExs5%xr-kk_A-kX+T|TNM+j8)@%A18`-$HG)@>^h4Gx2U
zCzeiBmrhsAvHcNru+iHJNYTixsjbCU-&Wwx4L<%DWn;2R*KW)6U%je|d-6JLD9Q(f
zZ!1m^021(YPKqQ5qI#<a8!3=>MI&855551z<c<uKEcLHlNMaDkQ2=4%WL;|+aQ8nJ
CgY3@$

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/commandBar_mouseClick_3.png b/packages/office-ui-fabric-react/visualtests/baseline/commandBar_mouseClick_3.png
deleted file mode 100644
index ac338d65330ed5fbcfb2feb9854bca108bc416e1..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1734
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

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/commandBar_mouseDown_2.png b/packages/office-ui-fabric-react/visualtests/baseline/commandBar_mouseDown_2.png
deleted file mode 100644
index 8bd9edd5b815724bb85da34a812277ac128aebcc..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1675
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
PFbjai;5_+<!?XSY2sIj4

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/commandBar_mouseMove_1.png b/packages/office-ui-fabric-react/visualtests/baseline/commandBar_mouseMove_1.png
deleted file mode 100644
index 8bd9edd5b815724bb85da34a812277ac128aebcc..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1675
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
PFbjai;5_+<!?XSY2sIj4

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/contextualMenu_default_0.png b/packages/office-ui-fabric-react/visualtests/baseline/contextualMenu_default_0.png
deleted file mode 100644
index 081f7be878600ad8012e4e611549c0989496c42c..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1493
zcmaKseLT|%9LIki=hm=#QO@K_4UvbKE6zO3WO`*ZM7xxS6)E$q-CCR&$sLz&IARE~
z%(ya{r^Y!tVJr_jFAqx=X))yKnETzI_qvDI>-+hB{`ma&{l3573@^N!I#d@50D!tX
z4od+287Q2ZD%dX<O?iR#SrqO<EC6Wy@|P4CrWyzUP)T>kI{Q!_N+&#Vhzoj<B~I_p
z1eS47X(^lEr8^XX-=c<v#8$&nsA1ZE#NSgW*T|iE(Bg!3lpqDR8i>}i*vCi8-W;<@
zSG7k{qg{}Pjql};AknW~ZpCQk@aMu1E0HvsqmlK>rR6=emF1kC?E(!=O-<*c8BE;(
z;GE3~!BK71g7OZh2R=GsIZ!1JLQsjj2@K^<Pd2Q!{9AaYD;eK?Qk<Ri<g^)9dj{%3
zh{l%C;c(0$=D>JyVPWBQC*QcwZ4Cr~rIpnkkw|np&pGd5h~hytWx?cR7RgF9N0{3e
zd$y#pu~D`m3wbp#Ff%<p{VF;GtB6sX<B{o8mN1glPdO)qLg9#%=AhYW8SZCqn--#|
z4v-rWEY_Qe=9}Di4_+RP3vfHWzjI^b6s8ouylJnP3~;&JnrKr~)1IqON2F&BQ=ATY
zEiAuONR-zHU0&*bYc984*)}Z5m1Z>t^PeXVT0sd~D!kg6$<|v@%@fFXxp{e|*K{wM
z9{>vo3=M@Owtr!5ZSAF{LdPgLFg06STYE@WOVn1}W1$WLVfqNlt4XvJu>CD*+|VJJ
z$9G~o`R%cb4P}>FD9Iwxg|m2ku3k3Q004w2b_mlkDXn+5LoRoK(iLNx^vDxDx<qpI
zMnnXE;gdmOAJGEH8P`<hwY6Nbu(Pwn-*$qjrp(RH^Ph$e;QP+`YBx7G<0=Rg`L->Q
zNL-TiA>tAeFuuc723}oKg<g$TQc}uiGA(Q?StcVRBRASPYnwEGB2f`|_6)?3*WA1}
zyIZ^>YH$95riTd2>!rJ8>ofGcwNy0q?OzB4@KiW*ibS#3|FF3Dh{GAM8yOu<Z;YJk
zn326^lf!E&&u||4WTH`nuC@tuL*CtceqjbiVi17;WaWQB`e(>kwou`=WmYcbS$j^+
z?|wfzSCS^a0>hawZt}PMzk$@OY*qaz45`T7@gG~5jj1vg%x@TOOC(KS!^^0=s1l*f
zW5bdAhI5^*)3y0Wcp0_Ht0cQ)+f;+eRRm5mx9Ysoy$(#RNw;do+zlUC!jv#-I%&yL
zsWfK=gpXG{PBzMN{8c75dwb&wWQ&xa`CdC*h!TII-ak`O!eR}F&X$v`GQ5maWwPjU
z!m-u0wO|V6dHLZ%hN+*WjSW5O6ikS!Z)+p>4aXlG4Ab)V_U5j8_WQ`8()L7?SFVpd
zZ=a%V>=|O5kM9_M;>T{c@pww*7~fNzt{V8wy({r}SN;0p6a=7cEb(<?*FOdTZU>cs
zz{p4ri7ev{@dN8v1L@(9KR8V_tracib8Ke%U7y%?_7$G&E%yG<P4H=9B@OcV3c>X{
z5{cwcDge;7R$nHV2k2*QR73>_cO)>(+J+k&8btkHahT%u^TVT@%OUac+B-WtAXr!W
zkndu!B@hT?Zw3~g*;Nw)QlFWbnV+9u$5jUExZE^MDFB>z>>O{5Wby`#Jd0nTJQiH{
zW_H10s_gpvIAw5_;2}MBIL=}btxn#@`N%{BGw>JaXG6ewG+pcuCplVMr_|P(r(#NT
z>d|O4Wmk?)g^!JmIiYmX4MjlKS~qz2luz%qQ{g?cF_g{a3Y#zWG>#PZVMgO=J6jE;
z+A?DSO5Mf91zccJQIXB9k3Ip~^3@&nq{3bCO?Hc<-~cl9+sbR)h>5#EdW`@(ObD9k
uySiOHQH4iheP8Tyk5otXI{yo`%Z`)f!^#td`{Ter4Y<4Fv9*}MJAVRs#LIC2

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/contextualMenu_mouseClick_3.png b/packages/office-ui-fabric-react/visualtests/baseline/contextualMenu_mouseClick_3.png
deleted file mode 100644
index 54a7dd22e6b35a281b5ae57c5ee01ac128d571f1..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1559
zcmZ{kc~H^`6vuyFNO)o8QQqZt*o8)DMrMecM;@VAsc9ZLn1-b$Ds7~pCV7;{ns?fP
zplEE~R|cu8u18*}iAS!0S7{!Iq%G}#JJZg*@B7Z1_ure(`^G!kpHqPBh5!JdU~PrQ
zh`n4aD=<jhJ#)t$#kTFH)#VTXP<;1866uE&H2^@S%^H2yIXq{9V~5+}uL)YDcHk}D
zXm4ZE7>v@`s~6AGf^->=G>y`tRfbWUEJ%tIviT%f!i(UgH=!pj-E5&;u2B68ZA{-_
zL=$b5fT}{n3!D$$n8$|<RUaVowQXdn)&p?Qz6>5ATd-Fsn^zxkeA{sa;hnqN&?)OL
z$7G<`?NW9aucy`q@^I^zsC_h8kG={h>p9Cj)ma^v0{QPUO^fdws9iZkN-v5j3Un{9
zHi!k6_sx*|X3&W2BO?US+JdRGrN(1DNd=%aNsG<r;~F}iDs;i3DnBmZ{Qb`wWtI>Q
zmPhT{*Aq0}Xh|ZSX=!O$+}aeKXgwYARob4q!z|xHj-(4UH_aVP+@-BOnDl!1uw<0^
zDrG+#cK)eEQy{|P!cJu5N)e7^lu7R9v2#xmU~o8DPVJ~}b|(v8<>Tk~tA=1@#_3Aa
z@l5&oFyg=*bwji^7rXheVElW_de-JLE=eU|JlZXza*DSd5?tfHD7^D(I1rZIS=-o}
ztTXjZxD3lYFD~HT@bKl(u&_@pi5fR+-2a>oe&xzAxj6y!&cF|=%3)|bK_HM#Q8a>H
zCcmOOT3h}C=U{+Hem#^_Jyl0hnGUNnG&O}_v9}ipU&dqr_l8JpK*w}2e|DC|Vo3(q
zXuhOUnM45|jzD<(`GHg)%FKki5~UuEHX8L*Tw`A9860$3lwne-va(9r@8Wmthj0&2
zqHAhSB1v1C`yKMoPEI>w<KmbhJo^I_OmQ!*OTHp*%Q-0MnE0xpHz<V@%@5TqyDz#i
zTt@2%N<dG4zw}jMqM@OoMDc*@W^@}=UIUlfMt*iKd3MD8sG6dVS;ACnGJ7U;w#&D?
zs>;X9OM=7UxVjMt#`v-N__ejQtO2{#0mskjsdQ%CKG$RH(jN5Og*Awsul^4heu|I{
zySI0Hw?!(v8uc@z{+G8GE4EQ~U4?op-B}z_n$8k6!0F@(WroIgGaJl7VuxY+=A|%Y
z6gVLvA#L<x*AND~%%lakLst6P{_{%qq%b*@v+bPXzhgJPxs1zDf5#IHpez0;H9r<7
zBp%Kkg8=Ht1~pQ@ZvP=25%ZEf3S2~|gd-cd>)}YnH{(ir(%<f$8LN+YHkaJ&?TD@5
zhkfefg|E(Hu^viTkG3ceEv`xh<Tgy5JaFA|&tr2>PaUMT5|_u5YiXXk6^_)-IYm&6
zM@z;jYO$J{fUm-Ogx@l^6D%zWjzNJz_n+kC^mFNSij{t}xvt~NQri<7&jP`BM<`e2
zK2_k|Ht>KJT<m&nT9OM)tVX^c8G&3C7V?|EYL&YX7bl|dfesEzfNr{tzfT}S1Hh@F
z^Ru)2Iv4nS05H)^qBLsL^HQW5y1&JQ{Kd5!sv5gK_{yg>DTPO7dvR`sguMQ2lHa{|
zccQniuQUn_G}RHlP`X|uvY~Hw)^a`<7SFez`_0zY_I*S?UdKh$OOKpxS3wfj<SB)^
zkFC<+83`TGD6`<d!K_JG;rpV&%IfL|OG~$^Ie5-#OiG)+s+yVvAowya3y5Dx70IPJ
zQK9mn3S&$7?iluDPfIM@EAV5b0)xSj@l+LUY=nmRFbf4Gd!>xfPfwYeLgUeo+I)4%
z_n?v=$~;^1P7^1V!b5%PYHML)e)Xh18t=qg>0@5y0>2AdKa^f!Pj_VKk<Is|z7<1X
z!7OkDmwCR4rPJ3JC-39&;-9GZIJO}YO$tQJfDfhghA?`G5ou%V!FV)ja(|Ep=+MQ!
zEHZR4vcV*TdtM<g5wXXjqz9dj;U*dzPpSpET{F<516v=Hp0kd~{v;^dzr#<AC@&Q)
RZi$l~u(q^Em!hsl{{yRP=nVh>

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/contextualMenu_mouseDown_1.png b/packages/office-ui-fabric-react/visualtests/baseline/contextualMenu_mouseDown_1.png
deleted file mode 100644
index 54a7dd22e6b35a281b5ae57c5ee01ac128d571f1..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1559
zcmZ{kc~H^`6vuyFNO)o8QQqZt*o8)DMrMecM;@VAsc9ZLn1-b$Ds7~pCV7;{ns?fP
zplEE~R|cu8u18*}iAS!0S7{!Iq%G}#JJZg*@B7Z1_ure(`^G!kpHqPBh5!JdU~PrQ
zh`n4aD=<jhJ#)t$#kTFH)#VTXP<;1866uE&H2^@S%^H2yIXq{9V~5+}uL)YDcHk}D
zXm4ZE7>v@`s~6AGf^->=G>y`tRfbWUEJ%tIviT%f!i(UgH=!pj-E5&;u2B68ZA{-_
zL=$b5fT}{n3!D$$n8$|<RUaVowQXdn)&p?Qz6>5ATd-Fsn^zxkeA{sa;hnqN&?)OL
z$7G<`?NW9aucy`q@^I^zsC_h8kG={h>p9Cj)ma^v0{QPUO^fdws9iZkN-v5j3Un{9
zHi!k6_sx*|X3&W2BO?US+JdRGrN(1DNd=%aNsG<r;~F}iDs;i3DnBmZ{Qb`wWtI>Q
zmPhT{*Aq0}Xh|ZSX=!O$+}aeKXgwYARob4q!z|xHj-(4UH_aVP+@-BOnDl!1uw<0^
zDrG+#cK)eEQy{|P!cJu5N)e7^lu7R9v2#xmU~o8DPVJ~}b|(v8<>Tk~tA=1@#_3Aa
z@l5&oFyg=*bwji^7rXheVElW_de-JLE=eU|JlZXza*DSd5?tfHD7^D(I1rZIS=-o}
ztTXjZxD3lYFD~HT@bKl(u&_@pi5fR+-2a>oe&xzAxj6y!&cF|=%3)|bK_HM#Q8a>H
zCcmOOT3h}C=U{+Hem#^_Jyl0hnGUNnG&O}_v9}ipU&dqr_l8JpK*w}2e|DC|Vo3(q
zXuhOUnM45|jzD<(`GHg)%FKki5~UuEHX8L*Tw`A9860$3lwne-va(9r@8Wmthj0&2
zqHAhSB1v1C`yKMoPEI>w<KmbhJo^I_OmQ!*OTHp*%Q-0MnE0xpHz<V@%@5TqyDz#i
zTt@2%N<dG4zw}jMqM@OoMDc*@W^@}=UIUlfMt*iKd3MD8sG6dVS;ACnGJ7U;w#&D?
zs>;X9OM=7UxVjMt#`v-N__ejQtO2{#0mskjsdQ%CKG$RH(jN5Og*Awsul^4heu|I{
zySI0Hw?!(v8uc@z{+G8GE4EQ~U4?op-B}z_n$8k6!0F@(WroIgGaJl7VuxY+=A|%Y
z6gVLvA#L<x*AND~%%lakLst6P{_{%qq%b*@v+bPXzhgJPxs1zDf5#IHpez0;H9r<7
zBp%Kkg8=Ht1~pQ@ZvP=25%ZEf3S2~|gd-cd>)}YnH{(ir(%<f$8LN+YHkaJ&?TD@5
zhkfefg|E(Hu^viTkG3ceEv`xh<Tgy5JaFA|&tr2>PaUMT5|_u5YiXXk6^_)-IYm&6
zM@z;jYO$J{fUm-Ogx@l^6D%zWjzNJz_n+kC^mFNSij{t}xvt~NQri<7&jP`BM<`e2
zK2_k|Ht>KJT<m&nT9OM)tVX^c8G&3C7V?|EYL&YX7bl|dfesEzfNr{tzfT}S1Hh@F
z^Ru)2Iv4nS05H)^qBLsL^HQW5y1&JQ{Kd5!sv5gK_{yg>DTPO7dvR`sguMQ2lHa{|
zccQniuQUn_G}RHlP`X|uvY~Hw)^a`<7SFez`_0zY_I*S?UdKh$OOKpxS3wfj<SB)^
zkFC<+83`TGD6`<d!K_JG;rpV&%IfL|OG~$^Ie5-#OiG)+s+yVvAowya3y5Dx70IPJ
zQK9mn3S&$7?iluDPfIM@EAV5b0)xSj@l+LUY=nmRFbf4Gd!>xfPfwYeLgUeo+I)4%
z_n?v=$~;^1P7^1V!b5%PYHML)e)Xh18t=qg>0@5y0>2AdKa^f!Pj_VKk<Is|z7<1X
z!7OkDmwCR4rPJ3JC-39&;-9GZIJO}YO$tQJfDfhghA?`G5ou%V!FV)ja(|Ep=+MQ!
zEHZR4vcV*TdtM<g5wXXjqz9dj;U*dzPpSpET{F<516v=Hp0kd~{v;^dzr#<AC@&Q)
RZi$l~u(q^Em!hsl{{yRP=nVh>

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/contextualMenu_mouseMove_2.png b/packages/office-ui-fabric-react/visualtests/baseline/contextualMenu_mouseMove_2.png
deleted file mode 100644
index 54a7dd22e6b35a281b5ae57c5ee01ac128d571f1..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1559
zcmZ{kc~H^`6vuyFNO)o8QQqZt*o8)DMrMecM;@VAsc9ZLn1-b$Ds7~pCV7;{ns?fP
zplEE~R|cu8u18*}iAS!0S7{!Iq%G}#JJZg*@B7Z1_ure(`^G!kpHqPBh5!JdU~PrQ
zh`n4aD=<jhJ#)t$#kTFH)#VTXP<;1866uE&H2^@S%^H2yIXq{9V~5+}uL)YDcHk}D
zXm4ZE7>v@`s~6AGf^->=G>y`tRfbWUEJ%tIviT%f!i(UgH=!pj-E5&;u2B68ZA{-_
zL=$b5fT}{n3!D$$n8$|<RUaVowQXdn)&p?Qz6>5ATd-Fsn^zxkeA{sa;hnqN&?)OL
z$7G<`?NW9aucy`q@^I^zsC_h8kG={h>p9Cj)ma^v0{QPUO^fdws9iZkN-v5j3Un{9
zHi!k6_sx*|X3&W2BO?US+JdRGrN(1DNd=%aNsG<r;~F}iDs;i3DnBmZ{Qb`wWtI>Q
zmPhT{*Aq0}Xh|ZSX=!O$+}aeKXgwYARob4q!z|xHj-(4UH_aVP+@-BOnDl!1uw<0^
zDrG+#cK)eEQy{|P!cJu5N)e7^lu7R9v2#xmU~o8DPVJ~}b|(v8<>Tk~tA=1@#_3Aa
z@l5&oFyg=*bwji^7rXheVElW_de-JLE=eU|JlZXza*DSd5?tfHD7^D(I1rZIS=-o}
ztTXjZxD3lYFD~HT@bKl(u&_@pi5fR+-2a>oe&xzAxj6y!&cF|=%3)|bK_HM#Q8a>H
zCcmOOT3h}C=U{+Hem#^_Jyl0hnGUNnG&O}_v9}ipU&dqr_l8JpK*w}2e|DC|Vo3(q
zXuhOUnM45|jzD<(`GHg)%FKki5~UuEHX8L*Tw`A9860$3lwne-va(9r@8Wmthj0&2
zqHAhSB1v1C`yKMoPEI>w<KmbhJo^I_OmQ!*OTHp*%Q-0MnE0xpHz<V@%@5TqyDz#i
zTt@2%N<dG4zw}jMqM@OoMDc*@W^@}=UIUlfMt*iKd3MD8sG6dVS;ACnGJ7U;w#&D?
zs>;X9OM=7UxVjMt#`v-N__ejQtO2{#0mskjsdQ%CKG$RH(jN5Og*Awsul^4heu|I{
zySI0Hw?!(v8uc@z{+G8GE4EQ~U4?op-B}z_n$8k6!0F@(WroIgGaJl7VuxY+=A|%Y
z6gVLvA#L<x*AND~%%lakLst6P{_{%qq%b*@v+bPXzhgJPxs1zDf5#IHpez0;H9r<7
zBp%Kkg8=Ht1~pQ@ZvP=25%ZEf3S2~|gd-cd>)}YnH{(ir(%<f$8LN+YHkaJ&?TD@5
zhkfefg|E(Hu^viTkG3ceEv`xh<Tgy5JaFA|&tr2>PaUMT5|_u5YiXXk6^_)-IYm&6
zM@z;jYO$J{fUm-Ogx@l^6D%zWjzNJz_n+kC^mFNSij{t}xvt~NQri<7&jP`BM<`e2
zK2_k|Ht>KJT<m&nT9OM)tVX^c8G&3C7V?|EYL&YX7bl|dfesEzfNr{tzfT}S1Hh@F
z^Ru)2Iv4nS05H)^qBLsL^HQW5y1&JQ{Kd5!sv5gK_{yg>DTPO7dvR`sguMQ2lHa{|
zccQniuQUn_G}RHlP`X|uvY~Hw)^a`<7SFez`_0zY_I*S?UdKh$OOKpxS3wfj<SB)^
zkFC<+83`TGD6`<d!K_JG;rpV&%IfL|OG~$^Ie5-#OiG)+s+yVvAowya3y5Dx70IPJ
zQK9mn3S&$7?iluDPfIM@EAV5b0)xSj@l+LUY=nmRFbf4Gd!>xfPfwYeLgUeo+I)4%
z_n?v=$~;^1P7^1V!b5%PYHML)e)Xh18t=qg>0@5y0>2AdKa^f!Pj_VKk<Is|z7<1X
z!7OkDmwCR4rPJ3JC-39&;-9GZIJO}YO$tQJfDfhghA?`G5ou%V!FV)ja(|Ep=+MQ!
zEHZR4vcV*TdtM<g5wXXjqz9dj;U*dzPpSpET{F<516v=Hp0kd~{v;^dzr#<AC@&Q)
RZi$l~u(q^Em!hsl{{yRP=nVh>

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/detailsList_default_0.png b/packages/office-ui-fabric-react/visualtests/baseline/detailsList_default_0.png
deleted file mode 100644
index bb28afbb8bec387afcda9bf20fe8c5086fa7f4c1..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 2677
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

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/detailsList_mouseClick_3.png b/packages/office-ui-fabric-react/visualtests/baseline/detailsList_mouseClick_3.png
deleted file mode 100644
index 86d8ab84f6aad57da77d9f3b808b90b0f4a0b651..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 3527
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
X-j9JOY6a^9XaQKBI%`HVagY87t5r@R

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/detailsList_mouseDown_1.png b/packages/office-ui-fabric-react/visualtests/baseline/detailsList_mouseDown_1.png
deleted file mode 100644
index a985620fd2fb6b017e20ecd24063a3e670c869d5..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 3417
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
CT^o%6

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/detailsList_mouseMove_2.png b/packages/office-ui-fabric-react/visualtests/baseline/detailsList_mouseMove_2.png
deleted file mode 100644
index a985620fd2fb6b017e20ecd24063a3e670c869d5..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 3417
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
CT^o%6

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/dialog_default_0.png b/packages/office-ui-fabric-react/visualtests/baseline/dialog_default_0.png
deleted file mode 100644
index ff4ab58f930d4781c34c645c8b351f556ca59114..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 4231
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
O0nmW!!YWiPUi=GrBH=3l

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/dialog_mouseClick_1.png b/packages/office-ui-fabric-react/visualtests/baseline/dialog_mouseClick_1.png
deleted file mode 100644
index ff4ab58f930d4781c34c645c8b351f556ca59114..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 4231
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
O0nmW!!YWiPUi=GrBH=3l

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/dialog_mouseDown_2.png b/packages/office-ui-fabric-react/visualtests/baseline/dialog_mouseDown_2.png
deleted file mode 100644
index ff4ab58f930d4781c34c645c8b351f556ca59114..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 4231
zcmc&&_gfR))}2rVDT0&$0=^)Mi1gltM5K!-MG|_IE`&}1MXG>+g7i*k(go?#M5RlB
z0EQw>2vtfz+8yp+aDVu|d-FUq*_oU<d(PQwt-YR!dZ?>TOU+IV006DV1K1+~fLsUT
z;!70ZS%p<R6#Sxce_-MX0Ce3K2jtxyIt~E1BC7$r_t-aM1MjA7KxC)f-g4dKAobJ~
zTkq+RFt8C24}HcXAat8i+~iGy2FpmdL?efmc33y-Ygpw?Rk5TRBN<oK2L;CqEHMM9
z7_UTJv}f)Q?FU7VFI9ihNAYNA;mk6RJNI6z1!!J&;m(=Wv#Q@E5;G`|4o(OM(RuvT
zk&$F4YE1x-ra8@Z9>y+!he!0k66Dp1hn%AWDU5>SEyrdnfA#mC_oyTaSON@%>9gmr
zqDOn6GUDo&PSMQvgETpZUgT%YTE+uiiPYEgN1!PG5>wY+aqjhd)QgMPZ(&F<`LEuv
zD`E5#l3r$HEWWLAAo=Pb!2_kyOi6e|OG^u7XHOJ*`Qx40CCAQNjeLU9z#sqC;);qd
zINW=$+qY5cIMH%sv()^ti=(5)q0&{C+t~Lkb`cM$yC{usK(N!(G1k3txs{cAO>f@{
z2nxas4GlYq0Y`t9!nVXml2v0J)o63$cRVhJlR=o8*2SPSX^uQk&(3ZmKjUyv@2weH
z0M{BI{pHJ-hsMV5w>?_Sg#7~oL}g{8?1!=}hq4rL4Q||G;^LA7w%GeW8$Bsq8#pE^
z%_)KMryr>)>8`1mnQ;L*&CMLdt=ZmM`=RX-b#BY!gN?MH!&5X39o?^~k50Hx9=tbi
z-O|_BXYfYkR_}#9GyeFDnM=VpL^0qXr?gblC#Y<UeP`Cm$*Jq__FM;P%h_MT#gNzc
zt#P8i$K1E)?!8S;UK>|3%C;`?IQW#5lmzb4eKZ>VbKzCk8mbZT2}NK5a;mFEe~Dr^
z_iM^HF&<!fG9ZsoECrXqc@0QHL-P2e884B&t*@8DqhexW@^uNTtE>9XQt5JWdHmn!
z=5l`g{CUmebygOat-JffOjdC0^0J+6U?5_3ZSB#Q-rg}=sdODSE-pIxq6m8KL0RFc
z9hpqsLJUT|Ht;~kfA24234QKSZSRkCWf_@boO6Aob@#M=>r|$$z41BkzVOUWhOT|T
zqBckTIp$<#_FVsr=o{y!!Q)TGLPKFG0>$c;4J%*uV_PO3i^|DGmzD|)V5}@H|MA|K
zB5#=HtRGk#E0eUplbV_;6L=`1bbjLLJYBETiXaQgl=sPNZ#S<ELLxK$>zN)I7?7s)
zF?-@cgz*atPxQxlQCzu`J;Yi~4?Hw8i^J$;cM|qXcTdpDSxQ0dhH7Av8Q+E2s?#CN
zkiTKMF~j&dDJ7kS#oX4!{IdLvs{g0;-+1>d0z(i<6vZ$IoO<WUyi|L!RK~v&>jxXt
zBB|O8DK7XX=B}<T%Uxb%+~U$w$I|mx$op(G6ut^svV^bSzjv~l2QpZXsW>`1s=oBK
zumC{#M9R(dUvCXMmeSPH;;rB)QQlpx&1#rM%R8Haz;c~wY0TNFcg3@N()P_D^qL<r
zspdhj6BDclQE#)evxhO3D}$M8af7Chcfwy}J+PO$diAP%Gu~b1TGi7J4h{~HPTARk
zf2f+8n&ybdtO)My8v5Fy?{?q&`bPJDEf1vYPsG=q!}k3S*q(mvR~oW!u~G0qBw7Vw
zvtC?bY^LI*p%@t%35|=3i|mWPCYyK6Dr#m_ffzx0|LTqkdo7wY_6+XrEj9kZG~(w^
z1eAsXJ3jtpKiLh9Rx+$WL=6t=E-o+Um6vOKuBJHeAcVpTnubca+$O)4d|o|>?yi)l
zw}MDWNrev%4o2#={B-qE%?=+xcP47%@pxRli>c}}X()|@vvb(&mb$$?W-}=VHqyKp
z{Y2ncP?U==3&&?{Zq7YkY0m92Y3kPcuBxx<>MdOhD=VIVj-z`TJy&?bhg6@5Kxt&q
zCo*j(fBO8k@=Hpnl(O}F8i!W8vJ?Zbj<u8Jrk(`>1|^%GrM>x!SEzC<L?XX^)4*$$
zmzN7_>+0TIyty97DL>~W$J&x@yqXDz1<c-J0WrASBuG73W2=STKnk%&$Ha`SI&AU7
zn^v>dlra7Znsf;OI|oNs1+qD>!T^EDc!RM#Iy(CL^{a}HkB@PVU#l77le=Yyb-x$L
zZkcOz0}2scp(w(5&&TY^_yoMGv>=O?_H^37a#i}o#f^i5bObdKXjs?0inn+Da?vgb
zJCG&p)p5*s48vmC+_HJcpz)8-5w~Swn~?qeeRxnlD?m+6z1>Bxd}Gl})6Y*96gLnG
zSm_Xm#Y6>C=K12+7er+PN5|U;Ay#&F_9~Bs`@nDuoU?3o)e*%lKC2Q3*U_P!nw}nO
zh*Wbs8C>sLT)YvI;^vpGT@*=7URzt6bC<!&?alnAivo!w`GxnLvXN$-5ffa$ASR~}
zQ&{-Q+%|{&>baP}T}7pAdUA5|AGX6{pMktjjfjdWX<XFuO9-q9EPOY|c&JLqY)M|&
zoZ|H#k`fYOZEZ>ev;>FqRk}Q1(U8aoG{PO=i8L~@Tjb)`|2`;C2q`zb^P<B7*J2~e
z9!rH3HdzpU=kco=>Xg^Rw*+}?Xc!(q+$<RdJH~Xqix!FvR(A=!iH3r-2!k10b!$7K
zAWT&1{rmcffz@zc9*=LU*~$KdIlq8_s-0a?Q~$jC-0CO>2zmXQ=JAs!5MMvJ;FUp6
zRBP(!{d|VZ%*;;#M4@L+PN-f<_SmXPXDAdJGP@P=%|;cCZfp9vvO9lvdc1bH)k@^5
zsj2ZIJeRrVyOQZ+Ap#W<6@_3%OUC7shE_&7N9Wxwyu6seIj0-kC;{*(_K3tX0!*%G
zbJJB@N5?U_S6;UcP4@C0qVYL7P~|v!6FWBM_*dEUq^1UJsTANpCwrrM@6*yci*(Yx
zg6Uua@CU)c?O;bKr=h1W+x7SNf7{V<59JSbmg-4o(BEi!cvRaRr;hgY^rW4_Ox?gX
zqt67VA|uiC^sKd;?5~c9h<H~~Q6WnJ7ia(?Y9dzRtSf?kOq4(%SeJ^YP3{ZYTx&(+
zoTWZu78VxLHZF3k3}u&%=5FM<s4+zu1LP#3#kpbuGYCk*tto%c4K=s*)Lky6z+x{H
zs-*p7<V&{V>B*62k6rC;sr0++tUv8)9ns(NH$2-Gx<}(D`#`ct1TRm8^D`!Bi2!MR
z6+NYObrMDUT#Eh@m8T624GV`m3t#*DyFsnN9xW{`Z6BYy%Vl1W+|Tc*<v@8t<}$;^
zqZEF_m^H<mqN1BLw6rCoYHDf@uC5foV<RJLD=QKJl;$L{Hn0w_TZ7NfWC_n35f_@*
zw-g=F(w8F4D=senYX{t95CQYGLrRxT$FW$l%8B$h9((Tx>^^eWHaI<d_F{U&5TjQ4
z1iXU6+nm03@MDlCjlSV!P29vc10n0{&ikY7O-<}6Ldedt$~N}hRE?IilU=?2<+c9m
z{k65t&HE-MY#}MqR!AWu#77fB7EqobH<L8PgO>yJ&4W)-IB(F_biKP{G(0<7*{ILG
zB{PD>VvA2_s;wjJOrAVp2H6lE5s{FPkegKqpDrpaB#(`a6^++hoo9yYGp+JC?4+ME
zCGs<{jPXJ5>Y7!u>gecP$U$APP=|vD6*7*31Om?ZAVsb3%D>6}|IGOF1_dfHNl89r
zXJT?f0>i}Lbswvq>2ugT+ZBc=(C#KcDgMJ?-lrqE7@UHJh9>932c1lxz2Ev^Av#Kv
z>EnA}a!9*=c5NViv$ZkP8UO)wF$U$~HWt9$d&=i0;$V;P07uu=*IR8&ee^v!6a{_Z
zb>vjdFz9VTKbcok!}#ID2jKI}&2M)=+WdeEQkI-}A3Q&iKnTu;bF;C9PCBzFFQnd`
zRQ5!3WLX)Sm{0+S8x6Bw6RR5=aBFMcgH8P9n4TA`!e%-7`J^l{@Y<{%t9$C|5po+l
zzSxZlv(~f>QsZvb_Bjy2`V%o&^Eumx>-c6?y)1>$9xEzSx|a2wep~TE({nZzt>J3x
z-iIb8QB6&9#)2%Mx2Zyba^~@?n+jY*r)xugZS7TgpUp75t5GnUS&J{E8DD{J@>k#j
zZOg(baaP^Q>CRxba{SE9%v-MXx)@er65zR~XMP21NxOI>-u0SNAQYpU`2z16F<?i!
z{YNdot&OX)^?)6O*Gv!*iAwicS0;6!dfMtQ3HB`a`A%{`B`7EehjE6($;Zo0UV=Ib
zgy3C!)7{#rfKNVKT!2Mj;5DGivWo)v9LpgM0DOFWYu=!X*E@sUy_fKp!?E$34av4o
z6|&iz7TE5f<i0K~ZG`7~Fm$$ibC0p!Z`aOwriJa8xTTInasoNIxex;bgTtj1^X*>l
zV27+kTN|6X#cxR$ximF3-H#7kGUQO2NUpzp)R_zrVK-k)()aJ0`+^?(Yhw%(BLp`=
zRmHfvEpQ=2A<3Zw>C&W!$HMLb0rG=ciZO|aj3<W+@oA{b)YR@fzu*dff5^bvb%QQz
z%ocod04N)a-fBD6Jx$V8O@TGI;(s7-Jq=!AT=OVM|GkO}rWj_#j*LJ+<f+GVS=!i;
zft)7+0{^aJfVvb?(4nTeNIT;~z&wHbV@Ad0<=ttLPFP#;0|1p1mjNgz=a`@#B^(Y1
zJw5+Lt+Y~vIu>?5FYFX6QsfbRgt*a%{{VB-ZtXouxAY{4TR*DLX>#}+2GS%yc`Q(X
zdTl9{&H#GHsj29+G<HCkw6vgr%*DmUxbe9y?f^_wHNBC>kpozWrMmxF)W}c_V2PmP
z?A+V)5}>mm5ltVEL9H>NPxp;3Fmt@sKA}*QRn|Vj#LS!vstPYJuZ-94H_NAa;0Df;
zYF;@rXJ@giZlQczamaOrp^)=Gp=}$L4$R7z0tT~!s=#i9L;eqgGkRRh>^kAGTp{>o
O0nmW!!YWiPUi=GrBH=3l

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/dialog_mouseMove_3.png b/packages/office-ui-fabric-react/visualtests/baseline/dialog_mouseMove_3.png
deleted file mode 100644
index ff4ab58f930d4781c34c645c8b351f556ca59114..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 4231
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
O0nmW!!YWiPUi=GrBH=3l

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/documentCard_default_0.png b/packages/office-ui-fabric-react/visualtests/baseline/documentCard_default_0.png
deleted file mode 100644
index fa6f8266b75226dd17de79f83ae464397269b56c..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 7466
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

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/documentCard_mouseMove_1.png b/packages/office-ui-fabric-react/visualtests/baseline/documentCard_mouseMove_1.png
deleted file mode 100644
index fa6f8266b75226dd17de79f83ae464397269b56c..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 7466
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

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/facepile_default_0.png b/packages/office-ui-fabric-react/visualtests/baseline/facepile_default_0.png
deleted file mode 100644
index 6f8a00a25d83d0d8d03f5fcd49f0bbfd25794c41..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 5163
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
Z{{c5I37V3qU&8<Z002ovPDHLkV1kv0_vrut

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/labelDisabled_default_1.png b/packages/office-ui-fabric-react/visualtests/baseline/labelDisabled_default_1.png
deleted file mode 100644
index bd0ed062c42ab6e35244ff7c867734dfdfb2e558..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 853
zcmeAS@N?(olHy`uVBq!ia0vp^%|I;6!3HEdKi&@oQk(@Ik;M!Qd`Cc-ajG_-Gy?-O
zyQhm|NJit^S^KjeB}g2%FE^23S*WYZ*Yq-BWr#+~hUVsK2MyWJ;%P4*T{)}h%r1NH
zk{;hnr6mb30ygAoiB%nb=xu8<t77T#k2PwB{`a0QuKD~=puPqO6gUo?e=jERPgaGe
z$?cFr23D$$>BqkF1r}HGf9?C9>s0^gX0Cz6hc92ggdaOqZ2SI3<?+8-^F!Y}dG*ED
zWcJzjVL#SSOm(`TGgs2){N?qv_m3CK@El%n|NZ5xts8P@KP>17;yPZq;`-~AzKb*-
z{rfjhqwCr=_dpi`mJlsbKYxGmb!TH=eYKi=vgKicheVr+RB!98(!X}!E$r-;#ptas
z{kd81tg-g(A9=qb%@P;SRP0M$byaKK>!RA)vk3+dK75$)`E&7<ARD0Sd;2$UcHVvW
zSn1s>zdly@2(Xk`$=-TvrmwHBeLTb~P($Q{O@G$bU4`~bMXIZ-E9SN5-u_Z$8y6oR
zzAGjsrl6>3Q^542#loL{Ewg-<xY!_KT5F=jn|JS+0<@+Y_)bpR$Z?>=%6D)5ylX%I
zuHLujVn)kjiz!~J3|dpYUhTO2a>~t|WykL>ng7`0*6nS%3~G~4dWl~)v9z#=SaJH*
z&b~eSGW#ljXiJ|kX}p<p?C@b`&q)iWFe!LWTDmn+;*rHUH{0{)&h6N}`|+nwLHe<g
zzn2QODK^M4KY06Ack^?rZ6AG$&m5jUUo9^$k0HZE>dNb{SCX@*sh=_Nopn~t-Q7JV
zHa2mV+S4M-;QcpqroBpvymsmD*=@!L)8RS~87v9V2+$F`?w7bNckz@<uj52qwX=^u
zHvC{M68Y<B;hOpLE@rSC`1kK$&~%Hw>FW+g+Fak*n?EaAZeLAWLG1L~x1*aBB6h#t
zmOER;^F`V2D_L8w9I>~zzx?_uL&nyqs=Kk*&u`LMq_OD!`{31AUzAu$v~9fd^zYxf
zdE2=+6eOK|Wa+NC)nM*<|D4-DfC2ol{SSN43}t&OPASgj1rrT8FsYxcF~7Jj^zO2G
Q2h1l7p00i_>zopr07<=`RR910

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/labelRequired_default_2.png b/packages/office-ui-fabric-react/visualtests/baseline/labelRequired_default_2.png
deleted file mode 100644
index 146a0760cb6e7300b9c814b1a2c3e0670717b338..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 903
zcmV;219<$2P)<h;3K|Lk000e1NJLTq004sk0012b1^@s6iSgf600009a7bBm000ie
z000ie0hKEb8vp<UIY~r8RA_<inm<b;Q53~bmbD8QQl(L3K^F@_=RHeP4kGyg7HI@O
zz;m<_d(%W1u<!#Ilr2VU{~#oVg-TpfnOLdCxPj<`5!_<ATP%6&xRXDli4na&2$RW~
z`|f#<!<$S<h=>Rb1K?A)4KQy94g;g%FfbYp1Eb+EFd7a6qv0?x8V&=a;V>|oPXHjL
zL?)BbA4(~^X6Q9ZrBW!BN^KkO={mNmJ$KBP)_x0xJm;UE)#aVAxVYGD3tgeOvVzFi
z7)H}+{5Uwk&(l+UouB91#7E@I>?{D_`@(|f+&2s-Cnx%SZL8Vd-iDMCySuvpfJ`RS
z@)nlM<zQJ>)9Y(`ZS2SOQc75sh2!Jn|HiIqrBcb$!>?aGy&b(@LbEk$)yGrKkDlIM
z{3@3*noi^Q{XKemd;bbVL_!E!UtcFbgb*}0H%E7OcT_AENeDs9%ga=$RLFH*5<*a+
zQ1Gp-addP<M5OEMT`z<nAq2Uu>!}q&P^D6#LZRT%Yud%d1rZTtvsuqv{N`0pZ+CCM
zxz*Det<h6oJ3BkRKKwj3>Upub={XV+wRD>>3<KeC7(+ut0D!)}K18EY#9}c3!0qjA
z!}{^@aRAWuuItvlRw<>&1%UnieJG_6jYcstG6Dd&y1Mdc{r&v_fOtIK%5>gj??!9%
z*q3RVzCQdsHllxe+H(Zj^ab+r^0Ka0tyXb(c!+Yj4BNH=0OfMI<*^;d0RUYK{0pDs
zI8aJG$MT!%{gO3m<S{56f0|fbT?GKl%*-H}Oa^{zjmP6K3<Jqz(pT#wuhl!q8da;+
zmOTcg<4+Tg;~)}=AQp=?+(GIwIXQ`ZK9B3`YhTT_ZLQ^UIghTCLO!3z&CQLk-pSrU
zXtqX==dic82LKoz9&YL}C>;;O#>NKD&(C3579JiR0@s_SiHV5`BoYZoDY3S;=Fygx
zmXJs!kV>U6Ffib$otm1$;NT!k)AZF}+FL1Ax3?d*Z9___Up1Pokzp9fX0wn|;_U1U
zTU%QQhr>-h1|>xFzWxI#rG!$dE!*ZtgMV~lG#my-^X_gF%=6)$fzfan7!8Mk(Qp_T
d4Tpiz`~d(REUQB74MzX~002ovPDHLkV1oa&pA!H8

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/label_default_0.png b/packages/office-ui-fabric-react/visualtests/baseline/label_default_0.png
deleted file mode 100644
index 09c3d0b1bb8b90701f1a06a5fbc3e8f3beb3ec1c..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 648
zcmeAS@N?(olHy`uVBq!ia0vp^%|I;6!3HEdKi&@oQk(@Ik;M!Qd`Cc-ajG_-Gy?;Z
zm8XkiNJit^TO0k90!5B}+@I#n<?QP0o#bfzJu1mlr-DW5KEpG`HJ&;(44tw8+$I4L
z3=0=DT}U)+VbNW(!8&@!JYH#5mR@Pg{Vgpst)JiV{`B<F1WN(IgAxxu>=sY>Cojgf
zSck_gQle**fkbMe!Kp(DQ(6yda5o3GGu*2_^>ov`FZb$CC;f{(9)A68)bGnT&Vl4t
zm><6I`s<g!ug#)XU;S_|c>Q%ojp?VQ^EbXNn{B{Tes9wCubJC#SG?yuJRxuU?vFEm
zI=dXPRKI@x`X{mHb40pbE32v|UCdB9XSs97jtM_&^a4dXi~ZP|56<4Y-fC`NN5{4O
z<$qU|u6gx%j_~t2E`cgaO53+@_dY(?&wWm@(fsqN1`;~GYiAeF&-r31$ilcWq9;U)
z)xl_{id_F>4;6-rnwpr%`l2GH1z!V2az*ci)^fErty7<UmZ_k=p5I~f%_RXE0{zE5
zmtXcyezrb-{>2odnR~3aMd<9<y*t@#cA(Z&h8btm<mV+%x0~w4>hL<Dw&DB5<t>R*
zPoMT?ICuX1$>*P=?{BMHaz1Hegq5AGttto8r=Neqir;tZ@1MOQL`z0icA|$$*gJ*Y
z-(G(IZDV7@a3RBl!NSgt?ZKNjJ$3ufmss7c`d9nmY2uEZI}>f>gxeI)pFf|yUVo}r
z#rv;YGv_OCWNeM9crVG<9<n+#X`{r4Ptr=0Pfj@f^uxX4($cS$@*mhO1vaKDoaO#~
g`6MW=FeC9we$l~MI+2QdK}n0j)78&qol`;+07MrhdH?_b

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/toggle_default_0.png b/packages/office-ui-fabric-react/visualtests/baseline/toggle_default_0.png
deleted file mode 100644
index 6cd18d203ceaf6597c7abc3f65766c5b18c57734..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1725
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
T&LVC$00000NkvXXu0mjf?uabK

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/toggle_mouseClick_1.png b/packages/office-ui-fabric-react/visualtests/baseline/toggle_mouseClick_1.png
deleted file mode 100644
index 1ae285dd2bb6755154f49a53e476617a282f20cb..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1876
zcmV-a2dnsrP)<h;3K|Lk000e1NJLTq004jh001!v1^@s65~!gY00009a7bBm000ie
z000ie0hKEb8vp<Y21!IgRCt{2o9{~#aU93rTT%^bgh~inHiyDC=L2_pRz9j>IuJ^T
z!Ux744SI0wK~MSvgdiD2ZBGV9W)Q6qrqkIISC8EA!Opo{;V=~=SivP)VSRfbckJBl
z$L)tJ?_RJ6_x*l9zwSQY@9ul|ITay<KtZ;sYwdtSZBY_H<|qjubCd*-IZ6V^93=r{
zj*<W}M@aygqa=XLQ3C))QCYuAKv5LN$Hz<VFGqJJDaBSb{Hvr+PFEe*K+`mahK4Gl
zT;cyg`3sOa1rvZ<Dk6~xTrL+Vib5z95{wCl!+f9E5)}@IK~WT3E*Bz^NKRY%#%1;;
zlgWaC<?^Z6c%;~hL?Rd&839F6@OV5~eZ|;07;iqE93GEHptGd&M+hMni$(Cuglk(_
zSs{cFvaql~EEWri#bW%Jg@pw|2q7ygD}p{wc57>k5JJf8?5yC}VzH2?PoE0(rqgK>
zi^T-vxW2WuH9`m>^YilpSuqOvlq(*owm4roc}{P!cEsY%r<3#J@#Dv2c6L?}Zz<=G
zUjb;EMl>2lG#bsyG@7Q-(a`|_uv)DEfN$Tv@%>yIH)d;VOCa0S)C2&q*=zuS_4V~E
z8*kpc0Zr4Wudj#MY!-~;`p%y}4*=-t=@Fd~nH2IVS3FW}1p)y$91h-RPH(Yx#Ny4T
z698Vnehs}|&!5ji`trq8@;$((PoDq)+uPd+g+dq~ALn-uU%q^itk3WF!|iqpb|Ku!
z^85Xgbd};07mrk1e!m~5PoFM&e5Rdz@#fO$cDwQR?OVacFGgQ3>T>oJ$-{>a0RXpe
z-^S3;P~I)%_V#wpzMh^Qba!`)?nH{2@um7yt}UtKGv!K&m!@f)J$n`&j|Wbtvuu53
z?*jaOKhB&vgQlh?KD#qnTwKK0uU`QGb8~Y50E5AhHLka}7mJIF`26{^XrJ5d=KI3o
za9KX(L#nNtH*do2cJnt@48s&{Cs(|MbaJyl^9Hcg^T#JZ=JFwB#!O61;KPRxaJgLg
z@#9BUe|L8`=I7@@Q54?4e~(wMUg6ZKQ(5C|HXANox&*u3o^|JIv)Mq?H0*XeMn*<(
z;lhQoe9DJZTUM(TqobqndcB}13LigyEZR=4c#F~LbUHCJGs7oAspn5ch*A?MXOss)
zGDk@OnWH3t%uy0R<|qjubCd*-IZ6V^93=r{j_A99y}doe<8j2}acpjGf@N9!`t_@-
zjvPOJ99pdw&CSg)nM^R5OsK0X`&ETP0kWP1G7N*MsVOuzHlnMm3p$++TCEl*PMoN!
zBR_xs1k18WrBaB+Vo0ac=<Dm_Uu`N>2R;G*{P~0F>1iYq2@DPnLZ{Q!)Ui}5g_kd1
z!eB6<udfekweoLO4fq5I1OixJU&rw9Ff<xXt^EQ3?C$PjY-|kY&YgqZZm+dFM-nx#
zzw9RxiGS+i1As=O!SL`f5{X37uUQqOQMb3ZhpDM4+_-Tg>*6PqNrXZntgWp909spH
zVYAt?N|dUJMx(*t;2>VScmbo)h-1f&N!AgGL=cTe;q&<b01k%({r&xXi4?FOtJmvA
zI2=Ya8qGRBs;J}fI2s!pv;Omg!5|(ycmRfBz_Kh@mIcEw7#$r&Fc>^kCv`d<8X6j~
zw6r8y*5mQu`Sa)K@9*bp9xq<Jh-=rb394hgUN73)+xd%q@c5{rj>qHZ>gp0SCX-1_
zPELvn5JE6HIayS>bR{vH%~)PumL$V4417Kx?%usCnC)h>86J-Zw{G3y%hbZ*u%Hg_
z;PFvKy}7xWHTy%M5c1WD5JLF!uEV0OtqmI+8<J$+y?Y0T!@*Z2XQJ2Z0RV|ag0Fx&
zSX9X!A7#`m%R;Nw3L3fp{CpHMrjls2TCglDNyg{%<($R!_4NSucN*L>f3P&3J3h+D
zesldV?Rsi~T5M*uwzd`&EM`n45nHJWasB#reE<Gkw2!M)K6&zF*}nbHsGFOckxHcm
zjW(MNDwQgykV>V>`Y@r|tgf!2rKLrZ%;n3M;q&=KOQpFTMXjHB)*7|RWI`+!6Et>o
zbYNg$Kr{(dDisC>2GHK#epo&N*uSGU8jX@<tX3-=4hQbvzc2Vcfcs!`Vq!wHL|snQ
znM@`GgF&QHDZy;Gdi5&wdOham<^&Idu3Wits1JgG{n?*Rr_tHjDOuL(bRrUo;Much
z{3lZP?%hKm5D?uR$PE=CgfI+)nVA{fxpU{AyD8e)*}<bnkI>uOtGpSk0%~CY!HB_N
zz}VOrc6WDc?Gw+=&JLbDc>;sMpj`Yap}Y>3Iidw2)6>&vXlQ`hY(`sK+o2YOtgfzt
zVHl+#<d6{kHt_fF-&k5&!t(MmHa0d6wIr;ir3FT#5uKf#CB6Amkj7tLlppmwt!3c=
O0000<MNUMnLSTX!OMI&U

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/toggle_mouseDown_3.png b/packages/office-ui-fabric-react/visualtests/baseline/toggle_mouseDown_3.png
deleted file mode 100644
index 865e4a20951c299b6ab3e4b73994cafa65266842..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1870
zcmV-U2eJ5xP)<h;3K|Lk000e1NJLTq004jh001!v1^@s65~!gY00009a7bBm000ie
z000ie0hKEb8vp<Y07*naRCt{2o8M1VS02DWGcYZ}fI77-kwCO0W~JqYxx}r}c``&7
zl3MMHEH8A@WG8K!$!ykS^$#GSSu&|x$IWKyCL+E#ViR^(&=*GIuFS|LKvC2*5f-6T
zA%PLF1D<^#_hxRnGt3=+%Dtb2ggM`Hzu)gU_j}Gg=brDi2q6R}hQ+$k4w!5#W&ju*
zGXM;Z82|>y3;=^;27tja1Hj;z0bp><05CXK07;UT{H+F(B+=5+lCgXxx>u7-Y^{ZV
ztEp4gl`R)|y<Y0;>sLj&$(w`u2rxLy27o+OL?RJ<J|B`K(b?IlsuK=}6`9r)6%L1y
zBnh9-M<fzSYAaQ}MA@T9kCts%GN00Ij~-i*NQB15MkGlh5C|-hrDNxp?M<aqCJ+dy
zbY|3lLI~k>I#qv($Yq0rgF*-)y1ToD)9Dnwy}e4E?(S|Ogb;&+gDRPP?da&J5JHHK
zjt<ptr_(7eUAm;w`{Kn5(c9arswc~yK7A^L5TdKAOLeUl%lVY7J$h})zRK6jdegO|
z)!tM(Wk1fJKQB5uI#lh=r2mu|!0YuAjYf$^qe~*q>-Dm4-#!4Us;U5(oSanTa+zFb
zbaYg8ZBbDX0M*si01OWgFR^j!)-AkVFAj%;ii!$VJy}*-S_**6<<cAxi7e++vi9h;
z)!yEY+wE3-mi4A<N2|T5bON-swNX}9ru64>`ckzi<2At0&=3HzSd7ljPFh-8l-<Ml
z__%I;p->3F->=$*$ek4mg>>o4#3#8udToV5A@cL{)2^RrCslis>Gb>k+`fHVb@S8F
zmyGPBk~BGY?i>IO4Gq-S*QeY<#$vIgGMCFmWo4!2P9&WXpQ%qPwWYUy;&qv{*X#9C
zSXf9P5WwT{tXSWQcLAYLh#fn2P*hZ;M0X-RJv~fJOaO56=1l<h@87?q-qE8+>FMcV
zY-~(Z=J)#*SvVYCkx!}6YwOghQ~3RUWntCV*O#`PWbIu}r#$)-7l4`epArCx(}$iB
z)7sj~<HwKj`FzaH%`K5vR#wv0)rBNUJbd_&YuBz}x7(N0tFEr*@ZrPM*48dr`Bqm~
z<Mn!}t*xc8v5`G{_N>UKROq!;RaHfEb2Aq%TtJc}o;-Pyww+|{O-HB4<Kf1Q8%hvl
z+J6=y%$z_YW4;J7IA#DC95Vn6ju`+3#|!|2V+Mf1F$2Khm;qpLG|vKF%?qv%Omlr8
z#{H2wo=wg3^5@rU>PX&OR(2O;<1EhMc)6Y9<@vmwZCO*BCK_)7ul7%K`k&+c6pK?}
zgWN0&wyd?EDqaKe1(;b7OvT|{yN#yb7V^ml>7TTj=tl{Fh1c-Me~t6a-3f|wA$NmE
z-^{#VWClJz=-{hkg=Cozt2IFh0N+2x`RjisDb0hdO)~Q?2pD<^zyHln{#;YI(e7+X
ztgtxke{*+YQ{8-6^rbWp{&IJMtNqg(?ar3OG8ca>e%<^7mUw*Kr+uj;mroBkC@*>&
zfPt}Be0y(#=<tlH-psrJn~jHmc#pR-h|owRLNppB7z_g7cDt#msZmm-jEwdAz%<We
z>woh<`|ut9URQ#vERS7z+3d>8##NTb#kvwc`|urA-P~*oKgHs-eXoBO2m}ILxpIY?
zni?hN@z9||oH%hJt&HETj`jLLi~`&G8kI_N`O>vZQ)U6abnQYa$yJpX*x<W?<SAuZ
z^!4=-3<f!U`m}1aS5#CG2n49Bt4o=tW(2JFN9M>~=Li3%2OOlbXaO1y>{ONIW?8sD
zqA$DW&Ye5B-EJi-IgzrmG5{VtcmSmLy}(w)`fO?*Th{s-m7n=3>-;K5_1l&O&!*;e
z*$D=NNwaGm4hI0Uv$IN>-|uJp_U$w`Hxmd1ICJJq+Btr2Du&-(Z`-y_`G2|ZAGRXa
z-38gi7uMJ4z}Tzh>-?ym?&AxvyFgzS`^l3hnV!~OILevIIXO9+av8l@#cvu`XK@ZQ
z3+tN~`t7|5Qdtzh#d{N~vY7>evpDt5`Xxt>93dDCYNkr}_xA&^ckf<ZI=33u<K=dy
z;_GWPIy}SI;pdt`Ab_vK&xsDts>-M0@KO2Fbn;YGRaN13yJ>1_QjKJJq1W2ls+pp0
zB(jf}=kq7KjhS_R5%jlzzu>?Bo2B8vPG!M2@Z%g8?@emH2zu9U<Ky@B9}Ias9wLzl
zmoHydK9M?m_AKq~?V7s-qhS$3h^zh6{O-yK@8w%I)vI7wJP-I`TF`o`n3Lwo;HqN<
z_~e6pK0oMS=;dOEZx-akpf3(O%$vVPD9h@vjum2I@!(}M9S47L&_UBN^CWPsFcU%y
zj^?+4KQ9Q{zMtm1gp{z@8mENW6H>xHD!23T`}rB2{F&(E{|a~C@EhQ6x&QzG07*qo
IM6N<$f-r!nS^xk5

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/toggle_mouseMove_2.png b/packages/office-ui-fabric-react/visualtests/baseline/toggle_mouseMove_2.png
deleted file mode 100644
index 865e4a20951c299b6ab3e4b73994cafa65266842..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1870
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
IM6N<$f-r!nS^xk5

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/tooltip_mouseClick_0.png b/packages/office-ui-fabric-react/visualtests/baseline/tooltip_mouseClick_0.png
deleted file mode 100644
index cfa3883363e0bb59f22102db8d5c991f25f5e3f1..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 630
zcmV-+0*U>JP)<h;3K|Lk000e1NJLTq003J6000jN1^@s6iz%~s00009a7bBm000ie
z000ie0hKEb8vp<TC`m*?R9J=Wm_4j1Q51#Oy_G_x5Q(T%3f0+a3Q=kFI+aeQRnJVT
zGNr;qXEaI;B`TsI(NK&=A(2eEUm;}t%@3}3^PZK6$vJDjvu2y~6JN~C_~<SA{@Vfm
zCw+?jMtu_z?tMn1(dqk^R8_@dvG6pIAMd4{GQ3ky*Me;lLhx`nWVg1TR<qeW8}r!=
zm%K-1&+!QJS1u#9TJ2Z!9%Xtewq;q+bsa<mUDr?T_GvYpP9aGWBuTo-@aiQZ06@81
zK3zLy0C2b6iP!0LKtzxv>1z5r_1$CIpO1(z7z|Fi27|%j#(UGm-lixDGc%i}$wCO8
z&*xWuAq4mPeNR)+kJl}OVHj)}1~W4&igJ^C$ukV&#G6beEQH|gcI(=A`3(1#Iw1tt
z>-95+X`0@ak!&^#0Ek2)0D#?YcjYOSN|?=N*laegJU?Ey46-akmSqqT+U+)0tCcHD
zmgN&KnM?uzmdmAUpC29H_#<PzUcc_>S1y+kkH?YE=Ut2F$LmF!reQoDV>}+CSS&ux
z`w0aCf!Ch1bGaOV!>{<P*Rm{6V^*tG^m;w)_j^a5op-zkIP4z)kVqt4`}|~_&*x{1
zXf*n|VoQ<)B0{B7K`NDc%ByLb<7R7DI-N!=7DFbJxx1lV@(P6lVzC&A2;FWMtyT-c
zV9>SCPsVUK3{_RpXf)7jwGax0@WuT3Z{*b?B50a+^&<VsbN0WgPqE*qKRR)QN#(qF
Q;Q#;t07*qoM6N<$f~eIVjsO4v

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/tooltip_mouseDown_2.png b/packages/office-ui-fabric-react/visualtests/baseline/tooltip_mouseDown_2.png
deleted file mode 100644
index cfa3883363e0bb59f22102db8d5c991f25f5e3f1..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 630
zcmV-+0*U>JP)<h;3K|Lk000e1NJLTq003J6000jN1^@s6iz%~s00009a7bBm000ie
z000ie0hKEb8vp<TC`m*?R9J=Wm_4j1Q51#Oy_G_x5Q(T%3f0+a3Q=kFI+aeQRnJVT
zGNr;qXEaI;B`TsI(NK&=A(2eEUm;}t%@3}3^PZK6$vJDjvu2y~6JN~C_~<SA{@Vfm
zCw+?jMtu_z?tMn1(dqk^R8_@dvG6pIAMd4{GQ3ky*Me;lLhx`nWVg1TR<qeW8}r!=
zm%K-1&+!QJS1u#9TJ2Z!9%Xtewq;q+bsa<mUDr?T_GvYpP9aGWBuTo-@aiQZ06@81
zK3zLy0C2b6iP!0LKtzxv>1z5r_1$CIpO1(z7z|Fi27|%j#(UGm-lixDGc%i}$wCO8
z&*xWuAq4mPeNR)+kJl}OVHj)}1~W4&igJ^C$ukV&#G6beEQH|gcI(=A`3(1#Iw1tt
z>-95+X`0@ak!&^#0Ek2)0D#?YcjYOSN|?=N*laegJU?Ey46-akmSqqT+U+)0tCcHD
zmgN&KnM?uzmdmAUpC29H_#<PzUcc_>S1y+kkH?YE=Ut2F$LmF!reQoDV>}+CSS&ux
z`w0aCf!Ch1bGaOV!>{<P*Rm{6V^*tG^m;w)_j^a5op-zkIP4z)kVqt4`}|~_&*x{1
zXf*n|VoQ<)B0{B7K`NDc%ByLb<7R7DI-N!=7DFbJxx1lV@(P6lVzC&A2;FWMtyT-c
zV9>SCPsVUK3{_RpXf)7jwGax0@WuT3Z{*b?B50a+^&<VsbN0WgPqE*qKRR)QN#(qF
Q;Q#;t07*qoM6N<$f~eIVjsO4v

diff --git a/packages/office-ui-fabric-react/visualtests/baseline/tooltip_mouseMove_1.png b/packages/office-ui-fabric-react/visualtests/baseline/tooltip_mouseMove_1.png
deleted file mode 100644
index cfa3883363e0bb59f22102db8d5c991f25f5e3f1..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 630
zcmV-+0*U>JP)<h;3K|Lk000e1NJLTq003J6000jN1^@s6iz%~s00009a7bBm000ie
z000ie0hKEb8vp<TC`m*?R9J=Wm_4j1Q51#Oy_G_x5Q(T%3f0+a3Q=kFI+aeQRnJVT
zGNr;qXEaI;B`TsI(NK&=A(2eEUm;}t%@3}3^PZK6$vJDjvu2y~6JN~C_~<SA{@Vfm
zCw+?jMtu_z?tMn1(dqk^R8_@dvG6pIAMd4{GQ3ky*Me;lLhx`nWVg1TR<qeW8}r!=
zm%K-1&+!QJS1u#9TJ2Z!9%Xtewq;q+bsa<mUDr?T_GvYpP9aGWBuTo-@aiQZ06@81
zK3zLy0C2b6iP!0LKtzxv>1z5r_1$CIpO1(z7z|Fi27|%j#(UGm-lixDGc%i}$wCO8
z&*xWuAq4mPeNR)+kJl}OVHj)}1~W4&igJ^C$ukV&#G6beEQH|gcI(=A`3(1#Iw1tt
z>-95+X`0@ak!&^#0Ek2)0D#?YcjYOSN|?=N*laegJU?Ey46-akmSqqT+U+)0tCcHD
zmgN&KnM?uzmdmAUpC29H_#<PzUcc_>S1y+kkH?YE=Ut2F$LmF!reQoDV>}+CSS&ux
z`w0aCf!Ch1bGaOV!>{<P*Rm{6V^*tG^m;w)_j^a5op-zkIP4z)kVqt4`}|~_&*x{1
zXf*n|VoQ<)B0{B7K`NDc%ByLb<7R7DI-N!=7DFbJxx1lV@(P6lVzC&A2;FWMtyT-c
zV9>SCPsVUK3{_RpXf)7jwGax0@WuT3Z{*b?B50a+^&<VsbN0WgPqE*qKRR)QN#(qF
Q;Q#;t07*qoM6N<$f~eIVjsO4v


From 13c14c4be9191e29a5cb9e3aafa3aa101442abbd Mon Sep 17 00:00:00 2001
From: Joe Martella <martellaj@live.com>
Date: Tue, 26 Sep 2017 10:33:13 -0700
Subject: [PATCH 0720/1641] Fixes suggestions not being read out in IE (#2944)

* Fixes suggestions not being read out in IE

* Adds change file

* Update joem-suggestion-reading_2017-09-26-17-17.json
---
 ...m-suggestion-reading_2017-09-26-17-17.json | 11 ++++++++
 .../src/components/pickers/BasePicker.scss    |  4 +++
 .../src/components/pickers/BasePicker.tsx     | 25 ++++++++++++-------
 .../pickers/Suggestions/Suggestions.tsx       |  5 ++--
 .../Suggestions/SuggestionsController.ts      |  3 ++-
 5 files changed, 36 insertions(+), 12 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/joem-suggestion-reading_2017-09-26-17-17.json

diff --git a/common/changes/office-ui-fabric-react/joem-suggestion-reading_2017-09-26-17-17.json b/common/changes/office-ui-fabric-react/joem-suggestion-reading_2017-09-26-17-17.json
new file mode 100644
index 0000000000000..4e1f2ad19cb00
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/joem-suggestion-reading_2017-09-26-17-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "PeoplePicker: adjusting aria/role attributes to improve the Narrator experience when reading out suggestions.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joem@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.scss b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.scss
index a175b699c2dfd..67a0129c3510e 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.scss
@@ -26,3 +26,7 @@
   padding: 0 6px 0px;
   margin: 1px;
 }
+
+.screenReaderOnly {
+  @include ms-screenReaderOnly;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 0d573d6ade46d..7dc82db548f42 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -142,6 +142,11 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
       inputProps,
       disabled
     } = this.props;
+
+    const currentIndex = this.suggestionStore.currentIndex;
+    const selectedSuggestion = currentIndex > -1 ? this.suggestionStore.getSuggestionAtIndex(this.suggestionStore.currentIndex) : undefined;
+    const selectedSuggestionAlert = selectedSuggestion ? selectedSuggestion.ariaLabel : undefined;
+
     return (
       <div
         ref={ this._resolveRef('root') }
@@ -155,6 +160,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
           direction={ FocusZoneDirection.bidirectional }
           isInnerZoneKeystroke={ this._isFocusZoneInnerKeystroke }
         >
+          <div className={ styles.screenReaderOnly } role='alert' id='selected-suggestion-alert' aria-live='assertive'>{ selectedSuggestionAlert } </div>
           <SelectionZone selection={ this.selection } selectionMode={ SelectionMode.multiple }>
             <div className={ css('ms-BasePicker-text', styles.pickerText) } role={ 'list' }>
               { this.renderItems() }
@@ -173,6 +179,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
                 autoComplete='off'
                 role='combobox'
                 disabled={ disabled }
+                aria-controls='selected-suggestion-alert'
               />) }
             </div>
           </SelectionZone>
@@ -421,22 +428,22 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
       case KeyCodes.backspace:
         if (!this.props.disabled) {
-            this.onBackspace(ev);
+          this.onBackspace(ev);
         }
         ev.stopPropagation();
         break;
 
       case KeyCodes.del:
         if (!this.props.disabled) {
-            if (this.input && ev.target === this.input.inputElement && this.state.suggestionsVisible && this.suggestionStore.currentIndex !== -1) {
-                if (this.props.onRemoveSuggestion) {
-                    (this.props.onRemoveSuggestion as any)(this.suggestionStore.currentSuggestion!.item);
-                }
-                this.suggestionStore.removeSuggestion(this.suggestionStore.currentIndex);
-                this.forceUpdate();
-            } else {
-                this.onBackspace(ev);
+          if (this.input && ev.target === this.input.inputElement && this.state.suggestionsVisible && this.suggestionStore.currentIndex !== -1) {
+            if (this.props.onRemoveSuggestion) {
+              (this.props.onRemoveSuggestion as any)(this.suggestionStore.currentSuggestion!.item);
             }
+            this.suggestionStore.removeSuggestion(this.suggestionStore.currentIndex);
+            this.forceUpdate();
+          } else {
+            this.onBackspace(ev);
+          }
         }
         ev.stopPropagation();
         break;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index 1971e85c8a594..b259025637259 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -186,7 +186,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
       <div
         className={ css('ms-Suggestions-container', styles.suggestionsContainer) }
         id='suggestion-list'
-        role='menu'
+        role='list'
         aria-label={ suggestionsContainerAriaLabel }
       >
         { suggestions.map((suggestion, index) =>
@@ -195,7 +195,8 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
             // tslint:disable-next-line:no-string-literal
             key={ (suggestion.item as any)['key'] ? (suggestion.item as any)['key'] : index }
             id={ 'sug-' + index }
-            role='menuitem'
+            role='listitem'
+            aria-label={ suggestion.ariaLabel }
           >
             <TypedSuggestionsItem
               id={ 'sug-item' + index }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
index f8d6ba4738a15..0379e9b041fb1 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
@@ -1,6 +1,7 @@
 export interface ISuggestionModel<T> {
   item: T;
   selected: boolean;
+  ariaLabel?: string;
 }
 
 export class SuggestionsController<T> {
@@ -89,7 +90,7 @@ export class SuggestionsController<T> {
 
   public convertSuggestionsToSuggestionItems(suggestions: any[]): ISuggestionModel<T>[] {
     let converted: ISuggestionModel<T>[] = [];
-    suggestions.forEach((suggestion: any) => converted.push({ item: suggestion, selected: false }));
+    suggestions.forEach((suggestion: any) => converted.push({ item: suggestion, selected: false, ariaLabel: suggestion.name || suggestion.primaryText }));
     return converted;
   }
 

From c1fa7e4c2e93677133c39c58a7478efe16913209 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 26 Sep 2017 10:53:21 -0700
Subject: [PATCH 0721/1641] Adding icons package (#2953)

* Adding icons.

* Disconnecting icons from building.

* Fixing docs and license.

* Removing scss, css, and ttf files as we're not using them.
---
 common/config/rush/npm-shrinkwrap.json        |   13 +-
 packages/icons/LICENSE                        |   15 +
 packages/icons/README.md                      |   46 +
 packages/icons/config/fabric-icons-0.json     |  412 ++++++
 packages/icons/config/fabric-icons-1.json     |  412 ++++++
 packages/icons/config/fabric-icons-10.json    |  412 ++++++
 packages/icons/config/fabric-icons-11.json    |  348 +++++
 packages/icons/config/fabric-icons-2.json     |  412 ++++++
 packages/icons/config/fabric-icons-3.json     |  412 ++++++
 packages/icons/config/fabric-icons-4.json     |  412 ++++++
 packages/icons/config/fabric-icons-5.json     |  412 ++++++
 packages/icons/config/fabric-icons-6.json     |  412 ++++++
 packages/icons/config/fabric-icons-7.json     |  412 ++++++
 packages/icons/config/fabric-icons-8.json     |  412 ++++++
 packages/icons/config/fabric-icons-9.json     |  412 ++++++
 packages/icons/config/fabric-icons.json       |  228 +++
 .../icons/fonts/fabric-icons-0-8a1666a2.woff  |  Bin 0 -> 11984 bytes
 .../icons/fonts/fabric-icons-1-a961c249.woff  |  Bin 0 -> 12024 bytes
 .../icons/fonts/fabric-icons-10-795d6e25.woff |  Bin 0 -> 12416 bytes
 .../icons/fonts/fabric-icons-11-c0dbf638.woff |  Bin 0 -> 15192 bytes
 .../icons/fonts/fabric-icons-2-2be8dca9.woff  |  Bin 0 -> 12124 bytes
 .../icons/fonts/fabric-icons-3-80b6008d.woff  |  Bin 0 -> 14136 bytes
 .../icons/fonts/fabric-icons-4-03329fef.woff  |  Bin 0 -> 15940 bytes
 .../icons/fonts/fabric-icons-4ac62dd2.woff    |  Bin 0 -> 6372 bytes
 .../icons/fonts/fabric-icons-5-82c8b87c.woff  |  Bin 0 -> 13512 bytes
 .../icons/fonts/fabric-icons-6-2ab76fc9.woff  |  Bin 0 -> 12672 bytes
 .../icons/fonts/fabric-icons-7-1bae3315.woff  |  Bin 0 -> 11204 bytes
 .../icons/fonts/fabric-icons-8-bf5c8e0c.woff  |  Bin 0 -> 13772 bytes
 .../icons/fonts/fabric-icons-9-a362212c.woff  |  Bin 0 -> 11244 bytes
 packages/icons/gulpfile.js                    |   46 +
 packages/icons/package.json                   |   29 +
 packages/icons/src/IconNames.ts               | 1240 +++++++++++++++++
 packages/icons/src/fabric-icons-0-inline.ts   |  121 ++
 packages/icons/src/fabric-icons-0.ts          |  121 ++
 packages/icons/src/fabric-icons-1-inline.ts   |  121 ++
 packages/icons/src/fabric-icons-1.ts          |  121 ++
 packages/icons/src/fabric-icons-10-inline.ts  |  121 ++
 packages/icons/src/fabric-icons-10.ts         |  121 ++
 packages/icons/src/fabric-icons-11-inline.ts  |  105 ++
 packages/icons/src/fabric-icons-11.ts         |  105 ++
 packages/icons/src/fabric-icons-2-inline.ts   |  121 ++
 packages/icons/src/fabric-icons-2.ts          |  121 ++
 packages/icons/src/fabric-icons-3-inline.ts   |  121 ++
 packages/icons/src/fabric-icons-3.ts          |  121 ++
 packages/icons/src/fabric-icons-4-inline.ts   |  121 ++
 packages/icons/src/fabric-icons-4.ts          |  121 ++
 packages/icons/src/fabric-icons-5-inline.ts   |  121 ++
 packages/icons/src/fabric-icons-5.ts          |  121 ++
 packages/icons/src/fabric-icons-6-inline.ts   |  121 ++
 packages/icons/src/fabric-icons-6.ts          |  121 ++
 packages/icons/src/fabric-icons-7-inline.ts   |  121 ++
 packages/icons/src/fabric-icons-7.ts          |  121 ++
 packages/icons/src/fabric-icons-8-inline.ts   |  121 ++
 packages/icons/src/fabric-icons-8.ts          |  121 ++
 packages/icons/src/fabric-icons-9-inline.ts   |  121 ++
 packages/icons/src/fabric-icons-9.ts          |  121 ++
 packages/icons/src/fabric-icons-inline.ts     |   75 +
 packages/icons/src/fabric-icons.ts            |   75 +
 packages/icons/src/icon-aliases.ts            |    3 +
 packages/icons/src/index.ts                   |   22 +
 packages/icons/tsconfig.json                  |   22 +
 packages/icons/tslint.json                    |    6 +
 62 files changed, 9562 insertions(+), 10 deletions(-)
 create mode 100644 packages/icons/LICENSE
 create mode 100644 packages/icons/README.md
 create mode 100644 packages/icons/config/fabric-icons-0.json
 create mode 100644 packages/icons/config/fabric-icons-1.json
 create mode 100644 packages/icons/config/fabric-icons-10.json
 create mode 100644 packages/icons/config/fabric-icons-11.json
 create mode 100644 packages/icons/config/fabric-icons-2.json
 create mode 100644 packages/icons/config/fabric-icons-3.json
 create mode 100644 packages/icons/config/fabric-icons-4.json
 create mode 100644 packages/icons/config/fabric-icons-5.json
 create mode 100644 packages/icons/config/fabric-icons-6.json
 create mode 100644 packages/icons/config/fabric-icons-7.json
 create mode 100644 packages/icons/config/fabric-icons-8.json
 create mode 100644 packages/icons/config/fabric-icons-9.json
 create mode 100644 packages/icons/config/fabric-icons.json
 create mode 100644 packages/icons/fonts/fabric-icons-0-8a1666a2.woff
 create mode 100644 packages/icons/fonts/fabric-icons-1-a961c249.woff
 create mode 100644 packages/icons/fonts/fabric-icons-10-795d6e25.woff
 create mode 100644 packages/icons/fonts/fabric-icons-11-c0dbf638.woff
 create mode 100644 packages/icons/fonts/fabric-icons-2-2be8dca9.woff
 create mode 100644 packages/icons/fonts/fabric-icons-3-80b6008d.woff
 create mode 100644 packages/icons/fonts/fabric-icons-4-03329fef.woff
 create mode 100644 packages/icons/fonts/fabric-icons-4ac62dd2.woff
 create mode 100644 packages/icons/fonts/fabric-icons-5-82c8b87c.woff
 create mode 100644 packages/icons/fonts/fabric-icons-6-2ab76fc9.woff
 create mode 100644 packages/icons/fonts/fabric-icons-7-1bae3315.woff
 create mode 100644 packages/icons/fonts/fabric-icons-8-bf5c8e0c.woff
 create mode 100644 packages/icons/fonts/fabric-icons-9-a362212c.woff
 create mode 100644 packages/icons/gulpfile.js
 create mode 100644 packages/icons/package.json
 create mode 100644 packages/icons/src/IconNames.ts
 create mode 100644 packages/icons/src/fabric-icons-0-inline.ts
 create mode 100644 packages/icons/src/fabric-icons-0.ts
 create mode 100644 packages/icons/src/fabric-icons-1-inline.ts
 create mode 100644 packages/icons/src/fabric-icons-1.ts
 create mode 100644 packages/icons/src/fabric-icons-10-inline.ts
 create mode 100644 packages/icons/src/fabric-icons-10.ts
 create mode 100644 packages/icons/src/fabric-icons-11-inline.ts
 create mode 100644 packages/icons/src/fabric-icons-11.ts
 create mode 100644 packages/icons/src/fabric-icons-2-inline.ts
 create mode 100644 packages/icons/src/fabric-icons-2.ts
 create mode 100644 packages/icons/src/fabric-icons-3-inline.ts
 create mode 100644 packages/icons/src/fabric-icons-3.ts
 create mode 100644 packages/icons/src/fabric-icons-4-inline.ts
 create mode 100644 packages/icons/src/fabric-icons-4.ts
 create mode 100644 packages/icons/src/fabric-icons-5-inline.ts
 create mode 100644 packages/icons/src/fabric-icons-5.ts
 create mode 100644 packages/icons/src/fabric-icons-6-inline.ts
 create mode 100644 packages/icons/src/fabric-icons-6.ts
 create mode 100644 packages/icons/src/fabric-icons-7-inline.ts
 create mode 100644 packages/icons/src/fabric-icons-7.ts
 create mode 100644 packages/icons/src/fabric-icons-8-inline.ts
 create mode 100644 packages/icons/src/fabric-icons-8.ts
 create mode 100644 packages/icons/src/fabric-icons-9-inline.ts
 create mode 100644 packages/icons/src/fabric-icons-9.ts
 create mode 100644 packages/icons/src/fabric-icons-inline.ts
 create mode 100644 packages/icons/src/fabric-icons.ts
 create mode 100644 packages/icons/src/icon-aliases.ts
 create mode 100644 packages/icons/src/index.ts
 create mode 100644 packages/icons/tsconfig.json
 create mode 100644 packages/icons/tslint.json

diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 3bdd398596a2a..90cc0faee8027 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -10214,16 +10214,9 @@
       }
     },
     "serve-favicon": {
-      "version": "2.4.4",
-      "resolved": "https://registry.npmjs.org/serve-favicon/-/serve-favicon-2.4.4.tgz",
-      "integrity": "sha1-QS3ddJZRUcn3TAgo811QxSUCEN4=",
-      "dependencies": {
-        "fresh": {
-          "version": "0.5.1",
-          "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.1.tgz",
-          "integrity": "sha1-w6CLzsD83MIj7fOyPrMn8fn8v1w="
-        }
-      }
+      "version": "2.4.5",
+      "resolved": "https://registry.npmjs.org/serve-favicon/-/serve-favicon-2.4.5.tgz",
+      "integrity": "sha512-s7F8h2NrslMkG50KxvlGdj+ApSwaLex0vexuJ9iFf3GLTIp1ph/l1qZvRe9T9TJEYZgmq72ZwJ2VYiAEtChknw=="
     },
     "serve-index": {
       "version": "1.9.0",
diff --git a/packages/icons/LICENSE b/packages/icons/LICENSE
new file mode 100644
index 0000000000000..9b29bfb616793
--- /dev/null
+++ b/packages/icons/LICENSE
@@ -0,0 +1,15 @@
+Office UI Fabric React - icons
+
+Copyright (c) Microsoft Corporation
+
+All rights reserved.
+
+MIT License
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the ""Software""), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED *AS IS*, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
+Note: Usage of the fonts and icons referenced in Office UI Fabric is subject to the terms listed at http://aka.ms/fabric-assets-license
\ No newline at end of file
diff --git a/packages/icons/README.md b/packages/icons/README.md
new file mode 100644
index 0000000000000..bde445a213714
--- /dev/null
+++ b/packages/icons/README.md
@@ -0,0 +1,46 @@
+# [Office UI Fabric - Icons](http://dev.office.com/fabric)
+
+##### The React-based front-end framework for building experiences for Office and Office 365.
+
+Fabric Icons includes a collection of 1100+ icons which you can use in your application.
+
+
+# Getting started
+
+If you are using Fabric React components, you can make all icons available by calling the `initializeIcons` function from the `@uifabric/icons` package:
+
+```tsx
+import { initializeIcons } from '@uifabric/icons';
+
+// Register icons and pull the fonts from the default SharePoint cdn.
+initializeIcons();
+
+// ...or, register icons and pull the fonts from your own cdn:
+initializeIcons('https://my.cdn.com/path/to/icons/');
+```
+
+This will make ALL icons in the collection available, but will download them on demand when referenced using the `@uifabric/styling` APIs `getIcon` or `getIconClassName`.
+
+# Usage in code
+
+## getIcon API
+
+If you are using Fabric React, you can use the `Icon` component and pass in the corresponding iconName property to render a given icon.
+
+```tsx
+import { Icon } from 'office-ui-fabric-react/lib/Icon';
+
+<Icon iconName='Snow' />
+```
+
+The styling package includes a `getIconClassName` api which can provide a css class to use for rendering the icon manually using the `:before` pseudoselector:
+
+```ts
+import { getIconClassName } from '@uifabric/styling';
+
+return `<i class="${getIconClassName('Snow')}" />`;
+```
+
+# Notes
+
+See [Office UI Fabric React](http://github.com/OfficeDev/office-ui-fabric-react) for more details on the UI Fabric project and packages within.
diff --git a/packages/icons/config/fabric-icons-0.json b/packages/icons/config/fabric-icons-0.json
new file mode 100644
index 0000000000000..3f39df8e2dc0a
--- /dev/null
+++ b/packages/icons/config/fabric-icons-0.json
@@ -0,0 +1,412 @@
+{
+	"fontName": "fabric-icons-0",
+	"fontFamilyName": "FabricMDL2Icons-0",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "DecreaseIndentLegacy",
+			"unicode": "E290"
+		},
+		{
+			"name": "IncreaseIndentLegacy",
+			"unicode": "E291"
+		},
+		{
+			"name": "InternetSharing",
+			"unicode": "E704"
+		},
+		{
+			"name": "Brightness",
+			"unicode": "E706"
+		},
+		{
+			"name": "MapPin",
+			"unicode": "E707"
+		},
+		{
+			"name": "Airplane",
+			"unicode": "E709"
+		},
+		{
+			"name": "Tablet",
+			"unicode": "E70A"
+		},
+		{
+			"name": "QuickNote",
+			"unicode": "E70B"
+		},
+		{
+			"name": "Video",
+			"unicode": "E714"
+		},
+		{
+			"name": "People",
+			"unicode": "E716"
+		},
+		{
+			"name": "Phone",
+			"unicode": "E717"
+		},
+		{
+			"name": "Pin",
+			"unicode": "E718"
+		},
+		{
+			"name": "Shop",
+			"unicode": "E719"
+		},
+		{
+			"name": "Stop",
+			"unicode": "E71A"
+		},
+		{
+			"name": "Link",
+			"unicode": "E71B"
+		},
+		{
+			"name": "Zoom",
+			"unicode": "E71E"
+		},
+		{
+			"name": "ZoomOut",
+			"unicode": "E71F"
+		},
+		{
+			"name": "Microphone",
+			"unicode": "E720"
+		},
+		{
+			"name": "Camera",
+			"unicode": "E722"
+		},
+		{
+			"name": "Attach",
+			"unicode": "E723"
+		},
+		{
+			"name": "Send",
+			"unicode": "E724"
+		},
+		{
+			"name": "FavoriteList",
+			"unicode": "E728"
+		},
+		{
+			"name": "PageSolid",
+			"unicode": "E729"
+		},
+		{
+			"name": "Forward",
+			"unicode": "E72A"
+		},
+		{
+			"name": "Back",
+			"unicode": "E72B"
+		},
+		{
+			"name": "Refresh",
+			"unicode": "E72C"
+		},
+		{
+			"name": "Lock",
+			"unicode": "E72E"
+		},
+		{
+			"name": "EMI",
+			"unicode": "E731"
+		},
+		{
+			"name": "MiniLink",
+			"unicode": "E732"
+		},
+		{
+			"name": "Blocked",
+			"unicode": "E733"
+		},
+		{
+			"name": "ReadingMode",
+			"unicode": "E736"
+		},
+		{
+			"name": "Favicon",
+			"unicode": "E737"
+		},
+		{
+			"name": "Remove",
+			"unicode": "E738"
+		},
+		{
+			"name": "Checkbox",
+			"unicode": "E739"
+		},
+		{
+			"name": "CheckboxComposite",
+			"unicode": "E73A"
+		},
+		{
+			"name": "CheckboxIndeterminate",
+			"unicode": "E73C"
+		},
+		{
+			"name": "CheckboxCompositeReversed",
+			"unicode": "E73D"
+		},
+		{
+			"name": "BackToWindow",
+			"unicode": "E73F"
+		},
+		{
+			"name": "FullScreen",
+			"unicode": "E740"
+		},
+		{
+			"name": "Print",
+			"unicode": "E749"
+		},
+		{
+			"name": "Up",
+			"unicode": "E74A"
+		},
+		{
+			"name": "Down",
+			"unicode": "E74B"
+		},
+		{
+			"name": "Save",
+			"unicode": "E74E"
+		},
+		{
+			"name": "Cloud",
+			"unicode": "E753"
+		},
+		{
+			"name": "CommandPrompt",
+			"unicode": "E756"
+		},
+		{
+			"name": "Sad",
+			"unicode": "E757"
+		},
+		{
+			"name": "SIPMove",
+			"unicode": "E759"
+		},
+		{
+			"name": "EraseTool",
+			"unicode": "E75C"
+		},
+		{
+			"name": "GripperTool",
+			"unicode": "E75E"
+		},
+		{
+			"name": "Dialpad",
+			"unicode": "E75F"
+		},
+		{
+			"name": "PageLeft",
+			"unicode": "E760"
+		},
+		{
+			"name": "PageRight",
+			"unicode": "E761"
+		},
+		{
+			"name": "MultiSelect",
+			"unicode": "E762"
+		},
+		{
+			"name": "Play",
+			"unicode": "E768"
+		},
+		{
+			"name": "Pause",
+			"unicode": "E769"
+		},
+		{
+			"name": "Emoji2",
+			"unicode": "E76E"
+		},
+		{
+			"name": "GripperBarHorizontal",
+			"unicode": "E76F"
+		},
+		{
+			"name": "System",
+			"unicode": "E770"
+		},
+		{
+			"name": "Personalize",
+			"unicode": "E771"
+		},
+		{
+			"name": "SearchAndApps",
+			"unicode": "E773"
+		},
+		{
+			"name": "Globe",
+			"unicode": "E774"
+		},
+		{
+			"name": "ContactInfo",
+			"unicode": "E779"
+		},
+		{
+			"name": "Unpin",
+			"unicode": "E77A"
+		},
+		{
+			"name": "Contact",
+			"unicode": "E77B"
+		},
+		{
+			"name": "Memo",
+			"unicode": "E77C"
+		},
+		{
+			"name": "Paste",
+			"unicode": "E77F"
+		},
+		{
+			"name": "WindowsLogo",
+			"unicode": "E782"
+		},
+		{
+			"name": "Error",
+			"unicode": "E783"
+		},
+		{
+			"name": "GripperBarVertical",
+			"unicode": "E784"
+		},
+		{
+			"name": "Unlock",
+			"unicode": "E785"
+		},
+		{
+			"name": "Megaphone",
+			"unicode": "E789"
+		},
+		{
+			"name": "AutoEnhanceOn",
+			"unicode": "E78D"
+		},
+		{
+			"name": "AutoEnhanceOff",
+			"unicode": "E78E"
+		},
+		{
+			"name": "Color",
+			"unicode": "E790"
+		},
+		{
+			"name": "SaveAs",
+			"unicode": "E792"
+		},
+		{
+			"name": "Light",
+			"unicode": "E793"
+		},
+		{
+			"name": "Filters",
+			"unicode": "E795"
+		},
+		{
+			"name": "AspectRatio",
+			"unicode": "E799"
+		},
+		{
+			"name": "Contrast",
+			"unicode": "E7A1"
+		},
+		{
+			"name": "Redo",
+			"unicode": "E7A6"
+		},
+		{
+			"name": "PhotoCollection",
+			"unicode": "E7AA"
+		},
+		{
+			"name": "Album",
+			"unicode": "E7AB"
+		},
+		{
+			"name": "Rotate",
+			"unicode": "E7AD"
+		},
+		{
+			"name": "PanoIndicator",
+			"unicode": "E7B0"
+		},
+		{
+			"name": "RedEye",
+			"unicode": "E7B3"
+		},
+		{
+			"name": "ThumbnailView",
+			"unicode": "E7B6"
+		},
+		{
+			"name": "Package",
+			"unicode": "E7B8"
+		},
+		{
+			"name": "Warning",
+			"unicode": "E7BA"
+		},
+		{
+			"name": "Financial",
+			"unicode": "E7BB"
+		},
+		{
+			"name": "Education",
+			"unicode": "E7BE"
+		},
+		{
+			"name": "ShoppingCart",
+			"unicode": "E7BF"
+		},
+		{
+			"name": "Train",
+			"unicode": "E7C0"
+		},
+		{
+			"name": "Move",
+			"unicode": "E7C2"
+		},
+		{
+			"name": "TouchPointer",
+			"unicode": "E7C9"
+		},
+		{
+			"name": "Merge",
+			"unicode": "E7D5"
+		},
+		{
+			"name": "TurnRight",
+			"unicode": "E7DB"
+		},
+		{
+			"name": "Ferry",
+			"unicode": "E7E3"
+		},
+		{
+			"name": "Highlight",
+			"unicode": "E7E6"
+		},
+		{
+			"name": "Tab",
+			"unicode": "E7E9"
+		},
+		{
+			"name": "Admin",
+			"unicode": "E7EF"
+		}
+	]
+}
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-1.json b/packages/icons/config/fabric-icons-1.json
new file mode 100644
index 0000000000000..ad0e709d5f1c4
--- /dev/null
+++ b/packages/icons/config/fabric-icons-1.json
@@ -0,0 +1,412 @@
+{
+	"fontName": "fabric-icons-1",
+	"fontFamilyName": "FabricMDL2Icons-1",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "TVMonitor",
+			"unicode": "E7F4"
+		},
+		{
+			"name": "Speakers",
+			"unicode": "E7F5"
+		},
+		{
+			"name": "Nav2DMapView",
+			"unicode": "E800"
+		},
+		{
+			"name": "Car",
+			"unicode": "E804"
+		},
+		{
+			"name": "Bus",
+			"unicode": "E806"
+		},
+		{
+			"name": "EatDrink",
+			"unicode": "E807"
+		},
+		{
+			"name": "LocationCircle",
+			"unicode": "E80E"
+		},
+		{
+			"name": "Home",
+			"unicode": "E80F"
+		},
+		{
+			"name": "SwitcherStartEnd",
+			"unicode": "E810"
+		},
+		{
+			"name": "ParkingLocation",
+			"unicode": "E811"
+		},
+		{
+			"name": "IncidentTriangle",
+			"unicode": "E814"
+		},
+		{
+			"name": "Touch",
+			"unicode": "E815"
+		},
+		{
+			"name": "MapDirections",
+			"unicode": "E816"
+		},
+		{
+			"name": "History",
+			"unicode": "E81C"
+		},
+		{
+			"name": "Location",
+			"unicode": "E81D"
+		},
+		{
+			"name": "Work",
+			"unicode": "E821"
+		},
+		{
+			"name": "Recent",
+			"unicode": "E823"
+		},
+		{
+			"name": "Hotel",
+			"unicode": "E824"
+		},
+		{
+			"name": "LocationDot",
+			"unicode": "E827"
+		},
+		{
+			"name": "News",
+			"unicode": "E900"
+		},
+		{
+			"name": "Chat",
+			"unicode": "E901"
+		},
+		{
+			"name": "Group",
+			"unicode": "E902"
+		},
+		{
+			"name": "Previous",
+			"unicode": "E892"
+		},
+		{
+			"name": "Next",
+			"unicode": "E893"
+		},
+		{
+			"name": "Sync",
+			"unicode": "E895"
+		},
+		{
+			"name": "Help",
+			"unicode": "E897"
+		},
+		{
+			"name": "Emoji",
+			"unicode": "E899"
+		},
+		{
+			"name": "MailForward",
+			"unicode": "E89C"
+		},
+		{
+			"name": "ClosePane",
+			"unicode": "E89F"
+		},
+		{
+			"name": "OpenPane",
+			"unicode": "E8A0"
+		},
+		{
+			"name": "PreviewLink",
+			"unicode": "E8A1"
+		},
+		{
+			"name": "ZoomIn",
+			"unicode": "E8A3"
+		},
+		{
+			"name": "Bookmarks",
+			"unicode": "E8A4"
+		},
+		{
+			"name": "Document",
+			"unicode": "E8A5"
+		},
+		{
+			"name": "ProtectedDocument",
+			"unicode": "E8A6"
+		},
+		{
+			"name": "OpenInNewWindow",
+			"unicode": "E8A7"
+		},
+		{
+			"name": "MailFill",
+			"unicode": "E8A8"
+		},
+		{
+			"name": "ViewAll",
+			"unicode": "E8A9"
+		},
+		{
+			"name": "Switch",
+			"unicode": "E8AB"
+		},
+		{
+			"name": "Rename",
+			"unicode": "E8AC"
+		},
+		{
+			"name": "Import",
+			"unicode": "E8B5"
+		},
+		{
+			"name": "Picture",
+			"unicode": "E8B9"
+		},
+		{
+			"name": "ShowResults",
+			"unicode": "E8BC"
+		},
+		{
+			"name": "Message",
+			"unicode": "E8BD"
+		},
+		{
+			"name": "CalendarDay",
+			"unicode": "E8BF"
+		},
+		{
+			"name": "CalendarWeek",
+			"unicode": "E8C0"
+		},
+		{
+			"name": "MailReplyAll",
+			"unicode": "E8C2"
+		},
+		{
+			"name": "Read",
+			"unicode": "E8C3"
+		},
+		{
+			"name": "Cut",
+			"unicode": "E8C6"
+		},
+		{
+			"name": "PaymentCard",
+			"unicode": "E8C7"
+		},
+		{
+			"name": "Copy",
+			"unicode": "E8C8"
+		},
+		{
+			"name": "Important",
+			"unicode": "E8C9"
+		},
+		{
+			"name": "MailReply",
+			"unicode": "E8CA"
+		},
+		{
+			"name": "GotoToday",
+			"unicode": "E8D1"
+		},
+		{
+			"name": "Font",
+			"unicode": "E8D2"
+		},
+		{
+			"name": "FontColor",
+			"unicode": "E8D3"
+		},
+		{
+			"name": "FolderFill",
+			"unicode": "E8D5"
+		},
+		{
+			"name": "Permissions",
+			"unicode": "E8D7"
+		},
+		{
+			"name": "DisableUpdates",
+			"unicode": "E8D8"
+		},
+		{
+			"name": "Unfavorite",
+			"unicode": "E8D9"
+		},
+		{
+			"name": "Italic",
+			"unicode": "E8DB"
+		},
+		{
+			"name": "Underline",
+			"unicode": "E8DC"
+		},
+		{
+			"name": "Bold",
+			"unicode": "E8DD"
+		},
+		{
+			"name": "MoveToFolder",
+			"unicode": "E8DE"
+		},
+		{
+			"name": "Dislike",
+			"unicode": "E8E0"
+		},
+		{
+			"name": "Like",
+			"unicode": "E8E1"
+		},
+		{
+			"name": "AlignCenter",
+			"unicode": "E8E3"
+		},
+		{
+			"name": "OpenFile",
+			"unicode": "E8E5"
+		},
+		{
+			"name": "FontDecrease",
+			"unicode": "E8E7"
+		},
+		{
+			"name": "FontIncrease",
+			"unicode": "E8E8"
+		},
+		{
+			"name": "FontSize",
+			"unicode": "E8E9"
+		},
+		{
+			"name": "CellPhone",
+			"unicode": "E8EA"
+		},
+		{
+			"name": "Library",
+			"unicode": "E8F1"
+		},
+		{
+			"name": "PostUpdate",
+			"unicode": "E8F3"
+		},
+		{
+			"name": "NewFolder",
+			"unicode": "E8F4"
+		},
+		{
+			"name": "CalendarReply",
+			"unicode": "E8F5"
+		},
+		{
+			"name": "UnsyncFolder",
+			"unicode": "E8F6"
+		},
+		{
+			"name": "SyncFolder",
+			"unicode": "E8F7"
+		},
+		{
+			"name": "BlockContact",
+			"unicode": "E8F8"
+		},
+		{
+			"name": "BulletedList",
+			"unicode": "E8FD"
+		},
+		{
+			"name": "Preview",
+			"unicode": "E8FF"
+		},
+		{
+			"name": "World",
+			"unicode": "E909"
+		},
+		{
+			"name": "Comment",
+			"unicode": "E90A"
+		},
+		{
+			"name": "DockLeft",
+			"unicode": "E90C"
+		},
+		{
+			"name": "DockRight",
+			"unicode": "E90D"
+		},
+		{
+			"name": "Repair",
+			"unicode": "E90F"
+		},
+		{
+			"name": "Accounts",
+			"unicode": "E910"
+		},
+		{
+			"name": "RadioBullet",
+			"unicode": "E915"
+		},
+		{
+			"name": "Stopwatch",
+			"unicode": "E916"
+		},
+		{
+			"name": "Clock",
+			"unicode": "E917"
+		},
+		{
+			"name": "WorldClock",
+			"unicode": "E918"
+		},
+		{
+			"name": "AlarmClock",
+			"unicode": "E919"
+		},
+		{
+			"name": "Hospital",
+			"unicode": "E91D"
+		},
+		{
+			"name": "Timer",
+			"unicode": "E91E"
+		},
+		{
+			"name": "FullCircleMask",
+			"unicode": "E91F"
+		},
+		{
+			"name": "LocationFill",
+			"unicode": "E920"
+		},
+		{
+			"name": "ChromeMinimize",
+			"unicode": "E921"
+		},
+		{
+			"name": "Annotation",
+			"unicode": "E924"
+		},
+		{
+			"name": "ChromeClose",
+			"unicode": "E8BB"
+		},
+		{
+			"name": "Accept",
+			"unicode": "E8FB"
+		}
+	]
+}
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-10.json b/packages/icons/config/fabric-icons-10.json
new file mode 100644
index 0000000000000..d1dbc8f15ea8d
--- /dev/null
+++ b/packages/icons/config/fabric-icons-10.json
@@ -0,0 +1,412 @@
+{
+	"fontName": "fabric-icons-10",
+	"fontFamilyName": "FabricMDL2Icons-10",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "BankSolid",
+			"unicode": "F34F"
+		},
+		{
+			"name": "DecisionSolid",
+			"unicode": "F350"
+		},
+		{
+			"name": "Parachute",
+			"unicode": "F351"
+		},
+		{
+			"name": "ParachuteSolid",
+			"unicode": "F352"
+		},
+		{
+			"name": "FiltersSolid",
+			"unicode": "F353"
+		},
+		{
+			"name": "ColorSolid",
+			"unicode": "F354"
+		},
+		{
+			"name": "ReviewSolid",
+			"unicode": "F355"
+		},
+		{
+			"name": "ReviewRequestSolid",
+			"unicode": "F356"
+		},
+		{
+			"name": "ReviewRequestMirroredSolid",
+			"unicode": "F357"
+		},
+		{
+			"name": "ReviewResponseSolid",
+			"unicode": "F358"
+		},
+		{
+			"name": "FeedbackRequestSolid",
+			"unicode": "F359"
+		},
+		{
+			"name": "FeedbackRequestMirroredSolid",
+			"unicode": "F35A"
+		},
+		{
+			"name": "FeedbackResponseSolid",
+			"unicode": "F35B"
+		},
+		{
+			"name": "WorkItemBar",
+			"unicode": "F35C"
+		},
+		{
+			"name": "WorkItemBarSolid",
+			"unicode": "F35D"
+		},
+		{
+			"name": "Separator",
+			"unicode": "F35E"
+		},
+		{
+			"name": "NavigateExternalInline",
+			"unicode": "F35F"
+		},
+		{
+			"name": "PlanView",
+			"unicode": "F360"
+		},
+		{
+			"name": "TimelineMatrixView",
+			"unicode": "F361"
+		},
+		{
+			"name": "EngineeringGroup",
+			"unicode": "F362"
+		},
+		{
+			"name": "ProjectCollection",
+			"unicode": "F363"
+		},
+		{
+			"name": "CaretBottomRightCenter8",
+			"unicode": "F364"
+		},
+		{
+			"name": "CaretBottomLeftCenter8",
+			"unicode": "F365"
+		},
+		{
+			"name": "CaretTopRightCenter8",
+			"unicode": "F366"
+		},
+		{
+			"name": "CaretTopLeftCenter8",
+			"unicode": "F367"
+		},
+		{
+			"name": "DonutChart",
+			"unicode": "F368"
+		},
+		{
+			"name": "ChevronUnfold10",
+			"unicode": "F369"
+		},
+		{
+			"name": "ChevronFold10",
+			"unicode": "F36A"
+		},
+		{
+			"name": "DoubleChevronDown8",
+			"unicode": "F36B"
+		},
+		{
+			"name": "DoubleChevronUp8",
+			"unicode": "F36C"
+		},
+		{
+			"name": "DoubleChevronLeft8",
+			"unicode": "F36D"
+		},
+		{
+			"name": "DoubleChevronRight8",
+			"unicode": "F36E"
+		},
+		{
+			"name": "ChevronDownEnd6",
+			"unicode": "F36F"
+		},
+		{
+			"name": "ChevronUpEnd6",
+			"unicode": "F370"
+		},
+		{
+			"name": "ChevronLeftEnd6",
+			"unicode": "F371"
+		},
+		{
+			"name": "ChevronRightEnd6",
+			"unicode": "F372"
+		},
+		{
+			"name": "EgnyteLogo",
+			"unicode": "F373"
+		},
+		{
+			"name": "GoogleDriveLogoLeftGreen",
+			"unicode": "F374"
+		},
+		{
+			"name": "GoogleDriveLogoBottomBlue",
+			"unicode": "F375"
+		},
+		{
+			"name": "GoogleDriveLogoRightYellow",
+			"unicode": "F376"
+		},
+		{
+			"name": "AzureAPIManagement",
+			"unicode": "F37F"
+		},
+		{
+			"name": "AzureServiceEndpoint",
+			"unicode": "F380"
+		},
+		{
+			"name": "VSTSLogo",
+			"unicode": "F381"
+		},
+		{
+			"name": "VSTSAltLogo1",
+			"unicode": "F382"
+		},
+		{
+			"name": "VSTSAltLogo2",
+			"unicode": "F383"
+		},
+		{
+			"name": "FileTypeSolution",
+			"unicode": "F387"
+		},
+		{
+			"name": "WordLogoInverse16",
+			"unicode": "F390"
+		},
+		{
+			"name": "WordLogo16",
+			"unicode": "F391"
+		},
+		{
+			"name": "WordLogoFill16",
+			"unicode": "F392"
+		},
+		{
+			"name": "PowerPointLogoInverse16",
+			"unicode": "F393"
+		},
+		{
+			"name": "PowerPointLogo16",
+			"unicode": "F394"
+		},
+		{
+			"name": "PowerPointLogoFill16",
+			"unicode": "F395"
+		},
+		{
+			"name": "ExcelLogoInverse16",
+			"unicode": "F396"
+		},
+		{
+			"name": "ExcelLogo16",
+			"unicode": "F397"
+		},
+		{
+			"name": "ExcelLogoFill16",
+			"unicode": "F398"
+		},
+		{
+			"name": "OneNoteLogoInverse16",
+			"unicode": "F399"
+		},
+		{
+			"name": "OneNoteLogo16",
+			"unicode": "F39A"
+		},
+		{
+			"name": "OneNoteLogoFill16",
+			"unicode": "F39B"
+		},
+		{
+			"name": "OutlookLogoInverse16",
+			"unicode": "F39C"
+		},
+		{
+			"name": "OutlookLogo16",
+			"unicode": "F39D"
+		},
+		{
+			"name": "OutlookLogoFill16",
+			"unicode": "F39E"
+		},
+		{
+			"name": "PublisherLogoInverse16",
+			"unicode": "F39F"
+		},
+		{
+			"name": "PublisherLogo16",
+			"unicode": "F3A0"
+		},
+		{
+			"name": "PublisherLogoFill16",
+			"unicode": "F3A1"
+		},
+		{
+			"name": "VisioLogoInverse16",
+			"unicode": "F3A2"
+		},
+		{
+			"name": "VisioLogo16",
+			"unicode": "F3A3"
+		},
+		{
+			"name": "VisioLogoFill16",
+			"unicode": "F3A4"
+		},
+		{
+			"name": "TestBeaker",
+			"unicode": "F3A5"
+		},
+		{
+			"name": "TestBeakerSolid",
+			"unicode": "F3A6"
+		},
+		{
+			"name": "TestExploreSolid",
+			"unicode": "F3A7"
+		},
+		{
+			"name": "TestAutoSolid",
+			"unicode": "F3A8"
+		},
+		{
+			"name": "TestUserSolid",
+			"unicode": "F3A9"
+		},
+		{
+			"name": "TestImpactSolid",
+			"unicode": "F3AA"
+		},
+		{
+			"name": "TestPlan",
+			"unicode": "F3AB"
+		},
+		{
+			"name": "TestStep",
+			"unicode": "F3AC"
+		},
+		{
+			"name": "TestParameter",
+			"unicode": "F3AD"
+		},
+		{
+			"name": "TestSuite",
+			"unicode": "F3AE"
+		},
+		{
+			"name": "TestCase",
+			"unicode": "F3AF"
+		},
+		{
+			"name": "Sprint",
+			"unicode": "F3B0"
+		},
+		{
+			"name": "SignOut",
+			"unicode": "F3B1"
+		},
+		{
+			"name": "TriggerApproval",
+			"unicode": "F3B2"
+		},
+		{
+			"name": "Rocket",
+			"unicode": "F3B3"
+		},
+		{
+			"name": "AzureKeyVault",
+			"unicode": "F3B4"
+		},
+		{
+			"name": "LikeSolid",
+			"unicode": "F3BF"
+		},
+		{
+			"name": "DislikeSolid",
+			"unicode": "F3C0"
+		},
+		{
+			"name": "DeclineCall",
+			"unicode": "F405"
+		},
+		{
+			"name": "Spacer",
+			"unicode": "F40D"
+		},
+		{
+			"name": "SkypeLogo16",
+			"unicode": "F40E"
+		},
+		{
+			"name": "SkypeForBusinessLogo16",
+			"unicode": "F40F"
+		},
+		{
+			"name": "SkypeForBusinessLogoFill16",
+			"unicode": "F410"
+		},
+		{
+			"name": "FilterSolid",
+			"unicode": "F412"
+		},
+		{
+			"name": "MailUndelivered",
+			"unicode": "F415"
+		},
+		{
+			"name": "MailTentative",
+			"unicode": "F416"
+		},
+		{
+			"name": "MailTentativeMirrored",
+			"unicode": "F417"
+		},
+		{
+			"name": "MailReminder",
+			"unicode": "F418"
+		},
+		{
+			"name": "ReceiptUndelivered",
+			"unicode": "F419"
+		},
+		{
+			"name": "ReceiptTentative",
+			"unicode": "F41A"
+		},
+		{
+			"name": "ReceiptTentativeMirrored",
+			"unicode": "F41B"
+		},
+		{
+			"name": "Inbox",
+			"unicode": "F41C"
+		},
+		{
+			"name": "IRMReply",
+			"unicode": "F41D"
+		}
+	]
+}
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-11.json b/packages/icons/config/fabric-icons-11.json
new file mode 100644
index 0000000000000..066d1fdcee213
--- /dev/null
+++ b/packages/icons/config/fabric-icons-11.json
@@ -0,0 +1,348 @@
+{
+	"fontName": "fabric-icons-11",
+	"fontFamilyName": "FabricMDL2Icons-11",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "IRMReplyMirrored",
+			"unicode": "F41E"
+		},
+		{
+			"name": "IRMForward",
+			"unicode": "F41F"
+		},
+		{
+			"name": "IRMForwardMirrored",
+			"unicode": "F420"
+		},
+		{
+			"name": "VoicemailIRM",
+			"unicode": "F421"
+		},
+		{
+			"name": "EventAccepted",
+			"unicode": "F422"
+		},
+		{
+			"name": "EventTentative",
+			"unicode": "F423"
+		},
+		{
+			"name": "EventTentativeMirrored",
+			"unicode": "F424"
+		},
+		{
+			"name": "EventDeclined",
+			"unicode": "F425"
+		},
+		{
+			"name": "IDBadge",
+			"unicode": "F427"
+		},
+		{
+			"name": "OfficeFormsLogoInverse16",
+			"unicode": "F433"
+		},
+		{
+			"name": "OfficeFormsLogo",
+			"unicode": "F434"
+		},
+		{
+			"name": "OfficeFormsLogoFill",
+			"unicode": "F435"
+		},
+		{
+			"name": "OfficeFormsLogo16",
+			"unicode": "F436"
+		},
+		{
+			"name": "OfficeFormsLogoFill16",
+			"unicode": "F437"
+		},
+		{
+			"name": "OfficeFormsLogoInverse24",
+			"unicode": "F43A"
+		},
+		{
+			"name": "OfficeFormsLogo24",
+			"unicode": "F43B"
+		},
+		{
+			"name": "OfficeFormsLogoFill24",
+			"unicode": "F43C"
+		},
+		{
+			"name": "PageLock",
+			"unicode": "F43F"
+		},
+		{
+			"name": "NotExecuted",
+			"unicode": "F440"
+		},
+		{
+			"name": "NotImpactedSolid",
+			"unicode": "F441"
+		},
+		{
+			"name": "FieldReadOnly",
+			"unicode": "F442"
+		},
+		{
+			"name": "FieldRequired",
+			"unicode": "F443"
+		},
+		{
+			"name": "BacklogBoard",
+			"unicode": "F444"
+		},
+		{
+			"name": "ExternalBuild",
+			"unicode": "F445"
+		},
+		{
+			"name": "ExternalTFVC",
+			"unicode": "F446"
+		},
+		{
+			"name": "ExternalXAML",
+			"unicode": "F447"
+		},
+		{
+			"name": "IssueSolid",
+			"unicode": "F448"
+		},
+		{
+			"name": "DefectSolid",
+			"unicode": "F449"
+		},
+		{
+			"name": "LadybugSolid",
+			"unicode": "F44A"
+		},
+		{
+			"name": "MTMLogo",
+			"unicode": "F44B"
+		},
+		{
+			"name": "NugetLogo",
+			"unicode": "F44C"
+		},
+		{
+			"name": "TFVCLogo",
+			"unicode": "F44D"
+		},
+		{
+			"name": "ProjectLogo32",
+			"unicode": "F47E"
+		},
+		{
+			"name": "ProjectLogoFill32",
+			"unicode": "F47F"
+		},
+		{
+			"name": "ProjectLogo16",
+			"unicode": "F480"
+		},
+		{
+			"name": "ProjectLogoFill16",
+			"unicode": "F481"
+		},
+		{
+			"name": "SwayLogo32",
+			"unicode": "F482"
+		},
+		{
+			"name": "SwayLogoFill32",
+			"unicode": "F483"
+		},
+		{
+			"name": "SwayLogo16",
+			"unicode": "F484"
+		},
+		{
+			"name": "SwayLogoFill16",
+			"unicode": "F485"
+		},
+		{
+			"name": "ClassNotebookLogo32",
+			"unicode": "F486"
+		},
+		{
+			"name": "ClassNotebookLogoFill32",
+			"unicode": "F487"
+		},
+		{
+			"name": "ClassNotebookLogo16",
+			"unicode": "F488"
+		},
+		{
+			"name": "ClassNotebookLogoFill16",
+			"unicode": "F489"
+		},
+		{
+			"name": "ClassNotebookLogoInverse32",
+			"unicode": "F48A"
+		},
+		{
+			"name": "ClassNotebookLogoInverse16",
+			"unicode": "F48B"
+		},
+		{
+			"name": "StaffNotebookLogo32",
+			"unicode": "F48C"
+		},
+		{
+			"name": "StaffNotebookLogoFill32",
+			"unicode": "F48D"
+		},
+		{
+			"name": "StaffNotebookLogo16",
+			"unicode": "F48E"
+		},
+		{
+			"name": "StaffNotebookLogoFill16",
+			"unicode": "F48F"
+		},
+		{
+			"name": "StaffNotebookLogoInverted32",
+			"unicode": "F490"
+		},
+		{
+			"name": "StaffNotebookLogoInverted16",
+			"unicode": "F491"
+		},
+		{
+			"name": "KaizalaLogo",
+			"unicode": "F492"
+		},
+		{
+			"name": "TaskLogo",
+			"unicode": "F493"
+		},
+		{
+			"name": "ProtectionCenterLogo32",
+			"unicode": "F494"
+		},
+		{
+			"name": "NonprofitLogo32",
+			"unicode": "F495"
+		},
+		{
+			"name": "GallatinLogo",
+			"unicode": "F496"
+		},
+		{
+			"name": "Globe2",
+			"unicode": "F49A"
+		},
+		{
+			"name": "Guitar",
+			"unicode": "F49B"
+		},
+		{
+			"name": "Breakfast",
+			"unicode": "F49C"
+		},
+		{
+			"name": "Brunch",
+			"unicode": "F49D"
+		},
+		{
+			"name": "BeerMug",
+			"unicode": "F49E"
+		},
+		{
+			"name": "Vacation",
+			"unicode": "F49F"
+		},
+		{
+			"name": "Teeth",
+			"unicode": "F4A0"
+		},
+		{
+			"name": "Taxi",
+			"unicode": "F4A1"
+		},
+		{
+			"name": "Chopsticks",
+			"unicode": "F4A2"
+		},
+		{
+			"name": "SyncOccurence",
+			"unicode": "F4A3"
+		},
+		{
+			"name": "UnsyncOccurence",
+			"unicode": "F4A4"
+		},
+		{
+			"name": "PrimaryCalendar",
+			"unicode": "F4AE"
+		},
+		{
+			"name": "SearchCalendar",
+			"unicode": "F4AF"
+		},
+		{
+			"name": "VideoOff",
+			"unicode": "F4B0"
+		},
+		{
+			"name": "MicrosoftFlowLogo",
+			"unicode": "F4B1"
+		},
+		{
+			"name": "BusinessCenterLogo",
+			"unicode": "F4B2"
+		},
+		{
+			"name": "ToDoLogoBottom",
+			"unicode": "F4B3"
+		},
+		{
+			"name": "ToDoLogoTop",
+			"unicode": "F4B4"
+		},
+		{
+			"name": "EditSolid12",
+			"unicode": "F4B5"
+		},
+		{
+			"name": "EditSolidMirrored12",
+			"unicode": "F4B6"
+		},
+		{
+			"name": "UneditableSolid12",
+			"unicode": "F4B7"
+		},
+		{
+			"name": "UneditableSolidMirrored12",
+			"unicode": "F4B8"
+		},
+		{
+			"name": "UneditableMirrored",
+			"unicode": "F4B9"
+		},
+		{
+			"name": "AdminALogo32",
+			"unicode": "F4BA"
+		},
+		{
+			"name": "AdminALogoFill32",
+			"unicode": "F4BB"
+		},
+		{
+			"name": "ToDoLogoInverse",
+			"unicode": "F4BC"
+		},
+		{
+			"name": "Snooze",
+			"unicode": "F4BD"
+		}
+	]
+}
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-2.json b/packages/icons/config/fabric-icons-2.json
new file mode 100644
index 0000000000000..14778741c089a
--- /dev/null
+++ b/packages/icons/config/fabric-icons-2.json
@@ -0,0 +1,412 @@
+{
+	"fontName": "fabric-icons-2",
+	"fontFamilyName": "FabricMDL2Icons-2",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "Fingerprint",
+			"unicode": "E928"
+		},
+		{
+			"name": "Handwriting",
+			"unicode": "E929"
+		},
+		{
+			"name": "StackIndicator",
+			"unicode": "E7FF"
+		},
+		{
+			"name": "Completed",
+			"unicode": "E930"
+		},
+		{
+			"name": "Label",
+			"unicode": "E932"
+		},
+		{
+			"name": "FlickDown",
+			"unicode": "E935"
+		},
+		{
+			"name": "FlickUp",
+			"unicode": "E936"
+		},
+		{
+			"name": "FlickLeft",
+			"unicode": "E937"
+		},
+		{
+			"name": "FlickRight",
+			"unicode": "E938"
+		},
+		{
+			"name": "Streaming",
+			"unicode": "E93E"
+		},
+		{
+			"name": "MusicInCollection",
+			"unicode": "E940"
+		},
+		{
+			"name": "OneDrive",
+			"unicode": "E941"
+		},
+		{
+			"name": "CompassNW",
+			"unicode": "E942"
+		},
+		{
+			"name": "Code",
+			"unicode": "E943"
+		},
+		{
+			"name": "LightningBolt",
+			"unicode": "E945"
+		},
+		{
+			"name": "CalculatorMultiply",
+			"unicode": "E947"
+		},
+		{
+			"name": "CalculatorAddition",
+			"unicode": "E948"
+		},
+		{
+			"name": "CalculatorSubtract",
+			"unicode": "E949"
+		},
+		{
+			"name": "CalculatorEqualTo",
+			"unicode": "E94E"
+		},
+		{
+			"name": "PrintfaxPrinterFile",
+			"unicode": "E956"
+		},
+		{
+			"name": "Communications",
+			"unicode": "E95A"
+		},
+		{
+			"name": "Headset",
+			"unicode": "E95B"
+		},
+		{
+			"name": "Health",
+			"unicode": "E95E"
+		},
+		{
+			"name": "ChevronUpSmall",
+			"unicode": "E96D"
+		},
+		{
+			"name": "ChevronDownSmall",
+			"unicode": "E96E"
+		},
+		{
+			"name": "ChevronLeftSmall",
+			"unicode": "E96F"
+		},
+		{
+			"name": "ChevronRightSmall",
+			"unicode": "E970"
+		},
+		{
+			"name": "ChevronUpMed",
+			"unicode": "E971"
+		},
+		{
+			"name": "ChevronDownMed",
+			"unicode": "E972"
+		},
+		{
+			"name": "ChevronLeftMed",
+			"unicode": "E973"
+		},
+		{
+			"name": "ChevronRightMed",
+			"unicode": "E974"
+		},
+		{
+			"name": "Dictionary",
+			"unicode": "E82D"
+		},
+		{
+			"name": "ChromeBack",
+			"unicode": "E830"
+		},
+		{
+			"name": "PC1",
+			"unicode": "E977"
+		},
+		{
+			"name": "PresenceChickletVideo",
+			"unicode": "E979"
+		},
+		{
+			"name": "Reply",
+			"unicode": "E97A"
+		},
+		{
+			"name": "HalfAlpha",
+			"unicode": "E97E"
+		},
+		{
+			"name": "LockSolid",
+			"unicode": "E9A2"
+		},
+		{
+			"name": "ConstructionCone",
+			"unicode": "E98F"
+		},
+		{
+			"name": "DoubleChevronLeftMed",
+			"unicode": "E991"
+		},
+		{
+			"name": "Volume0",
+			"unicode": "E992"
+		},
+		{
+			"name": "Volume1",
+			"unicode": "E993"
+		},
+		{
+			"name": "Volume2",
+			"unicode": "E994"
+		},
+		{
+			"name": "Volume3",
+			"unicode": "E995"
+		},
+		{
+			"name": "CaretHollow",
+			"unicode": "E817"
+		},
+		{
+			"name": "CaretSolid",
+			"unicode": "E818"
+		},
+		{
+			"name": "FolderOpen",
+			"unicode": "E838"
+		},
+		{
+			"name": "PinnedFill",
+			"unicode": "E842"
+		},
+		{
+			"name": "Chart",
+			"unicode": "E999"
+		},
+		{
+			"name": "Robot",
+			"unicode": "E99A"
+		},
+		{
+			"name": "BidiLtr",
+			"unicode": "E9AA"
+		},
+		{
+			"name": "BidiRtl",
+			"unicode": "E9AB"
+		},
+		{
+			"name": "RevToggleKey",
+			"unicode": "E845"
+		},
+		{
+			"name": "RightDoubleQuote",
+			"unicode": "E9B1"
+		},
+		{
+			"name": "Sunny",
+			"unicode": "E9BD"
+		},
+		{
+			"name": "CloudWeather",
+			"unicode": "E9BE"
+		},
+		{
+			"name": "Cloudy",
+			"unicode": "E9BF"
+		},
+		{
+			"name": "PartlyCloudyDay",
+			"unicode": "E9C0"
+		},
+		{
+			"name": "PartlyCloudyNight",
+			"unicode": "E9C1"
+		},
+		{
+			"name": "ClearNight",
+			"unicode": "E9C2"
+		},
+		{
+			"name": "RainShowersDay",
+			"unicode": "E9C3"
+		},
+		{
+			"name": "Rain",
+			"unicode": "E9C4"
+		},
+		{
+			"name": "Thunderstorms",
+			"unicode": "E9C6"
+		},
+		{
+			"name": "RainSnow",
+			"unicode": "E9C7"
+		},
+		{
+			"name": "Snow",
+			"unicode": "E9C8"
+		},
+		{
+			"name": "BlowingSnow",
+			"unicode": "E9C9"
+		},
+		{
+			"name": "Frigid",
+			"unicode": "E9CA"
+		},
+		{
+			"name": "Fog",
+			"unicode": "E9CB"
+		},
+		{
+			"name": "Squalls",
+			"unicode": "E9CC"
+		},
+		{
+			"name": "Duststorm",
+			"unicode": "E9CD"
+		},
+		{
+			"name": "Unknown",
+			"unicode": "E9CE"
+		},
+		{
+			"name": "Precipitation",
+			"unicode": "E9CF"
+		},
+		{
+			"name": "Ringer",
+			"unicode": "EA8F"
+		},
+		{
+			"name": "PDF",
+			"unicode": "EA90"
+		},
+		{
+			"name": "Ribbon",
+			"unicode": "E9D1"
+		},
+		{
+			"name": "AreaChart",
+			"unicode": "E9D2"
+		},
+		{
+			"name": "Assign",
+			"unicode": "E9D3"
+		},
+		{
+			"name": "CheckList",
+			"unicode": "E9D5"
+		},
+		{
+			"name": "Diagnostic",
+			"unicode": "E9D9"
+		},
+		{
+			"name": "Generate",
+			"unicode": "E9DA"
+		},
+		{
+			"name": "LineChart",
+			"unicode": "E9E6"
+		},
+		{
+			"name": "Equalizer",
+			"unicode": "E9E9"
+		},
+		{
+			"name": "BarChartHorizontal",
+			"unicode": "E9EB"
+		},
+		{
+			"name": "BarChartVertical",
+			"unicode": "E9EC"
+		},
+		{
+			"name": "Freezing",
+			"unicode": "E9EF"
+		},
+		{
+			"name": "Processing",
+			"unicode": "E9F5"
+		},
+		{
+			"name": "SnowShowerDay",
+			"unicode": "E9FD"
+		},
+		{
+			"name": "HailDay",
+			"unicode": "EA00"
+		},
+		{
+			"name": "WorkFlow",
+			"unicode": "EA01"
+		},
+		{
+			"name": "StoreLogoMed",
+			"unicode": "EA04"
+		},
+		{
+			"name": "TriangleSolid",
+			"unicode": "EA08"
+		},
+		{
+			"name": "RainShowersNight",
+			"unicode": "EA0F"
+		},
+		{
+			"name": "SnowShowerNight",
+			"unicode": "EA11"
+		},
+		{
+			"name": "HailNight",
+			"unicode": "EA13"
+		},
+		{
+			"name": "Info2",
+			"unicode": "EA1F"
+		},
+		{
+			"name": "StoreLogo",
+			"unicode": "EA96"
+		},
+		{
+			"name": "MultiSelectMirrored",
+			"unicode": "EA98"
+		},
+		{
+			"name": "Broom",
+			"unicode": "EA99"
+		},
+		{
+			"name": "MusicInCollectionFill",
+			"unicode": "EA36"
+		},
+		{
+			"name": "Asterisk",
+			"unicode": "EA38"
+		}
+	]
+}
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-3.json b/packages/icons/config/fabric-icons-3.json
new file mode 100644
index 0000000000000..41765e0c23989
--- /dev/null
+++ b/packages/icons/config/fabric-icons-3.json
@@ -0,0 +1,412 @@
+{
+	"fontName": "fabric-icons-3",
+	"fontFamilyName": "FabricMDL2Icons-3",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "ErrorBadge",
+			"unicode": "EA39"
+		},
+		{
+			"name": "CircleFill",
+			"unicode": "EA3B"
+		},
+		{
+			"name": "Record2",
+			"unicode": "EA3F"
+		},
+		{
+			"name": "BookmarksMirrored",
+			"unicode": "EA41"
+		},
+		{
+			"name": "BulletedListMirrored",
+			"unicode": "EA42"
+		},
+		{
+			"name": "CaretHollowMirrored",
+			"unicode": "EA45"
+		},
+		{
+			"name": "CaretSolidMirrored",
+			"unicode": "EA46"
+		},
+		{
+			"name": "ChromeBackMirrored",
+			"unicode": "EA47"
+		},
+		{
+			"name": "ClosePaneMirrored",
+			"unicode": "EA49"
+		},
+		{
+			"name": "DockLeftMirrored",
+			"unicode": "EA4C"
+		},
+		{
+			"name": "DoubleChevronLeftMedMirrored",
+			"unicode": "EA4D"
+		},
+		{
+			"name": "HelpMirrored",
+			"unicode": "EA51"
+		},
+		{
+			"name": "ImportMirrored",
+			"unicode": "EA52"
+		},
+		{
+			"name": "ListMirrored",
+			"unicode": "EA55"
+		},
+		{
+			"name": "MailForwardMirrored",
+			"unicode": "EA56"
+		},
+		{
+			"name": "MailReplyMirrored",
+			"unicode": "EA57"
+		},
+		{
+			"name": "MailReplyAllMirrored",
+			"unicode": "EA58"
+		},
+		{
+			"name": "OpenPaneMirrored",
+			"unicode": "EA5B"
+		},
+		{
+			"name": "ParkingLocationMirrored",
+			"unicode": "EA5E"
+		},
+		{
+			"name": "SendMirrored",
+			"unicode": "EA63"
+		},
+		{
+			"name": "ShowResultsMirrored",
+			"unicode": "EA65"
+		},
+		{
+			"name": "ThumbnailViewMirrored",
+			"unicode": "EA67"
+		},
+		{
+			"name": "Devices3",
+			"unicode": "EA6C"
+		},
+		{
+			"name": "Lightbulb",
+			"unicode": "EA80"
+		},
+		{
+			"name": "StatusTriangle",
+			"unicode": "EA82"
+		},
+		{
+			"name": "VolumeDisabled",
+			"unicode": "EA85"
+		},
+		{
+			"name": "Puzzle",
+			"unicode": "EA86"
+		},
+		{
+			"name": "EmojiNeutral",
+			"unicode": "EA87"
+		},
+		{
+			"name": "EmojiDisappointed",
+			"unicode": "EA88"
+		},
+		{
+			"name": "HomeSolid",
+			"unicode": "EA8A"
+		},
+		{
+			"name": "Cocktails",
+			"unicode": "EA9D"
+		},
+		{
+			"name": "Wines",
+			"unicode": "EABF"
+		},
+		{
+			"name": "Articles",
+			"unicode": "EAC1"
+		},
+		{
+			"name": "Cycling",
+			"unicode": "EAC7"
+		},
+		{
+			"name": "DietPlanNotebook",
+			"unicode": "EAC8"
+		},
+		{
+			"name": "Pill",
+			"unicode": "EACB"
+		},
+		{
+			"name": "ExerciseTracker",
+			"unicode": "EACC"
+		},
+		{
+			"name": "Medical",
+			"unicode": "EAD4"
+		},
+		{
+			"name": "Running",
+			"unicode": "EADA"
+		},
+		{
+			"name": "Weights",
+			"unicode": "EADB"
+		},
+		{
+			"name": "BarChart4",
+			"unicode": "EAE7"
+		},
+		{
+			"name": "CirclePlus",
+			"unicode": "EAEE"
+		},
+		{
+			"name": "Coffee",
+			"unicode": "EAEF"
+		},
+		{
+			"name": "Cotton",
+			"unicode": "EAF3"
+		},
+		{
+			"name": "Market",
+			"unicode": "EAFC"
+		},
+		{
+			"name": "Money",
+			"unicode": "EAFD"
+		},
+		{
+			"name": "PieDouble",
+			"unicode": "EB04"
+		},
+		{
+			"name": "PieSingle",
+			"unicode": "EB05"
+		},
+		{
+			"name": "RemoveFilter",
+			"unicode": "EB08"
+		},
+		{
+			"name": "Savings",
+			"unicode": "EB0B"
+		},
+		{
+			"name": "StockDown",
+			"unicode": "EB0F"
+		},
+		{
+			"name": "StockUp",
+			"unicode": "EB11"
+		},
+		{
+			"name": "MSNVideos",
+			"unicode": "EB1C"
+		},
+		{
+			"name": "Cricket",
+			"unicode": "EB1E"
+		},
+		{
+			"name": "Golf",
+			"unicode": "EB1F"
+		},
+		{
+			"name": "Baseball",
+			"unicode": "EB20"
+		},
+		{
+			"name": "Soccer",
+			"unicode": "EB21"
+		},
+		{
+			"name": "MoreSports",
+			"unicode": "EB22"
+		},
+		{
+			"name": "AutoRacing",
+			"unicode": "EB24"
+		},
+		{
+			"name": "CollegeHoops",
+			"unicode": "EB25"
+		},
+		{
+			"name": "CollegeFootball",
+			"unicode": "EB26"
+		},
+		{
+			"name": "ProFootball",
+			"unicode": "EB27"
+		},
+		{
+			"name": "ProHockey",
+			"unicode": "EB28"
+		},
+		{
+			"name": "Rugby",
+			"unicode": "EB2D"
+		},
+		{
+			"name": "Tennis",
+			"unicode": "EB33"
+		},
+		{
+			"name": "Arrivals",
+			"unicode": "EB34"
+		},
+		{
+			"name": "Design",
+			"unicode": "EB3C"
+		},
+		{
+			"name": "Website",
+			"unicode": "EB41"
+		},
+		{
+			"name": "Drop",
+			"unicode": "EB42"
+		},
+		{
+			"name": "SkiResorts",
+			"unicode": "EB45"
+		},
+		{
+			"name": "Snowflake",
+			"unicode": "EB46"
+		},
+		{
+			"name": "BusSolid",
+			"unicode": "EB47"
+		},
+		{
+			"name": "FerrySolid",
+			"unicode": "EB48"
+		},
+		{
+			"name": "AirplaneSolid",
+			"unicode": "EB4C"
+		},
+		{
+			"name": "TrainSolid",
+			"unicode": "EB4D"
+		},
+		{
+			"name": "Ticket",
+			"unicode": "EB54"
+		},
+		{
+			"name": "Devices4",
+			"unicode": "EB66"
+		},
+		{
+			"name": "AzureLogo",
+			"unicode": "EB6A"
+		},
+		{
+			"name": "BingLogo",
+			"unicode": "EB6B"
+		},
+		{
+			"name": "MSNLogo",
+			"unicode": "EB6C"
+		},
+		{
+			"name": "OutlookLogoInverse",
+			"unicode": "EB6D"
+		},
+		{
+			"name": "OfficeLogo",
+			"unicode": "EB6E"
+		},
+		{
+			"name": "SkypeLogo",
+			"unicode": "EB6F"
+		},
+		{
+			"name": "Door",
+			"unicode": "EB75"
+		},
+		{
+			"name": "EditMirrored",
+			"unicode": "EB7E"
+		},
+		{
+			"name": "GiftCard",
+			"unicode": "EB8E"
+		},
+		{
+			"name": "DoubleBookmark",
+			"unicode": "EB8F"
+		},
+		{
+			"name": "StatusErrorFull",
+			"unicode": "EB90"
+		},
+		{
+			"name": "Certificate",
+			"unicode": "EB95"
+		},
+		{
+			"name": "FastForward",
+			"unicode": "EB9D"
+		},
+		{
+			"name": "Rewind",
+			"unicode": "EB9E"
+		},
+		{
+			"name": "Photo2",
+			"unicode": "EB9F"
+		},
+		{
+			"name": "OpenSource",
+			"unicode": "EBC2"
+		},
+		{
+			"name": "CloudDownload",
+			"unicode": "EBD3"
+		},
+		{
+			"name": "WindDirection",
+			"unicode": "EBE6"
+		},
+		{
+			"name": "Family",
+			"unicode": "EBDA"
+		},
+		{
+			"name": "CSS",
+			"unicode": "EBEF"
+		},
+		{
+			"name": "JS",
+			"unicode": "EBF0"
+		},
+		{
+			"name": "DeliveryTruck",
+			"unicode": "EBF4"
+		},
+		{
+			"name": "ReminderPerson",
+			"unicode": "EBF7"
+		}
+	]
+}
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-4.json b/packages/icons/config/fabric-icons-4.json
new file mode 100644
index 0000000000000..d250f6c1c128c
--- /dev/null
+++ b/packages/icons/config/fabric-icons-4.json
@@ -0,0 +1,412 @@
+{
+	"fontName": "fabric-icons-4",
+	"fontFamilyName": "FabricMDL2Icons-4",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "ReminderGroup",
+			"unicode": "EBF8"
+		},
+		{
+			"name": "Umbrella",
+			"unicode": "EC04"
+		},
+		{
+			"name": "NetworkTower",
+			"unicode": "EC05"
+		},
+		{
+			"name": "CityNext",
+			"unicode": "EC06"
+		},
+		{
+			"name": "Section",
+			"unicode": "EC0C"
+		},
+		{
+			"name": "OneNoteLogoInverse",
+			"unicode": "EC0D"
+		},
+		{
+			"name": "ToggleFilled",
+			"unicode": "EC11"
+		},
+		{
+			"name": "ToggleBorder",
+			"unicode": "EC12"
+		},
+		{
+			"name": "SliderThumb",
+			"unicode": "EC13"
+		},
+		{
+			"name": "ToggleThumb",
+			"unicode": "EC14"
+		},
+		{
+			"name": "Documentation",
+			"unicode": "EC17"
+		},
+		{
+			"name": "Badge",
+			"unicode": "EC1B"
+		},
+		{
+			"name": "Giftbox",
+			"unicode": "EC1F"
+		},
+		{
+			"name": "VisualStudioLogo",
+			"unicode": "EC22"
+		},
+		{
+			"name": "ExcelLogoInverse",
+			"unicode": "EC28"
+		},
+		{
+			"name": "WordLogoInverse",
+			"unicode": "EC29"
+		},
+		{
+			"name": "PowerPointLogoInverse",
+			"unicode": "EC2A"
+		},
+		{
+			"name": "Cafe",
+			"unicode": "EC32"
+		},
+		{
+			"name": "SpeedHigh",
+			"unicode": "EC4A"
+		},
+		{
+			"name": "ThisPC",
+			"unicode": "EC4E"
+		},
+		{
+			"name": "MusicNote",
+			"unicode": "EC4F"
+		},
+		{
+			"name": "MicOff",
+			"unicode": "EC54"
+		},
+		{
+			"name": "EdgeLogo",
+			"unicode": "EC60"
+		},
+		{
+			"name": "CompletedSolid",
+			"unicode": "EC61"
+		},
+		{
+			"name": "AlbumRemove",
+			"unicode": "EC62"
+		},
+		{
+			"name": "MessageFill",
+			"unicode": "EC70"
+		},
+		{
+			"name": "TabletSelected",
+			"unicode": "EC74"
+		},
+		{
+			"name": "MobileSelected",
+			"unicode": "EC75"
+		},
+		{
+			"name": "LaptopSelected",
+			"unicode": "EC76"
+		},
+		{
+			"name": "TVMonitorSelected",
+			"unicode": "EC77"
+		},
+		{
+			"name": "DeveloperTools",
+			"unicode": "EC7A"
+		},
+		{
+			"name": "InsertTextBox",
+			"unicode": "EC7D"
+		},
+		{
+			"name": "LowerBrightness",
+			"unicode": "EC8A"
+		},
+		{
+			"name": "CloudUpload",
+			"unicode": "EC8E"
+		},
+		{
+			"name": "ScrollUpDown",
+			"unicode": "EC8F"
+		},
+		{
+			"name": "DateTime",
+			"unicode": "EC92"
+		},
+		{
+			"name": "Event",
+			"unicode": "ECA3"
+		},
+		{
+			"name": "Cake",
+			"unicode": "ECA4"
+		},
+		{
+			"name": "Org",
+			"unicode": "ECA6"
+		},
+		{
+			"name": "PartyLeader",
+			"unicode": "ECA7"
+		},
+		{
+			"name": "DRM",
+			"unicode": "ECA8"
+		},
+		{
+			"name": "CloudAdd",
+			"unicode": "ECA9"
+		},
+		{
+			"name": "AppIconDefault",
+			"unicode": "ECAA"
+		},
+		{
+			"name": "Photo2Add",
+			"unicode": "ECAB"
+		},
+		{
+			"name": "Photo2Remove",
+			"unicode": "ECAC"
+		},
+		{
+			"name": "POI",
+			"unicode": "ECAF"
+		},
+		{
+			"name": "FacebookLogo",
+			"unicode": "ECB3"
+		},
+		{
+			"name": "AddTo",
+			"unicode": "ECC8"
+		},
+		{
+			"name": "RadioBtnOff",
+			"unicode": "ECCA"
+		},
+		{
+			"name": "RadioBtnOn",
+			"unicode": "ECCB"
+		},
+		{
+			"name": "ExploreContent",
+			"unicode": "ECCD"
+		},
+		{
+			"name": "VideoSolid",
+			"unicode": "EA0C"
+		},
+		{
+			"name": "Teamwork",
+			"unicode": "EA12"
+		},
+		{
+			"name": "PeopleAdd",
+			"unicode": "EA15"
+		},
+		{
+			"name": "Glasses",
+			"unicode": "EA16"
+		},
+		{
+			"name": "DateTime2",
+			"unicode": "EA17"
+		},
+		{
+			"name": "Shield",
+			"unicode": "EA18"
+		},
+		{
+			"name": "Header1",
+			"unicode": "EA19"
+		},
+		{
+			"name": "PageAdd",
+			"unicode": "EA1A"
+		},
+		{
+			"name": "NumberedList",
+			"unicode": "EA1C"
+		},
+		{
+			"name": "PowerBILogo",
+			"unicode": "EA1E"
+		},
+		{
+			"name": "Product",
+			"unicode": "ECDC"
+		},
+		{
+			"name": "ProgressLoopInner",
+			"unicode": "ECDE"
+		},
+		{
+			"name": "ProgressLoopOuter",
+			"unicode": "ECDF"
+		},
+		{
+			"name": "Blocked2",
+			"unicode": "ECE4"
+		},
+		{
+			"name": "FangBody",
+			"unicode": "ECEB"
+		},
+		{
+			"name": "Glimmer",
+			"unicode": "ECF4"
+		},
+		{
+			"name": "ChatInviteFriend",
+			"unicode": "ECFE"
+		},
+		{
+			"name": "Crown",
+			"unicode": "ED01"
+		},
+		{
+			"name": "Feedback",
+			"unicode": "ED15"
+		},
+		{
+			"name": "SharepointLogoInverse",
+			"unicode": "ED18"
+		},
+		{
+			"name": "YammerLogo",
+			"unicode": "ED19"
+		},
+		{
+			"name": "Hide",
+			"unicode": "ED1A"
+		},
+		{
+			"name": "Uneditable",
+			"unicode": "ED1D"
+		},
+		{
+			"name": "ReturnToSession",
+			"unicode": "ED24"
+		},
+		{
+			"name": "OpenFolderHorizontal",
+			"unicode": "ED25"
+		},
+		{
+			"name": "CalendarMirrored",
+			"unicode": "ED28"
+		},
+		{
+			"name": "SwayLogoInverse",
+			"unicode": "ED29"
+		},
+		{
+			"name": "OutOfOffice",
+			"unicode": "ED34"
+		},
+		{
+			"name": "Trophy",
+			"unicode": "ED3F"
+		},
+		{
+			"name": "ReopenPages",
+			"unicode": "ED50"
+		},
+		{
+			"name": "AADLogo",
+			"unicode": "ED68"
+		},
+		{
+			"name": "AccessLogo",
+			"unicode": "ED69"
+		},
+		{
+			"name": "AdminALogoInverse32",
+			"unicode": "ED6A"
+		},
+		{
+			"name": "AdminCLogoInverse32",
+			"unicode": "ED6B"
+		},
+		{
+			"name": "AdminDLogoInverse32",
+			"unicode": "ED6C"
+		},
+		{
+			"name": "AdminELogoInverse32",
+			"unicode": "ED6D"
+		},
+		{
+			"name": "AdminLLogoInverse32",
+			"unicode": "ED6E"
+		},
+		{
+			"name": "AdminMLogoInverse32",
+			"unicode": "ED6F"
+		},
+		{
+			"name": "AdminOLogoInverse32",
+			"unicode": "ED70"
+		},
+		{
+			"name": "AdminPLogoInverse32",
+			"unicode": "ED71"
+		},
+		{
+			"name": "AdminSLogoInverse32",
+			"unicode": "ED72"
+		},
+		{
+			"name": "AdminYLogoInverse32",
+			"unicode": "ED73"
+		},
+		{
+			"name": "BoxLogo",
+			"unicode": "ED75"
+		},
+		{
+			"name": "DelveLogoInverse",
+			"unicode": "ED76"
+		},
+		{
+			"name": "DropboxLogo",
+			"unicode": "ED77"
+		},
+		{
+			"name": "ExchangeLogoInverse",
+			"unicode": "ED78"
+		},
+		{
+			"name": "LyncLogo",
+			"unicode": "ED79"
+		},
+		{
+			"name": "OfficeVideoLogoInverse",
+			"unicode": "ED7A"
+		},
+		{
+			"name": "ParatureLogo",
+			"unicode": "ED7B"
+		}
+	]
+}
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-5.json b/packages/icons/config/fabric-icons-5.json
new file mode 100644
index 0000000000000..a7a0fdeeea738
--- /dev/null
+++ b/packages/icons/config/fabric-icons-5.json
@@ -0,0 +1,412 @@
+{
+	"fontName": "fabric-icons-5",
+	"fontFamilyName": "FabricMDL2Icons-5",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "SocialListeningLogo",
+			"unicode": "ED7C"
+		},
+		{
+			"name": "VisioLogoInverse",
+			"unicode": "ED7D"
+		},
+		{
+			"name": "Balloons",
+			"unicode": "ED7E"
+		},
+		{
+			"name": "Cat",
+			"unicode": "ED7F"
+		},
+		{
+			"name": "MailAlert",
+			"unicode": "ED80"
+		},
+		{
+			"name": "MailCheck",
+			"unicode": "ED81"
+		},
+		{
+			"name": "MailLowImportance",
+			"unicode": "ED82"
+		},
+		{
+			"name": "MailPause",
+			"unicode": "ED83"
+		},
+		{
+			"name": "MailRepeat",
+			"unicode": "ED84"
+		},
+		{
+			"name": "SecurityGroup",
+			"unicode": "ED85"
+		},
+		{
+			"name": "Table",
+			"unicode": "ED86"
+		},
+		{
+			"name": "VoicemailForward",
+			"unicode": "ED87"
+		},
+		{
+			"name": "VoicemailReply",
+			"unicode": "ED88"
+		},
+		{
+			"name": "Waffle",
+			"unicode": "ED89"
+		},
+		{
+			"name": "RemoveEvent",
+			"unicode": "ED8A"
+		},
+		{
+			"name": "EventInfo",
+			"unicode": "ED8B"
+		},
+		{
+			"name": "ForwardEvent",
+			"unicode": "ED8C"
+		},
+		{
+			"name": "WipePhone",
+			"unicode": "ED8D"
+		},
+		{
+			"name": "AddOnlineMeeting",
+			"unicode": "ED8E"
+		},
+		{
+			"name": "JoinOnlineMeeting",
+			"unicode": "ED8F"
+		},
+		{
+			"name": "RemoveLink",
+			"unicode": "ED90"
+		},
+		{
+			"name": "PeopleBlock",
+			"unicode": "ED91"
+		},
+		{
+			"name": "PeopleRepeat",
+			"unicode": "ED92"
+		},
+		{
+			"name": "PeopleAlert",
+			"unicode": "ED93"
+		},
+		{
+			"name": "PeoplePause",
+			"unicode": "ED94"
+		},
+		{
+			"name": "TransferCall",
+			"unicode": "ED95"
+		},
+		{
+			"name": "AddPhone",
+			"unicode": "ED96"
+		},
+		{
+			"name": "UnknownCall",
+			"unicode": "ED97"
+		},
+		{
+			"name": "NoteReply",
+			"unicode": "ED98"
+		},
+		{
+			"name": "NoteForward",
+			"unicode": "ED99"
+		},
+		{
+			"name": "NotePinned",
+			"unicode": "ED9A"
+		},
+		{
+			"name": "RemoveOccurrence",
+			"unicode": "ED9B"
+		},
+		{
+			"name": "Timeline",
+			"unicode": "ED9C"
+		},
+		{
+			"name": "EditNote",
+			"unicode": "ED9D"
+		},
+		{
+			"name": "CircleHalfFull",
+			"unicode": "ED9E"
+		},
+		{
+			"name": "Room",
+			"unicode": "ED9F"
+		},
+		{
+			"name": "Unsubscribe",
+			"unicode": "EDA0"
+		},
+		{
+			"name": "Subscribe",
+			"unicode": "EDA1"
+		},
+		{
+			"name": "RecurringTask",
+			"unicode": "EDB2"
+		},
+		{
+			"name": "TaskManager",
+			"unicode": "EDB7"
+		},
+		{
+			"name": "TaskManagerMirrored",
+			"unicode": "EDB8"
+		},
+		{
+			"name": "Combine",
+			"unicode": "EDBB"
+		},
+		{
+			"name": "Split",
+			"unicode": "EDBC"
+		},
+		{
+			"name": "DoubleChevronUp",
+			"unicode": "EDBD"
+		},
+		{
+			"name": "DoubleChevronLeft",
+			"unicode": "EDBE"
+		},
+		{
+			"name": "DoubleChevronRight",
+			"unicode": "EDBF"
+		},
+		{
+			"name": "TextBox",
+			"unicode": "EDC2"
+		},
+		{
+			"name": "TextField",
+			"unicode": "EDC3"
+		},
+		{
+			"name": "NumberField",
+			"unicode": "EDC4"
+		},
+		{
+			"name": "Dropdown",
+			"unicode": "EDC5"
+		},
+		{
+			"name": "BookingsLogo",
+			"unicode": "EDC7"
+		},
+		{
+			"name": "ClassNotebookLogoInverse",
+			"unicode": "EDC8"
+		},
+		{
+			"name": "DelveAnalyticsLogo",
+			"unicode": "EDCA"
+		},
+		{
+			"name": "DocsLogoInverse",
+			"unicode": "EDCB"
+		},
+		{
+			"name": "Dynamics365Logo",
+			"unicode": "EDCC"
+		},
+		{
+			"name": "DynamicSMBLogo",
+			"unicode": "EDCD"
+		},
+		{
+			"name": "OfficeAssistantLogo",
+			"unicode": "EDCE"
+		},
+		{
+			"name": "OfficeStoreLogo",
+			"unicode": "EDCF"
+		},
+		{
+			"name": "OneNoteEduLogoInverse",
+			"unicode": "EDD0"
+		},
+		{
+			"name": "PlannerLogo",
+			"unicode": "EDD1"
+		},
+		{
+			"name": "PowerApps",
+			"unicode": "EDD2"
+		},
+		{
+			"name": "Suitcase",
+			"unicode": "EDD3"
+		},
+		{
+			"name": "ProjectLogoInverse",
+			"unicode": "EDD4"
+		},
+		{
+			"name": "CaretLeft8",
+			"unicode": "EDD5"
+		},
+		{
+			"name": "CaretRight8",
+			"unicode": "EDD6"
+		},
+		{
+			"name": "CaretUp8",
+			"unicode": "EDD7"
+		},
+		{
+			"name": "CaretDown8",
+			"unicode": "EDD8"
+		},
+		{
+			"name": "CaretLeftSolid8",
+			"unicode": "EDD9"
+		},
+		{
+			"name": "CaretRightSolid8",
+			"unicode": "EDDA"
+		},
+		{
+			"name": "CaretUpSolid8",
+			"unicode": "EDDB"
+		},
+		{
+			"name": "CaretDownSolid8",
+			"unicode": "EDDC"
+		},
+		{
+			"name": "ClearFormatting",
+			"unicode": "EDDD"
+		},
+		{
+			"name": "Superscript",
+			"unicode": "EDDE"
+		},
+		{
+			"name": "Subscript",
+			"unicode": "EDDF"
+		},
+		{
+			"name": "Strikethrough",
+			"unicode": "EDE0"
+		},
+		{
+			"name": "Export",
+			"unicode": "EDE1"
+		},
+		{
+			"name": "ExportMirrored",
+			"unicode": "EDE2"
+		},
+		{
+			"name": "SingleBookmark",
+			"unicode": "EDFF"
+		},
+		{
+			"name": "DoubleChevronDown",
+			"unicode": "EE04"
+		},
+		{
+			"name": "ReplyAll",
+			"unicode": "EE0A"
+		},
+		{
+			"name": "GoogleDriveLogo",
+			"unicode": "EE0B"
+		},
+		{
+			"name": "Questionnaire",
+			"unicode": "EE19"
+		},
+		{
+			"name": "ReplyMirrored",
+			"unicode": "EE35"
+		},
+		{
+			"name": "ReplyAllMirrored",
+			"unicode": "EE36"
+		},
+		{
+			"name": "AddGroup",
+			"unicode": "EE3D"
+		},
+		{
+			"name": "QuestionnaireMirrored",
+			"unicode": "EE4B"
+		},
+		{
+			"name": "TemporaryUser",
+			"unicode": "EE58"
+		},
+		{
+			"name": "CaretSolid16",
+			"unicode": "EE62"
+		},
+		{
+			"name": "GroupedDescending",
+			"unicode": "EE66"
+		},
+		{
+			"name": "GroupedAscending",
+			"unicode": "EE67"
+		},
+		{
+			"name": "AwayStatus",
+			"unicode": "EE6A"
+		},
+		{
+			"name": "MyMoviesTV",
+			"unicode": "EE6C"
+		},
+		{
+			"name": "AustralianRules",
+			"unicode": "EE70"
+		},
+		{
+			"name": "WifiEthernet",
+			"unicode": "EE77"
+		},
+		{
+			"name": "DateTimeMirrored",
+			"unicode": "EE93"
+		},
+		{
+			"name": "StopSolid",
+			"unicode": "EE95"
+		},
+		{
+			"name": "DoubleChevronUp12",
+			"unicode": "EE96"
+		},
+		{
+			"name": "DoubleChevronDown12",
+			"unicode": "EE97"
+		},
+		{
+			"name": "DoubleChevronLeft12",
+			"unicode": "EE98"
+		},
+		{
+			"name": "DoubleChevronRight12",
+			"unicode": "EE99"
+		}
+	]
+}
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-6.json b/packages/icons/config/fabric-icons-6.json
new file mode 100644
index 0000000000000..a947e7ec8a447
--- /dev/null
+++ b/packages/icons/config/fabric-icons-6.json
@@ -0,0 +1,412 @@
+{
+	"fontName": "fabric-icons-6",
+	"fontFamilyName": "FabricMDL2Icons-6",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "CalendarAgenda",
+			"unicode": "EE9A"
+		},
+		{
+			"name": "AddEvent",
+			"unicode": "EEB5"
+		},
+		{
+			"name": "AssetLibrary",
+			"unicode": "EEB6"
+		},
+		{
+			"name": "DataConnectionLibrary",
+			"unicode": "EEB7"
+		},
+		{
+			"name": "DocLibrary",
+			"unicode": "EEB8"
+		},
+		{
+			"name": "FormLibrary",
+			"unicode": "EEB9"
+		},
+		{
+			"name": "FormLibraryMirrored",
+			"unicode": "EEBA"
+		},
+		{
+			"name": "ReportLibrary",
+			"unicode": "EEBB"
+		},
+		{
+			"name": "ReportLibraryMirrored",
+			"unicode": "EEBC"
+		},
+		{
+			"name": "ContactCard",
+			"unicode": "EEBD"
+		},
+		{
+			"name": "CustomList",
+			"unicode": "EEBE"
+		},
+		{
+			"name": "CustomListMirrored",
+			"unicode": "EEBF"
+		},
+		{
+			"name": "IssueTracking",
+			"unicode": "EEC0"
+		},
+		{
+			"name": "IssueTrackingMirrored",
+			"unicode": "EEC1"
+		},
+		{
+			"name": "PictureLibrary",
+			"unicode": "EEC2"
+		},
+		{
+			"name": "OfficeAddinsLogo",
+			"unicode": "EEC7"
+		},
+		{
+			"name": "OfflineOneDriveParachute",
+			"unicode": "EEC8"
+		},
+		{
+			"name": "OfflineOneDriveParachuteDisabled",
+			"unicode": "EEC9"
+		},
+		{
+			"name": "TriangleSolidUp12",
+			"unicode": "EECC"
+		},
+		{
+			"name": "TriangleSolidDown12",
+			"unicode": "EECD"
+		},
+		{
+			"name": "TriangleSolidLeft12",
+			"unicode": "EECE"
+		},
+		{
+			"name": "TriangleSolidRight12",
+			"unicode": "EECF"
+		},
+		{
+			"name": "TriangleUp12",
+			"unicode": "EED0"
+		},
+		{
+			"name": "TriangleDown12",
+			"unicode": "EED1"
+		},
+		{
+			"name": "TriangleLeft12",
+			"unicode": "EED2"
+		},
+		{
+			"name": "TriangleRight12",
+			"unicode": "EED3"
+		},
+		{
+			"name": "ArrowUpRight8",
+			"unicode": "EED4"
+		},
+		{
+			"name": "ArrowDownRight8",
+			"unicode": "EED5"
+		},
+		{
+			"name": "DocumentSet",
+			"unicode": "EED6"
+		},
+		{
+			"name": "DelveAnalytics",
+			"unicode": "EEEE"
+		},
+		{
+			"name": "ArrowUpRightMirrored8",
+			"unicode": "EEEF"
+		},
+		{
+			"name": "ArrowDownRightMirrored8",
+			"unicode": "EEF0"
+		},
+		{
+			"name": "OneDriveAdd",
+			"unicode": "EF32"
+		},
+		{
+			"name": "Header2",
+			"unicode": "EF36"
+		},
+		{
+			"name": "Header3",
+			"unicode": "EF37"
+		},
+		{
+			"name": "Header4",
+			"unicode": "EF38"
+		},
+		{
+			"name": "MarketDown",
+			"unicode": "EF42"
+		},
+		{
+			"name": "CalendarWorkWeek",
+			"unicode": "EF51"
+		},
+		{
+			"name": "SidePanel",
+			"unicode": "EF52"
+		},
+		{
+			"name": "GlobeFavorite",
+			"unicode": "EF53"
+		},
+		{
+			"name": "CaretTopLeftSolid8",
+			"unicode": "EF54"
+		},
+		{
+			"name": "CaretTopRightSolid8",
+			"unicode": "EF55"
+		},
+		{
+			"name": "ViewAll2",
+			"unicode": "EF56"
+		},
+		{
+			"name": "DocumentReply",
+			"unicode": "EF57"
+		},
+		{
+			"name": "PlayerSettings",
+			"unicode": "EF58"
+		},
+		{
+			"name": "ReceiptForward",
+			"unicode": "EF59"
+		},
+		{
+			"name": "ReceiptReply",
+			"unicode": "EF5A"
+		},
+		{
+			"name": "ReceiptCheck",
+			"unicode": "EF5B"
+		},
+		{
+			"name": "Fax",
+			"unicode": "EF5C"
+		},
+		{
+			"name": "RecurringEvent",
+			"unicode": "EF5D"
+		},
+		{
+			"name": "ReplyAlt",
+			"unicode": "EF5E"
+		},
+		{
+			"name": "ReplyAllAlt",
+			"unicode": "EF5F"
+		},
+		{
+			"name": "EditStyle",
+			"unicode": "EF60"
+		},
+		{
+			"name": "EditMail",
+			"unicode": "EF61"
+		},
+		{
+			"name": "Lifesaver",
+			"unicode": "EF62"
+		},
+		{
+			"name": "LifesaverLock",
+			"unicode": "EF63"
+		},
+		{
+			"name": "InboxCheck",
+			"unicode": "EF64"
+		},
+		{
+			"name": "FolderSearch",
+			"unicode": "EF65"
+		},
+		{
+			"name": "CollapseMenu",
+			"unicode": "EF66"
+		},
+		{
+			"name": "ExpandMenu",
+			"unicode": "EF67"
+		},
+		{
+			"name": "Boards",
+			"unicode": "EF68"
+		},
+		{
+			"name": "SunAdd",
+			"unicode": "EF69"
+		},
+		{
+			"name": "SunQuestionMark",
+			"unicode": "EF6A"
+		},
+		{
+			"name": "LandscapeOrientation",
+			"unicode": "EF6B"
+		},
+		{
+			"name": "DocumentSearch",
+			"unicode": "EF6C"
+		},
+		{
+			"name": "PublicCalendar",
+			"unicode": "EF6D"
+		},
+		{
+			"name": "PublicContactCard",
+			"unicode": "EF6E"
+		},
+		{
+			"name": "PublicEmail",
+			"unicode": "EF6F"
+		},
+		{
+			"name": "PublicFolder",
+			"unicode": "EF70"
+		},
+		{
+			"name": "WordDocument",
+			"unicode": "EF71"
+		},
+		{
+			"name": "PowerPointDocument",
+			"unicode": "EF72"
+		},
+		{
+			"name": "ExcelDocument",
+			"unicode": "EF73"
+		},
+		{
+			"name": "GroupedList",
+			"unicode": "EF74"
+		},
+		{
+			"name": "ClassroomLogo",
+			"unicode": "EF75"
+		},
+		{
+			"name": "Sections",
+			"unicode": "EF76"
+		},
+		{
+			"name": "EditPhoto",
+			"unicode": "EF77"
+		},
+		{
+			"name": "Starburst",
+			"unicode": "EF78"
+		},
+		{
+			"name": "ShareiOS",
+			"unicode": "EF79"
+		},
+		{
+			"name": "AirTickets",
+			"unicode": "EF7A"
+		},
+		{
+			"name": "PencilReply",
+			"unicode": "EF7B"
+		},
+		{
+			"name": "Tiles2",
+			"unicode": "EF7C"
+		},
+		{
+			"name": "SkypeCircleCheck",
+			"unicode": "EF7D"
+		},
+		{
+			"name": "SkypeCircleClock",
+			"unicode": "EF7E"
+		},
+		{
+			"name": "SkypeCircleMinus",
+			"unicode": "EF7F"
+		},
+		{
+			"name": "SkypeMessage",
+			"unicode": "EF83"
+		},
+		{
+			"name": "ClosedCaption",
+			"unicode": "EF84"
+		},
+		{
+			"name": "ATPLogo",
+			"unicode": "EF85"
+		},
+		{
+			"name": "OfficeFormsLogoInverse",
+			"unicode": "EF86"
+		},
+		{
+			"name": "RecycleBin",
+			"unicode": "EF87"
+		},
+		{
+			"name": "EmptyRecycleBin",
+			"unicode": "EF88"
+		},
+		{
+			"name": "Hide2",
+			"unicode": "EF89"
+		},
+		{
+			"name": "iOSAppStoreLogo",
+			"unicode": "EF8A"
+		},
+		{
+			"name": "AndroidLogo",
+			"unicode": "EF8B"
+		},
+		{
+			"name": "Breadcrumb",
+			"unicode": "EF8C"
+		},
+		{
+			"name": "PageEdit",
+			"unicode": "EFB6"
+		},
+		{
+			"name": "Database",
+			"unicode": "EFC7"
+		},
+		{
+			"name": "DocumentManagement",
+			"unicode": "EFFC"
+		},
+		{
+			"name": "CRMReport",
+			"unicode": "EFFE"
+		},
+		{
+			"name": "ZipFolder",
+			"unicode": "F012"
+		},
+		{
+			"name": "TextDocument",
+			"unicode": "F029"
+		}
+	]
+}
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-7.json b/packages/icons/config/fabric-icons-7.json
new file mode 100644
index 0000000000000..39cefe64671c6
--- /dev/null
+++ b/packages/icons/config/fabric-icons-7.json
@@ -0,0 +1,412 @@
+{
+	"fontName": "fabric-icons-7",
+	"fontFamilyName": "FabricMDL2Icons-7",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "PageCheckedOut",
+			"unicode": "F02C"
+		},
+		{
+			"name": "SaveAndClose",
+			"unicode": "F038"
+		},
+		{
+			"name": "Script",
+			"unicode": "F03A"
+		},
+		{
+			"name": "Archive",
+			"unicode": "F03F"
+		},
+		{
+			"name": "ActivityFeed",
+			"unicode": "F056"
+		},
+		{
+			"name": "EventDate",
+			"unicode": "F059"
+		},
+		{
+			"name": "CaretRight",
+			"unicode": "F06B"
+		},
+		{
+			"name": "SetAction",
+			"unicode": "F071"
+		},
+		{
+			"name": "CaretSolidLeft",
+			"unicode": "F08D"
+		},
+		{
+			"name": "CaretSolidDown",
+			"unicode": "F08E"
+		},
+		{
+			"name": "CaretSolidRight",
+			"unicode": "F08F"
+		},
+		{
+			"name": "CaretSolidUp",
+			"unicode": "F090"
+		},
+		{
+			"name": "PowerAppsLogo",
+			"unicode": "F091"
+		},
+		{
+			"name": "PowerApps2Logo",
+			"unicode": "F092"
+		},
+		{
+			"name": "SearchIssue",
+			"unicode": "F09A"
+		},
+		{
+			"name": "SearchIssueMirrored",
+			"unicode": "F09B"
+		},
+		{
+			"name": "FabricAssetLibrary",
+			"unicode": "F09C"
+		},
+		{
+			"name": "FabricDataConnectionLibrary",
+			"unicode": "F09D"
+		},
+		{
+			"name": "FabricDocLibrary",
+			"unicode": "F09E"
+		},
+		{
+			"name": "FabricFormLibrary",
+			"unicode": "F09F"
+		},
+		{
+			"name": "FabricFormLibraryMirrored",
+			"unicode": "F0A0"
+		},
+		{
+			"name": "FabricReportLibrary",
+			"unicode": "F0A1"
+		},
+		{
+			"name": "FabricReportLibraryMirrored",
+			"unicode": "F0A2"
+		},
+		{
+			"name": "FabricPublicFolder",
+			"unicode": "F0A3"
+		},
+		{
+			"name": "FabricFolderSearch",
+			"unicode": "F0A4"
+		},
+		{
+			"name": "FabricMovetoFolder",
+			"unicode": "F0A5"
+		},
+		{
+			"name": "FabricUnsyncFolder",
+			"unicode": "F0A6"
+		},
+		{
+			"name": "FabricSyncFolder",
+			"unicode": "F0A7"
+		},
+		{
+			"name": "FabricOpenFolderHorizontal",
+			"unicode": "F0A8"
+		},
+		{
+			"name": "FabricFolder",
+			"unicode": "F0A9"
+		},
+		{
+			"name": "FabricFolderFill",
+			"unicode": "F0AA"
+		},
+		{
+			"name": "FabricNewFolder",
+			"unicode": "F0AB"
+		},
+		{
+			"name": "FabricPictureLibrary",
+			"unicode": "F0AC"
+		},
+		{
+			"name": "AddFavorite",
+			"unicode": "F0C8"
+		},
+		{
+			"name": "AddFavoriteFill",
+			"unicode": "F0C9"
+		},
+		{
+			"name": "BufferTimeBefore",
+			"unicode": "F0CF"
+		},
+		{
+			"name": "BufferTimeAfter",
+			"unicode": "F0D0"
+		},
+		{
+			"name": "BufferTimeBoth",
+			"unicode": "F0D1"
+		},
+		{
+			"name": "CannedChat",
+			"unicode": "F0F2"
+		},
+		{
+			"name": "SkypeForBusinessLogo",
+			"unicode": "F0FC"
+		},
+		{
+			"name": "PageCheckedin",
+			"unicode": "F104"
+		},
+		{
+			"name": "CaretBottomLeftSolid8",
+			"unicode": "F121"
+		},
+		{
+			"name": "CaretBottomRightSolid8",
+			"unicode": "F122"
+		},
+		{
+			"name": "FolderHorizontal",
+			"unicode": "F12B"
+		},
+		{
+			"name": "MicrosoftStaffhubLogo",
+			"unicode": "F130"
+		},
+		{
+			"name": "GiftboxOpen",
+			"unicode": "F133"
+		},
+		{
+			"name": "StatusCircleOuter",
+			"unicode": "F136"
+		},
+		{
+			"name": "StatusCircleInner",
+			"unicode": "F137"
+		},
+		{
+			"name": "ExploreContentSingle",
+			"unicode": "F164"
+		},
+		{
+			"name": "CollapseContent",
+			"unicode": "F165"
+		},
+		{
+			"name": "CollapseContentSingle",
+			"unicode": "F166"
+		},
+		{
+			"name": "InfoSolid",
+			"unicode": "F167"
+		},
+		{
+			"name": "ProgressRingDots",
+			"unicode": "F16A"
+		},
+		{
+			"name": "CaloriesAdd",
+			"unicode": "F172"
+		},
+		{
+			"name": "BranchFork",
+			"unicode": "F173"
+		},
+		{
+			"name": "HardDriveGroup",
+			"unicode": "F18F"
+		},
+		{
+			"name": "BucketColor",
+			"unicode": "F1B6"
+		},
+		{
+			"name": "BucketColorFill",
+			"unicode": "F1B7"
+		},
+		{
+			"name": "Taskboard",
+			"unicode": "F1C2"
+		},
+		{
+			"name": "SingleColumn",
+			"unicode": "F1D3"
+		},
+		{
+			"name": "DoubleColumn",
+			"unicode": "F1D4"
+		},
+		{
+			"name": "TripleColumn",
+			"unicode": "F1D5"
+		},
+		{
+			"name": "ColumnLeftTwoThirds",
+			"unicode": "F1D6"
+		},
+		{
+			"name": "ColumnRightTwoThirds",
+			"unicode": "F1D7"
+		},
+		{
+			"name": "AccessLogoFill",
+			"unicode": "F1DB"
+		},
+		{
+			"name": "AnalyticsLogo",
+			"unicode": "F1DE"
+		},
+		{
+			"name": "AnalyticsQuery",
+			"unicode": "F1DF"
+		},
+		{
+			"name": "NewAnalyticsQuery",
+			"unicode": "F1E0"
+		},
+		{
+			"name": "AnalyticsReport",
+			"unicode": "F1E1"
+		},
+		{
+			"name": "WordLogo",
+			"unicode": "F1E3"
+		},
+		{
+			"name": "WordLogoFill",
+			"unicode": "F1E4"
+		},
+		{
+			"name": "ExcelLogo",
+			"unicode": "F1E5"
+		},
+		{
+			"name": "ExcelLogoFill",
+			"unicode": "F1E6"
+		},
+		{
+			"name": "OneNoteLogo",
+			"unicode": "F1E7"
+		},
+		{
+			"name": "OneNoteLogoFill",
+			"unicode": "F1E8"
+		},
+		{
+			"name": "OutlookLogo",
+			"unicode": "F1E9"
+		},
+		{
+			"name": "OutlookLogoFill",
+			"unicode": "F1EA"
+		},
+		{
+			"name": "PowerPointLogo",
+			"unicode": "F1EB"
+		},
+		{
+			"name": "PowerPointLogoFill",
+			"unicode": "F1EC"
+		},
+		{
+			"name": "PublisherLogo",
+			"unicode": "F1ED"
+		},
+		{
+			"name": "PublisherLogoFill",
+			"unicode": "F1EE"
+		},
+		{
+			"name": "ScheduleEventAction",
+			"unicode": "F1EF"
+		},
+		{
+			"name": "FlameSolid",
+			"unicode": "F1F3"
+		},
+		{
+			"name": "ServerProcesses",
+			"unicode": "F1FE"
+		},
+		{
+			"name": "Server",
+			"unicode": "F201"
+		},
+		{
+			"name": "SaveAll",
+			"unicode": "F203"
+		},
+		{
+			"name": "LinkedInLogo",
+			"unicode": "F20A"
+		},
+		{
+			"name": "SidePanelMirrored",
+			"unicode": "F221"
+		},
+		{
+			"name": "ProtectRestrict",
+			"unicode": "F22A"
+		},
+		{
+			"name": "GridViewSmall",
+			"unicode": "F232"
+		},
+		{
+			"name": "GridViewMedium",
+			"unicode": "F233"
+		},
+		{
+			"name": "GridViewLarge",
+			"unicode": "F234"
+		},
+		{
+			"name": "Step",
+			"unicode": "F241"
+		},
+		{
+			"name": "StepInsert",
+			"unicode": "F242"
+		},
+		{
+			"name": "StepShared",
+			"unicode": "F243"
+		},
+		{
+			"name": "StepSharedAdd",
+			"unicode": "F244"
+		},
+		{
+			"name": "StepSharedInsert",
+			"unicode": "F245"
+		},
+		{
+			"name": "ViewDashboard",
+			"unicode": "F246"
+		},
+		{
+			"name": "ViewList",
+			"unicode": "F247"
+		},
+		{
+			"name": "ViewListGroup",
+			"unicode": "F248"
+		}
+	]
+}
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-8.json b/packages/icons/config/fabric-icons-8.json
new file mode 100644
index 0000000000000..c17353bb50e3b
--- /dev/null
+++ b/packages/icons/config/fabric-icons-8.json
@@ -0,0 +1,412 @@
+{
+	"fontName": "fabric-icons-8",
+	"fontFamilyName": "FabricMDL2Icons-8",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "ViewListTree",
+			"unicode": "F249"
+		},
+		{
+			"name": "TriggerAuto",
+			"unicode": "F24A"
+		},
+		{
+			"name": "TriggerUser",
+			"unicode": "F24B"
+		},
+		{
+			"name": "PivotChart",
+			"unicode": "F24C"
+		},
+		{
+			"name": "StackedBarChart",
+			"unicode": "F24D"
+		},
+		{
+			"name": "StackedLineChart",
+			"unicode": "F24E"
+		},
+		{
+			"name": "BuildQueue",
+			"unicode": "F24F"
+		},
+		{
+			"name": "BuildQueueNew",
+			"unicode": "F250"
+		},
+		{
+			"name": "UserFollowed",
+			"unicode": "F25C"
+		},
+		{
+			"name": "VennDiagram",
+			"unicode": "F273"
+		},
+		{
+			"name": "FiveTileGrid",
+			"unicode": "F274"
+		},
+		{
+			"name": "FocalPoint",
+			"unicode": "F277"
+		},
+		{
+			"name": "TeamsLogoInverse",
+			"unicode": "F27A"
+		},
+		{
+			"name": "TeamsLogo",
+			"unicode": "F27B"
+		},
+		{
+			"name": "TeamsLogoFill",
+			"unicode": "F27C"
+		},
+		{
+			"name": "SkypeForBusinessLogoFill",
+			"unicode": "F27D"
+		},
+		{
+			"name": "SharepointLogo",
+			"unicode": "F27E"
+		},
+		{
+			"name": "SharepointLogoFill",
+			"unicode": "F27F"
+		},
+		{
+			"name": "DelveLogo",
+			"unicode": "F280"
+		},
+		{
+			"name": "DelveLogoFill",
+			"unicode": "F281"
+		},
+		{
+			"name": "OfficeVideoLogo",
+			"unicode": "F282"
+		},
+		{
+			"name": "OfficeVideoLogoFill",
+			"unicode": "F283"
+		},
+		{
+			"name": "ExchangeLogo",
+			"unicode": "F284"
+		},
+		{
+			"name": "ExchangeLogoFill",
+			"unicode": "F285"
+		},
+		{
+			"name": "DocumentApproval",
+			"unicode": "F28B"
+		},
+		{
+			"name": "CloneToDesktop",
+			"unicode": "F28C"
+		},
+		{
+			"name": "InstallToDrive",
+			"unicode": "F28D"
+		},
+		{
+			"name": "Blur",
+			"unicode": "F28E"
+		},
+		{
+			"name": "Build",
+			"unicode": "F28F"
+		},
+		{
+			"name": "ProcessMetaTask",
+			"unicode": "F290"
+		},
+		{
+			"name": "BranchFork2",
+			"unicode": "F291"
+		},
+		{
+			"name": "BranchLocked",
+			"unicode": "F292"
+		},
+		{
+			"name": "BranchCommit",
+			"unicode": "F293"
+		},
+		{
+			"name": "BranchCompare",
+			"unicode": "F294"
+		},
+		{
+			"name": "BranchMerge",
+			"unicode": "F295"
+		},
+		{
+			"name": "BranchPullRequest",
+			"unicode": "F296"
+		},
+		{
+			"name": "BranchSearch",
+			"unicode": "F297"
+		},
+		{
+			"name": "BranchShelveset",
+			"unicode": "F298"
+		},
+		{
+			"name": "RawSource",
+			"unicode": "F299"
+		},
+		{
+			"name": "MergeDuplicate",
+			"unicode": "F29A"
+		},
+		{
+			"name": "RowsGroup",
+			"unicode": "F29B"
+		},
+		{
+			"name": "RowsChild",
+			"unicode": "F29C"
+		},
+		{
+			"name": "Deploy",
+			"unicode": "F29D"
+		},
+		{
+			"name": "Redeploy",
+			"unicode": "F29E"
+		},
+		{
+			"name": "ServerEnviroment",
+			"unicode": "F29F"
+		},
+		{
+			"name": "Plug",
+			"unicode": "F300"
+		},
+		{
+			"name": "PlugSolid",
+			"unicode": "F301"
+		},
+		{
+			"name": "PlugConnected",
+			"unicode": "F302"
+		},
+		{
+			"name": "PlugDisconnected",
+			"unicode": "F303"
+		},
+		{
+			"name": "UnlockSolid",
+			"unicode": "F304"
+		},
+		{
+			"name": "Variable",
+			"unicode": "F305"
+		},
+		{
+			"name": "Parameter",
+			"unicode": "F306"
+		},
+		{
+			"name": "CommentUrgent",
+			"unicode": "F307"
+		},
+		{
+			"name": "Storyboard",
+			"unicode": "F308"
+		},
+		{
+			"name": "DiffInline",
+			"unicode": "F309"
+		},
+		{
+			"name": "DiffSideBySide",
+			"unicode": "F30A"
+		},
+		{
+			"name": "ImageDiff",
+			"unicode": "F30B"
+		},
+		{
+			"name": "ImagePixel",
+			"unicode": "F30C"
+		},
+		{
+			"name": "FileBug",
+			"unicode": "F30D"
+		},
+		{
+			"name": "FileCode",
+			"unicode": "F30E"
+		},
+		{
+			"name": "FileComment",
+			"unicode": "F30F"
+		},
+		{
+			"name": "FileImage",
+			"unicode": "F311"
+		},
+		{
+			"name": "FileSymlink",
+			"unicode": "F312"
+		},
+		{
+			"name": "AutoFillTemplate",
+			"unicode": "F313"
+		},
+		{
+			"name": "WorkItem",
+			"unicode": "F314"
+		},
+		{
+			"name": "WorkItemBug",
+			"unicode": "F315"
+		},
+		{
+			"name": "LogRemove",
+			"unicode": "F316"
+		},
+		{
+			"name": "ColumnOptions",
+			"unicode": "F317"
+		},
+		{
+			"name": "Packages",
+			"unicode": "F318"
+		},
+		{
+			"name": "BuildIssue",
+			"unicode": "F319"
+		},
+		{
+			"name": "AssessmentGroup",
+			"unicode": "F31A"
+		},
+		{
+			"name": "VariableGroup",
+			"unicode": "F31B"
+		},
+		{
+			"name": "FullHistory",
+			"unicode": "F31C"
+		},
+		{
+			"name": "BusinessHoursSign",
+			"unicode": "F310"
+		},
+		{
+			"name": "VisioDiagram",
+			"unicode": "F2A0"
+		},
+		{
+			"name": "HighlightMappedShapes",
+			"unicode": "F2A1"
+		},
+		{
+			"name": "TextCallout",
+			"unicode": "F2A2"
+		},
+		{
+			"name": "IconSetsFlag",
+			"unicode": "F2A4"
+		},
+		{
+			"name": "VisioLogo",
+			"unicode": "F2A7"
+		},
+		{
+			"name": "VisioLogoFill",
+			"unicode": "F2A8"
+		},
+		{
+			"name": "VisioDocument",
+			"unicode": "F2A9"
+		},
+		{
+			"name": "TimelineProgress",
+			"unicode": "F2AA"
+		},
+		{
+			"name": "TimelineDelivery",
+			"unicode": "F2AB"
+		},
+		{
+			"name": "Backlog",
+			"unicode": "F2AC"
+		},
+		{
+			"name": "TeamFavorite",
+			"unicode": "F2AD"
+		},
+		{
+			"name": "TaskGroup",
+			"unicode": "F2AE"
+		},
+		{
+			"name": "TaskGroupMirrored",
+			"unicode": "F2AF"
+		},
+		{
+			"name": "ScopeTemplate",
+			"unicode": "F2B0"
+		},
+		{
+			"name": "AssessmentGroupTemplate",
+			"unicode": "F2B1"
+		},
+		{
+			"name": "NewTeamProject",
+			"unicode": "F2B2"
+		},
+		{
+			"name": "CommentAdd",
+			"unicode": "F2B3"
+		},
+		{
+			"name": "CommentNext",
+			"unicode": "F2B4"
+		},
+		{
+			"name": "CommentPrevious",
+			"unicode": "F2B5"
+		},
+		{
+			"name": "ShopServer",
+			"unicode": "F2B6"
+		},
+		{
+			"name": "LocaleLanguage",
+			"unicode": "F2B7"
+		},
+		{
+			"name": "QueryList",
+			"unicode": "F2B8"
+		},
+		{
+			"name": "UserSync",
+			"unicode": "F2B9"
+		},
+		{
+			"name": "UserPause",
+			"unicode": "F2BA"
+		},
+		{
+			"name": "StreamingOff",
+			"unicode": "F2BB"
+		},
+		{
+			"name": "ArrowTallUpLeft",
+			"unicode": "F2BD"
+		}
+	]
+}
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-9.json b/packages/icons/config/fabric-icons-9.json
new file mode 100644
index 0000000000000..05a1ed8ee8e13
--- /dev/null
+++ b/packages/icons/config/fabric-icons-9.json
@@ -0,0 +1,412 @@
+{
+	"fontName": "fabric-icons-9",
+	"fontFamilyName": "FabricMDL2Icons-9",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "ArrowTallUpRight",
+			"unicode": "F2BE"
+		},
+		{
+			"name": "ArrowTallDownLeft",
+			"unicode": "F2BF"
+		},
+		{
+			"name": "ArrowTallDownRight",
+			"unicode": "F2C0"
+		},
+		{
+			"name": "FieldEmpty",
+			"unicode": "F2C1"
+		},
+		{
+			"name": "FieldFilled",
+			"unicode": "F2C2"
+		},
+		{
+			"name": "FieldChanged",
+			"unicode": "F2C3"
+		},
+		{
+			"name": "FieldNotChanged",
+			"unicode": "F2C4"
+		},
+		{
+			"name": "RingerOff",
+			"unicode": "F2C5"
+		},
+		{
+			"name": "PlayResume",
+			"unicode": "F2C6"
+		},
+		{
+			"name": "BulletedList2",
+			"unicode": "F2C7"
+		},
+		{
+			"name": "BulletedList2Mirrored",
+			"unicode": "F2C8"
+		},
+		{
+			"name": "ImageCrosshair",
+			"unicode": "F2C9"
+		},
+		{
+			"name": "GitGraph",
+			"unicode": "F2CA"
+		},
+		{
+			"name": "Repo",
+			"unicode": "F2CB"
+		},
+		{
+			"name": "RepoSolid",
+			"unicode": "F2CC"
+		},
+		{
+			"name": "FolderQuery",
+			"unicode": "F2CD"
+		},
+		{
+			"name": "FolderList",
+			"unicode": "F2CE"
+		},
+		{
+			"name": "FolderListMirrored",
+			"unicode": "F2CF"
+		},
+		{
+			"name": "LocationOutline",
+			"unicode": "F2D0"
+		},
+		{
+			"name": "POISolid",
+			"unicode": "F2D1"
+		},
+		{
+			"name": "CalculatorNotEqualTo",
+			"unicode": "F2D2"
+		},
+		{
+			"name": "BoxSubtractSolid",
+			"unicode": "F2D3"
+		},
+		{
+			"name": "BoxAdditionSolid",
+			"unicode": "F2D4"
+		},
+		{
+			"name": "BoxMultiplySolid",
+			"unicode": "F2D5"
+		},
+		{
+			"name": "BoxPlaySolid",
+			"unicode": "F2D6"
+		},
+		{
+			"name": "BoxCheckmarkSolid",
+			"unicode": "F2D7"
+		},
+		{
+			"name": "CirclePauseSolid",
+			"unicode": "F2D8"
+		},
+		{
+			"name": "CirclePause",
+			"unicode": "F2D9"
+		},
+		{
+			"name": "MSNVideosSolid",
+			"unicode": "F2DA"
+		},
+		{
+			"name": "CircleStopSolid",
+			"unicode": "F2DB"
+		},
+		{
+			"name": "CircleStop",
+			"unicode": "F2DC"
+		},
+		{
+			"name": "NavigateBack",
+			"unicode": "F2DD"
+		},
+		{
+			"name": "NavigateBackMirrored",
+			"unicode": "F2DE"
+		},
+		{
+			"name": "NavigateForward",
+			"unicode": "F2DF"
+		},
+		{
+			"name": "NavigateForwardMirrored",
+			"unicode": "F2E0"
+		},
+		{
+			"name": "UnknownSolid",
+			"unicode": "F2E1"
+		},
+		{
+			"name": "UnknownMirroredSolid",
+			"unicode": "F2E2"
+		},
+		{
+			"name": "CircleAddition",
+			"unicode": "F2E3"
+		},
+		{
+			"name": "CircleAdditionSolid",
+			"unicode": "F2E4"
+		},
+		{
+			"name": "FilePDB",
+			"unicode": "F2E5"
+		},
+		{
+			"name": "FileTemplate",
+			"unicode": "F2E6"
+		},
+		{
+			"name": "FileSQL",
+			"unicode": "F2E7"
+		},
+		{
+			"name": "FileJAVA",
+			"unicode": "F2E8"
+		},
+		{
+			"name": "FileASPX",
+			"unicode": "F2E9"
+		},
+		{
+			"name": "FileCSS",
+			"unicode": "F2EA"
+		},
+		{
+			"name": "FileSass",
+			"unicode": "F2EB"
+		},
+		{
+			"name": "FileLess",
+			"unicode": "F2EC"
+		},
+		{
+			"name": "FileHTML",
+			"unicode": "F2ED"
+		},
+		{
+			"name": "JavaScriptLanguage",
+			"unicode": "F2EE"
+		},
+		{
+			"name": "CSharpLanguage",
+			"unicode": "F2EF"
+		},
+		{
+			"name": "CSharp",
+			"unicode": "F2F0"
+		},
+		{
+			"name": "VisualBasicLanguage",
+			"unicode": "F2F1"
+		},
+		{
+			"name": "VB",
+			"unicode": "F2F2"
+		},
+		{
+			"name": "CPlusPlusLanguage",
+			"unicode": "F2F3"
+		},
+		{
+			"name": "CPlusPlus",
+			"unicode": "F2F4"
+		},
+		{
+			"name": "FSharpLanguage",
+			"unicode": "F2F5"
+		},
+		{
+			"name": "FSharp",
+			"unicode": "F2F6"
+		},
+		{
+			"name": "TypeScriptLanguage",
+			"unicode": "F2F7"
+		},
+		{
+			"name": "PythonLanguage",
+			"unicode": "F2F8"
+		},
+		{
+			"name": "PY",
+			"unicode": "F2F9"
+		},
+		{
+			"name": "CoffeeScript",
+			"unicode": "F2FA"
+		},
+		{
+			"name": "MarkDownLanguage",
+			"unicode": "F2FB"
+		},
+		{
+			"name": "FullWidth",
+			"unicode": "F2FE"
+		},
+		{
+			"name": "FullWidthEdit",
+			"unicode": "F2FF"
+		},
+		{
+			"name": "SingleColumnEdit",
+			"unicode": "F321"
+		},
+		{
+			"name": "DoubleColumnEdit",
+			"unicode": "F322"
+		},
+		{
+			"name": "TripleColumnEdit",
+			"unicode": "F323"
+		},
+		{
+			"name": "ColumnLeftTwoThirdsEdit",
+			"unicode": "F324"
+		},
+		{
+			"name": "ColumnRightTwoThirdsEdit",
+			"unicode": "F325"
+		},
+		{
+			"name": "StreamLogo",
+			"unicode": "F329"
+		},
+		{
+			"name": "AlertSolid",
+			"unicode": "F331"
+		},
+		{
+			"name": "MegaphoneSolid",
+			"unicode": "F332"
+		},
+		{
+			"name": "TaskSolid",
+			"unicode": "F333"
+		},
+		{
+			"name": "ConfigurationSolid",
+			"unicode": "F334"
+		},
+		{
+			"name": "BugSolid",
+			"unicode": "F335"
+		},
+		{
+			"name": "CrownSolid",
+			"unicode": "F336"
+		},
+		{
+			"name": "Trophy2Solid",
+			"unicode": "F337"
+		},
+		{
+			"name": "QuickNoteSolid",
+			"unicode": "F338"
+		},
+		{
+			"name": "ConstructionConeSolid",
+			"unicode": "F339"
+		},
+		{
+			"name": "PageListSolid",
+			"unicode": "F33A"
+		},
+		{
+			"name": "PageListMirroredSolid",
+			"unicode": "F33B"
+		},
+		{
+			"name": "StarburstSolid",
+			"unicode": "F33C"
+		},
+		{
+			"name": "ReadingModeSolid",
+			"unicode": "F33D"
+		},
+		{
+			"name": "SadSolid",
+			"unicode": "F33E"
+		},
+		{
+			"name": "HealthSolid",
+			"unicode": "F33F"
+		},
+		{
+			"name": "ShieldSolid",
+			"unicode": "F340"
+		},
+		{
+			"name": "GiftBoxSolid",
+			"unicode": "F341"
+		},
+		{
+			"name": "ShoppingCartSolid",
+			"unicode": "F342"
+		},
+		{
+			"name": "MailSolid",
+			"unicode": "F343"
+		},
+		{
+			"name": "ChatSolid",
+			"unicode": "F344"
+		},
+		{
+			"name": "RibbonSolid",
+			"unicode": "F345"
+		},
+		{
+			"name": "FinancialSolid",
+			"unicode": "F346"
+		},
+		{
+			"name": "FinancialMirroredSolid",
+			"unicode": "F347"
+		},
+		{
+			"name": "HeadsetSolid",
+			"unicode": "F348"
+		},
+		{
+			"name": "PermissionsSolid",
+			"unicode": "F349"
+		},
+		{
+			"name": "ParkingSolid",
+			"unicode": "F34A"
+		},
+		{
+			"name": "ParkingMirroredSolid",
+			"unicode": "F34B"
+		},
+		{
+			"name": "DiamondSolid",
+			"unicode": "F34C"
+		},
+		{
+			"name": "AsteriskSolid",
+			"unicode": "F34D"
+		},
+		{
+			"name": "OfflineStorageSolid",
+			"unicode": "F34E"
+		}
+	]
+}
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons.json b/packages/icons/config/fabric-icons.json
new file mode 100644
index 0000000000000..ba4a5fa05291c
--- /dev/null
+++ b/packages/icons/config/fabric-icons.json
@@ -0,0 +1,228 @@
+{
+	"fontName": "fabric-icons",
+	"fontFamilyName": "FabricMDL2Icons",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "GlobalNavButton",
+			"unicode": "E700"
+		},
+		{
+			"name": "ChevronDown",
+			"unicode": "E70D"
+		},
+		{
+			"name": "ChevronUp",
+			"unicode": "E70E"
+		},
+		{
+			"name": "Edit",
+			"unicode": "E70F"
+		},
+		{
+			"name": "Add",
+			"unicode": "E710"
+		},
+		{
+			"name": "Cancel",
+			"unicode": "E711"
+		},
+		{
+			"name": "More",
+			"unicode": "E712"
+		},
+		{
+			"name": "Settings",
+			"unicode": "E713"
+		},
+		{
+			"name": "Mail",
+			"unicode": "E715"
+		},
+		{
+			"name": "Filter",
+			"unicode": "E71C"
+		},
+		{
+			"name": "Search",
+			"unicode": "E721"
+		},
+		{
+			"name": "Share",
+			"unicode": "E72D"
+		},
+		{
+			"name": "FavoriteStar",
+			"unicode": "E734"
+		},
+		{
+			"name": "FavoriteStarFill",
+			"unicode": "E735"
+		},
+		{
+			"name": "CheckMark",
+			"unicode": "E73E"
+		},
+		{
+			"name": "Delete",
+			"unicode": "E74D"
+		},
+		{
+			"name": "ChevronLeft",
+			"unicode": "E76B"
+		},
+		{
+			"name": "ChevronRight",
+			"unicode": "E76C"
+		},
+		{
+			"name": "Calendar",
+			"unicode": "E787"
+		},
+		{
+			"name": "Undo",
+			"unicode": "E7A7"
+		},
+		{
+			"name": "Flag",
+			"unicode": "E7C1"
+		},
+		{
+			"name": "Page",
+			"unicode": "E7C3"
+		},
+		{
+			"name": "View",
+			"unicode": "E890"
+		},
+		{
+			"name": "Clear",
+			"unicode": "E894"
+		},
+		{
+			"name": "Download",
+			"unicode": "E896"
+		},
+		{
+			"name": "Upload",
+			"unicode": "E898"
+		},
+		{
+			"name": "Folder",
+			"unicode": "E8B7"
+		},
+		{
+			"name": "Sort",
+			"unicode": "E8CB"
+		},
+		{
+			"name": "AlignRight",
+			"unicode": "E8E2"
+		},
+		{
+			"name": "AlignLeft",
+			"unicode": "E8E4"
+		},
+		{
+			"name": "Tag",
+			"unicode": "E8EC"
+		},
+		{
+			"name": "AddFriend",
+			"unicode": "E8FA"
+		},
+		{
+			"name": "Info",
+			"unicode": "E946"
+		},
+		{
+			"name": "Pinned",
+			"unicode": "E840"
+		},
+		{
+			"name": "SortLines",
+			"unicode": "E9D0"
+		},
+		{
+			"name": "List",
+			"unicode": "EA37"
+		},
+		{
+			"name": "CircleRing",
+			"unicode": "EA3A"
+		},
+		{
+			"name": "Heart",
+			"unicode": "EB51"
+		},
+		{
+			"name": "HeartFill",
+			"unicode": "EB52"
+		},
+		{
+			"name": "Tiles",
+			"unicode": "ECA5"
+		},
+		{
+			"name": "Embed",
+			"unicode": "ECCE"
+		},
+		{
+			"name": "Ascending",
+			"unicode": "EDC0"
+		},
+		{
+			"name": "Descending",
+			"unicode": "EDC1"
+		},
+		{
+			"name": "SortUp",
+			"unicode": "EE68"
+		},
+		{
+			"name": "SortDown",
+			"unicode": "EE69"
+		},
+		{
+			"name": "SyncToPC",
+			"unicode": "EE6E"
+		},
+		{
+			"name": "LargeGrid",
+			"unicode": "EECB"
+		},
+		{
+			"name": "SkypeCheck",
+			"unicode": "EF80"
+		},
+		{
+			"name": "SkypeClock",
+			"unicode": "EF81"
+		},
+		{
+			"name": "SkypeMinus",
+			"unicode": "EF82"
+		},
+		{
+			"name": "ClearFilter",
+			"unicode": "EF8F"
+		},
+		{
+			"name": "Flow",
+			"unicode": "EF90"
+		},
+		{
+			"name": "StatusCircleCheckmark",
+			"unicode": "F13E"
+		},
+		{
+			"name": "MoreVertical",
+			"unicode": "F2BC"
+		}
+	]
+}
\ No newline at end of file
diff --git a/packages/icons/fonts/fabric-icons-0-8a1666a2.woff b/packages/icons/fonts/fabric-icons-0-8a1666a2.woff
new file mode 100644
index 0000000000000000000000000000000000000000..e8f693e573c726bd3e3449c392205fd89c34b136
GIT binary patch
literal 11984
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
Klz3kW`2PWbtok|t

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-1-a961c249.woff b/packages/icons/fonts/fabric-icons-1-a961c249.woff
new file mode 100644
index 0000000000000000000000000000000000000000..8b48cac6875c31e328a8d481bf97297497b038f6
GIT binary patch
literal 12024
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%0DI_&Y`FnlMw-6
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

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-10-795d6e25.woff b/packages/icons/fonts/fabric-icons-10-795d6e25.woff
new file mode 100644
index 0000000000000000000000000000000000000000..83f9dddcca07528aae528fa1745288b7e7c18785
GIT binary patch
literal 12416
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
VLPA0;|C58k1Pp>u{nxnv{{U_hp3wjR

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-11-c0dbf638.woff b/packages/icons/fonts/fabric-icons-11-c0dbf638.woff
new file mode 100644
index 0000000000000000000000000000000000000000..a3b190466c00766b54ddc3231d6f16201abd6f75
GIT binary patch
literal 15192
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

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-2-2be8dca9.woff b/packages/icons/fonts/fabric-icons-2-2be8dca9.woff
new file mode 100644
index 0000000000000000000000000000000000000000..368f5b314192dd17182d30946db21552f0e12cf3
GIT binary patch
literal 12124
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

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-3-80b6008d.woff b/packages/icons/fonts/fabric-icons-3-80b6008d.woff
new file mode 100644
index 0000000000000000000000000000000000000000..9d7bbdae0d8a89556ef3fa39d4def651108aedcb
GIT binary patch
literal 14136
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

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-4-03329fef.woff b/packages/icons/fonts/fabric-icons-4-03329fef.woff
new file mode 100644
index 0000000000000000000000000000000000000000..070d9d534ee25f4d624887407d61d93530e2d282
GIT binary patch
literal 15940
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
OL<bB2QDFTP;Qs>!OsKN}

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-4ac62dd2.woff b/packages/icons/fonts/fabric-icons-4ac62dd2.woff
new file mode 100644
index 0000000000000000000000000000000000000000..755a37daffb697f8ffbca517643721948088b111
GIT binary patch
literal 6372
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
B^mqUO

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-5-82c8b87c.woff b/packages/icons/fonts/fabric-icons-5-82c8b87c.woff
new file mode 100644
index 0000000000000000000000000000000000000000..35380535eefa8ebff03a7ded3d7bfb180aac6fc1
GIT binary patch
literal 13512
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
R%DM~`24E2A=hgrK_<uo074HB5

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-6-2ab76fc9.woff b/packages/icons/fonts/fabric-icons-6-2ab76fc9.woff
new file mode 100644
index 0000000000000000000000000000000000000000..59d4c97553589805cf3ccc7a11fcad30123ded7a
GIT binary patch
literal 12672
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
ULqjdC%ERFR2Ee}k_v6C<1KU@0S^xk5

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-7-1bae3315.woff b/packages/icons/fonts/fabric-icons-7-1bae3315.woff
new file mode 100644
index 0000000000000000000000000000000000000000..cd0a223d4bd9cdff8e8fb1681a4f0e6c013c3ad7
GIT binary patch
literal 11204
zcmZ8{b8u$Q^Ys(wiEY~(+qP}ziEU$JZER<gjct3gv9+;nZ}Q9M`~LTK)v2C7_e}Ne
znW~wpd)re<QW5|L_%iw-0MdV64Fdq~rS{+G|2HMIZ>#_SnD`ej{RLxQ7jGXkdlRQG
zF7^vi002b8I9q?BnTH$6*BIwZ^W_0_z*S(arIVHY7sve-Uw>(J-t!LQtxR0M=0ehZ
zaR~ndECAoi&fD^fV+R08^#A}NF9Mtq9FT>HIRHSJ_@&|e5AX9f{h%-MiyQlj@xMTU
zLI$%3vUl_P;`YB{-7icLX`<rVIhuXxsD!`biT^-<#3yTS;`No6`oElnUmyW&g5x@v
z*js#Y3}5f~2mk<I<1()mog7`=zSf1}OM~&B?o$P@;pAfRHJARsI=<=!%zJg;B6;PQ
z8Jm3ea|Z{f1_!%iRkA=p6tjm}_KYQtPz?2tj}MOx!9pVllk^1vdivqu5Ri!71ihVt
zUQm+2s^Xyr)QpV*fDdihEU%o&Sw86{6Ab9<r&_Xw>zsP{5ZW-6khIcSG{ZTp2<W&R
z1|dv^NQ8?<RdK6t&9IxzP4cCa9@aFJqL74;91EAbuJLLat1;1)4j$Y7NYj}C*Stq$
zf2U%cgO#vZcJ=E17L)1zyL5kGTFW&h`*sIc%bMTnmHxCkWZ6=es`L_jac+*?xjJb0
zSf4-r5&}W6FW0k+V&s}Z{@zE6_X$cFIpa}S!cdr3Wn6|?D{^$#w{lm+c2f~LYp6NK
z{#UVeAMr8AVX)kbrCmbU%*|(u%`nWQ+hL*o(_)q5PYXe3PxHZs;6S|p_p29cEu2<*
z`Nc$RO`n|%Y(?Ll_ZBB>rDub{)6@PiR`O(4(!E<r$x^ko5|PtV#k?_c;2(isNxI(W
zdMj3`y&AG{z2T*zM6#Lca#0x4dHPA>Jd9EleN>#+_{1zxo;af9Hp<~>Val;&>f1<g
z&g)iVS17m6=-zF?`X!`5D<>jg<fzQhE~Kf`#!-Fl)@Ltuq@Z2@&a}{i0Y=8x#(wST
zj47-IjWNhrdw8sGrSH7YE2tkV1{MVXs33qz^~y0w=v5pPMi_CWXbPhi<|WN_rxQz!
z%smO0qgbG%L^vu9T97Td3QGAt3^BdyfO}^OJAwMa)Y3cs>euU9_VU}$Bd1h~j#e{=
zYo}lV9_jQV^WO`p(iNwLiTt9s=95Lg4Y0^o5&J=*4m39NkS1?WMBI|YXqrA8e?8|k
z7p{0}5AZ1O9VOh=;7=MR4@28hy77;ddu?XW44;pos)BejY`iN6lOHxi_qxYJ2^=dC
za<@X?v*WQ??^ARQ5zik7e-h6Mdy`8Dd?-lz41cp9>#Y=dP}sP~x{omF52-6mw^~;Q
z;u*gng}s}P0Kfp?09XLr=O+N!E2r8Q-iu(-{kr>ZMW>qs@1mwD$)kBKJ+E@qrg>n=
zjA8xujdUF+k(sl9<vAFFh4Wy?iMA!G9`T*CL^!FJX(T25irN~SeH%Ir8ZRp>%~Vt-
z^?r}Me-eJ27|%wgv-mTIkFC;Rb>U+k#NldnIU(@0;X2Lp#D9qr%r6t!WV9(KUWAgQ
z4q?Mx0G)^N$@s79+Ru{q$CKjbQ({w6Up^#^E86$|Y>ARsP?$0YEMo}WcQzsLsG#IJ
z-~a}z41p7AGD3(YF6S@>RUMG(2m22k3urc2u{JU+#pfTULAu|SA((_iDpUX`!7*)c
zPS#1PAa02g7SdRI>x_62nZc176(9Y6!(0lsyq-KDZE!5^o^^;LAu)#ssS~)iu!<~Q
zWV*Nvz6?t4M8sx?Ux*x{_~IoPDN|*z4Qas$x-&LM#9{E%BKKw+xXF+hA{B^T2LL0O
zR?HN&I24kqR;H){ZN`xTyF!l+`v-*+E4<(0ddiq}cRb@}ZLip^@40h!l&viD*l7$h
zTcKWUmpcTkK{<^oMIHhLC=8?!;0#|#it5ARHwCz4<q&Z6Sot~L@3Z$U9EcL+&GU=Q
z3U`d@He_xHdn9F#F)rcI%YDbH7~sJHMFN2YOvG$)6dlRI;i_JP)I$&k5Tc^ZbPK}i
z>l!DpoZKm@(FwGI7x6$5FI}nZa{9zKHEGj9C$qilaLB=Vj7G;B6e35Ev{9(p5LmXj
zZN@7X1I2Efc-JB!CMF(#u~EIzuA2p!+!3K-$TrHodW#T)MSy4g1EcngRqM!{$iy2h
z+Kmsnu7rdXhoDR1Mta7B)lEB+Umh9KwiMS5dXcjra@bxCSk`_Oke^uDqU~NqiLB-f
z$#}xL2nIW><cKPBz>S;(>Vi7+ULPc)jIE}Qt%{pVh=jy7qaJR)4OL|tzR66$AFD>4
zeG7G`CC*<G&i-RjA1ml&mx<rJ%L5ACD+3K%UCx>r%r!}VEVVQV{K{PlFbu{sOW3ay
zgB0nU;Y-aE(M65Q2^@g0g0kBup~<bXTrncBuJV*eS1PIGyL?4tCUK{cuovjQ=!slL
zPkG`A`3n&|vg1HJo*~Me8+7$NOc6~XFBd-BSgKK_?TS68?#4Vji*?7!frePg5p`J;
z@1dm7wzP+M&*|;=cQ6dr&E>VKc<u!1BitDqHcR%TWIvbpPZ)BJvV1NS;v8d6^RZ~o
zgW`a@I_hyQUIDyv7+r7}o-+6j;Gh@0v7o>+<JstL{?GTViD`Y>Pu1hx*B>kje6doH
z33WXF+Oc@uZiUWkD-v9Ijv+mw_5%s*V;PWHa$#tPk<Nwy#h{)uX=+d`;tZRtvKWP|
z2!pZ<DAq*>ob?ZlFb|sOUQNM>#B?EKs%k$X`mzAYYJ!2VR)7CU&+Ah4vcHwYp$X!u
z+6qg7*<`h&zdM5h)?W{o!SLi(#s;|zk)Pz*TnqDYrNgWi&5Q<&&79Q5E5B*&Dv$yE
z+nzzKyL`(gh~Se@PzU?&@(U_{Ys(yVbkz?q3-K#Xj(WCLQ&{ll<NFGdfd$M`;N`@W
zF=Nf<$TpZlP!G!CDIh6ER%u@*b(ktz8g0~47F6rh5`h~g<cBDiWfH<5Ixn^rfW7jt
zuy2+<-gHQE`pe(I%kaQnjk$|Py4b%Km#1WAKusLEn6AqP*4EZY!Gx!K$LNZ`7MaAa
ze|_NvFo!)Vci}u|4O_1_7^HXeJC)l033B)MP9sxyFdVUb3#?w!=&a`oyQrzDRzB-;
zI7fW*@ICvv(Tb(nQTgYB^I-9Ed_WHs1;$#_6uW>D7Bjc)y=BnH4XQnrfHKgeR!+JD
zGErJ0kHwvJW^6Co1e5McXo_HFgU4wPW1s8jZriKYaechyc)-@jW*xujbcrWeMu54j
zS=Sa+d(m!b(qw<oBIsNs$yd@J7^g93*g0UEHnJ?ot`zKyLLUnO<xpKB?utFb$L<&>
z>G<s$L@B8e*HTJm-qNlFuVJ?+9*87uNC(;ZCvpEs(~UQyxQ54&8f^&rW<0UO%au^w
zv*uY}l_K(SA>GyKnhf$3W}AoO$y$h^(nX8RCQ`bzv!V)tsyb-1#(G4gtu_FA25xCP
zd!>P@#9{Wh_b4PRFoRp!v0#)CVF6Yomm(OC2POjI9-an+u8(fdSU*4bPz}lfjb}&t
zj)P!L&5Q2t5f8+1mTAXHog(VH>YyazoW+^C_=i}|3d){Q<0SbMRM$x@Sxj~I9!wXr
zsvBL&AbF64ww0rOL0sNohp2&VYkx)<?_LfTX#eZmDi=Ycd)i=A1V%}5gj@2kxd1Mk
zmO9UNh{-K^A}rOeS3#F|3XZl<j&|Djg#(pgf>S4a*f=n}x>$9d0xxiG5i&f#YwFuO
z3|n0mjBi_&Ob+%01lD%C)l$W;r#~;36ez)rEK0vAo2K4IF!<YKnU9ErA1Y*^IWq`+
zjMJO0uzOm5Kx!`XqMX>BGOJd{blBK*U^ScmQkf)~x~*_|_FOB4w5Mf8W4L2wTKI+0
zAdVz};Q;d{P45KTUmsQ+O|1{$<Xppn0(Swz3g87YZwyuKz!^`3Sh${so`HE*s1eF%
z(o*HH_L!CoVXV10%|voAGaJfW_9g19t}@!?AmP<^*>#cSjH7f6du7Joc{ml!_ubZ&
ziI>q*mLBWtL8HjfosjXt?Ee&>1;YpRQHHP{q;E*|qoU!Bwu->c8ioc#m5T;gAERHv
zm7x>^CBG&2<l|;jiH4sh6XSpT!;H96**}L2%LQ-DP^bd<2^eTO)&ft&*4tDPv`}}`
z*zFTH_MOcu87=fmp;-Zu_%gYXh6v(aoyvp+V_wKeCg*{*x%>7()_VcO`P0>nAA1)(
zoOIqmDS1eke>Dn?I6M|}-mnq`cwh}f9)`3tKE-()FA;GNw1+ti%}lQRo*wD97nfQj
z#3IUd<dlw<bYDXg8Zk8A6dO>a@S?Kh3(O;I-Y~Fd=+_vcoRjiOmjFVRC$}4@ipd&M
zEe{X&d<_*>hl*yn%hdPn#%+%4JB#fj0x8UOfv1joDSQpqA&gqYn@iY8qGswu_w7^J
zZzz`G2TcmvvV|mP<U0f%{pk0>tr(<}6eBO=<_~Qr0RuGcpn_kBKB5qV*}En@ovPXd
zt%rycCfl}xCGt3vN=@&xCuYZE{h<D|Aw4T3v*IIYSBR{Ed%GFPgK&;$-ma;?5}_6c
zO9QJAy4`tU(&VFDS>#!fwUJO{u{5K<zB?oR1TC+X$HVX4FJSm&&ZPG#T8u!&GlCjj
z9-WD@=7(_P^1(}HcrcZ6!SmA!A&lP`8*e(f9nvG`DYuiZ-VW!>A5_aBMPr08j^s)g
zGI&1ZiZGxdx$&L0J^~}@r)W9^o%C62xGU!gzRTsVo}Ygx?GFnM$)#Z9GXKOXI#1fS
zSmT9EqW@N2mcZAYmdEKmTVe$um&L2F{xRyvFAMfS6I_ndA_H3#&HY$l!>hO+%T_$f
zDljS;$JS(jpK%>(hNSl*&uDS)9bBTCqTmn83C2z!CN8zVUc1?Q<Q;M^Pgd_oK+i&;
z0H38`5T-Mt;N}#Gu^G5AJ8@?5v%~N$>E3<jK`78EX#i6CdF2oi57(3+Q-kp)CVo>3
zk;o+Ij@xq}dzH|naf0>o>bvMKSDaI$J7iMB)=NHg&|B8?(mFX6K&}p!7?nQQ%KkHN
z#Uv3IBgi!>;BwrtDIu0A#=~`(lp-aB%l~nEo;58sXdS-cHnmR{Pc;KSqqaiPl(DM`
zmSw)c?r&NBS1{Rg(NBhLFkXac@6V2g>-!Qx*pJ~h0(v{R68e0usE61X9@K`0Ju<NS
z8&Cl(0_u<P8s<e%0klJtlVaKJvF2-?ir2YdaUzj_ERlrBSe<L;x2OZ+K!!A{9yiMB
zqk&*nGL#O;iDov*>>K28$xcJxcaCD!`?<!tC6qzi9E+ux4W^=f$KPz@;H9`rZr8Z%
zl*g(?SZL!R6GP<@5`jsX&mxwhZ7|{92`Q`&oSVy<OCP1qjZVn^!Yg?%tO;QAniYJT
z;Vg?mtyv^7ZTWP;ge1Yg8BE;F9(QYZ0DC*qG%F;lH#7<2HU5vb=chF_m8;8n-JDNr
zEpHcSIyt~rw!LAid=5kN;+TA&on}ToL*JcW!|@9*)sttmN$_BDA}~CeU1yuVS9k_~
z^U)x;VTBlHhHZ+j3+aQ{VLY)7ykwA+L^X@Gz8{UOtb8QZ-)mDE@84!TLl<DLj}s`8
zxP$?ZI=mC*A3A0~rt#$@r4}=+n_*a^2M63&2$ZHa^dDfRkT_rt>qlNjGpc?&u8RHJ
zo7~=Sy`^4gkQmUPA|yGXlQ!gdojIK#(@pGT4|Y<F$2Sf$HAnvmT@nEI03#%v&P*;p
ziYv(-=j=6RnU;f_3w|G;Ot?>3(43G}67Q5u4BSlK$Epw0#j^L$L5Ls}PcU7fq$;dM
zLB9arTnl%G8HOm8@Dm-PSL0$7>GT>j=&<5(=DNgK%(|wwIRr8hSnGN~@U_^ihTdf@
za}qz_=Q>{MmD6BXaiq}q`uuq}O;@6)$!px(Ioj%Kw>7gecKGZ%wpy@4itv4{2w-(w
zK5ZF$pS3q?vzx+xazL!OgbPfjUcri*(h;gPIWbPw+}h_1;BB*zapQQ4`LP{-#>o_;
z0j;~?u22ZN8ryg+6c_HY*$n-oNodB!U>hBVX|dDe*mHLR)^{G#oZ0Zw>h~~y-1X5O
zJQZia)%)^3$ajc=4HDG4v09Y#{m0l`v7v%x)a>eY9RA~vXvG@4kfDEOFP*O5q2rbH
zlkJc8xW(BHxY4=Wno>P1eb?zzWov~$Ii>cCJEyy+PPT0w3tRR_zfzE`Zq-d}FJQC&
zcn25UGNAtaWejYXQ@5@g0<GX+$K!JqDX=Lfu;i7Ehe0{)&0M!99J6=@Gw(^7js!9X
z6qh(b0b$fB-4#deAcrw?k0>FDhMkgJc>^u0)5Atl42<)K<=YcrCKj-eF_u&&&MAUt
z_k|&x&<hysY_hQ(?QEW6u1weu2$Ujco+?Cpcr~i;zE|wOx^?$<|6&oWoh;V^bZD+C
zS7x?jWKuif&?^gASP(S_-B_J;xhplX;poICM6oe2cx~L&1gsHGvi1&|8k0u<j^Wik
zxrxf?K<V{An1@-WsM+{yw7G%CSfhT%_jWdL2lIADS>IIP@O%8=<B!t0-e!Z>c~<=}
zWALSjk=?=dKpn+zC|To|G1vj8q$sh%KM8gQAKxFu1j{PN^;B^y;aiq5vDFvUVM~P=
z6J^KYOAjlN><KnG=e8D?IH>VX%jxN=<9wioZ}iI4RSXUR)kXaqT~-I6kdp7`WN#va
zLo~3ib5bHc76F=GaXD(=crjYbsBsHdXOd2Y=+mzFNvPTd$0{rnouVR)Q&d%c!cmEt
zOd<j79N@t=QmpKirgf2p_*xD&Z~~V;hT^ycXC3l<BO-j0W3Wm;8~rbY>s%+}dCo3z
z?Twty_VD3k1s)LpT=lf{2B{itfs6)~J^jD;mR3}>6qOHY>{z4Z?9>D}V^-q`2m(i_
zt5I}A(mipmWGB27s~KGu)(Ho^9jDw~Tdp3dkH?BAMoC<mc$)+{J<p<BBwG2KOxL&k
zygk+7yhINQoB5CoG|DkO9F6kJqY%US?L|CwQd=vk`pNmue2Z$P@rmP!<PxIF`h=IV
zpevb~4woU=8o)<zrh${XXG04gTfKL2{_xnBZzFuYTluclb$1n2w&+x1cY37Q;q7l1
z*hH(V%dK}mus1hzU8@uSd&)OzKQOeCZ7D^nVo%Yg5G+|B${+=+kNPJz>>y>CRXYZ<
z65O8vxZ{kQ+%GklI@R=mPS&@ND;pG<=`}Lby?evUyyN}o7Q*d>xYxXWF*#68L)?m+
z^OHp|Ga{}Tnl(?WmNXzS;_f1jB$nwodQji*)hu~M=)>)E;^E3@aOG!mj#gk_*9b!n
zXav`odq1p*p4tn^hDk?aWK6RmdxI}|t7Wi-U8<)}G3P-)`$4~DZUg55VLe!>t(51X
z(L{RHE>y#^XFHzCujjIS6#e4y1x@8i+JOvzoE)=<DxvJRmPz^mL|k`woYTx_Gza_8
zbwRG?`~4efcX3OL7_v^O3t8DWLp;v|59nNc&x4;$^%MHp>x3!m-kwey_8!>imo3FL
z0}wpjH)wZFElfsIoF+v5P4fCkwgFJgs>*Rs6dmMgmih3Ha^FV{cHlfhiLi@Gjl0_f
zHrQF+eQ8T|(y41yvGh8RKB#L5UgvxGkn92<PRO&93!$=M2p5CX=vr&3s<?gLW}z3J
zw!Du5Jmw#T{L9@gX7LZ3T5XsDpPbC>xL5UOv0Tl&34iFn4E^(68n{MorsN{_eqFpc
zBMLkgX6>?km|HuQR#1`X&l;^gItlOP{BYh9+#~*cMWs7mQTpav4_d4aY;jo3^|2>g
z;m)~+`ld&q`&cq-&Zjcp(!*2C|FfwO;SL8Jfy~$uCK&#JW$*b|58W&!s%#Ullxx?(
zM?b_?B;t&%Z^BA4ZqF-|)JhW7l2r7FSH8((X(6~52O3{cF=@tv88w|n$RwR7rsD+j
z>vPc>ArKmmfC+P+%Y>UCty-4RH}y25FP}uPATuXxs2b=b-j$3nc;SIF9Q_Y~debdq
zplCv07XW4-%dSkQGc0|xA@l_E8*8Rl=&1dt&z#I5n8wigDRlBgD=9!Xm;#Mf*y<TD
zI84_Hzh+`T1T}r5{rX#8+za7tBmmdN!ct$C_i6%ki13f(@7{{K&T5CtXkXvd;ze9a
z_^U}ZugioQ`dRw@eeysroY4yap9~NS>ufGG7JFtTId6YoRnOkm@GEe+V=Dd!{+kwK
zNnm<j&Dla|uEHme0-jzdM7?gEfvUKcVl>E1qu@w*@RA^`IR)WWI?IUoSZ{u|J-~3~
z6M`kxWZgGnZF$-e0lDUi;J9#k&6nr)kX`HOE?3p^SDkBtnsdSeB)WGd*h3EKk|w<T
z*^Vl+47082NbAh2SOCid$CJZMGbvR$u;(GV5MuC%`pIA@6r{<`WY;=4lxkd!gj4=A
zhsQkJ5G5N7s@V>U0nx62fu9$?#(LvcTB2p&q*DJm`Fy}%M#uND@n(cOA<U`Tc*knT
zA57aLL$$>?dSfR!Xv3O5F@w?+DTM#&v?MzPJs!OTUW;(Xmi6$Ma(LoqXg^?$iAII-
zSFoR~@yzckPpt&bI<J!rY4gjuVF=ynnoYY&wMnTWtB-?=PctFs94D;E(wYvZY_4kG
z^#S)9)%w27YCSbKRi7&Hu@v(jMuOjhQ#WGh`!3hwB69Gh;8lHv86+##{FltKKRc}t
zA1U&cMXGK2sEju=&vHOUS!cw7=M-{CIUnCyyzc|dPO;078AQMqpZIV7Az!xbg<c8O
zOL5hzoX4xe^duhgb++_+d71BD$E@GH_SNRCcD-a8bz|L_%0h!}>mI~O4~0YtD37Z6
zJxv)+066&io)j?V^0zreC62uim61u@P*X5|`k{c=1fwQRT7$*uj*->j3nuuaq8F?0
z4ms;ARN$b9V%gs&Z#zsNX8*3%X&LhV&17ks6XXA}(l8|AmMIX9DK|30xkF-k(2dqu
z1sk=GwtoKoK#WsHTu21OdDGehdmT7gC%4zNkkN0cht%#J&3yb|(g4X&)4UHiQD~cr
zxjo-TRw!zdJVEVU#6lVdS?Ud$+*XMlI}2X(sqZ`~Z+UHBY<c+I{<(5%^HXbNmH2Ph
z{`N`!AoFGJ>neQ25*9xekNeW|lhh<>G=m()ys7r%wtx}H*YepqtKTm|S~1RK1foi3
z<2O{+j>(?TW?+SP;F;&I(9<oz`1|{PKjqz(*WqYBk>7b?l%xIOeKCv+$V?Zhzc9`p
zLd?=ooNBME&10zAL?0c0)lV_t^3P!<Um`EIIZgVc(=AjRTogtRtknT@`D);xmiIf1
z?i)X}7|~c=OkJjSavX=;e(z30ar=fBm}Mx^RU3DwLh^<a$4c(cJb&a@&FbSo)Wrdn
znQGHHHtACIHr1Y&7$f{65BtyKT&+OQhpDDLfqS)BV%$HmP!{<g6=8zX#0>vlq%8Qa
zDwEriR5t-eKr0)av~;fB4g_8#9<=j0Ca#A_U0kSd_}VSGbXmt>%lxP?0iJgl!QIa0
zkHI%XPKtK3J({Yhj*>^6`D&YE>c{t;j{dF@^R)1$KlV<`@;~3Gg_JCG&>&R`klOi+
z%UnJnd*trl2Y+NiYL8GiDGN%&Z$-)rD2o%9j=~AiAy?QGoc{ygD|c?%Mz5D=M9)2#
z3Lz_2UBaDj6xx6rSB<q$wOrz{zzgV`<~@Pp?MA`^;cp4J@suU(dgzp?;sMFp^-VZp
z_g&l{o@q2vW&6c27mKk9jBO8pz_tnAmC?~szk3(kV+!YElp)hxMz@rEo~FXka%>8<
zWRH|exj#d&Pwt<*L=^CC>mvm|wzvFD^dYbP4E4LrH%#!dHkn)qgblyDw07b8mz#s@
z1RFn58@F})Nc&b*W+`1<*7sU`&s%4ECS0@rd`bHo>F8D5wK-PXw=l`!-aVz`G7d&5
zZ?oax{&y&T=N?dNbo*4?&fTbP{36ar?(oXr&un#>xF;7V#J0t})pMEZK52W%0sW>q
zS_JX1vqMS0&L!vys(L2eqfa<z3$Pg%30iXHp<!nnE5RG~zmbV6(u+Hx-<b>yFw63L
zTilYa#NFZ|$tw=j$qD$C5wMKo3^%W67IVE|4rk|`d;QXU&?n{dn?xt;&u80Kb{1cR
z2_1{EK#(p>?LtuVGCALOzhH#1)Of6{?Kf>p=U30C4VKT%7vxUejepDE98!j2i8=&j
zUJftzA4r3*?4=Z<;Y_m3$6@XRIMipCWAuJmWvo9_BxUwI2p6V&2#l4Ha5AkX0e=rY
zYq+knJFYFgf8(}BGn#iGB6!W+#)0gxZ#ZvqQMJAdgg{pS8+VqUwZ!VxT&yqe_BJ?6
zNEd86zb<?+rK^@p@Q7u~FHVywx)Et^Q)cps+~mmIeGFy9rlb&OBByUqhhSm;m4@Ah
z-ghrH@Urif)G?8pLN~dteTaU0l1f!r+No93YiqAIKXySLRhdq;I463|<i@kGI)906
z&g+1XYOT8}Hv-b}B3a`3R#6dm*J=8%UzH~n+G_Mz;wP66x#Zb^uP4$8-<47Gxt!h`
zexFv9p@SVX_GJ~p`LT5+`f)Zg9=@z>kNv`YFJi3$j;%pk&99f+@71|-Oj3E3*g;48
zPx5a8oJ%<#SIt#hfd`l{HPOum|4J*D8{HLX)kl-e7Ri0nCwfnw$2vwI5s<F}B8e2v
z>d2<A^|5uV)ut@Y^b}C#e!(}{tFzY%w~0&Kf!coLQtj1A+xVTl#cnaQyloi?wHPM-
zB9Y1G>(WV+kkNk}_D!%W0mp<ANi0>Ei{THIWO55Kg%a)gu~>NpFXW8(F%BxlT0G`c
zG!tg~*1I>cv0E}d9<6^!Ul|Juci13p<YxrG?lJrA0NjfDNjVHcMPStt6Y+DFK&Qv<
zzS~8Xk~9?jaQPgQBfp2GF3KmOmFYE-cVzp}`f=@3e?#-n??=6o7t~+p`9pwDh|nGM
zaTqjO#G)O~l&U5I3#fGWB365Jwx&18*cB@2EtFRWbF)c8<rOCmR8Sk-gC!<<B-hNn
zMbfCz5UE-%hn!JFLqTqM5B}5Df)@!r)!VH_U5+=LRQ?qVkR)3sPZ-(oPBc@W6G+G|
zmv(_O#^4?Ppbk@=1b%klR~X<;XAv|q_5eRFjR;J#^eqdfe_Mr`3~&W&!l*_@4AD)5
z7Ke#_BDj>S7py5*D#M%?Z+|4$O<Fb2*~8bpEZk8Ne6<=Z*#D$Mkoo<rg%SRM2(=~%
z&AkP_QxfVkDAn+$<=Ug8JMb_?>0fJZ(EiN!b`gY`0(7C)Z6EWLLr0JuCl`~<=%qkq
zJ2Jbpe*JuL`Q61H>bCT@vVy_u+6hVQNILzuC8#$TYt6w0J66j%JDcVv7Jnrb#5$nV
z7Myfdbbdo20EYvT;SGABoFF2N;N}N4>AdiyV-`wh*rWfov?U?nyr;>qV(D~_O4Src
zA3m7pi;1~9?^3hB@z}z9dimG$T>bZkWa0YMn7{_+wV<X$qkG<qBd5I7qEw*Jm|_j(
zl=k6m#|NlT4~(t3E{K<YcW*rjB#RC#+R{9-vN8DOuccd-S6AF9I*PC`#Yc$LS^4qN
zb%{#97v8WRazJ`qjo@q80Qu(5pK;jOKf^mfE7M3Wk@vkb{7*BSyVtU)((Dg%q-I#U
z1-NPgx@h%L)C#>>(1u(e^X-p+hd;BfOm_Pf?`B+z5^?5}Ua%P6n0aFGUk*7fVJ;&j
z<>uc{;mq`Mtf+3yX9hi)7^Yty``^_kW8Fm^k9@_K;zH)EO$W2-xSo?IH8dt=KE*qQ
zR@F5YQ|{-N<G6@{lY`ff{CpFPqc&Q9dpi$q4?>xKKjYeei(<;+lX~LG8Jb_&%Lm;*
zvHM()-!K^}9B)YD)SS!=nsgVB#3w6t)6gvY`)?JEkMPVwSm*XEvT$x})SsVf7LP^?
z)$80)vw^Qrlm|1HV@)X0=?73v<ibD#hjMX!(Yd#_Oy+@i#Ej;!6#HEhqjqpn8HvzH
z)5S>G;Xw*~>0(<>w~sqJ>(0sDI!J$AB=`e{8O6kWYmQGlOsBD5mb0iUj@U~)l^bq*
z=D9Y#UVBngu5-{b8y}9dIHX#qP<5DK8Q384kPpE3cuCl6B~9I~rqVBs8V^6xJ@B4b
z@+h|WZu_Q!gL9E%&CPZxz6G4tyU5SJOIOfSXYqEjH){FmjPt<zEfd7k<{ES*F2L=z
zGY+oFjNNVx%d$Z-XBwOe`ycFP4%<@MTK4CdKW@7HG~ZTu<J0;`uEvbb(u1_dcnAv;
z633}VV?7v?hl@`xZrXa@q-lT-r=S_d3_vqmdMeQDVmsm+;GJWiSL=)Rw5)CXx5gt)
zU8RV-*&d0%HMt0@vW<aa!oKPT8!m-QNks*%&6J{@BH9}}ugl3L+-RNDns+dqVAT-!
z;%Wsq9IKhRYt+7-Iv|wNpCah-Cs7fUD{o%iwjnU@5wKu!QpbQ;{@02#BE(-&yX~&M
z1z;Mq5j&~Ga<0|#<a*~Co_QtX*IB*lulV`${^xDE;ZC6Q$u;aiuY`YOa$=Bx)r03j
z=dWe&?3A`EaeGSp5x-}BR6c*kU~oG79j9EhWsPqA%MBTh0m6@%r#MdX9X)o;0gDTM
z89t-Fsbt!_?9o-;;{hH5ri-!CWF3d$g$~L$PWWklicjRS!}_n*Be1XLldt}(mqWBM
zBV_&u06gp$0RZ&=>ks<RFQ)8W0|1|guq3c}Um@_TE8~CmUk{SG@wPDl4CUn$ECL*Y
z9D>dm9Kh%XPViqZ%c80FNIw7)5ka}{IR<RX3Op&685ain-59wT33k9;Yym#h8wJ*!
zMbvyA2T9mHSix#PXnhK7;ixZTq8ye2JxCjDYzxd%Y@hTLx8RTzumTN;ctMT-UurCX
zD8LPH2o?=C0?rSv3Z4jo0Wkns0oegL4!H(-3grOx2(1ncf=+{hgYklygC&DChwT8O
z0BwL(z(Y8BI5)T&xO;dU_yG7r1Q0?VVjAK&;u7LM5*<<ovN3Wrauf0f3OEW0iY6)w
zY6j{68VOn?S{2$F+BG^Bx;(lIdItI~h8rdlW&xHwmK!!Kb}aS`_A`zhP6{p@E-P*g
z?i!vdUJ%|Cz9azxfha)(!4jc7VF6(a;VBU(ksVPL(J?VAu^n+dao7J_Lt|-+mFd1=
z0C=o1+K{42EF=pUxii?ySE*h(&FV@q_*@u)hJ34x)@f)o`{iP^*~78uo}}zNj54m{
zhMXp(=^^~&(~+@KqI2dMb7BcR_h$EK$7M8(_baYKBGUp7D^Gdsj}GVI_Ju@}ck}aa
zZ@x;<L7m0ZCXhEzP(7##+envWo1y;CbUQ5L`PBR(@9qO!+h%pZtuUqS^{}TMxo5#0
zh-ZudnP)75!7Jbv(Leqy3P0FU-(J&{*?sa2Oy58%{*dVrY~WS@&U1FyC{1AYHRMeK
za4V>DZwsvlX!<TS@U~3_10?RdF~4?&H&hIeetvwu*sl#k-Z|*^6zWF5dqY+n%ACr*
zvBVuh->Y(F1<jl9Hq{KbGgWR6x8II;t4KV`Gv!PTug)L2I-hpKedwp!GyZ+-Z`l{+
zNyr=K=kvx<I$_T1RxVW$^(B>XYEY&>F@$f#C{#_qrO&lyjB;&kXqX+h;!Ca-txK?M
ztT}5~bjmB7WVl~SQCzFYXH-Ccw==ucv$d^;6M@O}ve2zh>IQWWP%yKg#TbiUrXbkR
z!ClxhzWqv6Ag!AB$|{Z?sJ$PcYn>x4=#-e2Sm4z{d>MfF7K`7PL?+)V*F1$`PxLb+
zLu#FN6#>kRyhHYAv2=nLp(4A>0p4z&*LQxQn|tmlOqY>4J&xDsS-GXk@c1W&;!992
znI;$5nBT=23!763i>xxeP4GNUGqZsjzK*_yl4M0nu?s@@Kr><sVv({s)ropVix%#%
ziQQ|7BBDsdm{KV=p6gW2mc17Y_@NUqQ6I2~Z6+}k0)l9Z5;8?VWdC|<o=&9*l_PQI
zH|@eREVq;n5HrtvllGl%At2N?IBR;wA=vj;fhBKO=uggtfNc_?PU=jNP*m1(eOvq#
z)X|RGl)81eyI_|opSEF(Z~rQeKGdnQ2HI910tStNb6Ty6B*U!Ca7X7ez4sPbXsAd0
z7Um`8VM%87xe>DxKTL{X2(BQZ5bmq*mY|%oWu)(;Y6Ec$kxvTKD!vBaI__WBDJ;IC
z_5@RVk?z1@4xnYxsN<gv2`VzPP|n{7S{KTpr^?L3{{22_e4CA7&js9ReCYOf`x2$y
z=38lRvK%mi<dslIEN(@I(PK7a^txV`A?ryD%N+8xiyD94!0lZ&lrn3%?^rI~2#@~3
zu`8L5@*lKa9#+YvCV9j!Ht~B7D_;KoY3UaB`gARa-XYy}eoN%~T)W}Wg?;`@Jadl+
z=|mB+v7<7C^wq;K;oBrY1I-pl;MfMWFSMjvP_j3UxHXPEnb*at5&dR5hgTWhc96Z;
zKxx6}=6Wrb#j&*?m^b@8y;3q|*M-a_PMu~QK(htKM(Fz{v~kf3#(K&9b;kX7E?5FW
zKLZdB5Hd(G0kjF=j9xkGeFc+sQ9qJpvYpYfBR8fNv+!*y$NLJqbNM({M3kV1cB8KA
zW)i>tV&_gaAAA>K5G2IJMI}OsF;W!GNPrkZ+uqwTw*sq&><0{?tuYsp^Z~|9SEgXO
zvVackY#Sh~w%IDD;?;eMLdnL#xWgd)Ng$U`GBbJSBQ!MB@|rvl8!!Y$^WP=#e|f${
A#{d8T

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-8-bf5c8e0c.woff b/packages/icons/fonts/fabric-icons-8-bf5c8e0c.woff
new file mode 100644
index 0000000000000000000000000000000000000000..94c540669f5e08cdd82e8bec4d3cd3c01990ecc4
GIT binary patch
literal 13772
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

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-9-a362212c.woff b/packages/icons/fonts/fabric-icons-9-a362212c.woff
new file mode 100644
index 0000000000000000000000000000000000000000..5e56c03eae426c42d53285af2bc8b615810c0746
GIT binary patch
literal 11244
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

literal 0
HcmV?d00001

diff --git a/packages/icons/gulpfile.js b/packages/icons/gulpfile.js
new file mode 100644
index 0000000000000..253c72000bc14
--- /dev/null
+++ b/packages/icons/gulpfile.js
@@ -0,0 +1,46 @@
+'use strict';
+
+let gulp = require('gulp');
+let path = require('path');
+let build = require('@microsoft/web-library-build');
+let buildConfig = build.getConfig();
+let isProduction = process.argv.indexOf('--production') >= 0;
+let isClean = process.argv.indexOf('clean') >= 0;
+
+// initialize tasks.
+build.initialize(gulp);
+
+/* Configure lint rules */
+let rules = Object.assign(
+  {},
+  require('./node_modules/@microsoft/gulp-core-build-typescript/lib/defaultTslint.json').rules,
+  require('./node_modules/office-ui-fabric-react-tslint/tslint.json').rules,
+  require('./tslint.json').rules
+);
+build.tslint.setConfig({
+  lintConfig: { rules },
+  displayAsWarning: false
+});
+
+// Configure TypeScript.
+build.TypeScriptConfiguration.setTypescriptCompiler(require('typescript'));
+
+// Disable unnecessaries.
+build.sass.isEnabled =
+  build.webpack.isEnabled =
+  build.text.isEnabled =
+  build.preCopy.isEnabled =
+  build.postCopy.isEnabled =
+  build.karma.isEnabled = () => false;
+
+let packageFolder = buildConfig.packageFolder || '';
+let distFolder = buildConfig.distFolder;
+
+if (isProduction || isClean) {
+  build.setConfig({
+    libAMDFolder: path.join(packageFolder, 'lib-amd')
+  });
+}
+
+build.task('tslint', build.tslint);
+
diff --git a/packages/icons/package.json b/packages/icons/package.json
new file mode 100644
index 0000000000000..a4d4323f922f2
--- /dev/null
+++ b/packages/icons/package.json
@@ -0,0 +1,29 @@
+{
+  "name": "@uifabric/icons",
+  "version": "5.0.0",
+  "description": "Office UI Fabric icon set.",
+  "main": "lib/index.js",
+  "typings": "lib/index.d.ts",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/OfficeDev/office-ui-fabric-react"
+  },
+  "license": "MIT",
+  "scripts": {
+    "build": "node ../../scripts/build.js",
+    "clean": "node ../../scripts/clean.js"
+  },
+  "disabledTasks": [
+    "sass",
+    "karma",
+    "tslint",
+    "jest"
+  ],
+  "devDependencies": {
+    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0"
+  },
+  "dependencies": {
+    "@uifabric/styling": ">=0.24.1 <1.0.0",
+    "tslib": "^1.6.0"
+  }
+}
\ No newline at end of file
diff --git a/packages/icons/src/IconNames.ts b/packages/icons/src/IconNames.ts
new file mode 100644
index 0000000000000..2adeefaaebaad
--- /dev/null
+++ b/packages/icons/src/IconNames.ts
@@ -0,0 +1,1240 @@
+export const enum IconName {
+  DecreaseIndentLegacy = 'DecreaseIndentLegacy',
+  IncreaseIndentLegacy = 'IncreaseIndentLegacy',
+  GlobalNavButton = 'GlobalNavButton',
+  InternetSharing = 'InternetSharing',
+  Brightness = 'Brightness',
+  MapPin = 'MapPin',
+  Airplane = 'Airplane',
+  Tablet = 'Tablet',
+  QuickNote = 'QuickNote',
+  ChevronDown = 'ChevronDown',
+  ChevronUp = 'ChevronUp',
+  Edit = 'Edit',
+  Add = 'Add',
+  Cancel = 'Cancel',
+  More = 'More',
+  Settings = 'Settings',
+  Video = 'Video',
+  Mail = 'Mail',
+  People = 'People',
+  Phone = 'Phone',
+  Pin = 'Pin',
+  Shop = 'Shop',
+  Stop = 'Stop',
+  Link = 'Link',
+  Filter = 'Filter',
+  Zoom = 'Zoom',
+  ZoomOut = 'ZoomOut',
+  Microphone = 'Microphone',
+  Search = 'Search',
+  Camera = 'Camera',
+  Attach = 'Attach',
+  Send = 'Send',
+  FavoriteList = 'FavoriteList',
+  PageSolid = 'PageSolid',
+  Forward = 'Forward',
+  Back = 'Back',
+  Refresh = 'Refresh',
+  Share = 'Share',
+  Lock = 'Lock',
+  EMI = 'EMI',
+  MiniLink = 'MiniLink',
+  Blocked = 'Blocked',
+  FavoriteStar = 'FavoriteStar',
+  FavoriteStarFill = 'FavoriteStarFill',
+  ReadingMode = 'ReadingMode',
+  Favicon = 'Favicon',
+  Remove = 'Remove',
+  Checkbox = 'Checkbox',
+  CheckboxComposite = 'CheckboxComposite',
+  CheckboxIndeterminate = 'CheckboxIndeterminate',
+  CheckboxCompositeReversed = 'CheckboxCompositeReversed',
+  CheckMark = 'CheckMark',
+  BackToWindow = 'BackToWindow',
+  FullScreen = 'FullScreen',
+  Print = 'Print',
+  Up = 'Up',
+  Down = 'Down',
+  Delete = 'Delete',
+  Save = 'Save',
+  Cloud = 'Cloud',
+  CommandPrompt = 'CommandPrompt',
+  Sad = 'Sad',
+  SIPMove = 'SIPMove',
+  EraseTool = 'EraseTool',
+  GripperTool = 'GripperTool',
+  Dialpad = 'Dialpad',
+  PageLeft = 'PageLeft',
+  PageRight = 'PageRight',
+  MultiSelect = 'MultiSelect',
+  Play = 'Play',
+  Pause = 'Pause',
+  ChevronLeft = 'ChevronLeft',
+  ChevronRight = 'ChevronRight',
+  Emoji2 = 'Emoji2',
+  GripperBarHorizontal = 'GripperBarHorizontal',
+  System = 'System',
+  Personalize = 'Personalize',
+  SearchAndApps = 'SearchAndApps',
+  Globe = 'Globe',
+  ContactInfo = 'ContactInfo',
+  Unpin = 'Unpin',
+  Contact = 'Contact',
+  Memo = 'Memo',
+  Paste = 'Paste',
+  WindowsLogo = 'WindowsLogo',
+  Error = 'Error',
+  GripperBarVertical = 'GripperBarVertical',
+  Unlock = 'Unlock',
+  Calendar = 'Calendar',
+  Megaphone = 'Megaphone',
+  AutoEnhanceOn = 'AutoEnhanceOn',
+  AutoEnhanceOff = 'AutoEnhanceOff',
+  Color = 'Color',
+  SaveAs = 'SaveAs',
+  Light = 'Light',
+  Filters = 'Filters',
+  AspectRatio = 'AspectRatio',
+  Contrast = 'Contrast',
+  Redo = 'Redo',
+  Undo = 'Undo',
+  PhotoCollection = 'PhotoCollection',
+  Album = 'Album',
+  Rotate = 'Rotate',
+  PanoIndicator = 'PanoIndicator',
+  RedEye = 'RedEye',
+  ThumbnailView = 'ThumbnailView',
+  Package = 'Package',
+  Warning = 'Warning',
+  Financial = 'Financial',
+  Education = 'Education',
+  ShoppingCart = 'ShoppingCart',
+  Train = 'Train',
+  Flag = 'Flag',
+  Move = 'Move',
+  Page = 'Page',
+  TouchPointer = 'TouchPointer',
+  Merge = 'Merge',
+  TurnRight = 'TurnRight',
+  Ferry = 'Ferry',
+  Highlight = 'Highlight',
+  Tab = 'Tab',
+  Admin = 'Admin',
+  TVMonitor = 'TVMonitor',
+  Speakers = 'Speakers',
+  Nav2DMapView = 'Nav2DMapView',
+  Car = 'Car',
+  Bus = 'Bus',
+  EatDrink = 'EatDrink',
+  LocationCircle = 'LocationCircle',
+  Home = 'Home',
+  SwitcherStartEnd = 'SwitcherStartEnd',
+  ParkingLocation = 'ParkingLocation',
+  IncidentTriangle = 'IncidentTriangle',
+  Touch = 'Touch',
+  MapDirections = 'MapDirections',
+  History = 'History',
+  Location = 'Location',
+  Work = 'Work',
+  Recent = 'Recent',
+  Hotel = 'Hotel',
+  LocationDot = 'LocationDot',
+  News = 'News',
+  Chat = 'Chat',
+  Group = 'Group',
+  View = 'View',
+  Previous = 'Previous',
+  Next = 'Next',
+  Clear = 'Clear',
+  Sync = 'Sync',
+  Download = 'Download',
+  Help = 'Help',
+  Upload = 'Upload',
+  Emoji = 'Emoji',
+  MailForward = 'MailForward',
+  ClosePane = 'ClosePane',
+  OpenPane = 'OpenPane',
+  PreviewLink = 'PreviewLink',
+  ZoomIn = 'ZoomIn',
+  Bookmarks = 'Bookmarks',
+  Document = 'Document',
+  ProtectedDocument = 'ProtectedDocument',
+  OpenInNewWindow = 'OpenInNewWindow',
+  MailFill = 'MailFill',
+  ViewAll = 'ViewAll',
+  Switch = 'Switch',
+  Rename = 'Rename',
+  Import = 'Import',
+  Folder = 'Folder',
+  Picture = 'Picture',
+  ShowResults = 'ShowResults',
+  Message = 'Message',
+  CalendarDay = 'CalendarDay',
+  CalendarWeek = 'CalendarWeek',
+  MailReplyAll = 'MailReplyAll',
+  Read = 'Read',
+  Cut = 'Cut',
+  PaymentCard = 'PaymentCard',
+  Copy = 'Copy',
+  Important = 'Important',
+  MailReply = 'MailReply',
+  Sort = 'Sort',
+  GotoToday = 'GotoToday',
+  Font = 'Font',
+  FontColor = 'FontColor',
+  FolderFill = 'FolderFill',
+  Permissions = 'Permissions',
+  DisableUpdates = 'DisableUpdates',
+  Unfavorite = 'Unfavorite',
+  Italic = 'Italic',
+  Underline = 'Underline',
+  Bold = 'Bold',
+  MoveToFolder = 'MoveToFolder',
+  Dislike = 'Dislike',
+  Like = 'Like',
+  AlignRight = 'AlignRight',
+  AlignCenter = 'AlignCenter',
+  AlignLeft = 'AlignLeft',
+  OpenFile = 'OpenFile',
+  FontDecrease = 'FontDecrease',
+  FontIncrease = 'FontIncrease',
+  FontSize = 'FontSize',
+  CellPhone = 'CellPhone',
+  Tag = 'Tag',
+  Library = 'Library',
+  PostUpdate = 'PostUpdate',
+  NewFolder = 'NewFolder',
+  CalendarReply = 'CalendarReply',
+  UnsyncFolder = 'UnsyncFolder',
+  SyncFolder = 'SyncFolder',
+  BlockContact = 'BlockContact',
+  AddFriend = 'AddFriend',
+  BulletedList = 'BulletedList',
+  Preview = 'Preview',
+  World = 'World',
+  Comment = 'Comment',
+  DockLeft = 'DockLeft',
+  DockRight = 'DockRight',
+  Repair = 'Repair',
+  Accounts = 'Accounts',
+  RadioBullet = 'RadioBullet',
+  Stopwatch = 'Stopwatch',
+  Clock = 'Clock',
+  WorldClock = 'WorldClock',
+  AlarmClock = 'AlarmClock',
+  Hospital = 'Hospital',
+  Timer = 'Timer',
+  FullCircleMask = 'FullCircleMask',
+  LocationFill = 'LocationFill',
+  ChromeMinimize = 'ChromeMinimize',
+  Annotation = 'Annotation',
+  ChromeClose = 'ChromeClose',
+  Accept = 'Accept',
+  Fingerprint = 'Fingerprint',
+  Handwriting = 'Handwriting',
+  StackIndicator = 'StackIndicator',
+  Completed = 'Completed',
+  Label = 'Label',
+  FlickDown = 'FlickDown',
+  FlickUp = 'FlickUp',
+  FlickLeft = 'FlickLeft',
+  FlickRight = 'FlickRight',
+  Streaming = 'Streaming',
+  MusicInCollection = 'MusicInCollection',
+  OneDrive = 'OneDrive',
+  CompassNW = 'CompassNW',
+  Code = 'Code',
+  LightningBolt = 'LightningBolt',
+  Info = 'Info',
+  CalculatorMultiply = 'CalculatorMultiply',
+  CalculatorAddition = 'CalculatorAddition',
+  CalculatorSubtract = 'CalculatorSubtract',
+  CalculatorEqualTo = 'CalculatorEqualTo',
+  PrintfaxPrinterFile = 'PrintfaxPrinterFile',
+  Communications = 'Communications',
+  Headset = 'Headset',
+  Health = 'Health',
+  ChevronUpSmall = 'ChevronUpSmall',
+  ChevronDownSmall = 'ChevronDownSmall',
+  ChevronLeftSmall = 'ChevronLeftSmall',
+  ChevronRightSmall = 'ChevronRightSmall',
+  ChevronUpMed = 'ChevronUpMed',
+  ChevronDownMed = 'ChevronDownMed',
+  ChevronLeftMed = 'ChevronLeftMed',
+  ChevronRightMed = 'ChevronRightMed',
+  Dictionary = 'Dictionary',
+  ChromeBack = 'ChromeBack',
+  PC1 = 'PC1',
+  PresenceChickletVideo = 'PresenceChickletVideo',
+  Reply = 'Reply',
+  HalfAlpha = 'HalfAlpha',
+  LockSolid = 'LockSolid',
+  ConstructionCone = 'ConstructionCone',
+  DoubleChevronLeftMed = 'DoubleChevronLeftMed',
+  Volume0 = 'Volume0',
+  Volume1 = 'Volume1',
+  Volume2 = 'Volume2',
+  Volume3 = 'Volume3',
+  CaretHollow = 'CaretHollow',
+  CaretSolid = 'CaretSolid',
+  FolderOpen = 'FolderOpen',
+  Pinned = 'Pinned',
+  PinnedFill = 'PinnedFill',
+  Chart = 'Chart',
+  Robot = 'Robot',
+  BidiLtr = 'BidiLtr',
+  BidiRtl = 'BidiRtl',
+  RevToggleKey = 'RevToggleKey',
+  RightDoubleQuote = 'RightDoubleQuote',
+  Sunny = 'Sunny',
+  CloudWeather = 'CloudWeather',
+  Cloudy = 'Cloudy',
+  PartlyCloudyDay = 'PartlyCloudyDay',
+  PartlyCloudyNight = 'PartlyCloudyNight',
+  ClearNight = 'ClearNight',
+  RainShowersDay = 'RainShowersDay',
+  Rain = 'Rain',
+  Thunderstorms = 'Thunderstorms',
+  RainSnow = 'RainSnow',
+  Snow = 'Snow',
+  BlowingSnow = 'BlowingSnow',
+  Frigid = 'Frigid',
+  Fog = 'Fog',
+  Squalls = 'Squalls',
+  Duststorm = 'Duststorm',
+  Unknown = 'Unknown',
+  Precipitation = 'Precipitation',
+  Ringer = 'Ringer',
+  PDF = 'PDF',
+  SortLines = 'SortLines',
+  Ribbon = 'Ribbon',
+  AreaChart = 'AreaChart',
+  Assign = 'Assign',
+  CheckList = 'CheckList',
+  Diagnostic = 'Diagnostic',
+  Generate = 'Generate',
+  LineChart = 'LineChart',
+  Equalizer = 'Equalizer',
+  BarChartHorizontal = 'BarChartHorizontal',
+  BarChartVertical = 'BarChartVertical',
+  Freezing = 'Freezing',
+  Processing = 'Processing',
+  SnowShowerDay = 'SnowShowerDay',
+  HailDay = 'HailDay',
+  WorkFlow = 'WorkFlow',
+  StoreLogoMed = 'StoreLogoMed',
+  TriangleSolid = 'TriangleSolid',
+  RainShowersNight = 'RainShowersNight',
+  SnowShowerNight = 'SnowShowerNight',
+  HailNight = 'HailNight',
+  Info2 = 'Info2',
+  StoreLogo = 'StoreLogo',
+  MultiSelectMirrored = 'MultiSelectMirrored',
+  Broom = 'Broom',
+  MusicInCollectionFill = 'MusicInCollectionFill',
+  List = 'List',
+  Asterisk = 'Asterisk',
+  ErrorBadge = 'ErrorBadge',
+  CircleRing = 'CircleRing',
+  CircleFill = 'CircleFill',
+  Record2 = 'Record2',
+  BookmarksMirrored = 'BookmarksMirrored',
+  BulletedListMirrored = 'BulletedListMirrored',
+  CaretHollowMirrored = 'CaretHollowMirrored',
+  CaretSolidMirrored = 'CaretSolidMirrored',
+  ChromeBackMirrored = 'ChromeBackMirrored',
+  ClosePaneMirrored = 'ClosePaneMirrored',
+  DockLeftMirrored = 'DockLeftMirrored',
+  DoubleChevronLeftMedMirrored = 'DoubleChevronLeftMedMirrored',
+  HelpMirrored = 'HelpMirrored',
+  ImportMirrored = 'ImportMirrored',
+  ListMirrored = 'ListMirrored',
+  MailForwardMirrored = 'MailForwardMirrored',
+  MailReplyMirrored = 'MailReplyMirrored',
+  MailReplyAllMirrored = 'MailReplyAllMirrored',
+  OpenPaneMirrored = 'OpenPaneMirrored',
+  ParkingLocationMirrored = 'ParkingLocationMirrored',
+  SendMirrored = 'SendMirrored',
+  ShowResultsMirrored = 'ShowResultsMirrored',
+  ThumbnailViewMirrored = 'ThumbnailViewMirrored',
+  Devices3 = 'Devices3',
+  Lightbulb = 'Lightbulb',
+  StatusTriangle = 'StatusTriangle',
+  VolumeDisabled = 'VolumeDisabled',
+  Puzzle = 'Puzzle',
+  EmojiNeutral = 'EmojiNeutral',
+  EmojiDisappointed = 'EmojiDisappointed',
+  HomeSolid = 'HomeSolid',
+  Cocktails = 'Cocktails',
+  Wines = 'Wines',
+  Articles = 'Articles',
+  Cycling = 'Cycling',
+  DietPlanNotebook = 'DietPlanNotebook',
+  Pill = 'Pill',
+  ExerciseTracker = 'ExerciseTracker',
+  Medical = 'Medical',
+  Running = 'Running',
+  Weights = 'Weights',
+  BarChart4 = 'BarChart4',
+  CirclePlus = 'CirclePlus',
+  Coffee = 'Coffee',
+  Cotton = 'Cotton',
+  Market = 'Market',
+  Money = 'Money',
+  PieDouble = 'PieDouble',
+  PieSingle = 'PieSingle',
+  RemoveFilter = 'RemoveFilter',
+  Savings = 'Savings',
+  StockDown = 'StockDown',
+  StockUp = 'StockUp',
+  MSNVideos = 'MSNVideos',
+  Cricket = 'Cricket',
+  Golf = 'Golf',
+  Baseball = 'Baseball',
+  Soccer = 'Soccer',
+  MoreSports = 'MoreSports',
+  AutoRacing = 'AutoRacing',
+  CollegeHoops = 'CollegeHoops',
+  CollegeFootball = 'CollegeFootball',
+  ProFootball = 'ProFootball',
+  ProHockey = 'ProHockey',
+  Rugby = 'Rugby',
+  Tennis = 'Tennis',
+  Arrivals = 'Arrivals',
+  Design = 'Design',
+  Website = 'Website',
+  Drop = 'Drop',
+  SkiResorts = 'SkiResorts',
+  Snowflake = 'Snowflake',
+  BusSolid = 'BusSolid',
+  FerrySolid = 'FerrySolid',
+  AirplaneSolid = 'AirplaneSolid',
+  TrainSolid = 'TrainSolid',
+  Heart = 'Heart',
+  HeartFill = 'HeartFill',
+  Ticket = 'Ticket',
+  Devices4 = 'Devices4',
+  AzureLogo = 'AzureLogo',
+  BingLogo = 'BingLogo',
+  MSNLogo = 'MSNLogo',
+  OutlookLogoInverse = 'OutlookLogoInverse',
+  OfficeLogo = 'OfficeLogo',
+  SkypeLogo = 'SkypeLogo',
+  Door = 'Door',
+  EditMirrored = 'EditMirrored',
+  GiftCard = 'GiftCard',
+  DoubleBookmark = 'DoubleBookmark',
+  StatusErrorFull = 'StatusErrorFull',
+  Certificate = 'Certificate',
+  FastForward = 'FastForward',
+  Rewind = 'Rewind',
+  Photo2 = 'Photo2',
+  OpenSource = 'OpenSource',
+  CloudDownload = 'CloudDownload',
+  WindDirection = 'WindDirection',
+  Family = 'Family',
+  CSS = 'CSS',
+  JS = 'JS',
+  DeliveryTruck = 'DeliveryTruck',
+  ReminderPerson = 'ReminderPerson',
+  ReminderGroup = 'ReminderGroup',
+  Umbrella = 'Umbrella',
+  NetworkTower = 'NetworkTower',
+  CityNext = 'CityNext',
+  Section = 'Section',
+  OneNoteLogoInverse = 'OneNoteLogoInverse',
+  ToggleFilled = 'ToggleFilled',
+  ToggleBorder = 'ToggleBorder',
+  SliderThumb = 'SliderThumb',
+  ToggleThumb = 'ToggleThumb',
+  Documentation = 'Documentation',
+  Badge = 'Badge',
+  Giftbox = 'Giftbox',
+  VisualStudioLogo = 'VisualStudioLogo',
+  ExcelLogoInverse = 'ExcelLogoInverse',
+  WordLogoInverse = 'WordLogoInverse',
+  PowerPointLogoInverse = 'PowerPointLogoInverse',
+  Cafe = 'Cafe',
+  SpeedHigh = 'SpeedHigh',
+  ThisPC = 'ThisPC',
+  MusicNote = 'MusicNote',
+  MicOff = 'MicOff',
+  EdgeLogo = 'EdgeLogo',
+  CompletedSolid = 'CompletedSolid',
+  AlbumRemove = 'AlbumRemove',
+  MessageFill = 'MessageFill',
+  TabletSelected = 'TabletSelected',
+  MobileSelected = 'MobileSelected',
+  LaptopSelected = 'LaptopSelected',
+  TVMonitorSelected = 'TVMonitorSelected',
+  DeveloperTools = 'DeveloperTools',
+  InsertTextBox = 'InsertTextBox',
+  LowerBrightness = 'LowerBrightness',
+  CloudUpload = 'CloudUpload',
+  ScrollUpDown = 'ScrollUpDown',
+  DateTime = 'DateTime',
+  Event = 'Event',
+  Cake = 'Cake',
+  Tiles = 'Tiles',
+  Org = 'Org',
+  PartyLeader = 'PartyLeader',
+  DRM = 'DRM',
+  CloudAdd = 'CloudAdd',
+  AppIconDefault = 'AppIconDefault',
+  Photo2Add = 'Photo2Add',
+  Photo2Remove = 'Photo2Remove',
+  POI = 'POI',
+  FacebookLogo = 'FacebookLogo',
+  AddTo = 'AddTo',
+  RadioBtnOff = 'RadioBtnOff',
+  RadioBtnOn = 'RadioBtnOn',
+  ExploreContent = 'ExploreContent',
+  Embed = 'Embed',
+  VideoSolid = 'VideoSolid',
+  Teamwork = 'Teamwork',
+  PeopleAdd = 'PeopleAdd',
+  Glasses = 'Glasses',
+  DateTime2 = 'DateTime2',
+  Shield = 'Shield',
+  Header1 = 'Header1',
+  PageAdd = 'PageAdd',
+  NumberedList = 'NumberedList',
+  PowerBILogo = 'PowerBILogo',
+  Product = 'Product',
+  ProgressLoopInner = 'ProgressLoopInner',
+  ProgressLoopOuter = 'ProgressLoopOuter',
+  Blocked2 = 'Blocked2',
+  FangBody = 'FangBody',
+  Glimmer = 'Glimmer',
+  ChatInviteFriend = 'ChatInviteFriend',
+  Crown = 'Crown',
+  Feedback = 'Feedback',
+  SharepointLogoInverse = 'SharepointLogoInverse',
+  YammerLogo = 'YammerLogo',
+  Hide = 'Hide',
+  Uneditable = 'Uneditable',
+  ReturnToSession = 'ReturnToSession',
+  OpenFolderHorizontal = 'OpenFolderHorizontal',
+  CalendarMirrored = 'CalendarMirrored',
+  SwayLogoInverse = 'SwayLogoInverse',
+  OutOfOffice = 'OutOfOffice',
+  Trophy = 'Trophy',
+  ReopenPages = 'ReopenPages',
+  AADLogo = 'AADLogo',
+  AccessLogo = 'AccessLogo',
+  AdminALogoInverse32 = 'AdminALogoInverse32',
+  AdminCLogoInverse32 = 'AdminCLogoInverse32',
+  AdminDLogoInverse32 = 'AdminDLogoInverse32',
+  AdminELogoInverse32 = 'AdminELogoInverse32',
+  AdminLLogoInverse32 = 'AdminLLogoInverse32',
+  AdminMLogoInverse32 = 'AdminMLogoInverse32',
+  AdminOLogoInverse32 = 'AdminOLogoInverse32',
+  AdminPLogoInverse32 = 'AdminPLogoInverse32',
+  AdminSLogoInverse32 = 'AdminSLogoInverse32',
+  AdminYLogoInverse32 = 'AdminYLogoInverse32',
+  BoxLogo = 'BoxLogo',
+  DelveLogoInverse = 'DelveLogoInverse',
+  DropboxLogo = 'DropboxLogo',
+  ExchangeLogoInverse = 'ExchangeLogoInverse',
+  LyncLogo = 'LyncLogo',
+  OfficeVideoLogoInverse = 'OfficeVideoLogoInverse',
+  ParatureLogo = 'ParatureLogo',
+  SocialListeningLogo = 'SocialListeningLogo',
+  VisioLogoInverse = 'VisioLogoInverse',
+  Balloons = 'Balloons',
+  Cat = 'Cat',
+  MailAlert = 'MailAlert',
+  MailCheck = 'MailCheck',
+  MailLowImportance = 'MailLowImportance',
+  MailPause = 'MailPause',
+  MailRepeat = 'MailRepeat',
+  SecurityGroup = 'SecurityGroup',
+  Table = 'Table',
+  VoicemailForward = 'VoicemailForward',
+  VoicemailReply = 'VoicemailReply',
+  Waffle = 'Waffle',
+  RemoveEvent = 'RemoveEvent',
+  EventInfo = 'EventInfo',
+  ForwardEvent = 'ForwardEvent',
+  WipePhone = 'WipePhone',
+  AddOnlineMeeting = 'AddOnlineMeeting',
+  JoinOnlineMeeting = 'JoinOnlineMeeting',
+  RemoveLink = 'RemoveLink',
+  PeopleBlock = 'PeopleBlock',
+  PeopleRepeat = 'PeopleRepeat',
+  PeopleAlert = 'PeopleAlert',
+  PeoplePause = 'PeoplePause',
+  TransferCall = 'TransferCall',
+  AddPhone = 'AddPhone',
+  UnknownCall = 'UnknownCall',
+  NoteReply = 'NoteReply',
+  NoteForward = 'NoteForward',
+  NotePinned = 'NotePinned',
+  RemoveOccurrence = 'RemoveOccurrence',
+  Timeline = 'Timeline',
+  EditNote = 'EditNote',
+  CircleHalfFull = 'CircleHalfFull',
+  Room = 'Room',
+  Unsubscribe = 'Unsubscribe',
+  Subscribe = 'Subscribe',
+  RecurringTask = 'RecurringTask',
+  TaskManager = 'TaskManager',
+  TaskManagerMirrored = 'TaskManagerMirrored',
+  Combine = 'Combine',
+  Split = 'Split',
+  DoubleChevronUp = 'DoubleChevronUp',
+  DoubleChevronLeft = 'DoubleChevronLeft',
+  DoubleChevronRight = 'DoubleChevronRight',
+  Ascending = 'Ascending',
+  Descending = 'Descending',
+  TextBox = 'TextBox',
+  TextField = 'TextField',
+  NumberField = 'NumberField',
+  Dropdown = 'Dropdown',
+  BookingsLogo = 'BookingsLogo',
+  ClassNotebookLogoInverse = 'ClassNotebookLogoInverse',
+  DelveAnalyticsLogo = 'DelveAnalyticsLogo',
+  DocsLogoInverse = 'DocsLogoInverse',
+  Dynamics365Logo = 'Dynamics365Logo',
+  DynamicSMBLogo = 'DynamicSMBLogo',
+  OfficeAssistantLogo = 'OfficeAssistantLogo',
+  OfficeStoreLogo = 'OfficeStoreLogo',
+  OneNoteEduLogoInverse = 'OneNoteEduLogoInverse',
+  PlannerLogo = 'PlannerLogo',
+  PowerApps = 'PowerApps',
+  Suitcase = 'Suitcase',
+  ProjectLogoInverse = 'ProjectLogoInverse',
+  CaretLeft8 = 'CaretLeft8',
+  CaretRight8 = 'CaretRight8',
+  CaretUp8 = 'CaretUp8',
+  CaretDown8 = 'CaretDown8',
+  CaretLeftSolid8 = 'CaretLeftSolid8',
+  CaretRightSolid8 = 'CaretRightSolid8',
+  CaretUpSolid8 = 'CaretUpSolid8',
+  CaretDownSolid8 = 'CaretDownSolid8',
+  ClearFormatting = 'ClearFormatting',
+  Superscript = 'Superscript',
+  Subscript = 'Subscript',
+  Strikethrough = 'Strikethrough',
+  Export = 'Export',
+  ExportMirrored = 'ExportMirrored',
+  SingleBookmark = 'SingleBookmark',
+  DoubleChevronDown = 'DoubleChevronDown',
+  ReplyAll = 'ReplyAll',
+  GoogleDriveLogo = 'GoogleDriveLogo',
+  Questionnaire = 'Questionnaire',
+  ReplyMirrored = 'ReplyMirrored',
+  ReplyAllMirrored = 'ReplyAllMirrored',
+  AddGroup = 'AddGroup',
+  QuestionnaireMirrored = 'QuestionnaireMirrored',
+  TemporaryUser = 'TemporaryUser',
+  CaretSolid16 = 'CaretSolid16',
+  GroupedDescending = 'GroupedDescending',
+  GroupedAscending = 'GroupedAscending',
+  SortUp = 'SortUp',
+  SortDown = 'SortDown',
+  AwayStatus = 'AwayStatus',
+  MyMoviesTV = 'MyMoviesTV',
+  SyncToPC = 'SyncToPC',
+  AustralianRules = 'AustralianRules',
+  WifiEthernet = 'WifiEthernet',
+  DateTimeMirrored = 'DateTimeMirrored',
+  StopSolid = 'StopSolid',
+  DoubleChevronUp12 = 'DoubleChevronUp12',
+  DoubleChevronDown12 = 'DoubleChevronDown12',
+  DoubleChevronLeft12 = 'DoubleChevronLeft12',
+  DoubleChevronRight12 = 'DoubleChevronRight12',
+  CalendarAgenda = 'CalendarAgenda',
+  AddEvent = 'AddEvent',
+  AssetLibrary = 'AssetLibrary',
+  DataConnectionLibrary = 'DataConnectionLibrary',
+  DocLibrary = 'DocLibrary',
+  FormLibrary = 'FormLibrary',
+  FormLibraryMirrored = 'FormLibraryMirrored',
+  ReportLibrary = 'ReportLibrary',
+  ReportLibraryMirrored = 'ReportLibraryMirrored',
+  ContactCard = 'ContactCard',
+  CustomList = 'CustomList',
+  CustomListMirrored = 'CustomListMirrored',
+  IssueTracking = 'IssueTracking',
+  IssueTrackingMirrored = 'IssueTrackingMirrored',
+  PictureLibrary = 'PictureLibrary',
+  OfficeAddinsLogo = 'OfficeAddinsLogo',
+  OfflineOneDriveParachute = 'OfflineOneDriveParachute',
+  OfflineOneDriveParachuteDisabled = 'OfflineOneDriveParachuteDisabled',
+  LargeGrid = 'LargeGrid',
+  TriangleSolidUp12 = 'TriangleSolidUp12',
+  TriangleSolidDown12 = 'TriangleSolidDown12',
+  TriangleSolidLeft12 = 'TriangleSolidLeft12',
+  TriangleSolidRight12 = 'TriangleSolidRight12',
+  TriangleUp12 = 'TriangleUp12',
+  TriangleDown12 = 'TriangleDown12',
+  TriangleLeft12 = 'TriangleLeft12',
+  TriangleRight12 = 'TriangleRight12',
+  ArrowUpRight8 = 'ArrowUpRight8',
+  ArrowDownRight8 = 'ArrowDownRight8',
+  DocumentSet = 'DocumentSet',
+  DelveAnalytics = 'DelveAnalytics',
+  ArrowUpRightMirrored8 = 'ArrowUpRightMirrored8',
+  ArrowDownRightMirrored8 = 'ArrowDownRightMirrored8',
+  OneDriveAdd = 'OneDriveAdd',
+  Header2 = 'Header2',
+  Header3 = 'Header3',
+  Header4 = 'Header4',
+  MarketDown = 'MarketDown',
+  CalendarWorkWeek = 'CalendarWorkWeek',
+  SidePanel = 'SidePanel',
+  GlobeFavorite = 'GlobeFavorite',
+  CaretTopLeftSolid8 = 'CaretTopLeftSolid8',
+  CaretTopRightSolid8 = 'CaretTopRightSolid8',
+  ViewAll2 = 'ViewAll2',
+  DocumentReply = 'DocumentReply',
+  PlayerSettings = 'PlayerSettings',
+  ReceiptForward = 'ReceiptForward',
+  ReceiptReply = 'ReceiptReply',
+  ReceiptCheck = 'ReceiptCheck',
+  Fax = 'Fax',
+  RecurringEvent = 'RecurringEvent',
+  ReplyAlt = 'ReplyAlt',
+  ReplyAllAlt = 'ReplyAllAlt',
+  EditStyle = 'EditStyle',
+  EditMail = 'EditMail',
+  Lifesaver = 'Lifesaver',
+  LifesaverLock = 'LifesaverLock',
+  InboxCheck = 'InboxCheck',
+  FolderSearch = 'FolderSearch',
+  CollapseMenu = 'CollapseMenu',
+  ExpandMenu = 'ExpandMenu',
+  Boards = 'Boards',
+  SunAdd = 'SunAdd',
+  SunQuestionMark = 'SunQuestionMark',
+  LandscapeOrientation = 'LandscapeOrientation',
+  DocumentSearch = 'DocumentSearch',
+  PublicCalendar = 'PublicCalendar',
+  PublicContactCard = 'PublicContactCard',
+  PublicEmail = 'PublicEmail',
+  PublicFolder = 'PublicFolder',
+  WordDocument = 'WordDocument',
+  PowerPointDocument = 'PowerPointDocument',
+  ExcelDocument = 'ExcelDocument',
+  GroupedList = 'GroupedList',
+  ClassroomLogo = 'ClassroomLogo',
+  Sections = 'Sections',
+  EditPhoto = 'EditPhoto',
+  Starburst = 'Starburst',
+  ShareiOS = 'ShareiOS',
+  AirTickets = 'AirTickets',
+  PencilReply = 'PencilReply',
+  Tiles2 = 'Tiles2',
+  SkypeCircleCheck = 'SkypeCircleCheck',
+  SkypeCircleClock = 'SkypeCircleClock',
+  SkypeCircleMinus = 'SkypeCircleMinus',
+  SkypeCheck = 'SkypeCheck',
+  SkypeClock = 'SkypeClock',
+  SkypeMinus = 'SkypeMinus',
+  SkypeMessage = 'SkypeMessage',
+  ClosedCaption = 'ClosedCaption',
+  ATPLogo = 'ATPLogo',
+  OfficeFormsLogoInverse = 'OfficeFormsLogoInverse',
+  RecycleBin = 'RecycleBin',
+  EmptyRecycleBin = 'EmptyRecycleBin',
+  Hide2 = 'Hide2',
+  iOSAppStoreLogo = 'iOSAppStoreLogo',
+  AndroidLogo = 'AndroidLogo',
+  Breadcrumb = 'Breadcrumb',
+  ClearFilter = 'ClearFilter',
+  Flow = 'Flow',
+  PageEdit = 'PageEdit',
+  Database = 'Database',
+  DocumentManagement = 'DocumentManagement',
+  CRMReport = 'CRMReport',
+  ZipFolder = 'ZipFolder',
+  TextDocument = 'TextDocument',
+  PageCheckedOut = 'PageCheckedOut',
+  SaveAndClose = 'SaveAndClose',
+  Script = 'Script',
+  Archive = 'Archive',
+  ActivityFeed = 'ActivityFeed',
+  EventDate = 'EventDate',
+  CaretRight = 'CaretRight',
+  SetAction = 'SetAction',
+  CaretSolidLeft = 'CaretSolidLeft',
+  CaretSolidDown = 'CaretSolidDown',
+  CaretSolidRight = 'CaretSolidRight',
+  CaretSolidUp = 'CaretSolidUp',
+  PowerAppsLogo = 'PowerAppsLogo',
+  PowerApps2Logo = 'PowerApps2Logo',
+  SearchIssue = 'SearchIssue',
+  SearchIssueMirrored = 'SearchIssueMirrored',
+  FabricAssetLibrary = 'FabricAssetLibrary',
+  FabricDataConnectionLibrary = 'FabricDataConnectionLibrary',
+  FabricDocLibrary = 'FabricDocLibrary',
+  FabricFormLibrary = 'FabricFormLibrary',
+  FabricFormLibraryMirrored = 'FabricFormLibraryMirrored',
+  FabricReportLibrary = 'FabricReportLibrary',
+  FabricReportLibraryMirrored = 'FabricReportLibraryMirrored',
+  FabricPublicFolder = 'FabricPublicFolder',
+  FabricFolderSearch = 'FabricFolderSearch',
+  FabricMovetoFolder = 'FabricMovetoFolder',
+  FabricUnsyncFolder = 'FabricUnsyncFolder',
+  FabricSyncFolder = 'FabricSyncFolder',
+  FabricOpenFolderHorizontal = 'FabricOpenFolderHorizontal',
+  FabricFolder = 'FabricFolder',
+  FabricFolderFill = 'FabricFolderFill',
+  FabricNewFolder = 'FabricNewFolder',
+  FabricPictureLibrary = 'FabricPictureLibrary',
+  AddFavorite = 'AddFavorite',
+  AddFavoriteFill = 'AddFavoriteFill',
+  BufferTimeBefore = 'BufferTimeBefore',
+  BufferTimeAfter = 'BufferTimeAfter',
+  BufferTimeBoth = 'BufferTimeBoth',
+  CannedChat = 'CannedChat',
+  SkypeForBusinessLogo = 'SkypeForBusinessLogo',
+  PageCheckedin = 'PageCheckedin',
+  CaretBottomLeftSolid8 = 'CaretBottomLeftSolid8',
+  CaretBottomRightSolid8 = 'CaretBottomRightSolid8',
+  FolderHorizontal = 'FolderHorizontal',
+  MicrosoftStaffhubLogo = 'MicrosoftStaffhubLogo',
+  GiftboxOpen = 'GiftboxOpen',
+  StatusCircleOuter = 'StatusCircleOuter',
+  StatusCircleInner = 'StatusCircleInner',
+  StatusCircleCheckmark = 'StatusCircleCheckmark',
+  ExploreContentSingle = 'ExploreContentSingle',
+  CollapseContent = 'CollapseContent',
+  CollapseContentSingle = 'CollapseContentSingle',
+  InfoSolid = 'InfoSolid',
+  ProgressRingDots = 'ProgressRingDots',
+  CaloriesAdd = 'CaloriesAdd',
+  BranchFork = 'BranchFork',
+  HardDriveGroup = 'HardDriveGroup',
+  BucketColor = 'BucketColor',
+  BucketColorFill = 'BucketColorFill',
+  Taskboard = 'Taskboard',
+  SingleColumn = 'SingleColumn',
+  DoubleColumn = 'DoubleColumn',
+  TripleColumn = 'TripleColumn',
+  ColumnLeftTwoThirds = 'ColumnLeftTwoThirds',
+  ColumnRightTwoThirds = 'ColumnRightTwoThirds',
+  AccessLogoFill = 'AccessLogoFill',
+  AnalyticsLogo = 'AnalyticsLogo',
+  AnalyticsQuery = 'AnalyticsQuery',
+  NewAnalyticsQuery = 'NewAnalyticsQuery',
+  AnalyticsReport = 'AnalyticsReport',
+  WordLogo = 'WordLogo',
+  WordLogoFill = 'WordLogoFill',
+  ExcelLogo = 'ExcelLogo',
+  ExcelLogoFill = 'ExcelLogoFill',
+  OneNoteLogo = 'OneNoteLogo',
+  OneNoteLogoFill = 'OneNoteLogoFill',
+  OutlookLogo = 'OutlookLogo',
+  OutlookLogoFill = 'OutlookLogoFill',
+  PowerPointLogo = 'PowerPointLogo',
+  PowerPointLogoFill = 'PowerPointLogoFill',
+  PublisherLogo = 'PublisherLogo',
+  PublisherLogoFill = 'PublisherLogoFill',
+  ScheduleEventAction = 'ScheduleEventAction',
+  FlameSolid = 'FlameSolid',
+  ServerProcesses = 'ServerProcesses',
+  Server = 'Server',
+  SaveAll = 'SaveAll',
+  LinkedInLogo = 'LinkedInLogo',
+  SidePanelMirrored = 'SidePanelMirrored',
+  ProtectRestrict = 'ProtectRestrict',
+  GridViewSmall = 'GridViewSmall',
+  GridViewMedium = 'GridViewMedium',
+  GridViewLarge = 'GridViewLarge',
+  Step = 'Step',
+  StepInsert = 'StepInsert',
+  StepShared = 'StepShared',
+  StepSharedAdd = 'StepSharedAdd',
+  StepSharedInsert = 'StepSharedInsert',
+  ViewDashboard = 'ViewDashboard',
+  ViewList = 'ViewList',
+  ViewListGroup = 'ViewListGroup',
+  ViewListTree = 'ViewListTree',
+  TriggerAuto = 'TriggerAuto',
+  TriggerUser = 'TriggerUser',
+  PivotChart = 'PivotChart',
+  StackedBarChart = 'StackedBarChart',
+  StackedLineChart = 'StackedLineChart',
+  BuildQueue = 'BuildQueue',
+  BuildQueueNew = 'BuildQueueNew',
+  UserFollowed = 'UserFollowed',
+  VennDiagram = 'VennDiagram',
+  FiveTileGrid = 'FiveTileGrid',
+  FocalPoint = 'FocalPoint',
+  TeamsLogoInverse = 'TeamsLogoInverse',
+  TeamsLogo = 'TeamsLogo',
+  TeamsLogoFill = 'TeamsLogoFill',
+  SkypeForBusinessLogoFill = 'SkypeForBusinessLogoFill',
+  SharepointLogo = 'SharepointLogo',
+  SharepointLogoFill = 'SharepointLogoFill',
+  DelveLogo = 'DelveLogo',
+  DelveLogoFill = 'DelveLogoFill',
+  OfficeVideoLogo = 'OfficeVideoLogo',
+  OfficeVideoLogoFill = 'OfficeVideoLogoFill',
+  ExchangeLogo = 'ExchangeLogo',
+  ExchangeLogoFill = 'ExchangeLogoFill',
+  DocumentApproval = 'DocumentApproval',
+  CloneToDesktop = 'CloneToDesktop',
+  InstallToDrive = 'InstallToDrive',
+  Blur = 'Blur',
+  Build = 'Build',
+  ProcessMetaTask = 'ProcessMetaTask',
+  BranchFork2 = 'BranchFork2',
+  BranchLocked = 'BranchLocked',
+  BranchCommit = 'BranchCommit',
+  BranchCompare = 'BranchCompare',
+  BranchMerge = 'BranchMerge',
+  BranchPullRequest = 'BranchPullRequest',
+  BranchSearch = 'BranchSearch',
+  BranchShelveset = 'BranchShelveset',
+  RawSource = 'RawSource',
+  MergeDuplicate = 'MergeDuplicate',
+  RowsGroup = 'RowsGroup',
+  RowsChild = 'RowsChild',
+  Deploy = 'Deploy',
+  Redeploy = 'Redeploy',
+  ServerEnviroment = 'ServerEnviroment',
+  Plug = 'Plug',
+  PlugSolid = 'PlugSolid',
+  PlugConnected = 'PlugConnected',
+  PlugDisconnected = 'PlugDisconnected',
+  UnlockSolid = 'UnlockSolid',
+  Variable = 'Variable',
+  Parameter = 'Parameter',
+  CommentUrgent = 'CommentUrgent',
+  Storyboard = 'Storyboard',
+  DiffInline = 'DiffInline',
+  DiffSideBySide = 'DiffSideBySide',
+  ImageDiff = 'ImageDiff',
+  ImagePixel = 'ImagePixel',
+  FileBug = 'FileBug',
+  FileCode = 'FileCode',
+  FileComment = 'FileComment',
+  FileImage = 'FileImage',
+  FileSymlink = 'FileSymlink',
+  AutoFillTemplate = 'AutoFillTemplate',
+  WorkItem = 'WorkItem',
+  WorkItemBug = 'WorkItemBug',
+  LogRemove = 'LogRemove',
+  ColumnOptions = 'ColumnOptions',
+  Packages = 'Packages',
+  BuildIssue = 'BuildIssue',
+  AssessmentGroup = 'AssessmentGroup',
+  VariableGroup = 'VariableGroup',
+  FullHistory = 'FullHistory',
+  BusinessHoursSign = 'BusinessHoursSign',
+  VisioDiagram = 'VisioDiagram',
+  HighlightMappedShapes = 'HighlightMappedShapes',
+  TextCallout = 'TextCallout',
+  IconSetsFlag = 'IconSetsFlag',
+  VisioLogo = 'VisioLogo',
+  VisioLogoFill = 'VisioLogoFill',
+  VisioDocument = 'VisioDocument',
+  TimelineProgress = 'TimelineProgress',
+  TimelineDelivery = 'TimelineDelivery',
+  Backlog = 'Backlog',
+  TeamFavorite = 'TeamFavorite',
+  TaskGroup = 'TaskGroup',
+  TaskGroupMirrored = 'TaskGroupMirrored',
+  ScopeTemplate = 'ScopeTemplate',
+  AssessmentGroupTemplate = 'AssessmentGroupTemplate',
+  NewTeamProject = 'NewTeamProject',
+  CommentAdd = 'CommentAdd',
+  CommentNext = 'CommentNext',
+  CommentPrevious = 'CommentPrevious',
+  ShopServer = 'ShopServer',
+  LocaleLanguage = 'LocaleLanguage',
+  QueryList = 'QueryList',
+  UserSync = 'UserSync',
+  UserPause = 'UserPause',
+  StreamingOff = 'StreamingOff',
+  MoreVertical = 'MoreVertical',
+  ArrowTallUpLeft = 'ArrowTallUpLeft',
+  ArrowTallUpRight = 'ArrowTallUpRight',
+  ArrowTallDownLeft = 'ArrowTallDownLeft',
+  ArrowTallDownRight = 'ArrowTallDownRight',
+  FieldEmpty = 'FieldEmpty',
+  FieldFilled = 'FieldFilled',
+  FieldChanged = 'FieldChanged',
+  FieldNotChanged = 'FieldNotChanged',
+  RingerOff = 'RingerOff',
+  PlayResume = 'PlayResume',
+  BulletedList2 = 'BulletedList2',
+  BulletedList2Mirrored = 'BulletedList2Mirrored',
+  ImageCrosshair = 'ImageCrosshair',
+  GitGraph = 'GitGraph',
+  Repo = 'Repo',
+  RepoSolid = 'RepoSolid',
+  FolderQuery = 'FolderQuery',
+  FolderList = 'FolderList',
+  FolderListMirrored = 'FolderListMirrored',
+  LocationOutline = 'LocationOutline',
+  POISolid = 'POISolid',
+  CalculatorNotEqualTo = 'CalculatorNotEqualTo',
+  BoxSubtractSolid = 'BoxSubtractSolid',
+  BoxAdditionSolid = 'BoxAdditionSolid',
+  BoxMultiplySolid = 'BoxMultiplySolid',
+  BoxPlaySolid = 'BoxPlaySolid',
+  BoxCheckmarkSolid = 'BoxCheckmarkSolid',
+  CirclePauseSolid = 'CirclePauseSolid',
+  CirclePause = 'CirclePause',
+  MSNVideosSolid = 'MSNVideosSolid',
+  CircleStopSolid = 'CircleStopSolid',
+  CircleStop = 'CircleStop',
+  NavigateBack = 'NavigateBack',
+  NavigateBackMirrored = 'NavigateBackMirrored',
+  NavigateForward = 'NavigateForward',
+  NavigateForwardMirrored = 'NavigateForwardMirrored',
+  UnknownSolid = 'UnknownSolid',
+  UnknownMirroredSolid = 'UnknownMirroredSolid',
+  CircleAddition = 'CircleAddition',
+  CircleAdditionSolid = 'CircleAdditionSolid',
+  FilePDB = 'FilePDB',
+  FileTemplate = 'FileTemplate',
+  FileSQL = 'FileSQL',
+  FileJAVA = 'FileJAVA',
+  FileASPX = 'FileASPX',
+  FileCSS = 'FileCSS',
+  FileSass = 'FileSass',
+  FileLess = 'FileLess',
+  FileHTML = 'FileHTML',
+  JavaScriptLanguage = 'JavaScriptLanguage',
+  CSharpLanguage = 'CSharpLanguage',
+  CSharp = 'CSharp',
+  VisualBasicLanguage = 'VisualBasicLanguage',
+  VB = 'VB',
+  CPlusPlusLanguage = 'CPlusPlusLanguage',
+  CPlusPlus = 'CPlusPlus',
+  FSharpLanguage = 'FSharpLanguage',
+  FSharp = 'FSharp',
+  TypeScriptLanguage = 'TypeScriptLanguage',
+  PythonLanguage = 'PythonLanguage',
+  PY = 'PY',
+  CoffeeScript = 'CoffeeScript',
+  MarkDownLanguage = 'MarkDownLanguage',
+  FullWidth = 'FullWidth',
+  FullWidthEdit = 'FullWidthEdit',
+  SingleColumnEdit = 'SingleColumnEdit',
+  DoubleColumnEdit = 'DoubleColumnEdit',
+  TripleColumnEdit = 'TripleColumnEdit',
+  ColumnLeftTwoThirdsEdit = 'ColumnLeftTwoThirdsEdit',
+  ColumnRightTwoThirdsEdit = 'ColumnRightTwoThirdsEdit',
+  StreamLogo = 'StreamLogo',
+  AlertSolid = 'AlertSolid',
+  MegaphoneSolid = 'MegaphoneSolid',
+  TaskSolid = 'TaskSolid',
+  ConfigurationSolid = 'ConfigurationSolid',
+  BugSolid = 'BugSolid',
+  CrownSolid = 'CrownSolid',
+  Trophy2Solid = 'Trophy2Solid',
+  QuickNoteSolid = 'QuickNoteSolid',
+  ConstructionConeSolid = 'ConstructionConeSolid',
+  PageListSolid = 'PageListSolid',
+  PageListMirroredSolid = 'PageListMirroredSolid',
+  StarburstSolid = 'StarburstSolid',
+  ReadingModeSolid = 'ReadingModeSolid',
+  SadSolid = 'SadSolid',
+  HealthSolid = 'HealthSolid',
+  ShieldSolid = 'ShieldSolid',
+  GiftBoxSolid = 'GiftBoxSolid',
+  ShoppingCartSolid = 'ShoppingCartSolid',
+  MailSolid = 'MailSolid',
+  ChatSolid = 'ChatSolid',
+  RibbonSolid = 'RibbonSolid',
+  FinancialSolid = 'FinancialSolid',
+  FinancialMirroredSolid = 'FinancialMirroredSolid',
+  HeadsetSolid = 'HeadsetSolid',
+  PermissionsSolid = 'PermissionsSolid',
+  ParkingSolid = 'ParkingSolid',
+  ParkingMirroredSolid = 'ParkingMirroredSolid',
+  DiamondSolid = 'DiamondSolid',
+  AsteriskSolid = 'AsteriskSolid',
+  OfflineStorageSolid = 'OfflineStorageSolid',
+  BankSolid = 'BankSolid',
+  DecisionSolid = 'DecisionSolid',
+  Parachute = 'Parachute',
+  ParachuteSolid = 'ParachuteSolid',
+  FiltersSolid = 'FiltersSolid',
+  ColorSolid = 'ColorSolid',
+  ReviewSolid = 'ReviewSolid',
+  ReviewRequestSolid = 'ReviewRequestSolid',
+  ReviewRequestMirroredSolid = 'ReviewRequestMirroredSolid',
+  ReviewResponseSolid = 'ReviewResponseSolid',
+  FeedbackRequestSolid = 'FeedbackRequestSolid',
+  FeedbackRequestMirroredSolid = 'FeedbackRequestMirroredSolid',
+  FeedbackResponseSolid = 'FeedbackResponseSolid',
+  WorkItemBar = 'WorkItemBar',
+  WorkItemBarSolid = 'WorkItemBarSolid',
+  Separator = 'Separator',
+  NavigateExternalInline = 'NavigateExternalInline',
+  PlanView = 'PlanView',
+  TimelineMatrixView = 'TimelineMatrixView',
+  EngineeringGroup = 'EngineeringGroup',
+  ProjectCollection = 'ProjectCollection',
+  CaretBottomRightCenter8 = 'CaretBottomRightCenter8',
+  CaretBottomLeftCenter8 = 'CaretBottomLeftCenter8',
+  CaretTopRightCenter8 = 'CaretTopRightCenter8',
+  CaretTopLeftCenter8 = 'CaretTopLeftCenter8',
+  DonutChart = 'DonutChart',
+  ChevronUnfold10 = 'ChevronUnfold10',
+  ChevronFold10 = 'ChevronFold10',
+  DoubleChevronDown8 = 'DoubleChevronDown8',
+  DoubleChevronUp8 = 'DoubleChevronUp8',
+  DoubleChevronLeft8 = 'DoubleChevronLeft8',
+  DoubleChevronRight8 = 'DoubleChevronRight8',
+  ChevronDownEnd6 = 'ChevronDownEnd6',
+  ChevronUpEnd6 = 'ChevronUpEnd6',
+  ChevronLeftEnd6 = 'ChevronLeftEnd6',
+  ChevronRightEnd6 = 'ChevronRightEnd6',
+  EgnyteLogo = 'EgnyteLogo',
+  GoogleDriveLogoLeftGreen = 'GoogleDriveLogoLeftGreen',
+  GoogleDriveLogoBottomBlue = 'GoogleDriveLogoBottomBlue',
+  GoogleDriveLogoRightYellow = 'GoogleDriveLogoRightYellow',
+  AzureAPIManagement = 'AzureAPIManagement',
+  AzureServiceEndpoint = 'AzureServiceEndpoint',
+  VSTSLogo = 'VSTSLogo',
+  VSTSAltLogo1 = 'VSTSAltLogo1',
+  VSTSAltLogo2 = 'VSTSAltLogo2',
+  FileTypeSolution = 'FileTypeSolution',
+  WordLogoInverse16 = 'WordLogoInverse16',
+  WordLogo16 = 'WordLogo16',
+  WordLogoFill16 = 'WordLogoFill16',
+  PowerPointLogoInverse16 = 'PowerPointLogoInverse16',
+  PowerPointLogo16 = 'PowerPointLogo16',
+  PowerPointLogoFill16 = 'PowerPointLogoFill16',
+  ExcelLogoInverse16 = 'ExcelLogoInverse16',
+  ExcelLogo16 = 'ExcelLogo16',
+  ExcelLogoFill16 = 'ExcelLogoFill16',
+  OneNoteLogoInverse16 = 'OneNoteLogoInverse16',
+  OneNoteLogo16 = 'OneNoteLogo16',
+  OneNoteLogoFill16 = 'OneNoteLogoFill16',
+  OutlookLogoInverse16 = 'OutlookLogoInverse16',
+  OutlookLogo16 = 'OutlookLogo16',
+  OutlookLogoFill16 = 'OutlookLogoFill16',
+  PublisherLogoInverse16 = 'PublisherLogoInverse16',
+  PublisherLogo16 = 'PublisherLogo16',
+  PublisherLogoFill16 = 'PublisherLogoFill16',
+  VisioLogoInverse16 = 'VisioLogoInverse16',
+  VisioLogo16 = 'VisioLogo16',
+  VisioLogoFill16 = 'VisioLogoFill16',
+  TestBeaker = 'TestBeaker',
+  TestBeakerSolid = 'TestBeakerSolid',
+  TestExploreSolid = 'TestExploreSolid',
+  TestAutoSolid = 'TestAutoSolid',
+  TestUserSolid = 'TestUserSolid',
+  TestImpactSolid = 'TestImpactSolid',
+  TestPlan = 'TestPlan',
+  TestStep = 'TestStep',
+  TestParameter = 'TestParameter',
+  TestSuite = 'TestSuite',
+  TestCase = 'TestCase',
+  Sprint = 'Sprint',
+  SignOut = 'SignOut',
+  TriggerApproval = 'TriggerApproval',
+  Rocket = 'Rocket',
+  AzureKeyVault = 'AzureKeyVault',
+  LikeSolid = 'LikeSolid',
+  DislikeSolid = 'DislikeSolid',
+  DeclineCall = 'DeclineCall',
+  Spacer = 'Spacer',
+  SkypeLogo16 = 'SkypeLogo16',
+  SkypeForBusinessLogo16 = 'SkypeForBusinessLogo16',
+  SkypeForBusinessLogoFill16 = 'SkypeForBusinessLogoFill16',
+  FilterSolid = 'FilterSolid',
+  MailUndelivered = 'MailUndelivered',
+  MailTentative = 'MailTentative',
+  MailTentativeMirrored = 'MailTentativeMirrored',
+  MailReminder = 'MailReminder',
+  ReceiptUndelivered = 'ReceiptUndelivered',
+  ReceiptTentative = 'ReceiptTentative',
+  ReceiptTentativeMirrored = 'ReceiptTentativeMirrored',
+  Inbox = 'Inbox',
+  IRMReply = 'IRMReply',
+  IRMReplyMirrored = 'IRMReplyMirrored',
+  IRMForward = 'IRMForward',
+  IRMForwardMirrored = 'IRMForwardMirrored',
+  VoicemailIRM = 'VoicemailIRM',
+  EventAccepted = 'EventAccepted',
+  EventTentative = 'EventTentative',
+  EventTentativeMirrored = 'EventTentativeMirrored',
+  EventDeclined = 'EventDeclined',
+  IDBadge = 'IDBadge',
+  OfficeFormsLogoInverse16 = 'OfficeFormsLogoInverse16',
+  OfficeFormsLogo = 'OfficeFormsLogo',
+  OfficeFormsLogoFill = 'OfficeFormsLogoFill',
+  OfficeFormsLogo16 = 'OfficeFormsLogo16',
+  OfficeFormsLogoFill16 = 'OfficeFormsLogoFill16',
+  OfficeFormsLogoInverse24 = 'OfficeFormsLogoInverse24',
+  OfficeFormsLogo24 = 'OfficeFormsLogo24',
+  OfficeFormsLogoFill24 = 'OfficeFormsLogoFill24',
+  PageLock = 'PageLock',
+  NotExecuted = 'NotExecuted',
+  NotImpactedSolid = 'NotImpactedSolid',
+  FieldReadOnly = 'FieldReadOnly',
+  FieldRequired = 'FieldRequired',
+  BacklogBoard = 'BacklogBoard',
+  ExternalBuild = 'ExternalBuild',
+  ExternalTFVC = 'ExternalTFVC',
+  ExternalXAML = 'ExternalXAML',
+  IssueSolid = 'IssueSolid',
+  DefectSolid = 'DefectSolid',
+  LadybugSolid = 'LadybugSolid',
+  MTMLogo = 'MTMLogo',
+  NugetLogo = 'NugetLogo',
+  TFVCLogo = 'TFVCLogo',
+  ProjectLogo32 = 'ProjectLogo32',
+  ProjectLogoFill32 = 'ProjectLogoFill32',
+  ProjectLogo16 = 'ProjectLogo16',
+  ProjectLogoFill16 = 'ProjectLogoFill16',
+  SwayLogo32 = 'SwayLogo32',
+  SwayLogoFill32 = 'SwayLogoFill32',
+  SwayLogo16 = 'SwayLogo16',
+  SwayLogoFill16 = 'SwayLogoFill16',
+  ClassNotebookLogo32 = 'ClassNotebookLogo32',
+  ClassNotebookLogoFill32 = 'ClassNotebookLogoFill32',
+  ClassNotebookLogo16 = 'ClassNotebookLogo16',
+  ClassNotebookLogoFill16 = 'ClassNotebookLogoFill16',
+  ClassNotebookLogoInverse32 = 'ClassNotebookLogoInverse32',
+  ClassNotebookLogoInverse16 = 'ClassNotebookLogoInverse16',
+  StaffNotebookLogo32 = 'StaffNotebookLogo32',
+  StaffNotebookLogoFill32 = 'StaffNotebookLogoFill32',
+  StaffNotebookLogo16 = 'StaffNotebookLogo16',
+  StaffNotebookLogoFill16 = 'StaffNotebookLogoFill16',
+  StaffNotebookLogoInverted32 = 'StaffNotebookLogoInverted32',
+  StaffNotebookLogoInverted16 = 'StaffNotebookLogoInverted16',
+  KaizalaLogo = 'KaizalaLogo',
+  TaskLogo = 'TaskLogo',
+  ProtectionCenterLogo32 = 'ProtectionCenterLogo32',
+  NonprofitLogo32 = 'NonprofitLogo32',
+  GallatinLogo = 'GallatinLogo',
+  Globe2 = 'Globe2',
+  Guitar = 'Guitar',
+  Breakfast = 'Breakfast',
+  Brunch = 'Brunch',
+  BeerMug = 'BeerMug',
+  Vacation = 'Vacation',
+  Teeth = 'Teeth',
+  Taxi = 'Taxi',
+  Chopsticks = 'Chopsticks',
+  SyncOccurence = 'SyncOccurence',
+  UnsyncOccurence = 'UnsyncOccurence',
+  PrimaryCalendar = 'PrimaryCalendar',
+  SearchCalendar = 'SearchCalendar',
+  VideoOff = 'VideoOff',
+  MicrosoftFlowLogo = 'MicrosoftFlowLogo',
+  BusinessCenterLogo = 'BusinessCenterLogo',
+  ToDoLogoBottom = 'ToDoLogoBottom',
+  ToDoLogoTop = 'ToDoLogoTop',
+  EditSolid12 = 'EditSolid12',
+  EditSolidMirrored12 = 'EditSolidMirrored12',
+  UneditableSolid12 = 'UneditableSolid12',
+  UneditableSolidMirrored12 = 'UneditableSolidMirrored12',
+  UneditableMirrored = 'UneditableMirrored',
+  AdminALogo32 = 'AdminALogo32',
+  AdminALogoFill32 = 'AdminALogoFill32',
+  ToDoLogoInverse = 'ToDoLogoInverse',
+  Snooze = 'Snooze'
+}
diff --git a/packages/icons/src/fabric-icons-0-inline.ts b/packages/icons/src/fabric-icons-0-inline.ts
new file mode 100644
index 0000000000000..340f4b7356068
--- /dev/null
+++ b/packages/icons/src/fabric-icons-0-inline.ts
@@ -0,0 +1,121 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-0"`,
+      src: `url('data:application/octet-stream;base64,d09GRgABAAAAAC7QAA4AAAAAVXwAAnhTAAAAAAAAAAAAAAAAAAAAAAAAAABPUy8yAAABRAAAAEgAAABgLNZvIWNtYXAAAAGMAAABdAAAA1rI88BYY3Z0IAAAAwAAAAAgAAAAKgnZCa9mcGdtAAADIAAAAPAAAAFZ/J7mjmdhc3AAAAQQAAAADAAAAAwACAAbZ2x5ZgAABBwAACSPAABCOA7tjsxoZWFkAAAorAAAADIAAAA2/LJqwGhoZWEAACjgAAAAFQAAACQQAQgDaG10eAAAKPgAAABUAAAAziKQC3Bsb2NhAAApTAAAAMwAAADMFVUkbG1heHAAACoYAAAAHgAAACAA5gIibmFtZQAAKjgAAAP2AAAJ+o2Z8E5wb3N0AAAuMAAAABQAAAAg/1EA3HByZXAAAC5EAAAAiQAAANN4vfIOeJxjYGH/wTiBgZWBgXUWqzEDA6M0hGa+yJDGJMTBysrFyMQIBgxAIMCAAL7BCgoMDo8mPH/PAeZDSAawOhYIT4GBAQAaZAmMeJzN0c8rH3Acx/HP9+vbV6Z2Wrw+bGIcdlgK5demua1RLhYpsakVDvSNy5YicqC2zI9M2w4KhyE/lg2LxIkpUTsst694TqallpYLn74k8gfYu97vd6/Dux71NsaEmdO+bTxuGu9Tlzyh7PNmut1umozf3Ai+xUc4kdwiimiEJZZ47pJIEvdJJoVU0sggk2wekkMuT8ingEKKKKaEUsp5TgVV1BCgngYaaaaVNt7QQRc99NHPEMOMMs5nvjDNNxZYZJkfbLLFDrv8OT42JtjhLH4iLlhiiDuz3Du3pDtLVsjyyFnyLlnKeOYslc5SSx0vQ5YWZ3ntLJ3nlk8XLLPMX7XcWbc+G2a9OrIJ+qdd+1iH+muj7AObpX39tsk2Rb+0oxVt23htKahZ/dSeNuxNrelAq/quAXe5pHea15xm9FWtmtaUJjWhcY1pRIMufdQHvVefetWsbnXqhdrVqFeqU0C1qj793f9SHv91C66/TgCCj+oseJxj0GIIZShgaGBYxcjA2MDswHiAwQGLCBAAAKocB5V4nF2Pv07DQAzGcyS0hCdAOiGddSpDlYid6YZLJNQlJQznpYDUSqTvgJSFxQPP4m4Z82IIzBH+Lra/z/p8v3On+cl8dpylRyopVpw34aDUCw7q7Zn9+SFP7zZlYUzVeVb3ZcFqCaJrThf1TbBoyND1lkxtHh+2nC1il8WO8NJw0oZO6m0Adqi/xx3iVTySxSOEEt9P8X2MS/q1LFaG04smrAP3XrPzqAFMxWMTePQaEH/IpD91ZxPjbDll28BOc4JEn8oC90SahPtLj3/1oJL/hvttyL+rQfVN3PQW9IdhwYKwoZdn21AJGmD5DoT8ZMYAAQACAAgACv//AA94nJ18C3wb1ZnvOfPQyI/IlmVZtmzLGcmS4vgVW5YUv+XEcbDzcBInJEh5EAJJnFeBkNA8oAM/oEmckNuW0iwJ3bZO2C3c0Lt0k1s2tFHKLfRxoWwpdLfZ2wclBXp/UPhd2k0szfh+35kZWVaAslgZzZmZc47O43v+v29COPIEIcID4l7CE4mQqF22+2W7/AT/m/R57rw6RMS9E0ceEZYS+OPwn5VYFFJFWgmhdp83EJRtfD21y8GobA+1ejiX3ENDko2X5GATDdp7aC+VPbzLSmJL72/WSqpWju7ri6mKonBKrG/f6Moq+l7z/Utj5d5KV6G6u6jq3hUr7q0q4o4Vuiq95RaSVuZ3d26YV8uRWIwjtfM2dHbPH7OWV9eW1g/vsqcftu8ari+trS634vgoIXzSSoQYzIVQOSxbyVUYL59UCBGxghU+xEkqSDXxkxaoAwN2wozx09bDhfBcB5Ohsn7gh7aWOUstMNNwW0RS3M2+Uo2kiUZKfc1uqggwQp6oRD84co3gPapcS7oDATccIquYViZhdDxrjlU5JQVdCFCiigZLwarCARMgR8gRSZEUUkmipJuNUXCW2gSft0kIt/UIjtYeODfBtQ3ue4Q8TsqjgnjgDy+M3xWL3TX+wh8OZJdHn39ybFM0uunot58fNctjTz5PW7SH6Z1xrZW+LCnXt9LL146wutDu20eNdkYfwqh2TDsWpy/Rl8hHjdkYW8gYazB3DsE8GoVBZw1oNHugHzMZX5zeqT0MvyqR6W2mBvmxc5n4bpzuprvjWiibFhwkSOaTDWQPjrmJCyMRIE2U2jg555q2Ch6uxFnK2TiYR20TB09Lerja3P2Aay7qsvEwVy4Y9fCcUtnkKy31NVUaZ+5Kzg3ttmPU8uaFBwcHH7zwpjZx7Jg2YV5R8eEDV148vScW23P6xSsHpspvHhw8vHeDvLvu8488lVj75COfr9stb9h7SFCy+v3IM6985K8YI7iq6J1f/6NUmTW0ra9j+QNrW1vXPrC8o2/b0CxcRgEO2HkrYfKjgBTBovqBa+xyBXCQHw/GHJKShrppg10sH25XZV5JK9wH6eNp5Tj3gSpv1/cF6GgLtHDCzoRhbwgN2X3UxsPSci4pgIselctwH6RgDw8LzwUlDwUOhUsabkN5BFdlLqkJriJRHiSN+mFHokeWexIdiUNf+tIhcSl+J8x755avWbM83jt/fq/6UG9/f28cr0VlQpEKOw4/+s0VK7756OGOxGG67tIluu7wYW380iVt/HBi6tm55a/u3v0qdHHmppvO9Orfcf0eTCc/sz5Ia/WkmYSARzpJL8xtoSGBgLp8BrUh9eCkgJo4nLLDZw/xuAJOOSyCRHPQKDA8dQSpCz5BPrlufP/AwP7xdeZ53l2rQ6HVd82bt2d1a+vqPfcr+CcQTUmBoKHKAe2DOC3mm2lRXHs/kaDF8dSWhPZ+3EKyO8GzSqD5vOzueGg/AT0JBPuks6Gx9kH6X6E1LeKbE9BluioB/aP0xX2EObtJE8yU+FGaNvHZ7CQBjcD8QlnzpVjLXAu7LClX4Qc5Mnd9f8AcSqB//VwO6MfTNjBr1kCbxzyrz1iqtNe1tUVOpyQ5nUXaWiIo1FLYMbK13ZxC+9aRjkJtgotlN4TztRO8os3MmyHxvDQjj/6O6TlDPlTg6DN7JOMIJdnByy4o5FFz7HKAC/rKSlxy0OehLhuVQlHZwkmhSElUIm3rF9TVLVjfpsU0RYtRMkliWgyWL8nKNEmhaDKo+sGm5zZejN07T52MXXTWuVx1zosxjs67N3Zx43ObRIL9hNctqENdA2tDFcZMWobpk/QLQJ33JZWYEoN/SlK7D6j2C0kmo9mcLIS4GB0auo9Ni6037o3YFoArC9wuC8mtkbBfdsrSzXJHQ0VFQ4d8LWaWLL8rsV2L2UpKbJakrSRNcCYWgk9SmTpCEkvfwEopVvV3CmHjUJAfQFcIIC9moBUBwoKa+lZiipEj2jnxZxNwhkrKNTiL5No5ukhQUPMy7X4V5mI1JU4esIdddlIR9bXoFK1QawJGBKQC/YnYHy7XVUquCgS+D4EGfvbS+5eIsdfSJOx1J9mHq1JWQ5k8KaIowxtoE5dPkXB7KRg25lMU9S5ahvqNR3kfYVougDoAbSKKwgfVQrBJ9HklJr0sloUNy2v+o0aWa2yR+C2fH7lHu6qlUr997tDi6vaRSHHNskb9uach3OCp5IKVAXdjQ9PcBcEbNi4dmlNZ3dQebZ5RGXQ3NDTPXdAAddV/NyvPqA+1R1pKApVzFoUrB+/7H6+89e7/5efL0NtyrGiLrGz3LD3yg9+nqEiF/SN7b7kJfs/r1Z8vmNvU0OgOVKr/Xsl6U7srQ4vnVAZKWiLtofoZ+k25hgvqlZsbGtzByhnN0fam6so5Q0s3Lrz9vffeevnpLyyEtTT3ltmSsKl2ke3pNbAZcT+wJBEosnWnCrMlG0kCys4Mk5l6N2zKQCBFg9FoOMNy5jOnKTmhltGDhSwe29aLLK8RZP7ebWOLY+vG9y1cuG98HUfMkhr7VNVEoviW7FttSpHV+5b4FLxvPsez9inqkGy5UodWkh/NyiC1UdMsCjEzySJ5JJqjBqzE63E70n+++co9G//51H2og+879c8b9fLK4aJVdx87/tDWnonk3b84lUic+sXdxnmgaraDLx5emV1dL99z5eailXeNHT+0a5B7JqsFO0/JC2Osff+l0fIgNj7riH/CKaryGYfNKUB54AQAVVl1ObfIsOvsGQJhEs9vyDe7Ie8o3q0HIQJaVg7r+idkz5CenUuaOoMjZklNBtwcQbNdg2+BxHY9svJPFAQOJX9a+ciumNKwaHM7t7J986IGjukrQTGbpliJeQiCgt/ppPYoawN/2A/dpj2KDbELui1rL1xgYdcgt8jgXIGikXV9Q53UQeVKigtvZ4uf/nLtoN8/WKvlb/7xllmLA/SYqlxVD/HF779/O9pdeABl731rL/xbemrJwb8cpK3f0kp5N/2jrlPAY1EYzcK3hL+Nrh94VSir4WO5rPnB3QFjwELoZfXMBCy5qjAfjIxIE9JZrJ1Hg+iG0ag0kR6J846rE5Il/W4c7EC8UnhHHOpbyAgI8rN67xScGRdFx20CnqZH+LPx9LuShU9CM/4su9J/Q1+PKFyUCW6aa5bTKPys3WdnktdwQzhYsqhof4KWvrhrug08dPh/HdDeg5nu+f5DN2QbwBuf/uBLXunXjRe1lPb8f59uMR+l1ncu9isaoXVzv/3qh/dl2+aP0rI3/2HWAabvcLBs/YrB65R1qah7m4wcwd00OQc1oAR6i5KlRy7s3HnhyFI0lju2HFux4tiWDoGgJhPAjgPLZu+OHzy8YsXDP9ihHaF7lx/f0dOz4/hyLT+tZNFKJXAurs/H+i21UWpBfhVopET3YARJIMeo+OaFhwYHH4IVSsEKpcwrKh47TesPpoq33x7bM/7iFV42CgdPa68dtJKPbGH0dlW5fbvw/kHttdMHr7w4Dt5E+CCtN8q3b8chi7qdDLrDRsqJlzSQiLFWYbm1zAW6F+jaa5HsWLJTvGdvomiSNfE+2GrZZ0edIOlmI+iWNeMLFoyvQfd64IFI5/3zKUnB/fn3d0YeGJgEe4UPzJy3cLgJCN2iQKWm4YXzZvIBCUgariPwpzQ3ptyyLMK6y7Lwx8bmCVLTDBoNru1yc40uIymstKHvCvTxusDz4WQ7Qg8K9IY6D3tE/38C4YJpemCansQmuobUcQsoZsthPmMvsdrgQQOrTLUB+34kTkf4kXimNfXTp+Pa0/yK+PTfzNN7oeCFSxRrW4Cvzmpn4/Ss3lYdiaefpivi2gpoxxNeUiUVbtsZ//vsyNUURU3IDsxKQOyq6+Lct7SEkKBnVEXhxuM8SHEor49z48BXnKIluG/FdYzGtBHYXKAzoyM5LCnKhN6BeEZLSKyHiQRrLJ5RWNsR4KWz0oQuW9hIYAoj6XcVQzzw/y8jZPiz6RGjjUWCebE2XJTib0nwzBRB/HczUgZlDplmm8xkHuh1pkmrq4dH9jW9tXpqqj8pkLFaLPcsOzba3TV6dDilbLswtmzZ2IVtTc2zRg8eHfrcj05ssofXoQuyLqygxzVw/86VFYtGlo2NdnWNji0TlK4tR5fjFbbC1nk9m/prlx5+TnVgG2wbQy9t9uLt83z4G1jX5KPp2MbO67GNXK/z02MbzLH2eZm3/SmQjZOfBdk48p9rbx56/vbbnx+6ee1/Xo9oUJJ7h/uMmAan3LFl1Ug8PrJqyx3TsQykdTfxwSK6UCFJstMPygNEUTDqR5ILIu25gAVdQE5/eTmhnaBbEy/TMZFop+I/0fbQsZcT6b+P001w+yWFLoEK2gkoCeSlBN3Kbsa0x+M/UV5KPBant8Kzl7FRam6mJ22PzvsK6NILpBC0RwVyn1OmOrCRZwH2t6AXgkyX+pG2s9ztrhDO8u70H9UObjP3o/TNinpSe9lmozuA6egj5X0+X1+F8HT6CrdZ7VBPshrcZu0lm9Np077CdJVi2E5O3UKd8hFNI+o6fCKHkgTywDtP33bb0+88YJ6Hj27t7t56dNg8RzcOzp49uDFqnK0EK6mZZjwrpUl2EzxzY1mN2JmQfBgvyNaM/C0CmtctJB/QPjFR3I877MaZY8KZI1PfafJJd6ZKFoVm7qjk+jKeqW6ucBzuJeoKdGZRejmAjkCXKPw30xsQRgZl8VfuCHcE60K/Itww9APiP0BwIGfBHlAk5triYcgqHshV1OtWkwtMYlMi1H+PcMXPQi3xw2fhCf/hnBYHitqw7DT0C9h/oP2UjB4DeYfIOK6ch58m8HqpERagbYFmKks26pReKSwptCAHXiPIgxa4fAWGpaB+tBCr9WcT539mtXIFheAPF5vcWhwMeAtf4c+kE34eNFaBz/rTn1p9BabcknDOdjIHfPE+lPWmRY6GEW5X1K67GuBxM28cac8ioaMuh6lXomUuCp54AM7RQJDPkKmEKJNAdOM8DUx4n0pBJU8w+eXrHmnhXqwaCtYNRmo8VWq72LBgdYuqiN+rdmrz2xvo9531anf3rLWzu3aaAsf7LQTyKcPBBAXNaaKkQWfg85Y1/Y0idOipiQzODg5Bh3NWdvvgR6G3hnbordozW717Vneia7Z21lyX/q5SXzOTP7rs9pN28F2WZ+ODgaBNZFGIHiHK4IXreNFvRDJAQOO5FFYDrSe7RTEZqevOOcWLbtl585DNHehM7LxtuNhXi/dNjAqxpboF6ybOIZxDyczYzBQQR741vQvsTrA9TWas9RUP37Yz0Rlw24Zu3nnLouI5d3bhfVWB1uHs3mDBBWAv9T0rMGtagR4pWyyGBeVn2aoB0gp7PkwSZBvZAzbC2MdbrrSJD3p4F20LyjryK0eALISo7BHpNAyYlrpkXVrKFgxJSHKTKGJoqocHCndBN7SHj8o2Hq3ej9VT/P8M7HjgsZW1HY0zC+lpv/ZVK/zR7f600rLqhvYGj1VdavU0tN+win7DmpdnVb3s+89+uh0ral/182ZF7hm9ovbkysce2BGgSwpnNnZoM6e65yl7oH0XH4BF/QlaTVWWH9+7trr19rv3d2nKgwdiX+jr+0LsgCpG1nzuzm3B4LY7P7cmwin6bf2bkkw1LpVdraV67d7jy7v23317alNWr1O3df40Yn9Im4gILNDlhM+kQB+ypU6ZBmf6cwFeYGa74aJyb/aNDs3KUJQya2i0b3DEvBxRX82lJInoXis7fiZvvPvwoEnWg4fv3ihHTifM68TpSYOSzR7oYrDxmbgz9TyRXpBeAH1RQ+rJputxeJ4NPRKlNir2GNadLmm8QclHXR6QPlHUv2U1FOiRPXQGqQRKOcpwQhcNMDkl5iL0f0Asuzke1Ba4K7lF7koEjOCSOy/3zh9u9dY8dJ6W5buayqMtmt1dIPFaaXlDQ3Nl+44m+oek+uNDjVy7dm/jwPc2BZcE6AGLMxCVeSUXvNdiCNhXuumFYPy3wXgzIlOVbm5Qjgacli/SMl4qcNM/t0TLm1z5mjO/pFCSZ2rV5y+pLzYe4ubS+xsHhmYU0gM13pbh/l6ZZHAAtA3qGSaOnOlr4wK1zDb0MZ97OsKfC++LrYcu/90KZc/L2lunt7/w1NimiLLysctfXHpwdfOtT7/z4IPvPH1r8+oD6fuWj/3Ltm3/MrbcPPNLmr/9G+3q8dO04uU9kU1jT72w/b9R6T/+sWX257/yD2uwGTZf88SX93F52e3grPtPnMJw70ag2VUfac2zG0w6MGM4l2pzxKwlAxKmlGyAL6+43FMLwqq01lNenAd3Jx5nkRMzggJnMZl9BWcLyYUJ8ezs7O1rbygoaGjv6+0oYwBjLKehdm9u34yuzT0qAS3eQsLMz0PtaU4TnD5UqG2RqQmVOR12dOqYY8fQ2jQGqInJPRzoaR6tGaky1NAQqpQoeGRQR7GwkDeqe7DBMlEO0IKKUuwr8c4Py3J4vrfEVzzBIuK6Awzcm4kBwDgHSJzsypEjCCl+nFhBIGC6jMndndzds9w6Tc6MDH6c2EmcjgT2LsoSQalXc9QiF86VSeKiaXIIuvhYuTQyuGhvYJqMSk/mdieQHLGly10DY5DAvvWRKPNIUb9HZZcoB5lh9LeiiNk5DGj7cX6FOw/eteZX1POK5kfZarqo5jnHblePGwkNuvnJwopoEmQ3wXNaybXc+azsBp1GTZynBHysYCYLI8hAMcM4D8FHpjpVukIsMsTMzGtXrqC9RFksmSeYSIIxQhiK8thmDFBKzAi7pvxRfAzrs1QLjHyyCBUS7MTJkxwGkUzMyVhb03sgxo8yz8DBBhOWKRjNDFGB2pP6/BFySSuqgnA1WvQIy2E5DQ81RTVN6yyfstKI+/7NjA4H2PvOkNPHJx/8y+vfuae//57vvP6XB7PLd7727IkdXV07Tjz72p27f2mWfxnCTbGS6+vr5WuE1dqd3Vovi2whCcezRTGwpip0JQqzXAmB2MCVEEkhuBJ+hFFgnBiHBGIwPIqrIGwzeKeOVOtoZxYv67Cny8A6BaVzy9EVK45u6VRM0FPJwjkVfII18AFW0BTDdkSfJQZyfR6ZBXKuEzz11jKmsJn2Ddm9Ft9sGvTreRjhtqifwRY+FBdRvwWZAlywVhclthZXgcMiWSylheVtNltrud1tVcX89pWjHahDLdpdVkdBWaOdj/lirV6L9hDvaRsQtsL+C5a/iDBfSmOUcimFcofabxmYheq9qnoh3NKS5fUdvvkldkT7+UntEohA7Ycw9ryM3TvdY61HvDbaFqWREDKsRJFlcZWlYNTFIx2iJ+iSgijEm2nUlc3XxCEkHcBkjlQMTyJs6M/PJ86NTTIPFNhkGK4oXLbEzyW0ToObY25sBkVsFpB+PUnGziXOa/8E5AsNsUyHFWVP/HxCez3DxlN2u2hkU8lgFdaBhm1hqAECI1T8jPOQvhJXR7SvxKljIvmZpsQ3xtUVdFdce+/kZ5kcI19zfi1gG94Nvsjfk++SF3M9EiZrBUPOGtcfgZqhOhJMI0OXxrnoW851DlqXi7Hw12Eu070XVCKOKm+VA/VKoDPc1jU0B+99LOyGEhPqhTqHWpcd3drF2iJ6l5tARE/mAn65NW7Luc4FBHN9GtR1LYNdbeHOAKo8Y9TrwtOgu2x08MoB7InV69p6dFnLos4QtMV74nWw4PVAoXYdmDj5KeowncUxPWEDjRUj/aYVCUa/6ACJ40LUgfkAUpSGJEOV6fFGyT6lxZxSmKk2ZmfNna0DDiHti+u5l6pvSDjramzufHWx94vaILgr/jM4AJGpPWZwJcCTVFBQT7KMKkHxhHWEIbSe7uP+d3XVNaenJpgHPXzRSxuUM8JlcxYa0fWUkkokONTdqBA5FhPIzk/yghc+mzSBJx4hHaSHzPuk/CTJXvYpkpOmG7amveqrrt70qROTci1klZgmr6Q+LH3qpCQT32S6qZ50sdgwzK6aMtWkZ8JkpR9lwsao/GW7aVbaaVskioEn1ki2sGwir12utONCTxITnZ9k+4ZXfAYaYkSpdLZay2ekY3ghwFgwIBwTZlSUpVkakEbMuADHSJNX8DqFaWwZuJ1T+Fh0fXl+HssZUsCOYvEKaSoHb7pWyck5c4Bt4cw67HBQ4+w3yn7j2jwcTl84U4cZn3ZZNwLZnw6FWeC4Coc09QCjyGgpssgXy1aSzGagykV8wkw4/SvzD+05FPcTiK9lxa4qgTo/IaJpyl2gzU+EdKbJwL7e3k+GWqZLobxrJai/LYZdTmC9cbU9wD2zMNKCOoypPYuJx/FUclF7Hm/P4+xoXTpl0cwO5gLXwKCUyGXt5BOXUmdojEPVllTPqCe1JGbKgJclZuxnWBUKKncSDE+6+YmkQNTLtBc8LqL18WfShNusXdQu8/BUmfIbCJlB7AYtZOd82dHKZPledsyEoGxPw7KUyY67msSdJAH3RAyHm2Kbp6DpLJGpJAYd8Y3Bc6jJJzN4clYMauXfznL0w15SSQ8EsqROIYMqcLUhtt1Chi/Mc45qESoxjE9LtKkwvrllyvT9FEl2N3i+XuYrR7Wr7yTn43x/FX1yWnj/yoFplMVowU/80mXpMqx6Aay2S8dIMDObQ1soj8N8ZxY4Apvzb7hq72rv0ZK49mW6i1fi2leYJcRf1r4ch6m9F08rcbqT7oxr7w4fxVChHvjDkGHO8ogO7V3tXVYZ2mB3YBDxftYddcSfiNNdep+J7E6wU1XJXR5i0HsF2NvvwAwrgJqCwIld0+mdlgnyzNqoPVArzxSkaKQ2mkf9aI67qCQGJZeHuuwW5NigPU9wZXhgIvABJ9J8ms+JH3ygprS/an9VUx8of0e7xrUfa0neW95S/qMfauevCP7kEyMDh/t/pfW89ZbW8yuwu/EDwicpZHiEG90NfxNzdt911+4fdA7Z6VztUgmlHjp4JX7xzEjJbLewcmTNmpH0n2mfdhEOaH4pC9/UaTYE+4fxh9ZCWuay0UKKmYCBYA9toDRrs1Aj+GFaOshso5ShE0GGSvtzrDiBPEqrqPjWLbe8paW0Nx99VHtTS729cePbVKRVXFmu15xqWf/LfY3NzY37fil8dd8v1+tXWnMO1VvI0sPP7dx14fDSpYcv7Nr53OGlGsmNuCW+Fop9benSr8VCX9OU0NcS5vVt1xk6jG1NuZGrS4jDkPu8fq5Dtc+8Y9nJPgRtDAUzLpRMSVJSmfcjBLOsPxSIqst6TbdqlCxfGT3qPMwQ8Mt5VKYOu68CtQ/mdvBJtUh8Qy1iyVKY+iC+oXmYH87ylQzfatr4y0kVmQneiR5Ji2YdLv1s98MXHhhmy+PCeZwcRj0FWogpMLSZmMMRi7HzBEE/W1FB3qVjPKbwXtEu4/S4pJJO0iQ84ZNKKinElHQfNxlLJ3kYbiqZVFCqg8T2q5eoku49z18E+vujiRMg/SVBk6DOxuwXD62meRTxr6Ddwzv1tKGoPZjHMWuzmoYceXxbICj6bVCTWprq6lRYSr5IrvlFdbO3RFNKvM3VsNACuUaYAvFwb3BvqB6OeAJav9Yv+zjC/+qGx1dsQVbo2rppY2RUPZdfO6fdoyVpzNM+pzafG4uh0E+zRDWYkXac3kHvSK9e8mD/b37Tcd/88kmSiZ0zGxktyA4ykCv1o3LZ1AX46T6wF4F0QBjBwebjLEUPXmw1jGm4tEzL1S5Q/1RgljtbtWXfpxWrLF/WXk89v0p76jWh4LXUM6YU4GOmgp2WKo7Jt2YZDCjRoaAuncQXcdA4NhsFspxBiZyBr4QV9TzyAcY+FrLIXJbkk7PK6N/CxHy0ic9JO5SoD1mHYoK1jKmH1ExDlDnzp/nNRuHXmAV9Jn1+kpynnK+70T2VQuhu7PZR7rwfcRIcswh7m4rpuYQpaGWO3jwEJFhweDnBG+qrFTNpiBNKbV/IK2iaqOC7SAE37rk7MMHGQmNG/gHb03rwCe6dlg8QCFKRl+x0KpMN5+/Sv8QQtUcdUWqQKXPtuz/hiiVisrxziwTXzTSAWdMUsxsw0AIaUrdLMNHzWGqzdkl7/8g1XjG3tnJmy1p3Q2tolbth4rEfaO5T3zwmRnJXIfuorXG4GryLnNUeZ0G+k55Y/vPd6FmIjFg0BXNJP3cb7TlEnRNiJK1wV8wl087lN9dVzKmrSNIrauSUdnEhnY9d6szxESVOz+98V47OsM5c5HQWuG0ep7Z11Rr0ZvR8qKcMn6Rdf6MuGAjquZ2wFPXUHprpAIvILunoCINUXFRHS5opeiWuElki9b//3vhdZbNK7LPK7hp/9vezZ1PfM3Wxetf7VrG0wkYP2BwlxfDtLhWt77saYnXPUC8iovu3/9C/dPbspf4fbt8Pdufs/m9859kN9HgX5ylxYCub9qCttKSa69Lu2PDsd77Rr71OKF0F410lvcbeANSRTIsZlzacIp3sMZoSEZ/KG9gwelOHN3rDkkU9DVJppbWwyJbPqVXuJp9zknSPjg1zb3L5tqJCa6X0WseabesX5kkNvYsX3xD1VpfytaHOcJ3k9DW5J14T64fHRruts8KdoVqhtJLoGRAsZ0D3WHuBL29BKe/0YZoyLiSjo5yiLxziw357yIG4Mn6LThoK+6gclHm/CAxa5rJTpwMpL6IH82iY2o2ii6GMlrdP/NvMVaHIpkBpS9XcusCmCBZbK1kxtGrmv504QckJ5W2qvK2cwOwR0HL/yM+Jqcve5mJcLKXQ3xaVqOSnRZ68ytZS1px/USUlRXpPdXPzPEWgaHr76uucroa6euPU16vQlsdX0f9DWYLJJNF8qx7nf8406MvJJG1NN9jzud9PEp+2s6ba5YSGdL+PErUm346dNFTXGNipYZ+jV8CiRAyqKnOy7F4WHRJ8iMBjRAg0kB7KlDErxOK0ktUHV4er8sVJ0OWTRMyvCq++50bYBVVBmUUJl1/THZr4Rai7Jp/DNzGCAxvuvHfevPt7NBgoT3runzfv3js3DAT1tzJSRP05TOefGm+sjx3csysU+tyeA7H6GxuJHifS41kSs6sNNJmNKvO+yAR0KrJQRAqcJZTnAjii16Bni4Lggsi+J8155zHboImsIBuxv1JgMxtfRIE8mnhkPJBFKHCieoKfy8OHJHzAs+Q+G0i8Uo/g6uGj+ssxLNsCm+G7pmv6989ZN9RqqUTEs2XRujld631rYj3xBeFyZ2Ooy+/vCjU6y8ML4j2x9jUDkXKHt7auwj2r1usojwysaW8b2XzrjRXFze2xmW9fQ1sKZ12aV9pQjjC5pjz59X27Gvqb3PyMfIGvaJrfEN3d8/UnqVLoqJhR4LTn59udBTMqHIX38naXuzC/uFCSCovzC90uO69pqx9Vtg5HbHlVwZbqV1MMeLlVsIq20rzfIR/ZGH7gzdhMTtB0JDtcjwdiOlGX/m1l2chTh/abfu3rz/Tvoh79bNHtOjCe4B/3Lf2mYDxkco8KxMHkXgAztfQFZkkbkvH2DL5fgOl1sqDQMwvvO3pmx55XTiVuHOb74+kLG0db1yqnnrl55djdo7fdOhesHgu54dD2vsSpV/bc/vPh9IU4379x8vDNz5xS1rbWRJesG52LmaXwUwh7WVB08Do9WQiGbPDlRLhTQE9KE5YrULKgJVlJeerH15PkgjfekP587VbhhlSz8K+p79GT3BnujJqI0ZPpIXoS58Nh7hzOp4/RVVbOXGh6Fl3IzuyccCYqMoUtTYFdJsRlqjjm35gX5kMLmCxTr6mY4Foq84qCEEsxTSRm7qQytYQkiACWP2fGFqfnzhkxYdHMkwNxkH34UTzAYSGYVoHROJZ0TfWInGE2U2IiQ/pLXJr+8g8WBCNzTjXOil5EP8zE6DxgsXeQBcCpxnrqkJxsZOBGQgy8C+pgpIevpnVTjjQFNtYxOzoF3Uns/bmUglg4ZQmGW2+6aTMLA+ODxlnVXruICWJc5kU73utNEx2GnUKKLUDvZqAWhosdtLVhdwoLgxfVDgwMzlqWCYlPkK5+FE46SJ3KoHhILhYjp2bKV6nSszwxTQ+BR+Zj4YHoCOaiCizyqR+ThmOlPj7OPaTuH49rz9NuC8OKdZdFYVkvCh0fV8bjtJt2M535qX8T/HeW9PqRv/kH6FB7Pj6u7uce+sjfhNHg8yk8iMN3vRaR0ZwcDPwfBKaSMWT9/xDgQyxSp4eEOjHDJvPGV+ZtMJbvrxvd9RQEtSWTXTFJ9Jc9P2QvgE4S42XYeVS/TwvZ/bTCHJxzyCK60zOZYZQpK3mS5NbiFPONWHwdNff1VLzWCDpeyLLohuW+rJr9jOV3Zr9DUMTyNtqNdwlgFyqYCvZRMYM5RKIu9hYWZ+ZESE3UZWC5mdcOhPcpTWiT6s/Cq7u9NZ03Rn0LXMVlK6K9O5c1No3sHmgfKHaUdU8YzMmgW1ClzEVnkYLFcu+6zmi812sr6Cmwz1pyx9DAnpEmh7W3wNYGVf8/jZ2JyQB4nGNgZGBgYKoIDpfY8yOe3+YrAzcHAwjs/3uwAURfnfL4PYjmYACLczIwgSgAYH0K9wAAeJxjYGRg4GAAATjJyIAKmAACygAdAAAAeJxj1WJYxsEABV1AiAoakEgGRhibDcpGAGageDAQQgFjA2MDEwNTAxbTGqAkWBMjihwjsnpVNL1LgXg1YyjcHD5GFiYGBm4moE1APhtEEQAkvQ0iAAAAFgBmAHQAyAEiAXoCIAJGArADKgOKA/QEOARaBIAFJgU8BbYGDAZoBtIHEAcoB0AHWgewB+gIRAieCLoI0Aj0CRAJOAlWCXAJignoCoYKzgsGC14LtAvKC+AMAgxEDMYNPg4UDnoPFA9wD+YQOhDQETgRfhGwEgYSKBJcEroTGhOKFJIVABV2FeIWUhacFuwXKheiGBQYhBkIGUYZaBnEGiQakBsOG8AcGBxeHPodTh12HgIePB54HoYepB7+H0gfvh/4IDIgwCEceJxjYGRgYEhlOMEgxAACjGCSC4hTGCNBTAAlCgIKAAB4nLVUT4sbNxR/XjvZLWmWEijkqEMpm8WME3chNDktSXPKXjZhIZeCPCPPiIxHQtJkmNJDjzn0Y/QS6KcoLfTYcz9Bzz312PeeNPZu7IZtoR5G89PT+/t7TwaAu6PPYQTx9wW+EY/gDu4i3oN9+CrhMcqfJzxB/HXCN+BjsAnfhE/g24T34Uv4PuED+BR+SfgWHMPvCd8e/TyaJHwIx3u/YpTR5CPcFXt/JjyCz8YXCe/B4fibhMcof5vwBPGPCd+Au+PfEr4JYvxHwvvgJgcJH8DxZPBzC15Ofkj49vjt5K+ED+HlwXc/vRPz+w9OxJnOnfFmGcQT46xxMmjTZOK0rsW5Lqvgxbnyyr1RRfZMLpzOxdnT53Nx6r0K/lyVbS3d9sG25EI5j57FPDt5GE/pMJ69UKVRQnshRXCyUCvpXguzFKFSl/IrnWktiXOzsrLRymc7k69CsI9ms67rstVwnqHNLPTWlE7aqp8tTRP8bGPuW2trrQpBB5l4ZVqxkr1ovcIkMDESi2BE7pQMaioK7W0t+6mQTSGs03iao4rCr/TCKrfSIaC7Rc9F1DpXDfnCAy+MG8CSIky3S7XOFG0epoKYR9sp2QwBdCO6SufVpcw6DKqbvG4LbNM6e9PUvTjS94RaLTCXjTp6+FC2rF7ophRO+YCdIlY3Ach87esxM3CkMUpQK2qB0xi1MF1TG1lcZU9GqpSjcgyGwrUNtg2iUFQm6VSqtlcZxWFs+qRODUGHyE+lFxpzzq7fbXgHAuZwHx7ACaIz0JCDAwMe3yUElD1B5PDO0ypRohE1kOHJKdT4CDhHWQkVnnneKfwq1H6Da4Gaz9BugXvyTTGe4j/LnO09a5IdWZXQoj+JmtexuI7OBefhU85UaYZ1PrxiO1hetnvB2RhcBepQVRLfwAwUKF1xlq9RRizRScW6u/gred8ig4N2jt8V7iXmpJmt7F8wTzwHlD6CGT4dPxn6e98+S3FmiHv2UrIfix56lC7ZG1U72xndc84WO6K5j2JtQb1/xTUJZqLHb8vcRSYiY4M2yQxX7VCD6lAwxX3BepY73rOE+KA4ljsTbfPkRaW9ZN+W+0o1Bz4jqwXnMXSi5orIasgrWnjugtuSLNc1TK/VVcv7Am1y3E+ZrzjzMe50Hef9CjRPYsc85bju5qxLlZJ2jtW0PHfFTu7JpmZ0hPr38EsTuki87PIec/iv3G68F+ypRJnjOQ7pTg2zuquCIfp2Xo8vzQBVEmsJHG+4BeQ/1lqgpOPKDd/KD82evDJVivti0hqrirjlm9WyJWU7dHPwQ5o13+R/ntH4z9ikzmy8DzdEJ5ZpfijfBTMde/s/3O2/ATLuOI4AAHicY2BmAIP/fgzlDJggFQApjwIteJzbwKDNsImRk0mbcRMXiNzO1ZobaqvKwKG9nTs12EFPBsTiifCw0JAEsXidzbXlhUEsPh0VGREeEItfTkKYjwPEEuDj4WRnAbEEwQDEEtowoSDAAMhi2M4IN5oJbjQz3GgWuNGscKPZ5CShRrPDjeaAG80JN3qTMCO79gYGBdfaTAkXAMQBKBoAAAA=') format('woff')`, 
+    },
+    icons: {
+      'DecreaseIndentLegacy': '\uE290',
+      'IncreaseIndentLegacy': '\uE291',
+      'InternetSharing': '\uE704',
+      'Brightness': '\uE706',
+      'MapPin': '\uE707',
+      'Airplane': '\uE709',
+      'Tablet': '\uE70A',
+      'QuickNote': '\uE70B',
+      'Video': '\uE714',
+      'People': '\uE716',
+      'Phone': '\uE717',
+      'Pin': '\uE718',
+      'Shop': '\uE719',
+      'Stop': '\uE71A',
+      'Link': '\uE71B',
+      'Zoom': '\uE71E',
+      'ZoomOut': '\uE71F',
+      'Microphone': '\uE720',
+      'Camera': '\uE722',
+      'Attach': '\uE723',
+      'Send': '\uE724',
+      'FavoriteList': '\uE728',
+      'PageSolid': '\uE729',
+      'Forward': '\uE72A',
+      'Back': '\uE72B',
+      'Refresh': '\uE72C',
+      'Lock': '\uE72E',
+      'EMI': '\uE731',
+      'MiniLink': '\uE732',
+      'Blocked': '\uE733',
+      'ReadingMode': '\uE736',
+      'Favicon': '\uE737',
+      'Remove': '\uE738',
+      'Checkbox': '\uE739',
+      'CheckboxComposite': '\uE73A',
+      'CheckboxIndeterminate': '\uE73C',
+      'CheckboxCompositeReversed': '\uE73D',
+      'BackToWindow': '\uE73F',
+      'FullScreen': '\uE740',
+      'Print': '\uE749',
+      'Up': '\uE74A',
+      'Down': '\uE74B',
+      'Save': '\uE74E',
+      'Cloud': '\uE753',
+      'CommandPrompt': '\uE756',
+      'Sad': '\uE757',
+      'SIPMove': '\uE759',
+      'EraseTool': '\uE75C',
+      'GripperTool': '\uE75E',
+      'Dialpad': '\uE75F',
+      'PageLeft': '\uE760',
+      'PageRight': '\uE761',
+      'MultiSelect': '\uE762',
+      'Play': '\uE768',
+      'Pause': '\uE769',
+      'Emoji2': '\uE76E',
+      'GripperBarHorizontal': '\uE76F',
+      'System': '\uE770',
+      'Personalize': '\uE771',
+      'SearchAndApps': '\uE773',
+      'Globe': '\uE774',
+      'ContactInfo': '\uE779',
+      'Unpin': '\uE77A',
+      'Contact': '\uE77B',
+      'Memo': '\uE77C',
+      'Paste': '\uE77F',
+      'WindowsLogo': '\uE782',
+      'Error': '\uE783',
+      'GripperBarVertical': '\uE784',
+      'Unlock': '\uE785',
+      'Megaphone': '\uE789',
+      'AutoEnhanceOn': '\uE78D',
+      'AutoEnhanceOff': '\uE78E',
+      'Color': '\uE790',
+      'SaveAs': '\uE792',
+      'Light': '\uE793',
+      'Filters': '\uE795',
+      'AspectRatio': '\uE799',
+      'Contrast': '\uE7A1',
+      'Redo': '\uE7A6',
+      'PhotoCollection': '\uE7AA',
+      'Album': '\uE7AB',
+      'Rotate': '\uE7AD',
+      'PanoIndicator': '\uE7B0',
+      'RedEye': '\uE7B3',
+      'ThumbnailView': '\uE7B6',
+      'Package': '\uE7B8',
+      'Warning': '\uE7BA',
+      'Financial': '\uE7BB',
+      'Education': '\uE7BE',
+      'ShoppingCart': '\uE7BF',
+      'Train': '\uE7C0',
+      'Move': '\uE7C2',
+      'TouchPointer': '\uE7C9',
+      'Merge': '\uE7D5',
+      'TurnRight': '\uE7DB',
+      'Ferry': '\uE7E3',
+      'Highlight': '\uE7E6',
+      'Tab': '\uE7E9',
+      'Admin': '\uE7EF'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-0.ts b/packages/icons/src/fabric-icons-0.ts
new file mode 100644
index 0000000000000..1f4c02ba444c4
--- /dev/null
+++ b/packages/icons/src/fabric-icons-0.ts
@@ -0,0 +1,121 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-0"`,
+      src: `url('${baseUrl}fabric-icons-0-8a1666a2.woff') format('woff')`, 
+    },
+    icons: {
+      'DecreaseIndentLegacy': '\uE290',
+      'IncreaseIndentLegacy': '\uE291',
+      'InternetSharing': '\uE704',
+      'Brightness': '\uE706',
+      'MapPin': '\uE707',
+      'Airplane': '\uE709',
+      'Tablet': '\uE70A',
+      'QuickNote': '\uE70B',
+      'Video': '\uE714',
+      'People': '\uE716',
+      'Phone': '\uE717',
+      'Pin': '\uE718',
+      'Shop': '\uE719',
+      'Stop': '\uE71A',
+      'Link': '\uE71B',
+      'Zoom': '\uE71E',
+      'ZoomOut': '\uE71F',
+      'Microphone': '\uE720',
+      'Camera': '\uE722',
+      'Attach': '\uE723',
+      'Send': '\uE724',
+      'FavoriteList': '\uE728',
+      'PageSolid': '\uE729',
+      'Forward': '\uE72A',
+      'Back': '\uE72B',
+      'Refresh': '\uE72C',
+      'Lock': '\uE72E',
+      'EMI': '\uE731',
+      'MiniLink': '\uE732',
+      'Blocked': '\uE733',
+      'ReadingMode': '\uE736',
+      'Favicon': '\uE737',
+      'Remove': '\uE738',
+      'Checkbox': '\uE739',
+      'CheckboxComposite': '\uE73A',
+      'CheckboxIndeterminate': '\uE73C',
+      'CheckboxCompositeReversed': '\uE73D',
+      'BackToWindow': '\uE73F',
+      'FullScreen': '\uE740',
+      'Print': '\uE749',
+      'Up': '\uE74A',
+      'Down': '\uE74B',
+      'Save': '\uE74E',
+      'Cloud': '\uE753',
+      'CommandPrompt': '\uE756',
+      'Sad': '\uE757',
+      'SIPMove': '\uE759',
+      'EraseTool': '\uE75C',
+      'GripperTool': '\uE75E',
+      'Dialpad': '\uE75F',
+      'PageLeft': '\uE760',
+      'PageRight': '\uE761',
+      'MultiSelect': '\uE762',
+      'Play': '\uE768',
+      'Pause': '\uE769',
+      'Emoji2': '\uE76E',
+      'GripperBarHorizontal': '\uE76F',
+      'System': '\uE770',
+      'Personalize': '\uE771',
+      'SearchAndApps': '\uE773',
+      'Globe': '\uE774',
+      'ContactInfo': '\uE779',
+      'Unpin': '\uE77A',
+      'Contact': '\uE77B',
+      'Memo': '\uE77C',
+      'Paste': '\uE77F',
+      'WindowsLogo': '\uE782',
+      'Error': '\uE783',
+      'GripperBarVertical': '\uE784',
+      'Unlock': '\uE785',
+      'Megaphone': '\uE789',
+      'AutoEnhanceOn': '\uE78D',
+      'AutoEnhanceOff': '\uE78E',
+      'Color': '\uE790',
+      'SaveAs': '\uE792',
+      'Light': '\uE793',
+      'Filters': '\uE795',
+      'AspectRatio': '\uE799',
+      'Contrast': '\uE7A1',
+      'Redo': '\uE7A6',
+      'PhotoCollection': '\uE7AA',
+      'Album': '\uE7AB',
+      'Rotate': '\uE7AD',
+      'PanoIndicator': '\uE7B0',
+      'RedEye': '\uE7B3',
+      'ThumbnailView': '\uE7B6',
+      'Package': '\uE7B8',
+      'Warning': '\uE7BA',
+      'Financial': '\uE7BB',
+      'Education': '\uE7BE',
+      'ShoppingCart': '\uE7BF',
+      'Train': '\uE7C0',
+      'Move': '\uE7C2',
+      'TouchPointer': '\uE7C9',
+      'Merge': '\uE7D5',
+      'TurnRight': '\uE7DB',
+      'Ferry': '\uE7E3',
+      'Highlight': '\uE7E6',
+      'Tab': '\uE7E9',
+      'Admin': '\uE7EF'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-1-inline.ts b/packages/icons/src/fabric-icons-1-inline.ts
new file mode 100644
index 0000000000000..9bb6048c3a35e
--- /dev/null
+++ b/packages/icons/src/fabric-icons-1-inline.ts
@@ -0,0 +1,121 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-1"`,
+      src: `url('data:application/octet-stream;base64,d09GRgABAAAAAC74AA4AAAAAVlQAAnhTAAAAAAAAAAAAAAAAAAAAAAAAAABPUy8yAAABRAAAAEgAAABgMjpwVmNtYXAAAAGMAAABMAAAAuKm1ZN9Y3Z0IAAAArwAAAAgAAAAKgnZCa9mcGdtAAAC3AAAAPAAAAFZ/J7mjmdhc3AAAAPMAAAADAAAAAwACAAbZ2x5ZgAAA9gAACTkAABDiCAiAeZoZWFkAAAovAAAADUAAAA2/LNqvmhoZWEAACj0AAAAGwAAACQQAggCaG10eAAAKRAAAABhAAAAziFkFd1sb2NhAAApdAAAAMwAAADMBIcVlm1heHAAACpAAAAAHgAAACAA6gK4bmFtZQAAKmAAAAP2AAAJ+o2Z8E5wb3N0AAAuWAAAABQAAAAg/1EA3HByZXAAAC5sAAAAiQAAANN4vfIOeJxjYGH/wTiBgZWBgXUWqzEDA6M0hGa+yJDGJMTBysrFyMQIBgxAIMCAAL7BCgoMDs+/vFThAPMhJANYHQuEp8DAAAAQXQkseJzN0E0rRAEUBuBzxxgRBhnvVTNlMmXjN2jKAhsLxMpnSvkuSyQfv4AkRZKV2FpIMlHIDgmRSLrvQSGmSLquO6XmD8ip95ze1VNHRFIkkaAYzhbj0mmG271GzLndEpVUKbXiFHqZxlzmM8ACBhlimBGWcIrTnOEs57jIZa5yjevcZIw73OUeD3jEY57wjOe84g1vecd7vvCdn/yiraKGejRDszRHCzWsEdsWsd5czcfsJK3Y0SZ/tQUuccXVNrjFbVfb56GrnTraBa9dzXK01yQtXTPVrwEN/Whmkekx/bDxgSezGnE8w8IjHqCYwDjGMIoRDGMIgxhAP/rQix50YR6daEcH2tDqpgXNaEIjGlCPOtSiBnkQ+FGFSlSgHFGUJT78d2P4/tb7j/MN4ZK5CHicY9BiCGUoYGhgWMXIwNjA7MB4gMEBiwgQAACqHAeVeJxdj79Ow0AMxnMktIQnQDohnXUqQ5WInemGSyTUJSUM56WA1Eqk74CUhcUDz+JuGfNiCMwR/i62v8/6fL9zp/nJfHacpUcqKVacN+Gg1AsO6u2Z/fkhT+82ZWFM1XlW92XBagmia04X9U2waMjQ9ZZMbR4ftpwtYpfFjvDScNKGTuptAHaov8cd4lU8ksUjhBLfT/F9jEv6tSxWhtOLJqwD916z86gBTMVjE3j0GhB/yKQ/dWcT42w5ZdvATnOCRJ/KAvdEmoT7S49/9aCS/4b7bci/q0H1Tdz0FvSHYcGCsKGXZ9tQCRpg+Q6E/GTGAAEAAgAIAAr//wAPeJylfAl8HMW5Z1WfMzpGGs0ljaTR9IxmRod1jkajy9JIlmwd2JblC0s2tmMg2GCDCYbYHGnsYBtfCyYbSJaEPAubBdbmbRKSEId9ygXsJvxI4Me+bPTbF+8DsiFZeMnL2xckzbT2+6q7R6ORCC9Zi56urqqu46vv+H9fVUM4cokQ4fPi3YQnMiFxu2IPKXblEv8PyW9x30oNE/Hu2VNfENYR+MfBFbIQWSUSySfEAfWoXQnBK4qdEguZndZC81A8QyihIVmdVbUQnVYFdU7VpmmICPD+y/D+KugplxQQB4FqdjEk2kMeu4g92yncxQQ3lUqk1BTcExyZUzkiEo1I2347e+R3b/9WPP67J+dOPC8cNn6Ew8/PnYDRwz9ZhbFxMLocGKhCHUFXtIQG7bL6kcpPJVRVhRqzRKWEU1MqgXdUorJ3SkmcjMBomn2Cy2kTgoF6IdbSLTiau+FeD882yPfBs4+Dcg7KOSjnBHLve68+fSiROPT0q+/du5B+9759P3r+zI3x+I1nnv/Rvsz0+jO3rFx5y5n1xl1Wl76qp2fUpS/raUHNaIDdceoSIfMam0stGSBDZC3ZSiZgRvagnQ1Yqudjijl0yIzaYfxRBSdk5xV7tCXcTaPNPiq5lIVklOLK4jIHpHKqxFrCQUdMccmqKpdE60ra22NVxUnVGawvHfjUyjJV9bWsrhJJ1eoWH6y9SnNKy8pKcyifTqkpklJFoD2nzk55w6Ia9iZmIWOeJBOBgXiAE/LLGkOl9UEnp6xfx08BGyWwNWxXm0pBvaK6iNcbqSsy7xSYQyN48dDYFDQK6wtLS3gKv5JqISQK1NiEa+t2MVLYnVIwEI7ZGSFaWqMs38dFzXRzN8tX0vWQdIxaso2Hqu5OykM/1QM3tIS93nBsx0A13pEKeMfRh7lfYjK0ZfP6lZVrDk/uSLTtGAjD+Cwk7E0l8JVkwgsZ/FT1wI4YN4XpVAJf5Vl+cgqbw/yP2DOX4ERH7Zo2nuyYPLzmeG7npk+3p4g3jDKZycOfyMF/Mcf+NRyq64qNMK7L8gTJIy5CrFSOMD2h2OUItVspSwqEvzy+Edc1pW4cl+pA5lVcUXkiOTY+lpxGMeVDY+OpjXwI03oOtP0WyHodrK2F2EEPscZBzKnHSuMeYO236H66f/wt9S3x0rj2mPYYJKU6uh8Sb85MSBffTI5DNtR4U7o4A0Ii44AtoGRIhNSTFjJItpM7yDGgprucOiXZRoERIop+0wUI2KGTUpATxRWEmUTqaVAJFICoUGSflnqQMxuoCh/HVAbUwEeQsm4uuwJtaaAKKwGZ4zytMfmd8rGBigeuG7g7mOoK3j0A9wvIGV23nBkN0cHSNWH+dLlWTn+yx6IUpQa9jg+4UErFGsgz5j22Y3UVyhve1arVO4QXs2rQUvu+1BwWxWrWJRrzc7m1iYHB6x6oGBjr7+rq7+/CupSMnrmlCzothzWatjsdH1CSJJn94J2yVjiCv/OsR01dUmewOvIbjRV6G1dVlXoNewJ0t6AmLgIesQIh41YaiSsC2Iok/PFgSfiR5IvJF+lPuNCb4/oaahMWViqQ1IvzUI41tBg38pax2GRR2yLoQ9CDVAbb4nY5ZQn/goFIGP7qoTMfJ0QXpISTFViuqL2bxlvjrZXRZo/b4xYIMIu2X2gcHV137ty3p964cuGrx47uaBhw31v1zLvU/cVMoTr6L289G6fVGlHtVe4bHvg8rZ98Y+rb585JJDWtnR+n57mJg1NvsKx1o+3xm256eOCLGwKP/vOVXZnSNXT85btQt33oX1l+/8QNn8KOcUrApFRlNtgOclVOFFKNswMOi5kKvZxW05hCXfADF3UpMZg9+7WQj8D0MdVCcFFSTHuiOuYgP4nEhifMkdQ56CrNVSos/0va9z/7WdrzEkwMqnAvaX8Hj72pNUS3vYzWqIPAHIUClfUccHlRNwcUFHxckcvJ2TiBN7SQSW8epFaJCeScNvfu1YeGhh66+i6Vzp6lkvmkzZ5dXl+9dy8MmSz7gtHYUsVlppMw3xSoTaQl0WlZSipIDUh+G7OYQDcwkC4KlxKL2pmNdMqOGLOGJqFjVOEV1AWIgYCygHrA5BFV0Knm+vcpomMXJkfqnEX8vapZGNVfFV+aAXsFY1B5chBIfxAoypZlnkQqtLchax4hFNFU1paahIaxOAV58zBEWC+wmqLKENQSTJKFMcRl8QJgMYRsoPpuIofJWfI38OzjXcG0ZpLkzMcgtByvp7Elz7rawupuD8IGt6d1cX4IbWuGzlui/7LK5Y664WiZiuYV7eTGod69w1XpKahVw3t7hzaapWpZdLhOCaERbblhoDqkjLW0Prt797OtLWMZuTMXs7URT7DAbAUqcrHsKuJoydDWPS1mvYmnW5Xd9zw8ZNJx6OF7diutT0+Y5S17tg6VBLc3mc9N24N160e3bx9dX7co92yWGk6+Zw7THA1PsqqgYDGZJ4CZw8Cn9aSZtJIO0o3cikvP+BC40JMGNwqDNArSFXAbaof0H8NzcFkI9jgzE51YVSUDKyJimQVQv6JEkrFnjakAHVzpV4ohNw0Go6kSSao42qpVE1HhxDwBtK4DmrmZkhWKA4cP8Dqpsn/w2rFUih7TcSrqCgl5NwK8dzs5BNy3hIuVrGcq+8QmnGstZTKXTtkbu4V4JBiLeuLdPFN/FTQOshuQwBqjWeYjiuyqpvbGegFMODSixByKw0WzLaZYmm0g7+7jCj1et40pQMycI+mkze31FHJ9oYn24cKVoztb+Hdbdo522YfbJ2ZtPXucm8XZzc49PXfekvrZLTxQLs/hdhbQma9zNqfbkUfVJ7ifPcEvsZFLbCbpFZv71/XWpu7OLuZO1fau628We9WOXzVtaPf72zc0/aoDwNNgZyrVOTjX9MYbTfRfQ22rOmtEsaZzVVtIy1lPm7Q31uu2kSJmJMwLIxQsnouxhl1BL0xm+gaQGCwxOnMSLDr+E1Qo4EFvyjq2Br2JPmMpaSCrwNu4VbdDzCs0Vi1qrCJvyLop5/wnlWeUIQdwoK4YN6bULOW23pDfWJY8p5+zCHdvQWnA6QiWFhSUBh3OQGmBTGbA2M2AEUiSbD3JqdktzpHsvuiSVeTUzPahP/BFQNfKKL888L8V6RRFCByxUzAYNCEk1JSPQtEsVODh909CUepPZJn3onZAm/AmlWA9ZlUhkUxw/yjDGwAuCGed+5CzLsI+XhIDa9xcCWjGI3F5AGArAfKAdYMF9/Foy5R6PhgQbICgW4tWUDTW1AMW+cu09P3LdUeaX9H+r/Z3Vx7Wkv/7R4MIFn7U+cIv/iQcAx3QhaljX9be0+vRXNp75WEqYL2dl//4hfAz2gev7O9/8KVDfwQX5dDLDw1JoDlYghVfok6jGMbL+EnHgU0w3qgr6ND9GPA6g8AoUqbdEXiYe2L9Y+q+keoVg9t3bR9coRp3dLXQQVKrR/apj6mgM1li/aaTB3eNb7vxrsGpKUjuHB+HJNbD+npDpl4yMEwf+M+3kTOolxbQSzAD1WT7VUx/KabiwoSDIbEMFYYMjQzuAS86oHtoQXSrTb4XyGIcc1abTYMi8dzHwCBtDlluHhUTX5pOTqDTfOOV9x966P0rNxbWjHQOH9hzUyJx054Dp8Le2sFVvWs2NDVtWNO7arDWG95w+rv79n339AYLWbZjY1AffSycEpdIwDxBhz2BneMgGmFlqhqr4D/wZx1lgTIH+wHfH7vF7omOIY8xu5BLbMTDokuuCHMUXYqVKlR3DGIKLBGooSTgrDm4uD/M+sRN43Sl9sPxydQsJ0nM5gA67aHfT65ReQv9bHJyXPshlqs67uF0+8OzKJRTj2M5dGhnt3KskwhBqKyKaPjU1P9kzV/QJujFCwCMoVvUg/rFpYy2Jz+xbcDgHtlKPXJm4/NEm7gA46Mrx5e2TdRJmBoUTTIMoOM1Ph098zDcyvoImX0g5jfSIcT8cLHudEU+S0TQozxKMlPxKQT8BBUIDGeOCGDYKQwJLDYz+ZgGDYXoVFUzcX4QZGQVSCr4U+hKUXSN9YBDlAmuJIvZfjC6VYj2wbmSP4DF9zqS/7Trvft3f/PJB7c3N29/8Mlv7tbTm9an3rnnzScnJp588x7j/m2EvfpY9jsApjj4wvWbMt/R0/e/t+uBjLfYnVP196iOPRBHpddHpyFxxKKuEAyPxhDvK4bfpLjwJTANOHlMwNow/CMhQeAJ//HEpA2HHci6v5mLNhXjZrAKsl3hQsK0Nj0XAtJPTwshC5kJadPS9KwqhaZnppEn2bsYq7KxFa3TLakZEwD0kqakqNirMZ4AjYMih+bRWKvBtYe3bj28NogrhqKH4s8xv25WxTuFEZQngtA9LjdPrju9r6dn3+nr0sG1KVDN0jQNJZ/21hRyJ6czMYIFfXPoLxijERq0Y4RYkeGSoIKqtU3Q1y4CkcBZTAJzycBYF1lmCpmIQQYgf4JOyVNSAiUEudWewJCslECSMp9WZXYuc13M6DIGJxkqwWe01ED/FEOU7GI34G2QF87ITJexOfCw3ik9TpSWP8pEHBQKCMbspC58k+LeyY9mZWmS6RJo2JQ8bgfINlMgRJifJ/MWKqObnAtjbEHeAV5RUEex0TKkzbs7qQukwkZrgaWa47BSLAGuESuQ53nglllN5HD+PNEeQPZ+4PZHKP3bc6snt1H66IGWB4cpnZjsP/VNSr9wK39M07Qkzx3VOHDTtaNUO5rctevogda2ozuEwRV1R1tb9h3djpFv7jMw33yYbx7G3JCpYcYiwAauTvupJM8kadO4FqWvi5dVVfyG9hNVe2Ocvk5fz0/q/rChY3AVML5Qwlae/YlMqyBy4A39IkPtGRg5g1AoY7MqahFQYRLoEkoYSwioVkCngV5B3kP3gcETmtYluSw6CNrdijreIzzK3/5oEv7gzn7gERrIfExiFUOel+pEostv1MWb8oyrg3dgn49QeHWx1i9UbyLkJYkBcXVx/v/e65D12AKbn66ng+Dv1Jr0ZEOL6mkXCzhQg98zLxgejBjEjMFfpPQ80lRlNIeOdTVODXWOg0FHDooNtQ0IEaozc8K0QSojTchfO8Yo6qb09efHyGGsCIs0ov7Z8WVcbJ9It6N5sKYuEkV9iOpORwN2hAMoyRW0udXHMychZpobXcQtBNQdogRuKjmlowT+un8c135Au8e/2nz4yJ3bYpnOgTZtmGDQ8q94lDy+wYAP4P8CgJibesdQBqLkaf/UWhZ5MMGOoSeIgWHQTz8JM7CiZ8XC3KKVU5g5oBjVBEu8N/l48nHaLwzPToC6nJ4b1qblkxqZ/Ui09NNvatdp34N1usi4KL2PIU8bXhaL0qRRZStITOZzNxfXpciaHWZRsp7Fk+D3R0wvZqhH+1ftT/5opdPMCfdti9I+7XIH3U13d2iXtY4sT4rPdlk5wlWv3h413aU1RxTOkfone2PXqkozLzoxUMNzx7lLL6S6uB+9kBqfm/0kH1iPVamGfbQwveQxIp7AjFFHNBJKhzTAMAEPaoSfAH4MXbwI6w9CmoInRDYp4EMB7DDqAQ3+Lk6DFgZJoMCHhAPHFmrJKls7JgElrEmB4Qe8OIaRND0Gxy/i0bplOPQTeXMBwQo//Yt5Eoztn+VFkZiYwgFyXUVWkEZ9VjFdnhfJty7dMYWybRRQxEzFx4IutPGotGeY8gCi8ii0EkLEJMqxEJw0DOX9qIGYiDMdqDJB13QxV2ePXUhNc6ELzLbyQRNk6mv7DGiufczm5JBW0o6j5IM0SuVcDngbx9js7kYExOI3yLseyOvm47D4uRTw9/HNJ+iW4zRvw23nzwuz9vKqrkatx15dWZzv8LgKeS3BF3lKXPklldWF2omm1oDXSU+O3fCfnxVgHcGy/MMF2k+/pQ2ntlUn6jwrVlBrcYmtuWNla0S2RGJd7c0FxSBOdMUKa3F1dyP/JMCp+7VjzIbRBEnICXmKFJr7iyxULOGWkKR6w+DyhL2zCRGqhL1Jf/tg92C75veGGdIx7V+AJNj+pM7RsaVQ2kq7aaboRptb41GD/7PCZBZgT9Suwxc2LQXWhQVcRWqduywTIu++OrKNsljzbHZAjIKFw4I3IlVLoXb0xsbUCu7r7Z9ZmQm2+7rnWffSki0inR/ZfJEfa8kYuWVp1I83Zgf+hGjOWZIp249Z2EmQZJA0nSP0DRvqox6dbMZuTquU2DF5ZPXqIxgOYPd3mrce6msYj2gD3lJuxFsa3XoXPibvALu06vu/oZYz4Oe+c/X4kCx5u/yU0x3cB//45rNxGuY6nU2l4XWRO6df+dtzt/qMPZ+Ccl7N6IHdtUTfoa3NpV56NTL+q8h4Q99dW6OlXi4GBvqDIz8+NTx0/Oo74GFH1oVLm5wF5QXGXs9DLx+a4/1dXklu3nH8mR8fCDz6hyu7OYz/ACxXWVwEvWJEsLE4ykaQV+IKBX9O/R8nuNrjXO2J51LHa7lK7UMmcAhtwHnkY8S0pRaMHQfBhnRCK0g06qBKKVXEeir/mxZBGrp/+uKNUuqrH6VO8oW//z1fqL1a0VNtRlGM+zsGXbPILPiv/8rff06r5b3014gCfy9bv5bxFrsD6RixFpOOUO5WUGZPWvQdC5g5Fd3HU1tOcM+jV2shbK8vvddfQsrNmDgLDkftZnTFjihQUs2giGpGPeaYUreAKjbDFai+zMCEAG6KymywyuKdbqBhYwbfgggayZAZu6yladMLxuNre144NjJy7IU9yWu8f8sTB3t7Dz6h5UyZEcQpmt6IAF2UwIr4gkyg2hasnlgaedTYnJE39HUNkWa2qk7QFvaMQSFWhz9QJCtp1A7jieDxhWjaC5IJC8OghGJYgG00YQiA5apWu6egwGO3YpggHaDgv1bRUF0V7a3T/FjdwsQctTmA0Wt1vdGq6oaKa6lrxZW+cru93FdZrPnFjBiGEZcEXR8G+Qcqenw0invjIONMfhmi6Qb3jCXjuL9OlUAkHMQqNtnldEcx8i/bKCaRR3GbNqrwU19/ZvDRdXRK29n7mfrU+ZLmSqVjRUll0Fkmav2R1TFfDiXOG7vFKW3qG5ceeVwjzoAslobr62sDTjxdIRaUecrKi2ySVeBu9w9Vj05QRSYD5b6k2lifeqykrGRFh7LhscHabY3oLvvLedI5OE8GOoudttGDJ04d27tK9IZjE1u2NHYc7rUVQTN3+BvtAd2P1tepSj+FguwC0+VhTuzUACwWm4e5jWajsgNyumU8bYOBxDgKYTioE0lmtqXZ447KCTaveZJT2dheoZFvXAIKaAn6N0AB7kAmBb63aLKpqYzJph5lk9V+RRNff+aRx0VVn12KlDcFHDB9HqbP7c+cfpJ87JRTj+CUU+pAJ1nwJTN9+l5yFeiBe/pC7XcIV/gS1BL/5SUwFzz8FrG0g6WtLJ3D0jaWLoB0YxNGkZg7x8I1RpgGFYEePcdrnuiKQUZ8guEAzYjT6Oe9iJxiONJFimGEBt7hDP+dSQxAN3nShDUzvAiWUZjgQgBmELLRkDbN8RdSE9xFHc5oQVA8KbSVuhsGoJ3nIsaaI6bJRz8AFDaAGsArVk7g6ZYTm3XU8jYgljc14EqRJBmuFDBa86I2IqraFKALlPMxRseprLasAvgTvK74nwMbQDdrH2ofimPwekJm6l8DlQjOVWvyvwHFE7p/AuOSr8Ca2ABFA7TWm2JDi1pB1nB48hW9yc0mriqivzmefOP8ebESe6B6YFCHTj8RXwRHH4ZLCR9L/oQsOndlRCepvn2e3qXEoJbIyAz6OL3VmUynBP1gh0rZSmLOTLpMZinmc6vM/1fJjPxt2ZPl/zPvOWo37yEqUg+NU06HnSkW1lSFjfRd7ZJWdo4+eVzbo/OPyDaZAOCm04/PbrlLfG71XM0K4b/jqcJF8d2FGCz6zQxdh8wYrHmxcxcY+43GRCMei3v3syxSgqedMB4yz6IlGPBlQ9NYGFbDQxgq84gpC1owV5rtxbH3VB1bs9vi2Gwj6UrTPW0UYswU4M5w0E4XrEE6KAu+E6Nu2ijMQdfsYQ6MH0nbgySeSsDxqRhLZWvnX2QV1LQp4K9hwGF2V6Y9wEMN7F1NRQ85ff5nKT1rmce7nuxHPo1FRbjMuxJ1BTEN3kFQhEsxyyGNu0e6LwbL4Um7ORgVN90c+8f6Zri1RI14N15IbE4ns8YCF/qdGndJLesNzhBhlzr7NT0CQtPRD3Hiz/h0gtkia2te70G/A+896Q3l88WmE5Ve6XnyCU4fn/b5EBPsW8oD8TQPgCXJ5IIokgmsERqZ1jiAadkjR/TzbmyzMAiGGs2UJAPwjkfixlEPSV3EMckplU4ZLOPvrVjENDCL/1J3fATAIL1amfs5a41/6/jWjlODE5d6gOJGkTaQVfSJDJb8spCfK3CLeYxHFu3qL/VqA22r3LHdtVvHt9TWr+l7mOrZ9OqibB0jM7qFSZQMk91LKdf6saRDMB3p5pEcMYOMaN0XUQ6MeDapru+u41YuS6vZqc69m9pyPmcbPfSFMSQPoxw9kH7WydWxDyotS5/2NZ9EIE6tWvOpDveGkze2AVUYsbRDxhOjERaTDJ8tAghzPZkgnwbKwPyRU9KHgPjMnXzZR7MP9GQ7eQ7dt0BPNrTgX4iu0qhn268+e/y3l/eoq49++874tp6ACdIDPdviw8eST2dv0AtTWf7HDsP3AL+Drk27H/xz9pBndOOey789/tlrLz9SE9x5x/19JsTvu/+OnUHvZs6fdbIg1ZTtoaSI7p0w1+SRBRcFlLeDhuQPpA8wIq3H38DYpB4b5xyiY3z2MRriDoynPhSLxmfP6yRdbh9K38vLjFsb+1J2I62wPSk9fP2RuTmVTiLEobpG0c/cEFPDEFfajxQ+Rs9GSRxWuAf07RoyAiu9Eefhwk0XqxlJz7yUZa7sOlHjynwfcRQgMsRQ+iBNzZr5X+a/lH5DgDXBTh6FUhO6nsy8Fv4JRFfO5qUakX2zZvr8EdDCSXykgwyQEbpDl3c9hsC4sSXYTT3NLAMU3scdAqBgZXRGjjjlaLMHHT/j8BtGKDj9fCkoA/jR3RuUlngDdbeCDg1D5UiP8Q4qE4+NC8sRKAHxisV1GUPnPApZEd1B8MSZ3RJcuop2yfFIQPJROeKBQTSBkEWbMUbkRgmVPfUgZgVU95Swfis0IEd8tIHW8xEZA2lhJqYCNA9SHI54jF6cbpfs4z0Yf5LdMAiU3ohbirh1Af99vl+pyLfYLfayEk9OTqFFlsOPVgdsZQXOQjGHnjlLxXe+99Dw8EPfe0ebO3tWmzOfqMifgFqcXOByr+QlgUv13fnLH17szi+WJT6npJiKHBW87S4p31vitRXyNsWWE46Uc2JhQU6ux8IV8JUltoJw1MP3FZStHlxd7l8TyVV8LqloRUOTp7DAfjk3Wt6247/esvW5p853e8s9Xnchp3hFl+RT3M6iypy6FQFPoDpQ3OFsKBa2y6Ig8xxP8znZKltzJN5m91fwvK2tqtZlD1Uq+VJ5wNdRZnWL+cVV4SpPYJTyfKV/aHBVidx3+D/dKlry853lfo8lp0CCVbGCxeisFf2VimzneE+Jiy/qGRzpigQET93KgLOi2lXDiVxOTrEvr/U24aw1zyZSLteWa4FhWOtsoixYRP7Z5ah21qBo6m13tdNqsVnttpxdFp7Obu649Us7fd1KZZ2/NNAYlou9HpkvLBT53ByZk4U8m7M4l5dycvIsVt4ncrwj0dIWClbkjXKiNVcO91cIBS6vzVFeQLmcQEdJa1lZjrW+MdB7w8rSitI8d8Mwb5Ps5Z4ywVFSlldQlCdb8nMc9vJce2UZ+AySxQKd8Hm5Vl7iOaGwoszut4erBDzpm2+r81c7ct3VHqnQXVNnLarjbMJK6igPOW498pufPtvhqqmpdfnXrFndE3PKNm9pWWGOxypGyq15uRwsjIXmFxbyxaGmaJOjMhoPeF3OhuoyP5crOJpbGgpsNv0sR8YenYcoDPuzPRe2TadQdOiQeUNmInvjTphGfaTHMYiRMDfzRNXYzOOYv6NDDyOBWGuRL7DopId+wIOq6ENkH+rQcdonvasfDlnm3YWzXXVkg7kbJCDcyAihUKaEBCbLAGqZMQYvN6xHkN0ew/wySAfa45S31m/XT0p5GjzJXzbeu2rgyESsuZEPC4Ke3zqxaaxOu/vmBBrCYu0J7df00/1D+JBnST5b7lfarqupua6cv17pkyvrxjZNtOrnqgQBmmuOTRwZWHUvNAfN6/l2f60XmtNuRuM61K99iXrpLcX4EOxTkv+xHFtrU/zl/FZLXsacd5CDC2ey2BkqhGELJ6wYBjNOEi46nxVtjjNtvugE16INsfTxK1dNYvNtidZPXz9U7Fu3fW/7zZcO9fQcunTzzslu9p3DiqH2mtL8pV/FfP1i0w0/vmnR4al1I/eMrVgxds+IcU8fsYrfc+fNa+vKW9c1Naxt82175Ds7d37nkW1ja74ETIifSIRWrt+yuXLpWav+uyORxeeyZtWBAw/39z98YMC8/xvOh+/t6tp7Zv3oabyfFtWMh1Es1GMF5p6bSGrYSWP2WQR1F2V+XhTHU6MuxdUseOJg/ipbi2ItXLgyGBAk6LTILYjos3KfPnE+cWjy1ffuu++9VycPJWK7Tz332oF5woFNPk3lgz8bT771FPX8/PDhn2vvP/WU9j6mmDPGjgucOam9/H39Tb2V29/87lP3jhU+DMZ9bMPPxmcuY+2nslpYmINM2BlVPAm5aGfFJvDpcUbTYze/ScjsMDOdHl5Gh/gtwtKaelpSF89Kfy3FjlPD8PLSvC3CKPEbhG6yllxPdpKbwfO9izzB4grgWFCD3020DcBBiAd9oqMVZDsI9scTAsmOhuNBGwWnRJCj9aLDDbiEhQ8bEKv4qCcEOAByeEhChgjOHFZHcgQzd5hcOqE4Xj/8JKh1G+86e2Hr8d+9cPNNV97//Offv3JTSnUpxUV5EvdraskrKq54lOdneV6732L5oyT9ESwDcfiKi/It9H9Ra35Rse//8Nw/W+BfrPboqLNE1q5b92DNa7L7vZrPrXO6JHp17X01r4iuZOj6p88d2lifjs/jXc+Cjo3zeGTrhX93aHM94nkcCRSk7qto7GxvzM9vbOtqrKBqItHT29uTSKj+hF+FH3qtognK83Ib2rua/JqaUBNQgoUjB/2xA+2/9B8catufmhi6w99yIP73/tsH47fJwfqNh849fb05Cryrehb2StL+EdgfkfQCat7DtJMuJwv+EOBG9KYlhI4RwHdhpqIX3CbDl+7mRUM7w6KAD7mMMNEFd8lHdcm6Y+P523qK6/uqS4oP7ntt/LUj2s8vXNB+fgSS+w4Wl1T31Rf33HZ+Y9OuLcOla86PjJxfUzq8ZefcWNue4dpYY+IH94Vv55qXk73vNsZqh/e0dd8evu8HhiAKBJtq3qk3le5F75c2XDAab14Ykj4ANd1QojE2oy4nrMJXwrd3m2PK+C4Hz6WsBNpuSO+Psj/PQlJZLr6of8KqNPt4ycW+hWphWwj48SbktsZ4Vf++hkVr8EfTN/gJlz4RN6OaKZrgXLE2noQay/IFjh2fgRGGvTMqfvCA27wi0bc99SZVszF8wAbm0k0JLBUaX9tSXBVrby9RNfbl5xxrKfOcQyVpAy1wA36B+JfpW5qh6oVOame2X7Ebci39lYq4wtw2Q/af3Kaq+66eHtXIrd89PQqSIeX9VQoauIptuV1+/yEU8E31+N3Z6Omr+ziy4fT3QNxOjS46J1aKe1zZLpi+Jwx2Vd9YBeuLm7j4pH8Xhk9g2ZfL1l/Rz6JNkSk5ISdYH1lf0ArkM2+/9Pj+zs79j7/09mcy0nJiSZaRNs63CTBq4XVEexj1RVgnvP7661DmTp+7qid9ZAsZh5X+FOj7feQAuZPcTY6QB8hRcpycIufIefJF8mXyVXIB7QDb6s405lEPVUzYZwRhFBpd8olV9jMesMdAaNRVy+mR08zLblwYZXVlXaGsCzz6i2pqQnulrjnzW4kg5bSXgncPZH47QS9y5FuzF5d8hpr9Hc5/SIdCl/f0xQx/P7scJEh7tXJvR2a/HOU6BzI/20DLm30+YWmORNSMGIW6XHRCj64gzpgyzv62kjHylcw9D8Tl5udwFdSeGSxDJe5pZcdCwUf32M0C+8JpD8o+FaButsS0lYUElnsKg9rDHUKzzwbKnpweqkcfYxLTa3hM45GZm7SqMp+/dah6rPPWzhtWVZpnF4b7g+3OuqbmLd66uT/0d5nniLv6MYqGxxoENewNlIqCWBoIlQoWoTS07BPqMm/YXl7ldlcXnnaVl9e66C82vXYPOgsC22DUVDwscuAm+ouy4UjNUGtF5z46WrZ575He9FmK53ustb6ShpoSOjVyso4SU4POk7qTIxh3g0GluqGr9r72cMPg2GBDVirs5ZhWTX7gifjshTCQGl+5S4ts2oZOhn6aQP+mDv1GjIEtu1PlSv+PD+xgN9CJdEdx50rehduruC06kzBTtiKZFNlsRTPwK1yj7Cwk5s9NmTUEVlctsl27Ziuagzt3LeW3FQGf/T+H3JSEeJxjYGRgYGCqCJ7EY8ASz2/zlYGbgwEE9v892ACir055/P7/////OBjB4pwMTCAKAGmrDaIAAAB4nGNgZGDgYAABDob/QMDByMDIgAqYAFyDBBoAeJxj1WJYxsEABQ0MDIwNQDKY4TIDEmBqgLEYGxgZGME0AwqAiDI4gEz4/5+BjQENgExlhuhZzugA0QE0NxtoXgMj3HYmdcYgBnWwC5CBMEQ1insQakD0ATALSAIABdkRaAAAAAAAABYANgBkAH4A5AFsAeACLAJaAoIDPgNsA9gEIgR+BNoE/AXSBjgG+gcaB7IHzgfqCEIIhAlECXgJpgnUChYKdgqkCsILDAsyC0ILbguWC+YMBgw8DF4MjAysDP4NSg2mDdAOUg6EDpwO7A9AD54PvBA0EM4Q8BFQEWIRkhHcEjYSsBMsE3YTqhPQE/YUKBReFJYU5BU+FeYWghcOF6IXuhfyGHgaXhqcGroa2BtSG+ocDBxuHMAdnh5KHsYfUB+CH6wfuiCiIXwhxHicY2BkYGBIZYxjEGMAAUYwyQXEKYyRICYAGyYBpQAAeJy1VE+LGzcUf1472S1plhIo5KhDKZvFjBN3ITQ5LUlzyl42YSGXgjwjz4iMR0LSZJjSQ4859GP0EuinKC302HM/Qc899dj3njT2buyGbaEeRvPT0/v7e08GgLujz2EE8fcFvhGP4A7uIt6Dffgq4THKnyc8Qfx1wjfgY7AJ34RP4NuE9+FL+D7hA/gUfkn4FhzD7wnfHv08miR8CMd7v2KU0eQj3BV7fyY8gs/GFwnvweH4m4THKH+b8ATxjwnfgLvj3xK+CWL8R8L74CYHCR/A8WTwcwteTn5I+Pb47eSvhA/h5cF3P70T8/sPTsSZzp3xZhnEE+OscTJo02TitK7FuS6r4MW58sq9UUX2TC6czsXZ0+dzceq9Cv5clW0t3fbBtuRCOY+exTw7eRhP6TCevVClUUJ7IUVwslAr6V4LsxShUpfyK51pLYlzs7Ky0cpnO5OvQrCPZrOu67LVcJ6hzSz01pRO2qqfLU0T/Gxj7ltra60KQQeZeGVasZK9aL3CJDAxEotgRO6UDGoqCu1tLfupkE0hrNN4mqOKwq/0wiq30iGgu0XPRdQ6Vw35wgMvjBvAkiJMt0u1zhRtHqaCmEfbKdkMAXQjukrn1aXMOgyqm7xuC2zTOnvT1L040veEWi0wl406evhQtqxe6KYUTvmAnSJWNwHIfO3rMTNwpDFKUCtqgdMYtTBdUxtZXGVPRqqUo3IMhsK1DbYNolBUJulUqrZXGcVhbPqkTg1Bh8hPpRcac86u3214BwLmcB8ewAmiM9CQgwMDHt8lBJQ9QeTwztMqUaIRNZDhySnU+Ag4R1kJFZ553in8KtR+g2uBms/QboF78k0xnuI/y5ztPWuSHVmV0KI/iZrXsbiOzgXn4VPOVGmGdT68YjtYXrZ7wdkYXAXqUFUS38AMFChdcZavUUYs0UnFurv4K3nfIoODdo7fFe4l5qSZrexfME88B5Q+ghk+HT8Z+nvfPktxZoh79lKyH4seepQu2RtVO9sZ3XPOFjuiuY9ibUG9f8U1CWaix2/L3EUmImODNskMV+1Qg+pQMMV9wXqWO96zhPigOJY7E23z5EWlvWTflvtKNQc+I6sF5zF0ouaKyGrIK1p47oLbkizXNUyv1VXL+wJtctxPma848zHudB3n/Qo0T2LHPOW47uasS5WSdo7VtDx3xU7uyaZmdIT69/BLE7pIvOzyHnP4r9xuvBfsqUSZ4zkO6U4Ns7qrgiH6dl6PL80AVRJrCRxvuAXkP9ZaoKTjyg3fyg/NnrwyVYr7YtIaq4q45ZvVsiVlO3Rz8EOaNd/kf57R+M/YpM5svA83RCeWaX4o3wUzHXv7P9ztvwEy7jiOAAB4nGNgZgCD/34M5QyYIBUAKY8CLXic28CgzbCJkZNJm3ETF4jcztWaG2qrysChvZ07NdhBTwbE4onwsNCQBLF4nc215YVBLD4dFRkRHhCLX05CmI8DxBLg4+FkZwGxBMEAxBLaMKEgwADIYtjOCDeaCW40M9xoFrjRrHCj2eQkoUazw43mgBvNCTd6kzAju/YGBgXX2kwJFwDEASgaAAAA') format('woff')`, 
+    },
+    icons: {
+      'TVMonitor': '\uE7F4',
+      'Speakers': '\uE7F5',
+      'Nav2DMapView': '\uE800',
+      'Car': '\uE804',
+      'Bus': '\uE806',
+      'EatDrink': '\uE807',
+      'LocationCircle': '\uE80E',
+      'Home': '\uE80F',
+      'SwitcherStartEnd': '\uE810',
+      'ParkingLocation': '\uE811',
+      'IncidentTriangle': '\uE814',
+      'Touch': '\uE815',
+      'MapDirections': '\uE816',
+      'History': '\uE81C',
+      'Location': '\uE81D',
+      'Work': '\uE821',
+      'Recent': '\uE823',
+      'Hotel': '\uE824',
+      'LocationDot': '\uE827',
+      'News': '\uE900',
+      'Chat': '\uE901',
+      'Group': '\uE902',
+      'Previous': '\uE892',
+      'Next': '\uE893',
+      'Sync': '\uE895',
+      'Help': '\uE897',
+      'Emoji': '\uE899',
+      'MailForward': '\uE89C',
+      'ClosePane': '\uE89F',
+      'OpenPane': '\uE8A0',
+      'PreviewLink': '\uE8A1',
+      'ZoomIn': '\uE8A3',
+      'Bookmarks': '\uE8A4',
+      'Document': '\uE8A5',
+      'ProtectedDocument': '\uE8A6',
+      'OpenInNewWindow': '\uE8A7',
+      'MailFill': '\uE8A8',
+      'ViewAll': '\uE8A9',
+      'Switch': '\uE8AB',
+      'Rename': '\uE8AC',
+      'Import': '\uE8B5',
+      'Picture': '\uE8B9',
+      'ShowResults': '\uE8BC',
+      'Message': '\uE8BD',
+      'CalendarDay': '\uE8BF',
+      'CalendarWeek': '\uE8C0',
+      'MailReplyAll': '\uE8C2',
+      'Read': '\uE8C3',
+      'Cut': '\uE8C6',
+      'PaymentCard': '\uE8C7',
+      'Copy': '\uE8C8',
+      'Important': '\uE8C9',
+      'MailReply': '\uE8CA',
+      'GotoToday': '\uE8D1',
+      'Font': '\uE8D2',
+      'FontColor': '\uE8D3',
+      'FolderFill': '\uE8D5',
+      'Permissions': '\uE8D7',
+      'DisableUpdates': '\uE8D8',
+      'Unfavorite': '\uE8D9',
+      'Italic': '\uE8DB',
+      'Underline': '\uE8DC',
+      'Bold': '\uE8DD',
+      'MoveToFolder': '\uE8DE',
+      'Dislike': '\uE8E0',
+      'Like': '\uE8E1',
+      'AlignCenter': '\uE8E3',
+      'OpenFile': '\uE8E5',
+      'FontDecrease': '\uE8E7',
+      'FontIncrease': '\uE8E8',
+      'FontSize': '\uE8E9',
+      'CellPhone': '\uE8EA',
+      'Library': '\uE8F1',
+      'PostUpdate': '\uE8F3',
+      'NewFolder': '\uE8F4',
+      'CalendarReply': '\uE8F5',
+      'UnsyncFolder': '\uE8F6',
+      'SyncFolder': '\uE8F7',
+      'BlockContact': '\uE8F8',
+      'BulletedList': '\uE8FD',
+      'Preview': '\uE8FF',
+      'World': '\uE909',
+      'Comment': '\uE90A',
+      'DockLeft': '\uE90C',
+      'DockRight': '\uE90D',
+      'Repair': '\uE90F',
+      'Accounts': '\uE910',
+      'RadioBullet': '\uE915',
+      'Stopwatch': '\uE916',
+      'Clock': '\uE917',
+      'WorldClock': '\uE918',
+      'AlarmClock': '\uE919',
+      'Hospital': '\uE91D',
+      'Timer': '\uE91E',
+      'FullCircleMask': '\uE91F',
+      'LocationFill': '\uE920',
+      'ChromeMinimize': '\uE921',
+      'Annotation': '\uE924',
+      'ChromeClose': '\uE8BB',
+      'Accept': '\uE8FB'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-1.ts b/packages/icons/src/fabric-icons-1.ts
new file mode 100644
index 0000000000000..e32abc1ba3bfa
--- /dev/null
+++ b/packages/icons/src/fabric-icons-1.ts
@@ -0,0 +1,121 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-1"`,
+      src: `url('${baseUrl}fabric-icons-1-a961c249.woff') format('woff')`, 
+    },
+    icons: {
+      'TVMonitor': '\uE7F4',
+      'Speakers': '\uE7F5',
+      'Nav2DMapView': '\uE800',
+      'Car': '\uE804',
+      'Bus': '\uE806',
+      'EatDrink': '\uE807',
+      'LocationCircle': '\uE80E',
+      'Home': '\uE80F',
+      'SwitcherStartEnd': '\uE810',
+      'ParkingLocation': '\uE811',
+      'IncidentTriangle': '\uE814',
+      'Touch': '\uE815',
+      'MapDirections': '\uE816',
+      'History': '\uE81C',
+      'Location': '\uE81D',
+      'Work': '\uE821',
+      'Recent': '\uE823',
+      'Hotel': '\uE824',
+      'LocationDot': '\uE827',
+      'News': '\uE900',
+      'Chat': '\uE901',
+      'Group': '\uE902',
+      'Previous': '\uE892',
+      'Next': '\uE893',
+      'Sync': '\uE895',
+      'Help': '\uE897',
+      'Emoji': '\uE899',
+      'MailForward': '\uE89C',
+      'ClosePane': '\uE89F',
+      'OpenPane': '\uE8A0',
+      'PreviewLink': '\uE8A1',
+      'ZoomIn': '\uE8A3',
+      'Bookmarks': '\uE8A4',
+      'Document': '\uE8A5',
+      'ProtectedDocument': '\uE8A6',
+      'OpenInNewWindow': '\uE8A7',
+      'MailFill': '\uE8A8',
+      'ViewAll': '\uE8A9',
+      'Switch': '\uE8AB',
+      'Rename': '\uE8AC',
+      'Import': '\uE8B5',
+      'Picture': '\uE8B9',
+      'ShowResults': '\uE8BC',
+      'Message': '\uE8BD',
+      'CalendarDay': '\uE8BF',
+      'CalendarWeek': '\uE8C0',
+      'MailReplyAll': '\uE8C2',
+      'Read': '\uE8C3',
+      'Cut': '\uE8C6',
+      'PaymentCard': '\uE8C7',
+      'Copy': '\uE8C8',
+      'Important': '\uE8C9',
+      'MailReply': '\uE8CA',
+      'GotoToday': '\uE8D1',
+      'Font': '\uE8D2',
+      'FontColor': '\uE8D3',
+      'FolderFill': '\uE8D5',
+      'Permissions': '\uE8D7',
+      'DisableUpdates': '\uE8D8',
+      'Unfavorite': '\uE8D9',
+      'Italic': '\uE8DB',
+      'Underline': '\uE8DC',
+      'Bold': '\uE8DD',
+      'MoveToFolder': '\uE8DE',
+      'Dislike': '\uE8E0',
+      'Like': '\uE8E1',
+      'AlignCenter': '\uE8E3',
+      'OpenFile': '\uE8E5',
+      'FontDecrease': '\uE8E7',
+      'FontIncrease': '\uE8E8',
+      'FontSize': '\uE8E9',
+      'CellPhone': '\uE8EA',
+      'Library': '\uE8F1',
+      'PostUpdate': '\uE8F3',
+      'NewFolder': '\uE8F4',
+      'CalendarReply': '\uE8F5',
+      'UnsyncFolder': '\uE8F6',
+      'SyncFolder': '\uE8F7',
+      'BlockContact': '\uE8F8',
+      'BulletedList': '\uE8FD',
+      'Preview': '\uE8FF',
+      'World': '\uE909',
+      'Comment': '\uE90A',
+      'DockLeft': '\uE90C',
+      'DockRight': '\uE90D',
+      'Repair': '\uE90F',
+      'Accounts': '\uE910',
+      'RadioBullet': '\uE915',
+      'Stopwatch': '\uE916',
+      'Clock': '\uE917',
+      'WorldClock': '\uE918',
+      'AlarmClock': '\uE919',
+      'Hospital': '\uE91D',
+      'Timer': '\uE91E',
+      'FullCircleMask': '\uE91F',
+      'LocationFill': '\uE920',
+      'ChromeMinimize': '\uE921',
+      'Annotation': '\uE924',
+      'ChromeClose': '\uE8BB',
+      'Accept': '\uE8FB'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-10-inline.ts b/packages/icons/src/fabric-icons-10-inline.ts
new file mode 100644
index 0000000000000..cf074558baf3d
--- /dev/null
+++ b/packages/icons/src/fabric-icons-10-inline.ts
@@ -0,0 +1,121 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-10"`,
+      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
+    },
+    icons: {
+      'BankSolid': '\uF34F',
+      'DecisionSolid': '\uF350',
+      'Parachute': '\uF351',
+      'ParachuteSolid': '\uF352',
+      'FiltersSolid': '\uF353',
+      'ColorSolid': '\uF354',
+      'ReviewSolid': '\uF355',
+      'ReviewRequestSolid': '\uF356',
+      'ReviewRequestMirroredSolid': '\uF357',
+      'ReviewResponseSolid': '\uF358',
+      'FeedbackRequestSolid': '\uF359',
+      'FeedbackRequestMirroredSolid': '\uF35A',
+      'FeedbackResponseSolid': '\uF35B',
+      'WorkItemBar': '\uF35C',
+      'WorkItemBarSolid': '\uF35D',
+      'Separator': '\uF35E',
+      'NavigateExternalInline': '\uF35F',
+      'PlanView': '\uF360',
+      'TimelineMatrixView': '\uF361',
+      'EngineeringGroup': '\uF362',
+      'ProjectCollection': '\uF363',
+      'CaretBottomRightCenter8': '\uF364',
+      'CaretBottomLeftCenter8': '\uF365',
+      'CaretTopRightCenter8': '\uF366',
+      'CaretTopLeftCenter8': '\uF367',
+      'DonutChart': '\uF368',
+      'ChevronUnfold10': '\uF369',
+      'ChevronFold10': '\uF36A',
+      'DoubleChevronDown8': '\uF36B',
+      'DoubleChevronUp8': '\uF36C',
+      'DoubleChevronLeft8': '\uF36D',
+      'DoubleChevronRight8': '\uF36E',
+      'ChevronDownEnd6': '\uF36F',
+      'ChevronUpEnd6': '\uF370',
+      'ChevronLeftEnd6': '\uF371',
+      'ChevronRightEnd6': '\uF372',
+      'EgnyteLogo': '\uF373',
+      'GoogleDriveLogoLeftGreen': '\uF374',
+      'GoogleDriveLogoBottomBlue': '\uF375',
+      'GoogleDriveLogoRightYellow': '\uF376',
+      'AzureAPIManagement': '\uF37F',
+      'AzureServiceEndpoint': '\uF380',
+      'VSTSLogo': '\uF381',
+      'VSTSAltLogo1': '\uF382',
+      'VSTSAltLogo2': '\uF383',
+      'FileTypeSolution': '\uF387',
+      'WordLogoInverse16': '\uF390',
+      'WordLogo16': '\uF391',
+      'WordLogoFill16': '\uF392',
+      'PowerPointLogoInverse16': '\uF393',
+      'PowerPointLogo16': '\uF394',
+      'PowerPointLogoFill16': '\uF395',
+      'ExcelLogoInverse16': '\uF396',
+      'ExcelLogo16': '\uF397',
+      'ExcelLogoFill16': '\uF398',
+      'OneNoteLogoInverse16': '\uF399',
+      'OneNoteLogo16': '\uF39A',
+      'OneNoteLogoFill16': '\uF39B',
+      'OutlookLogoInverse16': '\uF39C',
+      'OutlookLogo16': '\uF39D',
+      'OutlookLogoFill16': '\uF39E',
+      'PublisherLogoInverse16': '\uF39F',
+      'PublisherLogo16': '\uF3A0',
+      'PublisherLogoFill16': '\uF3A1',
+      'VisioLogoInverse16': '\uF3A2',
+      'VisioLogo16': '\uF3A3',
+      'VisioLogoFill16': '\uF3A4',
+      'TestBeaker': '\uF3A5',
+      'TestBeakerSolid': '\uF3A6',
+      'TestExploreSolid': '\uF3A7',
+      'TestAutoSolid': '\uF3A8',
+      'TestUserSolid': '\uF3A9',
+      'TestImpactSolid': '\uF3AA',
+      'TestPlan': '\uF3AB',
+      'TestStep': '\uF3AC',
+      'TestParameter': '\uF3AD',
+      'TestSuite': '\uF3AE',
+      'TestCase': '\uF3AF',
+      'Sprint': '\uF3B0',
+      'SignOut': '\uF3B1',
+      'TriggerApproval': '\uF3B2',
+      'Rocket': '\uF3B3',
+      'AzureKeyVault': '\uF3B4',
+      'LikeSolid': '\uF3BF',
+      'DislikeSolid': '\uF3C0',
+      'DeclineCall': '\uF405',
+      'Spacer': '\uF40D',
+      'SkypeLogo16': '\uF40E',
+      'SkypeForBusinessLogo16': '\uF40F',
+      'SkypeForBusinessLogoFill16': '\uF410',
+      'FilterSolid': '\uF412',
+      'MailUndelivered': '\uF415',
+      'MailTentative': '\uF416',
+      'MailTentativeMirrored': '\uF417',
+      'MailReminder': '\uF418',
+      'ReceiptUndelivered': '\uF419',
+      'ReceiptTentative': '\uF41A',
+      'ReceiptTentativeMirrored': '\uF41B',
+      'Inbox': '\uF41C',
+      'IRMReply': '\uF41D'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-10.ts b/packages/icons/src/fabric-icons-10.ts
new file mode 100644
index 0000000000000..b4c91710d8ca4
--- /dev/null
+++ b/packages/icons/src/fabric-icons-10.ts
@@ -0,0 +1,121 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-10"`,
+      src: `url('${baseUrl}fabric-icons-10-795d6e25.woff') format('woff')`, 
+    },
+    icons: {
+      'BankSolid': '\uF34F',
+      'DecisionSolid': '\uF350',
+      'Parachute': '\uF351',
+      'ParachuteSolid': '\uF352',
+      'FiltersSolid': '\uF353',
+      'ColorSolid': '\uF354',
+      'ReviewSolid': '\uF355',
+      'ReviewRequestSolid': '\uF356',
+      'ReviewRequestMirroredSolid': '\uF357',
+      'ReviewResponseSolid': '\uF358',
+      'FeedbackRequestSolid': '\uF359',
+      'FeedbackRequestMirroredSolid': '\uF35A',
+      'FeedbackResponseSolid': '\uF35B',
+      'WorkItemBar': '\uF35C',
+      'WorkItemBarSolid': '\uF35D',
+      'Separator': '\uF35E',
+      'NavigateExternalInline': '\uF35F',
+      'PlanView': '\uF360',
+      'TimelineMatrixView': '\uF361',
+      'EngineeringGroup': '\uF362',
+      'ProjectCollection': '\uF363',
+      'CaretBottomRightCenter8': '\uF364',
+      'CaretBottomLeftCenter8': '\uF365',
+      'CaretTopRightCenter8': '\uF366',
+      'CaretTopLeftCenter8': '\uF367',
+      'DonutChart': '\uF368',
+      'ChevronUnfold10': '\uF369',
+      'ChevronFold10': '\uF36A',
+      'DoubleChevronDown8': '\uF36B',
+      'DoubleChevronUp8': '\uF36C',
+      'DoubleChevronLeft8': '\uF36D',
+      'DoubleChevronRight8': '\uF36E',
+      'ChevronDownEnd6': '\uF36F',
+      'ChevronUpEnd6': '\uF370',
+      'ChevronLeftEnd6': '\uF371',
+      'ChevronRightEnd6': '\uF372',
+      'EgnyteLogo': '\uF373',
+      'GoogleDriveLogoLeftGreen': '\uF374',
+      'GoogleDriveLogoBottomBlue': '\uF375',
+      'GoogleDriveLogoRightYellow': '\uF376',
+      'AzureAPIManagement': '\uF37F',
+      'AzureServiceEndpoint': '\uF380',
+      'VSTSLogo': '\uF381',
+      'VSTSAltLogo1': '\uF382',
+      'VSTSAltLogo2': '\uF383',
+      'FileTypeSolution': '\uF387',
+      'WordLogoInverse16': '\uF390',
+      'WordLogo16': '\uF391',
+      'WordLogoFill16': '\uF392',
+      'PowerPointLogoInverse16': '\uF393',
+      'PowerPointLogo16': '\uF394',
+      'PowerPointLogoFill16': '\uF395',
+      'ExcelLogoInverse16': '\uF396',
+      'ExcelLogo16': '\uF397',
+      'ExcelLogoFill16': '\uF398',
+      'OneNoteLogoInverse16': '\uF399',
+      'OneNoteLogo16': '\uF39A',
+      'OneNoteLogoFill16': '\uF39B',
+      'OutlookLogoInverse16': '\uF39C',
+      'OutlookLogo16': '\uF39D',
+      'OutlookLogoFill16': '\uF39E',
+      'PublisherLogoInverse16': '\uF39F',
+      'PublisherLogo16': '\uF3A0',
+      'PublisherLogoFill16': '\uF3A1',
+      'VisioLogoInverse16': '\uF3A2',
+      'VisioLogo16': '\uF3A3',
+      'VisioLogoFill16': '\uF3A4',
+      'TestBeaker': '\uF3A5',
+      'TestBeakerSolid': '\uF3A6',
+      'TestExploreSolid': '\uF3A7',
+      'TestAutoSolid': '\uF3A8',
+      'TestUserSolid': '\uF3A9',
+      'TestImpactSolid': '\uF3AA',
+      'TestPlan': '\uF3AB',
+      'TestStep': '\uF3AC',
+      'TestParameter': '\uF3AD',
+      'TestSuite': '\uF3AE',
+      'TestCase': '\uF3AF',
+      'Sprint': '\uF3B0',
+      'SignOut': '\uF3B1',
+      'TriggerApproval': '\uF3B2',
+      'Rocket': '\uF3B3',
+      'AzureKeyVault': '\uF3B4',
+      'LikeSolid': '\uF3BF',
+      'DislikeSolid': '\uF3C0',
+      'DeclineCall': '\uF405',
+      'Spacer': '\uF40D',
+      'SkypeLogo16': '\uF40E',
+      'SkypeForBusinessLogo16': '\uF40F',
+      'SkypeForBusinessLogoFill16': '\uF410',
+      'FilterSolid': '\uF412',
+      'MailUndelivered': '\uF415',
+      'MailTentative': '\uF416',
+      'MailTentativeMirrored': '\uF417',
+      'MailReminder': '\uF418',
+      'ReceiptUndelivered': '\uF419',
+      'ReceiptTentative': '\uF41A',
+      'ReceiptTentativeMirrored': '\uF41B',
+      'Inbox': '\uF41C',
+      'IRMReply': '\uF41D'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-11-inline.ts b/packages/icons/src/fabric-icons-11-inline.ts
new file mode 100644
index 0000000000000..d5540df819140
--- /dev/null
+++ b/packages/icons/src/fabric-icons-11-inline.ts
@@ -0,0 +1,105 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-11"`,
+      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
+    },
+    icons: {
+      'IRMReplyMirrored': '\uF41E',
+      'IRMForward': '\uF41F',
+      'IRMForwardMirrored': '\uF420',
+      'VoicemailIRM': '\uF421',
+      'EventAccepted': '\uF422',
+      'EventTentative': '\uF423',
+      'EventTentativeMirrored': '\uF424',
+      'EventDeclined': '\uF425',
+      'IDBadge': '\uF427',
+      'OfficeFormsLogoInverse16': '\uF433',
+      'OfficeFormsLogo': '\uF434',
+      'OfficeFormsLogoFill': '\uF435',
+      'OfficeFormsLogo16': '\uF436',
+      'OfficeFormsLogoFill16': '\uF437',
+      'OfficeFormsLogoInverse24': '\uF43A',
+      'OfficeFormsLogo24': '\uF43B',
+      'OfficeFormsLogoFill24': '\uF43C',
+      'PageLock': '\uF43F',
+      'NotExecuted': '\uF440',
+      'NotImpactedSolid': '\uF441',
+      'FieldReadOnly': '\uF442',
+      'FieldRequired': '\uF443',
+      'BacklogBoard': '\uF444',
+      'ExternalBuild': '\uF445',
+      'ExternalTFVC': '\uF446',
+      'ExternalXAML': '\uF447',
+      'IssueSolid': '\uF448',
+      'DefectSolid': '\uF449',
+      'LadybugSolid': '\uF44A',
+      'MTMLogo': '\uF44B',
+      'NugetLogo': '\uF44C',
+      'TFVCLogo': '\uF44D',
+      'ProjectLogo32': '\uF47E',
+      'ProjectLogoFill32': '\uF47F',
+      'ProjectLogo16': '\uF480',
+      'ProjectLogoFill16': '\uF481',
+      'SwayLogo32': '\uF482',
+      'SwayLogoFill32': '\uF483',
+      'SwayLogo16': '\uF484',
+      'SwayLogoFill16': '\uF485',
+      'ClassNotebookLogo32': '\uF486',
+      'ClassNotebookLogoFill32': '\uF487',
+      'ClassNotebookLogo16': '\uF488',
+      'ClassNotebookLogoFill16': '\uF489',
+      'ClassNotebookLogoInverse32': '\uF48A',
+      'ClassNotebookLogoInverse16': '\uF48B',
+      'StaffNotebookLogo32': '\uF48C',
+      'StaffNotebookLogoFill32': '\uF48D',
+      'StaffNotebookLogo16': '\uF48E',
+      'StaffNotebookLogoFill16': '\uF48F',
+      'StaffNotebookLogoInverted32': '\uF490',
+      'StaffNotebookLogoInverted16': '\uF491',
+      'KaizalaLogo': '\uF492',
+      'TaskLogo': '\uF493',
+      'ProtectionCenterLogo32': '\uF494',
+      'NonprofitLogo32': '\uF495',
+      'GallatinLogo': '\uF496',
+      'Globe2': '\uF49A',
+      'Guitar': '\uF49B',
+      'Breakfast': '\uF49C',
+      'Brunch': '\uF49D',
+      'BeerMug': '\uF49E',
+      'Vacation': '\uF49F',
+      'Teeth': '\uF4A0',
+      'Taxi': '\uF4A1',
+      'Chopsticks': '\uF4A2',
+      'SyncOccurence': '\uF4A3',
+      'UnsyncOccurence': '\uF4A4',
+      'PrimaryCalendar': '\uF4AE',
+      'SearchCalendar': '\uF4AF',
+      'VideoOff': '\uF4B0',
+      'MicrosoftFlowLogo': '\uF4B1',
+      'BusinessCenterLogo': '\uF4B2',
+      'ToDoLogoBottom': '\uF4B3',
+      'ToDoLogoTop': '\uF4B4',
+      'EditSolid12': '\uF4B5',
+      'EditSolidMirrored12': '\uF4B6',
+      'UneditableSolid12': '\uF4B7',
+      'UneditableSolidMirrored12': '\uF4B8',
+      'UneditableMirrored': '\uF4B9',
+      'AdminALogo32': '\uF4BA',
+      'AdminALogoFill32': '\uF4BB',
+      'ToDoLogoInverse': '\uF4BC',
+      'Snooze': '\uF4BD'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-11.ts b/packages/icons/src/fabric-icons-11.ts
new file mode 100644
index 0000000000000..37ca88f3b9ec7
--- /dev/null
+++ b/packages/icons/src/fabric-icons-11.ts
@@ -0,0 +1,105 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-11"`,
+      src: `url('${baseUrl}fabric-icons-11-c0dbf638.woff') format('woff')`, 
+    },
+    icons: {
+      'IRMReplyMirrored': '\uF41E',
+      'IRMForward': '\uF41F',
+      'IRMForwardMirrored': '\uF420',
+      'VoicemailIRM': '\uF421',
+      'EventAccepted': '\uF422',
+      'EventTentative': '\uF423',
+      'EventTentativeMirrored': '\uF424',
+      'EventDeclined': '\uF425',
+      'IDBadge': '\uF427',
+      'OfficeFormsLogoInverse16': '\uF433',
+      'OfficeFormsLogo': '\uF434',
+      'OfficeFormsLogoFill': '\uF435',
+      'OfficeFormsLogo16': '\uF436',
+      'OfficeFormsLogoFill16': '\uF437',
+      'OfficeFormsLogoInverse24': '\uF43A',
+      'OfficeFormsLogo24': '\uF43B',
+      'OfficeFormsLogoFill24': '\uF43C',
+      'PageLock': '\uF43F',
+      'NotExecuted': '\uF440',
+      'NotImpactedSolid': '\uF441',
+      'FieldReadOnly': '\uF442',
+      'FieldRequired': '\uF443',
+      'BacklogBoard': '\uF444',
+      'ExternalBuild': '\uF445',
+      'ExternalTFVC': '\uF446',
+      'ExternalXAML': '\uF447',
+      'IssueSolid': '\uF448',
+      'DefectSolid': '\uF449',
+      'LadybugSolid': '\uF44A',
+      'MTMLogo': '\uF44B',
+      'NugetLogo': '\uF44C',
+      'TFVCLogo': '\uF44D',
+      'ProjectLogo32': '\uF47E',
+      'ProjectLogoFill32': '\uF47F',
+      'ProjectLogo16': '\uF480',
+      'ProjectLogoFill16': '\uF481',
+      'SwayLogo32': '\uF482',
+      'SwayLogoFill32': '\uF483',
+      'SwayLogo16': '\uF484',
+      'SwayLogoFill16': '\uF485',
+      'ClassNotebookLogo32': '\uF486',
+      'ClassNotebookLogoFill32': '\uF487',
+      'ClassNotebookLogo16': '\uF488',
+      'ClassNotebookLogoFill16': '\uF489',
+      'ClassNotebookLogoInverse32': '\uF48A',
+      'ClassNotebookLogoInverse16': '\uF48B',
+      'StaffNotebookLogo32': '\uF48C',
+      'StaffNotebookLogoFill32': '\uF48D',
+      'StaffNotebookLogo16': '\uF48E',
+      'StaffNotebookLogoFill16': '\uF48F',
+      'StaffNotebookLogoInverted32': '\uF490',
+      'StaffNotebookLogoInverted16': '\uF491',
+      'KaizalaLogo': '\uF492',
+      'TaskLogo': '\uF493',
+      'ProtectionCenterLogo32': '\uF494',
+      'NonprofitLogo32': '\uF495',
+      'GallatinLogo': '\uF496',
+      'Globe2': '\uF49A',
+      'Guitar': '\uF49B',
+      'Breakfast': '\uF49C',
+      'Brunch': '\uF49D',
+      'BeerMug': '\uF49E',
+      'Vacation': '\uF49F',
+      'Teeth': '\uF4A0',
+      'Taxi': '\uF4A1',
+      'Chopsticks': '\uF4A2',
+      'SyncOccurence': '\uF4A3',
+      'UnsyncOccurence': '\uF4A4',
+      'PrimaryCalendar': '\uF4AE',
+      'SearchCalendar': '\uF4AF',
+      'VideoOff': '\uF4B0',
+      'MicrosoftFlowLogo': '\uF4B1',
+      'BusinessCenterLogo': '\uF4B2',
+      'ToDoLogoBottom': '\uF4B3',
+      'ToDoLogoTop': '\uF4B4',
+      'EditSolid12': '\uF4B5',
+      'EditSolidMirrored12': '\uF4B6',
+      'UneditableSolid12': '\uF4B7',
+      'UneditableSolidMirrored12': '\uF4B8',
+      'UneditableMirrored': '\uF4B9',
+      'AdminALogo32': '\uF4BA',
+      'AdminALogoFill32': '\uF4BB',
+      'ToDoLogoInverse': '\uF4BC',
+      'Snooze': '\uF4BD'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-2-inline.ts b/packages/icons/src/fabric-icons-2-inline.ts
new file mode 100644
index 0000000000000..7f7c67a7014e3
--- /dev/null
+++ b/packages/icons/src/fabric-icons-2-inline.ts
@@ -0,0 +1,121 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-2"`,
+      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
+    },
+    icons: {
+      'Fingerprint': '\uE928',
+      'Handwriting': '\uE929',
+      'StackIndicator': '\uE7FF',
+      'Completed': '\uE930',
+      'Label': '\uE932',
+      'FlickDown': '\uE935',
+      'FlickUp': '\uE936',
+      'FlickLeft': '\uE937',
+      'FlickRight': '\uE938',
+      'Streaming': '\uE93E',
+      'MusicInCollection': '\uE940',
+      'OneDrive': '\uE941',
+      'CompassNW': '\uE942',
+      'Code': '\uE943',
+      'LightningBolt': '\uE945',
+      'CalculatorMultiply': '\uE947',
+      'CalculatorAddition': '\uE948',
+      'CalculatorSubtract': '\uE949',
+      'CalculatorEqualTo': '\uE94E',
+      'PrintfaxPrinterFile': '\uE956',
+      'Communications': '\uE95A',
+      'Headset': '\uE95B',
+      'Health': '\uE95E',
+      'ChevronUpSmall': '\uE96D',
+      'ChevronDownSmall': '\uE96E',
+      'ChevronLeftSmall': '\uE96F',
+      'ChevronRightSmall': '\uE970',
+      'ChevronUpMed': '\uE971',
+      'ChevronDownMed': '\uE972',
+      'ChevronLeftMed': '\uE973',
+      'ChevronRightMed': '\uE974',
+      'Dictionary': '\uE82D',
+      'ChromeBack': '\uE830',
+      'PC1': '\uE977',
+      'PresenceChickletVideo': '\uE979',
+      'Reply': '\uE97A',
+      'HalfAlpha': '\uE97E',
+      'LockSolid': '\uE9A2',
+      'ConstructionCone': '\uE98F',
+      'DoubleChevronLeftMed': '\uE991',
+      'Volume0': '\uE992',
+      'Volume1': '\uE993',
+      'Volume2': '\uE994',
+      'Volume3': '\uE995',
+      'CaretHollow': '\uE817',
+      'CaretSolid': '\uE818',
+      'FolderOpen': '\uE838',
+      'PinnedFill': '\uE842',
+      'Chart': '\uE999',
+      'Robot': '\uE99A',
+      'BidiLtr': '\uE9AA',
+      'BidiRtl': '\uE9AB',
+      'RevToggleKey': '\uE845',
+      'RightDoubleQuote': '\uE9B1',
+      'Sunny': '\uE9BD',
+      'CloudWeather': '\uE9BE',
+      'Cloudy': '\uE9BF',
+      'PartlyCloudyDay': '\uE9C0',
+      'PartlyCloudyNight': '\uE9C1',
+      'ClearNight': '\uE9C2',
+      'RainShowersDay': '\uE9C3',
+      'Rain': '\uE9C4',
+      'Thunderstorms': '\uE9C6',
+      'RainSnow': '\uE9C7',
+      'Snow': '\uE9C8',
+      'BlowingSnow': '\uE9C9',
+      'Frigid': '\uE9CA',
+      'Fog': '\uE9CB',
+      'Squalls': '\uE9CC',
+      'Duststorm': '\uE9CD',
+      'Unknown': '\uE9CE',
+      'Precipitation': '\uE9CF',
+      'Ringer': '\uEA8F',
+      'PDF': '\uEA90',
+      'Ribbon': '\uE9D1',
+      'AreaChart': '\uE9D2',
+      'Assign': '\uE9D3',
+      'CheckList': '\uE9D5',
+      'Diagnostic': '\uE9D9',
+      'Generate': '\uE9DA',
+      'LineChart': '\uE9E6',
+      'Equalizer': '\uE9E9',
+      'BarChartHorizontal': '\uE9EB',
+      'BarChartVertical': '\uE9EC',
+      'Freezing': '\uE9EF',
+      'Processing': '\uE9F5',
+      'SnowShowerDay': '\uE9FD',
+      'HailDay': '\uEA00',
+      'WorkFlow': '\uEA01',
+      'StoreLogoMed': '\uEA04',
+      'TriangleSolid': '\uEA08',
+      'RainShowersNight': '\uEA0F',
+      'SnowShowerNight': '\uEA11',
+      'HailNight': '\uEA13',
+      'Info2': '\uEA1F',
+      'StoreLogo': '\uEA96',
+      'MultiSelectMirrored': '\uEA98',
+      'Broom': '\uEA99',
+      'MusicInCollectionFill': '\uEA36',
+      'Asterisk': '\uEA38'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-2.ts b/packages/icons/src/fabric-icons-2.ts
new file mode 100644
index 0000000000000..1d1f8886d7a74
--- /dev/null
+++ b/packages/icons/src/fabric-icons-2.ts
@@ -0,0 +1,121 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-2"`,
+      src: `url('${baseUrl}fabric-icons-2-2be8dca9.woff') format('woff')`, 
+    },
+    icons: {
+      'Fingerprint': '\uE928',
+      'Handwriting': '\uE929',
+      'StackIndicator': '\uE7FF',
+      'Completed': '\uE930',
+      'Label': '\uE932',
+      'FlickDown': '\uE935',
+      'FlickUp': '\uE936',
+      'FlickLeft': '\uE937',
+      'FlickRight': '\uE938',
+      'Streaming': '\uE93E',
+      'MusicInCollection': '\uE940',
+      'OneDrive': '\uE941',
+      'CompassNW': '\uE942',
+      'Code': '\uE943',
+      'LightningBolt': '\uE945',
+      'CalculatorMultiply': '\uE947',
+      'CalculatorAddition': '\uE948',
+      'CalculatorSubtract': '\uE949',
+      'CalculatorEqualTo': '\uE94E',
+      'PrintfaxPrinterFile': '\uE956',
+      'Communications': '\uE95A',
+      'Headset': '\uE95B',
+      'Health': '\uE95E',
+      'ChevronUpSmall': '\uE96D',
+      'ChevronDownSmall': '\uE96E',
+      'ChevronLeftSmall': '\uE96F',
+      'ChevronRightSmall': '\uE970',
+      'ChevronUpMed': '\uE971',
+      'ChevronDownMed': '\uE972',
+      'ChevronLeftMed': '\uE973',
+      'ChevronRightMed': '\uE974',
+      'Dictionary': '\uE82D',
+      'ChromeBack': '\uE830',
+      'PC1': '\uE977',
+      'PresenceChickletVideo': '\uE979',
+      'Reply': '\uE97A',
+      'HalfAlpha': '\uE97E',
+      'LockSolid': '\uE9A2',
+      'ConstructionCone': '\uE98F',
+      'DoubleChevronLeftMed': '\uE991',
+      'Volume0': '\uE992',
+      'Volume1': '\uE993',
+      'Volume2': '\uE994',
+      'Volume3': '\uE995',
+      'CaretHollow': '\uE817',
+      'CaretSolid': '\uE818',
+      'FolderOpen': '\uE838',
+      'PinnedFill': '\uE842',
+      'Chart': '\uE999',
+      'Robot': '\uE99A',
+      'BidiLtr': '\uE9AA',
+      'BidiRtl': '\uE9AB',
+      'RevToggleKey': '\uE845',
+      'RightDoubleQuote': '\uE9B1',
+      'Sunny': '\uE9BD',
+      'CloudWeather': '\uE9BE',
+      'Cloudy': '\uE9BF',
+      'PartlyCloudyDay': '\uE9C0',
+      'PartlyCloudyNight': '\uE9C1',
+      'ClearNight': '\uE9C2',
+      'RainShowersDay': '\uE9C3',
+      'Rain': '\uE9C4',
+      'Thunderstorms': '\uE9C6',
+      'RainSnow': '\uE9C7',
+      'Snow': '\uE9C8',
+      'BlowingSnow': '\uE9C9',
+      'Frigid': '\uE9CA',
+      'Fog': '\uE9CB',
+      'Squalls': '\uE9CC',
+      'Duststorm': '\uE9CD',
+      'Unknown': '\uE9CE',
+      'Precipitation': '\uE9CF',
+      'Ringer': '\uEA8F',
+      'PDF': '\uEA90',
+      'Ribbon': '\uE9D1',
+      'AreaChart': '\uE9D2',
+      'Assign': '\uE9D3',
+      'CheckList': '\uE9D5',
+      'Diagnostic': '\uE9D9',
+      'Generate': '\uE9DA',
+      'LineChart': '\uE9E6',
+      'Equalizer': '\uE9E9',
+      'BarChartHorizontal': '\uE9EB',
+      'BarChartVertical': '\uE9EC',
+      'Freezing': '\uE9EF',
+      'Processing': '\uE9F5',
+      'SnowShowerDay': '\uE9FD',
+      'HailDay': '\uEA00',
+      'WorkFlow': '\uEA01',
+      'StoreLogoMed': '\uEA04',
+      'TriangleSolid': '\uEA08',
+      'RainShowersNight': '\uEA0F',
+      'SnowShowerNight': '\uEA11',
+      'HailNight': '\uEA13',
+      'Info2': '\uEA1F',
+      'StoreLogo': '\uEA96',
+      'MultiSelectMirrored': '\uEA98',
+      'Broom': '\uEA99',
+      'MusicInCollectionFill': '\uEA36',
+      'Asterisk': '\uEA38'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-3-inline.ts b/packages/icons/src/fabric-icons-3-inline.ts
new file mode 100644
index 0000000000000..69e8c21153a7b
--- /dev/null
+++ b/packages/icons/src/fabric-icons-3-inline.ts
@@ -0,0 +1,121 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-3"`,
+      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
+    },
+    icons: {
+      'ErrorBadge': '\uEA39',
+      'CircleFill': '\uEA3B',
+      'Record2': '\uEA3F',
+      'BookmarksMirrored': '\uEA41',
+      'BulletedListMirrored': '\uEA42',
+      'CaretHollowMirrored': '\uEA45',
+      'CaretSolidMirrored': '\uEA46',
+      'ChromeBackMirrored': '\uEA47',
+      'ClosePaneMirrored': '\uEA49',
+      'DockLeftMirrored': '\uEA4C',
+      'DoubleChevronLeftMedMirrored': '\uEA4D',
+      'HelpMirrored': '\uEA51',
+      'ImportMirrored': '\uEA52',
+      'ListMirrored': '\uEA55',
+      'MailForwardMirrored': '\uEA56',
+      'MailReplyMirrored': '\uEA57',
+      'MailReplyAllMirrored': '\uEA58',
+      'OpenPaneMirrored': '\uEA5B',
+      'ParkingLocationMirrored': '\uEA5E',
+      'SendMirrored': '\uEA63',
+      'ShowResultsMirrored': '\uEA65',
+      'ThumbnailViewMirrored': '\uEA67',
+      'Devices3': '\uEA6C',
+      'Lightbulb': '\uEA80',
+      'StatusTriangle': '\uEA82',
+      'VolumeDisabled': '\uEA85',
+      'Puzzle': '\uEA86',
+      'EmojiNeutral': '\uEA87',
+      'EmojiDisappointed': '\uEA88',
+      'HomeSolid': '\uEA8A',
+      'Cocktails': '\uEA9D',
+      'Wines': '\uEABF',
+      'Articles': '\uEAC1',
+      'Cycling': '\uEAC7',
+      'DietPlanNotebook': '\uEAC8',
+      'Pill': '\uEACB',
+      'ExerciseTracker': '\uEACC',
+      'Medical': '\uEAD4',
+      'Running': '\uEADA',
+      'Weights': '\uEADB',
+      'BarChart4': '\uEAE7',
+      'CirclePlus': '\uEAEE',
+      'Coffee': '\uEAEF',
+      'Cotton': '\uEAF3',
+      'Market': '\uEAFC',
+      'Money': '\uEAFD',
+      'PieDouble': '\uEB04',
+      'PieSingle': '\uEB05',
+      'RemoveFilter': '\uEB08',
+      'Savings': '\uEB0B',
+      'StockDown': '\uEB0F',
+      'StockUp': '\uEB11',
+      'MSNVideos': '\uEB1C',
+      'Cricket': '\uEB1E',
+      'Golf': '\uEB1F',
+      'Baseball': '\uEB20',
+      'Soccer': '\uEB21',
+      'MoreSports': '\uEB22',
+      'AutoRacing': '\uEB24',
+      'CollegeHoops': '\uEB25',
+      'CollegeFootball': '\uEB26',
+      'ProFootball': '\uEB27',
+      'ProHockey': '\uEB28',
+      'Rugby': '\uEB2D',
+      'Tennis': '\uEB33',
+      'Arrivals': '\uEB34',
+      'Design': '\uEB3C',
+      'Website': '\uEB41',
+      'Drop': '\uEB42',
+      'SkiResorts': '\uEB45',
+      'Snowflake': '\uEB46',
+      'BusSolid': '\uEB47',
+      'FerrySolid': '\uEB48',
+      'AirplaneSolid': '\uEB4C',
+      'TrainSolid': '\uEB4D',
+      'Ticket': '\uEB54',
+      'Devices4': '\uEB66',
+      'AzureLogo': '\uEB6A',
+      'BingLogo': '\uEB6B',
+      'MSNLogo': '\uEB6C',
+      'OutlookLogoInverse': '\uEB6D',
+      'OfficeLogo': '\uEB6E',
+      'SkypeLogo': '\uEB6F',
+      'Door': '\uEB75',
+      'EditMirrored': '\uEB7E',
+      'GiftCard': '\uEB8E',
+      'DoubleBookmark': '\uEB8F',
+      'StatusErrorFull': '\uEB90',
+      'Certificate': '\uEB95',
+      'FastForward': '\uEB9D',
+      'Rewind': '\uEB9E',
+      'Photo2': '\uEB9F',
+      'OpenSource': '\uEBC2',
+      'CloudDownload': '\uEBD3',
+      'WindDirection': '\uEBE6',
+      'Family': '\uEBDA',
+      'CSS': '\uEBEF',
+      'JS': '\uEBF0',
+      'DeliveryTruck': '\uEBF4',
+      'ReminderPerson': '\uEBF7'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-3.ts b/packages/icons/src/fabric-icons-3.ts
new file mode 100644
index 0000000000000..6ba5d3d7ca294
--- /dev/null
+++ b/packages/icons/src/fabric-icons-3.ts
@@ -0,0 +1,121 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-3"`,
+      src: `url('${baseUrl}fabric-icons-3-80b6008d.woff') format('woff')`, 
+    },
+    icons: {
+      'ErrorBadge': '\uEA39',
+      'CircleFill': '\uEA3B',
+      'Record2': '\uEA3F',
+      'BookmarksMirrored': '\uEA41',
+      'BulletedListMirrored': '\uEA42',
+      'CaretHollowMirrored': '\uEA45',
+      'CaretSolidMirrored': '\uEA46',
+      'ChromeBackMirrored': '\uEA47',
+      'ClosePaneMirrored': '\uEA49',
+      'DockLeftMirrored': '\uEA4C',
+      'DoubleChevronLeftMedMirrored': '\uEA4D',
+      'HelpMirrored': '\uEA51',
+      'ImportMirrored': '\uEA52',
+      'ListMirrored': '\uEA55',
+      'MailForwardMirrored': '\uEA56',
+      'MailReplyMirrored': '\uEA57',
+      'MailReplyAllMirrored': '\uEA58',
+      'OpenPaneMirrored': '\uEA5B',
+      'ParkingLocationMirrored': '\uEA5E',
+      'SendMirrored': '\uEA63',
+      'ShowResultsMirrored': '\uEA65',
+      'ThumbnailViewMirrored': '\uEA67',
+      'Devices3': '\uEA6C',
+      'Lightbulb': '\uEA80',
+      'StatusTriangle': '\uEA82',
+      'VolumeDisabled': '\uEA85',
+      'Puzzle': '\uEA86',
+      'EmojiNeutral': '\uEA87',
+      'EmojiDisappointed': '\uEA88',
+      'HomeSolid': '\uEA8A',
+      'Cocktails': '\uEA9D',
+      'Wines': '\uEABF',
+      'Articles': '\uEAC1',
+      'Cycling': '\uEAC7',
+      'DietPlanNotebook': '\uEAC8',
+      'Pill': '\uEACB',
+      'ExerciseTracker': '\uEACC',
+      'Medical': '\uEAD4',
+      'Running': '\uEADA',
+      'Weights': '\uEADB',
+      'BarChart4': '\uEAE7',
+      'CirclePlus': '\uEAEE',
+      'Coffee': '\uEAEF',
+      'Cotton': '\uEAF3',
+      'Market': '\uEAFC',
+      'Money': '\uEAFD',
+      'PieDouble': '\uEB04',
+      'PieSingle': '\uEB05',
+      'RemoveFilter': '\uEB08',
+      'Savings': '\uEB0B',
+      'StockDown': '\uEB0F',
+      'StockUp': '\uEB11',
+      'MSNVideos': '\uEB1C',
+      'Cricket': '\uEB1E',
+      'Golf': '\uEB1F',
+      'Baseball': '\uEB20',
+      'Soccer': '\uEB21',
+      'MoreSports': '\uEB22',
+      'AutoRacing': '\uEB24',
+      'CollegeHoops': '\uEB25',
+      'CollegeFootball': '\uEB26',
+      'ProFootball': '\uEB27',
+      'ProHockey': '\uEB28',
+      'Rugby': '\uEB2D',
+      'Tennis': '\uEB33',
+      'Arrivals': '\uEB34',
+      'Design': '\uEB3C',
+      'Website': '\uEB41',
+      'Drop': '\uEB42',
+      'SkiResorts': '\uEB45',
+      'Snowflake': '\uEB46',
+      'BusSolid': '\uEB47',
+      'FerrySolid': '\uEB48',
+      'AirplaneSolid': '\uEB4C',
+      'TrainSolid': '\uEB4D',
+      'Ticket': '\uEB54',
+      'Devices4': '\uEB66',
+      'AzureLogo': '\uEB6A',
+      'BingLogo': '\uEB6B',
+      'MSNLogo': '\uEB6C',
+      'OutlookLogoInverse': '\uEB6D',
+      'OfficeLogo': '\uEB6E',
+      'SkypeLogo': '\uEB6F',
+      'Door': '\uEB75',
+      'EditMirrored': '\uEB7E',
+      'GiftCard': '\uEB8E',
+      'DoubleBookmark': '\uEB8F',
+      'StatusErrorFull': '\uEB90',
+      'Certificate': '\uEB95',
+      'FastForward': '\uEB9D',
+      'Rewind': '\uEB9E',
+      'Photo2': '\uEB9F',
+      'OpenSource': '\uEBC2',
+      'CloudDownload': '\uEBD3',
+      'WindDirection': '\uEBE6',
+      'Family': '\uEBDA',
+      'CSS': '\uEBEF',
+      'JS': '\uEBF0',
+      'DeliveryTruck': '\uEBF4',
+      'ReminderPerson': '\uEBF7'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-4-inline.ts b/packages/icons/src/fabric-icons-4-inline.ts
new file mode 100644
index 0000000000000..74e9384b837cd
--- /dev/null
+++ b/packages/icons/src/fabric-icons-4-inline.ts
@@ -0,0 +1,121 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-4"`,
+      src: `url('data:application/octet-stream;base64,d09GRgABAAAAAD5EAA4AAAAAaTwAAnhTAAAAAAAAAAAAAAAAAAAAAAAAAABPUy8yAAABRAAAAEgAAABgNFJ0rWNtYXAAAAGMAAABhgAAA8IFtfa9Y3Z0IAAAAxQAAAAgAAAAKgnZCa9mcGdtAAADNAAAAPAAAAFZ/J7mjmdhc3AAAAQkAAAADAAAAAwACAAbZ2x5ZgAABDAAADPdAABVkMbGJ/ZoZWFkAAA4EAAAADIAAAA2/LJqwWhoZWEAADhEAAAAFQAAACQQAQgDaG10eAAAOFwAAABhAAAAzhvBEQZsb2NhAAA4wAAAAMwAAADMEVwoym1heHAAADmMAAAAHgAAACAA5QIybmFtZQAAOawAAAP2AAAJ+o2Z8E5wb3N0AAA9pAAAABQAAAAg/1EA3HByZXAAAD24AAAAiQAAANN4vfIOeJxjYGH/wTiBgZWBgXUWqzEDA6M0hGa+yJDGJMTBysrFyMQIBgxAIMCAAL7BCgoMDq943lZzgPkQkgGsjgXCU2BgAAD+6QiieJzN0s9L03EYB/DPV8fwYAef9/dLslZCqKxAIunuIbp4yCJvXlxB+KPlWtnmQigiwkIN/4Kg4c9iRB0j6CaKh+oghEwRJfru/WhDLWPg/LJJ4LUO84H38/C+vQ6PMabSlBI0lrdNxQevWcXuq3jp3ZR5aPym3q12xQ24QfdUdpd+HqPN4zzBOp7mWTazlZfZxnZ28jqjjDPJQT7jCEc5xldMcZwTnOQUpznD10zzHWc5x3kucIkZLnONWW5zTy11NKAntV4bNKRn9IK26BXt0m7t0V69pRG9rX0a1Tsa07var/c1rgkd0KQ+KBSMKSqdA6WP1az5qwwdUoY95b3/Utb+q9LZcX46G446tGFX2ZW2wR7y2MUv5JDFF3zFZ8zjIz7hPd4ijTdepjGJFMbwAsN4jiE8xRM8xiMMIoF+xBBFBDdxA2F04Bqu4hIu4jzOoQkhNKLBSwA1sCQvf+S37MiW5GRTVLLyQ77LuqzKimRkSb6JK4ulTzj6Y/nLLSj/7AO13hqzAAB4nGPQYghlKGBoYFjFyMDYwOzAeIDBAYsIEAAAqhwHlXicXY+/TsNADMZzJLSEJ0A6IZ11KkOViJ3phksk1CUlDOelgNRKpO+AlIXFA8/ibhnzYgjMEf4utr/P+ny/c6f5yXx2nKVHKilWnDfhoNQLDurtmf35IU/vNmVhTNV5VvdlwWoJomtOF/VNsGjI0PWWTG0eH7acLWKXxY7w0nDShk7qbQB2qL/HHeJVPJLFI4QS30/xfYxL+rUsVobTiyasA/des/OoAUzFYxN49BoQf8ikP3VnE+NsOWXbwE5zgkSfygL3RJqE+0uPf/Wgkv+G+23Iv6tB9U3c9Bb0h2HBgrChl2fbUAkaYPkOhPxkxgABAAIACAAK//8AD3icnXwJYFTVuf85d53JJJPcWTOTZCaTycxk3yYzkz2ThIRAgECCEBICYZVdlE1B4IpsKqhFwLYi9SnYqrWtVq0743u19mmtC2rtH/+vKGpb+3zavto/JDOX/3fOvZOEgK1tkpl77rnnnvU73/f7lhPEoAcR4nbzmxGLRIQikkfyeSTPg+x/xZ9inkpMRfzm4VsPczMQ/DDwJ+uQgNSyZihrxhJGvCwzSIFnrByXGRmjOHzgB8qgTB3SQVEUQOXoCHoIvYDeQghXuRirRRAlHy+V4VB1E2PPM0KOiwlWNTGh6jLGHBK8eQFrRKL5gujCdrEMe8mdF4pHyFtlzKX3TfC2Wq/N3sSStD084YGLheJlDDuuJVIHP+EeT7gX5NZNc6s87ovoInJ7quZuai3oqHa5qjsKtGtfw6RJDXJosKOgd6rZK3VVXtcw87aVDXLB1JUtU3sKOgZD5JmcHZxS5vElb32enuqsjp7Bior5vR1Z1T3jn5RNCWbLcPukxVuWlVXmtSSvI2hiDoOSryWvbIx0sXpxkdIny/gHRYurSfflcf2l18QPNmRlbYhy75P35j8Q0dtSV3j9DSsPdE+5ZcsiT+T++clKq5fM7XR651cm7yvne0u7C6IlmZkl0YLu0kufODvnLqkm9xiN7+YVrolPxvcarkAvHCEcHRJl1IH60Tq0FaglSQPq4l2+6LDc+MoLPXEh8bg0ITfskbySJ+SRgpKHR2TJeqa2rJxaIJNZGLeCDStvmzn//oh/c5ea7j4wvqTy2MQVUNCEkQmhi0i+iDCCncHR2qE6z6Itt0whVY2fc7Xqrs1+LT2xLJYnVD3y2sTWCZnSli6SnYqwumevQquQTPaeHVvzhBxsMcI0lMF0+L15glW7a8RwG8LhYJUdptACm9Af4D1VLg5mkQt6fEbYg34y0ZEwJvPooTVpk6zOrr86HPHA/NJ8HmWkMeec/sk3PDA4+MANk/3O8WnmXFqG05yS4zT5nQ6vpGTjP/sjxXnuPKsVvoojfvxnJVvyOpx+kzMnxaz0W7zlTiXq9BP6bt04N8jE6DevS3zlLPdaIFtAonLHfr9TJi2Qlpx+vzOZlp3+/fha0ZziyHZlOP0e6S/m7LxsM/36i+TxOzNc2Y4Uc0ImlUEdZNuQphS6oWxVVZVW0oMoyQcy5cl8Uv7mRH4URJPRdJhfMm/qZAaAkYaCVvrhgVl6rd6QBz7Yr5KqHfImUqQZykpBETUsbPUOHHt7y8DDd6x1xX8Hy8nCXkbDhNkCl5UZliWPl84flrlYcnza9d6YEpM5d+HKbbd2bnn72EBk2e1zBCSTH0oY8DMCfIw88mBPXFbkcS/TKwPUIxN+j1gRqAd5UbPKtYEqgpKFMbLpOFDGMSEJuh9pwtifHyDsWRAFTpQsLs7exIfYWHD+3NnFnXcePtY75aaf/PqTjW73xk9+/ZObpvQeO3xn51UPsw8eUb7YMWnfrFn7Ju1QvjjStvG+p19bvvy1p+/b2KZDaVmFWWV1uakKOqQM/+nNnx1vM5najv/szT9h4RCDUnPryiIhZZdu5qySwsKSWTN1yo6dn73zwoO319ff/uAL73y2k8grmDERCTJKQw7oP+x1oN8QdLkZe4Jk58MHdr6I5NYH+8JLZrdZpfhnspyACWJkQYap3VrfLLtrZ1YGhiEnIfPwgTkh0o3OiwFloiyo2WMdZSRYIjceTKuHFRboPlQnfgS2Y1xmBxifrEDffFhO8gQeVlYWUeJMwseAMB1QzkATAuLxDcALMZW3BmRDYbQMWgOKUhuxejAZEHA/GI1IWZ+RswaB9YUjTay6s8VQ2OzCKkn6AyEXDlaFgeBwnjdUh5swLSRCFUnOqYOeCNpH2WcsN7trnJU92FHqMWd6i7yZ941gfXp10O9yOMstVYvyqxwFoazMSpu5NNNZ6PQVGI35HrvHHvDayjNtJXm2QL4A0wnDVWSZe8BgbTc4LcrOm9KyCrLc5b4chyOt3Z5vzSsvKMjKstmkKbmJdr4k4C7JStMZphiNNpfNqo+KFqvTkjnJoE+x5zv8pXqy9xDO1RGIUQn7bhBtQLdouEKCocKA2JCkMigjyXIx9dhK2Z1Eth4pOMoBgec1MaOvjhbiL8u5vIxwtmHljNKC9sFwVrnX7Cip8wxHPXUlDpLKzSXPSmcAy86dIPjwwD+dISJSUwLVLJ5WKchCdlF1DouSTSVoSiYlWERaHTlLXo0l66AJLJNkYjSTiZIUzVSiyUw8rmh8tChLn1PZ7BM/15HZn4aG0EaE9EzEjvl/QTKr/E4w/wPkJX6eOK38b/9P8emR6a2rugrHBHNh16rWrquIMF5wf9h//TQ1TSTkVV2XlLzq3YnyMXEZYmJ6E29jY//j+O0lnqHNt44J5Vs3D3nC9y9Qq512vV9Lk2fQ7CVlF9zPTZT68dcuAzgM7GVZ3A74ZjXaRyiWs9tMdostuUHLsMZIjRj+ijHJYgPSmLCmOxULo2BZMrKjBcfehaoacROPYQXKmHxvHgfVkTfJgqjfbOxneNbeWw5LWC/ZUgVJ0KUKhUMtjWvy9Wmi3mUJW1z6dE9BVW5hx2B19WBHIU7Jys7OSoFtVOZ0lHutuVUFnnStoJimz1/T2LqgyGCXnH5D902P/Poz5mLRLL/vnneUiwcOKMo73/X5ZxUteigcfmgR/RblPdtl5eVnGZZJtZsMLMPpxYpQpDLVkSZZrVJ2mc+pT3SShkkHTKUBpzNQanKWea2kA8zTeqevLJuUTHOkVkZCFalpASe3/dOX/+26pkTUZNr34f39/fd/uM9kGpg1a4B8iKgGNiTsEn8E8sCNSkGmzUGLgaOuhHWgnDAQIZxSEM2qDBcDai4mFByO2I3w0GbHZSwFQMlbKI+9rIf14jFCDxBEZaOc1m/AQTM85k6UVlaWzou2t0cfr+oOZ2eHu6vm9c6b15soJXnzyFPlq0ueMHMCXnxw75zE43P24oPeQBK4xwimIZ/tw/Ic5fE53KfF65ub1xfPb/revHnfa2LzK67bsb+jY/+O6yrmz3xjw4Y3ZiZq1Efz1YLKf19WAh8q7c4amUtkFfdQVneppihkqg05/crflFsVFVKCJJKJ/BPPIDvMoxd0u2LQ7oIoguphTtuAKxDph4lopVKQyEVyDRKNkWRiQETshA/QVcgMH1a78qBPEplB/7CcQDKHqGjGBP4kf1ikJcQzCXn4JA8iVRkYAciryIDOhmUBOjwCb8ZpFqnh4oQPK6tXrN1rem5Uh/gY0EmWhnuwB4NOaSUsCRazjPUKs+3lhbk6bD2PsE3nLijPZPUpIv6tcPS3WEzRs3xMygnY4n9irbZAjiTzgsgmjjCrWVHgkYYd98IcbkV60I7tqAItIC3ZQCoJxVgyj6awT/Jhu1QdBtFthz+zXQKEZbODjAiIPC1CmAPM8df9kqpgz1vF5Wnw4/fT7wtROik5yzmsY3iD8Nn+nQzDNOyK7uLPCcY1vD5NlziH6dRf/mFyLOlrjAIXcxjOGxw4qshagj346IXUR/EdPP4PIYXnWM5gMygzdcwvdEqjmC5u+WQTX5+mi28QTemGWFQe/Y3lSdNFI5kXgFZMGcz928hKcBXlebCnPCq4YYSykRNDD++YOnXHw0PcfC3FlJHbZDa5qmuYrKc4aXEg85SscRR4e5KmB6EsWcX4NqbvX1Zfv2z/9JETyRT/9sTm4s/WL9s3ffo+8ly9Isw8Aot8FchKMo5LQANhEPxV4cEbOzpuHAwnr8Ijww8n7/k5WorOh6ZjUErkXIzJCvib4bx5+WUMjMDUxORz4h1Y+OjpmydP2f3sR0oc+O3wJy/s75q69/lPMAC6KXue/1gZvv2AEj/3/J6pU/Y+dw5zB+/A4sfP7plCaREakTU8a0QW0GZySZ896i/oyL5gQL2lqNaKyZdHlEdkomkyZzDCJxPyyZMYKQD0ONiliLvppgRibwIQCRuLWIhISfnkyBkWNiJ5j5PjRKWJE1ZC9IwoHeN8dD+0bCF6BmXEVLaJxBREZBsbUBkxhbY0HTGr4oygWqqI0BsWGC9N2802WgsG9h4hfzxZ8QBh4OFIgEhJuDOyRO6KKkaGFq1EfaF7TUSZXn96Z+fgNP+Cq1dXX3d6ZUZ6esbK09dVr756gX/aYGenMeDNDFekpZou6h2p6RZD0UCtr2d6m93gMJkcBtuk6T2+2oEig8WYbb5oSk2rCCfQrIfmZlZkVq9dPn9SgTvYmmd0WtOCFd8PbmkqXDAw2+XunT9Y2LQl+P2KYJo1Ky2vNegumDR/+dpqeGnuQ/xOe31DWJrz9HVrnpnqm1RbnJbdGdLpQp3ZacW1k3xTn1lz3c/mSuGGenvrwiKDQ3KYMHCllBR/vuQpdxszMozuco+U708BZTphgueGooUjYlGjXUwRjeXN3QvWNExZ2jsrbK2sDjk7d4ceyveacsuys8tyTd78h0K7O52h6kpreFbv0ikNaxZ0N5cb4UV7Y1IXprqWA+WAbG1ELRoN+cegYBID8oSWxim9QWri8Wg7EggOVLILMs73ArIOqZiBACizlDiRAD2MAKpRFCtfYmrCy0gBHo1Ah+rbySMi+skLeS05QG0cLZ7E1ZgCweSdAs8JOiN7AfCZHqWidBgDL/F6HJAiek7CfAzHlGgiqhQ/8gh+V4lScSkrUVF+ZHh1jIkpR1azO9coR8gTjBIgnhRqIoiioPiS+DryIB8qhNmpRCFUi+aO01iAgQdD3ss+WNPzxn9AuuoxayfbIAh0agORwJrTQRMUYfzlWBS36TJtGRn2TDGx56XRH6ZZeQlf9rmAOdiO+N9/8eA1mOc5BtAYFjY+9/7bP1mt0/EMaxDmPyKidKtdP/xjfUaquOvFVu33ppGdL+IXx/0xOOX8cpzC/Ew5qP9fNl1KZ3UZOr1BSRjwd/ChlP/J8EqSJ/0jPZljMh87tfmYSuUeTILwd4SYDwRhFgg/dR8HLWTQZpE1EjSKA6yaAqbAilGf0+lLxKhB+gqfkSgZ8PF9BxZCh1kQeTw39O2HD83heMxw3OLblvI8y7Fdwks5+SMoP+el5l3NO1t3RG+C60vaCLmCxEYdfoIX+XRXusVvVqJ65rc6xW0JWMwBM35PpzSZ1eTTZF+QscZgrF5URFe969JVT/6qLAyQEuB3idrWJCrdqWpuo2tulyLhqjHFXpRTbOa0NLMtJSEnh5fTkqdaAIHccYxQdyKjKdoo5ZsaahLr6VpHj0xNd2WEeuvcm7a17WsTYqSGEUTqIiL5Y8lMXsPILOF8JarWdm1z618YoRkPqzOAmyVshQkTK6cMBrfsSeGIrSIpQ7IAB3ajAbQC3UxHyhGjBHBaDvgAZ65qgmsZ3Bs5wmixzTqq2lCTWADbsUhxM7VK2jDhyxoSD2C/+p7NLvrJCxxhK2xs91fv/Xh7e/v2H7/31e7x6Q3vPPPtNQ0Na779zDsbxqWx2zLeFF5SgPH6fuXORzVUzXzX7V65ZGBWX7VydsON3YfkFV2FfbMGlq6qmi8fe2Jx17cm6dDlbanpC+iy1rQ0exgaGmd8t6iN3pXE13ho0re6DigJaPjNDTduwLnVhdNWynd1bzgNTWN8cNETx+SBKrebyGsW7cSyeFEgdrlqNGkM3RQTJgB4jxhuPcROGw56QNgRIyMXApZLJjwJeyw2Ill3JrXXq0u2TsV20pdhmXxj+6ydfeUs6jtx+6beshFU1rvp9hNsX1KfZQWzTUBJFXv6rsrkOMIHTj69CCC6+kIfYZBqFVhO6sEtu+SdTSrWmwEy4xTQTAPBehZqZWYiEpHIlFyYCBkPFRRUgeWpeAcEJJ4aPlc2c83Wm6Oz7rxlb8eM7xy7f+6G954/tr6pfddzm6KTU5jfli49vn63cv5/fjkpfdbOh9/4ct+Me6ce/sPxXjY69frBthKrs7TJp8zwR/ym0JLbH397845PYkfKoz/uW3dybaT7wKn1uz5/7eSm5mxH8MnPlXPfpRhJxWEF0NtONBv0d4RHIR3FpxL0UQLC9QDlAkSvZ4wYFPtR6KkRuep8CkdgrfgmzY0FKqTNTriAChKDxGAV9EhMLEkyxMlT7cqLuvxOBZGZju1iMGaigw9s7ejYSoy29HqO2KnL+wNKuzOL6XJmBedupLePljYl3sfos9mH10Xlkq7ltXgVg0i9nJxsIf6iIcfMbid1jwAFML6SAh7L4+qmV4XavrOc+LlA/+8C/eXE/J7lTDw5uVaWo+sOz8arlKO1y7tKLlJ/IZYJY4A586M6gusIUKNsGni2pKKtsa1vs19mDOfk+dOXbISvzGKLoDNwjhkLVlVPumVde/u6Wya1745cRIX90yorp/UXalcdWnGydc57e+DbUpI5fIPe4czUVUytdJT0bOnq2tJTUljEnz4vZ1Z0VsBfZvKq+Z2SGDgdMLsDITOVtlbKnn3E1+kxw03EE/CA8ktcnAnq6iRQZSn/9Mfn5Tf5s33Db+pA4VR1UyikIOXxqqoZqi09ieM9X4/kcUCPRcyhg1g499zeKQSrK8MHDyrDyTssMH/Yn1irfL4f3wPI/grPD2rvJnqhHDbvV5ap+iZC1dReKtHR5QAO0eSQl9IsRRe8VwpS+EVMy6JdDIiBSCBij4hRQiYyMIcoGx2JEl2ZRwkClojYYaZ+9FH/Rx/2nz3b/+FHIqUr8szpH0GggMsjoMljmI/E6XNQ7Gz/WSj5kabrIR/19QkUKxK4qEPDZxTfRcgclhUfPsPL1IeFQrTvLOCFYtXervY9MG6/BT12z5iF167HETtLLRbsWWoeNRkvRI0mk5HNleNDSdOp8L/9qoWRIUMiOfEntzFvknIjUFomOVyMlB55YSBxGqcN/BSxhK6pHZSDefRCf0TYvHhc6yo7EGE81EDKVdZ2XgTFRx4zqXIUsQKf5EctnFiu6SQmCPJYHPWdjmTI/PoLCH+kNo5Pq/PxpPi5hrVJ+/akWttM5lD0EDWGKG4e2jx7vjMedZTlW8U0c+rrvDwwEn6NFQDdPZboJpBAWDvahV92WvPLHBkFfm/qr1lf/MzAq2x6RgaHAVTHx/VA1dk2iZ/DmqSrGi7dJqRxgvlFH51+DgEQjsIWkeULslAp48Wjk63E5BjogG/IbGVclrcnpxb4LOEZZB9mwtj8qBUthtq9Ywq0F1oJqO1geyTkNXsl1dI2GlQwWlS1x5kJYAI9zyoGQlS7Y+zaG4I86hMn5h9MjECKHI0CrRJRlogS7japIVmmYRJw113Z5Xlms6ciOxrNKfeYzXnl2aQsKyeio7w6JjM+GQ8oJ+XEGeZMS8vJOEpECWMVo4Qhd+0rHb6YLMzj0n1dpB1Fl5FfHPa6airyU56IRp9Iya+ocXnDxfkZw0+Td5G67vvpftGjMCBJql8FqYENe4gXqImN4CB2sXYb8TpW2VTxEvBowzZ7WB26kLpRSI3/Nf435Vaz32T0uBwC3t2Dd+gdnuKs7GylVSrwZtpc7hSlVe/1ODLzCzOycd9PhBuHU7Gs/JVP3Rg/UMKCrlAShuk8Gh+y1QR9LFtSgvV2h216z3S7fXrPNFumXYcxfgtvReNtGBWXYF/JY/YARqnHkhrakYOpwWFsF4l32AvdJpO70J74G04pUH7d0Xui/vqGhXctDylfYUO8OPlYdOkQuZ7/iOSwDhx6uacdW3R83eq7Bz9WXov/Xi1FnsKuHaUxK+hiLeiqJE4VRL1qxOVwdVWoaSzGBCSXpcqKpQmi3DxRXmlYx+NOxBIxt4diIKYaO5y9d8bWro3d2et0YPzBjFuW19cvv2VG8hoZ6iws7ByKaFedhp3atzeNyJzctL1drTX+OMblK0KkGlJdaEU5xvFOXhlfFbkm5HGV0asm324WEyKRb3Zqr0UY4KGKFfP8eIzX23mR7mOyySJ6gN4iDoIwkHh5FKt+91z/ueRf4omW4TtFFI0OI1C6QO1tG/jDg7jliPJkIivGJ03Vcee4V85FeTme0dLCrlcGTinwjvLiwB8fVGLMpy8lziRlMeX3pK9EX760r2POVlCKiE5MrcvQV6sXpKfkGespIyddr/Hv4uUjUKWc7GZsQLkngWLsybE+9sujcRM4qtwzAL0kGrzWx5YBvBwj0sMxrMDDTkwDiUqxgkRRQtJuRjFCHAFjgH2bAHJLwAaIA16QyS2rfsNH5aUYigsk5qVnNIIAVL9RT1gZS51hWgTUOG+mqjSp0U7jvdDCouaV04sIPpepxQMoIZw6Y9PR2dNvu67XXLKqLhnaEI0m/f5TpwRW77xz2uAjd65JPD/ms+b+Kk1efH2rGgwDCD6yYFKg5+DVdVV9N07xF9JADBJclIwccLSsmBKoW/mtRHVyMlVZkdQN3ZfrhKTfoMT97V1VmXr3b7vH0l8xL5M9QDWuSx/sUdMwnxTbIDGm4cwZIDHWEbQJE2bTosY4zS3JJh00lwUCXRKNRkr4JkSksS5sV4PSmjCPPE39NVuW9PS9fp26N+XJN//smpp5TZ6Ztz23atVzt81UUFKzIjPXsPI2PmN8/Bjl+LEJUWQFudFcEkiWGxVQ645rF+aV9yzunK4yg01nT90VyF+wfnsbqR1aUWxJf2eyESVKQr4QCcYjIV/QAkibHZdFfd0huTN+lZX1qwyqS47Rsp2uDkETHumKv3gcdQsa/B3RrmSjqZ84cdbIClCzQmicxgNeVK+0XAJKEbMYBkiQ9Cdo+JTEfb0OeMKj2cdAv1JjjWgoEm0+uTo52Iep654H1kR2Czx1MB6Jg82cYbUKgtWa4Wf95xEnp1utomi1psMWjpFrwso/pRz6v5A98gxgd+AJfmeqv8hvMMBXKoh9mVAclu/Tp4ksK6bpN10FI4HrvAt43dTdJPci7X882XdW5Vc6lV9lJWdQDf1R02rkD0nDzMnnCRbkCDIGoEt2WpxsNtoZmXSIuqS0UJ1h6AzUn3ZJrBGh8tmoD81HQ2gpWoHWoPXEG/8NY4/CES9kE6bx9RFIvqDVSz4SfLCWxvAar32+UYRSZcUiuXDZhh0tXx+mRHQlNSQp6YTDWg75/OMgpjn3d8pzgt2RnL8XyUR+MHUlks1Bb1X9tBf5hEfFM0B9BuK1JMqXnmoOHEo82s88yjzan3iU6e1P9CZ6+0Vf4kf9zI8SPf1xHdPTn+hhftRPeTexF5PF6VZjjESqw2lLQfxvX8fEg8D4JjJxoIq7+nEpLu3Hv06ycEJsf5eJg7SKXYGNc77EAHPyEFSnnO7HH/5LfJzMUwqK4agQE6M0jvdSX+/kcb61r0FFZiAXDMiChasZcAZPSAmuxOPLkvzYBCvGoMa7WrXx7QLdcWRf//73YrFtA/v7mVRYRR7u8VF6L6CJVooESvLYZC2sHFNW7e/flxiRlTkD+/pnxPBRuGWAVnER3AMflLU9rMp0LV7ME2JhI0WoG2xMuuoQMC/gcPDFwwZlqXOZ8jKo4gLIeiBR+iyh5WIZaXwiaQOIoN6vtwJMtJKaJ0hMah/4+Lk9U6bsee5jVf9P3mH+9m2fvHJiUzS66cQrn2wbS3984+AjR7f2VVT0bT36yOC4NPEPXqEWrYXzsvry5ZUKuZdVpaWT+uHYWL/xSP+lkf2rI1DXJOnvMQBtt10ay8f+A+s1FyU7D3RZHJWjN37yygOk/gde+eTG8elVP3/kwNJIZOmBR36+alyai6rv4SiDLn9JTV+QL3tNS6vzS/vdgY5Tzp8z5i23jmIX4gcNVROfSdhE49zqseYu1QLgSPiAzQy7tZjEtajuadAbG0G6csVYDeMFZbkJ5EZQ3eQBYjeG6qlhtph6KkIkQiIIcNyFrcKjZdNrcofRzAMrCOyZmbQYOypMJvMU77KWTTeQ21jTUJkz4iVWDoJMorZVJLK22OK2pRKrB4n3KW2tKiwsc8fUYFwSekTV9Yri3G3zN92Qx+aRgpSXNV27oNNqkxsm4Rt1ZW1XlckNKw5QaDRqczabTBWOnz/Zd/ekbbj8YcpNiwrsdq0GQEXR1puVl0lLlfMHF4UYNQwuJStbpsHBpG+ALEgEElXz7Tf/btE25a2HJzWQcjS239e2oI5Bif/ybm5P7vUxf0j9N/CE/D0UvGfDu8/cvba+fu3dz7y7YVxaCRL7zdej4wvosle0NJvEzYC5EpqeVY+mQD+NrBiAnRkBegiEbBzAXuqQF1Wvud2IfZqrPKD64TEQmV0gu5qET7Ex+bNfHqu4IfzE77HpMLuj4tgv/7TzMDb9/onI+V8W92ye1tV361CVlLE1zSguzJCqhm7t65q2uafYmBa/Z+cXq7u2KX88dEj547au1V+I2/V9d768OXDrJz9Ypk/M3vzynX16Wb/sB5/cquxfcurHx6Irpvz01Q82tOxsLgit+c/mnS0bPnj1p1NWRI/9+NSS8JrQyEPtbVd39/R0X93WTmJ2o0SGCS9QGdaoWqNFVdmPWI0sdvFE/w9oJhO2ikZ4UfM0DIvFMYf9mlxPac/G20/2r33u1hmM3H/y9o09pZ7ca+yOGbc+tzbafvOWqwuvqdp514k5c04clivXF1695WYONWwMR9uPTBt4+OjOhQ26m1KXfPdlplvXsHDn0YcHph9pj0Y2Nqx7+btLUkd25zbOjbR0XDOtsHD6NR3RyNzGXM2vXisicf+ormml8VXwxwPK4CM4HQMqJ+dw2BgbjcfiMf6xxB1/ZtYqu/8ncejP3YxMI5fF/crQyJfKIvw9LqMA11yv/OLFzbju+hXxN5UYWxF/E0fZCiU2KqOAr/gAgXermPLKwZ3U3OaZqEgRv35ADRbxAO1QrUH4qHVlV4HcuOJAd/eBFY1yQdfK1q7epP7Sq5yeECbJhEyectcFoqYb8F5dlqRsU6KA+l7NVU9BrGgkVZETE7nhBwaTOtDgAxPDOkGBRxWdTXV5zDqQ+19hQ17UpURxjCe034J2ii8Jp1ADmgpIeiFaOw7JQJ9HgZlqVdTjMeVxnKGI4YE7huxaHLWg3iXdl3pO8pjH+TLtERET7uEGLjaMCtrHlLL6KrwScznleaZkTnstrO7iyjq4j/8h4MTOfGqSRD5IUnMF/6LyvPJL5TXlp5xykzNAsvIcnHAqWcFIlIu5Qh2BpO4XWWhXPPg3KfkVta5kXuNiqxLAH2YORmhYYZYPY+xLGnkwNYooXmUyE0y8hZ+Jx7hTvizy0OFj+EvxjBqfTvUeqqZFsCgiovddgImOf/oEKz+hQyMoQfP45U/E5ScueZ9Y4Xo1KeZNkhNNXqK1k7XxXUZwJNYedJtIENQs4oFjX1z24OYWmegmRHGQWzY/uKy0syorCW2zqjqVdydATH4X0elA53jtyRGU2+Jm3izY88NX10ajpAZSUzS69tUf7ilw9yxcGUlC7cjKhT3SRKQJ46Xaofzaayz6lEsz4F3qXEVRDeyrX0KqBm1GyEzi+misLuH+1LIFG0e0arFMRDQk/WKRUKCMBllTlxkWR4OFpWQwb0QNjCrDNKhJe0DmS3RhGvDALHBUZF415K9trfX7nK7yQr/VyBUsqQzNbcwraGhvKMhweqT8juw0PrOVO+FtIM6RBm/BkSUcoRNvm9PZ5vVPdnZtyquora3I29TlnOxXcwnlcEuOCBfeOL/+P7m9LG/eOrdmRiTgL3Q5/XpTjlW4T8yxZdf0Ruq7awO+IpclK0O028XviQbDq7wnGM3PjwY9/OKjgQwLqcuZibMznTlZWas7M+eHw/MzO1dnZeWouaQvlozAUc1ucQ/M5zKgnCG0Ax0bO1WYgtlL/IrUqewHng7TMxqMZMXBJnLsAVvUUGtePdfERdSZI9Lanjw2QYPPeJjgcZoOF6immnQTzwkkwFMn3PjF9bmTFt48lNUU8qY78y1SrtTaE/bbZ3xnxspUR4pgchXafXWpeBUv5gcbGmtLnFIxW2c1mwotmdMGFs/vdoi26JIt1/SZBEm0+nMyEiedA+uuXzPHZrZK2QGrlMoKrHnO2o0Lm+zM5xavIz0t022yrdj9re19KThbdPRfc/21C8W5UNaWnmNUTid+qLw1c/fCEGcu9Fm8Wels+bShqhfw5hcwzqnPybDYC12mIi+Or5WGdh+/7+imyTivWHnTVpaWaklJ9RcXea1cirF19vyZtSLDZGT74w87i6qry4ypFVYbdI/DHJNaN23uzGhGCoevkbJ95gyf28KIqWanmUQDGZkUm0VKo4fPyD4X1HOgQdAb1XN9E/TGb+goJ2DEVhUUxLwS7Ad5XQILlopBmJNlcuEcLIhJ/sCq2wLW14W5iacRmYFv5jyPf1k9f/sUc8BsE7+tnFNG/rhk0R8wj7OPfgcD3Pl0aEC35sI9FcGW5qR485WWlZVe/86CBe9w8sRTjxcv01Wv7FHHoak3L2/VM80t0/c/f83a52+ZMWXvCxsH9Dtebmo9NksQbV5NCiq3R4/MmHEkWn14YOAwQsm5pmdu3aCrT0EzYX9cNtdfM7faDsJePeNi7diKeRJxhWGbABhksepJo1YMfqLS/jWzh+/r2DoQqqpQGp8CJfnMyC+qB6fVSNiiXEjsO86KLJ9ZsW3ktpTSaE9ZjzCTOCk9NdOK/bWVJQ72G0Yf8KHQwNaO1m3QBpaxb+QVqWbaYDW2PqVcOM7cAJuGd1RUXWDKeqKlKcrP+GJHSWWtv3hajYe4OjU5hhH1N7hQGapKzpYI4kxz5nKaR1cPUxGkLirO68HwK9KjgkZl8MJj9PjMUGlLsKCw3M2cJas9jHBIavSx7ydytXzlPhEN/0CR+T6eHOR1urLjz/AyKavpGWVZF1Gim1nl8WNEsxTVR4DRJqrvfQW4DOE8jqpgpF8hj6ZQBD3EciVidtM9yh/Xrt2oqoskCEE1Uat2ZDakzJnKhBOvTsUPC2jj2rXKH+9RVUpZLaAWVq6ayoSY0FTlKkQiBpL2TVXOp9OI9awJsf9tgBaJDPdag8mPDz68dvX9g3tqWQ55reTDU5NpMEQ+JB9AMDXeKbJmHtQ+I//g/gL0Gt6JkzCEC9SZQfw/IgHVCTXy/4o/AtKMsGOmxmFEpCiVO8tHz/6lwyzkqtGL1DFFJERQ8mLtZCHR6OzEnihEkx6m/yPLHDWOKgPEu/52v3IXXtvPoaS/CtYepvk8NEBcRNDv0/14LZQgobVJOwUL/LMXzdWsviqOgM2qhUBbI2JYDXImrI8egg9ph4LYUaBBlDZCzpg8UU8aiRJZCKB41TOrxZ/y1Kcf8qgnKLJ4e5ZDyGl2l89uKRYw5nLDHf6srLqidG++x5A3yecMOss7KzLzquur8+oLyxpy+WVkeyh3CG6dxSy5091NbmJ/Jf8rgB7lpXOLKSokH+G+sxfQWexgDakpTIo+s2pqFZ8CjQZ7OuqzLIXeknIxVdI/a5RYwVAxqbe8flZdcWF5bmmBO4f9FakwIePrBJ0xzZXuanAzLaQl9TCvuoqEgJAW7y7IVMcpRJWoCXVoMfok4JxYv4ndHMZNIs7ZEJkAKzl0SUUPrC89dkWi6RjslYAnCnKgfahG37JsVxemRIjlrl3LWvQ1Q+0BTD2AxC1i9pTnyAyNKUjIwCyZXXJ2hccsIqWldmVvnaHr5qvbUvaoVvA9KW1X39xlqOtdWYtPER8AUOtLrtpyXwr+a5y83MrEElHVsKmkpvjKa12aD0WmultylzrGvDk0ZsajOgPUPAEx5IwniAzND0OjpsknAR8FusyT2B1yT3RImXoyR5Aa08zgIhA278I+KEGtSc8D52W1s1KhYBMbodCWONCAP/nxJQqVkePrF9y9um763qfeOnftceV9a54pDeMMi0XQ6RrXHJ4778kH71zduDCxpbK30dt1w91dlbMb87wNsxYs1yFjz/b7F244+8pD29oTi9hvt+xtL+0pwinF5UUGd3PuvDuWhiOL9x1/bP6qxxJ7XTWzqqZ/a/0kV+2squDSeV0RtxqT2wbz9AKyQaoD9L+ZhKcKBA+CtkHtZAQjmnlCEvQkAtkzLD07O3r6QPCX42DIxWI73VBkG/IBnyTya3Nq7Wn2NFbKSEu3Z6dKnpS/4l1lsze0Z+SV51mdaX+dfHCywZXiCQWsjkwdi1ndU9O6dg5WJ9CxdmfApkYo40N4D6Nc3MWd05mfZfQMb7ZaxTKjLV2XblROfdAuX92RaivJyatIk3AdxiJnKApHvf6prhSoUP8B5ttW7VfiL6cYuVmvn9/7Ct5tu4Njbs6gY1f1kG50KzqF/gP9Znz8tXaMQh1kOfYmjyFK6qEKwlq4gETWUFVSAhWAB2AyinEIq1wnQNwcgihoxyjUU0x5SX3NXuFi3ICbQJ6GQ1K1n5oYaSNAPzY3DtLGcb16EmrMA0vMmOpJKD4SKsehIOhEXvrNi+J9BTU1BYmhbL3FJAnlfT4mLd3AMgbDDyxFdj5d5IQ8v4cTAaSCQHXZ2RK9zWbmmQyTEev0OtwlpqUEGNmQYdbVbmlm7Vl2hpTNCzXVlog8q+eP6+1WWj6d0aXo8FQoj4V0kyl95Gsa3MzrzZlmizOTY3O8Ll7QnY/RJb1exFG9+OLzOt3zL+j0SkwUojUF8WhBDW285nq1cZZnU35oLTHzLNZzVptk4BkeW3I8OTYgNVKvI5MTGJ1ON1nQyQl10BVzaR9oUW91Y02Jblw37BzH6fQi7hB0pnS2Kd105dbIQJMTk53v4WGYzBBR6vBhnVv3LZ3xqP52w72QcOgor7kPxcQhUPOTmMCOkJ6V9KkRqx6H7MwxvDRxUfk3vJDBCqQZjBcqHI4r/5a4iJcq9+Jl31ZYhf22KCq/UX6OHYnXsVP5D+V9XIAblU+VJ9kdyu9xAy6Mu5TfLlmvvIEr1y+hJm9Cv2KM6tFqu7kon3oYNNtDIaZHljx4vI4MnJqKSawyIxXt8lTmMDGFGOJpzAfhg/FnpKKOsNlnNvss1R1FpsRkunY1tdfV1g60V+YanW0b+hq3NRA2yJP4tlg8hqPA4g8VL+wOYowVhimd3Mc8R6duB2/Ib+xdsLRi2h3XtKXzVG+l/0PnBS3y6KZLsXlA01wlNd5F67y9iZ3opZ1od+M1DFKORe1/dDSPabtuHEkaBNIx5+m+bUVDw4rbukNL53Y6HJ19S0PTb1vZWOZylVdtagot7SOZc5cmDpXPbsrPb+qtqOgl19nM28kM9TqbVTKCHpM39fGfpnpNnmDGG29kGO2uDJPP8NPHDX5TRo7dmPEmfyNpijSZHeoqL+8KZZM4JWaru6TErbzoCyRzE/dCjeVqU6MtaPezy8m9w+zMK0o3njljTC/Ky7RevGjNlLIthnTjBx8Y0w3W7AzIg/mNokniWfF5lIKMgOdb1UgQ6qKgNGCW7BI9OSLSkyNYJP4MUB6B+yenFPiKXbTZ4YvwL36HJa/M6SzLswz/OyUF/OvvnX96iyCyDCsK6/gLTW9LPuuUd3c2NE3esSAcXrBjMt/9P1mhsmdvfBAKXSRvJoi++d7r5/e/wi1SOOVjIy5iKjKUUxm5kpSXgQuVyi+ynRW2F7Y/mMa8FR7cMZnU9N7jza/llU1+d2d2TU6KGqsBckv8A8gtFlUDClyctCKpJGDXJBWJdbzciAQocHQi+NFBey8dtAuTUdusqs1oWbivKc/XMK1AMpXn28uKfWmB/oqqnjp3oK6tLiBl+y2ezkz3ZOY5Ar3ovyJa0fyO5LNNfV9uaO7cuSASWbCzk+/+c1ZWlf357d9PE74kooi7zRudF6qf0RB0GwM2f0GaPdf8qDPbXdcTbLqqvrCgPM+Wa9FnZT5kMCirCXa7CPN/7Z+znZXW2I4fpL9NKu3cuTDy/hPR16VCe+dvbqpv0WQ6nZsU2Fm1qJGes/nGA/bRzeOlh220E7e2Ju1/44i8/A0HOPLOtLa0zDTgQjsSzZRWVh/p2re0ftcNrXvbOPQNB/NYZx0ewQx+mQru20w4l7FH1/dtlQ1ccpwf0nGWU//7wiuOU7zSOCk5X4rD1E2h+aCSsU5jJM8saX5L8l9G3U5nlY2S98j0ogafJPkairRr4n5KOs1Vs9uCeUDcwbbZVV3XTfP7p103thXWUWp/8cYktXduV6ldKrBr5B4PT5/r8cyZEQqR69wZIfYLSju7vI3d8waLiwfndTd6p20+2NJycPO05N6IimfEGMwL0UhnXjorwpUW36auPZkBs11Sj/+Tc2XkhBlgV2AUKp8gx8r47Za8UqezFKZkQfMbeYWdp3c01U9WT+lO5mf8tzNc8vS2E2kXcsjwX74WeAMnigc2fEen5yF97He7dak8K6RvexbIAGZhBCZ43X9nhYqe33bC+EYI6iB1vfNY8396Syef3lEXZf72+nn5Fbxfj49XLKrAzmpnIq5nXFmR7NI5pYotjZ1uUrzZkZyaGvzz9FHecJbyBj2yoBqNN1BI+o/pY5TbqeDzdryPvYh2sz8ZpYPFf5fLqTs7CTKVmy5d6L/H1sb4NQuy3Am6mNbvUCBkD4mhSIj/p3u/E9/wl7ff/ki5mz31Tfv/BeHNeJnr3tTnmGPcU2n35iobvvkgkLov1XFkwOz7UAWarVHglTAIM2bN/MZjYy6YijrDpnyTJWAJthdJ44DJnC1TPRos4YRvOGTOUbJwRhBgmYKZ0s4+5hE6A9s4w/StR6eoaEVZ+c+u44dU7hJ70OwrcSX4vjJbsuJxcowoGiFh/MEgkF1XYkmuRrc6sO2dozzppCBeyKQs6MTg7UNVxXNunuvv9nb2hqZVZTrDs2r8k3Nz6q/AiXQCvmRkKityN7qZv1Cxvatp3d3zem9bGjFI9xcXtM2tCA60F5gtj6SISZ78sSZ7SORiyz8leyARIGZWKnciboAV/E5iHHQSibOsGVbRNuU9uaGpU11FGOyXWVmV9ueAf460SH7z3Wa/lHifUoNlb8HpkmNnj6sjVEBurfuSjPDU9u+nvxVeuKMTxhf5zePNvyLje29nfcv5mffOZLrv7cYjdAffo/ue+HAKo6QksbZ6dtWNCiE9F61Dt6DDVF+0u3gSxc+JmsOJOKGbMLb7mYDIwrhwSD1XL2lKMy/9wwwf/aYapmqxgic4EAlHQDLxcnhNOLNz5sxoQUF05szOTLitGKogkZoVQ4mbvh9ZHzrxyiH/i9xvy3YdPBCBR/AXXFwl1Xd01vkm5DW0X55HyyloNOmr6+yol6oWB2mRRPWNdQyjS8tIMwgxnY5Lz8wrCXviUU+4JC8zndPpREH5FKfwe3GK8ilIxTMpL+BNL6QkmvXfEZQP3/QWO/QCrygiL4iMQXK4C3BfMnMEMnWMwZTpGZc5ruSTyURmZoHbIRkYUeBF5W2RV+5gPkkBdS/YEC5Q/WEHQK/fCHy0Fc1A/aCNcaOMRsTh8WcZ6Dna0b3Gj/0zoeoAECOwKLskiD54JeCBZ3aecrAIDV+HhvBfXOGA3V4QcuW6lF/Y7YGQyxUqsKcZlF9ADqTsgbAru9qCMU8KkRweI0t14nPeIHidykXeznxp5y4ip1cAjfWjxMPMHO7QSBV5zRUK2I34am8JSZCarYWS8h0jbQMatVqOWjJoE1BxBtxYmckMxySeN2TCgxKvt8SScTTTwEyCTDTO1sFSPdELe1OVLl5z0OwVGBGoFY93lxqZQCRwyelsyRNShcpDxz848eLxnBq3d3I++/9aNxYVbWzV/sHXsS+/ZEa9SwkabqG5Q69J6FnhgPLZgVtxxq2JrrogXh6sI/+mi7x58K678MGxf7Qls1EZ/X9SC4JLAAAAeJxjYGRgYGCqCC6p8Y6I57f5ysDNwQAC+/8ebADRV6c8/gCiORjA4pwMTCAKAEkOCmgAAHicY2BkYOBgAAE4yciACpgAAsoAHQAAAHicY9ViWMbBAAcNIMzIwMAK5jEz/IOIgDhMqxkYGCFqGhgcwJCBoZ7Bj5GBsQFhAISNTKKBBsZgIHkAYiaUZGB0ALMcwRwHuNpSIE4Du4eBUQts4wKwrANWCBQHAH18EuIAAAAAAAAWAC4BSAHwAp4DDgNuA5oDzgRcBRYFuAZ2BxoHige8CEgIbAisCNAJAglCCiQKiAqyCzoLsAwkDNoNPg2UDi4OhA60DvQPPg9SD5oP2hAcEEgQ1hEyEXoR9BJKEpoSwhMyE2IUABREFKIU1BV+FaAWEhaEFrYXLBeAF9wYrBj+GXQZ0BoIGnwbHhs+G7QcXB0yHegegh7UHxIfmB/UIHog5iEcIXoh+CMcI1gjuCRoJNYlZCXYJmQm5CdAJ6QoJCiiKQ4p5CpuKsh4nGNgZGBgSGW4wSDIAAKMYJILiFMYI0FMACaDAhkAAHictVRPixs3FH9eO9ktaZYSKOSoQymbxYwTdyE0OS1Jc8peNmEhl4I8I8+IjEdC0mSY0kOPOfRj9BLopygt9NhzP0HPPfXY95409m7shm2hHkbz09P7+3tPBoC7o89hBPH3Bb4Rj+AO7iLeg334KuExyp8nPEH8dcI34GOwCd+ET+DbhPfhS/g+4QP4FH5J+BYcw+8J3x79PJokfAjHe79ilNHkI9wVe38mPILPxhcJ78Hh+JuExyh/m/AE8Y8J34C7498Svgli/EfC++AmBwkfwPFk8HMLXk5+SPj2+O3kr4QP4eXBdz+9E/P7D07Emc6d8WYZxBPjrHEyaNNk4rSuxbkuq+DFufLKvVFF9kwunM7F2dPnc3HqvQr+XJVtLd32wbbkQjmPnsU8O3kYT+kwnr1QpVFCeyFFcLJQK+leC7MUoVKX8iudaS2Jc7OystHKZzuTr0Kwj2azruuy1XCeoc0s9NaUTtqqny1NE/xsY+5ba2utCkEHmXhlWrGSvWi9wiQwMRKLYETulAxqKgrtbS37qZBNIazTeJqjisKv9MIqt9IhoLtFz0XUOlcN+cIDL4wbwJIiTLdLtc4UbR6mgphH2ynZDAF0I7pK59WlzDoMqpu8bgts0zp709S9ONL3hFotMJeNOnr4ULasXuimFE75gJ0iVjcByHzt6zEzcKQxSlAraoHTGLUwXVMbWVxlT0aqlKNyDIbCtQ22DaJQVCbpVKq2VxnFYWz6pE4NQYfIT6UXGnPOrt9teAcC5nAfHsAJojPQkIMDAx7fJQSUPUHk8M7TKlGiETWQ4ckp1PgIOEdZCRWeed4p/CrUfoNrgZrP0G6Be/JNMZ7iP8uc7T1rkh1ZldCiP4ma17G4js4F5+FTzlRphnU+vGI7WF62e8HZGFwF6lBVEt/ADBQoXXGWr1FGLNFJxbq7+Ct53yKDg3aO3xXuJeakma3sXzBPPAeUPoIZPh0/Gfp73z5LcWaIe/ZSsh+LHnqULtkbVTvbGd1zzhY7ormPYm1BvX/FNQlmosdvy9xFJiJjgzbJDFftUIPqUDDFfcF6ljves4T4oDiWOxNt8+RFpb1k35b7SjUHPiOrBecxdKLmishqyCtaeO6C25Is1zVMr9VVy/sCbXLcT5mvOPMx7nQd5/0KNE9ixzzluO7mrEuVknaO1bQ8d8VO7smmZnSE+vfwSxO6SLzs8h5z+K/cbrwX7KlEmeM5DulODbO6q4Ih+nZejy/NAFUSawkcb7gF5D/WWqCk48oN38oPzZ68MlWK+2LSGquKuOWb1bIlZTt0c/BDmjXf5H+e0fjP2KTObLwPN0Qnlml+KN8FMx17+z/c7b8BMu44jgAAeJxjYGYAg/9+DOUMmCAVACmPAi14nNvAoM2wiZGTSZtxExeI3M7Vmhtqq8rAob2dOzXYQU8GxOKJ8LDQkASxeJ3NteWFQSw+HRUZER4Qi19OQpiPA8QS4OPhZGcBsQTBAMQS2jChIMAAyGLYzgg3mgluNDPcaBa40axwo9nkJKFGs8ON5oAbzQk3epMwI7v2BgYF19pMCRcAxAEoGgAAAA==') format('woff')`, 
+    },
+    icons: {
+      'ReminderGroup': '\uEBF8',
+      'Umbrella': '\uEC04',
+      'NetworkTower': '\uEC05',
+      'CityNext': '\uEC06',
+      'Section': '\uEC0C',
+      'OneNoteLogoInverse': '\uEC0D',
+      'ToggleFilled': '\uEC11',
+      'ToggleBorder': '\uEC12',
+      'SliderThumb': '\uEC13',
+      'ToggleThumb': '\uEC14',
+      'Documentation': '\uEC17',
+      'Badge': '\uEC1B',
+      'Giftbox': '\uEC1F',
+      'VisualStudioLogo': '\uEC22',
+      'ExcelLogoInverse': '\uEC28',
+      'WordLogoInverse': '\uEC29',
+      'PowerPointLogoInverse': '\uEC2A',
+      'Cafe': '\uEC32',
+      'SpeedHigh': '\uEC4A',
+      'ThisPC': '\uEC4E',
+      'MusicNote': '\uEC4F',
+      'MicOff': '\uEC54',
+      'EdgeLogo': '\uEC60',
+      'CompletedSolid': '\uEC61',
+      'AlbumRemove': '\uEC62',
+      'MessageFill': '\uEC70',
+      'TabletSelected': '\uEC74',
+      'MobileSelected': '\uEC75',
+      'LaptopSelected': '\uEC76',
+      'TVMonitorSelected': '\uEC77',
+      'DeveloperTools': '\uEC7A',
+      'InsertTextBox': '\uEC7D',
+      'LowerBrightness': '\uEC8A',
+      'CloudUpload': '\uEC8E',
+      'ScrollUpDown': '\uEC8F',
+      'DateTime': '\uEC92',
+      'Event': '\uECA3',
+      'Cake': '\uECA4',
+      'Org': '\uECA6',
+      'PartyLeader': '\uECA7',
+      'DRM': '\uECA8',
+      'CloudAdd': '\uECA9',
+      'AppIconDefault': '\uECAA',
+      'Photo2Add': '\uECAB',
+      'Photo2Remove': '\uECAC',
+      'POI': '\uECAF',
+      'FacebookLogo': '\uECB3',
+      'AddTo': '\uECC8',
+      'RadioBtnOff': '\uECCA',
+      'RadioBtnOn': '\uECCB',
+      'ExploreContent': '\uECCD',
+      'VideoSolid': '\uEA0C',
+      'Teamwork': '\uEA12',
+      'PeopleAdd': '\uEA15',
+      'Glasses': '\uEA16',
+      'DateTime2': '\uEA17',
+      'Shield': '\uEA18',
+      'Header1': '\uEA19',
+      'PageAdd': '\uEA1A',
+      'NumberedList': '\uEA1C',
+      'PowerBILogo': '\uEA1E',
+      'Product': '\uECDC',
+      'ProgressLoopInner': '\uECDE',
+      'ProgressLoopOuter': '\uECDF',
+      'Blocked2': '\uECE4',
+      'FangBody': '\uECEB',
+      'Glimmer': '\uECF4',
+      'ChatInviteFriend': '\uECFE',
+      'Crown': '\uED01',
+      'Feedback': '\uED15',
+      'SharepointLogoInverse': '\uED18',
+      'YammerLogo': '\uED19',
+      'Hide': '\uED1A',
+      'Uneditable': '\uED1D',
+      'ReturnToSession': '\uED24',
+      'OpenFolderHorizontal': '\uED25',
+      'CalendarMirrored': '\uED28',
+      'SwayLogoInverse': '\uED29',
+      'OutOfOffice': '\uED34',
+      'Trophy': '\uED3F',
+      'ReopenPages': '\uED50',
+      'AADLogo': '\uED68',
+      'AccessLogo': '\uED69',
+      'AdminALogoInverse32': '\uED6A',
+      'AdminCLogoInverse32': '\uED6B',
+      'AdminDLogoInverse32': '\uED6C',
+      'AdminELogoInverse32': '\uED6D',
+      'AdminLLogoInverse32': '\uED6E',
+      'AdminMLogoInverse32': '\uED6F',
+      'AdminOLogoInverse32': '\uED70',
+      'AdminPLogoInverse32': '\uED71',
+      'AdminSLogoInverse32': '\uED72',
+      'AdminYLogoInverse32': '\uED73',
+      'BoxLogo': '\uED75',
+      'DelveLogoInverse': '\uED76',
+      'DropboxLogo': '\uED77',
+      'ExchangeLogoInverse': '\uED78',
+      'LyncLogo': '\uED79',
+      'OfficeVideoLogoInverse': '\uED7A',
+      'ParatureLogo': '\uED7B'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-4.ts b/packages/icons/src/fabric-icons-4.ts
new file mode 100644
index 0000000000000..f95af49e34ffd
--- /dev/null
+++ b/packages/icons/src/fabric-icons-4.ts
@@ -0,0 +1,121 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-4"`,
+      src: `url('${baseUrl}fabric-icons-4-03329fef.woff') format('woff')`, 
+    },
+    icons: {
+      'ReminderGroup': '\uEBF8',
+      'Umbrella': '\uEC04',
+      'NetworkTower': '\uEC05',
+      'CityNext': '\uEC06',
+      'Section': '\uEC0C',
+      'OneNoteLogoInverse': '\uEC0D',
+      'ToggleFilled': '\uEC11',
+      'ToggleBorder': '\uEC12',
+      'SliderThumb': '\uEC13',
+      'ToggleThumb': '\uEC14',
+      'Documentation': '\uEC17',
+      'Badge': '\uEC1B',
+      'Giftbox': '\uEC1F',
+      'VisualStudioLogo': '\uEC22',
+      'ExcelLogoInverse': '\uEC28',
+      'WordLogoInverse': '\uEC29',
+      'PowerPointLogoInverse': '\uEC2A',
+      'Cafe': '\uEC32',
+      'SpeedHigh': '\uEC4A',
+      'ThisPC': '\uEC4E',
+      'MusicNote': '\uEC4F',
+      'MicOff': '\uEC54',
+      'EdgeLogo': '\uEC60',
+      'CompletedSolid': '\uEC61',
+      'AlbumRemove': '\uEC62',
+      'MessageFill': '\uEC70',
+      'TabletSelected': '\uEC74',
+      'MobileSelected': '\uEC75',
+      'LaptopSelected': '\uEC76',
+      'TVMonitorSelected': '\uEC77',
+      'DeveloperTools': '\uEC7A',
+      'InsertTextBox': '\uEC7D',
+      'LowerBrightness': '\uEC8A',
+      'CloudUpload': '\uEC8E',
+      'ScrollUpDown': '\uEC8F',
+      'DateTime': '\uEC92',
+      'Event': '\uECA3',
+      'Cake': '\uECA4',
+      'Org': '\uECA6',
+      'PartyLeader': '\uECA7',
+      'DRM': '\uECA8',
+      'CloudAdd': '\uECA9',
+      'AppIconDefault': '\uECAA',
+      'Photo2Add': '\uECAB',
+      'Photo2Remove': '\uECAC',
+      'POI': '\uECAF',
+      'FacebookLogo': '\uECB3',
+      'AddTo': '\uECC8',
+      'RadioBtnOff': '\uECCA',
+      'RadioBtnOn': '\uECCB',
+      'ExploreContent': '\uECCD',
+      'VideoSolid': '\uEA0C',
+      'Teamwork': '\uEA12',
+      'PeopleAdd': '\uEA15',
+      'Glasses': '\uEA16',
+      'DateTime2': '\uEA17',
+      'Shield': '\uEA18',
+      'Header1': '\uEA19',
+      'PageAdd': '\uEA1A',
+      'NumberedList': '\uEA1C',
+      'PowerBILogo': '\uEA1E',
+      'Product': '\uECDC',
+      'ProgressLoopInner': '\uECDE',
+      'ProgressLoopOuter': '\uECDF',
+      'Blocked2': '\uECE4',
+      'FangBody': '\uECEB',
+      'Glimmer': '\uECF4',
+      'ChatInviteFriend': '\uECFE',
+      'Crown': '\uED01',
+      'Feedback': '\uED15',
+      'SharepointLogoInverse': '\uED18',
+      'YammerLogo': '\uED19',
+      'Hide': '\uED1A',
+      'Uneditable': '\uED1D',
+      'ReturnToSession': '\uED24',
+      'OpenFolderHorizontal': '\uED25',
+      'CalendarMirrored': '\uED28',
+      'SwayLogoInverse': '\uED29',
+      'OutOfOffice': '\uED34',
+      'Trophy': '\uED3F',
+      'ReopenPages': '\uED50',
+      'AADLogo': '\uED68',
+      'AccessLogo': '\uED69',
+      'AdminALogoInverse32': '\uED6A',
+      'AdminCLogoInverse32': '\uED6B',
+      'AdminDLogoInverse32': '\uED6C',
+      'AdminELogoInverse32': '\uED6D',
+      'AdminLLogoInverse32': '\uED6E',
+      'AdminMLogoInverse32': '\uED6F',
+      'AdminOLogoInverse32': '\uED70',
+      'AdminPLogoInverse32': '\uED71',
+      'AdminSLogoInverse32': '\uED72',
+      'AdminYLogoInverse32': '\uED73',
+      'BoxLogo': '\uED75',
+      'DelveLogoInverse': '\uED76',
+      'DropboxLogo': '\uED77',
+      'ExchangeLogoInverse': '\uED78',
+      'LyncLogo': '\uED79',
+      'OfficeVideoLogoInverse': '\uED7A',
+      'ParatureLogo': '\uED7B'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-5-inline.ts b/packages/icons/src/fabric-icons-5-inline.ts
new file mode 100644
index 0000000000000..63b2c4440162d
--- /dev/null
+++ b/packages/icons/src/fabric-icons-5-inline.ts
@@ -0,0 +1,121 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-5"`,
+      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
+    },
+    icons: {
+      'SocialListeningLogo': '\uED7C',
+      'VisioLogoInverse': '\uED7D',
+      'Balloons': '\uED7E',
+      'Cat': '\uED7F',
+      'MailAlert': '\uED80',
+      'MailCheck': '\uED81',
+      'MailLowImportance': '\uED82',
+      'MailPause': '\uED83',
+      'MailRepeat': '\uED84',
+      'SecurityGroup': '\uED85',
+      'Table': '\uED86',
+      'VoicemailForward': '\uED87',
+      'VoicemailReply': '\uED88',
+      'Waffle': '\uED89',
+      'RemoveEvent': '\uED8A',
+      'EventInfo': '\uED8B',
+      'ForwardEvent': '\uED8C',
+      'WipePhone': '\uED8D',
+      'AddOnlineMeeting': '\uED8E',
+      'JoinOnlineMeeting': '\uED8F',
+      'RemoveLink': '\uED90',
+      'PeopleBlock': '\uED91',
+      'PeopleRepeat': '\uED92',
+      'PeopleAlert': '\uED93',
+      'PeoplePause': '\uED94',
+      'TransferCall': '\uED95',
+      'AddPhone': '\uED96',
+      'UnknownCall': '\uED97',
+      'NoteReply': '\uED98',
+      'NoteForward': '\uED99',
+      'NotePinned': '\uED9A',
+      'RemoveOccurrence': '\uED9B',
+      'Timeline': '\uED9C',
+      'EditNote': '\uED9D',
+      'CircleHalfFull': '\uED9E',
+      'Room': '\uED9F',
+      'Unsubscribe': '\uEDA0',
+      'Subscribe': '\uEDA1',
+      'RecurringTask': '\uEDB2',
+      'TaskManager': '\uEDB7',
+      'TaskManagerMirrored': '\uEDB8',
+      'Combine': '\uEDBB',
+      'Split': '\uEDBC',
+      'DoubleChevronUp': '\uEDBD',
+      'DoubleChevronLeft': '\uEDBE',
+      'DoubleChevronRight': '\uEDBF',
+      'TextBox': '\uEDC2',
+      'TextField': '\uEDC3',
+      'NumberField': '\uEDC4',
+      'Dropdown': '\uEDC5',
+      'BookingsLogo': '\uEDC7',
+      'ClassNotebookLogoInverse': '\uEDC8',
+      'DelveAnalyticsLogo': '\uEDCA',
+      'DocsLogoInverse': '\uEDCB',
+      'Dynamics365Logo': '\uEDCC',
+      'DynamicSMBLogo': '\uEDCD',
+      'OfficeAssistantLogo': '\uEDCE',
+      'OfficeStoreLogo': '\uEDCF',
+      'OneNoteEduLogoInverse': '\uEDD0',
+      'PlannerLogo': '\uEDD1',
+      'PowerApps': '\uEDD2',
+      'Suitcase': '\uEDD3',
+      'ProjectLogoInverse': '\uEDD4',
+      'CaretLeft8': '\uEDD5',
+      'CaretRight8': '\uEDD6',
+      'CaretUp8': '\uEDD7',
+      'CaretDown8': '\uEDD8',
+      'CaretLeftSolid8': '\uEDD9',
+      'CaretRightSolid8': '\uEDDA',
+      'CaretUpSolid8': '\uEDDB',
+      'CaretDownSolid8': '\uEDDC',
+      'ClearFormatting': '\uEDDD',
+      'Superscript': '\uEDDE',
+      'Subscript': '\uEDDF',
+      'Strikethrough': '\uEDE0',
+      'Export': '\uEDE1',
+      'ExportMirrored': '\uEDE2',
+      'SingleBookmark': '\uEDFF',
+      'DoubleChevronDown': '\uEE04',
+      'ReplyAll': '\uEE0A',
+      'GoogleDriveLogo': '\uEE0B',
+      'Questionnaire': '\uEE19',
+      'ReplyMirrored': '\uEE35',
+      'ReplyAllMirrored': '\uEE36',
+      'AddGroup': '\uEE3D',
+      'QuestionnaireMirrored': '\uEE4B',
+      'TemporaryUser': '\uEE58',
+      'CaretSolid16': '\uEE62',
+      'GroupedDescending': '\uEE66',
+      'GroupedAscending': '\uEE67',
+      'AwayStatus': '\uEE6A',
+      'MyMoviesTV': '\uEE6C',
+      'AustralianRules': '\uEE70',
+      'WifiEthernet': '\uEE77',
+      'DateTimeMirrored': '\uEE93',
+      'StopSolid': '\uEE95',
+      'DoubleChevronUp12': '\uEE96',
+      'DoubleChevronDown12': '\uEE97',
+      'DoubleChevronLeft12': '\uEE98',
+      'DoubleChevronRight12': '\uEE99'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-5.ts b/packages/icons/src/fabric-icons-5.ts
new file mode 100644
index 0000000000000..5eef18918ebdb
--- /dev/null
+++ b/packages/icons/src/fabric-icons-5.ts
@@ -0,0 +1,121 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-5"`,
+      src: `url('${baseUrl}fabric-icons-5-82c8b87c.woff') format('woff')`, 
+    },
+    icons: {
+      'SocialListeningLogo': '\uED7C',
+      'VisioLogoInverse': '\uED7D',
+      'Balloons': '\uED7E',
+      'Cat': '\uED7F',
+      'MailAlert': '\uED80',
+      'MailCheck': '\uED81',
+      'MailLowImportance': '\uED82',
+      'MailPause': '\uED83',
+      'MailRepeat': '\uED84',
+      'SecurityGroup': '\uED85',
+      'Table': '\uED86',
+      'VoicemailForward': '\uED87',
+      'VoicemailReply': '\uED88',
+      'Waffle': '\uED89',
+      'RemoveEvent': '\uED8A',
+      'EventInfo': '\uED8B',
+      'ForwardEvent': '\uED8C',
+      'WipePhone': '\uED8D',
+      'AddOnlineMeeting': '\uED8E',
+      'JoinOnlineMeeting': '\uED8F',
+      'RemoveLink': '\uED90',
+      'PeopleBlock': '\uED91',
+      'PeopleRepeat': '\uED92',
+      'PeopleAlert': '\uED93',
+      'PeoplePause': '\uED94',
+      'TransferCall': '\uED95',
+      'AddPhone': '\uED96',
+      'UnknownCall': '\uED97',
+      'NoteReply': '\uED98',
+      'NoteForward': '\uED99',
+      'NotePinned': '\uED9A',
+      'RemoveOccurrence': '\uED9B',
+      'Timeline': '\uED9C',
+      'EditNote': '\uED9D',
+      'CircleHalfFull': '\uED9E',
+      'Room': '\uED9F',
+      'Unsubscribe': '\uEDA0',
+      'Subscribe': '\uEDA1',
+      'RecurringTask': '\uEDB2',
+      'TaskManager': '\uEDB7',
+      'TaskManagerMirrored': '\uEDB8',
+      'Combine': '\uEDBB',
+      'Split': '\uEDBC',
+      'DoubleChevronUp': '\uEDBD',
+      'DoubleChevronLeft': '\uEDBE',
+      'DoubleChevronRight': '\uEDBF',
+      'TextBox': '\uEDC2',
+      'TextField': '\uEDC3',
+      'NumberField': '\uEDC4',
+      'Dropdown': '\uEDC5',
+      'BookingsLogo': '\uEDC7',
+      'ClassNotebookLogoInverse': '\uEDC8',
+      'DelveAnalyticsLogo': '\uEDCA',
+      'DocsLogoInverse': '\uEDCB',
+      'Dynamics365Logo': '\uEDCC',
+      'DynamicSMBLogo': '\uEDCD',
+      'OfficeAssistantLogo': '\uEDCE',
+      'OfficeStoreLogo': '\uEDCF',
+      'OneNoteEduLogoInverse': '\uEDD0',
+      'PlannerLogo': '\uEDD1',
+      'PowerApps': '\uEDD2',
+      'Suitcase': '\uEDD3',
+      'ProjectLogoInverse': '\uEDD4',
+      'CaretLeft8': '\uEDD5',
+      'CaretRight8': '\uEDD6',
+      'CaretUp8': '\uEDD7',
+      'CaretDown8': '\uEDD8',
+      'CaretLeftSolid8': '\uEDD9',
+      'CaretRightSolid8': '\uEDDA',
+      'CaretUpSolid8': '\uEDDB',
+      'CaretDownSolid8': '\uEDDC',
+      'ClearFormatting': '\uEDDD',
+      'Superscript': '\uEDDE',
+      'Subscript': '\uEDDF',
+      'Strikethrough': '\uEDE0',
+      'Export': '\uEDE1',
+      'ExportMirrored': '\uEDE2',
+      'SingleBookmark': '\uEDFF',
+      'DoubleChevronDown': '\uEE04',
+      'ReplyAll': '\uEE0A',
+      'GoogleDriveLogo': '\uEE0B',
+      'Questionnaire': '\uEE19',
+      'ReplyMirrored': '\uEE35',
+      'ReplyAllMirrored': '\uEE36',
+      'AddGroup': '\uEE3D',
+      'QuestionnaireMirrored': '\uEE4B',
+      'TemporaryUser': '\uEE58',
+      'CaretSolid16': '\uEE62',
+      'GroupedDescending': '\uEE66',
+      'GroupedAscending': '\uEE67',
+      'AwayStatus': '\uEE6A',
+      'MyMoviesTV': '\uEE6C',
+      'AustralianRules': '\uEE70',
+      'WifiEthernet': '\uEE77',
+      'DateTimeMirrored': '\uEE93',
+      'StopSolid': '\uEE95',
+      'DoubleChevronUp12': '\uEE96',
+      'DoubleChevronDown12': '\uEE97',
+      'DoubleChevronLeft12': '\uEE98',
+      'DoubleChevronRight12': '\uEE99'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-6-inline.ts b/packages/icons/src/fabric-icons-6-inline.ts
new file mode 100644
index 0000000000000..4eeabd25ec662
--- /dev/null
+++ b/packages/icons/src/fabric-icons-6-inline.ts
@@ -0,0 +1,121 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-6"`,
+      src: `url('data:application/octet-stream;base64,d09GRgABAAAAADGAAA4AAAAAXgAAAnhTAAAAAAAAAAAAAAAAAAAAAAAAAABPUy8yAAABRAAAAEgAAABgOOB3W2NtYXAAAAGMAAABkgAABDrnB+3cY3Z0IAAAAyAAAAAgAAAAKgnZCa9mcGdtAAADQAAAAPAAAAFZ/J7mjmdhc3AAAAQwAAAADAAAAAwACAAbZ2x5ZgAABDwAACcgAABJ3KJfNNhoZWFkAAArXAAAADUAAAA2/LBqwWhoZWEAACuUAAAAGgAAACQP/wgDaG10eAAAK7AAAABMAAAAzhgRC1dsb2NhAAAr/AAAAMwAAADMZkV5uG1heHAAACzIAAAAHgAAACAA4AH5bmFtZQAALOgAAAP2AAAJ+o2Z8E5wb3N0AAAw4AAAABQAAAAg/1EA3HByZXAAADD0AAAAiQAAANN4vfIOeJxjYGH/wTiBgZWBgXUWqzEDA6M0hGa+yJDGJMTBysrFyMQIBgxAIMCAAL7BCgoMDu9mfdDkAPMhJANYHQuEp8DAAAAHugjleJzVksdqFWAQhf9LJOszrlz4Aq6EIEEEQaPYNcmNvbck1th7BXt5AUUQBFcKgpAYjUYThKtiNJoi9t51vutevI7mDdxcHBjmnJk5w3/gTymVpL4cmDLpDxwSLPOX9ysZELU97U2lqcJPepNf8ma/7Fe8xa/6NW/1637D27zdc37Lb/td7/B7ft87/YE/9C7v9h7vdfc8ZQylgmqy1DCVaUxnBjOZxWzmMJd5zGcBC1nEYpawlFrqqGcZy1nBSlaxmgbWsJZ1rGcDG9nEZrawlW1sZwc72cVu9rCP/RzgIIc4zBGOcozjNJHjJ7/y/fODCoWUwkPjP3ogPJQX34PVW41VWdYmW7VNCDTWKm20TbGR0amKWmnjbZKNsYk2KuYjgg23cTbMymyw0DcV9EOuvL4G+xTovb7rTfRfRueZvuixPqs3Jl36qE59UEds3NE75fRWN2OzTa/VqldqCUWzXqhRz3UxlBf0VOf1RI90NvRn1KPT6tapuHNC5yLrVKusyvv+2P8emdJiv6D48RuOimTAAAB4nGPQYghlKGBoYFjFyMDYwOzAeIDBAYsIEAAAqhwHlXicXY+/TsNADMZzJLSEJ0A6IZ11KkOViJ3phksk1CUlDOelgNRKpO+AlIXFA8/ibhnzYgjMEf4utr/P+ny/c6f5yXx2nKVHKilWnDfhoNQLDurtmf35IU/vNmVhTNV5VvdlwWoJomtOF/VNsGjI0PWWTG0eH7acLWKXxY7w0nDShk7qbQB2qL/HHeJVPJLFI4QS30/xfYxL+rUsVobTiyasA/des/OoAUzFYxN49BoQf8ikP3VnE+NsOWXbwE5zgkSfygL3RJqE+0uPf/Wgkv+G+23Iv6tB9U3c9Bb0h2HBgrChl2fbUAkaYPkOhPxkxgABAAIACAAK//8AD3icrXwJfBvVue85s2jkJbYnkqxYtmXLsiTvsS3JcrwoymbHzmI7iTGRs2+QPRCy4CRkyEbasCVQmgLlchPChUJKy1oaUgyUcnvv60ZuC8Wvr/lRLq+3D1ooLZdY0vh+35kZW3aclOVZmTmzz1m+8//+3zIhHHmUEOGQuJPwRCIkJLtkj0t2Pcr/n/jz3POJdiLuHPz6vcJ8An9wnihmYiYkjdhJLikgbuIj5YRQuEN2Bf02WLRtmzsIC25T2KVwwihNClU+I1RRBKLEyBA8dIgocaLg1iVCiUhicCqmaKWkXILjigKnh+AkbAwqgqLC/aqCu4nhLaibmbJKQv2wLWkkk1hIDtTSo9XQY9TEWCRfyB6yJK0pMZFBIkK9OHgHR7SF//DDs9GF90ST1mbyGVGwviLUSCXaIixk5xKPJhfYb6nj1Guk/8avGywWmz/IJy0S1A3qx3qGJwmFw5ZDD/DYLexvuFomrJIysgjK6H0CV0B3mnFIjToFSRvWJehiC9RHxNEryuBs7kCYC1XRIBT+Widns5okJw9Hqzje6oRDYS4I2264VGLVGiJYMQ4qow1fjASXtpQoef62KpenpGVpEHc9rqo2f54Cu89Z3VW5uVVuq1EKrD95BZuLY0HwnsDqntkO95IavBf3a5a4HbN7Vgdwn5Lk26EkJAU7HtqnQB9XkwCpJ00kQmaS2WQutLLWKfhd2BTZLbuKMgS3SwbhlbGBtBYby7tdNqMPeOgPXEDCXbgvwcKtqJzmLymdXMBfxFcq8cKCyaUl/mmVaiE0H2tCL04qdubLcr6zeJJaCB2hsLFT2KApKMy4qAp2GDsmKZa8ojwL3ou7bCemwF34giGSItszM+1yCnRNDMczrt3HhpNtjW1zENocJtNJC2kn80e12We02XVZm1PYNPX7tFlM4QKUBuN3lVZzIIiXN1scoGdQWM+cwabCVIKrcEppjTeW5JY3K3TGFZsOgtUb94jQ2DPqAFViOPGpJv1a0432A3CQCUQmNpj/zdB+MtwubJZs8ctuaiyfq19MvaMbAm/EF+MSu/hFO0UZbkVsgCfYDoQb1hdw0PR5ewNaORqPfVdHYpG1y41iLF8dhfl+qokWSuV4AGychX+EYcmouTabrCU3jz/LLu9ZrBkgnc3NFlfQHfSzhVZRt2zNAFip4jTkscuIPnaahDc2wJ+rCCVP4srl/c9Do+Oa1GjQGT8sz67wRTpLSzsjPiz9lUrpvOn+LNUzweW0Wp2uCXqZJKk4b684NAl48QgsQzf5SqvVSEVrbW5ubWsFlhPpiUkVYa9aYs6alAX/zEYJXSmOkeMamMdjJPjLSa36hefv5aIqkc8rnowvjIdHXxSLtBYzLLJ9dQyiOgLhfPsyyGN0BGKPhjv/H3WNpn9t+CvlvqqqibM5OoK0AvlKymaIjKiaL8tpgDYArxlZRhiXgKoBtCEiD7CbL8NpviD/46/C/4Qk/rfwq9A/aRzZmEE6vgg6hlwpVPT7JCqn0BCV+SJvMFDnr80GHnYV2YB+HEc4OKjyIOCeR81V+/mBY+/Pir9OI/Thhynpd3i9DliSRQPaf2WMQ31B31dfPvN+C7dC7aVT1RUPDxFu3RBhz4EFmg76BcYERhFmSSbo41xouR8Gwg8/l2jDDZB9qq1dMqiaS9CXbAhQM9FeTvFAUzwJQCIUCxEEBNVQHIYIVVKC8UQORCfG5iKF0fYwnZiia0OKZIYyDXdp4HmTd/A5M47cnEvvPG/yoMTA3WyMzLgF2GuBPpaRHD8xWCpANUBPWsW3E9ax16VQGBiXdgVMLbgG5cJ0YLCU1cO4lmdPxOfhZdrFY87DY6hxCi8zE3aN1m8WmE+LyEYmMaDwRjSiZYwitIBE5VPQmz7UnUUmSdYLL65pBpWQwguWMAVdWsUVu4sEOFbHlCrfP/2mHr+/56bp03f01Nb27Jhe0hJwOgPItbXy0N9/89S+WYknLRUOrjh6fuXqV3qzCrPg34v/uvJclCt2VFgST87a99Rv/n77xre2/+jZ/Pt+q3587zfUv/72vvznXgpt3761llOSX4AvVEnyK7CUFPaMQwWq2zHZSl9we7we9VGO5zm6eK7HrbZZJzvo7wq02sT/tawqfPzTZ9asefrT481p9iI7jIwCUxN+MEIZ0HkeURY9oEmoT6aSjMIDYKECA2AYg2ZGpL9fJf39pogKQqUqEe4iJTAjdHt3gvShPgb1gOkdZCvZ8Y9HwiPRkB27mQ2IRRuGFIqjgEezsffZeAQmhuxQagepbdR42SUYSb5/6rZF1dWLtk01yrI59YWF9XPK9FLoiV5Sojds+ZuidYn60rnoSyuropU0O/H7dT+GgWm9q23Zi4vZcKiL2Sjdcqy3c5P92heW1a0HmpU0isLh3mYc3+3JL8RSJUmvZOVg1KREt0VmGKOVoA3uYrNZ/ZMg1VQnBiZaCpw4MDEXG683aO+J3u5fbM8vSE1VL1xgw9mGw7m7twaG+bL5AhMLNuPw06fDmPMwoPoZ7ZrL57ArhWdnE1buA+4DvFbqHiwV3xpvvqdQiz4/nxDf0h5p+mCwhPtAxxPE74FhPHEhCEtwYhhENMeFyfP8pXfEOXpdPdJAMgaFGLYlXTYWg9hKGhj1Hh/CBjLywedM3ucvDYx9z0g7UkGrEOoLibwPKueXRSuXwQnuouIqDgRzYpgrRgGTUL4yBJBQAYx2IWj67Ycl9Py9fR3xLTAh2g6fe08dvOMOdfC9c4fbcI+Kd/Z9sLl01dvb9vznG4/siER2PPLGe3u1bfFvHX33qjNK/qyGuDdU89HRt91BTbjXUN9XV4d3/eee5CdgtXnNdpE6QU8vJXdim4eNE7/HSXF6ScEwj9PKV4dTyyRp0yODh382a7YdpotPm4F1oTCPDdTmkZMWUCfvAf2JHgnWZg6vx7ucXCPVPBn6LSIZNnUU7prubu/MZfV51S5Ldlmzly+YtqypoD238tau7ApbTWeTW6jumeYr9BU12v+57eCaxs0b09u23t45qdre+vLGmuWVdzxsp3XRWVVq34SWdUqLf/nCmTn5na7wxo5KSms6Qk5fpHvy8lTJM3NFo71z05F53fc1c8OW1NKyby6rX39NY8qhFE9tQ37xjICLb1g7pyIra/ocUUyvm7ukhiuY0uUPrvWezKrKb1pzePb25ybPP7yyXjR19lom1r99gp9QP3+FOmtHd3VeoK1ioqV64eZms2wWyqZ3V0/unu5zTi2cunFR88S27Z1lTY36XADdeMqkwDiEmW6GMYAFtDO1ZgistynyUexkadjPE8Tec3Jo4yQYKxROeWdE199Qn11VVpRilrjeBOGzLG3LNm1aNbeyePryhuoli+YW+DquWRbsPr6xyQQsBNmeiIwvbcGBTdEFnRVySUVtbk7YoUzZVj9tfbSjc9GaXXMal05z51aFi77j8Rdk1K44Nlzne1mdZ46us+jkNWD2+oLZumdKcAdR2gOaEAUZLjMn1kjt+YUzQCt1HD67rPPhWV//fvONPYHKuWs3b6udfN3qa2f4oP6Nc29ran2oq/1r14fvOJhc+yLJv/DGluu+tc7vrPiXTQWR1TNnLWssmEAP0fT8+p5p4WvrHf6qb5YVl3b1dR173KPLPsINq382MFSCU9ZoAgUzmM0D6gcWYlSRmeDA3v9ppaI2CcB2RioAtBwFqJt/Alj67sRReD6YOHCHyeDBbG7RILBJXBjHpYrAPIcmksSf04bxJItUkNph39Eqso4cIA/Bc4A+gMIS3UW01m70tA+mYRXM07qptC4k+cKAdTh3fSGNWWRTd7CU2l2hUmpzw21UqgIxgtnHA75ZagUnN9F2GVpZtAETDLiiP5VS09LMdIuU5yrOt1JByBS4HM+kdMGcahKolJoqV5bkCSnNQtqWdkd9rro4y2YVtjdIaaIjzyGmqitfgD4pblUtbVweFX+kLksT6ZItYnGgeWpjVV6K4HBO2qH+6iZa/UuArj+cO9LWduTcHzQ0NPao6Q7lw58/fvP06Tc//vMPlaRtwJS88prKQiEiOQpceTJNpyme6mCO6PY5+Qk5abacPJ871SkW8Xnhg7Izk/aZCooLTTNXp06Qs3hJvWYf/HGnUhIPTU0NL9645foFAS7NxGdmTVD3J/57JmfmLo5bHb2qn628rEb6NvMlKPqYWogL7I+95C4YxyI2YgCCPr/dJ/ltFjZcodoCCiMYsvhCNr8vhAOcCTSlnFI/NeH4+DTsFHBos5G4ZIiIDoCqdqfor63z210ZPEKyjzphltWBLgI812Dbp4GzzGcUZpmcrpxMm02KvD55XuiF+Yv2N2UU/a4wq67B+U7YuXfv6Rl9gmVihqlbcmQe4XoOqR8fUP/f6VPqn25VX+FNjSv69u2oOPOYf61/+p766pv27d91nXdiYbrVnla2ue+Astuflp1Gud3tj3//e12LXjr/TDsV1vyp7+b/WsPVg91fPPf5lTf+qiu6euj2vveX03/PT6tr9KdkFRe70vyvNm89yR06E9nlpM61Fb+wViXee/TkdXtmp7iKi1LT0x/LyOTPx2atXLN2hXggIy+zYXn7lBKHlCuK1sYSas5yeP2FWWU5mbk5NnNhtXtSpolSd40zI7OovjR2S0tra4vpI2CcTeFr4PUbFsynXmQIEeKX+qWfwWScoNvPlYbP1oImH1hKzCHmYqyTucTQGyJrP8nGLETZZakLBnyo8yTe59VVXgG16H7riIAei5u+9frrb6l3i3flVKKbvDIncZ6LGIbuNPUAza1Rt3OkhheFjMxMUeL/YyMvCRMtmRz3+CMqo85UMb1GUz9bR1OByvoeePJ+et5SVJkzuNNRUWQxKbEIWIAASdwPFpyht0yD/r7Ai6LIT0hPFdQ/3SxMkGWBF7hX1U7k3gaHYXzdRKYiErK2gQEshMIiQoCvSkQUAFFDIADUAf0uAXapiF/9zrW7lRuutcoOS4ZZEMwZVkeWpefGA7vX5uev3X3gxh6LcWaC1SFnTolMtS7/kQTgiQ0GI3MGJ6VZ861yeF7PgtZJ9tkLezrCsiXXki5xnJQOG3J4fs/C1kmTWhdeMz8sZ9qzUvn01NEcMpcE0SIYH8g0ZyUQOcM6kIGI0GyBXAVm6M+zfU65UP29nF+Sbffly1mZdFqhmVwNAwYXyk5fdmUhdXHp2SVo7pdkJ96wlWaq/YWaX8SkjOOrIcwnkrR4dD8JbxxjkTD0JWglZT4aEBhF81mjmYXeEjDHycg5oDMxwryscWXkGGO2yKVl0C+WURHEsDbyrtqwOWQpZRa7ixpuIhB+XGRYXDxADO+3uJj3w+3i3Rak7fQHdNqm46efeuyBPQszjsSX8Pkd9PpLmlN75G/w191KhNq60W2P/gk82Q1CAKrQVlwdaqwPlOaJ6ta/qMc15+2Q5nCiRF8jF0evBjrTksY/k8mtBYxMESwJXkyhHj4F8M8OehGUobYGrIQNbQ2nYENbwynYCFOTskItRH+GWrgC+2oFvYgeSnpxBVXiry8/t8zqleecaG8/MWei17Ls3PKaVbW1q2qucJwf7ymq9gY1Q/Zax33AFY4zHw40l/GVZjIX2PoGzQIGzGeDgP4oUCWjS5i+lLm3ChjdKqAudgDIAtwA1IuO2kVbmNe2UeNIpv5JVd78FLHAW+a2ex0xxeGV7XZR3TtS2t1lXqdJ7qrmFHZtw7NaEftjAxykM0o5WUooUhZ3jHt7zBH3LLc4++vGXtmk6hxBycr1ZWfMW71lxUxzrseTmx5oqssYLsyzlm9dMy+jcgpedZKt7q+cstk0Id2knhgixvaS55eAbLDNLRElQtLRxmHYNp6PtJxMhn4ERhZCdmbMN9j3BzV/8Hj7HM4tdF3EtEmFo4sHPht/18QEf0jzeDNPsOZYvfqRpFiajhkWkgd2cADm6TSNTeLP4tL4n1znp2w+llMW5ffAz2VEacqB2waZtoLDNmyE5nph7heqNK2/vSMCf4m22mlTA1NM2y4xHSP440U1S1vKPZHFgXfvFj9K6IF+kQERBm6UzmPrm7K5/8hWj5eH6ivfoEWD82hns7A9RH8aW+oIdoWmzK+2JZTf0dMAVD8NDSpNL4msjZrteZD5ZI3YCucLuexSCrVLLt/nDK2cp83qa9HTiTWno+prtDl6mnvwdCzxBWMTXEJ9DZ9yOkqb8Rmnhd8NO1/jGAJne7AlKpdFV7S4Gz8cw6+Esekgi40Yvs3l0YP07vFj+J4xsfvRnYBtZ83WQvqaX179oRGzD44X0VfPXBbJfwV7qfd0YsvpXuyl3tPcidP0fuUSqgqixRF/ORzGHz/Mf8eY2H7i3cv6LBZR+H7QONAhAosBDIHc5rOxnZbsrfP6qMmN8BTSnQBjHXeipCseLeIEsNxx+/VNTdff3tF0Y7U6xwLob6HPuoub1h/rNGqol4kzSuJuvpfzgIgmYApSjzogMPlGSS12q3MtoDws9LnqG5s6bl/flFCSbta6E2y2xMAATN1B6BrqIYxoSP26/xHxwk9CpBH0zQyy/nP4g8Gc5DHCDfJgAavMQ30wuKBcwcK0aPcK+WCdBQzjWBcTvn/p6b6Wlr7TS41yjG/4AEMVlSn1PerHUZolhNWPe2lW7JVe9aOoeK+iRLBBeeW15XkKWxvjh402keRnY5kghkPYeAsPjx6EF/CgectoVlT9+Dn1o16aGXu1F16o/hBOYLdVtdRXVlTlV1dPnsU2DFHBtyfHHtKIzJCXDPNmLTMpyFBVW2NMnGAsfAg4DW7xwGqogmsRPYJoNaP7Dc6zmBheqhfIgbRYByWj8J5YELtxGunWN4sajSxgnWFELa6HkHA+D8GGdEA6C+fcmFuVQkM4ak6aR01Wk9XmaqLegLcJbG2LnQcMtrhoyOLi4Se7+Ih6T5RaOEuUXqDw95mC6z+v/Rk9pXDVCj2lfrL2u+pjSqJaUR8zKcL7dHNU/RAuj32fq+vetH3b0mmpqdOWbtu+qbuO4/5tXeIkqgO+dG3sr1qyynCsn/HeUpDGOYA4112F/wa8yHpAO0jAcjxW9NGFcALCUXEMAOlRC+BDYF7adQsS+BJMWR8jzIaDcayXUsiw25tvbna5PrHbL5GRbap0Hfvhhg0/PNZllHzurDtnz75zlrXEunLD+lWqY3h31foNK83j+0D1N8fJyJWdox6De8lvgZL7o92uV2SwY3gTZQR4MMdilBLM7xwtNsm7wcKW0jhRd0wBkwTryg4WnRYKkEJCgTq9+3Z0E7Zv2PTss/zZsrZggTMv4VdvW8b9LG/OYltpQYYjNTG36DaMiwEhL15PZ3F5ifcO5gday33tcOkyejP3v/Icn9qchR4zXHpbEfM7v89ZJMW0mbFzICKoAKgLbKReeiKauMBVRtUt4hmE6s1RrhJ3Nxu6h+i5J6Wge2pAFtagHDBizkKUwz4iCZgBm3KofDRkZcE+l5HLoDl7ymmRKZ9anZQ5jjRLt8ibQeFYtp9G9PCk8M7GVdGdrXl5rTujqzaykA3TqzD74orBLAB+ySBMRkFp397d6M7Kcjd2b2+HRzh8lRMNkJhY6YMDwnC0klNqKu/53qtLl776vXsqa5jkM63LY9oATNMYmsks4w51YeDam5RDTU2HlJuuDXgdSl5uKtWi6XgLTc3NU1j8E/PsFKajcwG/jcwAFv1F/AXsFlhQbgx284AZTBeLSA4xGRBTH/pXPvttZUlt7RLl28+uTN7e9eaDvb0PvrlLL7dwZxK9b0bVe2B+8xc0s10lTIVL5PK7te0YSXoCKwGZLkTpZnjIBVBKmGyp5RylSp/CuPtAE20k+9GblCHo/IIf4Rcw7E4Ww6JjpzkDA8lnYiuY25Iv5GUrhIWQvY6tAAFCdikbVmPzfXhy7SN37lhYpbQefGFr/eKwq/PYuQ0bzh3rdIUX18+6pa5n8UVVQgWNWtbQv+KgybS3Zq/bH9jldxYUOP27An43HBj3qNo+JvgpkKqFO+585NodF1++x1e8bNu+Gfg+fO+MfduWFTvm1S5fcC1H8EVJL4599x++aeSo+suxkVBtjinSWLudGLbAsI1u2OwKmwAKy9kyoXtEP2DGmaGnV8QU4ygHSiyuMG6nx58ijGuw+BuVgXh8FgHjGg5qus2Q4xHdhl6n4ToEXSyCBkImspmiKbhBhU1LRVuYQsZ38fgs0z7g3ywbIOhK4UIpYJChj5uC7KpKgo9yp0H7sqQVhTsDE1CNJpax2XeGaDlSY3ORP1ce8ufLP/5HecdJ9lEKsMy5pIesIzeQfeQo1EK0eOCfK5d6mFc0ZMugo0Nxmq40Se6gH712Licv8b4wMFKvz4X+1Gw7reJ9Tt6OU0tyVYliBi+5wjy12l1IXOtCLpMFTsNF0l/UT9epf1c/Xat+SjtWLo9LZmdFQ2t3TfF0R2GkcFxnkdfzXK/Ho36Dmk08d4slxWxOSRThWjjp3XToge7ixkpXulpc093aUOE0c09rT1Sf7H7g0CYvnZfuqmxMvOGhG83wp37D0zNyEx16XX3jlVdpw+u0Tv23Wz3X37gtGiqa9LQgjK6B7spa/coSZc/hw3vSZ3fNkNStSmT/tGn7I9qaU7ru3tmbX7Ntd18TR0LRbTde79GeV5Pfu/Purqa+3dvi7x7eo129JxEbuVyTsQiJjMSTZRoZLc/8sF88D/RXRRKbDhp4oxtDvJ1Jj0/PQqMSMUi7oUjUgVOaDXjqpDJ4XtBsAJR2tAG07GXG7w0SbFguKmY3JQYSPoWqHMsmoh7y5XWGJYWCBRd0+b6UzniPbgby+GailzvzJn/2S+sM/qx6DzzngnJhRGeMbk+QTCHNul121fagrRKye75MY+jXo6rlw+g9QuTLN6RSe8T7w83Q7AkmMzJYlwHgvlrUWkccLX6dA2Dj1mAHvSFBvxaAlnxavDnIXAh2DJN4fTY3IpSTAiCCvFDCzB2isDRxxGYT1PlHlUfmNK5fVJ+6P6Nzx70Leh+dqvY3bEjeh6bBRRyavyyblSW56KjFcgCVppklrasasruOrqlvnf61BEneo3gaHXzrdB5oxryZYSbIp2ApKbGBETq4Ra2kF9jOKFpI71Er1Uq2p+UvccxnmEEcwBXK4JkjkVckuEnslspA84OY7wn2dwp1mZ7Im+Mtm80YbhAYLn/HCL3l2/Ij7jgqlCol/qZA+BsuOYXWPEd+YHbZMM1NH+G44pNq2JZrPqBOoy/HjyoiSbxBX0zmr1kwli6wYXaR2zQUyNcS1JDK8K5hgWQ6hFEZHdCBs6CJciV0R08vs32ABbm1XASqWTdaIAwsG6phuU+DfHQCM5gAWQPImEOJgRfM/Q6qFO0LwHT4F1hb0wVGx7SpV4L49MzGcr4MjA5TqnAwe/nBf+5Bw4RjJkyptWZtQHtCYrGclSV/ohkoAkMq7YMErAgIjoFwQ8wUx0eYzQdNErsl5dYroHpnR2iF98AeeM9Ej6X7jnX1UG8+m5lA+ttizw/XgJlRpXq+G/PJFYMt0UFWj8qQ9I544qTLUiQ/v3tnTLpkQ0tyrvhrSrz5cg+dKWK4JSZHfepSzQN0ypE7TopccnL4mUABZ75K6qTh58h1qMs0v9BpX3Ty+ClxmNOW5FdgvAtRRvclSCwTU6dxms9Ij/eO9Rl1fBGfka2U09xGog9gAKBYHE7PkV2f00XEMdSNKSOOIn5yL82Kxq5DP5EEXaLhFHpVPr9PSCDDTqHeXpoZjeehT+gn+pOGhvMrJKLnz2uxJUwqYzocaao44EHljDMrRoSBuMeE3m9PrJeH3o7p/OCgpEI/TgBuWT7WRyyPxX3K8jc03DeN5/UcvJ8DJjuM8TFigPxlPmDudwj9GnpDbYax3PBbm9BvPYl5s0JM5eu1ApHwySmsaimcaXX0cgf1Z4Nm4LosmxtodCb3MfzwbPLrMZancC+qU+kr8VbkvEfp7sviAcj/J5ES4CaNWgwjeUkxggAWP/zcvP6z+JmrLcgi0iwawLJeR0x2XNRnuHlaCGAGXXjD7utmcV1bermWbbt2mixxRUtk1+xvHkMcqJJZnM5YJJJ4ZiQQEPeq34SrjtA+bIVKEq8J7GsMkhQQgL/0y9pmxGlKSB1pYd/FQbs8MNgevaRjSn6kzXY/b3FLbp/bwrMWs+h9UosxSqN9IjduOc/ogAjX99ir5x/q4zae/cFPHzc1sjhNctuTPzBhSUJ6Io+CxCG5G2Lr/4vOoM3vv6/2w4+M2wciAVpsQvsP8beBzCbXJEX5MqgggZB7i/X8jzCvxeM5uyXMo49OZnBMfWCnyJi058Utvj+rqqosfebdR3YtDqx7UY1/W3lITby4LrB415G7ZqWXVVVOnnpEubGndsF9vz6oVK+Mdrrav7tm9n2395U7ZpZ4etdtrjv46/sWZKbV3nr8W21mYs1zpgZvP/XMufPRh9Vn1kpqgvLS2mfUh6Pnzz1z6vZgqjPP2l+59/ipx7/TdfgXx7sk/vt8flXYvfLZ2fHd+Q2Lm6bvafDNChQK8Selrrt/ccQdKpzSFXRQotuTHMOMNLAkS0GykXEbefagVSj7GAOJCqxTeMkn4bQTQ7Ir5LcM++yQ4EhJzMY07F0aVLj/XRj/sZnkTXODndmPsXQq9n7n0Sd6E79RI2BsqvOVp5Ukn563rK2u4BsjzEc0MvRj7wA8JF7Kdprp0UQvfRlFR433PvHod3q5cnXqJ/gkrkEnQ7vhUUCOWpeNcvsRDr/cAuUxCGJvRS+zD1geld262czWAlE/jNKz9GxU/RAj/0BBMKwoIJM2sVPqwii1xPp47ctGdIsbfanNpwziBHkqB2kidHQfGYmEFKxa4EQpnAeMWc+VbDAzqa0eHEjc9pDoqd4zvaWvN6i46ueWe6fUVORQT05Vse3STzaedAtT1IFYNW1LrYwsqBLVce20V2k4esr0vel74IEPcTfDA2uDvX0t5XPrXbbiqhx1IKeiZkrsXffJjUID9QymLahaEKlMla5oxI3JBWm4si/cgglRaOVriYg0KU3HSa+aETIpuySTns3MwqwOzOl4eGdhZXaJU5YzX8ss/QeJIedlvLXEhlkhWexWzBSBp7yWKY+pe80/ymPBAdGJgv/qKSy/HE5C6cMMFjnfZ796PWP34jXGXXiPFqftgTn5ONjnDUyGWHavXc8ONgmSifEYmaWcsRzEUBgTC6CncQq6ikw2dB2P2hPI/ti+ff/eMn1KwawtHferv7zfmivn2tLU5v17d/rnb5lVOGXW7B/v3xd7GWebyjJF+L35Pl9+/GheSUme9LjscOzbuO6T3aueevDrTTv/747MDHt+FnWkOqrcdXecenrJ3g/Wb97jcMjxHmPuU+LOz3fjkvRdhxt050ISNVAWWJc1lSLQIsqm0iCDVJgd3mKfFhiB9tqsgFb2OuKgQb0vbHAT3pIK0sjankvdvJ+nfH+w95qFFe13nbj/muYdj/16iBw/PkR+/diO5p77j981p3xR9xL+ppPq326deXjBgiMzFfWTb+54mwZefpkG3t4R7w+vDGz/69HVL6jxU6fU2Aurjn603b/mIeXixf5+LmImE3JL8qoaCtPVh7+t/kr9Y/yts01NZ9+K00m06iG6Ir2wYXJuSe4E9YC0sLO8tKy8c4H07pvqLvWs+tdrr4U2LqRfe5OuyHe1LbZsfl79F/XCp4sWfUor6eLnN1t62gsLkCepEVXhIpigOvwdTBEJkh6ynhxHr6HNPSqJ0RKmjVTPX/RJPpqUvWjDdEbWXSKzPUenMoYpHZOzyHLPmDPOSD1j9plT5D564VtjkhelnCwjcXHJov30bFLi4t69p9U/z39wfuXNB25ZEzYJ6uvJWYzhNbccuLly/oN8Tvsz588vGpWnqNbX7jl05JbNpRPd7omlm285cmhPrb9v9JE+bvXJ0amL9K4MWctafOZMRP1jUtLijEdPXic+np4mOUqmzF3RKOdmDd66cs2alSyJsXHFXExiTEtPnCitL8ocyVUUtpmycryBoswKh6MisyjgzckyXX4kKRaEpgnjylVkHtl6ua3B69YzDIqYBINSUNT6GWMIAn4zY/d6dJSxm6SRmALbMUXGWB5/QDMBbbNZjlxujiNXN9UGb6DSronRQ4/88CerN//2jSf3z1a67n7tD4P7911697W7F3LN8WaE86LGrmqrqWVnTw067qdsWtJmDwczq8PtvDLWIFEjmsFGz/miv9eNNdjz86J8/dMnts0rqV5y5Ds/33n0z298e/OUKRsfeP2D2xpfQrVR3TOz0hRpTpu5VmnF0ICr+ZqAvai4qczO+i5CIhJMKZDuKkC5VWQ3+xoCxNdlhFT8INcsIAIr7FCxVmcYIJaupG3Q3XC2nBqd3kzdSZs4CvxIYA1xE17guuyI8LPIhnllsRNl8zZME/ILc7LSxMU7FWXXYiE9K6cwP/EXnYVwOrh54+8I+7I9tXk3DQf5re7JsFFk3ZVf47X1Oyaj+p3s0EuTY8wBqcW1fMfRtrajO5a7pEBDtSCnnAoETqXIQs2UwM8MDDUWtT+RklfryR7Khbtt8JShkS2btyaf+298NOC2/hJueGvsMR1btK/tRv6/AO1La1GLUMquZMtGGOA8lxTMzRgcEJmPlxIjtsEzX+6gx0wG1AH8Tzo4OD1imDCfMzBNoOZgx7vAplhvID+F/sfPWjQtBsDPvmexIzvSPnTBKIKOSUzP8ZpmCMr6PTJLwOb5/tlPPfVQXYHPVxD4p+9/r2X0nn/rto3VmbXVRSbR1rF629brSkqu27pt9fxs0VRUXZtZvXHbVv/wNVPufuD+6dMfuP/uKcY5ScnyzfTnt5fHlMpWp39GSZa+Lxj7iiTnWkw5hT6rOUMqrC7OyZSkzJzi6kIpw2z1FeaYLLky0E1JdljZVfyrQPcmTHDWeuJhdt7qkKUkHyv6DUvY/y5zxai46NLydUxSkEWUqVSPnHmEQ7dHR+hzvI3GChNn0D0/o3nEPy8ozjrNc1iDnsOf5+VfsjkLfCmpifbbihawQX01tegelk/nMXJKMP45mcwgnaDByVcNaFKDcQP9lj3QiL6vEqtUr2fySLQwhMK8HImvFIgUFAxOsJ5QPZiC4CHjxSaH//8JEb9iSSplPXkX24kft+BiItqn6exjTLaRYPE3zXgdZCVH2Jfn2BieffzCEhtZfqMSI+gbR1fpENjv1OBUOH9rkv7XkwVgxUbJMl2GAOYEI4FexGBOoEoI6lFC7Zsbv81lcbPpBNOLGv8pBSx2TESG03zSIjG33rDPb5B9mcxrH0yrWuqxVlnFcPzFlLF/ZubkVQt1v2S8EB9p1r7oiV/UnZP0IiYHsUFQJKIWJvknLxoPMhKWk/DmfwCbz/RpeJxjYGRgYGCqCPbX4taK57f5ysDNwQAC+/8ebADRV6c8/vD/HwMDBwNYnJOBCUQBAEQQC4AAAAB4nGNgZGDgYAABDob//8BsRgZUwAQAMYQCGgAAeJxj1WJYxsHAwMAIhJgAKtrAoIok2IDEVkVRDlPtAGdjyjX8/wdkNzA8Q5FkBpMOULMbGNJQ7ILZeACsE9UlQD2MYHNBNgAAOT8NfwAAABYAZgCyAPwBbAHmAmYC3gMiA8oELgSiBRwFZgWwBjAGaAaCBpYGrAa8BswHaAeOCEQIVAhkCHoIkAiqCMQI3gk8CgAKWgq6CuoLBgvwDMANQA2cDfIONg6cDxIPrhAMEHoQ3hFoEc4SbhKmEsgTGBO4FAAUHBSwFRgVzhYEFhQWOhZcFpwXbBd8F8oYMhiWGQQZLBl8GkQa0hroG2objBvWHBQcgh0EHYQd/B4qHqIfAB9OH7ggUCEiIcAifiK2I0gjmCQcJGIk7nicY2BkYGBIZZjPwMMAAoxgkguIUxgjQUwAIH8B2wAAeJy1VE+LGzcUf1472S1plhIo5KhDKZvFjBN3ITQ5LUlzyl42YSGXgjwjz4iMR0LSZJjSQ4859GP0EuinKC302HM/Qc899dj3njT2buyGbaEeRvPT0/v7e08GgLujz2EE8fcFvhGP4A7uIt6Dffgq4THKnyc8Qfx1wjfgY7AJ34RP4NuE9+FL+D7hA/gUfkn4FhzD7wnfHv08miR8CMd7v2KU0eQj3BV7fyY8gs/GFwnvweH4m4THKH+b8ATxjwnfgLvj3xK+CWL8R8L74CYHCR/A8WTwcwteTn5I+Pb47eSvhA/h5cF3P70T8/sPTsSZzp3xZhnEE+OscTJo02TitK7FuS6r4MW58sq9UUX2TC6czsXZ0+dzceq9Cv5clW0t3fbBtuRCOY+exTw7eRhP6TCevVClUUJ7IUVwslAr6V4LsxShUpfyK51pLYlzs7Ky0cpnO5OvQrCPZrOu67LVcJ6hzSz01pRO2qqfLU0T/Gxj7ltra60KQQeZeGVasZK9aL3CJDAxEotgRO6UDGoqCu1tLfupkE0hrNN4mqOKwq/0wiq30iGgu0XPRdQ6Vw35wgMvjBvAkiJMt0u1zhRtHqaCmEfbKdkMAXQjukrn1aXMOgyqm7xuC2zTOnvT1L040veEWi0wl406evhQtqxe6KYUTvmAnSJWNwHIfO3rMTNwpDFKUCtqgdMYtTBdUxtZXGVPRqqUo3IMhsK1DbYNolBUJulUqrZXGcVhbPqkTg1Bh8hPpRcac86u3214BwLmcB8ewAmiM9CQgwMDHt8lBJQ9QeTwztMqUaIRNZDhySnU+Ag4R1kJFZ553in8KtR+g2uBms/QboF78k0xnuI/y5ztPWuSHVmV0KI/iZrXsbiOzgXn4VPOVGmGdT68YjtYXrZ7wdkYXAXqUFUS38AMFChdcZavUUYs0UnFurv4K3nfIoODdo7fFe4l5qSZrexfME88B5Q+ghk+HT8Z+nvfPktxZoh79lKyH4seepQu2RtVO9sZ3XPOFjuiuY9ibUG9f8U1CWaix2/L3EUmImODNskMV+1Qg+pQMMV9wXqWO96zhPigOJY7E23z5EWlvWTflvtKNQc+I6sF5zF0ouaKyGrIK1p47oLbkizXNUyv1VXL+wJtctxPma848zHudB3n/Qo0T2LHPOW47uasS5WSdo7VtDx3xU7uyaZmdIT69/BLE7pIvOzyHnP4r9xuvBfsqUSZ4zkO6U4Ns7qrgiH6dl6PL80AVRJrCRxvuAXkP9ZaoKTjyg3fyg/NnrwyVYr7YtIaq4q45ZvVsiVlO3Rz8EOaNd/kf57R+M/YpM5svA83RCeWaX4o3wUzHXv7P9ztvwEy7jiOAAB4nGNgZgCD/34M5QyYIBUAKY8CLXic28CgzbCJkZNJm3ETF4jcztWaG2qrysChvZ07NdhBTwbE4onwsNCQBLF4nc215YVBLD4dFRkRHhCLX05CmI8DxBLg4+FkZwGxBMEAxBLaMKEgwADIYtjOCDeaCW40M9xoFrjRrHCj2eQkoUazw43mgBvNCTd6kzAju/YGBgXX2kwJFwDEASgaAAAA') format('woff')`, 
+    },
+    icons: {
+      'CalendarAgenda': '\uEE9A',
+      'AddEvent': '\uEEB5',
+      'AssetLibrary': '\uEEB6',
+      'DataConnectionLibrary': '\uEEB7',
+      'DocLibrary': '\uEEB8',
+      'FormLibrary': '\uEEB9',
+      'FormLibraryMirrored': '\uEEBA',
+      'ReportLibrary': '\uEEBB',
+      'ReportLibraryMirrored': '\uEEBC',
+      'ContactCard': '\uEEBD',
+      'CustomList': '\uEEBE',
+      'CustomListMirrored': '\uEEBF',
+      'IssueTracking': '\uEEC0',
+      'IssueTrackingMirrored': '\uEEC1',
+      'PictureLibrary': '\uEEC2',
+      'OfficeAddinsLogo': '\uEEC7',
+      'OfflineOneDriveParachute': '\uEEC8',
+      'OfflineOneDriveParachuteDisabled': '\uEEC9',
+      'TriangleSolidUp12': '\uEECC',
+      'TriangleSolidDown12': '\uEECD',
+      'TriangleSolidLeft12': '\uEECE',
+      'TriangleSolidRight12': '\uEECF',
+      'TriangleUp12': '\uEED0',
+      'TriangleDown12': '\uEED1',
+      'TriangleLeft12': '\uEED2',
+      'TriangleRight12': '\uEED3',
+      'ArrowUpRight8': '\uEED4',
+      'ArrowDownRight8': '\uEED5',
+      'DocumentSet': '\uEED6',
+      'DelveAnalytics': '\uEEEE',
+      'ArrowUpRightMirrored8': '\uEEEF',
+      'ArrowDownRightMirrored8': '\uEEF0',
+      'OneDriveAdd': '\uEF32',
+      'Header2': '\uEF36',
+      'Header3': '\uEF37',
+      'Header4': '\uEF38',
+      'MarketDown': '\uEF42',
+      'CalendarWorkWeek': '\uEF51',
+      'SidePanel': '\uEF52',
+      'GlobeFavorite': '\uEF53',
+      'CaretTopLeftSolid8': '\uEF54',
+      'CaretTopRightSolid8': '\uEF55',
+      'ViewAll2': '\uEF56',
+      'DocumentReply': '\uEF57',
+      'PlayerSettings': '\uEF58',
+      'ReceiptForward': '\uEF59',
+      'ReceiptReply': '\uEF5A',
+      'ReceiptCheck': '\uEF5B',
+      'Fax': '\uEF5C',
+      'RecurringEvent': '\uEF5D',
+      'ReplyAlt': '\uEF5E',
+      'ReplyAllAlt': '\uEF5F',
+      'EditStyle': '\uEF60',
+      'EditMail': '\uEF61',
+      'Lifesaver': '\uEF62',
+      'LifesaverLock': '\uEF63',
+      'InboxCheck': '\uEF64',
+      'FolderSearch': '\uEF65',
+      'CollapseMenu': '\uEF66',
+      'ExpandMenu': '\uEF67',
+      'Boards': '\uEF68',
+      'SunAdd': '\uEF69',
+      'SunQuestionMark': '\uEF6A',
+      'LandscapeOrientation': '\uEF6B',
+      'DocumentSearch': '\uEF6C',
+      'PublicCalendar': '\uEF6D',
+      'PublicContactCard': '\uEF6E',
+      'PublicEmail': '\uEF6F',
+      'PublicFolder': '\uEF70',
+      'WordDocument': '\uEF71',
+      'PowerPointDocument': '\uEF72',
+      'ExcelDocument': '\uEF73',
+      'GroupedList': '\uEF74',
+      'ClassroomLogo': '\uEF75',
+      'Sections': '\uEF76',
+      'EditPhoto': '\uEF77',
+      'Starburst': '\uEF78',
+      'ShareiOS': '\uEF79',
+      'AirTickets': '\uEF7A',
+      'PencilReply': '\uEF7B',
+      'Tiles2': '\uEF7C',
+      'SkypeCircleCheck': '\uEF7D',
+      'SkypeCircleClock': '\uEF7E',
+      'SkypeCircleMinus': '\uEF7F',
+      'SkypeMessage': '\uEF83',
+      'ClosedCaption': '\uEF84',
+      'ATPLogo': '\uEF85',
+      'OfficeFormsLogoInverse': '\uEF86',
+      'RecycleBin': '\uEF87',
+      'EmptyRecycleBin': '\uEF88',
+      'Hide2': '\uEF89',
+      'iOSAppStoreLogo': '\uEF8A',
+      'AndroidLogo': '\uEF8B',
+      'Breadcrumb': '\uEF8C',
+      'PageEdit': '\uEFB6',
+      'Database': '\uEFC7',
+      'DocumentManagement': '\uEFFC',
+      'CRMReport': '\uEFFE',
+      'ZipFolder': '\uF012',
+      'TextDocument': '\uF029'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-6.ts b/packages/icons/src/fabric-icons-6.ts
new file mode 100644
index 0000000000000..782b5bb7d014a
--- /dev/null
+++ b/packages/icons/src/fabric-icons-6.ts
@@ -0,0 +1,121 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-6"`,
+      src: `url('${baseUrl}fabric-icons-6-2ab76fc9.woff') format('woff')`, 
+    },
+    icons: {
+      'CalendarAgenda': '\uEE9A',
+      'AddEvent': '\uEEB5',
+      'AssetLibrary': '\uEEB6',
+      'DataConnectionLibrary': '\uEEB7',
+      'DocLibrary': '\uEEB8',
+      'FormLibrary': '\uEEB9',
+      'FormLibraryMirrored': '\uEEBA',
+      'ReportLibrary': '\uEEBB',
+      'ReportLibraryMirrored': '\uEEBC',
+      'ContactCard': '\uEEBD',
+      'CustomList': '\uEEBE',
+      'CustomListMirrored': '\uEEBF',
+      'IssueTracking': '\uEEC0',
+      'IssueTrackingMirrored': '\uEEC1',
+      'PictureLibrary': '\uEEC2',
+      'OfficeAddinsLogo': '\uEEC7',
+      'OfflineOneDriveParachute': '\uEEC8',
+      'OfflineOneDriveParachuteDisabled': '\uEEC9',
+      'TriangleSolidUp12': '\uEECC',
+      'TriangleSolidDown12': '\uEECD',
+      'TriangleSolidLeft12': '\uEECE',
+      'TriangleSolidRight12': '\uEECF',
+      'TriangleUp12': '\uEED0',
+      'TriangleDown12': '\uEED1',
+      'TriangleLeft12': '\uEED2',
+      'TriangleRight12': '\uEED3',
+      'ArrowUpRight8': '\uEED4',
+      'ArrowDownRight8': '\uEED5',
+      'DocumentSet': '\uEED6',
+      'DelveAnalytics': '\uEEEE',
+      'ArrowUpRightMirrored8': '\uEEEF',
+      'ArrowDownRightMirrored8': '\uEEF0',
+      'OneDriveAdd': '\uEF32',
+      'Header2': '\uEF36',
+      'Header3': '\uEF37',
+      'Header4': '\uEF38',
+      'MarketDown': '\uEF42',
+      'CalendarWorkWeek': '\uEF51',
+      'SidePanel': '\uEF52',
+      'GlobeFavorite': '\uEF53',
+      'CaretTopLeftSolid8': '\uEF54',
+      'CaretTopRightSolid8': '\uEF55',
+      'ViewAll2': '\uEF56',
+      'DocumentReply': '\uEF57',
+      'PlayerSettings': '\uEF58',
+      'ReceiptForward': '\uEF59',
+      'ReceiptReply': '\uEF5A',
+      'ReceiptCheck': '\uEF5B',
+      'Fax': '\uEF5C',
+      'RecurringEvent': '\uEF5D',
+      'ReplyAlt': '\uEF5E',
+      'ReplyAllAlt': '\uEF5F',
+      'EditStyle': '\uEF60',
+      'EditMail': '\uEF61',
+      'Lifesaver': '\uEF62',
+      'LifesaverLock': '\uEF63',
+      'InboxCheck': '\uEF64',
+      'FolderSearch': '\uEF65',
+      'CollapseMenu': '\uEF66',
+      'ExpandMenu': '\uEF67',
+      'Boards': '\uEF68',
+      'SunAdd': '\uEF69',
+      'SunQuestionMark': '\uEF6A',
+      'LandscapeOrientation': '\uEF6B',
+      'DocumentSearch': '\uEF6C',
+      'PublicCalendar': '\uEF6D',
+      'PublicContactCard': '\uEF6E',
+      'PublicEmail': '\uEF6F',
+      'PublicFolder': '\uEF70',
+      'WordDocument': '\uEF71',
+      'PowerPointDocument': '\uEF72',
+      'ExcelDocument': '\uEF73',
+      'GroupedList': '\uEF74',
+      'ClassroomLogo': '\uEF75',
+      'Sections': '\uEF76',
+      'EditPhoto': '\uEF77',
+      'Starburst': '\uEF78',
+      'ShareiOS': '\uEF79',
+      'AirTickets': '\uEF7A',
+      'PencilReply': '\uEF7B',
+      'Tiles2': '\uEF7C',
+      'SkypeCircleCheck': '\uEF7D',
+      'SkypeCircleClock': '\uEF7E',
+      'SkypeCircleMinus': '\uEF7F',
+      'SkypeMessage': '\uEF83',
+      'ClosedCaption': '\uEF84',
+      'ATPLogo': '\uEF85',
+      'OfficeFormsLogoInverse': '\uEF86',
+      'RecycleBin': '\uEF87',
+      'EmptyRecycleBin': '\uEF88',
+      'Hide2': '\uEF89',
+      'iOSAppStoreLogo': '\uEF8A',
+      'AndroidLogo': '\uEF8B',
+      'Breadcrumb': '\uEF8C',
+      'PageEdit': '\uEFB6',
+      'Database': '\uEFC7',
+      'DocumentManagement': '\uEFFC',
+      'CRMReport': '\uEFFE',
+      'ZipFolder': '\uF012',
+      'TextDocument': '\uF029'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-7-inline.ts b/packages/icons/src/fabric-icons-7-inline.ts
new file mode 100644
index 0000000000000..fd2079f9fb075
--- /dev/null
+++ b/packages/icons/src/fabric-icons-7-inline.ts
@@ -0,0 +1,121 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-7"`,
+      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
+    },
+    icons: {
+      'PageCheckedOut': '\uF02C',
+      'SaveAndClose': '\uF038',
+      'Script': '\uF03A',
+      'Archive': '\uF03F',
+      'ActivityFeed': '\uF056',
+      'EventDate': '\uF059',
+      'CaretRight': '\uF06B',
+      'SetAction': '\uF071',
+      'CaretSolidLeft': '\uF08D',
+      'CaretSolidDown': '\uF08E',
+      'CaretSolidRight': '\uF08F',
+      'CaretSolidUp': '\uF090',
+      'PowerAppsLogo': '\uF091',
+      'PowerApps2Logo': '\uF092',
+      'SearchIssue': '\uF09A',
+      'SearchIssueMirrored': '\uF09B',
+      'FabricAssetLibrary': '\uF09C',
+      'FabricDataConnectionLibrary': '\uF09D',
+      'FabricDocLibrary': '\uF09E',
+      'FabricFormLibrary': '\uF09F',
+      'FabricFormLibraryMirrored': '\uF0A0',
+      'FabricReportLibrary': '\uF0A1',
+      'FabricReportLibraryMirrored': '\uF0A2',
+      'FabricPublicFolder': '\uF0A3',
+      'FabricFolderSearch': '\uF0A4',
+      'FabricMovetoFolder': '\uF0A5',
+      'FabricUnsyncFolder': '\uF0A6',
+      'FabricSyncFolder': '\uF0A7',
+      'FabricOpenFolderHorizontal': '\uF0A8',
+      'FabricFolder': '\uF0A9',
+      'FabricFolderFill': '\uF0AA',
+      'FabricNewFolder': '\uF0AB',
+      'FabricPictureLibrary': '\uF0AC',
+      'AddFavorite': '\uF0C8',
+      'AddFavoriteFill': '\uF0C9',
+      'BufferTimeBefore': '\uF0CF',
+      'BufferTimeAfter': '\uF0D0',
+      'BufferTimeBoth': '\uF0D1',
+      'CannedChat': '\uF0F2',
+      'SkypeForBusinessLogo': '\uF0FC',
+      'PageCheckedin': '\uF104',
+      'CaretBottomLeftSolid8': '\uF121',
+      'CaretBottomRightSolid8': '\uF122',
+      'FolderHorizontal': '\uF12B',
+      'MicrosoftStaffhubLogo': '\uF130',
+      'GiftboxOpen': '\uF133',
+      'StatusCircleOuter': '\uF136',
+      'StatusCircleInner': '\uF137',
+      'ExploreContentSingle': '\uF164',
+      'CollapseContent': '\uF165',
+      'CollapseContentSingle': '\uF166',
+      'InfoSolid': '\uF167',
+      'ProgressRingDots': '\uF16A',
+      'CaloriesAdd': '\uF172',
+      'BranchFork': '\uF173',
+      'HardDriveGroup': '\uF18F',
+      'BucketColor': '\uF1B6',
+      'BucketColorFill': '\uF1B7',
+      'Taskboard': '\uF1C2',
+      'SingleColumn': '\uF1D3',
+      'DoubleColumn': '\uF1D4',
+      'TripleColumn': '\uF1D5',
+      'ColumnLeftTwoThirds': '\uF1D6',
+      'ColumnRightTwoThirds': '\uF1D7',
+      'AccessLogoFill': '\uF1DB',
+      'AnalyticsLogo': '\uF1DE',
+      'AnalyticsQuery': '\uF1DF',
+      'NewAnalyticsQuery': '\uF1E0',
+      'AnalyticsReport': '\uF1E1',
+      'WordLogo': '\uF1E3',
+      'WordLogoFill': '\uF1E4',
+      'ExcelLogo': '\uF1E5',
+      'ExcelLogoFill': '\uF1E6',
+      'OneNoteLogo': '\uF1E7',
+      'OneNoteLogoFill': '\uF1E8',
+      'OutlookLogo': '\uF1E9',
+      'OutlookLogoFill': '\uF1EA',
+      'PowerPointLogo': '\uF1EB',
+      'PowerPointLogoFill': '\uF1EC',
+      'PublisherLogo': '\uF1ED',
+      'PublisherLogoFill': '\uF1EE',
+      'ScheduleEventAction': '\uF1EF',
+      'FlameSolid': '\uF1F3',
+      'ServerProcesses': '\uF1FE',
+      'Server': '\uF201',
+      'SaveAll': '\uF203',
+      'LinkedInLogo': '\uF20A',
+      'SidePanelMirrored': '\uF221',
+      'ProtectRestrict': '\uF22A',
+      'GridViewSmall': '\uF232',
+      'GridViewMedium': '\uF233',
+      'GridViewLarge': '\uF234',
+      'Step': '\uF241',
+      'StepInsert': '\uF242',
+      'StepShared': '\uF243',
+      'StepSharedAdd': '\uF244',
+      'StepSharedInsert': '\uF245',
+      'ViewDashboard': '\uF246',
+      'ViewList': '\uF247',
+      'ViewListGroup': '\uF248'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-7.ts b/packages/icons/src/fabric-icons-7.ts
new file mode 100644
index 0000000000000..299076dfbf585
--- /dev/null
+++ b/packages/icons/src/fabric-icons-7.ts
@@ -0,0 +1,121 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-7"`,
+      src: `url('${baseUrl}fabric-icons-7-1bae3315.woff') format('woff')`, 
+    },
+    icons: {
+      'PageCheckedOut': '\uF02C',
+      'SaveAndClose': '\uF038',
+      'Script': '\uF03A',
+      'Archive': '\uF03F',
+      'ActivityFeed': '\uF056',
+      'EventDate': '\uF059',
+      'CaretRight': '\uF06B',
+      'SetAction': '\uF071',
+      'CaretSolidLeft': '\uF08D',
+      'CaretSolidDown': '\uF08E',
+      'CaretSolidRight': '\uF08F',
+      'CaretSolidUp': '\uF090',
+      'PowerAppsLogo': '\uF091',
+      'PowerApps2Logo': '\uF092',
+      'SearchIssue': '\uF09A',
+      'SearchIssueMirrored': '\uF09B',
+      'FabricAssetLibrary': '\uF09C',
+      'FabricDataConnectionLibrary': '\uF09D',
+      'FabricDocLibrary': '\uF09E',
+      'FabricFormLibrary': '\uF09F',
+      'FabricFormLibraryMirrored': '\uF0A0',
+      'FabricReportLibrary': '\uF0A1',
+      'FabricReportLibraryMirrored': '\uF0A2',
+      'FabricPublicFolder': '\uF0A3',
+      'FabricFolderSearch': '\uF0A4',
+      'FabricMovetoFolder': '\uF0A5',
+      'FabricUnsyncFolder': '\uF0A6',
+      'FabricSyncFolder': '\uF0A7',
+      'FabricOpenFolderHorizontal': '\uF0A8',
+      'FabricFolder': '\uF0A9',
+      'FabricFolderFill': '\uF0AA',
+      'FabricNewFolder': '\uF0AB',
+      'FabricPictureLibrary': '\uF0AC',
+      'AddFavorite': '\uF0C8',
+      'AddFavoriteFill': '\uF0C9',
+      'BufferTimeBefore': '\uF0CF',
+      'BufferTimeAfter': '\uF0D0',
+      'BufferTimeBoth': '\uF0D1',
+      'CannedChat': '\uF0F2',
+      'SkypeForBusinessLogo': '\uF0FC',
+      'PageCheckedin': '\uF104',
+      'CaretBottomLeftSolid8': '\uF121',
+      'CaretBottomRightSolid8': '\uF122',
+      'FolderHorizontal': '\uF12B',
+      'MicrosoftStaffhubLogo': '\uF130',
+      'GiftboxOpen': '\uF133',
+      'StatusCircleOuter': '\uF136',
+      'StatusCircleInner': '\uF137',
+      'ExploreContentSingle': '\uF164',
+      'CollapseContent': '\uF165',
+      'CollapseContentSingle': '\uF166',
+      'InfoSolid': '\uF167',
+      'ProgressRingDots': '\uF16A',
+      'CaloriesAdd': '\uF172',
+      'BranchFork': '\uF173',
+      'HardDriveGroup': '\uF18F',
+      'BucketColor': '\uF1B6',
+      'BucketColorFill': '\uF1B7',
+      'Taskboard': '\uF1C2',
+      'SingleColumn': '\uF1D3',
+      'DoubleColumn': '\uF1D4',
+      'TripleColumn': '\uF1D5',
+      'ColumnLeftTwoThirds': '\uF1D6',
+      'ColumnRightTwoThirds': '\uF1D7',
+      'AccessLogoFill': '\uF1DB',
+      'AnalyticsLogo': '\uF1DE',
+      'AnalyticsQuery': '\uF1DF',
+      'NewAnalyticsQuery': '\uF1E0',
+      'AnalyticsReport': '\uF1E1',
+      'WordLogo': '\uF1E3',
+      'WordLogoFill': '\uF1E4',
+      'ExcelLogo': '\uF1E5',
+      'ExcelLogoFill': '\uF1E6',
+      'OneNoteLogo': '\uF1E7',
+      'OneNoteLogoFill': '\uF1E8',
+      'OutlookLogo': '\uF1E9',
+      'OutlookLogoFill': '\uF1EA',
+      'PowerPointLogo': '\uF1EB',
+      'PowerPointLogoFill': '\uF1EC',
+      'PublisherLogo': '\uF1ED',
+      'PublisherLogoFill': '\uF1EE',
+      'ScheduleEventAction': '\uF1EF',
+      'FlameSolid': '\uF1F3',
+      'ServerProcesses': '\uF1FE',
+      'Server': '\uF201',
+      'SaveAll': '\uF203',
+      'LinkedInLogo': '\uF20A',
+      'SidePanelMirrored': '\uF221',
+      'ProtectRestrict': '\uF22A',
+      'GridViewSmall': '\uF232',
+      'GridViewMedium': '\uF233',
+      'GridViewLarge': '\uF234',
+      'Step': '\uF241',
+      'StepInsert': '\uF242',
+      'StepShared': '\uF243',
+      'StepSharedAdd': '\uF244',
+      'StepSharedInsert': '\uF245',
+      'ViewDashboard': '\uF246',
+      'ViewList': '\uF247',
+      'ViewListGroup': '\uF248'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-8-inline.ts b/packages/icons/src/fabric-icons-8-inline.ts
new file mode 100644
index 0000000000000..7323c3cfabf2a
--- /dev/null
+++ b/packages/icons/src/fabric-icons-8-inline.ts
@@ -0,0 +1,121 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-8"`,
+      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
+    },
+    icons: {
+      'ViewListTree': '\uF249',
+      'TriggerAuto': '\uF24A',
+      'TriggerUser': '\uF24B',
+      'PivotChart': '\uF24C',
+      'StackedBarChart': '\uF24D',
+      'StackedLineChart': '\uF24E',
+      'BuildQueue': '\uF24F',
+      'BuildQueueNew': '\uF250',
+      'UserFollowed': '\uF25C',
+      'VennDiagram': '\uF273',
+      'FiveTileGrid': '\uF274',
+      'FocalPoint': '\uF277',
+      'TeamsLogoInverse': '\uF27A',
+      'TeamsLogo': '\uF27B',
+      'TeamsLogoFill': '\uF27C',
+      'SkypeForBusinessLogoFill': '\uF27D',
+      'SharepointLogo': '\uF27E',
+      'SharepointLogoFill': '\uF27F',
+      'DelveLogo': '\uF280',
+      'DelveLogoFill': '\uF281',
+      'OfficeVideoLogo': '\uF282',
+      'OfficeVideoLogoFill': '\uF283',
+      'ExchangeLogo': '\uF284',
+      'ExchangeLogoFill': '\uF285',
+      'DocumentApproval': '\uF28B',
+      'CloneToDesktop': '\uF28C',
+      'InstallToDrive': '\uF28D',
+      'Blur': '\uF28E',
+      'Build': '\uF28F',
+      'ProcessMetaTask': '\uF290',
+      'BranchFork2': '\uF291',
+      'BranchLocked': '\uF292',
+      'BranchCommit': '\uF293',
+      'BranchCompare': '\uF294',
+      'BranchMerge': '\uF295',
+      'BranchPullRequest': '\uF296',
+      'BranchSearch': '\uF297',
+      'BranchShelveset': '\uF298',
+      'RawSource': '\uF299',
+      'MergeDuplicate': '\uF29A',
+      'RowsGroup': '\uF29B',
+      'RowsChild': '\uF29C',
+      'Deploy': '\uF29D',
+      'Redeploy': '\uF29E',
+      'ServerEnviroment': '\uF29F',
+      'Plug': '\uF300',
+      'PlugSolid': '\uF301',
+      'PlugConnected': '\uF302',
+      'PlugDisconnected': '\uF303',
+      'UnlockSolid': '\uF304',
+      'Variable': '\uF305',
+      'Parameter': '\uF306',
+      'CommentUrgent': '\uF307',
+      'Storyboard': '\uF308',
+      'DiffInline': '\uF309',
+      'DiffSideBySide': '\uF30A',
+      'ImageDiff': '\uF30B',
+      'ImagePixel': '\uF30C',
+      'FileBug': '\uF30D',
+      'FileCode': '\uF30E',
+      'FileComment': '\uF30F',
+      'FileImage': '\uF311',
+      'FileSymlink': '\uF312',
+      'AutoFillTemplate': '\uF313',
+      'WorkItem': '\uF314',
+      'WorkItemBug': '\uF315',
+      'LogRemove': '\uF316',
+      'ColumnOptions': '\uF317',
+      'Packages': '\uF318',
+      'BuildIssue': '\uF319',
+      'AssessmentGroup': '\uF31A',
+      'VariableGroup': '\uF31B',
+      'FullHistory': '\uF31C',
+      'BusinessHoursSign': '\uF310',
+      'VisioDiagram': '\uF2A0',
+      'HighlightMappedShapes': '\uF2A1',
+      'TextCallout': '\uF2A2',
+      'IconSetsFlag': '\uF2A4',
+      'VisioLogo': '\uF2A7',
+      'VisioLogoFill': '\uF2A8',
+      'VisioDocument': '\uF2A9',
+      'TimelineProgress': '\uF2AA',
+      'TimelineDelivery': '\uF2AB',
+      'Backlog': '\uF2AC',
+      'TeamFavorite': '\uF2AD',
+      'TaskGroup': '\uF2AE',
+      'TaskGroupMirrored': '\uF2AF',
+      'ScopeTemplate': '\uF2B0',
+      'AssessmentGroupTemplate': '\uF2B1',
+      'NewTeamProject': '\uF2B2',
+      'CommentAdd': '\uF2B3',
+      'CommentNext': '\uF2B4',
+      'CommentPrevious': '\uF2B5',
+      'ShopServer': '\uF2B6',
+      'LocaleLanguage': '\uF2B7',
+      'QueryList': '\uF2B8',
+      'UserSync': '\uF2B9',
+      'UserPause': '\uF2BA',
+      'StreamingOff': '\uF2BB',
+      'ArrowTallUpLeft': '\uF2BD'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-8.ts b/packages/icons/src/fabric-icons-8.ts
new file mode 100644
index 0000000000000..9ce3c86581651
--- /dev/null
+++ b/packages/icons/src/fabric-icons-8.ts
@@ -0,0 +1,121 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-8"`,
+      src: `url('${baseUrl}fabric-icons-8-bf5c8e0c.woff') format('woff')`, 
+    },
+    icons: {
+      'ViewListTree': '\uF249',
+      'TriggerAuto': '\uF24A',
+      'TriggerUser': '\uF24B',
+      'PivotChart': '\uF24C',
+      'StackedBarChart': '\uF24D',
+      'StackedLineChart': '\uF24E',
+      'BuildQueue': '\uF24F',
+      'BuildQueueNew': '\uF250',
+      'UserFollowed': '\uF25C',
+      'VennDiagram': '\uF273',
+      'FiveTileGrid': '\uF274',
+      'FocalPoint': '\uF277',
+      'TeamsLogoInverse': '\uF27A',
+      'TeamsLogo': '\uF27B',
+      'TeamsLogoFill': '\uF27C',
+      'SkypeForBusinessLogoFill': '\uF27D',
+      'SharepointLogo': '\uF27E',
+      'SharepointLogoFill': '\uF27F',
+      'DelveLogo': '\uF280',
+      'DelveLogoFill': '\uF281',
+      'OfficeVideoLogo': '\uF282',
+      'OfficeVideoLogoFill': '\uF283',
+      'ExchangeLogo': '\uF284',
+      'ExchangeLogoFill': '\uF285',
+      'DocumentApproval': '\uF28B',
+      'CloneToDesktop': '\uF28C',
+      'InstallToDrive': '\uF28D',
+      'Blur': '\uF28E',
+      'Build': '\uF28F',
+      'ProcessMetaTask': '\uF290',
+      'BranchFork2': '\uF291',
+      'BranchLocked': '\uF292',
+      'BranchCommit': '\uF293',
+      'BranchCompare': '\uF294',
+      'BranchMerge': '\uF295',
+      'BranchPullRequest': '\uF296',
+      'BranchSearch': '\uF297',
+      'BranchShelveset': '\uF298',
+      'RawSource': '\uF299',
+      'MergeDuplicate': '\uF29A',
+      'RowsGroup': '\uF29B',
+      'RowsChild': '\uF29C',
+      'Deploy': '\uF29D',
+      'Redeploy': '\uF29E',
+      'ServerEnviroment': '\uF29F',
+      'Plug': '\uF300',
+      'PlugSolid': '\uF301',
+      'PlugConnected': '\uF302',
+      'PlugDisconnected': '\uF303',
+      'UnlockSolid': '\uF304',
+      'Variable': '\uF305',
+      'Parameter': '\uF306',
+      'CommentUrgent': '\uF307',
+      'Storyboard': '\uF308',
+      'DiffInline': '\uF309',
+      'DiffSideBySide': '\uF30A',
+      'ImageDiff': '\uF30B',
+      'ImagePixel': '\uF30C',
+      'FileBug': '\uF30D',
+      'FileCode': '\uF30E',
+      'FileComment': '\uF30F',
+      'FileImage': '\uF311',
+      'FileSymlink': '\uF312',
+      'AutoFillTemplate': '\uF313',
+      'WorkItem': '\uF314',
+      'WorkItemBug': '\uF315',
+      'LogRemove': '\uF316',
+      'ColumnOptions': '\uF317',
+      'Packages': '\uF318',
+      'BuildIssue': '\uF319',
+      'AssessmentGroup': '\uF31A',
+      'VariableGroup': '\uF31B',
+      'FullHistory': '\uF31C',
+      'BusinessHoursSign': '\uF310',
+      'VisioDiagram': '\uF2A0',
+      'HighlightMappedShapes': '\uF2A1',
+      'TextCallout': '\uF2A2',
+      'IconSetsFlag': '\uF2A4',
+      'VisioLogo': '\uF2A7',
+      'VisioLogoFill': '\uF2A8',
+      'VisioDocument': '\uF2A9',
+      'TimelineProgress': '\uF2AA',
+      'TimelineDelivery': '\uF2AB',
+      'Backlog': '\uF2AC',
+      'TeamFavorite': '\uF2AD',
+      'TaskGroup': '\uF2AE',
+      'TaskGroupMirrored': '\uF2AF',
+      'ScopeTemplate': '\uF2B0',
+      'AssessmentGroupTemplate': '\uF2B1',
+      'NewTeamProject': '\uF2B2',
+      'CommentAdd': '\uF2B3',
+      'CommentNext': '\uF2B4',
+      'CommentPrevious': '\uF2B5',
+      'ShopServer': '\uF2B6',
+      'LocaleLanguage': '\uF2B7',
+      'QueryList': '\uF2B8',
+      'UserSync': '\uF2B9',
+      'UserPause': '\uF2BA',
+      'StreamingOff': '\uF2BB',
+      'ArrowTallUpLeft': '\uF2BD'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-9-inline.ts b/packages/icons/src/fabric-icons-9-inline.ts
new file mode 100644
index 0000000000000..22ca3ca662046
--- /dev/null
+++ b/packages/icons/src/fabric-icons-9-inline.ts
@@ -0,0 +1,121 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-9"`,
+      src: `url('data:application/octet-stream;base64,d09GRgABAAAAACvsAA4AAAAAVtgAAnhTAAAAAAAAAAAAAAAAAAAAAAAAAABPUy8yAAABRAAAAEgAAABgPQR6gGNtYXAAAAGMAAABgwAABDKpUp5hY3Z0IAAAAxAAAAAgAAAAKgnZCa9mcGdtAAADMAAAAPAAAAFZ/J7mjmdhc3AAAAQgAAAADAAAAAwACAAbZ2x5ZgAABCwAACGfAABCvDvL36FoZWFkAAAlzAAAADIAAAA2/LJqwmhoZWEAACYAAAAAFQAAACQQAQgDaG10eAAAJhgAAABPAAAAzhxWCvpsb2NhAAAmaAAAAMwAAADMUOdiQm1heHAAACc0AAAAHgAAACAA5AIwbmFtZQAAJ1QAAAP2AAAJ+o2Z8E5wb3N0AAArTAAAABQAAAAg/1EA3HByZXAAACtgAAAAiQAAANN4vfIOeJxjYGH/wTiBgZWBgXUWqzEDA6M0hGa+yJDGJMTBysrFyMQIBgxAIMCAAL7BCgoMDp/2ffbjAPMhJANYHQuEp8DAAAARIQk1eJzVknlLFFAUxd8wMRDMIREqLTOnMtMsc9911NJcKhCCIAiCQAgCQQiCQOmDlaW2b7bYvppmZYu/a1ZGTTf9Bv0zdOHxznLv5R14IYRoWD45IRL+wmJnkSW+Iprh93AYCrGQ5CznGOY8FxhhlDEuconLXOEq17jODW5yi9uMc4e73OM+EzzgIY94zBOe8oznvOAlr3jNJG+YYpq3zPCO93xglo984jNfmAOMeb6ywDe+84NFfvKblOVboZVZuVVYpVVZtdVYrdVZvTVYozVZsyWtxVqtzXbbHmu3DttrndZl3dZj+2x/KhVC2hMkPEHpvyfQGbVqUC06raROqVkn1aQBNapfDTqheh1XnfpUq2Oq0VFV64iqdFiVOqQKHVS5elWmAypVj3apUyVq1061aYdvK/Yt2326yKcKvXubdxW4u9XVfGdbtFkJ5WmDo4TjXG3SekdZrq3WRmW6ssrduHK00p2Y1imqbAVlxX9pbXxRa5Z/1/9dkVi6X5D++gMS5FIWAHicY9BiCGUoYGhgWMXIwNjA7MB4gMEBiwgQAACqHAeVeJxdj79Ow0AMxnMktIQnQDohnXUqQ5WInemGSyTUJSUM56WA1Eqk74CUhcUDz+JuGfNiCMwR/i62v8/6fL9zp/nJfHacpUcqKVacN+Gg1AsO6u2Z/fkhT+82ZWFM1XlW92XBagmia04X9U2waMjQ9ZZMbR4ftpwtYpfFjvDScNKGTuptAHaov8cd4lU8ksUjhBLfT/F9jEv6tSxWhtOLJqwD916z86gBTMVjE3j0GhB/yKQ/dWcT42w5ZdvATnOCRJ/KAvdEmoT7S49/9aCS/4b7bci/q0H1Tdz0FvSHYcGCsKGXZ9tQCRpg+Q6E/GTGAAEAAgAIAAr//wAPeJzNewl4G9W1/70zkkaKbdmyLMmxrWU0luQllhdZlnfLaxw7TuLs2HHihASSELLHgbaBCSQkQIAQePwp9BEKhJZSoP8uLOW1VRfgLV34vjz4L/mXpmXpKxS+tkBJbGnyP+fOyJYVxwnte9/3bM3cO3fuvXPm3HPP+Z1z7xCOPEmI7pB+jPBEICRiES0+0SI+yb8Vf557PtFH9GPjd9yvW0Tgj+JJ+FD4kBihpmgTLSELdZzhT03IsmAdkmWdHB8WcoewGgfVZSN2yfql0K8e+jWSc0SQz0ORQMZlvSxPyPB4rM/qCiSPSKSS1beZqUCzOWhkCdIAnGmNi7PlGQSqt9JW6qgL1/olL1wKEUoMJLI5kHhNDlnjrxiJs917nhheLFtQ53YVJULKkbXcL5y9w7ZSt7lgTmKh9wgn8/J/GKuwRe1CvZx4x5ov0K0TMie7wgvKAn3QaC29kfu5s+i8zeUOmKDRES/RIQOATpk0kcVkmFwLdOa5uJDdYaaSN8iFxXDIUtuqC9W4dE4apEhduDbISV4zZ7OIZmrLszvUtzBzrEFtK8djDzV1EWqm+laqVjcIvJznrSxweM1F5vBIT4lC5OCyfXc/sXr1E3fvWxbM8eTAb/DO72/d+v07B+k7HP6tGXn8Cz09X3h8REvfrlm1r6NyKKB0FxRy/QWFoVV78ZLKBZVSXns9ryvpGQnLPFG7VLtnPb2DnWLnCaI+iCMp3bJUiXbsW1VTWEBfDgz9JjBU2bF3VaiwAMfdNG3cM0g2sRIHKSRuGFdCbWLYgnIDB4VzJBSW+LTUSMZhNNVDgb4UGf/SUgMcwBPI6wkWKPLUmUBTdZwIsRGR+EgpqSDV8HSHLSA4JCqoJFgkOCImWmMHoZK8/nBtHR+CQjgoVPABrbpoLPZk+/NKYYyTE9CfPE5iHOHkAr+/AA6/zMhAmnR4PPSj53/8ZJS+9+PEGRDtOOFlZfhHCuGuYbXhUGT1n2PvwuReZvIkkBwylziBRkklDLjj00NWBEmPuKiDlcDsgakDLS4AZy6ws4HEZU/UA78L0B3OKz2ZAGqAXqBYhuGNE/qrHLfF4s7hqjlgFpnijwxjUkXqSSvpIL3wbBDbkIjiiRR4zTqJDRRINBeiNa1cJMhLog3pYISpqWQL8Yyb3GhFe6iktNLNny0MSnly3OOuLC0JtVcoHmRenhQspGfzi11Oi8XpKs5XPDogToE7VKbsZTiC4wtKRpCtRd4iK7ZIwIuwC9AwBoL9XiAmiyM722ExQdOEDM2AnxQ6oigccE1l1E4p71cLb9hMoqTr87wjjH/IBrJgk3woq1o6yzvyMN4zvCPBgeDxzYDcZF7NpbxmHNTRJV9znPFFTp5QV1IUcpADkO9S9Z1QL5pA5YBG0VnhPSbVDmgXnTbFRXciloi5RXWqo1pBDaClRqIWdx9oRflpPdCtNorLKZVYynQ7AfKNKbodOSbI54B6bA1aHu7HkdjUutlqXRMNmChQ6zDRCLbRVdOVu5RvKN/YRVeyE1xqPUTZnWm3yfQ+TdrzsUvKKCg4krhe+fAIfUjtI3HfkcR2mntE2cTmG8gFtCskEdDhbcg7nYvLteVxZk4neYuDHHAut5UrBh7qgIdQZgbeunRW1Apw6Mhd1PD2y7ctWHDby28r43fdpYwnr6jhri+9+9rj+6LRfY+/9u6XUvJxmSkmI5mxkdbhOfmidlpeTxLwogn1vZP0uy9NO87MWenksrDD2clB9YF//CSvkWfRpLTBxPEGdZq0TeMUj/MFR5ePHf70zecOdHUdeO7NTw+n5vf8+0sPbmtu3vbgS/++JyU/xj2VWEXtQ8oi+u0hI7m4nZo/Ty5qqeV54PNHa+iz9Nk1n59uK5iCABXD4uemu2eIfltZNETtiVXcU38L3boTa5SlytI1NFeeRreb9MxAN2hca21dpJWfnOMh1F4qrADcEeJjh/76xnMHursPPPfGXw9N5T99BWTQ7AwsbPHVXrW/q2v/VbXHnTWdfn9njdPf0NHgP24kF7U5rObHQfuU+jqcgfmL1jRhS+wBG2IHpdGm5t7hlujF8tJ5BXxH9Qu6OAxo8nOz/jtg0QAGoO34WwUG23JIt6zNrUzQU4BVfAwkUIYSwNiZ0nEbJajydcOcD/qIyzpCfcoZGk0DYTjrE2cUH5XR9lJffDgdSjF7DM8Wvqw9u5OMkF1kP1AQSqMgj3GSURAIu/iQqueRqzD8docNEaeZ00MVgDkBDZNqskHTjIJPRe8ELGbaOyQeDzR0NQR8zf2+7JJSf1ZmcaDEYi3x2lmxv3mB5OopLIh6LCVeB78mo6Ck6KvHNtpL7a1XdxUX91zT0bK+U1I+DraXWXNLosF50XJbXmkbd1r5+RqVGQkfpzFj/JUCn8dT3lRW0SSZdUKmcV2mNVPQW5z5hT63u6ypvLTRZxGyhq3ZQk7Rg1JXW71974DeUNZ/bXPbtsXz5vVfq/xJrO8vLVnYIEmN/YFAX6MkLOLmKV7kZHI855AsQIFVoO/nk5XkarKV7ATu3jQ5wuwkUmva+KKcRiSX3oqgPCAZbHkOH8D3EODEiGSmFMRXCAX1VkSPQggr+SvBAAcArPnAcwnV8ZCDawD1rD7IWUJGVifkJKflw394duPGZ/9wOJnaPHMtmQL3Hidk5ea776WUH+d55YDR+DHPf2w0csTqys/NNHK/5YzmXIfrjzylfzHCX7j8liU2h6AMLDpY9s9Zb5TJi2w2A/3+wIGyV/U2levDKssTZ1Kfh+mE7KxsbKjOMdc0NFa6KKLJtvb2tmgUc9FoW7snSs+6qqCKOau6oanKpcjtbSrkhJ/cv9NTu6P+/3p29u1I3Ltgpye0I/K/PDt6Q/sIcj51DCyAVuaSQbKN3Ei+Rt4A/ksp0k31EjhPcPCAtazAaOCei78ScQf8Du1UBN/KtVHVKwyDhygwj4u1803OHT/0Raf35bD51Ylz+TowYdKnCwN38HdNjsVW63A2VBSVdiwry6moKsvKKqmYl2sL+uaWR/uj5WUdgwHPoNPVU2yd55/LBVeuvqZypG3QHqgXj0LtPo9/xdh6f23QPbfEmUP7xOrGatHf0OMWO9zOdsksFlnFmoYaUYp0uFvCNS1ZrgIL/QKr5Wvo9oidriKtFhZhrea6mpZMd0EuQQGIn+KJKgOnEI1cIHLiKpsry2LLzJYqGopr2ktydKYs09asvGyjIVcsdJVK3sqOqmB7iVXI3mTLEXI9luWrlDfnL+3qKA4X2/R5lSFX4bAj75Msvavc67G6y/MftBfYbJ6agD/sMWeYR20OXaY9116Yh2XFtWK2dVjUZ9lytFqB2vRa1SVTtUB+9EwvAo4D6ckhdlIGszg5a0Oq4JiohQoOgBv6tOmrp4FIIILuhIIjRtQh08OAKdefPj2knKYV9JmSnlqXqxahLUt5Tjk9BDdxxigEUbrKMOVM3ArF0KLi+pTqLI2pTdDuUVn4q0EGXdNC2gmxThdTm+bm21S1TPmQIPGSlR2REDtA9PEQRIkPkaueeP/evn/o7rpv0d7v3NjWuPtr21c+3rf4udV3/O8HFhkS9Z/l/3nR9v4zfdv7fp/7h7pPcj/p29H364Xb+n6fpzz7VuNv+D/c9fG3N9lcD/t9g3f/aPvm79424K+4q8w1cup3dK1ybkR5nLJjhBpH6HrlJB4jyjnCYjHov8N7ZMCbBEFrEloXoSEK8Je6KNXmJLBei8b4tHnClVPrZM7CuU15dNNJpeJxpe4UHZmTpfvX6Na+0q7dDyxT7qTbug9uatm7RTn55chob2lp51VV3/y3+k0LK8IrdzZ+k8tvbOA/nYDRj5uK6unHxurBbR1X3T5SrSfe+TsGtj8qVhZEVjZHesss8ZyC+tVt3atDVqV2ml+QQRxA9ySu0PSMmrUJchIzcGRiMsclM0pqVlYxzXEY2zHgiYlFE4hVi2GAT3CZcTzO3aFk0l8p1Q/oP9QG7f8tYIMW/jh90AzyUaXnSOJf+I5ZRogjDwEt1xowZtCpUQKvpp9FYxqSGCApiw/xNyj3PKDco7tBkuZtDjXsW9c08KWTg+4Vq5cUOJeuWeOvXtdfGVq+bce25aGBLz600DV/fmdR671980YGaoDIiaO6G54P9jiLw3OdXat3LhiVBzxzcgssTxeUOnNy5vU11S6ORuqjg1t6Vh9Y4udNuebHy7zW8l42n2F8BJn5jXZAWTVTkUGwBhqGBfkJTwkVcNgKbwZWFJhqkTB4aLj9/EeG3InBodORdT2BeQObGjathbnoLKzqCGzhvv7ZNd80mAx8huG76xJDarBx//mPbudJYWRVc8tIm2epJdBaUdZYnKNcR99TTmXkZ2Y5MuiwUqS8w+KW1wgfAn/dBFxdDL8wXQOIG+ORkmriMXqA08HhAx/WAVIV4W41Oy309hdPGHijJUtZ1qssN1vm6Lm7f0JvyfGY9DuV06Ap7pPv47aWLPbzN04Qfrjti23uqDNewr/u7hLbDrTFvwYyf6tvIFCK6mnohM43ceYESY1n2UkBcREvqQYdA5zzB7QwFtOF4ZANESMF0jCQhSKvv2TI1EgaexQMRcgsdMJiEuxPR2Q6PXJa1Dc0FTkVSOIdwDdbLhCM2lCcQBizSDBFi9EYLJRddb0silqNUdRfFjmTUdS+I171fSjRYoTJ2GBgUhJS34cdyH+b5n9jqsaQU4gH7E7lcUY9z84Cix/K02iEWxeIRiH8WChbi789ynyVZWQfOUL+gXwVKEEs4Q8EwcWqC2F80M5mlkH8nOVWEBlR1ZcwJVuo6OfCmuKEMj5PxY5JZA74g3OIrTzUY2hdRJPBRQv8zlxpQWsAA4jOXG8f5OiTV1p4nbihhb5cFB6oGR+tGQgX0S+OHTZ0d+xZUV29Yk9HNydkrgx0oxfXHRhvCo8eWsxVLT40Ggbtu9PmyjOdj5nyXDb9WX+Bozgzv6qhtwoDmX97PuHpv7lOrhheUFm5YLhCvpbmPEKvC63a196+b1WII2XLyyPbat21PYFAT637g9WP3XF9cfH1dzy2+oM4KQrMs1jmBYqYPobxFmIwR80wcmXMx9QUB0gOnbJCJnbNJirOY3p25B/3tvfd9NS6px6goc69K2sqlmxv/5bhG8rQ/1A2PU1dpuw5htw5dJ5Brhg5vvGah7aElSI9SWxztl/bN399U0HiE+7++P9RAvRNvizxQ2tJXl6JletI02sWLdo8pddAR+O/HoxDBI+QwA5BYocUwQPuTKm2uO1m+ojyW2pSPqPv7TTvKtxv3h9YHBgrWVSyM3tH0Y25YyUDgbHAwMEbnPtTFdy232/L7DrS9U/wB8n3vve980cIs+mp9FlZ7EijjjKLqBpKmjSQYqqaTXzG4rMwZRR1brOryadyJu0uu5Osqvq0U8/Mg/ldi6hokit0SqtTnzp0IU1ZueiMmMKWovrHlD8f+4Fe0HEm/U+OKH/kd1cuXF/zlz+Vrugu72tbNKIcGHSG/HZ7ceXc4etc4RJHUUWjeziVU4mXcjwWi8fC9STIr+uXRQp5klvWWd251mG6+j6zs8Lj9DtMiZ+bnZVicWXhnI/TxriUdJMFKW8z6WjPhPfolY/76LJDa6ojm+5eXbGmzL98XnRjt8/bvra5ek1Z1XV03c6s3UwSFvlx/HegJFhAJgJj/kW37E+VhMiGo4MrT2xtzrR+wWEv79/S0riht8RRsGuulYZnkA+OGqlseAXmk5UsxtkELAdBmHKF6OdBF/Rg+6LSzHu9Sw6td7UUFbTx2TOgjGXDs6IMjuvcuLeGL4q/t/TJw8uNWfdYs/moBjk6V++6csih+qDCz7XYSnItqoF0kT3ksYtiLMwLZR4oeqNoc+DFnFREbzAJ3fF9HVokRZjVr7RfiWNpn/IsLw7FJH1Lef16+mz94lC+8h1uaddAR2BNRdOqhiJPy6pHMuaWFBWWua08J0jhlrBU0tLnLe4RXd3+bMmdx4p8TT2iu9UZbs/yOK30Sam2tVYKQDWp1zNTtY4sT5FVjRqkOo1sYuOy0h30r/6Oq0Jl83uCV821+DtH6mtH5pe9PjfotdmkYH6Xw2m3S+HS0gZvdmb2NY58XaYjL99pt3nD5YGIlGPK2FCsN9st+UVQrbasrH7Wair0wTHEOIIOkixiI/mkiHhIsToDRSu6gbgGpXqFVDJRtmRj0w6BnAcf0McCdCp3Y1FZGb5AHuajUOSLa2zWnxn3oedHfeeH9fDe5+F5cabSuFPKGZ1aidEDyFA4NxlbKgV930p62NyRpscML5pJVikA076QBgBHGrIB3UpT+Jaye9aQFW+aKdy9KNowsdlbajdudtQsDOcWW8wid9P7e+rP1e3+4MureD3HG1byD/5u72/2PKzX85xBf5J7AO/u+eOYtJrX8RzPr+JBk6XG4M7XuaoaCumtyraqlVE/L2wwGTlf4o6vfpUbU+SJOdY5dssEhTGHS29WgdlcYKa/nrxtyjPCbwLHKGda/NSaguvKSSUJaestnWQ+ISZqk8Js9RDRKnAJV9e0g6akdIYylmJzSHVnNNbwyB7mpyOGBSFlByVTeXXVbYZUTVDUz8g44HJy/FUsjKd46urb9HW4lFh34OJIt+p/sjireMmYPPfKlDN66fB7XJ4MdKfF2NU1Ai2WHtJi66jBeA2QaksD0lTsV+ek0n+jNYLoDPRrHAxpHOUD4Gb9jWszbDVJeR/Xlv4z12auiG70znGZU/j8a2G4lqS8r64s/b1rYX/HuifbpXG59cRLrXsqcVy2ZKL796x94vLMtLVP16XpB0Mw+9LnXYnL0BLnaSKuyujUWqs0C8cwEgDHrI/NUpXG5ZdcJ9d5k+vbhuSauQUXt/VRJJ8tjXcyMmdaX0/VO+qafKqKUVfmU9UJ7uui2YBtd4HeBu2MQstWQtnhgGv9gwmb7vT4g8rS5bRFeYb+B/fBRIV+M312ufJTukwPoEBW7tlAs3FjC921QfmznOJzoMz1k3VXsBJ48QpM2j6GS8jZl7b+7OljGyORjcee/tnW1PziY1uam7ccW7zkTkzvXJK250G4pNidly/uTM3r5NQO8QGJGXZIkP9Ge1D0bLfJBYZx6GSe/r17UCb3LhnB4hNtN5BPz1wi6Ps8HBh958k5bUsSGlr9pMxxuJeOye18MjzlwTPnIsgHLFO+BopCxJJiynB908U7Wvl0ATFEcR8a7nNr2Ly8MePql5+8K1y/tsuPJbhfzd+1th6vcWMc1vR3ro3M2fbMbw9mNi67tiFtMUBHks0C3WvrDc0bjy5XxqDi5gYswy4aNi9rzOQz1bLkg6+FsoO/fWbbnMjaTr9C0pcLZt8fZ03bHxcAL8Salk5ujjOoyJwBlbR09u1xhMctV0JUUPULUgS4GTSM1USxuT42EZO53yVcGEZDhQRP+4wzcaak7Vb3amZqqCebXskWTf7glW7NJJ9jRyZR111S+Dnpkwem7TaVkV+TW05B1FW9Z2VzlO1npbg+ACjDYgRp5U+d+2hIsOpkdWfruY/4U1p9K7MJrL5kYWoSvJNzHw4JufHhlJZykldqnNNMnOq6gaDyCpkCHsIluSVzL3vi7wpybnGuuch8XjbMEpGlOF8VO+J7uhkkbtbQK8zFJE2ZJJfYiY/FqoRUqtiAIqGXpk+HLFSJQ3VSE4q/i1AaRktXf2lKOeWg7tYkpRMHQv9qIPIEcGk2kg2qX8HozWN+XznYkzSK8QIOnwZWLk23AW2gSvcFAlaLQ582QZg1RD/PMAv1uptknpui/h/1j8ah5BbUjTDLLsd33STfTSBFXhKclAYkXJs+wiwTSBUJPQEdL8gwi2AuzxanZ1KhEqjNpYQC9CcuE5pPkQ81lukh85BSlbFXQiezK2yfLiMTfOvZRAJVDLBvcr4jWy9LI1qQKNAYIwhoALEgPKqgFhVojhMaVWI6UHy4vzQe5V7/05+419X5vgBszgvQxIKthOTGwQjLOMBsvSAnFoBALJC5F9iJYhF0teMtem/8Ld7LMvTet5QdvDcO2beQX9p6aTng6m6ykIwCvwxO3BjuwCBZXYRFj+oiLOxjUde0QHJFW4im7M9Bq0bFGjcVJTHSSkNi+k2n0xao92ZXt8z3d49J3M+ksW5IH0NDjUjEp7xYON8f3+fUvY1FaNG1NLGJZhRYP0yckZXw1UaPlVYocloV/hfR7l5/T3N1tlQfsHc1N3d1NTMgQRDg0N5Cp4YsUtvpiPXDM5a8i2+kYHUvqdNiNKBdWfgsxT8yCL40A27U9jX3PbZ8/Xe/cnBNTc2ag1/57no1n5MdP5lmoynurIJh/VWgJLWmmg9trHrtIvObJt+ZIAlQ6KNsJ4HIdl87mCED8GziwiYO9TtaVYWdJ3DlIRalwA6Zg4SPxaNgVgup7wEqJ97n4DzxPloN/oFYNP6+zs69j+GExI+hRdvz/I+gj/cAG9OD2v5dXE9uIAPAIzswpTgCz0x3fSdjySqr+DSx4Mh11HDPPdRwnYIr17jVdy/u5t87+bGAuq938J6tra1b7xlMpmlQmG9cu3Hj2virqAR5kvqtQWpeZ0ztAtPEDTOAX25yTugYurCZaJhF6IwkDv86+D8Hd1cgvSvib3AkXs6/weYni/NBuxZNalLlIyWCwYWYRPmTEVSYL5o+EthKZFIakR6GzpMFFG8XSyXdI+H1T9XVPbUea1gBsOJ2g6T8Jt8keY33mrqxZHhwcBjvetudqh6i5GbhAmBgJ8x+ktSJYsDESWwrNhLnpjCdraKZsv3ZgVDERPVnd71634r8fKU6psQUUFa/ys9fcd+ru65/bWDduoHXsqgimI3xk/GTRrOgxGiMRgUZ7zfuDv8zXisvhnc3YhdLB0ZHB5bGZaPFGH+UH4XkRSVKo5q9wZ30gszsjVOLT3EOtusPWIbGE4CSRWzlgZkU7ShqHQsnl7dHapzxu8E2dt7SVHeoRwE4Gb+7KBRpL0cF23OorumWTkCQslWsKgJoCHZGFMc3VVQBtBonRVWiVQ/zpKpC/zAUMxwksF39xJiOeVVvVfNx8KDJfRWIf8H0K1r0G0N8qm+Mh5F95zDBrDeHEWkto8kPvjN4wvj9hmgFGKgeFHEgNY/yXk/CFeU2eBJvnaUbaUx1aaAlD/c1+6f6rXMAbzSQdrbOk5xwjhq7EyBfbV1IXRhAF8XMM6eFLfBiPXisTS+ilILrbGnlw5zcNLIrEtk10nQ2C7wra5Z+FMWq98DXR0t33HJ8Qd89t+woHf36gV5VQlF9XCDoq+ghRX+FI63r2r3e9nWt0PgsdKKXsWpswxP7O1tH20WxfbS1c/8TG2LMIZTlGPNM6LhiYL4Jev6ML88Az+/Et4kEImzO2B0Rh8AWoVUoFaTqa0k46XCbQ57B5mCJEGDbILV3NeAKt4AiXof77cK4OYJnzVq5JloHDmwLDCtwAC5CNQ7UXawAHDe7g4u57hy6qQLDVRU3Dd3p4rn+k4ODJ/s5npfRjZIdZQ1e6xzKt0Tbm4fKKpyeGx79yZYtP3n0RrezomyouT3awtM5Vm9DmUNGN8xe0tC+a3m1jDr+qcMnThx+CjW9XL18V3tDiSHa23Zs6KZAWVngpqFjbb1ZczM9Xq8nc64ygO5aLOZtC0mG1pujxb3Fuo7jwysehkdub+ps2XhqrL197NTGls6m7fDQh1cMH+/QQaXoza0GKdTmjcWQ1u4mrnblnvZYDB8ZjSIJsVj7npW1XFM3+llEW7cwg3/n03RaUpYwupJUbiBU2hcMAF84ktRA+LnIhUm9BJr5zFH8tuEofVhgcyCpd9GhT6o4OXEaKlHrUWWT6oNwKbFiaeb95LibJS0i/OkbaqjxjU9ekVnkKi3q++anUOdNyE/g1EnIGi6jgMsMHaSEhNneGRCxkMVrkMpowKfKTrg24mPCJlngHn73hhEPnwGlRZANeZn5tWZzTb6lwJjQz2lYvqURvW2DstdozbBXWMzVjgyrgXtVitZ4DcptPDDcEKWUm5Apd7RhQ08JCkSRcz4UcYSjNB7LL2+UOnMtzPjrJteROPB8ishyFre4aGM3gyts268/EAkI7KTOj4DgYCf1Sz7BEWEnFd45IgE8GQCSKDEW9Q51+tS0g7/mPKDIW/HjupciL4nBgdsWggcCv4W3DQRFKALZn/mOgdAz8dSuWCSeHh3HNQs5cTStmyt5wNR+AFylLwBPpINhaBHARwobUEb16QA1fZNlH30e4PYPaGdCTkeBXDrI5N5NR527uGy0rYm/cOYpm62lD6f3R2fCmckYo17z4C3iXBhRATQo+KLM9QePFKyRQi5vh9g8UI9UO4Qzkmp2iJenrBA/mx1K4t8c5KzVBybfaqK83kR9PEU8Oap42Pd7nlFElaP0LFJGz45SEJMZi7UmZFosvxKs04pLR6bToSMN8mzNWlP9F4dXZwlgfyw2zps7d16jqKX8tTVjh4/39x8/vL/6eO9Pr7/+p73GtCqXCXY/mlKVpfH7I6tbPJ6W1ZGbB4eGBrmn0yswvvJMl0kamgEHywLvzWfTQFAH3hXqklbKx0JrVi0v7z1+/1eWLTj4rV++u9ft3vvuL791cMGyr9x/vHfFN4wkq7C0MNjoyVTICWX8g9dfeKQzN7fzkRde/4AaTnAk09MYjITV9R4W4ywDP6ZjepQSFJlon7oARSYh3qCi1cF8YbbzvE5fo7nGcGmIproiGYn3M5L5phplyQ/o3BWGE8qbEz9dkZv8XpSPal+actMCiW5RdCfzkbX5eivghDgcseR3qcn2amyf+cqytpKgwvBxgJ0XoHBcBrwY08uX8IsiSb8ohE5/hPlFUtIvYt+9cuysx1hjDDwh0CyJGDrdfAwQ4rvKmc/jFhE6aS/na3bKkmfA4HhykQA/N0WBRgAmIhTD215/C2XgC78AwM+vdUQN1deXKDCBUv0XgHloLitFOipWVorKo2LlkmObmz0l9SzEbyRqpD9xtqSek1PdH5jbaGursNVZPFU1bz62RK4v4Tzqs2aOA1A7g4gCmj5/QEQH2B9g8mJhSAktpAiwN20mUtGbTcWQGECMnn5TeHtaICDRnB4IAHd9vp+/0znhTFfADyufFlg/5Hwy/TcMBCin6X9xIICghQmRtcIvtH1Tc9hO/jy2ykRD8A8qUWQ/H1xzu2gGNdKMZ5RPv8i5Ej9Tdiu79cPx/0l/OHGU/hDSe5XdXNEBdUGDhZnii/hvT7yl8+IBJagfQYbAYYHnBcgqcoS8wHZzBoJ6xDoRVfO59AiABHDJalgZ/rQSidVtwR2D+NNb/xNq8LHu27u8w+tGeisqekfWDXu7bu++uKRix/4bd23wZVkyQJ8F+9etH/F2HOqAn3dk/br+IG/mMixZxVfvunH/9uB/UV09ycwSHMVVLf0VFf0tVcUOIStzekm+IStTNpgd3qArw5bJmbgTwf5WLM7MyMg05BdXtfYHT0Bxpi3DFfQ6zAblkrWx2yuvPVPf/x86RmTjAHicY2BkYGBgqgjeOHUfUzy/zVcGbg4GENj/92ADiL465fFHEM3BABbnZGACUQBdzgrcAAB4nGNgZGDgYAABOMnIgAqYAALKAB0AAAB4nGPVYljGwQABjAwIwNjAgAka4BACJjDMYmjAlGXkANMaDNjMYICIMiLsEAZCuDgQeEJd0AgWYwSrBck1AGkmmD3IboW63JiRAQCW2A9pAAAAABYALABCAJYBKAFqAb4B+gJqAtoDGgMwA1oDdgPWBBAEbATIBSgFhAXCBmwHLghOCKQJCAlmCZIJ2Ao2CogK0gs6C34MWgyiDPINLA2UDgIOcA9SD5oQJBCeENoROhGWEfISVBKMEsoS4BMCEywTrBQcFDwUuBT6FRgVYBV+FZYVrhX4FlAWtBcIF1oXdhegGCoYeBi6GSoZRhmeGewaMhpmGoga8huuG/AcJhx2HPodXh12Haod2B5WHo4e8B8EH0YfpCAwIGghXnicY2BkYGBIZbjGIMAAAoxgkguIUxgjQUwAJjoCFgAAeJy1VE+LGzcUf1472S1plhIo5KhDKZvFjBN3ITQ5LUlzyl42YSGXgjwjz4iMR0LSZJjSQ4859GP0EuinKC302HM/Qc899dj3njT2buyGbaEeRvPT0/v7e08GgLujz2EE8fcFvhGP4A7uIt6Dffgq4THKnyc8Qfx1wjfgY7AJ34RP4NuE9+FL+D7hA/gUfkn4FhzD7wnfHv08miR8CMd7v2KU0eQj3BV7fyY8gs/GFwnvweH4m4THKH+b8ATxjwnfgLvj3xK+CWL8R8L74CYHCR/A8WTwcwteTn5I+Pb47eSvhA/h5cF3P70T8/sPTsSZzp3xZhnEE+OscTJo02TitK7FuS6r4MW58sq9UUX2TC6czsXZ0+dzceq9Cv5clW0t3fbBtuRCOY+exTw7eRhP6TCevVClUUJ7IUVwslAr6V4LsxShUpfyK51pLYlzs7Ky0cpnO5OvQrCPZrOu67LVcJ6hzSz01pRO2qqfLU0T/Gxj7ltra60KQQeZeGVasZK9aL3CJDAxEotgRO6UDGoqCu1tLfupkE0hrNN4mqOKwq/0wiq30iGgu0XPRdQ6Vw35wgMvjBvAkiJMt0u1zhRtHqaCmEfbKdkMAXQjukrn1aXMOgyqm7xuC2zTOnvT1L040veEWi0wl406evhQtqxe6KYUTvmAnSJWNwHIfO3rMTNwpDFKUCtqgdMYtTBdUxtZXGVPRqqUo3IMhsK1DbYNolBUJulUqrZXGcVhbPqkTg1Bh8hPpRcac86u3214BwLmcB8ewAmiM9CQgwMDHt8lBJQ9QeTwztMqUaIRNZDhySnU+Ag4R1kJFZ553in8KtR+g2uBms/QboF78k0xnuI/y5ztPWuSHVmV0KI/iZrXsbiOzgXn4VPOVGmGdT68YjtYXrZ7wdkYXAXqUFUS38AMFChdcZavUUYs0UnFurv4K3nfIoODdo7fFe4l5qSZrexfME88B5Q+ghk+HT8Z+nvfPktxZoh79lKyH4seepQu2RtVO9sZ3XPOFjuiuY9ibUG9f8U1CWaix2/L3EUmImODNskMV+1Qg+pQMMV9wXqWO96zhPigOJY7E23z5EWlvWTflvtKNQc+I6sF5zF0ouaKyGrIK1p47oLbkizXNUyv1VXL+wJtctxPma848zHudB3n/Qo0T2LHPOW47uasS5WSdo7VtDx3xU7uyaZmdIT69/BLE7pIvOzyHnP4r9xuvBfsqUSZ4zkO6U4Ns7qrgiH6dl6PL80AVRJrCRxvuAXkP9ZaoKTjyg3fyg/NnrwyVYr7YtIaq4q45ZvVsiVlO3Rz8EOaNd/kf57R+M/YpM5svA83RCeWaX4o3wUzHXv7P9ztvwEy7jiOAAB4nGNgZgCD/34M5QyYIBUAKY8CLXic28CgzbCJkZNJm3ETF4jcztWaG2qrysChvZ07NdhBTwbE4onwsNCQBLF4nc215YVBLD4dFRkRHhCLX05CmI8DxBLg4+FkZwGxBMEAxBLaMKEgwADIYtjOCDeaCW40M9xoFrjRrHCj2eQkoUazw43mgBvNCTd6kzAju/YGBgXX2kwJFwDEASgaAAAA') format('woff')`, 
+    },
+    icons: {
+      'ArrowTallUpRight': '\uF2BE',
+      'ArrowTallDownLeft': '\uF2BF',
+      'ArrowTallDownRight': '\uF2C0',
+      'FieldEmpty': '\uF2C1',
+      'FieldFilled': '\uF2C2',
+      'FieldChanged': '\uF2C3',
+      'FieldNotChanged': '\uF2C4',
+      'RingerOff': '\uF2C5',
+      'PlayResume': '\uF2C6',
+      'BulletedList2': '\uF2C7',
+      'BulletedList2Mirrored': '\uF2C8',
+      'ImageCrosshair': '\uF2C9',
+      'GitGraph': '\uF2CA',
+      'Repo': '\uF2CB',
+      'RepoSolid': '\uF2CC',
+      'FolderQuery': '\uF2CD',
+      'FolderList': '\uF2CE',
+      'FolderListMirrored': '\uF2CF',
+      'LocationOutline': '\uF2D0',
+      'POISolid': '\uF2D1',
+      'CalculatorNotEqualTo': '\uF2D2',
+      'BoxSubtractSolid': '\uF2D3',
+      'BoxAdditionSolid': '\uF2D4',
+      'BoxMultiplySolid': '\uF2D5',
+      'BoxPlaySolid': '\uF2D6',
+      'BoxCheckmarkSolid': '\uF2D7',
+      'CirclePauseSolid': '\uF2D8',
+      'CirclePause': '\uF2D9',
+      'MSNVideosSolid': '\uF2DA',
+      'CircleStopSolid': '\uF2DB',
+      'CircleStop': '\uF2DC',
+      'NavigateBack': '\uF2DD',
+      'NavigateBackMirrored': '\uF2DE',
+      'NavigateForward': '\uF2DF',
+      'NavigateForwardMirrored': '\uF2E0',
+      'UnknownSolid': '\uF2E1',
+      'UnknownMirroredSolid': '\uF2E2',
+      'CircleAddition': '\uF2E3',
+      'CircleAdditionSolid': '\uF2E4',
+      'FilePDB': '\uF2E5',
+      'FileTemplate': '\uF2E6',
+      'FileSQL': '\uF2E7',
+      'FileJAVA': '\uF2E8',
+      'FileASPX': '\uF2E9',
+      'FileCSS': '\uF2EA',
+      'FileSass': '\uF2EB',
+      'FileLess': '\uF2EC',
+      'FileHTML': '\uF2ED',
+      'JavaScriptLanguage': '\uF2EE',
+      'CSharpLanguage': '\uF2EF',
+      'CSharp': '\uF2F0',
+      'VisualBasicLanguage': '\uF2F1',
+      'VB': '\uF2F2',
+      'CPlusPlusLanguage': '\uF2F3',
+      'CPlusPlus': '\uF2F4',
+      'FSharpLanguage': '\uF2F5',
+      'FSharp': '\uF2F6',
+      'TypeScriptLanguage': '\uF2F7',
+      'PythonLanguage': '\uF2F8',
+      'PY': '\uF2F9',
+      'CoffeeScript': '\uF2FA',
+      'MarkDownLanguage': '\uF2FB',
+      'FullWidth': '\uF2FE',
+      'FullWidthEdit': '\uF2FF',
+      'SingleColumnEdit': '\uF321',
+      'DoubleColumnEdit': '\uF322',
+      'TripleColumnEdit': '\uF323',
+      'ColumnLeftTwoThirdsEdit': '\uF324',
+      'ColumnRightTwoThirdsEdit': '\uF325',
+      'StreamLogo': '\uF329',
+      'AlertSolid': '\uF331',
+      'MegaphoneSolid': '\uF332',
+      'TaskSolid': '\uF333',
+      'ConfigurationSolid': '\uF334',
+      'BugSolid': '\uF335',
+      'CrownSolid': '\uF336',
+      'Trophy2Solid': '\uF337',
+      'QuickNoteSolid': '\uF338',
+      'ConstructionConeSolid': '\uF339',
+      'PageListSolid': '\uF33A',
+      'PageListMirroredSolid': '\uF33B',
+      'StarburstSolid': '\uF33C',
+      'ReadingModeSolid': '\uF33D',
+      'SadSolid': '\uF33E',
+      'HealthSolid': '\uF33F',
+      'ShieldSolid': '\uF340',
+      'GiftBoxSolid': '\uF341',
+      'ShoppingCartSolid': '\uF342',
+      'MailSolid': '\uF343',
+      'ChatSolid': '\uF344',
+      'RibbonSolid': '\uF345',
+      'FinancialSolid': '\uF346',
+      'FinancialMirroredSolid': '\uF347',
+      'HeadsetSolid': '\uF348',
+      'PermissionsSolid': '\uF349',
+      'ParkingSolid': '\uF34A',
+      'ParkingMirroredSolid': '\uF34B',
+      'DiamondSolid': '\uF34C',
+      'AsteriskSolid': '\uF34D',
+      'OfflineStorageSolid': '\uF34E'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-9.ts b/packages/icons/src/fabric-icons-9.ts
new file mode 100644
index 0000000000000..4f98e7f757c11
--- /dev/null
+++ b/packages/icons/src/fabric-icons-9.ts
@@ -0,0 +1,121 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-9"`,
+      src: `url('${baseUrl}fabric-icons-9-a362212c.woff') format('woff')`, 
+    },
+    icons: {
+      'ArrowTallUpRight': '\uF2BE',
+      'ArrowTallDownLeft': '\uF2BF',
+      'ArrowTallDownRight': '\uF2C0',
+      'FieldEmpty': '\uF2C1',
+      'FieldFilled': '\uF2C2',
+      'FieldChanged': '\uF2C3',
+      'FieldNotChanged': '\uF2C4',
+      'RingerOff': '\uF2C5',
+      'PlayResume': '\uF2C6',
+      'BulletedList2': '\uF2C7',
+      'BulletedList2Mirrored': '\uF2C8',
+      'ImageCrosshair': '\uF2C9',
+      'GitGraph': '\uF2CA',
+      'Repo': '\uF2CB',
+      'RepoSolid': '\uF2CC',
+      'FolderQuery': '\uF2CD',
+      'FolderList': '\uF2CE',
+      'FolderListMirrored': '\uF2CF',
+      'LocationOutline': '\uF2D0',
+      'POISolid': '\uF2D1',
+      'CalculatorNotEqualTo': '\uF2D2',
+      'BoxSubtractSolid': '\uF2D3',
+      'BoxAdditionSolid': '\uF2D4',
+      'BoxMultiplySolid': '\uF2D5',
+      'BoxPlaySolid': '\uF2D6',
+      'BoxCheckmarkSolid': '\uF2D7',
+      'CirclePauseSolid': '\uF2D8',
+      'CirclePause': '\uF2D9',
+      'MSNVideosSolid': '\uF2DA',
+      'CircleStopSolid': '\uF2DB',
+      'CircleStop': '\uF2DC',
+      'NavigateBack': '\uF2DD',
+      'NavigateBackMirrored': '\uF2DE',
+      'NavigateForward': '\uF2DF',
+      'NavigateForwardMirrored': '\uF2E0',
+      'UnknownSolid': '\uF2E1',
+      'UnknownMirroredSolid': '\uF2E2',
+      'CircleAddition': '\uF2E3',
+      'CircleAdditionSolid': '\uF2E4',
+      'FilePDB': '\uF2E5',
+      'FileTemplate': '\uF2E6',
+      'FileSQL': '\uF2E7',
+      'FileJAVA': '\uF2E8',
+      'FileASPX': '\uF2E9',
+      'FileCSS': '\uF2EA',
+      'FileSass': '\uF2EB',
+      'FileLess': '\uF2EC',
+      'FileHTML': '\uF2ED',
+      'JavaScriptLanguage': '\uF2EE',
+      'CSharpLanguage': '\uF2EF',
+      'CSharp': '\uF2F0',
+      'VisualBasicLanguage': '\uF2F1',
+      'VB': '\uF2F2',
+      'CPlusPlusLanguage': '\uF2F3',
+      'CPlusPlus': '\uF2F4',
+      'FSharpLanguage': '\uF2F5',
+      'FSharp': '\uF2F6',
+      'TypeScriptLanguage': '\uF2F7',
+      'PythonLanguage': '\uF2F8',
+      'PY': '\uF2F9',
+      'CoffeeScript': '\uF2FA',
+      'MarkDownLanguage': '\uF2FB',
+      'FullWidth': '\uF2FE',
+      'FullWidthEdit': '\uF2FF',
+      'SingleColumnEdit': '\uF321',
+      'DoubleColumnEdit': '\uF322',
+      'TripleColumnEdit': '\uF323',
+      'ColumnLeftTwoThirdsEdit': '\uF324',
+      'ColumnRightTwoThirdsEdit': '\uF325',
+      'StreamLogo': '\uF329',
+      'AlertSolid': '\uF331',
+      'MegaphoneSolid': '\uF332',
+      'TaskSolid': '\uF333',
+      'ConfigurationSolid': '\uF334',
+      'BugSolid': '\uF335',
+      'CrownSolid': '\uF336',
+      'Trophy2Solid': '\uF337',
+      'QuickNoteSolid': '\uF338',
+      'ConstructionConeSolid': '\uF339',
+      'PageListSolid': '\uF33A',
+      'PageListMirroredSolid': '\uF33B',
+      'StarburstSolid': '\uF33C',
+      'ReadingModeSolid': '\uF33D',
+      'SadSolid': '\uF33E',
+      'HealthSolid': '\uF33F',
+      'ShieldSolid': '\uF340',
+      'GiftBoxSolid': '\uF341',
+      'ShoppingCartSolid': '\uF342',
+      'MailSolid': '\uF343',
+      'ChatSolid': '\uF344',
+      'RibbonSolid': '\uF345',
+      'FinancialSolid': '\uF346',
+      'FinancialMirroredSolid': '\uF347',
+      'HeadsetSolid': '\uF348',
+      'PermissionsSolid': '\uF349',
+      'ParkingSolid': '\uF34A',
+      'ParkingMirroredSolid': '\uF34B',
+      'DiamondSolid': '\uF34C',
+      'AsteriskSolid': '\uF34D',
+      'OfflineStorageSolid': '\uF34E'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons-inline.ts b/packages/icons/src/fabric-icons-inline.ts
new file mode 100644
index 0000000000000..7a81c1215bcb8
--- /dev/null
+++ b/packages/icons/src/fabric-icons-inline.ts
@@ -0,0 +1,75 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons"`,
+      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
+    },
+    icons: {
+      'GlobalNavButton': '\uE700',
+      'ChevronDown': '\uE70D',
+      'ChevronUp': '\uE70E',
+      'Edit': '\uE70F',
+      'Add': '\uE710',
+      'Cancel': '\uE711',
+      'More': '\uE712',
+      'Settings': '\uE713',
+      'Mail': '\uE715',
+      'Filter': '\uE71C',
+      'Search': '\uE721',
+      'Share': '\uE72D',
+      'FavoriteStar': '\uE734',
+      'FavoriteStarFill': '\uE735',
+      'CheckMark': '\uE73E',
+      'Delete': '\uE74D',
+      'ChevronLeft': '\uE76B',
+      'ChevronRight': '\uE76C',
+      'Calendar': '\uE787',
+      'Undo': '\uE7A7',
+      'Flag': '\uE7C1',
+      'Page': '\uE7C3',
+      'View': '\uE890',
+      'Clear': '\uE894',
+      'Download': '\uE896',
+      'Upload': '\uE898',
+      'Folder': '\uE8B7',
+      'Sort': '\uE8CB',
+      'AlignRight': '\uE8E2',
+      'AlignLeft': '\uE8E4',
+      'Tag': '\uE8EC',
+      'AddFriend': '\uE8FA',
+      'Info': '\uE946',
+      'Pinned': '\uE840',
+      'SortLines': '\uE9D0',
+      'List': '\uEA37',
+      'CircleRing': '\uEA3A',
+      'Heart': '\uEB51',
+      'HeartFill': '\uEB52',
+      'Tiles': '\uECA5',
+      'Embed': '\uECCE',
+      'Ascending': '\uEDC0',
+      'Descending': '\uEDC1',
+      'SortUp': '\uEE68',
+      'SortDown': '\uEE69',
+      'SyncToPC': '\uEE6E',
+      'LargeGrid': '\uEECB',
+      'SkypeCheck': '\uEF80',
+      'SkypeClock': '\uEF81',
+      'SkypeMinus': '\uEF82',
+      'ClearFilter': '\uEF8F',
+      'Flow': '\uEF90',
+      'StatusCircleCheckmark': '\uF13E',
+      'MoreVertical': '\uF2BC'
+    }
+  });
+}
diff --git a/packages/icons/src/fabric-icons.ts b/packages/icons/src/fabric-icons.ts
new file mode 100644
index 0000000000000..edf7c0a85bdbc
--- /dev/null
+++ b/packages/icons/src/fabric-icons.ts
@@ -0,0 +1,75 @@
+// tslint:disable:max-line-length
+
+import { registerIcons } from '@uifabric/styling/lib/index';
+
+export function initializeIcons(baseUrl: string = ''): void {
+  registerIcons({
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons"`,
+      src: `url('${baseUrl}fabric-icons-4ac62dd2.woff') format('woff')`, 
+    },
+    icons: {
+      'GlobalNavButton': '\uE700',
+      'ChevronDown': '\uE70D',
+      'ChevronUp': '\uE70E',
+      'Edit': '\uE70F',
+      'Add': '\uE710',
+      'Cancel': '\uE711',
+      'More': '\uE712',
+      'Settings': '\uE713',
+      'Mail': '\uE715',
+      'Filter': '\uE71C',
+      'Search': '\uE721',
+      'Share': '\uE72D',
+      'FavoriteStar': '\uE734',
+      'FavoriteStarFill': '\uE735',
+      'CheckMark': '\uE73E',
+      'Delete': '\uE74D',
+      'ChevronLeft': '\uE76B',
+      'ChevronRight': '\uE76C',
+      'Calendar': '\uE787',
+      'Undo': '\uE7A7',
+      'Flag': '\uE7C1',
+      'Page': '\uE7C3',
+      'View': '\uE890',
+      'Clear': '\uE894',
+      'Download': '\uE896',
+      'Upload': '\uE898',
+      'Folder': '\uE8B7',
+      'Sort': '\uE8CB',
+      'AlignRight': '\uE8E2',
+      'AlignLeft': '\uE8E4',
+      'Tag': '\uE8EC',
+      'AddFriend': '\uE8FA',
+      'Info': '\uE946',
+      'Pinned': '\uE840',
+      'SortLines': '\uE9D0',
+      'List': '\uEA37',
+      'CircleRing': '\uEA3A',
+      'Heart': '\uEB51',
+      'HeartFill': '\uEB52',
+      'Tiles': '\uECA5',
+      'Embed': '\uECCE',
+      'Ascending': '\uEDC0',
+      'Descending': '\uEDC1',
+      'SortUp': '\uEE68',
+      'SortDown': '\uEE69',
+      'SyncToPC': '\uEE6E',
+      'LargeGrid': '\uEECB',
+      'SkypeCheck': '\uEF80',
+      'SkypeClock': '\uEF81',
+      'SkypeMinus': '\uEF82',
+      'ClearFilter': '\uEF8F',
+      'Flow': '\uEF90',
+      'StatusCircleCheckmark': '\uF13E',
+      'MoreVertical': '\uF2BC'
+    }
+  });
+}
diff --git a/packages/icons/src/icon-aliases.ts b/packages/icons/src/icon-aliases.ts
new file mode 100644
index 0000000000000..ca554fa34ff78
--- /dev/null
+++ b/packages/icons/src/icon-aliases.ts
@@ -0,0 +1,3 @@
+import { registerIconAlias } from '@uifabric/styling/lib/index';
+
+registerIconAlias('trash', 'delete');
diff --git a/packages/icons/src/index.ts b/packages/icons/src/index.ts
new file mode 100644
index 0000000000000..ba591c1d72fbb
--- /dev/null
+++ b/packages/icons/src/index.ts
@@ -0,0 +1,22 @@
+import { initializeIcons as i } from './fabric-icons';
+import { initializeIcons as i0 } from './fabric-icons-0';
+import { initializeIcons as i1 } from './fabric-icons-1';
+import { initializeIcons as i2 } from './fabric-icons-2';
+import { initializeIcons as i3 } from './fabric-icons-3';
+import { initializeIcons as i4 } from './fabric-icons-4';
+import { initializeIcons as i5 } from './fabric-icons-5';
+import { initializeIcons as i6 } from './fabric-icons-6';
+import { initializeIcons as i7 } from './fabric-icons-7';
+import { initializeIcons as i8 } from './fabric-icons-8';
+import { initializeIcons as i9 } from './fabric-icons-9';
+import { initializeIcons as i10 } from './fabric-icons-10';
+import { initializeIcons as i11 } from './fabric-icons-11';
+import './icon-aliases';
+
+const DEFAULT_BASE_URL = 'https://static2.sharepointonline.com/files/fabric/assets/icons/';
+
+export function initializeIcons(baseUrl: string = DEFAULT_BASE_URL): void {
+  [i, i0, i1, i2, i3, i4, i5, i6, i7, i8, i9, i10, i11].forEach(
+    (initialize: (url: string) => void) => initialize(baseUrl)
+  );
+}
\ No newline at end of file
diff --git a/packages/icons/tsconfig.json b/packages/icons/tsconfig.json
new file mode 100644
index 0000000000000..bda277cc37803
--- /dev/null
+++ b/packages/icons/tsconfig.json
@@ -0,0 +1,22 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "module": "commonjs",
+    "lib": [
+      "es2017",
+      "dom"
+    ],
+    "jsx": "react",
+    "declaration": true,
+    "sourceMap": true,
+    "experimentalDecorators": true,
+    "importHelpers": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "moduleResolution": "node",
+    "types": []
+  },
+  "include": [
+    "src"
+  ]
+}
\ No newline at end of file
diff --git a/packages/icons/tslint.json b/packages/icons/tslint.json
new file mode 100644
index 0000000000000..621ee6ba04605
--- /dev/null
+++ b/packages/icons/tslint.json
@@ -0,0 +1,6 @@
+{
+  "extends": [
+    "office-ui-fabric-react-tslint"
+  ],
+  "rules": {}
+}
\ No newline at end of file

From d8da9056702419dd5fe8e679be3e7e2c7417b8dc Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 26 Sep 2017 11:31:15 -0700
Subject: [PATCH 0722/1641] tslint (#2955)

---
 packages/office-ui-fabric-react-tslint/tslint.json | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react-tslint/tslint.json b/packages/office-ui-fabric-react-tslint/tslint.json
index 38265b4842de9..4080beec334cb 100644
--- a/packages/office-ui-fabric-react-tslint/tslint.json
+++ b/packages/office-ui-fabric-react-tslint/tslint.json
@@ -17,7 +17,9 @@
       "when": "always"
     },
     "jsx-no-bind": true,
-    "jsx-boolean-value": "never",
+    "jsx-boolean-value": [
+      "never"
+    ],
     "jsx-equals-spacing": "never",
     "jsx-key": true,
     "jsx-no-lambda": true,

From 3ccc9b4c52dfc3bf1feb2505f93bfdde3e4afe4b Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Tue, 26 Sep 2017 11:34:09 -0700
Subject: [PATCH 0723/1641] Second pass removing lambdas from jsx in Fabric
 (#2819)

* Second pass removing lambdas from jsx

* Update Button.test.tsx

* Add noop comment to prevent no-empty error

* Fix merge issue

* Revert logging in ComboBox to lambdas

* Delete docs.json
---
 .../src/components/Button/Button.test.tsx     | 321 +++++++++---------
 .../examples/Button.Default.Example.tsx       |   6 +-
 .../Button/examples/Button.Split.Example.tsx  |  10 +-
 .../examples/Callout.Nested.Example.tsx       |   2 +-
 .../examples/Checkbox.Basic.Example.tsx       |  11 +-
 .../ChoiceGroup/ChoiceGroup.test.tsx          |  12 +-
 .../ColorPicker/ColorPicker.test.tsx          |   9 +-
 .../src/components/ComboBox/ComboBox.test.tsx |  19 +-
 .../examples/ComboBox.Basic.Example.tsx       |  16 +
 .../ContextualMenu/ContextualMenu.test.tsx    |  15 +-
 .../examples/DatePicker.Input.Example.tsx     |  15 +-
 11 files changed, 256 insertions(+), 180 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
index 5ecaf7eb1820d..66c5bd5c397bd 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
@@ -12,6 +12,8 @@ import { KeyCodes } from '../../Utilities';
 
 let { expect } = chai;
 
+const alertClicked = (): void => { /*noop*/ };
+
 describe('DefaultButton', () => {
   function renderIntoDocument(element: React.ReactElement<any>): HTMLElement {
     const component = ReactTestUtils.renderIntoDocument(element);
@@ -184,7 +186,7 @@ describe('DefaultButton', () => {
       <DefaultButton
         data-automation-id='test'
         text='Create account'
-        onClick={ () => alert('Clicked') }
+        onClick={ alertClicked }
         menuProps={ {
           items: [
             {
@@ -211,7 +213,7 @@ describe('DefaultButton', () => {
         data-automation-id='test'
         text='Create account'
         split={ true }
-        onClick={ () => alert('Clicked') }
+        onClick={ alertClicked }
         menuProps={ {
           items: [
             {
@@ -238,7 +240,7 @@ describe('DefaultButton', () => {
         data-automation-id='test'
         text='Create account'
         split={ true }
-        onClick={ () => alert('Clicked') }
+        onClick={ alertClicked }
         menuProps={ {
           items: [
             {
@@ -261,164 +263,169 @@ describe('DefaultButton', () => {
     expect(renderedDOM.getAttribute('aria-expanded')).to.equal('true');
   });
 
-  it('Clicking SplitButton button triggers action', () => {
+  describe('Response to click event', () => {
     let didClick = false;
-    const renderedDOM: HTMLElement = renderIntoDocument(
-      <DefaultButton
-        data-automation-id='test'
-        text='Create account'
-        split={ true }
-        onClick={ () => { didClick = true; } }
-        menuProps={ {
-          items: [
-            {
-              key: 'emailMessage',
-              name: 'Email message',
-              icon: 'Mail'
-            },
-            {
-              key: 'calendarEvent',
-              name: 'Calendar event',
-              icon: 'Calendar'
-            }
-          ]
-        } }
-      />
-    );
-    const menuButtonDOM: HTMLButtonElement = renderedDOM.getElementsByClassName('ms-Button--default')[0] as HTMLButtonElement;
-    ReactTestUtils.Simulate.click(menuButtonDOM);
-    expect(didClick).to.equal(true);
-  });
+    const setTrue = (): void => {
+      didClick = true;
+    };
 
-  it('Pressing Enter on SplitButton triggers action', () => {
-    let didClick = false;
-    const renderedDOM: HTMLElement = renderIntoDocument(
-      <DefaultButton
-        data-automation-id='test'
-        text='Create account'
-        split={ true }
-        onClick={ () => { didClick = true; } }
-        menuProps={ {
-          items: [
-            {
-              key: 'emailMessage',
-              name: 'Email message',
-              icon: 'Mail'
-            },
-            {
-              key: 'calendarEvent',
-              name: 'Calendar event',
-              icon: 'Calendar'
-            }
-          ]
-        } }
-      />
-    );
-    const splitButtonDOM = ReactDOM.findDOMNode(renderedDOM as React.ReactInstance);
-    ReactTestUtils.Simulate.keyDown(splitButtonDOM,
-      {
-        which: KeyCodes.enter
-      });
-    expect(didClick).to.equal(true);
-  });
+    beforeEach(() => {
+      didClick = false;
+    });
 
-  it('Pressing Alt+Down on SplitButton triggers menu', () => {
-    let didClick = false;
-    const renderedDOM: HTMLElement = renderIntoDocument(
-      <DefaultButton
-        data-automation-id='test'
-        text='Create account'
-        split={ true }
-        onClick={ () => { didClick = true; } }
-        menuProps={ {
-          items: [
-            {
-              key: 'emailMessage',
-              name: 'Email message',
-              icon: 'Mail'
-            },
-            {
-              key: 'calendarEvent',
-              name: 'Calendar event',
-              icon: 'Calendar'
-            }
-          ]
-        } }
-      />
-    );
-    const splitButtonDOM = ReactDOM.findDOMNode(renderedDOM as React.ReactInstance);
-    ReactTestUtils.Simulate.focus(splitButtonDOM);
-    ReactTestUtils.Simulate.keyDown(splitButtonDOM,
-      {
-        altKey: true,
-        which: KeyCodes.down
-      });
-    expect(renderedDOM.getAttribute('aria-expanded')).to.equal('true');
-  });
+    it('Clicking SplitButton button triggers action', () => {
+      const renderedDOM: HTMLElement = renderIntoDocument(
+        <DefaultButton
+          data-automation-id='test'
+          text='Create account'
+          split={ true }
+          onClick={ setTrue }
+          menuProps={ {
+            items: [
+              {
+                key: 'emailMessage',
+                name: 'Email message',
+                icon: 'Mail'
+              },
+              {
+                key: 'calendarEvent',
+                name: 'Calendar event',
+                icon: 'Calendar'
+              }
+            ]
+          } }
+        />
+      );
+      const menuButtonDOM: HTMLButtonElement = renderedDOM.getElementsByClassName('ms-Button--default')[0] as HTMLButtonElement;
+      ReactTestUtils.Simulate.click(menuButtonDOM);
+      expect(didClick).to.equal(true);
+    });
 
-  it('A disabled SplitButton does not respond to key presses', () => {
-    let didClick = false;
-    const renderedDOM: HTMLElement = renderIntoDocument(
-      <DefaultButton
-        disabled={ true }
-        data-automation-id='test'
-        text='Create account'
-        split={ true }
-        onClick={ () => { didClick = true; } }
-        menuProps={ {
-          items: [
-            {
-              key: 'emailMessage',
-              name: 'Email message',
-              icon: 'Mail'
-            },
-            {
-              key: 'calendarEvent',
-              name: 'Calendar event',
-              icon: 'Calendar'
-            }
-          ]
-        } }
-      />
-    );
-    const splitButtonDOM = ReactDOM.findDOMNode(renderedDOM as React.ReactInstance);
-    ReactTestUtils.Simulate.focus(splitButtonDOM);
-    ReactTestUtils.Simulate.keyDown(splitButtonDOM,
-      {
-        altKey: true,
-        which: KeyCodes.down
-      });
-    expect(renderedDOM.getAttribute('aria-expanded')).to.equal('false');
-  });
+    it('Pressing Enter on SplitButton triggers action', () => {
+      const renderedDOM: HTMLElement = renderIntoDocument(
+        <DefaultButton
+          data-automation-id='test'
+          text='Create account'
+          split={ true }
+          onClick={ setTrue }
+          menuProps={ {
+            items: [
+              {
+                key: 'emailMessage',
+                name: 'Email message',
+                icon: 'Mail'
+              },
+              {
+                key: 'calendarEvent',
+                name: 'Calendar event',
+                icon: 'Calendar'
+              }
+            ]
+          } }
+        />
+      );
+      const splitButtonDOM = ReactDOM.findDOMNode(renderedDOM as React.ReactInstance);
+      ReactTestUtils.Simulate.keyDown(splitButtonDOM,
+        {
+          which: KeyCodes.enter
+        });
+      expect(didClick).to.equal(true);
+    });
 
-  it('A disabled SplitButton does not respond to clicks', () => {
-    let didClick = false;
-    const renderedDOM: HTMLElement = renderIntoDocument(
-      <DefaultButton
-        disabled={ true }
-        data-automation-id='test'
-        text='Create account'
-        split={ true }
-        onClick={ () => { didClick = true; } }
-        menuProps={ {
-          items: [
-            {
-              key: 'emailMessage',
-              name: 'Email message',
-              icon: 'Mail'
-            },
-            {
-              key: 'calendarEvent',
-              name: 'Calendar event',
-              icon: 'Calendar'
-            }
-          ]
-        } }
-      />
-    );
-    const menuButtonDOM: HTMLButtonElement = renderedDOM.getElementsByClassName('ms-Button--default')[0] as HTMLButtonElement;
-    ReactTestUtils.Simulate.click(menuButtonDOM);
-    expect(didClick).to.equal(false);
-  });
+    it('Pressing Alt+Down on SplitButton triggers menu', () => {
+      const renderedDOM: HTMLElement = renderIntoDocument(
+        <DefaultButton
+          data-automation-id='test'
+          text='Create account'
+          split={ true }
+          onClick={ setTrue }
+          menuProps={ {
+            items: [
+              {
+                key: 'emailMessage',
+                name: 'Email message',
+                icon: 'Mail'
+              },
+              {
+                key: 'calendarEvent',
+                name: 'Calendar event',
+                icon: 'Calendar'
+              }
+            ]
+          } }
+        />
+      );
+      const splitButtonDOM = ReactDOM.findDOMNode(renderedDOM as React.ReactInstance);
+      ReactTestUtils.Simulate.focus(splitButtonDOM);
+      ReactTestUtils.Simulate.keyDown(splitButtonDOM,
+        {
+          altKey: true,
+          which: KeyCodes.down
+        });
+      expect(renderedDOM.getAttribute('aria-expanded')).to.equal('true');
+    });
 
+    it('A disabled SplitButton does not respond to key presses', () => {
+      const renderedDOM: HTMLElement = renderIntoDocument(
+        <DefaultButton
+          disabled={ true }
+          data-automation-id='test'
+          text='Create account'
+          split={ true }
+          onClick={ setTrue }
+          menuProps={ {
+            items: [
+              {
+                key: 'emailMessage',
+                name: 'Email message',
+                icon: 'Mail'
+              },
+              {
+                key: 'calendarEvent',
+                name: 'Calendar event',
+                icon: 'Calendar'
+              }
+            ]
+          } }
+        />
+      );
+      const splitButtonDOM = ReactDOM.findDOMNode(renderedDOM as React.ReactInstance);
+      ReactTestUtils.Simulate.focus(splitButtonDOM);
+      ReactTestUtils.Simulate.keyDown(splitButtonDOM,
+        {
+          altKey: true,
+          which: KeyCodes.down
+        });
+      expect(renderedDOM.getAttribute('aria-expanded')).to.equal('false');
+    });
+
+    it('A disabled SplitButton does not respond to clicks', () => {
+      const renderedDOM: HTMLElement = renderIntoDocument(
+        <DefaultButton
+          disabled={ true }
+          data-automation-id='test'
+          text='Create account'
+          split={ true }
+          onClick={ setTrue }
+          menuProps={ {
+            items: [
+              {
+                key: 'emailMessage',
+                name: 'Email message',
+                icon: 'Mail'
+              },
+              {
+                key: 'calendarEvent',
+                name: 'Calendar event',
+                icon: 'Calendar'
+              }
+            ]
+          } }
+        />
+      );
+      const menuButtonDOM: HTMLButtonElement = renderedDOM.getElementsByClassName('ms-Button--default')[0] as HTMLButtonElement;
+      ReactTestUtils.Simulate.click(menuButtonDOM);
+      expect(didClick).to.equal(false);
+    });
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
index ddd8004c2f64f..6d2462494958b 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
@@ -25,10 +25,14 @@ export class ButtonDefaultExample extends React.Component<IButtonProps, {}> {
             disabled={ disabled }
             checked={ checked }
             text='Butjon'
-            onClick={ () => alert('Clicked') }
+            onClick={ this._alertClicked }
           />
         </div>
       </div>
     );
   }
+
+  private _alertClicked(): void {
+    alert('Clicked');
+  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
index 92e7820b61b5b..4b3afbfe7c54e 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
@@ -3,6 +3,10 @@ import { DefaultButton, IconButton, IButtonProps } from 'office-ui-fabric-react/
 import { Label } from 'office-ui-fabric-react/lib/Label';
 import { getCustomSplitButtonStyles } from './Button.Split.Example.styles';
 
+const alertClicked = (): void => {
+  alert('Clicked');
+};
+
 export class ButtonSplitExample extends React.Component<IButtonProps, {}> {
   public constructor() {
     super();
@@ -20,7 +24,7 @@ export class ButtonSplitExample extends React.Component<IButtonProps, {}> {
             disabled={ disabled }
             checked={ checked }
             text='Create account'
-            onClick={ () => alert('Clicked') }
+            onClick={ alertClicked }
             split={ true }
             style={ { height: '35px' } }
             menuProps={ {
@@ -47,7 +51,7 @@ export class ButtonSplitExample extends React.Component<IButtonProps, {}> {
             disabled={ disabled }
             checked={ checked }
             text='Create account'
-            onClick={ () => alert('Clicked') }
+            onClick={ alertClicked }
             split={ true }
             style={ { height: '35px' } }
             menuProps={ {
@@ -89,7 +93,7 @@ export class ButtonSplitCustomExample extends React.Component<IButtonProps, {}>
           checked={ checked }
           iconProps={ { iconName: 'Emoji2' } }
           text='Create account'
-          onClick={ () => alert('Clicked') }
+          onClick={ alertClicked }
           split={ true }
           styles={ customSplitButtonStyles }
           menuProps={ {
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx
index 83e574862b0e3..5014739846f14 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx
@@ -40,7 +40,7 @@ export class CalloutNestedExample extends React.Component<any, ICalloutBaiscExam
               className='ms-CalloutExample-callout'
               gapSpace={ 0 }
               targetElement={ this._menuButtonElement }
-              onDismiss={ (ev: any) => { this._onDismiss(ev); } }
+              onDismiss={ this._onDismiss }
               setInitialFocus={ true }
             >
               <div className='ms-CalloutExample-header'>
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
index 5e58d05eec946..e922c68d64644 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
@@ -8,6 +8,8 @@ import {
   Persona,
   PersonaSize
 } from 'office-ui-fabric-react/lib/Persona';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+
 export interface ICheckboxBasicExampleState {
   isChecked: boolean;
 }
@@ -70,9 +72,7 @@ export class CheckboxBasicExample extends React.Component<{}, ICheckboxBasicExam
         <Checkbox
           label='Controlled checkbox'
           checked={ isChecked }
-          onChange={ (ev, checked) => {
-            this.setState({ isChecked: checked! });
-          } }
+          onChange={ this._onControlledCheckboxChange }
           styles={ styles }
         />
 
@@ -95,6 +95,11 @@ export class CheckboxBasicExample extends React.Component<{}, ICheckboxBasicExam
     console.log(`The option has been changed to ${isChecked}.`);
   }
 
+  @autobind
+  private _onControlledCheckboxChange(ev: React.FormEvent<HTMLElement>, checked: boolean): void {
+    this.setState({ isChecked: checked! });
+  }
+
   private _renderPersonaLabel(props: ICheckboxProps) {
     const DEFAULT_IMAGE_URL = '/_layouts/15/userphoto.aspx?size=S&accountname=';
     return <Persona primaryText={ props.label } imageUrl={ DEFAULT_IMAGE_URL } size={ PersonaSize.extraSmall } />;
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
index 4cab4d5847e97..46a8d23948490 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
@@ -150,11 +150,15 @@ describe('ChoiceGroup', () => {
 
   it('can render as a controlled component', () => {
     let _selectedItem;
+    const onChange = (ev: React.FormEvent<HTMLElement | HTMLInputElement>, item: IChoiceGroupOption | undefined): void => {
+      _selectedItem = item;
+    };
+
     let choiceGroup = ReactTestUtils.renderIntoDocument<ChoiceGroup>(
       <ChoiceGroup
         selectedKey='1'
         options={ TEST_OPTIONS }
-        onChange={ (ev, item) => _selectedItem = item }
+        onChange={ onChange }
       />
     );
     let renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
@@ -172,10 +176,14 @@ describe('ChoiceGroup', () => {
 
   it('extra <input> attributes appear in dom if specified', () => {
     let _selectedItem;
+    const onChange = (ev: React.FormEvent<HTMLElement | HTMLInputElement>, item: IChoiceGroupOption | undefined): void => {
+      _selectedItem = item;
+    };
+
     const choiceGroup = ReactTestUtils.renderIntoDocument<ChoiceGroup>(
       <ChoiceGroup
         options={ TEST_OPTIONS }
-        onChange={ (ev, item) => _selectedItem = item }
+        onChange={ onChange }
       />
     );
     const renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.test.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.test.tsx
index 9f99d789cb957..ac3780b2d4426 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.test.tsx
@@ -27,8 +27,15 @@ describe('ColorPicker', () => {
 
   it('onColorChange is called', () => {
     let color = '#FFFFFF';
+    const onColorChanged = (str: string): void => {
+      color = str;
+    };
+
     let component = ReactTestUtils.renderIntoDocument(
-      <ColorPicker color={ color } onColorChanged={ str => color = str } />
+      <ColorPicker
+        color={ color }
+        onColorChanged={ onColorChanged }
+      />
     ) as ColorPicker;
 
     const newColor = '#AEAEAE';
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
index ecfb6127e7799..67c0d0afdf98a 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
@@ -8,7 +8,7 @@ import { KeyCodes } from '../../Utilities';
 let { expect } = chai;
 
 import { ComboBox } from './ComboBox';
-import { IComboBoxOption } from './ComboBox.Props';
+import { IComboBox, IComboBoxOption } from './ComboBox.Props';
 
 const DEFAULT_OPTIONS: IComboBoxOption[] = [
   { key: '1', text: '1' },
@@ -91,13 +91,20 @@ describe('ComboBox', () => {
     let comboBoxRoot;
     let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any>;
     let comboBoxComponent: any;
+    const returnUndefined = (): undefined => {
+      return;
+    };
+    const setRef = (ref: IComboBox): void => {
+      comboBoxComponent = ref;
+    };
+
     let wrapper = mount(
       <ComboBox
         label='testgroup'
         options={ DEFAULT_OPTIONS }
         allowFreeform={ true }
-        onChanged={ () => { return; } }
-        componentRef={ ref => comboBoxComponent = ref }
+        onChanged={ returnUndefined }
+        componentRef={ setRef }
       />);
     comboBoxRoot = wrapper.find('.ms-ComboBox');
     inputElement = comboBoxRoot.find('input');
@@ -110,12 +117,16 @@ describe('ComboBox', () => {
     let comboBoxRoot;
     let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any>;
     let comboBoxComponent: any;
+    const setRef = (ref: IComboBox): void => {
+      comboBoxComponent = ref;
+    };
+
     let wrapper = mount(
       <ComboBox
         label='testgroup'
         options={ DEFAULT_OPTIONS }
         allowFreeform={ true }
-        componentRef={ ref => comboBoxComponent = ref }
+        componentRef={ setRef }
       />);
     comboBoxRoot = wrapper.find('.ms-ComboBox');
     inputElement = comboBoxRoot.find('input');
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
index 43f603e40a473..14da24bea7cd5 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
@@ -58,8 +58,10 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
           autoComplete='on'
           options={ this._testOptions }
           onRenderOption={ this._onRenderFontOption }
+          // tslint:disable:jsx-no-lambda
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
+        // tslint:enable:jsx-no-lambda
         />
 
         <ComboBox
@@ -71,8 +73,10 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
           autoComplete='off'
           options={ this._testOptions }
           onRenderOption={ this._onRenderFontOption }
+          // tslint:disable:jsx-no-lambda
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
+        // tslint:enable:jsx-no-lambda
         />
 
         <ComboBox
@@ -84,8 +88,10 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
           autoComplete='on'
           options={ this._testOptions }
           onRenderOption={ this._onRenderFontOption }
+          // tslint:disable:jsx-no-lambda
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
+        // tslint:enable:jsx-no-lambda
         />
 
         <ComboBox
@@ -97,8 +103,10 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
           autoComplete='off'
           options={ this._testOptions }
           onRenderOption={ this._onRenderFontOption }
+          // tslint:disable:jsx-no-lambda
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
+        // tslint:enable:jsx-no-lambda
         />
 
         <ComboBox
@@ -108,8 +116,10 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
           errorMessage='Error! Here is some text!'
           options={ this._testOptions }
           onRenderOption={ this._onRenderFontOption }
+          // tslint:disable:jsx-no-lambda
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
+        // tslint:enable:jsx-no-lambda
         />
 
         <ComboBox
@@ -127,8 +137,10 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
             ]
           }
           disabled={ true }
+          // tslint:disable:jsx-no-lambda
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
+        // tslint:enable:jsx-no-lambda
         />
 
         { value ?
@@ -143,8 +155,10 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
             onResolveOptions={ this._getOptions }
             value={ value && value }
             onRenderOption={ this._onRenderFontOption }
+            // tslint:disable:jsx-no-lambda
             onFocus={ () => console.log('onFocus called') }
             onBlur={ () => console.log('onBlur called') }
+          // tslint:enable:jsx-no-lambda
           />
           :
           <ComboBox
@@ -158,8 +172,10 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
             onChanged={ this._onChanged }
             onResolveOptions={ this._getOptions }
             onRenderOption={ this._onRenderFontOption }
+            // tslint:disable:jsx-no-lambda
             onFocus={ () => console.log('onFocus called') }
             onBlur={ () => console.log('onBlur called') }
+          // tslint:enable:jsx-no-lambda
           />
         }
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
index 083c66d9b159c..ca31fbac8277d 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
@@ -402,18 +402,21 @@ describe('ContextualMenu', () => {
         key: 'TestKey2'
       },
     ];
+
+    const onMenuOpened = (): void => {
+      if (layerMounted) {
+        layerMountedFirst = true;
+      }
+      menuMounted = true;
+    };
+
     ReactTestUtils.renderIntoDocument<HTMLDivElement>(
       <div>
         <button id='target' style={ { top: '10px', left: '10px', height: '0', width: '0px' } }> target </button>
         <ContextualMenu
           target='#target'
           items={ items }
-          onMenuOpened={ () => {
-            if (layerMounted) {
-              layerMountedFirst = true;
-            }
-            menuMounted = true;
-          } }
+          onMenuOpened={ onMenuOpened }
         />
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx
index 91e98d0924143..3e89cf82947ba 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { DatePicker, DayOfWeek, IDatePickerStrings } from 'office-ui-fabric-react/lib/DatePicker';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 
 const DayPickerStrings: IDatePickerStrings = {
   months: [
@@ -93,10 +94,20 @@ export class DatePickerInputExample extends React.Component<any, IDatePickerInpu
           firstDayOfWeek={ firstDayOfWeek }
           strings={ DayPickerStrings }
           value={ value! }
-          onSelectDate={ date => this.setState({ value: date }) }
+          onSelectDate={ this._onSelectDate }
         />
-        <DefaultButton onClick={ () => this.setState({ value: null }) } text='Clear' />
+        <DefaultButton onClick={ this._onClick } text='Clear' />
       </div>
     );
   }
+
+  @autobind
+  private _onSelectDate(date: Date | null | undefined): void {
+    this.setState({ value: date });
+  }
+
+  @autobind
+  private _onClick(): void {
+    this.setState({ value: null });
+  }
 }

From ea5937cc1e6528bbe82962b879654e131ff33c7a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=85smund=20Grammeltvedt?= <asmundg@big-oil.org>
Date: Tue, 26 Sep 2017 21:18:48 +0200
Subject: [PATCH 0724/1641] Slider: Read aria-label for slider, even when label
 is not set (#2866)

* Use aria-label for slider, even when label is not set

There appears to have been an implicit assumption about label being
present for screenreaders to work properly. We now always set
aria-label on the focused element, falling back to using the label
text.

* Add change
---
 .../aria-label-slider_2017-09-18-08-59.json           | 11 +++++++++++
 .../src/components/Slider/Slider.tsx                  |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/aria-label-slider_2017-09-18-08-59.json

diff --git a/common/changes/office-ui-fabric-react/aria-label-slider_2017-09-18-08-59.json b/common/changes/office-ui-fabric-react/aria-label-slider_2017-09-18-08-59.json
new file mode 100644
index 0000000000000..3f0047b0fc442
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/aria-label-slider_2017-09-18-08-59.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Use aria-label for slider, even when label is not set",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "asmundg@big-oil.org"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
index 3603355ab401a..4bb4a191da8f6 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
@@ -114,6 +114,7 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
             aria-valuenow={ value }
             aria-valuemin={ min }
             aria-valuemax={ max }
+            aria-label={ ariaLabel || label }
             { ...onMouseDownProp }
             { ...onTouchStartProp }
             { ...onKeyDownProp }
@@ -137,7 +138,6 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
               <span
                 ref='thumb'
                 className={ css('ms-Slider-thumb', styles.thumb) }
-                { ...ariaLabel ? { 'aria-label': ariaLabel } : {} }
                 style={ this._getThumbStyle(vertical, thumbOffsetPercent) }
               />
               <span

From c85736b0d854f1ecac15fee119106aeba61f1750 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 26 Sep 2017 13:20:39 -0700
Subject: [PATCH 0725/1641] Reverting customizer for 4.0, will reapply in 5.0
 (#2957)

* Reverting customizer changes because they're breaking. Will include in the 5.0 release.

* Adding change files.

* Update revert-customizer_2017-09-26-19-27.json

* Update revert-customizer_2017-09-26-19-27.json
---
 .../revert-customizer_2017-09-26-19-27.json   | 11 +++
 .../revert-customizer_2017-09-26-19-27.json   | 11 +++
 .../revert-customizer_2017-09-26-19-27.json   | 11 +++
 .../Button/ActionButton/ActionButton.tsx      |  2 +-
 .../CommandBarButton/CommandBarButton.tsx     |  3 +-
 .../Button/CompoundButton/CompoundButton.tsx  |  3 +-
 .../Button/DefaultButton/DefaultButton.tsx    |  3 +-
 .../Button/IconButton/IconButton.tsx          |  3 +-
 .../Button/PrimaryButton/PrimaryButton.tsx    |  3 +-
 .../src/components/Checkbox/Checkbox.tsx      |  2 +-
 .../src/components/ComboBox/ComboBox.tsx      |  2 +-
 .../ContextualMenu/ContextualMenu.tsx         |  3 +-
 .../src/components/Fabric/Fabric.tsx          |  2 +-
 .../components/HoverCard/ExpandingCard.tsx    |  2 +-
 .../src/components/SpinButton/SpinButton.tsx  |  3 +-
 .../src/components/Toggle/Toggle.tsx          |  2 +-
 packages/styling/src/styles/theme.ts          |  8 +-
 packages/utilities/src/Customizations.test.ts | 51 ----------
 packages/utilities/src/Customizations.ts      | 77 ---------------
 packages/utilities/src/Customizer.test.tsx    | 94 -------------------
 packages/utilities/src/Customizer.tsx         | 85 +++++++++--------
 packages/utilities/src/GlobalSettings.ts      |  4 +-
 packages/utilities/src/customizable.test.tsx  | 47 +++++-----
 packages/utilities/src/customizable.tsx       | 35 +++----
 packages/utilities/src/index.ts               |  1 -
 25 files changed, 146 insertions(+), 322 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/revert-customizer_2017-09-26-19-27.json
 create mode 100644 common/changes/@uifabric/utilities/revert-customizer_2017-09-26-19-27.json
 create mode 100644 common/changes/office-ui-fabric-react/revert-customizer_2017-09-26-19-27.json
 delete mode 100644 packages/utilities/src/Customizations.test.ts
 delete mode 100644 packages/utilities/src/Customizations.ts
 delete mode 100644 packages/utilities/src/Customizer.test.tsx

diff --git a/common/changes/@uifabric/styling/revert-customizer_2017-09-26-19-27.json b/common/changes/@uifabric/styling/revert-customizer_2017-09-26-19-27.json
new file mode 100644
index 0000000000000..2317b6587978d
--- /dev/null
+++ b/common/changes/@uifabric/styling/revert-customizer_2017-09-26-19-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Reverting Customizer changes, as they are breaking. Will include in 5.0.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
diff --git a/common/changes/@uifabric/utilities/revert-customizer_2017-09-26-19-27.json b/common/changes/@uifabric/utilities/revert-customizer_2017-09-26-19-27.json
new file mode 100644
index 0000000000000..684365464791b
--- /dev/null
+++ b/common/changes/@uifabric/utilities/revert-customizer_2017-09-26-19-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Reverting Customizer changes, as they are breaking. Will include in 5.0.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
diff --git a/common/changes/office-ui-fabric-react/revert-customizer_2017-09-26-19-27.json b/common/changes/office-ui-fabric-react/revert-customizer_2017-09-26-19-27.json
new file mode 100644
index 0000000000000..e3e5800d34532
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/revert-customizer_2017-09-26-19-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Reverting Customizer changes, as they are breaking. Will include in 5.0.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx b/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx
index 3d98793bd8bcf..65b85a0cf0188 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx
@@ -4,7 +4,7 @@ import { BaseComponent, customizable, nullRender } from '../../../Utilities';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './ActionButton.styles';
 
-@customizable('ActionButton', ['theme'])
+@customizable(['theme'])
 export class ActionButton extends BaseComponent<IButtonProps, {}> {
 
   /**
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx
index bf54a296e3a77..50f9be9d8e756 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx
@@ -1,10 +1,11 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
+import { ThemeSettingName } from '../../../Styling';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './CommandBarButton.styles';
 
-@customizable('CommandBarButton', ['theme'])
+@customizable([ThemeSettingName])
 export class CommandBarButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Tell BaseComponent to bypass resolution of componentRef.
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
index 92b4b2557846b..da106faaece2c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
@@ -1,10 +1,11 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
 import { BaseComponent, customizable } from '../../../Utilities';
+import { ThemeSettingName } from '../../../Styling';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './CompoundButton.styles';
 
-@customizable('CompoundButton', ['theme'])
+@customizable([ThemeSettingName])
 export class CompoundButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Tell BaseComponent to bypass resolution of componentRef.
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
index e58f8ae5d8b94..35fe96852dc47 100644
--- a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
@@ -1,10 +1,11 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
+import { ThemeSettingName } from '../../../Styling';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './DefaultButton.styles';
 
-@customizable('DefaultButton', ['theme'])
+@customizable([ThemeSettingName])
 export class DefaultButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Tell BaseComponent to bypass resolution of componentRef.
diff --git a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
index 01baa17402449..e705cbebf0d55 100644
--- a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
@@ -1,10 +1,11 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
+import { ThemeSettingName } from '../../../Styling';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './IconButton.styles';
 
-@customizable('IconButton', ['theme'])
+@customizable([ThemeSettingName])
 export class IconButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Tell BaseComponent to bypass resolution of componentRef.
diff --git a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
index 4afad010f9ff4..4a8c121008bd9 100644
--- a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
@@ -1,9 +1,10 @@
 import * as React from 'react';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
+import { ThemeSettingName } from '../../../Styling';
 import { DefaultButton } from '../DefaultButton/DefaultButton';
 import { IButtonProps } from '../Button.Props';
 
-@customizable('PrimaryButton', ['theme'])
+@customizable([ThemeSettingName])
 export class PrimaryButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Set this BaseComponent._resolveComponentRef to false, bypassing resolution of componentRef.
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
index f98a328c33fe9..933c0df675c1b 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
@@ -33,7 +33,7 @@ interface ICheckboxClassNames {
   text: string;
 }
 
-@customizable('Checkbox', ['theme'])
+@customizable(['theme'])
 export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> implements ICheckbox {
   public static defaultProps: ICheckboxProps = {
     boxSide: 'start'
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index c806e05cac624..a84a777920be3 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -64,7 +64,7 @@ enum SearchDirection {
   forward = 1
 }
 
-@customizable('ComboBox', ['theme'])
+@customizable(['theme'])
 export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
   public static defaultProps: IComboBoxProps = {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index ea17a18754ce0..3629752a02177 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -3,6 +3,7 @@ import { IContextualMenuProps, IContextualMenuItem, ContextualMenuItemType } fro
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { getClassNames } from './ContextualMenu.classNames';
+import { ThemeSettingName } from '../../Styling';
 import {
   BaseComponent,
   anchorProperties,
@@ -69,7 +70,7 @@ function getIsChecked(item: IContextualMenuItem): boolean | null | undefined {
   return null;
 }
 
-@customizable('ContextualMenu', ['theme'])
+@customizable([ThemeSettingName])
 @withResponsiveMode
 export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContextualMenuState> {
   // The default ContextualMenu properties have no items and beak, the default submenu direction is right and top.
diff --git a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
index bb38452acaa39..e1967ff5d78d7 100644
--- a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
+++ b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
@@ -41,7 +41,7 @@ if (typeof (document) === 'object' && document.documentElement && !document.docu
   document.documentElement.setAttribute('dir', 'ltr');
 }
 
-@customizable('Fabric', ['theme'])
+@customizable(['theme'])
 export class Fabric extends BaseComponent<IFabricProps, IFabricState> {
   // tslint:disable-next-line:no-unused-variable
   private _root: HTMLElement;
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
index e5117e9e54a3d..06c44827d193b 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
@@ -21,7 +21,7 @@ export interface IExpandingCardState {
   needsScroll: boolean;
 }
 
-@customizable('ExpandingCard', ['theme'])
+@customizable(['theme'])
 export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpandingCardState> {
   public static defaultProps = {
     compactCardHeight: 156,
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index 0278f8be8cc52..16af04c74da58 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -9,6 +9,7 @@ import {
   autobind,
   customizable
 } from '../../Utilities';
+import { ThemeSettingName } from '../../Styling';
 import {
   ISpinButton,
   ISpinButtonProps,
@@ -42,7 +43,7 @@ export interface ISpinButtonState {
   keyboardSpinDirection: KeyboardSpinDirection;
 }
 
-@customizable('SpinButton', ['theme'])
+@customizable([ThemeSettingName])
 export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState> implements ISpinButton {
 
   public static defaultProps: ISpinButtonProps = {
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
index dfcb2a78a2546..e23e17a449bed 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
@@ -20,7 +20,7 @@ export interface IToggleState {
   isChecked: boolean;
 }
 
-@customizable('Toggle', ['theme'])
+@customizable(['theme'])
 export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements IToggle {
 
   private _id: string;
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index 253d7600ea999..ce8a5f2c75262 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -1,4 +1,4 @@
-import { Customizations } from '@uifabric/utilities/lib/Customizations';
+import { GlobalSettings } from '@uifabric/utilities/lib/GlobalSettings';
 import {
   IPalette,
   ISemanticColors,
@@ -22,7 +22,7 @@ let _theme: ITheme = {
 
 export const ThemeSettingName = 'theme';
 
-if (!Customizations.getSettings([ThemeSettingName]).theme) {
+if (!GlobalSettings.getValue(ThemeSettingName)) {
   let win = typeof window !== 'undefined' ? window : undefined;
 
   // tslint:disable:no-string-literal no-any
@@ -32,7 +32,7 @@ if (!Customizations.getSettings([ThemeSettingName]).theme) {
   // tslint:enable:no-string-literal no-any
 
   // Set the default theme.
-  Customizations.applySettings({ [ThemeSettingName]: _theme });
+  GlobalSettings.setValue(ThemeSettingName, _theme);
 }
 
 /**
@@ -51,7 +51,7 @@ export function loadTheme(theme: IPartialTheme): ITheme {
   // Invoke the legacy method of theming the page as well.
   legacyLoadTheme({ ..._theme.palette, ..._theme.semanticColors });
 
-  Customizations.applySettings({ [ThemeSettingName]: _theme });
+  GlobalSettings.setValue(ThemeSettingName, _theme);
 
   return _theme;
 }
diff --git a/packages/utilities/src/Customizations.test.ts b/packages/utilities/src/Customizations.test.ts
deleted file mode 100644
index 10eec375319bd..0000000000000
--- a/packages/utilities/src/Customizations.test.ts
+++ /dev/null
@@ -1,51 +0,0 @@
-import {
-  Customizations
-} from './Customizations';
-
-describe('Customizations', () => {
-  beforeEach(() => {
-    Customizations.reset();
-  });
-
-  it('can set/get global settings', () => {
-    Customizations.applySettings({ a: 'a', b: 'b' });
-
-    expect(Customizations.getSettings(['a', 'b'])).toEqual({
-      a: 'a',
-      b: 'b'
-    });
-
-    expect(Customizations.getSettings(['a'])).toEqual({
-      a: 'a'
-    });
-
-    expect(Customizations.getSettings(['z'])).toEqual({});
-  });
-
-  it('can set/get scoped settings', () => {
-    Customizations.applyScopedSettings('Foo', { a: 'a', b: 'b' });
-
-    expect(Customizations.getSettings(['a', 'b'], 'Foo')).toEqual({
-      a: 'a',
-      b: 'b'
-    });
-
-    expect(Customizations.getSettings(['a'], 'Bar')).toEqual({});
-  });
-
-  it('can fire changes', () => {
-    let counter = 0;
-    let incCounter = () => counter++;
-
-    Customizations.observe(incCounter);
-
-    Customizations.applyScopedSettings('Foo', { a: 'a', b: 'b' });
-    Customizations.applySettings({ a: 'a', b: 'b' });
-
-    expect(counter).toEqual(2);
-    Customizations.unobserve(incCounter);
-
-    Customizations.applySettings({ a: 'a', b: 'b' });
-    expect(counter).toEqual(2);
-  });
-});
\ No newline at end of file
diff --git a/packages/utilities/src/Customizations.ts b/packages/utilities/src/Customizations.ts
deleted file mode 100644
index ecf0cae86a9ff..0000000000000
--- a/packages/utilities/src/Customizations.ts
+++ /dev/null
@@ -1,77 +0,0 @@
-import {
-  GlobalSettings
-} from './GlobalSettings';
-import {
-  EventGroup
-} from './EventGroup';
-
-export interface ICustomizations {
-  // tslint:disable-next-line:no-any
-  settings: { [key: string]: any };
-  // tslint:disable-next-line:no-any
-  scopedSettings: { [key: string]: { [key: string]: any } };
-}
-
-const CustomizationsGlobalKey = 'customizations';
-const NO_CUSTOMIZATIONS = { settings: {}, scopedSettings: {} };
-
-let _allSettings = GlobalSettings.getValue<ICustomizations>(CustomizationsGlobalKey, {
-  settings: {},
-  scopedSettings: {}
-});
-
-const _events = new EventGroup(_allSettings);
-
-export class Customizations {
-  public static reset(): void {
-    _allSettings.settings = {};
-    _allSettings.scopedSettings = {};
-  }
-
-  // tslint:disable-next-line:no-any
-  public static applySettings(settings: { [key: string]: any }): void {
-    _allSettings.settings = { ..._allSettings.settings, ...settings };
-    Customizations._raiseChange();
-  }
-
-  // tslint:disable-next-line:no-any
-  public static applyScopedSettings(scopeName: string, settings: { [key: string]: any }): void {
-    _allSettings.scopedSettings[scopeName] = { ..._allSettings.scopedSettings[scopeName], ...settings };
-    Customizations._raiseChange();
-  }
-
-  public static getSettings(
-    properties: string[],
-    scopeName?: string,
-    localSettings: ICustomizations = NO_CUSTOMIZATIONS
-    // tslint:disable-next-line:no-any
-  ): any {
-    // tslint:disable-next-line:no-any
-    const settings: { [key: string]: any } = {};
-    const localScopedSettings = (scopeName && localSettings.scopedSettings[scopeName]) || {};
-    const globalScopedSettings = (scopeName && _allSettings.scopedSettings[scopeName]) || {};
-
-    for (let property of properties) {
-      settings[property] = (
-        localScopedSettings[property] ||
-        localSettings.settings[property] ||
-        globalScopedSettings[property] ||
-        _allSettings.settings[property]
-      );
-    }
-
-    return settings;
-  }
-
-  public static observe(onChange: () => void): void {
-    _events.on(_allSettings, 'change', onChange);
-  }
-
-  public static unobserve(onChange: () => void): void {
-    _events.off(_allSettings, 'change', onChange);
-  }
-
-  private static _raiseChange(): void {
-    _events.raise('change');
-  }
-}
diff --git a/packages/utilities/src/Customizer.test.tsx b/packages/utilities/src/Customizer.test.tsx
deleted file mode 100644
index cfb3004ce966c..0000000000000
--- a/packages/utilities/src/Customizer.test.tsx
+++ /dev/null
@@ -1,94 +0,0 @@
-import * as React from 'react';
-import * as ReactDOM from 'react-dom/server';
-import { customizable } from './customizable';
-import { Customizer } from './Customizer';
-import { Customizations } from './Customizations';
-
-@customizable('Foo', ['field'])
-class Foo extends React.Component<{ field?: string; }, {}> {
-  public render(): JSX.Element {
-    return (
-      <div>{ this.props.field }</div>
-    );
-  }
-}
-
-@customizable('Bar', ['field', 'field2', 'field3'])
-class Bar extends React.Component<{ field?: string; field2?: string, field3?: string }, {}> {
-  public render(): JSX.Element {
-    return (
-      <div>{ this.props.field }{ this.props.field2 }{ this.props.field3 }</div>
-    );
-  }
-}
-
-describe('Customizer', () => {
-  beforeEach(() => {
-    Customizations.reset();
-  });
-
-  it('can provide new defaults', () => {
-    expect(ReactDOM.renderToStaticMarkup(
-      <Customizer settings={ { field: 'customName' } }>
-        <Foo />
-      </Customizer>
-    )).toEqual('<div>customName</div>');
-  });
-
-  it('can pass through global settings', () => {
-    Customizations.applySettings({ 'field': 'globalName' });
-    expect(ReactDOM.renderToStaticMarkup(
-      <Customizer settings={ { nonMatch: 'customName' } }>
-        <Foo />
-      </Customizer>
-    )).toEqual('<div>globalName</div>');
-  });
-
-  it('can override global settings', () => {
-    Customizations.applySettings({ 'field': 'globalName' });
-    expect(ReactDOM.renderToStaticMarkup(
-      <Customizer settings={ { field: 'customName' } }>
-        <Foo />
-      </Customizer>
-    )).toEqual('<div>customName</div>');
-  });
-
-  it('can scope settings to specific components', () => {
-    let scopedSettings = {
-      Foo: { field: 'scopedToFoo' },
-      Bar: { field: 'scopedToBar' }
-    };
-
-    expect(ReactDOM.renderToStaticMarkup(
-      <Customizer scopedSettings={ scopedSettings }>
-        <div>
-          <Foo />
-          <Bar />
-        </div>
-      </Customizer>
-    )).toEqual('<div><div>scopedToFoo</div><div>scopedToBar</div></div>');
-  });
-
-  it('can layer global settings', () => {
-    expect(ReactDOM.renderToStaticMarkup(
-      <Customizer settings={ { field: 'field' } }>
-        <Customizer settings={ { field2: 'field2' } }>
-          <Bar />
-        </Customizer >
-      </Customizer >
-    )).toEqual('<div>fieldfield2</div>');
-  });
-
-  it('can layer scoped settings', () => {
-    Customizations.applySettings({ 'field3': 'field3' });
-
-    expect(ReactDOM.renderToStaticMarkup(
-      <Customizer scopedSettings={ { Bar: { field: 'field' } } }>
-        <Customizer scopedSettings={ { Bar: { field2: 'field2' } } }>
-          <Bar />
-        </Customizer >
-      </Customizer >
-    )).toEqual('<div>fieldfield2field3</div>');
-  });
-
-});
diff --git a/packages/utilities/src/Customizer.tsx b/packages/utilities/src/Customizer.tsx
index 302818a1fbee8..79310d828405c 100644
--- a/packages/utilities/src/Customizer.tsx
+++ b/packages/utilities/src/Customizer.tsx
@@ -1,13 +1,36 @@
 import * as React from 'react';
 import * as PropTypes from 'prop-types';
-import { BaseComponent, IBaseProps } from './BaseComponent';
-import { ICustomizations } from './Customizations';
+import { BaseComponent } from './BaseComponent';
 
-export interface ICustomizerContext {
-  customizations: ICustomizations;
+/**
+ * Settings interface.
+ *
+ * @internal
+ */
+export interface ISettings {
+  // tslint:disable-next-line:no-any
+  [key: string]: any;
 }
 
-export type ICustomizerProps = Partial<ICustomizations> & IBaseProps;
+/**
+ * Customizer component props.
+ *
+ * @public
+ */
+export interface ICustomizerProps {
+  componentRef?: () => void;
+
+  settings: ISettings;
+}
+
+/**
+ * Customizer component state.
+ *
+ * @internal
+ */
+export interface ICustomizerState {
+  injectedProps?: ISettings;
+}
 
 /**
  * The Customizer component allows for default props to be mixed into components which
@@ -21,64 +44,50 @@ export type ICustomizerProps = Partial<ICustomizations> & IBaseProps;
  *
  * @public
  */
-export class Customizer extends BaseComponent<ICustomizerProps, ICustomizerContext> {
+export class Customizer extends BaseComponent<ICustomizerProps, ICustomizerState> {
   public static contextTypes: {
-    customizations: PropTypes.Requireable<{}>;
+    injectedProps: PropTypes.Requireable<{}>;
   } = {
-    customizations: PropTypes.object
+    injectedProps: PropTypes.object
   };
 
   public static childContextTypes: {
-    customizations: PropTypes.Requireable<{}>;
+    injectedProps: PropTypes.Requireable<{}>;
   } = Customizer.contextTypes;
 
   // tslint:disable-next-line:no-any
   constructor(props: ICustomizerProps, context: any) {
     super(props);
 
-    this.state = this._getCustomizations(props, context);
+    this.state = this._getInjectedProps(props, context);
   }
 
-  public getChildContext(): ICustomizerContext {
+  public getChildContext(): ICustomizerState {
     return this.state;
   }
 
   // tslint:disable-next-line:no-any
-  public componentWillReceiveProps(newProps: any, newContext: any): void {
-    this.setState(this._getCustomizations(newProps, newContext));
+  public componentWillReceiveProps(newProps: ICustomizerProps, newContext: any): void {
+    this.setState(this._getInjectedProps(newProps, newContext));
   }
 
   public render(): React.ReactElement<{}> {
     return React.Children.only(this.props.children);
   }
 
-  private _getCustomizations(
-    props: ICustomizerProps,
-    context: ICustomizerContext
-  ): ICustomizerContext {
-    let {
-      settings = {},
-      scopedSettings = {}
-    } = props;
-    let {
-      customizations = { settings: {}, scopedSettings: {} }
-    } = context;
-
-    let newScopedSettings = { ...scopedSettings };
-
-    for (let name in customizations.scopedSettings) {
-      if (customizations.scopedSettings.hasOwnProperty(name)) {
-        newScopedSettings[name] = { ...scopedSettings[name], ...customizations.scopedSettings[name] };
-      }
-    }
+  private _getInjectedProps(props: ICustomizerProps, context: ICustomizerState): {
+    injectedProps: {
+      // tslint:disable-next-line:no-any
+      [x: string]: any;
+    };
+  } {
+    let { settings: injectedPropsFromSettings = {} as ISettings } = props;
+    let { injectedProps: injectedPropsFromContext = {} as ISettings } = context;
 
     return {
-      customizations: {
-        settings: {
-          ...settings,
-          ...customizations.settings
-        },
-        scopedSettings: newScopedSettings
+      injectedProps: {
+        ...injectedPropsFromContext,
+        ...injectedPropsFromSettings
       }
     };
   }
diff --git a/packages/utilities/src/GlobalSettings.ts b/packages/utilities/src/GlobalSettings.ts
index 21ac41e08ca25..c075f3a78c5e7 100644
--- a/packages/utilities/src/GlobalSettings.ts
+++ b/packages/utilities/src/GlobalSettings.ts
@@ -64,7 +64,7 @@ export class GlobalSettings {
     return _globalSettings[key];
   }
 
-  public static setValue<T>(key: string, value: T): T {
+  public static setValue<T>(key: string, value: T): void {
     let oldValue = _globalSettings[key];
 
     if (value !== oldValue) {
@@ -82,8 +82,6 @@ export class GlobalSettings {
         }
       }
     }
-
-    return value;
   }
 
   public static addChangeListener(cb: IChangeEventCallback): void {
diff --git a/packages/utilities/src/customizable.test.tsx b/packages/utilities/src/customizable.test.tsx
index 66e78fa160870..5ac49ef884310 100644
--- a/packages/utilities/src/customizable.test.tsx
+++ b/packages/utilities/src/customizable.test.tsx
@@ -1,41 +1,38 @@
 import * as React from 'react';
 import * as ReactDOM from 'react-dom/server';
 import { customizable } from './customizable';
-import { Customizations } from './Customizations';
+import { Customizer } from './Customizer';
+import { GlobalSettings } from './GlobalSettings';
+
+@customizable(['name', 'name2'])
+class Foo extends React.Component<{ field: string; }, {}> {
+  public name: string;
 
-@customizable('Foo', ['field'])
-class Foo extends React.Component<{ field?: string; }, {}> {
   public render(): JSX.Element {
-    return <div>{ this.props.field }</div>;
+    // tslint:disable-next-line:no-any
+    return <div>{ (this.props as any)[this.props.field] }</div>;
   }
 }
 
 describe('customizable', () => {
-  beforeEach(() => {
-    Customizations.reset();
-  });
 
-  it('can receive global customizations', () => {
-    Customizations.applySettings({ field: 'globalName' });
-    expect(ReactDOM.renderToStaticMarkup(<Foo />)).toEqual('<div>globalName</div>');
-  });
+  it('can inject customizations', () => {
+    GlobalSettings.setValue('name', 'defaultName');
 
-  it('can receive scoped customizations', () => {
-    Customizations.applySettings({ field: 'globalName' });
-    Customizations.applyScopedSettings('Foo', { field: 'scopedName' });
-    expect(ReactDOM.renderToStaticMarkup(<Foo />)).toEqual('<div>scopedName</div>');
-  });
+    expect(ReactDOM.renderToStaticMarkup(<Foo field='name' />)).toEqual('<div>defaultName</div>');
+    expect(ReactDOM.renderToStaticMarkup(<Foo field='name2' />)).toEqual('<div></div>');
 
-  it('can ignore scoped customizations that do not apply', () => {
-    Customizations.applySettings({ field: 'globalName' });
-    Customizations.applyScopedSettings('Bar', { field: 'scopedName' });
-    expect(ReactDOM.renderToStaticMarkup(<Foo />)).toEqual('<div>globalName</div>');
-  });
+    expect(ReactDOM.renderToStaticMarkup(
+      <Customizer settings={ { name: 'customName' } }>
+        <Foo field='name' />
+      </Customizer>
+    )).toEqual('<div>customName</div>');
 
-  it('can accept props over global/scoped values', () => {
-    Customizations.applySettings({ field: 'globalName' });
-    Customizations.applyScopedSettings('Foo', { field: 'scopedName' });
-    expect(ReactDOM.renderToStaticMarkup(<Foo field='name' />)).toEqual('<div>name</div>');
+    expect(ReactDOM.renderToStaticMarkup(
+      <Customizer settings={ { name2: 'customName' } }>
+        <Foo field='name2' />
+      </Customizer>
+    )).toEqual('<div>customName</div>');
   });
 
 });
diff --git a/packages/utilities/src/customizable.tsx b/packages/utilities/src/customizable.tsx
index 962bde6e14252..6ec6dc9d70ebf 100644
--- a/packages/utilities/src/customizable.tsx
+++ b/packages/utilities/src/customizable.tsx
@@ -1,13 +1,9 @@
 import * as React from 'react';
 import * as PropTypes from 'prop-types';
-import { Customizations } from './Customizations';
-
-export function customizable(
-  scope: string,
-  fields: string[]
-  // tslint:disable-next-line:no-any
-): <P, S>(ComposedComponent: new (props: P, ...args: any[]) => React.Component<P, S>) => any {
+import { GlobalSettings, IChangeDescription } from './GlobalSettings';
 
+// tslint:disable-next-line:no-any
+export function customizable(fields: string[]): <P, S>(ComposedComponent: new (props: P, ...args: any[]) => React.Component<P, S>) => any {
   // tslint:disable-next-line:no-shadowed-variable
   return function customizableFactory<P, S>(
     // tslint:disable-next-line:no-any
@@ -15,12 +11,10 @@ export function customizable(
     // tslint:disable-next-line:no-any
   ): any {
     return class ComponentWithInjectedProps extends React.Component<P, {}> {
-      public static displayName: string = 'Customized' + scope;
-
       public static contextTypes: {
-        customizations: PropTypes.Requireable<{}>;
+        injectedProps: PropTypes.Requireable<{}>;
       } = {
-        customizations: PropTypes.object
+        injectedProps: PropTypes.object
       };
 
       // tslint:disable-next-line:no-any
@@ -31,15 +25,22 @@ export function customizable(
       }
 
       public componentDidMount(): void {
-        Customizations.observe(this._onSettingChanged);
+        GlobalSettings.addChangeListener(this._onSettingChanged);
       }
 
       public componentWillUnmount(): void {
-        Customizations.unobserve(this._onSettingChanged);
+        GlobalSettings.removeChangeListener(this._onSettingChanged);
       }
 
       public render(): JSX.Element {
-        const defaultProps = Customizations.getSettings(fields, scope, this.context.customizations);
+        let defaultProps = {};
+
+        for (let propName of fields) {
+          // tslint:disable-next-line:no-any
+          (defaultProps as any)[propName] = (this.context.injectedProps) ?
+            this.context.injectedProps[propName] :
+            GlobalSettings.getValue(propName);
+        }
 
         return (
           // tslint:disable-next-line:no-any
@@ -47,8 +48,10 @@ export function customizable(
         );
       }
 
-      private _onSettingChanged(): void {
-        this.forceUpdate();
+      private _onSettingChanged(change: IChangeDescription): void {
+        if (fields.indexOf(change.key) >= 0) {
+          this.forceUpdate();
+        }
       }
 
     };
diff --git a/packages/utilities/src/index.ts b/packages/utilities/src/index.ts
index 08af844e16553..852e621c83ad0 100644
--- a/packages/utilities/src/index.ts
+++ b/packages/utilities/src/index.ts
@@ -2,7 +2,6 @@ export * from './Async';
 export * from './AutoScroll';
 export * from './BaseComponent';
 export * from './Customizer';
-export * from './Customizations';
 export * from './DelayedRender';
 export * from './EventGroup';
 export * from './FabricPerformance';

From 446359f9402335458c80521d93fb6f5506cdb199 Mon Sep 17 00:00:00 2001
From: petdun2519 <peterdunlop2519@gmail.com>
Date: Tue, 26 Sep 2017 13:24:30 -0700
Subject: [PATCH 0726/1641] Users/petdun/fix text field error announcement
 (#2958)

* moved the aria-live attribute onto the actual text of an error message so that it is read aloud by narrator

* change file

* Update TextField.tsx

* Update users-petdun-fixTextFieldErrorAnnouncement_2017-09-26-19-57.json
---
 ...ixTextFieldErrorAnnouncement_2017-09-26-19-57.json | 11 +++++++++++
 .../src/components/TextField/TextField.tsx            |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-petdun-fixTextFieldErrorAnnouncement_2017-09-26-19-57.json

diff --git a/common/changes/office-ui-fabric-react/users-petdun-fixTextFieldErrorAnnouncement_2017-09-26-19-57.json b/common/changes/office-ui-fabric-react/users-petdun-fixTextFieldErrorAnnouncement_2017-09-26-19-57.json
new file mode 100644
index 0000000000000..871762cdb9266
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-petdun-fixTextFieldErrorAnnouncement_2017-09-26-19-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "TextField: Moved aria live attribute onto the actual text of an error message for text field component so that it is read aloud by narrator.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "peterdunlop2519@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index 816fc480efdd0..4700178607bbc 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -170,13 +170,13 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
           <span id={ this._descriptionId }>
             { description && <span className={ css('ms-TextField-description', styles.description) }>{ description }</span> }
             { errorMessage &&
-              <div aria-live='assertive'>
+              <div>
                 <DelayedRender>
                   <p
                     className={ css('ms-TextField-errorMessage', AnimationClassNames.slideDownIn20, styles.errorMessage) }
                   >
                     { Icon({ iconName: 'Error', className: styles.errorIcon }) }
-                    <span className={ styles.errorText } data-automation-id='error-message'>{ errorMessage }</span>
+                    <span aria-live='assertive' className={ styles.errorText } data-automation-id='error-message'>{ errorMessage }</span>
                   </p>
                 </DelayedRender>
               </div>

From a60ded3aa9ce4d5431e72206aa6decbda3e53b4e Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 26 Sep 2017 20:42:17 +0000
Subject: [PATCH 0727/1641] Applying package updates.

---
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../revert-customizer_2017-09-26-19-27.json   | 11 -----
 .../revert-customizer_2017-09-26-19-27.json   | 11 -----
 .../aria-label-slider_2017-09-18-08-59.json   | 11 -----
 ...m-suggestion-reading_2017-09-26-17-17.json | 11 -----
 .../revert-customizer_2017-09-26-19-27.json   | 11 -----
 ...eldErrorAnnouncement_2017-09-26-19-57.json | 11 -----
 .../visual-test-cleanup_2017-09-26-16-46.json | 11 -----
 packages/experiments/package.json             |  6 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 44 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 16 ++++++-
 packages/office-ui-fabric-react/package.json  |  6 +--
 packages/styling/CHANGELOG.json               | 19 ++++++++
 packages/styling/CHANGELOG.md                 |  9 +++-
 packages/styling/package.json                 |  4 +-
 packages/utilities/CHANGELOG.json             | 14 ++++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  2 +-
 21 files changed, 121 insertions(+), 93 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/revert-customizer_2017-09-26-19-27.json
 delete mode 100644 common/changes/@uifabric/utilities/revert-customizer_2017-09-26-19-27.json
 delete mode 100644 common/changes/office-ui-fabric-react/aria-label-slider_2017-09-18-08-59.json
 delete mode 100644 common/changes/office-ui-fabric-react/joem-suggestion-reading_2017-09-26-17-17.json
 delete mode 100644 common/changes/office-ui-fabric-react/revert-customizer_2017-09-26-19-27.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-petdun-fixTextFieldErrorAnnouncement_2017-09-26-19-57.json
 delete mode 100644 common/changes/office-ui-fabric-react/visual-test-cleanup_2017-09-26-16-46.json

diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 2cbe500332a89..0e34193ae4777 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -23,7 +23,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.50.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.51.0 <5.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.4.2",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index f24f86c3e116e..988faf294928a 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -26,7 +26,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.50.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.51.0 <5.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index fc008a8444f0b..5884aea0b6457 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -24,7 +24,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=4.50.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.51.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index d5eff74129034..a231005dd4d1c 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.50.1 <5.0.0",
+    "office-ui-fabric-react": ">=4.51.0 <5.0.0",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/styling/revert-customizer_2017-09-26-19-27.json b/common/changes/@uifabric/styling/revert-customizer_2017-09-26-19-27.json
deleted file mode 100644
index 2317b6587978d..0000000000000
--- a/common/changes/@uifabric/styling/revert-customizer_2017-09-26-19-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Reverting Customizer changes, as they are breaking. Will include in 5.0.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
diff --git a/common/changes/@uifabric/utilities/revert-customizer_2017-09-26-19-27.json b/common/changes/@uifabric/utilities/revert-customizer_2017-09-26-19-27.json
deleted file mode 100644
index 684365464791b..0000000000000
--- a/common/changes/@uifabric/utilities/revert-customizer_2017-09-26-19-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Reverting Customizer changes, as they are breaking. Will include in 5.0.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/aria-label-slider_2017-09-18-08-59.json b/common/changes/office-ui-fabric-react/aria-label-slider_2017-09-18-08-59.json
deleted file mode 100644
index 3f0047b0fc442..0000000000000
--- a/common/changes/office-ui-fabric-react/aria-label-slider_2017-09-18-08-59.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Use aria-label for slider, even when label is not set",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "asmundg@big-oil.org"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/joem-suggestion-reading_2017-09-26-17-17.json b/common/changes/office-ui-fabric-react/joem-suggestion-reading_2017-09-26-17-17.json
deleted file mode 100644
index 4e1f2ad19cb00..0000000000000
--- a/common/changes/office-ui-fabric-react/joem-suggestion-reading_2017-09-26-17-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "PeoplePicker: adjusting aria/role attributes to improve the Narrator experience when reading out suggestions.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joem@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/revert-customizer_2017-09-26-19-27.json b/common/changes/office-ui-fabric-react/revert-customizer_2017-09-26-19-27.json
deleted file mode 100644
index e3e5800d34532..0000000000000
--- a/common/changes/office-ui-fabric-react/revert-customizer_2017-09-26-19-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Reverting Customizer changes, as they are breaking. Will include in 5.0.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-petdun-fixTextFieldErrorAnnouncement_2017-09-26-19-57.json b/common/changes/office-ui-fabric-react/users-petdun-fixTextFieldErrorAnnouncement_2017-09-26-19-57.json
deleted file mode 100644
index 871762cdb9266..0000000000000
--- a/common/changes/office-ui-fabric-react/users-petdun-fixTextFieldErrorAnnouncement_2017-09-26-19-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "TextField: Moved aria live attribute onto the actual text of an error message for text field component so that it is read aloud by narrator.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "peterdunlop2519@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/visual-test-cleanup_2017-09-26-16-46.json b/common/changes/office-ui-fabric-react/visual-test-cleanup_2017-09-26-16-46.json
deleted file mode 100644
index d05d9d605cb08..0000000000000
--- a/common/changes/office-ui-fabric-react/visual-test-cleanup_2017-09-26-16-46.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Removed old visual testing system to make way for new Screener based system",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 06a646dfe3ddd..72d2501e9b04a 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -41,9 +41,9 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/styling": ">=0.24.1 <1.0.0",
-    "@uifabric/utilities": ">=4.15.0 <5.0.0",
-    "office-ui-fabric-react": ">=4.50.2 <5.0.0",
+    "@uifabric/styling": ">=0.24.2 <1.0.0",
+    "@uifabric/utilities": ">=4.16.0 <5.0.0",
+    "office-ui-fabric-react": ">=4.51.0 <5.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index a5158ee4b1821..b0964d97d0782 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,50 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "4.51.0",
+      "tag": "office-ui-fabric-react_v4.51.0",
+      "date": "Tue, 26 Sep 2017 20:42:17 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Åsmund Grammeltvedt <asmundg@big-oil.org>",
+            "commit": "ea5937cc1e6528bbe82962b879654e131ff33c7a",
+            "comment": "Use aria-label for slider, even when label is not set"
+          },
+          {
+            "author": "Joe Martella <martellaj@live.com>",
+            "commit": "13c14c4be9191e29a5cb9e3aafa3aa101442abbd",
+            "comment": "PeoplePicker: adjusting aria/role attributes to improve the Narrator experience when reading out suggestions."
+          },
+          {
+            "author": "petdun2519 <peterdunlop2519@gmail.com>",
+            "commit": "446359f9402335458c80521d93fb6f5506cdb199",
+            "comment": "TextField: Moved aria live attribute onto the actual text of an error message for text field component so that it is read aloud by narrator."
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "6ee1b94057544f44118d1a2e1846cfdf6df2e014",
+            "comment": "Removed old visual testing system to make way for new Screener based system"
+          }
+        ],
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "c85736b0d854f1ecac15fee119106aeba61f1750",
+            "comment": "Reverting Customizer changes, as they are breaking. Will include in 5.0."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.15.0 <5.0.0` to `>=4.16.0 <5.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=0.24.1 <1.0.0` to `>=0.24.2 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.50.2",
       "tag": "office-ui-fabric-react_v4.50.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index ffefa847f9891..ad7f815bfbeff 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,20 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 26 Sep 2017 10:09:04 GMT and should not be manually modified.
+This log was last generated on Tue, 26 Sep 2017 20:42:17 GMT and should not be manually modified.
+
+## 4.51.0
+Tue, 26 Sep 2017 20:42:17 GMT
+
+### Minor changes
+
+- Reverting Customizer changes, as they are breaking. Will include in 5.0.
+
+### Patches
+
+- Use aria-label for slider, even when label is not set
+- PeoplePicker: adjusting aria/role attributes to improve the Narrator experience when reading out suggestions.
+- TextField: Moved aria live attribute onto the actual text of an error message for text field component so that it is read aloud by narrator.
+- Removed old visual testing system to make way for new Screener based system
 
 ## 4.50.2
 Tue, 26 Sep 2017 10:09:04 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index bc923190890b2..8860a5468b9b2 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.50.2",
+  "version": "4.51.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,8 +43,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=4.15.0 <5.0.0",
-    "@uifabric/styling": ">=0.24.1 <1.0.0",
+    "@uifabric/utilities": ">=4.16.0 <5.0.0",
+    "@uifabric/styling": ">=0.24.2 <1.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 7e78efcfb168c..7b04ae470e6e1 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "0.24.2",
+      "tag": "@uifabric/styling_v0.24.2",
+      "date": "Tue, 26 Sep 2017 20:42:17 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "c85736b0d854f1ecac15fee119106aeba61f1750",
+            "comment": "Reverting Customizer changes, as they are breaking. Will include in 5.0."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=4.15.0 <5.0.0` to `>=4.16.0 <5.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.24.1",
       "tag": "@uifabric/styling_v0.24.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 005e4c500ebe3..85aabbd68370e 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Tue, 26 Sep 2017 10:09:04 GMT and should not be manually modified.
+This log was last generated on Tue, 26 Sep 2017 20:42:17 GMT and should not be manually modified.
+
+## 0.24.2
+Tue, 26 Sep 2017 20:42:17 GMT
+
+### Patches
+
+- Reverting Customizer changes, as they are breaking. Will include in 5.0.
 
 ## 0.24.1
 Tue, 26 Sep 2017 10:09:04 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 06e5a859063c5..74d99be77301c 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.24.1",
+  "version": "0.24.2",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -28,7 +28,7 @@
     "react-dom": "^15.4.2"
   },
   "dependencies": {
-    "@uifabric/utilities": ">=4.15.0 <5.0.0",
+    "@uifabric/utilities": ">=4.16.0 <5.0.0",
     "tslib": "^1.7.1",
     "rtl-css-js": "^1.1.3",
     "glamor": "^2.20.40"
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 845f9e14f60d3..25ced4d3aeda4 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "4.16.0",
+      "tag": "@uifabric/utilities_v4.16.0",
+      "date": "Tue, 26 Sep 2017 20:42:17 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "c85736b0d854f1ecac15fee119106aeba61f1750",
+            "comment": "Reverting Customizer changes, as they are breaking. Will include in 5.0."
+          }
+        ]
+      }
+    },
     {
       "version": "4.15.0",
       "tag": "@uifabric/utilities_v4.15.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index c8071a0f34e12..f32afa02eacd8 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Tue, 26 Sep 2017 10:09:04 GMT and should not be manually modified.
+This log was last generated on Tue, 26 Sep 2017 20:42:17 GMT and should not be manually modified.
+
+## 4.16.0
+Tue, 26 Sep 2017 20:42:17 GMT
+
+### Minor changes
+
+- Reverting Customizer changes, as they are breaking. Will include in 5.0.
 
 ## 4.15.0
 Tue, 26 Sep 2017 10:09:04 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 6e547aea817f4..ab3ae3e8924af 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.15.0",
+  "version": "4.16.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 8a8c240b39c3ba12effab2c6c8e7021c3bc9cea9 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 26 Sep 2017 17:01:14 -0700
Subject: [PATCH 0728/1641] Let there be 5.0! (#2943)

* Remove input bottom margin in 5.0 (#2135)

* Removed all input bottom margins

* adding change file

* remove ms- extension

* Commandbutton to actionbutton (#2126)

* Init action button commit

* Remove label from split button example

* Added changefile'

* Fixed missing menuIcon styles

* Updated styles, added support for more style control

* Removed unnecessary onMenuToggled

* Removed height from command button, updated example to show how container should specifiy height

* Moving icon definitions and registration from @uifabric/styling into the @uifabric/icons package (#2299)

* updates for icons.

* Update Icon.

* changes

* More changes.

* Adding all icons to main definition.

* Branch repairs.

* more updates.

* Updates.

* Updating dependencies.

* Updating rush.

* undoing npm 5.3.0

* pr review feedback updates.

* Fixing TSLint error.

* Integrate merge styles (#2556)

* Styling now builds.

* Fixed all build errors in office-ui-fabric-react. Still have lint to fix.

* Passing build for oufr

* fixing tslint issues and test issues.

* Updates to fix more things.

* removing fsevents.

* Updating webpack config to match master.

* Removing 140 line lint rule.

* Fixing merge issues.

* Update package.jsons to 5.0.

* Updating rtlify to use @noflip (#2643)

* Adding a beta publishing script.

* Updates to amd i
mports.

* Updating all of the icons! We should be updated, AND everything is split apart. We just need to figure out the cdn details.

* Undoing a change.

* Fixing build.

* missed an integrate change.

* The icons package went missing.

* Ugh. adding prop-types.

* lowercasing all font resources to avoid downstream issues with casing.

* Adding utility to get an icon class name.

* Renaming IExtendedRawStyle to just IRawStyle.

* Fixing shrinkwrap.

* Updating rtl documentation.

* merge (#2801)

* 5.0 Toggle fix (#2804)

* merge

* Fixing toggle

* Referencing a missing icon.

* Merge issues.

* Fixing icon warning to not warn on blank icon names.

* Adding migration docs. Adding webpack bundle for icons for codepen scenarios.

* Warn when reregistering icons (#2840)

* Updating the icons in 5.0 with the latest generated code, including hashed font files.

* Missed merge marker.

* Another merge issue.

* removing fsevents.

* Updates to icons.

* Fix the icon packages to resolve correctly.

* Removing need for es6-map in merge-styles.

* Updates to merge.

* Adding trash icon alias.

* Improvements to focus rectangles in 5.0 (#2936)

* Checkbox: better focus. Toggle: better focus. Primary buttons: focus contrast. focus mixin: contrast fixes. ActionButton: better alignment with focus. BaseButton: aria label no longer visible.

* Renaming UtilityStyles file, using utility style.

* Jest updates for experiments package, welcome snapshot testing (#2942)

* Checkbox: better focus. Toggle: better focus. Primary buttons: focus contrast. focus mixin: contrast fixes. ActionButton: better alignment with focus. BaseButton: aria label no longer visible.

* Migrate to jest.

* Removing unnecessary changes.

* Fixing conflict.

* Removing one change.

* oops. removing fsevents

* Fixing button styling while i'm here.

* Updating the icon base url and fixing an ActionButton style issue.

* Bump.

* bump.

* Removing icon css, scss, and ttf files, updating license and readme.

* Adding back customizer to 5.0. (#2962)

* Split button: 2 tab stops, better focus rectangles, easier to use (#2963)

* Split button fixes.

* Updates for buttons.

* Updating scroll util to not disable all text selection. Weird. Also fixing button test.

* Fixing the panel padding on the bottom.

* Fixing broken build.

* Removing change files.

* Adding change files.
---
 apps/fabric-website/package.json              |   14 +-
 apps/ssr-tests/package.json                   |   11 +-
 apps/ssr-tests/test/test.js                   |    4 +
 apps/test-bundle-button/package.json          |    6 +-
 apps/test-bundle-button/webpack.config.js     |    1 -
 apps/todo-app/package.json                    |   12 +-
 apps/vr-tests/package.json                    |   10 +-
 .../src/stories/Breadcrumb.stories.tsx        |   29 +-
 apps/vr-tests/src/stories/Button.stories.tsx  |  135 +-
 apps/vr-tests/src/stories/index.tsx           |    1 -
 .../5.0_2017-09-26-23-14.json                 |   11 +
 .../experiments/5.0_2017-09-26-23-14.json     |   11 +
 .../fabric-website/5.0_2017-09-26-23-14.json  |   11 +
 .../@uifabric/icons/5.0_2017-09-26-23-14.json |   11 +
 .../styling/5.0_2017-09-26-23-14.json         |   11 +
 .../utilities/5.0_2017-09-26-23-14.json       |   11 +
 .../5.0_2017-09-26-23-14.json                 |   11 +
 common/config/rush/npm-shrinkwrap.json        |   80 +-
 common/config/rush/pinned-versions.json       |    7 +-
 ghdocs/MIGRATION_TO_5.0.0.md                  |  112 +
 packages/example-app-base/package.json        |   16 +-
 .../src/components/Header/Header.tsx          |    1 -
 packages/experiments/config/pre-copy.json     |    7 +
 packages/experiments/jest.config.js           |    3 +
 packages/experiments/karma.config.js          |  116 -
 packages/experiments/package.json             |   31 +-
 packages/experiments/src/Styling.ts           |    1 +
 packages/experiments/src/Utilities.ts         |    1 +
 packages/experiments/src/common/tests.ts      |    5 +
 .../components/CommandBar/CommandBar.test.tsx |  317 +-
 .../components/CommandBar/CommandBarPage.tsx  |   24 +-
 .../__snapshots__/CommandBar.test.tsx.snap    |  237 ++
 .../examples/CommandBar.Basic.Example.tsx     |    1 +
 .../FolderCover/FolderCover.Props.ts          |    2 +-
 .../components/FolderCover/FolderCover.tsx    |    3 +-
 .../examples/FolderCover.Basic.Example.tsx    |    2 +-
 .../components/LayoutGroup/LayoutGroup.tsx    |    8 +-
 .../src/components/Tile/Tile.Props.ts         |    1 +
 .../experiments/src/components/Tile/Tile.tsx  |    3 +-
 .../Tile/examples/Tile.Document.Example.tsx   |    3 +-
 .../Tile/examples/Tile.Folder.Example.tsx     |    3 +-
 .../Tile/examples/Tile.Media.Example.tsx      |    3 +-
 .../src/components/TilesList/TilesList.tsx    |    2 -
 .../components/TilesList/TilesListPage.tsx    |   14 +-
 .../src/demo/GettingStartedPage.tsx           |   77 +-
 packages/experiments/src/demo/index.tsx       |    4 +
 packages/experiments/tsconfig.json            |    3 +-
 packages/icons/package.json                   |    4 +-
 packages/merge-styles/package.json            |    4 +-
 .../package.json                              |    2 +-
 packages/office-ui-fabric-react/CHANGELOG.md  |   26 +-
 .../config/pre-copy.json                      |    1 +
 packages/office-ui-fabric-react/package.json  |   22 +-
 .../src/common/tests.ts                       |    4 +
 .../ActivityItem/ActivityItem.classNames.ts   |   66 +
 .../ActivityItem/ActivityItem.styles.ts       |   16 +-
 .../components/ActivityItem/ActivityItem.tsx  |   57 +-
 .../ActionButton/ActionButton.styles.ts       |   16 +-
 .../Button/ActionButton/ActionButton.tsx      |    4 +-
 .../Button/BaseButton.classNames.ts           |   31 +-
 .../components/Button/BaseButton.styles.ts    |   30 +-
 .../src/components/Button/BaseButton.tsx      |   93 +-
 .../src/components/Button/Button.Props.ts     |   17 +-
 .../src/components/Button/Button.test.tsx     |   81 +-
 .../src/components/Button/Button.tsx          |    6 +-
 .../src/components/Button/ButtonPage.tsx      |   43 +-
 .../src/components/Button/ButtonThemes.ts     |   51 +-
 .../CommandBarButton.styles.ts                |   24 +-
 .../CommandBarButton/CommandBarButton.tsx     |    3 +-
 .../CompoundButton/CompoundButton.styles.ts   |   11 +-
 .../Button/CompoundButton/CompoundButton.tsx  |    3 +-
 .../DefaultButton/DefaultButton.styles.ts     |   10 +-
 .../Button/DefaultButton/DefaultButton.tsx    |    3 +-
 .../Button/IconButton/IconButton.styles.ts    |    4 +-
 .../Button/IconButton/IconButton.tsx          |    3 +-
 .../Button/PrimaryButton/PrimaryButton.tsx    |    3 +-
 .../SplitButton/SplitButton.classNames.ts     |   24 +-
 .../Button/SplitButton/SplitButton.styles.ts  |   58 +-
 .../Button/examples/Button.Action.Example.tsx |    2 +-
 .../Button/examples/Button.Anchor.Example.tsx |    1 -
 .../examples/Button.Command.Example.tsx       |   57 +-
 .../Button/examples/Button.Icon.Example.tsx   |    1 -
 .../examples/Button.Primary.Example.tsx       |   25 +
 .../examples/Button.ScreenReader.Example.tsx  |    1 -
 .../examples/Button.Split.Example.styles.ts   |    2 +-
 .../Button/examples/Button.Split.Example.tsx  |    2 +-
 .../Button/examples/Button.Swap.Example.tsx   |    1 -
 .../src/components/Button/index.ts            |    1 +
 .../src/components/Callout/CalloutContent.tsx |    2 +-
 .../Checkbox/Checkbox.classNames.ts           |   76 +
 .../components/Checkbox/Checkbox.styles.ts    |   10 +-
 .../src/components/Checkbox/Checkbox.tsx      |   77 +-
 .../components/ChoiceGroup/ChoiceGroup.scss   |   26 +-
 .../components/ChoiceGroup/ChoiceGroup.tsx    |   34 +-
 .../ComboBox/ComboBox.classNames.ts           |    4 +-
 .../components/ComboBox/ComboBox.styles.ts    |  132 +-
 .../src/components/ComboBox/ComboBox.tsx      |    2 +-
 .../src/components/CommandBar/CommandBar.tsx  |    3 +-
 .../ContextualMenu/ContextualMenu.tsx         |    3 +-
 .../src/components/DatePicker/DatePicker.scss |    1 -
 .../DetailsList/DetailsList.Props.ts          |    3 +-
 .../src/components/Dropdown/Dropdown.scss     |    1 -
 .../examples/Dropdown.Basic.Example.scss      |    9 +-
 .../examples/Dropdown.Basic.Example.tsx       |    6 +-
 .../components/Fabric/Fabric.classNames.ts    |   38 +
 .../src/components/Fabric/Fabric.styles.ts    |   31 -
 .../src/components/Fabric/Fabric.tsx          |   20 +-
 .../examples/Facepile.Basic.Example.tsx       |   15 +-
 .../src/components/FocusZone/FocusZone.tsx    |  118 +-
 .../HoverCard/ExpandingCard.styles.ts         |   53 +-
 .../components/HoverCard/ExpandingCard.tsx    |   13 +-
 .../src/components/HoverCard/HoverCard.tsx    |    7 +-
 .../src/components/Icon/Icon.Props.ts         |    2 +-
 .../src/components/Icon/Icon.classNames.ts    |   31 +
 .../src/components/Icon/Icon.styles.ts        |   31 -
 .../src/components/Icon/Icon.tsx              |   32 +-
 .../src/components/Icon/IconName.ts           |  923 -----
 .../src/components/Icon/index.ts              |    3 +-
 .../components/OverflowSet/OverflowSet.tsx    |   15 +-
 .../src/components/Panel/Panel.scss           |    1 +
 .../src/components/SearchBox/SearchBox.scss   |    1 -
 .../src/components/Slider/Slider.scss         |    1 -
 .../SpinButton/SpinButton.classNames.ts       |   12 +-
 .../SpinButton/SpinButton.styles.ts           |   15 +-
 .../src/components/SpinButton/SpinButton.tsx  |    3 +-
 .../src/components/TextField/TextField.scss   |    1 -
 .../components/Toggle/Toggle.classNames.ts    |   57 +-
 .../src/components/Toggle/Toggle.tsx          |    2 +-
 .../examples/Picker.CustomResult.Example.tsx  |   41 +-
 .../office-ui-fabric-react/src/demo/index.tsx |    4 +
 packages/office-ui-fabric-react/src/index.ts  |    8 +
 .../examples/Selection.Basic.Example.tsx      |    2 +-
 packages/office-ui-fabric-react/tslint.json   |    3 +-
 packages/styling/CHANGELOG.md                 |    2 +-
 packages/styling/package.json                 |   25 +-
 .../styling/src/classNames/ColorClassNames.ts |    8 +-
 .../styling/src/classNames/IconClassNames.ts  |   37 -
 packages/styling/src/classNames/index.ts      |    3 -
 packages/styling/src/glamorExports.ts         |   73 -
 packages/styling/src/index.ts                 |    3 +-
 .../src/interfaces/IAnimationStyles.ts        |    2 +-
 .../styling/src/interfaces/IFontStyles.ts     |    3 +-
 .../styling/src/interfaces/IProcessedStyle.ts |    9 -
 packages/styling/src/interfaces/IRawStyle.ts  |    3 -
 packages/styling/src/interfaces/IStyle.ts     |    8 -
 packages/styling/src/interfaces/ISwatch.ts    |   15 -
 packages/styling/src/interfaces/ISwatchSet.ts |  168 -
 packages/styling/src/interfaces/index.ts      |    5 +-
 .../styling/src/styles/AnimationStyles.ts     |    4 +-
 .../styling/src/styles/DefaultFontStyles.ts   |   28 +-
 packages/styling/src/styles/IconCodes.ts      | 2987 -----------------
 packages/styling/src/styles/UtilityStyles.ts  |   12 -
 packages/styling/src/styles/getFocusStyle.ts  |   46 +-
 .../styling/src/styles/hiddenContentStyle.ts  |   11 +
 packages/styling/src/styles/index.ts          |    5 +-
 packages/styling/src/styles/theme.ts          |    8 +-
 .../styling/src/utilities/buildClassMap.ts    |    2 +-
 .../styling/src/utilities/getIconClassName.ts |   40 +-
 packages/styling/src/utilities/icons.ts       |  141 +
 packages/styling/src/utilities/index.ts       |   19 +-
 .../styling/src/utilities/mergeStyleSets.ts   |   27 -
 packages/styling/src/utilities/mergeStyles.ts |   53 -
 packages/styling/tsconfig.json                |    2 -
 packages/utilities/package.json               |   12 +-
 packages/utilities/src/Customizations.test.ts |   51 +
 packages/utilities/src/Customizations.ts      |   77 +
 packages/utilities/src/Customizer.test.tsx    |   94 +
 packages/utilities/src/Customizer.tsx         |   85 +-
 packages/utilities/src/GlobalSettings.ts      |    4 +-
 packages/utilities/src/customizable.test.tsx  |   47 +-
 packages/utilities/src/customizable.tsx       |   35 +-
 packages/utilities/src/index.ts               |    1 +
 packages/utilities/src/scroll.scss            |    1 -
 rush.json                                     |    5 +
 scripts/package.json                          |    7 +-
 scripts/publish-beta.js                       |   23 +
 scripts/tasks/jest-resources.js               |   72 +-
 scripts/tasks/jest-serializer-merge-styles.js |   55 +
 scripts/tasks/jest-style-mock.js              |    1 +
 scripts/update-package-versions.js            |   31 +
 180 files changed, 2515 insertions(+), 5907 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/5.0_2017-09-26-23-14.json
 create mode 100644 common/changes/@uifabric/experiments/5.0_2017-09-26-23-14.json
 create mode 100644 common/changes/@uifabric/fabric-website/5.0_2017-09-26-23-14.json
 create mode 100644 common/changes/@uifabric/icons/5.0_2017-09-26-23-14.json
 create mode 100644 common/changes/@uifabric/styling/5.0_2017-09-26-23-14.json
 create mode 100644 common/changes/@uifabric/utilities/5.0_2017-09-26-23-14.json
 create mode 100644 common/changes/office-ui-fabric-react/5.0_2017-09-26-23-14.json
 create mode 100644 ghdocs/MIGRATION_TO_5.0.0.md
 create mode 100644 packages/experiments/config/pre-copy.json
 create mode 100644 packages/experiments/jest.config.js
 delete mode 100644 packages/experiments/karma.config.js
 create mode 100644 packages/experiments/src/Styling.ts
 create mode 100644 packages/experiments/src/Utilities.ts
 create mode 100644 packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.classNames.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.classNames.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Fabric/Fabric.classNames.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Fabric/Fabric.styles.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Icon/Icon.classNames.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Icon/Icon.styles.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Icon/IconName.ts
 delete mode 100644 packages/styling/src/classNames/IconClassNames.ts
 delete mode 100644 packages/styling/src/glamorExports.ts
 delete mode 100644 packages/styling/src/interfaces/IProcessedStyle.ts
 delete mode 100644 packages/styling/src/interfaces/IRawStyle.ts
 delete mode 100644 packages/styling/src/interfaces/IStyle.ts
 delete mode 100644 packages/styling/src/interfaces/ISwatch.ts
 delete mode 100644 packages/styling/src/interfaces/ISwatchSet.ts
 delete mode 100644 packages/styling/src/styles/IconCodes.ts
 delete mode 100644 packages/styling/src/styles/UtilityStyles.ts
 create mode 100644 packages/styling/src/styles/hiddenContentStyle.ts
 create mode 100644 packages/styling/src/utilities/icons.ts
 delete mode 100644 packages/styling/src/utilities/mergeStyleSets.ts
 delete mode 100644 packages/styling/src/utilities/mergeStyles.ts
 create mode 100644 packages/utilities/src/Customizations.test.ts
 create mode 100644 packages/utilities/src/Customizations.ts
 create mode 100644 packages/utilities/src/Customizer.test.tsx
 create mode 100644 scripts/publish-beta.js
 create mode 100644 scripts/tasks/jest-serializer-merge-styles.js
 create mode 100644 scripts/tasks/jest-style-mock.js
 create mode 100644 scripts/update-package-versions.js

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index cee52b07170f0..52860e36abb7b 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -19,7 +19,7 @@
   "license": "MIT",
   "devDependencies": {
     "@types/chai": "3.4.35",
-    "@types/enzyme": "2.8.0",
+    "@types/enzyme": "2.8.8",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "2.2.39",
     "@types/node": "8.0.26",
@@ -30,24 +30,24 @@
     "@types/react-addons-test-utils": "0.14.19",
     "@types/react-dom": "15.5.1",
     "@types/webpack-env": "1.13.0",
-    "enzyme": "^2.7.0",
+    "enzyme": "^2.9.1",
     "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
     "highlight.js": "^9.6.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
-    "react": "^15.4.2",
+    "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
+    "react": "^15.6.1",
     "react-addons-test-utils": "^15.4.2",
-    "react-dom": "^15.4.2",
+    "react-dom": "^15.6.1",
     "react-highlight": "0.9.0",
     "write-file-webpack-plugin": "^4.1.0"
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/example-app-base": ">=4.2.7 <5.0.0",
+    "@uifabric/icons": ">=5.0.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=4.50.2 <5.0.0",
+    "office-ui-fabric-react": ">=5.0.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 0e34193ae4777..303551e00df38 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ssr-tests",
-  "version": "1.0.2",
+  "version": "5.0.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "private": true,
   "repository": {
@@ -17,17 +17,18 @@
   "license": "MIT",
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
+    "@uifabric/icons": ">=5.0.0 <6.0.0",
     "@types/chai": "3.4.35",
-    "@types/enzyme": "2.8.0",
+    "@types/enzyme": "2.8.8",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=4.51.0 <5.0.0",
+    "office-ui-fabric-react": ">=5.0.0 <6.0.0",
     "raw-loader": "^0.5.1",
-    "react": "^15.4.2",
+    "react": "^15.6.1",
     "react-addons-test-utils": "^15.4.2",
-    "react-dom": "^15.4.2",
+    "react-dom": "^15.6.1",
     "webpack": "^3.5.5"
   },
   "dependencies": {
diff --git a/apps/ssr-tests/test/test.js b/apps/ssr-tests/test/test.js
index f913ec8b14ef5..5d62dbe0caf45 100644
--- a/apps/ssr-tests/test/test.js
+++ b/apps/ssr-tests/test/test.js
@@ -1,5 +1,9 @@
 'use strict';
 
+import { initializeIcons } from '@uifabric/icons/lib/index';
+
+initializeIcons('dist/');
+
 // Configure load-themed-styles to avoid registering styles.
 let themeLoader = require('@microsoft/load-themed-styles');
 themeLoader.configureLoadStyles((styles) => {
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 988faf294928a..0e2e624551d9a 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -1,6 +1,6 @@
 {
   "name": "test-bundle-button",
-  "version": "0.0.2",
+  "version": "5.0.0",
   "description": "Testing the button for bundling.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -21,12 +21,12 @@
     "@types/react-dom": "15.5.1",
     "@types/webpack-env": "1.13.0",
     "@types/prop-types": "15.5.1",
-    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0"
+    "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=4.51.0 <5.0.0",
+    "office-ui-fabric-react": ">=5.0.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/test-bundle-button/webpack.config.js b/apps/test-bundle-button/webpack.config.js
index 475e48ba7a49a..8882a7943b28a 100644
--- a/apps/test-bundle-button/webpack.config.js
+++ b/apps/test-bundle-button/webpack.config.js
@@ -15,4 +15,3 @@ module.exports = resources.createConfig(
     }
 
   });
-
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 5884aea0b6457..5fefda809c1ed 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -1,7 +1,7 @@
 {
   "name": "todo-app",
   "description": "Sample todo app using office-ui-fabric-react.",
-  "version": "1.0.3",
+  "version": "5.0.0",
   "private": true,
   "scripts": {
     "build": "node ../../scripts/build.js",
@@ -10,23 +10,23 @@
   },
   "devDependencies": {
     "@types/chai": "3.4.35",
-    "@types/enzyme": "2.8.0",
+    "@types/enzyme": "2.8.8",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "2.2.39",
     "@types/react": "15.0.38",
     "@types/react-addons-test-utils": "0.14.18",
     "@types/react-dom": "15.5.1",
     "@types/webpack-env": "1.13.0",
-    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
+    "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
     "react-addons-test-utils": "^15.4.2"
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=4.51.0 <5.0.0",
-    "react": "^15.4.2",
-    "react-dom": "^15.4.2",
+    "office-ui-fabric-react": ">=5.0.0 <6.0.0",
+    "react": "^15.6.1",
+    "react-dom": "^15.6.1",
     "typescript": "2.4.2",
     "tslib": "^1.7.1"
   }
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index a231005dd4d1c..b3c5e57a8e695 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -1,7 +1,7 @@
 {
   "name": "vr-tests",
   "description": "Visual Regression Tests for Office UI Fabric React",
-  "version": "1.0.0",
+  "version": "5.0.0",
   "private": true,
   "scripts": {
     "build": "",
@@ -22,15 +22,15 @@
     "raw-loader": "=0.5.1",
     "style-loader": "=0.16.1",
     "awesome-typescript-loader": "^3.2.3",
-    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
+    "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
     "screener-storybook": "^0.9.1",
     "screener-runner": "^0.6.19",
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=4.51.0 <5.0.0",
-    "react": "^15.4.2",
-    "react-dom": "^15.4.2",
+    "office-ui-fabric-react": ">=5.0.0 <6.0.0",
+    "react": "^15.6.1",
+    "react-dom": "^15.6.1",
     "typescript": "2.4.2",
     "tslib": "^1.7.1"
   }
diff --git a/apps/vr-tests/src/stories/Breadcrumb.stories.tsx b/apps/vr-tests/src/stories/Breadcrumb.stories.tsx
index 5b886de540e93..a25438367d499 100644
--- a/apps/vr-tests/src/stories/Breadcrumb.stories.tsx
+++ b/apps/vr-tests/src/stories/Breadcrumb.stories.tsx
@@ -8,19 +8,22 @@ import { Breadcrumb } from 'office-ui-fabric-react';
 storiesOf('Breadcrumb', module)
   .addDecorator(FabricDecorator)
   .addDecorator(story => (
-    <Screener steps={ new Screener.Steps()
-      .hover('.ms-Breadcrumb-overflowButton')
-      .snapshot('hover')
-      .click('.ms-Breadcrumb-overflowButton') // opening the dropdown
-      .hover('.ms-Breadcrumb-overflowButton') // moving the mouse a bit to let dropdown open.
-      .snapshot('click')
-      .click('.ms-Breadcrumb-overflowButton') // closing the dropdown
-      .hover('.ms-Breadcrumb-list li:nth-child(2)')
-      .snapshot('longTitleHover')
-      .hover('.ms-Breadcrumb-list li:nth-child(3)')
-      .snapshot('shortTitleHover')
-      .end()
-    }>
+    <Screener
+      steps={
+        new Screener.Steps()
+          .hover('.ms-Breadcrumb-overflowButton')
+          .snapshot('hover')
+          .click('.ms-Breadcrumb-overflowButton') // opening the dropdown
+          .hover('.ms-Breadcrumb-overflowButton') // moving the mouse a bit to let dropdown open.
+          .snapshot('click')
+          .click('.ms-Breadcrumb-overflowButton') // closing the dropdown
+          .hover('.ms-Breadcrumb-list li:nth-child(2)')
+          .snapshot('longTitleHover')
+          .hover('.ms-Breadcrumb-list li:nth-child(3)')
+          .snapshot('shortTitleHover')
+          .end()
+      }
+    >
       { story() }
     </Screener>
   ))
diff --git a/apps/vr-tests/src/stories/Button.stories.tsx b/apps/vr-tests/src/stories/Button.stories.tsx
index 41dd522156907..e820441f1bf45 100644
--- a/apps/vr-tests/src/stories/Button.stories.tsx
+++ b/apps/vr-tests/src/stories/Button.stories.tsx
@@ -11,7 +11,7 @@ const baseProps: IButtonProps = {
   },
   children: 'Butjon',
   description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor'
-}
+};
 
 const commandProps: IButtonProps = {
   'iconProps': { iconName: 'Add' },
@@ -31,98 +31,113 @@ const commandProps: IButtonProps = {
       }
     ]
   }
-}
+};
 
 storiesOf('Button Default', module)
   .addDecorator(FabricDecorator)
   .addDecorator(story => (
-    <Screener steps={ new Steps()
-      .hover('.ms-Button')
-      .snapshot('hover')
-      .end()
-    }>
+    <Screener
+      steps={
+        new Steps()
+          .hover('.ms-Button')
+          .snapshot('hover')
+          .end()
+      }
+    >
       { story() }
     </Screener>
   ))
-  .add('default', () => (<DefaultButton {...baseProps} ></DefaultButton>))
-  .add('default disabled', () => (<DefaultButton {...baseProps} disabled></DefaultButton>))
-  .add('default checked', () => (<DefaultButton {...baseProps} checked></DefaultButton>))
-  .add('primary', () => (<DefaultButton {...baseProps} primary></DefaultButton>))
-  .add('primary disabled', () => (<DefaultButton {...baseProps} primary disabled></DefaultButton>))
-  .add('primary checked', () => (<DefaultButton {...baseProps} primary checked></DefaultButton>))
+  .add('default', () => (<DefaultButton {...baseProps} />))
+  .add('default disabled', () => (<DefaultButton {...baseProps} disabled />))
+  .add('default checked', () => (<DefaultButton {...baseProps} checked />))
+  .add('primary', () => (<DefaultButton {...baseProps} primary />))
+  .add('primary disabled', () => (<DefaultButton {...baseProps} primary disabled />))
+  .add('primary checked', () => (<DefaultButton {...baseProps} primary checked />));
 
 storiesOf('Button Action', module)
   .addDecorator(FabricDecorator)
   .addDecorator(story => (
-    <Screener steps={ new Steps()
-      .hover('.ms-Button')
-      .snapshot('hover')
-      .end()
-    }>
+    <Screener
+      steps={
+        new Steps()
+          .hover('.ms-Button')
+          .snapshot('hover')
+          .end()
+      }
+    >
       { story() }
     </Screener>
   ))
-  .add('action', () => (<ActionButton {...baseProps} ></ActionButton>))
-  .add('action disabled', () => (<ActionButton {...baseProps} disabled></ActionButton>))
-  .add('action checked', () => (<ActionButton {...baseProps} checked></ActionButton>))
-
+  .add('action', () => (<ActionButton {...baseProps} />))
+  .add('action disabled', () => (<ActionButton {...baseProps} disabled />))
+  .add('action checked', () => (<ActionButton {...baseProps} checked />));
 
 storiesOf('Button Compound', module)
   .addDecorator(FabricDecorator)
   .addDecorator(story => (
-    <Screener steps={ new Steps()
-      .hover('.ms-Button')
-      .snapshot('hover')
-      .end()
-    }>
+    <Screener
+      steps={
+        new Steps()
+          .hover('.ms-Button')
+          .snapshot('hover')
+          .end()
+      }
+    >
       { story() }
     </Screener>
   ))
-  .add('Compound', () => (<CompoundButton {...baseProps} ></CompoundButton>))
-  .add('Compound disabled', () => (<CompoundButton {...baseProps} disabled></CompoundButton>))
-  .add('Compound checked', () => (<CompoundButton {...baseProps} checked></CompoundButton>))
-  .add('Compound Primary', () => (<CompoundButton {...baseProps} primary></CompoundButton>))
-  .add('Compound Primary disabled', () => (<CompoundButton {...baseProps} primary disabled></CompoundButton>))
-  .add('Compound Primary checked', () => (<CompoundButton {...baseProps} primary checked></CompoundButton>))
+  .add('Compound', () => (<CompoundButton {...baseProps} />))
+  .add('Compound disabled', () => (<CompoundButton {...baseProps} disabled />))
+  .add('Compound checked', () => (<CompoundButton {...baseProps} checked />))
+  .add('Compound Primary', () => (<CompoundButton {...baseProps} primary />))
+  .add('Compound Primary disabled', () => (<CompoundButton {...baseProps} primary disabled />))
+  .add('Compound Primary checked', () => (<CompoundButton {...baseProps} primary checked />));
 
 storiesOf('Button Command', module)
+  // tslint:disable-next-line:jsx-ban-props
   .addDecorator(story => <div style={ { display: 'flex', alignItems: 'stretch', height: '40px' } }>{ story() }</div>)
   .addDecorator(FabricDecorator)
   .addDecorator(story => (
-    <Screener steps={ new Steps()
-      .hover('.ms-Button')
-      .snapshot('hover')
-      .click('.ms-Button')
-      .hover('.ms-Button')
-      .snapshot('open')
-      .end()
-    }>
+    <Screener
+      steps={
+        new Steps()
+          .hover('.ms-Button')
+          .snapshot('hover')
+          .click('.ms-Button')
+          .hover('.ms-Button')
+          .snapshot('open')
+          .end()
+      }
+    >
       { story() }
     </Screener>
   ))
-  .add('Command', () => (<CommandBarButton {...commandProps} ></CommandBarButton>))
-  .add('Command disabled', () => (<CommandBarButton {...commandProps} disabled></CommandBarButton>))
-  .add('Command checked', () => (<CommandBarButton {...commandProps} checked></CommandBarButton>))
+  .add('Command', () => (<CommandBarButton {...commandProps} />))
+  .add('Command disabled', () => (<CommandBarButton {...commandProps} disabled />))
+  .add('Command checked', () => (<CommandBarButton {...commandProps} checked />));
 
 storiesOf('Button Split', module)
   .addDecorator(FabricDecorator)
   .addDecorator(story => (
-    <Screener steps={ new Steps()
-      .hover('.ms-Button:nth-child(1)')
-      .snapshot('hover main')
-      .hover('.ms-Button:nth-child(2)')
-      .snapshot('hover split')
-      .click('.ms-Button:nth-child(2)')
-      .hover('.ms-Button')
-      .snapshot('open')
-      .end()
-    }>
+    <Screener
+      steps={
+        new Steps()
+          .hover('.ms-Button:nth-child(1)')
+          .snapshot('hover main')
+          .hover('.ms-Button:nth-child(2)')
+          .snapshot('hover split')
+          .click('.ms-Button:nth-child(2)')
+          .hover('.ms-Button')
+          .snapshot('open')
+          .end()
+      }
+    >
       { story() }
     </Screener>
   ))
-  .add('default', () => (<DefaultButton {...commandProps} split={ true }></DefaultButton>))
-  .add('default disabled', () => (<DefaultButton {...commandProps} disabled split={ true }></DefaultButton>))
-  .add('default checked', () => (<DefaultButton {...commandProps} checked split={ true }></DefaultButton>))
-  .add('primary', () => (<DefaultButton {...commandProps} primary split={ true }></DefaultButton>))
-  .add('primary disabled', () => (<DefaultButton {...commandProps} primary disabled split={ true }></DefaultButton>))
-  .add('primary checked', () => (<DefaultButton {...commandProps} primary checked split={ true }></DefaultButton>))
\ No newline at end of file
+  .add('default', () => (<DefaultButton {...commandProps} split={ true } />))
+  .add('default disabled', () => (<DefaultButton {...commandProps} disabled split={ true } />))
+  .add('default checked', () => (<DefaultButton {...commandProps} checked split={ true } />))
+  .add('primary', () => (<DefaultButton {...commandProps} primary split={ true } />))
+  .add('primary disabled', () => (<DefaultButton {...commandProps} primary disabled split={ true } />))
+  .add('primary checked', () => (<DefaultButton {...commandProps} primary checked split={ true } />));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/index.tsx b/apps/vr-tests/src/stories/index.tsx
index 9f2213c191f4d..4f26f6957d8bd 100644
--- a/apps/vr-tests/src/stories/index.tsx
+++ b/apps/vr-tests/src/stories/index.tsx
@@ -2,7 +2,6 @@
 import * as React from 'react';
 import { Fabric } from 'office-ui-fabric-react';
 
-
 // Wrap all stories in a Fabric component for proper styling
 export const FabricDecorator = (story) => (
   <Fabric>
diff --git a/common/changes/@uifabric/example-app-base/5.0_2017-09-26-23-14.json b/common/changes/@uifabric/example-app-base/5.0_2017-09-26-23-14.json
new file mode 100644
index 0000000000000..4eca78fcca360
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/5.0_2017-09-26-23-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Updated for Fabric 5.0.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/5.0_2017-09-26-23-14.json b/common/changes/@uifabric/experiments/5.0_2017-09-26-23-14.json
new file mode 100644
index 0000000000000..2c79da151bf71
--- /dev/null
+++ b/common/changes/@uifabric/experiments/5.0_2017-09-26-23-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Updated for Fabric 5.0.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/5.0_2017-09-26-23-14.json b/common/changes/@uifabric/fabric-website/5.0_2017-09-26-23-14.json
new file mode 100644
index 0000000000000..9f1d630efddbb
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/5.0_2017-09-26-23-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Updated for Fabric 5.0.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/5.0_2017-09-26-23-14.json b/common/changes/@uifabric/icons/5.0_2017-09-26-23-14.json
new file mode 100644
index 0000000000000..12cc905239da2
--- /dev/null
+++ b/common/changes/@uifabric/icons/5.0_2017-09-26-23-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/icons",
+      "comment": "Initial release of the icons package.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/icons",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/5.0_2017-09-26-23-14.json b/common/changes/@uifabric/styling/5.0_2017-09-26-23-14.json
new file mode 100644
index 0000000000000..31c637b7044b9
--- /dev/null
+++ b/common/changes/@uifabric/styling/5.0_2017-09-26-23-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "The 5.0 Fabric release. See the [the wiki](https://github.com/OfficeDev/office-ui-fabric-react/wiki/Fabric-5.0:-What's-new) for a full list of changes and how to work with the new bits.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/5.0_2017-09-26-23-14.json b/common/changes/@uifabric/utilities/5.0_2017-09-26-23-14.json
new file mode 100644
index 0000000000000..755fc43a73bce
--- /dev/null
+++ b/common/changes/@uifabric/utilities/5.0_2017-09-26-23-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Updated for Fabric 5.0.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/5.0_2017-09-26-23-14.json b/common/changes/office-ui-fabric-react/5.0_2017-09-26-23-14.json
new file mode 100644
index 0000000000000..85f3d19e49bff
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/5.0_2017-09-26-23-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Updated for Fabric 5.0.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 90cc0faee8027..13c73fc11b1c0 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -1218,9 +1218,16 @@
         }
       }
     },
+    "@rush-temp/icons": {
+      "version": "file:projects/icons"
+    },
     "@rush-temp/merge-styles": {
       "version": "file:projects/merge-styles",
       "dependencies": {
+        "@types/jest": {
+          "version": "21.1.0",
+          "bundled": true
+        },
         "commander": {
           "version": "2.9.0",
           "bundled": true
@@ -2236,6 +2243,10 @@
     "@rush-temp/utilities": {
       "version": "file:projects/utilities",
       "dependencies": {
+        "@types/jest": {
+          "version": "21.1.0",
+          "bundled": true
+        },
         "async": {
           "version": "0.9.2",
           "bundled": true
@@ -2403,9 +2414,9 @@
       "integrity": "sha512-7YJQbllem83umRzZ+ry6RZFAbBWNoHvbiW6tE5VEAJIoX6F22hrKrBw3ibRvHm2zPnOhZGrZJusAbp1zZKcLzQ=="
     },
     "@types/enzyme": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@types/enzyme/-/enzyme-2.8.0.tgz",
-      "integrity": "sha1-hMYgTPiYMSI6iattw/SQseCIY1I="
+      "version": "2.8.8",
+      "resolved": "https://registry.npmjs.org/@types/enzyme/-/enzyme-2.8.8.tgz",
+      "integrity": "sha512-KBw0ZzOQNtwVGO4egRjEpQbXMFCSevy+gRFzaLXrU64LrVVuJF0FqVIdzed0NCSP+nMALj001//dwYKV/VDlCA=="
     },
     "@types/es6-promise": {
       "version": "0.0.32",
@@ -2418,9 +2429,9 @@
       "integrity": "sha1-7WM2lV6vIzt163kjubHzc9BF7wE="
     },
     "@types/jest": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.0.tgz",
-      "integrity": "sha512-7W+tgzauU0s467L7SG1GuHKr4jOmMTXOvR78LP6/YfuaM8JNRF+ayV2+vmNmlaBhbNPvckeJfak2aP+7VJ3g5A=="
+      "version": "21.1.1",
+      "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.1.tgz",
+      "integrity": "sha512-PkhRLvgERKS5ZDrmYUQbbEOwhD4c2vGpWbCvwPLF82cdE6jWAwMKGAWYyIKfEgSDO5tr1p1n2XmeVlynMJ2usA=="
     },
     "@types/mocha": {
       "version": "2.2.39",
@@ -2452,6 +2463,11 @@
       "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-15.5.1.tgz",
       "integrity": "sha512-4c+e/QPfvSa48YhgGOcQWoHishTo6BuJqka0Bh8qeLdnK1jS+1Nz8W/w1G17AIjtLxONYFUqmi8qyt+8p/yMFA=="
     },
+    "@types/react-test-renderer": {
+      "version": "15.5.4",
+      "resolved": "https://registry.npmjs.org/@types/react-test-renderer/-/react-test-renderer-15.5.4.tgz",
+      "integrity": "sha512-9gESAOcTd/sUuTdngpDpR8qTkDvxPOHNjedxzRyyTmXoqnMtBM04DfOEKmoM4ZuD2DrQVN4JRwpaE02hvsqH0A=="
+    },
     "@types/resemblejs": {
       "version": "1.3.28",
       "resolved": "https://registry.npmjs.org/@types/resemblejs/-/resemblejs-1.3.28.tgz",
@@ -2472,11 +2488,6 @@
       "resolved": "https://registry.npmjs.org/@types/webpack-env/-/webpack-env-1.13.0.tgz",
       "integrity": "sha1-MEQ4FkfhHulzxa8uklMjkw9pHYA="
     },
-    "@uifabric/example-app-base": {
-      "version": "4.2.7",
-      "resolved": "https://registry.npmjs.org/@uifabric/example-app-base/-/example-app-base-4.2.7.tgz",
-      "integrity": "sha512-hy790+Zhsc3E75RWZHoZ7JRK0Mk+j0nf9rhwQZ7eA1+88ZuNo/6eBdeLC/5LynS7Fz35VVnMYWWFKxWumdrOxA=="
-    },
     "@uifabric/styling": {
       "version": "0.24.1",
       "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.24.1.tgz",
@@ -4774,16 +4785,9 @@
       "integrity": "sha1-blwtClYhtdra7O+AuQ7ftc13cvA="
     },
     "enzyme": {
-      "version": "2.7.0",
-      "resolved": "https://registry.npmjs.org/enzyme/-/enzyme-2.7.0.tgz",
-      "integrity": "sha1-dyR3gAVHyiUUzAryWOZHwWau6Jk=",
-      "dependencies": {
-        "uuid": {
-          "version": "2.0.3",
-          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz",
-          "integrity": "sha1-Z+LoY3lyFVMN/zGOW/nc6/1Hsho="
-        }
-      }
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/enzyme/-/enzyme-2.9.1.tgz",
+      "integrity": "sha1-B9XOaRJBJA+4F78sSxjW5TAkDfY="
     },
     "errno": {
       "version": "0.1.4",
@@ -9358,14 +9362,14 @@
       "integrity": "sha1-DD0L6u2KAclm2Xh793goElKpeao="
     },
     "react": {
-      "version": "15.4.2",
-      "resolved": "https://registry.npmjs.org/react/-/react-15.4.2.tgz",
-      "integrity": "sha1-QfeZGyYYU5K6m66WyIiefgGDl+8="
+      "version": "15.6.2",
+      "resolved": "https://registry.npmjs.org/react/-/react-15.6.2.tgz",
+      "integrity": "sha1-26BDSrQ5z+gvEI8PURZjkIF5qnI="
     },
     "react-addons-test-utils": {
-      "version": "15.4.2",
-      "resolved": "https://registry.npmjs.org/react-addons-test-utils/-/react-addons-test-utils-15.4.2.tgz",
-      "integrity": "sha1-k7yqcY/K5zYNQuj7HAl1bMNjAqI="
+      "version": "15.6.2",
+      "resolved": "https://registry.npmjs.org/react-addons-test-utils/-/react-addons-test-utils-15.6.2.tgz",
+      "integrity": "sha1-wStu/cIkfBDae4dw0YUICnsEcVY="
     },
     "react-docgen": {
       "version": "2.18.0",
@@ -9380,9 +9384,9 @@
       }
     },
     "react-dom": {
-      "version": "15.4.2",
-      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-15.4.2.tgz",
-      "integrity": "sha1-AVNj8FsKH9Uq6e/dOgBg2QaVII8="
+      "version": "15.6.2",
+      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-15.6.2.tgz",
+      "integrity": "sha1-Qc+t9pO3V/rycIRDodH9WgK+9zA="
     },
     "react-dom-factories": {
       "version": "1.0.2",
@@ -9456,6 +9460,11 @@
       "resolved": "https://registry.npmjs.org/react-style-proptype/-/react-style-proptype-3.0.0.tgz",
       "integrity": "sha1-ieC2RvJmxlarsPDdggLb1QNsMeY="
     },
+    "react-test-renderer": {
+      "version": "15.6.2",
+      "resolved": "https://registry.npmjs.org/react-test-renderer/-/react-test-renderer-15.6.2.tgz",
+      "integrity": "sha1-0DM0NPwsQ4CSaWyncNpe1IA376g="
+    },
     "react-transition-group": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-1.2.0.tgz",
@@ -10088,6 +10097,11 @@
           "resolved": "https://registry.npmjs.org/qs/-/qs-6.4.0.tgz",
           "integrity": "sha1-E+JtKK1rD/qpExLNO/cI7TUecjM="
         },
+        "react-dom": {
+          "version": "15.4.2",
+          "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-15.4.2.tgz",
+          "integrity": "sha1-AVNj8FsKH9Uq6e/dOgBg2QaVII8="
+        },
         "request": {
           "version": "2.81.0",
           "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz",
@@ -11708,9 +11722,9 @@
       "integrity": "sha512-xuPeK4OdjWqtfi59ylvVL0Yn35SF3zgcAcv7rBPFHVaEapaDr4GdGgm3j7ckTwH9wHL7fGmgfAnb0+THrHb8tA=="
     },
     "write-file-webpack-plugin": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/write-file-webpack-plugin/-/write-file-webpack-plugin-4.1.0.tgz",
-      "integrity": "sha512-KkFZtNeeuSjig5sACrd0n1ybrpd4CS8P5J2TGEklS7UGGlz+iISAxJf426XwaQ2TTlTAq1LTXRBWTTEYjy5e4A==",
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/write-file-webpack-plugin/-/write-file-webpack-plugin-4.2.0.tgz",
+      "integrity": "sha512-sIjfV+M1Ia8p/lVcLjvM2I0Lq/40tCMZe+k0Pxg2TG6TKjUgHGwQeM42QdYLiHAIAITGQK1HEQA3YknFubzfDQ==",
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
diff --git a/common/config/rush/pinned-versions.json b/common/config/rush/pinned-versions.json
index 3ceb125d414f5..9e26dfeeb6e64 100644
--- a/common/config/rush/pinned-versions.json
+++ b/common/config/rush/pinned-versions.json
@@ -1,6 +1 @@
-{
-  "react": "15.4.2",
-  "react-addons-test-utils": "15.4.2",
-  "react-dom": "15.4.2",
-  "enzyme": "2.7.0"
-}
\ No newline at end of file
+{}
\ No newline at end of file
diff --git a/ghdocs/MIGRATION_TO_5.0.0.md b/ghdocs/MIGRATION_TO_5.0.0.md
new file mode 100644
index 0000000000000..4af241674a7d0
--- /dev/null
+++ b/ghdocs/MIGRATION_TO_5.0.0.md
@@ -0,0 +1,112 @@
+The changes from 4.x to 5.x are focused around bundle size, icon management, and css performance. Major list of changes:
+
+* Icons have been moved to a separate `@uifabric/icons` package.
+* Glamor has been replaced with `@uifabric/merge-styles` package.
+* Deprecated `Button` component and `ButtonTypes` enum have been removed.
+
+To give an idea of the bundle size impact of these change, bundling all dependencies (minus react) up to the Fabric component (one of the simplest components) has been reduced from Fabric 4 size of 34.229 KB to Fabric 5's 20.339 KB bytes gzipped. This includes all utilities, styling, and merge-styles logic, which is the foundation required for rendering Fabric components.
+
+This 40% reduction in foundation code is a good start, but we still can do better and will continue to slice and dice the contents to reduce further in future updates.
+
+# Migration guide from Fabric 4.x to Fabric 5.x
+
+# Before updating to 5
+
+It would be a good idea to update some deprecated things in your application code before the update:
+
+1. Remove all references to Button and ButtonType. Replace with variants (PrimaryButton, DefaultButton, IconButton, CommandButton, CompoundButton.)
+
+2. Remove all references to the `ms-Icon` and `ms-Icon-*` class names. Use the `Icon` component to render icons, rather than using Fabric Core icon class names. This will make the icon transition easier.
+
+## Notes on Icons
+
+Icons definitions have been a part of the bundle size problem. 5k gzipped is dedicated to the `IconCodes` code map. Most partners do not need these. Additionally, using the icons downloads the Fabric Icon font, which adds a whopping 80k font download. This is a bad practice that no partner should be burdened with. But this has been an awkward issue to address, since we also want icons to just work out of the box.
+
+Another problem customers have faced is that the hardcoded SharePoint CDN urls to those icon fonts are not always ideal. In on-premise solutions, those urls can't be accessed and partners tend to have to redefine those rules. We want it to be easy to solve the on-premise scenario as well.
+
+In Fabric 5, we did this:
+
+1. We removed the IconCodes enum.
+
+2. We added a method `registerIcons` to the `@uifabric/styling` package which enables the partner to register a subset definition (including which font to use for what codes.)
+
+3. We updated the Icon subset tool to generate a package, including TypeScript code which would call `registerIcons` with multiple subsets.
+
+4. The tool (which will become available on the Fabric website) can now allow a partner to choose the icons that are important to them, and then for remaining ones, can optionally split them into chunks. That means rendering the common icons would always download the first chunk but all other icons would only download the subset containing them when actually used.
+
+The `@uifabric/icons` package is the output of that tool, and will be the official, always updated, single source of truth package for our icons. If there is an icon on the Fabric icons page, it will be registered through.
+
+To use it, you need to npm install it and save it as a dependency. Then in your root code, initialize the icons through the imported `initializeIcons` function:
+
+```tsx
+import { initializeIcons } from '@uifabric/icons';
+
+initializeIcons('//mycdn.com/path/to/icons/' /* optional base url, defaults to sharepoint cdn */);
+```
+
+The package has a `fonts` folder which contains the fonts which you can optionally copy to your cdn. This enables the on-prem scenario.
+
+So, your options for supporting icons in your project are:
+
+1. Don't use Fabric icons. 0 byte performance penalty, yay!
+
+2. Use the `@uifabric/icons` package. 5k gzip penalty for registering all icons + used font subset download.
+
+3. Import directly from `@uifabric/icons/lib/fabric-icons-0` to register only the first subset (which includes just the icons that Fabric components use, plus common commanding icons.) Less than 1k gzip penalty for registering just the core icons + 4k core only font subset.
+
+4. Custom icons! Use the icon subset tool to choose the exact set of icons to register and build your own icon registration code. You can even choose to use inlined icons and include them with your JavaScript bundle.
+
+# Glamor replacement
+
+In Fabric 4, we introduced the library Glamor into our project as an initial step towards better control of css generation. It enabled a number of features such as contextual theming, better on demand class registration, and sharing of variables defined in javascript. Perhaps most importantly, it allows us to take `styles` in as props to components which is a much more robust and error-free way to style components compared to the fragile css class name approach which suffers from specificity and no build time validation.
+
+In the initial set of components we converted, we saw a lot of room for improvement in Glamor:
+
+* Bundle size penalty is ~11k total (glamor + dependencies)
+* Edge performance is very poor (registering 1000 simple rules takes 350ms, and moves exponentially upwards beyond that.)
+* TypeScript type safety is missing
+* Numerous console warnings emitted with no way to disable them other than to use webpack with DefinePlugin defining the 'production' NODE_ENV value.
+
+In order to address these issues, and to have tighter control over the iteration and management of this very important core service of creating controls, we are replacing it with our own library `@uifabric/merge-styles`. This allows us to address the issues:
+
+* Bundle size reduced down to 2.6k. (~8k improvement)
+* Edge performance is significantly better. (registering 1000 rules takes <45ms and stays static as you register more.)
+* Registering styles is completely type safe now, so doing things like registering `background: 42` will red squiggly.
+* No more console warnings
+* Tighter control over the release process, we can fix things quickly
+* Everything unit tested with 100% code coverage.
+
+If you were using `mergeStyles` from the `@uifabric/styling` package before, there is a minor modification to the styles you pass into it. For selector rules such as `:hover` or `:before`, these must now be encapsulated within a `selectors` collection. This was done to keep type-safety working (once you add a string indexer, you lose type-safety benefits in catching typos like `bakcground: 'red'`.)
+
+Before:
+
+```tsx
+mergeStyles({
+  ':hover': {
+    background: 'red'
+  }
+});
+```
+
+After:
+
+```tsx
+mergeStyles({
+  selectors: {
+    ':hover': {
+      background: 'red'
+    }
+  }
+});
+```
+
+Some helpers that were from glamor, such as `parent()` and `before()` have been removed, since you can express these using these selectors. If your selector statement has an ampersand in it, it will translate that into the exact rule replacing the ampersand with the generated className:
+
+|selector|becomes|
+|--------|------|
+|`.parent &`|`.parent .css-123`|
+|`& .child`|`.css-123 .child`|
+|`&:before`|`.css-123:before`|
+|`:hover`|`.css-123:hover`|
+|`BUTTON.&`|`BUTTON.css-123`|
+|`&&&`|`.css-123.css-123.css-123`|
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index f7cc51416f8b8..5b87fefddcd72 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "4.2.7",
+  "version": "5.0.0",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -16,7 +16,7 @@
   },
   "devDependencies": {
     "@types/chai": "3.4.35",
-    "@types/enzyme": "2.8.0",
+    "@types/enzyme": "2.8.8",
     "@types/es6-promise": "0.0.32",
     "@types/highlight.js": "9.1.9",
     "@types/mocha": "2.2.39",
@@ -24,18 +24,22 @@
     "@types/react-addons-test-utils": "0.14.18",
     "@types/react-dom": "15.5.1",
     "@types/webpack-env": "1.13.0",
-    "enzyme": "^2.7.0",
+    "enzyme": "^2.9.1",
+    "es6-weak-map": "^2.0.2",
+    "es6-map": "^0.1.5",
     "es6-promise": "^4.1.0",
-    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
-    "react": "^15.4.2",
+    "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
+    "react": "^15.6.1",
     "react-addons-test-utils": "^15.4.2",
-    "react-dom": "^15.4.2"
+    "react-dom": "^15.6.1"
   },
   "peerDependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
+    "@uifabric/styling": ">=5.0.0 <6.0.0",
+    "@uifabric/utilities": ">=5.0.0 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=4.39.0 <5.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/example-app-base/src/components/Header/Header.tsx b/packages/example-app-base/src/components/Header/Header.tsx
index 9a3be29eaef61..42aa451729f36 100644
--- a/packages/example-app-base/src/components/Header/Header.tsx
+++ b/packages/example-app-base/src/components/Header/Header.tsx
@@ -68,7 +68,6 @@ export class Header extends React.Component<IHeaderProps, IHeaderState> {
             </button>
           ) }
           <div className={ 'Header-title ' + FontClassNames.large }>
-            <Icon iconName='Org' />
             { title }
           </div>
           <div className='Header-buttons'>
diff --git a/packages/experiments/config/pre-copy.json b/packages/experiments/config/pre-copy.json
new file mode 100644
index 0000000000000..7eddd20114419
--- /dev/null
+++ b/packages/experiments/config/pre-copy.json
@@ -0,0 +1,7 @@
+{
+  "copyTo": {
+    "dist": [
+      "../icons/fonts/*"
+    ]
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/jest.config.js b/packages/experiments/jest.config.js
new file mode 100644
index 0000000000000..ffb2cd8b04514
--- /dev/null
+++ b/packages/experiments/jest.config.js
@@ -0,0 +1,3 @@
+let { createConfig } = require('../../scripts/tasks/jest-resources');
+
+module.exports = createConfig();
\ No newline at end of file
diff --git a/packages/experiments/karma.config.js b/packages/experiments/karma.config.js
deleted file mode 100644
index ed6389cbbf12b..0000000000000
--- a/packages/experiments/karma.config.js
+++ /dev/null
@@ -1,116 +0,0 @@
-'use strict';
-
-// Karma configuration
-// Generated on Thu Oct 08 2015 18:13:05 GMT-0700 (PDT)
-
-let path = require('path');
-let resources = require('../../scripts/tasks/karma-resources');
-let bindPolyfillPath = resources.bindPolyfillPath;
-let debugRun = (process.argv.indexOf('--debug') > -1);
-let webpack = resources.webpack;
-
-module.exports = function (config) {
-  let karmaConfig = {
-
-    // base path that will be used to resolve all patterns (eg. files, exclude)
-    basePath: '.',
-
-    // frameworks to use
-    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
-    frameworks: ['mocha', 'sinon-chai'],
-
-
-    // list of files / patterns to load in the browser
-    files: resources.files.concat([
-      path.join('lib', 'common/tests.js')
-    ]),
-
-    // list of files to exclude
-    exclude: [],
-
-
-    // webpack config for bundling tests.
-    webpack: {
-      devtool: 'inline-source-map',
-      module: {
-        loaders: [
-          {
-            test: /sinon\/pkg\/sinon/,
-            loader: "imports?define=>false,require=>false"
-          },
-          debugRun ? {} : {
-            test: /\.js/,
-            exclude: /(test|node_modules|bower_components)/,
-            loader: resources.istanbulInstrumenterLoaderPath,
-            enforce: 'post'
-          }
-        ],
-      },
-      externals: {
-        'cheerio': 'window',
-        // 'react/addons': true,
-        // 'react/lib/ExecutionEnvironment': true,
-        // 'react/lib/ReactContext': true
-      },
-      resolve: {
-        modules: [
-          path.resolve(__dirname, 'lib'),
-          path.resolve('../../scripts/node_modules'),
-          'node_modules'
-        ]
-      },
-      plugins: [
-        new webpack.DefinePlugin({
-          'process.env.NODE_ENV': JSON.stringify('production')
-        })
-      ]
-    },
-
-    webpackMiddleware: {
-      noInfo: true
-    },
-
-    // preprocess matching files before serving them to the browser
-    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
-    preprocessors: {
-      [path.join('lib', '/**/*.js')]: ['webpack']
-    },
-
-    plugins: resources.plugins.concat([
-    ]),
-
-    // test results reporter to use
-    // possible values: 'dots', 'progress'
-    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
-    reporters: ['mocha-clean', 'coverage'],
-
-
-    // web server port
-    port: 9876,
-
-
-    // enable / disable colors in the output (reporters and logs)
-    colors: true,
-
-
-    // level of logging
-    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
-    logLevel: config.LOG_INFO,
-
-
-    // enable / disable watching file and executing tests whenever any file changes
-    autoWatch: false,
-
-
-    // start these browsers
-    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
-    browsers: ['PhantomJS'],
-
-
-    // Continuous Integration mode
-    // if true, Karma captures browsers, runs the tests and exits
-    singleRun: true
-  };
-
-  config.set(karmaConfig);
-};
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 72d2501e9b04a..18c278f1d9054 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "0.10.0",
+  "version": "5.0.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -12,38 +12,37 @@
   "scripts": {
     "build": "node ../../scripts/build.js",
     "clean": "node ../../scripts/clean.js",
-    "start": "node ../../scripts/start.js"
+    "start": "node ../../scripts/start.js",
+    "start-test": "node ../../scripts/start-test.js"
   },
   "devDependencies": {
-    "@types/chai": "3.4.35",
-    "@types/enzyme": "2.8.0",
     "@types/es6-promise": "^0.0.32",
-    "@types/mocha": "2.2.39",
     "@types/prop-types": "15.5.1",
     "@types/react": "15.0.38",
     "@types/react-addons-test-utils": "0.14.18",
+    "@types/react-test-renderer": "^15.5.4",
     "@types/react-dom": "15.5.1",
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
+    "@types/jest": "^21.1.0",
+    "@types/enzyme": "^2.8.8",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=4.2.7 <5.0.0",
-    "enzyme": "^2.7.0",
-    "es6-promise": "^4.1.0",
+    "@uifabric/example-app-base": ">=5.0.0 <6.0.0",
+    "@uifabric/icons": ">=5.0.0 <6.0.0",
     "es6-weak-map": "^2.0.2",
-    "es6-map": "^0.1.5",
-    "highlight.js": "^9.6.0",
-    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
-    "react": "^15.4.2",
+    "enzyme": "^2.9.1",
+    "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
+    "react": "^15.6.1",
     "react-addons-test-utils": "^15.4.2",
-    "react-dom": "^15.4.2",
+    "react-test-renderer": "^15.6.1",
+    "react-dom": "^15.6.1",
     "react-highlight": "0.9.0",
     "sinon": "^2.3.2"
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/styling": ">=0.24.2 <1.0.0",
-    "@uifabric/utilities": ">=4.16.0 <5.0.0",
-    "office-ui-fabric-react": ">=4.51.0 <5.0.0",
+    "office-ui-fabric-react": ">=5.0.0 <6.0.0",
+    "@uifabric/icons": ">=5.0.0 <6.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/experiments/src/Styling.ts b/packages/experiments/src/Styling.ts
new file mode 100644
index 0000000000000..23a31515c1309
--- /dev/null
+++ b/packages/experiments/src/Styling.ts
@@ -0,0 +1 @@
+export * from 'office-ui-fabric-react/lib/Styling';
diff --git a/packages/experiments/src/Utilities.ts b/packages/experiments/src/Utilities.ts
new file mode 100644
index 0000000000000..4661a875ed729
--- /dev/null
+++ b/packages/experiments/src/Utilities.ts
@@ -0,0 +1 @@
+export * from 'office-ui-fabric-react/lib/Utilities';
diff --git a/packages/experiments/src/common/tests.ts b/packages/experiments/src/common/tests.ts
index 13fa7bc7d3b38..d50df24446d90 100644
--- a/packages/experiments/src/common/tests.ts
+++ b/packages/experiments/src/common/tests.ts
@@ -6,6 +6,11 @@ import 'es6-map/implement';
  * This is a test entry point to help karma-webpack find all tests in the project.
  **/
 
+import { initializeIcons } from '@uifabric/icons/lib/index';
+
+console.log('initializing icons');
+initializeIcons('dist/');
+
 // Before loading modules, treat errors and warnings as test failures.
 console.error = console.warn = (warning: string) => {
   throw new Error(warning);
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.test.tsx b/packages/experiments/src/components/CommandBar/CommandBar.test.tsx
index 474ef98a65dbb..eab601b976d9d 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.test.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBar.test.tsx
@@ -2,13 +2,13 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
-import * as ReactDOM from 'react-dom';
-import * as ReactTestUtils from 'react-addons-test-utils';
-
-let { expect } = chai;
-
 import { CommandBar } from './CommandBar';
-import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
+import * as renderer from 'react-test-renderer';
+import { mount } from 'enzyme';
+import { setIconOptions } from 'office-ui-fabric-react/lib/Styling';
+
+// Disable icon warnings.
+setIconOptions({ warnOnMissingIcons: false });
 
 describe('CommandBar', () => {
 
@@ -21,8 +21,129 @@ describe('CommandBar', () => {
     }
   });
 
-  it.only('opens a menu with IContextualMenuItem.subMenuProps.items property', () => {
-    const items: IContextualMenuItem[] = [
+  it('renders commands correctly', () => {
+    expect(renderer.create(
+      <CommandBar
+        items={ [
+          { key: '1', name: 'asdf' },
+          { key: '2', name: 'asdf' }
+        ] }
+      />
+    ).toJSON()).toMatchSnapshot();
+  });
+
+  it('opens a menu with IContextualMenuItem.subMenuProps.items property', () => {
+    const commandBar = mount<CommandBar>(
+      <CommandBar
+        items={ [
+          {
+            name: 'TestText 1',
+            key: 'TestKey1',
+            className: 'MenuItem',
+            subMenuProps: {
+              items: [
+                {
+                  name: 'SubmenuText 1',
+                  key: 'SubmenuKey1',
+                  className: 'SubMenuClass'
+                }
+              ]
+            }
+          },
+        ] }
+      />
+    );
+
+    const menuItem = commandBar.find('.MenuItem button');
+
+    expect(menuItem.length).toEqual(1);
+
+    menuItem.simulate('click');
+
+    expect(document.querySelector('.SubMenuClass')).toBeDefined();
+  });
+
+  it('keeps menu open after update if item is still present', () => {
+    const commandBar = mount(
+      <CommandBar
+        items={ [
+          {
+            name: 'TestText 1',
+            key: 'TestKey1',
+            subMenuProps: {
+              items: [
+                {
+                  name: 'SubmenuText 1',
+                  key: 'SubmenuKey1',
+                  className: 'SubMenuClass'
+                }
+              ]
+            }
+          },
+        ] }
+      />
+    );
+
+    let menuItem = commandBar.find('button');
+
+    menuItem.simulate('click');
+
+    // Make sure the menu is open before the re-render
+    expect(document.querySelector('.SubMenuClass')).toBeDefined();
+
+    // Update the props, and re-render
+    commandBar.setProps({
+      items: commandBar.props().items.concat([
+        {
+          name: 'Test Key 2',
+          key: 'TestKey2'
+        }
+      ])
+    });
+
+    // Make sure the menu is still open after the re-render
+    expect(document.querySelector('.SubMenuClass')).toBeDefined();
+  });
+
+  it('closes menu after update if item is not longer present', () => {
+    const commandBar = mount(
+      <CommandBar
+        items={ [
+          {
+            name: 'TestText 1',
+            key: 'TestKey1',
+            subMenuProps: {
+              items: [
+                {
+                  name: 'SubmenuText 1',
+                  key: 'SubmenuKey1',
+                  className: 'SubMenuClass'
+                }
+              ]
+            }
+          },
+        ] }
+      />
+    );
+
+    let menuItem = commandBar.find('button');
+
+    menuItem.simulate('click');
+
+    // Make sure the menu is open before the re-render
+    expect(document.querySelector('.SubMenuClass')).toBeDefined();
+
+    // Update the props, and re-render
+    commandBar.setProps({
+      items: []
+    });
+
+    // Make sure the menu is still open after the re-render
+    expect(document.querySelector('.SubMenuClass')).toBeFalsy();
+  });
+
+  it('updates menu after update if item is still present', () => {
+    let items = [
       {
         name: 'TestText 1',
         key: 'TestKey1',
@@ -38,179 +159,29 @@ describe('CommandBar', () => {
       },
     ];
 
-    let renderedContent = ReactTestUtils.renderIntoDocument<CommandBar>(
+    const commandBar = mount(
       <CommandBar
         items={ items }
       />
-    ) as React.Component<CommandBar, {}>;
-    document.body.appendChild(ReactDOM.findDOMNode(renderedContent));
+    );
 
-    let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
-    ReactTestUtils.Simulate.click(menuItem);
+    let menuItem = commandBar.find('button');
 
-    expect(document.querySelector('.SubMenuClass')).to.exist;
-  });
+    menuItem.simulate('click');
 
-  it('keeps menu open after update if item is still present', () => {
-    let renderContainer = document.createElement('div');
-    document.body.appendChild(renderContainer);
+    // Make sure the menu is open before the re-render
+    expect(document.querySelector('.SubMenuClass')).toBeDefined();
 
-    try {
-      let items: IContextualMenuItem[] = [
-        {
-          name: 'TestText 1',
-          key: 'TestKey1',
-          subMenuProps: {
-            items: [
-              {
-                name: 'SubmenuText 1',
-                key: 'SubmenuKey1',
-                className: 'SubMenuClass'
-              }
-            ]
-          }
-        },
-      ];
-
-      let renderedContent = ReactDOM.render(
-        <CommandBar
-          items={ items }
-        />,
-        renderContainer
-      ) as React.Component<CommandBar, {}>;
-
-      let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
-      ReactTestUtils.Simulate.click(menuItem);
-
-      // Make sure the menu is open before the re-render
-      expect(document.querySelector('.SubMenuClass')).to.exist;
-
-      // Update the props, and re-render
-      items.push({
-        name: 'Test Key 2',
-        key: 'TestKey2'
-      });
-
-      renderedContent = ReactDOM.render(
-        <CommandBar
-          items={ items }
-        />,
-        renderContainer
-      ) as React.Component<CommandBar, {}>;
-
-      // Make sure the menu is still open after the re-render
-      expect(document.querySelector('.SubMenuClass')).to.exist;
-    } finally {
-      ReactDOM.unmountComponentAtNode(renderContainer);
-      document.body.removeChild(renderContainer);
-    }
-  });
+    // Update the props
+    items[0].subMenuProps.items[0].className = 'SubMenuClassUpdate';
 
-  it('closes menu after update if item is not longer present', () => {
-    let renderContainer = document.createElement('div');
-    document.body.appendChild(renderContainer);
+    // Re-render
+    commandBar.setProps({
+      items: items
+    });
 
-    try {
-      let items: IContextualMenuItem[] = [
-        {
-          name: 'TestText 1',
-          key: 'TestKey1',
-          subMenuProps: {
-            items: [
-              {
-                name: 'SubmenuText 1',
-                key: 'SubmenuKey1',
-                className: 'SubMenuClass'
-              }
-            ]
-          }
-        },
-      ];
-
-      let renderedContent = ReactDOM.render(
-        <CommandBar
-          items={ items }
-        />,
-        renderContainer
-      ) as React.Component<CommandBar, {}>;
-
-      let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
-      ReactTestUtils.Simulate.click(menuItem);
-
-      // Make sure the menu is open before the re-render
-      expect(document.querySelector('.SubMenuClass')).to.exist;
-
-      // Update the props, and re-render
-      items = [{
-        name: 'Test Key 2',
-        key: 'TestKey2'
-      }];
-
-      renderedContent = ReactDOM.render(
-        <CommandBar
-          items={ items }
-        />,
-        renderContainer
-      ) as React.Component<CommandBar, {}>;
-
-      // Make sure the menu is still open after the re-render
-      expect(document.querySelector('.SubMenuClass')).not.to.exist;
-    } finally {
-      ReactDOM.unmountComponentAtNode(renderContainer);
-      document.body.removeChild(renderContainer);
-    }
+    // Make sure the menu is still open after the re-render
+    expect(document.querySelector('.SubMenuClassUpdate')).toBeDefined();
   });
 
-  it('updates menu after update if item is still present', () => {
-    let renderContainer = document.createElement('div');
-    document.body.appendChild(renderContainer);
-
-    try {
-      let items: IContextualMenuItem[] = [
-        {
-          name: 'TestText 1',
-          key: 'TestKey1',
-          subMenuProps: {
-            items: [
-              {
-                name: 'SubmenuText 1',
-                key: 'SubmenuKey1',
-                className: 'SubMenuClass'
-              }
-            ]
-          }
-        },
-      ];
-
-      let renderedContent = ReactDOM.render(
-        <CommandBar
-          items={ items }
-        />,
-        renderContainer
-      ) as React.Component<CommandBar, {}>;
-
-      let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
-      ReactTestUtils.Simulate.click(menuItem);
-
-      // Make sure the menu is open before the re-render
-      expect(document.querySelector('.SubMenuClass')).to.exist;
-
-      // Update the props, and re-render
-      items[0].subMenuProps!.items[0].className = 'SubMenuClassUpdate';
-
-      renderedContent = ReactDOM.render(
-        <CommandBar
-          items={ items }
-        />,
-        renderContainer
-      ) as React.Component<CommandBar, {}>;
-
-      // Make sure the menu is still open after the re-render
-      expect(document.querySelector('.SubMenuClass')).not.to.exist;
-      expect(document.querySelector('.SubMenuClassUpdate')).to.exist;
-    } finally {
-      ReactDOM.unmountComponentAtNode(renderContainer);
-      document.body.removeChild(renderContainer);
-    }
-  });
-});
\ No newline at end of file
+});
diff --git a/packages/experiments/src/components/CommandBar/CommandBarPage.tsx b/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
index 12f019565b0d2..129efa97e7bab 100644
--- a/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
@@ -9,8 +9,9 @@ import { items, overflowItems, farItems } from './examples/data';
 import { ICommandBarProps } from './CommandBar.Props';
 import { CommandBarBasicExample } from './examples/CommandBar.Basic.Example';
 
-// tslint:disable-next-line:max-line-length
-const CommandBarBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx') as string;
+const CommandBarBasicExampleCode = require(
+  '!raw-loader!office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx'
+) as string;
 
 export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}> {
   public render(): JSX.Element {
@@ -39,13 +40,26 @@ export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}>
         overview={
           <div>
             <p>
-              CommandBar is a surface that houses commands that operate on the content of the window, panel, or parent region it resides above. They are one of the most visible and recognizable ways to surface commands, and can be an intuitive method for interacting with content on the page. However, if overloaded or poorly organized, they can be difficult to use and hide valuable commands from your user. CommandBars can also display a search box for finding content; hold simple commands as well as menus; and display the status of ongoing actions.
+              CommandBar is a surface that houses commands that operate on the content of the window, panel, or
+              parent region it resides above. They are one of the most visible and recognizable ways to surface
+              commands, and can be an intuitive method for interacting with content on the page. However, if
+              overloaded or poorly organized, they can be difficult to use and hide valuable commands from your
+              user. CommandBars can also display a search box for finding content; hold simple commands as well
+              as menus; and display the status of ongoing actions.
             </p>
             <p>
-              Commands should be sorted in order of importance, from left to right or right to left depending on the culture. Secondarily, organize commands in logical groupings for easier recall. CommandBars work best when they display no more than 5-7 commands. This helps users quickly find your most valuable features. If you need to show more commands, consider using the overflow menu. If you need to render status, or viewing controls, these go on the right side of the CommandBar (or left side if in a left to right experience). Do not display more than 2-3 items on the right side as it will make the overall CommandBar difficult to parse.
+              Commands should be sorted in order of importance, from left to right or right to left depending on
+              the culture. Secondarily, organize commands in logical groupings for easier recall. CommandBars work
+              best when they display no more than 5-7 commands. This helps users quickly find your most valuable
+              features. If you need to show more commands, consider using the overflow menu. If you need to
+              render status, or viewing controls, these go on the right side of the CommandBar (or left side if
+              in a left to right experience). Do not display more than 2-3 items on the right side as it will
+              make the overall CommandBar difficult to parse.
             </p>
             <p>
-              All command items should have an icon and a label. Commands can render as labels only as well. In smaller widths, commands can just use icon only, but only for the most recognizable and frequently used commands. All other commands should go into an overflow where text labels can be shown.
+              All command items should have an icon and a label. Commands can render as labels only as well. In
+              smaller widths, commands can just use icon only, but only for the most recognizable and frequently
+              used commands. All other commands should go into an overflow where text labels can be shown.
             </p>
           </div>
         }
diff --git a/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap b/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
new file mode 100644
index 0000000000000..60565e6c1b034
--- /dev/null
+++ b/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
@@ -0,0 +1,237 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`CommandBar renders commands correctly 1`] = `
+<div
+  className="ms-ResizeGroup"
+>
+  <div
+    className=""
+  >
+    <div
+      className="ms-CommandBar"
+    >
+      <div
+        aria-describedby={undefined}
+        aria-labelledby={undefined}
+        className="ms-FocusZone ms-OverflowSet"
+        data-focuszone-id="FocusZone1"
+        onFocus={[Function]}
+        onKeyDown={[Function]}
+        onMouseDownCapture={[Function]}
+        role="menubar"
+      >
+        <div
+          className="ms-OverflowSet-item"
+        >
+          <button
+            aria-describedby={null}
+            aria-label={undefined}
+            aria-labelledby={null}
+            aria-pressed={undefined}
+            className=
+                ms-Button
+                ms-Button--commandBar
+                {
+                  -moz-osx-font-smoothing: grayscale;
+                  -webkit-font-smoothing: antialiased;
+                  background-color: #f4f4f4;
+                  border: 1px solid transparent;
+                  box-sizing: border-box;
+                  color: #333333;
+                  cursor: pointer;
+                  display: inline-block;
+                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-size: 14px;
+                  font-weight: 400;
+                  height: 40px;
+                  min-width: 40px;
+                  outline: transparent;
+                  padding-bottom: 0;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 0;
+                  position: relative;
+                  text-align: center;
+                  text-decoration: none;
+                  user-select: none;
+                  vertical-align: top;
+                }
+                &::-moz-focus-inner {
+                  border: 0;
+                }
+                .ms-Fabric.is-focusVisible &:focus:after {
+                  border: 1px solid #ffffff;
+                  bottom: 0px;
+                  content: "";
+                  left: 0px;
+                  outline: 1px solid #666666;
+                  position: absolute;
+                  right: 0px;
+                  top: 0px;
+                  z-index: 1;
+                }
+                &:hover {
+                  background-color: #eaeaea;
+                  color: #212121;
+                }
+                &:active {
+                  background-color: #dadada;
+                  color: #000000;
+                }
+            data-is-focusable={true}
+            disabled={undefined}
+            name="asdf"
+            type="button"
+          >
+            <div
+              className=
+                  ms-Button-flexContainer
+                  {
+                    align-items: center;
+                    display: flex;
+                    flex-wrap: nowrap;
+                    height: 100%;
+                    justify-content: center;
+                  }
+            >
+              <div
+                className=
+                    ms-Button-textContainer
+                    {
+                      flex-grow: 1;
+                    }
+              >
+                <div
+                  className=
+                      ms-Button-label
+                      {
+                        font-weight: normal;
+                        line-height: 100%;
+                        margin-bottom: 0;
+                        margin-left: 4px;
+                        margin-right: 4px;
+                        margin-top: 0;
+                      }
+                  id="2"
+                >
+                  asdf
+                </div>
+              </div>
+            </div>
+          </button>
+        </div>
+        <div
+          className="ms-OverflowSet-item"
+        >
+          <button
+            aria-describedby={null}
+            aria-label={undefined}
+            aria-labelledby={null}
+            aria-pressed={undefined}
+            className=
+                ms-Button
+                ms-Button--commandBar
+                {
+                  -moz-osx-font-smoothing: grayscale;
+                  -webkit-font-smoothing: antialiased;
+                  background-color: #f4f4f4;
+                  border: 1px solid transparent;
+                  box-sizing: border-box;
+                  color: #333333;
+                  cursor: pointer;
+                  display: inline-block;
+                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-size: 14px;
+                  font-weight: 400;
+                  height: 40px;
+                  min-width: 40px;
+                  outline: transparent;
+                  padding-bottom: 0;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 0;
+                  position: relative;
+                  text-align: center;
+                  text-decoration: none;
+                  user-select: none;
+                  vertical-align: top;
+                }
+                &::-moz-focus-inner {
+                  border: 0;
+                }
+                .ms-Fabric.is-focusVisible &:focus:after {
+                  border: 1px solid #ffffff;
+                  bottom: 0px;
+                  content: "";
+                  left: 0px;
+                  outline: 1px solid #666666;
+                  position: absolute;
+                  right: 0px;
+                  top: 0px;
+                  z-index: 1;
+                }
+                &:hover {
+                  background-color: #eaeaea;
+                  color: #212121;
+                }
+                &:active {
+                  background-color: #dadada;
+                  color: #000000;
+                }
+            data-is-focusable={true}
+            disabled={undefined}
+            name="asdf"
+            type="button"
+          >
+            <div
+              className=
+                  ms-Button-flexContainer
+                  {
+                    align-items: center;
+                    display: flex;
+                    flex-wrap: nowrap;
+                    height: 100%;
+                    justify-content: center;
+                  }
+            >
+              <div
+                className=
+                    ms-Button-textContainer
+                    {
+                      flex-grow: 1;
+                    }
+              >
+                <div
+                  className=
+                      ms-Button-label
+                      {
+                        font-weight: normal;
+                        line-height: 100%;
+                        margin-bottom: 0;
+                        margin-left: 4px;
+                        margin-right: 4px;
+                        margin-top: 0;
+                      }
+                  id="5"
+                >
+                  asdf
+                </div>
+              </div>
+            </div>
+          </button>
+        </div>
+      </div>
+      <div
+        aria-describedby={undefined}
+        aria-labelledby={undefined}
+        className="ms-FocusZone ms-OverflowSet"
+        data-focuszone-id="FocusZone8"
+        onFocus={[Function]}
+        onKeyDown={[Function]}
+        onMouseDownCapture={[Function]}
+        role="menubar"
+      />
+    </div>
+  </div>
+</div>
+`;
diff --git a/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx b/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
index 24a62c74b24a8..f0813bb0fdb86 100644
--- a/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
+++ b/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { CommandBar } from '../CommandBar';
 import { ICommandBarProps } from './../CommandBar.Props';
+
 export class CommandBarBasicExample extends React.Component<ICommandBarProps, {}> {
 
   constructor(props: ICommandBarProps) {
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.Props.ts b/packages/experiments/src/components/FolderCover/FolderCover.Props.ts
index 60f0e3d938417..d81c8cb147a97 100644
--- a/packages/experiments/src/components/FolderCover/FolderCover.Props.ts
+++ b/packages/experiments/src/components/FolderCover/FolderCover.Props.ts
@@ -1,6 +1,6 @@
 
 import * as React from 'react';
-import { IBaseProps } from 'office-ui-fabric-react/lib/Utilities';
+import { IBaseProps } from '../../Utilities';
 import { FolderCover } from './FolderCover';
 
 export type FolderCoverSize =
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.tsx b/packages/experiments/src/components/FolderCover/FolderCover.tsx
index 48ae8303bddd0..c422d564cf60f 100644
--- a/packages/experiments/src/components/FolderCover/FolderCover.tsx
+++ b/packages/experiments/src/components/FolderCover/FolderCover.tsx
@@ -1,8 +1,7 @@
 
 import * as React from 'react';
 import { IFolderCoverProps, FolderCoverSize, FolderCoverType } from './FolderCover.Props';
-import { css } from 'office-ui-fabric-react/lib/Utilities';
-import { ISize } from '@uifabric/utilities';
+import { ISize, css } from '../../Utilities';
 import * as FolderCoverStylesModule from './FolderCover.scss';
 import * as SignalStylesModule from '../signals/Signals.scss';
 
diff --git a/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx b/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx
index 9f4a3db05d3f7..9b3dadb8ea18d 100644
--- a/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx
+++ b/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx
@@ -2,7 +2,7 @@
 import * as React from 'react';
 import { FolderCover, getFolderCoverLayout, renderFolderCoverWithLayout } from '../FolderCover';
 import { IFolderCoverProps } from '../FolderCover.Props';
-import { ISize, fitContentToBounds } from '@uifabric/utilities';
+import { ISize, fitContentToBounds } from '../../../Utilities';
 import { SharedSignal } from '../../signals/Signals';
 import { lorem } from '@uifabric/example-app-base';
 
diff --git a/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx b/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx
index 962361e02e6f4..5fd58e6b62e6d 100644
--- a/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx
+++ b/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx
@@ -1,7 +1,7 @@
 
 import * as React from 'react';
 import { ILayoutGroupProps } from './LayoutGroup.props';
-import { mergeStyles } from '@uifabric/styling';
+import { IRawStyle, mergeStyles } from 'office-ui-fabric-react/lib/Styling';
 import {
   autobind,
   getNativeProps,
@@ -44,7 +44,7 @@ export class LayoutGroup extends React.Component<ILayoutGroupProps, {}> {
                 marginBottom: layoutGap + 'px'
               },
               justify === 'fill' && {
-                flexBasis: 0,
+                flexBasis: '0',
                 flexGrow: 1
               }
 
@@ -67,8 +67,8 @@ export class LayoutGroup extends React.Component<ILayoutGroupProps, {}> {
               display: 'flex',
               flexDirection: direction === 'horizontal' ? 'row' : 'column',
               justifyContent: this._getJustify(justify)
-            }
-          ) as string
+            } as IRawStyle
+          )
         }
       >
         { group }
diff --git a/packages/experiments/src/components/Tile/Tile.Props.ts b/packages/experiments/src/components/Tile/Tile.Props.ts
index fc55a8419a458..8f5e7a43b9d4b 100644
--- a/packages/experiments/src/components/Tile/Tile.Props.ts
+++ b/packages/experiments/src/components/Tile/Tile.Props.ts
@@ -1,3 +1,4 @@
+/* tslint:disable:no-unused-variable */
 
 import * as React from 'react';
 import { IBaseProps, ISize } from 'office-ui-fabric-react/lib/Utilities';
diff --git a/packages/experiments/src/components/Tile/Tile.tsx b/packages/experiments/src/components/Tile/Tile.tsx
index 74a35ed92eed9..10736a177dfd2 100644
--- a/packages/experiments/src/components/Tile/Tile.tsx
+++ b/packages/experiments/src/components/Tile/Tile.tsx
@@ -3,8 +3,7 @@ import * as React from 'react';
 import { ITileProps, TileSize } from './Tile.Props';
 import { Check } from 'office-ui-fabric-react/lib/Check';
 import { SELECTION_CHANGE } from 'office-ui-fabric-react/lib/Selection';
-import { css, BaseComponent, autobind, getId } from 'office-ui-fabric-react/lib/Utilities';
-import { ISize } from '@uifabric/utilities';
+import { ISize, css, BaseComponent, autobind, getId } from '../../Utilities';
 import * as TileStylesModule from './Tile.scss';
 import * as SignalStylesModule from '../signals/Signals.scss';
 import * as CheckStylesModule from 'office-ui-fabric-react/lib/components/Check/Check.scss';
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
index 8102ee1625ae5..f86c31cbddca7 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
@@ -1,7 +1,6 @@
 
 import * as React from 'react';
 import { Tile, getTileLayout, renderTileWithLayout } from '../Tile';
-import { css, autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import {
   SignalField,
@@ -11,7 +10,7 @@ import {
   SharedSignal
 } from '../../signals/Signals';
 import { lorem } from '@uifabric/example-app-base';
-import { ISize, fitContentToBounds } from '@uifabric/utilities';
+import { css, autobind, ISize, fitContentToBounds } from '../../../Utilities';
 import * as TileExampleStylesModule from './Tile.Example.scss';
 
 // tslint:disable-next-line:no-any
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
index ab69c10db86b1..c42c036eb4f65 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
@@ -1,7 +1,6 @@
 
 import * as React from 'react';
 import { Tile } from '../Tile';
-import { css, autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import {
   SignalField,
@@ -12,7 +11,7 @@ import {
 import { FolderCover, getFolderCoverLayout, renderFolderCoverWithLayout } from '../../FolderCover/FolderCover';
 import { FolderCoverType } from '../../FolderCover/FolderCover.Props';
 import { lorem } from '@uifabric/example-app-base';
-import { ISize, fitContentToBounds } from '@uifabric/utilities';
+import { css, autobind, ISize, fitContentToBounds } from '../../../Utilities';
 import * as TileExampleStylesModule from './Tile.Example.scss';
 
 // tslint:disable-next-line:no-any
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
index 62ae165b8b2bd..0a15cdf8d0fb3 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
@@ -2,9 +2,8 @@
 import * as React from 'react';
 import { Tile, getTileLayout, renderTileWithLayout } from '../Tile';
 import { Icon } from 'office-ui-fabric-react/lib/Icon';
-import { css, autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
-import { ISize, fitContentToBounds } from '@uifabric/utilities';
+import { css, autobind, ISize, fitContentToBounds } from '../../../Utilities';
 import {
   SignalField,
   Signal,
diff --git a/packages/experiments/src/components/TilesList/TilesList.tsx b/packages/experiments/src/components/TilesList/TilesList.tsx
index cdc5dc9b683e6..a8df43c6dc5ef 100644
--- a/packages/experiments/src/components/TilesList/TilesList.tsx
+++ b/packages/experiments/src/components/TilesList/TilesList.tsx
@@ -446,9 +446,7 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
 
     const itemWidthOverHeight = item.aspectRatio || 1;
     const margin = grid.spacing / 2;
-
     const isFill = gridMode === TilesGridMode.fill;
-
     const width = itemWidthOverHeight * grid.minRowHeight;
 
     return {
diff --git a/packages/experiments/src/components/TilesList/TilesListPage.tsx b/packages/experiments/src/components/TilesList/TilesListPage.tsx
index a17ecc62cc3c8..2da9d54614bcd 100644
--- a/packages/experiments/src/components/TilesList/TilesListPage.tsx
+++ b/packages/experiments/src/components/TilesList/TilesListPage.tsx
@@ -9,14 +9,20 @@ import {
 
 /* tslint:disable:max-line-length */
 import { TilesListBasicExample } from './examples/TilesList.Basic.Example';
-const TilesListBasicExampleCode = require('!raw-loader!experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx') as string;
+const TilesListBasicExampleCode = require(
+  '!raw-loader!experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx'
+) as string;
 
 import { TilesListDocumentExample } from './examples/TilesList.Document.Example';
-const TilesListDocumentExampleCode = require('!raw-loader!experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx') as string;
+const TilesListDocumentExampleCode = require(
+  '!raw-loader!experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx'
+) as string;
 
 import { TilesListMediaExample } from './examples/TilesList.Media.Example';
-const TilesListMediaExampleCode = require('!raw-loader!experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx') as string;
-/* tslint:enable:max-line-length */
+
+const TilesListMediaExampleCode = require(
+  '!raw-loader!experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx'
+) as string;
 
 export class TilesListPage extends React.Component<IComponentDemoPageProps, {}> {
   public render(): JSX.Element {
diff --git a/packages/experiments/src/demo/GettingStartedPage.tsx b/packages/experiments/src/demo/GettingStartedPage.tsx
index f332b6cd65140..279df63c6d878 100644
--- a/packages/experiments/src/demo/GettingStartedPage.tsx
+++ b/packages/experiments/src/demo/GettingStartedPage.tsx
@@ -17,37 +17,51 @@ export class GettingStartedPage extends React.Component<{}, {}> {
 
         <h2>Overview</h2>
 
-        <p>{
-          `Fabric React components are built as production ready components to be used in Microsoft products, but generalized, documented, and reusable. This enables us and our partners to more easily build great applications without spending a ton of time implementing the same things over and over.`
-        }</p>
-
-        <p>{
-          `Each component is designed to be RTL friendly, keyboard accessible, screen reader friendly, themeable, and generalized. TypeScript definition files are also included, so if you use TypeScript (which isn't a requirement), you will get compiler validation and using an editor like VS Code, you'll get intellisense. Each component is exported as a named module that can be easily imported in your code, allowing your external bundler to create small bundles that include just what you need.`
-        }</p>
+        <p>
+          Fabric React components are built as production ready components to be used in Microsoft products,
+          but generalized, documented, and reusable. This enables us and our partners to more easily build
+          great applications without spending a ton of time implementing the same things over and over.`
+        </p>
+
+        <p>
+          Each component is designed to be RTL friendly, keyboard accessible, screen reader friendly, themeable,
+          and generalized. TypeScript definition files are also included, so if you use TypeScript (which isn't
+          a requirement), you will get compiler validation and using an editor like VS Code, you'll get
+          intellisense. Each component is exported as a named module that can be easily imported in your code,
+          allowing your external bundler to create small bundles that include just what you need.`
+        </p>
 
         <h2>Getting started</h2>
 
-        <p>{ `Integrating components into your project depends heavily on your setup. The recommended setup is to use a bundler such as ` }<Link href='https://webpack.github.io/' target='_blank'>Webpack</Link>{ ` which can resolve NPM package imports in your code and can bundle the specific things you import.` }</p>
+        <p>
+          Integrating components into your project depends heavily on your setup. The recommended setup
+            is to use a bundler such as
+            <Link href='https://webpack.github.io/' target='_blank'>Webpack</Link>
+          which can resolve NPM package imports in your code and can bundle the specific things you import.
+        </p>
 
-        <p>{
-          `Within an npm project, you should install the package and save it as a dependency:`
-        }</p>
+        <p>
+          Within an npm project, you should install the package and save it as a dependency:
+        </p>
 
         <div className='ms-GettingStartedPage-code'>
           <Highlight className='bash'>npm install --save office-ui-fabric-react</Highlight>
         </div>
 
-        <p>{
-          `This will add the fabric-react project as a dependency in your package.json file, and will drop the project under node_modules/office-ui-fabric-react.`
-        }</p>
+        <p>
+          This will add the fabric-react project as a dependency in your package.json file, and will drop the
+          project under node_modules/office-ui-fabric-react.
+        </p>
 
-        <p>{
-          `The library includes commonjs entry points under the lib folder. To use a control, you should be able to import it and use it in your render method. Note that wrapping your application in the Fabric component is required to support RTL, keyboard focus and other features.`
-        }</p>
+        <p>
+          The library includes commonjs entry points under the lib folder. To use a control, you should be able
+          to import it and use it in your render method. Note that wrapping your application in the Fabric
+          component is required to support RTL, keyboard focus and other features.
+        </p>
 
         <div className='ms-GettingStartedPage-code'>
-          <Highlight className='typescript'>{
-            `import * as React from 'react';
+          <Highlight className='typescript'>{ `
+import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
@@ -59,19 +73,26 @@ ReactDOM.render(<MyPage />, document.body.firstChild);`
         </div>
 
         <h2>Notes on module vs path-based imports</h2>
-        <p>{
-          `While it is possible to import all components as named imports from the main module entry point, it is not recommended to do so without using a bundler that supports es6 tree shaking. In other words, if you import the Button component like this:`
+        <p>
+          While it is possible to import all components as named imports from the main module entry point,
+          it is not recommended to do so without using a bundler that supports es6 tree shaking. In other words,
+          if you import the Button component like this:
         }</p>
 
         <div className='ms-GettingStartedPage-code'>
           <Highlight className='typescript'>{ `import { Button } from 'office-ui-fabric-react';` }</Highlight>
         </div>
 
-        <p>{ `...this would work, but then unless you are using a tree-shaking bundler such as Rollup.js or Webpack 2, Webpack will assume you want every module exported from the main entry file to be included in your final bundle, which produces unnecessary large bundles and slows your page load down. Instead you can import the specific paths to trim down your bundle size:` }</p>
+        <p>
+          ...this would work, but then unless you are using a tree-shaking bundler such as Rollup.js or
+          Webpack 2, Webpack will assume you want every module exported from the main entry file to be included
+          in your final bundle, which produces unnecessary large bundles and slows your page load down. Instead
+          you can import the specific paths to trim down your bundle size:
+        </p>
 
         <div className='ms-GettingStartedPage-code'>
-          <Highlight className='typescript'>{
-            `import { Button } from 'office-ui-fabric-react/lib/Button';
+          <Highlight className='typescript'>{ `
+import { Button } from 'office-ui-fabric-react/lib/Button';
 import { Dropdown } from 'office-ui-fabric-react/lib/Dropdown';
 import { List } from 'office-ui-fabric-react/lib/List';`
           }</Highlight>
@@ -79,9 +100,11 @@ import { List } from 'office-ui-fabric-react/lib/List';`
 
         <h2>Using an AMD bundler like r.js</h2>
 
-        <p>{ `
-        If your project relies on AMD modules, they are dropped in the lib-amd folder. You will need to set up your bundler to handle the imports correctly. This may require you to symlink or copy the folder into your pre-bundle location.
-        ` }</p>
+        <p>
+          If your project relies on AMD modules, they are dropped in the lib-amd folder. You will need to set
+          up your bundler to handle the imports correctly. This may require you to symlink or copy the folder
+          into your pre-bundle location.
+        </p>
 
       </div>
     );
diff --git a/packages/experiments/src/demo/index.tsx b/packages/experiments/src/demo/index.tsx
index 46d9405742c73..b23b4d49ec94e 100644
--- a/packages/experiments/src/demo/index.tsx
+++ b/packages/experiments/src/demo/index.tsx
@@ -8,12 +8,16 @@ import { Router, Route } from 'office-ui-fabric-react/lib/utilities/router/index
 import { GettingStartedPage } from './GettingStartedPage';
 import { setBaseUrl } from 'office-ui-fabric-react/lib/Utilities';
 import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
+import { initializeIcons } from '@uifabric/icons/lib/index';
 
 import './index.scss';
 import './ColorStyles.scss';
 
 setBaseUrl('./dist/');
 
+// Initialize all icons.
+initializeIcons('dist/');
+
 let rootElement: HTMLElement | null;
 
 // Return the anchor link from the URL without the hash
diff --git a/packages/experiments/tsconfig.json b/packages/experiments/tsconfig.json
index 9bb24edb7a532..9da053f1acdf5 100644
--- a/packages/experiments/tsconfig.json
+++ b/packages/experiments/tsconfig.json
@@ -19,8 +19,7 @@
       "dom"
     ],
     "types": [
-      "chai",
-      "mocha",
+      "jest",
       "webpack-env"
     ],
     "paths": {
diff --git a/packages/icons/package.json b/packages/icons/package.json
index a4d4323f922f2..2f5e41f7454c4 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -20,10 +20,10 @@
     "jest"
   ],
   "devDependencies": {
-    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0"
+    "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=0.24.1 <1.0.0",
+    "@uifabric/styling": ">=5.0.0 <6.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index a5b89e789a85e..354b747ee6593 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "0.0.1",
+  "version": "5.0.0",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -21,7 +21,7 @@
   ],
   "devDependencies": {
     "@types/jest": "21.1.0",
-    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0"
+    "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react-tslint/package.json b/packages/office-ui-fabric-react-tslint/package.json
index 00662585a66af..492c95ba21a0a 100644
--- a/packages/office-ui-fabric-react-tslint/package.json
+++ b/packages/office-ui-fabric-react-tslint/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react-tslint",
-  "version": "1.0.0",
+  "version": "5.0.0",
   "description": "Shared tslint rules",
   "main": "tslint.json",
   "scripts": {
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index ad7f815bfbeff..891d92cbf5515 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -430,7 +430,7 @@ Fri, 11 Aug 2017 19:38:35 GMT
 - FocusZone: adjusting initialization logic to remove a potential memory leak in server rendered scenarios.
 - ComboBox: Update example to work correctly now that StrictNullChecks have been put in place
 - Nav: update isGroupCollapsed for new groups
-- Change dropdown's role from "combobox" to "menu" 
+- Change dropdown's role from "combobox" to "menu"
 - Changed DatePicker role to be more accurate for screen readers
 - Selection: Fix broken selection state in example.
 
@@ -448,7 +448,7 @@ Tue, 08 Aug 2017 15:28:32 GMT
 
 - BaseButton: Added screenReaderText styles to base button
 - BaseButton: Remove the IconButton dependency that was introduced with SplitButton.
-- Added role alert to "no results" view 
+- Added role alert to "no results" view
 
 ## 4.30.1
 Mon, 07 Aug 2017 10:22:46 GMT
@@ -600,7 +600,7 @@ Fri, 21 Jul 2017 10:21:45 GMT
 
 ### Patches
 
-- Do not redundantly set aria-label on command bar items. 
+- Do not redundantly set aria-label on command bar items.
 - More strict null check fixes in office-ui-fabric-react
 - Textfield: Fixed regression in disabled styles
 - ResizeGroup: Use scrollWidth instead of clientWidth for measuring hidden div
@@ -767,7 +767,7 @@ Fri, 30 Jun 2017 19:44:26 GMT
 ### Patches
 
 - Breadcrumb: Use flexbox for layout to better support multiple font sizes
-- MessageBar: Fixed padding regressions with multiline and no actions 
+- MessageBar: Fixed padding regressions with multiline and no actions
 
 ## 4.13.1
 Fri, 30 Jun 2017 10:23:15 GMT
@@ -821,7 +821,7 @@ Tue, 27 Jun 2017 01:26:31 GMT
 
 ### Minor changes
 
-- Commandbar: fix synchronous reflow 
+- Commandbar: fix synchronous reflow
 - Enhancing the calendar component to allow for turning off the day picker and highlighting the "today" month in the month picker. This will match the behavior of the Timestrip component in today's JSMVVM OWA Calendar.
 
 ### Patches
@@ -1067,7 +1067,7 @@ Tue, 30 May 2017 03:27:20 GMT
 
 ### Patches
 
-- DetailsList: initialFocusedIndex is considered on already mounted rows 
+- DetailsList: initialFocusedIndex is considered on already mounted rows
 - SelectionZone: Update behavior to fix using up/down arrows to navigate between groups in a GroupedList.
 - Introduce prop-types instead of React.PropTypes
 - List: improved measure logic and fix nested list scroll problem
@@ -1386,7 +1386,7 @@ Wed, 19 Apr 2017 03:17:40 GMT
 ### Patches
 
 - DatePicker: Improve screen-reader accessibility.
-- Regression Test: Contextual Menu 
+- Regression Test: Contextual Menu
 - fix nit for Suggestion.tsx
 
 ## 2.19.0
@@ -1550,7 +1550,7 @@ Wed, 29 Mar 2017 18:15:29 GMT
 
 - FocusZone: Adding support for default browser behavior when pressing alt + a key.
 - Chaning scss imports to use typescript `import` instead of `require` so that lib-amd build actually imports via AMD require and not commonjs require.
-- PeoplePicker: Adding changes for multiple selection onChange 
+- PeoplePicker: Adding changes for multiple selection onChange
 
 ## 2.10.1
 Wed, 29 Mar 2017 15:10:15 GMT
@@ -1663,7 +1663,7 @@ Thu, 16 Mar 2017 03:05:54 GMT
 ### Minor changes
 
 - DocumentCard: Add aria role and keyboard handling
-- Panel: Added sticky footer section and broke each panel region into seperate onRender fucntion. 
+- Panel: Added sticky footer section and broke each panel region into seperate onRender fucntion.
 
 ### Patches
 
@@ -1739,7 +1739,7 @@ Thu, 09 Mar 2017 06:11:07 GMT
 
 ### Breaking changes
 
-- IMPORTANT: 
+- IMPORTANT:
 
 This pull request converts ALL components over to use module css. What does this mean?
 
@@ -1757,7 +1757,7 @@ Problems that still exist:
 4. The bundles themselves have a lot of duplicate css. Because we generate rtl rules and theme tokens at build time rather than at runtime, we must download extra code, which bulks up the download size.
 5. Fabric core rules, which we implicitly rely on, are a hard thing to chase. If your page depends on core 6, and you're also using react components, you will find bugs. We'd like to eliminate this dependency so that it is reliable and contractual to use components. If you use a `ContextualMenu`, it should animate without depending on fabric-core css to be loaded.
 
-We are planning to address these and evaluating library options. Issue being tracked here: #983 
+We are planning to address these and evaluating library options. Issue being tracked here: #983
 
 
 ### Minor changes
@@ -2172,7 +2172,7 @@ Thu, 12 Jan 2017 04:06:30 GMT
 - DetailsList: when adding new items in a grouped DetailsList scenario, the group is no longer recreated.
 - Dialog: Removing deprecated rootProps usage for the close button.
 - Persona: Set an explicit height for the image area and image.
-- Persona now has a default way of generating initials and colors 
+- Persona now has a default way of generating initials and colors
 - Pivot: Fix a11y - duplicate tabIds, aria-controls linking
 - TextField: aria-describedby is only set when a description is available.
 
@@ -2437,7 +2437,7 @@ Mon, 05 Dec 2016 04:02:30 GMT
 
 ### Minor changes
 
-- Nav: adding support for `selectedKey`. 
+- Nav: adding support for `selectedKey`.
 
 ### Patches
 
diff --git a/packages/office-ui-fabric-react/config/pre-copy.json b/packages/office-ui-fabric-react/config/pre-copy.json
index 5a7270ad2fa15..ac951e3654eea 100644
--- a/packages/office-ui-fabric-react/config/pre-copy.json
+++ b/packages/office-ui-fabric-react/config/pre-copy.json
@@ -1,6 +1,7 @@
 {
   "copyTo": {
     "dist": [
+      "../icons/fonts/*",
       "index.html"
     ],
     "dist/sass": [
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 8860a5468b9b2..92c15b32c45c9 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "4.51.0",
+  "version": "5.0.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -16,7 +16,7 @@
   },
   "devDependencies": {
     "@types/chai": "3.4.35",
-    "@types/enzyme": "2.8.0",
+    "@types/enzyme": "2.8.8",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "2.2.39",
     "@types/prop-types": "15.5.1",
@@ -26,25 +26,27 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=4.2.7 <5.0.0",
-    "enzyme": "^2.7.0",
+    "@uifabric/example-app-base": ">=5.0.0 <6.0.0",
+    "enzyme": "^2.9.1",
     "es6-promise": "^4.1.0",
-    "es6-weak-map": "^2.0.2",
     "es6-map": "^0.1.5",
+    "es6-weak-map": "^2.0.2",
     "highlight.js": "^9.6.0",
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
-    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
-    "react": "^15.4.2",
+    "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
+    "react": "^15.6.1",
     "react-addons-test-utils": "^15.4.2",
-    "react-dom": "^15.4.2",
+    "react-dom": "^15.6.1",
     "react-highlight": "0.9.0",
     "resemblejs": "~2.2.3",
     "sinon": "^2.3.2"
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=4.16.0 <5.0.0",
-    "@uifabric/styling": ">=0.24.2 <1.0.0",
+    "@uifabric/icons": ">=5.0.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.0.0 <6.0.0",
+    "@uifabric/styling": ">=5.0.0 <6.0.0",
+    "@uifabric/utilities": ">=5.0.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/src/common/tests.ts b/packages/office-ui-fabric-react/src/common/tests.ts
index 13fa7bc7d3b38..d95d963745d8b 100644
--- a/packages/office-ui-fabric-react/src/common/tests.ts
+++ b/packages/office-ui-fabric-react/src/common/tests.ts
@@ -2,6 +2,10 @@
 import 'es6-weak-map/implement';
 import 'es6-map/implement';
 
+import { initializeIcons } from '@uifabric/icons/lib/index';
+console.log('initializing icons');
+initializeIcons('dist/');
+
 /**
  * This is a test entry point to help karma-webpack find all tests in the project.
  **/
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.classNames.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.classNames.ts
new file mode 100644
index 0000000000000..00a5a93b7c973
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.classNames.ts
@@ -0,0 +1,66 @@
+import {
+  mergeStyles,
+  ITheme,
+  getTheme
+} from '../../Styling';
+import {
+  memoizeFunction
+} from '../../Utilities';
+import { IActivityItemStyles } from './ActivityItem.Props';
+import { IPersonaProps } from '../../Persona';
+
+export interface IActivityItemClassNames {
+  root?: string;
+  activityContent?: string;
+  activityText?: string;
+  personaContainer?: string;
+  activityPersona?: string;
+  activityTypeIcon?: string;
+  commentText?: string;
+  timeStamp?: string;
+}
+
+export const getClassNames = memoizeFunction((
+  styles: IActivityItemStyles,
+  className: string,
+  activityPersonas: Array<IPersonaProps>,
+  isCompact: boolean
+): IActivityItemClassNames => {
+  return {
+    root: mergeStyles(
+      'ms-ActivityItem',
+      className,
+      styles.root,
+      isCompact && styles.isCompactRoot
+    ) as string,
+
+    personaContainer: mergeStyles(
+      'ms-ActivityItem-personaContainer',
+      styles.personaContainer,
+      isCompact && styles.isCompactPersonaContainer
+    ) as string,
+
+    activityPersona: mergeStyles(
+      'ms-ActivityItem-activityPersona',
+      styles.activityPersona,
+      isCompact && styles.isCompactPersona,
+      !isCompact && activityPersonas && activityPersonas.length === 2 && styles.doublePersona
+    ) as string,
+
+    activityTypeIcon: mergeStyles(
+      'ms-ActivityItem-activityTypeIcon',
+      styles.activityTypeIcon,
+      isCompact && styles.isCompactIcon
+    ) as string,
+
+    activityContent: mergeStyles(
+      'ms-ActivityItem-activityContent',
+      styles.activityContent,
+      isCompact && styles.isCompactContent
+    ) as string,
+
+    activityText: mergeStyles('ms-ActivityItem-activityText', styles.activityText) as string,
+    commentText: mergeStyles('ms-ActivityItem-commentText', styles.commentText) as string,
+    timeStamp: mergeStyles('ms-ActivityItem-timeStamp', styles.timeStamp) as string
+  };
+});
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
index ded6fee6be5a7..6b4f289e502d8 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
@@ -1,5 +1,5 @@
 import {
-  mergeStyleSets,
+  concatStyleSets,
   ITheme,
   getTheme
 } from '../../Styling';
@@ -15,9 +15,9 @@ const COMPACT_ICON_SIZE = '13px';
 
 export const getStyles = memoizeFunction((
   theme: ITheme = getTheme(),
-  customStyles: IActivityItemStyles | undefined = undefined
+  customStyles?: IActivityItemStyles
 ): IActivityItemStyles => {
-  let ActivityItemStyles = {
+  let ActivityItemStyles: IActivityItemStyles = {
 
     root: [
       theme.fonts.small,
@@ -73,8 +73,10 @@ export const getStyles = memoizeFunction((
     },
 
     doublePersona: {
-      '&:first-child': {
-        alignSelf: 'flex-end'
+      selectors: {
+        ':first-child': {
+          alignSelf: 'flex-end'
+        }
       }
     },
 
@@ -108,11 +110,11 @@ export const getStyles = memoizeFunction((
     timeStamp: [
       theme.fonts.tiny,
       {
-        fontWeight: '400',
+        fontWeight: 400,
         color: theme.palette.neutralSecondary
       }
     ]
   };
 
-  return mergeStyleSets(ActivityItemStyles, customStyles)!;
+  return concatStyleSets(ActivityItemStyles, customStyles);
 });
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
index c0c54dda69ba8..cc1a080795641 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
@@ -2,25 +2,15 @@
 import * as React from 'react';
 /* tslint:enable */
 
-import { autobind, BaseComponent, memoize } from '../../Utilities';
+import { autobind, BaseComponent } from '../../Utilities';
 import { IActivityItemProps, IActivityItemStyles } from './ActivityItem.Props';
 import { mergeStyles } from '../../Styling';
+import { IActivityItemClassNames, getClassNames } from './ActivityItem.classNames';
 import { getStyles } from './ActivityItem.styles';
 import { PersonaSize } from 'office-ui-fabric-react/lib/Persona';
 import { PersonaCoin } from 'office-ui-fabric-react/lib/PersonaCoin';
 import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
 
-export interface IActivityItemClassNames {
-  root?: string;
-  activityContent?: string;
-  activityText?: string;
-  personaContainer?: string;
-  activityPersona?: string;
-  activityTypeIcon?: string;
-  commentText?: string;
-  timeStamp?: string;
-}
-
 export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
   private _classNames: IActivityItemClassNames;
   private _styles: IActivityItemStyles;
@@ -39,7 +29,7 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
     } = this.props;
 
     this._styles = getStyles(undefined, customStyles);
-    this._classNames = this._getClassNames(
+    this._classNames = getClassNames(
       this._styles,
       this.props.className!,
       this.props.activityPersonas!,
@@ -140,45 +130,4 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
     return personaElement;
   }
 
-  // Determine what classNames each element needs
-  @memoize
-  private _getClassNames(styles: IActivityItemStyles, className: string, activityPersonas: Array<IPersonaProps>, isCompact: boolean): IActivityItemClassNames {
-    return {
-      root: mergeStyles(
-        'ms-ActivityItem',
-        styles.root,
-        className,
-        isCompact && styles.isCompactRoot
-      ) as string,
-
-      personaContainer: mergeStyles(
-        'ms-ActivityItem-personaContainer',
-        styles.personaContainer,
-        isCompact && styles.isCompactPersonaContainer
-      ) as string,
-
-      activityPersona: mergeStyles(
-        'ms-ActivityItem-activityPersona',
-        styles.activityPersona,
-        isCompact && styles.isCompactPersona,
-        !isCompact && activityPersonas && activityPersonas.length === 2 && styles.doublePersona
-      ) as string,
-
-      activityTypeIcon: mergeStyles(
-        'ms-ActivityItem-activityTypeIcon',
-        styles.activityTypeIcon,
-        isCompact && styles.isCompactIcon
-      ) as string,
-
-      activityContent: mergeStyles(
-        'ms-ActivityItem-activityContent',
-        styles.activityContent,
-        isCompact && styles.isCompactContent
-      ) as string,
-
-      activityText: mergeStyles('ms-ActivityItem-activityText', styles.activityText) as string,
-      commentText: mergeStyles('ms-ActivityItem-commentText', styles.commentText) as string,
-      timeStamp: mergeStyles('ms-ActivityItem-timeStamp', styles.timeStamp) as string
-    };
-  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.styles.ts
index 595dd6b173cbd..2217334d43984 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.styles.ts
@@ -1,7 +1,7 @@
 import { IButtonStyles } from '../Button.Props';
 import {
   ITheme,
-  mergeStyleSets
+  concatStyleSets
 } from '../../../Styling';
 import { memoizeFunction } from '../../../Utilities';
 import {
@@ -13,14 +13,11 @@ const DEFAULT_PADDING = '0 4px';
 
 export const getStyles = memoizeFunction((
   theme: ITheme,
-  customStyles?: IButtonStyles,
-  focusInset?: string,
-  focusColor?: string
+  customStyles?: IButtonStyles
 ): IButtonStyles => {
   let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
   let actionButtonStyles: IButtonStyles = {
     root: {
-      borderWidth: '0',
       padding: DEFAULT_PADDING,
       height: DEFAULT_BUTTON_HEIGHT,
       color: theme.palette.neutralPrimary,
@@ -29,9 +26,6 @@ export const getStyles = memoizeFunction((
 
     rootHovered: {
       color: theme.palette.themePrimary,
-      icon: {
-        color: theme.palette.themePrimary
-      }
     },
 
     iconHovered: {
@@ -77,9 +71,13 @@ export const getStyles = memoizeFunction((
 
     menuIcon: {
       color: theme.palette.neutralSecondary
+    },
+
+    textContainer: {
+      flexGrow: 0
     }
 
   };
 
-  return mergeStyleSets(baseButtonStyles, actionButtonStyles, customStyles)!;
+  return concatStyleSets(baseButtonStyles, actionButtonStyles, customStyles)!;
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx b/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx
index 65b85a0cf0188..198c99cf1a32f 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx
@@ -4,7 +4,7 @@ import { BaseComponent, customizable, nullRender } from '../../../Utilities';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './ActionButton.styles';
 
-@customizable(['theme'])
+@customizable('ActionButton', ['theme'])
 export class ActionButton extends BaseComponent<IButtonProps, {}> {
 
   /**
@@ -24,4 +24,4 @@ export class ActionButton extends BaseComponent<IButtonProps, {}> {
       />
     );
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
index 63f9590df28d9..23cfd71b13dff 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
@@ -18,6 +18,7 @@ export const getClassNames = memoizeFunction((
   className: string,
   variantClassName: string,
   iconClassName: string | undefined,
+  menuIconClassName: string | undefined,
   disabled: boolean,
   checked: boolean,
   expanded: boolean
@@ -36,28 +37,35 @@ export const getClassNames = memoizeFunction((
         'is-expanded',
         styles.rootExpanded,
         {
-          ':hover .ms-Button-icon': styles.iconExpandedHovered,
-          ':hover': styles.rootExpandedHovered
+          selectors: {
+            ':hover .ms-Button-icon': styles.iconExpandedHovered,
+            ':hover': styles.rootExpandedHovered
+          }
         }
       ],
       disabled && [
         'is-disabled',
         styles.rootDisabled
       ],
-      !disabled && !expanded && {
-        ':hover': styles.rootHovered,
-        ':hover .ms-Button-icon': styles.iconHovered,
-        ':hover .ms-Button-description': styles.descriptionHovered,
-        ':focus': styles.rootFocused,
-        ':active': styles.rootPressed,
-        ':active .ms-Button-description': styles.descriptionPressed
+      !disabled && !expanded && !checked && {
+        selectors: {
+          ':hover': styles.rootHovered,
+          ':hover .ms-Button-icon': styles.iconHovered,
+          ':hover .ms-Button-description': styles.descriptionHovered,
+          ':focus': styles.rootFocused,
+          ':active': styles.rootPressed,
+          ':active .ms-Button-icon': styles.iconPressed,
+          ':active .ms-Button-description': styles.descriptionPressed
+        }
       },
       disabled && checked && [
         styles.rootCheckedDisabled
       ],
       !disabled && checked && {
-        ':hover': styles.rootCheckedHovered,
-        ':active': styles.rootCheckedPressed
+        selectors: {
+          ':hover': styles.rootCheckedHovered,
+          ':active': styles.rootCheckedPressed
+        }
       }
     ) as string,
 
@@ -89,6 +97,7 @@ export const getClassNames = memoizeFunction((
 
     menuIcon: mergeStyles(
       'ms-Button-menuIcon',
+      menuIconClassName,
       styles.menuIcon,
       checked && styles.menuIconChecked,
       disabled && styles.menuIconDisabled
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
index 1f4ed23adb359..97940f456bcea 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
@@ -2,11 +2,13 @@ import { IButtonStyles } from './Button.Props';
 import { memoizeFunction } from '../../Utilities';
 import {
   ITheme,
+  IRawStyle,
   getFocusStyle,
-  FontSizes
+  FontSizes,
+  hiddenContentStyle
 } from '../../Styling';
 
-const noOutline = {
+const noOutline: IRawStyle = {
   outline: 0
 };
 
@@ -25,14 +27,12 @@ const iconStyle = {
  * mixing class names together.
  */
 export const getStyles = memoizeFunction((
-  theme: ITheme,
-  focusInset: string = '0',
-  focusColor: string = theme.palette.neutralSecondary
+  theme: ITheme
 ): IButtonStyles => {
 
   return {
     root: [
-      getFocusStyle(theme, focusInset, focusColor),
+      getFocusStyle(theme, -1),
       theme.fonts.medium,
       {
         // this transparent border converts to the correct colors in HC mode
@@ -53,8 +53,18 @@ export const getStyles = memoizeFunction((
       color: theme.palette.neutralTertiary,
       cursor: 'default',
       pointerEvents: 'none',
-      ':hover': noOutline,
-      ':focus': noOutline
+      selectors: {
+        ':hover': noOutline,
+        ':focus': noOutline
+      }
+    },
+
+    iconDisabled: {
+      color: theme.palette.neutralTertiary
+    },
+
+    menuIconDisabled: {
+      color: theme.palette.neutralTertiary
     },
 
     flexContainer: {
@@ -66,7 +76,7 @@ export const getStyles = memoizeFunction((
     },
 
     textContainer: {
-      flexGrow: '1'
+      flexGrow: 1
     },
 
     icon: iconStyle,
@@ -82,5 +92,7 @@ export const getStyles = memoizeFunction((
       margin: '0 4px',
       lineHeight: '100%'
     },
+
+    screenReaderText: hiddenContentStyle
   };
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 72090c31beb56..c866c7bc835e0 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -10,7 +10,6 @@ import {
   getNativeProps,
   KeyCodes
 } from '../../Utilities';
-import { mergeStyles, hideText } from '../../Styling';
 import { Icon, IIconProps } from '../../Icon';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { ContextualMenu, IContextualMenuProps } from '../../ContextualMenu';
@@ -61,12 +60,8 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     );
 
     this._warnDeprecations({
-      rootProps: undefined,
-      icon: 'iconProps',
-      menuIconName: 'menuIconProps',
-      toggled: 'checked'
+      rootProps: undefined
     });
-
     this._labelId = getId();
     this._descriptionId = getId();
     this._ariaDescriptionId = getId();
@@ -84,17 +79,21 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       disabled,
       href,
       iconProps,
+      menuIconProps,
       styles,
       text,
       checked,
       variantClassName
          } = this.props;
 
+    let { menuProps } = this.state;
+
     this._classNames = getClassNames(
       styles!,
       className!,
       variantClassName!,
       iconProps && iconProps.className,
+      menuIconProps && menuIconProps.className,
       disabled!,
       checked!,
       !!this.state.menuProps && !this.props.split
@@ -142,15 +141,12 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       }
     }
 
-    const tabIndex = (this.props.tabIndex === undefined) ? (this._isSplitButton ? -1 : 0) : this.props.tabIndex;
-
     const buttonProps = assign(
       nativeProps,
       {
         className: this._classNames.root,
         ref: this._resolveRef('_buttonElement'),
         'disabled': disabled,
-        tabIndex: tabIndex,
         'aria-label': ariaLabel,
         'aria-labelledby': ariaLabelledBy,
         'aria-describedby': ariaDescribedBy,
@@ -191,7 +187,6 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   private _onRenderContent(tag: any, buttonProps: IButtonProps): JSX.Element {
     let props = this.props;
     let {
-      menuIconName,
       menuIconProps,
       menuProps,
       onRenderIcon = this._onRenderIcon,
@@ -211,7 +206,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         this._onRenderTextContents(),
         onRenderAriaDescription(props, this._onRenderAriaDescription),
         onRenderChildren(props, this._onRenderChildren),
-        !this._isSplitButton && (menuProps || menuIconName || menuIconProps || this.props.onRenderMenuIcon) && onRenderMenuIcon(this.props, this._onRenderMenuIcon),
+        !this._isSplitButton && (menuProps || menuIconProps || this.props.onRenderMenuIcon) && onRenderMenuIcon(this.props, this._onRenderMenuIcon),
         this.state.menuProps && onRenderMenu(menuProps, this._onRenderMenu)
       ));
   }
@@ -219,16 +214,9 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   @autobind
   private _onRenderIcon(buttonProps?: IButtonProps, defaultRender?: IRenderFunction<IButtonProps>): JSX.Element | null {
     let {
-      icon,
       iconProps
        } = this.props;
 
-    if (icon || iconProps) {
-      iconProps = iconProps || {
-        iconName: icon
-      } as IIconProps;
-    }
-
     if (iconProps) {
       return Icon({
         ...iconProps,
@@ -328,14 +316,13 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   @autobind
   private _onRenderAriaDescription() {
     const {
-     ariaDescription,
-      styles
-     } = this.props;
+      ariaDescription
+    } = this.props;
 
     // If ariaDescription is given, descriptionId will be assigned to ariaDescriptionSpan,
     // otherwise it will be assigned to descriptionSpan.
     return ariaDescription ? (
-      <span className={ `${styles!.screenReaderText || mergeStyles(hideText)}` } id={ this._ariaDescriptionId }>{ ariaDescription }</span>
+      <span className={ this._classNames.screenReaderText as string } id={ this._ariaDescriptionId }>{ ariaDescription }</span>
     ) : (
         null
       );
@@ -344,26 +331,17 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   @autobind
   private _onRenderMenuIcon(props: IButtonProps): JSX.Element | null {
     let {
-      menuIconName,
       menuIconProps
-       } = this.props;
-
-    if (menuIconProps === undefined) {
-      menuIconProps = {
-        iconName: menuIconName === undefined ? 'ChevronDown' : menuIconName
-      };
-    }
+    } = this.props;
 
     return (
-      menuIconProps ?
-        (
-          <Icon
-            { ...menuIconProps }
-            className={ this._classNames.menuIcon }
-          />
-        )
-        :
-        null
+
+      <Icon
+        iconName='ChevronDown'
+        { ...menuIconProps }
+        className={ this._classNames.menuIcon }
+      />
+
     );
   }
 
@@ -391,7 +369,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
 
   private _onRenderSplitButtonContent(tag: any, buttonProps: IButtonProps): JSX.Element {
     const {
-      styles,
+      styles = {},
       disabled,
       checked
     } = this.props;
@@ -407,17 +385,19 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         aria-pressed={ this.props.checked }
         aria-describedby={ buttonProps.ariaDescription }
         className={ classNames && classNames.splitButtonContainer }
-        tabIndex={ 0 }
-        onKeyDown={ this.props.disabled ? undefined : this._onSplitButtonKeyDown }
+        onKeyDown={ this._onSplitButtonKeyDown }
         ref={ this._resolveRef('_splitButtonContainer') }
       >
-
-        <span aria-hidden={ true } style={ { 'display': 'flex' } }>
+        <span
+          aria-hidden={ true }
+          // TODO: THIS SHOULD BE REMOVED!
+          style={ { 'display': 'flex' } }
+        >
           { this._onRenderContent(tag, buttonProps) }
-          { this._onRenderSplitButtonDivider(classNames) }
           { this._onRenderSplitButtonMenuButton(classNames) }
+          { this._onRenderSplitButtonDivider(classNames) }
         </span>
-      </div >
+      </div>
     );
   }
 
@@ -430,19 +410,16 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
 
   private _onRenderSplitButtonMenuButton(classNames: ISplitButtonClassNames | undefined): JSX.Element {
     let {
-      menuIconName,
       menuIconProps
     } = this.props;
 
     if (menuIconProps === undefined) {
       menuIconProps = {
-        iconName: menuIconName === undefined ? 'ChevronDown' : menuIconName
+        iconName: 'ChevronDown'
       };
     }
-
     return (
       <BaseButton
-        tabIndex={ -1 }
         styles={ classNames }
         checked={ this.props.checked }
         disabled={ this.props.disabled }
@@ -455,19 +432,11 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
 
   @autobind
   private _onSplitButtonKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
-    switch (ev.which) {
-      case KeyCodes.enter:
-      case KeyCodes.space:
-        (this.props.onClick as any)(null);
-        return;
+    if (ev.which === KeyCodes.down) {
+      this._onToggleMenu();
+      ev.preventDefault();
+      ev.stopPropagation();
     }
 
-    if (ev.altKey) {
-      switch (ev.which) {
-        case KeyCodes.down:
-          this._onToggleMenu();
-          return;
-      }
-    }
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
index 87d970bff22a2..682ed727db1a7 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
@@ -3,7 +3,7 @@ import { BaseButton } from './BaseButton';
 import { Button } from './Button';
 import { IRenderFunction } from '../../Utilities';
 import { IContextualMenuProps } from '../../ContextualMenu';
-import { IIconProps, IconName } from '../../Icon';
+import { IIconProps } from '../../Icon';
 import { IStyle, ITheme } from '../../Styling';
 
 export interface IButton {
@@ -162,20 +162,7 @@ export interface IButtonProps extends React.AllHTMLAttributes<HTMLAnchorElement
   rootProps?: React.ButtonHTMLAttributes<HTMLButtonElement> | React.AnchorHTMLAttributes<HTMLAnchorElement>;
 
   /**
-   * Deprecated on 4/15/2017, use iconProps={ { iconName: 'Emoji2' } }.
-   * @deprecated
-   */
-  icon?: string;
-
-  /**
-   * Deprecated on 4/15/2017, use menuIconProps={ { iconName: 'Emoji2' } }.
-   * @deprecated
-   */
-  menuIconName?: IconName | string | null;
-
-  /**
-   * Deprecated on 5/26/2016, use checked.
-   * @deprecated
+   * Any custom data the developer wishes to associate with the menu item.
    */
   toggled?: boolean;
 
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
index 66c5bd5c397bd..ed2bb1f9857d2 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
@@ -296,12 +296,13 @@ describe('DefaultButton', () => {
           } }
         />
       );
-      const menuButtonDOM: HTMLButtonElement = renderedDOM.getElementsByClassName('ms-Button--default')[0] as HTMLButtonElement;
+      const menuButtonDOM: HTMLButtonElement = renderedDOM.querySelectorAll('button')[0];
+
       ReactTestUtils.Simulate.click(menuButtonDOM);
       expect(didClick).to.equal(true);
     });
 
-    it('Pressing Enter on SplitButton triggers action', () => {
+    it('Pressing down on SplitButton triggers menu', () => {
       const renderedDOM: HTMLElement = renderIntoDocument(
         <DefaultButton
           data-automation-id='test'
@@ -324,79 +325,14 @@ describe('DefaultButton', () => {
           } }
         />
       );
-      const splitButtonDOM = ReactDOM.findDOMNode(renderedDOM as React.ReactInstance);
-      ReactTestUtils.Simulate.keyDown(splitButtonDOM,
-        {
-          which: KeyCodes.enter
-        });
-      expect(didClick).to.equal(true);
-    });
 
-    it('Pressing Alt+Down on SplitButton triggers menu', () => {
-      const renderedDOM: HTMLElement = renderIntoDocument(
-        <DefaultButton
-          data-automation-id='test'
-          text='Create account'
-          split={ true }
-          onClick={ setTrue }
-          menuProps={ {
-            items: [
-              {
-                key: 'emailMessage',
-                name: 'Email message',
-                icon: 'Mail'
-              },
-              {
-                key: 'calendarEvent',
-                name: 'Calendar event',
-                icon: 'Calendar'
-              }
-            ]
-          } }
-        />
-      );
-      const splitButtonDOM = ReactDOM.findDOMNode(renderedDOM as React.ReactInstance);
-      ReactTestUtils.Simulate.focus(splitButtonDOM);
-      ReactTestUtils.Simulate.keyDown(splitButtonDOM,
-        {
-          altKey: true,
-          which: KeyCodes.down
-        });
-      expect(renderedDOM.getAttribute('aria-expanded')).to.equal('true');
-    });
+      const menuButtonElement = renderedDOM.querySelectorAll('button')[1];
 
-    it('A disabled SplitButton does not respond to key presses', () => {
-      const renderedDOM: HTMLElement = renderIntoDocument(
-        <DefaultButton
-          disabled={ true }
-          data-automation-id='test'
-          text='Create account'
-          split={ true }
-          onClick={ setTrue }
-          menuProps={ {
-            items: [
-              {
-                key: 'emailMessage',
-                name: 'Email message',
-                icon: 'Mail'
-              },
-              {
-                key: 'calendarEvent',
-                name: 'Calendar event',
-                icon: 'Calendar'
-              }
-            ]
-          } }
-        />
-      );
-      const splitButtonDOM = ReactDOM.findDOMNode(renderedDOM as React.ReactInstance);
-      ReactTestUtils.Simulate.focus(splitButtonDOM);
-      ReactTestUtils.Simulate.keyDown(splitButtonDOM,
+      ReactTestUtils.Simulate.keyDown(menuButtonElement,
         {
-          altKey: true,
           which: KeyCodes.down
         });
-      expect(renderedDOM.getAttribute('aria-expanded')).to.equal('false');
+      expect(renderedDOM.getAttribute('aria-expanded')).to.equal('true');
     });
 
     it('A disabled SplitButton does not respond to clicks', () => {
@@ -423,8 +359,9 @@ describe('DefaultButton', () => {
           } }
         />
       );
-      const menuButtonDOM: HTMLButtonElement = renderedDOM.getElementsByClassName('ms-Button--default')[0] as HTMLButtonElement;
-      ReactTestUtils.Simulate.click(menuButtonDOM);
+      const buttonElement = renderedDOM.querySelectorAll('button')[0];
+
+      ReactTestUtils.Simulate.click(buttonElement);
       expect(didClick).to.equal(false);
     });
   });
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.tsx b/packages/office-ui-fabric-react/src/components/Button/Button.tsx
index e2664a1339a58..7c559dbce36be 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.tsx
@@ -5,7 +5,7 @@ import * as React from 'react';
 import { BaseComponent, warn } from '../../Utilities';
 import { ButtonType, IButtonProps } from './Button.Props';
 import { DefaultButton } from './DefaultButton/DefaultButton';
-import { CommandButton } from './CommandButton/CommandButton';
+import { ActionButton } from './ActionButton/ActionButton';
 import { CompoundButton } from './CompoundButton/CompoundButton';
 import { IconButton } from './IconButton/IconButton';
 import { PrimaryButton } from './PrimaryButton/PrimaryButton';
@@ -24,7 +24,7 @@ export class Button extends BaseComponent<IButtonProps, {}> {
 
     warn(
       `The Button component has been deprecated. Use specific variants instead. ` +
-      `(PrimaryButton, DefaultButton, IconButton, CommandButton, etc.)`
+      `(PrimaryButton, DefaultButton, IconButton, ActionButton, etc.)`
     );
   }
 
@@ -33,7 +33,7 @@ export class Button extends BaseComponent<IButtonProps, {}> {
 
     switch (props.buttonType) {
       case ButtonType.command:
-        return <CommandButton { ...props } />;
+        return <ActionButton { ...props } />;
 
       case ButtonType.compound:
         return <CompoundButton { ...props } />;
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
index 652c9d1962959..887c06b84a7c9 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
@@ -7,6 +7,7 @@ import {
 } from '@uifabric/example-app-base';
 import { ButtonStatus } from './Button.checklist';
 import { ButtonDefaultExample } from './examples/Button.Default.Example';
+import { ButtonCommandExample } from './examples/Button.Command.Example';
 import { ButtonContextualMenuExample } from './examples/Button.ContextualMenu.Example';
 import { ButtonCompoundExample } from './examples/Button.Compound.Example';
 import { ButtonActionExample } from './examples/Button.Action.Example';
@@ -23,16 +24,36 @@ import './examples/Button.Basic.Example.scss';
 import * as exampleStylesImport from '../../common/_exampleStyles.scss';
 const exampleStyles: any = exampleStylesImport;
 
-const ButtonDefaultExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx') as string;
-const ButtonCompoundExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx') as string;
-const ButtonActionExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx') as string;
-const ButtonCommandBarExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.CommandBar.Example.tsx') as string;
-const ButtonIconExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx') as string;
-const ButtonAnchorExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx') as string;
-const ButtonScreenReaderExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx') as string;
-const ButtonContextualMenuExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.ContextualMenu.Example.tsx') as string;
-const ButtonSwapExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx') as string;
-const ButtonSplitExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx') as string;
+const ButtonDefaultExampleCode = require(
+  '!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx'
+) as string;
+const ButtonCompoundExampleCode = require(
+  '!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx'
+) as string;
+const ButtonActionExampleCode = require(
+  '!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx'
+) as string;
+const ButtonCommandBarExampleCode = require(
+  '!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.CommandBar.Example.tsx'
+) as string;
+const ButtonIconExampleCode = require(
+  '!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx'
+) as string;
+const ButtonAnchorExampleCode = require(
+  '!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx'
+) as string;
+const ButtonScreenReaderExampleCode = require(
+  '!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx'
+) as string;
+const ButtonContextualMenuExampleCode = require(
+  '!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.ContextualMenu.Example.tsx'
+) as string;
+const ButtonSwapExampleCode = require(
+  '!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx'
+) as string;
+const ButtonSplitExampleCode = require(
+  '!raw-loader!office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx'
+) as string;
 
 export interface IButtonDemoPageState {
   areButtonsDisabled?: boolean;
@@ -172,4 +193,4 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
       areButtonsChecked: toggled
     });
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts b/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
index b474c5d699190..047fab19a3445 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
@@ -28,28 +28,37 @@ export function standardStyles(theme: ITheme): IButtonStyles {
       color: theme.palette.neutralDark
     },
 
-    // Split button styles
-    splitButtonContainer: {
-      ':focus': {
-        borderColor: theme.palette.neutralDark
-      }
+    rootCheckedHovered: {
+      backgroundColor: theme.palette.neutralLight,
+      color: theme.palette.black
     },
 
+    // Split button styles
+    splitButtonContainer: {},
+
     splitButtonMenuButton: {
       color: theme.palette.white,
       backgroundColor: theme.palette.neutralLighter,
-      ':hover': {
-        backgroundColor: theme.palette.neutralLight
+      selectors: {
+        ':hover': {
+          backgroundColor: theme.palette.neutralLight
+        }
       },
     },
 
     splitButtonMenuButtonDisabled: {
       backgroundColor: theme.palette.neutralLighter,
-      ':hover': {
-        backgroundColor: theme.palette.neutralLighter,
+      selectors: {
+        ':hover': {
+          backgroundColor: theme.palette.neutralLighter,
+        }
       }
     },
 
+    splitButtonDivider: {
+      backgroundColor: theme.palette.neutralTertiaryAlt
+    },
+
     splitButtonMenuButtonChecked: {
       backgroundColor: theme.palette.themePrimary,
     },
@@ -96,29 +105,33 @@ export function primaryStyles(theme: ITheme): IButtonStyles {
     },
 
     rootCheckedHovered: {
-      backgroundColor: theme.palette.neutralLight,
-      color: theme.palette.black
+      backgroundColor: theme.palette.themePrimary,
+      color: theme.palette.white
     },
 
     // Split button styles
-    splitButtonContainer: {
-      ':focus': {
-        borderColor: theme.palette.neutralDark
-      }
+    splitButtonContainer: {},
+
+    splitButtonDivider: {
+      backgroundColor: theme.palette.themeLighter
     },
 
     splitButtonMenuButton: {
       backgroundColor: theme.palette.themePrimary,
       color: theme.palette.white,
-      ':hover': {
-        backgroundColor: theme.palette.themeDark
+      selectors: {
+        ':hover': {
+          backgroundColor: theme.palette.themeDark
+        }
       },
     },
 
     splitButtonMenuButtonDisabled: {
       backgroundColor: theme.palette.neutralLighter,
-      ':hover': {
-        backgroundColor: theme.palette.neutralLighter,
+      selectors: {
+        ':hover': {
+          backgroundColor: theme.palette.neutralLighter,
+        }
       }
     },
 
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts
index 07eb4282f1baf..1d744441cb720 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts
@@ -1,7 +1,7 @@
 import { IButtonStyles } from '../Button.Props';
 import {
   ITheme,
-  mergeStyleSets
+  concatStyleSets
 } from '../../../Styling';
 import { memoizeFunction } from '../../../Utilities';
 import {
@@ -29,34 +29,22 @@ export const getStyles = memoizeFunction((
 
     rootHovered: {
       backgroundColor: theme.palette.neutralLight,
-      color: theme.palette.neutralDark,
-      icon: {
-        color: theme.palette.themeDark
-      }
+      color: theme.palette.neutralDark
     },
 
     rootPressed: {
       backgroundColor: theme.palette.neutralQuaternaryAlt,
-      color: theme.palette.black,
-      icon: {
-        color: theme.palette.themeDark
-      }
+      color: theme.palette.black
     },
 
     rootChecked: {
       backgroundColor: theme.palette.neutralQuaternaryAlt,
-      color: theme.palette.black,
-      icon: {
-        color: theme.palette.themeDarker
-      }
+      color: theme.palette.black
     },
 
     rootExpanded: {
       backgroundColor: theme.palette.neutralQuaternaryAlt,
-      color: theme.palette.black,
-      icon: {
-        color: theme.palette.themeDark
-      }
+      color: theme.palette.black
     },
 
     rootCheckedHovered: {
@@ -78,5 +66,5 @@ export const getStyles = memoizeFunction((
 
   };
 
-  return mergeStyleSets(baseButtonStyles, commandButtonStyles, baseSplitButtonStyles, customStyles)!;
+  return concatStyleSets(baseButtonStyles, commandButtonStyles, baseSplitButtonStyles, customStyles)!;
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx
index 50f9be9d8e756..bf54a296e3a77 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx
@@ -1,11 +1,10 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
-import { ThemeSettingName } from '../../../Styling';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './CommandBarButton.styles';
 
-@customizable([ThemeSettingName])
+@customizable('CommandBarButton', ['theme'])
 export class CommandBarButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Tell BaseComponent to bypass resolution of componentRef.
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
index f1171f3cd9905..b319f75a3721b 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
@@ -1,7 +1,7 @@
 import { IButtonStyles } from '../Button.Props';
 import {
   ITheme,
-  mergeStyleSets,
+  concatStyleSets,
   FontWeights
 } from '../../../Styling';
 import { memoizeFunction } from '../../../Utilities';
@@ -19,11 +19,9 @@ import {
 export const getStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: IButtonStyles,
-  primary?: boolean,
-  focusInset?: string,
-  focusColor?: string
+  primary?: boolean
 ): IButtonStyles => {
-  let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme, focusInset, focusColor);
+  let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
   let splitButtonStyles: IButtonStyles = getSplitButtonStyles(theme);
   let compoundButtonStyles: IButtonStyles = {
     root: {
@@ -113,7 +111,7 @@ export const getStyles = memoizeFunction((
     }
   };
 
-  return mergeStyleSets(
+  return concatStyleSets(
     baseButtonStyles,
     compoundButtonStyles,
     primary ? primaryStyles(theme) : standardStyles(theme),
@@ -121,4 +119,5 @@ export const getStyles = memoizeFunction((
     splitButtonStyles,
     customStyles
   )!;
+
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
index da106faaece2c..92b4b2557846b 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
@@ -1,11 +1,10 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
 import { BaseComponent, customizable } from '../../../Utilities';
-import { ThemeSettingName } from '../../../Styling';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './CompoundButton.styles';
 
-@customizable([ThemeSettingName])
+@customizable('CompoundButton', ['theme'])
 export class CompoundButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Tell BaseComponent to bypass resolution of componentRef.
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
index 84e7c31524c10..f593760d7e328 100644
--- a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
@@ -1,7 +1,7 @@
 import { IButtonStyles } from '../Button.Props';
 import {
   ITheme,
-  mergeStyleSets,
+  concatStyleSets,
   FontWeights
 } from '../../../Styling';
 import { memoizeFunction } from '../../../Utilities';
@@ -23,11 +23,9 @@ const DEFAULT_BUTTON_MINWIDTH = '80px';
 export const getStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: IButtonStyles,
-  primary?: boolean,
-  focusInset?: string,
-  focusColor?: string,
+  primary?: boolean
 ): IButtonStyles => {
-  let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme, focusInset, focusColor);
+  let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
   let splitButtonStyles: IButtonStyles = getSplitButtonStyles(theme);
   let defaultButtonStyles: IButtonStyles = {
     root: {
@@ -39,7 +37,7 @@ export const getStyles = memoizeFunction((
     }
   };
 
-  return mergeStyleSets(
+  return concatStyleSets(
     baseButtonStyles,
     defaultButtonStyles,
     primary ? primaryStyles(theme) : standardStyles(theme),
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
index 35fe96852dc47..e58f8ae5d8b94 100644
--- a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
@@ -1,11 +1,10 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
-import { ThemeSettingName } from '../../../Styling';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './DefaultButton.styles';
 
-@customizable([ThemeSettingName])
+@customizable('DefaultButton', ['theme'])
 export class DefaultButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Tell BaseComponent to bypass resolution of componentRef.
diff --git a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
index 418aa3d3b62d8..1b70f4dacb931 100644
--- a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
@@ -1,7 +1,7 @@
 import { IButtonStyles } from '../Button.Props';
 import {
   ITheme,
-  mergeStyleSets
+  concatStyleSets
 } from '../../../Styling';
 import { memoizeFunction } from '../../../Utilities';
 import {
@@ -50,5 +50,5 @@ export const getStyles = memoizeFunction((
     }
   };
 
-  return mergeStyleSets(baseButtonStyles, iconButtonStyles, splitButtonStyles, customStyles)!;
+  return concatStyleSets(baseButtonStyles, iconButtonStyles, splitButtonStyles, customStyles)!;
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
index e705cbebf0d55..01baa17402449 100644
--- a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
@@ -1,11 +1,10 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
-import { ThemeSettingName } from '../../../Styling';
 import { IButtonProps } from '../Button.Props';
 import { getStyles } from './IconButton.styles';
 
-@customizable([ThemeSettingName])
+@customizable('IconButton', ['theme'])
 export class IconButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Tell BaseComponent to bypass resolution of componentRef.
diff --git a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
index 4a8c121008bd9..4afad010f9ff4 100644
--- a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
@@ -1,10 +1,9 @@
 import * as React from 'react';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
-import { ThemeSettingName } from '../../../Styling';
 import { DefaultButton } from '../DefaultButton/DefaultButton';
 import { IButtonProps } from '../Button.Props';
 
-@customizable([ThemeSettingName])
+@customizable('PrimaryButton', ['theme'])
 export class PrimaryButton extends BaseComponent<IButtonProps, {}> {
   /**
    * Set this BaseComponent._resolveComponentRef to false, bypassing resolution of componentRef.
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts
index 23dd5906cde21..ccb22835e23ee 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts
@@ -17,6 +17,7 @@ export const getClassNames = memoizeFunction((
   checked: boolean,
 ): ISplitButtonClassNames => {
   return {
+
     root: mergeStyles(
       styles.splitButtonMenuButton,
       expanded && [
@@ -25,13 +26,24 @@ export const getClassNames = memoizeFunction((
       disabled && [
         styles.splitButtonMenuButtonDisabled
       ],
-      checked && [
+      checked && !disabled && [
         styles.splitButtonMenuButtonChecked
       ]
-    ) as string,
-    splitButtonContainer: mergeStyles(styles.splitButtonContainer, disabled && [styles.splitButtonContainerDisabled]) as string,
-    icon: (disabled ? mergeStyles(styles.splitButtonMenuIcon, styles.splitButtonMenuIconDisabled) : styles.splitButtonMenuIcon) as string,
-    flexContainer: styles.splitButtonFlexContainer as string,
-    divider: styles.splitButtonDivider as string
+    ),
+
+    splitButtonContainer: mergeStyles(
+      styles.splitButtonContainer,
+      disabled && styles.splitButtonContainerDisabled
+    ),
+
+    icon: mergeStyles(
+      styles.splitButtonMenuIcon,
+      disabled && styles.splitButtonMenuIconDisabled
+    ),
+
+    flexContainer: mergeStyles(styles.splitButtonFlexContainer),
+
+    divider: mergeStyles(styles.splitButtonDivider)
+
   };
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
index 9259561005bd2..485ec59e9bfcf 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
@@ -1,7 +1,8 @@
 import { IButtonStyles } from '../Button.Props';
 import {
   ITheme,
-  mergeStyleSets
+  mergeStyleSets,
+  getFocusStyle
 } from '../../../Styling';
 import { memoizeFunction } from '../../../Utilities';
 
@@ -14,32 +15,49 @@ export const getStyles = memoizeFunction((
       position: 'relative',
       display: 'inline-block',
       border: '1px solid transparent',
-      ':focus': {
-        outline: 'none!important',
-        border: '1px solid'
+
+      selectors: {
+        ':focus': {
+          outline: 'none!important',
+          border: '1px solid'
+        }
       }
     },
 
-    splitButtonMenuButton: {
-      padding: '6px',
-      height: 'auto',
-      boxSizing: 'border-box',
-      border: '1px solid transparent',
-      outline: 'transparent',
-      userSelect: 'none',
-      display: 'inline-block',
-      textDecoration: 'none',
-      textAlign: 'center',
-      cursor: 'pointer',
-      verticalAlign: 'top',
-      width: '32px'
+    splitButtonMenuButton: [
+      getFocusStyle(theme, -1),
+      {
+        padding: 6,
+        height: 'auto',
+        boxSizing: 'border-box',
+        border: '1px solid transparent',
+        outline: 'transparent',
+        userSelect: 'none',
+        display: 'inline-block',
+        textDecoration: 'none',
+        textAlign: 'center',
+        cursor: 'pointer',
+        verticalAlign: 'top',
+        width: 32,
+        marginLeft: -1
+      }
+    ],
+
+    splitButtonDivider: {
+      position: 'absolute',
+      width: 1,
+      right: 31,
+      top: 8,
+      bottom: 8
     },
 
     splitButtonMenuButtonDisabled: {
-      ':hover': {
-        cursor: 'default'
-      },
       pointerEvents: 'none',
+      selectors: {
+        ':hover': {
+          cursor: 'default'
+        }
+      }
     },
 
     splitButtonFlexContainer: {
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx
index 0a61b3fb88463..c0b570b0fbe54 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx
@@ -25,4 +25,4 @@ export class ButtonActionExample extends React.Component<IButtonProps, any> {
       </div>
     );
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
index 9e87573fd67d1..61366cb3f7e69 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
@@ -17,7 +17,6 @@ export class ButtonAnchorExample extends React.Component<IButtonProps, {}> {
 
     return (
       <div className='ms-BasicButtonsExample'>
-        <Label>Button like anchor</Label>
         <PrimaryButton
           data-automation-id='test'
           disabled={ disabled }
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Command.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Command.Example.tsx
index c241ba99f6f18..6e11b46aafb08 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Command.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Command.Example.tsx
@@ -1,32 +1,43 @@
 import * as React from 'react';
-import {
-  CommandButton,
-  IButtonProps
-} from 'office-ui-fabric-react/lib/Button';
-import {
-  Label
-} from 'office-ui-fabric-react/lib/Label';
-
-export class ButtonCommandExample extends React.Component<IButtonProps, any> {
-  public constructor() {
-    super();
-  }
+import { CommandButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
 
+export class ButtonCommandExample extends React.Component<IButtonProps, {}> {
   public render() {
     let { disabled, checked } = this.props;
 
     return (
-      <div className='ms-BasicButtonsExample'>
-        <Label>Command button</Label>
-        <CommandButton
-          data-automation-id='test'
-          iconProps={ { iconName: 'AddFriend' } }
-          disabled={ disabled }
-          checked={ checked }
-        >
-          Create account
-        </CommandButton>
+      <div>
+        <div style={ { display: 'flex', alignItems: 'stretch', height: '40px' } }>
+          <CommandButton
+            data-automation-id='test'
+            disabled={ disabled }
+            checked={ checked }
+            iconProps={ { iconName: 'Add' } }
+            text='Create account'
+            menuProps={ {
+              items: [
+                {
+                  key: 'emailMessage',
+                  name: 'Email message',
+                  icon: 'Mail'
+                },
+                {
+                  key: 'calendarEvent',
+                  name: 'Calendar event',
+                  icon: 'Calendar'
+                }
+              ]
+            } }
+          />
+          <CommandButton
+            data-automation-id='test2'
+            disabled={ disabled }
+            checked={ checked }
+            iconProps={ { iconName: 'Mail' } }
+            text='Send Mail'
+          />
+        </div>
       </div>
     );
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx
index 8b23e1930ba4c..81f5d267788c3 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx
@@ -12,7 +12,6 @@ export class ButtonIconExample extends React.Component<IButtonProps, {}> {
 
     return (
       <div className='ms-BasicButtonsExample'>
-        <Label>Icon button</Label>
         <IconButton
           disabled={ disabled }
           checked={ checked }
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
new file mode 100644
index 0000000000000..e63bd45b91bb4
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
@@ -0,0 +1,25 @@
+import * as React from 'react';
+import { PrimaryButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
+import { Label } from 'office-ui-fabric-react/lib/Label';
+
+export class ButtonPrimaryExample extends React.Component<IButtonProps, {}> {
+  public constructor() {
+    super();
+  }
+
+  public render() {
+    let { disabled, checked } = this.props;
+
+    return (
+      <div className='ms-BasicButtonsExample'>
+        <PrimaryButton
+          data-automation-id='test'
+          disabled={ disabled }
+          checked={ checked }
+          text='Create account'
+          onClick={ () => alert('Clicked') }
+        />
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx
index 0c3a1a2180a08..b674b219b7ba5 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx
@@ -12,7 +12,6 @@ export class ButtonScreenReaderExample extends React.Component<IButtonProps, {}>
 
     return (
       <div className='ms-BasicButtonsExample'>
-        <Label>Button with aria description for screen reader</Label>
         <PrimaryButton
           data-automation-id='test'
           disabled={ disabled }
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.styles.ts b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.styles.ts
index 3ecab1824cced..569bcc1691d05 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.styles.ts
@@ -5,6 +5,6 @@ export const getCustomSplitButtonStyles = memoizeFunction((): IButtonStyles => {
   return {
     splitButtonMenuButton: { backgroundColor: 'white', width: '10px' },
     splitButtonMenuIcon: { fontSize: '7px' },
-    splitButtonDivider: { borderLeft: '1px solid #c8c8c8' }
+    splitButtonDivider: { borderLeft: '1px solid #c8c8c8', right: 12 }
   };
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
index 4b3afbfe7c54e..b325ddef4f660 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
@@ -91,7 +91,7 @@ export class ButtonSplitCustomExample extends React.Component<IButtonProps, {}>
           data-automation-id='test'
           disabled={ disabled }
           checked={ checked }
-          iconProps={ { iconName: 'Emoji2' } }
+          iconProps={ { iconName: 'Upload' } }
           text='Create account'
           onClick={ alertClicked }
           split={ true }
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
index fd26c26fd108b..8ec2442a31908 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
@@ -67,7 +67,6 @@ export class ButtonSwapExample extends React.Component<IButtonProps, IButtonSwap
 
     return (
       <div className='ms-BasicButtonsExample'>
-        <Label>Click to swap button types</Label>
         { button }
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Button/index.ts b/packages/office-ui-fabric-react/src/components/Button/index.ts
index 56972890a0374..a690e69219e52 100644
--- a/packages/office-ui-fabric-react/src/components/Button/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/index.ts
@@ -6,5 +6,6 @@ export * from './CommandBarButton/CommandBarButton';
 export * from './CommandButton/CommandButton';
 export * from './CompoundButton/CompoundButton';
 export * from './DefaultButton/DefaultButton';
+export * from './CommandButton/CommandButton';
 export * from './PrimaryButton/PrimaryButton';
 export * from './IconButton/IconButton';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index 5f5e0fd3f2ccf..33b7232cb39e9 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -154,7 +154,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
               styles.root,
               className,
               directionalClassName,
-              calloutWidth && { width: calloutWidth }
+              !!calloutWidth && { width: calloutWidth }
             ) as string }
           style={ positions ? positions.calloutPosition : OFF_SCREEN_STYLE }
           tabIndex={ -1 } // Safari and Firefox on Mac OS requires this to back-stop click events so focus remains in the Callout.
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.classNames.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.classNames.ts
new file mode 100644
index 0000000000000..599c7f4b14651
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.classNames.ts
@@ -0,0 +1,76 @@
+import { memoizeFunction } from '../../Utilities';
+import { mergeStyles } from '../../Styling';
+import { ICheckboxStyles } from './Checkbox.Props';
+
+export interface ICheckboxClassNames {
+  root: string;
+  label: string;
+  checkbox: string;
+  checkmark: string;
+  text: string;
+}
+
+export const getClassNames = memoizeFunction((
+  styles: ICheckboxStyles,
+  className: string,
+  disabled: boolean,
+  isChecked: boolean,
+  isReversed: boolean
+): ICheckboxClassNames => {
+  return {
+    root: mergeStyles(
+      'ms-Checkbox',
+      isReversed && 'reversed',
+      isChecked && 'is-checked',
+      !disabled && 'is-enabled',
+      disabled && 'is-disabled',
+      className,
+      styles.root,
+      !disabled && [
+        !isChecked && {
+          selectors: {
+            ':hover .ms-Checkbox-checkbox': styles.checkboxHovered
+          }
+        },
+        isChecked && {
+          selectors: {
+            ':hover .ms-Checkbox-checkbox': styles.checkboxCheckedHovered
+          }
+        },
+        {
+          selectors: {
+            ':hover .ms-Checkbox-text': styles.textHovered
+          }
+        }
+      ]
+    ) as string,
+
+    label: mergeStyles(
+      'ms-Checkbox-label',
+      styles.label,
+      isReversed && styles.labelReversed,
+      disabled && styles.labelDisabled
+    ) as string,
+
+    checkbox: mergeStyles(
+      'ms-Checkbox-checkbox',
+      styles.checkbox,
+      !disabled && isChecked && styles.checkboxChecked,
+      disabled && !isChecked && styles.checkboxDisabled,
+      disabled && isChecked && styles.checkboxCheckedDisabled,
+    ) as string,
+
+    checkmark: mergeStyles(
+      styles.checkmark,
+      !disabled && isChecked && styles.checkmarkChecked,
+      disabled && !isChecked && styles.checkmarkDisabled,
+      disabled && isChecked && styles.checkmarkCheckedDisabled,
+    ) as string,
+
+    text: mergeStyles(
+      'ms-Checkbox-text',
+      styles.text,
+      disabled && styles.textDisabled
+    ) as string,
+  };
+});
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
index 872e7e17c7438..664c6baf4a89c 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
@@ -1,7 +1,7 @@
 import { ICheckboxStyles } from './Checkbox.Props';
 import {
   ITheme,
-  mergeStyleSets,
+  concatStyleSets,
   getFocusStyle,
   FontSizes
 } from '../../Styling';
@@ -29,7 +29,7 @@ export const getStyles = memoizeFunction((
 
   const styles: ICheckboxStyles = {
     root: [
-      getFocusStyle(theme),
+      getFocusStyle(theme, -2),
       {
         padding: '0',
         border: 'none',
@@ -58,7 +58,7 @@ export const getStyles = memoizeFunction((
     },
     checkbox: {
       display: 'flex',
-      flexShrink: '0',
+      flexShrink: 0,
       alignItems: 'center',
       justifyContent: 'center',
       height: MS_CHECKBOX_LABEL_SIZE,
@@ -73,7 +73,7 @@ export const getStyles = memoizeFunction((
       transitionTimingFunction: MS_CHECKBOX_TRANSITION_TIMING,
 
       /* incase the icon is bigger than the box */
-      overflow: 'hidden',
+      overflow: 'hidden'
     },
     checkboxHovered: {
       borderColor: checkboxBorderHoveredColor,
@@ -118,5 +118,5 @@ export const getStyles = memoizeFunction((
     }
   };
 
-  return mergeStyleSets(styles, customStyles)!;
+  return concatStyleSets(styles, customStyles)!;
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
index 933c0df675c1b..69eb70b3bef88 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
@@ -17,7 +17,10 @@ import {
 import {
   mergeStyles
 } from '../../Styling';
-
+import {
+  ICheckboxClassNames,
+  getClassNames
+} from './Checkbox.classNames';
 import { getStyles } from './Checkbox.styles';
 
 export interface ICheckboxState {
@@ -25,15 +28,7 @@ export interface ICheckboxState {
   isChecked?: boolean;
 }
 
-interface ICheckboxClassNames {
-  root: string;
-  label: string;
-  checkbox: string;
-  checkmark: string;
-  text: string;
-}
-
-@customizable(['theme'])
+@customizable('Checkbox', ['theme'])
 export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> implements ICheckbox {
   public static defaultProps: ICheckboxProps = {
     boxSide: 'start'
@@ -92,7 +87,7 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
     const isChecked = checked === undefined ? this.state.isChecked : checked;
     const isReversed = boxSide !== 'start' ? true : false;
 
-    this._classNames = this._getClassNames(
+    this._classNames = getClassNames(
       getStyles(theme!, customStyles),
       className!,
       disabled!,
@@ -187,64 +182,4 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
         null
       );
   }
-
-  @memoize
-  private _getClassNames(
-    styles: ICheckboxStyles,
-    className: string,
-    disabled: boolean,
-    isChecked: boolean,
-    isReversed: boolean
-    ): ICheckboxClassNames {
-    return {
-      root: mergeStyles(
-        'ms-Checkbox',
-        isReversed && 'reversed',
-        isChecked && 'is-checked',
-        !disabled && 'is-enabled',
-        disabled && 'is-disabled',
-        className,
-        styles.root,
-        !disabled && [
-          !isChecked && {
-            ':hover .ms-Checkbox-checkbox': styles.checkboxHovered
-          },
-          isChecked && {
-            ':hover .ms-Checkbox-checkbox': styles.checkboxCheckedHovered
-          },
-          {
-            ':hover .ms-Checkbox-text': styles.textHovered
-          }
-        ]
-      ) as string,
-
-      label: mergeStyles(
-        'ms-Checkbox-label',
-        styles.label,
-        isReversed && styles.labelReversed,
-        disabled && styles.labelDisabled
-      ) as string,
-
-      checkbox: mergeStyles(
-        'ms-Checkbox-checkbox',
-        styles.checkbox,
-        !disabled && isChecked && styles.checkboxChecked,
-        disabled && !isChecked && styles.checkboxDisabled,
-        disabled && isChecked && styles.checkboxCheckedDisabled,
-      ) as string,
-
-      checkmark: mergeStyles(
-        styles.checkmark,
-        !disabled && isChecked && styles.checkmarkChecked,
-        disabled && !isChecked && styles.checkmarkDisabled,
-        disabled && isChecked && styles.checkmarkCheckedDisabled,
-      ) as string,
-
-      text: mergeStyles(
-        'ms-Checkbox-text',
-        styles.text,
-        disabled && styles.textDisabled
-      ) as string,
-    };
-  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
index 2ceecdfa0d8d8..58ec69439b4b2 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
@@ -38,7 +38,7 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
 //
 
 .root {
-  margin-bottom: 4px;
+  display: block;
 }
 
 .choiceField {
@@ -52,7 +52,6 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
   border: none;
   position: relative;
   margin-top: 8px;
-  @include ms-padding-left(8px);
 
   :global(.ms-Label) {
     font-size: $ms-font-size-m;
@@ -78,7 +77,8 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
   height: $ms-choiceField-field-size;
   font-weight: normal;
   position: absolute;
-  top: -1px;
+  top: 0;
+  left: 0;
   box-sizing: border-box;
   transition-property: border-color;
   transition-duration: $ms-choiceField-transition-duration;
@@ -108,6 +108,7 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
   position: relative;
   vertical-align: top;
   user-select: none;
+  min-height: 20px;
 
   &:hover,
   &:focus {
@@ -124,7 +125,7 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
   //
   &.fieldIsChecked {
     &::before { // the circle
-      border: 2px solid $radioButton-border-selected-color;
+      border: 1px solid $radioButton-border-selected-color;
 
       @include high-contrast {
         border-color: Highlight;
@@ -133,8 +134,8 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
 
     &::after { // the dot
       border: 5px solid $radioButton-dot-color;
-      top: 4px;
       @include ms-left(5px);
+      top: 5px;
       width: 10px;
       height: 10px;
 
@@ -187,7 +188,6 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
 }
 
 .choiceFieldIsImage, .choiceFieldIsIcon {
-  $fieldPadding: 4px;
   display: inline-flex;
   font-size: 0;
   @include ms-margin(0, 4px, 4px, 0);
@@ -202,7 +202,6 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
     box-sizing: border-box;
     min-width: $ms-choiceField-iconField-size;
     cursor: pointer;
-    padding: $fieldPadding;
     padding-top: 22px;
     margin: 0;
     text-align: center;
@@ -323,17 +322,18 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
   }
 }
 
-:global(.ms-Fabric.is-focusVisible) .choiceFieldIsInFocus {
-  @include focus-border(1px, $ms-color-neutralPrimary, 1px, false);
+:global(.ms-Fabric.is-focusVisible) .choiceFieldIsInFocus .choiceFieldWrapper {
+  @include focus-border(-2px, $ms-color-neutralPrimary, 1px, false);
 
   @include high-contrast {
-     @include focus-border(1px, WindowText, 2px, false);
+     @include focus-border(-2px, WindowText, 2px, false);
   }
 }
 
-:global(.ms-Fabric.is-focusVisible) .choiceFieldIsInFocus{
-  &.choiceFieldIsImage, &.choiceFieldIsIcon {
-    @include focus-border(0, $ms-color-neutralPrimary, 1px, false);
+:global(.ms-Fabric.is-focusVisible) .choiceFieldIsInFocus {
+  &.choiceFieldIsImage .choiceFieldWrapper,
+  &.choiceFieldIsIcon .choiceFieldWrapper {
+    @include focus-border(1px, $ms-color-neutralPrimary, 1px, false);
 
     @include high-contrast {
       @include focus-border(1px, WindowText, 2px, false);
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
index 58ce4dd728c6b..9c903356d3672 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
@@ -101,22 +101,24 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
                 })
                 }
               >
-                <input
-                  ref={ this._resolveRef('_inputElement') }
-                  id={ option.id }
-                  className={ css('ms-ChoiceField-input', styles.input) }
-                  type='radio'
-                  name={ this.props.name || this._id }
-                  disabled={ option.disabled || this.props.disabled }
-                  checked={ option.key === keyChecked }
-                  required={ required }
-                  onChange={ this._onChange.bind(this, option) }
-                  onFocus={ this._onFocus.bind(this, option) }
-                  onBlur={ this._onBlur.bind(this, option) }
-                  aria-labelledby={ option.id }
-                  { ...getNativeProps(option, inputProperties) }
-                />
-                { onRenderField(option, this._onRenderField) }
+                <div className={ css('ms-ChoiceField-wrapper', styles.choiceFieldWrapper) }>
+                  <input
+                    ref={ this._resolveRef('_inputElement') }
+                    id={ option.id }
+                    className={ css('ms-ChoiceField-input', styles.input) }
+                    type='radio'
+                    name={ this.props.name || this._id }
+                    disabled={ option.disabled || this.props.disabled }
+                    checked={ option.key === keyChecked }
+                    required={ required }
+                    onChange={ this._onChange.bind(this, option) }
+                    onFocus={ this._onFocus.bind(this, option) }
+                    onBlur={ this._onBlur.bind(this, option) }
+                    aria-labelledby={ option.id }
+                    { ...getNativeProps(option, inputProperties) }
+                  />
+                  { onRenderField(option, this._onRenderField) }
+                </div>
               </div>
             );
           }) }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
index 03451aea366f5..289f431f9bf0b 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
@@ -48,7 +48,9 @@ export const getClassNames = memoizeFunction((
       hasErrorMessage && styles.rootError,
       !disabled && focused && styles.rootFocused,
       !disabled && {
-        ':hover': styles.rootHovered
+        selectors: {
+          ':hover': styles.rootHovered
+        }
       },
       disabled && [
         'is-disabled', styles.rootDisabled
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index 86e01eb7aea87..8ba2ae51cb6aa 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -4,7 +4,7 @@ import {
 } from './ComboBox.Props';
 import {
   ITheme,
-  IStyle,
+  IRawStyle,
   mergeStyleSets,
   FontSizes,
   FontWeights,
@@ -13,15 +13,16 @@ import {
 import { IButtonStyles } from '../../Button';
 import { memoizeFunction } from '../../Utilities';
 
-const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
+const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active) &';
 
 const ComboBoxHeight = '32px';
 const ComboBoxLineHeight = '30px';
 const ComboxBoxCaretDownWidth = '32px';
 const ComboBoxOptionHeight = '36px';
 
-const getDisabledStyles = memoizeFunction((theme: ITheme): IStyle => {
+const getDisabledStyles = memoizeFunction((theme: ITheme): IRawStyle => {
   const { semanticColors } = theme;
+
   return {
     backgroundColor: semanticColors.disabledBackground,
     borderColor: semanticColors.disabledBackground,
@@ -34,13 +35,15 @@ const getDisabledStyles = memoizeFunction((theme: ITheme): IStyle => {
   };
 });
 
-const getListOptionHighContrastStyles = memoizeFunction((theme: ITheme): IStyle => {
+const getListOptionHighContrastStyles = memoizeFunction((theme: ITheme): IRawStyle => {
   return {
-    [MS_HIGHCONTRAST_ACTIVE]: {
-      backgroundColor: 'Highlight',
-      borderColor: 'Highlight',
-      color: 'HighlightText',
-      msHighContrastAdjust: 'none'
+    selectors: {
+      [MS_HIGHCONTRAST_ACTIVE]: {
+        backgroundColor: 'Highlight',
+        borderColor: 'Highlight',
+        color: 'HighlightText',
+        MsHighContrastAdjust: 'none'
+      }
     },
   };
 });
@@ -71,11 +74,7 @@ export const getOptionStyles = memoizeFunction((
         height: 'auto',
         minHeight: ComboBoxOptionHeight,
         lineHeight: '20px',
-        // padding: '5px 16px',
-        paddingTop: '5px',
-        paddingRight: '16px',
-        paddingBottom: '5px',
-        paddingLeft: '16px',
+        padding: '5px 16px',
         position: 'relative',
         borderWidth: '1px',
         borderStyle: 'solid',
@@ -83,9 +82,10 @@ export const getOptionStyles = memoizeFunction((
         wordWrap: 'break-word',
         overflowWrap: 'break-word',
         textAlign: 'left',
-
-        [MS_HIGHCONTRAST_ACTIVE]: {
-          borderColor: 'Background'
+        selectors: {
+          [MS_HIGHCONTRAST_ACTIVE]: {
+            borderColor: 'Background'
+          }
         }
       },
       getFocusStyle(theme),
@@ -117,8 +117,10 @@ export const getOptionStyles = memoizeFunction((
       backgroundColor: ComboBoxOptionBackgroundDisabled,
       color: ComboBoxOptionTextColorDisabled,
       cursor: 'default',
-      ' .ms-Button-flexContainer': {
-        justifyContent: 'flex-start'
+      selectors: {
+        '& .ms-Button-flexContainer': {
+          justifyContent: 'flex-start'
+        }
       }
     },
     optionText: {
@@ -129,12 +131,7 @@ export const getOptionStyles = memoizeFunction((
       maxWidth: '100%',
       wordWrap: 'break-word',
       overflowWrap: 'break-word',
-
-      // margin: '1px',
-      marginTop: '1px',
-      marginRight: '1px',
-      marginBottom: '1px',
-      marginLeft: '1px',
+      margin: '1px',
     },
   };
 
@@ -196,28 +193,18 @@ export const getStyles = memoizeFunction((
   const ComboBoxOptionDividerBorderColor = semanticColors.bodyDivider;
 
   const styles: IComboBoxStyles = {
-    container: {
-
-    },
-    label: {
-
-    },
+    container: {},
+    label: {},
     root: [
       fonts.medium,
       {
         boxShadow: 'none',
-        // margin: '0 0 10px 0',
-        marginTop: '0',
-        marginRight: '0',
         marginBottom: '10px',
         marginLeft: '0',
-
-        // padding: '0 32px 0 12px',
         paddingTop: '0',
         paddingRight: ComboxBoxCaretDownWidth,
         paddingBottom: '0',
         paddingLeft: '12px',
-
         color: ComboBoxRootTextColor,
         position: 'relative',
         outline: '0',
@@ -234,35 +221,45 @@ export const getStyles = memoizeFunction((
         whiteSpace: 'nowrap',
         textOverflow: 'ellipsis',
         boxSizing: 'content-box',
-        ' .ms-Label': {
-          display: 'inline-block',
-          marginBottom: '8px',
+        selectors: {
+          ' .ms-Label': {
+            display: 'inline-block',
+            marginBottom: '8px',
+          }
         }
       }
     ],
+
     rootHovered: {
       borderColor: ComboBoxRootBorderColorHovered,
-      [MS_HIGHCONTRAST_ACTIVE]: {
-        color: 'HighlightText',
-        borderColor: 'Highlight',
-        msHighContrastAdjust: 'none'
+      selectors: {
+        [MS_HIGHCONTRAST_ACTIVE]: {
+          color: 'HighlightText',
+          borderColor: 'Highlight',
+          MsHighContrastAdjust: 'none'
+        }
       },
     },
+
     rootFocused: {
       borderColor: ComboBoxRootBorderColorHovered,
-      [MS_HIGHCONTRAST_ACTIVE]: {
-        color: 'HighlightText',
-        borderColor: 'Highlight',
-        msHighContrastAdjust: 'none'
+      selectors: {
+        [MS_HIGHCONTRAST_ACTIVE]: {
+          color: 'HighlightText',
+          borderColor: 'Highlight',
+          MsHighContrastAdjust: 'none'
+        }
       },
     },
+
     rootDisabled: getDisabledStyles(theme),
+
     rootError: {
       borderColor: ComboBoxRootColorErrored
     },
-    rootDisallowFreeForm: {
 
-    },
+    rootDisallowFreeForm: {},
+
     input: {
       boxSizing: 'border-box',
       width: '100%',
@@ -271,35 +268,31 @@ export const getStyles = memoizeFunction((
       outline: 'none',
       font: 'inherit',
       textOverflow: 'ellipsis',
-
-      // padding: '0',
-      paddingTop: '0',
-      paddingRight: '0',
-      paddingBottom: '0',
-      paddingLeft: '0',
-
-      // margin: '1px 0px',
-      marginTop: '1px',
-      marginRight: '0px',
-      marginBottom: '1px',
-      marginLeft: '0px',
+      padding: '0',
+      margin: '1px 0px'
     },
+
     inputDisabled: getDisabledStyles(theme),
     errorMessage: {
       color: ComboBoxRootColorErrored,
-      ':before': {
-        content: '* ',
+      selectors: {
+        ':before': {
+          content: '* ',
+        }
       }
     },
+
     callout: {
       boxShadow: '0 0px 5px 0px rgba(0, 0, 0, 0.4)',
       borderWidth: '1px',
       borderStyle: 'solid',
       borderColor: ComboBoxCalloutBorderColor,
     },
+
     optionsContainer: {
       display: 'block'
     },
+
     header: [
       fonts.medium,
       {
@@ -310,21 +303,18 @@ export const getStyles = memoizeFunction((
         height: ComboBoxOptionHeight,
         lineHeight: ComboBoxOptionHeight,
         cursor: 'default',
-        // padding: '0px 16px',
-        paddingTop: '0',
-        paddingRight: '16px',
-        paddingBottom: '0',
-        paddingLeft: '16px',
-
+        padding: '0px 16px',
         userSelect: 'none',
         textAlign: 'left'
       }
     ],
+
     divider: {
       borderWidth: '1px',
       borderStyle: 'solid',
       borderColor: ComboBoxOptionDividerBorderColor
-    },
+    }
+
   };
 
   return mergeStyleSets(styles, customStyles) as IComboBoxStyles;
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index a84a777920be3..c806e05cac624 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -64,7 +64,7 @@ enum SearchDirection {
   forward = 1
 }
 
-@customizable(['theme'])
+@customizable('ComboBox', ['theme'])
 export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
   public static defaultProps: IComboBoxProps = {
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 5d1c7a53acce0..6b8a457f57fcc 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -15,7 +15,6 @@ import { ContextualMenu, IContextualMenuProps, IContextualMenuItem, hasSubmenuIt
 import { DirectionalHint } from '../../common/DirectionalHint';
 import {
   Icon,
-  IconName,
   IIconProps
 } from '../../Icon';
 import { FontClassNames } from '../../Styling';
@@ -256,7 +255,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
   private _renderIcon(item: IContextualMenuItem) {
     // Only present to allow continued use of item.icon which is deprecated.
     let iconProps: IIconProps = item.iconProps ? item.iconProps : {
-      iconName: item.icon as IconName
+      iconName: item.icon
     };
     // Use the default icon color for the known icon names
     let iconColorClassName = iconProps.iconName === 'None' ? '' : ('ms-CommandBarItem-iconColor ' + styles.itemIconColor);
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 3629752a02177..ea17a18754ce0 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -3,7 +3,6 @@ import { IContextualMenuProps, IContextualMenuItem, ContextualMenuItemType } fro
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { getClassNames } from './ContextualMenu.classNames';
-import { ThemeSettingName } from '../../Styling';
 import {
   BaseComponent,
   anchorProperties,
@@ -70,7 +69,7 @@ function getIsChecked(item: IContextualMenuItem): boolean | null | undefined {
   return null;
 }
 
-@customizable([ThemeSettingName])
+@customizable('ContextualMenu', ['theme'])
 @withResponsiveMode
 export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContextualMenuState> {
   // The default ContextualMenu properties have no items and beak, the default submenu direction is right and top.
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss
index 1573b658d9741..b648f8649f949 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss
@@ -17,7 +17,6 @@
 
 .root {
   @include ms-normalize;
-  margin-bottom: 17px;
 }
 
 .textField {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
index 4169ecc777f92..0a9c4f6e697cf 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
@@ -9,7 +9,6 @@ import {
   IDragDropEvents,
   IDragDropContext,
 } from './../../utilities/dragdrop/index';
-import { IconName } from '../../Icon';
 import {
   IGroup,
   IGroupRenderProps
@@ -256,7 +255,7 @@ export interface IColumn {
   /**
    * Optional iconName to use for the column header.
    */
-  iconName?: IconName;
+  iconName?: string;
 
   /**
    * Whether or not only the icon is used in the column header.
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
index 3dad9809f583a..ba79f379fe879 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
@@ -28,7 +28,6 @@ $DropDown-item-height: 32px;
   @include ms-font-m;
   color: $ms-color-neutralPrimary;
 
-  margin-bottom: 10px;
   position: relative;
   outline: 0;
   user-select: none;
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss
index 08458ffadaad1..2baa41e4291c7 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss
@@ -1,11 +1,8 @@
 :global {
-  .dropdownExample {
+  .DropdownBasicExample {
     max-width: 300px;
   }
-  .dropdownExample-option {
-    display: flex;
-  }
-  .dropdownExample-placeholder {
-    display: flex;
+  .Dropdown-example {
+    margin-bottom: 10px;
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
index f58077ed5d2b4..71e8a461d5af3 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
@@ -14,9 +14,9 @@ export class DropdownBasicExample extends React.Component<any, any> {
     let { selectedItem } = this.state;
 
     return (
-      <div className='dropdownExample'>
-
+      <div className='DropdownBasicExample'>
         <Dropdown
+          className='Dropdown-example'
           placeHolder='Select an Option'
           label='Basic uncontrolled example:'
           id='Basicdrop1'
@@ -43,6 +43,7 @@ export class DropdownBasicExample extends React.Component<any, any> {
         />
 
         <Dropdown
+          className='Dropdown-example'
           label='Disabled uncontrolled example with defaultSelectedKey:'
           defaultSelectedKey='D'
           options={
@@ -62,6 +63,7 @@ export class DropdownBasicExample extends React.Component<any, any> {
         />
 
         <Dropdown
+          className='Dropdown-example'
           label='Controlled example:'
           selectedKey={ selectedItem && selectedItem.key }
           onChanged={ this.changeState }
diff --git a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.classNames.ts b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.classNames.ts
new file mode 100644
index 0000000000000..6b369e3d14bd4
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.classNames.ts
@@ -0,0 +1,38 @@
+
+import {
+  memoizeFunction
+} from '../../Utilities';
+import {
+  ITheme,
+  IStyle,
+  mergeStyles
+} from '../../Styling';
+
+const inheritFont = { fontFamily: 'inherit' };
+
+export interface IFabricClassNames {
+  root: string;
+}
+
+export const getClassNames = memoizeFunction((
+  theme: ITheme,
+  className: string,
+  isFocusVisible: boolean
+): IFabricClassNames => {
+  return {
+    root: mergeStyles([
+      'ms-Fabric',
+      isFocusVisible && 'is-focusVisible',
+      className,
+      theme.fonts.medium,
+      {
+        color: theme.palette.neutralPrimary,
+        selectors: {
+          '& button': inheritFont,
+          '& input': inheritFont,
+          '& textarea': inheritFont
+        }
+      }
+    ])
+  };
+});
diff --git a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.styles.ts b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.styles.ts
deleted file mode 100644
index d0e1ce5101ce6..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.styles.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-
-import {
-  memoizeFunction
-} from '../../Utilities';
-import {
-  ITheme,
-  IStyle,
-  mergeStyles
-} from '../../Styling';
-
-const inheritFont = { fontFamily: 'inherit' };
-
-export interface IFabricStyles {
-  root: IStyle;
-}
-
-export const getStyles = memoizeFunction((
-  theme: ITheme
-): IFabricStyles => {
-  return {
-    root: mergeStyles([
-      theme.fonts.medium,
-      {
-        color: theme.palette.neutralPrimary,
-        '& button': inheritFont,
-        '& input': inheritFont,
-        '& textarea': inheritFont
-      }
-    ])
-  };
-});
diff --git a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
index e1967ff5d78d7..56f5021bb8646 100644
--- a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
+++ b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
@@ -3,14 +3,13 @@ import {
   BaseComponent,
   KeyCodes,
   customizable,
-  css,
   getNativeProps,
   divProperties
 } from '../../Utilities';
 import {
   ITheme
 } from '../../Styling';
-import { getStyles } from './Fabric.styles';
+import { getClassNames } from './Fabric.classNames';
 
 const DIRECTIONAL_KEY_CODES = [
   KeyCodes.up,
@@ -41,7 +40,7 @@ if (typeof (document) === 'object' && document.documentElement && !document.docu
   document.documentElement.setAttribute('dir', 'ltr');
 }
 
-@customizable(['theme'])
+@customizable('Fabric', ['theme'])
 export class Fabric extends BaseComponent<IFabricProps, IFabricState> {
   // tslint:disable-next-line:no-unused-variable
   private _root: HTMLElement;
@@ -61,20 +60,19 @@ export class Fabric extends BaseComponent<IFabricProps, IFabricState> {
 
   public render() {
     const { isFocusVisible } = this.state;
-    const styles = getStyles(this.props.theme!);
+    const { className } = this.props;
 
-    const rootClass = css(
-      'ms-Fabric',
-      styles.root,
-      this.props.className,
-      isFocusVisible && 'is-focusVisible'
-    ) as string;
+    const classNames = getClassNames(
+      this.props.theme!,
+      className!,
+      isFocusVisible!
+    );
 
     let divProps = getNativeProps(this.props, divProperties);
     return (
       <div
         { ...divProps }
-        className={ rootClass }
+        className={ classNames.root }
         ref={ this._resolveRef('_root') }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
index 86f39974d0ab5..f19a036f4cd87 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
@@ -1,14 +1,9 @@
 import * as React from 'react';
-import {
-  Checkbox,
-  Dropdown,
-  Facepile,
-  IDropdownOption,
-  IFacepilePersona,
-  IFacepileProps,
-  PersonaSize,
-  Slider
-} from 'office-ui-fabric-react/lib/index';
+import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
+import { Dropdown, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
+import { Facepile, IFacepilePersona, IFacepileProps } from 'office-ui-fabric-react/lib/Facepile';
+import { PersonaSize } from 'office-ui-fabric-react/lib/Persona';
+import { Slider } from 'office-ui-fabric-react/lib/Slider';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { facepilePersonas } from './FacepileExampleData';
 import './Facepile.Examples.scss';
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 36d41d1cc08c4..790e7a659b341 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -19,6 +19,7 @@ import {
   getParent,
   getPreviousElement,
   getRTL,
+  getWindow,
   isElementFocusZone,
   isElementFocusSubZone,
   isElementTabbable
@@ -46,11 +47,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     direction: FocusZoneDirection.bidirectional
   };
 
-  public refs: {
-    [key: string]: React.ReactInstance,
-    root: HTMLElement
-  };
-
+  private _root: HTMLElement;
   private _id: string;
   private _activeElement: HTMLElement | null;
   private _focusAlignment: IPoint;
@@ -71,32 +68,34 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
   public componentDidMount() {
     _allInstances[this._id] = this;
-    const windowElement = this.refs.root.ownerDocument.defaultView;
+    if (this._root) {
+      const windowElement = this._root.ownerDocument.defaultView;
 
-    let parentElement = getParent(this.refs.root);
+      let parentElement = getParent(this._root);
 
-    while (
-      parentElement &&
-      parentElement !== document.body &&
-      parentElement.nodeType === 1
-    ) {
-      if (isElementFocusZone(parentElement)) {
-        this._isInnerZone = true;
-        break;
+      while (
+        parentElement &&
+        parentElement !== document.body &&
+        parentElement.nodeType === 1
+      ) {
+        if (isElementFocusZone(parentElement)) {
+          this._isInnerZone = true;
+          break;
+        }
+        parentElement = getParent(parentElement);
       }
-      parentElement = getParent(parentElement);
-    }
 
-    if (!this._isInnerZone) {
-      this._events.on(windowElement, 'keydown', this._onKeyDownCapture, true);
-    }
+      if (!this._isInnerZone) {
+        this._events.on(windowElement, 'keydown', this._onKeyDownCapture, true);
+      }
 
-    // Assign initial tab indexes so that we can set initial focus as appropriate.
-    this._updateTabIndexes();
+      // Assign initial tab indexes so that we can set initial focus as appropriate.
+      this._updateTabIndexes();
 
-    if (this.props.defaultActiveElement) {
-      this._activeElement = getDocument()!.querySelector(this.props.defaultActiveElement) as HTMLElement;
-      this.focus();
+      if (this.props.defaultActiveElement) {
+        this._activeElement = getDocument()!.querySelector(this.props.defaultActiveElement) as HTMLElement;
+        this.focus();
+      }
     }
   }
 
@@ -120,7 +119,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
         ...rootProps
         }
         className={ css('ms-FocusZone', className) }
-        ref='root'
+        ref={ this._resolveRef('_root') }
         data-focuszone-id={ this._id }
         aria-labelledby={ ariaLabelledBy }
         aria-describedby={ ariaDescribedBy }
@@ -138,25 +137,28 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
    * @returns True if focus could be set to an active element, false if no operation was taken.
    */
   public focus(forceIntoFirstElement: boolean = false): boolean {
-    if (!forceIntoFirstElement && this.refs.root.getAttribute(IS_FOCUSABLE_ATTRIBUTE) === 'true' && this._isInnerZone) {
-      const ownerZoneElement = this._getOwnerZone(this.refs.root);
+    if (this._root) {
+      if (!forceIntoFirstElement && this._root.getAttribute(IS_FOCUSABLE_ATTRIBUTE) === 'true' && this._isInnerZone) {
+        const ownerZoneElement = this._getOwnerZone(this._root);
 
-      if (ownerZoneElement !== this.refs.root) {
-        const ownerZone = _allInstances[ownerZoneElement.getAttribute(FOCUSZONE_ID_ATTRIBUTE) as string];
+        if (ownerZoneElement !== this._root) {
+          const ownerZone = _allInstances[ownerZoneElement.getAttribute(FOCUSZONE_ID_ATTRIBUTE) as string];
 
-        return !!ownerZone && ownerZone.focusElement(this.refs.root);
-      }
+          return !!ownerZone && ownerZone.focusElement(this._root);
+        }
 
-      return false;
-    } else if (this._activeElement && elementContains(this.refs.root, this._activeElement)
-      && isElementTabbable(this._activeElement)) {
-      this._activeElement.focus();
-      return true;
-    } else {
-      const firstChild = this.refs.root.firstChild as HTMLElement;
+        return false;
+      } else if (this._activeElement && elementContains(this._root, this._activeElement)
+        && isElementTabbable(this._activeElement)) {
+        this._activeElement.focus();
+        return true;
+      } else {
+        const firstChild = this._root.firstChild as HTMLElement;
 
-      return this.focusElement(getNextElement(this.refs.root, firstChild, true) as HTMLElement);
+        return this.focusElement(getNextElement(this._root, firstChild, true) as HTMLElement);
+      }
     }
+    return false;
   }
 
   /**
@@ -192,7 +194,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     } else {
       let parentElement = ev.target as HTMLElement;
 
-      while (parentElement && parentElement !== this.refs.root) {
+      while (parentElement && parentElement !== this._root) {
         if (isElementTabbable(parentElement) && this._isImmediateDescendantOfZone(parentElement)) {
           this._activeElement = parentElement;
           break;
@@ -225,7 +227,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     let target = ev.target as HTMLElement;
     const path = [];
 
-    while (target && target !== this.refs.root) {
+    while (target && target !== this._root) {
       path.push(target);
       target = getParent(target) as HTMLElement;
     }
@@ -278,7 +280,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       return;
     }
 
-    if (document.activeElement === this.refs.root && this._isInnerZone) {
+    if (document.activeElement === this._root && this._isInnerZone) {
       // If this element has focus, it is being controlled by a parent.
       // Ignore the keystroke.
       return;
@@ -351,8 +353,8 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
             !this._shouldInputLoseFocus(ev.target as HTMLInputElement, false)) {
             return false;
           }
-          const firstChild = this.refs.root.firstChild as HTMLElement;
-          if (this.focusElement(getNextElement(this.refs.root, firstChild, true) as HTMLElement)) {
+          const firstChild = this._root.firstChild as HTMLElement;
+          if (this.focusElement(getNextElement(this._root, firstChild, true) as HTMLElement)) {
             break;
           }
           return;
@@ -364,8 +366,8 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
             return false;
           }
 
-          const lastChild = this.refs.root.lastChild as HTMLElement;
-          if (this.focusElement(getPreviousElement(this.refs.root, lastChild, true, true, true) as HTMLElement)) {
+          const lastChild = this._root.lastChild as HTMLElement;
+          if (this.focusElement(getPreviousElement(this._root, lastChild, true, true, true) as HTMLElement)) {
             break;
           }
           return;
@@ -389,7 +391,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
    * Walk up the dom try to find a focusable element.
    */
   private _tryInvokeClickForFocusable(target: HTMLElement): boolean {
-    if (target === this.refs.root) {
+    if (target === this._root) {
       return false;
     }
 
@@ -408,7 +410,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       }
 
       target = getParent(target) as HTMLElement;
-    } while (target !== this.refs.root);
+    } while (target !== this._root);
 
     return false;
   }
@@ -417,7 +419,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
    * Traverse to find first child zone.
    */
   private _getFirstInnerZone(rootElement?: HTMLElement): FocusZone | null {
-    rootElement = rootElement || this._activeElement || this.refs.root;
+    rootElement = rootElement || this._activeElement || this._root;
 
     if (isElementFocusZone(rootElement)) {
       return _allInstances[rootElement.getAttribute(FOCUSZONE_ID_ATTRIBUTE) as string];
@@ -466,8 +468,8 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
     do {
       element = (isForward ?
-        getNextElement(this.refs.root, element) :
-        getPreviousElement(this.refs.root, element)) as HTMLElement;
+        getNextElement(this._root, element) :
+        getPreviousElement(this._root, element)) as HTMLElement;
 
       if (isBidirectional) {
         if (element) {
@@ -501,9 +503,9 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       this.focusElement(candidateElement);
     } else if (this.props.isCircularNavigation) {
       if (isForward) {
-        return this.focusElement(getNextElement(this.refs.root, this.refs.root.firstElementChild as HTMLElement, true) as HTMLElement);
+        return this.focusElement(getNextElement(this._root, this._root.firstElementChild as HTMLElement, true) as HTMLElement);
       } else {
-        return this.focusElement(getPreviousElement(this.refs.root, this.refs.root.lastElementChild as HTMLElement, true, true, true) as HTMLElement);
+        return this.focusElement(getPreviousElement(this._root, this._root.lastElementChild as HTMLElement, true, true, true) as HTMLElement);
       }
     }
 
@@ -650,13 +652,13 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   }
 
   private _isImmediateDescendantOfZone(element?: HTMLElement): boolean {
-    return this._getOwnerZone(element) === this.refs.root;
+    return this._getOwnerZone(element) === this._root;
   }
 
   private _getOwnerZone(element?: HTMLElement): HTMLElement {
     let parentElement = getParent(element as HTMLElement);
 
-    while (parentElement && parentElement !== this.refs.root && parentElement !== document.body) {
+    while (parentElement && parentElement !== this._root && parentElement !== document.body) {
       if (isElementFocusZone(parentElement)) {
         return parentElement;
       }
@@ -664,12 +666,12 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       parentElement = getParent(parentElement);
     }
 
-    return this.refs.root;
+    return this._root;
   }
 
   private _updateTabIndexes(element?: HTMLElement) {
     if (!element) {
-      element = this.refs.root;
+      element = this._root;
       if (this._activeElement && !elementContains(element, this._activeElement)) {
         this._activeElement = null;
       }
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
index 838f51dba9198..b4c9fa00c5aab 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
@@ -2,7 +2,6 @@ import { IExpandingCardStyles } from './ExpandingCard.Props';
 import { memoizeFunction } from '../../Utilities';
 import {
   mergeStyleSets,
-  before,
   ITheme
 } from '../../Styling';
 
@@ -16,41 +15,47 @@ export const getStyles = memoizeFunction((
   const styles: IExpandingCardStyles = {
     root: {
       width: '340px',
-      'pointer-events': 'none',
-      '.ms-Callout': {
-        'box-shadow': '0 0 20px rgba(0, 0, 0, .2)',
-        border: 'none',
-        [MS_HIGHCONTRAST_ACTIVE]: {
-          border: '1px solid WindowText',
+      pointerEvents: 'none',
+      selectors: {
+        '.ms-Callout': {
+          boxShadow: '0 0 20px rgba(0, 0, 0, .2)',
+          border: 'none',
+          selectors: {
+            [MS_HIGHCONTRAST_ACTIVE]: {
+              border: '1px solid WindowText',
+            }
+          }
         }
       }
     },
     compactCard: {
-      'pointer-events': 'auto',
+      pointerEvents: 'auto',
       position: 'relative'
     },
     expandedCard: [
       {
         height: '1px',
-        'overflow-y': 'hidden',
-        'pointer-events': 'auto',
-        transition: 'height 0.467s cubic-bezier(0.5, 0, 0, 1)'
-      },
-      before({
-        content: '""',
-        position: 'relative',
-        display: 'block',
-        top: '0',
-        left: '24px',
-        width: '292px',
-        height: '1px',
-        'background-color': theme.palette.neutralLighter
-      })
+        overflowY: 'hidden',
+        pointerEvents: 'auto',
+        transition: 'height 0.467s cubic-bezier(0.5, 0, 0, 1)',
+        selectors: {
+          ':before': {
+            content: '""',
+            position: 'relative',
+            display: 'block',
+            top: '0',
+            left: '24px',
+            width: '292px',
+            height: '1px',
+            backgroundColor: theme.palette.neutralLighter
+          }
+        }
+      }
     ],
     expandedCardScroll: {
       height: '100%',
-      'box-sizing': 'border-box',
-      'overflow-y': 'auto'
+      boxSizing: 'border-box',
+      overflowY: 'auto'
     }
   };
 
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
index 06c44827d193b..4195ce907880d 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
@@ -3,7 +3,6 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import {
   BaseComponent,
-  css,
   getNativeProps,
   divProperties,
   customizable,
@@ -12,7 +11,7 @@ import {
 import { IExpandingCardProps, IExpandingCardStyles, ExpandingCardMode } from './ExpandingCard.Props';
 import { Callout, ICallout } from '../../Callout';
 import { DirectionalHint } from '../../common/DirectionalHint';
-import { AnimationClassNames, mergeStyles } from '../../Styling';
+import { AnimationStyles, mergeStyles } from '../../Styling';
 
 import { getStyles } from './ExpandingCard.styles';
 
@@ -21,7 +20,7 @@ export interface IExpandingCardState {
   needsScroll: boolean;
 }
 
-@customizable(['theme'])
+@customizable('ExpandingCard', ['theme'])
 export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpandingCardState> {
   public static defaultProps = {
     compactCardHeight: 156,
@@ -70,8 +69,8 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
       <Callout
         { ...getNativeProps(this.props, divProperties) }
         componentRef={ this._resolveRef('_callout') }
-        className={ css(
-          AnimationClassNames.scaleUpIn100,
+        className={ mergeStyles(
+          AnimationStyles.scaleUpIn100,
           this._styles.root
         ) }
         targetElement={ targetElement }
@@ -119,8 +118,8 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
         className={ mergeStyles(
           this._styles.expandedCard,
           this.props.mode === ExpandingCardMode.expanded && this.state.firstFrameRendered && { height: this.props.expandedCardHeight + 'px' },
-          this.state.needsScroll && { 'overflow-y': 'auto' }
-        ) as string }
+          this.state.needsScroll && { overflowY: 'auto' }
+        ) }
         ref={ this._resolveRef('_expandedElem') }
       >
         <div className={ this._styles.expandedCardScroll as string }>
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
index a3e9a95a8e552..333cc80cf73d7 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
@@ -4,12 +4,15 @@ import * as React from 'react';
 import {
   BaseComponent,
   autobind,
-  css,
   divProperties,
   getNativeProps,
   getId,
   getDocument
 } from '../../Utilities';
+import {
+  mergeStyles
+} from '../../Styling';
+
 import { IHoverCardProps, IHoverCardStyles } from './HoverCard.Props';
 import { ExpandingCard } from './ExpandingCard';
 import { ExpandingCardMode } from './ExpandingCard.Props';
@@ -98,7 +101,7 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
 
     return (
       <div
-        className={ css(this._styles.host) }
+        className={ mergeStyles(this._styles.host) }
         ref={ this._resolveRef('_hoverCard') }
         aria-describedby={ setAriaDescribedBy && isHoverCardVisible ? hoverCardId : undefined }
       >
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts b/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
index 2c4e67fa6e2b6..e346b5a2c4bce 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
@@ -37,7 +37,7 @@ export interface IIconProps extends React.HTMLAttributes<HTMLElement> {
   /**
    * The name of the icon to use from the icon font.
    */
-  iconName?: string | null;
+  iconName?: string;
 
   /**
    * Optional styling for the elements within the Icon.
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.classNames.ts b/packages/office-ui-fabric-react/src/components/Icon/Icon.classNames.ts
new file mode 100644
index 0000000000000..bfd36087028c8
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.classNames.ts
@@ -0,0 +1,31 @@
+import {
+  mergeStyleSets
+} from '../../Styling';
+import {
+  memoizeFunction
+} from '../../Utilities';
+import { IIconStyles } from './Icon.Props';
+
+export interface IIconClassNames {
+  root?: string;
+  imageContainer?: string;
+}
+
+export const getClassNames = memoizeFunction((
+  customStyles?: IIconStyles
+): IIconClassNames => {
+  let iconStyles: IIconStyles = {
+    root: {
+      display: 'inline-block'
+    },
+
+    imageContainer: {
+      overflow: 'hidden'
+    }
+  };
+
+  return mergeStyleSets(
+    iconStyles,
+    customStyles
+  );
+});
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.styles.ts b/packages/office-ui-fabric-react/src/components/Icon/Icon.styles.ts
deleted file mode 100644
index 378dd6b49bfcf..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.styles.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-import {
-  mergeStyles,
-  mergeStyleSets,
-  ITheme,
-  getTheme
-} from '../../Styling';
-import {
-  memoizeFunction
-} from '../../Utilities';
-import { IIconStyles } from './Icon.Props';
-
-export const getStyles = memoizeFunction((
-  theme: ITheme = getTheme(),
-  customStyles: IIconStyles | undefined = undefined
-): IIconStyles => {
-  let iconStyles = {
-
-    root: mergeStyles([
-      theme.fonts.icon,
-      {
-        display: 'inline-block'
-      }
-    ]),
-
-    imageContainer: mergeStyles({
-      overflow: 'hidden'
-    })
-  };
-
-  return mergeStyleSets(iconStyles, customStyles)!;
-});
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
index 712a526bb63a8..d0cd26fb8c1d3 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
@@ -1,7 +1,6 @@
 /* tslint:disable */
 import * as React from 'react';
 /* tslint:enable */
-
 import { IIconProps, IconType } from './Icon.Props';
 import { Image } from '../Image/Image';
 import {
@@ -9,25 +8,26 @@ import {
   getNativeProps,
   htmlElementProperties
 } from '../../Utilities';
-import { IconCodes } from '../../Styling';
-import { getStyles } from './Icon.styles';
+import { getIcon, IIconRecord } from '../../Styling';
+import { getClassNames } from './Icon.classNames';
 
 export const Icon = (props: IIconProps): JSX.Element => {
   let {
     ariaLabel,
     className,
-    styles: customStyles,
+    styles,
     iconName
    } = props;
-
-  let styles = getStyles(undefined, customStyles);
+  let classNames = getClassNames(
+    styles
+  );
 
   if (props.iconType === IconType.image || props.iconType === IconType.Image) {
     let containerClassName = css(
       'ms-Icon',
       'ms-Icon-imageContainer',
-      styles.root,
-      styles.imageContainer,
+      classNames.root,
+      classNames.imageContainer,
       className
     );
 
@@ -36,14 +36,19 @@ export const Icon = (props: IIconProps): JSX.Element => {
         className={
           css(
             containerClassName,
-            styles.root
+            classNames.root
           ) }
       >
         <Image { ...props.imageProps as any } />
       </div>
     );
   } else {
-    let iconMemberName = iconName ? iconName.charAt(0).toLowerCase() + iconName.substr(1) : '';
+    let iconDefinition = getIcon(iconName) || {
+      subset: {
+        className: undefined
+      },
+      code: undefined
+    };
 
     return (
       <i
@@ -56,12 +61,13 @@ export const Icon = (props: IIconProps): JSX.Element => {
         { ...getNativeProps(props, htmlElementProperties) }
         className={
           css(
-            'ms-Icon',
-            styles.root,
+            'ms-Icon', // dangerous?
+            iconDefinition.subset.className,
+            classNames.root,
             props.className
           ) }
       >
-        { (IconCodes as any)[iconMemberName] }
+        { iconDefinition.code }
       </i>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Icon/IconName.ts b/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
deleted file mode 100644
index 868afe472af26..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Icon/IconName.ts
+++ /dev/null
@@ -1,923 +0,0 @@
-/**
- * This is being removed from the styling package in Fabric 5 and moved into a dedicated
- * icons package.
- * @deprecated
- */
-export type IconName =
-  // These icons are not in the font.
-  'CustomIcon' |
-  'None' |
-
-  // Icons from the Fabric MDL2 set.
-  'AADLogo' |
-  'Accept' |
-  'AccessLogo' |
-  'AccessLogoFill' |
-  'Accounts' |
-  'ActivityFeed' |
-  'Add' |
-  'AddEvent' |
-  'AddFavorite' |
-  'AddFavoriteFill' |
-  'AddFriend' |
-  'AddGroup' |
-  'AddOnlineMeeting' |
-  'AddPhone' |
-  'AddTo' |
-  'Admin' |
-  'AdminALogo' |
-  'AdminCLogo' |
-  'AdminDLogo' |
-  'AdminELogo' |
-  'AdminLLogo' |
-  'AdminMLogo' |
-  'AdminOLogo' |
-  'AdminPLogo' |
-  'AdminSLogo' |
-  'AdminYLogo' |
-  'Airplane' |
-  'AirTickets' |
-  'AlarmClock' |
-  'Album' |
-  'AlbumRemove' |
-  'AlignCenter' |
-  'AlignLeft' |
-  'AlignRight' |
-  'AnalyticsLogo' |
-  'AnalyticsQuery' |
-  'AnalyticsReport' |
-  'AndroidLogo' |
-  'Annotation' |
-  'AppIconDefault' |
-  'Archive' |
-  'AreaChart' |
-  'Arrivals' |
-  'ArrowDownRight8' |
-  'ArrowDownRightMirrored8' |
-  'ArrowUpRight8' |
-  'ArrowUpRightMirrored8' |
-  'Articles' |
-  'Ascending' |
-  'AssessmentGroup' |
-  'AssetLibrary' |
-  'Assign' |
-  'Asterisk' |
-  'ATPLogo' |
-  'Attach' |
-  'AustralianRules' |
-  'AutoEnhanceOff' |
-  'AutoEnhanceOn' |
-  'AutoFillTemplate' |
-  'AutoRacing' |
-  'AwayStatus' |
-  'AzureLogo' |
-  'Back' |
-  'BackToWindow' |
-  'Badge' |
-  'Balloons' |
-  'BarChart4' |
-  'BarChartHorizontal' |
-  'BarChartVertical' |
-  'Baseball' |
-  'BidiLtr' |
-  'BidiRtl' |
-  'BingLogo' |
-  'BlockContact' |
-  'Blocked' |
-  'Blocked2' |
-  'BlowingSnow' |
-  'Blur' |
-  'Boards' |
-  'Bold' |
-  'BookingsLogo' |
-  'Bookmarks' |
-  'BookmarksMirrored' |
-  'BoxLogo' |
-  'BranchCommit' |
-  'BranchCompare' |
-  'BranchFork' |
-  'BranchFork2' |
-  'BranchLocked' |
-  'BranchMerge' |
-  'BranchPullRequest' |
-  'BranchSearch' |
-  'BranchShelveset' |
-  'Breadcrumb' |
-  'Brightness' |
-  'Broom' |
-  'BucketColor' |
-  'BucketColorFill' |
-  'BufferTimeAfter' |
-  'BufferTimeBefore' |
-  'BufferTimeBoth' |
-  'Build' |
-  'BuildIssue' |
-  'BuildQueue' |
-  'BuildQueueNew' |
-  'BulletedList' |
-  'BulletedListMirrored' |
-  'BusinessHoursSign' |
-  'BusSolid' |
-  'Cafe' |
-  'Cake' |
-  'CalculatorAddition' |
-  'CalculatorSubtract' |
-  'Calendar' |
-  'CalendarAgenda' |
-  'CalendarDay' |
-  'CalendarMirrored' |
-  'CalendarReply' |
-  'CalendarWeek' |
-  'CalendarWorkWeek' |
-  'CaloriesAdd' |
-  'Camera' |
-  'Cancel' |
-  'CannedChat' |
-  'Car' |
-  'CaretBottomLeftSolid8' |
-  'CaretBottomRightSolid8' |
-  'CaretDown8' |
-  'CaretDownSolid8' |
-  'CaretHollow' |
-  'CaretHollowMirrored' |
-  'CaretLeft8' |
-  'CaretLeftSolid8' |
-  'CaretRight' |
-  'CaretRight8' |
-  'CaretRightSolid8' |
-  'CaretSolid' |
-  'CaretSolid16' |
-  'CaretSolidDown' |
-  'CaretSolidLeft' |
-  'CaretSolidMirrored' |
-  'CaretSolidRight' |
-  'CaretSolidUp' |
-  'CaretTopLeftSolid8' |
-  'CaretTopRightSolid8' |
-  'CaretUp8' |
-  'CaretUpSolid8' |
-  'Cat' |
-  'CellPhone' |
-  'Certificate' |
-  'Chart' |
-  'Chat' |
-  'ChatInviteFriend' |
-  'Checkbox' |
-  'CheckboxComposite' |
-  'CheckboxCompositeReversed' |
-  'CheckboxIndeterminate' |
-  'CheckList' |
-  'CheckMark' |
-  'ChevronDown' |
-  'ChevronDownMed' |
-  'ChevronDownSmall' |
-  'ChevronLeft' |
-  'ChevronLeftMed' |
-  'ChevronLeftSmall' |
-  'ChevronRight' |
-  'ChevronRightMed' |
-  'ChevronRightSmall' |
-  'ChevronUp' |
-  'ChevronUpMed' |
-  'ChevronUpSmall' |
-  'ChromeBack' |
-  'ChromeBackMirrored' |
-  'ChromeClose' |
-  'ChromeMinimize' |
-  'CircleFill' |
-  'CircleHalfFull' |
-  'CirclePlus' |
-  'CircleRing' |
-  'ClassNotebookLogoInverse' |
-  'ClassroomLogo' |
-  'Clear' |
-  'ClearFilter' |
-  'ClearFormatting' |
-  'ClearNight' |
-  'Clock' |
-  'CloneToDesktop' |
-  'ClosedCaption' |
-  'ClosePane' |
-  'ClosePaneMirrored' |
-  'Cloud' |
-  'CloudAdd' |
-  'CloudDownload' |
-  'CloudUpload' |
-  'CloudWeather' |
-  'Cloudy' |
-  'Cocktails' |
-  'Code' |
-  'Coffee' |
-  'CollapseContent' |
-  'CollapseContentSingle' |
-  'CollapseMenu' |
-  'CollegeFootball' |
-  'CollegeHoops' |
-  'Color' |
-  'ColumnLeftTwoThirds' |
-  'ColumnOptions' |
-  'ColumnRightTwoThirds' |
-  'Combine' |
-  'Comment' |
-  'CommentUrgent' |
-  'Communications' |
-  'CompassNW' |
-  'Completed' |
-  'CompletedSolid' |
-  'Contact' |
-  'ContactCard' |
-  'ContactInfo' |
-  'Contrast' |
-  'Copy' |
-  'Cotton' |
-  'Cricket' |
-  'CRMReport' |
-  'CSS' |
-  'CustomList' |
-  'CustomListMirrored' |
-  'Cut' |
-  'Cycling' |
-  'DataBarsFill' |
-  'Database' |
-  'DataConnectionLibrary' |
-  'DateTime' |
-  'DateTime2' |
-  'DateTimeMirrored' |
-  'DecreaseIndentLegacy' |
-  'Delete' |
-  'DelveAnalytics' |
-  'DelveAnalyticsLogo' |
-  'DelveLogo' |
-  'DelveLogoFill' |
-  'DelveLogoInverse' |
-  'Deploy' |
-  'Descending' |
-  'Design' |
-  'DeveloperTools' |
-  'Devices3' |
-  'Devices4' |
-  'Dialpad' |
-  'Dictionary' |
-  'DietPlanNotebook' |
-  'DiffInline' |
-  'DiffSideBySide' |
-  'DisableUpdates' |
-  'Dislike' |
-  'Divider' |
-  'DockLeft' |
-  'DockLeftMirrored' |
-  'DockRight' |
-  'DocLibrary' |
-  'DocsLogoInverse' |
-  'Document' |
-  'Documentation' |
-  'DocumentReply' |
-  'DocumentSearch' |
-  'DocumentSet' |
-  'Door' |
-  'DoubleBookmark' |
-  'DoubleChevronDown' |
-  'DoubleChevronDown12' |
-  'DoubleChevronLeft' |
-  'DoubleChevronLeft12' |
-  'DoubleChevronLeftMed' |
-  'DoubleChevronLeftMedMirrored' |
-  'DoubleChevronRight' |
-  'DoubleChevronRight12' |
-  'DoubleChevronUp' |
-  'DoubleChevronUp12' |
-  'DoubleColumn' |
-  'Down' |
-  'Download' |
-  'DRM' |
-  'Drop' |
-  'DropboxLogo' |
-  'Dropdown' |
-  'Duststorm' |
-  'Dynamics365Logo' |
-  'DynamicSMBLogo' |
-  'EatDrink' |
-  'EdgeLogo' |
-  'Edit' |
-  'EditMail' |
-  'EditMirrored' |
-  'EditNote' |
-  'EditPhoto' |
-  'EditStyle' |
-  'Embed' |
-  'EMI' |
-  'Emoji' |
-  'Emoji2' |
-  'EmojiDisappointed' |
-  'EmojiNeutral' |
-  'EmptyRecycleBin' |
-  'Equalizer' |
-  'EraseTool' |
-  'Error' |
-  'ErrorBadge' |
-  'Event' |
-  'EventInfo' |
-  'ExcelDocument' |
-  'ExcelLogo' |
-  'ExcelLogoFill' |
-  'ExcelLogoInverse' |
-  'ExchangeLogo' |
-  'ExchangeLogoFill' |
-  'ExchangeLogoInverse' |
-  'ExpandMenu' |
-  'ExploreContent' |
-  'ExploreContentSingle' |
-  'Export' |
-  'ExportMirrored' |
-  'FabricAssetLibrary' |
-  'FabricDataConnectionLibrary' |
-  'FabricDocLibrary' |
-  'FabricFolder' |
-  'FabricFolderFill' |
-  'FabricFolderSearch' |
-  'FabricFormLibrary' |
-  'FabricFormLibraryMirrored' |
-  'FabricMovetoFolder' |
-  'FabricNewFolder' |
-  'FabricOpenFolderHorizontal' |
-  'FabricPictureLibrary' |
-  'FabricPublicFolder' |
-  'FabricReportLibrary' |
-  'FabricReportLibraryMirrored' |
-  'FabricSyncFolder' |
-  'FabricUnsyncFolder' |
-  'FacebookLogo' |
-  'Family' |
-  'FangBody' |
-  'FastForward' |
-  'Favicon' |
-  'FavoriteList' |
-  'FavoriteStar' |
-  'FavoriteStarFill' |
-  'Fax' |
-  'Ferry' |
-  'FerrySolid' |
-  'FileBug' |
-  'FileCode' |
-  'FileComment' |
-  'FileImage' |
-  'FileSymlink' |
-  'Filter' |
-  'Filters' |
-  'Financial' |
-  'Fingerprint' |
-  'FiveTileGrid' |
-  'Flag' |
-  'FlameSolid' |
-  'FlickDown' |
-  'FlickLeft' |
-  'FlickRight' |
-  'FlickUp' |
-  'Flow' |
-  'FocalPoint' |
-  'Fog' |
-  'Folder' |
-  'FolderFill' |
-  'FolderHorizontal' |
-  'FolderOpen' |
-  'FolderSearch' |
-  'Font' |
-  'FontColor' |
-  'FontDecrease' |
-  'FontIncrease' |
-  'FontSize' |
-  'FormLibrary' |
-  'FormLibraryMirrored' |
-  'Forward' |
-  'ForwardEvent' |
-  'Freezing' |
-  'Frigid' |
-  'FullCircleMask' |
-  'FullHistory' |
-  'FullScreen' |
-  'FullWidth' |
-  'Generate' |
-  'Giftbox' |
-  'GiftboxOpen' |
-  'GiftCard' |
-  'Glasses' |
-  'Glimmer' |
-  'GlobalNavButton' |
-  'Globe' |
-  'GlobeFavorite' |
-  'Golf' |
-  'GoogleDriveLogo' |
-  'GotoToday' |
-  'GripperBarVertical' |
-  'GripperTool' |
-  'Group' |
-  'GroupedAscending' |
-  'GroupedDescending' |
-  'GroupedList' |
-  'HailDay' |
-  'HailNight' |
-  'Handwriting' |
-  'HardDriveGroup' |
-  'Header1' |
-  'Header2' |
-  'Header3' |
-  'Header4' |
-  'Headset' |
-  'Health' |
-  'Heart' |
-  'HeartFill' |
-  'Help' |
-  'HelpMirrored' |
-  'Hide' |
-  'Hide2' |
-  'Highlight' |
-  'HighlightMappedShapes' |
-  'History' |
-  'Home' |
-  'HomeSolid' |
-  'Hospital' |
-  'Hotel' |
-  'IconSetsFlag' |
-  'IconSetsFlagFill' |
-  'ImageDiff' |
-  'ImagePixel' |
-  'Important' |
-  'InboxCheck' |
-  'IncidentTriangle' |
-  'IncreaseIndentLegacy' |
-  'Info' |
-  'Info2' |
-  'InfoSolid' |
-  'InsertTextBox' |
-  'InstallToDrive' |
-  'InternetSharing' |
-  'iOSAppStoreLogo' |
-  'IssueTracking' |
-  'IssueTrackingMirrored' |
-  'Italic' |
-  'JoinOnlineMeeting' |
-  'JS' |
-  'Label' |
-  'LandscapeOrientation' |
-  'LaptopSelected' |
-  'LargeGrid' |
-  'Library' |
-  'Lifesaver' |
-  'LifesaverLock' |
-  'Light' |
-  'Lightbulb' |
-  'LightningBolt' |
-  'Like' |
-  'LikeSolid' |
-  'LineChart' |
-  'Link' |
-  'List' |
-  'ListMirrored' |
-  'Location' |
-  'LocationCircle' |
-  'LocationDot' |
-  'LocationFill' |
-  'Lock' |
-  'LockSolid' |
-  'LogRemove' |
-  'LowerBrightness' |
-  'LyncLogo' |
-  'Mail' |
-  'MailAlert' |
-  'MailCheck' |
-  'MailFill' |
-  'MailForward' |
-  'MailForwardMirrored' |
-  'MailLowImportance' |
-  'MailPause' |
-  'MailRepeat' |
-  'MailReply' |
-  'MailReplyAll' |
-  'MailReplyAllMirrored' |
-  'MailReplyMirrored' |
-  'MapDirections' |
-  'MapPin' |
-  'Market' |
-  'MarketDown' |
-  'Megaphone' |
-  'Memo' |
-  'Merge' |
-  'MergeDuplicate' |
-  'Message' |
-  'MessageFill' |
-  'Microphone' |
-  'MicrosoftStaffhubLogo' |
-  'MiniLink' |
-  'MobileSelected' |
-  'Money' |
-  'More' |
-  'MoreSports' |
-  'MoreVertical' |
-  'Move' |
-  'MoveToFolder' |
-  'MSNLogo' |
-  'MSNVideos' |
-  'MultiSelect' |
-  'MultiSelectMirrored' |
-  'MusicInCollection' |
-  'MusicInCollectionFill' |
-  'MusicNote' |
-  'Nav2DMapView' |
-  'NetworkTower' |
-  'NewAnalyticsQuery' |
-  'NewFolder' |
-  'News' |
-  'Next' |
-  'NoteForward' |
-  'NotePinned' |
-  'NoteReply' |
-  'NumberedList' |
-  'NumberField' |
-  'OfficeAddinsLogo' |
-  'OfficeAssistantLogo' |
-  'OfficeFormLogo' |
-  'OfficeLogo' |
-  'OfficeStoreLogo' |
-  'OfficeVideoLogo' |
-  'OfficeVideoLogoFill' |
-  'OfficeVideoLogoInverse' |
-  'OfflineOneDriveParachute' |
-  'OfflineOneDriveParachuteDisabled' |
-  'OneDrive' |
-  'OneDriveAdd' |
-  'OneNoteEduLogoInverse' |
-  'OneNoteLogo' |
-  'OneNoteLogoFill' |
-  'OneNoteLogoInverse' |
-  'OpenFile' |
-  'OpenFolderHorizontal' |
-  'OpenInNewWindow' |
-  'OpenPane' |
-  'OpenPaneMirrored' |
-  'OpenSource' |
-  'Org' |
-  'OutlookLogo' |
-  'OutlookLogoFill' |
-  'OutlookLogoInverse' |
-  'OutOfOffice' |
-  'Package' |
-  'Packages' |
-  'Page' |
-  'PageAdd' |
-  'PageCheckedin' |
-  'PageCheckedOut' |
-  'PageLeft' |
-  'PageRight' |
-  'PageSolid' |
-  'PanoIndicator' |
-  'Parameter' |
-  'ParatureLogo' |
-  'PartlyCloudyDay' |
-  'PartlyCloudyNight' |
-  'PartyLeader' |
-  'Paste' |
-  'Pause' |
-  'PaymentCard' |
-  'PC1' |
-  'PDF' |
-  'PencilReply' |
-  'People' |
-  'PeopleAdd' |
-  'PeopleAlert' |
-  'PeopleBlock' |
-  'PeoplePause' |
-  'PeopleRepeat' |
-  'Permissions' |
-  'Personalize' |
-  'Phone' |
-  'Photo2' |
-  'Photo2Add' |
-  'Photo2Remove' |
-  'PhotoCollection' |
-  'Picture' |
-  'PictureLibrary' |
-  'PieDouble' |
-  'PieSingle' |
-  'Pill' |
-  'Pin' |
-  'Pinned' |
-  'PinnedFill' |
-  'PivotChart' |
-  'PlannerLogo' |
-  'Play' |
-  'PlayerSettings' |
-  'Plug' |
-  'PlugConnected' |
-  'PlugDisconnected' |
-  'PlugSolid' |
-  'POI' |
-  'PostUpdate' |
-  'PowerApps' |
-  'PowerApps2Logo' |
-  'PowerAppsLogo' |
-  'PowerBILogo' |
-  'PowerPointDocument' |
-  'PowerPointLogo' |
-  'PowerPointLogoFill' |
-  'PowerPointLogoInverse' |
-  'Precipitation' |
-  'PresenceChickletVideo' |
-  'Preview' |
-  'PreviewLink' |
-  'Previous' |
-  'Print' |
-  'PrintfaxPrinterFile' |
-  'Processing' |
-  'ProcessMetaTask' |
-  'Product' |
-  'ProFootball' |
-  'ProgressRingDots' |
-  'ProHockey' |
-  'ProjectLogoInverse' |
-  'ProtectedDocument' |
-  'ProtectRestrict' |
-  'PublicCalendar' |
-  'PublicContactCard' |
-  'PublicEmail' |
-  'PublicFolder' |
-  'PublisherLogo' |
-  'PublisherLogoFill' |
-  'Puzzle' |
-  'Questionnaire' |
-  'QuestionnaireMirrored' |
-  'QuickNote' |
-  'RadioBtnOff' |
-  'RadioBtnOn' |
-  'RadioBullet' |
-  'Rain' |
-  'RainShowersDay' |
-  'RainShowersNight' |
-  'RainSnow' |
-  'RawSource' |
-  'Read' |
-  'ReadingMode' |
-  'ReceiptCheck' |
-  'ReceiptForward' |
-  'ReceiptReply' |
-  'Recent' |
-  'Record2' |
-  'RecurringEvent' |
-  'RecurringTask' |
-  'RecycleBin' |
-  'Redeploy' |
-  'RedEye' |
-  'Redo' |
-  'Refresh' |
-  'ReminderGroup' |
-  'Remove' |
-  'RemoveEvent' |
-  'RemoveFilter' |
-  'RemoveLink' |
-  'RemoveOccurrence' |
-  'Rename' |
-  'ReopenPages' |
-  'Repair' |
-  'Reply' |
-  'ReplyAll' |
-  'ReplyAllAlt' |
-  'ReplyAllMirrored' |
-  'ReplyAlt' |
-  'ReplyMirrored' |
-  'ReportLibrary' |
-  'ReportLibraryMirrored' |
-  'ReturnToSession' |
-  'RevToggleKey' |
-  'Rewind' |
-  'Ribbon' |
-  'RightDoubleQuote' |
-  'Ringer' |
-  'Robot' |
-  'Room' |
-  'Rotate' |
-  'RowsChild' |
-  'RowsGroup' |
-  'Rugby' |
-  'Running' |
-  'Sad' |
-  'Save' |
-  'SaveAll' |
-  'SaveAs' |
-  'ScheduleEventAction' |
-  'Script' |
-  'ScrollUpDown' |
-  'Search' |
-  'Section' |
-  'Sections' |
-  'SecurityGroup' |
-  'Send' |
-  'SendMirrored' |
-  'Server' |
-  'ServerEnviroment' |
-  'ServerProcesses' |
-  'SetAction' |
-  'Settings' |
-  'Share' |
-  'ShareiOS' |
-  'SharepointLogo' |
-  'SharepointLogoFill' |
-  'SharepointLogoInverse' |
-  'Shield' |
-  'Shop' |
-  'ShoppingCart' |
-  'ShowResults' |
-  'ShowResultsMirrored' |
-  'SidePanel' |
-  'SingleBookmark' |
-  'SingleColumn' |
-  'SIPMove' |
-  'SkypeCheck' |
-  'SkypeCircleCheck' |
-  'SkypeCircleClock' |
-  'SkypeCircleMinus' |
-  'SkypeClock' |
-  'SkypeForBusinessLogoFill' |
-  'SkypeLogo' |
-  'SkypeMessage' |
-  'SkypeMinus' |
-  'SliderThumb' |
-  'Snow' |
-  'Snowflake' |
-  'SnowShowerDay' |
-  'SnowShowerNight' |
-  'Soccer' |
-  'SocialListeningLogo' |
-  'Sort' |
-  'SortDown' |
-  'SortLines' |
-  'SortUp' |
-  'Spacer' |
-  'Speakers' |
-  'SpeedHigh' |
-  'Split' |
-  'Squalls' |
-  'StackedBarChart' |
-  'StackedLineChart' |
-  'StackIndicator' |
-  'Starburst' |
-  'StatusErrorFull' |
-  'StatusTriangle' |
-  'Step' |
-  'StepInsert' |
-  'StepShared' |
-  'StepSharedAdd' |
-  'StepSharedInsert' |
-  'StockDown' |
-  'StockUp' |
-  'Stop' |
-  'StopSolid' |
-  'Stopwatch' |
-  'StoreLogo' |
-  'StoreLogoMed' |
-  'Storyboard' |
-  'Streaming' |
-  'StreamLogo' |
-  'Strikethrough' |
-  'Subscribe' |
-  'Subscript' |
-  'Suitcase' |
-  'SunAdd' |
-  'Sunny' |
-  'SunQuestionMark' |
-  'Superscript' |
-  'SwayLogoInverse' |
-  'Switch' |
-  'SwitcherStartEnd' |
-  'Sync' |
-  'SyncFolder' |
-  'SyncToPC' |
-  'System' |
-  'Tab' |
-  'Table' |
-  'Tablet' |
-  'TabletSelected' |
-  'Tag' |
-  'TaskManager' |
-  'TaskManagerMirrored' |
-  'TeamsLogo' |
-  'TeamsLogoFill' |
-  'TeamsLogoInverse' |
-  'Teamwork' |
-  'TemporaryUser' |
-  'Tennis' |
-  'TextBox' |
-  'TextCallout' |
-  'TextCalloutFill' |
-  'TextDocument' |
-  'TextField' |
-  'ThumbnailView' |
-  'ThumbnailViewMirrored' |
-  'Thunderstorms' |
-  'Ticket' |
-  'Tiles' |
-  'Tiles2' |
-  'Timeline' |
-  'Timer' |
-  'ToggleBorder' |
-  'ToggleFilled' |
-  'ToggleThumb' |
-  'Touch' |
-  'TouchPointer' |
-  'Train' |
-  'TrainSolid' |
-  'TransferCall' |
-  'TriangleDown12' |
-  'TriangleLeft12' |
-  'TriangleRight12' |
-  'TriangleSolid' |
-  'TriangleSolidDown12' |
-  'TriangleSolidLeft12' |
-  'TriangleSolidRight12' |
-  'TriangleSolidUp12' |
-  'TriangleUp12' |
-  'TriggerAuto' |
-  'TriggerUser' |
-  'TripleColumn' |
-  'Trophy' |
-  'TurnRight' |
-  'TVMonitor' |
-  'TVMonitorSelected' |
-  'Underline' |
-  'Undo' |
-  'Unfavorite' |
-  'Unknown' |
-  'UnknownCall' |
-  'Unlock' |
-  'UnlockSolid' |
-  'Unpin' |
-  'Unsubscribe' |
-  'UnsyncFolder' |
-  'Up' |
-  'Upload' |
-  'Variable' |
-  'VariableGroup' |
-  'VennDiagram' |
-  'Video' |
-  'VideoSolid' |
-  'View' |
-  'ViewAll' |
-  'ViewAll2' |
-  'ViewDashboard' |
-  'ViewList' |
-  'ViewListGroup' |
-  'ViewListTree' |
-  'VisioDiagram' |
-  'VisioDocument' |
-  'VisioLogo' |
-  'VisioLogoFill' |
-  'VisioLogoInverse' |
-  'VoicemailForward' |
-  'VoicemailReply' |
-  'Volume0' |
-  'Volume1' |
-  'Volume2' |
-  'Volume3' |
-  'VolumeDisabled' |
-  'Waffle' |
-  'Warning' |
-  'Website' |
-  'Weights' |
-  'WifiEthernet' |
-  'WindDirection' |
-  'WindowsLogo' |
-  'WipePhone' |
-  'WordDocument' |
-  'WordLogo' |
-  'WordLogoFill' |
-  'WordLogoInverse' |
-  'Work' |
-  'WorkFlow' |
-  'WorkItem' |
-  'WorkItemBug' |
-  'WorldClock' |
-  'YammerLogo' |
-  'Zoom' |
-  'ZoomIn' |
-  'ZoomOut' |
-  'FilterSolid' |
-  'GridViewSmall' |
-  'GridViewMedium' |
-  'GridViewLarge' |
-  'ThisPc' |
-  'MailUndelivered' |
-  'MailTentative' |
-  'MailTentativeMirrored' |
-  'MailReminder' |
-  'IRMReply' |
-  'IRMReplyMirrored' |
-  'IRMForward' |
-  'IRMForwardMirrored' |
-  'ReceiptUndelivered' |
-  'ReceiptTentative' |
-  'ReceiptTentativeMirrored' |
-  'Inbox' |
-  'VoicemailRM' |
-  'EventAccepted' |
-  'EventTentative' |
-  'EventTentativeMirrored' |
-  'EventDeclined'
-  ;
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Icon/index.ts b/packages/office-ui-fabric-react/src/components/Icon/index.ts
index 8e26cc9e075cc..cef858770bec8 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/index.ts
@@ -1,3 +1,2 @@
 export * from './Icon';
-export * from './Icon.Props';
-export * from './IconName';
\ No newline at end of file
+export * from './Icon.Props';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
index 293cddc8aa28a..5e5b0752e5226 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
@@ -12,9 +12,7 @@ const styles: any = stylesImport;
 
 export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> implements IOverflowSet {
 
-  public refs: {
-    focusZone: FocusZone;
-  };
+  private _focusZone: FocusZone;
 
   public render() {
     let {
@@ -25,7 +23,12 @@ export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> implements
     } = this.props;
 
     return (
-      <FocusZone ref='focusZone' className={ css('ms-OverflowSet', styles.root, className) } direction={ FocusZoneDirection.horizontal } role='menubar' >
+      <FocusZone
+        componentRef={ this._resolveRef('_focusZone') }
+        className={ css('ms-OverflowSet', styles.root, className) }
+        direction={ FocusZoneDirection.horizontal }
+        role='menubar'
+      >
         { items && this._onRenderItems(items) }
         { overflowItems && overflowItems.length > 0 && onRenderOverflowButton(overflowItems) }
       </FocusZone>
@@ -33,7 +36,9 @@ export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> implements
   }
 
   public focus() {
-    this.refs.focusZone.focus();
+    if (this._focusZone) {
+      this._focusZone.focus();
+    }
   }
 
   @autobind
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.scss b/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
index 89045637148ba..2c1a9f1d4109f 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
@@ -250,6 +250,7 @@ $CommandBarHeight: 44px;
 
 .content {
   margin-bottom: 0;
+  padding-bottom: 20px;
   overflow-y: auto;
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
index bcbf4c78dd130..4e1d267589ba7 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
@@ -15,7 +15,6 @@
   flex-direction: row;
   flex-wrap: nowrap;
   align-items: stretch;
-  margin-bottom: 10px;
   @include padding(0, 0, 0, 8px);
   border: 1px solid $ms-color-neutralTertiary;
   height: 32px;
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.scss b/packages/office-ui-fabric-react/src/components/Slider/Slider.scss
index 39a3a55dff091..f28d9295c7a6f 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.scss
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.scss
@@ -2,7 +2,6 @@
 
 .root {
   user-select: none;
-  margin-bottom: 8px;
 }
 
 .titleLabel {
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts
index af1ad386bc16d..5eabb21cccbcc 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts
@@ -40,12 +40,16 @@ export const getClassNames = memoizeFunction((
       _getStyleForRootBasedOnPosition(labelPosition, styles),
       !disabled && [
         {
-          ':hover': styles.spinButtonWrapperHovered
+          selectors: {
+            ':hover': styles.spinButtonWrapperHovered
+          }
         },
         isFocused && {
           // This is to increase the specifity of the focus styles
           // and make it equal to that of the hover styles.
-          '&&': styles.spinButtonWrapperFocused
+          selectors: {
+            '&&': styles.spinButtonWrapperFocused
+          }
         }
       ],
       disabled && styles.spinButtonWrapperDisabled
@@ -54,7 +58,9 @@ export const getClassNames = memoizeFunction((
       'ms-spinButton-input',
       styles.input,
       !disabled && {
-        '::selection': styles.inputTextSelected
+        selectors: {
+          '::selection': styles.inputTextSelected
+        }
       },
       disabled && styles.inputDisabled,
     ) as string,
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
index bfd9b762fa184..29b4f7fdbc3f3 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
@@ -4,13 +4,14 @@ import { ISpinButtonStyles } from './SpinButton.Props';
 
 import {
   ITheme,
-  IStyle,
-  mergeStyleSets,
+  IRawStyle,
+  concatStyleSets,
+  FontSizes
 } from '../../Styling';
 
 const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
 
-const _getDisabledStyles = memoizeFunction((theme: ITheme): IStyle => {
+const _getDisabledStyles = memoizeFunction((theme: ITheme): IRawStyle => {
   const { palette } = theme;
 
   const SpinButtonTextColorDisabled = palette.neutralTertiaryAlt;
@@ -77,7 +78,7 @@ export const getArrowButtonStyles = memoizeFunction((
       }
     },
     rootDisabled: {
-      opacity: '0',
+      opacity: 0,
       [MS_HIGHCONTRAST_ACTIVE]: {
         color: 'GrayText'
       }
@@ -100,7 +101,7 @@ export const getArrowButtonStyles = memoizeFunction((
 
   };
 
-  return mergeStyleSets(
+  return concatStyleSets(
     defaultArrowButtonStyles,
     isUpArrow ? defaultUpArrowButtonStyles : defaultDownArrowButtonStyles,
     customSpecificArrowStyles
@@ -198,7 +199,7 @@ export const getStyles = memoizeFunction((
       marginRight: '0',
       marginBottom: '0',
       marginLeft: '0',
-      fontSize: fonts.medium,
+      fontSize: FontSizes.medium,
       color: SpinButtonInputTextColor,
       height: '100%',
       paddingTop: '3px',
@@ -240,5 +241,5 @@ export const getStyles = memoizeFunction((
     },
     arrowButtonsContainerDisabled: _getDisabledStyles(theme),
   };
-  return mergeStyleSets(defaultStyles, customStyles) as ISpinButtonStyles;
+  return concatStyleSets(defaultStyles, customStyles) as ISpinButtonStyles;
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index 16af04c74da58..0278f8be8cc52 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -9,7 +9,6 @@ import {
   autobind,
   customizable
 } from '../../Utilities';
-import { ThemeSettingName } from '../../Styling';
 import {
   ISpinButton,
   ISpinButtonProps,
@@ -43,7 +42,7 @@ export interface ISpinButtonState {
   keyboardSpinDirection: KeyboardSpinDirection;
 }
 
-@customizable([ThemeSettingName])
+@customizable('SpinButton', ['theme'])
 export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState> implements ISpinButton {
 
   public static defaultProps: ISpinButtonProps = {
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index 2fe80f856de68..1618522b469c6 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -30,7 +30,6 @@ $field-error-color: $errorTextColor;
 // the box containing the label and input field
 .root {
   @include ms-normalize;
-  margin-bottom: 8px;
   position: relative; /* Needed to position icon */
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
index d98be41ff195d..011b316bb60e1 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
@@ -67,7 +67,7 @@ export const getClassNames = memoizeFunction((
 
     pill: [
       'ms-Toggle-background',
-      getFocusStyle(theme, '-1px'),
+      getFocusStyle(theme, -3),
       {
         fontSize: '20px',
         lineHeight: '1em',
@@ -86,13 +86,15 @@ export const getClassNames = memoizeFunction((
       styles.pill,
       !disabled && [
         !checked && {
-          ':hover': [
-            {
-              borderColor: pillBorderHoveredColor
-            },
-            styles.pillHovered
-          ],
-          ':hover .ms-Toggle-thumb': styles.thumbHovered
+          selectors: {
+            ':hover': [
+              {
+                borderColor: pillBorderHoveredColor
+              },
+              styles.pillHovered
+            ],
+            ':hover .ms-Toggle-thumb': styles.thumbHovered
+          }
         },
         checked && [
           {
@@ -101,16 +103,18 @@ export const getClassNames = memoizeFunction((
           },
           styles.pillChecked,
           {
-            ':hover': [
-              {
-                backgroundColor: pillCheckedHoveredBackground,
-                borderColor: 'transparent'
-              },
-              styles.pillCheckedHovered
-            ],
-            ':hover .ms-Toggle-thumb': [
-              styles.thumbCheckedHovered
-            ]
+            selectors: {
+              ':hover': [
+                {
+                  backgroundColor: pillCheckedHoveredBackground,
+                  borderColor: 'transparent'
+                },
+                styles.pillCheckedHovered
+              ],
+              ':hover .ms-Toggle-thumb': [
+                styles.thumbCheckedHovered
+              ]
+            }
           }
         ]
       ],
@@ -180,15 +184,20 @@ export const getClassNames = memoizeFunction((
     text: [
       'ms-Toggle-stateText',
       {
-        '.ms-Toggle-stateText': {
-          padding: '0',
-          margin: '0 10px',
-          userSelect: 'none'
+        selectors: {
+          // Workaround: make rules more sepecific than Label rules.
+          '&&': {
+            padding: '0',
+            margin: '0 10px',
+            userSelect: 'none'
+          }
         }
       },
       disabled && {
-        '.ms-Toggle-stateText': {
-          color: textDisabledColor
+        selectors: {
+          '&&': {
+            color: textDisabledColor
+          }
         }
       },
       styles.text
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
index e23e17a449bed..dfcb2a78a2546 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
@@ -20,7 +20,7 @@ export interface IToggleState {
   isChecked: boolean;
 }
 
-@customizable(['theme'])
+@customizable('Toggle', ['theme'])
 export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements IToggle {
 
   private _id: string;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
index 740786f5740bf..0503f87d5f53c 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
@@ -65,27 +65,30 @@ const data: IFullDocumentCardProps[] = [
       actions:
       [
         {
-          icon: 'Share', onClick: (ev: any) => {
+          iconProps: { iconName: 'Share' },
+          onClick: (ev: any) => {
             console.log('You clicked the share action.');
             ev.preventDefault();
             ev.stopPropagation();
           }
         },
         {
-          icon: 'Pin', onClick: (ev: any) => {
+          iconProps: { iconName: 'Pin' },
+          onClick: (ev: any) => {
             console.log('You clicked the pin action.');
             ev.preventDefault();
             ev.stopPropagation();
           }
         },
         {
-          icon: 'Ringer', onClick: (ev: any) => {
+          iconProps: { iconName: 'Ringer' },
+          onClick: (ev: any) => {
             console.log('You clicked the Ringer action.');
             ev.preventDefault();
             ev.stopPropagation();
           }
         },
-      ]
+      ] as IButtonProps[]
     },
     documentActivityProps: {
       activity: 'Created Feb 23, 2016',
@@ -119,21 +122,24 @@ const data: IFullDocumentCardProps[] = [
       actions:
       [
         {
-          icon: 'Share', onClick: (ev: any) => {
+          iconProps: { iconName: 'Share' },
+          onClick: (ev: any) => {
             console.log('You clicked the share action.');
             ev.preventDefault();
             ev.stopPropagation();
           }
         },
         {
-          icon: 'Pin', onClick: (ev: any) => {
+          iconProps: { iconName: 'Pin' },
+          onClick: (ev: any) => {
             console.log('You clicked the pin action.');
             ev.preventDefault();
             ev.stopPropagation();
           }
         },
         {
-          icon: 'Ringer', onClick: (ev: any) => {
+          iconProps: { iconName: 'Ringer' },
+          onClick: (ev: any) => {
             console.log('You clicked the Ringer action.');
             ev.preventDefault();
             ev.stopPropagation();
@@ -173,21 +179,24 @@ const data: IFullDocumentCardProps[] = [
       actions:
       [
         {
-          icon: 'Share', onClick: (ev: any) => {
+          iconProps: { iconName: 'Share' },
+          onClick: (ev: any) => {
             console.log('You clicked the share action.');
             ev.preventDefault();
             ev.stopPropagation();
           }
         },
         {
-          icon: 'Pin', onClick: (ev: any) => {
+          iconProps: { iconName: 'Pin' },
+          onClick: (ev: any) => {
             console.log('You clicked the pin action.');
             ev.preventDefault();
             ev.stopPropagation();
           }
         },
         {
-          icon: 'Ringer', onClick: (ev: any) => {
+          iconProps: { iconName: 'Ringer' },
+          onClick: (ev: any) => {
             console.log('You clicked the Ringer action.');
             ev.preventDefault();
             ev.stopPropagation();
@@ -227,21 +236,24 @@ const data: IFullDocumentCardProps[] = [
       actions:
       [
         {
-          icon: 'Share', onClick: (ev: any) => {
+          iconProps: { iconName: 'Share' },
+          onClick: (ev: any) => {
             console.log('You clicked the share action.');
             ev.preventDefault();
             ev.stopPropagation();
           }
         },
         {
-          icon: 'Pin', onClick: (ev: any) => {
+          iconProps: { iconName: 'Pin' },
+          onClick: (ev: any) => {
             console.log('You clicked the pin action.');
             ev.preventDefault();
             ev.stopPropagation();
           }
         },
         {
-          icon: 'Ringer', onClick: (ev: any) => {
+          iconProps: { iconName: 'Ringer' },
+          onClick: (ev: any) => {
             console.log('You clicked the Ringer action.');
             ev.preventDefault();
             ev.stopPropagation();
@@ -295,7 +307,8 @@ export const SelectedDocumentItem: (documentProps: IPickerItemProps<IFullDocumen
   if (documentActionsProps) {
     documentActionsProps.actions.forEach((action: IButtonProps) => actions.push(action));
     actions.push({
-      icon: 'Cancel', onClick: (ev: any) => {
+      iconProps: { iconName: 'Cancel' },
+      onClick: (ev: any) => {
         if (documentProps.onRemoveItem) {
           documentProps.onRemoveItem();
         }
diff --git a/packages/office-ui-fabric-react/src/demo/index.tsx b/packages/office-ui-fabric-react/src/demo/index.tsx
index 1f81be09f9a19..118fc00bcbfdc 100644
--- a/packages/office-ui-fabric-react/src/demo/index.tsx
+++ b/packages/office-ui-fabric-react/src/demo/index.tsx
@@ -12,6 +12,10 @@ import { ComponentPage } from '@uifabric/example-app-base';
 import './index.scss';
 import './ColorStyles.scss';
 
+import { initializeIcons } from '@uifabric/icons/lib/index';
+
+initializeIcons('dist/');
+
 setBaseUrl('./dist/');
 ComponentPage.defaultProps.areBadgesVisible = true;
 
diff --git a/packages/office-ui-fabric-react/src/index.ts b/packages/office-ui-fabric-react/src/index.ts
index a865983785e42..c82b7c2b29534 100644
--- a/packages/office-ui-fabric-react/src/index.ts
+++ b/packages/office-ui-fabric-react/src/index.ts
@@ -56,3 +56,11 @@ export * from './TextField';
 export * from './Toggle';
 export * from './Tooltip';
 export * from './Utilities';
+
+// Using the default import, include all icon definitions. Products that care
+// about bundle size should not be using the main entry, until tree shaking
+// is perfected. (Use the top level imports instead.)
+import { initializeIcons } from '@uifabric/icons/lib/index';
+
+// TODO: remove the @beta tag once they're publised to the CDN.
+initializeIcons('//unpkg.com/office-ui-fabric-react@beta/dist/');
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx b/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
index 8de800c3d92b4..3d4e12ba17d52 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
@@ -193,7 +193,7 @@ export class SelectionBasicExample extends React.Component<any, ISelectionBasicE
       {
         key: 'selectAll',
         name: 'Select All',
-        icon: 'check',
+        icon: 'CheckMark',
         onClick: this._onToggleSelectAll
       },
       {
diff --git a/packages/office-ui-fabric-react/tslint.json b/packages/office-ui-fabric-react/tslint.json
index 79de33369b414..cd2e6bac0f4e2 100644
--- a/packages/office-ui-fabric-react/tslint.json
+++ b/packages/office-ui-fabric-react/tslint.json
@@ -21,6 +21,7 @@
     ],
     "no-inferrable-types": [
       false
-    ]
+    ],
+    "no-unused-variable": false
   }
 }
\ No newline at end of file
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 85aabbd68370e..40e74c9338b23 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -358,7 +358,7 @@ Wed, 21 Jun 2017 00:45:41 GMT
 
 ### Minor changes
 
-- Consume latest version of createApp 
+- Consume latest version of createApp
 
 ### Patches
 
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 74d99be77301c..97cad8f5343d3 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "0.24.2",
+  "version": "5.0.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -11,26 +11,17 @@
   },
   "devDependencies": {
     "@types/chai": "3.4.35",
-    "@types/enzyme": "2.8.0",
+    "@types/enzyme": "2.8.8",
     "@types/mocha": "2.2.39",
-    "@types/react": "15.0.38",
-    "@types/react-addons-test-utils": "0.14.18",
-    "@types/react-dom": "15.5.1",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=4.1.1 <5.0.0",
-    "enzyme": "^2.7.0",
-    "es6-promise": "^4.1.0",
-    "es6-weak-map": "^2.0.2",
     "es6-map": "^0.1.5",
-    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
-    "react": "^15.4.2",
-    "react-addons-test-utils": "^15.4.2",
-    "react-dom": "^15.4.2"
+    "es6-weak-map": "^2.0.2",
+    "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/utilities": ">=4.16.0 <5.0.0",
-    "tslib": "^1.7.1",
-    "rtl-css-js": "^1.1.3",
-    "glamor": "^2.20.40"
+    "@microsoft/load-themed-styles": "^1.7.2",
+    "@uifabric/utilities": ">=5.0.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.0.0 <6.0.0",
+    "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/styling/src/classNames/ColorClassNames.ts b/packages/styling/src/classNames/ColorClassNames.ts
index 3b748ba837165..44ed67ef8bf6a 100644
--- a/packages/styling/src/classNames/ColorClassNames.ts
+++ b/packages/styling/src/classNames/ColorClassNames.ts
@@ -1,5 +1,7 @@
-import { mergeStyles } from '../utilities/index';
-import { IRawStyle } from '../interfaces/index';
+import {
+  IRawStyle,
+  mergeStyles
+} from '@uifabric/merge-styles/lib/index';
 import { DefaultPalette } from '../styles/DefaultPalette';
 import { getTheme } from '../styles/index';
 
@@ -333,7 +335,7 @@ function _defineGetter(
       // tslint:disable-next-line:no-any
       const style: IRawStyle = { [cssProperty]: (getTheme().palette as any)[colorName] };
 
-      return mergeStyles(isHover ? { ':hover': style } : style).toString();
+      return mergeStyles(isHover ? { selectors: { ':hover': style } } : style).toString();
     },
     enumerable: true,
     configurable: true
diff --git a/packages/styling/src/classNames/IconClassNames.ts b/packages/styling/src/classNames/IconClassNames.ts
deleted file mode 100644
index d10c22d2775ed..0000000000000
--- a/packages/styling/src/classNames/IconClassNames.ts
+++ /dev/null
@@ -1,37 +0,0 @@
-import { IconCodes, DefaultFontStyles } from '../styles/index';
-import {
-  mergeStyles
-} from '../utilities/mergeStyles';
-
-/**
- * Deprecated: All class names for all Fabric icons.
- * NOTE: This is deprecated, being replaced with a getIconClassName function.
- *
- * @deprecated
- */
-export const IconClassNames: {[key in keyof typeof IconCodes]?: string } = {};
-
-// tslint:disable-next-line:forin
-for (const iconName in IconCodes) {
-  let className: string;
-
-  Object.defineProperty(IconClassNames, iconName, {
-    get: (): string => {
-      if (className === undefined) {
-        className = mergeStyles(
-          DefaultFontStyles.icon,
-          {
-            ':before': {
-              // tslint:disable-next-line:no-any
-              content: `"${(IconCodes as any)[iconName]}"`
-            }
-          }
-        ).toString();
-      }
-
-      return className;
-    },
-    enumerable: true,
-    configurable: true
-  });
-}
diff --git a/packages/styling/src/classNames/index.ts b/packages/styling/src/classNames/index.ts
index d6b1d2298168a..98379c47e2ae0 100644
--- a/packages/styling/src/classNames/index.ts
+++ b/packages/styling/src/classNames/index.ts
@@ -4,9 +4,6 @@ export {
 export {
   FontClassNames
 } from './FontClassNames';
-export {
-  IconClassNames
-} from './IconClassNames';
 export {
   ColorClassNames
 } from './ColorClassNames';
diff --git a/packages/styling/src/glamorExports.ts b/packages/styling/src/glamorExports.ts
deleted file mode 100644
index d6283c815832f..0000000000000
--- a/packages/styling/src/glamorExports.ts
+++ /dev/null
@@ -1,73 +0,0 @@
-import * as Glamor from 'glamor';
-import rtlify from 'rtl-css-js';
-import { IRawStyle, IProcessedStyle } from './interfaces/index';
-import { getRTL } from '@uifabric/utilities/lib/rtl';
-
-interface IGlamorRulePair {
-  selector: string;
-  style: Glamor.CSSProperties;
-}
-
-function _initializeGlamor(): void {
-  // force speedy.
-  // tslint:disable-next-line:no-string-literal no-any
-  if (!(Glamor as any)['styleSheet'] || !(Glamor as any)['styleSheet'].isSpeedy) {
-    // tslint:disable-next-line:no-string-literal no-any
-    (Glamor as any)['speedy'](true);
-  }
-
-  // tslint:disable-next-line:no-string-literal no-any
-  (Glamor as any)['plugins'].add(
-    ({ selector, style }: IGlamorRulePair): IGlamorRulePair => (
-      {
-        selector,
-        style: getRTL() ? rtlify(style) : style
-      }
-    ));
-}
-
-_initializeGlamor();
-
-/**
- * Defines a :before pseudo-selector scoped style object for the given raw style.
- */
-export function before(style: IRawStyle): IProcessedStyle {
-  return Glamor.before(style);
-}
-
-/**
- * Defines a :after pseudo-selector scoped style object for the given raw style.
- */
-export function after(style: IRawStyle): IProcessedStyle {
-  return Glamor.after(style);
-}
-
-/**
- * Defines a style under a rule which is prefixed by the given selector.
- */
-export function parent(selector: string, style: IRawStyle): IProcessedStyle {
-  return Glamor.parent(selector, style);
-}
-
-/**
- * Registers a global rule. Be aware: registering global rules are not scoped;
- * Two versions of a global rule will colide with each other.
- */
-export function insertGlobal(selector: string, style: IRawStyle): void {
-  Glamor.insertGlobal(selector, style);
-}
-
-/**
- * Registers a font face.
- */
-export function fontFace(font: Glamor.FontProperties): string {
-  return Glamor.fontFace(font);
-}
-
-/**
- * Register a keyframe definition and returns the unique name to be used for
- * the animation name.
- */
-export function keyframes(timeline: Glamor.TimeLine): string {
-  return Glamor.keyframes(timeline);
-}
diff --git a/packages/styling/src/index.ts b/packages/styling/src/index.ts
index 9a45f899bb873..12e59990fad16 100644
--- a/packages/styling/src/index.ts
+++ b/packages/styling/src/index.ts
@@ -1,5 +1,6 @@
-export * from './glamorExports';
 export * from './classNames/index';
 export * from './styles/index';
 export * from './utilities/index';
 export * from './interfaces/index';
+
+export * from '@uifabric/merge-styles/lib/index';
diff --git a/packages/styling/src/interfaces/IAnimationStyles.ts b/packages/styling/src/interfaces/IAnimationStyles.ts
index edc39d6fafd02..9371462150e4b 100644
--- a/packages/styling/src/interfaces/IAnimationStyles.ts
+++ b/packages/styling/src/interfaces/IAnimationStyles.ts
@@ -1,4 +1,4 @@
-import { IRawStyle } from './IRawStyle';
+import { IRawStyle } from '@uifabric/merge-styles/lib/index';
 
 /**
  * All Fabric standard animations, exposed as json objects referencing predefined
diff --git a/packages/styling/src/interfaces/IFontStyles.ts b/packages/styling/src/interfaces/IFontStyles.ts
index 4c6ddb9343ae8..d72169280cdd7 100644
--- a/packages/styling/src/interfaces/IFontStyles.ts
+++ b/packages/styling/src/interfaces/IFontStyles.ts
@@ -1,4 +1,4 @@
-import { IRawStyle } from '../interfaces/index';
+import { IRawStyle } from '@uifabric/merge-styles/lib/index';
 
 /**
  * UI Fabric font set.
@@ -15,5 +15,4 @@ export interface IFontStyles {
   xxLarge?: IRawStyle;
   superLarge?: IRawStyle;
   mega?: IRawStyle;
-  icon?: IRawStyle;
 }
diff --git a/packages/styling/src/interfaces/IProcessedStyle.ts b/packages/styling/src/interfaces/IProcessedStyle.ts
deleted file mode 100644
index 0bb6509b64952..0000000000000
--- a/packages/styling/src/interfaces/IProcessedStyle.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-/**
- * CSS style object resulting from the mergeStyles function when given a raw style object.
- */
-export interface IProcessedStyle {
-  /**
-   * Gets the class name for the processed style.
-   */
-  toString: () => string;
-}
diff --git a/packages/styling/src/interfaces/IRawStyle.ts b/packages/styling/src/interfaces/IRawStyle.ts
deleted file mode 100644
index c9deea151cdf7..0000000000000
--- a/packages/styling/src/interfaces/IRawStyle.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export interface IRawStyle {
-  [key: string]: string | number | IRawStyle;
-}
diff --git a/packages/styling/src/interfaces/IStyle.ts b/packages/styling/src/interfaces/IStyle.ts
deleted file mode 100644
index 86f57812b8c69..0000000000000
--- a/packages/styling/src/interfaces/IStyle.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-import { IProcessedStyle } from './IProcessedStyle';
-import { IRawStyle } from './IRawStyle';
-
-/**
- * A style entry which can be represented as a string class name or a processed style
- * object. This is the type returned from mergeStyles utility.
- */
-export type IStyle = IRawStyle | IProcessedStyle | (IRawStyle | IProcessedStyle)[];
diff --git a/packages/styling/src/interfaces/ISwatch.ts b/packages/styling/src/interfaces/ISwatch.ts
deleted file mode 100644
index 6d212a81025c2..0000000000000
--- a/packages/styling/src/interfaces/ISwatch.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-/**
- * Experimental interface:
- *
- * A swatch is a single color code, which pulls from the colors in the theme. A swatch
- * set (ISwatchSet) is a collection of semantic swatches which work in harmony together.
- *
- * @export
- * @interface ISwatch
- */
-export interface ISwatch {
-  palleteKey: string;
-
-  /* If defined, can validate that the resulting color is contrasting enough. */
-  backgroundSwatch: string;
-}
diff --git a/packages/styling/src/interfaces/ISwatchSet.ts b/packages/styling/src/interfaces/ISwatchSet.ts
deleted file mode 100644
index 70bcaf9b3358d..0000000000000
--- a/packages/styling/src/interfaces/ISwatchSet.ts
+++ /dev/null
@@ -1,168 +0,0 @@
-import { ISwatch } from './ISwatch';
-
-/**
- * Experimental interface:
- *
- * A swatch set is a collection of semantic swatches which work in harmony together. Each
- * swatch has a semantic purpose and follows the naming convention:
- *
- * {component}{area}{state}
- *
- * component: (optional) a optional conceptual component, which may align to many variations.
- * area: the area within the component, usually either background or text color.
- * state: one of { Hover, Pressed, Selected, HoverSelected, Disabled, SelectionHighlight or FocusStroke }
- *
- * @export
- * @interface ISwatchSet
- */
-export interface ISwatchSet {
-
-  // Background color in various states.
-
-  background: ISwatch;
-  backgroundHover: ISwatch;
-  backgroundPressed: ISwatch;
-  backgroundSelected: ISwatch;
-  backgroundSelectedHover: ISwatch;
-  backgroundSelectionHighlight: ISwatch;
-
-  // Foreground color.
-
-  text: ISwatch;
-  textRest: ISwatch;
-  textHover: ISwatch;
-  textPressed: ISwatch;
-  textSelected: ISwatch;
-  textDisabled: ISwatch;
-  textSelectionHighlight: ISwatch;
-
-  // Sublabels.
-
-  secondaryText: ISwatch;
-  secondaryTextRest: ISwatch;
-  secondaryTextHover: ISwatch;
-  secondaryTextPressed: ISwatch;
-  secondaryTextSelected: ISwatch;
-
-  // Bold text.
-
-  emphasizedText: ISwatch;
-  emphasizedTextRest: ISwatch;
-  emphasizedTextHover: ISwatch;
-  emphasizedTextPressed: ISwatch;
-  emphasizedTextSelected: ISwatch;
-
-  // Border colors for selected/hover and focus.
-
-  strokeSelectedHover: ISwatch;
-  strokeFocus: ISwatch;
-
-  // Default button background.
-
-  controlBackground: ISwatch;
-  controlBackgroundHover: ISwatch;
-  controlBackgroundPressed: ISwatch;
-  controlBackgroundSelected: ISwatch;
-  controlBackgroundDisabled: ISwatch;
-
-  // Default button foreground.
-
-  controlText: ISwatch;
-  controlTextHover: ISwatch;
-  controlTextPressed: ISwatch;
-  controlTextSelected: ISwatch;
-  controlTextDisabled: ISwatch;
-
-  // Default button stroke.
-
-  controlStroke: ISwatch;
-  controlStrokeHover: ISwatch;
-  controlStrokePressed: ISwatch;
-  controlStrokeSelected: ISwatch;
-  controlStrokeDisabled: ISwatch;
-  controlStrokeFocus: ISwatch;
-
-  // Emphasized (primary) button background.
-
-  emphasizedControlBackground: ISwatch;
-  emphasizedControlBackgroundHover: ISwatch;
-  emphasizedControlBackgroundPressed: ISwatch;
-  emphasizedControlBackgroundSelected: ISwatch;
-  emphasizedControlBackgroundDisabled: ISwatch;
-
-  // Emphasized button foreground.
-
-  emphasizedControlText: ISwatch;
-  emphasizedControlTextHover: ISwatch;
-  emphasizedControlTextPressed: ISwatch;
-  emphasizedControlTextSelected: ISwatch;
-  emphasizedControlTextDisabled: ISwatch;
-
-  // Emphasized button stroke.
-
-  emphasizedControlStroke: ISwatch;
-  emphasizedControlStrokeHover: ISwatch;
-  emphasizedControlStrokePressed: ISwatch;
-  emphasizedControlStrokeSelected: ISwatch;
-  emphasizedControlStrokeDisabled: ISwatch;
-  emphasizedControlStrokeFocus: ISwatch;
-
-  // Subtle control background (TextField, Dropdown, Checkbox, ChoiceGroup)
-
-  subtleControlBackground: ISwatch;
-  subtleControlBackgroundHover: ISwatch;
-  subtleControlBackgroundPressed: ISwatch;
-  subtleControlBackgroundSelected: ISwatch;
-  subtleControlBackgroundDisabled: ISwatch;
-
-  // Subtle control foreground.
-
-  subtleControlText: ISwatch;
-  subtleControlTextHover: ISwatch;
-  subtleControlTextPressed: ISwatch;
-  subtleControlTextSelected: ISwatch;
-  subtleControlTextDisabled: ISwatch;
-
-  // Subtle control stroke.
-
-  subtleControlStroke: ISwatch;
-  subtleControlStrokeHover: ISwatch;
-  subtleControlStrokePressed: ISwatch;
-  subtleControlStrokeSelected: ISwatch;
-  subtleControlStrokeDisabled: ISwatch;
-  subtleControlStrokeFocus: ISwatch;
-
-  // Hyperlinks.
-
-  linkText: ISwatch;
-  linkHover: ISwatch;
-  linkPressed: ISwatch;
-
-  // Active text
-
-  activeText: ISwatch;
-  activeTextHover: ISwatch;
-  activeTextPressed: ISwatch;
-  activeTextSelected: ISwatch;
-
-  // Stroke Only -- Stroke colors to use when the background / foreground doesn't change (Ex: Color Picker Swatches)
-
-  strokeOnlyHover: ISwatch;
-  strokeOnlySelected: ISwatch;
-  strokeOnlyPressed: ISwatch;
-
-  // Error State - Used for error text / foreground color
-  errorText: ISwatch;
-  errorTextHover: ISwatch;
-  errorTextPressed: ISwatch;
-  errorTextSelected: ISwatch;
-
-  // Accent colors
-  accentDark: ISwatch;
-  accentLight: ISwatch;
-  accentEmphasis: ISwatch;
-  accentOutline: ISwatch;
-
-  headerBackground: ISwatch;
-  headerText: ISwatch;
-}
\ No newline at end of file
diff --git a/packages/styling/src/interfaces/index.ts b/packages/styling/src/interfaces/index.ts
index e80c7d3d1ce69..daf0be7b9ff4d 100644
--- a/packages/styling/src/interfaces/index.ts
+++ b/packages/styling/src/interfaces/index.ts
@@ -1,8 +1,5 @@
-export { IProcessedStyle } from './IProcessedStyle';
-export { IRawStyle } from './IRawStyle';
-export { IStyle } from './IStyle';
 export { IAnimationStyles } from './IAnimationStyles';
+export { IFontStyles } from './IFontStyles';
 export { IPalette } from './IPalette';
 export { ISemanticColors } from './ISemanticColors';
-export { IFontStyles } from './IFontStyles';
 export { ITheme, IPartialTheme } from './ITheme';
diff --git a/packages/styling/src/styles/AnimationStyles.ts b/packages/styling/src/styles/AnimationStyles.ts
index 968541748f5b0..74edd2d8412f5 100644
--- a/packages/styling/src/styles/AnimationStyles.ts
+++ b/packages/styling/src/styles/AnimationStyles.ts
@@ -1,6 +1,5 @@
 import { IAnimationStyles } from '../interfaces/index';
-import { IRawStyle } from '../interfaces/index';
-import { keyframes } from '../glamorExports';
+import { IRawStyle, keyframes } from '@uifabric/merge-styles/lib/index';
 
 /* Register the keyframes */
 
@@ -122,6 +121,7 @@ export const AnimationStyles: IAnimationStyles = {
   fadeOut200: _createAnimation(FADE_OUT, DURATION_2, EASING_FUNCTION_2),
   fadeOut400: _createAnimation(FADE_OUT, DURATION_3, EASING_FUNCTION_2),
   fadeOut500: _createAnimation(FADE_OUT, DURATION_4, EASING_FUNCTION_2),
+
   rotate90deg: _createAnimation(ROTATE90, '0.1s', EASING_FUNCTION_2),
   rotateN90deg: _createAnimation(ROTATE_N90, '0.1s', EASING_FUNCTION_2)
 
diff --git a/packages/styling/src/styles/DefaultFontStyles.ts b/packages/styling/src/styles/DefaultFontStyles.ts
index 627d1476bf476..deb3e2f13c1fc 100644
--- a/packages/styling/src/styles/DefaultFontStyles.ts
+++ b/packages/styling/src/styles/DefaultFontStyles.ts
@@ -1,5 +1,12 @@
-import { IFontStyles, IRawStyle } from '../interfaces/index';
-import { fontFace } from '../glamorExports';
+import {
+  fontFace,
+  IRawStyle,
+  IFontWeight
+} from '@uifabric/merge-styles/lib/index';
+import {
+  IFontStyles
+} from '../interfaces/index';
+
 import { getLanguage } from '@uifabric/utilities/lib/language';
 import { IFabricConfig } from '../interfaces/IFabricConfig';
 
@@ -64,8 +71,6 @@ const LanguageToFontMap = {
   'zh-hant': FontFamilyChineseTraditional,
 };
 
-const FontFileVersion = 2.38;
-
 // Standard font sizes.
 export namespace FontSizes {
   export const mini = '10px';
@@ -103,12 +108,7 @@ export const DefaultFontStyles: IFontStyles = {
   xLarge: _createFont(FontSizes.xLarge, FontWeights.light),
   xxLarge: _createFont(FontSizes.xxLarge, FontWeights.light),
   superLarge: _createFont(FontSizes.superLarge, FontWeights.light),
-  mega: _createFont(FontSizes.mega, FontWeights.light),
-  icon: {
-    fontFamily: '"FabricMDL2Icons"',
-    fontWeight: FontWeights.regular,
-    fontStyle: 'normal'
-  }
+  mega: _createFont(FontSizes.mega, FontWeights.light)
 };
 
 function _getFontFamily(): string {
@@ -126,7 +126,7 @@ function _getFontFamily(): string {
   return `${fontFamily}, ${FontFamilyFallbacks}`;
 }
 
-function _createFont(size: string, weight: number): IRawStyle {
+function _createFont(size: string, weight: IFontWeight): IRawStyle {
   return {
     fontFamily: _getFontFamily(),
     MozOsxFontSmoothing: 'grayscale',
@@ -139,7 +139,7 @@ function _createFont(size: string, weight: number): IRawStyle {
 function _registerFontFace(
   fontFamily: string,
   url: string,
-  fontWeight?: number
+  fontWeight?: IFontWeight
 ): void {
   fontFamily = `'${fontFamily}'`;
 
@@ -172,7 +172,6 @@ function _registerDefaultFontFaces(): void {
 
   if (baseUrl) {
     const fontUrl = `${baseUrl}/fonts`;
-    const iconUrl = `${baseUrl}/icons`;
 
     // Produce @font-face definitions for all supported web fonts.
     _registerFontFaceSet(fontUrl, FontNameThai, 'leelawadeeui-thai', 'leelawadeeui');
@@ -192,9 +191,6 @@ function _registerDefaultFontFaces(): void {
     // Leelawadee UI (Thai) does not have a 'semibold' weight, so we override
     // the font-face generated above to use the 'bold' weight instead.
     _registerFontFace('Leelawadee UI Web', `${fontUrl}/leelawadeeui-thai/leelawadeeui-bold`, FontWeights.semibold);
-
-    // Register icon urls.
-    _registerFontFace('FabricMDL2Icons', `${iconUrl}/fabricmdl2icons-${FontFileVersion}`, FontWeights.regular);
   }
 }
 
diff --git a/packages/styling/src/styles/IconCodes.ts b/packages/styling/src/styles/IconCodes.ts
deleted file mode 100644
index 27ad3cbb015a5..0000000000000
--- a/packages/styling/src/styles/IconCodes.ts
+++ /dev/null
@@ -1,2987 +0,0 @@
-/**
- * This is being removed in Fabric 5 due to the need to support arbitrary icon names
- * for variable subsetting. Please use getIconClassName if you need the icon code, or
- * render an <Icon /> component which will abstract how the icon is rendered.
- * @deprecated
- */
-export const IconCodes = {
-  /**
-   * Icon code with the value '\uED68'.
-   */
-  aadLogo: '\uED68',
-  /**
-   * Icon code with the value '\uE8FB'.
-   */
-  accept: '\uE8FB',
-  /**
-   * Icon code with the value '\uED69'.
-   */
-  accessLogo: '\uED69',
-  /**
-   * Icon code with the value '\uE910'.
-   */
-  accounts: '\uE910',
-  /**
-   * Icon code with the value '\uE710'.
-   */
-  add: '\uE710',
-  /**
-   * Icon code with the value '\uEEB5'.
-   */
-  addEvent: '\uEEB5',
-  /**
-   * Icon code with the value '\uF0C8'.
-   */
-  addFavorite: '\uF0C8',
-  /**
-   * Icon code with the value '\uF0C9'.
-   */
-  addFavoriteFill: '\uF0C9',
-  /**
-   * Icon code with the value '\uE8FA'.
-   */
-  addFriend: '\uE8FA',
-  /**
-   * Icon code with the value '\uEE3D'.
-   */
-  addGroup: '\uEE3D',
-  /**
-   * Icon code with the value '\uED8E'.
-   */
-  addOnlineMeeting: '\uED8E',
-  /**
-   * Icon code with the value '\uED96'.
-   */
-  addPhone: '\uED96',
-  /**
-   * Icon code with the value '\uECC8'.
-   */
-  addTo: '\uECC8',
-  /**
-   * Icon code with the value '\uE7EF'.
-   */
-  admin: '\uE7EF',
-  /**
-   * Icon code with the value '\uED6A'.
-   */
-  adminALogo: '\uED6A',
-  /**
-   * Icon code with the value '\uED6B'.
-   */
-  adminCLogo: '\uED6B',
-  /**
-   * Icon code with the value '\uED6C'.
-   */
-  adminDLogo: '\uED6C',
-  /**
-   * Icon code with the value '\uED6D'.
-   */
-  adminELogo: '\uED6D',
-  /**
-   * Icon code with the value '\uED6E'.
-   */
-  adminLLogo: '\uED6E',
-  /**
-   * Icon code with the value '\uED6F'.
-   */
-  adminMLogo: '\uED6F',
-  /**
-   * Icon code with the value '\uED70'.
-   */
-  adminOLogo: '\uED70',
-  /**
-   * Icon code with the value '\uED71'.
-   */
-  adminPLogo: '\uED71',
-  /**
-   * Icon code with the value '\uED72'.
-   */
-  adminSLogo: '\uED72',
-  /**
-   * Icon code with the value '\uED73'.
-   */
-  adminYLogo: '\uED73',
-  /**
-   * Icon code with the value '\uEF7A'.
-   */
-  airTickets: '\uEF7A',
-  /**
-   * Icon code with the value '\uE709'.
-   */
-  airplane: '\uE709',
-  /**
-   * Icon code with the value '\uE919'.
-   */
-  alarmClock: '\uE919',
-  /**
-   * Icon code with the value '\uE7AB'.
-   */
-  album: '\uE7AB',
-  /**
-   * Icon code with the value '\uEC62'.
-   */
-  albumRemove: '\uEC62',
-  /**
-   * Icon code with the value '\uED74'.
-   */
-  alchemyLogo: '\uED74',
-  /**
-   * Icon code with the value '\uE8E3'.
-   */
-  alignCenter: '\uE8E3',
-  /**
-   * Icon code with the value '\uE8E4'.
-   */
-  alignLeft: '\uE8E4',
-  /**
-   * Icon code with the value '\uE8E2'.
-   */
-  alignRight: '\uE8E2',
-  /**
-   * Icon code with the value '\uEF8B'.
-   */
-  androidLogo: '\uEF8B',
-  /**
-   * Icon code with the value '\uE924'.
-   */
-  annotation: '\uE924',
-  /**
-   * Icon code with the value '\uEEC7'.
-   */
-  appForOfficeLogo: '\uEEC7',
-  /**
-   * Icon code with the value '\uECAA'.
-   */
-  appIconDefault: '\uECAA',
-  /**
-   * Icon code with the value '\uEB34'.
-   */
-  arrivals: '\uEB34',
-  /**
-   * Icon code with the value '\uEED5'.
-   */
-  arrowDownRight8: '\uEED5',
-  /**
-   * Icon code with the value '\uEEF0'.
-   */
-  arrowDownRightMirrored8: '\uEEF0',
-  /**
-   * Icon code with the value '\uEED4'.
-   */
-  arrowUpRight8: '\uEED4',
-  /**
-   * Icon code with the value '\uEEEF'.
-   */
-  arrowUpRightMirrored8: '\uEEEF',
-  /**
-   * Icon code with the value '\uEAC1'.
-   */
-  articles: '\uEAC1',
-  /**
-   * Icon code with the value '\uEDC0'.
-   */
-  ascending: '\uEDC0',
-  /**
-   * Icon code with the value '\uEEB6'.
-   */
-  assetLibrary: '\uEEB6',
-  /**
-   * Icon code with the value '\uEA38'.
-   */
-  asterisk: '\uEA38',
-  /**
-   * Icon code with the value '\uEF85'.
-   */
-  atpLogo: '\uEF85',
-  /**
-   * Icon code with the value '\uE723'.
-   */
-  attach: '\uE723',
-  /**
-   * Icon code with the value '\uEE70'.
-   */
-  australianRules: '\uEE70',
-  /**
-   * Icon code with the value '\uE78E'.
-   */
-  autoEnhanceOff: '\uE78E',
-  /**
-   * Icon code with the value '\uE78D'.
-   */
-  autoEnhanceOn: '\uE78D',
-  /**
-   * Icon code with the value '\uEB24'.
-   */
-  autoRacing: '\uEB24',
-  /**
-   * Icon code with the value '\uEE6A'.
-   */
-  awayStatus: '\uEE6A',
-  /**
-   * Icon code with the value '\uEB6A'.
-   */
-  azureLogo: '\uEB6A',
-  /**
-   * Icon code with the value '\uE72B'.
-   */
-  back: '\uE72B',
-  /**
-   * Icon code with the value '\uE73F'.
-   */
-  backToWindow: '\uE73F',
-  /**
-   * Icon code with the value '\uEC1B'.
-   */
-  badge: '\uEC1B',
-  /**
-   * Icon code with the value '\uED7E'.
-   */
-  balloons: '\uED7E',
-  /**
-   * Icon code with the value '\uEAE7'.
-   */
-  barChart4: '\uEAE7',
-  /**
-   * Icon code with the value '\uE9EB'.
-   */
-  barChartHorizontal: '\uE9EB',
-  /**
-   * Icon code with the value '\uEB20'.
-   */
-  baseball: '\uEB20',
-  /**
-   * Icon code with the value '\uE9AA'.
-   */
-  bidiLtr: '\uE9AA',
-  /**
-   * Icon code with the value '\uE9AB'.
-   */
-  bidiRtl: '\uE9AB',
-  /**
-   * Icon code with the value '\uEB6B'.
-   */
-  bingLogo: '\uEB6B',
-  /**
-   * Icon code with the value '\uE8F8'.
-   */
-  blockContact: '\uE8F8',
-  /**
-   * Icon code with the value '\uECE4'.
-   */
-  blocked2: '\uECE4',
-  /**
-   * Icon code with the value '\uE733'.
-   */
-  blocked: '\uE733',
-  /**
-   * Icon code with the value '\uE9C9'.
-   */
-  blowingSnow: '\uE9C9',
-  /**
-   * Icon code with the value '\uEF68'.
-   */
-  boards: '\uEF68',
-  /**
-   * Icon code with the value '\uE8DD'.
-   */
-  bold: '\uE8DD',
-  /**
-   * Icon code with the value '\uEDC7'.
-   */
-  bookingsLogo: '\uEDC7',
-  /**
-   * Icon code with the value '\uE8A4'.
-   */
-  bookmarks: '\uE8A4',
-  /**
-   * Icon code with the value '\uEA41'.
-   */
-  bookmarksMirrored: '\uEA41',
-  /**
-   * Icon code with the value '\uED75'.
-   */
-  boxLogo: '\uED75',
-  /**
-   * Icon code with the value '\uF173'.
-   */
-  branchFork: '\uF173',
-  /**
-   * Icon code with the value '\uEF8C'.
-   */
-  breadcrumb: '\uEF8C',
-  /**
-   * Icon code with the value '\uE706'.
-   */
-  brightness: '\uE706',
-  /**
-   * Icon code with the value '\uEA99'.
-   */
-  broom: '\uEA99',
-  /**
-   * Icon code with the value '\uF24F'.
-   */
-  buildQueue: '\uF24F',
-  /**
-   * Icon code with the value '\uF0D0'.
-   */
-  bufferTimeAfter: '\uF0D0',
-  /**
-   * Icon code with the value '\uF0CF'.
-   */
-  bufferTimeBefore: '\uF0CF',
-  /**
-   * Icon code with the value '\uF0D1'.
-   */
-  bufferTimeBoth: '\uF0D1',
-  /**
-   * Icon code with the value '\uE8FD'.
-   */
-  bulletedList: '\uE8FD',
-  /**
-   * Icon code with the value '\uEA42'.
-   */
-  bulletedListMirrored: '\uEA42',
-  /**
-   * Icon code with the value '\uEB47'.
-   */
-  busSolid: '\uEB47',
-  /**
-   * Icon code with the value '\uEC32'.
-   */
-  cafe: '\uEC32',
-  /**
-   * Icon code with the value '\uECA4'.
-   */
-  cake: '\uECA4',
-  /**
-   * Icon code with the value '\uE948'.
-   */
-  calculatorAddition: '\uE948',
-  /**
-   * Icon code with the value '\uE949'.
-   */
-  calculatorSubtract: '\uE949',
-  /**
-   * Icon code with the value '\uE787'.
-   */
-  calendar: '\uE787',
-  /**
-   * Icon code with the value '\uEE9A'.
-   */
-  calendarAgenda: '\uEE9A',
-  /**
-   * Icon code with the value '\uE8BF'.
-   */
-  calendarDay: '\uE8BF',
-  /**
-   * Icon code with the value '\uED28'.
-   */
-  calendarMirrored: '\uED28',
-  /**
-   * Icon code with the value '\uE8F5'.
-   */
-  calendarReply: '\uE8F5',
-  /**
-   * Icon code with the value '\uE8C0'.
-   */
-  calendarWeek: '\uE8C0',
-  /**
-   * Icon code with the value '\uEF51'.
-   */
-  calendarWorkWeek: '\uEF51',
-  /**
-   * Icon code with the value '\uF172'.
-   */
-  caloriesAdd: '\uF172',
-  /**
-   * Icon code with the value '\uE722'.
-   */
-  camera: '\uE722',
-  /**
-   * Icon code with the value '\uE711'.
-   */
-  cancel: '\uE711',
-  /**
-   * Icon code with the value '\uE804'.
-   */
-  car: '\uE804',
-  /**
-   * Icon code with the value '\uF121'.
-   */
-  caretBottomLeftSolid8: '\uF121',
-  /**
-   * Icon code with the value '\uF122'.
-   */
-  caretBottomRightSolid8: '\uF122',
-  /**
-   * Icon code with the value '\uEDD8'.
-   */
-  caretDown8: '\uEDD8',
-  /**
-   * Icon code with the value '\uEDDC'.
-   */
-  caretDownSolid8: '\uEDDC',
-  /**
-   * Icon code with the value '\uE817'.
-   */
-  caretHollow: '\uE817',
-  /**
-   * Icon code with the value '\uEA45'.
-   */
-  caretHollowMirrored: '\uEA45',
-  /**
-   * Icon code with the value '\uEDD5'.
-   */
-  caretLeft8: '\uEDD5',
-  /**
-   * Icon code with the value '\uEDD9'.
-   */
-  caretLeftSolid8: '\uEDD9',
-  /**
-   * Icon code with the value '\uEDD6'.
-   */
-  caretRight8: '\uEDD6',
-  /**
-   * Icon code with the value '\uEDDA'.
-   */
-  caretRightSolid8: '\uEDDA',
-  /**
-   * Icon code with the value '\uE818'.
-   */
-  caretSolid: '\uE818',
-  /**
-   * Icon code with the value '\uEA46'.
-   */
-  caretSolidMirrored: '\uEA46',
-  /**
-   * Icon code with the value '\uEF54'.
-   */
-  caretTopLeftSolid8: '\uEF54',
-  /**
-   * Icon code with the value '\uEF55'.
-   */
-  caretTopRightSolid8: '\uEF55',
-  /**
-   * Icon code with the value '\uEDD7'.
-   */
-  caretUp8: '\uEDD7',
-  /**
-   * Icon code with the value '\uEDDB'.
-   */
-  caretUpSolid8: '\uEDDB',
-  /**
-   * Icon code with the value '\uED7F'.
-   */
-  cat: '\uED7F',
-  /**
-   * Icon code with the value '\uE8EA'.
-   */
-  cellPhone: '\uE8EA',
-  /**
-   * Icon code with the value '\uEB95'.
-   */
-  certificate: '\uEB95',
-  /**
-   * Icon code with the value '\uE999'.
-   */
-  chart: '\uE999',
-  /**
-   * Icon code with the value '\uE901'.
-   */
-  chat: '\uE901',
-  /**
-   * Icon code with the value '\uECFE'.
-   */
-  chatInviteFriend: '\uECFE',
-  /**
-   * Icon code with the value '\uE9D5'.
-   */
-  checkList: '\uE9D5',
-  /**
-   * Icon code with the value '\uE73E'.
-   */
-  checkMark: '\uE73E',
-  /**
-   * Icon code with the value '\uE739'.
-   */
-  checkbox: '\uE739',
-  /**
-   * Icon code with the value '\uE73A'.
-   */
-  checkboxComposite: '\uE73A',
-  /**
-   * Icon code with the value '\uE73C'.
-   */
-  checkboxIndeterminate: '\uE73C',
-  /**
-   * Icon code with the value '\uE70D'.
-   */
-  chevronDown: '\uE70D',
-  /**
-   * Icon code with the value '\uE972'.
-   */
-  chevronDownMed: '\uE972',
-  /**
-   * Icon code with the value '\uE96E'.
-   */
-  chevronDownSmall: '\uE96E',
-  /**
-   * Icon code with the value '\uE76B'.
-   */
-  chevronLeft: '\uE76B',
-  /**
-   * Icon code with the value '\uE973'.
-   */
-  chevronLeftMed: '\uE973',
-  /**
-   * Icon code with the value '\uE96F'.
-   */
-  chevronLeftSmall: '\uE96F',
-  /**
-   * Icon code with the value '\uE76C'.
-   */
-  chevronRight: '\uE76C',
-  /**
-   * Icon code with the value '\uE974'.
-   */
-  chevronRightMed: '\uE974',
-  /**
-   * Icon code with the value '\uE970'.
-   */
-  chevronRightSmall: '\uE970',
-  /**
-   * Icon code with the value '\uE70E'.
-   */
-  chevronUp: '\uE70E',
-  /**
-   * Icon code with the value '\uE971'.
-   */
-  chevronUpMed: '\uE971',
-  /**
-   * Icon code with the value '\uE96D'.
-   */
-  chevronUpSmall: '\uE96D',
-  /**
-   * Icon code with the value '\uE830'.
-   */
-  chromeBack: '\uE830',
-  /**
-   * Icon code with the value '\uEA47'.
-   */
-  chromeBackMirrored: '\uEA47',
-  /**
-   * Icon code with the value '\uE8BB'.
-   */
-  chromeClose: '\uE8BB',
-  /**
-   * Icon code with the value '\uE921'.
-   */
-  chromeMinimize: '\uE921',
-  /**
-   * Icon code with the value '\uEA3B'.
-   */
-  circleFill: '\uEA3B',
-  /**
-   * Icon code with the value '\uED9E'.
-   */
-  circleHalfFull: '\uED9E',
-  /**
-   * Icon code with the value '\uEAEE'.
-   */
-  circlePlus: '\uEAEE',
-  /**
-   * Icon code with the value '\uEA3A'.
-   */
-  circleRing: '\uEA3A',
-  /**
-   * Icon code with the value '\uEDC8'.
-   */
-  classNotebookLogo: '\uEDC8',
-  /**
-   * Icon code with the value '\uEF75'.
-   */
-  classroomLogo: '\uEF75',
-  /**
-   * Icon code with the value '\uE894'.
-   */
-  clear: '\uE894',
-  /**
-   * Icon code with the value '\uEF8F'.
-   */
-  clearFilter: '\uEF8F',
-  /**
-   * Icon code with the value '\uEDDD'.
-   */
-  clearFormatting: '\uEDDD',
-  /**
-   * Icon code with the value '\uE9C2'.
-   */
-  clearNight: '\uE9C2',
-  /**
-   * Icon code with the value '\uE917'.
-   */
-  clock: '\uE917',
-  /**
-   * Icon code with the value '\uE89F'.
-   */
-  closePane: '\uE89F',
-  /**
-   * Icon code with the value '\uEA49'.
-   */
-  closePaneMirrored: '\uEA49',
-  /**
-   * Icon code with the value '\uEF84'.
-   */
-  closedCaption: '\uEF84',
-  /**
-   * Icon code with the value '\uECA9'.
-   */
-  cloudAdd: '\uECA9',
-  /**
-   * Icon code with the value '\uEBD3'.
-   */
-  cloudDownload: '\uEBD3',
-  /**
-   * Icon code with the value '\uEC8E'.
-   */
-  cloudUpload: '\uEC8E',
-  /**
-   * Icon code with the value '\uE9BE'.
-   */
-  cloudWeather: '\uE9BE',
-  /**
-   * Icon code with the value '\uE9BF'.
-   */
-  cloudy: '\uE9BF',
-  /**
-   * Icon code with the value '\uEA9D'.
-   */
-  cocktails: '\uEA9D',
-  /**
-   * Icon code with the value '\uE943'.
-   */
-  code: '\uE943',
-  /**
-   * Icon code with the value '\uEAEF'.
-   */
-  coffee: '\uEAEF',
-  /**
-   * Icon code with the value '\uEDC9'.
-   */
-  collabsDbLogo: '\uEDC9',
-  /**
-   * Icon code with the value '\uEF66'.
-   */
-  collapseMenu: '\uEF66',
-  /**
-   * Icon code with the value '\uEB26'.
-   */
-  collegeFootball: '\uEB26',
-  /**
-   * Icon code with the value '\uEB25'.
-   */
-  collegeHoops: '\uEB25',
-  /**
-   * Icon code with the value '\uE790'.
-   */
-  color: '\uE790',
-  /**
-   * Icon code with the value '\uEDBB'.
-   */
-  combine: '\uEDBB',
-  /**
-   * Icon code with value '\uE90A'.
-   */
-  comment: '\uE90A',
-  /**
-   * Icon code with the value '\uE942'.
-   */
-  compassNW: '\uE942',
-  /**
-   * Icon code with the value '\uE930'.
-   */
-  completed: '\uE930',
-  /**
-   * Icon code with the value '\uEC61'.
-   */
-  completedSolid: '\uEC61',
-  /**
-   * Icon code with the value '\uE77B'.
-   */
-  contact: '\uE77B',
-  /**
-   * Icon code with the value '\uEEBD'.
-   */
-  contactCard: '\uEEBD',
-  /**
-   * Icon code with the value '\uE779'.
-   */
-  contactInfo: '\uE779',
-  /**
-   * Icon code with the value '\uE7B8'.
-   */
-  container: '\uE7B8',
-  /**
-   * Icon code with the value '\uE7A1'.
-   */
-  contrast: '\uE7A1',
-  /**
-   * Icon code with the value '\uE8C8'.
-   */
-  copy: '\uE8C8',
-  /**
-   * Icon code with the value '\uEAF3'.
-   */
-  cotton: '\uEAF3',
-  /**
-   * Icon code with the value '\uEB1E'.
-   */
-  cricket: '\uEB1E',
-  /**
-   * Icon code with the value '\uEBEF'.
-   */
-  css: '\uEBEF',
-  /**
-   * Icon code with the value '\uEEBE'.
-   */
-  customList: '\uEEBE',
-  /**
-   * Icon code with the value '\uEEBF'.
-   */
-  customListMirrored: '\uEEBF',
-  /**
-   * Icon code with the value '\uEAC7'.
-   */
-  cycling: '\uEAC7',
-  /**
-   * Icon code with the value '\uEEB7'.
-   */
-  dataConnectionLibrary: '\uEEB7',
-  /**
-   * Icon code with the value '\uEA17'.
-   */
-  dateTime2: '\uEA17',
-  /**
-   * Icon code with the value '\uEC92'.
-   */
-  dateTime: '\uEC92',
-  /**
-   * Icon code with the value '\uEE93'.
-   */
-  dateTimeMirrored: '\uEE93',
-  /**
-   * Icon code with the value '\uE290'.
-   */
-  decreaseIndentLegacy: '\uE290',
-  /**
-   * Icon code with the value '\uEEEE'.
-   */
-  delveAnalytics: '\uEEEE',
-  /**
-   * Icon code with the value '\uEDCA'.
-   */
-  delveAnalyticsLogo: '\uEDCA',
-  /**
-   * Icon code with the value '\uED76'.
-   */
-  delveLogo: '\uED76',
-  /**
-   * Icon code with the value '\uF29D'.
-   */
-  deploy: '\uF29D',
-  /**
-   * Icon code with the value '\uEDC1'.
-   */
-  descending: '\uEDC1',
-  /**
-   * Icon code with the value '\uEB3C'.
-   */
-  design: '\uEB3C',
-  /**
-   * Icon code with the value '\uEC7A'.
-   */
-  developerTools: '\uEC7A',
-  /**
-   * Icon code with the value '\uEA6C'.
-   */
-  devices3: '\uEA6C',
-  /**
-   * Icon code with the value '\uEB66'.
-   */
-  devices4: '\uEB66',
-  /**
-   * Icon code with the value '\uE75F'.
-   */
-  dialpad: '\uE75F',
-  /**
-   * Icon code with the value '\uE82D'.
-   */
-  dictionary: '\uE82D',
-  /**
-   * Icon code with the value '\uEAC8'.
-   */
-  dietPlanNotebook: '\uEAC8',
-  /**
-   * Icon code with the value '\uE8D8'.
-   */
-  disableUpdates: '\uE8D8',
-  /**
-   * Icon code with the value '\uE8E0'.
-   */
-  dislike: '\uE8E0',
-  /**
-   * Icon code with the value '\uE949'.
-   */
-  divider: '\uE949',
-  /**
-   * Icon code with the value '\uEEB8'.
-   */
-  docLibrary: '\uEEB8',
-  /**
-   * Icon code with the value '\uE90C'.
-   */
-  dockLeft: '\uE90C',
-  /**
-   * Icon code with the value '\uEA4C'.
-   */
-  dockLeftMirrored: '\uEA4C',
-  /**
-   * Icon code with the value '\uE90D'.
-   */
-  dockRight: '\uE90D',
-  /**
-   * Icon code with the value '\uEDCB'.
-   */
-  docsLogo: '\uEDCB',
-  /**
-   * Icon code with the value '\uE8A5'.
-   */
-  document: '\uE8A5',
-  /**
-   * Icon code with the value '\uEF57'.
-   */
-  documentReply: '\uEF57',
-  /**
-   * Icon code with the value '\uEF6C'.
-   */
-  documentSearch: '\uEF6C',
-  /**
-   * Icon code with the value '\uEED6'.
-   */
-  documentSet: '\uEED6',
-  /**
-   * Icon code with the value '\uEC17'.
-   */
-  documentation: '\uEC17',
-  /**
-   * Icon code with the value '\uEB75'.
-   */
-  door: '\uEB75',
-  /**
-   * Icon code with the value '\uEB8F'.
-   */
-  doubleBookmark: '\uEB8F',
-  /**
-   * Icon code with the value '\uEE97'.
-   */
-  doubleChevronDown12: '\uEE97',
-  /**
-   * Icon code with the value '\uEE04'.
-   */
-  doubleChevronDown: '\uEE04',
-  /**
-   * Icon code with the value '\uEE98'.
-   */
-  doubleChevronLeft12: '\uEE98',
-  /**
-   * Icon code with the value '\uEDBE'.
-   */
-  doubleChevronLeft: '\uEDBE',
-  /**
-   * Icon code with the value '\uE991'.
-   */
-  doubleChevronLeftMed: '\uE991',
-  /**
-   * Icon code with the value '\uEA4D'.
-   */
-  doubleChevronLeftMedMirrored: '\uEA4D',
-  /**
-   * Icon code with the value '\uEE99'.
-   */
-  doubleChevronRight12: '\uEE99',
-  /**
-   * Icon code with the value '\uEDBF'.
-   */
-  doubleChevronRight: '\uEDBF',
-  /**
-   * Icon code with the value '\uEE96'.
-   */
-  doubleChevronUp12: '\uEE96',
-  /**
-   * Icon code with the value '\uEDBD'.
-   */
-  doubleChevronUp: '\uEDBD',
-  /**
-   * Icon code with the value '\uE74B'.
-   */
-  down: '\uE74B',
-  /**
-   * Icon code with the value '\uE896'.
-   */
-  download: '\uE896',
-  /**
-   * Icon code with the value '\uECA8'.
-   */
-  drm: '\uECA8',
-  /**
-   * Icon code with the value '\uEB42'.
-   */
-  drop: '\uEB42',
-  /**
-   * Icon code with the value '\uED77'.
-   */
-  dropboxLogo: '\uED77',
-  /**
-   * Icon code with the value '\uEDC5'.
-   */
-  dropdown: '\uEDC5',
-  /**
-   * Icon code with the value '\uE9CD'.
-   */
-  duststorm: '\uE9CD',
-  /**
-   * Icon code with the value '\uEDCD'.
-   */
-  dynamicSmbLogo: '\uEDCD',
-  /**
-   * Icon code with the value '\uEDCC'.
-   */
-  dynamics365Logo: '\uEDCC',
-  /**
-   * Icon code with the value '\uE807'.
-   */
-  eatDrink: '\uE807',
-  /**
-   * Icon code with the value '\uEC60'.
-   */
-  edgeLogo: '\uEC60',
-  /**
-   * Icon code with the value '\uE70F'.
-   */
-  edit: '\uE70F',
-  /**
-   * Icon code with the value '\uEF61'.
-   */
-  editMail: '\uEF61',
-  /**
-   * Icon code with the value '\uEB7E'.
-   */
-  editMirrored: '\uEB7E',
-  /**
-   * Icon code with the value '\uED9D'.
-   */
-  editNote: '\uED9D',
-  /**
-   * Icon code with the value '\uEF77'.
-   */
-  editPhoto: '\uEF77',
-  /**
-   * Icon code with the value '\uEF60'.
-   */
-  editStyle: '\uEF60',
-  /**
-   * Icon code with the value '\uECCE'.
-   */
-  embed: '\uECCE',
-  /**
-   * Icon code with the value '\uE731'.
-   */
-  emi: '\uE731',
-  /**
-   * Icon code with the value '\uE76E'.
-   */
-  emoji2: '\uE76E',
-  /**
-   * Icon code with the value '\uE899'.
-   */
-  emoji: '\uE899',
-  /**
-   * Icon code with the value '\uEA88'.
-   */
-  emojiDisappointed: '\uEA88',
-  /**
-   * Icon code with the value '\uEA87'.
-   */
-  emojiNeutral: '\uEA87',
-  /**
-   * Icon code with the value '\uEF88'.
-   */
-  emptyRecycleBin: '\uEF88',
-  /**
-   * Icon code with the value '\uE9E9'.
-   */
-  equalizer: '\uE9E9',
-  /**
-   * Icon code with the value '\uE75C'.
-   */
-  eraseTool: '\uE75C',
-  /**
-   * Icon code with the value '\uE783'.
-   */
-  error: '\uE783',
-  /**
-   * Icon code with the value '\uEA39'.
-   */
-  errorBadge: '\uEA39',
-  /**
-   * Icon code with the value '\uECA3'.
-   */
-  event: '\uECA3',
-  /**
-   * Icon code with the value '\uED8B'.
-   */
-  eventInfo: '\uED8B',
-  /**
-   * Icon code with the value '\uEF73'.
-   */
-  excelDocument: '\uEF73',
-  /**
-   * Icon code with the value '\uEC28'.
-   */
-  excelLogo: '\uEC28',
-  /**
-   * Icon code with the value '\uED78'.
-   */
-  exchangeLogo: '\uED78',
-  /**
-   * Icon code with the value '\uEF67'.
-   */
-  expandMenu: '\uEF67',
-  /**
-   * Icon code with the value '\uF09C'.
-   */
-  fabricAssetLibrary: '\uF09C',
-  /**
-   * Icon code with the value '\uF09D'.
-   */
-  fabricDataConnectionLibrary: '\uF09D',
-  /**
-   * Icon code with the value '\uF09E'.
-   */
-  fabricDocLibrary: '\uF09E',
-  /**
-   * Icon code with the value '\uF0A9'.
-   */
-  fabricFolder: '\uF0A9',
-  /**
-   * Icon code with the value '\uF0AA'.
-   */
-  fabricFolderFill: '\uF0AA',
-  /**
-   * Icon code with the value '\uF0A4'.
-   */
-  fabricFolderSearch: '\uF0A4',
-  /**
-   * Icon code with the value '\uF09F'.
-   */
-  fabricFormLibrary: '\uF09F',
-  /**
-   * Icon code with the value '\uF0A0'.
-   */
-  fabricFormLibraryMirrored: '\uF0A0',
-  /**
-   * Icon code with the value '\uF0A5'.
-   */
-  fabricMovetoFolder: '\uF0A5',
-  /**
-   * Icon code with the value '\uF0AB'.
-   */
-  fabricNewFolder: '\uF0AB',
-  /**
-   * Icon code with the value '\uF0A8'.
-   */
-  fabricOpenFolderHorizontal: '\uF0A8',
-  /**
-   * Icon code with the value '\uF0AC'.
-   */
-  fabricPictureLibrary: '\uF0AC',
-  /**
-   * Icon code with the value '\uF0A3'.
-   */
-  fabricPublicFolder: '\uF0A3',
-  /**
-   * Icon code with the value '\uF0A1'.
-   */
-  fabricReportLibrary: '\uF0A1',
-  /**
-   * Icon code with the value '\uF0A2'.
-   */
-  fabricReportLibraryMirrored: '\uF0A2',
-  /**
-   * Icon code with the value '\uF0A7'.
-   */
-  fabricSyncFolder: '\uF0A7',
-  /**
-   * Icon code with the value '\uF0A6'.
-   */
-  fabricUnsyncFolder: '\uF0A6',
-  /**
-   * Icon code with the value '\uECB3'.
-   */
-  facebookLogo: '\uECB3',
-  /**
-   * Icon code with the value '\uEBDA'.
-   */
-  family: '\uEBDA',
-  /**
-   * Icon code with the value '\uECEB'.
-   */
-  fangBody: '\uECEB',
-  /**
-   * Icon code with the value '\uE728'.
-   */
-  favoriteList: '\uE728',
-  /**
-   * Icon code with the value '\uE734'.
-   */
-  favoriteStar: '\uE734',
-  /**
-   * Icon code with the value '\uE735'.
-   */
-  favoriteStarFill: '\uE735',
-  /**
-   * Icon code with the value '\uEF5C'.
-   */
-  fax: '\uEF5C',
-  /**
-   * Icon code with the value '\uE7E3'.
-   */
-  ferry: '\uE7E3',
-  /**
-   * Icon code with the value '\uEB48'.
-   */
-  ferrySolid: '\uEB48',
-  /**
-   * Icon code with the value '\uE71C'.
-   */
-  filter: '\uE71C',
-  /**
-   * Icon code with the value '\uE795'.
-   */
-  filters: '\uE795',
-  /**
-   * Icon code with the value '\uE7BB'.
-   */
-  financial: '\uE7BB',
-  /**
-   * Icon code with the value '\uE928'.
-   */
-  fingerprint: '\uE928',
-  /**
-   * Icon code with the value '\uE7C1'.
-   */
-  flag: '\uE7C1',
-  /**
-   * Icon code with the value '\uF1F3'.
-   */
-  flameSolid: '\uF1F3',
-  /**
-   * Icon code with the value '\uE935'.
-   */
-  flickDown: '\uE935',
-  /**
-   * Icon code with the value '\uE937'.
-   */
-  flickLeft: '\uE937',
-  /**
-   * Icon code with the value '\uE938'.
-   */
-  flickRight: '\uE938',
-  /**
-   * Icon code with the value '\uE936'.
-   */
-  flickUp: '\uE936',
-  /**
-   * Icon code with the value '\uEF90'.
-   */
-  flow: '\uEF90',
-  /**
-   * Icon code with the value '\uE9CB'.
-   */
-  fog: '\uE9CB',
-  /**
-   * Icon code with the value '\uE8B7'.
-   */
-  folder: '\uE8B7',
-  /**
-   * Icon code with the value '\uE8D5'.
-   */
-  folderFill: '\uE8D5',
-  /**
-   * Icon code with the value '\uF12B'.
-   */
-  folderHorizontal: '\uF12B',
-  /**
-   * Icon code with the value '\uE838'.
-   */
-  folderOpen: '\uE838',
-  /**
-   * Icon code with the value '\uEF65'.
-   */
-  folderSearch: '\uEF65',
-  /**
-   * Icon code with the value '\uE8D2'.
-   */
-  font: '\uE8D2',
-  /**
-   * Icon code with the value '\uE8D3'.
-   */
-  fontColor: '\uE8D3',
-  /**
-   * Icon code with the value '\uE8E7'.
-   */
-  fontDecrease: '\uE8E7',
-  /**
-   * Icon code with the value '\uE8E8'.
-   */
-  fontIncrease: '\uE8E8',
-  /**
-   * Icon code with the value '\uE8E9'.
-   */
-  fontSize: '\uE8E9',
-  /**
-   * Icon code with the value '\uEEB9'.
-   */
-  formLibrary: '\uEEB9',
-  /**
-   * Icon code with the value '\uEEBA'.
-   */
-  formLibraryMirrored: '\uEEBA',
-  /**
-   * Icon code with the value '\uE72A'.
-   */
-  forward: '\uE72A',
-  /**
-   * Icon code with the value '\uED8C'.
-   */
-  forwardEvent: '\uED8C',
-  /**
-   * Icon code with the value '\uE9EF'.
-   */
-  freezing: '\uE9EF',
-  /**
-   * Icon code with the value '\uE9CA'.
-   */
-  frigid: '\uE9CA',
-  /**
-   * Icon code with the value '\uE91F'.
-   */
-  fullCircleMask: '\uE91F',
-  /**
-   * Icon code with the value '\uE740'.
-   */
-  fullScreen: '\uE740',
-  /**
-   * Icon code with the value '\uF2FE'.
-   */
-  fullWidth: '\uF2FE',
-  /**
-   * Icon code with the value '\uE9DA'.
-   */
-  generate: '\uE9DA',
-  /**
-   * Icon code with the value '\uEB8E'.
-   */
-  giftCard: '\uEB8E',
-  /**
-   * Icon code with the value '\uEC1F'.
-   */
-  giftbox: '\uEC1F',
-  /**
-   * Icon code with the value '\uEA16'.
-   */
-  glasses: '\uEA16',
-  /**
-   * Icon code with the value '\uECF4'.
-   */
-  glimmer: '\uECF4',
-  /**
-   * Icon code with the value '\uE700'.
-   */
-  globalNavButton: '\uE700',
-  /**
-   * Icon code with the value '\uE774'.
-   */
-  globe: '\uE774',
-  /**
-   * Icon code with the value '\uEF53'.
-   */
-  globeFavorite: '\uEF53',
-  /**
-   * Icon code with the value '\uEB1F'.
-   */
-  golf: '\uEB1F',
-  /**
-   * Icon code with the value '\uEE0B'.
-   */
-  googleDriveLogo: '\uEE0B',
-  /**
-   * Icon code with the value '\uE8D1'.
-   */
-  gotoToday: '\uE8D1',
-  /**
-   * Icon code with the value '\uE75E'.
-   */
-  gripperTool: '\uE75E',
-  /**
-   * Icon code with the value '\uE902'.
-   */
-  group: '\uE902',
-  /**
-   * Icon code with the value '\uEE67'.
-   */
-  groupedAscending: '\uEE67',
-  /**
-   * Icon code with the value '\uEE66'.
-   */
-  groupedDescending: '\uEE66',
-  /**
-   * Icon code with the value '\uEF74'.
-   */
-  groupedList: '\uEF74',
-  /**
-   * Icon code with the value '\uEA00'.
-   */
-  hailDay: '\uEA00',
-  /**
-   * Icon code with the value '\uEA13'.
-   */
-  hailNight: '\uEA13',
-  /**
-   * Icon code with the value '\uE929'.
-   */
-  handwriting: '\uE929',
-  /**
-   * Icon code with the value '\uEA19'.
-   */
-  header1: '\uEA19',
-  /**
-   * Icon code with the value '\uEF36'.
-   */
-  header2: '\uEF36',
-  /**
-   * Icon code with the value '\uEF37'.
-   */
-  header3: '\uEF37',
-  /**
-   * Icon code with the value '\uEF38'.
-   */
-  header4: '\uEF38',
-  /**
-   * Icon code with the value '\uE95B'.
-   */
-  headset: '\uE95B',
-  /**
-   * Icon code with the value '\uE95E'.
-   */
-  health: '\uE95E',
-  /**
-   * Icon code with the value '\uEB51'.
-   */
-  heart: '\uEB51',
-  /**
-   * Icon code with the value '\uEB52'.
-   */
-  heartFill: '\uEB52',
-  /**
-   * Icon code with the value '\uE897'.
-   */
-  help: '\uE897',
-  /**
-   * Icon code with the value '\uEA51'.
-   */
-  helpMirrored: '\uEA51',
-  /**
-   * Icon code with the value '\uEF89'.
-   */
-  hide2: '\uEF89',
-  /**
-   * Icon code with the value '\uED1A'.
-   */
-  hide: '\uED1A',
-  /**
-   * Icon code with the value '\uE81C'.
-   */
-  history: '\uE81C',
-  /**
-   * Icon code with the value '\uE80F'.
-   */
-  home: '\uE80F',
-  /**
-   * Icon code with the value '\uEA8A'.
-   */
-  homeSolid: '\uEA8A',
-  /**
-   * Icon code with the value '\uE91D'.
-   */
-  hospital: '\uE91D',
-  /**
-   * Icon code with the value '\uE824'.
-   */
-  hotel: '\uE824',
-  /**
-   * Icon code with the value '\uEF8A'.
-   */
-  iOsAppStoreLogo: '\uEF8A',
-  /**
-   * Icon code with the value '\uE8C9'.
-   */
-  important: '\uE8C9',
-  /**
-   * Icon code with the value '\uEF64'.
-   */
-  inboxCheck: '\uEF64',
-  /**
-   * Icon code with the value '\uE814'.
-   */
-  incidentTriangle: '\uE814',
-  /**
-   * Icon code with the value '\uE291'.
-   */
-  increaseIndentLegacy: '\uE291',
-  /**
-   * Icon code with the value '\uEA1F'.
-   */
-  info2: '\uEA1F',
-  /**
-   * Icon code with the value '\uE946'.
-   */
-  info: '\uE946',
-  /**
-   * Icon code with the value '\uEC7D'.
-   */
-  insertTextBox: '\uEC7D',
-  /**
-   * Icon code with the value '\uE704'.
-   */
-  internetSharing: '\uE704',
-  /**
-   * Icon code with the value '\uEEC0'.
-   */
-  issueTracking: '\uEEC0',
-  /**
-   * Icon code with the value '\uEEC1'.
-   */
-  issueTrackingMirrored: '\uEEC1',
-  /**
-   * Icon code with the value '\uE8DB'.
-   */
-  italic: '\uE8DB',
-  /**
-   * Icon code with the value '\uED8F'.
-   */
-  joinOnlineMeeting: '\uED8F',
-  /**
-   * Icon code with the value '\uEBF0'.
-   */
-  js: '\uEBF0',
-  /**
-   * Icon code with the value '\uE932'.
-   */
-  label: '\uE932',
-  /**
-   * Icon code with the value '\uEF6B'.
-   */
-  landscapeOrientation: '\uEF6B',
-  /**
-   * Icon code with the value '\uEC76'.
-   */
-  laptopSelected: '\uEC76',
-  /**
-   * Icon code with the value '\uEECB'.
-   */
-  largeGrid: '\uEECB',
-  /**
-   * Icon code with the value '\uE8F1'.
-   */
-  library: '\uE8F1',
-  /**
-   * Icon code with the value '\uEF62'.
-   */
-  lifesaver: '\uEF62',
-  /**
-   * Icon code with the value '\uEF63'.
-   */
-  lifesaverLock: '\uEF63',
-  /**
-   * Icon code with the value '\uE793'.
-   */
-  light: '\uE793',
-  /**
-   * Icon code with the value '\uEA80'.
-   */
-  lightbulb: '\uEA80',
-  /**
-   * Icon code with the value '\uE945'.
-   */
-  lightningBolt: '\uE945',
-  /**
-   * Icon code with the value '\uE8E1'.
-   */
-  like: '\uE8E1',
-  /**
-   * Icon code with the value '\uF3BF'
-   */
-  likeSolid: '\uF3BF',
-  /**
-   * Icon code with the value '\uE71B'.
-   */
-  link: '\uE71B',
-  /**
-   * Icon code with the value '\uEA37'.
-   */
-  list: '\uEA37',
-  /**
-   * Icon code with the value '\uEA55'.
-   */
-  listMirrored: '\uEA55',
-  /**
-   * Icon code with the value '\uE81D'.
-   */
-  location: '\uE81D',
-  /**
-   * Icon code with the value '\uE80E'.
-   */
-  locationCircle: '\uE80E',
-  /**
-   * Icon code with the value '\uE827'.
-   */
-  locationDot: '\uE827',
-  /**
-   * Icon code with the value '\uE920'.
-   */
-  locationFill: '\uE920',
-  /**
-   * Icon code with the value '\uE72E'.
-   */
-  lock: '\uE72E',
-  /**
-   * Icon code with the value '\uEC8A'.
-   */
-  lowerBrightness: '\uEC8A',
-  /**
-   * Icon code with the value '\uED79'.
-   */
-  lyncLogo: '\uED79',
-  /**
-   * Icon code with the value '\uE715'.
-   */
-  mail: '\uE715',
-  /**
-   * Icon code with the value '\uED80'.
-   */
-  mailAlert: '\uED80',
-  /**
-   * Icon code with the value '\uED81'.
-   */
-  mailCheck: '\uED81',
-  /**
-   * Icon code with the value '\uE8A8'.
-   */
-  mailFill: '\uE8A8',
-  /**
-   * Icon code with the value '\uE89C'.
-   */
-  mailForward: '\uE89C',
-  /**
-   * Icon code with the value '\uEA56'.
-   */
-  mailForwardMirrored: '\uEA56',
-  /**
-   * Icon code with the value '\uED82'.
-   */
-  mailLowImportance: '\uED82',
-  /**
-   * Icon code with the value '\uED83'.
-   */
-  mailPause: '\uED83',
-  /**
-   * Icon code with the value '\uED84'.
-   */
-  mailRepeat: '\uED84',
-  /**
-   * Icon code with the value '\uE8CA'.
-   */
-  mailReply: '\uE8CA',
-  /**
-   * Icon code with the value '\uE8C2'.
-   */
-  mailReplyAll: '\uE8C2',
-  /**
-   * Icon code with the value '\uEA58'.
-   */
-  mailReplyAllMirrored: '\uEA58',
-  /**
-   * Icon code with the value '\uEA57'.
-   */
-  mailReplyMirrored: '\uEA57',
-  /**
-   * Icon code with the value '\uE816'.
-   */
-  mapDirections: '\uE816',
-  /**
-   * Icon code with the value '\uE707'.
-   */
-  mapPin: '\uE707',
-  /**
-   * Icon code with the value '\uEAFC'.
-   */
-  market: '\uEAFC',
-  /**
-   * Icon code with the value '\uEF42'.
-   */
-  marketDown: '\uEF42',
-  /**
-   * Icon code with the value '\uE789'.
-   */
-  megaphone: '\uE789',
-  /**
-   * Icon code with the value '\uE77C'.
-   */
-  memo: '\uE77C',
-  /**
-   * Icon code with the value '\uE7D5'.
-   */
-  merge: '\uE7D5',
-  /**
-   * Icon code with the value '\uE8BD'.
-   */
-  message: '\uE8BD',
-  /**
-   * Icon code with the value '\uEC70'.
-   */
-  messageFill: '\uEC70',
-  /**
-   * Icon code with the value '\uE720'.
-   */
-  microphone: '\uE720',
-  /**
-   * Icon code with the value '\uF130'.
-   */
-  microsoftStaffhubLogo: '\uF130',
-  /**
-   * Icon code with the value '\uE732'.
-   */
-  miniLink: '\uE732',
-  /**
-   * Icon code with the value '\uEC75'.
-   */
-  mobileSelected: '\uEC75',
-  /**
-   * Icon code with the value '\uEAFD'.
-   */
-  money: '\uEAFD',
-  /**
-   * Icon code with the value '\uE712'.
-   */
-  more: '\uE712',
-  /**
-   * Icon code with the value '\uEB22'.
-   */
-  moreSports: '\uEB22',
-  /**
-   * Icon code with the value '\uF2BC'.
-   */
-  moreVertical: '\uF2BC',
-  /**
-   * Icon code with the value '\uE7C2'.
-   */
-  move: '\uE7C2',
-  /**
-   * Icon code with the value '\uE8DE'.
-   */
-  moveToFolder: '\uE8DE',
-  /**
-   * Icon code with the value '\uEB6C'.
-   */
-  msnLogo: '\uEB6C',
-  /**
-   * Icon code with the value '\uE762'.
-   */
-  multiSelect: '\uE762',
-  /**
-   * Icon code with the value '\uEA98'.
-   */
-  multiSelectMirrored: '\uEA98',
-  /**
-   * Icon code with the value '\uE940'.
-   */
-  musicInCollection: '\uE940',
-  /**
-   * Icon code with the value '\uEA36'.
-   */
-  musicInCollectionFill: '\uEA36',
-  /**
-   * Icon code with the value '\uEC4F'.
-   */
-  musicNote: '\uEC4F',
-  /**
-   * Icon code with the value '\uE800'.
-   */
-  nav2DMapView: '\uE800',
-  /**
-   * Icon code with the value '\uE8F4'.
-   */
-  newFolder: '\uE8F4',
-  /**
-   * Icon code with the value '\uE900'.
-   */
-  news: '\uE900',
-  /**
-   * Icon code with the value '\uED99'.
-   */
-  noteForward: '\uED99',
-  /**
-   * Icon code with the value '\uED9A'.
-   */
-  notePinned: '\uED9A',
-  /**
-   * Icon code with the value '\uED98'.
-   */
-  noteReply: '\uED98',
-  /**
-   * Icon code with the value '\uEDC4'.
-   */
-  numberField: '\uEDC4',
-  /**
-   * Icon code with the value '\uEA1C'.
-   */
-  numberedList: '\uEA1C',
-  /**
-   * Icon code with the value '\uEDCE'.
-   */
-  officeAssistantLogo: '\uEDCE',
-  /**
-   * Icon code with the value '\uEF86'.
-   */
-  officeFormLogo: '\uEF86',
-  /**
-   * Icon code with the value '\uEB6E'.
-   */
-  officeLogo: '\uEB6E',
-  /**
-   * Icon code with the value '\uEDCF'.
-   */
-  officeStoreLogo: '\uEDCF',
-  /**
-   * Icon code with the value '\uED7A'.
-   */
-  officeVideoLogo: '\uED7A',
-  /**
-   * Icon code with the value '\uEEC8'.
-   */
-  offlineOneDriveParachute: '\uEEC8',
-  /**
-   * Icon code with the value '\uEEC9'.
-   */
-  offlineOneDriveParachuteDisabled: '\uEEC9',
-  /**
-   * Icon code with the value '\uE941'.
-   */
-  oneDrive: '\uE941',
-  /**
-   * Icon code with the value '\uEF32'.
-   */
-  oneDriveAdd: '\uEF32',
-  /**
-   * Icon code with the value '\uEDD0'.
-   */
-  oneNoteEduLogo: '\uEDD0',
-  /**
-   * Icon code with the value '\uEC0D'.
-   */
-  oneNoteLogo: '\uEC0D',
-  /**
-   * Icon code with the value '\uE8E5'.
-   */
-  openFile: '\uE8E5',
-  /**
-   * Icon code with the value '\uED25'.
-   */
-  openFolderHorizontal: '\uED25',
-  /**
-   * Icon code with the value '\uE8A7'.
-   */
-  openInNewWindow: '\uE8A7',
-  /**
-   * Icon code with the value '\uE8A0'.
-   */
-  openPane: '\uE8A0',
-  /**
-   * Icon code with the value '\uEA5B'.
-   */
-  openPaneMirrored: '\uEA5B',
-  /**
-   * Icon code with the value '\uECA6'.
-   */
-  org: '\uECA6',
-  /**
-   * Icon code with the value '\uED34'.
-   */
-  outOfOffice: '\uED34',
-  /**
-   * Icon code with the value '\uEB6D'.
-   */
-  outlookLogo: '\uEB6D',
-  /**
-   * Icon code with the value '\uE7C3'.
-   */
-  page: '\uE7C3',
-  /**
-   * Icon code with the value '\uEA1A'.
-   */
-  pageAdd: '\uEA1A',
-  /**
-   * Icon code with the value '\uF02C'.
-   */
-  pageCheckedOut: '\uF02C',
-  /**
-   * Icon code with the value '\uF104'.
-   */
-  pageCheckedin: '\uF104',
-  /**
-   * Icon code with the value '\uE760'.
-   */
-  pageLeft: '\uE760',
-  /**
-   * Icon code with the value '\uE761'.
-   */
-  pageRight: '\uE761',
-  /**
-   * Icon code with the value '\uE729'.
-   */
-  pageSolid: '\uE729',
-  /**
-   * Icon code with the value '\uE7B0'.
-   */
-  panoIndicator: '\uE7B0',
-  /**
-   * Icon code with the value '\uED7B'.
-   */
-  paratureLogo: '\uED7B',
-  /**
-   * Icon code with the value '\uE9C0'.
-   */
-  partlyCloudyDay: '\uE9C0',
-  /**
-   * Icon code with the value '\uE9C1'.
-   */
-  partlyCloudyNight: '\uE9C1',
-  /**
-   * Icon code with the value '\uECA7'.
-   */
-  partyLeader: '\uECA7',
-  /**
-   * Icon code with the value '\uE769'.
-   */
-  pause: '\uE769',
-  /**
-   * Icon code with the value '\uE8C7'.
-   */
-  paymentCard: '\uE8C7',
-  /**
-   * Icon code with the value '\uE977'.
-   */
-  pc1: '\uE977',
-  /**
-   * Icon code with the value '\uEA90'.
-   */
-  pdf: '\uEA90',
-  /**
-   * Icon code with the value '\uEF7B'.
-   */
-  pencilReply: '\uEF7B',
-  /**
-   * Icon code with the value '\uE716'.
-   */
-  people: '\uE716',
-  /**
-   * Icon code with the value '\uEA15'.
-   */
-  peopleAdd: '\uEA15',
-  /**
-   * Icon code with the value '\uED93'.
-   */
-  peopleAlert: '\uED93',
-  /**
-   * Icon code with the value '\uED91'.
-   */
-  peopleBlock: '\uED91',
-  /**
-   * Icon code with the value '\uED94'.
-   */
-  peoplePause: '\uED94',
-  /**
-   * Icon code with the value '\uED92'.
-   */
-  peopleRepeat: '\uED92',
-  /**
-   * Icon code with the value '\uE8D7'.
-   */
-  permissions: '\uE8D7',
-  /**
-   * Icon code with the value '\uE717'.
-   */
-  phone: '\uE717',
-  /**
-   * Icon code with the value '\uEB9F'.
-   */
-  photo2: '\uEB9F',
-  /**
-   * Icon code with the value '\uECAB'.
-   */
-  photo2Add: '\uECAB',
-  /**
-   * Icon code with the value '\uECAC'.
-   */
-  photo2Remove: '\uECAC',
-  /**
-   * Icon code with the value '\uE7AA'.
-   */
-  photoCollection: '\uE7AA',
-  /**
-   * Icon code with the value '\uE8B9'.
-   */
-  picture: '\uE8B9',
-  /**
-   * Icon code with the value '\uEEC2'.
-   */
-  pictureLibrary: '\uEEC2',
-  /**
-   * Icon code with the value '\uEB04'.
-   */
-  pieDouble: '\uEB04',
-  /**
-   * Icon code with the value '\uEACB'.
-   */
-  pill: '\uEACB',
-  /**
-   * Icon code with the value '\uE718'.
-   */
-  pin: '\uE718',
-  /**
-   * Icon code with the value '\uE840'.
-   */
-  pinned: '\uE840',
-  /**
-   * Icon code with the value '\uE842'.
-   */
-  pinnedFill: '\uE842',
-  /**
-   * Icon code with the value '\uEDD1'.
-   */
-  planner: '\uEDD1',
-  /**
-   * Icon code with the value '\uE768'.
-   */
-  play: '\uE768',
-  /**
-   * Icon code with the value '\uEF58'.
-   */
-  playerSettings: '\uEF58',
-  /**
-   * Icon code with the value '\uECAF'.
-   */
-  poi: '\uECAF',
-  /**
-   * Icon code with the value '\uE8F3'.
-   */
-  postUpdate: '\uE8F3',
-  /**
-   * Icon code with the value '\uF092'.
-   */
-  powerApps2Logo: '\uF092',
-  /**
-   * Icon code with the value '\uEDD2'.
-   */
-  powerApps: '\uEDD2',
-  /**
-   * Icon code with the value '\uF091'.
-   */
-  powerAppsLogo: '\uF091',
-  /**
-   * Icon code with the value '\uEA1E'.
-   */
-  powerBiLogo: '\uEA1E',
-  /**
-   * Icon code with the value '\uEA1E'.
-   */
-  powerBILogo: '\uEA1E',
-  /**
-   * Icon code with the value '\uEF72'.
-   */
-  powerPointDocument: '\uEF72',
-  /**
-   * Icon code with the value '\uEC2A'.
-   */
-  powerPointLogo: '\uEC2A',
-  /**
-   * Icon code with the value '\uE9CF'.
-   */
-  precipitation: '\uE9CF',
-  /**
-   * Icon code with the value '\uE979'.
-   */
-  presenceChickletVideo: '\uE979',
-  /**
-   * Icon code with the value '\uE8FF'.
-   */
-  preview: '\uE8FF',
-  /**
-   * Icon code with the value '\uE8A1'.
-   */
-  previewLink: '\uE8A1',
-  /**
-   * Icon code with the value '\uE749'.
-   */
-  print: '\uE749',
-  /**
-   * Icon code with the value '\uE956'.
-   */
-  printfaxPrinterFile: '\uE956',
-  /**
-   * Icon code with the value '\uEB27'.
-   */
-  proFootball: '\uEB27',
-  /**
-   * Icon code with the value '\uEB28'.
-   */
-  proHockey: '\uEB28',
-  /**
-   * Icon code with the value '\uECDC'.
-   */
-  product: '\uECDC',
-  /**
-   * Icon code with the value '\uEDD4'.
-   */
-  projectLogo: '\uEDD4',
-  /**
-   * Icon code with the value '\uE8A6'.
-   */
-  protectedDocument: '\uE8A6',
-  /**
-   * Icon code with the value '\uEF6D'.
-   */
-  publicCalendar: '\uEF6D',
-  /**
-   * Icon code with the value '\uEF6E'.
-   */
-  publicContactCard: '\uEF6E',
-  /**
-   * Icon code with the value '\uEF6F'.
-   */
-  publicEmail: '\uEF6F',
-  /**
-   * Icon code with the value '\uEF70'.
-   */
-  publicFolder: '\uEF70',
-  /**
-   * Icon code with the value '\uEA86'.
-   */
-  puzzle: '\uEA86',
-  /**
-   * Icon code with the value '\uEE19'.
-   */
-  questionnaire: '\uEE19',
-  /**
-   * Icon code with the value '\uEE4B'.
-   */
-  questionnaireMirrored: '\uEE4B',
-  /**
-   * Icon code with the value '\uE70B'.
-   */
-  quickNote: '\uE70B',
-  /**
-   * Icon code with the value '\uECCB'.
-   */
-  radioBtnOn: '\uECCB',
-  /**
-   * Icon code with the value '\uE915'.
-   */
-  radioBullet: '\uE915',
-  /**
-   * Icon code with the value '\uE9C4'.
-   */
-  rain: '\uE9C4',
-  /**
-   * Icon code with the value '\uE9C3'.
-   */
-  rainShowersDay: '\uE9C3',
-  /**
-   * Icon code with the value '\uEA0F'.
-   */
-  rainShowersNight: '\uEA0F',
-  /**
-   * Icon code with the value '\uE9C7'.
-   */
-  rainSnow: '\uE9C7',
-  /**
-   * Icon code with the value '\uE8C3'.
-   */
-  read: '\uE8C3',
-  /**
-   * Icon code with the value '\uE736'.
-   */
-  readingMode: '\uE736',
-  /**
-   * Icon code with the value '\uEF5B'.
-   */
-  receiptCheck: '\uEF5B',
-  /**
-   * Icon code with the value '\uEF59'.
-   */
-  receiptForward: '\uEF59',
-  /**
-   * Icon code with the value '\uEF5A'.
-   */
-  receiptReply: '\uEF5A',
-  /**
-   * Icon code with the value '\uE823'.
-   */
-  recent: '\uE823',
-  /**
-   * Icon code with the value '\uEF5D'.
-   */
-  recurringEvent: '\uEF5D',
-  /**
-   * Icon code with the value '\uEDB2'.
-   */
-  recurringTask: '\uEDB2',
-  /**
-   * Icon code with the value '\uEF87'.
-   */
-  recycleBin: '\uEF87',
-  /**
-   * Icon code with the value '\uE7B3'.
-   */
-  redEye: '\uE7B3',
-  /**
-   * Icon code with the value '\uE7A6'.
-   */
-  redo: '\uE7A6',
-  /**
-   * Icon code with the value '\uE72C'.
-   */
-  refresh: '\uE72C',
-  /**
-   * Icon code with the value '\uEBF8'.
-   */
-  reminderGroup: '\uEBF8',
-  /**
-   * Icon code with the value '\uE738'.
-   */
-  remove: '\uE738',
-  /**
-   * Icon code with the value '\uED8A'.
-   */
-  removeEvent: '\uED8A',
-  /**
-   * Icon code with the value '\uEB08'.
-   */
-  removeFilter: '\uEB08',
-  /**
-   * Icon code with the value '\uED90'.
-   */
-  removeLink: '\uED90',
-  /**
-   * Icon code with the value '\uED9B'.
-   */
-  removeOccurrence: '\uED9B',
-  /**
-   * Icon code with the value '\uE8AC'.
-   */
-  rename: '\uE8AC',
-  /**
-   * Icon code with the value '\uED50'.
-   */
-  reopenPages: '\uED50',
-  /**
-   * Icon code with the value '\uE90F'.
-   */
-  repair: '\uE90F',
-  /**
-   * Icon code with the value '\uE97A'.
-   */
-  reply: '\uE97A',
-  /**
-   * Icon code with the value '\uEE0A'.
-   */
-  replyAll: '\uEE0A',
-  /**
-   * Icon code with the value '\uEF5F'.
-   */
-  replyAllAlt: '\uEF5F',
-  /**
-   * Icon code with the value '\uEE36'.
-   */
-  replyAllMirrored: '\uEE36',
-  /**
-   * Icon code with the value '\uEF5E'.
-   */
-  replyAlt: '\uEF5E',
-  /**
-   * Icon code with the value '\uEE35'.
-   */
-  replyMirrored: '\uEE35',
-  /**
-   * Icon code with the value '\uEEBB'.
-   */
-  reportLibrary: '\uEEBB',
-  /**
-   * Icon code with the value '\uEEBC'.
-   */
-  reportLibraryMirrored: '\uEEBC',
-  /**
-   * Icon code with the value '\uED24'.
-   */
-  returnToSession: '\uED24',
-  /**
-   * Icon code with the value '\uE845'.
-   */
-  revToggleKey: '\uE845',
-  /**
-   * Icon code with the value '\uE9D1'.
-   */
-  ribbon: '\uE9D1',
-  /**
-   * Icon code with the value '\uE9B1'.
-   */
-  rightDoubleQuote: '\uE9B1',
-  /**
-   * Icon code with the value '\uEA8F'.
-   */
-  ringer: '\uEA8F',
-  /**
-   * Icon code with the value '\uED9F'.
-   */
-  room: '\uED9F',
-  /**
-   * Icon code with the value '\uE7AD'.
-   */
-  rotate: '\uE7AD',
-  /**
-   * Icon code with the value '\uEB2D'.
-   */
-  rugby: '\uEB2D',
-  /**
-   * Icon code with the value '\uEADA'.
-   */
-  running: '\uEADA',
-  /**
-   * Icon code with the value '\uE757'.
-   */
-  sad: '\uE757',
-  /**
-   * Icon code with the value '\uE74E'.
-   */
-  save: '\uE74E',
-  /**
-   * Icon code with the value '\uE792'.
-   */
-  saveAs: '\uE792',
-  /**
-   * Icon code with the value '\uE721'.
-   */
-  search: '\uE721',
-  /**
-   * Icon code with the value '\uEC0C'.
-   */
-  section: '\uEC0C',
-  /**
-   * Icon code with the value '\uEF76'.
-   */
-  sections: '\uEF76',
-  /**
-   * Icon code with the value '\uED85'.
-   */
-  securityGroup: '\uED85',
-  /**
-   * Icon code with the value '\uE724'.
-   */
-  send: '\uE724',
-  /**
-   * Icon code with the value '\uEA63'.
-   */
-  sendMirrored: '\uEA63',
-  /**
-   * Icon code with the value '\uF071'.
-   */
-  setAction: '\uF071',
-  /**
-   * Icon code with the value '\uE713'.
-   */
-  settings: '\uE713',
-  /**
-   * Icon code with the value '\uE72D'.
-   */
-  share: '\uE72D',
-  /**
-   * Icon code with the value '\uEF79'.
-   */
-  shareiOs: '\uEF79',
-  /**
-   * Icon code with the value '\uED18'.
-   */
-  sharepointLogo: '\uED18',
-  /**
-   * Icon code with the value '\uEA18'.
-   */
-  shield: '\uEA18',
-  /**
-   * Icon code with the value '\uE719'.
-   */
-  shop: '\uE719',
-  /**
-   * Icon code with the value '\uE7BF'.
-   */
-  shoppingCart: '\uE7BF',
-  /**
-   * Icon code with the value '\uE8BC'.
-   */
-  showResults: '\uE8BC',
-  /**
-   * Icon code with the value '\uEA65'.
-   */
-  showResultsMirrored: '\uEA65',
-  /**
-   * Icon code with the value '\uEF52'.
-   */
-  sidePanel: '\uEF52',
-  /**
-   * Icon code with the value '\uEDFF'.
-   */
-  singleBookmark: '\uEDFF',
-  /**
-   * Icon code with the value '\uE759'.
-   */
-  sipMove: '\uE759',
-  /**
-   * Icon code with the value '\uEF80'.
-   */
-  skypeCheck: '\uEF80',
-  /**
-   * Icon code with the value '\uEF7D'.
-   */
-  skypeCircleCheck: '\uEF7D',
-  /**
-   * Icon code with the value '\uEF7E'.
-   */
-  skypeCircleClock: '\uEF7E',
-  /**
-   * Icon code with the value '\uEF7F'.
-   */
-  skypeCircleMinus: '\uEF7F',
-  /**
-   * Icon code with the value '\uEF81'.
-   */
-  skypeClock: '\uEF81',
-  /**
-   * Icon code with the value '\uEB6F'.
-   */
-  skypeLogo: '\uEB6F',
-  /**
-   * Icon code with the value '\uEF83'.
-   */
-  skypeMessage: '\uEF83',
-  /**
-   * Icon code with the value '\uEF82'.
-   */
-  skypeMinus: '\uEF82',
-  /**
-   * Icon code with the value '\uEC13'.
-   */
-  sliderThumb: '\uEC13',
-  /**
-   * Icon code with the value '\uEB46'.
-   */
-  snow: '\uEB46',
-  /**
-   * Icon code with the value '\uE9FD'.
-   */
-  snowShowerDay: '\uE9FD',
-  /**
-   * Icon code with the value '\uEA11'.
-   */
-  snowShowerNight: '\uEA11',
-  /**
-   * Icon code with the value '\uEB21'.
-   */
-  soccer: '\uEB21',
-  /**
-   * Icon code with the value '\uED7C'.
-   */
-  socialListeningLogo: '\uED7C',
-  /**
-   * Icon code with the value '\uE8CB'.
-   */
-  sort: '\uE8CB',
-  /**
-   * Icon code with the value '\uEE69'.
-   */
-  sortDown: '\uEE69',
-  /**
-   * Icon code with the value '\uE9D0'.
-   */
-  sortLines: '\uE9D0',
-  /**
-   * Icon code with the value '\uEE68'.
-   */
-  sortUp: '\uEE68',
-  /**
-   * Icon code with the value '\uE7F5'.
-   */
-  speakers: '\uE7F5',
-  /**
-   * Icon code with the value '\uF40D'.
-   */
-  spacer: '\uF40D ',
-  /**
-   * Icon code with the value '\uEC4A'.
-   */
-  speedHigh: '\uEC4A',
-  /**
-   * Icon code with the value '\uEDBC'.
-   */
-  split: '\uEDBC',
-  /**
-   * Icon code with the value '\uE9CC'.
-   */
-  squalls: '\uE9CC',
-  /**
-   * Icon code with the value '\uE7FF'.
-   */
-  stackIndicator: '\uE7FF',
-  /**
-   * Icon code with the value '\uEF78'.
-   */
-  starburst: '\uEF78',
-  /**
-   * Icon code with the value '\uF13E'.
-   */
-  statusCircleCheckmark: '\uF13E',
-  /**
-   * Icon code with the value '\uEB90'.
-   */
-  statusErrorFull: '\uEB90',
-  /**
-   * Icon code with the value '\uEA82'.
-   */
-  statusTriangle: '\uEA82',
-  /**
-   * Icon code with the value '\uEB0F'.
-   */
-  stockDown: '\uEB0F',
-  /**
-   * Icon code with the value '\uEB11'.
-   */
-  stockUp: '\uEB11',
-  /**
-   * Icon code with the value '\uE916'.
-   */
-  stopwatch: '\uE916',
-  /**
-   * Icon code with the value '\uEA96'.
-   */
-  storeLogo: '\uEA96',
-  /**
-   * Icon code with the value '\uEA04'.
-   */
-  storeLogoMed: '\uEA04',
-  /**
-   * Icon code with the value '\uF329'.
-   */
-  streamLogo: '\uF329',
-  /**
-   * Icon code with the value '\uEDE0'.
-   */
-  strikethrough: '\uEDE0',
-  /**
-   * Icon code with the value '\uEDA1'.
-   */
-  subscribe: '\uEDA1',
-  /**
-   * Icon code with the value '\uEDDF'.
-   */
-  subscript: '\uEDDF',
-  /**
-   * Icon code with the value '\uEDD3'.
-   */
-  suitcase: '\uEDD3',
-  /**
-   * Icon code with the value '\uEF69'.
-   */
-  sunAdd: '\uEF69',
-  /**
-   * Icon code with the value '\uEF6A'.
-   */
-  sunQuestionMark: '\uEF6A',
-  /**
-   * Icon code with the value '\uE9BD'.
-   */
-  sunny: '\uE9BD',
-  /**
-   * Icon code with the value '\uEDDE'.
-   */
-  superscript: '\uEDDE',
-  /**
-   * Icon code with the value '\uED29'.
-   */
-  swayLogo: '\uED29',
-  /**
-   * Icon code with the value '\uE8AB'.
-   */
-  switcher: '\uE8AB',
-  /**
-   * Icon code with the value '\uE810'.
-   */
-  switcherStartEnd: '\uE810',
-  /**
-   * Icon code with the value '\uE895'.
-   */
-  sync: '\uE895',
-  /**
-   * Icon code with the value '\uE8F7'.
-   */
-  syncFolder: '\uE8F7',
-  /**
-   * Icon code with the value '\uEE6E'.
-   */
-  syncToPc: '\uEE6E',
-  /**
-   * Icon code with the value '\uE770'.
-   */
-  system: '\uE770',
-  /**
-   * Icon code with the value '\uE7E9'.
-   */
-  tab: '\uE7E9',
-  /**
-   * Icon code with the value '\uED86'.
-   */
-  table: '\uED86',
-  /**
-   * Icon code with the value '\uE70A'.
-   */
-  tablet: '\uE70A',
-  /**
-   * Icon code with the value '\uEC74'.
-   */
-  tabletSelected: '\uEC74',
-  /**
-   * Icon code with the value '\uE8EC'.
-   */
-  tag: '\uE8EC',
-  /**
-   * Icon code with the value '\uEDB7'.
-   */
-  taskManager: '\uEDB7',
-  /**
-   * Icon code with the value '\uEDB8'.
-   */
-  taskManagerMirrored: '\uEDB8',
-  /**
-   * Icon code with the value '\uEA12'.
-   */
-  teamwork: '\uEA12',
-  /**
-   * Icon code with the value '\uEE58'.
-   */
-  temporaryUser: '\uEE58',
-  /**
-   * Icon code with the value '\uEB33'.
-   */
-  tennis: '\uEB33',
-  /**
-   * Icon code with the value '\uEDC2'.
-   */
-  textBox: '\uEDC2',
-  /**
-   * Icon code with the value '\uEDC3'.
-   */
-  textField: '\uEDC3',
-  /**
-   * Icon code with the value '\uF029'.
-   */
-  textDocument: '\uF029',
-  /**
-   * Icon code with the value '\uE7B6'.
-   */
-  thumbnailView: '\uE7B6',
-  /**
-   * Icon code with the value '\uEA67'.
-   */
-  thumbnailViewMirrored: '\uEA67',
-  /**
-   * Icon code with the value '\uE9C6'.
-   */
-  thunderstorms: '\uE9C6',
-  /**
-   * Icon code with the value '\uEB54'.
-   */
-  ticket: '\uEB54',
-  /**
-   * Icon code with the value '\uEF7C'.
-   */
-  tiles2: '\uEF7C',
-  /**
-   * Icon code with the value '\uECA5'.
-   */
-  tiles: '\uECA5',
-  /**
-   * Icon code with the value '\uED9C'.
-   */
-  timeline: '\uED9C',
-  /**
-   * Icon code with the value '\uE91E'.
-   */
-  timer: '\uE91E',
-  /**
-   * Icon code with the value '\uEC12'.
-   */
-  toggleBorder: '\uEC12',
-  /**
-   * Icon code with the value '\uEC11'.
-   */
-  toggleFilled: '\uEC11',
-  /**
-   * Icon code with the value '\uEC14'.
-   */
-  toggleThumb: '\uEC14',
-  /**
-   * Icon code with the value '\uE815'.
-   */
-  touch: '\uE815',
-  /**
-   * Icon code with the value '\uE7C9'.
-   */
-  touchPointer: '\uE7C9',
-  /**
-   * Icon code with the value '\uE7C0'.
-   */
-  train: '\uE7C0',
-  /**
-   * Icon code with the value '\uEB4D'.
-   */
-  trainSolid: '\uEB4D',
-  /**
-   * Icon code with the value '\uED95'.
-   */
-  transferCall: '\uED95',
-  /**
-   * Icon code with the value '\uE74D'.
-   */
-  trash: '\uE74D',
-  /**
-   * Icon code with the value '\uEED1'.
-   */
-  triangleDown12: '\uEED1',
-  /**
-   * Icon code with the value '\uEED2'.
-   */
-  triangleLeft12: '\uEED2',
-  /**
-   * Icon code with the value '\uEED3'.
-   */
-  triangleRight12: '\uEED3',
-  /**
-   * Icon code with the value '\uEECD'.
-   */
-  triangleSolidDown12: '\uEECD',
-  /**
-   * Icon code with the value '\uEECE'.
-   */
-  triangleSolidLeft12: '\uEECE',
-  /**
-   * Icon code with the value '\uEECF'.
-   */
-  triangleSolidRight12: '\uEECF',
-  /**
-   * Icon code with the value '\uEECC'.
-   */
-  triangleSolidUp12: '\uEECC',
-  /**
-   * Icon code with the value '\uEED0'.
-   */
-  triangleUp12: '\uEED0',
-  /**
-   * Icon code with the value '\uED3F'.
-   */
-  trophy: '\uED3F',
-  /**
-   * Icon code with the value '\uE7DB'.
-   */
-  turnRight: '\uE7DB',
-  /**
-   * Icon code with the value '\uE7F4'.
-   */
-  tvMonitor: '\uE7F4',
-  /**
-   * Icon code with the value '\uEC77'.
-   */
-  tvMonitorSelected: '\uEC77',
-  /**
-   * Icon code with the value '\uE8DC'.
-   */
-  underline: '\uE8DC',
-  /**
-   * Icon code with the value '\uE7A7'.
-   */
-  undo: '\uE7A7',
-  /**
-   * Icon code with the value '\uE8D9'.
-   */
-  unfavorite: '\uE8D9',
-  /**
-   * Icon code with the value '\uED97'.
-   */
-  unknownCall: '\uED97',
-  /**
-   * Icon code with the value '\uE785'.
-   */
-  unlock: '\uE785',
-  /**
-   * Icon code with the value '\uE77A'.
-   */
-  unpin: '\uE77A',
-  /**
-   * Icon code with the value '\uEDA0'.
-   */
-  unsubscribe: '\uEDA0',
-  /**
-   * Icon code with the value '\uE8F6'.
-   */
-  unsyncFolder: '\uE8F6',
-  /**
-   * Icon code with the value '\uE74A'.
-   */
-  up: '\uE74A',
-  /**
-   * Icon code with the value '\uE898'.
-   */
-  upload: '\uE898',
-  /**
-   * Icon code with the value '\uE714'.
-   */
-  video: '\uE714',
-  /**
-   * Icon code with the value '\uEA0C'.
-   */
-  videoSolid: '\uEA0C',
-  /**
-   * Icon code with the value '\uE890'.
-   */
-  view: '\uE890',
-  /**
-   * Icon code with the value '\uEF56'.
-   */
-  viewAll2: '\uEF56',
-  /**
-   * Icon code with the value '\uE8A9'.
-   */
-  viewAll: '\uE8A9',
-  /**
-   * Icon code with the value '\uED7D'.
-   */
-  visioLogo: '\uED7D',
-  /**
-   * Icon code with the value '\uED87'.
-   */
-  voicemailForward: '\uED87',
-  /**
-   * Icon code with the value '\uED88'.
-   */
-  voicemailReply: '\uED88',
-  /**
-   * Icon code with the value '\uE992'.
-   */
-  volume0: '\uE992',
-  /**
-   * Icon code with the value '\uE993'.
-   */
-  volume1: '\uE993',
-  /**
-   * Icon code with the value '\uE994'.
-   */
-  volume2: '\uE994',
-  /**
-   * Icon code with the value '\uE995'.
-   */
-  volume3: '\uE995',
-  /**
-   * Icon code with the value '\uEA85'.
-   */
-  volumeDisabled: '\uEA85',
-  /**
-   * Icon code with the value '\uED89'.
-   */
-  waffle: '\uED89',
-  /**
-   * Icon code with the value '\uE7BA'.
-   */
-  warning: '\uE7BA',
-  /**
-   * Icon code with the value '\uEB41'.
-   */
-  website: '\uEB41',
-  /**
-   * Icon code with the value '\uEADB'.
-   */
-  weights: '\uEADB',
-  /**
-   * Icon code with the value '\uEBE6'.
-   */
-  windDirection: '\uEBE6',
-  /**
-   * Icon code with the value '\uE782'.
-   */
-  windowsLogo: '\uE782',
-  /**
-   * Icon code with the value '\uED8D'.
-   */
-  wipePhone: '\uED8D',
-  /**
-   * Icon code with the value '\uEF71'.
-   */
-  wordDocument: '\uEF71',
-  /**
-   * Icon code with the value '\uEC29'.
-   */
-  wordLogo: '\uEC29',
-  /**
-   * Icon code with the value '\uE821'.
-   */
-  work: '\uE821',
-  /**
-   * Icon code with the value '\uEA01'.
-   */
-  workFlow: '\uEA01',
-  /**
-   * Icon code with the value '\uE918'.
-   */
-  worldClock: '\uE918',
-  /**
-   * Icon code with the value '\uED19'.
-   */
-  yammerLogo: '\uED19',
-  /**
-   * Icon code with the value '\uE71E'.
-   */
-  zoom: '\uE71E',
-  /**
-   * Icon code with the value '\uE8A3'.
-   */
-  zoomIn: '\uE8A3',
-  /**
-   * Icon code with the value '\uE71F'.
-   */
-  zoomOut: '\uE71F',
-
-  // Manual additions for multi-column icons
-  singleColumn: '\uF1D3',
-  doubleColumn: '\uF1D4',
-  tripleColumn: '\uF1D5',
-  columnLeftTwoThirds: '\uF1D6',
-  columnRightTwoThirds: '\uF1D7',
-
-  // 2.38 Additions
-
-  /**
-   * Icon code with the value '\uF412'.
-   */
-  filterSolid: '\uF412',
-  /**
-   * Icon code with the value '\uF232'.
-   */
-  gridViewSmall: '\uF232',
-  /**
-   * Icon code with the value '\uF233'.
-   */
-  gridViewMedium: '\uF233',
-  /**
-   * Icon code with the value '\uF234'.
-   */
-  gridViewLarge: '\uF234',
-  /**
-   * Icon code with the value '\uEC4E'.
-   */
-  thisPc: '\uEC4E',
-  /**
-   * Icon code with the value '\uF415'.
-   */
-  mailUndelivered: '\uF415',
-  /**
-   * Icon code with value '\uF416'.
-   */
-  mailTentative: '\uF416',
-  /**
-   * Icon code with value '\uF417'.
-   */
-  mailTentativeMirrored: '\uF417',
-  /**
-   * Icon code with value '\uf418'.
-   */
-  mailReminder: '\uf418',
-  /**
-   * Icon code with value '\uF41D'.
-   */
-  irmReply: '\uF41D',
-  /**
-   * Icon code with value '\uF41E'.
-   */
-  irmReplyMirrored: '\uF41E',
-  /**
-   * Icon code with value '\uF41F'.
-   */
-  irmForward: '\uF41F',
-  /**
-   * Icon code with value '\uF420'.
-   */
-  irmForwardMirrored: '\uF420',
-  /**
-   * Icon code with value '\uF419'.
-   */
-  receiptUndelivered: '\uF419',
-  /**
-   * Icon code with value '\uF41A'.
-   */
-  receiptTentative: '\uF41A',
-  /**
-   * Icon code with value '\uF41B'.
-   */
-  receiptTentativeMirrored: '\uF41B',
-  /**
-   * Icon code with value '\uF41C'.
-   */
-  inbox: '\uF41C',
-  /**
-   * Icon code with value '\uF421'.
-   */
-  voicemailRM: '\uF421',
-  /**
-   * Icon code with value '\uF422'.
-   */
-  eventAccepted: '\uF422',
-  /**
-   * Icon code with value '\uF423'.
-   */
-  eventTentative: '\uF423',
-  /**
-   * Icon code with value '\uF424'.
-   */
-  eventTentativeMirrored: '\uF424',
-  /**
-   * Icon code with value '\uF425'.
-   */
-  eventDeclined: '\uF425',
-
-};
diff --git a/packages/styling/src/styles/UtilityStyles.ts b/packages/styling/src/styles/UtilityStyles.ts
deleted file mode 100644
index 4a9ba97a23ac4..0000000000000
--- a/packages/styling/src/styles/UtilityStyles.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-import { IRawStyle } from '../interfaces/index';
-
-export const hideText: IRawStyle = {
-  position: 'absolute',
-  width: '1px',
-  height: '1px',
-  margin: '-1px',
-  padding: 0,
-  overflow: 'hidden',
-  clip: 'rect(0,0,0,0)',
-  border: 0
-};
diff --git a/packages/styling/src/styles/getFocusStyle.ts b/packages/styling/src/styles/getFocusStyle.ts
index 685fe7f353e3b..54309fbdb967e 100644
--- a/packages/styling/src/styles/getFocusStyle.ts
+++ b/packages/styling/src/styles/getFocusStyle.ts
@@ -1,6 +1,5 @@
-import { mergeStyles } from '../utilities/mergeStyles';
-import { IProcessedStyle, ITheme } from '../interfaces/index';
-import { parent } from '../glamorExports';
+import { IRawStyle } from '@uifabric/merge-styles/lib/index';
+import { ITheme } from '../interfaces/index';
 
 /**
  * Generates a focus style which can be used to define an :after focus border.
@@ -14,26 +13,31 @@ import { parent } from '../glamorExports';
  */
 export function getFocusStyle(
   theme: ITheme,
-  inset: string = '0',
-  color: string | undefined = theme.palette.neutralSecondary,
+  inset: number = 0,
   position: 'relative' | 'absolute' = 'relative'
-): IProcessedStyle {
-  return mergeStyles(
-    {
-      outline: 'transparent',
-      '::-moz-focus-inner': { border: 0 },
-      position
-    },
-    parent('.ms-Fabric.is-focusVisible', {
-      ':focus:after': {
+): IRawStyle {
+  return {
+    outline: 'transparent',
+    position,
+
+    selectors: {
+
+      '::-moz-focus-inner': {
+        border: '0'
+      },
+
+      '.ms-Fabric.is-focusVisible &:focus:after': {
         content: '""',
         position: 'absolute',
-        left: inset,
-        top: inset,
-        bottom: inset,
-        right: inset,
-        border: '1px solid ' + color
+        left: inset + 1,
+        top: inset + 1,
+        bottom: inset + 1,
+        right: inset + 1,
+        border: '1px solid ' + theme.palette.white,
+        outline: '1px solid ' + theme.palette.neutralSecondary,
+        zIndex: 1
       }
-    })
-  );
+
+    }
+  };
 }
\ No newline at end of file
diff --git a/packages/styling/src/styles/hiddenContentStyle.ts b/packages/styling/src/styles/hiddenContentStyle.ts
new file mode 100644
index 0000000000000..ad8b32338a209
--- /dev/null
+++ b/packages/styling/src/styles/hiddenContentStyle.ts
@@ -0,0 +1,11 @@
+import { IRawStyle } from '@uifabric/merge-styles/lib/index';
+
+export const hiddenContentStyle: IRawStyle = {
+  position: 'absolute',
+  width: 1,
+  height: 1,
+  margin: -1,
+  padding: 0,
+  border: 0,
+  overflow: 'hidden'
+};
diff --git a/packages/styling/src/styles/index.ts b/packages/styling/src/styles/index.ts
index 601482c3753af..9252fb678d8ab 100644
--- a/packages/styling/src/styles/index.ts
+++ b/packages/styling/src/styles/index.ts
@@ -1,11 +1,8 @@
 export { AnimationStyles } from './AnimationStyles';
 export { DefaultPalette } from './DefaultPalette';
 export { DefaultFontStyles, FontSizes, FontWeights } from './DefaultFontStyles';
-export { IconCodes } from './IconCodes';
 export { getFocusStyle } from './getFocusStyle';
-export {
-  hideText
-} from './UtilityStyles';
+export { hiddenContentStyle } from './hiddenContentStyle';
 export {
   ThemeSettingName,
   getTheme,
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index ce8a5f2c75262..253d7600ea999 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -1,4 +1,4 @@
-import { GlobalSettings } from '@uifabric/utilities/lib/GlobalSettings';
+import { Customizations } from '@uifabric/utilities/lib/Customizations';
 import {
   IPalette,
   ISemanticColors,
@@ -22,7 +22,7 @@ let _theme: ITheme = {
 
 export const ThemeSettingName = 'theme';
 
-if (!GlobalSettings.getValue(ThemeSettingName)) {
+if (!Customizations.getSettings([ThemeSettingName]).theme) {
   let win = typeof window !== 'undefined' ? window : undefined;
 
   // tslint:disable:no-string-literal no-any
@@ -32,7 +32,7 @@ if (!GlobalSettings.getValue(ThemeSettingName)) {
   // tslint:enable:no-string-literal no-any
 
   // Set the default theme.
-  GlobalSettings.setValue(ThemeSettingName, _theme);
+  Customizations.applySettings({ [ThemeSettingName]: _theme });
 }
 
 /**
@@ -51,7 +51,7 @@ export function loadTheme(theme: IPartialTheme): ITheme {
   // Invoke the legacy method of theming the page as well.
   legacyLoadTheme({ ..._theme.palette, ..._theme.semanticColors });
 
-  GlobalSettings.setValue(ThemeSettingName, _theme);
+  Customizations.applySettings({ [ThemeSettingName]: _theme });
 
   return _theme;
 }
diff --git a/packages/styling/src/utilities/buildClassMap.ts b/packages/styling/src/utilities/buildClassMap.ts
index 9ab4bc9c6f0d1..f1e1a88517d97 100644
--- a/packages/styling/src/utilities/buildClassMap.ts
+++ b/packages/styling/src/utilities/buildClassMap.ts
@@ -1,4 +1,4 @@
-import { mergeStyles } from './mergeStyles';
+import { mergeStyles } from '@uifabric/merge-styles/lib/index';
 
 /**
  * Builds a class names object from a given map.
diff --git a/packages/styling/src/utilities/getIconClassName.ts b/packages/styling/src/utilities/getIconClassName.ts
index 92cef84521729..a589f67b7b126 100644
--- a/packages/styling/src/utilities/getIconClassName.ts
+++ b/packages/styling/src/utilities/getIconClassName.ts
@@ -1,33 +1,29 @@
 import {
-  IconClassNames
-} from '../classNames/IconClassNames';
-
-let _lowerCaseIconMap: { [key: string]: string };
+  mergeStyles
+} from '@uifabric/merge-styles/lib/index';
+import { getIcon } from './icons';
 
 /**
- * Gets an icon classname, given an icon name (case insensitive.) The class name can be attached to
- * an I tag with no additional classnames. This will render the icon code using a ::before pseudo-selector.
+ * Gets an icon classname. You should be able to add this classname to an I tag with no
+ * additional classnames, and render the icon.
  *
  * @public
  */
 export function getIconClassName(name: string): string {
-  if (!name) {
-    return '';
-  }
-
-  // Make the lookup case insensitive. Note that this implementation is different in Fabric 5, but this method
-  // is being added sooner to make it easier to transition products.
-  name = name.toLowerCase();
-
-  if (!_lowerCaseIconMap) {
-    _lowerCaseIconMap = {};
+  let className = '';
+  const icon = getIcon(name);
 
-    for (let iconName in IconClassNames) {
-      if (IconClassNames.hasOwnProperty(iconName)) {
-        _lowerCaseIconMap[iconName.toLowerCase()] = iconName;
-      }
-    }
+  if (icon) {
+    className = mergeStyles(
+      icon.subset.className,
+      {
+        selectors: {
+          '::before': {
+            content: `"${icon.code}"`
+          }
+        }
+      });
   }
 
-  return IconClassNames[_lowerCaseIconMap[name.toLowerCase()]] || '';
+  return className;
 }
diff --git a/packages/styling/src/utilities/icons.ts b/packages/styling/src/utilities/icons.ts
new file mode 100644
index 0000000000000..b66c2427a6fa0
--- /dev/null
+++ b/packages/styling/src/utilities/icons.ts
@@ -0,0 +1,141 @@
+import {
+  warn
+} from '@uifabric/utilities/lib/warn';
+import {
+  GlobalSettings
+} from '@uifabric/utilities/lib/GlobalSettings';
+import {
+  IRawStyle,
+  IFontFace,
+  fontFace,
+  mergeStyles
+} from '@uifabric/merge-styles/lib/index';
+
+export interface IIconSubset {
+  fontFace: IFontFace;
+  icons: {
+    [key: string]: string;
+  };
+  style?: IRawStyle;
+}
+
+export interface IIconSubsetRecord extends IIconSubset {
+  isRegistered?: boolean;
+  className?: string;
+}
+
+export interface IIconRecord {
+  code: string;
+  subset: IIconSubsetRecord;
+}
+
+export interface IIconOptions {
+  warnOnMissingIcons: boolean;
+}
+
+export interface IIconRecords {
+  __options: IIconOptions;
+  __remapped: { [key: string]: string };
+  [key: string]: IIconRecord | {};
+}
+
+const ICON_SETTING_NAME = 'icons';
+const _icons = GlobalSettings.getValue<IIconRecords>(ICON_SETTING_NAME, {
+  __options: {
+    warnOnMissingIcons: true
+  },
+  __remapped: {}
+});
+
+/**
+ * Registers a given subset of icons.
+ *
+ * @param iconSubset - the icon subset definition.
+ */
+export function registerIcons(iconSubset: IIconSubset): void {
+  let subset = {
+    ...iconSubset,
+    isRegistered: false,
+    className: undefined
+  };
+  let { icons } = iconSubset;
+
+  for (const iconName in icons) {
+    if (icons.hasOwnProperty(iconName)) {
+      const code = icons[iconName];
+      const normalizedIconName = iconName.toLowerCase();
+
+      if (_icons[normalizedIconName]) {
+        warn(`Icon '${iconName} being re-registered`);
+      }
+
+      _icons[normalizedIconName] = {
+        code,
+        subset
+      };
+    }
+  }
+}
+
+/**
+ * Remaps one icon name to another.
+ */
+export function registerIconAlias(iconName: string, mappedToName: string): void {
+  _icons.__remapped[iconName.toLowerCase()] = mappedToName.toLowerCase();
+}
+
+/**
+ * Gets an icon definition. If an icon is requested but the subset has yet to be registered,
+ * it will get registered immediately.
+ *
+ * @public
+ * @param name - Name of icon.
+ */
+export function getIcon(name?: string): IIconRecord | undefined {
+  let icon: IIconRecord | undefined = undefined;
+
+  name = name ? name.toLowerCase() : '';
+  name = _icons.__remapped[name] || name;
+
+  if (name) {
+    icon = _icons[name!] as IIconRecord;
+
+    if (icon) {
+      let { subset } = icon;
+
+      if (!subset.isRegistered) {
+        // Register font face for given icons.
+        fontFace(subset.fontFace);
+
+        // Generate a base class name for the given font.
+        subset.className = mergeStyles(
+          subset.style,
+          {
+            fontFamily: subset.fontFace.fontFamily,
+            fontWeight: subset.fontFace.fontWeight || 'normal',
+            fontStyle: subset.fontFace.fontStyle || 'normal'
+          }).toString();
+
+        subset.isRegistered = true;
+      }
+    } else {
+      if (_icons.__options.warnOnMissingIcons) {
+        warn(`The icon "${name}" was referenced but not registered.`);
+      }
+    }
+  }
+
+  return icon;
+}
+
+/**
+ * Sets the icon options.
+ *
+ * @public
+ */
+export function setIconOptions(options: IIconOptions): void {
+  _icons.__options = {
+    ..._icons.__options,
+    ...options
+  };
+}
diff --git a/packages/styling/src/utilities/index.ts b/packages/styling/src/utilities/index.ts
index 6b8f0bfb89ec9..df9963b41c9f6 100644
--- a/packages/styling/src/utilities/index.ts
+++ b/packages/styling/src/utilities/index.ts
@@ -1,12 +1,17 @@
-export {
-  mergeStyles
-} from './mergeStyles';
-export {
-  mergeStyleSets
-} from './mergeStyleSets';
 export {
   buildClassMap
 } from './buildClassMap';
+
+export {
+  IIconRecord,
+  IIconSubset,
+  IIconOptions,
+  getIcon,
+  registerIcons,
+  registerIconAlias,
+  setIconOptions
+} from './icons';
+
 export {
   getIconClassName
-} from './getIconClassName';
\ No newline at end of file
+} from './getIconClassName';
diff --git a/packages/styling/src/utilities/mergeStyleSets.ts b/packages/styling/src/utilities/mergeStyleSets.ts
deleted file mode 100644
index cd8590ce34727..0000000000000
--- a/packages/styling/src/utilities/mergeStyleSets.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import { mergeStyles } from './mergeStyles';
-
-/**
- * Merges a give set of styles by running mergeStyles for each unique key. Works
- * like Object.assign in that it layers them in the argument order specified, but will
- * not mutate them and will return the merged result.
- */
-export function mergeStyleSets<T>(...args: T[]): {[key in keyof T]?: string } {
-  const mergedRules: {[key in keyof T]?: string } = {};
-  // tslint:disable-next-line:no-any
-  const setStyles: any = {};
-
-  args.forEach((arg: T) => arg && Object.keys(arg).forEach((key: string) => {
-    if (!setStyles[key]) {
-      setStyles[key] = [];
-    }
-    // tslint:disable-next-line:no-any
-    setStyles[key].push((arg as any)[key]);
-  }));
-
-  Object.keys(setStyles).forEach((key: string) => {
-    // tslint:disable-next-line:no-any
-    (mergedRules as any)[key] = mergeStyles(setStyles[key]);
-  });
-
-  return mergedRules;
-}
diff --git a/packages/styling/src/utilities/mergeStyles.ts b/packages/styling/src/utilities/mergeStyles.ts
deleted file mode 100644
index a74e67bdd30cb..0000000000000
--- a/packages/styling/src/utilities/mergeStyles.ts
+++ /dev/null
@@ -1,53 +0,0 @@
-import { css, Rule } from 'glamor';
-import { IStyle, IProcessedStyle } from '../interfaces/index';
-
-import { FabricPerformance } from '@uifabric/utilities/lib/FabricPerformance';
-
-/**
- * Takes a collection of collection of styles, defined in various formats, and compresses them into
- * a single thing of one format to return.
- * If any class names (strings) are passed in, it will return a list of space-separated class names,
- * using glamor to generate a class name for all passed in style objects.
- * Otherwise, all style objects passed in will be compressed into a single IProcessedStyle.
- *
- * @export
- * @param {(...(IStyle | string)[])} args
- * @returns {IStyle}
- */
-export function mergeStyles(...args: (IStyle | string | null | undefined)[]): IProcessedStyle | string {
-  const classes: string[] = [];
-  const rules: Rule[] = [];
-
-  function _parseArgs(theArgs: (IStyle | string | null | undefined)[]): void {
-    for (const arg of theArgs) {
-      if (arg) {
-        if (typeof arg === 'string') {
-          classes.push(arg);
-        } else if (Array.isArray(arg)) {
-          _parseArgs(arg);
-        } else {
-          rules.push(arg as Rule);
-        }
-      }
-    }
-  }
-
-  _parseArgs(args);
-
-  let rulesObject: IStyle | null = null;
-
-  if (rules.length) {
-    FabricPerformance.measure('glamor.css', () => {
-      rulesObject = css(...rules);
-    });
-  }
-
-  if (classes.length) {
-    if (rulesObject) {
-      classes.push((rulesObject as IStyle).toString());
-    }
-    return classes.join(' ');
-  }
-
-  return rulesObject || {};
-}
diff --git a/packages/styling/tsconfig.json b/packages/styling/tsconfig.json
index 73dec4f4a170e..c07dc5607e845 100644
--- a/packages/styling/tsconfig.json
+++ b/packages/styling/tsconfig.json
@@ -18,8 +18,6 @@
       "dom"
     ],
     "types": [
-      "chai",
-      "mocha",
       "webpack-env"
     ],
     "paths": {
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index ab3ae3e8924af..55a14a0a7c476 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "4.16.0",
+  "version": "5.0.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -21,17 +21,17 @@
   ],
   "devDependencies": {
     "@types/jest": "21.1.0",
-    "@types/enzyme": "2.8.0",
+    "@types/enzyme": "2.8.8",
     "@types/prop-types": "15.5.1",
     "@types/react": "15.0.38",
     "@types/react-addons-test-utils": "0.14.18",
     "@types/react-dom": "15.5.1",
     "@types/sinon": "2.2.2",
-    "enzyme": "^2.7.0",
-    "office-ui-fabric-react-tslint": ">=1.0.0 <2.0.0",
-    "react": "^15.4.2",
+    "enzyme": "^2.9.1",
+    "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
+    "react": "^15.6.1",
     "react-addons-test-utils": "^15.4.2",
-    "react-dom": "^15.4.2",
+    "react-dom": "^15.6.1",
     "sinon": "^2.3.2"
   },
   "dependencies": {
diff --git a/packages/utilities/src/Customizations.test.ts b/packages/utilities/src/Customizations.test.ts
new file mode 100644
index 0000000000000..10eec375319bd
--- /dev/null
+++ b/packages/utilities/src/Customizations.test.ts
@@ -0,0 +1,51 @@
+import {
+  Customizations
+} from './Customizations';
+
+describe('Customizations', () => {
+  beforeEach(() => {
+    Customizations.reset();
+  });
+
+  it('can set/get global settings', () => {
+    Customizations.applySettings({ a: 'a', b: 'b' });
+
+    expect(Customizations.getSettings(['a', 'b'])).toEqual({
+      a: 'a',
+      b: 'b'
+    });
+
+    expect(Customizations.getSettings(['a'])).toEqual({
+      a: 'a'
+    });
+
+    expect(Customizations.getSettings(['z'])).toEqual({});
+  });
+
+  it('can set/get scoped settings', () => {
+    Customizations.applyScopedSettings('Foo', { a: 'a', b: 'b' });
+
+    expect(Customizations.getSettings(['a', 'b'], 'Foo')).toEqual({
+      a: 'a',
+      b: 'b'
+    });
+
+    expect(Customizations.getSettings(['a'], 'Bar')).toEqual({});
+  });
+
+  it('can fire changes', () => {
+    let counter = 0;
+    let incCounter = () => counter++;
+
+    Customizations.observe(incCounter);
+
+    Customizations.applyScopedSettings('Foo', { a: 'a', b: 'b' });
+    Customizations.applySettings({ a: 'a', b: 'b' });
+
+    expect(counter).toEqual(2);
+    Customizations.unobserve(incCounter);
+
+    Customizations.applySettings({ a: 'a', b: 'b' });
+    expect(counter).toEqual(2);
+  });
+});
\ No newline at end of file
diff --git a/packages/utilities/src/Customizations.ts b/packages/utilities/src/Customizations.ts
new file mode 100644
index 0000000000000..ecf0cae86a9ff
--- /dev/null
+++ b/packages/utilities/src/Customizations.ts
@@ -0,0 +1,77 @@
+import {
+  GlobalSettings
+} from './GlobalSettings';
+import {
+  EventGroup
+} from './EventGroup';
+
+export interface ICustomizations {
+  // tslint:disable-next-line:no-any
+  settings: { [key: string]: any };
+  // tslint:disable-next-line:no-any
+  scopedSettings: { [key: string]: { [key: string]: any } };
+}
+
+const CustomizationsGlobalKey = 'customizations';
+const NO_CUSTOMIZATIONS = { settings: {}, scopedSettings: {} };
+
+let _allSettings = GlobalSettings.getValue<ICustomizations>(CustomizationsGlobalKey, {
+  settings: {},
+  scopedSettings: {}
+});
+
+const _events = new EventGroup(_allSettings);
+
+export class Customizations {
+  public static reset(): void {
+    _allSettings.settings = {};
+    _allSettings.scopedSettings = {};
+  }
+
+  // tslint:disable-next-line:no-any
+  public static applySettings(settings: { [key: string]: any }): void {
+    _allSettings.settings = { ..._allSettings.settings, ...settings };
+    Customizations._raiseChange();
+  }
+
+  // tslint:disable-next-line:no-any
+  public static applyScopedSettings(scopeName: string, settings: { [key: string]: any }): void {
+    _allSettings.scopedSettings[scopeName] = { ..._allSettings.scopedSettings[scopeName], ...settings };
+    Customizations._raiseChange();
+  }
+
+  public static getSettings(
+    properties: string[],
+    scopeName?: string,
+    localSettings: ICustomizations = NO_CUSTOMIZATIONS
+    // tslint:disable-next-line:no-any
+  ): any {
+    // tslint:disable-next-line:no-any
+    const settings: { [key: string]: any } = {};
+    const localScopedSettings = (scopeName && localSettings.scopedSettings[scopeName]) || {};
+    const globalScopedSettings = (scopeName && _allSettings.scopedSettings[scopeName]) || {};
+
+    for (let property of properties) {
+      settings[property] = (
+        localScopedSettings[property] ||
+        localSettings.settings[property] ||
+        globalScopedSettings[property] ||
+        _allSettings.settings[property]
+      );
+    }
+
+    return settings;
+  }
+
+  public static observe(onChange: () => void): void {
+    _events.on(_allSettings, 'change', onChange);
+  }
+
+  public static unobserve(onChange: () => void): void {
+    _events.off(_allSettings, 'change', onChange);
+  }
+
+  private static _raiseChange(): void {
+    _events.raise('change');
+  }
+}
diff --git a/packages/utilities/src/Customizer.test.tsx b/packages/utilities/src/Customizer.test.tsx
new file mode 100644
index 0000000000000..cfb3004ce966c
--- /dev/null
+++ b/packages/utilities/src/Customizer.test.tsx
@@ -0,0 +1,94 @@
+import * as React from 'react';
+import * as ReactDOM from 'react-dom/server';
+import { customizable } from './customizable';
+import { Customizer } from './Customizer';
+import { Customizations } from './Customizations';
+
+@customizable('Foo', ['field'])
+class Foo extends React.Component<{ field?: string; }, {}> {
+  public render(): JSX.Element {
+    return (
+      <div>{ this.props.field }</div>
+    );
+  }
+}
+
+@customizable('Bar', ['field', 'field2', 'field3'])
+class Bar extends React.Component<{ field?: string; field2?: string, field3?: string }, {}> {
+  public render(): JSX.Element {
+    return (
+      <div>{ this.props.field }{ this.props.field2 }{ this.props.field3 }</div>
+    );
+  }
+}
+
+describe('Customizer', () => {
+  beforeEach(() => {
+    Customizations.reset();
+  });
+
+  it('can provide new defaults', () => {
+    expect(ReactDOM.renderToStaticMarkup(
+      <Customizer settings={ { field: 'customName' } }>
+        <Foo />
+      </Customizer>
+    )).toEqual('<div>customName</div>');
+  });
+
+  it('can pass through global settings', () => {
+    Customizations.applySettings({ 'field': 'globalName' });
+    expect(ReactDOM.renderToStaticMarkup(
+      <Customizer settings={ { nonMatch: 'customName' } }>
+        <Foo />
+      </Customizer>
+    )).toEqual('<div>globalName</div>');
+  });
+
+  it('can override global settings', () => {
+    Customizations.applySettings({ 'field': 'globalName' });
+    expect(ReactDOM.renderToStaticMarkup(
+      <Customizer settings={ { field: 'customName' } }>
+        <Foo />
+      </Customizer>
+    )).toEqual('<div>customName</div>');
+  });
+
+  it('can scope settings to specific components', () => {
+    let scopedSettings = {
+      Foo: { field: 'scopedToFoo' },
+      Bar: { field: 'scopedToBar' }
+    };
+
+    expect(ReactDOM.renderToStaticMarkup(
+      <Customizer scopedSettings={ scopedSettings }>
+        <div>
+          <Foo />
+          <Bar />
+        </div>
+      </Customizer>
+    )).toEqual('<div><div>scopedToFoo</div><div>scopedToBar</div></div>');
+  });
+
+  it('can layer global settings', () => {
+    expect(ReactDOM.renderToStaticMarkup(
+      <Customizer settings={ { field: 'field' } }>
+        <Customizer settings={ { field2: 'field2' } }>
+          <Bar />
+        </Customizer >
+      </Customizer >
+    )).toEqual('<div>fieldfield2</div>');
+  });
+
+  it('can layer scoped settings', () => {
+    Customizations.applySettings({ 'field3': 'field3' });
+
+    expect(ReactDOM.renderToStaticMarkup(
+      <Customizer scopedSettings={ { Bar: { field: 'field' } } }>
+        <Customizer scopedSettings={ { Bar: { field2: 'field2' } } }>
+          <Bar />
+        </Customizer >
+      </Customizer >
+    )).toEqual('<div>fieldfield2field3</div>');
+  });
+
+});
diff --git a/packages/utilities/src/Customizer.tsx b/packages/utilities/src/Customizer.tsx
index 79310d828405c..302818a1fbee8 100644
--- a/packages/utilities/src/Customizer.tsx
+++ b/packages/utilities/src/Customizer.tsx
@@ -1,36 +1,13 @@
 import * as React from 'react';
 import * as PropTypes from 'prop-types';
-import { BaseComponent } from './BaseComponent';
+import { BaseComponent, IBaseProps } from './BaseComponent';
+import { ICustomizations } from './Customizations';
 
-/**
- * Settings interface.
- *
- * @internal
- */
-export interface ISettings {
-  // tslint:disable-next-line:no-any
-  [key: string]: any;
+export interface ICustomizerContext {
+  customizations: ICustomizations;
 }
 
-/**
- * Customizer component props.
- *
- * @public
- */
-export interface ICustomizerProps {
-  componentRef?: () => void;
-
-  settings: ISettings;
-}
-
-/**
- * Customizer component state.
- *
- * @internal
- */
-export interface ICustomizerState {
-  injectedProps?: ISettings;
-}
+export type ICustomizerProps = Partial<ICustomizations> & IBaseProps;
 
 /**
  * The Customizer component allows for default props to be mixed into components which
@@ -44,50 +21,64 @@ export interface ICustomizerState {
  *
  * @public
  */
-export class Customizer extends BaseComponent<ICustomizerProps, ICustomizerState> {
+export class Customizer extends BaseComponent<ICustomizerProps, ICustomizerContext> {
   public static contextTypes: {
-    injectedProps: PropTypes.Requireable<{}>;
+    customizations: PropTypes.Requireable<{}>;
   } = {
-    injectedProps: PropTypes.object
+    customizations: PropTypes.object
   };
 
   public static childContextTypes: {
-    injectedProps: PropTypes.Requireable<{}>;
+    customizations: PropTypes.Requireable<{}>;
   } = Customizer.contextTypes;
 
   // tslint:disable-next-line:no-any
   constructor(props: ICustomizerProps, context: any) {
     super(props);
 
-    this.state = this._getInjectedProps(props, context);
+    this.state = this._getCustomizations(props, context);
   }
 
-  public getChildContext(): ICustomizerState {
+  public getChildContext(): ICustomizerContext {
     return this.state;
   }
 
   // tslint:disable-next-line:no-any
-  public componentWillReceiveProps(newProps: ICustomizerProps, newContext: any): void {
-    this.setState(this._getInjectedProps(newProps, newContext));
+  public componentWillReceiveProps(newProps: any, newContext: any): void {
+    this.setState(this._getCustomizations(newProps, newContext));
   }
 
   public render(): React.ReactElement<{}> {
     return React.Children.only(this.props.children);
   }
 
-  private _getInjectedProps(props: ICustomizerProps, context: ICustomizerState): {
-    injectedProps: {
-      // tslint:disable-next-line:no-any
-      [x: string]: any;
-    };
-  } {
-    let { settings: injectedPropsFromSettings = {} as ISettings } = props;
-    let { injectedProps: injectedPropsFromContext = {} as ISettings } = context;
+  private _getCustomizations(
+    props: ICustomizerProps,
+    context: ICustomizerContext
+  ): ICustomizerContext {
+    let {
+      settings = {},
+      scopedSettings = {}
+    } = props;
+    let {
+      customizations = { settings: {}, scopedSettings: {} }
+    } = context;
+
+    let newScopedSettings = { ...scopedSettings };
+
+    for (let name in customizations.scopedSettings) {
+      if (customizations.scopedSettings.hasOwnProperty(name)) {
+        newScopedSettings[name] = { ...scopedSettings[name], ...customizations.scopedSettings[name] };
+      }
+    }
 
     return {
-      injectedProps: {
-        ...injectedPropsFromContext,
-        ...injectedPropsFromSettings
+      customizations: {
+        settings: {
+          ...settings,
+          ...customizations.settings
+        },
+        scopedSettings: newScopedSettings
       }
     };
   }
diff --git a/packages/utilities/src/GlobalSettings.ts b/packages/utilities/src/GlobalSettings.ts
index c075f3a78c5e7..21ac41e08ca25 100644
--- a/packages/utilities/src/GlobalSettings.ts
+++ b/packages/utilities/src/GlobalSettings.ts
@@ -64,7 +64,7 @@ export class GlobalSettings {
     return _globalSettings[key];
   }
 
-  public static setValue<T>(key: string, value: T): void {
+  public static setValue<T>(key: string, value: T): T {
     let oldValue = _globalSettings[key];
 
     if (value !== oldValue) {
@@ -82,6 +82,8 @@ export class GlobalSettings {
         }
       }
     }
+
+    return value;
   }
 
   public static addChangeListener(cb: IChangeEventCallback): void {
diff --git a/packages/utilities/src/customizable.test.tsx b/packages/utilities/src/customizable.test.tsx
index 5ac49ef884310..66e78fa160870 100644
--- a/packages/utilities/src/customizable.test.tsx
+++ b/packages/utilities/src/customizable.test.tsx
@@ -1,38 +1,41 @@
 import * as React from 'react';
 import * as ReactDOM from 'react-dom/server';
 import { customizable } from './customizable';
-import { Customizer } from './Customizer';
-import { GlobalSettings } from './GlobalSettings';
-
-@customizable(['name', 'name2'])
-class Foo extends React.Component<{ field: string; }, {}> {
-  public name: string;
+import { Customizations } from './Customizations';
 
+@customizable('Foo', ['field'])
+class Foo extends React.Component<{ field?: string; }, {}> {
   public render(): JSX.Element {
-    // tslint:disable-next-line:no-any
-    return <div>{ (this.props as any)[this.props.field] }</div>;
+    return <div>{ this.props.field }</div>;
   }
 }
 
 describe('customizable', () => {
+  beforeEach(() => {
+    Customizations.reset();
+  });
 
-  it('can inject customizations', () => {
-    GlobalSettings.setValue('name', 'defaultName');
+  it('can receive global customizations', () => {
+    Customizations.applySettings({ field: 'globalName' });
+    expect(ReactDOM.renderToStaticMarkup(<Foo />)).toEqual('<div>globalName</div>');
+  });
 
-    expect(ReactDOM.renderToStaticMarkup(<Foo field='name' />)).toEqual('<div>defaultName</div>');
-    expect(ReactDOM.renderToStaticMarkup(<Foo field='name2' />)).toEqual('<div></div>');
+  it('can receive scoped customizations', () => {
+    Customizations.applySettings({ field: 'globalName' });
+    Customizations.applyScopedSettings('Foo', { field: 'scopedName' });
+    expect(ReactDOM.renderToStaticMarkup(<Foo />)).toEqual('<div>scopedName</div>');
+  });
 
-    expect(ReactDOM.renderToStaticMarkup(
-      <Customizer settings={ { name: 'customName' } }>
-        <Foo field='name' />
-      </Customizer>
-    )).toEqual('<div>customName</div>');
+  it('can ignore scoped customizations that do not apply', () => {
+    Customizations.applySettings({ field: 'globalName' });
+    Customizations.applyScopedSettings('Bar', { field: 'scopedName' });
+    expect(ReactDOM.renderToStaticMarkup(<Foo />)).toEqual('<div>globalName</div>');
+  });
 
-    expect(ReactDOM.renderToStaticMarkup(
-      <Customizer settings={ { name2: 'customName' } }>
-        <Foo field='name2' />
-      </Customizer>
-    )).toEqual('<div>customName</div>');
+  it('can accept props over global/scoped values', () => {
+    Customizations.applySettings({ field: 'globalName' });
+    Customizations.applyScopedSettings('Foo', { field: 'scopedName' });
+    expect(ReactDOM.renderToStaticMarkup(<Foo field='name' />)).toEqual('<div>name</div>');
   });
 
 });
diff --git a/packages/utilities/src/customizable.tsx b/packages/utilities/src/customizable.tsx
index 6ec6dc9d70ebf..962bde6e14252 100644
--- a/packages/utilities/src/customizable.tsx
+++ b/packages/utilities/src/customizable.tsx
@@ -1,9 +1,13 @@
 import * as React from 'react';
 import * as PropTypes from 'prop-types';
-import { GlobalSettings, IChangeDescription } from './GlobalSettings';
+import { Customizations } from './Customizations';
+
+export function customizable(
+  scope: string,
+  fields: string[]
+  // tslint:disable-next-line:no-any
+): <P, S>(ComposedComponent: new (props: P, ...args: any[]) => React.Component<P, S>) => any {
 
-// tslint:disable-next-line:no-any
-export function customizable(fields: string[]): <P, S>(ComposedComponent: new (props: P, ...args: any[]) => React.Component<P, S>) => any {
   // tslint:disable-next-line:no-shadowed-variable
   return function customizableFactory<P, S>(
     // tslint:disable-next-line:no-any
@@ -11,10 +15,12 @@ export function customizable(fields: string[]): <P, S>(ComposedComponent: new (p
     // tslint:disable-next-line:no-any
   ): any {
     return class ComponentWithInjectedProps extends React.Component<P, {}> {
+      public static displayName: string = 'Customized' + scope;
+
       public static contextTypes: {
-        injectedProps: PropTypes.Requireable<{}>;
+        customizations: PropTypes.Requireable<{}>;
       } = {
-        injectedProps: PropTypes.object
+        customizations: PropTypes.object
       };
 
       // tslint:disable-next-line:no-any
@@ -25,22 +31,15 @@ export function customizable(fields: string[]): <P, S>(ComposedComponent: new (p
       }
 
       public componentDidMount(): void {
-        GlobalSettings.addChangeListener(this._onSettingChanged);
+        Customizations.observe(this._onSettingChanged);
       }
 
       public componentWillUnmount(): void {
-        GlobalSettings.removeChangeListener(this._onSettingChanged);
+        Customizations.unobserve(this._onSettingChanged);
       }
 
       public render(): JSX.Element {
-        let defaultProps = {};
-
-        for (let propName of fields) {
-          // tslint:disable-next-line:no-any
-          (defaultProps as any)[propName] = (this.context.injectedProps) ?
-            this.context.injectedProps[propName] :
-            GlobalSettings.getValue(propName);
-        }
+        const defaultProps = Customizations.getSettings(fields, scope, this.context.customizations);
 
         return (
           // tslint:disable-next-line:no-any
@@ -48,10 +47,8 @@ export function customizable(fields: string[]): <P, S>(ComposedComponent: new (p
         );
       }
 
-      private _onSettingChanged(change: IChangeDescription): void {
-        if (fields.indexOf(change.key) >= 0) {
-          this.forceUpdate();
-        }
+      private _onSettingChanged(): void {
+        this.forceUpdate();
       }
 
     };
diff --git a/packages/utilities/src/index.ts b/packages/utilities/src/index.ts
index 852e621c83ad0..08af844e16553 100644
--- a/packages/utilities/src/index.ts
+++ b/packages/utilities/src/index.ts
@@ -2,6 +2,7 @@ export * from './Async';
 export * from './AutoScroll';
 export * from './BaseComponent';
 export * from './Customizer';
+export * from './Customizations';
 export * from './DelayedRender';
 export * from './EventGroup';
 export * from './FabricPerformance';
diff --git a/packages/utilities/src/scroll.scss b/packages/utilities/src/scroll.scss
index 3760891597970..4f1d16d7d1cc4 100644
--- a/packages/utilities/src/scroll.scss
+++ b/packages/utilities/src/scroll.scss
@@ -2,5 +2,4 @@
 // is coming from.
 .scrollDisabled {
   overflow: hidden !important;
-  user-select: none;
 }
diff --git a/rush.json b/rush.json
index f506d16c3c14f..d49b1d50725d6 100644
--- a/rush.json
+++ b/rush.json
@@ -47,6 +47,11 @@
         "@uifabric/example-app-base"
       ]
     },
+    {
+      "packageName": "@uifabric/icons",
+      "projectFolder": "packages/icons",
+      "shouldPublish": true
+    },
     {
       "packageName": "ssr-tests",
       "projectFolder": "apps/ssr-tests",
diff --git a/scripts/package.json b/scripts/package.json
index ec95dba9ad352..970e248f9e0fa 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/build",
-  "version": "1.0.0",
+  "version": "5.0.0",
   "private": true,
   "scripts": {
     "clean": "",
@@ -9,6 +9,7 @@
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@microsoft/loader-load-themed-styles": "^1.4.2",
+    "@uifabric/merge-styles": ">=5.0.0 <6.0.0",
     "autoprefixer": "^7.1.2",
     "awesome-typescript-loader": "^3.2.3",
     "chalk": "^2.1.0",
@@ -21,8 +22,8 @@
     "gzip-size": "^3.0.0",
     "istanbul-instrumenter-loader": "^3.0.0",
     "json-loader": "^0.5.7",
-    "jest": "^21.0.1",
-    "ts-jest": "^21.0.0",
+    "jest": "^21.1.0",
+    "ts-jest": "^21.0.1",
     "karma": "^1.7.0",
     "karma-coverage": "^1.1.1",
     "karma-mocha": "^1.3.0",
diff --git a/scripts/publish-beta.js b/scripts/publish-beta.js
new file mode 100644
index 0000000000000..6a47f4b248a3a
--- /dev/null
+++ b/scripts/publish-beta.js
@@ -0,0 +1,23 @@
+const fs = require('fs');
+const path = require('path');
+const chalk = require('chalk');
+const execSync = require('./exec-sync');
+
+const newVersion = process.argv[2];
+const newDep = process.argv[3] || newVersion;
+
+const packages = [
+  'utilities',
+  'merge-styles',
+  'icons',
+  'styling',
+  'office-ui-fabric-react',
+  'experiments'
+];
+
+for (const package of packages) {
+  let packagePath = path.resolve('../packages', package);
+
+  console.log(`Publishing ${chalk.magenta(package)} in ${packagePath}`);
+  execSync('npm publish --tag beta', undefined, packagePath);
+}
diff --git a/scripts/tasks/jest-resources.js b/scripts/tasks/jest-resources.js
index b1f577f0f421a..a5a5ff51aaf6e 100644
--- a/scripts/tasks/jest-resources.js
+++ b/scripts/tasks/jest-resources.js
@@ -1,30 +1,46 @@
 const path = require('path');
 
-module.exports = {
-  createRawConfig: () => (
-    {
-      rootDir: 'lib',
-      "testRegex": "(/__tests__/.*|\\.(test|spec))\\.js$",
-    }
-  ),
-  createConfig: () => (
-    {
-      moduleNameMapper: {
-        'ts-jest': path.resolve(__dirname, '../node_modules/ts-jest')
-      },
-      "transform": {
-        ".(ts|tsx)": path.resolve(__dirname, '../node_modules/ts-jest/preprocessor.js')
-      },
-      "reporters": [
-        path.resolve(__dirname, './jest-reporter.js')
-      ],
-      "testRegex": "(/__tests__/.*|\\.(test|spec))\\.(ts|tsx)$",
-      "moduleFileExtensions": [
-        "ts",
-        "tsx",
-        "js",
-        "jsx",
-        "json"
-      ]
-    })
-};
+const styleMockPath =
+  module.exports = {
+    createRawConfig: () => (
+      {
+        rootDir: 'lib',
+        'testRegex': '(/__tests__/.*|\\.(test|spec))\\.js$',
+      }
+    ),
+    createConfig: () => (
+      {
+        moduleNameMapper: {
+          'ts-jest': path.resolve(__dirname, '../node_modules/ts-jest'),
+          '\\.(scss)$': path.resolve(__dirname, 'jest-style-mock.js')
+        },
+
+        'transform': {
+          '.(ts|tsx)': path.resolve(__dirname, '../node_modules/ts-jest/preprocessor.js')
+        },
+
+        'reporters': [
+          path.resolve(__dirname, './jest-reporter.js')
+        ],
+
+        'testRegex': '(/__tests__/.*|\\.(test|spec))\\.(ts|tsx)$',
+        'moduleFileExtensions': [
+          'ts',
+          'tsx',
+          'js',
+          'jsx',
+          'json'
+        ],
+
+        'moduleDirectories': [
+          'node_modules',
+          path.resolve(process.cwd(), 'node_modules'),
+          path.resolve(__dirname, '../node_modules')
+        ],
+
+        'snapshotSerializers': [
+          path.resolve(__dirname, 'jest-serializer-merge-styles')
+        ]
+
+      })
+  };
diff --git a/scripts/tasks/jest-serializer-merge-styles.js b/scripts/tasks/jest-serializer-merge-styles.js
new file mode 100644
index 0000000000000..1159a3b934e09
--- /dev/null
+++ b/scripts/tasks/jest-serializer-merge-styles.js
@@ -0,0 +1,55 @@
+let { Stylesheet } = require('@uifabric/merge-styles');
+
+module.exports = {
+  print(val, serialize, indent) {
+    let classNames = [];
+    let rules = [];
+    let parts = val.split(' ');
+
+    for (let part of parts) {
+      let ruleSet = Stylesheet.getInstance().insertedRulesFromClassName(part);
+
+      if (ruleSet) {
+        rules.push(serializeRules(ruleSet, indent));
+      } else {
+        classNames.push(part);
+      }
+    }
+
+    return (
+      [
+        ``,
+        `${classNames.map(cn => indent(cn)).join('\n')}`,
+        `${rules.join('\n')}`
+      ].join('\n')
+    );
+  },
+
+  test(val) {
+    if (typeof val === 'string') {
+      let parts = val.split(' ');
+
+      return parts.some(part => Stylesheet.getInstance().insertedRulesFromClassName(part));
+    }
+
+    return false;
+  }
+};
+
+function serializeRules(rules, indent) {
+  let ruleStrings = [];
+
+  for (let i = 0; i < rules.length; i += 2) {
+    ruleStrings.push(indent((i === 0 ? '' : rules[i] + ' ') + `{`));
+
+    rules[i + 1].split(';').sort().forEach(rule => {
+      if (rule) {
+        ruleStrings.push(indent('  ' + rule.replace(':', ': ') + ';'));
+      }
+    });
+
+    ruleStrings.push(indent('}'));
+  }
+
+  return ruleStrings.join('\n');
+}
\ No newline at end of file
diff --git a/scripts/tasks/jest-style-mock.js b/scripts/tasks/jest-style-mock.js
new file mode 100644
index 0000000000000..a0995453769c8
--- /dev/null
+++ b/scripts/tasks/jest-style-mock.js
@@ -0,0 +1 @@
+module.exports = {};
\ No newline at end of file
diff --git a/scripts/update-package-versions.js b/scripts/update-package-versions.js
new file mode 100644
index 0000000000000..9e7b5390e2d37
--- /dev/null
+++ b/scripts/update-package-versions.js
@@ -0,0 +1,31 @@
+const fs = require('fs');
+const path = require('path');
+const chalk = require('chalk');
+
+const rushPackages = JSON.parse(fs.readFileSync('../rush.json', 'utf8'));
+const newVersion = process.argv[2];
+const newDep = process.argv[3] || newVersion;
+
+for (const package of rushPackages.projects) {
+  let packagePath = path.resolve('..', package.projectFolder, 'package.json');
+  let packageJson = JSON.parse(fs.readFileSync(packagePath, 'utf8'));
+
+  console.log(`Updating ${chalk.magenta(package.packageName)} from ${chalk.grey(packageJson.version)} to ${chalk.green(newVersion)}.`);
+
+  packageJson.version = newVersion;
+
+  function updateDependencies(deps) {
+    for (const dependency in deps) {
+      if (rushPackages.projects.find((pkg) => pkg.packageName === dependency)) {
+        console.log(`  Updating deps ${dependency}`);
+
+        deps[dependency] = newDep;
+      }
+    }
+  }
+
+  updateDependencies(packageJson.dependencies);
+  updateDependencies(packageJson.devDependencies);
+
+  fs.writeFileSync(packagePath, JSON.stringify(packageJson, null, 2), 'utf8');
+}

From 44c5c9ab7d20e253bb2564d5a7ba14badd0bfbce Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 27 Sep 2017 00:20:59 +0000
Subject: [PATCH 0729/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 22 ++++++++++++
 apps/fabric-website/CHANGELOG.md              |  9 ++++-
 apps/fabric-website/package.json              |  6 ++--
 apps/ssr-tests/package.json                   |  4 +--
 .../5.0_2017-09-26-23-14.json                 | 11 ------
 .../experiments/5.0_2017-09-26-23-14.json     | 11 ------
 .../fabric-website/5.0_2017-09-26-23-14.json  | 11 ------
 .../@uifabric/icons/5.0_2017-09-26-23-14.json | 11 ------
 .../styling/5.0_2017-09-26-23-14.json         | 11 ------
 .../utilities/5.0_2017-09-26-23-14.json       | 11 ------
 .../5.0_2017-09-26-23-14.json                 | 11 ------
 packages/example-app-base/CHANGELOG.json      | 22 ++++++++++++
 packages/example-app-base/CHANGELOG.md        |  9 ++++-
 packages/example-app-base/package.json        |  6 ++--
 packages/experiments/CHANGELOG.json           | 28 +++++++++++++++
 packages/experiments/CHANGELOG.md             |  9 ++++-
 packages/experiments/package.json             | 10 +++---
 packages/icons/CHANGELOG.json                 | 24 +++++++++++++
 packages/icons/CHANGELOG.md                   | 11 ++++++
 packages/icons/package.json                   |  4 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 28 +++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 35 +++++++++++--------
 packages/office-ui-fabric-react/package.json  | 10 +++---
 packages/styling/CHANGELOG.json               | 19 ++++++++++
 packages/styling/CHANGELOG.md                 | 11 ++++--
 packages/styling/package.json                 |  4 +--
 packages/utilities/CHANGELOG.json             | 14 ++++++++
 packages/utilities/CHANGELOG.md               |  9 ++++-
 packages/utilities/package.json               |  2 +-
 29 files changed, 253 insertions(+), 120 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/5.0_2017-09-26-23-14.json
 delete mode 100644 common/changes/@uifabric/experiments/5.0_2017-09-26-23-14.json
 delete mode 100644 common/changes/@uifabric/fabric-website/5.0_2017-09-26-23-14.json
 delete mode 100644 common/changes/@uifabric/icons/5.0_2017-09-26-23-14.json
 delete mode 100644 common/changes/@uifabric/styling/5.0_2017-09-26-23-14.json
 delete mode 100644 common/changes/@uifabric/utilities/5.0_2017-09-26-23-14.json
 delete mode 100644 common/changes/office-ui-fabric-react/5.0_2017-09-26-23-14.json
 create mode 100644 packages/icons/CHANGELOG.json
 create mode 100644 packages/icons/CHANGELOG.md

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index d984420577cf6..841478017ed9f 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.0.4",
+      "tag": "@uifabric/fabric-website_v5.0.4",
+      "date": "Wed, 27 Sep 2017 00:20:58 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "8a8c240b39c3ba12effab2c6c8e7021c3bc9cea9",
+            "comment": "Updated for Fabric 5.0."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/icons\" from `>=5.0.0 <6.0.0` to `>=5.0.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.0.0 <6.0.0` to `>=5.0.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.3",
       "tag": "@uifabric/fabric-website_v5.0.3",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 52942b0e6c448..608cb42d06252 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Fri, 22 Sep 2017 19:08:51 GMT and should not be manually modified.
+This log was last generated on Wed, 27 Sep 2017 00:20:58 GMT and should not be manually modified.
+
+## 5.0.4
+Wed, 27 Sep 2017 00:20:58 GMT
+
+### Patches
+
+- Updated for Fabric 5.0.
 
 ## 5.0.3
 Fri, 22 Sep 2017 19:08:51 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 52860e36abb7b..1c57d8f671325 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.0.3",
+  "version": "5.0.4",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,10 +44,10 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/icons": ">=5.0.0 <6.0.0",
+    "@uifabric/icons": ">=5.0.1 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.0.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.0.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 303551e00df38..147b0b20a72c8 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -17,14 +17,14 @@
   "license": "MIT",
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
-    "@uifabric/icons": ">=5.0.0 <6.0.0",
+    "@uifabric/icons": ">=5.0.1 <6.0.0",
     "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.8",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.0.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.0.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-addons-test-utils": "^15.4.2",
diff --git a/common/changes/@uifabric/example-app-base/5.0_2017-09-26-23-14.json b/common/changes/@uifabric/example-app-base/5.0_2017-09-26-23-14.json
deleted file mode 100644
index 4eca78fcca360..0000000000000
--- a/common/changes/@uifabric/example-app-base/5.0_2017-09-26-23-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Updated for Fabric 5.0.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/5.0_2017-09-26-23-14.json b/common/changes/@uifabric/experiments/5.0_2017-09-26-23-14.json
deleted file mode 100644
index 2c79da151bf71..0000000000000
--- a/common/changes/@uifabric/experiments/5.0_2017-09-26-23-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Updated for Fabric 5.0.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/5.0_2017-09-26-23-14.json b/common/changes/@uifabric/fabric-website/5.0_2017-09-26-23-14.json
deleted file mode 100644
index 9f1d630efddbb..0000000000000
--- a/common/changes/@uifabric/fabric-website/5.0_2017-09-26-23-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Updated for Fabric 5.0.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/5.0_2017-09-26-23-14.json b/common/changes/@uifabric/icons/5.0_2017-09-26-23-14.json
deleted file mode 100644
index 12cc905239da2..0000000000000
--- a/common/changes/@uifabric/icons/5.0_2017-09-26-23-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/icons",
-      "comment": "Initial release of the icons package.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/icons",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/5.0_2017-09-26-23-14.json b/common/changes/@uifabric/styling/5.0_2017-09-26-23-14.json
deleted file mode 100644
index 31c637b7044b9..0000000000000
--- a/common/changes/@uifabric/styling/5.0_2017-09-26-23-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "The 5.0 Fabric release. See the [the wiki](https://github.com/OfficeDev/office-ui-fabric-react/wiki/Fabric-5.0:-What's-new) for a full list of changes and how to work with the new bits.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/5.0_2017-09-26-23-14.json b/common/changes/@uifabric/utilities/5.0_2017-09-26-23-14.json
deleted file mode 100644
index 755fc43a73bce..0000000000000
--- a/common/changes/@uifabric/utilities/5.0_2017-09-26-23-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Updated for Fabric 5.0.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/5.0_2017-09-26-23-14.json b/common/changes/office-ui-fabric-react/5.0_2017-09-26-23-14.json
deleted file mode 100644
index 85f3d19e49bff..0000000000000
--- a/common/changes/office-ui-fabric-react/5.0_2017-09-26-23-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Updated for Fabric 5.0.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index edb1a46da8f52..6145162482fd1 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "5.0.1",
+      "tag": "@uifabric/example-app-base_v5.0.1",
+      "date": "Wed, 27 Sep 2017 00:20:58 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "8a8c240b39c3ba12effab2c6c8e7021c3bc9cea9",
+            "comment": "Updated for Fabric 5.0."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.0.0 <6.0.0` to `>=5.0.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.0.0 <6.0.0` to `>=5.0.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.2.7",
       "tag": "@uifabric/example-app-base_v4.2.7",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index f34b0612e1d19..887bc84e5b9d6 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Mon, 04 Sep 2017 10:16:56 GMT and should not be manually modified.
+This log was last generated on Wed, 27 Sep 2017 00:20:58 GMT and should not be manually modified.
+
+## 5.0.1
+Wed, 27 Sep 2017 00:20:58 GMT
+
+### Patches
+
+- Updated for Fabric 5.0.
 
 ## 4.2.7
 Mon, 04 Sep 2017 10:16:56 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 5b87fefddcd72..ed1d2a04b7e4d 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "5.0.0",
+  "version": "5.0.1",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -38,8 +38,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.0.0 <6.0.0",
-    "@uifabric/utilities": ">=5.0.0 <6.0.0",
+    "@uifabric/styling": ">=5.0.1 <6.0.0",
+    "@uifabric/utilities": ">=5.0.1 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=4.39.0 <5.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 6cea31094806b..27c79bc83e3a4 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,34 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.0.1",
+      "tag": "@uifabric/experiments_v5.0.1",
+      "date": "Wed, 27 Sep 2017 00:20:58 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "8a8c240b39c3ba12effab2c6c8e7021c3bc9cea9",
+            "comment": "Updated for Fabric 5.0."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.0.0 <6.0.0` to `>=5.0.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/icons\" from `>=5.0.0 <6.0.0` to `>=5.0.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=5.0.0 <6.0.0` to `>=5.0.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/icons\" from `>=5.0.0 <6.0.0` to `>=5.0.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.10.0",
       "tag": "@uifabric/experiments_v0.10.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 7a8eae465cef8..2ad95da8bdc0b 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Thu, 21 Sep 2017 06:23:58 GMT and should not be manually modified.
+This log was last generated on Wed, 27 Sep 2017 00:20:58 GMT and should not be manually modified.
+
+## 5.0.1
+Wed, 27 Sep 2017 00:20:58 GMT
+
+### Patches
+
+- Updated for Fabric 5.0.
 
 ## 0.10.0
 Thu, 21 Sep 2017 06:23:58 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 18c278f1d9054..7b5236cc1662b 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.0.0",
+  "version": "5.0.1",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -27,8 +27,8 @@
     "@types/jest": "^21.1.0",
     "@types/enzyme": "^2.8.8",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=5.0.0 <6.0.0",
-    "@uifabric/icons": ">=5.0.0 <6.0.0",
+    "@uifabric/example-app-base": ">=5.0.1 <6.0.0",
+    "@uifabric/icons": ">=5.0.1 <6.0.0",
     "es6-weak-map": "^2.0.2",
     "enzyme": "^2.9.1",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
@@ -41,8 +41,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.0.0 <6.0.0",
-    "@uifabric/icons": ">=5.0.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.0.1 <6.0.0",
+    "@uifabric/icons": ">=5.0.1 <6.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/icons/CHANGELOG.json b/packages/icons/CHANGELOG.json
new file mode 100644
index 0000000000000..1dc22bbdac839
--- /dev/null
+++ b/packages/icons/CHANGELOG.json
@@ -0,0 +1,24 @@
+{
+  "name": "@uifabric/icons",
+  "entries": [
+    {
+      "version": "5.0.1",
+      "tag": "@uifabric/icons_v5.0.1",
+      "date": "Wed, 27 Sep 2017 00:20:58 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "8a8c240b39c3ba12effab2c6c8e7021c3bc9cea9",
+            "comment": "Initial release of the icons package."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.0.0 <6.0.0` to `>=5.0.1 <6.0.0`"
+          }
+        ]
+      }
+    }
+  ]
+}
\ No newline at end of file
diff --git a/packages/icons/CHANGELOG.md b/packages/icons/CHANGELOG.md
new file mode 100644
index 0000000000000..b273e6be68f26
--- /dev/null
+++ b/packages/icons/CHANGELOG.md
@@ -0,0 +1,11 @@
+# Change Log - @uifabric/icons
+
+This log was last generated on Wed, 27 Sep 2017 00:20:58 GMT and should not be manually modified.
+
+## 5.0.1
+Wed, 27 Sep 2017 00:20:58 GMT
+
+### Patches
+
+- Initial release of the icons package.
+
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 2f5e41f7454c4..9fd9774ace705 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/icons",
-  "version": "5.0.0",
+  "version": "5.0.1",
   "description": "Office UI Fabric icon set.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -23,7 +23,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.0.0 <6.0.0",
+    "@uifabric/styling": ">=5.0.1 <6.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index b0964d97d0782..4de6676b0ed1b 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,34 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.0.1",
+      "tag": "office-ui-fabric-react_v5.0.1",
+      "date": "Wed, 27 Sep 2017 00:20:58 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "8a8c240b39c3ba12effab2c6c8e7021c3bc9cea9",
+            "comment": "Updated for Fabric 5.0."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/icons\" from `>=5.0.0 <6.0.0` to `>=5.0.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.0.0 <6.0.0` to `>=5.0.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.0.0 <6.0.0` to `>=5.0.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=5.0.0 <6.0.0` to `>=5.0.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "4.51.0",
       "tag": "office-ui-fabric-react_v4.51.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 891d92cbf5515..5b5f939c2f439 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 26 Sep 2017 20:42:17 GMT and should not be manually modified.
+This log was last generated on Wed, 27 Sep 2017 00:20:59 GMT and should not be manually modified.
+
+## 5.0.1
+Wed, 27 Sep 2017 00:20:58 GMT
+
+### Patches
+
+- Updated for Fabric 5.0.
 
 ## 4.51.0
 Tue, 26 Sep 2017 20:42:17 GMT
@@ -430,7 +437,7 @@ Fri, 11 Aug 2017 19:38:35 GMT
 - FocusZone: adjusting initialization logic to remove a potential memory leak in server rendered scenarios.
 - ComboBox: Update example to work correctly now that StrictNullChecks have been put in place
 - Nav: update isGroupCollapsed for new groups
-- Change dropdown's role from "combobox" to "menu"
+- Change dropdown's role from "combobox" to "menu" 
 - Changed DatePicker role to be more accurate for screen readers
 - Selection: Fix broken selection state in example.
 
@@ -448,7 +455,7 @@ Tue, 08 Aug 2017 15:28:32 GMT
 
 - BaseButton: Added screenReaderText styles to base button
 - BaseButton: Remove the IconButton dependency that was introduced with SplitButton.
-- Added role alert to "no results" view
+- Added role alert to "no results" view 
 
 ## 4.30.1
 Mon, 07 Aug 2017 10:22:46 GMT
@@ -600,7 +607,7 @@ Fri, 21 Jul 2017 10:21:45 GMT
 
 ### Patches
 
-- Do not redundantly set aria-label on command bar items.
+- Do not redundantly set aria-label on command bar items. 
 - More strict null check fixes in office-ui-fabric-react
 - Textfield: Fixed regression in disabled styles
 - ResizeGroup: Use scrollWidth instead of clientWidth for measuring hidden div
@@ -767,7 +774,7 @@ Fri, 30 Jun 2017 19:44:26 GMT
 ### Patches
 
 - Breadcrumb: Use flexbox for layout to better support multiple font sizes
-- MessageBar: Fixed padding regressions with multiline and no actions
+- MessageBar: Fixed padding regressions with multiline and no actions 
 
 ## 4.13.1
 Fri, 30 Jun 2017 10:23:15 GMT
@@ -821,7 +828,7 @@ Tue, 27 Jun 2017 01:26:31 GMT
 
 ### Minor changes
 
-- Commandbar: fix synchronous reflow
+- Commandbar: fix synchronous reflow 
 - Enhancing the calendar component to allow for turning off the day picker and highlighting the "today" month in the month picker. This will match the behavior of the Timestrip component in today's JSMVVM OWA Calendar.
 
 ### Patches
@@ -1067,7 +1074,7 @@ Tue, 30 May 2017 03:27:20 GMT
 
 ### Patches
 
-- DetailsList: initialFocusedIndex is considered on already mounted rows
+- DetailsList: initialFocusedIndex is considered on already mounted rows 
 - SelectionZone: Update behavior to fix using up/down arrows to navigate between groups in a GroupedList.
 - Introduce prop-types instead of React.PropTypes
 - List: improved measure logic and fix nested list scroll problem
@@ -1386,7 +1393,7 @@ Wed, 19 Apr 2017 03:17:40 GMT
 ### Patches
 
 - DatePicker: Improve screen-reader accessibility.
-- Regression Test: Contextual Menu
+- Regression Test: Contextual Menu 
 - fix nit for Suggestion.tsx
 
 ## 2.19.0
@@ -1550,7 +1557,7 @@ Wed, 29 Mar 2017 18:15:29 GMT
 
 - FocusZone: Adding support for default browser behavior when pressing alt + a key.
 - Chaning scss imports to use typescript `import` instead of `require` so that lib-amd build actually imports via AMD require and not commonjs require.
-- PeoplePicker: Adding changes for multiple selection onChange
+- PeoplePicker: Adding changes for multiple selection onChange 
 
 ## 2.10.1
 Wed, 29 Mar 2017 15:10:15 GMT
@@ -1663,7 +1670,7 @@ Thu, 16 Mar 2017 03:05:54 GMT
 ### Minor changes
 
 - DocumentCard: Add aria role and keyboard handling
-- Panel: Added sticky footer section and broke each panel region into seperate onRender fucntion.
+- Panel: Added sticky footer section and broke each panel region into seperate onRender fucntion. 
 
 ### Patches
 
@@ -1739,7 +1746,7 @@ Thu, 09 Mar 2017 06:11:07 GMT
 
 ### Breaking changes
 
-- IMPORTANT:
+- IMPORTANT: 
 
 This pull request converts ALL components over to use module css. What does this mean?
 
@@ -1757,7 +1764,7 @@ Problems that still exist:
 4. The bundles themselves have a lot of duplicate css. Because we generate rtl rules and theme tokens at build time rather than at runtime, we must download extra code, which bulks up the download size.
 5. Fabric core rules, which we implicitly rely on, are a hard thing to chase. If your page depends on core 6, and you're also using react components, you will find bugs. We'd like to eliminate this dependency so that it is reliable and contractual to use components. If you use a `ContextualMenu`, it should animate without depending on fabric-core css to be loaded.
 
-We are planning to address these and evaluating library options. Issue being tracked here: #983
+We are planning to address these and evaluating library options. Issue being tracked here: #983 
 
 
 ### Minor changes
@@ -2172,7 +2179,7 @@ Thu, 12 Jan 2017 04:06:30 GMT
 - DetailsList: when adding new items in a grouped DetailsList scenario, the group is no longer recreated.
 - Dialog: Removing deprecated rootProps usage for the close button.
 - Persona: Set an explicit height for the image area and image.
-- Persona now has a default way of generating initials and colors
+- Persona now has a default way of generating initials and colors 
 - Pivot: Fix a11y - duplicate tabIds, aria-controls linking
 - TextField: aria-describedby is only set when a description is available.
 
@@ -2437,7 +2444,7 @@ Mon, 05 Dec 2016 04:02:30 GMT
 
 ### Minor changes
 
-- Nav: adding support for `selectedKey`.
+- Nav: adding support for `selectedKey`. 
 
 ### Patches
 
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 92c15b32c45c9..8e059c0a77bad 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.0.0",
+  "version": "5.0.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -26,7 +26,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=5.0.0 <6.0.0",
+    "@uifabric/example-app-base": ">=5.0.1 <6.0.0",
     "enzyme": "^2.9.1",
     "es6-promise": "^4.1.0",
     "es6-map": "^0.1.5",
@@ -43,10 +43,10 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/icons": ">=5.0.0 <6.0.0",
+    "@uifabric/icons": ">=5.0.1 <6.0.0",
     "@uifabric/merge-styles": ">=5.0.0 <6.0.0",
-    "@uifabric/styling": ">=5.0.0 <6.0.0",
-    "@uifabric/utilities": ">=5.0.0 <6.0.0",
+    "@uifabric/styling": ">=5.0.1 <6.0.0",
+    "@uifabric/utilities": ">=5.0.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 7b04ae470e6e1..51d7b6f05a554 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.0.1",
+      "tag": "@uifabric/styling_v5.0.1",
+      "date": "Wed, 27 Sep 2017 00:20:58 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "8a8c240b39c3ba12effab2c6c8e7021c3bc9cea9",
+            "comment": "The 5.0 Fabric release. See the [the wiki](https://github.com/OfficeDev/office-ui-fabric-react/wiki/Fabric-5.0:-What's-new) for a full list of changes and how to work with the new bits."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.0.0 <6.0.0` to `>=5.0.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.24.2",
       "tag": "@uifabric/styling_v0.24.2",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 40e74c9338b23..021c1bae09790 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Tue, 26 Sep 2017 20:42:17 GMT and should not be manually modified.
+This log was last generated on Wed, 27 Sep 2017 00:20:58 GMT and should not be manually modified.
+
+## 5.0.1
+Wed, 27 Sep 2017 00:20:58 GMT
+
+### Patches
+
+- The 5.0 Fabric release. See the [the wiki](https://github.com/OfficeDev/office-ui-fabric-react/wiki/Fabric-5.0:-What's-new) for a full list of changes and how to work with the new bits.
 
 ## 0.24.2
 Tue, 26 Sep 2017 20:42:17 GMT
@@ -358,7 +365,7 @@ Wed, 21 Jun 2017 00:45:41 GMT
 
 ### Minor changes
 
-- Consume latest version of createApp
+- Consume latest version of createApp 
 
 ### Patches
 
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 97cad8f5343d3..1a115e836a55e 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.0.0",
+  "version": "5.0.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=5.0.0 <6.0.0",
+    "@uifabric/utilities": ">=5.0.1 <6.0.0",
     "@uifabric/merge-styles": ">=5.0.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 25ced4d3aeda4..917947db9cc65 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.0.1",
+      "tag": "@uifabric/utilities_v5.0.1",
+      "date": "Wed, 27 Sep 2017 00:20:58 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "8a8c240b39c3ba12effab2c6c8e7021c3bc9cea9",
+            "comment": "Updated for Fabric 5.0."
+          }
+        ]
+      }
+    },
     {
       "version": "4.16.0",
       "tag": "@uifabric/utilities_v4.16.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index f32afa02eacd8..b8bb85f0b05a8 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Tue, 26 Sep 2017 20:42:17 GMT and should not be manually modified.
+This log was last generated on Wed, 27 Sep 2017 00:20:58 GMT and should not be manually modified.
+
+## 5.0.1
+Wed, 27 Sep 2017 00:20:58 GMT
+
+### Patches
+
+- Updated for Fabric 5.0.
 
 ## 4.16.0
 Tue, 26 Sep 2017 20:42:17 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 55a14a0a7c476..6a9d1751e6748 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.0.0",
+  "version": "5.0.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 2ff5d7aa5a9724f74047908471244894500a4c05 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 26 Sep 2017 18:17:15 -0700
Subject: [PATCH 0730/1641] updating rush to publish merge-styles. (#2966)

---
 rush.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/rush.json b/rush.json
index d49b1d50725d6..f16cd7977b776 100644
--- a/rush.json
+++ b/rush.json
@@ -23,7 +23,7 @@
     {
       "packageName": "@uifabric/merge-styles",
       "projectFolder": "packages/merge-styles",
-      "shouldPublish": false
+      "shouldPublish": true
     },
     {
       "packageName": "@uifabric/utilities",

From edc17d6c0d626a21fb995e6cd15db97405449863 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Wed, 27 Sep 2017 09:10:07 -0700
Subject: [PATCH 0731/1641] Updated links (#2965)

---
 .../src/pages/ResourcesPage/ResourcesPage.tsx         |  7 ++++---
 .../resource-new-links_2017-09-26-22-12.json          | 11 +++++++++++
 2 files changed, 15 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/resource-new-links_2017-09-26-22-12.json

diff --git a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
index 4e36fe65274e5..bc07a8c9cff5a 100644
--- a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
+++ b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
@@ -81,9 +81,10 @@ export class ResourcesPage extends React.Component<any, any> {
                 <h3>SharePoint</h3>
                 <p>SharePoint uses Fabric, so if you&rsquo;re building on top of or within a SharePoint experience, you can be sure that your UI will blend in. Check out these resources to learn more.</p>
                 <ul>
-                  <li><a className={ styles.relatedLink } href='http://dev.office.com/sharepoint/docs/spfx/sharepoint-framework-overview'>SharePoint Framework overview</a></li>
-                  <li><a className={ styles.relatedLink } href='https://github.com/SharePoint/sp-dev-docs/wiki/Design-Great-Webparts'>Design guidance for web parts</a></li>                 <li><a className={ styles.relatedLink } href='http://dev.office.com/sharepoint/docs/spfx/web-parts/get-started/use-fabric-react-components'>How to use Fabric React in a web part</a></li>
-                  <li><a className={ styles.relatedLink } href='https://github.com/SharePoint/sp-dev-docs/wiki'>Get started with the SharePoint Framework and build a HelloWorld web part</a></li>
+                  <li><a className={ styles.relatedLink } href='https://aka.ms/spfx'>SharePoint Framework overview</a></li>
+                  <li><a className={ styles.relatedLink } href='https://aka.ms/spfx-design-guidance'>Design guidance for building SharePoint experiences</a></li>
+                  <li><a className={ styles.relatedLink } href='https://aka.ms/spfx-fabric-react'>Use Fabric React components in web parts</a></li>
+                  <li><a className={ styles.relatedLink } href='https://aka.ms/spfx-tutorials'>Get started with building client-side web parts</a></li>
                 </ul>
               </div>
             </div>
diff --git a/common/changes/@uifabric/fabric-website/resource-new-links_2017-09-26-22-12.json b/common/changes/@uifabric/fabric-website/resource-new-links_2017-09-26-22-12.json
new file mode 100644
index 0000000000000..9222b35f5ff82
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/resource-new-links_2017-09-26-22-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Updated links in the SharePoint section of the ResourcesPage.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From e94cdf5411740a106dc61f18731d2d29029ecedb Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 27 Sep 2017 09:57:23 -0700
Subject: [PATCH 0732/1641] updated tests to crop, easier to add new tests
 (#2956)

* updated tests to crop, easier to add new tests

* Updated tests, capturing only component area
---
 apps/vr-tests/.storybook/config.js            |   9 +-
 apps/vr-tests/package.json                    |   2 +-
 .../src/stories/Breadcrumb.stories.tsx        |  34 ++---
 apps/vr-tests/src/stories/Button.stories.tsx  | 133 ++++++++++--------
 apps/vr-tests/src/stories/index.tsx           |  17 ---
 .../src/utilities/FabricDecorator.tsx         |  22 +++
 apps/vr-tests/src/utilities/index.ts          |   1 +
 7 files changed, 122 insertions(+), 96 deletions(-)
 delete mode 100644 apps/vr-tests/src/stories/index.tsx
 create mode 100644 apps/vr-tests/src/utilities/FabricDecorator.tsx
 create mode 100644 apps/vr-tests/src/utilities/index.ts

diff --git a/apps/vr-tests/.storybook/config.js b/apps/vr-tests/.storybook/config.js
index 1dd9bf2f103d2..73f00e5d992c5 100644
--- a/apps/vr-tests/.storybook/config.js
+++ b/apps/vr-tests/.storybook/config.js
@@ -6,4 +6,11 @@ setOptions({
   name: 'Fabric'
 });
 
-storybook.configure(() => require('../src/stories/index'), module);
\ No newline at end of file
+const req = require.context('../src/stories', true, /\.stories\.tsx$/)
+
+function loadStories() {
+  req.keys().forEach((filename) => req(filename))
+}
+
+storybook.configure(loadStories, module);
+
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index b3c5e57a8e695..ce7c39ec908d6 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -23,7 +23,7 @@
     "style-loader": "=0.16.1",
     "awesome-typescript-loader": "^3.2.3",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
-    "screener-storybook": "^0.9.1",
+    "screener-storybook": "^0.9.2",
     "screener-runner": "^0.6.19",
     "storybook-readme": "=3.0.6"
   },
diff --git a/apps/vr-tests/src/stories/Breadcrumb.stories.tsx b/apps/vr-tests/src/stories/Breadcrumb.stories.tsx
index a25438367d499..aba6e12064277 100644
--- a/apps/vr-tests/src/stories/Breadcrumb.stories.tsx
+++ b/apps/vr-tests/src/stories/Breadcrumb.stories.tsx
@@ -2,32 +2,32 @@
 import * as React from 'react';
 import Screener, { Steps } from 'screener-storybook/src/screener';
 import { storiesOf } from '@storybook/react';
-import { FabricDecorator } from './index';
+import { FabricDecoratorTall } from '../utilities';
 import { Breadcrumb } from 'office-ui-fabric-react';
 
 storiesOf('Breadcrumb', module)
-  .addDecorator(FabricDecorator)
+  .addDecorator(FabricDecoratorTall)
   .addDecorator(story => (
     <Screener
-      steps={
-        new Screener.Steps()
-          .hover('.ms-Breadcrumb-overflowButton')
-          .snapshot('hover')
-          .click('.ms-Breadcrumb-overflowButton') // opening the dropdown
-          .hover('.ms-Breadcrumb-overflowButton') // moving the mouse a bit to let dropdown open.
-          .snapshot('click')
-          .click('.ms-Breadcrumb-overflowButton') // closing the dropdown
-          .hover('.ms-Breadcrumb-list li:nth-child(2)')
-          .snapshot('longTitleHover')
-          .hover('.ms-Breadcrumb-list li:nth-child(3)')
-          .snapshot('shortTitleHover')
-          .end()
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .hover('.ms-Breadcrumb-overflowButton')
+        .snapshot('hover', { cropTo: '.testWrapper' })
+        .click('.ms-Breadcrumb-overflowButton') // opening the dropdown
+        .hover('.ms-Breadcrumb-overflowButton') // moving the mouse a bit to let dropdown open.
+        .snapshot('click', { cropTo: '.testWrapper' })
+        .click('.ms-Breadcrumb-overflowButton') // closing the dropdown
+        .hover('.ms-Breadcrumb-list li:nth-child(2)')
+        .snapshot('longTitleHover', { cropTo: '.testWrapper' })
+        .hover('.ms-Breadcrumb-list li:nth-child(3)')
+        .snapshot('shortTitleHover', { cropTo: '.testWrapper' })
+        .end()
       }
     >
       { story() }
     </Screener>
   ))
-  .add('default', () => (
+  .add('Root', () => (
     <Breadcrumb
       items={ [
         { text: 'Files', 'key': 'Files', href: '#/examples/breadcrumb' },
@@ -40,4 +40,4 @@ storiesOf('Breadcrumb', module)
       maxDisplayedItems={ 3 }
       ariaLabel={ 'Website breadcrumb' }
     />
-  ))
\ No newline at end of file
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Button.stories.tsx b/apps/vr-tests/src/stories/Button.stories.tsx
index e820441f1bf45..def24fc5e0535 100644
--- a/apps/vr-tests/src/stories/Button.stories.tsx
+++ b/apps/vr-tests/src/stories/Button.stories.tsx
@@ -2,7 +2,7 @@
 import * as React from 'react';
 import Screener, { Steps } from 'screener-storybook/src/screener';
 import { storiesOf } from '@storybook/react';
-import { FabricDecorator } from './index';
+import { FabricDecorator, FabricDecoratorTall } from '../utilities';
 import { DefaultButton, ActionButton, CompoundButton, IButtonProps, CommandBarButton } from 'office-ui-fabric-react';
 
 const baseProps: IButtonProps = {
@@ -37,107 +37,120 @@ storiesOf('Button Default', module)
   .addDecorator(FabricDecorator)
   .addDecorator(story => (
     <Screener
-      steps={
-        new Steps()
-          .hover('.ms-Button')
-          .snapshot('hover')
-          .end()
+      steps={ new Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .hover('.ms-Button')
+        .snapshot('hover', { cropTo: '.testWrapper' })
+        .mouseDown('.ms-Button')
+        .snapshot('pressed', { cropTo: '.testWrapper' })
+        .end()
       }
     >
       { story() }
     </Screener>
   ))
-  .add('default', () => (<DefaultButton {...baseProps} />))
-  .add('default disabled', () => (<DefaultButton {...baseProps} disabled />))
-  .add('default checked', () => (<DefaultButton {...baseProps} checked />))
-  .add('primary', () => (<DefaultButton {...baseProps} primary />))
-  .add('primary disabled', () => (<DefaultButton {...baseProps} primary disabled />))
-  .add('primary checked', () => (<DefaultButton {...baseProps} primary checked />));
+  .add('Root', () => (<DefaultButton {...baseProps} />))
+  .add('Disabled', () => (<DefaultButton {...baseProps} disabled={ true } />))
+  .add('Checked', () => (<DefaultButton {...baseProps} checked={ true } />))
+  .add('Primary', () => (<DefaultButton {...baseProps} primary={ true } />))
+  .add('Primary Disabled', () => (<DefaultButton {...baseProps} primary={ true } disabled={ true } />))
+  .add('Primary Checked', () => (<DefaultButton {...baseProps} primary={ true } checked={ true } />));
 
 storiesOf('Button Action', module)
   .addDecorator(FabricDecorator)
   .addDecorator(story => (
     <Screener
-      steps={
-        new Steps()
-          .hover('.ms-Button')
-          .snapshot('hover')
-          .end()
+      steps={ new Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .hover('.ms-Button')
+        .snapshot('hover', { cropTo: '.testWrapper' })
+        .mouseDown('.ms-Button')
+        .snapshot('pressed', { cropTo: '.testWrapper' })
+        .end()
       }
     >
       { story() }
     </Screener>
   ))
-  .add('action', () => (<ActionButton {...baseProps} />))
-  .add('action disabled', () => (<ActionButton {...baseProps} disabled />))
-  .add('action checked', () => (<ActionButton {...baseProps} checked />));
+  .add('Root', () => (<ActionButton {...baseProps} />))
+  .add('Disabled', () => (<ActionButton {...baseProps} disabled={ true } />))
+  .add('Checked', () => (<ActionButton {...baseProps} checked={ true } />));
 
 storiesOf('Button Compound', module)
   .addDecorator(FabricDecorator)
   .addDecorator(story => (
     <Screener
-      steps={
-        new Steps()
-          .hover('.ms-Button')
-          .snapshot('hover')
-          .end()
+      steps={ new Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .hover('.ms-Button')
+        .snapshot('hover', { cropTo: '.testWrapper' })
+        .mouseDown('.ms-Button')
+        .snapshot('pressed', { cropTo: '.testWrapper' })
+        .end()
       }
     >
       { story() }
     </Screener>
   ))
-  .add('Compound', () => (<CompoundButton {...baseProps} />))
-  .add('Compound disabled', () => (<CompoundButton {...baseProps} disabled />))
-  .add('Compound checked', () => (<CompoundButton {...baseProps} checked />))
-  .add('Compound Primary', () => (<CompoundButton {...baseProps} primary />))
-  .add('Compound Primary disabled', () => (<CompoundButton {...baseProps} primary disabled />))
-  .add('Compound Primary checked', () => (<CompoundButton {...baseProps} primary checked />));
+  .add('Root', () => (<CompoundButton {...baseProps} />))
+  .add('Disabled', () => (<CompoundButton {...baseProps} disabled={ true } />))
+  .add('Checked', () => (<CompoundButton {...baseProps} checked={ true } />))
+  .add('Primary', () => (<CompoundButton {...baseProps} primary={ true } />))
+  .add('Primary Disabled', () => (<CompoundButton {...baseProps} primary={ true } disabled={ true } />))
+  .add('Primary Checked', () => (<CompoundButton {...baseProps} primary={ true } checked={ true } />));
 
 storiesOf('Button Command', module)
   // tslint:disable-next-line:jsx-ban-props
   .addDecorator(story => <div style={ { display: 'flex', alignItems: 'stretch', height: '40px' } }>{ story() }</div>)
-  .addDecorator(FabricDecorator)
+  .addDecorator(FabricDecoratorTall)
   .addDecorator(story => (
     <Screener
-      steps={
-        new Steps()
-          .hover('.ms-Button')
-          .snapshot('hover')
-          .click('.ms-Button')
-          .hover('.ms-Button')
-          .snapshot('open')
-          .end()
+      steps={ new Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .hover('.ms-Button')
+        .snapshot('hover', { cropTo: '.testWrapper' })
+        .mouseDown('.ms-Button')
+        .snapshot('pressed', { cropTo: '.testWrapper' })
+        .click('.ms-Button')
+        .hover('.ms-Button')
+        .snapshot('open', { cropTo: '.testWrapper' })
+        .end()
       }
     >
       { story() }
     </Screener>
   ))
-  .add('Command', () => (<CommandBarButton {...commandProps} />))
-  .add('Command disabled', () => (<CommandBarButton {...commandProps} disabled />))
-  .add('Command checked', () => (<CommandBarButton {...commandProps} checked />));
+  .add('Root', () => (<CommandBarButton {...commandProps} />))
+  .add('Disabled', () => (<CommandBarButton {...commandProps} disabled={ true } />))
+  .add('Checked', () => (<CommandBarButton {...commandProps} checked={ true } />));
 
 storiesOf('Button Split', module)
-  .addDecorator(FabricDecorator)
+  .addDecorator(FabricDecoratorTall)
   .addDecorator(story => (
     <Screener
-      steps={
-        new Steps()
-          .hover('.ms-Button:nth-child(1)')
-          .snapshot('hover main')
-          .hover('.ms-Button:nth-child(2)')
-          .snapshot('hover split')
-          .click('.ms-Button:nth-child(2)')
-          .hover('.ms-Button')
-          .snapshot('open')
-          .end()
+      steps={ new Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .hover('.ms-Button:nth-child(1)')
+        .snapshot('hover main', { cropTo: '.testWrapper' })
+        .hover('.ms-Button:nth-child(2)')
+        .snapshot('hover split', { cropTo: '.testWrapper' })
+        .mouseDown('.ms-Button:nth-child(1)')
+        .snapshot('pressed main', { cropTo: '.testWrapper' })
+        .hover('.ms-Button') // reset mouseDown
+        .mouseDown('.ms-Button:nth-child(2)')
+        .snapshot('pressed split', { cropTo: '.testWrapper' })
+        .click('.ms-Button:nth-child(2)')
+        .hover('.ms-Button') // move mouse to make click work
+        .snapshot('open', { cropTo: '.testWrapper' })
+        .end()
       }
     >
       { story() }
     </Screener>
   ))
-  .add('default', () => (<DefaultButton {...commandProps} split={ true } />))
-  .add('default disabled', () => (<DefaultButton {...commandProps} disabled split={ true } />))
-  .add('default checked', () => (<DefaultButton {...commandProps} checked split={ true } />))
-  .add('primary', () => (<DefaultButton {...commandProps} primary split={ true } />))
-  .add('primary disabled', () => (<DefaultButton {...commandProps} primary disabled split={ true } />))
-  .add('primary checked', () => (<DefaultButton {...commandProps} primary checked split={ true } />));
\ No newline at end of file
+  .add('Root', () => (<DefaultButton {...commandProps} split={ true } />))
+  .add('Disabled', () => (<DefaultButton {...commandProps} disabled={ true } split={ true } />))
+  .add('Checked', () => (<DefaultButton {...commandProps} checked={ true } split={ true } />))
+  .add('Primary', () => (<DefaultButton {...commandProps} primary={ true } split={ true } />))
+  .add('Primary Disabled', () => (<DefaultButton {...commandProps} primary={ true } disabled={ true } split={ true } />))
+  .add('Primary Checked', () => (<DefaultButton {...commandProps} primary={ true } checked={ true } split={ true } />));
diff --git a/apps/vr-tests/src/stories/index.tsx b/apps/vr-tests/src/stories/index.tsx
deleted file mode 100644
index 4f26f6957d8bd..0000000000000
--- a/apps/vr-tests/src/stories/index.tsx
+++ /dev/null
@@ -1,17 +0,0 @@
-/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
-import * as React from 'react';
-import { Fabric } from 'office-ui-fabric-react';
-
-// Wrap all stories in a Fabric component for proper styling
-export const FabricDecorator = (story) => (
-  <Fabric>
-    <p>
-      { story() }
-    </p>
-  </Fabric>
-);
-
-// Import component stories
-
-import './Button.stories';
-import './Breadcrumb.stories';
diff --git a/apps/vr-tests/src/utilities/FabricDecorator.tsx b/apps/vr-tests/src/utilities/FabricDecorator.tsx
new file mode 100644
index 0000000000000..7b863c63aca44
--- /dev/null
+++ b/apps/vr-tests/src/utilities/FabricDecorator.tsx
@@ -0,0 +1,22 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import { Fabric } from 'office-ui-fabric-react';
+
+// Wrap all stories in a Fabric component for proper styling
+
+// tslint:disable:jsx-ban-props
+export const FabricDecorator = (story) => (
+  <Fabric style={ { display: 'flex' } }>
+    <div className='testWrapper' style={ { padding: '10px' } }>
+      { story() }
+    </div>
+  </Fabric>
+);
+
+export const FabricDecoratorTall = (story) => (
+  <Fabric style={ { display: 'flex' } }>
+    <div className='testWrapper' style={ { padding: '10px 10px 120px' } }>
+      { story() }
+    </div>
+  </Fabric>
+);
diff --git a/apps/vr-tests/src/utilities/index.ts b/apps/vr-tests/src/utilities/index.ts
new file mode 100644
index 0000000000000..aaa70dcf4222b
--- /dev/null
+++ b/apps/vr-tests/src/utilities/index.ts
@@ -0,0 +1 @@
+export * from './FabricDecorator';
\ No newline at end of file

From 6c10c040e63c3f10adbb4fc4c77bfab9fce0c55e Mon Sep 17 00:00:00 2001
From: Eddie Liu <leddie24@gmail.com>
Date: Wed, 27 Sep 2017 14:16:49 -0700
Subject: [PATCH 0733/1641] List: Fix documentation examples - Set autobind to
 onRenderCell to fix context of 'this' (#2972)

* Set autobind to onRenderCell to fix context of 'this'

* Add change file
---
 .../v-edwliu-fix-list-example_2017-09-27-20-00.json   | 11 +++++++++++
 .../components/List/examples/List.Grid.Example.tsx    |  2 ++
 2 files changed, 13 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/v-edwliu-fix-list-example_2017-09-27-20-00.json

diff --git a/common/changes/office-ui-fabric-react/v-edwliu-fix-list-example_2017-09-27-20-00.json b/common/changes/office-ui-fabric-react/v-edwliu-fix-list-example_2017-09-27-20-00.json
new file mode 100644
index 0000000000000..4c5947d614b7c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-edwliu-fix-list-example_2017-09-27-20-00.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "List: Fix documentation examples. Adds autobind to onRenderCell of List Grid Example",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-edwliu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx b/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx
index d426594e3b57e..999b857d54a38 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx
@@ -3,6 +3,7 @@ import { FocusZone } from 'office-ui-fabric-react/lib/FocusZone';
 import { List } from 'office-ui-fabric-react/lib/List';
 import './List.Grid.Example.scss';
 import { IRectangle } from '../../../Utilities';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 
 export interface IListGridExampleProps {
   items: any[];
@@ -54,6 +55,7 @@ export class ListGridExample extends React.Component<IListGridExampleProps, any>
     return this._rowHeight * ROWS_PER_PAGE;
   }
 
+  @autobind
   private _onRenderCell(item: any, index: number | undefined): JSX.Element {
     return (
       <div

From c3d63f9d160dc6113c0e86f47decae5f147d29c8 Mon Sep 17 00:00:00 2001
From: MaxLustig <maxslustig@gmail.com>
Date: Wed, 27 Sep 2017 17:16:31 -0700
Subject: [PATCH 0734/1641] Add ability to add optional css class for checkbox
 cell (#2951)

* Added property to IDetailsListProps to support vertically centering cells

* Fixed vertical centering issue with checkbox

* Added change file

* Removed verticallyCenterCells

* Added ability to add css class to checkbox cell

* Fixed issue with DetailsRowProps declaration

* Changed change file

* Changed name to checkboxCellClassName

* Update maxlus-verticallyCenterCells_2017-09-26-21-11.json
---
 ...maxlus-verticallyCenterCells_2017-09-26-21-11.json | 11 +++++++++++
 .../src/components/DetailsList/DetailsList.Props.ts   |  7 ++++++-
 .../src/components/DetailsList/DetailsList.tsx        |  4 +++-
 .../src/components/DetailsList/DetailsRow.scss        |  3 ++-
 .../src/components/DetailsList/DetailsRow.tsx         |  4 +++-
 .../src/components/DetailsList/DetailsRowCheck.scss   |  2 +-
 6 files changed, 26 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/maxlus-verticallyCenterCells_2017-09-26-21-11.json

diff --git a/common/changes/office-ui-fabric-react/maxlus-verticallyCenterCells_2017-09-26-21-11.json b/common/changes/office-ui-fabric-react/maxlus-verticallyCenterCells_2017-09-26-21-11.json
new file mode 100644
index 0000000000000..c93035933bb1c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/maxlus-verticallyCenterCells_2017-09-26-21-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: Added ability to add css class to checkbox cell",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "maxlus@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
index 0a9c4f6e697cf..cc4e0eb489ba6 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
@@ -200,6 +200,11 @@ export interface IDetailsListProps extends React.Props<DetailsList>, IWithViewpo
    * The default implementation will virtualize when this callback is not provided.
    */
   onShouldVirtualize?: (props: IListProps) => boolean;
+
+  /**
+   * Optional class name to add to the cell of a checkbox
+   */
+  checkboxCellClassName?: string;
 }
 
 export interface IColumn {
@@ -399,4 +404,4 @@ export enum CheckboxVisibility {
    * Hide checkboxes.
    */
   hidden = 2
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index a2b967a09f0e9..10df3fef736f3 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -396,6 +396,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       checkboxVisibility,
       getRowAriaLabel,
       checkButtonAriaLabel,
+      checkboxCellClassName,
       groupProps
     } = this.props;
     let collapseAllVisibility = groupProps && groupProps.collapseAllVisibility;
@@ -431,7 +432,8 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       checkboxVisibility: checkboxVisibility,
       collapseAllVisibility: collapseAllVisibility,
       getRowAriaLabel: getRowAriaLabel,
-      checkButtonAriaLabel: checkButtonAriaLabel
+      checkButtonAriaLabel: checkButtonAriaLabel,
+      checkboxCellClassName: checkboxCellClassName,
     }, this._onRenderRow);
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
index 22f44bd1d8b8b..9c4f0798e23f3 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
@@ -207,6 +207,7 @@ $detailsList-item-focus-meta-text-color: $ms-color-neutralDark;
   }
 }
 
+
 .isPadded {
   @include ms-padding-right($isPaddedMargin + $rowHorizontalPadding);
 
@@ -230,4 +231,4 @@ $detailsList-item-focus-meta-text-color: $ms-color-neutralDark;
 .cellMeasurer .cell {
   overflow: visible;
   white-space: nowrap;
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index 0d4f65053c959..e863f240ffcee 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -49,6 +49,7 @@ export interface IDetailsRowProps extends React.Props<DetailsRow> {
   collapseAllVisibility?: CollapseAllVisibility;
   getRowAriaLabel?: (item: any) => string;
   checkButtonAriaLabel?: string;
+  checkboxCellClassName?: string;
 }
 
 export interface IDetailsRowSelectionState {
@@ -184,6 +185,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
       checkboxVisibility,
       getRowAriaLabel,
       checkButtonAriaLabel,
+      checkboxCellClassName,
       selection
     } = this.props;
     const { columnMeasureInfo, isDropping, groupNestingDepth } = this.state;
@@ -230,7 +232,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
             role='gridcell'
             aria-colindex={ 0 }
             data-selection-toggle={ true }
-            className={ css('ms-DetailsRow-cell', 'ms-DetailsRow-cellCheck', checkStyles.owner, styles.cell, styles.checkCell) }
+            className={ css('ms-DetailsRow-cell', 'ms-DetailsRow-cellCheck', checkStyles.owner, styles.cell, styles.checkCell, checkboxCellClassName) }
           >
             { onRenderCheck({
               isSelected,
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
index e19f3fe646dd4..a00a3769eddf7 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
@@ -18,7 +18,7 @@
 }
 
 button.check {
-  height: 100%;
+  height: 40px;
   width: 40px;
   padding: 0;
   margin: 0;

From 182c0c040b685e2458acdc128d3c2fa2f1141c70 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 28 Sep 2017 10:19:13 +0000
Subject: [PATCH 0735/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 19 ++++++++++++++
 apps/fabric-website/CHANGELOG.md              |  9 ++++++-
 apps/fabric-website/package.json              |  4 +--
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../resource-new-links_2017-09-26-22-12.json  | 11 --------
 ...erticallyCenterCells_2017-09-26-21-11.json | 11 --------
 ...liu-fix-list-example_2017-09-27-20-00.json | 11 --------
 packages/example-app-base/CHANGELOG.json      |  6 +++++
 packages/example-app-base/CHANGELOG.md        |  7 ++++-
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/package.json             |  4 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 26 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 13 +++++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 16 files changed, 87 insertions(+), 46 deletions(-)
 delete mode 100644 common/changes/@uifabric/fabric-website/resource-new-links_2017-09-26-22-12.json
 delete mode 100644 common/changes/office-ui-fabric-react/maxlus-verticallyCenterCells_2017-09-26-21-11.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-edwliu-fix-list-example_2017-09-27-20-00.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 841478017ed9f..2506c7b9f57e4 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.0.5",
+      "tag": "@uifabric/fabric-website_v5.0.5",
+      "date": "Thu, 28 Sep 2017 10:19:12 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "edc17d6c0d626a21fb995e6cd15db97405449863",
+            "comment": "Updated links in the SharePoint section of the ResourcesPage."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.0.1 <6.0.0` to `>=5.1.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.4",
       "tag": "@uifabric/fabric-website_v5.0.4",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 608cb42d06252..c0b6bd2ad35b9 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Wed, 27 Sep 2017 00:20:58 GMT and should not be manually modified.
+This log was last generated on Thu, 28 Sep 2017 10:19:12 GMT and should not be manually modified.
+
+## 5.0.5
+Thu, 28 Sep 2017 10:19:12 GMT
+
+### Patches
+
+- Updated links in the SharePoint section of the ResourcesPage.
 
 ## 5.0.4
 Wed, 27 Sep 2017 00:20:58 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 1c57d8f671325..22abe341914ce 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.0.4",
+  "version": "5.0.5",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,7 +47,7 @@
     "@uifabric/icons": ">=5.0.1 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.0.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 0e2e624551d9a..da18d8d0ab71b 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -26,7 +26,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.0.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 5fefda809c1ed..8acda40091ff7 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -24,7 +24,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.0.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index ce7c39ec908d6..5fae3c87936c4 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.0.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/fabric-website/resource-new-links_2017-09-26-22-12.json b/common/changes/@uifabric/fabric-website/resource-new-links_2017-09-26-22-12.json
deleted file mode 100644
index 9222b35f5ff82..0000000000000
--- a/common/changes/@uifabric/fabric-website/resource-new-links_2017-09-26-22-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Updated links in the SharePoint section of the ResourcesPage.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/maxlus-verticallyCenterCells_2017-09-26-21-11.json b/common/changes/office-ui-fabric-react/maxlus-verticallyCenterCells_2017-09-26-21-11.json
deleted file mode 100644
index c93035933bb1c..0000000000000
--- a/common/changes/office-ui-fabric-react/maxlus-verticallyCenterCells_2017-09-26-21-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: Added ability to add css class to checkbox cell",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "maxlus@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/v-edwliu-fix-list-example_2017-09-27-20-00.json b/common/changes/office-ui-fabric-react/v-edwliu-fix-list-example_2017-09-27-20-00.json
deleted file mode 100644
index 4c5947d614b7c..0000000000000
--- a/common/changes/office-ui-fabric-react/v-edwliu-fix-list-example_2017-09-27-20-00.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "List: Fix documentation examples. Adds autobind to onRenderCell of List Grid Example",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-edwliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 6145162482fd1..9e2cd96dea997 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "5.0.2",
+      "tag": "@uifabric/example-app-base_v5.0.2",
+      "date": "Thu, 28 Sep 2017 10:19:12 GMT",
+      "comments": {}
+    },
     {
       "version": "5.0.1",
       "tag": "@uifabric/example-app-base_v5.0.1",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index 887bc84e5b9d6..5c42b14684d5d 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Wed, 27 Sep 2017 00:20:58 GMT and should not be manually modified.
+This log was last generated on Thu, 28 Sep 2017 10:19:12 GMT and should not be manually modified.
+
+## 5.0.2
+Thu, 28 Sep 2017 10:19:12 GMT
+
+*Changes not tracked*
 
 ## 5.0.1
 Wed, 27 Sep 2017 00:20:58 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index ed1d2a04b7e4d..3f8bce58384cd 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "5.0.1",
+  "version": "5.0.2",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 7b5236cc1662b..e97011a30a053 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -27,7 +27,7 @@
     "@types/jest": "^21.1.0",
     "@types/enzyme": "^2.8.8",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=5.0.1 <6.0.0",
+    "@uifabric/example-app-base": ">=5.0.2 <6.0.0",
     "@uifabric/icons": ">=5.0.1 <6.0.0",
     "es6-weak-map": "^2.0.2",
     "enzyme": "^2.9.1",
@@ -41,7 +41,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.0.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "@uifabric/icons": ">=5.0.1 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 4de6676b0ed1b..7c10921b1bc0a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.1.0",
+      "tag": "office-ui-fabric-react_v5.1.0",
+      "date": "Thu, 28 Sep 2017 10:19:12 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "MaxLustig <maxslustig@gmail.com>",
+            "commit": "c3d63f9d160dc6113c0e86f47decae5f147d29c8",
+            "comment": "DetailsList: Added ability to add css class to checkbox cell"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Eddie Liu <leddie24@gmail.com>",
+            "commit": "6c10c040e63c3f10adbb4fc4c77bfab9fce0c55e",
+            "comment": "List: Fix documentation examples. Adds autobind to onRenderCell of List Grid Example"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=5.0.1 <6.0.0` to `>=5.0.2 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.1",
       "tag": "office-ui-fabric-react_v5.0.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 5b5f939c2f439..aaf50763aa8c8 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 27 Sep 2017 00:20:59 GMT and should not be manually modified.
+This log was last generated on Thu, 28 Sep 2017 10:19:12 GMT and should not be manually modified.
+
+## 5.1.0
+Thu, 28 Sep 2017 10:19:12 GMT
+
+### Minor changes
+
+- DetailsList: Added ability to add css class to checkbox cell
+
+### Patches
+
+- List: Fix documentation examples. Adds autobind to onRenderCell of List Grid Example
 
 ## 5.0.1
 Wed, 27 Sep 2017 00:20:58 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 8e059c0a77bad..d5c875f44e916 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.0.1",
+  "version": "5.1.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -26,7 +26,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=5.0.1 <6.0.0",
+    "@uifabric/example-app-base": ">=5.0.2 <6.0.0",
     "enzyme": "^2.9.1",
     "es6-promise": "^4.1.0",
     "es6-map": "^0.1.5",

From 47af278daa76bc638871139ce6b0294edb8c9edb Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Thu, 28 Sep 2017 06:33:01 -0700
Subject: [PATCH 0736/1641] Added itializeIcons call to website per new 5.0
 documentation (#2969)

* Added itializeIcons call per new 5.0 documentation

* Added change file
---
 apps/fabric-website/src/root.tsx                      |  4 ++++
 .../initializeIcons-website_2017-09-27-15-20.json     | 11 +++++++++++
 2 files changed, 15 insertions(+)
 create mode 100644 common/changes/@uifabric/fabric-website/initializeIcons-website_2017-09-27-15-20.json

diff --git a/apps/fabric-website/src/root.tsx b/apps/fabric-website/src/root.tsx
index ffe22dbece947..867c06a9e6d91 100644
--- a/apps/fabric-website/src/root.tsx
+++ b/apps/fabric-website/src/root.tsx
@@ -11,6 +11,10 @@ import { HomePage } from './pages/HomePage/HomePage';
 import WindowWidthUtility from './utilities/WindowWidthUtility';
 import './styles/styles.scss';
 
+import { initializeIcons } from '@uifabric/icons/lib/index';
+
+initializeIcons('./dist/');
+
 let isProduction = process.argv.indexOf('--production') > -1;
 
 if (!isProduction) {
diff --git a/common/changes/@uifabric/fabric-website/initializeIcons-website_2017-09-27-15-20.json b/common/changes/@uifabric/fabric-website/initializeIcons-website_2017-09-27-15-20.json
new file mode 100644
index 0000000000000..5db10815f4877
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/initializeIcons-website_2017-09-27-15-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Added initializeIcons() call to make all icons in examples on the website available.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From 72619db986d90c47a32b46d3419030b2c1f49e1a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pablo=20N=C3=BA=C3=B1ez?= <pablonete@gmail.com>
Date: Thu, 28 Sep 2017 17:38:08 +0200
Subject: [PATCH 0737/1641] DetailsList: resize justified columns past maxWidth
 (#2978)

* Allow column resize outside maxWidth

* Describe changes to DetailsList

* Restore minWidth limit behavior, so this PR fixes only my maxWidth bug.
---
 ...JustifiedColumnsPastMaxWidth_2017-09-21-18-10.json | 11 +++++++++++
 .../src/components/DetailsList/DetailsList.tsx        |  4 ----
 2 files changed, 11 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/detailsList-resizeJustifiedColumnsPastMaxWidth_2017-09-21-18-10.json

diff --git a/common/changes/office-ui-fabric-react/detailsList-resizeJustifiedColumnsPastMaxWidth_2017-09-21-18-10.json b/common/changes/office-ui-fabric-react/detailsList-resizeJustifiedColumnsPastMaxWidth_2017-09-21-18-10.json
new file mode 100644
index 0000000000000..e1223864d24a8
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/detailsList-resizeJustifiedColumnsPastMaxWidth_2017-09-21-18-10.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: Allow resizing columns wider than maxWidth in justified layout",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jaspadie@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 10df3fef736f3..0fea6a7323ded 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -617,10 +617,6 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
         },
         this._columnOverrides[column.key]);
 
-      if (newColumn.maxWidth && newColumn.calculatedWidth > newColumn.maxWidth) {
-        newColumn.calculatedWidth = newColumn.maxWidth;
-      }
-
       totalWidth += newColumn.calculatedWidth + (i > 0 ? DEFAULT_INNER_PADDING : 0) + (column.isPadded ? ISPADDED_WIDTH : 0);
 
       return newColumn;

From a08c9f55633b7be08358988845dd769257c1aca1 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Thu, 28 Sep 2017 10:29:50 -0700
Subject: [PATCH 0738/1641] Split out and cleaned up TextField variants to
 better reflect the toolkit (#2964)

* JSX alignment

* Split out and cleaned up TextField variants to better reflect the toolkit

* Refined error message and required representation to match toolkit

* Added change file

* Removed leftover merge conflict tags
---
 .../textField-toolkit_2017-09-26-21-45.json   | 11 ++++
 .../components/ComboBox/ComboBox.styles.ts    |  9 +---
 .../src/components/Label/LabelMixins.scss     |  8 +++
 .../src/components/TextField/TextField.scss   | 25 +++++++---
 .../src/components/TextField/TextField.tsx    |  8 +--
 .../components/TextField/TextFieldPage.tsx    | 50 ++++++++++++++++++-
 .../examples/TextField.Basic.Example.tsx      | 35 ++++++-------
 .../examples/TextField.Borderless.Example.tsx | 23 +++++++++
 .../TextField.ImplementationExamples.tsx      | 26 ++++++++++
 .../examples/TextField.Multiline.Example.tsx  | 44 ++++++++++++++++
 .../TextField.Placeholder.Example.tsx         | 27 ++++++++++
 .../examples/TextField.Underlined.Example.tsx | 30 +++++++++++
 12 files changed, 255 insertions(+), 41 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/textField-toolkit_2017-09-26-21-45.json
 create mode 100644 packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Borderless.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ImplementationExamples.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Multiline.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Placeholder.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Underlined.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/textField-toolkit_2017-09-26-21-45.json b/common/changes/office-ui-fabric-react/textField-toolkit_2017-09-26-21-45.json
new file mode 100644
index 0000000000000..1fa793a7b0b85
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/textField-toolkit_2017-09-26-21-45.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Split out and cleaned up TextField examples to better reflect the toolkit. ",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index 8ba2ae51cb6aa..b1a7d29486767 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -274,12 +274,7 @@ export const getStyles = memoizeFunction((
 
     inputDisabled: getDisabledStyles(theme),
     errorMessage: {
-      color: ComboBoxRootColorErrored,
-      selectors: {
-        ':before': {
-          content: '* ',
-        }
-      }
+      color: ComboBoxRootColorErrored
     },
 
     callout: {
@@ -318,4 +313,4 @@ export const getStyles = memoizeFunction((
   };
 
   return mergeStyleSets(styles, customStyles) as IComboBoxStyles;
-});
\ No newline at end of file
+});
diff --git a/packages/office-ui-fabric-react/src/components/Label/LabelMixins.scss b/packages/office-ui-fabric-react/src/components/Label/LabelMixins.scss
index 7e413b0165dc0..c816afbe2226e 100644
--- a/packages/office-ui-fabric-react/src/components/Label/LabelMixins.scss
+++ b/packages/office-ui-fabric-react/src/components/Label/LabelMixins.scss
@@ -8,3 +8,11 @@
     color: $ms-color-error;
   }
 }
+
+@mixin ms-TextField-fieldGroup-is-required {
+  &::after {
+    content: ' *';
+    color: $ms-color-error;
+    @include ms-padding-right(12px);
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index 1618522b469c6..a3a5602d5a36f 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -129,9 +129,15 @@ $field-error-color: $errorTextColor;
 }
 
 //= State: A required textfield
-.root.rootIsRequired {
+.root.rootIsRequiredLabel {
   :global(.ms-Label) {
-    @include ms-Label-is-required
+    @include ms-Label-is-required;
+  }
+}
+
+.root.rootIsRequiredPlaceholderOnly {
+  :global(.ms-TextField-fieldGroup) {
+    @include ms-TextField-fieldGroup-is-required;
   }
 }
 
@@ -140,11 +146,6 @@ $field-error-color: $errorTextColor;
   border-color: $field-border-focus-color;
 }
 
-.errorIcon {
-  font-size: $ms-font-size-m;
-  @include margin-right(5px);
-}
-
 .icon {
   pointer-events: none;
   position: absolute;
@@ -179,6 +180,12 @@ $field-error-color: $errorTextColor;
     display: flex;
     border-bottom: 1px solid $field-border-color;
     width: 100%;
+
+    &.invalid,
+    &.invalid:focus,
+    &.invalid:hover {
+      border-bottom: 1px solid $field-border-error-color;
+    }
   }
 
   :global(.ms-Label) {
@@ -207,6 +214,10 @@ $field-error-color: $errorTextColor;
       background-color: transparent;
       color: $field-text-disabled-color;
     }
+
+    .fieldGroup {
+      background-color: transparent;
+    }
   }
 
   &.rootIsActive {
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index 4700178607bbc..42df4d0179838 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -144,7 +144,8 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
     this._isDescriptionAvailable = Boolean(description || errorMessage);
 
     const textFieldClassName = css('ms-TextField', styles.root, className, {
-      ['is-required ' + styles.rootIsRequired]: required,
+      ['is-required ' + styles.rootIsRequiredLabel]: this.props.label && required,
+      ['is-required ' + styles.rootIsRequiredPlaceholderOnly]: !this.props.label && required,
       ['is-disabled ' + styles.rootIsDisabled]: disabled,
       ['is-active ' + styles.rootIsActive]: isFocused,
       ['ms-TextField--multiline ' + styles.rootIsMultiline]: multiline,
@@ -154,7 +155,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
 
     return (
       <div className={ textFieldClassName }>
-        <div className={ css('ms-TextField-wrapper', styles.wrapper) }>
+        <div className={ css('ms-TextField-wrapper', styles.wrapper, underlined ? errorMessage && styles.invalid : '') }>
           { label && <Label htmlFor={ this._id }>{ label }</Label> }
           <div className={ css('ms-TextField-fieldGroup', styles.fieldGroup, isFocused && styles.fieldGroupIsFocused, errorMessage && styles.invalid) }>
             { (addonString !== undefined || this.props.onRenderAddon) && (
@@ -175,7 +176,6 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
                   <p
                     className={ css('ms-TextField-errorMessage', AnimationClassNames.slideDownIn20, styles.errorMessage) }
                   >
-                    { Icon({ iconName: 'Error', className: styles.errorIcon }) }
                     <span aria-live='assertive' className={ styles.errorText } data-automation-id='error-message'>{ errorMessage }</span>
                   </p>
                 </DelayedRender>
@@ -421,4 +421,4 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
       textField.style.height = scrollHeight + 'px';
     }
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
index 2945e47a66ff4..047c0928c0ba0 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
@@ -6,12 +6,22 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { TextFieldBasicExample } from './examples/TextField.Basic.Example';
+import { TextFieldPlaceholderExample } from './examples/TextField.Placeholder.Example';
+import { TextFieldMultilineExample } from './examples/TextField.Multiline.Example';
+import { TextFieldUnderlinedExample } from './examples/TextField.Underlined.Example';
+import { TextFieldBorderlessExample } from './examples/TextField.Borderless.Example';
 import { TextFieldErrorMessageExample } from './examples/TextField.ErrorMessage.Example';
+import { TextFieldImplementationExamples } from './examples/TextField.ImplementationExamples';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { TextFieldStatus } from './TextField.checklist';
 
 const TextFieldBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx') as string;
+const TextFieldPlaceholderExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Placeholder.Example.tsx') as string;
+const TextFieldMultilineExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Multiline.Example.tsx') as string;
+const TextFieldUnderlinedExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Underlined.Example.tsx') as string;
+const TextFieldBorderlessExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Borderless.Example.tsx') as string;
 const TextFieldErrorMessageExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx') as string;
+const TextFieldImplementationExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.ImplementationExamples.tsx') as string;
 
 export class TextFieldPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
@@ -21,12 +31,48 @@ export class TextFieldPage extends React.Component<IComponentDemoPageProps, {}>
         componentName='TextFieldExample'
         exampleCards={
           <div>
-            <ExampleCard title='TextField variations' code={ TextFieldBasicExampleCode }>
+            <ExampleCard
+              title='Default TextField with Label'
+              code={ TextFieldBasicExampleCode }
+            >
               <TextFieldBasicExample />
             </ExampleCard>
-            <ExampleCard title='TextField error message variations' code={ TextFieldErrorMessageExampleCode }>
+            <ExampleCard
+              title='TextField with Placeholder'
+              code={ TextFieldPlaceholderExampleCode }
+            >
+              <TextFieldPlaceholderExample />
+            </ExampleCard>
+            <ExampleCard
+              title='Multiline TextField'
+              code={ TextFieldMultilineExampleCode }
+            >
+              <TextFieldMultilineExample />
+            </ExampleCard>
+            <ExampleCard
+              title='Underlined TextField'
+              code={ TextFieldUnderlinedExampleCode }
+            >
+              <TextFieldUnderlinedExample />
+            </ExampleCard>
+            <ExampleCard
+              title='Borderless TextField'
+              code={ TextFieldBorderlessExampleCode }
+            >
+              <TextFieldBorderlessExample />
+            </ExampleCard>
+            <ExampleCard
+              title='TextField error message variations'
+              code={ TextFieldErrorMessageExampleCode }
+            >
               <TextFieldErrorMessageExample />
             </ExampleCard>
+            <ExampleCard
+              title='Implementation Examples'
+              code={ TextFieldImplementationExampleCode }
+            >
+              <TextFieldImplementationExamples />
+            </ExampleCard>
           </div>
         }
         propertiesTables={
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
index d3bb020884993..5f159ad406c34 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
@@ -1,33 +1,26 @@
 import * as React from 'react';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 
 export class TextFieldBasicExample extends React.Component<any, any> {
   public render() {
     return (
       <div>
         <TextField
-          label='Default TextField'
-          onChanged={ this._onChanged }
+          label='Standard'
+        />
+        <TextField
+          label='Disabled'
+          disabled={ true }
+        />
+        <TextField
+          label='Required '
+          required={ true }
+        />
+        <TextField
+          label='With error message'
+          errorMessage='Error message'
         />
-        <TextField label='Disabled TextField' disabled={ true } placeholder='Placeholder text' />
-        <TextField label='Required TextField' required={ true } />
-        <TextField label='TextField with a placeholder' placeholder='Now I am a Placeholder' ariaLabel='Please enter text here' />
-        <TextField label='TextField with an icon' iconProps={ { iconName: 'Calendar' } } />
-        <TextField label='Textfield with an addon' addonString='https://' />
-        <TextField label='Multiline TextField' multiline rows={ 4 } iconProps={ { iconName: 'Calendar' } } />
-        <TextField label='Multiline TextField Unresizable' multiline resizable={ false } />
-        <TextField label='Multiline TextField with auto adjust height' multiline autoAdjustHeight />
-        <TextField label='Underlined TextField' underlined />
-        <TextField label='Underlined TextField Disabled' underlined disabled={ true } />
-        <TextField label='Borderless TextField' borderless placeholder='No borders here, folks.' />
-        <TextField label='Multiline Borderless TextField' multiline rows={ 4 } borderless placeholder='Example TextField without a border' />
       </div>
     );
   }
-
-  @autobind
-  private _onChanged(text: string) {
-    console.log(text);
-  }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Borderless.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Borderless.Example.tsx
new file mode 100644
index 0000000000000..f59c2d1e47836
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Borderless.Example.tsx
@@ -0,0 +1,23 @@
+import * as React from 'react';
+import { TextField } from 'office-ui-fabric-react/lib/TextField';
+
+export class TextFieldBorderlessExample extends React.Component<any, any> {
+  public render() {
+    return (
+      <div>
+        <TextField
+          label='Borderless Standard TextField'
+          borderless
+          placeholder='No borders here, folks.'
+        />
+        <TextField
+          label='Borderless Multiline TextField'
+          multiline
+          rows={ 4 }
+          borderless
+          placeholder='No borders here, folks.'
+        />
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ImplementationExamples.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ImplementationExamples.tsx
new file mode 100644
index 0000000000000..c9024cb9d5048
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ImplementationExamples.tsx
@@ -0,0 +1,26 @@
+import * as React from 'react';
+import { TextField } from 'office-ui-fabric-react/lib/TextField';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+
+export class TextFieldImplementationExamples extends React.Component<any, any> {
+  public render() {
+    return (
+      <div>
+        <TextField
+          label='TextField with an icon'
+          iconProps={ { iconName: 'Calendar' } }
+          onChanged={ this._onChanged }
+        />
+        <TextField
+          label='Textfield with an addon'
+          addonString='https://'
+        />
+      </div>
+    );
+  }
+
+  @autobind
+  private _onChanged(text: string) {
+    console.log(text);
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Multiline.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Multiline.Example.tsx
new file mode 100644
index 0000000000000..b7293aa16b178
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Multiline.Example.tsx
@@ -0,0 +1,44 @@
+import * as React from 'react';
+import { TextField } from 'office-ui-fabric-react/lib/TextField';
+
+export class TextFieldMultilineExample extends React.Component<any, any> {
+  public render() {
+    return (
+      <div>
+        <TextField
+          label='Standard'
+          multiline
+          rows={ 4 }
+        />
+        <TextField
+          label='Disabled'
+          multiline
+          rows={ 4 }
+          disabled={ true }
+        />
+        <TextField
+          label='Required'
+          multiline
+          rows={ 4 }
+          required={ true }
+        />
+        <TextField
+          label='With error message'
+          multiline
+          rows={ 4 }
+          errorMessage='This is an error message.'
+        />
+        <TextField
+          label='Non-resizable'
+          multiline
+          resizable={ false }
+        />
+        <TextField
+          label='With auto adjusting height'
+          multiline
+          autoAdjustHeight
+        />
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Placeholder.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Placeholder.Example.tsx
new file mode 100644
index 0000000000000..98d2c0aba2f5e
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Placeholder.Example.tsx
@@ -0,0 +1,27 @@
+import * as React from 'react';
+import { TextField } from 'office-ui-fabric-react/lib/TextField';
+
+export class TextFieldPlaceholderExample extends React.Component<any, any> {
+  public render() {
+    return (
+      <div>
+        <TextField
+          placeholder='I am a placeholder.'
+          ariaLabel='Please enter text here'
+        />
+        <TextField
+          disabled={ true }
+          placeholder='I am disabled. '
+        />
+        <TextField
+          required={ true }
+          placeholder='I am required.'
+        />
+        <TextField
+          errorMessage='Error message'
+          placeholder='I have an error message.'
+        />
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Underlined.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Underlined.Example.tsx
new file mode 100644
index 0000000000000..d317bb2aaa791
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Underlined.Example.tsx
@@ -0,0 +1,30 @@
+import * as React from 'react';
+import { TextField } from 'office-ui-fabric-react/lib/TextField';
+
+export class TextFieldUnderlinedExample extends React.Component<any, any> {
+  public render() {
+    return (
+      <div>
+        <TextField
+          label='Standard:'
+          underlined
+        />
+        <TextField
+          label='Disabled:'
+          underlined
+          disabled={ true }
+        />
+        <TextField
+          label='Required:'
+          underlined
+          required={ true }
+        />
+        <TextField
+          label='With error message:'
+          underlined
+          errorMessage='Error message'
+        />
+      </div>
+    );
+  }
+}
\ No newline at end of file

From 97c324bbb723e464664bee2a7e941e5e040f4253 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 28 Sep 2017 12:50:34 -0500
Subject: [PATCH 0739/1641] ContextualMenu: Support checkable items within
 MenuSections (#2976)

* Support the can check property for controls in menu sections

* Rush change

* Get rid of the for loop
---
 ...menu-section-checked_2017-09-28-01-23.json | 11 +++++
 .../ContextualMenu/ContextualMenu.test.tsx    | 49 ++++++++++++++++++-
 .../ContextualMenu/ContextualMenu.tsx         | 20 +++++++-
 3 files changed, 78 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/menu-section-checked_2017-09-28-01-23.json

diff --git a/common/changes/office-ui-fabric-react/menu-section-checked_2017-09-28-01-23.json b/common/changes/office-ui-fabric-react/menu-section-checked_2017-09-28-01-23.json
new file mode 100644
index 0000000000000..c7d4bd646098b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/menu-section-checked_2017-09-28-01-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: Make sure to check items within a menu section for the 'canCheck' property",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
index ca31fbac8277d..02e1864d97c9f 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
@@ -10,7 +10,7 @@ import { FocusZoneDirection } from '../../FocusZone';
 
 let { expect } = chai;
 
-import { ContextualMenu } from './ContextualMenu';
+import { ContextualMenu, canAnyMenuItemsCheck } from './ContextualMenu';
 import { IContextualMenuItem, ContextualMenuItemType } from './ContextualMenu.Props';
 import { Layer } from '../Layer/Layer';
 
@@ -424,4 +424,51 @@ describe('ContextualMenu', () => {
     expect(layerMountedFirst).to.be.equal(true, 'Menu Mounted First');
     expect(menuMountedFirst).to.be.equal(false, 'Layer Mounted first');
   });
+
+  describe('canAnyMenuItemsCheck', () => {
+    it('returns false when there are no checkable menu items', () => {
+      const items: IContextualMenuItem[] = [
+        { name: 'Item 1', key: 'Item 1' },
+        { name: 'Item 2', key: 'Item 2' },
+        { name: 'Item 3', key: 'Item 3' }
+      ];
+
+      expect(canAnyMenuItemsCheck(items)).to.equal(false);
+    });
+
+    it('returns true when there is at least one checkable menu item', () => {
+      const items: IContextualMenuItem[] = [
+        { name: 'Item 1', key: 'Item 1' },
+        { name: 'Item 2', key: 'Item 2', canCheck: true },
+        { name: 'Item 3', key: 'Item 3' }
+      ];
+
+      expect(canAnyMenuItemsCheck(items)).to.equal(true);
+    });
+
+    it('returns true when there is a menu section with an item that can check', () => {
+      const items: IContextualMenuItem[] = [
+        {
+          name: 'Item 1',
+          key: 'Item 1'
+        },
+        {
+          name: 'Item 2',
+          key: 'Item 2'
+        },
+        {
+          name: 'Item 3',
+          key: 'Item 3',
+          sectionProps: {
+            items: [
+              { name: 'Item 1', key: 'Item 1' },
+              { name: 'Item 2', key: 'Item 2', canCheck: true },
+              { name: 'Item 3', key: 'Item 3' }
+            ]
+          }
+        }];
+
+      expect(canAnyMenuItemsCheck(items)).to.equal(true);
+    });
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index ea17a18754ce0..eb665bd34152e 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -69,6 +69,24 @@ function getIsChecked(item: IContextualMenuItem): boolean | null | undefined {
   return null;
 }
 
+/**
+ * Returns true if a list of menu items can contain a checkbox
+ */
+export function canAnyMenuItemsCheck(items: IContextualMenuItem[]): boolean {
+  return items.some(item => {
+    if (item.canCheck) {
+      return true;
+    }
+
+    // If the item is a section, check if any of the items in the section can check.
+    if (item.sectionProps && item.sectionProps.items.some(submenuItem => submenuItem.canCheck === true)) {
+      return true;
+    }
+
+    return false;
+  });
+}
+
 @customizable('ContextualMenu', ['theme'])
 @withResponsiveMode
 export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContextualMenuState> {
@@ -192,7 +210,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       return false;
     }
 
-    let hasCheckmarks = !!(items && items.some(item => !!item.canCheck));
+    let hasCheckmarks = canAnyMenuItemsCheck(items);
     const submenuProps = this.state.expandedMenuItemKey ? this._getSubmenuProps() : null;
 
     isBeakVisible = isBeakVisible === undefined ? this.props.responsiveMode! <= ResponsiveMode.medium : isBeakVisible;

From b9851e70e07c246086445ca5f3680e9b3c0b644b Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Thu, 28 Sep 2017 11:27:14 -0700
Subject: [PATCH 0740/1641] Separated out basic checkbox example from other
 dev-specific implementation examples (#2980)

* Separated out implementation examples

* Added change file
---
 .../checkbox-toolkit_2017-09-28-18-01.json    |  11 ++
 .../src/components/Checkbox/CheckboxPage.tsx  |  22 +++-
 .../examples/Checkbox.Basic.Example.tsx       |  71 +-----------
 .../Checkbox.ImplementationExamples.tsx       | 107 ++++++++++++++++++
 4 files changed, 138 insertions(+), 73 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/checkbox-toolkit_2017-09-28-18-01.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.ImplementationExamples.tsx

diff --git a/common/changes/office-ui-fabric-react/checkbox-toolkit_2017-09-28-18-01.json b/common/changes/office-ui-fabric-react/checkbox-toolkit_2017-09-28-18-01.json
new file mode 100644
index 0000000000000..cc8ca54aa8290
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/checkbox-toolkit_2017-09-28-18-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Simplified checkbox examples and fixed spacing issue.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx
index fc185da7d4f17..99523ceee6c1d 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx
@@ -6,10 +6,12 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { CheckboxBasicExample } from './examples/Checkbox.Basic.Example';
+import { CheckboxImplementationExamples } from './examples/Checkbox.ImplementationExamples';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { CheckboxStatus } from './Checkbox.checklist';
 
 const CheckboxBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx') as string;
+const CheckboxImplementationExamplesCode = require('!raw-loader!office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.ImplementationExamples.tsx') as string;
 
 export class CheckboxPage extends React.Component<IComponentDemoPageProps, any> {
   public render() {
@@ -18,9 +20,21 @@ export class CheckboxPage extends React.Component<IComponentDemoPageProps, any>
         title={ 'Checkbox' }
         componentName='CheckboxExample'
         exampleCards={
-          <ExampleCard title='Checkboxes' code={ CheckboxBasicExampleCode }>
-            <CheckboxBasicExample />
-          </ExampleCard>
+          <div>
+            <ExampleCard
+              title='Default Checkbox'
+              code={ CheckboxBasicExampleCode }
+            >
+              <CheckboxBasicExample />
+            </ExampleCard>
+
+            <ExampleCard
+              title='Implementation Examples'
+              code={ CheckboxImplementationExamplesCode }
+            >
+              <CheckboxImplementationExamples />
+            </ExampleCard>
+          </div>
         }
         propertiesTables={
           <PropertiesTableSet
@@ -80,4 +94,4 @@ export class CheckboxPage extends React.Component<IComponentDemoPageProps, any>
       />
     );
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
index e922c68d64644..c31b6588dc2d9 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
@@ -4,11 +4,6 @@ import {
   ICheckboxStyles,
   ICheckboxProps
 } from 'office-ui-fabric-react/lib/Checkbox';
-import {
-  Persona,
-  PersonaSize
-} from 'office-ui-fabric-react/lib/Persona';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 
 export interface ICheckboxBasicExampleState {
   isChecked: boolean;
@@ -28,65 +23,13 @@ export class CheckboxBasicExample extends React.Component<{}, ICheckboxBasicExam
   public render() {
     let { isChecked } = this.state;
 
-    let styles: ICheckboxStyles = {
-      root: {
-        marginTop: '10'
-      }
-    };
-
     return (
       <div>
         <Checkbox
-          label='Uncontrolled checkbox'
+          label='Standard checkbox'
           onChange={ this._onCheckboxChange }
-          inputProps={ {
-            onFocus: () => { console.log('Uncontrolled checkbox is focused'); },
-            onBlur: () => { console.log('Uncontrolled checkbox is blured'); }
-          } }
-          styles={ styles }
           ariaDescribedBy={ 'descriptionID' }
         />
-        <label id='descriptionID' className='screenReaderOnly'>Uncontroller checkbox description</label>
-
-        <Checkbox
-          label='Uncontrolled checkbox with defaultChecked true'
-          defaultChecked={ true }
-          onChange={ this._onCheckboxChange }
-          styles={ styles }
-        />
-
-        <Checkbox
-          label='Disabled uncontrolled checkbox'
-          disabled={ true }
-          styles={ styles }
-        />
-
-        <Checkbox
-          label='Disabled uncontrolled checkbox with defaultChecked true'
-          disabled={ true }
-          defaultChecked={ true }
-          onChange={ this._onCheckboxChange }
-          styles={ styles }
-        />
-
-        <Checkbox
-          label='Controlled checkbox'
-          checked={ isChecked }
-          onChange={ this._onControlledCheckboxChange }
-          styles={ styles }
-        />
-
-        <Checkbox
-          label='Checkbox rendered with boxSide "end"'
-          boxSide='end'
-          styles={ styles }
-        />
-
-        <Checkbox
-          label='Persona Checkbox'
-          styles={ styles }
-          onRenderLabel={ this._renderPersonaLabel }
-        />
       </div>
     );
   }
@@ -94,14 +37,4 @@ export class CheckboxBasicExample extends React.Component<{}, ICheckboxBasicExam
   private _onCheckboxChange(ev: React.FormEvent<HTMLElement>, isChecked: boolean) {
     console.log(`The option has been changed to ${isChecked}.`);
   }
-
-  @autobind
-  private _onControlledCheckboxChange(ev: React.FormEvent<HTMLElement>, checked: boolean): void {
-    this.setState({ isChecked: checked! });
-  }
-
-  private _renderPersonaLabel(props: ICheckboxProps) {
-    const DEFAULT_IMAGE_URL = '/_layouts/15/userphoto.aspx?size=S&accountname=';
-    return <Persona primaryText={ props.label } imageUrl={ DEFAULT_IMAGE_URL } size={ PersonaSize.extraSmall } />;
-  }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.ImplementationExamples.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.ImplementationExamples.tsx
new file mode 100644
index 0000000000000..73ecfb1f03ba1
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.ImplementationExamples.tsx
@@ -0,0 +1,107 @@
+import * as React from 'react';
+import {
+  Checkbox,
+  ICheckboxStyles,
+  ICheckboxProps
+} from 'office-ui-fabric-react/lib/Checkbox';
+import {
+  Persona,
+  PersonaSize
+} from 'office-ui-fabric-react/lib/Persona';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+
+export interface ICheckboxBasicExampleState {
+  isChecked: boolean;
+}
+
+export class CheckboxImplementationExamples extends React.Component<{}, ICheckboxBasicExampleState> {
+  constructor() {
+    super();
+
+    this.state = {
+      isChecked: false
+    };
+
+    this._onCheckboxChange = this._onCheckboxChange.bind(this);
+  }
+
+  public render() {
+    let { isChecked } = this.state;
+
+    let styles: ICheckboxStyles = {
+      root: {
+        marginTop: '10px'
+      }
+    };
+
+    return (
+      <div>
+        <Checkbox
+          label='Uncontrolled checkbox'
+          onChange={ this._onCheckboxChange }
+          inputProps={ {
+            onFocus: () => { console.log('Uncontrolled checkbox is focused'); },
+            onBlur: () => { console.log('Uncontrolled checkbox is blured'); }
+          } }
+          styles={ styles }
+          ariaDescribedBy={ 'descriptionID' }
+        />
+        <label id='descriptionID' className='screenReaderOnly'>Uncontroller checkbox description</label>
+
+        <Checkbox
+          label='Uncontrolled checkbox with defaultChecked true'
+          defaultChecked={ true }
+          onChange={ this._onCheckboxChange }
+          styles={ styles }
+        />
+
+        <Checkbox
+          label='Disabled uncontrolled checkbox'
+          disabled={ true }
+          styles={ styles }
+        />
+
+        <Checkbox
+          label='Disabled uncontrolled checkbox with defaultChecked true'
+          disabled={ true }
+          defaultChecked={ true }
+          onChange={ this._onCheckboxChange }
+          styles={ styles }
+        />
+
+        <Checkbox
+          label='Controlled checkbox'
+          checked={ isChecked }
+          onChange={ this._onControlledCheckboxChange }
+          styles={ styles }
+        />
+
+        <Checkbox
+          label='Checkbox rendered with boxSide "end"'
+          boxSide='end'
+          styles={ styles }
+        />
+
+        <Checkbox
+          label='Persona Checkbox'
+          styles={ styles }
+          onRenderLabel={ this._renderPersonaLabel }
+        />
+      </div>
+    );
+  }
+
+  private _onCheckboxChange(ev: React.FormEvent<HTMLElement>, isChecked: boolean) {
+    console.log(`The option has been changed to ${isChecked}.`);
+  }
+
+  @autobind
+  private _onControlledCheckboxChange(ev: React.FormEvent<HTMLElement>, checked: boolean): void {
+    this.setState({ isChecked: checked! });
+  }
+
+  private _renderPersonaLabel(props: ICheckboxProps) {
+    const DEFAULT_IMAGE_URL = '/_layouts/15/userphoto.aspx?size=S&accountname=';
+    return <Persona primaryText={ props.label } imageUrl={ DEFAULT_IMAGE_URL } size={ PersonaSize.extraSmall } />;
+  }
+}

From af886149a115cc6ac2dc697caa3b2f535c8d6147 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Thu, 28 Sep 2017 11:54:50 -0700
Subject: [PATCH 0741/1641] Added SharePoint Toolkit to ResourcesPage on
 website (#2983)

* Added SharePoint Toolkit section

* Removed s from Office(s)

* Updated toolkit names

* Updated paragraph text

* Added change file
---
 .../src/pages/GetStarted/GetStartedPage.tsx           |  2 +-
 apps/fabric-website/src/pages/HomePage/HomePage.tsx   |  2 +-
 .../src/pages/Overviews/ComponentsPage.tsx            |  2 +-
 .../fabric-website/src/pages/Overviews/StylesPage.tsx |  2 +-
 .../src/pages/ResourcesPage/ResourcesPage.tsx         | 10 ++++++++--
 .../sharepoint-toolkit_2017-09-28-18-38.json          | 11 +++++++++++
 6 files changed, 23 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/sharepoint-toolkit_2017-09-28-18-38.json

diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
index 4a55b30b71f22..931228ca56614 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
@@ -64,7 +64,7 @@ export class GetStartedPage extends React.Component<any, any> {
           </div>
           <div id='toolkit'>
             <span className={ styles.title }>Design Toolkit</span>
-            <span className={ styles.descriptionLarge }>The Fabric design toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences.</span>
+            <span className={ styles.descriptionLarge }>The Fabric design toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Office experiences.</span>
             <a className={ styles.getStartedLink } href='#/resources'>Learn more</a>
           </div>
         </div>
diff --git a/apps/fabric-website/src/pages/HomePage/HomePage.tsx b/apps/fabric-website/src/pages/HomePage/HomePage.tsx
index 53cbf400a3114..6545d5a36fdd6 100644
--- a/apps/fabric-website/src/pages/HomePage/HomePage.tsx
+++ b/apps/fabric-website/src/pages/HomePage/HomePage.tsx
@@ -83,7 +83,7 @@ export class HomePage extends React.Component<any, any> {
           </ul>
           <span className={ styles.trademark }>All trademarks are the property of their respective owners. Usage of Fabric assets, such as fonts and icons, is subject to the <a className={ styles.homePageLink } href='https://static2.sharepointonline.com/files/fabric/assets/microsoft_fabric_assets_license_agreement_sept092017.pdf'>assets license agreement</a>.</span>
           <span className={ styles.featuredTitle }>Design Toolkit</span>
-          <span className={ styles.featuredDescription } id={ styles.toolkitDescription }>The Fabric design toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences. <a className={ styles.homePageLink } href='#/resources'>Learn more</a></span>
+          <span className={ styles.featuredDescription } id={ styles.toolkitDescription }>The Fabric design toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Office experiences. <a className={ styles.homePageLink } href='#/resources'>Learn more</a></span>
         </div>
       </div>
     );
diff --git a/apps/fabric-website/src/pages/Overviews/ComponentsPage.tsx b/apps/fabric-website/src/pages/Overviews/ComponentsPage.tsx
index 2ec4f8802be83..1c1662094b730 100644
--- a/apps/fabric-website/src/pages/Overviews/ComponentsPage.tsx
+++ b/apps/fabric-website/src/pages/Overviews/ComponentsPage.tsx
@@ -26,7 +26,7 @@ export class ComponentsPage extends React.Component<any, any> {
           <p>Fabric comes in many flavors so you can choose the one that works for you. Check out <a href='#/angular-js'>ngOfficeUIFabric</a> and <a href='#/fabric-ios'>Fabric iOS</a> to learn more about each option.</p>
           <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/components-header.svg' } width='284' height='388' alt='Illustrated representation of a DatePicker and Persona list control.' />
           <span className={ styles.title }>Design Toolkit</span>
-          <span className={ styles.descriptionLarge }>The Fabric design toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences.</span>
+          <span className={ styles.descriptionLarge }>The Fabric design toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Office experiences.</span>
           <a href='#/resources'>Learn more</a>
         </div>
       </div>
diff --git a/apps/fabric-website/src/pages/Overviews/StylesPage.tsx b/apps/fabric-website/src/pages/Overviews/StylesPage.tsx
index f908fdc721513..e1351d495aba6 100644
--- a/apps/fabric-website/src/pages/Overviews/StylesPage.tsx
+++ b/apps/fabric-website/src/pages/Overviews/StylesPage.tsx
@@ -25,7 +25,7 @@ export class StylesPage extends React.Component<any, any> {
           <p>Fabric&rsquo;s components use the core styling. To learn more about the fully-styled controls, check out the <a href='#/components'>components</a> page.</p>
           <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/styles-header.svg' } width='225' height='388' alt='Graphic showing elements of color and type' />
           <span className={ styles.title }>Design Toolkit</span>
-          <span className={ styles.descriptionLarge }>The Fabric design toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences.</span>
+          <span className={ styles.descriptionLarge }>The Fabric design toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Office experiences.</span>
           <a href='#/resources'>Learn more</a>
         </div>
       </div>
diff --git a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
index bc07a8c9cff5a..f4faff7a17cc8 100644
--- a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
+++ b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
@@ -41,13 +41,19 @@ export class ResourcesPage extends React.Component<any, any> {
               <div className={ css('ms-Grid-col ms-sm12 ms-lg8', styles.description) }>
                 <p>To ensure a consistent look and feel for your project, here's where you can leverage essential elements. This section covers design and UI-related downloads for apps designed and built with Fabric.</p>
 
-                <h3>Design Toolkit</h3>
-                <p>The Fabric design toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Offices experiences.</p>
+                <h3>Fabric Design Toolkit</h3>
+                <p>The Fabric design toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Office experiences.</p>
                 <ul>
                   <li><a className={ styles.relatedLink } href='https://static2.sharepointonline.com/files/fabric/fabric-website/files/officeuifabric.zip'>Adobe XD Toolkit</a></li>
                   <li><a className={ styles.relatedLink } href='https://microsoft.sharepoint.com/teams/OfficeUIFabric97'>Adobe XD Toolkit (Microsoft employees)</a></li>
                 </ul>
 
+                <h3>SharePoint Design Toolkit</h3>
+                <p>Use the resources on this page to ensure a consistent look and feel for your project. This section includes page grids for Team and Communication sites, outlines for columns on the grid to help you make your design responsive, and a sample web part.</p>
+                <ul>
+                  <li><a className={ styles.relatedLink } href='https://static2.sharepointonline.com/files/fabric/fabric-website/files/sharepoint_toolkit.zip'>SharePoint Toolkit</a></li>
+                </ul>
+
                 <h3>Fonts</h3>
                 <ul>
                   <li><a className={ styles.relatedLink } href='https://static2.sharepointonline.com/files/fabric/fabric-website/files/segoeui_fabricmdl2_icon_fonts.zip'>Segoe UI and Fabric MDL2 icon font</a></li>
diff --git a/common/changes/@uifabric/fabric-website/sharepoint-toolkit_2017-09-28-18-38.json b/common/changes/@uifabric/fabric-website/sharepoint-toolkit_2017-09-28-18-38.json
new file mode 100644
index 0000000000000..75107c0b3c975
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/sharepoint-toolkit_2017-09-28-18-38.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Added SharePoint Toolkit link and text to ResourcesPage.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From 9915c5fd03b43e77a75dbe33421f48df3c747192 Mon Sep 17 00:00:00 2001
From: petdun2519 <peterdunlop2519@gmail.com>
Date: Thu, 28 Sep 2017 14:23:50 -0700
Subject: [PATCH 0742/1641] Users/petdun/fix date picker keydown change year
 (#2961)

* date picker control would always increase year for keydown. now it incremenets decrements correct

* change file

* Update users-petdun-fixDatePickerKeydownChangeYear_2017-09-26-20-12.json
---
 ...xDatePickerKeydownChangeYear_2017-09-26-20-12.json | 11 +++++++++++
 .../src/components/Calendar/CalendarMonth.tsx         |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-petdun-fixDatePickerKeydownChangeYear_2017-09-26-20-12.json

diff --git a/common/changes/office-ui-fabric-react/users-petdun-fixDatePickerKeydownChangeYear_2017-09-26-20-12.json b/common/changes/office-ui-fabric-react/users-petdun-fixDatePickerKeydownChangeYear_2017-09-26-20-12.json
new file mode 100644
index 0000000000000..cd208adabeeaa
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-petdun-fixDatePickerKeydownChangeYear_2017-09-26-20-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DatePicker: call correct callback when previous year button is clicked",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "peterdunlop2519@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
index d1da67a448ce5..947d036669ecc 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
@@ -166,7 +166,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
 
   @autobind
   private _onSelectPrevYearKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
-    this._onKeyDown(this._onSelectNextYear, ev);
+    this._onKeyDown(this._onSelectPrevYear, ev);
   }
 
   @autobind

From 35abf2925835a9ee29cf7902ec02ff3c56533724 Mon Sep 17 00:00:00 2001
From: Amund Kronen Johansen <32198837+amkronen@users.noreply.github.com>
Date: Fri, 29 Sep 2017 00:16:19 +0200
Subject: [PATCH 0743/1641] TextField: Adding custom render to label (#2946)

* Added a custom render and an example

* Some cleanup

* Added changelist entry

* Made OnRenderLabel replace existing render logic when set and pass the component id in with the props
---
 ...tfield_custom_render_2017-09-26-13-18.json | 11 +++
 .../components/TextField/TextField.Props.ts   | 10 +++
 .../src/components/TextField/TextField.tsx    | 18 ++++-
 .../components/TextField/TextFieldPage.tsx    |  8 +++
 .../TextField.CustomRender.Example.tsx        | 69 +++++++++++++++++++
 5 files changed, 113 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/amkronen-textfield_custom_render_2017-09-26-13-18.json
 create mode 100644 packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/amkronen-textfield_custom_render_2017-09-26-13-18.json b/common/changes/office-ui-fabric-react/amkronen-textfield_custom_render_2017-09-26-13-18.json
new file mode 100644
index 0000000000000..d63f5b17a7303
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/amkronen-textfield_custom_render_2017-09-26-13-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Adding custom render to TextField label",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "amkronen@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts b/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts
index 86fca64cf98eb..3e1d46b5d57be 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts
@@ -77,6 +77,11 @@ export interface ITextFieldProps extends React.AllHTMLAttributes<HTMLInputElemen
    */
   label?: string;
 
+  /**
+   * Optional custom renderer for the label
+   */
+  onRenderLabel?: IRenderFunction<ITextFieldProps>;
+
   /**
    * The textfield input description
    */
@@ -195,4 +200,9 @@ export interface ITextFieldProps extends React.AllHTMLAttributes<HTMLInputElemen
    */
   iconClass?: string;
 
+  /**
+ * Internal ID passed to render functions.
+ */
+  componentId?: string;
+
 }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index 42df4d0179838..5163050a2688f 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -131,17 +131,18 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
       disabled,
       iconClass,
       iconProps,
-      label,
       multiline,
       required,
       underlined,
       borderless,
       addonString,
-      onRenderAddon = this._onRenderAddon
+      onRenderAddon = this._onRenderAddon,
+      onRenderLabel = this._onRenderLabel
     } = this.props;
     let { isFocused } = this.state;
     const errorMessage = this._errorMessage;
     this._isDescriptionAvailable = Boolean(description || errorMessage);
+    const renderProps: ITextFieldProps = { ...this.props, componentId: this._id };
 
     const textFieldClassName = css('ms-TextField', styles.root, className, {
       ['is-required ' + styles.rootIsRequiredLabel]: this.props.label && required,
@@ -156,7 +157,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
     return (
       <div className={ textFieldClassName }>
         <div className={ css('ms-TextField-wrapper', styles.wrapper, underlined ? errorMessage && styles.invalid : '') }>
-          { label && <Label htmlFor={ this._id }>{ label }</Label> }
+          { onRenderLabel(renderProps, this._onRenderLabel) }
           <div className={ css('ms-TextField-fieldGroup', styles.fieldGroup, isFocused && styles.fieldGroupIsFocused, errorMessage && styles.invalid) }>
             { (addonString !== undefined || this.props.onRenderAddon) && (
               <div className={ css(styles.fieldAddon) }>
@@ -270,6 +271,17 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
     }
   }
 
+  private _onRenderLabel(props: ITextFieldProps): JSX.Element | null {
+    const {
+      label,
+      componentId
+     } = props;
+    if (label) {
+      return (<Label htmlFor={ componentId }>{ label }</Label>);
+    }
+    return null;
+  }
+
   private _onRenderAddon(props: ITextFieldProps): JSX.Element {
     let { addonString } = props;
     return (
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
index 047c0928c0ba0..5149ce66ef5ee 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
@@ -6,6 +6,7 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { TextFieldBasicExample } from './examples/TextField.Basic.Example';
+import { TextFieldCustomRenderExample } from './examples/TextField.CustomRender.Example';
 import { TextFieldPlaceholderExample } from './examples/TextField.Placeholder.Example';
 import { TextFieldMultilineExample } from './examples/TextField.Multiline.Example';
 import { TextFieldUnderlinedExample } from './examples/TextField.Underlined.Example';
@@ -16,6 +17,7 @@ import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { TextFieldStatus } from './TextField.checklist';
 
 const TextFieldBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx') as string;
+const TextFieldCustomRenderExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx') as string;
 const TextFieldPlaceholderExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Placeholder.Example.tsx') as string;
 const TextFieldMultilineExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Multiline.Example.tsx') as string;
 const TextFieldUnderlinedExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Underlined.Example.tsx') as string;
@@ -37,6 +39,12 @@ export class TextFieldPage extends React.Component<IComponentDemoPageProps, {}>
             >
               <TextFieldBasicExample />
             </ExampleCard>
+            <ExampleCard
+              title='TextField with custom Label'
+              code={ TextFieldCustomRenderExampleCode }
+            >
+              <TextFieldCustomRenderExample />
+            </ExampleCard>
             <ExampleCard
               title='TextField with Placeholder'
               code={ TextFieldPlaceholderExampleCode }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx
new file mode 100644
index 0000000000000..9f7ccc33d20ab
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx
@@ -0,0 +1,69 @@
+import * as React from 'react';
+import { TextField, ITextFieldProps } from 'office-ui-fabric-react/lib/TextField';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { IconButton } from 'office-ui-fabric-react/lib/Button';
+import { Callout } from 'office-ui-fabric-react/lib/Callout';
+
+export class TextFieldCustomRenderExample extends React.Component<any, any> {
+
+  private _iconButtonElement: HTMLElement;
+
+  public constructor() {
+    super();
+
+    this.state = {
+      isCalloutVisible: false
+    };
+  }
+
+  public render() {
+    return (
+      <div>
+        <TextField onRenderLabel={ this._onRenderLabel } />
+      </div>
+    );
+  }
+
+  @autobind
+  private _onRenderLabel(props: ITextFieldProps): JSX.Element {
+
+    let { isCalloutVisible } = this.state;
+    return (
+      <div className='ms-CustomRenderExample' style={ { display: 'flex', alignItems: 'center' } }>
+        <span>TextField with custom label render</span>
+        <span className='ms-CustomRenderExample-labelIconArea' ref={ (menuButton) => this._iconButtonElement = menuButton! }>
+          <IconButton
+            iconProps={ { iconName: 'Info' } }
+            title='Info'
+            ariaLabel='Info'
+            onClick={ this._onClick }
+          />
+        </span>
+        { isCalloutVisible && (
+          <Callout
+            className='ms-CustomRenderExample-callout'
+            targetElement={ this._iconButtonElement }
+            onDismiss={ this._onDismiss }
+          >
+            <text> In additon to the label itself, this label includes an iconbutton which pops out more information in a callout</text>
+          </Callout>
+        ) }
+      </div>
+    );
+
+  }
+
+  @autobind
+  private _onClick(): void {
+    this.setState({
+      isCalloutVisible: !this.state.isCalloutVisible
+    });
+  }
+
+  @autobind
+  private _onDismiss() {
+    this.setState({
+      isCalloutVisible: false
+    });
+  }
+}

From b963efb7ae91dad705b0cd32d01dd68f40d9fe0a Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 28 Sep 2017 15:32:57 -0700
Subject: [PATCH 0744/1641] Update .travis.yml

---
 .travis.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.travis.yml b/.travis.yml
index 589b4565139e9..35bc120558dbb 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -3,4 +3,4 @@ node_js:
   - '7'
 script:
   - npm run buildfast
-  - 'if [ "$TRAVIS_PULL_REQUEST" != "false" ]; then npm run vrtest; fi'
\ No newline at end of file
+  - npm run vrtest

From 65e18250cfeab19c781a11ed647c433ce91fbcbd Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 28 Sep 2017 16:31:36 -0700
Subject: [PATCH 0745/1641] Update screener.config.js

---
 apps/vr-tests/screener.config.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/apps/vr-tests/screener.config.js b/apps/vr-tests/screener.config.js
index a42ac0c3ed88f..c7446f67ad640 100644
--- a/apps/vr-tests/screener.config.js
+++ b/apps/vr-tests/screener.config.js
@@ -3,7 +3,7 @@ module.exports = {
   storybookConfigDir: '.storybook',
   apiKey: process.env.SCREENER_API_KEY,
   resolution: '1024x768',
-  baseBranch: 'master',
+  baseBranch: (process.env.TRAVIS_PULL_REQUEST !== 'false' && process.env.TRAVIS_BRANCH) || 'master',
   failureExitCode: 0
 };
 
@@ -28,4 +28,4 @@ module.exports = {
 //   username: 'dzearing',
 //   accessKey: process.env.SAUCE_API_KEY
 // };
-// }
\ No newline at end of file
+// }

From 88b06cfda2262661375f90f3bde2d6a16af749a9 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 28 Sep 2017 20:45:02 -0700
Subject: [PATCH 0746/1641] mergeStyleSets type safety works better (#2989)

* Typing fixes.

* Adding changes files.
---
 .vscode/settings.json                         | 17 ++++++++++-------
 .../mergestylesets_2017-09-29-03-31.json      | 11 +++++++++++
 .../mergestylesets_2017-09-29-03-31.json      | 11 +++++++++++
 .../merge-styles/src/mergeStyleSets.test.ts   |  5 ++---
 packages/merge-styles/src/mergeStyleSets.ts   | 13 +++++++------
 packages/merge-styles/src/server.test.ts      |  2 +-
 .../Button/SplitButton/SplitButton.styles.ts  |  4 ++--
 .../components/ComboBox/ComboBox.styles.ts    |  8 ++++----
 .../HoverCard/ExpandingCard.styles.ts         |  4 ++--
 .../src/components/Icon/Icon.classNames.ts    | 19 +++++++++----------
 10 files changed, 59 insertions(+), 35 deletions(-)
 create mode 100644 common/changes/@uifabric/merge-styles/mergestylesets_2017-09-29-03-31.json
 create mode 100644 common/changes/office-ui-fabric-react/mergestylesets_2017-09-29-03-31.json

diff --git a/.vscode/settings.json b/.vscode/settings.json
index 8807589f04b73..3f212824c4a6c 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -12,17 +12,19 @@
   "files.exclude": {
     "**/.git": true,
     "**/.DS_Store": true,
-    "**/bower_components": true,
     "**/coverage": true,
     "**/*.scss.ts": true
   },
   "files.watcherExclude": {
-    "**/.git/objects/**": true,
-    "**/.git/subtree-cache/**": true,
-    "**/node_modules/**": true,
-    "**/tmp/**": true,
-    "**/bower_components/**": true,
-    "**/dist/**": true
+    "**/.git": true,
+    "**/node_modules": true,
+    "**/lib": true,
+    "**/lib-amd": true,
+    "/**lib-es6": true,
+    "**/temp": true,
+    "**/dist": true,
+    "**/*.scss.ts": true,
+    "**/coverage": true
   },
   // Configure glob patterns for excluding files and folders in searches. Inherits all glob patterns from the file.exclude setting.
   "search.exclude": {
@@ -30,6 +32,7 @@
     "**/node_modules": true,
     "**/lib": true,
     "**/lib-amd": true,
+    "**/lib-es6": true,
     "**/dist": true,
     "**/*.scss.ts": true
   },
diff --git a/common/changes/@uifabric/merge-styles/mergestylesets_2017-09-29-03-31.json b/common/changes/@uifabric/merge-styles/mergestylesets_2017-09-29-03-31.json
new file mode 100644
index 0000000000000..b3bf76eed0b11
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/mergestylesets_2017-09-29-03-31.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "The `mergeStyleSets` method's type safety was not correct. Now with significantly better type safety.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/mergestylesets_2017-09-29-03-31.json b/common/changes/office-ui-fabric-react/mergestylesets_2017-09-29-03-31.json
new file mode 100644
index 0000000000000..ce4f747d3960e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/mergestylesets_2017-09-29-03-31.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Updating mergeStyleSets usage in various components to adhere to correct typing.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/merge-styles/src/mergeStyleSets.test.ts b/packages/merge-styles/src/mergeStyleSets.test.ts
index 55d20b51755e7..19aef16a66893 100644
--- a/packages/merge-styles/src/mergeStyleSets.test.ts
+++ b/packages/merge-styles/src/mergeStyleSets.test.ts
@@ -14,9 +14,8 @@ describe('mergeStyleSets', () => {
   });
 
   it('can merge style sets', () => {
-
-    // tslint:disable-next-line:no-any
-    const result = mergeStyleSets<any>(
+    const result: { root: string, a: string, b: string } = mergeStyleSets(
+      {},
       {
         root: { background: 'red' },
         a: { background: 'green' }
diff --git a/packages/merge-styles/src/mergeStyleSets.ts b/packages/merge-styles/src/mergeStyleSets.ts
index 7bbf43d330704..06401c4b50dee 100644
--- a/packages/merge-styles/src/mergeStyleSets.ts
+++ b/packages/merge-styles/src/mergeStyleSets.ts
@@ -8,10 +8,10 @@ import { IStyle } from './IStyle';
  *
  * @public
  */
-export function mergeStyleSets<T extends object>(
-  ...cssSets: (T | false | null | undefined)[]
-): {[P in keyof T]?: string } {
-  const classNameSet: {[P in keyof T]?: string } = {};
+export function mergeStyleSets<T>(
+  ...cssSets: ({[P in keyof T]?: IStyle } | false | null | undefined)[]
+): T {
+  const classNameSet: Partial<T> = {};
   let cssSet = cssSets[0];
 
   if (cssSet) {
@@ -20,10 +20,11 @@ export function mergeStyleSets<T extends object>(
     }
     for (const prop in cssSet) {
       if (cssSet.hasOwnProperty(prop)) {
-        classNameSet[prop] = mergeStyles(cssSet[prop] as IStyle);
+        // tslint:disable-next-line:no-any
+        (classNameSet as any)[prop] = mergeStyles(cssSet[prop] as IStyle);
       }
     }
   }
 
-  return classNameSet;
+  return classNameSet as T;
 }
diff --git a/packages/merge-styles/src/server.test.ts b/packages/merge-styles/src/server.test.ts
index 65179847b1a0f..4c56d963323af 100644
--- a/packages/merge-styles/src/server.test.ts
+++ b/packages/merge-styles/src/server.test.ts
@@ -7,7 +7,7 @@ describe('staticRender', () => {
   it('can render content', () => {
 
     const { html, css } = renderStatic(() => {
-      const classNames = mergeStyleSets({
+      const classNames: { root: string } = mergeStyleSets({
         root: {
           background: 'red'
         }
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
index 485ec59e9bfcf..c115f910a2c21 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
@@ -1,7 +1,7 @@
 import { IButtonStyles } from '../Button.Props';
 import {
   ITheme,
-  mergeStyleSets,
+  concatStyleSets,
   getFocusStyle
 } from '../../../Styling';
 import { memoizeFunction } from '../../../Utilities';
@@ -69,5 +69,5 @@ export const getStyles = memoizeFunction((
     },
   };
 
-  return mergeStyleSets(splitButtonStyles, customStyles)!;
+  return concatStyleSets(splitButtonStyles, customStyles)!;
 });
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index b1a7d29486767..52e0a4c5bd618 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -5,7 +5,7 @@ import {
 import {
   ITheme,
   IRawStyle,
-  mergeStyleSets,
+  concatStyleSets,
   FontSizes,
   FontWeights,
   getFocusStyle
@@ -135,7 +135,7 @@ export const getOptionStyles = memoizeFunction((
     },
   };
 
-  return mergeStyleSets(optionStyles, customStylesForAllOptions, customOptionStylesForCurrentOption) as IComboBoxOptionStyles;
+  return concatStyleSets(optionStyles, customStylesForAllOptions, customOptionStylesForCurrentOption) as IComboBoxOptionStyles;
 });
 
 export const getCaretDownButtonStyles = memoizeFunction((
@@ -173,7 +173,7 @@ export const getCaretDownButtonStyles = memoizeFunction((
     },
     rootDisabled: getDisabledStyles(theme),
   };
-  return mergeStyleSets(styles, customStyles) as IButtonStyles;
+  return concatStyleSets(styles, customStyles) as IButtonStyles;
 });
 
 export const getStyles = memoizeFunction((
@@ -312,5 +312,5 @@ export const getStyles = memoizeFunction((
 
   };
 
-  return mergeStyleSets(styles, customStyles) as IComboBoxStyles;
+  return concatStyleSets(styles, customStyles) as IComboBoxStyles;
 });
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
index b4c9fa00c5aab..06813d94a580e 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
@@ -1,7 +1,7 @@
 import { IExpandingCardStyles } from './ExpandingCard.Props';
 import { memoizeFunction } from '../../Utilities';
 import {
-  mergeStyleSets,
+  concatStyleSets,
   ITheme
 } from '../../Styling';
 
@@ -59,5 +59,5 @@ export const getStyles = memoizeFunction((
     }
   };
 
-  return mergeStyleSets(styles, customStyles)!;
+  return concatStyleSets(styles, customStyles)!;
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.classNames.ts b/packages/office-ui-fabric-react/src/components/Icon/Icon.classNames.ts
index bfd36087028c8..80ac0342a5841 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.classNames.ts
@@ -14,18 +14,17 @@ export interface IIconClassNames {
 export const getClassNames = memoizeFunction((
   customStyles?: IIconStyles
 ): IIconClassNames => {
-  let iconStyles: IIconStyles = {
-    root: {
-      display: 'inline-block'
-    },
-
-    imageContainer: {
-      overflow: 'hidden'
-    }
-  };
 
   return mergeStyleSets(
-    iconStyles,
+    {
+      root: {
+        display: 'inline-block'
+      },
+
+      imageContainer: {
+        overflow: 'hidden'
+      }
+    },
     customStyles
   );
 });

From 782705c98981f7114864f06472e0411af2d7a9aa Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 28 Sep 2017 22:45:37 -0500
Subject: [PATCH 0747/1641] Upgrade example-app-base to Fabric 5.0 (#2986)

* Update to fabric 5.0

* rush change
---
 ...-base-fabric-upgrade_2017-09-28-23-51.json |  11 +
 common/config/rush/npm-shrinkwrap.json        | 950 ++++++++++++++----
 packages/example-app-base/package.json        |   2 +-
 3 files changed, 754 insertions(+), 209 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/example-app-base-fabric-upgrade_2017-09-28-23-51.json

diff --git a/common/changes/@uifabric/example-app-base/example-app-base-fabric-upgrade_2017-09-28-23-51.json b/common/changes/@uifabric/example-app-base/example-app-base-fabric-upgrade_2017-09-28-23-51.json
new file mode 100644
index 0000000000000..b11f258ddb8ea
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/example-app-base-fabric-upgrade_2017-09-28-23-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Update fabric version for example-app-base",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 13c73fc11b1c0..5bd7c835736f4 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -19,7 +19,7 @@
       "integrity": "sha1-apeiLzpi5UwLUwo+jxSYrSuE19w="
     },
     "@rush-temp/build": {
-      "version": "file:projects/build",
+      "version": "file:projects\\build",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -360,7 +360,7 @@
       }
     },
     "@rush-temp/example-app-base": {
-      "version": "file:projects/example-app-base",
+      "version": "file:projects\\example-app-base",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -647,7 +647,7 @@
       }
     },
     "@rush-temp/experiments": {
-      "version": "file:projects/experiments",
+      "version": "file:projects\\experiments",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -898,7 +898,7 @@
       }
     },
     "@rush-temp/fabric-website": {
-      "version": "file:projects/fabric-website",
+      "version": "file:projects\\fabric-website",
       "dependencies": {
         "@types/react-addons-test-utils": {
           "version": "0.14.19",
@@ -1219,10 +1219,10 @@
       }
     },
     "@rush-temp/icons": {
-      "version": "file:projects/icons"
+      "version": "file:projects\\icons"
     },
     "@rush-temp/merge-styles": {
-      "version": "file:projects/merge-styles",
+      "version": "file:projects\\merge-styles",
       "dependencies": {
         "@types/jest": {
           "version": "21.1.0",
@@ -1255,7 +1255,7 @@
       }
     },
     "@rush-temp/office-ui-fabric-react": {
-      "version": "file:projects/office-ui-fabric-react",
+      "version": "file:projects\\office-ui-fabric-react",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1552,10 +1552,10 @@
       }
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
-      "version": "file:projects/office-ui-fabric-react-tslint"
+      "version": "file:projects\\office-ui-fabric-react-tslint"
     },
     "@rush-temp/ssr-tests": {
-      "version": "file:projects/ssr-tests",
+      "version": "file:projects\\ssr-tests",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1788,7 +1788,7 @@
       }
     },
     "@rush-temp/styling": {
-      "version": "file:projects/styling",
+      "version": "file:projects\\styling",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -2025,7 +2025,7 @@
       }
     },
     "@rush-temp/test-bundle-button": {
-      "version": "file:projects/test-bundle-button",
+      "version": "file:projects\\test-bundle-button",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -2238,10 +2238,10 @@
       }
     },
     "@rush-temp/todo-app": {
-      "version": "file:projects/todo-app"
+      "version": "file:projects\\todo-app"
     },
     "@rush-temp/utilities": {
-      "version": "file:projects/utilities",
+      "version": "file:projects\\utilities",
       "dependencies": {
         "@types/jest": {
           "version": "21.1.0",
@@ -2300,7 +2300,7 @@
       }
     },
     "@rush-temp/vr-tests": {
-      "version": "file:projects/vr-tests",
+      "version": "file:projects\\vr-tests",
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -2347,9 +2347,9 @@
       }
     },
     "@storybook/addon-actions": {
-      "version": "3.2.10",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-actions/-/addon-actions-3.2.10.tgz",
-      "integrity": "sha512-qdPllhjTQ1W3v04mdtPyko5oifez3c7Zp9zrDmQKwyqCkrik3UFTi0TL3LmKlGZivNnvdCrzP9lkOvd65i+k3A=="
+      "version": "3.2.11",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-actions/-/addon-actions-3.2.11.tgz",
+      "integrity": "sha512-WbB+KNn+4BzsBzHDR4fdE33YXoC/etSrBqwz3RM4unJlgRSiJxWFyv0aKrMQA5IrfJPyFudI8wum1asgBATf7Q=="
     },
     "@storybook/addon-links": {
       "version": "3.2.10",
@@ -2382,9 +2382,9 @@
       "integrity": "sha512-T46B6ej2u/AqhMfB+dggmq4orUMAtponTjYDheYKUBQ6NSubh1H+85gx3FZepmnmJsM9UicV5Yc43wTUYf07xw=="
     },
     "@storybook/react": {
-      "version": "3.2.10",
-      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-3.2.10.tgz",
-      "integrity": "sha512-YSFX3T2Me7XVQMt0sYbvBQsqkoYEEs4ez3iqyt5bVuD9KTKsfu45zrehagjhiV3HHLIZ3utHpggxCIKRGaWeLA==",
+      "version": "3.2.11",
+      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-3.2.11.tgz",
+      "integrity": "sha512-73aup7efGRKKFBwEfyvebuZWaHbCsBQq03l29ke8e7gWiPEcRBBzlkXA0Jkt2LZ63K4ZFSsEiryltaouu6rZIA==",
       "dependencies": {
         "style-loader": {
           "version": "0.17.0",
@@ -2399,9 +2399,9 @@
       "integrity": "sha1-KWHoofbBr8zpfp6aFNHf6dkGEIc="
     },
     "@storybook/ui": {
-      "version": "3.2.10",
-      "resolved": "https://registry.npmjs.org/@storybook/ui/-/ui-3.2.10.tgz",
-      "integrity": "sha512-aV1CE9Sx0OuoWfbGrJHBTez0KFSJJorjoeMctncpkV8pAl7V0cSWyLkE6UQeWEXjw2SW2dk5Zhg1EHYKA8lv1A=="
+      "version": "3.2.11",
+      "resolved": "https://registry.npmjs.org/@storybook/ui/-/ui-3.2.11.tgz",
+      "integrity": "sha512-bxVmLCq++c77OkZMOnPuSSZUHd/sXkw6hBgwqAeuiFnsRnjgddBOMLOLxHAWGeE9I7WQ0Xll31E57vjdGIusNA=="
     },
     "@types/chai": {
       "version": "3.4.35",
@@ -2488,15 +2488,25 @@
       "resolved": "https://registry.npmjs.org/@types/webpack-env/-/webpack-env-1.13.0.tgz",
       "integrity": "sha1-MEQ4FkfhHulzxa8uklMjkw9pHYA="
     },
+    "@uifabric/icons": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.0.1.tgz",
+      "integrity": "sha512-oND+ez0D1jmOK8svzMFGtwkRMR0n3IdFcAb4RAflR7A0n+t6U0R+s3YOnoNuT8jAkmyBEgkqEj9rScE+p7749Q=="
+    },
+    "@uifabric/merge-styles": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.0.0.tgz",
+      "integrity": "sha512-LJi1PaVIi0x/+yfU1usLpranG04UnJaGEZoAXq7hbaULsImXjF1EofltXYWgaBTVOCXQJldQgApLdNQSfV74Ig=="
+    },
     "@uifabric/styling": {
-      "version": "0.24.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-0.24.1.tgz",
-      "integrity": "sha512-ISyxQX49b+prLynZdELmN3q6q3ci47EdXwT/AM4HfIPrRaD0j0G80n0/aGWUZeJgZRgqZxleTmhmiIDZH1OEXg=="
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.0.1.tgz",
+      "integrity": "sha512-DGsMoboFI5Q7no3wbLgs1jeaFkxG7N+h+jfpe7ubOq1D7S2hRpvvv8el8XLvGEqsooTdWpQKOBac25IuTxxK3Q=="
     },
     "@uifabric/utilities": {
-      "version": "4.15.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-4.15.0.tgz",
-      "integrity": "sha512-HtPcZi8F4GQg/Iv6vjrn5iIUPvOusu8LlmtPEOgYv6ZZAFDK+iLWEH319vMJBiqGo+mPfnrjQfDOjrWPUXoCzQ=="
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.0.1.tgz",
+      "integrity": "sha512-HUhh3EKUiZshpbNxcgkwQ6WcTKT3+rlhfX/pSeLElRTGbORYxdoWFDwVfFZT71xP2hFnUQI/Z5qb9BLdKeJpRA=="
     },
     "abab": {
       "version": "1.0.4",
@@ -2999,9 +3009,9 @@
       "integrity": "sha1-NHHenK7DiOXIUOWX5Yom3fN2ArI="
     },
     "babel-jest": {
-      "version": "21.0.2",
-      "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-21.0.2.tgz",
-      "integrity": "sha512-7nF+URWcIVX3A9DiLRcuwq86a+Phl+wXN/fwlSO4boTP/GmLLVyIQTui3th7tbA8F3L5xkYEO0e3NSf7oB/BJQ=="
+      "version": "21.2.0",
+      "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-21.2.0.tgz",
+      "integrity": "sha512-O0W2qLoWu1QOoOGgxiR2JID4O6WSpxPiQanrkyi9SSlM0PJ60Ptzlck47lhtnr9YZO3zYOsxHwnyeWJ6AffoBQ=="
     },
     "babel-loader": {
       "version": "7.1.2",
@@ -3029,9 +3039,9 @@
       "integrity": "sha1-Z2DN2Xf0EdPhdbsGTyvDJ9mbK24="
     },
     "babel-plugin-jest-hoist": {
-      "version": "21.0.2",
-      "resolved": "https://registry.npmjs.org/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-21.0.2.tgz",
-      "integrity": "sha512-iQeYbiM0lr5TCW42qvGkBBoy0rTx6SPppRFT7NwvdnSwNOGMI8+1Oc27SF5wJbCvAY7x5KScP3f0TKtunl+NRw=="
+      "version": "21.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-21.2.0.tgz",
+      "integrity": "sha512-yi5QuiVyyvhBUDLP4ButAnhYzkdrUwWDtvUJv71hjH3fclhnZg4HkDeqaitcR2dZZx/E67kGkRcPVjtVu+SJfQ=="
     },
     "babel-plugin-minify-builtins": {
       "version": "0.2.0",
@@ -3089,9 +3099,9 @@
       "integrity": "sha512-NiOvvA9Pq6bki6nP4BayXwT5GZadw7DJFDDzHmkpnOQpENWe8RtHtKZM44MG1R6EQ5XxgbLdsdhswIzTkFlO5g=="
     },
     "babel-plugin-react-docgen": {
-      "version": "1.8.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-react-docgen/-/babel-plugin-react-docgen-1.8.0.tgz",
-      "integrity": "sha512-rYAV4AthS8WgfEY/LaHeNvrtChXbG8w8pKX42ghPNeEB7ZCdk0Qy/ZzYSdR5ITQxh4ZEDu+pMAqfxu3t9mrK4w=="
+      "version": "1.8.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-react-docgen/-/babel-plugin-react-docgen-1.8.1.tgz",
+      "integrity": "sha512-11Yxwk8/iEULr+n5DG0BxXD6j/9htpiiR0/hLfi/gtEAK/d6NCNkyKFrC8loQcyMvF3hehPo30SKXG/itSX+hw=="
     },
     "babel-plugin-syntax-async-functions": {
       "version": "6.13.0",
@@ -3453,9 +3463,9 @@
       "integrity": "sha1-5xIYiHCFrpoktb5Baa/7WZgWxJ0="
     },
     "babel-preset-jest": {
-      "version": "21.0.2",
-      "resolved": "https://registry.npmjs.org/babel-preset-jest/-/babel-preset-jest-21.0.2.tgz",
-      "integrity": "sha512-WyzCFIoU+ga307hPnobHL9eRrZlpZYHQf7M3yOtimAwrLAgNFoSfin7ZVw903+zz81ZLuowZMKWCd0w3PNpAhg=="
+      "version": "21.2.0",
+      "resolved": "https://registry.npmjs.org/babel-preset-jest/-/babel-preset-jest-21.2.0.tgz",
+      "integrity": "sha512-hm9cBnr2h3J7yXoTtAVV0zg+3vg0Q/gT2GYuzlreTU0EPkJRtlNgKJJ3tBKEn0+VjAi3JykV6xCJkuUYttEEfA=="
     },
     "babel-preset-minify": {
       "version": "0.2.0",
@@ -3468,9 +3478,9 @@
       "integrity": "sha1-umnfrqRfw+xjm2pOzqbhdwLJE4A="
     },
     "babel-preset-react-app": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/babel-preset-react-app/-/babel-preset-react-app-3.0.2.tgz",
-      "integrity": "sha512-UwRU1ppOl1JQEXnCXy8aFsKtvSkn1pNQULveOGZsytfrlHUYu9gU+D+zPYY6yMcAtbvQ4hFs+uA0bpPNwR9++Q==",
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/babel-preset-react-app/-/babel-preset-react-app-3.0.3.tgz",
+      "integrity": "sha512-hK1hPq8xOFxmnNwpsOcQ2wSRAQwNBhDqsMV75gyKYQ7Z39KmTRpMN2Jx6Wp0Mberqd2QEWsUqd9ccP2jfd4z2Q==",
       "dependencies": {
         "babel-plugin-transform-regenerator": {
           "version": "6.24.1",
@@ -3831,14 +3841,14 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000738",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000738.tgz",
-      "integrity": "sha1-hICavEmjkOWowiSrk2nT+NAaogI="
+      "version": "1.0.30000739",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000739.tgz",
+      "integrity": "sha1-vnNN62vtTtimnXL7kHi8bqbXatA="
     },
     "caniuse-lite": {
-      "version": "1.0.30000738",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000738.tgz",
-      "integrity": "sha1-GCDDya25oRfjEaW9yh0lvDQojro="
+      "version": "1.0.30000739",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000739.tgz",
+      "integrity": "sha1-nujHAW9cUi27DAhj1Vxh77RTrpU="
     },
     "cardinal": {
       "version": "1.0.0",
@@ -4113,19 +4123,14 @@
       "integrity": "sha1-FnGKdd4oPtjmBAQWJaIGRYZ5fYo="
     },
     "compression": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/compression/-/compression-1.7.0.tgz",
-      "integrity": "sha1-AwyfGY8WQ6BX13anOOki2kNzAS0=",
+      "version": "1.7.1",
+      "resolved": "https://registry.npmjs.org/compression/-/compression-1.7.1.tgz",
+      "integrity": "sha1-7/JgPvwuIs+G810uuTWJ+YdTc9s=",
       "dependencies": {
-        "bytes": {
-          "version": "2.5.0",
-          "resolved": "https://registry.npmjs.org/bytes/-/bytes-2.5.0.tgz",
-          "integrity": "sha1-TJQj6i0lLCcMQbK97+/5u2tiwGo="
-        },
-        "debug": {
-          "version": "2.6.8",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
-          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
+        "accepts": {
+          "version": "1.3.4",
+          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.4.tgz",
+          "integrity": "sha1-hiRnWMfdbSGmR0/whKR0DsBesh8="
         }
       }
     },
@@ -4532,11 +4537,6 @@
       "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz",
       "integrity": "sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ="
     },
-    "default-gateway": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/default-gateway/-/default-gateway-2.5.0.tgz",
-      "integrity": "sha512-Mb+xi1aktPE+Uz5RmS3vU6Kr1fDqRvlMX3M5eneBai7LkldzM+WPjaUpz396taZgOgSw4s+CJGvd6VJJ/9W0dQ=="
-    },
     "default-require-extensions": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/default-require-extensions/-/default-require-extensions-1.0.0.tgz",
@@ -4706,9 +4706,9 @@
       "integrity": "sha1-zIcsFoiArjxxiXYv1f/ACJbJUYo="
     },
     "electron-to-chromium": {
-      "version": "1.3.22",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.22.tgz",
-      "integrity": "sha1-QyLVLBUUBuPq73StAmdog+hBZBg="
+      "version": "1.3.23",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.23.tgz",
+      "integrity": "sha1-5maKsYy2mvuPV3yKn8I9ACeIvnQ="
     },
     "elliptic": {
       "version": "6.4.0",
@@ -5023,29 +5023,44 @@
       }
     },
     "expect": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/expect/-/expect-21.1.0.tgz",
-      "integrity": "sha512-gBmUVy+A4+brj/MnuiwLe+MIMfSffWUmZMNjKHrMkB0cpkAjnFdwHAxs6MvYeh4+14ocp+SfKp4ebNEhkbV3YQ=="
+      "version": "21.2.1",
+      "resolved": "https://registry.npmjs.org/expect/-/expect-21.2.1.tgz",
+      "integrity": "sha512-orfQQqFRTX0jH7znRIGi8ZMR8kTNpXklTTz8+HGTpmTKZo3Occ6JNB5FXMb8cRuiiC/GyDqsr30zUa66ACYlYw=="
     },
     "express": {
-      "version": "4.15.5",
-      "resolved": "https://registry.npmjs.org/express/-/express-4.15.5.tgz",
-      "integrity": "sha1-ZwI1ypWYiQpa6BcLg9tyK4Qu2Sc=",
+      "version": "4.16.0",
+      "resolved": "https://registry.npmjs.org/express/-/express-4.16.0.tgz",
+      "integrity": "sha1-tRljjk61jnF4yBtJjvIveYyy4lU=",
       "dependencies": {
+        "accepts": {
+          "version": "1.3.4",
+          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.4.tgz",
+          "integrity": "sha1-hiRnWMfdbSGmR0/whKR0DsBesh8="
+        },
+        "finalhandler": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.0.tgz",
+          "integrity": "sha1-zgtoVbRYU+eRsvzGgARtiCU91/U="
+        },
+        "ipaddr.js": {
+          "version": "1.5.2",
+          "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.5.2.tgz",
+          "integrity": "sha1-1LUFvemUaYfM8PxY2QEP+WB+P6A="
+        },
         "path-to-regexp": {
           "version": "0.1.7",
           "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
           "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
         },
-        "qs": {
-          "version": "6.5.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-6.5.0.tgz",
-          "integrity": "sha512-fjVFjW9yhqMhVGwRExCXLhJKrLlkYSaxNWdyc9rmHlrVZbk35YHH312dFd7191uQeXkI3mKLZTIbSvIeFwFemg=="
+        "proxy-addr": {
+          "version": "2.0.2",
+          "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.2.tgz",
+          "integrity": "sha1-ZXFQT0e7mI7IGAJT+F3X4UlSvew="
         },
-        "utils-merge": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.0.tgz",
-          "integrity": "sha1-ApT7kiu5N1FTVBxPcJYjHyh8ivg="
+        "setprototypeof": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.0.tgz",
+          "integrity": "sha512-BvE/TwpZX4FXExxOxZyRGQQv651MSwmWKZGqvmPcRIjDqWub67kTKuIMx43cZZrS/cBBzwBcNDWoFxt2XEFIpQ=="
         }
       }
     },
@@ -5265,6 +5280,549 @@
       "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
       "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
     },
+    "fsevents": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.2.tgz",
+      "integrity": "sha512-Sn44E5wQW4bTHXvQmvSHwqbuiXtduD6Rrjm2ZtUEGbyrig+nUH3t/QD4M4/ZXViY556TBpRgZkHLDx3JxPwxiw==",
+      "optional": true,
+      "dependencies": {
+        "abbrev": {
+          "version": "1.1.0",
+          "bundled": true,
+          "optional": true
+        },
+        "ajv": {
+          "version": "4.11.8",
+          "bundled": true,
+          "optional": true
+        },
+        "ansi-regex": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "aproba": {
+          "version": "1.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "are-we-there-yet": {
+          "version": "1.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "asn1": {
+          "version": "0.2.3",
+          "bundled": true,
+          "optional": true
+        },
+        "assert-plus": {
+          "version": "0.2.0",
+          "bundled": true,
+          "optional": true
+        },
+        "asynckit": {
+          "version": "0.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "aws-sign2": {
+          "version": "0.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "aws4": {
+          "version": "1.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "balanced-match": {
+          "version": "0.4.2",
+          "bundled": true
+        },
+        "bcrypt-pbkdf": {
+          "version": "1.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "block-stream": {
+          "version": "0.0.9",
+          "bundled": true
+        },
+        "boom": {
+          "version": "2.10.1",
+          "bundled": true
+        },
+        "brace-expansion": {
+          "version": "1.1.7",
+          "bundled": true
+        },
+        "buffer-shims": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "caseless": {
+          "version": "0.12.0",
+          "bundled": true,
+          "optional": true
+        },
+        "co": {
+          "version": "4.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "code-point-at": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "combined-stream": {
+          "version": "1.0.5",
+          "bundled": true
+        },
+        "concat-map": {
+          "version": "0.0.1",
+          "bundled": true
+        },
+        "console-control-strings": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "core-util-is": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "cryptiles": {
+          "version": "2.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "dashdash": {
+          "version": "1.14.1",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "debug": {
+          "version": "2.6.8",
+          "bundled": true,
+          "optional": true
+        },
+        "deep-extend": {
+          "version": "0.4.2",
+          "bundled": true,
+          "optional": true
+        },
+        "delayed-stream": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "delegates": {
+          "version": "1.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "ecc-jsbn": {
+          "version": "0.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "extend": {
+          "version": "3.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "extsprintf": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "forever-agent": {
+          "version": "0.6.1",
+          "bundled": true,
+          "optional": true
+        },
+        "form-data": {
+          "version": "2.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "fs.realpath": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "fstream": {
+          "version": "1.0.11",
+          "bundled": true
+        },
+        "fstream-ignore": {
+          "version": "1.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "gauge": {
+          "version": "2.7.4",
+          "bundled": true,
+          "optional": true
+        },
+        "getpass": {
+          "version": "0.1.7",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "glob": {
+          "version": "7.1.2",
+          "bundled": true
+        },
+        "graceful-fs": {
+          "version": "4.1.11",
+          "bundled": true
+        },
+        "har-schema": {
+          "version": "1.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "har-validator": {
+          "version": "4.2.1",
+          "bundled": true,
+          "optional": true
+        },
+        "has-unicode": {
+          "version": "2.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "hawk": {
+          "version": "3.1.3",
+          "bundled": true,
+          "optional": true
+        },
+        "hoek": {
+          "version": "2.16.3",
+          "bundled": true
+        },
+        "http-signature": {
+          "version": "1.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "inflight": {
+          "version": "1.0.6",
+          "bundled": true
+        },
+        "inherits": {
+          "version": "2.0.3",
+          "bundled": true
+        },
+        "ini": {
+          "version": "1.3.4",
+          "bundled": true,
+          "optional": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "is-typedarray": {
+          "version": "1.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "isstream": {
+          "version": "0.1.2",
+          "bundled": true,
+          "optional": true
+        },
+        "jodid25519": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "jsbn": {
+          "version": "0.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "json-schema": {
+          "version": "0.2.3",
+          "bundled": true,
+          "optional": true
+        },
+        "json-stable-stringify": {
+          "version": "1.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "json-stringify-safe": {
+          "version": "5.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "jsonify": {
+          "version": "0.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "jsprim": {
+          "version": "1.4.0",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "mime-db": {
+          "version": "1.27.0",
+          "bundled": true
+        },
+        "mime-types": {
+          "version": "2.1.15",
+          "bundled": true
+        },
+        "minimatch": {
+          "version": "3.0.4",
+          "bundled": true
+        },
+        "minimist": {
+          "version": "0.0.8",
+          "bundled": true
+        },
+        "mkdirp": {
+          "version": "0.5.1",
+          "bundled": true
+        },
+        "ms": {
+          "version": "2.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "node-pre-gyp": {
+          "version": "0.6.36",
+          "bundled": true,
+          "optional": true
+        },
+        "nopt": {
+          "version": "4.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "npmlog": {
+          "version": "4.1.0",
+          "bundled": true,
+          "optional": true
+        },
+        "number-is-nan": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "oauth-sign": {
+          "version": "0.8.2",
+          "bundled": true,
+          "optional": true
+        },
+        "object-assign": {
+          "version": "4.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "once": {
+          "version": "1.4.0",
+          "bundled": true
+        },
+        "os-homedir": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "os-tmpdir": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "osenv": {
+          "version": "0.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "path-is-absolute": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "performance-now": {
+          "version": "0.2.0",
+          "bundled": true,
+          "optional": true
+        },
+        "process-nextick-args": {
+          "version": "1.0.7",
+          "bundled": true
+        },
+        "punycode": {
+          "version": "1.4.1",
+          "bundled": true,
+          "optional": true
+        },
+        "qs": {
+          "version": "6.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "rc": {
+          "version": "1.2.1",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "minimist": {
+              "version": "1.2.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "bundled": true
+        },
+        "request": {
+          "version": "2.81.0",
+          "bundled": true,
+          "optional": true
+        },
+        "rimraf": {
+          "version": "2.6.1",
+          "bundled": true
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "bundled": true
+        },
+        "semver": {
+          "version": "5.3.0",
+          "bundled": true,
+          "optional": true
+        },
+        "set-blocking": {
+          "version": "2.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "signal-exit": {
+          "version": "3.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "sntp": {
+          "version": "1.0.9",
+          "bundled": true,
+          "optional": true
+        },
+        "sshpk": {
+          "version": "1.13.0",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "string_decoder": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "string-width": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "stringstream": {
+          "version": "0.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "strip-ansi": {
+          "version": "3.0.1",
+          "bundled": true
+        },
+        "strip-json-comments": {
+          "version": "2.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "tar": {
+          "version": "2.2.1",
+          "bundled": true
+        },
+        "tar-pack": {
+          "version": "3.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "tough-cookie": {
+          "version": "2.3.2",
+          "bundled": true,
+          "optional": true
+        },
+        "tunnel-agent": {
+          "version": "0.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "tweetnacl": {
+          "version": "0.14.5",
+          "bundled": true,
+          "optional": true
+        },
+        "uid-number": {
+          "version": "0.0.6",
+          "bundled": true,
+          "optional": true
+        },
+        "util-deprecate": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "uuid": {
+          "version": "3.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "verror": {
+          "version": "1.3.6",
+          "bundled": true,
+          "optional": true
+        },
+        "wide-align": {
+          "version": "1.1.2",
+          "bundled": true,
+          "optional": true
+        },
+        "wrappy": {
+          "version": "1.0.2",
+          "bundled": true
+        }
+      }
+    },
     "fstream": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
@@ -5806,16 +6364,9 @@
       "integrity": "sha1-hVG45bTVcyROZqNLBPfTIHaitTQ="
     },
     "internal-ip": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/internal-ip/-/internal-ip-2.0.3.tgz",
-      "integrity": "sha512-XxJMiJOjXbb9LlwH6SVTsnUPymYACunXzKg3dqU+HIC+xYIkUhMyTiT/H6xxPmhlE4zHq50lKlx0CZlyN2C76Q==",
-      "dependencies": {
-        "ipaddr.js": {
-          "version": "1.5.2",
-          "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.5.2.tgz",
-          "integrity": "sha1-1LUFvemUaYfM8PxY2QEP+WB+P6A="
-        }
-      }
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/internal-ip/-/internal-ip-1.2.0.tgz",
+      "integrity": "sha1-rp+/k7mEh4eF1QqN4bNWlWBYz1w="
     },
     "interpret": {
       "version": "1.0.4",
@@ -5837,11 +6388,6 @@
       "resolved": "https://registry.npmjs.org/ip/-/ip-1.1.5.tgz",
       "integrity": "sha1-vd7XARQpCCjAoDnnLvJfWq7ENUo="
     },
-    "ip-regex": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/ip-regex/-/ip-regex-2.1.0.tgz",
-      "integrity": "sha1-+ni/XS5pE8kRzp+BnuUUa7bYROk="
-    },
     "ipaddr.js": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.4.0.tgz",
@@ -6226,9 +6772,9 @@
       "integrity": "sha1-i9FtnIOxlSneWuoyGsqtp4NkoZg="
     },
     "jest": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/jest/-/jest-21.1.0.tgz",
-      "integrity": "sha512-yPxhkAyxCymLkpZakAGm8VGNQB04HgD5bhYCQHBcIGCbH5oYHZDekkt/FBtFC2vPcyWG+dsKCqvmys/1kQYjKA==",
+      "version": "21.2.1",
+      "resolved": "https://registry.npmjs.org/jest/-/jest-21.2.1.tgz",
+      "integrity": "sha512-mXN0ppPvWYoIcC+R+ctKxAJ28xkt/Z5Js875padm4GbgUn6baeR5N4Ng6LjatIRpUQDZVJABT7Y4gucFjPryfw==",
       "dependencies": {
         "ansi-regex": {
           "version": "3.0.0",
@@ -6288,9 +6834,9 @@
           "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
         },
         "jest-cli": {
-          "version": "21.1.0",
-          "resolved": "https://registry.npmjs.org/jest-cli/-/jest-cli-21.1.0.tgz",
-          "integrity": "sha512-ISnDjHv9m0nCrSKFC+Cnr9SotaWHYRP+TK81vMtPwkV+/70JbfYJT6ZnuqgqyAnTYE4f/aCe6uyMPKHAVT1RpA=="
+          "version": "21.2.1",
+          "resolved": "https://registry.npmjs.org/jest-cli/-/jest-cli-21.2.1.tgz",
+          "integrity": "sha512-T1BzrbFxDIW/LLYQqVfo94y/hhaj1NzVQkZgBumAC+sxbjMROI7VkihOdxNR758iYbQykL2ZOWUBurFgkQrzdg=="
         },
         "kind-of": {
           "version": "3.2.2",
@@ -6354,44 +6900,44 @@
       }
     },
     "jest-changed-files": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/jest-changed-files/-/jest-changed-files-21.1.0.tgz",
-      "integrity": "sha512-OnjMoORBVG9Jko6Bc3UGJPx9G1PNsETiqpQXZ6wPU3fk1gtxhKYE4Mgdk28ER/CWeg7bzGUcaragLf1lf1tzbQ=="
+      "version": "21.2.0",
+      "resolved": "https://registry.npmjs.org/jest-changed-files/-/jest-changed-files-21.2.0.tgz",
+      "integrity": "sha512-+lCNP1IZLwN1NOIvBcV5zEL6GENK6TXrDj4UxWIeLvIsIDa+gf6J7hkqsW2qVVt/wvH65rVvcPwqXdps5eclTQ=="
     },
     "jest-config": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/jest-config/-/jest-config-21.1.0.tgz",
-      "integrity": "sha512-RQnWwHRSIRvtyJQeZTpXUmsNYVVr/qu3XWfV3FTFkDsxHQi6Sj5sfUK5FHCNUCXIuFTs+r3qbYoMz2q8rdm/EA=="
+      "version": "21.2.1",
+      "resolved": "https://registry.npmjs.org/jest-config/-/jest-config-21.2.1.tgz",
+      "integrity": "sha512-fJru5HtlD/5l2o25eY9xT0doK3t2dlglrqoGpbktduyoI0T5CwuB++2YfoNZCrgZipTwPuAGonYv0q7+8yDc/A=="
     },
     "jest-diff": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/jest-diff/-/jest-diff-21.1.0.tgz",
-      "integrity": "sha512-mGJinKrAB6hj1cpO1FOuDCfgILozGvYi4Zpk8GrxmNgdd9/9llIA2Xzu5879Fa4ayh7lb9ej2NdvuNLMCjbrMg=="
+      "version": "21.2.1",
+      "resolved": "https://registry.npmjs.org/jest-diff/-/jest-diff-21.2.1.tgz",
+      "integrity": "sha512-E5fu6r7PvvPr5qAWE1RaUwIh/k6Zx/3OOkZ4rk5dBJkEWRrUuSgbMt2EO8IUTPTd6DOqU3LW6uTIwX5FRvXoFA=="
     },
     "jest-docblock": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/jest-docblock/-/jest-docblock-21.1.0.tgz",
-      "integrity": "sha512-ai3olFJ/3cSd60klaRIcC/Cb44/RsJ69qS8uXxfWXEbnbDqjcbl5K8Z5ekfY15hgVZGSAiLz7pOwfjIBE/yJVw=="
+      "version": "21.2.0",
+      "resolved": "https://registry.npmjs.org/jest-docblock/-/jest-docblock-21.2.0.tgz",
+      "integrity": "sha512-5IZ7sY9dBAYSV+YjQ0Ovb540Ku7AO9Z5o2Cg789xj167iQuZ2cG+z0f3Uct6WeYLbU6aQiM2pCs7sZ+4dotydw=="
     },
     "jest-environment-jsdom": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/jest-environment-jsdom/-/jest-environment-jsdom-21.1.0.tgz",
-      "integrity": "sha512-sMcGlN11SnnuJKzR5oJ5LsDRzHEBLUeMRImDbvxyusNW9l17wAEsoLuAWbv0W8crZTTwjRO6/mitpNF3PmVsMg=="
+      "version": "21.2.1",
+      "resolved": "https://registry.npmjs.org/jest-environment-jsdom/-/jest-environment-jsdom-21.2.1.tgz",
+      "integrity": "sha512-mecaeNh0eWmzNrUNMWARysc0E9R96UPBamNiOCYL28k7mksb1d0q6DD38WKP7ABffjnXyUWJPVaWRgUOivwXwg=="
     },
     "jest-environment-node": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/jest-environment-node/-/jest-environment-node-21.1.0.tgz",
-      "integrity": "sha512-Lv/pcK2zq2DZKL/q7+u8mrlSeXmaMGgmJOx0+Ew+FxYKdSzO0jpEUTEfzQOnMvpSWMqjKUYLDYkCPCBFcOX93w=="
+      "version": "21.2.1",
+      "resolved": "https://registry.npmjs.org/jest-environment-node/-/jest-environment-node-21.2.1.tgz",
+      "integrity": "sha512-R211867wx9mVBVHzrjGRGTy5cd05K7eqzQl/WyZixR/VkJ4FayS8qkKXZyYnwZi6Rxo6WEV81cDbiUx/GfuLNw=="
     },
     "jest-get-type": {
-      "version": "21.0.2",
-      "resolved": "https://registry.npmjs.org/jest-get-type/-/jest-get-type-21.0.2.tgz",
-      "integrity": "sha512-4KvNzzXMXeapGaMWd+SL5e47zcMn8KTWjom6Fl3avxVXnbKS7abD1p4xWe4ToAZfgNoYNsQ9Av/mnWMnZK/Z4A=="
+      "version": "21.2.0",
+      "resolved": "https://registry.npmjs.org/jest-get-type/-/jest-get-type-21.2.0.tgz",
+      "integrity": "sha512-y2fFw3C+D0yjNSDp7ab1kcd6NUYfy3waPTlD8yWkAtiocJdBRQqNoRqVfMNxgj+IjT0V5cBIHJO0z9vuSSZ43Q=="
     },
     "jest-haste-map": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/jest-haste-map/-/jest-haste-map-21.1.0.tgz",
-      "integrity": "sha512-a7chVtmpzRgRkYDL4eZgRuXZUlos1JOC7Dam3WryXGiD/1GNj+QONt6jcsAzDZohzs9XYg2EkjyGxIAXcNipBg==",
+      "version": "21.2.0",
+      "resolved": "https://registry.npmjs.org/jest-haste-map/-/jest-haste-map-21.2.0.tgz",
+      "integrity": "sha512-5LhsY/loPH7wwOFRMs+PT4aIAORJ2qwgbpMFlbWbxfN0bk3ZCwxJ530vrbSiTstMkYLao6JwBkLhCJ5XbY7ZHw==",
       "dependencies": {
         "arr-diff": {
           "version": "2.0.0",
@@ -6431,19 +6977,19 @@
       }
     },
     "jest-jasmine2": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/jest-jasmine2/-/jest-jasmine2-21.1.0.tgz",
-      "integrity": "sha512-YjbAaXN6K5f8rtwPVxkMRIYNZGB5GiJcApcj/5ER7uGJrqJMqyCklMAPZR5Gq8XPzzuDVfoB2h7kxyOGVqaxrw=="
+      "version": "21.2.1",
+      "resolved": "https://registry.npmjs.org/jest-jasmine2/-/jest-jasmine2-21.2.1.tgz",
+      "integrity": "sha512-lw8FXXIEekD+jYNlStfgNsUHpfMWhWWCgHV7n0B7mA/vendH7vBFs8xybjQsDzJSduptBZJHqQX9SMssya9+3A=="
     },
     "jest-matcher-utils": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-21.1.0.tgz",
-      "integrity": "sha512-V/Xindf+VY5UM+oz9Nhsv0Ql93lRcKS7tHtVoXtlXkZXoXpydHwuezkLLCpZkH/Uew5y2OyDZpnlxPvEalJZng=="
+      "version": "21.2.1",
+      "resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-21.2.1.tgz",
+      "integrity": "sha512-kn56My+sekD43dwQPrXBl9Zn9tAqwoy25xxe7/iY4u+mG8P3ALj5IK7MLHZ4Mi3xW7uWVCjGY8cm4PqgbsqMCg=="
     },
     "jest-message-util": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/jest-message-util/-/jest-message-util-21.1.0.tgz",
-      "integrity": "sha512-BwKrjR4HvGoodYw3PFh95IU4qDk3nVOf3LqOKRaaR6486bJM8IZIlxWR8yfxhAN7nDGBDco/TR+U50WcPgzvgA==",
+      "version": "21.2.1",
+      "resolved": "https://registry.npmjs.org/jest-message-util/-/jest-message-util-21.2.1.tgz",
+      "integrity": "sha512-EbC1X2n0t9IdeMECJn2BOg7buOGivCvVNjqKMXTzQOu7uIfLml+keUfCALDh8o4rbtndIeyGU8/BKfoTr/LVDQ==",
       "dependencies": {
         "arr-diff": {
           "version": "2.0.0",
@@ -6483,34 +7029,34 @@
       }
     },
     "jest-mock": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/jest-mock/-/jest-mock-21.1.0.tgz",
-      "integrity": "sha512-iwING4rMP1rhepAj/MVPHVxGltwwR+Lfmiy9ARevQ7XDZ/zF7h+KPFeOFMSMGvV5/dS05PHhwRjFzrjvkybNLw=="
+      "version": "21.2.0",
+      "resolved": "https://registry.npmjs.org/jest-mock/-/jest-mock-21.2.0.tgz",
+      "integrity": "sha512-aZDfyVf0LEoABWiY6N0d+O963dUQSyUa4qgzurHR3TBDPen0YxKCJ6l2i7lQGh1tVdsuvdrCZ4qPj+A7PievCw=="
     },
     "jest-regex-util": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-21.1.0.tgz",
-      "integrity": "sha512-1QiJa6nvdzVgDhY1FTG3fl+2eYrCQGQoIeGaVPjt9+VmxsQ/BwZD6aglH0z6ZK/uEXZPAaj1XaemKM9tC6VVlQ=="
+      "version": "21.2.0",
+      "resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-21.2.0.tgz",
+      "integrity": "sha512-BKQ1F83EQy0d9Jen/mcVX7D+lUt2tthhK/2gDWRgLDJRNOdRgSp1iVqFxP8EN1ARuypvDflRfPzYT8fQnoBQFQ=="
     },
     "jest-resolve": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/jest-resolve/-/jest-resolve-21.1.0.tgz",
-      "integrity": "sha512-HKh0pnf2SwR3hDaToONjHrR9ds282QFkxCA9xMet3JpsdLL24oRYMLSQ7jtepZfA6EP+XycRE6RfcMBD8emetg=="
+      "version": "21.2.0",
+      "resolved": "https://registry.npmjs.org/jest-resolve/-/jest-resolve-21.2.0.tgz",
+      "integrity": "sha512-vefQ/Lr+VdNvHUZFQXWtOqHX3HEdOc2MtSahBO89qXywEbUxGPB9ZLP9+BHinkxb60UT2Q/tTDOS6rYc6Mwigw=="
     },
     "jest-resolve-dependencies": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/jest-resolve-dependencies/-/jest-resolve-dependencies-21.1.0.tgz",
-      "integrity": "sha512-Xj0mzS+Gh6ERgf9ofr5/vuqtyvTh4pAp4aVe6OkiZ4cLxUl6zQ6wByXMX0CLq0hwojFYmwwt+v3+fOAV7PqHPg=="
+      "version": "21.2.0",
+      "resolved": "https://registry.npmjs.org/jest-resolve-dependencies/-/jest-resolve-dependencies-21.2.0.tgz",
+      "integrity": "sha512-ok8ybRFU5ScaAcfufIQrCbdNJSRZ85mkxJ1EhUp8Bhav1W1/jv/rl1Q6QoVQHObNxmKnbHVKrfLZbCbOsXQ+bQ=="
     },
     "jest-runner": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/jest-runner/-/jest-runner-21.1.0.tgz",
-      "integrity": "sha512-EXFqEQRHSo6ksBrT+vRNoBRfIVVepQF56JfTczzXLs+dIKcq3DDKaiMkkehBc2LdHzm/e63qbhz2aeQn64qqlA=="
+      "version": "21.2.1",
+      "resolved": "https://registry.npmjs.org/jest-runner/-/jest-runner-21.2.1.tgz",
+      "integrity": "sha512-Anb72BOQlHqF/zETqZ2K20dbYsnqW/nZO7jV8BYENl+3c44JhMrA8zd1lt52+N7ErnsQMd2HHKiVwN9GYSXmrg=="
     },
     "jest-runtime": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/jest-runtime/-/jest-runtime-21.1.0.tgz",
-      "integrity": "sha512-BNc1v8Cs6bjnti1JBCSGIJdSI/6MIGMMCiY+MpoyWXhoZGNLkUKGw7073lZtOo0PC/RZcXMDy1DcZXHH7YHKQw==",
+      "version": "21.2.1",
+      "resolved": "https://registry.npmjs.org/jest-runtime/-/jest-runtime-21.2.1.tgz",
+      "integrity": "sha512-6omlpA3+NSE+rHwD0PQjNEjZeb2z+oRmuehMfM1tWQVum+E0WV3pFt26Am0DUfQkkPyTABvxITRjCUclYgSOsA==",
       "dependencies": {
         "arr-diff": {
           "version": "2.0.0",
@@ -6602,19 +7148,19 @@
       }
     },
     "jest-snapshot": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/jest-snapshot/-/jest-snapshot-21.1.0.tgz",
-      "integrity": "sha512-oYASKqxO/Ghbdd96z/3KSQ1y4YUtqrQVzSKbnz3yjGsi1nu3AXMPmjRCM/CZXL+H+DAIgMirj5Uq0dZOxo6Bnw=="
+      "version": "21.2.1",
+      "resolved": "https://registry.npmjs.org/jest-snapshot/-/jest-snapshot-21.2.1.tgz",
+      "integrity": "sha512-bpaeBnDpdqaRTzN8tWg0DqOTo2DvD3StOemxn67CUd1p1Po+BUpvePAp44jdJ7Pxcjfg+42o4NHw1SxdCA2rvg=="
     },
     "jest-util": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-21.1.0.tgz",
-      "integrity": "sha512-PJxaShBieLpB55NV4+loIZHiOlfZHjAGzVRp9BDzrr2m70UxQViDJenNdz4edJMWXJLjp817t1QrWi+LjcRaKw=="
+      "version": "21.2.1",
+      "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-21.2.1.tgz",
+      "integrity": "sha512-r20W91rmHY3fnCoO7aOAlyfC51x2yeV3xF+prGsJAUsYhKeV670ZB8NO88Lwm7ASu8SdH0S+U+eFf498kjhA4g=="
     },
     "jest-validate": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/jest-validate/-/jest-validate-21.1.0.tgz",
-      "integrity": "sha512-xS0cyErNWpsLFlGkn/b87pk/Mv7J+mCTs8hQ4KmtOIIoM1sHYobXII8AtkoN8FC7E3+Ptxjo+/3xWk6LK1dKcw=="
+      "version": "21.2.1",
+      "resolved": "https://registry.npmjs.org/jest-validate/-/jest-validate-21.2.1.tgz",
+      "integrity": "sha512-k4HLI1rZQjlU+EC682RlQ6oZvLrE5SCh3brseQc24vbZTxzT/k/3urar5QMCVgjadmSO7lECeGdc6YxnM3yEGg=="
     },
     "joi": {
       "version": "9.2.0",
@@ -7321,9 +7867,9 @@
       "integrity": "sha512-3StSelAE+hnRvMs8IdVW7Uhk8CVed5tp+kLLGlBP6WiRAXS21GPGu/Nat4WNPXj2Eoc24B02SaeoyozPMfj0/g=="
     },
     "miller-rabin": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/miller-rabin/-/miller-rabin-4.0.0.tgz",
-      "integrity": "sha1-SmL7HUKTPAVYOYL0xxb2+55sbT0="
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/miller-rabin/-/miller-rabin-4.0.1.tgz",
+      "integrity": "sha512-115fLhvZVqWwHPbClyntxEVfVDfl9DLLTuJvq3g2O/Oxi8AiNouAHvDSzHS0viUJc+V5vm3eq91Xwqn9dp4jRA=="
     },
     "mime": {
       "version": "1.4.1",
@@ -7757,9 +8303,9 @@
       "integrity": "sha1-43rwTiOwkfZTYNsknbi7DzEpH2A="
     },
     "office-ui-fabric-react": {
-      "version": "4.50.2",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-4.50.2.tgz",
-      "integrity": "sha512-UIRtfmFsE/8UxvhI43mKuMKcLFFl7AM8Bl1qPRYw0XYjDEQqRc3hRH/vGrBZ0PXcqEG3w9I+ceYG88RNNvynrw=="
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.1.0.tgz",
+      "integrity": "sha512-NRo9fdvycty3dWs0HRkc7JKEaDcv2A0ejvXDAvFktLBJ8oxFvSgT4HybPFQ4NsxkOBogvsVGnNIl9lm2TMzk2w=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -9199,9 +9745,9 @@
       "integrity": "sha1-gV7R9uvGWSb4ZbMQwHE7yzMVzks="
     },
     "pretty-format": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-21.1.0.tgz",
-      "integrity": "sha512-041BVxr2pp7uGG8slfw43ysRXSaBIVqo5Li03BwI3K1/9oENlhkEEYWPkHpDzj7NlJ3GZte+Tv/DId5g2PLduA==",
+      "version": "21.2.1",
+      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-21.2.1.tgz",
+      "integrity": "sha512-ZdWPGYAnYfcVP8yKA3zFjCn8s4/17TeYH28MXuC8vTp0o21eXjbFGcOAXZEaDaOFJjc3h2qa7HQNHNshhvoh2A==",
       "dependencies": {
         "ansi-regex": {
           "version": "3.0.0",
@@ -9436,9 +9982,9 @@
       "integrity": "sha512-m+urZGPk+RfUrGj0b8uraZ2dQQo/AABZ+s6aZeZxEpbhMwWZ4WhVr03iYbWTvSatSnC+5x9c2k6qm95N1ybohg=="
     },
     "react-remarkable": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/react-remarkable/-/react-remarkable-1.1.1.tgz",
-      "integrity": "sha1-N5CKyViUV20NORh70om8LLtaxt4="
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/react-remarkable/-/react-remarkable-1.1.2.tgz",
+      "integrity": "sha512-Sx8qreEu1jYJaVLtAbTZKHMxvJdzUJxSjbSHero961pO+FsXUENTFo23ieVHvPob74WH6/LR/6QSZTrUBghUWA=="
     },
     "react-simple-di": {
       "version": "1.2.0",
@@ -9643,9 +10189,9 @@
       "integrity": "sha1-UhTFOpJtNVJwdSf7q0FdvAjQbdo="
     },
     "request": {
-      "version": "2.82.0",
-      "resolved": "https://registry.npmjs.org/request/-/request-2.82.0.tgz",
-      "integrity": "sha512-/QWqfmyTfQ4OYs6EhB1h2wQsX9ZxbuNePCvCm0Mdz/mxw73mjdg0D4QdIl0TQBFs35CZmMXLjk0iCGK395CUDg=="
+      "version": "2.83.0",
+      "resolved": "https://registry.npmjs.org/request/-/request-2.83.0.tgz",
+      "integrity": "sha512-lR3gD69osqm6EYLk9wB/G1W/laGWjzH90t1vEa2xuxHD5KUrSzp9pUSfTm+YC5Nxt2T8nMPEvKlhbQayU7bgFw=="
     },
     "request-progress": {
       "version": "2.0.1",
@@ -9712,11 +10258,6 @@
       "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz",
       "integrity": "sha1-D0WEKVxTo2KK9+bXmsohzlfRxuc="
     },
-    "rtl-css-js": {
-      "version": "1.4.3",
-      "resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.4.3.tgz",
-      "integrity": "sha512-m8FfSBESumTy3z02xPghMMvtOEgXfZTSSX80VRAktiZUOkCVjPe4qN2aFtMo8GV4L1CUHWXc0Ib6D7b5Na9MNQ=="
-    },
     "safe-buffer": {
       "version": "5.1.1",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.1.tgz",
@@ -10216,16 +10757,9 @@
       "integrity": "sha1-d0Zt5YnNXTyV8TiqeLxWmjy10no="
     },
     "send": {
-      "version": "0.15.6",
-      "resolved": "https://registry.npmjs.org/send/-/send-0.15.6.tgz",
-      "integrity": "sha1-IPI6nJJbdiq4JwX+L52yUqzkfjQ=",
-      "dependencies": {
-        "mime": {
-          "version": "1.3.4",
-          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz",
-          "integrity": "sha1-EV+eO2s9rylZmDyzjxSaLUDrXVM="
-        }
-      }
+      "version": "0.16.0",
+      "resolved": "https://registry.npmjs.org/send/-/send-0.16.0.tgz",
+      "integrity": "sha1-FjONu5ou3krVe0hCDsO4LY6ApXs="
     },
     "serve-favicon": {
       "version": "2.4.5",
@@ -10245,9 +10779,9 @@
       }
     },
     "serve-static": {
-      "version": "1.12.6",
-      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.12.6.tgz",
-      "integrity": "sha1-uXN3P2NEmTTaVOW+ul4x2fQhFXc="
+      "version": "1.13.0",
+      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.13.0.tgz",
+      "integrity": "sha1-gQyR24AOlLoofq5rTgbKq5/cFvE="
     },
     "set-blocking": {
       "version": "2.0.0",
@@ -10356,9 +10890,9 @@
       }
     },
     "sinon-chai": {
-      "version": "2.13.0",
-      "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.13.0.tgz",
-      "integrity": "sha512-hRNu/TlYEp4Rw5IbzO8ykGoZMSG489PGUx1rvePpHGrtl20cXivRBgtr/EWYxIwL9EOO9+on04nd9k3tW8tVww=="
+      "version": "2.14.0",
+      "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.14.0.tgz",
+      "integrity": "sha512-9stIF1utB0ywNHNT7RgiXbdmen8QDCRsrTjw+G9TgKt1Yexjiv8TOWZ6WHsTPz57Yky3DIswZvEqX8fpuHNDtQ=="
     },
     "slash": {
       "version": "1.0.0",
@@ -11105,9 +11639,9 @@
       "integrity": "sha1-hR+1BSAcY9A0PFFybmNk9+mtLpk="
     },
     "tsutils": {
-      "version": "2.8.2",
-      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.8.2.tgz",
-      "integrity": "sha1-LBSGukMSYIRbCsb5Aq/Z1wio6mo="
+      "version": "2.10.0",
+      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.10.0.tgz",
+      "integrity": "sha1-rpRRHfJlbrBuRCQFb7pcOIiHBAw="
     },
     "tty-browserify": {
       "version": "0.0.0",
@@ -11562,9 +12096,9 @@
       "integrity": "sha1-007++y7dp+HTtdvgcolRMhllFwk="
     },
     "webpack-dev-server": {
-      "version": "2.8.2",
-      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.8.2.tgz",
-      "integrity": "sha512-wD9bs+Z1uwvf3Jc+8ZkyMI0Xi+aJJYjC2UZplOWoo/vStelK5Mv62X2uXYEYIQEjy9wJQMzC0fEFqQsg7vVEIg=="
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.9.1.tgz",
+      "integrity": "sha512-qFKs4Wg6JI6FkAQ6WFqeDCCxXEBLsDHkqJB3f9tmlqx8C68Y9vQWwcaMT4Q9H8WF32Q6QUNmgK4qQkdHfXvj/g=="
     },
     "webpack-hot-middleware": {
       "version": "2.19.1",
@@ -11843,4 +12377,4 @@
       "integrity": "sha1-AI4G2AlDIMNy28L47XagymyKxBk="
     }
   }
-}
\ No newline at end of file
+}
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 3f8bce58384cd..f1b9a5d36f7a6 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -41,7 +41,7 @@
     "@uifabric/styling": ">=5.0.1 <6.0.0",
     "@uifabric/utilities": ">=5.0.1 <6.0.0",
     "highlight.js": "^9.9.0",
-    "office-ui-fabric-react": ">=4.39.0 <5.0.0",
+    "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file

From f334c6315543cfd7a03e7a521ffda35761dd5260 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Thu, 28 Sep 2017 20:50:07 -0700
Subject: [PATCH 0748/1641] Fifth pass removing lambda expressions from jsx in
 Fabric (#2829)

* Fifth pass removing lambda expressions from jsx in Fabric

* Refactor show/hide panel, remove white space

* Revert functions back to lambdas, use resolveRef where needed

* Add autobind, revert to lambdas

* Fix syntax error
---
 .../Overlay/examples/Overlay.Dark.Example.tsx | 15 ++++++-
 .../src/components/Panel/Panel.test.tsx       | 11 ++++-
 .../examples/Panel.ExtraLarge.Example.tsx     |  4 +-
 .../Panel/examples/Panel.Footer.Example.tsx   | 38 +++++++++-------
 .../Panel/examples/Panel.Large.Example.tsx    |  5 ++-
 .../examples/Panel.LightDismiss.Example.tsx   | 15 ++++++-
 .../Panel/examples/Panel.Medium.Example.tsx   | 12 ++++-
 .../Panel/examples/Panel.NonModal.Example.tsx | 12 ++++-
 .../examples/Panel.SmallFluid.Example.tsx     |  3 +-
 .../examples/Panel.SmallLeft.Example.tsx      |  2 +
 .../examples/Panel.SmallRight.Example.tsx     | 44 +++++++++++--------
 .../examples/Persona.Basic.Example.tsx        |  8 +++-
 .../pickers/AutoFill/BaseAutoFill.test.tsx    | 38 +++++++---------
 .../components/pickers/BasePicker.test.tsx    | 26 +++++++----
 .../examples/PeoplePicker.Types.Example.tsx   | 32 ++++++++------
 .../examples/Picker.CustomResult.Example.tsx  | 10 ++++-
 .../examples/TagPicker.Basic.Example.tsx      |  6 ++-
 17 files changed, 183 insertions(+), 98 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Dark.Example.tsx b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Dark.Example.tsx
index 06eeea415f5a3..63475f9cbf173 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Dark.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Dark.Example.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Overlay } from 'office-ui-fabric-react/lib/Overlay';
 
@@ -17,13 +18,13 @@ export class OverlayDarkExample extends React.Component<any, any> {
     return (
       <div>
         <DefaultButton
-          onClick={ () => this.setState({ isOverlayVisible: !isOverlayVisible }) }
+          onClick={ this._toggleOverlay }
           text='Show the overlay'
         />
         { isOverlayVisible && (
           <Overlay
             isDarkThemed={ true }
-            onClick={ () => this.setState({ isOverlayVisible: false }) }
+            onClick={ this._setVisibilityFalse }
           >
             <div className='OverlayExample-content'>
               <p>I am content within the overlay.</p>
@@ -33,4 +34,14 @@ export class OverlayDarkExample extends React.Component<any, any> {
       </div>
     );
   }
+
+  @autobind
+  private _setVisibilityFalse(): void {
+    this.setState({ isOverlayVisible: false });
+  }
+
+  @autobind
+  private _toggleOverlay(): void {
+    this.setState({ isOverlayVisible: !this.state.isOverlayVisible });
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.test.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.test.tsx
index 7ae9e1c64b9f0..c940a2a5a50a8 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.test.tsx
@@ -22,11 +22,18 @@ describe('Panel', () => {
   it('fires the correct events when closing', (done) => {
     let dismissedCalled = false;
     let dismissCalled = false;
+    const setDismissTrue = (): void => {
+      dismissCalled = true;
+    };
+    const setDismissedTrue = (): void => {
+      dismissedCalled = true;
+    };
+
     let panel: Panel = ReactDOM.render(
       <Panel
         isOpen={ true }
-        onDismiss={ () => { dismissCalled = true; } }
-        onDismissed={ () => dismissedCalled = true }
+        onDismiss={ setDismissTrue }
+        onDismissed={ setDismissedTrue }
       />,
       div) as any;
 
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.ExtraLarge.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.ExtraLarge.Example.tsx
index 705fcadcfa4f5..40ac125ecc0c8 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.ExtraLarge.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.ExtraLarge.Example.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
@@ -14,11 +15,13 @@ export class PanelExtraLargeExample extends React.Component<any, any> {
       <div>
         <DefaultButton
           description='Opens the Sample Panel'
+          // tslint:disable-next-line:jsx-no-lambda
           onClick={ () => this.setState({ showPanel: true }) }
           text='Open Panel'
         />
         <Panel
           isOpen={ this.state.showPanel }
+          // tslint:disable-next-line:jsx-no-lambda
           onDismiss={ () => this.setState({ showPanel: false }) }
           type={ PanelType.extraLarge }
           headerText='Extra Large Panel'
@@ -29,5 +32,4 @@ export class PanelExtraLargeExample extends React.Component<any, any> {
       </div>
     );
   }
-
 }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Footer.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Footer.Example.tsx
index ca87067d68841..b115b32214ae9 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Footer.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Footer.Example.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
@@ -24,23 +25,7 @@ export class PanelFooterExample extends React.Component<any, any> {
           isFooterAtBottom={ true }
           headerText='Panel with footer at bottom'
           closeButtonAriaLabel='Close'
-          onRenderFooterContent={ () => {
-            return (
-              <div>
-                <PrimaryButton
-                  onClick={ this._onClosePanel }
-                  style={ { 'marginRight': '8px' } }
-                >
-                  Save
-                </PrimaryButton>
-                <DefaultButton
-                  onClick={ this._onClosePanel }
-                >
-                  Cancel
-                </DefaultButton>
-              </div>
-            );
-          } }
+          onRenderFooterContent={ this._onRenderFooterContent }
         >
           <span>Content goes here.</span>
         </Panel>
@@ -52,6 +37,25 @@ export class PanelFooterExample extends React.Component<any, any> {
     this.setState({ showPanel: false });
   }
 
+  @autobind
+  private _onRenderFooterContent(): JSX.Element {
+    return (
+      <div>
+        <PrimaryButton
+          onClick={ this._onClosePanel }
+          style={ { 'marginRight': '8px' } }
+        >
+          Save
+        </PrimaryButton>
+        <DefaultButton
+          onClick={ this._onClosePanel }
+        >
+          Cancel
+        </DefaultButton>
+      </div>
+    );
+  }
+
   private _onShowPanel = () => {
     this.setState({ showPanel: true });
   }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Large.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Large.Example.tsx
index 8de41f08c2a5e..64dc0ba201ffc 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Large.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Large.Example.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
@@ -14,12 +15,14 @@ export class PanelLargeExample extends React.Component<any, any> {
       <div>
         <DefaultButton
           description='Opens the Sample Panel'
+          // tslint:disable-next-line:jsx-no-lambda
           onClick={ () => this.setState({ showPanel: true }) }
           text='Open Panel'
         />
         <Panel
           isOpen={ this.state.showPanel }
-          onDismiss={ () => this.setState({ showPanel: false }) }
+          // tslint:disable-next-line:jsx-no-lambda
+          onDismiss={ () => this.setState({ showPanel: false })  }
           type={ PanelType.large }
           headerText='Large Panel'
         >
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismiss.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismiss.Example.tsx
index 26b01203fe92b..514b5f9e31342 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismiss.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismiss.Example.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel } from 'office-ui-fabric-react/lib/Panel';
 
@@ -15,17 +16,27 @@ export class PanelLightDismissExample extends React.Component<any, any> {
       <div>
         <DefaultButton
           text='Open panel'
-          onClick={ () => this.setState({ showPanel: true }) }
+          onClick={ this._showPanel }
         />
         <Panel
           isOpen={ this.state.showPanel }
           isLightDismiss={ true }
           headerText='Light Dismiss Panel'
-          onDismiss={ () => this.setState({ showPanel: false }) }
+          onDismiss={ this._hidePanel }
         >
           <span>Light Dismiss usage is meant for the Contextual Menu on mobile sized breakpoints.</span>
         </Panel>
       </div>
     );
   }
+
+  @autobind
+  private _showPanel(): void {
+    this.setState({ showPanel: true });
+  }
+
+  @autobind
+  private _hidePanel(): void {
+    this.setState({ showPanel: false });
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Medium.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Medium.Example.tsx
index 980127b36508b..2624459e6a454 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Medium.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Medium.Example.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
@@ -14,12 +15,12 @@ export class PanelMediumExample extends React.Component<any, any> {
       <div>
         <DefaultButton
           description='Opens the Sample Panel'
-          onClick={ () => this.setState({ showPanel: true }) }
+          onClick={ this._setShowPanel(true) }
           text='Open Panel'
         />
         <Panel
           isOpen={ this.state.showPanel }
-          onDismiss={ () => this.setState({ showPanel: false }) }
+          onDismiss={ this._setShowPanel(false) }
           type={ PanelType.medium }
           headerText='Medium Panel'
         >
@@ -28,4 +29,11 @@ export class PanelMediumExample extends React.Component<any, any> {
       </div>
     );
   }
+
+  @autobind
+  private _setShowPanel(showPanel: boolean): () => void {
+    return (): void => {
+      this.setState({ showPanel });
+    };
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.NonModal.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.NonModal.Example.tsx
index 5a911ded99840..5e908e51594bd 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.NonModal.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.NonModal.Example.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
@@ -14,12 +15,12 @@ export class PanelNonModalExample extends React.Component<any, any> {
       <div>
         <DefaultButton
           text='Open panel'
-          onClick={ () => this.setState({ showPanel: true }) }
+          onClick={ this._setShowPanel(true) }
         />
         <Panel
           isBlocking={ false }
           isOpen={ this.state.showPanel }
-          onDismiss={ () => this.setState({ showPanel: false }) }
+          onDismiss={ this._setShowPanel(false) }
           type={ PanelType.medium }
           headerText='Non-Modal Panel'
           closeButtonAriaLabel='Close'
@@ -29,4 +30,11 @@ export class PanelNonModalExample extends React.Component<any, any> {
       </div>
     );
   }
+
+  @autobind
+  private _setShowPanel(showPanel: boolean): () => void {
+    return (): void => {
+      this.setState({ showPanel });
+    };
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallFluid.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallFluid.Example.tsx
index 8641695485d8c..0cf78f51c08e8 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallFluid.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallFluid.Example.tsx
@@ -14,12 +14,14 @@ export class PanelSmallFluidExample extends React.Component<any, any> {
       <div>
         <DefaultButton
           description='Opens the Sample Panel'
+          // tslint:disable-next-line:jsx-no-lambda
           onClick={ () => this.setState({ showPanel: true }) }
           text='Open Panel'
         />
         <Panel
           isOpen={ this.state.showPanel }
           type={ PanelType.smallFluid }
+          // tslint:disable-next-line:jsx-no-lambda
           onDismiss={ () => this.setState({ showPanel: false }) }
           headerText='Panel - Small, right-aligned, fixed'
         >
@@ -28,5 +30,4 @@ export class PanelSmallFluidExample extends React.Component<any, any> {
       </div>
     );
   }
-
 }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallLeft.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallLeft.Example.tsx
index 6b326dff2f121..e01539d90533d 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallLeft.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallLeft.Example.tsx
@@ -14,12 +14,14 @@ export class PanelSmallLeftExample extends React.Component<any, any> {
       <div>
         <DefaultButton
           description='Opens the Sample Panel'
+          // tslint:disable-next-line:jsx-no-lambda
           onClick={ () => this.setState({ showPanel: true }) }
           text='Open Panel'
         />
         <Panel
           isOpen={ this.state.showPanel }
           type={ PanelType.smallFixedNear }
+          // tslint:disable-next-line:jsx-no-lambda
           onDismiss={ () => this.setState({ showPanel: false }) }
           headerText='Panel - Small, left-aligned, fixed'
         >
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallRight.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallRight.Example.tsx
index 617728ab6d884..829679007b93f 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallRight.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallRight.Example.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { ChoiceGroup } from 'office-ui-fabric-react/lib/ChoiceGroup';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
@@ -26,23 +27,7 @@ export class PanelSmallRightExample extends React.Component<any, any> {
           onDismiss={ this._onClosePanel }
           headerText='Panel - Small, right-aligned, fixed, with footer'
           closeButtonAriaLabel='Close'
-          onRenderFooterContent={ () => {
-            return (
-              <div>
-                <PrimaryButton
-                  onClick={ this._onClosePanel }
-                  style={ { 'marginRight': '8px' } }
-                >
-                  Save
-                </PrimaryButton>
-                <DefaultButton
-                  onClick={ this._onClosePanel }
-                >
-                  Cancel
-                </DefaultButton>
-              </div>
-            );
-          } }
+          onRenderFooterContent={ this._onRenderFooterContent }
         >
           <ChoiceGroup
             options={ [
@@ -75,11 +60,32 @@ export class PanelSmallRightExample extends React.Component<any, any> {
     );
   }
 
-  private _onClosePanel = () => {
+  @autobind
+  private _onClosePanel(): void {
     this.setState({ showPanel: false });
   }
 
-  private _onShowPanel = () => {
+  @autobind
+  private _onRenderFooterContent(): JSX.Element {
+    return (
+      <div>
+        <PrimaryButton
+          onClick={ this._onClosePanel }
+          style={ { 'marginRight': '8px' } }
+        >
+          Save
+        </PrimaryButton>
+        <DefaultButton
+          onClick={ this._onClosePanel }
+        >
+          Cancel
+        </DefaultButton>
+      </div>
+    );
+  }
+
+  @autobind
+  private _onShowPanel(): void {
     this.setState({ showPanel: true });
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
index 5f64976b432cf..f34ef517db17b 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import {
   Persona,
   PersonaSize,
@@ -37,7 +38,7 @@ export class PersonaBasicExample extends React.Component<React.Props<PersonaBasi
           <Checkbox
             label='Include persona details'
             checked={ renderPersonaDetails }
-            onChange={ (ev, checked) => { this.setState({ renderPersonaDetails: checked }); } }
+            onChange={ this._onChange }
           />
         </div>
 
@@ -101,4 +102,9 @@ export class PersonaBasicExample extends React.Component<React.Props<PersonaBasi
       </div >
     );
   }
+
+  @autobind
+  private _onChange(ev: React.FormEvent<HTMLElement | HTMLInputElement> | undefined, checked: boolean | undefined): void {
+    this.setState({ renderPersonaDetails: checked });
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.test.tsx b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.test.tsx
index 3a1e406ab5af0..086a5499fdaf6 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.test.tsx
@@ -26,16 +26,16 @@ describe('BaseAutoFill', () => {
   });
 
   it('correctly autofills', (done) => {
+    const onInputValueChange = (text: string | undefined): void => {
+      assert(text === 'hel', 'text was ' + text);
+      assert(autoFill.value === 'hel', 'autoFill value was ' + autoFill.value);
+      done();
+    };
+
     ReactDOM.render(
       <BaseAutoFill
         ref={ (c) => autoFill = c! }
-        onInputValueChange={
-          (text) => {
-            assert(text === 'hel', 'text was ' + text);
-            assert(autoFill.value === 'hel', 'autoFill value was ' + autoFill.value);
-            done();
-          }
-        }
+        onInputValueChange={ onInputValueChange }
         suggestedDisplayValue='hello'
       />,
       baseNode
@@ -45,13 +45,7 @@ describe('BaseAutoFill', () => {
     ReactDOM.render(
       <BaseAutoFill
         ref={ (c) => autoFill = c! }
-        onInputValueChange={
-          (text) => {
-            assert(text === 'hel', 'text was ' + text);
-            assert(autoFill.value === 'hel', 'autoFill value was ' + autoFill.value);
-            done();
-          }
-        }
+        onInputValueChange={ onInputValueChange }
         suggestedDisplayValue='hello'
       />, baseNode);
     assert(autoFill.inputElement.value === 'hello');
@@ -59,19 +53,19 @@ describe('BaseAutoFill', () => {
   });
 
   it('does not autofill if suggestedDisplayValue does not match input', (done) => {
+    const onInputValueChange = (text: string | undefined): void => {
+      assert(autoFill.value === 'hep', 'text was ' + autoFill.value);
+      assert(text === 'hep', 'text was ' + text);
+      assert(autoFill.inputElement.value === 'hep');
+      done();
+    };
+
     autoFillInput.value = 'hep';
     ReactTestUtils.Simulate.change(autoFillInput);
     ReactDOM.render(
       <BaseAutoFill
         ref={ (c) => autoFill = c! }
-        onInputValueChange={
-          (text) => {
-            assert(autoFill.value === 'hep', 'text was ' + autoFill.value);
-            assert(text === 'hep', 'text was ' + text);
-            assert(autoFill.inputElement.value === 'hep');
-            done();
-          }
-        }
+        onInputValueChange={ onInputValueChange }
         suggestedDisplayValue='hello'
       />,
       baseNode
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
index a8e2740053887..900035c90c33f 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
@@ -49,13 +49,19 @@ export type TypedBasePicker = BasePicker<ISimple, IBasePickerProps<ISimple>>;
 describe('Pickers', () => {
   describe('BasePicker', () => {
     const BasePickerWithType = BasePicker as new (props: IBasePickerProps<ISimple>) => BasePicker<ISimple, IBasePickerProps<ISimple>>;
+    const onRenderItem = (props: IPickerItemProps<{ key: string, name: string }>): JSX.Element =>
+      (
+        <div key={ props.item.name }>
+          { basicRenderer(props) }
+        </div>
+      );
     it('can provide custom renderers', () => {
       let root = document.createElement('div');
       document.body.appendChild(root);
       let picker: TypedBasePicker = ReactDOM.render(
         <BasePickerWithType
           onResolveSuggestions={ onResolveSuggestions }
-          onRenderItem={ (props: IPickerItemProps<{ key: string, name: string }>) => <div key={ props.item.name }>{ basicRenderer(props) }</div> }
+          onRenderItem={ onRenderItem }
           onRenderSuggestionsItem={ basicSuggestionRenderer }
         />,
         root
@@ -87,7 +93,7 @@ describe('Pickers', () => {
       let picker: TypedBasePicker = ReactDOM.render(
         <BasePickerWithType
           onResolveSuggestions={ onResolveSuggestions }
-          onRenderItem={ (props: IPickerItemProps<{ key: string, name: string }>) => <div key={ props.item.name }>{ basicRenderer(props) }</div> }
+          onRenderItem={ onRenderItem }
           onRenderSuggestionsItem={ basicSuggestionRenderer }
           itemLimit={ 1 }
         />,
@@ -113,7 +119,7 @@ describe('Pickers', () => {
       ReactDOM.render(
         <BasePickerWithType
           onResolveSuggestions={ onResolveSuggestions }
-          onRenderItem={ (props: IPickerItemProps<{ key: string, name: string }>) => <div key={ props.item.name }>{ basicRenderer(props) }</div> }
+          onRenderItem={ onRenderItem }
           onRenderSuggestionsItem={ basicSuggestionRenderer }
           itemLimit={ 0 }
         />,
@@ -133,7 +139,7 @@ describe('Pickers', () => {
         <BasePickerWithType
           selectedItems={ [{ key: '1', name: 'blue' }, { key: '2', name: 'black' }] }
           onResolveSuggestions={ onResolveSuggestions }
-          onRenderItem={ (props: IPickerItemProps<{ key: string, name: string }>) => <div key={ props.item.name }>{ basicRenderer(props) }</div> }
+          onRenderItem={ onRenderItem }
           onRenderSuggestionsItem={ basicSuggestionRenderer }
           itemLimit={ 0 }
         />,
@@ -217,15 +223,17 @@ describe('Pickers', () => {
     it('fires change events correctly for controlled components', (done) => {
       let root = document.createElement('div');
       document.body.appendChild(root);
+      const onChange = (items: ITag[] | undefined): void => {
+        expect(items!.length).to.be.equal(1, 'The picker incorrectly added an item');
+        expect(items![0].name).to.be.equal('black', 'The picker incorrectly added an item');
+        done();
+      };
+
       ReactDOM.render(
         <TagPicker
           onResolveSuggestions={ onResolveSuggestions }
           selectedItems={ [] }
-          onChange={ (items) => {
-            expect(items!.length).to.be.equal(1, 'The picker incorrectly added an item');
-            expect(items![0].name).to.be.equal('black', 'The picker incorrectly added an item');
-            done();
-          } }
+          onChange={ onChange }
         />,
         root
       ) as TagPicker;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index 3dd288d6b2d00..9ccfbce15e1a7 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -131,12 +131,15 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     );
   }
 
+  private _getTextFromItem(persona: IPersonaProps): string {
+    return persona.primaryText as string;
+  }
   private _renderListPicker() {
     return (
       <ListPeoplePicker
         onResolveSuggestions={ this._onFilterChanged }
         onEmptyInputFocus={ this._returnMostRecentlyUsed }
-        getTextFromItem={ (persona: IPersonaProps) => persona.primaryText as string }
+        getTextFromItem={ this._getTextFromItem }
         className={ 'ms-PeoplePicker' }
         pickerSuggestionsProps={ suggestionProps }
         key={ 'list' }
@@ -147,7 +150,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
           onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called'),
           'aria-label': 'People Picker'
         } }
-        componentRef={ (component: IBasePicker<IPersonaProps>) => this._picker = component }
+        componentRef={ this._resolveRef('_picker') }
       />
     );
   }
@@ -157,7 +160,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
       <NormalPeoplePicker
         onResolveSuggestions={ this._onFilterChanged }
         onEmptyInputFocus={ this._returnMostRecentlyUsed }
-        getTextFromItem={ (persona: IPersonaProps) => persona.primaryText as string }
+        getTextFromItem={ this._getTextFromItem }
         pickerSuggestionsProps={ suggestionProps }
         className={ 'ms-PeoplePicker' }
         key={ 'normal' }
@@ -169,7 +172,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
           onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called'),
           'aria-label': 'People Picker'
         } }
-        componentRef={ (component: IBasePicker<IPersonaProps>) => this._picker = component }
+        componentRef={ this._resolveRef('_picker') }
       />
     );
   }
@@ -179,7 +182,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
       <CompactPeoplePicker
         onResolveSuggestions={ this._onFilterChanged }
         onEmptyInputFocus={ this._returnMostRecentlyUsed }
-        getTextFromItem={ (persona: IPersonaProps) => persona.primaryText as string }
+        getTextFromItem={ this._getTextFromItem }
         pickerSuggestionsProps={ suggestionProps }
         className={ 'ms-PeoplePicker' }
         onRemoveSuggestion={ this._onRemoveSuggestion }
@@ -189,7 +192,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
           onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called'),
           'aria-label': 'People Picker'
         } }
-        componentRef={ (component: IBasePicker<IPersonaProps>) => this._picker = component }
+        componentRef={ this._resolveRef('_picker') }
       />
     );
   }
@@ -199,7 +202,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
       <CompactPeoplePicker
         onResolveSuggestions={ this._onFilterChanged }
         onEmptyInputFocus={ this._returnMostRecentlyUsed }
-        getTextFromItem={ (persona: IPersonaProps) => persona.primaryText as string }
+        getTextFromItem={ this._getTextFromItem }
         className={ 'ms-PeoplePicker' }
         defaultSelectedItems={ people.splice(0, 3) }
         key={ 'list' }
@@ -211,7 +214,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
           onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called'),
           'aria-label': 'People Picker'
         } }
-        componentRef={ (component: IBasePicker<IPersonaProps>) => this._picker = component }
+        componentRef={ this._resolveRef('_picker') }
       />
     );
   }
@@ -223,7 +226,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
       <CompactPeoplePicker
         onResolveSuggestions={ this._onFilterChangedWithLimit }
         onEmptyInputFocus={ this._returnMostRecentlyUsedWithLimit }
-        getTextFromItem={ (persona: IPersonaProps) => persona.primaryText as string }
+        getTextFromItem={ this._getTextFromItem }
         className={ 'ms-PeoplePicker' }
         onGetMoreResults={ this._onFilterChanged }
         pickerSuggestionsProps={ limitedSearchSuggestionProps }
@@ -233,7 +236,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
           onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called'),
           'aria-label': 'People Picker'
         } }
-        componentRef={ (component: IBasePicker<IPersonaProps>) => this._picker = component }
+        componentRef={ this._resolveRef('_picker') }
       />
     );
   }
@@ -243,7 +246,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
       <NormalPeoplePicker
         onResolveSuggestions={ this._onFilterChanged }
         onEmptyInputFocus={ this._returnMostRecentlyUsed }
-        getTextFromItem={ (persona: IPersonaProps) => persona.primaryText as string }
+        getTextFromItem={ this._getTextFromItem }
         pickerSuggestionsProps={ suggestionProps }
         className={ 'ms-PeoplePicker' }
         onRemoveSuggestion={ this._onRemoveSuggestion }
@@ -255,7 +258,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
           onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called'),
           'aria-label': 'People Picker'
         } }
-        componentRef={ (component: IBasePicker<IPersonaProps>) => this._picker = component }
+        componentRef={ this._resolveRef('_picker') }
       />
     );
   }
@@ -272,7 +275,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
       <div>
         <NormalPeoplePicker
           onResolveSuggestions={ this._onFilterChanged }
-          getTextFromItem={ (persona: IPersonaProps) => persona.primaryText! }
+          getTextFromItem={ this._getTextFromItem }
           pickerSuggestionsProps={ suggestionProps }
           className={ 'ms-PeoplePicker' }
           key={ 'controlled' }
@@ -282,12 +285,13 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
             onBlur: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onBlur called'),
             onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called')
           } }
-          componentRef={ (component: IBasePicker<IPersonaProps>) => this._picker = component }
+          componentRef={ this._resolveRef('_picker') }
         />
         <label> Click to Add a person </label>
         { controlledItems.map(item => <div>
           <DefaultButton
             className='controlledPickerButton'
+            // tslint:disable-next-line:jsx-no-lambda
             onClick={ () => {
               this.setState({
                 currentSelectedItems: this.state.currentSelectedItems!.concat([item])
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
index 0503f87d5f53c..f7807682de7eb 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
@@ -315,10 +315,12 @@ export const SelectedDocumentItem: (documentProps: IPickerItemProps<IFullDocumen
       }
     });
   }
+  const log = (text: string): () => void =>
+    (): void => console.log(text);
 
   return (
     <DocumentCard
-      onClick={ () => { console.log('You clicked the card.'); } }
+      onClick={ log('You clicked the card.') }
     >
       <DocumentCardPreview { ...(documentPreviewProps as IDocumentCardPreviewProps) } />
       <DocumentCardLocation location='Marketing Documents' locationHref='http://microsoft.com' ariaLabel='Location, Marketing Documents' />
@@ -353,7 +355,7 @@ export class PickerCustomResultExample extends React.Component<any, IPeoplePicke
           onRenderSuggestionsItem={ SuggestedBigItem as any }
           onResolveSuggestions={ this._onFilterChanged }
           onRenderItem={ SelectedDocumentItem }
-          getTextFromItem={ (props: any) => props.documentTitleProps.title }
+          getTextFromItem={ this._getTextFromItem }
           pickerSuggestionsProps={
             {
               suggestionsHeaderText: 'Suggested Documents',
@@ -371,6 +373,10 @@ export class PickerCustomResultExample extends React.Component<any, IPeoplePicke
     );
   }
 
+  private _getTextFromItem(props: any): any {
+    return props.documentTitleProps.title;
+  }
+
   @autobind
   private _onDisabledButtonClick(): void {
     this.setState({
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
index fd3bd30bd39aa..ba6711f45bbfb 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
@@ -44,7 +44,7 @@ export class TagPickerBasicExample extends React.Component<{}, ITagPickerDemoPag
         <TagPicker
           ref='tagPicker'
           onResolveSuggestions={ this._onFilterChanged }
-          getTextFromItem={ (item: any) => { return item.name; } }
+          getTextFromItem={ this._getTextFromItem }
           pickerSuggestionsProps={
             {
               suggestionsHeaderText: 'Suggested Tags',
@@ -63,6 +63,10 @@ export class TagPickerBasicExample extends React.Component<{}, ITagPickerDemoPag
     );
   }
 
+  private _getTextFromItem(item: any): any {
+    return item.name;
+  }
+
   @autobind
   private _onDisabledButtonClick(): void {
     this.setState({

From dd50e1c73662f78d6a1ffa7cc81af0272c3a2528 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 29 Sep 2017 10:20:24 +0000
Subject: [PATCH 0749/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 24 +++++++++
 apps/fabric-website/CHANGELOG.md              | 10 +++-
 apps/fabric-website/package.json              |  4 +-
 apps/ssr-tests/package.json                   |  2 +-
 ...-base-fabric-upgrade_2017-09-28-23-51.json | 11 ----
 ...tializeIcons-website_2017-09-27-15-20.json | 11 ----
 .../sharepoint-toolkit_2017-09-28-18-38.json  | 11 ----
 .../mergestylesets_2017-09-29-03-31.json      | 11 ----
 ...tfield_custom_render_2017-09-26-13-18.json | 11 ----
 .../checkbox-toolkit_2017-09-28-18-01.json    | 11 ----
 ...dColumnsPastMaxWidth_2017-09-21-18-10.json | 11 ----
 ...menu-section-checked_2017-09-28-01-23.json | 11 ----
 .../mergestylesets_2017-09-29-03-31.json      | 11 ----
 .../textField-toolkit_2017-09-26-21-45.json   | 11 ----
 ...kerKeydownChangeYear_2017-09-26-20-12.json | 11 ----
 packages/example-app-base/CHANGELOG.json      | 14 +++++
 packages/example-app-base/CHANGELOG.md        |  9 +++-
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/package.json             |  4 +-
 packages/merge-styles/CHANGELOG.json          | 19 +++++++
 packages/merge-styles/CHANGELOG.md            | 11 ++++
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 54 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 18 ++++++-
 packages/office-ui-fabric-react/package.json  |  6 +--
 packages/styling/package.json                 |  2 +-
 scripts/package.json                          |  2 +-
 27 files changed, 168 insertions(+), 136 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/example-app-base-fabric-upgrade_2017-09-28-23-51.json
 delete mode 100644 common/changes/@uifabric/fabric-website/initializeIcons-website_2017-09-27-15-20.json
 delete mode 100644 common/changes/@uifabric/fabric-website/sharepoint-toolkit_2017-09-28-18-38.json
 delete mode 100644 common/changes/@uifabric/merge-styles/mergestylesets_2017-09-29-03-31.json
 delete mode 100644 common/changes/office-ui-fabric-react/amkronen-textfield_custom_render_2017-09-26-13-18.json
 delete mode 100644 common/changes/office-ui-fabric-react/checkbox-toolkit_2017-09-28-18-01.json
 delete mode 100644 common/changes/office-ui-fabric-react/detailsList-resizeJustifiedColumnsPastMaxWidth_2017-09-21-18-10.json
 delete mode 100644 common/changes/office-ui-fabric-react/menu-section-checked_2017-09-28-01-23.json
 delete mode 100644 common/changes/office-ui-fabric-react/mergestylesets_2017-09-29-03-31.json
 delete mode 100644 common/changes/office-ui-fabric-react/textField-toolkit_2017-09-26-21-45.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-petdun-fixDatePickerKeydownChangeYear_2017-09-26-20-12.json
 create mode 100644 packages/merge-styles/CHANGELOG.json
 create mode 100644 packages/merge-styles/CHANGELOG.md

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 2506c7b9f57e4..31e46e305b948 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.0.6",
+      "tag": "@uifabric/fabric-website_v5.0.6",
+      "date": "Fri, 29 Sep 2017 10:20:24 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "47af278daa76bc638871139ce6b0294edb8c9edb",
+            "comment": "Added initializeIcons() call to make all icons in examples on the website available."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "af886149a115cc6ac2dc697caa3b2f535c8d6147",
+            "comment": "Added SharePoint Toolkit link and text to ResourcesPage."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.1.0 <6.0.0` to `>=5.2.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.5",
       "tag": "@uifabric/fabric-website_v5.0.5",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index c0b6bd2ad35b9..5062f114bf85a 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Thu, 28 Sep 2017 10:19:12 GMT and should not be manually modified.
+This log was last generated on Fri, 29 Sep 2017 10:20:24 GMT and should not be manually modified.
+
+## 5.0.6
+Fri, 29 Sep 2017 10:20:24 GMT
+
+### Patches
+
+- Added initializeIcons() call to make all icons in examples on the website available.
+- Added SharePoint Toolkit link and text to ResourcesPage.
 
 ## 5.0.5
 Thu, 28 Sep 2017 10:19:12 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 22abe341914ce..1115f695fa911 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.0.5",
+  "version": "5.0.6",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,7 +47,7 @@
     "@uifabric/icons": ">=5.0.1 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.1.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 147b0b20a72c8..80908aed19e4e 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.0.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.2.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-addons-test-utils": "^15.4.2",
diff --git a/common/changes/@uifabric/example-app-base/example-app-base-fabric-upgrade_2017-09-28-23-51.json b/common/changes/@uifabric/example-app-base/example-app-base-fabric-upgrade_2017-09-28-23-51.json
deleted file mode 100644
index b11f258ddb8ea..0000000000000
--- a/common/changes/@uifabric/example-app-base/example-app-base-fabric-upgrade_2017-09-28-23-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Update fabric version for example-app-base",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/initializeIcons-website_2017-09-27-15-20.json b/common/changes/@uifabric/fabric-website/initializeIcons-website_2017-09-27-15-20.json
deleted file mode 100644
index 5db10815f4877..0000000000000
--- a/common/changes/@uifabric/fabric-website/initializeIcons-website_2017-09-27-15-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Added initializeIcons() call to make all icons in examples on the website available.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/sharepoint-toolkit_2017-09-28-18-38.json b/common/changes/@uifabric/fabric-website/sharepoint-toolkit_2017-09-28-18-38.json
deleted file mode 100644
index 75107c0b3c975..0000000000000
--- a/common/changes/@uifabric/fabric-website/sharepoint-toolkit_2017-09-28-18-38.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Added SharePoint Toolkit link and text to ResourcesPage.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/mergestylesets_2017-09-29-03-31.json b/common/changes/@uifabric/merge-styles/mergestylesets_2017-09-29-03-31.json
deleted file mode 100644
index b3bf76eed0b11..0000000000000
--- a/common/changes/@uifabric/merge-styles/mergestylesets_2017-09-29-03-31.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "The `mergeStyleSets` method's type safety was not correct. Now with significantly better type safety.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/amkronen-textfield_custom_render_2017-09-26-13-18.json b/common/changes/office-ui-fabric-react/amkronen-textfield_custom_render_2017-09-26-13-18.json
deleted file mode 100644
index d63f5b17a7303..0000000000000
--- a/common/changes/office-ui-fabric-react/amkronen-textfield_custom_render_2017-09-26-13-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Adding custom render to TextField label",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "amkronen@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/checkbox-toolkit_2017-09-28-18-01.json b/common/changes/office-ui-fabric-react/checkbox-toolkit_2017-09-28-18-01.json
deleted file mode 100644
index cc8ca54aa8290..0000000000000
--- a/common/changes/office-ui-fabric-react/checkbox-toolkit_2017-09-28-18-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Simplified checkbox examples and fixed spacing issue.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/detailsList-resizeJustifiedColumnsPastMaxWidth_2017-09-21-18-10.json b/common/changes/office-ui-fabric-react/detailsList-resizeJustifiedColumnsPastMaxWidth_2017-09-21-18-10.json
deleted file mode 100644
index e1223864d24a8..0000000000000
--- a/common/changes/office-ui-fabric-react/detailsList-resizeJustifiedColumnsPastMaxWidth_2017-09-21-18-10.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: Allow resizing columns wider than maxWidth in justified layout",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jaspadie@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/menu-section-checked_2017-09-28-01-23.json b/common/changes/office-ui-fabric-react/menu-section-checked_2017-09-28-01-23.json
deleted file mode 100644
index c7d4bd646098b..0000000000000
--- a/common/changes/office-ui-fabric-react/menu-section-checked_2017-09-28-01-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: Make sure to check items within a menu section for the 'canCheck' property",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/mergestylesets_2017-09-29-03-31.json b/common/changes/office-ui-fabric-react/mergestylesets_2017-09-29-03-31.json
deleted file mode 100644
index ce4f747d3960e..0000000000000
--- a/common/changes/office-ui-fabric-react/mergestylesets_2017-09-29-03-31.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Updating mergeStyleSets usage in various components to adhere to correct typing.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/textField-toolkit_2017-09-26-21-45.json b/common/changes/office-ui-fabric-react/textField-toolkit_2017-09-26-21-45.json
deleted file mode 100644
index 1fa793a7b0b85..0000000000000
--- a/common/changes/office-ui-fabric-react/textField-toolkit_2017-09-26-21-45.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Split out and cleaned up TextField examples to better reflect the toolkit. ",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-petdun-fixDatePickerKeydownChangeYear_2017-09-26-20-12.json b/common/changes/office-ui-fabric-react/users-petdun-fixDatePickerKeydownChangeYear_2017-09-26-20-12.json
deleted file mode 100644
index cd208adabeeaa..0000000000000
--- a/common/changes/office-ui-fabric-react/users-petdun-fixDatePickerKeydownChangeYear_2017-09-26-20-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DatePicker: call correct callback when previous year button is clicked",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "peterdunlop2519@gmail.com"
-}
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 9e2cd96dea997..5de80888e0434 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "5.0.3",
+      "tag": "@uifabric/example-app-base_v5.0.3",
+      "date": "Fri, 29 Sep 2017 10:20:24 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "782705c98981f7114864f06472e0411af2d7a9aa",
+            "comment": "Update fabric version for example-app-base"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.2",
       "tag": "@uifabric/example-app-base_v5.0.2",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index 5c42b14684d5d..9cf1b22c5f7a4 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Thu, 28 Sep 2017 10:19:12 GMT and should not be manually modified.
+This log was last generated on Fri, 29 Sep 2017 10:20:24 GMT and should not be manually modified.
+
+## 5.0.3
+Fri, 29 Sep 2017 10:20:24 GMT
+
+### Patches
+
+- Update fabric version for example-app-base
 
 ## 5.0.2
 Thu, 28 Sep 2017 10:19:12 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index f1b9a5d36f7a6..4a96a60ad8337 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "5.0.2",
+  "version": "5.0.3",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index e97011a30a053..d281adca3186b 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -27,7 +27,7 @@
     "@types/jest": "^21.1.0",
     "@types/enzyme": "^2.8.8",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=5.0.2 <6.0.0",
+    "@uifabric/example-app-base": ">=5.0.3 <6.0.0",
     "@uifabric/icons": ">=5.0.1 <6.0.0",
     "es6-weak-map": "^2.0.2",
     "enzyme": "^2.9.1",
@@ -41,7 +41,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.1.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.2.0 <6.0.0",
     "@uifabric/icons": ">=5.0.1 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
new file mode 100644
index 0000000000000..3b0da5ecbf4de
--- /dev/null
+++ b/packages/merge-styles/CHANGELOG.json
@@ -0,0 +1,19 @@
+{
+  "name": "@uifabric/merge-styles",
+  "entries": [
+    {
+      "version": "5.1.0",
+      "tag": "@uifabric/merge-styles_v5.1.0",
+      "date": "Fri, 29 Sep 2017 10:20:24 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "88b06cfda2262661375f90f3bde2d6a16af749a9",
+            "comment": "The `mergeStyleSets` method's type safety was not correct. Now with significantly better type safety."
+          }
+        ]
+      }
+    }
+  ]
+}
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
new file mode 100644
index 0000000000000..44b394e8b0bdb
--- /dev/null
+++ b/packages/merge-styles/CHANGELOG.md
@@ -0,0 +1,11 @@
+# Change Log - @uifabric/merge-styles
+
+This log was last generated on Fri, 29 Sep 2017 10:20:24 GMT and should not be manually modified.
+
+## 5.1.0
+Fri, 29 Sep 2017 10:20:24 GMT
+
+### Minor changes
+
+- The `mergeStyleSets` method's type safety was not correct. Now with significantly better type safety.
+
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index 354b747ee6593..7e91b9c6d8868 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.0.0",
+  "version": "5.1.0",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 7c10921b1bc0a..2a2c9ff0f7c0c 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,60 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.2.0",
+      "tag": "office-ui-fabric-react_v5.2.0",
+      "date": "Fri, 29 Sep 2017 10:20:24 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Amund Kronen Johansen <32198837+amkronen@users.noreply.github.com>",
+            "commit": "35abf2925835a9ee29cf7902ec02ff3c56533724",
+            "comment": "Adding custom render to TextField label"
+          }
+        ],
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "b9851e70e07c246086445ca5f3680e9b3c0b644b",
+            "comment": "Simplified checkbox examples and fixed spacing issue."
+          },
+          {
+            "author": "Pablo Núñez <pablonete@gmail.com>",
+            "commit": "72619db986d90c47a32b46d3419030b2c1f49e1a",
+            "comment": "DetailsList: Allow resizing columns wider than maxWidth in justified layout"
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "97c324bbb723e464664bee2a7e941e5e040f4253",
+            "comment": "ContextualMenu: Make sure to check items within a menu section for the 'canCheck' property"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "88b06cfda2262661375f90f3bde2d6a16af749a9",
+            "comment": "Updating mergeStyleSets usage in various components to adhere to correct typing."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "a08c9f55633b7be08358988845dd769257c1aca1",
+            "comment": "Split out and cleaned up TextField examples to better reflect the toolkit. "
+          },
+          {
+            "author": "petdun2519 <peterdunlop2519@gmail.com>",
+            "commit": "9915c5fd03b43e77a75dbe33421f48df3c747192",
+            "comment": "DatePicker: call correct callback when previous year button is clicked"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.0.0 <6.0.0` to `>=5.1.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=5.0.2 <6.0.0` to `>=5.0.3 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.1.0",
       "tag": "office-ui-fabric-react_v5.1.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index aaf50763aa8c8..ca79948ff0ad3 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,22 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 28 Sep 2017 10:19:12 GMT and should not be manually modified.
+This log was last generated on Fri, 29 Sep 2017 10:20:24 GMT and should not be manually modified.
+
+## 5.2.0
+Fri, 29 Sep 2017 10:20:24 GMT
+
+### Minor changes
+
+- Adding custom render to TextField label
+
+### Patches
+
+- Simplified checkbox examples and fixed spacing issue.
+- DetailsList: Allow resizing columns wider than maxWidth in justified layout
+- ContextualMenu: Make sure to check items within a menu section for the 'canCheck' property
+- Updating mergeStyleSets usage in various components to adhere to correct typing.
+- Split out and cleaned up TextField examples to better reflect the toolkit. 
+- DatePicker: call correct callback when previous year button is clicked
 
 ## 5.1.0
 Thu, 28 Sep 2017 10:19:12 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index d5c875f44e916..33223f600cdfd 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.1.0",
+  "version": "5.2.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -26,7 +26,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=5.0.2 <6.0.0",
+    "@uifabric/example-app-base": ">=5.0.3 <6.0.0",
     "enzyme": "^2.9.1",
     "es6-promise": "^4.1.0",
     "es6-map": "^0.1.5",
@@ -44,7 +44,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.0.1 <6.0.0",
-    "@uifabric/merge-styles": ">=5.0.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.1.0 <6.0.0",
     "@uifabric/styling": ">=5.0.1 <6.0.0",
     "@uifabric/utilities": ">=5.0.1 <6.0.0",
     "prop-types": "^15.5.10",
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 1a115e836a55e..cf2aa9859110a 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -21,7 +21,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/utilities": ">=5.0.1 <6.0.0",
-    "@uifabric/merge-styles": ">=5.0.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/scripts/package.json b/scripts/package.json
index 970e248f9e0fa..429efc562e84d 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -9,7 +9,7 @@
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@microsoft/loader-load-themed-styles": "^1.4.2",
-    "@uifabric/merge-styles": ">=5.0.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.1.0 <6.0.0",
     "autoprefixer": "^7.1.2",
     "awesome-typescript-loader": "^3.2.3",
     "chalk": "^2.1.0",

From 93a77f83352b357bae5d6b509a40eeec28d56a32 Mon Sep 17 00:00:00 2001
From: Amy Hackett <ahackett@microsoft.com>
Date: Fri, 29 Sep 2017 12:50:38 -0700
Subject: [PATCH 0750/1641] Ahackett/formatter2 (#2990)

* add successBackground color

* changelog
---
 .../styling/ahackett-formatter2_2017-09-29-19-29.json | 11 +++++++++++
 packages/styling/src/interfaces/ISemanticColors.ts    |  4 ++++
 packages/styling/src/styles/theme.ts                  |  1 +
 3 files changed, 16 insertions(+)
 create mode 100644 common/changes/@uifabric/styling/ahackett-formatter2_2017-09-29-19-29.json

diff --git a/common/changes/@uifabric/styling/ahackett-formatter2_2017-09-29-19-29.json b/common/changes/@uifabric/styling/ahackett-formatter2_2017-09-29-19-29.json
new file mode 100644
index 0000000000000..562ca56b4fe8c
--- /dev/null
+++ b/common/changes/@uifabric/styling/ahackett-formatter2_2017-09-29-19-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Add a new success background color",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "ahackett@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/styling/src/interfaces/ISemanticColors.ts b/packages/styling/src/interfaces/ISemanticColors.ts
index 5df167f306ad0..84fe7deeba6fe 100644
--- a/packages/styling/src/interfaces/ISemanticColors.ts
+++ b/packages/styling/src/interfaces/ISemanticColors.ts
@@ -109,6 +109,10 @@ export interface ISemanticColors {
    * Foreground color for warning highlights
    */
   warningHighlight: string;
+  /**
+   * Background for success
+   */
+  successBackground: string;
 
   //// Input controls slots (text fields, checkboxes, radios...)
 
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index 253d7600ea999..6beaf3c13946a 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -97,6 +97,7 @@ function _makeSemanticColorsFromPalette(p: IPalette, isInverted: boolean): ISema
     blockingBackground: !isInverted ? 'rgba(234, 67, 0, .2)' : 'rgba(234, 67, 0, .5)',
     warningBackground: !isInverted ? 'rgba(255, 185, 0, .2)' : 'rgba(255, 251, 0, .6)',
     warningHighlight: !isInverted ? '#ffb900' : '#fff100',
+    successBackground: !isInverted ? 'rgba(186, 216, 10, .2)' : 'rgba(186, 216, 10, .4)',
 
     inputBorder: p.neutralTertiary,
     inputBorderHovered: p.neutralPrimary,

From ee5da5ff925423b7c3ded85ce07330ca82b08fcb Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Fri, 29 Sep 2017 16:52:06 -0500
Subject: [PATCH 0751/1641] Combobox: Fix styles from 5.0 upgrade (#2992)

* Use concatStyleSets instead of MergeStyleSets

* Remove typecasts.

* Remove some as string typecasts

* More classnames cleanup to remove typecasts

* Rush change
---
 .../combobox-fix-styles_2017-09-29-21-20.json | 11 ++++++++++
 .../combobox-fix-styles_2017-09-29-21-20.json | 11 ++++++++++
 .../components/LayoutGroup/LayoutGroup.tsx    |  2 +-
 .../ActivityItem/ActivityItem.classNames.ts   | 16 +++++++-------
 .../Button/BaseButton.classNames.ts           | 16 +++++++-------
 .../src/components/Button/BaseButton.tsx      |  2 +-
 .../src/components/Callout/CalloutContent.tsx |  2 +-
 .../Checkbox/Checkbox.classNames.ts           | 10 ++++-----
 .../ComboBox/ComboBox.classNames.ts           | 22 +++++++++----------
 .../components/ComboBox/ComboBox.styles.ts    | 10 ++++-----
 .../SpinButton/SpinButton.classNames.ts       | 14 ++++++------
 .../src/components/Tooltip/Tooltip.tsx        |  2 +-
 12 files changed, 70 insertions(+), 48 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/combobox-fix-styles_2017-09-29-21-20.json
 create mode 100644 common/changes/office-ui-fabric-react/combobox-fix-styles_2017-09-29-21-20.json

diff --git a/common/changes/@uifabric/experiments/combobox-fix-styles_2017-09-29-21-20.json b/common/changes/@uifabric/experiments/combobox-fix-styles_2017-09-29-21-20.json
new file mode 100644
index 0000000000000..23148268f01d3
--- /dev/null
+++ b/common/changes/@uifabric/experiments/combobox-fix-styles_2017-09-29-21-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Code cleanup after move to MergeStyles",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/combobox-fix-styles_2017-09-29-21-20.json b/common/changes/office-ui-fabric-react/combobox-fix-styles_2017-09-29-21-20.json
new file mode 100644
index 0000000000000..c5da9477fe5d8
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/combobox-fix-styles_2017-09-29-21-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Fix broken styles as part of the move to MergeStyles",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx b/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx
index 5fd58e6b62e6d..b7f6c1e9b7e25 100644
--- a/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx
+++ b/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx
@@ -48,7 +48,7 @@ export class LayoutGroup extends React.Component<ILayoutGroupProps, {}> {
                 flexGrow: 1
               }
 
-            ) as string
+            )
           }
         >
           { child }
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.classNames.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.classNames.ts
index 00a5a93b7c973..913625efa6dc2 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.classNames.ts
@@ -32,35 +32,35 @@ export const getClassNames = memoizeFunction((
       className,
       styles.root,
       isCompact && styles.isCompactRoot
-    ) as string,
+    ),
 
     personaContainer: mergeStyles(
       'ms-ActivityItem-personaContainer',
       styles.personaContainer,
       isCompact && styles.isCompactPersonaContainer
-    ) as string,
+    ),
 
     activityPersona: mergeStyles(
       'ms-ActivityItem-activityPersona',
       styles.activityPersona,
       isCompact && styles.isCompactPersona,
       !isCompact && activityPersonas && activityPersonas.length === 2 && styles.doublePersona
-    ) as string,
+    ),
 
     activityTypeIcon: mergeStyles(
       'ms-ActivityItem-activityTypeIcon',
       styles.activityTypeIcon,
       isCompact && styles.isCompactIcon
-    ) as string,
+    ),
 
     activityContent: mergeStyles(
       'ms-ActivityItem-activityContent',
       styles.activityContent,
       isCompact && styles.isCompactContent
-    ) as string,
+    ),
 
-    activityText: mergeStyles('ms-ActivityItem-activityText', styles.activityText) as string,
-    commentText: mergeStyles('ms-ActivityItem-commentText', styles.commentText) as string,
-    timeStamp: mergeStyles('ms-ActivityItem-timeStamp', styles.timeStamp) as string
+    activityText: mergeStyles('ms-ActivityItem-activityText', styles.activityText),
+    commentText: mergeStyles('ms-ActivityItem-commentText', styles.commentText),
+    timeStamp: mergeStyles('ms-ActivityItem-timeStamp', styles.timeStamp)
   };
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
index 23cfd71b13dff..ac32ad71e7625 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
@@ -67,17 +67,17 @@ export const getClassNames = memoizeFunction((
           ':active': styles.rootCheckedPressed
         }
       }
-    ) as string,
+    ),
 
     flexContainer: mergeStyles(
       'ms-Button-flexContainer',
       styles.flexContainer
-    ) as string,
+    ),
 
     textContainer: mergeStyles(
       'ms-Button-textContainer',
       styles.textContainer
-    ) as string,
+    ),
 
     icon: mergeStyles(
       'ms-Button-icon',
@@ -86,14 +86,14 @@ export const getClassNames = memoizeFunction((
       expanded && styles.iconExpanded,
       checked && styles.iconChecked,
       disabled && styles.iconDisabled,
-    ) as string,
+    ),
 
     label: mergeStyles(
       'ms-Button-label',
       styles.label,
       checked && styles.labelChecked,
       disabled && styles.labelDisabled,
-    ) as string,
+    ),
 
     menuIcon: mergeStyles(
       'ms-Button-menuIcon',
@@ -101,18 +101,18 @@ export const getClassNames = memoizeFunction((
       styles.menuIcon,
       checked && styles.menuIconChecked,
       disabled && styles.menuIconDisabled
-    ) as string,
+    ),
 
     description: mergeStyles(
       'ms-Button-description',
       styles.description,
       checked && styles.descriptionChecked,
       disabled && styles.descriptionDisabled
-    ) as string,
+    ),
 
     screenReaderText: mergeStyles(
       'ms-Button-screenReaderText',
       styles.screenReaderText
-    ) as string
+    )
   };
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index c866c7bc835e0..2e8459cb70ec9 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -322,7 +322,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     // If ariaDescription is given, descriptionId will be assigned to ariaDescriptionSpan,
     // otherwise it will be assigned to descriptionSpan.
     return ariaDescription ? (
-      <span className={ this._classNames.screenReaderText as string } id={ this._ariaDescriptionId }>{ ariaDescription }</span>
+      <span className={ this._classNames.screenReaderText } id={ this._ariaDescriptionId }>{ ariaDescription }</span>
     ) : (
         null
       );
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index 33b7232cb39e9..d35efb1f93b12 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -155,7 +155,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
               className,
               directionalClassName,
               !!calloutWidth && { width: calloutWidth }
-            ) as string }
+            ) }
           style={ positions ? positions.calloutPosition : OFF_SCREEN_STYLE }
           tabIndex={ -1 } // Safari and Firefox on Mac OS requires this to back-stop click events so focus remains in the Callout.
           // See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.classNames.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.classNames.ts
index 599c7f4b14651..1a9cb446ff02e 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.classNames.ts
@@ -43,14 +43,14 @@ export const getClassNames = memoizeFunction((
           }
         }
       ]
-    ) as string,
+    ),
 
     label: mergeStyles(
       'ms-Checkbox-label',
       styles.label,
       isReversed && styles.labelReversed,
       disabled && styles.labelDisabled
-    ) as string,
+    ),
 
     checkbox: mergeStyles(
       'ms-Checkbox-checkbox',
@@ -58,19 +58,19 @@ export const getClassNames = memoizeFunction((
       !disabled && isChecked && styles.checkboxChecked,
       disabled && !isChecked && styles.checkboxDisabled,
       disabled && isChecked && styles.checkboxCheckedDisabled,
-    ) as string,
+    ),
 
     checkmark: mergeStyles(
       styles.checkmark,
       !disabled && isChecked && styles.checkmarkChecked,
       disabled && !isChecked && styles.checkmarkDisabled,
       disabled && isChecked && styles.checkmarkCheckedDisabled,
-    ) as string,
+    ),
 
     text: mergeStyles(
       'ms-Checkbox-text',
       styles.text,
       disabled && styles.textDisabled
-    ) as string,
+    ),
   };
 });
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
index 289f431f9bf0b..448c587750fa5 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
@@ -21,7 +21,7 @@ export interface IComboBoxOptionClassNames {
 }
 
 export const getClassNames = memoizeFunction((
-  styles: IComboBoxStyles,
+  styles: Partial<IComboBoxStyles>,
   className: string,
   isOpen: boolean,
   disabled: boolean,
@@ -35,10 +35,10 @@ export const getClassNames = memoizeFunction((
       'ms-ComboBox-container',
       className,
       styles.container,
-    ) as string,
+    ),
     label: mergeStyles(
       styles.label
-    ) as string,
+    ),
     root: mergeStyles(
       'ms-ComboBox',
       isOpen && 'is-open',
@@ -55,31 +55,31 @@ export const getClassNames = memoizeFunction((
       disabled && [
         'is-disabled', styles.rootDisabled
       ],
-    ) as string,
+    ),
     input: mergeStyles(
       'ms-ComboBox-Input',
       styles.input,
       disabled && styles.inputDisabled
-    ) as string,
+    ),
     errorMessage: mergeStyles(
       styles.errorMessage
-    ) as string,
+    ),
     callout: mergeStyles(
       'ms-ComboBox-callout',
       styles.callout
-    ) as string,
+    ),
     optionsContainer: mergeStyles(
       'ms-ComboBox-optionsContainer',
       styles.optionsContainer
-    ) as string,
+    ),
     header: mergeStyles(
       'ms-ComboBox-header',
       styles.header
-    ) as string,
+    ),
     divider: mergeStyles(
       'ms-ComboBox-divider',
       styles.divider
-    ) as string,
+    ),
   };
 });
 
@@ -92,6 +92,6 @@ export const getComboBoxOptionClassNames = memoizeFunction((
     optionText: mergeStyles(
       'ms-ComboBox-optionText',
       styles.optionText
-    ) as string,
+    ),
   };
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index 52e0a4c5bd618..2a4211f8175ca 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -52,7 +52,7 @@ export const getOptionStyles = memoizeFunction((
   theme: ITheme,
   customStylesForAllOptions?: Partial<IComboBoxOptionStyles>,
   customOptionStylesForCurrentOption?: Partial<IComboBoxOptionStyles>,
-): IComboBoxOptionStyles => {
+): Partial<IComboBoxOptionStyles> => {
 
   const { semanticColors, palette } = theme;
 
@@ -135,7 +135,7 @@ export const getOptionStyles = memoizeFunction((
     },
   };
 
-  return concatStyleSets(optionStyles, customStylesForAllOptions, customOptionStylesForCurrentOption) as IComboBoxOptionStyles;
+  return concatStyleSets(optionStyles, customStylesForAllOptions, customOptionStylesForCurrentOption);
 });
 
 export const getCaretDownButtonStyles = memoizeFunction((
@@ -173,13 +173,13 @@ export const getCaretDownButtonStyles = memoizeFunction((
     },
     rootDisabled: getDisabledStyles(theme),
   };
-  return concatStyleSets(styles, customStyles) as IButtonStyles;
+  return concatStyleSets(styles, customStyles);
 });
 
 export const getStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: Partial<IComboBoxStyles>,
-): IComboBoxStyles => {
+): Partial<IComboBoxStyles> => {
 
   const { semanticColors, fonts, palette } = theme;
 
@@ -312,5 +312,5 @@ export const getStyles = memoizeFunction((
 
   };
 
-  return concatStyleSets(styles, customStyles) as IComboBoxStyles;
+  return concatStyleSets(styles, customStyles);
 });
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts
index 5eabb21cccbcc..938de9dc72d3f 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts
@@ -24,17 +24,17 @@ export const getClassNames = memoizeFunction((
   return {
     root: mergeStyles(
       styles.root
-    ) as string,
+    ),
     labelWrapper: mergeStyles(
       styles.labelWrapper,
       _getStyleForLabelBasedOnPosition(labelPosition, styles)
-    ) as string,
+    ),
     icon: mergeStyles(
       styles.icon,
-    ) as string,
+    ),
     label: mergeStyles(
       styles.label
-    ) as string,
+    ),
     spinButtonWrapper: mergeStyles(
       styles.spinButtonWrapper,
       _getStyleForRootBasedOnPosition(labelPosition, styles),
@@ -53,7 +53,7 @@ export const getClassNames = memoizeFunction((
         }
       ],
       disabled && styles.spinButtonWrapperDisabled
-    ) as string,
+    ),
     input: mergeStyles(
       'ms-spinButton-input',
       styles.input,
@@ -63,11 +63,11 @@ export const getClassNames = memoizeFunction((
         }
       },
       disabled && styles.inputDisabled,
-    ) as string,
+    ),
     arrowBox: mergeStyles(
       styles.arrowButtonsContainer,
       disabled && styles.arrowButtonsContainerDisabled
-    ) as string,
+    ),
   };
 });
 
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
index cea2f62b11608..70f580c9dacd1 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
@@ -50,7 +50,7 @@ export class Tooltip extends BaseComponent<ITooltipProps, any> {
           styles.root,
           (delay === TooltipDelay.medium) && styles.hasMediumDelay,
           (maxWidth !== null) && { maxWidth: maxWidth }
-        ) as string }
+        ) }
         targetElement={ targetElement }
         directionalHint={ directionalHint }
         directionalHintForRTL={ directionalHintForRTL }

From eba93b95a29c4f2613568c9cd386ee986d6333f1 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Fri, 29 Sep 2017 16:20:55 -0700
Subject: [PATCH 0752/1641] Stories - Callout, Label, Link, MessageBar, and
 Toggle (#2988)

* Add stories for Label, Link, MessageBar

* Update stories, add a few new ones

* Add doNotLayer prop to Callout so beak will show

* Remove doNotLayer, increase gapSpace

* Add .end() to Screener steps in stories

* Set FabricDecorator overflow to hidden

* Fix Callout target
---
 apps/vr-tests/src/stories/Callout.stories.tsx | 36 +++++++++++
 apps/vr-tests/src/stories/Label.stories.tsx   | 22 +++++++
 apps/vr-tests/src/stories/Link.stories.tsx    | 27 +++++++++
 .../src/stories/MessageBar.stories.tsx        | 59 +++++++++++++++++++
 apps/vr-tests/src/stories/Toggle.stories.tsx  | 47 +++++++++++++++
 .../src/utilities/FabricDecorator.tsx         |  2 +-
 6 files changed, 192 insertions(+), 1 deletion(-)
 create mode 100644 apps/vr-tests/src/stories/Callout.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/Label.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/Link.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/MessageBar.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/Toggle.stories.tsx

diff --git a/apps/vr-tests/src/stories/Callout.stories.tsx b/apps/vr-tests/src/stories/Callout.stories.tsx
new file mode 100644
index 0000000000000..c0c3ccfa50481
--- /dev/null
+++ b/apps/vr-tests/src/stories/Callout.stories.tsx
@@ -0,0 +1,36 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecoratorTall } from '../utilities';
+import { Callout, Link, DirectionalHint } from 'office-ui-fabric-react';
+
+storiesOf('Callout', module)
+  .addDecorator(FabricDecoratorTall)
+  .addDecorator(story => (
+    // tslint:disable-next-line:jsx-ban-props
+    <div>
+      <button id='button'>Hey</button>
+      { story() }
+    </div>
+  ))
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.ms-Layer' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (
+    <Callout
+      gapSpace={ 20 }
+      target='#button'
+    >
+      <p className='ms-CalloutExample-subText' id={ 'callout-description-1' }>
+        Message body is optional. If help documentation is available, consider adding a link to learn more at the bottom.
+        </p>
+      <Link className='ms-CalloutExample-link' href='http://microsoft.com'>Go to microsoft</Link>
+    </Callout>));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Label.stories.tsx b/apps/vr-tests/src/stories/Label.stories.tsx
new file mode 100644
index 0000000000000..a3087595abb52
--- /dev/null
+++ b/apps/vr-tests/src/stories/Label.stories.tsx
@@ -0,0 +1,22 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { Label, ILabelProps } from 'office-ui-fabric-react';
+
+storiesOf('Label', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (<Label>I'm a label</Label>))
+  .add('Disabled', () => (<Label disabled>I'm a disabled label</Label>))
+  .add('Required', () => (<Label required>I'm a required label</Label>));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Link.stories.tsx b/apps/vr-tests/src/stories/Link.stories.tsx
new file mode 100644
index 0000000000000..eb927d3046a6a
--- /dev/null
+++ b/apps/vr-tests/src/stories/Link.stories.tsx
@@ -0,0 +1,27 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { Link, ILinkProps } from 'office-ui-fabric-react';
+
+storiesOf('Link', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .hover('.ms-Link')
+        .snapshot('hover', { cropTo: '.testWrapper' })
+        .click('.ms-Link')
+        .hover('.ms-Link')
+        .snapshot('click', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (<Link href='#'>I'm a link</Link>))
+  .add('Disabled', () => (<Link href='#' disabled>I'm a disabled link</Link>))
+  .add('No Href', () => (<Link>I'm rendered as a button because I have no href</Link>));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/MessageBar.stories.tsx b/apps/vr-tests/src/stories/MessageBar.stories.tsx
new file mode 100644
index 0000000000000..863c86acbad8a
--- /dev/null
+++ b/apps/vr-tests/src/stories/MessageBar.stories.tsx
@@ -0,0 +1,59 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { DefaultButton, Link, MessageBar, IMessageBarProps, MessageBarType } from 'office-ui-fabric-react';
+
+let noop = (): void => { /**/ };
+// tslint:disable-next-line:max-line-length
+let longText = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque vestibulum tellus at malesuada vestibulum. Pellentesque eget mi sagittis, sagittis nisi a, tristique nisl. Sed sed consequat neque, et dignissim ipsum. Integer in neque vestibulum, aliquet erat nec, vestibulum ex. Nullam et imperdiet lectus. Cras tempus eu tortor a elementum. Proin non justo lacus. Donec tincidunt laoreet malesuada. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aenean augue nisl, lobortis ut sodales eu, convallis in metus.';
+let link = <Link href='www.bing.com'>Visit our website</Link>;
+
+storiesOf('MessageBar', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (<MessageBar>Info/default message bar. { link }</MessageBar>))
+  .add('Root dismiss', () => (
+    <MessageBar onDismiss={ noop }>Info/default message bar. { link }</MessageBar>))
+  .add('Root actions', () => (
+    <MessageBar
+      actions={
+        <div>
+          <DefaultButton>Yes</DefaultButton>
+          <DefaultButton>No</DefaultButton>
+        </div>
+      }
+    >Info/default message bar. { link }
+    </MessageBar>))
+  .add('Root multiline', () => (<MessageBar isMultiline>Info/default message bar. { longText }</MessageBar>))
+  .add('Root overflow', () => (<MessageBar isMultiline={ false }>Info/default message bar. { longText }  </MessageBar>))
+  .add('Error', () => (
+    <MessageBar messageBarType={ MessageBarType.error }>
+      Error message bar. { link }
+    </MessageBar>))
+  .add('Blocked', () => (
+    <MessageBar messageBarType={ MessageBarType.blocked }>
+      Blocked message bar. { link }
+    </MessageBar>))
+  .add('Severe Warning', () => (
+    <MessageBar messageBarType={ MessageBarType.severeWarning }>
+      Severe Warning message bar. { link }
+    </MessageBar>))
+  .add('Success', () => (
+    <MessageBar messageBarType={ MessageBarType.success }>
+      Success message bar. { link }
+    </MessageBar>))
+  .add('Warning', () => (
+    <MessageBar messageBarType={ MessageBarType.warning }>
+      Warning message bar. { link }
+    </MessageBar>));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Toggle.stories.tsx b/apps/vr-tests/src/stories/Toggle.stories.tsx
new file mode 100644
index 0000000000000..2c1b8530c990a
--- /dev/null
+++ b/apps/vr-tests/src/stories/Toggle.stories.tsx
@@ -0,0 +1,47 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { IToggleProps, Toggle } from 'office-ui-fabric-react';
+
+const baseProps: IToggleProps = {
+  label: 'Toggle label',
+  onText: 'On',
+  offText: 'Off'
+};
+
+storiesOf('Toggle', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Checked', () => (
+    <Toggle
+      { ...baseProps }
+      defaultChecked={ true }
+    />))
+  .add('Unchecked', () => (
+    <Toggle
+      { ...baseProps }
+      defaultChecked={ false }
+    />))
+  .add('Disabled checked', () => (
+    <Toggle
+      { ...baseProps }
+      defaultChecked={ true }
+      disabled={ true }
+    />))
+  .add('Disabled unhecked', () => (
+    <Toggle
+      { ...baseProps }
+      defaultChecked={ false }
+      disabled={ true }
+    />));
\ No newline at end of file
diff --git a/apps/vr-tests/src/utilities/FabricDecorator.tsx b/apps/vr-tests/src/utilities/FabricDecorator.tsx
index 7b863c63aca44..3e791bb82406b 100644
--- a/apps/vr-tests/src/utilities/FabricDecorator.tsx
+++ b/apps/vr-tests/src/utilities/FabricDecorator.tsx
@@ -7,7 +7,7 @@ import { Fabric } from 'office-ui-fabric-react';
 // tslint:disable:jsx-ban-props
 export const FabricDecorator = (story) => (
   <Fabric style={ { display: 'flex' } }>
-    <div className='testWrapper' style={ { padding: '10px' } }>
+    <div className='testWrapper' style={ { padding: '10px', overflow: 'hidden' } }>
       { story() }
     </div>
   </Fabric>

From 4ef41283e7667631964dd6cf973534fab4cbb1fa Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 29 Sep 2017 17:52:15 -0700
Subject: [PATCH 0753/1641] mergeStyleSets: Another fix to make type safety
 work (#2993)

* curiously, the false breaks type safety.

* Adding change file.
---
 .../merge-styles/another-fix_2017-09-30-00-41.json    | 11 +++++++++++
 packages/merge-styles/src/mergeStyleSets.ts           |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/merge-styles/another-fix_2017-09-30-00-41.json

diff --git a/common/changes/@uifabric/merge-styles/another-fix_2017-09-30-00-41.json b/common/changes/@uifabric/merge-styles/another-fix_2017-09-30-00-41.json
new file mode 100644
index 0000000000000..5839323900b33
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/another-fix_2017-09-30-00-41.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "Found that adding `false` to the list of accepted typings in `mergeStyleSets` was breaking type safety. Removed it.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/merge-styles/src/mergeStyleSets.ts b/packages/merge-styles/src/mergeStyleSets.ts
index 06401c4b50dee..5d3c2a4bfcd72 100644
--- a/packages/merge-styles/src/mergeStyleSets.ts
+++ b/packages/merge-styles/src/mergeStyleSets.ts
@@ -9,7 +9,7 @@ import { IStyle } from './IStyle';
  * @public
  */
 export function mergeStyleSets<T>(
-  ...cssSets: ({[P in keyof T]?: IStyle } | false | null | undefined)[]
+  ...cssSets: ({[P in keyof T]?: IStyle } | null | undefined)[]
 ): T {
   const classNameSet: Partial<T> = {};
   let cssSet = cssSets[0];

From 398b5a51924331a9a5d82531e1fbea7d0fcef0c4 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Sat, 30 Sep 2017 01:26:37 +0000
Subject: [PATCH 0754/1641] Applying package updates.

---
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../combobox-fix-styles_2017-09-29-21-20.json | 11 ----------
 .../another-fix_2017-09-30-00-41.json         | 11 ----------
 .../ahackett-formatter2_2017-09-29-19-29.json | 11 ----------
 .../combobox-fix-styles_2017-09-29-21-20.json | 11 ----------
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/CHANGELOG.json           | 19 ++++++++++++++++
 packages/experiments/CHANGELOG.md             |  9 +++++++-
 packages/experiments/package.json             |  4 ++--
 packages/merge-styles/CHANGELOG.json          | 14 ++++++++++++
 packages/merge-styles/CHANGELOG.md            |  9 +++++++-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 22 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 +++++++-
 packages/office-ui-fabric-react/package.json  |  6 ++---
 packages/styling/CHANGELOG.json               | 19 ++++++++++++++++
 packages/styling/CHANGELOG.md                 |  9 +++++++-
 packages/styling/package.json                 |  4 ++--
 scripts/package.json                          |  2 +-
 21 files changed, 119 insertions(+), 61 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/combobox-fix-styles_2017-09-29-21-20.json
 delete mode 100644 common/changes/@uifabric/merge-styles/another-fix_2017-09-30-00-41.json
 delete mode 100644 common/changes/@uifabric/styling/ahackett-formatter2_2017-09-29-19-29.json
 delete mode 100644 common/changes/office-ui-fabric-react/combobox-fix-styles_2017-09-29-21-20.json

diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index da18d8d0ab71b..1d3fb070926c0 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -26,7 +26,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.1.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.2.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 8acda40091ff7..a8ff911ff8896 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -24,7 +24,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.1.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.2.1 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 5fae3c87936c4..0e60aca6d7ae5 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.1.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.2.1 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/experiments/combobox-fix-styles_2017-09-29-21-20.json b/common/changes/@uifabric/experiments/combobox-fix-styles_2017-09-29-21-20.json
deleted file mode 100644
index 23148268f01d3..0000000000000
--- a/common/changes/@uifabric/experiments/combobox-fix-styles_2017-09-29-21-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Code cleanup after move to MergeStyles",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/another-fix_2017-09-30-00-41.json b/common/changes/@uifabric/merge-styles/another-fix_2017-09-30-00-41.json
deleted file mode 100644
index 5839323900b33..0000000000000
--- a/common/changes/@uifabric/merge-styles/another-fix_2017-09-30-00-41.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "Found that adding `false` to the list of accepted typings in `mergeStyleSets` was breaking type safety. Removed it.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/ahackett-formatter2_2017-09-29-19-29.json b/common/changes/@uifabric/styling/ahackett-formatter2_2017-09-29-19-29.json
deleted file mode 100644
index 562ca56b4fe8c..0000000000000
--- a/common/changes/@uifabric/styling/ahackett-formatter2_2017-09-29-19-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Add a new success background color",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "ahackett@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/combobox-fix-styles_2017-09-29-21-20.json b/common/changes/office-ui-fabric-react/combobox-fix-styles_2017-09-29-21-20.json
deleted file mode 100644
index c5da9477fe5d8..0000000000000
--- a/common/changes/office-ui-fabric-react/combobox-fix-styles_2017-09-29-21-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Fix broken styles as part of the move to MergeStyles",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 4a96a60ad8337..b44083ee15751 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -38,7 +38,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.0.1 <6.0.0",
+    "@uifabric/styling": ">=5.1.0 <6.0.0",
     "@uifabric/utilities": ">=5.0.1 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 27c79bc83e3a4..394c141a1f615 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.0.2",
+      "tag": "@uifabric/experiments_v5.0.2",
+      "date": "Sat, 30 Sep 2017 01:26:37 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "ee5da5ff925423b7c3ded85ce07330ca82b08fcb",
+            "comment": "Code cleanup after move to MergeStyles"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.2.0 <6.0.0` to `>=5.2.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.1",
       "tag": "@uifabric/experiments_v5.0.1",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 2ad95da8bdc0b..d12be64f2fddc 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Wed, 27 Sep 2017 00:20:58 GMT and should not be manually modified.
+This log was last generated on Sat, 30 Sep 2017 01:26:37 GMT and should not be manually modified.
+
+## 5.0.2
+Sat, 30 Sep 2017 01:26:37 GMT
+
+### Patches
+
+- Code cleanup after move to MergeStyles
 
 ## 5.0.1
 Wed, 27 Sep 2017 00:20:58 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index d281adca3186b..ac6ef0c6c251d 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.0.1",
+  "version": "5.0.2",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -41,7 +41,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.2.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.2.1 <6.0.0",
     "@uifabric/icons": ">=5.0.1 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index 3b0da5ecbf4de..ffff008957912 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.2.0",
+      "tag": "@uifabric/merge-styles_v5.2.0",
+      "date": "Sat, 30 Sep 2017 01:26:37 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "4ef41283e7667631964dd6cf973534fab4cbb1fa",
+            "comment": "Found that adding `false` to the list of accepted typings in `mergeStyleSets` was breaking type safety. Removed it."
+          }
+        ]
+      }
+    },
     {
       "version": "5.1.0",
       "tag": "@uifabric/merge-styles_v5.1.0",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index 44b394e8b0bdb..213ae9b582c1c 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Fri, 29 Sep 2017 10:20:24 GMT and should not be manually modified.
+This log was last generated on Sat, 30 Sep 2017 01:26:37 GMT and should not be manually modified.
+
+## 5.2.0
+Sat, 30 Sep 2017 01:26:37 GMT
+
+### Minor changes
+
+- Found that adding `false` to the list of accepted typings in `mergeStyleSets` was breaking type safety. Removed it.
 
 ## 5.1.0
 Fri, 29 Sep 2017 10:20:24 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index 7e91b9c6d8868..092dde1a426e2 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.1.0",
+  "version": "5.2.0",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 2a2c9ff0f7c0c..3f6a56ab78bba 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.2.1",
+      "tag": "office-ui-fabric-react_v5.2.1",
+      "date": "Sat, 30 Sep 2017 01:26:37 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "ee5da5ff925423b7c3ded85ce07330ca82b08fcb",
+            "comment": "ComboBox: Fix broken styles as part of the move to MergeStyles"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.1.0 <6.0.0` to `>=5.2.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.0.1 <6.0.0` to `>=5.1.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.2.0",
       "tag": "office-ui-fabric-react_v5.2.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index ca79948ff0ad3..9ffc6d558774b 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 29 Sep 2017 10:20:24 GMT and should not be manually modified.
+This log was last generated on Sat, 30 Sep 2017 01:26:37 GMT and should not be manually modified.
+
+## 5.2.1
+Sat, 30 Sep 2017 01:26:37 GMT
+
+### Patches
+
+- ComboBox: Fix broken styles as part of the move to MergeStyles
 
 ## 5.2.0
 Fri, 29 Sep 2017 10:20:24 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 33223f600cdfd..bc512d5f09158 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.2.0",
+  "version": "5.2.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,8 +44,8 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.0.1 <6.0.0",
-    "@uifabric/merge-styles": ">=5.1.0 <6.0.0",
-    "@uifabric/styling": ">=5.0.1 <6.0.0",
+    "@uifabric/merge-styles": ">=5.2.0 <6.0.0",
+    "@uifabric/styling": ">=5.1.0 <6.0.0",
     "@uifabric/utilities": ">=5.0.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 51d7b6f05a554..149b1211b69b8 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.1.0",
+      "tag": "@uifabric/styling_v5.1.0",
+      "date": "Sat, 30 Sep 2017 01:26:37 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Amy Hackett <ahackett@microsoft.com>",
+            "commit": "93a77f83352b357bae5d6b509a40eeec28d56a32",
+            "comment": "Add a new success background color"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.1.0 <6.0.0` to `>=5.2.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.1",
       "tag": "@uifabric/styling_v5.0.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 021c1bae09790..0aeabf0c947b2 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Wed, 27 Sep 2017 00:20:58 GMT and should not be manually modified.
+This log was last generated on Sat, 30 Sep 2017 01:26:37 GMT and should not be manually modified.
+
+## 5.1.0
+Sat, 30 Sep 2017 01:26:37 GMT
+
+### Minor changes
+
+- Add a new success background color
 
 ## 5.0.1
 Wed, 27 Sep 2017 00:20:58 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index cf2aa9859110a..92c1a85d7621c 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.0.1",
+  "version": "5.1.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -21,7 +21,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/utilities": ">=5.0.1 <6.0.0",
-    "@uifabric/merge-styles": ">=5.1.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/scripts/package.json b/scripts/package.json
index 429efc562e84d..413b9fa06fe12 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -9,7 +9,7 @@
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@microsoft/loader-load-themed-styles": "^1.4.2",
-    "@uifabric/merge-styles": ">=5.1.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.2.0 <6.0.0",
     "autoprefixer": "^7.1.2",
     "awesome-typescript-loader": "^3.2.3",
     "chalk": "^2.1.0",

From ba0980d54fcc55b381be04f5478e84054f192dff Mon Sep 17 00:00:00 2001
From: MirandaGe <lingge@microsoft.com>
Date: Sat, 30 Sep 2017 14:39:42 +0800
Subject: [PATCH 0755/1641] Persona: Allow for custom coin sizes (#2912)

* Add renderer for persona image

* change coin props

* add example code

* run rush change

* add min-width to persona

* make presence style can work well with custom coin size

* merge conflict of master

* Update lingge-persona-customize-image_2017-09-21-03-12.json

* Update lingge-persona-customize-image_2017-09-21-03-12.json
---
 ...sona-customize-image_2017-09-21-03-12.json | 11 ++++++++
 ...sona-customize-image_2017-09-21-03-12.json | 11 ++++++++
 ...sona-customize-image_2017-09-21-03-12.json | 11 ++++++++
 ...sona-customize-image_2017-09-21-03-12.json | 11 ++++++++
 ...sona-customize-image_2017-09-21-03-12.json | 11 ++++++++
 ...sona-customize-image_2017-09-21-03-12.json | 11 ++++++++
 .../src/components/Persona/Persona.Props.ts   | 10 +++++++
 .../src/components/Persona/Persona.scss       | 27 +++----------------
 .../src/components/Persona/Persona.tsx        |  5 ++++
 .../src/components/Persona/PersonaCoin.tsx    | 16 ++++++++---
 .../examples/Persona.CustomRender.Example.tsx |  8 ++++++
 .../src/components/Persona/index.ts           |  1 +
 12 files changed, 105 insertions(+), 28 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/lingge-persona-customize-image_2017-09-21-03-12.json
 create mode 100644 common/changes/@uifabric/experiments/lingge-persona-customize-image_2017-09-21-03-12.json
 create mode 100644 common/changes/@uifabric/fabric-website/lingge-persona-customize-image_2017-09-21-03-12.json
 create mode 100644 common/changes/@uifabric/styling/lingge-persona-customize-image_2017-09-21-03-12.json
 create mode 100644 common/changes/@uifabric/utilities/lingge-persona-customize-image_2017-09-21-03-12.json
 create mode 100644 common/changes/office-ui-fabric-react/lingge-persona-customize-image_2017-09-21-03-12.json

diff --git a/common/changes/@uifabric/example-app-base/lingge-persona-customize-image_2017-09-21-03-12.json b/common/changes/@uifabric/example-app-base/lingge-persona-customize-image_2017-09-21-03-12.json
new file mode 100644
index 0000000000000..bdd938bebfabb
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/lingge-persona-customize-image_2017-09-21-03-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "lingge@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/lingge-persona-customize-image_2017-09-21-03-12.json b/common/changes/@uifabric/experiments/lingge-persona-customize-image_2017-09-21-03-12.json
new file mode 100644
index 0000000000000..28befcc692f19
--- /dev/null
+++ b/common/changes/@uifabric/experiments/lingge-persona-customize-image_2017-09-21-03-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/experiments",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "lingge@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/lingge-persona-customize-image_2017-09-21-03-12.json b/common/changes/@uifabric/fabric-website/lingge-persona-customize-image_2017-09-21-03-12.json
new file mode 100644
index 0000000000000..4271ea2e06e39
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/lingge-persona-customize-image_2017-09-21-03-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lingge@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/lingge-persona-customize-image_2017-09-21-03-12.json b/common/changes/@uifabric/styling/lingge-persona-customize-image_2017-09-21-03-12.json
new file mode 100644
index 0000000000000..bb02430c03303
--- /dev/null
+++ b/common/changes/@uifabric/styling/lingge-persona-customize-image_2017-09-21-03-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "lingge@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/lingge-persona-customize-image_2017-09-21-03-12.json b/common/changes/@uifabric/utilities/lingge-persona-customize-image_2017-09-21-03-12.json
new file mode 100644
index 0000000000000..51a0da35d1f75
--- /dev/null
+++ b/common/changes/@uifabric/utilities/lingge-persona-customize-image_2017-09-21-03-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "lingge@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/lingge-persona-customize-image_2017-09-21-03-12.json b/common/changes/office-ui-fabric-react/lingge-persona-customize-image_2017-09-21-03-12.json
new file mode 100644
index 0000000000000..2637c48d312cc
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/lingge-persona-customize-image_2017-09-21-03-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "PersonaCoin: added `coinSize` prop to allow for customized sizes.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lingge@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts b/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
index 6100112cf6cdb..d89cf1e309bb9 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
@@ -118,6 +118,16 @@ export interface IPersonaProps extends React.HTMLAttributes<Persona> {
    * If true, show the secondary text line regardless of the size of the persona
    */
   showSecondaryText?: boolean;
+
+  /**
+   * Optional custom persona coin size in pixel.
+   */
+  coinSize?: number;
+
+  /**
+   * Optional HTML element props for Persona coin.
+   */
+  coinProps?: React.HTMLAttributes<HTMLDivElement>;
 }
 
 export enum PersonaSize {
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
index dca179310cee7..d2820c65dc8a3 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
@@ -87,12 +87,10 @@ $ms-Persona-presenceSizeXl: 28px;
 
 .imageArea {
   position: relative;
-  overflow: hidden;
   text-align: center;
-  flex: 0 0 $ms-Persona-sizeMd;
+  flex: 0 0 auto;
   height: $ms-Persona-sizeMd;
   width: $ms-Persona-sizeMd;
-  border-radius: 50%;
 
   @include high-contrast {
     border: 1px solid WindowText;
@@ -117,6 +115,7 @@ $ms-Persona-presenceSizeXl: 28px;
 }
 
 .initials {
+  border-radius: 50%;
   color: $ms-color-white;
   font-size: $ms-font-size-l;
   font-weight: $ms-font-weight-regular;
@@ -192,7 +191,7 @@ $ms-Persona-presenceSizeXl: 28px;
   width: $ms-Persona-presenceSizeMd;
   border-radius: 50%;
   top: auto;
-  @include ms-left(34px);
+  @include ms-right(0px);
   bottom: -1px;
   border: 2px solid $ms-color-white;
   text-align: center;
@@ -328,7 +327,6 @@ $ms-Persona-presenceSizeXl: 28px;
 
   .imageArea,
   .image {
-    flex: 0 0 $ms-Persona-size16;
     height: $ms-Persona-size16;
     width: $ms-Persona-size16;
   }
@@ -348,7 +346,6 @@ $ms-Persona-presenceSizeXl: 28px;
     height: $ms-Persona-presenceSizeXxs;
     width: $ms-Persona-presenceSizeXxs;
     border: 2px solid $ms-color-white;
-    @include ms-left(20px);
   }
 
   .presenceIcon {
@@ -376,7 +373,6 @@ $ms-Persona-presenceSizeXl: 28px;
 .rootIsExtraExtraSmall {
   .imageArea,
   .image {
-    flex: 0 0 $ms-Persona-sizeXxs;
     height: $ms-Persona-sizeXxs;
     width: $ms-Persona-sizeXxs;
   }
@@ -396,7 +392,6 @@ $ms-Persona-presenceSizeXl: 28px;
     height: $ms-Persona-presenceSizeXxs;
     width: $ms-Persona-presenceSizeXxs;
     border: 2px solid $ms-color-white;
-    @include ms-left(14px);
     top: 18px;
 
     &:after {
@@ -445,7 +440,6 @@ $ms-Persona-presenceSizeXl: 28px;
 .rootIs28 {
   .imageArea,
   .image {
-    flex: 0 0 $ms-Persona-size28;
     height: $ms-Persona-size28;
     width: $ms-Persona-size28;
   }
@@ -465,7 +459,6 @@ $ms-Persona-presenceSizeXl: 28px;
     height: $ms-Persona-presenceSizeXxs;
     width: $ms-Persona-presenceSizeXxs;
     border: 2px solid $ms-color-white;
-    @include ms-left(20px);
     top: 18px;
 
     &:after {
@@ -513,7 +506,6 @@ $ms-Persona-presenceSizeXl: 28px;
 .rootIsExtraSmall {
   .imageArea,
   .image {
-    flex: 0 0 $ms-Persona-sizeXs;
     height: $ms-Persona-sizeXs;
     width: $ms-Persona-sizeXs;
   }
@@ -529,10 +521,6 @@ $ms-Persona-presenceSizeXl: 28px;
     line-height: $ms-Persona-sizeXs;
   }
 
-  .presence {
-    @include ms-left(19px);
-  }
-
   .details {
     padding: 0 8px;
   }
@@ -567,7 +555,6 @@ $ms-Persona-presenceSizeXl: 28px;
 .rootIsSmall {
   .imageArea,
   .image {
-    flex: 0 0 $ms-Persona-sizeSm;
     height: $ms-Persona-sizeSm;
     width: $ms-Persona-sizeSm;
   }
@@ -583,10 +570,6 @@ $ms-Persona-presenceSizeXl: 28px;
     line-height: $ms-Persona-sizeSm;
   }
 
-  .presence {
-    @include ms-left(27px);
-  }
-
   .primaryText {
     font-size: $ms-font-size-m;
   }
@@ -603,7 +586,6 @@ $ms-Persona-presenceSizeXl: 28px;
 .rootIsLarge {
   .imageArea,
   .image {
-    flex: 0 0 $ms-Persona-sizeLg;
     height: $ms-Persona-sizeLg;
     width: $ms-Persona-sizeLg;
   }
@@ -620,7 +602,6 @@ $ms-Persona-presenceSizeXl: 28px;
   }
 
   .presence {
-    @include ms-left(49px);
     height: $ms-Persona-presenceSizeLg;
     width: $ms-Persona-presenceSizeLg;
     border-width: 3px;
@@ -647,7 +628,6 @@ $ms-Persona-presenceSizeXl: 28px;
 .rootIsExtraLarge {
   .imageArea,
   .image {
-    flex: 0 0 $ms-Persona-sizeXl;
     height: $ms-Persona-sizeXl;
     width: $ms-Persona-sizeXl;
   }
@@ -666,7 +646,6 @@ $ms-Persona-presenceSizeXl: 28px;
   .presence {
     height: $ms-Persona-presenceSizeXl;
     width: $ms-Persona-presenceSizeXl;
-    @include ms-left(71px);
     border-width: 4px;
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index caaeb5518260d..d85baf9646458 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -46,6 +46,8 @@ export class Persona extends BaseComponent<IPersonaProps, {}> {
     // These properties are to be explicitly passed into PersonaCoin because they are the only props directly used
     let {
       className,
+      coinProps,
+      coinSize,
       imageUrl,
       imageAlt,
       imageInitials,
@@ -58,6 +60,8 @@ export class Persona extends BaseComponent<IPersonaProps, {}> {
      } = this.props;
 
     let personaCoinProps = {
+      coinProps,
+      coinSize,
       imageUrl,
       imageAlt,
       imageInitials,
@@ -103,6 +107,7 @@ export class Persona extends BaseComponent<IPersonaProps, {}> {
             showSecondaryText && styles.showSecondaryText
           )
         }
+        style={ coinSize ? { height: coinSize, minWidth: coinSize } : undefined }
       >
         <PersonaCoin { ...personaCoinProps } />
         { (!hidePersonaDetails || (size === PersonaSize.tiny)) && personaDetails }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
index 4aa04ceb71a77..1984ad4648a5e 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
@@ -75,6 +75,8 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
 
   public render(): JSX.Element | null {
     let {
+      coinProps,
+      coinSize,
       imageUrl,
       imageAlt,
       initialsColor,
@@ -86,6 +88,7 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
 
     let size = this.props.size as PersonaSize;
     let divProps = getNativeProps(this.props, divProperties);
+    let coinSizeStyle = coinSize ? { width: coinSize, height: coinSize } : undefined;
 
     initialsColor = initialsColor !== undefined && initialsColor !== null ? initialsColor : this._getColorFromName(primaryText);
 
@@ -95,7 +98,11 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
         className={ css('ms-Persona-coin', PERSONA_SIZE[size]) }
       >
         { size !== PersonaSize.tiny && (
-          <div className={ css('ms-Persona-imageArea', styles.imageArea) }>
+          <div
+            { ...coinProps }
+            className={ css('ms-Persona-imageArea', styles.imageArea) }
+            style={ coinSizeStyle }
+          >
             {
               !this.state.isImageLoaded &&
               (
@@ -105,6 +112,7 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
                     styles.initials,
                     PERSONA_INITIALS_COLOR[initialsColor]
                   ) }
+                  style={ coinSizeStyle }
                   aria-hidden='true'
                 >
                   { onRenderInitials(this.props, this._onRenderInitials) }
@@ -115,16 +123,16 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
               className={ css('ms-Persona-image', styles.image) }
               imageFit={ ImageFit.cover }
               src={ imageUrl }
-              width={ SIZE_TO_PIXELS[size] }
-              height={ SIZE_TO_PIXELS[size] }
+              width={ coinSize || SIZE_TO_PIXELS[size] }
+              height={ coinSize || SIZE_TO_PIXELS[size] }
               alt={ imageAlt }
               shouldFadeIn={ imageShouldFadeIn }
               shouldStartVisible={ imageShouldStartVisible }
               onLoadingStateChange={ this._onPhotoLoadingStateChange }
             />
+            <PersonaPresence { ...this.props } />
           </div>
         ) }
-        <PersonaPresence { ...this.props } />
         { this.props.children }
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx
index d9df0bc788a30..94c39efa2db84 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx
@@ -33,6 +33,14 @@ export class PersonaCustomRenderExample extends React.Component<React.Props<Pers
           presence={ PersonaPresence.offline }
           onRenderSecondaryText={ this._onRenderSecondaryText }
         />
+        <div>custom coin size = 150, Persona size is extraLarge.</div>
+        <Persona
+          { ...examplePersona }
+          size={ PersonaSize.extraLarge }
+          coinSize={ 150 }
+          presence={ PersonaPresence.offline }
+          onRenderSecondaryText={ this._onRenderSecondaryText }
+        />
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/index.ts b/packages/office-ui-fabric-react/src/components/Persona/index.ts
index 91df826587469..59b5e2e9efa51 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/index.ts
@@ -1,3 +1,4 @@
 export * from './Persona';
 export * from './Persona.Props';
 export * from './PersonaConsts';
+export * from './PersonaCoin';

From c157e8c39947536b072b663c76a44c245311464e Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 30 Sep 2017 20:39:01 -0700
Subject: [PATCH 0756/1641] asdf

---
 foo.ts | 1 +
 1 file changed, 1 insertion(+)
 create mode 100644 foo.ts

diff --git a/foo.ts b/foo.ts
new file mode 100644
index 0000000000000..c21f50c99165b
--- /dev/null
+++ b/foo.ts
@@ -0,0 +1 @@
+export * from 'asdf';

From 918bccd0bbb548f0cb91dd2e8b8f92c5d63cf0c3 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 30 Sep 2017 20:39:35 -0700
Subject: [PATCH 0757/1641] remov

---
 foo.ts | 1 -
 1 file changed, 1 deletion(-)
 delete mode 100644 foo.ts

diff --git a/foo.ts b/foo.ts
deleted file mode 100644
index c21f50c99165b..0000000000000
--- a/foo.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from 'asdf';

From 502b97c4a64963115a488d67faaecf6131853027 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 2 Oct 2017 10:19:44 +0000
Subject: [PATCH 0758/1641] Applying package updates.

---
 apps/fabric-website/package.json                   |  2 +-
 apps/ssr-tests/package.json                        |  2 +-
 apps/test-bundle-button/package.json               |  2 +-
 apps/todo-app/package.json                         |  2 +-
 apps/vr-tests/package.json                         |  2 +-
 ...e-persona-customize-image_2017-09-21-03-12.json | 11 -----------
 ...e-persona-customize-image_2017-09-21-03-12.json | 11 -----------
 ...e-persona-customize-image_2017-09-21-03-12.json | 11 -----------
 ...e-persona-customize-image_2017-09-21-03-12.json | 11 -----------
 ...e-persona-customize-image_2017-09-21-03-12.json | 11 -----------
 ...e-persona-customize-image_2017-09-21-03-12.json | 11 -----------
 packages/experiments/package.json                  |  2 +-
 packages/office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md       |  9 ++++++++-
 packages/office-ui-fabric-react/package.json       |  2 +-
 15 files changed, 29 insertions(+), 74 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/lingge-persona-customize-image_2017-09-21-03-12.json
 delete mode 100644 common/changes/@uifabric/experiments/lingge-persona-customize-image_2017-09-21-03-12.json
 delete mode 100644 common/changes/@uifabric/fabric-website/lingge-persona-customize-image_2017-09-21-03-12.json
 delete mode 100644 common/changes/@uifabric/styling/lingge-persona-customize-image_2017-09-21-03-12.json
 delete mode 100644 common/changes/@uifabric/utilities/lingge-persona-customize-image_2017-09-21-03-12.json
 delete mode 100644 common/changes/office-ui-fabric-react/lingge-persona-customize-image_2017-09-21-03-12.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 1115f695fa911..84cc7f0ad3c7e 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -47,7 +47,7 @@
     "@uifabric/icons": ">=5.0.1 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.2.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 80908aed19e4e..01be0b2189004 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.2.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-addons-test-utils": "^15.4.2",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 1d3fb070926c0..f97543f676a21 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -26,7 +26,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.2.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index a8ff911ff8896..29aec7f2fb08c 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -24,7 +24,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.2.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 0e60aca6d7ae5..2fd4c3fd8d46d 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.2.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/example-app-base/lingge-persona-customize-image_2017-09-21-03-12.json b/common/changes/@uifabric/example-app-base/lingge-persona-customize-image_2017-09-21-03-12.json
deleted file mode 100644
index bdd938bebfabb..0000000000000
--- a/common/changes/@uifabric/example-app-base/lingge-persona-customize-image_2017-09-21-03-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "lingge@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/lingge-persona-customize-image_2017-09-21-03-12.json b/common/changes/@uifabric/experiments/lingge-persona-customize-image_2017-09-21-03-12.json
deleted file mode 100644
index 28befcc692f19..0000000000000
--- a/common/changes/@uifabric/experiments/lingge-persona-customize-image_2017-09-21-03-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/experiments",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "lingge@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/lingge-persona-customize-image_2017-09-21-03-12.json b/common/changes/@uifabric/fabric-website/lingge-persona-customize-image_2017-09-21-03-12.json
deleted file mode 100644
index 4271ea2e06e39..0000000000000
--- a/common/changes/@uifabric/fabric-website/lingge-persona-customize-image_2017-09-21-03-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lingge@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/lingge-persona-customize-image_2017-09-21-03-12.json b/common/changes/@uifabric/styling/lingge-persona-customize-image_2017-09-21-03-12.json
deleted file mode 100644
index bb02430c03303..0000000000000
--- a/common/changes/@uifabric/styling/lingge-persona-customize-image_2017-09-21-03-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "lingge@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/lingge-persona-customize-image_2017-09-21-03-12.json b/common/changes/@uifabric/utilities/lingge-persona-customize-image_2017-09-21-03-12.json
deleted file mode 100644
index 51a0da35d1f75..0000000000000
--- a/common/changes/@uifabric/utilities/lingge-persona-customize-image_2017-09-21-03-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "lingge@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/lingge-persona-customize-image_2017-09-21-03-12.json b/common/changes/office-ui-fabric-react/lingge-persona-customize-image_2017-09-21-03-12.json
deleted file mode 100644
index 2637c48d312cc..0000000000000
--- a/common/changes/office-ui-fabric-react/lingge-persona-customize-image_2017-09-21-03-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "PersonaCoin: added `coinSize` prop to allow for customized sizes.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lingge@microsoft.com"
-}
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index ac6ef0c6c251d..f6b3a64338736 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -41,7 +41,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.2.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
     "@uifabric/icons": ">=5.0.1 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 3f6a56ab78bba..1203960bd8f9f 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.3.0",
+      "tag": "office-ui-fabric-react_v5.3.0",
+      "date": "Mon, 02 Oct 2017 10:19:43 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "MirandaGe <lingge@microsoft.com>",
+            "commit": "ba0980d54fcc55b381be04f5478e84054f192dff",
+            "comment": "PersonaCoin: added `coinSize` prop to allow for customized sizes."
+          }
+        ]
+      }
+    },
     {
       "version": "5.2.1",
       "tag": "office-ui-fabric-react_v5.2.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 9ffc6d558774b..6549a1b57a3c1 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Sat, 30 Sep 2017 01:26:37 GMT and should not be manually modified.
+This log was last generated on Mon, 02 Oct 2017 10:19:43 GMT and should not be manually modified.
+
+## 5.3.0
+Mon, 02 Oct 2017 10:19:43 GMT
+
+### Minor changes
+
+- PersonaCoin: added `coinSize` prop to allow for customized sizes.
 
 ## 5.2.1
 Sat, 30 Sep 2017 01:26:37 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index bc512d5f09158..62bad9a6b5db5 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.2.1",
+  "version": "5.3.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 6e4d8f5e07328bad7c50e0671d85c1fb8a9db79a Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Mon, 2 Oct 2017 11:41:11 -0700
Subject: [PATCH 0759/1641] Tooltip page - removed duplicate header (#2999)

* Fixed duplicate header on tooltip page

* Added change file
---
 .../tooltip-page_2017-10-02-18-24.json                | 11 +++++++++++
 .../src/components/Tooltip/TooltipPage.tsx            |  4 +++-
 2 files changed, 14 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/tooltip-page_2017-10-02-18-24.json

diff --git a/common/changes/office-ui-fabric-react/tooltip-page_2017-10-02-18-24.json b/common/changes/office-ui-fabric-react/tooltip-page_2017-10-02-18-24.json
new file mode 100644
index 0000000000000..51d22cf97c101
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/tooltip-page_2017-10-02-18-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixed duplicate header on Tooltip page.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.tsx
index cb4bf35628943..393800713b208 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.tsx
@@ -4,6 +4,7 @@ import { LayerHost } from 'office-ui-fabric-react/lib/Layer';
 import {
   ExampleCard,
   ComponentPage,
+  IComponentDemoPageProps,
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { TooltipCustomExample } from './examples/Tooltip.Custom.Example';
@@ -18,7 +19,7 @@ const TooltipBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/
 const TooltipCustomExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Tooltip/examples/Tooltip.Custom.Example.tsx') as string;
 const TooltipOverflowExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Tooltip/examples/Tooltip.Overflow.Example.tsx') as string;
 
-export class TooltipPage extends React.Component<any, any> {
+export class TooltipPage extends React.Component<IComponentDemoPageProps, any> {
   public render() {
     return (
       <ComponentPage
@@ -52,6 +53,7 @@ export class TooltipPage extends React.Component<any, any> {
             <span> supplement content associated with a specific UI component.</span>
           </div>
         }
+        isHeaderVisible={ this.props.isHeaderVisible }
         componentStatus={
           <ComponentStatus
             {...TooltipStatus}

From a245be8240b07346d4eba30c622c22e202463724 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Mon, 2 Oct 2017 16:52:18 -0700
Subject: [PATCH 0760/1641] Dropdown: fixed logic in getSelectedIndex (#3003)

* Dropdown: fixed logic in getSelectedIndex to not return true if selectedKey and option.selected are both true

* Change file
---
 .../dropdown-selectedKey-bugfix_2017-10-02-21-17.json | 11 +++++++++++
 .../src/components/Dropdown/Dropdown.tsx              | 10 ++++++++--
 2 files changed, 19 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/dropdown-selectedKey-bugfix_2017-10-02-21-17.json

diff --git a/common/changes/office-ui-fabric-react/dropdown-selectedKey-bugfix_2017-10-02-21-17.json b/common/changes/office-ui-fabric-react/dropdown-selectedKey-bugfix_2017-10-02-21-17.json
new file mode 100644
index 0000000000000..62304a3ebf94d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/dropdown-selectedKey-bugfix_2017-10-02-21-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: fixed logic in getSelectedIndex to support controlled uses",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index d898175e73579..365d6a780cc02 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -571,8 +571,14 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   private _getSelectedIndex(options: IDropdownOption[], selectedKey: string | number): number {
-    // tslint:disable-next-line:triple-equals
-    return findIndex(options, (option => ((option.isSelected || option.selected) || (selectedKey != null) && option.key === selectedKey)));
+    return findIndex(options, (option => {
+      // tslint:disable-next-line:triple-equals
+      if (selectedKey != null) {
+        return option.key === selectedKey;
+      } else {
+        return !!option.isSelected || !!option.selected;
+      }
+    }));
   }
 
   @autobind

From ca3473a1d65c8124901173ee0aeb7c7af5b220ef Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Mon, 2 Oct 2017 17:45:21 -0700
Subject: [PATCH 0761/1641] Visual bug fixes for website, mostly text and
 spacing updates (#3004)

* Updated text per Teams convo with Laura and Angela

* Reordered TextFieldPage to address recent addition hierarchy

* Example spacing improvement for TextField

* Fixed link to components page

* Updated SharePoint link text

* Padding fixes for content in grids. More rtl friendly.

* Fixed ComboBox error message spacing to match TextFIeld

* Gave ComboBox some breathing room like other examples have

* Added change files
---
 .../src/pages/GetStarted/GetStartedPage.module.scss  |  2 +-
 .../src/pages/GetStarted/GetStartedPage.tsx          | 10 +++++-----
 .../src/pages/ResourcesPage/ResourcesPage.tsx        |  6 +++---
 .../Styles/BrandIconsPage/BrandIconsPage.module.scss |  2 +-
 .../pages/Styles/ColorsPage/ColorsPage.module.scss   |  4 ++++
 .../src/pages/Styles/ColorsPage/ColorsPage.tsx       |  5 +++--
 .../general-website-bugs_2017-10-02-22-18.json       | 11 +++++++++++
 .../general-website-bugs_2017-10-02-22-18.json       | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.styles.ts       |  3 ++-
 .../ComboBox/examples/ComboBox.Basic.Example.scss    |  4 ++++
 .../src/components/TextField/TextFieldPage.tsx       | 12 ++++++------
 .../TextField/examples/TextField.Basic.Example.tsx   |  3 ++-
 .../examples/TextField.Borderless.Example.tsx        |  3 ++-
 .../examples/TextField.ErrorMessage.Example.tsx      |  3 ++-
 .../TextField/examples/TextField.Examples.scss       |  5 +++++
 .../examples/TextField.ImplementationExamples.tsx    |  3 ++-
 .../examples/TextField.Multiline.Example.tsx         |  3 ++-
 .../examples/TextField.Placeholder.Example.tsx       |  3 ++-
 .../examples/TextField.Underlined.Example.tsx        |  3 ++-
 19 files changed, 70 insertions(+), 26 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/general-website-bugs_2017-10-02-22-18.json
 create mode 100644 common/changes/office-ui-fabric-react/general-website-bugs_2017-10-02-22-18.json
 create mode 100644 packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Examples.scss

diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
index 460722261a607..ae041d2aad1db 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
@@ -106,7 +106,7 @@
   }
 
   .contentInGrid {
-    padding-left: $contentInGrid;
+    @include ms-padding-left($contentInGrid);
   }
 }
 
diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
index 931228ca56614..4b8a0b45a86d5 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
@@ -44,11 +44,11 @@ export class GetStartedPage extends React.Component<any, any> {
         <div className={ styles.designSection }>
           <h2>Use our design language in your own experience</h2>
           <div className='ms-Grid ms-Grid--wide'>
-            <div className='ms-Grid-row'>
+            <div className={ css('ms-Grid-row', styles.contentInGrid) }>
               <div className={ css('ms-Grid-col ms-lg4', styles.feature) }>
-                <img className={ styles.contentInGrid } src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/get-started-styles.svg' } alt='Illustration of Typography and color swatches.' />
-                <div className={ css(styles.title, styles.contentInGrid) }>Styles</div>
-                <div className={ css(styles.description, styles.contentInGrid) }>Fabric gives you access to Segoe, Microsoft&rsquo;s official typeface, along with the color palette, type ramp, icons, and responsive grid for Office 365.</div>
+                <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/get-started-styles.svg' } alt='Illustration of Typography and color swatches.' />
+                <div className={ styles.title }>Styles</div>
+                <div className={ styles.description }>Fabric gives you access to Segoe, Microsoft&rsquo;s official typeface, along with the color palette, type ramp, icons, and responsive grid for Office 365.</div>
               </div>
               <div className={ css('ms-Grid-col ms-lg4', styles.feature) }>
                 <img src={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/images/get-started-icons.svg' } alt='Illustration of Icons' />
@@ -135,7 +135,7 @@ const MyPage = () => (<Fabric><DefaultButton>I am a button.</DefaultButton></Fab
 ReactDOM.render(<MyPage />, document.body.firstChild);`
                 }
               </CodeBlock>
-              <p>For more information about using components, check out the <a className={ styles.getStartedLink } href='#/components/'>components page</a>.</p>
+              <p>For more information about using components, check out the <a className={ styles.getStartedLink } href='#/components'>components page</a>.</p>
             </li>
             <li>
               <p>You can also reference type styles for any text element:</p>
diff --git a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
index f4faff7a17cc8..a898a09daa306 100644
--- a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
+++ b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
@@ -39,7 +39,7 @@ export class ResourcesPage extends React.Component<any, any> {
                 <h2>Design Toolkit &amp; Assets</h2>
               </div>
               <div className={ css('ms-Grid-col ms-sm12 ms-lg8', styles.description) }>
-                <p>To ensure a consistent look and feel for your project, here's where you can leverage essential elements. This section covers design and UI-related downloads for apps designed and built with Fabric.</p>
+                <p>Use the resources on this page to ensure a consistent look and feel fore your project. This section includes design and UI-related downloads for apps designed and built with Fabric.</p>
 
                 <h3>Fabric Design Toolkit</h3>
                 <p>The Fabric design toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Office experiences.</p>
@@ -49,9 +49,9 @@ export class ResourcesPage extends React.Component<any, any> {
                 </ul>
 
                 <h3>SharePoint Design Toolkit</h3>
-                <p>Use the resources on this page to ensure a consistent look and feel for your project. This section includes page grids for Team and Communication sites, outlines for columns on the grid to help you make your design responsive, and a sample web part.</p>
+                <p>The SharePoint design toolkit provides everything you need to design your web parts. The toolkit contains page grids for Team and Communication sites, outlines for columns on the grid to help you make your design responsive, and a sample web part.</p>
                 <ul>
-                  <li><a className={ styles.relatedLink } href='https://static2.sharepointonline.com/files/fabric/fabric-website/files/sharepoint_toolkit.zip'>SharePoint Toolkit</a></li>
+                  <li><a className={ styles.relatedLink } href='https://static2.sharepointonline.com/files/fabric/fabric-website/files/sharepoint_toolkit.zip'>SharePoint XD Toolkit</a></li>
                 </ul>
 
                 <h3>Fonts</h3>
diff --git a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss
index d3374738f4704..02759d646eeb0 100644
--- a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss
+++ b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss
@@ -1,7 +1,7 @@
 @import '../../../styles/variables';
 
 .paragraphInGrid {
-    padding-left: $contentInGrid;
+  @include ms-padding-left($contentInGrid);
 }
 
 .exampleIcons {
diff --git a/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.module.scss b/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.module.scss
index 4b84067e5a52e..a8b1d37d02bcb 100644
--- a/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.module.scss
+++ b/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.module.scss
@@ -1,5 +1,9 @@
 @import '../../../styles/variables';
 
+.contentInGrid {
+  @include ms-padding-left($contentInGrid);
+}
+
 // XL and up
 @media screen and (min-width: $ms-screen-min-xl) {
   .accentGroup {
diff --git a/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx b/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
index 515e02a4e29c9..cae1d758b8387 100644
--- a/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { ColorTable } from '../../../components/ColorTable/ColorTable';
+import { css } from 'office-ui-fabric-react/lib/Utilities';
 import { PageHeader } from '../../../components/PageHeader/PageHeader';
 import { Table } from '../../../components/Table/Table';
 import * as stylesImport from './ColorsPage.module.scss';
@@ -46,7 +47,7 @@ export class ColorsPage extends React.Component<any, any> {
         <h2 id='palettes'>Color palettes</h2>
 
         <div className='ms-Grid ms-Grid--wide'>
-          <div className='ms-Grid-row'>
+          <div className={ css('ms-Grid-row', styles.contentInGrid) }>
             <div className='ms-Grid-col ms-sm12 ms-xl6'>
               <h3>Theme colors</h3>
               <ColorTable content={ themeColorsData } />
@@ -60,7 +61,7 @@ export class ColorsPage extends React.Component<any, any> {
 
         <h3>Accent colors</h3>
         <div className='ms-Grid ms-Grid--wide'>
-          <div className='ms-Grid-row'>
+          <div className={ css('ms-Grid-row', styles.contentInGrid) }>
             { accentColorsData.map((group, groupIndex) => (
               <div className='ms-Grid-col ms-sm12 ms-xl4 ms-xxl3'
                 key={ groupIndex }>
diff --git a/common/changes/@uifabric/fabric-website/general-website-bugs_2017-10-02-22-18.json b/common/changes/@uifabric/fabric-website/general-website-bugs_2017-10-02-22-18.json
new file mode 100644
index 0000000000000..c42ee392f5ea2
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/general-website-bugs_2017-10-02-22-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Updated ResourcePage text and made padding more rtl friendly.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/general-website-bugs_2017-10-02-22-18.json b/common/changes/office-ui-fabric-react/general-website-bugs_2017-10-02-22-18.json
new file mode 100644
index 0000000000000..71b3db22d1f39
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/general-website-bugs_2017-10-02-22-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "General bug fixes: Updated ResourcePage text, Reordered TextField page to give priority to design guidance examples, improved padding and spacing for TextField and ComboBox examples, and various website pages. Synced ComboBox error message spacing to be like TextField and per design specs.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index 2a4211f8175ca..1c076b5d676ce 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -255,7 +255,8 @@ export const getStyles = memoizeFunction((
     rootDisabled: getDisabledStyles(theme),
 
     rootError: {
-      borderColor: ComboBoxRootColorErrored
+      borderColor: ComboBoxRootColorErrored,
+      marginBottom: '5px'
     },
 
     rootDisallowFreeForm: {},
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.scss b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.scss
index 4e86e9a791396..a3eadc84565f2 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.scss
@@ -1,5 +1,9 @@
 :global {
   .ms-ComboBoxBasicExample {
     max-width: 300px;
+
+    .ms-ComboBox-container {
+      margin: 0 0 10px 0;
+    }
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
index 5149ce66ef5ee..4a266681792bc 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
@@ -39,12 +39,6 @@ export class TextFieldPage extends React.Component<IComponentDemoPageProps, {}>
             >
               <TextFieldBasicExample />
             </ExampleCard>
-            <ExampleCard
-              title='TextField with custom Label'
-              code={ TextFieldCustomRenderExampleCode }
-            >
-              <TextFieldCustomRenderExample />
-            </ExampleCard>
             <ExampleCard
               title='TextField with Placeholder'
               code={ TextFieldPlaceholderExampleCode }
@@ -75,6 +69,12 @@ export class TextFieldPage extends React.Component<IComponentDemoPageProps, {}>
             >
               <TextFieldErrorMessageExample />
             </ExampleCard>
+            <ExampleCard
+              title='TextField with custom Label'
+              code={ TextFieldCustomRenderExampleCode }
+            >
+              <TextFieldCustomRenderExample />
+            </ExampleCard>
             <ExampleCard
               title='Implementation Examples'
               code={ TextFieldImplementationExampleCode }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
index 5f159ad406c34..73601d581a373 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
@@ -1,10 +1,11 @@
 import * as React from 'react';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
+import './TextField.Examples.scss';
 
 export class TextFieldBasicExample extends React.Component<any, any> {
   public render() {
     return (
-      <div>
+      <div className='ms-TextFieldExample'>
         <TextField
           label='Standard'
         />
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Borderless.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Borderless.Example.tsx
index f59c2d1e47836..4d055da03d776 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Borderless.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Borderless.Example.tsx
@@ -1,10 +1,11 @@
 import * as React from 'react';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
+import './TextField.Examples.scss';
 
 export class TextFieldBorderlessExample extends React.Component<any, any> {
   public render() {
     return (
-      <div>
+      <div className='ms-TextFieldExample'>
         <TextField
           label='Borderless Standard TextField'
           borderless
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx
index d91edd68ef16a..f785f51ed82a6 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx
@@ -2,6 +2,7 @@ import { Promise } from 'es6-promise';
 import * as React from 'react';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
 import { NumberTextField } from './NumberTextField';
+import './TextField.Examples.scss';
 
 export class TextFieldErrorMessageExample extends React.Component<{}, {}> {
   public constructor(props: any) {
@@ -13,7 +14,7 @@ export class TextFieldErrorMessageExample extends React.Component<{}, {}> {
 
   public render() {
     return (
-      <div>
+      <div className='ms-TextFieldExample'>
         <TextField
           label='TextField with a string-based validator. Hint: the length of the input string must be less than 3.'
           onGetErrorMessage={ this._getErrorMessage }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Examples.scss b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Examples.scss
new file mode 100644
index 0000000000000..c7832b08fcdf7
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Examples.scss
@@ -0,0 +1,5 @@
+:global {
+  .ms-TextFieldExample .ms-TextField {
+    margin: 0 0 10px 0;
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ImplementationExamples.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ImplementationExamples.tsx
index c9024cb9d5048..824849c1f69f4 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ImplementationExamples.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ImplementationExamples.tsx
@@ -1,11 +1,12 @@
 import * as React from 'react';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+import './TextField.Examples.scss';
 
 export class TextFieldImplementationExamples extends React.Component<any, any> {
   public render() {
     return (
-      <div>
+      <div className='ms-TextFieldExample'>
         <TextField
           label='TextField with an icon'
           iconProps={ { iconName: 'Calendar' } }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Multiline.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Multiline.Example.tsx
index b7293aa16b178..6a64faac28361 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Multiline.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Multiline.Example.tsx
@@ -1,10 +1,11 @@
 import * as React from 'react';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
+import './TextField.Examples.scss';
 
 export class TextFieldMultilineExample extends React.Component<any, any> {
   public render() {
     return (
-      <div>
+      <div className='ms-TextFieldExample'>
         <TextField
           label='Standard'
           multiline
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Placeholder.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Placeholder.Example.tsx
index 98d2c0aba2f5e..7f80c94e458d6 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Placeholder.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Placeholder.Example.tsx
@@ -1,10 +1,11 @@
 import * as React from 'react';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
+import './TextField.Examples.scss';
 
 export class TextFieldPlaceholderExample extends React.Component<any, any> {
   public render() {
     return (
-      <div>
+      <div className='ms-TextFieldExample'>
         <TextField
           placeholder='I am a placeholder.'
           ariaLabel='Please enter text here'
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Underlined.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Underlined.Example.tsx
index d317bb2aaa791..9dfefbf04f29f 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Underlined.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Underlined.Example.tsx
@@ -1,10 +1,11 @@
 import * as React from 'react';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
+import './TextField.Examples.scss';
 
 export class TextFieldUnderlinedExample extends React.Component<any, any> {
   public render() {
     return (
-      <div>
+      <div className='ms-TextFieldExample'>
         <TextField
           label='Standard:'
           underlined

From 4d7a59eaa394ad6ac265d864b7783d4924931ea7 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Mon, 2 Oct 2017 17:46:45 -0700
Subject: [PATCH 0762/1641] Update cell index (#3007)

---
 packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx b/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
index b099f3ea358ea..2cd9c9dc5f23c 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
@@ -50,14 +50,14 @@ export class Grid extends BaseComponent<IGridProps, {}> {
                     role={ 'row' }
                     key={ this._id + '-' + rowIndex + '-row' }
                   >
-                    { rows.map((cell) => {
+                    { rows.map((cell, cellIndex) => {
                       return (
                         <td
                           role={ 'presentation' }
-                          key={ this._id + '-' + cell.index + '-cell' }
+                          key={ this._id + '-' + cellIndex + '-cell' }
                           style={ { padding: '0px' } }
                         >
-                          { onRenderItem(cell, cell.index) }
+                          { onRenderItem(cell, cellIndex) }
                         </td>
                       );
                     }) }

From de1162806fc4d1ff50c2d6d82e453d1fb1bc0b25 Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Mon, 2 Oct 2017 17:47:41 -0700
Subject: [PATCH 0763/1641] ComboBox: Scroll selected option to top (#2950)

* no message

* no message

* Adding prop to scroll selected option to top when dropdown menu is opened

* Change file

* Updating PR based on feedback

* Trying to fix Screener errors

* Testing fix for Screener error
---
 ...-Callout-ScrollSelectedToTop_2017-09-26-16-38.json | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.Props.ts         |  7 +++++++
 .../src/components/ComboBox/ComboBox.tsx              |  7 ++++++-
 3 files changed, 24 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-Callout-ScrollSelectedToTop_2017-09-26-16-38.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-Callout-ScrollSelectedToTop_2017-09-26-16-38.json b/common/changes/office-ui-fabric-react/kegorr-Callout-ScrollSelectedToTop_2017-09-26-16-38.json
new file mode 100644
index 0000000000000..5f06aa977a412
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-Callout-ScrollSelectedToTop_2017-09-26-16-38.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: when options are scrollable, added prop to scroll selected item to top when callout is opened.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
index fa2644c5ce4f5..5c1dcc10c95dd 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
@@ -88,6 +88,13 @@ export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox>
    * in case an option does not come with user-defined custom styles
    */
   comboBoxOptionStyles?: Partial<IComboBoxOptionStyles>;
+
+  /**
+   * When options are scrollable the selected option is positioned at the top of the callout when it is opened (unless it has reached the end of the scrollbar).
+   * @default false;
+   */
+  scrollSelectedToTop?: boolean;
+
 }
 
 export interface IComboBoxStyles {
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index c806e05cac624..4a81035a99d1b 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -881,8 +881,13 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * Scroll the selected element into view
    */
   private _scrollIntoView() {
-    if (this._selectedElement) {
+
+    let { scrollSelectedToTop } = this.props;
+    if (this._selectedElement && scrollSelectedToTop) {
+      this._selectedElement.offsetParent.scrollIntoView(true);
+    } else if (this._selectedElement) {
       let alignToTop = true;
+
       if (this._comboBoxMenu.offsetParent) {
         let scrollableParentRect = this._comboBoxMenu.offsetParent.getBoundingClientRect();
         let selectedElementRect = this._selectedElement.offsetParent.getBoundingClientRect();

From e951967ea0961a2945d6648b6f913ba662f67c56 Mon Sep 17 00:00:00 2001
From: Eddie Liu <leddie24@gmail.com>
Date: Mon, 2 Oct 2017 17:48:40 -0700
Subject: [PATCH 0764/1641] List: Fix grid example to read right to left in RTL
 mode (#2973)

* Add mixin for ms-float to have rtl example read right to left.

* Add change file
---
 ...-edwliu-fix-list-example-rtl_2017-09-27-20-21.json | 11 +++++++++++
 .../components/List/examples/List.Grid.Example.scss   |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-edwliu-fix-list-example-rtl_2017-09-27-20-21.json

diff --git a/common/changes/office-ui-fabric-react/v-edwliu-fix-list-example-rtl_2017-09-27-20-21.json b/common/changes/office-ui-fabric-react/v-edwliu-fix-list-example-rtl_2017-09-27-20-21.json
new file mode 100644
index 0000000000000..d3d23dee445b8
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-edwliu-fix-list-example-rtl_2017-09-27-20-21.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "List: Fix Grid example to read right to left in RTL mode",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-edwliu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.scss b/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.scss
index 90a6444808906..bcad7c45fd5c3 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.scss
@@ -14,7 +14,7 @@
     text-align: center;
     outline: none;
     position: relative;
-    float: left;
+    @include ms-float(left);
     background: $ms-color-neutralLighter;
   }
 

From 324729652fbc9b1379bf4bfa8aece6611cae6ce3 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Mon, 2 Oct 2017 20:45:26 -0700
Subject: [PATCH 0765/1641] Convert Fabric tests to Jest (#3005)

* Update config wit Jest

* Merge

* Add jest start script

* Convert tests

* Convert more tests to Jest

* Convert addtl tests to Jest

* Disable karma

* Mock keycodes

* Update shrinkwrap

* Change Persona  enums to strings

* Revert "Change Persona  enums to strings"

This reverts commit 6fbe63e3349bf436f84f46602205766f56b939bf.

* Use strings for Persona test styles

* Add react-rest-renderer

* Rename mock file

* Update Jest resources with mock file

* Fix image tests

* Update ComboBox test

* Remove unused imports

* Update ReactTestUtils imports to react-dom

* Update packages, run generate

* Remove karma config

* Update config wit Jest

* Add jest start script

* Merge

* Convert tests

* Convert more tests to Jest

* Convert addtl tests to Jest

* Disable karma

* Mock keycodes

* Update shrinkwrap

* Change Persona  enums to strings

* Revert "Change Persona  enums to strings"

This reverts commit 6fbe63e3349bf436f84f46602205766f56b939bf.

* Use strings for Persona test styles

* Add react-rest-renderer

* Rename mock file

* Update Jest resources with mock file

* Fix image tests

* Run rush generate

* Remove karma from disabled tasks

* Remove commented lines
---
 common/config/rush/npm-shrinkwrap.json        | 124 +++++++-------
 .../office-ui-fabric-react/jest.config.js     |   3 +
 .../office-ui-fabric-react/karma.config.js    | 121 -------------
 packages/office-ui-fabric-react/package.json  |   9 +-
 .../src/common/BaseStore.test.ts              |   6 +-
 .../src/common/connect.test.tsx               |  22 ++-
 .../components/Breadcrumb/Breadcrumb.test.tsx |   8 +-
 .../src/components/Button/Button.test.tsx     |  37 ++--
 .../src/components/Calendar/Calendar.test.tsx | 121 +++++++------
 .../src/components/Callout/Callout.test.tsx   |  18 +-
 .../ChoiceGroup/ChoiceGroup.test.tsx          |  62 ++++---
 .../ColorPicker/ColorPicker.test.tsx          |  18 +-
 .../src/components/ComboBox/ComboBox.test.tsx |  53 +++---
 .../components/CommandBar/CommandBar.test.tsx |  22 ++-
 .../ContextualMenu/ContextualMenu.test.tsx    |  48 +++---
 .../src/components/Dialog/Dialog.test.tsx     |  25 ++-
 .../src/components/Dropdown/Dropdown.test.tsx |  32 ++--
 .../src/components/Facepile/Facepile.test.tsx |  46 +++--
 .../components/FocusZone/FocusZone.test.tsx   | 130 +++++++-------
 .../src/components/Image/Image.test.tsx       | 152 ++++++++--------
 .../src/components/Label/Label.test.tsx       |   6 +-
 .../src/components/Layer/Layer.test.tsx       |   8 +-
 .../components/MessageBar/MessageBar.test.tsx |  12 +-
 .../OverflowSet/OverflowSet.test.tsx          |   6 +-
 .../src/components/Panel/Panel.test.tsx       |   8 +-
 .../src/components/Persona/Persona.test.tsx   |  66 +++----
 .../src/components/Rating/Rating.test.tsx     |  26 ++-
 .../ResizeGroup/ResizeGroup.test.tsx          | 110 ++++++------
 .../src/components/Slider/Slider.test.tsx     |  14 +-
 .../components/SpinButton/SpinButton.test.tsx | 162 +++++++++---------
 .../SwatchColorPicker.test.tsx                |  42 +++--
 .../TeachingBubble/TeachingBubble.test.tsx    |   6 +-
 .../components/TextField/TextField.test.tsx   |  50 +++---
 .../src/components/Toggle/Toggle.test.tsx     |  19 +-
 .../pickers/AutoFill/BaseAutoFill.test.tsx    |  28 +--
 .../components/pickers/BasePicker.test.tsx    |  40 ++---
 .../src/utilities/dateMath/DateMath.test.ts   | 105 ++++++------
 .../decorators/withResponsiveMode.test.tsx    |   8 +-
 .../src/utilities/grid/Grid.test.tsx          |  36 ++--
 .../src/utilities/positioning.test.ts         |  71 ++++----
 .../src/utilities/selection/Selection.test.ts |  32 ++--
 .../selection/SelectionZone.test.tsx          |  76 ++++----
 packages/office-ui-fabric-react/tsconfig.json |   3 +-
 scripts/tasks/jest-mock.js                    |  23 +++
 scripts/tasks/jest-resources.js               |   3 +-
 45 files changed, 935 insertions(+), 1082 deletions(-)
 create mode 100644 packages/office-ui-fabric-react/jest.config.js
 delete mode 100644 packages/office-ui-fabric-react/karma.config.js
 create mode 100644 scripts/tasks/jest-mock.js

diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 5bd7c835736f4..694faea5ca419 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -1257,6 +1257,14 @@
     "@rush-temp/office-ui-fabric-react": {
       "version": "file:projects\\office-ui-fabric-react",
       "dependencies": {
+        "@types/jest": {
+          "version": "21.1.0",
+          "bundled": true
+        },
+        "@types/react-dom": {
+          "version": "15.5.5",
+          "bundled": true
+        },
         "acorn": {
           "version": "5.1.1",
           "bundled": true
@@ -2494,14 +2502,14 @@
       "integrity": "sha512-oND+ez0D1jmOK8svzMFGtwkRMR0n3IdFcAb4RAflR7A0n+t6U0R+s3YOnoNuT8jAkmyBEgkqEj9rScE+p7749Q=="
     },
     "@uifabric/merge-styles": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.0.0.tgz",
-      "integrity": "sha512-LJi1PaVIi0x/+yfU1usLpranG04UnJaGEZoAXq7hbaULsImXjF1EofltXYWgaBTVOCXQJldQgApLdNQSfV74Ig=="
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.2.0.tgz",
+      "integrity": "sha512-5UNjp2VcxrNHR5JpY5xy6gEQMB5ZanVJUX3fTVsdz3vOKnh6u/LL1FhDAP7dHFSrCRwohT5jPHzbMCXcs3UJlA=="
     },
     "@uifabric/styling": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.0.1.tgz",
-      "integrity": "sha512-DGsMoboFI5Q7no3wbLgs1jeaFkxG7N+h+jfpe7ubOq1D7S2hRpvvv8el8XLvGEqsooTdWpQKOBac25IuTxxK3Q=="
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.1.0.tgz",
+      "integrity": "sha512-M4dUt0RoRvnqVFIplxcNZ9xCoOyXdOvnEt4lEOnpzipw0/gFvILYqcc34WmVX8KVL6FB8CJW2hKj8EUciwlDBQ=="
     },
     "@uifabric/utilities": {
       "version": "5.0.1",
@@ -3841,14 +3849,14 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000739",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000739.tgz",
-      "integrity": "sha1-vnNN62vtTtimnXL7kHi8bqbXatA="
+      "version": "1.0.30000740",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000740.tgz",
+      "integrity": "sha1-A/yqoXbj7QdYlfctRsGhIUm76sk="
     },
     "caniuse-lite": {
-      "version": "1.0.30000739",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000739.tgz",
-      "integrity": "sha1-nujHAW9cUi27DAhj1Vxh77RTrpU="
+      "version": "1.0.30000740",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000740.tgz",
+      "integrity": "sha1-8sTATWVk64EuYQBoQXAK1Vf2+XM="
     },
     "cardinal": {
       "version": "1.0.0",
@@ -4706,9 +4714,9 @@
       "integrity": "sha1-zIcsFoiArjxxiXYv1f/ACJbJUYo="
     },
     "electron-to-chromium": {
-      "version": "1.3.23",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.23.tgz",
-      "integrity": "sha1-5maKsYy2mvuPV3yKn8I9ACeIvnQ="
+      "version": "1.3.24",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.24.tgz",
+      "integrity": "sha1-m3uIuwXOufoBahd4M8wt3jiPIbY="
     },
     "elliptic": {
       "version": "6.4.0",
@@ -4800,9 +4808,9 @@
       "integrity": "sha1-+FWobOYa3E6GIcPNoh56dhLDqNw="
     },
     "es-abstract": {
-      "version": "1.8.2",
-      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.8.2.tgz",
-      "integrity": "sha512-dvhwFL3yjQxNNsOWx6exMlaDrRHCRGMQlnx5lsXDCZ/J7G/frgIIl94zhZSp/galVAYp7VzPi1OrAHta89/yGQ=="
+      "version": "1.9.0",
+      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.9.0.tgz",
+      "integrity": "sha512-kk3IJoKo7A3pWJc0OV8yZ/VEX2oSUytfekrJiqoxBlKJMFAJVJVpGdHClCCTdv+Fn2zHfpDHHIelMFhZVfef3Q=="
     },
     "es-to-primitive": {
       "version": "1.1.1",
@@ -5028,9 +5036,9 @@
       "integrity": "sha512-orfQQqFRTX0jH7znRIGi8ZMR8kTNpXklTTz8+HGTpmTKZo3Occ6JNB5FXMb8cRuiiC/GyDqsr30zUa66ACYlYw=="
     },
     "express": {
-      "version": "4.16.0",
-      "resolved": "https://registry.npmjs.org/express/-/express-4.16.0.tgz",
-      "integrity": "sha1-tRljjk61jnF4yBtJjvIveYyy4lU=",
+      "version": "4.16.1",
+      "resolved": "https://registry.npmjs.org/express/-/express-4.16.1.tgz",
+      "integrity": "sha512-STB7LZ4N0L+81FJHGla2oboUHTk4PaN1RsOkoRh9OSeEKylvF5hwKYVX1xCLFaCT7MD0BNG/gX2WFMLqY6EMBw==",
       "dependencies": {
         "accepts": {
           "version": "1.3.4",
@@ -8303,9 +8311,9 @@
       "integrity": "sha1-43rwTiOwkfZTYNsknbi7DzEpH2A="
     },
     "office-ui-fabric-react": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.1.0.tgz",
-      "integrity": "sha512-NRo9fdvycty3dWs0HRkc7JKEaDcv2A0ejvXDAvFktLBJ8oxFvSgT4HybPFQ4NsxkOBogvsVGnNIl9lm2TMzk2w=="
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.3.0.tgz",
+      "integrity": "sha512-qelOQ/Hd9QDyM3xyKdjbkrGqB3Vdz8ZbSXU5ud9xYDqnDDe5ofAvRD3xqbylLLugD702WM2a8I6SztxuSRohCw=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -9967,9 +9975,9 @@
       "integrity": "sha1-+UJQHCGkzARWziu+5QMsk/YFHc8="
     },
     "react-inspector": {
-      "version": "2.1.6",
-      "resolved": "https://registry.npmjs.org/react-inspector/-/react-inspector-2.1.6.tgz",
-      "integrity": "sha512-YAM/GXQq457luk1u00ChwpxZ9MICXAgs+9XqL5DNml/jLJWBApHjbzLbT5rgU1g6MVCKO2TxFPAiLnKNZ70FBg=="
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/react-inspector/-/react-inspector-2.2.0.tgz",
+      "integrity": "sha512-G5qXffxY5U1XhleV/YxHfJvjAiHHPDhYItygvz0FGdEuFVop0FTHNlHbUYRn7XOtARiMBekaBinq8PkA+ylrEg=="
     },
     "react-komposer": {
       "version": "2.0.0",
@@ -10012,9 +10020,9 @@
       "integrity": "sha1-0DM0NPwsQ4CSaWyncNpe1IA376g="
     },
     "react-transition-group": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-1.2.0.tgz",
-      "integrity": "sha1-tR/JIbDDg1p+98Vxx5/ILHPpIE8="
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-1.2.1.tgz",
+      "integrity": "sha512-CWaL3laCmgAFdxdKbhhps+c0HRGF4c+hdM4H23+FI1QBNUyx/AMeIJGWorehPNSaKnQNOAxL7PQmqMu78CDj3Q=="
     },
     "react-treebeard": {
       "version": "2.0.3",
@@ -10485,9 +10493,9 @@
       }
     },
     "screener-storybook": {
-      "version": "0.9.2",
-      "resolved": "https://registry.npmjs.org/screener-storybook/-/screener-storybook-0.9.2.tgz",
-      "integrity": "sha1-6HF44p3DkPM1+yBxwwPCMn30ANg=",
+      "version": "0.9.3",
+      "resolved": "https://registry.npmjs.org/screener-storybook/-/screener-storybook-0.9.3.tgz",
+      "integrity": "sha1-7Gg8x0+ene+eiJh/dz53iZTqa28=",
       "dependencies": {
         "acorn": {
           "version": "2.7.0",
@@ -10649,9 +10657,9 @@
           "integrity": "sha1-xpKJRqDgbF+Nb4qTM0af/aRimKA="
         },
         "screener-runner": {
-          "version": "0.7.2",
-          "resolved": "https://registry.npmjs.org/screener-runner/-/screener-runner-0.7.2.tgz",
-          "integrity": "sha1-FjjwanxTh2jqNbPR4NnPuSUTJRY=",
+          "version": "0.7.3",
+          "resolved": "https://registry.npmjs.org/screener-runner/-/screener-runner-0.7.3.tgz",
+          "integrity": "sha1-+fePjLewRjmJFLE6SJsflg3KzVI=",
           "dependencies": {
             "caseless": {
               "version": "0.11.0",
@@ -10757,9 +10765,9 @@
       "integrity": "sha1-d0Zt5YnNXTyV8TiqeLxWmjy10no="
     },
     "send": {
-      "version": "0.16.0",
-      "resolved": "https://registry.npmjs.org/send/-/send-0.16.0.tgz",
-      "integrity": "sha1-FjONu5ou3krVe0hCDsO4LY6ApXs="
+      "version": "0.16.1",
+      "resolved": "https://registry.npmjs.org/send/-/send-0.16.1.tgz",
+      "integrity": "sha512-ElCLJdJIKPk6ux/Hocwhk7NFHpI3pVm/IZOYWqUmoxcgeyM+MpxHHKhb8QmlJDX1pU6WrgaHBkVNm73Sv7uc2A=="
     },
     "serve-favicon": {
       "version": "2.4.5",
@@ -10767,21 +10775,21 @@
       "integrity": "sha512-s7F8h2NrslMkG50KxvlGdj+ApSwaLex0vexuJ9iFf3GLTIp1ph/l1qZvRe9T9TJEYZgmq72ZwJ2VYiAEtChknw=="
     },
     "serve-index": {
-      "version": "1.9.0",
-      "resolved": "https://registry.npmjs.org/serve-index/-/serve-index-1.9.0.tgz",
-      "integrity": "sha1-0rKA/FYNYW7oG0i/D6gqvtJIXOc=",
+      "version": "1.9.1",
+      "resolved": "https://registry.npmjs.org/serve-index/-/serve-index-1.9.1.tgz",
+      "integrity": "sha1-03aNabHn2C5c4FD/9bRTvqEqkjk=",
       "dependencies": {
-        "debug": {
-          "version": "2.6.8",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
-          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw="
+        "accepts": {
+          "version": "1.3.4",
+          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.4.tgz",
+          "integrity": "sha1-hiRnWMfdbSGmR0/whKR0DsBesh8="
         }
       }
     },
     "serve-static": {
-      "version": "1.13.0",
-      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.13.0.tgz",
-      "integrity": "sha1-gQyR24AOlLoofq5rTgbKq5/cFvE="
+      "version": "1.13.1",
+      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.13.1.tgz",
+      "integrity": "sha512-hSMUZrsPa/I09VYFJwa627JJkNs0NrfL1Uzuup+GqHfToR2KcsXFymXSV90hoyw3M+msjFuQly+YzIH/q0MGlQ=="
     },
     "set-blocking": {
       "version": "2.0.0",
@@ -11061,9 +11069,9 @@
       "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
     },
     "source-map-loader": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.1.tgz",
-      "integrity": "sha1-SBJr6SML1H+tBeRqjDwuPS2r5Qc=",
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.2.tgz",
+      "integrity": "sha512-C3iYM6IqMT6jVzo6HTDmeZz9QP0ott9LtOeDJAPDQlHG5uJx+whP3c39TCMc1/FqP0feo546wCgt89JCn6DBMg==",
       "dependencies": {
         "async": {
           "version": "0.9.2",
@@ -11639,9 +11647,9 @@
       "integrity": "sha1-hR+1BSAcY9A0PFFybmNk9+mtLpk="
     },
     "tsutils": {
-      "version": "2.10.0",
-      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.10.0.tgz",
-      "integrity": "sha1-rpRRHfJlbrBuRCQFb7pcOIiHBAw="
+      "version": "2.11.1",
+      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.11.1.tgz",
+      "integrity": "sha1-ED3/P6UIr/VknBbcTm3UXcQdvGI="
     },
     "tty-browserify": {
       "version": "0.0.0",
@@ -12202,9 +12210,9 @@
       "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
     },
     "winston": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/winston/-/winston-2.3.1.tgz",
-      "integrity": "sha1-C0hCDZeMAYBM8CMLZIhhWYIloRk=",
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/winston/-/winston-2.4.0.tgz",
+      "integrity": "sha1-gIBQuT1SZh7Z+2wms/DIJnCLCu4=",
       "dependencies": {
         "async": {
           "version": "1.0.0",
diff --git a/packages/office-ui-fabric-react/jest.config.js b/packages/office-ui-fabric-react/jest.config.js
new file mode 100644
index 0000000000000..a92c71220a900
--- /dev/null
+++ b/packages/office-ui-fabric-react/jest.config.js
@@ -0,0 +1,3 @@
+let { createConfig } = require('../../scripts/tasks/jest-resources');
+
+module.exports = createConfig();
diff --git a/packages/office-ui-fabric-react/karma.config.js b/packages/office-ui-fabric-react/karma.config.js
deleted file mode 100644
index 8bdff41ec5fe8..0000000000000
--- a/packages/office-ui-fabric-react/karma.config.js
+++ /dev/null
@@ -1,121 +0,0 @@
-'use strict';
-
-// Karma configuration
-// Generated on Thu Oct 08 2015 18:13:05 GMT-0700 (PDT)
-
-let path = require('path');
-let resources = require('../../scripts/tasks/karma-resources');
-let debugRun = (process.argv.indexOf('--debug') > -1);
-let webpack = require('../../scripts/tasks/webpack-resources').webpack;
-
-module.exports = function (config) {
-  let karmaConfig = {
-
-    // base path that will be used to resolve all patterns (eg. files, exclude)
-    basePath: '.',
-
-    // frameworks to use
-    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
-    frameworks: ['mocha', 'sinon-chai'],
-
-
-    // list of files / patterns to load in the browser
-    files: resources.files.concat([path.join('lib', 'common/tests.js')]),
-
-    // list of files to exclude
-    exclude: [],
-
-
-    // webpack config for bundling tests.
-    webpack: {
-      devtool: 'inline-source-map',
-      module: {
-        loaders: [
-          {
-            test: /sinon\/pkg\/sinon/,
-            loader: "imports?define=>false,require=>false"
-          },
-          debugRun ? {} : {
-            test: /\.js/,
-            exclude: /(test|node_modules|bower_components)/,
-            loader: resources.istanbulInstrumenterLoaderPath,
-            enforce: 'post'
-          }
-        ],
-      },
-      externals: {
-        'cheerio': 'window',
-        'react/addons': true,
-        'react/lib/ExecutionEnvironment': true,
-        'react/lib/ReactContext': true
-      },
-      resolve: {
-        modules: [
-          path.resolve(__dirname, 'lib'),
-          path.resolve('../../scripts/node_modules'),
-          'node_modules'
-        ]
-      },
-      plugins: [
-        new webpack.DefinePlugin({
-          'process.env.NODE_ENV': JSON.stringify('production')
-        })
-      ]
-    },
-
-    webpackMiddleware: {
-      noInfo: true
-    },
-
-    // preprocess matching files before serving them to the browser
-    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
-    preprocessors: {
-      [path.join('lib', '/**/*.js')]: ['webpack']
-    },
-
-    plugins: resources.plugins.concat([
-    ]),
-
-    // test results reporter to use
-    // possible values: 'dots', 'progress'
-    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
-    reporters: ['mocha-clean', 'coverage'],
-
-
-    // web server port
-    port: 9876,
-
-
-    // enable / disable colors in the output (reporters and logs)
-    colors: true,
-
-
-    // level of logging
-    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
-    logLevel: config.LOG_INFO,
-
-
-    // enable / disable watching file and executing tests whenever any file changes
-    autoWatch: false,
-
-
-    // start these browsers
-    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
-    browsers: ['PhantomJS'],
-
-
-    // Continuous Integration mode
-    // if true, Karma captures browsers, runs the tests and exits
-    singleRun: true,
-
-    // on disconnect, makes karma to launch another phantonJs window to restart the testcases
-    browserDisconnectTolerance: 5,
-
-    // these settings help reduce the timeouts to begin with.
-    browserNoActivityTimeout: 60000,
-    browserDisconnectTimeout: 30000,
-    captureTimeout: 60000,
-  };
-
-  config.set(karmaConfig);
-};
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 62bad9a6b5db5..8437c8005756a 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -12,17 +12,17 @@
   "scripts": {
     "build": "node ../../scripts/build.js",
     "clean": "node ../../scripts/clean.js",
-    "start": "node ../../scripts/start.js"
+    "start": "node ../../scripts/start.js",
+    "start-test": "node ../../scripts/start-test.js"
   },
   "devDependencies": {
-    "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.8",
     "@types/es6-promise": "^0.0.32",
-    "@types/mocha": "2.2.39",
+    "@types/jest": "21.1.0",
     "@types/prop-types": "15.5.1",
     "@types/react": "15.0.38",
     "@types/react-addons-test-utils": "0.14.18",
-    "@types/react-dom": "15.5.1",
+    "@types/react-dom": "15.5.5",
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
@@ -38,6 +38,7 @@
     "react-addons-test-utils": "^15.4.2",
     "react-dom": "^15.6.1",
     "react-highlight": "0.9.0",
+    "react-test-renderer": "^15.6.1",
     "resemblejs": "~2.2.3",
     "sinon": "^2.3.2"
   },
diff --git a/packages/office-ui-fabric-react/src/common/BaseStore.test.ts b/packages/office-ui-fabric-react/src/common/BaseStore.test.ts
index 44b01f280f864..ac854f8e437a2 100644
--- a/packages/office-ui-fabric-react/src/common/BaseStore.test.ts
+++ b/packages/office-ui-fabric-react/src/common/BaseStore.test.ts
@@ -1,7 +1,5 @@
 import { BaseStore } from './BaseStore';
 
-let { expect } = chai;
-
 class TestStore extends BaseStore {
   public doThings() {
     this.emitChange();
@@ -16,7 +14,7 @@ describe('BaseStore', () => {
     test.subscribe(() => hasChanged = true);
     test.doThings();
 
-    expect(hasChanged).to.be.true;
+    expect(hasChanged).toBe(true);
   });
 
   it('can unsubscribe', () => {
@@ -27,7 +25,7 @@ describe('BaseStore', () => {
     disposable.dispose();
     test.doThings();
 
-    expect(hasChanged).to.be.false;
+    expect(hasChanged).toBe(false);
   });
 
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/common/connect.test.tsx b/packages/office-ui-fabric-react/src/common/connect.test.tsx
index 1c84dcdd14555..81105f8d7dd7a 100644
--- a/packages/office-ui-fabric-react/src/common/connect.test.tsx
+++ b/packages/office-ui-fabric-react/src/common/connect.test.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import * as ReactDOM from 'react-dom';
 
-import * as ReactTestUtils from 'react-addons-test-utils';
+import * as ReactTestUtils from 'react-dom/test-utils';
 import { connect } from './connect';
 import { BaseStore } from './BaseStore';
 import { StoreHost } from './StoreHost';
@@ -11,8 +11,6 @@ import { StoreSet } from './StoreSet';
 import { storeKey } from './storeKey';
 import { ISubscribable } from './ISubscribable';
 
-let { expect } = chai;
-
 interface ITestComponentProps extends React.HTMLAttributes<HTMLDivElement> { }
 
 // Dumb component.
@@ -60,17 +58,17 @@ describe('connect', () => {
     );
     let rootElement = ReactDOM.findDOMNode(root as React.ReactInstance);
 
-    expect(rootElement.textContent).equals('');
+    expect(rootElement.textContent).toEqual('');
 
     localStores.getStore<IHelloStore>(hello1).say('hello');
     setTimeout(() => {
       try {
-        expect(rootElement.textContent).equals('hello');
+        expect(rootElement.textContent).toEqual('hello');
         localStores.getStore<IHelloStore>(hello2).say(' world');
 
         setTimeout(() => {
           try {
-            expect(rootElement.textContent).equals('hello world');
+            expect(rootElement.textContent).toEqual('hello world');
             done();
           } catch (e) { done(e); }
         }, 10);
@@ -97,7 +95,7 @@ describe('connect', () => {
       );
     } catch (e) { threwException = true; }
 
-    expect(threwException).equals(true);
+    expect(threwException).toEqual(true);
   });
 
   it('can throw in an environment that does not contain the required store', () => {
@@ -119,7 +117,7 @@ describe('connect', () => {
       );
     } catch (e) { threwException = true; }
 
-    expect(threwException).equals(true);
+    expect(threwException).toEqual(true);
   });
 
   it('renders a connected component 1 time when multiple stores fire changes', (done) => {
@@ -152,8 +150,8 @@ describe('connect', () => {
       </div>
     );
 
-    expect(resolves).to.equal(1, 'resolve was not 1');
-    expect(renders).to.equal(1, 'render was not 1');
+    expect(resolves).toEqual(1);
+    expect(renders).toEqual(1);
 
     // Cause 2 store changes. This should setImmediate and cause 1 resolve.
     localStores.getStore<IHelloStore>(hello1).say('hello');
@@ -161,8 +159,8 @@ describe('connect', () => {
 
     setTimeout(() => {
       try {
-        expect(resolves).to.equal(2, 'resolve was not 2');
-        expect(renders).to.equal(1, 'render was not 1');
+        expect(resolves).toEqual(2);
+        expect(renders).toEqual(1);
         done();
       } catch (e) { done(e); }
     }, 10);
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx
index 2872ff8c97dab..81cdb7f9a6744 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx
@@ -3,9 +3,7 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
 import * as ReactDOM from 'react-dom';
-import * as ReactTestUtils from 'react-addons-test-utils';
-
-let { expect } = chai;
+import * as ReactTestUtils from 'react-dom/test-utils';
 
 import { Breadcrumb } from './Breadcrumb';
 import { IBreadcrumbItem } from './Breadcrumb.Props';
@@ -32,7 +30,7 @@ describe('Breadcrumb', () => {
     let itemLink = renderedDOM.querySelector('.ms-Breadcrumb-itemLink');
 
     ReactTestUtils.Simulate.click(itemLink!);
-    expect(callbackValue).to.equal('TestKey');
+    expect(callbackValue).toEqual('TestKey');
   });
 
   it('moves items to overflow in the correct order', () => {
@@ -54,7 +52,7 @@ describe('Breadcrumb', () => {
     let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
     let itemLink = renderedDOM.querySelectorAll('.ms-Breadcrumb-item');
 
-    expect(itemLink[0].textContent).to.equal('TestText3');
+    expect(itemLink[0].textContent).toEqual('TestText3');
   });
 
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
index ed2bb1f9857d2..96771bd09d4b1 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
@@ -3,15 +3,13 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
 
-import * as ReactTestUtils from 'react-addons-test-utils';
+import * as ReactTestUtils from 'react-dom/test-utils';
 import { DefaultButton } from './DefaultButton/DefaultButton';
 import { IconButton } from './IconButton/IconButton';
 import { CompoundButton } from './CompoundButton/CompoundButton';
 import { KeyCodes } from '../../Utilities';
 // import { IconButton } from "src";
 
-let { expect } = chai;
-
 const alertClicked = (): void => { /*noop*/ };
 
 describe('DefaultButton', () => {
@@ -26,8 +24,7 @@ describe('DefaultButton', () => {
       <DefaultButton>Hello</DefaultButton>
     );
     const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
-    console.log(renderedDOM.tagName);
-    expect(renderedDOM.tagName).equals('BUTTON', 'A Button with no onClick renders as a span');
+    expect(renderedDOM.tagName).toEqual('BUTTON');
   });
 
   it('can render with an onClick.', () => {
@@ -37,8 +34,7 @@ describe('DefaultButton', () => {
       <DefaultButton onClick={ onClick }>Hello</DefaultButton>
     );
     const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
-    console.log(renderedDOM.tagName);
-    expect(renderedDOM.tagName).equals('BUTTON', 'A Button with onClick renders as a button');
+    expect(renderedDOM.tagName).toEqual('BUTTON');
   });
 
   it('can render with an href', () => {
@@ -46,8 +42,7 @@ describe('DefaultButton', () => {
       <DefaultButton href='http://www.microsoft.com' target='_blank'>Hello</DefaultButton>
     );
     const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
-    console.log(renderedDOM.tagName);
-    expect(renderedDOM.tagName).equals('A', 'A Button with an href renders as an anchor');
+    expect(renderedDOM.tagName).toEqual('A');
   });
 
   it('applies the correct aria attributes', () => {
@@ -139,7 +134,7 @@ describe('DefaultButton', () => {
   describe('with menuProps', () => {
     let button: Element;
 
-    before(() => {
+    beforeAll(() => {
       const wrapper = ReactTestUtils.renderIntoDocument<any>(
         <DefaultButton menuProps={ { items: [{ key: 'item', name: 'Item' }] } }>Hello</DefaultButton>
       ) as DefaultButton;
@@ -147,14 +142,14 @@ describe('DefaultButton', () => {
     });
 
     it('contains aria-haspopup=true', () => {
-      expect(button.getAttribute('aria-haspopup')).to.equal('true');
+      expect(button.getAttribute('aria-haspopup')).toEqual('true');
     });
   });
 
   describe('without menuProps', () => {
     let button: Element;
 
-    before(() => {
+    beforeAll(() => {
       const wrapper = ReactTestUtils.renderIntoDocument<any>(
         <DefaultButton>Hello</DefaultButton>
       ) as DefaultButton;
@@ -162,14 +157,14 @@ describe('DefaultButton', () => {
     });
 
     it('does not contain aria-haspopup', () => {
-      expect(button.getAttribute('aria-haspopup')).to.equal(null);
+      expect(button.getAttribute('aria-haspopup')).toEqual(null);
     });
   });
 
   describe('with menuIconProps', () => {
     let button: Element;
 
-    before(() => {
+    beforeAll(() => {
       const wrapper = ReactTestUtils.renderIntoDocument<any>(
         <DefaultButton menuIconProps={ { iconName: 'fontColor' } }>Hello</DefaultButton>
       ) as DefaultButton;
@@ -177,7 +172,7 @@ describe('DefaultButton', () => {
     });
 
     it('Contains the expected icon via menuIconProps', () => {
-      expect(button.querySelectorAll('[data-icon-name="fontColor"]').length).to.equal(1);
+      expect(button.querySelectorAll('[data-icon-name="fontColor"]').length).toEqual(1);
     });
   });
 
@@ -204,7 +199,7 @@ describe('DefaultButton', () => {
       />
     );
     const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
-    expect(renderedDOM.tagName).not.equal('DIV', 'A Button with a menuProps and an onClick renders as a SplitButton');
+    expect(renderedDOM.tagName).not.toEqual('DIV');
   });
 
   it('Providing onClick, menuProps and setting splitButton to true renders a SplitButton', () => {
@@ -231,7 +226,7 @@ describe('DefaultButton', () => {
       />
     );
     const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
-    expect(renderedDOM.tagName).equal('DIV', 'A Button with a menuProps and an onClick renders as a SplitButton');
+    expect(renderedDOM.tagName).toEqual('DIV');
   });
 
   it('Tapping menu button of SplitButton expands menu', () => {
@@ -260,7 +255,7 @@ describe('DefaultButton', () => {
     const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
     const menuButtonDOM: HTMLButtonElement = renderedDOM.getElementsByTagName('button')[1] as HTMLButtonElement;
     ReactTestUtils.Simulate.click(menuButtonDOM);
-    expect(renderedDOM.getAttribute('aria-expanded')).to.equal('true');
+    expect(renderedDOM.getAttribute('aria-expanded')).toEqual('true');
   });
 
   describe('Response to click event', () => {
@@ -299,7 +294,7 @@ describe('DefaultButton', () => {
       const menuButtonDOM: HTMLButtonElement = renderedDOM.querySelectorAll('button')[0];
 
       ReactTestUtils.Simulate.click(menuButtonDOM);
-      expect(didClick).to.equal(true);
+      expect(didClick).toEqual(true);
     });
 
     it('Pressing down on SplitButton triggers menu', () => {
@@ -332,7 +327,7 @@ describe('DefaultButton', () => {
         {
           which: KeyCodes.down
         });
-      expect(renderedDOM.getAttribute('aria-expanded')).to.equal('true');
+      expect(renderedDOM.getAttribute('aria-expanded')).toEqual('true');
     });
 
     it('A disabled SplitButton does not respond to clicks', () => {
@@ -362,7 +357,7 @@ describe('DefaultButton', () => {
       const buttonElement = renderedDOM.querySelectorAll('button')[0];
 
       ReactTestUtils.Simulate.click(buttonElement);
-      expect(didClick).to.equal(false);
+      expect(didClick).toEqual(false);
     });
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
index b7971ee2dbffd..8a5bfd4d157cc 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
@@ -2,9 +2,8 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
-import * as ReactTestUtils from 'react-addons-test-utils';
-
-let { expect } = chai;
+import * as ReactTestUtils from 'react-dom/test-utils';
+import { mount } from 'enzyme';
 
 import { Calendar } from './Calendar';
 import { DateRangeType, DayOfWeek } from './Calendar.Props';
@@ -70,26 +69,22 @@ describe('Calendar', () => {
     let defaultDate = new Date('invalid');
 
     // Act
-    try {
-      let renderedComponent = ReactTestUtils.renderIntoDocument(
-        <Calendar
-          strings={ dayPickerStrings }
-          isMonthPickerVisible={ true }
-          value={ defaultDate }
-        />) as Calendar;
 
-      let today = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-day--today') as HTMLElement;
+    let renderedComponent = mount(
+      <Calendar
+        strings={ dayPickerStrings }
+        isMonthPickerVisible={ true }
+        value={ defaultDate }
+      />);
 
-      expect(+today.innerText).to.be.equal(new Date().getDate());
-    } catch (err) {
-      expect.fail(err, null, 'Encountered error trying to render a Calendar with an invalid date');
-    }
+    let today = renderedComponent.find('.ms-DatePicker-day--today');
+    expect(+today.text()).toEqual(new Date().getDate());
   });
 
   describe('Test rendering simplest calendar', () => {
     let renderedComponent: Calendar;
 
-    before(() => {
+    beforeAll(() => {
       renderedComponent = ReactTestUtils.renderIntoDocument(
         <Calendar
           strings={ dayPickerStrings }
@@ -102,20 +97,20 @@ describe('Calendar', () => {
       let monthName = dayPickerStrings.months[today.getMonth()];
       let year = today.getFullYear();
       let dayPickerMonth = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-monthAndYear');
-      expect(dayPickerMonth).to.not.be.undefined;
-      expect(dayPickerMonth.textContent).to.equal(monthName + ' ' + year.toString());
+      expect(dayPickerMonth).toBeDefined();
+      expect(dayPickerMonth.textContent).toEqual(monthName + ' ' + year.toString());
     });
 
     it('Verify first day of week', () => {
       let dayHeaders = ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedComponent, 'ms-DatePicker-weekday');
-      expect(dayHeaders.length).to.equal(7);
-      expect(dayHeaders[0].textContent).to.equal(dayPickerStrings.shortDays[0]);
-      expect(dayHeaders[1].textContent).to.equal(dayPickerStrings.shortDays[1]);
-      expect(dayHeaders[2].textContent).to.equal(dayPickerStrings.shortDays[2]);
-      expect(dayHeaders[3].textContent).to.equal(dayPickerStrings.shortDays[3]);
-      expect(dayHeaders[4].textContent).to.equal(dayPickerStrings.shortDays[4]);
-      expect(dayHeaders[5].textContent).to.equal(dayPickerStrings.shortDays[5]);
-      expect(dayHeaders[6].textContent).to.equal(dayPickerStrings.shortDays[6]);
+      expect(dayHeaders.length).toEqual(7);
+      expect(dayHeaders[0].textContent).toEqual(dayPickerStrings.shortDays[0]);
+      expect(dayHeaders[1].textContent).toEqual(dayPickerStrings.shortDays[1]);
+      expect(dayHeaders[2].textContent).toEqual(dayPickerStrings.shortDays[2]);
+      expect(dayHeaders[3].textContent).toEqual(dayPickerStrings.shortDays[3]);
+      expect(dayHeaders[4].textContent).toEqual(dayPickerStrings.shortDays[4]);
+      expect(dayHeaders[5].textContent).toEqual(dayPickerStrings.shortDays[5]);
+      expect(dayHeaders[6].textContent).toEqual(dayPickerStrings.shortDays[6]);
     });
 
     it('Verify day picker selected date & navigated date', () => {
@@ -123,20 +118,20 @@ describe('Calendar', () => {
       // These dates will be ms different, so just compare their day, month, and year
       // This test will likely fail around midnight.
       let today = new Date();
-      expect(renderedComponent.state.selectedDate).to.not.be.null;
-      expect(renderedComponent.state.selectedDate!.getDate()).to.equal(today.getDate());
-      expect(renderedComponent.state.selectedDate!.getMonth()).to.equal(today.getMonth());
-      expect(renderedComponent.state.selectedDate!.getFullYear()).to.equal(today.getFullYear());
-      expect(renderedComponent.state.navigatedDate).to.not.be.null;
-      expect(renderedComponent.state.navigatedDate!.getDate()).to.equal(today.getDate());
-      expect(renderedComponent.state.navigatedDate!.getMonth()).to.equal(today.getMonth());
-      expect(renderedComponent.state.navigatedDate!.getFullYear()).to.equal(today.getFullYear());
+      expect(renderedComponent.state.selectedDate).not.toBeNull();
+      expect(renderedComponent.state.selectedDate!.getDate()).toEqual(today.getDate());
+      expect(renderedComponent.state.selectedDate!.getMonth()).toEqual(today.getMonth());
+      expect(renderedComponent.state.selectedDate!.getFullYear()).toEqual(today.getFullYear());
+      expect(renderedComponent.state.navigatedDate).not.toBeNull();
+      expect(renderedComponent.state.navigatedDate!.getDate()).toEqual(today.getDate());
+      expect(renderedComponent.state.navigatedDate!.getMonth()).toEqual(today.getMonth());
+      expect(renderedComponent.state.navigatedDate!.getFullYear()).toEqual(today.getFullYear());
     });
 
     it('Verify go to today', () => {
       let goToToday = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-goToday');
-      expect(goToToday).to.not.be.undefined;
-      expect(goToToday.textContent).to.equal(dayPickerStrings.goToToday);
+      expect(goToToday).toBeDefined();
+      expect(goToToday.textContent).toEqual(dayPickerStrings.goToToday);
     });
   });
 
@@ -145,7 +140,7 @@ describe('Calendar', () => {
     let defaultDate: Date;
     let lastSelectedDateRange: Date[] | null = null;
 
-    before(() => {
+    beforeAll(() => {
       defaultDate = new Date(2017, 2, 16);
       let onSelectDate = (): (date: Date, dateRangeArray: Date[]) => void => {
         return (date: Date, dateRangeArray: Date[]): void => {
@@ -168,51 +163,51 @@ describe('Calendar', () => {
     it('Verify day picker header', () => {
       let monthName = dayPickerStrings.months[defaultDate.getMonth()];
       let dayPickerMonth = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-monthAndYear');
-      expect(dayPickerMonth).to.not.be.undefined;
-      expect(dayPickerMonth.textContent).to.equal(monthName + ' ' + defaultDate.getFullYear().toString());
+      expect(dayPickerMonth).toBeDefined();
+      expect(dayPickerMonth.textContent).toEqual(monthName + ' ' + defaultDate.getFullYear().toString());
     });
 
     it('Verify first day of week', () => {
       let dayHeaders = ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedComponent, 'ms-DatePicker-weekday');
-      expect(dayHeaders.length).to.equal(7);
-      expect(dayHeaders[0].textContent).to.equal(dayPickerStrings.shortDays[2]);
-      expect(dayHeaders[1].textContent).to.equal(dayPickerStrings.shortDays[3]);
-      expect(dayHeaders[2].textContent).to.equal(dayPickerStrings.shortDays[4]);
-      expect(dayHeaders[3].textContent).to.equal(dayPickerStrings.shortDays[5]);
-      expect(dayHeaders[4].textContent).to.equal(dayPickerStrings.shortDays[6]);
-      expect(dayHeaders[5].textContent).to.equal(dayPickerStrings.shortDays[0]);
-      expect(dayHeaders[6].textContent).to.equal(dayPickerStrings.shortDays[1]);
+      expect(dayHeaders.length).toEqual(7);
+      expect(dayHeaders[0].textContent).toEqual(dayPickerStrings.shortDays[2]);
+      expect(dayHeaders[1].textContent).toEqual(dayPickerStrings.shortDays[3]);
+      expect(dayHeaders[2].textContent).toEqual(dayPickerStrings.shortDays[4]);
+      expect(dayHeaders[3].textContent).toEqual(dayPickerStrings.shortDays[5]);
+      expect(dayHeaders[4].textContent).toEqual(dayPickerStrings.shortDays[6]);
+      expect(dayHeaders[5].textContent).toEqual(dayPickerStrings.shortDays[0]);
+      expect(dayHeaders[6].textContent).toEqual(dayPickerStrings.shortDays[1]);
     });
 
     it('Verify day picker selected date & navigated date', () => {
-      expect(renderedComponent.state.selectedDate).to.equal(defaultDate);
-      expect(renderedComponent.state.navigatedDate).to.equal(defaultDate);
+      expect(renderedComponent.state.selectedDate).toEqual(defaultDate);
+      expect(renderedComponent.state.navigatedDate).toEqual(defaultDate);
     });
 
     it('Verify month picker seen', () => {
       let monthPicker = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-monthPicker') as HTMLElement;
-      expect(monthPicker).to.not.be.undefined;
-      expect(monthPicker.style.display).to.not.equal('none');
+      expect(monthPicker).toBeDefined();
+      expect(monthPicker.style.display).not.toEqual('none');
     });
 
     it('Verify month picker header', () => {
       let currentYear = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-currentYear');
-      expect(currentYear).to.not.be.undefined;
-      expect(currentYear.textContent).to.equal(defaultDate.getFullYear().toString());
+      expect(currentYear).toBeDefined();
+      expect(currentYear.textContent).toEqual(defaultDate.getFullYear().toString());
     });
 
     it('Verify month picker months', () => {
       let months = ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedComponent, 'ms-DatePicker-monthOption');
-      expect(months.length).to.equal(12);
+      expect(months.length).toEqual(12);
       for (let i = 0; i < 12; i++) {
-        expect(months[i].textContent).to.equal(dayPickerStrings.shortMonths[i]);
+        expect(months[i].textContent).toEqual(dayPickerStrings.shortMonths[i]);
       }
     });
 
     it('Verify go to today', () => {
       let goToToday = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-goToday');
-      expect(goToToday).to.not.be.undefined;
-      expect(goToToday.textContent).to.equal(dayPickerStrings.goToToday);
+      expect(goToToday).toBeDefined();
+      expect(goToToday.textContent).toEqual(dayPickerStrings.goToToday);
     });
 
     it('Verify navigate to different week in same month', () => {
@@ -220,9 +215,9 @@ describe('Calendar', () => {
       let days = ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedComponent, 'ms-DatePicker-day');
       let day = days[8]; // 03/08/2017
       ReactTestUtils.Simulate.click(day);
-      expect(lastSelectedDateRange).to.not.be.null;
-      expect(lastSelectedDateRange!.length).to.equal(7);
-      lastSelectedDateRange!.forEach((val, i) => expect(compareDates(val, new Date(2017, 2, 7 + i))).is.true);
+      expect(lastSelectedDateRange).not.toBeNull();
+      expect(lastSelectedDateRange!.length).toEqual(7);
+      lastSelectedDateRange!.forEach((val, i) => expect(compareDates(val, new Date(2017, 2, 7 + i))).toEqual(true));
     });
 
     it('Verify navigate to day in different month', () => {
@@ -231,9 +226,9 @@ describe('Calendar', () => {
       let day = days[34]; // 04/03/2017
       let firstDate = new Date(2017, 2, 28);
       ReactTestUtils.Simulate.click(day);
-      expect(lastSelectedDateRange).to.not.be.null;
-      expect(lastSelectedDateRange!.length).to.equal(7);
-      lastSelectedDateRange!.forEach((val, i) => expect(compareDates(val, addDays(firstDate, i))).is.true);
+      expect(lastSelectedDateRange).not.toBeNull();
+      expect(lastSelectedDateRange!.length).toEqual(7);
+      lastSelectedDateRange!.forEach((val, i) => expect(compareDates(val, addDays(firstDate, i))).toEqual(true));
     });
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx b/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
index d513a414592ec..d19e8bc5a2606 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
@@ -3,12 +3,10 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
 
-import * as ReactTestUtils from 'react-addons-test-utils';
+import * as ReactTestUtils from 'react-dom/test-utils';
 import { Callout } from './Callout';
 import { DirectionalHint } from '../../common/DirectionalHint';
 
-let { expect } = chai;
-
 describe('Callout', () => {
 
   it('target id strings does not throw exception', () => {
@@ -34,7 +32,7 @@ describe('Callout', () => {
       threwException = true;
     }
 
-    expect(threwException).to.be.false;
+    expect(threwException).toEqual(false);
   });
 
   it('target MouseEvents does not throw exception', () => {
@@ -60,7 +58,7 @@ describe('Callout', () => {
       threwException = true;
     }
 
-    expect(threwException).to.be.false;
+    expect(threwException).toEqual(false);
   });
 
   it('target HTMLElements does not throw exception', () => {
@@ -85,7 +83,7 @@ describe('Callout', () => {
       threwException = true;
     }
 
-    expect(threwException).to.be.false;
+    expect(threwException).toEqual(false);
   });
 
   // Once this has been deprecated completely in v1.0 this is no longer needed.
@@ -110,7 +108,7 @@ describe('Callout', () => {
       threwException = true;
     }
 
-    expect(threwException).to.be.false;
+    expect(threwException).toEqual(false);
   });
 
   it('without target does not throw exception', () => {
@@ -130,7 +128,7 @@ describe('Callout', () => {
     } catch (e) {
       threwException = true;
     }
-    expect(threwException).to.be.false;
+    expect(threwException).toEqual(false);
   });
 
   it('passes event to onDismiss prop', (done) => {
@@ -165,7 +163,7 @@ describe('Callout', () => {
     } catch (e) {
       threwException = true;
     }
-    expect(threwException).to.be.false;
+    expect(threwException).toEqual(false);
 
     let focusTarget = document.querySelector('#focustarget') as HTMLButtonElement;
 
@@ -173,7 +171,7 @@ describe('Callout', () => {
     setTimeout(() => {
       try {
         focusTarget.focus();
-        expect(gotEvent).to.be.eq(true, 'Event did not get passed to dismiss event');
+        expect(gotEvent).toEqual(true);
       } catch (e) {
         done(e);
       }
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
index 46a8d23948490..91042e81168db 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
@@ -3,9 +3,7 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
 
-import * as ReactTestUtils from 'react-addons-test-utils';
-
-let { expect } = chai;
+import * as ReactTestUtils from 'react-dom/test-utils';
 
 import { ChoiceGroup } from './ChoiceGroup';
 import { IChoiceGroupOption } from './ChoiceGroup.Props';
@@ -40,32 +38,32 @@ describe('ChoiceGroup', () => {
       exception = e;
       threwException = true;
     }
-    expect(threwException).to.be.false;
+    expect(threwException).toEqual(false);
 
     let renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
     let choiceOptions = renderedDOM.querySelectorAll(QUERY_SELECTOR);
 
-    expect((choiceOptions[0] as HTMLInputElement).checked).to.be.eq(false, 'Choice 1 was true before click');
-    expect((choiceOptions[1] as HTMLInputElement).checked).to.be.eq(false, 'Choice 2 was true before click');
-    expect((choiceOptions[2] as HTMLInputElement).checked).to.be.eq(false, 'Choice 3 was true before click');
+    expect((choiceOptions[0] as HTMLInputElement).checked).toEqual(false);
+    expect((choiceOptions[1] as HTMLInputElement).checked).toEqual(false);
+    expect((choiceOptions[2] as HTMLInputElement).checked).toEqual(false);
 
     ReactTestUtils.Simulate.change(choiceOptions[0]);
 
-    expect((choiceOptions[0] as HTMLInputElement).checked).to.be.eq(true, 'Choice 1 was false after click 1');
-    expect((choiceOptions[1] as HTMLInputElement).checked).to.be.eq(false, 'Choice 2 was true after click 1');
-    expect((choiceOptions[2] as HTMLInputElement).checked).to.be.eq(false, 'Choice 3 was true after click 1');
+    expect((choiceOptions[0] as HTMLInputElement).checked).toEqual(true);
+    expect((choiceOptions[1] as HTMLInputElement).checked).toEqual(false);
+    expect((choiceOptions[2] as HTMLInputElement).checked).toEqual(false);
 
     ReactTestUtils.Simulate.change(choiceOptions[1]);
 
-    expect((choiceOptions[0] as HTMLInputElement).checked).to.be.eq(false, 'Choice 1 was true after click 2');
-    expect((choiceOptions[1] as HTMLInputElement).checked).to.be.eq(true, 'Choice 2 was false after click 2');
-    expect((choiceOptions[2] as HTMLInputElement).checked).to.be.eq(false, 'Choice 3 was true after click 2');
+    expect((choiceOptions[0] as HTMLInputElement).checked).toEqual(false);
+    expect((choiceOptions[1] as HTMLInputElement).checked).toEqual(true);
+    expect((choiceOptions[2] as HTMLInputElement).checked).toEqual(false);
 
     ReactTestUtils.Simulate.change(choiceOptions[0]);
 
-    expect((choiceOptions[0] as HTMLInputElement).checked).to.be.eq(true, 'Choice 1 was false after click 3');
-    expect((choiceOptions[1] as HTMLInputElement).checked).to.be.eq(false, 'Choice 2 was true after click 3');
-    expect((choiceOptions[2] as HTMLInputElement).checked).to.be.eq(false, 'Choice 3 was true after click 3');
+    expect((choiceOptions[0] as HTMLInputElement).checked).toEqual(true);
+    expect((choiceOptions[1] as HTMLInputElement).checked).toEqual(false);
+    expect((choiceOptions[2] as HTMLInputElement).checked).toEqual(false);
   });
 
   it('An individual choice option can be disabled', () => {
@@ -89,14 +87,14 @@ describe('ChoiceGroup', () => {
       exception = e;
       threwException = true;
     }
-    expect(threwException).to.be.false;
+    expect(threwException).toEqual(false);
 
     let renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
     let choiceOptions = renderedDOM.querySelectorAll(QUERY_SELECTOR);
 
-    expect((choiceOptions[0] as HTMLInputElement).disabled).to.be.eq(true, 'Disabled option 1 is not disabled');
-    expect((choiceOptions[1] as HTMLInputElement).disabled).to.be.eq(false, 'Not disabled option 2 is disabled');
-    expect((choiceOptions[2] as HTMLInputElement).disabled).to.be.eq(false, 'Not disabled option 2 is disabled');
+    expect((choiceOptions[0] as HTMLInputElement).disabled).toEqual(true);
+    expect((choiceOptions[1] as HTMLInputElement).disabled).toEqual(false);
+    expect((choiceOptions[2] as HTMLInputElement).disabled).toEqual(false);
   });
 
   it('renders all choice options as disabled when disabled', () => {
@@ -121,14 +119,14 @@ describe('ChoiceGroup', () => {
       exception = e;
       threwException = true;
     }
-    expect(threwException).to.be.false;
+    expect(threwException).toEqual(false);
 
     let renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
     let choiceOptions = renderedDOM.querySelectorAll(QUERY_SELECTOR);
 
-    expect((choiceOptions[0] as HTMLInputElement).disabled).to.be.eq(true, 'Disabled option 1 is not disabled');
-    expect((choiceOptions[1] as HTMLInputElement).disabled).to.be.eq(true, 'Disabled option 2 is not disabled');
-    expect((choiceOptions[2] as HTMLInputElement).disabled).to.be.eq(true, 'Disabled option 3 is not disabled');
+    expect((choiceOptions[0] as HTMLInputElement).disabled).toEqual(true);
+    expect((choiceOptions[1] as HTMLInputElement).disabled).toEqual(true);
+    expect((choiceOptions[2] as HTMLInputElement).disabled).toEqual(true);
   });
 
   it('can act as an uncontrolled component', () => {
@@ -141,11 +139,11 @@ describe('ChoiceGroup', () => {
     let renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
     let choiceOptions = renderedDOM.querySelectorAll(QUERY_SELECTOR);
 
-    expect((choiceOptions[0] as HTMLInputElement).checked).to.be.eq(true, 'Choice 1 was not selected');
+    expect((choiceOptions[0] as HTMLInputElement).checked).toEqual(true);
 
     ReactTestUtils.Simulate.change(choiceOptions[1]);
 
-    expect((choiceOptions[1] as HTMLInputElement).checked).to.be.eq(true, 'Choice 2 was not selected');
+    expect((choiceOptions[1] as HTMLInputElement).checked).toEqual(true);
   });
 
   it('can render as a controlled component', () => {
@@ -164,14 +162,14 @@ describe('ChoiceGroup', () => {
     let renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
     let choiceOptions = renderedDOM.querySelectorAll(QUERY_SELECTOR);
 
-    expect((choiceOptions[0] as HTMLInputElement).checked).to.be.eq(true, 'Choice 1 was not selected');
+    expect((choiceOptions[0] as HTMLInputElement).checked).toEqual(true);
 
     ReactTestUtils.Simulate.change(choiceOptions[1]);
 
-    expect((choiceOptions[0] as HTMLInputElement).checked).to.be.eq(true, 'Choice 1 was not selected');
-    expect((choiceOptions[1] as HTMLInputElement).checked).to.be.eq(false, 'Choice 2 was selected prematurely');
+    expect((choiceOptions[0] as HTMLInputElement).checked).toEqual(true);
+    expect((choiceOptions[1] as HTMLInputElement).checked).toEqual(false);
 
-    expect(_selectedItem).to.equal(TEST_OPTIONS[1], 'onChange did not return new item');
+    expect(_selectedItem).toEqual(TEST_OPTIONS[1]);
   });
 
   it('extra <input> attributes appear in dom if specified', () => {
@@ -194,7 +192,7 @@ describe('ChoiceGroup', () => {
       return input.getAttribute('data-automation-id');
     };
 
-    expect(extraAttributeGetter(0)).to.be.eq('auto1', 'Specified data attribute did not match');
-    expect(extraAttributeGetter(1)).to.be.null;
+    expect(extraAttributeGetter(0)).toEqual('auto1');
+    expect(extraAttributeGetter(1)).toBeNull();
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.test.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.test.tsx
index ac3780b2d4426..ef3081f8e4788 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.test.tsx
@@ -2,18 +2,16 @@
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
-import * as ReactTestUtils from 'react-addons-test-utils';
+import * as ReactTestUtils from 'react-dom/test-utils';
 import { ColorPicker } from './ColorPicker';
 
-let { expect } = chai;
-
 describe('ColorPicker', () => {
   it('Props are correctly parsed', () => {
     let component = ReactTestUtils.renderIntoDocument(
       <ColorPicker color='#FFFFFF' />
     ) as ColorPicker;
 
-    expect(component.state.color.hex).to.equal('ffffff');
+    expect(component.state.color.hex).toEqual('ffffff');
   });
 
   it('Reacts to props changes', () => {
@@ -22,7 +20,7 @@ describe('ColorPicker', () => {
     ) as ColorPicker;
 
     component.componentWillReceiveProps({ color: '#AEAEAE' });
-    expect(component.state.color.hex).to.equal('aeaeae');
+    expect(component.state.color.hex).toEqual('aeaeae');
   });
 
   it('onColorChange is called', () => {
@@ -41,8 +39,8 @@ describe('ColorPicker', () => {
     const newColor = '#AEAEAE';
     component.componentWillReceiveProps({ color: newColor });
 
-    expect(component.state.color.hex).to.equal('aeaeae');
-    expect(color).to.equal(newColor);
+    expect(component.state.color.hex).toEqual('aeaeae');
+    expect(color).toEqual(newColor);
   });
 
   it('Hides alpha control slider', () => {
@@ -55,8 +53,8 @@ describe('ColorPicker', () => {
     let alphaTableHeader = renderedDOM.querySelector('.ms-ColorPicker-table > thead > tr > td:nth-child(5)');
     let alphaTableInput = renderedDOM.querySelector('.ms-ColorPicker-table > tbody> tr > td:nth-child(5)');
 
-    expect(alphaSlider).to.be.eq(null);
-    expect(alphaTableHeader).to.be.eq(null);
-    expect(alphaTableInput).to.be.eq(null);
+    expect(alphaSlider).toBeNull();
+    expect(alphaTableHeader).toBeNull();
+    expect(alphaTableInput).toBeNull();
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
index 67c0d0afdf98a..92da499632dfa 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
@@ -2,10 +2,9 @@
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
-import * as ReactTestUtils from 'react-addons-test-utils';
+import * as ReactTestUtils from 'react-dom/test-utils';
 import { mount, ReactWrapper } from 'enzyme';
 import { KeyCodes } from '../../Utilities';
-let { expect } = chai;
 
 import { ComboBox } from './ComboBox';
 import { IComboBox, IComboBoxOption } from './ComboBox.Props';
@@ -33,8 +32,8 @@ describe('ComboBox', () => {
       />);
     let comboBoxRoot = wrapper.find('.ms-ComboBox');
 
-    expect(comboBoxRoot.find('.ms-ComboBox.is-disabled').length).equals(0, `shouldn't be disabled`);
-    expect(comboBoxRoot.find('[data-is-interactable=true]').length).equals(1, 'data-is-interactable="true"');
+    expect(comboBoxRoot.find('.ms-ComboBox.is-disabled').length).toEqual(0);
+    expect(comboBoxRoot.find('[data-is-interactable=true]').length).toEqual(1);
 
     wrapper = mount(
       <ComboBox
@@ -44,8 +43,8 @@ describe('ComboBox', () => {
       />);
     comboBoxRoot = wrapper.find('.ms-ComboBox');
 
-    expect(comboBoxRoot.find('.ms-ComboBox.is-disabled').length).equals(1, `should be disabled`);
-    expect(comboBoxRoot.find('[data-is-interactable=false]').length).equals(1, 'data-is-interactable="false"');
+    expect(comboBoxRoot.find('.ms-ComboBox.is-disabled').length).toEqual(1);
+    expect(comboBoxRoot.find('[data-is-interactable=false]').length).toEqual(1);
   });
 
   it('Renders no selected item in default case', () => {
@@ -58,7 +57,7 @@ describe('ComboBox', () => {
     let comboBoxRoot = wrapper.find('.ms-ComboBox');
     let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = comboBoxRoot.find('[role="combobox"]');
 
-    expect(inputElement.text()).equals('');
+    expect(inputElement.text()).toEqual('');
   });
 
   it('Renders a selected item in uncontrolled case', () => {
@@ -71,7 +70,7 @@ describe('ComboBox', () => {
     let comboBoxRoot = wrapper.find('.ms-ComboBox');
     let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = comboBoxRoot.find('input');
 
-    expect(inputElement.props().value).equals('1');
+    expect(inputElement.props().value).toEqual('1');
   });
 
   it('Renders a selected item in controlled case', () => {
@@ -84,7 +83,7 @@ describe('ComboBox', () => {
     let comboBoxRoot = wrapper.find('.ms-ComboBox');
     let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = comboBoxRoot.find('input');
 
-    expect(inputElement.props().value).equals('1');
+    expect(inputElement.props().value).toEqual('1');
   });
 
   it('New options are not automatically added when allowFreeform on in controlled case', () => {
@@ -110,7 +109,7 @@ describe('ComboBox', () => {
     inputElement = comboBoxRoot.find('input');
     inputElement.simulate('change', { target: { value: 'f' } });
     inputElement.simulate('keydown', { which: KeyCodes.enter });
-    expect((comboBoxComponent as React.Component<any, any>).state.currentOptions.length).equals(DEFAULT_OPTIONS.length);
+    expect((comboBoxComponent as React.Component<any, any>).state.currentOptions.length).toEqual(DEFAULT_OPTIONS.length);
   });
 
   it('New options are automatically added when allowFreeform on in uncontrolled case', () => {
@@ -133,8 +132,8 @@ describe('ComboBox', () => {
     inputElement.simulate('change', { target: { value: 'f' } });
     inputElement.simulate('keydown', { which: KeyCodes.enter });
     let currentOptions = (comboBoxComponent as React.Component<any, any>).state.currentOptions;
-    expect(currentOptions.length).equals(DEFAULT_OPTIONS.length + 1);
-    expect(currentOptions[currentOptions.length - 1].text).equals('f');
+    expect(currentOptions.length).toEqual(DEFAULT_OPTIONS.length + 1);
+    expect(currentOptions[currentOptions.length - 1].text).toEqual('f');
   });
 
   it('Renders a default value with options', () => {
@@ -147,7 +146,7 @@ describe('ComboBox', () => {
     let comboBoxRoot = wrapper.find('.ms-ComboBox');
     let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = comboBoxRoot.find('input');
 
-    expect(inputElement.props().value).equals('1');
+    expect(inputElement.props().value).toEqual('1');
   });
 
   it('Renders a default value with no options', () => {
@@ -160,7 +159,7 @@ describe('ComboBox', () => {
     let comboBoxRoot = wrapper.find('.ms-ComboBox');
     let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = comboBoxRoot.find('input');
 
-    expect(inputElement.props().value).equals('1');
+    expect(inputElement.props().value).toEqual('1');
   });
 
   it('Can change items in uncontrolled case', () => {
@@ -171,6 +170,12 @@ describe('ComboBox', () => {
         defaultSelectedKey='1'
         options={ DEFAULT_OPTIONS }
       />);
+
+    // Manually assign `offsetParent` and `scrollIntoView` since it doesn't exist without DOM
+    let el = document.createElement('div') as Element;
+    el.scrollIntoView = () => null;
+    Object.defineProperty(HTMLElement.prototype, 'offsetParent', { get: () => el });
+
     comboBoxRoot = wrapper.find('.ms-ComboBox');
     let buttonElement = comboBoxRoot.find('button');
     buttonElement.simulate('click');
@@ -180,7 +185,7 @@ describe('ComboBox', () => {
     ReactTestUtils.Simulate.click(secondItemElement!);
 
     let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = comboBoxRoot.find('input');
-    expect(inputElement.props().value).equals('2');
+    expect(inputElement.props().value).toEqual('2');
   });
 
   it('Can insert text in uncontrolled case with autoComplete and allowFreeform on', () => {
@@ -198,7 +203,7 @@ describe('ComboBox', () => {
     inputElement = comboBoxRoot.find('input');
     inputElement.simulate('change', { target: { value: 'f' } });
     inputElement = comboBoxRoot.find('input');
-    expect(inputElement.props().value).equals('Foo');
+    expect(inputElement.props().value).toEqual('Foo');
   });
 
   it('Can insert text in uncontrolled case with autoComplete on and allowFreeform off', () => {
@@ -216,7 +221,7 @@ describe('ComboBox', () => {
     inputElement = comboBoxRoot.find('input');
     inputElement.simulate('change', { target: { value: 'f' } });
     inputElement = comboBoxRoot.find('input');
-    expect(inputElement.props().value).equals('Foo');
+    expect(inputElement.props().value).toEqual('Foo');
   });
 
   it('Can insert text in uncontrolled case with autoComplete off and allowFreeform on', () => {
@@ -234,7 +239,7 @@ describe('ComboBox', () => {
     inputElement = comboBoxRoot.find('input');
     inputElement.simulate('change', { target: { value: 'f' } });
     inputElement = comboBoxRoot.find('input');
-    expect(inputElement.props().value).equals('f');
+    expect(inputElement.props().value).toEqual('f');
   });
 
   it('Can insert text in uncontrolled case with autoComplete and allowFreeform off', () => {
@@ -252,7 +257,7 @@ describe('ComboBox', () => {
     inputElement = comboBoxRoot.find('input');
     inputElement.simulate('keydown', { which: 'f' });
     inputElement = comboBoxRoot.find('input');
-    expect(inputElement.props().value).equals('One');
+    expect(inputElement.props().value).toEqual('One');
   });
 
   it('Can change selected option with keyboard', () => {
@@ -268,7 +273,7 @@ describe('ComboBox', () => {
     inputElement = comboBoxRoot.find('input');
     inputElement.simulate('keydown', { which: KeyCodes.down });
     inputElement = comboBoxRoot.find('input');
-    expect(inputElement.props().value).equals('Foo');
+    expect(inputElement.props().value).toEqual('Foo');
   });
 
   it('Cannot insert text while disabled', () => {
@@ -285,7 +290,7 @@ describe('ComboBox', () => {
     inputElement = comboBoxRoot.find('input');
     inputElement.simulate('keydown', { which: KeyCodes.a });
     inputElement = comboBoxRoot.find('input');
-    expect(inputElement.props().value).equals('One');
+    expect(inputElement.props().value).toEqual('One');
   });
 
   it('Cannot change selected option with keyboard while disabled', () => {
@@ -302,7 +307,7 @@ describe('ComboBox', () => {
     inputElement = comboBoxRoot.find('input');
     inputElement.simulate('keydown', { which: KeyCodes.down });
     inputElement = comboBoxRoot.find('input');
-    expect(inputElement.props().value).equals('One');
+    expect(inputElement.props().value).toEqual('One');
   });
 
   it('Cannot expand the menu when clicking on the input while disabled', () => {
@@ -318,7 +323,7 @@ describe('ComboBox', () => {
     comboBoxRoot = wrapper.find('.ms-ComboBox');
     inputElement = comboBoxRoot.find('input');
     inputElement.simulate('click');
-    expect(comboBoxRoot.find('.is-opened').length).equals(0, `shouldn't be opened`);
+    expect(comboBoxRoot.find('.is-opened').length).toEqual(0);
   });
 
   it('Cannot expand the menu when clicking on the button while disabled', () => {
@@ -334,6 +339,6 @@ describe('ComboBox', () => {
     comboBoxRoot = wrapper.find('.ms-ComboBox');
     buttonElement = comboBoxRoot.find('button');
     buttonElement.simulate('click');
-    expect(comboBoxRoot.find('.is-opened').length).equals(0, `shouldn't be opened`);
+    expect(comboBoxRoot.find('.is-opened').length).toEqual(0);
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
index f49de3b897550..06b4b4421d2fa 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
@@ -3,9 +3,7 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
 import * as ReactDOM from 'react-dom';
-import * as ReactTestUtils from 'react-addons-test-utils';
-
-let { expect } = chai;
+import * as ReactTestUtils from 'react-dom/test-utils';
 
 import { CommandBar } from './CommandBar';
 import { IContextualMenuItem } from '../ContextualMenu/ContextualMenu.Props';
@@ -46,7 +44,7 @@ describe('CommandBar', () => {
     let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
     ReactTestUtils.Simulate.click(menuItem);
 
-    expect(document.querySelector('.SubMenuClass')).to.exist;
+    expect(document.querySelector('.SubMenuClass')).toBeDefined();
   });
 
   it('opens a menu with IContextualMenuItem.subMenuProps.items property', () => {
@@ -76,7 +74,7 @@ describe('CommandBar', () => {
     let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
     ReactTestUtils.Simulate.click(menuItem);
 
-    expect(document.querySelector('.SubMenuClass')).to.exist;
+    expect(document.querySelector('.SubMenuClass')).toBeDefined();
   });
 
   it('keeps menu open after update if item is still present', () => {
@@ -111,7 +109,7 @@ describe('CommandBar', () => {
       ReactTestUtils.Simulate.click(menuItem);
 
       // Make sure the menu is open before the re-render
-      expect(document.querySelector('.SubMenuClass')).to.exist;
+      expect(document.querySelector('.SubMenuClass')).toBeDefined();
 
       // Update the props, and re-render
       items.push({
@@ -127,7 +125,7 @@ describe('CommandBar', () => {
       ) as React.Component<CommandBar, {}>;
 
       // Make sure the menu is still open after the re-render
-      expect(document.querySelector('.SubMenuClass')).to.exist;
+      expect(document.querySelector('.SubMenuClass')).toBeDefined();
     } finally {
       ReactDOM.unmountComponentAtNode(renderContainer);
       document.body.removeChild(renderContainer);
@@ -166,7 +164,7 @@ describe('CommandBar', () => {
       ReactTestUtils.Simulate.click(menuItem);
 
       // Make sure the menu is open before the re-render
-      expect(document.querySelector('.SubMenuClass')).to.exist;
+      expect(document.querySelector('.SubMenuClass')).toBeDefined();
 
       // Update the props, and re-render
       items = [{
@@ -182,7 +180,7 @@ describe('CommandBar', () => {
       ) as React.Component<CommandBar, {}>;
 
       // Make sure the menu is still open after the re-render
-      expect(document.querySelector('.SubMenuClass')).not.to.exist;
+      expect(document.querySelector('.SubMenuClass')).toBeNull();
     } finally {
       ReactDOM.unmountComponentAtNode(renderContainer);
       document.body.removeChild(renderContainer);
@@ -221,7 +219,7 @@ describe('CommandBar', () => {
       ReactTestUtils.Simulate.click(menuItem);
 
       // Make sure the menu is open before the re-render
-      expect(document.querySelector('.SubMenuClass')).to.exist;
+      expect(document.querySelector('.SubMenuClass')).toBeDefined();
 
       // Update the props, and re-render
       items[0].subMenuProps!.items[0].className = 'SubMenuClassUpdate';
@@ -234,8 +232,8 @@ describe('CommandBar', () => {
       ) as React.Component<CommandBar, {}>;
 
       // Make sure the menu is still open after the re-render
-      expect(document.querySelector('.SubMenuClass')).not.to.exist;
-      expect(document.querySelector('.SubMenuClassUpdate')).to.exist;
+      expect(document.querySelector('.SubMenuClass')).toBeNull();
+      expect(document.querySelector('.SubMenuClassUpdate')).toBeDefined();
     } finally {
       ReactDOM.unmountComponentAtNode(renderContainer);
       document.body.removeChild(renderContainer);
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
index 02e1864d97c9f..5dcc75688cadc 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
@@ -2,14 +2,12 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import { Promise } from 'es6-promise';
-import * as ReactTestUtils from 'react-addons-test-utils';
+import * as ReactTestUtils from 'react-dom/test-utils';
 import {
   KeyCodes,
 } from '../../Utilities';
 import { FocusZoneDirection } from '../../FocusZone';
 
-let { expect } = chai;
-
 import { ContextualMenu, canAnyMenuItemsCheck } from './ContextualMenu';
 import { IContextualMenuItem, ContextualMenuItemType } from './ContextualMenu.Props';
 import { Layer } from '../Layer/Layer';
@@ -41,7 +39,7 @@ describe('ContextualMenu', () => {
 
     let menuList = document.querySelector('.ms-ContextualMenu-list') as HTMLUListElement;
 
-    expect(menuList.scrollHeight).to.be.lte(menuList.offsetHeight, 'ContextualMenu is showing a scrollbar due to checkmark');
+    expect(menuList.scrollHeight).toBeLessThanOrEqual(menuList.offsetHeight);
   });
 
   it('closes on left arrow if it is a submenu', () => {
@@ -66,7 +64,7 @@ describe('ContextualMenu', () => {
     let menuList = document.querySelector('ul.ms-ContextualMenu-list') as HTMLUListElement;
     ReactTestUtils.Simulate.keyDown(menuList, { which: KeyCodes.left });
 
-    expect(spyCalled).to.be.true;
+    expect(spyCalled).toEqual(true);
   });
 
   it('does not close on left arrow if it is a submenu with horizontal arrowDirection', () => {
@@ -92,7 +90,7 @@ describe('ContextualMenu', () => {
     let menuList = document.querySelector('ul.ms-ContextualMenu-list') as HTMLUListElement;
     ReactTestUtils.Simulate.keyDown(menuList, { which: KeyCodes.left });
 
-    expect(spyCalled).to.be.false;
+    expect(spyCalled).toEqual(false);
   });
 
   it('does not close on left arrow if it is a submenu with bidirectional arrowDirection', () => {
@@ -118,7 +116,7 @@ describe('ContextualMenu', () => {
     let menuList = document.querySelector('ul.ms-ContextualMenu-list') as HTMLUListElement;
     ReactTestUtils.Simulate.keyDown(menuList, { which: KeyCodes.left });
 
-    expect(spyCalled).to.be.false;
+    expect(spyCalled).toEqual(false);
   });
 
   it('opens a submenu item on right arrow', () => {
@@ -147,7 +145,7 @@ describe('ContextualMenu', () => {
 
     ReactTestUtils.Simulate.keyDown(menuItem, { which: KeyCodes.right });
 
-    expect(document.querySelector('.SubMenuClass')).to.exist;
+    expect(document.querySelector('.SubMenuClass')).toBeDefined();
   });
 
   it('opens a submenu item on click', () => {
@@ -177,7 +175,7 @@ describe('ContextualMenu', () => {
 
     ReactTestUtils.Simulate.click(menuItem);
 
-    expect(document.querySelector('.SubMenuClass')).to.exist;
+    expect(document.querySelector('.SubMenuClass')).toBeDefined();
   });
 
   it('still works with deprecated IContextualMenuItem.items property', () => {
@@ -204,7 +202,7 @@ describe('ContextualMenu', () => {
     let menuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
     ReactTestUtils.Simulate.keyDown(menuItem, { which: KeyCodes.right });
 
-    expect(document.querySelector('.SubMenuClass')).to.exist;
+    expect(document.querySelector('.SubMenuClass')).toBeDefined();
   });
 
   it('renders headers properly', () => {
@@ -233,15 +231,15 @@ describe('ContextualMenu', () => {
 
     let menuItems = document.querySelectorAll('li');
 
-    expect(menuItems.length).to.be.eq(4, 'This menu has an incorrect number of items');
+    expect(menuItems.length).toEqual(4);
     let headerOne = menuItems[0];
     let dividerOne = menuItems[2];
     let headerTwo = menuItems[3];
 
-    expect(headerOne.className).to.not.contain('divider', 'The first item is a divider and it should be a header');
-    expect(headerOne.firstElementChild!.className).to.contain('header', 'The first item was not a header');
-    expect(dividerOne.className).to.contain('divider', 'The third item in the contextualmenu was not a divider');
-    expect(headerTwo.firstElementChild!.className).to.contain('header', 'The final item was not a header');
+    expect(headerOne.className).not.toEqual(expect.stringMatching('divider'));
+    expect(headerOne.firstElementChild!.className).toEqual(expect.stringMatching('header'));
+    expect(dividerOne.className).toEqual(expect.stringMatching('divider'));
+    expect(headerTwo.firstElementChild!.className).toEqual(expect.stringMatching('header'));
   });
 
   it('renders sections properly', () => {
@@ -290,7 +288,7 @@ describe('ContextualMenu', () => {
     );
 
     let menuItems = document.querySelectorAll('li');
-    expect(menuItems.length).to.be.eq(8, 'This menu has an incorrect number of items');
+    expect(menuItems.length).toEqual(8);
   });
 
   it('does not return a value if no items are given', () => {
@@ -301,7 +299,7 @@ describe('ContextualMenu', () => {
     );
     let menuList = document.querySelector('.ms-ContextualMenu-list');
 
-    expect(menuList).to.be.eq(null, 'ContextualMenu is not return null even though no items are provided');
+    expect(menuList).toBeNull();
 
   });
 
@@ -332,7 +330,7 @@ describe('ContextualMenu', () => {
           break;
         }
       }
-      expect(document.activeElement).to.be.eq(focusedItem, 'The first element was not focused');
+      expect(document.activeElement).toEqual(focusedItem);
       done();
       resolve();
     }).catch(done());
@@ -365,7 +363,7 @@ describe('ContextualMenu', () => {
           break;
         }
       }
-      expect(document.activeElement).to.be.not.eq(focusedItem, 'The first element was not focused');
+      expect(document.activeElement).not.toEqual(focusedItem);
       done();
       resolve();
     }).catch(done);
@@ -420,9 +418,9 @@ describe('ContextualMenu', () => {
         />
       </div>
     );
-    expect(menuMounted).to.be.equal(true, 'Menu opened callback was not properly called');
-    expect(layerMountedFirst).to.be.equal(true, 'Menu Mounted First');
-    expect(menuMountedFirst).to.be.equal(false, 'Layer Mounted first');
+    expect(menuMounted).toEqual(true);
+    expect(layerMountedFirst).toEqual(true);
+    expect(menuMountedFirst).toEqual(false);
   });
 
   describe('canAnyMenuItemsCheck', () => {
@@ -433,7 +431,7 @@ describe('ContextualMenu', () => {
         { name: 'Item 3', key: 'Item 3' }
       ];
 
-      expect(canAnyMenuItemsCheck(items)).to.equal(false);
+      expect(canAnyMenuItemsCheck(items)).toEqual(false);
     });
 
     it('returns true when there is at least one checkable menu item', () => {
@@ -443,7 +441,7 @@ describe('ContextualMenu', () => {
         { name: 'Item 3', key: 'Item 3' }
       ];
 
-      expect(canAnyMenuItemsCheck(items)).to.equal(true);
+      expect(canAnyMenuItemsCheck(items)).toEqual(true);
     });
 
     it('returns true when there is a menu section with an item that can check', () => {
@@ -468,7 +466,7 @@ describe('ContextualMenu', () => {
           }
         }];
 
-      expect(canAnyMenuItemsCheck(items)).to.equal(true);
+      expect(canAnyMenuItemsCheck(items)).toEqual(true);
     });
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
index 1015b771abb82..214e1df2b5f42 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
@@ -2,7 +2,6 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
-let { expect } = chai;
 import { mount } from 'enzyme';
 
 import { Dialog } from './Dialog';
@@ -25,15 +24,15 @@ describe('Dialog', () => {
       />
     );
 
-    expect(document.querySelector('[role="dialog"]')).to.not.be.null;
+    expect(document.querySelector('[role="dialog"]')).not.toBeNull();
     wrapper.setProps({ hidden: true });
     wrapper.update();
 
     // give time for update to complete
     setTimeout(() => {
       try {
-        expect(document.querySelector('[role="dialog"]')).to.be.null;
-        expect(dismissedCalled).to.be.true;
+        expect(document.querySelector('[role="dialog"]')).toBeNull();
+        expect(dismissedCalled).toEqual(true);
       } catch (e) {
         done(e);
       }
@@ -56,9 +55,9 @@ describe('Dialog', () => {
     );
 
     const dialogHTML = document.querySelector('[role="dialog"]');
-    expect(dialogHTML).to.not.be.null;
-    expect(dialogHTML!.getAttribute('aria-labelledby')).to.match(/Dialog[\d+]+-title/, 'aria label should match the pattern');
-    expect(dialogHTML!.getAttribute('aria-describedby')).to.match(/Dialog[\d+]+-subText/, 'aria describeby should match the pattern');
+    expect(dialogHTML).not.toBeNull();
+    expect(dialogHTML!.getAttribute('aria-labelledby')).toMatch(/Dialog[\d+]+-title/);
+    expect(dialogHTML!.getAttribute('aria-describedby')).toMatch(/Dialog[\d+]+-subText/);
     wrapper.unmount();
   });
 
@@ -80,9 +79,9 @@ describe('Dialog', () => {
     );
 
     const dialogHTML = document.querySelector('[role="dialog"]');
-    expect(dialogHTML).to.not.be.null;
-    expect(dialogHTML!.getAttribute('aria-labelledby')).to.match(/Dialog[\d+]+-title/, 'aria label should match the pattern');
-    expect(dialogHTML!.getAttribute('aria-describedby')).equals(subTextAriaId, 'aria describeby should match the pattern');
+    expect(dialogHTML).not.toBeNull();
+    expect(dialogHTML!.getAttribute('aria-labelledby')).toMatch(/Dialog[\d+]+-title/);
+    expect(dialogHTML!.getAttribute('aria-describedby')).toEqual(subTextAriaId);
     wrapper.unmount();
   });
 
@@ -104,9 +103,9 @@ describe('Dialog', () => {
     );
 
     const dialogHTML = document.querySelector('[role="dialog"]');
-    expect(dialogHTML).to.not.be.null;
-    expect(dialogHTML!.getAttribute('aria-labelledby')).equals(titleAriaId, 'aria label should match the pattern');
-    expect(dialogHTML!.getAttribute('aria-describedby')).to.match(/Dialog[\d+]+-subText/, 'aria describeby should match the pattern');
+    expect(dialogHTML).not.toBeNull();
+    expect(dialogHTML!.getAttribute('aria-labelledby')).toEqual(titleAriaId);
+    expect(dialogHTML!.getAttribute('aria-describedby')).toMatch(/Dialog[\d+]+-subText/);
     wrapper.unmount();
   });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
index b941e070c97be..e8ce9da0a1d31 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
@@ -2,9 +2,7 @@
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
-import * as ReactTestUtils from 'react-addons-test-utils';
-
-let { expect } = chai;
+import * as ReactTestUtils from 'react-dom/test-utils';
 
 import {
   KeyCodes,
@@ -37,8 +35,8 @@ describe('Dropdown', () => {
       container);
     let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
 
-    expect(dropdownRoot.className).not.contains('is-disabled', `shouldn't be disabled`);
-    expect(dropdownRoot.getAttribute('data-is-focusable')).equals('true', 'data-is-focusable');
+    expect(dropdownRoot.className).not.toEqual(expect.stringMatching('is-disabled'));
+    expect(dropdownRoot.getAttribute('data-is-focusable')).toEqual('true');
 
     ReactDOM.render(
       <Dropdown
@@ -48,8 +46,8 @@ describe('Dropdown', () => {
       />,
       container);
 
-    expect(dropdownRoot.className).contains('is-disabled', `should be disabled`);
-    expect(dropdownRoot.getAttribute('data-is-focusable')).equals('false', 'data-is-focusable');
+    expect(dropdownRoot.className).toEqual(expect.stringMatching('is-disabled'));
+    expect(dropdownRoot.getAttribute('data-is-focusable')).toEqual('false');
   });
 
   it('Renders no selected item in default case', () => {
@@ -64,7 +62,7 @@ describe('Dropdown', () => {
     let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
     let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
-    expect(titleElement.textContent).equals('');
+    expect(titleElement.textContent).toEqual('');
   });
 
   it('Renders a selected item if option specifies selected', () => {
@@ -79,7 +77,7 @@ describe('Dropdown', () => {
     let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
     let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
-    expect(titleElement.textContent).equals('1');
+    expect(titleElement.textContent).toEqual('1');
   });
 
   it('Renders a selected item in uncontrolled case', () => {
@@ -95,7 +93,7 @@ describe('Dropdown', () => {
     let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
     let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
-    expect(titleElement.textContent).equals('1');
+    expect(titleElement.textContent).toEqual('1');
   });
 
   it('Renders a selected item in controlled case', () => {
@@ -111,7 +109,7 @@ describe('Dropdown', () => {
     let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
     let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
-    expect(titleElement.textContent).equals('1');
+    expect(titleElement.textContent).toEqual('1');
   });
 
   it('Can change items in uncontrolled case', () => {
@@ -136,7 +134,7 @@ describe('Dropdown', () => {
       ReactTestUtils.Simulate.click(secondItemElement);
     }
     finally {
-      expect(dropdownRoot!.querySelector('.ms-Dropdown-title')!.textContent).equals('2');
+      expect(dropdownRoot!.querySelector('.ms-Dropdown-title')!.textContent).toEqual('2');
     }
   });
 
@@ -153,7 +151,7 @@ describe('Dropdown', () => {
     ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
 
     let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
-    expect(titleElement.textContent).equals('1');
+    expect(titleElement.textContent).toEqual('1');
   });
 
   it('Will select the first valid item on Home keypress', () => {
@@ -169,7 +167,7 @@ describe('Dropdown', () => {
     ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.home });
 
     let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
-    expect(titleElement.textContent).equals('1');
+    expect(titleElement.textContent).toEqual('1');
   });
 
   it('Will select the last valid item on End keypress', () => {
@@ -185,7 +183,7 @@ describe('Dropdown', () => {
     ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.end });
 
     let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
-    expect(titleElement.textContent).equals('6');
+    expect(titleElement.textContent).toEqual('6');
   });
 
   it('Will skip over headers and separators on keypress', () => {
@@ -204,12 +202,12 @@ describe('Dropdown', () => {
 
     ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
     titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
-    expect(titleElement.textContent).equals('1');
+    expect(titleElement.textContent).toEqual('1');
 
     ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
     ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
     ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
     titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
-    expect(titleElement.textContent).equals('4');
+    expect(titleElement.textContent).toEqual('4');
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
index 2c155c5fda089..d433762d4d62a 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
@@ -1,7 +1,7 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
-import * as ReactTestUtils from 'react-addons-test-utils';
+import * as ReactTestUtils from 'react-dom/test-utils';
 /* tslint:enable:no-unused-variable */
 import { mount, shallow } from 'enzyme';
 import { setRTL } from '../../Utilities';
@@ -11,8 +11,6 @@ import { PersonaSize } from '../Persona';
 import { PersonaCoin } from '../../PersonaCoin';
 import { TestImages } from '../../common/TestImages';
 
-const { expect } = chai;
-
 describe('Facepile', () => {
   const facepilePersonas: IFacepilePersona[] = [
     {
@@ -48,9 +46,9 @@ describe('Facepile', () => {
       let facepile = ReactDOM.findDOMNode(wrapper as React.ReactInstance);
 
       let addButton = facepile.querySelectorAll('.ms-Facepile-addButton');
-      expect(addButton).to.have.length(1, 'Add button should render');
+      expect(addButton).toHaveLength(1);
       let buttons = facepile.querySelectorAll('.ms-Facepile-itemButton');
-      expect(buttons).to.have.length(1, 'Only one button should be rendered');
+      expect(buttons).toHaveLength(1);
     });
 
     it('renders chevron overflow button if overflowButtonProps are not null and OverflowButtonType equals downArrow', () => {
@@ -62,9 +60,9 @@ describe('Facepile', () => {
         />);
       let facepile = ReactDOM.findDOMNode(wrapper as React.ReactInstance);
       let overflowButton = facepile.querySelectorAll('.ms-Facepile-overflowButton');
-      expect(overflowButton).to.have.length(1, 'Overflow button should render');
+      expect(overflowButton).toHaveLength(1);
       let buttons = facepile.querySelectorAll('.ms-Facepile-itemButton');
-      expect(buttons).to.have.length(1, 'Only one button should be rendered');
+      expect(buttons).toHaveLength(1);
     });
 
     it('renders more overflow button if overflowButtonProps are not null as OverflowButtonType equals more', () => {
@@ -76,9 +74,9 @@ describe('Facepile', () => {
         />);
       let facepile = ReactDOM.findDOMNode(wrapper as React.ReactInstance);
       let overflowButton = facepile.querySelectorAll('.ms-Facepile-overflowButton');
-      expect(overflowButton).to.have.length(1, 'Overflow button should render');
+      expect(overflowButton).toHaveLength(1);
       let buttons = facepile.querySelectorAll('.ms-Facepile-itemButton');
-      expect(buttons).to.have.length(1, 'Only one button should be rendered');
+      expect(buttons).toHaveLength(1);
     });
 
     it('renders without descriptive overflow button if overflowButtonProps are not null and maximum personas are not exceeded', () => {
@@ -90,9 +88,9 @@ describe('Facepile', () => {
         />);
       let facepile = ReactDOM.findDOMNode(wrapper as React.ReactInstance);
       let overflowButton = facepile.querySelectorAll('.ms-Facepile-descriptiveOverflowButton');
-      expect(overflowButton).to.have.length(0, 'Overflow button should not render');
+      expect(overflowButton).toHaveLength(0);
       let buttons = facepile.querySelectorAll('.ms-Facepile-itemButton');
-      expect(buttons).to.have.length(0, 'No buttons should be rendered');
+      expect(buttons).toHaveLength(0);
     });
 
     it('renders with descriptive overflow button if overflowButtonProps are not null and maximum personas are exceeded', () => {
@@ -105,9 +103,9 @@ describe('Facepile', () => {
           overflowButtonType={ OverflowButtonType.descriptive }
         />);
       let overflowButton = wrapper.find('.ms-Facepile-descriptiveOverflowButton');
-      expect(overflowButton).to.have.length(1, 'Overflow button should render');
+      expect(overflowButton).toHaveLength(1);
       let buttons = wrapper.find('.ms-Facepile-itemButton');
-      expect(buttons).to.have.length(6, 'All six personas and overflow button should be rendered');
+      expect(buttons).toHaveLength(6);
     });
 
     it('renders no more than maximum allowed personas', () => {
@@ -117,7 +115,7 @@ describe('Facepile', () => {
           maxDisplayablePersonas={ 2 }
         />);
       let buttons = wrapper.find('.ms-Facepile-itemButton');
-      expect(buttons).to.have.length(2, 'Only two buttons should be rendered');
+      expect(buttons).toHaveLength(2);
     });
 
     it('persona is clickable if onClick property is set', () => {
@@ -134,9 +132,9 @@ describe('Facepile', () => {
           personas={ personas }
         />);
       let buttons = wrapper.find('.ms-Facepile-itemButton');
-      expect(buttons).to.have.length(1, 'Clickable Persona should render');
+      expect(buttons).toHaveLength(1);
       buttons.simulate('click');
-      expect(clicked).to.be.equal(1, 'Persona should have been clickable');
+      expect(clicked).toEqual(1);
     });
 
     it('personas and buttons render default size if not specified', () => {
@@ -150,14 +148,14 @@ describe('Facepile', () => {
         />);
       let facepile = ReactDOM.findDOMNode(wrapper as React.ReactInstance);
       let addButton = facepile.querySelectorAll('.ms-Facepile-addButton .ms-Persona-coin.ms-Persona--xs');
-      expect(addButton).to.have.length(1, 'Add button should render');
+      expect(addButton).toHaveLength(1);
       let faces = facepile.querySelectorAll('.ms-Facepile-person');
-      expect(faces).to.have.length(facepilePersonas.length, 'personas should render');
+      expect(faces).toHaveLength(facepilePersonas.length);
       for (let i = 0; i < faces.length; ++i) {
-        expect(faces[i].innerHTML).to.have.string('ms-Persona--xs');
+        expect(faces[i].innerHTML).toEqual(expect.stringMatching('ms-Persona--xs'));
       }
       let overflowButton = facepile.querySelectorAll('.ms-Facepile-overflowButton .ms-Persona--xs');
-      expect(overflowButton).to.have.length(1, 'Overflow button should render');
+      expect(overflowButton).toHaveLength(1);
     });
 
     it('personas and buttons render specified size', () => {
@@ -168,9 +166,9 @@ describe('Facepile', () => {
           personaSize={ PersonaSize.extraExtraSmall }
         />);
       let faces = wrapper.find(PersonaCoin);
-      expect(faces).to.have.length(facepilePersonas.length, 'XXSmall personas should render');
+      expect(faces).toHaveLength(facepilePersonas.length);
       wrapper.find(PersonaCoin).forEach((node) => {
-        expect(node.html()).to.contain('ms-Persona--xxs');
+        expect(node.html()).toEqual(expect.stringMatching('ms-Persona--xxs'));
       });
 
       // Test small size renders
@@ -180,9 +178,9 @@ describe('Facepile', () => {
           personaSize={ PersonaSize.small }
         />);
       faces = wrapper.find(PersonaCoin);
-      expect(faces).to.have.length(facepilePersonas.length, 'Small personas should render');
+      expect(faces).toHaveLength(facepilePersonas.length);
       wrapper.find(PersonaCoin).forEach((node) => {
-        expect(node.html()).to.contain('ms-Persona--sm');
+        expect(node.html()).toEqual(expect.stringMatching('ms-Persona--sm'));
       });
     });
   });
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
index f43ed5d5387dd..1ec4551d1782f 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
@@ -3,14 +3,12 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
 import * as ReactDOM from 'react-dom';
-import * as ReactTestUtils from 'react-addons-test-utils';
+import * as ReactTestUtils from 'react-dom/test-utils';
 import { KeyCodes } from '../../Utilities';
 
 import { FocusZone } from './FocusZone';
 import { FocusZoneDirection } from './FocusZone.Props';
 
-const { assert } = chai;
-
 describe('FocusZone', () => {
   let lastFocusedElement: HTMLElement | undefined;
 
@@ -97,54 +95,54 @@ describe('FocusZone', () => {
 
     // Focus the first button.
     ReactTestUtils.Simulate.focus(buttonA);
-    assert(lastFocusedElement === buttonA, 'buttonA was not focused');
+    expect(lastFocusedElement).toBe(buttonA);
 
     // Pressing down should go to b.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
-    assert(lastFocusedElement === buttonB, 'pressing down did not focus b');
+    expect(lastFocusedElement).toBe(buttonB);
 
     // Pressing down should go to c.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
-    assert(lastFocusedElement === buttonC, 'pressing down did not focus c');
+    expect(lastFocusedElement).toBe(buttonC);
 
     // Pressing down should stay on c.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
-    assert(lastFocusedElement === buttonC, 'pressing down again did not stay on c');
+    expect(lastFocusedElement).toBe(buttonC);
 
     // Pressing up should go to b.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
-    assert(lastFocusedElement === buttonB, 'pressing up did not focus b');
+    expect(lastFocusedElement).toBe(buttonB);
 
     // Pressing up should go to a.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
-    assert(lastFocusedElement === buttonA, 'pressing up did not focus a');
+    expect(lastFocusedElement).toBe(buttonA);
 
     // Pressing up should stay on a.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
-    assert(lastFocusedElement === buttonA, 'pressing up again did not stay on a');
+    expect(lastFocusedElement).toBe(buttonA);
 
     // Click on c to focus it.
     ReactTestUtils.Simulate.focus(buttonC);
-    assert(lastFocusedElement === buttonC, 'buttonC was not focused');
+    expect(lastFocusedElement).toBe(buttonC);
 
     // Pressing up should move to b.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
-    assert(lastFocusedElement === buttonB, 'pressing up after clicking on c did not focus b');
+    expect(lastFocusedElement).toBe(buttonB);
 
     // Test that pressing horizontal buttons don't move focus.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
-    assert(lastFocusedElement === buttonB, 'pressing left did not keep focus on b');
+    expect(lastFocusedElement).toBe(buttonB);
 
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
-    assert(lastFocusedElement === buttonB, 'pressing right did not keep focus on b');
+    expect(lastFocusedElement).toBe(buttonB);
 
     // Press home should go to the first target.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.home });
-    assert(lastFocusedElement === buttonA, 'pressing home did not move focus to a');
+    expect(lastFocusedElement).toBe(buttonA);
 
     // // Press end should go to the last target.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.end });
-    assert(lastFocusedElement === buttonC, 'pressing end did not move focus to c');
+    expect(lastFocusedElement).toBe(buttonC);
   });
 
   it('can use arrows horizontally', () => {
@@ -193,54 +191,54 @@ describe('FocusZone', () => {
 
     // Focus the first button.
     ReactTestUtils.Simulate.focus(buttonA);
-    assert(lastFocusedElement === buttonA, 'buttonA was not focused');
+    expect(lastFocusedElement).toBe(buttonA);
 
     // Pressing right should go to b.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
-    assert(lastFocusedElement === buttonB, 'pressing right did not focus b');
+    expect(lastFocusedElement).toBe(buttonB);
 
     // Pressing right should go to c.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
-    assert(lastFocusedElement === buttonC, 'pressing right did not focus c');
+    expect(lastFocusedElement).toBe(buttonC);
 
     // Pressing right should stay on c.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
-    assert(lastFocusedElement === buttonC, 'pressing right again did not stay on c');
+    expect(lastFocusedElement).toBe(buttonC);
 
     // Pressing left should go to b.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
-    assert(lastFocusedElement === buttonB, 'pressing left did not focus b');
+    expect(lastFocusedElement).toBe(buttonB);
 
     // Pressing left should go to a.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
-    assert(lastFocusedElement === buttonA, 'pressing left did not focus a');
+    expect(lastFocusedElement).toBe(buttonA);
 
     // Pressing left should stay on a.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
-    assert(lastFocusedElement === buttonA, 'pressing left again did not stay on a');
+    expect(lastFocusedElement).toBe(buttonA);
 
     // Click on c to focus it.
     ReactTestUtils.Simulate.focus(buttonC);
-    assert(lastFocusedElement === buttonC, 'buttonC was not focused');
+    expect(lastFocusedElement).toBe(buttonC);
 
     // Pressing left should move to b.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
-    assert(lastFocusedElement === buttonB, 'pressing left after clicking on c did not focus b');
+    expect(lastFocusedElement).toBe(buttonB);
 
     // Test that pressing vertical buttons don't move focus.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
-    assert(lastFocusedElement === buttonB, 'pressing up did not keep focus on b');
+    expect(lastFocusedElement).toBe(buttonB);
 
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
-    assert(lastFocusedElement === buttonB, 'pressing down did not keep focus on b');
+    expect(lastFocusedElement).toBe(buttonB);
 
     // Press home should go to the first target.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.home });
-    assert(lastFocusedElement === buttonA, 'pressing home did not move focus to a');
+    expect(lastFocusedElement).toBe(buttonA);
 
     // // Press end should go to the last target.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.end });
-    assert(lastFocusedElement === buttonC, 'pressing end did not move focus to c');
+    expect(lastFocusedElement).toBe(buttonC);
   });
 
   it('can use arrows bidirectionally', () => {
@@ -330,31 +328,31 @@ describe('FocusZone', () => {
 
     // Focus the first button.
     ReactTestUtils.Simulate.focus(buttonA);
-    assert(lastFocusedElement === buttonA, 'buttonA was not focused');
+    expect(lastFocusedElement).toBe(buttonA);
 
     // Pressing right should go to b.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
-    assert(lastFocusedElement === buttonB, 'pressing right did not focus b');
+    expect(lastFocusedElement).toBe(buttonB);
 
     // Pressing down should go to c.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
-    assert(lastFocusedElement === buttonC, 'pressing down did not focus c');
+    expect(lastFocusedElement).toBe(buttonC);
 
     // Pressing down should go to e.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
-    assert(lastFocusedElement === buttonE, 'pressing down did not focus e');
+    expect(lastFocusedElement).toBe(buttonE);
 
     // Pressing left should go to d.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
-    assert(lastFocusedElement === buttonD, 'pressing left did not focus d');
+    expect(lastFocusedElement).toBe(buttonD);
 
     // Pressing up should go to c.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
-    assert(lastFocusedElement === buttonC, 'pressing up did not focus c');
+    expect(lastFocusedElement).toBe(buttonC);
 
     // Pressing up should go to a.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
-    assert(lastFocusedElement === buttonA, 'pressing up did not focus a');
+    expect(lastFocusedElement).toBe(buttonA);
   });
 
   it('correctly skips data-not-focusable elements', () => {
@@ -409,15 +407,15 @@ describe('FocusZone', () => {
 
     // Focus the first button.
     ReactTestUtils.Simulate.focus(buttonA);
-    assert(lastFocusedElement === buttonA, 'buttonA was not focused');
+    expect(lastFocusedElement).toBe(buttonA);
 
     // Pressing right should go to b.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
-    assert(lastFocusedElement === buttonC, 'pressing down did not focus c');
+    expect(lastFocusedElement).toBe(buttonC);
 
     // Pressing down should go to c.
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
-    assert(lastFocusedElement === buttonA, 'pressing down did not focus a');
+    expect(lastFocusedElement).toBe(buttonA);
   });
 
   it('skips subzone elements until manually entered', () => {
@@ -489,30 +487,30 @@ describe('FocusZone', () => {
 
     // Focus the first button.
     ReactTestUtils.Simulate.focus(buttonA);
-    assert(lastFocusedElement === buttonA, 'buttonA was not focused');
+    expect(lastFocusedElement).toBe(buttonA);
 
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
-    assert(lastFocusedElement === divB, 'pressing right did not focus divB');
+    expect(lastFocusedElement).toBe(divB);
 
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
-    assert(lastFocusedElement === buttonC, 'pressing right did not skip to buttonC');
+    expect(lastFocusedElement).toBe(buttonC);
 
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
-    assert(lastFocusedElement === divB, 'pressing left did not skip back to divB');
+    expect(lastFocusedElement).toBe(divB);
 
     ReactTestUtils.Simulate.keyDown(divB, { which: KeyCodes.enter });
-    assert(lastFocusedElement === buttonB, 'pressing enter did not jump in to buttonB');
+    expect(lastFocusedElement).toBe(buttonB);
 
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
-    assert(lastFocusedElement === buttonC, 'pressing enter did not move to buttonC');
+    expect(lastFocusedElement).toBe(buttonC);
 
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
-    assert(lastFocusedElement === divB, 'pressing left did not skip back to divB');
+    expect(lastFocusedElement).toBe(divB);
   });
 
   it('skips child focusZone elements until manually entered', () => {
     const isInnerZoneKeystroke = (e: React.KeyboardEvent<HTMLElement>): boolean =>
-    e.which === KeyCodes.enter;
+      e.which === KeyCodes.enter;
 
     const component = ReactTestUtils.renderIntoDocument(
       <div { ...{ onFocusCapture: _onFocus } }>
@@ -579,25 +577,25 @@ describe('FocusZone', () => {
 
     // Focus the first button.
     ReactTestUtils.Simulate.focus(buttonA);
-    assert(lastFocusedElement === buttonA, 'buttonA was not focused');
+    expect(lastFocusedElement).toBe(buttonA);
 
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
-    assert(lastFocusedElement === divB, 'pressing right did not focus divB');
+    expect(lastFocusedElement).toBe(divB);
 
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
-    assert(lastFocusedElement === buttonC, 'pressing right did not skip to buttonC');
+    expect(lastFocusedElement).toBe(buttonC);
 
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
-    assert(lastFocusedElement === divB, 'pressing left did not skip back to divB');
+    expect(lastFocusedElement).toBe(divB);
 
     ReactTestUtils.Simulate.keyDown(divB, { which: KeyCodes.enter });
-    assert(lastFocusedElement === buttonB, 'pressing enter did not jump in to buttonB');
+    expect(lastFocusedElement).toBe(buttonB);
 
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
-    assert(lastFocusedElement === buttonC, 'pressing enter did not move to buttonC');
+    expect(lastFocusedElement).toBe(buttonC);
 
     ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
-    assert(lastFocusedElement === divB, 'pressing left did not skip back to divB');
+    expect(lastFocusedElement).toBe(divB);
   });
 
   it('Focus first tabbable element, when active element is dynamically disabled', () => {
@@ -637,17 +635,17 @@ describe('FocusZone', () => {
 
     // ButtonA should be focussed.
     focusZone!.focus();
-    assert(lastFocusedElement === buttonA, 'buttonA was not focused');
+    expect(lastFocusedElement).toBe(buttonA);
 
     buttonA.disabled = true;
 
     // Focus the text area, outside focus zone.
     ReactTestUtils.Simulate.focus(textArea);
-    assert(lastFocusedElement === textArea, 'textArea was not focused');
+    expect(lastFocusedElement).toBe(textArea);
 
     // ButtonB should be focussed.
     focusZone!.focus();
-    assert(lastFocusedElement === buttonB, 'buttonB was not focused ');
+    expect(lastFocusedElement).toBe(buttonB);
   });
 
   it('removes tab-index of previous element when another one is selected (mouse & keyboard)', () => {
@@ -692,23 +690,23 @@ describe('FocusZone', () => {
 
     // ButtonA should be focussed.
     focusZone.focus();
-    assert(lastFocusedElement === buttonA, 'buttonA was not focused after initial focus');
+    expect(lastFocusedElement).toBe(buttonA);
 
-    assert(buttonA.tabIndex === 0, 'buttonA tab-index was not on after initial focus');
-    assert(buttonB.tabIndex === -1, 'buttonB tab-index was not off after initial focus');
+    expect(buttonA.tabIndex).toBe(0);
+    expect(buttonB.tabIndex).toBe(-1);
 
     // Pressing right should go to b.
     ReactTestUtils.Simulate.keyDown(focusZoneElement, { which: KeyCodes.right });
-    assert(lastFocusedElement === buttonB, 'buttonB was not focused after key down');
+    expect(lastFocusedElement).toBe(buttonB);
 
-    assert(buttonA.tabIndex === -1, 'buttonA tab-index was not off after key down');
-    assert(buttonB.tabIndex === 0, 'buttonB tab-index was not on after key down');
+    expect(buttonA.tabIndex).toBe(-1);
+    expect(buttonB.tabIndex).toBe(0);
 
     // Clicking on A should enable its tab-index and disable others.
     ReactTestUtils.Simulate.mouseDown(buttonAElement);
-    assert(lastFocusedElement === buttonA, 'buttonA was not focused after mouse down');
+    expect(lastFocusedElement).toBe(buttonA);
 
-    assert(buttonA.tabIndex === 0, 'buttonA tab-index was not on after mouse down');
-    assert(buttonB.tabIndex === -1, 'buttonB tab-index was not off after mouse down');
+    expect(buttonA.tabIndex).toBe(0);
+    expect(buttonB.tabIndex).toBe(-1);
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
index 601bd8863c971..6cfd399dc2b4d 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
@@ -3,9 +3,8 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
 import * as ReactDOM from 'react-dom';
-import * as ReactTestUtils from 'react-addons-test-utils';
-
-let { expect } = chai;
+import * as ReactTestUtils from 'react-dom/test-utils';
+import { shallow, mount, ReactWrapper } from 'enzyme';
 
 import { Image } from './Image';
 import { ImageFit, ImageLoadState } from './Image.Props';
@@ -15,126 +14,109 @@ const testImage1x1 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYA
 const testImage1x2 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAACCAYAAACZgbYnAAAAEklEQVQImWP4////fyYGBgYGAB32A/+PRyXoAAAAAElFTkSuQmCC';
 const testImage2x1 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAABCAYAAAD0In+KAAAAEUlEQVQImWP8////fwYGBgYAGfgD/hEzDhoAAAAASUVORK5CYII=';
 const brokenImage = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgFcSJAAAAC0lEQVQImWP4DwQACfsD/eNV8pwAAAAASUVORK5CYII=';
-/* tslint:enable:no-unused-variable */
 
 describe('Image', () => {
+  beforeAll(() => {
+    // Manually set image height and width since there is no DOM
+    Object.defineProperty(HTMLImageElement.prototype, 'naturalHeight', { get: () => 1 });
+    Object.defineProperty(HTMLImageElement.prototype, 'naturalWidth', { get: () => 1 });
+  });
 
   it('renders an image', (done) => {
-    const returnDone = (): void => done();
-
-    ReactTestUtils.renderIntoDocument(
+    let component = ReactTestUtils.renderIntoDocument(
       <Image
         src={ testImage1x1 }
-        onLoad={ returnDone }
+        onLoad={ () => done() }
       />
     );
+
+    let image = ReactTestUtils.findRenderedDOMComponentWithTag(component as any, 'img');
+    ReactTestUtils.Simulate.load(image);
+
   });
 
-  it('can cover a portrait (tall) frame with a square image', (done) => {
-    let root = document.createElement('div');
-    let onLoadingStateChange = (loadState: ImageLoadState) => {
-      if (loadState === ImageLoadState.loaded) {
-        let image = document.querySelector('.ms-Image.is-portraitFrame .ms-Image-image') as Element;
-        try {
-          expect(image.className).to.contain('ms-Image-image--landscape');
-        } catch (e) { done(e); }
-        done();
-      }
-    };
-    document.body.appendChild(root);
-    ReactDOM.render<HTMLDivElement>(
-      <Image
-        src={ testImage1x1 }
-        width={ 1 }
-        height={ 3 }
-        imageFit={ ImageFit.cover }
-        className='is-portraitFrame'
-        onLoadingStateChange={ onLoadingStateChange }
-      />, root
+  it('can cover a portrait (tall) frame with a square image', () => {
+    let component = mount(
+      <div>
+        <Image
+          src={ testImage1x1 }
+          width={ 1 }
+          height={ 3 }
+          imageFit={ ImageFit.cover }
+          className='is-portraitFrame'
+        />
+      </div>
     );
+
+    component.find('img').simulate('load');
+    expect(component.find('.ms-Image-image--landscape')).toHaveLength(1);
   });
 
-  it('can cover a landscape (wide) frame with a square image', (done) => {
-    let root = document.createElement('div');
-    let onLoadingStateChange = (loadState: ImageLoadState) => {
-      if (loadState === ImageLoadState.loaded) {
-        let image = document.querySelector('.ms-Image.is-landscapeFrame .ms-Image-image') as Element;
-        try {
-          expect(image.className).to.contain('ms-Image-image--portrait');
-        } catch (e) { done(e); }
-        done();
-      }
-    };
-    document.body.appendChild(root);
-    ReactDOM.render<HTMLDivElement>(
-      <Image
-        src={ testImage1x1 }
-        width={ 3 }
-        height={ 1 }
-        imageFit={ ImageFit.cover }
-        className='is-landscapeFrame'
-        onLoadingStateChange={ onLoadingStateChange }
-      />, root
+  it('can cover a landscape (wide) frame with a square image', () => {
+    let component = mount(
+      <div>
+        <Image
+          src={ testImage1x1 }
+          width={ 3 }
+          height={ 1 }
+          imageFit={ ImageFit.cover }
+          className='is-landscapeFrame'
+
+        />
+      </div>
     );
+    component.find('img').simulate('load');
+    expect(component.find('.ms-Image-image--portrait')).toHaveLength(1);
   });
 
-  it('can cover a landscape (wide) parent element with a square image', (done) => {
-    let root = document.createElement('div');
-    let onLoadingStateChange = (loadState: ImageLoadState) => {
-      if (loadState === ImageLoadState.loaded) {
-        let image = document.querySelector('.ms-Image.is-frameMaximizedPortrait .ms-Image-image') as Element;
-        try {
-          expect(image.className).to.contain('ms-Image-image--portrait');
-        } catch (e) { done(e); }
-        done();
-      }
-    };
-    document.body.appendChild(root);
-    ReactDOM.render<HTMLDivElement>(
-      <div style={ { width: '20px', height: '10px' } }>
+  it('can cover a landscape (wide) parent element with a square image', () => {
+    let component = mount(
+      <div style={ { width: '10px', height: '20px' } }>
         <Image
           className='is-frameMaximizedPortrait'
           imageFit={ ImageFit.cover }
           maximizeFrame
           src={ testImage1x1 }
-          onLoadingStateChange={ onLoadingStateChange }
         />
-      </div>, root
-    );
+      </div>);
+
+    // Manually set client height and width since there is no DOM
+    Object.defineProperty(HTMLDivElement.prototype, 'clientHeight', { get: () => 10, configurable: true });
+    Object.defineProperty(HTMLDivElement.prototype, 'clientWidth', { get: () => 20, configurable: true });
+    component.find('img').simulate('load');
+
+    expect(component.update().find('.ms-Image-image--portrait')).toHaveLength(1);
   });
 
-  it('can cover a portrait (tall) parent element with a square image', (done) => {
-    let root = document.createElement('div');
-    let onLoadingStateChange = (loadState: ImageLoadState) => {
-      if (loadState === ImageLoadState.loaded) {
-        let image = document.querySelector('.ms-Image.is-frameMaximizedLandscape .ms-Image-image') as Element;
-        try {
-          expect(image.className).to.contain('ms-Image-image--landscape');
-        } catch (e) { done(e); }
-        done();
-      }
-    };
-    document.body.appendChild(root);
-    ReactDOM.render<HTMLDivElement>(
+  it('can cover a portrait (tall) parent element with a square image', () => {
+    let component = mount(
       <div style={ { width: '10px', height: '20px' } }>
         <Image
           src={ testImage1x1 }
           imageFit={ ImageFit.cover }
           className='is-frameMaximizedLandscape'
-          onLoadingStateChange={ onLoadingStateChange }
           maximizeFrame
         />
-      </div>, root
+      </div>
     );
+
+    // Manually set client height and width since there is no DOM
+    Object.defineProperty(HTMLDivElement.prototype, 'clientHeight', { get: () => 20, configurable: true });
+    Object.defineProperty(HTMLDivElement.prototype, 'clientWidth', { get: () => 10, configurable: true });
+
+    component.find('img').simulate('load');
+    expect(component.update().find('.ms-Image-image--landscape')).toHaveLength(1);
   });
 
   it('allows onError events to be attached', (done) => {
-    const returnDone = (): void => done();
-    ReactTestUtils.renderIntoDocument(
+    let component = ReactTestUtils.renderIntoDocument(
       <Image
         src={ brokenImage }
-        onError={ returnDone }
+        onError={ () => done() }
       />
     );
+
+    let img = ReactTestUtils.findRenderedDOMComponentWithTag(component as any, 'img');
+    ReactTestUtils.Simulate.error(img);
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.test.tsx b/packages/office-ui-fabric-react/src/components/Label/Label.test.tsx
index 557ebc925e833..b1db5d418fa89 100644
--- a/packages/office-ui-fabric-react/src/components/Label/Label.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Label/Label.test.tsx
@@ -3,9 +3,7 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
 import * as ReactDOM from 'react-dom';
-import * as ReactTestUtils from 'react-addons-test-utils';
-
-let { expect } = chai;
+import * as ReactTestUtils from 'react-dom/test-utils';
 
 import { Label } from './Label';
 
@@ -17,7 +15,7 @@ describe('Label', () => {
     );
     let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
 
-    expect(renderedDOM.textContent).to.equal('test');
+    expect(renderedDOM.textContent).toEqual('test');
   });
 
 });
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.test.tsx b/packages/office-ui-fabric-react/src/components/Layer/Layer.test.tsx
index 27c4c3a5ee129..6ef9b89c09bb6 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/Layer.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.test.tsx
@@ -7,8 +7,6 @@ import * as PropTypes from 'prop-types';
 import { Layer } from './Layer';
 import { LayerHost } from './LayerHost';
 
-let { expect } = chai;
-
 describe('Layer', () => {
 
   it('can render in a targeted LayerHost and pass context through', () => {
@@ -69,12 +67,12 @@ describe('Layer', () => {
 
       let parentElement = appElement.querySelector('#parent');
 
-      expect(parentElement).is.not.empty;
-      expect(parentElement!.ownerDocument).is.not.empty;
+      expect(parentElement).toBeDefined();
+      expect(parentElement!.ownerDocument).toBeDefined();
 
       let childElement = appElement.querySelector('#child') as Element;
 
-      expect(childElement.textContent).equals('foo');
+      expect(childElement.textContent).toEqual('foo');
     } finally {
       ReactDOM.unmountComponentAtNode(appElement);
       appElement.remove();
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.test.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.test.tsx
index 74533572a6aca..4117a48d203a9 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.test.tsx
@@ -2,9 +2,7 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import * as ReactDOM from 'react-dom';
-import * as ReactTestUtils from 'react-addons-test-utils';
-
-let { expect } = chai;
+import * as ReactTestUtils from 'react-dom/test-utils';
 
 import { MessageBar } from './MessageBar';
 
@@ -24,13 +22,13 @@ describe('MessageBar', () => {
       it('is present when onDismiss exists', () => {
         const renderedDOM: HTMLElement = renderIntoDocument(<MessageBar onDismiss={ noop } isMultiline={ false } />);
         let dismissElement = renderedDOM.querySelector('.ms-MessageBar-dismissal');
-        expect(dismissElement).to.not.be.null;
+        expect(dismissElement).not.toBeNull();
       });
 
       it('is not present when onDismiss is missing', () => {
         const renderedDOM: HTMLElement = renderIntoDocument(<MessageBar isMultiline={ false } />);
         let dismissElement = renderedDOM.querySelector('.ms-MessageBar-dismissal');
-        expect(dismissElement).to.be.null;
+        expect(dismissElement).toBeNull();
       });
     });
 
@@ -38,13 +36,13 @@ describe('MessageBar', () => {
       it('is present when onDismiss exists', () => {
         const renderedDOM: HTMLElement = renderIntoDocument(<MessageBar onDismiss={ noop } isMultiline={ true } />);
         let dismissElement = renderedDOM.querySelector('.ms-MessageBar-dismissal');
-        expect(dismissElement).to.not.be.null;
+        expect(dismissElement).not.toBeNull();
       });
 
       it('is not present when onDismiss is missing', () => {
         const renderedDOM: HTMLElement = renderIntoDocument(<MessageBar isMultiline={ true } />);
         let dismissElement = renderedDOM.querySelector('.ms-MessageBar-dismissal');
-        expect(dismissElement).to.be.null;
+        expect(dismissElement).toBeNull();
       });
     });
   });
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.test.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.test.tsx
index 632b6eb3c39af..8096e2a6a5bfc 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { shallow } from 'enzyme';
-const { expect } = chai;
+
 import { OverflowSet } from './OverflowSet';
 import * as sinon from 'sinon';
 
@@ -10,7 +10,7 @@ describe('OverflowSet', () => {
     const onRenderOverflowButton = sinon.spy();
     shallow(<OverflowSet onRenderItem={ onRenderItem } onRenderOverflowButton={ onRenderOverflowButton } />);
 
-    expect(onRenderOverflowButton.called).to.equal(false);
+    expect(onRenderOverflowButton.called).toEqual(false);
   });
 
   it('does not render overflow when overflow items is an empty array', () => {
@@ -18,6 +18,6 @@ describe('OverflowSet', () => {
     const onRenderOverflowButton = sinon.spy();
     shallow(<OverflowSet onRenderItem={ onRenderItem } onRenderOverflowButton={ onRenderOverflowButton } overflowItems={ [] } />);
 
-    expect(onRenderOverflowButton.called).to.equal(false);
+    expect(onRenderOverflowButton.called).toEqual(false);
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.test.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.test.tsx
index c940a2a5a50a8..3b200ec3e7b1c 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.test.tsx
@@ -4,8 +4,6 @@ import * as React from 'react';
 
 import * as ReactDOM from 'react-dom';
 
-let { expect } = chai;
-
 import { Panel } from './Panel';
 
 let div: HTMLElement;
@@ -39,12 +37,12 @@ describe('Panel', () => {
 
     panel.dismiss();
 
-    expect(dismissCalled).equals(true, 'onDismiss was not called');
-    expect(dismissedCalled).equals(false, 'onDismissed was called prematurely');
+    expect(dismissCalled).toEqual(true);
+    expect(dismissedCalled).toEqual(false);
 
     setTimeout(() => {
       try {
-        expect(dismissedCalled).equals(true, 'onDismissed not called');
+        expect(dismissedCalled).toEqual(true);
         done();
       } catch (e) {
         done(e);
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
index 47495676d2c1d..09414bd5af25a 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
@@ -4,12 +4,15 @@ import { setRTL } from '../../Utilities';
 import { Persona } from './Persona';
 import { PersonaInitialsColor } from './Persona.Props';
 import { mount, ReactWrapper } from 'enzyme';
-import * as stylesImport from './Persona.scss';
-const styles: any = stylesImport;
 
 const testImage1x1 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQImWP4DwQACfsD/eNV8pwAAAAASUVORK5CYII=';
+const STYLES = {
+  darkRed: '.ms-Persona-initials--darkRed',
+  initials: '.ms-Persona-initials',
+  lightBlue: '.ms-Persona-initials--lightBlue',
+  red: '.ms-Persona-initials--red',
 
-const { expect } = chai;
+};
 
 describe('Persona', () => {
   beforeEach(() => {
@@ -19,48 +22,51 @@ describe('Persona', () => {
   describe('initials and colors', () => {
     it('renders with expected initialsColor if none was provided', () => {
       const wrapper = mount(<Persona primaryText='Kat Larrson' />);
-      let result = wrapper.find('.' + styles.initialsIsRed);
-      expect(result).to.have.length(1);
+      let result = wrapper.find(STYLES.red);
+      expect(result).toHaveLength(1);
 
       const wrapper2 = mount(<Persona primaryText='Annie Lindqvist' />);
-      result = wrapper2.find('.' + styles.initialsIsDarkRed);
-      expect(result).to.have.length(1);
+      result = wrapper2.find(STYLES.darkRed);
+      expect(result).toHaveLength(1);
     });
 
     it('uses provided initialsColor if one was specified', () => {
       const wrapper = mount(<Persona primaryText='Kat Larrson' initialsColor={ PersonaInitialsColor.lightBlue } />);
-      let result = wrapper.find('.' + styles.initialsIsLightBlue);
-      expect(result).to.have.length(1);
+      let result = wrapper.find(STYLES.lightBlue);
+      expect(result).toHaveLength(1);
     });
 
-    it('calculates an expected initials in LTR if one was not specified', () => {
+    it.only('calculates an expected initials in LTR if one was not specified', () => {
       let wrapper = mount(<Persona primaryText='Kat Larrson' />);
-      let result = wrapper.find('.' + styles.initials);
-      expect(result).to.have.length(1);
-      expect(result.text()).to.equal('KL');
+      let result = wrapper.find(STYLES.initials);
+      expect(result).toHaveLength(1);
+      expect(result.text()).toEqual('KL');
+      wrapper.unmount();
 
       wrapper = mount(<Persona primaryText='David Zearing-Goff' />);
-      result = wrapper.find('.' + styles.initials);
-      expect(result).to.have.length(1);
-      expect(result.text()).to.equal('DZ');
+      result = wrapper.find(STYLES.initials);
+      expect(result).toHaveLength(1);
+      expect(result.text()).toEqual('DZ');
+      wrapper.unmount();
 
       wrapper = mount(<Persona primaryText='4lex 4loo' />);
-      result = wrapper.find('.' + styles.initials);
-      expect(result).to.have.length(1);
-      expect(result.text()).to.equal('44');
+      result = wrapper.find(STYLES.initials);
+      expect(result).toHaveLength(1);
+      expect(result.text()).toEqual('44');
+      wrapper.unmount();
 
       wrapper = mount(<Persona primaryText='David (The man) Goff' />);
-      result = wrapper.find('.' + styles.initials);
-      expect(result).to.have.length(1);
-      expect(result.text()).to.equal('DG');
+      result = wrapper.find(STYLES.initials);
+      expect(result).toHaveLength(1);
+      expect(result.text()).toEqual('DG');
     });
 
     it('calculates an expected initials in RTL if one was not specified', () => {
       setRTL(true);
       const wrapper = mount(<Persona primaryText='Kat Larrson' />);
-      let result = wrapper.find('.' + styles.initials);
-      expect(result).to.have.length(1);
-      expect(result.text()).to.equal('LK');
+      let result = wrapper.find(STYLES.initials);
+      expect(result).toHaveLength(1);
+      expect(result.text()).toEqual('LK');
 
       setRTL(false);
     });
@@ -68,9 +74,9 @@ describe('Persona', () => {
     it('uses provided initial', () => {
       setRTL(true);
       const wrapper = mount(<Persona primaryText='Kat Larrson' imageInitials='AT' />);
-      let result = wrapper.find('.' + styles.initials);
-      expect(result).to.have.length(1);
-      expect(result.text()).to.equal('AT');
+      let result = wrapper.find(STYLES.initials);
+      expect(result).toHaveLength(1);
+      expect(result.text()).toEqual('AT');
 
       setRTL(false);
     });
@@ -81,14 +87,14 @@ describe('Persona', () => {
       const wrapper = mount(<Persona primaryText='Kat Larrson' imageUrl={ testImage1x1 } />);
       const image: ReactWrapper<React.ImgHTMLAttributes<any>, any> = wrapper.find('Image');
 
-      expect(image.props().alt).to.equal('');
+      expect(image.props().alt).toEqual('');
     });
 
     it('renders its given alt text', () => {
       const wrapper = mount(<Persona primaryText='Kat Larrson' imageUrl={ testImage1x1 } imageAlt='ALT TEXT' />);
       const image: ReactWrapper<React.ImgHTMLAttributes<any>, any> = wrapper.find('Image');
 
-      expect(image.props().alt).to.equal('ALT TEXT');
+      expect(image.props().alt).toEqual('ALT TEXT');
     });
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx b/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
index 351fdef2f0d9e..7bdf424f116b8 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
@@ -3,9 +3,7 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
 import * as ReactDOM from 'react-dom';
-import * as ReactTestUtils from 'react-addons-test-utils';
-
-let { expect } = chai;
+import * as ReactTestUtils from 'react-dom/test-utils';
 
 import { Rating } from './Rating';
 
@@ -24,16 +22,14 @@ describe('Rating', () => {
       exception = e;
       threwException = true;
     }
-    expect(threwException).to.be.false;
+    expect(threwException).toEqual(false);
 
     let renderedDOM = ReactDOM.findDOMNode(rating as React.ReactInstance);
 
     let ratingInputs = renderedDOM.querySelectorAll('.ms-Rating-input');
 
     const checkState = (ratingToCheck: number, state: boolean) => {
-      expect((ratingInputs[ratingToCheck - 1] as HTMLInputElement).checked).to.be.eq(
-        state,
-        `Rating ${ratingToCheck} should be ${!state && 'selected' || ''} selected`);
+      expect((ratingInputs[ratingToCheck - 1] as HTMLInputElement).checked).toEqual(state);
     };
 
     checkState(1, false);
@@ -65,17 +61,17 @@ describe('Rating', () => {
       exception = e;
       threwException = true;
     }
-    expect(threwException).to.be.false;
+    expect(threwException).toEqual(false);
 
     let renderedDOM = ReactDOM.findDOMNode(rating as React.ReactInstance);
 
     let ratingInputs = renderedDOM.querySelectorAll('.ms-Rating-input');
 
-    expect((ratingInputs[0] as HTMLInputElement).checked).to.be.eq(false);
-    expect((ratingInputs[1] as HTMLInputElement).checked).to.be.eq(false);
-    expect((ratingInputs[2] as HTMLInputElement).checked).to.be.eq(false);
-    expect((ratingInputs[3] as HTMLInputElement).checked).to.be.eq(false);
-    expect((ratingInputs[4] as HTMLInputElement).checked).to.be.eq(true);
+    expect((ratingInputs[0] as HTMLInputElement).checked).toEqual(false);
+    expect((ratingInputs[1] as HTMLInputElement).checked).toEqual(false);
+    expect((ratingInputs[2] as HTMLInputElement).checked).toEqual(false);
+    expect((ratingInputs[3] as HTMLInputElement).checked).toEqual(false);
+    expect((ratingInputs[4] as HTMLInputElement).checked).toEqual(true);
   });
 
   it('When rating is disabled cannot change rating', () => {
@@ -92,13 +88,13 @@ describe('Rating', () => {
       exception = e;
       threwException = true;
     }
-    expect(threwException).to.be.false;
+    expect(threwException).toEqual(false);
 
     let renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
     let choiceOptions = renderedDOM.querySelectorAll('.ms-Rating-input');
 
     for (let i = 0; i < 5; ++i) {
-      expect((choiceOptions[i] as HTMLInputElement).disabled).to.be.eq(true, `Rating ${i + 1} is not disabled`);
+      expect((choiceOptions[i] as HTMLInputElement).disabled).toEqual(true);
     }
   });
 
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
index f90fb812a9634..b91b924e399e8 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { shallow } from 'enzyme';
-const { expect } = chai;
+
 import { ResizeGroup, IResizeGroupState, getNextResizeGroupStateProvider, getMeasurementCache } from './ResizeGroup';
 import { IResizeGroupProps } from './ResizeGroup.Props';
 import * as sinon from 'sinon';
@@ -37,7 +37,7 @@ describe('ResizeGroup', () => {
       />
     );
 
-    expect(wrapper.containsMatchingElement(onRenderData(initialData))).to.equal(true);
+    expect(wrapper.containsMatchingElement(onRenderData(initialData))).toEqual(true);
   });
 
   describe('getNextResizeGroupStateProvider', () => {
@@ -51,8 +51,8 @@ describe('ResizeGroup', () => {
         resizeGroupState,
         getMeasuredElementWidthStub);
 
-      expect(result).to.equal(undefined);
-      expect(getMeasuredElementWidthStub.callCount).to.equal(0);
+      expect(result).toEqual(undefined);
+      expect(getMeasuredElementWidthStub.callCount).toEqual(0);
     });
 
     it('sets the renderedData when the contents fit', () => {
@@ -68,13 +68,13 @@ describe('ResizeGroup', () => {
         getMeasuredElementWidthStub,
         50);
 
-      expect(result).to.deep.equal({
+      expect(result).toEqual({
         renderedData: dataToMeasure,
         measureContainer: false,
         dataToMeasure: undefined,
         resizeDirection: undefined
       });
-      expect(getMeasuredElementWidthStub.callCount).to.equal(1);
+      expect(getMeasuredElementWidthStub.callCount).toEqual(1);
     });
 
     it('calls onReduceData and sets the next measuredData when contents do not fit', () => {
@@ -91,12 +91,12 @@ describe('ResizeGroup', () => {
         getMeasuredElementWidthStub,
         10);
 
-      expect(result).to.deep.equal({
+      expect(result).toEqual({
         measureContainer: false,
         dataToMeasure: { index: 4 },
         resizeDirection: 'shrink'
       });
-      expect(getMeasuredElementWidthStub.callCount).to.equal(1);
+      expect(getMeasuredElementWidthStub.callCount).toEqual(1);
     });
 
     it('does not call getMeasuredElementBounds when the data has already been cached', () => {
@@ -115,13 +115,13 @@ describe('ResizeGroup', () => {
         measuredElementWidthStub,
         100);
 
-      expect(result).to.deep.equal({
+      expect(result).toEqual({
         renderedData: dataToMeasure,
         measureContainer: false,
         dataToMeasure: undefined,
         resizeDirection: undefined
       });
-      expect(measuredElementWidthStub.callCount).to.equal(0);
+      expect(measuredElementWidthStub.callCount).toEqual(0);
     });
 
     it('calls onReduceData multiple times when everything is in the cache', () => {
@@ -147,13 +147,13 @@ describe('ResizeGroup', () => {
         measuredElementWidthStub,
         10);
 
-      expect(result).to.deep.equal({
+      expect(result).toEqual({
         renderedData: dataArray[2],
         measureContainer: false,
         dataToMeasure: undefined,
         resizeDirection: undefined
       });
-      expect(measuredElementWidthStub.callCount).to.equal(0);
+      expect(measuredElementWidthStub.callCount).toEqual(0);
     });
 
     it('sets dataToMeasure when the current data is in the cache but the onReduceData result is not in the cache', () => {
@@ -175,12 +175,12 @@ describe('ResizeGroup', () => {
         measuredElementWidthStub,
         10);
 
-      expect(result).to.deep.equal({
+      expect(result).toEqual({
         dataToMeasure: dataArray[1],
         measureContainer: false,
         resizeDirection: 'shrink'
       });
-      expect(measuredElementWidthStub.callCount).to.equal(0);
+      expect(measuredElementWidthStub.callCount).toEqual(0);
     });
 
     it('renders the last measured data if onReduceData returns undefined', () => {
@@ -200,13 +200,13 @@ describe('ResizeGroup', () => {
         getMeasuredElementWidthStub,
         10);
 
-      expect(result).to.deep.equal({
+      expect(result).toEqual({
         dataToMeasure: undefined,
         renderedData: dataToMeasure,
         measureContainer: false,
         resizeDirection: undefined
       });
-      expect(getMeasuredElementWidthStub.callCount).to.equal(1);
+      expect(getMeasuredElementWidthStub.callCount).toEqual(1);
     });
 
     it('renders the last measured data in the cache if onReduceData returns undefined', () => {
@@ -230,13 +230,13 @@ describe('ResizeGroup', () => {
         measuredElementWidthStub,
         10);
 
-      expect(result).to.deep.equal({
+      expect(result).toEqual({
         dataToMeasure: undefined,
         renderedData: dataArray[1],
         measureContainer: false,
         resizeDirection: undefined,
       });
-      expect(measuredElementWidthStub.callCount).to.equal(0);
+      expect(measuredElementWidthStub.callCount).toEqual(0);
     });
 
     it('does not crash when the container size is set and there is no dataToMeasure', () => {
@@ -249,10 +249,10 @@ describe('ResizeGroup', () => {
         getMeasuredElementWidthStub,
         50);
 
-      expect(result).to.deep.equal({
+      expect(result).toEqual({
         measureContainer: false,
       });
-      expect(getMeasuredElementWidthStub.callCount).to.equal(0);
+      expect(getMeasuredElementWidthStub.callCount).toEqual(0);
     });
 
     it('makes sure the contents still fit when the container width decreases', () => {
@@ -281,13 +281,13 @@ describe('ResizeGroup', () => {
 
       // Important to note that we do not start scaling from the initial data,
       // we continue from the last rendered data.
-      expect(result).to.deep.equal({
+      expect(result).toEqual({
         renderedData: renderedData,
         dataToMeasure: renderedData,
         measureContainer: false,
         resizeDirection: 'shrink'
       });
-      expect(getMeasuredElementWidthStub.callCount).to.equal(0);
+      expect(getMeasuredElementWidthStub.callCount).toEqual(0);
     });
 
     it('starts from the beginning when the container width increases and there is no onGrowData', () => {
@@ -314,13 +314,13 @@ describe('ResizeGroup', () => {
         getMeasuredElementWidthStub,
         increasedWidth);
 
-      expect(result).to.deep.equal({
+      expect(result).toEqual({
         renderedData: renderedData,
         dataToMeasure: resizeGroupProps.data,
         resizeDirection: 'shrink',
         measureContainer: false
       });
-      expect(getMeasuredElementWidthStub.callCount).to.equal(0);
+      expect(getMeasuredElementWidthStub.callCount).toEqual(0);
     });
 
     it('renders contents when the resizeDirection is grow, there is no onGrowData, and the contents fit', () => {
@@ -336,13 +336,13 @@ describe('ResizeGroup', () => {
         getMeasuredElementWidthStub,
         50);
 
-      expect(result).to.deep.equal({
+      expect(result).toEqual({
         renderedData: dataToMeasure,
         measureContainer: false,
         dataToMeasure: undefined,
         resizeDirection: undefined
       });
-      expect(getMeasuredElementWidthStub.callCount).to.equal(1);
+      expect(getMeasuredElementWidthStub.callCount).toEqual(1);
     });
 
     it('sets the resize direction to shrink when the resizeDirection is grow, contents do not fit, and there is no onGrowData', () => {
@@ -359,13 +359,13 @@ describe('ResizeGroup', () => {
         getMeasuredElementWidthStub,
         72);
 
-      expect(result).to.deep.equal({
+      expect(result).toEqual({
         measureContainer: false,
         dataToMeasure: { index: 7 },
         resizeDirection: 'shrink'
       });
-      expect(getMeasuredElementWidthStub.callCount).to.equal(1);
-      expect(resizeGroupProps.onReduceData.callCount).to.equal(1);
+      expect(getMeasuredElementWidthStub.callCount).toEqual(1);
+      expect(resizeGroupProps.onReduceData.callCount).toEqual(1);
     });
 
     it('measures the next state when the resizeDirection is grow and the dataToMeasure fits', () => {
@@ -383,13 +383,13 @@ describe('ResizeGroup', () => {
         getMeasuredElementWidthStub,
         50);
 
-      expect(result).to.deep.equal({
+      expect(result).toEqual({
         measureContainer: false,
         dataToMeasure: { index: 2 },
         resizeDirection: 'grow'
       });
-      expect(getMeasuredElementWidthStub.callCount).to.equal(1);
-      expect(onGrowData.callCount).to.equal(1);
+      expect(getMeasuredElementWidthStub.callCount).toEqual(1);
+      expect(onGrowData.callCount).toEqual(1);
     });
 
     it('sets the resizeDirection to shrink after determining contents do not fit when the resize direction is grow', () => {
@@ -406,14 +406,14 @@ describe('ResizeGroup', () => {
         getMeasuredElementWidthStub,
         40);
 
-      expect(result).to.deep.equal({
+      expect(result).toEqual({
         measureContainer: false,
         dataToMeasure,
         resizeDirection: 'shrink'
       });
-      expect(getMeasuredElementWidthStub.callCount).to.equal(1);
-      expect(onGrowData.callCount).to.equal(0);
-      expect(resizeGroupProps.onReduceData.callCount).to.equal(0);
+      expect(getMeasuredElementWidthStub.callCount).toEqual(1);
+      expect(onGrowData.callCount).toEqual(0);
+      expect(resizeGroupProps.onReduceData.callCount).toEqual(0);
     });
 
     it('renders the last measured contents when onGrowData returns undefined', () => {
@@ -431,15 +431,15 @@ describe('ResizeGroup', () => {
         getMeasuredElementWidthStub,
         40);
 
-      expect(result).to.deep.equal({
+      expect(result).toEqual({
         measureContainer: false,
         dataToMeasure: undefined,
         renderedData: dataToMeasure,
         resizeDirection: undefined
       });
-      expect(getMeasuredElementWidthStub.callCount).to.equal(1);
-      expect(onGrowData.callCount).to.equal(1);
-      expect(resizeGroupProps.onReduceData.callCount).to.equal(0);
+      expect(getMeasuredElementWidthStub.callCount).toEqual(1);
+      expect(onGrowData.callCount).toEqual(1);
+      expect(resizeGroupProps.onReduceData.callCount).toEqual(0);
     });
 
     it('calls onGrowData when the container width increases and onGrowData is provided', () => {
@@ -468,14 +468,14 @@ describe('ResizeGroup', () => {
         getMeasuredElementWidthStub,
         increasedWidth);
 
-      expect(result).to.deep.equal({
+      expect(result).toEqual({
         renderedData: renderedData,
         dataToMeasure: { index: 4 },
         resizeDirection: 'grow',
         measureContainer: false
       });
-      expect(getMeasuredElementWidthStub.callCount).to.equal(0);
-      expect(onGrowData.callCount).to.equal(1);
+      expect(getMeasuredElementWidthStub.callCount).toEqual(0);
+      expect(onGrowData.callCount).toEqual(1);
     });
 
     it('does not call getMeasuredElementBounds when the data has already been cached in the grow resizeDirection', () => {
@@ -495,13 +495,13 @@ describe('ResizeGroup', () => {
         measuredElementWidthStub,
         100);
 
-      expect(result).to.deep.equal({
+      expect(result).toEqual({
         renderedData: dataToMeasure,
         measureContainer: false,
         dataToMeasure: undefined,
         resizeDirection: undefined
       });
-      expect(measuredElementWidthStub.callCount).to.equal(0);
+      expect(measuredElementWidthStub.callCount).toEqual(0);
     });
 
     it('calls onGrowData multiple times when everything is in the cache in the grow resizeDirection', () => {
@@ -528,12 +528,12 @@ describe('ResizeGroup', () => {
         measuredElementWidthStub,
         100);
 
-      expect(result).to.deep.equal({
+      expect(result).toEqual({
         measureContainer: false,
         dataToMeasure: dataArray[2],
         resizeDirection: 'shrink'
       });
-      expect(measuredElementWidthStub.callCount).to.equal(0);
+      expect(measuredElementWidthStub.callCount).toEqual(0);
     });
 
     it('sets dataToMeasure when the current data is in the cache but the onGrowData result is not in the cache in the grow resizeDirection', () => {
@@ -556,12 +556,12 @@ describe('ResizeGroup', () => {
         measuredElementWidthStub,
         100);
 
-      expect(result).to.deep.equal({
+      expect(result).toEqual({
         dataToMeasure: dataArray[1],
         measureContainer: false,
         resizeDirection: 'grow'
       });
-      expect(measuredElementWidthStub.callCount).to.equal(0);
+      expect(measuredElementWidthStub.callCount).toEqual(0);
     });
   });
 
@@ -595,14 +595,14 @@ describe('ResizeGroup', () => {
 
     // Important to note that we do not start scaling from the initial data,
     // we continue from the last rendered data.
-    expect(result).to.deep.equal({
+    expect(result).toEqual({
       renderedData: renderedData,
       dataToMeasure: { index: 7 },
       measureContainer: false,
       resizeDirection: 'shrink'
     });
-    expect(getMeasuredElementWidthStub.callCount).to.equal(1);
-    expect(resizeGroupProps.onReduceData.callCount).to.equal(1);
+    expect(getMeasuredElementWidthStub.callCount).toEqual(1);
+    expect(resizeGroupProps.onReduceData.callCount).toEqual(1);
   });
 
   it('does not render to the hidden div when there is no dataToMeasure', () => {
@@ -610,7 +610,7 @@ describe('ResizeGroup', () => {
 
     let result = resizeGroupStateProvider.shouldRenderDataToMeasureInHiddenDiv(undefined);
 
-    expect(result).to.equal(false);
+    expect(result).toEqual(false);
   });
 
   it('does render to the hidden div when there is dataToMeasure', () => {
@@ -618,7 +618,7 @@ describe('ResizeGroup', () => {
 
     let result = resizeGroupStateProvider.shouldRenderDataToMeasureInHiddenDiv({ index: 18 });
 
-    expect(result).to.equal(true);
+    expect(result).toEqual(true);
   });
 
   it('does not render to the hidden div when there is dataToMeasure that is in the cache', () => {
@@ -629,6 +629,6 @@ describe('ResizeGroup', () => {
 
     let result = resizeGroupStateProvider.shouldRenderDataToMeasureInHiddenDiv(data);
 
-    expect(result).to.equal(false);
+    expect(result).toEqual(false);
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
index 41cbd12b8a69a..6fde639a2ccf2 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
@@ -3,9 +3,7 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
 import * as ReactDOM from 'react-dom';
-import * as ReactTestUtils from 'react-addons-test-utils';
-
-let { expect } = chai;
+import * as ReactTestUtils from 'react-dom/test-utils';
 
 import { Slider } from './Slider';
 import { ISlider } from './Slider.Props';
@@ -19,7 +17,7 @@ describe('Slider', () => {
     let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
     let labelElement = renderedDOM.querySelector('.ms-Label') as HTMLElement;
 
-    expect(labelElement.textContent).to.equal('slider');
+    expect(labelElement.textContent).toEqual('slider');
   });
 
   it('can slide to default min/max and execute onChange', () => {
@@ -53,7 +51,7 @@ describe('Slider', () => {
     });
 
     // Default max is 10.
-    expect(changedValue).equals(10);
+    expect(changedValue).toEqual(10);
 
     ReactTestUtils.Simulate.mouseDown(sliderThumb, {
       type: 'mousedown',
@@ -62,7 +60,7 @@ describe('Slider', () => {
     });
 
     // Default min is 0.
-    expect(changedValue).equals(0);
+    expect(changedValue).toEqual(0);
   });
 
   it('has type=button on all buttons', () => {
@@ -76,7 +74,7 @@ describe('Slider', () => {
     for (let i = 0; i < allButtons.length; i++) {
       let button = allButtons[i];
 
-      expect(button.getAttribute('type')).equals('button');
+      expect(button.getAttribute('type')).toEqual('button');
     }
   });
 
@@ -86,6 +84,6 @@ describe('Slider', () => {
     ReactTestUtils.renderIntoDocument(
       <Slider label='slider' defaultValue={ 12 } min={ 0 } max={ 100 } componentRef={ s => slider = s } />
     );
-    expect(slider!.value).equals(12);
+    expect(slider!.value).toEqual(12);
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
index 1f175db962334..3fc82404650a2 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
@@ -1,12 +1,10 @@
 import { Promise } from 'es6-promise';
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
-import * as ReactTestUtils from 'react-addons-test-utils';
+import * as ReactTestUtils from 'react-dom/test-utils';
 import { SpinButton } from './SpinButton';
 import { KeyCodes } from '../../Utilities';
 
-const expect: Chai.ExpectStatic = chai.expect;
-
 describe('SpinButton', () => {
   function renderIntoDocument(element: React.ReactElement<any>): HTMLElement {
     const component = ReactTestUtils.renderIntoDocument(element);
@@ -39,15 +37,15 @@ describe('SpinButton', () => {
     const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
     const labelDOM: HTMLLabelElement = renderedDOM.getElementsByTagName('label')[0];
 
-    expect(inputDOM.value).to.equal(exampleDefaultValue);
-    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
-    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
-    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(exampleDefaultValue));
-    expect(inputDOM.getAttribute('aria-labelledby')).to.equals(labelDOM.id);
+    expect(inputDOM.value).toEqual(exampleDefaultValue);
+    expect(inputDOM.getAttribute('aria-valuemin')).toEqual(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).toEqual(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).toEqual(String(exampleDefaultValue));
+    expect(inputDOM.getAttribute('aria-labelledby')).toEqual(labelDOM.id);
 
     // Assert on the label element.
-    expect(labelDOM.textContent).to.equal(exampleLabelValue);
-    expect(labelDOM.htmlFor).to.equal(inputDOM.id);
+    expect(labelDOM.textContent).toEqual(exampleLabelValue);
+    expect(labelDOM.htmlFor).toEqual(inputDOM.id);
   });
 
   it('should increment the value in the spin button via the up button', () => {
@@ -69,7 +67,7 @@ describe('SpinButton', () => {
     const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
     const buttonDOM: Element = renderedDOM.getElementsByClassName('ms-UpButton')[0];
 
-    expect(buttonDOM.tagName).to.equal('BUTTON');
+    expect(buttonDOM.tagName).toEqual('BUTTON');
 
     ReactTestUtils.Simulate.mouseDown(buttonDOM,
       {
@@ -85,10 +83,10 @@ describe('SpinButton', () => {
         clientY: 0
       });
 
-    expect(inputDOM.value).to.equal('13');
-    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
-    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
-    expect(inputDOM.getAttribute('aria-valuenow')).to.equal('13');
+    expect(inputDOM.value).toEqual('13');
+    expect(inputDOM.getAttribute('aria-valuemin')).toEqual(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).toEqual(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).toEqual('13');
 
   });
 
@@ -111,7 +109,7 @@ describe('SpinButton', () => {
     const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
     const buttonDOM: Element = renderedDOM.getElementsByClassName('ms-DownButton')[0];
 
-    expect(buttonDOM.tagName).to.equal('BUTTON');
+    expect(buttonDOM.tagName).toEqual('BUTTON');
 
     ReactTestUtils.Simulate.mouseDown(buttonDOM,
       {
@@ -127,10 +125,10 @@ describe('SpinButton', () => {
         clientY: 0
       });
 
-    expect(inputDOM.value).to.equal('11');
-    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
-    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
-    expect(inputDOM.getAttribute('aria-valuenow')).to.equal('11');
+    expect(inputDOM.value).toEqual('11');
+    expect(inputDOM.getAttribute('aria-valuemin')).toEqual(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).toEqual(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).toEqual('11');
 
   });
 
@@ -162,10 +160,10 @@ describe('SpinButton', () => {
         which: KeyCodes.up
       });
 
-    expect(inputDOM.value).to.equal('13');
-    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
-    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
-    expect(inputDOM.getAttribute('aria-valuenow')).to.equal('13');
+    expect(inputDOM.value).toEqual('13');
+    expect(inputDOM.getAttribute('aria-valuemin')).toEqual(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).toEqual(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).toEqual('13');
 
   });
 
@@ -197,10 +195,10 @@ describe('SpinButton', () => {
         which: KeyCodes.down
       });
 
-    expect(inputDOM.value).to.equal('11');
-    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
-    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
-    expect(inputDOM.getAttribute('aria-valuenow')).to.equal('11');
+    expect(inputDOM.value).toEqual('11');
+    expect(inputDOM.getAttribute('aria-valuemin')).toEqual(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).toEqual(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).toEqual('11');
 
   });
 
@@ -233,10 +231,10 @@ describe('SpinButton', () => {
         which: KeyCodes.up
       });
 
-    expect(inputDOM.value).to.equal('14');
-    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
-    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
-    expect(inputDOM.getAttribute('aria-valuenow')).to.equal('14');
+    expect(inputDOM.value).toEqual('14');
+    expect(inputDOM.getAttribute('aria-valuemin')).toEqual(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).toEqual(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).toEqual('14');
 
   });
 
@@ -269,10 +267,10 @@ describe('SpinButton', () => {
         which: KeyCodes.down
       });
 
-    expect(inputDOM.value).to.equal('10');
-    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
-    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
-    expect(inputDOM.getAttribute('aria-valuenow')).to.equal('10');
+    expect(inputDOM.value).toEqual('10');
+    expect(inputDOM.getAttribute('aria-valuemin')).toEqual(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).toEqual(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).toEqual('10');
 
   });
 
@@ -297,10 +295,10 @@ describe('SpinButton', () => {
     ReactTestUtils.Simulate.input(inputDOM, mockEvent(exampleNewValue));
     ReactTestUtils.Simulate.blur(inputDOM);
 
-    expect(inputDOM.value).to.equal(exampleNewValue);
-    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
-    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
-    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(exampleNewValue));
+    expect(inputDOM.value).toEqual(exampleNewValue);
+    expect(inputDOM.getAttribute('aria-valuemin')).toEqual(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).toEqual(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).toEqual(String(exampleNewValue));
   });
 
   it('should reset the value of the spin button with invalid manual entry', () => {
@@ -324,10 +322,10 @@ describe('SpinButton', () => {
     ReactTestUtils.Simulate.input(inputDOM, mockEvent(exampleNewValue));
     ReactTestUtils.Simulate.blur(inputDOM);
 
-    expect(inputDOM.value).to.equal(exampleDefaultValue);
-    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
-    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
-    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(exampleDefaultValue));
+    expect(inputDOM.value).toEqual(exampleDefaultValue);
+    expect(inputDOM.getAttribute('aria-valuemin')).toEqual(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).toEqual(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).toEqual(String(exampleDefaultValue));
   });
 
   it('should revert to max value when input value is higher than the max of the spin button', () => {
@@ -351,10 +349,10 @@ describe('SpinButton', () => {
     ReactTestUtils.Simulate.input(inputDOM, mockEvent(exampleNewValue));
     ReactTestUtils.Simulate.blur(inputDOM);
 
-    expect(inputDOM.value).to.equal(String(exampleMaxValue));
-    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
-    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
-    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(exampleMaxValue));
+    expect(inputDOM.value).toEqual(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuemin')).toEqual(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).toEqual(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).toEqual(String(exampleMaxValue));
   });
 
   it('should revert existing value when input value is lower than the min of the spin button', () => {
@@ -378,10 +376,10 @@ describe('SpinButton', () => {
     ReactTestUtils.Simulate.input(inputDOM, mockEvent(String(exampleNewValue)));
     ReactTestUtils.Simulate.blur(inputDOM);
 
-    expect(inputDOM.value).to.equal(String(exampleMinValue));
-    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
-    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
-    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(exampleMinValue));
+    expect(inputDOM.value).toEqual(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemin')).toEqual(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).toEqual(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).toEqual(String(exampleMinValue));
   });
 
   it('should use validator passed to the spin button (with valid input)', () => {
@@ -410,10 +408,10 @@ describe('SpinButton', () => {
     ReactTestUtils.Simulate.input(inputDOM, mockEvent(String(exampleNewValue)));
     ReactTestUtils.Simulate.blur(inputDOM);
 
-    expect(inputDOM.value).to.equal(String(exampleNewValue));
-    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
-    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
-    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(exampleNewValue));
+    expect(inputDOM.value).toEqual(String(exampleNewValue));
+    expect(inputDOM.getAttribute('aria-valuemin')).toEqual(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).toEqual(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).toEqual(String(exampleNewValue));
   });
 
   it('should use validator passed to the spin button', () => {
@@ -442,10 +440,10 @@ describe('SpinButton', () => {
     ReactTestUtils.Simulate.input(inputDOM, mockEvent(String(exampleNewValue)));
     ReactTestUtils.Simulate.blur(inputDOM);
 
-    expect(inputDOM.value).to.equal(String(errorMessage));
-    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
-    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
-    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(errorMessage));
+    expect(inputDOM.value).toEqual(String(errorMessage));
+    expect(inputDOM.getAttribute('aria-valuemin')).toEqual(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).toEqual(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).toEqual(String(errorMessage));
   });
 
   it('should have correct value after increment and using defaultValue', () => {
@@ -472,10 +470,10 @@ describe('SpinButton', () => {
     ReactTestUtils.Simulate.mouseDown(upButtonDOM);
     ReactTestUtils.Simulate.mouseUp(upButtonDOM);
 
-    expect(inputDOM.value).to.equal(String(exampleNewValue));
-    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
-    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
-    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(exampleNewValue));
+    expect(inputDOM.value).toEqual(String(exampleNewValue));
+    expect(inputDOM.getAttribute('aria-valuemin')).toEqual(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).toEqual(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).toEqual(String(exampleNewValue));
   });
 
   it('should have correct value after decrement and using defaultValue', () => {
@@ -502,10 +500,10 @@ describe('SpinButton', () => {
     ReactTestUtils.Simulate.mouseDown(downButtonDOM);
     ReactTestUtils.Simulate.mouseUp(downButtonDOM);
 
-    expect(inputDOM.value).to.equal(String(exampleNewValue));
-    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
-    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
-    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(exampleNewValue));
+    expect(inputDOM.value).toEqual(String(exampleNewValue));
+    expect(inputDOM.getAttribute('aria-valuemin')).toEqual(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).toEqual(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).toEqual(String(exampleNewValue));
   });
 
   it('should use min as defaultvalue if neither value nor defaultValue are passed', () => {
@@ -526,10 +524,10 @@ describe('SpinButton', () => {
     // Assert on the input element.
     const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
 
-    expect(inputDOM.value).to.equal(String(exampleMinValue));
-    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
-    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
-    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(exampleMinValue));
+    expect(inputDOM.value).toEqual(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemin')).toEqual(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).toEqual(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).toEqual(String(exampleMinValue));
   });
 
   it('should use 0 as defaultvalue if neither value, defaultValue nor min are passed', () => {
@@ -544,8 +542,8 @@ describe('SpinButton', () => {
     // Assert on the input element.
     const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
 
-    expect(inputDOM.value).to.equal(String(0));
-    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(0));
+    expect(inputDOM.value).toEqual(String(0));
+    expect(inputDOM.getAttribute('aria-valuenow')).toEqual(String(0));
   });
 
   it('should use the default onIncrement function when no value, defaultValue nor onIncrement function is passed', () => {
@@ -563,8 +561,8 @@ describe('SpinButton', () => {
     ReactTestUtils.Simulate.mouseDown(upButtonDOM);
     ReactTestUtils.Simulate.mouseUp(upButtonDOM);
 
-    expect(inputDOM.value).to.equal(String(1));
-    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(String(1));
+    expect(inputDOM.value).toEqual(String(1));
+    expect(inputDOM.getAttribute('aria-valuenow')).toEqual(String(1));
   });
 
   it('should stop spinning if text field is focused while actively spinning', () => {
@@ -590,7 +588,7 @@ describe('SpinButton', () => {
     const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
     const buttonDOM: Element = renderedDOM.getElementsByClassName('ms-UpButton')[0];
 
-    expect(buttonDOM.tagName).to.equal('BUTTON');
+    expect(buttonDOM.tagName).toEqual('BUTTON');
 
     ReactTestUtils.Simulate.mouseDown(buttonDOM,
       {
@@ -602,12 +600,12 @@ describe('SpinButton', () => {
     delay(500).then(() => ReactTestUtils.Simulate.focus(inputDOM));
 
     let currentValue = inputDOM.value;
-    expect(currentValue).to.not.equal('2');
-    expect(inputDOM.getAttribute('aria-valuemin')).to.equal(String(exampleMinValue));
-    expect(inputDOM.getAttribute('aria-valuemax')).to.equal(String(exampleMaxValue));
-    expect(inputDOM.getAttribute('aria-valuenow')).to.equal(currentValue);
+    expect(currentValue).not.toEqual('2');
+    expect(inputDOM.getAttribute('aria-valuemin')).toEqual(String(exampleMinValue));
+    expect(inputDOM.getAttribute('aria-valuemax')).toEqual(String(exampleMaxValue));
+    expect(inputDOM.getAttribute('aria-valuenow')).toEqual(currentValue);
 
     let newCurrentValue = inputDOM.value;
-    expect(currentValue).to.equal(newCurrentValue);
+    expect(currentValue).toEqual(newCurrentValue);
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
index ce10c9b6a91c8..4098a9b6aacaa 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
@@ -2,13 +2,11 @@
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
-import * as ReactTestUtils from 'react-addons-test-utils';
+import * as ReactTestUtils from 'react-dom/test-utils';
 import { mount } from 'enzyme';
 import { SwatchColorPicker } from './SwatchColorPicker';
 import { IColorCellProps } from './SwatchColorPicker.Props';
 
-let { expect } = chai;
-
 const DEFAULT_OPTIONS: IColorCellProps[] = [
   { id: 'a', label: 'green', color: '#00ff00' },
   { id: 'b', label: 'orange', color: '#ffa500' },
@@ -32,7 +30,7 @@ describe('SwatchColorPicker', () => {
         colorCells={ DEFAULT_OPTIONS }
         columnCount={ 4 }
       />);
-    expect(wrapper.find('.ms-swatchColorPickerBodyContainer').length).to.equal(1, 'should have a swatch color picker');
+    expect(wrapper.find('.ms-swatchColorPickerBodyContainer').length).toEqual(1);
   });
 
   it('Can render the correct options when not in a menu', () => {
@@ -43,7 +41,7 @@ describe('SwatchColorPicker', () => {
       />);
     let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
     let container = reactContainer.getDOMNode();
-    expect(container).to.not.equal(null, 'should have a container');
+    expect(container).not.toEqual(null);
 
     let tableElements = container.querySelectorAll('table[role="grid"]');
     let tableRowElements = container.querySelectorAll('tr[role="row"]');
@@ -51,14 +49,14 @@ describe('SwatchColorPicker', () => {
     let setSizeElements = container.querySelectorAll('[aria-setsize]');
     let posInSetElements = container.querySelectorAll('[aria-posinset]');
 
-    expect(tableElements.length).to.equal(1, 'should be two grids in the swatch color picker');
-    expect(tableRowElements.length).to.equal(3, 'should be three rows in the swatch color picker');
-    expect(tableRowElements[0].getElementsByTagName('td').length).to.equal(4, 'the first row should have four td elements');
-    expect(tableRowElements[1].getElementsByTagName('td').length).to.equal(4, 'the second row should have four td elements');
-    expect(tableRowElements[2].getElementsByTagName('td').length).to.equal(4, 'the third row should have four td elements');
-    expect(tableCellElements.length).to.equal(12, 'should be twelve grid cells in the swatch color picker');
-    expect(setSizeElements.length).to.equal(0, 'should be zero elements with aria-setsize since we are not in a menu in the swatch color picker');
-    expect(posInSetElements.length).to.equal(0, 'should be zero elements with aria-posinset since we are not in a menu in the swatch color picker');
+    expect(tableElements.length).toEqual(1);
+    expect(tableRowElements.length).toEqual(3);
+    expect(tableRowElements[0].getElementsByTagName('td').length).toEqual(4);
+    expect(tableRowElements[1].getElementsByTagName('td').length).toEqual(4);
+    expect(tableRowElements[2].getElementsByTagName('td').length).toEqual(4);
+    expect(tableCellElements.length).toEqual(12);
+    expect(setSizeElements.length).toEqual(0);
+    expect(posInSetElements.length).toEqual(0);
   });
 
   it('Can execute a cell in non-collapsable swatch color picker ', () => {
@@ -71,13 +69,13 @@ describe('SwatchColorPicker', () => {
       />);
     let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
     let container = reactContainer.getDOMNode();
-    expect(container).to.not.equal(null, 'should have a container');
+    expect(container).not.toEqual(null);
 
     let item = container.querySelector('[role="gridcell"]') as Element;
-    expect(item).to.not.equal(null, 'should find a item');
+    expect(item).not.toEqual(null);
 
     ReactTestUtils.Simulate.click(item);
-    expect(eventFireCounter).to.equal(1, 'one color changed events were fired');
+    expect(eventFireCounter).toEqual(1);
   });
 
   it('Can fire the hover event on a cell in non-collapsable swatch color picker ', () => {
@@ -90,13 +88,13 @@ describe('SwatchColorPicker', () => {
       />);
     let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
     let container = reactContainer.getDOMNode();
-    expect(container).to.not.equal(null, 'should have a container');
+    expect(container).not.toEqual(null);
 
     let cell = container.querySelector('[role="gridcell"]') as Element;
-    expect(cell).to.not.equal(null, 'should find a cell');
+    expect(cell).not.toEqual(null);
 
     ReactTestUtils.Simulate.mouseEnter(cell);
-    expect(eventFireCounter).to.equal(1, 'one color changed events were fired');
+    expect(eventFireCounter).toEqual(1);
   });
 
   it('Can fire the focus event on a cell in non-collapsable swatch color picker ', () => {
@@ -109,12 +107,12 @@ describe('SwatchColorPicker', () => {
       />);
     let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
     let container = reactContainer.getDOMNode();
-    expect(container).to.not.equal(null, 'should have a container');
+    expect(container).not.toEqual(null);
 
     let cell = container.querySelector('[role="gridcell"]') as Element;
-    expect(cell).to.not.equal(null, 'should find a cell');
+    expect(cell).not.toEqual(null);
 
     ReactTestUtils.Simulate.focus(cell);
-    expect(eventFireCounter).to.equal(1, 'one color changed events were fired');
+    expect(eventFireCounter).toEqual(1);
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.test.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.test.tsx
index ec6a13120dccf..4fea19400bc9c 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.test.tsx
@@ -3,11 +3,9 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
 import * as ReactDOM from 'react-dom';
-import * as ReactTestUtils from 'react-addons-test-utils';
+import * as ReactTestUtils from 'react-dom/test-utils';
 import { TeachingBubbleContent } from './TeachingBubbleContent';
 
-let { expect } = chai;
-
 describe('TeachingBubble', () => {
 
   // <Layer> components will lead ReactDOM.findDOMNode(test_component) return null, so the test is based on the teaching bubble content.
@@ -20,7 +18,7 @@ describe('TeachingBubble', () => {
     let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
     let titleElement = renderedDOM.querySelector('.ms-TeachingBubble-headline');
 
-    expect(titleElement!.textContent).to.equal('Title');
+    expect(titleElement!.textContent).toEqual('Title');
   });
 
 });
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
index f049e5f9a43d4..718197b136c39 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
@@ -1,12 +1,10 @@
 import { Promise } from 'es6-promise';
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
-import * as ReactTestUtils from 'react-addons-test-utils';
+import * as ReactTestUtils from 'react-dom/test-utils';
 
 import { TextField } from './TextField';
 
-const expect: Chai.ExpectStatic = chai.expect;
-
 describe('TextField', () => {
   function renderIntoDocument(element: React.ReactElement<any>): HTMLElement {
     const component = ReactTestUtils.renderIntoDocument(element);
@@ -38,11 +36,11 @@ describe('TextField', () => {
 
     // Assert on the input element.
     const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
-    expect(inputDOM.value).to.equal(exampleValue);
+    expect(inputDOM.value).toEqual(exampleValue);
 
     // Assert on the label element.
     const labelDOM: HTMLLabelElement = renderedDOM.getElementsByTagName('label')[0];
-    expect(labelDOM.textContent).to.equal(exampleLabel);
+    expect(labelDOM.textContent).toEqual(exampleLabel);
   });
 
   it('should render multiline as text area element', () => {
@@ -52,7 +50,7 @@ describe('TextField', () => {
 
     // Assert on the input element.
     const inputDOM: HTMLTextAreaElement = renderedDOM.getElementsByTagName('textarea')[0];
-    expect(inputDOM.value).not.be.be.empty;
+    expect(inputDOM.value).toBeDefined();
   });
 
   it('should associate the label and input box', () => {
@@ -67,8 +65,8 @@ describe('TextField', () => {
     const labelDOM: HTMLLabelElement = renderedDOM.getElementsByTagName('label')[0];
 
     // Assert the input ID and label FOR attribute are the same.
-    expect(inputDOM.id).to.not.be.empty;
-    expect(inputDOM.id).to.equal(labelDOM.htmlFor);
+    expect(inputDOM.id).toBeDefined();
+    expect(inputDOM.id).toEqual(labelDOM.htmlFor);
   });
 
   it('should render a disabled input element', () => {
@@ -78,7 +76,7 @@ describe('TextField', () => {
 
     // Assert the input box is disabled.
     const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
-    expect(inputDOM.disabled).to.equal(true);
+    expect(inputDOM.disabled).toEqual(true);
   });
 
   describe('error message', () => {
@@ -89,9 +87,9 @@ describe('TextField', () => {
         renderedDOM.querySelector('[data-automation-id=error-message]') as HTMLElement;
 
       if (expectedErrorMessage === false) {
-        expect(errorMessageDOM).to.be.null; // element not exists
+        expect(errorMessageDOM).toBeNull(); // element not exists
       } else {
-        expect(errorMessageDOM.textContent).to.equal(expectedErrorMessage);
+        expect(errorMessageDOM.textContent).toEqual(expectedErrorMessage);
       }
     }
 
@@ -183,7 +181,7 @@ describe('TextField', () => {
       );
 
       delay(20).then(() => assertErrorMessage(renderedDOM,  /* exist */ false));
-      expect(actualValue).to.equal('');
+      expect(actualValue).toEqual('');
     });
 
     it('should update error message when receive new value from props', () => {
@@ -228,10 +226,10 @@ describe('TextField', () => {
 
       const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
       ReactTestUtils.Simulate.input(inputDOM, mockEvent('the input value'));
-      expect(validationCallCount).to.equal(1);
+      expect(validationCallCount).toEqual(1);
 
       ReactTestUtils.Simulate.focus(inputDOM);
-      expect(validationCallCount).to.equal(2);
+      expect(validationCallCount).toEqual(2);
     });
 
     it('should trigger validation only on blur', () => {
@@ -252,10 +250,10 @@ describe('TextField', () => {
       const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
       ReactTestUtils.Simulate.focus(inputDOM);
       ReactTestUtils.Simulate.input(inputDOM, mockEvent('the input value'));
-      expect(validationCallCount).to.equal(1);
+      expect(validationCallCount).toEqual(1);
 
       ReactTestUtils.Simulate.blur(inputDOM);
-      expect(validationCallCount).to.equal(2);
+      expect(validationCallCount).toEqual(2);
     });
 
     it('should trigger validation on both blur and focus', () => {
@@ -276,13 +274,13 @@ describe('TextField', () => {
 
       const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
       ReactTestUtils.Simulate.input(inputDOM, mockEvent('value before focus'));
-      expect(validationCallCount).to.equal(1);
+      expect(validationCallCount).toEqual(1);
 
       ReactTestUtils.Simulate.focus(inputDOM);
-      expect(validationCallCount).to.equal(2);
+      expect(validationCallCount).toEqual(2);
       ReactTestUtils.Simulate.input(inputDOM, mockEvent('value before blur'));
       ReactTestUtils.Simulate.blur(inputDOM);
-      expect(validationCallCount).to.equal(3);
+      expect(validationCallCount).toEqual(3);
     });
 
     it('should not trigger validation on component mount', () => {
@@ -299,7 +297,7 @@ describe('TextField', () => {
           validateOnLoad={ false }
         />
       );
-      expect(validationCallCount).to.equal(0);
+      expect(validationCallCount).toEqual(0);
     });
   });
 
@@ -310,7 +308,7 @@ describe('TextField', () => {
       />
     );
 
-    expect(renderedDOM.querySelector('input')!.value).equals('initial value');
+    expect(renderedDOM.querySelector('input')!.value).toEqual('initial value');
   });
 
   it('can render a default value as a textarea', () => {
@@ -321,7 +319,7 @@ describe('TextField', () => {
       />
     );
 
-    expect(renderedDOM.querySelector('textarea')!.value).equals('initial value');
+    expect(renderedDOM.querySelector('textarea')!.value).toEqual('initial value');
   });
 
   it('should call onChanged handler for input change', () => {
@@ -336,16 +334,16 @@ describe('TextField', () => {
       />
     );
 
-    expect(callCount).to.equal(0);
+    expect(callCount).toEqual(0);
     const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
 
     ReactTestUtils.Simulate.input(inputDOM, mockEvent('value change'));
     ReactTestUtils.Simulate.change(inputDOM, mockEvent('value change'));
-    expect(callCount).to.equal(1);
+    expect(callCount).toEqual(1);
 
     ReactTestUtils.Simulate.input(inputDOM, mockEvent(''));
     ReactTestUtils.Simulate.change(inputDOM, mockEvent(''));
-    expect(callCount).to.equal(2);
+    expect(callCount).toEqual(2);
   });
 
   it('should select a range of text', () => {
@@ -354,7 +352,7 @@ describe('TextField', () => {
 
     const onSelect = () => {
       const selectedText = window.getSelection().toString();
-      expect(selectedText).to.equal(initialValue);
+      expect(selectedText).toEqual(initialValue);
     };
 
     renderIntoDocument(
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
index fb9e16d6b9152..446d2b6b6f594 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
@@ -3,9 +3,8 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import { mount } from 'enzyme';
 import * as ReactDOM from 'react-dom';
-import * as ReactTestUtils from 'react-addons-test-utils';
+import * as ReactTestUtils from 'react-dom/test-utils';
 import * as sinon from 'sinon';
-let { expect } = chai;
 
 import { Toggle } from './Toggle';
 
@@ -20,7 +19,7 @@ describe('Toggle', () => {
     let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
     let labelElement = renderedDOM.querySelector('.ms-Toggle-label') as Element;
 
-    expect(labelElement.textContent).to.equal('Label');
+    expect(labelElement.textContent).toEqual('Label');
   });
 
   it('renders aria-label', () => {
@@ -33,7 +32,7 @@ describe('Toggle', () => {
     let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
     let labelElement = renderedDOM.querySelector('button') as Element;
 
-    expect(labelElement.getAttribute('aria-label')).to.equal('offLabel');
+    expect(labelElement.getAttribute('aria-label')).toEqual('offLabel');
   });
 
   it('can call the callback on a change of toggle', () => {
@@ -54,8 +53,8 @@ describe('Toggle', () => {
     let button = renderedDOM.querySelector('button') as HTMLButtonElement;
 
     ReactTestUtils.Simulate.click(button);
-    expect(isToggledValue).to.equal(true);
-    expect((component as React.Component<any, any>).state.isChecked).to.equal(true);
+    expect(isToggledValue).toEqual(true);
+    expect((component as React.Component<any, any>).state.isChecked).toEqual(true);
   });
 
   it(`doesn't update the state if the user provides checked`, () => {
@@ -73,7 +72,7 @@ describe('Toggle', () => {
 
     ReactTestUtils.Simulate.click(button);
 
-    expect((component as React.Component<any, any>).state.isChecked).to.equal(false);
+    expect((component as React.Component<any, any>).state.isChecked).toEqual(false);
   });
 
   it(`doesn't render a label element if none is provided`, () => {
@@ -86,7 +85,7 @@ describe('Toggle', () => {
     let label = renderedDOM.querySelector('label');
 
     // tslint:disable-next-line:no-unused-expression
-    expect(label).is.null;
+    expect(label).toBeNull();
   });
 
   it(`doesn't trigger onSubmit when placed inside a form`, () => {
@@ -112,8 +111,8 @@ describe('Toggle', () => {
     button.simulate('click');
     // click to force propegation to form wrapper https://github.com/airbnb/enzyme/issues/308#issuecomment-255630011
     button.get(0).click();
-    expect((component as React.Component<any, any>).state.isChecked).to.equal(true);
-    expect(onSubmit.called).to.equal(false);
+    expect((component as React.Component<any, any>).state.isChecked).toEqual(true);
+    expect(onSubmit.called).toEqual(false);
   });
 
 });
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.test.tsx b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.test.tsx
index 086a5499fdaf6..a1da2465c6150 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.test.tsx
@@ -3,11 +3,11 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
 import * as ReactDOM from 'react-dom';
-import * as ReactTestUtils from 'react-addons-test-utils';
+import * as ReactTestUtils from 'react-dom/test-utils';
+
 import { KeyCodes } from '../../../Utilities';
 import { BaseAutoFill } from './BaseAutoFill';
 
-let { assert } = chai;
 describe('BaseAutoFill', () => {
   let autoFill: BaseAutoFill;
   let autoFillInput: HTMLInputElement;
@@ -27,8 +27,8 @@ describe('BaseAutoFill', () => {
 
   it('correctly autofills', (done) => {
     const onInputValueChange = (text: string | undefined): void => {
-      assert(text === 'hel', 'text was ' + text);
-      assert(autoFill.value === 'hel', 'autoFill value was ' + autoFill.value);
+      expect(text).toBe('hel');
+      expect(autoFill.value).toBe('hel');
       done();
     };
 
@@ -48,15 +48,15 @@ describe('BaseAutoFill', () => {
         onInputValueChange={ onInputValueChange }
         suggestedDisplayValue='hello'
       />, baseNode);
-    assert(autoFill.inputElement.value === 'hello');
+    expect(autoFill.inputElement.value).toBe('hello');
 
   });
 
   it('does not autofill if suggestedDisplayValue does not match input', (done) => {
     const onInputValueChange = (text: string | undefined): void => {
-      assert(autoFill.value === 'hep', 'text was ' + autoFill.value);
-      assert(text === 'hep', 'text was ' + text);
-      assert(autoFill.inputElement.value === 'hep');
+      expect(text).toBe('hep');
+      expect(autoFill.value).toBe('hep');
+      expect(autoFill.inputElement.value).toBe('hep');
       done();
     };
 
@@ -93,8 +93,8 @@ describe('BaseAutoFill', () => {
 
     ReactTestUtils.Simulate.change(autoFillInput);
 
-    assert(autoFill.value === 'hel', 'text was ' + autoFill.value);
-    assert(autoFill.inputElement.value === 'hel');
+    expect(autoFill.value).toBe('hel');
+    expect(autoFill.inputElement.value).toBe('hel');
   });
 
   it('will autofill if keyCode up or down is pressed', () => {
@@ -109,8 +109,8 @@ describe('BaseAutoFill', () => {
       baseNode
     );
 
-    assert(autoFill.value === 'hel', 'text was ' + autoFill.value);
-    assert(autoFill.inputElement.value === 'hel');
+    expect(autoFill.value).toBe('hel');
+    expect(autoFill.inputElement.value).toBe('hel');
 
     ReactTestUtils.Simulate.keyDown(autoFillInput, { keyCode: KeyCodes.left, which: KeyCodes.left });
 
@@ -128,7 +128,7 @@ describe('BaseAutoFill', () => {
       baseNode
     );
 
-    assert(autoFill.value === 'hel');
-    assert(autoFill.inputElement.value === 'hello');
+    expect(autoFill.value).toBe('hel');
+    expect(autoFill.inputElement.value).toBe('hello');
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
index 900035c90c33f..f3f883a835bde 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
@@ -1,11 +1,9 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
-import * as ReactTestUtils from 'react-addons-test-utils';
+import * as ReactTestUtils from 'react-dom/test-utils';
 /* tslint:enable:no-unused-variable */
 
-let { expect } = chai;
-
 import { TagPicker, ITag } from './TagPicker/TagPicker';
 import { IBasePickerProps } from './BasePicker.Props';
 import { BasePicker } from './BasePicker';
@@ -74,14 +72,14 @@ describe('Pickers', () => {
 
       let suggestions = document.querySelector('.ms-Suggestions') as HTMLInputElement;
 
-      expect(suggestions).to.exist;
+      expect(suggestions).toBeDefined();
       let suggestionOptions = document.querySelectorAll('.ms-Suggestions-itemButton');
 
-      expect(suggestionOptions.length).to.be.equal(2, 'There were not 2 suggestions');
+      expect(suggestionOptions.length).toEqual(2);
       ReactTestUtils.Simulate.click(suggestionOptions[0]);
 
-      expect(picker.items.length).to.be.equal(1, 'There was not only 1 item selected');
-      expect(picker.items[0].name).to.be.equal('black', 'The selected item did not have the correct text');
+      expect(picker.items.length).toEqual(1);
+      expect(picker.items[0].name).toEqual('black');
 
       ReactDOM.unmountComponentAtNode(root);
 
@@ -106,9 +104,9 @@ describe('Pickers', () => {
 
       let suggestionOptions = document.querySelectorAll('.ms-Suggestions-itemButton');
       ReactTestUtils.Simulate.click(suggestionOptions[0]);
-      expect(picker.items.length).to.be.equal(1, 'There was not only 1 item selected');
+      expect(picker.items.length).toEqual(1);
       input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
-      expect(input).to.be.null;
+      expect(input).toBeNull();
 
       ReactDOM.unmountComponentAtNode(root);
     });
@@ -127,7 +125,7 @@ describe('Pickers', () => {
       ) as TypedBasePicker;
 
       let input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
-      expect(input).to.be.null;
+      expect(input).toBeNull();
 
       ReactDOM.unmountComponentAtNode(root);
     });
@@ -147,8 +145,8 @@ describe('Pickers', () => {
       ) as TypedBasePicker;
 
       let input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
-      expect(input).to.be.null;
-      expect(picker.items.length).to.equal(2);
+      expect(input).toBeNull();
+      expect(picker.items.length).toEqual(2);
 
       ReactDOM.unmountComponentAtNode(root);
     });
@@ -174,14 +172,14 @@ describe('Pickers', () => {
 
       let suggestions = document.querySelector('.ms-Suggestions') as HTMLInputElement;
 
-      expect(suggestions).to.exist;
+      expect(suggestions).toBeDefined();
       let suggestionOptions = document.querySelectorAll('.ms-Suggestions-itemButton');
 
-      expect(suggestionOptions.length).to.be.equal(2, 'There were not 2 suggestions');
+      expect(suggestionOptions.length).toEqual(2);
       ReactTestUtils.Simulate.click(suggestionOptions[0]);
 
-      expect(picker.items.length).to.be.equal(1, 'There was not only 1 item selected');
-      expect(picker.items[0].name).to.be.equal('black', 'The selected item did not have the correct text');
+      expect(picker.items.length).toEqual(1);
+      expect(picker.items[0].name).toEqual('black');
       ReactDOM.unmountComponentAtNode(root);
 
     });
@@ -206,7 +204,7 @@ describe('Pickers', () => {
 
       ReactTestUtils.Simulate.click(suggestionOptions[0]);
 
-      expect(picker.items.length).to.be.equal(0, 'The picker incorrectly added an item');
+      expect(picker.items.length).toEqual(0);
 
       picker = ReactDOM.render(
         <TagPicker
@@ -216,16 +214,16 @@ describe('Pickers', () => {
         root
       ) as TagPicker;
 
-      expect(picker.items.length).to.be.equal(1, 'The picker rendered with an item.');
-      expect(picker.items[0].name).to.be.equal('testColor', 'The selected item did not have the correct text');
+      expect(picker.items.length).toEqual(1);
+      expect(picker.items[0].name).toEqual('testColor');
       ReactDOM.unmountComponentAtNode(root);
     });
     it('fires change events correctly for controlled components', (done) => {
       let root = document.createElement('div');
       document.body.appendChild(root);
       const onChange = (items: ITag[] | undefined): void => {
-        expect(items!.length).to.be.equal(1, 'The picker incorrectly added an item');
-        expect(items![0].name).to.be.equal('black', 'The picker incorrectly added an item');
+        expect(items!.length).toBe(1);
+        expect(items![0].name).toBe('black');
         done();
       };
 
diff --git a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts
index f8e73eedccbfc..c6563b10b42d8 100644
--- a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts
+++ b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts
@@ -1,6 +1,5 @@
 import { DayOfWeek, DateRangeType } from '../dateValues/DateValues';
 import * as DateMath from './DateMath';
-let { expect } = chai;
 
 enum Months {
   Jan = 0,
@@ -24,7 +23,7 @@ describe('DateMath', () => {
     let result = DateMath.addDays(startDate, 5);
     let expected = new Date(2016, Months.Apr, 6);
 
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
   });
 
   it('can add days across a month boundary', () => {
@@ -32,7 +31,7 @@ describe('DateMath', () => {
     let result = DateMath.addDays(startDate, 5);
     let expected = new Date(2016, Months.Apr, 4);
 
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
   });
 
   it('can add days across multiple month boundaries', () => {
@@ -40,7 +39,7 @@ describe('DateMath', () => {
     let result = DateMath.addDays(startDate, 65);
     let expected = new Date(2016, Months.Jun, 4);
 
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
   });
 
   it('can add days across leap day boundaries', () => {
@@ -48,7 +47,7 @@ describe('DateMath', () => {
     let result = DateMath.addDays(startDate, 2);
     let expected = new Date(2016, Months.Mar, 1);
 
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
   });
 
   it('can add months', () => {
@@ -56,55 +55,55 @@ describe('DateMath', () => {
 
     let result = DateMath.addMonths(startDate, 1);
     let expected = new Date(2016, Months.Jan, 31);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, 2);
     expected = new Date(2016, Months.Feb, 29);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, 3);
     expected = new Date(2016, Months.Mar, 31);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, 4);
     expected = new Date(2016, Months.Apr, 30);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, 5);
     expected = new Date(2016, Months.May, 31);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, 6);
     expected = new Date(2016, Months.Jun, 30);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, 7);
     expected = new Date(2016, Months.Jul, 31);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, 8);
     expected = new Date(2016, Months.Aug, 31);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, 9);
     expected = new Date(2016, Months.Sep, 30);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, 10);
     expected = new Date(2016, Months.Oct, 31);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, 11);
     expected = new Date(2016, Months.Nov, 30);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, 12);
     expected = new Date(2016, Months.Dec, 31);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, 14);
     expected = new Date(2017, Months.Feb, 28);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
   });
 
   it('can add years', () => {
@@ -112,19 +111,19 @@ describe('DateMath', () => {
     let result = DateMath.addYears(startDate, 1);
     let expected = new Date(2017, Months.Feb, 28);
 
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     startDate = new Date(2016, Months.Feb, 29);
     result = DateMath.addYears(startDate, 4);
     expected = new Date(2020, Months.Feb, 29);
 
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     startDate = new Date(2016, Months.Jan, 1);
     result = DateMath.addYears(startDate, 1);
     expected = new Date(2017, Months.Jan, 1);
 
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
   });
 
   it('can subtract days', () => {
@@ -132,7 +131,7 @@ describe('DateMath', () => {
     let result = DateMath.addDays(startDate, -5);
     let expected = new Date(2016, Months.Apr, 25);
 
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
   });
 
   it('can subtract days across a month boundry', () => {
@@ -140,7 +139,7 @@ describe('DateMath', () => {
     let result = DateMath.addDays(startDate, -5);
     let expected = new Date(2016, Months.Mar, 27);
 
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
   });
 
   it('can subtract days across multiple month boundaries', () => {
@@ -148,7 +147,7 @@ describe('DateMath', () => {
     let result = DateMath.addDays(startDate, -65);
     let expected = new Date(2016, Months.Apr, 30);
 
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
   });
 
   it('can subtract days across leap day boundaries', () => {
@@ -156,7 +155,7 @@ describe('DateMath', () => {
     let result = DateMath.addDays(startDate, -2);
     let expected = new Date(2016, Months.Feb, 28);
 
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
   });
 
   it('can subtract months', () => {
@@ -164,55 +163,55 @@ describe('DateMath', () => {
 
     let result = DateMath.addMonths(startDate, -12);
     let expected = new Date(2015, Months.Dec, 31);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, -11);
     expected = new Date(2016, Months.Jan, 31);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, -10);
     expected = new Date(2016, Months.Feb, 29);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, -9);
     expected = new Date(2016, Months.Mar, 31);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, -8);
     expected = new Date(2016, Months.Apr, 30);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, -7);
     expected = new Date(2016, Months.May, 31);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, -6);
     expected = new Date(2016, Months.Jun, 30);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, -5);
     expected = new Date(2016, Months.Jul, 31);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, -4);
     expected = new Date(2016, Months.Aug, 31);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, -3);
     expected = new Date(2016, Months.Sep, 30);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, -2);
     expected = new Date(2016, Months.Oct, 31);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, -1);
     expected = new Date(2016, Months.Nov, 30);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     result = DateMath.addMonths(startDate, -22);
     expected = new Date(2015, Months.Feb, 28);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
   });
 
   it('can subtract years', () => {
@@ -220,53 +219,53 @@ describe('DateMath', () => {
     let result = DateMath.addYears(startDate, -1);
     let expected = new Date(2015, Months.Feb, 28);
 
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     startDate = new Date(2016, Months.Feb, 29);
     result = DateMath.addYears(startDate, -4);
     expected = new Date(2012, Months.Feb, 29);
 
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     startDate = new Date(2016, Months.Jan, 1);
     result = DateMath.addYears(startDate, -1);
     expected = new Date(2015, Months.Jan, 1);
 
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
   });
 
   it('can set the month', () => {
     let startDate = new Date(2016, Months.Jan, 31);
     let result = DateMath.setMonth(startDate, Months.Feb);
     let expected = new Date(2016, Months.Feb, 29);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
 
     startDate = new Date(2016, Months.Jun, 1);
     result = DateMath.setMonth(startDate, Months.Feb);
     expected = new Date(2016, Months.Feb, 1);
-    expect(result.getTime(), result.toDateString()).to.be.equal(expected.getTime());
+    expect(result.getTime()).toEqual(expected.getTime());
   });
 
   it('can compare dates', () => {
     let date1 = new Date(2016, 4, 1);
     let date2 = new Date(2016, 4, 1);
-    expect(DateMath.compareDates(date1, date2)).to.be.true;
+    expect(DateMath.compareDates(date1, date2)).toBe(true);
 
     date1 = new Date(2016, 4, 1, 12, 30, 0);
     date2 = new Date(2016, 4, 1, 10, 0, 0);
-    expect(DateMath.compareDates(date1, date2)).to.be.true;
+    expect(DateMath.compareDates(date1, date2)).toBe(true);
 
     date1 = new Date(2016, 4, 1);
     date2 = new Date(2016, 4, 2);
-    expect(DateMath.compareDates(date1, date2)).to.be.false;
+    expect(DateMath.compareDates(date1, date2)).toBe(false);
 
     date1 = new Date(2016, 4, 1);
     date2 = new Date(2016, 5, 1);
-    expect(DateMath.compareDates(date1, date2)).to.be.false;
+    expect(DateMath.compareDates(date1, date2)).toBe(false);
 
     date1 = new Date(2016, 4, 1);
     date2 = new Date(2017, 4, 1);
-    expect(DateMath.compareDates(date1, date2)).to.be.false;
+    expect(DateMath.compareDates(date1, date2)).toBe(false);
   });
 
   it('can get date range array', () => {
@@ -274,22 +273,22 @@ describe('DateMath', () => {
 
     // Date range: day
     let dateRangeArray = DateMath.getDateRangeArray(date, DateRangeType.Day, DayOfWeek.Sunday);
-    expect(dateRangeArray.length).to.be.equal(1);
-    expect(DateMath.compareDates(dateRangeArray[0], date)).to.be.true;
+    expect(dateRangeArray.length).toEqual(1);
+    expect(DateMath.compareDates(dateRangeArray[0], date)).toBe(true);
 
     // Date range: week
     let expectedDates = Array(7).map((val, i) => new Date(2017, 2, 12 + i));
     dateRangeArray = DateMath.getDateRangeArray(date, DateRangeType.Week, DayOfWeek.Sunday);
-    Array(7).forEach((val, i) => expect(DateMath.compareDates(dateRangeArray[i], date)).to.be.true);
+    Array(7).forEach((val, i) => expect(DateMath.compareDates(dateRangeArray[i], date)).toBe(true));
 
     // Date range: month
     expectedDates = Array(31).map((val, i) => new Date(2017, 2, 1 + i));
     dateRangeArray = DateMath.getDateRangeArray(date, DateRangeType.Month, DayOfWeek.Sunday);
-    Array(31).forEach((val, i) => expect(DateMath.compareDates(dateRangeArray[i], date)).to.be.true);
+    Array(31).forEach((val, i) => expect(DateMath.compareDates(dateRangeArray[i], date)).toBe(true));
 
     // First day of week: Tuesday
     expectedDates = Array(7).map((val, i) => new Date(2017, 2, 14 + i));
     dateRangeArray = DateMath.getDateRangeArray(date, DateRangeType.Week, DayOfWeek.Tuesday);
-    Array(7).forEach((val, i) => expect(DateMath.compareDates(dateRangeArray[i], date)).to.be.true);
+    Array(7).forEach((val, i) => expect(DateMath.compareDates(dateRangeArray[i], date)).toBe(true));
   });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.test.tsx b/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.test.tsx
index 43f33671ff07d..2ecb33dfc616b 100644
--- a/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.test.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.test.tsx
@@ -1,10 +1,8 @@
 import * as React from 'react';
-import * as ReactTestUtils from 'react-addons-test-utils';
+import * as ReactTestUtils from 'react-dom/test-utils';
 import { setResponsiveMode, withResponsiveMode, ResponsiveMode } from './withResponsiveMode';
 import { setSSR } from '../../Utilities';
 
-let { expect } = chai;
-
 @withResponsiveMode
 class Example extends React.Component<any, any> {
   public render() {
@@ -18,7 +16,7 @@ describe('withResponsiveMode', () => {
     setSSR(true);
 
     setResponsiveMode(ResponsiveMode.large);
-    expect(() => ReactTestUtils.renderIntoDocument(<Example />)).to.exist;
+    expect(() => ReactTestUtils.renderIntoDocument(<Example />)).toBeDefined();
 
     setSSR(false);
   });
@@ -27,7 +25,7 @@ describe('withResponsiveMode', () => {
     setSSR(true);
 
     setResponsiveMode(undefined);
-    expect(() => ReactTestUtils.renderIntoDocument(<Example />)).throws();
+    expect(() => ReactTestUtils.renderIntoDocument(<Example />)).toThrow();
 
     setSSR(false);
   });
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx b/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx
index f04262d154d42..8577da138f324 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx
@@ -6,8 +6,6 @@ import { Grid } from './Grid';
 import { DefaultButton } from '../../Button';
 import { shallow } from 'enzyme';
 
-let { expect } = chai;
-
 const DEFAULT_ITEMS: any[] = [
   { id: 'a', text: '0,0' },
   { id: 'b', text: '1,0' },
@@ -29,11 +27,11 @@ describe('Grid', () => {
         onRenderItem={ (item: any, index: number) => { return <DefaultButton role='gridcell'>item.text</DefaultButton>; } }
       />
     );
-    expect(wrapper.find('table[role="grid"]').length).to.equal(1, 'expect to have one table with role="grid"');
-    expect(wrapper.find('tr[role="row"]').length).to.equal(2, 'expect to have 2 rows with role="row"');
-    expect(wrapper.find('td [role="gridcell"]').length).to.equal(8, 'expect to have 8 cells with role="gridcell"');
-    expect(wrapper.find('[aria-posinset]').length).to.equal(0, 'expect to not have aria-posinset set');
-    expect(wrapper.find('[aria-setsize]').length).to.equal(0, 'expect to not have aria-setsize set');
+    expect(wrapper.find('table[role="grid"]').length).toEqual(1);
+    expect(wrapper.find('tr[role="row"]').length).toEqual(2);
+    expect(wrapper.find('td [role="gridcell"]').length).toEqual(8);
+    expect(wrapper.find('[aria-posinset]').length).toEqual(0);
+    expect(wrapper.find('[aria-setsize]').length).toEqual(0);
   });
   it('Can render a grid with width of 2', () => {
     let wrapper = shallow(
@@ -43,11 +41,11 @@ describe('Grid', () => {
         onRenderItem={ (item: any, index: number) => { return <DefaultButton role='gridcell'>item.text</DefaultButton>; } }
       />
     );
-    expect(wrapper.find('table[role="grid"]').length).to.equal(1, 'expect to have one table with role="grid"');
-    expect(wrapper.find('tr[role="row"]').length).to.equal(4, 'expect to have 2 rows with role="row"');
-    expect(wrapper.find('td [role="gridcell"]').length).to.equal(8, 'expect to have 8 cells with role="gridcell"');
-    expect(wrapper.find('[aria-posinset]').length).to.equal(0, 'expect to not have aria-posinset set');
-    expect(wrapper.find('[aria-setsize]').length).to.equal(0, 'expect to not have aria-setsize set');
+    expect(wrapper.find('table[role="grid"]').length).toEqual(1);
+    expect(wrapper.find('tr[role="row"]').length).toEqual(4);
+    expect(wrapper.find('td [role="gridcell"]').length).toEqual(8);
+    expect(wrapper.find('[aria-posinset]').length).toEqual(0);
+    expect(wrapper.find('[aria-setsize]').length).toEqual(0);
   });
   it('Can render a grid with posInSet and setSize', () => {
     let wrapper = shallow(
@@ -59,12 +57,12 @@ describe('Grid', () => {
         setSize={ 2 }
       />
     );
-    expect(wrapper.find('table[role="grid"]').length).to.equal(1, 'expect to have one table with role="grid"');
-    expect(wrapper.find('tr[role="row"]').length).to.equal(4, 'expect to have 2 rows with role="row"');
-    expect(wrapper.find('td [role="gridcell"]').length).to.equal(8, 'expect to have 8 cells with role="gridcell"');
-    expect(wrapper.find('[aria-posinset]').length).to.equal(1, 'expect to have aria-posinset set');
-    expect(wrapper.find('[aria-posinset]').html()).to.contain('aria-posinset="1"', 'expect aria-posinset to be 1');
-    expect(wrapper.find('[aria-setsize]').length).to.equal(1, 'expect to have aria-setsize set');
-    expect(wrapper.find('[aria-posinset]').html()).to.contain('aria-setsize="2"', 'expect aria-setsize to be 2');
+    expect(wrapper.find('table[role="grid"]').length).toEqual(1);
+    expect(wrapper.find('tr[role="row"]').length).toEqual(4);
+    expect(wrapper.find('td [role="gridcell"]').length).toEqual(8);
+    expect(wrapper.find('[aria-posinset]').length).toEqual(1);
+    expect(wrapper.find('[aria-posinset]').html()).toEqual(expect.stringMatching('aria-posinset="1"'));
+    expect(wrapper.find('[aria-setsize]').length).toEqual(1);
+    expect(wrapper.find('[aria-posinset]').html()).toEqual(expect.stringMatching('aria-setsize="2"'));
   });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning.test.ts b/packages/office-ui-fabric-react/src/utilities/positioning.test.ts
index 8561cd8b5d9ad..098f225f8cc87 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning.test.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning.test.ts
@@ -13,8 +13,6 @@ interface ITestValues {
   beakWidth: number;
 }
 
-let { assert } = chai;
-
 function stringifyResults(expected: any, actual: any) {
   return 'expected was: ' + JSON.stringify(expected) + ' actual was: ' + JSON.stringify(actual);
 }
@@ -26,16 +24,20 @@ function positionCalloutTest(testValues: ITestValues, alignment: DirectionalHint
 
   let beak: Rectangle = positioningFunctions._positionBeak(beakWidth, result, target, 0);
 
-  assert(result.calloutRectangle.equals(validate.callout), 'Callout not alligned with target ' + stringifyResults(validate.callout, result.calloutRectangle));
+  expect(result.calloutRectangle).toEqual(validate.callout);
 
-  assert(beak.equals(validate.beak as Rectangle), 'Beak is improperly positioned. ' + stringifyResults(validate.beak, beak));
+  // Use `toBeCloseTo` because of how JS handles floating points
+  expect(beak.bottom).toBeCloseTo(validate.beak!.bottom);
+  expect(beak.left).toBeCloseTo(validate.beak!.left);
+  expect(beak.right).toBeCloseTo(validate.beak!.right);
+  expect(beak.top).toBeCloseTo(validate.beak!.top);
 }
 
 function validateNoBeakTest(testValues: ITestValues, alignment: DirectionalHint, validate: ITestValidation) {
   let { callout, target, bounds, beakWidth } = testValues;
   let result: positioningFunctions.ICallout = positioningFunctions._positionCalloutWithinBounds(callout, target, bounds, positioningFunctions._getPositionData(alignment, target, bounds), beakWidth);
 
-  assert(result.calloutRectangle.equals(validate.callout), 'No Beak: Callout not alligned with target ' + stringifyResults(validate.callout, result.calloutRectangle));
+  expect(result.calloutRectangle).toEqual(validate.callout);
 }
 
 describe('Callout Positioning', () => {
@@ -43,47 +45,56 @@ describe('Callout Positioning', () => {
   it('Gets correct percent along line', () => {
 
     let result = positioningFunctions._calculatePointPercentAlongLine({ x: 0, y: 0 }, { x: 100, y: 0 }, 50);
-    assert(result.x === 50 && result.y === 0, 'point is not 50% from edge ' + stringifyResults(50, result.x));
+    expect(result.x).toBe(50);
+    expect(result.y).toBe(0);
 
     result = positioningFunctions._calculatePointPercentAlongLine({ x: 0, y: 0 }, { x: 100, y: 0 }, 75);
-    assert(result.x === 75 && result.y === 0, 'point is not 75% from edge ' + stringifyResults(75, result.x));
+    expect(result.x).toBe(75);
+    expect(result.y).toBe(0);
 
     result = positioningFunctions._calculatePointPercentAlongLine({ x: 0, y: 0 }, { x: 0, y: 100 }, 99);
-    assert(result.x === 0 && result.y === 99, 'point is not 99% from edge ' + stringifyResults(99, result.x));
+    expect(result.x).toBe(0);
+    expect(result.y).toBe(99);
 
     result = positioningFunctions._calculatePointPercentAlongLine({ x: 0, y: 0 }, { x: 3, y: 0 }, 50);
-    assert(result.x === 1.5 && result.y === 0, 'point is not 50% from edge ' + stringifyResults(1.5, result.x));
+    expect(result.x).toBe(1.5);
+    expect(result.y).toBe(0);
 
     result = positioningFunctions._calculatePointPercentAlongLine({ x: 0, y: 0 }, { x: 3, y: 0 }, 75);
-    assert(result.x === 2.25 && result.y === 0, 'point is not 75% from edge ' + stringifyResults(2.25, result.x));
+    expect(result.x).toBe(2.25);
+    expect(result.y).toBe(0);
 
     result = positioningFunctions._calculatePointPercentAlongLine({ x: 0, y: 0 }, { x: 4, y: 0 }, 50);
-    assert(result.x === 2 && result.y === 0, 'point is not 50% from edge ' + stringifyResults(2, result.x));
+    expect(result.x).toBe(2);
+    expect(result.y).toBe(0);
 
     result = positioningFunctions._calculatePointPercentAlongLine({ x: 0, y: 0 }, { x: 4, y: 0 }, 75);
-    assert(result.x === 3 && result.y === 0, 'point is not 75% from edge ' + stringifyResults(3, result.x));
+    expect(result.x).toBe(3);
+    expect(result.y).toBe(0);
 
     result = positioningFunctions._calculatePointPercentAlongLine({ x: 0, y: 0 }, { x: 4, y: 0 }, 60);
-    assert(result.x === 2.4 && result.y === 0, 'point is not 60% from edge ' + stringifyResults(2.4, result.x));
+    expect(result.x).toBe(2.4);
+    expect(result.y).toBe(0);
 
     result = positioningFunctions._calculatePointPercentAlongLine({ x: 0, y: 0 }, { x: 5, y: 0 }, 99);
-    assert(result.x === 4.95 && result.y === 0, 'point is not 99% from edge ' + stringifyResults(4.95, result.x));
+    expect(result.x).toBe(4.95);
+    expect(result.y).toBe(0);
   });
 
   it('Correctly recalculates percents', () => {
     let targetRectangle = new Rectangle(200, 300, 200, 300);
 
     let result = positioningFunctions._recalculateMatchingPercents(new Rectangle(0, 100, 300, 400), RectangleEdge.top, targetRectangle, RectangleEdge.bottom, 50);
-    assert(result === 100, stringifyResults(100, result));
+    expect(result).toBe(100);
 
     result = positioningFunctions._recalculateMatchingPercents(new Rectangle(200, 300, 300, 400), RectangleEdge.top, targetRectangle, RectangleEdge.bottom, 50);
-    assert(result === 50, stringifyResults(50, result));
+    expect(result).toBe(50);
 
     result = positioningFunctions._recalculateMatchingPercents(new Rectangle(200, 250, 300, 400), RectangleEdge.top, targetRectangle, RectangleEdge.bottom, 25);
-    assert(result === 50, stringifyResults(50, result));
+    expect(result).toBe(50);
 
     result = positioningFunctions._recalculateMatchingPercents(new Rectangle(600, 900, 300, 400), RectangleEdge.top, targetRectangle, RectangleEdge.bottom, 50);
-    assert(result === 0, stringifyResults(0, result));
+    expect(result).toBe(0);
   });
 
   it('Correctly positions the callout without beak', () => {
@@ -158,16 +169,16 @@ describe('Callout Positioning', () => {
     let bounds = new Rectangle(0, 1000, 0, 1000);
 
     let testMax = getMaxHeight(targetRectangle, DirectionalHint.bottomCenter, 0, bounds);
-    assert(testMax === 1000 - targetBot,
-      `Test for maxHeight from bottom of target to bottom of bounds: maxHeight was ${testMax} and it should have been ${1000 - targetBot}`);
+    // Test for maxHeight from bottom of target to bottom of bounds
+    expect(testMax).toBe(1000 - targetBot);
 
     testMax = getMaxHeight(targetRectangle, DirectionalHint.topCenter, 0, bounds);
-    assert(testMax === targetTop,
-      `Test for maxHeight from top of target to top of bounds: maxHeight was ${testMax} and it should have been ${targetTop}`);
+    // Test for maxHeight from top of target to top of bounds
+    expect(testMax).toBe(targetTop);
 
     testMax = getMaxHeight(targetRectangle, DirectionalHint.rightCenter, 0, bounds);
-    assert(testMax === 1000 - targetTop,
-      `Test for maxHeight from top of target to bottom of bounds: maxHeight was ${testMax} and it should have been ${1000 - targetTop}`);
+    // Test for maxHeight from top of target to bottom of bounds
+    expect(testMax).toBe(1000 - targetTop);
   });
 
   it('Correctly determines max height with a gapSpace included', () => {
@@ -182,16 +193,16 @@ describe('Callout Positioning', () => {
 
     let testMax = getMaxHeight(targetRectangle, DirectionalHint.bottomCenter, gapSpace, bounds);
 
-    assert(testMax === 1000 - targetBot - gapSpace,
-      `Test for maxHeight from bottom of target to bottom of bounds: maxHeight was ${testMax} and it should have been ${1000 - targetBot - gapSpace}`);
+    // Test for maxHeight from bottom of target to bottom of bounds
+    expect(testMax).toBe(1000 - targetBot - gapSpace);
 
     testMax = getMaxHeight(targetRectangle, DirectionalHint.topCenter, gapSpace, bounds);
-    assert(testMax === targetTop - gapSpace,
-      `Test for maxHeight from top of target to top of bounds: maxHeight was ${testMax} and it should have been ${targetTop - gapSpace}`);
+    // Test for maxHeight from top of target to top of bounds
+    expect(testMax).toBe(targetTop - gapSpace);
 
     testMax = getMaxHeight(targetRectangle, DirectionalHint.rightCenter, gapSpace, bounds);
-    assert(testMax === 1000 - targetTop - gapSpace,
-      `Test for maxHeight from top of target to bottom of bounds: maxHeight was ${testMax} and it should have been ${1000 - targetTop - gapSpace}`);
+    // Test for maxHeight from top of target to bottom of bounds
+    expect(testMax).toBe(1000 - targetTop - gapSpace);
   });
 
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/Selection.test.ts b/packages/office-ui-fabric-react/src/utilities/selection/Selection.test.ts
index 7b810aa6aeaa3..fb4845b2e17d6 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/Selection.test.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selection/Selection.test.ts
@@ -1,5 +1,3 @@
-let { expect } = chai;
-
 import { Selection } from './Selection';
 import { IObjectWithKey } from './interfaces';
 
@@ -13,44 +11,44 @@ describe('Selection', () => {
     let selection = new Selection({ onSelectionChanged: () => changeCount++ });
 
     selection.setItems(setA, false);
-    expect(changeCount).equals(0, 'after setting set a');
+    expect(changeCount).toEqual(0);
 
     selection.setKeySelected('a', true, true);
     selection.setKeySelected('a', true, true);
     selection.setIndexSelected(0, true, true);
-    expect(changeCount).equals(1, 'after selecting item a');
+    expect(changeCount).toEqual(1);
 
     // Switch to set b, which also contains item a, in the same position. No change event should occur.
     selection.setItems(setB, false);
-    expect(changeCount).equals(1, 'after switching to set b');
+    expect(changeCount).toEqual(1);
 
     // Select b
     selection.setKeySelected('b', true, true);
-    expect(changeCount).equals(2, 'after selecting b');
+    expect(changeCount).toEqual(2);
 
     // Change back to set a, which has item b in a different index.
     selection.setItems(setA, false);
-    expect(changeCount).equals(3, 'after changing back to set a');
+    expect(changeCount).toEqual(3);
 
     // Change to set b, but clear it.
     selection.setItems(setB, true);
-    expect(changeCount).equals(4, 'after switching to set b and clearing');
+    expect(changeCount).toEqual(4);
 
     // Select an item in set b that doesn't exist in set a, then switch to set a.
     selection.setKeySelected('d', true, true);
     selection.setItems(setA, false);
-    expect(changeCount).equals(6, 'after selecting c and switching to set a');
+    expect(changeCount).toEqual(6);
 
     // Select an item, clear, clear again.
     selection.setAllSelected(true);
     selection.setAllSelected(true);
     selection.setAllSelected(false);
     selection.setAllSelected(false);
-    expect(changeCount).equals(8, 'after selecting all 2 times and clearing 2 times');
+    expect(changeCount).toEqual(8);
 
     selection.setIndexSelected(0, true, true);
     selection.selectToIndex(2, true);
-    expect(changeCount).equals(10, 'after range selecting from 0 to 2');
+    expect(changeCount).toEqual(10);
   });
 
   it('returns false on isAllSelected when no items are selectable', () => {
@@ -62,13 +60,13 @@ describe('Selection', () => {
 
     selection.setItems(setA);
 
-    expect(selection.isAllSelected()).to.equal(false, 'isAllSelected was not false after initialization');
+    expect(selection.isAllSelected()).toEqual(false);
 
     selection.setAllSelected(true);
 
-    expect(selection.isAllSelected()).to.equal(false, 'isAllSelected was not false after trying to select all the unselectables');
+    expect(selection.isAllSelected()).toEqual(false);
 
-    expect(changeEvents).to.equal(0, 'changeEvents were not 0');
+    expect(changeEvents).toEqual(0);
   });
 
   it('resets unselectable count on setting new items', () => {
@@ -78,14 +76,14 @@ describe('Selection', () => {
     });
 
     selection.setItems(setA);
-    expect(selection.isAllSelected()).to.equal(false, 'isAllSelected was not false after initialization');
+    expect(selection.isAllSelected()).toEqual(false);
     selection.setAllSelected(true);
-    expect(selection.isAllSelected()).to.equal(false, 'isAllSelected was not false after trying to select all the unselectables');
+    expect(selection.isAllSelected()).toEqual(false);
 
     canSelect = true;
     selection.setItems(setA);
     selection.setAllSelected(true);
-    expect(selection.isAllSelected()).to.equal(true, 'isAllSelected was not false after trying to select all the unselectables');
+    expect(selection.isAllSelected()).toEqual(true);
   });
 
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
index 13315a3b8d7ea..0deb4c3de0acf 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
@@ -3,12 +3,12 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
 import * as ReactDOM from 'react-dom';
-import * as ReactTestUtils from 'react-addons-test-utils';
-let { expect } = chai;
+import * as ReactTestUtils from 'react-dom/test-utils';
 
 import { SelectionZone } from './SelectionZone';
 import { Selection } from './Selection';
 import { SelectionMode } from './interfaces';
+
 import { KeyCodes } from '../../Utilities';
 
 let _selection: Selection;
@@ -80,22 +80,22 @@ describe('SelectionZone', () => {
 
   it('toggles an item on click of toggle element', () => {
     _simulateClick(_toggle0);
-    expect(_selection.isIndexSelected(0)).equals(true, 'Index 0 not selected');
+    expect(_selection.isIndexSelected(0)).toEqual(true);
     _simulateClick(_toggle0);
-    expect(_selection.isIndexSelected(0)).equals(false, 'Index 0 selected');
-    expect(_onItemInvokeCalled).equals(0, 'onItemInvoked was called');
+    expect(_selection.isIndexSelected(0)).toEqual(false);
+    expect(_onItemInvokeCalled).toEqual(0);
   });
 
   it('toggles an item on dblclick of toggle element', () => {
     ReactTestUtils.Simulate.doubleClick(_toggle0);
-    expect(_selection.isIndexSelected(0)).equals(false, 'Index 0 selected');
-    expect(_onItemInvokeCalled).equals(0, 'onItemInvoked was called');
+    expect(_selection.isIndexSelected(0)).toEqual(false);
+    expect(_onItemInvokeCalled).toEqual(0);
   });
 
   it('does not toggle an item on mousedown of toggle element', () => {
     ReactTestUtils.Simulate.mouseDown(_toggle0);
-    expect(_selection.isIndexSelected(0) === false, 'Index 0 selected');
-    expect(_onItemInvokeCalled === 0, 'onItemInvoked was called');
+    expect(_selection.isIndexSelected(0)).toEqual(false);
+    expect(_onItemInvokeCalled).toEqual(0);
   });
 
   it('selects an unselected item on mousedown of invoke without modifiers pressed', () => {
@@ -104,119 +104,119 @@ describe('SelectionZone', () => {
 
     // Mousedown on the only unselected item's invoke surface should deselect all and select that one.
     ReactTestUtils.Simulate.mouseDown(_invoke0);
-    expect(_selection.isIndexSelected(0)).equals(true, 'Index 0 not selected after mousedown');
-    expect(_selection.getSelectedCount()).equals(1, 'Only 1 item should be selected');
+    expect(_selection.isIndexSelected(0)).toEqual(true);
+    expect(_selection.getSelectedCount()).toEqual(1);
   });
 
   it('does nothing with mousedown of invoke when item is selected already', () => {
     // Mousedown on an item that's already selected should do nothing.
     _selection.setAllSelected(true);
     ReactTestUtils.Simulate.mouseDown(_invoke0);
-    expect(_selection.isAllSelected()).equals(true, 'Expecting all items to be selected');
+    expect(_selection.isAllSelected()).toEqual(true);
   });
 
   it('calls the invoke callback on click of invoke area', () => {
     _simulateClick(_invoke0);
-    expect(_onItemInvokeCalled === 1, 'onItemInvoked was not called 1 time after normal click');
+    expect(_onItemInvokeCalled).toEqual(1);
   });
 
   it('selects an unselected item on click of item surface element', () => {
     _simulateClick(_surface0);
-    expect(_selection.isIndexSelected(0)).equals(true, 'Index 0 not selected');
-    expect(_onItemInvokeCalled).equals(0, 'onItemInvoked was called');
+    expect(_selection.isIndexSelected(0)).toEqual(true);
+    expect(_onItemInvokeCalled).toEqual(0);
   });
 
   it('does not unselect a selected item on click of item surface element', () => {
     _selection.setIndexSelected(0, true, true);
     _simulateClick(_surface0);
-    expect(_selection.isIndexSelected(0)).equals(true, 'Index 0 not selected');
-    expect(_onItemInvokeCalled).equals(0, 'onItemInvoked was called');
+    expect(_selection.isIndexSelected(0)).toEqual(true);
+    expect(_onItemInvokeCalled).toEqual(0);
   });
 
   it('does not select an unselected item on mousedown of item surface element', () => {
     ReactTestUtils.Simulate.mouseDown(_surface0);
-    expect(_selection.isIndexSelected(0)).equals(false, 'Index 0 selected');
+    expect(_selection.isIndexSelected(0)).toEqual(false);
   });
 
   it('invokes an item on double clicking the surface element', () => {
     ReactTestUtils.Simulate.doubleClick(_surface0);
-    expect(_onItemInvokeCalled).equals(1, 'Item was invoked');
-    expect(_lastItemInvoked.key).equals('a', 'Item invoked was not expected item');
+    expect(_onItemInvokeCalled).toEqual(1);
+    expect(_lastItemInvoked.key).toEqual('a');
   });
 
   it('toggles all on toggle-all clicks', () => {
     _simulateClick(_toggleAll);
-    expect(_selection.getSelectedCount()).equals(4, 'There were not 4 selected items');
+    expect(_selection.getSelectedCount()).toEqual(4);
 
     _simulateClick(_toggle1);
-    expect(_selection.getSelectedCount()).equals(3, 'There were not 3 selected items after toggling index 1');
+    expect(_selection.getSelectedCount()).toEqual(3);
 
     _simulateClick(_toggleAll);
-    expect(_selection.getSelectedCount()).equals(4, 'There were not 4 selected items after selecting all again');
+    expect(_selection.getSelectedCount()).toEqual(4);
 
     _simulateClick(_toggleAll);
-    expect(_selection.getSelectedCount()).equals(0, 'There were not 0 selected items');
+    expect(_selection.getSelectedCount()).toEqual(0);
   });
 
   it('suports mouse shift click range select scenarios', () => {
     _simulateClick(_surface1);
-    expect(_selection.getSelectedCount()).equals(1, 'Clicked surface 1');
+    expect(_selection.getSelectedCount()).toEqual(1);
 
     _simulateClick(_surface3, { shiftKey: true });
-    expect(_selection.getSelectedCount()).equals(3, 'After clicking surface 1 and then shift clicking to surface 3');
+    expect(_selection.getSelectedCount()).toEqual(3);
 
     _simulateClick(_surface0, { shiftKey: true });
-    expect(_selection.getSelectedCount()).equals(2, 'After shift clicking surface 0');
+    expect(_selection.getSelectedCount()).toEqual(2);
   });
 
   it('toggles by ctrl clicking a surface', () => {
     _simulateClick(_toggleAll);
-    expect(_selection.getSelectedCount()).equals(4, 'There were not 4 selected items');
+    expect(_selection.getSelectedCount()).toEqual(4);
 
     _simulateClick(_surface1, {
       ctrlKey: true
     });
-    expect(_selection.getSelectedCount()).equals(3, 'There were not 3 selected items');
+    expect(_selection.getSelectedCount()).toEqual(3);
   });
 
   it('selects all on ctrl-a', () => {
     ReactTestUtils.Simulate.keyDown(_componentElement, { ctrlKey: true, which: KeyCodes.a });
-    expect(_selection.isAllSelected()).equals(true, 'Expecting that all is selected aftr ctrl-a');
+    expect(_selection.isAllSelected()).toEqual(true);
   });
 
   it('unselects all on escape', () => {
     _selection.setAllSelected(true);
     ReactTestUtils.Simulate.keyDown(_componentElement, { which: KeyCodes.escape });
-    expect(_selection.getSelectedCount()).equals(0, 'Expecting that none is selected aftr escape');
+    expect(_selection.getSelectedCount()).toEqual(0);
   });
 
   it('does not select item on focus', () => {
     ReactTestUtils.Simulate.focus(_surface0);
-    expect(_selection.isIndexSelected(0)).equals(false, 'Item 0 was selected');
+    expect(_selection.isIndexSelected(0)).toEqual(false);
   });
 
   it('does not select an item on focus if ctrl/meta is pressed', () => {
     ReactTestUtils.Simulate.keyDown(_componentElement, { ctrlKey: true });
     ReactTestUtils.Simulate.focus(_surface0);
-    expect(_selection.isIndexSelected(0)).equals(false, 'Item 0 was selected on focus with modifier');
+    expect(_selection.isIndexSelected(0)).toEqual(false);
   });
 
   it('does not select an item on focus when ignoreNextFocus is called', () => {
     _selectionZone.ignoreNextFocus();
     ReactTestUtils.Simulate.focus(_surface0);
-    expect(_selection.isIndexSelected(0)).equals(false, 'Item 0 was selected on ignored focus');
+    expect(_selection.isIndexSelected(0)).toEqual(false);
   });
 
   it('toggles an item when pressing space', () => {
     ReactTestUtils.Simulate.keyDown(_surface0, { which: KeyCodes.space });
-    expect(_selection.isIndexSelected(0)).equals(true, 'Expecting index 0 to become selected');
+    expect(_selection.isIndexSelected(0)).toEqual(true);
     ReactTestUtils.Simulate.keyDown(_surface0, { which: KeyCodes.space });
-    expect(_selection.isIndexSelected(0)).equals(false, 'Expecting index 0 to become unselected');
+    expect(_selection.isIndexSelected(0)).toEqual(false);
   });
 
   it('does not select the row when clicking on a toggle within an invoke element', () => {
     ReactTestUtils.Simulate.mouseDown(_toggle2);
-    expect(_selection.isIndexSelected(2)).equals(false, 'Item 2 should have been unselected');
+    expect(_selection.isIndexSelected(2)).toEqual(false);
   });
 
   it('can remove selection if you click on dead space', () => {
@@ -225,7 +225,7 @@ describe('SelectionZone', () => {
     // Raise real browser event.
     document.documentElement.click();
 
-    expect(_selection.getSelectedCount()).equals(0, 'Expecting selection to be cleared');
+    expect(_selection.getSelectedCount()).toEqual(0);
   });
 });
 
diff --git a/packages/office-ui-fabric-react/tsconfig.json b/packages/office-ui-fabric-react/tsconfig.json
index 48de7717292e6..ed8e3408e720e 100644
--- a/packages/office-ui-fabric-react/tsconfig.json
+++ b/packages/office-ui-fabric-react/tsconfig.json
@@ -18,8 +18,7 @@
       "dom"
     ],
     "types": [
-      "chai",
-      "mocha",
+      "jest",
       "webpack-env"
     ],
     "paths": {
diff --git a/scripts/tasks/jest-mock.js b/scripts/tasks/jest-mock.js
new file mode 100644
index 0000000000000..38385ae8d057b
--- /dev/null
+++ b/scripts/tasks/jest-mock.js
@@ -0,0 +1,23 @@
+const KeyCodes = {
+  a: 65,
+  backspace: 8,
+  comma: 188,
+  del: 46,
+  down: 40,
+  end: 35,
+  enter: 13,
+  escape: 27,
+  home: 36,
+  left: 37,
+  pageDown: 34,
+  pageUp: 33,
+  right: 39,
+  semicolon: 186,
+  space: 32,
+  tab: 9,
+  up: 38,
+};
+
+module.exports = {
+  KeyCodes
+};
\ No newline at end of file
diff --git a/scripts/tasks/jest-resources.js b/scripts/tasks/jest-resources.js
index a5a5ff51aaf6e..4c28cdf3a570b 100644
--- a/scripts/tasks/jest-resources.js
+++ b/scripts/tasks/jest-resources.js
@@ -12,7 +12,8 @@ const styleMockPath =
       {
         moduleNameMapper: {
           'ts-jest': path.resolve(__dirname, '../node_modules/ts-jest'),
-          '\\.(scss)$': path.resolve(__dirname, 'jest-style-mock.js')
+          '\\.(scss)$': path.resolve(__dirname, 'jest-style-mock.js'),
+          'KeyCodes': path.resolve(__dirname, 'jest-mock.js')
         },
 
         'transform': {

From 3db3a720db117af53d6bc0a73e3c5a0e11585fd8 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Tue, 3 Oct 2017 12:12:39 -0700
Subject: [PATCH 0766/1641] Update default displayValue (#3006)

---
 .../src/components/pickers/AutoFill/BaseAutoFill.tsx            | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
index 76b1a9c160bc2..a7b238f0434d1 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
@@ -29,7 +29,7 @@ export class BaseAutoFill extends BaseComponent<IBaseAutoFillProps, IBaseAutoFil
     super(props);
     this._value = '';
     this.state = {
-      displayValue: props.defaultVisibleValue === null ? '' : props.defaultVisibleValue
+      displayValue: props.defaultVisibleValue || ''
     };
   }
 

From 1bad538220cc18885e7e6efd7c4cc0e7846c25d4 Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Tue, 3 Oct 2017 14:06:41 -0700
Subject: [PATCH 0767/1641] Positioning refactor (#2984)

* streamlined position and removed deprecated functions

* Adding change files

* undid directional example changes

* fixed build problem

* fixed comments

* fixed linting error

* fixed another target element

* Update Callout.test.tsx

* fixed positioning test
---
 ...positioning-refactor_2017-09-28-20-50.json |   11 +
 ...positioning-refactor_2017-09-28-20-50.json |   11 +
 .../src/common/DirectionalHint.ts             |    2 +-
 .../examples/Calendar.Button.Example.tsx      |    2 +-
 .../src/components/Callout/Callout.Props.ts   |    6 -
 .../src/components/Callout/Callout.test.tsx   |   25 -
 .../src/components/Callout/CalloutContent.tsx |   66 +-
 .../examples/Callout.Basic.Example.tsx        |    2 +-
 .../examples/Callout.Cover.Example.tsx        |   34 +-
 .../examples/Callout.Directional.Example.tsx  |   41 +-
 .../examples/Callout.Nested.Example.tsx       |    2 +-
 .../Callout/examples/CalloutExample.scss      |    3 +
 .../src/components/ComboBox/ComboBox.tsx      |    2 +-
 .../src/components/CommandBar/CommandBar.tsx  |    2 +-
 .../ContextualMenu/ContextualMenu.Props.ts    |    6 -
 .../ContextualMenu/ContextualMenu.tsx         |    8 +-
 .../ContextualMenu.Directional.Example.tsx    |   37 +-
 .../src/components/DatePicker/DatePicker.tsx  |    2 +-
 .../examples/DetailsList.Advanced.Example.tsx |    2 +-
 .../src/components/Dropdown/Dropdown.tsx      |    2 +-
 .../components/HoverCard/ExpandingCard.tsx    |    2 +-
 .../TeachingBubble/TeachingBubble.tsx         |    2 +-
 .../TextField.CustomRender.Example.tsx        |    2 +-
 .../src/components/Theme/ThemePage.tsx        |    2 +-
 .../ThemeGenerator/ThemeGeneratorPage.tsx     |    2 +-
 .../src/components/Tooltip/Tooltip.tsx        |    4 +-
 .../src/components/pickers/BasePicker.tsx     |    2 +-
 .../SelectedItemWithMenu.tsx                  |    2 +-
 .../src/utilities/positioning.test.ts         |   77 +-
 .../src/utilities/positioning.ts              | 1088 ++++++++---------
 30 files changed, 665 insertions(+), 784 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/positioning-refactor_2017-09-28-20-50.json
 create mode 100644 common/changes/office-ui-fabric-react/positioning-refactor_2017-09-28-20-50.json

diff --git a/common/changes/@uifabric/utilities/positioning-refactor_2017-09-28-20-50.json b/common/changes/@uifabric/utilities/positioning-refactor_2017-09-28-20-50.json
new file mode 100644
index 0000000000000..05f0b25dfa580
--- /dev/null
+++ b/common/changes/@uifabric/utilities/positioning-refactor_2017-09-28-20-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Positioning: Refactored positioning and removed deprecated properties",
+      "type": "major"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/positioning-refactor_2017-09-28-20-50.json b/common/changes/office-ui-fabric-react/positioning-refactor_2017-09-28-20-50.json
new file mode 100644
index 0000000000000..8e8da55bb2cbd
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/positioning-refactor_2017-09-28-20-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Positioning: Refactored positioning and removed deprecated properties",
+      "type": "major"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/common/DirectionalHint.ts b/packages/office-ui-fabric-react/src/common/DirectionalHint.ts
index d63b299ed6a31..96b33917d26f0 100644
--- a/packages/office-ui-fabric-react/src/common/DirectionalHint.ts
+++ b/packages/office-ui-fabric-react/src/common/DirectionalHint.ts
@@ -1,4 +1,4 @@
-export enum DirectionalHint {
+export const enum DirectionalHint {
   /**
    * Appear above the target element, with the left edges of the callout and target aligning.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
index 63c5128cc0c14..872194ed98103 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
@@ -107,7 +107,7 @@ export class CalendarButtonExample extends React.Component<ICalendarButtonExampl
             className='ms-DatePicker-callout'
             gapSpace={ 0 }
             doNotLayer={ false }
-            targetElement={ this._calendarButtonElement }
+            target={ this._calendarButtonElement }
             directionalHint={ DirectionalHint.bottomLeftEdge }
             onDismiss={ this._onDismiss }
             setInitialFocus={ false }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts b/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
index 728bdab754de9..ce0a311970602 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
@@ -175,10 +175,4 @@ export interface ICalloutProps extends React.Props<Callout | CalloutContent> {
     * @deprecated
     */
   beakStyle?: string;
-
-  /**
-   * Deprecated at v0.72.1 and will no longer exist after 1.0 use target instead.
-   * @deprecated
-   */
-  targetElement?: HTMLElement;
 }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx b/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
index d19e8bc5a2606..83c9946b60768 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
@@ -86,31 +86,6 @@ describe('Callout', () => {
     expect(threwException).toEqual(false);
   });
 
-  // Once this has been deprecated completely in v1.0 this is no longer needed.
-  it('targetElement  HTMLElements does not throw exception', () => {
-    let targetElement = document.createElement('div');
-    document.body.appendChild(targetElement);
-    let threwException: boolean = false;
-    try {
-      ReactTestUtils.renderIntoDocument<HTMLDivElement>(
-        <div>
-          <Callout
-            targetElement={ targetElement }
-            directionalHint={ DirectionalHint.topLeftEdge }
-          >
-            <div>
-              Content
-            </div>
-          </Callout>
-        </div>
-      );
-    } catch (e) {
-      threwException = true;
-    }
-
-    expect(threwException).toEqual(false);
-  });
-
   it('without target does not throw exception', () => {
     let threwException: boolean = false;
     try {
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index d35efb1f93b12..d5fb86f3086ac 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -14,7 +14,7 @@ import {
   getWindow,
   getDocument
 } from '../../Utilities';
-import { getRelativePositions, IPositionInfo, IPositionProps, getMaxHeight } from '../../utilities/positioning';
+import { getRelativePositions, IPositionInfo, IPositionProps, getMaxHeight, ICalloutPositon } from '../../utilities/positioning';
 import { Popup } from '../../Popup';
 import * as stylesImport from './Callout.scss';
 import { AnimationClassNames, mergeStyles } from '../../Styling';
@@ -74,14 +74,14 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
   }
 
   public componentWillMount() {
-    let target = this.props.targetElement ? this.props.targetElement : this.props.target;
+    let target = this.props.target;
     this._setTargetWindowAndElement(target!);
   }
 
   public componentWillUpdate(newProps: ICalloutProps) {
     // If the target element changed, find the new one. If we are tracking target with class name, always find element because we do not know if fabric has rendered a new element and disposed the old element.
-    if (newProps.targetElement !== this.props.targetElement || newProps.target !== this.props.target || typeof (newProps.target) === 'string' || newProps.target instanceof String) {
-      let newTarget = newProps.targetElement ? newProps.targetElement : newProps.target;
+    if (newProps.target !== this.props.target || typeof (newProps.target) === 'string' || newProps.target instanceof String) {
+      let newTarget = newProps.target;
       this._maxHeight = undefined;
       this._setTargetWindowAndElement(newTarget!);
     }
@@ -110,7 +110,6 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       ariaLabelledBy,
       className,
       target,
-      targetElement,
       isBeakVisible,
       beakStyle,
       children,
@@ -128,19 +127,21 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
     }
 
     let beakReactStyle: React.CSSProperties = {
-      top: positions && positions.beakPosition ? positions.beakPosition.top : BEAK_ORIGIN_POSITION.top,
-      left: positions && positions.beakPosition ? positions.beakPosition.left : BEAK_ORIGIN_POSITION.left,
-      height: beakStyleWidth,
-      width: beakStyleWidth,
-      backgroundColor: backgroundColor,
+      ...(positions && positions.beakPosition ? positions.beakPosition.position : null),
     };
-
+    beakReactStyle.height = beakStyleWidth;
+    beakReactStyle.width = beakStyleWidth;
+    beakReactStyle.backgroundColor = backgroundColor;
+    if (!beakReactStyle.top && !beakReactStyle.bottom && !beakReactStyle.left && !beakReactStyle.right) {
+      beakReactStyle.left = BEAK_ORIGIN_POSITION.left;
+      beakReactStyle.top = BEAK_ORIGIN_POSITION.top;
+    }
     let directionalClassName = (positions && positions.directionalClassName)
       ? (AnimationClassNames as any)[positions.directionalClassName]
       : '';
 
     let contentMaxHeight: number = this._getMaxHeight() + this.state.heightOffset!;
-    let beakVisible = isBeakVisible && (!!targetElement || !!target);
+    let beakVisible = isBeakVisible && (!!target);
 
     let content = (
       <div
@@ -261,12 +262,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       let currentProps: IPositionProps | undefined;
       currentProps = assign(currentProps, this.props);
       currentProps!.bounds = this._getBounds();
-      // Temporary to be removed when targetElement is removed. Currently deprecated.
-      if (this.props.targetElement) {
-        currentProps!.targetElement = this._target as HTMLElement;
-      } else {
-        currentProps!.target = this._target!;
-      }
+      currentProps!.target = this._target!;
       let newPositions: IPositionInfo = getRelativePositions(currentProps!, hostElement, calloutElement);
 
       // Set the new position only when the positions are not exists or one of the new callout positions are different.
@@ -315,28 +311,32 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
         let gapSpace = this.props.gapSpace ? this.props.gapSpace : 0;
         this._maxHeight = getMaxHeight(this._target, this.props.directionalHint!, beakWidth! + gapSpace, this._getBounds());
       } else {
-        this._maxHeight = this._getBounds().height - BORDER_WIDTH * 2;
+        this._maxHeight = this._getBounds().height! - BORDER_WIDTH * 2;
       }
     }
-    return this._maxHeight;
+    return this._maxHeight!;
   }
 
   private _arePositionsEqual(positions: IPositionInfo, newPosition: IPositionInfo) {
-    if (positions.calloutPosition.top.toFixed(2) !== newPosition.calloutPosition.top.toFixed(2)) {
-      return false;
-    }
-    if (positions.calloutPosition.left.toFixed(2) !== newPosition.calloutPosition.left.toFixed(2)) {
-      return false;
-    }
-    if (positions.beakPosition.top.toFixed(2) !== newPosition.beakPosition.top.toFixed(2)) {
-      return false;
-    }
-    if (positions.beakPosition.left.toFixed(2) !== newPosition.beakPosition.left.toFixed(2)) {
-      return false;
-    }
+    return this._comparePositions(positions.calloutPosition, newPosition.calloutPosition) &&
+      this._comparePositions(positions.beakPosition.position, newPosition.beakPosition.position);
+  }
 
+  private _comparePositions(oldPositions: ICalloutPositon, newPositions: ICalloutPositon) {
+    for (const key in newPositions) {
+      // This needs to be checked here and below because there is a linting error if for in does not immediately have an if statement
+      if (newPositions.hasOwnProperty(key)) {
+        const oldPositionEdge = oldPositions[key];
+        const newPositionEdge = newPositions[key];
+
+        if (oldPositionEdge && newPositionEdge) {
+          if (oldPositionEdge.toFixed(2) !== newPositionEdge.toFixed(2)) {
+            return false;
+          }
+        }
+      }
+    }
     return true;
-
   }
 
   private _setTargetWindowAndElement(target: HTMLElement | string | MouseEvent): void {
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Basic.Example.tsx
index 8a5be8247ec16..0625c36557d48 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Basic.Example.tsx
@@ -40,7 +40,7 @@ export class CalloutBasicExample extends React.Component<any, ICalloutBaiscExamp
             ariaDescribedBy={ 'callout-description-1' }
             role={ 'alertdialog' }
             gapSpace={ 0 }
-            targetElement={ this._menuButtonElement }
+            target={ this._menuButtonElement }
             onDismiss={ this._onCalloutDismiss }
             setInitialFocus={ true }
           >
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
index 723ed6f3bc418..e9e0d2cf98220 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
@@ -10,20 +10,20 @@ export interface ICalloutCoverExampleState {
 }
 
 const DIRECTION_OPTIONS = [
-  { key: DirectionalHint[DirectionalHint.topLeftEdge], text: 'Top Left Edge' },
-  { key: DirectionalHint[DirectionalHint.topCenter], text: 'Top Center' },
-  { key: DirectionalHint[DirectionalHint.topRightEdge], text: 'Top Right Edge' },
-  { key: DirectionalHint[DirectionalHint.topAutoEdge], text: 'Top Auto Edge' },
-  { key: DirectionalHint[DirectionalHint.bottomLeftEdge], text: 'Bottom Left Edge' },
-  { key: DirectionalHint[DirectionalHint.bottomCenter], text: 'Bottom Center' },
-  { key: DirectionalHint[DirectionalHint.bottomRightEdge], text: 'Bottom Right Edge' },
-  { key: DirectionalHint[DirectionalHint.bottomAutoEdge], text: 'Bottom Auto Edge' },
-  { key: DirectionalHint[DirectionalHint.leftTopEdge], text: 'Left Top Edge' },
-  { key: DirectionalHint[DirectionalHint.leftCenter], text: 'Left Center' },
-  { key: DirectionalHint[DirectionalHint.leftBottomEdge], text: 'Left Bottom Edge' },
-  { key: DirectionalHint[DirectionalHint.rightTopEdge], text: 'Right Top Edge' },
-  { key: DirectionalHint[DirectionalHint.rightCenter], text: 'Right Center' },
-  { key: DirectionalHint[DirectionalHint.rightBottomEdge], text: 'Right Bottom Edge' },
+  { key: DirectionalHint.topLeftEdge, text: 'Top Left Edge' },
+  { key: DirectionalHint.topCenter, text: 'Top Center' },
+  { key: DirectionalHint.topRightEdge, text: 'Top Right Edge' },
+  { key: DirectionalHint.topAutoEdge, text: 'Top Auto Edge' },
+  { key: DirectionalHint.bottomLeftEdge, text: 'Bottom Left Edge' },
+  { key: DirectionalHint.bottomCenter, text: 'Bottom Center' },
+  { key: DirectionalHint.bottomRightEdge, text: 'Bottom Right Edge' },
+  { key: DirectionalHint.bottomAutoEdge, text: 'Bottom Auto Edge' },
+  { key: DirectionalHint.leftTopEdge, text: 'Left Top Edge' },
+  { key: DirectionalHint.leftCenter, text: 'Left Center' },
+  { key: DirectionalHint.leftBottomEdge, text: 'Left Bottom Edge' },
+  { key: DirectionalHint.rightTopEdge, text: 'Right Top Edge' },
+  { key: DirectionalHint.rightCenter, text: 'Right Center' },
+  { key: DirectionalHint.rightBottomEdge, text: 'Right Bottom Edge' },
 ];
 
 export class CalloutCoverExample extends React.Component<any, ICalloutCoverExampleState> {
@@ -50,7 +50,7 @@ export class CalloutCoverExample extends React.Component<any, ICalloutCoverExamp
         <div className='ms-CalloutExample-configArea'>
           <Dropdown
             label='Directional hint'
-            selectedKey={ DirectionalHint[directionalHint!] }
+            selectedKey={ directionalHint! }
             options={ DIRECTION_OPTIONS }
             onChanged={ this._onDirectionalChanged }
           />
@@ -65,7 +65,7 @@ export class CalloutCoverExample extends React.Component<any, ICalloutCoverExamp
           <Callout
             className='ms-CalloutExample-callout'
             onDismiss={ this._onDismiss }
-            targetElement={ this._menuButtonElement }
+            target={ this._menuButtonElement }
             directionalHint={ directionalHint }
             coverTarget={ true }
             isBeakVisible={ false }
@@ -102,7 +102,7 @@ export class CalloutCoverExample extends React.Component<any, ICalloutCoverExamp
 
   private _onDirectionalChanged(option: IDropdownOption) {
     this.setState({
-      directionalHint: (DirectionalHint as any)[option.key]
+      directionalHint: option.key as number
     });
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
index cd1abd5537659..155941132bf31 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
@@ -19,20 +19,20 @@ export interface ICalloutDirectionalExampleState {
 }
 
 const DIRECTION_OPTIONS = [
-  { key: DirectionalHint[DirectionalHint.topLeftEdge], text: 'Top Left Edge' },
-  { key: DirectionalHint[DirectionalHint.topCenter], text: 'Top Center' },
-  { key: DirectionalHint[DirectionalHint.topRightEdge], text: 'Top Right Edge' },
-  { key: DirectionalHint[DirectionalHint.topAutoEdge], text: 'Top Auto Edge' },
-  { key: DirectionalHint[DirectionalHint.bottomLeftEdge], text: 'Bottom Left Edge' },
-  { key: DirectionalHint[DirectionalHint.bottomCenter], text: 'Bottom Center' },
-  { key: DirectionalHint[DirectionalHint.bottomRightEdge], text: 'Bottom Right Edge' },
-  { key: DirectionalHint[DirectionalHint.bottomAutoEdge], text: 'Bottom Auto Edge' },
-  { key: DirectionalHint[DirectionalHint.leftTopEdge], text: 'Left Top Edge' },
-  { key: DirectionalHint[DirectionalHint.leftCenter], text: 'Left Center' },
-  { key: DirectionalHint[DirectionalHint.leftBottomEdge], text: 'Left Bottom Edge' },
-  { key: DirectionalHint[DirectionalHint.rightTopEdge], text: 'Right Top Edge' },
-  { key: DirectionalHint[DirectionalHint.rightCenter], text: 'Right Center' },
-  { key: DirectionalHint[DirectionalHint.rightBottomEdge], text: 'Right Bottom Edge' },
+  { key: DirectionalHint.topLeftEdge, text: 'Top Left Edge' },
+  { key: DirectionalHint.topCenter, text: 'Top Center' },
+  { key: DirectionalHint.topRightEdge, text: 'Top Right Edge' },
+  { key: DirectionalHint.topAutoEdge, text: 'Top Auto Edge' },
+  { key: DirectionalHint.bottomLeftEdge, text: 'Bottom Left Edge' },
+  { key: DirectionalHint.bottomCenter, text: 'Bottom Center' },
+  { key: DirectionalHint.bottomRightEdge, text: 'Bottom Right Edge' },
+  { key: DirectionalHint.bottomAutoEdge, text: 'Bottom Auto Edge' },
+  { key: DirectionalHint.leftTopEdge, text: 'Left Top Edge' },
+  { key: DirectionalHint.leftCenter, text: 'Left Center' },
+  { key: DirectionalHint.leftBottomEdge, text: 'Left Bottom Edge' },
+  { key: DirectionalHint.rightTopEdge, text: 'Right Top Edge' },
+  { key: DirectionalHint.rightCenter, text: 'Right Center' },
+  { key: DirectionalHint.rightBottomEdge, text: 'Right Bottom Edge' },
 ];
 
 export class CalloutDirectionalExample extends React.Component<any, ICalloutDirectionalExampleState> {
@@ -76,13 +76,14 @@ export class CalloutDirectionalExample extends React.Component<any, ICalloutDire
             />) }
           <Dropdown
             label='Directional hint'
-            selectedKey={ DirectionalHint[directionalHint!] }
+            selectedKey={ directionalHint! }
             options={ DIRECTION_OPTIONS }
             onChanged={ this._onDirectionalChanged }
           />
         </div>
         <div className='ms-CalloutExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton! }>
           <DefaultButton
+            className={ 'calloutExampleButton' }
             onClick={ this._onShowMenuClicked }
             text={ isCalloutVisible ? 'Hide callout' : 'Show callout' }
           />
@@ -91,7 +92,7 @@ export class CalloutDirectionalExample extends React.Component<any, ICalloutDire
           <Callout
             className='ms-CalloutExample-callout'
             gapSpace={ gapSpace }
-            targetElement={ this._menuButtonElement }
+            target={ this._menuButtonElement }
             isBeakVisible={ isBeakVisible }
             beakWidth={ beakWidth }
             onDismiss={ this._onCalloutDismiss }
@@ -100,13 +101,13 @@ export class CalloutDirectionalExample extends React.Component<any, ICalloutDire
             <div className='ms-CalloutExample-header'>
               <p className='ms-CalloutExample-title'>
                 All of your favorite people
-              </p>
+               </p>
             </div>
             <div className='ms-CalloutExample-inner'>
               <div className='ms-CalloutExample-content'>
                 <p className='ms-CalloutExample-subText'>
                   Message body is optional. If help documentation is available, consider adding a link to learn more at the bottom.
-                </p>
+                 </p>
               </div>
             </div>
           </Callout>
@@ -140,7 +141,7 @@ export class CalloutDirectionalExample extends React.Component<any, ICalloutDire
   @autobind
   private _onDirectionalChanged(option: IDropdownOption) {
     this.setState({
-      directionalHint: (DirectionalHint as any)[option.key]
+      directionalHint: option.key as number
     });
   }
 
@@ -157,4 +158,4 @@ export class CalloutDirectionalExample extends React.Component<any, ICalloutDire
       beakWidth: value
     });
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx
index 5014739846f14..4e1214f04549f 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx
@@ -39,7 +39,7 @@ export class CalloutNestedExample extends React.Component<any, ICalloutBaiscExam
               ariaLabelledBy={ 'callout-label-2' }
               className='ms-CalloutExample-callout'
               gapSpace={ 0 }
-              targetElement={ this._menuButtonElement }
+              target={ this._menuButtonElement }
               onDismiss={ this._onDismiss }
               setInitialFocus={ true }
             >
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/CalloutExample.scss b/packages/office-ui-fabric-react/src/components/Callout/examples/CalloutExample.scss
index 0893679f5b138..9069ba85aa2ef 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/CalloutExample.scss
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/CalloutExample.scss
@@ -81,4 +81,7 @@
     width: 100%;
     white-space: nowrap;
   }
+  .calloutExampleButton {
+    width: 100%;
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 4a81035a99d1b..b8d1595aa2212 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -765,7 +765,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         directionalHintFixed={ true }
         { ...calloutProps }
         className={ this._classNames.callout }
-        targetElement={ this._comboBoxWrapper }
+        target={ this._comboBoxWrapper }
         onDismiss={ this._onDismiss }
         setInitialFocus={ false }
       >
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 6b8a457f57fcc..4a1516cf32b5a 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -148,7 +148,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
             className={ css('ms-CommandBar-menuHost') }
             directionalHint={ DirectionalHint.bottomAutoEdge }
             { ...contextualMenuProps }
-            targetElement={ contextualMenuTarget }
+            target={ contextualMenuTarget }
             labelElementId={ expandedMenuId }
             onDismiss={ this._onContextMenuDismiss }
           />
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
index 6aa47964f540d..adfc9bc1d99c6 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
@@ -38,12 +38,6 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
    */
   target?: HTMLElement | string | MouseEvent;
 
-  /**
-   * Deprecated at version 0.72.1 and will no longer exist after 1.0 use 'target' instead.
-   * @deprecated
-   */
-  targetElement?: HTMLElement;
-
   /**
    * How the element should be positioned
    * @default DirectionalHint.bottomAutoEdge
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index eb665bd34152e..018697584f00a 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -129,15 +129,15 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   }
 
   public componentWillUpdate(newProps: IContextualMenuProps) {
-    if (newProps.targetElement !== this.props.targetElement || newProps.target !== this.props.target) {
-      let newTarget = newProps.targetElement ? newProps.targetElement : newProps.target;
+    if (newProps.target !== this.props.target) {
+      let newTarget = newProps.target;
       this._setTargetWindowAndElement(newTarget!);
     }
   }
 
   // Invoked once, both on the client and server, immediately before the initial rendering occurs.
   public componentWillMount() {
-    let target = this.props.targetElement ? this.props.targetElement : this.props.target;
+    let target = this.props.target;
     this._setTargetWindowAndElement(target!);
     this._previousActiveElement = this._targetWindow ? this._targetWindow.document.activeElement as HTMLElement : null;
   }
@@ -169,7 +169,6 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       items,
       isBeakVisible,
       labelElementId,
-      targetElement,
       id,
       targetPoint,
       useTargetPoint,
@@ -240,7 +239,6 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
         <Callout
           {...calloutProps}
           target={ target }
-          targetElement={ targetElement }
           targetPoint={ targetPoint }
           useTargetPoint={ useTargetPoint }
           isBeakVisible={ isBeakVisible }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
index b49a7ee5d1081..711b643c346f2 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
@@ -19,21 +19,20 @@ export interface IContextualMenuDirectionalExampleState {
   edgeFixed?: boolean;
 }
 
-const DIRECTION_OPTIONS = [
-  { key: DirectionalHint[DirectionalHint.topLeftEdge], text: 'Top Left Edge' },
-  { key: DirectionalHint[DirectionalHint.topCenter], text: 'Top Center' },
-  { key: DirectionalHint[DirectionalHint.topRightEdge], text: 'Top Right Edge' },
-  { key: DirectionalHint[DirectionalHint.topAutoEdge], text: 'Top Auto Edge' },
-  { key: DirectionalHint[DirectionalHint.bottomLeftEdge], text: 'Bottom Left Edge' },
-  { key: DirectionalHint[DirectionalHint.bottomCenter], text: 'Bottom Center' },
-  { key: DirectionalHint[DirectionalHint.bottomRightEdge], text: 'Bottom Right Edge' },
-  { key: DirectionalHint[DirectionalHint.bottomAutoEdge], text: 'Bottom Auto Edge' },
-  { key: DirectionalHint[DirectionalHint.leftTopEdge], text: 'Left Top Edge' },
-  { key: DirectionalHint[DirectionalHint.leftCenter], text: 'Left Center' },
-  { key: DirectionalHint[DirectionalHint.leftBottomEdge], text: 'Left Bottom Edge' },
-  { key: DirectionalHint[DirectionalHint.rightTopEdge], text: 'Right Top Edge' },
-  { key: DirectionalHint[DirectionalHint.rightCenter], text: 'Right Center' },
-  { key: DirectionalHint[DirectionalHint.rightBottomEdge], text: 'Right Bottom Edge' },
+const DIRECTION_OPTIONS = [{ key: DirectionalHint.topLeftEdge, text: 'Top Left Edge' },
+{ key: DirectionalHint.topCenter, text: 'Top Center' },
+{ key: DirectionalHint.topRightEdge, text: 'Top Right Edge' },
+{ key: DirectionalHint.topAutoEdge, text: 'Top Auto Edge' },
+{ key: DirectionalHint.bottomLeftEdge, text: 'Bottom Left Edge' },
+{ key: DirectionalHint.bottomCenter, text: 'Bottom Center' },
+{ key: DirectionalHint.bottomRightEdge, text: 'Bottom Right Edge' },
+{ key: DirectionalHint.bottomAutoEdge, text: 'Bottom Auto Edge' },
+{ key: DirectionalHint.leftTopEdge, text: 'Left Top Edge' },
+{ key: DirectionalHint.leftCenter, text: 'Left Center' },
+{ key: DirectionalHint.leftBottomEdge, text: 'Left Bottom Edge' },
+{ key: DirectionalHint.rightTopEdge, text: 'Right Top Edge' },
+{ key: DirectionalHint.rightCenter, text: 'Right Center' },
+{ key: DirectionalHint.rightBottomEdge, text: 'Right Bottom Edge' },
 ];
 
 export class ContextualMenuDirectionalExample extends React.Component<{}, IContextualMenuDirectionalExampleState> {
@@ -79,7 +78,7 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
           />
           <Dropdown
             label='Directional hint'
-            selectedKey={ DirectionalHint[directionalHint!] }
+            selectedKey={ directionalHint! }
             options={ DIRECTION_OPTIONS }
             onChanged={ this._onDirectionalChanged }
           />
@@ -89,7 +88,7 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
           { getRTL() &&
             <Dropdown
               label='Directional hint for RTL'
-              selectedKey={ DirectionalHint[directionalHintForRTL!] }
+              selectedKey={ directionalHintForRTL! }
               options={ DIRECTION_OPTIONS }
               onChanged={ this._onDirectionalRtlChanged }
               disabled={ !useDirectionalHintForRtl }
@@ -158,14 +157,14 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
   @autobind
   private _onDirectionalChanged(option: IDropdownOption) {
     this.setState({
-      directionalHint: (DirectionalHint as any)[option.key]
+      directionalHint: option.key as number
     });
   }
 
   @autobind
   private _onDirectionalRtlChanged(option: IDropdownOption) {
     this.setState({
-      directionalHintForRTL: (DirectionalHint as any)[option.key]
+      directionalHintForRTL: option.key as number
     });
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 4a8eeb4285164..310aeda8f35c0 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -223,7 +223,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
             className={ css('ms-DatePicker-callout') }
             gapSpace={ 0 }
             doNotLayer={ false }
-            targetElement={ this._datepicker }
+            target={ this._datepicker }
             directionalHint={ DirectionalHint.bottomLeftEdge }
             onDismiss={ this._calendarDismissed }
             onPositioned={ this._onCalloutPositioned }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
index 4b0409924d9bc..680420df54217 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
@@ -434,7 +434,7 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
     }
     return {
       items: items,
-      targetElement: ev.currentTarget as HTMLElement,
+      target: ev.currentTarget as HTMLElement,
       directionalHint: DirectionalHint.bottomLeftEdge,
       gapSpace: 10,
       isBeakVisible: true,
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 365d6a780cc02..bbb3116d53dd5 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -373,7 +373,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
             directionalHint={ DirectionalHint.bottomLeftEdge }
             { ...calloutProps }
             className={ css('ms-Dropdown-callout', styles.callout, calloutProps ? calloutProps.className : undefined) }
-            targetElement={ this._dropDown }
+            target={ this._dropDown }
             onDismiss={ this._onDismiss }
             onPositioned={ this._onPositioned }
             calloutWidth={ dropdownWidth || this._dropDown.clientWidth }
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
index 4195ce907880d..d45426408e57f 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
@@ -73,7 +73,7 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
           AnimationStyles.scaleUpIn100,
           this._styles.root
         ) }
-        targetElement={ targetElement }
+        target={ targetElement }
         isBeakVisible={ false }
         directionalHint={ this.props.directionalHint }
         directionalHintFixed={ true }
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
index f5e9608056aa0..dac3e47553102 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
@@ -41,7 +41,7 @@ export class TeachingBubble extends BaseComponent<ITeachingBubbleProps, ITeachin
       <Callout
         className={ css('ms-TeachingBubble', styles.root) }
         ref={ this._resolveRef('_callout') }
-        targetElement={ targetElement }
+        target={ targetElement }
         {...calloutProps}
       >
         <TeachingBubbleContent { ...this.props } />
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx
index 9f7ccc33d20ab..a5a749e7d3a8d 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx
@@ -42,7 +42,7 @@ export class TextFieldCustomRenderExample extends React.Component<any, any> {
         { isCalloutVisible && (
           <Callout
             className='ms-CustomRenderExample-callout'
-            targetElement={ this._iconButtonElement }
+            target={ this._iconButtonElement }
             onDismiss={ this._onDismiss }
           >
             <text> In additon to the label itself, this label includes an iconbutton which pops out more information in a callout</text>
diff --git a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
index ffd4e631f50f7..eb45cdda63745 100644
--- a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
@@ -85,7 +85,7 @@ export class ThemePage extends React.Component<any, any> {
             <Callout
               isBeakVisible={ false }
               gapSpace={ 10 }
-              targetElement={ colorPickerProps.targetElement }
+              target={ colorPickerProps.targetElement }
               onDismiss={ this._onPickerDismiss }
             >
 
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
index 04c92dd91fa10..401bc6463506d 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
@@ -133,7 +133,7 @@ export class ThemeGeneratorPage extends React.Component<any, IThemeGeneratorPage
           <Callout
             key={ colorPickerSlotRule.name }
             gapSpace={ 10 }
-            targetElement={ colorPickerElement }
+            target={ colorPickerElement }
             setInitialFocus={ true }
             onDismiss={ this._colorPickerOnDismiss }
           >
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
index 70f580c9dacd1..51786d97e7b79 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
@@ -50,8 +50,8 @@ export class Tooltip extends BaseComponent<ITooltipProps, any> {
           styles.root,
           (delay === TooltipDelay.medium) && styles.hasMediumDelay,
           (maxWidth !== null) && { maxWidth: maxWidth }
-        ) }
-        targetElement={ targetElement }
+        )}
+        target={ targetElement }
         directionalHint={ directionalHint }
         directionalHintForRTL={ directionalHintForRTL }
         {...calloutProps}
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 7dc82db548f42..db6111975fef4 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -201,7 +201,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
       <Callout
         isBeakVisible={ false }
         gapSpace={ 5 }
-        targetElement={ this.input.inputElement }
+        target={ this.input.inputElement }
         onDismiss={ this.dismissSuggestions }
         directionalHint={ getRTL() ? DirectionalHint.bottomRightEdge : DirectionalHint.bottomLeftEdge }
       >
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
index 4f9229871c827..10575a9825e42 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
@@ -57,7 +57,7 @@ export class SelectedItemWithMenu extends BaseComponent<IPeoplePickerItemWithMen
             <ContextualMenu
               items={ item.menuItems! }
               shouldFocusOnMount={ true }
-              targetElement={ this.refs.ellipsisRef }
+              target={ this.refs.ellipsisRef }
               onDismiss={ this._onCloseContextualMenu }
               directionalHint={ DirectionalHint.bottomAutoEdge }
             />)
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning.test.ts b/packages/office-ui-fabric-react/src/utilities/positioning.test.ts
index 098f225f8cc87..26cfc1b629ca7 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning.test.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning.test.ts
@@ -1,5 +1,5 @@
 import { Rectangle } from '../Utilities';
-import { positioningFunctions, RectangleEdge } from './positioning';
+import { positioningFunctions } from './positioning';
 import { DirectionalHint } from '../common/DirectionalHint';
 interface ITestValidation {
   callout: Rectangle;
@@ -20,83 +20,30 @@ function stringifyResults(expected: any, actual: any) {
 function positionCalloutTest(testValues: ITestValues, alignment: DirectionalHint, validate: ITestValidation) {
   let { callout, target, bounds, beakWidth } = testValues;
   let gap: number = positioningFunctions._calculateActualBeakWidthInPixels(beakWidth) / 2;
-  let result: positioningFunctions.ICallout = positioningFunctions._positionCalloutWithinBounds(callout, target, bounds, positioningFunctions._getPositionData(alignment, target, bounds), gap);
+  let result: positioningFunctions.ICallout = positioningFunctions._positionCalloutWithinBounds(callout, target, bounds, positioningFunctions._getPositionData(alignment), gap);
 
-  let beak: Rectangle = positioningFunctions._positionBeak(beakWidth, result, target, 0);
+  let beak = positioningFunctions._positionBeak(beakWidth, result, target, 0);
 
   expect(result.calloutRectangle).toEqual(validate.callout);
 
-  // Use `toBeCloseTo` because of how JS handles floating points
-  expect(beak.bottom).toBeCloseTo(validate.beak!.bottom);
-  expect(beak.left).toBeCloseTo(validate.beak!.left);
-  expect(beak.right).toBeCloseTo(validate.beak!.right);
-  expect(beak.top).toBeCloseTo(validate.beak!.top);
+  for (const key in beak) {
+    if (beak[key]) {
+      const beakValue = beak[key];
+      const validateBeakValue = (validate.beak as any)[key];
+      const beakGood = beakValue && validateBeakValue && beak[key] === beakValue;
+      expect(beakGood).toBe(true);
+    }
+  }
 }
 
 function validateNoBeakTest(testValues: ITestValues, alignment: DirectionalHint, validate: ITestValidation) {
   let { callout, target, bounds, beakWidth } = testValues;
-  let result: positioningFunctions.ICallout = positioningFunctions._positionCalloutWithinBounds(callout, target, bounds, positioningFunctions._getPositionData(alignment, target, bounds), beakWidth);
+  let result: positioningFunctions.ICallout = positioningFunctions._positionCalloutWithinBounds(callout, target, bounds, positioningFunctions._getPositionData(alignment), beakWidth);
 
   expect(result.calloutRectangle).toEqual(validate.callout);
 }
 
 describe('Callout Positioning', () => {
-
-  it('Gets correct percent along line', () => {
-
-    let result = positioningFunctions._calculatePointPercentAlongLine({ x: 0, y: 0 }, { x: 100, y: 0 }, 50);
-    expect(result.x).toBe(50);
-    expect(result.y).toBe(0);
-
-    result = positioningFunctions._calculatePointPercentAlongLine({ x: 0, y: 0 }, { x: 100, y: 0 }, 75);
-    expect(result.x).toBe(75);
-    expect(result.y).toBe(0);
-
-    result = positioningFunctions._calculatePointPercentAlongLine({ x: 0, y: 0 }, { x: 0, y: 100 }, 99);
-    expect(result.x).toBe(0);
-    expect(result.y).toBe(99);
-
-    result = positioningFunctions._calculatePointPercentAlongLine({ x: 0, y: 0 }, { x: 3, y: 0 }, 50);
-    expect(result.x).toBe(1.5);
-    expect(result.y).toBe(0);
-
-    result = positioningFunctions._calculatePointPercentAlongLine({ x: 0, y: 0 }, { x: 3, y: 0 }, 75);
-    expect(result.x).toBe(2.25);
-    expect(result.y).toBe(0);
-
-    result = positioningFunctions._calculatePointPercentAlongLine({ x: 0, y: 0 }, { x: 4, y: 0 }, 50);
-    expect(result.x).toBe(2);
-    expect(result.y).toBe(0);
-
-    result = positioningFunctions._calculatePointPercentAlongLine({ x: 0, y: 0 }, { x: 4, y: 0 }, 75);
-    expect(result.x).toBe(3);
-    expect(result.y).toBe(0);
-
-    result = positioningFunctions._calculatePointPercentAlongLine({ x: 0, y: 0 }, { x: 4, y: 0 }, 60);
-    expect(result.x).toBe(2.4);
-    expect(result.y).toBe(0);
-
-    result = positioningFunctions._calculatePointPercentAlongLine({ x: 0, y: 0 }, { x: 5, y: 0 }, 99);
-    expect(result.x).toBe(4.95);
-    expect(result.y).toBe(0);
-  });
-
-  it('Correctly recalculates percents', () => {
-    let targetRectangle = new Rectangle(200, 300, 200, 300);
-
-    let result = positioningFunctions._recalculateMatchingPercents(new Rectangle(0, 100, 300, 400), RectangleEdge.top, targetRectangle, RectangleEdge.bottom, 50);
-    expect(result).toBe(100);
-
-    result = positioningFunctions._recalculateMatchingPercents(new Rectangle(200, 300, 300, 400), RectangleEdge.top, targetRectangle, RectangleEdge.bottom, 50);
-    expect(result).toBe(50);
-
-    result = positioningFunctions._recalculateMatchingPercents(new Rectangle(200, 250, 300, 400), RectangleEdge.top, targetRectangle, RectangleEdge.bottom, 25);
-    expect(result).toBe(50);
-
-    result = positioningFunctions._recalculateMatchingPercents(new Rectangle(600, 900, 300, 400), RectangleEdge.top, targetRectangle, RectangleEdge.bottom, 50);
-    expect(result).toBe(0);
-  });
-
   it('Correctly positions the callout without beak', () => {
 
     let noBeakTestCase: ITestValues = {
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning.ts b/packages/office-ui-fabric-react/src/utilities/positioning.ts
index cc7c91df708f9..5a0316fa28047 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning.ts
@@ -1,17 +1,16 @@
 import { DirectionalHint } from '../common/DirectionalHint';
 import {
-  IRectangle,
-  assign,
   getScrollbarWidth,
-  Rectangle,
   getRTL,
+  Rectangle as FullRectangle,
+  IRectangle
 } from '../Utilities';
 
 export enum RectangleEdge {
-  top = 0,
-  bottom = 1,
+  top = 1,
+  bottom = -1,
   left = 2,
-  right = 3
+  right = -2
 }
 
 export enum Position {
@@ -21,22 +20,19 @@ export enum Position {
   end = 3
 }
 
-let SLIDE_ANIMATIONS: { [key: number]: string; } = {
+const SLIDE_ANIMATIONS: { [key: number]: string; } = {
   [RectangleEdge.top]: 'slideUpIn20',
   [RectangleEdge.bottom]: 'slideDownIn20',
   [RectangleEdge.left]: 'slideLeftIn20',
   [RectangleEdge.right]: 'slideRightIn20'
 };
 
-export interface IPositionProps {
+export class Rectangle extends FullRectangle {
+  [key: string]: number | boolean | any;
+}
 
+export interface IPositionProps {
   target?: HTMLElement | MouseEvent;
-
-  /** Deprecated at v1.0.0, use 'target' instead.
-   * @deprecated
-   */
-  targetElement?: HTMLElement;
-
   /** how the element should be positioned */
   directionalHint?: DirectionalHint;
 
@@ -57,25 +53,6 @@ export interface IPositionProps {
    */
   bounds?: IRectangle;
 
-  /**
-   * Deprecated at v1.0.0, use 'target' with event passed in.
-   * @deprecated
-   * @default null
-   */
-  creationEvent?: MouseEvent;
-
-  /**
-   * Deprecated at v1.0.0, use 'target' with event passed in.
-   * @deprecated
-   */
-  useTargetPoint?: boolean;
-
-  /**
-   * Deprecated at v1.0.0, use 'target' with event passed in.
-   * @deprecated
-   */
-  targetPoint?: IPoint;
-
   /** If true then the beak is visible. If false it will not be shown. */
   isBeakVisible?: boolean;
 
@@ -94,343 +71,75 @@ export interface IPositionProps {
 }
 
 export interface IPositionInfo {
-  calloutPosition: { top: number, left: number };
-  beakPosition: { top: number, left: number, display: string };
+  calloutPosition: ICalloutPositon;
+  beakPosition: { position: ICalloutPositon, display: string };
   directionalClassName: string;
   submenuDirection: DirectionalHint;
 }
 
+export interface ICalloutPositon {
+  top?: number;
+  left?: number;
+  bottom?: number;
+  right?: number;
+  [key: string]: number | undefined;
+}
+
 export interface IPoint {
   x: number;
   y: number;
 }
 
-export class PositionData {
-  public calloutDirection: RectangleEdge;
-  public targetDirection: RectangleEdge;
-  public calloutPercent: number;
-  public targetPercent: number;
-  public beakPercent: number;
-  public isAuto: boolean;
-
-  constructor(calloutDirection: RectangleEdge, targetDirection: RectangleEdge, calloutPercent: number, targetPercent: number, beakPercent: number, isAuto: boolean) {
-    this.calloutDirection = calloutDirection;
-    this.targetDirection = targetDirection;
-    this.calloutPercent = calloutPercent;
-    this.targetPercent = targetPercent;
-    this.beakPercent = beakPercent;
-    this.isAuto = isAuto;
-  }
+export interface IPositionData {
+  targetEdge: RectangleEdge;
+  alignmentEdge?: RectangleEdge;
+  isAuto?: boolean;
 }
 
-let MirrorDirectionalHintDictionary: { [key: number]: DirectionalHint } = {
-  [DirectionalHint.topLeftEdge]: DirectionalHint.topRightEdge,
-  [DirectionalHint.topCenter]: DirectionalHint.topCenter,
-  [DirectionalHint.topRightEdge]: DirectionalHint.topLeftEdge,
-  [DirectionalHint.topAutoEdge]: DirectionalHint.topAutoEdge,
-  [DirectionalHint.bottomLeftEdge]: DirectionalHint.bottomRightEdge,
-  [DirectionalHint.bottomCenter]: DirectionalHint.bottomCenter,
-  [DirectionalHint.bottomRightEdge]: DirectionalHint.bottomLeftEdge,
-  [DirectionalHint.bottomAutoEdge]: DirectionalHint.bottomAutoEdge,
-  [DirectionalHint.leftTopEdge]: DirectionalHint.rightTopEdge,
-  [DirectionalHint.leftCenter]: DirectionalHint.rightCenter,
-  [DirectionalHint.leftBottomEdge]: DirectionalHint.rightBottomEdge,
-  [DirectionalHint.rightTopEdge]: DirectionalHint.leftTopEdge,
-  [DirectionalHint.rightCenter]: DirectionalHint.leftCenter,
-  [DirectionalHint.rightBottomEdge]: DirectionalHint.leftBottomEdge,
-};
+function _createPositionData(
+  targetEdge: RectangleEdge,
+  alignmentEdge?: RectangleEdge,
+  isAuto?: boolean): IPositionData {
+  return {
+    targetEdge: targetEdge,
+    alignmentEdge: alignmentEdge,
+    isAuto: isAuto
+  };
+}
 
 // Currently the beakPercent is set to 50 for all positions meaning that it should tend to the center of the target
-let DirectionalDictionary: { [key: number]: PositionData } = {
-  [DirectionalHint.topLeftEdge]: new PositionData(RectangleEdge.bottom, RectangleEdge.top, 0, 0, 50, false),
-  [DirectionalHint.topCenter]: new PositionData(RectangleEdge.bottom, RectangleEdge.top, 50, 50, 50, false),
-  [DirectionalHint.topRightEdge]: new PositionData(RectangleEdge.bottom, RectangleEdge.top, 100, 100, 50, false),
-  [DirectionalHint.topAutoEdge]: new PositionData(RectangleEdge.bottom, RectangleEdge.top, 0, 0, 50, true),
-  [DirectionalHint.bottomLeftEdge]: new PositionData(RectangleEdge.top, RectangleEdge.bottom, 0, 0, 50, false),
-  [DirectionalHint.bottomCenter]: new PositionData(RectangleEdge.top, RectangleEdge.bottom, 50, 50, 50, false),
-  [DirectionalHint.bottomRightEdge]: new PositionData(RectangleEdge.top, RectangleEdge.bottom, 100, 100, 50, false),
-  [DirectionalHint.bottomAutoEdge]: new PositionData(RectangleEdge.top, RectangleEdge.bottom, 0, 0, 50, true),
-  [DirectionalHint.leftTopEdge]: new PositionData(RectangleEdge.right, RectangleEdge.left, 0, 0, 50, false),
-  [DirectionalHint.leftCenter]: new PositionData(RectangleEdge.right, RectangleEdge.left, 50, 50, 50, false),
-  [DirectionalHint.leftBottomEdge]: new PositionData(RectangleEdge.right, RectangleEdge.left, 100, 100, 50, false),
-  [DirectionalHint.rightTopEdge]: new PositionData(RectangleEdge.left, RectangleEdge.right, 0, 0, 50, false),
-  [DirectionalHint.rightCenter]: new PositionData(RectangleEdge.left, RectangleEdge.right, 50, 50, 50, false),
-  [DirectionalHint.rightBottomEdge]: new PositionData(RectangleEdge.left, RectangleEdge.right, 100, 100, 50, false)
-};
-
-let CoverDictionary: { [key: number]: PositionData } = {
-  [DirectionalHint.topLeftEdge]: new PositionData(RectangleEdge.top, RectangleEdge.top, 0, 0, 50, false),
-  [DirectionalHint.topCenter]: new PositionData(RectangleEdge.top, RectangleEdge.top, 50, 50, 50, false),
-  [DirectionalHint.topRightEdge]: new PositionData(RectangleEdge.top, RectangleEdge.top, 100, 100, 50, false),
-  [DirectionalHint.topAutoEdge]: new PositionData(RectangleEdge.top, RectangleEdge.top, 0, 0, 50, true),
-  [DirectionalHint.bottomLeftEdge]: new PositionData(RectangleEdge.bottom, RectangleEdge.bottom, 0, 0, 50, false),
-  [DirectionalHint.bottomCenter]: new PositionData(RectangleEdge.bottom, RectangleEdge.bottom, 50, 50, 50, false),
-  [DirectionalHint.bottomRightEdge]: new PositionData(RectangleEdge.bottom, RectangleEdge.bottom, 100, 100, 50, false),
-  [DirectionalHint.bottomAutoEdge]: new PositionData(RectangleEdge.bottom, RectangleEdge.bottom, 0, 0, 50, true),
-  [DirectionalHint.leftTopEdge]: new PositionData(RectangleEdge.left, RectangleEdge.left, 0, 0, 50, false),
-  [DirectionalHint.leftCenter]: new PositionData(RectangleEdge.left, RectangleEdge.left, 50, 50, 50, false),
-  [DirectionalHint.leftBottomEdge]: new PositionData(RectangleEdge.left, RectangleEdge.left, 100, 100, 50, false),
-  [DirectionalHint.rightTopEdge]: new PositionData(RectangleEdge.right, RectangleEdge.right, 0, 0, 50, false),
-  [DirectionalHint.rightCenter]: new PositionData(RectangleEdge.right, RectangleEdge.right, 50, 50, 50, false),
-  [DirectionalHint.rightBottomEdge]: new PositionData(RectangleEdge.right, RectangleEdge.right, 100, 100, 50, false)
-};
-
-let OppositeEdgeDictionary: { [key: number]: number } = {
-  [RectangleEdge.top]: RectangleEdge.bottom,
-  [RectangleEdge.bottom]: RectangleEdge.top,
-  [RectangleEdge.right]: RectangleEdge.left,
-  [RectangleEdge.left]: RectangleEdge.right,
+let DirectionalDictionary: { [key: number]: IPositionData } = {
+  [DirectionalHint.topLeftEdge]: _createPositionData(RectangleEdge.top, RectangleEdge.left),
+  [DirectionalHint.topCenter]: _createPositionData(RectangleEdge.top),
+  [DirectionalHint.topRightEdge]: _createPositionData(RectangleEdge.top, RectangleEdge.right),
+  [DirectionalHint.topAutoEdge]: _createPositionData(RectangleEdge.top, undefined, true),
+  [DirectionalHint.bottomLeftEdge]: _createPositionData(RectangleEdge.bottom, RectangleEdge.left),
+  [DirectionalHint.bottomCenter]: _createPositionData(RectangleEdge.bottom),
+  [DirectionalHint.bottomRightEdge]: _createPositionData(RectangleEdge.bottom, RectangleEdge.right),
+  [DirectionalHint.bottomAutoEdge]: _createPositionData(RectangleEdge.bottom, undefined, true),
+  [DirectionalHint.leftTopEdge]: _createPositionData(RectangleEdge.left, RectangleEdge.top),
+  [DirectionalHint.leftCenter]: _createPositionData(RectangleEdge.left),
+  [DirectionalHint.leftBottomEdge]: _createPositionData(RectangleEdge.left, RectangleEdge.bottom),
+  [DirectionalHint.rightTopEdge]: _createPositionData(RectangleEdge.right, RectangleEdge.top),
+  [DirectionalHint.rightCenter]: _createPositionData(RectangleEdge.right),
+  [DirectionalHint.rightBottomEdge]: _createPositionData(RectangleEdge.right, RectangleEdge.bottom)
 };
 
 export module positioningFunctions {
 
   export interface ICallout {
     calloutRectangle: Rectangle;
-    calloutEdge: RectangleEdge;
     targetEdge: RectangleEdge;
-    alignPercent: number;
-    beakPercent: number;
-  }
-
-  /**
-   * If max height is less than zero it returns the bounds height instead.
-   */
-  export function _getMaxHeightFromTargetRectangle(targetRectangle: Rectangle, targetEdge: DirectionalHint, gapSpace: number, bounds: Rectangle) {
-    let maxHeight = 0;
-
-    switch (targetEdge) {
-      case DirectionalHint.bottomAutoEdge:
-      case DirectionalHint.bottomCenter:
-      case DirectionalHint.bottomLeftEdge:
-      case DirectionalHint.bottomRightEdge:
-        maxHeight = bounds.bottom - targetRectangle.bottom - gapSpace;
-        break;
-      case DirectionalHint.topAutoEdge:
-      case DirectionalHint.topCenter:
-      case DirectionalHint.topLeftEdge:
-      case DirectionalHint.topRightEdge:
-        maxHeight = targetRectangle.top - bounds.top - gapSpace;
-        break;
-      default:
-        maxHeight = bounds.bottom - targetRectangle.top - gapSpace;
-        break;
-    }
-
-    return maxHeight > 0 ? maxHeight : bounds.height;
+    alignmentEdge: RectangleEdge | undefined;
   }
 
-  export function _getTargetRect(bounds: Rectangle, target: HTMLElement | MouseEvent) {
-    let targetRectangle: Rectangle;
-
-    if ((target as MouseEvent).preventDefault) {
-      let ev: MouseEvent = target as MouseEvent;
-      targetRectangle = new Rectangle(ev.clientX, ev.clientX, ev.clientY, ev.clientY);
-    } else {
-      targetRectangle = _getRectangleFromHTMLElement(target as HTMLElement);
-    }
-
-    if (!_isRectangleWithinBounds(targetRectangle, bounds)) {
-      let outOfBounds: RectangleEdge[] = _getOutOfBoundsEdges(targetRectangle, bounds);
+  export type PartialIRectangle = Partial<IRectangle>;
 
-      for (let direction of outOfBounds) {
-        (targetRectangle as any)[RectangleEdge[direction]] = (bounds as any)[RectangleEdge[direction]];
-      }
-    }
-
-    return targetRectangle;
+  export interface IPartialIRectangle extends PartialIRectangle {
+    [key: string]: number | undefined;
   }
 
-  export function _getTargetRectDEPRECATED(bounds: Rectangle, targetElement?: HTMLElement, ev?: MouseEvent, targetPoint?: IPoint, isTargetPoint?: boolean): Rectangle {
-    let targetRectangle: Rectangle;
-
-    if (isTargetPoint) {
-      if (targetPoint) {
-        targetRectangle = new Rectangle(targetPoint.x, targetPoint.x, targetPoint.y, targetPoint.y);
-      } else {
-        let event = ev as MouseEvent;
-        targetRectangle = new Rectangle(event.clientX, event.clientX, event.clientY, event.clientY);
-      }
-    } else {
-      if (!targetElement) {
-        if (ev && ev.target) {
-          targetRectangle = _getRectangleFromHTMLElement(ev.target as HTMLElement);
-        }
-
-        targetRectangle = new Rectangle();
-      } else {
-        targetRectangle = _getRectangleFromHTMLElement(targetElement);
-      }
-    }
-
-    if (!_isRectangleWithinBounds(targetRectangle, bounds)) {
-      let outOfBounds: RectangleEdge[] = _getOutOfBoundsEdges(targetRectangle, bounds);
-
-      for (let direction of outOfBounds) {
-        (targetRectangle as any)[RectangleEdge[direction]] = (bounds as any)[RectangleEdge[direction]];
-      }
-    }
-
-    return targetRectangle;
-  }
-
-  export function _getRectangleFromHTMLElement(element: HTMLElement): Rectangle {
-    let clientRect: ClientRect = element.getBoundingClientRect();
-
-    return new Rectangle(clientRect.left, clientRect.right, clientRect.top, clientRect.bottom);
-  }
-
-  export function _positionCalloutWithinBounds(
-    calloutRectangle: Rectangle,
-    targetRectangle: Rectangle,
-    boundingRectangle: Rectangle,
-    directionalInfo: PositionData,
-    gap: number = 0,
-    coverTarget?: boolean,
-    directionalHintFixed?: boolean): ICallout {
-    let estimatedRectangle: Rectangle = _moveRectangleToAnchorRectangle(calloutRectangle,
-      directionalInfo.calloutDirection,
-      directionalInfo.calloutPercent,
-      targetRectangle,
-      directionalInfo.targetDirection,
-      directionalInfo.targetPercent,
-      gap);
-
-    if (_isRectangleWithinBounds(estimatedRectangle, boundingRectangle)) {
-      return { calloutRectangle: estimatedRectangle, calloutEdge: directionalInfo.calloutDirection, targetEdge: directionalInfo.targetDirection, alignPercent: directionalInfo.calloutPercent, beakPercent: directionalInfo.beakPercent };
-    } else {
-      return _getBestRectangleFitWithinBounds(
-        estimatedRectangle,
-        targetRectangle,
-        boundingRectangle,
-        directionalInfo,
-        gap,
-        coverTarget,
-        directionalHintFixed);
-    }
-  }
-
-  export function _getBestRectangleFitWithinBounds(
-    estimatedPosition: Rectangle,
-    targetRectangle: Rectangle,
-    boundingRectangle: Rectangle,
-    directionalInfo: PositionData,
-    gap: number,
-    coverTarget?: boolean,
-    directionalHintFixed?: boolean): ICallout {
-    let callout: ICallout = {
-      calloutRectangle: estimatedPosition,
-      calloutEdge: directionalInfo.calloutDirection,
-      targetEdge: directionalInfo.targetDirection,
-      alignPercent: directionalInfo.calloutPercent,
-      beakPercent: directionalInfo.beakPercent
-    };
-
-    // If it can't possibly fit within the bounds just put it into it's initial position.
-    if (!_canRectangleFitWithinBounds(estimatedPosition, boundingRectangle)) {
-      return callout;
-    }
-
-    if (!coverTarget && !directionalHintFixed) {
-      callout = _flipRectangleToFit(
-        callout,
-        targetRectangle,
-        directionalInfo.targetPercent,
-        boundingRectangle,
-        gap);
-    }
-
-    let outOfBounds: RectangleEdge[] = _getOutOfBoundsEdges(callout.calloutRectangle, boundingRectangle);
-
-    for (let direction of outOfBounds) {
-      callout.calloutRectangle = _alignEdgeToCoordinate(
-        callout.calloutRectangle,
-        (boundingRectangle as any)[RectangleEdge[direction]],
-        direction);
-      let adjustedPercent: number = _recalculateMatchingPercents(
-        callout.calloutRectangle,
-        callout.targetEdge,
-        targetRectangle,
-        callout.targetEdge,
-        directionalInfo.targetPercent);
-
-      callout.alignPercent = adjustedPercent;
-    }
-
-    return callout;
-  }
-
-  export function _positionBeak(beakWidth: number, callout: ICallout, targetRectangle: Rectangle, border: number): Rectangle {
-    let calloutRect: Rectangle = new Rectangle(
-      0,
-      callout.calloutRectangle.width - border * 2,
-      0,
-      callout.calloutRectangle.height - border * 2);
-    let beakRectangle: Rectangle = new Rectangle(0, beakWidth, 0, beakWidth);
-    let recalculatedPercent: number = _recalculateMatchingPercents(
-      callout.calloutRectangle,
-      callout.calloutEdge,
-      targetRectangle,
-      callout.targetEdge,
-      callout.beakPercent);
-    let estimatedTargetPoint: IPoint = _getPointOnEdgeFromPercent(calloutRect, callout.calloutEdge, recalculatedPercent);
-
-    return _finalizeBeakPosition(beakRectangle, callout, estimatedTargetPoint, border);
-  }
-
-  export function _finalizeBeakPosition(beakRectangle: Rectangle, callout: ICallout, estimatedTargetPoint: IPoint, border: number): Rectangle {
-    let beakPixelSize: number = _calculateActualBeakWidthInPixels(beakRectangle.width) / 2;
-    let innerRect: Rectangle | null = null;
-    let beakPoint: IPoint = { x: beakRectangle.width / 2, y: beakRectangle.width / 2 };
-
-    if (callout.calloutEdge === RectangleEdge.bottom || callout.calloutEdge === RectangleEdge.top) {
-      innerRect = new Rectangle(beakPixelSize, callout.calloutRectangle.width - beakPixelSize - border * 2, 0, callout.calloutRectangle.height - border * 2);
-    } else {
-      innerRect = new Rectangle(0, callout.calloutRectangle.width - border * 2, beakPixelSize, callout.calloutRectangle.height - beakPixelSize - border * 2);
-    }
-
-    let finalPoint: IPoint = _getClosestPointOnEdgeToPoint(innerRect, callout.calloutEdge, estimatedTargetPoint);
-
-    return _movePointOnRectangleToPoint(beakRectangle, beakPoint, finalPoint);
-  }
-
-  export function _getRectangleFromIRect(rect: IRectangle): Rectangle {
-    return new Rectangle(rect.left, rect.right, rect.top, rect.bottom);
-  }
-
-  export function _finalizeCalloutPosition(calloutRectangle: Rectangle, hostElement: HTMLElement): Rectangle {
-    let hostRect: Rectangle = _getRectangleFromHTMLElement(hostElement);
-    let topPosition = calloutRectangle.top - hostRect.top;
-    let leftPosition = calloutRectangle.left - hostRect.left;
-
-    return new Rectangle(leftPosition, leftPosition + calloutRectangle.width, topPosition, topPosition + calloutRectangle.height);
-  }
-
-  /**
-   * Finds the percent on the recalculateRect that matches the percent on the target rect based on position.
-   */
-  export function _recalculateMatchingPercents(recalculateRect: Rectangle, rectangleEdge: RectangleEdge, targetRect: Rectangle, targetEdge: RectangleEdge, targetPercent: number): number {
-    let targetPoint: IPoint = _getPointOnEdgeFromPercent(targetRect, targetEdge, targetPercent);
-    let adjustedPoint: IPoint = _getClosestPointOnEdgeToPoint(recalculateRect, rectangleEdge, targetPoint);
-    let adjustedPercent: number = _getPercentOfEdgeFromPoint(recalculateRect, rectangleEdge, adjustedPoint);
-
-    if (adjustedPercent > 100) {
-      adjustedPercent = 100;
-    } else if (adjustedPercent < 0) {
-      adjustedPercent = 0;
-    }
-
-    return adjustedPercent;
-  }
-
-  export function _canRectangleFitWithinBounds(rect: Rectangle, boundingRect: Rectangle): boolean {
-    if (rect.width > boundingRect.width || rect.height > boundingRect.height) {
-      return false;
-    }
-
-    return true;
-  }
-
-  export function _isRectangleWithinBounds(rect: Rectangle, boundingRect: Rectangle): boolean {
+  function _isRectangleWithinBounds(rect: Rectangle, boundingRect: Rectangle): boolean {
     if (rect.top < boundingRect.top) {
       return false;
     }
@@ -451,7 +160,7 @@ export module positioningFunctions {
    * Gets all of the edges of a rectangle that are outside of the given bounds.
    * If there are no out of bounds edges it returns an empty array.
    */
-  export function _getOutOfBoundsEdges(rect: Rectangle, boundingRect: Rectangle): RectangleEdge[] {
+  function _getOutOfBoundsEdges(rect: Rectangle, boundingRect: Rectangle): RectangleEdge[] {
     let outOfBounds: RectangleEdge[] = new Array<RectangleEdge>();
 
     if (rect.top < boundingRect.top) {
@@ -470,177 +179,316 @@ export module positioningFunctions {
     return outOfBounds;
   }
 
+  function _getEdgeValue(rect: Rectangle, edge: RectangleEdge): number {
+    return rect[RectangleEdge[edge]];
+  }
+
+  function _setEdgeValue(rect: Rectangle, edge: RectangleEdge, value: number) {
+    rect[RectangleEdge[edge]] = value;
+    return rect;
+  }
+
   /**
-   * Returns a point on a edge that is x% of the way down it.
+   * Returns the middle value of an edge. Only returns 1 value rather than xy coordinates as
+   * the itself already contains the other coordinate.
+   * For instance, a bottom edge's current value is it's y coordinate, so the number returned is the x.
+   *
+   * @param {Rectangle} rect
+   * @param {RectangleEdge} edge
+   * @returns {number}
    */
-  export function _getPointOnEdgeFromPercent(rect: Rectangle, direction: RectangleEdge, percentOfRect: number): IPoint {
-    let startPoint: IPoint;
-    let endPoint: IPoint;
-
-    switch (direction) {
-      case RectangleEdge.top:
-        startPoint = { x: rect.left, y: rect.top };
-        endPoint = { x: rect.right, y: rect.top };
-        break;
-      case RectangleEdge.left:
-        startPoint = { x: rect.left, y: rect.top };
-        endPoint = { x: rect.left, y: rect.bottom };
-        break;
-      case RectangleEdge.right:
-        startPoint = { x: rect.right, y: rect.top };
-        endPoint = { x: rect.right, y: rect.bottom };
-        break;
-      case RectangleEdge.bottom:
-        startPoint = { x: rect.left, y: rect.bottom };
-        endPoint = { x: rect.right, y: rect.bottom };
-        break;
-      default:
-        startPoint = { x: 0, y: 0 };
-        endPoint = { x: 0, y: 0 };
-        break;
-    }
-
-    return _calculatePointPercentAlongLine(startPoint, endPoint, percentOfRect);
+  function _getCenterValue(rect: Rectangle, edge: RectangleEdge): number {
+    const edges = _getFlankingEdges(edge);
+    return (_getEdgeValue(rect, edges.firstEdge) + _getEdgeValue(rect, edges.secondEdge)) / 2;
   }
 
   /**
-   * Gets the percent down an edge that a point appears.
+   * Flips the value depending on the edge.
+   * If the edge is a "positive" edge, Top or Left, then the value should stay as it is.
+   * If the edge is a "negative" edge, Bottom or Right, then the value should be flipped.
+   * This is to account for the fact that the coordinates are effectively reveserved in certain cases for the "negative" edges.
+   * For example, when testing to see if a bottom edge 1 is within the bounds of another bottom edge 2.
+   * If edge 1 is greater than edge 2 then it is out of bounds. This is reversed for top edge 1 and top edge 2.
+   * If top edge 1 is less than edge 2 then it is out of bounds.
+   *
+   *
+   * @param {RectangleEdge} edge
+   * @param {number} value
+   * @returns {number}
    */
-  export function _getPercentOfEdgeFromPoint(rect: Rectangle, direction: RectangleEdge, valueOnEdge: IPoint): number {
-    switch (direction) {
-      case RectangleEdge.top:
-      case RectangleEdge.bottom:
+  function _getRelativeEdgeValue(edge: RectangleEdge, value: number): number {
+    if (edge > 0) {
+      return value;
+    } else {
+      return value * -1;
+    }
+  }
 
-        return rect.width !== 0 ? (valueOnEdge.x - rect.left) / rect.width * 100 : 100;
-      case RectangleEdge.left:
-      case RectangleEdge.right:
+  function _getRelativeRectEdgeValue(edge: RectangleEdge, rect: Rectangle): number {
+    return _getRelativeEdgeValue(edge, _getEdgeValue(rect, edge));
+  }
 
-        return rect.height !== 0 ? (valueOnEdge.y - rect.top) / rect.height * 100 : 100;
-    }
+  function _getRelativeEdgeDifference(rect: Rectangle, hostRect: Rectangle, edge: RectangleEdge): number {
+    const edgeDifference = _getEdgeValue(rect, edge) - _getEdgeValue(hostRect, edge);
+    return _getRelativeEdgeValue(edge, edgeDifference);
+  }
+
+  /**
+   * Moves the edge of a rectangle to the value given. It only moves the edge in a linear direction based on that edge.
+   * For example, if it's a bottom edge it will only change y coordinates.
+   *
+   * @param {Rectangle} rect
+   * @param {RectangleEdge} edge
+   * @param {number} newValue
+   * @returns {Rectangle}
+   */
+  function _moveEdge(rect: Rectangle, edge: RectangleEdge, newValue: number): Rectangle {
+    const difference = _getEdgeValue(rect, edge) - newValue;
+    rect = _setEdgeValue(rect, edge, newValue);
+    rect = _setEdgeValue(rect, edge * -1, _getEdgeValue(rect, edge * -1) - difference);
+    return rect;
   }
 
   /**
-   * Percent is based on distance from left to right or up to down. 0% would be left most, 100% would be right most.
+   * Aligns the edge on the passed in rect to the target. If there is a gap then it will have that space between the two.
+   *
+   * @param {Rectangle} rect
+   * @param {Rectangle} target
+   * @param {RectangleEdge} edge
+   * @param {number} [gap=0]
+   * @returns {Rectangle}
    */
-  export function _calculatePointPercentAlongLine(startPoint: IPoint, endPoint: IPoint, percent: number): IPoint {
-    let x: number = startPoint.x + ((endPoint.x - startPoint.x) * percent / 100);
-    let y: number = startPoint.y + ((endPoint.y - startPoint.y) * percent / 100);
+  function _alignEdges(rect: Rectangle, target: Rectangle, edge: RectangleEdge, gap: number = 0): Rectangle {
+    return _moveEdge(rect, edge, _getEdgeValue(target, edge) + _getRelativeEdgeValue(edge, gap));
+  }
 
-    return { x: x, y: y };
+  /**
+   * Aligns the targetEdge on the passed in target to the rects corresponding opposite edge.
+   * For instance if targetEdge is bottom, then the rects top will be moved to match it.
+   *
+   * @param {Rectangle} rect
+   * @param {Rectangle} target
+   * @param {RectangleEdge} targetEdge
+   * @param {number} [gap=0]
+   * @returns {Rectangle}
+   */
+  function _alignOppositeEdges(rect: Rectangle, target: Rectangle, targetEdge: RectangleEdge, gap: number = 0): Rectangle {
+    const oppositeEdge = targetEdge * -1;
+    const adjustedGap = _getRelativeEdgeValue(oppositeEdge, gap);
+    return _moveEdge(rect, targetEdge * -1, _getEdgeValue(target, targetEdge) + adjustedGap);
   }
 
-  export function _moveTopLeftOfRectangleToPoint(rect: Rectangle, destination: IPoint): Rectangle {
-    return new Rectangle(destination.x,
-      destination.x + rect.width,
-      destination.y,
-      destination.y + rect.height);
+  /**
+   * Tests to see if the given edge is within the bounds of the given rectangle.
+   *
+   * @param {Rectangle} rect
+   * @param {Rectangle} bounds
+   * @param {RectangleEdge} edge
+   * @returns {boolean}
+   */
+  function _isEdgeInBounds(rect: Rectangle, bounds: Rectangle, edge: RectangleEdge): boolean {
+    const adjustedRectValue = _getRelativeRectEdgeValue(edge, rect);
+    // The adjusted value must be reversed to determine if it is within the bounds.
+    // Take these two examples:
+    // Top is out of bounds with -4 as value. Top is not reversed in _getRelativeRectEdgeValue. -4 * -1 = 4
+    // 4 is not less than the bounds of 0, so it must be out of bounds.
+    // Bottom is out of bounds with 5 as value, bounds bottom is 4. Bottom is reversed in _getRelaitveRectEdgeValue.
+    // Bottom is now -5. Bottom * -1 is now 5. 5 is greater than bounds bottom of 4, so it must be out of bounds.
+    return adjustedRectValue * -1 < _getEdgeValue(bounds, edge);
   }
 
   /**
-   * Aligns the given edge to the target coordinate.
+   * Attempts to move the rectangle through various sides of the target to find a place to fit.
+   * If no fit is found, the original position should be returned.
+   *
+   * @param {Rectangle} rect
+   * @param {Rectangle} target
+   * @param {Rectangle} bounding
+   * @param {IPositionData} positionData
+   * @param {number} [gap=0]
+   * @returns {ICallout}
    */
-  export function _alignEdgeToCoordinate(rect: Rectangle, coordinate: number, direction: RectangleEdge): Rectangle {
-    switch (direction) {
-      case RectangleEdge.top:
+  function _flipToFit(rect: Rectangle, target: Rectangle, bounding: Rectangle, positionData: IPositionData, gap: number = 0, ): ICallout {
+    let directions: RectangleEdge[] = [RectangleEdge.left, RectangleEdge.right, RectangleEdge.bottom, RectangleEdge.top];
+    let currentEstimate = rect;
+    let currentEdge = positionData.targetEdge;
+    let currentAlignment = positionData.alignmentEdge;
+    // Keep switching sides until one is found with enough space. If all sides don't fit then return the unmodified callout.
+    for (let i = 0; i < 4; i++) {
+      if (!_isEdgeInBounds(currentEstimate, bounding, currentEdge)) {
+        directions.splice(directions.indexOf(currentEdge), 1);
+        if (directions.indexOf(currentEdge * -1) > -1) {
+          currentEdge = currentEdge * -1;
+        } else {
+          currentAlignment = currentEdge;
+          currentEdge = directions.slice(-1)[0];
+        }
+        currentEstimate = _estimatePosition(rect, target, { targetEdge: currentEdge, alignmentEdge: currentAlignment }, gap);
+      } else {
+        return {
+          calloutRectangle: currentEstimate,
+          targetEdge: currentEdge,
+          alignmentEdge: currentAlignment
+        };
+      }
+    }
+    return {
+      calloutRectangle: rect,
+      targetEdge: positionData.targetEdge,
+      alignmentEdge: currentAlignment
+    };
+  }
 
-        return _moveTopLeftOfRectangleToPoint(rect, { x: rect.left, y: coordinate });
-      case RectangleEdge.bottom:
+  /**
+   * Adjusts a callout rectangle to fit within the bounds given. If directionalHintFixed or covertarget is passed in
+   * then the callout will not flip sides on the target. They will, however, be nudged to fit within the bounds given.
+   *
+   * @param {Rectangle} callout
+   * @param {Rectangle} target
+   * @param {Rectangle} bounding
+   * @param {IPositionData} positionData
+   * @param {number} [gap=0]
+   * @param {boolean} [directionalHintFixed]
+   * @param {boolean} [coverTarget]
+   * @returns {ICallout}
+   */
+  function _adjustFitWithinBounds(
+    callout: Rectangle,
+    target: Rectangle,
+    bounding: Rectangle,
+    positionData: IPositionData,
+    gap: number = 0,
+    directionalHintFixed?: boolean,
+    coverTarget?: boolean): ICallout {
+
+    let {
+      alignmentEdge
+    } = positionData;
+    let calloutEstimate: ICallout = {
+      calloutRectangle: callout,
+      targetEdge: positionData.targetEdge,
+      alignmentEdge: alignmentEdge
+    };
 
-        return _moveTopLeftOfRectangleToPoint(rect, { x: rect.left, y: coordinate - rect.height });
-      case RectangleEdge.left:
+    if (!directionalHintFixed && !coverTarget) {
+      calloutEstimate = _flipToFit(callout, target, bounding, positionData, gap);
+    }
 
-        return _moveTopLeftOfRectangleToPoint(rect, { x: coordinate, y: rect.top });
-      case RectangleEdge.right:
+    let outOfBounds = _getOutOfBoundsEdges(callout, bounding);
 
-        return _moveTopLeftOfRectangleToPoint(rect, { x: coordinate - rect.width, y: rect.top });
+    for (const direction of outOfBounds) {
+      calloutEstimate.calloutRectangle = _alignEdges(calloutEstimate.calloutRectangle, bounding, direction);
     }
 
-    return new Rectangle();
+    return calloutEstimate;
   }
 
   /**
-   * Moves a point on a given rectangle to the target point. Does not change the rectangles orientation.
+   * Moves the middle point on an edge to the point given.
+   * Only moves in one direction. For instance if a bottom edge is passed in, then
+   * the bottom edge will be moved in the x axis to match the point.
+   *
+   * @param {Rectangle} rect
+   * @param {RectangleEdge} edge
+   * @param {number} point
+   * @returns
    */
-  export function _movePointOnRectangleToPoint(rect: Rectangle, rectanglePoint: IPoint, targetPoint: IPoint) {
-    let leftCornerXDifference = rectanglePoint.x - rect.left;
-    let leftCornerYDifference = rectanglePoint.y - rect.top;
-
-    return _moveTopLeftOfRectangleToPoint(rect, { x: targetPoint.x - leftCornerXDifference, y: targetPoint.y - leftCornerYDifference });
+  function centerEdgeToPoint(rect: Rectangle, edge: RectangleEdge, point: number) {
+    const { firstEdge } = _getFlankingEdges(edge);
+    const calloutMiddle = _getCenterValue(rect, edge);
+    const distanceToMiddle = calloutMiddle - _getEdgeValue(rect, firstEdge);
+    return _moveEdge(rect, firstEdge, point - distanceToMiddle);
   }
 
   /**
-   * Moves the given rectangle a certain number of pixels in the given direction;
+   * Moves the callout rectangle to be appropriately positioned relative to a given target.
+   * Does not flip or adjust the callout.
+   *
+   * @param {Rectangle} callout
+   * @param {Rectangle} target
+   * @param {IPositionData} positionData
+   * @param {number} [gap=0]
+   * @param {boolean} [coverTarget]
+   * @returns {Rectangle}
    */
-  export function _moveRectangleInDirection(rect: Rectangle, moveDistance: number, direction: RectangleEdge): Rectangle {
-    let xModifier: number = 0;
-    let yModifier: number = 0;
+  function _estimatePosition(
+    callout: Rectangle,
+    target: Rectangle,
+    positionData: IPositionData,
+    gap: number = 0,
+    coverTarget?: boolean
+  ): Rectangle {
+    let estimatedCalloutPosition: Rectangle;
+    let {
+      alignmentEdge,
+      targetEdge
+    } = positionData;
+    const calloutEdge = coverTarget ? targetEdge : targetEdge * -1;
+    estimatedCalloutPosition = coverTarget ? _alignEdges(callout, target, targetEdge, gap) :
+      _alignOppositeEdges(callout, target, targetEdge, gap);
+    // if no alignment edge is provided it's supposed to be centered.
+    if (!alignmentEdge) {
+      const targetMiddlePoint = _getCenterValue(target, targetEdge);
+      estimatedCalloutPosition = centerEdgeToPoint(estimatedCalloutPosition, calloutEdge, targetMiddlePoint);
 
-    switch (direction) {
-      case RectangleEdge.top:
-        yModifier = moveDistance * -1;
-        break;
-      case RectangleEdge.left:
-        xModifier = moveDistance * -1;
-        break;
-      case RectangleEdge.right:
-        xModifier = moveDistance;
-        break;
-      case RectangleEdge.bottom:
-        yModifier = moveDistance;
-        break;
+    } else {
+      estimatedCalloutPosition = _alignEdges(estimatedCalloutPosition, target, alignmentEdge);
     }
 
-    return _moveTopLeftOfRectangleToPoint(rect, { x: rect.left + xModifier, y: rect.top + yModifier });
+    return estimatedCalloutPosition;
   }
 
   /**
-   * Moves the given rectangle to an anchor rectangle.
+   * Returns the non-opposite edges of the target edge.
+   * For instance if bottom is passed in then left and right will be returned.
+   *
+   * @param {RectangleEdge} edge
+   * @returns {{ firstEdge: RectangleEdge, secondEdge: RectangleEdge }}
    */
-  export function _moveRectangleToAnchorRectangle(
-    rect: Rectangle,
-    rectSide: RectangleEdge,
-    rectPercent: number,
-    anchorRect: Rectangle,
-    anchorSide: RectangleEdge,
-    anchorPercent: number,
-    gap: number = 0): Rectangle {
-    let rectTargetPoint: IPoint = _getPointOnEdgeFromPercent(rect, rectSide, rectPercent);
-    let anchorTargetPoint: IPoint = _getPointOnEdgeFromPercent(anchorRect, anchorSide, anchorPercent);
-    let positionedRect = _movePointOnRectangleToPoint(rect, rectTargetPoint, anchorTargetPoint);
-
-    return _moveRectangleInDirection(positionedRect, gap, anchorSide);
+  function _getFlankingEdges(edge: RectangleEdge): { firstEdge: RectangleEdge, secondEdge: RectangleEdge } {
+    if (edge === RectangleEdge.top || edge === RectangleEdge.bottom) {
+      return {
+        firstEdge: RectangleEdge.left,
+        secondEdge: RectangleEdge.right
+      };
+    } else {
+      return {
+        firstEdge: RectangleEdge.top,
+        secondEdge: RectangleEdge.bottom
+      };
+    }
   }
 
   /**
-   * Gets the closet point on an edge to the given point.
+   * Finalizes the callout positon based on the hostElement. Only returns the
+   * rectangle values to position such that they are anchored to the target.
+   * This helps prevent resizing from looking very strange.
+   * For instance, if the target edge is top and aligned with the left side then
+   * the bottom and left values are returned so as the callou shrinks it shrinks towards that corner.
+   *
+   * @param {Rectangle} calloutRectangle
+   * @param {HTMLElement} hostElement
+   * @param {RectangleEdge} targetEdge
+   * @param {RectangleEdge} [alignmentEdge]
+   * @returns {IPartialIRectangle}
    */
-  export function _getClosestPointOnEdgeToPoint(rect: Rectangle, edge: RectangleEdge, point: IPoint): IPoint {
-    switch (edge) {
-      case RectangleEdge.top:
-      case RectangleEdge.bottom:
-        let x: number;
-
-        if (point.x > rect.right) {
-          x = rect.right;
-        } else if (point.x < rect.left) {
-          x = rect.left;
-        } else {
-          x = point.x;
-        }
-        return { x: x, y: (rect as any)[RectangleEdge[edge]] };
-      case RectangleEdge.left:
-      case RectangleEdge.right:
-        let y: number;
-
-        if (point.y > rect.bottom) {
-          y = rect.bottom;
-        } else if (point.y < rect.top) {
-          y = rect.top;
-        } else {
-          y = point.y;
-        }
-        return { x: (rect as any)[RectangleEdge[edge]], y: y };
-    }
+  function _finalizeCalloutPosition(
+    calloutRectangle: Rectangle,
+    hostElement: HTMLElement,
+    targetEdge: RectangleEdge,
+    alignmentEdge?: RectangleEdge
+  ): IPartialIRectangle {
+    let returnValue: IPartialIRectangle = {};
+
+    const hostRect: Rectangle = _getRectangleFromHTMLElement(hostElement);
+    const calloutEdge = targetEdge * -1;
+    const calloutEdgeString = RectangleEdge[calloutEdge];
+    const returnEdge = alignmentEdge ? alignmentEdge : _getFlankingEdges(targetEdge).firstEdge;
+
+    returnValue[calloutEdgeString] = _getRelativeEdgeDifference(calloutRectangle, hostRect, calloutEdge);
+    returnValue[RectangleEdge[returnEdge]] = _getRelativeEdgeDifference(calloutRectangle, hostRect, returnEdge);
+
+    return returnValue;
   }
 
   // Since the beak is rotated 45 degrees the actual height/width is the length of the diagonal.
@@ -650,126 +498,226 @@ export module positioningFunctions {
     return Math.sqrt(beakWidth * beakWidth * 2);
   }
 
-  export function _getBorderSize(element: HTMLElement): number {
-    let styles: CSSStyleDeclaration = getComputedStyle(element, undefined);
-    let topBorder: number = parseFloat(styles.borderTopWidth || '');
-    let bottomBorder: number = parseFloat(styles.borderBottomWidth || '');
-    let leftBorder: number = parseFloat(styles.borderLeftWidth || '');
-    let rightBorder: number = parseFloat(styles.borderRightWidth || '');
-
-    // If any of the borders are NaN default to 0
-    if (isNaN(topBorder) || isNaN(bottomBorder) || isNaN(leftBorder) || isNaN(rightBorder)) {
-      return 0;
+  /**
+   * Returns the appropriate IPositionData based on the props altered for RTL.
+   * If directionalHintForRTL is passed in that is used if the page is RTL.
+   * If a directionalHint is specified and no directionalHintForRTL is available and the page is RTL the hint will be flipped.
+   * For instance bottomLeftEdge would become bottomRightEdge.
+   * If there is no directionalHint passed in bottomAutoEdge is chosen automatically.
+   *
+   * @param {IPositionProps} props
+   * @returns {IPositionData}
+   */
+  export function _getPositionData(
+    directionalHint: DirectionalHint = DirectionalHint.bottomAutoEdge,
+    directionalHintForRTL?: DirectionalHint
+  ): IPositionData {
+    let positionInformation: IPositionData = { ...DirectionalDictionary[directionalHint] };
+    if (getRTL()) {
+      // If alignment edge exists and that alignment edge is -2 or 2, right or left, then flip it.
+      positionInformation.alignmentEdge = positionInformation.alignmentEdge && positionInformation.alignmentEdge % 2 === 0
+        ? positionInformation.alignmentEdge * -1 : undefined;
+      return directionalHintForRTL !== undefined ?
+        DirectionalDictionary[directionalHintForRTL] :
+        positionInformation;
     }
+    return positionInformation;
+  }
+
+  /**
+   * Get's the alignment data for the given information. This only really matters if the positioning is Auto.
+   * If it is auto then the alignmentEdge should be chosen based on the target edge's position relative to
+   * the center of the page.
+   *
+   * @param {IPositionData} positionData
+   * @param {Rectangle} target
+   * @param {Rectangle} boundingRect
+   * @param {boolean} [coverTarget]
+   * @returns {IPositionData}
+   */
+  function _getAlignmentData(positionData: IPositionData, target: Rectangle, boundingRect: Rectangle, coverTarget?: boolean): IPositionData {
+    if (positionData.isAuto) {
+      let center: number = _getCenterValue(target, positionData.targetEdge);
 
-    // If all of the borders are the same size, any value;
-    if (topBorder === bottomBorder && bottomBorder === leftBorder && leftBorder === rightBorder) {
-      return topBorder;
+      if (center <= boundingRect.width / 2) {
+        positionData.alignmentEdge = RectangleEdge.left;
+      } else {
+        positionData.alignmentEdge = RectangleEdge.right;
+      }
     }
 
-    // If the borders do not agree, return 0
-    return 0;
+    return positionData;
   }
 
-  export function _getPositionData(direction: DirectionalHint, target: Rectangle, boundingRect: Rectangle, coverTarget?: boolean): PositionData {
-    let directionalInfo: PositionData = coverTarget ? CoverDictionary[direction] : DirectionalDictionary[direction];
+  export function _positionCalloutWithinBounds(
+    callout: Rectangle,
+    target: Rectangle,
+    bounding: Rectangle,
+    positionData: IPositionData,
+    gap: number,
+    directionalHintFixed?: boolean,
+    coverTarget?: boolean): ICallout {
+    let estimatedCalloutPosition: Rectangle = _estimatePosition(callout, target, positionData, gap, coverTarget);
+    if (_isRectangleWithinBounds(estimatedCalloutPosition, bounding)) {
+      return {
+        calloutRectangle: estimatedCalloutPosition,
+        targetEdge: positionData.targetEdge,
+        alignmentEdge: positionData.alignmentEdge
+      };
+    } else {
+      return _adjustFitWithinBounds(callout, target, bounding, positionData, gap, directionalHintFixed, coverTarget);
+    }
+  }
 
-    if (directionalInfo.isAuto) {
-      let center: IPoint = _getPointOnEdgeFromPercent(target, directionalInfo.targetDirection, 50);
+  export function _positionBeak(beakWidth: number,
+    callout: ICallout,
+    target: Rectangle,
+    alignmentEdge?: RectangleEdge) {
 
-      if (center.x <= boundingRect.width / 2) {
-        directionalInfo.calloutPercent = 0;
-        directionalInfo.targetPercent = 0;
-      } else {
-        directionalInfo.calloutPercent = 100;
-        directionalInfo.targetPercent = 100;
-      }
+    const { firstEdge, secondEdge } = _getFlankingEdges(callout.targetEdge);
+    const beakTargetPoint = _getCenterValue(target, callout.targetEdge);
+    const actualBeakWidth = _calculateActualBeakWidthInPixels(beakWidth);
+    // The "host" callout that we will use to help position the beak.
+    const actualCallout = new Rectangle(0, callout.calloutRectangle.width, 0, callout.calloutRectangle.height);
+
+    const calloutBounds = new Rectangle(
+      actualBeakWidth / 2,
+      callout.calloutRectangle.width - actualBeakWidth / 2,
+      actualBeakWidth / 2,
+      callout.calloutRectangle.height - actualBeakWidth / 2
+    );
+
+    let beakPositon: Rectangle = new Rectangle(0, beakWidth, 0, beakWidth);
+
+    beakPositon = _moveEdge(beakPositon, (callout.targetEdge * -1), -beakWidth / 2);
+
+    beakPositon = centerEdgeToPoint(beakPositon, callout.targetEdge * -1,
+      beakTargetPoint - _getRelativeRectEdgeValue(firstEdge, callout.calloutRectangle));
+
+    if (!_isEdgeInBounds(beakPositon, calloutBounds, firstEdge)) {
+      beakPositon = _alignEdges(beakPositon, calloutBounds, firstEdge);
+    } else if (!_isEdgeInBounds(beakPositon, calloutBounds, secondEdge)) {
+      beakPositon = _alignEdges(beakPositon, calloutBounds, secondEdge);
     }
 
-    return directionalInfo;
+    const targetEdge = callout.targetEdge * -1;
+
+    const returnEdge = alignmentEdge ? alignmentEdge : _getFlankingEdges(targetEdge).firstEdge;
+    let returnValue: IPartialIRectangle = {};
+
+    returnValue[RectangleEdge[targetEdge]] = _getEdgeValue(beakPositon, targetEdge);
+    returnValue[RectangleEdge[returnEdge]] = _getRelativeEdgeDifference(beakPositon, actualCallout, returnEdge);
+
+    return returnValue;
   }
 
-  export function _flipRectangleToFit(callout: ICallout, targetRect: Rectangle, targetPercent: number, boundingRect: Rectangle, gap: number): ICallout {
-    let directions: RectangleEdge[] = [RectangleEdge.left, RectangleEdge.right, RectangleEdge.top, RectangleEdge.bottom];
-    let currentEdge: RectangleEdge = callout.targetEdge;
-    // Make a copy to presever the original positioning.
-    let positionedCallout: ICallout = assign({}, callout);
+  export function _getRectangleFromHTMLElement(element: HTMLElement): Rectangle {
+    let clientRect: ClientRect = element.getBoundingClientRect();
 
-    // Keep switching sides until one is found with enough space. If all sides don't fit then return the unmodified callout.
-    for (let i = 0; i < 4; i++) {
-      let outOfBounds: RectangleEdge[] = _getOutOfBoundsEdges(positionedCallout.calloutRectangle, boundingRect);
-      let index: number = outOfBounds.indexOf(currentEdge);
-      let oppositeEdge: RectangleEdge = OppositeEdgeDictionary[currentEdge];
+    return new Rectangle(clientRect.left, clientRect.right, clientRect.top, clientRect.bottom);
+  }
 
-      if (index > -1) {
-        directions.splice(directions.indexOf(currentEdge), 1);
-        currentEdge = directions.indexOf(oppositeEdge) > -1 ? oppositeEdge : directions.slice(-1)[0];
-        positionedCallout.calloutEdge = OppositeEdgeDictionary[currentEdge];
-        positionedCallout.targetEdge = currentEdge;
-        positionedCallout.calloutRectangle = _moveRectangleToAnchorRectangle(positionedCallout.calloutRectangle,
-          positionedCallout.calloutEdge,
-          positionedCallout.alignPercent,
-          targetRect,
-          positionedCallout.targetEdge,
-          targetPercent,
-          gap);
+  export function _getRectangleFromIRect(rect: IRectangle): Rectangle {
+    return new Rectangle(rect.left, rect.right, rect.top, rect.bottom);
+  }
+
+  export function _getTargetRect(bounds: Rectangle, target: HTMLElement | MouseEvent | undefined) {
+    let targetRectangle: Rectangle;
+    if (target) {
+      if ((target as MouseEvent).preventDefault) {
+        let ev: MouseEvent = target as MouseEvent;
+        targetRectangle = new Rectangle(ev.clientX, ev.clientX, ev.clientY, ev.clientY);
       } else {
-        return positionedCallout;
+        targetRectangle = _getRectangleFromHTMLElement(target as HTMLElement);
       }
+
+      if (!_isRectangleWithinBounds(targetRectangle, bounds)) {
+        let outOfBounds: RectangleEdge[] = _getOutOfBoundsEdges(targetRectangle, bounds);
+
+        for (let direction of outOfBounds) {
+          (targetRectangle as any)[RectangleEdge[direction]] = (bounds as any)[RectangleEdge[direction]];
+        }
+      }
+    } else {
+      targetRectangle = new Rectangle(0, 0, 0, 0);
     }
 
-    return callout;
+    return targetRectangle;
   }
-}
 
-function getDirectionalHintForLayout(props: IPositionProps): DirectionalHint | undefined {
-  if (getRTL()) {
-    return props.directionalHintForRTL !== undefined ?
-      props.directionalHintForRTL :
-      MirrorDirectionalHintDictionary[props.directionalHint!];
-  } else {
-    return props.directionalHint;
+  /**
+   * If max height is less than zero it returns the bounds height instead.
+   */
+  export function _getMaxHeightFromTargetRectangle(targetRectangle: Rectangle, targetEdge: DirectionalHint, gapSpace: number, bounds: Rectangle) {
+    let maxHeight = 0;
+
+    switch (targetEdge) {
+      case DirectionalHint.bottomAutoEdge:
+      case DirectionalHint.bottomCenter:
+      case DirectionalHint.bottomLeftEdge:
+      case DirectionalHint.bottomRightEdge:
+        maxHeight = bounds.bottom - targetRectangle.bottom - gapSpace;
+        break;
+      case DirectionalHint.topAutoEdge:
+      case DirectionalHint.topCenter:
+      case DirectionalHint.topLeftEdge:
+      case DirectionalHint.topRightEdge:
+        maxHeight = targetRectangle.top - bounds.top - gapSpace;
+        break;
+      default:
+        maxHeight = bounds.bottom - targetRectangle.top - gapSpace;
+        break;
+    }
+
+    return maxHeight > 0 ? maxHeight : bounds.height;
+  }
+
+  export function _getRelativePositions(
+    props: IPositionProps,
+    hostElement: HTMLElement,
+    calloutElement: HTMLElement): IPositionInfo {
+    const beakWidth: number = !props.isBeakVisible ? 0 : (props.beakWidth || 0);
+    const gap: number = _calculateActualBeakWidthInPixels(beakWidth) / 2 + (props.gapSpace ? props.gapSpace : 0);
+    const boundingRect: Rectangle = props.bounds ?
+      _getRectangleFromIRect(props.bounds) :
+      new Rectangle(0, window.innerWidth - getScrollbarWidth(), 0, window.innerHeight);
+    const targetRect: Rectangle = _getTargetRect(boundingRect, props.target);
+    const positionData: IPositionData = _getAlignmentData(
+      _getPositionData(props.directionalHint, props.directionalHintForRTL)!,
+      targetRect,
+      boundingRect,
+      props.coverTarget);
+    const positionedCallout: ICallout = _positionCalloutWithinBounds(
+      _getRectangleFromHTMLElement(calloutElement),
+      targetRect,
+      boundingRect,
+      positionData,
+      gap,
+      props.directionalHintFixed,
+      props.coverTarget);
+    const beakPositioned: IPartialIRectangle = _positionBeak(
+      beakWidth,
+      positionedCallout,
+      targetRect,
+      positionedCallout.alignmentEdge);
+    const finalizedCallout: IPartialIRectangle = _finalizeCalloutPosition(
+      positionedCallout.calloutRectangle,
+      hostElement,
+      positionedCallout.targetEdge,
+      positionedCallout.alignmentEdge);
+    return {
+      calloutPosition: finalizedCallout,
+      beakPosition: { position: { ...beakPositioned }, display: 'block' },
+      directionalClassName: SLIDE_ANIMATIONS[positionedCallout.targetEdge],
+      submenuDirection: (positionedCallout.targetEdge * -1) === RectangleEdge.right ? DirectionalHint.leftBottomEdge : DirectionalHint.rightBottomEdge
+    };
   }
 }
 
-export function getRelativePositions(
-  props: IPositionProps,
+export function getRelativePositions(props: IPositionProps,
   hostElement: HTMLElement,
-  calloutElement: HTMLElement): IPositionInfo {
-  let beakWidth: number = !props.isBeakVisible ? 0 : (props.beakWidth || 0);
-  let borderWidth: number = positioningFunctions._getBorderSize(calloutElement);
-  let gap: number = positioningFunctions._calculateActualBeakWidthInPixels(beakWidth) / 2 + (props.gapSpace ? props.gapSpace : 0);
-  let boundingRect: Rectangle = props.bounds ?
-    positioningFunctions._getRectangleFromIRect(props.bounds) :
-    new Rectangle(0, window.innerWidth - getScrollbarWidth(), 0, window.innerHeight);
-  let targetRect: Rectangle = props.target ? positioningFunctions._getTargetRect(boundingRect, props.target) : positioningFunctions._getTargetRectDEPRECATED(
-    boundingRect,
-    props.targetElement,
-    props.creationEvent,
-    props.targetPoint,
-    props.useTargetPoint);
-  let positionData: PositionData = positioningFunctions._getPositionData(
-    getDirectionalHintForLayout(props)!,
-    targetRect,
-    boundingRect,
-    props.coverTarget);
-  let positionedCallout: positioningFunctions.ICallout = positioningFunctions._positionCalloutWithinBounds(
-    positioningFunctions._getRectangleFromHTMLElement(calloutElement),
-    targetRect,
-    boundingRect,
-    positionData,
-    gap,
-    props.coverTarget,
-    props.directionalHintFixed);
-  let beakPositioned: Rectangle = positioningFunctions._positionBeak(beakWidth, positionedCallout, targetRect, borderWidth);
-  let finalizedCallout: Rectangle = positioningFunctions._finalizeCalloutPosition(positionedCallout.calloutRectangle, hostElement);
-
-  return {
-    calloutPosition: { top: finalizedCallout.top, left: finalizedCallout.left },
-    beakPosition: { top: beakPositioned.top, left: beakPositioned.left, display: 'block' },
-    directionalClassName: SLIDE_ANIMATIONS[positionedCallout.targetEdge],
-    submenuDirection: positionedCallout.calloutEdge === RectangleEdge.right ? DirectionalHint.leftBottomEdge : DirectionalHint.rightBottomEdge
-  };
+  calloutElement: HTMLElement) {
+  return positioningFunctions._getRelativePositions(props, hostElement, calloutElement);
 }
 
 /**
@@ -793,4 +741,4 @@ export function getMaxHeight(target: HTMLElement | MouseEvent, targetEdge: Direc
   }
 
   return positioningFunctions._getMaxHeightFromTargetRectangle(targetRect, targetEdge, gapSpace, boundingRectangle);
-}
+}
\ No newline at end of file

From 75ce32c363d1415c4d5bf28ac29c38df9dddea1f Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Tue, 3 Oct 2017 15:07:32 -0700
Subject: [PATCH 0768/1641] Split Button: Separate disabled capability for menu
 from primary action (#3002)

* Add ability to have a separate disable status for split button part of button

* Return split button example to previous state

* Add npm run change file

* Separate functionality by adding a primaryDisabled prop

* Update malozano-splitButtonDisable_2017-10-02-20-48.json
---
 ...o-splitButtonDisable_2017-10-02-20-48.json | 11 ++++++++
 .../src/components/Button/BaseButton.tsx      |  9 ++++--
 .../src/components/Button/Button.Props.ts     |  5 ++++
 .../Button/examples/Button.Split.Example.tsx  | 28 +++++++++++++++++++
 4 files changed, 50 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/malozano-splitButtonDisable_2017-10-02-20-48.json

diff --git a/common/changes/office-ui-fabric-react/malozano-splitButtonDisable_2017-10-02-20-48.json b/common/changes/office-ui-fabric-react/malozano-splitButtonDisable_2017-10-02-20-48.json
new file mode 100644
index 0000000000000..5e1d968167846
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-splitButtonDisable_2017-10-02-20-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "\"Buttons: adding `primaryDisabled` flag for disabling only the primary action of the split button, leaving the menu enabled.\"",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 2e8459cb70ec9..ec3746d846169 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -77,6 +77,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       className,
       description,
       disabled,
+      primaryDisabled,
       href,
       iconProps,
       menuIconProps,
@@ -87,6 +88,8 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
          } = this.props;
 
     let { menuProps } = this.state;
+    // Button is disabled if the whole button (in case of splitbutton is disabled) or if the primary action is disabled
+    let isPrimaryButtonDisabled = (disabled || primaryDisabled);
 
     this._classNames = getClassNames(
       styles!,
@@ -94,7 +97,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       variantClassName!,
       iconProps && iconProps.className,
       menuIconProps && menuIconProps.className,
-      disabled!,
+      isPrimaryButtonDisabled!,
       checked!,
       !!this.state.menuProps && !this.props.split
     );
@@ -102,7 +105,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     const { _ariaDescriptionId, _labelId, _descriptionId } = this;
     // Anchor tag cannot be disabled hence in disabled state rendering
     // anchor button as normal button
-    const renderAsAnchor: boolean = !disabled && !!href;
+    const renderAsAnchor: boolean = !isPrimaryButtonDisabled && !!href;
     const tag = renderAsAnchor ? 'a' : 'button';
     const nativeProps = getNativeProps(
       assign(
@@ -146,7 +149,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       {
         className: this._classNames.root,
         ref: this._resolveRef('_buttonElement'),
-        'disabled': disabled,
+        'disabled': isPrimaryButtonDisabled,
         'aria-label': ariaLabel,
         'aria-labelledby': ariaLabelledBy,
         'aria-describedby': ariaDescribedBy,
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
index 682ed727db1a7..3c2f110ff0e9e 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
@@ -47,6 +47,11 @@ export interface IButtonProps extends React.AllHTMLAttributes<HTMLAnchorElement
    */
   disabled?: boolean;
 
+  /**
+   * If set to true and if this is a splitButton (split == true) then the primary action of a split button is disabled.
+   */
+  primaryDisabled?: boolean;
+
   /**
    * Custom styling for individual elements within the button DOM.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
index b325ddef4f660..fa25bfbfe6204 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
@@ -70,6 +70,34 @@ export class ButtonSplitExample extends React.Component<IButtonProps, {}> {
             } }
           />
         </div>
+        <div>
+          <Label>Primary Action Disabled</Label>
+          <DefaultButton
+            primary
+            data-automation-id='test'
+            disabled={ disabled }
+            primaryDisabled={ true }
+            checked={ checked }
+            text='Create account'
+            onClick={ alertClicked }
+            split={ true }
+            style={ { height: '35px' } }
+            menuProps={ {
+              items: [
+                {
+                  key: 'emailMessage',
+                  name: 'Email message',
+                  icon: 'Mail'
+                },
+                {
+                  key: 'calendarEvent',
+                  name: 'Calendar event',
+                  icon: 'Calendar'
+                }
+              ]
+            } }
+          />
+        </div>
       </div>
     );
   }

From 289ee6ee52372491ac35cebb577554be9ac39c9a Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 3 Oct 2017 15:13:25 -0700
Subject: [PATCH 0769/1641] Adding Icon component page to the website (#3012)

* Added Icon component to website

* Added change file
---
 .../src/components/App/AppState.tsx           |  6 +++
 .../pages/Components/IconComponentPage.tsx    | 38 +++++++++++++++++++
 .../icon-page-website_2017-10-03-15-54.json   | 11 ++++++
 3 files changed, 55 insertions(+)
 create mode 100644 apps/fabric-website/src/pages/Components/IconComponentPage.tsx
 create mode 100644 common/changes/@uifabric/fabric-website/icon-page-website_2017-10-03-15-54.json

diff --git a/apps/fabric-website/src/components/App/AppState.tsx b/apps/fabric-website/src/components/App/AppState.tsx
index 94937f7aa8956..53edfaf4daa8a 100644
--- a/apps/fabric-website/src/components/App/AppState.tsx
+++ b/apps/fabric-website/src/components/App/AppState.tsx
@@ -202,6 +202,12 @@ export const AppState: IAppState = {
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/GroupedListComponentPage').GroupedListComponentPage))
 
         },
+        {
+          title: 'Icon',
+          url: '#/components/Icon',
+          component: () => <LoadingComponent title='Icon' />,
+          getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/IconComponentPage').IconComponentPage))
+        },
         {
           title: 'Image',
           url: '#/components/image',
diff --git a/apps/fabric-website/src/pages/Components/IconComponentPage.tsx b/apps/fabric-website/src/pages/Components/IconComponentPage.tsx
new file mode 100644
index 0000000000000..f9b32ba36ce77
--- /dev/null
+++ b/apps/fabric-website/src/pages/Components/IconComponentPage.tsx
@@ -0,0 +1,38 @@
+import * as React from 'react';
+import { IconPage } from 'office-ui-fabric-react/lib/components/Icon/IconPage';
+import { PageHeader } from '../../components/PageHeader/PageHeader';
+import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
+
+export class IconComponentPage extends React.Component<any, any> {
+  public render() {
+    return (
+      <div ref='pageElement' className={ pageStyles.basePage }>
+        <ComponentPage>
+          <PageHeader pageTitle='Icon' backgroundColor='#038387'
+            links={
+              [
+                {
+                  'text': 'Overview',
+                  'location': 'Overview'
+                },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
+                {
+                  'text': 'Variants',
+                  'location': 'Variants'
+                },
+                {
+                  'text': 'Implementation',
+                  'location': 'Implementation'
+                }
+              ]
+            } />
+          <IconPage isHeaderVisible={ false } />
+        </ComponentPage>
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/icon-page-website_2017-10-03-15-54.json b/common/changes/@uifabric/fabric-website/icon-page-website_2017-10-03-15-54.json
new file mode 100644
index 0000000000000..c3c1ff3779428
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/icon-page-website_2017-10-03-15-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Added Icon component to website",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From f9ff40b02ab05a1a3542b90a9f4e2fe51a6d42ed Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 3 Oct 2017 16:30:14 -0700
Subject: [PATCH 0770/1641] Added documentation on GetStarted page about
 initializing icons for components (#2998)

* Add new icon docs to get started page

* Added change file

* Added reference to Icon component page
---
 .../src/pages/GetStarted/GetStartedPage.tsx       | 15 +++++++++++++++
 .../icon-docs_2017-10-02-16-52.json               | 11 +++++++++++
 2 files changed, 26 insertions(+)
 create mode 100644 common/changes/@uifabric/fabric-website/icon-docs_2017-10-02-16-52.json

diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
index 4b8a0b45a86d5..4852fc2abc370 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
@@ -154,6 +154,21 @@ ReactDOM.render(<MyPage />, document.body.firstChild);`
               </CodeBlock>
               <p>Components, type, and icons are just a small part of what Fabric has to offer. To reference other assets, including colors, product symbols, and more, see the <a className={ styles.getStartedLink } href='#/styles'>styles page</a>.</p>
             </li>
+            <li>
+              <p>If you are using Fabric React components that have icons, you can make all icons available by calling the `initializeIcons` function from the `@uifabric/icons` package:</p>
+              <CodeBlock language='javascript' isLightTheme={ true }>
+                {
+                  `import { initializeIcons } from '@uifabric/icons';
+
+// Register icons and pull the fonts from the default SharePoint cdn:
+initializeIcons();
+
+// ...or, register icons and pull the fonts from your own cdn:
+initializeIcons('https://my.cdn.com/path/to/icons/');`
+                }
+              </CodeBlock>
+              <p>This will make ALL icons in the collection available, but will download them on demand when referenced using the <a href='#/components/Icon'>Icon component</a>.</p>
+            </li>
           </ol>
 
           <h3>Other ways to get Fabric React</h3>
diff --git a/common/changes/@uifabric/fabric-website/icon-docs_2017-10-02-16-52.json b/common/changes/@uifabric/fabric-website/icon-docs_2017-10-02-16-52.json
new file mode 100644
index 0000000000000..c590377895b81
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/icon-docs_2017-10-02-16-52.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Added section in Get Started page to document how to use icons in components.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From 4267f5f8555395b1b080a3a21445cdf5faf6c373 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 3 Oct 2017 21:02:01 -0700
Subject: [PATCH 0771/1641] Removed duplicate header in ResizeGroup page
 (#3020)

* Removed duplicate header in ResizeGroup

* Best practices section
---
 .../resize-group-header_2017-10-03-21-51.json         | 11 +++++++++++
 .../src/components/ResizeGroup/ResizeGroupPage.tsx    |  7 ++++++-
 2 files changed, 17 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/resize-group-header_2017-10-03-21-51.json

diff --git a/common/changes/office-ui-fabric-react/resize-group-header_2017-10-03-21-51.json b/common/changes/office-ui-fabric-react/resize-group-header_2017-10-03-21-51.json
new file mode 100644
index 0000000000000..72ce204d2b351
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/resize-group-header_2017-10-03-21-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Removed duplicate header in ResizeGroup.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
index b105c42dae92e..9e7a81ba41798 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
@@ -2,6 +2,7 @@ import * as React from 'react';
 import { LayerHost } from 'office-ui-fabric-react/lib/Layer';
 import {
   ExampleCard,
+  IComponentDemoPageProps,
   ComponentPage,
   PropertiesTableSet
 } from '@uifabric/example-app-base';
@@ -14,7 +15,7 @@ const ResizeGroupBasicExampleCode = require('!raw-loader!office-ui-fabric-react/
 
 const ResizeGroupFlexBoxExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx') as string;
 
-export class ResizeGroupPage extends React.Component<any, any> {
+export class ResizeGroupPage extends React.Component<IComponentDemoPageProps, any> {
   public render() {
     return (
       <ComponentPage
@@ -65,6 +66,9 @@ export class ResizeGroupPage extends React.Component<any, any> {
             </span>
           </div>
         }
+        bestPractices={
+          <div />
+        }
         dos={
           <div>
             <ul>
@@ -93,6 +97,7 @@ export class ResizeGroupPage extends React.Component<any, any> {
             </ul>
           </div>
         }
+        isHeaderVisible={ this.props.isHeaderVisible }
         componentStatus={
           <ComponentStatus
             {...ResizeGroupStatus}

From 6304a6ed726185865b8b2620d085061db414555f Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Tue, 3 Oct 2017 21:02:40 -0700
Subject: [PATCH 0772/1641] Add presence to personaCoinProps (#3022)

---
 .../office-ui-fabric-react/src/components/Persona/Persona.tsx    | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index d85baf9646458..682feed9bb1fd 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -66,6 +66,7 @@ export class Persona extends BaseComponent<IPersonaProps, {}> {
       imageAlt,
       imageInitials,
       initialsColor,
+      presence,
       primaryText,
       imageShouldFadeIn,
       imageShouldStartVisible,

From 7f7200ea84ca73ef5dfd370ae1ac5986a8f24c56 Mon Sep 17 00:00:00 2001
From: Andres Camargo <andrescb@microsoft.com>
Date: Wed, 4 Oct 2017 12:02:12 -0700
Subject: [PATCH 0773/1641] Andrescb/fix datepicker callback (#3009)

* Initial commit

* change oldValue to listen to state
---
 ...scb-fix-datepicker-callback_2017-10-02-23-23.json | 11 +++++++++++
 .../src/components/DatePicker/DatePicker.tsx         | 12 ++++++------
 2 files changed, 17 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/andrescb-fix-datepicker-callback_2017-10-02-23-23.json

diff --git a/common/changes/office-ui-fabric-react/andrescb-fix-datepicker-callback_2017-10-02-23-23.json b/common/changes/office-ui-fabric-react/andrescb-fix-datepicker-callback_2017-10-02-23-23.json
new file mode 100644
index 0000000000000..9fe069e43731b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/andrescb-fix-datepicker-callback_2017-10-02-23-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DatePicker - make onSelectDate callback execute as part of SetState instead of after it. This ensures that selected date changes occur in the expected order",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "andrescb@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 310aeda8f35c0..80dd8949bef7f 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -153,11 +153,11 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
       errorMessage: errorMessage
     });
 
-    // Issue# 1274: Check if the date value changed from old props value, i.e., if indeed a new date is being
+    // Issue# 1274: Check if the date value changed from old value, i.e., if indeed a new date is being
     // passed in or if the formatting function was modified. We only update the selected date if either of these
     // had a legit change. Note tha the bug will still repro when only the formatDate was passed in props and this
     // is the result of the onSelectDate callback, but this should be a rare scenario.
-    let oldValue = this.props.value;
+    let oldValue = this.state.selectedDate;
     if (!compareDates(oldValue!, value!) || this.props.formatDate !== formatDate) {
       this.setState({
         selectedDate: value || new Date(),
@@ -256,11 +256,11 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
       selectedDate: date,
       isDatePickerShown: false,
       formattedDate: formatDate && date ? formatDate(date) : '',
+    }, () => {
+      if (onSelectDate) {
+        onSelectDate(date);
+      }
     });
-
-    if (onSelectDate) {
-      onSelectDate(date);
-    }
   }
 
   @autobind

From 72c218322ac10247c6f2693d68abc2e3df9ba7af Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 4 Oct 2017 12:05:10 -0700
Subject: [PATCH 0774/1641] BaseButton: Added borderRadius:0 to fix new default
 styles in webkit (#3025)

* Added borderRadius: 0 to baseButton root to fix new default styles in webkit

* changefile

* Updated commandbar snapshot
---
 .../webkit-borderRadius-fix_2017-10-04-14-52.json     | 11 +++++++++++
 .../CommandBar/__snapshots__/CommandBar.test.tsx.snap |  2 ++
 .../src/components/Button/BaseButton.styles.ts        |  3 ++-
 3 files changed, 15 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/webkit-borderRadius-fix_2017-10-04-14-52.json

diff --git a/common/changes/office-ui-fabric-react/webkit-borderRadius-fix_2017-10-04-14-52.json b/common/changes/office-ui-fabric-react/webkit-borderRadius-fix_2017-10-04-14-52.json
new file mode 100644
index 0000000000000..dd38b79ba8b14
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/webkit-borderRadius-fix_2017-10-04-14-52.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "BaseButton: Added borderRadius:0 to fix new default styles in webkit",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap b/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
index 60565e6c1b034..d3da488fc87ee 100644
--- a/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
+++ b/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
@@ -35,6 +35,7 @@ exports[`CommandBar renders commands correctly 1`] = `
                   -moz-osx-font-smoothing: grayscale;
                   -webkit-font-smoothing: antialiased;
                   background-color: #f4f4f4;
+                  border-radius: 0px;
                   border: 1px solid transparent;
                   box-sizing: border-box;
                   color: #333333;
@@ -135,6 +136,7 @@ exports[`CommandBar renders commands correctly 1`] = `
                   -moz-osx-font-smoothing: grayscale;
                   -webkit-font-smoothing: antialiased;
                   background-color: #f4f4f4;
+                  border-radius: 0px;
                   border: 1px solid transparent;
                   box-sizing: border-box;
                   color: #333333;
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
index 97940f456bcea..601234f83836d 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
@@ -44,7 +44,8 @@ export const getStyles = memoizeFunction((
         textAlign: 'center',
         cursor: 'pointer',
         verticalAlign: 'top',
-        padding: '0 16px'
+        padding: '0 16px',
+        borderRadius: 0
       }
     ],
 

From d8a8001fd24c3e2ae2ea1e0754acac98f80d4492 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Wed, 4 Oct 2017 12:57:16 -0700
Subject: [PATCH 0775/1641] New SearchBox "inline" prop and example, and other
 adjustments per toolkit (#2991)

* New SearchBox example - inline

* New SearchBox example - disabled

* Revised SearchBox examples per toolkit

* Added change file

* Switched prop from inline to underlined
---
 .../searchbox-toolkit_2017-09-29-20-03.json   | 11 ++++++
 .../components/SearchBox/SearchBox.Props.ts   |  8 ++++-
 .../src/components/SearchBox/SearchBox.scss   | 16 ++++++---
 .../src/components/SearchBox/SearchBox.tsx    |  3 +-
 .../components/SearchBox/SearchBoxPage.tsx    | 35 +++++++++++++++----
 .../examples/SearchBox.Disabled.Example.tsx   | 26 ++++++++++++++
 .../examples/SearchBox.Examples.scss          |  5 +++
 .../examples/SearchBox.Underlined.Example.tsx | 16 +++++++++
 8 files changed, 108 insertions(+), 12 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/searchbox-toolkit_2017-09-29-20-03.json
 create mode 100644 packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Disabled.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Examples.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Underlined.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/searchbox-toolkit_2017-09-29-20-03.json b/common/changes/office-ui-fabric-react/searchbox-toolkit_2017-09-29-20-03.json
new file mode 100644
index 0000000000000..9c25793a6914d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/searchbox-toolkit_2017-09-29-20-03.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added new inline prop for SearchBox and corresonding new example. Adjested the SearchBoxPage to better reflect the current toolkit documentation.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts
index 2e2d802631e82..372ca5fbae446 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts
@@ -61,4 +61,10 @@ export interface ISearchBoxProps extends React.InputHTMLAttributes<HTMLInputElem
    * @defaultvalue labelText
    */
   ariaLabel?: string;
-}
+
+  /**
+   * Whether or not the SearchBox is underlined.
+   * @default false
+   */
+  underlined?: boolean;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
index 4e1d267589ba7..32d8a4b741600 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
@@ -28,12 +28,11 @@
   flex-direction: column;
   justify-content: center;
   flex-shrink: 0;
-  color: $ms-color-neutralSecondaryAlt;
   font-size: 16px;
   width: 32px;
   text-align: center;
   transition: width $ms-animation-duration-1;
-  color: $ms-color-themeDarkAlt;
+  color: $ms-color-themePrimary;
 }
 
 .icon {
@@ -74,6 +73,15 @@
   color: $ms-color-themePrimary;
 }
 
+// Modifier: Inline searchbox
+.root.rootIsUnderlined {
+  border-width: 0px 0px 1px 0px;
+
+  &.rootIsDisabled {
+    background-color: transparent;
+  }
+}
+
 // State: Active searchbox
 .root.rootIsActive {
   border-color: $ms-color-themePrimary;
@@ -97,10 +105,10 @@
   pointer-events: none;
   cursor: default;
   .iconContainer {
-    color: $ms-color-neutralTertiaryAlt;
+    color: $ms-color-neutralTertiary;
   }
   .field {
-    color: $ms-color-neutralTertiaryAlt;
+    color: $ms-color-neutralTertiary;
   }
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
index 4b4af9192d420..29ffa5350e57c 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
@@ -47,7 +47,7 @@ export class SearchBox extends BaseComponent<ISearchBoxProps, ISearchBoxState> {
   }
 
   public render() {
-    let { labelText, className, disabled } = this.props;
+    let { labelText, className, disabled, underlined } = this.props;
     let { value, hasFocus, id } = this.state;
     return (
       <div
@@ -56,6 +56,7 @@ export class SearchBox extends BaseComponent<ISearchBoxProps, ISearchBoxState> {
           ['is-active ' + styles.rootIsActive]: hasFocus,
           ['is-disabled ' + styles.rootIsDisabled]: disabled,
           ['can-clear ' + styles.rootCanClear]: value!.length > 0,
+          ['is-underlined ' + styles.rootIsUnderlined]: underlined,
         }) }
         { ...{ onFocusCapture: this._onFocusCapture } }
       >
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
index 59789bce9d08a..4ed8e38691263 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
@@ -5,14 +5,18 @@ import {
   IComponentDemoPageProps,
   PropertiesTableSet
 } from '@uifabric/example-app-base';
-import { SearchBoxSmallExample } from './examples/SearchBox.Small.Example';
 import { SearchBoxFullSizeExample } from './examples/SearchBox.FullSize.Example';
+import { SearchBoxUnderlinedExample } from './examples/SearchBox.Underlined.Example';
+import { SearchBoxDisabledExample } from './examples/SearchBox.Disabled.Example';
+import { SearchBoxSmallExample } from './examples/SearchBox.Small.Example';
 import { FontClassNames } from '../../Styling';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { SearchBoxStatus } from './SearchBox.checklist';
 
-const SearchBoxSmallExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Small.Example.tsx') as string;
 const SearchBoxFullSizeExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.FullSize.Example.tsx') as string;
+const SearchBoxUnderlinedExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Underlined.Example.tsx') as string;
+const SearchBoxDisabledExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Disabled.Example.tsx') as string;
+const SearchBoxSmallExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Small.Example.tsx') as string;
 
 export class SearchBoxPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
@@ -22,12 +26,30 @@ export class SearchBoxPage extends React.Component<IComponentDemoPageProps, {}>
         componentName='SearchBoxExample'
         exampleCards={
           <div>
-            <ExampleCard title='Default SearchBox' code={ SearchBoxSmallExampleCode }>
-              <SearchBoxSmallExample />
-            </ExampleCard>
-            <ExampleCard title='SearchBox with no parent container' code={ SearchBoxFullSizeExampleCode }>
+            <ExampleCard
+              title='Default SearchBox'
+              code={ SearchBoxFullSizeExampleCode }
+            >
               <SearchBoxFullSizeExample />
             </ExampleCard>
+            <ExampleCard
+              title='Underlined SearchBox'
+              code={ SearchBoxUnderlinedExampleCode }
+            >
+              <SearchBoxUnderlinedExample />
+            </ExampleCard>
+            <ExampleCard
+              title='Disabled SearchBoxes'
+              code={ SearchBoxDisabledExampleCode }
+            >
+              <SearchBoxDisabledExample />
+            </ExampleCard>
+            <ExampleCard
+              title='SearchBox with fixed width and custom event handling'
+              code={ SearchBoxSmallExampleCode }
+            >
+              <SearchBoxSmallExample />
+            </ExampleCard>
           </div>
         }
         propertiesTables={
@@ -102,6 +124,7 @@ export class SearchBoxPage extends React.Component<IComponentDemoPageProps, {}>
               <li>Provide autocomplete suggestions where there are strong matches to the user's query that the user may want to view immediately.</li>
               <li>Use a visual separator to define a group of a similar or conceptually aligned autocomplete suggestions.</li>
               <li>If possible, provide a preview (e.g. image, title, etc.) for autocomplete suggestions to help the user quickly determine if the suggested result is what they were searching for.</li>
+              <li>Use the Underlined SearchBox for CommandBars.</li>
             </ul>
           </div>
         }
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Disabled.Example.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Disabled.Example.tsx
new file mode 100644
index 0000000000000..b80eaf14c03b4
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Disabled.Example.tsx
@@ -0,0 +1,26 @@
+import * as React from 'react';
+import { SearchBox } from 'office-ui-fabric-react/lib/SearchBox';
+import './SearchBox.Examples.scss';
+
+export class SearchBoxDisabledExample extends React.Component<any, any> {
+
+  public render() {
+    return (
+      <div className='ms-SearchBoxExample'>
+        <SearchBox
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
+          disabled
+        />
+
+        <SearchBox
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
+          underlined={ true }
+          disabled
+        />
+      </div>
+    );
+  }
+
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Examples.scss b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Examples.scss
new file mode 100644
index 0000000000000..da0cf18ed582a
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Examples.scss
@@ -0,0 +1,5 @@
+:global {
+  .ms-SearchBoxExample .ms-SearchBox {
+    margin: 0 0 10px 0;
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Underlined.Example.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Underlined.Example.tsx
new file mode 100644
index 0000000000000..bf6e6dc3c1414
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Underlined.Example.tsx
@@ -0,0 +1,16 @@
+import * as React from 'react';
+import { SearchBox } from 'office-ui-fabric-react/lib/SearchBox';
+
+export class SearchBoxUnderlinedExample extends React.Component<any, any> {
+
+  public render() {
+    return (
+      <SearchBox
+        onFocus={ () => console.log('onFocus called') }
+        onBlur={ () => console.log('onBlur called') }
+        underlined={ true }
+      />
+    );
+  }
+
+}
\ No newline at end of file

From 36e1182f5f4f9a268d93377d3bea12c493fb4e17 Mon Sep 17 00:00:00 2001
From: Michael Loughry <miclo@microsoft.com>
Date: Wed, 4 Oct 2017 13:35:36 -0700
Subject: [PATCH 0776/1641] TooltipHost: Specifying a className will no longer
 prevent innate Tooltip classes from being properly applied (#3027)

* Prevent `className` specified on TooltipHost from trampling innate Tooltip classes

* Add change file
---
 ...06-fix-tooltip-classname_2017-10-04-20-15.json | 11 +++++++++++
 .../src/components/Tooltip/Tooltip.tsx            | 15 ++++++++-------
 2 files changed, 19 insertions(+), 7 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/2906-fix-tooltip-classname_2017-10-04-20-15.json

diff --git a/common/changes/office-ui-fabric-react/2906-fix-tooltip-classname_2017-10-04-20-15.json b/common/changes/office-ui-fabric-react/2906-fix-tooltip-classname_2017-10-04-20-15.json
new file mode 100644
index 0000000000000..8957839acb77d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/2906-fix-tooltip-classname_2017-10-04-20-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "TooltipHost: Specifying a className will no longer prevent innate Tooltip classes from being properly applied",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
index 51786d97e7b79..16249063c2b0c 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
@@ -44,18 +44,19 @@ export class Tooltip extends BaseComponent<ITooltipProps, any> {
 
     return (
       <Callout
-        className={ mergeStyles(
-          'ms-Tooltip',
-          AnimationClassNames.fadeIn200,
-          styles.root,
-          (delay === TooltipDelay.medium) && styles.hasMediumDelay,
-          (maxWidth !== null) && { maxWidth: maxWidth }
-        )}
         target={ targetElement }
         directionalHint={ directionalHint }
         directionalHintForRTL={ directionalHintForRTL }
         {...calloutProps}
         { ...getNativeProps(this.props, divProperties) }
+        className={ mergeStyles(
+          'ms-Tooltip',
+          AnimationClassNames.fadeIn200,
+          styles.root,
+          (delay === TooltipDelay.medium) && styles.hasMediumDelay,
+          (maxWidth !== null) && { maxWidth: maxWidth },
+          this.props.className
+        ) }
       >
         <div className={ css('ms-Tooltip-content', styles.content) } id={ id } role='tooltip'>
           { onRenderContent(this.props, this._onRenderContent) }

From da8de4f924f3ad6381a53b734925858abdaed604 Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Wed, 4 Oct 2017 14:09:39 -0700
Subject: [PATCH 0777/1641] Fixing high-contrast issues (#2914)

* #2781, fixing HC Breadcrumb chrevron border

* #2854, HC context menu hover and select colors

* #2858, fixing border gaps in overlay

* #2766, HC tab pivot focus styling

* #2656, HC adjustments to calendar today and selected days

* #1903, making HC searchbox active border color different

* rush change

* Preventing system color from being used outside of HC mode
---
 ...brow-sept-contrast-bugs_2017-09-21-18-01.json | 11 +++++++++++
 .../src/components/Breadcrumb/Breadcrumb.scss    |  5 +++++
 .../src/components/Calendar/Calendar.scss        |  7 ++++++-
 .../ContextualMenu/ContextualMenu.scss           | 16 ++++++++++++++++
 .../Overlay/examples/Overlay.Example.scss        |  1 +
 .../src/components/Pivot/Pivot.scss              | 10 +++++++---
 .../src/components/SearchBox/SearchBox.scss      |  3 +++
 7 files changed, 49 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-sept-contrast-bugs_2017-09-21-18-01.json

diff --git a/common/changes/office-ui-fabric-react/v-krbrow-sept-contrast-bugs_2017-09-21-18-01.json b/common/changes/office-ui-fabric-react/v-krbrow-sept-contrast-bugs_2017-09-21-18-01.json
new file mode 100644
index 0000000000000..8d55603214d07
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-sept-contrast-bugs_2017-09-21-18-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "High contrast fixes for breadcrumb, contextualMenu, overlay, pivot, calendar, and searchbox",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss
index 21e1860d640d9..bff86ff2d2236 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss
@@ -29,6 +29,11 @@ $Breadcrumb-chevron-sm: 8px;
 .chevron {
   font-size: $ms-font-size-s;
   color: $ms-color-neutralSecondary;
+
+  @include high-contrast {
+    color: WindowText;
+    -ms-high-contrast-adjust: none;
+  }
 }
 
 .listItem {
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
index d74c1df2f76cb..285e1d1c34d52 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
@@ -117,6 +117,7 @@ $Calendar-dayPicker-margin: 10px;
   line-height: $Calendar-day;
   @include ms-font-m-plus;
   color: $ms-color-neutralPrimary;
+  box-sizing: border-box;
   // border-radius: 2px;
 }
 
@@ -154,6 +155,10 @@ $Calendar-dayPicker-margin: 10px;
 
 .day.dayIsHighlighted.dayIsFocused {
   @include focus-border(1px, $ms-color-white);
+
+  @include high-contrast {
+    @include focus-border(1px, WindowText);
+  }
 }
 
 // Highlighted and hovered/focused dates.
@@ -162,7 +167,7 @@ $Calendar-dayPicker-margin: 10px;
   cursor: pointer;
 
   @include high-contrast {
-    border: 1px solid Highlight;
+    border: 2px solid Highlight;
   }
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.scss b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.scss
index 624f2f8905fc9..165fc9565eece 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.scss
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.scss
@@ -57,6 +57,12 @@ $ContextualMenu-text-disabled: $menuTextDisabledColor;
 
   &:hover:not([disabled]) {
     background: $ContextualMenu-background-hover-color;
+
+    @include high-contrast {
+      background: Highlight;
+      color: HighlightText;
+      -ms-high-contrast-adjust: none;
+    }
   }
   &.isDisabled,
   &[disabled] {
@@ -77,6 +83,12 @@ $ContextualMenu-text-disabled: $menuTextDisabledColor;
     background: $ContextualMenu-background-selected-color;
     color: $ContextualMenu-text-selected-color;
     font-weight: $ms-font-weight-semibold;
+
+    @include high-contrast {
+      background: Highlight;
+      color: HighlightText;
+      -ms-high-contrast-adjust: none;
+    }
   }
 }
 
@@ -135,6 +147,10 @@ a.link {
 
 .iconColor {
   color: $ContextualMenu-icon-color;
+
+  @include high-contrast {
+    color: HighlightText;
+  }
 }
 
 .itemText {
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Example.scss b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Example.scss
index 89034da51cd75..7fe7f8a883af7 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Example.scss
@@ -8,6 +8,7 @@
     bottom: 0;
     left: 0;
     right: 0;
+    padding: 10px;
   }
 
 }
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.scss b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.scss
index 32794504855ad..a71d1f50eb1d8 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.scss
+++ b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.scss
@@ -169,6 +169,8 @@
     &:hover:not(.linkIsSelected):not(.linkIsOverflow),
     &:focus:not(.linkIsSelected):not(.linkIsOverflow) {
       color: $ms-color-black;
+      //prevent next tab from covering the focus outline
+      z-index: 1;
     }
 
     &:active {
@@ -192,10 +194,12 @@
         bottom: 0;
         content: '';
         height: auto;
+      }
 
-        @include high-contrast {
-          border: 1px solid WindowText;
-        }
+      @include high-contrast {
+        color: HighlightText;
+        background: Highlight;
+        -ms-high-contrast-adjust: none;
       }
     }
   }
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
index 32d8a4b741600..fb6d4bf5fe980 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
@@ -88,6 +88,9 @@
   &:hover {
     border-color: $ms-color-themePrimary;
   }
+  @include high-contrast {
+    border-color: Highlight;
+  }
   .iconContainer {
     width: 4px;
     transition: width $ms-animation-duration-1;

From 2b3f9a8827c67e9b3fe25004fc205c18c4dc0449 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 4 Oct 2017 14:53:44 -0700
Subject: [PATCH 0778/1641] Fixing jest: fixing flakey test, making console
 warnings fail build, disabling icon warnings. (#3026)

* Removing unnecessary store/connect utilities from common that weren't used.

* Adding ability to pass in -u into build jest command.

* Removing react-addons-test-utils completely.

* Removing accidental add.

* Removing another add.

* Removed extra comma

* updating shrinkwrap.

* Undoing shrinkwrap update.

* fixes
---
 .vscode/launch.json                           |   20 +
 apps/fabric-website/package.json              |    2 -
 apps/ssr-tests/package.json                   |    1 -
 apps/test-bundle-button/package.json          |    1 -
 apps/todo-app/package.json                    |    6 +-
 common/config/rush/npm-shrinkwrap.json        | 8493 ++++++-----------
 packages/experiments/jest.config.js           |    9 +-
 packages/experiments/src/common/tests.ts      |   26 +-
 .../components/CommandBar/CommandBar.test.tsx |    4 -
 .../office-ui-fabric-react/jest.config.js     |    9 +-
 packages/office-ui-fabric-react/package.json  |    2 -
 .../src/common/BaseStore.test.ts              |   31 -
 .../src/common/BaseStore.ts                   |   30 -
 .../src/common/ConnectedHost.tsx              |  130 -
 .../src/common/ISubscribable.ts               |    9 -
 .../src/common/StoreHost.tsx                  |   36 -
 .../src/common/StoreSet.ts                    |   30 -
 .../src/common/connect.test.tsx               |  168 -
 .../src/common/connect.tsx                    |   19 -
 .../src/common/storeKey.ts                    |   31 -
 .../src/common/tests.ts                       |   25 +-
 .../components/FocusZone/FocusZone.test.tsx   |    8 +-
 packages/utilities/package.json               |    2 -
 packages/utilities/src/BaseComponent.test.tsx |    2 +-
 packages/utilities/src/focus.test.tsx         |    2 +-
 scripts/tasks/jest-disable-warnings.js        |    4 +
 scripts/tasks/jest-resources.js               |    9 +-
 scripts/tasks/jest.js                         |    3 +-
 scripts/tasks/merge.js                        |   18 +
 scripts/tasks/webpack-resources.js            |   20 +-
 30 files changed, 3061 insertions(+), 6089 deletions(-)
 delete mode 100644 packages/office-ui-fabric-react/src/common/BaseStore.test.ts
 delete mode 100644 packages/office-ui-fabric-react/src/common/BaseStore.ts
 delete mode 100644 packages/office-ui-fabric-react/src/common/ConnectedHost.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/common/ISubscribable.ts
 delete mode 100644 packages/office-ui-fabric-react/src/common/StoreHost.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/common/StoreSet.ts
 delete mode 100644 packages/office-ui-fabric-react/src/common/connect.test.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/common/connect.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/common/storeKey.ts
 create mode 100644 scripts/tasks/jest-disable-warnings.js
 create mode 100644 scripts/tasks/merge.js

diff --git a/.vscode/launch.json b/.vscode/launch.json
index 2d0d8b0fc9038..8417aa2b9f476 100644
--- a/.vscode/launch.json
+++ b/.vscode/launch.json
@@ -21,6 +21,26 @@
       },
       "sourceMaps": true
     },
+    {
+      "name": "Debug test in experiments",
+      "type": "node",
+      "request": "launch",
+      "program": "${workspaceRoot}/scripts/build.js",
+      "cwd": "${workspaceRoot}/packages/experiments",
+      "stopOnEntry": false,
+      "args": [
+        "jest",
+      ],
+      "runtimeExecutable": null,
+      "runtimeArgs": [
+        "--nolazy",
+        "--debug"
+      ],
+      "env": {
+        "NODE_ENV": "development"
+      },
+      "sourceMaps": true
+    },
     {
       "name": "Debug build Production",
       "type": "node",
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 84cc7f0ad3c7e..513a216348899 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -27,7 +27,6 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/react": "15.0.38",
-    "@types/react-addons-test-utils": "0.14.19",
     "@types/react-dom": "15.5.1",
     "@types/webpack-env": "1.13.0",
     "enzyme": "^2.9.1",
@@ -37,7 +36,6 @@
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
     "react": "^15.6.1",
-    "react-addons-test-utils": "^15.4.2",
     "react-dom": "^15.6.1",
     "react-highlight": "0.9.0",
     "write-file-webpack-plugin": "^4.1.0"
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 01be0b2189004..5cea189044937 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -27,7 +27,6 @@
     "office-ui-fabric-react": ">=5.3.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
-    "react-addons-test-utils": "^15.4.2",
     "react-dom": "^15.6.1",
     "webpack": "^3.5.5"
   },
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index f97543f676a21..d064a4786a82c 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -17,7 +17,6 @@
   },
   "devDependencies": {
     "@types/react": "15.0.38",
-    "@types/react-addons-test-utils": "0.14.18",
     "@types/react-dom": "15.5.1",
     "@types/webpack-env": "1.13.0",
     "@types/prop-types": "15.5.1",
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 29aec7f2fb08c..4d462dd71f09d 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -14,11 +14,9 @@
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "2.2.39",
     "@types/react": "15.0.38",
-    "@types/react-addons-test-utils": "0.14.18",
     "@types/react-dom": "15.5.1",
     "@types/webpack-env": "1.13.0",
-    "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
-    "react-addons-test-utils": "^15.4.2"
+    "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
@@ -30,4 +28,4 @@
     "typescript": "2.4.2",
     "tslib": "^1.7.1"
   }
-}
\ No newline at end of file
+}
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 694faea5ca419..202089becb747 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -19,4977 +19,1735 @@
       "integrity": "sha1-apeiLzpi5UwLUwo+jxSYrSuE19w="
     },
     "@rush-temp/build": {
-      "version": "file:projects\\build",
+      "version": "file:projects/build"
+    },
+    "@rush-temp/example-app-base": {
+      "version": "file:projects/example-app-base"
+    },
+    "@rush-temp/experiments": {
+      "version": "file:projects/experiments",
       "dependencies": {
-        "acorn": {
-          "version": "5.1.1",
-          "bundled": true
-        },
-        "ajv": {
-          "version": "5.2.2",
-          "bundled": true
-        },
-        "ajv-keywords": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "ansi-regex": {
-          "version": "3.0.0",
+        "sinon": {
+          "version": "2.4.1",
           "bundled": true
-        },
-        "ansi-styles": {
-          "version": "2.2.1",
+        }
+      }
+    },
+    "@rush-temp/fabric-website": {
+      "version": "file:projects/fabric-website"
+    },
+    "@rush-temp/icons": {
+      "version": "file:projects/icons"
+    },
+    "@rush-temp/merge-styles": {
+      "version": "file:projects/merge-styles",
+      "dependencies": {
+        "@types/jest": {
+          "version": "21.1.0",
           "bundled": true
-        },
-        "async": {
-          "version": "2.5.0",
+        }
+      }
+    },
+    "@rush-temp/office-ui-fabric-react": {
+      "version": "file:projects/office-ui-fabric-react",
+      "dependencies": {
+        "@types/jest": {
+          "version": "21.1.0",
           "bundled": true
         },
-        "autoprefixer": {
-          "version": "7.1.2",
+        "@types/react-dom": {
+          "version": "15.5.5",
           "bundled": true
         },
-        "browserslist": {
-          "version": "2.3.3",
+        "sinon": {
+          "version": "2.4.1",
           "bundled": true
-        },
-        "camelcase": {
-          "version": "4.1.0",
+        }
+      }
+    },
+    "@rush-temp/office-ui-fabric-react-tslint": {
+      "version": "file:projects/office-ui-fabric-react-tslint"
+    },
+    "@rush-temp/ssr-tests": {
+      "version": "file:projects/ssr-tests"
+    },
+    "@rush-temp/styling": {
+      "version": "file:projects/styling"
+    },
+    "@rush-temp/test-bundle-button": {
+      "version": "file:projects/test-bundle-button"
+    },
+    "@rush-temp/todo-app": {
+      "version": "file:projects/todo-app"
+    },
+    "@rush-temp/utilities": {
+      "version": "file:projects/utilities",
+      "dependencies": {
+        "@types/jest": {
+          "version": "21.1.0",
           "bundled": true
         },
-        "cliui": {
-          "version": "3.2.0",
-          "bundled": true,
-          "dependencies": {
-            "ansi-regex": {
-              "version": "2.1.1",
-              "bundled": true
-            },
-            "is-fullwidth-code-point": {
-              "version": "1.0.0",
-              "bundled": true
-            },
-            "string-width": {
-              "version": "1.0.2",
-              "bundled": true
-            },
-            "strip-ansi": {
-              "version": "3.0.1",
-              "bundled": true
-            }
-          }
-        },
-        "constants-browserify": {
-          "version": "1.0.0",
+        "sinon": {
+          "version": "2.4.1",
           "bundled": true
-        },
-        "crypto-browserify": {
-          "version": "3.11.1",
+        }
+      }
+    },
+    "@rush-temp/vr-tests": {
+      "version": "file:projects/vr-tests",
+      "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
           "bundled": true
         },
-        "css-loader": {
-          "version": "0.28.5",
+        "chalk": {
+          "version": "1.1.3",
           "bundled": true,
           "dependencies": {
-            "ansi-regex": {
-              "version": "2.1.1",
-              "bundled": true
-            },
-            "chalk": {
-              "version": "1.1.3",
-              "bundled": true,
-              "dependencies": {
-                "supports-color": {
-                  "version": "2.0.0",
-                  "bundled": true
-                }
-              }
-            },
-            "has-flag": {
-              "version": "1.0.0",
-              "bundled": true
-            },
-            "postcss": {
-              "version": "5.2.17",
-              "bundled": true
-            },
-            "strip-ansi": {
-              "version": "3.0.1",
-              "bundled": true
-            },
             "supports-color": {
-              "version": "3.2.3",
+              "version": "2.0.0",
               "bundled": true
             }
           }
         },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true
-        },
-        "enhanced-resolve": {
-          "version": "3.4.1",
-          "bundled": true
-        },
-        "etag": {
-          "version": "1.8.0",
-          "bundled": true
-        },
-        "express": {
-          "version": "4.15.4",
-          "bundled": true
-        },
-        "find-up": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "fresh": {
-          "version": "0.5.0",
+        "css-loader": {
+          "version": "0.27.3",
           "bundled": true
         },
         "has-flag": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "isarray": {
           "version": "1.0.0",
           "bundled": true
         },
-        "load-json-file": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "loader-utils": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "lodash.camelcase": {
-          "version": "4.3.0",
-          "bundled": true
-        },
-        "mime": {
-          "version": "1.3.4",
-          "bundled": true
-        },
-        "node-libs-browser": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "os-browserify": {
-          "version": "0.2.1",
-          "bundled": true
-        },
-        "os-locale": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "path-to-regexp": {
-          "version": "0.1.7",
-          "bundled": true
-        },
-        "path-type": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "pify": {
-          "version": "2.3.0",
-          "bundled": true
-        },
-        "qs": {
-          "version": "6.5.0",
-          "bundled": true
-        },
-        "read-pkg": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg-up": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "bundled": true,
-          "dependencies": {
-            "string_decoder": {
-              "version": "1.0.3",
-              "bundled": true
-            }
-          }
-        },
-        "semver": {
-          "version": "5.4.1",
-          "bundled": true
-        },
-        "send": {
-          "version": "0.15.4",
+        "postcss": {
+          "version": "5.2.18",
           "bundled": true
         },
-        "serve-static": {
-          "version": "1.12.4",
+        "postcss-loader": {
+          "version": "1.3.3",
           "bundled": true
         },
         "source-list-map": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "bundled": true
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "2.1.1",
+          "version": "0.1.8",
           "bundled": true
         },
-        "strip-ansi": {
-          "version": "4.0.0",
+        "source-map": {
+          "version": "0.5.7",
           "bundled": true
         },
-        "strip-bom": {
-          "version": "3.0.0",
+        "style-loader": {
+          "version": "0.16.1",
           "bundled": true
         },
         "supports-color": {
-          "version": "4.2.1",
-          "bundled": true
-        },
-        "tapable": {
-          "version": "0.2.8",
-          "bundled": true
-        },
-        "timers-browserify": {
-          "version": "2.0.4",
-          "bundled": true
-        },
-        "tslint": {
-          "version": "5.6.0",
-          "bundled": true
-        },
-        "ultron": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "url": {
-          "version": "0.11.0",
-          "bundled": true,
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "bundled": true
-            }
-          }
-        },
-        "utils-merge": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "watchpack": {
-          "version": "1.4.0",
-          "bundled": true
-        },
-        "webpack": {
-          "version": "3.5.5",
-          "bundled": true,
-          "dependencies": {
-            "yargs": {
-              "version": "8.0.2",
-              "bundled": true
-            }
-          }
-        },
-        "webpack-bundle-analyzer": {
-          "version": "2.9.0",
-          "bundled": true,
-          "dependencies": {
-            "ansi-regex": {
-              "version": "2.1.1",
-              "bundled": true
-            },
-            "chalk": {
-              "version": "1.1.3",
-              "bundled": true
-            },
-            "lodash": {
-              "version": "4.17.4",
-              "bundled": true
-            },
-            "strip-ansi": {
-              "version": "3.0.1",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "2.0.0",
-              "bundled": true
-            }
-          }
-        },
-        "webpack-sources": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "which-module": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "ws": {
-          "version": "2.3.1",
-          "bundled": true,
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "bundled": true
-            }
-          }
-        },
-        "yargs-parser": {
-          "version": "7.0.0",
+          "version": "3.2.3",
           "bundled": true
         }
       }
     },
-    "@rush-temp/example-app-base": {
-      "version": "file:projects\\example-app-base",
+    "@storybook/addon-actions": {
+      "version": "3.2.12",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-actions/-/addon-actions-3.2.12.tgz",
+      "integrity": "sha512-or4PAzYD2aUQ7E52zZkB97S96r7YUh15ZiLJesMYoJPs44gNFTCuvThO63yvV5IslD0v8gINgS9muOE0aEI+gg=="
+    },
+    "@storybook/addon-links": {
+      "version": "3.2.12",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-links/-/addon-links-3.2.12.tgz",
+      "integrity": "sha512-8cv5Pcoersdbp3QrYnzp+vXpCut4EIWEVoqkJUDosC4r+qT36nnq3l+Ot7ic9R4f87CdPM/Wjt2qzgTpamoSvA=="
+    },
+    "@storybook/addon-options": {
+      "version": "3.2.3",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-options/-/addon-options-3.2.3.tgz",
+      "integrity": "sha1-6jdA0onUKc52fpaZvzpkfddBWS0="
+    },
+    "@storybook/addons": {
+      "version": "3.2.12",
+      "resolved": "https://registry.npmjs.org/@storybook/addons/-/addons-3.2.12.tgz",
+      "integrity": "sha512-gbbW68MWfDxsht9v9V/rqx6aVZUBw6akwyv45T5+lM23Sy7GfoOQ0jR7eRl+DM4KmA/74P/rIZRu0mznT9IfCg=="
+    },
+    "@storybook/channel-postmessage": {
+      "version": "3.2.12",
+      "resolved": "https://registry.npmjs.org/@storybook/channel-postmessage/-/channel-postmessage-3.2.12.tgz",
+      "integrity": "sha512-IjSI7Mjf/u+Msf8Jm+zlYlTuzYxj2yvcQV/rFkm7fkhmv2UAZTsb5B8Mi3KKN7Lr9d5eRumLCtUBkzkBOcSzSg=="
+    },
+    "@storybook/channels": {
+      "version": "3.2.12",
+      "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-3.2.12.tgz",
+      "integrity": "sha512-smexrg30+mlXIsS/z/0CN+a3Tn/DePZETnu3G42r8Qdm7PbdRo1oC2pcHAEmIjaukRp5qK+txuDJ6WdOvyVsMw=="
+    },
+    "@storybook/components": {
+      "version": "3.2.12",
+      "resolved": "https://registry.npmjs.org/@storybook/components/-/components-3.2.12.tgz",
+      "integrity": "sha512-vMVrPmXKP7Rh3JfHfN7dAf+MJkjyl0iaU4TePsSZD3esqpkr24H+yw0HiLKBsINPJvFlEGLfDT73urXcb4oPQQ=="
+    },
+    "@storybook/react": {
+      "version": "3.2.12",
+      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-3.2.12.tgz",
+      "integrity": "sha512-/TWoVYHfoUnEAjcEj463zRIA7SJjB6RIzShFzI2HtJw+P2EdT8mFN2EYGdsuGHQqkbGSC3owHSy1Jxuy1GVuqQ==",
       "dependencies": {
-        "acorn": {
-          "version": "5.1.1",
-          "bundled": true
-        },
-        "ajv": {
-          "version": "5.2.2",
-          "bundled": true
-        },
-        "ajv-keywords": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "ansi-regex": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "async": {
-          "version": "2.5.0",
-          "bundled": true
-        },
-        "camelcase": {
-          "version": "4.1.0",
-          "bundled": true
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "bundled": true,
-          "dependencies": {
-            "ansi-regex": {
-              "version": "2.1.1",
-              "bundled": true
-            },
-            "strip-ansi": {
-              "version": "3.0.1",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "2.0.0",
-              "bundled": true
-            }
-          }
-        },
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true
-        },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "crypto-browserify": {
-          "version": "3.11.1",
-          "bundled": true
-        },
-        "css-loader": {
-          "version": "0.28.5",
-          "bundled": true
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true,
-          "dependencies": {
-            "ms": {
-              "version": "2.0.0",
-              "bundled": true
-            }
-          }
-        },
-        "diff": {
-          "version": "3.2.0",
-          "bundled": true
-        },
-        "enhanced-resolve": {
-          "version": "3.4.1",
-          "bundled": true
-        },
-        "find-up": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "glob": {
-          "version": "7.1.1",
-          "bundled": true
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "load-json-file": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "loader-utils": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "lodash.camelcase": {
-          "version": "4.3.0",
-          "bundled": true
-        },
-        "mocha": {
-          "version": "3.5.0",
-          "bundled": true
-        },
-        "ms": {
-          "version": "0.7.2",
-          "bundled": true
-        },
-        "node-libs-browser": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "os-browserify": {
-          "version": "0.2.1",
-          "bundled": true
-        },
-        "os-locale": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "path-type": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "postcss": {
-          "version": "5.2.17",
-          "bundled": true,
-          "dependencies": {
-            "supports-color": {
-              "version": "3.2.3",
-              "bundled": true
-            }
-          }
-        },
-        "read-pkg": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg-up": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "bundled": true,
-          "dependencies": {
-            "string_decoder": {
-              "version": "1.0.3",
-              "bundled": true
-            }
-          }
-        },
-        "source-list-map": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "0.9.2",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "0.2.17",
-              "bundled": true
-            }
-          }
-        },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "strip-ansi": {
-          "version": "4.0.0",
-          "bundled": true
-        },
-        "strip-bom": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "style-loader": {
-          "version": "0.17.0",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "3.1.2",
-          "bundled": true
-        },
-        "tapable": {
-          "version": "0.2.8",
-          "bundled": true
-        },
-        "timers-browserify": {
-          "version": "2.0.4",
-          "bundled": true
-        },
-        "url": {
-          "version": "0.11.0",
-          "bundled": true,
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "bundled": true
-            }
-          }
-        },
-        "watchpack": {
-          "version": "1.4.0",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            }
-          }
-        },
-        "webpack": {
-          "version": "3.5.5",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            },
-            "has-flag": {
-              "version": "2.0.0",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "1.1.0",
-              "bundled": true
-            },
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "4.2.1",
-              "bundled": true
-            }
-          }
-        },
-        "webpack-sources": {
-          "version": "1.0.1",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            }
-          }
-        },
-        "which-module": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "yargs": {
-          "version": "8.0.2",
-          "bundled": true
-        },
-        "yargs-parser": {
-          "version": "7.0.0",
-          "bundled": true
+        "file-loader": {
+          "version": "0.11.2",
+          "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.11.2.tgz",
+          "integrity": "sha512-N+uhF3mswIFeziHQjGScJ/yHXYt3DiLBeC+9vWW+WjUBiClMSOlV1YrXQi+7KM2aA3Rn4Bybgv+uXFQbfkzpvg=="
         }
       }
     },
-    "@rush-temp/experiments": {
-      "version": "file:projects\\experiments",
+    "@storybook/react-fuzzy": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/@storybook/react-fuzzy/-/react-fuzzy-0.4.0.tgz",
+      "integrity": "sha1-KWHoofbBr8zpfp6aFNHf6dkGEIc="
+    },
+    "@storybook/ui": {
+      "version": "3.2.12",
+      "resolved": "https://registry.npmjs.org/@storybook/ui/-/ui-3.2.12.tgz",
+      "integrity": "sha512-g7O+YO92qJiWqgSp1U1q4sSgiobNxRBSWCrlYmRfHAUzEzD4cgYDnlldFWWUvR4zCEOCIG/MbJKtqG4727srNg=="
+    },
+    "@types/chai": {
+      "version": "3.4.35",
+      "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.35.tgz",
+      "integrity": "sha1-6NZfg0ktKUT4FvxiB0GCHCioyQA="
+    },
+    "@types/cheerio": {
+      "version": "0.22.2",
+      "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.2.tgz",
+      "integrity": "sha512-7YJQbllem83umRzZ+ry6RZFAbBWNoHvbiW6tE5VEAJIoX6F22hrKrBw3ibRvHm2zPnOhZGrZJusAbp1zZKcLzQ=="
+    },
+    "@types/enzyme": {
+      "version": "2.8.8",
+      "resolved": "https://registry.npmjs.org/@types/enzyme/-/enzyme-2.8.8.tgz",
+      "integrity": "sha512-KBw0ZzOQNtwVGO4egRjEpQbXMFCSevy+gRFzaLXrU64LrVVuJF0FqVIdzed0NCSP+nMALj001//dwYKV/VDlCA=="
+    },
+    "@types/es6-promise": {
+      "version": "0.0.32",
+      "resolved": "https://registry.npmjs.org/@types/es6-promise/-/es6-promise-0.0.32.tgz",
+      "integrity": "sha1-O89E+x5Cnz33YYjIxth0Rjujcf0="
+    },
+    "@types/highlight.js": {
+      "version": "9.1.9",
+      "resolved": "https://registry.npmjs.org/@types/highlight.js/-/highlight.js-9.1.9.tgz",
+      "integrity": "sha1-7WM2lV6vIzt163kjubHzc9BF7wE="
+    },
+    "@types/jest": {
+      "version": "21.1.2",
+      "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.2.tgz",
+      "integrity": "sha512-mZ0zVDNxpz44GzPHtKCFOUDEdcRUk2c1fDzWCpiGuyeJLLMOLuLlzuqOQk5fufVUJarwm4aZcQHLdYH22h25zg=="
+    },
+    "@types/mocha": {
+      "version": "2.2.39",
+      "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.39.tgz",
+      "integrity": "sha1-9o1j24tpw46VWLQHNSXPlsT3qCk="
+    },
+    "@types/node": {
+      "version": "8.0.26",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-8.0.26.tgz",
+      "integrity": "sha512-wbKN0MB4XsjdnSE04HiCzLoBDirGCM6zXrqavSj44nZnPFYpnrTF64E9O6Xmf0ca/IuKK/BHUcXwMiwk92gW6Q=="
+    },
+    "@types/prop-types": {
+      "version": "15.5.1",
+      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.5.1.tgz",
+      "integrity": "sha1-Hs9SYhKZ5luFU3Qzf7Ef0tEGb8E="
+    },
+    "@types/react": {
+      "version": "15.0.38",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.38.tgz",
+      "integrity": "sha512-CkRB27L/kMDu7K20U0V7BwYK9/kPd9Im6Jlxv2vAEolYBvQy6JrSpPJsbZXtOk4MoDUomkct8Q7PNBUSLd0fmg=="
+    },
+    "@types/react-addons-test-utils": {
+      "version": "0.14.18",
+      "resolved": "https://registry.npmjs.org/@types/react-addons-test-utils/-/react-addons-test-utils-0.14.18.tgz",
+      "integrity": "sha1-g+EK8dvl7CU1vC3FNz17w7gv3uE="
+    },
+    "@types/react-dom": {
+      "version": "15.5.1",
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-15.5.1.tgz",
+      "integrity": "sha512-4c+e/QPfvSa48YhgGOcQWoHishTo6BuJqka0Bh8qeLdnK1jS+1Nz8W/w1G17AIjtLxONYFUqmi8qyt+8p/yMFA=="
+    },
+    "@types/react-test-renderer": {
+      "version": "15.5.4",
+      "resolved": "https://registry.npmjs.org/@types/react-test-renderer/-/react-test-renderer-15.5.4.tgz",
+      "integrity": "sha512-9gESAOcTd/sUuTdngpDpR8qTkDvxPOHNjedxzRyyTmXoqnMtBM04DfOEKmoM4ZuD2DrQVN4JRwpaE02hvsqH0A=="
+    },
+    "@types/resemblejs": {
+      "version": "1.3.28",
+      "resolved": "https://registry.npmjs.org/@types/resemblejs/-/resemblejs-1.3.28.tgz",
+      "integrity": "sha1-Lg2ztf2w8vPUVPXXLhMkEgnql60="
+    },
+    "@types/sinon": {
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/@types/sinon/-/sinon-2.2.2.tgz",
+      "integrity": "sha1-qA2khougisysvOTTcnbzXhugpS8="
+    },
+    "@types/storybook__react": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/@types/storybook__react/-/storybook__react-3.0.5.tgz",
+      "integrity": "sha512-febLx40iQWoQKVaEMpxdzkJnqncPHoRivlilc3JhHJiRuBY1Mqa1yTKcvQ5RiFAYFIuv4x+bRuSIXErk5v41Bg=="
+    },
+    "@types/webpack-env": {
+      "version": "1.13.0",
+      "resolved": "https://registry.npmjs.org/@types/webpack-env/-/webpack-env-1.13.0.tgz",
+      "integrity": "sha1-MEQ4FkfhHulzxa8uklMjkw9pHYA="
+    },
+    "@uifabric/icons": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.0.1.tgz",
+      "integrity": "sha512-oND+ez0D1jmOK8svzMFGtwkRMR0n3IdFcAb4RAflR7A0n+t6U0R+s3YOnoNuT8jAkmyBEgkqEj9rScE+p7749Q=="
+    },
+    "@uifabric/merge-styles": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.2.0.tgz",
+      "integrity": "sha512-5UNjp2VcxrNHR5JpY5xy6gEQMB5ZanVJUX3fTVsdz3vOKnh6u/LL1FhDAP7dHFSrCRwohT5jPHzbMCXcs3UJlA=="
+    },
+    "@uifabric/styling": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.1.0.tgz",
+      "integrity": "sha512-M4dUt0RoRvnqVFIplxcNZ9xCoOyXdOvnEt4lEOnpzipw0/gFvILYqcc34WmVX8KVL6FB8CJW2hKj8EUciwlDBQ=="
+    },
+    "@uifabric/utilities": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.0.1.tgz",
+      "integrity": "sha512-HUhh3EKUiZshpbNxcgkwQ6WcTKT3+rlhfX/pSeLElRTGbORYxdoWFDwVfFZT71xP2hFnUQI/Z5qb9BLdKeJpRA=="
+    },
+    "abab": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/abab/-/abab-1.0.4.tgz",
+      "integrity": "sha1-X6rZwsB/YN12dw9xzwJbYqY8/U4="
+    },
+    "abbrev": {
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.0.9.tgz",
+      "integrity": "sha1-kbR5JYinc4wl813W9jdSovh3YTU="
+    },
+    "accepts": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.3.tgz",
+      "integrity": "sha1-w8p0NJOGSMPg2cHjKN1otiLChMo="
+    },
+    "acorn": {
+      "version": "4.0.13",
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
+      "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c="
+    },
+    "acorn-dynamic-import": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/acorn-dynamic-import/-/acorn-dynamic-import-2.0.2.tgz",
+      "integrity": "sha1-x1K9IQvvZ5UBtsbLf8hPj0cVjMQ="
+    },
+    "acorn-globals": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/acorn-globals/-/acorn-globals-3.1.0.tgz",
+      "integrity": "sha1-/YJw9x+7SZawBPqIDuXUZXOnMb8="
+    },
+    "after": {
+      "version": "0.8.2",
+      "resolved": "https://registry.npmjs.org/after/-/after-0.8.2.tgz",
+      "integrity": "sha1-/ts5T58OAqqXaOcCvaI7UF+ufh8="
+    },
+    "agent-base": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-2.1.1.tgz",
+      "integrity": "sha1-1t4Q1a9hMtW9aSQn1G/FOFOQlMc="
+    },
+    "airbnb-js-shims": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/airbnb-js-shims/-/airbnb-js-shims-1.3.0.tgz",
+      "integrity": "sha512-Y/9jgf3uEdNyeWPUV1N49FowM/qMIiKSTkRUpYT4jpHkSADfTiRVwI8Mm6o4CIxhnBK1uMf4RIYNYKwwILMCAQ=="
+    },
+    "ajv": {
+      "version": "5.2.3",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-5.2.3.tgz",
+      "integrity": "sha1-wG9Zh3jETGsWGrr+NGa4GtGBTtI="
+    },
+    "ajv-keywords": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-2.1.0.tgz",
+      "integrity": "sha1-opbhf3v658HOT34N5T0pyzIWLfA="
+    },
+    "align-text": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/align-text/-/align-text-0.1.4.tgz",
+      "integrity": "sha1-DNkKVhCT810KmSVsIrcGlDP60Rc=",
       "dependencies": {
-        "acorn": {
-          "version": "5.1.1",
-          "bundled": true
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+        }
+      }
+    },
+    "alphanum-sort": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/alphanum-sort/-/alphanum-sort-1.0.2.tgz",
+      "integrity": "sha1-l6ERlkmyEa0zaR2fn0hqjsn74KM="
+    },
+    "amdefine": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz",
+      "integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU="
+    },
+    "ansi-escapes": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-3.0.0.tgz",
+      "integrity": "sha512-O/klc27mWNUigtv0F8NJWbLF00OcegQalkqKURWdosW08YZKi4m6CnSUSvIZG1otNJbTWhN01Hhz389DW7mvDQ=="
+    },
+    "ansi-html": {
+      "version": "0.0.7",
+      "resolved": "https://registry.npmjs.org/ansi-html/-/ansi-html-0.0.7.tgz",
+      "integrity": "sha1-gTWEAhliqenm/QOflA0S9WynhZ4="
+    },
+    "ansi-regex": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
+      "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
+    },
+    "ansi-styles": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
+      "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
+    },
+    "ansicolors": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/ansicolors/-/ansicolors-0.2.1.tgz",
+      "integrity": "sha1-vgiVmQl7dKXJxKhKDNvNtivYeu8="
+    },
+    "anymatch": {
+      "version": "1.3.2",
+      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-1.3.2.tgz",
+      "integrity": "sha512-0XNayC8lTHQ2OI8aljNCN3sSx6hsr/1+rlcDAotXJR7C1oZZHCNsfpbKwMjRA3Uqb5tF1Rae2oloTr4xpq+WjA==",
+      "dependencies": {
+        "arr-diff": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
+          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8="
         },
-        "ajv": {
-          "version": "5.2.2",
-          "bundled": true
-        },
-        "ajv-keywords": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "ansi-regex": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "async": {
-          "version": "2.5.0",
-          "bundled": true
-        },
-        "autoprefixer": {
-          "version": "6.7.7",
-          "bundled": true
-        },
-        "browserslist": {
-          "version": "1.7.7",
-          "bundled": true
-        },
-        "camelcase": {
-          "version": "4.1.0",
-          "bundled": true
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "bundled": true,
-          "dependencies": {
-            "ansi-regex": {
-              "version": "2.1.1",
-              "bundled": true
-            },
-            "strip-ansi": {
-              "version": "3.0.1",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "2.0.0",
-              "bundled": true
-            }
-          }
-        },
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true
-        },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "crypto-browserify": {
-          "version": "3.11.1",
-          "bundled": true
-        },
-        "css-loader": {
-          "version": "0.28.5",
-          "bundled": true
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true
-        },
-        "diff": {
-          "version": "3.2.0",
-          "bundled": true
-        },
-        "enhanced-resolve": {
-          "version": "3.4.1",
-          "bundled": true
-        },
-        "find-up": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "glob": {
-          "version": "7.1.1",
-          "bundled": true
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "load-json-file": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "loader-utils": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "lodash.camelcase": {
-          "version": "4.3.0",
-          "bundled": true
-        },
-        "mocha": {
-          "version": "3.5.0",
-          "bundled": true
-        },
-        "node-libs-browser": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "os-browserify": {
+        "array-unique": {
           "version": "0.2.1",
-          "bundled": true
-        },
-        "os-locale": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "path-type": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "postcss": {
-          "version": "5.2.17",
-          "bundled": true,
-          "dependencies": {
-            "supports-color": {
-              "version": "3.2.3",
-              "bundled": true
-            }
-          }
-        },
-        "postcss-loader": {
-          "version": "1.3.3",
-          "bundled": true
-        },
-        "read-pkg": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg-up": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "bundled": true,
-          "dependencies": {
-            "string_decoder": {
-              "version": "1.0.3",
-              "bundled": true
-            }
-          }
-        },
-        "sinon": {
-          "version": "2.4.1",
-          "bundled": true
-        },
-        "source-list-map": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "strip-ansi": {
-          "version": "4.0.0",
-          "bundled": true
-        },
-        "strip-bom": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "style-loader": {
-          "version": "0.17.0",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "3.1.2",
-          "bundled": true
-        },
-        "tapable": {
-          "version": "0.2.8",
-          "bundled": true
-        },
-        "timers-browserify": {
-          "version": "2.0.4",
-          "bundled": true
-        },
-        "url": {
-          "version": "0.11.0",
-          "bundled": true,
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "bundled": true
-            }
-          }
-        },
-        "watchpack": {
-          "version": "1.4.0",
-          "bundled": true
+          "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
+          "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM="
         },
-        "webpack": {
-          "version": "3.5.5",
-          "bundled": true,
-          "dependencies": {
-            "has-flag": {
-              "version": "2.0.0",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "4.2.1",
-              "bundled": true
-            }
-          }
+        "braces": {
+          "version": "1.8.5",
+          "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
+          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
         },
-        "webpack-sources": {
-          "version": "1.0.1",
-          "bundled": true
+        "expand-brackets": {
+          "version": "0.1.5",
+          "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
+          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s="
         },
-        "which-module": {
-          "version": "2.0.0",
-          "bundled": true
+        "extglob": {
+          "version": "0.3.2",
+          "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
+          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
         },
-        "yargs": {
-          "version": "8.0.2",
-          "bundled": true
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
         },
-        "yargs-parser": {
-          "version": "7.0.0",
-          "bundled": true
+        "micromatch": {
+          "version": "2.3.11",
+          "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
+          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
         }
       }
     },
-    "@rush-temp/fabric-website": {
-      "version": "file:projects\\fabric-website",
-      "dependencies": {
-        "@types/react-addons-test-utils": {
-          "version": "0.14.19",
-          "bundled": true
-        },
-        "acorn": {
-          "version": "5.1.1",
-          "bundled": true
-        },
-        "ajv": {
-          "version": "5.2.2",
-          "bundled": true
-        },
-        "ajv-keywords": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "ansi-regex": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "async": {
-          "version": "2.5.0",
-          "bundled": true
-        },
-        "autoprefixer": {
-          "version": "6.7.7",
-          "bundled": true
-        },
-        "browserslist": {
-          "version": "1.7.7",
-          "bundled": true
-        },
-        "camelcase": {
-          "version": "4.1.0",
-          "bundled": true
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "bundled": true,
-          "dependencies": {
-            "ansi-regex": {
-              "version": "2.1.1",
-              "bundled": true
-            },
-            "strip-ansi": {
-              "version": "3.0.1",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "2.0.0",
-              "bundled": true
-            }
-          }
-        },
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true
-        },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "crypto-browserify": {
-          "version": "3.11.1",
-          "bundled": true
-        },
-        "css-loader": {
-          "version": "0.28.5",
-          "bundled": true
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true
-        },
-        "diff": {
-          "version": "3.2.0",
-          "bundled": true
-        },
-        "enhanced-resolve": {
-          "version": "3.4.1",
-          "bundled": true
-        },
-        "find-up": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "glob": {
-          "version": "7.1.1",
-          "bundled": true
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "load-json-file": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "loader-utils": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "lodash.camelcase": {
-          "version": "4.3.0",
-          "bundled": true
-        },
-        "mocha": {
-          "version": "3.5.0",
-          "bundled": true
-        },
-        "node-libs-browser": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "os-browserify": {
-          "version": "0.2.1",
-          "bundled": true
-        },
-        "os-locale": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "path-type": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "postcss": {
-          "version": "5.2.17",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.7",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "3.2.3",
-              "bundled": true
-            }
-          }
-        },
-        "postcss-loader": {
-          "version": "1.3.3",
-          "bundled": true
-        },
-        "react": {
-          "version": "15.6.1",
-          "bundled": true
-        },
-        "react-dom": {
-          "version": "15.6.1",
-          "bundled": true
-        },
-        "react-highlight": {
-          "version": "0.9.0",
-          "bundled": true
-        },
-        "read-pkg": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg-up": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "bundled": true,
-          "dependencies": {
-            "string_decoder": {
-              "version": "1.0.3",
-              "bundled": true
-            }
-          }
-        },
-        "sinon": {
-          "version": "2.4.1",
-          "bundled": true
-        },
-        "source-list-map": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "0.9.2",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "0.2.17",
-              "bundled": true
-            }
-          }
-        },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "strip-ansi": {
-          "version": "4.0.0",
-          "bundled": true
-        },
-        "strip-bom": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "3.1.2",
-          "bundled": true
-        },
-        "tapable": {
-          "version": "0.2.8",
-          "bundled": true
-        },
-        "timers-browserify": {
-          "version": "2.0.4",
-          "bundled": true
-        },
-        "url": {
-          "version": "0.11.0",
-          "bundled": true,
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "bundled": true
-            }
-          }
-        },
-        "watchpack": {
-          "version": "1.4.0",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            }
-          }
-        },
-        "webpack": {
-          "version": "3.5.5",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            },
-            "camelcase": {
-              "version": "4.1.0",
-              "bundled": true
-            },
-            "has-flag": {
-              "version": "2.0.0",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "1.1.0",
-              "bundled": true
-            },
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "4.2.1",
-              "bundled": true
-            },
-            "yargs": {
-              "version": "8.0.2",
-              "bundled": true
-            },
-            "yargs-parser": {
-              "version": "7.0.0",
-              "bundled": true
-            }
-          }
-        },
-        "webpack-sources": {
-          "version": "1.0.1",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            }
-          }
-        },
-        "which-module": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "yargs": {
-          "version": "8.0.2",
-          "bundled": true
-        },
-        "yargs-parser": {
-          "version": "7.0.0",
-          "bundled": true
-        }
-      }
-    },
-    "@rush-temp/icons": {
-      "version": "file:projects\\icons"
-    },
-    "@rush-temp/merge-styles": {
-      "version": "file:projects\\merge-styles",
-      "dependencies": {
-        "@types/jest": {
-          "version": "21.1.0",
-          "bundled": true
-        },
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true
-        },
-        "diff": {
-          "version": "3.2.0",
-          "bundled": true
-        },
-        "glob": {
-          "version": "7.1.1",
-          "bundled": true
-        },
-        "mocha": {
-          "version": "3.5.0",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "3.1.2",
-          "bundled": true
-        }
-      }
-    },
-    "@rush-temp/office-ui-fabric-react": {
-      "version": "file:projects\\office-ui-fabric-react",
-      "dependencies": {
-        "@types/jest": {
-          "version": "21.1.0",
-          "bundled": true
-        },
-        "@types/react-dom": {
-          "version": "15.5.5",
-          "bundled": true
-        },
-        "acorn": {
-          "version": "5.1.1",
-          "bundled": true
-        },
-        "ajv": {
-          "version": "5.2.2",
-          "bundled": true
-        },
-        "ajv-keywords": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "ansi-regex": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "async": {
-          "version": "2.5.0",
-          "bundled": true
-        },
-        "autoprefixer": {
-          "version": "6.7.7",
-          "bundled": true
-        },
-        "browserslist": {
-          "version": "1.7.7",
-          "bundled": true
-        },
-        "camelcase": {
-          "version": "4.1.0",
-          "bundled": true
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "bundled": true,
-          "dependencies": {
-            "ansi-regex": {
-              "version": "2.1.1",
-              "bundled": true
-            },
-            "strip-ansi": {
-              "version": "3.0.1",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "2.0.0",
-              "bundled": true
-            }
-          }
-        },
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true
-        },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "crypto-browserify": {
-          "version": "3.11.1",
-          "bundled": true
-        },
-        "css-loader": {
-          "version": "0.28.5",
-          "bundled": true
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true
-        },
-        "diff": {
-          "version": "3.2.0",
-          "bundled": true
-        },
-        "enhanced-resolve": {
-          "version": "3.4.1",
-          "bundled": true
-        },
-        "find-up": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "glob": {
-          "version": "7.1.1",
-          "bundled": true
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "load-json-file": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "loader-utils": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "lodash.camelcase": {
-          "version": "4.3.0",
-          "bundled": true
-        },
-        "mocha": {
-          "version": "3.5.0",
-          "bundled": true
-        },
-        "node-libs-browser": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "os-browserify": {
-          "version": "0.2.1",
-          "bundled": true
-        },
-        "os-locale": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "path-type": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "postcss": {
-          "version": "5.2.17",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.7",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "3.2.3",
-              "bundled": true
-            }
-          }
-        },
-        "postcss-loader": {
-          "version": "1.3.3",
-          "bundled": true
-        },
-        "read-pkg": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg-up": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "bundled": true,
-          "dependencies": {
-            "string_decoder": {
-              "version": "1.0.3",
-              "bundled": true
-            }
-          }
-        },
-        "sinon": {
-          "version": "2.4.1",
-          "bundled": true
-        },
-        "source-list-map": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "0.9.2",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "0.2.17",
-              "bundled": true
-            }
-          }
-        },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "strip-ansi": {
-          "version": "4.0.0",
-          "bundled": true
-        },
-        "strip-bom": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "style-loader": {
-          "version": "0.17.0",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "3.1.2",
-          "bundled": true
-        },
-        "tapable": {
-          "version": "0.2.8",
-          "bundled": true
-        },
-        "timers-browserify": {
-          "version": "2.0.4",
-          "bundled": true
-        },
-        "url": {
-          "version": "0.11.0",
-          "bundled": true,
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "bundled": true
-            }
-          }
-        },
-        "watchpack": {
-          "version": "1.4.0",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            }
-          }
-        },
-        "webpack": {
-          "version": "3.5.5",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            },
-            "has-flag": {
-              "version": "2.0.0",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "1.1.0",
-              "bundled": true
-            },
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "4.2.1",
-              "bundled": true
-            }
-          }
-        },
-        "webpack-sources": {
-          "version": "1.0.1",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            }
-          }
-        },
-        "which-module": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "yargs": {
-          "version": "8.0.2",
-          "bundled": true
-        },
-        "yargs-parser": {
-          "version": "7.0.0",
-          "bundled": true
-        }
-      }
-    },
-    "@rush-temp/office-ui-fabric-react-tslint": {
-      "version": "file:projects\\office-ui-fabric-react-tslint"
-    },
-    "@rush-temp/ssr-tests": {
-      "version": "file:projects\\ssr-tests",
-      "dependencies": {
-        "acorn": {
-          "version": "5.1.1",
-          "bundled": true
-        },
-        "ajv": {
-          "version": "5.2.2",
-          "bundled": true
-        },
-        "ajv-keywords": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "ansi-regex": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "async": {
-          "version": "2.5.0",
-          "bundled": true
-        },
-        "camelcase": {
-          "version": "4.1.0",
-          "bundled": true
-        },
-        "cliui": {
-          "version": "3.2.0",
-          "bundled": true,
-          "dependencies": {
-            "ansi-regex": {
-              "version": "2.1.1",
-              "bundled": true
-            },
-            "is-fullwidth-code-point": {
-              "version": "1.0.0",
-              "bundled": true
-            },
-            "string-width": {
-              "version": "1.0.2",
-              "bundled": true
-            },
-            "strip-ansi": {
-              "version": "3.0.1",
-              "bundled": true
-            }
-          }
-        },
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true
-        },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "crypto-browserify": {
-          "version": "3.11.1",
-          "bundled": true
-        },
-        "debug": {
-          "version": "2.6.0",
-          "bundled": true
-        },
-        "diff": {
-          "version": "3.2.0",
-          "bundled": true
-        },
-        "enhanced-resolve": {
-          "version": "3.4.1",
-          "bundled": true
-        },
-        "find-up": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "glob": {
-          "version": "7.1.1",
-          "bundled": true
-        },
-        "has-flag": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "load-json-file": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "loader-utils": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "mocha": {
-          "version": "3.3.0",
-          "bundled": true
-        },
-        "ms": {
-          "version": "0.7.2",
-          "bundled": true
-        },
-        "node-libs-browser": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "os-browserify": {
-          "version": "0.2.1",
-          "bundled": true
-        },
-        "os-locale": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "path-type": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "pify": {
-          "version": "2.3.0",
-          "bundled": true
-        },
-        "read-pkg": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg-up": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "bundled": true,
-          "dependencies": {
-            "string_decoder": {
-              "version": "1.0.3",
-              "bundled": true
-            }
-          }
-        },
-        "source-list-map": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "bundled": true
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "strip-ansi": {
-          "version": "4.0.0",
-          "bundled": true
-        },
-        "strip-bom": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "3.1.2",
-          "bundled": true
-        },
-        "tapable": {
-          "version": "0.2.8",
-          "bundled": true
-        },
-        "timers-browserify": {
-          "version": "2.0.4",
-          "bundled": true
-        },
-        "url": {
-          "version": "0.11.0",
-          "bundled": true,
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "bundled": true
-            }
-          }
-        },
-        "watchpack": {
-          "version": "1.4.0",
-          "bundled": true
-        },
-        "webpack": {
-          "version": "3.5.5",
-          "bundled": true,
-          "dependencies": {
-            "has-flag": {
-              "version": "2.0.0",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "4.2.1",
-              "bundled": true
-            }
-          }
-        },
-        "webpack-sources": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "which-module": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "yargs": {
-          "version": "8.0.2",
-          "bundled": true
-        },
-        "yargs-parser": {
-          "version": "7.0.0",
-          "bundled": true
-        }
-      }
-    },
-    "@rush-temp/styling": {
-      "version": "file:projects\\styling",
-      "dependencies": {
-        "acorn": {
-          "version": "5.1.1",
-          "bundled": true
-        },
-        "ajv": {
-          "version": "5.2.2",
-          "bundled": true
-        },
-        "ajv-keywords": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "ansi-regex": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "async": {
-          "version": "2.5.0",
-          "bundled": true
-        },
-        "camelcase": {
-          "version": "4.1.0",
-          "bundled": true
-        },
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true
-        },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "crypto-browserify": {
-          "version": "3.11.1",
-          "bundled": true
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true
-        },
-        "diff": {
-          "version": "3.2.0",
-          "bundled": true
-        },
-        "enhanced-resolve": {
-          "version": "3.4.1",
-          "bundled": true
-        },
-        "find-up": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "glob": {
-          "version": "7.1.1",
-          "bundled": true
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "load-json-file": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "loader-utils": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "mocha": {
-          "version": "3.5.0",
-          "bundled": true
-        },
-        "node-libs-browser": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "os-browserify": {
-          "version": "0.2.1",
-          "bundled": true
-        },
-        "os-locale": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "path-type": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg-up": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "bundled": true,
-          "dependencies": {
-            "string_decoder": {
-              "version": "1.0.3",
-              "bundled": true
-            }
-          }
-        },
-        "source-list-map": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "0.9.2",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "0.2.17",
-              "bundled": true
-            }
-          }
-        },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "strip-ansi": {
-          "version": "4.0.0",
-          "bundled": true
-        },
-        "strip-bom": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "3.1.2",
-          "bundled": true
-        },
-        "tapable": {
-          "version": "0.2.8",
-          "bundled": true
-        },
-        "timers-browserify": {
-          "version": "2.0.4",
-          "bundled": true
-        },
-        "url": {
-          "version": "0.11.0",
-          "bundled": true,
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "bundled": true
-            }
-          }
-        },
-        "watchpack": {
-          "version": "1.4.0",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            }
-          }
-        },
-        "webpack": {
-          "version": "3.5.5",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            },
-            "has-flag": {
-              "version": "2.0.0",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "1.1.0",
-              "bundled": true
-            },
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "4.2.1",
-              "bundled": true
-            }
-          }
-        },
-        "webpack-sources": {
-          "version": "1.0.1",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            }
-          }
-        },
-        "which-module": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "yargs": {
-          "version": "8.0.2",
-          "bundled": true
-        },
-        "yargs-parser": {
-          "version": "7.0.0",
-          "bundled": true
-        }
-      }
-    },
-    "@rush-temp/test-bundle-button": {
-      "version": "file:projects\\test-bundle-button",
-      "dependencies": {
-        "acorn": {
-          "version": "5.1.1",
-          "bundled": true
-        },
-        "ajv": {
-          "version": "5.2.2",
-          "bundled": true
-        },
-        "ajv-keywords": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "ansi-regex": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "async": {
-          "version": "2.5.0",
-          "bundled": true
-        },
-        "camelcase": {
-          "version": "4.1.0",
-          "bundled": true
-        },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "crypto-browserify": {
-          "version": "3.11.1",
-          "bundled": true
-        },
-        "enhanced-resolve": {
-          "version": "3.4.1",
-          "bundled": true
-        },
-        "find-up": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "has-flag": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "load-json-file": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "loader-utils": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "node-libs-browser": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "os-browserify": {
-          "version": "0.2.1",
-          "bundled": true
-        },
-        "os-locale": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "path-type": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg-up": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "bundled": true,
-          "dependencies": {
-            "string_decoder": {
-              "version": "1.0.3",
-              "bundled": true
-            }
-          }
-        },
-        "source-list-map": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "0.9.2",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "0.2.17",
-              "bundled": true
-            }
-          }
-        },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "strip-ansi": {
-          "version": "4.0.0",
-          "bundled": true
-        },
-        "strip-bom": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "4.2.1",
-          "bundled": true
-        },
-        "tapable": {
-          "version": "0.2.8",
-          "bundled": true
-        },
-        "timers-browserify": {
-          "version": "2.0.4",
-          "bundled": true
-        },
-        "url": {
-          "version": "0.11.0",
-          "bundled": true,
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "bundled": true
-            }
-          }
-        },
-        "watchpack": {
-          "version": "1.4.0",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            }
-          }
-        },
-        "webpack": {
-          "version": "3.5.5",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "1.1.0",
-              "bundled": true
-            },
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            }
-          }
-        },
-        "webpack-sources": {
-          "version": "1.0.1",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            }
-          }
-        },
-        "which-module": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "yargs": {
-          "version": "8.0.2",
-          "bundled": true
-        },
-        "yargs-parser": {
-          "version": "7.0.0",
-          "bundled": true
-        }
-      }
-    },
-    "@rush-temp/todo-app": {
-      "version": "file:projects\\todo-app"
-    },
-    "@rush-temp/utilities": {
-      "version": "file:projects\\utilities",
-      "dependencies": {
-        "@types/jest": {
-          "version": "21.1.0",
-          "bundled": true
-        },
-        "async": {
-          "version": "0.9.2",
-          "bundled": true
-        },
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true,
-          "dependencies": {
-            "ms": {
-              "version": "2.0.0",
-              "bundled": true
-            }
-          }
-        },
-        "diff": {
-          "version": "3.2.0",
-          "bundled": true
-        },
-        "glob": {
-          "version": "7.1.1",
-          "bundled": true
-        },
-        "mocha": {
-          "version": "3.5.0",
-          "bundled": true
-        },
-        "ms": {
-          "version": "0.7.2",
-          "bundled": true
-        },
-        "sinon": {
-          "version": "2.4.1",
-          "bundled": true
-        },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "3.1.2",
-          "bundled": true
-        }
-      }
-    },
-    "@rush-temp/vr-tests": {
-      "version": "file:projects\\vr-tests",
-      "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "bundled": true
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "bundled": true,
-          "dependencies": {
-            "supports-color": {
-              "version": "2.0.0",
-              "bundled": true
-            }
-          }
-        },
-        "css-loader": {
-          "version": "0.27.3",
-          "bundled": true
-        },
-        "has-flag": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "postcss": {
-          "version": "5.2.17",
-          "bundled": true
-        },
-        "postcss-loader": {
-          "version": "1.3.3",
-          "bundled": true
-        },
-        "source-list-map": {
-          "version": "0.1.8",
-          "bundled": true
-        },
-        "style-loader": {
-          "version": "0.16.1",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "bundled": true
-        }
-      }
-    },
-    "@storybook/addon-actions": {
-      "version": "3.2.11",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-actions/-/addon-actions-3.2.11.tgz",
-      "integrity": "sha512-WbB+KNn+4BzsBzHDR4fdE33YXoC/etSrBqwz3RM4unJlgRSiJxWFyv0aKrMQA5IrfJPyFudI8wum1asgBATf7Q=="
-    },
-    "@storybook/addon-links": {
-      "version": "3.2.10",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-links/-/addon-links-3.2.10.tgz",
-      "integrity": "sha512-0Jf8OzWyUYd/v0mRJbyhgujphSvLvX1OpZGV1CWp6nzmQMo7lJHsjZyw+N9vo+UES9r8XuDV91vvKpqetP4aow=="
-    },
-    "@storybook/addon-options": {
-      "version": "3.2.3",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-options/-/addon-options-3.2.3.tgz",
-      "integrity": "sha1-6jdA0onUKc52fpaZvzpkfddBWS0="
-    },
-    "@storybook/addons": {
-      "version": "3.2.10",
-      "resolved": "https://registry.npmjs.org/@storybook/addons/-/addons-3.2.10.tgz",
-      "integrity": "sha512-TctnzBSvUWRO+v0HxF+gcf4Jjql7VcIpKqEDerdGykPYoXR+l/dQP/59B1R476eHuZecqMO/yl67qB+hJuI/Xg=="
-    },
-    "@storybook/channel-postmessage": {
-      "version": "3.2.10",
-      "resolved": "https://registry.npmjs.org/@storybook/channel-postmessage/-/channel-postmessage-3.2.10.tgz",
-      "integrity": "sha512-+XzW6hLoO/CZUqLjRQ+asDWPWVwEWFhrmgUKSWGew13U/8EAsNSeOmNh3NHjHrxu1yhPS1lSW+desKGCee4qLQ=="
-    },
-    "@storybook/channels": {
-      "version": "3.2.10",
-      "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-3.2.10.tgz",
-      "integrity": "sha512-PKMn1B1L4REUNK77naWd/m3qJEmlV27Ve1RNRw1xnPJyMRrd+nuMvvjXDu/7kPm1Sg3wpl41khJv/EuJg446Zw=="
-    },
-    "@storybook/components": {
-      "version": "3.2.10",
-      "resolved": "https://registry.npmjs.org/@storybook/components/-/components-3.2.10.tgz",
-      "integrity": "sha512-T46B6ej2u/AqhMfB+dggmq4orUMAtponTjYDheYKUBQ6NSubh1H+85gx3FZepmnmJsM9UicV5Yc43wTUYf07xw=="
-    },
-    "@storybook/react": {
-      "version": "3.2.11",
-      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-3.2.11.tgz",
-      "integrity": "sha512-73aup7efGRKKFBwEfyvebuZWaHbCsBQq03l29ke8e7gWiPEcRBBzlkXA0Jkt2LZ63K4ZFSsEiryltaouu6rZIA==",
-      "dependencies": {
-        "style-loader": {
-          "version": "0.17.0",
-          "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.17.0.tgz",
-          "integrity": "sha1-6CVLzNt690vVgnTjYQe01atN8xA="
-        }
-      }
-    },
-    "@storybook/react-fuzzy": {
-      "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/@storybook/react-fuzzy/-/react-fuzzy-0.4.0.tgz",
-      "integrity": "sha1-KWHoofbBr8zpfp6aFNHf6dkGEIc="
-    },
-    "@storybook/ui": {
-      "version": "3.2.11",
-      "resolved": "https://registry.npmjs.org/@storybook/ui/-/ui-3.2.11.tgz",
-      "integrity": "sha512-bxVmLCq++c77OkZMOnPuSSZUHd/sXkw6hBgwqAeuiFnsRnjgddBOMLOLxHAWGeE9I7WQ0Xll31E57vjdGIusNA=="
-    },
-    "@types/chai": {
-      "version": "3.4.35",
-      "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.35.tgz",
-      "integrity": "sha1-6NZfg0ktKUT4FvxiB0GCHCioyQA="
-    },
-    "@types/cheerio": {
-      "version": "0.22.2",
-      "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.2.tgz",
-      "integrity": "sha512-7YJQbllem83umRzZ+ry6RZFAbBWNoHvbiW6tE5VEAJIoX6F22hrKrBw3ibRvHm2zPnOhZGrZJusAbp1zZKcLzQ=="
-    },
-    "@types/enzyme": {
-      "version": "2.8.8",
-      "resolved": "https://registry.npmjs.org/@types/enzyme/-/enzyme-2.8.8.tgz",
-      "integrity": "sha512-KBw0ZzOQNtwVGO4egRjEpQbXMFCSevy+gRFzaLXrU64LrVVuJF0FqVIdzed0NCSP+nMALj001//dwYKV/VDlCA=="
-    },
-    "@types/es6-promise": {
-      "version": "0.0.32",
-      "resolved": "https://registry.npmjs.org/@types/es6-promise/-/es6-promise-0.0.32.tgz",
-      "integrity": "sha1-O89E+x5Cnz33YYjIxth0Rjujcf0="
-    },
-    "@types/highlight.js": {
-      "version": "9.1.9",
-      "resolved": "https://registry.npmjs.org/@types/highlight.js/-/highlight.js-9.1.9.tgz",
-      "integrity": "sha1-7WM2lV6vIzt163kjubHzc9BF7wE="
-    },
-    "@types/jest": {
-      "version": "21.1.1",
-      "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.1.tgz",
-      "integrity": "sha512-PkhRLvgERKS5ZDrmYUQbbEOwhD4c2vGpWbCvwPLF82cdE6jWAwMKGAWYyIKfEgSDO5tr1p1n2XmeVlynMJ2usA=="
-    },
-    "@types/mocha": {
-      "version": "2.2.39",
-      "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.39.tgz",
-      "integrity": "sha1-9o1j24tpw46VWLQHNSXPlsT3qCk="
-    },
-    "@types/node": {
-      "version": "8.0.26",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-8.0.26.tgz",
-      "integrity": "sha512-wbKN0MB4XsjdnSE04HiCzLoBDirGCM6zXrqavSj44nZnPFYpnrTF64E9O6Xmf0ca/IuKK/BHUcXwMiwk92gW6Q=="
-    },
-    "@types/prop-types": {
-      "version": "15.5.1",
-      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.5.1.tgz",
-      "integrity": "sha1-Hs9SYhKZ5luFU3Qzf7Ef0tEGb8E="
-    },
-    "@types/react": {
-      "version": "15.0.38",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.38.tgz",
-      "integrity": "sha512-CkRB27L/kMDu7K20U0V7BwYK9/kPd9Im6Jlxv2vAEolYBvQy6JrSpPJsbZXtOk4MoDUomkct8Q7PNBUSLd0fmg=="
-    },
-    "@types/react-addons-test-utils": {
-      "version": "0.14.18",
-      "resolved": "https://registry.npmjs.org/@types/react-addons-test-utils/-/react-addons-test-utils-0.14.18.tgz",
-      "integrity": "sha1-g+EK8dvl7CU1vC3FNz17w7gv3uE="
-    },
-    "@types/react-dom": {
-      "version": "15.5.1",
-      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-15.5.1.tgz",
-      "integrity": "sha512-4c+e/QPfvSa48YhgGOcQWoHishTo6BuJqka0Bh8qeLdnK1jS+1Nz8W/w1G17AIjtLxONYFUqmi8qyt+8p/yMFA=="
-    },
-    "@types/react-test-renderer": {
-      "version": "15.5.4",
-      "resolved": "https://registry.npmjs.org/@types/react-test-renderer/-/react-test-renderer-15.5.4.tgz",
-      "integrity": "sha512-9gESAOcTd/sUuTdngpDpR8qTkDvxPOHNjedxzRyyTmXoqnMtBM04DfOEKmoM4ZuD2DrQVN4JRwpaE02hvsqH0A=="
-    },
-    "@types/resemblejs": {
-      "version": "1.3.28",
-      "resolved": "https://registry.npmjs.org/@types/resemblejs/-/resemblejs-1.3.28.tgz",
-      "integrity": "sha1-Lg2ztf2w8vPUVPXXLhMkEgnql60="
-    },
-    "@types/sinon": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/@types/sinon/-/sinon-2.2.2.tgz",
-      "integrity": "sha1-qA2khougisysvOTTcnbzXhugpS8="
-    },
-    "@types/storybook__react": {
-      "version": "3.0.5",
-      "resolved": "https://registry.npmjs.org/@types/storybook__react/-/storybook__react-3.0.5.tgz",
-      "integrity": "sha512-febLx40iQWoQKVaEMpxdzkJnqncPHoRivlilc3JhHJiRuBY1Mqa1yTKcvQ5RiFAYFIuv4x+bRuSIXErk5v41Bg=="
-    },
-    "@types/webpack-env": {
-      "version": "1.13.0",
-      "resolved": "https://registry.npmjs.org/@types/webpack-env/-/webpack-env-1.13.0.tgz",
-      "integrity": "sha1-MEQ4FkfhHulzxa8uklMjkw9pHYA="
-    },
-    "@uifabric/icons": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.0.1.tgz",
-      "integrity": "sha512-oND+ez0D1jmOK8svzMFGtwkRMR0n3IdFcAb4RAflR7A0n+t6U0R+s3YOnoNuT8jAkmyBEgkqEj9rScE+p7749Q=="
-    },
-    "@uifabric/merge-styles": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.2.0.tgz",
-      "integrity": "sha512-5UNjp2VcxrNHR5JpY5xy6gEQMB5ZanVJUX3fTVsdz3vOKnh6u/LL1FhDAP7dHFSrCRwohT5jPHzbMCXcs3UJlA=="
-    },
-    "@uifabric/styling": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.1.0.tgz",
-      "integrity": "sha512-M4dUt0RoRvnqVFIplxcNZ9xCoOyXdOvnEt4lEOnpzipw0/gFvILYqcc34WmVX8KVL6FB8CJW2hKj8EUciwlDBQ=="
-    },
-    "@uifabric/utilities": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.0.1.tgz",
-      "integrity": "sha512-HUhh3EKUiZshpbNxcgkwQ6WcTKT3+rlhfX/pSeLElRTGbORYxdoWFDwVfFZT71xP2hFnUQI/Z5qb9BLdKeJpRA=="
-    },
-    "abab": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/abab/-/abab-1.0.4.tgz",
-      "integrity": "sha1-X6rZwsB/YN12dw9xzwJbYqY8/U4="
-    },
-    "abbrev": {
-      "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.0.9.tgz",
-      "integrity": "sha1-kbR5JYinc4wl813W9jdSovh3YTU="
-    },
-    "accepts": {
-      "version": "1.3.3",
-      "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.3.tgz",
-      "integrity": "sha1-w8p0NJOGSMPg2cHjKN1otiLChMo="
-    },
-    "acorn": {
-      "version": "4.0.13",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
-      "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c="
-    },
-    "acorn-dynamic-import": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/acorn-dynamic-import/-/acorn-dynamic-import-2.0.2.tgz",
-      "integrity": "sha1-x1K9IQvvZ5UBtsbLf8hPj0cVjMQ="
-    },
-    "acorn-globals": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/acorn-globals/-/acorn-globals-3.1.0.tgz",
-      "integrity": "sha1-/YJw9x+7SZawBPqIDuXUZXOnMb8="
-    },
-    "after": {
-      "version": "0.8.2",
-      "resolved": "https://registry.npmjs.org/after/-/after-0.8.2.tgz",
-      "integrity": "sha1-/ts5T58OAqqXaOcCvaI7UF+ufh8="
-    },
-    "agent-base": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-2.1.1.tgz",
-      "integrity": "sha1-1t4Q1a9hMtW9aSQn1G/FOFOQlMc="
-    },
-    "airbnb-js-shims": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/airbnb-js-shims/-/airbnb-js-shims-1.3.0.tgz",
-      "integrity": "sha512-Y/9jgf3uEdNyeWPUV1N49FowM/qMIiKSTkRUpYT4jpHkSADfTiRVwI8Mm6o4CIxhnBK1uMf4RIYNYKwwILMCAQ=="
-    },
-    "ajv": {
-      "version": "5.2.3",
-      "resolved": "https://registry.npmjs.org/ajv/-/ajv-5.2.3.tgz",
-      "integrity": "sha1-wG9Zh3jETGsWGrr+NGa4GtGBTtI="
-    },
-    "ajv-keywords": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-2.1.0.tgz",
-      "integrity": "sha1-opbhf3v658HOT34N5T0pyzIWLfA="
-    },
-    "align-text": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/align-text/-/align-text-0.1.4.tgz",
-      "integrity": "sha1-DNkKVhCT810KmSVsIrcGlDP60Rc=",
-      "dependencies": {
-        "kind-of": {
-          "version": "3.2.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
-        }
-      }
-    },
-    "alphanum-sort": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/alphanum-sort/-/alphanum-sort-1.0.2.tgz",
-      "integrity": "sha1-l6ERlkmyEa0zaR2fn0hqjsn74KM="
-    },
-    "amdefine": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz",
-      "integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU="
-    },
-    "ansi-escapes": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-3.0.0.tgz",
-      "integrity": "sha512-O/klc27mWNUigtv0F8NJWbLF00OcegQalkqKURWdosW08YZKi4m6CnSUSvIZG1otNJbTWhN01Hhz389DW7mvDQ=="
-    },
-    "ansi-html": {
-      "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/ansi-html/-/ansi-html-0.0.7.tgz",
-      "integrity": "sha1-gTWEAhliqenm/QOflA0S9WynhZ4="
-    },
-    "ansi-regex": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
-      "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
-    },
-    "ansi-styles": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
-      "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
-    },
-    "ansicolors": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/ansicolors/-/ansicolors-0.2.1.tgz",
-      "integrity": "sha1-vgiVmQl7dKXJxKhKDNvNtivYeu8="
-    },
-    "anymatch": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-1.3.2.tgz",
-      "integrity": "sha512-0XNayC8lTHQ2OI8aljNCN3sSx6hsr/1+rlcDAotXJR7C1oZZHCNsfpbKwMjRA3Uqb5tF1Rae2oloTr4xpq+WjA==",
-      "dependencies": {
-        "arr-diff": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
-          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8="
-        },
-        "array-unique": {
-          "version": "0.2.1",
-          "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
-          "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM="
-        },
-        "braces": {
-          "version": "1.8.5",
-          "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
-          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
-        },
-        "expand-brackets": {
-          "version": "0.1.5",
-          "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
-          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s="
-        },
-        "extglob": {
-          "version": "0.3.2",
-          "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
-          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
-        },
-        "kind-of": {
-          "version": "3.2.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
-        },
-        "micromatch": {
-          "version": "2.3.11",
-          "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
-          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
-        }
-      }
-    },
-    "append-transform": {
-      "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/append-transform/-/append-transform-0.4.0.tgz",
-      "integrity": "sha1-126/jKlNJ24keja61EpLdKthGZE="
-    },
-    "aproba": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.2.0.tgz",
-      "integrity": "sha512-Y9J6ZjXtoYh8RnXVCMOU/ttDmk1aBjunq9vO0ta5x85WDQiQfUF9sIPBITdbiiIVcBo03Hi3jMxigBtsddlXRw=="
-    },
-    "are-we-there-yet": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/are-we-there-yet/-/are-we-there-yet-1.1.4.tgz",
-      "integrity": "sha1-u13KOCu5TwXhUZQ3PRb9O6HKEQ0="
-    },
-    "argparse": {
-      "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.9.tgz",
-      "integrity": "sha1-c9g7wmP4bpf4zE9rrhsOkKfSLIY="
-    },
-    "arr-diff": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-4.0.0.tgz",
-      "integrity": "sha1-1kYQdP6/7HHn4VI1dhoyml3HxSA="
-    },
-    "arr-flatten": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.1.0.tgz",
-      "integrity": "sha512-L3hKV5R/p5o81R7O02IGnwpDmkp6E982XhtbuwSe3O4qOtMMMtodicASA1Cny2U+aCXcNpml+m4dPsvsJ3jatg=="
-    },
-    "arr-union": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/arr-union/-/arr-union-3.1.0.tgz",
-      "integrity": "sha1-45sJrqne+Gao8gbiiK9jkZuuOcQ="
-    },
-    "array-back": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/array-back/-/array-back-2.0.0.tgz",
-      "integrity": "sha512-eJv4pLLufP3g5kcZry0j6WXpIbzYw9GUB4mVJZno9wfwiBxbizTnHCw3VJb07cBihbFX48Y7oSrW9y+gt4glyw=="
-    },
-    "array-equal": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/array-equal/-/array-equal-1.0.0.tgz",
-      "integrity": "sha1-jCpe8kcv2ep0KwTHenUJO6J1fJM="
-    },
-    "array-filter": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/array-filter/-/array-filter-0.0.1.tgz",
-      "integrity": "sha1-fajPLiZijtcygDWB/SH2fKzS7uw="
-    },
-    "array-find": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/array-find/-/array-find-1.0.0.tgz",
-      "integrity": "sha1-bI4obRHtdoMn+OYuzuhzU8o+eLg="
-    },
-    "array-find-index": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/array-find-index/-/array-find-index-1.0.2.tgz",
-      "integrity": "sha1-3wEKoSh+Fku9pvlyOwqWoexBh6E="
-    },
-    "array-flatten": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
-      "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI="
-    },
-    "array-includes": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/array-includes/-/array-includes-3.0.3.tgz",
-      "integrity": "sha1-GEtI9i2S10UrsxsyMWXH+L0CJm0="
-    },
-    "array-map": {
-      "version": "0.0.0",
-      "resolved": "https://registry.npmjs.org/array-map/-/array-map-0.0.0.tgz",
-      "integrity": "sha1-iKK6tz0c97zVwbEYoAP2b2ZfpmI="
-    },
-    "array-reduce": {
-      "version": "0.0.0",
-      "resolved": "https://registry.npmjs.org/array-reduce/-/array-reduce-0.0.0.tgz",
-      "integrity": "sha1-FziZ0//Rx9k4PkR5Ul2+J4yrXys="
-    },
-    "array-slice": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/array-slice/-/array-slice-0.2.3.tgz",
-      "integrity": "sha1-3Tz7gO15c6dRF82sabC5nshhhvU="
-    },
-    "array-union": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz",
-      "integrity": "sha1-mjRBDk9OPaI96jdb5b5w8kd47Dk="
-    },
-    "array-uniq": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz",
-      "integrity": "sha1-r2rId6Jcx/dOBYiUdThY39sk/bY="
-    },
-    "array-unique": {
-      "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.3.2.tgz",
-      "integrity": "sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg="
-    },
-    "arraybuffer.slice": {
-      "version": "0.0.6",
-      "resolved": "https://registry.npmjs.org/arraybuffer.slice/-/arraybuffer.slice-0.0.6.tgz",
-      "integrity": "sha1-8zshWfBTKj8xB6JywMz70a0peco="
-    },
-    "arrify": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz",
-      "integrity": "sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0="
-    },
-    "asap": {
-      "version": "2.0.6",
-      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz",
-      "integrity": "sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY="
-    },
-    "asn1": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.3.tgz",
-      "integrity": "sha1-2sh4dxPJlmhJ/IGAd36+nB3fO4Y="
-    },
-    "asn1.js": {
-      "version": "4.9.1",
-      "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-4.9.1.tgz",
-      "integrity": "sha1-SLokC0WpKA6UdImQull9IWYX/UA="
-    },
-    "assert": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/assert/-/assert-1.4.1.tgz",
-      "integrity": "sha1-mZEtWRg2tab1s0XA8H7vwI/GXZE="
-    },
-    "assert-plus": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-      "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
-    },
-    "assertion-error": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-1.0.2.tgz",
-      "integrity": "sha1-E8pRXYYgbaC6xm6DTdOX2HWBCUw="
-    },
-    "ast-types": {
-      "version": "0.9.11",
-      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.9.11.tgz",
-      "integrity": "sha1-NxF3u1kjL/XOqh0J7lytcFsaWqk="
-    },
-    "astral-regex": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/astral-regex/-/astral-regex-1.0.0.tgz",
-      "integrity": "sha512-+Ryf6g3BKoRc7jfp7ad8tM4TtMiaWvbF/1/sQcZPkkS7ag3D5nMBCe2UfOTONtAkaG0tO0ij3C5Lwmf1EiyjHg=="
-    },
-    "async": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
-      "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw=="
-    },
-    "async-each": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/async-each/-/async-each-1.0.1.tgz",
-      "integrity": "sha1-GdOGodntxufByF04iu28xW0zYC0="
-    },
-    "async-foreach": {
-      "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/async-foreach/-/async-foreach-0.1.3.tgz",
-      "integrity": "sha1-NhIfhFwFeBct5Bmpfb6x0W7DRUI="
-    },
-    "asynckit": {
-      "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
-      "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k="
-    },
-    "atob": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/atob/-/atob-2.0.3.tgz",
-      "integrity": "sha1-GcenYEc3dEaPILLS0DNyrX1Mv10="
-    },
-    "autolinker": {
-      "version": "0.15.3",
-      "resolved": "https://registry.npmjs.org/autolinker/-/autolinker-0.15.3.tgz",
-      "integrity": "sha1-NCQX2PLzRhsUzwkIjV7fh5HcmDI="
-    },
-    "autoprefixer": {
-      "version": "7.1.4",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-7.1.4.tgz",
-      "integrity": "sha512-MB1XybOJqu1uAwpfSilAa1wSURNc4W310CFKvMj1fNaJBFxr1PGgz72vZaPr9ryKGqs2vYZ6jDyJ0aiGELjsoA==",
-      "dependencies": {
-        "browserslist": {
-          "version": "2.4.0",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.4.0.tgz",
-          "integrity": "sha512-aM2Gt4x9bVlCUteADBS6JP0F+2tMWKM1jQzUulVROtdFWFIcIVvY76AJbr7GDqy0eDhn+PcnpzzivGxY4qiaKQ=="
-        }
-      }
-    },
-    "awesome-typescript-loader": {
-      "version": "3.2.3",
-      "resolved": "https://registry.npmjs.org/awesome-typescript-loader/-/awesome-typescript-loader-3.2.3.tgz",
-      "integrity": "sha512-zGGD6j6jYYtIOBtfhtnrbNB3dlDThVdgF9CQhkPqBwPUUsyJOHNxj9d2LOmVJY1PlBoNPABoDeyRfphIDeYGxA=="
-    },
-    "aws-sign2": {
-      "version": "0.7.0",
-      "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.7.0.tgz",
-      "integrity": "sha1-tG6JCTSpWR8tL2+G1+ap8bP+dqg="
-    },
-    "aws4": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.6.0.tgz",
-      "integrity": "sha1-g+9cqGCysy5KDe7e6MdxudtXRx4="
-    },
-    "babel-code-frame": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
-      "integrity": "sha1-Y/1D99weO7fONZR9uP42mj9Yx0s=",
-      "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
-        },
-        "supports-color": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-        }
-      }
-    },
-    "babel-core": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-core/-/babel-core-6.26.0.tgz",
-      "integrity": "sha1-rzL3izGm/O8RnIew/Y2XU/A6C7g="
-    },
-    "babel-generator": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-generator/-/babel-generator-6.26.0.tgz",
-      "integrity": "sha1-rBriAHC3n248odMmlhMFN3TyDcU=",
-      "dependencies": {
-        "jsesc": {
-          "version": "1.3.0",
-          "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-1.3.0.tgz",
-          "integrity": "sha1-RsP+yMGJKxKwgz25vHYiF226s0s="
-        }
-      }
-    },
-    "babel-helper-bindify-decorators": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-helper-bindify-decorators/-/babel-helper-bindify-decorators-6.24.1.tgz",
-      "integrity": "sha1-FMGeXxQte0fxmlJDHlKxzLxAozA="
-    },
-    "babel-helper-builder-binary-assignment-operator-visitor": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-helper-builder-binary-assignment-operator-visitor/-/babel-helper-builder-binary-assignment-operator-visitor-6.24.1.tgz",
-      "integrity": "sha1-zORReto1b0IgvK6KAsKzRvmlZmQ="
-    },
-    "babel-helper-builder-react-jsx": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-helper-builder-react-jsx/-/babel-helper-builder-react-jsx-6.26.0.tgz",
-      "integrity": "sha1-Of+DE7dci2Xc7/HzHTg+D/KkCKA="
-    },
-    "babel-helper-call-delegate": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-helper-call-delegate/-/babel-helper-call-delegate-6.24.1.tgz",
-      "integrity": "sha1-7Oaqzdx25Bw0YfiL/Fdb0Nqi340="
-    },
-    "babel-helper-define-map": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-helper-define-map/-/babel-helper-define-map-6.26.0.tgz",
-      "integrity": "sha1-pfVtq0GiX5fstJjH66ypgZ+Vvl8="
-    },
-    "babel-helper-evaluate-path": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/babel-helper-evaluate-path/-/babel-helper-evaluate-path-0.2.0.tgz",
-      "integrity": "sha512-0EK9TUKMxHL549hWDPkQoS7R0Ozg1CDLheVBHYds2B2qoAvmr9ejY3zOXFsrICK73TN7bPhU14PBeKc8jcBTwg=="
-    },
-    "babel-helper-explode-assignable-expression": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-helper-explode-assignable-expression/-/babel-helper-explode-assignable-expression-6.24.1.tgz",
-      "integrity": "sha1-8luCz33BBDPFX3BZLVdGQArCLKo="
-    },
-    "babel-helper-explode-class": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-helper-explode-class/-/babel-helper-explode-class-6.24.1.tgz",
-      "integrity": "sha1-fcKjkQ3uAHBW4eMdZAztPVTqqes="
-    },
-    "babel-helper-flip-expressions": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/babel-helper-flip-expressions/-/babel-helper-flip-expressions-0.2.0.tgz",
-      "integrity": "sha512-rAsPA1pWBc7e2E6HepkP2e1sXugT+Oq/VCqhyuHJ8aJ2d/ifwnJfd4Qxjm21qlW43AN8tqaeByagKK6wECFMSw=="
-    },
-    "babel-helper-function-name": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-helper-function-name/-/babel-helper-function-name-6.24.1.tgz",
-      "integrity": "sha1-00dbjAPtmCQqJbSDUasYOZ01gKk="
-    },
-    "babel-helper-get-function-arity": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-helper-get-function-arity/-/babel-helper-get-function-arity-6.24.1.tgz",
-      "integrity": "sha1-j3eCqpNAfEHTqlCQj4mwMbG2hT0="
-    },
-    "babel-helper-hoist-variables": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-helper-hoist-variables/-/babel-helper-hoist-variables-6.24.1.tgz",
-      "integrity": "sha1-HssnaJydJVE+rbyZFKc/VAi+enY="
-    },
-    "babel-helper-is-nodes-equiv": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/babel-helper-is-nodes-equiv/-/babel-helper-is-nodes-equiv-0.0.1.tgz",
-      "integrity": "sha1-NOmzALFHnd2Y7HfqC76TQt/jloQ="
-    },
-    "babel-helper-is-void-0": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/babel-helper-is-void-0/-/babel-helper-is-void-0-0.2.0.tgz",
-      "integrity": "sha512-Axj1AYuD0E3Dl7nT3KxROP7VekEofz3XtEljzURf3fABalLpr8PamtgLFt+zuxtaCxRf9iuZmbAMMYWri5Bazw=="
-    },
-    "babel-helper-mark-eval-scopes": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/babel-helper-mark-eval-scopes/-/babel-helper-mark-eval-scopes-0.2.0.tgz",
-      "integrity": "sha512-KJuwrOUcHbvbh6he4xRXZFLaivK9DF9o3CrvpWnK1Wp0B+1ANYABXBMgwrnNFIDK/AvicxQ9CNr8wsgivlp4Aw=="
-    },
-    "babel-helper-optimise-call-expression": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-helper-optimise-call-expression/-/babel-helper-optimise-call-expression-6.24.1.tgz",
-      "integrity": "sha1-96E0J7qfc/j0+pk8VKl4gtEkQlc="
-    },
-    "babel-helper-regex": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-helper-regex/-/babel-helper-regex-6.26.0.tgz",
-      "integrity": "sha1-MlxZ+QL4LyS3T6zu0DY5VPZJXnI="
-    },
-    "babel-helper-remap-async-to-generator": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-helper-remap-async-to-generator/-/babel-helper-remap-async-to-generator-6.24.1.tgz",
-      "integrity": "sha1-XsWBgnrXI/7N04HxySg5BnbkVRs="
-    },
-    "babel-helper-remove-or-void": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/babel-helper-remove-or-void/-/babel-helper-remove-or-void-0.2.0.tgz",
-      "integrity": "sha512-1Z41upf/XR+PwY7Nd+F15Jo5BiQi5205ZXUuKed3yoyQgDkMyoM7vAdjEJS/T+M6jy32sXjskMUgms4zeiVtRA=="
-    },
-    "babel-helper-replace-supers": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-helper-replace-supers/-/babel-helper-replace-supers-6.24.1.tgz",
-      "integrity": "sha1-v22/5Dk40XNpohPKiov3S2qQqxo="
-    },
-    "babel-helper-to-multiple-sequence-expressions": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/babel-helper-to-multiple-sequence-expressions/-/babel-helper-to-multiple-sequence-expressions-0.2.0.tgz",
-      "integrity": "sha512-ij9lpfdP3+Zc/7kNwa+NXbTrUlsYEWPwt/ugmQO0qflzLrveTIkbfOqQztvitk81aG5NblYDQXDlRohzu3oa8Q=="
-    },
-    "babel-helpers": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-helpers/-/babel-helpers-6.24.1.tgz",
-      "integrity": "sha1-NHHenK7DiOXIUOWX5Yom3fN2ArI="
-    },
-    "babel-jest": {
-      "version": "21.2.0",
-      "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-21.2.0.tgz",
-      "integrity": "sha512-O0W2qLoWu1QOoOGgxiR2JID4O6WSpxPiQanrkyi9SSlM0PJ60Ptzlck47lhtnr9YZO3zYOsxHwnyeWJ6AffoBQ=="
-    },
-    "babel-loader": {
-      "version": "7.1.2",
-      "resolved": "https://registry.npmjs.org/babel-loader/-/babel-loader-7.1.2.tgz",
-      "integrity": "sha512-jRwlFbINAeyDStqK6Dd5YuY0k5YuzQUvlz2ZamuXrXmxav3pNqe9vfJ402+2G+OmlJSXxCOpB6Uz0INM7RQe2A=="
-    },
-    "babel-messages": {
-      "version": "6.23.0",
-      "resolved": "https://registry.npmjs.org/babel-messages/-/babel-messages-6.23.0.tgz",
-      "integrity": "sha1-8830cDhYA1sqKVHG7F7fbGLyYw4="
-    },
-    "babel-plugin-check-es2015-constants": {
-      "version": "6.22.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-check-es2015-constants/-/babel-plugin-check-es2015-constants-6.22.0.tgz",
-      "integrity": "sha1-NRV7EBQm/S/9PaP3XH0ekYNbv4o="
-    },
-    "babel-plugin-dynamic-import-node": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/babel-plugin-dynamic-import-node/-/babel-plugin-dynamic-import-node-1.0.2.tgz",
-      "integrity": "sha1-rbW8j0iokxFUA5WunwzD7UsQuy4="
-    },
-    "babel-plugin-istanbul": {
-      "version": "4.1.5",
-      "resolved": "https://registry.npmjs.org/babel-plugin-istanbul/-/babel-plugin-istanbul-4.1.5.tgz",
-      "integrity": "sha1-Z2DN2Xf0EdPhdbsGTyvDJ9mbK24="
-    },
-    "babel-plugin-jest-hoist": {
-      "version": "21.2.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-21.2.0.tgz",
-      "integrity": "sha512-yi5QuiVyyvhBUDLP4ButAnhYzkdrUwWDtvUJv71hjH3fclhnZg4HkDeqaitcR2dZZx/E67kGkRcPVjtVu+SJfQ=="
-    },
-    "babel-plugin-minify-builtins": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-minify-builtins/-/babel-plugin-minify-builtins-0.2.0.tgz",
-      "integrity": "sha512-4i+8ntaS8gwVUcOz5y+zE+55OVOl2nTbmHV51D4wAIiKcRI8U5K//ip1GHfhsgk/NJrrHK7h97Oy5jpqt0Iixg=="
-    },
-    "babel-plugin-minify-constant-folding": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-minify-constant-folding/-/babel-plugin-minify-constant-folding-0.2.0.tgz",
-      "integrity": "sha512-B3ffQBEUQ8ydlIkYv2MkZtTCbV7FAkWAV7NkyhcXlGpD10PaCxNGQ/B9oguXGowR1m16Q5nGhvNn8Pkn1MO6Hw=="
-    },
-    "babel-plugin-minify-dead-code-elimination": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-minify-dead-code-elimination/-/babel-plugin-minify-dead-code-elimination-0.2.0.tgz",
-      "integrity": "sha512-zE7y3pRyzA4zK5nBou0kTcwUTSQ/AiFrynt1cIEYN7vcO2gS9ZFZoI0aO9JYLUdct5fsC1vfB35408yrzTyVfg=="
-    },
-    "babel-plugin-minify-flip-comparisons": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-minify-flip-comparisons/-/babel-plugin-minify-flip-comparisons-0.2.0.tgz",
-      "integrity": "sha512-QOqXSEmD/LhT3LpM1WCyzAGcQZYYKJF7oOHvS6QbpomHenydrV53DMdPX2mK01icBExKZcJAHF209wvDBa+CSg=="
-    },
-    "babel-plugin-minify-guarded-expressions": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-minify-guarded-expressions/-/babel-plugin-minify-guarded-expressions-0.2.0.tgz",
-      "integrity": "sha512-5+NSPdRQ9mnrHaA+zFj+D5OzmSiv90EX5zGH6cWQgR/OUqmCHSDqgTRPFvOctgpo8MJyO7Rt7ajs2UfLnlAwYg=="
-    },
-    "babel-plugin-minify-infinity": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-minify-infinity/-/babel-plugin-minify-infinity-0.2.0.tgz",
-      "integrity": "sha512-U694vrla1lN6vDHWGrR832t3a/A2eh+kyl019LxEE2+sS4VTydyOPRsAOIYAdJegWRA4cMX1lm9azAN0cLIr8g=="
-    },
-    "babel-plugin-minify-mangle-names": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-minify-mangle-names/-/babel-plugin-minify-mangle-names-0.2.0.tgz",
-      "integrity": "sha512-Gixuak1/CO7VCdjn15/8Bxe/QsAtDG4zPbnsNoe1mIJGCIH/kcmSjFhMlGJtXDQZd6EKzeMfA5WmX9+jvGRefw=="
-    },
-    "babel-plugin-minify-numeric-literals": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-minify-numeric-literals/-/babel-plugin-minify-numeric-literals-0.2.0.tgz",
-      "integrity": "sha512-VcLpb+r1YS7+RIOXdRsFVLLqoh22177USpHf+JM/g1nZbzdqENmfd5v534MLAbRErhbz6SyK+NQViVzVtBxu8g=="
-    },
-    "babel-plugin-minify-replace": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-minify-replace/-/babel-plugin-minify-replace-0.2.0.tgz",
-      "integrity": "sha512-SEW6zoSVxh3OH6E1LCgyhhTWMnCv+JIRu5h5IlJDA11tU4ZeSF7uPQcO4vN/o52+FssRB26dmzJ/8D+z0QPg5Q=="
-    },
-    "babel-plugin-minify-simplify": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-minify-simplify/-/babel-plugin-minify-simplify-0.2.0.tgz",
-      "integrity": "sha512-Mj3Mwy2zVosMfXDWXZrQH5/uMAyfJdmDQ1NVqit+ArbHC3LlXVzptuyC1JxTyai/wgFvjLaichm/7vSUshkWqw=="
-    },
-    "babel-plugin-minify-type-constructors": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-minify-type-constructors/-/babel-plugin-minify-type-constructors-0.2.0.tgz",
-      "integrity": "sha512-NiOvvA9Pq6bki6nP4BayXwT5GZadw7DJFDDzHmkpnOQpENWe8RtHtKZM44MG1R6EQ5XxgbLdsdhswIzTkFlO5g=="
-    },
-    "babel-plugin-react-docgen": {
-      "version": "1.8.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-react-docgen/-/babel-plugin-react-docgen-1.8.1.tgz",
-      "integrity": "sha512-11Yxwk8/iEULr+n5DG0BxXD6j/9htpiiR0/hLfi/gtEAK/d6NCNkyKFrC8loQcyMvF3hehPo30SKXG/itSX+hw=="
-    },
-    "babel-plugin-syntax-async-functions": {
-      "version": "6.13.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-async-functions/-/babel-plugin-syntax-async-functions-6.13.0.tgz",
-      "integrity": "sha1-ytnK0RkbWtY0vzCuCHI5HgZHvpU="
-    },
-    "babel-plugin-syntax-async-generators": {
-      "version": "6.13.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-async-generators/-/babel-plugin-syntax-async-generators-6.13.0.tgz",
-      "integrity": "sha1-a8lj67FuzLrmuStZbrfzXDQqi5o="
-    },
-    "babel-plugin-syntax-class-constructor-call": {
-      "version": "6.18.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-class-constructor-call/-/babel-plugin-syntax-class-constructor-call-6.18.0.tgz",
-      "integrity": "sha1-nLnTn+Q8hgC+yBRkVt3L1OGnZBY="
-    },
-    "babel-plugin-syntax-class-properties": {
-      "version": "6.13.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-class-properties/-/babel-plugin-syntax-class-properties-6.13.0.tgz",
-      "integrity": "sha1-1+sjt5oxf4VDlixQW4J8fWysJ94="
-    },
-    "babel-plugin-syntax-decorators": {
-      "version": "6.13.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-decorators/-/babel-plugin-syntax-decorators-6.13.0.tgz",
-      "integrity": "sha1-MSVjtNvePMgGzuPkFszurd0RrAs="
-    },
-    "babel-plugin-syntax-do-expressions": {
-      "version": "6.13.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-do-expressions/-/babel-plugin-syntax-do-expressions-6.13.0.tgz",
-      "integrity": "sha1-V0d1YTmqJtOQ0JQQsDdEugfkeW0="
-    },
-    "babel-plugin-syntax-dynamic-import": {
-      "version": "6.18.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-dynamic-import/-/babel-plugin-syntax-dynamic-import-6.18.0.tgz",
-      "integrity": "sha1-jWomIpyDdFqZgqRBBRVyyqF5sdo="
-    },
-    "babel-plugin-syntax-exponentiation-operator": {
-      "version": "6.13.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-exponentiation-operator/-/babel-plugin-syntax-exponentiation-operator-6.13.0.tgz",
-      "integrity": "sha1-nufoM3KQ2pUoggGmpX9BcDF4MN4="
-    },
-    "babel-plugin-syntax-export-extensions": {
-      "version": "6.13.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-export-extensions/-/babel-plugin-syntax-export-extensions-6.13.0.tgz",
-      "integrity": "sha1-cKFITw+QiaToStRLrDU8lbmxJyE="
-    },
-    "babel-plugin-syntax-flow": {
-      "version": "6.18.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-flow/-/babel-plugin-syntax-flow-6.18.0.tgz",
-      "integrity": "sha1-TDqyCiryaqIM0lmVw5jE63AxDI0="
-    },
-    "babel-plugin-syntax-function-bind": {
-      "version": "6.13.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-function-bind/-/babel-plugin-syntax-function-bind-6.13.0.tgz",
-      "integrity": "sha1-SMSV8Xe98xqYHnMvVa3AvdJgH0Y="
-    },
-    "babel-plugin-syntax-jsx": {
-      "version": "6.18.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz",
-      "integrity": "sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY="
-    },
-    "babel-plugin-syntax-object-rest-spread": {
-      "version": "6.13.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz",
-      "integrity": "sha1-/WU28rzhODb/o6VFjEkDpZe7O/U="
-    },
-    "babel-plugin-syntax-trailing-function-commas": {
-      "version": "6.22.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-trailing-function-commas/-/babel-plugin-syntax-trailing-function-commas-6.22.0.tgz",
-      "integrity": "sha1-ugNgk3+NBuQBgKQ/4NVhb/9TLPM="
-    },
-    "babel-plugin-transform-async-generator-functions": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-async-generator-functions/-/babel-plugin-transform-async-generator-functions-6.24.1.tgz",
-      "integrity": "sha1-8FiQAUX9PpkHpt3yjaWfIVJYpds="
-    },
-    "babel-plugin-transform-async-to-generator": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-async-to-generator/-/babel-plugin-transform-async-to-generator-6.24.1.tgz",
-      "integrity": "sha1-ZTbjeK/2yx1VF6wOQOs+n8jQh2E="
-    },
-    "babel-plugin-transform-class-constructor-call": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-class-constructor-call/-/babel-plugin-transform-class-constructor-call-6.24.1.tgz",
-      "integrity": "sha1-gNwoVQWsBn3LjWxl4vbxGrd2Xvk="
-    },
-    "babel-plugin-transform-class-properties": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-class-properties/-/babel-plugin-transform-class-properties-6.24.1.tgz",
-      "integrity": "sha1-anl2PqYdM9NvN7YRqp3vgagbRqw="
-    },
-    "babel-plugin-transform-decorators": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-decorators/-/babel-plugin-transform-decorators-6.24.1.tgz",
-      "integrity": "sha1-eIAT2PjGtSIr33s0Q5Df13Vp4k0="
-    },
-    "babel-plugin-transform-do-expressions": {
-      "version": "6.22.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-do-expressions/-/babel-plugin-transform-do-expressions-6.22.0.tgz",
-      "integrity": "sha1-KMyvkoEtlJws0SgfaQyP3EaK6bs="
-    },
-    "babel-plugin-transform-es2015-arrow-functions": {
-      "version": "6.22.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-arrow-functions/-/babel-plugin-transform-es2015-arrow-functions-6.22.0.tgz",
-      "integrity": "sha1-RSaSy3EdX3ncf4XkQM5BufJE0iE="
-    },
-    "babel-plugin-transform-es2015-block-scoped-functions": {
-      "version": "6.22.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-block-scoped-functions/-/babel-plugin-transform-es2015-block-scoped-functions-6.22.0.tgz",
-      "integrity": "sha1-u8UbSflk1wy42OC5ToICRs46YUE="
-    },
-    "babel-plugin-transform-es2015-block-scoping": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-block-scoping/-/babel-plugin-transform-es2015-block-scoping-6.26.0.tgz",
-      "integrity": "sha1-1w9SmcEwjQXBL0Y4E7CgnnOxiV8="
-    },
-    "babel-plugin-transform-es2015-classes": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-classes/-/babel-plugin-transform-es2015-classes-6.24.1.tgz",
-      "integrity": "sha1-WkxYpQyclGHlZLSyo7+ryXolhNs="
-    },
-    "babel-plugin-transform-es2015-computed-properties": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-computed-properties/-/babel-plugin-transform-es2015-computed-properties-6.24.1.tgz",
-      "integrity": "sha1-b+Ko0WiV1WNPTNmZttNICjCBWbM="
-    },
-    "babel-plugin-transform-es2015-destructuring": {
-      "version": "6.23.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-destructuring/-/babel-plugin-transform-es2015-destructuring-6.23.0.tgz",
-      "integrity": "sha1-mXux8auWf2gtKwh2/jWNYOdlxW0="
-    },
-    "babel-plugin-transform-es2015-duplicate-keys": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-duplicate-keys/-/babel-plugin-transform-es2015-duplicate-keys-6.24.1.tgz",
-      "integrity": "sha1-c+s9MQypaePvnskcU3QabxV2Qj4="
-    },
-    "babel-plugin-transform-es2015-for-of": {
-      "version": "6.23.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-for-of/-/babel-plugin-transform-es2015-for-of-6.23.0.tgz",
-      "integrity": "sha1-9HyVsrYT3x0+zC/bdXNiPHUkhpE="
-    },
-    "babel-plugin-transform-es2015-function-name": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-function-name/-/babel-plugin-transform-es2015-function-name-6.24.1.tgz",
-      "integrity": "sha1-g0yJhTvDaxrw86TF26qU/Y6sqos="
-    },
-    "babel-plugin-transform-es2015-literals": {
-      "version": "6.22.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-literals/-/babel-plugin-transform-es2015-literals-6.22.0.tgz",
-      "integrity": "sha1-T1SgLWzWbPkVKAAZox0xklN3yi4="
-    },
-    "babel-plugin-transform-es2015-modules-amd": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-modules-amd/-/babel-plugin-transform-es2015-modules-amd-6.24.1.tgz",
-      "integrity": "sha1-Oz5UAXI5hC1tGcMBHEvS8AoA0VQ="
-    },
-    "babel-plugin-transform-es2015-modules-commonjs": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-modules-commonjs/-/babel-plugin-transform-es2015-modules-commonjs-6.26.0.tgz",
-      "integrity": "sha1-DYOUApt9xqvhqX7xgeAHWN0uXYo="
-    },
-    "babel-plugin-transform-es2015-modules-systemjs": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-modules-systemjs/-/babel-plugin-transform-es2015-modules-systemjs-6.24.1.tgz",
-      "integrity": "sha1-/4mhQrkRmpBhlfXxBuzzBdlAfSM="
-    },
-    "babel-plugin-transform-es2015-modules-umd": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-modules-umd/-/babel-plugin-transform-es2015-modules-umd-6.24.1.tgz",
-      "integrity": "sha1-rJl+YoXNGO1hdq22B9YCNErThGg="
-    },
-    "babel-plugin-transform-es2015-object-super": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-object-super/-/babel-plugin-transform-es2015-object-super-6.24.1.tgz",
-      "integrity": "sha1-JM72muIcuDp/hgPa0CH1cusnj40="
-    },
-    "babel-plugin-transform-es2015-parameters": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-parameters/-/babel-plugin-transform-es2015-parameters-6.24.1.tgz",
-      "integrity": "sha1-V6w1GrScrxSpfNE7CfZv3wpiXys="
-    },
-    "babel-plugin-transform-es2015-shorthand-properties": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-shorthand-properties/-/babel-plugin-transform-es2015-shorthand-properties-6.24.1.tgz",
-      "integrity": "sha1-JPh11nIch2YbvZmkYi5R8U3jiqA="
-    },
-    "babel-plugin-transform-es2015-spread": {
-      "version": "6.22.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-spread/-/babel-plugin-transform-es2015-spread-6.22.0.tgz",
-      "integrity": "sha1-1taKmfia7cRTbIGlQujdnxdG+NE="
-    },
-    "babel-plugin-transform-es2015-sticky-regex": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-sticky-regex/-/babel-plugin-transform-es2015-sticky-regex-6.24.1.tgz",
-      "integrity": "sha1-AMHNsaynERLN8M9hJsLta0V8zbw="
-    },
-    "babel-plugin-transform-es2015-template-literals": {
-      "version": "6.22.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-template-literals/-/babel-plugin-transform-es2015-template-literals-6.22.0.tgz",
-      "integrity": "sha1-qEs0UPfp+PH2g51taH2oS7EjbY0="
-    },
-    "babel-plugin-transform-es2015-typeof-symbol": {
-      "version": "6.23.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-typeof-symbol/-/babel-plugin-transform-es2015-typeof-symbol-6.23.0.tgz",
-      "integrity": "sha1-3sCfHN3/lLUqxz1QXITfWdzOs3I="
-    },
-    "babel-plugin-transform-es2015-unicode-regex": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-unicode-regex/-/babel-plugin-transform-es2015-unicode-regex-6.24.1.tgz",
-      "integrity": "sha1-04sS9C6nMj9yk4fxinxa4frrNek=",
-      "dependencies": {
-        "regexpu-core": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-2.0.0.tgz",
-          "integrity": "sha1-SdA4g3uNz4v6W5pCE5k45uoq4kA="
-        }
-      }
-    },
-    "babel-plugin-transform-exponentiation-operator": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-exponentiation-operator/-/babel-plugin-transform-exponentiation-operator-6.24.1.tgz",
-      "integrity": "sha1-KrDJx/MJj6SJB3cruBP+QejeOg4="
-    },
-    "babel-plugin-transform-export-extensions": {
-      "version": "6.22.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-export-extensions/-/babel-plugin-transform-export-extensions-6.22.0.tgz",
-      "integrity": "sha1-U3OLR+deghhYnuqUbLvTkQm75lM="
-    },
-    "babel-plugin-transform-flow-strip-types": {
-      "version": "6.22.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-flow-strip-types/-/babel-plugin-transform-flow-strip-types-6.22.0.tgz",
-      "integrity": "sha1-hMtnKTXUNxT9wyvOhFaNh0Qc988="
-    },
-    "babel-plugin-transform-function-bind": {
-      "version": "6.22.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-function-bind/-/babel-plugin-transform-function-bind-6.22.0.tgz",
-      "integrity": "sha1-xvuOlqwpajELjPjqQBRiQH3fapc="
-    },
-    "babel-plugin-transform-inline-consecutive-adds": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-inline-consecutive-adds/-/babel-plugin-transform-inline-consecutive-adds-0.2.0.tgz",
-      "integrity": "sha512-GlhOuLOQ28ua9prg0hT33HslCrEmz9xWXy9ZNZSACppCyRxxRW+haYtRgm7uYXCcd0q8ggCWD2pfWEJp5iiZfQ=="
-    },
-    "babel-plugin-transform-member-expression-literals": {
-      "version": "6.8.5",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-member-expression-literals/-/babel-plugin-transform-member-expression-literals-6.8.5.tgz",
-      "integrity": "sha512-Ux3ligf+ukzWaCbBYOstDuFBhRgMiJHlpJBKV4P47qtzVkd0lg1ddPj9fqIJqAM0n+CvxipyrZrnNnw3CdtQCg=="
-    },
-    "babel-plugin-transform-merge-sibling-variables": {
-      "version": "6.8.6",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-merge-sibling-variables/-/babel-plugin-transform-merge-sibling-variables-6.8.6.tgz",
-      "integrity": "sha512-o5Jioq553HtEAUN5uty7ELJMenXIxHI3PIs1yLqYWYQwP6mg6IPVAJ+U7i4zr9XGF/kb2RGsdehglGTV+vngqA=="
-    },
-    "babel-plugin-transform-minify-booleans": {
-      "version": "6.8.3",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-minify-booleans/-/babel-plugin-transform-minify-booleans-6.8.3.tgz",
-      "integrity": "sha512-bPbUhkeN2Nc0KH0/A19GwQGj8w+CvdJzyu8t59VoEDgsNMQ9Bopzi5DrVkrSsVjbYUaZpzq/DYLrH+wD5K2Tig=="
-    },
-    "babel-plugin-transform-object-rest-spread": {
-      "version": "6.23.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-object-rest-spread/-/babel-plugin-transform-object-rest-spread-6.23.0.tgz",
-      "integrity": "sha1-h11ryb52HFiirj/u5dxIldjH+SE="
-    },
-    "babel-plugin-transform-property-literals": {
-      "version": "6.8.5",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-property-literals/-/babel-plugin-transform-property-literals-6.8.5.tgz",
-      "integrity": "sha512-MmiQsQ5AcIaRZMJD0zY5C4H3xuHm06/nWgtOsz7AXV44VEIXIlPiJ39IFYJ4Qx67/fEm8zJAedzR8t+B7d10Bg=="
-    },
-    "babel-plugin-transform-react-constant-elements": {
-      "version": "6.23.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-react-constant-elements/-/babel-plugin-transform-react-constant-elements-6.23.0.tgz",
-      "integrity": "sha1-LxGb9NLN1F65uqrldAU8YE9hR90="
-    },
-    "babel-plugin-transform-react-display-name": {
-      "version": "6.25.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-react-display-name/-/babel-plugin-transform-react-display-name-6.25.0.tgz",
-      "integrity": "sha1-Z+K/Hx6ck6sI25Z5LgU5K/LMKNE="
-    },
-    "babel-plugin-transform-react-jsx": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-react-jsx/-/babel-plugin-transform-react-jsx-6.24.1.tgz",
-      "integrity": "sha1-hAoCjn30YN/DotKfDA2R9jduZqM="
-    },
-    "babel-plugin-transform-react-jsx-self": {
-      "version": "6.22.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-react-jsx-self/-/babel-plugin-transform-react-jsx-self-6.22.0.tgz",
-      "integrity": "sha1-322AqdomEqEh5t3XVYvL7PBuY24="
-    },
-    "babel-plugin-transform-react-jsx-source": {
-      "version": "6.22.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-react-jsx-source/-/babel-plugin-transform-react-jsx-source-6.22.0.tgz",
-      "integrity": "sha1-ZqwSFT9c0tF7PBkmj0vwGX9E7NY="
-    },
-    "babel-plugin-transform-regenerator": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-regenerator/-/babel-plugin-transform-regenerator-6.26.0.tgz",
-      "integrity": "sha1-4HA2lvveJ/Cj78rPi03KL3s6jy8="
-    },
-    "babel-plugin-transform-regexp-constructors": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-regexp-constructors/-/babel-plugin-transform-regexp-constructors-0.2.0.tgz",
-      "integrity": "sha512-7IsQ6aQx6LAaOqy97/PthTf+5Nx9grZww3r6E62IdWe76Yr8KsuwVjxzqSPQvESJqTE3EMADQ9S0RtwWDGNG9Q=="
-    },
-    "babel-plugin-transform-remove-console": {
-      "version": "6.8.5",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-remove-console/-/babel-plugin-transform-remove-console-6.8.5.tgz",
-      "integrity": "sha512-uuCKvtweCyIvvC8fi92EcWRtO2Kt5KMNMRK6BhpDXdeb3sxvGM7453RSmgeu4DlKns3OlvY9Ep5Q9m5a7RQAgg=="
-    },
-    "babel-plugin-transform-remove-debugger": {
-      "version": "6.8.5",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-remove-debugger/-/babel-plugin-transform-remove-debugger-6.8.5.tgz",
-      "integrity": "sha512-InDQDdHPOLJKM+G6oXrEesf+P29QFBmcTXID+TAvZziVz+38xe2VO/Bn3FcRcRtnOOycbgsJkUNp9jIK+ist6g=="
-    },
-    "babel-plugin-transform-remove-undefined": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-remove-undefined/-/babel-plugin-transform-remove-undefined-0.2.0.tgz",
-      "integrity": "sha512-O8v57tPMHkp89kA4ZfQEYds/pzgvz/QYerBJjIuL5/Jc7RnvMVRA5gJY9zFKP7WayW8WOSBV4vh8Y8FJRio+ow=="
-    },
-    "babel-plugin-transform-runtime": {
-      "version": "6.23.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-runtime/-/babel-plugin-transform-runtime-6.23.0.tgz",
-      "integrity": "sha1-iEkNRGUC6puOfvsP4J7E2ZR5se4="
-    },
-    "babel-plugin-transform-simplify-comparison-operators": {
-      "version": "6.8.5",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-simplify-comparison-operators/-/babel-plugin-transform-simplify-comparison-operators-6.8.5.tgz",
-      "integrity": "sha512-B3HlBZb+Uq86nRj5yNPO6pJ3noEdqHvzYkEYoUWtrsWTv48ZIRatYlumoOiif/v8llF13YjYjx9zhyznDx+N9g=="
-    },
-    "babel-plugin-transform-strict-mode": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-strict-mode/-/babel-plugin-transform-strict-mode-6.24.1.tgz",
-      "integrity": "sha1-1fr3qleKZbvlkc9e2uBKDGcCB1g="
-    },
-    "babel-plugin-transform-undefined-to-void": {
-      "version": "6.8.3",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-undefined-to-void/-/babel-plugin-transform-undefined-to-void-6.8.3.tgz",
-      "integrity": "sha512-goYwp8dMrzHD6x9GjZ2M85Mk2vxf1h85CnUgAjfftUnlJvzF4uj5MrbReHBTbjQ96C8CuRzvhYZ3tv8H3Sc1ZA=="
-    },
-    "babel-preset-env": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/babel-preset-env/-/babel-preset-env-1.6.0.tgz",
-      "integrity": "sha512-OVgtQRuOZKckrILgMA5rvctvFZPv72Gua9Rt006AiPoB0DJKGN07UmaQA+qRrYgK71MVct8fFhT0EyNWYorVew==",
-      "dependencies": {
-        "browserslist": {
-          "version": "2.4.0",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.4.0.tgz",
-          "integrity": "sha512-aM2Gt4x9bVlCUteADBS6JP0F+2tMWKM1jQzUulVROtdFWFIcIVvY76AJbr7GDqy0eDhn+PcnpzzivGxY4qiaKQ=="
-        },
-        "semver": {
-          "version": "5.4.1",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
-          "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg=="
-        }
-      }
-    },
-    "babel-preset-flow": {
-      "version": "6.23.0",
-      "resolved": "https://registry.npmjs.org/babel-preset-flow/-/babel-preset-flow-6.23.0.tgz",
-      "integrity": "sha1-5xIYiHCFrpoktb5Baa/7WZgWxJ0="
-    },
-    "babel-preset-jest": {
-      "version": "21.2.0",
-      "resolved": "https://registry.npmjs.org/babel-preset-jest/-/babel-preset-jest-21.2.0.tgz",
-      "integrity": "sha512-hm9cBnr2h3J7yXoTtAVV0zg+3vg0Q/gT2GYuzlreTU0EPkJRtlNgKJJ3tBKEn0+VjAi3JykV6xCJkuUYttEEfA=="
-    },
-    "babel-preset-minify": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/babel-preset-minify/-/babel-preset-minify-0.2.0.tgz",
-      "integrity": "sha512-mR8Q44RmMzm18bM2Lqd9uiPopzk5GDCtVuquNbLFmX6lOKnqWoenaNBxnWW0UhBFC75lEHTIgNGCbnsRI0pJVw=="
-    },
-    "babel-preset-react": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-preset-react/-/babel-preset-react-6.24.1.tgz",
-      "integrity": "sha1-umnfrqRfw+xjm2pOzqbhdwLJE4A="
-    },
-    "babel-preset-react-app": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/babel-preset-react-app/-/babel-preset-react-app-3.0.3.tgz",
-      "integrity": "sha512-hK1hPq8xOFxmnNwpsOcQ2wSRAQwNBhDqsMV75gyKYQ7Z39KmTRpMN2Jx6Wp0Mberqd2QEWsUqd9ccP2jfd4z2Q==",
-      "dependencies": {
-        "babel-plugin-transform-regenerator": {
-          "version": "6.24.1",
-          "resolved": "https://registry.npmjs.org/babel-plugin-transform-regenerator/-/babel-plugin-transform-regenerator-6.24.1.tgz",
-          "integrity": "sha1-uNowWtQ8PJm0hI5P5AN7dw0jxBg="
-        },
-        "babel-preset-env": {
-          "version": "1.5.2",
-          "resolved": "https://registry.npmjs.org/babel-preset-env/-/babel-preset-env-1.5.2.tgz",
-          "integrity": "sha1-zUrpCm6Utwn5c3SzPl+LmDVWre8="
-        },
-        "browserslist": {
-          "version": "2.4.0",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.4.0.tgz",
-          "integrity": "sha512-aM2Gt4x9bVlCUteADBS6JP0F+2tMWKM1jQzUulVROtdFWFIcIVvY76AJbr7GDqy0eDhn+PcnpzzivGxY4qiaKQ=="
-        },
-        "regenerator-transform": {
-          "version": "0.9.11",
-          "resolved": "https://registry.npmjs.org/regenerator-transform/-/regenerator-transform-0.9.11.tgz",
-          "integrity": "sha1-On0GdSDLe3F2dp61/4aGkb7+EoM="
-        },
-        "semver": {
-          "version": "5.4.1",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
-          "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg=="
-        }
-      }
-    },
-    "babel-preset-stage-0": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-preset-stage-0/-/babel-preset-stage-0-6.24.1.tgz",
-      "integrity": "sha1-VkLRUEL5E4TX5a+LyIsduVsDnmo="
-    },
-    "babel-preset-stage-1": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-preset-stage-1/-/babel-preset-stage-1-6.24.1.tgz",
-      "integrity": "sha1-dpLNfc1oSZB+auSgqFWJz7niv7A="
-    },
-    "babel-preset-stage-2": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-preset-stage-2/-/babel-preset-stage-2-6.24.1.tgz",
-      "integrity": "sha1-2eKWD7PXEYfw5k7sYrwHdnIZvcE="
-    },
-    "babel-preset-stage-3": {
-      "version": "6.24.1",
-      "resolved": "https://registry.npmjs.org/babel-preset-stage-3/-/babel-preset-stage-3-6.24.1.tgz",
-      "integrity": "sha1-g2raCp56f6N8sTj7kyb4eTSkg5U="
-    },
-    "babel-register": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-register/-/babel-register-6.26.0.tgz",
-      "integrity": "sha1-btAhFz4vy0htestFxgCahW9kcHE="
-    },
-    "babel-runtime": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz",
-      "integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4="
-    },
-    "babel-template": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-template/-/babel-template-6.26.0.tgz",
-      "integrity": "sha1-3gPi0WOWsGn0bdn/+FIfsaDjXgI="
-    },
-    "babel-traverse": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-traverse/-/babel-traverse-6.26.0.tgz",
-      "integrity": "sha1-RqnL1+3MYsjlwGTi0tjQ9ANXZu4="
+    "append-transform": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/append-transform/-/append-transform-0.4.0.tgz",
+      "integrity": "sha1-126/jKlNJ24keja61EpLdKthGZE="
     },
-    "babel-types": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-types/-/babel-types-6.26.0.tgz",
-      "integrity": "sha1-o7Bz+Uq0nrb6Vc1lInozQ4BjJJc="
+    "aproba": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.2.0.tgz",
+      "integrity": "sha512-Y9J6ZjXtoYh8RnXVCMOU/ttDmk1aBjunq9vO0ta5x85WDQiQfUF9sIPBITdbiiIVcBo03Hi3jMxigBtsddlXRw=="
     },
-    "babylon": {
-      "version": "6.18.0",
-      "resolved": "https://registry.npmjs.org/babylon/-/babylon-6.18.0.tgz",
-      "integrity": "sha512-q/UEjfGJ2Cm3oKV71DJz9d25TPnq5rhBVL2Q4fA5wcC3jcrdn7+SssEybFIxwAvvP+YCsCYNKughoF33GxgycQ=="
+    "are-we-there-yet": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/are-we-there-yet/-/are-we-there-yet-1.1.4.tgz",
+      "integrity": "sha1-u13KOCu5TwXhUZQ3PRb9O6HKEQ0="
     },
-    "backo2": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz",
-      "integrity": "sha1-MasayLEpNjRj41s+u2n038+6eUc="
+    "argparse": {
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.9.tgz",
+      "integrity": "sha1-c9g7wmP4bpf4zE9rrhsOkKfSLIY="
     },
-    "balanced-match": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
-      "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c="
+    "arr-diff": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-4.0.0.tgz",
+      "integrity": "sha1-1kYQdP6/7HHn4VI1dhoyml3HxSA="
     },
-    "base": {
-      "version": "0.11.2",
-      "resolved": "https://registry.npmjs.org/base/-/base-0.11.2.tgz",
-      "integrity": "sha512-5T6P4xPgpp0YDFvSWwEZ4NoE3aM4QBQXDzmVbraCkFj8zHM+mba8SyqB5DbZWyR7mYHo6Y7BdQo3MoA4m0TeQg=="
+    "arr-flatten": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.1.0.tgz",
+      "integrity": "sha512-L3hKV5R/p5o81R7O02IGnwpDmkp6E982XhtbuwSe3O4qOtMMMtodicASA1Cny2U+aCXcNpml+m4dPsvsJ3jatg=="
     },
-    "base64-arraybuffer": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/base64-arraybuffer/-/base64-arraybuffer-0.1.5.tgz",
-      "integrity": "sha1-c5JncZI7Whl0etZmqlzUv5xunOg="
+    "arr-union": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/arr-union/-/arr-union-3.1.0.tgz",
+      "integrity": "sha1-45sJrqne+Gao8gbiiK9jkZuuOcQ="
     },
-    "base64-js": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.2.1.tgz",
-      "integrity": "sha512-dwVUVIXsBZXwTuwnXI9RK8sBmgq09NDHzyR9SAph9eqk76gKK2JSQmZARC2zRC81JC2QTtxD0ARU5qTS25gIGw=="
+    "array-back": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/array-back/-/array-back-2.0.0.tgz",
+      "integrity": "sha512-eJv4pLLufP3g5kcZry0j6WXpIbzYw9GUB4mVJZno9wfwiBxbizTnHCw3VJb07cBihbFX48Y7oSrW9y+gt4glyw=="
     },
-    "base64id": {
+    "array-equal": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/base64id/-/base64id-1.0.0.tgz",
-      "integrity": "sha1-R2iMuZu2gE8OBtPnY7HDLlfY5rY="
+      "resolved": "https://registry.npmjs.org/array-equal/-/array-equal-1.0.0.tgz",
+      "integrity": "sha1-jCpe8kcv2ep0KwTHenUJO6J1fJM="
     },
-    "batch": {
-      "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/batch/-/batch-0.6.1.tgz",
-      "integrity": "sha1-3DQxT05nkxgJP8dgJyUl+UvyXBY="
+    "array-filter": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/array-filter/-/array-filter-0.0.1.tgz",
+      "integrity": "sha1-fajPLiZijtcygDWB/SH2fKzS7uw="
     },
-    "bcrypt-pbkdf": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/bcrypt-pbkdf/-/bcrypt-pbkdf-1.0.1.tgz",
-      "integrity": "sha1-Y7xdy2EzG5K8Bf1SiVPDNGKgb40=",
-      "optional": true
+    "array-find": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/array-find/-/array-find-1.0.0.tgz",
+      "integrity": "sha1-bI4obRHtdoMn+OYuzuhzU8o+eLg="
     },
-    "better-assert": {
+    "array-find-index": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/better-assert/-/better-assert-1.0.2.tgz",
-      "integrity": "sha1-QIZrnhueC1W0gYlDEeaPr/rrxSI="
-    },
-    "big.js": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/big.js/-/big.js-3.2.0.tgz",
-      "integrity": "sha512-+hN/Zh2D08Mx65pZ/4g5bsmNiZUuChDiQfTUQ7qJr4/kuopCr88xZsAXv6mBoZEsUI4OuGHlX59qE94K2mMW8Q=="
-    },
-    "binary": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/binary/-/binary-0.3.0.tgz",
-      "integrity": "sha1-n2BVO8XOjDOG87VTz/R0Yq3sqnk="
-    },
-    "binary-extensions": {
-      "version": "1.10.0",
-      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.10.0.tgz",
-      "integrity": "sha1-muuabF6IY4qtFx4Wf1kAq+JINdA="
+      "resolved": "https://registry.npmjs.org/array-find-index/-/array-find-index-1.0.2.tgz",
+      "integrity": "sha1-3wEKoSh+Fku9pvlyOwqWoexBh6E="
     },
-    "blob": {
-      "version": "0.0.4",
-      "resolved": "https://registry.npmjs.org/blob/-/blob-0.0.4.tgz",
-      "integrity": "sha1-vPEwUspURj8w+fx+lbmkdjCpSSE="
+    "array-flatten": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
+      "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI="
     },
-    "block-stream": {
-      "version": "0.0.9",
-      "resolved": "https://registry.npmjs.org/block-stream/-/block-stream-0.0.9.tgz",
-      "integrity": "sha1-E+v+d4oDIFz+A3UUgeu0szAMEmo="
+    "array-includes": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/array-includes/-/array-includes-3.0.3.tgz",
+      "integrity": "sha1-GEtI9i2S10UrsxsyMWXH+L0CJm0="
     },
-    "bluebird": {
-      "version": "3.5.0",
-      "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.5.0.tgz",
-      "integrity": "sha1-eRQg1/VR7qKJdFOop3ZT+WYG1nw="
+    "array-map": {
+      "version": "0.0.0",
+      "resolved": "https://registry.npmjs.org/array-map/-/array-map-0.0.0.tgz",
+      "integrity": "sha1-iKK6tz0c97zVwbEYoAP2b2ZfpmI="
     },
-    "bn.js": {
-      "version": "4.11.8",
-      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.8.tgz",
-      "integrity": "sha512-ItfYfPLkWHUjckQCk8xC+LwxgK8NYcXywGigJgSwOP8Y2iyWT4f2vsZnoOXTTbo+o5yXmIUJ4gn5538SO5S3gA=="
+    "array-reduce": {
+      "version": "0.0.0",
+      "resolved": "https://registry.npmjs.org/array-reduce/-/array-reduce-0.0.0.tgz",
+      "integrity": "sha1-FziZ0//Rx9k4PkR5Ul2+J4yrXys="
     },
-    "body-parser": {
-      "version": "1.18.2",
-      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.18.2.tgz",
-      "integrity": "sha1-h2eKGdhLR9hZuDGZvVm84iKxBFQ=",
-      "dependencies": {
-        "iconv-lite": {
-          "version": "0.4.19",
-          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.19.tgz",
-          "integrity": "sha512-oTZqweIP51xaGPI4uPa56/Pri/480R+mo7SeU+YETByQNhDG55ycFyNLIgta9vXhILrxXDmF7ZGhqZIcuN0gJQ=="
-        }
-      }
+    "array-slice": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/array-slice/-/array-slice-0.2.3.tgz",
+      "integrity": "sha1-3Tz7gO15c6dRF82sabC5nshhhvU="
     },
-    "bonjour": {
-      "version": "3.5.0",
-      "resolved": "https://registry.npmjs.org/bonjour/-/bonjour-3.5.0.tgz",
-      "integrity": "sha1-jokKGD2O6aI5OzhExpGkK897yfU=",
-      "dependencies": {
-        "array-flatten": {
-          "version": "2.1.1",
-          "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-2.1.1.tgz",
-          "integrity": "sha1-Qmu52oQJDBg42BLIFQryCoMx4pY="
-        }
-      }
+    "array-union": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz",
+      "integrity": "sha1-mjRBDk9OPaI96jdb5b5w8kd47Dk="
     },
-    "boolbase": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
-      "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24="
+    "array-uniq": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz",
+      "integrity": "sha1-r2rId6Jcx/dOBYiUdThY39sk/bY="
     },
-    "boom": {
-      "version": "4.3.1",
-      "resolved": "https://registry.npmjs.org/boom/-/boom-4.3.1.tgz",
-      "integrity": "sha1-T4owBctKfjiJ90kDD9JbluAdLjE="
+    "array-unique": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.3.2.tgz",
+      "integrity": "sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg="
     },
-    "bowser": {
-      "version": "1.7.3",
-      "resolved": "https://registry.npmjs.org/bowser/-/bowser-1.7.3.tgz",
-      "integrity": "sha1-UEvbQxGMqNucu63yj9YPJlr5bk8="
+    "arraybuffer.slice": {
+      "version": "0.0.6",
+      "resolved": "https://registry.npmjs.org/arraybuffer.slice/-/arraybuffer.slice-0.0.6.tgz",
+      "integrity": "sha1-8zshWfBTKj8xB6JywMz70a0peco="
     },
-    "brace-expansion": {
-      "version": "1.1.8",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.8.tgz",
-      "integrity": "sha1-wHshHHyVLsH479Uad+8NHTmQopI="
+    "arrify": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz",
+      "integrity": "sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0="
     },
-    "braces": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/braces/-/braces-2.2.2.tgz",
-      "integrity": "sha1-JB+GjCsmkNn+vu5afIP7vyXQCxs="
+    "asap": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz",
+      "integrity": "sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY="
     },
-    "brcast": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/brcast/-/brcast-3.0.1.tgz",
-      "integrity": "sha512-eI3yqf9YEqyGl9PCNTR46MGvDylGtaHjalcz6Q3fAPnP/PhpKkkve52vFdfGpwp4VUvK6LUr4TQN+2stCrEwTg=="
+    "asn1": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.3.tgz",
+      "integrity": "sha1-2sh4dxPJlmhJ/IGAd36+nB3fO4Y="
     },
-    "brorand": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/brorand/-/brorand-1.1.0.tgz",
-      "integrity": "sha1-EsJe/kCkXjwyPrhnWgoM5XsiNx8="
+    "asn1.js": {
+      "version": "4.9.1",
+      "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-4.9.1.tgz",
+      "integrity": "sha1-SLokC0WpKA6UdImQull9IWYX/UA="
     },
-    "browser-resolve": {
-      "version": "1.11.2",
-      "resolved": "https://registry.npmjs.org/browser-resolve/-/browser-resolve-1.11.2.tgz",
-      "integrity": "sha1-j/CbCixCFxihBRwmCzLkj0QpOM4=",
-      "dependencies": {
-        "resolve": {
-          "version": "1.1.7",
-          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz",
-          "integrity": "sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs="
-        }
-      }
+    "assert": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/assert/-/assert-1.4.1.tgz",
+      "integrity": "sha1-mZEtWRg2tab1s0XA8H7vwI/GXZE="
     },
-    "browser-stdout": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/browser-stdout/-/browser-stdout-1.3.0.tgz",
-      "integrity": "sha1-81HTKWnTL6XXpVZxVCY9korjvR8="
+    "assert-plus": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+      "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
     },
-    "browserify-aes": {
-      "version": "1.0.8",
-      "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.8.tgz",
-      "integrity": "sha512-WYCMOT/PtGTlpOKFht0YJFYcPy6pLCR98CtWfzK13zoynLlBMvAdEMSRGmgnJCw2M2j/5qxBkinZQFobieM8dQ=="
+    "assertion-error": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-1.0.2.tgz",
+      "integrity": "sha1-E8pRXYYgbaC6xm6DTdOX2HWBCUw="
     },
-    "browserify-cipher": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/browserify-cipher/-/browserify-cipher-1.0.0.tgz",
-      "integrity": "sha1-mYgkSHS/XtTijalWZtzWasj8Njo="
+    "ast-types": {
+      "version": "0.9.11",
+      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.9.11.tgz",
+      "integrity": "sha1-NxF3u1kjL/XOqh0J7lytcFsaWqk="
     },
-    "browserify-des": {
+    "astral-regex": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/browserify-des/-/browserify-des-1.0.0.tgz",
-      "integrity": "sha1-2qJ3cXRwki7S/hhZQRihdUOXId0="
+      "resolved": "https://registry.npmjs.org/astral-regex/-/astral-regex-1.0.0.tgz",
+      "integrity": "sha512-+Ryf6g3BKoRc7jfp7ad8tM4TtMiaWvbF/1/sQcZPkkS7ag3D5nMBCe2UfOTONtAkaG0tO0ij3C5Lwmf1EiyjHg=="
     },
-    "browserify-rsa": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz",
-      "integrity": "sha1-IeCr+vbyApzy+vsTNWenAdQTVSQ="
+    "async": {
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
+      "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw=="
     },
-    "browserify-sign": {
-      "version": "4.0.4",
-      "resolved": "https://registry.npmjs.org/browserify-sign/-/browserify-sign-4.0.4.tgz",
-      "integrity": "sha1-qk62jl17ZYuqa/alfmMMvXqT0pg="
+    "async-each": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/async-each/-/async-each-1.0.1.tgz",
+      "integrity": "sha1-GdOGodntxufByF04iu28xW0zYC0="
     },
-    "browserify-zlib": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/browserify-zlib/-/browserify-zlib-0.1.4.tgz",
-      "integrity": "sha1-uzX4pRn2AOD6a4SFJByXnQFB+y0="
+    "async-foreach": {
+      "version": "0.1.3",
+      "resolved": "https://registry.npmjs.org/async-foreach/-/async-foreach-0.1.3.tgz",
+      "integrity": "sha1-NhIfhFwFeBct5Bmpfb6x0W7DRUI="
     },
-    "browserslist": {
-      "version": "1.7.7",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
-      "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk="
+    "asynckit": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
+      "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k="
     },
-    "bser": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/bser/-/bser-2.0.0.tgz",
-      "integrity": "sha1-mseNPtXZFYBP2HrLFYvHlxR6Fxk="
+    "atob": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/atob/-/atob-2.0.3.tgz",
+      "integrity": "sha1-GcenYEc3dEaPILLS0DNyrX1Mv10="
     },
-    "buffer": {
-      "version": "4.9.1",
-      "resolved": "https://registry.npmjs.org/buffer/-/buffer-4.9.1.tgz",
-      "integrity": "sha1-bRu2AbB6TvztlwlBMgkwJ8lbwpg="
+    "autolinker": {
+      "version": "0.15.3",
+      "resolved": "https://registry.npmjs.org/autolinker/-/autolinker-0.15.3.tgz",
+      "integrity": "sha1-NCQX2PLzRhsUzwkIjV7fh5HcmDI="
     },
-    "buffer-indexof": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/buffer-indexof/-/buffer-indexof-1.1.1.tgz",
-      "integrity": "sha512-4/rOEg86jivtPTeOUUT61jJO1Ya1TrR/OkqCSZDyq84WJh3LuuiphBYJN+fm5xufIk4XAFcEwte/8WzC8If/1g=="
+    "autoprefixer": {
+      "version": "7.1.4",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-7.1.4.tgz",
+      "integrity": "sha512-MB1XybOJqu1uAwpfSilAa1wSURNc4W310CFKvMj1fNaJBFxr1PGgz72vZaPr9ryKGqs2vYZ6jDyJ0aiGELjsoA=="
     },
-    "buffer-xor": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/buffer-xor/-/buffer-xor-1.0.3.tgz",
-      "integrity": "sha1-JuYe0UIvtw3ULm42cp7VHYVf6Nk="
+    "awesome-typescript-loader": {
+      "version": "3.2.3",
+      "resolved": "https://registry.npmjs.org/awesome-typescript-loader/-/awesome-typescript-loader-3.2.3.tgz",
+      "integrity": "sha512-zGGD6j6jYYtIOBtfhtnrbNB3dlDThVdgF9CQhkPqBwPUUsyJOHNxj9d2LOmVJY1PlBoNPABoDeyRfphIDeYGxA=="
     },
-    "buffers": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/buffers/-/buffers-0.1.1.tgz",
-      "integrity": "sha1-skV5w77U1tOWru5tmorn9Ugqt7s="
+    "aws-sign2": {
+      "version": "0.7.0",
+      "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.7.0.tgz",
+      "integrity": "sha1-tG6JCTSpWR8tL2+G1+ap8bP+dqg="
     },
-    "build": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/build/-/build-0.1.4.tgz",
-      "integrity": "sha1-cH/gJv/O3crL/c3zVur9pk8VEEY=",
+    "aws4": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.6.0.tgz",
+      "integrity": "sha1-g+9cqGCysy5KDe7e6MdxudtXRx4="
+    },
+    "babel-code-frame": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
+      "integrity": "sha1-Y/1D99weO7fONZR9uP42mj9Yx0s=",
       "dependencies": {
-        "uglify-js": {
-          "version": "1.3.5",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-1.3.5.tgz",
-          "integrity": "sha1-S1v/+Rhu/7qoiOTJ6UvZ/EyUkp0="
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
         }
       }
     },
-    "builtin-modules": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz",
-      "integrity": "sha1-Jw8HbFpywC9bZaR9+Uxf46J4iS8="
-    },
-    "builtin-status-codes": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz",
-      "integrity": "sha1-hZgoeOIbmOHGZCXgPQF0eI9Wnug="
-    },
-    "bytes": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.0.0.tgz",
-      "integrity": "sha1-0ygVQE1olpn4Wk6k+odV3ROpYEg="
+    "babel-core": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-core/-/babel-core-6.26.0.tgz",
+      "integrity": "sha1-rzL3izGm/O8RnIew/Y2XU/A6C7g=",
+      "dependencies": {
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
+        }
+      }
     },
-    "cache-base": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/cache-base/-/cache-base-1.0.1.tgz",
-      "integrity": "sha512-AKcdTnFSWATd5/GCPRxr2ChwIJ85CeyrEyjRHlKxQ56d4XJMGym0uAiKn0xbLOGOl3+yRpOTi484dVCEc5AUzQ=="
+    "babel-generator": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-generator/-/babel-generator-6.26.0.tgz",
+      "integrity": "sha1-rBriAHC3n248odMmlhMFN3TyDcU=",
+      "dependencies": {
+        "jsesc": {
+          "version": "1.3.0",
+          "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-1.3.0.tgz",
+          "integrity": "sha1-RsP+yMGJKxKwgz25vHYiF226s0s="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
+        }
+      }
     },
-    "callsite": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/callsite/-/callsite-1.0.0.tgz",
-      "integrity": "sha1-KAOY5dZkvXQDi28JBRU+borxvCA="
+    "babel-helper-bindify-decorators": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-bindify-decorators/-/babel-helper-bindify-decorators-6.24.1.tgz",
+      "integrity": "sha1-FMGeXxQte0fxmlJDHlKxzLxAozA="
     },
-    "callsites": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/callsites/-/callsites-2.0.0.tgz",
-      "integrity": "sha1-BuuE8A7qQT2oav/vrL/7Ngk7PFA="
+    "babel-helper-builder-binary-assignment-operator-visitor": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-builder-binary-assignment-operator-visitor/-/babel-helper-builder-binary-assignment-operator-visitor-6.24.1.tgz",
+      "integrity": "sha1-zORReto1b0IgvK6KAsKzRvmlZmQ="
     },
-    "camelcase": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
-      "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
+    "babel-helper-builder-react-jsx": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-helper-builder-react-jsx/-/babel-helper-builder-react-jsx-6.26.0.tgz",
+      "integrity": "sha1-Of+DE7dci2Xc7/HzHTg+D/KkCKA="
     },
-    "camelcase-keys": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/camelcase-keys/-/camelcase-keys-2.1.0.tgz",
-      "integrity": "sha1-MIvur/3ygRkFHvodkyITyRuPkuc=",
-      "dependencies": {
-        "camelcase": {
-          "version": "2.1.1",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz",
-          "integrity": "sha1-fB0W1nmhu+WcoCys7PsBHiAfWh8="
-        }
-      }
+    "babel-helper-call-delegate": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-call-delegate/-/babel-helper-call-delegate-6.24.1.tgz",
+      "integrity": "sha1-7Oaqzdx25Bw0YfiL/Fdb0Nqi340="
     },
-    "caniuse-api": {
-      "version": "1.6.1",
-      "resolved": "https://registry.npmjs.org/caniuse-api/-/caniuse-api-1.6.1.tgz",
-      "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
+    "babel-helper-define-map": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-helper-define-map/-/babel-helper-define-map-6.26.0.tgz",
+      "integrity": "sha1-pfVtq0GiX5fstJjH66ypgZ+Vvl8="
     },
-    "caniuse-db": {
-      "version": "1.0.30000740",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000740.tgz",
-      "integrity": "sha1-A/yqoXbj7QdYlfctRsGhIUm76sk="
+    "babel-helper-evaluate-path": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-helper-evaluate-path/-/babel-helper-evaluate-path-0.2.0.tgz",
+      "integrity": "sha512-0EK9TUKMxHL549hWDPkQoS7R0Ozg1CDLheVBHYds2B2qoAvmr9ejY3zOXFsrICK73TN7bPhU14PBeKc8jcBTwg=="
     },
-    "caniuse-lite": {
-      "version": "1.0.30000740",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000740.tgz",
-      "integrity": "sha1-8sTATWVk64EuYQBoQXAK1Vf2+XM="
+    "babel-helper-explode-assignable-expression": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-explode-assignable-expression/-/babel-helper-explode-assignable-expression-6.24.1.tgz",
+      "integrity": "sha1-8luCz33BBDPFX3BZLVdGQArCLKo="
     },
-    "cardinal": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/cardinal/-/cardinal-1.0.0.tgz",
-      "integrity": "sha1-UOIcGwqjdyn5N33vGWtanOyTLuk="
+    "babel-helper-explode-class": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-explode-class/-/babel-helper-explode-class-6.24.1.tgz",
+      "integrity": "sha1-fcKjkQ3uAHBW4eMdZAztPVTqqes="
     },
-    "case-sensitive-paths-webpack-plugin": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/case-sensitive-paths-webpack-plugin/-/case-sensitive-paths-webpack-plugin-2.1.1.tgz",
-      "integrity": "sha1-PSnO2MHxJL9vU4Rvs/WJRzH9yQk="
+    "babel-helper-flip-expressions": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-helper-flip-expressions/-/babel-helper-flip-expressions-0.2.0.tgz",
+      "integrity": "sha512-rAsPA1pWBc7e2E6HepkP2e1sXugT+Oq/VCqhyuHJ8aJ2d/ifwnJfd4Qxjm21qlW43AN8tqaeByagKK6wECFMSw=="
     },
-    "caseless": {
-      "version": "0.12.0",
-      "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz",
-      "integrity": "sha1-G2gcIf+EAzyCZUMJBolCDRhxUdw="
+    "babel-helper-function-name": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-function-name/-/babel-helper-function-name-6.24.1.tgz",
+      "integrity": "sha1-00dbjAPtmCQqJbSDUasYOZ01gKk="
     },
-    "center-align": {
-      "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/center-align/-/center-align-0.1.3.tgz",
-      "integrity": "sha1-qg0yYptu6XIgBBHL1EYckHvCt60=",
-      "dependencies": {
-        "lazy-cache": {
-          "version": "1.0.4",
-          "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-1.0.4.tgz",
-          "integrity": "sha1-odePw6UEdMuAhF07O24dpJpEbo4="
-        }
-      }
+    "babel-helper-get-function-arity": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-get-function-arity/-/babel-helper-get-function-arity-6.24.1.tgz",
+      "integrity": "sha1-j3eCqpNAfEHTqlCQj4mwMbG2hT0="
     },
-    "chai": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/chai/-/chai-4.1.2.tgz",
-      "integrity": "sha1-D2RYS6ZC8PKs4oBiefTwbKI61zw="
+    "babel-helper-hoist-variables": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-hoist-variables/-/babel-helper-hoist-variables-6.24.1.tgz",
+      "integrity": "sha1-HssnaJydJVE+rbyZFKc/VAi+enY="
     },
-    "chain-function": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/chain-function/-/chain-function-1.0.0.tgz",
-      "integrity": "sha1-DUqzfn4Y6tC9xHuSB2QRjOWHM9w="
+    "babel-helper-is-nodes-equiv": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-is-nodes-equiv/-/babel-helper-is-nodes-equiv-0.0.1.tgz",
+      "integrity": "sha1-NOmzALFHnd2Y7HfqC76TQt/jloQ="
     },
-    "chainsaw": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/chainsaw/-/chainsaw-0.1.0.tgz",
-      "integrity": "sha1-XqtQsor+WAdNDVgpE4iCi15fvJg="
+    "babel-helper-is-void-0": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-helper-is-void-0/-/babel-helper-is-void-0-0.2.0.tgz",
+      "integrity": "sha512-Axj1AYuD0E3Dl7nT3KxROP7VekEofz3XtEljzURf3fABalLpr8PamtgLFt+zuxtaCxRf9iuZmbAMMYWri5Bazw=="
     },
-    "chalk": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
-      "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ=="
+    "babel-helper-mark-eval-scopes": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-helper-mark-eval-scopes/-/babel-helper-mark-eval-scopes-0.2.0.tgz",
+      "integrity": "sha512-KJuwrOUcHbvbh6he4xRXZFLaivK9DF9o3CrvpWnK1Wp0B+1ANYABXBMgwrnNFIDK/AvicxQ9CNr8wsgivlp4Aw=="
     },
-    "check-error": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/check-error/-/check-error-1.0.2.tgz",
-      "integrity": "sha1-V00xLt2Iu13YkS6Sht1sCu1KrII="
+    "babel-helper-optimise-call-expression": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-optimise-call-expression/-/babel-helper-optimise-call-expression-6.24.1.tgz",
+      "integrity": "sha1-96E0J7qfc/j0+pk8VKl4gtEkQlc="
     },
-    "cheerio": {
-      "version": "0.22.0",
-      "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-0.22.0.tgz",
-      "integrity": "sha1-qbqoYKP5tZWmuBsahocxIe06Jp4="
+    "babel-helper-regex": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-helper-regex/-/babel-helper-regex-6.26.0.tgz",
+      "integrity": "sha1-MlxZ+QL4LyS3T6zu0DY5VPZJXnI="
     },
-    "chokidar": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-1.7.0.tgz",
-      "integrity": "sha1-eY5ol3gVHIB2tLNg5e3SjNortGg="
+    "babel-helper-remap-async-to-generator": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-remap-async-to-generator/-/babel-helper-remap-async-to-generator-6.24.1.tgz",
+      "integrity": "sha1-XsWBgnrXI/7N04HxySg5BnbkVRs="
     },
-    "ci-info": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-1.1.1.tgz",
-      "integrity": "sha512-vHDDF/bP9RYpTWtUhpJRhCFdvvp3iDWvEbuDbWgvjUrNGV1MXJrE0MPcwGtEled04m61iwdBLUIHZtDgzWS4ZQ=="
+    "babel-helper-remove-or-void": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-helper-remove-or-void/-/babel-helper-remove-or-void-0.2.0.tgz",
+      "integrity": "sha512-1Z41upf/XR+PwY7Nd+F15Jo5BiQi5205ZXUuKed3yoyQgDkMyoM7vAdjEJS/T+M6jy32sXjskMUgms4zeiVtRA=="
     },
-    "cipher-base": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/cipher-base/-/cipher-base-1.0.4.tgz",
-      "integrity": "sha512-Kkht5ye6ZGmwv40uUDZztayT2ThLQGfnj/T71N/XzeZeo3nf8foyW7zGTsPYkEya3m5f3cAypH+qe7YOrM1U2Q=="
+    "babel-helper-replace-supers": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helper-replace-supers/-/babel-helper-replace-supers-6.24.1.tgz",
+      "integrity": "sha1-v22/5Dk40XNpohPKiov3S2qQqxo="
     },
-    "clap": {
-      "version": "1.2.3",
-      "resolved": "https://registry.npmjs.org/clap/-/clap-1.2.3.tgz",
-      "integrity": "sha512-4CoL/A3hf90V3VIEjeuhSvlGFEHKzOz+Wfc2IVZc+FaUgU0ZQafJTP49fvnULipOPcAfqhyI2duwQyns6xqjYA==",
-      "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
-        },
-        "supports-color": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-        }
-      }
+    "babel-helper-to-multiple-sequence-expressions": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-helper-to-multiple-sequence-expressions/-/babel-helper-to-multiple-sequence-expressions-0.2.0.tgz",
+      "integrity": "sha512-ij9lpfdP3+Zc/7kNwa+NXbTrUlsYEWPwt/ugmQO0qflzLrveTIkbfOqQztvitk81aG5NblYDQXDlRohzu3oa8Q=="
     },
-    "class-utils": {
-      "version": "0.3.5",
-      "resolved": "https://registry.npmjs.org/class-utils/-/class-utils-0.3.5.tgz",
-      "integrity": "sha1-F+eTEDdQ+WJ7IXbqNM/RtWWQPIA=",
-      "dependencies": {
-        "define-property": {
-          "version": "0.2.5",
-          "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
-          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY="
-        },
-        "is-descriptor": {
-          "version": "0.1.6",
-          "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
-          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
-        }
-      }
+    "babel-helpers": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-helpers/-/babel-helpers-6.24.1.tgz",
+      "integrity": "sha1-NHHenK7DiOXIUOWX5Yom3fN2ArI="
     },
-    "classnames": {
-      "version": "2.2.5",
-      "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.2.5.tgz",
-      "integrity": "sha1-+zgB1FNGdknvNgPH1hoCvRKb3m0="
+    "babel-jest": {
+      "version": "21.2.0",
+      "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-21.2.0.tgz",
+      "integrity": "sha512-O0W2qLoWu1QOoOGgxiR2JID4O6WSpxPiQanrkyi9SSlM0PJ60Ptzlck47lhtnr9YZO3zYOsxHwnyeWJ6AffoBQ=="
     },
-    "cli-table": {
-      "version": "0.3.1",
-      "resolved": "https://registry.npmjs.org/cli-table/-/cli-table-0.3.1.tgz",
-      "integrity": "sha1-9TsFJmqLGguTSz0IIebi3FkUriM=",
-      "dependencies": {
-        "colors": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/colors/-/colors-1.0.3.tgz",
-          "integrity": "sha1-BDP0TYCWgP3rYO0mDxsMJi6CpAs="
-        }
-      }
+    "babel-loader": {
+      "version": "7.1.2",
+      "resolved": "https://registry.npmjs.org/babel-loader/-/babel-loader-7.1.2.tgz",
+      "integrity": "sha512-jRwlFbINAeyDStqK6Dd5YuY0k5YuzQUvlz2ZamuXrXmxav3pNqe9vfJ402+2G+OmlJSXxCOpB6Uz0INM7RQe2A=="
     },
-    "cli-usage": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/cli-usage/-/cli-usage-0.1.4.tgz",
-      "integrity": "sha1-fAHg3HBsI0s5yTODjI4gshdXduI="
+    "babel-messages": {
+      "version": "6.23.0",
+      "resolved": "https://registry.npmjs.org/babel-messages/-/babel-messages-6.23.0.tgz",
+      "integrity": "sha1-8830cDhYA1sqKVHG7F7fbGLyYw4="
     },
-    "cliui": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
-      "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE=",
-      "dependencies": {
-        "wordwrap": {
-          "version": "0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
-          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
-        }
-      }
+    "babel-plugin-check-es2015-constants": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-check-es2015-constants/-/babel-plugin-check-es2015-constants-6.22.0.tgz",
+      "integrity": "sha1-NRV7EBQm/S/9PaP3XH0ekYNbv4o="
     },
-    "clone": {
+    "babel-plugin-dynamic-import-node": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.2.tgz",
-      "integrity": "sha1-Jgt6meux7f4kdTgXX3gyQ8sZ0Uk="
+      "resolved": "https://registry.npmjs.org/babel-plugin-dynamic-import-node/-/babel-plugin-dynamic-import-node-1.0.2.tgz",
+      "integrity": "sha1-rbW8j0iokxFUA5WunwzD7UsQuy4="
     },
-    "clone-deep": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-0.3.0.tgz",
-      "integrity": "sha1-NIxhrpzb4O3+BT2R/0zFIdeQ7eg=",
-      "dependencies": {
-        "for-own": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/for-own/-/for-own-1.0.0.tgz",
-          "integrity": "sha1-xjMy9BXO3EsE2/5wz4NklMU8tEs="
-        },
-        "kind-of": {
-          "version": "3.2.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
-        }
-      }
+    "babel-plugin-istanbul": {
+      "version": "4.1.5",
+      "resolved": "https://registry.npmjs.org/babel-plugin-istanbul/-/babel-plugin-istanbul-4.1.5.tgz",
+      "integrity": "sha1-Z2DN2Xf0EdPhdbsGTyvDJ9mbK24="
     },
-    "co": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
-      "integrity": "sha1-bqa989hTrlTMuOR7+gvz+QMfsYQ="
+    "babel-plugin-jest-hoist": {
+      "version": "21.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-21.2.0.tgz",
+      "integrity": "sha512-yi5QuiVyyvhBUDLP4ButAnhYzkdrUwWDtvUJv71hjH3fclhnZg4HkDeqaitcR2dZZx/E67kGkRcPVjtVu+SJfQ=="
     },
-    "coa": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/coa/-/coa-1.0.4.tgz",
-      "integrity": "sha1-qe8VNmDWqGqL3sAomlxoTSF0Mv0="
+    "babel-plugin-minify-builtins": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-minify-builtins/-/babel-plugin-minify-builtins-0.2.0.tgz",
+      "integrity": "sha512-4i+8ntaS8gwVUcOz5y+zE+55OVOl2nTbmHV51D4wAIiKcRI8U5K//ip1GHfhsgk/NJrrHK7h97Oy5jpqt0Iixg=="
     },
-    "code-point-at": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz",
-      "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c="
+    "babel-plugin-minify-constant-folding": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-minify-constant-folding/-/babel-plugin-minify-constant-folding-0.2.0.tgz",
+      "integrity": "sha512-B3ffQBEUQ8ydlIkYv2MkZtTCbV7FAkWAV7NkyhcXlGpD10PaCxNGQ/B9oguXGowR1m16Q5nGhvNn8Pkn1MO6Hw=="
     },
-    "collection-visit": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/collection-visit/-/collection-visit-1.0.0.tgz",
-      "integrity": "sha1-S8A3PBZLwykbTTaMgpzxqApZ3KA="
+    "babel-plugin-minify-dead-code-elimination": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-minify-dead-code-elimination/-/babel-plugin-minify-dead-code-elimination-0.2.0.tgz",
+      "integrity": "sha512-zE7y3pRyzA4zK5nBou0kTcwUTSQ/AiFrynt1cIEYN7vcO2gS9ZFZoI0aO9JYLUdct5fsC1vfB35408yrzTyVfg=="
     },
-    "color": {
-      "version": "0.11.4",
-      "resolved": "https://registry.npmjs.org/color/-/color-0.11.4.tgz",
-      "integrity": "sha1-bXtcdPtl6EHNSHkq0e1eB7kE12Q="
+    "babel-plugin-minify-flip-comparisons": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-minify-flip-comparisons/-/babel-plugin-minify-flip-comparisons-0.2.0.tgz",
+      "integrity": "sha512-QOqXSEmD/LhT3LpM1WCyzAGcQZYYKJF7oOHvS6QbpomHenydrV53DMdPX2mK01icBExKZcJAHF209wvDBa+CSg=="
     },
-    "color-convert": {
-      "version": "1.9.0",
-      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.0.tgz",
-      "integrity": "sha1-Gsz5fdc5uYO/mU1W/sj5WFNkG3o="
+    "babel-plugin-minify-guarded-expressions": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-minify-guarded-expressions/-/babel-plugin-minify-guarded-expressions-0.2.0.tgz",
+      "integrity": "sha512-5+NSPdRQ9mnrHaA+zFj+D5OzmSiv90EX5zGH6cWQgR/OUqmCHSDqgTRPFvOctgpo8MJyO7Rt7ajs2UfLnlAwYg=="
     },
-    "color-functions": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/color-functions/-/color-functions-1.1.0.tgz",
-      "integrity": "sha1-TLgFR5Blo2WMMmn0j6xz7/APld4="
+    "babel-plugin-minify-infinity": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-minify-infinity/-/babel-plugin-minify-infinity-0.2.0.tgz",
+      "integrity": "sha512-U694vrla1lN6vDHWGrR832t3a/A2eh+kyl019LxEE2+sS4VTydyOPRsAOIYAdJegWRA4cMX1lm9azAN0cLIr8g=="
     },
-    "color-name": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
-      "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU="
+    "babel-plugin-minify-mangle-names": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-minify-mangle-names/-/babel-plugin-minify-mangle-names-0.2.0.tgz",
+      "integrity": "sha512-Gixuak1/CO7VCdjn15/8Bxe/QsAtDG4zPbnsNoe1mIJGCIH/kcmSjFhMlGJtXDQZd6EKzeMfA5WmX9+jvGRefw=="
     },
-    "color-string": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/color-string/-/color-string-0.3.0.tgz",
-      "integrity": "sha1-J9RvtnAlxcL6JZk7+/V55HhBuZE="
+    "babel-plugin-minify-numeric-literals": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-minify-numeric-literals/-/babel-plugin-minify-numeric-literals-0.2.0.tgz",
+      "integrity": "sha512-VcLpb+r1YS7+RIOXdRsFVLLqoh22177USpHf+JM/g1nZbzdqENmfd5v534MLAbRErhbz6SyK+NQViVzVtBxu8g=="
     },
-    "colormin": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/colormin/-/colormin-1.1.2.tgz",
-      "integrity": "sha1-6i90IKcrlogaOKrlnsEkpvcpgTM="
+    "babel-plugin-minify-replace": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-minify-replace/-/babel-plugin-minify-replace-0.2.0.tgz",
+      "integrity": "sha512-SEW6zoSVxh3OH6E1LCgyhhTWMnCv+JIRu5h5IlJDA11tU4ZeSF7uPQcO4vN/o52+FssRB26dmzJ/8D+z0QPg5Q=="
     },
-    "colors": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/colors/-/colors-1.1.2.tgz",
-      "integrity": "sha1-FopHAXVran9RoSzgyXv6KMCE7WM="
+    "babel-plugin-minify-simplify": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-minify-simplify/-/babel-plugin-minify-simplify-0.2.0.tgz",
+      "integrity": "sha512-Mj3Mwy2zVosMfXDWXZrQH5/uMAyfJdmDQ1NVqit+ArbHC3LlXVzptuyC1JxTyai/wgFvjLaichm/7vSUshkWqw=="
+    },
+    "babel-plugin-minify-type-constructors": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-minify-type-constructors/-/babel-plugin-minify-type-constructors-0.2.0.tgz",
+      "integrity": "sha512-NiOvvA9Pq6bki6nP4BayXwT5GZadw7DJFDDzHmkpnOQpENWe8RtHtKZM44MG1R6EQ5XxgbLdsdhswIzTkFlO5g=="
     },
-    "combine-lists": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/combine-lists/-/combine-lists-1.0.1.tgz",
-      "integrity": "sha1-RYwH4J4NkA/Ci3Cj/sLazR0st/Y="
+    "babel-plugin-react-docgen": {
+      "version": "1.8.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-react-docgen/-/babel-plugin-react-docgen-1.8.1.tgz",
+      "integrity": "sha512-11Yxwk8/iEULr+n5DG0BxXD6j/9htpiiR0/hLfi/gtEAK/d6NCNkyKFrC8loQcyMvF3hehPo30SKXG/itSX+hw=="
     },
-    "combined-stream": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz",
-      "integrity": "sha1-k4NwpXtKUd6ix3wV1cX9+JUWQAk="
+    "babel-plugin-syntax-async-functions": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-async-functions/-/babel-plugin-syntax-async-functions-6.13.0.tgz",
+      "integrity": "sha1-ytnK0RkbWtY0vzCuCHI5HgZHvpU="
     },
-    "command-line-args": {
-      "version": "4.0.7",
-      "resolved": "https://registry.npmjs.org/command-line-args/-/command-line-args-4.0.7.tgz",
-      "integrity": "sha512-aUdPvQRAyBvQd2n7jXcsMDz68ckBJELXNzBybCHOibUWEg0mWTnaYCSRU8h9R+aNRSvDihJtssSRCiDRpLaezA=="
+    "babel-plugin-syntax-async-generators": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-async-generators/-/babel-plugin-syntax-async-generators-6.13.0.tgz",
+      "integrity": "sha1-a8lj67FuzLrmuStZbrfzXDQqi5o="
     },
-    "commander": {
-      "version": "2.11.0",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-2.11.0.tgz",
-      "integrity": "sha512-b0553uYA5YAEGgyYIGYROzKQ7X5RAqedkfjiZxwi0kL1g3bOaBNNZfYkzt/CL0umgD5wc9Jec2FbB98CjkMRvQ=="
+    "babel-plugin-syntax-class-constructor-call": {
+      "version": "6.18.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-class-constructor-call/-/babel-plugin-syntax-class-constructor-call-6.18.0.tgz",
+      "integrity": "sha1-nLnTn+Q8hgC+yBRkVt3L1OGnZBY="
     },
-    "common-tags": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/common-tags/-/common-tags-1.4.0.tgz",
-      "integrity": "sha1-EYe+Tz1M8MBCfUP3Tu8fc1AWFMA="
+    "babel-plugin-syntax-class-properties": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-class-properties/-/babel-plugin-syntax-class-properties-6.13.0.tgz",
+      "integrity": "sha1-1+sjt5oxf4VDlixQW4J8fWysJ94="
     },
-    "commondir": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/commondir/-/commondir-1.0.1.tgz",
-      "integrity": "sha1-3dgA2gxmEnOTzKWVDqloo6rxJTs="
+    "babel-plugin-syntax-decorators": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-decorators/-/babel-plugin-syntax-decorators-6.13.0.tgz",
+      "integrity": "sha1-MSVjtNvePMgGzuPkFszurd0RrAs="
     },
-    "component-bind": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/component-bind/-/component-bind-1.0.0.tgz",
-      "integrity": "sha1-AMYIq33Nk4l8AAllGx06jh5zu9E="
+    "babel-plugin-syntax-do-expressions": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-do-expressions/-/babel-plugin-syntax-do-expressions-6.13.0.tgz",
+      "integrity": "sha1-V0d1YTmqJtOQ0JQQsDdEugfkeW0="
     },
-    "component-emitter": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz",
-      "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY="
+    "babel-plugin-syntax-dynamic-import": {
+      "version": "6.18.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-dynamic-import/-/babel-plugin-syntax-dynamic-import-6.18.0.tgz",
+      "integrity": "sha1-jWomIpyDdFqZgqRBBRVyyqF5sdo="
     },
-    "component-inherit": {
-      "version": "0.0.3",
-      "resolved": "https://registry.npmjs.org/component-inherit/-/component-inherit-0.0.3.tgz",
-      "integrity": "sha1-ZF/ErfWLcrZJ1crmUTVhnbJv8UM="
+    "babel-plugin-syntax-exponentiation-operator": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-exponentiation-operator/-/babel-plugin-syntax-exponentiation-operator-6.13.0.tgz",
+      "integrity": "sha1-nufoM3KQ2pUoggGmpX9BcDF4MN4="
     },
-    "compressible": {
-      "version": "2.0.11",
-      "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.11.tgz",
-      "integrity": "sha1-FnGKdd4oPtjmBAQWJaIGRYZ5fYo="
+    "babel-plugin-syntax-export-extensions": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-export-extensions/-/babel-plugin-syntax-export-extensions-6.13.0.tgz",
+      "integrity": "sha1-cKFITw+QiaToStRLrDU8lbmxJyE="
     },
-    "compression": {
-      "version": "1.7.1",
-      "resolved": "https://registry.npmjs.org/compression/-/compression-1.7.1.tgz",
-      "integrity": "sha1-7/JgPvwuIs+G810uuTWJ+YdTc9s=",
-      "dependencies": {
-        "accepts": {
-          "version": "1.3.4",
-          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.4.tgz",
-          "integrity": "sha1-hiRnWMfdbSGmR0/whKR0DsBesh8="
-        }
-      }
+    "babel-plugin-syntax-flow": {
+      "version": "6.18.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-flow/-/babel-plugin-syntax-flow-6.18.0.tgz",
+      "integrity": "sha1-TDqyCiryaqIM0lmVw5jE63AxDI0="
     },
-    "concat-map": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
-      "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s="
+    "babel-plugin-syntax-function-bind": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-function-bind/-/babel-plugin-syntax-function-bind-6.13.0.tgz",
+      "integrity": "sha1-SMSV8Xe98xqYHnMvVa3AvdJgH0Y="
     },
-    "concat-stream": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.0.tgz",
-      "integrity": "sha1-CqxmL9Ur54lk1VMvaUeE5wEQrPc="
+    "babel-plugin-syntax-jsx": {
+      "version": "6.18.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz",
+      "integrity": "sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY="
     },
-    "configstore": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.1.tgz",
-      "integrity": "sha512-5oNkD/L++l0O6xGXxb1EWS7SivtjfGQlRyxJsYgE0Z495/L81e2h4/d3r969hoPXuFItzNOKMtsXgYG4c7dYvw=="
+    "babel-plugin-syntax-object-rest-spread": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz",
+      "integrity": "sha1-/WU28rzhODb/o6VFjEkDpZe7O/U="
     },
-    "connect": {
-      "version": "3.6.5",
-      "resolved": "https://registry.npmjs.org/connect/-/connect-3.6.5.tgz",
-      "integrity": "sha1-+43ee6B2OHfQ7J352sC0tA5yx9o="
+    "babel-plugin-syntax-trailing-function-commas": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-trailing-function-commas/-/babel-plugin-syntax-trailing-function-commas-6.22.0.tgz",
+      "integrity": "sha1-ugNgk3+NBuQBgKQ/4NVhb/9TLPM="
     },
-    "connect-history-api-fallback": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.3.0.tgz",
-      "integrity": "sha1-5R0X+PDvDbkKZP20feMFFVbp8Wk="
+    "babel-plugin-transform-async-generator-functions": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-async-generator-functions/-/babel-plugin-transform-async-generator-functions-6.24.1.tgz",
+      "integrity": "sha1-8FiQAUX9PpkHpt3yjaWfIVJYpds="
     },
-    "console-browserify": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.1.0.tgz",
-      "integrity": "sha1-8CQcRXMKn8YyOyBtvzjtx0HQuxA="
+    "babel-plugin-transform-async-to-generator": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-async-to-generator/-/babel-plugin-transform-async-to-generator-6.24.1.tgz",
+      "integrity": "sha1-ZTbjeK/2yx1VF6wOQOs+n8jQh2E="
     },
-    "console-control-strings": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz",
-      "integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4="
+    "babel-plugin-transform-class-constructor-call": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-class-constructor-call/-/babel-plugin-transform-class-constructor-call-6.24.1.tgz",
+      "integrity": "sha1-gNwoVQWsBn3LjWxl4vbxGrd2Xvk="
     },
-    "constants-browserify": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz",
-      "integrity": "sha1-wguW2MYXdIqvHBYCF2DNJ/y4y3U="
+    "babel-plugin-transform-class-properties": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-class-properties/-/babel-plugin-transform-class-properties-6.24.1.tgz",
+      "integrity": "sha1-anl2PqYdM9NvN7YRqp3vgagbRqw="
     },
-    "content-disposition": {
-      "version": "0.5.2",
-      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.2.tgz",
-      "integrity": "sha1-DPaLud318r55YcOoUXjLhdunjLQ="
+    "babel-plugin-transform-decorators": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-decorators/-/babel-plugin-transform-decorators-6.24.1.tgz",
+      "integrity": "sha1-eIAT2PjGtSIr33s0Q5Df13Vp4k0="
     },
-    "content-type": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.4.tgz",
-      "integrity": "sha512-hIP3EEPs8tB9AT1L+NUqtwOAps4mk2Zob89MWXMHjHWg9milF/j4osnnQLXBCBFBk/tvIG/tUc9mOUJiPBhPXA=="
+    "babel-plugin-transform-do-expressions": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-do-expressions/-/babel-plugin-transform-do-expressions-6.22.0.tgz",
+      "integrity": "sha1-KMyvkoEtlJws0SgfaQyP3EaK6bs="
     },
-    "content-type-parser": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/content-type-parser/-/content-type-parser-1.0.1.tgz",
-      "integrity": "sha1-w+VpiMU8ZRJ/tG1AMqOpACRv3JQ="
+    "babel-plugin-transform-es2015-arrow-functions": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-arrow-functions/-/babel-plugin-transform-es2015-arrow-functions-6.22.0.tgz",
+      "integrity": "sha1-RSaSy3EdX3ncf4XkQM5BufJE0iE="
     },
-    "convert-source-map": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.5.0.tgz",
-      "integrity": "sha1-ms1whRxtXf3ZPZKC5e35SgP/RrU="
+    "babel-plugin-transform-es2015-block-scoped-functions": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-block-scoped-functions/-/babel-plugin-transform-es2015-block-scoped-functions-6.22.0.tgz",
+      "integrity": "sha1-u8UbSflk1wy42OC5ToICRs46YUE="
     },
-    "cookie": {
-      "version": "0.3.1",
-      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.3.1.tgz",
-      "integrity": "sha1-5+Ch+e9DtMi6klxcWpboBtFoc7s="
+    "babel-plugin-transform-es2015-block-scoping": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-block-scoping/-/babel-plugin-transform-es2015-block-scoping-6.26.0.tgz",
+      "integrity": "sha1-1w9SmcEwjQXBL0Y4E7CgnnOxiV8="
     },
-    "cookie-signature": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
-      "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw="
+    "babel-plugin-transform-es2015-classes": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-classes/-/babel-plugin-transform-es2015-classes-6.24.1.tgz",
+      "integrity": "sha1-WkxYpQyclGHlZLSyo7+ryXolhNs="
     },
-    "copy-descriptor": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/copy-descriptor/-/copy-descriptor-0.1.1.tgz",
-      "integrity": "sha1-Z29us8OZl8LuGsOpJP1hJHSPV40="
+    "babel-plugin-transform-es2015-computed-properties": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-computed-properties/-/babel-plugin-transform-es2015-computed-properties-6.24.1.tgz",
+      "integrity": "sha1-b+Ko0WiV1WNPTNmZttNICjCBWbM="
     },
-    "core-js": {
-      "version": "2.5.1",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.5.1.tgz",
-      "integrity": "sha1-rmh03GaTd4m4B1T/VCjfZoGcpQs="
+    "babel-plugin-transform-es2015-destructuring": {
+      "version": "6.23.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-destructuring/-/babel-plugin-transform-es2015-destructuring-6.23.0.tgz",
+      "integrity": "sha1-mXux8auWf2gtKwh2/jWNYOdlxW0="
     },
-    "core-util-is": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
-      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac="
+    "babel-plugin-transform-es2015-duplicate-keys": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-duplicate-keys/-/babel-plugin-transform-es2015-duplicate-keys-6.24.1.tgz",
+      "integrity": "sha1-c+s9MQypaePvnskcU3QabxV2Qj4="
     },
-    "cosmiconfig": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-2.2.2.tgz",
-      "integrity": "sha512-GiNXLwAFPYHy25XmTPpafYvn3CLAkJ8FLsscq78MQd1Kh0OU6Yzhn4eV2MVF4G9WEQZoWEGltatdR+ntGPMl5A==",
-      "dependencies": {
-        "minimist": {
-          "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
-          "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
-        }
-      }
+    "babel-plugin-transform-es2015-for-of": {
+      "version": "6.23.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-for-of/-/babel-plugin-transform-es2015-for-of-6.23.0.tgz",
+      "integrity": "sha1-9HyVsrYT3x0+zC/bdXNiPHUkhpE="
     },
-    "cpx": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/cpx/-/cpx-1.5.0.tgz",
-      "integrity": "sha1-GFvgGFEdhycN7czCkxceN2VauI8="
+    "babel-plugin-transform-es2015-function-name": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-function-name/-/babel-plugin-transform-es2015-function-name-6.24.1.tgz",
+      "integrity": "sha1-g0yJhTvDaxrw86TF26qU/Y6sqos="
     },
-    "create-ecdh": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.0.tgz",
-      "integrity": "sha1-iIxyNZbN92EvZJgjPuvXo1MBc30="
+    "babel-plugin-transform-es2015-literals": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-literals/-/babel-plugin-transform-es2015-literals-6.22.0.tgz",
+      "integrity": "sha1-T1SgLWzWbPkVKAAZox0xklN3yi4="
     },
-    "create-hash": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/create-hash/-/create-hash-1.1.3.tgz",
-      "integrity": "sha1-YGBCrIuSYnUPSDyt2rD1gZFy2P0="
+    "babel-plugin-transform-es2015-modules-amd": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-modules-amd/-/babel-plugin-transform-es2015-modules-amd-6.24.1.tgz",
+      "integrity": "sha1-Oz5UAXI5hC1tGcMBHEvS8AoA0VQ="
     },
-    "create-hmac": {
-      "version": "1.1.6",
-      "resolved": "https://registry.npmjs.org/create-hmac/-/create-hmac-1.1.6.tgz",
-      "integrity": "sha1-rLniIaThe9sHbpBlfEK5PjcmzwY="
+    "babel-plugin-transform-es2015-modules-commonjs": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-modules-commonjs/-/babel-plugin-transform-es2015-modules-commonjs-6.26.0.tgz",
+      "integrity": "sha1-DYOUApt9xqvhqX7xgeAHWN0uXYo="
     },
-    "create-react-class": {
-      "version": "15.6.2",
-      "resolved": "https://registry.npmjs.org/create-react-class/-/create-react-class-15.6.2.tgz",
-      "integrity": "sha1-zx7RXxKq1/FO9fLf4F5sQvke8Co="
+    "babel-plugin-transform-es2015-modules-systemjs": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-modules-systemjs/-/babel-plugin-transform-es2015-modules-systemjs-6.24.1.tgz",
+      "integrity": "sha1-/4mhQrkRmpBhlfXxBuzzBdlAfSM="
     },
-    "cross-spawn": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-5.1.0.tgz",
-      "integrity": "sha1-6L0O/uWPz/b4+UUQoKVUu/ojVEk="
+    "babel-plugin-transform-es2015-modules-umd": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-modules-umd/-/babel-plugin-transform-es2015-modules-umd-6.24.1.tgz",
+      "integrity": "sha1-rJl+YoXNGO1hdq22B9YCNErThGg="
     },
-    "cryptiles": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-3.1.2.tgz",
-      "integrity": "sha1-qJ+7Ig9c4l7FboxKqKT9e1sNKf4=",
-      "dependencies": {
-        "boom": {
-          "version": "5.2.0",
-          "resolved": "https://registry.npmjs.org/boom/-/boom-5.2.0.tgz",
-          "integrity": "sha512-Z5BTk6ZRe4tXXQlkqftmsAUANpXmuwlsF5Oov8ThoMbQRzdGTA1ngYRW160GexgOgjsFOKJz0LYhoNi+2AMBUw=="
-        }
-      }
+    "babel-plugin-transform-es2015-object-super": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-object-super/-/babel-plugin-transform-es2015-object-super-6.24.1.tgz",
+      "integrity": "sha1-JM72muIcuDp/hgPa0CH1cusnj40="
     },
-    "crypto-browserify": {
-      "version": "3.11.1",
-      "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.1.tgz",
-      "integrity": "sha512-Na7ZlwCOqoaW5RwUK1WpXws2kv8mNhWdTlzob0UXulk6G9BDbyiJaGTYBIX61Ozn9l1EPPJpICZb4DaOpT9NlQ=="
+    "babel-plugin-transform-es2015-parameters": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-parameters/-/babel-plugin-transform-es2015-parameters-6.24.1.tgz",
+      "integrity": "sha1-V6w1GrScrxSpfNE7CfZv3wpiXys="
     },
-    "crypto-random-string": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-1.0.0.tgz",
-      "integrity": "sha1-ojD2T1aDEOFJgAmUB5DsmVRbyn4="
+    "babel-plugin-transform-es2015-shorthand-properties": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-shorthand-properties/-/babel-plugin-transform-es2015-shorthand-properties-6.24.1.tgz",
+      "integrity": "sha1-JPh11nIch2YbvZmkYi5R8U3jiqA="
     },
-    "css-color-names": {
-      "version": "0.0.4",
-      "resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz",
-      "integrity": "sha1-gIrcLnnPhHOAabZGyyDsJ762KeA="
+    "babel-plugin-transform-es2015-spread": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-spread/-/babel-plugin-transform-es2015-spread-6.22.0.tgz",
+      "integrity": "sha1-1taKmfia7cRTbIGlQujdnxdG+NE="
     },
-    "css-in-js-utils": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/css-in-js-utils/-/css-in-js-utils-2.0.0.tgz",
-      "integrity": "sha512-yuWmPMD9FLi50Xf3k8W8oO3WM1eVnxEGCldCLyfusQ+CgivFk0s23yst4ooW6tfxMuSa03S6uUEga9UhX6GRrA=="
+    "babel-plugin-transform-es2015-sticky-regex": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-sticky-regex/-/babel-plugin-transform-es2015-sticky-regex-6.24.1.tgz",
+      "integrity": "sha1-AMHNsaynERLN8M9hJsLta0V8zbw="
     },
-    "css-loader": {
-      "version": "0.28.7",
-      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.7.tgz",
-      "integrity": "sha512-GxMpax8a/VgcfRrVy0gXD6yLd5ePYbXX/5zGgTVYp4wXtJklS8Z2VaUArJgc//f6/Dzil7BaJObdSv8eKKCPgg==",
-      "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
-          "dependencies": {
-            "supports-color": {
-              "version": "2.0.0",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-            }
-          }
-        },
-        "has-flag": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
-          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
-        },
-        "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
-        }
-      }
+    "babel-plugin-transform-es2015-template-literals": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-template-literals/-/babel-plugin-transform-es2015-template-literals-6.22.0.tgz",
+      "integrity": "sha1-qEs0UPfp+PH2g51taH2oS7EjbY0="
     },
-    "css-modules-loader-core": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/css-modules-loader-core/-/css-modules-loader-core-1.1.0.tgz",
-      "integrity": "sha1-WQhmgpShvs0mGuCkziGwtVHyHRY=",
+    "babel-plugin-transform-es2015-typeof-symbol": {
+      "version": "6.23.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-typeof-symbol/-/babel-plugin-transform-es2015-typeof-symbol-6.23.0.tgz",
+      "integrity": "sha1-3sCfHN3/lLUqxz1QXITfWdzOs3I="
+    },
+    "babel-plugin-transform-es2015-unicode-regex": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-unicode-regex/-/babel-plugin-transform-es2015-unicode-regex-6.24.1.tgz",
+      "integrity": "sha1-04sS9C6nMj9yk4fxinxa4frrNek=",
       "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
-          "dependencies": {
-            "supports-color": {
-              "version": "2.0.0",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-            }
-          }
-        },
-        "has-flag": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
-          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
-        },
-        "postcss": {
-          "version": "6.0.1",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
-          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        "regexpu-core": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-2.0.0.tgz",
+          "integrity": "sha1-SdA4g3uNz4v6W5pCE5k45uoq4kA="
         }
       }
     },
-    "css-select": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz",
-      "integrity": "sha1-KzoRBTnFNV8c2NMUYj6HCxIeyFg="
+    "babel-plugin-transform-exponentiation-operator": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-exponentiation-operator/-/babel-plugin-transform-exponentiation-operator-6.24.1.tgz",
+      "integrity": "sha1-KrDJx/MJj6SJB3cruBP+QejeOg4="
     },
-    "css-selector-tokenizer": {
-      "version": "0.7.0",
-      "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.7.0.tgz",
-      "integrity": "sha1-5piEdK6MlTR3v15+/s/OzNnPTIY="
+    "babel-plugin-transform-export-extensions": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-export-extensions/-/babel-plugin-transform-export-extensions-6.22.0.tgz",
+      "integrity": "sha1-U3OLR+deghhYnuqUbLvTkQm75lM="
     },
-    "css-what": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/css-what/-/css-what-2.1.0.tgz",
-      "integrity": "sha1-lGfQMsOM+u+58teVASUwYvh/ob0="
+    "babel-plugin-transform-flow-strip-types": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-flow-strip-types/-/babel-plugin-transform-flow-strip-types-6.22.0.tgz",
+      "integrity": "sha1-hMtnKTXUNxT9wyvOhFaNh0Qc988="
     },
-    "cssesc": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-0.1.0.tgz",
-      "integrity": "sha1-yBSQPkViM3GgR3tAEJqq++6t27Q="
+    "babel-plugin-transform-function-bind": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-function-bind/-/babel-plugin-transform-function-bind-6.22.0.tgz",
+      "integrity": "sha1-xvuOlqwpajELjPjqQBRiQH3fapc="
     },
-    "cssmin": {
-      "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/cssmin/-/cssmin-0.3.2.tgz",
-      "integrity": "sha1-3c5MVHtRCuDVlKjx+/iq+OLFwA0="
+    "babel-plugin-transform-inline-consecutive-adds": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-inline-consecutive-adds/-/babel-plugin-transform-inline-consecutive-adds-0.2.0.tgz",
+      "integrity": "sha512-GlhOuLOQ28ua9prg0hT33HslCrEmz9xWXy9ZNZSACppCyRxxRW+haYtRgm7uYXCcd0q8ggCWD2pfWEJp5iiZfQ=="
     },
-    "cssnano": {
-      "version": "3.10.0",
-      "resolved": "https://registry.npmjs.org/cssnano/-/cssnano-3.10.0.tgz",
-      "integrity": "sha1-Tzj2zqK5sX+gFJDyPx3GjqZcHDg=",
-      "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
-        },
-        "autoprefixer": {
-          "version": "6.7.7",
-          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.7.7.tgz",
-          "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ="
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
-          "dependencies": {
-            "supports-color": {
-              "version": "2.0.0",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-            }
-          }
-        },
-        "has-flag": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
-          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
-        },
-        "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
-        }
-      }
+    "babel-plugin-transform-member-expression-literals": {
+      "version": "6.8.5",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-member-expression-literals/-/babel-plugin-transform-member-expression-literals-6.8.5.tgz",
+      "integrity": "sha512-Ux3ligf+ukzWaCbBYOstDuFBhRgMiJHlpJBKV4P47qtzVkd0lg1ddPj9fqIJqAM0n+CvxipyrZrnNnw3CdtQCg=="
     },
-    "csso": {
-      "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/csso/-/csso-2.3.2.tgz",
-      "integrity": "sha1-3dUsWHAz9J6Utx/FVWnyUuj/X4U="
+    "babel-plugin-transform-merge-sibling-variables": {
+      "version": "6.8.6",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-merge-sibling-variables/-/babel-plugin-transform-merge-sibling-variables-6.8.6.tgz",
+      "integrity": "sha512-o5Jioq553HtEAUN5uty7ELJMenXIxHI3PIs1yLqYWYQwP6mg6IPVAJ+U7i4zr9XGF/kb2RGsdehglGTV+vngqA=="
     },
-    "cssom": {
-      "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/cssom/-/cssom-0.3.2.tgz",
-      "integrity": "sha1-uANhcMefB6kP8vFuIihAJ6JDhIs="
+    "babel-plugin-transform-minify-booleans": {
+      "version": "6.8.3",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-minify-booleans/-/babel-plugin-transform-minify-booleans-6.8.3.tgz",
+      "integrity": "sha512-bPbUhkeN2Nc0KH0/A19GwQGj8w+CvdJzyu8t59VoEDgsNMQ9Bopzi5DrVkrSsVjbYUaZpzq/DYLrH+wD5K2Tig=="
     },
-    "cssstyle": {
-      "version": "0.2.37",
-      "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-0.2.37.tgz",
-      "integrity": "sha1-VBCXI0yyUTyDzu06zdwn/yeYfVQ="
+    "babel-plugin-transform-object-rest-spread": {
+      "version": "6.23.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-object-rest-spread/-/babel-plugin-transform-object-rest-spread-6.23.0.tgz",
+      "integrity": "sha1-h11ryb52HFiirj/u5dxIldjH+SE="
     },
-    "currently-unhandled": {
-      "version": "0.4.1",
-      "resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz",
-      "integrity": "sha1-mI3zP+qxke95mmE2nddsF635V+o="
+    "babel-plugin-transform-property-literals": {
+      "version": "6.8.5",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-property-literals/-/babel-plugin-transform-property-literals-6.8.5.tgz",
+      "integrity": "sha512-MmiQsQ5AcIaRZMJD0zY5C4H3xuHm06/nWgtOsz7AXV44VEIXIlPiJ39IFYJ4Qx67/fEm8zJAedzR8t+B7d10Bg=="
     },
-    "custom-event": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/custom-event/-/custom-event-1.0.1.tgz",
-      "integrity": "sha1-XQKkaFCt8bSjF5RqOSj8y1v9BCU="
+    "babel-plugin-transform-react-constant-elements": {
+      "version": "6.23.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-react-constant-elements/-/babel-plugin-transform-react-constant-elements-6.23.0.tgz",
+      "integrity": "sha1-LxGb9NLN1F65uqrldAU8YE9hR90="
     },
-    "cycle": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/cycle/-/cycle-1.0.3.tgz",
-      "integrity": "sha1-IegLK+hYD5i0aPN5QwZisEbDStI="
+    "babel-plugin-transform-react-display-name": {
+      "version": "6.25.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-react-display-name/-/babel-plugin-transform-react-display-name-6.25.0.tgz",
+      "integrity": "sha1-Z+K/Hx6ck6sI25Z5LgU5K/LMKNE="
     },
-    "d": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/d/-/d-1.0.0.tgz",
-      "integrity": "sha1-dUu1v+VUUdpppYuU1F9MWwRi1Y8="
+    "babel-plugin-transform-react-jsx": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-react-jsx/-/babel-plugin-transform-react-jsx-6.24.1.tgz",
+      "integrity": "sha1-hAoCjn30YN/DotKfDA2R9jduZqM="
     },
-    "dashdash": {
-      "version": "1.14.1",
-      "resolved": "https://registry.npmjs.org/dashdash/-/dashdash-1.14.1.tgz",
-      "integrity": "sha1-hTz6D3y+L+1d4gMmuN1YEDX24vA="
+    "babel-plugin-transform-react-jsx-self": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-react-jsx-self/-/babel-plugin-transform-react-jsx-self-6.22.0.tgz",
+      "integrity": "sha1-322AqdomEqEh5t3XVYvL7PBuY24="
     },
-    "date-now": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/date-now/-/date-now-0.1.4.tgz",
-      "integrity": "sha1-6vQ5/U1ISK105cx9vvIAZyueNFs="
+    "babel-plugin-transform-react-jsx-source": {
+      "version": "6.22.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-react-jsx-source/-/babel-plugin-transform-react-jsx-source-6.22.0.tgz",
+      "integrity": "sha1-ZqwSFT9c0tF7PBkmj0vwGX9E7NY="
     },
-    "dateformat": {
-      "version": "1.0.12",
-      "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
-      "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk="
+    "babel-plugin-transform-regenerator": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-regenerator/-/babel-plugin-transform-regenerator-6.26.0.tgz",
+      "integrity": "sha1-4HA2lvveJ/Cj78rPi03KL3s6jy8="
     },
-    "debug": {
-      "version": "2.6.9",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-      "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA=="
+    "babel-plugin-transform-regexp-constructors": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-regexp-constructors/-/babel-plugin-transform-regexp-constructors-0.2.0.tgz",
+      "integrity": "sha512-7IsQ6aQx6LAaOqy97/PthTf+5Nx9grZww3r6E62IdWe76Yr8KsuwVjxzqSPQvESJqTE3EMADQ9S0RtwWDGNG9Q=="
     },
-    "decamelize": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
-      "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA="
+    "babel-plugin-transform-remove-console": {
+      "version": "6.8.5",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-remove-console/-/babel-plugin-transform-remove-console-6.8.5.tgz",
+      "integrity": "sha512-uuCKvtweCyIvvC8fi92EcWRtO2Kt5KMNMRK6BhpDXdeb3sxvGM7453RSmgeu4DlKns3OlvY9Ep5Q9m5a7RQAgg=="
     },
-    "decompress-zip": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/decompress-zip/-/decompress-zip-0.3.0.tgz",
-      "integrity": "sha1-rjvLfjTGWHmt/nfhnDD4ZgK0vbA=",
+    "babel-plugin-transform-remove-debugger": {
+      "version": "6.8.5",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-remove-debugger/-/babel-plugin-transform-remove-debugger-6.8.5.tgz",
+      "integrity": "sha512-InDQDdHPOLJKM+G6oXrEesf+P29QFBmcTXID+TAvZziVz+38xe2VO/Bn3FcRcRtnOOycbgsJkUNp9jIK+ist6g=="
+    },
+    "babel-plugin-transform-remove-undefined": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-remove-undefined/-/babel-plugin-transform-remove-undefined-0.2.0.tgz",
+      "integrity": "sha512-O8v57tPMHkp89kA4ZfQEYds/pzgvz/QYerBJjIuL5/Jc7RnvMVRA5gJY9zFKP7WayW8WOSBV4vh8Y8FJRio+ow=="
+    },
+    "babel-plugin-transform-runtime": {
+      "version": "6.23.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-runtime/-/babel-plugin-transform-runtime-6.23.0.tgz",
+      "integrity": "sha1-iEkNRGUC6puOfvsP4J7E2ZR5se4="
+    },
+    "babel-plugin-transform-simplify-comparison-operators": {
+      "version": "6.8.5",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-simplify-comparison-operators/-/babel-plugin-transform-simplify-comparison-operators-6.8.5.tgz",
+      "integrity": "sha512-B3HlBZb+Uq86nRj5yNPO6pJ3noEdqHvzYkEYoUWtrsWTv48ZIRatYlumoOiif/v8llF13YjYjx9zhyznDx+N9g=="
+    },
+    "babel-plugin-transform-strict-mode": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-strict-mode/-/babel-plugin-transform-strict-mode-6.24.1.tgz",
+      "integrity": "sha1-1fr3qleKZbvlkc9e2uBKDGcCB1g="
+    },
+    "babel-plugin-transform-undefined-to-void": {
+      "version": "6.8.3",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-undefined-to-void/-/babel-plugin-transform-undefined-to-void-6.8.3.tgz",
+      "integrity": "sha512-goYwp8dMrzHD6x9GjZ2M85Mk2vxf1h85CnUgAjfftUnlJvzF4uj5MrbReHBTbjQ96C8CuRzvhYZ3tv8H3Sc1ZA=="
+    },
+    "babel-preset-env": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/babel-preset-env/-/babel-preset-env-1.6.0.tgz",
+      "integrity": "sha512-OVgtQRuOZKckrILgMA5rvctvFZPv72Gua9Rt006AiPoB0DJKGN07UmaQA+qRrYgK71MVct8fFhT0EyNWYorVew==",
       "dependencies": {
-        "isarray": {
-          "version": "0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
-          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
-        },
-        "readable-stream": {
-          "version": "1.1.14",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
-          "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk="
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
-          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
+        "semver": {
+          "version": "5.4.1",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
+          "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg=="
         }
       }
     },
-    "deep-eql": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-3.0.1.tgz",
-      "integrity": "sha512-+QeIQyN5ZuO+3Uk5DYh6/1eKO0m0YmJFGNmFHGACpf1ClL1nmlV/p4gNgbl2pJGxgXb4faqo6UE+M5ACEMyVcw=="
-    },
-    "deep-equal": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/deep-equal/-/deep-equal-1.0.1.tgz",
-      "integrity": "sha1-9dJgKStmDghO/0zbyfCK0yR0SLU="
-    },
-    "deep-is": {
-      "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz",
-      "integrity": "sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ="
+    "babel-preset-flow": {
+      "version": "6.23.0",
+      "resolved": "https://registry.npmjs.org/babel-preset-flow/-/babel-preset-flow-6.23.0.tgz",
+      "integrity": "sha1-5xIYiHCFrpoktb5Baa/7WZgWxJ0="
     },
-    "default-require-extensions": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/default-require-extensions/-/default-require-extensions-1.0.0.tgz",
-      "integrity": "sha1-836hXT4T/9m0N9M+GnW1+5eHTLg="
+    "babel-preset-jest": {
+      "version": "21.2.0",
+      "resolved": "https://registry.npmjs.org/babel-preset-jest/-/babel-preset-jest-21.2.0.tgz",
+      "integrity": "sha512-hm9cBnr2h3J7yXoTtAVV0zg+3vg0Q/gT2GYuzlreTU0EPkJRtlNgKJJ3tBKEn0+VjAi3JykV6xCJkuUYttEEfA=="
     },
-    "define-properties": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.1.2.tgz",
-      "integrity": "sha1-g6c/L+pWmJj7c3GTyPhzyvbUXJQ="
+    "babel-preset-minify": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/babel-preset-minify/-/babel-preset-minify-0.2.0.tgz",
+      "integrity": "sha512-mR8Q44RmMzm18bM2Lqd9uiPopzk5GDCtVuquNbLFmX6lOKnqWoenaNBxnWW0UhBFC75lEHTIgNGCbnsRI0pJVw=="
     },
-    "define-property": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/define-property/-/define-property-1.0.0.tgz",
-      "integrity": "sha1-dp66rz9KY6rTr56NMEybvnm/sOY="
+    "babel-preset-react": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-preset-react/-/babel-preset-react-6.24.1.tgz",
+      "integrity": "sha1-umnfrqRfw+xjm2pOzqbhdwLJE4A="
     },
-    "defined": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/defined/-/defined-1.0.0.tgz",
-      "integrity": "sha1-yY2bzvdWdBiOEQlpFRGZ45sfppM="
+    "babel-preset-react-app": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/babel-preset-react-app/-/babel-preset-react-app-3.0.3.tgz",
+      "integrity": "sha512-hK1hPq8xOFxmnNwpsOcQ2wSRAQwNBhDqsMV75gyKYQ7Z39KmTRpMN2Jx6Wp0Mberqd2QEWsUqd9ccP2jfd4z2Q==",
+      "dependencies": {
+        "babel-plugin-transform-regenerator": {
+          "version": "6.24.1",
+          "resolved": "https://registry.npmjs.org/babel-plugin-transform-regenerator/-/babel-plugin-transform-regenerator-6.24.1.tgz",
+          "integrity": "sha1-uNowWtQ8PJm0hI5P5AN7dw0jxBg="
+        },
+        "babel-preset-env": {
+          "version": "1.5.2",
+          "resolved": "https://registry.npmjs.org/babel-preset-env/-/babel-preset-env-1.5.2.tgz",
+          "integrity": "sha1-zUrpCm6Utwn5c3SzPl+LmDVWre8="
+        },
+        "regenerator-transform": {
+          "version": "0.9.11",
+          "resolved": "https://registry.npmjs.org/regenerator-transform/-/regenerator-transform-0.9.11.tgz",
+          "integrity": "sha1-On0GdSDLe3F2dp61/4aGkb7+EoM="
+        },
+        "semver": {
+          "version": "5.4.1",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
+          "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg=="
+        }
+      }
     },
-    "del": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/del/-/del-3.0.0.tgz",
-      "integrity": "sha1-U+z2mf/LyzljdpGrE7rxYIGXZuU="
+    "babel-preset-stage-0": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-preset-stage-0/-/babel-preset-stage-0-6.24.1.tgz",
+      "integrity": "sha1-VkLRUEL5E4TX5a+LyIsduVsDnmo="
     },
-    "delayed-stream": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
-      "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk="
+    "babel-preset-stage-1": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-preset-stage-1/-/babel-preset-stage-1-6.24.1.tgz",
+      "integrity": "sha1-dpLNfc1oSZB+auSgqFWJz7niv7A="
     },
-    "delegates": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz",
-      "integrity": "sha1-hMbhWbgZBP3KWaDvRM2HDTElD5o="
+    "babel-preset-stage-2": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-preset-stage-2/-/babel-preset-stage-2-6.24.1.tgz",
+      "integrity": "sha1-2eKWD7PXEYfw5k7sYrwHdnIZvcE="
     },
-    "depd": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.1.tgz",
-      "integrity": "sha1-V4O04cRZ8G+lyif5kfPQbnoxA1k="
+    "babel-preset-stage-3": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-preset-stage-3/-/babel-preset-stage-3-6.24.1.tgz",
+      "integrity": "sha1-g2raCp56f6N8sTj7kyb4eTSkg5U="
     },
-    "des.js": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/des.js/-/des.js-1.0.0.tgz",
-      "integrity": "sha1-wHTS4qpqipoH29YfmhXCzYPsjsw="
+    "babel-register": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-register/-/babel-register-6.26.0.tgz",
+      "integrity": "sha1-btAhFz4vy0htestFxgCahW9kcHE="
     },
-    "destroy": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.0.4.tgz",
-      "integrity": "sha1-l4hXRCxEdJ5CBmE+N5RiBYJqvYA="
+    "babel-runtime": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz",
+      "integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4="
     },
-    "detect-indent": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/detect-indent/-/detect-indent-4.0.0.tgz",
-      "integrity": "sha1-920GQ1LN9Docts5hnE7jqUdd4gg="
+    "babel-template": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-template/-/babel-template-6.26.0.tgz",
+      "integrity": "sha1-3gPi0WOWsGn0bdn/+FIfsaDjXgI="
     },
-    "detect-node": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.0.3.tgz",
-      "integrity": "sha1-ogM8CcyOFY03dI+951B4Mr1s4Sc="
+    "babel-traverse": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-traverse/-/babel-traverse-6.26.0.tgz",
+      "integrity": "sha1-RqnL1+3MYsjlwGTi0tjQ9ANXZu4="
     },
-    "di": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/di/-/di-0.0.1.tgz",
-      "integrity": "sha1-gGZJMmzqp8qjMG112YXqJ0i6kTw="
+    "babel-types": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-types/-/babel-types-6.26.0.tgz",
+      "integrity": "sha1-o7Bz+Uq0nrb6Vc1lInozQ4BjJJc="
     },
-    "diff": {
-      "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/diff/-/diff-3.3.1.tgz",
-      "integrity": "sha512-MKPHZDMB0o6yHyDryUOScqZibp914ksXwAMYMTHj6KO8UeKsRYNJD3oNCKjTqZon+V488P7N/HzXF8t7ZR95ww=="
+    "babylon": {
+      "version": "6.18.0",
+      "resolved": "https://registry.npmjs.org/babylon/-/babylon-6.18.0.tgz",
+      "integrity": "sha512-q/UEjfGJ2Cm3oKV71DJz9d25TPnq5rhBVL2Q4fA5wcC3jcrdn7+SssEybFIxwAvvP+YCsCYNKughoF33GxgycQ=="
     },
-    "diffie-hellman": {
-      "version": "5.0.2",
-      "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.2.tgz",
-      "integrity": "sha1-tYNXOScM/ias9jIJn97SoH8gnl4="
+    "backo2": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz",
+      "integrity": "sha1-MasayLEpNjRj41s+u2n038+6eUc="
     },
-    "dns-equal": {
+    "balanced-match": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/dns-equal/-/dns-equal-1.0.0.tgz",
-      "integrity": "sha1-s55/HabrCnW6nBcySzR1PEfgZU0="
+      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
+      "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c="
     },
-    "dns-packet": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.2.2.tgz",
-      "integrity": "sha512-kN+DjfGF7dJGUL7nWRktL9Z18t1rWP3aQlyZdY8XlpvU3Nc6GeFTQApftcjtWKxAZfiggZSGrCEoszNgvnpwDg=="
+    "base": {
+      "version": "0.11.2",
+      "resolved": "https://registry.npmjs.org/base/-/base-0.11.2.tgz",
+      "integrity": "sha512-5T6P4xPgpp0YDFvSWwEZ4NoE3aM4QBQXDzmVbraCkFj8zHM+mba8SyqB5DbZWyR7mYHo6Y7BdQo3MoA4m0TeQg=="
     },
-    "dns-txt": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/dns-txt/-/dns-txt-2.0.2.tgz",
-      "integrity": "sha1-uR2Ab10nGI5Ks+fRB9iBocxGQrY="
+    "base64-arraybuffer": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/base64-arraybuffer/-/base64-arraybuffer-0.1.5.tgz",
+      "integrity": "sha1-c5JncZI7Whl0etZmqlzUv5xunOg="
     },
-    "doctrine": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-2.0.0.tgz",
-      "integrity": "sha1-xz2NKQnSIpHhoAejlYBNqLZl/mM="
+    "base64-js": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.2.1.tgz",
+      "integrity": "sha512-dwVUVIXsBZXwTuwnXI9RK8sBmgq09NDHzyR9SAph9eqk76gKK2JSQmZARC2zRC81JC2QTtxD0ARU5qTS25gIGw=="
     },
-    "dom-helpers": {
-      "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-3.2.1.tgz",
-      "integrity": "sha1-MgPgf+0he9H0JLAZc1WC/Deyglo="
+    "base64id": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/base64id/-/base64id-1.0.0.tgz",
+      "integrity": "sha1-R2iMuZu2gE8OBtPnY7HDLlfY5rY="
     },
-    "dom-serialize": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/dom-serialize/-/dom-serialize-2.2.1.tgz",
-      "integrity": "sha1-ViromZ9Evl6jB29UGdzVnrQ6yVs="
+    "batch": {
+      "version": "0.6.1",
+      "resolved": "https://registry.npmjs.org/batch/-/batch-0.6.1.tgz",
+      "integrity": "sha1-3DQxT05nkxgJP8dgJyUl+UvyXBY="
     },
-    "dom-serializer": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.1.0.tgz",
-      "integrity": "sha1-BzxpdUbOB4DOI75KKOKT5AvDDII=",
-      "dependencies": {
-        "domelementtype": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.1.3.tgz",
-          "integrity": "sha1-vSh3PiZCiBrsUVRJJCmcXNgiGFs="
-        }
-      }
+    "bcrypt-pbkdf": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/bcrypt-pbkdf/-/bcrypt-pbkdf-1.0.1.tgz",
+      "integrity": "sha1-Y7xdy2EzG5K8Bf1SiVPDNGKgb40=",
+      "optional": true
     },
-    "dom-walk": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/dom-walk/-/dom-walk-0.1.1.tgz",
-      "integrity": "sha1-ZyIm3HTI95mtNTB9+TaroRrNYBg="
+    "better-assert": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/better-assert/-/better-assert-1.0.2.tgz",
+      "integrity": "sha1-QIZrnhueC1W0gYlDEeaPr/rrxSI="
     },
-    "domain-browser": {
-      "version": "1.1.7",
-      "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.1.7.tgz",
-      "integrity": "sha1-hnqksJP6oF8d4IwG9NeyH9+GmLw="
+    "big.js": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/big.js/-/big.js-3.2.0.tgz",
+      "integrity": "sha512-+hN/Zh2D08Mx65pZ/4g5bsmNiZUuChDiQfTUQ7qJr4/kuopCr88xZsAXv6mBoZEsUI4OuGHlX59qE94K2mMW8Q=="
     },
-    "domelementtype": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.3.0.tgz",
-      "integrity": "sha1-sXrtguirWeUt2cGbF1bg/BhyBMI="
+    "binary": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/binary/-/binary-0.3.0.tgz",
+      "integrity": "sha1-n2BVO8XOjDOG87VTz/R0Yq3sqnk="
     },
-    "domhandler": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.4.1.tgz",
-      "integrity": "sha1-iS5HAAqZvlW783dP/qBWHYh5wlk="
+    "binary-extensions": {
+      "version": "1.10.0",
+      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.10.0.tgz",
+      "integrity": "sha1-muuabF6IY4qtFx4Wf1kAq+JINdA="
     },
-    "domutils": {
-      "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.5.1.tgz",
-      "integrity": "sha1-3NhIiib1Y9YQeeSMn3t+Mjc2gs8="
+    "blob": {
+      "version": "0.0.4",
+      "resolved": "https://registry.npmjs.org/blob/-/blob-0.0.4.tgz",
+      "integrity": "sha1-vPEwUspURj8w+fx+lbmkdjCpSSE="
     },
-    "dot-prop": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-4.2.0.tgz",
-      "integrity": "sha512-tUMXrxlExSW6U2EXiiKGSBVdYgtV8qlHL+C10TsW4PURY/ic+eaysnSkwB4kA/mBlCyy/IKDJ+Lc3wbWeaXtuQ=="
+    "block-stream": {
+      "version": "0.0.9",
+      "resolved": "https://registry.npmjs.org/block-stream/-/block-stream-0.0.9.tgz",
+      "integrity": "sha1-E+v+d4oDIFz+A3UUgeu0szAMEmo="
     },
-    "duplexer": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz",
-      "integrity": "sha1-rOb/gIwc5mtX0ev5eXessCM0z8E="
+    "bluebird": {
+      "version": "3.5.1",
+      "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.5.1.tgz",
+      "integrity": "sha512-MKiLiV+I1AA596t9w1sQJ8jkiSr5+ZKi0WKrYGUn6d1Fx+Ij4tIj+m2WMQSGczs5jZVxV339chE8iwk6F64wjA=="
     },
-    "ecc-jsbn": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.1.tgz",
-      "integrity": "sha1-D8c6ntXw1Tw4GTOYUj735UN3dQU=",
-      "optional": true
+    "bn.js": {
+      "version": "4.11.8",
+      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.11.8.tgz",
+      "integrity": "sha512-ItfYfPLkWHUjckQCk8xC+LwxgK8NYcXywGigJgSwOP8Y2iyWT4f2vsZnoOXTTbo+o5yXmIUJ4gn5538SO5S3gA=="
     },
-    "ee-first": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
-      "integrity": "sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0="
+    "body-parser": {
+      "version": "1.18.2",
+      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.18.2.tgz",
+      "integrity": "sha1-h2eKGdhLR9hZuDGZvVm84iKxBFQ=",
+      "dependencies": {
+        "iconv-lite": {
+          "version": "0.4.19",
+          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.19.tgz",
+          "integrity": "sha512-oTZqweIP51xaGPI4uPa56/Pri/480R+mo7SeU+YETByQNhDG55ycFyNLIgta9vXhILrxXDmF7ZGhqZIcuN0gJQ=="
+        }
+      }
     },
-    "ejs": {
-      "version": "2.5.7",
-      "resolved": "https://registry.npmjs.org/ejs/-/ejs-2.5.7.tgz",
-      "integrity": "sha1-zIcsFoiArjxxiXYv1f/ACJbJUYo="
+    "bonjour": {
+      "version": "3.5.0",
+      "resolved": "https://registry.npmjs.org/bonjour/-/bonjour-3.5.0.tgz",
+      "integrity": "sha1-jokKGD2O6aI5OzhExpGkK897yfU=",
+      "dependencies": {
+        "array-flatten": {
+          "version": "2.1.1",
+          "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-2.1.1.tgz",
+          "integrity": "sha1-Qmu52oQJDBg42BLIFQryCoMx4pY="
+        }
+      }
     },
-    "electron-to-chromium": {
-      "version": "1.3.24",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.24.tgz",
-      "integrity": "sha1-m3uIuwXOufoBahd4M8wt3jiPIbY="
+    "boolbase": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
+      "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24="
     },
-    "elliptic": {
-      "version": "6.4.0",
-      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.4.0.tgz",
-      "integrity": "sha1-ysmvh2LIWDYYcAPI3+GT5eLq5d8="
+    "boom": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/boom/-/boom-4.3.1.tgz",
+      "integrity": "sha1-T4owBctKfjiJ90kDD9JbluAdLjE="
     },
-    "emojis-list": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-2.1.0.tgz",
-      "integrity": "sha1-TapNnbAPmBmIDHn6RXrlsJof04k="
+    "bowser": {
+      "version": "1.7.3",
+      "resolved": "https://registry.npmjs.org/bowser/-/bowser-1.7.3.tgz",
+      "integrity": "sha1-UEvbQxGMqNucu63yj9YPJlr5bk8="
     },
-    "encodeurl": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.1.tgz",
-      "integrity": "sha1-eePVhlU0aQn+bw9Fpd5oEDspTSA="
+    "brace-expansion": {
+      "version": "1.1.8",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.8.tgz",
+      "integrity": "sha1-wHshHHyVLsH479Uad+8NHTmQopI="
     },
-    "encoding": {
-      "version": "0.1.12",
-      "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.12.tgz",
-      "integrity": "sha1-U4tm8+5izRq1HsMjgp0flIDHS+s="
+    "braces": {
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/braces/-/braces-2.2.2.tgz",
+      "integrity": "sha1-JB+GjCsmkNn+vu5afIP7vyXQCxs="
+    },
+    "brcast": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/brcast/-/brcast-3.0.1.tgz",
+      "integrity": "sha512-eI3yqf9YEqyGl9PCNTR46MGvDylGtaHjalcz6Q3fAPnP/PhpKkkve52vFdfGpwp4VUvK6LUr4TQN+2stCrEwTg=="
     },
-    "engine.io": {
-      "version": "1.8.3",
-      "resolved": "https://registry.npmjs.org/engine.io/-/engine.io-1.8.3.tgz",
-      "integrity": "sha1-jef5eJXSDTm4X4ju7nd7K9QrE9Q=",
-      "dependencies": {
-        "debug": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
-          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
-        },
-        "ms": {
-          "version": "0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
-          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
-        }
-      }
+    "brorand": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/brorand/-/brorand-1.1.0.tgz",
+      "integrity": "sha1-EsJe/kCkXjwyPrhnWgoM5XsiNx8="
     },
-    "engine.io-client": {
-      "version": "1.8.3",
-      "resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-1.8.3.tgz",
-      "integrity": "sha1-F5jtk0USRkU9TG9jXXogH+lA1as=",
+    "browser-resolve": {
+      "version": "1.11.2",
+      "resolved": "https://registry.npmjs.org/browser-resolve/-/browser-resolve-1.11.2.tgz",
+      "integrity": "sha1-j/CbCixCFxihBRwmCzLkj0QpOM4=",
       "dependencies": {
-        "debug": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
-          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
-        },
-        "ms": {
-          "version": "0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
-          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
+        "resolve": {
+          "version": "1.1.7",
+          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz",
+          "integrity": "sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs="
         }
       }
     },
-    "engine.io-parser": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-1.3.2.tgz",
-      "integrity": "sha1-k3sHnwAH0Ik+xW1GyyILjLQ1Igo="
+    "browser-stdout": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/browser-stdout/-/browser-stdout-1.3.0.tgz",
+      "integrity": "sha1-81HTKWnTL6XXpVZxVCY9korjvR8="
     },
-    "enhanced-resolve": {
-      "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.3.0.tgz",
-      "integrity": "sha512-2qbxE7ek3YxPJ1ML6V+satHkzHpJQKWkRHmRx6mfAoW59yP8YH8BFplbegSP+u2hBd6B6KCOpvJQ3dZAP+hkpg=="
+    "browserify-aes": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.8.tgz",
+      "integrity": "sha512-WYCMOT/PtGTlpOKFht0YJFYcPy6pLCR98CtWfzK13zoynLlBMvAdEMSRGmgnJCw2M2j/5qxBkinZQFobieM8dQ=="
     },
-    "ent": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/ent/-/ent-2.2.0.tgz",
-      "integrity": "sha1-6WQhkyWiHQX0RGai9obtbOX13R0="
+    "browserify-cipher": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/browserify-cipher/-/browserify-cipher-1.0.0.tgz",
+      "integrity": "sha1-mYgkSHS/XtTijalWZtzWasj8Njo="
     },
-    "entities": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.1.tgz",
-      "integrity": "sha1-blwtClYhtdra7O+AuQ7ftc13cvA="
+    "browserify-des": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/browserify-des/-/browserify-des-1.0.0.tgz",
+      "integrity": "sha1-2qJ3cXRwki7S/hhZQRihdUOXId0="
     },
-    "enzyme": {
-      "version": "2.9.1",
-      "resolved": "https://registry.npmjs.org/enzyme/-/enzyme-2.9.1.tgz",
-      "integrity": "sha1-B9XOaRJBJA+4F78sSxjW5TAkDfY="
+    "browserify-rsa": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz",
+      "integrity": "sha1-IeCr+vbyApzy+vsTNWenAdQTVSQ="
     },
-    "errno": {
+    "browserify-sign": {
+      "version": "4.0.4",
+      "resolved": "https://registry.npmjs.org/browserify-sign/-/browserify-sign-4.0.4.tgz",
+      "integrity": "sha1-qk62jl17ZYuqa/alfmMMvXqT0pg="
+    },
+    "browserify-zlib": {
       "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.4.tgz",
-      "integrity": "sha1-uJbiOp5ei6M4cfyZar02NfyaHH0="
+      "resolved": "https://registry.npmjs.org/browserify-zlib/-/browserify-zlib-0.1.4.tgz",
+      "integrity": "sha1-uzX4pRn2AOD6a4SFJByXnQFB+y0="
     },
-    "error-ex": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.1.tgz",
-      "integrity": "sha1-+FWobOYa3E6GIcPNoh56dhLDqNw="
+    "browserslist": {
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.4.0.tgz",
+      "integrity": "sha512-aM2Gt4x9bVlCUteADBS6JP0F+2tMWKM1jQzUulVROtdFWFIcIVvY76AJbr7GDqy0eDhn+PcnpzzivGxY4qiaKQ=="
     },
-    "es-abstract": {
-      "version": "1.9.0",
-      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.9.0.tgz",
-      "integrity": "sha512-kk3IJoKo7A3pWJc0OV8yZ/VEX2oSUytfekrJiqoxBlKJMFAJVJVpGdHClCCTdv+Fn2zHfpDHHIelMFhZVfef3Q=="
+    "bser": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/bser/-/bser-2.0.0.tgz",
+      "integrity": "sha1-mseNPtXZFYBP2HrLFYvHlxR6Fxk="
     },
-    "es-to-primitive": {
+    "buffer": {
+      "version": "4.9.1",
+      "resolved": "https://registry.npmjs.org/buffer/-/buffer-4.9.1.tgz",
+      "integrity": "sha1-bRu2AbB6TvztlwlBMgkwJ8lbwpg="
+    },
+    "buffer-indexof": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.1.1.tgz",
-      "integrity": "sha1-RTVSSKiJeQNLZ5Lhm7gfK3l13Q0="
+      "resolved": "https://registry.npmjs.org/buffer-indexof/-/buffer-indexof-1.1.1.tgz",
+      "integrity": "sha512-4/rOEg86jivtPTeOUUT61jJO1Ya1TrR/OkqCSZDyq84WJh3LuuiphBYJN+fm5xufIk4XAFcEwte/8WzC8If/1g=="
     },
-    "es5-ext": {
-      "version": "0.10.30",
-      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.30.tgz",
-      "integrity": "sha1-cUGhaDZpfbq/qq7uQUlc4p9SyTk="
+    "buffer-xor": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/buffer-xor/-/buffer-xor-1.0.3.tgz",
+      "integrity": "sha1-JuYe0UIvtw3ULm42cp7VHYVf6Nk="
     },
-    "es5-shim": {
-      "version": "4.5.9",
-      "resolved": "https://registry.npmjs.org/es5-shim/-/es5-shim-4.5.9.tgz",
-      "integrity": "sha1-Kh4rnlg/9f7Qwgo+4svz91IwpcA="
+    "buffers": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/buffers/-/buffers-0.1.1.tgz",
+      "integrity": "sha1-skV5w77U1tOWru5tmorn9Ugqt7s="
     },
-    "es6-iterator": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.1.tgz",
-      "integrity": "sha1-jjGcnwRTv1ddN0lAplWSDlnKVRI="
+    "build": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/build/-/build-0.1.4.tgz",
+      "integrity": "sha1-cH/gJv/O3crL/c3zVur9pk8VEEY=",
+      "dependencies": {
+        "uglify-js": {
+          "version": "1.3.5",
+          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-1.3.5.tgz",
+          "integrity": "sha1-S1v/+Rhu/7qoiOTJ6UvZ/EyUkp0="
+        }
+      }
     },
-    "es6-map": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/es6-map/-/es6-map-0.1.5.tgz",
-      "integrity": "sha1-kTbgUD3MBqMBaQ8LsU/042TpSfA="
+    "builtin-modules": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz",
+      "integrity": "sha1-Jw8HbFpywC9bZaR9+Uxf46J4iS8="
     },
-    "es6-promise": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.1.tgz",
-      "integrity": "sha512-OaU1hHjgJf+b0NzsxCg7NdIYERD6Hy/PEmFLTjw+b65scuisG3Kt4QoTvJ66BBkPZ581gr0kpoVzKnxniM8nng=="
+    "builtin-status-codes": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz",
+      "integrity": "sha1-hZgoeOIbmOHGZCXgPQF0eI9Wnug="
     },
-    "es6-set": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/es6-set/-/es6-set-0.1.5.tgz",
-      "integrity": "sha1-0rPsXU2ADO2BjbU40ol02wpzzLE="
+    "bytes": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.0.0.tgz",
+      "integrity": "sha1-0ygVQE1olpn4Wk6k+odV3ROpYEg="
     },
-    "es6-shim": {
-      "version": "0.35.3",
-      "resolved": "https://registry.npmjs.org/es6-shim/-/es6-shim-0.35.3.tgz",
-      "integrity": "sha1-m/tzY/7//4emzbbNk+QF7DxLbyY="
+    "cache-base": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/cache-base/-/cache-base-1.0.1.tgz",
+      "integrity": "sha512-AKcdTnFSWATd5/GCPRxr2ChwIJ85CeyrEyjRHlKxQ56d4XJMGym0uAiKn0xbLOGOl3+yRpOTi484dVCEc5AUzQ=="
     },
-    "es6-symbol": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.1.tgz",
-      "integrity": "sha1-vwDvT9q2uhtG7Le2KbTH7VcVzHc="
+    "callsite": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/callsite/-/callsite-1.0.0.tgz",
+      "integrity": "sha1-KAOY5dZkvXQDi28JBRU+borxvCA="
     },
-    "es6-weak-map": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/es6-weak-map/-/es6-weak-map-2.0.2.tgz",
-      "integrity": "sha1-XjqzIlH/0VOKH45f+hNXdy+S2W8="
+    "callsites": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/callsites/-/callsites-2.0.0.tgz",
+      "integrity": "sha1-BuuE8A7qQT2oav/vrL/7Ngk7PFA="
     },
-    "escape-html": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
-      "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg="
+    "camelcase": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
+      "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
     },
-    "escape-string-regexp": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
-      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ="
+    "camelcase-keys": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/camelcase-keys/-/camelcase-keys-2.1.0.tgz",
+      "integrity": "sha1-MIvur/3ygRkFHvodkyITyRuPkuc=",
+      "dependencies": {
+        "camelcase": {
+          "version": "2.1.1",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-2.1.1.tgz",
+          "integrity": "sha1-fB0W1nmhu+WcoCys7PsBHiAfWh8="
+        }
+      }
     },
-    "escodegen": {
-      "version": "1.9.0",
-      "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-1.9.0.tgz",
-      "integrity": "sha512-v0MYvNQ32bzwoG2OSFzWAkuahDQHK92JBN0pTAALJ4RIxEZe766QJPDR8Hqy7XNUy5K3fnVL76OqYAdc4TZEIw==",
+    "caniuse-api": {
+      "version": "1.6.1",
+      "resolved": "https://registry.npmjs.org/caniuse-api/-/caniuse-api-1.6.1.tgz",
+      "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw=",
       "dependencies": {
-        "esprima": {
-          "version": "3.1.3",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz",
-          "integrity": "sha1-/cpRzuYTOJXjyI1TXOSdv/YqRjM="
+        "browserslist": {
+          "version": "1.7.7",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
+          "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk="
+        }
+      }
+    },
+    "caniuse-db": {
+      "version": "1.0.30000743",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000743.tgz",
+      "integrity": "sha1-vI3yolfPkboCQyImYpWvPe2FIwY="
+    },
+    "caniuse-lite": {
+      "version": "1.0.30000743",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000743.tgz",
+      "integrity": "sha1-9PXGdQZ2/49hROpARWw3KdU0F2k="
+    },
+    "cardinal": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/cardinal/-/cardinal-1.0.0.tgz",
+      "integrity": "sha1-UOIcGwqjdyn5N33vGWtanOyTLuk="
+    },
+    "case-sensitive-paths-webpack-plugin": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/case-sensitive-paths-webpack-plugin/-/case-sensitive-paths-webpack-plugin-2.1.1.tgz",
+      "integrity": "sha1-PSnO2MHxJL9vU4Rvs/WJRzH9yQk="
+    },
+    "caseless": {
+      "version": "0.12.0",
+      "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz",
+      "integrity": "sha1-G2gcIf+EAzyCZUMJBolCDRhxUdw="
+    },
+    "center-align": {
+      "version": "0.1.3",
+      "resolved": "https://registry.npmjs.org/center-align/-/center-align-0.1.3.tgz",
+      "integrity": "sha1-qg0yYptu6XIgBBHL1EYckHvCt60=",
+      "dependencies": {
+        "lazy-cache": {
+          "version": "1.0.4",
+          "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-1.0.4.tgz",
+          "integrity": "sha1-odePw6UEdMuAhF07O24dpJpEbo4="
         }
       }
     },
-    "escope": {
-      "version": "3.6.0",
-      "resolved": "https://registry.npmjs.org/escope/-/escope-3.6.0.tgz",
-      "integrity": "sha1-4Bl16BJ4GhY6ba392AOY3GTIicM="
-    },
-    "esprima": {
-      "version": "2.7.3",
-      "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz",
-      "integrity": "sha1-luO3DVd59q1JzQMmc9HDEnZ7pYE="
+    "chai": {
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/chai/-/chai-4.1.2.tgz",
+      "integrity": "sha1-D2RYS6ZC8PKs4oBiefTwbKI61zw="
     },
-    "esrecurse": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.2.0.tgz",
-      "integrity": "sha1-+pVo2Y04I/mkHZHpAtyrnqblsWM="
+    "chain-function": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/chain-function/-/chain-function-1.0.0.tgz",
+      "integrity": "sha1-DUqzfn4Y6tC9xHuSB2QRjOWHM9w="
     },
-    "estraverse": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-4.2.0.tgz",
-      "integrity": "sha1-De4/7TH81GlhjOc0IJn8GvoL2xM="
+    "chainsaw": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/chainsaw/-/chainsaw-0.1.0.tgz",
+      "integrity": "sha1-XqtQsor+WAdNDVgpE4iCi15fvJg="
     },
-    "esutils": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.2.tgz",
-      "integrity": "sha1-Cr9PHKpbyx96nYrMbepPqqBLrJs="
+    "chalk": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
+      "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ=="
     },
-    "etag": {
-      "version": "1.8.1",
-      "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz",
-      "integrity": "sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc="
+    "check-error": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/check-error/-/check-error-1.0.2.tgz",
+      "integrity": "sha1-V00xLt2Iu13YkS6Sht1sCu1KrII="
     },
-    "event-emitter": {
-      "version": "0.3.5",
-      "resolved": "https://registry.npmjs.org/event-emitter/-/event-emitter-0.3.5.tgz",
-      "integrity": "sha1-34xp7vFkeSPHFXuc6DhAYQsCzDk="
+    "cheerio": {
+      "version": "0.22.0",
+      "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-0.22.0.tgz",
+      "integrity": "sha1-qbqoYKP5tZWmuBsahocxIe06Jp4="
     },
-    "eventemitter3": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-1.2.0.tgz",
-      "integrity": "sha1-HIaZHYFq0eUEdQ5zh0Ik7PO+xQg="
+    "chokidar": {
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-1.7.0.tgz",
+      "integrity": "sha1-eY5ol3gVHIB2tLNg5e3SjNortGg="
     },
-    "events": {
+    "ci-info": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/events/-/events-1.1.1.tgz",
-      "integrity": "sha1-nr23Y1rQmccNzEwqH1AEKI6L2SQ="
-    },
-    "eventsource": {
-      "version": "0.1.6",
-      "resolved": "https://registry.npmjs.org/eventsource/-/eventsource-0.1.6.tgz",
-      "integrity": "sha1-Cs7ehJ7X3RzMMsgRuxG5RNTykjI="
-    },
-    "evp_bytestokey": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/evp_bytestokey/-/evp_bytestokey-1.0.3.tgz",
-      "integrity": "sha512-/f2Go4TognH/KvCISP7OUsHn85hT9nUkxxA9BEWxFn+Oj9o8ZNLm/40hdlgSLyuOimsrTKLUMEorQexp/aPQeA=="
-    },
-    "exec-sh": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/exec-sh/-/exec-sh-0.2.1.tgz",
-      "integrity": "sha512-aLt95pexaugVtQerpmE51+4QfWrNc304uez7jvj6fWnN8GeEHpttB8F36n8N7uVhUMbH/1enbxQ9HImZ4w/9qg=="
-    },
-    "execa": {
-      "version": "0.7.0",
-      "resolved": "https://registry.npmjs.org/execa/-/execa-0.7.0.tgz",
-      "integrity": "sha1-lEvs00zEHuMqY6n68nrVpl/Fl3c="
+      "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-1.1.1.tgz",
+      "integrity": "sha512-vHDDF/bP9RYpTWtUhpJRhCFdvvp3iDWvEbuDbWgvjUrNGV1MXJrE0MPcwGtEled04m61iwdBLUIHZtDgzWS4ZQ=="
     },
-    "exenv": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/exenv/-/exenv-1.2.2.tgz",
-      "integrity": "sha1-KueOhdmJQVhnCwPUe+wfA72Ru50="
+    "cipher-base": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/cipher-base/-/cipher-base-1.0.4.tgz",
+      "integrity": "sha512-Kkht5ye6ZGmwv40uUDZztayT2ThLQGfnj/T71N/XzeZeo3nf8foyW7zGTsPYkEya3m5f3cAypH+qe7YOrM1U2Q=="
     },
-    "expand-braces": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/expand-braces/-/expand-braces-0.1.2.tgz",
-      "integrity": "sha1-SIsdHSRRyz06axks/AMPRMWFX+o=",
+    "clap": {
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/clap/-/clap-1.2.3.tgz",
+      "integrity": "sha512-4CoL/A3hf90V3VIEjeuhSvlGFEHKzOz+Wfc2IVZc+FaUgU0ZQafJTP49fvnULipOPcAfqhyI2duwQyns6xqjYA==",
       "dependencies": {
-        "array-unique": {
-          "version": "0.2.1",
-          "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
-          "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM="
-        },
-        "braces": {
-          "version": "0.1.5",
-          "resolved": "https://registry.npmjs.org/braces/-/braces-0.1.5.tgz",
-          "integrity": "sha1-wIVxEIUpHYt1/ddOqw+FlygHEeY="
-        },
-        "expand-range": {
-          "version": "0.1.1",
-          "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-0.1.1.tgz",
-          "integrity": "sha1-TLjtoJk8pW+k9B/ELzy7TMrf8EQ="
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
         },
-        "is-number": {
-          "version": "0.1.1",
-          "resolved": "https://registry.npmjs.org/is-number/-/is-number-0.1.1.tgz",
-          "integrity": "sha1-aaevEWlj1HIG7JvZtIoUIW8eOAY="
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
         },
-        "repeat-string": {
-          "version": "0.2.2",
-          "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-0.2.2.tgz",
-          "integrity": "sha1-x6jTI2BoNiBZp+RlH8aITosftK4="
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
         }
       }
     },
-    "expand-brackets": {
-      "version": "2.1.4",
-      "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-2.1.4.tgz",
-      "integrity": "sha1-t3c14xXOMPa27/D4OwQVGiJEliI=",
+    "class-utils": {
+      "version": "0.3.5",
+      "resolved": "https://registry.npmjs.org/class-utils/-/class-utils-0.3.5.tgz",
+      "integrity": "sha1-F+eTEDdQ+WJ7IXbqNM/RtWWQPIA=",
       "dependencies": {
         "define-property": {
           "version": "0.2.5",
@@ -5003,834 +1761,1348 @@
         }
       }
     },
-    "expand-range": {
-      "version": "1.8.2",
-      "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz",
-      "integrity": "sha1-opnv/TNf4nIeuujiV+x5ZE/IUzc=",
+    "classnames": {
+      "version": "2.2.5",
+      "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.2.5.tgz",
+      "integrity": "sha1-+zgB1FNGdknvNgPH1hoCvRKb3m0="
+    },
+    "cli-table": {
+      "version": "0.3.1",
+      "resolved": "https://registry.npmjs.org/cli-table/-/cli-table-0.3.1.tgz",
+      "integrity": "sha1-9TsFJmqLGguTSz0IIebi3FkUriM=",
       "dependencies": {
-        "fill-range": {
-          "version": "2.2.3",
-          "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz",
-          "integrity": "sha1-ULd9/X5Gm8dJJHCWNpn+eoSFpyM="
-        },
-        "is-number": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz",
-          "integrity": "sha1-Afy7s5NGOlSPL0ZszhbezknbkI8="
-        },
-        "isobject": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
-          "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk="
-        },
-        "kind-of": {
-          "version": "3.2.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+        "colors": {
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/colors/-/colors-1.0.3.tgz",
+          "integrity": "sha1-BDP0TYCWgP3rYO0mDxsMJi6CpAs="
         }
       }
     },
-    "expect": {
-      "version": "21.2.1",
-      "resolved": "https://registry.npmjs.org/expect/-/expect-21.2.1.tgz",
-      "integrity": "sha512-orfQQqFRTX0jH7znRIGi8ZMR8kTNpXklTTz8+HGTpmTKZo3Occ6JNB5FXMb8cRuiiC/GyDqsr30zUa66ACYlYw=="
+    "cli-usage": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/cli-usage/-/cli-usage-0.1.4.tgz",
+      "integrity": "sha1-fAHg3HBsI0s5yTODjI4gshdXduI="
     },
-    "express": {
-      "version": "4.16.1",
-      "resolved": "https://registry.npmjs.org/express/-/express-4.16.1.tgz",
-      "integrity": "sha512-STB7LZ4N0L+81FJHGla2oboUHTk4PaN1RsOkoRh9OSeEKylvF5hwKYVX1xCLFaCT7MD0BNG/gX2WFMLqY6EMBw==",
+    "cliui": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
+      "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE=",
       "dependencies": {
-        "accepts": {
-          "version": "1.3.4",
-          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.4.tgz",
-          "integrity": "sha1-hiRnWMfdbSGmR0/whKR0DsBesh8="
-        },
-        "finalhandler": {
-          "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.0.tgz",
-          "integrity": "sha1-zgtoVbRYU+eRsvzGgARtiCU91/U="
-        },
-        "ipaddr.js": {
-          "version": "1.5.2",
-          "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.5.2.tgz",
-          "integrity": "sha1-1LUFvemUaYfM8PxY2QEP+WB+P6A="
-        },
-        "path-to-regexp": {
-          "version": "0.1.7",
-          "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
-          "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
-        },
-        "proxy-addr": {
-          "version": "2.0.2",
-          "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.2.tgz",
-          "integrity": "sha1-ZXFQT0e7mI7IGAJT+F3X4UlSvew="
-        },
-        "setprototypeof": {
-          "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.0.tgz",
-          "integrity": "sha512-BvE/TwpZX4FXExxOxZyRGQQv651MSwmWKZGqvmPcRIjDqWub67kTKuIMx43cZZrS/cBBzwBcNDWoFxt2XEFIpQ=="
+        "wordwrap": {
+          "version": "0.0.2",
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
+          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
         }
       }
     },
-    "extend": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz",
-      "integrity": "sha1-p1Xqe8Gt/MWjHOfnYtuq3F5jZEQ="
-    },
-    "extend-shallow": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
-      "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8="
-    },
-    "extglob": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/extglob/-/extglob-2.0.2.tgz",
-      "integrity": "sha512-I0+eZBH+jFGL8F5BnIz2ON2nKCjTS3AS3H/5PeSmCp7UVC70Ym8IhdRiQly2juKYQ//f7z1aj1BRpQniFJoU1w=="
+    "clone": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.2.tgz",
+      "integrity": "sha1-Jgt6meux7f4kdTgXX3gyQ8sZ0Uk="
     },
-    "extract-zip": {
-      "version": "1.6.5",
-      "resolved": "https://registry.npmjs.org/extract-zip/-/extract-zip-1.6.5.tgz",
-      "integrity": "sha1-maBnNbbqIOqbcF13ms/8yHz/BEA=",
+    "clone-deep": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-0.3.0.tgz",
+      "integrity": "sha1-NIxhrpzb4O3+BT2R/0zFIdeQ7eg=",
       "dependencies": {
-        "debug": {
-          "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
-        },
-        "mkdirp": {
-          "version": "0.5.0",
-          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.0.tgz",
-          "integrity": "sha1-HXMHam35hs2TROFecfzAWkyavxI="
+        "for-own": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/for-own/-/for-own-1.0.0.tgz",
+          "integrity": "sha1-xjMy9BXO3EsE2/5wz4NklMU8tEs="
         },
-        "ms": {
-          "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
         }
       }
     },
-    "extsprintf": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.3.0.tgz",
-      "integrity": "sha1-lpGEQOMEGnpBT4xS48V06zw+HgU="
+    "co": {
+      "version": "4.6.0",
+      "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
+      "integrity": "sha1-bqa989hTrlTMuOR7+gvz+QMfsYQ="
     },
-    "eyes": {
-      "version": "0.1.8",
-      "resolved": "https://registry.npmjs.org/eyes/-/eyes-0.1.8.tgz",
-      "integrity": "sha1-Ys8SAjTGg3hdkCNIqADvPgzCC8A="
+    "coa": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/coa/-/coa-1.0.4.tgz",
+      "integrity": "sha1-qe8VNmDWqGqL3sAomlxoTSF0Mv0="
     },
-    "fast-deep-equal": {
+    "code-point-at": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz",
+      "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c="
+    },
+    "collection-visit": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-1.0.0.tgz",
-      "integrity": "sha1-liVqO8l1WV6zbYLpkp0GDYk0Of8="
+      "resolved": "https://registry.npmjs.org/collection-visit/-/collection-visit-1.0.0.tgz",
+      "integrity": "sha1-S8A3PBZLwykbTTaMgpzxqApZ3KA="
     },
-    "fast-levenshtein": {
-      "version": "2.0.6",
-      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
-      "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc="
+    "color": {
+      "version": "0.11.4",
+      "resolved": "https://registry.npmjs.org/color/-/color-0.11.4.tgz",
+      "integrity": "sha1-bXtcdPtl6EHNSHkq0e1eB7kE12Q="
     },
-    "fast-memoize": {
-      "version": "2.2.8",
-      "resolved": "https://registry.npmjs.org/fast-memoize/-/fast-memoize-2.2.8.tgz",
-      "integrity": "sha512-3ppTC3fZ9Vwtjslx8DkhSIbI9PH1nM4pobuTHQINOxTxchG8n3SDGZ8L6jbatGJCGLKR+gbkNWKFN4E1iUROSA=="
+    "color-convert": {
+      "version": "1.9.0",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.0.tgz",
+      "integrity": "sha1-Gsz5fdc5uYO/mU1W/sj5WFNkG3o="
     },
-    "fastparse": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.1.tgz",
-      "integrity": "sha1-0eJkOzipTXWDtHkGDmxK/8lAcfg="
+    "color-functions": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/color-functions/-/color-functions-1.1.0.tgz",
+      "integrity": "sha1-TLgFR5Blo2WMMmn0j6xz7/APld4="
     },
-    "faye-websocket": {
-      "version": "0.10.0",
-      "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz",
-      "integrity": "sha1-TkkvjQTftviQA1B/btvy1QHnxvQ="
+    "color-name": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
+      "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU="
     },
-    "fb-watchman": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/fb-watchman/-/fb-watchman-2.0.0.tgz",
-      "integrity": "sha1-VOmr99+i8mzZsWNsWIwa/AXeXVg="
+    "color-string": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/color-string/-/color-string-0.3.0.tgz",
+      "integrity": "sha1-J9RvtnAlxcL6JZk7+/V55HhBuZE="
     },
-    "fbjs": {
-      "version": "0.8.16",
-      "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.16.tgz",
-      "integrity": "sha1-XmdDL1UNxBtXK/VYR7ispk5TN9s=",
-      "dependencies": {
-        "core-js": {
-          "version": "1.2.7",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
-          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
-        }
-      }
+    "colormin": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/colormin/-/colormin-1.1.2.tgz",
+      "integrity": "sha1-6i90IKcrlogaOKrlnsEkpvcpgTM="
     },
-    "fd-slicer": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/fd-slicer/-/fd-slicer-1.0.1.tgz",
-      "integrity": "sha1-i1vL2ewyfFBBv5qwI/1nUPEXfmU="
+    "colors": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/colors/-/colors-1.1.2.tgz",
+      "integrity": "sha1-FopHAXVran9RoSzgyXv6KMCE7WM="
     },
-    "file-loader": {
-      "version": "0.11.1",
-      "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.11.1.tgz",
-      "integrity": "sha1-azKO4SNKcp5OR9Njdd1tNcDh24Q="
+    "combine-lists": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/combine-lists/-/combine-lists-1.0.1.tgz",
+      "integrity": "sha1-RYwH4J4NkA/Ci3Cj/sLazR0st/Y="
     },
-    "filename-regex": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz",
-      "integrity": "sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY="
+    "combined-stream": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz",
+      "integrity": "sha1-k4NwpXtKUd6ix3wV1cX9+JUWQAk="
     },
-    "fileset": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/fileset/-/fileset-2.0.3.tgz",
-      "integrity": "sha1-jnVIqW08wjJ+5eZ0FocjozO7oqA="
+    "command-line-args": {
+      "version": "4.0.7",
+      "resolved": "https://registry.npmjs.org/command-line-args/-/command-line-args-4.0.7.tgz",
+      "integrity": "sha512-aUdPvQRAyBvQd2n7jXcsMDz68ckBJELXNzBybCHOibUWEg0mWTnaYCSRU8h9R+aNRSvDihJtssSRCiDRpLaezA=="
     },
-    "filesize": {
-      "version": "3.5.10",
-      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.5.10.tgz",
-      "integrity": "sha1-/I+iPdtO+eXgq24eZPZ5okpWdh8="
+    "commander": {
+      "version": "2.11.0",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-2.11.0.tgz",
+      "integrity": "sha512-b0553uYA5YAEGgyYIGYROzKQ7X5RAqedkfjiZxwi0kL1g3bOaBNNZfYkzt/CL0umgD5wc9Jec2FbB98CjkMRvQ=="
     },
-    "fill-range": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-4.0.0.tgz",
-      "integrity": "sha1-1USBHUKPmOsGpj3EAtJAPDKMOPc="
+    "common-tags": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/common-tags/-/common-tags-1.4.0.tgz",
+      "integrity": "sha1-EYe+Tz1M8MBCfUP3Tu8fc1AWFMA="
     },
-    "finalhandler": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.6.tgz",
-      "integrity": "sha1-AHrqM9Gk0+QgF/YkhIrVjSEvgU8="
+    "commondir": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/commondir/-/commondir-1.0.1.tgz",
+      "integrity": "sha1-3dgA2gxmEnOTzKWVDqloo6rxJTs="
     },
-    "find-cache-dir": {
+    "component-bind": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/find-cache-dir/-/find-cache-dir-1.0.0.tgz",
-      "integrity": "sha1-kojj6ePMN0hxfTnq3hfPcfww7m8="
+      "resolved": "https://registry.npmjs.org/component-bind/-/component-bind-1.0.0.tgz",
+      "integrity": "sha1-AMYIq33Nk4l8AAllGx06jh5zu9E="
     },
-    "find-index": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
-      "integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ="
+    "component-emitter": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz",
+      "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY="
     },
-    "find-replace": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/find-replace/-/find-replace-1.0.3.tgz",
-      "integrity": "sha1-uI5zZNLZyVlVnziMZmcNYTBEH6A=",
+    "component-inherit": {
+      "version": "0.0.3",
+      "resolved": "https://registry.npmjs.org/component-inherit/-/component-inherit-0.0.3.tgz",
+      "integrity": "sha1-ZF/ErfWLcrZJ1crmUTVhnbJv8UM="
+    },
+    "compressible": {
+      "version": "2.0.11",
+      "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.11.tgz",
+      "integrity": "sha1-FnGKdd4oPtjmBAQWJaIGRYZ5fYo="
+    },
+    "compression": {
+      "version": "1.7.1",
+      "resolved": "https://registry.npmjs.org/compression/-/compression-1.7.1.tgz",
+      "integrity": "sha1-7/JgPvwuIs+G810uuTWJ+YdTc9s=",
       "dependencies": {
-        "array-back": {
-          "version": "1.0.4",
-          "resolved": "https://registry.npmjs.org/array-back/-/array-back-1.0.4.tgz",
-          "integrity": "sha1-ZEun8JX3/898Q7Xw3DnTwfA8Bjs="
+        "accepts": {
+          "version": "1.3.4",
+          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.4.tgz",
+          "integrity": "sha1-hiRnWMfdbSGmR0/whKR0DsBesh8="
         }
       }
     },
-    "find-up": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz",
-      "integrity": "sha1-RdG35QbHF93UgndaK3eSCjwMV6c="
+    "concat-map": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
+      "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s="
+    },
+    "concat-stream": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.0.tgz",
+      "integrity": "sha1-CqxmL9Ur54lk1VMvaUeE5wEQrPc="
+    },
+    "configstore": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.1.tgz",
+      "integrity": "sha512-5oNkD/L++l0O6xGXxb1EWS7SivtjfGQlRyxJsYgE0Z495/L81e2h4/d3r969hoPXuFItzNOKMtsXgYG4c7dYvw=="
+    },
+    "connect": {
+      "version": "3.6.5",
+      "resolved": "https://registry.npmjs.org/connect/-/connect-3.6.5.tgz",
+      "integrity": "sha1-+43ee6B2OHfQ7J352sC0tA5yx9o="
+    },
+    "connect-history-api-fallback": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.3.0.tgz",
+      "integrity": "sha1-5R0X+PDvDbkKZP20feMFFVbp8Wk="
+    },
+    "console-browserify": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.1.0.tgz",
+      "integrity": "sha1-8CQcRXMKn8YyOyBtvzjtx0HQuxA="
+    },
+    "console-control-strings": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz",
+      "integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4="
+    },
+    "constants-browserify": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz",
+      "integrity": "sha1-wguW2MYXdIqvHBYCF2DNJ/y4y3U="
+    },
+    "content-disposition": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.2.tgz",
+      "integrity": "sha1-DPaLud318r55YcOoUXjLhdunjLQ="
+    },
+    "content-type": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.4.tgz",
+      "integrity": "sha512-hIP3EEPs8tB9AT1L+NUqtwOAps4mk2Zob89MWXMHjHWg9milF/j4osnnQLXBCBFBk/tvIG/tUc9mOUJiPBhPXA=="
+    },
+    "content-type-parser": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/content-type-parser/-/content-type-parser-1.0.1.tgz",
+      "integrity": "sha1-w+VpiMU8ZRJ/tG1AMqOpACRv3JQ="
+    },
+    "convert-source-map": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.5.0.tgz",
+      "integrity": "sha1-ms1whRxtXf3ZPZKC5e35SgP/RrU="
+    },
+    "cookie": {
+      "version": "0.3.1",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.3.1.tgz",
+      "integrity": "sha1-5+Ch+e9DtMi6klxcWpboBtFoc7s="
     },
-    "flatten": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz",
-      "integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I="
+    "cookie-signature": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
+      "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw="
     },
-    "follow-redirects": {
-      "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-0.0.7.tgz",
-      "integrity": "sha1-NLkLqyqRGqNHVx2pDyK9NuzYqRk="
+    "copy-descriptor": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/copy-descriptor/-/copy-descriptor-0.1.1.tgz",
+      "integrity": "sha1-Z29us8OZl8LuGsOpJP1hJHSPV40="
     },
-    "for-in": {
+    "core-js": {
+      "version": "2.5.1",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.5.1.tgz",
+      "integrity": "sha1-rmh03GaTd4m4B1T/VCjfZoGcpQs="
+    },
+    "core-util-is": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
-      "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA="
+      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
+      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac="
     },
-    "for-own": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz",
-      "integrity": "sha1-UmXGgaTylNq78XyVCbZ2OqhFEM4="
+    "cosmiconfig": {
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-2.2.2.tgz",
+      "integrity": "sha512-GiNXLwAFPYHy25XmTPpafYvn3CLAkJ8FLsscq78MQd1Kh0OU6Yzhn4eV2MVF4G9WEQZoWEGltatdR+ntGPMl5A==",
+      "dependencies": {
+        "minimist": {
+          "version": "1.2.0",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
+          "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
+        }
+      }
     },
-    "foreach": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/foreach/-/foreach-2.0.5.tgz",
-      "integrity": "sha1-C+4AUBiusmDQo6865ljdATbsG5k="
+    "cpx": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/cpx/-/cpx-1.5.0.tgz",
+      "integrity": "sha1-GFvgGFEdhycN7czCkxceN2VauI8="
     },
-    "forever-agent": {
-      "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
-      "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE="
+    "create-ecdh": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.0.tgz",
+      "integrity": "sha1-iIxyNZbN92EvZJgjPuvXo1MBc30="
     },
-    "form-data": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.3.1.tgz",
-      "integrity": "sha1-b7lPvXGIUwbXPRXMSX/kzE7NRL8="
+    "create-hash": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/create-hash/-/create-hash-1.1.3.tgz",
+      "integrity": "sha1-YGBCrIuSYnUPSDyt2rD1gZFy2P0="
     },
-    "formatio": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.2.0.tgz",
-      "integrity": "sha1-87IWfZBoxGmKjVH092CjmlTYGOs="
+    "create-hmac": {
+      "version": "1.1.6",
+      "resolved": "https://registry.npmjs.org/create-hmac/-/create-hmac-1.1.6.tgz",
+      "integrity": "sha1-rLniIaThe9sHbpBlfEK5PjcmzwY="
     },
-    "forwarded": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.2.tgz",
-      "integrity": "sha1-mMI9qxF1ZXuMBXPozszZGw/xjIQ="
+    "create-react-class": {
+      "version": "15.6.2",
+      "resolved": "https://registry.npmjs.org/create-react-class/-/create-react-class-15.6.2.tgz",
+      "integrity": "sha1-zx7RXxKq1/FO9fLf4F5sQvke8Co="
     },
-    "fragment-cache": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/fragment-cache/-/fragment-cache-0.2.1.tgz",
-      "integrity": "sha1-QpD60n8T6Jvn8zeZxrxaCr//DRk="
+    "cross-spawn": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-5.1.0.tgz",
+      "integrity": "sha1-6L0O/uWPz/b4+UUQoKVUu/ojVEk="
     },
-    "fresh": {
-      "version": "0.5.2",
-      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz",
-      "integrity": "sha1-PYyt2Q2XZWn6g1qx+OSyOhBWBac="
+    "cryptiles": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-3.1.2.tgz",
+      "integrity": "sha1-qJ+7Ig9c4l7FboxKqKT9e1sNKf4=",
+      "dependencies": {
+        "boom": {
+          "version": "5.2.0",
+          "resolved": "https://registry.npmjs.org/boom/-/boom-5.2.0.tgz",
+          "integrity": "sha512-Z5BTk6ZRe4tXXQlkqftmsAUANpXmuwlsF5Oov8ThoMbQRzdGTA1ngYRW160GexgOgjsFOKJz0LYhoNi+2AMBUw=="
+        }
+      }
     },
-    "fs-extra": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-1.0.0.tgz",
-      "integrity": "sha1-zTzl9+fLYUWIP8rjGR6Yd/hYeVA="
+    "crypto-browserify": {
+      "version": "3.11.1",
+      "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.1.tgz",
+      "integrity": "sha512-Na7ZlwCOqoaW5RwUK1WpXws2kv8mNhWdTlzob0UXulk6G9BDbyiJaGTYBIX61Ozn9l1EPPJpICZb4DaOpT9NlQ=="
     },
-    "fs.realpath": {
+    "crypto-random-string": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
-      "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
+      "resolved": "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-1.0.0.tgz",
+      "integrity": "sha1-ojD2T1aDEOFJgAmUB5DsmVRbyn4="
     },
-    "fsevents": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.2.tgz",
-      "integrity": "sha512-Sn44E5wQW4bTHXvQmvSHwqbuiXtduD6Rrjm2ZtUEGbyrig+nUH3t/QD4M4/ZXViY556TBpRgZkHLDx3JxPwxiw==",
-      "optional": true,
-      "dependencies": {
-        "abbrev": {
-          "version": "1.1.0",
-          "bundled": true,
-          "optional": true
-        },
-        "ajv": {
-          "version": "4.11.8",
-          "bundled": true,
-          "optional": true
-        },
-        "ansi-regex": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "aproba": {
-          "version": "1.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "are-we-there-yet": {
-          "version": "1.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "asn1": {
-          "version": "0.2.3",
-          "bundled": true,
-          "optional": true
-        },
-        "assert-plus": {
-          "version": "0.2.0",
-          "bundled": true,
-          "optional": true
-        },
-        "asynckit": {
-          "version": "0.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "aws-sign2": {
-          "version": "0.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "aws4": {
-          "version": "1.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "balanced-match": {
-          "version": "0.4.2",
-          "bundled": true
-        },
-        "bcrypt-pbkdf": {
-          "version": "1.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "block-stream": {
-          "version": "0.0.9",
-          "bundled": true
-        },
-        "boom": {
-          "version": "2.10.1",
-          "bundled": true
-        },
-        "brace-expansion": {
-          "version": "1.1.7",
-          "bundled": true
-        },
-        "buffer-shims": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "caseless": {
-          "version": "0.12.0",
-          "bundled": true,
-          "optional": true
-        },
-        "co": {
-          "version": "4.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "code-point-at": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "combined-stream": {
-          "version": "1.0.5",
-          "bundled": true
-        },
-        "concat-map": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "console-control-strings": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "core-util-is": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "cryptiles": {
-          "version": "2.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "dashdash": {
-          "version": "1.14.1",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true,
-          "optional": true
-        },
-        "deep-extend": {
-          "version": "0.4.2",
-          "bundled": true,
-          "optional": true
-        },
-        "delayed-stream": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "delegates": {
-          "version": "1.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "ecc-jsbn": {
-          "version": "0.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "extend": {
-          "version": "3.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "extsprintf": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "forever-agent": {
-          "version": "0.6.1",
-          "bundled": true,
-          "optional": true
+    "css-color-names": {
+      "version": "0.0.4",
+      "resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz",
+      "integrity": "sha1-gIrcLnnPhHOAabZGyyDsJ762KeA="
+    },
+    "css-in-js-utils": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/css-in-js-utils/-/css-in-js-utils-2.0.0.tgz",
+      "integrity": "sha512-yuWmPMD9FLi50Xf3k8W8oO3WM1eVnxEGCldCLyfusQ+CgivFk0s23yst4ooW6tfxMuSa03S6uUEga9UhX6GRrA=="
+    },
+    "css-loader": {
+      "version": "0.28.7",
+      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.7.tgz",
+      "integrity": "sha512-GxMpax8a/VgcfRrVy0gXD6yLd5ePYbXX/5zGgTVYp4wXtJklS8Z2VaUArJgc//f6/Dzil7BaJObdSv8eKKCPgg==",
+      "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
         },
-        "form-data": {
-          "version": "2.1.4",
-          "bundled": true,
-          "optional": true
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
         },
-        "fs.realpath": {
+        "has-flag": {
           "version": "1.0.0",
-          "bundled": true
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
-        "fstream": {
-          "version": "1.0.11",
-          "bundled": true
+        "postcss": {
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
         },
-        "fstream-ignore": {
-          "version": "1.0.5",
-          "bundled": true,
-          "optional": true
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
-        "gauge": {
-          "version": "2.7.4",
-          "bundled": true,
-          "optional": true
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
+    },
+    "css-modules-loader-core": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/css-modules-loader-core/-/css-modules-loader-core-1.1.0.tgz",
+      "integrity": "sha1-WQhmgpShvs0mGuCkziGwtVHyHRY=",
+      "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
         },
-        "getpass": {
-          "version": "0.1.7",
-          "bundled": true,
-          "optional": true,
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
           "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
             }
           }
         },
-        "glob": {
-          "version": "7.1.2",
-          "bundled": true
-        },
-        "graceful-fs": {
-          "version": "4.1.11",
-          "bundled": true
-        },
-        "har-schema": {
-          "version": "1.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "har-validator": {
-          "version": "4.2.1",
-          "bundled": true,
-          "optional": true
-        },
-        "has-unicode": {
-          "version": "2.0.1",
-          "bundled": true,
-          "optional": true
+        "has-flag": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
-        "hawk": {
-          "version": "3.1.3",
-          "bundled": true,
-          "optional": true
+        "postcss": {
+          "version": "6.0.1",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
+          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
         },
-        "hoek": {
-          "version": "2.16.3",
-          "bundled": true
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
-        "http-signature": {
-          "version": "1.1.1",
-          "bundled": true,
-          "optional": true
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
+    },
+    "css-select": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz",
+      "integrity": "sha1-KzoRBTnFNV8c2NMUYj6HCxIeyFg="
+    },
+    "css-selector-tokenizer": {
+      "version": "0.7.0",
+      "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.7.0.tgz",
+      "integrity": "sha1-5piEdK6MlTR3v15+/s/OzNnPTIY="
+    },
+    "css-what": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/css-what/-/css-what-2.1.0.tgz",
+      "integrity": "sha1-lGfQMsOM+u+58teVASUwYvh/ob0="
+    },
+    "cssesc": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-0.1.0.tgz",
+      "integrity": "sha1-yBSQPkViM3GgR3tAEJqq++6t27Q="
+    },
+    "cssmin": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/cssmin/-/cssmin-0.3.2.tgz",
+      "integrity": "sha1-3c5MVHtRCuDVlKjx+/iq+OLFwA0="
+    },
+    "cssnano": {
+      "version": "3.10.0",
+      "resolved": "https://registry.npmjs.org/cssnano/-/cssnano-3.10.0.tgz",
+      "integrity": "sha1-Tzj2zqK5sX+gFJDyPx3GjqZcHDg=",
+      "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
         },
-        "inflight": {
-          "version": "1.0.6",
-          "bundled": true
+        "autoprefixer": {
+          "version": "6.7.7",
+          "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.7.7.tgz",
+          "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ="
         },
-        "inherits": {
-          "version": "2.0.3",
-          "bundled": true
+        "browserslist": {
+          "version": "1.7.7",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
+          "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk="
         },
-        "ini": {
-          "version": "1.3.4",
-          "bundled": true,
-          "optional": true
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dependencies": {
+            "supports-color": {
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+            }
+          }
         },
-        "is-fullwidth-code-point": {
+        "has-flag": {
           "version": "1.0.0",
-          "bundled": true
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
-        "is-typedarray": {
-          "version": "1.0.0",
-          "bundled": true,
-          "optional": true
+        "postcss": {
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
         },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
+        },
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+        }
+      }
+    },
+    "csso": {
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/csso/-/csso-2.3.2.tgz",
+      "integrity": "sha1-3dUsWHAz9J6Utx/FVWnyUuj/X4U=",
+      "dependencies": {
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
+        }
+      }
+    },
+    "cssom": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/cssom/-/cssom-0.3.2.tgz",
+      "integrity": "sha1-uANhcMefB6kP8vFuIihAJ6JDhIs="
+    },
+    "cssstyle": {
+      "version": "0.2.37",
+      "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-0.2.37.tgz",
+      "integrity": "sha1-VBCXI0yyUTyDzu06zdwn/yeYfVQ="
+    },
+    "currently-unhandled": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz",
+      "integrity": "sha1-mI3zP+qxke95mmE2nddsF635V+o="
+    },
+    "custom-event": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/custom-event/-/custom-event-1.0.1.tgz",
+      "integrity": "sha1-XQKkaFCt8bSjF5RqOSj8y1v9BCU="
+    },
+    "cycle": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/cycle/-/cycle-1.0.3.tgz",
+      "integrity": "sha1-IegLK+hYD5i0aPN5QwZisEbDStI="
+    },
+    "d": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/d/-/d-1.0.0.tgz",
+      "integrity": "sha1-dUu1v+VUUdpppYuU1F9MWwRi1Y8="
+    },
+    "dashdash": {
+      "version": "1.14.1",
+      "resolved": "https://registry.npmjs.org/dashdash/-/dashdash-1.14.1.tgz",
+      "integrity": "sha1-hTz6D3y+L+1d4gMmuN1YEDX24vA="
+    },
+    "date-now": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/date-now/-/date-now-0.1.4.tgz",
+      "integrity": "sha1-6vQ5/U1ISK105cx9vvIAZyueNFs="
+    },
+    "dateformat": {
+      "version": "1.0.12",
+      "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
+      "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk="
+    },
+    "debug": {
+      "version": "2.6.9",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
+      "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA=="
+    },
+    "decamelize": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
+      "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA="
+    },
+    "decompress-zip": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/decompress-zip/-/decompress-zip-0.3.0.tgz",
+      "integrity": "sha1-rjvLfjTGWHmt/nfhnDD4ZgK0vbA=",
+      "dependencies": {
         "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "isstream": {
-          "version": "0.1.2",
-          "bundled": true,
-          "optional": true
-        },
-        "jodid25519": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "jsbn": {
-          "version": "0.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "json-schema": {
-          "version": "0.2.3",
-          "bundled": true,
-          "optional": true
-        },
-        "json-stable-stringify": {
-          "version": "1.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "json-stringify-safe": {
-          "version": "5.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "jsonify": {
-          "version": "0.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "jsprim": {
-          "version": "1.4.0",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "mime-db": {
-          "version": "1.27.0",
-          "bundled": true
-        },
-        "mime-types": {
-          "version": "2.1.15",
-          "bundled": true
-        },
-        "minimatch": {
-          "version": "3.0.4",
-          "bundled": true
+          "version": "0.0.1",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
         },
-        "minimist": {
-          "version": "0.0.8",
-          "bundled": true
+        "readable-stream": {
+          "version": "1.1.14",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
+          "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk="
         },
-        "mkdirp": {
-          "version": "0.5.1",
-          "bundled": true
+        "string_decoder": {
+          "version": "0.10.31",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
+        }
+      }
+    },
+    "deep-eql": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-3.0.1.tgz",
+      "integrity": "sha512-+QeIQyN5ZuO+3Uk5DYh6/1eKO0m0YmJFGNmFHGACpf1ClL1nmlV/p4gNgbl2pJGxgXb4faqo6UE+M5ACEMyVcw=="
+    },
+    "deep-equal": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/deep-equal/-/deep-equal-1.0.1.tgz",
+      "integrity": "sha1-9dJgKStmDghO/0zbyfCK0yR0SLU="
+    },
+    "deep-is": {
+      "version": "0.1.3",
+      "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz",
+      "integrity": "sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ="
+    },
+    "default-require-extensions": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/default-require-extensions/-/default-require-extensions-1.0.0.tgz",
+      "integrity": "sha1-836hXT4T/9m0N9M+GnW1+5eHTLg="
+    },
+    "define-properties": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.1.2.tgz",
+      "integrity": "sha1-g6c/L+pWmJj7c3GTyPhzyvbUXJQ="
+    },
+    "define-property": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/define-property/-/define-property-1.0.0.tgz",
+      "integrity": "sha1-dp66rz9KY6rTr56NMEybvnm/sOY="
+    },
+    "defined": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/defined/-/defined-1.0.0.tgz",
+      "integrity": "sha1-yY2bzvdWdBiOEQlpFRGZ45sfppM="
+    },
+    "del": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/del/-/del-3.0.0.tgz",
+      "integrity": "sha1-U+z2mf/LyzljdpGrE7rxYIGXZuU="
+    },
+    "delayed-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
+      "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk="
+    },
+    "delegates": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz",
+      "integrity": "sha1-hMbhWbgZBP3KWaDvRM2HDTElD5o="
+    },
+    "depd": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.1.tgz",
+      "integrity": "sha1-V4O04cRZ8G+lyif5kfPQbnoxA1k="
+    },
+    "des.js": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/des.js/-/des.js-1.0.0.tgz",
+      "integrity": "sha1-wHTS4qpqipoH29YfmhXCzYPsjsw="
+    },
+    "destroy": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.0.4.tgz",
+      "integrity": "sha1-l4hXRCxEdJ5CBmE+N5RiBYJqvYA="
+    },
+    "detect-indent": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/detect-indent/-/detect-indent-4.0.0.tgz",
+      "integrity": "sha1-920GQ1LN9Docts5hnE7jqUdd4gg="
+    },
+    "detect-node": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.0.3.tgz",
+      "integrity": "sha1-ogM8CcyOFY03dI+951B4Mr1s4Sc="
+    },
+    "di": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/di/-/di-0.0.1.tgz",
+      "integrity": "sha1-gGZJMmzqp8qjMG112YXqJ0i6kTw="
+    },
+    "diff": {
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/diff/-/diff-3.3.1.tgz",
+      "integrity": "sha512-MKPHZDMB0o6yHyDryUOScqZibp914ksXwAMYMTHj6KO8UeKsRYNJD3oNCKjTqZon+V488P7N/HzXF8t7ZR95ww=="
+    },
+    "diffie-hellman": {
+      "version": "5.0.2",
+      "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.2.tgz",
+      "integrity": "sha1-tYNXOScM/ias9jIJn97SoH8gnl4="
+    },
+    "dns-equal": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/dns-equal/-/dns-equal-1.0.0.tgz",
+      "integrity": "sha1-s55/HabrCnW6nBcySzR1PEfgZU0="
+    },
+    "dns-packet": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.2.2.tgz",
+      "integrity": "sha512-kN+DjfGF7dJGUL7nWRktL9Z18t1rWP3aQlyZdY8XlpvU3Nc6GeFTQApftcjtWKxAZfiggZSGrCEoszNgvnpwDg=="
+    },
+    "dns-txt": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/dns-txt/-/dns-txt-2.0.2.tgz",
+      "integrity": "sha1-uR2Ab10nGI5Ks+fRB9iBocxGQrY="
+    },
+    "doctrine": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-2.0.0.tgz",
+      "integrity": "sha1-xz2NKQnSIpHhoAejlYBNqLZl/mM="
+    },
+    "dom-helpers": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-3.2.1.tgz",
+      "integrity": "sha1-MgPgf+0he9H0JLAZc1WC/Deyglo="
+    },
+    "dom-serialize": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/dom-serialize/-/dom-serialize-2.2.1.tgz",
+      "integrity": "sha1-ViromZ9Evl6jB29UGdzVnrQ6yVs="
+    },
+    "dom-serializer": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.1.0.tgz",
+      "integrity": "sha1-BzxpdUbOB4DOI75KKOKT5AvDDII=",
+      "dependencies": {
+        "domelementtype": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.1.3.tgz",
+          "integrity": "sha1-vSh3PiZCiBrsUVRJJCmcXNgiGFs="
+        }
+      }
+    },
+    "dom-walk": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/dom-walk/-/dom-walk-0.1.1.tgz",
+      "integrity": "sha1-ZyIm3HTI95mtNTB9+TaroRrNYBg="
+    },
+    "domain-browser": {
+      "version": "1.1.7",
+      "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.1.7.tgz",
+      "integrity": "sha1-hnqksJP6oF8d4IwG9NeyH9+GmLw="
+    },
+    "domelementtype": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.3.0.tgz",
+      "integrity": "sha1-sXrtguirWeUt2cGbF1bg/BhyBMI="
+    },
+    "domhandler": {
+      "version": "2.4.1",
+      "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.4.1.tgz",
+      "integrity": "sha1-iS5HAAqZvlW783dP/qBWHYh5wlk="
+    },
+    "domutils": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.5.1.tgz",
+      "integrity": "sha1-3NhIiib1Y9YQeeSMn3t+Mjc2gs8="
+    },
+    "dot-prop": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-4.2.0.tgz",
+      "integrity": "sha512-tUMXrxlExSW6U2EXiiKGSBVdYgtV8qlHL+C10TsW4PURY/ic+eaysnSkwB4kA/mBlCyy/IKDJ+Lc3wbWeaXtuQ=="
+    },
+    "duplexer": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz",
+      "integrity": "sha1-rOb/gIwc5mtX0ev5eXessCM0z8E="
+    },
+    "ecc-jsbn": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.1.tgz",
+      "integrity": "sha1-D8c6ntXw1Tw4GTOYUj735UN3dQU=",
+      "optional": true
+    },
+    "ee-first": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
+      "integrity": "sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0="
+    },
+    "ejs": {
+      "version": "2.5.7",
+      "resolved": "https://registry.npmjs.org/ejs/-/ejs-2.5.7.tgz",
+      "integrity": "sha1-zIcsFoiArjxxiXYv1f/ACJbJUYo="
+    },
+    "electron-to-chromium": {
+      "version": "1.3.24",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.24.tgz",
+      "integrity": "sha1-m3uIuwXOufoBahd4M8wt3jiPIbY="
+    },
+    "elliptic": {
+      "version": "6.4.0",
+      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.4.0.tgz",
+      "integrity": "sha1-ysmvh2LIWDYYcAPI3+GT5eLq5d8="
+    },
+    "emojis-list": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-2.1.0.tgz",
+      "integrity": "sha1-TapNnbAPmBmIDHn6RXrlsJof04k="
+    },
+    "encodeurl": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.1.tgz",
+      "integrity": "sha1-eePVhlU0aQn+bw9Fpd5oEDspTSA="
+    },
+    "encoding": {
+      "version": "0.1.12",
+      "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.12.tgz",
+      "integrity": "sha1-U4tm8+5izRq1HsMjgp0flIDHS+s="
+    },
+    "engine.io": {
+      "version": "1.8.3",
+      "resolved": "https://registry.npmjs.org/engine.io/-/engine.io-1.8.3.tgz",
+      "integrity": "sha1-jef5eJXSDTm4X4ju7nd7K9QrE9Q=",
+      "dependencies": {
+        "debug": {
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
+          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
         },
         "ms": {
-          "version": "2.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "node-pre-gyp": {
-          "version": "0.6.36",
-          "bundled": true,
-          "optional": true
-        },
-        "nopt": {
-          "version": "4.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "npmlog": {
-          "version": "4.1.0",
-          "bundled": true,
-          "optional": true
-        },
-        "number-is-nan": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "oauth-sign": {
-          "version": "0.8.2",
-          "bundled": true,
-          "optional": true
-        },
-        "object-assign": {
-          "version": "4.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "once": {
-          "version": "1.4.0",
-          "bundled": true
-        },
-        "os-homedir": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "os-tmpdir": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "osenv": {
-          "version": "0.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "path-is-absolute": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "performance-now": {
-          "version": "0.2.0",
-          "bundled": true,
-          "optional": true
-        },
-        "process-nextick-args": {
-          "version": "1.0.7",
-          "bundled": true
-        },
-        "punycode": {
-          "version": "1.4.1",
-          "bundled": true,
-          "optional": true
-        },
-        "qs": {
-          "version": "6.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "rc": {
-          "version": "1.2.1",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "minimist": {
-              "version": "1.2.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "readable-stream": {
-          "version": "2.2.9",
-          "bundled": true
-        },
-        "request": {
-          "version": "2.81.0",
-          "bundled": true,
-          "optional": true
-        },
-        "rimraf": {
-          "version": "2.6.1",
-          "bundled": true
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "bundled": true
-        },
-        "semver": {
-          "version": "5.3.0",
-          "bundled": true,
-          "optional": true
-        },
-        "set-blocking": {
-          "version": "2.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "signal-exit": {
-          "version": "3.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "sntp": {
-          "version": "1.0.9",
-          "bundled": true,
-          "optional": true
-        },
-        "sshpk": {
-          "version": "1.13.0",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "string_decoder": {
-          "version": "1.0.1",
-          "bundled": true
+          "version": "0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
+          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
+        }
+      }
+    },
+    "engine.io-client": {
+      "version": "1.8.3",
+      "resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-1.8.3.tgz",
+      "integrity": "sha1-F5jtk0USRkU9TG9jXXogH+lA1as=",
+      "dependencies": {
+        "debug": {
+          "version": "2.3.3",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
+          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
         },
-        "string-width": {
-          "version": "1.0.2",
-          "bundled": true
+        "ms": {
+          "version": "0.7.2",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
+          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
+        }
+      }
+    },
+    "engine.io-parser": {
+      "version": "1.3.2",
+      "resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-1.3.2.tgz",
+      "integrity": "sha1-k3sHnwAH0Ik+xW1GyyILjLQ1Igo="
+    },
+    "enhanced-resolve": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.3.0.tgz",
+      "integrity": "sha512-2qbxE7ek3YxPJ1ML6V+satHkzHpJQKWkRHmRx6mfAoW59yP8YH8BFplbegSP+u2hBd6B6KCOpvJQ3dZAP+hkpg=="
+    },
+    "ent": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/ent/-/ent-2.2.0.tgz",
+      "integrity": "sha1-6WQhkyWiHQX0RGai9obtbOX13R0="
+    },
+    "entities": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.1.tgz",
+      "integrity": "sha1-blwtClYhtdra7O+AuQ7ftc13cvA="
+    },
+    "enzyme": {
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/enzyme/-/enzyme-2.9.1.tgz",
+      "integrity": "sha1-B9XOaRJBJA+4F78sSxjW5TAkDfY="
+    },
+    "errno": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.4.tgz",
+      "integrity": "sha1-uJbiOp5ei6M4cfyZar02NfyaHH0="
+    },
+    "error-ex": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.1.tgz",
+      "integrity": "sha1-+FWobOYa3E6GIcPNoh56dhLDqNw="
+    },
+    "es-abstract": {
+      "version": "1.9.0",
+      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.9.0.tgz",
+      "integrity": "sha512-kk3IJoKo7A3pWJc0OV8yZ/VEX2oSUytfekrJiqoxBlKJMFAJVJVpGdHClCCTdv+Fn2zHfpDHHIelMFhZVfef3Q=="
+    },
+    "es-to-primitive": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.1.1.tgz",
+      "integrity": "sha1-RTVSSKiJeQNLZ5Lhm7gfK3l13Q0="
+    },
+    "es5-ext": {
+      "version": "0.10.30",
+      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.30.tgz",
+      "integrity": "sha1-cUGhaDZpfbq/qq7uQUlc4p9SyTk="
+    },
+    "es5-shim": {
+      "version": "4.5.9",
+      "resolved": "https://registry.npmjs.org/es5-shim/-/es5-shim-4.5.9.tgz",
+      "integrity": "sha1-Kh4rnlg/9f7Qwgo+4svz91IwpcA="
+    },
+    "es6-iterator": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.1.tgz",
+      "integrity": "sha1-jjGcnwRTv1ddN0lAplWSDlnKVRI="
+    },
+    "es6-map": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/es6-map/-/es6-map-0.1.5.tgz",
+      "integrity": "sha1-kTbgUD3MBqMBaQ8LsU/042TpSfA="
+    },
+    "es6-promise": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.1.tgz",
+      "integrity": "sha512-OaU1hHjgJf+b0NzsxCg7NdIYERD6Hy/PEmFLTjw+b65scuisG3Kt4QoTvJ66BBkPZ581gr0kpoVzKnxniM8nng=="
+    },
+    "es6-set": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/es6-set/-/es6-set-0.1.5.tgz",
+      "integrity": "sha1-0rPsXU2ADO2BjbU40ol02wpzzLE="
+    },
+    "es6-shim": {
+      "version": "0.35.3",
+      "resolved": "https://registry.npmjs.org/es6-shim/-/es6-shim-0.35.3.tgz",
+      "integrity": "sha1-m/tzY/7//4emzbbNk+QF7DxLbyY="
+    },
+    "es6-symbol": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.1.tgz",
+      "integrity": "sha1-vwDvT9q2uhtG7Le2KbTH7VcVzHc="
+    },
+    "es6-weak-map": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/es6-weak-map/-/es6-weak-map-2.0.2.tgz",
+      "integrity": "sha1-XjqzIlH/0VOKH45f+hNXdy+S2W8="
+    },
+    "escape-html": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
+      "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg="
+    },
+    "escape-string-regexp": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
+      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ="
+    },
+    "escodegen": {
+      "version": "1.9.0",
+      "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-1.9.0.tgz",
+      "integrity": "sha512-v0MYvNQ32bzwoG2OSFzWAkuahDQHK92JBN0pTAALJ4RIxEZe766QJPDR8Hqy7XNUy5K3fnVL76OqYAdc4TZEIw==",
+      "dependencies": {
+        "esprima": {
+          "version": "3.1.3",
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz",
+          "integrity": "sha1-/cpRzuYTOJXjyI1TXOSdv/YqRjM="
         },
-        "stringstream": {
-          "version": "0.0.5",
-          "bundled": true,
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=",
           "optional": true
+        }
+      }
+    },
+    "escope": {
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/escope/-/escope-3.6.0.tgz",
+      "integrity": "sha1-4Bl16BJ4GhY6ba392AOY3GTIicM="
+    },
+    "esprima": {
+      "version": "2.7.3",
+      "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz",
+      "integrity": "sha1-luO3DVd59q1JzQMmc9HDEnZ7pYE="
+    },
+    "esrecurse": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.2.0.tgz",
+      "integrity": "sha1-+pVo2Y04I/mkHZHpAtyrnqblsWM="
+    },
+    "estraverse": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-4.2.0.tgz",
+      "integrity": "sha1-De4/7TH81GlhjOc0IJn8GvoL2xM="
+    },
+    "esutils": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.2.tgz",
+      "integrity": "sha1-Cr9PHKpbyx96nYrMbepPqqBLrJs="
+    },
+    "etag": {
+      "version": "1.8.1",
+      "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz",
+      "integrity": "sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc="
+    },
+    "event-emitter": {
+      "version": "0.3.5",
+      "resolved": "https://registry.npmjs.org/event-emitter/-/event-emitter-0.3.5.tgz",
+      "integrity": "sha1-34xp7vFkeSPHFXuc6DhAYQsCzDk="
+    },
+    "eventemitter3": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-1.2.0.tgz",
+      "integrity": "sha1-HIaZHYFq0eUEdQ5zh0Ik7PO+xQg="
+    },
+    "events": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/events/-/events-1.1.1.tgz",
+      "integrity": "sha1-nr23Y1rQmccNzEwqH1AEKI6L2SQ="
+    },
+    "eventsource": {
+      "version": "0.1.6",
+      "resolved": "https://registry.npmjs.org/eventsource/-/eventsource-0.1.6.tgz",
+      "integrity": "sha1-Cs7ehJ7X3RzMMsgRuxG5RNTykjI="
+    },
+    "evp_bytestokey": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/evp_bytestokey/-/evp_bytestokey-1.0.3.tgz",
+      "integrity": "sha512-/f2Go4TognH/KvCISP7OUsHn85hT9nUkxxA9BEWxFn+Oj9o8ZNLm/40hdlgSLyuOimsrTKLUMEorQexp/aPQeA=="
+    },
+    "exec-sh": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/exec-sh/-/exec-sh-0.2.1.tgz",
+      "integrity": "sha512-aLt95pexaugVtQerpmE51+4QfWrNc304uez7jvj6fWnN8GeEHpttB8F36n8N7uVhUMbH/1enbxQ9HImZ4w/9qg=="
+    },
+    "execa": {
+      "version": "0.7.0",
+      "resolved": "https://registry.npmjs.org/execa/-/execa-0.7.0.tgz",
+      "integrity": "sha1-lEvs00zEHuMqY6n68nrVpl/Fl3c="
+    },
+    "exenv": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/exenv/-/exenv-1.2.2.tgz",
+      "integrity": "sha1-KueOhdmJQVhnCwPUe+wfA72Ru50="
+    },
+    "expand-braces": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/expand-braces/-/expand-braces-0.1.2.tgz",
+      "integrity": "sha1-SIsdHSRRyz06axks/AMPRMWFX+o=",
+      "dependencies": {
+        "array-unique": {
+          "version": "0.2.1",
+          "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
+          "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM="
         },
-        "strip-ansi": {
-          "version": "3.0.1",
-          "bundled": true
+        "braces": {
+          "version": "0.1.5",
+          "resolved": "https://registry.npmjs.org/braces/-/braces-0.1.5.tgz",
+          "integrity": "sha1-wIVxEIUpHYt1/ddOqw+FlygHEeY="
         },
-        "strip-json-comments": {
-          "version": "2.0.1",
-          "bundled": true,
-          "optional": true
+        "expand-range": {
+          "version": "0.1.1",
+          "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-0.1.1.tgz",
+          "integrity": "sha1-TLjtoJk8pW+k9B/ELzy7TMrf8EQ="
         },
-        "tar": {
-          "version": "2.2.1",
-          "bundled": true
+        "is-number": {
+          "version": "0.1.1",
+          "resolved": "https://registry.npmjs.org/is-number/-/is-number-0.1.1.tgz",
+          "integrity": "sha1-aaevEWlj1HIG7JvZtIoUIW8eOAY="
         },
-        "tar-pack": {
-          "version": "3.4.0",
-          "bundled": true,
-          "optional": true
+        "repeat-string": {
+          "version": "0.2.2",
+          "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-0.2.2.tgz",
+          "integrity": "sha1-x6jTI2BoNiBZp+RlH8aITosftK4="
+        }
+      }
+    },
+    "expand-brackets": {
+      "version": "2.1.4",
+      "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-2.1.4.tgz",
+      "integrity": "sha1-t3c14xXOMPa27/D4OwQVGiJEliI=",
+      "dependencies": {
+        "define-property": {
+          "version": "0.2.5",
+          "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
+          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY="
         },
-        "tough-cookie": {
-          "version": "2.3.2",
-          "bundled": true,
-          "optional": true
+        "is-descriptor": {
+          "version": "0.1.6",
+          "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
+          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
+        }
+      }
+    },
+    "expand-range": {
+      "version": "1.8.2",
+      "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz",
+      "integrity": "sha1-opnv/TNf4nIeuujiV+x5ZE/IUzc=",
+      "dependencies": {
+        "fill-range": {
+          "version": "2.2.3",
+          "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz",
+          "integrity": "sha1-ULd9/X5Gm8dJJHCWNpn+eoSFpyM="
         },
-        "tunnel-agent": {
-          "version": "0.6.0",
-          "bundled": true,
-          "optional": true
+        "is-number": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz",
+          "integrity": "sha1-Afy7s5NGOlSPL0ZszhbezknbkI8="
         },
-        "tweetnacl": {
-          "version": "0.14.5",
-          "bundled": true,
-          "optional": true
+        "isobject": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
+          "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk="
         },
-        "uid-number": {
-          "version": "0.0.6",
-          "bundled": true,
-          "optional": true
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+        }
+      }
+    },
+    "expect": {
+      "version": "21.2.1",
+      "resolved": "https://registry.npmjs.org/expect/-/expect-21.2.1.tgz",
+      "integrity": "sha512-orfQQqFRTX0jH7znRIGi8ZMR8kTNpXklTTz8+HGTpmTKZo3Occ6JNB5FXMb8cRuiiC/GyDqsr30zUa66ACYlYw=="
+    },
+    "express": {
+      "version": "4.16.1",
+      "resolved": "https://registry.npmjs.org/express/-/express-4.16.1.tgz",
+      "integrity": "sha512-STB7LZ4N0L+81FJHGla2oboUHTk4PaN1RsOkoRh9OSeEKylvF5hwKYVX1xCLFaCT7MD0BNG/gX2WFMLqY6EMBw==",
+      "dependencies": {
+        "accepts": {
+          "version": "1.3.4",
+          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.4.tgz",
+          "integrity": "sha1-hiRnWMfdbSGmR0/whKR0DsBesh8="
         },
-        "util-deprecate": {
-          "version": "1.0.2",
-          "bundled": true
+        "finalhandler": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.0.tgz",
+          "integrity": "sha1-zgtoVbRYU+eRsvzGgARtiCU91/U="
         },
-        "uuid": {
-          "version": "3.0.1",
-          "bundled": true,
-          "optional": true
+        "path-to-regexp": {
+          "version": "0.1.7",
+          "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
+          "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
         },
-        "verror": {
-          "version": "1.3.6",
-          "bundled": true,
-          "optional": true
+        "setprototypeof": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.0.tgz",
+          "integrity": "sha512-BvE/TwpZX4FXExxOxZyRGQQv651MSwmWKZGqvmPcRIjDqWub67kTKuIMx43cZZrS/cBBzwBcNDWoFxt2XEFIpQ=="
+        }
+      }
+    },
+    "extend": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz",
+      "integrity": "sha1-p1Xqe8Gt/MWjHOfnYtuq3F5jZEQ="
+    },
+    "extend-shallow": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+      "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8="
+    },
+    "extglob": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/extglob/-/extglob-2.0.2.tgz",
+      "integrity": "sha512-I0+eZBH+jFGL8F5BnIz2ON2nKCjTS3AS3H/5PeSmCp7UVC70Ym8IhdRiQly2juKYQ//f7z1aj1BRpQniFJoU1w=="
+    },
+    "extract-zip": {
+      "version": "1.6.5",
+      "resolved": "https://registry.npmjs.org/extract-zip/-/extract-zip-1.6.5.tgz",
+      "integrity": "sha1-maBnNbbqIOqbcF13ms/8yHz/BEA=",
+      "dependencies": {
+        "debug": {
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
-        "wide-align": {
-          "version": "1.1.2",
-          "bundled": true,
-          "optional": true
+        "mkdirp": {
+          "version": "0.5.0",
+          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.0.tgz",
+          "integrity": "sha1-HXMHam35hs2TROFecfzAWkyavxI="
         },
-        "wrappy": {
-          "version": "1.0.2",
-          "bundled": true
+        "ms": {
+          "version": "0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+        }
+      }
+    },
+    "extsprintf": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.3.0.tgz",
+      "integrity": "sha1-lpGEQOMEGnpBT4xS48V06zw+HgU="
+    },
+    "eyes": {
+      "version": "0.1.8",
+      "resolved": "https://registry.npmjs.org/eyes/-/eyes-0.1.8.tgz",
+      "integrity": "sha1-Ys8SAjTGg3hdkCNIqADvPgzCC8A="
+    },
+    "fast-deep-equal": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-1.0.0.tgz",
+      "integrity": "sha1-liVqO8l1WV6zbYLpkp0GDYk0Of8="
+    },
+    "fast-levenshtein": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
+      "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc="
+    },
+    "fast-memoize": {
+      "version": "2.2.8",
+      "resolved": "https://registry.npmjs.org/fast-memoize/-/fast-memoize-2.2.8.tgz",
+      "integrity": "sha512-3ppTC3fZ9Vwtjslx8DkhSIbI9PH1nM4pobuTHQINOxTxchG8n3SDGZ8L6jbatGJCGLKR+gbkNWKFN4E1iUROSA=="
+    },
+    "fastparse": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.1.tgz",
+      "integrity": "sha1-0eJkOzipTXWDtHkGDmxK/8lAcfg="
+    },
+    "faye-websocket": {
+      "version": "0.10.0",
+      "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz",
+      "integrity": "sha1-TkkvjQTftviQA1B/btvy1QHnxvQ="
+    },
+    "fb-watchman": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/fb-watchman/-/fb-watchman-2.0.0.tgz",
+      "integrity": "sha1-VOmr99+i8mzZsWNsWIwa/AXeXVg="
+    },
+    "fbjs": {
+      "version": "0.8.16",
+      "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.16.tgz",
+      "integrity": "sha1-XmdDL1UNxBtXK/VYR7ispk5TN9s=",
+      "dependencies": {
+        "core-js": {
+          "version": "1.2.7",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
+          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
+        }
+      }
+    },
+    "fd-slicer": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/fd-slicer/-/fd-slicer-1.0.1.tgz",
+      "integrity": "sha1-i1vL2ewyfFBBv5qwI/1nUPEXfmU="
+    },
+    "file-loader": {
+      "version": "0.11.1",
+      "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.11.1.tgz",
+      "integrity": "sha1-azKO4SNKcp5OR9Njdd1tNcDh24Q="
+    },
+    "filename-regex": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz",
+      "integrity": "sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY="
+    },
+    "fileset": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/fileset/-/fileset-2.0.3.tgz",
+      "integrity": "sha1-jnVIqW08wjJ+5eZ0FocjozO7oqA="
+    },
+    "filesize": {
+      "version": "3.5.10",
+      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.5.10.tgz",
+      "integrity": "sha1-/I+iPdtO+eXgq24eZPZ5okpWdh8="
+    },
+    "fill-range": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-4.0.0.tgz",
+      "integrity": "sha1-1USBHUKPmOsGpj3EAtJAPDKMOPc="
+    },
+    "finalhandler": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.6.tgz",
+      "integrity": "sha1-AHrqM9Gk0+QgF/YkhIrVjSEvgU8="
+    },
+    "find-cache-dir": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/find-cache-dir/-/find-cache-dir-1.0.0.tgz",
+      "integrity": "sha1-kojj6ePMN0hxfTnq3hfPcfww7m8="
+    },
+    "find-index": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
+      "integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ="
+    },
+    "find-replace": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/find-replace/-/find-replace-1.0.3.tgz",
+      "integrity": "sha1-uI5zZNLZyVlVnziMZmcNYTBEH6A=",
+      "dependencies": {
+        "array-back": {
+          "version": "1.0.4",
+          "resolved": "https://registry.npmjs.org/array-back/-/array-back-1.0.4.tgz",
+          "integrity": "sha1-ZEun8JX3/898Q7Xw3DnTwfA8Bjs="
         }
       }
     },
+    "find-up": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz",
+      "integrity": "sha1-RdG35QbHF93UgndaK3eSCjwMV6c="
+    },
+    "flatten": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz",
+      "integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I="
+    },
+    "follow-redirects": {
+      "version": "0.0.7",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-0.0.7.tgz",
+      "integrity": "sha1-NLkLqyqRGqNHVx2pDyK9NuzYqRk="
+    },
+    "for-in": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
+      "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA="
+    },
+    "for-own": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz",
+      "integrity": "sha1-UmXGgaTylNq78XyVCbZ2OqhFEM4="
+    },
+    "foreach": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/foreach/-/foreach-2.0.5.tgz",
+      "integrity": "sha1-C+4AUBiusmDQo6865ljdATbsG5k="
+    },
+    "forever-agent": {
+      "version": "0.6.1",
+      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
+      "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE="
+    },
+    "form-data": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.3.1.tgz",
+      "integrity": "sha1-b7lPvXGIUwbXPRXMSX/kzE7NRL8="
+    },
+    "formatio": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.2.0.tgz",
+      "integrity": "sha1-87IWfZBoxGmKjVH092CjmlTYGOs="
+    },
+    "forwarded": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.2.tgz",
+      "integrity": "sha1-mMI9qxF1ZXuMBXPozszZGw/xjIQ="
+    },
+    "fragment-cache": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/fragment-cache/-/fragment-cache-0.2.1.tgz",
+      "integrity": "sha1-QpD60n8T6Jvn8zeZxrxaCr//DRk="
+    },
+    "fresh": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz",
+      "integrity": "sha1-PYyt2Q2XZWn6g1qx+OSyOhBWBac="
+    },
+    "fs-extra": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-1.0.0.tgz",
+      "integrity": "sha1-zTzl9+fLYUWIP8rjGR6Yd/hYeVA="
+    },
+    "fs.realpath": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
+      "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
+    },
     "fstream": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
@@ -6201,9 +3473,9 @@
       "integrity": "sha1-CgAsyFcHGSp+eUbO7cERVfYOxzY="
     },
     "http-parser-js": {
-      "version": "0.4.8",
-      "resolved": "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.4.8.tgz",
-      "integrity": "sha512-jmHp99g6/fLx0pRNJqzsQgjsclCHAY7NhIeA3/U+bsGNvgbvUCQFQY9m5AYpqpAxY/2VcikfbKpjQozSTiz0jA=="
+      "version": "0.4.9",
+      "resolved": "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.4.9.tgz",
+      "integrity": "sha1-6hoE+2St/wJC6ZdPKX3Uw8rSceE="
     },
     "http-proxy": {
       "version": "1.16.2",
@@ -6327,9 +3599,9 @@
       "integrity": "sha512-rW/L/56ZMo9NStMK85kFrUFFGy4NeJbCdhfrDHIZrFfxYtuwuxD+dT3mWMcdmrNO61hllc60AeGglCRhfZ1dZw=="
     },
     "immutable": {
-      "version": "3.8.1",
-      "resolved": "https://registry.npmjs.org/immutable/-/immutable-3.8.1.tgz",
-      "integrity": "sha1-IAgH8Rqw9ycQ6khVQt4IgHX2jNI="
+      "version": "3.8.2",
+      "resolved": "https://registry.npmjs.org/immutable/-/immutable-3.8.2.tgz",
+      "integrity": "sha1-wkOZUUVbs5kT2vKBN28VMOEErfM="
     },
     "imurmurhash": {
       "version": "0.1.4",
@@ -6397,9 +3669,9 @@
       "integrity": "sha1-vd7XARQpCCjAoDnnLvJfWq7ENUo="
     },
     "ipaddr.js": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.4.0.tgz",
-      "integrity": "sha1-KWrKh4qCGBbluF0KKFqZvP9FgvA="
+      "version": "1.5.2",
+      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.5.2.tgz",
+      "integrity": "sha1-1LUFvemUaYfM8PxY2QEP+WB+P6A="
     },
     "is-absolute-url": {
       "version": "2.1.0",
@@ -6767,7 +4039,14 @@
     "istanbul-lib-source-maps": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/istanbul-lib-source-maps/-/istanbul-lib-source-maps-1.2.1.tgz",
-      "integrity": "sha512-mukVvSXCn9JQvdJl8wP/iPhqig0MRtuWuD4ZNKo6vB2Ik//AmhAKe3QnPN02dmkRe3lTudFk3rzoHhwU4hb94w=="
+      "integrity": "sha512-mukVvSXCn9JQvdJl8wP/iPhqig0MRtuWuD4ZNKo6vB2Ik//AmhAKe3QnPN02dmkRe3lTudFk3rzoHhwU4hb94w==",
+      "dependencies": {
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
+        }
+      }
     },
     "istanbul-reports": {
       "version": "1.1.2",
@@ -7292,6 +4571,11 @@
           "version": "3.10.1",
           "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
           "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         }
       }
     },
@@ -7304,6 +4588,11 @@
           "version": "3.10.1",
           "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
           "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         }
       }
     },
@@ -8064,9 +5353,9 @@
       "integrity": "sha1-j3YmTmMFedJSSu+yOzG/5OFeEOs="
     },
     "nise": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/nise/-/nise-1.1.0.tgz",
-      "integrity": "sha512-lIFidCxB0mJGyq1i33tLRNojtMoYX95EAI7WQEU+/ees0w6hvXZQHZ7WD130Tjeh5+YJAUVLfQ3k/s9EA8jj+w=="
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/nise/-/nise-1.1.1.tgz",
+      "integrity": "sha512-f5DMJB0MqBaSuP2NAwPx7HyVKPdaozds0KsNe9XIP3npKWt/QUg73l5TTLRTSwfG/Y3AB0ktacuxX4QNcg6vVw=="
     },
     "node-dir": {
       "version": "0.1.17",
@@ -8693,9 +5982,9 @@
       "integrity": "sha1-AerA/jta9xoqbAL+q7jB/vfgDqs="
     },
     "postcss": {
-      "version": "6.0.12",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.12.tgz",
-      "integrity": "sha512-K6SLofXEK43FBSyZ6/ExQV7ji24OEw4tEY6x1CAf7+tcoMWJoO24Rf3rVFVpk+5IQL1e1Cy3sTKfg7hXuLzafg=="
+      "version": "6.0.13",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.13.tgz",
+      "integrity": "sha512-nHsrD1PPTMSJDfU+osVsLtPkSP9YGeoOz4FDLN4r1DW4N5vqL1J+gACzTQHsfwIiWG/0/nV4yCzjTMo1zD8U1g=="
     },
     "postcss-calc": {
       "version": "5.3.1",
@@ -8725,9 +6014,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -8764,9 +6058,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -8803,9 +6102,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -8842,9 +6146,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -8881,9 +6190,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -8920,9 +6234,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -8959,9 +6278,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -8998,9 +6322,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -9037,9 +6366,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -9101,9 +6435,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -9140,9 +6479,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -9161,6 +6505,11 @@
           "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
           "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
         },
+        "browserslist": {
+          "version": "1.7.7",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
+          "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -9179,9 +6528,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -9223,9 +6577,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -9262,9 +6621,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -9301,9 +6665,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -9340,9 +6709,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -9404,9 +6778,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -9443,9 +6822,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -9482,9 +6866,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -9521,9 +6910,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -9560,9 +6954,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -9599,9 +6998,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -9643,9 +7047,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -9682,9 +7091,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -9726,9 +7140,14 @@
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
         "postcss": {
-          "version": "5.2.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.17.tgz",
-          "integrity": "sha1-z09Ze4ZNZcikkrLqvp1wbIecOIs="
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
         "supports-color": {
           "version": "3.2.3",
@@ -9805,9 +7224,9 @@
       "integrity": "sha1-zq8IMCL8RrSjX2nhPvda7Q1jmFY="
     },
     "proxy-addr": {
-      "version": "1.1.5",
-      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-1.1.5.tgz",
-      "integrity": "sha1-ccDuOxAt4/IC87ZPYI0XP8uhqRg="
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.2.tgz",
+      "integrity": "sha1-ZXFQT0e7mI7IGAJT+F3X4UlSvew="
     },
     "prr": {
       "version": "0.0.0",
@@ -9942,11 +7361,6 @@
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-15.6.2.tgz",
       "integrity": "sha1-Qc+t9pO3V/rycIRDodH9WgK+9zA="
     },
-    "react-dom-factories": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/react-dom-factories/-/react-dom-factories-1.0.2.tgz",
-      "integrity": "sha1-63cFxNs2+1AbOqOP91lhaqD/luA="
-    },
     "react-highlight": {
       "version": "0.9.0",
       "resolved": "https://registry.npmjs.org/react-highlight/-/react-highlight-0.9.0.tgz",
@@ -9985,9 +7399,9 @@
       "integrity": "sha1-uWRzgBSptK7klKg8C1uDPWYHKpA="
     },
     "react-modal": {
-      "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-2.3.2.tgz",
-      "integrity": "sha512-m+urZGPk+RfUrGj0b8uraZ2dQQo/AABZ+s6aZeZxEpbhMwWZ4WhVr03iYbWTvSatSnC+5x9c2k6qm95N1ybohg=="
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-2.3.3.tgz",
+      "integrity": "sha512-8iBidx7rKKg65XgOqrmy2oEr0rj5wd/w3et4Y3oef7903A15pOVW8fg2H9KlcDNcaqKw/CpBIE2Kc8vcVwoqOA=="
     },
     "react-remarkable": {
       "version": "1.1.2",
@@ -10070,6 +7484,11 @@
           "version": "4.0.0",
           "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.0.tgz",
           "integrity": "sha512-oftTcaMu/EGrEIu904mWteKIv8vMuOgGYo7EhVJJN00R/EED9DCua/xxHRdYnKtcECzVg7xOWhflvJMnqcFZjw=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         }
       }
     },
@@ -10272,9 +7691,9 @@
       "integrity": "sha512-kKvNJn6Mm93gAczWVJg7wH+wGYWNrDHdWvpUmHyEsgCtIwwo3bqPtV4tR5tuPaUhTOo/kvhVwd8XwwOllGYkbg=="
     },
     "samsam": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.2.1.tgz",
-      "integrity": "sha1-7dOQk6MYQ3DLhZJDsr3yVefY6mc="
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.3.0.tgz",
+      "integrity": "sha512-1HwIYD/8UlOtFS3QO3w7ey+SdSDFE4HRNLZoZRYVQefrOY3l17epswImeB1ijgJFQJodIaHcwkp3r/myBjFVbg=="
     },
     "sane": {
       "version": "2.2.0",
@@ -10891,9 +8310,9 @@
       "integrity": "sha512-/flfGfIxIRXSvZBHJzIf3iAyGYkmMQq6SQjA0cx9SOuVuq+4ZPPO4LJtH1Ce0Lznax1KSG1U6Dad85wIcSW19w==",
       "dependencies": {
         "lolex": {
-          "version": "2.1.2",
-          "resolved": "https://registry.npmjs.org/lolex/-/lolex-2.1.2.tgz",
-          "integrity": "sha1-JpS5U8nqTQE+W4v7qJHJkQJbJik="
+          "version": "2.1.3",
+          "resolved": "https://registry.npmjs.org/lolex/-/lolex-2.1.3.tgz",
+          "integrity": "sha512-BdHq78SeI+6PAUtl4atDuCt7L6E4fab3mSRtqxm4ywaXe4uP7jZ0TTcFNuU20syUjxZc2l7jFqKVMJ+AX0LnpQ=="
         }
       }
     },
@@ -10921,6 +8340,11 @@
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
           "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         }
       }
     },
@@ -11064,9 +8488,9 @@
       "integrity": "sha512-I2UmuJSRr/T8jisiROLU3A3ltr+swpniSmNPI4Ml3ZCX6tVnDsuZzK7F2hl5jTqbZBWCEKlj5HRQiPExXLgE8A=="
     },
     "source-map": {
-      "version": "0.5.7",
-      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
-      "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
+      "version": "0.6.1",
+      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+      "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g=="
     },
     "source-map-loader": {
       "version": "0.2.2",
@@ -11098,7 +8522,14 @@
     "source-map-support": {
       "version": "0.4.18",
       "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.4.18.tgz",
-      "integrity": "sha512-try0/JqxPLF9nOjvSta7tVondkP5dwgyLDjVoyMDlmjugT2lRZ1OfsrYTkCd2hkDnJTKRbO/Rl3orm8vlsUzbA=="
+      "integrity": "sha512-try0/JqxPLF9nOjvSta7tVondkP5dwgyLDjVoyMDlmjugT2lRZ1OfsrYTkCd2hkDnJTKRbO/Rl3orm8vlsUzbA==",
+      "dependencies": {
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
+        }
+      }
     },
     "source-map-url": {
       "version": "0.4.0",
@@ -11647,9 +9078,9 @@
       "integrity": "sha1-hR+1BSAcY9A0PFFybmNk9+mtLpk="
     },
     "tsutils": {
-      "version": "2.11.1",
-      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.11.1.tgz",
-      "integrity": "sha1-ED3/P6UIr/VknBbcTm3UXcQdvGI="
+      "version": "2.11.2",
+      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.11.2.tgz",
+      "integrity": "sha1-YBNgHjb6FP+VhBPlQdQn+4xqw0E="
     },
     "tty-browserify": {
       "version": "0.0.0",
@@ -11707,6 +9138,11 @@
       "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.8.29.tgz",
       "integrity": "sha1-KcVzMUgFe7Th913zW3qcty5qWd0=",
       "dependencies": {
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
+        },
         "yargs": {
           "version": "3.10.0",
           "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
@@ -11723,7 +9159,14 @@
     "uglifyjs-webpack-plugin": {
       "version": "0.4.6",
       "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-0.4.6.tgz",
-      "integrity": "sha1-uVH0q7a9YX5m9j64kUmOORdj4wk="
+      "integrity": "sha1-uVH0q7a9YX5m9j64kUmOORdj4wk=",
+      "dependencies": {
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
+        }
+      }
     },
     "ultron": {
       "version": "1.0.2",
@@ -12044,6 +9487,11 @@
           "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-2.0.0.tgz",
           "integrity": "sha1-a3KoBImE4MQeeVEP1en6mbO1Sb4="
         },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
+        },
         "strip-bom": {
           "version": "3.0.0",
           "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
@@ -12143,7 +9591,14 @@
     "webpack-sources": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-1.0.1.tgz",
-      "integrity": "sha512-05tMxipUCwHqYaVS8xc7sYPTly8PzXayRCB4dTxLhWTqlKUiwH6ezmEe0OSreL1c30LAuA3Zqmc+uEBUGFJDjw=="
+      "integrity": "sha512-05tMxipUCwHqYaVS8xc7sYPTly8PzXayRCB4dTxLhWTqlKUiwH6ezmEe0OSreL1c30LAuA3Zqmc+uEBUGFJDjw==",
+      "dependencies": {
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
+        }
+      }
     },
     "websocket-driver": {
       "version": "0.7.0",
@@ -12385,4 +9840,4 @@
       "integrity": "sha1-AI4G2AlDIMNy28L47XagymyKxBk="
     }
   }
-}
+}
\ No newline at end of file
diff --git a/packages/experiments/jest.config.js b/packages/experiments/jest.config.js
index ffb2cd8b04514..8132ae9861d75 100644
--- a/packages/experiments/jest.config.js
+++ b/packages/experiments/jest.config.js
@@ -1,3 +1,10 @@
 let { createConfig } = require('../../scripts/tasks/jest-resources');
+let path = require('path');
 
-module.exports = createConfig();
\ No newline at end of file
+const config = createConfig({
+  setupFiles: [
+    path.resolve(__dirname, 'lib/common/tests.js')
+  ]
+});
+
+module.exports = config;
\ No newline at end of file
diff --git a/packages/experiments/src/common/tests.ts b/packages/experiments/src/common/tests.ts
index d50df24446d90..787104afb3ea5 100644
--- a/packages/experiments/src/common/tests.ts
+++ b/packages/experiments/src/common/tests.ts
@@ -1,22 +1,8 @@
-// Polyfills
-import 'es6-weak-map/implement';
-import 'es6-map/implement';
+/** Jest test setup file. */
 
-/**
- * This is a test entry point to help karma-webpack find all tests in the project.
- **/
+import { setIconOptions } from 'office-ui-fabric-react/lib/Styling';
 
-import { initializeIcons } from '@uifabric/icons/lib/index';
-
-console.log('initializing icons');
-initializeIcons('dist/');
-
-// Before loading modules, treat errors and warnings as test failures.
-console.error = console.warn = (warning: string) => {
-  throw new Error(warning);
-};
-
-const testContext = require.context('..', true, /.+\.test\.js?$/);
-
-testContext.keys().forEach(testContext);
-module.exports = testContext;
+// Suppress icon warnings.
+setIconOptions({
+  warnOnMissingIcons: false
+});
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.test.tsx b/packages/experiments/src/components/CommandBar/CommandBar.test.tsx
index eab601b976d9d..deaa3f856111d 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.test.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBar.test.tsx
@@ -5,10 +5,6 @@ import * as React from 'react';
 import { CommandBar } from './CommandBar';
 import * as renderer from 'react-test-renderer';
 import { mount } from 'enzyme';
-import { setIconOptions } from 'office-ui-fabric-react/lib/Styling';
-
-// Disable icon warnings.
-setIconOptions({ warnOnMissingIcons: false });
 
 describe('CommandBar', () => {
 
diff --git a/packages/office-ui-fabric-react/jest.config.js b/packages/office-ui-fabric-react/jest.config.js
index a92c71220a900..8132ae9861d75 100644
--- a/packages/office-ui-fabric-react/jest.config.js
+++ b/packages/office-ui-fabric-react/jest.config.js
@@ -1,3 +1,10 @@
 let { createConfig } = require('../../scripts/tasks/jest-resources');
+let path = require('path');
 
-module.exports = createConfig();
+const config = createConfig({
+  setupFiles: [
+    path.resolve(__dirname, 'lib/common/tests.js')
+  ]
+});
+
+module.exports = config;
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 8437c8005756a..f2811a959744c 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -21,7 +21,6 @@
     "@types/jest": "21.1.0",
     "@types/prop-types": "15.5.1",
     "@types/react": "15.0.38",
-    "@types/react-addons-test-utils": "0.14.18",
     "@types/react-dom": "15.5.5",
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
@@ -35,7 +34,6 @@
     "office-ui-fabric-core": ">=7.1.2 <8.0.0",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
     "react": "^15.6.1",
-    "react-addons-test-utils": "^15.4.2",
     "react-dom": "^15.6.1",
     "react-highlight": "0.9.0",
     "react-test-renderer": "^15.6.1",
diff --git a/packages/office-ui-fabric-react/src/common/BaseStore.test.ts b/packages/office-ui-fabric-react/src/common/BaseStore.test.ts
deleted file mode 100644
index ac854f8e437a2..0000000000000
--- a/packages/office-ui-fabric-react/src/common/BaseStore.test.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-import { BaseStore } from './BaseStore';
-
-class TestStore extends BaseStore {
-  public doThings() {
-    this.emitChange();
-  }
-}
-
-describe('BaseStore', () => {
-  it('can emit changes', () => {
-    let test = new TestStore();
-    let hasChanged = false;
-
-    test.subscribe(() => hasChanged = true);
-    test.doThings();
-
-    expect(hasChanged).toBe(true);
-  });
-
-  it('can unsubscribe', () => {
-    let test = new TestStore();
-    let hasChanged = false;
-    let disposable = test.subscribe(() => hasChanged = true);
-
-    disposable.dispose();
-    test.doThings();
-
-    expect(hasChanged).toBe(false);
-  });
-
-});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/common/BaseStore.ts b/packages/office-ui-fabric-react/src/common/BaseStore.ts
deleted file mode 100644
index bdae6663892d5..0000000000000
--- a/packages/office-ui-fabric-react/src/common/BaseStore.ts
+++ /dev/null
@@ -1,30 +0,0 @@
-import { ISubscribable } from './ISubscribable';
-import { IDisposable } from '../Utilities';
-
-let _instanceId = 0;
-
-export class BaseStore implements ISubscribable {
-  private _callbacks: {
-    [key: string]: () => void;
-  };
-
-  constructor() {
-    this._callbacks = {};
-  }
-
-  public subscribe(onChange: () => void): IDisposable {
-    let id = _instanceId++;
-
-    this._callbacks[id] = onChange;
-
-    return { dispose: () => delete this._callbacks[id] };
-  }
-
-  protected emitChange() {
-    for (let id in this._callbacks) {
-      if (this._callbacks.hasOwnProperty(id)) {
-        this._callbacks[id]();
-      }
-    }
-  }
-}
diff --git a/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx b/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx
deleted file mode 100644
index 747f188fc1002..0000000000000
--- a/packages/office-ui-fabric-react/src/common/ConnectedHost.tsx
+++ /dev/null
@@ -1,130 +0,0 @@
-import * as React from 'react';
-import * as PropTypes from 'prop-types';
-import { ISubscribable } from './ISubscribable';
-import { BaseComponent, autobind, assign, shallowCompare } from '../Utilities';
-import { IStoreKey } from './storeKey';
-import { StoreSet } from './StoreSet';
-
-// Track all components that require changes.
-let _changedComponents: ConnectedHost[] | null;
-
-export interface IConnectedHostProps {
-  componentRef?: () => void;
-  componentProps: any;
-  storesToSubscribe: IStoreKey[];
-  component: any;
-  getProps: (stores: any, props: any) => any;
-}
-
-export interface IConnectedHostState {
-  props: any;
-}
-
-export class ConnectedHost extends BaseComponent<IConnectedHostProps, IConnectedHostState> {
-  public static contextTypes = {
-    stores: PropTypes.object
-  };
-
-  public context: {
-    stores: StoreSet;
-  };
-
-  private _stores: ISubscribable[];
-  private _changeEnqueued: boolean;
-  private _isMounted: boolean;
-
-  constructor(props: IConnectedHostProps) {
-    super(props);
-
-    this.state = {
-      props: null
-    };
-  }
-
-  public componentWillMount() {
-    if (this.props.storesToSubscribe && this.props.storesToSubscribe.length > 0) {
-      if (!this.context.stores) {
-        throw `A connected component was hosted in an environment where no stores were hosted. Use the StoreHost to host components.`;
-      }
-
-      // Resolve and subscribe to stores.
-      this._stores = this.props.storesToSubscribe.map(storeKey => {
-        let store = this.context.stores.getStore(storeKey);
-
-        if (!store) {
-          throw `The "${storeKey.name}" store was required by a connected component, but not exposed.`;
-        }
-        this._disposables.push(store.subscribe(this._onStoreChanged));
-
-        return store;
-      });
-    }
-
-    // We can only initialize state at this point, where context has been resolved.
-    this.state = {
-      props: this._getComponentProps(this.props)
-    };
-  }
-
-  public componentDidMount() {
-    this._isMounted = true;
-  }
-
-  public componentWillUnmount() {
-    this._isMounted = false;
-  }
-
-  public componentWillReceiveProps(newProps: IConnectedHostProps) {
-    this._updateProps(newProps);
-  }
-
-  public shouldComponentUpdate(newProps: IConnectedHostProps, newState: IConnectedHostState) {
-    let inputPropsHaveChanged = !shallowCompare(this.props.componentProps, newProps.componentProps);
-    let computedPropsHaveChanged = !shallowCompare(this.state.props, newState.props);
-    let shouldUpdate = inputPropsHaveChanged || computedPropsHaveChanged;
-
-    return shouldUpdate;
-  }
-
-  public render() {
-    let { component: Component } = this.props;
-    let { props } = this.state;
-
-    return props ? <Component { ...props } /> : null;
-  }
-
-  @autobind
-  private _onStoreChanged() {
-    let { storesToSubscribe } = this.props;
-
-    if (!storesToSubscribe || storesToSubscribe.length < 2) {
-      this._updateProps();
-    } else if (!this._changeEnqueued) {
-      if (!_changedComponents) {
-        _changedComponents = [];
-        this._async.setImmediate(() => {
-          _changedComponents!.forEach(comp => comp._updateProps());
-          _changedComponents = null;
-        });
-      }
-      _changedComponents.push(this);
-      this._changeEnqueued = true;
-    }
-  }
-
-  @autobind
-  private _updateProps(props?: any) {
-    this._changeEnqueued = false;
-    props = this._getComponentProps(props || this.props);
-    this.setState({ props });
-  }
-
-  private _getComponentProps(props: any) {
-    let newProps = assign(
-      {},
-      props.componentProps,
-      props.getProps(props.componentProps, ...this._stores));
-
-    return newProps;
-  }
-}
diff --git a/packages/office-ui-fabric-react/src/common/ISubscribable.ts b/packages/office-ui-fabric-react/src/common/ISubscribable.ts
deleted file mode 100644
index 92872b94ee44f..0000000000000
--- a/packages/office-ui-fabric-react/src/common/ISubscribable.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import { IDisposable } from '../Utilities';
-
-export interface IEmptyFunction {
-  (): void;
-}
-
-export interface ISubscribable {
-  subscribe: (onChange?: IEmptyFunction) => IDisposable;
-}
diff --git a/packages/office-ui-fabric-react/src/common/StoreHost.tsx b/packages/office-ui-fabric-react/src/common/StoreHost.tsx
deleted file mode 100644
index 468b879018da7..0000000000000
--- a/packages/office-ui-fabric-react/src/common/StoreHost.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import * as React from 'react';
-import * as PropTypes from 'prop-types';
-import { StoreSet } from './StoreSet';
-import { BaseComponent } from '../Utilities';
-
-export interface IStoreHostProps extends React.Props<StoreHost> {
-  componentRef?: () => void;
-  stores?: StoreSet;
-}
-
-export interface IStoreHostContext {
-  stores?: StoreSet;
-}
-
-export class StoreHost extends BaseComponent<IStoreHostProps, {}> {
-  public static contextTypes = {
-    stores: PropTypes.object
-  };
-
-  public static childContextTypes = {
-    stores: PropTypes.object
-  };
-
-  public context: IStoreHostContext;
-
-  public getChildContext(): IStoreHostContext {
-    let { stores: parentStores } = this.context;
-    let { stores: currentStores } = this.props;
-
-    return { stores: parentStores ? parentStores.merge(currentStores!) : currentStores };
-  }
-
-  public render() {
-    return React.Children.only(this.props.children);
-  }
-}
diff --git a/packages/office-ui-fabric-react/src/common/StoreSet.ts b/packages/office-ui-fabric-react/src/common/StoreSet.ts
deleted file mode 100644
index da821ae6b3f4a..0000000000000
--- a/packages/office-ui-fabric-react/src/common/StoreSet.ts
+++ /dev/null
@@ -1,30 +0,0 @@
-import { IStoreKey } from './storeKey';
-import { ISubscribable } from './ISubscribable';
-import { assign } from '../Utilities';
-
-export class StoreSet {
-  private _stores: {
-    [key: string]: any;
-  };
-
-  constructor() {
-    this._stores = {};
-  }
-
-  public add<T extends ISubscribable>(key: IStoreKey, value: T): StoreSet {
-    this._stores[key.id] = value;
-    return this;
-  }
-
-  public getStore<T extends ISubscribable>(key: IStoreKey): T {
-    return this._stores[key.id];
-  }
-
-  public merge(stores: StoreSet) {
-    let mergedStoreSet = new StoreSet();
-
-    mergedStoreSet._stores = assign({}, this._stores, stores);
-
-    return mergedStoreSet;
-  }
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/common/connect.test.tsx b/packages/office-ui-fabric-react/src/common/connect.test.tsx
deleted file mode 100644
index 81105f8d7dd7a..0000000000000
--- a/packages/office-ui-fabric-react/src/common/connect.test.tsx
+++ /dev/null
@@ -1,168 +0,0 @@
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-/* tslint:enable:no-unused-variable */
-import * as ReactDOM from 'react-dom';
-
-import * as ReactTestUtils from 'react-dom/test-utils';
-import { connect } from './connect';
-import { BaseStore } from './BaseStore';
-import { StoreHost } from './StoreHost';
-import { StoreSet } from './StoreSet';
-import { storeKey } from './storeKey';
-import { ISubscribable } from './ISubscribable';
-
-interface ITestComponentProps extends React.HTMLAttributes<HTMLDivElement> { }
-
-// Dumb component.
-const TestComponent = (props: ITestComponentProps) => (
-  <div { ...props } />
-);
-
-// Dumb store.
-interface IHelloStore extends ISubscribable {
-  message: string;
-
-  say(message: string): void;
-}
-
-class HelloStore extends BaseStore implements IHelloStore {
-  public message: string = '';
-
-  public say(message: string) {
-    this.message = message;
-    this.emitChange();
-  }
-}
-
-describe('connect', () => {
-  it('can observe store changes', (done) => {
-    let hello1 = storeKey('hello1');
-    let hello2 = storeKey('hello2');
-    let localStores = new StoreSet()
-      .add(hello1, new HelloStore())
-      .add(hello2, new HelloStore());
-
-    let Connected = connect<ITestComponentProps, {}>(
-      TestComponent,
-      [hello1, hello2],
-      (props: ITestComponentProps, hello1Store: IHelloStore, hello2Store: IHelloStore) => ({
-        children: hello1Store.message + hello2Store.message
-      })
-    );
-    let root = ReactTestUtils.renderIntoDocument(
-      <div>
-        <StoreHost stores={ localStores }>
-          <Connected />
-        </StoreHost>
-      </div>
-    );
-    let rootElement = ReactDOM.findDOMNode(root as React.ReactInstance);
-
-    expect(rootElement.textContent).toEqual('');
-
-    localStores.getStore<IHelloStore>(hello1).say('hello');
-    setTimeout(() => {
-      try {
-        expect(rootElement.textContent).toEqual('hello');
-        localStores.getStore<IHelloStore>(hello2).say(' world');
-
-        setTimeout(() => {
-          try {
-            expect(rootElement.textContent).toEqual('hello world');
-            done();
-          } catch (e) { done(e); }
-        }, 10);
-
-      } catch (e) { done(e); }
-    }, 10);
-
-  });
-
-  it('can throw when requiring a store in an environment without any stores hosted', () => {
-    let hello = storeKey('hello');
-    let Connected = connect<ITestComponentProps, {}>(
-      TestComponent,
-      [hello],
-      () => ({ /* empty */ })
-    );
-    let threwException = false;
-
-    try {
-      ReactTestUtils.renderIntoDocument(
-        <div>
-          <Connected />
-        </div>
-      );
-    } catch (e) { threwException = true; }
-
-    expect(threwException).toEqual(true);
-  });
-
-  it('can throw in an environment that does not contain the required store', () => {
-    let hello = storeKey('hello');
-    let Connected = connect<ITestComponentProps, {}>(
-      TestComponent,
-      [hello],
-      () => ({ /* empty */ })
-    );
-    let threwException = false;
-
-    try {
-      ReactTestUtils.renderIntoDocument(
-        <StoreHost stores={ new StoreSet() }>
-          <div>
-            <Connected />
-          </div>
-        </StoreHost>
-      );
-    } catch (e) { threwException = true; }
-
-    expect(threwException).toEqual(true);
-  });
-
-  it('renders a connected component 1 time when multiple stores fire changes', (done) => {
-    let resolves = 0;
-    let renders = 0;
-
-    const Dumb = () => {
-      renders++;
-      return <div>hi</div>;
-    };
-
-    let hello1 = storeKey('hello1');
-    let hello2 = storeKey('hello2');
-    let localStores = new StoreSet()
-      .add(hello1, new HelloStore())
-      .add(hello2, new HelloStore());
-    let Connected = connect(
-      Dumb,
-      [hello1, hello2],
-      () => {
-        resolves++;
-        return {};
-      });
-
-    ReactTestUtils.renderIntoDocument(
-      <div>
-        <StoreHost stores={ localStores }>
-          <Connected />
-        </StoreHost>
-      </div>
-    );
-
-    expect(resolves).toEqual(1);
-    expect(renders).toEqual(1);
-
-    // Cause 2 store changes. This should setImmediate and cause 1 resolve.
-    localStores.getStore<IHelloStore>(hello1).say('hello');
-    localStores.getStore<IHelloStore>(hello2).say(' world');
-
-    setTimeout(() => {
-      try {
-        expect(resolves).toEqual(2);
-        expect(renders).toEqual(1);
-        done();
-      } catch (e) { done(e); }
-    }, 10);
-  });
-});
diff --git a/packages/office-ui-fabric-react/src/common/connect.tsx b/packages/office-ui-fabric-react/src/common/connect.tsx
deleted file mode 100644
index 6a7204d6f4b90..0000000000000
--- a/packages/office-ui-fabric-react/src/common/connect.tsx
+++ /dev/null
@@ -1,19 +0,0 @@
-import * as React from 'react';
-import { ConnectedHost } from './ConnectedHost';
-import { IStoreKey } from './storeKey';
-
-export function connect<ORIGINAL_PROPS, NEW_PROPS>(
-  component: React.ComponentClass<ORIGINAL_PROPS> | React.StatelessComponent<ORIGINAL_PROPS>,
-  storesToSubscribe: IStoreKey[],
-  getProps: (props: ORIGINAL_PROPS, ...stores: any[]) => NEW_PROPS
-): React.StatelessComponent<NEW_PROPS> {
-
-  return (props: NEW_PROPS) => (
-    <ConnectedHost
-      component={ component }
-      componentProps={ props }
-      getProps={ getProps }
-      storesToSubscribe={ storesToSubscribe }
-    />
-  );
-}
diff --git a/packages/office-ui-fabric-react/src/common/storeKey.ts b/packages/office-ui-fabric-react/src/common/storeKey.ts
deleted file mode 100644
index 4e07a7c63f9de..0000000000000
--- a/packages/office-ui-fabric-react/src/common/storeKey.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-import { getId } from '../Utilities';
-
-export interface IStoreKey {
-  name: string;
-  id: string;
-}
-
-/**
- * Store keys are a very simple abstraction that maps a string name to an interface type.
- * The enables a type-safe contract for store dependencies when you connect dumb components
- * to stores.
- *
- * @example
- * let selectionKey = storeKey<ISelection>('selection');
- *
- * let stores = new StoreSet()
- *   .add(selectionKey, new Selection());
- *
- * <StoreHost stores={ stores }>
- *   ...
- * </StoreHost>
- *
- * connect(DumbComponent, [ selectionKey ], (props, selection) => ({
- *   isSelected: selection.getSelected(props.item.key)
- * });
- *
- * Note that the "selection" reference in the connect callback would be of type ISelection due
- * to the selectionKey reference, and you will get TypeScript errors by referring to selection
- * member that aren't in that interface.
- */
-export const storeKey = (name: string) => ({ name, id: getId(name) }) as IStoreKey;
diff --git a/packages/office-ui-fabric-react/src/common/tests.ts b/packages/office-ui-fabric-react/src/common/tests.ts
index d95d963745d8b..c3545a6dde164 100644
--- a/packages/office-ui-fabric-react/src/common/tests.ts
+++ b/packages/office-ui-fabric-react/src/common/tests.ts
@@ -1,21 +1,8 @@
-// Polyfills
-import 'es6-weak-map/implement';
-import 'es6-map/implement';
+/** Jest test setup file. */
 
-import { initializeIcons } from '@uifabric/icons/lib/index';
-console.log('initializing icons');
-initializeIcons('dist/');
+import { setIconOptions } from '@uifabric/styling';
 
-/**
- * This is a test entry point to help karma-webpack find all tests in the project.
- **/
-
-// Before loading modules, treat errors and warnings as test failures.
-console.error = console.warn = (warning: string) => {
-  throw new Error(warning);
-};
-
-const testContext = require.context('..', true, /.+\.test\.js?$/);
-
-testContext.keys().forEach(testContext);
-module.exports = testContext;
+// Suppress icon warnings.
+setIconOptions({
+  warnOnMissingIcons: false
+});
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
index 1ec4551d1782f..652537c01154a 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
@@ -36,11 +36,9 @@ describe('FocusZone', () => {
       width: clientRect.right - clientRect.left,
       height: clientRect.bottom - clientRect.top
     });
-    if (isVisible) {
-      (element as any).isVisible = isVisible;
-    } else {
-      (element as any).hidden = !isVisible;
-    }
+
+    element.setAttribute('data-is-visible', String(isVisible));
+
     element.focus = () => ReactTestUtils.Simulate.focus(element);
   }
 
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 6a9d1751e6748..55dc92af4d2f1 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -24,13 +24,11 @@
     "@types/enzyme": "2.8.8",
     "@types/prop-types": "15.5.1",
     "@types/react": "15.0.38",
-    "@types/react-addons-test-utils": "0.14.18",
     "@types/react-dom": "15.5.1",
     "@types/sinon": "2.2.2",
     "enzyme": "^2.9.1",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
     "react": "^15.6.1",
-    "react-addons-test-utils": "^15.4.2",
     "react-dom": "^15.6.1",
     "sinon": "^2.3.2"
   },
diff --git a/packages/utilities/src/BaseComponent.test.tsx b/packages/utilities/src/BaseComponent.test.tsx
index eb28d3f7d8715..b20e4f6291909 100644
--- a/packages/utilities/src/BaseComponent.test.tsx
+++ b/packages/utilities/src/BaseComponent.test.tsx
@@ -2,7 +2,7 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
-import * as ReactTestUtils from 'react-addons-test-utils';
+import * as ReactTestUtils from 'react-dom/test-utils';
 import { BaseComponent } from './BaseComponent';
 
 let _originalOnError = BaseComponent.onError;
diff --git a/packages/utilities/src/focus.test.tsx b/packages/utilities/src/focus.test.tsx
index 1bf2ce94e1896..67505802abb8b 100644
--- a/packages/utilities/src/focus.test.tsx
+++ b/packages/utilities/src/focus.test.tsx
@@ -2,7 +2,7 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import * as ReactDOM from 'react-dom';
-import * as ReactTestUtils from 'react-addons-test-utils';
+import * as ReactTestUtils from 'react-dom/test-utils';
 import { isElementVisible, isElementTabbable } from './focus';
 
 let _hiddenElement: HTMLElement | undefined;
diff --git a/scripts/tasks/jest-disable-warnings.js b/scripts/tasks/jest-disable-warnings.js
new file mode 100644
index 0000000000000..ee06bb448e170
--- /dev/null
+++ b/scripts/tasks/jest-disable-warnings.js
@@ -0,0 +1,4 @@
+// Fail on warnings.
+console.warn = (message) => {
+  throw new Error(message);
+};
\ No newline at end of file
diff --git a/scripts/tasks/jest-resources.js b/scripts/tasks/jest-resources.js
index 4c28cdf3a570b..82e01aae4fc92 100644
--- a/scripts/tasks/jest-resources.js
+++ b/scripts/tasks/jest-resources.js
@@ -1,4 +1,5 @@
 const path = require('path');
+const merge = require('./merge');
 
 const styleMockPath =
   module.exports = {
@@ -8,7 +9,7 @@ const styleMockPath =
         'testRegex': '(/__tests__/.*|\\.(test|spec))\\.js$',
       }
     ),
-    createConfig: () => (
+    createConfig: (customConfig) => merge(
       {
         moduleNameMapper: {
           'ts-jest': path.resolve(__dirname, '../node_modules/ts-jest'),
@@ -33,6 +34,10 @@ const styleMockPath =
           'json'
         ],
 
+        'setupFiles': [
+          path.resolve(__dirname, './jest-disable-warnings.js')
+        ],
+
         'moduleDirectories': [
           'node_modules',
           path.resolve(process.cwd(), 'node_modules'),
@@ -43,5 +48,5 @@ const styleMockPath =
           path.resolve(__dirname, 'jest-serializer-merge-styles')
         ]
 
-      })
+      }, customConfig)
   };
diff --git a/scripts/tasks/jest.js b/scripts/tasks/jest.js
index 063afc7cd9814..e25c61984361b 100644
--- a/scripts/tasks/jest.js
+++ b/scripts/tasks/jest.js
@@ -8,6 +8,7 @@ module.exports = function (options) {
 
   if (fs.existsSync(jestConfigPath)) {
     const jestPath = path.resolve(__dirname, '../node_modules/jest/bin/jest');
+    const customArgs = options.argv.slice(3).join(' ');
 
     const args = [
       // Specify the config file.
@@ -23,7 +24,7 @@ module.exports = function (options) {
       options.args
     ].filter(arg => !!arg).join(' ');
 
-    const command = `node ${jestPath} ${args}`;
+    const command = `node ${jestPath} ${args} ${customArgs}`;
 
     execSync(command, undefined, path.dirname(jestConfigPath));
   }
diff --git a/scripts/tasks/merge.js b/scripts/tasks/merge.js
new file mode 100644
index 0000000000000..5332ddc7b53ca
--- /dev/null
+++ b/scripts/tasks/merge.js
@@ -0,0 +1,18 @@
+module.exports = function merge(obj1, obj2) {
+  const merged = Object.assign({}, obj1);
+
+  for (prop in obj2) {
+    const sourceValue = obj2[prop];
+    const targetValue = obj1[prop];
+
+    if (sourceValue && Array.isArray(sourceValue) && targetValue && Array.isArray(targetValue)) {
+      merged[prop] = targetValue.concat(sourceValue);
+    } else if (typeof targetValue === 'object' && typeof sourceValue === 'object') {
+      merged[prop] = merge(targetValue, sourceValue);
+    } else {
+      merged[prop] = sourceValue;
+    }
+  }
+
+  return merged;
+};
diff --git a/scripts/tasks/webpack-resources.js b/scripts/tasks/webpack-resources.js
index cc4e795488fd4..91adf80278493 100644
--- a/scripts/tasks/webpack-resources.js
+++ b/scripts/tasks/webpack-resources.js
@@ -1,5 +1,6 @@
 const webpack = require('webpack');
 const path = require('path');
+const merge = require('./merge');
 
 module.exports = {
   webpack,
@@ -155,25 +156,6 @@ module.exports = {
 
 };
 
-function merge(obj1, obj2) {
-  const merged = Object.assign({}, obj1);
-
-  for (prop in obj2) {
-    const sourceValue = obj2[prop];
-    const targetValue = obj1[prop];
-
-    if (sourceValue && Array.isArray(sourceValue) && targetValue && Array.isArray(targetValue)) {
-      merged[prop] = targetValue.concat(sourceValue);
-    } else if (typeof targetValue === 'object' && typeof sourceValue === 'object') {
-      merged[prop] = merge(targetValue, sourceValue);
-    } else {
-      merged[prop] = sourceValue;
-    }
-  }
-
-  return merged;
-}
-
 function getPlugins(
   bundleName,
   isProduction

From a9178d88b47fb68382f4af52575bcbf7a56c556e Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 4 Oct 2017 15:13:13 -0700
Subject: [PATCH 0779/1641] Adding update-snapshots script.

---
 packages/experiments/package.json            | 3 ++-
 packages/office-ui-fabric-react/package.json | 3 ++-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index f6b3a64338736..a53664a59b09f 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -13,7 +13,8 @@
     "build": "node ../../scripts/build.js",
     "clean": "node ../../scripts/clean.js",
     "start": "node ../../scripts/start.js",
-    "start-test": "node ../../scripts/start-test.js"
+    "start-test": "node ../../scripts/start-test.js",
+    "update-snapshots": "node ../../scripts/build.js jest -u"
   },
   "devDependencies": {
     "@types/es6-promise": "^0.0.32",
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index f2811a959744c..836fb0895c32b 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -13,7 +13,8 @@
     "build": "node ../../scripts/build.js",
     "clean": "node ../../scripts/clean.js",
     "start": "node ../../scripts/start.js",
-    "start-test": "node ../../scripts/start-test.js"
+    "start-test": "node ../../scripts/start-test.js",
+    "update-snapshots": "node ../../scripts/build.js jest -u"
   },
   "devDependencies": {
     "@types/enzyme": "2.8.8",

From d7ef8d71e9f0406685c8b40c41fbb0f6738e46eb Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 4 Oct 2017 15:38:52 -0700
Subject: [PATCH 0780/1641] Removekarma. (#3031)

---
 common/config/rush/npm-shrinkwrap.json | 1030 +++---------------------
 scripts/build.js                       |    1 -
 scripts/package.json                   |   11 -
 scripts/tasks/karma-resources.js       |   19 -
 scripts/tasks/karma.js                 |   13 -
 5 files changed, 113 insertions(+), 961 deletions(-)
 delete mode 100644 scripts/tasks/karma-resources.js
 delete mode 100644 scripts/tasks/karma.js

diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 202089becb747..26dc9812edfc3 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -27,6 +27,10 @@
     "@rush-temp/experiments": {
       "version": "file:projects/experiments",
       "dependencies": {
+        "lolex": {
+          "version": "1.6.0",
+          "bundled": true
+        },
         "sinon": {
           "version": "2.4.1",
           "bundled": true
@@ -59,6 +63,10 @@
           "version": "15.5.5",
           "bundled": true
         },
+        "lolex": {
+          "version": "1.6.0",
+          "bundled": true
+        },
         "sinon": {
           "version": "2.4.1",
           "bundled": true
@@ -87,6 +95,10 @@
           "version": "21.1.0",
           "bundled": true
         },
+        "lolex": {
+          "version": "1.6.0",
+          "bundled": true
+        },
         "sinon": {
           "version": "2.4.1",
           "bundled": true
@@ -106,7 +118,8 @@
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
             }
           }
         },
@@ -312,14 +325,14 @@
       "integrity": "sha1-X6rZwsB/YN12dw9xzwJbYqY8/U4="
     },
     "abbrev": {
-      "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.0.9.tgz",
-      "integrity": "sha1-kbR5JYinc4wl813W9jdSovh3YTU="
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz",
+      "integrity": "sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q=="
     },
     "accepts": {
-      "version": "1.3.3",
-      "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.3.tgz",
-      "integrity": "sha1-w8p0NJOGSMPg2cHjKN1otiLChMo="
+      "version": "1.3.4",
+      "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.4.tgz",
+      "integrity": "sha1-hiRnWMfdbSGmR0/whKR0DsBesh8="
     },
     "acorn": {
       "version": "4.0.13",
@@ -336,11 +349,6 @@
       "resolved": "https://registry.npmjs.org/acorn-globals/-/acorn-globals-3.1.0.tgz",
       "integrity": "sha1-/YJw9x+7SZawBPqIDuXUZXOnMb8="
     },
-    "after": {
-      "version": "0.8.2",
-      "resolved": "https://registry.npmjs.org/after/-/after-0.8.2.tgz",
-      "integrity": "sha1-/ts5T58OAqqXaOcCvaI7UF+ufh8="
-    },
     "agent-base": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-2.1.1.tgz",
@@ -530,11 +538,6 @@
       "resolved": "https://registry.npmjs.org/array-reduce/-/array-reduce-0.0.0.tgz",
       "integrity": "sha1-FziZ0//Rx9k4PkR5Ul2+J4yrXys="
     },
-    "array-slice": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/array-slice/-/array-slice-0.2.3.tgz",
-      "integrity": "sha1-3Tz7gO15c6dRF82sabC5nshhhvU="
-    },
     "array-union": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz",
@@ -550,11 +553,6 @@
       "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.3.2.tgz",
       "integrity": "sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg="
     },
-    "arraybuffer.slice": {
-      "version": "0.0.6",
-      "resolved": "https://registry.npmjs.org/arraybuffer.slice/-/arraybuffer.slice-0.0.6.tgz",
-      "integrity": "sha1-8zshWfBTKj8xB6JywMz70a0peco="
-    },
     "arrify": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz",
@@ -585,11 +583,6 @@
       "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
       "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
     },
-    "assertion-error": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-1.0.2.tgz",
-      "integrity": "sha1-E8pRXYYgbaC6xm6DTdOX2HWBCUw="
-    },
     "ast-types": {
       "version": "0.9.11",
       "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.9.11.tgz",
@@ -1352,11 +1345,6 @@
       "resolved": "https://registry.npmjs.org/babylon/-/babylon-6.18.0.tgz",
       "integrity": "sha512-q/UEjfGJ2Cm3oKV71DJz9d25TPnq5rhBVL2Q4fA5wcC3jcrdn7+SssEybFIxwAvvP+YCsCYNKughoF33GxgycQ=="
     },
-    "backo2": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz",
-      "integrity": "sha1-MasayLEpNjRj41s+u2n038+6eUc="
-    },
     "balanced-match": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
@@ -1367,21 +1355,11 @@
       "resolved": "https://registry.npmjs.org/base/-/base-0.11.2.tgz",
       "integrity": "sha512-5T6P4xPgpp0YDFvSWwEZ4NoE3aM4QBQXDzmVbraCkFj8zHM+mba8SyqB5DbZWyR7mYHo6Y7BdQo3MoA4m0TeQg=="
     },
-    "base64-arraybuffer": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/base64-arraybuffer/-/base64-arraybuffer-0.1.5.tgz",
-      "integrity": "sha1-c5JncZI7Whl0etZmqlzUv5xunOg="
-    },
     "base64-js": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.2.1.tgz",
       "integrity": "sha512-dwVUVIXsBZXwTuwnXI9RK8sBmgq09NDHzyR9SAph9eqk76gKK2JSQmZARC2zRC81JC2QTtxD0ARU5qTS25gIGw=="
     },
-    "base64id": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/base64id/-/base64id-1.0.0.tgz",
-      "integrity": "sha1-R2iMuZu2gE8OBtPnY7HDLlfY5rY="
-    },
     "batch": {
       "version": "0.6.1",
       "resolved": "https://registry.npmjs.org/batch/-/batch-0.6.1.tgz",
@@ -1393,11 +1371,6 @@
       "integrity": "sha1-Y7xdy2EzG5K8Bf1SiVPDNGKgb40=",
       "optional": true
     },
-    "better-assert": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/better-assert/-/better-assert-1.0.2.tgz",
-      "integrity": "sha1-QIZrnhueC1W0gYlDEeaPr/rrxSI="
-    },
     "big.js": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/big.js/-/big.js-3.2.0.tgz",
@@ -1413,20 +1386,15 @@
       "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.10.0.tgz",
       "integrity": "sha1-muuabF6IY4qtFx4Wf1kAq+JINdA="
     },
-    "blob": {
-      "version": "0.0.4",
-      "resolved": "https://registry.npmjs.org/blob/-/blob-0.0.4.tgz",
-      "integrity": "sha1-vPEwUspURj8w+fx+lbmkdjCpSSE="
-    },
     "block-stream": {
       "version": "0.0.9",
       "resolved": "https://registry.npmjs.org/block-stream/-/block-stream-0.0.9.tgz",
       "integrity": "sha1-E+v+d4oDIFz+A3UUgeu0szAMEmo="
     },
     "bluebird": {
-      "version": "3.5.1",
-      "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.5.1.tgz",
-      "integrity": "sha512-MKiLiV+I1AA596t9w1sQJ8jkiSr5+ZKi0WKrYGUn6d1Fx+Ij4tIj+m2WMQSGczs5jZVxV339chE8iwk6F64wjA=="
+      "version": "3.4.7",
+      "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.4.7.tgz",
+      "integrity": "sha1-9y12C+Cbf3bQjtj66Ysomo0F+rM="
     },
     "bn.js": {
       "version": "4.11.8",
@@ -1601,11 +1569,6 @@
       "resolved": "https://registry.npmjs.org/cache-base/-/cache-base-1.0.1.tgz",
       "integrity": "sha512-AKcdTnFSWATd5/GCPRxr2ChwIJ85CeyrEyjRHlKxQ56d4XJMGym0uAiKn0xbLOGOl3+yRpOTi484dVCEc5AUzQ=="
     },
-    "callsite": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/callsite/-/callsite-1.0.0.tgz",
-      "integrity": "sha1-KAOY5dZkvXQDi28JBRU+borxvCA="
-    },
     "callsites": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/callsites/-/callsites-2.0.0.tgz",
@@ -1677,11 +1640,6 @@
         }
       }
     },
-    "chai": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/chai/-/chai-4.1.2.tgz",
-      "integrity": "sha1-D2RYS6ZC8PKs4oBiefTwbKI61zw="
-    },
     "chain-function": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/chain-function/-/chain-function-1.0.0.tgz",
@@ -1697,11 +1655,6 @@
       "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
       "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ=="
     },
-    "check-error": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/check-error/-/check-error-1.0.2.tgz",
-      "integrity": "sha1-V00xLt2Iu13YkS6Sht1sCu1KrII="
-    },
     "cheerio": {
       "version": "0.22.0",
       "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-0.22.0.tgz",
@@ -1872,11 +1825,6 @@
       "resolved": "https://registry.npmjs.org/colors/-/colors-1.1.2.tgz",
       "integrity": "sha1-FopHAXVran9RoSzgyXv6KMCE7WM="
     },
-    "combine-lists": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/combine-lists/-/combine-lists-1.0.1.tgz",
-      "integrity": "sha1-RYwH4J4NkA/Ci3Cj/sLazR0st/Y="
-    },
     "combined-stream": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz",
@@ -1902,21 +1850,11 @@
       "resolved": "https://registry.npmjs.org/commondir/-/commondir-1.0.1.tgz",
       "integrity": "sha1-3dgA2gxmEnOTzKWVDqloo6rxJTs="
     },
-    "component-bind": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/component-bind/-/component-bind-1.0.0.tgz",
-      "integrity": "sha1-AMYIq33Nk4l8AAllGx06jh5zu9E="
-    },
     "component-emitter": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz",
       "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY="
     },
-    "component-inherit": {
-      "version": "0.0.3",
-      "resolved": "https://registry.npmjs.org/component-inherit/-/component-inherit-0.0.3.tgz",
-      "integrity": "sha1-ZF/ErfWLcrZJ1crmUTVhnbJv8UM="
-    },
     "compressible": {
       "version": "2.0.11",
       "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.11.tgz",
@@ -1925,34 +1863,44 @@
     "compression": {
       "version": "1.7.1",
       "resolved": "https://registry.npmjs.org/compression/-/compression-1.7.1.tgz",
-      "integrity": "sha1-7/JgPvwuIs+G810uuTWJ+YdTc9s=",
-      "dependencies": {
-        "accepts": {
-          "version": "1.3.4",
-          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.4.tgz",
-          "integrity": "sha1-hiRnWMfdbSGmR0/whKR0DsBesh8="
-        }
-      }
+      "integrity": "sha1-7/JgPvwuIs+G810uuTWJ+YdTc9s="
     },
     "concat-map": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
       "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s="
     },
-    "concat-stream": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.0.tgz",
-      "integrity": "sha1-CqxmL9Ur54lk1VMvaUeE5wEQrPc="
-    },
     "configstore": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.1.tgz",
       "integrity": "sha512-5oNkD/L++l0O6xGXxb1EWS7SivtjfGQlRyxJsYgE0Z495/L81e2h4/d3r969hoPXuFItzNOKMtsXgYG4c7dYvw=="
     },
     "connect": {
-      "version": "3.6.5",
-      "resolved": "https://registry.npmjs.org/connect/-/connect-3.6.5.tgz",
-      "integrity": "sha1-+43ee6B2OHfQ7J352sC0tA5yx9o="
+      "version": "3.5.1",
+      "resolved": "https://registry.npmjs.org/connect/-/connect-3.5.1.tgz",
+      "integrity": "sha1-bTDXpjx/FwhXprOqazY9lz3KWI4=",
+      "dependencies": {
+        "debug": {
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
+        },
+        "finalhandler": {
+          "version": "0.5.1",
+          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.5.1.tgz",
+          "integrity": "sha1-LEANjUUwk1vCMlScX6OF7Afeb80="
+        },
+        "ms": {
+          "version": "0.7.1",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
+          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
+        },
+        "utils-merge": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.0.tgz",
+          "integrity": "sha1-ApT7kiu5N1FTVBxPcJYjHyh8ivg="
+        }
+      }
     },
     "connect-history-api-fallback": {
       "version": "1.3.0",
@@ -2287,11 +2235,6 @@
       "resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz",
       "integrity": "sha1-mI3zP+qxke95mmE2nddsF635V+o="
     },
-    "custom-event": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/custom-event/-/custom-event-1.0.1.tgz",
-      "integrity": "sha1-XQKkaFCt8bSjF5RqOSj8y1v9BCU="
-    },
     "cycle": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/cycle/-/cycle-1.0.3.tgz",
@@ -2312,11 +2255,6 @@
       "resolved": "https://registry.npmjs.org/date-now/-/date-now-0.1.4.tgz",
       "integrity": "sha1-6vQ5/U1ISK105cx9vvIAZyueNFs="
     },
-    "dateformat": {
-      "version": "1.0.12",
-      "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-1.0.12.tgz",
-      "integrity": "sha1-nxJLZ1lMk3/3BpMuSmQsyo27/uk="
-    },
     "debug": {
       "version": "2.6.9",
       "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
@@ -2349,11 +2287,6 @@
         }
       }
     },
-    "deep-eql": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-3.0.1.tgz",
-      "integrity": "sha512-+QeIQyN5ZuO+3Uk5DYh6/1eKO0m0YmJFGNmFHGACpf1ClL1nmlV/p4gNgbl2pJGxgXb4faqo6UE+M5ACEMyVcw=="
-    },
     "deep-equal": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/deep-equal/-/deep-equal-1.0.1.tgz",
@@ -2424,11 +2357,6 @@
       "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.0.3.tgz",
       "integrity": "sha1-ogM8CcyOFY03dI+951B4Mr1s4Sc="
     },
-    "di": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/di/-/di-0.0.1.tgz",
-      "integrity": "sha1-gGZJMmzqp8qjMG112YXqJ0i6kTw="
-    },
     "diff": {
       "version": "3.3.1",
       "resolved": "https://registry.npmjs.org/diff/-/diff-3.3.1.tgz",
@@ -2464,11 +2392,6 @@
       "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-3.2.1.tgz",
       "integrity": "sha1-MgPgf+0he9H0JLAZc1WC/Deyglo="
     },
-    "dom-serialize": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/dom-serialize/-/dom-serialize-2.2.1.tgz",
-      "integrity": "sha1-ViromZ9Evl6jB29UGdzVnrQ6yVs="
-    },
     "dom-serializer": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.1.0.tgz",
@@ -2557,55 +2480,11 @@
       "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.12.tgz",
       "integrity": "sha1-U4tm8+5izRq1HsMjgp0flIDHS+s="
     },
-    "engine.io": {
-      "version": "1.8.3",
-      "resolved": "https://registry.npmjs.org/engine.io/-/engine.io-1.8.3.tgz",
-      "integrity": "sha1-jef5eJXSDTm4X4ju7nd7K9QrE9Q=",
-      "dependencies": {
-        "debug": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
-          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
-        },
-        "ms": {
-          "version": "0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
-          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
-        }
-      }
-    },
-    "engine.io-client": {
-      "version": "1.8.3",
-      "resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-1.8.3.tgz",
-      "integrity": "sha1-F5jtk0USRkU9TG9jXXogH+lA1as=",
-      "dependencies": {
-        "debug": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
-          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
-        },
-        "ms": {
-          "version": "0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
-          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
-        }
-      }
-    },
-    "engine.io-parser": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-1.3.2.tgz",
-      "integrity": "sha1-k3sHnwAH0Ik+xW1GyyILjLQ1Igo="
-    },
     "enhanced-resolve": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.3.0.tgz",
       "integrity": "sha512-2qbxE7ek3YxPJ1ML6V+satHkzHpJQKWkRHmRx6mfAoW59yP8YH8BFplbegSP+u2hBd6B6KCOpvJQ3dZAP+hkpg=="
     },
-    "ent": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/ent/-/ent-2.2.0.tgz",
-      "integrity": "sha1-6WQhkyWiHQX0RGai9obtbOX13R0="
-    },
     "entities": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.1.tgz",
@@ -2779,38 +2658,6 @@
       "resolved": "https://registry.npmjs.org/exenv/-/exenv-1.2.2.tgz",
       "integrity": "sha1-KueOhdmJQVhnCwPUe+wfA72Ru50="
     },
-    "expand-braces": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/expand-braces/-/expand-braces-0.1.2.tgz",
-      "integrity": "sha1-SIsdHSRRyz06axks/AMPRMWFX+o=",
-      "dependencies": {
-        "array-unique": {
-          "version": "0.2.1",
-          "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
-          "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM="
-        },
-        "braces": {
-          "version": "0.1.5",
-          "resolved": "https://registry.npmjs.org/braces/-/braces-0.1.5.tgz",
-          "integrity": "sha1-wIVxEIUpHYt1/ddOqw+FlygHEeY="
-        },
-        "expand-range": {
-          "version": "0.1.1",
-          "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-0.1.1.tgz",
-          "integrity": "sha1-TLjtoJk8pW+k9B/ELzy7TMrf8EQ="
-        },
-        "is-number": {
-          "version": "0.1.1",
-          "resolved": "https://registry.npmjs.org/is-number/-/is-number-0.1.1.tgz",
-          "integrity": "sha1-aaevEWlj1HIG7JvZtIoUIW8eOAY="
-        },
-        "repeat-string": {
-          "version": "0.2.2",
-          "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-0.2.2.tgz",
-          "integrity": "sha1-x6jTI2BoNiBZp+RlH8aITosftK4="
-        }
-      }
-    },
     "expand-brackets": {
       "version": "2.1.4",
       "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-2.1.4.tgz",
@@ -2865,25 +2712,10 @@
       "resolved": "https://registry.npmjs.org/express/-/express-4.16.1.tgz",
       "integrity": "sha512-STB7LZ4N0L+81FJHGla2oboUHTk4PaN1RsOkoRh9OSeEKylvF5hwKYVX1xCLFaCT7MD0BNG/gX2WFMLqY6EMBw==",
       "dependencies": {
-        "accepts": {
-          "version": "1.3.4",
-          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.4.tgz",
-          "integrity": "sha1-hiRnWMfdbSGmR0/whKR0DsBesh8="
-        },
-        "finalhandler": {
-          "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.0.tgz",
-          "integrity": "sha1-zgtoVbRYU+eRsvzGgARtiCU91/U="
-        },
         "path-to-regexp": {
           "version": "0.1.7",
           "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
           "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
-        },
-        "setprototypeof": {
-          "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.0.tgz",
-          "integrity": "sha512-BvE/TwpZX4FXExxOxZyRGQQv651MSwmWKZGqvmPcRIjDqWub67kTKuIMx43cZZrS/cBBzwBcNDWoFxt2XEFIpQ=="
         }
       }
     },
@@ -2902,28 +2734,6 @@
       "resolved": "https://registry.npmjs.org/extglob/-/extglob-2.0.2.tgz",
       "integrity": "sha512-I0+eZBH+jFGL8F5BnIz2ON2nKCjTS3AS3H/5PeSmCp7UVC70Ym8IhdRiQly2juKYQ//f7z1aj1BRpQniFJoU1w=="
     },
-    "extract-zip": {
-      "version": "1.6.5",
-      "resolved": "https://registry.npmjs.org/extract-zip/-/extract-zip-1.6.5.tgz",
-      "integrity": "sha1-maBnNbbqIOqbcF13ms/8yHz/BEA=",
-      "dependencies": {
-        "debug": {
-          "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
-        },
-        "mkdirp": {
-          "version": "0.5.0",
-          "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.0.tgz",
-          "integrity": "sha1-HXMHam35hs2TROFecfzAWkyavxI="
-        },
-        "ms": {
-          "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
-        }
-      }
-    },
     "extsprintf": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.3.0.tgz",
@@ -2976,11 +2786,6 @@
         }
       }
     },
-    "fd-slicer": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/fd-slicer/-/fd-slicer-1.0.1.tgz",
-      "integrity": "sha1-i1vL2ewyfFBBv5qwI/1nUPEXfmU="
-    },
     "file-loader": {
       "version": "0.11.1",
       "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.11.1.tgz",
@@ -3007,9 +2812,9 @@
       "integrity": "sha1-1USBHUKPmOsGpj3EAtJAPDKMOPc="
     },
     "finalhandler": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.6.tgz",
-      "integrity": "sha1-AHrqM9Gk0+QgF/YkhIrVjSEvgU8="
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.0.tgz",
+      "integrity": "sha1-zgtoVbRYU+eRsvzGgARtiCU91/U="
     },
     "find-cache-dir": {
       "version": "1.0.0",
@@ -3094,9 +2899,9 @@
       "integrity": "sha1-PYyt2Q2XZWn6g1qx+OSyOhBWBac="
     },
     "fs-extra": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-1.0.0.tgz",
-      "integrity": "sha1-zTzl9+fLYUWIP8rjGR6Yd/hYeVA="
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-4.0.2.tgz",
+      "integrity": "sha1-+RcExT0bRh+JNFKwwwfZmXZHq2s="
     },
     "fs.realpath": {
       "version": "1.0.0",
@@ -3167,11 +2972,6 @@
       "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz",
       "integrity": "sha1-9wLmMSfn4jHBYKgMFVSstw1QR+U="
     },
-    "get-func-name": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/get-func-name/-/get-func-name-2.0.0.tgz",
-      "integrity": "sha1-6td0q+5y4gQJQzoGY2YCPdaIekE="
-    },
     "get-port": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/get-port/-/get-port-3.2.0.tgz",
@@ -3333,23 +3133,6 @@
       "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz",
       "integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE="
     },
-    "has-binary": {
-      "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/has-binary/-/has-binary-0.1.7.tgz",
-      "integrity": "sha1-aOYesWIQyVRaClzOBqhzkS/h5ow=",
-      "dependencies": {
-        "isarray": {
-          "version": "0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
-          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
-        }
-      }
-    },
-    "has-cors": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/has-cors/-/has-cors-1.1.0.tgz",
-      "integrity": "sha1-XkdHk/fqmEPRu5nCPu9J/xJv/zk="
-    },
     "has-flag": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
@@ -3387,11 +3170,6 @@
       "resolved": "https://registry.npmjs.org/hash.js/-/hash.js-1.1.3.tgz",
       "integrity": "sha512-/UETyP0W22QILqS+6HowevwhEFJ3MBJnwTf75Qob9Wz9t0DPuisL8kW8YZMK62dHAKE1c1p+gY1TtOLY+USEHA=="
     },
-    "hasha": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/hasha/-/hasha-2.2.0.tgz",
-      "integrity": "sha1-eNfL/B5tZjA/55g3NlmEUXsvbuE="
-    },
     "hawk": {
       "version": "6.0.2",
       "resolved": "https://registry.npmjs.org/hawk/-/hawk-6.0.2.tgz",
@@ -3470,7 +3248,14 @@
     "http-errors": {
       "version": "1.6.2",
       "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.2.tgz",
-      "integrity": "sha1-CgAsyFcHGSp+eUbO7cERVfYOxzY="
+      "integrity": "sha1-CgAsyFcHGSp+eUbO7cERVfYOxzY=",
+      "dependencies": {
+        "setprototypeof": {
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.0.3.tgz",
+          "integrity": "sha1-ZlZ+NwQ+608E2RvWWMDL77VbjgQ="
+        }
+      }
     },
     "http-parser-js": {
       "version": "0.4.9",
@@ -3904,11 +3689,6 @@
       "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
       "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
     },
-    "isbinaryfile": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/isbinaryfile/-/isbinaryfile-3.0.2.tgz",
-      "integrity": "sha1-Sj6XTsDLqQBNP8bN5yCeppNopiE="
-    },
     "isemail": {
       "version": "2.2.1",
       "resolved": "https://registry.npmjs.org/isemail/-/isemail-2.2.1.tgz",
@@ -3934,69 +3714,11 @@
       "resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz",
       "integrity": "sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo="
     },
-    "istanbul": {
-      "version": "0.4.5",
-      "resolved": "https://registry.npmjs.org/istanbul/-/istanbul-0.4.5.tgz",
-      "integrity": "sha1-ZcfXPUxNqE1POsMQuRj7C4Azczs=",
-      "dependencies": {
-        "async": {
-          "version": "1.5.2",
-          "resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz",
-          "integrity": "sha1-7GphrlZIDAw8skHJVhjiCJL5Zyo="
-        },
-        "escodegen": {
-          "version": "1.8.1",
-          "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-1.8.1.tgz",
-          "integrity": "sha1-WltTr0aTEQvrsIZ6o0MN07cKEBg="
-        },
-        "estraverse": {
-          "version": "1.9.3",
-          "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-1.9.3.tgz",
-          "integrity": "sha1-r2fy3JIlgkFZUJJgkaQAXSnJu0Q="
-        },
-        "glob": {
-          "version": "5.0.15",
-          "resolved": "https://registry.npmjs.org/glob/-/glob-5.0.15.tgz",
-          "integrity": "sha1-G8k2ueAvSmA/zCIuz3Yz0wuLk7E="
-        },
-        "has-flag": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
-          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
-        },
-        "resolve": {
-          "version": "1.1.7",
-          "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz",
-          "integrity": "sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs="
-        },
-        "source-map": {
-          "version": "0.2.0",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.2.0.tgz",
-          "integrity": "sha1-2rc/vPwrqBm03gO9b26qSBZLP50=",
-          "optional": true
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
-        },
-        "wordwrap": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz",
-          "integrity": "sha1-J1hIEIkUVqQXHI0CJkQa3pDLyus="
-        }
-      }
-    },
     "istanbul-api": {
       "version": "1.1.14",
       "resolved": "https://registry.npmjs.org/istanbul-api/-/istanbul-api-1.1.14.tgz",
       "integrity": "sha1-JbxXAffGgMD//5E95G42GaOm5oA="
     },
-    "istanbul-instrumenter-loader": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/istanbul-instrumenter-loader/-/istanbul-instrumenter-loader-3.0.0.tgz",
-      "integrity": "sha512-alLSEFX06ApU75sm5oWcaVNaiss/bgMRiWTct3g0P0ZZTKjR+6QiCcuVOKDI1kWJgwHEnIXsv/dWm783kPpmtw=="
-    },
     "istanbul-lib-coverage": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-1.1.1.tgz",
@@ -4526,9 +4248,9 @@
       "integrity": "sha1-Hq3nrMASA0rYTiOWdn6tn6VJWCE="
     },
     "jsonfile": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz",
-      "integrity": "sha1-NzaitCi4e72gzIO1P6PWM6NcKug="
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-4.0.0.tgz",
+      "integrity": "sha1-h3Gq4HmbZAdrdmQPygWPnBDjPss="
     },
     "jsonify": {
       "version": "0.0.0",
@@ -4562,116 +4284,6 @@
         }
       }
     },
-    "karma": {
-      "version": "1.7.1",
-      "resolved": "https://registry.npmjs.org/karma/-/karma-1.7.1.tgz",
-      "integrity": "sha512-k5pBjHDhmkdaUccnC7gE3mBzZjcxyxYsYVaqiL2G5AqlfLyBO5nw2VdNK+O16cveEPd/gIOWULH7gkiYYwVNHg==",
-      "dependencies": {
-        "lodash": {
-          "version": "3.10.1",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
-          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
-        },
-        "source-map": {
-          "version": "0.5.7",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
-          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
-        }
-      }
-    },
-    "karma-coverage": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/karma-coverage/-/karma-coverage-1.1.1.tgz",
-      "integrity": "sha1-Wv+LOc9plNwi3kyENix2ABtjfPY=",
-      "dependencies": {
-        "lodash": {
-          "version": "3.10.1",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
-          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
-        },
-        "source-map": {
-          "version": "0.5.7",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
-          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
-        }
-      }
-    },
-    "karma-mocha": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/karma-mocha/-/karma-mocha-1.3.0.tgz",
-      "integrity": "sha1-7qrH/8DiAetjxGdEDStpx883eL8=",
-      "dependencies": {
-        "minimist": {
-          "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
-          "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
-        }
-      }
-    },
-    "karma-mocha-clean-reporter": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/karma-mocha-clean-reporter/-/karma-mocha-clean-reporter-0.0.1.tgz",
-      "integrity": "sha1-6G961LxefGLX8uJC3ydRzPk/Rvo=",
-      "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
-        },
-        "supports-color": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-        }
-      }
-    },
-    "karma-phantomjs-launcher": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/karma-phantomjs-launcher/-/karma-phantomjs-launcher-1.0.4.tgz",
-      "integrity": "sha1-0jyjSAG9qYY60xjju0vUBisTrNI="
-    },
-    "karma-sinon-chai": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/karma-sinon-chai/-/karma-sinon-chai-1.3.2.tgz",
-      "integrity": "sha512-JbV4xobGA4srGuR30YQszmgzv4YpKHpkQWSEBCBBj7OrCMSW4/9GIwtGLHMk/3sT94/b5zveVMR2CV5V2Y3dOg=="
-    },
-    "karma-webpack": {
-      "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/karma-webpack/-/karma-webpack-2.0.4.tgz",
-      "integrity": "sha1-Pi1PSLqUqHjhxmu44a5hKJh6F1s=",
-      "dependencies": {
-        "async": {
-          "version": "0.9.2",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz",
-          "integrity": "sha1-rqdNXmHB+JlhO/ZL2mbUx48v0X0="
-        },
-        "loader-utils": {
-          "version": "0.2.17",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz",
-          "integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g="
-        },
-        "lodash": {
-          "version": "3.10.1",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
-          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
-        },
-        "source-map": {
-          "version": "0.1.43",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz",
-          "integrity": "sha1-wkvBRspRfBRx9drL4lcbK3+eM0Y="
-        }
-      }
-    },
-    "kew": {
-      "version": "0.7.0",
-      "resolved": "https://registry.npmjs.org/kew/-/kew-0.7.0.tgz",
-      "integrity": "sha1-edk9LTM2PW/dKXCzNdkUGtWR15s="
-    },
     "keycode": {
       "version": "2.1.9",
       "resolved": "https://registry.npmjs.org/keycode/-/keycode-2.1.9.tgz",
@@ -4682,11 +4294,6 @@
       "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
       "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
     },
-    "klaw": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/klaw/-/klaw-1.3.1.tgz",
-      "integrity": "sha1-QIhDO0azsbolnXh4XY6W9zugJDk="
-    },
     "lazy-cache": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-2.0.2.tgz",
@@ -4925,73 +4532,24 @@
       "integrity": "sha1-G7nzFO9ri63tE7VJFpsqlF62jk0="
     },
     "lodash.sortby": {
-      "version": "4.7.0",
-      "resolved": "https://registry.npmjs.org/lodash.sortby/-/lodash.sortby-4.7.0.tgz",
-      "integrity": "sha1-7dFMgk4sycHgsKG0K7UhBRakJDg="
-    },
-    "lodash.tail": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/lodash.tail/-/lodash.tail-4.1.1.tgz",
-      "integrity": "sha1-0jM6NtnncXyK0vfKyv7HwytERmQ="
-    },
-    "lodash.toarray": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/lodash.toarray/-/lodash.toarray-4.4.0.tgz",
-      "integrity": "sha1-JMS/zWsvuji/0FlNsRedjptlZWE="
-    },
-    "lodash.uniq": {
-      "version": "4.5.0",
-      "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz",
-      "integrity": "sha1-0CJTc662Uq3BvILklFM5qEJ1R3M="
-    },
-    "log-symbols": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-1.0.2.tgz",
-      "integrity": "sha1-N2/3tY6jCGoPCfrMdGF+ylAeGhg=",
-      "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
-        },
-        "supports-color": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-        }
-      }
-    },
-    "log4js": {
-      "version": "0.6.38",
-      "resolved": "https://registry.npmjs.org/log4js/-/log4js-0.6.38.tgz",
-      "integrity": "sha1-LElBFmldb7JUgJQ9P8hy5mKlIv0=",
-      "dependencies": {
-        "isarray": {
-          "version": "0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
-          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
-        },
-        "readable-stream": {
-          "version": "1.0.34",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
-          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw="
-        },
-        "semver": {
-          "version": "4.3.6",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.6.tgz",
-          "integrity": "sha1-MAvG4OhjdPe6YQaLWx7NV/xlMto="
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
-          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
-        }
-      }
+      "version": "4.7.0",
+      "resolved": "https://registry.npmjs.org/lodash.sortby/-/lodash.sortby-4.7.0.tgz",
+      "integrity": "sha1-7dFMgk4sycHgsKG0K7UhBRakJDg="
+    },
+    "lodash.tail": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/lodash.tail/-/lodash.tail-4.1.1.tgz",
+      "integrity": "sha1-0jM6NtnncXyK0vfKyv7HwytERmQ="
+    },
+    "lodash.toarray": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/lodash.toarray/-/lodash.toarray-4.4.0.tgz",
+      "integrity": "sha1-JMS/zWsvuji/0FlNsRedjptlZWE="
+    },
+    "lodash.uniq": {
+      "version": "4.5.0",
+      "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz",
+      "integrity": "sha1-0CJTc662Uq3BvILklFM5qEJ1R3M="
     },
     "loglevel": {
       "version": "1.5.0",
@@ -4999,9 +4557,9 @@
       "integrity": "sha512-OQ2jhWI5G2qsvO0UFNyCQWgKl/tFiwuPIXxELzACeUO2FqstN/R7mmL09+nhv6xOWVPPojQO1A90sCEoJSgBcQ=="
     },
     "lolex": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
-      "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/lolex/-/lolex-2.1.3.tgz",
+      "integrity": "sha512-BdHq78SeI+6PAUtl4atDuCt7L6E4fab3mSRtqxm4ywaXe4uP7jZ0TTcFNuU20syUjxZc2l7jFqKVMJ+AX0LnpQ=="
     },
     "longest": {
       "version": "1.0.1",
@@ -5287,11 +4845,6 @@
         }
       }
     },
-    "mocha-clean": {
-      "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/mocha-clean/-/mocha-clean-0.4.0.tgz",
-      "integrity": "sha1-CbaYXDIYFhQDIeED593ktIdgkhw="
-    },
     "moment": {
       "version": "2.18.1",
       "resolved": "https://registry.npmjs.org/moment/-/moment-2.18.1.tgz",
@@ -5355,7 +4908,14 @@
     "nise": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/nise/-/nise-1.1.1.tgz",
-      "integrity": "sha512-f5DMJB0MqBaSuP2NAwPx7HyVKPdaozds0KsNe9XIP3npKWt/QUg73l5TTLRTSwfG/Y3AB0ktacuxX4QNcg6vVw=="
+      "integrity": "sha512-f5DMJB0MqBaSuP2NAwPx7HyVKPdaozds0KsNe9XIP3npKWt/QUg73l5TTLRTSwfG/Y3AB0ktacuxX4QNcg6vVw==",
+      "dependencies": {
+        "lolex": {
+          "version": "1.6.0",
+          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
+          "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
+        }
+      }
     },
     "node-dir": {
       "version": "0.1.17",
@@ -5510,11 +5070,6 @@
       "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
       "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM="
     },
-    "object-component": {
-      "version": "0.0.3",
-      "resolved": "https://registry.npmjs.org/object-component/-/object-component-0.0.3.tgz",
-      "integrity": "sha1-8MaapQ78lbhmwYb0AKM3acsvEpE="
-    },
     "object-copy": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/object-copy/-/object-copy-0.1.0.tgz",
@@ -5651,11 +5206,6 @@
         }
       }
     },
-    "options": {
-      "version": "0.0.6",
-      "resolved": "https://registry.npmjs.org/options/-/options-0.0.6.tgz",
-      "integrity": "sha1-7CLTEoBrtT5zF3Pnza788cZDEo8="
-    },
     "original": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/original/-/original-1.0.0.tgz",
@@ -5743,21 +5293,6 @@
       "resolved": "https://registry.npmjs.org/parse5/-/parse5-1.5.1.tgz",
       "integrity": "sha1-m387DeMr543CQBsXVzzK8Pb1nZQ="
     },
-    "parsejson": {
-      "version": "0.0.3",
-      "resolved": "https://registry.npmjs.org/parsejson/-/parsejson-0.0.3.tgz",
-      "integrity": "sha1-q343WfIJ7OmUN5c/fQ8fZK4OZKs="
-    },
-    "parseqs": {
-      "version": "0.0.5",
-      "resolved": "https://registry.npmjs.org/parseqs/-/parseqs-0.0.5.tgz",
-      "integrity": "sha1-1SCKNzjkZ2bikbouoXNoSSGouJ0="
-    },
-    "parseuri": {
-      "version": "0.0.5",
-      "resolved": "https://registry.npmjs.org/parseuri/-/parseuri-0.0.5.tgz",
-      "integrity": "sha1-gCBKUNTbt3m/3G6+J3jZDkvOMgo="
-    },
     "parseurl": {
       "version": "1.3.2",
       "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.2.tgz",
@@ -5822,123 +5357,16 @@
         }
       }
     },
-    "pathval": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/pathval/-/pathval-1.1.0.tgz",
-      "integrity": "sha1-uULm1L3mUwBe9rcTYd74cn0GReA="
-    },
     "pbkdf2": {
       "version": "3.0.14",
       "resolved": "https://registry.npmjs.org/pbkdf2/-/pbkdf2-3.0.14.tgz",
       "integrity": "sha512-gjsZW9O34fm0R7PaLHRJmLLVfSoesxztjPjE9o6R+qtVJij90ltg1joIovN9GKrRW3t1PzhDDG3UMEMFfZ+1wA=="
     },
-    "pend": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/pend/-/pend-1.2.0.tgz",
-      "integrity": "sha1-elfrVQpng/kRUzH89GY9XI4AelA="
-    },
     "performance-now": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz",
       "integrity": "sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns="
     },
-    "phantomjs-polyfill": {
-      "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/phantomjs-polyfill/-/phantomjs-polyfill-0.0.2.tgz",
-      "integrity": "sha1-jGpxY+m8j9n/2+fWBctTUvn7iR4="
-    },
-    "phantomjs-prebuilt": {
-      "version": "2.1.15",
-      "resolved": "https://registry.npmjs.org/phantomjs-prebuilt/-/phantomjs-prebuilt-2.1.15.tgz",
-      "integrity": "sha1-IPhugtM0nFBZF1J3RbekEeCLOQM=",
-      "dependencies": {
-        "ajv": {
-          "version": "4.11.8",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz",
-          "integrity": "sha1-gv+wKynmYq5TvcIK8VlHcGc5xTY="
-        },
-        "assert-plus": {
-          "version": "0.2.0",
-          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-0.2.0.tgz",
-          "integrity": "sha1-104bh+ev/A24qttwIfP+SBAasjQ="
-        },
-        "aws-sign2": {
-          "version": "0.6.0",
-          "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz",
-          "integrity": "sha1-FDQt0428yU0OW4fXY81jYSwOeU8="
-        },
-        "boom": {
-          "version": "2.10.1",
-          "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
-          "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8="
-        },
-        "cryptiles": {
-          "version": "2.0.5",
-          "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz",
-          "integrity": "sha1-O9/s3GCBR8HGcgL6KR59ylnqo7g="
-        },
-        "es6-promise": {
-          "version": "4.0.5",
-          "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.0.5.tgz",
-          "integrity": "sha1-eILzCt3lskDM+n99eMVIMwlRrkI="
-        },
-        "form-data": {
-          "version": "2.1.4",
-          "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
-          "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE="
-        },
-        "har-schema": {
-          "version": "1.0.5",
-          "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-1.0.5.tgz",
-          "integrity": "sha1-0mMTX0MwfALGAq/I/pWXDAFRNp4="
-        },
-        "har-validator": {
-          "version": "4.2.1",
-          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz",
-          "integrity": "sha1-M0gdDxu/9gDdID11gSpqX7oALio="
-        },
-        "hawk": {
-          "version": "3.1.3",
-          "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz",
-          "integrity": "sha1-B4REvXwWQLD+VA0sm3PVlnjo4cQ="
-        },
-        "hoek": {
-          "version": "2.16.3",
-          "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz",
-          "integrity": "sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0="
-        },
-        "http-signature": {
-          "version": "1.1.1",
-          "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz",
-          "integrity": "sha1-33LiZwZs0Kxn+3at+OE0qPvPkb8="
-        },
-        "performance-now": {
-          "version": "0.2.0",
-          "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-0.2.0.tgz",
-          "integrity": "sha1-M+8wxcd9TqIcWlOGnZG1bY8lVeU="
-        },
-        "qs": {
-          "version": "6.4.0",
-          "resolved": "https://registry.npmjs.org/qs/-/qs-6.4.0.tgz",
-          "integrity": "sha1-E+JtKK1rD/qpExLNO/cI7TUecjM="
-        },
-        "request": {
-          "version": "2.81.0",
-          "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz",
-          "integrity": "sha1-xpKJRqDgbF+Nb4qTM0af/aRimKA="
-        },
-        "sntp": {
-          "version": "1.0.9",
-          "resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz",
-          "integrity": "sha1-ZUEYTMkK7qbG57NeJlkIJEPGYZg="
-        },
-        "which": {
-          "version": "1.2.14",
-          "resolved": "https://registry.npmjs.org/which/-/which-1.2.14.tgz",
-          "integrity": "sha1-mofEN48D6CfOyvGs31bHNsAcFOU="
-        }
-      }
-    },
     "pify": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
@@ -7198,11 +6626,6 @@
       "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz",
       "integrity": "sha1-FQ4gt1ZZCtP5EJPyWk8q2L/zC6M="
     },
-    "progress": {
-      "version": "1.1.8",
-      "resolved": "https://registry.npmjs.org/progress/-/progress-1.1.8.tgz",
-      "integrity": "sha1-4mDHj2Fhzdmw5WzD4Khd4Xx6V74="
-    },
     "promise": {
       "version": "7.3.1",
       "resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz",
@@ -7253,11 +6676,6 @@
       "resolved": "https://registry.npmjs.org/q/-/q-1.5.0.tgz",
       "integrity": "sha1-3QG6ydBtMObyGa7LglPunr3DCPE="
     },
-    "qjobs": {
-      "version": "1.1.5",
-      "resolved": "https://registry.npmjs.org/qjobs/-/qjobs-1.1.5.tgz",
-      "integrity": "sha1-ZZ3p8s+NzCehSBJ28gU3cnI4LnM="
-    },
     "qs": {
       "version": "6.5.1",
       "resolved": "https://registry.npmjs.org/qs/-/qs-6.5.1.tgz",
@@ -7620,11 +7038,6 @@
       "resolved": "https://registry.npmjs.org/request/-/request-2.83.0.tgz",
       "integrity": "sha512-lR3gD69osqm6EYLk9wB/G1W/laGWjzH90t1vEa2xuxHD5KUrSzp9pUSfTm+YC5Nxt2T8nMPEvKlhbQayU7bgFw=="
     },
-    "request-progress": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/request-progress/-/request-progress-2.0.1.tgz",
-      "integrity": "sha1-XTa7V5YcZzqlt4jbyBQf3yO0Tgg="
-    },
     "request-promise": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/request-promise/-/request-promise-4.1.1.tgz",
@@ -7784,11 +7197,6 @@
           "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz",
           "integrity": "sha1-FDQt0428yU0OW4fXY81jYSwOeU8="
         },
-        "bluebird": {
-          "version": "3.4.7",
-          "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.4.7.tgz",
-          "integrity": "sha1-9y12C+Cbf3bQjtj66Ysomo0F+rM="
-        },
         "boom": {
           "version": "2.10.1",
           "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
@@ -7819,11 +7227,6 @@
           "resolved": "https://registry.npmjs.org/compression/-/compression-1.6.2.tgz",
           "integrity": "sha1-zOsSHsydCcUtetDDNQ6pPd1AK8M="
         },
-        "connect": {
-          "version": "3.5.1",
-          "resolved": "https://registry.npmjs.org/connect/-/connect-3.5.1.tgz",
-          "integrity": "sha1-bTDXpjx/FwhXprOqazY9lz3KWI4="
-        },
         "cryptiles": {
           "version": "2.0.5",
           "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz",
@@ -7834,11 +7237,6 @@
           "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
           "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
-        "finalhandler": {
-          "version": "0.5.1",
-          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.5.1.tgz",
-          "integrity": "sha1-LEANjUUwk1vCMlScX6OF7Afeb80="
-        },
         "form-data": {
           "version": "2.1.4",
           "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
@@ -7903,11 +7301,6 @@
           "version": "0.4.3",
           "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz",
           "integrity": "sha1-Y3PbdpCf5XDgjXNYM2Xtgop07us="
-        },
-        "utils-merge": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.0.tgz",
-          "integrity": "sha1-ApT7kiu5N1FTVBxPcJYjHyh8ivg="
         }
       }
     },
@@ -7946,11 +7339,6 @@
           "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz",
           "integrity": "sha1-FDQt0428yU0OW4fXY81jYSwOeU8="
         },
-        "bluebird": {
-          "version": "3.4.7",
-          "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.4.7.tgz",
-          "integrity": "sha1-9y12C+Cbf3bQjtj66Ysomo0F+rM="
-        },
         "boom": {
           "version": "2.10.1",
           "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
@@ -7983,11 +7371,6 @@
           "resolved": "https://registry.npmjs.org/compression/-/compression-1.6.2.tgz",
           "integrity": "sha1-zOsSHsydCcUtetDDNQ6pPd1AK8M="
         },
-        "connect": {
-          "version": "3.5.1",
-          "resolved": "https://registry.npmjs.org/connect/-/connect-3.5.1.tgz",
-          "integrity": "sha1-bTDXpjx/FwhXprOqazY9lz3KWI4="
-        },
         "cryptiles": {
           "version": "2.0.5",
           "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz",
@@ -7998,11 +7381,6 @@
           "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
           "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
         },
-        "finalhandler": {
-          "version": "0.5.1",
-          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.5.1.tgz",
-          "integrity": "sha1-LEANjUUwk1vCMlScX6OF7Afeb80="
-        },
         "form-data": {
           "version": "2.1.4",
           "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
@@ -8139,11 +7517,6 @@
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
           "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
         },
-        "utils-merge": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.0.tgz",
-          "integrity": "sha1-ApT7kiu5N1FTVBxPcJYjHyh8ivg="
-        },
         "webidl-conversions": {
           "version": "3.0.1",
           "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-3.0.1.tgz",
@@ -8196,14 +7569,7 @@
     "serve-index": {
       "version": "1.9.1",
       "resolved": "https://registry.npmjs.org/serve-index/-/serve-index-1.9.1.tgz",
-      "integrity": "sha1-03aNabHn2C5c4FD/9bRTvqEqkjk=",
-      "dependencies": {
-        "accepts": {
-          "version": "1.3.4",
-          "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.4.tgz",
-          "integrity": "sha1-hiRnWMfdbSGmR0/whKR0DsBesh8="
-        }
-      }
+      "integrity": "sha1-03aNabHn2C5c4FD/9bRTvqEqkjk="
     },
     "serve-static": {
       "version": "1.13.1",
@@ -8243,9 +7609,9 @@
       "integrity": "sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU="
     },
     "setprototypeof": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.0.3.tgz",
-      "integrity": "sha1-ZlZ+NwQ+608E2RvWWMDL77VbjgQ="
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.0.tgz",
+      "integrity": "sha512-BvE/TwpZX4FXExxOxZyRGQQv651MSwmWKZGqvmPcRIjDqWub67kTKuIMx43cZZrS/cBBzwBcNDWoFxt2XEFIpQ=="
     },
     "sha.js": {
       "version": "2.4.9",
@@ -8307,19 +7673,7 @@
     "sinon": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/sinon/-/sinon-3.3.0.tgz",
-      "integrity": "sha512-/flfGfIxIRXSvZBHJzIf3iAyGYkmMQq6SQjA0cx9SOuVuq+4ZPPO4LJtH1Ce0Lznax1KSG1U6Dad85wIcSW19w==",
-      "dependencies": {
-        "lolex": {
-          "version": "2.1.3",
-          "resolved": "https://registry.npmjs.org/lolex/-/lolex-2.1.3.tgz",
-          "integrity": "sha512-BdHq78SeI+6PAUtl4atDuCt7L6E4fab3mSRtqxm4ywaXe4uP7jZ0TTcFNuU20syUjxZc2l7jFqKVMJ+AX0LnpQ=="
-        }
-      }
-    },
-    "sinon-chai": {
-      "version": "2.14.0",
-      "resolved": "https://registry.npmjs.org/sinon-chai/-/sinon-chai-2.14.0.tgz",
-      "integrity": "sha512-9stIF1utB0ywNHNT7RgiXbdmen8QDCRsrTjw+G9TgKt1Yexjiv8TOWZ6WHsTPz57Yky3DIswZvEqX8fpuHNDtQ=="
+      "integrity": "sha512-/flfGfIxIRXSvZBHJzIf3iAyGYkmMQq6SQjA0cx9SOuVuq+4ZPPO4LJtH1Ce0Lznax1KSG1U6Dad85wIcSW19w=="
     },
     "slash": {
       "version": "1.0.0",
@@ -8370,89 +7724,6 @@
       "resolved": "https://registry.npmjs.org/sntp/-/sntp-2.0.2.tgz",
       "integrity": "sha1-UGQRDwr4X3z9t9a2ekACjOUrSys="
     },
-    "socket.io": {
-      "version": "1.7.3",
-      "resolved": "https://registry.npmjs.org/socket.io/-/socket.io-1.7.3.tgz",
-      "integrity": "sha1-uK+cq6AJSeVo42nxMn6pvp6iRhs=",
-      "dependencies": {
-        "debug": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
-          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
-        },
-        "ms": {
-          "version": "0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
-          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
-        },
-        "object-assign": {
-          "version": "4.1.0",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.0.tgz",
-          "integrity": "sha1-ejs9DpgGPUP0wD8uiubNUahog6A="
-        }
-      }
-    },
-    "socket.io-adapter": {
-      "version": "0.5.0",
-      "resolved": "https://registry.npmjs.org/socket.io-adapter/-/socket.io-adapter-0.5.0.tgz",
-      "integrity": "sha1-y21LuL7IHhB4uZZ3+c7QBGBmu4s=",
-      "dependencies": {
-        "debug": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
-          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
-        },
-        "ms": {
-          "version": "0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
-          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
-        }
-      }
-    },
-    "socket.io-client": {
-      "version": "1.7.3",
-      "resolved": "https://registry.npmjs.org/socket.io-client/-/socket.io-client-1.7.3.tgz",
-      "integrity": "sha1-sw6GqhDV7zVGYBwJzeR2Xjgdo3c=",
-      "dependencies": {
-        "debug": {
-          "version": "2.3.3",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.3.3.tgz",
-          "integrity": "sha1-QMRT5n5uE8kB3ewxeviYbNqe/4w="
-        },
-        "ms": {
-          "version": "0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
-          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
-        }
-      }
-    },
-    "socket.io-parser": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-2.3.1.tgz",
-      "integrity": "sha1-3VMgJRA85Clpcya+/WQAX8/ltKA=",
-      "dependencies": {
-        "component-emitter": {
-          "version": "1.1.2",
-          "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.1.2.tgz",
-          "integrity": "sha1-KWWU8nU9qmOZbSrwjRWpURbJrsM="
-        },
-        "debug": {
-          "version": "2.2.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
-        },
-        "isarray": {
-          "version": "0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
-          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
-        },
-        "ms": {
-          "version": "0.7.1",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
-          "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
-        }
-      }
-    },
     "sockjs": {
       "version": "0.3.18",
       "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.18.tgz",
@@ -8843,11 +8114,6 @@
       "resolved": "https://registry.npmjs.org/throat/-/throat-4.1.0.tgz",
       "integrity": "sha1-iQN8vJLFarGJJua6TLsgDhVnKmo="
     },
-    "throttleit": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/throttleit/-/throttleit-1.0.0.tgz",
-      "integrity": "sha1-nnhYNtr0Z0MUWlmEtiaNgoUorGw="
-    },
     "through": {
       "version": "2.3.8",
       "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
@@ -8873,21 +8139,11 @@
       "resolved": "https://registry.npmjs.org/timespan/-/timespan-2.3.0.tgz",
       "integrity": "sha1-SQLOBAvRPYRcj1myfp1ZutbzmSk="
     },
-    "tmp": {
-      "version": "0.0.31",
-      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.31.tgz",
-      "integrity": "sha1-jzirlDjhcxXl29izZX6L+yd65Kc="
-    },
     "tmpl": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/tmpl/-/tmpl-1.0.4.tgz",
       "integrity": "sha1-I2QN17QtAEM5ERQIIOXPRA5SHdE="
     },
-    "to-array": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/to-array/-/to-array-0.1.4.tgz",
-      "integrity": "sha1-F+bBH3PdTz10zaek/zI46a2b+JA="
-    },
     "to-arraybuffer": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/to-arraybuffer/-/to-arraybuffer-1.0.1.tgz",
@@ -8996,16 +8252,6 @@
             }
           }
         },
-        "fs-extra": {
-          "version": "4.0.2",
-          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-4.0.2.tgz",
-          "integrity": "sha1-+RcExT0bRh+JNFKwwwfZmXZHq2s="
-        },
-        "jsonfile": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-4.0.0.tgz",
-          "integrity": "sha1-h3Gq4HmbZAdrdmQPygWPnBDjPss="
-        },
         "load-json-file": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
@@ -9113,11 +8359,6 @@
       "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.15.tgz",
       "integrity": "sha1-yrEPtJCeRByChC6v4a1kbIGARBA="
     },
-    "typedarray": {
-      "version": "0.0.6",
-      "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
-      "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
-    },
     "typescript": {
       "version": "2.4.2",
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.4.2.tgz",
@@ -9169,9 +8410,9 @@
       }
     },
     "ultron": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.0.2.tgz",
-      "integrity": "sha1-rOEWq1V80Zc4ak6I9GhTeMiy5Po="
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.1.0.tgz",
+      "integrity": "sha1-sHoualQagV/Go0zNRTO67DB8qGQ="
     },
     "underscore": {
       "version": "1.7.0",
@@ -9307,18 +8548,6 @@
         }
       }
     },
-    "useragent": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/useragent/-/useragent-2.2.1.tgz",
-      "integrity": "sha1-z1k+9PLRdYdei7ZY6pLhik/QbY4=",
-      "dependencies": {
-        "lru-cache": {
-          "version": "2.2.4",
-          "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-2.2.4.tgz",
-          "integrity": "sha1-bGWGGb7PFAMdDQtZSxYELOTcBj0="
-        }
-      }
-    },
     "util": {
       "version": "0.10.3",
       "resolved": "https://registry.npmjs.org/util/-/util-0.10.3.tgz",
@@ -9388,11 +8617,6 @@
       "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-0.0.4.tgz",
       "integrity": "sha1-XX6kW7755Kb/ZflUOOCofDV9WnM="
     },
-    "void-elements": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/void-elements/-/void-elements-2.0.1.tgz",
-      "integrity": "sha1-wGavtYK7HLQSjWDqkjkulNXp2+w="
-    },
     "walker": {
       "version": "1.0.7",
       "resolved": "https://registry.npmjs.org/walker/-/walker-1.0.7.tgz",
@@ -9524,25 +8748,10 @@
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
         },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-        },
         "supports-color": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
           "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-        },
-        "ultron": {
-          "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.1.0.tgz",
-          "integrity": "sha1-sHoualQagV/Go0zNRTO67DB8qGQ="
-        },
-        "ws": {
-          "version": "2.3.1",
-          "resolved": "https://registry.npmjs.org/ws/-/ws-2.3.1.tgz",
-          "integrity": "sha1-a5Sz5EfLajY/eF6vlK9jWejoHIA="
         }
       }
     },
@@ -9741,14 +8950,16 @@
       }
     },
     "ws": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-1.1.2.tgz",
-      "integrity": "sha1-iiRPoFJAHgjJiGz0SoUYnh/UBn8="
-    },
-    "wtf-8": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/wtf-8/-/wtf-8-1.0.0.tgz",
-      "integrity": "sha1-OS2LotDxw00e4tYw8V0O+2jhBIo="
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-2.3.1.tgz",
+      "integrity": "sha1-a5Sz5EfLajY/eF6vlK9jWejoHIA=",
+      "dependencies": {
+        "safe-buffer": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
+          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
+        }
+      }
     },
     "xdg-basedir": {
       "version": "3.0.0",
@@ -9760,11 +8971,6 @@
       "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-2.0.1.tgz",
       "integrity": "sha1-TYuPHszTQZqjYgYb7O9RXh5VljU="
     },
-    "xmlhttprequest-ssl": {
-      "version": "1.5.3",
-      "resolved": "https://registry.npmjs.org/xmlhttprequest-ssl/-/xmlhttprequest-ssl-1.5.3.tgz",
-      "integrity": "sha1-GFqIjATspGw+QHDZn3tJ3jUomS0="
-    },
     "xtend": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.1.tgz",
@@ -9828,16 +9034,6 @@
           "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
         }
       }
-    },
-    "yauzl": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/yauzl/-/yauzl-2.4.1.tgz",
-      "integrity": "sha1-lSj0QtqxsihOWLQ3m7GU4i4MQAU="
-    },
-    "yeast": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/yeast/-/yeast-0.1.2.tgz",
-      "integrity": "sha1-AI4G2AlDIMNy28L47XagymyKxBk="
     }
   }
 }
\ No newline at end of file
diff --git a/scripts/build.js b/scripts/build.js
index f083bde9e63ee..f593037014698 100644
--- a/scripts/build.js
+++ b/scripts/build.js
@@ -16,7 +16,6 @@ let tasks = [
   'sass',
   'tslint',
   'ts',
-  'karma',
   'jest',
   'webpack'
 ];
diff --git a/scripts/package.json b/scripts/package.json
index 413b9fa06fe12..cf8ded2191d71 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -13,34 +13,23 @@
     "autoprefixer": "^7.1.2",
     "awesome-typescript-loader": "^3.2.3",
     "chalk": "^2.1.0",
-    "chai": "^4.1.1",
     "command-line-args": "^4.0.7",
     "cpx": "^1.5.0",
     "css-loader": "^0.28.5",
     "github": "^7.0.0",
     "glob": "^7.1.2",
     "gzip-size": "^3.0.0",
-    "istanbul-instrumenter-loader": "^3.0.0",
     "json-loader": "^0.5.7",
     "jest": "^21.1.0",
     "ts-jest": "^21.0.1",
-    "karma": "^1.7.0",
-    "karma-coverage": "^1.1.1",
-    "karma-mocha": "^1.3.0",
-    "karma-mocha-clean-reporter": "^0.0.1",
-    "karma-phantomjs-launcher": "^1.0.4",
-    "karma-sinon-chai": "^1.3.1",
-    "karma-webpack": "^2.0.4",
     "node-sass": "^4.5.3",
     "open": "^0.0.5",
-    "phantomjs-polyfill": "^0.0.2",
     "postcss": "^6.0.9",
     "postcss-loader": "^2.0.6",
     "postcss-modules": "^0.8.0",
     "raw-loader": "^0.5.1",
     "sass-loader": "^6.0.6",
     "sinon": "^3.2.1",
-    "sinon-chai": "^2.13.0",
     "source-map-loader": "^0.2.1",
     "style-loader": "^0.18.2",
     "tslint": "^5.6.0",
diff --git a/scripts/tasks/karma-resources.js b/scripts/tasks/karma-resources.js
deleted file mode 100644
index afc7811d43270..0000000000000
--- a/scripts/tasks/karma-resources.js
+++ /dev/null
@@ -1,19 +0,0 @@
-module.exports = {
-
-  istanbulInstrumenterLoaderPath: require.resolve('istanbul-instrumenter-loader'),
-
-  files: [
-    require.resolve('phantomjs-polyfill/bind-polyfill.js')
-  ],
-
-  plugins: [
-    require('karma-webpack'),
-    require('karma-mocha'),
-    require('karma-coverage'),
-    require('karma-mocha-clean-reporter'),
-    require('karma-phantomjs-launcher'),
-    require('karma-sinon-chai')
-  ],
-
-  webpack: require('webpack')
-};
diff --git a/scripts/tasks/karma.js b/scripts/tasks/karma.js
deleted file mode 100644
index 5dc414173c689..0000000000000
--- a/scripts/tasks/karma.js
+++ /dev/null
@@ -1,13 +0,0 @@
-module.exports = function (options) {
-  let path = require('path');
-  let fs = require('fs');
-  let karmaPath = path.resolve(__dirname, '../node_modules/karma/bin/karma');
-  let karmaConfigPath = path.join(process.cwd(), 'karma.config.js');
-  let debugRun = (process.argv.indexOf('--debug') > -1);
-
-  if (fs.existsSync(karmaConfigPath)) {
-    const execSync = require('../exec-sync');
-
-    execSync(`node ${karmaPath} start ${karmaConfigPath} ${debugRun ? '--debug --single-run=false' : ''}`);
-  }
-};

From 60a20b2d56a04340e9bc004a75c22db406448d6e Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 4 Oct 2017 15:40:23 -0700
Subject: [PATCH 0781/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 29 ++++++
 apps/fabric-website/CHANGELOG.md              | 11 ++-
 apps/fabric-website/package.json              |  4 +-
 apps/ssr-tests/package.json                   |  4 +-
 apps/test-bundle-button/package.json          |  4 +-
 apps/todo-app/package.json                    |  6 +-
 apps/vr-tests/package.json                    |  4 +-
 ...general-website-bugs_2017-10-02-22-18.json | 11 ---
 .../icon-docs_2017-10-02-16-52.json           | 11 ---
 .../icon-page-website_2017-10-03-15-54.json   | 11 ---
 ...positioning-refactor_2017-09-28-20-50.json | 11 ---
 ...ix-tooltip-classname_2017-10-04-20-15.json | 11 ---
 ...-datepicker-callback_2017-10-02-23-23.json | 11 ---
 ...n-selectedKey-bugfix_2017-10-02-21-17.json | 11 ---
 ...general-website-bugs_2017-10-02-22-18.json | 11 ---
 ...-ScrollSelectedToTop_2017-09-26-16-38.json | 11 ---
 ...o-splitButtonDisable_2017-10-02-20-48.json | 11 ---
 ...positioning-refactor_2017-09-28-20-50.json | 11 ---
 .../resize-group-header_2017-10-03-21-51.json | 11 ---
 .../searchbox-toolkit_2017-09-29-20-03.json   | 11 ---
 .../tooltip-page_2017-10-02-18-24.json        | 11 ---
 ...fix-list-example-rtl_2017-09-27-20-21.json | 11 ---
 ...w-sept-contrast-bugs_2017-09-21-18-01.json | 11 ---
 ...kit-borderRadius-fix_2017-10-04-14-52.json | 11 ---
 packages/example-app-base/CHANGELOG.json      | 15 ++++
 packages/example-app-base/CHANGELOG.md        |  7 +-
 packages/example-app-base/package.json        |  6 +-
 packages/experiments/CHANGELOG.json           | 15 ++++
 packages/experiments/CHANGELOG.md             |  7 +-
 packages/experiments/package.json             |  6 +-
 packages/icons/package.json                   |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 89 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 27 +++++-
 packages/office-ui-fabric-react/package.json  |  8 +-
 packages/styling/CHANGELOG.json               | 12 +++
 packages/styling/CHANGELOG.md                 |  7 +-
 packages/styling/package.json                 |  4 +-
 packages/utilities/CHANGELOG.json             | 14 +++
 packages/utilities/CHANGELOG.md               |  9 +-
 packages/utilities/package.json               |  2 +-
 40 files changed, 261 insertions(+), 218 deletions(-)
 delete mode 100644 common/changes/@uifabric/fabric-website/general-website-bugs_2017-10-02-22-18.json
 delete mode 100644 common/changes/@uifabric/fabric-website/icon-docs_2017-10-02-16-52.json
 delete mode 100644 common/changes/@uifabric/fabric-website/icon-page-website_2017-10-03-15-54.json
 delete mode 100644 common/changes/@uifabric/utilities/positioning-refactor_2017-09-28-20-50.json
 delete mode 100644 common/changes/office-ui-fabric-react/2906-fix-tooltip-classname_2017-10-04-20-15.json
 delete mode 100644 common/changes/office-ui-fabric-react/andrescb-fix-datepicker-callback_2017-10-02-23-23.json
 delete mode 100644 common/changes/office-ui-fabric-react/dropdown-selectedKey-bugfix_2017-10-02-21-17.json
 delete mode 100644 common/changes/office-ui-fabric-react/general-website-bugs_2017-10-02-22-18.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-Callout-ScrollSelectedToTop_2017-09-26-16-38.json
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-splitButtonDisable_2017-10-02-20-48.json
 delete mode 100644 common/changes/office-ui-fabric-react/positioning-refactor_2017-09-28-20-50.json
 delete mode 100644 common/changes/office-ui-fabric-react/resize-group-header_2017-10-03-21-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/searchbox-toolkit_2017-09-29-20-03.json
 delete mode 100644 common/changes/office-ui-fabric-react/tooltip-page_2017-10-02-18-24.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-edwliu-fix-list-example-rtl_2017-09-27-20-21.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-sept-contrast-bugs_2017-09-21-18-01.json
 delete mode 100644 common/changes/office-ui-fabric-react/webkit-borderRadius-fix_2017-10-04-14-52.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 31e46e305b948..635ddf50abfe3 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,35 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.0.7",
+      "tag": "@uifabric/fabric-website_v5.0.7",
+      "date": "Wed, 04 Oct 2017 22:40:22 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "ca3473a1d65c8124901173ee0aeb7c7af5b220ef",
+            "comment": "Updated ResourcePage text and made padding more rtl friendly."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "f9ff40b02ab05a1a3542b90a9f4e2fe51a6d42ed",
+            "comment": "Added section in Get Started page to document how to use icons in components."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "289ee6ee52372491ac35cebb577554be9ac39c9a",
+            "comment": "Added Icon component to website"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.3.0 <6.0.0` to `>=6.0.0 <7.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.6",
       "tag": "@uifabric/fabric-website_v5.0.6",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 5062f114bf85a..eb042ada3622c 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,15 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Fri, 29 Sep 2017 10:20:24 GMT and should not be manually modified.
+This log was last generated on Wed, 04 Oct 2017 22:40:22 GMT and should not be manually modified.
+
+## 5.0.7
+Wed, 04 Oct 2017 22:40:22 GMT
+
+### Patches
+
+- Updated ResourcePage text and made padding more rtl friendly.
+- Added section in Get Started page to document how to use icons in components.
+- Added Icon component to website
 
 ## 5.0.6
 Fri, 29 Sep 2017 10:20:24 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 513a216348899..f239524ef59b3 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.0.6",
+  "version": "5.0.7",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.0.1 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
+    "office-ui-fabric-react": ">=6.0.0 <7.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 5cea189044937..8379024eae6e1 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ssr-tests",
-  "version": "5.0.0",
+  "version": "5.0.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "private": true,
   "repository": {
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
+    "office-ui-fabric-react": ">=6.0.0 <7.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index d064a4786a82c..36d6bc7e19001 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -1,6 +1,6 @@
 {
   "name": "test-bundle-button",
-  "version": "5.0.0",
+  "version": "5.0.1",
   "description": "Testing the button for bundling.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
+    "office-ui-fabric-react": ">=6.0.0 <7.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 4d462dd71f09d..3f174f7c473e0 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -1,7 +1,7 @@
 {
   "name": "todo-app",
   "description": "Sample todo app using office-ui-fabric-react.",
-  "version": "5.0.0",
+  "version": "5.0.1",
   "private": true,
   "scripts": {
     "build": "node ../../scripts/build.js",
@@ -22,10 +22,10 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
+    "office-ui-fabric-react": ">=6.0.0 <7.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
     "tslib": "^1.7.1"
   }
-}
+}
\ No newline at end of file
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 2fd4c3fd8d46d..e5c238221c6c9 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -1,7 +1,7 @@
 {
   "name": "vr-tests",
   "description": "Visual Regression Tests for Office UI Fabric React",
-  "version": "5.0.0",
+  "version": "5.0.1",
   "private": true,
   "scripts": {
     "build": "",
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
+    "office-ui-fabric-react": ">=6.0.0 <7.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/fabric-website/general-website-bugs_2017-10-02-22-18.json b/common/changes/@uifabric/fabric-website/general-website-bugs_2017-10-02-22-18.json
deleted file mode 100644
index c42ee392f5ea2..0000000000000
--- a/common/changes/@uifabric/fabric-website/general-website-bugs_2017-10-02-22-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Updated ResourcePage text and made padding more rtl friendly.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/icon-docs_2017-10-02-16-52.json b/common/changes/@uifabric/fabric-website/icon-docs_2017-10-02-16-52.json
deleted file mode 100644
index c590377895b81..0000000000000
--- a/common/changes/@uifabric/fabric-website/icon-docs_2017-10-02-16-52.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Added section in Get Started page to document how to use icons in components.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/icon-page-website_2017-10-03-15-54.json b/common/changes/@uifabric/fabric-website/icon-page-website_2017-10-03-15-54.json
deleted file mode 100644
index c3c1ff3779428..0000000000000
--- a/common/changes/@uifabric/fabric-website/icon-page-website_2017-10-03-15-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Added Icon component to website",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/positioning-refactor_2017-09-28-20-50.json b/common/changes/@uifabric/utilities/positioning-refactor_2017-09-28-20-50.json
deleted file mode 100644
index 05f0b25dfa580..0000000000000
--- a/common/changes/@uifabric/utilities/positioning-refactor_2017-09-28-20-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Positioning: Refactored positioning and removed deprecated properties",
-      "type": "major"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/2906-fix-tooltip-classname_2017-10-04-20-15.json b/common/changes/office-ui-fabric-react/2906-fix-tooltip-classname_2017-10-04-20-15.json
deleted file mode 100644
index 8957839acb77d..0000000000000
--- a/common/changes/office-ui-fabric-react/2906-fix-tooltip-classname_2017-10-04-20-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "TooltipHost: Specifying a className will no longer prevent innate Tooltip classes from being properly applied",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/andrescb-fix-datepicker-callback_2017-10-02-23-23.json b/common/changes/office-ui-fabric-react/andrescb-fix-datepicker-callback_2017-10-02-23-23.json
deleted file mode 100644
index 9fe069e43731b..0000000000000
--- a/common/changes/office-ui-fabric-react/andrescb-fix-datepicker-callback_2017-10-02-23-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DatePicker - make onSelectDate callback execute as part of SetState instead of after it. This ensures that selected date changes occur in the expected order",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "andrescb@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/dropdown-selectedKey-bugfix_2017-10-02-21-17.json b/common/changes/office-ui-fabric-react/dropdown-selectedKey-bugfix_2017-10-02-21-17.json
deleted file mode 100644
index 62304a3ebf94d..0000000000000
--- a/common/changes/office-ui-fabric-react/dropdown-selectedKey-bugfix_2017-10-02-21-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: fixed logic in getSelectedIndex to support controlled uses",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/general-website-bugs_2017-10-02-22-18.json b/common/changes/office-ui-fabric-react/general-website-bugs_2017-10-02-22-18.json
deleted file mode 100644
index 71b3db22d1f39..0000000000000
--- a/common/changes/office-ui-fabric-react/general-website-bugs_2017-10-02-22-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "General bug fixes: Updated ResourcePage text, Reordered TextField page to give priority to design guidance examples, improved padding and spacing for TextField and ComboBox examples, and various website pages. Synced ComboBox error message spacing to be like TextField and per design specs.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kegorr-Callout-ScrollSelectedToTop_2017-09-26-16-38.json b/common/changes/office-ui-fabric-react/kegorr-Callout-ScrollSelectedToTop_2017-09-26-16-38.json
deleted file mode 100644
index 5f06aa977a412..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-Callout-ScrollSelectedToTop_2017-09-26-16-38.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: when options are scrollable, added prop to scroll selected item to top when callout is opened.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/malozano-splitButtonDisable_2017-10-02-20-48.json b/common/changes/office-ui-fabric-react/malozano-splitButtonDisable_2017-10-02-20-48.json
deleted file mode 100644
index 5e1d968167846..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-splitButtonDisable_2017-10-02-20-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "\"Buttons: adding `primaryDisabled` flag for disabling only the primary action of the split button, leaving the menu enabled.\"",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/positioning-refactor_2017-09-28-20-50.json b/common/changes/office-ui-fabric-react/positioning-refactor_2017-09-28-20-50.json
deleted file mode 100644
index 8e8da55bb2cbd..0000000000000
--- a/common/changes/office-ui-fabric-react/positioning-refactor_2017-09-28-20-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Positioning: Refactored positioning and removed deprecated properties",
-      "type": "major"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/resize-group-header_2017-10-03-21-51.json b/common/changes/office-ui-fabric-react/resize-group-header_2017-10-03-21-51.json
deleted file mode 100644
index 72ce204d2b351..0000000000000
--- a/common/changes/office-ui-fabric-react/resize-group-header_2017-10-03-21-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Removed duplicate header in ResizeGroup.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/searchbox-toolkit_2017-09-29-20-03.json b/common/changes/office-ui-fabric-react/searchbox-toolkit_2017-09-29-20-03.json
deleted file mode 100644
index 9c25793a6914d..0000000000000
--- a/common/changes/office-ui-fabric-react/searchbox-toolkit_2017-09-29-20-03.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added new inline prop for SearchBox and corresonding new example. Adjested the SearchBoxPage to better reflect the current toolkit documentation.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/tooltip-page_2017-10-02-18-24.json b/common/changes/office-ui-fabric-react/tooltip-page_2017-10-02-18-24.json
deleted file mode 100644
index 51d22cf97c101..0000000000000
--- a/common/changes/office-ui-fabric-react/tooltip-page_2017-10-02-18-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixed duplicate header on Tooltip page.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-edwliu-fix-list-example-rtl_2017-09-27-20-21.json b/common/changes/office-ui-fabric-react/v-edwliu-fix-list-example-rtl_2017-09-27-20-21.json
deleted file mode 100644
index d3d23dee445b8..0000000000000
--- a/common/changes/office-ui-fabric-react/v-edwliu-fix-list-example-rtl_2017-09-27-20-21.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "List: Fix Grid example to read right to left in RTL mode",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-edwliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-sept-contrast-bugs_2017-09-21-18-01.json b/common/changes/office-ui-fabric-react/v-krbrow-sept-contrast-bugs_2017-09-21-18-01.json
deleted file mode 100644
index 8d55603214d07..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-sept-contrast-bugs_2017-09-21-18-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "High contrast fixes for breadcrumb, contextualMenu, overlay, pivot, calendar, and searchbox",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/webkit-borderRadius-fix_2017-10-04-14-52.json b/common/changes/office-ui-fabric-react/webkit-borderRadius-fix_2017-10-04-14-52.json
deleted file mode 100644
index dd38b79ba8b14..0000000000000
--- a/common/changes/office-ui-fabric-react/webkit-borderRadius-fix_2017-10-04-14-52.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "BaseButton: Added borderRadius:0 to fix new default styles in webkit",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 5de80888e0434..55056d6bcdd5e 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,21 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "5.0.4",
+      "tag": "@uifabric/example-app-base_v5.0.4",
+      "date": "Wed, 04 Oct 2017 22:40:22 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.1.0 <6.0.0` to `>=5.1.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.0.1 <6.0.0` to `>=6.0.0 <7.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.3",
       "tag": "@uifabric/example-app-base_v5.0.3",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index 9cf1b22c5f7a4..b76b21494416e 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Fri, 29 Sep 2017 10:20:24 GMT and should not be manually modified.
+This log was last generated on Wed, 04 Oct 2017 22:40:22 GMT and should not be manually modified.
+
+## 5.0.4
+Wed, 04 Oct 2017 22:40:22 GMT
+
+*Changes not tracked*
 
 ## 5.0.3
 Fri, 29 Sep 2017 10:20:24 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index b44083ee15751..376656f51138a 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "5.0.3",
+  "version": "5.0.4",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -38,8 +38,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.1.0 <6.0.0",
-    "@uifabric/utilities": ">=5.0.1 <6.0.0",
+    "@uifabric/styling": ">=5.1.1 <6.0.0",
+    "@uifabric/utilities": ">=6.0.0 <7.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 394c141a1f615..536e9b4441db7 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,21 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.0.3",
+      "tag": "@uifabric/experiments_v5.0.3",
+      "date": "Wed, 04 Oct 2017 22:40:22 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.3.0 <6.0.0` to `>=6.0.0 <7.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=5.0.3 <6.0.0` to `>=5.0.4 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.2",
       "tag": "@uifabric/experiments_v5.0.2",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index d12be64f2fddc..89c53ab79987f 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Sat, 30 Sep 2017 01:26:37 GMT and should not be manually modified.
+This log was last generated on Wed, 04 Oct 2017 22:40:22 GMT and should not be manually modified.
+
+## 5.0.3
+Wed, 04 Oct 2017 22:40:22 GMT
+
+*Changes not tracked*
 
 ## 5.0.2
 Sat, 30 Sep 2017 01:26:37 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index a53664a59b09f..d57340d41de78 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.0.2",
+  "version": "5.0.3",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -28,7 +28,7 @@
     "@types/jest": "^21.1.0",
     "@types/enzyme": "^2.8.8",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=5.0.3 <6.0.0",
+    "@uifabric/example-app-base": ">=5.0.4 <6.0.0",
     "@uifabric/icons": ">=5.0.1 <6.0.0",
     "es6-weak-map": "^2.0.2",
     "enzyme": "^2.9.1",
@@ -42,7 +42,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
+    "office-ui-fabric-react": ">=6.0.0 <7.0.0",
     "@uifabric/icons": ">=5.0.1 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 9fd9774ace705..c6cf7717dc295 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -23,7 +23,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.0.1 <6.0.0",
+    "@uifabric/styling": ">=5.1.1 <6.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 1203960bd8f9f..441e22ed10089 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,95 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "6.0.0",
+      "tag": "office-ui-fabric-react_v6.0.0",
+      "date": "Wed, 04 Oct 2017 22:40:22 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Michael Loughry <miclo@microsoft.com>",
+            "commit": "36e1182f5f4f9a268d93377d3bea12c493fb4e17",
+            "comment": "TooltipHost: Specifying a className will no longer prevent innate Tooltip classes from being properly applied"
+          },
+          {
+            "author": "Andres Camargo <andrescb@microsoft.com>",
+            "commit": "7f7200ea84ca73ef5dfd370ae1ac5986a8f24c56",
+            "comment": "DatePicker - make onSelectDate callback execute as part of SetState instead of after it. This ensures that selected date changes occur in the expected order"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "a245be8240b07346d4eba30c622c22e202463724",
+            "comment": "Dropdown: fixed logic in getSelectedIndex to support controlled uses"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "ca3473a1d65c8124901173ee0aeb7c7af5b220ef",
+            "comment": "General bug fixes: Updated ResourcePage text, Reordered TextField page to give priority to design guidance examples, improved padding and spacing for TextField and ComboBox examples, and various website pages. Synced ComboBox error message spacing to be like TextField and per design specs."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "4267f5f8555395b1b080a3a21445cdf5faf6c373",
+            "comment": "Removed duplicate header in ResizeGroup."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "d8a8001fd24c3e2ae2ea1e0754acac98f80d4492",
+            "comment": "Added new inline prop for SearchBox and corresonding new example. Adjested the SearchBoxPage to better reflect the current toolkit documentation."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "6e4d8f5e07328bad7c50e0671d85c1fb8a9db79a",
+            "comment": "Fixed duplicate header on Tooltip page."
+          },
+          {
+            "author": "Eddie Liu <leddie24@gmail.com>",
+            "commit": "e951967ea0961a2945d6648b6f913ba662f67c56",
+            "comment": "List: Fix Grid example to read right to left in RTL mode"
+          },
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "da8de4f924f3ad6381a53b734925858abdaed604",
+            "comment": "High contrast fixes for breadcrumb, contextualMenu, overlay, pivot, calendar, and searchbox"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "72c218322ac10247c6f2693d68abc2e3df9ba7af",
+            "comment": "BaseButton: Added borderRadius:0 to fix new default styles in webkit"
+          }
+        ],
+        "minor": [
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "de1162806fc4d1ff50c2d6d82e453d1fb1bc0b25",
+            "comment": "ComboBox: when options are scrollable, added prop to scroll selected item to top when callout is opened."
+          },
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "75ce32c363d1415c4d5bf28ac29c38df9dddea1f",
+            "comment": "\"Buttons: adding `primaryDisabled` flag for disabling only the primary action of the split button, leaving the menu enabled.\""
+          }
+        ],
+        "major": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "1bad538220cc18885e7e6efd7c4cc0e7846c25d4",
+            "comment": "Positioning: Refactored positioning and removed deprecated properties"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.1.0 <6.0.0` to `>=5.1.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.0.1 <6.0.0` to `>=6.0.0 <7.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=5.0.3 <6.0.0` to `>=5.0.4 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.3.0",
       "tag": "office-ui-fabric-react_v5.3.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 6549a1b57a3c1..f7a6e14f7475e 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,31 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 02 Oct 2017 10:19:43 GMT and should not be manually modified.
+This log was last generated on Wed, 04 Oct 2017 22:40:22 GMT and should not be manually modified.
+
+## 6.0.0
+Wed, 04 Oct 2017 22:40:22 GMT
+
+### Breaking changes
+
+- Positioning: Refactored positioning and removed deprecated properties
+
+### Minor changes
+
+- ComboBox: when options are scrollable, added prop to scroll selected item to top when callout is opened.
+- "Buttons: adding `primaryDisabled` flag for disabling only the primary action of the split button, leaving the menu enabled."
+
+### Patches
+
+- TooltipHost: Specifying a className will no longer prevent innate Tooltip classes from being properly applied
+- DatePicker - make onSelectDate callback execute as part of SetState instead of after it. This ensures that selected date changes occur in the expected order
+- Dropdown: fixed logic in getSelectedIndex to support controlled uses
+- General bug fixes: Updated ResourcePage text, Reordered TextField page to give priority to design guidance examples, improved padding and spacing for TextField and ComboBox examples, and various website pages. Synced ComboBox error message spacing to be like TextField and per design specs.
+- Removed duplicate header in ResizeGroup.
+- Added new inline prop for SearchBox and corresonding new example. Adjested the SearchBoxPage to better reflect the current toolkit documentation.
+- Fixed duplicate header on Tooltip page.
+- List: Fix Grid example to read right to left in RTL mode
+- High contrast fixes for breadcrumb, contextualMenu, overlay, pivot, calendar, and searchbox
+- BaseButton: Added borderRadius:0 to fix new default styles in webkit
 
 ## 5.3.0
 Mon, 02 Oct 2017 10:19:43 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 836fb0895c32b..38c0019ade4ed 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.3.0",
+  "version": "6.0.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -26,7 +26,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=5.0.3 <6.0.0",
+    "@uifabric/example-app-base": ">=5.0.4 <6.0.0",
     "enzyme": "^2.9.1",
     "es6-promise": "^4.1.0",
     "es6-map": "^0.1.5",
@@ -45,8 +45,8 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.0.1 <6.0.0",
     "@uifabric/merge-styles": ">=5.2.0 <6.0.0",
-    "@uifabric/styling": ">=5.1.0 <6.0.0",
-    "@uifabric/utilities": ">=5.0.1 <6.0.0",
+    "@uifabric/styling": ">=5.1.1 <6.0.0",
+    "@uifabric/utilities": ">=6.0.0 <7.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 149b1211b69b8..0fc00deac9bef 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,18 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.1.1",
+      "tag": "@uifabric/styling_v5.1.1",
+      "date": "Wed, 04 Oct 2017 22:40:22 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.0.1 <6.0.0` to `>=6.0.0 <7.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.1.0",
       "tag": "@uifabric/styling_v5.1.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 0aeabf0c947b2..10d0e4508f2cb 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Sat, 30 Sep 2017 01:26:37 GMT and should not be manually modified.
+This log was last generated on Wed, 04 Oct 2017 22:40:22 GMT and should not be manually modified.
+
+## 5.1.1
+Wed, 04 Oct 2017 22:40:22 GMT
+
+*Changes not tracked*
 
 ## 5.1.0
 Sat, 30 Sep 2017 01:26:37 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 92c1a85d7621c..261105ad88507 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.1.0",
+  "version": "5.1.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=5.0.1 <6.0.0",
+    "@uifabric/utilities": ">=6.0.0 <7.0.0",
     "@uifabric/merge-styles": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 917947db9cc65..e1b175ea49f10 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "6.0.0",
+      "tag": "@uifabric/utilities_v6.0.0",
+      "date": "Wed, 04 Oct 2017 22:40:22 GMT",
+      "comments": {
+        "major": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "1bad538220cc18885e7e6efd7c4cc0e7846c25d4",
+            "comment": "Positioning: Refactored positioning and removed deprecated properties"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.1",
       "tag": "@uifabric/utilities_v5.0.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index b8bb85f0b05a8..0b8879fa30b74 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Wed, 27 Sep 2017 00:20:58 GMT and should not be manually modified.
+This log was last generated on Wed, 04 Oct 2017 22:40:22 GMT and should not be manually modified.
+
+## 6.0.0
+Wed, 04 Oct 2017 22:40:22 GMT
+
+### Breaking changes
+
+- Positioning: Refactored positioning and removed deprecated properties
 
 ## 5.0.1
 Wed, 27 Sep 2017 00:20:58 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 55dc92af4d2f1..6cfe96fb22394 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.0.1",
+  "version": "6.0.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From a5c8a8d29987e03cf87f704b74e38d181516afca Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 4 Oct 2017 15:43:36 -0700
Subject: [PATCH 0782/1641] Icon: render space for icon if iconName="" passed
 (#2916)

* Added min-width for button icons so that its easy to create buttons with space for an icon

* Change file

* Added prop to icon to provide placeholder fallback if no iconName is passed

* fixed conflcits

* cleaned up errors with 5.0

* Fixed placeholder styles

* Update placeholder to key off of 0 length iconName string

* Update contextualmenu to use same '' syntax for the empty icon space
---
 apps/vr-tests/src/stories/Button.stories.tsx    | 10 ++++++++++
 .../button-icon-minWidth_2017-09-21-18-42.json  | 11 +++++++++++
 packages/office-ui-fabric-react/package.json    |  2 +-
 .../ContextualMenu/ContextualMenu.tsx           |  2 +-
 .../src/components/Icon/Icon.Props.ts           |  3 ++-
 .../src/components/Icon/Icon.classNames.ts      |  5 ++++-
 .../src/components/Icon/Icon.tsx                | 17 +++++++++++++++++
 7 files changed, 46 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/button-icon-minWidth_2017-09-21-18-42.json

diff --git a/apps/vr-tests/src/stories/Button.stories.tsx b/apps/vr-tests/src/stories/Button.stories.tsx
index def24fc5e0535..dac2989e97105 100644
--- a/apps/vr-tests/src/stories/Button.stories.tsx
+++ b/apps/vr-tests/src/stories/Button.stories.tsx
@@ -56,6 +56,16 @@ storiesOf('Button Default', module)
   .add('Primary Disabled', () => (<DefaultButton {...baseProps} primary={ true } disabled={ true } />))
   .add('Primary Checked', () => (<DefaultButton {...baseProps} primary={ true } checked={ true } />));
 
+storiesOf('Button with placeholder', module)
+  .addDecorator(FabricDecorator)
+  .add('primary with placeholder', () => (
+    <div>
+      <DefaultButton {...baseProps} iconProps={ { iconName: '' } } primary={ true } />
+      <br />
+      <DefaultButton {...baseProps} iconProps={ { iconName: 'Add' } } primary={ true } />
+    </div>
+  ));
+
 storiesOf('Button Action', module)
   .addDecorator(FabricDecorator)
   .addDecorator(story => (
diff --git a/common/changes/office-ui-fabric-react/button-icon-minWidth_2017-09-21-18-42.json b/common/changes/office-ui-fabric-react/button-icon-minWidth_2017-09-21-18-42.json
new file mode 100644
index 0000000000000..5eda5706a1cbc
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/button-icon-minWidth_2017-09-21-18-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added min-width for button icons so that its easy to create buttons with space for an icon",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 38c0019ade4ed..b3e79acf44ba2 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -54,4 +54,4 @@
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 018697584f00a..0ff5deecf2ede 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -476,7 +476,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       <div className={ css('ms-ContextualMenu-linkContent', styles.linkContent) }>
         { (hasCheckmarks) ? (
           <Icon
-            iconName={ isItemChecked === true ? 'CheckMark' : 'CustomIcon' }
+            iconName={ isItemChecked === true ? 'CheckMark' : '' }
             className={ css('ms-ContextualMenu-icon', styles.icon) }
             onClick={ this._onItemClick.bind(this, item) }
           />
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts b/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
index e346b5a2c4bce..b09195c22abbe 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
@@ -30,12 +30,13 @@ export enum IconType {
 
 export interface IIconStyles {
   root?: IStyle;
+  rootHasPlaceHolder?: IStyle;
   imageContainer?: IStyle;
 }
 
 export interface IIconProps extends React.HTMLAttributes<HTMLElement> {
   /**
-   * The name of the icon to use from the icon font.
+   * The name of the icon to use from the icon font. If string is empty, a placeholder icon will be rendered the same width as an icon
    */
   iconName?: string;
 
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.classNames.ts b/packages/office-ui-fabric-react/src/components/Icon/Icon.classNames.ts
index 80ac0342a5841..56f16bbee36f3 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.classNames.ts
@@ -8,6 +8,7 @@ import { IIconStyles } from './Icon.Props';
 
 export interface IIconClassNames {
   root?: string;
+  rootHasPlaceHolder?: string;
   imageContainer?: string;
 }
 
@@ -20,7 +21,9 @@ export const getClassNames = memoizeFunction((
       root: {
         display: 'inline-block'
       },
-
+      rootHasPlaceHolder: {
+        width: '1em'
+      },
       imageContainer: {
         overflow: 'hidden'
       }
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
index d0cd26fb8c1d3..cc3908cfd5566 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
@@ -42,6 +42,23 @@ export const Icon = (props: IIconProps): JSX.Element => {
         <Image { ...props.imageProps as any } />
       </div>
     );
+  } else if (typeof iconName === 'string' && iconName.length === 0) {
+    return (
+      <i
+        aria-label={ ariaLabel }
+        { ...(ariaLabel ? {} : {
+          role: 'presentation',
+          'aria-hidden': true
+        }) }
+        { ...getNativeProps(props, htmlElementProperties) }
+        className={
+          css(
+            'ms-Icon ms-Icon-placeHolder',
+            classNames.rootHasPlaceHolder,
+            props.className
+          ) }
+      />
+    );
   } else {
     let iconDefinition = getIcon(iconName) || {
       subset: {

From 8dee653c676f02a9a425eba5d1ec203419d46d10 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Wed, 4 Oct 2017 23:27:26 -0700
Subject: [PATCH 0783/1641] Add stories for Storybook/Screener (#3021)

* Added stories, add ex-app-base as dependency

* Remove example-app-base as dependency, hard code data for lists so it's not randomized

* Remove example-app-base from dependencies

* Fix DatePicker Screener steps

* Fix cropping and steps order
---
 apps/vr-tests/src/common/TestImages.ts        |  15 ++
 .../vr-tests/src/stories/Checkbox.stories.tsx |  49 ++++
 .../src/stories/ChoiceGroup.stories.tsx       | 101 +++++++++
 .../src/stories/ColorPicker.stories.tsx       |  25 +++
 .../vr-tests/src/stories/ComboBox.stories.tsx |  92 ++++++++
 .../src/stories/CommandBar.stories.tsx        | 113 ++++++++++
 .../src/stories/ContextualMenu.stories.tsx    | 212 ++++++++++++++++++
 .../src/stories/DatePicker.stories.tsx        |  35 +++
 .../src/stories/DetailsList.stories.tsx       | 112 +++++++++
 apps/vr-tests/src/stories/Dialog.stories.tsx  |  72 ++++++
 .../src/stories/DocumentCard.stories.tsx      | 117 ++++++++++
 .../vr-tests/src/stories/Dropdown.stories.tsx |  78 +++++++
 .../vr-tests/src/stories/Facepile.stories.tsx |  83 +++++++
 .../src/stories/GroupedList.stories.tsx       |  45 ++++
 apps/vr-tests/src/stories/Image.css           |   4 +
 apps/vr-tests/src/stories/Image.stories.tsx   | 141 ++++++++++++
 apps/vr-tests/src/stories/Layer.stories.tsx   |  22 ++
 apps/vr-tests/src/stories/List.stories.tsx    |  29 +++
 apps/vr-tests/src/stories/Modal.stories.tsx   |  28 +++
 apps/vr-tests/src/stories/Nav.stories.tsx     |  69 ++++++
 apps/vr-tests/src/stories/Overlay.stories.tsx |  25 +++
 apps/vr-tests/src/stories/Panel.stories.tsx   |  69 ++++++
 22 files changed, 1536 insertions(+)
 create mode 100644 apps/vr-tests/src/common/TestImages.ts
 create mode 100644 apps/vr-tests/src/stories/Checkbox.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/ChoiceGroup.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/ColorPicker.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/ComboBox.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/CommandBar.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/ContextualMenu.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/DatePicker.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/DetailsList.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/Dialog.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/DocumentCard.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/Dropdown.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/Facepile.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/GroupedList.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/Image.css
 create mode 100644 apps/vr-tests/src/stories/Image.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/Layer.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/List.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/Modal.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/Nav.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/Overlay.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/Panel.stories.tsx

diff --git a/apps/vr-tests/src/common/TestImages.ts b/apps/vr-tests/src/common/TestImages.ts
new file mode 100644
index 0000000000000..d1cd8d22f2cc7
--- /dev/null
+++ b/apps/vr-tests/src/common/TestImages.ts
@@ -0,0 +1,15 @@
+const baseProductionCdnUrl = 'https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets/';
+
+export const TestImages = {
+  choiceGroupBarUnselected: baseProductionCdnUrl + 'choicegroup-bar-unselected.png',
+  choiceGroupBarSelected: baseProductionCdnUrl + 'choicegroup-bar-selected.png',
+  choiceGroupPieUnselected: baseProductionCdnUrl + 'choicegroup-pie-unselected.png',
+  choiceGroupPieSelected: baseProductionCdnUrl + 'choicegroup-pie-selected.png',
+  documentPreview: baseProductionCdnUrl + 'document-preview.png',
+  documentPreviewTwo: baseProductionCdnUrl + 'document-preview2.png',
+  documentPreviewThree: baseProductionCdnUrl + 'document-preview3.png',
+  iconOne: baseProductionCdnUrl + 'icon-one.png',
+  iconPpt: baseProductionCdnUrl + 'icon-ppt.png',
+  personaFemale: baseProductionCdnUrl + 'persona-female.png',
+  personaMale: baseProductionCdnUrl + 'persona-male.png'
+};
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Checkbox.stories.tsx b/apps/vr-tests/src/stories/Checkbox.stories.tsx
new file mode 100644
index 0000000000000..bfd21851b4e2c
--- /dev/null
+++ b/apps/vr-tests/src/stories/Checkbox.stories.tsx
@@ -0,0 +1,49 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { Checkbox } from 'office-ui-fabric-react';
+
+storiesOf('Checkbox', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Unchecked', () => (
+    <Checkbox
+      label='Unchecked checkbox'
+    />
+  ))
+  .add('Checked', () => (
+    <Checkbox
+      label='Checked checkbox'
+      checked
+    />
+  ))
+  .add('Unchecked disabled', () => (
+    <Checkbox
+      label='Unchecked disabled checkbox'
+      disabled
+    />
+  ))
+  .add('Checked disabled', () => (
+    <Checkbox
+      label='Checked disabled checkbox'
+      checked
+      disabled
+    />
+  ))
+  .add('End', () => (
+    <Checkbox
+      label='Checkbox end'
+      boxSide='end'
+    />
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/ChoiceGroup.stories.tsx b/apps/vr-tests/src/stories/ChoiceGroup.stories.tsx
new file mode 100644
index 0000000000000..38514271f950c
--- /dev/null
+++ b/apps/vr-tests/src/stories/ChoiceGroup.stories.tsx
@@ -0,0 +1,101 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { ChoiceGroup } from 'office-ui-fabric-react';
+import { TestImages } from '../common/TestImages';
+
+const options = [
+  {
+    key: 'A',
+    text: 'Selected'
+  },
+  {
+    key: 'B',
+    text: 'Unselected',
+  },
+  {
+    key: 'C',
+    text: 'Disabled',
+    disabled: true
+  }
+];
+
+storiesOf('ChoiceGroup', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .hover('div.ms-ChoiceField:nth-of-type(1)')
+        .snapshot('hover selected', { cropTo: '.testWrapper' })
+        .hover('div.ms-ChoiceField:nth-of-type(2)')
+        .snapshot('hover unselected', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (
+    <ChoiceGroup
+      defaultSelectedKey='A'
+      options={ options }
+      label='Pick one'
+    />
+  ))
+  .add('Required', () => (
+    <ChoiceGroup
+      defaultSelectedKey='A'
+      options={ options }
+      label='Pick one'
+      required
+    />
+  ))
+  .add('With icons', () => (
+    <ChoiceGroup
+      label='Pick one icon'
+      defaultSelectedKey='day'
+      options={ [
+        {
+          key: 'day',
+          iconProps: { iconName: 'CalendarDay' },
+          text: 'Day'
+        },
+        {
+          key: 'week',
+          iconProps: { iconName: 'CalendarWeek' },
+          text: 'Week'
+        },
+        {
+          key: 'month',
+          iconProps: { iconName: 'Calendar' },
+          text: 'Month',
+          disabled: true
+        }
+      ] }
+    />
+  ))
+  .add('With images', () => (
+    <ChoiceGroup
+      label='Pick one image'
+      defaultSelectedKey='bar'
+      options={ [
+        {
+          key: 'bar',
+          imageSrc: TestImages.choiceGroupBarUnselected,
+          selectedImageSrc: TestImages.choiceGroupBarSelected,
+          imageSize: { width: 32, height: 32 },
+          text: 'Bar chart'
+        },
+        {
+          key: 'pie',
+          imageSrc: TestImages.choiceGroupBarUnselected,
+          selectedImageSrc: TestImages.choiceGroupBarSelected,
+          imageSize: { width: 32, height: 32 },
+          text: 'Pie chart'
+        }
+      ] }
+    />
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/ColorPicker.stories.tsx b/apps/vr-tests/src/stories/ColorPicker.stories.tsx
new file mode 100644
index 0000000000000..73652b0ebd406
--- /dev/null
+++ b/apps/vr-tests/src/stories/ColorPicker.stories.tsx
@@ -0,0 +1,25 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { ColorPicker } from 'office-ui-fabric-react';
+
+storiesOf('ColorPicker', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (
+    <ColorPicker color='#FFF' />
+  ))
+  .add('Blue', () => (
+    <ColorPicker color='#48B' />
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/ComboBox.stories.tsx b/apps/vr-tests/src/stories/ComboBox.stories.tsx
new file mode 100644
index 0000000000000..87648594f0f98
--- /dev/null
+++ b/apps/vr-tests/src/stories/ComboBox.stories.tsx
@@ -0,0 +1,92 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecoratorTall } from '../utilities';
+import { ComboBox, SelectableOptionMenuItemType } from 'office-ui-fabric-react';
+
+let testOptions = [
+  { key: 'Header', text: 'Theme Fonts', itemType: SelectableOptionMenuItemType.Header },
+  { key: 'A', text: 'Arial Black' },
+  { key: 'B', text: 'Times New Roman' },
+  { key: 'divider_2', text: '-', itemType: SelectableOptionMenuItemType.Divider },
+  { key: 'Header1', text: 'Other Options', itemType: SelectableOptionMenuItemType.Header },
+  { key: 'D', text: 'Option d' },
+];
+
+let fontMapping = {
+  ['Arial Black']: '"Arial Black", "Arial Black_MSFontService", sans-serif',
+  ['Time New Roman']: '"Times New Roman", "Times New Roman_MSFontService", serif',
+};
+
+let onRenderFontOption = (item) => {
+  if (item.itemType === SelectableOptionMenuItemType.Header ||
+    item.itemType === SelectableOptionMenuItemType.Divider) {
+    return <span className={ 'ms-ComboBox-optionText' }>{ item.text }</span>;
+  }
+
+  let fontFamily = fontMapping[item.text];
+
+  if (fontFamily === null || fontFamily === undefined) {
+    let newFontFamily: string = item.text;
+    if (newFontFamily.indexOf(' ') > -1) {
+      newFontFamily = '"' + newFontFamily + '"';
+    }
+
+    // add a default fallback font
+    newFontFamily += ',"Segoe UI",Tahoma,Sans-Serif';
+
+    fontMapping = { ...fontMapping, [fontFamily]: newFontFamily };
+    fontFamily = newFontFamily;
+  }
+
+  // tslint:disable-next-line:jsx-ban-props
+  return <span className={ 'ms-ComboBox-optionText' } style={ { fontFamily: fontFamily && fontFamily } }>{ item.text }</span>;
+};
+
+storiesOf('ComboBox', module)
+  .addDecorator(FabricDecoratorTall)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .hover('.ms-ComboBox-Input')
+        .snapshot('hover', { cropTo: '.testWrapper' })
+        .click('.ms-Button-flexContainer')
+        .hover('.ms-Button-flexContainer')
+        .snapshot('click', { cropTo: '.ms-Layer' }) // Dropdown extends beyond testWrapper
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (
+    <ComboBox
+      defaultSelectedKey='A'
+      label='Default with dividers'
+      ariaLabel='Basic ComboBox example'
+      autoComplete='on'
+      options={ testOptions }
+    />
+  ))
+  .add('Styled', () => (
+    <ComboBox
+      defaultSelectedKey='A'
+      label='Styled with dividers'
+      ariaLabel='Basic ComboBox example'
+      autoComplete='on'
+      options={ testOptions }
+      onRenderOption={ onRenderFontOption }
+    />
+  ))
+  .add('Disabled', () => (
+    <ComboBox
+      defaultSelectedKey='A'
+      label='Disabled'
+      ariaLabel='Basic ComboBox example'
+      autoComplete='on'
+      options={ testOptions }
+      disabled
+    />
+  ));
diff --git a/apps/vr-tests/src/stories/CommandBar.stories.tsx b/apps/vr-tests/src/stories/CommandBar.stories.tsx
new file mode 100644
index 0000000000000..4915dc68c6207
--- /dev/null
+++ b/apps/vr-tests/src/stories/CommandBar.stories.tsx
@@ -0,0 +1,113 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecoratorTall } from '../utilities';
+import { CommandBar } from 'office-ui-fabric-react';
+
+const items = [
+  {
+    key: 'newItem',
+    name: 'New',
+    icon: 'Add',
+    subMenuProps: {
+      items: [
+        {
+          key: 'emailMessage',
+          name: 'Email message',
+          icon: 'Mail'
+        },
+        {
+          key: 'calendarEvent',
+          name: 'Calendar event',
+          icon: 'Calendar'
+        }
+      ],
+    },
+  },
+  {
+    key: 'upload',
+    name: 'Upload',
+    icon: 'Upload'
+  },
+  {
+    key: 'share',
+    name: 'Share',
+    icon: 'Share'
+  },
+  {
+    key: 'download',
+    name: 'Download',
+    icon: 'Download'
+  },
+  {
+    key: 'disabled',
+    name: 'Disabled...',
+    icon: 'Cancel',
+    disabled: true
+  }
+];
+
+const farItems = [
+  {
+    key: 'sort',
+    name: 'Sort',
+    icon: 'SortLines'
+  },
+  {
+    key: 'tile',
+    name: 'Grid view',
+    icon: 'Tiles'
+  },
+  {
+    key: 'info',
+    name: 'Info',
+    icon: 'Info'
+  }
+];
+
+storiesOf('CommandBar', module)
+  .addDecorator(FabricDecoratorTall)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .hover('.ms-CommandBarItem-link')
+        .snapshot('hover', { cropTo: '.testWrapper' })
+        .click('.ms-CommandBarItem-link')
+        .hover('.ms-CommandBarItem-link')
+        .snapshot('click', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (
+    <CommandBar
+      isSearchBoxVisible
+      items={ items }
+      farItems={ farItems }
+    />
+  ))
+  .add('Without search bar', () => (
+    <CommandBar
+      isSearchBoxVisible={ false }
+      items={ items }
+      farItems={ farItems }
+    />
+  ))
+  .add('Text only', () => (
+    <CommandBar
+      isSearchBoxVisible={ false }
+      items={ items.map(item => ({ ...item, icon: '' })) }
+      farItems={ farItems.map(item => ({ ...item, icon: '' })) }
+    />
+  ))
+  .add('Icons only', () => (
+    <CommandBar
+      isSearchBoxVisible={ false }
+      items={ items.map(item => ({ ...item, name: '' })) }
+      farItems={ farItems.map(item => ({ ...item, name: '' })) }
+    />
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/ContextualMenu.stories.tsx b/apps/vr-tests/src/stories/ContextualMenu.stories.tsx
new file mode 100644
index 0000000000000..f391e0d9b90c7
--- /dev/null
+++ b/apps/vr-tests/src/stories/ContextualMenu.stories.tsx
@@ -0,0 +1,212 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { ContextualMenu, ContextualMenuItemType } from 'office-ui-fabric-react';
+
+const items = [
+  {
+    key: 'newItem',
+    name: 'New'
+  },
+  {
+    key: 'divider_1',
+    itemType: ContextualMenuItemType.Divider
+  },
+  {
+    key: 'rename',
+    name: 'Rename'
+  },
+  {
+    key: 'edit',
+    name: 'Edit'
+  },
+  {
+    key: 'properties',
+    name: 'Properties'
+  },
+  {
+    key: 'disabled',
+    name: 'Disabled item',
+    disabled: true
+  }
+];
+
+const itemsWithIcons = [
+  {
+    key: 'newItem',
+    iconProps: {
+      iconName: 'Add'
+    },
+    name: 'New'
+  },
+  {
+    key: 'upload',
+    iconProps: {
+      iconName: 'Upload',
+      style: {
+        color: 'salmon'
+      }
+    },
+    name: 'Upload',
+    title: 'Upload a file'
+  },
+  {
+    key: 'divider_1',
+    itemType: ContextualMenuItemType.Divider
+  },
+  {
+    key: 'share',
+    iconProps: {
+      iconName: 'Share'
+    },
+    name: 'Share'
+  },
+  {
+    key: 'print',
+    iconProps: {
+      iconName: 'Print'
+    },
+    name: 'Print'
+  },
+  {
+    key: 'music',
+    iconProps: {
+      iconName: 'MusicInCollectionFill'
+    },
+    name: 'Music',
+  }
+];
+
+const itemsWithSubmenu = [
+  {
+    key: 'newItem',
+    subMenuProps: {
+      items: [
+        {
+          key: 'emailMessage',
+          name: 'Email message',
+          title: 'Create an email'
+        },
+        {
+          key: 'calendarEvent',
+          name: 'Calendar event',
+          title: 'Create a calendar event',
+        }
+      ],
+    },
+    name: 'New'
+  },
+  {
+    key: 'share',
+    subMenuProps: {
+      items: [
+        {
+          key: 'sharetotwitter',
+          name: 'Share to Twitter',
+        },
+        {
+          key: 'sharetofacebook',
+          name: 'Share to Facebook',
+        },
+        {
+          key: 'sharetoemail',
+          name: 'Share to Email',
+          subMenuProps: {
+            items: [
+              {
+                key: 'sharetooutlook_1',
+                name: 'Share to Outlook',
+                title: 'Share to Outlook',
+              },
+              {
+                key: 'sharetogmail_1',
+                name: 'Share to Gmail',
+                title: 'Share to Gmail',
+              }
+            ],
+          },
+        },
+      ],
+    },
+    name: 'Share'
+  }
+];
+
+const itemsWithHeaders = [
+  {
+    key: 'section',
+    itemType: ContextualMenuItemType.Section,
+    sectionProps: {
+      topDivider: true,
+      bottomDivider: true,
+      title: 'Actions',
+      items: [
+        {
+          key: 'newItem',
+          name: 'New',
+        },
+        {
+          key: 'deleteItem',
+          name: 'Delete',
+        }
+      ]
+    }
+  },
+  {
+    key: 'section',
+    itemType: ContextualMenuItemType.Section,
+    sectionProps: {
+      title: 'Social',
+      items: [
+        {
+          key: 'share',
+          name: 'Share'
+        },
+        {
+          key: 'print',
+          name: 'Print'
+        }
+      ]
+    }
+  }
+];
+
+storiesOf('ContextualMenu', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.ms-Layer' })
+        .hover('.ms-ContextualMenu-linkContent')
+        .snapshot('hover', { cropTo: '.ms-Layer' })
+        .click('.ms-ContextualMenu-linkContent')
+        .hover('.ms-ContextualMenu-linkContent')
+        .snapshot('click', { cropTo: '.ms-Layer' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (
+    <ContextualMenu
+      items={ items }
+    />
+  ))
+  .add('With icons', () => (
+    <ContextualMenu
+      items={ itemsWithIcons }
+    />
+  ))
+  .add('With submenu', () => (
+    <ContextualMenu
+      items={ itemsWithSubmenu }
+    />
+  ))
+  .add('With headers', () => (
+    <ContextualMenu
+      items={ itemsWithHeaders }
+    />
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/DatePicker.stories.tsx b/apps/vr-tests/src/stories/DatePicker.stories.tsx
new file mode 100644
index 0000000000000..c4702d1b82c16
--- /dev/null
+++ b/apps/vr-tests/src/stories/DatePicker.stories.tsx
@@ -0,0 +1,35 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { DatePicker } from 'office-ui-fabric-react';
+
+const date = new Date(2010, 1, 12);
+storiesOf('DatePicker', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .hover('.ms-DatePicker')
+        .snapshot('hover datepicker', { cropTo: '.testWrapper' })
+        .click('.ms-DatePicker')
+        .hover('.ms-DatePicker')
+        .snapshot('click', { cropTo: '.ms-Layer' })
+        .hover('.ms-DatePicker-day')
+        .snapshot('hover day', { cropTo: '.ms-Layer' })
+        .hover('.ms-DatePicker-monthOption')
+        .snapshot('hover month', { cropTo: '.ms-Layer' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (
+    <DatePicker
+      value={ date }
+    />
+  ))
+  ;
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/DetailsList.stories.tsx b/apps/vr-tests/src/stories/DetailsList.stories.tsx
new file mode 100644
index 0000000000000..c2f2bd30c42aa
--- /dev/null
+++ b/apps/vr-tests/src/stories/DetailsList.stories.tsx
@@ -0,0 +1,112 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { DetailsList, DetailsListLayoutMode, IColumn } from 'office-ui-fabric-react';
+
+const url = 'https://static2.sharepointonline.com/files/fabric/assets/brand-icons/document/svg/';
+
+// tslint:disable:max-line-length
+const items = [
+  { 'name': 'Adaute.pub', 'value': 'Adaute.pub', 'modifiedBy': 'Sit Ut', 'dateModified': '9/19/2013', 'dateModifiedValue': 1379659392209, 'fileSize': '81 KB', 'fileSizeRaw': 81 },
+  { 'name': 'Addolor.xlsx', 'value': 'Addolor.xlsx', 'modifiedBy': 'Enim Ea', 'dateModified': '9/29/2014', 'dateModifiedValue': 1412038234826, 'fileSize': '51 KB', 'fileSizeRaw': 51 },
+  { 'name': 'Adea.vsdx', 'value': 'Adea.vsdx', 'modifiedBy': 'Ut Laborum', 'dateModified': '4/26/2014', 'dateModifiedValue': 1398507263589, 'fileSize': '104 KB', 'fileSizeRaw': 104 },
+  { 'name': 'Adipiscingaute.xls', 'value': 'Adipiscingaute.xls', 'modifiedBy': 'Enim Ut', 'dateModified': '12/27/2012', 'dateModifiedValue': 1356675117937, 'fileSize': '68 KB', 'fileSizeRaw': 68 },
+  { 'name': 'Adipiscingculpa.vstx', 'value': 'Adipiscingculpa.vstx', 'modifiedBy': 'Nulla In', 'dateModified': '8/7/2013', 'dateModifiedValue': 1375931283178, 'fileSize': '61 KB', 'fileSizeRaw': 61 },
+  { 'name': 'Adipiscingelit.one', 'value': 'Adipiscingelit.one', 'modifiedBy': 'Lorem Eiusmod', 'dateModified': '9/18/2013', 'dateModifiedValue': 1379536560338, 'fileSize': '41 KB', 'fileSizeRaw': 41 }
+];
+
+const columns: IColumn[] = [
+  {
+    key: 'column2',
+    name: 'Name',
+    fieldName: 'name',
+    minWidth: 210,
+    maxWidth: 350,
+    isRowHeader: true,
+    isSorted: true,
+    isSortedDescending: false,
+    data: 'string',
+    isPadded: true
+  },
+  {
+    key: 'column3',
+    name: 'Date Modified',
+    fieldName: 'dateModifiedValue',
+    isSorted: true,
+    isSortedDescending: true,
+    minWidth: 70,
+    maxWidth: 90,
+    data: 'number',
+    isPadded: true
+  },
+  {
+    key: 'column4',
+    name: 'Modified By',
+    fieldName: 'modifiedBy',
+    minWidth: 70,
+    maxWidth: 90,
+    data: 'string',
+    isPadded: true
+  },
+  {
+    key: 'column5',
+    name: 'File Size',
+    fieldName: 'fileSizeRaw',
+    minWidth: 70,
+    maxWidth: 90,
+    isResizable: true,
+    data: 'number',
+  },
+];
+
+const groups = [
+  { count: 2, key: '1', name: 'Red', startIndex: 0 },
+  { count: 4, key: '2', name: 'Blue', startIndex: 2 }
+];
+
+storiesOf('DetailsList', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .hover('.ms-DetailsRow-fields')
+        .snapshot('hover', { cropTo: '.testWrapper' })
+        .click('.ms-DetailsRow-fields')
+        .hover('.ms-DetailsRow-fields')
+        .snapshot('click', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (
+    <DetailsList
+      items={ items }
+      compact={ false }
+      columns={ columns }
+      layoutMode={ DetailsListLayoutMode.justified }
+      isHeaderVisible={ true }
+    />
+  ))
+  .add('Compact', () => (
+    <DetailsList
+      items={ items }
+      compact
+      columns={ columns }
+      layoutMode={ DetailsListLayoutMode.justified }
+      isHeaderVisible={ true }
+    />
+  ))
+  .add('Grouped', () => (
+    <DetailsList
+      items={ items }
+      groups={ groups }
+      columns={ columns }
+      layoutMode={ DetailsListLayoutMode.justified }
+      isHeaderVisible={ true }
+    />
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Dialog.stories.tsx b/apps/vr-tests/src/stories/Dialog.stories.tsx
new file mode 100644
index 0000000000000..3aecce7243d6d
--- /dev/null
+++ b/apps/vr-tests/src/stories/Dialog.stories.tsx
@@ -0,0 +1,72 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecoratorTall } from '../utilities';
+import { Dialog, DialogType, DialogFooter, PrimaryButton, DefaultButton } from 'office-ui-fabric-react';
+
+let footer = (
+  <DialogFooter>
+    <PrimaryButton text='Save' />
+    <DefaultButton text='Cancel' />
+  </DialogFooter>);
+
+let text = {
+  title: 'All emails together',
+  subText: 'Your Inbox has changed. No longer does it include favorites, it is a singular destination for your emails.'
+};
+
+storiesOf('Dialog', module)
+  .addDecorator(FabricDecoratorTall)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.ms-Dialog-main' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (
+    <Dialog
+      hidden={ false }
+      dialogContentProps={ {
+        type: DialogType.normal,
+        ...text
+      } }
+      modalProps={ {
+        isBlocking: false
+      } }
+    >
+      { footer }
+    </Dialog>
+  ))
+  .add('Large header', () => (
+    <Dialog
+      hidden={ false }
+      dialogContentProps={ {
+        type: DialogType.largeHeader,
+        ...text
+      } }
+      modalProps={ {
+        isBlocking: false
+      } }
+    >
+      { footer }
+    </Dialog>
+  ))
+  .add('Blocking', () => (
+    <Dialog
+      hidden={ false }
+      dialogContentProps={ {
+        type: DialogType.normal,
+        ...text
+      } }
+      modalProps={ {
+        isBlocking: true
+      } }
+    >
+      { footer }
+    </Dialog>
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/DocumentCard.stories.tsx b/apps/vr-tests/src/stories/DocumentCard.stories.tsx
new file mode 100644
index 0000000000000..b82ae2be7dafb
--- /dev/null
+++ b/apps/vr-tests/src/stories/DocumentCard.stories.tsx
@@ -0,0 +1,117 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import {
+  DocumentCard,
+  DocumentCardPreview,
+  DocumentCardTitle,
+  DocumentCardActivity,
+  DocumentCardType,
+  ImageFit
+} from 'office-ui-fabric-react';
+
+import { TestImages } from '../common/TestImages';
+
+let previewProps = {
+  previewImages: [
+    {
+      name: 'Revenue stream proposal fiscal year 2016 version02.pptx',
+      url: 'http://bing.com',
+      previewImageSrc: TestImages.documentPreview,
+      iconSrc: TestImages.iconPpt,
+      imageFit: ImageFit.cover,
+      width: 318,
+      height: 196
+    }
+  ],
+};
+
+let previewPropsCompact = {
+  getOverflowDocumentCountText: (overflowCount: number) => `+${overflowCount} more`,
+  previewImages: [
+    {
+      name: 'Revenue stream proposal fiscal year 2016 version02.pptx',
+      url: 'http://bing.com',
+      previewImageSrc: TestImages.documentPreview,
+      iconSrc: TestImages.iconPpt,
+      width: 144
+    },
+    {
+      name: 'New Contoso Collaboration for Conference Presentation Draft',
+      url: 'http://bing.com',
+      previewImageSrc: TestImages.documentPreviewTwo,
+      iconSrc: TestImages.iconPpt,
+      width: 144
+    },
+    {
+      name: 'Spec Sheet for design',
+      url: 'http://bing.com',
+      previewImageSrc: TestImages.documentPreviewThree,
+      iconSrc: TestImages.iconPpt,
+      width: 144
+    },
+    {
+      name: 'Contoso Marketing Presentation',
+      url: 'http://bing.com',
+      previewImageSrc: TestImages.documentPreview,
+      iconSrc: TestImages.iconPpt,
+      width: 144
+    },
+  ],
+};
+
+let DocActivity = (
+  <DocumentCardActivity
+    activity='Created a few minutes ago'
+    people={
+      [
+        { name: 'Annie Lindqvist', profileImageSrc: TestImages.personaFemale }
+      ]
+    }
+  />
+);
+
+storiesOf('DocumentCard', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (
+    <DocumentCard onClickHref='http://bing.com'>
+      <DocumentCardPreview { ...previewProps } />
+      <DocumentCardTitle
+        title='Large_file_name_with_underscores_used_to_separate_all_of_the_words_and_there_are_so_many_words_it_needs_truncating.pptx'
+        shouldTruncate={ true }
+      />
+      { DocActivity }
+    </DocumentCard>
+  ))
+  .add('Not truncated', () => (
+    <DocumentCard onClickHref='http://bing.com'>
+      <DocumentCardPreview { ...previewProps } />
+      <DocumentCardTitle
+        title='Large_file_name_with_underscores_used_to_separate_all_of_the_words_and_there_are_so_many_words_it_needs_truncating.pptx'
+        shouldTruncate={ false }
+      />
+      { DocActivity }
+    </DocumentCard>
+  ))
+  .add('Compact', () => (
+    <DocumentCard type={ DocumentCardType.compact } onClickHref='http://bing.com'>
+      <DocumentCardPreview { ...previewPropsCompact } />
+      <DocumentCardTitle
+        title='4 files were uploaded'
+        shouldTruncate={ true }
+      />
+      { DocActivity }
+    </DocumentCard >
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Dropdown.stories.tsx b/apps/vr-tests/src/stories/Dropdown.stories.tsx
new file mode 100644
index 0000000000000..f42358208cdf9
--- /dev/null
+++ b/apps/vr-tests/src/stories/Dropdown.stories.tsx
@@ -0,0 +1,78 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { Dropdown, DropdownMenuItemType } from 'office-ui-fabric-react';
+
+storiesOf('Dropdown', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .hover('.ms-Dropdown')
+        .snapshot('hover', { cropTo: '.testWrapper' })
+        .click('.ms-Dropdown')
+        .hover('.ms-Dropdown')
+        .snapshot('click', { cropTo: '.ms-Layer' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (
+    <Dropdown
+      placeHolder='Select an Option'
+      label='Basic example:'
+      ariaLabel='Basic dropdown example'
+      options={
+        [
+          { key: 'Header', text: 'Actions', itemType: DropdownMenuItemType.Header },
+          { key: 'A', text: 'Option a' },
+          { key: 'B', text: 'Option b' },
+          { key: 'divider_2', text: '-', itemType: DropdownMenuItemType.Divider },
+          { key: 'Header2', text: 'People', itemType: DropdownMenuItemType.Header },
+          { key: 'F', text: 'Option f' },
+          { key: 'G', text: 'Option g' }
+        ]
+      }
+    />
+  ))
+  .add('Disabled', () => (
+    <Dropdown
+      placeHolder='Select an Option'
+      label='Basic example:'
+      ariaLabel='Basic dropdown example'
+      disabled
+      options={
+        [
+          { key: 'Header', text: 'Actions', itemType: DropdownMenuItemType.Header },
+          { key: 'A', text: 'Option a' },
+          { key: 'B', text: 'Option b' },
+          { key: 'divider_2', text: '-', itemType: DropdownMenuItemType.Divider },
+          { key: 'Header2', text: 'People', itemType: DropdownMenuItemType.Header },
+          { key: 'F', text: 'Option f' },
+          { key: 'G', text: 'Option g' }
+        ]
+      }
+    />
+  ))
+  .add('Multiselect', () => (
+    <Dropdown
+      placeHolder='Select options'
+      label='Multi-Select example:'
+      defaultSelectedKeys={ ['Orange'] }
+      multiSelect
+      options={
+        [
+          { key: 'Header2', text: 'Fruits', itemType: DropdownMenuItemType.Header },
+          { key: 'Apple', text: 'apple' },
+          { key: 'Banana', text: 'banana' },
+          { key: 'Orange', text: 'orange' },
+        ]
+      }
+    />
+  ))
+  ;
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Facepile.stories.tsx b/apps/vr-tests/src/stories/Facepile.stories.tsx
new file mode 100644
index 0000000000000..d7a65ba1b8f18
--- /dev/null
+++ b/apps/vr-tests/src/stories/Facepile.stories.tsx
@@ -0,0 +1,83 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { Facepile, PersonaInitialsColor, PersonaSize, OverflowButtonType } from 'office-ui-fabric-react';
+
+import { TestImages } from '../common/TestImages';
+
+const facepilePersonas = [
+  {
+    imageUrl: TestImages.personaFemale,
+    personaName: 'Annie Lindqvist',
+    data: '50%'
+  },
+  {
+    imageUrl: TestImages.personaFemale,
+    personaName: 'Aaron Reid',
+    data: '$1,000'
+  },
+  {
+    personaName: 'Alex Lundberg',
+    data: '75%'
+  },
+  {
+    personaName: 'Roko Kolar',
+    data: '4 hrs'
+  },
+  {
+    imageInitials: 'CB',
+    personaName: 'Christian Bergqvist',
+    initialsColor: PersonaInitialsColor.green,
+    data: '25%'
+  },
+  {
+    imageUrl: TestImages.personaFemale,
+    imageInitials: 'VL',
+    personaName: 'Valentina Lovric',
+    initialsColor: PersonaInitialsColor.lightBlue,
+    data: 'Emp1234'
+  }
+];
+
+let facepileProps = {
+  personas: facepilePersonas,
+  ariaDescription: 'To move through the items use left and right arrow keys.'
+};
+
+storiesOf('Facepile', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (
+    <Facepile {...facepileProps} />
+  ))
+  .add('Extra extra small', () => (
+    <Facepile {...facepileProps} personaSize={ PersonaSize.extraExtraSmall } />
+  ))
+  .add('Overflow', () => (
+    <Facepile
+      {...facepileProps}
+      maxDisplayablePersonas={ 3 }
+      overflowButtonType={ OverflowButtonType.downArrow }
+      overflowButtonProps={ {
+        ariaLabel: 'More users',
+      }
+      }
+    />
+  ))
+  .add('Add face', () => (
+    <Facepile
+      {...facepileProps}
+      showAddButton={ true }
+    />
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/GroupedList.stories.tsx b/apps/vr-tests/src/stories/GroupedList.stories.tsx
new file mode 100644
index 0000000000000..2d99582b474b3
--- /dev/null
+++ b/apps/vr-tests/src/stories/GroupedList.stories.tsx
@@ -0,0 +1,45 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { GroupedList } from 'office-ui-fabric-react';
+
+const groupCount = 2;
+const groupDepth = 2;
+// tslint:disable-next-line:max-line-length
+const items = [{ 'thumbnail': '//placehold.it/175x175', 'key': 'item-0 nostrud proident, id non', 'name': 'id velit labore ipsum magna', 'description': 'dolor nostrud Ut ex dolore mollit veniam, Excepteur aute in magna sint ex sit occaecat non quis cupidatat sit esse', 'color': 'red', 'shape': 'circle', 'location': 'Los Angeles', 'width': 175, 'height': 175 }, { 'thumbnail': '//placehold.it/229x229', 'key': 'item-1 in sunt sed eiusmod', 'name': 'in Duis dolor ex ut', 'description': 'dolor amet, deserunt enim esse mollit ut amet, Excepteur fugiat ex ut amet, laborum ea cupidatat sunt aute quis occaecat dolore sunt cupidatat exercitation laborum aute consectetur laboris ullamco laborum tempor in exercitation dolor aute Lorem dolor minim', 'color': 'green', 'shape': 'circle', 'location': 'Seattle', 'width': 229, 'height': 229 }, { 'thumbnail': '//placehold.it/195x195', 'key': 'item-2 consectetur ut dolor commodo', 'name': 'adipiscing fugiat officia sunt cillum', 'description': 'adipiscing veniam, ea enim pariatur. fugiat quis dolor dolor deserunt Lorem enim veniam, est exercitation reprehenderit minim dolore consectetur dolore ea occaecat culpa consectetur tempor reprehenderit dolore ut sint minim cillum sunt in in ex ad do esse dolore tempor', 'color': 'blue', 'shape': 'square', 'location': 'New York', 'width': 195, 'height': 195 }, { 'thumbnail': '//placehold.it/208x208', 'key': 'item-3 pariatur. id qui voluptate', 'name': 'eu ullamco et commodo aliqua.', 'description': 'laborum nostrud nulla dolore occaecat ut et proident, sed cillum officia ea ea proident, occaecat quis occaecat officia aute non officia esse dolor proident, ad mollit ut in dolor non ipsum adipiscing eiusmod culpa ea in ea dolor ipsum ipsum eu consequat. voluptate fugiat veniam, amet,', 'color': 'red', 'shape': 'triangle', 'location': 'Los Angeles', 'width': 208, 'height': 208 }];
+// tslint:disable-next-line:max-line-length
+const groups = [{ 'count': 4, 'key': 'group0', 'name': 'group 0', 'startIndex': 0, 'level': 0, 'children': [{ 'count': 2, 'key': 'group0-0', 'name': 'group 0-0', 'startIndex': 0, 'level': 1, 'children': [] }, { 'count': 2, 'key': 'group0-1', 'name': 'group 0-1', 'startIndex': 2, 'level': 1, 'children': [] }] }, { 'count': 4, 'key': 'group1', 'name': 'group 1', 'startIndex': 4, 'level': 0, 'children': [{ 'count': 2, 'key': 'group1-0', 'name': 'group 1-0', 'startIndex': 4, 'level': 1, 'children': [] }, { 'count': 2, 'key': 'group1-1', 'name': 'group 1-1', 'startIndex': 6, 'level': 1, 'children': [] }] }];
+
+let onRenderCell = (nestingDepth: number, item: any, itemIndex: number) => {
+  return (
+    <div>{ item.name }</div>
+  );
+};
+
+storiesOf('GroupedList', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .hover('.ms-GroupHeader-expand')
+        .snapshot('hover', { cropTo: '.testWrapper' })
+        .click('.ms-GroupHeader-expand')
+        .hover('.ms-GroupHeader-expand')
+        .snapshot('click', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (
+    <GroupedList
+      groups={ groups }
+      items={ items }
+      onRenderCell={ onRenderCell }
+    />
+  ))
+  ;
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Image.css b/apps/vr-tests/src/stories/Image.css
new file mode 100644
index 0000000000000..8e2860d398bec
--- /dev/null
+++ b/apps/vr-tests/src/stories/Image.css
@@ -0,0 +1,4 @@
+.ms-Image {
+  border: 2px solid #aaa;
+  margin-bottom: 20px;
+}
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Image.stories.tsx b/apps/vr-tests/src/stories/Image.stories.tsx
new file mode 100644
index 0000000000000..3263598b35319
--- /dev/null
+++ b/apps/vr-tests/src/stories/Image.stories.tsx
@@ -0,0 +1,141 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { Image, ImageFit, Label, Layer } from 'office-ui-fabric-react';
+
+import './Image.css';
+
+const img350x150 = 'http://placehold.it/350x150';
+
+let imagePropsFitNone = {
+  src: 'http://placehold.it/500x250',
+  imageFit: ImageFit.none,
+  width: 350,
+  height: 150
+};
+
+let imagePropsFitCenter = {
+  src: 'http://placehold.it/800x300',
+  imageFit: ImageFit.center,
+  width: 350,
+  height: 150
+};
+
+let imagePropsFitContain = {
+  src: 'http://placehold.it/700x300',
+  imageFit: ImageFit.contain
+};
+
+let imagePropsFitCover = {
+  src: 'http://placehold.it/500x500',
+  imageFit: ImageFit.cover
+};
+
+let imagePropsMaximizeFrame = {
+  src: 'http://placehold.it/500x500',
+  imageFit: ImageFit.cover,
+  maximizeFrame: true
+};
+
+// tslint:disable:jsx-ban-props
+
+storiesOf('Image', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('No fit, no w/h', () => (
+    <div>
+      <Label>Without a width or height specified, the frame remains at its natural size and the image will not be scaled.</Label>
+      <Image src={ img350x150 } />
+    </div>
+  ))
+  .add('No fit, only width', () => (
+    <div>
+      <Label>If only a width is provided, the frame will be set to that width.
+      The image will scale proportionally to fill the available width.</Label>
+      <Image src={ img350x150 } width={ 600 } />
+    </div>
+  ))
+  .add('No fit, only heght', () => (
+    <div>
+      <Label>If only a height is provided, the frame will be set to that height.
+        The image will scale proportionally to fill the available height.</Label>
+      <Image src={ img350x150 } width={ 100 } />
+    </div>
+  ))
+  .add('Fit: none, image larger', () => (
+    <div>
+      <Label>The image is larger than the frame, so it is cropped to fit. The image is positioned at the upper left of the frame.</Label>
+      <Image  { ...imagePropsFitNone } />
+    </div>
+  ))
+  .add('Fit: none, image smaller', () => (
+    <div>
+      <Label>The image is smaller than the frame, so there is empty space within the frame.
+        The image is positioned at the upper left of the frame.</Label>
+      <Image  { ...imagePropsFitNone } src='http://placehold.it/100x100' />
+    </div>
+  ))
+  .add('Fit: center, image larger', () => (
+    <div>
+      <Label>The image is larger than the frame, so all sides are cropped to center the image.</Label>
+      <Image  { ...imagePropsFitCenter } src='http://placehold.it/800x300' />
+    </div>
+  ))
+  .add('Fit: center, image smaller', () => (
+    <div>
+      <Label>The image is smaller than the frame, so there is empty space within the frame.
+            The image is centered in the available space.</Label>
+      <Image  { ...imagePropsFitCenter } src='http://placehold.it/100x100' />
+    </div>
+  ))
+  .add('Fit: contain, image wider', () => (
+    <div>
+      <Label>The image has a wider aspect ratio (more landscape) than the frame,
+              so the image is scaled to fit the width and centered in the available vertical space.</Label>
+      <Image { ...imagePropsFitContain } width={ 200 } height={ 200 } />
+    </div>
+  ))
+  .add('Fit: contain, image taller', () => (
+    <div>
+      <Label>The image has a taller aspect ratio (more portrait) than the frame,
+                so the image is scaled to fit the height and centered in the available horizontal space.</Label>
+      <Image { ...imagePropsFitContain } width={ 300 } height={ 50 } />
+    </div>
+  ))
+  .add('Fit: cover, image wider', () => (
+    <div>
+      <Label>The image has a wider aspect ratio (more landscape) than the frame,
+          so the image is scaled to fit the height and the sides are cropped evenly.</Label>
+      <Image { ...imagePropsFitCover } width={ 150 } height={ 250 } />
+    </div>
+  ))
+  .add('Fit: cover, image taller', () => (
+    <div>
+      <Label>The image has a taller aspect ratio (more portrait) than the frame,
+            so the image is scaled to fit the width and the top and bottom are cropped evenly.</Label>
+      <Image { ...imagePropsFitCover } width={ 250 } height={ 150 } />
+    </div>
+  ))
+  .add('Maximize frame, landscape container', () => (
+    <div>
+      <Label>The image is placed within a landscape container.</Label>
+      <div style={ { width: '200px', height: '100px' } }>
+        <Image { ...imagePropsMaximizeFrame } />
+      </div>
+    </div>
+  ))
+  .add('Maximize frame, portrait container', () => (
+    <Layer>sdfsfdsf</Layer>
+  ))
+  ;
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Layer.stories.tsx b/apps/vr-tests/src/stories/Layer.stories.tsx
new file mode 100644
index 0000000000000..ce5f9049580e9
--- /dev/null
+++ b/apps/vr-tests/src/stories/Layer.stories.tsx
@@ -0,0 +1,22 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { Layer } from 'office-ui-fabric-react';
+
+storiesOf('Layer', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.ms-Layer' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (
+    <Layer>Layer content</Layer>
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/List.stories.tsx b/apps/vr-tests/src/stories/List.stories.tsx
new file mode 100644
index 0000000000000..22849b8be571f
--- /dev/null
+++ b/apps/vr-tests/src/stories/List.stories.tsx
@@ -0,0 +1,29 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { List } from 'office-ui-fabric-react';
+
+// tslint:disable-next-line:max-line-length
+const items = [{ 'thumbnail': '//placehold.it/233x233', 'key': 'item-0 sit Lorem culpa cillum', 'name': 'reprehenderit dolore nulla laborum officia', 'description': 'et laborum Excepteur et sit esse culpa elit, ad elit, dolore tempor non incididunt incididunt Ut laboris adipiscing voluptate Ut laboris in dolore velit sunt tempor ex pariatur. irure laborum consectetur laborum', 'color': 'green', 'shape': 'triangle', 'location': 'Los Angeles', 'width': 233, 'height': 233 }, { 'thumbnail': '//placehold.it/210x210', 'key': 'item-1 dolor elit, sit mollit', 'name': 'consectetur ipsum tempor nostrud commodo', 'description': 'minim occaecat nisi enim quis deserunt consectetur nostrud ut pariatur. ut nisi velit dolor pariatur. tempor officia aliqua. labore minim est cillum velit ut fugiat', 'color': 'yellow', 'shape': 'triangle', 'location': 'Los Angeles', 'width': 210, 'height': 210 }, { 'thumbnail': '//placehold.it/231x231', 'key': 'item-2 dolor reprehenderit id sint', 'name': 'velit nisi aliquip do minim', 'description': 'velit dolor aliquip eiusmod voluptate esse occaecat in mollit ut ex ad cillum in quis ad fugiat ullamco in cillum in non culpa in cupidatat non do dolore Ut', 'color': 'blue', 'shape': 'circle', 'location': 'Chicago', 'width': 231, 'height': 231 }, { 'thumbnail': '//placehold.it/158x158', 'key': 'item-3 magna Ut nisi dolor', 'name': 'nostrud in reprehenderit eu anim', 'description': 'nisi eu et in exercitation ut consectetur veniam, ut sunt ut commodo ad laboris sit culpa aliquip', 'color': 'green', 'shape': 'circle', 'location': 'Seattle', 'width': 158, 'height': 158 }, { 'thumbnail': '//placehold.it/165x165', 'key': 'item-4 nisi proident, in dolore', 'name': 'nostrud Duis aliquip Lorem sunt', 'description': 'ullamco qui sunt labore proident, occaecat Lorem pariatur. occaecat Ut incididunt officia mollit aliqua. tempor nostrud sed adipiscing enim qui do sit aliquip voluptate cupidatat non occaecat ullamco laborum', 'color': 'red', 'shape': 'triangle', 'location': 'Portland', 'width': 165, 'height': 165 }, { 'thumbnail': '//placehold.it/226x226', 'key': 'item-5 mollit elit, ex elit,', 'name': 'nulla ipsum esse Lorem sed', 'description': 'dolor deserunt in labore in adipiscing ex consequat. aliquip in do qui in minim cillum aute in ex officia aute ipsum non minim labore nisi elit, magna dolor sint irure nisi aliquip consectetur quis esse mollit ut voluptate officia et adipiscing irure aute irure non Excepteur ut ex ut voluptate nostrud laboris aliquip pariatur. dolore laboris sint Duis', 'color': 'green', 'shape': 'triangle', 'location': 'New York', 'width': 226, 'height': 226 }, { 'thumbnail': '//placehold.it/182x182', 'key': 'item-6 ut irure dolor et', 'name': 'nulla consectetur eiusmod velit sed', 'description': 'dolor in nulla laboris in tempor ut ea cupidatat laboris qui dolor labore ut consectetur labore tempor fugiat irure tempor consectetur nisi culpa officia non', 'color': 'green', 'shape': 'circle', 'location': 'Los Angeles', 'width': 182, 'height': 182 }, { 'thumbnail': '//placehold.it/206x206', 'key': 'item-7 non ad consequat. mollit', 'name': 'sint quis in Excepteur enim', 'description': 'et Ut ad dolor exercitation occaecat fugiat nulla mollit cillum voluptate consectetur irure ipsum ut ea dolore eiusmod occaecat in culpa sint aute voluptate minim aliqua. incididunt voluptate magna officia Excepteur anim laboris et aliquip ut irure nostrud enim in mollit voluptate sint ipsum sit commodo commodo sint nulla', 'color': 'green', 'shape': 'square', 'location': 'Seattle', 'width': 206, 'height': 206 }, { 'thumbnail': '//placehold.it/240x240', 'key': 'item-8 enim et aliqua. enim', 'name': 'in commodo dolore ea Duis', 'description': 'elit, deserunt in ut adipiscing aliquip in laboris nostrud enim aliquip exercitation aute tempor velit fugiat dolor mollit aliqua. sint et Excepteur non voluptate laborum exercitation incididunt enim dolor labore labore aliqua. anim est nulla esse occaecat aliqua. Ut', 'color': 'yellow', 'shape': 'square', 'location': 'Chicago', 'width': 240, 'height': 240 }, { 'thumbnail': '//placehold.it/158x158', 'key': 'item-9 reprehenderit minim cillum do', 'name': 'dolore et sed dolore sed', 'description': 'fugiat adipiscing sed consectetur sunt cupidatat laborum ex ea dolore et dolor nostrud minim anim do sint esse officia ea aliquip Excepteur et Ut aliquip elit, pariatur. consectetur elit, aliquip occaecat consequat. qui deserunt commodo occaecat cupidatat Ut Ut culpa veniam, quis voluptate reprehenderit in qui sit', 'color': 'yellow', 'shape': 'circle', 'location': 'New York', 'width': 158, 'height': 158 }];
+
+const onRenderCell = (item) => (
+  <div>{ item.name }</div>
+);
+
+storiesOf('List', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (
+    <List items={ items } onRenderCell={ onRenderCell } />
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Modal.stories.tsx b/apps/vr-tests/src/stories/Modal.stories.tsx
new file mode 100644
index 0000000000000..95e1b366920c6
--- /dev/null
+++ b/apps/vr-tests/src/stories/Modal.stories.tsx
@@ -0,0 +1,28 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { Modal } from 'office-ui-fabric-react/lib/Modal';
+
+// tslint:disable:max-line-length
+storiesOf('Modal', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (
+    <Modal
+      isOpen
+      isBlocking={ false }
+    >
+      Modal content
+    </Modal >
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Nav.stories.tsx b/apps/vr-tests/src/stories/Nav.stories.tsx
new file mode 100644
index 0000000000000..488b2aa154653
--- /dev/null
+++ b/apps/vr-tests/src/stories/Nav.stories.tsx
@@ -0,0 +1,69 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { Nav } from 'office-ui-fabric-react';
+
+// tslint:disable:max-line-length
+storiesOf('Nav', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .hover('.ms-Nav-compositeLink')
+        .snapshot('hover', { cropTo: '.testWrapper' })
+        .click('.ms-Nav-chevronButton')
+        .hover('.ms-Nav-compositeLink')
+        .snapshot('click', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (
+    // tslint:disable-next-line:jsx-ban-props
+    <div style={ { width: '208px' } }>
+      <Nav
+        groups={
+          [
+            {
+              links:
+              [
+                {
+                  name: 'Home',
+                  url: 'http://example.com',
+                  links: [{
+                    name: 'Activity',
+                    url: 'http://msn.com',
+                    key: 'key1'
+                  },
+                  {
+                    name: 'News',
+                    url: 'http://msn.com',
+                    key: 'key2'
+                  }],
+                  isExpanded: true
+                },
+                { name: 'Documents', url: 'http://example.com', key: 'key3' },
+                { name: 'Pages', url: 'http://msn.com', key: 'key4' },
+                { name: 'Notebook', url: 'http://msn.com', key: 'key5' },
+                { name: 'Long Name Test for elipse', url: 'http://msn.com', key: 'key6' },
+                {
+                  name: 'Edit',
+                  url: 'http://cnn.com',
+                  icon: 'Edit',
+                  key: 'key8'
+                }
+              ]
+            }
+          ]
+        }
+        expandedStateText={ 'expanded' }
+        collapsedStateText={ 'collapsed' }
+        selectedKey={ 'key3' }
+      />
+    </div>
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Overlay.stories.tsx b/apps/vr-tests/src/stories/Overlay.stories.tsx
new file mode 100644
index 0000000000000..38e13108b7b05
--- /dev/null
+++ b/apps/vr-tests/src/stories/Overlay.stories.tsx
@@ -0,0 +1,25 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { Overlay } from 'office-ui-fabric-react';
+
+storiesOf('Overlay', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.ms-Overlay' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (
+    <Overlay>Overlay content</Overlay>
+  ))
+  .add('Dark', () => (
+    <Overlay isDarkThemed>Overlay content</Overlay>
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Panel.stories.tsx b/apps/vr-tests/src/stories/Panel.stories.tsx
new file mode 100644
index 0000000000000..679601ef6dfd3
--- /dev/null
+++ b/apps/vr-tests/src/stories/Panel.stories.tsx
@@ -0,0 +1,69 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { Panel, PanelType } from 'office-ui-fabric-react';
+
+Panel.defaultProps = {
+  isOpen: true,
+  children: 'Content goes here'
+};
+
+storiesOf('Panel', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default')
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Small left w/ close button', () => (
+    <Panel
+      hasCloseButton
+      type={ PanelType.smallFixedNear }
+      headerText='Small'
+    />
+  ))
+  .add('Small fixed right w/ close button', () => (
+    <Panel
+      hasCloseButton
+      type={ PanelType.smallFixedFar }
+      headerText='Small fixed'
+    />
+  ))
+  .add('Small fluid right', () => (
+    <Panel
+      type={ PanelType.smallFluid }
+      headerText='Small fluid'
+    />
+  ))
+  .add('Medium right', () => (
+    <Panel
+      type={ PanelType.medium }
+      headerText='Medium'
+    />
+  ))
+  .add('Large right', () => (
+    <Panel
+      type={ PanelType.large }
+      headerText='Large'
+    />
+  ))
+  .add('Large fixed right', () => (
+    <Panel
+      type={ PanelType.largeFixed }
+      headerText='Large fixed'
+    />
+  ))
+  .add('Extra large right', () => (
+    <Panel
+      type={ PanelType.extraLarge }
+      headerText='Extra Large'
+    />
+  ))
+  ;
\ No newline at end of file

From c13ebe30151821c40de32a3e64d3da7e476a030a Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 4 Oct 2017 23:28:12 -0700
Subject: [PATCH 0784/1641] Adding IconNames const enum to @uifabric/icons.
 (#3035)

* Exporting IconNames and making sure the name is correct.

* change file.
---
 .../@uifabric/icons/iconnames_2017-10-05-05-46.json   | 11 +++++++++++
 packages/icons/src/IconNames.ts                       |  2 +-
 packages/icons/src/index.ts                           |  4 +++-
 3 files changed, 15 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/icons/iconnames_2017-10-05-05-46.json

diff --git a/common/changes/@uifabric/icons/iconnames_2017-10-05-05-46.json b/common/changes/@uifabric/icons/iconnames_2017-10-05-05-46.json
new file mode 100644
index 0000000000000..2d8b3416bdeb8
--- /dev/null
+++ b/common/changes/@uifabric/icons/iconnames_2017-10-05-05-46.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/icons",
+      "comment": "Exporting `IconNames` const enum.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/icons",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/icons/src/IconNames.ts b/packages/icons/src/IconNames.ts
index 2adeefaaebaad..d3656466cd088 100644
--- a/packages/icons/src/IconNames.ts
+++ b/packages/icons/src/IconNames.ts
@@ -1,4 +1,4 @@
-export const enum IconName {
+export const enum IconNames {
   DecreaseIndentLegacy = 'DecreaseIndentLegacy',
   IncreaseIndentLegacy = 'IncreaseIndentLegacy',
   GlobalNavButton = 'GlobalNavButton',
diff --git a/packages/icons/src/index.ts b/packages/icons/src/index.ts
index ba591c1d72fbb..3e2f082763f72 100644
--- a/packages/icons/src/index.ts
+++ b/packages/icons/src/index.ts
@@ -19,4 +19,6 @@ export function initializeIcons(baseUrl: string = DEFAULT_BASE_URL): void {
   [i, i0, i1, i2, i3, i4, i5, i6, i7, i8, i9, i10, i11].forEach(
     (initialize: (url: string) => void) => initialize(baseUrl)
   );
-}
\ No newline at end of file
+}
+
+export { IconNames } from './IconNames';

From f95fa74185b6faaf278fdc0a78e72635bcc3ec48 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 4 Oct 2017 23:28:39 -0700
Subject: [PATCH 0785/1641] mergeStyleSets selectors now support $token for
 referencing other areas in the set. (#3033)

* Adding support for targeting other areas within a style set using $token within selectors.

* Adding change file.

* Refined documentation.

* Adding support for dashes.

* Moving files around, adjusting tests, fixing bugs.

* Update styleToClassName.test.ts

* Update styleToClassName.test.ts
---
 .../mergestylesets_2017-10-04-23-23.json      | 11 +++
 packages/merge-styles/README.md               | 76 +++++++++++++++-
 .../merge-styles/src/extractStyleParts.ts     | 40 +++++++++
 .../merge-styles/src/mergeStyleSets.test.ts   | 55 ++++++++++--
 packages/merge-styles/src/mergeStyleSets.ts   | 26 +++++-
 packages/merge-styles/src/mergeStyles.ts      | 27 +-----
 packages/merge-styles/src/server.test.ts      |  4 +-
 .../merge-styles/src/styleToClassName.test.ts |  7 ++
 packages/merge-styles/src/styleToClassName.ts | 88 +++++++++++++++----
 scripts/tasks/jest-serializer-merge-styles.js | 19 ++--
 scripts/tasks/jest.js                         |  2 +-
 11 files changed, 290 insertions(+), 65 deletions(-)
 create mode 100644 common/changes/@uifabric/merge-styles/mergestylesets_2017-10-04-23-23.json
 create mode 100644 packages/merge-styles/src/extractStyleParts.ts

diff --git a/common/changes/@uifabric/merge-styles/mergestylesets_2017-10-04-23-23.json b/common/changes/@uifabric/merge-styles/mergestylesets_2017-10-04-23-23.json
new file mode 100644
index 0000000000000..042b189dfe079
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/mergestylesets_2017-10-04-23-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "Adding selector support to target child class names that were generated in the same mergeStyleSets set.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/merge-styles/README.md b/packages/merge-styles/README.md
index 80727264cd428..642eca9d6f0d7 100644
--- a/packages/merge-styles/README.md
+++ b/packages/merge-styles/README.md
@@ -4,7 +4,25 @@ The `merge-styles` library provides utilities for loading styles through javascr
 
 The library was built for speed and size; the entire package is 2.62k gzipped. It has no dependencies other than `tslib`.
 
-The basic idea is to provide a method which can take in one or more style objects css styling javascript objects representing the styles for a given element, and return a single class name. If the same set of styling is passed in, the same name returns and nothing is re-registered.
+Simple usage:
+```
+import { mergeStyles, mergeStyleSet } from '@uifabric/merge-styles';
+
+// Produces 'css-0' class name which can be used anywhere
+mergeStyles({ background: 'red' });
+
+// Produces a class map for a bunch of rules all at once
+mergeStyleSet({
+  root: { background: 'red' },
+  child: { background: 'green' }
+});
+
+// Returns { root: 'root-0', child: 'child-1' }
+```
+
+Both utilities behave similar to a deep Object.assign; you can collapse may objects down into one class name or class map.
+
+The basic idea is to provide tools which can take in one or more css styling objects representing the styles for a given element, and return a single class name. If the same set of styling is passed in, the same name returns and nothing is re-registered.
 
 ## Motivation
 
@@ -130,6 +148,8 @@ export const MyComponent = () => {
 
 ## Selectors
 
+### Basic pseudo-selectors (:hover, :active, etc)
+
 Custom selectors can be defined within `IStyle` definitions under the `selectors` section:
 
 ```tsx
@@ -143,13 +163,15 @@ Custom selectors can be defined within `IStyle` definitions under the `selectors
 }
 ```
 
-By default, the rule will be appended to the current selector scope. That is, in the above scenario, there will be 2 rules inserted when using `mergeRules`:
+By default, the rule will be appended to the current selector scope. That is, in the above scenario, there will be 2 rules inserted when using `mergeStyles`:
 
 ```css
 .css-0 { background: red; }
 .css-0:hover { background: green; }
 ```
 
+### Parent/child selectors
+
 In some cases, you may need to use parent or child selectors. To do so, you can define a selector from scratch and use the `&` character to represent the generated class name. When using the `&`, the current scope is ignored. Example:
 
 ```tsx
@@ -173,12 +195,58 @@ This would register the rules:
 .ms-Fabric.is-focusVisible .css-0 { background: red; }
 .css-0 .child { background: green; }
 ```
+### Referencing child elements within the mergeStyleSets scope
+
+One important concept about `mergeStyleSets` is that it produces a map of class names for the given elements:
+
+```tsx
+mergeStyleSets({
+  root: { background: 'red' }
+  thumb: { background: 'green' }
+});
+```
+
+Produces:
+
+```css
+.root-0 { background: red; }
+.thumb-1 { background: green; }
+```
+
+In some cases, you may need to alter a child area by interacting with the parent. For example, when the parent is hovered, change the child background. You can reference the areas defined in the style set using $ tokens:
+
+```tsx
+mergeStyleSets({
+  root: {
+    selectors: {
+      ':hover $thumb': { background: 'lightgreen' }
+    }
+   }
+  thumb: { background: 'green' }
+});
+```
+
+The `$thumb` reference in the selector on root will be replaced with the class name generated for thumb.
 
 ## Custom class names
 
-By default class names that are generated will use the prefix `css-` followed by a number, creating unique rules where needed.
+By default when using `mergeStyles`, class names that are generated will use the prefix `css-` followed by a number, creating unique rules where needed. For example, the first class name produced will be 'css-0'.
+
+When using `mergeStyleSets`, class names automatically use the area name as the prefix.
+
+Merging rules like:
+
+```ts
+mergeStyleSets({ a: { ... }, b: { ... } })
+```
+
+Will produce the class name map:
+
+```ts
+{ a: 'a-0', b: 'b-1' }
+```
 
-While this prefix is fine, sometimes a more readable prefix is desired. You can pass in a `displayName` to resolve this:
+If you'd like to override the default prefix in either case, you can pass in a `displayName` to resolve this:
 
 ```tsx
 {
diff --git a/packages/merge-styles/src/extractStyleParts.ts b/packages/merge-styles/src/extractStyleParts.ts
new file mode 100644
index 0000000000000..175d1c964fc76
--- /dev/null
+++ b/packages/merge-styles/src/extractStyleParts.ts
@@ -0,0 +1,40 @@
+import { IStyle } from './IStyle';
+import { Stylesheet } from './Stylesheet';
+
+/**
+ * Separates the classes and style objects. Any classes that are pre-registered
+ * args are auto expanded into objects.
+ */
+export function extractStyleParts(
+  ...args: (IStyle | IStyle[] | false | null | undefined)[]
+): { classes: string[], objects: IStyle[] } {
+  const classes: string[] = [];
+  const objects: {}[] = [];
+  const stylesheet = Stylesheet.getInstance();
+
+  function _processArgs(argsList: (IStyle | IStyle[])[]): void {
+    for (const arg of argsList) {
+      if (arg) {
+        if (typeof arg === 'string') {
+          const translatedArgs = stylesheet.argsFromClassName(arg);
+          if (translatedArgs) {
+            objects.push(translatedArgs);
+          } else {
+            classes.push(arg);
+          }
+        } else if (Array.isArray(arg)) {
+          _processArgs(arg);
+        } else if (typeof arg === 'object') {
+          objects.push(arg);
+        }
+      }
+    }
+  }
+
+  _processArgs(args);
+
+  return {
+    classes,
+    objects
+  };
+}
\ No newline at end of file
diff --git a/packages/merge-styles/src/mergeStyleSets.test.ts b/packages/merge-styles/src/mergeStyleSets.test.ts
index 19aef16a66893..2abf99e980b19 100644
--- a/packages/merge-styles/src/mergeStyleSets.test.ts
+++ b/packages/merge-styles/src/mergeStyleSets.test.ts
@@ -34,15 +34,58 @@ describe('mergeStyleSets', () => {
     );
 
     expect(result).toEqual({
-      root: 'css-0',
-      a: 'css-1',
-      b: 'css-2'
+      root: 'root-0',
+      a: 'a-1',
+      b: 'b-2'
     });
 
     expect(_stylesheet.getRules()).toEqual(
-      '.css-0{background:red;}.css-0:hover{background:yellow;}' +
-      '.css-1{background:white;}' +
-      '.css-2{background:blue;}'
+      '.root-0{background:red;}.root-0:hover{background:yellow;}' +
+      '.a-1{background:white;}' +
+      '.b-2{background:blue;}'
     );
   });
+
+  it('can expand child selectors', () => {
+    const result = mergeStyleSets(
+      {
+        a: {
+          selectors: {
+            ':hover $b': {
+              background: 'green'
+            },
+            ':focus $c-foo': {
+              background: 'red'
+            },
+            ':active .d': {
+              background: 'pink'
+            }
+          }
+        },
+        b: {
+          background: 'blue'
+        },
+        'c-foo': {}
+      });
+
+    expect(result).toEqual({
+      a: 'a-0',
+      b: 'b-1',
+      'c-foo': 'c-foo-2'
+    });
+
+    expect(_stylesheet.getRules()).toEqual(
+      '.a-0:hover .b-1{background:green;}' +
+      '.a-0:focus .c-foo-2{background:red;}' +
+      '.a-0:active .d{background:pink;}' +
+      '.b-1{background:blue;}'
+    );
+  });
+
+  it('can merge class names', () => {
+    expect(mergeStyleSets({ root: ['a', 'b', { background: 'red' }] })).toEqual({
+      root: 'a b root-0'
+    });
+  });
+
 });
\ No newline at end of file
diff --git a/packages/merge-styles/src/mergeStyleSets.ts b/packages/merge-styles/src/mergeStyleSets.ts
index 5d3c2a4bfcd72..38096d516b1be 100644
--- a/packages/merge-styles/src/mergeStyleSets.ts
+++ b/packages/merge-styles/src/mergeStyleSets.ts
@@ -1,6 +1,7 @@
-import { mergeStyles } from './mergeStyles';
+import { extractStyleParts } from './extractStyleParts';
 import { concatStyleSets } from './concatStyleSets';
 import { IStyle } from './IStyle';
+import { styleToRegistration, applyRegistration } from './styleToClassName';
 
 /**
  * Allows you to pass in 1 or more sets of areas which will return a merged
@@ -11,17 +12,36 @@ import { IStyle } from './IStyle';
 export function mergeStyleSets<T>(
   ...cssSets: ({[P in keyof T]?: IStyle } | null | undefined)[]
 ): T {
-  const classNameSet: Partial<T> = {};
+  // tslint:disable-next-line:no-any
+  const classNameSet: any = {};
   let cssSet = cssSets[0];
 
   if (cssSet) {
     if (cssSets.length > 1) {
       cssSet = concatStyleSets(...cssSets);
     }
+
+    const registrations = [];
+
     for (const prop in cssSet) {
       if (cssSet.hasOwnProperty(prop)) {
+        const args: IStyle = cssSet[prop];
+
         // tslint:disable-next-line:no-any
-        (classNameSet as any)[prop] = mergeStyles(cssSet[prop] as IStyle);
+        const { classes, objects } = extractStyleParts(args as any);
+        const registration = styleToRegistration({ displayName: prop }, objects);
+
+        registrations.push(registration);
+
+        if (registration) {
+          classNameSet[prop] = classes.concat([registration.className]).join(' ');
+        }
+      }
+    }
+
+    for (const registration of registrations) {
+      if (registration) {
+        applyRegistration(registration, classNameSet);
       }
     }
   }
diff --git a/packages/merge-styles/src/mergeStyles.ts b/packages/merge-styles/src/mergeStyles.ts
index 09b82fdb7c0c2..8538b54c5e7a6 100644
--- a/packages/merge-styles/src/mergeStyles.ts
+++ b/packages/merge-styles/src/mergeStyles.ts
@@ -1,6 +1,6 @@
 import { IStyle } from './IStyle';
 import { styleToClassName } from './styleToClassName';
-import { Stylesheet } from './Stylesheet';
+import { extractStyleParts } from './extractStyleParts';
 
 /**
  * Concatination helper, which can merge class names together. Skips over falsey values.
@@ -10,30 +10,7 @@ import { Stylesheet } from './Stylesheet';
 export function mergeStyles(
   ...args: (IStyle | IStyle[] | false | null | undefined)[]
 ): string {
-  const classes: string[] = [];
-  const objects: {}[] = [];
-  const stylesheet = Stylesheet.getInstance();
-
-  function _processArgs(argsList: (IStyle | IStyle[])[]): void {
-    for (const arg of argsList) {
-      if (arg) {
-        if (typeof arg === 'string') {
-          const translatedArgs = stylesheet.argsFromClassName(arg);
-          if (translatedArgs) {
-            objects.push(translatedArgs);
-          } else {
-            classes.push(arg);
-          }
-        } else if (Array.isArray(arg)) {
-          _processArgs(arg);
-        } else if (typeof arg === 'object') {
-          objects.push(arg);
-        }
-      }
-    }
-  }
-
-  _processArgs(args);
+  const { classes, objects } = extractStyleParts(args);
 
   if (objects.length) {
     classes.push(styleToClassName(objects));
diff --git a/packages/merge-styles/src/server.test.ts b/packages/merge-styles/src/server.test.ts
index 4c56d963323af..efe9c4f1f8a03 100644
--- a/packages/merge-styles/src/server.test.ts
+++ b/packages/merge-styles/src/server.test.ts
@@ -16,7 +16,7 @@ describe('staticRender', () => {
       return `<div class="${classNames.root}">Hello!</div>`;
     });
 
-    expect(html).toEqual(`<div class="css-0">Hello!</div>`);
-    expect(css).toEqual(`.css-0{background:red;}`);
+    expect(html).toEqual(`<div class="root-0">Hello!</div>`);
+    expect(css).toEqual(`.root-0{background:red;}`);
   });
 });
\ No newline at end of file
diff --git a/packages/merge-styles/src/styleToClassName.test.ts b/packages/merge-styles/src/styleToClassName.test.ts
index 948074097379a..009cea429d534 100644
--- a/packages/merge-styles/src/styleToClassName.test.ts
+++ b/packages/merge-styles/src/styleToClassName.test.ts
@@ -75,6 +75,12 @@ describe('styleToClassName', () => {
     expect(styleToClassName()).toEqual('');
   });
 
+  it('returns the same class name for a rule that only has a displayName', () => {
+    expect(styleToClassName({ displayName: 'foo' })).toEqual('foo-0');
+    expect(styleToClassName({ displayName: 'foo' })).toEqual('foo-0');
+    expect(_stylesheet.getRules()).toEqual('');
+  });
+
   it('can preserve displayName in names', () => {
     expect(styleToClassName({ displayName: 'DisplayName', background: 'red' })).toEqual('DisplayName-0');
     expect(_stylesheet.getRules()).toEqual('.DisplayName-0{background:red;}');
@@ -121,4 +127,5 @@ describe('styleToClassName', () => {
 
     expect(_stylesheet.getRules()).toEqual('.css-0.css-0.css-0{background:red;}');
   });
+
 });
diff --git a/packages/merge-styles/src/styleToClassName.ts b/packages/merge-styles/src/styleToClassName.ts
index 4a28eaca9732e..042118c7d965b 100644
--- a/packages/merge-styles/src/styleToClassName.ts
+++ b/packages/merge-styles/src/styleToClassName.ts
@@ -141,33 +141,87 @@ export function serializeRuleEntries(ruleEntries: { [key: string]: string | numb
   return allEntries.join('');
 }
 
-export function styleToClassName(...args: IStyle[]): string {
+export interface IRegistration {
+  className: string;
+  key: string;
+  args: IStyle[];
+  rulesToInsert: string[];
+}
+
+export function styleToRegistration(...args: IStyle[]): IRegistration | undefined {
   const rules: IRuleSet = extractRules(args);
   const key = getKeyForRules(rules);
-  let className = '';
 
   if (key) {
     const stylesheet = Stylesheet.getInstance();
+    const registration: Partial<IRegistration> = {
+      className: stylesheet.classNameFromKey(key),
+      key,
+      args
+    };
+
+    if (!registration.className) {
+      registration.className = stylesheet.getClassName(getDisplayName(rules));
+      const rulesToInsert: string[] = [];
+
+      for (const selector of rules.__order) {
+        rulesToInsert.push(
+          selector,
+          serializeRuleEntries(rules[selector])
+        );
+      }
+      registration.rulesToInsert = rulesToInsert;
+    }
 
-    className = stylesheet.classNameFromKey(key)!;
-
-    if (!className) {
-      className = stylesheet.getClassName(getDisplayName(rules));
-      const registeredRules: string[] = [];
+    return registration as IRegistration;
+  }
+}
 
-      for (let selector of rules.__order) {
-        const rulesToInsert: string = serializeRuleEntries(rules[selector]);
+export function applyRegistration(
+  registration: IRegistration,
+  classMap?: { [key: string]: string }
+): void {
+  const stylesheet = Stylesheet.getInstance();
+  const { className, key, args, rulesToInsert } = registration;
+
+  if (rulesToInsert) {
+    // rulesToInsert is an ordered array of selector/rule pairs.
+    for (let i = 0; i < rulesToInsert.length; i += 2) {
+      const rules = rulesToInsert[i + 1];
+      if (rules) {
+        let selector = rulesToInsert[i];
+
+        // Fix selector using map.
+        selector = selector.replace(/(&)|\$([\w-]+)\b/g, (match: string, amp: string, cn: string): string => {
+          if (amp) {
+            return '.' + registration.className;
+          } else if (cn) {
+            return '.' + ((classMap && classMap[cn]) || cn);
+          }
+          return '';
+        });
 
-        if (rulesToInsert) {
-          registeredRules.push(selector, rulesToInsert);
-          selector = selector.replace(/\&/g, `.${className}`);
-          stylesheet.insertRule(`${selector}{${rulesToInsert}}`);
-        }
+        // Insert.
+        stylesheet.insertRule(`${selector}{${rules}}`);
       }
-
-      stylesheet.cacheClassName(className, key, args, registeredRules);
     }
+    stylesheet.cacheClassName(
+      className!,
+      key!,
+      args!,
+      rulesToInsert
+    );
+
+  }
+}
+
+export function styleToClassName(...args: IStyle[]): string {
+  const registration = styleToRegistration(...args);
+  if (registration) {
+    applyRegistration(registration);
+
+    return registration.className;
   }
 
-  return className;
+  return '';
 }
diff --git a/scripts/tasks/jest-serializer-merge-styles.js b/scripts/tasks/jest-serializer-merge-styles.js
index 1159a3b934e09..bd59e50f7d69b 100644
--- a/scripts/tasks/jest-serializer-merge-styles.js
+++ b/scripts/tasks/jest-serializer-merge-styles.js
@@ -40,15 +40,20 @@ function serializeRules(rules, indent) {
   let ruleStrings = [];
 
   for (let i = 0; i < rules.length; i += 2) {
-    ruleStrings.push(indent((i === 0 ? '' : rules[i] + ' ') + `{`));
+    const selector = rules[i];
+    const insertedRules = rules[i + 1];
 
-    rules[i + 1].split(';').sort().forEach(rule => {
-      if (rule) {
-        ruleStrings.push(indent('  ' + rule.replace(':', ': ') + ';'));
-      }
-    });
+    if (insertedRules) {
+      ruleStrings.push(indent((i === 0 ? '' : selector + ' ') + `{`));
+
+      insertedRules.split(';').sort().forEach(rule => {
+        if (rule) {
+          ruleStrings.push(indent('  ' + rule.replace(':', ': ') + ';'));
+        }
+      });
 
-    ruleStrings.push(indent('}'));
+      ruleStrings.push(indent('}'));
+    }
   }
 
   return ruleStrings.join('\n');
diff --git a/scripts/tasks/jest.js b/scripts/tasks/jest.js
index e25c61984361b..3f2f0a9debaa8 100644
--- a/scripts/tasks/jest.js
+++ b/scripts/tasks/jest.js
@@ -8,7 +8,7 @@ module.exports = function (options) {
 
   if (fs.existsSync(jestConfigPath)) {
     const jestPath = path.resolve(__dirname, '../node_modules/jest/bin/jest');
-    const customArgs = options.argv.slice(3).join(' ');
+    const customArgs = options && options.argv ? options.argv.slice(3).join(' ') : '';
 
     const args = [
       // Specify the config file.

From 455215fe568350d7c85cfc8e4a6917aaa330cf38 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 5 Oct 2017 03:17:43 -0700
Subject: [PATCH 0786/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  4 +--
 apps/ssr-tests/package.json                   |  4 +--
 .../icons/iconnames_2017-10-05-05-46.json     | 11 --------
 .../mergestylesets_2017-10-04-23-23.json      | 11 --------
 ...button-icon-minWidth_2017-09-21-18-42.json | 11 --------
 packages/example-app-base/CHANGELOG.json      |  6 +++++
 packages/example-app-base/CHANGELOG.md        |  7 +++++-
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/package.json             |  8 +++---
 packages/icons/CHANGELOG.json                 | 14 +++++++++++
 packages/icons/CHANGELOG.md                   |  9 ++++++-
 packages/icons/package.json                   |  2 +-
 packages/merge-styles/CHANGELOG.json          | 14 +++++++++++
 packages/merge-styles/CHANGELOG.md            |  9 ++++++-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 25 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++-
 packages/office-ui-fabric-react/package.json  | 10 ++++----
 packages/styling/package.json                 |  2 +-
 scripts/package.json                          |  2 +-
 20 files changed, 107 insertions(+), 55 deletions(-)
 delete mode 100644 common/changes/@uifabric/icons/iconnames_2017-10-05-05-46.json
 delete mode 100644 common/changes/@uifabric/merge-styles/mergestylesets_2017-10-04-23-23.json
 delete mode 100644 common/changes/office-ui-fabric-react/button-icon-minWidth_2017-09-21-18-42.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index f239524ef59b3..b95a94d7aa06b 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -42,10 +42,10 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/icons": ">=5.0.1 <6.0.0",
+    "@uifabric/icons": ">=5.1.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=6.0.0 <7.0.0",
+    "office-ui-fabric-react": ">=6.0.1 <7.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 8379024eae6e1..cc8be515e6e53 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -17,14 +17,14 @@
   "license": "MIT",
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
-    "@uifabric/icons": ">=5.0.1 <6.0.0",
+    "@uifabric/icons": ">=5.1.0 <6.0.0",
     "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.8",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=6.0.0 <7.0.0",
+    "office-ui-fabric-react": ">=6.0.1 <7.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/common/changes/@uifabric/icons/iconnames_2017-10-05-05-46.json b/common/changes/@uifabric/icons/iconnames_2017-10-05-05-46.json
deleted file mode 100644
index 2d8b3416bdeb8..0000000000000
--- a/common/changes/@uifabric/icons/iconnames_2017-10-05-05-46.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/icons",
-      "comment": "Exporting `IconNames` const enum.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/icons",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/mergestylesets_2017-10-04-23-23.json b/common/changes/@uifabric/merge-styles/mergestylesets_2017-10-04-23-23.json
deleted file mode 100644
index 042b189dfe079..0000000000000
--- a/common/changes/@uifabric/merge-styles/mergestylesets_2017-10-04-23-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "Adding selector support to target child class names that were generated in the same mergeStyleSets set.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/button-icon-minWidth_2017-09-21-18-42.json b/common/changes/office-ui-fabric-react/button-icon-minWidth_2017-09-21-18-42.json
deleted file mode 100644
index 5eda5706a1cbc..0000000000000
--- a/common/changes/office-ui-fabric-react/button-icon-minWidth_2017-09-21-18-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added min-width for button icons so that its easy to create buttons with space for an icon",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 55056d6bcdd5e..b2c09569323d4 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,12 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "5.0.5",
+      "tag": "@uifabric/example-app-base_v5.0.5",
+      "date": "Thu, 05 Oct 2017 10:17:42 GMT",
+      "comments": {}
+    },
     {
       "version": "5.0.4",
       "tag": "@uifabric/example-app-base_v5.0.4",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index b76b21494416e..0aeaa0825abe8 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,11 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Wed, 04 Oct 2017 22:40:22 GMT and should not be manually modified.
+This log was last generated on Thu, 05 Oct 2017 10:17:42 GMT and should not be manually modified.
+
+## 5.0.5
+Thu, 05 Oct 2017 10:17:42 GMT
+
+*Changes not tracked*
 
 ## 5.0.4
 Wed, 04 Oct 2017 22:40:22 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 376656f51138a..3f88c31341e7f 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "5.0.4",
+  "version": "5.0.5",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index d57340d41de78..d913cbd233403 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -28,8 +28,8 @@
     "@types/jest": "^21.1.0",
     "@types/enzyme": "^2.8.8",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=5.0.4 <6.0.0",
-    "@uifabric/icons": ">=5.0.1 <6.0.0",
+    "@uifabric/example-app-base": ">=5.0.5 <6.0.0",
+    "@uifabric/icons": ">=5.1.0 <6.0.0",
     "es6-weak-map": "^2.0.2",
     "enzyme": "^2.9.1",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
@@ -42,8 +42,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=6.0.0 <7.0.0",
-    "@uifabric/icons": ">=5.0.1 <6.0.0",
+    "office-ui-fabric-react": ">=6.0.1 <7.0.0",
+    "@uifabric/icons": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/icons/CHANGELOG.json b/packages/icons/CHANGELOG.json
index 1dc22bbdac839..663c4567f94d9 100644
--- a/packages/icons/CHANGELOG.json
+++ b/packages/icons/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/icons",
   "entries": [
+    {
+      "version": "5.1.0",
+      "tag": "@uifabric/icons_v5.1.0",
+      "date": "Thu, 05 Oct 2017 10:17:42 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "c13ebe30151821c40de32a3e64d3da7e476a030a",
+            "comment": "Exporting `IconNames` const enum."
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.1",
       "tag": "@uifabric/icons_v5.0.1",
diff --git a/packages/icons/CHANGELOG.md b/packages/icons/CHANGELOG.md
index b273e6be68f26..12323d567a9b4 100644
--- a/packages/icons/CHANGELOG.md
+++ b/packages/icons/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/icons
 
-This log was last generated on Wed, 27 Sep 2017 00:20:58 GMT and should not be manually modified.
+This log was last generated on Thu, 05 Oct 2017 10:17:42 GMT and should not be manually modified.
+
+## 5.1.0
+Thu, 05 Oct 2017 10:17:42 GMT
+
+### Minor changes
+
+- Exporting `IconNames` const enum.
 
 ## 5.0.1
 Wed, 27 Sep 2017 00:20:58 GMT
diff --git a/packages/icons/package.json b/packages/icons/package.json
index c6cf7717dc295..ffb59f274d7f3 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/icons",
-  "version": "5.0.1",
+  "version": "5.1.0",
   "description": "Office UI Fabric icon set.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index ffff008957912..f898f5a3301dc 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.3.0",
+      "tag": "@uifabric/merge-styles_v5.3.0",
+      "date": "Thu, 05 Oct 2017 10:17:42 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "f95fa74185b6faaf278fdc0a78e72635bcc3ec48",
+            "comment": "Adding selector support to target child class names that were generated in the same mergeStyleSets set."
+          }
+        ]
+      }
+    },
     {
       "version": "5.2.0",
       "tag": "@uifabric/merge-styles_v5.2.0",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index 213ae9b582c1c..7a142659d669e 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Sat, 30 Sep 2017 01:26:37 GMT and should not be manually modified.
+This log was last generated on Thu, 05 Oct 2017 10:17:42 GMT and should not be manually modified.
+
+## 5.3.0
+Thu, 05 Oct 2017 10:17:42 GMT
+
+### Minor changes
+
+- Adding selector support to target child class names that were generated in the same mergeStyleSets set.
 
 ## 5.2.0
 Sat, 30 Sep 2017 01:26:37 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index 092dde1a426e2..039874693e6c5 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.2.0",
+  "version": "5.3.0",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 441e22ed10089..1b5ef6cf42d8b 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,31 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "6.0.1",
+      "tag": "office-ui-fabric-react_v6.0.1",
+      "date": "Thu, 05 Oct 2017 10:17:42 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "a5c8a8d29987e03cf87f704b74e38d181516afca",
+            "comment": "Added min-width for button icons so that its easy to create buttons with space for an icon"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/icons\" from `>=5.0.1 <6.0.0` to `>=5.1.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.2.0 <6.0.0` to `>=5.3.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=5.0.4 <6.0.0` to `>=5.0.5 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "6.0.0",
       "tag": "office-ui-fabric-react_v6.0.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index f7a6e14f7475e..1a3a5dd4cff1c 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 04 Oct 2017 22:40:22 GMT and should not be manually modified.
+This log was last generated on Thu, 05 Oct 2017 10:17:42 GMT and should not be manually modified.
+
+## 6.0.1
+Thu, 05 Oct 2017 10:17:42 GMT
+
+### Patches
+
+- Added min-width for button icons so that its easy to create buttons with space for an icon
 
 ## 6.0.0
 Wed, 04 Oct 2017 22:40:22 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index b3e79acf44ba2..03b140090e7a0 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "6.0.0",
+  "version": "6.0.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -26,7 +26,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=5.0.4 <6.0.0",
+    "@uifabric/example-app-base": ">=5.0.5 <6.0.0",
     "enzyme": "^2.9.1",
     "es6-promise": "^4.1.0",
     "es6-map": "^0.1.5",
@@ -43,8 +43,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/icons": ">=5.0.1 <6.0.0",
-    "@uifabric/merge-styles": ">=5.2.0 <6.0.0",
+    "@uifabric/icons": ">=5.1.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.3.0 <6.0.0",
     "@uifabric/styling": ">=5.1.1 <6.0.0",
     "@uifabric/utilities": ">=6.0.0 <7.0.0",
     "prop-types": "^15.5.10",
@@ -54,4 +54,4 @@
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   }
-}
+}
\ No newline at end of file
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 261105ad88507..4af683a70ca3f 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -21,7 +21,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/utilities": ">=6.0.0 <7.0.0",
-    "@uifabric/merge-styles": ">=5.2.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/scripts/package.json b/scripts/package.json
index cf8ded2191d71..64cf2e11cca18 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -9,7 +9,7 @@
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@microsoft/loader-load-themed-styles": "^1.4.2",
-    "@uifabric/merge-styles": ">=5.2.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.3.0 <6.0.0",
     "autoprefixer": "^7.1.2",
     "awesome-typescript-loader": "^3.2.3",
     "chalk": "^2.1.0",

From b07513cf96f054685766b3ffbf9896b1d10332f9 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 5 Oct 2017 09:18:31 -0700
Subject: [PATCH 0787/1641] Undo the 6.0 bump of utilities, which was made
 inadvertently (#3039)

* Undo 6.0 bump of utilities.

* change file

* Fixing shrinkwrap.

* Updates.
---
 .../fix-utilities_2017-10-05-15-31.json       |   11 +
 common/config/rush/npm-shrinkwrap.json        | 2459 ++++++++++++++++-
 packages/example-app-base/package.json        |    2 +-
 packages/office-ui-fabric-react/package.json  |    2 +-
 packages/styling/package.json                 |    2 +-
 packages/utilities/package.json               |    2 +-
 6 files changed, 2365 insertions(+), 113 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/fix-utilities_2017-10-05-15-31.json

diff --git a/common/changes/@uifabric/utilities/fix-utilities_2017-10-05-15-31.json b/common/changes/@uifabric/utilities/fix-utilities_2017-10-05-15-31.json
new file mode 100644
index 0000000000000..d4e002327658e
--- /dev/null
+++ b/common/changes/@uifabric/utilities/fix-utilities_2017-10-05-15-31.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Undoing 6.0 bump which was made by automation inadvertently.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 26dc9812edfc3..39072b628e94d 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -19,72 +19,2248 @@
       "integrity": "sha1-apeiLzpi5UwLUwo+jxSYrSuE19w="
     },
     "@rush-temp/build": {
-      "version": "file:projects/build"
+      "version": "file:projects/build",
+      "dependencies": {
+        "acorn": {
+          "version": "5.1.1",
+          "bundled": true
+        },
+        "ajv": {
+          "version": "5.2.2",
+          "bundled": true
+        },
+        "ajv-keywords": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "ansi-regex": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "ansi-styles": {
+          "version": "2.2.1",
+          "bundled": true
+        },
+        "async": {
+          "version": "2.5.0",
+          "bundled": true
+        },
+        "autoprefixer": {
+          "version": "7.1.2",
+          "bundled": true
+        },
+        "browserslist": {
+          "version": "2.3.3",
+          "bundled": true
+        },
+        "camelcase": {
+          "version": "4.1.0",
+          "bundled": true
+        },
+        "cliui": {
+          "version": "3.2.0",
+          "bundled": true,
+          "dependencies": {
+            "ansi-regex": {
+              "version": "2.1.1",
+              "bundled": true
+            },
+            "is-fullwidth-code-point": {
+              "version": "1.0.0",
+              "bundled": true
+            },
+            "string-width": {
+              "version": "1.0.2",
+              "bundled": true
+            },
+            "strip-ansi": {
+              "version": "3.0.1",
+              "bundled": true
+            }
+          }
+        },
+        "constants-browserify": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "crypto-browserify": {
+          "version": "3.11.1",
+          "bundled": true
+        },
+        "css-loader": {
+          "version": "0.28.5",
+          "bundled": true,
+          "dependencies": {
+            "ansi-regex": {
+              "version": "2.1.1",
+              "bundled": true
+            },
+            "chalk": {
+              "version": "1.1.3",
+              "bundled": true,
+              "dependencies": {
+                "supports-color": {
+                  "version": "2.0.0",
+                  "bundled": true
+                }
+              }
+            },
+            "has-flag": {
+              "version": "1.0.0",
+              "bundled": true
+            },
+            "postcss": {
+              "version": "5.2.17",
+              "bundled": true
+            },
+            "strip-ansi": {
+              "version": "3.0.1",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "3.2.3",
+              "bundled": true
+            }
+          }
+        },
+        "debug": {
+          "version": "2.6.8",
+          "bundled": true
+        },
+        "enhanced-resolve": {
+          "version": "3.4.1",
+          "bundled": true
+        },
+        "etag": {
+          "version": "1.8.0",
+          "bundled": true
+        },
+        "express": {
+          "version": "4.15.4",
+          "bundled": true
+        },
+        "find-up": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "fresh": {
+          "version": "0.5.0",
+          "bundled": true
+        },
+        "has-flag": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "https-browserify": {
+          "version": "0.0.1",
+          "bundled": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "load-json-file": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "loader-utils": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "lodash.camelcase": {
+          "version": "4.3.0",
+          "bundled": true
+        },
+        "mime": {
+          "version": "1.3.4",
+          "bundled": true
+        },
+        "node-libs-browser": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "os-browserify": {
+          "version": "0.2.1",
+          "bundled": true
+        },
+        "os-locale": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "path-to-regexp": {
+          "version": "0.1.7",
+          "bundled": true
+        },
+        "path-type": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "pify": {
+          "version": "2.3.0",
+          "bundled": true
+        },
+        "qs": {
+          "version": "6.5.0",
+          "bundled": true
+        },
+        "read-pkg": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg-up": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "readable-stream": {
+          "version": "2.3.3",
+          "bundled": true,
+          "dependencies": {
+            "string_decoder": {
+              "version": "1.0.3",
+              "bundled": true
+            }
+          }
+        },
+        "semver": {
+          "version": "5.4.1",
+          "bundled": true
+        },
+        "send": {
+          "version": "0.15.4",
+          "bundled": true
+        },
+        "serve-static": {
+          "version": "1.12.4",
+          "bundled": true
+        },
+        "source-list-map": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "bundled": true
+        },
+        "stream-browserify": {
+          "version": "2.0.1",
+          "bundled": true
+        },
+        "string_decoder": {
+          "version": "0.10.31",
+          "bundled": true
+        },
+        "string-width": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "bundled": true
+        },
+        "strip-bom": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "supports-color": {
+          "version": "4.2.1",
+          "bundled": true
+        },
+        "tapable": {
+          "version": "0.2.8",
+          "bundled": true
+        },
+        "timers-browserify": {
+          "version": "2.0.4",
+          "bundled": true
+        },
+        "tslint": {
+          "version": "5.6.0",
+          "bundled": true
+        },
+        "ultron": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "url": {
+          "version": "0.11.0",
+          "bundled": true,
+          "dependencies": {
+            "punycode": {
+              "version": "1.3.2",
+              "bundled": true
+            }
+          }
+        },
+        "utils-merge": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "watchpack": {
+          "version": "1.4.0",
+          "bundled": true
+        },
+        "webpack": {
+          "version": "3.5.5",
+          "bundled": true,
+          "dependencies": {
+            "yargs": {
+              "version": "8.0.2",
+              "bundled": true
+            }
+          }
+        },
+        "webpack-bundle-analyzer": {
+          "version": "2.9.0",
+          "bundled": true,
+          "dependencies": {
+            "ansi-regex": {
+              "version": "2.1.1",
+              "bundled": true
+            },
+            "chalk": {
+              "version": "1.1.3",
+              "bundled": true
+            },
+            "lodash": {
+              "version": "4.17.4",
+              "bundled": true
+            },
+            "strip-ansi": {
+              "version": "3.0.1",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "2.0.0",
+              "bundled": true
+            }
+          }
+        },
+        "webpack-sources": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "which-module": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "ws": {
+          "version": "2.3.1",
+          "bundled": true,
+          "dependencies": {
+            "safe-buffer": {
+              "version": "5.0.1",
+              "bundled": true
+            }
+          }
+        },
+        "yargs-parser": {
+          "version": "7.0.0",
+          "bundled": true
+        }
+      }
+    },
+    "@rush-temp/example-app-base": {
+      "version": "file:projects/example-app-base",
+      "dependencies": {
+        "acorn": {
+          "version": "5.1.1",
+          "bundled": true
+        },
+        "ajv": {
+          "version": "5.2.2",
+          "bundled": true
+        },
+        "ajv-keywords": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "ansi-regex": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "async": {
+          "version": "2.5.0",
+          "bundled": true
+        },
+        "camelcase": {
+          "version": "4.1.0",
+          "bundled": true
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "bundled": true,
+          "dependencies": {
+            "ansi-regex": {
+              "version": "2.1.1",
+              "bundled": true
+            },
+            "strip-ansi": {
+              "version": "3.0.1",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "2.0.0",
+              "bundled": true
+            }
+          }
+        },
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
+        "constants-browserify": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "crypto-browserify": {
+          "version": "3.11.1",
+          "bundled": true
+        },
+        "css-loader": {
+          "version": "0.28.5",
+          "bundled": true
+        },
+        "debug": {
+          "version": "2.6.8",
+          "bundled": true,
+          "dependencies": {
+            "ms": {
+              "version": "2.0.0",
+              "bundled": true
+            }
+          }
+        },
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
+        },
+        "enhanced-resolve": {
+          "version": "3.4.1",
+          "bundled": true
+        },
+        "find-up": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "glob": {
+          "version": "7.1.1",
+          "bundled": true
+        },
+        "https-browserify": {
+          "version": "0.0.1",
+          "bundled": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "load-json-file": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "loader-utils": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "lodash.camelcase": {
+          "version": "4.3.0",
+          "bundled": true
+        },
+        "mocha": {
+          "version": "3.5.0",
+          "bundled": true
+        },
+        "ms": {
+          "version": "0.7.2",
+          "bundled": true
+        },
+        "node-libs-browser": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "os-browserify": {
+          "version": "0.2.1",
+          "bundled": true
+        },
+        "os-locale": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "path-type": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "bundled": true,
+          "dependencies": {
+            "supports-color": {
+              "version": "3.2.3",
+              "bundled": true
+            }
+          }
+        },
+        "read-pkg": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg-up": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "readable-stream": {
+          "version": "2.3.3",
+          "bundled": true,
+          "dependencies": {
+            "string_decoder": {
+              "version": "1.0.3",
+              "bundled": true
+            }
+          }
+        },
+        "source-list-map": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "source-map": {
+          "version": "0.1.43",
+          "bundled": true
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "0.9.2",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "0.2.17",
+              "bundled": true
+            }
+          }
+        },
+        "stream-browserify": {
+          "version": "2.0.1",
+          "bundled": true
+        },
+        "string-width": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "bundled": true
+        },
+        "strip-bom": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "style-loader": {
+          "version": "0.17.0",
+          "bundled": true
+        },
+        "supports-color": {
+          "version": "3.1.2",
+          "bundled": true
+        },
+        "tapable": {
+          "version": "0.2.8",
+          "bundled": true
+        },
+        "timers-browserify": {
+          "version": "2.0.4",
+          "bundled": true
+        },
+        "url": {
+          "version": "0.11.0",
+          "bundled": true,
+          "dependencies": {
+            "punycode": {
+              "version": "1.3.2",
+              "bundled": true
+            }
+          }
+        },
+        "watchpack": {
+          "version": "1.4.0",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            }
+          }
+        },
+        "webpack": {
+          "version": "3.5.5",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            },
+            "has-flag": {
+              "version": "2.0.0",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "1.1.0",
+              "bundled": true
+            },
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "4.2.1",
+              "bundled": true
+            }
+          }
+        },
+        "webpack-sources": {
+          "version": "1.0.1",
+          "bundled": true,
+          "dependencies": {
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
+        },
+        "which-module": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "yargs": {
+          "version": "8.0.2",
+          "bundled": true
+        },
+        "yargs-parser": {
+          "version": "7.0.0",
+          "bundled": true
+        }
+      }
+    },
+    "@rush-temp/experiments": {
+      "version": "file:projects/experiments",
+      "dependencies": {
+        "acorn": {
+          "version": "5.1.1",
+          "bundled": true
+        },
+        "ajv": {
+          "version": "5.2.2",
+          "bundled": true
+        },
+        "ajv-keywords": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "ansi-regex": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "async": {
+          "version": "2.5.0",
+          "bundled": true
+        },
+        "autoprefixer": {
+          "version": "6.7.7",
+          "bundled": true
+        },
+        "browserslist": {
+          "version": "1.7.7",
+          "bundled": true
+        },
+        "camelcase": {
+          "version": "4.1.0",
+          "bundled": true
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "bundled": true,
+          "dependencies": {
+            "ansi-regex": {
+              "version": "2.1.1",
+              "bundled": true
+            },
+            "strip-ansi": {
+              "version": "3.0.1",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "2.0.0",
+              "bundled": true
+            }
+          }
+        },
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
+        "constants-browserify": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "crypto-browserify": {
+          "version": "3.11.1",
+          "bundled": true
+        },
+        "css-loader": {
+          "version": "0.28.5",
+          "bundled": true
+        },
+        "debug": {
+          "version": "2.6.8",
+          "bundled": true
+        },
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
+        },
+        "enhanced-resolve": {
+          "version": "3.4.1",
+          "bundled": true
+        },
+        "find-up": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "glob": {
+          "version": "7.1.1",
+          "bundled": true
+        },
+        "https-browserify": {
+          "version": "0.0.1",
+          "bundled": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "load-json-file": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "loader-utils": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "lodash.camelcase": {
+          "version": "4.3.0",
+          "bundled": true
+        },
+        "lolex": {
+          "version": "1.6.0",
+          "bundled": true
+        },
+        "mocha": {
+          "version": "3.5.0",
+          "bundled": true
+        },
+        "node-libs-browser": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "os-browserify": {
+          "version": "0.2.1",
+          "bundled": true
+        },
+        "os-locale": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "path-type": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "bundled": true,
+          "dependencies": {
+            "supports-color": {
+              "version": "3.2.3",
+              "bundled": true
+            }
+          }
+        },
+        "postcss-loader": {
+          "version": "1.3.3",
+          "bundled": true
+        },
+        "read-pkg": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg-up": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "readable-stream": {
+          "version": "2.3.3",
+          "bundled": true,
+          "dependencies": {
+            "string_decoder": {
+              "version": "1.0.3",
+              "bundled": true
+            }
+          }
+        },
+        "sinon": {
+          "version": "2.4.1",
+          "bundled": true
+        },
+        "source-list-map": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "stream-browserify": {
+          "version": "2.0.1",
+          "bundled": true
+        },
+        "string-width": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "bundled": true
+        },
+        "strip-bom": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "style-loader": {
+          "version": "0.17.0",
+          "bundled": true
+        },
+        "supports-color": {
+          "version": "3.1.2",
+          "bundled": true
+        },
+        "tapable": {
+          "version": "0.2.8",
+          "bundled": true
+        },
+        "timers-browserify": {
+          "version": "2.0.4",
+          "bundled": true
+        },
+        "url": {
+          "version": "0.11.0",
+          "bundled": true,
+          "dependencies": {
+            "punycode": {
+              "version": "1.3.2",
+              "bundled": true
+            }
+          }
+        },
+        "watchpack": {
+          "version": "1.4.0",
+          "bundled": true
+        },
+        "webpack": {
+          "version": "3.5.5",
+          "bundled": true,
+          "dependencies": {
+            "has-flag": {
+              "version": "2.0.0",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "4.2.1",
+              "bundled": true
+            }
+          }
+        },
+        "webpack-sources": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "which-module": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "yargs": {
+          "version": "8.0.2",
+          "bundled": true
+        },
+        "yargs-parser": {
+          "version": "7.0.0",
+          "bundled": true
+        }
+      }
+    },
+    "@rush-temp/fabric-website": {
+      "version": "file:projects/fabric-website",
+      "dependencies": {
+        "@types/react-addons-test-utils": {
+          "version": "0.14.19",
+          "bundled": true
+        },
+        "acorn": {
+          "version": "5.1.1",
+          "bundled": true
+        },
+        "ajv": {
+          "version": "5.2.2",
+          "bundled": true
+        },
+        "ajv-keywords": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "ansi-regex": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "async": {
+          "version": "2.5.0",
+          "bundled": true
+        },
+        "autoprefixer": {
+          "version": "6.7.7",
+          "bundled": true
+        },
+        "browserslist": {
+          "version": "1.7.7",
+          "bundled": true
+        },
+        "camelcase": {
+          "version": "4.1.0",
+          "bundled": true
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "bundled": true,
+          "dependencies": {
+            "ansi-regex": {
+              "version": "2.1.1",
+              "bundled": true
+            },
+            "strip-ansi": {
+              "version": "3.0.1",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "2.0.0",
+              "bundled": true
+            }
+          }
+        },
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
+        "constants-browserify": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "crypto-browserify": {
+          "version": "3.11.1",
+          "bundled": true
+        },
+        "css-loader": {
+          "version": "0.28.5",
+          "bundled": true
+        },
+        "debug": {
+          "version": "2.6.8",
+          "bundled": true
+        },
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
+        },
+        "enhanced-resolve": {
+          "version": "3.4.1",
+          "bundled": true
+        },
+        "find-up": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "glob": {
+          "version": "7.1.1",
+          "bundled": true
+        },
+        "https-browserify": {
+          "version": "0.0.1",
+          "bundled": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "load-json-file": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "loader-utils": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "lodash.camelcase": {
+          "version": "4.3.0",
+          "bundled": true
+        },
+        "mocha": {
+          "version": "3.5.0",
+          "bundled": true
+        },
+        "node-libs-browser": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "os-browserify": {
+          "version": "0.2.1",
+          "bundled": true
+        },
+        "os-locale": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "path-type": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "bundled": true,
+          "dependencies": {
+            "source-map": {
+              "version": "0.5.7",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "3.2.3",
+              "bundled": true
+            }
+          }
+        },
+        "postcss-loader": {
+          "version": "1.3.3",
+          "bundled": true
+        },
+        "react": {
+          "version": "15.6.1",
+          "bundled": true
+        },
+        "react-dom": {
+          "version": "15.6.1",
+          "bundled": true
+        },
+        "react-highlight": {
+          "version": "0.9.0",
+          "bundled": true
+        },
+        "read-pkg": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg-up": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "readable-stream": {
+          "version": "2.3.3",
+          "bundled": true,
+          "dependencies": {
+            "string_decoder": {
+              "version": "1.0.3",
+              "bundled": true
+            }
+          }
+        },
+        "sinon": {
+          "version": "2.4.1",
+          "bundled": true
+        },
+        "source-list-map": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "source-map": {
+          "version": "0.1.43",
+          "bundled": true
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "0.9.2",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "0.2.17",
+              "bundled": true
+            }
+          }
+        },
+        "stream-browserify": {
+          "version": "2.0.1",
+          "bundled": true
+        },
+        "string-width": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "bundled": true
+        },
+        "strip-bom": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "supports-color": {
+          "version": "3.1.2",
+          "bundled": true
+        },
+        "tapable": {
+          "version": "0.2.8",
+          "bundled": true
+        },
+        "timers-browserify": {
+          "version": "2.0.4",
+          "bundled": true
+        },
+        "url": {
+          "version": "0.11.0",
+          "bundled": true,
+          "dependencies": {
+            "punycode": {
+              "version": "1.3.2",
+              "bundled": true
+            }
+          }
+        },
+        "watchpack": {
+          "version": "1.4.0",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            }
+          }
+        },
+        "webpack": {
+          "version": "3.5.5",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            },
+            "camelcase": {
+              "version": "4.1.0",
+              "bundled": true
+            },
+            "has-flag": {
+              "version": "2.0.0",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "1.1.0",
+              "bundled": true
+            },
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "4.2.1",
+              "bundled": true
+            },
+            "yargs": {
+              "version": "8.0.2",
+              "bundled": true
+            },
+            "yargs-parser": {
+              "version": "7.0.0",
+              "bundled": true
+            }
+          }
+        },
+        "webpack-sources": {
+          "version": "1.0.1",
+          "bundled": true,
+          "dependencies": {
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
+        },
+        "which-module": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "yargs": {
+          "version": "8.0.2",
+          "bundled": true
+        },
+        "yargs-parser": {
+          "version": "7.0.0",
+          "bundled": true
+        }
+      }
+    },
+    "@rush-temp/icons": {
+      "version": "file:projects/icons"
+    },
+    "@rush-temp/merge-styles": {
+      "version": "file:projects/merge-styles",
+      "dependencies": {
+        "@types/jest": {
+          "version": "21.1.0",
+          "bundled": true
+        },
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
+        "debug": {
+          "version": "2.6.8",
+          "bundled": true
+        },
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
+        },
+        "glob": {
+          "version": "7.1.1",
+          "bundled": true
+        },
+        "mocha": {
+          "version": "3.5.0",
+          "bundled": true
+        },
+        "supports-color": {
+          "version": "3.1.2",
+          "bundled": true
+        }
+      }
+    },
+    "@rush-temp/office-ui-fabric-react": {
+      "version": "file:projects/office-ui-fabric-react",
+      "dependencies": {
+        "@types/jest": {
+          "version": "21.1.0",
+          "bundled": true
+        },
+        "@types/react-dom": {
+          "version": "15.5.5",
+          "bundled": true
+        },
+        "acorn": {
+          "version": "5.1.1",
+          "bundled": true
+        },
+        "ajv": {
+          "version": "5.2.2",
+          "bundled": true
+        },
+        "ajv-keywords": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "ansi-regex": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "async": {
+          "version": "2.5.0",
+          "bundled": true
+        },
+        "autoprefixer": {
+          "version": "6.7.7",
+          "bundled": true
+        },
+        "browserslist": {
+          "version": "1.7.7",
+          "bundled": true
+        },
+        "camelcase": {
+          "version": "4.1.0",
+          "bundled": true
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "bundled": true,
+          "dependencies": {
+            "ansi-regex": {
+              "version": "2.1.1",
+              "bundled": true
+            },
+            "strip-ansi": {
+              "version": "3.0.1",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "2.0.0",
+              "bundled": true
+            }
+          }
+        },
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
+        "constants-browserify": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "crypto-browserify": {
+          "version": "3.11.1",
+          "bundled": true
+        },
+        "css-loader": {
+          "version": "0.28.5",
+          "bundled": true
+        },
+        "debug": {
+          "version": "2.6.8",
+          "bundled": true
+        },
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
+        },
+        "enhanced-resolve": {
+          "version": "3.4.1",
+          "bundled": true
+        },
+        "find-up": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "glob": {
+          "version": "7.1.1",
+          "bundled": true
+        },
+        "https-browserify": {
+          "version": "0.0.1",
+          "bundled": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "load-json-file": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "loader-utils": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "lodash.camelcase": {
+          "version": "4.3.0",
+          "bundled": true
+        },
+        "lolex": {
+          "version": "1.6.0",
+          "bundled": true
+        },
+        "mocha": {
+          "version": "3.5.0",
+          "bundled": true
+        },
+        "node-libs-browser": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "os-browserify": {
+          "version": "0.2.1",
+          "bundled": true
+        },
+        "os-locale": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "path-type": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "postcss": {
+          "version": "5.2.17",
+          "bundled": true,
+          "dependencies": {
+            "source-map": {
+              "version": "0.5.7",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "3.2.3",
+              "bundled": true
+            }
+          }
+        },
+        "postcss-loader": {
+          "version": "1.3.3",
+          "bundled": true
+        },
+        "read-pkg": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg-up": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "readable-stream": {
+          "version": "2.3.3",
+          "bundled": true,
+          "dependencies": {
+            "string_decoder": {
+              "version": "1.0.3",
+              "bundled": true
+            }
+          }
+        },
+        "sinon": {
+          "version": "2.4.1",
+          "bundled": true
+        },
+        "source-list-map": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "source-map": {
+          "version": "0.1.43",
+          "bundled": true
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "0.9.2",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "0.2.17",
+              "bundled": true
+            }
+          }
+        },
+        "stream-browserify": {
+          "version": "2.0.1",
+          "bundled": true
+        },
+        "string-width": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "bundled": true
+        },
+        "strip-bom": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "style-loader": {
+          "version": "0.17.0",
+          "bundled": true
+        },
+        "supports-color": {
+          "version": "3.1.2",
+          "bundled": true
+        },
+        "tapable": {
+          "version": "0.2.8",
+          "bundled": true
+        },
+        "timers-browserify": {
+          "version": "2.0.4",
+          "bundled": true
+        },
+        "url": {
+          "version": "0.11.0",
+          "bundled": true,
+          "dependencies": {
+            "punycode": {
+              "version": "1.3.2",
+              "bundled": true
+            }
+          }
+        },
+        "watchpack": {
+          "version": "1.4.0",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            }
+          }
+        },
+        "webpack": {
+          "version": "3.5.5",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            },
+            "has-flag": {
+              "version": "2.0.0",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "1.1.0",
+              "bundled": true
+            },
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "4.2.1",
+              "bundled": true
+            }
+          }
+        },
+        "webpack-sources": {
+          "version": "1.0.1",
+          "bundled": true,
+          "dependencies": {
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
+        },
+        "which-module": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "yargs": {
+          "version": "8.0.2",
+          "bundled": true
+        },
+        "yargs-parser": {
+          "version": "7.0.0",
+          "bundled": true
+        }
+      }
+    },
+    "@rush-temp/office-ui-fabric-react-tslint": {
+      "version": "file:projects/office-ui-fabric-react-tslint"
+    },
+    "@rush-temp/ssr-tests": {
+      "version": "file:projects/ssr-tests",
+      "dependencies": {
+        "acorn": {
+          "version": "5.1.1",
+          "bundled": true
+        },
+        "ajv": {
+          "version": "5.2.2",
+          "bundled": true
+        },
+        "ajv-keywords": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "ansi-regex": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "async": {
+          "version": "2.5.0",
+          "bundled": true
+        },
+        "camelcase": {
+          "version": "4.1.0",
+          "bundled": true
+        },
+        "cliui": {
+          "version": "3.2.0",
+          "bundled": true,
+          "dependencies": {
+            "ansi-regex": {
+              "version": "2.1.1",
+              "bundled": true
+            },
+            "is-fullwidth-code-point": {
+              "version": "1.0.0",
+              "bundled": true
+            },
+            "string-width": {
+              "version": "1.0.2",
+              "bundled": true
+            },
+            "strip-ansi": {
+              "version": "3.0.1",
+              "bundled": true
+            }
+          }
+        },
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
+        "constants-browserify": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "crypto-browserify": {
+          "version": "3.11.1",
+          "bundled": true
+        },
+        "debug": {
+          "version": "2.6.0",
+          "bundled": true
+        },
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
+        },
+        "enhanced-resolve": {
+          "version": "3.4.1",
+          "bundled": true
+        },
+        "find-up": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "glob": {
+          "version": "7.1.1",
+          "bundled": true
+        },
+        "has-flag": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "https-browserify": {
+          "version": "0.0.1",
+          "bundled": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "load-json-file": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "loader-utils": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "mocha": {
+          "version": "3.3.0",
+          "bundled": true
+        },
+        "ms": {
+          "version": "0.7.2",
+          "bundled": true
+        },
+        "node-libs-browser": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "os-browserify": {
+          "version": "0.2.1",
+          "bundled": true
+        },
+        "os-locale": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "path-type": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "pify": {
+          "version": "2.3.0",
+          "bundled": true
+        },
+        "read-pkg": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg-up": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "readable-stream": {
+          "version": "2.3.3",
+          "bundled": true,
+          "dependencies": {
+            "string_decoder": {
+              "version": "1.0.3",
+              "bundled": true
+            }
+          }
+        },
+        "source-list-map": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "bundled": true
+        },
+        "stream-browserify": {
+          "version": "2.0.1",
+          "bundled": true
+        },
+        "string_decoder": {
+          "version": "0.10.31",
+          "bundled": true
+        },
+        "string-width": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "bundled": true
+        },
+        "strip-bom": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "supports-color": {
+          "version": "3.1.2",
+          "bundled": true
+        },
+        "tapable": {
+          "version": "0.2.8",
+          "bundled": true
+        },
+        "timers-browserify": {
+          "version": "2.0.4",
+          "bundled": true
+        },
+        "url": {
+          "version": "0.11.0",
+          "bundled": true,
+          "dependencies": {
+            "punycode": {
+              "version": "1.3.2",
+              "bundled": true
+            }
+          }
+        },
+        "watchpack": {
+          "version": "1.4.0",
+          "bundled": true
+        },
+        "webpack": {
+          "version": "3.5.5",
+          "bundled": true,
+          "dependencies": {
+            "has-flag": {
+              "version": "2.0.0",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "4.2.1",
+              "bundled": true
+            }
+          }
+        },
+        "webpack-sources": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "which-module": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "yargs": {
+          "version": "8.0.2",
+          "bundled": true
+        },
+        "yargs-parser": {
+          "version": "7.0.0",
+          "bundled": true
+        }
+      }
     },
-    "@rush-temp/example-app-base": {
-      "version": "file:projects/example-app-base"
+    "@rush-temp/styling": {
+      "version": "file:projects/styling",
+      "dependencies": {
+        "acorn": {
+          "version": "5.1.1",
+          "bundled": true
+        },
+        "ajv": {
+          "version": "5.2.2",
+          "bundled": true
+        },
+        "ajv-keywords": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "ansi-regex": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "async": {
+          "version": "2.5.0",
+          "bundled": true
+        },
+        "camelcase": {
+          "version": "4.1.0",
+          "bundled": true
+        },
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
+        "constants-browserify": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "crypto-browserify": {
+          "version": "3.11.1",
+          "bundled": true
+        },
+        "debug": {
+          "version": "2.6.8",
+          "bundled": true
+        },
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
+        },
+        "enhanced-resolve": {
+          "version": "3.4.1",
+          "bundled": true
+        },
+        "find-up": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "glob": {
+          "version": "7.1.1",
+          "bundled": true
+        },
+        "https-browserify": {
+          "version": "0.0.1",
+          "bundled": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "load-json-file": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "loader-utils": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "mocha": {
+          "version": "3.5.0",
+          "bundled": true
+        },
+        "node-libs-browser": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "os-browserify": {
+          "version": "0.2.1",
+          "bundled": true
+        },
+        "os-locale": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "path-type": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg-up": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "readable-stream": {
+          "version": "2.3.3",
+          "bundled": true,
+          "dependencies": {
+            "string_decoder": {
+              "version": "1.0.3",
+              "bundled": true
+            }
+          }
+        },
+        "source-list-map": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "source-map": {
+          "version": "0.1.43",
+          "bundled": true
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "0.9.2",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "0.2.17",
+              "bundled": true
+            }
+          }
+        },
+        "stream-browserify": {
+          "version": "2.0.1",
+          "bundled": true
+        },
+        "string-width": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "bundled": true
+        },
+        "strip-bom": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "supports-color": {
+          "version": "3.1.2",
+          "bundled": true
+        },
+        "tapable": {
+          "version": "0.2.8",
+          "bundled": true
+        },
+        "timers-browserify": {
+          "version": "2.0.4",
+          "bundled": true
+        },
+        "url": {
+          "version": "0.11.0",
+          "bundled": true,
+          "dependencies": {
+            "punycode": {
+              "version": "1.3.2",
+              "bundled": true
+            }
+          }
+        },
+        "watchpack": {
+          "version": "1.4.0",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            }
+          }
+        },
+        "webpack": {
+          "version": "3.5.5",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            },
+            "has-flag": {
+              "version": "2.0.0",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "1.1.0",
+              "bundled": true
+            },
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            },
+            "supports-color": {
+              "version": "4.2.1",
+              "bundled": true
+            }
+          }
+        },
+        "webpack-sources": {
+          "version": "1.0.1",
+          "bundled": true,
+          "dependencies": {
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
+        },
+        "which-module": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "yargs": {
+          "version": "8.0.2",
+          "bundled": true
+        },
+        "yargs-parser": {
+          "version": "7.0.0",
+          "bundled": true
+        }
+      }
     },
-    "@rush-temp/experiments": {
-      "version": "file:projects/experiments",
+    "@rush-temp/test-bundle-button": {
+      "version": "file:projects/test-bundle-button",
       "dependencies": {
-        "lolex": {
-          "version": "1.6.0",
+        "acorn": {
+          "version": "5.1.1",
+          "bundled": true
+        },
+        "ajv": {
+          "version": "5.2.2",
+          "bundled": true
+        },
+        "ajv-keywords": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "ansi-regex": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "async": {
+          "version": "2.5.0",
+          "bundled": true
+        },
+        "camelcase": {
+          "version": "4.1.0",
           "bundled": true
         },
-        "sinon": {
-          "version": "2.4.1",
+        "constants-browserify": {
+          "version": "1.0.0",
           "bundled": true
-        }
-      }
-    },
-    "@rush-temp/fabric-website": {
-      "version": "file:projects/fabric-website"
-    },
-    "@rush-temp/icons": {
-      "version": "file:projects/icons"
-    },
-    "@rush-temp/merge-styles": {
-      "version": "file:projects/merge-styles",
-      "dependencies": {
-        "@types/jest": {
-          "version": "21.1.0",
+        },
+        "crypto-browserify": {
+          "version": "3.11.1",
           "bundled": true
-        }
-      }
-    },
-    "@rush-temp/office-ui-fabric-react": {
-      "version": "file:projects/office-ui-fabric-react",
-      "dependencies": {
-        "@types/jest": {
-          "version": "21.1.0",
+        },
+        "enhanced-resolve": {
+          "version": "3.4.1",
           "bundled": true
         },
-        "@types/react-dom": {
-          "version": "15.5.5",
+        "find-up": {
+          "version": "2.1.0",
           "bundled": true
         },
-        "lolex": {
-          "version": "1.6.0",
+        "has-flag": {
+          "version": "2.0.0",
           "bundled": true
         },
-        "sinon": {
-          "version": "2.4.1",
+        "https-browserify": {
+          "version": "0.0.1",
+          "bundled": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "load-json-file": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "loader-utils": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "node-libs-browser": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "os-browserify": {
+          "version": "0.2.1",
+          "bundled": true
+        },
+        "os-locale": {
+          "version": "2.1.0",
+          "bundled": true
+        },
+        "path-type": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "read-pkg-up": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "readable-stream": {
+          "version": "2.3.3",
+          "bundled": true,
+          "dependencies": {
+            "string_decoder": {
+              "version": "1.0.3",
+              "bundled": true
+            }
+          }
+        },
+        "source-list-map": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "source-map": {
+          "version": "0.1.43",
+          "bundled": true
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "0.9.2",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "0.2.17",
+              "bundled": true
+            }
+          }
+        },
+        "stream-browserify": {
+          "version": "2.0.1",
+          "bundled": true
+        },
+        "string-width": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "bundled": true
+        },
+        "strip-bom": {
+          "version": "3.0.0",
+          "bundled": true
+        },
+        "supports-color": {
+          "version": "4.2.1",
+          "bundled": true
+        },
+        "tapable": {
+          "version": "0.2.8",
+          "bundled": true
+        },
+        "timers-browserify": {
+          "version": "2.0.4",
+          "bundled": true
+        },
+        "url": {
+          "version": "0.11.0",
+          "bundled": true,
+          "dependencies": {
+            "punycode": {
+              "version": "1.3.2",
+              "bundled": true
+            }
+          }
+        },
+        "watchpack": {
+          "version": "1.4.0",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            }
+          }
+        },
+        "webpack": {
+          "version": "3.5.5",
+          "bundled": true,
+          "dependencies": {
+            "async": {
+              "version": "2.5.0",
+              "bundled": true
+            },
+            "loader-utils": {
+              "version": "1.1.0",
+              "bundled": true
+            },
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
+        },
+        "webpack-sources": {
+          "version": "1.0.1",
+          "bundled": true,
+          "dependencies": {
+            "source-map": {
+              "version": "0.5.6",
+              "bundled": true
+            }
+          }
+        },
+        "which-module": {
+          "version": "2.0.0",
+          "bundled": true
+        },
+        "yargs": {
+          "version": "8.0.2",
+          "bundled": true
+        },
+        "yargs-parser": {
+          "version": "7.0.0",
           "bundled": true
         }
       }
     },
-    "@rush-temp/office-ui-fabric-react-tslint": {
-      "version": "file:projects/office-ui-fabric-react-tslint"
-    },
-    "@rush-temp/ssr-tests": {
-      "version": "file:projects/ssr-tests"
-    },
-    "@rush-temp/styling": {
-      "version": "file:projects/styling"
-    },
-    "@rush-temp/test-bundle-button": {
-      "version": "file:projects/test-bundle-button"
-    },
     "@rush-temp/todo-app": {
       "version": "file:projects/todo-app"
     },
@@ -95,13 +2271,59 @@
           "version": "21.1.0",
           "bundled": true
         },
+        "async": {
+          "version": "0.9.2",
+          "bundled": true
+        },
+        "commander": {
+          "version": "2.9.0",
+          "bundled": true
+        },
+        "debug": {
+          "version": "2.6.8",
+          "bundled": true,
+          "dependencies": {
+            "ms": {
+              "version": "2.0.0",
+              "bundled": true
+            }
+          }
+        },
+        "diff": {
+          "version": "3.2.0",
+          "bundled": true
+        },
+        "glob": {
+          "version": "7.1.1",
+          "bundled": true
+        },
         "lolex": {
           "version": "1.6.0",
           "bundled": true
         },
+        "mocha": {
+          "version": "3.5.0",
+          "bundled": true
+        },
+        "ms": {
+          "version": "0.7.2",
+          "bundled": true
+        },
         "sinon": {
           "version": "2.4.1",
           "bundled": true
+        },
+        "source-map": {
+          "version": "0.1.43",
+          "bundled": true
+        },
+        "source-map-loader": {
+          "version": "0.2.1",
+          "bundled": true
+        },
+        "supports-color": {
+          "version": "3.1.2",
+          "bundled": true
         }
       }
     },
@@ -118,8 +2340,7 @@
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+              "bundled": true
             }
           }
         },
@@ -132,7 +2353,7 @@
           "bundled": true
         },
         "postcss": {
-          "version": "5.2.18",
+          "version": "5.2.17",
           "bundled": true
         },
         "postcss-loader": {
@@ -300,19 +2521,26 @@
       "integrity": "sha1-MEQ4FkfhHulzxa8uklMjkw9pHYA="
     },
     "@uifabric/icons": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.0.1.tgz",
-      "integrity": "sha512-oND+ez0D1jmOK8svzMFGtwkRMR0n3IdFcAb4RAflR7A0n+t6U0R+s3YOnoNuT8jAkmyBEgkqEj9rScE+p7749Q=="
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.1.0.tgz",
+      "integrity": "sha512-Z2lE7ppbmINoYjgGNvhnYG88EtvJEpQ8JPg++4S/u7KCXCMZVpC3H09JMcFljYlIe+NlJsaAPXJ5wNWddrO5hw=="
     },
     "@uifabric/merge-styles": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.2.0.tgz",
-      "integrity": "sha512-5UNjp2VcxrNHR5JpY5xy6gEQMB5ZanVJUX3fTVsdz3vOKnh6u/LL1FhDAP7dHFSrCRwohT5jPHzbMCXcs3UJlA=="
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.3.0.tgz",
+      "integrity": "sha512-MlwzpHJ7sL7LwQTLAFooisAAwRNOxHvJQsokoAGlD8VlO3HhVrRxZGCrNfdsUdMU/9bOfiHPKjm680CyMKubbA=="
     },
     "@uifabric/styling": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.1.0.tgz",
-      "integrity": "sha512-M4dUt0RoRvnqVFIplxcNZ9xCoOyXdOvnEt4lEOnpzipw0/gFvILYqcc34WmVX8KVL6FB8CJW2hKj8EUciwlDBQ=="
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.1.1.tgz",
+      "integrity": "sha512-+fHaKc8S2rHGnf/qJgKItxKkv+7jREKQ+nDoBlwLaE8nXKtWZUcgESUrlmwgvMNEpN1a3YFoZxM28Z0Nkd20ZQ==",
+      "dependencies": {
+        "@uifabric/utilities": {
+          "version": "6.0.0",
+          "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-6.0.0.tgz",
+          "integrity": "sha512-F3P+eBgqC+KmMiF3H6rBg/Vnyxavx1hgkjUIdSln/vfSD+MT1KjTeQys7y0774+N1HXlVEi7F2O381m2JDRrgw=="
+        }
+      }
     },
     "@uifabric/utilities": {
       "version": "5.0.1",
@@ -626,7 +2854,14 @@
     "autoprefixer": {
       "version": "7.1.4",
       "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-7.1.4.tgz",
-      "integrity": "sha512-MB1XybOJqu1uAwpfSilAa1wSURNc4W310CFKvMj1fNaJBFxr1PGgz72vZaPr9ryKGqs2vYZ6jDyJ0aiGELjsoA=="
+      "integrity": "sha512-MB1XybOJqu1uAwpfSilAa1wSURNc4W310CFKvMj1fNaJBFxr1PGgz72vZaPr9ryKGqs2vYZ6jDyJ0aiGELjsoA==",
+      "dependencies": {
+        "browserslist": {
+          "version": "2.4.0",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.4.0.tgz",
+          "integrity": "sha512-aM2Gt4x9bVlCUteADBS6JP0F+2tMWKM1jQzUulVROtdFWFIcIVvY76AJbr7GDqy0eDhn+PcnpzzivGxY4qiaKQ=="
+        }
+      }
     },
     "awesome-typescript-loader": {
       "version": "3.2.3",
@@ -1241,6 +3476,11 @@
       "resolved": "https://registry.npmjs.org/babel-preset-env/-/babel-preset-env-1.6.0.tgz",
       "integrity": "sha512-OVgtQRuOZKckrILgMA5rvctvFZPv72Gua9Rt006AiPoB0DJKGN07UmaQA+qRrYgK71MVct8fFhT0EyNWYorVew==",
       "dependencies": {
+        "browserslist": {
+          "version": "2.4.0",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.4.0.tgz",
+          "integrity": "sha512-aM2Gt4x9bVlCUteADBS6JP0F+2tMWKM1jQzUulVROtdFWFIcIVvY76AJbr7GDqy0eDhn+PcnpzzivGxY4qiaKQ=="
+        },
         "semver": {
           "version": "5.4.1",
           "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
@@ -1283,6 +3523,11 @@
           "resolved": "https://registry.npmjs.org/babel-preset-env/-/babel-preset-env-1.5.2.tgz",
           "integrity": "sha1-zUrpCm6Utwn5c3SzPl+LmDVWre8="
         },
+        "browserslist": {
+          "version": "2.4.0",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.4.0.tgz",
+          "integrity": "sha512-aM2Gt4x9bVlCUteADBS6JP0F+2tMWKM1jQzUulVROtdFWFIcIVvY76AJbr7GDqy0eDhn+PcnpzzivGxY4qiaKQ=="
+        },
         "regenerator-transform": {
           "version": "0.9.11",
           "resolved": "https://registry.npmjs.org/regenerator-transform/-/regenerator-transform-0.9.11.tgz",
@@ -1508,9 +3753,9 @@
       "integrity": "sha1-uzX4pRn2AOD6a4SFJByXnQFB+y0="
     },
     "browserslist": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.4.0.tgz",
-      "integrity": "sha512-aM2Gt4x9bVlCUteADBS6JP0F+2tMWKM1jQzUulVROtdFWFIcIVvY76AJbr7GDqy0eDhn+PcnpzzivGxY4qiaKQ=="
+      "version": "1.7.7",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
+      "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk="
     },
     "bser": {
       "version": "2.0.0",
@@ -1594,24 +3839,17 @@
     "caniuse-api": {
       "version": "1.6.1",
       "resolved": "https://registry.npmjs.org/caniuse-api/-/caniuse-api-1.6.1.tgz",
-      "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw=",
-      "dependencies": {
-        "browserslist": {
-          "version": "1.7.7",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
-          "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk="
-        }
-      }
+      "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000743",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000743.tgz",
-      "integrity": "sha1-vI3yolfPkboCQyImYpWvPe2FIwY="
+      "version": "1.0.30000744",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000744.tgz",
+      "integrity": "sha1-AHWP991fcTjTShVgjcz3Glllb/4="
     },
     "caniuse-lite": {
-      "version": "1.0.30000743",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000743.tgz",
-      "integrity": "sha1-9PXGdQZ2/49hROpARWw3KdU0F2k="
+      "version": "1.0.30000744",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000744.tgz",
+      "integrity": "sha1-hg+lyDujT+YZOX1gfzC7R0ghZxs="
     },
     "cardinal": {
       "version": "1.0.0",
@@ -2169,11 +4407,6 @@
           "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.7.7.tgz",
           "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ="
         },
-        "browserslist": {
-          "version": "1.7.7",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
-          "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk="
-        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -2712,10 +4945,30 @@
       "resolved": "https://registry.npmjs.org/express/-/express-4.16.1.tgz",
       "integrity": "sha512-STB7LZ4N0L+81FJHGla2oboUHTk4PaN1RsOkoRh9OSeEKylvF5hwKYVX1xCLFaCT7MD0BNG/gX2WFMLqY6EMBw==",
       "dependencies": {
+        "finalhandler": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.0.tgz",
+          "integrity": "sha1-zgtoVbRYU+eRsvzGgARtiCU91/U="
+        },
+        "ipaddr.js": {
+          "version": "1.5.2",
+          "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.5.2.tgz",
+          "integrity": "sha1-1LUFvemUaYfM8PxY2QEP+WB+P6A="
+        },
         "path-to-regexp": {
           "version": "0.1.7",
           "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
           "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
+        },
+        "proxy-addr": {
+          "version": "2.0.2",
+          "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.2.tgz",
+          "integrity": "sha1-ZXFQT0e7mI7IGAJT+F3X4UlSvew="
+        },
+        "setprototypeof": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.0.tgz",
+          "integrity": "sha512-BvE/TwpZX4FXExxOxZyRGQQv651MSwmWKZGqvmPcRIjDqWub67kTKuIMx43cZZrS/cBBzwBcNDWoFxt2XEFIpQ=="
         }
       }
     },
@@ -2812,9 +5065,9 @@
       "integrity": "sha1-1USBHUKPmOsGpj3EAtJAPDKMOPc="
     },
     "finalhandler": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.0.tgz",
-      "integrity": "sha1-zgtoVbRYU+eRsvzGgARtiCU91/U="
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.6.tgz",
+      "integrity": "sha1-AHrqM9Gk0+QgF/YkhIrVjSEvgU8="
     },
     "find-cache-dir": {
       "version": "1.0.0",
@@ -3248,14 +5501,7 @@
     "http-errors": {
       "version": "1.6.2",
       "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.2.tgz",
-      "integrity": "sha1-CgAsyFcHGSp+eUbO7cERVfYOxzY=",
-      "dependencies": {
-        "setprototypeof": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.0.3.tgz",
-          "integrity": "sha1-ZlZ+NwQ+608E2RvWWMDL77VbjgQ="
-        }
-      }
+      "integrity": "sha1-CgAsyFcHGSp+eUbO7cERVfYOxzY="
     },
     "http-parser-js": {
       "version": "0.4.9",
@@ -3454,9 +5700,9 @@
       "integrity": "sha1-vd7XARQpCCjAoDnnLvJfWq7ENUo="
     },
     "ipaddr.js": {
-      "version": "1.5.2",
-      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.5.2.tgz",
-      "integrity": "sha1-1LUFvemUaYfM8PxY2QEP+WB+P6A="
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.4.0.tgz",
+      "integrity": "sha1-KWrKh4qCGBbluF0KKFqZvP9FgvA="
     },
     "is-absolute-url": {
       "version": "2.1.0",
@@ -5933,11 +8179,6 @@
           "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
           "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
         },
-        "browserslist": {
-          "version": "1.7.7",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
-          "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk="
-        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -6647,9 +8888,9 @@
       "integrity": "sha1-zq8IMCL8RrSjX2nhPvda7Q1jmFY="
     },
     "proxy-addr": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.2.tgz",
-      "integrity": "sha1-ZXFQT0e7mI7IGAJT+F3X4UlSvew="
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-1.1.5.tgz",
+      "integrity": "sha1-ccDuOxAt4/IC87ZPYI0XP8uhqRg="
     },
     "prr": {
       "version": "0.0.0",
@@ -7609,9 +9850,9 @@
       "integrity": "sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU="
     },
     "setprototypeof": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.0.tgz",
-      "integrity": "sha512-BvE/TwpZX4FXExxOxZyRGQQv651MSwmWKZGqvmPcRIjDqWub67kTKuIMx43cZZrS/cBBzwBcNDWoFxt2XEFIpQ=="
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.0.3.tgz",
+      "integrity": "sha1-ZlZ+NwQ+608E2RvWWMDL77VbjgQ="
     },
     "sha.js": {
       "version": "2.4.9",
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 3f88c31341e7f..3531c8cbf1ab1 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -39,7 +39,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.1.1 <6.0.0",
-    "@uifabric/utilities": ">=6.0.0 <7.0.0",
+    "@uifabric/utilities": ">=5.0.1 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 03b140090e7a0..10ba22afa5e60 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -46,7 +46,7 @@
     "@uifabric/icons": ">=5.1.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.3.0 <6.0.0",
     "@uifabric/styling": ">=5.1.1 <6.0.0",
-    "@uifabric/utilities": ">=6.0.0 <7.0.0",
+    "@uifabric/utilities": ">=5.0.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 4af683a70ca3f..d611b64cd527e 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=6.0.0 <7.0.0",
+    "@uifabric/utilities": ">=5.0.1 <6.0.0",
     "@uifabric/merge-styles": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 6cfe96fb22394..55dc92af4d2f1 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "6.0.0",
+  "version": "5.0.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 97185f0d509219f2b8e14d5a6f3449aa9ffd41d6 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 5 Oct 2017 16:29:11 +0000
Subject: [PATCH 0788/1641] Applying package updates.

---
 .../utilities/fix-utilities_2017-10-05-15-31.json  | 11 -----------
 packages/example-app-base/package.json             |  2 +-
 packages/office-ui-fabric-react/package.json       |  2 +-
 packages/styling/package.json                      |  2 +-
 packages/utilities/CHANGELOG.json                  | 14 ++++++++++++++
 packages/utilities/CHANGELOG.md                    |  9 ++++++++-
 packages/utilities/package.json                    |  2 +-
 7 files changed, 26 insertions(+), 16 deletions(-)
 delete mode 100644 common/changes/@uifabric/utilities/fix-utilities_2017-10-05-15-31.json

diff --git a/common/changes/@uifabric/utilities/fix-utilities_2017-10-05-15-31.json b/common/changes/@uifabric/utilities/fix-utilities_2017-10-05-15-31.json
deleted file mode 100644
index d4e002327658e..0000000000000
--- a/common/changes/@uifabric/utilities/fix-utilities_2017-10-05-15-31.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Undoing 6.0 bump which was made by automation inadvertently.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 3531c8cbf1ab1..c6b4be9284f22 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -39,7 +39,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.1.1 <6.0.0",
-    "@uifabric/utilities": ">=5.0.1 <6.0.0",
+    "@uifabric/utilities": ">=5.1.0 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 10ba22afa5e60..4055d89fe5758 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -46,7 +46,7 @@
     "@uifabric/icons": ">=5.1.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.3.0 <6.0.0",
     "@uifabric/styling": ">=5.1.1 <6.0.0",
-    "@uifabric/utilities": ">=5.0.1 <6.0.0",
+    "@uifabric/utilities": ">=5.1.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index d611b64cd527e..7bb1f31b69af0 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=5.0.1 <6.0.0",
+    "@uifabric/utilities": ">=5.1.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index e1b175ea49f10..2b02ec6d5428c 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.1.0",
+      "tag": "@uifabric/utilities_v5.1.0",
+      "date": "Thu, 05 Oct 2017 16:29:11 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "b07513cf96f054685766b3ffbf9896b1d10332f9",
+            "comment": "Undoing 6.0 bump which was made by automation inadvertently."
+          }
+        ]
+      }
+    },
     {
       "version": "6.0.0",
       "tag": "@uifabric/utilities_v6.0.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 0b8879fa30b74..6c8ad02aae89e 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Wed, 04 Oct 2017 22:40:22 GMT and should not be manually modified.
+This log was last generated on Thu, 05 Oct 2017 16:29:11 GMT and should not be manually modified.
+
+## 5.1.0
+Thu, 05 Oct 2017 16:29:11 GMT
+
+### Minor changes
+
+- Undoing 6.0 bump which was made by automation inadvertently.
 
 ## 6.0.0
 Wed, 04 Oct 2017 22:40:22 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 55dc92af4d2f1..d0da8a9ac29ac 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.0.1",
+  "version": "5.1.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 41cef49e56908d5a9a794617aad64e626ab5b315 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 5 Oct 2017 09:35:15 -0700
Subject: [PATCH 0789/1641] Adding change files to republish asap. (#3040)

* Undo 6.0 bump of utilities.

* change file

* Fixing shrinkwrap.

* Updates.
---
 .../fix-utilities_2017-10-05-16-33.json               | 11 +++++++++++
 .../styling/fix-utilities_2017-10-05-16-33.json       | 11 +++++++++++
 .../utilities/fix-utilities_2017-10-05-15-31.json     | 11 +++++++++++
 .../utilities/fix-utilities_2017-10-05-16-33.json     | 11 +++++++++++
 .../fix-utilities_2017-10-05-16-33.json               | 11 +++++++++++
 5 files changed, 55 insertions(+)
 create mode 100644 common/changes/@uifabric/example-app-base/fix-utilities_2017-10-05-16-33.json
 create mode 100644 common/changes/@uifabric/styling/fix-utilities_2017-10-05-16-33.json
 create mode 100644 common/changes/@uifabric/utilities/fix-utilities_2017-10-05-15-31.json
 create mode 100644 common/changes/@uifabric/utilities/fix-utilities_2017-10-05-16-33.json
 create mode 100644 common/changes/office-ui-fabric-react/fix-utilities_2017-10-05-16-33.json

diff --git a/common/changes/@uifabric/example-app-base/fix-utilities_2017-10-05-16-33.json b/common/changes/@uifabric/example-app-base/fix-utilities_2017-10-05-16-33.json
new file mode 100644
index 0000000000000..e823f6aaedcd5
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/fix-utilities_2017-10-05-16-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Fixing version dependencies.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/fix-utilities_2017-10-05-16-33.json b/common/changes/@uifabric/styling/fix-utilities_2017-10-05-16-33.json
new file mode 100644
index 0000000000000..0be93b8f0e9a3
--- /dev/null
+++ b/common/changes/@uifabric/styling/fix-utilities_2017-10-05-16-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Fixing version dependencies.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/fix-utilities_2017-10-05-15-31.json b/common/changes/@uifabric/utilities/fix-utilities_2017-10-05-15-31.json
new file mode 100644
index 0000000000000..d4e002327658e
--- /dev/null
+++ b/common/changes/@uifabric/utilities/fix-utilities_2017-10-05-15-31.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Undoing 6.0 bump which was made by automation inadvertently.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/fix-utilities_2017-10-05-16-33.json b/common/changes/@uifabric/utilities/fix-utilities_2017-10-05-16-33.json
new file mode 100644
index 0000000000000..c24ae32a99ce5
--- /dev/null
+++ b/common/changes/@uifabric/utilities/fix-utilities_2017-10-05-16-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Fixing version dependencies.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-utilities_2017-10-05-16-33.json b/common/changes/office-ui-fabric-react/fix-utilities_2017-10-05-16-33.json
new file mode 100644
index 0000000000000..9813993748dd7
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-utilities_2017-10-05-16-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixing version dependencies.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file

From a033ee9b7a264e818fd1599094faaf9703a0e71a Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 5 Oct 2017 09:40:41 -0700
Subject: [PATCH 0790/1641] Reverting fabric major bump.

---
 packages/office-ui-fabric-react/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 4055d89fe5758..4e2ab78d1b83a 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "6.0.1",
+  "version": "5.3.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 3e9f6ecf9f6dbb6ae7d479136959d69725fba215 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 5 Oct 2017 09:53:14 -0700
Subject: [PATCH 0791/1641] Preparing packages for republishing.

---
 apps/fabric-website/package.json       |  2 +-
 apps/ssr-tests/package.json            |  2 +-
 apps/test-bundle-button/package.json   |  2 +-
 apps/todo-app/package.json             |  2 +-
 apps/vr-tests/package.json             |  2 +-
 common/config/rush/npm-shrinkwrap.json | 32 ++++++++++++--------------
 packages/experiments/package.json      |  2 +-
 7 files changed, 21 insertions(+), 23 deletions(-)

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index b95a94d7aa06b..6cd49700edbad 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.1.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=6.0.1 <7.0.0",
+    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index cc8be515e6e53..e1d6f27545f2e 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=6.0.1 <7.0.0",
+    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 36d6bc7e19001..d26232d9054e4 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=6.0.0 <7.0.0",
+    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 3f174f7c473e0..884243acc8cff 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=6.0.0 <7.0.0",
+    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index e5c238221c6c9..975152c99d262 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=6.0.0 <7.0.0",
+    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 39072b628e94d..78265b6fe7feb 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -2533,19 +2533,12 @@
     "@uifabric/styling": {
       "version": "5.1.1",
       "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.1.1.tgz",
-      "integrity": "sha512-+fHaKc8S2rHGnf/qJgKItxKkv+7jREKQ+nDoBlwLaE8nXKtWZUcgESUrlmwgvMNEpN1a3YFoZxM28Z0Nkd20ZQ==",
-      "dependencies": {
-        "@uifabric/utilities": {
-          "version": "6.0.0",
-          "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-6.0.0.tgz",
-          "integrity": "sha512-F3P+eBgqC+KmMiF3H6rBg/Vnyxavx1hgkjUIdSln/vfSD+MT1KjTeQys7y0774+N1HXlVEi7F2O381m2JDRrgw=="
-        }
-      }
+      "integrity": "sha512-+fHaKc8S2rHGnf/qJgKItxKkv+7jREKQ+nDoBlwLaE8nXKtWZUcgESUrlmwgvMNEpN1a3YFoZxM28Z0Nkd20ZQ=="
     },
     "@uifabric/utilities": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.0.1.tgz",
-      "integrity": "sha512-HUhh3EKUiZshpbNxcgkwQ6WcTKT3+rlhfX/pSeLElRTGbORYxdoWFDwVfFZT71xP2hFnUQI/Z5qb9BLdKeJpRA=="
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.1.0.tgz",
+      "integrity": "sha512-qvOWJUgsTlH3h6b5dofKsnnnVJHsuX19jz8umJZdr0E4pYKgDC14WD8jfwP4bjF9MS2raZww1AImGWNd+gCI8A=="
     },
     "abab": {
       "version": "1.0.4",
@@ -10472,9 +10465,9 @@
       "integrity": "sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM="
     },
     "ts-jest": {
-      "version": "21.0.1",
-      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-21.0.1.tgz",
-      "integrity": "sha512-MIX8uMMr7FSRT56GASXUxeorEs3x2iO+JwkVzUHwxjzld4+UtPMZ9EEUpX7JU7eFKDkXaD1aAIVnuNrg15Xnuw==",
+      "version": "21.1.0",
+      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-21.1.0.tgz",
+      "integrity": "sha512-P4NGaX8Hqy0vAdXd2K1y1PEgAbTHqJtUdwAeBaHAUbZpKQmfqKSRgNEHsyf9hdxsqtkUyj/Msep0BatNxhZQug==",
       "dependencies": {
         "camelcase": {
           "version": "4.1.0",
@@ -10518,15 +10511,20 @@
           "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-2.0.0.tgz",
           "integrity": "sha1-a3KoBImE4MQeeVEP1en6mbO1Sb4="
         },
+        "source-map-support": {
+          "version": "0.5.0",
+          "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.0.tgz",
+          "integrity": "sha512-vUoN3I7fHQe0R/SJLKRdKYuEdRGogsviXFkHHo17AWaTGv17VLnxw+CFXvqy+y4ORZ3doWLQcxRYfwKrsd/H7Q=="
+        },
         "strip-bom": {
           "version": "3.0.0",
           "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
           "integrity": "sha1-IzTBjpx1n3vdVv3vfprj1YjmjtM="
         },
         "yargs": {
-          "version": "8.0.2",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-8.0.2.tgz",
-          "integrity": "sha1-YpmpBVsc78lp/355wdkY3Osiw2A="
+          "version": "9.0.1",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-9.0.1.tgz",
+          "integrity": "sha1-UqzCP+7Kw0BCB47njAwAf1CF20w="
         }
       }
     },
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index d913cbd233403..7229cd7a9f143 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -42,7 +42,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=6.0.1 <7.0.0",
+    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
     "@uifabric/icons": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
   },

From 9248674649667b5dcb897046e7ebfe6f49d15625 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 5 Oct 2017 17:03:43 +0000
Subject: [PATCH 0792/1641] Applying package updates.

---
 .../fix-utilities_2017-10-05-16-33.json       | 11 --------
 .../fix-utilities_2017-10-05-16-33.json       | 11 --------
 .../fix-utilities_2017-10-05-15-31.json       | 11 --------
 .../fix-utilities_2017-10-05-16-33.json       | 11 --------
 .../fix-utilities_2017-10-05-16-33.json       | 11 --------
 packages/example-app-base/CHANGELOG.json      | 22 ++++++++++++++++
 packages/example-app-base/CHANGELOG.md        |  9 ++++++-
 packages/example-app-base/package.json        |  6 ++---
 packages/experiments/package.json             |  4 +--
 packages/icons/package.json                   |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 25 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++-
 packages/office-ui-fabric-react/package.json  |  8 +++---
 packages/styling/CHANGELOG.json               | 19 ++++++++++++++
 packages/styling/CHANGELOG.md                 |  9 ++++++-
 packages/styling/package.json                 |  4 +--
 packages/utilities/CHANGELOG.json             | 19 ++++++++++++++
 packages/utilities/CHANGELOG.md               | 10 +++++++-
 packages/utilities/package.json               |  2 +-
 19 files changed, 131 insertions(+), 72 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/fix-utilities_2017-10-05-16-33.json
 delete mode 100644 common/changes/@uifabric/styling/fix-utilities_2017-10-05-16-33.json
 delete mode 100644 common/changes/@uifabric/utilities/fix-utilities_2017-10-05-15-31.json
 delete mode 100644 common/changes/@uifabric/utilities/fix-utilities_2017-10-05-16-33.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-utilities_2017-10-05-16-33.json

diff --git a/common/changes/@uifabric/example-app-base/fix-utilities_2017-10-05-16-33.json b/common/changes/@uifabric/example-app-base/fix-utilities_2017-10-05-16-33.json
deleted file mode 100644
index e823f6aaedcd5..0000000000000
--- a/common/changes/@uifabric/example-app-base/fix-utilities_2017-10-05-16-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Fixing version dependencies.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/fix-utilities_2017-10-05-16-33.json b/common/changes/@uifabric/styling/fix-utilities_2017-10-05-16-33.json
deleted file mode 100644
index 0be93b8f0e9a3..0000000000000
--- a/common/changes/@uifabric/styling/fix-utilities_2017-10-05-16-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Fixing version dependencies.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/fix-utilities_2017-10-05-15-31.json b/common/changes/@uifabric/utilities/fix-utilities_2017-10-05-15-31.json
deleted file mode 100644
index d4e002327658e..0000000000000
--- a/common/changes/@uifabric/utilities/fix-utilities_2017-10-05-15-31.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Undoing 6.0 bump which was made by automation inadvertently.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/fix-utilities_2017-10-05-16-33.json b/common/changes/@uifabric/utilities/fix-utilities_2017-10-05-16-33.json
deleted file mode 100644
index c24ae32a99ce5..0000000000000
--- a/common/changes/@uifabric/utilities/fix-utilities_2017-10-05-16-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Fixing version dependencies.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-utilities_2017-10-05-16-33.json b/common/changes/office-ui-fabric-react/fix-utilities_2017-10-05-16-33.json
deleted file mode 100644
index 9813993748dd7..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-utilities_2017-10-05-16-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixing version dependencies.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index b2c09569323d4..f652f6ac336b2 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "5.1.0",
+      "tag": "@uifabric/example-app-base_v5.1.0",
+      "date": "Thu, 05 Oct 2017 17:03:43 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "41cef49e56908d5a9a794617aad64e626ab5b315",
+            "comment": "Fixing version dependencies."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.1.1 <6.0.0` to `>=5.2.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.1.0 <6.0.0` to `>=5.2.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.5",
       "tag": "@uifabric/example-app-base_v5.0.5",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index 0aeaa0825abe8..b76c752f46f68 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Thu, 05 Oct 2017 10:17:42 GMT and should not be manually modified.
+This log was last generated on Thu, 05 Oct 2017 17:03:43 GMT and should not be manually modified.
+
+## 5.1.0
+Thu, 05 Oct 2017 17:03:43 GMT
+
+### Minor changes
+
+- Fixing version dependencies.
 
 ## 5.0.5
 Thu, 05 Oct 2017 10:17:42 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index c6b4be9284f22..be715d5dc1047 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "5.0.5",
+  "version": "5.1.0",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -38,8 +38,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.1.1 <6.0.0",
-    "@uifabric/utilities": ">=5.1.0 <6.0.0",
+    "@uifabric/styling": ">=5.2.0 <6.0.0",
+    "@uifabric/utilities": ">=5.2.0 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 7229cd7a9f143..e6a79ea13567d 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -28,7 +28,7 @@
     "@types/jest": "^21.1.0",
     "@types/enzyme": "^2.8.8",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=5.0.5 <6.0.0",
+    "@uifabric/example-app-base": ">=5.1.0 <6.0.0",
     "@uifabric/icons": ">=5.1.0 <6.0.0",
     "es6-weak-map": "^2.0.2",
     "enzyme": "^2.9.1",
@@ -42,7 +42,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.4.0 <6.0.0",
     "@uifabric/icons": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/icons/package.json b/packages/icons/package.json
index ffb59f274d7f3..8b63f72cbbbb3 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -23,7 +23,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.1.1 <6.0.0",
+    "@uifabric/styling": ">=5.2.0 <6.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 1b5ef6cf42d8b..c96cdf6eed358 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,31 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.4.0",
+      "tag": "office-ui-fabric-react_v5.4.0",
+      "date": "Thu, 05 Oct 2017 17:03:43 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "41cef49e56908d5a9a794617aad64e626ab5b315",
+            "comment": "Fixing version dependencies."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.1.1 <6.0.0` to `>=5.2.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.1.0 <6.0.0` to `>=5.2.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=5.0.5 <6.0.0` to `>=5.1.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "6.0.1",
       "tag": "office-ui-fabric-react_v6.0.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 1a3a5dd4cff1c..bfc1817834721 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 05 Oct 2017 10:17:42 GMT and should not be manually modified.
+This log was last generated on Thu, 05 Oct 2017 17:03:43 GMT and should not be manually modified.
+
+## 5.4.0
+Thu, 05 Oct 2017 17:03:43 GMT
+
+### Minor changes
+
+- Fixing version dependencies.
 
 ## 6.0.1
 Thu, 05 Oct 2017 10:17:42 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 4e2ab78d1b83a..730633f97b1d2 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.3.0",
+  "version": "5.4.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -26,7 +26,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=5.0.5 <6.0.0",
+    "@uifabric/example-app-base": ">=5.1.0 <6.0.0",
     "enzyme": "^2.9.1",
     "es6-promise": "^4.1.0",
     "es6-map": "^0.1.5",
@@ -45,8 +45,8 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.1.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.3.0 <6.0.0",
-    "@uifabric/styling": ">=5.1.1 <6.0.0",
-    "@uifabric/utilities": ">=5.1.0 <6.0.0",
+    "@uifabric/styling": ">=5.2.0 <6.0.0",
+    "@uifabric/utilities": ">=5.2.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 0fc00deac9bef..77a8b6d090d8c 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.2.0",
+      "tag": "@uifabric/styling_v5.2.0",
+      "date": "Thu, 05 Oct 2017 17:03:43 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "41cef49e56908d5a9a794617aad64e626ab5b315",
+            "comment": "Fixing version dependencies."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.1.0 <6.0.0` to `>=5.2.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.1.1",
       "tag": "@uifabric/styling_v5.1.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 10d0e4508f2cb..0366f25369041 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Wed, 04 Oct 2017 22:40:22 GMT and should not be manually modified.
+This log was last generated on Thu, 05 Oct 2017 17:03:43 GMT and should not be manually modified.
+
+## 5.2.0
+Thu, 05 Oct 2017 17:03:43 GMT
+
+### Minor changes
+
+- Fixing version dependencies.
 
 ## 5.1.1
 Wed, 04 Oct 2017 22:40:22 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 7bb1f31b69af0..916006867192f 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.1.1",
+  "version": "5.2.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=5.1.0 <6.0.0",
+    "@uifabric/utilities": ">=5.2.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 2b02ec6d5428c..0c378f947bed0 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.2.0",
+      "tag": "@uifabric/utilities_v5.2.0",
+      "date": "Thu, 05 Oct 2017 17:03:43 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "41cef49e56908d5a9a794617aad64e626ab5b315",
+            "comment": "Undoing 6.0 bump which was made by automation inadvertently."
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "41cef49e56908d5a9a794617aad64e626ab5b315",
+            "comment": "Fixing version dependencies."
+          }
+        ]
+      }
+    },
     {
       "version": "5.1.0",
       "tag": "@uifabric/utilities_v5.1.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 6c8ad02aae89e..4eef602e539bb 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Thu, 05 Oct 2017 16:29:11 GMT and should not be manually modified.
+This log was last generated on Thu, 05 Oct 2017 17:03:43 GMT and should not be manually modified.
+
+## 5.2.0
+Thu, 05 Oct 2017 17:03:43 GMT
+
+### Minor changes
+
+- Undoing 6.0 bump which was made by automation inadvertently.
+- Fixing version dependencies.
 
 ## 5.1.0
 Thu, 05 Oct 2017 16:29:11 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index d0da8a9ac29ac..49303cae71e26 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.1.0",
+  "version": "5.2.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 25b9997aad2db7ca530283fb1bfb0b72e96955f7 Mon Sep 17 00:00:00 2001
From: Max Vaysburd <max@angrykitten.com>
Date: Thu, 5 Oct 2017 11:09:15 -0700
Subject: [PATCH 0793/1641] =?UTF-8?q?Style=20menuIcon=20according=20to=20r?=
 =?UTF-8?q?oot=20styles=20for=20the=20following=20states=20hove=E2=80=A6?=
 =?UTF-8?q?=20(#3028)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Style menuIcon according to root styles for the following states hovered, pressed, expanded and expandedHovered.

* ChangeLog

* Add dedicated styles to IButtonProps for menuIcon customization.

* Consume menuIcon styles on root element.

* Minor change instead of patch
---
 .../button_menuIcon_2017-10-04-20-33.json     | 11 +++++++++
 .../Button/BaseButton.classNames.ts           | 24 +++++++++++++++++--
 .../src/components/Button/Button.Props.ts     | 20 ++++++++++++++++
 3 files changed, 53 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/button_menuIcon_2017-10-04-20-33.json

diff --git a/common/changes/office-ui-fabric-react/button_menuIcon_2017-10-04-20-33.json b/common/changes/office-ui-fabric-react/button_menuIcon_2017-10-04-20-33.json
new file mode 100644
index 0000000000000..72235f1ddd023
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/button_menuIcon_2017-10-04-20-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Style ms-Button-menuIcon according to root styles for the following states - hovered, pressed, expanded  ande expandedHovered.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "maxvay@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
index ac32ad71e7625..dd7d76cbdddf6 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
@@ -39,6 +39,7 @@ export const getClassNames = memoizeFunction((
         {
           selectors: {
             ':hover .ms-Button-icon': styles.iconExpandedHovered,
+            ':hover .ms-Button-menuIcon': styles.rootExpandedHovered,
             ':hover': styles.rootExpandedHovered
           }
         }
@@ -52,10 +53,12 @@ export const getClassNames = memoizeFunction((
           ':hover': styles.rootHovered,
           ':hover .ms-Button-icon': styles.iconHovered,
           ':hover .ms-Button-description': styles.descriptionHovered,
+          ':hover .ms-Button-menuIcon': styles.menuIconHovered,
           ':focus': styles.rootFocused,
           ':active': styles.rootPressed,
           ':active .ms-Button-icon': styles.iconPressed,
-          ':active .ms-Button-description': styles.descriptionPressed
+          ':active .ms-Button-description': styles.descriptionPressed,
+          ':active .ms-Button-menuIcon': styles.menuIconPressed
         }
       },
       disabled && checked && [
@@ -100,7 +103,24 @@ export const getClassNames = memoizeFunction((
       menuIconClassName,
       styles.menuIcon,
       checked && styles.menuIconChecked,
-      disabled && styles.menuIconDisabled
+      disabled && styles.menuIconDisabled,
+      !disabled &&
+      !expanded &&
+      !checked && {
+        selectors: {
+          ':hover': styles.menuIconHovered,
+          ':active': styles.menuIconPressed,
+        },
+      },
+      expanded && [
+        'is-expanded',
+        styles.menuIconExpanded,
+        {
+          selectors: {
+            ':hover': styles.menuIconExpandedHovered,
+          },
+        },
+      ]
     ),
 
     description: mergeStyles(
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
index 3c2f110ff0e9e..abf8a88c5d5fa 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
@@ -315,6 +315,26 @@ export interface IButtonStyles {
    */
   menuIcon?: IStyle;
 
+  /**
+   * Style for the menu chevron on hover.
+   */
+  menuIconHovered?: IStyle;
+
+  /**
+   * Style for the menu chevron when pressed.
+   */
+  menuIconPressed?: IStyle;
+
+  /**
+   * Style for the menu chevron when expanded.
+   */
+  menuIconExpanded?: IStyle;
+
+  /**
+ * Style for the menu chevron when expanded and hovered.
+ */
+  menuIconExpandedHovered?: IStyle;
+
   /**
    * Style override for the menu chevron when the button is disabled.
    */

From 6373316a067e101fb196e3fc4364d45d08f7e62e Mon Sep 17 00:00:00 2001
From: Michael Loughry <miclo@microsoft.com>
Date: Thu, 5 Oct 2017 14:56:31 -0700
Subject: [PATCH 0794/1641] Dropdown: Fix controlled multi-select dropdowns
 (#3030)

* Fix exception being thrown in Dropdown example

* Fix broken controlled multi-select dropdowns

* Fix failing test

* Reduce code duplication and move to a single 'selectedIndices' state prop

* Stable point in adding new tests

* Add more tests, and fix props modification

* Update Testing.md. Will update with debugging instructions once David resolves the issues
---
 ...ultiselect-dropdowns_2017-10-04-21-27.json |  11 +
 ghdocs/TESTING.md                             |  10 +-
 .../src/components/Dropdown/Dropdown.test.tsx | 693 ++++++++++++++----
 .../src/components/Dropdown/Dropdown.tsx      | 182 ++---
 .../examples/Dropdown.Basic.Example.tsx       |  21 +-
 5 files changed, 663 insertions(+), 254 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/2971-fix-controlled-multiselect-dropdowns_2017-10-04-21-27.json

diff --git a/common/changes/office-ui-fabric-react/2971-fix-controlled-multiselect-dropdowns_2017-10-04-21-27.json b/common/changes/office-ui-fabric-react/2971-fix-controlled-multiselect-dropdowns_2017-10-04-21-27.json
new file mode 100644
index 0000000000000..7dec09aca29a9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/2971-fix-controlled-multiselect-dropdowns_2017-10-04-21-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: fix broken implementation of controlled multi-select dropdowns",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/ghdocs/TESTING.md b/ghdocs/TESTING.md
index 1a8dcbebb8005..88a1e6ab9265e 100644
--- a/ghdocs/TESTING.md
+++ b/ghdocs/TESTING.md
@@ -8,12 +8,10 @@ Our tests are built with [Mocha](https://mochajs.org/), [Chai](http://chaijs.com
 To run tests:
 
 1. In command prompt navigate to the appropriate package, for example git/office-ui-fabric-react/packages/office-ui-fabric-react
-2. Run `gulp test` to run all of the tests
-  * To run only one test add `--match <Testname>`. Example: `gulp test --match Button`
-  * To debug your test add `--debug`. Example: `gulp test --debug`.
-    1. After running this, you will need to open the localhost url found in your command prompt.
-    2. A page will open with a "Debug" button. Pressing that will open a page that loads the tests.
-    3. Press f12 in the new page. Tests will be in a tests.js bundle, and you'll need to find your code in there.
+2. Run `npm run start-test` to start jest and run the tests
+  * By default, jest will run tests affected by your uncommitted changes
+  * To run all tests, press 'a' at the prompt
+  * To filter the tests run, press `p` or `t` to filter by filename or test name regex pattern, respectively
 
 ## Examples
 
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
index e8ce9da0a1d31..6f89adb8659ea 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
@@ -24,101 +24,83 @@ const DEFAULT_OPTIONS: IDropdownOption[] = [
 
 describe('Dropdown', () => {
 
-  it('Can flip between enabled and disabled.', () => {
-
-    let container = document.createElement('div');
-    ReactDOM.render(
-      <Dropdown
-        label='testgroup'
-        options={ DEFAULT_OPTIONS }
-      />,
-      container);
-    let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-
-    expect(dropdownRoot.className).not.toEqual(expect.stringMatching('is-disabled'));
-    expect(dropdownRoot.getAttribute('data-is-focusable')).toEqual('true');
-
-    ReactDOM.render(
-      <Dropdown
-        disabled={ true }
-        label='testgroup'
-        options={ DEFAULT_OPTIONS }
-      />,
-      container);
-
-    expect(dropdownRoot.className).toEqual(expect.stringMatching('is-disabled'));
-    expect(dropdownRoot.getAttribute('data-is-focusable')).toEqual('false');
-  });
+  describe('single-select', () => {
 
-  it('Renders no selected item in default case', () => {
-    let container = document.createElement('div');
+    it('Can flip between enabled and disabled.', () => {
 
-    ReactDOM.render(
-      <Dropdown
-        label='testgroup'
-        options={ DEFAULT_OPTIONS }
-      />,
-      container);
-    let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      let container = document.createElement('div');
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          options={ DEFAULT_OPTIONS }
+        />,
+        container);
+      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
 
-    expect(titleElement.textContent).toEqual('');
-  });
+      expect(dropdownRoot.className).not.toEqual(expect.stringMatching('is-disabled'));
+      expect(dropdownRoot.getAttribute('data-is-focusable')).toEqual('true');
 
-  it('Renders a selected item if option specifies selected', () => {
-    let container = document.createElement('div');
+      ReactDOM.render(
+        <Dropdown
+          disabled={ true }
+          label='testgroup'
+          options={ DEFAULT_OPTIONS }
+        />,
+        container);
 
-    ReactDOM.render(
-      <Dropdown
-        label='testgroup'
-        options={ [{ key: '1', text: '1', selected: true }, { key: '2', text: '2' },] }
-      />,
-      container);
-    let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      expect(dropdownRoot.className).toEqual(expect.stringMatching('is-disabled'));
+      expect(dropdownRoot.getAttribute('data-is-focusable')).toEqual('false');
+    });
 
-    expect(titleElement.textContent).toEqual('1');
-  });
+    it('Renders no selected item in default case', () => {
+      let container = document.createElement('div');
+
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          options={ DEFAULT_OPTIONS }
+        />,
+        container);
+      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
-  it('Renders a selected item in uncontrolled case', () => {
-    let container = document.createElement('div');
+      expect(titleElement.textContent).toEqual('');
+    });
 
-    ReactDOM.render(
-      <Dropdown
-        label='testgroup'
-        defaultSelectedKey='1'
-        options={ DEFAULT_OPTIONS }
-      />,
-      container);
-    let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+    it('Renders a selected item if option specifies selected', () => {
+      let container = document.createElement('div');
 
-    expect(titleElement.textContent).toEqual('1');
-  });
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          options={ [{ key: '1', text: '1', selected: true }, { key: '2', text: '2' },] }
+        />,
+        container);
+      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
-  it('Renders a selected item in controlled case', () => {
-    let container = document.createElement('div');
+      expect(titleElement.textContent).toEqual('1');
+    });
 
-    ReactDOM.render(
-      <Dropdown
-        label='testgroup'
-        selectedKey='1'
-        options={ DEFAULT_OPTIONS }
-      />,
-      container);
-    let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+    it('Renders a selected item in uncontrolled case', () => {
+      let container = document.createElement('div');
 
-    expect(titleElement.textContent).toEqual('1');
-  });
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          defaultSelectedKey='1'
+          options={ DEFAULT_OPTIONS }
+        />,
+        container);
+      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
-  it('Can change items in uncontrolled case', () => {
-    let container = document.createElement('div');
-    let dropdownRoot: HTMLElement | undefined;
+      expect(titleElement.textContent).toEqual('1');
+    });
 
-    document.body.appendChild(container);
+    it('does not change the selected item in when defaultKey changes', () => {
+      let container = document.createElement('div');
 
-    try {
       ReactDOM.render(
         <Dropdown
           label='testgroup'
@@ -126,88 +108,501 @@ describe('Dropdown', () => {
           options={ DEFAULT_OPTIONS }
         />,
         container);
+      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+
+      expect(titleElement.textContent).toEqual('1');
+
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          defaultSelectedKey='2'
+          options={ DEFAULT_OPTIONS }
+        />,
+        container);
+      expect(titleElement.textContent).toEqual('1');
+    });
+
+    it('Renders a selected item in controlled case', () => {
+      let container = document.createElement('div');
+
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          selectedKey='1'
+          options={ DEFAULT_OPTIONS }
+        />,
+        container);
+      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+
+      expect(titleElement.textContent).toEqual('1');
+    });
+
+    it('does change the selected item in when selectedKey changes', () => {
+      let container = document.createElement('div');
+
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          selectedKey='1'
+          options={ DEFAULT_OPTIONS }
+        />,
+        container);
+      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+
+      expect(titleElement.textContent).toEqual('1');
+
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          selectedKey='2'
+          options={ DEFAULT_OPTIONS }
+        />,
+        container);
+      expect(titleElement.textContent).toEqual('2');
+    });
+
+    it('Can change items in uncontrolled case', () => {
+      let container = document.createElement('div');
+      let dropdownRoot: HTMLElement | undefined;
+
+      document.body.appendChild(container);
+
+      try {
+        ReactDOM.render(
+          <Dropdown
+            label='testgroup'
+            defaultSelectedKey='1'
+            options={ DEFAULT_OPTIONS }
+          />,
+          container);
+        dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+
+        ReactTestUtils.Simulate.click(dropdownRoot);
+
+        let secondItemElement = document.querySelector('.ms-Dropdown-item[data-index="2"]') as HTMLElement;
+        ReactTestUtils.Simulate.click(secondItemElement);
+      }
+      finally {
+        expect(dropdownRoot!.querySelector('.ms-Dropdown-title')!.textContent).toEqual('2');
+      }
+    });
+
+    it('issues the onChanged callback when the selected item is different', () => {
+      let container = document.createElement('div');
+      let dropdownRoot: HTMLElement | undefined;
+
+      document.body.appendChild(container);
+
+      let onChangedSpy = jasmine.createSpy('onChanged');
+
+      try {
+        ReactDOM.render(
+          <Dropdown
+            label='testgroup'
+            defaultSelectedKey='1'
+            onChanged={ onChangedSpy }
+            options={ DEFAULT_OPTIONS }
+          />,
+          container);
+        dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+
+        ReactTestUtils.Simulate.click(dropdownRoot);
+
+        let secondItemElement = document.querySelector('.ms-Dropdown-item[data-index="2"]') as HTMLElement;
+        ReactTestUtils.Simulate.click(secondItemElement);
+      }
+      finally {
+        expect(onChangedSpy).toHaveBeenCalledWith(DEFAULT_OPTIONS[2], 2);
+      }
+    });
+
+    it('issues the onChanged callback when the selected item is different', () => {
+      let container = document.createElement('div');
+      let dropdownRoot: HTMLElement | undefined;
+
+      document.body.appendChild(container);
+
+      let onChangedSpy = jasmine.createSpy('onChanged');
+
+      try {
+        ReactDOM.render(
+          <Dropdown
+            label='testgroup'
+            defaultSelectedKey='1'
+            onChanged={ onChangedSpy }
+            options={ DEFAULT_OPTIONS }
+          />,
+          container);
+        dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+
+        ReactTestUtils.Simulate.click(dropdownRoot);
+
+        let secondItemElement = document.querySelector('.ms-Dropdown-item[data-index="1"]') as HTMLElement;
+        ReactTestUtils.Simulate.click(secondItemElement);
+      }
+      finally {
+        expect(onChangedSpy).not.toHaveBeenCalled();
+      }
+    });
+
+    it('Will select the first valid item on keypress', () => {
+      let container = document.createElement('div');
+
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          options={ DEFAULT_OPTIONS }
+        />,
+        container);
+      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
+
+      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      expect(titleElement.textContent).toEqual('1');
+    });
+
+    it('Will select the first valid item on Home keypress', () => {
+      let container = document.createElement('div');
+
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          options={ DEFAULT_OPTIONS }
+        />,
+        container);
+      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.home });
+
+      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      expect(titleElement.textContent).toEqual('1');
+    });
+
+    it('Will select the last valid item on End keypress', () => {
+      let container = document.createElement('div');
+
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          options={ DEFAULT_OPTIONS }
+        />,
+        container);
+      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.end });
+
+      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      expect(titleElement.textContent).toEqual('6');
+    });
+
+    it('Will skip over headers and separators on keypress', () => {
+      let container = document.createElement('div');
+      let dropdownRoot;
+      let titleElement;
+
+      document.body.appendChild(container);
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          options={ DEFAULT_OPTIONS }
+        />,
+        container);
       dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
 
-      ReactTestUtils.Simulate.click(dropdownRoot);
+      ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
+      titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      expect(titleElement.textContent).toEqual('1');
 
-      let secondItemElement = document.querySelector('.ms-Dropdown-item[data-index="2"]') as HTMLElement;
-      ReactTestUtils.Simulate.click(secondItemElement);
-    }
-    finally {
-      expect(dropdownRoot!.querySelector('.ms-Dropdown-title')!.textContent).toEqual('2');
-    }
+      ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
+      ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
+      ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
+      titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      expect(titleElement.textContent).toEqual('4');
+    });
   });
 
-  it('Will select the first valid item on keypress', () => {
-    let container = document.createElement('div');
+  describe('multi-select', () => {
 
-    ReactDOM.render(
-      <Dropdown
-        label='testgroup'
-        options={ DEFAULT_OPTIONS }
-      />,
-      container);
-    let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-    ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
+    it('Renders no selected item in default case', () => {
+      let container = document.createElement('div');
 
-    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
-    expect(titleElement.textContent).toEqual('1');
-  });
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          options={ DEFAULT_OPTIONS }
+          multiSelect
+        />,
+        container);
+      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
-  it('Will select the first valid item on Home keypress', () => {
-    let container = document.createElement('div');
+      expect(titleElement.textContent).toEqual('');
+    });
 
-    ReactDOM.render(
-      <Dropdown
-        label='testgroup'
-        options={ DEFAULT_OPTIONS }
-      />,
-      container);
-    let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-    ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.home });
+    it('Renders a selected item if option specifies selected', () => {
+      let container = document.createElement('div');
 
-    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
-    expect(titleElement.textContent).toEqual('1');
-  });
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          options={ [{ key: '1', text: '1', selected: true }, { key: '2', text: '2' },] }
+          multiSelect
+        />,
+        container);
+      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
-  it('Will select the last valid item on End keypress', () => {
-    let container = document.createElement('div');
+      expect(titleElement.textContent).toEqual('1');
+    });
 
-    ReactDOM.render(
-      <Dropdown
-        label='testgroup'
-        options={ DEFAULT_OPTIONS }
-      />,
-      container);
-    let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-    ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.end });
+    it('Renders multiple selected items if multiple options specify selected', () => {
+      let container = document.createElement('div');
 
-    let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
-    expect(titleElement.textContent).toEqual('6');
-  });
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          options={ [{ key: '1', text: '1', selected: true }, { key: '2', text: '2', selected: true },] }
+          multiSelect
+        />,
+        container);
+      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+
+      expect(titleElement.textContent).toEqual('1, 2');
+    });
+
+    it('Renders a selected item in uncontrolled case', () => {
+      let container = document.createElement('div');
+
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          defaultSelectedKeys={ ['1', '2'] }
+          multiSelect
+          options={ DEFAULT_OPTIONS }
+        />,
+        container);
+      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+
+      expect(titleElement.textContent).toEqual('1, 2');
+    });
+
+    it('does not change the selected items when defaultSelectedKeys changes', () => {
+      let container = document.createElement('div');
+
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          defaultSelectedKeys={ ['1', '2'] }
+          multiSelect
+          options={ DEFAULT_OPTIONS }
+        />,
+        container);
+      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+
+      expect(titleElement.textContent).toEqual('1, 2');
+
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          defaultSelectedKeys={ ['3', '4'] }
+          multiSelect
+          options={ DEFAULT_OPTIONS }
+        />,
+        container);
+
+      expect(titleElement.textContent).toEqual('1, 2');
+    });
+
+    it('Renders selected items in controlled case', () => {
+      let container = document.createElement('div');
+
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          selectedKeys={ ['1', '3'] }
+          multiSelect
+          options={ DEFAULT_OPTIONS }
+        />,
+        container);
+      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+
+      expect(titleElement.textContent).toEqual('1, 3');
+    });
+
+    it('changes selected items in controlled case', () => {
+      let container = document.createElement('div');
+
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          selectedKeys={ ['1', '3'] }
+          multiSelect
+          options={ DEFAULT_OPTIONS }
+        />,
+        container);
+      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+
+      expect(titleElement.textContent).toEqual('1, 3');
+
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          selectedKeys={ ['2', '4'] }
+          multiSelect
+          options={ DEFAULT_OPTIONS }
+        />,
+        container);
+      expect(titleElement.textContent).toEqual('2, 4');
+    });
+
+    it('Can change items in uncontrolled case', () => {
+      let container = document.createElement('div');
+      let dropdownRoot: HTMLElement | undefined;
+
+      document.body.appendChild(container);
+
+      try {
+        ReactDOM.render(
+          <Dropdown
+            label='testgroup'
+            defaultSelectedKeys={ ['1'] }
+            multiSelect
+            id='test'
+            options={ DEFAULT_OPTIONS }
+          />,
+          container);
+        dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+
+        ReactTestUtils.Simulate.click(dropdownRoot);
+
+        let secondItemElement = document.querySelectorAll('.ms-Dropdown-item[role="checkbox"]')[1] as HTMLElement;
+        ReactTestUtils.Simulate.click(secondItemElement);
+      }
+      finally {
+        expect(dropdownRoot!.querySelector('.ms-Dropdown-title')!.textContent).toEqual('1, 2');
+      }
+    });
+
+    /*
+    // I'm not sure why these two tests fail. I've manually verified the scenario, even manually through programatic clicks, but these
+    // tests simply won't pass
+    it('issues the onChanged callback when selecting an item', () => {
+      let container = document.createElement('div');
+      let dropdownRoot: HTMLElement | undefined;
+
+      document.body.appendChild(container);
+
+      let onChangedSpy = jasmine.createSpy('onChanged');
+
+      try {
+        ReactDOM.render(
+          <Dropdown
+            label='testgroup'
+            defaultSelectedKeys={ ['1'] }
+            multiSelect
+            onChanged={ onChangedSpy }
+            options={ DEFAULT_OPTIONS }
+          />,
+          container);
+        dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+
+        ReactTestUtils.Simulate.click(dropdownRoot);
+
+        let secondItemElement = document.querySelectorAll('.ms-Dropdown-item[role="checkbox"]')[1] as HTMLElement;
+        ReactTestUtils.Simulate.click(secondItemElement);
+      }
+      finally {
+        expect(onChangedSpy).toHaveBeenCalledWith({ ...DEFAULT_OPTIONS[2], selected: true }, 2);
+      }
+    });
+
+    it('issues the onChanged callback when unselecting an item', () => {
+      let container = document.createElement('div');
+      let dropdownRoot: HTMLElement | undefined;
+
+      document.body.appendChild(container);
+
+      let onChangedSpy = jasmine.createSpy('onChanged');
+
+      try {
+        ReactDOM.render(
+          <Dropdown
+            label='testgroup'
+            defaultSelectedKeys={ ['1'] }
+            multiSelect
+            onChanged={ onChangedSpy }
+            options={ DEFAULT_OPTIONS }
+          />,
+          container);
+        dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+
+        ReactTestUtils.Simulate.click(dropdownRoot);
+
+        let firstItemElement = document.querySelectorAll('.ms-Dropdown-item[role="checkbox"]')[0] as HTMLElement;
+        ReactTestUtils.Simulate.click(firstItemElement);
+      }
+      finally {
+        expect(onChangedSpy).toHaveBeenCalledWith({ ...DEFAULT_OPTIONS[1], selected: false }, 1);
+      }
+    });
+    */
+
+    it('Will not select the first valid item on keypress', () => {
+      let container = document.createElement('div');
+
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          options={ DEFAULT_OPTIONS }
+          multiSelect
+        />,
+        container);
+      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
+
+      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      expect(titleElement.textContent).toEqual('');
+    });
+
+    it('Will not select the first valid item on Home keypress', () => {
+      let container = document.createElement('div');
+
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          options={ DEFAULT_OPTIONS }
+          multiSelect
+        />,
+        container);
+      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.home });
+
+      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      expect(titleElement.textContent).toEqual('');
+    });
+
+    it('Will not select the last valid item on End keypress', () => {
+      let container = document.createElement('div');
+
+      ReactDOM.render(
+        <Dropdown
+          label='testgroup'
+          options={ DEFAULT_OPTIONS }
+          multiSelect
+        />,
+        container);
+      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.end });
+
+      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      expect(titleElement.textContent).toEqual('');
+    });
 
-  it('Will skip over headers and separators on keypress', () => {
-    let container = document.createElement('div');
-    let dropdownRoot;
-    let titleElement;
-
-    document.body.appendChild(container);
-    ReactDOM.render(
-      <Dropdown
-        label='testgroup'
-        options={ DEFAULT_OPTIONS }
-      />,
-      container);
-    dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-
-    ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
-    titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
-    expect(titleElement.textContent).toEqual('1');
-
-    ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
-    ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
-    ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
-    titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
-    expect(titleElement.textContent).toEqual('4');
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index bbb3116d53dd5..3a44992dd85ad 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -31,8 +31,7 @@ export interface IDropdownInternalProps extends IDropdownProps, IWithResponsiveM
 
 export interface IDropdownState {
   isOpen?: boolean;
-  selectedIndex?: number;
-  selectedIndexes?: number[];
+  selectedIndices?: number[];
 }
 
 @withResponsiveMode
@@ -84,12 +83,12 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     if (this.props.multiSelect) {
       let selectedKeys = props.defaultSelectedKeys !== undefined ? props.defaultSelectedKeys : props.selectedKeys;
       this.state = {
-        selectedIndexes: this._getSelectedIndexes(props.options, selectedKeys!)
+        selectedIndices: this._getSelectedIndexes(props.options, selectedKeys)
       };
     } else {
       let selectedKey = props.defaultSelectedKey !== undefined ? props.defaultSelectedKey : props.selectedKey;
       this.state = {
-        selectedIndex: this._getSelectedIndex(props.options, selectedKey!)
+        selectedIndices: this._getSelectedIndexes(props.options, selectedKey!)
       };
     }
 
@@ -98,17 +97,12 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   public componentWillReceiveProps(newProps: IDropdownProps) {
     // In controlled component usage where selectedKey is provided, update the selectedIndex
     // state if the key or options change.
-    if (newProps.selectedKey !== undefined &&
-      (newProps.selectedKey !== this.props.selectedKey || newProps.options !== this.props.options)) {
-      if (this.props.multiSelect) {
-        this.setState({
-          selectedIndexes: this._getSelectedIndexes(newProps.options, newProps.selectedKeys)
-        });
-      } else {
-        this.setState({
-          selectedIndex: this._getSelectedIndex(newProps.options, newProps.selectedKey)
-        });
-      }
+    let selectedKeyProp: keyof IDropdownProps = this.props.multiSelect ? 'selectedKeys' : 'selectedKey';
+    if (newProps[selectedKeyProp] !== undefined &&
+      (newProps[selectedKeyProp] !== this.props[selectedKeyProp] || newProps.options !== this.props.options)) {
+      this.setState({
+        selectedIndices: this._getSelectedIndexes(newProps.options, newProps[selectedKeyProp])
+      });
     }
   }
 
@@ -135,9 +129,8 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
       onRenderPlaceHolder = this._onRenderPlaceHolder,
       onRenderCaretDown = this._onRenderCaretDown
     } = this.props;
-    let { isOpen, selectedIndex, selectedIndexes } = this.state;
-    let selectedOption = this.props.multiSelect ? selectedIndexes && this._getAllSelectedOptions(options, selectedIndexes)
-      : options[selectedIndex as number];
+    let { isOpen, selectedIndices = [] } = this.state;
+    let selectedOptions = this._getAllSelectedOptions(options, selectedIndices);
     let divProps = getNativeProps(this.props, divProperties);
 
     // Remove this deprecation workaround at 1.0.0
@@ -160,7 +153,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
           aria-live={ disabled || isOpen ? 'off' : 'assertive' }
           aria-label={ ariaLabel }
           aria-describedby={ id + '-option' }
-          aria-activedescendant={ isOpen && selectedIndex! >= 0 ? (this._id + '-list' + selectedIndex) : null }
+          aria-activedescendant={ isOpen && selectedIndices.length === 1 && selectedIndices[0] >= 0 ? (this._id + '-list' + selectedIndices[0]) : null }
           aria-disabled={ disabled }
           aria-owns={ isOpen ? id + '-list' : null }
           { ...divProps }
@@ -181,18 +174,17 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
             id={ id + '-option' }
             className={ css(
               'ms-Dropdown-title', styles.title,
-              !selectedOption && 'ms-Dropdown-titleIsPlaceHolder',
-              !selectedOption && styles.titleIsPlaceHolder,
+              !selectedOptions.length && 'ms-Dropdown-titleIsPlaceHolder',
+              !selectedOptions.length && styles.titleIsPlaceHolder,
               (errorMessage && errorMessage.length > 0 ? styles.titleIsError : null))
             }
-            key={ selectedIndex }
             aria-atomic={ true }
             role='textbox'
             aria-readonly='true'
           >
             { // If option is selected render title, otherwise render the placeholder text
-              selectedOption ? (
-                onRenderTitle(selectedOption, this._onRenderTitle)
+              selectedOptions.length ? (
+                onRenderTitle(selectedOptions, this._onRenderTitle)
               ) :
                 onRenderPlaceHolder(this.props, this._onRenderPlaceHolder)
             }
@@ -223,46 +215,41 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   public setSelectedIndex(index: number) {
-    let { onChanged, options, selectedKey, multiSelect } = this.props;
-    let { selectedIndex, selectedIndexes } = this.state;
-    let checked: boolean = selectedIndexes ? selectedIndexes.indexOf(index) > -1 : false;
+    let { onChanged, options, selectedKey, selectedKeys, multiSelect } = this.props;
+    let { selectedIndices = [] } = this.state;
+    let checked: boolean = selectedIndices ? selectedIndices.indexOf(index) > -1 : false;
 
     index = Math.max(0, Math.min(options.length - 1, index));
 
-    if (index !== selectedIndex) {
-      if (selectedKey === undefined) {
-        // Set the selected option if this is an uncontrolled component
-        if (multiSelect) {
-          let newIndexes = selectedIndexes ? this._copyArray(selectedIndexes) : [];
-          if (checked) {
-            let position = newIndexes.indexOf(index);
-            if (position > -1) {
-              // unchecked the current one
-              newIndexes.splice(position, 1);
-            }
-          } else {
-            // add the new selected index into the existing one
-            newIndexes.push(index);
-          }
-          this.setState({
-            selectedIndexes: newIndexes
-          });
-        } else {
-          this.setState({
-            selectedIndex: index
-          });
-        }
-      }
-      if (onChanged) {
-        // for single-select, option passed in will always be selected.
-        if (!multiSelect) {
-          options.map((option: any) => option.selected === true ? option.selected = false : null);
+    if (!multiSelect && index === selectedIndices[0]) {
+      return;
+    } else if (!multiSelect && selectedKey === undefined) {
+      // Set the selected option if this is an uncontrolled component
+      this.setState({
+        selectedIndices: [index]
+      });
+    } else if (multiSelect && selectedKeys === undefined) {
+      let newIndexes = selectedIndices ? this._copyArray(selectedIndices) : [];
+      if (checked) {
+        let position = newIndexes.indexOf(index);
+        if (position > -1) {
+          // unchecked the current one
+          newIndexes.splice(position, 1);
         }
-        // for multi-select, flip the checked value
-        let changedOpt = options[index];
-        changedOpt.selected = multiSelect ? !checked : true;
-        onChanged(changedOpt, index);
+      } else {
+        // add the new selected index into the existing one
+        newIndexes.push(index);
       }
+      this.setState({
+        selectedIndices: newIndexes
+      });
+    }
+
+    if (onChanged) {
+      // for single-select, option passed in will always be selected.
+      // for multi-select, flip the checked value
+      let changedOpt = multiSelect ? { ...options[index], selected: !checked } : options[index];
+      onChanged(changedOpt, index);
     }
   }
 
@@ -303,10 +290,13 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
       if (stepCounter >= options.length) {
         return selectedIndex;
       }
-      // If index + stepValue is out of bounds, reverse step direction
-      if (index + stepValue < 0 || index + stepValue >= options.length) {
-        stepValue *= -1;
+      // If index + stepValue is out of bounds, wrap around
+      if (index + stepValue < 0) {
+        index = options.length;
+      } else if (index + stepValue >= options.length) {
+        index = -1;
       }
+
       index = index + stepValue;
       stepCounter++;
     }
@@ -317,15 +307,10 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
 
   // Render text in dropdown input
   @autobind
-  private _onRenderTitle(item: IDropdownOption | IDropdownOption[]): JSX.Element {
-    let displayTxt: string = '';
+  private _onRenderTitle(item: IDropdownOption[]): JSX.Element {
     let { multiSelectDelimiter = ', ' } = this.props;
 
-    if (this.props.multiSelect && Array.isArray(item)) {
-      displayTxt = item.map(i => i.text).join(multiSelectDelimiter);
-    } else {
-      displayTxt = (item as IDropdownOption).text;
-    }
+    let displayTxt = item.map(i => i.text).join(multiSelectDelimiter);
     return <span>{ displayTxt }</span>;
   }
 
@@ -400,14 +385,14 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     } = this.props;
 
     let id = this._id;
-    let { selectedIndex } = this.state;
+    let { selectedIndices = [] } = this.state;
 
     return (
       <div onKeyDown={ this._onZoneKeyDown }>
         <FocusZone
           ref={ this._resolveRef('_focusZone') }
           direction={ FocusZoneDirection.vertical }
-          defaultActiveElement={ '#' + id + '-list' + selectedIndex }
+          defaultActiveElement={ selectedIndices[0] !== undefined ? `#${id}-list${selectedIndices[0]}` : undefined }
           id={ id + '-list' }
           className={ css('ms-Dropdown-items', styles.items) }
           aria-labelledby={ id + '-label' }
@@ -463,12 +448,10 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   @autobind
   private _renderOption(item: IDropdownOption): JSX.Element {
     let { onRenderOption = this._onRenderOption } = this.props;
-    let { selectedIndexes } = this.state;
+    let { selectedIndices = [] } = this.state;
     let id = this._id;
-    let isItemSelected;
-    if (this.props.multiSelect) {
-      isItemSelected = item.index !== undefined && selectedIndexes ? selectedIndexes.indexOf(item.index) > -1 : false;
-    }
+    let isItemSelected = item.index !== undefined && selectedIndices ? selectedIndices.indexOf(item.index) > -1 : false;
+
     return (
       !this.props.multiSelect ?
         (
@@ -480,13 +463,13 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
             data-is-focusable={ true }
             className={ css(
               'ms-Dropdown-item', styles.item, {
-                ['is-selected ' + styles.itemIsSelected]: this.state.selectedIndex === item.index,
+                ['is-selected ' + styles.itemIsSelected]: isItemSelected,
                 ['is-disabled ' + styles.itemIsDisabled]: this.props.disabled === true
               }
             ) }
             onClick={ this._onItemClick(item.index!) }
             role='option'
-            aria-selected={ this.state.selectedIndex === item.index ? 'true' : 'false' }
+            aria-selected={ isItemSelected ? 'true' : 'false' }
             ariaLabel={ item.ariaLabel || item.text }
             title={ item.text }
           >
@@ -528,6 +511,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     this._focusZone.focus();
   }
 
+  @autobind
   private _onItemClick(index: number): () => void {
     return (): void => {
       this.setSelectedIndex(index);
@@ -547,30 +531,44 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   // Get all selected indexes for multi-select mode
-  private _getSelectedIndexes(options: IDropdownOption[], selectedKey: any): number[] {
-    let selectedIndex: number[] = [];
+  private _getSelectedIndexes(options: IDropdownOption[], selectedKey: string | number | string[] | number[] | undefined): number[] {
     if (!selectedKey) {
-      return selectedIndex;
+      if (this.props.multiSelect) {
+        return this._getAllSelectedIndices(options);
+      }
+      let selectedIndex = this._getSelectedIndex(options, null);
+      return selectedIndex !== -1 ? [selectedIndex] : [];
+    } else if (!Array.isArray(selectedKey)) {
+      return [this._getSelectedIndex(options, selectedKey)];
     }
+
+    let selectedIndices: number[] = [];
     for (let key of selectedKey) {
-      selectedIndex.push(this._getSelectedIndex(options, key));
+      selectedIndices.push(this._getSelectedIndex(options, key));
     }
-    return selectedIndex;
+    return selectedIndices;
   }
 
   // Get all selected options for multi-select mode
-  private _getAllSelectedOptions(options: IDropdownOption[], selectedIndex: number[]) {
+  private _getAllSelectedOptions(options: IDropdownOption[], selectedIndices: number[]) {
     let selectedOptions: IDropdownOption[] = [];
-    for (let index of selectedIndex) {
+    for (let index of selectedIndices) {
       selectedOptions.push(options[index]);
     }
     if (selectedOptions.length < 1) {
-      return undefined;
+      return [];
     }
     return selectedOptions;
   }
 
-  private _getSelectedIndex(options: IDropdownOption[], selectedKey: string | number): number {
+  private _getAllSelectedIndices(options: IDropdownOption[]): number[] {
+    return options
+      .map((option: IDropdownOption, index: number) => option.selected ? index : -1)
+      .filter(index => index !== -1);
+
+  }
+
+  private _getSelectedIndex(options: IDropdownOption[], selectedKey: string | number | null): number {
     return findIndex(options, (option => {
       // tslint:disable-next-line:triple-equals
       if (selectedKey != null) {
@@ -601,7 +599,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
       }
     }
     let newIndex: number | undefined;
-    const selectedIndex = this.props.multiSelect ? (this.state.selectedIndexes ? this.state.selectedIndexes[0] : -1) : this.state.selectedIndex!;
+    const selectedIndex = this.state.selectedIndices!.length ? this.state.selectedIndices![0] : -1;
 
     switch (ev.which) {
       case KeyCodes.enter:
@@ -637,11 +635,15 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
         break;
 
       case KeyCodes.home:
-        newIndex = this._moveIndex(1, 0, selectedIndex);
+        if (!this.props.multiSelect) {
+          newIndex = this._moveIndex(1, 0, selectedIndex);
+        }
         break;
 
       case KeyCodes.end:
-        newIndex = this._moveIndex(-1, this.props.options.length - 1, selectedIndex);
+        if (!this.props.multiSelect) {
+          newIndex = this._moveIndex(-1, this.props.options.length - 1, selectedIndex);
+        }
         break;
 
       case KeyCodes.space:
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
index 71e8a461d5af3..290564e782e83 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
@@ -1,17 +1,19 @@
 import * as React from 'react';
 import { Dropdown, DropdownMenuItemType, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
+import { autobind } from '../../../Utilities';
 import './Dropdown.Basic.Example.scss';
 
 export class DropdownBasicExample extends React.Component<any, any> {
   constructor() {
     super();
     this.state = {
-      selectedItem: null
+      selectedItem: null,
+      selectedItems: [],
     };
   }
 
   public render() {
-    let { selectedItem } = this.state;
+    let { selectedItem, selectedItems } = this.state;
 
     return (
       <div className='DropdownBasicExample'>
@@ -88,7 +90,6 @@ export class DropdownBasicExample extends React.Component<any, any> {
           placeHolder='Select options'
           label='Multi-Select uncontrolled example:'
           defaultSelectedKeys={ ['Apple', 'Banana'] }
-          onChanged={ this.changeState }
           onFocus={ this._log('onFocus called') }
           onBlur={ this._log('onBlur called') }
           multiSelect
@@ -111,7 +112,7 @@ export class DropdownBasicExample extends React.Component<any, any> {
         <Dropdown
           placeHolder='Select options'
           label='Multi-Select controlled example:'
-          selectedKeys={ selectedItem && selectedItem.key }
+          selectedKeys={ selectedItems }
           onChanged={ this.onChangeMultiSelect }
           onFocus={ this._log('onFocus called') }
           onBlur={ this._log('onBlur called') }
@@ -164,25 +165,27 @@ export class DropdownBasicExample extends React.Component<any, any> {
     return list;
   }
 
+  @autobind
   public changeState(item: IDropdownOption) {
     console.log('here is the things updating...' + item.key + ' ' + item.text + ' ' + item.selected);
-    this.setState({ selectedItem: item });
+    this.setState({ selectedItems: item });
   }
 
+  @autobind
   public onChangeMultiSelect(item: IDropdownOption) {
-    let updatedSelectedItem = this.state.selectedItem ? this.copyArray(this.state.selectedItem) : [];
+    let updatedSelectedItem = this.state.selectedItems ? this.copyArray(this.state.selectedItems) : [];
     if (item.selected) {
       // add the option if it's checked
-      updatedSelectedItem.push(item);
+      updatedSelectedItem.push(item.key);
     } else {
       // remove the option if it's unchecked
-      let currIndex = updatedSelectedItem.indexOf(item.index);
+      let currIndex = updatedSelectedItem.indexOf(item.key);
       if (currIndex > -1) {
         updatedSelectedItem.splice(currIndex, 1);
       }
     }
     this.setState({
-      selectedItem: updatedSelectedItem
+      selectedItems: updatedSelectedItem
     });
   }
 

From 8e1dcc66cda8334653a8b5ccbde02bf6275e0b23 Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Thu, 5 Oct 2017 15:27:39 -0700
Subject: [PATCH 0795/1641] Fix: office-ui-fabric-react so that it preserves
 enum consts (#3047)

* fix office-ui-fabric-react so that it preserves enum consts

* updated the rest of the tsconfig files

* adding change files
---
 apps/fabric-website/tsconfig.json                     |  1 +
 apps/test-bundle-button/tsconfig.json                 |  1 +
 apps/todo-app/tsconfig.json                           |  1 +
 apps/vr-tests/tsconfig.json                           |  1 +
 .../positioning-refactor_2017-09-28-20-50.json        | 11 +++++++++++
 .../preserveenumconsts_2017-10-05-21-04.json          | 11 +++++++++++
 .../positioning-refactor_2017-09-28-20-50.json        | 11 +++++++++++
 .../preserveenumconsts_2017-10-05-21-04.json          | 11 +++++++++++
 .../positioning-refactor_2017-09-28-20-50.json        | 11 +++++++++++
 .../preserveenumconsts_2017-10-05-21-04.json          | 11 +++++++++++
 .../icons/preserveenumconsts_2017-10-05-21-04.json    | 11 +++++++++++
 .../preserveenumconsts_2017-10-05-21-04.json          | 11 +++++++++++
 .../positioning-refactor_2017-09-28-20-50.json        | 11 +++++++++++
 .../styling/preserveenumconsts_2017-10-05-21-04.json  | 11 +++++++++++
 .../preserveenumconsts_2017-10-05-21-04.json          | 11 +++++++++++
 .../preserveenumconsts_2017-10-05-21-04.json          | 11 +++++++++++
 packages/example-app-base/tsconfig.json               |  1 +
 packages/experiments/tsconfig.json                    |  1 +
 packages/icons/tsconfig.json                          |  1 +
 packages/merge-styles/tsconfig.json                   |  1 +
 packages/office-ui-fabric-react/tsconfig.json         |  1 +
 packages/styling/tsconfig.json                        |  1 +
 packages/utilities/tsconfig.json                      |  1 +
 23 files changed, 143 insertions(+)
 create mode 100644 common/changes/@uifabric/example-app-base/positioning-refactor_2017-09-28-20-50.json
 create mode 100644 common/changes/@uifabric/example-app-base/preserveenumconsts_2017-10-05-21-04.json
 create mode 100644 common/changes/@uifabric/experiments/positioning-refactor_2017-09-28-20-50.json
 create mode 100644 common/changes/@uifabric/experiments/preserveenumconsts_2017-10-05-21-04.json
 create mode 100644 common/changes/@uifabric/fabric-website/positioning-refactor_2017-09-28-20-50.json
 create mode 100644 common/changes/@uifabric/fabric-website/preserveenumconsts_2017-10-05-21-04.json
 create mode 100644 common/changes/@uifabric/icons/preserveenumconsts_2017-10-05-21-04.json
 create mode 100644 common/changes/@uifabric/merge-styles/preserveenumconsts_2017-10-05-21-04.json
 create mode 100644 common/changes/@uifabric/styling/positioning-refactor_2017-09-28-20-50.json
 create mode 100644 common/changes/@uifabric/styling/preserveenumconsts_2017-10-05-21-04.json
 create mode 100644 common/changes/@uifabric/utilities/preserveenumconsts_2017-10-05-21-04.json
 create mode 100644 common/changes/office-ui-fabric-react/preserveenumconsts_2017-10-05-21-04.json

diff --git a/apps/fabric-website/tsconfig.json b/apps/fabric-website/tsconfig.json
index 3fd52c50b451e..8fd21a0b2c8a7 100644
--- a/apps/fabric-website/tsconfig.json
+++ b/apps/fabric-website/tsconfig.json
@@ -11,6 +11,7 @@
     "importHelpers": true,
     "forceConsistentCasingInFileNames": true,
     "moduleResolution": "node",
+    "preserveConstEnums": true,
     "types": [
       "chai",
       "mocha",
diff --git a/apps/test-bundle-button/tsconfig.json b/apps/test-bundle-button/tsconfig.json
index fae99682d09cb..39d960a137572 100644
--- a/apps/test-bundle-button/tsconfig.json
+++ b/apps/test-bundle-button/tsconfig.json
@@ -11,6 +11,7 @@
     "importHelpers": true,
     "forceConsistentCasingInFileNames": true,
     "moduleResolution": "node",
+    "preserveConstEnums": true,
     "types": [
       "webpack-env"
     ],
diff --git a/apps/todo-app/tsconfig.json b/apps/todo-app/tsconfig.json
index 7d3ecc1ecc28d..8d55f607593ba 100644
--- a/apps/todo-app/tsconfig.json
+++ b/apps/todo-app/tsconfig.json
@@ -9,6 +9,7 @@
     "experimentalDecorators": true,
     "forceConsistentCasingInFileNames": true,
     "moduleResolution": "node",
+    "preserveConstEnums": true,
     "types": [
       "chai",
       "mocha",
diff --git a/apps/vr-tests/tsconfig.json b/apps/vr-tests/tsconfig.json
index 69d520d4e2e7c..e0cc58a3f09e3 100644
--- a/apps/vr-tests/tsconfig.json
+++ b/apps/vr-tests/tsconfig.json
@@ -9,6 +9,7 @@
     "experimentalDecorators": true,
     "forceConsistentCasingInFileNames": true,
     "moduleResolution": "node",
+    "preserveConstEnums": true,
     "types": [
       "webpack-env"
     ]
diff --git a/common/changes/@uifabric/example-app-base/positioning-refactor_2017-09-28-20-50.json b/common/changes/@uifabric/example-app-base/positioning-refactor_2017-09-28-20-50.json
new file mode 100644
index 0000000000000..e4ff247bb6846
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/positioning-refactor_2017-09-28-20-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/preserveenumconsts_2017-10-05-21-04.json b/common/changes/@uifabric/example-app-base/preserveenumconsts_2017-10-05-21-04.json
new file mode 100644
index 0000000000000..aeeaf30373d00
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/preserveenumconsts_2017-10-05-21-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/positioning-refactor_2017-09-28-20-50.json b/common/changes/@uifabric/experiments/positioning-refactor_2017-09-28-20-50.json
new file mode 100644
index 0000000000000..3f7229aecabcd
--- /dev/null
+++ b/common/changes/@uifabric/experiments/positioning-refactor_2017-09-28-20-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/experiments",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/preserveenumconsts_2017-10-05-21-04.json b/common/changes/@uifabric/experiments/preserveenumconsts_2017-10-05-21-04.json
new file mode 100644
index 0000000000000..1fffec6a1cf20
--- /dev/null
+++ b/common/changes/@uifabric/experiments/preserveenumconsts_2017-10-05-21-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/positioning-refactor_2017-09-28-20-50.json b/common/changes/@uifabric/fabric-website/positioning-refactor_2017-09-28-20-50.json
new file mode 100644
index 0000000000000..60628424a4dfe
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/positioning-refactor_2017-09-28-20-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/preserveenumconsts_2017-10-05-21-04.json b/common/changes/@uifabric/fabric-website/preserveenumconsts_2017-10-05-21-04.json
new file mode 100644
index 0000000000000..0cc06bdaf9743
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/preserveenumconsts_2017-10-05-21-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/preserveenumconsts_2017-10-05-21-04.json b/common/changes/@uifabric/icons/preserveenumconsts_2017-10-05-21-04.json
new file mode 100644
index 0000000000000..fff9b1b9d0a63
--- /dev/null
+++ b/common/changes/@uifabric/icons/preserveenumconsts_2017-10-05-21-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/icons",
+      "comment": "TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/icons",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/preserveenumconsts_2017-10-05-21-04.json b/common/changes/@uifabric/merge-styles/preserveenumconsts_2017-10-05-21-04.json
new file mode 100644
index 0000000000000..4483aa77cdfa5
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/preserveenumconsts_2017-10-05-21-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/positioning-refactor_2017-09-28-20-50.json b/common/changes/@uifabric/styling/positioning-refactor_2017-09-28-20-50.json
new file mode 100644
index 0000000000000..7285eaba1d8e4
--- /dev/null
+++ b/common/changes/@uifabric/styling/positioning-refactor_2017-09-28-20-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/preserveenumconsts_2017-10-05-21-04.json b/common/changes/@uifabric/styling/preserveenumconsts_2017-10-05-21-04.json
new file mode 100644
index 0000000000000..f91299ef08372
--- /dev/null
+++ b/common/changes/@uifabric/styling/preserveenumconsts_2017-10-05-21-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/preserveenumconsts_2017-10-05-21-04.json b/common/changes/@uifabric/utilities/preserveenumconsts_2017-10-05-21-04.json
new file mode 100644
index 0000000000000..6ac4cc31d8d5b
--- /dev/null
+++ b/common/changes/@uifabric/utilities/preserveenumconsts_2017-10-05-21-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/preserveenumconsts_2017-10-05-21-04.json b/common/changes/office-ui-fabric-react/preserveenumconsts_2017-10-05-21-04.json
new file mode 100644
index 0000000000000..a970c4eeb5f73
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/preserveenumconsts_2017-10-05-21-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "TSConfig: update to use preserveConstEnums so that certain builds systems don't break when importing const enums",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/tsconfig.json b/packages/example-app-base/tsconfig.json
index 80e659ee5b76e..fab4710f79a9b 100644
--- a/packages/example-app-base/tsconfig.json
+++ b/packages/example-app-base/tsconfig.json
@@ -11,6 +11,7 @@
     "noImplicitAny": false,
     "strictNullChecks": true,
     "moduleResolution": "node",
+    "preserveConstEnums": true,
     "outDir": "lib",
     "lib": [
       "es2017",
diff --git a/packages/experiments/tsconfig.json b/packages/experiments/tsconfig.json
index 9da053f1acdf5..f48edfbaad5c2 100644
--- a/packages/experiments/tsconfig.json
+++ b/packages/experiments/tsconfig.json
@@ -14,6 +14,7 @@
     "strictNullChecks": true,
     "noImplicitAny": true,
     "moduleResolution": "node",
+    "preserveConstEnums": true,
     "lib": [
       "es2017",
       "dom"
diff --git a/packages/icons/tsconfig.json b/packages/icons/tsconfig.json
index bda277cc37803..0942199fbd053 100644
--- a/packages/icons/tsconfig.json
+++ b/packages/icons/tsconfig.json
@@ -14,6 +14,7 @@
     "strict": true,
     "forceConsistentCasingInFileNames": true,
     "moduleResolution": "node",
+    "preserveConstEnums": true,
     "types": []
   },
   "include": [
diff --git a/packages/merge-styles/tsconfig.json b/packages/merge-styles/tsconfig.json
index 0da240cd5b6fb..93c5fccb2af87 100644
--- a/packages/merge-styles/tsconfig.json
+++ b/packages/merge-styles/tsconfig.json
@@ -15,6 +15,7 @@
     "strict": true,
     "forceConsistentCasingInFileNames": true,
     "moduleResolution": "node",
+    "preserveConstEnums": true,
     "types": [
       "jest"
     ]
diff --git a/packages/office-ui-fabric-react/tsconfig.json b/packages/office-ui-fabric-react/tsconfig.json
index ed8e3408e720e..319ec47d60302 100644
--- a/packages/office-ui-fabric-react/tsconfig.json
+++ b/packages/office-ui-fabric-react/tsconfig.json
@@ -13,6 +13,7 @@
     "strictNullChecks": true,
     "noImplicitAny": true,
     "moduleResolution": "node",
+    "preserveConstEnums": true,
     "lib": [
       "es2017",
       "dom"
diff --git a/packages/styling/tsconfig.json b/packages/styling/tsconfig.json
index c07dc5607e845..819b22a0a41ce 100644
--- a/packages/styling/tsconfig.json
+++ b/packages/styling/tsconfig.json
@@ -13,6 +13,7 @@
     "noImplicitAny": false,
     "strictNullChecks": true,
     "forceConsistentCasingInFileNames": true,
+    "preserveConstEnums": true,
     "lib": [
       "es2017",
       "dom"
diff --git a/packages/utilities/tsconfig.json b/packages/utilities/tsconfig.json
index 91bde3c819ddb..16a0e58c514bd 100644
--- a/packages/utilities/tsconfig.json
+++ b/packages/utilities/tsconfig.json
@@ -16,6 +16,7 @@
     "strictNullChecks": true,
     "forceConsistentCasingInFileNames": true,
     "moduleResolution": "node",
+    "preserveConstEnums": true,
     "types": [
       "jest"
     ]

From 93a105ccb4710ab902113e0c4adec9bb4a786bbe Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Thu, 5 Oct 2017 18:20:49 -0700
Subject: [PATCH 0796/1641] Router: regex to be able to render the correct page
 when we encounter queries (#3048)

* Router regex for queries

* Added change file

* Renamed newPath to slicedPath

* Refactor, removed regex
---
 .../router-queries_2017-10-05-21-50.json         | 11 +++++++++++
 .../src/utilities/router/Router.tsx              | 16 +++++++++++-----
 2 files changed, 22 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/router-queries_2017-10-05-21-50.json

diff --git a/common/changes/office-ui-fabric-react/router-queries_2017-10-05-21-50.json b/common/changes/office-ui-fabric-react/router-queries_2017-10-05-21-50.json
new file mode 100644
index 0000000000000..2affb48067981
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/router-queries_2017-10-05-21-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Router: regex to be able to render the correct page when it encounters queries.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/router/Router.tsx b/packages/office-ui-fabric-react/src/utilities/router/Router.tsx
index 033c17d0d74f1..83564f8b77ede 100644
--- a/packages/office-ui-fabric-react/src/utilities/router/Router.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/router/Router.tsx
@@ -26,11 +26,17 @@ export class Router extends BaseComponent<IRouterProps, {}> {
   }
 
   private _getPath() {
-    let path = location.hash;
-    let index = path.lastIndexOf('#');
+    let path = location.hash,
+      hashIndex = path.lastIndexOf('#'),
+      questionMarkIndex = path.indexOf('?');
 
-    if (index > 0) {
-      path = path.substr(0, index);
+    // Look for the start of a query in the currentPath, then strip out the query to find the correct page to render
+    if (questionMarkIndex > -1) {
+      path = path.substr(0, questionMarkIndex);
+    }
+
+    if (hashIndex > 0) {
+      path = path.substr(0, hashIndex);
     }
 
     return path;
@@ -100,4 +106,4 @@ function _match(currentPath: string, child: any): boolean {
   }
 
   return false;
-}
+}
\ No newline at end of file

From ef73bd4dd45ccfed9d27b4ffee7370da8b362696 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 6 Oct 2017 03:18:41 -0700
Subject: [PATCH 0797/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 22 +++++++++
 apps/fabric-website/CHANGELOG.md              |  9 +++-
 apps/fabric-website/package.json              |  6 +--
 apps/ssr-tests/package.json                   |  4 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...positioning-refactor_2017-09-28-20-50.json | 11 -----
 .../preserveenumconsts_2017-10-05-21-04.json  | 11 -----
 ...positioning-refactor_2017-09-28-20-50.json | 11 -----
 .../preserveenumconsts_2017-10-05-21-04.json  | 11 -----
 ...positioning-refactor_2017-09-28-20-50.json | 11 -----
 .../preserveenumconsts_2017-10-05-21-04.json  | 11 -----
 .../preserveenumconsts_2017-10-05-21-04.json  | 11 -----
 .../preserveenumconsts_2017-10-05-21-04.json  | 11 -----
 ...positioning-refactor_2017-09-28-20-50.json | 11 -----
 .../preserveenumconsts_2017-10-05-21-04.json  | 11 -----
 .../preserveenumconsts_2017-10-05-21-04.json  | 11 -----
 ...ultiselect-dropdowns_2017-10-04-21-27.json | 11 -----
 .../button_menuIcon_2017-10-04-20-33.json     | 11 -----
 .../preserveenumconsts_2017-10-05-21-04.json  | 11 -----
 .../router-queries_2017-10-05-21-50.json      | 11 -----
 packages/example-app-base/CHANGELOG.json      | 22 +++++++++
 packages/example-app-base/CHANGELOG.md        |  9 +++-
 packages/example-app-base/package.json        |  6 +--
 packages/experiments/CHANGELOG.json           | 28 +++++++++++
 packages/experiments/CHANGELOG.md             |  9 +++-
 packages/experiments/package.json             | 10 ++--
 packages/icons/CHANGELOG.json                 | 19 ++++++++
 packages/icons/CHANGELOG.md                   |  9 +++-
 packages/icons/package.json                   |  4 +-
 packages/merge-styles/CHANGELOG.json          | 14 ++++++
 packages/merge-styles/CHANGELOG.md            |  9 +++-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 48 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 +++++-
 packages/office-ui-fabric-react/package.json  | 12 ++---
 packages/styling/CHANGELOG.json               | 22 +++++++++
 packages/styling/CHANGELOG.md                 |  9 +++-
 packages/styling/package.json                 |  6 +--
 packages/utilities/CHANGELOG.json             | 14 ++++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  2 +-
 scripts/package.json                          |  2 +-
 44 files changed, 289 insertions(+), 203 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/positioning-refactor_2017-09-28-20-50.json
 delete mode 100644 common/changes/@uifabric/example-app-base/preserveenumconsts_2017-10-05-21-04.json
 delete mode 100644 common/changes/@uifabric/experiments/positioning-refactor_2017-09-28-20-50.json
 delete mode 100644 common/changes/@uifabric/experiments/preserveenumconsts_2017-10-05-21-04.json
 delete mode 100644 common/changes/@uifabric/fabric-website/positioning-refactor_2017-09-28-20-50.json
 delete mode 100644 common/changes/@uifabric/fabric-website/preserveenumconsts_2017-10-05-21-04.json
 delete mode 100644 common/changes/@uifabric/icons/preserveenumconsts_2017-10-05-21-04.json
 delete mode 100644 common/changes/@uifabric/merge-styles/preserveenumconsts_2017-10-05-21-04.json
 delete mode 100644 common/changes/@uifabric/styling/positioning-refactor_2017-09-28-20-50.json
 delete mode 100644 common/changes/@uifabric/styling/preserveenumconsts_2017-10-05-21-04.json
 delete mode 100644 common/changes/@uifabric/utilities/preserveenumconsts_2017-10-05-21-04.json
 delete mode 100644 common/changes/office-ui-fabric-react/2971-fix-controlled-multiselect-dropdowns_2017-10-04-21-27.json
 delete mode 100644 common/changes/office-ui-fabric-react/button_menuIcon_2017-10-04-20-33.json
 delete mode 100644 common/changes/office-ui-fabric-react/preserveenumconsts_2017-10-05-21-04.json
 delete mode 100644 common/changes/office-ui-fabric-react/router-queries_2017-10-05-21-50.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 635ddf50abfe3..0e9ca453bcd95 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.0.8",
+      "tag": "@uifabric/fabric-website_v5.0.8",
+      "date": "Fri, 06 Oct 2017 10:18:41 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "8e1dcc66cda8334653a8b5ccbde02bf6275e0b23",
+            "comment": "TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/icons\" from `>=5.1.0 <6.0.0` to `>=5.1.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.3.0 <6.0.0` to `>=5.5.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.7",
       "tag": "@uifabric/fabric-website_v5.0.7",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index eb042ada3622c..26ad4933431d8 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Wed, 04 Oct 2017 22:40:22 GMT and should not be manually modified.
+This log was last generated on Fri, 06 Oct 2017 10:18:41 GMT and should not be manually modified.
+
+## 5.0.8
+Fri, 06 Oct 2017 10:18:41 GMT
+
+### Patches
+
+- TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums
 
 ## 5.0.7
 Wed, 04 Oct 2017 22:40:22 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 6cd49700edbad..1ced6917e43d6 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.0.7",
+  "version": "5.0.8",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -42,10 +42,10 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/icons": ">=5.1.0 <6.0.0",
+    "@uifabric/icons": ">=5.1.1 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.5.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index e1d6f27545f2e..8b78decf0bc45 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -17,14 +17,14 @@
   "license": "MIT",
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
-    "@uifabric/icons": ">=5.1.0 <6.0.0",
+    "@uifabric/icons": ">=5.1.1 <6.0.0",
     "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.8",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.5.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index d26232d9054e4..4791ec9f92ed0 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.5.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 884243acc8cff..dc6272eaaf3e9 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.5.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 975152c99d262..f143f95f0f3b7 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.3.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.5.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/example-app-base/positioning-refactor_2017-09-28-20-50.json b/common/changes/@uifabric/example-app-base/positioning-refactor_2017-09-28-20-50.json
deleted file mode 100644
index e4ff247bb6846..0000000000000
--- a/common/changes/@uifabric/example-app-base/positioning-refactor_2017-09-28-20-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/preserveenumconsts_2017-10-05-21-04.json b/common/changes/@uifabric/example-app-base/preserveenumconsts_2017-10-05-21-04.json
deleted file mode 100644
index aeeaf30373d00..0000000000000
--- a/common/changes/@uifabric/example-app-base/preserveenumconsts_2017-10-05-21-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/positioning-refactor_2017-09-28-20-50.json b/common/changes/@uifabric/experiments/positioning-refactor_2017-09-28-20-50.json
deleted file mode 100644
index 3f7229aecabcd..0000000000000
--- a/common/changes/@uifabric/experiments/positioning-refactor_2017-09-28-20-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/experiments",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/preserveenumconsts_2017-10-05-21-04.json b/common/changes/@uifabric/experiments/preserveenumconsts_2017-10-05-21-04.json
deleted file mode 100644
index 1fffec6a1cf20..0000000000000
--- a/common/changes/@uifabric/experiments/preserveenumconsts_2017-10-05-21-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/positioning-refactor_2017-09-28-20-50.json b/common/changes/@uifabric/fabric-website/positioning-refactor_2017-09-28-20-50.json
deleted file mode 100644
index 60628424a4dfe..0000000000000
--- a/common/changes/@uifabric/fabric-website/positioning-refactor_2017-09-28-20-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/preserveenumconsts_2017-10-05-21-04.json b/common/changes/@uifabric/fabric-website/preserveenumconsts_2017-10-05-21-04.json
deleted file mode 100644
index 0cc06bdaf9743..0000000000000
--- a/common/changes/@uifabric/fabric-website/preserveenumconsts_2017-10-05-21-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/preserveenumconsts_2017-10-05-21-04.json b/common/changes/@uifabric/icons/preserveenumconsts_2017-10-05-21-04.json
deleted file mode 100644
index fff9b1b9d0a63..0000000000000
--- a/common/changes/@uifabric/icons/preserveenumconsts_2017-10-05-21-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/icons",
-      "comment": "TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/icons",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/preserveenumconsts_2017-10-05-21-04.json b/common/changes/@uifabric/merge-styles/preserveenumconsts_2017-10-05-21-04.json
deleted file mode 100644
index 4483aa77cdfa5..0000000000000
--- a/common/changes/@uifabric/merge-styles/preserveenumconsts_2017-10-05-21-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/positioning-refactor_2017-09-28-20-50.json b/common/changes/@uifabric/styling/positioning-refactor_2017-09-28-20-50.json
deleted file mode 100644
index 7285eaba1d8e4..0000000000000
--- a/common/changes/@uifabric/styling/positioning-refactor_2017-09-28-20-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/preserveenumconsts_2017-10-05-21-04.json b/common/changes/@uifabric/styling/preserveenumconsts_2017-10-05-21-04.json
deleted file mode 100644
index f91299ef08372..0000000000000
--- a/common/changes/@uifabric/styling/preserveenumconsts_2017-10-05-21-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/preserveenumconsts_2017-10-05-21-04.json b/common/changes/@uifabric/utilities/preserveenumconsts_2017-10-05-21-04.json
deleted file mode 100644
index 6ac4cc31d8d5b..0000000000000
--- a/common/changes/@uifabric/utilities/preserveenumconsts_2017-10-05-21-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/2971-fix-controlled-multiselect-dropdowns_2017-10-04-21-27.json b/common/changes/office-ui-fabric-react/2971-fix-controlled-multiselect-dropdowns_2017-10-04-21-27.json
deleted file mode 100644
index 7dec09aca29a9..0000000000000
--- a/common/changes/office-ui-fabric-react/2971-fix-controlled-multiselect-dropdowns_2017-10-04-21-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: fix broken implementation of controlled multi-select dropdowns",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/button_menuIcon_2017-10-04-20-33.json b/common/changes/office-ui-fabric-react/button_menuIcon_2017-10-04-20-33.json
deleted file mode 100644
index 72235f1ddd023..0000000000000
--- a/common/changes/office-ui-fabric-react/button_menuIcon_2017-10-04-20-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Style ms-Button-menuIcon according to root styles for the following states - hovered, pressed, expanded  ande expandedHovered.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "maxvay@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/preserveenumconsts_2017-10-05-21-04.json b/common/changes/office-ui-fabric-react/preserveenumconsts_2017-10-05-21-04.json
deleted file mode 100644
index a970c4eeb5f73..0000000000000
--- a/common/changes/office-ui-fabric-react/preserveenumconsts_2017-10-05-21-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "TSConfig: update to use preserveConstEnums so that certain builds systems don't break when importing const enums",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/router-queries_2017-10-05-21-50.json b/common/changes/office-ui-fabric-react/router-queries_2017-10-05-21-50.json
deleted file mode 100644
index 2affb48067981..0000000000000
--- a/common/changes/office-ui-fabric-react/router-queries_2017-10-05-21-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Router: regex to be able to render the correct page when it encounters queries.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index f652f6ac336b2..93ed6804c9b31 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "5.1.1",
+      "tag": "@uifabric/example-app-base_v5.1.1",
+      "date": "Fri, 06 Oct 2017 10:18:41 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "8e1dcc66cda8334653a8b5ccbde02bf6275e0b23",
+            "comment": "TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.2.0 <6.0.0` to `>=5.2.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.2.0 <6.0.0` to `>=5.2.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.1.0",
       "tag": "@uifabric/example-app-base_v5.1.0",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index b76c752f46f68..00f1baba7a803 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Thu, 05 Oct 2017 17:03:43 GMT and should not be manually modified.
+This log was last generated on Fri, 06 Oct 2017 10:18:41 GMT and should not be manually modified.
+
+## 5.1.1
+Fri, 06 Oct 2017 10:18:41 GMT
+
+### Patches
+
+- TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums
 
 ## 5.1.0
 Thu, 05 Oct 2017 17:03:43 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index be715d5dc1047..9c73b85e9414e 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "5.1.0",
+  "version": "5.1.1",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -38,8 +38,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.2.0 <6.0.0",
-    "@uifabric/utilities": ">=5.2.0 <6.0.0",
+    "@uifabric/styling": ">=5.2.1 <6.0.0",
+    "@uifabric/utilities": ">=5.2.1 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 536e9b4441db7..2ebb9e409d759 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,34 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.0.4",
+      "tag": "@uifabric/experiments_v5.0.4",
+      "date": "Fri, 06 Oct 2017 10:18:41 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "8e1dcc66cda8334653a8b5ccbde02bf6275e0b23",
+            "comment": "TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.4.0 <6.0.0` to `>=5.5.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/icons\" from `>=5.1.0 <6.0.0` to `>=5.1.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=5.1.0 <6.0.0` to `>=5.1.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/icons\" from `>=5.1.0 <6.0.0` to `>=5.1.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.3",
       "tag": "@uifabric/experiments_v5.0.3",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 89c53ab79987f..368da8cd518cb 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Wed, 04 Oct 2017 22:40:22 GMT and should not be manually modified.
+This log was last generated on Fri, 06 Oct 2017 10:18:41 GMT and should not be manually modified.
+
+## 5.0.4
+Fri, 06 Oct 2017 10:18:41 GMT
+
+### Patches
+
+- TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums
 
 ## 5.0.3
 Wed, 04 Oct 2017 22:40:22 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index e6a79ea13567d..59d300c45063b 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.0.3",
+  "version": "5.0.4",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -28,8 +28,8 @@
     "@types/jest": "^21.1.0",
     "@types/enzyme": "^2.8.8",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=5.1.0 <6.0.0",
-    "@uifabric/icons": ">=5.1.0 <6.0.0",
+    "@uifabric/example-app-base": ">=5.1.1 <6.0.0",
+    "@uifabric/icons": ">=5.1.1 <6.0.0",
     "es6-weak-map": "^2.0.2",
     "enzyme": "^2.9.1",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
@@ -42,8 +42,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.4.0 <6.0.0",
-    "@uifabric/icons": ">=5.1.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.5.0 <6.0.0",
+    "@uifabric/icons": ">=5.1.1 <6.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/icons/CHANGELOG.json b/packages/icons/CHANGELOG.json
index 663c4567f94d9..0bb61aa7fa4d2 100644
--- a/packages/icons/CHANGELOG.json
+++ b/packages/icons/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/icons",
   "entries": [
+    {
+      "version": "5.1.1",
+      "tag": "@uifabric/icons_v5.1.1",
+      "date": "Fri, 06 Oct 2017 10:18:41 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "8e1dcc66cda8334653a8b5ccbde02bf6275e0b23",
+            "comment": "TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.2.0 <6.0.0` to `>=5.2.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.1.0",
       "tag": "@uifabric/icons_v5.1.0",
diff --git a/packages/icons/CHANGELOG.md b/packages/icons/CHANGELOG.md
index 12323d567a9b4..8197e89fd7723 100644
--- a/packages/icons/CHANGELOG.md
+++ b/packages/icons/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/icons
 
-This log was last generated on Thu, 05 Oct 2017 10:17:42 GMT and should not be manually modified.
+This log was last generated on Fri, 06 Oct 2017 10:18:41 GMT and should not be manually modified.
+
+## 5.1.1
+Fri, 06 Oct 2017 10:18:41 GMT
+
+### Patches
+
+- TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums
 
 ## 5.1.0
 Thu, 05 Oct 2017 10:17:42 GMT
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 8b63f72cbbbb3..ac18b25f28255 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/icons",
-  "version": "5.1.0",
+  "version": "5.1.1",
   "description": "Office UI Fabric icon set.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -23,7 +23,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.2.0 <6.0.0",
+    "@uifabric/styling": ">=5.2.1 <6.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index f898f5a3301dc..b418230c313bd 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.3.1",
+      "tag": "@uifabric/merge-styles_v5.3.1",
+      "date": "Fri, 06 Oct 2017 10:18:41 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "8e1dcc66cda8334653a8b5ccbde02bf6275e0b23",
+            "comment": "TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums"
+          }
+        ]
+      }
+    },
     {
       "version": "5.3.0",
       "tag": "@uifabric/merge-styles_v5.3.0",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index 7a142659d669e..167c46fa7ddf2 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Thu, 05 Oct 2017 10:17:42 GMT and should not be manually modified.
+This log was last generated on Fri, 06 Oct 2017 10:18:41 GMT and should not be manually modified.
+
+## 5.3.1
+Fri, 06 Oct 2017 10:18:41 GMT
+
+### Patches
+
+- TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums
 
 ## 5.3.0
 Thu, 05 Oct 2017 10:17:42 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index 039874693e6c5..fe0cca2bd7ee9 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.3.0",
+  "version": "5.3.1",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index c96cdf6eed358..e48561527d6ff 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,54 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.5.0",
+      "tag": "office-ui-fabric-react_v5.5.0",
+      "date": "Fri, 06 Oct 2017 10:18:41 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Michael Loughry <miclo@microsoft.com>",
+            "commit": "6373316a067e101fb196e3fc4364d45d08f7e62e",
+            "comment": "Dropdown: fix broken implementation of controlled multi-select dropdowns"
+          },
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "8e1dcc66cda8334653a8b5ccbde02bf6275e0b23",
+            "comment": "TSConfig: update to use preserveConstEnums so that certain builds systems don't break when importing const enums"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "93a105ccb4710ab902113e0c4adec9bb4a786bbe",
+            "comment": "Router: regex to be able to render the correct page when it encounters queries."
+          }
+        ],
+        "minor": [
+          {
+            "author": "Max Vaysburd <max@angrykitten.com>",
+            "commit": "25b9997aad2db7ca530283fb1bfb0b72e96955f7",
+            "comment": "Style ms-Button-menuIcon according to root styles for the following states - hovered, pressed, expanded  ande expandedHovered."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/icons\" from `>=5.1.0 <6.0.0` to `>=5.1.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.3.0 <6.0.0` to `>=5.3.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.2.0 <6.0.0` to `>=5.2.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.2.0 <6.0.0` to `>=5.2.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=5.1.0 <6.0.0` to `>=5.1.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.4.0",
       "tag": "office-ui-fabric-react_v5.4.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index bfc1817834721..aa9a706260667 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 05 Oct 2017 17:03:43 GMT and should not be manually modified.
+This log was last generated on Fri, 06 Oct 2017 10:18:41 GMT and should not be manually modified.
+
+## 5.5.0
+Fri, 06 Oct 2017 10:18:41 GMT
+
+### Minor changes
+
+- Style ms-Button-menuIcon according to root styles for the following states - hovered, pressed, expanded  ande expandedHovered.
+
+### Patches
+
+- Dropdown: fix broken implementation of controlled multi-select dropdowns
+- TSConfig: update to use preserveConstEnums so that certain builds systems don't break when importing const enums
+- Router: regex to be able to render the correct page when it encounters queries.
 
 ## 5.4.0
 Thu, 05 Oct 2017 17:03:43 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 730633f97b1d2..991f563185041 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.4.0",
+  "version": "5.5.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -26,7 +26,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=5.1.0 <6.0.0",
+    "@uifabric/example-app-base": ">=5.1.1 <6.0.0",
     "enzyme": "^2.9.1",
     "es6-promise": "^4.1.0",
     "es6-map": "^0.1.5",
@@ -43,10 +43,10 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/icons": ">=5.1.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.3.0 <6.0.0",
-    "@uifabric/styling": ">=5.2.0 <6.0.0",
-    "@uifabric/utilities": ">=5.2.0 <6.0.0",
+    "@uifabric/icons": ">=5.1.1 <6.0.0",
+    "@uifabric/merge-styles": ">=5.3.1 <6.0.0",
+    "@uifabric/styling": ">=5.2.1 <6.0.0",
+    "@uifabric/utilities": ">=5.2.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 77a8b6d090d8c..7d47246b6e819 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.2.1",
+      "tag": "@uifabric/styling_v5.2.1",
+      "date": "Fri, 06 Oct 2017 10:18:41 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "8e1dcc66cda8334653a8b5ccbde02bf6275e0b23",
+            "comment": "TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.2.0 <6.0.0` to `>=5.2.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.3.0 <6.0.0` to `>=5.3.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.2.0",
       "tag": "@uifabric/styling_v5.2.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 0366f25369041..18cee58bd4f1a 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 05 Oct 2017 17:03:43 GMT and should not be manually modified.
+This log was last generated on Fri, 06 Oct 2017 10:18:41 GMT and should not be manually modified.
+
+## 5.2.1
+Fri, 06 Oct 2017 10:18:41 GMT
+
+### Patches
+
+- TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums
 
 ## 5.2.0
 Thu, 05 Oct 2017 17:03:43 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 916006867192f..3808e3c79faa1 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.2.0",
+  "version": "5.2.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -20,8 +20,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=5.2.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.3.0 <6.0.0",
+    "@uifabric/utilities": ">=5.2.1 <6.0.0",
+    "@uifabric/merge-styles": ">=5.3.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 0c378f947bed0..de6962c14f725 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.2.1",
+      "tag": "@uifabric/utilities_v5.2.1",
+      "date": "Fri, 06 Oct 2017 10:18:41 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "8e1dcc66cda8334653a8b5ccbde02bf6275e0b23",
+            "comment": "TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums"
+          }
+        ]
+      }
+    },
     {
       "version": "5.2.0",
       "tag": "@uifabric/utilities_v5.2.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 4eef602e539bb..ba77667f1a5b6 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Thu, 05 Oct 2017 17:03:43 GMT and should not be manually modified.
+This log was last generated on Fri, 06 Oct 2017 10:18:41 GMT and should not be manually modified.
+
+## 5.2.1
+Fri, 06 Oct 2017 10:18:41 GMT
+
+### Patches
+
+- TSConfig: update to use preserveConstEnums so that certain builds s ystems don't break when importing const enums
 
 ## 5.2.0
 Thu, 05 Oct 2017 17:03:43 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 49303cae71e26..bdb48a9a7e5cb 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.2.0",
+  "version": "5.2.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/scripts/package.json b/scripts/package.json
index 64cf2e11cca18..ecb24d719b0d9 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -9,7 +9,7 @@
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@microsoft/loader-load-themed-styles": "^1.4.2",
-    "@uifabric/merge-styles": ">=5.3.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.3.1 <6.0.0",
     "autoprefixer": "^7.1.2",
     "awesome-typescript-loader": "^3.2.3",
     "chalk": "^2.1.0",

From 253d08091c117b867ad67be2d165e31920705bdc Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Fri, 6 Oct 2017 08:21:29 -0700
Subject: [PATCH 0798/1641] Update Breadcrumb per toolkit - primarily involves
 adding size prop (#2975)

* Added sizing for Breadcrumb

* Added change file

* Breadcrumb sizes case

* Removed size prop

* No need for uhf breakpoint here
---
 .../breadcrumb-toolkit_2017-09-27-21-29.json  | 11 ++++
 .../src/common/_semanticColorVariables.scss   |  6 +--
 .../src/components/Breadcrumb/Breadcrumb.scss | 52 +++++++++++++------
 .../examples/Breadcrumb.Basic.Example.tsx     |  5 +-
 4 files changed, 52 insertions(+), 22 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/breadcrumb-toolkit_2017-09-27-21-29.json

diff --git a/common/changes/office-ui-fabric-react/breadcrumb-toolkit_2017-09-27-21-29.json b/common/changes/office-ui-fabric-react/breadcrumb-toolkit_2017-09-27-21-29.json
new file mode 100644
index 0000000000000..2de2952e39141
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/breadcrumb-toolkit_2017-09-27-21-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added sizing prop for Breadcrumb per design toolkit.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/src/common/_semanticColorVariables.scss b/packages/example-app-base/src/common/_semanticColorVariables.scss
index 63b2047422cec..dcb4b670b5e69 100644
--- a/packages/example-app-base/src/common/_semanticColorVariables.scss
+++ b/packages/example-app-base/src/common/_semanticColorVariables.scss
@@ -5,7 +5,7 @@ $focusedBorderColor: $ms-color-neutralSecondary;
 $bodyBackgroundColor: $ms-color-white;
 $bodyForegroundColor: $ms-color-neutralPrimary;
 
-/* Primary item colors, used for Nav, DetailsList headers, Pivots */
+/* Primary item colors, used for Nav, DetailsList headers, Pivots, Breadcrumb */
 $unselectedBackgroundColor: $bodyBackgroundColor;
 $unselectedForegroundColor: $bodyForegroundColor;
 
@@ -24,7 +24,7 @@ $selectedForegroundColor: $ms-color-neutralPrimary;
 $selectedHoverBackgroundColor: $ms-color-neutralLighter;
 $selectedHoverForegroundColor: $ms-color-neutralDark;
 
-$selectedActiveBackgroundColor: $ms-color-neutralTertiaryAlt;
-$selectedActiveForegroundColor: $ms-color-neutralPrimary;
+$selectedActiveBackgroundColor: $ms-color-neutralQuaternaryAlt;
+$selectedActiveForegroundColor: $ms-color-neutralDark;
 
 $dividerColor: $ms-color-neutralLight;
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss
index bff86ff2d2236..50fd8f0538efc 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss
@@ -14,6 +14,27 @@ $Breadcrumb-itemMaxWidth: 160px;
 $Breadcrumb-itemMaxWidth-sm: 116px;
 $Breadcrumb-chevron-sm: 8px;
 
+// Breadcrumb size mixins
+@mixin Breadcumb-small {
+  .listItem .itemLink {
+    font-size: $ms-font-size-m;
+  }
+
+  .chevron {
+    font-size: $Breadcrumb-chevron-sm;
+  }
+}
+
+@mixin Breadcumb-large {
+  .listItem .itemLink {
+    font-size: $ms-font-size-l;
+  }
+
+  .chevron {
+    font-size: $Breadcrumb-chevron-sm;
+  }
+}
+
 .root {
   margin: 23px 0 1px;
 }
@@ -70,10 +91,20 @@ $Breadcrumb-chevron-sm: 8px;
 .overflowButton {
   font-size: $Breadcrumb-overflowButtonSize;
   height: 100%; // override button height
+
   &:hover {
     cursor: pointer;
     background-color: $ms-color-neutralLighter;
   }
+
+  &:active {
+    background-color: $selectedActiveBackgroundColor;
+    color: $selectedActiveForegroundColor;
+  }
+
+  &:active:hover {
+    background-color: $ms-color-neutralQuaternary;
+  }
 }
 
 .item {
@@ -106,16 +137,9 @@ $Breadcrumb-chevron-sm: 8px;
   outline: transparent;
 }
 
-@media screen and (max-width: $uhf-screen-max-mobile) {
+@media screen and (max-width: $ms-screen-max-md) {
   // margin: 11px 0 1px;
-
-  .listItem .itemLink {
-    font-size: $ms-font-size-l;
-  }
-
-  .chevron {
-    font-size: $ms-font-size-mi;
-  }
+  @include Breadcumb-large;
 
   .overflowButton {
     font-size: $ms-font-size-m-plus;
@@ -123,17 +147,13 @@ $Breadcrumb-chevron-sm: 8px;
 }
 
 @media screen and (max-width: $ms-screen-max-sm) {
+  @include Breadcumb-small;
+
   .listItem .itemLink {
-    font-size: $ms-font-size-m;
     max-width: $Breadcrumb-itemMaxWidth-sm;
   }
 
-  .chevron {
-    font-size: $Breadcrumb-chevron-sm;
-  }
-
   .overflowButton {
     padding: 4px 6px;
   }
-}
-
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
index 9872b95af8692..cc7efebfe991f 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
@@ -19,7 +19,7 @@ export class BreadcrumbBasicExample extends React.Component<any, any> {
   public render() {
     return (
       <div>
-        <Label className={ exampleStyles.exampleLabel }>With maxDisplayedItems set to six</Label>
+        <Label className={ exampleStyles.exampleLabel }>With no maxDisplayedItems</Label>
         <Breadcrumb
           items={ [
             { text: 'Files', 'key': 'Files', onClick: this._onBreadcrumbItemClicked },
@@ -29,11 +29,10 @@ export class BreadcrumbBasicExample extends React.Component<any, any> {
             { text: 'This is folder 4', 'key': 'f4', onClick: this._onBreadcrumbItemClicked },
             { text: 'This is folder 5', 'key': 'f5', onClick: this._onBreadcrumbItemClicked, isCurrentItem: true }
           ] }
-          maxDisplayedItems={ 6 }
           ariaLabel={ 'Website breadcrumb' }
         />
 
-        <Label className={ exampleStyles.exampleLabel }>With maxDisplayedItems set to three</Label>
+        <Label className={ exampleStyles.exampleLabel } style={ { marginTop: '24px' } }>With maxDisplayedItems set to three</Label>
         <Breadcrumb
           items={ [
             { text: 'Files', 'key': 'Files', href: '#/examples/breadcrumb', onClick: this._onBreadcrumbItemClicked },

From a7011bdfc7608455c8403d38c1cfc7639e1a55d6 Mon Sep 17 00:00:00 2001
From: MaxLustig <maxslustig@gmail.com>
Date: Fri, 6 Oct 2017 08:46:31 -0700
Subject: [PATCH 0799/1641] Vertically center checkbox in details header
 (#3032)

* Vertically center checkbox in DetailsList header

* Added rush change file

* Used align-items center
---
 .../maxlus-headerPolish_2017-10-04-22-18.json         | 11 +++++++++++
 .../src/components/DetailsList/DetailsHeader.scss     |  2 ++
 2 files changed, 13 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/maxlus-headerPolish_2017-10-04-22-18.json

diff --git a/common/changes/office-ui-fabric-react/maxlus-headerPolish_2017-10-04-22-18.json b/common/changes/office-ui-fabric-react/maxlus-headerPolish_2017-10-04-22-18.json
new file mode 100644
index 0000000000000..3830adb02a246
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/maxlus-headerPolish_2017-10-04-22-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Vertically center checkbox in DetailsList header",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "maxlus@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
index 0cd22a6c82358..25c325b272852 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
@@ -55,6 +55,8 @@ $isPaddedMargin: 24px;
     position: relative;
     padding: 0;
     margin: 0;
+    display: inline-flex;
+    align-items: center;
   }
 
   &.cellIsActionable {

From 71ff33573d03e3cdefc2ba2c5410711be6e2ee09 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Fri, 6 Oct 2017 08:48:59 -0700
Subject: [PATCH 0800/1641] Label: Convert to mergeStyles (#3049)

* Convert label to merge styles

* Reorder the classNames

* Add a test for mergeStyleSets

* Use mergeStyleSets instead of mergeStyles

* Rush change

* Use customizable to get the theme.

* Fix tslint

* Another one

* Addressing nit comment
---
 .../merge-styles-label_2017-10-05-23-56.json  | 11 ++++++
 .../merge-styles-label_2017-10-05-23-56.json  | 11 ++++++
 .../merge-styles/src/mergeStyleSets.test.ts   | 10 ++++++
 .../src/components/Label/Label.Props.ts       |  6 ++++
 .../src/components/Label/Label.classNames.ts  | 36 +++++++++++++++++++
 .../src/components/Label/Label.scss           | 33 -----------------
 .../src/components/Label/Label.tsx            | 19 ++++------
 7 files changed, 80 insertions(+), 46 deletions(-)
 create mode 100644 common/changes/@uifabric/merge-styles/merge-styles-label_2017-10-05-23-56.json
 create mode 100644 common/changes/office-ui-fabric-react/merge-styles-label_2017-10-05-23-56.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Label/Label.classNames.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Label/Label.scss

diff --git a/common/changes/@uifabric/merge-styles/merge-styles-label_2017-10-05-23-56.json b/common/changes/@uifabric/merge-styles/merge-styles-label_2017-10-05-23-56.json
new file mode 100644
index 0000000000000..3c7cfd56e9636
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/merge-styles-label_2017-10-05-23-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "Add test for autoexpand",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/merge-styles-label_2017-10-05-23-56.json b/common/changes/office-ui-fabric-react/merge-styles-label_2017-10-05-23-56.json
new file mode 100644
index 0000000000000..df1a0a72dcefb
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/merge-styles-label_2017-10-05-23-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Label: Convert sass to mergeStyles",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/merge-styles/src/mergeStyleSets.test.ts b/packages/merge-styles/src/mergeStyleSets.test.ts
index 2abf99e980b19..f295d406b6001 100644
--- a/packages/merge-styles/src/mergeStyleSets.test.ts
+++ b/packages/merge-styles/src/mergeStyleSets.test.ts
@@ -88,4 +88,14 @@ describe('mergeStyleSets', () => {
     });
   });
 
+  it('can auto expand a previously registered style', () => {
+    const styles: { root: string } = mergeStyleSets({ root: { background: 'red' } });
+    const styles2: { root: string } = mergeStyleSets({ root: [{ background: 'purple' }, styles.root] });
+
+    expect(styles.root).toEqual(styles2.root);
+
+    expect(_stylesheet.getRules()).toEqual(
+      '.root-0{background:red;}'
+    );
+  });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.Props.ts b/packages/office-ui-fabric-react/src/components/Label/Label.Props.ts
index 1940f00bd93a7..8e16ec7be7cd0 100644
--- a/packages/office-ui-fabric-react/src/components/Label/Label.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Label/Label.Props.ts
@@ -1,6 +1,7 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
+import { ITheme } from '../../Styling';
 
 export interface ILabel {
 
@@ -23,4 +24,9 @@ export interface ILabelProps extends React.LabelHTMLAttributes<HTMLLabelElement>
    * Renders the label as disabled.
    */
   disabled?: boolean;
+
+  /**
+ * Theme provided by HOC.
+ */
+  theme?: ITheme;
 }
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.classNames.ts b/packages/office-ui-fabric-react/src/components/Label/Label.classNames.ts
new file mode 100644
index 0000000000000..96f0ed736f21e
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Label/Label.classNames.ts
@@ -0,0 +1,36 @@
+import { memoizeFunction } from '../../Utilities';
+import { ITheme, FontSizes, mergeStyleSets } from '../../Styling';
+
+export interface ILabelClassNames {
+  root: string;
+}
+
+export const getLabelClassNames = memoizeFunction((theme: ITheme, className: string | undefined, disabled: boolean, required: boolean): ILabelClassNames => {
+  return mergeStyleSets({
+    root:
+    ['ms-Label',
+      {
+        color: theme.semanticColors.bodyText,
+        boxSizing: 'border-box',
+        boxShadow: 'none',
+        margin: 0,
+        display: 'block',
+        padding: '5px 0',
+        wordWrap: 'break-word',
+        overflowWrap: 'break-word',
+      },
+      disabled && {
+        color: theme.semanticColors.disabledText
+      },
+      required && {
+        selectors: {
+          '::after': {
+            content: `' *'`,
+            color: theme.semanticColors.errorText,
+            paddingRight: 12
+          }
+        }
+      },
+      className]
+  });
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.scss b/packages/office-ui-fabric-react/src/components/Label/Label.scss
deleted file mode 100644
index ca61206dc19d9..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Label/Label.scss
+++ /dev/null
@@ -1,33 +0,0 @@
-@import '../../common/common';
-
-// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
-
-//
-// Office UI Fabric
-// --------------------------------------------------
-// Form field label styles
-
-@import './LabelMixins';
-
-.root {
-  @include ms-font-m;
-  @include ms-normalize;
-  color: $ms-color-neutralPrimary;
-  box-sizing: border-box;
-  display: block;
-  padding: 5px 0;
-  word-wrap: break-word;
-  overflow-wrap: break-word;
-}
-
-.isRequired {
-  @include ms-Label-is-required;
-}
-
-.isDisabled {
-  @include ms-Label-is-disabled;
-
-  @include high-contrast {
-    color: GrayText;
-  }
-}
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.tsx b/packages/office-ui-fabric-react/src/components/Label/Label.tsx
index cb0772e58d23c..3cdd497ceaf53 100644
--- a/packages/office-ui-fabric-react/src/components/Label/Label.tsx
+++ b/packages/office-ui-fabric-react/src/components/Label/Label.tsx
@@ -1,23 +1,16 @@
 import * as React from 'react';
-import { BaseComponent, css, divProperties, getNativeProps } from '../../Utilities';
+import { BaseComponent, divProperties, getNativeProps, customizable } from '../../Utilities';
 import { ILabelProps } from './Label.Props';
-import * as stylesImport from './Label.scss';
-const styles: any = stylesImport;
+import { getLabelClassNames } from './Label.classNames';
 
-export class Label extends BaseComponent<ILabelProps, any> {
+@customizable('Label', ['theme'])
+export class Label extends BaseComponent<ILabelProps, {}> {
   public render() {
-    let { disabled, required, children, className } = this.props;
-
+    let { disabled, required, children, className, theme } = this.props;
     return (
       <label
         { ...getNativeProps(this.props, divProperties) }
-        className={ css(
-          styles.root,
-          'ms-Label',
-          className,
-          disabled && ('is-disabled ' + styles.isDisabled),
-          required && ('is-required ' + styles.isRequired)
-        ) }
+        className={ getLabelClassNames(theme!, className, !!disabled, !!required).root }
       >
         { children }
       </label>

From 9a399cc9187ec81611acec92655e3393878e28e1 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Fri, 6 Oct 2017 16:04:17 -0700
Subject: [PATCH 0801/1641] Website: Added /removed Best Practices links on
 component pages (#3057)

* Added /removed Best Practices links on componenet pages

* Added change file

* Removed comma

* Title case for best practices section
---
 .../src/pages/Components/CheckboxComponentPage.tsx    |  4 ++++
 .../src/pages/Components/ChoiceGroupComponentPage.tsx |  4 ++++
 .../src/pages/Components/ColorPickerComponentPage.tsx |  4 ----
 .../src/pages/Components/CommandBarComponentPage.tsx  |  4 ++++
 .../pages/Components/ContextualMenuComponentPage.tsx  |  4 ++++
 .../src/pages/Components/DatePickerComponentPage.tsx  |  4 ++++
 .../src/pages/Components/DetailsListComponentPage.tsx |  4 ++++
 .../src/pages/Components/DialogComponentPage.tsx      |  4 ++++
 .../pages/Components/DocumentCardComponentPage.tsx    |  4 ++++
 .../src/pages/Components/DropdownComponentPage.tsx    |  4 ++++
 .../src/pages/Components/FacepileComponentPage.tsx    |  4 ++++
 .../src/pages/Components/GroupedListComponentPage.tsx |  4 ----
 .../src/pages/Components/LabelComponentPage.tsx       |  4 ++++
 .../src/pages/Components/LinkComponentPage.tsx        |  4 ++++
 .../src/pages/Components/MessageBarComponentPage.tsx  |  4 ++++
 .../src/pages/Components/ModalComponentPage.tsx       |  4 ++++
 .../src/pages/Components/OverlayComponentPage.tsx     |  4 ++++
 .../src/pages/Components/PanelComponentPage.tsx       |  4 ++++
 .../pages/Components/PeoplePickerComponentPage.tsx    |  4 ++++
 .../src/pages/Components/PersonaComponentPage.tsx     |  4 ++++
 .../src/pages/Components/PivotComponentPage.tsx       |  4 ++++
 .../Components/ProgressIndicatorComponentPage.tsx     |  4 ++++
 .../src/pages/Components/ResizeGroupComponentPage.tsx |  4 ++++
 .../src/pages/Components/SearchBoxComponentPage.tsx   |  4 ++++
 .../src/pages/Components/SpinnerComponentPage.tsx     |  4 ++++
 .../Components/SwatchColorPickerComponentPage.tsx     |  4 ++++
 .../src/pages/Components/TextFieldComponentPage.tsx   |  6 +++++-
 .../src/pages/Components/ToggleComponentPage.tsx      |  4 ++++
 .../best-practices-links_2017-10-06-16-59.json        | 11 +++++++++++
 .../src/components/ComponentPage/ComponentPage.tsx    |  2 +-
 30 files changed, 117 insertions(+), 10 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/best-practices-links_2017-10-06-16-59.json

diff --git a/apps/fabric-website/src/pages/Components/CheckboxComponentPage.tsx b/apps/fabric-website/src/pages/Components/CheckboxComponentPage.tsx
index d99002a05bcaf..0a00ae64e12c5 100644
--- a/apps/fabric-website/src/pages/Components/CheckboxComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/CheckboxComponentPage.tsx
@@ -16,6 +16,10 @@ export class CheckboxComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/ChoiceGroupComponentPage.tsx b/apps/fabric-website/src/pages/Components/ChoiceGroupComponentPage.tsx
index 723b7e279c686..f00d02b324282 100644
--- a/apps/fabric-website/src/pages/Components/ChoiceGroupComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ChoiceGroupComponentPage.tsx
@@ -16,6 +16,10 @@ export class ChoiceGroupComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/ColorPickerComponentPage.tsx b/apps/fabric-website/src/pages/Components/ColorPickerComponentPage.tsx
index 20db2063b9096..4c9bd0ba38106 100644
--- a/apps/fabric-website/src/pages/Components/ColorPickerComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ColorPickerComponentPage.tsx
@@ -16,10 +16,6 @@ export class ColorPickerComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
-                {
-                  'text': 'Best Practices',
-                  'location': 'Best Practices'
-                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/CommandBarComponentPage.tsx b/apps/fabric-website/src/pages/Components/CommandBarComponentPage.tsx
index e94c819062b61..c56ae3087a988 100644
--- a/apps/fabric-website/src/pages/Components/CommandBarComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/CommandBarComponentPage.tsx
@@ -16,6 +16,10 @@ export class CommandBarComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/ContextualMenuComponentPage.tsx b/apps/fabric-website/src/pages/Components/ContextualMenuComponentPage.tsx
index 2a005a6a0dfd2..75d5f8f2f4044 100644
--- a/apps/fabric-website/src/pages/Components/ContextualMenuComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ContextualMenuComponentPage.tsx
@@ -16,6 +16,10 @@ export class ContextualMenuComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/DatePickerComponentPage.tsx b/apps/fabric-website/src/pages/Components/DatePickerComponentPage.tsx
index 34351c3d78f9f..5a9f09b8f3247 100644
--- a/apps/fabric-website/src/pages/Components/DatePickerComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/DatePickerComponentPage.tsx
@@ -16,6 +16,10 @@ export class DatePickerComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/DetailsListComponentPage.tsx b/apps/fabric-website/src/pages/Components/DetailsListComponentPage.tsx
index f2162f1e73466..7ede8a0ac6516 100644
--- a/apps/fabric-website/src/pages/Components/DetailsListComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/DetailsListComponentPage.tsx
@@ -16,6 +16,10 @@ export class DetailsListComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/DialogComponentPage.tsx b/apps/fabric-website/src/pages/Components/DialogComponentPage.tsx
index 0d963f4793c04..dd0660f25c176 100644
--- a/apps/fabric-website/src/pages/Components/DialogComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/DialogComponentPage.tsx
@@ -16,6 +16,10 @@ export class DialogComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/DocumentCardComponentPage.tsx b/apps/fabric-website/src/pages/Components/DocumentCardComponentPage.tsx
index f07d9a8419edb..6371bdc573d00 100644
--- a/apps/fabric-website/src/pages/Components/DocumentCardComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/DocumentCardComponentPage.tsx
@@ -16,6 +16,10 @@ export class DocumentCardComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/DropdownComponentPage.tsx b/apps/fabric-website/src/pages/Components/DropdownComponentPage.tsx
index dfb842f62a74c..96ad4d5db6628 100644
--- a/apps/fabric-website/src/pages/Components/DropdownComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/DropdownComponentPage.tsx
@@ -16,6 +16,10 @@ export class DropdownComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/FacepileComponentPage.tsx b/apps/fabric-website/src/pages/Components/FacepileComponentPage.tsx
index a66ac2fd56f14..9f848c4b5be6d 100644
--- a/apps/fabric-website/src/pages/Components/FacepileComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/FacepileComponentPage.tsx
@@ -16,6 +16,10 @@ export class FacepileComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/GroupedListComponentPage.tsx b/apps/fabric-website/src/pages/Components/GroupedListComponentPage.tsx
index c1b30ecae7394..9208478fa3ef9 100644
--- a/apps/fabric-website/src/pages/Components/GroupedListComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/GroupedListComponentPage.tsx
@@ -16,10 +16,6 @@ export class GroupedListComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
-                {
-                  'text': 'Best Practices',
-                  'location': 'Best Practices'
-                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/LabelComponentPage.tsx b/apps/fabric-website/src/pages/Components/LabelComponentPage.tsx
index bcd515ffc223f..f258b515f10b7 100644
--- a/apps/fabric-website/src/pages/Components/LabelComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/LabelComponentPage.tsx
@@ -16,6 +16,10 @@ export class LabelComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/LinkComponentPage.tsx b/apps/fabric-website/src/pages/Components/LinkComponentPage.tsx
index a2cc475342a87..18c969976a7d7 100644
--- a/apps/fabric-website/src/pages/Components/LinkComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/LinkComponentPage.tsx
@@ -16,6 +16,10 @@ export class LinkComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/MessageBarComponentPage.tsx b/apps/fabric-website/src/pages/Components/MessageBarComponentPage.tsx
index f46b89f877fbe..36cd649cde689 100644
--- a/apps/fabric-website/src/pages/Components/MessageBarComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/MessageBarComponentPage.tsx
@@ -16,6 +16,10 @@ export class MessageBarComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/ModalComponentPage.tsx b/apps/fabric-website/src/pages/Components/ModalComponentPage.tsx
index 57a01aaac0bc9..8af83e7c5e094 100644
--- a/apps/fabric-website/src/pages/Components/ModalComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ModalComponentPage.tsx
@@ -16,6 +16,10 @@ export class ModalComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/OverlayComponentPage.tsx b/apps/fabric-website/src/pages/Components/OverlayComponentPage.tsx
index 50c4e675ba21a..ed3934c108ffa 100644
--- a/apps/fabric-website/src/pages/Components/OverlayComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/OverlayComponentPage.tsx
@@ -16,6 +16,10 @@ export class OverlayComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/PanelComponentPage.tsx b/apps/fabric-website/src/pages/Components/PanelComponentPage.tsx
index 39525ce749d6e..8089c52e3ac33 100644
--- a/apps/fabric-website/src/pages/Components/PanelComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/PanelComponentPage.tsx
@@ -16,6 +16,10 @@ export class PanelComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/PeoplePickerComponentPage.tsx b/apps/fabric-website/src/pages/Components/PeoplePickerComponentPage.tsx
index f44ffae296bba..0ca864017c362 100644
--- a/apps/fabric-website/src/pages/Components/PeoplePickerComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/PeoplePickerComponentPage.tsx
@@ -16,6 +16,10 @@ export class PeoplePickerComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/PersonaComponentPage.tsx b/apps/fabric-website/src/pages/Components/PersonaComponentPage.tsx
index d4f6fc356a1ad..8ec50017215dd 100644
--- a/apps/fabric-website/src/pages/Components/PersonaComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/PersonaComponentPage.tsx
@@ -16,6 +16,10 @@ export class PersonaComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/PivotComponentPage.tsx b/apps/fabric-website/src/pages/Components/PivotComponentPage.tsx
index e8398762fffd2..82620b7ec12b9 100644
--- a/apps/fabric-website/src/pages/Components/PivotComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/PivotComponentPage.tsx
@@ -16,6 +16,10 @@ export class PivotComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/ProgressIndicatorComponentPage.tsx b/apps/fabric-website/src/pages/Components/ProgressIndicatorComponentPage.tsx
index ea171cf34ada6..689183f66f06e 100644
--- a/apps/fabric-website/src/pages/Components/ProgressIndicatorComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ProgressIndicatorComponentPage.tsx
@@ -16,6 +16,10 @@ export class ProgressIndicatorComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/ResizeGroupComponentPage.tsx b/apps/fabric-website/src/pages/Components/ResizeGroupComponentPage.tsx
index b42ff83880eb2..5946c7507bf6c 100644
--- a/apps/fabric-website/src/pages/Components/ResizeGroupComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ResizeGroupComponentPage.tsx
@@ -16,6 +16,10 @@ export class ResizeGroupComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/SearchBoxComponentPage.tsx b/apps/fabric-website/src/pages/Components/SearchBoxComponentPage.tsx
index d061fa96467dc..54a864ff727d4 100644
--- a/apps/fabric-website/src/pages/Components/SearchBoxComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/SearchBoxComponentPage.tsx
@@ -16,6 +16,10 @@ export class SearchBoxComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/SpinnerComponentPage.tsx b/apps/fabric-website/src/pages/Components/SpinnerComponentPage.tsx
index f49c86830b5a3..d87f8483ef9bb 100644
--- a/apps/fabric-website/src/pages/Components/SpinnerComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/SpinnerComponentPage.tsx
@@ -16,6 +16,10 @@ export class SpinnerComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/SwatchColorPickerComponentPage.tsx b/apps/fabric-website/src/pages/Components/SwatchColorPickerComponentPage.tsx
index 5f8df73804bc6..2d031b9cfa5a9 100644
--- a/apps/fabric-website/src/pages/Components/SwatchColorPickerComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/SwatchColorPickerComponentPage.tsx
@@ -16,6 +16,10 @@ export class SwatchColorPickerComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/apps/fabric-website/src/pages/Components/TextFieldComponentPage.tsx b/apps/fabric-website/src/pages/Components/TextFieldComponentPage.tsx
index 3a6667201f028..f4efe3baecd69 100644
--- a/apps/fabric-website/src/pages/Components/TextFieldComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/TextFieldComponentPage.tsx
@@ -16,6 +16,10 @@ export class TextFieldComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
@@ -31,4 +35,4 @@ export class TextFieldComponentPage extends React.Component<any, any> {
       </div>
     );
   }
-}
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/pages/Components/ToggleComponentPage.tsx b/apps/fabric-website/src/pages/Components/ToggleComponentPage.tsx
index f3467d4092592..cb4d0cefa8ef2 100644
--- a/apps/fabric-website/src/pages/Components/ToggleComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ToggleComponentPage.tsx
@@ -16,6 +16,10 @@ export class ToggleComponentPage extends React.Component<any, any> {
                   'text': 'Overview',
                   'location': 'Overview'
                 },
+                {
+                  'text': 'Best Practices',
+                  'location': 'Best Practices'
+                },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
diff --git a/common/changes/@uifabric/fabric-website/best-practices-links_2017-10-06-16-59.json b/common/changes/@uifabric/fabric-website/best-practices-links_2017-10-06-16-59.json
new file mode 100644
index 0000000000000..d864faa57beda
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/best-practices-links_2017-10-06-16-59.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Added/removed Best Practices links for component pages that had/didn't have a Best Practices section.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx b/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
index 1d0fd41cc339c..a7f7937d1a74c 100644
--- a/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
+++ b/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
@@ -160,7 +160,7 @@ export class ComponentPage extends React.Component<IComponentPageProps, {}> {
     if (this.props.bestPractices) {
       dosAndDonts.push(
         <div className='ComponentPage-usage' id='Best Practices' key='best-practices'>
-          <h2 className='ComponentPage-subHeading'>Best practices</h2>
+          <h2 className='ComponentPage-subHeading'>Best Practices</h2>
           { this.props.bestPractices }
         </div>
       );

From de4c2b13ef50e485209deff44890cc23d8a3db86 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Fri, 6 Oct 2017 17:21:56 -0700
Subject: [PATCH 0802/1641] Website: Updated themeLight color - fixed typo
 (#3065)

* change 3 to e

* Added change file
---
 apps/fabric-website/src/data/colors-theme.json        |  2 +-
 .../update-themeLIght_2017-10-06-23-27.json           | 11 +++++++++++
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/fabric-website/update-themeLIght_2017-10-06-23-27.json

diff --git a/apps/fabric-website/src/data/colors-theme.json b/apps/fabric-website/src/data/colors-theme.json
index 36a66766846fe..63f2dca5836bf 100644
--- a/apps/fabric-website/src/data/colors-theme.json
+++ b/apps/fabric-website/src/data/colors-theme.json
@@ -31,7 +31,7 @@
   },
   {
     "name": "themeLight",
-    "value": "#c730f4",
+    "value": "#c7e0f4",
     "labelColorClass": "ms-fontColor-black"
   },
   {
diff --git a/common/changes/@uifabric/fabric-website/update-themeLIght_2017-10-06-23-27.json b/common/changes/@uifabric/fabric-website/update-themeLIght_2017-10-06-23-27.json
new file mode 100644
index 0000000000000..01165fa12cf90
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/update-themeLIght_2017-10-06-23-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Updated themeLight color - typo",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From 275c55a1aacbed4ba70b6c84330c731194ecb49e Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Fri, 6 Oct 2017 17:58:42 -0700
Subject: [PATCH 0803/1641] Positioning: Fix improper beak placement with
 events (#3062)

* Fix an issue where the beak would be misaligned when positioning to an event

* Adding change file

* Add comment and remove unecessary line
---
 .../positioning-eventfix_2017-10-06-20-21.json        | 11 +++++++++++
 .../src/utilities/positioning.ts                      | 11 +++++------
 2 files changed, 16 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/positioning-eventfix_2017-10-06-20-21.json

diff --git a/common/changes/office-ui-fabric-react/positioning-eventfix_2017-10-06-20-21.json b/common/changes/office-ui-fabric-react/positioning-eventfix_2017-10-06-20-21.json
new file mode 100644
index 0000000000000..2859872155dd9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/positioning-eventfix_2017-10-06-20-21.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Positioning: Fix an issue where beak would appear misaligned if an event was passed in",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning.ts b/packages/office-ui-fabric-react/src/utilities/positioning.ts
index 5a0316fa28047..86fd644cc4331 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning.ts
@@ -573,18 +573,17 @@ export module positioningFunctions {
     callout: ICallout,
     target: Rectangle,
     alignmentEdge?: RectangleEdge) {
-
+    /** Note about beak positioning: The actual beak width only matters for getting the gap between the callout and target, it does not impact the beak placement within the callout. For example example, if the beakWidth is 8, then the actual beakWidth is sqrroot(8^2 + 8^2) = 11.31x11.31. So the callout will need to be an extra 3 pixels away from its target. While the beak is being positioned in the callout it still acts as though it were 8x8.*/
     const { firstEdge, secondEdge } = _getFlankingEdges(callout.targetEdge);
     const beakTargetPoint = _getCenterValue(target, callout.targetEdge);
-    const actualBeakWidth = _calculateActualBeakWidthInPixels(beakWidth);
     // The "host" callout that we will use to help position the beak.
     const actualCallout = new Rectangle(0, callout.calloutRectangle.width, 0, callout.calloutRectangle.height);
 
     const calloutBounds = new Rectangle(
-      actualBeakWidth / 2,
-      callout.calloutRectangle.width - actualBeakWidth / 2,
-      actualBeakWidth / 2,
-      callout.calloutRectangle.height - actualBeakWidth / 2
+      beakWidth / 2,
+      callout.calloutRectangle.width - beakWidth / 2,
+      beakWidth / 2,
+      callout.calloutRectangle.height - beakWidth / 2
     );
 
     let beakPositon: Rectangle = new Rectangle(0, beakWidth, 0, beakWidth);

From 0b9a00449959d037f4f0992419a8d8ef8c20c019 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 9 Oct 2017 10:08:10 +0000
Subject: [PATCH 0804/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 24 +++++++++++++
 apps/fabric-website/CHANGELOG.md              | 10 +++++-
 apps/fabric-website/package.json              |  4 +--
 ...best-practices-links_2017-10-06-16-59.json | 11 ------
 .../update-themeLIght_2017-10-06-23-27.json   | 11 ------
 .../merge-styles-label_2017-10-05-23-56.json  | 11 ------
 .../breadcrumb-toolkit_2017-09-27-21-29.json  | 11 ------
 .../maxlus-headerPolish_2017-10-04-22-18.json | 11 ------
 .../merge-styles-label_2017-10-05-23-56.json  | 11 ------
 ...positioning-eventfix_2017-10-06-20-21.json | 11 ------
 packages/merge-styles/CHANGELOG.json          | 14 ++++++++
 packages/merge-styles/CHANGELOG.md            |  9 ++++-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 34 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 12 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/package.json                 |  2 +-
 scripts/package.json                          |  2 +-
 18 files changed, 107 insertions(+), 87 deletions(-)
 delete mode 100644 common/changes/@uifabric/fabric-website/best-practices-links_2017-10-06-16-59.json
 delete mode 100644 common/changes/@uifabric/fabric-website/update-themeLIght_2017-10-06-23-27.json
 delete mode 100644 common/changes/@uifabric/merge-styles/merge-styles-label_2017-10-05-23-56.json
 delete mode 100644 common/changes/office-ui-fabric-react/breadcrumb-toolkit_2017-09-27-21-29.json
 delete mode 100644 common/changes/office-ui-fabric-react/maxlus-headerPolish_2017-10-04-22-18.json
 delete mode 100644 common/changes/office-ui-fabric-react/merge-styles-label_2017-10-05-23-56.json
 delete mode 100644 common/changes/office-ui-fabric-react/positioning-eventfix_2017-10-06-20-21.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 0e9ca453bcd95..163d9d104faca 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.0.9",
+      "tag": "@uifabric/fabric-website_v5.0.9",
+      "date": "Mon, 09 Oct 2017 10:08:09 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "9a399cc9187ec81611acec92655e3393878e28e1",
+            "comment": "Added/removed Best Practices links for component pages that had/didn't have a Best Practices section."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "de4c2b13ef50e485209deff44890cc23d8a3db86",
+            "comment": "Updated themeLight color - typo"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.5.0 <6.0.0` to `>=5.5.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.8",
       "tag": "@uifabric/fabric-website_v5.0.8",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 26ad4933431d8..14af433dc1b80 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Fri, 06 Oct 2017 10:18:41 GMT and should not be manually modified.
+This log was last generated on Mon, 09 Oct 2017 10:08:09 GMT and should not be manually modified.
+
+## 5.0.9
+Mon, 09 Oct 2017 10:08:09 GMT
+
+### Patches
+
+- Added/removed Best Practices links for component pages that had/didn't have a Best Practices section.
+- Updated themeLight color - typo
 
 ## 5.0.8
 Fri, 06 Oct 2017 10:18:41 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 1ced6917e43d6..4517c97c6a400 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.0.8",
+  "version": "5.0.9",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.1.1 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.5.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.5.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/best-practices-links_2017-10-06-16-59.json b/common/changes/@uifabric/fabric-website/best-practices-links_2017-10-06-16-59.json
deleted file mode 100644
index d864faa57beda..0000000000000
--- a/common/changes/@uifabric/fabric-website/best-practices-links_2017-10-06-16-59.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Added/removed Best Practices links for component pages that had/didn't have a Best Practices section.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/update-themeLIght_2017-10-06-23-27.json b/common/changes/@uifabric/fabric-website/update-themeLIght_2017-10-06-23-27.json
deleted file mode 100644
index 01165fa12cf90..0000000000000
--- a/common/changes/@uifabric/fabric-website/update-themeLIght_2017-10-06-23-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Updated themeLight color - typo",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/merge-styles-label_2017-10-05-23-56.json b/common/changes/@uifabric/merge-styles/merge-styles-label_2017-10-05-23-56.json
deleted file mode 100644
index 3c7cfd56e9636..0000000000000
--- a/common/changes/@uifabric/merge-styles/merge-styles-label_2017-10-05-23-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "Add test for autoexpand",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/breadcrumb-toolkit_2017-09-27-21-29.json b/common/changes/office-ui-fabric-react/breadcrumb-toolkit_2017-09-27-21-29.json
deleted file mode 100644
index 2de2952e39141..0000000000000
--- a/common/changes/office-ui-fabric-react/breadcrumb-toolkit_2017-09-27-21-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added sizing prop for Breadcrumb per design toolkit.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/maxlus-headerPolish_2017-10-04-22-18.json b/common/changes/office-ui-fabric-react/maxlus-headerPolish_2017-10-04-22-18.json
deleted file mode 100644
index 3830adb02a246..0000000000000
--- a/common/changes/office-ui-fabric-react/maxlus-headerPolish_2017-10-04-22-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Vertically center checkbox in DetailsList header",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "maxlus@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/merge-styles-label_2017-10-05-23-56.json b/common/changes/office-ui-fabric-react/merge-styles-label_2017-10-05-23-56.json
deleted file mode 100644
index df1a0a72dcefb..0000000000000
--- a/common/changes/office-ui-fabric-react/merge-styles-label_2017-10-05-23-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Label: Convert sass to mergeStyles",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/positioning-eventfix_2017-10-06-20-21.json b/common/changes/office-ui-fabric-react/positioning-eventfix_2017-10-06-20-21.json
deleted file mode 100644
index 2859872155dd9..0000000000000
--- a/common/changes/office-ui-fabric-react/positioning-eventfix_2017-10-06-20-21.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Positioning: Fix an issue where beak would appear misaligned if an event was passed in",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index b418230c313bd..c679963ee6cba 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.3.2",
+      "tag": "@uifabric/merge-styles_v5.3.2",
+      "date": "Mon, 09 Oct 2017 10:08:09 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "71ff33573d03e3cdefc2ba2c5410711be6e2ee09",
+            "comment": "Add test for autoexpand"
+          }
+        ]
+      }
+    },
     {
       "version": "5.3.1",
       "tag": "@uifabric/merge-styles_v5.3.1",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index 167c46fa7ddf2..87f38849b3225 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Fri, 06 Oct 2017 10:18:41 GMT and should not be manually modified.
+This log was last generated on Mon, 09 Oct 2017 10:08:09 GMT and should not be manually modified.
+
+## 5.3.2
+Mon, 09 Oct 2017 10:08:09 GMT
+
+### Patches
+
+- Add test for autoexpand
 
 ## 5.3.1
 Fri, 06 Oct 2017 10:18:41 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index fe0cca2bd7ee9..3bd0e941fa435 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.3.1",
+  "version": "5.3.2",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index e48561527d6ff..68f3dabd987a8 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,40 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.5.1",
+      "tag": "office-ui-fabric-react_v5.5.1",
+      "date": "Mon, 09 Oct 2017 10:08:09 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "253d08091c117b867ad67be2d165e31920705bdc",
+            "comment": "Added sizing prop for Breadcrumb per design toolkit."
+          },
+          {
+            "author": "MaxLustig <maxslustig@gmail.com>",
+            "commit": "a7011bdfc7608455c8403d38c1cfc7639e1a55d6",
+            "comment": "Vertically center checkbox in DetailsList header"
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "71ff33573d03e3cdefc2ba2c5410711be6e2ee09",
+            "comment": "Label: Convert sass to mergeStyles"
+          },
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "275c55a1aacbed4ba70b6c84330c731194ecb49e",
+            "comment": "Positioning: Fix an issue where beak would appear misaligned if an event was passed in"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.3.1 <6.0.0` to `>=5.3.2 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.5.0",
       "tag": "office-ui-fabric-react_v5.5.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index aa9a706260667..10e76030d5407 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,16 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 06 Oct 2017 10:18:41 GMT and should not be manually modified.
+This log was last generated on Mon, 09 Oct 2017 10:08:09 GMT and should not be manually modified.
+
+## 5.5.1
+Mon, 09 Oct 2017 10:08:09 GMT
+
+### Patches
+
+- Added sizing prop for Breadcrumb per design toolkit.
+- Vertically center checkbox in DetailsList header
+- Label: Convert sass to mergeStyles
+- Positioning: Fix an issue where beak would appear misaligned if an event was passed in
 
 ## 5.5.0
 Fri, 06 Oct 2017 10:18:41 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 991f563185041..9f9836225b4bd 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.5.0",
+  "version": "5.5.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.1.1 <6.0.0",
-    "@uifabric/merge-styles": ">=5.3.1 <6.0.0",
+    "@uifabric/merge-styles": ">=5.3.2 <6.0.0",
     "@uifabric/styling": ">=5.2.1 <6.0.0",
     "@uifabric/utilities": ">=5.2.1 <6.0.0",
     "prop-types": "^15.5.10",
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 3808e3c79faa1..1f9a87858a910 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -21,7 +21,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/utilities": ">=5.2.1 <6.0.0",
-    "@uifabric/merge-styles": ">=5.3.1 <6.0.0",
+    "@uifabric/merge-styles": ">=5.3.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/scripts/package.json b/scripts/package.json
index ecb24d719b0d9..7663df52e1953 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -9,7 +9,7 @@
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@microsoft/loader-load-themed-styles": "^1.4.2",
-    "@uifabric/merge-styles": ">=5.3.1 <6.0.0",
+    "@uifabric/merge-styles": ">=5.3.2 <6.0.0",
     "autoprefixer": "^7.1.2",
     "awesome-typescript-loader": "^3.2.3",
     "chalk": "^2.1.0",

From 89bbe88b2775fb48ae04631b135bdfbbc9806a5f Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Mon, 9 Oct 2017 09:53:54 -0700
Subject: [PATCH 0805/1641] New MessageBarButton component with its own state
 styles that match the toolkit (#2985)

* New MessageBarButton component with its own state styles

* Added change file
---
 .../messageBar-toolkit_2017-09-28-23-13.json  | 11 ++++++
 .../MessageBarButton.styles.ts                | 37 +++++++++++++++++++
 .../MessageBarButton/MessageBarButton.tsx     | 21 +++++++++++
 3 files changed, 69 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/messageBar-toolkit_2017-09-28-23-13.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.styles.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.tsx

diff --git a/common/changes/office-ui-fabric-react/messageBar-toolkit_2017-09-28-23-13.json b/common/changes/office-ui-fabric-react/messageBar-toolkit_2017-09-28-23-13.json
new file mode 100644
index 0000000000000..aef2d7e67c351
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/messageBar-toolkit_2017-09-28-23-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "New MessageBarButton component to allow for the unique state styles need in MessageBar.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.styles.ts
new file mode 100644
index 0000000000000..11d3855f41ca6
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.styles.ts
@@ -0,0 +1,37 @@
+import { IButtonStyles } from '../Button.Props';
+import {
+  ITheme,
+  concatStyleSets
+} from '../../../Styling';
+import { memoizeFunction } from '../../../Utilities';
+import {
+  getStyles as getBaseButtonStyles
+} from '../BaseButton.styles';
+
+export const getStyles = memoizeFunction((
+  theme: ITheme,
+  customStyles?: IButtonStyles,
+  focusInset?: string,
+  focusColor?: string
+): IButtonStyles => {
+  let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
+  let messageBarButtonStyles: IButtonStyles = {
+    root: {
+      backgroundColor: theme.palette.neutralQuaternaryAlt,
+      color: theme.palette.neutralPrimary
+    },
+
+    rootHovered: {
+      backgroundColor: theme.palette.neutralTertiaryAlt,
+      color: theme.palette.neutralDark
+    },
+
+    rootPressed: {
+      backgroundColor: theme.palette.neutralTertiary,
+      color: theme.palette.neutralDark
+    }
+
+  };
+
+  return concatStyleSets(baseButtonStyles, messageBarButtonStyles, customStyles)!;
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.tsx b/packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.tsx
new file mode 100644
index 0000000000000..6f4de67f7653a
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.tsx
@@ -0,0 +1,21 @@
+import * as React from 'react';
+import { DefaultButton } from '../DefaultButton/DefaultButton';
+import { BaseComponent, customizable, nullRender } from '../../../Utilities';
+import { IButtonProps } from '../Button.Props';
+import { getStyles } from './MessageBarButton.styles';
+
+@customizable('MessageBarButton', ['theme'])
+export class MessageBarButton extends BaseComponent<IButtonProps, {}> {
+
+  public render() {
+    let { styles, theme } = this.props;
+
+    return (
+      <DefaultButton
+        { ...this.props }
+        styles={ getStyles(theme!, styles) }
+        onRenderDescription={ nullRender }
+      />
+    );
+  }
+}
\ No newline at end of file

From eff535d1b0d13a3fa4d1ed39064b2e01511d5678 Mon Sep 17 00:00:00 2001
From: Michael Loughry <miclo@microsoft.com>
Date: Mon, 9 Oct 2017 10:15:45 -0700
Subject: [PATCH 0806/1641] Fix typo causing an exception in the controlled
 Dropdown example (#3069)

---
 .../src/components/Dropdown/examples/Dropdown.Basic.Example.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
index 290564e782e83..33fc60c1e12ff 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
@@ -168,7 +168,7 @@ export class DropdownBasicExample extends React.Component<any, any> {
   @autobind
   public changeState(item: IDropdownOption) {
     console.log('here is the things updating...' + item.key + ' ' + item.text + ' ' + item.selected);
-    this.setState({ selectedItems: item });
+    this.setState({ selectedItem: item });
   }
 
   @autobind

From 5ed121b0063871101decc50baf9e1c920e041155 Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Mon, 9 Oct 2017 16:50:51 -0500
Subject: [PATCH 0807/1641] ContextualMenu: Move ContextualMenu scss to
 JavaScript styling (#3000)

* Add glamor to ContextualMenu component

* Add styles file to ContextualMenu component

* Apply expanded css rule to menu item

* Fix focus background issue in menu item

* Fix merge conflict after fetch

* Fix hover problem after 5.0 update

* Create private method to get iconProps

* Delete ContextualMenu.scss file

* Add comments to contextualmenustyles props

* Add npm run change files

* Remove as string from classnames and uneeded typecasting

* Remove dependency to I*Styles and add get*classnames prop

* Add plural to styles prop

* Add high contrast styles to menu items

* Add border color to high contrast

* Make classnames in ContextualMenu optional

* Change from mergeStyles to mergeStyleSets

* Pull contextual menu branch

* use mergeStyleSets

* Make classNames required

* remove unused theme

* Formatting getItemClassNames

* Change menuSelectedText to bodySelectedTest

* Fix rendering focus diff issue

* Fix submenu icon bug

* Make container classname required

* Fix nit issue with subMenuClassName

* Fix icon color regression

* Move classname parameter in mergestylesets and move divider classname to item classnames to get correct classname

* Remove unused divider prop for contextualmenuclassnames

* Remove unused style divider from contextualmenustyles

* Add high contrast capability for known icons

* Add comment for divider classname
---
 ...malozano-glamorMenus_2017-10-02-20-33.json |  11 +
 ...malozano-glamorMenus_2017-10-02-20-33.json |  11 +
 .../ContextualMenu/ContextualMenu.Props.ts    |  78 +++++++
 .../ContextualMenu.classNames.ts              | 130 +++++++++--
 .../ContextualMenu/ContextualMenu.scss        | 174 ---------------
 .../ContextualMenu/ContextualMenu.styles.ts   | 203 ++++++++++++++++++
 .../ContextualMenu/ContextualMenu.tsx         | 137 +++++++-----
 .../styling/src/interfaces/ISemanticColors.ts |   5 +
 packages/styling/src/styles/theme.ts          |   1 +
 9 files changed, 504 insertions(+), 246 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/malozano-glamorMenus_2017-10-02-20-33.json
 create mode 100644 common/changes/office-ui-fabric-react/malozano-glamorMenus_2017-10-02-20-33.json
 delete mode 100644 packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts

diff --git a/common/changes/@uifabric/styling/malozano-glamorMenus_2017-10-02-20-33.json b/common/changes/@uifabric/styling/malozano-glamorMenus_2017-10-02-20-33.json
new file mode 100644
index 0000000000000..b4d40d18fe890
--- /dev/null
+++ b/common/changes/@uifabric/styling/malozano-glamorMenus_2017-10-02-20-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "\"Add menuSelectedText to theme and semanticColors\"",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/malozano-glamorMenus_2017-10-02-20-33.json b/common/changes/office-ui-fabric-react/malozano-glamorMenus_2017-10-02-20-33.json
new file mode 100644
index 0000000000000..2ff6c7a53c82b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-glamorMenus_2017-10-02-20-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "\" Move ContextualMenu component to Glamor\"",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
index adfc9bc1d99c6..580114d5ab3bd 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
@@ -5,12 +5,14 @@ import { FocusZoneDirection } from '../../FocusZone';
 import { IIconProps } from '../Icon/Icon.Props';
 import { ICalloutProps } from '../../Callout';
 import { ITheme, IStyle } from '../../Styling';
+import { IButtonStyles } from '../../Button';
 import {
   IPoint,
   IRectangle,
   IRenderFunction
 } from '../../Utilities';
 import { IWithResponsiveModeState } from '../../utilities/decorators/withResponsiveMode';
+import { IContextualMenuClassNames, IMenuItemClassNames } from './ContextualMenu.classNames';
 export { DirectionalHint } from '../../common/DirectionalHint';
 
 export enum ContextualMenuItemType {
@@ -194,6 +196,29 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
    */
   theme?: ITheme;
 
+  /**
+   * Method to provide the classnames to style the contextual menu. Default value is the getMenuClassnames func
+   * defined in ContextualMenu.classnames.
+   * @default getContextualMenuClassNames
+   */
+  getMenuClassNames?: (theme: ITheme, className: string) => IContextualMenuClassNames;
+
+  /**
+  * Method to provide the classnames to style the individual items inside a menu. Default value is the getItemClassnames func
+  * defined in ContextualMenu.classnames.
+  * @default getItemClassNames
+  */
+  getItemClassNames?: (theme: ITheme,
+    disabled: boolean,
+    expanded: boolean,
+    checked: boolean,
+    isAnchorLink: boolean,
+    knownIcon: boolean,
+    itemClassname: string,
+    dividerClassName: string,
+    iconClassname: string,
+    subMenuClassname: string) => IMenuItemClassNames;
+
   /** Method to call when trying to render a submenu. */
   onRenderSubMenu?: IRenderFunction<IContextualMenuProps>;
 }
@@ -375,9 +400,62 @@ export interface IContextualMenuSection extends React.Props<ContextualMenu> {
   bottomDivider?: boolean;
 }
 
+export interface IMenuItemStyles extends IButtonStyles {
+  /**
+   * Styles for a menu item that is an anchor link.
+   */
+  item: IStyle;
+
+  /**
+   * Styles for the content inside the button/link of the menuItem.
+   */
+  linkContent: IStyle;
+
+  /**
+   * Styles for a menu item that is an anchor link.
+   */
+  anchorLink: IStyle;
+
+  /**
+   * Default icon color style for known icons.
+   */
+  iconColor: IStyle;
+
+  /**
+   * Styles for the submenu icon of a menu item.
+   */
+  subMenuIcon: IStyle;
+
+  /**
+  * Styles for a divider item of a ConextualMenu.
+  */
+  divider: IStyle;
+}
+
 export interface IContextualMenuStyles {
+
   /**
    * Style override for the contextual menu title.
    */
   title: IStyle;
+
+  /**
+   * Style for the container which parents all menu items.
+   */
+  container: IStyle;
+
+  /**
+   * Base styles for the root element of all ContextualMenus.
+   */
+  root: IStyle;
+
+  /**
+   * Styles for the header item of a ContextualMenu
+   */
+  header: IStyle;
+
+  /**
+   * Styles for the list that contains all menuItems.
+   */
+  list: IStyle;
 }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
index e056f7f4ad8be..f00b2801ce943 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
@@ -1,28 +1,124 @@
 import { memoizeFunction } from '../../Utilities';
-import { mergeStyleSets, ITheme } from '../../Styling';
-import { IContextualMenuStyles } from './ContextualMenu.Props';
-
+import { ITheme, mergeStyleSets } from '../../Styling';
+import { IContextualMenuStyles, IMenuItemStyles } from './ContextualMenu.Props';
+import { getStyles as getContextualMenuStyles, getMenuItemStyles } from './ContextualMenu.styles';
 export interface IContextualMenuClassNames {
-  title?: string;
+  container: string;
+  root: string;
+  list: string;
+  header: string;
+  title: string;
+}
+
+export interface IMenuItemClassNames {
+  item: string;
+  divider: string;
+  root: string;
+  linkContent: string;
+  icon: string;
+  subMenuIcon: string;
+  label: string;
 }
 
-export const getClassNames = memoizeFunction((
-  styles: IContextualMenuStyles,
+export const getContextualMenuClassNames = memoizeFunction((
   theme: ITheme,
+  className: string
 ): IContextualMenuClassNames => {
 
-  styles = styles || {};
+  const styles = getContextualMenuStyles(theme);
 
   return mergeStyleSets({
-    title: [{
-      fontSize: '16px',
-      paddingRight: '14px',
-      paddingLeft: '14px',
-      paddingBottom: '5px',
-      paddingTop: '5px',
-      backgroundColor: theme.palette.neutralLight
-    },
-    styles.title
-    ]
+    container: [
+      'ms-ContextualMenu-container',
+      styles.container,
+      className,
+    ],
+    root: [
+      'ms-ContextualMenu is-open',
+      styles.root
+    ],
+    list: [
+      'ms-ContextualMenu-list is-open',
+      styles.list
+    ],
+    header: [
+      'ms-ContextualMenu-header',
+      styles.header
+    ],
+    title: styles.title
   });
 });
+
+export const getItemClassNames = memoizeFunction((
+  theme: ITheme,
+  disabled: boolean,
+  expanded: boolean,
+  checked: boolean,
+  isAnchorLink: boolean,
+  knownIcon: boolean,
+  itemClassName: string,
+  dividerClassName: string,
+  iconClassName: string,
+  subMenuClassName: string,
+): IMenuItemClassNames => {
+
+  const { semanticColors } = theme;
+  const ContextualMenuIconColor = semanticColors.menuIcon;
+  const styles = getMenuItemStyles(theme);
+
+  return mergeStyleSets({
+    item: [
+      'ms-ContextualMenu-item',
+      styles.item,
+      itemClassName,
+    ],
+    divider: [
+      'ms-ContextualMenu-divider',
+      styles.divider,
+      dividerClassName,
+    ],
+    root: [
+      'ms-ContextualMenu-link',
+      styles.root,
+      checked && [
+        'is-checked',
+        styles.rootChecked
+      ],
+      isAnchorLink && styles.anchorLink,
+      expanded && [
+        'is-expanded',
+        styles.rootExpanded
+      ],
+      disabled && [
+        'is-disabled',
+        styles.rootDisabled
+      ],
+      !disabled && !expanded && !checked && [{
+        selectors: {
+          ':hover': styles.rootHovered,
+          ':active': styles.rootPressed,
+          '.ms-Fabric.is-focusVisible &:focus': styles.rootFocused
+        }
+      }],
+    ],
+    linkContent: [
+      'ms-ContextualMenu-linkContent',
+      styles.linkContent
+    ],
+    icon: [
+      'ms-ContextualMenu-icon',
+      knownIcon && 'ms-ContextualMenu-iconColor ' && styles.iconColor,
+      styles.icon,
+      iconClassName,
+    ],
+    subMenuIcon: [
+      'ms-ContextualMenu-submenuIcon',
+      styles.subMenuIcon,
+      subMenuClassName,
+    ],
+    label: [
+      'ms-ContextualMenu-itemText',
+      styles.label
+    ]
+  });
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.scss b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.scss
deleted file mode 100644
index 165fc9565eece..0000000000000
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.scss
+++ /dev/null
@@ -1,174 +0,0 @@
-@import '../../common/common';
-
-
-
-$ContextualMenu-itemHeight: 32px;
-$ContextualMenu-iconWidth: 14px;
-
-// component slots
-$ContextualMenu-background-color: $menuBackgroundColor;
-$ContextualMenu-background-hover-color: $menuBackgroundHoverColor;
-$ContextualMenu-background-selected-color: $menuBackgroundSelectedColor;
-
-$ContextualMenu-text-color: $menuTextColor;
-$ContextualMenu-text-selected-color: $menuTextSelectedColor;
-
-$ContextualMenu-icon-color: $menuIconColor;
-
-$ContextualMenu-header-color: $menuHeaderColor;
-
-$ContextualMenu-divider-color: $menuDividerColor;
-
-$ContextualMenu-text-disabled: $menuTextDisabledColor;
-
-.root {
-  background-color: $ContextualMenu-background-color;
-  min-width: 180px;
-}
-
-.list {
-  list-style-type: none;
-  margin: 0;
-  padding: 0;
-  line-height: 0;
-}
-
-.item {
-  @include ms-font-m;
-  color: $ContextualMenu-text-color;
-  position: relative;
-  box-sizing: border-box;
-}
-
-.link {
-  @include focus-border();
-
-  font: inherit;
-  color: inherit;
-  background: none;
-  border: none;
-  width: 100%;
-  height: $ContextualMenu-itemHeight;
-  line-height: $ContextualMenu-itemHeight;
-  display: block;
-  cursor: pointer;
-  padding: 0px 6px;
-  @include text-align(left);
-
-  &:hover:not([disabled]) {
-    background: $ContextualMenu-background-hover-color;
-
-    @include high-contrast {
-      background: Highlight;
-      color: HighlightText;
-      -ms-high-contrast-adjust: none;
-    }
-  }
-  &.isDisabled,
-  &[disabled] {
-    color: $ContextualMenu-text-disabled;
-    cursor: default;
-    pointer-events: none;
-    .icon {
-      color: $ContextualMenu-text-disabled;
-    }
-  }
-
-  :global(.is-focusVisible) &:focus {
-    background: $ContextualMenu-background-hover-color;
-  }
-
-  &.isExpanded,
-  &.isExpanded:hover {
-    background: $ContextualMenu-background-selected-color;
-    color: $ContextualMenu-text-selected-color;
-    font-weight: $ms-font-weight-semibold;
-
-    @include high-contrast {
-      background: Highlight;
-      color: HighlightText;
-      -ms-high-contrast-adjust: none;
-    }
-  }
-}
-
-.header {
-  @include focus-border();
-  @include ms-font-s;
-  font-weight: $ms-font-weight-semibold;
-  color: $ContextualMenu-header-color;
-  background: none;
-  border: none;
-  height: $ContextualMenu-itemHeight;
-  line-height: $ContextualMenu-itemHeight;
-  cursor: default;
-  padding: 0px 6px;
-  user-select: none;
-  @include text-align(left);
-}
-
-a.link {
-  padding: 0px 6px;
-  text-rendering: auto;
-  color: inherit;
-  letter-spacing: normal;
-  word-spacing: normal;
-  text-transform: none;
-  text-indent: 0px;
-  text-shadow: none;
-  text-decoration: none;
-  box-sizing: border-box;
-}
-
-.linkContent {
-  white-space: nowrap;
-  height: inherit;
-  display: flex;
-  align-items: center;
-  max-width: 100%;
-}
-
-.divider {
-  display: block;
-  height: 1px;
-  background-color: $ContextualMenu-divider-color;
-  position: relative;
-}
-
-.icon {
-  display: inline-block;
-  min-height: 1px;
-  max-height: $ContextualMenu-itemHeight;
-  width: $ContextualMenu-iconWidth;
-  margin: 0 4px;
-  vertical-align: middle;
-  flex-shrink: 0;
-}
-
-.iconColor {
-  color: $ContextualMenu-icon-color;
-
-  @include high-contrast {
-    color: HighlightText;
-  }
-}
-
-.itemText {
-  margin: 0 4px;
-  vertical-align: middle;
-  display: inline-block;
-  flex-grow: 1;
-  text-overflow: ellipsis;
-  overflow: hidden;
-  white-space: nowrap;
-}
-
-.submenuIcon {
-  height: $ContextualMenu-itemHeight;
-  line-height: $ContextualMenu-itemHeight;
-  text-align: center;
-  font-size: $ms-icon-size-xs;
-  display: inline-block;
-  vertical-align: middle;
-  flex-shrink: 0;
-}
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
new file mode 100644
index 0000000000000..fbefef1ff6cc4
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
@@ -0,0 +1,203 @@
+import { memoizeFunction } from '../../Utilities';
+import { IContextualMenuStyles, IMenuItemStyles } from './ContextualMenu.Props';
+import {
+  ITheme,
+  IRawStyle,
+  concatStyleSets,
+  FontWeights,
+  FontSizes,
+  getFocusStyle
+} from '../../Styling';
+
+const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active) &';
+
+const ContextualMenuItemHeight = '32px';
+const ContextualMenuIconWidth = '14px';
+
+const getItemHighContrastStyles = memoizeFunction((): IRawStyle => {
+  return {
+    selectors: {
+      [MS_HIGHCONTRAST_ACTIVE]: {
+        backgroundColor: 'Highlight',
+        borderColor: 'Highlight',
+        color: 'HighlightText',
+        MsHighContrastAdjust: 'none'
+      }
+    },
+  };
+});
+
+export const getMenuItemStyles = memoizeFunction((
+  theme: ITheme,
+): IMenuItemStyles => {
+  const { semanticColors, fonts } = theme;
+  const ContextualMenuIconColor = semanticColors.menuIcon;
+  const ContextualMenuTextColor = semanticColors.bodyText;
+  const ContextualMenuItemBackgroundHoverColor = semanticColors.menuItemBackgroundHovered;
+  const ContextualMenuItemBackgroundSelectedColor = semanticColors.menuItemBackgroundChecked;
+  const ContextualMenuTextSelectedColor = semanticColors.bodySelectedText;
+  const ContextualMenuTextDisabledColor = semanticColors.disabledText;
+  const ContextualMenuDividerColor = semanticColors.bodyDivider;
+
+  const menuItemStyles: IMenuItemStyles = {
+    item: [
+      fonts.medium,
+      {
+        color: ContextualMenuTextColor,
+        position: 'relative',
+        boxSizing: 'border-box',
+      }],
+    divider: {
+      display: 'block',
+      height: '1px',
+      backgroundColor: ContextualMenuDividerColor,
+      position: 'relative'
+    },
+    root: [
+      getFocusStyle(theme),
+      {
+        font: 'inherit',
+        color: 'inherit',
+        backgroundColor: 'transparent',
+        border: 'none',
+        width: '100%',
+        height: ContextualMenuItemHeight,
+        lineHeight: ContextualMenuItemHeight,
+        display: 'block',
+        cursor: 'pointer',
+        padding: '0px 6px',
+        textAlign: 'left',
+      },
+    ],
+    rootDisabled: {
+      color: ContextualMenuTextDisabledColor,
+      cursor: 'default',
+      pointerEvents: 'none',
+    },
+    rootHovered: {
+      backgroundColor: ContextualMenuItemBackgroundHoverColor,
+      ...getItemHighContrastStyles()
+    },
+    rootFocused: {
+      backgroundColor: ContextualMenuItemBackgroundHoverColor,
+      ...getItemHighContrastStyles()
+    },
+    rootChecked: {
+      backgroundColor: ContextualMenuItemBackgroundSelectedColor,
+      ...getItemHighContrastStyles()
+    },
+    rootPressed: {
+      backgroundColor: ContextualMenuItemBackgroundSelectedColor,
+      ...getItemHighContrastStyles()
+    },
+    rootExpanded: {
+      backgroundColor: ContextualMenuItemBackgroundSelectedColor,
+      color: ContextualMenuTextSelectedColor,
+      fontWeight: FontWeights.semibold,
+      ...getItemHighContrastStyles()
+    },
+    linkContent: {
+      whiteSpace: 'nowrap',
+      height: 'inherit',
+      display: 'flex',
+      alignItems: 'center',
+      maxWidth: '100%'
+    },
+    anchorLink: {
+      padding: '0px 6px',
+      textRendering: 'auto',
+      color: 'inherit',
+      letterSpacing: 'normal',
+      wordSpacing: 'normal',
+      textTransform: 'none',
+      textIndent: '0px',
+      textShadow: 'none',
+      textDecoration: 'none',
+      boxSizing: 'border-box'
+    },
+    label: {
+      margin: '0 4px',
+      verticalAlign: 'middle',
+      display: 'inline-block',
+      flexGrow: '1',
+      textOverflow: 'ellipsis',
+      overflow: 'hidden',
+      whiteSpace: 'nowrap'
+    },
+    icon: {
+      display: 'inline-block',
+      minHeight: '1px',
+      maxHeight: ContextualMenuItemHeight,
+      width: ContextualMenuIconWidth,
+      margin: '0 4px',
+      verticalAlign: 'middle',
+      flexShrink: '0',
+    },
+    iconColor: {
+      color: ContextualMenuIconColor,
+      [MS_HIGHCONTRAST_ACTIVE]: {
+        color: 'HighlightText',
+      }
+    },
+    subMenuIcon: {
+      height: ContextualMenuItemHeight,
+      lineHeight: ContextualMenuItemHeight,
+      textAlign: 'center',
+      display: 'inline-block',
+      verticalAlign: 'middle',
+      flexShrink: '0',
+      fontSize: FontSizes.mini
+    }
+  };
+
+  return concatStyleSets(menuItemStyles);
+});
+
+export const getStyles = memoizeFunction((
+  theme: ITheme,
+): IContextualMenuStyles => {
+  const { semanticColors, fonts } = theme;
+
+  const ContextualMenuBackground = semanticColors.bodyBackground;
+  const ContextualMenuHeaderColor = semanticColors.menuHeader;
+
+  const styles: IContextualMenuStyles = {
+    root: {
+      backgroundColor: ContextualMenuBackground,
+      minWidth: '180px',
+    },
+    container: {
+
+    },
+    list: {
+      listStyleType: 'none',
+      margin: '0',
+      padding: '0',
+      lineHeight: '0',
+    },
+    title: {
+      fontSize: '16px',
+      paddingRight: '14px',
+      paddingLeft: '14px',
+      paddingBottom: '5px',
+      paddingTop: '5px',
+      backgroundColor: theme.palette.neutralLight
+    },
+    header: [
+      fonts.small,
+      {
+        fontWeight: FontWeights.semibold,
+        color: ContextualMenuHeaderColor,
+        background: 'none',
+        border: 'none',
+        height: ContextualMenuItemHeight,
+        lineHeight: ContextualMenuItemHeight,
+        cursor: 'default',
+        padding: '0px 6px',
+        userSelect: 'none',
+        textAlign: 'left',
+      }
+    ],
+  };
+  return concatStyleSets(styles);
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 0ff5deecf2ede..dcd28b28d2b17 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -2,7 +2,16 @@ import * as React from 'react';
 import { IContextualMenuProps, IContextualMenuItem, ContextualMenuItemType } from './ContextualMenu.Props';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
-import { getClassNames } from './ContextualMenu.classNames';
+import {
+  getStyles,
+  getMenuItemStyles
+} from './ContextualMenu.styles';
+import {
+  IMenuItemClassNames,
+  IContextualMenuClassNames,
+  getContextualMenuClassNames,
+  getItemClassNames
+} from './ContextualMenu.classNames';
 import {
   BaseComponent,
   anchorProperties,
@@ -11,7 +20,6 @@ import {
   assign,
   getId,
   getRTL,
-  css,
   autobind,
   KeyCodes,
   getDocument,
@@ -24,8 +32,6 @@ import {
   Icon,
   IIconProps
 } from '../../Icon';
-import * as stylesImport from './ContextualMenu.scss';
-const styles: any = stylesImport;
 export interface IContextualMenuState {
   expandedMenuItemKey?: string;
   dismissedMenuItemKey?: string;
@@ -98,6 +104,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     directionalHint: DirectionalHint.bottomAutoEdge,
     beakWidth: 16,
     arrowDirection: FocusZoneDirection.vertical,
+    getMenuClassNames: getContextualMenuClassNames,
+    getItemClassNames: getItemClassNames,
   };
 
   private _host: HTMLElement;
@@ -106,6 +114,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   private _enterTimerId: number;
   private _targetWindow: Window;
   private _target: HTMLElement | MouseEvent | null;
+  private _classNames: IContextualMenuClassNames;
 
   constructor(props: IContextualMenuProps) {
     super(props);
@@ -192,7 +201,9 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       onRenderSubMenu = this._onRenderSubMenu
     } = this.props;
 
-    const classNames = getClassNames(customStyles!, theme!);
+    let menuClassNames = this.props.getMenuClassNames ? this.props.getMenuClassNames : getContextualMenuClassNames;
+    this._classNames = menuClassNames(theme!, className!);
+
     let hasIcons = itemsHaveIcons(items);
 
     function itemsHaveIcons(contextualMenuItems: IContextualMenuItem[]): boolean {
@@ -254,11 +265,11 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
           bounds={ bounds }
           directionalHintFixed={ directionalHintFixed }
         >
-          <div style={ contextMenuStyle } ref={ (host: HTMLDivElement) => this._host = host } id={ id } className={ css('ms-ContextualMenu-container', className) }>
-            { title && <div className={ classNames.title } role='heading' aria-level={ 1 }> { title } </div> }
+          <div style={ contextMenuStyle } ref={ (host: HTMLDivElement) => this._host = host } id={ id } className={ this._classNames.container }>
+            { title && <div className={ this._classNames.title } role='heading' aria-level={ 1 }> { title } </div> }
             { (items && items.length) ? (
               <FocusZone
-                className={ css('ms-ContextualMenu is-open', styles.root) }
+                className={ this._classNames.root }
                 direction={ arrowDirection }
                 isCircularNavigation={ true }
               >
@@ -266,7 +277,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
                   role='menu'
                   aria-label={ ariaLabel }
                   aria-labelledby={ labelElementId }
-                  className={ css('ms-ContextualMenu-list is-open', styles.list) }
+                  className={ this._classNames.list }
                   onKeyDown={ this._onKeyDown }
                 >
                   { items.map((item, index) => {
@@ -294,31 +305,49 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
   private _renderMenuItem(item: IContextualMenuItem, index: number, focusableElementIndex: number, totalItemCount: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
     let renderedItems: React.ReactNode[] = [];
+    let iconProps = this._getIconProps(item);
+    // We only send a dividerClassName when the item to be rendered is a divider. For all other cases, the default divider style is used.
+    let dividerClassName = item.itemType === ContextualMenuItemType.Divider ? item.className : undefined;
+    let subMenuIconClassName = item.submenuIconProps ? item.submenuIconProps.className : '';
+    let getClassNames = this.props.getItemClassNames ? this.props.getItemClassNames : getItemClassNames;
+    let itemClassNames = getClassNames(
+      this.props.theme!,
+      !!item.disabled,
+      (this.state.expandedMenuItemKey === item.key),
+      !!getIsChecked(item),
+      !!item.href,
+      (iconProps.iconName !== 'None'),
+      item.className!,
+      dividerClassName!,
+      iconProps.className!,
+      subMenuIconClassName!
+    );
+
     if (item.name === '-') {
       item.itemType = ContextualMenuItemType.Divider;
     }
     switch (item.itemType) {
       case ContextualMenuItemType.Divider:
-        renderedItems.push(this._renderSeparator(index, item.className));
+        renderedItems.push(this._renderSeparator(index, itemClassNames));
         break;
       case ContextualMenuItemType.Header:
-        renderedItems.push(this._renderSeparator(index));
-        let headerItem = this._renderHeaderMenuItem(item, index, hasCheckmarks, hasIcons);
-        renderedItems.push(this._renderListItem(headerItem, item.key || index, item.className, item.title));
+        renderedItems.push(this._renderSeparator(index, itemClassNames));
+        let headerItem = this._renderHeaderMenuItem(item, itemClassNames, index, hasCheckmarks, hasIcons);
+        renderedItems.push(this._renderListItem(headerItem, item.key || index, itemClassNames, item.title));
         break;
       case ContextualMenuItemType.Section:
-        renderedItems.push(this._renderSectionItem(item, index, hasCheckmarks, hasIcons));
+        renderedItems.push(this._renderSectionItem(item, itemClassNames, index, hasCheckmarks, hasIcons));
         break;
       default:
-        let menuItem = this._renderNormalItem(item, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons);
-        renderedItems.push(this._renderListItem(menuItem, item.key || index, item.className, item.title));
+        let menuItem = this._renderNormalItem(item, itemClassNames, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons);
+        renderedItems.push(this._renderListItem(menuItem, item.key || index, itemClassNames, item.title));
         break;
     }
 
     return renderedItems;
   }
 
-  private _renderSectionItem(item: IContextualMenuItem, index: number, hasCheckmarks: boolean, hasIcons: boolean) {
+  private _renderSectionItem(item: IContextualMenuItem, menuClassNames: IMenuItemClassNames, index: number, hasCheckmarks: boolean, hasIcons: boolean) {
     const section = item.sectionProps;
     if (!section) {
       return;
@@ -329,9 +358,9 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       const headerContextualMenuItem: IContextualMenuItem = {
         key: `section-${section.title}-title`,
         itemType: ContextualMenuItemType.Header,
-        name: section.title
+        name: section.title,
       };
-      headerItem = this._renderHeaderMenuItem(headerContextualMenuItem, index, hasCheckmarks, hasIcons);
+      headerItem = this._renderHeaderMenuItem(headerContextualMenuItem, menuClassNames, index, hasCheckmarks, hasIcons);
     }
 
     if (section.items && section.items.length > 0) {
@@ -341,13 +370,13 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
           key={ section.key }
         >
           <div role='group'>
-            <ul className={ css('ms-ContextualMenu-list is-open', styles.list) }>
-              { section.topDivider && this._renderSeparator(index, undefined, true, true) }
-              { headerItem && this._renderListItem(headerItem, item.key || index, item.className, item.title) }
+            <ul className={ this._classNames.list }>
+              { section.topDivider && this._renderSeparator(index, menuClassNames, true, true) }
+              { headerItem && this._renderListItem(headerItem, item.key || index, menuClassNames, item.title) }
               { section.items.map((contextualMenuItem, itemsIndex) => (
                 this._renderMenuItem(contextualMenuItem, itemsIndex, itemsIndex, section.items.length, hasCheckmarks, hasIcons)
               )) }
-              { section.bottomDivider && this._renderSeparator(index, undefined, false, true) }
+              { section.bottomDivider && this._renderSeparator(index, menuClassNames, false, true) }
             </ul>
           </div>
         </li>
@@ -355,60 +384,57 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     }
   }
 
-  private _renderListItem(content: React.ReactNode, key: string | number, className?: string, title?: string) {
+  private _renderListItem(content: React.ReactNode, key: string | number, classNames: IMenuItemClassNames, title?: string) {
     return (
       <li
         role='presentation'
         title={ title }
         key={ key }
-        className={ css('ms-ContextualMenu-item', styles.item, className) }
+        className={ classNames.item }
       >
         { content }
       </li>
     );
   }
 
-  private _renderSeparator(index: number, className?: string, top?: boolean, fromSection?: boolean): React.ReactNode {
+  private _renderSeparator(index: number, classNames: IMenuItemClassNames, top?: boolean, fromSection?: boolean): React.ReactNode {
     if (fromSection || index > 0) {
       return (
         <li
           role='separator'
           key={ 'separator-' + index + (top === undefined ? '' : (top ? '-top' : '-bottom')) }
-          className={ css('ms-ContextualMenu-divider', styles.divider, className) }
+          className={ classNames.divider }
         />
       );
     }
     return null;
   }
 
-  private _renderNormalItem(item: IContextualMenuItem, index: number, focusableElementIndex: number, totalItemCount: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
+  private _renderNormalItem(item: IContextualMenuItem, classNames: IMenuItemClassNames, index: number, focusableElementIndex: number, totalItemCount: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
     if (item.onRender) {
       return [item.onRender(item)];
     }
     if (item.href) {
-      return this._renderAnchorMenuItem(item, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons);
+      return this._renderAnchorMenuItem(item, classNames, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons);
     }
-    return this._renderButtonItem(item, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons);
+    return this._renderButtonItem(item, classNames, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons);
   }
 
-  private _renderHeaderMenuItem(item: IContextualMenuItem, index: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
+  private _renderHeaderMenuItem(item: IContextualMenuItem, classNames: IMenuItemClassNames, index: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
     return (
-      <div className={ css('ms-ContextualMenu-header', styles.header) } style={ item.style } role='heading' aria-level={ this.props.title ? 2 : 1 }>
-        { this._renderMenuItemChildren(item, index, hasCheckmarks, hasIcons) }
+      <div className={ this._classNames.header } style={ item.style } role='heading' aria-level={ this.props.title ? 2 : 1 }>
+        { this._renderMenuItemChildren(item, classNames, index, hasCheckmarks, hasIcons) }
       </div>);
   }
 
-  private _renderAnchorMenuItem(item: IContextualMenuItem, index: number, focusableElementIndex: number, totalItemCount: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
+  private _renderAnchorMenuItem(item: IContextualMenuItem, classNames: IMenuItemClassNames, index: number, focusableElementIndex: number, totalItemCount: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
     return (
       <div>
         <a
           { ...getNativeProps(item, anchorProperties) }
           href={ item.href }
           target={ item.target }
-          className={ css(
-            'ms-ContextualMenu-link',
-            styles.link,
-            (item.isDisabled || item.disabled) && 'is-disabled') }
+          className={ classNames.root }
           role='menuitem'
           aria-posinset={ focusableElementIndex + 1 }
           aria-setsize={ totalItemCount }
@@ -416,13 +442,14 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
           style={ item.style }
           onClick={ this._onAnchorClick.bind(this, item) }
         >
-          { this._renderMenuItemChildren(item, index, hasCheckmarks, hasIcons) }
+          { this._renderMenuItemChildren(item, classNames, index, hasCheckmarks, hasIcons) }
         </a>
       </div>);
   }
 
   private _renderButtonItem(
     item: IContextualMenuItem,
+    classNames: IMenuItemClassNames,
     index: number,
     focusableElementIndex: number,
     totalItemCount: number,
@@ -442,9 +469,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     const defaultRole = canCheck ? 'menuitemcheckbox' : 'menuitem';
 
     const itemButtonProperties = {
-      className: css('ms-ContextualMenu-link', styles.link, {
-        ['is-expanded ' + styles.isExpanded]: (expandedMenuItemKey === item.key)
-      }),
+      className: classNames.root,
       onClick: this._onItemClick.bind(this, item),
       onKeyDown: hasSubmenuItems(item) ? this._onItemKeyDown.bind(this, item) : null,
       onMouseEnter: this._onItemMouseEnter.bind(this, item),
@@ -467,45 +492,47 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     return React.createElement(
       'button',
       assign({}, getNativeProps(item, buttonProperties), itemButtonProperties),
-      this._renderMenuItemChildren(item, index, hasCheckmarks!, hasIcons!));
+      this._renderMenuItemChildren(item, classNames, index, hasCheckmarks!, hasIcons!));
   }
 
-  private _renderMenuItemChildren(item: IContextualMenuItem, index: number, hasCheckmarks: boolean, hasIcons: boolean) {
+  private _renderMenuItemChildren(item: IContextualMenuItem, classNames: IMenuItemClassNames, index: number, hasCheckmarks: boolean, hasIcons: boolean) {
     const isItemChecked: boolean | null | undefined = getIsChecked(item);
     return (
-      <div className={ css('ms-ContextualMenu-linkContent', styles.linkContent) }>
+      <div className={ classNames.linkContent }>
         { (hasCheckmarks) ? (
           <Icon
             iconName={ isItemChecked === true ? 'CheckMark' : '' }
-            className={ css('ms-ContextualMenu-icon', styles.icon) }
+            className={ classNames.icon }
             onClick={ this._onItemClick.bind(this, item) }
           />
         ) : (null) }
         { (hasIcons) ? (
-          this._renderIcon(item)
+          this._renderIcon(item, classNames)
         ) : (null) }
-        <span className={ css('ms-ContextualMenu-itemText', styles.itemText) }>{ item.name }</span>
+        <span className={ classNames.label }>{ item.name }</span>
         { hasSubmenuItems(item) ? (
           <Icon
             iconName={ getRTL() ? 'ChevronLeft' : 'ChevronRight' }
             { ...item.submenuIconProps }
-            className={ css('ms-ContextualMenu-submenuIcon', styles.submenuIcon, item.submenuIconProps ? item.submenuIconProps.className : '') }
+            className={ classNames.subMenuIcon }
           />
         ) : (null) }
       </div>
     );
   }
 
-  private _renderIcon(item: IContextualMenuItem) {
-    // Only present to allow continued use of item.icon which is deprecated.
+  private _getIconProps(item: IContextualMenuItem): IIconProps {
     let iconProps: IIconProps = item.iconProps ? item.iconProps : {
       iconName: item.icon
     };
-    // Use the default icon color for the known icon names
-    let iconColorClassName = iconProps.iconName === 'None' ? '' : ('ms-ContextualMenu-iconColor ' + styles.iconColor);
-    let iconClassName = css('ms-ContextualMenu-icon', styles.icon, iconColorClassName, iconProps.className);
+    return iconProps;
+  }
+
+  private _renderIcon(item: IContextualMenuItem, classNames: IMenuItemClassNames) {
+    // Only present to allow continued use of item.icon which is deprecated.
+    let iconProps = this._getIconProps(item);
 
-    return <Icon { ...iconProps } className={ iconClassName } />;
+    return <Icon { ...iconProps } className={ classNames.icon } />;
   }
 
   @autobind
diff --git a/packages/styling/src/interfaces/ISemanticColors.ts b/packages/styling/src/interfaces/ISemanticColors.ts
index 84fe7deeba6fe..5b58ea761f965 100644
--- a/packages/styling/src/interfaces/ISemanticColors.ts
+++ b/packages/styling/src/interfaces/ISemanticColors.ts
@@ -57,6 +57,11 @@ export interface ISemanticColors {
    */
   bodyText: string;
 
+  /**
+   * The default text color for a selected menu item title.
+   */
+  bodySelectedText: string;
+
   /**
    * De-emphasized text; e.g. metadata, captions, placeholder text.
    */
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index 6beaf3c13946a..0b2522017b556 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -83,6 +83,7 @@ function _makeSemanticColorsFromPalette(p: IPalette, isInverted: boolean): ISema
   return {
     bodyBackground: p.white,
     bodyText: p.neutralPrimary,
+    bodySelectedText: p.black,
     bodySubtext: p.neutralSecondary,
     bodyDivider: p.neutralLight,
 

From 42cd8138382f1b90b1ca761e7b17755f8e2bf38e Mon Sep 17 00:00:00 2001
From: Alex Bettadapur <alexbettadapur@gmail.com>
Date: Mon, 9 Oct 2017 15:43:51 -0700
Subject: [PATCH 0808/1641] ComboBox: Pass onRenderList, onRenderItem,
 onRenderOption, and currentOptions to custom render functions (#3059)

* Add list to ComboBox

* Save

* Remove List references

* Change log

* Update comboBoxRenderFunctions_2017-10-06-17-11.json

* Use shorthand
---
 ...boBoxRenderFunctions_2017-10-06-17-11.json | 11 ++++++++++
 .../src/components/ComboBox/ComboBox.tsx      | 21 ++++++++++++++-----
 2 files changed, 27 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/comboBoxRenderFunctions_2017-10-06-17-11.json

diff --git a/common/changes/office-ui-fabric-react/comboBoxRenderFunctions_2017-10-06-17-11.json b/common/changes/office-ui-fabric-react/comboBoxRenderFunctions_2017-10-06-17-11.json
new file mode 100644
index 0000000000000..2f5752f559eb0
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/comboBoxRenderFunctions_2017-10-06-17-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Pass default render functions to ComboBox custom render functions",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "alebet@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index b8d1595aa2212..b6acb72636327 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -217,6 +217,9 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       required,
       errorMessage,
       onRenderContainer = this._onRenderContainer,
+      onRenderList = this._onRenderList,
+      onRenderItem = this._onRenderItem,
+      onRenderOption = this._onRenderOption,
       allowFreeform,
       autoComplete,
       buttonIconProps,
@@ -293,7 +296,14 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         </div>
 
         { isOpen && (
-          (onRenderContainer as any)({ ...this.props as any }, this._onRenderContainer)
+          (onRenderContainer as any)({
+            ...this.props,
+            onRenderList,
+            onRenderItem,
+            onRenderOption,
+            options: this.state.currentOptions.map((item, index) => ({ ...item, index: index }))
+          },
+            this._onRenderContainer)
         ) }
         {
           errorMessage &&
@@ -752,7 +762,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   @autobind
   private _onRenderContainer(props: IComboBoxProps): JSX.Element {
     let {
-      onRenderList = this._onRenderList,
+      onRenderList,
       calloutProps
     } = props;
 
@@ -780,8 +790,9 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   @autobind
   private _onRenderList(props: IComboBoxProps): JSX.Element {
     let {
-      onRenderItem = this._onRenderItem
-    } = this.props;
+      onRenderItem,
+      options
+    } = props;
 
     let id = this._id;
 
@@ -792,7 +803,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         aria-labelledby={ id + '-label' }
         role='listbox'
       >
-        { this.state.currentOptions.map((item, index) => onRenderItem({ ...item, index } as ISelectableOption, this._onRenderItem)) }
+        { options.map((item) => (onRenderItem as any)(item, this._onRenderItem)) }
       </div>
     );
   }

From 099ebd3bdb658ecf7f71cde16a5c92ab7ba7a595 Mon Sep 17 00:00:00 2001
From: Alex Bettadapur <alexbettadapur@gmail.com>
Date: Mon, 9 Oct 2017 16:39:28 -0700
Subject: [PATCH 0809/1641] Add VirtualizedComboBox (#3060)

* Add list to ComboBox

* Save

*  Polish

* Changes

* Lint

* Fix lint

* Save

* Update virtualizedComboBox_2017-10-06-17-22.json

* Fix access levels

* CR feedback

* Lint
---
 .../virtualizedComboBox_2017-10-06-17-22.json | 11 +++++
 .../src/components/ComboBox/ComboBox.Props.ts |  6 ++-
 .../src/components/ComboBox/ComboBox.tsx      | 43 +++++++++++-------
 .../ComboBox/VirtualizedComboBox.tsx          | 44 +++++++++++++++++++
 .../examples/ComboBox.Basic.Example.tsx       | 27 +++++++++++-
 .../src/components/ComboBox/index.ts          |  1 +
 6 files changed, 115 insertions(+), 17 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/virtualizedComboBox_2017-10-06-17-22.json
 create mode 100644 packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx

diff --git a/common/changes/office-ui-fabric-react/virtualizedComboBox_2017-10-06-17-22.json b/common/changes/office-ui-fabric-react/virtualizedComboBox_2017-10-06-17-22.json
new file mode 100644
index 0000000000000..8477d50c3c52a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/virtualizedComboBox_2017-10-06-17-22.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Add virtualization to the combobox control",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "alebet@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
index 5c1dcc10c95dd..bbd355b2abc24 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
@@ -47,6 +47,11 @@ export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox>
    */
   onResolveOptions?: (options: IComboBoxOption[]) => IComboBoxOption[] | PromiseLike<IComboBoxOption[]>;
 
+  /**
+   * Callback issued when the ComboBox requests the list to scroll to a specific element
+   */
+  onScrollToItem?: (itemIndex: number) => void;
+
   /**
    * Whether the ComboBox is free form, meaning that the user input is not bound to provided options. Defaults to false.
    */
@@ -94,7 +99,6 @@ export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox>
    * @default false;
    */
   scrollSelectedToTop?: boolean;
-
 }
 
 export interface IComboBoxStyles {
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index b6acb72636327..6c83d82db8167 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -795,7 +795,6 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     } = props;
 
     let id = this._id;
-
     return (
       <div
         id={ id + '-list' }
@@ -811,7 +810,6 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   // Render items
   @autobind
   private _onRenderItem(item: IComboBoxOption): JSX.Element | null {
-
     switch (item.itemType) {
       case SelectableOptionMenuItemType.Divider:
         return this._renderSeparator(item);
@@ -892,23 +890,38 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * Scroll the selected element into view
    */
   private _scrollIntoView() {
+    let {
+      onScrollToItem,
+      scrollSelectedToTop
+    } = this.props;
 
-    let { scrollSelectedToTop } = this.props;
-    if (this._selectedElement && scrollSelectedToTop) {
-      this._selectedElement.offsetParent.scrollIntoView(true);
-    } else if (this._selectedElement) {
-      let alignToTop = true;
-
-      if (this._comboBoxMenu.offsetParent) {
-        let scrollableParentRect = this._comboBoxMenu.offsetParent.getBoundingClientRect();
-        let selectedElementRect = this._selectedElement.offsetParent.getBoundingClientRect();
+    let {
+      currentPendingValueValidIndex,
+      currentPendingValue,
+      selectedIndex
+    } = this.state;
 
-        if (scrollableParentRect.top + scrollableParentRect.height <= selectedElementRect.top) {
-          alignToTop = false;
+    if (onScrollToItem) {
+      // Use the custom scroll handler
+      onScrollToItem((currentPendingValueValidIndex >= 0 || currentPendingValue !== '') ? currentPendingValueValidIndex : selectedIndex);
+    } else {
+      // We are using refs, scroll the ref into view
+      if (this._selectedElement && scrollSelectedToTop) {
+        this._selectedElement.offsetParent.scrollIntoView(true);
+      } else if (this._selectedElement) {
+        let alignToTop = true;
+
+        if (this._comboBoxMenu.offsetParent) {
+          let scrollableParentRect = this._comboBoxMenu.offsetParent.getBoundingClientRect();
+          let selectedElementRect = this._selectedElement.offsetParent.getBoundingClientRect();
+
+          if (scrollableParentRect.top + scrollableParentRect.height <= selectedElementRect.top) {
+            alignToTop = false;
+          }
         }
-      }
 
-      this._selectedElement.offsetParent.scrollIntoView(alignToTop);
+        this._selectedElement.offsetParent.scrollIntoView(alignToTop);
+      }
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx
new file mode 100644
index 0000000000000..0017a4cf9163e
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx
@@ -0,0 +1,44 @@
+import * as React from 'react';
+import { autobind, BaseComponent, customizable } from '../../Utilities';
+import { ComboBox } from './ComboBox';
+import { IComboBoxProps } from './ComboBox.Props';
+import { List } from '../../List';
+import { SelectableOptionMenuItemType, ISelectableOption } from '../../utilities/selectableOption/SelectableOption.Props';
+
+export class VirtualizedComboBox extends BaseComponent<IComboBoxProps, {}> {
+
+  // The virtualized list element
+  private _list: List;
+
+  public render(): JSX.Element {
+    return (
+      <ComboBox
+        {...this.props}
+        onRenderList={ this._onRenderList }
+        onScrollToItem={ this._onScrollToItem }
+      />
+    );
+  }
+
+  @autobind
+  protected _onRenderList(props: IComboBoxProps): JSX.Element {
+    const {
+      onRenderItem
+    } = props;
+
+    // Render virtualized list
+    return (
+      <List
+        componentRef={ this._resolveRef('_list') }
+        role='listbox'
+        items={ props.options }
+        onRenderCell={ onRenderItem ? (item: ISelectableOption) => onRenderItem(item) : () => null }
+      />
+    );
+  }
+
+  protected _onScrollToItem(itemIndex: number): void {
+    // We are using the List component, call scrollToIndex
+    this._list.scrollToIndex(itemIndex);
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
index 14da24bea7cd5..4b7b50e5f1fdc 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
@@ -1,7 +1,9 @@
 import * as React from 'react';
 import {
   ComboBox,
-  IComboBoxOption
+  IComboBoxProps,
+  IComboBoxOption,
+  VirtualizedComboBox
 } from 'office-ui-fabric-react/lib/ComboBox';
 import './ComboBox.Basic.Example.scss';
 import {
@@ -34,6 +36,8 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
     ['Calibri']: 'Calibri, Calibri_MSFontService, sans-serif'
   };
 
+  private scaleOptions: IComboBoxOption[] = [];
+
   constructor() {
     super();
     this.state = {
@@ -41,6 +45,13 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
       selectedOptionKey: null,
       value: 'Calibri'
     };
+
+    for (let i = 0; i < 1000; i++) {
+      this.scaleOptions.push({
+        key: `${i}`,
+        text: `Option ${i}`
+      });
+    }
   }
 
   public render() {
@@ -94,6 +105,20 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
         // tslint:enable:jsx-no-lambda
         />
 
+        <VirtualizedComboBox
+          defaultSelectedKey='C'
+          label='Scaled example with 1000 items (allowFreeform: T, AutoComplete: T):'
+          id='Basicdrop1'
+          ariaLabel='Basic ComboBox example'
+          allowFreeform={ true }
+          autoComplete='on'
+          options={ this.scaleOptions }
+          // tslint:disable:jsx-no-lambda
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
+        // tslint:enable:jsx-no-lambda
+        />
+
         <ComboBox
           defaultSelectedKey='C'
           label='Basic uncontrolled example (allowFreeform: F, AutoComplete: F):'
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/index.ts b/packages/office-ui-fabric-react/src/components/ComboBox/index.ts
index 96a5a7b2b47b8..96fdf4db04de7 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/index.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/index.ts
@@ -1,3 +1,4 @@
 export { SelectableOptionMenuItemType } from '../../utilities/selectableOption/SelectableOption.Props';
 export * from './ComboBox';
 export * from './ComboBox.Props';
+export * from './VirtualizedComboBox';

From 65152f0589932d42e3974db98f9778d3153d074b Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 10 Oct 2017 10:24:48 +0000
Subject: [PATCH 0810/1641] Applying package updates.

---
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...malozano-glamorMenus_2017-10-02-20-33.json | 11 ------
 ...boBoxRenderFunctions_2017-10-06-17-11.json | 11 ------
 ...malozano-glamorMenus_2017-10-02-20-33.json | 11 ------
 .../messageBar-toolkit_2017-09-28-23-13.json  | 11 ------
 .../virtualizedComboBox_2017-10-06-17-22.json | 11 ------
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/package.json             |  2 +-
 packages/icons/package.json                   |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 36 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 +++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/CHANGELOG.json               | 14 ++++++++
 packages/styling/CHANGELOG.md                 |  9 ++++-
 packages/styling/package.json                 |  2 +-
 18 files changed, 82 insertions(+), 67 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/malozano-glamorMenus_2017-10-02-20-33.json
 delete mode 100644 common/changes/office-ui-fabric-react/comboBoxRenderFunctions_2017-10-06-17-11.json
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-glamorMenus_2017-10-02-20-33.json
 delete mode 100644 common/changes/office-ui-fabric-react/messageBar-toolkit_2017-09-28-23-13.json
 delete mode 100644 common/changes/office-ui-fabric-react/virtualizedComboBox_2017-10-06-17-22.json

diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 8b78decf0bc45..a7c31e68a3faf 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.5.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.6.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 4791ec9f92ed0..58a1085d068b9 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.5.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.6.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index dc6272eaaf3e9..438e1f3dcba09 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.5.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.6.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index f143f95f0f3b7..51d85eb31a3a5 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.5.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.6.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/styling/malozano-glamorMenus_2017-10-02-20-33.json b/common/changes/@uifabric/styling/malozano-glamorMenus_2017-10-02-20-33.json
deleted file mode 100644
index b4d40d18fe890..0000000000000
--- a/common/changes/@uifabric/styling/malozano-glamorMenus_2017-10-02-20-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "\"Add menuSelectedText to theme and semanticColors\"",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/comboBoxRenderFunctions_2017-10-06-17-11.json b/common/changes/office-ui-fabric-react/comboBoxRenderFunctions_2017-10-06-17-11.json
deleted file mode 100644
index 2f5752f559eb0..0000000000000
--- a/common/changes/office-ui-fabric-react/comboBoxRenderFunctions_2017-10-06-17-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Pass default render functions to ComboBox custom render functions",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "alebet@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/malozano-glamorMenus_2017-10-02-20-33.json b/common/changes/office-ui-fabric-react/malozano-glamorMenus_2017-10-02-20-33.json
deleted file mode 100644
index 2ff6c7a53c82b..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-glamorMenus_2017-10-02-20-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "\" Move ContextualMenu component to Glamor\"",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/messageBar-toolkit_2017-09-28-23-13.json b/common/changes/office-ui-fabric-react/messageBar-toolkit_2017-09-28-23-13.json
deleted file mode 100644
index aef2d7e67c351..0000000000000
--- a/common/changes/office-ui-fabric-react/messageBar-toolkit_2017-09-28-23-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "New MessageBarButton component to allow for the unique state styles need in MessageBar.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/virtualizedComboBox_2017-10-06-17-22.json b/common/changes/office-ui-fabric-react/virtualizedComboBox_2017-10-06-17-22.json
deleted file mode 100644
index 8477d50c3c52a..0000000000000
--- a/common/changes/office-ui-fabric-react/virtualizedComboBox_2017-10-06-17-22.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Add virtualization to the combobox control",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "alebet@microsoft.com"
-}
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 9c73b85e9414e..8c095d4697ab3 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -38,7 +38,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.2.1 <6.0.0",
+    "@uifabric/styling": ">=5.3.0 <6.0.0",
     "@uifabric/utilities": ">=5.2.1 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 59d300c45063b..1d1eaa85f9001 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -42,7 +42,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.5.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.6.0 <6.0.0",
     "@uifabric/icons": ">=5.1.1 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/icons/package.json b/packages/icons/package.json
index ac18b25f28255..521d9226fdcd7 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -23,7 +23,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.2.1 <6.0.0",
+    "@uifabric/styling": ">=5.3.0 <6.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 68f3dabd987a8..8cd8569992cd0 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,42 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.6.0",
+      "tag": "office-ui-fabric-react_v5.6.0",
+      "date": "Tue, 10 Oct 2017 10:24:47 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Alex Bettadapur <alexbettadapur@gmail.com>",
+            "commit": "42cd8138382f1b90b1ca761e7b17755f8e2bf38e",
+            "comment": "ComboBox: Pass default render functions to ComboBox custom render functions"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "89bbe88b2775fb48ae04631b135bdfbbc9806a5f",
+            "comment": "New MessageBarButton component to allow for the unique state styles need in MessageBar."
+          }
+        ],
+        "minor": [
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "5ed121b0063871101decc50baf9e1c920e041155",
+            "comment": "\" Move ContextualMenu component to Glamor\""
+          },
+          {
+            "author": "Alex Bettadapur <alexbettadapur@gmail.com>",
+            "commit": "099ebd3bdb658ecf7f71cde16a5c92ab7ba7a595",
+            "comment": "ComboBox: Add virtualization to the combobox control"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.2.1 <6.0.0` to `>=5.3.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.5.1",
       "tag": "office-ui-fabric-react_v5.5.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 10e76030d5407..3367b4cac9f3b 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 09 Oct 2017 10:08:09 GMT and should not be manually modified.
+This log was last generated on Tue, 10 Oct 2017 10:24:47 GMT and should not be manually modified.
+
+## 5.6.0
+Tue, 10 Oct 2017 10:24:47 GMT
+
+### Minor changes
+
+- " Move ContextualMenu component to Glamor"
+- ComboBox: Add virtualization to the combobox control
+
+### Patches
+
+- ComboBox: Pass default render functions to ComboBox custom render functions
+- New MessageBarButton component to allow for the unique state styles need in MessageBar.
 
 ## 5.5.1
 Mon, 09 Oct 2017 10:08:09 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 9f9836225b4bd..57dc808de8d04 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.5.1",
+  "version": "5.6.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.1.1 <6.0.0",
     "@uifabric/merge-styles": ">=5.3.2 <6.0.0",
-    "@uifabric/styling": ">=5.2.1 <6.0.0",
+    "@uifabric/styling": ">=5.3.0 <6.0.0",
     "@uifabric/utilities": ">=5.2.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 7d47246b6e819..f2fd7d1ef5fe0 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.3.0",
+      "tag": "@uifabric/styling_v5.3.0",
+      "date": "Tue, 10 Oct 2017 10:24:47 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "5ed121b0063871101decc50baf9e1c920e041155",
+            "comment": "\"Add menuSelectedText to theme and semanticColors\""
+          }
+        ]
+      }
+    },
     {
       "version": "5.2.1",
       "tag": "@uifabric/styling_v5.2.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 18cee58bd4f1a..49acd0ed4de53 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 06 Oct 2017 10:18:41 GMT and should not be manually modified.
+This log was last generated on Tue, 10 Oct 2017 10:24:47 GMT and should not be manually modified.
+
+## 5.3.0
+Tue, 10 Oct 2017 10:24:47 GMT
+
+### Minor changes
+
+- "Add menuSelectedText to theme and semanticColors"
 
 ## 5.2.1
 Fri, 06 Oct 2017 10:18:41 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 1f9a87858a910..3c563a83bf17b 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.2.1",
+  "version": "5.3.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From f9e4082480124499ecb92efcbb3967fd1ae07d6e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=85smund=20Grammeltvedt?= <asmundg@big-oil.org>
Date: Tue, 10 Oct 2017 18:23:21 +0200
Subject: [PATCH 0811/1641] Modal: Provide programmatic focus control of
 embedded FocusTrapZone (#2861)

* Make Modal's FocusTrapZone controllable

We expose a focus() method on Modal and a prop callback to get a
selector to the element that should receive focus.

This allows modals to dynamically refocus, for example when focused
inputs become disabled.

* Add change

* Generalize interface changes

* Prefix private variable

* Don't create lambda prop on every render
---
 .../modal-control-focustrap_2017-09-15-09-54.json    | 11 +++++++++++
 .../src/common/IAccessiblePopupProps.ts              |  4 ++--
 .../components/FocusTrapZone/FocusTrapZone.Props.ts  |  4 ++--
 .../src/components/FocusTrapZone/FocusTrapZone.tsx   | 10 +++++++---
 .../src/components/Modal/Modal.Props.ts              |  7 +++++--
 .../src/components/Modal/Modal.tsx                   | 12 +++++++++---
 6 files changed, 36 insertions(+), 12 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/modal-control-focustrap_2017-09-15-09-54.json

diff --git a/common/changes/office-ui-fabric-react/modal-control-focustrap_2017-09-15-09-54.json b/common/changes/office-ui-fabric-react/modal-control-focustrap_2017-09-15-09-54.json
new file mode 100644
index 0000000000000..dcf73431abae2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/modal-control-focustrap_2017-09-15-09-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Make Modal's FocusTrapZone controllable",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "asmundg@big-oil.org"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/common/IAccessiblePopupProps.ts b/packages/office-ui-fabric-react/src/common/IAccessiblePopupProps.ts
index 176bd66a706a9..1f4e51bec8580 100644
--- a/packages/office-ui-fabric-react/src/common/IAccessiblePopupProps.ts
+++ b/packages/office-ui-fabric-react/src/common/IAccessiblePopupProps.ts
@@ -20,7 +20,7 @@ export interface IAccessiblePopupProps {
   /**
   * Indicates the selector for first focusable item
   */
-  firstFocusableSelector?: string;
+  firstFocusableSelector?: string | (() => string);
 
   /**
   * Aria label on close button
@@ -32,4 +32,4 @@ export interface IAccessiblePopupProps {
   * @default false
   */
   isClickableOutsideFocusTrap?: boolean;
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.Props.ts b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.Props.ts
index 1244ec61ae6e1..be411060cd9db 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.Props.ts
@@ -2,7 +2,7 @@ import * as React from 'react';
 
 export interface IFocusTrapZone {
   /**
-  * Sets focus on the first focusable child in focus trap zone
+  * Sets focus on the first focusable, or configured, child in focus trap zone
   */
   focus: () => void;
 }
@@ -46,5 +46,5 @@ export interface IFocusTrapZoneProps extends React.HTMLAttributes<HTMLDivElement
   /**
   * Indicates the selector for first focusable item
   */
-  firstFocusableSelector?: string;
+  firstFocusableSelector?: string | (() => string);
 }
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
index b98cf5aeb755b..949425aae393c 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
@@ -104,12 +104,16 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
    * Need to expose this method in case of popups since focus needs to be set when popup is opened
    */
   public focus() {
-    let { firstFocusableSelector } = this.props;
+    const { firstFocusableSelector } = this.props;
+    const focusSelector = typeof firstFocusableSelector === 'string'
+      ? firstFocusableSelector
+      : firstFocusableSelector && firstFocusableSelector();
+
     let _firstFocusableChild;
     let root = this.refs.root;
 
-    if (firstFocusableSelector) {
-      _firstFocusableChild = root.querySelector('.' + firstFocusableSelector);
+    if (focusSelector) {
+      _firstFocusableChild = root.querySelector('.' + focusSelector);
     } else {
       _firstFocusableChild = getNextElement(root, root.firstChild as HTMLElement, true, false, false, true);
     }
diff --git a/packages/office-ui-fabric-react/src/components/Modal/Modal.Props.ts b/packages/office-ui-fabric-react/src/components/Modal/Modal.Props.ts
index 25619c98f383a..8aa8059196d66 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/Modal.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Modal/Modal.Props.ts
@@ -4,7 +4,10 @@ import { IWithResponsiveModeState } from '../../utilities/decorators/withRespons
 import { IAccessiblePopupProps } from '../../common/IAccessiblePopupProps';
 
 export interface IModal {
-
+  /**
+   * Sets focus on the first focusable, or configured, child in focus trap zone
+   */
+  focus: () => void;
 }
 
 export interface IModalProps extends React.Props<Modal>, IWithResponsiveModeState, IAccessiblePopupProps {
@@ -66,4 +69,4 @@ export interface IModalProps extends React.Props<Modal>, IWithResponsiveModeStat
    * ARIA id for the subtitle of the Modal, if any
    */
   subtitleAriaId?: string;
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx b/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
index b6e35ef5f8be4..508f34e80bad9 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
+++ b/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
@@ -4,8 +4,8 @@ import {
   css,
   getId
 } from '../../Utilities';
-import { FocusTrapZone } from '../FocusTrapZone/index';
-import { IModalProps } from './Modal.Props';
+import { FocusTrapZone, IFocusTrapZone } from '../FocusTrapZone/index';
+import { IModalProps, IModal } from './Modal.Props';
 import { Overlay } from '../../Overlay';
 import { Layer } from '../../Layer';
 import { Popup } from '../Popup/index';
@@ -23,7 +23,7 @@ export interface IDialogState {
 }
 
 @withResponsiveMode
-export class Modal extends BaseComponent<IModalProps, IDialogState> {
+export class Modal extends BaseComponent<IModalProps, IDialogState> implements IModal {
 
   public static defaultProps: IModalProps = {
     isOpen: false,
@@ -34,6 +34,7 @@ export class Modal extends BaseComponent<IModalProps, IDialogState> {
   };
 
   private _onModalCloseTimer: number;
+  private _focusTrapZone: IFocusTrapZone | undefined;
 
   constructor(props: IModalProps) {
     super(props);
@@ -121,6 +122,7 @@ export class Modal extends BaseComponent<IModalProps, IDialogState> {
             <div className={ modalClassName }>
               <Overlay isDarkThemed={ isDarkOverlay } onClick={ isBlocking ? undefined : (onDismiss as any) } />
               <FocusTrapZone
+                componentRef={this._resolveRef('_focusTrapZone')}
                 className={ css('ms-Dialog-main', styles.main, this.props.containerClassName) }
                 elementToFocusOnDismiss={ elementToFocusOnDismiss }
                 isClickableOutsideFocusTrap={ isClickableOutsideFocusTrap ? isClickableOutsideFocusTrap : !isBlocking }
@@ -138,6 +140,10 @@ export class Modal extends BaseComponent<IModalProps, IDialogState> {
     return null;
   }
 
+  public focus() {
+    this._focusTrapZone && this._focusTrapZone.focus();
+  }
+
   // Watch for completed animations and set the state
   private _onModalClose() {
     this.setState({

From ca0cb8001b1f5eb564b218921b15e9906e096fc0 Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Tue, 10 Oct 2017 09:59:43 -0700
Subject: [PATCH 0812/1641] ComboBox: Adding props to control height and width
 of Callout (#2918)

* no message

* no message

* Updating properties for quick compose

* Change file

* Fixing lint errors

* Updating based on feedback

* Removing redundant prop

* Updating prop for styling - Added to comboBoxOptionStyles.

* Testing update to adding width style

* Fixing optionsContainerWrapper prop

* Removing unnecessary imports and test code

* Removing unnecessary addition

* Fixing redundant code

* Found and removed more unnecessary additions
---
 .../kegorr-CalloutStyles_2017-09-21-23-18.json      | 11 +++++++++++
 .../src/components/Callout/Callout.Props.ts         |  6 ++++++
 .../src/components/Callout/CalloutContent.tsx       |  7 +++++--
 .../src/components/ComboBox/ComboBox.Props.ts       |  5 +++++
 .../src/components/ComboBox/ComboBox.classNames.ts  |  7 ++++++-
 .../src/components/ComboBox/ComboBox.styles.ts      |  9 +++++++--
 .../src/components/ComboBox/ComboBox.tsx            | 13 ++++++-------
 7 files changed, 46 insertions(+), 12 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-CalloutStyles_2017-09-21-23-18.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-CalloutStyles_2017-09-21-23-18.json b/common/changes/office-ui-fabric-react/kegorr-CalloutStyles_2017-09-21-23-18.json
new file mode 100644
index 0000000000000..b294662361c1a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-CalloutStyles_2017-09-21-23-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Adding props to control height and width of Callout ",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts b/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
index ce0a311970602..d352f19a9ee41 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
@@ -175,4 +175,10 @@ export interface ICalloutProps extends React.Props<Callout | CalloutContent> {
     * @deprecated
     */
   beakStyle?: string;
+
+  /**
+   * Set max height of callout
+   * When not set the callout will expand with contents up to the bottom of the screen
+   */
+  calloutMaxHeight?: number;
 }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index d5fb86f3086ac..bf51d4f428986 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -116,7 +116,8 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       beakWidth,
       calloutWidth,
       finalHeight,
-      backgroundColor } = this.props;
+      backgroundColor,
+      calloutMaxHeight } = this.props;
     let { positions } = this.state;
     let beakStyleWidth = beakWidth;
 
@@ -140,7 +141,9 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       ? (AnimationClassNames as any)[positions.directionalClassName]
       : '';
 
-    let contentMaxHeight: number = this._getMaxHeight() + this.state.heightOffset!;
+    let getContentMaxHeight: number = this._getMaxHeight() + this.state.heightOffset!;
+    let contentMaxHeight: number = calloutMaxHeight! && (calloutMaxHeight! > getContentMaxHeight) ? getContentMaxHeight : calloutMaxHeight!;
+
     let beakVisible = isBeakVisible && (!!target);
 
     let content = (
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
index bbd355b2abc24..b559e79531050 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
@@ -166,6 +166,11 @@ export interface IComboBoxStyles {
    */
   callout: IStyle;
 
+  /**
+  * Styles for the optionsContainerWrapper.
+  */
+  optionsContainerWrapper: IStyle;
+
   /**
    * Styles for the container of all the Combobox options
    * Includes the headers and dividers.
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
index 448c587750fa5..084ec716a9e51 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
@@ -14,6 +14,7 @@ export interface IComboBoxClassNames {
   optionsContainer: string;
   header: string;
   divider: string;
+  optionsContainerWrapper: string;
 }
 
 export interface IComboBoxOptionClassNames {
@@ -68,6 +69,10 @@ export const getClassNames = memoizeFunction((
       'ms-ComboBox-callout',
       styles.callout
     ),
+    optionsContainerWrapper: mergeStyles(
+      'ms-ComboBox-optionsContainerWrapper',
+      styles.optionsContainerWrapper
+    ),
     optionsContainer: mergeStyles(
       'ms-ComboBox-optionsContainer',
       styles.optionsContainer
@@ -94,4 +99,4 @@ export const getComboBoxOptionClassNames = memoizeFunction((
       styles.optionText
     ),
   };
-});
\ No newline at end of file
+});
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index 1c076b5d676ce..d435e2a83a9cd 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -51,7 +51,7 @@ const getListOptionHighContrastStyles = memoizeFunction((theme: ITheme): IRawSty
 export const getOptionStyles = memoizeFunction((
   theme: ITheme,
   customStylesForAllOptions?: Partial<IComboBoxOptionStyles>,
-  customOptionStylesForCurrentOption?: Partial<IComboBoxOptionStyles>,
+  customOptionStylesForCurrentOption?: Partial<IComboBoxOptionStyles>
 ): Partial<IComboBoxOptionStyles> => {
 
   const { semanticColors, palette } = theme;
@@ -132,7 +132,7 @@ export const getOptionStyles = memoizeFunction((
       wordWrap: 'break-word',
       overflowWrap: 'break-word',
       margin: '1px',
-    },
+    }
   };
 
   return concatStyleSets(optionStyles, customStylesForAllOptions, customOptionStylesForCurrentOption);
@@ -179,6 +179,7 @@ export const getCaretDownButtonStyles = memoizeFunction((
 export const getStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: Partial<IComboBoxStyles>,
+  comboBoxOptionWidth?: string,
 ): Partial<IComboBoxStyles> => {
 
   const { semanticColors, fonts, palette } = theme;
@@ -285,6 +286,10 @@ export const getStyles = memoizeFunction((
       borderColor: ComboBoxCalloutBorderColor,
     },
 
+    optionsContainerWrapper: {
+      width: comboBoxOptionWidth
+    },
+
     optionsContainer: {
       display: 'block'
     },
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 6c83d82db8167..fcac264f3b12f 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -16,12 +16,9 @@ import {
   getId,
   getNativeProps,
   KeyCodes,
+  customizable
 } from '../../Utilities';
 import { SelectableOptionMenuItemType, ISelectableOption } from '../../utilities/selectableOption/SelectableOption.Props';
-
-import {
-  customizable,
-} from '../../Utilities';
 import {
   getStyles,
   getOptionStyles,
@@ -29,7 +26,7 @@ import {
 } from './ComboBox.styles';
 import {
   IComboBoxClassNames,
-  getClassNames,
+  getClassNames
 } from './ComboBox.classNames';
 
 export interface IComboBoxState {
@@ -233,8 +230,10 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
     let hasErrorMessage = (errorMessage && errorMessage.length > 0) ? true : false;
 
+    let setWidth = isOpen ? (this._comboBoxWrapper.clientWidth - 2) + 'px' : undefined;
+
     this._classNames = getClassNames(
-      getStyles(theme!, customStyles),
+      getStyles(theme!, customStyles, setWidth),
       className!,
       !!isOpen,
       !!disabled,
@@ -779,7 +778,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         onDismiss={ this._onDismiss }
         setInitialFocus={ false }
       >
-        <div ref={ this._resolveRef('_comboBoxMenu') } style={ { width: this._comboBoxWrapper.clientWidth - 2 } }>
+        <div className={ this._classNames.optionsContainerWrapper } ref={ this._resolveRef('_comboBoxMenu') }>
           { (onRenderList as any)({ ...props }, this._onRenderList) }
         </div>
       </Callout>

From 675c5045199e3d972e1c21a022138452b1c5e297 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 10 Oct 2017 12:44:22 -0700
Subject: [PATCH 0813/1641] MessageBar: Replaced DefaultButton with
 MessageBarButton (#3080)

* Added MessageBarButton to MessageBar

* Added change file
---
 apps/vr-tests/src/stories/MessageBar.stories.tsx   |  6 +++---
 ...messageBarExamples-button_2017-10-10-18-39.json | 11 +++++++++++
 .../src/components/Button/index.ts                 |  1 +
 .../examples/MessageBar.Basic.Example.tsx          | 14 +++++++-------
 4 files changed, 22 insertions(+), 10 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/messageBarExamples-button_2017-10-10-18-39.json

diff --git a/apps/vr-tests/src/stories/MessageBar.stories.tsx b/apps/vr-tests/src/stories/MessageBar.stories.tsx
index 863c86acbad8a..3f4572e25e606 100644
--- a/apps/vr-tests/src/stories/MessageBar.stories.tsx
+++ b/apps/vr-tests/src/stories/MessageBar.stories.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 import Screener, { Steps } from 'screener-storybook/src/screener';
 import { storiesOf } from '@storybook/react';
 import { FabricDecorator } from '../utilities';
-import { DefaultButton, Link, MessageBar, IMessageBarProps, MessageBarType } from 'office-ui-fabric-react';
+import { MessageBarButton, Link, MessageBar, IMessageBarProps, MessageBarType } from 'office-ui-fabric-react';
 
 let noop = (): void => { /**/ };
 // tslint:disable-next-line:max-line-length
@@ -29,8 +29,8 @@ storiesOf('MessageBar', module)
     <MessageBar
       actions={
         <div>
-          <DefaultButton>Yes</DefaultButton>
-          <DefaultButton>No</DefaultButton>
+          <MessageBarButton>Yes</MessageBarButton>
+          <MessageBarButton>No</MessageBarButton>
         </div>
       }
     >Info/default message bar. { link }
diff --git a/common/changes/office-ui-fabric-react/messageBarExamples-button_2017-10-10-18-39.json b/common/changes/office-ui-fabric-react/messageBarExamples-button_2017-10-10-18-39.json
new file mode 100644
index 0000000000000..f6216f8f44537
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/messageBarExamples-button_2017-10-10-18-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "MessageBar: replaced DefaultButton with MessageBarButton.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/index.ts b/packages/office-ui-fabric-react/src/components/Button/index.ts
index a690e69219e52..bae3414502f70 100644
--- a/packages/office-ui-fabric-react/src/components/Button/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/index.ts
@@ -7,5 +7,6 @@ export * from './CommandButton/CommandButton';
 export * from './CompoundButton/CompoundButton';
 export * from './DefaultButton/DefaultButton';
 export * from './CommandButton/CommandButton';
+export * from './MessageBarButton/MessageBarButton';
 export * from './PrimaryButton/PrimaryButton';
 export * from './IconButton/IconButton';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx
index 3d8d35360d86d..a037bdee35358 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx
@@ -1,7 +1,7 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
-import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
+import { MessageBarButton } from 'office-ui-fabric-react/lib/Button';
 import { Link } from 'office-ui-fabric-react/lib/Link';
 import { Label } from 'office-ui-fabric-react/lib/Label';
 import { MessageBar, MessageBarType } from 'office-ui-fabric-react/lib/MessageBar';
@@ -38,8 +38,8 @@ export const MessageBarBasicExample = () => (
       messageBarType={ MessageBarType.severeWarning }
       actions={
         <div>
-          <DefaultButton>Yes</DefaultButton>
-          <DefaultButton>No</DefaultButton>
+          <MessageBarButton>Yes</MessageBarButton>
+          <MessageBarButton>No</MessageBarButton>
         </div>
       }
     >
@@ -51,8 +51,8 @@ export const MessageBarBasicExample = () => (
     <MessageBar
       actions={
         <div>
-          <DefaultButton>Yes</DefaultButton>
-          <DefaultButton>No</DefaultButton>
+          <MessageBarButton>Yes</MessageBarButton>
+          <MessageBarButton>No</MessageBarButton>
         </div>
       }
       messageBarType={ MessageBarType.success }
@@ -68,8 +68,8 @@ export const MessageBarBasicExample = () => (
       ariaLabel='Aria help text here'
       actions={
         <div>
-          <DefaultButton>Yes</DefaultButton>
-          <DefaultButton>No</DefaultButton>
+          <MessageBarButton>Yes</MessageBarButton>
+          <MessageBarButton>No</MessageBarButton>
         </div>
       }
     >

From a5d4c61fb6825f3e1fa5fa84bf230bb7af827c57 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Tue, 10 Oct 2017 12:52:39 -0700
Subject: [PATCH 0814/1641] SpinButton: fix spinButtonPage code reference for
 the stateful spinButton example (#3081)

* update code reference on the spinButtonPage for the stateful spinButton #3023

* rush change
---
 ...xSpinButtonPageCodeReference_2017-10-10-19-17.json | 11 +++++++++++
 .../src/components/SpinButton/SpinButtonPage.tsx      |  3 ++-
 2 files changed, 13 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-FixSpinButtonPageCodeReference_2017-10-10-19-17.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-FixSpinButtonPageCodeReference_2017-10-10-19-17.json b/common/changes/office-ui-fabric-react/jspurlin-FixSpinButtonPageCodeReference_2017-10-10-19-17.json
new file mode 100644
index 0000000000000..9ee7d5f0020ef
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-FixSpinButtonPageCodeReference_2017-10-10-19-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SpinButton: Fix the code reference for the stateful spinButton Example (#3023)",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
index 8e0caece1d291..a96c4de72605e 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
@@ -16,6 +16,7 @@ import { SpinButtonStatus } from './SpinButton.checklist';
 
 const SpinButtonBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx') as string;
 const SpinButtonBasicDisabledExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicDisabled.Example.tsx') as string;
+const SpinButtonStatefulExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx') as string;
 const SpinButtonBasicWithIconExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx') as string;
 const SpinButtonBasicWithEndPositionExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithEndPosition.Example.tsx') as string;
 const SpinButtonCustomStyledExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.CustomStyled.Example.tsx') as string;
@@ -42,7 +43,7 @@ export class SpinButtonPage extends React.Component<IComponentDemoPageProps, {}>
             </ExampleCard>
             <ExampleCard
               title={ 'Stateful SpinButton' }
-              code={ SpinButtonBasicExampleCode }
+              code={ SpinButtonStatefulExampleCode }
             >
               <SpinButtonStatefulExample />
             </ExampleCard>

From eaf09a9911bf60cddc9e9efeb75ab5aa994ce31e Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Tue, 10 Oct 2017 19:08:15 -0700
Subject: [PATCH 0815/1641] Contextual Menu: Fix typings for getMenuClassNames
 (#3083)

* Update the typing of classNames for contextualMenu's classNames function

* Rush change
---
 .../className-typing_2017-10-11-01-05.json            | 11 +++++++++++
 .../components/ContextualMenu/ContextualMenu.Props.ts |  2 +-
 .../ContextualMenu/ContextualMenu.classNames.ts       |  2 +-
 .../src/components/ContextualMenu/ContextualMenu.tsx  |  2 +-
 4 files changed, 14 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/className-typing_2017-10-11-01-05.json

diff --git a/common/changes/office-ui-fabric-react/className-typing_2017-10-11-01-05.json b/common/changes/office-ui-fabric-react/className-typing_2017-10-11-01-05.json
new file mode 100644
index 0000000000000..ea83d7d77e7eb
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/className-typing_2017-10-11-01-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: Update the typing for getMenuClassNames",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
index 580114d5ab3bd..9a57e7c0de129 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
@@ -201,7 +201,7 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
    * defined in ContextualMenu.classnames.
    * @default getContextualMenuClassNames
    */
-  getMenuClassNames?: (theme: ITheme, className: string) => IContextualMenuClassNames;
+  getMenuClassNames?: (theme: ITheme, className?: string) => IContextualMenuClassNames;
 
   /**
   * Method to provide the classnames to style the individual items inside a menu. Default value is the getItemClassnames func
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
index f00b2801ce943..d9854d3b6d203 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
@@ -22,7 +22,7 @@ export interface IMenuItemClassNames {
 
 export const getContextualMenuClassNames = memoizeFunction((
   theme: ITheme,
-  className: string
+  className?: string
 ): IContextualMenuClassNames => {
 
   const styles = getContextualMenuStyles(theme);
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index dcd28b28d2b17..9cc53496db34d 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -202,7 +202,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     } = this.props;
 
     let menuClassNames = this.props.getMenuClassNames ? this.props.getMenuClassNames : getContextualMenuClassNames;
-    this._classNames = menuClassNames(theme!, className!);
+    this._classNames = menuClassNames(theme!, className);
 
     let hasIcons = itemsHaveIcons(items);
 

From c87b63af4c370b51d4432ee33e9d981afd653671 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 10 Oct 2017 21:51:02 -0700
Subject: [PATCH 0816/1641] Update TESTING.md

---
 ghdocs/TESTING.md | 125 +++++++++++++++++++++++++++++++---------------
 1 file changed, 86 insertions(+), 39 deletions(-)

diff --git a/ghdocs/TESTING.md b/ghdocs/TESTING.md
index 88a1e6ab9265e..e3916c6cb0058 100644
--- a/ghdocs/TESTING.md
+++ b/ghdocs/TESTING.md
@@ -1,59 +1,106 @@
 # Testing
 
-## Basics
+## Overview
 
-Our tests are built with [Mocha](https://mochajs.org/), [Chai](http://chaijs.com/), and
-[ReactTestUtils](https://facebook.github.io/react/docs/test-utils.html).
+Our tests are built using [Jest](https://facebook.github.io/jest/). This allows us to run tests in a node environment, and simulates the browser using jsdom.
+
+For snapshot testing, we use `react-test-renderer` and Jest apis.
+
+For creating React functional tests, we use [Enzyme](http://airbnb.io/enzyme/) to automate rendering. This gives us helpers for mounting a component, accessing elements rendered by it, and simulating clicks and keypresses.
+
+## Running tests
 
 To run tests:
 
-1. In command prompt navigate to the appropriate package, for example git/office-ui-fabric-react/packages/office-ui-fabric-react
-2. Run `npm run start-test` to start jest and run the tests
-  * By default, jest will run tests affected by your uncommitted changes
-  * To run all tests, press 'a' at the prompt
-  * To filter the tests run, press `p` or `t` to filter by filename or test name regex pattern, respectively
+In command prompt navigate to the appropriate package, for example `packages/office-ui-fabric-react`
 
-## Examples
+To just validate everything works, run `npm run build`, which will build the project including running tslint and jest for tests.
 
-### Basic ReactTestUtils Example
-```typescript
-describe('ComponentName', () => {
+To actively develop tests, you can use Jest watch mode by running `npm run start-test`.
 
-  it('does foo', () => {
-    let component = ReactTestUtils.renderIntoDocument(
-      <ComponentName
-        componentProps={props}}
-        />
-    );
-      let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
-      let componentName = renderedDOM.querySelector('<unique selector>');
-      expect(componentName).to.be.eq('foo', 'componentName was not foo');
+To debug tests, you can us Visual Studio Code. Inside of a `*.test.ts` file, add a `debugger` statement where you want to break, and hit F5 to start debugging.
+
+## Writing tests
+
+### Simple unit testing
+
+Tests in Jest are written similar to mocha tests, though Jest includes a number of assertions that work similar to chai. A basic test example:
+
+```ts
+describe('thing', () => {
+  it('does something', () => {
+    expect(thing.something()).toEqual(aValue);
   });
 });
 ```
 
-### Basic Example Without ReactTestUtils
+Note that you do not need to import the assertions or the Jest APIs; they should be available automatically through the included typings.
+
+### Snapshot testing
+
+Jest enables you to create snapshot tests. Snapshots simply compare a JSON object with an expected output. The assertion `toMatchSnapshot` api will abstract loading a .snap file for the test to compare, or will create one if none exists.
 
 ```typescript
-describe('ComponentName', () => {
-
-  it('can render item in dom', () => {
-    let root = document.createElement('div');
-    document.body.appendChild(root);
-    ReactDOM.render<HTMLDivElement>(
-      <ComponentName
-        componentProps={props}}
-        />, root
-      );
-    let componentName = document.querySelector('<unique selector>');
-    // Write assertions.
+import * as React from 'react';
+import { CommandBar } from './CommandBar';
+import * as renderer from 'react-test-renderer';
+
+describe('CommandBar', () => {
+  it('renders commands correctly', () => {
+    expect(renderer.create(
+      <CommandBar
+        items={ [
+          { key: '1', name: 'name 1' },
+          { key: '2', name: 'name 2' }
+        ] }
+      />
+    ).toJSON()).toMatchSnapshot();
   });
 });
 ```
 
-## Some Common Problems
+If you ever break a snapshot, you can update all baselines either manually, or using the `npm run update-snapshots` command within a given package folder. Currently the `office-ui-fabric-react` and `experiments` packages both have snapshot testing enabled.
+
+### Functional testing
+
+In cases where you need to automate a component and validate it performs correctly, you can use [Enzyme](http://airbnb.io/enzyme/) apis to mount components, evaluate dom structure, and simulate events.
+
+```
+  it('opens a menu with IContextualMenuItem.subMenuProps.items property', () => {
+    const commandBar = mount<CommandBar>(
+      <CommandBar
+        items={ [
+          {
+            name: 'TestText 1',
+            key: 'TestKey1',
+            className: 'MenuItem',
+            subMenuProps: {
+              items: [
+                {
+                  name: 'SubmenuText 1',
+                  key: 'SubmenuKey1',
+                  className: 'SubMenuClass'
+                }
+              ]
+            }
+          },
+        ] }
+      />
+    );
+
+    const menuItem = commandBar.find('.MenuItem button');
+    expect(menuItem.length).toEqual(1);
+    menuItem.simulate('click');
+    expect(document.querySelector('.SubMenuClass')).toBeDefined();
+  });
+```
+
+## FAQ
+
+*Q. Browser methods aren't working.*
+
+A. Using browser methods like getBoundingClientRect won't work when using enzyme to render a document fragment. It's possible to mock this method out if you need, see the `FocusZone` unit tests as an example. You can also render the objects inside the actual dom, see [Example Without ReactTestUtils](#basic-example-without-reacttestutils) for more information.
+
+*Q. My event isn't being triggered.*
 
-* Browser methods aren't working.
-  * Using browser methods like getBoundingClientRect won't work when using ReactTestUtils to render a document fragment. It's possible to mock this method out if you need, see the FocusZone unit tests as an example. You can also render the objects inside the actual dom, see [Example Without ReactTestUtils](#basic-example-without-reacttestutils) for more information.
-* My event isn't being triggered.
-  * React uses synthetic events, so you should will need to use the synthetic events. For example ReactTestUtils.Simulate.change(<yourelement>)
+A. Make sure to use Enzyme `simulate` api to simulate React events. For example: `menuItem.simulate('click');`

From bbc48c049176b59b91e25248482f9765805fe35c Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 10 Oct 2017 21:51:34 -0700
Subject: [PATCH 0817/1641] Update TESTING.md

---
 ghdocs/TESTING.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ghdocs/TESTING.md b/ghdocs/TESTING.md
index e3916c6cb0058..0b5b65752562f 100644
--- a/ghdocs/TESTING.md
+++ b/ghdocs/TESTING.md
@@ -99,7 +99,7 @@ In cases where you need to automate a component and validate it performs correct
 
 *Q. Browser methods aren't working.*
 
-A. Using browser methods like getBoundingClientRect won't work when using enzyme to render a document fragment. It's possible to mock this method out if you need, see the `FocusZone` unit tests as an example. You can also render the objects inside the actual dom, see [Example Without ReactTestUtils](#basic-example-without-reacttestutils) for more information.
+A. Using browser methods like getBoundingClientRect won't work when using enzyme to render a document fragment. It's possible to mock this method out if you need, see the `FocusZone` unit tests as an example.
 
 *Q. My event isn't being triggered.*
 

From 01b176d8a4cc84627f69211a432931479ec416a2 Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Wed, 11 Oct 2017 00:54:59 -0500
Subject: [PATCH 0818/1641] Contextual Menu: Move getItemClassNames from
 ContextualMenuProps to IContextualMenuItem (#3085)

* Move getItemClassnNames for ContextualMenuProps to IContextualMenuItem

* Add npm run change file

* Fix nit camel case issue with param names in getItemClassNames
---
 ...ozano-ContextualMenu_2017-10-11-05-19.json | 11 +++++++
 .../ContextualMenu/ContextualMenu.Props.ts    | 32 +++++++++----------
 .../ContextualMenu/ContextualMenu.tsx         |  3 +-
 3 files changed, 28 insertions(+), 18 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/malozano-ContextualMenu_2017-10-11-05-19.json

diff --git a/common/changes/office-ui-fabric-react/malozano-ContextualMenu_2017-10-11-05-19.json b/common/changes/office-ui-fabric-react/malozano-ContextualMenu_2017-10-11-05-19.json
new file mode 100644
index 0000000000000..424ef2764105f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-ContextualMenu_2017-10-11-05-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "\"Move getItemClassnNames forontextualMenuProps to IContextualMenuItem\"",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
index 9a57e7c0de129..44fec4fb9dc3b 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
@@ -203,22 +203,6 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
    */
   getMenuClassNames?: (theme: ITheme, className?: string) => IContextualMenuClassNames;
 
-  /**
-  * Method to provide the classnames to style the individual items inside a menu. Default value is the getItemClassnames func
-  * defined in ContextualMenu.classnames.
-  * @default getItemClassNames
-  */
-  getItemClassNames?: (theme: ITheme,
-    disabled: boolean,
-    expanded: boolean,
-    checked: boolean,
-    isAnchorLink: boolean,
-    knownIcon: boolean,
-    itemClassname: string,
-    dividerClassName: string,
-    iconClassname: string,
-    subMenuClassname: string) => IMenuItemClassNames;
-
   /** Method to call when trying to render a submenu. */
   onRenderSubMenu?: IRenderFunction<IContextualMenuProps>;
 }
@@ -321,6 +305,22 @@ export interface IContextualMenuItem {
    */
   subMenuProps?: IContextualMenuProps;
 
+  /**
+  * Method to provide the classnames to style the individual items inside a menu. Default value is the getItemClassnames func
+  * defined in ContextualMenu.classnames.
+  * @default getItemClassNames
+  */
+  getItemClassNames?: (theme: ITheme,
+    disabled: boolean,
+    expanded: boolean,
+    checked: boolean,
+    isAnchorLink: boolean,
+    knownIcon: boolean,
+    itemClassName: string,
+    dividerClassName: string,
+    iconClassName: string,
+    subMenuClassName: string) => IMenuItemClassNames;
+
   /**
    *  Properties to apply to render this item as a section.
    *  This prop is mutually exclusive with subMenuProps.
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 9cc53496db34d..0ccfe98a15e70 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -105,7 +105,6 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     beakWidth: 16,
     arrowDirection: FocusZoneDirection.vertical,
     getMenuClassNames: getContextualMenuClassNames,
-    getItemClassNames: getItemClassNames,
   };
 
   private _host: HTMLElement;
@@ -309,7 +308,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     // We only send a dividerClassName when the item to be rendered is a divider. For all other cases, the default divider style is used.
     let dividerClassName = item.itemType === ContextualMenuItemType.Divider ? item.className : undefined;
     let subMenuIconClassName = item.submenuIconProps ? item.submenuIconProps.className : '';
-    let getClassNames = this.props.getItemClassNames ? this.props.getItemClassNames : getItemClassNames;
+    let getClassNames = item.getItemClassNames ? item.getItemClassNames : getItemClassNames;
     let itemClassNames = getClassNames(
       this.props.theme!,
       !!item.disabled,

From 1b838c033d2c89ca180328c8b98167d06810fbaf Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 11 Oct 2017 10:11:04 +0000
Subject: [PATCH 0819/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../className-typing_2017-10-11-01-05.json    | 11 -----
 ...tonPageCodeReference_2017-10-10-19-17.json | 11 -----
 ...kegorr-CalloutStyles_2017-09-21-23-18.json | 11 -----
 ...ozano-ContextualMenu_2017-10-11-05-19.json | 11 -----
 ...geBarExamples-button_2017-10-10-18-39.json | 11 -----
 ...al-control-focustrap_2017-09-15-09-54.json | 11 -----
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 41 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 17 +++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 15 files changed, 64 insertions(+), 74 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/className-typing_2017-10-11-01-05.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-FixSpinButtonPageCodeReference_2017-10-10-19-17.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-CalloutStyles_2017-09-21-23-18.json
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-ContextualMenu_2017-10-11-05-19.json
 delete mode 100644 common/changes/office-ui-fabric-react/messageBarExamples-button_2017-10-10-18-39.json
 delete mode 100644 common/changes/office-ui-fabric-react/modal-control-focustrap_2017-09-15-09-54.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 4517c97c6a400..7cdb1f3e1ecdb 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.1.1 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.5.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.7.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index a7c31e68a3faf..e3622fd905373 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.6.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.7.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 58a1085d068b9..076daca38c92f 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.6.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.7.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 438e1f3dcba09..2a84f371373a7 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.6.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.7.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 51d85eb31a3a5..51524d1fbaa42 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.6.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.7.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/className-typing_2017-10-11-01-05.json b/common/changes/office-ui-fabric-react/className-typing_2017-10-11-01-05.json
deleted file mode 100644
index ea83d7d77e7eb..0000000000000
--- a/common/changes/office-ui-fabric-react/className-typing_2017-10-11-01-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: Update the typing for getMenuClassNames",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-FixSpinButtonPageCodeReference_2017-10-10-19-17.json b/common/changes/office-ui-fabric-react/jspurlin-FixSpinButtonPageCodeReference_2017-10-10-19-17.json
deleted file mode 100644
index 9ee7d5f0020ef..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-FixSpinButtonPageCodeReference_2017-10-10-19-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SpinButton: Fix the code reference for the stateful spinButton Example (#3023)",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kegorr-CalloutStyles_2017-09-21-23-18.json b/common/changes/office-ui-fabric-react/kegorr-CalloutStyles_2017-09-21-23-18.json
deleted file mode 100644
index b294662361c1a..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-CalloutStyles_2017-09-21-23-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Adding props to control height and width of Callout ",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/malozano-ContextualMenu_2017-10-11-05-19.json b/common/changes/office-ui-fabric-react/malozano-ContextualMenu_2017-10-11-05-19.json
deleted file mode 100644
index 424ef2764105f..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-ContextualMenu_2017-10-11-05-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "\"Move getItemClassnNames forontextualMenuProps to IContextualMenuItem\"",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/messageBarExamples-button_2017-10-10-18-39.json b/common/changes/office-ui-fabric-react/messageBarExamples-button_2017-10-10-18-39.json
deleted file mode 100644
index f6216f8f44537..0000000000000
--- a/common/changes/office-ui-fabric-react/messageBarExamples-button_2017-10-10-18-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "MessageBar: replaced DefaultButton with MessageBarButton.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/modal-control-focustrap_2017-09-15-09-54.json b/common/changes/office-ui-fabric-react/modal-control-focustrap_2017-09-15-09-54.json
deleted file mode 100644
index dcf73431abae2..0000000000000
--- a/common/changes/office-ui-fabric-react/modal-control-focustrap_2017-09-15-09-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Make Modal's FocusTrapZone controllable",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "asmundg@big-oil.org"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 1d1eaa85f9001..847c798acee2f 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -42,7 +42,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.6.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.7.0 <6.0.0",
     "@uifabric/icons": ">=5.1.1 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 8cd8569992cd0..223e88ce35195 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,47 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.7.0",
+      "tag": "office-ui-fabric-react_v5.7.0",
+      "date": "Wed, 11 Oct 2017 10:11:04 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "eaf09a9911bf60cddc9e9efeb75ab5aa994ce31e",
+            "comment": "ContextualMenu: Update the typing for getMenuClassNames"
+          },
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "a5d4c61fb6825f3e1fa5fa84bf230bb7af827c57",
+            "comment": "SpinButton: Fix the code reference for the stateful spinButton Example (#3023)"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "675c5045199e3d972e1c21a022138452b1c5e297",
+            "comment": "MessageBar: replaced DefaultButton with MessageBarButton."
+          }
+        ],
+        "minor": [
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "ca0cb8001b1f5eb564b218921b15e9906e096fc0",
+            "comment": "ComboBox: Adding props to control height and width of Callout "
+          },
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "01b176d8a4cc84627f69211a432931479ec416a2",
+            "comment": "\"Move getItemClassnNames forontextualMenuProps to IContextualMenuItem\""
+          },
+          {
+            "author": "Åsmund Grammeltvedt <asmundg@big-oil.org>",
+            "commit": "f9e4082480124499ecb92efcbb3967fd1ae07d6e",
+            "comment": "Make Modal's FocusTrapZone controllable"
+          }
+        ]
+      }
+    },
     {
       "version": "5.6.0",
       "tag": "office-ui-fabric-react_v5.6.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 3367b4cac9f3b..2c9943e3d3082 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,21 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 10 Oct 2017 10:24:47 GMT and should not be manually modified.
+This log was last generated on Wed, 11 Oct 2017 10:11:04 GMT and should not be manually modified.
+
+## 5.7.0
+Wed, 11 Oct 2017 10:11:04 GMT
+
+### Minor changes
+
+- ComboBox: Adding props to control height and width of Callout 
+- "Move getItemClassnNames forontextualMenuProps to IContextualMenuItem"
+- Make Modal's FocusTrapZone controllable
+
+### Patches
+
+- ContextualMenu: Update the typing for getMenuClassNames
+- SpinButton: Fix the code reference for the stateful spinButton Example (#3023)
+- MessageBar: replaced DefaultButton with MessageBarButton.
 
 ## 5.6.0
 Tue, 10 Oct 2017 10:24:47 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 57dc808de8d04..37c14f93b276e 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.6.0",
+  "version": "5.7.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 952448bde2b85671c84c1c074a18eedfeb90c615 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Wed, 11 Oct 2017 14:24:38 -0700
Subject: [PATCH 0820/1641] Add promise polyfill to fabric website (#3090)

* Add promise polyfill to fabric website

* Add change file
---
 apps/fabric-website/src/root.tsx                      |  1 +
 .../website-promise-polyfill_2017-10-11-19-14.json    | 11 +++++++++++
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/@uifabric/fabric-website/website-promise-polyfill_2017-10-11-19-14.json

diff --git a/apps/fabric-website/src/root.tsx b/apps/fabric-website/src/root.tsx
index 867c06a9e6d91..f2966c313bf06 100644
--- a/apps/fabric-website/src/root.tsx
+++ b/apps/fabric-website/src/root.tsx
@@ -1,3 +1,4 @@
+require('es6-promise').polyfill();
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
diff --git a/common/changes/@uifabric/fabric-website/website-promise-polyfill_2017-10-11-19-14.json b/common/changes/@uifabric/fabric-website/website-promise-polyfill_2017-10-11-19-14.json
new file mode 100644
index 0000000000000..6b973e4c50478
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/website-promise-polyfill_2017-10-11-19-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Add promise polyfill",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "a.erich@gmail.com"
+}
\ No newline at end of file

From 5dc33511fdf44fbce652b590d807cef47bb82404 Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Wed, 11 Oct 2017 18:40:57 -0500
Subject: [PATCH 0821/1641] SpinButton: Fix label font size regression and
 improve disabled state style (#3093)

* Make spin button fontsize mdedium

* Make arrow keys visible when spinbutton is disabled

* Show label text as gray for disabled spinButtons

* Add npm run change file

* Change opacity back to 1 when in HighContrastMode
---
 ...malozano-spinButtonStyle_2017-10-11-22-37.json | 11 +++++++++++
 .../src/components/SpinButton/SpinButton.Props.ts |  5 +++++
 .../SpinButton/SpinButton.classNames.ts           |  3 ++-
 .../components/SpinButton/SpinButton.styles.ts    | 15 ++++++++++++---
 4 files changed, 30 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/malozano-spinButtonStyle_2017-10-11-22-37.json

diff --git a/common/changes/office-ui-fabric-react/malozano-spinButtonStyle_2017-10-11-22-37.json b/common/changes/office-ui-fabric-react/malozano-spinButtonStyle_2017-10-11-22-37.json
new file mode 100644
index 0000000000000..7828e3d2561b3
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-spinButtonStyle_2017-10-11-22-37.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "\"Update spinButton styling to have the right font size and disabled visuals\"",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts
index 65de5f3f5e512..9073df0870d4c 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts
@@ -200,6 +200,11 @@ export interface ISpinButtonStyles {
    */
   label: IStyle;
 
+  /**
+   * Style for the label text
+   */
+  labelDisabled: IStyle;
+
   /**
    * Style for spinButtonWrapper when enabled.
    */
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts
index 938de9dc72d3f..cdba7dff99c86 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts
@@ -33,7 +33,8 @@ export const getClassNames = memoizeFunction((
       styles.icon,
     ),
     label: mergeStyles(
-      styles.label
+      styles.label,
+      disabled && styles.labelDisabled
     ),
     spinButtonWrapper: mergeStyles(
       styles.spinButtonWrapper,
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
index 29b4f7fdbc3f3..727157fea5a12 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
@@ -78,9 +78,10 @@ export const getArrowButtonStyles = memoizeFunction((
       }
     },
     rootDisabled: {
-      opacity: 0,
+      opacity: 0.5,
       [MS_HIGHCONTRAST_ACTIVE]: {
-        color: 'GrayText'
+        color: 'GrayText',
+        opacity: 1,
       }
     },
     icon: {
@@ -118,6 +119,7 @@ export const getStyles = memoizeFunction((
   const SpinButtonRootBorderColorHovered = palette.neutralSecondary;
   const SpinButtonRootBorderColorFocused = palette.themePrimary;
 
+  const SpinButtonTextColorDisabled = palette.neutralTertiaryAlt;
   const SpinButtonInputTextColor = palette.neutralPrimary;
   const SpinButtonInputTextColorSelected = palette.white;
   const SpinButtonInputBackgroundColorSelected = palette.themePrimary;
@@ -125,7 +127,7 @@ export const getStyles = memoizeFunction((
   const defaultStyles: ISpinButtonStyles = {
     root: {
       outline: 'none',
-      fontSize: '12px',
+      fontSize: FontSizes.medium,
       width: '100%',
       minWidth: '86px',
       paddingTop: '2px',
@@ -165,6 +167,13 @@ export const getStyles = memoizeFunction((
       paddingBottom: '2px',
       paddingLeft: '0',
     },
+    labelDisabled: {
+      cursor: 'default',
+      color: SpinButtonTextColorDisabled,
+      [MS_HIGHCONTRAST_ACTIVE]: {
+        color: 'GrayText'
+      }
+    },
     spinButtonWrapper: {
       display: 'flex',
       height: '26px',

From abc8da0754be39be513d9f480e33c89411bb05df Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 11 Oct 2017 17:01:17 -0700
Subject: [PATCH 0822/1641] Fixing jest. (#3095)

---
 common/config/rush/npm-shrinkwrap.json        | 411 ++++++++----------
 .../src/components/Header/Header.tsx          |  13 +-
 .../MarqueeSelection/MarqueeSelection.tsx     |   6 +-
 scripts/package.json                          |  20 +-
 scripts/tasks/jest-resources.js               |   8 +-
 scripts/tasks/jest.js                         |   5 +-
 6 files changed, 226 insertions(+), 237 deletions(-)

diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 78265b6fe7feb..0412f16c2e7d3 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -46,8 +46,15 @@
           "bundled": true
         },
         "autoprefixer": {
-          "version": "7.1.2",
-          "bundled": true
+          "version": "7.1.5",
+          "bundled": true,
+          "dependencies": {
+            "browserslist": {
+              "version": "2.5.1",
+              "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.5.1.tgz",
+              "integrity": "sha512-jAvM2ku7YDJ+leAq3bFH1DE0Ylw+F+EQDq4GkqZfgPEqpWYw9ofQH85uKSB9r3Tv7XDbfqVtE+sdvKJW7IlPJA=="
+            }
+          }
         },
         "browserslist": {
           "version": "2.3.3",
@@ -88,38 +95,45 @@
           "bundled": true
         },
         "css-loader": {
-          "version": "0.28.5",
+          "version": "0.28.7",
           "bundled": true,
           "dependencies": {
             "ansi-regex": {
               "version": "2.1.1",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
+              "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
             },
             "chalk": {
               "version": "1.1.3",
-              "bundled": true,
+              "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+              "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
               "dependencies": {
                 "supports-color": {
                   "version": "2.0.0",
-                  "bundled": true
+                  "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+                  "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
                 }
               }
             },
             "has-flag": {
               "version": "1.0.0",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+              "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
             },
             "postcss": {
-              "version": "5.2.17",
-              "bundled": true
+              "version": "5.2.18",
+              "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+              "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
             },
             "strip-ansi": {
               "version": "3.0.1",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
+              "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8="
             },
             "supports-color": {
               "version": "3.2.3",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+              "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
             }
           }
         },
@@ -278,7 +292,7 @@
           "bundled": true
         },
         "tslint": {
-          "version": "5.6.0",
+          "version": "5.7.0",
           "bundled": true
         },
         "ultron": {
@@ -304,12 +318,13 @@
           "bundled": true
         },
         "webpack": {
-          "version": "3.5.5",
+          "version": "3.7.1",
           "bundled": true,
           "dependencies": {
             "yargs": {
               "version": "8.0.2",
-              "bundled": true
+              "resolved": "https://registry.npmjs.org/yargs/-/yargs-8.0.2.tgz",
+              "integrity": "sha1-YpmpBVsc78lp/355wdkY3Osiw2A="
             }
           }
         },
@@ -653,6 +668,10 @@
     "@rush-temp/experiments": {
       "version": "file:projects/experiments",
       "dependencies": {
+        "@uifabric/utilities": {
+          "version": "6.0.0",
+          "bundled": true
+        },
         "acorn": {
           "version": "5.1.1",
           "bundled": true
@@ -775,6 +794,10 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "office-ui-fabric-react": {
+          "version": "6.0.1",
+          "bundled": true
+        },
         "os-browserify": {
           "version": "0.2.1",
           "bundled": true
@@ -912,6 +935,10 @@
           "version": "0.14.19",
           "bundled": true
         },
+        "@uifabric/utilities": {
+          "version": "6.0.0",
+          "bundled": true
+        },
         "acorn": {
           "version": "5.1.1",
           "bundled": true
@@ -1030,6 +1057,10 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "office-ui-fabric-react": {
+          "version": "6.0.1",
+          "bundled": true
+        },
         "os-browserify": {
           "version": "0.2.1",
           "bundled": true
@@ -1577,6 +1608,10 @@
     "@rush-temp/ssr-tests": {
       "version": "file:projects/ssr-tests",
       "dependencies": {
+        "@uifabric/utilities": {
+          "version": "6.0.0",
+          "bundled": true
+        },
         "acorn": {
           "version": "5.1.1",
           "bundled": true
@@ -1691,6 +1726,10 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "office-ui-fabric-react": {
+          "version": "6.0.1",
+          "bundled": true
+        },
         "os-browserify": {
           "version": "0.2.1",
           "bundled": true
@@ -2051,6 +2090,10 @@
     "@rush-temp/test-bundle-button": {
       "version": "file:projects/test-bundle-button",
       "dependencies": {
+        "@uifabric/utilities": {
+          "version": "6.0.0",
+          "bundled": true
+        },
         "acorn": {
           "version": "5.1.1",
           "bundled": true
@@ -2119,6 +2162,10 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "office-ui-fabric-react": {
+          "version": "6.0.1",
+          "bundled": true
+        },
         "os-browserify": {
           "version": "0.2.1",
           "bundled": true
@@ -2262,7 +2309,21 @@
       }
     },
     "@rush-temp/todo-app": {
-      "version": "file:projects/todo-app"
+      "version": "file:projects/todo-app",
+      "dependencies": {
+        "@uifabric/utilities": {
+          "version": "6.0.0",
+          "bundled": true
+        },
+        "office-ui-fabric-react": {
+          "version": "6.0.1",
+          "bundled": true
+        },
+        "typescript": {
+          "version": "2.4.2",
+          "bundled": true
+        }
+      }
     },
     "@rush-temp/utilities": {
       "version": "file:projects/utilities",
@@ -2330,6 +2391,10 @@
     "@rush-temp/vr-tests": {
       "version": "file:projects/vr-tests",
       "dependencies": {
+        "@uifabric/utilities": {
+          "version": "6.0.0",
+          "bundled": true
+        },
         "ansi-styles": {
           "version": "2.2.1",
           "bundled": true
@@ -2352,6 +2417,10 @@
           "version": "1.0.0",
           "bundled": true
         },
+        "office-ui-fabric-react": {
+          "version": "6.0.1",
+          "bundled": true
+        },
         "postcss": {
           "version": "5.2.17",
           "bundled": true
@@ -2375,6 +2444,10 @@
         "supports-color": {
           "version": "3.2.3",
           "bundled": true
+        },
+        "typescript": {
+          "version": "2.4.2",
+          "bundled": true
         }
       }
     },
@@ -2441,9 +2514,9 @@
       "integrity": "sha1-6NZfg0ktKUT4FvxiB0GCHCioyQA="
     },
     "@types/cheerio": {
-      "version": "0.22.2",
-      "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.2.tgz",
-      "integrity": "sha512-7YJQbllem83umRzZ+ry6RZFAbBWNoHvbiW6tE5VEAJIoX6F22hrKrBw3ibRvHm2zPnOhZGrZJusAbp1zZKcLzQ=="
+      "version": "0.22.3",
+      "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.3.tgz",
+      "integrity": "sha512-E7MRbFAckaHrH5+CGngj5Iw9bJT1G4vqxqcQdOawdWegaKtgedbrGprHihLVLeADuMIS4H9CxAQzV561gD5buA=="
     },
     "@types/enzyme": {
       "version": "2.8.8",
@@ -2496,9 +2569,9 @@
       "integrity": "sha512-4c+e/QPfvSa48YhgGOcQWoHishTo6BuJqka0Bh8qeLdnK1jS+1Nz8W/w1G17AIjtLxONYFUqmi8qyt+8p/yMFA=="
     },
     "@types/react-test-renderer": {
-      "version": "15.5.4",
-      "resolved": "https://registry.npmjs.org/@types/react-test-renderer/-/react-test-renderer-15.5.4.tgz",
-      "integrity": "sha512-9gESAOcTd/sUuTdngpDpR8qTkDvxPOHNjedxzRyyTmXoqnMtBM04DfOEKmoM4ZuD2DrQVN4JRwpaE02hvsqH0A=="
+      "version": "15.5.5",
+      "resolved": "https://registry.npmjs.org/@types/react-test-renderer/-/react-test-renderer-15.5.5.tgz",
+      "integrity": "sha512-SEt2f9Hf+Y/OGstIDrINnls6wpeZGt9xiROBFjfMxXKbqg7zYkPVB7D58Rg9TZbi2kuxatchVTdiliYLs8WK0g=="
     },
     "@types/resemblejs": {
       "version": "1.3.28",
@@ -2521,24 +2594,24 @@
       "integrity": "sha1-MEQ4FkfhHulzxa8uklMjkw9pHYA="
     },
     "@uifabric/icons": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.1.0.tgz",
-      "integrity": "sha512-Z2lE7ppbmINoYjgGNvhnYG88EtvJEpQ8JPg++4S/u7KCXCMZVpC3H09JMcFljYlIe+NlJsaAPXJ5wNWddrO5hw=="
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.1.1.tgz",
+      "integrity": "sha512-D0wjw2xxwgjP2lPzPQVZaigf01iRFSXQe05rWeHOHQgUK/ChOMX4hYCcXsj7YoPsTp75yfQ+0d1CQ8rDpDjgeg=="
     },
     "@uifabric/merge-styles": {
-      "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.3.0.tgz",
-      "integrity": "sha512-MlwzpHJ7sL7LwQTLAFooisAAwRNOxHvJQsokoAGlD8VlO3HhVrRxZGCrNfdsUdMU/9bOfiHPKjm680CyMKubbA=="
+      "version": "5.3.2",
+      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.3.2.tgz",
+      "integrity": "sha512-RHY33Bs6OIS60z8l5taXAps8J7FT4hUkwaM99G3vop4cEAevTYm3RVoYJALT/Q/Ta15QO6X11zqkH2S0J0N7IA=="
     },
     "@uifabric/styling": {
-      "version": "5.1.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.1.1.tgz",
-      "integrity": "sha512-+fHaKc8S2rHGnf/qJgKItxKkv+7jREKQ+nDoBlwLaE8nXKtWZUcgESUrlmwgvMNEpN1a3YFoZxM28Z0Nkd20ZQ=="
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.3.0.tgz",
+      "integrity": "sha512-K+IvuSlwK2i5L1Pxoes1kCjsCjANjlcTJP6ZDv2uhhHjn4HsA2iPFaMSmIfly/gagaH6IYVBRcQ+SyXDKFsjiA=="
     },
     "@uifabric/utilities": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.1.0.tgz",
-      "integrity": "sha512-qvOWJUgsTlH3h6b5dofKsnnnVJHsuX19jz8umJZdr0E4pYKgDC14WD8jfwP4bjF9MS2raZww1AImGWNd+gCI8A=="
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.2.1.tgz",
+      "integrity": "sha512-rOM5lS0Tx2p505E5OsX70HKKIOHNUDggdkzgUVmeOyPYO8u+nNG62HuqG9fFh113EfcbMzH3IIXz21JGrqxRfg=="
     },
     "abab": {
       "version": "1.0.4",
@@ -2805,9 +2878,9 @@
       "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
     },
     "ast-types": {
-      "version": "0.9.11",
-      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.9.11.tgz",
-      "integrity": "sha1-NxF3u1kjL/XOqh0J7lytcFsaWqk="
+      "version": "0.9.12",
+      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.9.12.tgz",
+      "integrity": "sha1-sTYwDWcCZiWuFTJpgsqZGOXbc8k="
     },
     "astral-regex": {
       "version": "1.0.0",
@@ -2845,14 +2918,14 @@
       "integrity": "sha1-NCQX2PLzRhsUzwkIjV7fh5HcmDI="
     },
     "autoprefixer": {
-      "version": "7.1.4",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-7.1.4.tgz",
-      "integrity": "sha512-MB1XybOJqu1uAwpfSilAa1wSURNc4W310CFKvMj1fNaJBFxr1PGgz72vZaPr9ryKGqs2vYZ6jDyJ0aiGELjsoA==",
+      "version": "7.1.5",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-7.1.5.tgz",
+      "integrity": "sha512-sMN453qIm8Z+tunzYWW+Y490wWkICHhCYm/VohLjjl+N7ARSFuF5au7E6tr7oEbeeXj8mNjpSw2kxjJaO6YCOw==",
       "dependencies": {
         "browserslist": {
-          "version": "2.4.0",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.4.0.tgz",
-          "integrity": "sha512-aM2Gt4x9bVlCUteADBS6JP0F+2tMWKM1jQzUulVROtdFWFIcIVvY76AJbr7GDqy0eDhn+PcnpzzivGxY4qiaKQ=="
+          "version": "2.5.1",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.5.1.tgz",
+          "integrity": "sha512-jAvM2ku7YDJ+leAq3bFH1DE0Ylw+F+EQDq4GkqZfgPEqpWYw9ofQH85uKSB9r3Tv7XDbfqVtE+sdvKJW7IlPJA=="
         }
       }
     },
@@ -3470,9 +3543,9 @@
       "integrity": "sha512-OVgtQRuOZKckrILgMA5rvctvFZPv72Gua9Rt006AiPoB0DJKGN07UmaQA+qRrYgK71MVct8fFhT0EyNWYorVew==",
       "dependencies": {
         "browserslist": {
-          "version": "2.4.0",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.4.0.tgz",
-          "integrity": "sha512-aM2Gt4x9bVlCUteADBS6JP0F+2tMWKM1jQzUulVROtdFWFIcIVvY76AJbr7GDqy0eDhn+PcnpzzivGxY4qiaKQ=="
+          "version": "2.5.1",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.5.1.tgz",
+          "integrity": "sha512-jAvM2ku7YDJ+leAq3bFH1DE0Ylw+F+EQDq4GkqZfgPEqpWYw9ofQH85uKSB9r3Tv7XDbfqVtE+sdvKJW7IlPJA=="
         },
         "semver": {
           "version": "5.4.1",
@@ -3517,9 +3590,9 @@
           "integrity": "sha1-zUrpCm6Utwn5c3SzPl+LmDVWre8="
         },
         "browserslist": {
-          "version": "2.4.0",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.4.0.tgz",
-          "integrity": "sha512-aM2Gt4x9bVlCUteADBS6JP0F+2tMWKM1jQzUulVROtdFWFIcIVvY76AJbr7GDqy0eDhn+PcnpzzivGxY4qiaKQ=="
+          "version": "2.5.1",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.5.1.tgz",
+          "integrity": "sha512-jAvM2ku7YDJ+leAq3bFH1DE0Ylw+F+EQDq4GkqZfgPEqpWYw9ofQH85uKSB9r3Tv7XDbfqVtE+sdvKJW7IlPJA=="
         },
         "regenerator-transform": {
           "version": "0.9.11",
@@ -3674,9 +3747,9 @@
       "integrity": "sha1-T4owBctKfjiJ90kDD9JbluAdLjE="
     },
     "bowser": {
-      "version": "1.7.3",
-      "resolved": "https://registry.npmjs.org/bowser/-/bowser-1.7.3.tgz",
-      "integrity": "sha1-UEvbQxGMqNucu63yj9YPJlr5bk8="
+      "version": "1.8.0",
+      "resolved": "https://registry.npmjs.org/bowser/-/bowser-1.8.0.tgz",
+      "integrity": "sha512-ARpB9VfvItCA47oBk9tVA/L93fU83Q2YwE1yTjhCyr1tu6Zw74mDHdpXNWutl5/tFGYhgCOfBH83WJY4RBGA3A=="
     },
     "brace-expansion": {
       "version": "1.1.8",
@@ -3775,18 +3848,6 @@
       "resolved": "https://registry.npmjs.org/buffers/-/buffers-0.1.1.tgz",
       "integrity": "sha1-skV5w77U1tOWru5tmorn9Ugqt7s="
     },
-    "build": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/build/-/build-0.1.4.tgz",
-      "integrity": "sha1-cH/gJv/O3crL/c3zVur9pk8VEEY=",
-      "dependencies": {
-        "uglify-js": {
-          "version": "1.3.5",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-1.3.5.tgz",
-          "integrity": "sha1-S1v/+Rhu/7qoiOTJ6UvZ/EyUkp0="
-        }
-      }
-    },
     "builtin-modules": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz",
@@ -3835,14 +3896,14 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000744",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000744.tgz",
-      "integrity": "sha1-AHWP991fcTjTShVgjcz3Glllb/4="
+      "version": "1.0.30000746",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000746.tgz",
+      "integrity": "sha1-UBCYxm9fu/Y0wC8lUIsF6ICZEPQ="
     },
     "caniuse-lite": {
-      "version": "1.0.30000744",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000744.tgz",
-      "integrity": "sha1-hg+lyDujT+YZOX1gfzC7R0ghZxs="
+      "version": "1.0.30000746",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000746.tgz",
+      "integrity": "sha1-xk+Vo5Jc/TAgejCO12wa6W6gnqA="
     },
     "cardinal": {
       "version": "1.0.0",
@@ -4380,11 +4441,6 @@
       "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-0.1.0.tgz",
       "integrity": "sha1-yBSQPkViM3GgR3tAEJqq++6t27Q="
     },
-    "cssmin": {
-      "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/cssmin/-/cssmin-0.3.2.tgz",
-      "integrity": "sha1-3c5MVHtRCuDVlKjx+/iq+OLFwA0="
-    },
     "cssnano": {
       "version": "3.10.0",
       "resolved": "https://registry.npmjs.org/cssnano/-/cssnano-3.10.0.tgz",
@@ -4461,11 +4517,6 @@
       "resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz",
       "integrity": "sha1-mI3zP+qxke95mmE2nddsF635V+o="
     },
-    "cycle": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/cycle/-/cycle-1.0.3.tgz",
-      "integrity": "sha1-IegLK+hYD5i0aPN5QwZisEbDStI="
-    },
     "d": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/d/-/d-1.0.0.tgz",
@@ -4584,9 +4635,9 @@
       "integrity": "sha1-ogM8CcyOFY03dI+951B4Mr1s4Sc="
     },
     "diff": {
-      "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/diff/-/diff-3.3.1.tgz",
-      "integrity": "sha512-MKPHZDMB0o6yHyDryUOScqZibp914ksXwAMYMTHj6KO8UeKsRYNJD3oNCKjTqZon+V488P7N/HzXF8t7ZR95ww=="
+      "version": "3.4.0",
+      "resolved": "https://registry.npmjs.org/diff/-/diff-3.4.0.tgz",
+      "integrity": "sha512-QpVuMTEoJMF7cKzi6bvWhRulU1fZqZnvyVQgNhPaxxuTYwyjn/j1v9falseQ/uXWwPnO56RBfwtg4h/EQXmucA=="
     },
     "diffie-hellman": {
       "version": "5.0.2",
@@ -4682,9 +4733,9 @@
       "integrity": "sha1-zIcsFoiArjxxiXYv1f/ACJbJUYo="
     },
     "electron-to-chromium": {
-      "version": "1.3.24",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.24.tgz",
-      "integrity": "sha1-m3uIuwXOufoBahd4M8wt3jiPIbY="
+      "version": "1.3.25",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.25.tgz",
+      "integrity": "sha1-RTshAJg20Jl9hgNWAf9srkeRxGA="
     },
     "elliptic": {
       "version": "6.4.0",
@@ -4742,9 +4793,9 @@
       "integrity": "sha1-RTVSSKiJeQNLZ5Lhm7gfK3l13Q0="
     },
     "es5-ext": {
-      "version": "0.10.30",
-      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.30.tgz",
-      "integrity": "sha1-cUGhaDZpfbq/qq7uQUlc4p9SyTk="
+      "version": "0.10.31",
+      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.31.tgz",
+      "integrity": "sha1-e7k4yVp/G59ygJLcCcQe3MOY7v4="
     },
     "es5-shim": {
       "version": "4.5.9",
@@ -4934,9 +4985,9 @@
       "integrity": "sha512-orfQQqFRTX0jH7znRIGi8ZMR8kTNpXklTTz8+HGTpmTKZo3Occ6JNB5FXMb8cRuiiC/GyDqsr30zUa66ACYlYw=="
     },
     "express": {
-      "version": "4.16.1",
-      "resolved": "https://registry.npmjs.org/express/-/express-4.16.1.tgz",
-      "integrity": "sha512-STB7LZ4N0L+81FJHGla2oboUHTk4PaN1RsOkoRh9OSeEKylvF5hwKYVX1xCLFaCT7MD0BNG/gX2WFMLqY6EMBw==",
+      "version": "4.16.2",
+      "resolved": "https://registry.npmjs.org/express/-/express-4.16.2.tgz",
+      "integrity": "sha1-41xt/i1kt9ygpc1PIXgb4ymeB2w=",
       "dependencies": {
         "finalhandler": {
           "version": "1.1.0",
@@ -4985,11 +5036,6 @@
       "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.3.0.tgz",
       "integrity": "sha1-lpGEQOMEGnpBT4xS48V06zw+HgU="
     },
-    "eyes": {
-      "version": "0.1.8",
-      "resolved": "https://registry.npmjs.org/eyes/-/eyes-0.1.8.tgz",
-      "integrity": "sha1-Ys8SAjTGg3hdkCNIqADvPgzCC8A="
-    },
     "fast-deep-equal": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-1.0.0.tgz",
@@ -5170,9 +5216,9 @@
       "integrity": "sha512-5EblxZUdioXi2JiMZ9FUbwYj40eQ9MFHyzFLBSPdlRl3SO8l7SLWuAnQ/at/1Wi4hjJwME/C5WpF2ZfAc8nGNw=="
     },
     "fuse.js": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/fuse.js/-/fuse.js-3.1.0.tgz",
-      "integrity": "sha1-kGIUbEcVUhibD2eLT1oVVzGuOzw="
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/fuse.js/-/fuse.js-3.2.0.tgz",
+      "integrity": "sha1-8ESOgGmFW/Kj5oPNwdMg5+KgfvQ="
     },
     "gauge": {
       "version": "2.7.4",
@@ -6446,11 +6492,6 @@
       "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
       "integrity": "sha1-597mbjXW/Bb3EP6R1c9p9w8IkR0="
     },
-    "jsmin": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/jsmin/-/jsmin-1.0.1.tgz",
-      "integrity": "sha1-570NzWSWw79IYyNb9GGj2YqjuYw="
-    },
     "json-loader": {
       "version": "0.5.7",
       "resolved": "https://registry.npmjs.org/json-loader/-/json-loader-0.5.7.tgz",
@@ -6511,18 +6552,6 @@
       "resolved": "https://registry.npmjs.org/just-extend/-/just-extend-1.1.22.tgz",
       "integrity": "sha1-MzCvdWyralQnAMZLLk5KoGLVL/8="
     },
-    "jxLoader": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/jxLoader/-/jxLoader-0.1.1.tgz",
-      "integrity": "sha1-ATTqUUTlM7WU/B/yX/GU4jXFPs0=",
-      "dependencies": {
-        "js-yaml": {
-          "version": "0.3.7",
-          "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-0.3.7.tgz",
-          "integrity": "sha1-1znY7oZGHlSzVNan19HyrZoWf2I="
-        }
-      }
-    },
     "keycode": {
       "version": "2.1.9",
       "resolved": "https://registry.npmjs.org/keycode/-/keycode-2.1.9.tgz",
@@ -6791,9 +6820,9 @@
       "integrity": "sha1-0CJTc662Uq3BvILklFM5qEJ1R3M="
     },
     "loglevel": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/loglevel/-/loglevel-1.5.0.tgz",
-      "integrity": "sha512-OQ2jhWI5G2qsvO0UFNyCQWgKl/tFiwuPIXxELzACeUO2FqstN/R7mmL09+nhv6xOWVPPojQO1A90sCEoJSgBcQ=="
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/loglevel/-/loglevel-1.5.1.tgz",
+      "integrity": "sha1-GJB4yUq5BT7iFaCs2/JCROoPZQI="
     },
     "lolex": {
       "version": "2.1.3",
@@ -7085,14 +7114,9 @@
       }
     },
     "moment": {
-      "version": "2.18.1",
-      "resolved": "https://registry.npmjs.org/moment/-/moment-2.18.1.tgz",
-      "integrity": "sha1-w2GT3Tzhwu7SrbfIAtu8d6gbHA8="
-    },
-    "moo-server": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/moo-server/-/moo-server-1.3.0.tgz",
-      "integrity": "sha1-XceVaVZaENbv7VQ5SR5p0jkuWPE="
+      "version": "2.19.1",
+      "resolved": "https://registry.npmjs.org/moment/-/moment-2.19.1.tgz",
+      "integrity": "sha1-VtoaLRy/AdOLfhr8McELz6GSkWc="
     },
     "ms": {
       "version": "2.0.0",
@@ -7394,9 +7418,9 @@
       "integrity": "sha1-43rwTiOwkfZTYNsknbi7DzEpH2A="
     },
     "office-ui-fabric-react": {
-      "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.3.0.tgz",
-      "integrity": "sha512-qelOQ/Hd9QDyM3xyKdjbkrGqB3Vdz8ZbSXU5ud9xYDqnDDe5ofAvRD3xqbylLLugD702WM2a8I6SztxuSRohCw=="
+      "version": "5.7.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.7.0.tgz",
+      "integrity": "sha512-ibAhXKAWFsyL4jQXv9b7fy/NhVxXsjfO1HTOrNBDqD9M7Y938SCoq0qcMNRYtdrSTxdLMhRx23F5XxUxOHIECw=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -8070,9 +8094,9 @@
       "integrity": "sha1-dFdoEWWZrKLwCfrUJrABdQSdjZI="
     },
     "postcss-loader": {
-      "version": "2.0.6",
-      "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-2.0.6.tgz",
-      "integrity": "sha512-HIq7yy1hh9KI472Y38iSRV4WupZUNy6zObkxQM/ZuInoaE2+PyX4NcO6jjP5HG5mXL7j5kcNEl0fAG4Kva7O9w=="
+      "version": "2.0.7",
+      "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-2.0.7.tgz",
+      "integrity": "sha512-eTPw6KbYiYpLJsTtevT4kX1aDL7HuSNmMWKLz/HascJClww/KJ3AWtMOY/z+sQd14F3SnIA/WE208/S7JDOzEQ=="
     },
     "postcss-merge-idents": {
       "version": "2.1.7",
@@ -8870,11 +8894,6 @@
       "resolved": "https://registry.npmjs.org/promise.prototype.finally/-/promise.prototype.finally-3.0.1.tgz",
       "integrity": "sha512-5o2ue0smn+Wn6tdkqN4wxB27lCu84UrladpMRQ3fm1tEkewOrhAGSOHwj15SRU+oE/ParFTou6XG3Jhgyb9sjw=="
     },
-    "promised-io": {
-      "version": "0.3.5",
-      "resolved": "https://registry.npmjs.org/promised-io/-/promised-io-0.3.5.tgz",
-      "integrity": "sha1-StIXuzZYvKrplGsXqGaOzYUeE1Y="
-    },
     "prop-types": {
       "version": "15.6.0",
       "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.6.0.tgz",
@@ -8936,9 +8955,9 @@
       "integrity": "sha1-DPf4T5Rj/wrlHExLFC2VvjdyTZw="
     },
     "radium": {
-      "version": "0.19.4",
-      "resolved": "https://registry.npmjs.org/radium/-/radium-0.19.4.tgz",
-      "integrity": "sha1-VqpJ/eYYHS9eH6V7RxD/0MI96CA=",
+      "version": "0.19.5",
+      "resolved": "https://registry.npmjs.org/radium/-/radium-0.19.5.tgz",
+      "integrity": "sha512-W2vu68wvq6AcUb81PNaBkVqO7O0HksURQeY5KzoCR/k9hxLqglYvkiXMKeLqxNDr47mDj1W5Zbm3e8Xi9kBIFA==",
       "dependencies": {
         "inline-style-prefixer": {
           "version": "2.0.5",
@@ -8997,9 +9016,9 @@
       "integrity": "sha1-wStu/cIkfBDae4dw0YUICnsEcVY="
     },
     "react-docgen": {
-      "version": "2.18.0",
-      "resolved": "https://registry.npmjs.org/react-docgen/-/react-docgen-2.18.0.tgz",
-      "integrity": "sha512-6AEkA5QqtgkW4xvw9fy2AdXTo308wmnHx4A1oTZBZfciuZsaq0j2iTnv+5wKroV4nWo3JF+EQ72SjWO1U7YZZA==",
+      "version": "2.19.0",
+      "resolved": "https://registry.npmjs.org/react-docgen/-/react-docgen-2.19.0.tgz",
+      "integrity": "sha1-qeNWJ3qjH0LfFj8LSRfTsHeYX50=",
       "dependencies": {
         "babylon": {
           "version": "5.8.38",
@@ -9024,21 +9043,14 @@
       "integrity": "sha1-l7XscQ2miDNZjIvm+JrENiFoQKU="
     },
     "react-icon-base": {
-      "version": "2.0.7",
-      "resolved": "https://registry.npmjs.org/react-icon-base/-/react-icon-base-2.0.7.tgz",
-      "integrity": "sha1-C9GHNr1s55ym1pzoOHoH+41M7/4=",
-      "dependencies": {
-        "prop-types": {
-          "version": "15.5.8",
-          "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.5.8.tgz",
-          "integrity": "sha1-a3suFBCDvjjIWVqlH8VXdccZk5Q="
-        }
-      }
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/react-icon-base/-/react-icon-base-2.1.0.tgz",
+      "integrity": "sha1-oZbjP98eeqof2jrvu2i9rZ6Cp50="
     },
     "react-icons": {
-      "version": "2.2.5",
-      "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-2.2.5.tgz",
-      "integrity": "sha1-+UJQHCGkzARWziu+5QMsk/YFHc8="
+      "version": "2.2.7",
+      "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-2.2.7.tgz",
+      "integrity": "sha512-0n4lcGqzJFcIQLoQytLdJCE0DKSA9dkwEZRYoGrIDJZFvIT6Hbajx5mv9geqhqFiNjUgtxg8kPyDfjlhymbGFg=="
     },
     "react-inspector": {
       "version": "2.2.0",
@@ -9051,9 +9063,9 @@
       "integrity": "sha1-uWRzgBSptK7klKg8C1uDPWYHKpA="
     },
     "react-modal": {
-      "version": "2.3.3",
-      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-2.3.3.tgz",
-      "integrity": "sha512-8iBidx7rKKg65XgOqrmy2oEr0rj5wd/w3et4Y3oef7903A15pOVW8fg2H9KlcDNcaqKw/CpBIE2Kc8vcVwoqOA=="
+      "version": "2.4.1",
+      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-2.4.1.tgz",
+      "integrity": "sha512-3WQCn3xqkbEUvxRUO3nkeqxMNgt1F4CyEU3BiUIrg7C71tnqjQIuSE7+JXp85yFl8X1iRTJouySNpwNqv4kiWg=="
     },
     "react-remarkable": {
       "version": "1.1.2",
@@ -9128,19 +9140,14 @@
       "integrity": "sha1-TtCtBg3zBzMAxIRANz9y0cxkLXg="
     },
     "recast": {
-      "version": "0.12.6",
-      "resolved": "https://registry.npmjs.org/recast/-/recast-0.12.6.tgz",
-      "integrity": "sha1-Sw+4L+sdELO9YtNJQ0Jtmz7TDUw=",
+      "version": "0.12.7",
+      "resolved": "https://registry.npmjs.org/recast/-/recast-0.12.7.tgz",
+      "integrity": "sha512-UgJBjELa0DaLUbblnIOPUj0UgdbetzYzrvWtHCXX8N5aCTHoMSx6ATkA2JH0hS7tP6dMJ5/CtVZEC4yW7V/8Dw==",
       "dependencies": {
         "esprima": {
           "version": "4.0.0",
           "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.0.tgz",
           "integrity": "sha512-oftTcaMu/EGrEIu904mWteKIv8vMuOgGYo7EhVJJN00R/EED9DCua/xxHRdYnKtcECzVg7xOWhflvJMnqcFZjw=="
-        },
-        "source-map": {
-          "version": "0.5.7",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
-          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         }
       }
     },
@@ -9905,9 +9912,9 @@
       "integrity": "sha1-tf3AjxKH6hF4Yo5BXiUTK3NkbG0="
     },
     "sinon": {
-      "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/sinon/-/sinon-3.3.0.tgz",
-      "integrity": "sha512-/flfGfIxIRXSvZBHJzIf3iAyGYkmMQq6SQjA0cx9SOuVuq+4ZPPO4LJtH1Ce0Lznax1KSG1U6Dad85wIcSW19w=="
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/sinon/-/sinon-4.0.1.tgz",
+      "integrity": "sha512-4qIY0pCWCvGCJpV/1JkFu9kbsNEZ9O34cG1oru/c7OCDtrEs50Gq/VjkA2ID5ZwLyoNx1i1ws118oh/p6fVeDg=="
     },
     "slash": {
       "version": "1.0.0",
@@ -10081,11 +10088,6 @@
       "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.13.1.tgz",
       "integrity": "sha1-US322mKHFEMW3EwY/hzx2UBzm+M="
     },
-    "stack-trace": {
-      "version": "0.0.10",
-      "resolved": "https://registry.npmjs.org/stack-trace/-/stack-trace-0.0.10.tgz",
-      "integrity": "sha1-VHxws0fo0ytOEI6hoqFZ5f3eGcA="
-    },
     "static-extend": {
       "version": "0.1.2",
       "resolved": "https://registry.npmjs.org/static-extend/-/static-extend-0.1.2.tgz",
@@ -10368,11 +10370,6 @@
       "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.4.tgz",
       "integrity": "sha512-uZYhyU3EX8O7HQP+J9fTVYwsq90Vr68xPEFo7yrVImIxYvHgukBEgOB/SgGoorWVTzGM/3Z+wUNnboA4M8jWrg=="
     },
-    "timespan": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/timespan/-/timespan-2.3.0.tgz",
-      "integrity": "sha1-SQLOBAvRPYRcj1myfp1ZutbzmSk="
-    },
     "tmpl": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/tmpl/-/tmpl-1.0.4.tgz",
@@ -10465,9 +10462,9 @@
       "integrity": "sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM="
     },
     "ts-jest": {
-      "version": "21.1.0",
-      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-21.1.0.tgz",
-      "integrity": "sha512-P4NGaX8Hqy0vAdXd2K1y1PEgAbTHqJtUdwAeBaHAUbZpKQmfqKSRgNEHsyf9hdxsqtkUyj/Msep0BatNxhZQug==",
+      "version": "21.1.2",
+      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-21.1.2.tgz",
+      "integrity": "sha512-bcYDSvjxL1ralSBxAnM1fY6D3suWDMe73feNIEDKSuM30AsRag2ktv+9YcfM+ctXVUKFFJDyxZDNsHiFTz98lQ==",
       "dependencies": {
         "camelcase": {
           "version": "4.1.0",
@@ -10529,9 +10526,9 @@
       }
     },
     "tslib": {
-      "version": "1.7.1",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.7.1.tgz",
-      "integrity": "sha1-vIAEFkaRkjp5/oN4u+s9ogF1OOw="
+      "version": "1.8.0",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.8.0.tgz",
+      "integrity": "sha512-ymKWWZJST0/CkgduC2qkzjMOWr4bouhuURNXCn/inEX0L57BnRG6FhX76o7FOnsjHazCjfU2LKeSrlS2sIKQJg=="
     },
     "tslint": {
       "version": "5.7.0",
@@ -10563,9 +10560,9 @@
       "integrity": "sha1-hR+1BSAcY9A0PFFybmNk9+mtLpk="
     },
     "tsutils": {
-      "version": "2.11.2",
-      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.11.2.tgz",
-      "integrity": "sha1-YBNgHjb6FP+VhBPlQdQn+4xqw0E="
+      "version": "2.12.1",
+      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.12.1.tgz",
+      "integrity": "sha1-9Nlc4zkciXHkblTEzw7bCiHdWyQ="
     },
     "tty-browserify": {
       "version": "0.0.0",
@@ -10599,9 +10596,9 @@
       "integrity": "sha1-yrEPtJCeRByChC6v4a1kbIGARBA="
     },
     "typescript": {
-      "version": "2.4.2",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.4.2.tgz",
-      "integrity": "sha1-+DlfhdRZJ2BnyYiqQYN6j4KHCEQ="
+      "version": "2.5.3",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.5.3.tgz",
+      "integrity": "sha512-ptLSQs2S4QuS6/OD1eAKG+S5G8QQtrU5RT32JULdZQtM1L3WTi34Wsu48Yndzi8xsObRAB9RPt/KhA9wlpEF6w=="
     },
     "typical": {
       "version": "2.6.1",
@@ -10894,9 +10891,9 @@
       "integrity": "sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg=="
     },
     "webpack": {
-      "version": "3.6.0",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-3.6.0.tgz",
-      "integrity": "sha512-OsHT3D0W0KmPPh60tC7asNnOmST6bKTiR90UyEdT9QYoaJ4OYN4Gg7WK1k3VxHK07ZoiYWPsKvlS/gAjwL/vRA==",
+      "version": "3.7.1",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-3.7.1.tgz",
+      "integrity": "sha512-8MR+gVfxsvtx4J1UlbRGkUJEpDQUBFmisRmpPO5cVLgF21R8UMChX39OOjDz63a+m/iswGoqATszdZB2VCsYuA==",
       "dependencies": {
         "acorn": {
           "version": "5.1.2",
@@ -11112,23 +11109,6 @@
       "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
       "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
     },
-    "winston": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/winston/-/winston-2.4.0.tgz",
-      "integrity": "sha1-gIBQuT1SZh7Z+2wms/DIJnCLCu4=",
-      "dependencies": {
-        "async": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/async/-/async-1.0.0.tgz",
-          "integrity": "sha1-+PwEyjoTeErenhZBr5hXjPvWR6k="
-        },
-        "colors": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/colors/-/colors-1.0.3.tgz",
-          "integrity": "sha1-BDP0TYCWgP3rYO0mDxsMJi6CpAs="
-        }
-      }
-    },
     "wordwrap": {
       "version": "0.0.3",
       "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.3.tgz",
@@ -11156,11 +11136,6 @@
       "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
       "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8="
     },
-    "wrench": {
-      "version": "1.3.9",
-      "resolved": "https://registry.npmjs.org/wrench/-/wrench-1.3.9.tgz",
-      "integrity": "sha1-bxPsNRRTF+spLKX2UxORskQRFBE="
-    },
     "write-file-atomic": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.3.0.tgz",
diff --git a/packages/example-app-base/src/components/Header/Header.tsx b/packages/example-app-base/src/components/Header/Header.tsx
index 42aa451729f36..4ad1bd3331cfc 100644
--- a/packages/example-app-base/src/components/Header/Header.tsx
+++ b/packages/example-app-base/src/components/Header/Header.tsx
@@ -1,15 +1,18 @@
+import './Header.scss';
+
 import * as React from 'react';
-import { getRTL, setRTL } from 'office-ui-fabric-react/lib/Utilities';
+
 import {
   ContextualMenu,
   DirectionalHint,
   IContextualMenuItem
 } from 'office-ui-fabric-react/lib/ContextualMenu';
 import { FocusZone, FocusZoneDirection } from 'office-ui-fabric-react/lib/FocusZone';
-import { withResponsiveMode, ResponsiveMode } from 'office-ui-fabric-react/lib/utilities/decorators/withResponsiveMode';
-import { Icon } from 'office-ui-fabric-react/lib/Icon';
-import './Header.scss';
+import { ResponsiveMode, withResponsiveMode } from 'office-ui-fabric-react/lib/utilities/decorators/withResponsiveMode';
+import { getRTL, setRTL } from 'office-ui-fabric-react/lib/Utilities';
+
 import { FontClassNames } from 'office-ui-fabric-react/lib/Styling';
+import { Icon } from 'office-ui-fabric-react/lib/Icon';
 
 export interface IHeaderProps {
   title: string;
@@ -89,7 +92,7 @@ export class Header extends React.Component<IHeaderProps, IHeaderState> {
           <ContextualMenu
             items={ contextMenu.items }
             isBeakVisible={ true }
-            targetElement={ contextMenu.target }
+            target={ contextMenu.target }
             directionalHint={ DirectionalHint.bottomAutoEdge }
             gapSpace={ 5 }
             onDismiss={ this._onDismiss }
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
index b03c183cfabf6..bfe5a6e55cdb7 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
@@ -1,4 +1,6 @@
 import * as React from 'react';
+import * as stylesImport from './MarqueeSelection.scss';
+
 import {
   AutoScroll,
   BaseComponent,
@@ -10,8 +12,8 @@ import {
   getDistanceBetweenPoints,
   getRTL
 } from '../../Utilities';
+
 import { IMarqueeSelectionProps } from './MarqueeSelection.Props';
-import * as stylesImport from './MarqueeSelection.scss';
 const styles: any = stylesImport;
 
 export interface IMarqueeSelectionState {
@@ -62,7 +64,7 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
 
   public componentDidMount() {
     this._scrollableParent = findScrollableParent(this.refs.root) as HTMLElement;
-    this._scrollableSurface = this._scrollableParent === window as any ? document.body : this._scrollableParent;
+    this._scrollableSurface = (this._scrollableParent === window as any) ? document.body : this._scrollableParent;
     // When scroll events come from window, we need to read scrollTop values from the body.
 
     const hitTarget = this.props.isDraggingConstrainedToRoot ? this.refs.root : this._scrollableSurface;
diff --git a/scripts/package.json b/scripts/package.json
index 7663df52e1953..62f8f163c2e89 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -7,21 +7,21 @@
     "build": "node -v"
   },
   "devDependencies": {
-    "@microsoft/load-themed-styles": "^1.7.2",
-    "@microsoft/loader-load-themed-styles": "^1.4.2",
+    "@microsoft/load-themed-styles": "^1.7.5",
+    "@microsoft/loader-load-themed-styles": "^1.6.0",
     "@uifabric/merge-styles": ">=5.3.2 <6.0.0",
-    "autoprefixer": "^7.1.2",
+    "autoprefixer": "^7.1.5",
     "awesome-typescript-loader": "^3.2.3",
     "chalk": "^2.1.0",
     "command-line-args": "^4.0.7",
     "cpx": "^1.5.0",
-    "css-loader": "^0.28.5",
+    "css-loader": "^0.28.7",
     "github": "^7.0.0",
     "glob": "^7.1.2",
     "gzip-size": "^3.0.0",
     "json-loader": "^0.5.7",
-    "jest": "^21.1.0",
-    "ts-jest": "^21.0.1",
+    "jest": "^21.2.0",
+    "ts-jest": "^21.1.2",
     "node-sass": "^4.5.3",
     "open": "^0.0.5",
     "postcss": "^6.0.9",
@@ -29,14 +29,14 @@
     "postcss-modules": "^0.8.0",
     "raw-loader": "^0.5.1",
     "sass-loader": "^6.0.6",
-    "sinon": "^3.2.1",
+    "sinon": "^4.0.1",
     "source-map-loader": "^0.2.1",
     "style-loader": "^0.18.2",
-    "tslint": "^5.6.0",
+    "tslint": "^5.7.0",
     "tslint-microsoft-contrib": "^5.0.1",
-    "typescript": "2.4.2",
+    "typescript": "2.5.3",
     "uglifyjs-webpack-plugin": "^0.4.6",
-    "webpack": "^3.5.5",
+    "webpack": "^3.7.1",
     "webpack-bundle-analyzer": "^2.9.0",
     "webpack-dev-server": "^2.7.1",
     "webpack-notifier": "^1.5.0",
diff --git a/scripts/tasks/jest-resources.js b/scripts/tasks/jest-resources.js
index 82e01aae4fc92..4c792048fea90 100644
--- a/scripts/tasks/jest-resources.js
+++ b/scripts/tasks/jest-resources.js
@@ -46,7 +46,13 @@ const styleMockPath =
 
         'snapshotSerializers': [
           path.resolve(__dirname, 'jest-serializer-merge-styles')
-        ]
+        ],
+
+        globals: {
+          'ts-jest': {
+            tsConfigFile: path.resolve(process.cwd(), 'tsconfig.json')
+          }
+        }
 
       }, customConfig)
   };
diff --git a/scripts/tasks/jest.js b/scripts/tasks/jest.js
index 3f2f0a9debaa8..a234589a3ee90 100644
--- a/scripts/tasks/jest.js
+++ b/scripts/tasks/jest.js
@@ -20,11 +20,14 @@ module.exports = function (options) {
       // In production builds, produce coverage information.
       options.isProduction && '--coverage',
 
+      // If the -u flag is passed, pass it through.
+      (options.argv && options.argv.indexOf('-u') >= 0) ? '-u' : '',
+
       // Pass in custom arguments.
       options.args
     ].filter(arg => !!arg).join(' ');
 
-    const command = `node ${jestPath} ${args} ${customArgs}`;
+    const command = `node ${jestPath} ${args}`;
 
     execSync(command, undefined, path.dirname(jestConfigPath));
   }

From c3b2b6d5feb39a8534584c7306a5621d56549d8e Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Wed, 11 Oct 2017 17:49:12 -0700
Subject: [PATCH 0823/1641] ContextualMenu: Update the typings on
 getItemClassNames (#3097)

* The classNames are optional for contextual menu items, getMenuItemClassNames should reflect that

* Rush change
---
 .../chrisgo-getItemClassNames_2017-10-12-00-35.json   | 11 +++++++++++
 .../components/ContextualMenu/ContextualMenu.Props.ts |  8 ++++----
 .../ContextualMenu/ContextualMenu.classNames.ts       |  8 ++++----
 .../src/components/ContextualMenu/ContextualMenu.tsx  |  8 ++++----
 4 files changed, 23 insertions(+), 12 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/chrisgo-getItemClassNames_2017-10-12-00-35.json

diff --git a/common/changes/office-ui-fabric-react/chrisgo-getItemClassNames_2017-10-12-00-35.json b/common/changes/office-ui-fabric-react/chrisgo-getItemClassNames_2017-10-12-00-35.json
new file mode 100644
index 0000000000000..30a9ac80a02ec
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/chrisgo-getItemClassNames_2017-10-12-00-35.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: Update the typings on getMenuItemClassNames",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
index 44fec4fb9dc3b..a5abc4e6aa87e 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
@@ -316,10 +316,10 @@ export interface IContextualMenuItem {
     checked: boolean,
     isAnchorLink: boolean,
     knownIcon: boolean,
-    itemClassName: string,
-    dividerClassName: string,
-    iconClassName: string,
-    subMenuClassName: string) => IMenuItemClassNames;
+    itemClassName?: string,
+    dividerClassName?: string,
+    iconClassName?: string,
+    subMenuClassName?: string) => IMenuItemClassNames;
 
   /**
    *  Properties to apply to render this item as a section.
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
index d9854d3b6d203..d03d7f421210e 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
@@ -56,10 +56,10 @@ export const getItemClassNames = memoizeFunction((
   checked: boolean,
   isAnchorLink: boolean,
   knownIcon: boolean,
-  itemClassName: string,
-  dividerClassName: string,
-  iconClassName: string,
-  subMenuClassName: string,
+  itemClassName?: string,
+  dividerClassName?: string,
+  iconClassName?: string,
+  subMenuClassName?: string,
 ): IMenuItemClassNames => {
 
   const { semanticColors } = theme;
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 0ccfe98a15e70..de1cb057ea459 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -316,10 +316,10 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       !!getIsChecked(item),
       !!item.href,
       (iconProps.iconName !== 'None'),
-      item.className!,
-      dividerClassName!,
-      iconProps.className!,
-      subMenuIconClassName!
+      item.className,
+      dividerClassName,
+      iconProps.className,
+      subMenuIconClassName
     );
 
     if (item.name === '-') {

From eeabde3c77a81b17b667de402697b021ca1225b5 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Wed, 11 Oct 2017 18:10:32 -0700
Subject: [PATCH 0824/1641] Add more stories for Screener/Storybook (#3058)

* Add persona story

* Added more stories

* Fix SwatchColorPicker steps

* Move disabled pickers above Screener decorator

* Remove modal crop
---
 apps/vr-tests/src/stories/Callout.stories.tsx | 105 +++++++++--
 .../src/stories/HoverCard.stories.tsx         |  39 +++++
 apps/vr-tests/src/stories/Icon.stories.tsx    |  33 ++++
 apps/vr-tests/src/stories/Modal.stories.tsx   |   2 +-
 .../src/stories/OverflowSet.stories.tsx       |  62 +++++++
 .../src/stories/PeoplePicker.stories.tsx      | 163 ++++++++++++++++++
 apps/vr-tests/src/stories/Persona.stories.tsx |  95 ++++++++++
 apps/vr-tests/src/stories/Pivot.stories.tsx   |  62 +++++++
 .../src/stories/ProgressIndicator.stories.tsx |  37 ++++
 apps/vr-tests/src/stories/Rating.stories.tsx  |  44 +++++
 .../src/stories/ResizeGroup.stories.tsx       |  59 +++++++
 .../src/stories/SearchBox.stories.tsx         |  36 ++++
 apps/vr-tests/src/stories/Slider.stories.tsx  |  57 ++++++
 .../src/stories/SpinButton.stories.tsx        |  56 ++++++
 apps/vr-tests/src/stories/Spinner.stories.tsx |  32 ++++
 .../src/stories/SwatchColorPicker.stories.tsx |  57 ++++++
 .../src/stories/TagPicker.stories.tsx         |  79 +++++++++
 .../src/stories/TextField.stories.tsx         |  82 +++++++++
 apps/vr-tests/src/stories/Tooltip.stories.tsx |  25 +++
 19 files changed, 1110 insertions(+), 15 deletions(-)
 create mode 100644 apps/vr-tests/src/stories/HoverCard.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/Icon.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/OverflowSet.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/PeoplePicker.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/Persona.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/Pivot.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/ProgressIndicator.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/Rating.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/ResizeGroup.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/SearchBox.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/Slider.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/SpinButton.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/Spinner.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/SwatchColorPicker.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/TagPicker.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/TextField.stories.tsx
 create mode 100644 apps/vr-tests/src/stories/Tooltip.stories.tsx

diff --git a/apps/vr-tests/src/stories/Callout.stories.tsx b/apps/vr-tests/src/stories/Callout.stories.tsx
index c0c3ccfa50481..43ef24c1b6006 100644
--- a/apps/vr-tests/src/stories/Callout.stories.tsx
+++ b/apps/vr-tests/src/stories/Callout.stories.tsx
@@ -5,19 +5,29 @@ import { storiesOf } from '@storybook/react';
 import { FabricDecoratorTall } from '../utilities';
 import { Callout, Link, DirectionalHint } from 'office-ui-fabric-react';
 
+let calloutContent = (
+  <p className='ms-CalloutExample-subText' id={ 'callout-description-1' }>
+    Message body is optional. If help documentation is available, consider adding a link to learn more at the bottom.
+</p>);
+
+let defaultProps = {
+  target: '#target',
+  calloutWidth: 200
+};
+
+// tslint:disable:jsx-ban-props
 storiesOf('Callout', module)
-  .addDecorator(FabricDecoratorTall)
   .addDecorator(story => (
-    // tslint:disable-next-line:jsx-ban-props
-    <div>
-      <button id='button'>Hey</button>
+    <div style={ { alignItems: 'center', width: '800px', height: '300px', display: 'flex', justifyContent: 'center' } }>
+      <div id='target'>Width of callout is 200 unless otherwise noted</div>
       { story() }
     </div>
   ))
+  .addDecorator(FabricDecoratorTall)
   .addDecorator(story => (
     <Screener
       steps={ new Screener.Steps()
-        .snapshot('default', { cropTo: '.ms-Layer' })
+        .snapshot('default')
         .end()
       }
     >
@@ -25,12 +35,79 @@ storiesOf('Callout', module)
     </Screener>
   ))
   .add('Root', () => (
-    <Callout
-      gapSpace={ 20 }
-      target='#button'
-    >
-      <p className='ms-CalloutExample-subText' id={ 'callout-description-1' }>
-        Message body is optional. If help documentation is available, consider adding a link to learn more at the bottom.
-        </p>
-      <Link className='ms-CalloutExample-link' href='http://microsoft.com'>Go to microsoft</Link>
-    </Callout>));
\ No newline at end of file
+    <Callout {...defaultProps} >
+      { calloutContent }
+    </Callout>
+  )).add('Bottom auto edge', () => (
+    <Callout {...defaultProps} directionalHint={ DirectionalHint.bottomAutoEdge } >
+      { calloutContent }
+    </Callout>
+  )).add('Bottom center', () => (
+    <Callout {...defaultProps} directionalHint={ DirectionalHint.bottomCenter } >
+      { calloutContent }
+    </Callout>
+  )).add('Bottom left edge', () => (
+    <Callout {...defaultProps} directionalHint={ DirectionalHint.bottomLeftEdge } >
+      { calloutContent }
+    </Callout>
+  )).add('Bottom right edge', () => (
+    <Callout {...defaultProps} directionalHint={ DirectionalHint.bottomRightEdge } >
+      { calloutContent }
+    </Callout>
+  )).add('Left bottom edge', () => (
+    <Callout {...defaultProps} directionalHint={ DirectionalHint.leftBottomEdge } >
+      { calloutContent }
+    </Callout>
+  )).add('Left center', () => (
+    <Callout {...defaultProps} directionalHint={ DirectionalHint.leftCenter } >
+      { calloutContent }
+    </Callout>
+  )).add('Left top edge', () => (
+    <Callout {...defaultProps} directionalHint={ DirectionalHint.leftTopEdge } >
+      { calloutContent }
+    </Callout>
+  )).add('Right bottom edge', () => (
+    <Callout {...defaultProps} directionalHint={ DirectionalHint.rightBottomEdge } >
+      { calloutContent }
+    </Callout>
+  )).add('Right center', () => (
+    <Callout {...defaultProps} directionalHint={ DirectionalHint.rightCenter } >
+      { calloutContent }
+    </Callout>
+  )).add('Right top edge', () => (
+    <Callout {...defaultProps} directionalHint={ DirectionalHint.rightTopEdge } >
+      { calloutContent }
+    </Callout>
+  )).add('Top auto edge', () => (
+    <Callout {...defaultProps} directionalHint={ DirectionalHint.topAutoEdge } >
+      { calloutContent }
+    </Callout>
+  )).add('Top center', () => (
+    <Callout {...defaultProps} directionalHint={ DirectionalHint.topCenter } >
+      { calloutContent }
+    </Callout>
+  )).add('Top left edge', () => (
+    <Callout {...defaultProps} directionalHint={ DirectionalHint.topLeftEdge } >
+      { calloutContent }
+    </Callout>
+  )).add('Top right edge', () => (
+    <Callout {...defaultProps} directionalHint={ DirectionalHint.topRightEdge } >
+      { calloutContent }
+    </Callout>
+  )).add('Beak 25', () => (
+    <Callout {...defaultProps} beakWidth={ 25 } >
+      { calloutContent }
+    </Callout>
+  )).add('Gap space 25', () => (
+    <Callout {...defaultProps} gapSpace={ 25 }>
+      { calloutContent }
+    </Callout>
+  )).add('No beak', () => (
+    <Callout {...defaultProps} isBeakVisible={ false } >
+      { calloutContent }
+    </Callout>
+  )).add('No callout width specified', () => (
+    <Callout {...defaultProps} calloutWidth={ undefined } >
+      { calloutContent }
+    </Callout>
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/HoverCard.stories.tsx b/apps/vr-tests/src/stories/HoverCard.stories.tsx
new file mode 100644
index 0000000000000..675fa545288ed
--- /dev/null
+++ b/apps/vr-tests/src/stories/HoverCard.stories.tsx
@@ -0,0 +1,39 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { HoverCard } from 'office-ui-fabric-react';
+
+let onRenderCompactCard = (item: any) => {
+  return (
+    <div>
+      Content
+    </div>
+  );
+};
+
+const expandingCardProps = {
+  onRenderCompactCard: onRenderCompactCard,
+  renderData: 'New York'
+};
+
+storiesOf('HoverCard', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  )).add('Root', () => (
+    <HoverCard
+      expandingCardProps={ expandingCardProps }
+      instantOpenOnClick={ true }
+    >
+      Hover over me
+    </HoverCard>
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Icon.stories.tsx b/apps/vr-tests/src/stories/Icon.stories.tsx
new file mode 100644
index 0000000000000..c0b7395f49baa
--- /dev/null
+++ b/apps/vr-tests/src/stories/Icon.stories.tsx
@@ -0,0 +1,33 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { Icon, IconType } from 'office-ui-fabric-react';
+import { TestImages } from '../common/TestImages';
+
+storiesOf('Icon', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  )).add('Root', () => (
+    <Icon iconName='CompassNW' />
+  )).add('Color', () => (
+    // tslint:disable-next-line:jsx-ban-props
+    <Icon iconName={ 'CompassNW' } style={ { color: 'red' } } />
+  )).add('Image', () => (
+    <Icon
+      iconName={ 'None' }
+      iconType={ IconType.image }
+      imageProps={ {
+        src: TestImages.iconOne
+      } }
+    />
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Modal.stories.tsx b/apps/vr-tests/src/stories/Modal.stories.tsx
index 95e1b366920c6..bad9a74809ddd 100644
--- a/apps/vr-tests/src/stories/Modal.stories.tsx
+++ b/apps/vr-tests/src/stories/Modal.stories.tsx
@@ -11,7 +11,7 @@ storiesOf('Modal', module)
   .addDecorator(story => (
     <Screener
       steps={ new Screener.Steps()
-        .snapshot('default', { cropTo: '.testWrapper' })
+        .snapshot('default', { cropTo: '.ms-Modal' })
         .end()
       }
     >
diff --git a/apps/vr-tests/src/stories/OverflowSet.stories.tsx b/apps/vr-tests/src/stories/OverflowSet.stories.tsx
new file mode 100644
index 0000000000000..116ee7f56ae57
--- /dev/null
+++ b/apps/vr-tests/src/stories/OverflowSet.stories.tsx
@@ -0,0 +1,62 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { OverflowSet, IconButton } from 'office-ui-fabric-react';
+
+const onRenderItem = (item) => item.name;
+const onRenderOverflowButton = (overflowItems) => {
+  return (
+    <IconButton
+      iconProps={ { iconName: 'More' } }
+      menuProps={ { items: overflowItems! } }
+    />
+  );
+};
+
+storiesOf('OverflowSet', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .click('.ms-Button-flexContainer')
+        .hover('.ms-Button-flexContainer')
+        .snapshot('default')
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  )).add('Root', () => (
+    <OverflowSet
+      items={ [
+        {
+          key: 'item1',
+          name: 'Link 1'
+        },
+        {
+          key: 'item2',
+          name: 'Link 2'
+        },
+        {
+          key: 'item3',
+          name: 'Link 3'
+        }
+      ] }
+      overflowItems={ [
+        {
+          key: 'item4',
+          name: 'Overflow Link 1'
+        },
+        {
+          key: 'item5',
+          name: 'Overflow Link 2'
+        }
+      ]
+      }
+      onRenderOverflowButton={ onRenderOverflowButton }
+      onRenderItem={ onRenderItem }
+    />
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/PeoplePicker.stories.tsx b/apps/vr-tests/src/stories/PeoplePicker.stories.tsx
new file mode 100644
index 0000000000000..799c7efd2b5c0
--- /dev/null
+++ b/apps/vr-tests/src/stories/PeoplePicker.stories.tsx
@@ -0,0 +1,163 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { CompactPeoplePicker, ListPeoplePicker, NormalPeoplePicker, IPersonaProps, PersonaPresence } from 'office-ui-fabric-react';
+
+import { TestImages } from '../common/TestImages';
+
+const people: (IPersonaProps & { key: string | number })[] = [
+  {
+    key: 1,
+    imageUrl: TestImages.personaFemale,
+    imageInitials: 'PV',
+    primaryText: 'Annie Lindqvist',
+    secondaryText: 'Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.online
+  },
+  {
+    key: 2,
+    imageUrl: TestImages.personaMale,
+    imageInitials: 'AR',
+    primaryText: 'Aaron Reid',
+    secondaryText: 'Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.busy
+  },
+  {
+    key: 3,
+    imageUrl: TestImages.personaMale,
+    imageInitials: 'AL',
+    primaryText: 'Alex Lundberg',
+    secondaryText: 'Software Developer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.dnd
+  },
+  {
+    key: 4,
+    imageUrl: TestImages.personaMale,
+    imageInitials: 'RK',
+    primaryText: 'Roko Kolar',
+    secondaryText: 'Financial Analyst',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.offline
+  }
+];
+
+const suggestionProps = {
+  suggestionsHeaderText: 'Suggested People',
+  mostRecentlyUsedHeaderText: 'Suggested Contacts',
+  noResultsFoundText: 'No results found',
+  loadingText: 'Loading',
+  showRemoveButtons: true,
+  suggestionsAvailableAlertText: 'People Picker Suggestions available',
+  suggestionsContainerAriaLabel: 'Suggested contacts'
+};
+
+let getTextFromItem = (persona: IPersonaProps): string => persona.primaryText as string;
+
+let getPeople = () => people;
+
+// Pickers that are 'disabled' are added before the Screener decorator because css classes for suggestion items won't exist
+storiesOf('PeoplePicker', module)
+  .addDecorator(FabricDecorator)
+  .add('Normal disabled', () => (
+    <NormalPeoplePicker
+      onResolveSuggestions={ getPeople }
+      onEmptyInputFocus={ getPeople }
+      getTextFromItem={ getTextFromItem }
+      className={ 'ms-PeoplePicker' }
+      pickerSuggestionsProps={ suggestionProps }
+      disabled
+    />
+  ))
+  .add('List disabled', () => (
+    <ListPeoplePicker
+      onResolveSuggestions={ getPeople }
+      onEmptyInputFocus={ getPeople }
+      getTextFromItem={ getTextFromItem }
+      className={ 'ms-PeoplePicker' }
+      pickerSuggestionsProps={ suggestionProps }
+      disabled
+    />
+  ))
+  .add('Compact disabled', () => (
+    <CompactPeoplePicker
+      onResolveSuggestions={ getPeople }
+      onEmptyInputFocus={ getPeople }
+      getTextFromItem={ getTextFromItem }
+      className={ 'ms-PeoplePicker' }
+      pickerSuggestionsProps={ suggestionProps }
+      disabled
+    />
+  ))
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .click('.ms-BasePicker-input')
+        .hover('.ms-Suggestions-item')
+        .snapshot('suggestions')
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  )).add('Normal', () => (
+    <NormalPeoplePicker
+      onResolveSuggestions={ getPeople }
+      onEmptyInputFocus={ getPeople }
+      getTextFromItem={ getTextFromItem }
+      className={ 'ms-PeoplePicker' }
+      pickerSuggestionsProps={ suggestionProps }
+    />
+  )).add('Normal selected', () => (
+    <NormalPeoplePicker
+      onResolveSuggestions={ getPeople }
+      onEmptyInputFocus={ getPeople }
+      getTextFromItem={ getTextFromItem }
+      className={ 'ms-PeoplePicker' }
+      pickerSuggestionsProps={ suggestionProps }
+      defaultSelectedItems={ [people[2]] }
+    />
+  )).add('List', () => (
+    <ListPeoplePicker
+      onResolveSuggestions={ getPeople }
+      onEmptyInputFocus={ getPeople }
+      getTextFromItem={ getTextFromItem }
+      className={ 'ms-PeoplePicker' }
+      pickerSuggestionsProps={ suggestionProps }
+    />
+  )).add('List selected', () => (
+    <ListPeoplePicker
+      onResolveSuggestions={ getPeople }
+      onEmptyInputFocus={ getPeople }
+      getTextFromItem={ getTextFromItem }
+      className={ 'ms-PeoplePicker' }
+      pickerSuggestionsProps={ suggestionProps }
+      defaultSelectedItems={ [people[2]] }
+    />
+  )).add('Compact', () => (
+    <CompactPeoplePicker
+      onResolveSuggestions={ getPeople }
+      onEmptyInputFocus={ getPeople }
+      getTextFromItem={ getTextFromItem }
+      className={ 'ms-PeoplePicker' }
+      pickerSuggestionsProps={ suggestionProps }
+    />
+  )).add('Compact selected', () => (
+    <CompactPeoplePicker
+      onResolveSuggestions={ getPeople }
+      onEmptyInputFocus={ getPeople }
+      getTextFromItem={ getTextFromItem }
+      className={ 'ms-PeoplePicker' }
+      pickerSuggestionsProps={ suggestionProps }
+      defaultSelectedItems={ [people[2]] }
+    />
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Persona.stories.tsx b/apps/vr-tests/src/stories/Persona.stories.tsx
new file mode 100644
index 0000000000000..6ce44bd391a6b
--- /dev/null
+++ b/apps/vr-tests/src/stories/Persona.stories.tsx
@@ -0,0 +1,95 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { Persona, PersonaPresence, PersonaSize } from 'office-ui-fabric-react';
+import { TestImages } from '../common/TestImages';
+
+const examplePersona = {
+  imageUrl: TestImages.personaFemale,
+  imageInitials: 'AL',
+  primaryText: 'Annie Lindqvist',
+  secondaryText: 'Software Engineer',
+  tertiaryText: 'In a meeting',
+  optionalText: 'Available at 4:00pm'
+};
+
+storiesOf('Persona', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Tiny', () => (
+    <Persona
+      { ...examplePersona }
+      size={ PersonaSize.tiny }
+      presence={ PersonaPresence.offline }
+    />
+  )).add('Extra extra small', () => (
+    <Persona
+      { ...examplePersona }
+      size={ PersonaSize.extraExtraSmall }
+      presence={ PersonaPresence.none }
+    />
+  )).add('Size 28', () => (
+    <Persona
+      { ...examplePersona }
+      size={ PersonaSize.size28 }
+      presence={ PersonaPresence.none }
+    />
+  )).add('Extra small', () => (
+    <Persona
+      { ...examplePersona }
+      size={ PersonaSize.extraSmall }
+      presence={ PersonaPresence.online }
+    />
+  )).add('Extra small with details', () => (
+    <Persona
+      { ...examplePersona }
+      size={ PersonaSize.extraSmall }
+      presence={ PersonaPresence.none }
+      showSecondaryText
+    />
+  )).add('Small', () => (
+    <Persona
+      { ...examplePersona }
+      size={ PersonaSize.small }
+      presence={ PersonaPresence.away }
+    />
+  )).add('Medium', () => (
+    <Persona
+      { ...examplePersona }
+      presence={ PersonaPresence.busy }
+    />
+  )).add('Medium, details hidden', () => (
+    <Persona
+      { ...examplePersona }
+      presence={ PersonaPresence.busy }
+      hidePersonaDetails
+    />
+  )).add('Large', () => (
+    <Persona
+      { ...examplePersona }
+      size={ PersonaSize.large }
+      presence={ PersonaPresence.dnd }
+    />
+  )).add('Extra large', () => (
+    <Persona
+      { ...examplePersona }
+      size={ PersonaSize.extraLarge }
+      presence={ PersonaPresence.blocked }
+    />
+  )).add('Initials', () => (
+    <Persona
+      { ...examplePersona }
+      imageUrl={ undefined }
+    />
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Pivot.stories.tsx b/apps/vr-tests/src/stories/Pivot.stories.tsx
new file mode 100644
index 0000000000000..708e9e9c8b6d0
--- /dev/null
+++ b/apps/vr-tests/src/stories/Pivot.stories.tsx
@@ -0,0 +1,62 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { Pivot, PivotItem, PivotLinkSize, PivotLinkFormat } from 'office-ui-fabric-react';
+
+storiesOf('Pivot', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  )).add('Root', () => (
+    <Pivot>
+      <PivotItem linkText='My Files'>
+        Content
+      </PivotItem>
+      <PivotItem linkText='Recent' />
+      <PivotItem linkText='Shared with me' />
+    </Pivot>
+  )).add('Count and icon', () => (
+    <Pivot>
+      <PivotItem linkText='My Files' itemCount={ 42 } itemIcon='Emoji2'>
+        Content
+      </PivotItem>
+      <PivotItem itemCount={ 23 } itemIcon='Recent' />
+      <PivotItem itemIcon='Globe' />
+      <PivotItem linkText='Shared with me' itemIcon='Ringer' itemCount={ 1 } />
+    </Pivot>
+  )).add('Large', () => (
+    <Pivot linkSize={ PivotLinkSize.large }>
+      <PivotItem linkText='My Files'>
+        Content
+          </PivotItem>
+      <PivotItem linkText='Recent' />
+      <PivotItem linkText='Shared with me' />
+    </Pivot>
+  )).add('Tabs', () => (
+    <Pivot linkFormat={ PivotLinkFormat.tabs }>
+      <PivotItem linkText='Foo'>
+        Content
+          </PivotItem>
+      <PivotItem linkText='Bar' />
+      <PivotItem linkText='Bas' />
+      <PivotItem linkText='Biz' />
+    </Pivot>
+  )).add('Tabs large', () => (
+    <Pivot linkFormat={ PivotLinkFormat.tabs } linkSize={ PivotLinkSize.large }>
+      <PivotItem linkText='Foo'>
+        Content
+          </PivotItem>
+      <PivotItem linkText='Bar' />
+      <PivotItem linkText='Bas' />
+      <PivotItem linkText='Biz' />
+    </Pivot>
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/ProgressIndicator.stories.tsx b/apps/vr-tests/src/stories/ProgressIndicator.stories.tsx
new file mode 100644
index 0000000000000..dc086863f96ba
--- /dev/null
+++ b/apps/vr-tests/src/stories/ProgressIndicator.stories.tsx
@@ -0,0 +1,37 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { ProgressIndicator } from 'office-ui-fabric-react';
+
+storiesOf('ProgressIndicator', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  )).add('0%', () => (
+    <ProgressIndicator
+      label='Example title'
+      description='Example description'
+      percentComplete={ 0 }
+    />
+  )).add('50%', () => (
+    <ProgressIndicator
+      label='Example title'
+      description='Example description'
+      percentComplete={ 0.5 }
+    />
+  )).add('100%', () => (
+    <ProgressIndicator
+      label='Example title'
+      description='Example description'
+      percentComplete={ 1 }
+    />
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Rating.stories.tsx b/apps/vr-tests/src/stories/Rating.stories.tsx
new file mode 100644
index 0000000000000..fec7f5943db0a
--- /dev/null
+++ b/apps/vr-tests/src/stories/Rating.stories.tsx
@@ -0,0 +1,44 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { Rating, RatingSize } from 'office-ui-fabric-react';
+
+storiesOf('Rating', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .hover('div.ms-Rating-star:nth-of-type(2)')
+        .snapshot('hover', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  )).add('Root', () => (
+    <Rating
+      min={ 1 }
+      max={ 5 }
+    />
+  )).add('Rated', () => (
+    <Rating
+      min={ 1 }
+      max={ 5 }
+      rating={ 2 }
+    />
+  )).add('Large', () => (
+    <Rating
+      min={ 1 }
+      max={ 5 }
+      size={ RatingSize.Large }
+    />
+  )).add('Disabled', () => (
+    <Rating
+      min={ 1 }
+      max={ 5 }
+      disabled
+    />
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/ResizeGroup.stories.tsx b/apps/vr-tests/src/stories/ResizeGroup.stories.tsx
new file mode 100644
index 0000000000000..2cd15114eda33
--- /dev/null
+++ b/apps/vr-tests/src/stories/ResizeGroup.stories.tsx
@@ -0,0 +1,59 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { ResizeGroup, OverflowSet, DefaultButton } from 'office-ui-fabric-react';
+
+// tslint:disable-next-line:max-line-length
+let list = { 'primary': [{ 'key': 'item0', 'name': 'Item 0', 'icon': 'Add', 'checked': false }, { 'key': 'item1', 'name': 'Item 1', 'icon': 'Share', 'checked': false }, { 'key': 'item2', 'name': 'Item 2', 'icon': 'Upload', 'checked': false }, { 'key': 'item3', 'name': 'Item 3', 'icon': 'Add', 'checked': false }, { 'key': 'item4', 'name': 'Item 4', 'icon': 'Share', 'checked': false }, { 'key': 'item5', 'name': 'Item 5', 'icon': 'Upload', 'checked': false }], 'overflow': [{ 'key': 'item6', 'name': 'Item 6', 'icon': 'Add', 'checked': false }, { 'key': 'item7', 'name': 'Item 7', 'icon': 'Share', 'checked': false }, { 'key': 'item8', 'name': 'Item 8', 'icon': 'Upload', 'checked': false }, { 'key': 'item9', 'name': 'Item 9', 'icon': 'Add', 'checked': false }, { 'key': 'item10', 'name': 'Item 10', 'icon': 'Share', 'checked': false }] };
+
+let noop = () => null;
+
+storiesOf('ResizeGroup', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .click('.OverflowButton')
+        .hover('.OverflowButton')
+        .snapshot('click overflow')
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  )).add('Root', () => (
+    <ResizeGroup
+      data={ list }
+      onReduceData={ noop }
+      // tslint:disable-next-line:jsx-no-lambda
+      onRenderData={ (data) => {
+        return (
+          <OverflowSet
+            items={ data.primary }
+            overflowItems={ data.overflow.length ? data.overflow : null }
+            onRenderItem={ (item) => {
+              return (
+                <DefaultButton
+                  text={ item.name }
+                  iconProps={ { iconName: item.icon } }
+                  onClick={ item.onClick }
+                  checked={ item.checked }
+                />
+              );
+            } }
+            onRenderOverflowButton={ (overflowItems) => {
+              return (
+                <DefaultButton
+                  className='OverflowButton'
+                  menuProps={ { items: overflowItems! } }
+                />
+              );
+            } }
+          />
+        );
+      } }
+    />
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/SearchBox.stories.tsx b/apps/vr-tests/src/stories/SearchBox.stories.tsx
new file mode 100644
index 0000000000000..a480c75cd33da
--- /dev/null
+++ b/apps/vr-tests/src/stories/SearchBox.stories.tsx
@@ -0,0 +1,36 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { SearchBox, Fabric } from 'office-ui-fabric-react';
+
+/**
+ * FabricDecorator isn't added at the top level so that the full SearchBox can be rendered without a parent div
+ */
+
+// tslint:disable:jsx-ban-props
+storiesOf('SearchBox', module)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .click('.ms-SearchBox-field')
+        .hover('.ms-SearchBox-field')
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  )).add('Root', () => (
+    <Fabric style={ { display: 'flex' } }>
+      <div className='testWrapper' style={ { padding: '10px', overflow: 'hidden' } }>
+        <SearchBox />
+      </div>
+    </Fabric>
+  )).add('Full', () => (
+    <Fabric className='testWrapper'>
+      <SearchBox />
+    </Fabric>
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Slider.stories.tsx b/apps/vr-tests/src/stories/Slider.stories.tsx
new file mode 100644
index 0000000000000..7f8bc63fbeb47
--- /dev/null
+++ b/apps/vr-tests/src/stories/Slider.stories.tsx
@@ -0,0 +1,57 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { Slider } from 'office-ui-fabric-react';
+
+storiesOf('Slider', module)
+  .addDecorator(story => (
+    // tslint:disable:jsx-ban-props
+    <div style={ { width: '300px', height: '200px', display: 'flex' } }>
+      { story() }
+    </div>
+  ))
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .hover('.ms-Slider-line')
+        .snapshot('hover', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  )).add('Root', () => (
+    <Slider
+      label='Basic example:'
+      min={ 1 }
+      max={ 3 }
+      step={ 1 }
+      defaultValue={ 2 }
+      showValue={ true }
+    />
+  ))
+  .add('Disabled', () => (
+    <Slider
+      label='Basic example:'
+      min={ 1 }
+      max={ 3 }
+      step={ 1 }
+      defaultValue={ 2 }
+      showValue={ true }
+      disabled
+    />
+  )).add('Vertical', () => (
+    <Slider
+      label='Basic example:'
+      min={ 1 }
+      max={ 3 }
+      step={ 1 }
+      defaultValue={ 2 }
+      showValue={ true }
+      vertical={ true }
+    />
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/SpinButton.stories.tsx b/apps/vr-tests/src/stories/SpinButton.stories.tsx
new file mode 100644
index 0000000000000..9e4a08867f981
--- /dev/null
+++ b/apps/vr-tests/src/stories/SpinButton.stories.tsx
@@ -0,0 +1,56 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { SpinButton } from 'office-ui-fabric-react';
+import { Position } from 'office-ui-fabric-react/lib/utilities/positioning';
+
+let props = {
+  defaultValue: '0',
+  label: 'Basic SpinButton:',
+  min: 0,
+  max: 100,
+  step: 1
+};
+
+storiesOf('SpinButton', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .hover('.ms-spinButton-input')
+        .snapshot('hover input', { cropTo: '.testWrapper' })
+        .click('.ms-spinButton-input')
+        .hover('.ms-spinButton-input')
+        .snapshot('click input', { cropTo: '.testWrapper' })
+        .hover('.ms-Button-flexContainer')
+        .snapshot('hover arrow', { cropTo: '.testWrapper' })
+        .mouseDown('.ms-Button-flexContainer')
+        .snapshot('mouseDown arrow', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  )).add('Root', () => (
+    <SpinButton
+      {...props}
+    />
+  )).add('Disabled', () => (
+    <SpinButton
+      {...props}
+      disabled
+    />
+  )).add('With icon', () => (
+    <SpinButton
+      {...props}
+      iconProps={ { iconName: 'IncreaseIndentLegacy' } }
+    />
+  )).add('Label at end', () => (
+    <SpinButton
+      {...props}
+      labelPosition={ Position.end }
+    />
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Spinner.stories.tsx b/apps/vr-tests/src/stories/Spinner.stories.tsx
new file mode 100644
index 0000000000000..789417e912cbb
--- /dev/null
+++ b/apps/vr-tests/src/stories/Spinner.stories.tsx
@@ -0,0 +1,32 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { Spinner, SpinnerSize } from 'office-ui-fabric-react';
+
+storiesOf('Spinner', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  )).add('Extra small', () => (
+    <Spinner size={ SpinnerSize.xSmall } />
+  )).add('Small', () => (
+    <Spinner size={ SpinnerSize.small } />
+  )).add('Medium', () => (
+    <Spinner size={ SpinnerSize.medium } />
+  )).add('Large', () => (
+    <Spinner size={ SpinnerSize.large } />
+  )).add('Label', () => (
+    <Spinner
+      size={ SpinnerSize.medium }
+      label='Spinner label'
+    />
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/SwatchColorPicker.stories.tsx b/apps/vr-tests/src/stories/SwatchColorPicker.stories.tsx
new file mode 100644
index 0000000000000..c8a82d88f077d
--- /dev/null
+++ b/apps/vr-tests/src/stories/SwatchColorPicker.stories.tsx
@@ -0,0 +1,57 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { SwatchColorPicker } from 'office-ui-fabric-react';
+
+let props = {
+  columnCount: 4,
+  cellShape: 'circle' as any,
+  colorCells:
+  [
+    { id: 'a', label: 'green', color: '#00ff00' },
+    { id: 'b', label: 'orange', color: '#ffa500' },
+    { id: 'c', label: 'blue', color: '#0000ff' },
+    { id: 'd', label: 'red', color: '#ff0000' }
+  ]
+};
+storiesOf('SwatchColorPicker', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .hover('.ms-Button-flexContainer')
+        .snapshot('hover', { cropTo: '.testWrapper' })
+        .mouseDown('.ms-Button-flexContainer')
+        .snapshot('mousedown', { cropTo: '.testWrapper' })
+        .click('.ms-Button-flexContainer')
+        .hover('.ms-Button-flexContainer')
+        .snapshot('click', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  )).add('Circle', () => (
+    <SwatchColorPicker
+      { ...props }
+    />
+  )).add('Square', () => (
+    <SwatchColorPicker
+      { ...props }
+      cellShape='square'
+    />
+  )).add('Disabled', () => (
+    <SwatchColorPicker
+      { ...props }
+      disabled
+    />
+  )).add('Multiple rows', () => (
+    <SwatchColorPicker
+      { ...props }
+      columnCount={ 4 }
+      colorCells={ props.colorCells.concat(props.colorCells) }
+    />
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/TagPicker.stories.tsx b/apps/vr-tests/src/stories/TagPicker.stories.tsx
new file mode 100644
index 0000000000000..48b2648e7caa3
--- /dev/null
+++ b/apps/vr-tests/src/stories/TagPicker.stories.tsx
@@ -0,0 +1,79 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { TagPicker } from 'office-ui-fabric-react';
+
+let testTags = [
+  'black',
+  'blue',
+  'brown',
+  'cyan',
+  'green',
+  'magenta',
+  'mauve',
+  'orange',
+  'pink',
+  'purple',
+  'red',
+  'rose',
+  'violet',
+  'white',
+  'yellow'
+].map(item => ({ key: item, name: item }));
+
+let getTextFromItem = (item) => item.name;
+
+let getList = () => testTags;
+
+// Pickers that are 'disabled' are added before the Screener decorator because css classes for suggestion items won't exist
+storiesOf('TagPicker', module)
+  .addDecorator(FabricDecorator)
+  .add('TagPicker disabled', () => (
+    <TagPicker
+      onResolveSuggestions={ getList }
+      disabled
+    />
+  ))
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .click('.ms-BasePicker-input')
+        .hover('.ms-Suggestions-item')
+        .snapshot('suggestions')
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (
+    <TagPicker
+      onResolveSuggestions={ getList }
+      onEmptyInputFocus={ getList }
+      getTextFromItem={ getTextFromItem }
+      pickerSuggestionsProps={
+        {
+          suggestionsHeaderText: 'Suggested Tags',
+          noResultsFoundText: 'No Color Tags Found'
+        }
+      }
+      itemLimit={ 2 }
+    />
+  )).add('Selected', () => (
+    <TagPicker
+      defaultSelectedItems={ [testTags[4]] }
+      onResolveSuggestions={ getList }
+      onEmptyInputFocus={ getList }
+      getTextFromItem={ getTextFromItem }
+      pickerSuggestionsProps={
+        {
+          suggestionsHeaderText: 'Suggested Tags',
+          noResultsFoundText: 'No Color Tags Found'
+        }
+      }
+      itemLimit={ 2 }
+    />
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/TextField.stories.tsx b/apps/vr-tests/src/stories/TextField.stories.tsx
new file mode 100644
index 0000000000000..271e763e25ffa
--- /dev/null
+++ b/apps/vr-tests/src/stories/TextField.stories.tsx
@@ -0,0 +1,82 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { TextField } from 'office-ui-fabric-react';
+
+storiesOf('TextField', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .hover('.ms-TextField-field')
+        .snapshot('hover', { cropTo: '.testWrapper' })
+        .click('.ms-TextField-field')
+        .hover('.ms-TextField-field')
+        .snapshot('click', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  )).add('Root', () => (
+    <TextField
+      label='Standard'
+    />
+  )).add('Placeholder', () => (
+    <TextField
+      label='Standard'
+      placeholder='Placeholder'
+    />
+  )).add('Disabled', () => (
+    <TextField
+      label='Disabled'
+      disabled
+    />
+  )).add('Required', () => (
+    <TextField
+      label='Required'
+      required
+    />
+  )).add('Error', () => (
+    <TextField
+      label='Error'
+      errorMessage='Error message'
+    />
+  )).add('Multiline', () => (
+    <TextField
+      label='Multiline'
+      multiline
+      rows={ 4 }
+    />
+  )).add('Multiline nonresizable', () => (
+    <TextField
+      label='Multiline'
+      multiline
+      rows={ 4 }
+      resizable={ false }
+    />
+  )).add('Underlined', () => (
+    <TextField
+      label='Underlined'
+      underlined
+    />
+  )).add('Borderless', () => (
+    <TextField
+      label='Borderless'
+      borderless
+      placeholder='Placeholder text'
+    />
+  )).add('Icon', () => (
+    <TextField
+      label='Icon'
+      iconProps={ { iconName: 'Calendar' } }
+    />
+  )).add('Addon', () => (
+    <TextField
+      label='Addon'
+      addonString='https://'
+    />
+  ));
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Tooltip.stories.tsx b/apps/vr-tests/src/stories/Tooltip.stories.tsx
new file mode 100644
index 0000000000000..d985a0400b767
--- /dev/null
+++ b/apps/vr-tests/src/stories/Tooltip.stories.tsx
@@ -0,0 +1,25 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { TooltipHost } from 'office-ui-fabric-react';
+
+storiesOf('Tooltip', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .hover('.ms-TooltipHost')
+        .wait(200)
+        .snapshot('default')
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  )).add('Default', () => (
+    <TooltipHost content='This is the tooltip' id='myID' calloutProps={ { gapSpace: 0 } }>
+      Hover over me
+    </TooltipHost>
+  ));
\ No newline at end of file

From 09cd193c57af47f3d657cbaebe38654c935f6bc0 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Wed, 11 Oct 2017 18:16:24 -0700
Subject: [PATCH 0825/1641] Tslint: Final pass for jsx-no-lambda in Fabric
 (#3073)

* Suppress jsx lambdas in oufr examples and tests

* Re-enable jsx-no-lambda rule

* Remove deprecated prop
---
 .../ActivityItem/examples/ActivityItem.Basic.Example.tsx     | 1 +
 .../ActivityItem/examples/ActivityItem.Persona.Example.tsx   | 1 +
 .../components/Button/examples/Button.Primary.Example.tsx    | 1 +
 .../CommandBar/examples/CommandBar.Basic.Example.tsx         | 3 +++
 .../examples/ContextualMenu.Customization.Example.tsx        | 1 +
 .../ContextualMenu/examples/ContextualMenu.Icon.Example.tsx  | 2 ++
 .../src/components/Image/Image.test.tsx                      | 2 ++
 .../src/components/Rating/examples/Rating.Basic.Example.tsx  | 1 +
 .../ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx     | 1 +
 .../ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx | 1 +
 .../examples/ScrollablePane.DetailsList.Example.tsx          | 3 +++
 .../SearchBox/examples/SearchBox.Disabled.Example.tsx        | 1 +
 .../SearchBox/examples/SearchBox.FullSize.Example.tsx        | 1 +
 .../SearchBox/examples/SearchBox.Small.Example.tsx           | 1 +
 .../SearchBox/examples/SearchBox.Underlined.Example.tsx      | 1 +
 .../src/components/Slider/Slider.test.tsx                    | 1 +
 .../src/components/Slider/examples/Slider.Basic.Example.tsx  | 3 +++
 .../src/components/SpinButton/SpinButton.test.tsx            | 2 ++
 .../SpinButton/examples/SpinButton.Basic.Example.tsx         | 1 +
 .../SpinButton/examples/SpinButton.BasicDisabled.Example.tsx | 1 +
 .../examples/SpinButton.BasicWithEndPosition.Example.tsx     | 1 +
 .../SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx | 1 +
 .../SpinButton/examples/SpinButton.Stateful.Example.tsx      | 1 +
 .../components/SwatchColorPicker/SwatchColorPicker.test.tsx  | 3 +++
 .../examples/SwatchColorPicker.Basic.Example.tsx             | 2 ++
 .../src/components/TextField/TextField.test.tsx              | 5 +++++
 .../src/components/Toggle/Toggle.test.tsx                    | 4 ++++
 .../src/components/Toggle/examples/Toggle.Basic.Example.tsx  | 1 +
 .../components/Tooltip/examples/Tooltip.Overflow.Example.tsx | 1 +
 .../office-ui-fabric-react/src/utilities/grid/Grid.test.tsx  | 3 +++
 .../src/utilities/selection/SelectionZone.test.tsx           | 1 +
 .../utilities/selection/examples/Selection.Basic.Example.tsx | 1 +
 packages/office-ui-fabric-react/tslint.json                  | 1 -
 33 files changed, 53 insertions(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Basic.Example.tsx
index 6dcf90cbe4942..bd9ddf41104c7 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Basic.Example.tsx
@@ -5,6 +5,7 @@ import { ActivityItem } from '../ActivityItem';
 import { Icon } from '../../../Icon';
 import { Link } from '../../../Link';
 
+// tslint:disable:jsx-no-lambda
 const activityItemExamples = [
   {
     key: 1,
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Persona.Example.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Persona.Example.tsx
index 2bd4c84d37b8c..289fe84e5a7f3 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Persona.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Persona.Example.tsx
@@ -5,6 +5,7 @@ import { ActivityItem } from '../ActivityItem';
 import { TestImages } from '../../../common/TestImages';
 import { Link } from '../../../Link';
 
+// tslint:disable:jsx-no-lambda
 const activityItemExamples = [
   {
     key: 1,
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
index e63bd45b91bb4..47146f1cfa9be 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
@@ -17,6 +17,7 @@ export class ButtonPrimaryExample extends React.Component<IButtonProps, {}> {
           disabled={ disabled }
           checked={ checked }
           text='Create account'
+          // tslint:disable-next-line:jsx-no-lambda
           onClick={ () => alert('Clicked') }
         />
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
index b1419899bf243..71ef289bfc623 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
@@ -38,6 +38,7 @@ export class CommandBarBasicExample extends React.Component<any, any> {
         <Toggle
           label='Show search box'
           checked={ searchBoxVisible }
+          // tslint:disable-next-line:jsx-no-lambda
           onChanged={ isSearchBoxVisible => this.setState({ isSearchBoxVisible }) }
           onText='Visible'
           offText='Hidden'
@@ -45,6 +46,7 @@ export class CommandBarBasicExample extends React.Component<any, any> {
         <Toggle
           label='Show names'
           checked={ namesVisible }
+          // tslint:disable-next-line:jsx-no-lambda
           onChanged={ areNamesVisible => this.setState({ areNamesVisible }) }
           onText='Visible'
           offText='Hidden'
@@ -52,6 +54,7 @@ export class CommandBarBasicExample extends React.Component<any, any> {
         <Toggle
           label='Show icons'
           checked={ iconsVisible }
+          // tslint:disable-next-line:jsx-no-lambda
           onChanged={ areIconsVisible => this.setState({ areIconsVisible }) }
           onText='Visible'
           offText='Hidden'
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
index ab476799a39f4..845d48999c123 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
@@ -11,6 +11,7 @@ export class ContextualMenuCustomizationExample extends React.Component<{}, {}>
   public render() {
     return (
       <DefaultButton
+        // tslint:disable-next-line:jsx-no-lambda
         componentRef={ (button) => this._button = button }
         className='ContextualMenuButton3'
         text='Click for ContextualMenu'
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.Example.tsx
index a91f55bd29616..0f32eaf68296f 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.Example.tsx
@@ -77,9 +77,11 @@ export class ContextualMenuIconExample extends React.Component<any, any> {
         { showCallout && (
           <Callout
             setInitialFocus={ true }
+            // tslint:disable-next-line:jsx-no-lambda
             onDismiss={ () => this.setState({ showCallout: false }) }
           >
             <DefaultButton
+              // tslint:disable-next-line:jsx-no-lambda
               onClick={ () => this.setState({ showCallout: false }) }
               text='Hello Popup'
             />
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
index 6cfd399dc2b4d..75d429b3d2b6a 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
@@ -26,6 +26,7 @@ describe('Image', () => {
     let component = ReactTestUtils.renderIntoDocument(
       <Image
         src={ testImage1x1 }
+        // tslint:disable-next-line:jsx-no-lambda
         onLoad={ () => done() }
       />
     );
@@ -112,6 +113,7 @@ describe('Image', () => {
     let component = ReactTestUtils.renderIntoDocument(
       <Image
         src={ brokenImage }
+        // tslint:disable-next-line:jsx-no-lambda
         onError={ () => done() }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx
index 7e9b2e7ac9b98..50be4bca60c55 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx
@@ -16,6 +16,7 @@ export class RatingBasicExample extends React.Component<any, any> {
     };
   }
 
+  // tslint:disable:jsx-no-lambda
   public render() {
     return (
       <div className='ms-RatingBasicExample'>
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx
index 05f35d8609320..c524b669e938a 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx
@@ -86,6 +86,7 @@ export class FlexBoxResizeGroupExample extends BaseComponent<{}, {}> {
     return (
       <ResizeGroup
         data={ data }
+        // tslint:disable-next-line:jsx-no-lambda
         onRenderData={ (scaledData: ILeftRightBoxSetProps) => <LeftRightBoxSet {...scaledData} /> }
         onReduceData={ onReduceData }
       />);
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
index 00009f37a81bf..8ad5384c16d1e 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
@@ -78,6 +78,7 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<{}, IResizeGrou
           data={ dataToRender }
           onReduceData={ this._onReduceData }
           onGrowData={ onGrowDataEnabled ? this._onGrowData : undefined }
+          // tslint:disable-next-line:jsx-no-lambda
           onRenderData={ (data) => {
             return (
               <OverflowSet
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.DetailsList.Example.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.DetailsList.Example.tsx
index d5a2e59fc1cf1..bb0d1b68df9f5 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.DetailsList.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.DetailsList.Example.tsx
@@ -86,6 +86,7 @@ export class ScrollablePaneDetailsListExample extends React.Component<any, any>
         <Sticky>{ selectionDetails }</Sticky>
         <TextField
           label='Filter by name:'
+          // tslint:disable-next-line:jsx-no-lambda
           onChanged={ text => this.setState({ items: text ? _items.filter(i => i.name.toLowerCase().indexOf(text) > -1) : _items }) }
         />
         <Sticky>
@@ -98,6 +99,7 @@ export class ScrollablePaneDetailsListExample extends React.Component<any, any>
             setKey='set'
             layoutMode={ DetailsListLayoutMode.fixedColumns }
             onRenderDetailsHeader={
+              // tslint:disable-next-line:jsx-no-lambda
               (detailsHeaderProps: IDetailsHeaderProps, defaultRender: IRenderFunction<IDetailsHeaderProps>) => (
                 <Sticky>
                   { defaultRender({
@@ -110,6 +112,7 @@ export class ScrollablePaneDetailsListExample extends React.Component<any, any>
             selectionPreservedOnEmptyClick={ true }
             ariaLabelForSelectionColumn='Toggle selection'
             ariaLabelForSelectAllCheckbox='Toggle selection for all items'
+            // tslint:disable-next-line:jsx-no-lambda
             onItemInvoked={ (item) => alert(`Item invoked: ${item.name}`) }
           />
         </MarqueeSelection>
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Disabled.Example.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Disabled.Example.tsx
index b80eaf14c03b4..c37fd61d5e401 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Disabled.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Disabled.Example.tsx
@@ -2,6 +2,7 @@ import * as React from 'react';
 import { SearchBox } from 'office-ui-fabric-react/lib/SearchBox';
 import './SearchBox.Examples.scss';
 
+// tslint:disable:jsx-no-lambda
 export class SearchBoxDisabledExample extends React.Component<any, any> {
 
   public render() {
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.FullSize.Example.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.FullSize.Example.tsx
index 3b3a2f491aa83..df8fe5268c1bf 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.FullSize.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.FullSize.Example.tsx
@@ -5,6 +5,7 @@ export class SearchBoxFullSizeExample extends React.Component<any, any> {
   public render() {
     return (
       <SearchBox
+        // tslint:disable:jsx-no-lambda
         onFocus={ () => console.log('onFocus called') }
         onBlur={ () => console.log('onBlur called') }
       />
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Small.Example.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Small.Example.tsx
index 1a0b292fec23c..94c75240b32e9 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Small.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Small.Example.tsx
@@ -4,6 +4,7 @@ import {
 } from 'office-ui-fabric-react/lib/SearchBox';
 import './SearchBox.Small.Example.scss';
 
+// tslint:disable:jsx-no-lambda
 export class SearchBoxSmallExample extends React.Component<any, any> {
   public render() {
     return (
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Underlined.Example.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Underlined.Example.tsx
index bf6e6dc3c1414..25c1d9c6368de 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Underlined.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Underlined.Example.tsx
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { SearchBox } from 'office-ui-fabric-react/lib/SearchBox';
 
+// tslint:disable:jsx-no-lambda
 export class SearchBoxUnderlinedExample extends React.Component<any, any> {
 
   public render() {
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
index 6fde639a2ccf2..b42e87db348ea 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
@@ -82,6 +82,7 @@ describe('Slider', () => {
     let slider: ISlider | undefined;
 
     ReactTestUtils.renderIntoDocument(
+      // tslint:disable-next-line:jsx-no-lambda
       <Slider label='slider' defaultValue={ 12 } min={ 0 } max={ 100 } componentRef={ s => slider = s } />
     );
     expect(slider!.value).toEqual(12);
diff --git a/packages/office-ui-fabric-react/src/components/Slider/examples/Slider.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Slider/examples/Slider.Basic.Example.tsx
index fb97c86d5d5ec..b85b7b8989170 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/examples/Slider.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/examples/Slider.Basic.Example.tsx
@@ -23,6 +23,7 @@ export class SliderBasicExample extends React.Component<any, any> {
             step={ 1 }
             defaultValue={ 2 }
             showValue={ true }
+            // tslint:disable-next-line:jsx-no-lambda
             onChange={ (value) => console.log(value) }
           />
           <Slider
@@ -38,6 +39,7 @@ export class SliderBasicExample extends React.Component<any, any> {
             label='Controlled example:'
             max={ 10 }
             value={ this.state.value }
+            // tslint:disable-next-line:jsx-no-lambda
             onChange={ value => this.setState({ value }) }
             showValue={ true }
           />
@@ -52,6 +54,7 @@ export class SliderBasicExample extends React.Component<any, any> {
               defaultValue={ 2 }
               showValue={ true }
               vertical={ true }
+              // tslint:disable-next-line:jsx-no-lambda
               onChange={ (value) => console.log(value) }
             />
           </div>
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
index 3fc82404650a2..0ff9d6bd042f5 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
@@ -396,6 +396,7 @@ describe('SpinButton', () => {
         min={ exampleMinValue }
         max={ exampleMaxValue }
         defaultValue={ exampleDefaultValue }
+        // tslint:disable-next-line:jsx-no-lambda
         onValidate={ (newValue: string): string => {
           let numberValue: number = +newValue;
           return (!isNaN(numberValue) && numberValue >= exampleMinValue && numberValue <= exampleMaxValue) ? newValue : errorMessage;
@@ -428,6 +429,7 @@ describe('SpinButton', () => {
         min={ exampleMinValue }
         max={ exampleMaxValue }
         value={ exampleDefaultValue }
+        // tslint:disable-next-line:jsx-no-lambda
         onValidate={ (newValue: string): string => {
           let numberValue: number = Number(newValue);
           return (!isNaN(numberValue) && numberValue >= exampleMinValue && numberValue <= exampleMaxValue) ? newValue : errorMessage;
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx
index a859c44ccc525..170847ae76046 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx
@@ -11,6 +11,7 @@ export class SpinButtonBasicExample extends React.Component<any, any> {
           min={ 0 }
           max={ 100 }
           step={ 1 }
+          // tslint:disable:jsx-no-lambda
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
         />
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicDisabled.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicDisabled.Example.tsx
index 873cc743e98d0..643a1eb419364 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicDisabled.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicDisabled.Example.tsx
@@ -12,6 +12,7 @@ export class SpinButtonBasicDisabledExample extends React.Component<any, any> {
           max={ 100 }
           step={ 1 }
           disabled={ true }
+          // tslint:disable:jsx-no-lambda
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
         />
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithEndPosition.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithEndPosition.Example.tsx
index 4a59b63332cd0..2320f732fcacb 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithEndPosition.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithEndPosition.Example.tsx
@@ -14,6 +14,7 @@ export class SpinButtonBasicWithEndPositionExample extends React.Component<any,
           min={ 0 }
           max={ 100 }
           step={ 1 }
+          // tslint:disable:jsx-no-lambda
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
         />
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx
index 41f629629712d..42fd1e94b7a82 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx
@@ -12,6 +12,7 @@ export class SpinButtonBasicWithIconExample extends React.Component<any, any> {
           min={ 0 }
           max={ 100 }
           step={ 1 }
+          // tslint:disable:jsx-no-lambda
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
         />
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
index ed1f84cd0a063..ce9639fbbb178 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { SpinButton } from 'office-ui-fabric-react/lib/SpinButton';
 
+// tslint:disable:jsx-no-lambda
 export class SpinButtonStatefulExample extends React.Component<any, any> {
   public render() {
     let suffix = ' cm';
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
index 4098a9b6aacaa..b9ce469eab5be 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
@@ -64,6 +64,7 @@ describe('SwatchColorPicker', () => {
     const wrapper = mount(
       <SwatchColorPicker
         colorCells={ [{ id: 'a', label: 'green', color: '#00ff00' }] }
+        // tslint:disable-next-line:jsx-no-lambda
         onColorChanged={ (color) => eventFireCounter++ }
         columnCount={ 4 }
       />);
@@ -83,6 +84,7 @@ describe('SwatchColorPicker', () => {
     const wrapper = mount(
       <SwatchColorPicker
         colorCells={ [{ id: 'a', label: 'green', color: '#00ff00' }] }
+        // tslint:disable-next-line:jsx-no-lambda
         onCellHovered={ (color) => eventFireCounter++ }
         columnCount={ 4 }
       />);
@@ -102,6 +104,7 @@ describe('SwatchColorPicker', () => {
     const wrapper = mount(
       <SwatchColorPicker
         colorCells={ [{ id: 'a', label: 'green', color: '#00ff00' }] }
+        // tslint:disable-next-line:jsx-no-lambda
         onCellFocused={ (color) => eventFireCounter++ }
         columnCount={ 4 }
       />);
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
index f87a56d92d630..5dd52c0f53338 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
@@ -48,9 +48,11 @@ export class SwatchColorPickerBasicExample extends React.Component<any, IBasicSw
         <div>Simple swatch color picker with multiple rows that updates it's icon color and shows a preview color:</div>
         <div style={ { color: this.state.previewColor ? this.state.previewColor : this.state.color ? this.state.color : null, fontSize: '24px' } } >Sample Text</div>
         <SwatchColorPicker
+          // tslint:disable:jsx-no-lambda
           onCellHovered={ (id, color) => this.setState({ previewColor: color! }) }
           onCellFocused={ (id, color) => this.setState({ previewColor: color! }) }
           onColorChanged={ (id, newColor) => this.setState({ color: newColor }) }
+          // tslint:enable:jsx-no-lambda
           columnCount={ 4 }
           cellShape={ 'circle' }
           colorCells={
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
index 718197b136c39..b76889b625932 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
@@ -138,6 +138,7 @@ describe('TextField', () => {
         <TextField
           label='text-field-label'
           value='whatever value'
+          // tslint:disable-next-line:jsx-no-lambda
           onGetErrorMessage={ () => errorMessage }
         />
       );
@@ -150,6 +151,7 @@ describe('TextField', () => {
         <TextField
           label='text-field-label'
           value='whatever value'
+          // tslint:disable-next-line:jsx-no-lambda
           onGetErrorMessage={ () => Promise.resolve(errorMessage) }
         />
       );
@@ -163,6 +165,7 @@ describe('TextField', () => {
         <TextField
           label='text-field-label'
           value='whatever value'
+          // tslint:disable-next-line:jsx-no-lambda
           onGetErrorMessage={ () => '' }
         />
       );
@@ -176,6 +179,7 @@ describe('TextField', () => {
       const renderedDOM: HTMLElement = renderIntoDocument(
         <TextField
           label='text-field-label'
+          // tslint:disable-next-line:jsx-no-lambda
           onGetErrorMessage={ (value: string) => actualValue = value }
         />
       );
@@ -330,6 +334,7 @@ describe('TextField', () => {
       <TextField
         defaultValue='initial value'
         onChanged={ onChangedSpy }
+        // tslint:disable-next-line:jsx-no-lambda
         onGetErrorMessage={ value => value.length > 0 ? '' : 'error' }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
index 446d2b6b6f594..bc2cea2dc6304 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
@@ -44,6 +44,7 @@ describe('Toggle', () => {
 
     ReactTestUtils.renderIntoDocument<React.ReactInstance>(
       <Toggle
+        // tslint:disable-next-line:jsx-no-lambda
         componentRef={ ref => component = ref }
         label='Label'
         onChanged={ callback }
@@ -62,6 +63,7 @@ describe('Toggle', () => {
 
     ReactTestUtils.renderIntoDocument(
       <Toggle
+        // tslint:disable-next-line:jsx-no-lambda
         componentRef={ ref => component = ref }
         label='Label'
         checked={ false }
@@ -95,12 +97,14 @@ describe('Toggle', () => {
     const wrapper = mount(
       <form
         action='#'
+        // tslint:disable-next-line:jsx-no-lambda
         onSubmit={ (e) => {
           onSubmit();
           e.preventDefault();
         } }
       >
         <Toggle
+          // tslint:disable-next-line:jsx-no-lambda
           componentRef={ ref => component = ref }
           label='Label'
         />
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/examples/Toggle.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Toggle/examples/Toggle.Basic.Example.tsx
index c4b47bdbdba8a..15dbdd69dad6e 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/examples/Toggle.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/examples/Toggle.Basic.Example.tsx
@@ -3,6 +3,7 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import { Toggle } from 'office-ui-fabric-react/lib/Toggle';
 
+// tslint:disable:jsx-no-lambda
 export const ToggleBasicExample = () => (
   <div style={ { padding: '2px' } }>
     <Toggle
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/examples/Tooltip.Overflow.Example.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/examples/Tooltip.Overflow.Example.tsx
index 36e8402bdd334..c6338df2b0bcb 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/examples/Tooltip.Overflow.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/examples/Tooltip.Overflow.Example.tsx
@@ -25,6 +25,7 @@ export class TooltipOverflowExample extends BaseComponent<{}, ITooltipOverflowEx
     };
   }
 
+  // tslint:disable:jsx-no-lambda
   public render() {
     return (
       <div>
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx b/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx
index 8577da138f324..8d200cb2b1fc8 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx
@@ -24,6 +24,7 @@ describe('Grid', () => {
       <Grid
         items={ DEFAULT_ITEMS }
         columnCount={ 4 }
+        // tslint:disable-next-line:jsx-no-lambda
         onRenderItem={ (item: any, index: number) => { return <DefaultButton role='gridcell'>item.text</DefaultButton>; } }
       />
     );
@@ -38,6 +39,7 @@ describe('Grid', () => {
       <Grid
         items={ DEFAULT_ITEMS }
         columnCount={ 2 }
+        // tslint:disable-next-line:jsx-no-lambda
         onRenderItem={ (item: any, index: number) => { return <DefaultButton role='gridcell'>item.text</DefaultButton>; } }
       />
     );
@@ -52,6 +54,7 @@ describe('Grid', () => {
       <Grid
         items={ DEFAULT_ITEMS }
         columnCount={ 2 }
+        // tslint:disable-next-line:jsx-no-lambda
         onRenderItem={ (item: any, index: number) => { return <DefaultButton role='gridcell'>item.text</DefaultButton>; } }
         positionInSet={ 1 }
         setSize={ 2 }
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
index 0deb4c3de0acf..d4fa230b74428 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
@@ -35,6 +35,7 @@ function _initializeSelection(selectionMode = SelectionMode.multiple) {
     <SelectionZone
       selection={ _selection }
       selectionMode={ selectionMode }
+      // tslint:disable-next-line:jsx-no-lambda
       onItemInvoked={ (item) => { _onItemInvokeCalled++; _lastItemInvoked = item; } }
     >
 
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx b/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
index 3d4e12ba17d52..22c556ecf4b60 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
@@ -95,6 +95,7 @@ export class SelectionBasicExample extends React.Component<any, ISelectionBasicE
         <MarqueeSelection selection={ selection } isEnabled={ selection.mode === SelectionMode.multiple } >
           <SelectionZone
             selection={ selection }
+            // tslint:disable-next-line:jsx-no-lambda
             onItemInvoked={ (item) => alert('item invoked: ' + item.name) }
           >
             { items.map((item, index) => (
diff --git a/packages/office-ui-fabric-react/tslint.json b/packages/office-ui-fabric-react/tslint.json
index cd2e6bac0f4e2..cbaba79e30a85 100644
--- a/packages/office-ui-fabric-react/tslint.json
+++ b/packages/office-ui-fabric-react/tslint.json
@@ -6,7 +6,6 @@
     "jsx-no-string-ref": false,
     "jsx-key": false,
     "jsx-boolean-value": false,
-    "jsx-no-lambda": false,
     "jsx-ban-props": false,
     "max-line-length": [
       false,

From ace1eeb589350f79200706112cdef4b4a4505b09 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Wed, 11 Oct 2017 18:17:35 -0700
Subject: [PATCH 0826/1641] OverflowSet: Add focusZoneProps and the ability to
 set role for OverflowSet (#3084)

* Add FocusZoneProps to OverflowSet and allow the creator to specify a different role for the OverflowSet

* rush change
---
 ...FocusZonePropsToOverflowSet_2017-10-11-02-01.json | 11 +++++++++++
 .../src/components/OverflowSet/OverflowSet.Props.ts  | 12 ++++++++++++
 .../src/components/OverflowSet/OverflowSet.tsx       |  7 +++++--
 3 files changed, 28 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-AddFocusZonePropsToOverflowSet_2017-10-11-02-01.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-AddFocusZonePropsToOverflowSet_2017-10-11-02-01.json b/common/changes/office-ui-fabric-react/jspurlin-AddFocusZonePropsToOverflowSet_2017-10-11-02-01.json
new file mode 100644
index 0000000000000..c4edb4dcea098
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-AddFocusZonePropsToOverflowSet_2017-10-11-02-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "OverflowSet: Add FocusZoneProps and the ability to set the role",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.Props.ts b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.Props.ts
index c6ca812032bba..6ee14580b6f15 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.Props.ts
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { OverflowSet } from './OverflowSet';
 import { IRenderFunction } from '../../Utilities';
+import { IFocusZoneProps } from '../../FocusZone';
 
 export interface IOverflowSet {
   /**
@@ -40,6 +41,17 @@ export interface IOverflowSetProps extends React.Props<OverflowSet> {
    * the overflowItems passed in as props to this function.
   */
   onRenderOverflowButton: IRenderFunction<any[]>;
+
+  /**
+   * Custom properties for OverflowSet's FocusZone.
+   */
+  focusZoneProps?: IFocusZoneProps;
+
+  /**
+   * The role for the OverflowSet.
+   * @default 'menubar'
+   */
+  role?: string;
 }
 
 export interface IOverflowSetItemProps {
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
index 5e5b0752e5226..d94f24b25d054 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
@@ -19,15 +19,18 @@ export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> implements
       items,
       overflowItems,
       onRenderOverflowButton,
-      className
+      className,
+      focusZoneProps,
+      role = 'menubar'
     } = this.props;
 
     return (
       <FocusZone
+        { ...focusZoneProps }
         componentRef={ this._resolveRef('_focusZone') }
         className={ css('ms-OverflowSet', styles.root, className) }
         direction={ FocusZoneDirection.horizontal }
-        role='menubar'
+        role={ role }
       >
         { items && this._onRenderItems(items) }
         { overflowItems && overflowItems.length > 0 && onRenderOverflowButton(overflowItems) }

From f0362588a14a3df75b94f2fe21ceb114ce07c7e1 Mon Sep 17 00:00:00 2001
From: Ian VanSchooten <ian.vanschooten@gmail.com>
Date: Wed, 11 Oct 2017 21:26:12 -0400
Subject: [PATCH 0827/1641] Clarify ComboBox autoComplete docs (#3068)

* Clarify ComboBox autoComplete docs

* Update 3054-combobox-docs_2017-10-09-16-43.json
---
 .../3054-combobox-docs_2017-10-09-16-43.json          | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.Props.ts         |  8 +++++---
 2 files changed, 16 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/3054-combobox-docs_2017-10-09-16-43.json

diff --git a/common/changes/office-ui-fabric-react/3054-combobox-docs_2017-10-09-16-43.json b/common/changes/office-ui-fabric-react/3054-combobox-docs_2017-10-09-16-43.json
new file mode 100644
index 0000000000000..8a29b1d96b8e0
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/3054-combobox-docs_2017-10-09-16-43.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Updated typing and documentation for `autoComplete` to only allow 'on' or 'off' (following html standards) rather than a boolean.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "ian.vanschooten@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
index b559e79531050..6c8a670be9876 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
@@ -59,9 +59,11 @@ export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox>
 
   /**
    * Whether the ComboBox auto completes. As the user is inputing text, it will be suggested potential matches from the list of options. If
-   * the combo box is expanded, this will also scroll to the suggested option, and give it a selected style. Defaults to false.
+   * the combo box is expanded, this will also scroll to the suggested option, and give it a selected style.
+   *
+   * @default "on"
    */
-  autoComplete?: string;
+  autoComplete?: 'on' | 'off';
 
   /**
    * Value to show in the input, does not have to map to a combobox option
@@ -197,4 +199,4 @@ export interface IComboBoxOptionStyles extends IButtonStyles {
    * in the comboBox options.
    */
   optionText: IStyle;
-}
\ No newline at end of file
+}

From a5df0412b41f470f057be571858eba959125497c Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Wed, 11 Oct 2017 18:50:17 -0700
Subject: [PATCH 0828/1641] Add bundlesize comparison script (#3092)

* Add bundlesize

* Update shrinkwrap

* Remove deprecated prop

* Update shrinkwrap ts-jest downgrade

* Add test-bundle-button to bundlesize config

* Fix file name

* Decrease maxSize for button bundle

* Move bundlesize to 'scripts' package.json

* Update shrinkwrap

* Change bundlesize file to test-bundle-button
---
 .travis.yml                            |    1 +
 common/config/rush/npm-shrinkwrap.json | 1685 +++++++++++++++++-------
 package.json                           |    5 +-
 scripts/package.json                   |   12 +-
 4 files changed, 1211 insertions(+), 492 deletions(-)

diff --git a/.travis.yml b/.travis.yml
index 35bc120558dbb..ebfc16dc9df98 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -3,4 +3,5 @@ node_js:
   - '7'
 script:
   - npm run buildfast
+  - npm run bundlesize
   - npm run vrtest
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 0412f16c2e7d3..03daaccea0144 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -19,7 +19,7 @@
       "integrity": "sha1-apeiLzpi5UwLUwo+jxSYrSuE19w="
     },
     "@rush-temp/build": {
-      "version": "file:projects/build",
+      "version": "file:projects\\build",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -379,7 +379,7 @@
       }
     },
     "@rush-temp/example-app-base": {
-      "version": "file:projects/example-app-base",
+      "version": "file:projects\\example-app-base",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -666,12 +666,8 @@
       }
     },
     "@rush-temp/experiments": {
-      "version": "file:projects/experiments",
+      "version": "file:projects\\experiments",
       "dependencies": {
-        "@uifabric/utilities": {
-          "version": "6.0.0",
-          "bundled": true
-        },
         "acorn": {
           "version": "5.1.1",
           "bundled": true
@@ -794,10 +790,6 @@
           "version": "2.0.0",
           "bundled": true
         },
-        "office-ui-fabric-react": {
-          "version": "6.0.1",
-          "bundled": true
-        },
         "os-browserify": {
           "version": "0.2.1",
           "bundled": true
@@ -929,16 +921,12 @@
       }
     },
     "@rush-temp/fabric-website": {
-      "version": "file:projects/fabric-website",
+      "version": "file:projects\\fabric-website",
       "dependencies": {
         "@types/react-addons-test-utils": {
           "version": "0.14.19",
           "bundled": true
         },
-        "@uifabric/utilities": {
-          "version": "6.0.0",
-          "bundled": true
-        },
         "acorn": {
           "version": "5.1.1",
           "bundled": true
@@ -1057,10 +1045,6 @@
           "version": "2.0.0",
           "bundled": true
         },
-        "office-ui-fabric-react": {
-          "version": "6.0.1",
-          "bundled": true
-        },
         "os-browserify": {
           "version": "0.2.1",
           "bundled": true
@@ -1258,10 +1242,10 @@
       }
     },
     "@rush-temp/icons": {
-      "version": "file:projects/icons"
+      "version": "file:projects\\icons"
     },
     "@rush-temp/merge-styles": {
-      "version": "file:projects/merge-styles",
+      "version": "file:projects\\merge-styles",
       "dependencies": {
         "@types/jest": {
           "version": "21.1.0",
@@ -1294,7 +1278,7 @@
       }
     },
     "@rush-temp/office-ui-fabric-react": {
-      "version": "file:projects/office-ui-fabric-react",
+      "version": "file:projects\\office-ui-fabric-react",
       "dependencies": {
         "@types/jest": {
           "version": "21.1.0",
@@ -1603,15 +1587,11 @@
       }
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
-      "version": "file:projects/office-ui-fabric-react-tslint"
+      "version": "file:projects\\office-ui-fabric-react-tslint"
     },
     "@rush-temp/ssr-tests": {
-      "version": "file:projects/ssr-tests",
+      "version": "file:projects\\ssr-tests",
       "dependencies": {
-        "@uifabric/utilities": {
-          "version": "6.0.0",
-          "bundled": true
-        },
         "acorn": {
           "version": "5.1.1",
           "bundled": true
@@ -1726,10 +1706,6 @@
           "version": "2.0.0",
           "bundled": true
         },
-        "office-ui-fabric-react": {
-          "version": "6.0.1",
-          "bundled": true
-        },
         "os-browserify": {
           "version": "0.2.1",
           "bundled": true
@@ -1851,7 +1827,7 @@
       }
     },
     "@rush-temp/styling": {
-      "version": "file:projects/styling",
+      "version": "file:projects\\styling",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -2088,12 +2064,8 @@
       }
     },
     "@rush-temp/test-bundle-button": {
-      "version": "file:projects/test-bundle-button",
+      "version": "file:projects\\test-bundle-button",
       "dependencies": {
-        "@uifabric/utilities": {
-          "version": "6.0.0",
-          "bundled": true
-        },
         "acorn": {
           "version": "5.1.1",
           "bundled": true
@@ -2162,10 +2134,6 @@
           "version": "2.0.0",
           "bundled": true
         },
-        "office-ui-fabric-react": {
-          "version": "6.0.1",
-          "bundled": true
-        },
         "os-browserify": {
           "version": "0.2.1",
           "bundled": true
@@ -2309,16 +2277,8 @@
       }
     },
     "@rush-temp/todo-app": {
-      "version": "file:projects/todo-app",
+      "version": "file:projects\\todo-app",
       "dependencies": {
-        "@uifabric/utilities": {
-          "version": "6.0.0",
-          "bundled": true
-        },
-        "office-ui-fabric-react": {
-          "version": "6.0.1",
-          "bundled": true
-        },
         "typescript": {
           "version": "2.4.2",
           "bundled": true
@@ -2326,7 +2286,7 @@
       }
     },
     "@rush-temp/utilities": {
-      "version": "file:projects/utilities",
+      "version": "file:projects\\utilities",
       "dependencies": {
         "@types/jest": {
           "version": "21.1.0",
@@ -2389,12 +2349,8 @@
       }
     },
     "@rush-temp/vr-tests": {
-      "version": "file:projects/vr-tests",
+      "version": "file:projects\\vr-tests",
       "dependencies": {
-        "@uifabric/utilities": {
-          "version": "6.0.0",
-          "bundled": true
-        },
         "ansi-styles": {
           "version": "2.2.1",
           "bundled": true
@@ -2417,10 +2373,6 @@
           "version": "1.0.0",
           "bundled": true
         },
-        "office-ui-fabric-react": {
-          "version": "6.0.1",
-          "bundled": true
-        },
         "postcss": {
           "version": "5.2.17",
           "bundled": true
@@ -2646,7 +2598,14 @@
     "agent-base": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-2.1.1.tgz",
-      "integrity": "sha1-1t4Q1a9hMtW9aSQn1G/FOFOQlMc="
+      "integrity": "sha1-1t4Q1a9hMtW9aSQn1G/FOFOQlMc=",
+      "dependencies": {
+        "semver": {
+          "version": "5.0.3",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.0.3.tgz",
+          "integrity": "sha1-d0Zt5YnNXTyV8TiqeLxWmjy10no="
+        }
+      }
     },
     "airbnb-js-shims": {
       "version": "1.3.0",
@@ -2686,9 +2645,9 @@
       "integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU="
     },
     "ansi-escapes": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-3.0.0.tgz",
-      "integrity": "sha512-O/klc27mWNUigtv0F8NJWbLF00OcegQalkqKURWdosW08YZKi4m6CnSUSvIZG1otNJbTWhN01Hhz389DW7mvDQ=="
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz",
+      "integrity": "sha1-06ioOzGapneTZisT52HHkRQiMG4="
     },
     "ansi-html": {
       "version": "0.0.7",
@@ -2944,6 +2903,11 @@
       "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.6.0.tgz",
       "integrity": "sha1-g+9cqGCysy5KDe7e6MdxudtXRx4="
     },
+    "axios": {
+      "version": "0.16.2",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-0.16.2.tgz",
+      "integrity": "sha1-uk+S8XFn37q0CYN4VFS5rBScPG0="
+    },
     "babel-code-frame": {
       "version": "6.26.0",
       "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
@@ -3537,6 +3501,11 @@
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-undefined-to-void/-/babel-plugin-transform-undefined-to-void-6.8.3.tgz",
       "integrity": "sha512-goYwp8dMrzHD6x9GjZ2M85Mk2vxf1h85CnUgAjfftUnlJvzF4uj5MrbReHBTbjQ96C8CuRzvhYZ3tv8H3Sc1ZA=="
     },
+    "babel-polyfill": {
+      "version": "6.23.0",
+      "resolved": "https://registry.npmjs.org/babel-polyfill/-/babel-polyfill-6.23.0.tgz",
+      "integrity": "sha1-g2TKYt+Or7gwSZ9pkXdGbDsDSZ0="
+    },
     "babel-preset-env": {
       "version": "1.6.0",
       "resolved": "https://registry.npmjs.org/babel-preset-env/-/babel-preset-env-1.6.0.tgz",
@@ -3546,11 +3515,6 @@
           "version": "2.5.1",
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.5.1.tgz",
           "integrity": "sha512-jAvM2ku7YDJ+leAq3bFH1DE0Ylw+F+EQDq4GkqZfgPEqpWYw9ofQH85uKSB9r3Tv7XDbfqVtE+sdvKJW7IlPJA=="
-        },
-        "semver": {
-          "version": "5.4.1",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
-          "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg=="
         }
       }
     },
@@ -3598,11 +3562,6 @@
           "version": "0.9.11",
           "resolved": "https://registry.npmjs.org/regenerator-transform/-/regenerator-transform-0.9.11.tgz",
           "integrity": "sha1-On0GdSDLe3F2dp61/4aGkb7+EoM="
-        },
-        "semver": {
-          "version": "5.4.1",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
-          "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg=="
         }
       }
     },
@@ -3634,7 +3593,14 @@
     "babel-runtime": {
       "version": "6.26.0",
       "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz",
-      "integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4="
+      "integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4=",
+      "dependencies": {
+        "regenerator-runtime": {
+          "version": "0.11.0",
+          "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.0.tgz",
+          "integrity": "sha512-/aA0kLeRb5N9K0d4fw7ooEbI+xDe+DKD499EQqygGqeS8N3xto15p09uY2xj7ixP81sNPXvRLnAQIqdVStgb1A=="
+        }
+      }
     },
     "babel-template": {
       "version": "6.26.0",
@@ -3715,14 +3681,7 @@
     "body-parser": {
       "version": "1.18.2",
       "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.18.2.tgz",
-      "integrity": "sha1-h2eKGdhLR9hZuDGZvVm84iKxBFQ=",
-      "dependencies": {
-        "iconv-lite": {
-          "version": "0.4.19",
-          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.19.tgz",
-          "integrity": "sha512-oTZqweIP51xaGPI4uPa56/Pri/480R+mo7SeU+YETByQNhDG55ycFyNLIgta9vXhILrxXDmF7ZGhqZIcuN0gJQ=="
-        }
-      }
+      "integrity": "sha1-h2eKGdhLR9hZuDGZvVm84iKxBFQ="
     },
     "bonjour": {
       "version": "3.5.0",
@@ -3858,6 +3817,18 @@
       "resolved": "https://registry.npmjs.org/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz",
       "integrity": "sha1-hZgoeOIbmOHGZCXgPQF0eI9Wnug="
     },
+    "bundlesize": {
+      "version": "0.15.2",
+      "resolved": "https://registry.npmjs.org/bundlesize/-/bundlesize-0.15.2.tgz",
+      "integrity": "sha512-qtn2xv9yd02nTSEzW/qWAEgzjrZhoqxb7v3uE0l0LyuCE3VbVjfxJ+ZmIiAN/Gxv4ystlFFSkOjNGTQDf+pCJA==",
+      "dependencies": {
+        "gzip-size": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-4.0.0.tgz",
+          "integrity": "sha512-6SWfFRd8r8VTKTpJCR7h/T6IbCaK+jM/n2gB1+pV3IrKcrLO1WTb8ZWdaRy1T/nwOz80cp4gAJf8sujpZxfA1w=="
+        }
+      }
+    },
     "bytes": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.0.0.tgz",
@@ -3957,6 +3928,11 @@
       "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-1.7.0.tgz",
       "integrity": "sha1-eY5ol3gVHIB2tLNg5e3SjNortGg="
     },
+    "ci-env": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/ci-env/-/ci-env-1.4.0.tgz",
+      "integrity": "sha512-IRvBrZSkdlsHgGZtaM41WBHJKEHpheqMO6B8lHN452zHiKN0imDcDjI9rIqIA4Y5/2uOAxnA8yYqWBzoYqxMMQ=="
+    },
     "ci-info": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-1.1.1.tgz",
@@ -4011,6 +3987,11 @@
       "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.2.5.tgz",
       "integrity": "sha1-+zgB1FNGdknvNgPH1hoCvRKb3m0="
     },
+    "cli-cursor": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-2.1.0.tgz",
+      "integrity": "sha1-s12sN2R5+sw+lHR9QdDQ9SOP/LU="
+    },
     "cli-table": {
       "version": "0.3.1",
       "resolved": "https://registry.npmjs.org/cli-table/-/cli-table-0.3.1.tgz",
@@ -4028,6 +4009,11 @@
       "resolved": "https://registry.npmjs.org/cli-usage/-/cli-usage-0.1.4.tgz",
       "integrity": "sha1-fAHg3HBsI0s5yTODjI4gshdXduI="
     },
+    "cli-width": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-2.2.0.tgz",
+      "integrity": "sha1-/xnt6Kml5XkyQUewwR8PvLq+1jk="
+    },
     "cliui": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
@@ -4577,7 +4563,14 @@
     "default-require-extensions": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/default-require-extensions/-/default-require-extensions-1.0.0.tgz",
-      "integrity": "sha1-836hXT4T/9m0N9M+GnW1+5eHTLg="
+      "integrity": "sha1-836hXT4T/9m0N9M+GnW1+5eHTLg=",
+      "dependencies": {
+        "strip-bom": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
+        }
+      }
     },
     "define-properties": {
       "version": "1.1.2",
@@ -5026,6 +5019,11 @@
       "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
       "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8="
     },
+    "external-editor": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/external-editor/-/external-editor-2.0.5.tgz",
+      "integrity": "sha512-Msjo64WT5W+NhOpQXh0nOHm+n0RfU1QUwDnKYvJ8dEJ8zlwLrqXNTv5mSUTJpepf41PDJGyhueTw2vNZW+Fr/w=="
+    },
     "extglob": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/extglob/-/extglob-2.0.2.tgz",
@@ -5078,6 +5076,11 @@
         }
       }
     },
+    "figures": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/figures/-/figures-2.0.0.tgz",
+      "integrity": "sha1-OrGi0qYsi/tDGgyUy3l6L84nyWI="
+    },
     "file-loader": {
       "version": "0.11.1",
       "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.11.1.tgz",
@@ -5141,9 +5144,9 @@
       "integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I="
     },
     "follow-redirects": {
-      "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-0.0.7.tgz",
-      "integrity": "sha1-NLkLqyqRGqNHVx2pDyK9NuzYqRk="
+      "version": "1.2.5",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.2.5.tgz",
+      "integrity": "sha512-lMhwQTryFbG+wYsAIEKC1Kf5IGDlVNnONRogIBllh7LLoV7pNIxW0z9fhjRar9NBql+hd2Y49KboVVNxf6GEfg=="
     },
     "for-in": {
       "version": "1.0.2",
@@ -5200,190 +5203,762 @@
       "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
       "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
     },
-    "fstream": {
-      "version": "1.0.11",
-      "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
-      "integrity": "sha1-XB+x8RdHcRTwYyoOtLcbPLD9MXE="
-    },
-    "function-bind": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
-      "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A=="
-    },
-    "function.prototype.name": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.0.3.tgz",
-      "integrity": "sha512-5EblxZUdioXi2JiMZ9FUbwYj40eQ9MFHyzFLBSPdlRl3SO8l7SLWuAnQ/at/1Wi4hjJwME/C5WpF2ZfAc8nGNw=="
-    },
-    "fuse.js": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/fuse.js/-/fuse.js-3.2.0.tgz",
-      "integrity": "sha1-8ESOgGmFW/Kj5oPNwdMg5+KgfvQ="
-    },
-    "gauge": {
-      "version": "2.7.4",
-      "resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz",
-      "integrity": "sha1-LANAXHU4w51+s3sxcCLjJfsBi/c=",
-      "dependencies": {
-        "string-width": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
-          "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
-        }
-      }
-    },
-    "gaze": {
+    "fsevents": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz",
-      "integrity": "sha1-hHIkZ3rbiHDWeSV+0ziP22HkAQU="
-    },
-    "generate-function": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/generate-function/-/generate-function-2.0.0.tgz",
-      "integrity": "sha1-aFj+fAlpt9TpCTM3ZHrHn2DfvnQ="
-    },
-    "generate-object-property": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/generate-object-property/-/generate-object-property-1.2.0.tgz",
-      "integrity": "sha1-nA4cQDCM6AT0eDYYuTf6iPmdUNA="
-    },
-    "generic-names": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/generic-names/-/generic-names-1.0.2.tgz",
-      "integrity": "sha1-4lt/7OtbWo8o9flyp8z+V+Virc0=",
-      "dependencies": {
-        "loader-utils": {
-          "version": "0.2.17",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz",
-          "integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g="
-        }
-      }
-    },
-    "get-caller-file": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz",
-      "integrity": "sha1-9wLmMSfn4jHBYKgMFVSstw1QR+U="
-    },
-    "get-port": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/get-port/-/get-port-3.2.0.tgz",
-      "integrity": "sha1-3Xzn3hh8Bsi/NTeWrHHgmfCYDrw="
-    },
-    "get-stdin": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz",
-      "integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4="
-    },
-    "get-stream": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz",
-      "integrity": "sha1-jpQ9E1jcN1VQVOy+LtsFqhdO3hQ="
-    },
-    "get-value": {
-      "version": "2.0.6",
-      "resolved": "https://registry.npmjs.org/get-value/-/get-value-2.0.6.tgz",
-      "integrity": "sha1-3BXKHGcjh8p2vTesCjlbogQqLCg="
-    },
-    "getpass": {
-      "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
-      "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo="
-    },
-    "github": {
-      "version": "7.3.2",
-      "resolved": "https://registry.npmjs.org/github/-/github-7.3.2.tgz",
-      "integrity": "sha1-/hDN5pZDUsXZHhGnYW0m1f+2+Hs="
-    },
-    "glamor": {
-      "version": "2.20.40",
-      "resolved": "https://registry.npmjs.org/glamor/-/glamor-2.20.40.tgz",
-      "integrity": "sha512-DNXCd+c14N9QF8aAKrfl4xakPk5FdcFwmH7sD0qnC0Pr7xoZ5W9yovhUrY/dJc3psfGGXC58vqQyRtuskyUJxA=="
-    },
-    "glamorous": {
-      "version": "4.9.7",
-      "resolved": "https://registry.npmjs.org/glamorous/-/glamorous-4.9.7.tgz",
-      "integrity": "sha512-4Ts/k1fCvRez1k6xYIuXQqFmVG1RjbpQZOHNCWSteY1Tza4YeyExkj4SypAhCspcAzkjvqaUboaLmSfMmx9uLQ=="
-    },
-    "glob": {
-      "version": "7.1.2",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
-      "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ=="
-    },
-    "glob-base": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz",
-      "integrity": "sha1-27Fk9iIbHAscz4Kuoyi0l98Oo8Q="
-    },
-    "glob-parent": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz",
-      "integrity": "sha1-gTg9ctsFT8zPUzbaqQLxgvbtuyg="
-    },
-    "glob2base": {
-      "version": "0.0.12",
-      "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz",
-      "integrity": "sha1-nUGbPijxLoOjYhZKJ3BVkiycDVY="
-    },
-    "global": {
-      "version": "4.3.2",
-      "resolved": "https://registry.npmjs.org/global/-/global-4.3.2.tgz",
-      "integrity": "sha1-52mJJopsdMOJCLEwWxD8DjlOnQ8=",
-      "dependencies": {
-        "process": {
-          "version": "0.5.2",
-          "resolved": "https://registry.npmjs.org/process/-/process-0.5.2.tgz",
-          "integrity": "sha1-FjjYqONML0QKkduVq5rrZ3/Bhc8="
-        }
-      }
-    },
-    "globals": {
-      "version": "9.18.0",
-      "resolved": "https://registry.npmjs.org/globals/-/globals-9.18.0.tgz",
-      "integrity": "sha512-S0nG3CLEQiY/ILxqtztTWH/3iRRdyBLw6KMDxnKMchrtbj2OFmehVh0WUCfW3DUrIgx/qFrJPICrq4Z4sTR9UQ=="
-    },
-    "globby": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
-      "integrity": "sha1-9abXDoOV4hyFj7BInWTfAkJNUGw=",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.2.tgz",
+      "integrity": "sha512-Sn44E5wQW4bTHXvQmvSHwqbuiXtduD6Rrjm2ZtUEGbyrig+nUH3t/QD4M4/ZXViY556TBpRgZkHLDx3JxPwxiw==",
+      "optional": true,
       "dependencies": {
-        "pify": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
-          "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
-        }
-      }
-    },
-    "globule": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/globule/-/globule-1.2.0.tgz",
-      "integrity": "sha1-HcScaCLdnoovoAuiopUAboZkvQk="
-    },
-    "graceful-fs": {
-      "version": "4.1.11",
-      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz",
-      "integrity": "sha1-Dovf5NHduIVNZOBOp8AOKgJuVlg="
-    },
-    "graceful-readlink": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz",
-      "integrity": "sha1-TK+tdrxi8C+gObL5Tpo906ORpyU="
-    },
-    "growl": {
-      "version": "1.9.2",
-      "resolved": "https://registry.npmjs.org/growl/-/growl-1.9.2.tgz",
-      "integrity": "sha1-Dqd0NxXbjY3ixe3hd14bRayFwC8="
-    },
-    "growly": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz",
-      "integrity": "sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE="
-    },
-    "gzip-size": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-3.0.0.tgz",
-      "integrity": "sha1-VGGI6b3DN/Zzdy+BZgRks4nc5SA="
-    },
-    "handle-thing": {
+        "abbrev": {
+          "version": "1.1.0",
+          "bundled": true,
+          "optional": true
+        },
+        "ajv": {
+          "version": "4.11.8",
+          "bundled": true,
+          "optional": true
+        },
+        "ansi-regex": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "aproba": {
+          "version": "1.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "are-we-there-yet": {
+          "version": "1.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "asn1": {
+          "version": "0.2.3",
+          "bundled": true,
+          "optional": true
+        },
+        "assert-plus": {
+          "version": "0.2.0",
+          "bundled": true,
+          "optional": true
+        },
+        "asynckit": {
+          "version": "0.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "aws-sign2": {
+          "version": "0.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "aws4": {
+          "version": "1.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "balanced-match": {
+          "version": "0.4.2",
+          "bundled": true
+        },
+        "bcrypt-pbkdf": {
+          "version": "1.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "block-stream": {
+          "version": "0.0.9",
+          "bundled": true
+        },
+        "boom": {
+          "version": "2.10.1",
+          "bundled": true
+        },
+        "brace-expansion": {
+          "version": "1.1.7",
+          "bundled": true
+        },
+        "buffer-shims": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "caseless": {
+          "version": "0.12.0",
+          "bundled": true,
+          "optional": true
+        },
+        "co": {
+          "version": "4.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "code-point-at": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "combined-stream": {
+          "version": "1.0.5",
+          "bundled": true
+        },
+        "concat-map": {
+          "version": "0.0.1",
+          "bundled": true
+        },
+        "console-control-strings": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "core-util-is": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "cryptiles": {
+          "version": "2.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "dashdash": {
+          "version": "1.14.1",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "debug": {
+          "version": "2.6.8",
+          "bundled": true,
+          "optional": true
+        },
+        "deep-extend": {
+          "version": "0.4.2",
+          "bundled": true,
+          "optional": true
+        },
+        "delayed-stream": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "delegates": {
+          "version": "1.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "ecc-jsbn": {
+          "version": "0.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "extend": {
+          "version": "3.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "extsprintf": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "forever-agent": {
+          "version": "0.6.1",
+          "bundled": true,
+          "optional": true
+        },
+        "form-data": {
+          "version": "2.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "fs.realpath": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "fstream": {
+          "version": "1.0.11",
+          "bundled": true
+        },
+        "fstream-ignore": {
+          "version": "1.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "gauge": {
+          "version": "2.7.4",
+          "bundled": true,
+          "optional": true
+        },
+        "getpass": {
+          "version": "0.1.7",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "glob": {
+          "version": "7.1.2",
+          "bundled": true
+        },
+        "graceful-fs": {
+          "version": "4.1.11",
+          "bundled": true
+        },
+        "har-schema": {
+          "version": "1.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "har-validator": {
+          "version": "4.2.1",
+          "bundled": true,
+          "optional": true
+        },
+        "has-unicode": {
+          "version": "2.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "hawk": {
+          "version": "3.1.3",
+          "bundled": true,
+          "optional": true
+        },
+        "hoek": {
+          "version": "2.16.3",
+          "bundled": true
+        },
+        "http-signature": {
+          "version": "1.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "inflight": {
+          "version": "1.0.6",
+          "bundled": true
+        },
+        "inherits": {
+          "version": "2.0.3",
+          "bundled": true
+        },
+        "ini": {
+          "version": "1.3.4",
+          "bundled": true,
+          "optional": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "is-typedarray": {
+          "version": "1.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "isstream": {
+          "version": "0.1.2",
+          "bundled": true,
+          "optional": true
+        },
+        "jodid25519": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "jsbn": {
+          "version": "0.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "json-schema": {
+          "version": "0.2.3",
+          "bundled": true,
+          "optional": true
+        },
+        "json-stable-stringify": {
+          "version": "1.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "json-stringify-safe": {
+          "version": "5.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "jsonify": {
+          "version": "0.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "jsprim": {
+          "version": "1.4.0",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "mime-db": {
+          "version": "1.27.0",
+          "bundled": true
+        },
+        "mime-types": {
+          "version": "2.1.15",
+          "bundled": true
+        },
+        "minimatch": {
+          "version": "3.0.4",
+          "bundled": true
+        },
+        "minimist": {
+          "version": "0.0.8",
+          "bundled": true
+        },
+        "mkdirp": {
+          "version": "0.5.1",
+          "bundled": true
+        },
+        "ms": {
+          "version": "2.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "node-pre-gyp": {
+          "version": "0.6.36",
+          "bundled": true,
+          "optional": true
+        },
+        "nopt": {
+          "version": "4.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "npmlog": {
+          "version": "4.1.0",
+          "bundled": true,
+          "optional": true
+        },
+        "number-is-nan": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "oauth-sign": {
+          "version": "0.8.2",
+          "bundled": true,
+          "optional": true
+        },
+        "object-assign": {
+          "version": "4.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "once": {
+          "version": "1.4.0",
+          "bundled": true
+        },
+        "os-homedir": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "os-tmpdir": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "osenv": {
+          "version": "0.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "path-is-absolute": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "performance-now": {
+          "version": "0.2.0",
+          "bundled": true,
+          "optional": true
+        },
+        "process-nextick-args": {
+          "version": "1.0.7",
+          "bundled": true
+        },
+        "punycode": {
+          "version": "1.4.1",
+          "bundled": true,
+          "optional": true
+        },
+        "qs": {
+          "version": "6.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "rc": {
+          "version": "1.2.1",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "minimist": {
+              "version": "1.2.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "bundled": true
+        },
+        "request": {
+          "version": "2.81.0",
+          "bundled": true,
+          "optional": true
+        },
+        "rimraf": {
+          "version": "2.6.1",
+          "bundled": true
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "bundled": true
+        },
+        "semver": {
+          "version": "5.3.0",
+          "bundled": true,
+          "optional": true
+        },
+        "set-blocking": {
+          "version": "2.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "signal-exit": {
+          "version": "3.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "sntp": {
+          "version": "1.0.9",
+          "bundled": true,
+          "optional": true
+        },
+        "sshpk": {
+          "version": "1.13.0",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "string_decoder": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "string-width": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "stringstream": {
+          "version": "0.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "strip-ansi": {
+          "version": "3.0.1",
+          "bundled": true
+        },
+        "strip-json-comments": {
+          "version": "2.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "tar": {
+          "version": "2.2.1",
+          "bundled": true
+        },
+        "tar-pack": {
+          "version": "3.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "tough-cookie": {
+          "version": "2.3.2",
+          "bundled": true,
+          "optional": true
+        },
+        "tunnel-agent": {
+          "version": "0.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "tweetnacl": {
+          "version": "0.14.5",
+          "bundled": true,
+          "optional": true
+        },
+        "uid-number": {
+          "version": "0.0.6",
+          "bundled": true,
+          "optional": true
+        },
+        "util-deprecate": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "uuid": {
+          "version": "3.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "verror": {
+          "version": "1.3.6",
+          "bundled": true,
+          "optional": true
+        },
+        "wide-align": {
+          "version": "1.1.2",
+          "bundled": true,
+          "optional": true
+        },
+        "wrappy": {
+          "version": "1.0.2",
+          "bundled": true
+        }
+      }
+    },
+    "fstream": {
+      "version": "1.0.11",
+      "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
+      "integrity": "sha1-XB+x8RdHcRTwYyoOtLcbPLD9MXE="
+    },
+    "function-bind": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
+      "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A=="
+    },
+    "function.prototype.name": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.0.3.tgz",
+      "integrity": "sha512-5EblxZUdioXi2JiMZ9FUbwYj40eQ9MFHyzFLBSPdlRl3SO8l7SLWuAnQ/at/1Wi4hjJwME/C5WpF2ZfAc8nGNw=="
+    },
+    "fuse.js": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/fuse.js/-/fuse.js-3.2.0.tgz",
+      "integrity": "sha1-8ESOgGmFW/Kj5oPNwdMg5+KgfvQ="
+    },
+    "gauge": {
+      "version": "2.7.4",
+      "resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz",
+      "integrity": "sha1-LANAXHU4w51+s3sxcCLjJfsBi/c=",
+      "dependencies": {
+        "is-fullwidth-code-point": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
+          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
+        },
+        "string-width": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
+          "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
+        }
+      }
+    },
+    "gaze": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz",
+      "integrity": "sha1-hHIkZ3rbiHDWeSV+0ziP22HkAQU="
+    },
+    "generate-function": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/generate-function/-/generate-function-2.0.0.tgz",
+      "integrity": "sha1-aFj+fAlpt9TpCTM3ZHrHn2DfvnQ="
+    },
+    "generate-object-property": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/generate-object-property/-/generate-object-property-1.2.0.tgz",
+      "integrity": "sha1-nA4cQDCM6AT0eDYYuTf6iPmdUNA="
+    },
+    "generic-names": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/generic-names/-/generic-names-1.0.2.tgz",
+      "integrity": "sha1-4lt/7OtbWo8o9flyp8z+V+Virc0=",
+      "dependencies": {
+        "loader-utils": {
+          "version": "0.2.17",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz",
+          "integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g="
+        }
+      }
+    },
+    "get-caller-file": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.2.tgz",
+      "integrity": "sha1-9wLmMSfn4jHBYKgMFVSstw1QR+U="
+    },
+    "get-port": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/get-port/-/get-port-3.2.0.tgz",
+      "integrity": "sha1-3Xzn3hh8Bsi/NTeWrHHgmfCYDrw="
+    },
+    "get-stdin": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-4.0.1.tgz",
+      "integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4="
+    },
+    "get-stream": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz",
+      "integrity": "sha1-jpQ9E1jcN1VQVOy+LtsFqhdO3hQ="
+    },
+    "get-value": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/get-value/-/get-value-2.0.6.tgz",
+      "integrity": "sha1-3BXKHGcjh8p2vTesCjlbogQqLCg="
+    },
+    "getpass": {
+      "version": "0.1.7",
+      "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
+      "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo="
+    },
+    "github": {
+      "version": "7.3.2",
+      "resolved": "https://registry.npmjs.org/github/-/github-7.3.2.tgz",
+      "integrity": "sha1-/hDN5pZDUsXZHhGnYW0m1f+2+Hs=",
+      "dependencies": {
+        "follow-redirects": {
+          "version": "0.0.7",
+          "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-0.0.7.tgz",
+          "integrity": "sha1-NLkLqyqRGqNHVx2pDyK9NuzYqRk="
+        }
+      }
+    },
+    "github-build": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/github-build/-/github-build-1.2.0.tgz",
+      "integrity": "sha512-Iq7NialLYz5yRZDkiX8zaOWd+N3BssJJfUvG7wd8r4MeLCN88SdxEYo2esseMLpLtP4vNXhgamg1eRm7hw59qw==",
+      "dependencies": {
+        "axios": {
+          "version": "0.15.3",
+          "resolved": "https://registry.npmjs.org/axios/-/axios-0.15.3.tgz",
+          "integrity": "sha1-LJ1jiy4ZGgjqHWzJiOrda6W9wFM="
+        },
+        "follow-redirects": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.0.0.tgz",
+          "integrity": "sha1-jjQpjL0uF28lTv/sdaHHjMhJ/Tc="
+        }
+      }
+    },
+    "glamor": {
+      "version": "2.20.40",
+      "resolved": "https://registry.npmjs.org/glamor/-/glamor-2.20.40.tgz",
+      "integrity": "sha512-DNXCd+c14N9QF8aAKrfl4xakPk5FdcFwmH7sD0qnC0Pr7xoZ5W9yovhUrY/dJc3psfGGXC58vqQyRtuskyUJxA=="
+    },
+    "glamorous": {
+      "version": "4.9.7",
+      "resolved": "https://registry.npmjs.org/glamorous/-/glamorous-4.9.7.tgz",
+      "integrity": "sha512-4Ts/k1fCvRez1k6xYIuXQqFmVG1RjbpQZOHNCWSteY1Tza4YeyExkj4SypAhCspcAzkjvqaUboaLmSfMmx9uLQ=="
+    },
+    "glob": {
+      "version": "7.1.2",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
+      "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ=="
+    },
+    "glob-base": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz",
+      "integrity": "sha1-27Fk9iIbHAscz4Kuoyi0l98Oo8Q="
+    },
+    "glob-parent": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz",
+      "integrity": "sha1-gTg9ctsFT8zPUzbaqQLxgvbtuyg="
+    },
+    "glob2base": {
+      "version": "0.0.12",
+      "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz",
+      "integrity": "sha1-nUGbPijxLoOjYhZKJ3BVkiycDVY="
+    },
+    "global": {
+      "version": "4.3.2",
+      "resolved": "https://registry.npmjs.org/global/-/global-4.3.2.tgz",
+      "integrity": "sha1-52mJJopsdMOJCLEwWxD8DjlOnQ8=",
+      "dependencies": {
+        "process": {
+          "version": "0.5.2",
+          "resolved": "https://registry.npmjs.org/process/-/process-0.5.2.tgz",
+          "integrity": "sha1-FjjYqONML0QKkduVq5rrZ3/Bhc8="
+        }
+      }
+    },
+    "globals": {
+      "version": "9.18.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-9.18.0.tgz",
+      "integrity": "sha512-S0nG3CLEQiY/ILxqtztTWH/3iRRdyBLw6KMDxnKMchrtbj2OFmehVh0WUCfW3DUrIgx/qFrJPICrq4Z4sTR9UQ=="
+    },
+    "globby": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
+      "integrity": "sha1-9abXDoOV4hyFj7BInWTfAkJNUGw=",
+      "dependencies": {
+        "pify": {
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+          "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
+        }
+      }
+    },
+    "globule": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/globule/-/globule-1.2.0.tgz",
+      "integrity": "sha1-HcScaCLdnoovoAuiopUAboZkvQk="
+    },
+    "graceful-fs": {
+      "version": "4.1.11",
+      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz",
+      "integrity": "sha1-Dovf5NHduIVNZOBOp8AOKgJuVlg="
+    },
+    "graceful-readlink": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz",
+      "integrity": "sha1-TK+tdrxi8C+gObL5Tpo906ORpyU="
+    },
+    "growl": {
+      "version": "1.9.2",
+      "resolved": "https://registry.npmjs.org/growl/-/growl-1.9.2.tgz",
+      "integrity": "sha1-Dqd0NxXbjY3ixe3hd14bRayFwC8="
+    },
+    "growly": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz",
+      "integrity": "sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE="
+    },
+    "gzip-size": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-3.0.0.tgz",
+      "integrity": "sha1-VGGI6b3DN/Zzdy+BZgRks4nc5SA="
+    },
+    "handle-thing": {
       "version": "1.2.5",
       "resolved": "https://registry.npmjs.org/handle-thing/-/handle-thing-1.2.5.tgz",
       "integrity": "sha1-/Xqtcmvxpf0W38KbL3pmAdJxOcQ="
@@ -5644,9 +6219,9 @@
       "integrity": "sha1-MRYKNpMK2vH8BMYHT360FGXU7Es="
     },
     "iconv-lite": {
-      "version": "0.4.13",
-      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.13.tgz",
-      "integrity": "sha1-H4irpKsLFQjoMSrMOTRfNumS4vI="
+      "version": "0.4.19",
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.19.tgz",
+      "integrity": "sha512-oTZqweIP51xaGPI4uPa56/Pri/480R+mo7SeU+YETByQNhDG55ycFyNLIgta9vXhILrxXDmF7ZGhqZIcuN0gJQ=="
     },
     "icss-replace-symbols": {
       "version": "1.1.0",
@@ -5713,6 +6288,28 @@
       "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-3.0.8.tgz",
       "integrity": "sha1-hVG45bTVcyROZqNLBPfTIHaitTQ="
     },
+    "inquirer": {
+      "version": "3.0.6",
+      "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-3.0.6.tgz",
+      "integrity": "sha1-4EqqnQW3o8ubD0B9BDdfBEcZA0c=",
+      "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+        }
+      }
+    },
     "internal-ip": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/internal-ip/-/internal-ip-1.2.0.tgz",
@@ -5848,9 +6445,9 @@
       "integrity": "sha1-zGZ3aVYCvlUO8R6LSqYwU0K20Ko="
     },
     "is-fullwidth-code-point": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
-      "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
+      "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8="
     },
     "is-function": {
       "version": "1.0.1",
@@ -5924,6 +6521,11 @@
       "resolved": "https://registry.npmjs.org/is-primitive/-/is-primitive-2.0.0.tgz",
       "integrity": "sha1-IHurkWOEmcB7Kt8kCkGochADRXU="
     },
+    "is-promise": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-promise/-/is-promise-2.1.0.tgz",
+      "integrity": "sha1-eaKp7OfwlugPNtKy87wWwf9L8/o="
+    },
     "is-property": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/is-property/-/is-property-1.0.2.tgz",
@@ -6017,14 +6619,7 @@
     "istanbul-lib-instrument": {
       "version": "1.8.0",
       "resolved": "https://registry.npmjs.org/istanbul-lib-instrument/-/istanbul-lib-instrument-1.8.0.tgz",
-      "integrity": "sha1-ZvbJQhzJ7EcE928tsIS6kHiitTI=",
-      "dependencies": {
-        "semver": {
-          "version": "5.4.1",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
-          "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg=="
-        }
-      }
+      "integrity": "sha1-ZvbJQhzJ7EcE928tsIS6kHiitTI="
     },
     "istanbul-lib-report": {
       "version": "1.1.1",
@@ -6070,6 +6665,11 @@
       "resolved": "https://registry.npmjs.org/jest/-/jest-21.2.1.tgz",
       "integrity": "sha512-mXN0ppPvWYoIcC+R+ctKxAJ28xkt/Z5Js875padm4GbgUn6baeR5N4Ng6LjatIRpUQDZVJABT7Y4gucFjPryfw==",
       "dependencies": {
+        "ansi-escapes": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-3.0.0.tgz",
+          "integrity": "sha512-O/klc27mWNUigtv0F8NJWbLF00OcegQalkqKURWdosW08YZKi4m6CnSUSvIZG1otNJbTWhN01Hhz389DW7mvDQ=="
+        },
         "ansi-regex": {
           "version": "3.0.0",
           "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
@@ -6127,6 +6727,11 @@
           "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
           "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
         },
+        "is-fullwidth-code-point": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
+          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
+        },
         "jest-cli": {
           "version": "21.2.1",
           "resolved": "https://registry.npmjs.org/jest-cli/-/jest-cli-21.2.1.tgz",
@@ -6137,55 +6742,16 @@
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
           "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
         },
-        "load-json-file": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
-          "integrity": "sha1-eUfkIUmvgNaWy/eXvKq8/h/inKg=",
-          "dependencies": {
-            "pify": {
-              "version": "2.3.0",
-              "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
-              "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
-            }
-          }
-        },
         "micromatch": {
           "version": "2.3.11",
           "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
           "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
         },
-        "path-type": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/path-type/-/path-type-2.0.0.tgz",
-          "integrity": "sha1-8BLMuEFbcJb8LaoQVMPXI4lZTHM=",
-          "dependencies": {
-            "pify": {
-              "version": "2.3.0",
-              "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
-              "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
-            }
-          }
-        },
-        "read-pkg": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-2.0.0.tgz",
-          "integrity": "sha1-jvHAYjxqbbDcZxPEv6xGMysjaPg="
-        },
-        "read-pkg-up": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-2.0.0.tgz",
-          "integrity": "sha1-a3KoBImE4MQeeVEP1en6mbO1Sb4="
-        },
         "strip-ansi": {
           "version": "4.0.0",
           "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
           "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8="
         },
-        "strip-bom": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
-          "integrity": "sha1-IzTBjpx1n3vdVv3vfprj1YjmjtM="
-        },
         "yargs": {
           "version": "9.0.1",
           "resolved": "https://registry.npmjs.org/yargs/-/yargs-9.0.1.tgz",
@@ -6394,46 +6960,21 @@
           "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
           "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
         },
+        "is-fullwidth-code-point": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
+          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
+        },
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
           "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
         },
-        "load-json-file": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
-          "integrity": "sha1-eUfkIUmvgNaWy/eXvKq8/h/inKg="
-        },
         "micromatch": {
           "version": "2.3.11",
           "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
           "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
         },
-        "path-type": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/path-type/-/path-type-2.0.0.tgz",
-          "integrity": "sha1-8BLMuEFbcJb8LaoQVMPXI4lZTHM="
-        },
-        "pify": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
-          "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
-        },
-        "read-pkg": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-2.0.0.tgz",
-          "integrity": "sha1-jvHAYjxqbbDcZxPEv6xGMysjaPg="
-        },
-        "read-pkg-up": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-2.0.0.tgz",
-          "integrity": "sha1-a3KoBImE4MQeeVEP1en6mbO1Sb4="
-        },
-        "strip-bom": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
-          "integrity": "sha1-IzTBjpx1n3vdVv3vfprj1YjmjtM="
-        },
         "yargs": {
           "version": "9.0.1",
           "resolved": "https://registry.npmjs.org/yargs/-/yargs-9.0.1.tgz",
@@ -6482,6 +7023,11 @@
       "integrity": "sha1-peZUwuWi3rXyAdls77yoDA7y9RM=",
       "optional": true
     },
+    "jschardet": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/jschardet/-/jschardet-1.5.1.tgz",
+      "integrity": "sha512-vE2hT1D0HLZCLLclfBSfkfTTedhVj0fubHpJBHKwwUWX0nSbhPAfk+SG9rTX95BYNmau8rGFfCeaT6T5OW1C2A=="
+    },
     "jsdom": {
       "version": "9.12.0",
       "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-9.12.0.tgz",
@@ -6583,9 +7129,9 @@
       "integrity": "sha1-OwmSTt+fCDwEkP3UwLxEIeBHZO4="
     },
     "load-json-file": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
-      "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
+      "integrity": "sha1-eUfkIUmvgNaWy/eXvKq8/h/inKg=",
       "dependencies": {
         "pify": {
           "version": "2.3.0",
@@ -6962,10 +7508,50 @@
       "resolved": "https://registry.npmjs.org/meow/-/meow-3.7.0.tgz",
       "integrity": "sha1-cstmi0JSKCkKu/qFaJJYcwioAfs=",
       "dependencies": {
+        "find-up": {
+          "version": "1.1.2",
+          "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
+          "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8="
+        },
+        "load-json-file": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
+          "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA="
+        },
         "minimist": {
           "version": "1.2.0",
           "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
           "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
+        },
+        "path-exists": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
+          "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s="
+        },
+        "path-type": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
+          "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE="
+        },
+        "pify": {
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+          "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
+        },
+        "read-pkg": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
+          "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg="
+        },
+        "read-pkg-up": {
+          "version": "1.0.1",
+          "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
+          "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI="
+        },
+        "strip-bom": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
         }
       }
     },
@@ -7133,6 +7719,11 @@
       "resolved": "https://registry.npmjs.org/multicast-dns-service-types/-/multicast-dns-service-types-1.1.0.tgz",
       "integrity": "sha1-iZ8R2WhuXgXLkbNdXw5jt3PPyQE="
     },
+    "mute-stream": {
+      "version": "0.0.7",
+      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.7.tgz",
+      "integrity": "sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s="
+    },
     "nan": {
       "version": "2.7.0",
       "resolved": "https://registry.npmjs.org/nan/-/nan-2.7.0.tgz",
@@ -7191,9 +7782,9 @@
       "integrity": "sha512-+ktMAh1Jwas+TnGodfCfjUbJKoANqPaJFN0z0iqh41eqD8dvguNzcitVSBSVK1pidz0AqGbLKcoVuVLRVZ/aVg=="
     },
     "node-fetch": {
-      "version": "1.7.3",
-      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.3.tgz",
-      "integrity": "sha512-NhZ4CsKx7cYm2vSrBAr2PvFOe6sWDf0UYLRqA6svUYg7+/TSfVAu49jYC4BvQ4Sms9SZgdqGBgroqfDhJdTyKQ=="
+      "version": "1.6.3",
+      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.6.3.tgz",
+      "integrity": "sha1-3CNO3WSJmC1Y6PDbT2lQKavNjAQ="
     },
     "node-forge": {
       "version": "0.6.33",
@@ -7232,14 +7823,7 @@
     "node-notifier": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-5.1.2.tgz",
-      "integrity": "sha1-L6nhJgX6EACdRFSdb82KY93g5P8=",
-      "dependencies": {
-        "semver": {
-          "version": "5.4.1",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
-          "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg=="
-        }
-      }
+      "integrity": "sha1-L6nhJgX6EACdRFSdb82KY93g5P8="
     },
     "node-sass": {
       "version": "4.5.3",
@@ -7437,20 +8021,52 @@
       "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
       "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E="
     },
+    "onetime": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/onetime/-/onetime-2.0.1.tgz",
+      "integrity": "sha1-BnQoIw/WdEOyeUsiu6UotoZ5YtQ="
+    },
     "open": {
       "version": "0.0.5",
       "resolved": "https://registry.npmjs.org/open/-/open-0.0.5.tgz",
       "integrity": "sha1-QsPhjslUZra/DcQvOilFw/DK2Pw="
     },
+    "opencollective": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/opencollective/-/opencollective-1.0.3.tgz",
+      "integrity": "sha1-ruY3K8KBRFg2kMPKja7PwSDdDvE=",
+      "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+        },
+        "minimist": {
+          "version": "1.2.0",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
+          "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+        }
+      }
+    },
     "opener": {
       "version": "1.4.3",
       "resolved": "https://registry.npmjs.org/opener/-/opener-1.4.3.tgz",
       "integrity": "sha1-XG2ixdflgx6P+jlklQ+NZnSskLg="
     },
     "opn": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/opn/-/opn-5.1.0.tgz",
-      "integrity": "sha512-iPNl7SyM8L30Rm1sjGdLLheyHVw5YXVfi3SKWJzBI7efxRwHojfRFjwE/OLM6qp9xJYMgab8WicTU1cPoY+Hpg=="
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/opn/-/opn-4.0.2.tgz",
+      "integrity": "sha1-erwi5kTf9jsKltWrfyeQwPAavJU="
     },
     "optimist": {
       "version": "0.6.1",
@@ -7609,9 +8225,9 @@
       }
     },
     "path-type": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
-      "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE=",
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/path-type/-/path-type-2.0.0.tgz",
+      "integrity": "sha1-8BLMuEFbcJb8LaoQVMPXI4lZTHM=",
       "dependencies": {
         "pify": {
           "version": "2.3.0",
@@ -8869,6 +9485,11 @@
         }
       }
     },
+    "prettycli": {
+      "version": "1.4.3",
+      "resolved": "https://registry.npmjs.org/prettycli/-/prettycli-1.4.3.tgz",
+      "integrity": "sha512-KLiwAXXfSWXZqGmZlnKPuGMTFp+0QbcySplL1ft9gfteT/BNsG64Xo8u2Qr9r+qnsIZWBQ66Zs8tg+8s2fmzvw=="
+    },
     "private": {
       "version": "0.1.7",
       "resolved": "https://registry.npmjs.org/private/-/private-0.1.7.tgz",
@@ -8991,14 +9612,7 @@
     "raw-body": {
       "version": "2.3.2",
       "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.3.2.tgz",
-      "integrity": "sha1-vNYMd9Prk83gBQKVw/N5OJvIj4k=",
-      "dependencies": {
-        "iconv-lite": {
-          "version": "0.4.19",
-          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.19.tgz",
-          "integrity": "sha512-oTZqweIP51xaGPI4uPa56/Pri/480R+mo7SeU+YETByQNhDG55ycFyNLIgta9vXhILrxXDmF7ZGhqZIcuN0gJQ=="
-        }
-      }
+      "integrity": "sha1-vNYMd9Prk83gBQKVw/N5OJvIj4k="
     },
     "raw-loader": {
       "version": "0.5.1",
@@ -9108,26 +9722,14 @@
       "integrity": "sha512-fqSmx0RPuUxvG5kQantyW89HnOCjz6e53o3AajuaXSVWL8O8tXNUCoSdxaO6xScXpujIV+iVaYUGBpOm5Pdhiw=="
     },
     "read-pkg": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
-      "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg="
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-2.0.0.tgz",
+      "integrity": "sha1-jvHAYjxqbbDcZxPEv6xGMysjaPg="
     },
     "read-pkg-up": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
-      "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI=",
-      "dependencies": {
-        "find-up": {
-          "version": "1.1.2",
-          "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
-          "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8="
-        },
-        "path-exists": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
-          "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s="
-        }
-      }
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-2.0.0.tgz",
+      "integrity": "sha1-a3KoBImE4MQeeVEP1en6mbO1Sb4="
     },
     "readable-stream": {
       "version": "2.3.3",
@@ -9208,9 +9810,9 @@
       "integrity": "sha512-jVpo1GadrDAK59t/0jRx5VxYWQEDkkEKi6+HjE3joFVLfDOh9Xrdh0dF1eSq+BI/SwvTQ44gSscJ8N5zYL61sg=="
     },
     "regenerator-runtime": {
-      "version": "0.11.0",
-      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.0.tgz",
-      "integrity": "sha512-/aA0kLeRb5N9K0d4fw7ooEbI+xDe+DKD499EQqygGqeS8N3xto15p09uY2xj7ixP81sNPXvRLnAQIqdVStgb1A=="
+      "version": "0.10.5",
+      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz",
+      "integrity": "sha1-M2w+/BIgrc7dosn6tntaeVWjNlg="
     },
     "regenerator-transform": {
       "version": "0.10.1",
@@ -9324,6 +9926,11 @@
       "resolved": "https://registry.npmjs.org/resolve-url/-/resolve-url-0.2.1.tgz",
       "integrity": "sha1-LGN/53yJOv0qZj/iGqkIAGjiBSo="
     },
+    "restore-cursor": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-2.0.0.tgz",
+      "integrity": "sha1-n37ih/gv0ybU/RYpI9YhKe7g368="
+    },
     "right-align": {
       "version": "0.1.3",
       "resolved": "https://registry.npmjs.org/right-align/-/right-align-0.1.3.tgz",
@@ -9339,6 +9946,16 @@
       "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz",
       "integrity": "sha1-D0WEKVxTo2KK9+bXmsohzlfRxuc="
     },
+    "run-async": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/run-async/-/run-async-2.3.0.tgz",
+      "integrity": "sha1-A3GrSuC91yDUFm19/aZP96RFpsA="
+    },
+    "rx": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/rx/-/rx-4.1.0.tgz",
+      "integrity": "sha1-pfE/957zt0D+MKqAP7CfmIBdR4I="
+    },
     "safe-buffer": {
       "version": "5.1.1",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.1.tgz",
@@ -9376,16 +9993,61 @@
           "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
           "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
         },
+        "find-up": {
+          "version": "1.1.2",
+          "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
+          "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8="
+        },
+        "is-fullwidth-code-point": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
+          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
+        },
+        "load-json-file": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
+          "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA="
+        },
         "os-locale": {
           "version": "1.4.0",
           "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
           "integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk="
         },
+        "path-exists": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
+          "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s="
+        },
+        "path-type": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
+          "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE="
+        },
+        "pify": {
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+          "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
+        },
+        "read-pkg": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
+          "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg="
+        },
+        "read-pkg-up": {
+          "version": "1.0.1",
+          "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
+          "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI="
+        },
         "string-width": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
           "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
         },
+        "strip-bom": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
+        },
         "which-module": {
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/which-module/-/which-module-1.0.0.tgz",
@@ -9793,9 +10455,9 @@
       "integrity": "sha1-v4y3uDJWxFUeMTR8YxF3jbme7FI="
     },
     "semver": {
-      "version": "5.0.3",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-5.0.3.tgz",
-      "integrity": "sha1-d0Zt5YnNXTyV8TiqeLxWmjy10no="
+      "version": "5.4.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
+      "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg=="
     },
     "send": {
       "version": "0.16.1",
@@ -10187,11 +10849,6 @@
           "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
           "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg="
         },
-        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
-          "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8="
-        },
         "strip-ansi": {
           "version": "4.0.0",
           "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
@@ -10220,9 +10877,9 @@
       "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8="
     },
     "strip-bom": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
-      "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
+      "integrity": "sha1-IzTBjpx1n3vdVv3vfprj1YjmjtM="
     },
     "strip-eof": {
       "version": "1.0.0",
@@ -10316,15 +10973,55 @@
           "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
           "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
         },
+        "find-up": {
+          "version": "1.1.2",
+          "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
+          "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8="
+        },
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
           "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
         },
+        "load-json-file": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
+          "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA="
+        },
         "micromatch": {
           "version": "2.3.11",
           "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
           "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
+        },
+        "path-exists": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
+          "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s="
+        },
+        "path-type": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
+          "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE="
+        },
+        "pify": {
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+          "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
+        },
+        "read-pkg": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
+          "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg="
+        },
+        "read-pkg-up": {
+          "version": "1.0.1",
+          "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
+          "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI="
+        },
+        "strip-bom": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
         }
       }
     },
@@ -10370,6 +11067,11 @@
       "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.4.tgz",
       "integrity": "sha512-uZYhyU3EX8O7HQP+J9fTVYwsq90Vr68xPEFo7yrVImIxYvHgukBEgOB/SgGoorWVTzGM/3Z+wUNnboA4M8jWrg=="
     },
+    "tmp": {
+      "version": "0.0.33",
+      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.33.tgz",
+      "integrity": "sha512-jRCJlojKnZ3addtTOjdIqoRuPEKBvNXcGYqzO6zWZX8KfKEpnGY5jfggJQ3EjKuu8D4bJRr0y+cYJFmYbImXGw=="
+    },
     "tmpl": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/tmpl/-/tmpl-1.0.4.tgz",
@@ -10483,41 +11185,16 @@
             }
           }
         },
-        "load-json-file": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
-          "integrity": "sha1-eUfkIUmvgNaWy/eXvKq8/h/inKg="
-        },
-        "path-type": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/path-type/-/path-type-2.0.0.tgz",
-          "integrity": "sha1-8BLMuEFbcJb8LaoQVMPXI4lZTHM="
-        },
-        "pify": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
-          "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
-        },
-        "read-pkg": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-2.0.0.tgz",
-          "integrity": "sha1-jvHAYjxqbbDcZxPEv6xGMysjaPg="
-        },
-        "read-pkg-up": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-2.0.0.tgz",
-          "integrity": "sha1-a3KoBImE4MQeeVEP1en6mbO1Sb4="
+        "is-fullwidth-code-point": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
+          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
         },
         "source-map-support": {
           "version": "0.5.0",
           "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.0.tgz",
           "integrity": "sha512-vUoN3I7fHQe0R/SJLKRdKYuEdRGogsviXFkHHo17AWaTGv17VLnxw+CFXvqy+y4ORZ3doWLQcxRYfwKrsd/H7Q=="
         },
-        "strip-bom": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
-          "integrity": "sha1-IzTBjpx1n3vdVv3vfprj1YjmjtM="
-        },
         "yargs": {
           "version": "9.0.1",
           "resolved": "https://registry.npmjs.org/yargs/-/yargs-9.0.1.tgz",
@@ -10533,14 +11210,7 @@
     "tslint": {
       "version": "5.7.0",
       "resolved": "https://registry.npmjs.org/tslint/-/tslint-5.7.0.tgz",
-      "integrity": "sha1-wl4NDJL6EgHCvDDoROCOaCtPNVI=",
-      "dependencies": {
-        "semver": {
-          "version": "5.4.1",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
-          "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg=="
-        }
-      }
+      "integrity": "sha1-wl4NDJL6EgHCvDDoROCOaCtPNVI="
     },
     "tslint-microsoft-contrib": {
       "version": "5.0.1",
@@ -10922,41 +11592,16 @@
           "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.4.1.tgz",
           "integrity": "sha1-BCHjOf1xQZs9oT0Smzl5BAIwR24="
         },
-        "load-json-file": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
-          "integrity": "sha1-eUfkIUmvgNaWy/eXvKq8/h/inKg="
-        },
-        "path-type": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/path-type/-/path-type-2.0.0.tgz",
-          "integrity": "sha1-8BLMuEFbcJb8LaoQVMPXI4lZTHM="
-        },
-        "pify": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
-          "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
-        },
-        "read-pkg": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-2.0.0.tgz",
-          "integrity": "sha1-jvHAYjxqbbDcZxPEv6xGMysjaPg="
-        },
-        "read-pkg-up": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-2.0.0.tgz",
-          "integrity": "sha1-a3KoBImE4MQeeVEP1en6mbO1Sb4="
+        "is-fullwidth-code-point": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
+          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
         },
         "source-map": {
           "version": "0.5.7",
           "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
           "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
-        "strip-bom": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
-          "integrity": "sha1-IzTBjpx1n3vdVv3vfprj1YjmjtM="
-        },
         "yargs": {
           "version": "8.0.2",
           "resolved": "https://registry.npmjs.org/yargs/-/yargs-8.0.2.tgz",
@@ -10999,7 +11644,14 @@
     "webpack-dev-server": {
       "version": "2.9.1",
       "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.9.1.tgz",
-      "integrity": "sha512-qFKs4Wg6JI6FkAQ6WFqeDCCxXEBLsDHkqJB3f9tmlqx8C68Y9vQWwcaMT4Q9H8WF32Q6QUNmgK4qQkdHfXvj/g=="
+      "integrity": "sha512-qFKs4Wg6JI6FkAQ6WFqeDCCxXEBLsDHkqJB3f9tmlqx8C68Y9vQWwcaMT4Q9H8WF32Q6QUNmgK4qQkdHfXvj/g==",
+      "dependencies": {
+        "opn": {
+          "version": "5.1.0",
+          "resolved": "https://registry.npmjs.org/opn/-/opn-5.1.0.tgz",
+          "integrity": "sha512-iPNl7SyM8L30Rm1sjGdLLheyHVw5YXVfi3SKWJzBI7efxRwHojfRFjwE/OLM6qp9xJYMgab8WicTU1cPoY+Hpg=="
+        }
+      }
     },
     "webpack-hot-middleware": {
       "version": "2.19.1",
@@ -11025,11 +11677,6 @@
           "version": "4.6.1",
           "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-4.6.1.tgz",
           "integrity": "sha1-BW0UJE89zBzq3+aK+c/wxUc6M/M="
-        },
-        "semver": {
-          "version": "5.4.1",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
-          "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg=="
         }
       }
     },
@@ -11058,7 +11705,14 @@
     "whatwg-encoding": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-1.0.1.tgz",
-      "integrity": "sha1-PGxFGhmO567FWx7GHQkgxngBpfQ="
+      "integrity": "sha1-PGxFGhmO567FWx7GHQkgxngBpfQ=",
+      "dependencies": {
+        "iconv-lite": {
+          "version": "0.4.13",
+          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.13.tgz",
+          "integrity": "sha1-H4irpKsLFQjoMSrMOTRfNumS4vI="
+        }
+      }
     },
     "whatwg-fetch": {
       "version": "2.0.3",
@@ -11097,6 +11751,11 @@
       "resolved": "https://registry.npmjs.org/wide-align/-/wide-align-1.1.2.tgz",
       "integrity": "sha512-ijDLlyQ7s6x1JgCLur53osjm/UXUYD9+0PbYKrBsYisYXzCxN+HC3mYDNy/dWdmf3AwqwU3CXwDCvsNgGK1S0w==",
       "dependencies": {
+        "is-fullwidth-code-point": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
+          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
+        },
         "string-width": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
@@ -11124,6 +11783,11 @@
       "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
       "integrity": "sha1-2Pw9KE3QV5T+hJc8rs3Rz4JP3YU=",
       "dependencies": {
+        "is-fullwidth-code-point": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
+          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
+        },
         "string-width": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
@@ -11215,16 +11879,61 @@
           "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
           "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
         },
+        "find-up": {
+          "version": "1.1.2",
+          "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
+          "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8="
+        },
+        "is-fullwidth-code-point": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
+          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
+        },
+        "load-json-file": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
+          "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA="
+        },
         "os-locale": {
           "version": "1.4.0",
           "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
           "integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk="
         },
+        "path-exists": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
+          "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s="
+        },
+        "path-type": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
+          "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE="
+        },
+        "pify": {
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+          "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
+        },
+        "read-pkg": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
+          "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg="
+        },
+        "read-pkg-up": {
+          "version": "1.0.1",
+          "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
+          "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI="
+        },
         "string-width": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
           "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
         },
+        "strip-bom": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
+        },
         "which-module": {
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/which-module/-/which-module-1.0.0.tgz",
@@ -11250,4 +11959,4 @@
       }
     }
   }
-}
\ No newline at end of file
+}
diff --git a/package.json b/package.json
index 7b965aed1a5cd..2eb83d0eb79df 100644
--- a/package.json
+++ b/package.json
@@ -20,10 +20,11 @@
     "build": "npm run _rushRebuild",
     "buildfast": "npm run _rushBuild",
     "change": "node node_modules/@microsoft/rush/bin/rush change",
-    "generate": "node node_modules/@microsoft/rush/bin/rush generate"
+    "generate": "node node_modules/@microsoft/rush/bin/rush generate",
+    "bundlesize": "cd scripts && npm run bundlesize"
   },
   "license": "MIT",
   "devDependencies": {
     "@microsoft/rush": "3.0.12"
   }
-}
+}
\ No newline at end of file
diff --git a/scripts/package.json b/scripts/package.json
index 62f8f163c2e89..7dcca9af81999 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -4,7 +4,8 @@
   "private": true,
   "scripts": {
     "clean": "",
-    "build": "node -v"
+    "build": "node -v",
+    "bundlesize": "bundlesize --debug"
   },
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.7.5",
@@ -12,6 +13,7 @@
     "@uifabric/merge-styles": ">=5.3.2 <6.0.0",
     "autoprefixer": "^7.1.5",
     "awesome-typescript-loader": "^3.2.3",
+    "bundlesize": "^0.15.2",
     "chalk": "^2.1.0",
     "command-line-args": "^4.0.7",
     "cpx": "^1.5.0",
@@ -41,5 +43,11 @@
     "webpack-dev-server": "^2.7.1",
     "webpack-notifier": "^1.5.0",
     "yargs": "^6.5.0"
-  }
+  },
+  "bundlesize": [
+    {
+      "path": "../apps/test-bundle-button/dist/main.min.js",
+      "maxSize": "40 kB"
+    }
+  ]
 }
\ No newline at end of file

From 95f1a37bad9be2a5ab0d56ec6ea5e23dc7192230 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Wed, 11 Oct 2017 22:42:00 -0700
Subject: [PATCH 0829/1641] ComponentPage: Adding Implementation Examples
 section + TextField as example (#3078)

* Separated out more examples plus test grouping error example

* Removed AllErrorMessage test example

* Added implementation examples prop

* Revert "Added implementation examples prop"

This reverts commit 483f895c733778a8f63ee6e24ed248c1b683c0ee.

* Revert "Revert "Added implementation examples prop""

This reverts commit 7c7de60957eb7231db7dc1a2d7885908dd08d9f7.

* Revert "Added implementation examples prop"

This reverts commit 483f895c733778a8f63ee6e24ed248c1b683c0ee.

* Separated out more examples plus test grouping error example

* Added implementation examples props

* Added change files
---
 .../Components/TextFieldComponentPage.tsx     |  4 +++
 .../impl-examples_2017-10-10-16-09.json       | 11 +++++++
 .../impl-examples_2017-10-10-16-09.json       | 11 +++++++
 .../impl-examples_2017-10-10-16-09.json       | 11 +++++++
 .../ComponentPage/ComponentPage.scss          |  1 +
 .../ComponentPage/ComponentPage.tsx           | 18 +++++++++++
 .../components/TextField/TextFieldPage.tsx    | 28 ++++++++++++-----
 .../examples/TextField.Addon.Example.tsx      | 15 +++++++++
 .../TextField.AllErrorMessage.Example.tsx     | 31 +++++++++++++++++++
 ...xamples.tsx => TextField.Icon.Example.tsx} |  6 +---
 10 files changed, 123 insertions(+), 13 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/impl-examples_2017-10-10-16-09.json
 create mode 100644 common/changes/@uifabric/fabric-website/impl-examples_2017-10-10-16-09.json
 create mode 100644 common/changes/office-ui-fabric-react/impl-examples_2017-10-10-16-09.json
 create mode 100644 packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Addon.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/TextField/examples/TextField.AllErrorMessage.Example.tsx
 rename packages/office-ui-fabric-react/src/components/TextField/examples/{TextField.ImplementationExamples.tsx => TextField.Icon.Example.tsx} (74%)

diff --git a/apps/fabric-website/src/pages/Components/TextFieldComponentPage.tsx b/apps/fabric-website/src/pages/Components/TextFieldComponentPage.tsx
index f4efe3baecd69..11dd74f30d8a0 100644
--- a/apps/fabric-website/src/pages/Components/TextFieldComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/TextFieldComponentPage.tsx
@@ -24,6 +24,10 @@ export class TextFieldComponentPage extends React.Component<any, any> {
                   'text': 'Variants',
                   'location': 'Variants'
                 },
+                {
+                  'text': 'Implementation Examples',
+                  'location': 'Implementation Examples'
+                },
                 {
                   'text': 'Implementation',
                   'location': 'Implementation'
diff --git a/common/changes/@uifabric/example-app-base/impl-examples_2017-10-10-16-09.json b/common/changes/@uifabric/example-app-base/impl-examples_2017-10-10-16-09.json
new file mode 100644
index 0000000000000..0f3c4c763374f
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/impl-examples_2017-10-10-16-09.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "Added Implementation Examples section to ComponentPage",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/impl-examples_2017-10-10-16-09.json b/common/changes/@uifabric/fabric-website/impl-examples_2017-10-10-16-09.json
new file mode 100644
index 0000000000000..d727bd637b7d0
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/impl-examples_2017-10-10-16-09.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Added Implementation Examples section to ComponentPage",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/impl-examples_2017-10-10-16-09.json b/common/changes/office-ui-fabric-react/impl-examples_2017-10-10-16-09.json
new file mode 100644
index 0000000000000..a8a791aee183d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/impl-examples_2017-10-10-16-09.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Adding Implementation Examples section to ComponentPage. Implemented in TextField.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss b/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss
index 0450f7ac31cdf..d7ef28480b82e 100644
--- a/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss
+++ b/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss
@@ -103,6 +103,7 @@ $dontColor: #A61E22;
 
   .ComponentPage-bestPracticesSection,
   .ComponentPage-variantsSection,
+  .ComponentPage-implementationExamplesSection,
   .ComponentPage-implementationSection {
     padding: $componentPagePadding;
   }
diff --git a/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx b/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
index a7f7937d1a74c..cc123dae13e0a 100644
--- a/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
+++ b/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
@@ -17,6 +17,7 @@ export interface IComponentPageProps {
   title: string;
   componentName: string;
   exampleCards?: JSX.Element;
+  implementationExampleCards?: JSX.Element;
   propertiesTables?: JSX.Element;
   bestPractices?: JSX.Element;
   dos?: JSX.Element;
@@ -69,6 +70,7 @@ export class ComponentPage extends React.Component<IComponentPageProps, {}> {
             </div>
             { this._getDosAndDonts() }
             { this._getVariants() }
+            { this._getImplementationExamples() }
             { this._getPropertiesTable() }
             { this.props.otherSections && this.props.otherSections.map((componentPageSection: IComponentPageSection) => {
               return this._getSection(componentPageSection);
@@ -115,6 +117,9 @@ export class ComponentPage extends React.Component<IComponentPageProps, {}> {
         { this.props.exampleCards && <div className='ComponentPage-navLink'>
           <Link { ...{ href: this._baseUrl + '#Variants' } }>Variants</Link>
         </div> }
+        { this.props.implementationExampleCards && <div className='ComponentPage-navLink'>
+          <Link { ...{ href: this._baseUrl + '#Implementation Examples' } }>Implementation Examples</Link>
+        </div> }
         { this.props.propertiesTables && <div className='ComponentPage-navLink'>
           <Link { ...{ href: this._baseUrl + '#Implementation' } }>Implementation</Link>
         </div> }
@@ -203,6 +208,19 @@ export class ComponentPage extends React.Component<IComponentPageProps, {}> {
     return undefined;
   }
 
+  private _getImplementationExamples(): JSX.Element | undefined {
+    if (this.props.implementationExampleCards) {
+      return (
+        <div className='ComponentPage-implementationExamplesSection'>
+          <h2 className='ComponentPage-subHeading ComponentPage-variantsTitle' id='Implementation Examples'>Implementation Examples</h2>
+          { this.props.implementationExampleCards }
+        </div>
+      );
+    }
+
+    return undefined;
+  }
+
   private _getComponentStatusBadges(): JSX.Element | undefined {
     if (this.props.componentStatus && this.props.areBadgesVisible) {
       return (
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
index 4a266681792bc..f56f4e55fb6cb 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
@@ -5,6 +5,7 @@ import {
   IComponentDemoPageProps,
   PropertiesTableSet
 } from '@uifabric/example-app-base';
+import { TextFieldAddonExample } from './examples/TextField.Addon.Example';
 import { TextFieldBasicExample } from './examples/TextField.Basic.Example';
 import { TextFieldCustomRenderExample } from './examples/TextField.CustomRender.Example';
 import { TextFieldPlaceholderExample } from './examples/TextField.Placeholder.Example';
@@ -12,10 +13,11 @@ import { TextFieldMultilineExample } from './examples/TextField.Multiline.Exampl
 import { TextFieldUnderlinedExample } from './examples/TextField.Underlined.Example';
 import { TextFieldBorderlessExample } from './examples/TextField.Borderless.Example';
 import { TextFieldErrorMessageExample } from './examples/TextField.ErrorMessage.Example';
-import { TextFieldImplementationExamples } from './examples/TextField.ImplementationExamples';
+import { TextFieldIconExample } from './examples/TextField.Icon.Example';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { TextFieldStatus } from './TextField.checklist';
 
+const TextFieldAddonExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Addon.Example.tsx') as string;
 const TextFieldBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx') as string;
 const TextFieldCustomRenderExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx') as string;
 const TextFieldPlaceholderExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Placeholder.Example.tsx') as string;
@@ -23,7 +25,7 @@ const TextFieldMultilineExampleCode = require('!raw-loader!office-ui-fabric-reac
 const TextFieldUnderlinedExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Underlined.Example.tsx') as string;
 const TextFieldBorderlessExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Borderless.Example.tsx') as string;
 const TextFieldErrorMessageExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx') as string;
-const TextFieldImplementationExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.ImplementationExamples.tsx') as string;
+const TextFieldIconExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Icon.Example.tsx') as string;
 
 export class TextFieldPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
@@ -63,11 +65,21 @@ export class TextFieldPage extends React.Component<IComponentDemoPageProps, {}>
             >
               <TextFieldBorderlessExample />
             </ExampleCard>
+          </div>
+        }
+        implementationExampleCards={
+          <div>
             <ExampleCard
-              title='TextField error message variations'
-              code={ TextFieldErrorMessageExampleCode }
+              title='Textfield with an addon'
+              code={ TextFieldAddonExampleCode }
             >
-              <TextFieldErrorMessageExample />
+              <TextFieldAddonExample />
+            </ExampleCard>
+            <ExampleCard
+              title='TextField with an icon'
+              code={ TextFieldIconExampleCode }
+            >
+              <TextFieldIconExample />
             </ExampleCard>
             <ExampleCard
               title='TextField with custom Label'
@@ -76,10 +88,10 @@ export class TextFieldPage extends React.Component<IComponentDemoPageProps, {}>
               <TextFieldCustomRenderExample />
             </ExampleCard>
             <ExampleCard
-              title='Implementation Examples'
-              code={ TextFieldImplementationExampleCode }
+              title='TextField error message variations'
+              code={ TextFieldErrorMessageExampleCode }
             >
-              <TextFieldImplementationExamples />
+              <TextFieldErrorMessageExample />
             </ExampleCard>
           </div>
         }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Addon.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Addon.Example.tsx
new file mode 100644
index 0000000000000..b4699417d3961
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Addon.Example.tsx
@@ -0,0 +1,15 @@
+import * as React from 'react';
+import { TextField } from 'office-ui-fabric-react/lib/TextField';
+import './TextField.Examples.scss';
+
+export class TextFieldAddonExample extends React.Component<any, any> {
+  public render() {
+    return (
+      <div className='ms-TextFieldExample'>
+        <TextField
+          addonString='https://'
+        />
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.AllErrorMessage.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.AllErrorMessage.Example.tsx
new file mode 100644
index 0000000000000..56bc6e9ee788f
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.AllErrorMessage.Example.tsx
@@ -0,0 +1,31 @@
+import * as React from 'react';
+import { TextField } from 'office-ui-fabric-react/lib/TextField';
+import './TextField.Examples.scss';
+
+export class TextFieldAllErrorMessageExample extends React.Component<any, any> {
+  public render() {
+    return (
+      <div className='ms-TextFieldExample'>
+        <TextField
+          errorMessage='Error message'
+          label='Default with error message'
+        />
+        <TextField
+          errorMessage='Error message'
+          placeholder='Placeholder with error message'
+        />
+        <TextField
+          errorMessage='Error message'
+          label='Underlined with error message:'
+          underlined
+        />
+        <TextField
+          errorMessage='Error message'
+          label='Multiline with error message'
+          multiline
+          rows={ 4 }
+        />
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ImplementationExamples.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Icon.Example.tsx
similarity index 74%
rename from packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ImplementationExamples.tsx
rename to packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Icon.Example.tsx
index 824849c1f69f4..8238298dbd3d5 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ImplementationExamples.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Icon.Example.tsx
@@ -3,7 +3,7 @@ import { TextField } from 'office-ui-fabric-react/lib/TextField';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import './TextField.Examples.scss';
 
-export class TextFieldImplementationExamples extends React.Component<any, any> {
+export class TextFieldIconExample extends React.Component<any, any> {
   public render() {
     return (
       <div className='ms-TextFieldExample'>
@@ -12,10 +12,6 @@ export class TextFieldImplementationExamples extends React.Component<any, any> {
           iconProps={ { iconName: 'Calendar' } }
           onChanged={ this._onChanged }
         />
-        <TextField
-          label='Textfield with an addon'
-          addonString='https://'
-        />
       </div>
     );
   }

From 379611dd5fe516ab5230b1447c6a1d325cf6a625 Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Wed, 11 Oct 2017 22:51:42 -0700
Subject: [PATCH 0830/1641] ComboBox: set selected state by index and set input
 field (#2974)

* no message

* no message

* SelectIndex prop and InputFieldText prop

* Change file

* Fixing PhantomJS errors

* Resolving merge conflict added double spaced line.  This has been removed.

* Updated selected key to use number as index.  Testing ways to update text field

* Updating selectedKey implementation

* Fixing errors -removing test content

* Testing input update

* Fixing lint errors

* Allow user to select highlighted date when it is already "selected"

* Removing overrideOptionInput prop

* Updating file

* Updating file

* Removing extra space

* Trying to fix file

-removing extra spaces so file shows as not edited.

* Fixing trailing whitespace error

* Removing unnecessary code
---
 ...rr-comboBox-setSelectedIndex_2017-09-27-21-11.json | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.tsx              |  9 +++++----
 2 files changed, 16 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-comboBox-setSelectedIndex_2017-09-27-21-11.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-comboBox-setSelectedIndex_2017-09-27-21-11.json b/common/changes/office-ui-fabric-react/kegorr-comboBox-setSelectedIndex_2017-09-27-21-11.json
new file mode 100644
index 0000000000000..68305e8e655f4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-comboBox-setSelectedIndex_2017-09-27-21-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: added selectedIndex prop and inputFieldText prop for more control over comboBox behavior",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index fcac264f3b12f..851acd99b6c11 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -146,7 +146,9 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     if (newProps.selectedKey !== this.props.selectedKey ||
       newProps.value !== this.props.value ||
       newProps.options !== this.props.options) {
+
       let index: number = this._getSelectedIndex(newProps.options, newProps.selectedKey);
+
       this.setState({
         selectedIndex: index,
         currentOptions: newProps.options
@@ -384,14 +386,13 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
     // If the user passed is a value prop, use that
     // unless we are open and have a valid current pending index
-    if (!(isOpen && currentPendingIndexValid) && value) {
+    if (!(isOpen && currentPendingIndexValid) && (value && !currentPendingValue)) {
       return value;
     }
 
     let index = selectedIndex;
 
     if (allowFreeform) {
-
       // If we are allowing freeform and autocomplete is also true
       // and we've got a pending value that matches an option, remember
       // the matched option's index
@@ -401,8 +402,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
       // Since we are allowing freeform, if there is currently a nonempty pending value, use that
       // otherwise use the index determined above (falling back to '' if we did not get a valid index)
-      return currentPendingValue !== '' ? currentPendingValue :
-        (this._indexWithinBounds(currentOptions, index) ? currentOptions[index].text : '');
+      return currentPendingValue !== '' ? currentPendingValue : (this._indexWithinBounds(currentOptions, index) ? currentOptions[index].text : '');
+
     } else {
 
       // If we are not allowing freeform and have a

From 297e24651f58c43cedcc6bcdff22f8863c769353 Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Wed, 11 Oct 2017 23:34:04 -0700
Subject: [PATCH 0831/1641] Callout: optional persistent button (#2940)

* no message

* no message

* Adding static button on bottom

* Adding persistent button to callout

* lint issues fixed

* Change file

* Adding prop to add additional content below callout list.  Also, if selectedKey is a number, use this as index.

* fixing === error

* Removing CommandButton

* Removing selectedKey update- this is on another PR

* Updating how additional content is added

* removing removed prop

* Update callout.props removing unneeded lines

* Adding new line to callout.css

-do not need to change this file

* Updating lowerCalloutContent to onRenderLowerContent with IRenderFunction

* fixing lint error

* Update ComboBox.tsx
---
 .../kegorr-Callout-staticOption_2017-09-25-20-45.json | 11 +++++++++++
 .../src/components/Callout/Callout.scss               |  1 -
 .../src/components/ComboBox/ComboBox.Props.ts         |  6 ++++++
 .../src/components/ComboBox/ComboBox.tsx              | 10 +++++++++-
 4 files changed, 26 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-Callout-staticOption_2017-09-25-20-45.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-Callout-staticOption_2017-09-25-20-45.json b/common/changes/office-ui-fabric-react/kegorr-Callout-staticOption_2017-09-25-20-45.json
new file mode 100644
index 0000000000000..51dfbea95392e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-Callout-staticOption_2017-09-25-20-45.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Callout: Added optional button at the bottom of the callout container",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
index 8e047db632190..f9e16980d02b0 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
@@ -62,4 +62,3 @@ $Callout-smallbeak-slant-width: 16px;
   left: 0;
   background-color: $ms-color-white;
 }
-
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
index 6c8a670be9876..10929524ec5df 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
@@ -3,6 +3,7 @@ import { ISelectableOption } from '../../utilities/selectableOption/SelectableOp
 import { ISelectableDroppableTextProps } from '../../utilities/selectableOption/SelectableDroppableText.Props';
 import { IStyle, ITheme } from '../../Styling';
 import { IButtonStyles } from '../../Button';
+import { IRenderFunction } from '../../Utilities';
 
 export interface IComboBox {
   /**
@@ -101,6 +102,11 @@ export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox>
    * @default false;
    */
   scrollSelectedToTop?: boolean;
+
+  /**
+   * Add additional content below the callout list.
+   */
+  onRenderLowerContent?: IRenderFunction<IComboBoxProps>;
 }
 
 export interface IComboBoxStyles {
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 851acd99b6c11..8ba905ce5118c 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -763,7 +763,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   private _onRenderContainer(props: IComboBoxProps): JSX.Element {
     let {
       onRenderList,
-      calloutProps
+      calloutProps,
+      onRenderLowerContent = this._onRenderLowerContent
     } = props;
 
     return (
@@ -782,6 +783,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         <div className={ this._classNames.optionsContainerWrapper } ref={ this._resolveRef('_comboBoxMenu') }>
           { (onRenderList as any)({ ...props }, this._onRenderList) }
         </div>
+        { onRenderLowerContent(this.props, this._onRenderLowerContent) }
       </Callout>
     );
   }
@@ -820,6 +822,12 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     }
   }
 
+  // Default _onRenderLowerContent function returns nothing
+  @autobind
+  private _onRenderLowerContent(): null {
+    return null;
+  }
+
   // Render separator
   private _renderSeparator(item: IComboBoxOption): JSX.Element | null {
     let { index, key } = item;

From bc54e30967bd66cdad34df2aad81df031ba3bccb Mon Sep 17 00:00:00 2001
From: joeuy <jchiarino@gmail.com>
Date: Wed, 11 Oct 2017 23:38:16 -0700
Subject: [PATCH 0832/1641] Dropdown: add onDismiss callback (#3087)

* Dropdown: add onDismiss callback

* revert unintended changes

* add change request
---
 .../dropdown-ondismiss_2017-10-11-07-42.json  | 11 +++++++
 .../src/components/Dropdown/Dropdown.Props.ts |  5 ++++
 .../src/components/Dropdown/Dropdown.test.tsx | 29 +++++++++++++++++++
 .../src/components/Dropdown/Dropdown.tsx      |  4 +++
 4 files changed, 49 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/dropdown-ondismiss_2017-10-11-07-42.json

diff --git a/common/changes/office-ui-fabric-react/dropdown-ondismiss_2017-10-11-07-42.json b/common/changes/office-ui-fabric-react/dropdown-ondismiss_2017-10-11-07-42.json
new file mode 100644
index 0000000000000..c1fc9b9537746
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/dropdown-ondismiss_2017-10-11-07-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: add onDismiss callback. Example multi select dropdown with filters, we want to apply filters after user has dismissed the dropdown. ",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jchiarino@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
index d441055d3603f..61d6b9badbab1 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
@@ -20,6 +20,11 @@ export interface IDropdownProps extends ISelectableDroppableTextProps<HTMLDivEle
    */
   onChanged?: (option: IDropdownOption, index?: number) => void;
 
+  /**
+   * Callback issues when the options callout is dismissed
+   */
+  onDismiss?: () => void;
+
   /**
    * Optional custom renderer for placeholder text
    */
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
index 6f89adb8659ea..f3eb023c20708 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
@@ -219,6 +219,35 @@ describe('Dropdown', () => {
       }
     });
 
+    it('issues the onDismiss callback when dismissing options callout', () => {
+      let container = document.createElement('div');
+      let dropdownRoot: HTMLElement | undefined;
+
+      document.body.appendChild(container);
+
+      let onDismissSpy = jasmine.createSpy('onDismiss');
+
+      try {
+        ReactDOM.render(
+          <Dropdown
+            label='testgroup'
+            defaultSelectedKey='1'
+            onDismiss={ onDismissSpy }
+            options={ DEFAULT_OPTIONS }
+          />,
+          container);
+        dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+
+        ReactTestUtils.Simulate.click(dropdownRoot);
+
+        let secondItemElement = document.querySelector('.ms-Dropdown-item[data-index="2"]') as HTMLElement;
+        ReactTestUtils.Simulate.click(secondItemElement);
+      }
+      finally {
+        expect(onDismissSpy).toHaveBeenCalledTimes(1);
+      }
+    });
+
     it('issues the onChanged callback when the selected item is different', () => {
       let container = document.createElement('div');
       let dropdownRoot: HTMLElement | undefined;
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 3a44992dd85ad..b699eccec7f58 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -109,6 +109,10 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   public componentDidUpdate(prevProps: IDropdownProps, prevState: IDropdownState) {
     if (prevState.isOpen === true && this.state.isOpen === false) {
       this._dropDown.focus();
+
+      if (this.props.onDismiss) {
+        this.props.onDismiss();
+      }
     }
   }
 

From 46adf49189bd5754e10e1e91cea990842ce4e254 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 12 Oct 2017 10:20:50 +0000
Subject: [PATCH 0833/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 24 +++++++++
 apps/fabric-website/CHANGELOG.md              | 10 +++-
 apps/fabric-website/package.json              |  4 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../impl-examples_2017-10-10-16-09.json       | 11 ----
 .../impl-examples_2017-10-10-16-09.json       | 11 ----
 ...ite-promise-polyfill_2017-10-11-19-14.json | 11 ----
 .../3054-combobox-docs_2017-10-09-16-43.json  | 11 ----
 ...go-getItemClassNames_2017-10-12-00-35.json | 11 ----
 .../dropdown-ondismiss_2017-10-11-07-42.json  | 11 ----
 .../impl-examples_2017-10-10-16-09.json       | 11 ----
 ...nePropsToOverflowSet_2017-10-11-02-01.json | 11 ----
 ...Callout-staticOption_2017-09-25-20-45.json | 11 ----
 ...Box-setSelectedIndex_2017-09-27-21-11.json | 11 ----
 ...zano-spinButtonStyle_2017-10-11-22-37.json | 11 ----
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 51 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 19 ++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 22 files changed, 110 insertions(+), 131 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/impl-examples_2017-10-10-16-09.json
 delete mode 100644 common/changes/@uifabric/fabric-website/impl-examples_2017-10-10-16-09.json
 delete mode 100644 common/changes/@uifabric/fabric-website/website-promise-polyfill_2017-10-11-19-14.json
 delete mode 100644 common/changes/office-ui-fabric-react/3054-combobox-docs_2017-10-09-16-43.json
 delete mode 100644 common/changes/office-ui-fabric-react/chrisgo-getItemClassNames_2017-10-12-00-35.json
 delete mode 100644 common/changes/office-ui-fabric-react/dropdown-ondismiss_2017-10-11-07-42.json
 delete mode 100644 common/changes/office-ui-fabric-react/impl-examples_2017-10-10-16-09.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-AddFocusZonePropsToOverflowSet_2017-10-11-02-01.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-Callout-staticOption_2017-09-25-20-45.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-comboBox-setSelectedIndex_2017-09-27-21-11.json
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-spinButtonStyle_2017-10-11-22-37.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 163d9d104faca..bf4c7b8b9bc89 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.0.10",
+      "tag": "@uifabric/fabric-website_v5.0.10",
+      "date": "Thu, 12 Oct 2017 10:20:49 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "95f1a37bad9be2a5ab0d56ec6ea5e23dc7192230",
+            "comment": "Added Implementation Examples section to ComponentPage"
+          },
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "952448bde2b85671c84c1c074a18eedfeb90c615",
+            "comment": "Add promise polyfill"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.7.0 <6.0.0` to `>=5.8.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.9",
       "tag": "@uifabric/fabric-website_v5.0.9",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 14af433dc1b80..dcb37bcb3c88a 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Mon, 09 Oct 2017 10:08:09 GMT and should not be manually modified.
+This log was last generated on Thu, 12 Oct 2017 10:20:49 GMT and should not be manually modified.
+
+## 5.0.10
+Thu, 12 Oct 2017 10:20:49 GMT
+
+### Patches
+
+- Added Implementation Examples section to ComponentPage
+- Add promise polyfill
 
 ## 5.0.9
 Mon, 09 Oct 2017 10:08:09 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 7cdb1f3e1ecdb..b5bbb016ef0a1 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.0.9",
+  "version": "5.0.10",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.1.1 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.7.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.8.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index e3622fd905373..10b4504cc1862 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.7.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.8.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 076daca38c92f..725a508eba843 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.7.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.8.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 2a84f371373a7..5798aea1839ac 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.7.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.8.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 51524d1fbaa42..8f6254752fe9e 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.7.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.8.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/example-app-base/impl-examples_2017-10-10-16-09.json b/common/changes/@uifabric/example-app-base/impl-examples_2017-10-10-16-09.json
deleted file mode 100644
index 0f3c4c763374f..0000000000000
--- a/common/changes/@uifabric/example-app-base/impl-examples_2017-10-10-16-09.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "Added Implementation Examples section to ComponentPage",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/impl-examples_2017-10-10-16-09.json b/common/changes/@uifabric/fabric-website/impl-examples_2017-10-10-16-09.json
deleted file mode 100644
index d727bd637b7d0..0000000000000
--- a/common/changes/@uifabric/fabric-website/impl-examples_2017-10-10-16-09.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Added Implementation Examples section to ComponentPage",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/website-promise-polyfill_2017-10-11-19-14.json b/common/changes/@uifabric/fabric-website/website-promise-polyfill_2017-10-11-19-14.json
deleted file mode 100644
index 6b973e4c50478..0000000000000
--- a/common/changes/@uifabric/fabric-website/website-promise-polyfill_2017-10-11-19-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Add promise polyfill",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "a.erich@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/3054-combobox-docs_2017-10-09-16-43.json b/common/changes/office-ui-fabric-react/3054-combobox-docs_2017-10-09-16-43.json
deleted file mode 100644
index 8a29b1d96b8e0..0000000000000
--- a/common/changes/office-ui-fabric-react/3054-combobox-docs_2017-10-09-16-43.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Updated typing and documentation for `autoComplete` to only allow 'on' or 'off' (following html standards) rather than a boolean.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "ian.vanschooten@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/chrisgo-getItemClassNames_2017-10-12-00-35.json b/common/changes/office-ui-fabric-react/chrisgo-getItemClassNames_2017-10-12-00-35.json
deleted file mode 100644
index 30a9ac80a02ec..0000000000000
--- a/common/changes/office-ui-fabric-react/chrisgo-getItemClassNames_2017-10-12-00-35.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: Update the typings on getMenuItemClassNames",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/dropdown-ondismiss_2017-10-11-07-42.json b/common/changes/office-ui-fabric-react/dropdown-ondismiss_2017-10-11-07-42.json
deleted file mode 100644
index c1fc9b9537746..0000000000000
--- a/common/changes/office-ui-fabric-react/dropdown-ondismiss_2017-10-11-07-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: add onDismiss callback. Example multi select dropdown with filters, we want to apply filters after user has dismissed the dropdown. ",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jchiarino@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/impl-examples_2017-10-10-16-09.json b/common/changes/office-ui-fabric-react/impl-examples_2017-10-10-16-09.json
deleted file mode 100644
index a8a791aee183d..0000000000000
--- a/common/changes/office-ui-fabric-react/impl-examples_2017-10-10-16-09.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Adding Implementation Examples section to ComponentPage. Implemented in TextField.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-AddFocusZonePropsToOverflowSet_2017-10-11-02-01.json b/common/changes/office-ui-fabric-react/jspurlin-AddFocusZonePropsToOverflowSet_2017-10-11-02-01.json
deleted file mode 100644
index c4edb4dcea098..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-AddFocusZonePropsToOverflowSet_2017-10-11-02-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "OverflowSet: Add FocusZoneProps and the ability to set the role",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kegorr-Callout-staticOption_2017-09-25-20-45.json b/common/changes/office-ui-fabric-react/kegorr-Callout-staticOption_2017-09-25-20-45.json
deleted file mode 100644
index 51dfbea95392e..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-Callout-staticOption_2017-09-25-20-45.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Callout: Added optional button at the bottom of the callout container",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kegorr-comboBox-setSelectedIndex_2017-09-27-21-11.json b/common/changes/office-ui-fabric-react/kegorr-comboBox-setSelectedIndex_2017-09-27-21-11.json
deleted file mode 100644
index 68305e8e655f4..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-comboBox-setSelectedIndex_2017-09-27-21-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: added selectedIndex prop and inputFieldText prop for more control over comboBox behavior",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/malozano-spinButtonStyle_2017-10-11-22-37.json b/common/changes/office-ui-fabric-react/malozano-spinButtonStyle_2017-10-11-22-37.json
deleted file mode 100644
index 7828e3d2561b3..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-spinButtonStyle_2017-10-11-22-37.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "\"Update spinButton styling to have the right font size and disabled visuals\"",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 847c798acee2f..f5661d8364065 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -42,7 +42,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.7.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.8.0 <6.0.0",
     "@uifabric/icons": ">=5.1.1 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 223e88ce35195..f33bf9406b8cb 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,57 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.8.0",
+      "tag": "office-ui-fabric-react_v5.8.0",
+      "date": "Thu, 12 Oct 2017 10:20:49 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Ian VanSchooten <ian.vanschooten@gmail.com>",
+            "commit": "f0362588a14a3df75b94f2fe21ceb114ce07c7e1",
+            "comment": "ComboBox: Updated typing and documentation for `autoComplete` to only allow 'on' or 'off' (following html standards) rather than a boolean."
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "c3b2b6d5feb39a8534584c7306a5621d56549d8e",
+            "comment": "ContextualMenu: Update the typings on getMenuItemClassNames"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "95f1a37bad9be2a5ab0d56ec6ea5e23dc7192230",
+            "comment": "Adding Implementation Examples section to ComponentPage. Implemented in TextField."
+          }
+        ],
+        "minor": [
+          {
+            "author": "joeuy <jchiarino@gmail.com>",
+            "commit": "bc54e30967bd66cdad34df2aad81df031ba3bccb",
+            "comment": "Dropdown: add onDismiss callback. Example multi select dropdown with filters, we want to apply filters after user has dismissed the dropdown. "
+          },
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "ace1eeb589350f79200706112cdef4b4a4505b09",
+            "comment": "OverflowSet: Add FocusZoneProps and the ability to set the role"
+          },
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "297e24651f58c43cedcc6bcdff22f8863c769353",
+            "comment": "Callout: Added optional button at the bottom of the callout container"
+          },
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "379611dd5fe516ab5230b1447c6a1d325cf6a625",
+            "comment": "ComboBox: added selectedIndex prop and inputFieldText prop for more control over comboBox behavior"
+          },
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "5dc33511fdf44fbce652b590d807cef47bb82404",
+            "comment": "\"Update spinButton styling to have the right font size and disabled visuals\""
+          }
+        ]
+      }
+    },
     {
       "version": "5.7.0",
       "tag": "office-ui-fabric-react_v5.7.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 2c9943e3d3082..80d2284a089e2 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,23 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 11 Oct 2017 10:11:04 GMT and should not be manually modified.
+This log was last generated on Thu, 12 Oct 2017 10:20:49 GMT and should not be manually modified.
+
+## 5.8.0
+Thu, 12 Oct 2017 10:20:49 GMT
+
+### Minor changes
+
+- Dropdown: add onDismiss callback. Example multi select dropdown with filters, we want to apply filters after user has dismissed the dropdown. 
+- OverflowSet: Add FocusZoneProps and the ability to set the role
+- Callout: Added optional button at the bottom of the callout container
+- ComboBox: added selectedIndex prop and inputFieldText prop for more control over comboBox behavior
+- "Update spinButton styling to have the right font size and disabled visuals"
+
+### Patches
+
+- ComboBox: Updated typing and documentation for `autoComplete` to only allow 'on' or 'off' (following html standards) rather than a boolean.
+- ContextualMenu: Update the typings on getMenuItemClassNames
+- Adding Implementation Examples section to ComponentPage. Implemented in TextField.
 
 ## 5.7.0
 Wed, 11 Oct 2017 10:11:04 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 37c14f93b276e..f1f65b169c379 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.7.0",
+  "version": "5.8.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From e995443b8a92df76e5aa4231e367d565bf62da92 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Thu, 12 Oct 2017 10:01:57 -0700
Subject: [PATCH 0834/1641] Add min/max to VR test (#3103)

---
 apps/vr-tests/src/stories/SpinButton.stories.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/vr-tests/src/stories/SpinButton.stories.tsx b/apps/vr-tests/src/stories/SpinButton.stories.tsx
index 9e4a08867f981..6bbb1280d45c2 100644
--- a/apps/vr-tests/src/stories/SpinButton.stories.tsx
+++ b/apps/vr-tests/src/stories/SpinButton.stories.tsx
@@ -10,7 +10,7 @@ let props = {
   defaultValue: '0',
   label: 'Basic SpinButton:',
   min: 0,
-  max: 100,
+  max: 0,
   step: 1
 };
 

From 8d82a62718188ffda3a70dee24b0c77cb62156db Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=95=BF=E5=A4=A9=E4=B9=8B=E4=BA=91?= <ambar.lee@gmail.com>
Date: Thu, 12 Oct 2017 12:03:31 -0500
Subject: [PATCH 0835/1641] Tooltip: pass calloutProps.className to Callout
 (#3101)

* Tooltip: pass calloutProps.className to Callout

* add changes json
---
 .../patch_2017-10-12-13-32.json                       | 11 +++++++++++
 .../src/components/Tooltip/Tooltip.tsx                |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/patch_2017-10-12-13-32.json

diff --git a/common/changes/office-ui-fabric-react/patch_2017-10-12-13-32.json b/common/changes/office-ui-fabric-react/patch_2017-10-12-13-32.json
new file mode 100644
index 0000000000000..4e7f5be769820
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/patch_2017-10-12-13-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Tooltip: pass calloutProps.className to Callout",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "ambar.lee@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
index 16249063c2b0c..47f489892b9ce 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
@@ -55,6 +55,7 @@ export class Tooltip extends BaseComponent<ITooltipProps, any> {
           styles.root,
           (delay === TooltipDelay.medium) && styles.hasMediumDelay,
           (maxWidth !== null) && { maxWidth: maxWidth },
+          calloutProps ? calloutProps.className : undefined,
           this.props.className
         ) }
       >

From b492d97a35e8c0fdb65b59e5dad5cd7a4989e832 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 12 Oct 2017 11:08:52 -0700
Subject: [PATCH 0836/1641] Update README.md

---
 packages/merge-styles/README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/merge-styles/README.md b/packages/merge-styles/README.md
index 642eca9d6f0d7..e6ed6ee0bed3c 100644
--- a/packages/merge-styles/README.md
+++ b/packages/merge-styles/README.md
@@ -20,7 +20,7 @@ mergeStyleSet({
 // Returns { root: 'root-0', child: 'child-1' }
 ```
 
-Both utilities behave similar to a deep Object.assign; you can collapse may objects down into one class name or class map.
+Both utilities behave similar to a deep Object.assign; you can collapse many objects down into one class name or class map.
 
 The basic idea is to provide tools which can take in one or more css styling objects representing the styles for a given element, and return a single class name. If the same set of styling is passed in, the same name returns and nothing is re-registered.
 

From 26bc359ee5a360c8be26f3c014184b3dc57d665b Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 12 Oct 2017 11:19:41 -0700
Subject: [PATCH 0837/1641] Update TESTING.md

---
 ghdocs/TESTING.md | 16 ++++++++++++----
 1 file changed, 12 insertions(+), 4 deletions(-)

diff --git a/ghdocs/TESTING.md b/ghdocs/TESTING.md
index 0b5b65752562f..672a50790c2eb 100644
--- a/ghdocs/TESTING.md
+++ b/ghdocs/TESTING.md
@@ -10,15 +10,23 @@ For creating React functional tests, we use [Enzyme](http://airbnb.io/enzyme/) t
 
 ## Running tests
 
-To run tests:
-
 In command prompt navigate to the appropriate package, for example `packages/office-ui-fabric-react`
 
 To just validate everything works, run `npm run build`, which will build the project including running tslint and jest for tests.
 
-To actively develop tests, you can use Jest watch mode by running `npm run start-test`.
+## Running tests in watch mode
+
+When you are developing tests, use the watch mode to run the tests as you write them!
+
+1. Go to the package folder where you want to run the tests.
+2. Type `npm run start-test`.
+3. Edit and saving tests should now cause the console to re-run the tests you have added/modified.
+
+### Debugging
+
+To debug tests, you can use Visual Studio Code. Inside of a `*.test.ts` file, add a `debugger` statement where you want to break, and hit F5 to start debugging.
 
-To debug tests, you can us Visual Studio Code. Inside of a `*.test.ts` file, add a `debugger` statement where you want to break, and hit F5 to start debugging.
+Note: Because of limitations with the current Node LTS version, breakpoints in VSCode will not hit until you're actively in the debugger using `debugger` statement. The latest Node version however has fixes that will enable breakpoints to resolve, so this workaround is temporary.
 
 ## Writing tests
 

From 1b22b3e124172e0438363d6026cf44181ce676d5 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 12 Oct 2017 11:20:49 -0700
Subject: [PATCH 0838/1641] Update TESTING.md

---
 ghdocs/TESTING.md | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/ghdocs/TESTING.md b/ghdocs/TESTING.md
index 672a50790c2eb..c253d3a5554c1 100644
--- a/ghdocs/TESTING.md
+++ b/ghdocs/TESTING.md
@@ -14,6 +14,8 @@ In command prompt navigate to the appropriate package, for example `packages/off
 
 To just validate everything works, run `npm run build`, which will build the project including running tslint and jest for tests.
 
+If you *only* want to run jest, you can also run only the `jest` task by running `npm run build jest`.
+
 ## Running tests in watch mode
 
 When you are developing tests, use the watch mode to run the tests as you write them!

From dfad19877e14ed0523c4f965188fb8e0955b7636 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Thu, 12 Oct 2017 13:58:53 -0700
Subject: [PATCH 0839/1641] Fix visibility of text descenders in Tile component
 [experiments] (#3082)

* Fix Tile descender visibility using flexbox

* Fix alignment of mention signal

* Update change output
---
 .../tile-lines_2017-10-10-22-35.json          | 11 ++++
 .../experiments/src/components/Tile/Tile.scss | 61 ++++++++++++-------
 .../experiments/src/components/Tile/Tile.tsx  | 10 +--
 .../src/components/signals/Signals.scss       |  4 ++
 4 files changed, 60 insertions(+), 26 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/tile-lines_2017-10-10-22-35.json

diff --git a/common/changes/@uifabric/experiments/tile-lines_2017-10-10-22-35.json b/common/changes/@uifabric/experiments/tile-lines_2017-10-10-22-35.json
new file mode 100644
index 0000000000000..bfd1483179e96
--- /dev/null
+++ b/common/changes/@uifabric/experiments/tile-lines_2017-10-10-22-35.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Fix visibility of Tile descenders",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Tile/Tile.scss b/packages/experiments/src/components/Tile/Tile.scss
index a0b05e30d726a..10b55dd817e58 100644
--- a/packages/experiments/src/components/Tile/Tile.scss
+++ b/packages/experiments/src/components/Tile/Tile.scss
@@ -253,54 +253,73 @@ button.check {
   }
 }
 
-@mixin preserveExtenders($topMargin: 0px) {
-  padding-top: 8px;
-  margin-top: $topMargin - 8px;
-  @include margin-left(-8px);
-  @include padding-left(8px);
-}
-
 .name {
-  display: block;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
   font-weight: $ms-font-weight-regular;
   color: $ms-color-neutralPrimary;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 
+  @include margin-left(-8px);
+  @include padding-left(8px);
+
   &,
   .isLarge & {
     font-size: $ms-font-size-m;
-    height: 17px;
-    line-height: 17px;
+
+    // Simulate a 15px line-height by using negative margins.
+    // This allows extenders and descenders to fit while still enforcing bounds
+    // for overflow: ellipsis.
+    height: 30px;
+    margin-top: -7px;
+    margin-bottom: -8px;
   }
 
   .isSmall & {
     font-size: $ms-font-size-s;
-    height: 14px;
-    line-height: 14px;
-  }
 
-  @include preserveExtenders();
+    // Simulate a 12px line-height by using negative margins.
+    // This allows extenders and descenders to fit while still enforcing bounds
+    // for overflow: ellipsis.
+    height: 24px;
+    margin-top: -5px;
+    margin-bottom: -7px;
+  }
 }
 
 .activity {
-  margin-top: 4px;
-  display: block;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
   font-weight: $ms-font-weight-regular;
   font-size: $ms-font-size-s;
   color: #767676;
-  height: 14px;
-  line-height: 14px;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
-  @include preserveExtenders(4px);
+
+  // Simulate a 20px line-height by using negative margins.
+  // This allows extenders and descenders to fit while still enforcing bounds
+  // for overflow: ellipsis.
+  height: 24px;
+  margin-bottom: -4px;
+
+  @include margin-left(-8px);
+  @include padding-left(8px);
 }
 
 .hasBackgroundFrame {
-  .nameplate {
-    @include text-align(left);
+  .name {
+    justify-content: flex-start;
+  }
+
+  .activity {
+    justify-content: flex-start;
   }
 }
 
diff --git a/packages/experiments/src/components/Tile/Tile.tsx b/packages/experiments/src/components/Tile/Tile.tsx
index 10736a177dfd2..d5080f5a65bd3 100644
--- a/packages/experiments/src/components/Tile/Tile.tsx
+++ b/packages/experiments/src/components/Tile/Tile.tsx
@@ -16,11 +16,11 @@ const CheckStyles: any = CheckStylesModule;
 
 const enum TileLayoutValues {
   nameplatePadding = 12,
-  largeNameplateNameHeight = 17,
-  smallNameplateNameHeight = 14,
-  nameplateMargin = 4,
-  largeNameplateActivityHeight = 14,
-  smallNameplateActivityHeight = 14,
+  largeNameplateNameHeight = 15,
+  smallNameplateNameHeight = 12,
+  nameplateMargin = 0,
+  largeNameplateActivityHeight = 20,
+  smallNameplateActivityHeight = 20,
   foregroundMargin = 16
 }
 
diff --git a/packages/experiments/src/components/signals/Signals.scss b/packages/experiments/src/components/signals/Signals.scss
index 1520f2b5eeee1..98c98b59d70c1 100644
--- a/packages/experiments/src/components/signals/Signals.scss
+++ b/packages/experiments/src/components/signals/Signals.scss
@@ -77,6 +77,10 @@
 }
 
 .mention {
+  position: relative;
+
+  top: 0.2em;
+
   color: $ms-color-themePrimary;
 
   .selected & {

From 8b32db0594db904c7624a4944a2dcb5336c605fc Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 12 Oct 2017 14:48:05 -0700
Subject: [PATCH 0840/1641] Callout: Update typings on target prop to make it
 compatible with react refs (#3104)

* Callout target update

* Rush change
---
 .../callout-target-type_2017-10-12-20-11.json         | 11 +++++++++++
 .../src/components/Callout/Callout.Props.ts           |  2 +-
 .../Callout/examples/Callout.Basic.Example.tsx        |  4 ++--
 .../Callout/examples/Callout.Cover.Example.tsx        |  4 ++--
 .../Callout/examples/Callout.Directional.Example.tsx  |  4 ++--
 .../Callout/examples/Callout.Nested.Example.tsx       |  4 ++--
 .../components/ContextualMenu/ContextualMenu.Props.ts |  2 +-
 7 files changed, 21 insertions(+), 10 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/callout-target-type_2017-10-12-20-11.json

diff --git a/common/changes/office-ui-fabric-react/callout-target-type_2017-10-12-20-11.json b/common/changes/office-ui-fabric-react/callout-target-type_2017-10-12-20-11.json
new file mode 100644
index 0000000000000..bfc04bf71290a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/callout-target-type_2017-10-12-20-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Callout: Update the typings on the target prop to make it compatible with React refs",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts b/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
index d352f19a9ee41..be4e6c78d9ed7 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
@@ -23,7 +23,7 @@ export interface ICalloutProps extends React.Props<Callout | CalloutContent> {
    * It can be either an HTMLElement a querySelector string of a valid HTMLElement
    * or a MouseEvent. If MouseEvent is given then the origin point of the event will be used.
    */
-  target?: HTMLElement | string | MouseEvent;
+  target?: HTMLElement | string | MouseEvent | null;
 
   /**
    * How the element should be positioned
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Basic.Example.tsx
index 0625c36557d48..d00fe5e7e66c7 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Basic.Example.tsx
@@ -9,7 +9,7 @@ export interface ICalloutBaiscExampleState {
 }
 
 export class CalloutBasicExample extends React.Component<any, ICalloutBaiscExampleState> {
-  private _menuButtonElement: HTMLElement;
+  private _menuButtonElement: HTMLElement | null;
 
   public constructor() {
     super();
@@ -27,7 +27,7 @@ export class CalloutBasicExample extends React.Component<any, ICalloutBaiscExamp
 
     return (
       <div className='ms-CalloutExample'>
-        <div className='ms-CalloutBasicExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton! }>
+        <div className='ms-CalloutBasicExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton }>
           <DefaultButton
             onClick={ this._onShowMenuClicked }
             text={ isCalloutVisible ? 'Hide callout' : 'Show callout' }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
index e9e0d2cf98220..ed74babc0ea19 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
@@ -27,7 +27,7 @@ const DIRECTION_OPTIONS = [
 ];
 
 export class CalloutCoverExample extends React.Component<any, ICalloutCoverExampleState> {
-  private _menuButtonElement: HTMLElement;
+  private _menuButtonElement: HTMLElement | null;
 
   public constructor() {
     super();
@@ -55,7 +55,7 @@ export class CalloutCoverExample extends React.Component<any, ICalloutCoverExamp
             onChanged={ this._onDirectionalChanged }
           />
         </div>
-        <div className='ms-CalloutCoverExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton! }>
+        <div className='ms-CalloutCoverExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton }>
           <DefaultButton
             text={ isCalloutVisible ? 'Hide callout' : 'Show callout' }
             onClick={ this._onShowMenuClicked }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
index 155941132bf31..c58c1c2e08340 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
@@ -36,7 +36,7 @@ const DIRECTION_OPTIONS = [
 ];
 
 export class CalloutDirectionalExample extends React.Component<any, ICalloutDirectionalExampleState> {
-  private _menuButtonElement: HTMLElement;
+  private _menuButtonElement: HTMLElement | null;
   public constructor() {
     super();
 
@@ -81,7 +81,7 @@ export class CalloutDirectionalExample extends React.Component<any, ICalloutDire
             onChanged={ this._onDirectionalChanged }
           />
         </div>
-        <div className='ms-CalloutExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton! }>
+        <div className='ms-CalloutExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton }>
           <DefaultButton
             className={ 'calloutExampleButton' }
             onClick={ this._onShowMenuClicked }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx
index 4e1214f04549f..23c12838f419b 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx
@@ -9,7 +9,7 @@ export interface ICalloutBaiscExampleState {
 }
 
 export class CalloutNestedExample extends React.Component<any, ICalloutBaiscExampleState> {
-  private _menuButtonElement: HTMLElement;
+  private _menuButtonElement: HTMLElement | null;
 
   public constructor() {
     super();
@@ -26,7 +26,7 @@ export class CalloutNestedExample extends React.Component<any, ICalloutBaiscExam
 
     return (
       <div className='ms-CalloutExample'>
-        <div className='ms-CalloutBasicExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton! }>
+        <div className='ms-CalloutBasicExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton }>
           <DefaultButton
             onClick={ this._onDismiss }
             text={ isCalloutVisible ? 'Hide callout' : 'Show callout' }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
index a5abc4e6aa87e..ee2b3aadc5906 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
@@ -38,7 +38,7 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
    * It can be either an HTMLElement a querySelector string of a valid HTMLElement
    * or a MouseEvent. If MouseEvent is given then the origin point of the event will be used.
    */
-  target?: HTMLElement | string | MouseEvent;
+  target?: HTMLElement | string | MouseEvent | null;
 
   /**
    * How the element should be positioned

From f12f63d3f67177322a388ee9969f9819ee835f3a Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Thu, 12 Oct 2017 16:34:12 -0700
Subject: [PATCH 0841/1641] Theme Generator: insure colors update when bg
 inverts (#3100)

* make sure primary and fg colors update when bg inverts

* change file
---
 .../phkuo-fixColorLock_2017-10-12-02-07.json     | 11 +++++++++++
 .../ThemeGenerator/ThemeRulesStandard.ts         | 16 ----------------
 2 files changed, 11 insertions(+), 16 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/phkuo-fixColorLock_2017-10-12-02-07.json

diff --git a/common/changes/office-ui-fabric-react/phkuo-fixColorLock_2017-10-12-02-07.json b/common/changes/office-ui-fabric-react/phkuo-fixColorLock_2017-10-12-02-07.json
new file mode 100644
index 0000000000000..6e78d8698fea0
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/phkuo-fixColorLock_2017-10-12-02-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Theme Generator: insure color update when bg inverts",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
index 2f9ebd6741efd..dd45a9c3dde70 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
@@ -102,14 +102,6 @@ export function themeRulesStandardCreator() {
   slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade6]].color = getColorFromString('#106ebe');
   slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade7]].color = getColorFromString('#005a9e');
   slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade8]].color = getColorFromString('#004578');
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade1]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade2]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade3]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade4]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade5]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade6]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade7]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.primaryColor] + Shade[Shade.Shade8]].isCustomized = true;
 
   // set default colors for shades (the slot rules were already created above and will be used if the base colors ever change)
   slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade1]].color = getColorFromString('#eaeaea');
@@ -120,14 +112,6 @@ export function themeRulesStandardCreator() {
   slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade6]].color = getColorFromString('#3c3c3c');
   slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade7]].color = getColorFromString('#212121');
   slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade8]].color = getColorFromString('#000000');
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade1]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade2]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade3]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade4]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade5]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade6]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade7]].isCustomized = true;
-  slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade8]].isCustomized = true;
 
   function _makeFabricSlotRule(slotName: string, inheritedBase: BaseSlots, inheritedShade: Shade, isBackgroundShade = false) {
     slotRules[slotName] = {

From 1c74d9f0c7d7af5edada08e69e0d71968c90f13f Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 12 Oct 2017 17:10:11 -0700
Subject: [PATCH 0842/1641] Adding merge-styles attribute (#3106)

* Adding merge-styles attr.

* Adding change file.
---
 .../adding-merge-styles-attr_2017-10-12-23-36.json    | 11 +++++++++++
 packages/merge-styles/src/Stylesheet.ts               |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/@uifabric/merge-styles/adding-merge-styles-attr_2017-10-12-23-36.json

diff --git a/common/changes/@uifabric/merge-styles/adding-merge-styles-attr_2017-10-12-23-36.json b/common/changes/@uifabric/merge-styles/adding-merge-styles-attr_2017-10-12-23-36.json
new file mode 100644
index 0000000000000..a9cfc523d8fb7
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/adding-merge-styles-attr_2017-10-12-23-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "Adding data-merge-styles attribute to the style element so that it can be uniquely identified.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/merge-styles/src/Stylesheet.ts b/packages/merge-styles/src/Stylesheet.ts
index 4a285eb9b9c12..925548a3b84b0 100644
--- a/packages/merge-styles/src/Stylesheet.ts
+++ b/packages/merge-styles/src/Stylesheet.ts
@@ -197,6 +197,7 @@ export class Stylesheet {
   private _getElement(): HTMLStyleElement | undefined {
     if (!this._styleElement && typeof document !== 'undefined') {
       this._styleElement = document.createElement('style');
+      this._styleElement.setAttribute('data-merge-styles', 'true');
       document.head.appendChild(this._styleElement);
     }
 

From 8863c745492a18b4a845e17f93ba118896a5206f Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 13 Oct 2017 01:36:02 +0000
Subject: [PATCH 0843/1641] Applying package updates.

---
 .../tile-lines_2017-10-10-22-35.json          | 11 -------
 ...ng-merge-styles-attr_2017-10-12-23-36.json | 11 -------
 .../callout-target-type_2017-10-12-20-11.json | 11 -------
 .../patch_2017-10-12-13-32.json               | 11 -------
 .../phkuo-fixColorLock_2017-10-12-02-07.json  | 11 -------
 packages/experiments/CHANGELOG.json           | 19 ++++++++++++
 packages/experiments/CHANGELOG.md             |  9 +++++-
 packages/experiments/package.json             |  4 +--
 packages/merge-styles/CHANGELOG.json          | 14 +++++++++
 packages/merge-styles/CHANGELOG.md            |  9 +++++-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 29 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 11 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/package.json                 |  2 +-
 scripts/package.json                          |  2 +-
 16 files changed, 95 insertions(+), 65 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/tile-lines_2017-10-10-22-35.json
 delete mode 100644 common/changes/@uifabric/merge-styles/adding-merge-styles-attr_2017-10-12-23-36.json
 delete mode 100644 common/changes/office-ui-fabric-react/callout-target-type_2017-10-12-20-11.json
 delete mode 100644 common/changes/office-ui-fabric-react/patch_2017-10-12-13-32.json
 delete mode 100644 common/changes/office-ui-fabric-react/phkuo-fixColorLock_2017-10-12-02-07.json

diff --git a/common/changes/@uifabric/experiments/tile-lines_2017-10-10-22-35.json b/common/changes/@uifabric/experiments/tile-lines_2017-10-10-22-35.json
deleted file mode 100644
index bfd1483179e96..0000000000000
--- a/common/changes/@uifabric/experiments/tile-lines_2017-10-10-22-35.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Fix visibility of Tile descenders",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/adding-merge-styles-attr_2017-10-12-23-36.json b/common/changes/@uifabric/merge-styles/adding-merge-styles-attr_2017-10-12-23-36.json
deleted file mode 100644
index a9cfc523d8fb7..0000000000000
--- a/common/changes/@uifabric/merge-styles/adding-merge-styles-attr_2017-10-12-23-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "Adding data-merge-styles attribute to the style element so that it can be uniquely identified.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/callout-target-type_2017-10-12-20-11.json b/common/changes/office-ui-fabric-react/callout-target-type_2017-10-12-20-11.json
deleted file mode 100644
index bfc04bf71290a..0000000000000
--- a/common/changes/office-ui-fabric-react/callout-target-type_2017-10-12-20-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Callout: Update the typings on the target prop to make it compatible with React refs",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/patch_2017-10-12-13-32.json b/common/changes/office-ui-fabric-react/patch_2017-10-12-13-32.json
deleted file mode 100644
index 4e7f5be769820..0000000000000
--- a/common/changes/office-ui-fabric-react/patch_2017-10-12-13-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Tooltip: pass calloutProps.className to Callout",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "ambar.lee@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/phkuo-fixColorLock_2017-10-12-02-07.json b/common/changes/office-ui-fabric-react/phkuo-fixColorLock_2017-10-12-02-07.json
deleted file mode 100644
index 6e78d8698fea0..0000000000000
--- a/common/changes/office-ui-fabric-react/phkuo-fixColorLock_2017-10-12-02-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Theme Generator: insure color update when bg inverts",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 2ebb9e409d759..24fde6cb9a635 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.0.5",
+      "tag": "@uifabric/experiments_v5.0.5",
+      "date": "Fri, 13 Oct 2017 01:36:01 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "dfad19877e14ed0523c4f965188fb8e0955b7636",
+            "comment": "Fix visibility of Tile descenders"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.8.0 <6.0.0` to `>=5.8.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.4",
       "tag": "@uifabric/experiments_v5.0.4",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 368da8cd518cb..8421e4d97ce16 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Fri, 06 Oct 2017 10:18:41 GMT and should not be manually modified.
+This log was last generated on Fri, 13 Oct 2017 01:36:01 GMT and should not be manually modified.
+
+## 5.0.5
+Fri, 13 Oct 2017 01:36:01 GMT
+
+### Patches
+
+- Fix visibility of Tile descenders
 
 ## 5.0.4
 Fri, 06 Oct 2017 10:18:41 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index f5661d8364065..fc8b5fbca2037 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.0.4",
+  "version": "5.0.5",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -42,7 +42,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.8.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.8.1 <6.0.0",
     "@uifabric/icons": ">=5.1.1 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index c679963ee6cba..5fee8157a51b1 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.3.3",
+      "tag": "@uifabric/merge-styles_v5.3.3",
+      "date": "Fri, 13 Oct 2017 01:36:02 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "1c74d9f0c7d7af5edada08e69e0d71968c90f13f",
+            "comment": "Adding data-merge-styles attribute to the style element so that it can be uniquely identified."
+          }
+        ]
+      }
+    },
     {
       "version": "5.3.2",
       "tag": "@uifabric/merge-styles_v5.3.2",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index 87f38849b3225..6d50d687cf120 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Mon, 09 Oct 2017 10:08:09 GMT and should not be manually modified.
+This log was last generated on Fri, 13 Oct 2017 01:36:02 GMT and should not be manually modified.
+
+## 5.3.3
+Fri, 13 Oct 2017 01:36:02 GMT
+
+### Patches
+
+- Adding data-merge-styles attribute to the style element so that it can be uniquely identified.
 
 ## 5.3.2
 Mon, 09 Oct 2017 10:08:09 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index 3bd0e941fa435..a563d50c82235 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.3.2",
+  "version": "5.3.3",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index f33bf9406b8cb..6cbeb7c3afd14 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,35 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.8.1",
+      "tag": "office-ui-fabric-react_v5.8.1",
+      "date": "Fri, 13 Oct 2017 01:36:02 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "8b32db0594db904c7624a4944a2dcb5336c605fc",
+            "comment": "Callout: Update the typings on the target prop to make it compatible with React refs"
+          },
+          {
+            "author": "长天之云 <ambar.lee@gmail.com>",
+            "commit": "8d82a62718188ffda3a70dee24b0c77cb62156db",
+            "comment": "Tooltip: pass calloutProps.className to Callout"
+          },
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "f12f63d3f67177322a388ee9969f9819ee835f3a",
+            "comment": "Theme Generator: insure color update when bg inverts"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.3.2 <6.0.0` to `>=5.3.3 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.8.0",
       "tag": "office-ui-fabric-react_v5.8.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 80d2284a089e2..9ce141d56ce9e 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,15 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 12 Oct 2017 10:20:49 GMT and should not be manually modified.
+This log was last generated on Fri, 13 Oct 2017 01:36:02 GMT and should not be manually modified.
+
+## 5.8.1
+Fri, 13 Oct 2017 01:36:02 GMT
+
+### Patches
+
+- Callout: Update the typings on the target prop to make it compatible with React refs
+- Tooltip: pass calloutProps.className to Callout
+- Theme Generator: insure color update when bg inverts
 
 ## 5.8.0
 Thu, 12 Oct 2017 10:20:49 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index f1f65b169c379..b91af9cf15b54 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.8.0",
+  "version": "5.8.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.1.1 <6.0.0",
-    "@uifabric/merge-styles": ">=5.3.2 <6.0.0",
+    "@uifabric/merge-styles": ">=5.3.3 <6.0.0",
     "@uifabric/styling": ">=5.3.0 <6.0.0",
     "@uifabric/utilities": ">=5.2.1 <6.0.0",
     "prop-types": "^15.5.10",
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 3c563a83bf17b..f146b08e14ed8 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -21,7 +21,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/utilities": ">=5.2.1 <6.0.0",
-    "@uifabric/merge-styles": ">=5.3.2 <6.0.0",
+    "@uifabric/merge-styles": ">=5.3.3 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/scripts/package.json b/scripts/package.json
index 7dcca9af81999..23c2935cedc52 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -10,7 +10,7 @@
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.7.5",
     "@microsoft/loader-load-themed-styles": "^1.6.0",
-    "@uifabric/merge-styles": ">=5.3.2 <6.0.0",
+    "@uifabric/merge-styles": ">=5.3.3 <6.0.0",
     "autoprefixer": "^7.1.5",
     "awesome-typescript-loader": "^3.2.3",
     "bundlesize": "^0.15.2",

From c71d6b27f205b3685b758e9978e332bc4e992838 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Thu, 12 Oct 2017 20:04:55 -0700
Subject: [PATCH 0844/1641] Add VR to testing doc (#3109)

---
 ghdocs/TESTING.md | 74 ++++++++++++++++++++++++++++++++++++++++++++++-
 1 file changed, 73 insertions(+), 1 deletion(-)

diff --git a/ghdocs/TESTING.md b/ghdocs/TESTING.md
index c253d3a5554c1..7b0139d6d60cb 100644
--- a/ghdocs/TESTING.md
+++ b/ghdocs/TESTING.md
@@ -8,6 +8,8 @@ For snapshot testing, we use `react-test-renderer` and Jest apis.
 
 For creating React functional tests, we use [Enzyme](http://airbnb.io/enzyme/) to automate rendering. This gives us helpers for mounting a component, accessing elements rendered by it, and simulating clicks and keypresses.
 
+Visual regression testing uses [Storybook](https://storybook.js.org/basics/introduction/) to document various UI states of components.
+
 ## Running tests
 
 In command prompt navigate to the appropriate package, for example `packages/office-ui-fabric-react`
@@ -75,7 +77,7 @@ If you ever break a snapshot, you can update all baselines either manually, or u
 
 In cases where you need to automate a component and validate it performs correctly, you can use [Enzyme](http://airbnb.io/enzyme/) apis to mount components, evaluate dom structure, and simulate events.
 
-```
+```jsx
   it('opens a menu with IContextualMenuItem.subMenuProps.items property', () => {
     const commandBar = mount<CommandBar>(
       <CommandBar
@@ -105,6 +107,76 @@ In cases where you need to automate a component and validate it performs correct
   });
 ```
 
+### Visual regression testing
+
+[Storybook](https://storybook.js.org/basics/introduction/) is a dev environment for UI components. We write 'stories' to capture different states of components. With every pull request, the stories are rendered by Screener to check for any visual changes. Screener posts a status to Github PRs where you can view the visual test report. If changes are found, the status will fail on Github until the regressions are fixed or an admin approves the changes.
+
+Stories are found at `./apps/vr-tests/src/stories`. Most stories are written with a `FabricDecorator` that wraps the components with consistent padding. [Screener](https://github.com/screener-io/screener-storybook) steps are added to crop to a specific CSS class (most stories should crop to the `.testWrapper` class of the `FabricDecorator`) and to simulate different events, such as `hover` and `click`.
+
+```jsx
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { Link, ILinkProps } from 'office-ui-fabric-react';
+
+storiesOf('Link', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .hover('.ms-Link')
+        .snapshot('hover', { cropTo: '.testWrapper' })
+        .click('.ms-Link')
+        .hover('.ms-Link') // Always add a 'hover' step after 'click'
+        .snapshot('click', { cropTo: '.testWrapper' })
+        .end() // Every set of Screener steps should finish with 'end()'
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (<Link href='#'>I'm a link</Link>))
+  .add('Disabled', () => (<Link href='#' disabled>I'm a disabled link</Link>))
+  .add('No Href', () => (<Link>I'm rendered as a button because I have no href</Link>));
+```
+
+Certain components may be written with a custom decorator/wrapper, and you may crop to a different CSS class or omit the `cropTo` option altogether. Components that render outside its container, require specific styles on its parent, or render on a different layer, such as Callout, are cases where you would customize the decorators.
+
+```jsx
+storiesOf('Slider', module)
+  .addDecorator(story => (
+    // Vertical slider requires its parent to have a height specified
+    <div style={ { width: '300px', height: '200px', display: 'flex' } }>
+      { story() } // Render story (component) inside this container
+    </div>
+  ))
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .hover('.ms-Slider-line')
+        .snapshot('hover', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  )).add('Vertical', () => (
+    <Slider
+      label='Basic example:'
+      min={ 1 }
+      max={ 3 }
+      step={ 1 }
+      defaultValue={ 2 }
+      showValue={ true }
+      vertical={ true }
+    />
+  ));
+```
+
 ## FAQ
 
 *Q. Browser methods aren't working.*

From d1d6c746d47fd4c3c19cbe7b73915e76ea0dd282 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Thu, 12 Oct 2017 20:07:52 -0700
Subject: [PATCH 0845/1641] Add snapshot tests (#3108)

---
 packages/office-ui-fabric-react/package.json  |    1 +
 .../components/Breadcrumb/Breadcrumb.test.tsx |   29 +
 .../__snapshots__/Breadcrumb.test.tsx.snap    |  360 ++++++
 .../src/components/Calendar/Calendar.test.tsx |   16 +
 .../__snapshots__/Calendar.test.tsx.snap      | 1111 +++++++++++++++++
 .../src/components/Callout/Callout.test.tsx   |   16 +
 .../__snapshots__/Callout.test.tsx.snap       |   34 +
 .../ChoiceGroup/ChoiceGroup.test.tsx          |   12 +
 .../__snapshots__/ChoiceGroup.test.tsx.snap   |  112 ++
 .../ColorPicker/ColorPicker.test.tsx          |   10 +
 .../__snapshots__/ColorPicker.test.tsx.snap   |  278 +++++
 .../src/components/ComboBox/ComboBox.test.tsx |   14 +
 .../__snapshots__/ComboBox.test.tsx.snap      |  205 +++
 .../components/CommandBar/CommandBar.test.tsx |   24 +
 .../__snapshots__/CommandBar.test.tsx.snap    |   59 +
 .../src/components/Dropdown/Dropdown.test.tsx |   16 +
 .../__snapshots__/Dropdown.test.tsx.snap      |   99 ++
 .../src/components/Facepile/Facepile.test.tsx |    7 +
 .../__snapshots__/Facepile.test.tsx.snap      |  175 +++
 .../src/components/Image/Image.test.tsx       |    7 +
 .../Image/__snapshots__/Image.test.tsx.snap   |   22 +
 21 files changed, 2607 insertions(+)
 create mode 100644 packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/Calendar/__snapshots__/Calendar.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/ChoiceGroup/__snapshots__/ChoiceGroup.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/ColorPicker/__snapshots__/ColorPicker.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/Image/__snapshots__/Image.test.tsx.snap

diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index b91af9cf15b54..57216a1eee110 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -23,6 +23,7 @@
     "@types/prop-types": "15.5.1",
     "@types/react": "15.0.38",
     "@types/react-dom": "15.5.5",
+    "@types/react-test-renderer": "^15.5.4",
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx
index 81cdb7f9a6744..dc5d40c1e3426 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx
@@ -4,11 +4,40 @@ import * as React from 'react';
 
 import * as ReactDOM from 'react-dom';
 import * as ReactTestUtils from 'react-dom/test-utils';
+import * as renderer from 'react-test-renderer';
 
 import { Breadcrumb } from './Breadcrumb';
 import { IBreadcrumbItem } from './Breadcrumb.Props';
 
 describe('Breadcrumb', () => {
+  it('renders breadcumb correctly', () => {
+    const items: IBreadcrumbItem[] = [
+      { text: 'TestText1', key: 'TestKey1' },
+      { text: 'TestText2', key: 'TestKey2' },
+      { text: 'TestText3', key: 'TestKey3' },
+      { text: 'TestText4', key: 'TestKey4' }
+    ];
+
+    let component = renderer.create(
+      <Breadcrumb
+        items={ items }
+      />
+    );
+
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+
+    // With overflow
+    component = renderer.create(
+      <Breadcrumb
+        items={ items }
+        maxDisplayedItems={ 2 }
+      />
+    );
+
+    tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
 
   it('can call the callback when an item is clicked', () => {
     let callbackValue;
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
new file mode 100644
index 0000000000000..a6af78873a158
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
@@ -0,0 +1,360 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Breadcrumb renders breadcumb correctly 1`] = `
+<div
+  className="ms-ResizeGroup"
+>
+  <div
+    className=""
+  >
+    <div
+      aria-label={undefined}
+      className="ms-Breadcrumb"
+      role="navigation"
+    >
+      <div
+        aria-describedby={undefined}
+        aria-labelledby={undefined}
+        className="ms-FocusZone"
+        data-focuszone-id="FocusZone0"
+        onFocus={[Function]}
+        onKeyDown={[Function]}
+        onMouseDownCapture={[Function]}
+        role="presentation"
+      >
+        <ol
+          className="ms-Breadcrumb-list"
+        >
+          <li
+            className="ms-Breadcrumb-listItem"
+          >
+            <span
+              className="ms-Breadcrumb-item"
+            >
+              <div
+                aria-describedby={undefined}
+                className="ms-TooltipHost"
+                onBlurCapture={[Function]}
+                onFocusCapture={[Function]}
+                onMouseEnter={[Function]}
+                onMouseLeave={[Function]}
+              >
+                TestText1
+              </div>
+            </span>
+            <i
+              aria-hidden={true}
+              aria-label={undefined}
+              className=
+                  ms-Icon
+                  ms-Breadcrumb-chevron
+                  {
+                    display: inline-block;
+                  }
+              data-icon-name="ChevronRight"
+              role="presentation"
+            />
+          </li>
+          <li
+            className="ms-Breadcrumb-listItem"
+          >
+            <span
+              className="ms-Breadcrumb-item"
+            >
+              <div
+                aria-describedby={undefined}
+                className="ms-TooltipHost"
+                onBlurCapture={[Function]}
+                onFocusCapture={[Function]}
+                onMouseEnter={[Function]}
+                onMouseLeave={[Function]}
+              >
+                TestText2
+              </div>
+            </span>
+            <i
+              aria-hidden={true}
+              aria-label={undefined}
+              className=
+                  ms-Icon
+                  ms-Breadcrumb-chevron
+                  {
+                    display: inline-block;
+                  }
+              data-icon-name="ChevronRight"
+              role="presentation"
+            />
+          </li>
+          <li
+            className="ms-Breadcrumb-listItem"
+          >
+            <span
+              className="ms-Breadcrumb-item"
+            >
+              <div
+                aria-describedby={undefined}
+                className="ms-TooltipHost"
+                onBlurCapture={[Function]}
+                onFocusCapture={[Function]}
+                onMouseEnter={[Function]}
+                onMouseLeave={[Function]}
+              >
+                TestText3
+              </div>
+            </span>
+            <i
+              aria-hidden={true}
+              aria-label={undefined}
+              className=
+                  ms-Icon
+                  ms-Breadcrumb-chevron
+                  {
+                    display: inline-block;
+                  }
+              data-icon-name="ChevronRight"
+              role="presentation"
+            />
+          </li>
+          <li
+            className="ms-Breadcrumb-listItem"
+          >
+            <span
+              className="ms-Breadcrumb-item"
+            >
+              <div
+                aria-describedby={undefined}
+                className="ms-TooltipHost"
+                onBlurCapture={[Function]}
+                onFocusCapture={[Function]}
+                onMouseEnter={[Function]}
+                onMouseLeave={[Function]}
+              >
+                TestText4
+              </div>
+            </span>
+            <i
+              aria-hidden={true}
+              aria-label={undefined}
+              className=
+                  ms-Icon
+                  ms-Breadcrumb-chevron
+                  {
+                    display: inline-block;
+                  }
+              data-icon-name="ChevronRight"
+              role="presentation"
+            />
+          </li>
+        </ol>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`Breadcrumb renders breadcumb correctly 2`] = `
+<div
+  className="ms-ResizeGroup"
+>
+  <div
+    className=""
+  >
+    <div
+      aria-label={undefined}
+      className="ms-Breadcrumb"
+      role="navigation"
+    >
+      <div
+        aria-describedby={undefined}
+        aria-labelledby={undefined}
+        className="ms-FocusZone"
+        data-focuszone-id="FocusZone5"
+        onFocus={[Function]}
+        onKeyDown={[Function]}
+        onMouseDownCapture={[Function]}
+        role="presentation"
+      >
+        <ol
+          className="ms-Breadcrumb-list"
+        >
+          <li
+            className="ms-Breadcrumb-overflow"
+          >
+            <button
+              aria-describedby={null}
+              aria-expanded={false}
+              aria-haspopup={true}
+              aria-label={undefined}
+              aria-labelledby={null}
+              aria-owns={null}
+              aria-pressed={undefined}
+              className=
+                  ms-Breadcrumb-overflowButton
+                  ms-Button
+                  ms-Button--icon
+                  {
+                    -moz-osx-font-smoothing: grayscale;
+                    -webkit-font-smoothing: antialiased;
+                    background-color: transparent;
+                    border-radius: 0px;
+                    border: 1px solid transparent;
+                    box-sizing: border-box;
+                    cursor: pointer;
+                    display: inline-block;
+                    font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                    font-size: 14px;
+                    font-weight: 400;
+                    height: 32px;
+                    outline: transparent;
+                    padding-bottom: 0;
+                    padding-left: 4px;
+                    padding-right: 4px;
+                    padding-top: 0;
+                    position: relative;
+                    text-align: center;
+                    text-decoration: none;
+                    user-select: none;
+                    vertical-align: top;
+                    width: 32px;
+                  }
+                  &::-moz-focus-inner {
+                    border: 0;
+                  }
+                  .ms-Fabric.is-focusVisible &:focus:after {
+                    border: 1px solid #ffffff;
+                    bottom: 0px;
+                    content: "";
+                    left: 0px;
+                    outline: 1px solid #666666;
+                    position: absolute;
+                    right: 0px;
+                    top: 0px;
+                    z-index: 1;
+                  }
+                  &:hover {
+                    color: #004578;
+                  }
+                  &:active {
+                    color: #0078d7;
+                  }
+              data-is-focusable={true}
+              disabled={undefined}
+              onClick={[Function]}
+              role="button"
+              type="button"
+            >
+              <div
+                className=
+                    ms-Button-flexContainer
+                    {
+                      align-items: center;
+                      display: flex;
+                      flex-wrap: nowrap;
+                      height: 100%;
+                      justify-content: center;
+                    }
+              >
+                <i
+                  aria-hidden={true}
+                  aria-label={undefined}
+                  className=
+                      ms-Icon
+                      ms-Button-icon
+                      {
+                        display: inline-block;
+                      }
+                      {
+                        font-size: 16px;
+                        height: 16px;
+                        line-height: 16px;
+                        margin-bottom: 0;
+                        margin-left: 4px;
+                        margin-right: 4px;
+                        margin-top: 0;
+                        text-align: center;
+                        vertical-align: middle;
+                      }
+                  data-icon-name="More"
+                  role="presentation"
+                />
+              </div>
+            </button>
+            <i
+              aria-hidden={true}
+              aria-label={undefined}
+              className=
+                  ms-Icon
+                  ms-Breadcrumb-chevron
+                  {
+                    display: inline-block;
+                  }
+              data-icon-name="ChevronRight"
+              role="presentation"
+            />
+          </li>
+          <li
+            className="ms-Breadcrumb-listItem"
+          >
+            <span
+              className="ms-Breadcrumb-item"
+            >
+              <div
+                aria-describedby={undefined}
+                className="ms-TooltipHost"
+                onBlurCapture={[Function]}
+                onFocusCapture={[Function]}
+                onMouseEnter={[Function]}
+                onMouseLeave={[Function]}
+              >
+                TestText3
+              </div>
+            </span>
+            <i
+              aria-hidden={true}
+              aria-label={undefined}
+              className=
+                  ms-Icon
+                  ms-Breadcrumb-chevron
+                  {
+                    display: inline-block;
+                  }
+              data-icon-name="ChevronRight"
+              role="presentation"
+            />
+          </li>
+          <li
+            className="ms-Breadcrumb-listItem"
+          >
+            <span
+              className="ms-Breadcrumb-item"
+            >
+              <div
+                aria-describedby={undefined}
+                className="ms-TooltipHost"
+                onBlurCapture={[Function]}
+                onFocusCapture={[Function]}
+                onMouseEnter={[Function]}
+                onMouseLeave={[Function]}
+              >
+                TestText4
+              </div>
+            </span>
+            <i
+              aria-hidden={true}
+              aria-label={undefined}
+              className=
+                  ms-Icon
+                  ms-Breadcrumb-chevron
+                  {
+                    display: inline-block;
+                  }
+              data-icon-name="ChevronRight"
+              role="presentation"
+            />
+          </li>
+        </ol>
+      </div>
+    </div>
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
index 8a5bfd4d157cc..aefdb90781b13 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
@@ -3,6 +3,8 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
 import * as ReactTestUtils from 'react-dom/test-utils';
+import * as renderer from 'react-test-renderer';
+
 import { mount } from 'enzyme';
 
 import { Calendar } from './Calendar';
@@ -92,6 +94,20 @@ describe('Calendar', () => {
         />) as Calendar;
     });
 
+    it('Renders simple calendar correctly', () => {
+      const date = new Date(2000, 1, 1);
+      const component = renderer.create(
+        <Calendar
+          strings={ dayPickerStrings }
+          isMonthPickerVisible
+          value={ date }
+        />
+      );
+
+      let tree = component.toJSON();
+      expect(tree).toMatchSnapshot();
+    });
+
     it('Verify day picker header', () => {
       let today = new Date();
       let monthName = dayPickerStrings.months[today.getMonth()];
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/__snapshots__/Calendar.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Calendar/__snapshots__/Calendar.test.tsx.snap
new file mode 100644
index 0000000000000..31df7ed33f3a1
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Calendar/__snapshots__/Calendar.test.tsx.snap
@@ -0,0 +1,1111 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Calendar Test rendering simplest calendar Renders simple calendar correctly 1`] = `
+<div
+  className="ms-DatePicker"
+  role="application"
+>
+  <div
+    className="ms-DatePicker-picker ms-DatePicker-picker--opened ms-DatePicker-picker--focused ms-DatePicker-monthPickerVisible undefined ms-DatePicker-calendarsInline undefined"
+  >
+    <div
+      className="ms-DatePicker-holder ms-slideDownIn10"
+      onKeyDown={[Function]}
+    >
+      <div
+        className="ms-DatePicker-frame"
+      >
+        <div
+          className="ms-DatePicker-wrap"
+        >
+          <div
+            className="ms-DatePicker-dayPicker"
+            id="DatePickerDay-dayPicker10"
+          >
+            <div
+              className="ms-DatePicker-monthComponents"
+            >
+              <div
+                className="ms-DatePicker-navContainer"
+              >
+                <span
+                  aria-controls="DatePickerDay-dayPicker10"
+                  aria-label={undefined}
+                  className="ms-DatePicker-prevMonth js-prevMonth"
+                  onClick={[Function]}
+                  onKeyDown={[Function]}
+                  role="button"
+                  tabIndex={0}
+                >
+                  <i
+                    aria-hidden={true}
+                    aria-label={undefined}
+                    className=
+                        ms-Icon
+                        {
+                          display: inline-block;
+                        }
+                    data-icon-name="Up"
+                    role="presentation"
+                  />
+                </span>
+                <span
+                  aria-controls="DatePickerDay-dayPicker10"
+                  aria-label={undefined}
+                  className="ms-DatePicker-nextMonth js-nextMonth"
+                  onClick={[Function]}
+                  onKeyDown={[Function]}
+                  role="button"
+                  tabIndex={0}
+                >
+                  <i
+                    aria-hidden={true}
+                    aria-label={undefined}
+                    className=
+                        ms-Icon
+                        {
+                          display: inline-block;
+                        }
+                    data-icon-name="Down"
+                    role="presentation"
+                  />
+                </span>
+              </div>
+            </div>
+            <div
+              className="ms-DatePicker-header"
+            >
+              <div
+                aria-atomic="true"
+                aria-live="polite"
+                aria-relevant="text"
+                id="DatePickerDay-monthAndYear11"
+              >
+                <div
+                  className="ms-DatePicker-monthAndYear"
+                >
+                  February 2000
+                </div>
+              </div>
+            </div>
+            <div
+              aria-describedby={undefined}
+              aria-labelledby={undefined}
+              className="ms-FocusZone"
+              data-focuszone-id="FocusZone12"
+              onFocus={[Function]}
+              onKeyDown={[Function]}
+              onMouseDownCapture={[Function]}
+              role="presentation"
+            >
+              <table
+                aria-activedescendant="DatePickerDay-active9"
+                aria-labelledby="DatePickerDay-monthAndYear11"
+                aria-multiselectable="false"
+                aria-readonly="true"
+                className="ms-DatePicker-table"
+              >
+                <thead>
+                  <tr>
+                    <th
+                      aria-label="Sunday"
+                      className="ms-DatePicker-weekday"
+                      role="grid"
+                      scope="col"
+                      title="Sunday"
+                    >
+                      S
+                    </th>
+                    <th
+                      aria-label="Monday"
+                      className="ms-DatePicker-weekday"
+                      role="grid"
+                      scope="col"
+                      title="Monday"
+                    >
+                      M
+                    </th>
+                    <th
+                      aria-label="Tuesday"
+                      className="ms-DatePicker-weekday"
+                      role="grid"
+                      scope="col"
+                      title="Tuesday"
+                    >
+                      T
+                    </th>
+                    <th
+                      aria-label="Wednesday"
+                      className="ms-DatePicker-weekday"
+                      role="grid"
+                      scope="col"
+                      title="Wednesday"
+                    >
+                      W
+                    </th>
+                    <th
+                      aria-label="Thursday"
+                      className="ms-DatePicker-weekday"
+                      role="grid"
+                      scope="col"
+                      title="Thursday"
+                    >
+                      T
+                    </th>
+                    <th
+                      aria-label="Friday"
+                      className="ms-DatePicker-weekday"
+                      role="grid"
+                      scope="col"
+                      title="Friday"
+                    >
+                      F
+                    </th>
+                    <th
+                      aria-label="Saturday"
+                      className="ms-DatePicker-weekday"
+                      role="grid"
+                      scope="col"
+                      title="Saturday"
+                    >
+                      S
+                    </th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr
+                    role="row"
+                  >
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="January 30, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--outfocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          30
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="January 31, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--outfocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          31
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className="ms-DatePicker-dayBackground undefined"
+                    >
+                      <div
+                        aria-label="February 1, 2000"
+                        aria-selected={true}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined ms-DatePicker-day--highlighted undefined"
+                        data-is-focusable={true}
+                        id="DatePickerDay-active9"
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          1
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 2, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          2
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 3, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          3
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 4, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          4
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 5, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          5
+                        </span>
+                      </div>
+                    </td>
+                  </tr>
+                  <tr
+                    role="row"
+                  >
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 6, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          6
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 7, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          7
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 8, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          8
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 9, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          9
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 10, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          10
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 11, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          11
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 12, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          12
+                        </span>
+                      </div>
+                    </td>
+                  </tr>
+                  <tr
+                    role="row"
+                  >
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 13, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          13
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 14, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          14
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 15, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          15
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 16, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          16
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 17, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          17
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 18, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          18
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 19, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          19
+                        </span>
+                      </div>
+                    </td>
+                  </tr>
+                  <tr
+                    role="row"
+                  >
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 20, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          20
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 21, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          21
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 22, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          22
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 23, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          23
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 24, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          24
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 25, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          25
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 26, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          26
+                        </span>
+                      </div>
+                    </td>
+                  </tr>
+                  <tr
+                    role="row"
+                  >
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 27, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          27
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 28, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          28
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="February 29, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--infocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          29
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="March 1, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--outfocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          1
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="March 2, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--outfocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          2
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="March 3, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--outfocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          3
+                        </span>
+                      </div>
+                    </td>
+                    <td
+                      className=""
+                    >
+                      <div
+                        aria-label="March 4, 2000"
+                        aria-selected={false}
+                        className="ms-DatePicker-day ms-DatePicker-day--outfocus undefined"
+                        data-is-focusable={true}
+                        id={undefined}
+                        onClick={[Function]}
+                        onKeyDown={[Function]}
+                        role="gridcell"
+                      >
+                        <span
+                          aria-hidden="true"
+                        >
+                          4
+                        </span>
+                      </div>
+                    </td>
+                  </tr>
+                </tbody>
+              </table>
+            </div>
+          </div>
+          <div
+            className="ms-DatePicker-monthPicker"
+          >
+            <div
+              className="ms-DatePicker-yearComponents"
+            >
+              <div
+                className="ms-DatePicker-navContainer"
+              >
+                <span
+                  aria-label={undefined}
+                  className="ms-DatePicker-prevYear js-prevYear"
+                  onClick={[Function]}
+                  onKeyDown={[Function]}
+                  role="button"
+                  tabIndex={0}
+                >
+                  <i
+                    aria-hidden={true}
+                    aria-label={undefined}
+                    className=
+                        ms-Icon
+                        {
+                          display: inline-block;
+                        }
+                    data-icon-name="Up"
+                    role="presentation"
+                  />
+                </span>
+                <span
+                  aria-label={undefined}
+                  className="ms-DatePicker-nextYear js-nextYear"
+                  onClick={[Function]}
+                  onKeyDown={[Function]}
+                  role="button"
+                  tabIndex={0}
+                >
+                  <i
+                    aria-hidden={true}
+                    aria-label={undefined}
+                    className=
+                        ms-Icon
+                        {
+                          display: inline-block;
+                        }
+                    data-icon-name="Down"
+                    role="presentation"
+                  />
+                </span>
+              </div>
+            </div>
+            <div
+              className="ms-DatePicker-header"
+            >
+              <div
+                className="ms-DatePicker-currentYear js-showYearPicker"
+              >
+                2000
+              </div>
+            </div>
+            <div
+              aria-describedby={undefined}
+              aria-labelledby={undefined}
+              className="ms-FocusZone"
+              data-focuszone-id="FocusZone13"
+              onFocus={[Function]}
+              onKeyDown={[Function]}
+              onMouseDownCapture={[Function]}
+              role="presentation"
+            >
+              <div
+                className="ms-DatePicker-optionGrid"
+                role="grid"
+              >
+                <span
+                  aria-label="January 2000"
+                  aria-selected={false}
+                  className="ms-DatePicker-monthOption"
+                  data-is-focusable={true}
+                  onClick={[Function]}
+                  role="gridcell"
+                >
+                  Jan
+                </span>
+                <span
+                  aria-label="February 2000"
+                  aria-selected={true}
+                  className="ms-DatePicker-monthOption"
+                  data-is-focusable={true}
+                  onClick={[Function]}
+                  role="gridcell"
+                >
+                  Feb
+                </span>
+                <span
+                  aria-label="March 2000"
+                  aria-selected={false}
+                  className="ms-DatePicker-monthOption"
+                  data-is-focusable={true}
+                  onClick={[Function]}
+                  role="gridcell"
+                >
+                  Mar
+                </span>
+                <span
+                  aria-label="April 2000"
+                  aria-selected={false}
+                  className="ms-DatePicker-monthOption"
+                  data-is-focusable={true}
+                  onClick={[Function]}
+                  role="gridcell"
+                >
+                  Apr
+                </span>
+                <span
+                  aria-label="May 2000"
+                  aria-selected={false}
+                  className="ms-DatePicker-monthOption"
+                  data-is-focusable={true}
+                  onClick={[Function]}
+                  role="gridcell"
+                >
+                  May
+                </span>
+                <span
+                  aria-label="June 2000"
+                  aria-selected={false}
+                  className="ms-DatePicker-monthOption"
+                  data-is-focusable={true}
+                  onClick={[Function]}
+                  role="gridcell"
+                >
+                  Jun
+                </span>
+                <span
+                  aria-label="July 2000"
+                  aria-selected={false}
+                  className="ms-DatePicker-monthOption"
+                  data-is-focusable={true}
+                  onClick={[Function]}
+                  role="gridcell"
+                >
+                  Jul
+                </span>
+                <span
+                  aria-label="August 2000"
+                  aria-selected={false}
+                  className="ms-DatePicker-monthOption"
+                  data-is-focusable={true}
+                  onClick={[Function]}
+                  role="gridcell"
+                >
+                  Aug
+                </span>
+                <span
+                  aria-label="September 2000"
+                  aria-selected={false}
+                  className="ms-DatePicker-monthOption"
+                  data-is-focusable={true}
+                  onClick={[Function]}
+                  role="gridcell"
+                >
+                  Sep
+                </span>
+                <span
+                  aria-label="October 2000"
+                  aria-selected={false}
+                  className="ms-DatePicker-monthOption"
+                  data-is-focusable={true}
+                  onClick={[Function]}
+                  role="gridcell"
+                >
+                  Oct
+                </span>
+                <span
+                  aria-label="November 2000"
+                  aria-selected={false}
+                  className="ms-DatePicker-monthOption"
+                  data-is-focusable={true}
+                  onClick={[Function]}
+                  role="gridcell"
+                >
+                  Nov
+                </span>
+                <span
+                  aria-label="December 2000"
+                  aria-selected={false}
+                  className="ms-DatePicker-monthOption"
+                  data-is-focusable={true}
+                  onClick={[Function]}
+                  role="gridcell"
+                >
+                  Dec
+                </span>
+              </div>
+            </div>
+          </div>
+          <span
+            className="ms-DatePicker-goToday js-goToday"
+            onClick={[Function]}
+            onKeyDown={[Function]}
+            role="button"
+            tabIndex={0}
+          >
+            Go to today
+          </span>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx b/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
index 83c9946b60768..8b930ff32d90a 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
@@ -4,11 +4,27 @@ import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
 
 import * as ReactTestUtils from 'react-dom/test-utils';
+import * as renderer from 'react-test-renderer';
 import { Callout } from './Callout';
+import { CalloutContent } from './CalloutContent';
 import { DirectionalHint } from '../../common/DirectionalHint';
 
 describe('Callout', () => {
 
+  it('renders Callout correctly', () => {
+    const createNodeMock = (el: React.ReactElement<{}>) => {
+      return {
+        __events__: {}
+      };
+    };
+    const component = renderer.create(
+      <CalloutContent>Content</CalloutContent>,
+      { createNodeMock }
+    );
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
   it('target id strings does not throw exception', () => {
 
     let threwException: boolean = false;
diff --git a/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
new file mode 100644
index 0000000000000..3004deec5a3c4
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
@@ -0,0 +1,34 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Callout renders Callout correctly 1`] = `
+<div
+  className="ms-Callout-container"
+>
+  <div
+    className="ms-Callout"
+    style={
+      Object {
+        "opacity": 0,
+      }
+    }
+    tabIndex={-1}
+  >
+    <div
+      aria-describedby={undefined}
+      aria-label={undefined}
+      aria-labelledby={undefined}
+      className="ms-Callout-main"
+      onKeyDown={[Function]}
+      role={undefined}
+      style={
+        Object {
+          "backgroundColor": undefined,
+          "maxHeight": undefined,
+        }
+      }
+    >
+      Content
+    </div>
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
index 91042e81168db..00ddb5298e7fb 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
@@ -4,6 +4,7 @@ import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
 
 import * as ReactTestUtils from 'react-dom/test-utils';
+import * as renderer from 'react-test-renderer';
 
 import { ChoiceGroup } from './ChoiceGroup';
 import { IChoiceGroupOption } from './ChoiceGroup.Props';
@@ -17,6 +18,17 @@ const QUERY_SELECTOR: string = '.ms-ChoiceField-input';
 
 describe('ChoiceGroup', () => {
 
+  it('renders ChoiceGroup correctly', () => {
+    const component = renderer.create(
+      <ChoiceGroup
+        options={ TEST_OPTIONS }
+        required
+      />
+    );
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
   it('can change options', () => {
     const options: IChoiceGroupOption[] = [
       { key: '1', text: '1' },
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/__snapshots__/ChoiceGroup.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ChoiceGroup/__snapshots__/ChoiceGroup.test.tsx.snap
new file mode 100644
index 0000000000000..b972e02a5a0de
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/__snapshots__/ChoiceGroup.test.tsx.snap
@@ -0,0 +1,112 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ChoiceGroup renders ChoiceGroup correctly 1`] = `
+<div
+  className={undefined}
+  role="application"
+>
+  <div
+    aria-labelledby=" "
+    className="ms-ChoiceFieldGroup"
+    role="radiogroup"
+  >
+    <div
+      className="ms-ChoiceField"
+    >
+      <div
+        className="ms-ChoiceField-wrapper"
+      >
+        <input
+          aria-labelledby="ChoiceGroup0-1"
+          checked={false}
+          className="ms-ChoiceField-input"
+          data-automation-id="auto1"
+          disabled={undefined}
+          id="ChoiceGroup0-1"
+          name="ChoiceGroup0"
+          onBlur={[Function]}
+          onChange={[Function]}
+          onFocus={[Function]}
+          required={true}
+          type="radio"
+        />
+        <label
+          className="ms-ChoiceField-field"
+          htmlFor="ChoiceGroup0-1"
+        >
+          <span
+            className="ms-Label"
+            id="ChoiceGroupLabel1-1"
+          >
+            1
+          </span>
+        </label>
+      </div>
+    </div>
+    <div
+      className="ms-ChoiceField"
+    >
+      <div
+        className="ms-ChoiceField-wrapper"
+      >
+        <input
+          aria-labelledby="ChoiceGroup0-2"
+          checked={false}
+          className="ms-ChoiceField-input"
+          disabled={undefined}
+          id="ChoiceGroup0-2"
+          name="ChoiceGroup0"
+          onBlur={[Function]}
+          onChange={[Function]}
+          onFocus={[Function]}
+          required={true}
+          type="radio"
+        />
+        <label
+          className="ms-ChoiceField-field"
+          htmlFor="ChoiceGroup0-2"
+        >
+          <span
+            className="ms-Label"
+            id="ChoiceGroupLabel1-2"
+          >
+            2
+          </span>
+        </label>
+      </div>
+    </div>
+    <div
+      className="ms-ChoiceField"
+    >
+      <div
+        className="ms-ChoiceField-wrapper"
+      >
+        <input
+          aria-labelledby="ChoiceGroup0-3"
+          checked={false}
+          className="ms-ChoiceField-input"
+          disabled={undefined}
+          id="ChoiceGroup0-3"
+          name="ChoiceGroup0"
+          onBlur={[Function]}
+          onChange={[Function]}
+          onFocus={[Function]}
+          required={true}
+          type="radio"
+        />
+        <label
+          className="ms-ChoiceField-field"
+          htmlFor="ChoiceGroup0-3"
+        >
+          <span
+            className="ms-Label"
+            id="ChoiceGroupLabel1-3"
+          >
+            3
+          </span>
+        </label>
+      </div>
+    </div>
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.test.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.test.tsx
index ef3081f8e4788..24b8ccc30889e 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.test.tsx
@@ -3,9 +3,19 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
 import * as ReactTestUtils from 'react-dom/test-utils';
+import * as renderer from 'react-test-renderer';
+
 import { ColorPicker } from './ColorPicker';
 
 describe('ColorPicker', () => {
+  it('renders ColorPicker correctly', () => {
+    const component = renderer.create(
+      <ColorPicker color='#FFFFFF' />
+    );
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
   it('Props are correctly parsed', () => {
     let component = ReactTestUtils.renderIntoDocument(
       <ColorPicker color='#FFFFFF' />
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/__snapshots__/ColorPicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ColorPicker/__snapshots__/ColorPicker.test.tsx.snap
new file mode 100644
index 0000000000000..13819c8f7b9b3
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/__snapshots__/ColorPicker.test.tsx.snap
@@ -0,0 +1,278 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ColorPicker renders ColorPicker correctly 1`] = `
+<div
+  className="ms-ColorPicker"
+>
+  <div
+    className="ms-ColorPicker-panel"
+  >
+    <div
+      className="ms-ColorPicker-colorRect"
+      onMouseDown={[Function]}
+      style={
+        Object {
+          "backgroundColor": "#ff0000",
+          "minHeight": 220,
+          "minWidth": 220,
+        }
+      }
+    >
+      <div
+        className="ms-ColorPicker-light"
+      />
+      <div
+        className="ms-ColorPicker-dark"
+      />
+      <div
+        className="ms-ColorPicker-thumb"
+        style={
+          Object {
+            "backgroundColor": "#FFFFFF",
+            "left": "0%",
+            "top": "0%",
+          }
+        }
+      />
+    </div>
+    <div
+      className="ms-ColorPicker-slider is-hue"
+      onMouseDown={[Function]}
+    >
+      <div
+        className="ms-ColorPicker-sliderOverlay"
+        style={undefined}
+      />
+      <div
+        className="ms-ColorPicker-thumb is-slider"
+        style={
+          Object {
+            "left": "0%",
+          }
+        }
+      />
+    </div>
+    <div
+      className="ms-ColorPicker-slider is-alpha"
+      onMouseDown={[Function]}
+    >
+      <div
+        className="ms-ColorPicker-sliderOverlay"
+        style={
+          Object {
+            "background": "linear-gradient(to right, transparent 0, #FFFFFF 100%)",
+          }
+        }
+      />
+      <div
+        className="ms-ColorPicker-thumb is-slider"
+        style={
+          Object {
+            "left": "100%",
+          }
+        }
+      />
+    </div>
+    <table
+      cellPadding="0"
+      cellSpacing="0"
+      className="ms-ColorPicker-table"
+    >
+      <thead>
+        <tr
+          className=
+
+              {
+                -moz-osx-font-smoothing: grayscale;
+                -webkit-font-smoothing: antialiased;
+                font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                font-size: 12px;
+                font-weight: 400;
+              }
+        >
+          <td
+            className={undefined}
+          >
+            Hex
+          </td>
+          <td>
+            Red
+          </td>
+          <td>
+            Green
+          </td>
+          <td>
+            Blue
+          </td>
+          <td>
+            Alpha
+          </td>
+        </tr>
+      </thead>
+      <tbody>
+        <tr>
+          <td>
+            <div
+              className="ms-TextField ms-ColorPicker-input"
+            >
+              <div
+                className="ms-TextField-wrapper"
+              >
+                <div
+                  className="ms-TextField-fieldGroup"
+                >
+                  <input
+                    aria-describedby={null}
+                    aria-invalid={false}
+                    aria-label={undefined}
+                    className="ms-TextField-field"
+                    id="TextField0"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    onInput={[Function]}
+                    type="text"
+                    value="ffffff"
+                  />
+                </div>
+              </div>
+            </div>
+          </td>
+          <td
+            style={
+              Object {
+                "width": "18%",
+              }
+            }
+          >
+            <div
+              className="ms-TextField ms-ColorPicker-input"
+            >
+              <div
+                className="ms-TextField-wrapper"
+              >
+                <div
+                  className="ms-TextField-fieldGroup"
+                >
+                  <input
+                    aria-describedby={null}
+                    aria-invalid={false}
+                    aria-label={undefined}
+                    className="ms-TextField-field"
+                    id="TextField2"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    onInput={[Function]}
+                    type="text"
+                    value="255"
+                  />
+                </div>
+              </div>
+            </div>
+          </td>
+          <td
+            style={
+              Object {
+                "width": "18%",
+              }
+            }
+          >
+            <div
+              className="ms-TextField ms-ColorPicker-input"
+            >
+              <div
+                className="ms-TextField-wrapper"
+              >
+                <div
+                  className="ms-TextField-fieldGroup"
+                >
+                  <input
+                    aria-describedby={null}
+                    aria-invalid={false}
+                    aria-label={undefined}
+                    className="ms-TextField-field"
+                    id="TextField4"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    onInput={[Function]}
+                    type="text"
+                    value="255"
+                  />
+                </div>
+              </div>
+            </div>
+          </td>
+          <td
+            style={
+              Object {
+                "width": "18%",
+              }
+            }
+          >
+            <div
+              className="ms-TextField ms-ColorPicker-input"
+            >
+              <div
+                className="ms-TextField-wrapper"
+              >
+                <div
+                  className="ms-TextField-fieldGroup"
+                >
+                  <input
+                    aria-describedby={null}
+                    aria-invalid={false}
+                    aria-label={undefined}
+                    className="ms-TextField-field"
+                    id="TextField6"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    onInput={[Function]}
+                    type="text"
+                    value="255"
+                  />
+                </div>
+              </div>
+            </div>
+          </td>
+          <td
+            style={
+              Object {
+                "width": "18%",
+              }
+            }
+          >
+            <div
+              className="ms-TextField ms-ColorPicker-input"
+            >
+              <div
+                className="ms-TextField-wrapper"
+              >
+                <div
+                  className="ms-TextField-fieldGroup"
+                >
+                  <input
+                    aria-describedby={null}
+                    aria-invalid={false}
+                    aria-label={undefined}
+                    className="ms-TextField-field"
+                    id="TextField8"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    onInput={[Function]}
+                    type="text"
+                    value="100"
+                  />
+                </div>
+              </div>
+            </div>
+          </td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
index 92da499632dfa..f71232a4bb22e 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
@@ -4,6 +4,7 @@ import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
 import * as ReactTestUtils from 'react-dom/test-utils';
 import { mount, ReactWrapper } from 'enzyme';
+import * as renderer from 'react-test-renderer';
 import { KeyCodes } from '../../Utilities';
 
 import { ComboBox } from './ComboBox';
@@ -22,6 +23,19 @@ const DEFAULT_OPTIONS2: IComboBoxOption[] = [
 ];
 
 describe('ComboBox', () => {
+  it('Renders ComboBox correctly', () => {
+    const createNodeMock = (el: React.ReactElement<{}>) => {
+      return {
+        __events__: {}
+      };
+    };
+    const component = renderer.create(
+      <ComboBox options={ DEFAULT_OPTIONS } />,
+      { createNodeMock }
+    );
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
 
   it('Can flip between enabled and disabled.', () => {
     let wrapper = mount(
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
new file mode 100644
index 0000000000000..9bcf541bbb886
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
@@ -0,0 +1,205 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ComboBox Renders ComboBox correctly 1`] = `
+<div
+  autoComplete="on"
+  className="ms-ComboBox-container "
+>
+  <div
+    className=
+        ms-ComboBox
+        {
+          -moz-osx-font-smoothing: grayscale;
+          -webkit-font-smoothing: antialiased;
+          background-color: #ffffff;
+          border-color: #c8c8c8;
+          border-style: solid;
+          border-width: 1px;
+          box-shadow: none;
+          box-sizing: content-box;
+          color: #333333;
+          cursor: text;
+          display: block;
+          font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+          font-size: 14px;
+          font-weight: 400;
+          height: 32px;
+          line-height: 30px;
+          margin-bottom: 10px;
+          margin-left: 0;
+          outline: 0;
+          overflow: hidden;
+          padding-bottom: 0;
+          padding-left: 12px;
+          padding-right: 32px;
+          padding-top: 0;
+          position: relative;
+          text-overflow: ellipsis;
+          user-select: none;
+          white-space: nowrap;
+        }
+        & .ms-Label {
+          display: inline-block;
+          margin-bottom: 8px;
+        }
+        &:hover {
+          border-color: #0078d7;
+        }
+        @media screen and (-ms-high-contrast: active) & {
+          -ms-high-contrast-adjust: none;
+          border-color: Highlight;
+          color: HighlightText;
+        }
+    id="ComboBox0wrapper"
+  >
+    <input
+      aria-activedescendant={null}
+      aria-autocomplete={true}
+      aria-describedby="ComboBox0-option"
+      aria-disabled={undefined}
+      aria-expanded={false}
+      aria-label={undefined}
+      aria-labelledby={undefined}
+      aria-owns="ComboBox0-list"
+      aria-readonly="true"
+      autoCapitalize="off"
+      autoComplete="off"
+      className=
+          ms-ComboBox-Input
+          {
+            border-style: none;
+            box-sizing: border-box;
+            font: inherit;
+            height: 30px;
+            margin-bottom: 1px;
+            margin-left: 0px;
+            margin-right: 0px;
+            margin-top: 1px;
+            outline: none;
+            padding-bottom: 0;
+            padding-left: 0;
+            padding-right: 0;
+            padding-top: 0;
+            text-overflow: ellipsis;
+            width: 100%;
+          }
+      data-is-interactable={true}
+      id="ComboBox0-input"
+      onBlur={[Function]}
+      onChange={[Function]}
+      onClick={[Function]}
+      onFocus={[Function]}
+      onKeyDown={[Function]}
+      onKeyUp={[Function]}
+      readOnly={true}
+      role="combobox"
+      spellCheck={false}
+      type="text"
+      value=""
+    />
+    <button
+      aria-describedby={null}
+      aria-hidden="true"
+      aria-label={undefined}
+      aria-labelledby={null}
+      aria-pressed={undefined}
+      className=
+          ms-ComboBox-CaretDown-button
+          ms-Button
+          ms-Button--icon
+          {
+            -moz-osx-font-smoothing: grayscale;
+            -webkit-font-smoothing: antialiased;
+            @media screen and (-ms-high-contrast:  active) &:[object Object];
+            background-color: transparent;
+            border-radius: 0px;
+            border: 1px solid transparent;
+            box-sizing: border-box;
+            color: #212121;
+            cursor: default;
+            display: inline-block;
+            font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+            font-size: 12px;
+            font-weight: 400;
+            height: 32px;
+            line-height: 30px;
+            outline: transparent;
+            padding-bottom: 0;
+            padding-left: 4px;
+            padding-right: 4px;
+            padding-top: 0;
+            position: absolute;
+            text-align: center;
+            text-decoration: none;
+            user-select: none;
+            vertical-align: top;
+            width: 32px;
+          }
+          &::-moz-focus-inner {
+            border: 0;
+          }
+          .ms-Fabric.is-focusVisible &:focus:after {
+            border: 1px solid #ffffff;
+            bottom: 0px;
+            content: "";
+            left: 0px;
+            outline: 1px solid #666666;
+            position: absolute;
+            right: 0px;
+            top: 0px;
+            z-index: 1;
+          }
+          &:hover {
+            background-color: #dadada;
+            color: #004578;
+          }
+          &:active {
+            background-color: #c8c8c8;
+            color: #0078d7;
+          }
+      data-is-focusable={true}
+      disabled={undefined}
+      onClick={[Function]}
+      role="presentation"
+      tabIndex={-1}
+      type="button"
+    >
+      <div
+        className=
+            ms-Button-flexContainer
+            {
+              align-items: center;
+              display: flex;
+              flex-wrap: nowrap;
+              height: 100%;
+              justify-content: center;
+            }
+      >
+        <i
+          aria-hidden={true}
+          aria-label={undefined}
+          className=
+              ms-Icon
+              ms-Button-icon
+              {
+                display: inline-block;
+              }
+              {
+                font-size: 16px;
+                height: 16px;
+                line-height: 16px;
+                margin-bottom: 0;
+                margin-left: 4px;
+                margin-right: 4px;
+                margin-top: 0;
+                text-align: center;
+                vertical-align: middle;
+              }
+          data-icon-name="ChevronDown"
+          role="presentation"
+        />
+      </div>
+    </button>
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
index 06b4b4421d2fa..27288ec66f833 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
@@ -4,6 +4,7 @@ import * as React from 'react';
 
 import * as ReactDOM from 'react-dom';
 import * as ReactTestUtils from 'react-dom/test-utils';
+import * as renderer from 'react-test-renderer';
 
 import { CommandBar } from './CommandBar';
 import { IContextualMenuItem } from '../ContextualMenu/ContextualMenu.Props';
@@ -19,6 +20,29 @@ describe('CommandBar', () => {
     }
   });
 
+  it('renders CommandBar correctly', () => {
+    const items: IContextualMenuItem[] = [
+      {
+        name: 'TestText 1',
+        key: 'TestKey1',
+        subMenuProps: {
+          items: [
+            {
+              name: 'SubmenuText 1',
+              key: 'SubmenuKey1',
+              className: 'SubMenuClass'
+            }
+          ]
+        }
+      },
+    ];
+    const component = renderer.create(
+      <CommandBar items={ items } />
+    );
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
   it('opens a menu with deprecated IContextualMenuItem.items property', () => {
     const items: IContextualMenuItem[] = [
       {
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap b/packages/office-ui-fabric-react/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
new file mode 100644
index 0000000000000..c696f9f443dbd
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
@@ -0,0 +1,59 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`CommandBar renders CommandBar correctly 1`] = `
+<div
+  className="ms-CommandBar"
+>
+  <div
+    aria-describedby={undefined}
+    aria-labelledby={undefined}
+    className="ms-FocusZone"
+    data-focuszone-id="FocusZone1"
+    onFocus={[Function]}
+    onKeyDown={[Function]}
+    onMouseDownCapture={[Function]}
+    role="menubar"
+  >
+    <div
+      className="ms-CommandBar-primaryCommands"
+    >
+      <div
+        className="ms-CommandBarItem"
+      >
+        <button
+          aria-expanded={false}
+          aria-haspopup={true}
+          aria-label={undefined}
+          className="ms-CommandBarItem-link undefined"
+          data-command-key="TestKey1"
+          id="CommandBar0TestKey1"
+          name="TestText 1"
+          onClick={[Function]}
+          role="menuitem"
+        >
+          <span
+            className="ms-CommandBarItem-commandText"
+          >
+            TestText 1
+          </span>
+          <i
+            aria-hidden={true}
+            aria-label={undefined}
+            className=
+                ms-Icon
+                ms-CommandBarItem-chevronDown
+                {
+                  display: inline-block;
+                }
+            data-icon-name="ChevronDown"
+            role="presentation"
+          />
+        </button>
+      </div>
+    </div>
+    <div
+      className="ms-CommandBar-sideCommands"
+    />
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
index f3eb023c20708..41ae3ce88e2e4 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
@@ -3,6 +3,7 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
 import * as ReactTestUtils from 'react-dom/test-utils';
+import * as renderer from 'react-test-renderer';
 
 import {
   KeyCodes,
@@ -26,6 +27,12 @@ describe('Dropdown', () => {
 
   describe('single-select', () => {
 
+    it('Renders single-select Dropdown correctly', () => {
+      const component = renderer.create(<Dropdown options={ DEFAULT_OPTIONS } />);
+      let tree = component.toJSON();
+      expect(tree).toMatchSnapshot();
+    });
+
     it('Can flip between enabled and disabled.', () => {
 
       let container = document.createElement('div');
@@ -352,6 +359,15 @@ describe('Dropdown', () => {
   });
 
   describe('multi-select', () => {
+    it('Renders multiselect Dropdown correctly', () => {
+      const component = renderer.create(
+        <Dropdown
+          options={ DEFAULT_OPTIONS }
+          multiSelect
+        />);
+      let tree = component.toJSON();
+      expect(tree).toMatchSnapshot();
+    });
 
     it('Renders no selected item in default case', () => {
       let container = document.createElement('div');
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap
new file mode 100644
index 0000000000000..5b7e5760cc0aa
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap
@@ -0,0 +1,99 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Dropdown multi-select Renders multiselect Dropdown correctly 1`] = `
+<div
+  className="ms-Dropdown-container"
+>
+  <div
+    aria-activedescendant={null}
+    aria-describedby="Dropdown92-option"
+    aria-disabled={undefined}
+    aria-expanded="false"
+    aria-label={undefined}
+    aria-live="assertive"
+    aria-owns={null}
+    className="ms-Dropdown"
+    data-is-focusable={true}
+    id="Dropdown92"
+    onBlur={[Function]}
+    onClick={[Function]}
+    onKeyDown={[Function]}
+    onKeyUp={[Function]}
+    role="menu"
+    tabIndex={0}
+  >
+    <span
+      aria-atomic={true}
+      aria-readonly="true"
+      className="ms-Dropdown-title ms-Dropdown-titleIsPlaceHolder"
+      id="Dropdown92-option"
+      role="textbox"
+    />
+    <span
+      className="ms-Dropdown-caretDownWrapper"
+    >
+      <i
+        aria-hidden={true}
+        aria-label={undefined}
+        className=
+            ms-Icon
+            ms-Dropdown-caretDown
+            {
+              display: inline-block;
+            }
+        data-icon-name="ChevronDown"
+        role="presentation"
+      />
+    </span>
+  </div>
+</div>
+`;
+
+exports[`Dropdown single-select Renders single-select Dropdown correctly 1`] = `
+<div
+  className="ms-Dropdown-container"
+>
+  <div
+    aria-activedescendant={null}
+    aria-describedby="Dropdown0-option"
+    aria-disabled={undefined}
+    aria-expanded="false"
+    aria-label={undefined}
+    aria-live="assertive"
+    aria-owns={null}
+    className="ms-Dropdown"
+    data-is-focusable={true}
+    id="Dropdown0"
+    onBlur={[Function]}
+    onClick={[Function]}
+    onKeyDown={[Function]}
+    onKeyUp={[Function]}
+    role="menu"
+    tabIndex={0}
+  >
+    <span
+      aria-atomic={true}
+      aria-readonly="true"
+      className="ms-Dropdown-title ms-Dropdown-titleIsPlaceHolder"
+      id="Dropdown0-option"
+      role="textbox"
+    />
+    <span
+      className="ms-Dropdown-caretDownWrapper"
+    >
+      <i
+        aria-hidden={true}
+        aria-label={undefined}
+        className=
+            ms-Icon
+            ms-Dropdown-caretDown
+            {
+              display: inline-block;
+            }
+        data-icon-name="ChevronDown"
+        role="presentation"
+      />
+    </span>
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
index d433762d4d62a..20386e2475e40 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
@@ -3,6 +3,7 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import * as ReactTestUtils from 'react-dom/test-utils';
 /* tslint:enable:no-unused-variable */
+import * as renderer from 'react-test-renderer';
 import { mount, shallow } from 'enzyme';
 import { setRTL } from '../../Utilities';
 import { Facepile } from './Facepile';
@@ -36,6 +37,12 @@ describe('Facepile', () => {
       setRTL(false);
     });
 
+    it('renders Facepile correctly', () => {
+      const component = renderer.create(<Facepile personas={ facepilePersonas } />);
+      let tree = component.toJSON();
+      expect(tree).toMatchSnapshot();
+    });
+
     it('renders with only add button if no personas found and addButtonProps are not null', () => {
       const wrapper = ReactTestUtils.renderIntoDocument(
         <Facepile
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
new file mode 100644
index 0000000000000..f61f4dc6df462
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
@@ -0,0 +1,175 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Facepile Render personas and buttons renders Facepile correctly 1`] = `
+<div
+  className="ms-Facepile"
+>
+  <div
+    className="ms-Facepile-itemContainer"
+  >
+    <div
+      aria-describedby="0"
+      aria-labelledby={undefined}
+      className="ms-FocusZone ms-Facepile-members"
+      data-focuszone-id="FocusZone1"
+      onFocus={[Function]}
+      onKeyDown={[Function]}
+      onMouseDownCapture={[Function]}
+      role="listbox"
+    >
+      <div
+        className="ms-Facepile-itemButton ms-Facepile-person"
+        data="50%"
+        data-is-focusable={true}
+        onMouseMove={[Function]}
+        onMouseOut={[Function]}
+        role="option"
+        title="Annie Lindqvist"
+      >
+        <div
+          className="ms-Persona-coin ms-Persona--xs undefined"
+          size={2}
+        >
+          <div
+            className="ms-Persona-imageArea"
+            style={undefined}
+          >
+            <div
+              aria-hidden="true"
+              className="ms-Persona-initials ms-Persona-initials--darkRed undefined"
+              style={undefined}
+            >
+              <span>
+                AL
+              </span>
+            </div>
+            <div
+              className="ms-Image ms-Persona-image"
+              style={
+                Object {
+                  "height": 32,
+                  "width": 32,
+                }
+              }
+            >
+              <img
+                alt=""
+                className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+                onError={[Function]}
+                onLoad={[Function]}
+                role={undefined}
+                src="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets/persona-female.png"
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        className="ms-Facepile-itemButton ms-Facepile-person"
+        data="$1,000"
+        data-is-focusable={true}
+        onMouseMove={[Function]}
+        onMouseOut={[Function]}
+        role="option"
+        title="Aaron Reid"
+      >
+        <div
+          className="ms-Persona-coin ms-Persona--xs undefined"
+          size={2}
+        >
+          <div
+            className="ms-Persona-imageArea"
+            style={undefined}
+          >
+            <div
+              aria-hidden="true"
+              className="ms-Persona-initials ms-Persona-initials--lightPink undefined"
+              style={undefined}
+            >
+              <span>
+                AR
+              </span>
+            </div>
+            <div
+              className="ms-Image ms-Persona-image"
+              style={
+                Object {
+                  "height": 32,
+                  "width": 32,
+                }
+              }
+            >
+              <img
+                alt=""
+                className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+                onError={[Function]}
+                onLoad={[Function]}
+                role={undefined}
+                src="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets/persona-female.png"
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+      <button
+        aria-describedby={null}
+        aria-label={undefined}
+        aria-labelledby={null}
+        aria-pressed={undefined}
+        className="ms-Facepile-itemButton ms-Facepile-person ms-Button "
+        data="75%"
+        data-is-focusable={true}
+        disabled={undefined}
+        onClick={[Function]}
+        onMouseMove={[Function]}
+        onMouseOut={[Function]}
+        role="option"
+        title="Alex Lundberg"
+        type="button"
+      >
+        <div
+          className="ms-Button-flexContainer"
+        >
+          <div
+            className="ms-Persona-coin ms-Persona--xs undefined"
+            size={2}
+          >
+            <div
+              className="ms-Persona-imageArea"
+              style={undefined}
+            >
+              <div
+                aria-hidden="true"
+                className="ms-Persona-initials ms-Persona-initials--black undefined"
+                style={undefined}
+              >
+                <span>
+                  AL
+                </span>
+              </div>
+              <div
+                className="ms-Image ms-Persona-image"
+                style={
+                  Object {
+                    "height": 32,
+                    "width": 32,
+                  }
+                }
+              >
+                <img
+                  alt=""
+                  className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+                  onError={[Function]}
+                  onLoad={[Function]}
+                  role={undefined}
+                  src={undefined}
+                />
+              </div>
+            </div>
+          </div>
+        </div>
+      </button>
+    </div>
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
index 75d429b3d2b6a..b04b9cdb5c6c8 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
@@ -4,6 +4,7 @@ import * as React from 'react';
 
 import * as ReactDOM from 'react-dom';
 import * as ReactTestUtils from 'react-dom/test-utils';
+import * as renderer from 'react-test-renderer';
 import { shallow, mount, ReactWrapper } from 'enzyme';
 
 import { Image } from './Image';
@@ -22,6 +23,12 @@ describe('Image', () => {
     Object.defineProperty(HTMLImageElement.prototype, 'naturalWidth', { get: () => 1 });
   });
 
+  it('renders Image correctly', () => {
+    const component = renderer.create(<Image src={ testImage1x1 } />);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
   it('renders an image', (done) => {
     let component = ReactTestUtils.renderIntoDocument(
       <Image
diff --git a/packages/office-ui-fabric-react/src/components/Image/__snapshots__/Image.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Image/__snapshots__/Image.test.tsx.snap
new file mode 100644
index 0000000000000..ed49ec98faf18
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Image/__snapshots__/Image.test.tsx.snap
@@ -0,0 +1,22 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Image renders Image correctly 1`] = `
+<div
+  className="ms-Image"
+  style={
+    Object {
+      "height": undefined,
+      "width": undefined,
+    }
+  }
+>
+  <img
+    alt={undefined}
+    className="ms-Image-image ms-Image-image--portrait undefined is-notLoaded is-fadeIn"
+    onError={[Function]}
+    onLoad={[Function]}
+    role={undefined}
+    src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQImWP4DwQACfsD/eNV8pwAAAAASUVORK5CYII="
+  />
+</div>
+`;

From 2b318265a85acf7d858bcd5b161641e6c2d7c07a Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 12 Oct 2017 20:08:38 -0700
Subject: [PATCH 0846/1641] Adding media query support for merge-styles (#3110)

* Adding merge-styles attr.

* Adding change file.

* Updates.

* Fixing media queries.

* Fixing the media queries used so far.

* Fix for mshighcontrastadjust...
---
 ...ng-merge-styles-attr_2017-10-12-23-36.json | 11 +++
 .../media-queries_2017-10-13-02-10.json       | 11 +++
 packages/merge-styles/README.md               | 27 ++++++-
 .../merge-styles/src/styleToClassName.test.ts | 31 +++++++-
 packages/merge-styles/src/styleToClassName.ts | 24 ++++---
 .../components/ComboBox/ComboBox.styles.ts    | 37 +++++-----
 .../ContextualMenu/ContextualMenu.styles.ts   | 19 ++---
 .../SpinButton/SpinButton.styles.ts           | 72 +++++++++++--------
 8 files changed, 169 insertions(+), 63 deletions(-)
 create mode 100644 common/changes/@uifabric/merge-styles/adding-merge-styles-attr_2017-10-12-23-36.json
 create mode 100644 common/changes/@uifabric/merge-styles/media-queries_2017-10-13-02-10.json

diff --git a/common/changes/@uifabric/merge-styles/adding-merge-styles-attr_2017-10-12-23-36.json b/common/changes/@uifabric/merge-styles/adding-merge-styles-attr_2017-10-12-23-36.json
new file mode 100644
index 0000000000000..a9cfc523d8fb7
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/adding-merge-styles-attr_2017-10-12-23-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "Adding data-merge-styles attribute to the style element so that it can be uniquely identified.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/media-queries_2017-10-13-02-10.json b/common/changes/@uifabric/merge-styles/media-queries_2017-10-13-02-10.json
new file mode 100644
index 0000000000000..31e23474faeb6
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/media-queries_2017-10-13-02-10.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "Fixes to support media queries.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/merge-styles/README.md b/packages/merge-styles/README.md
index e6ed6ee0bed3c..7cceed7041b16 100644
--- a/packages/merge-styles/README.md
+++ b/packages/merge-styles/README.md
@@ -169,7 +169,6 @@ By default, the rule will be appended to the current selector scope. That is, in
 .css-0 { background: red; }
 .css-0:hover { background: green; }
 ```
-
 ### Parent/child selectors
 
 In some cases, you may need to use parent or child selectors. To do so, you can define a selector from scratch and use the `&` character to represent the generated class name. When using the `&`, the current scope is ignored. Example:
@@ -195,6 +194,32 @@ This would register the rules:
 .ms-Fabric.is-focusVisible .css-0 { background: red; }
 .css-0 .child { background: green; }
 ```
+
+### Media queries
+
+Media queries can be applied via selectors. For example, this style will produce a class which has a red background when above 600px, and green when at or below 600px:
+
+```tsx
+mergeStyles({
+  background: 'red',
+  selectors: {
+    '@media(max-width: 600px)': {
+      background: 'green'
+    }
+  }
+});
+```
+
+Produces:
+
+```css
+.css-0 { background: red; }
+
+@media(max-width: 600px) {
+  .css-0 { background: green; }
+}
+```
+
 ### Referencing child elements within the mergeStyleSets scope
 
 One important concept about `mergeStyleSets` is that it produces a map of class names for the given elements:
diff --git a/packages/merge-styles/src/styleToClassName.test.ts b/packages/merge-styles/src/styleToClassName.test.ts
index 009cea429d534..1ecb25d858607 100644
--- a/packages/merge-styles/src/styleToClassName.test.ts
+++ b/packages/merge-styles/src/styleToClassName.test.ts
@@ -1,10 +1,11 @@
-import { setRTL } from './transforms/rtlifyRules';
-import { styleToClassName } from './styleToClassName';
 import {
   InjectionMode,
   Stylesheet
 } from './Stylesheet';
 
+import { setRTL } from './transforms/rtlifyRules';
+import { styleToClassName } from './styleToClassName';
+
 const _stylesheet: Stylesheet = Stylesheet.getInstance();
 
 _stylesheet.setConfig({ injectionMode: InjectionMode.none });
@@ -128,4 +129,30 @@ describe('styleToClassName', () => {
     expect(_stylesheet.getRules()).toEqual('.css-0.css-0.css-0{background:red;}');
   });
 
+  it('can apply media queries', () => {
+    styleToClassName({
+      background: 'blue',
+      selectors: {
+        '@media(min-width: 300px)': {
+          background: 'red',
+          selectors: {
+            ':hover': {
+              background: 'green'
+            }
+          }
+        }
+      }
+    });
+
+    expect(_stylesheet.getRules()).toEqual(
+      '.css-0{background:blue;}' +
+      '@media(min-width: 300px){' +
+      '.css-0{background:red;}' +
+      '}' +
+      '@media(min-width: 300px){' +
+      '.css-0:hover{background:green;}' +
+      '}'
+    );
+  });
+
 });
diff --git a/packages/merge-styles/src/styleToClassName.ts b/packages/merge-styles/src/styleToClassName.ts
index 042118c7d965b..2a3f61f5fc045 100644
--- a/packages/merge-styles/src/styleToClassName.ts
+++ b/packages/merge-styles/src/styleToClassName.ts
@@ -1,9 +1,10 @@
-import { rtlifyRules } from './transforms/rtlifyRules';
-import { provideUnits } from './transforms/provideUnits';
-import { prefixRules } from './transforms/prefixRules';
-import { kebabRules } from './transforms/kebabRules';
+import { IRawStyle, IStyle } from './IStyle';
+
 import { Stylesheet } from './Stylesheet';
-import { IStyle, IRawStyle } from './IStyle';
+import { kebabRules } from './transforms/kebabRules';
+import { prefixRules } from './transforms/prefixRules';
+import { provideUnits } from './transforms/provideUnits';
+import { rtlifyRules } from './transforms/rtlifyRules';
 
 const DISPLAY_NAME = 'displayName';
 
@@ -57,9 +58,14 @@ function extractRules(
             if (selectors.hasOwnProperty(newSelector)) {
               const selectorValue = selectors[newSelector];
 
-              if (newSelector.indexOf('&') < 0) {
+              if (newSelector.indexOf('@media') === 0) {
+                newSelector = newSelector + '{' + currentSelector;
+              } else if (newSelector.indexOf(':') === 0) {
                 newSelector = currentSelector + newSelector;
+              } else if (newSelector.indexOf('&') < 0) {
+                newSelector = currentSelector + ' ' + newSelector;
               }
+
               extractRules([selectorValue], rules, newSelector);
             }
           }
@@ -201,8 +207,10 @@ export function applyRegistration(
           return '';
         });
 
-        // Insert.
-        stylesheet.insertRule(`${selector}{${rules}}`);
+        // Insert. Note if a media query, we must close the query with a final bracket.
+        const processedRule = `${selector}{${rules}}${(selector.indexOf('@media') === 0) ? '}' : ''}`;
+
+        stylesheet.insertRule(processedRule);
       }
     }
     stylesheet.cacheClassName(
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index d435e2a83a9cd..7164b95572016 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -1,19 +1,20 @@
 import {
-  IComboBoxStyles,
-  IComboBoxOptionStyles,
-} from './ComboBox.Props';
-import {
-  ITheme,
-  IRawStyle,
-  concatStyleSets,
   FontSizes,
   FontWeights,
+  IRawStyle,
+  ITheme,
+  concatStyleSets,
   getFocusStyle
 } from '../../Styling';
+import {
+  IComboBoxOptionStyles,
+  IComboBoxStyles,
+} from './ComboBox.Props';
+
 import { IButtonStyles } from '../../Button';
 import { memoizeFunction } from '../../Utilities';
 
-const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active) &';
+const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
 
 const ComboBoxHeight = '32px';
 const ComboBoxLineHeight = '30px';
@@ -28,9 +29,11 @@ const getDisabledStyles = memoizeFunction((theme: ITheme): IRawStyle => {
     borderColor: semanticColors.disabledBackground,
     color: semanticColors.disabledText,
     cursor: 'default',
-    [MS_HIGHCONTRAST_ACTIVE]: {
-      borderColor: 'GrayText',
-      color: 'GrayText'
+    selectors: {
+      [MS_HIGHCONTRAST_ACTIVE]: {
+        borderColor: 'GrayText',
+        color: 'GrayText'
+      }
     },
   };
 });
@@ -158,11 +161,13 @@ export const getCaretDownButtonStyles = memoizeFunction((
       width: ComboxBoxCaretDownWidth,
       textAlign: 'center',
       cursor: 'default',
-      [MS_HIGHCONTRAST_ACTIVE]: {
-        backgroundColor: 'ButtonFace',
-        borderColor: 'ButtonText',
-        color: 'ButtonText',
-        msHighContrastAdjust: 'none'
+      selectors: {
+        [MS_HIGHCONTRAST_ACTIVE]: {
+          backgroundColor: 'ButtonFace',
+          borderColor: 'ButtonText',
+          color: 'ButtonText',
+          MsHighContrastAdjust: 'none'
+        }
       }
     },
     rootHovered: {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
index fbefef1ff6cc4..db4e0865e4c20 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
@@ -1,15 +1,16 @@
-import { memoizeFunction } from '../../Utilities';
-import { IContextualMenuStyles, IMenuItemStyles } from './ContextualMenu.Props';
 import {
-  ITheme,
+  FontSizes,
+  FontWeights,
   IRawStyle,
+  ITheme,
   concatStyleSets,
-  FontWeights,
-  FontSizes,
   getFocusStyle
 } from '../../Styling';
+import { IContextualMenuStyles, IMenuItemStyles } from './ContextualMenu.Props';
+
+import { memoizeFunction } from '../../Utilities';
 
-const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active) &';
+const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
 
 const ContextualMenuItemHeight = '32px';
 const ContextualMenuIconWidth = '14px';
@@ -135,8 +136,10 @@ export const getMenuItemStyles = memoizeFunction((
     },
     iconColor: {
       color: ContextualMenuIconColor,
-      [MS_HIGHCONTRAST_ACTIVE]: {
-        color: 'HighlightText',
+      selectors: {
+        [MS_HIGHCONTRAST_ACTIVE]: {
+          color: 'HighlightText',
+        }
       }
     },
     subMenuIcon: {
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
index 727157fea5a12..988daf66eabf1 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
@@ -1,14 +1,14 @@
-import { IButtonStyles } from '../../Button';
-import { memoizeFunction } from '../../Utilities';
-import { ISpinButtonStyles } from './SpinButton.Props';
-
 import {
-  ITheme,
+  FontSizes,
   IRawStyle,
-  concatStyleSets,
-  FontSizes
+  ITheme,
+  concatStyleSets
 } from '../../Styling';
 
+import { IButtonStyles } from '../../Button';
+import { ISpinButtonStyles } from './SpinButton.Props';
+import { memoizeFunction } from '../../Utilities';
+
 const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
 
 const _getDisabledStyles = memoizeFunction((theme: ITheme): IRawStyle => {
@@ -24,8 +24,10 @@ const _getDisabledStyles = memoizeFunction((theme: ITheme): IRawStyle => {
     pointerEvents: 'none',
     cursor: 'default',
     color: SpinButtonTextColorDisabled,
-    [MS_HIGHCONTRAST_ACTIVE]: {
-      color: 'GrayText'
+    selectors: {
+      [MS_HIGHCONTRAST_ACTIVE]: {
+        color: 'GrayText'
+      }
     }
   };
 });
@@ -64,24 +66,30 @@ export const getArrowButtonStyles = memoizeFunction((
     rootChecked: {
       backgroundColor: ArrowButtonBackgroundPressed,
       color: ArrowButtonTextColorPressed,
-      [MS_HIGHCONTRAST_ACTIVE]: {
-        backgroundColor: 'Highlight',
-        color: 'HighlightText'
+      selectors: {
+        [MS_HIGHCONTRAST_ACTIVE]: {
+          backgroundColor: 'Highlight',
+          color: 'HighlightText'
+        }
       }
     },
     rootPressed: {
       backgroundColor: ArrowButtonBackgroundPressed,
       color: ArrowButtonTextColorPressed,
-      [MS_HIGHCONTRAST_ACTIVE]: {
-        backgroundColor: 'Highlight',
-        color: 'HighlightText'
+      selectors: {
+        [MS_HIGHCONTRAST_ACTIVE]: {
+          backgroundColor: 'Highlight',
+          color: 'HighlightText'
+        }
       }
     },
     rootDisabled: {
       opacity: 0.5,
-      [MS_HIGHCONTRAST_ACTIVE]: {
-        color: 'GrayText',
-        opacity: 1,
+      selectors: {
+        [MS_HIGHCONTRAST_ACTIVE]: {
+          color: 'GrayText',
+          opacity: 1,
+        }
       }
     },
     icon: {
@@ -170,8 +178,10 @@ export const getStyles = memoizeFunction((
     labelDisabled: {
       cursor: 'default',
       color: SpinButtonTextColorDisabled,
-      [MS_HIGHCONTRAST_ACTIVE]: {
-        color: 'GrayText'
+      selectors: {
+        [MS_HIGHCONTRAST_ACTIVE]: {
+          color: 'GrayText'
+        }
       }
     },
     spinButtonWrapper: {
@@ -188,15 +198,19 @@ export const getStyles = memoizeFunction((
     spinButtonWrapperHovered: {
       borderColor: SpinButtonRootBorderColorHovered,
       outline: '2px dashed transparent',
-      [MS_HIGHCONTRAST_ACTIVE]: {
-        borderColor: 'Highlight'
+      selectors: {
+        [MS_HIGHCONTRAST_ACTIVE]: {
+          borderColor: 'Highlight'
+        }
       }
     },
     spinButtonWrapperFocused: {
       borderColor: SpinButtonRootBorderColorFocused,
       outline: '2px dashed transparent',
-      [MS_HIGHCONTRAST_ACTIVE]: {
-        borderColor: 'Highlight'
+      selectors: {
+        [MS_HIGHCONTRAST_ACTIVE]: {
+          borderColor: 'Highlight'
+        }
       }
     },
     spinButtonWrapperDisabled: _getDisabledStyles(theme),
@@ -228,10 +242,12 @@ export const getStyles = memoizeFunction((
     inputTextSelected: {
       backgroundColor: SpinButtonInputBackgroundColorSelected,
       color: SpinButtonInputTextColorSelected,
-      [MS_HIGHCONTRAST_ACTIVE]: {
-        backgroundColor: 'Highlight',
-        borderColor: 'Highlight',
-        color: 'HighlightText',
+      selectors: {
+        [MS_HIGHCONTRAST_ACTIVE]: {
+          backgroundColor: 'Highlight',
+          borderColor: 'Highlight',
+          color: 'HighlightText',
+        }
       }
     },
     inputDisabled: _getDisabledStyles(theme),

From 39356a1506acd66b52e2d647ec5910525fb88373 Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Thu, 12 Oct 2017 20:10:44 -0700
Subject: [PATCH 0847/1641] getColorFromString: insure callers handle undefined
 case (#3107)

* add null checking for color picker

* change file
---
 .../phkuo-colorPicker_2017-10-13-00-56.json        | 11 +++++++++++
 .../src/components/ColorPicker/ColorPicker.tsx     |  6 +++++-
 .../SwatchColorPicker/SwatchColorPicker.tsx        |  2 +-
 .../components/ThemeGenerator/ThemeGenerator.ts    |  5 ++++-
 .../ThemeGenerator/ThemeGeneratorPage.tsx          |  2 +-
 .../src/utilities/color/colors.ts                  | 14 ++++++++++----
 6 files changed, 32 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/phkuo-colorPicker_2017-10-13-00-56.json

diff --git a/common/changes/office-ui-fabric-react/phkuo-colorPicker_2017-10-13-00-56.json b/common/changes/office-ui-fabric-react/phkuo-colorPicker_2017-10-13-00-56.json
new file mode 100644
index 0000000000000..a2746172acd6d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/phkuo-colorPicker_2017-10-13-00-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Colors Utility: add error checking if an invalid string is given",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
index 70e4b3591e9ca..a9032fa7e8aa6 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
@@ -163,7 +163,11 @@ export class ColorPicker extends BaseComponent<IColorPickerProps, IColorPickerSt
     }));
   }
 
-  private _updateColor(newColor: IColor) {
+  private _updateColor(newColor?: IColor) {
+    if (!newColor) {
+      return;
+    }
+
     let { onColorChanged } = this.props;
 
     if (newColor.str !== this.state.color.str) {
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
index 3718284a76637..8cb15dfedd954 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
@@ -178,7 +178,7 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
   private _onRenderColorOption(colorOption: IColorCellProps): JSX.Element {
     // Build an SVG for the cell with the given shape and color properties
     return (
-      <svg className={ css(styles.svg, this.props.cellShape, this.props.cellShape === 'circle' ? styles.circle : '') } viewBox='0 0 20 20' fill={ getColorFromString(colorOption.color as string).str } >
+      <svg className={ css(styles.svg, this.props.cellShape, this.props.cellShape === 'circle' ? styles.circle : '') } viewBox='0 0 20 20' fill={ getColorFromString(colorOption.color as string)!.str } >
         {
           this.props.cellShape === 'circle' ?
             <circle cx='50%' cy='50%' r='50%' /> :
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts
index 711bb622439ea..231a8fb97006d 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts
@@ -36,7 +36,10 @@ export class ThemeGenerator {
     if (overwriteCustomColor) {
       let colorAsIColor: IColor;
       if (typeof color === 'string') {
-        colorAsIColor = getColorFromString(color);
+        colorAsIColor = getColorFromString(color)!; // the ! is a lie here but we'll verify it in the next line
+        if (!colorAsIColor) {
+          throw 'color is invalid in setSlot(): ' + color;
+        }
       } else {
         colorAsIColor = color;
       }
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
index 401bc6463506d..6ef5004f41625 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
@@ -297,7 +297,7 @@ export class ThemeGeneratorPage extends React.Component<any, IThemeGeneratorPage
 
       let { themeRules } = this.state;
       const bgColor = getHexFromColor(response.color.dominantColorBackground, true);
-      const bgColorIsDark = isDark(getColorFromString(bgColor));
+      const bgColorIsDark = isDark(getColorFromString(bgColor)!);
       ThemeGenerator.setSlot(
         themeRules[BaseSlots[BaseSlots.backgroundColor]],
         bgColor,
diff --git a/packages/office-ui-fabric-react/src/utilities/color/colors.ts b/packages/office-ui-fabric-react/src/utilities/color/colors.ts
index 7e8a86003531f..3ae8159acb0cf 100644
--- a/packages/office-ui-fabric-react/src/utilities/color/colors.ts
+++ b/packages/office-ui-fabric-react/src/utilities/color/colors.ts
@@ -24,7 +24,7 @@ export interface IColor extends IRGB, IHSV {
   str: string;
 }
 
-export function cssColor(color: string): IRGB {
+export function cssColor(color: string): IRGB | undefined {
   return (_named(color)
     || _hex3(color)
     || _hex6(color)
@@ -155,8 +155,14 @@ export function hsv2rgb(h: number, s: number, v: number): IRGB {
   };
 }
 
-export function getColorFromString(color: string): IColor {
-  let { a, b, g, r } = cssColor(color);
+export function getColorFromString(inputColor: string): IColor | undefined {
+  let color = cssColor(inputColor);
+
+  if (!color) {
+    return;
+  }
+
+  let { a, b, g, r } = color;
   let { h, s, v } = rgb2hsv(r, g, b);
 
   return {
@@ -167,7 +173,7 @@ export function getColorFromString(color: string): IColor {
     hex: rgb2hex(r, g, b),
     r: r,
     s: s,
-    str: color,
+    str: inputColor,
     v: v
   };
 }

From 1cee8f5cd22d0287d8a9c1235fdc6d63aa6b8d4e Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 12 Oct 2017 20:50:41 -0700
Subject: [PATCH 0848/1641] Unbreaking the build, which was caused by too many
 merges at once. (#3111)

---
 packages/merge-styles/src/mergeStyles.test.ts |  4 ++++
 .../merge-styles/src/styleToClassName.test.ts | 20 +++++++++++++++++++
 .../components/ComboBox/ComboBox.styles.ts    |  2 +-
 .../__snapshots__/ComboBox.test.tsx.snap      |  9 +++++++--
 4 files changed, 32 insertions(+), 3 deletions(-)

diff --git a/packages/merge-styles/src/mergeStyles.test.ts b/packages/merge-styles/src/mergeStyles.test.ts
index 39a19e4329d10..3e205f1dc5d17 100644
--- a/packages/merge-styles/src/mergeStyles.test.ts
+++ b/packages/merge-styles/src/mergeStyles.test.ts
@@ -21,6 +21,10 @@ describe('mergeStyles', () => {
     expect(mergeStyles(['a', 'b', 'c'], false, null, undefined)).toEqual('a b c');
   });
 
+  it('can join an object and style', () => {
+    expect(mergeStyles('foo', { color: 'white' })).toEqual('foo css-0');
+  });
+
   it('can mix styles and classnames together', () => {
     expect(mergeStyles('foo', { background: 'red' })).toEqual('foo css-0');
     expect(_stylesheet.getRules()).toEqual('.css-0{background:red;}');
diff --git a/packages/merge-styles/src/styleToClassName.test.ts b/packages/merge-styles/src/styleToClassName.test.ts
index 1ecb25d858607..afe0cb405dd25 100644
--- a/packages/merge-styles/src/styleToClassName.test.ts
+++ b/packages/merge-styles/src/styleToClassName.test.ts
@@ -33,6 +33,26 @@ describe('styleToClassName', () => {
     expect(_stylesheet.getRules()).toEqual('.css-0{background:red;}.css-1{background:green;}');
   });
 
+  it('can have child selectors', () => {
+    styleToClassName({
+      selectors: {
+        '.foo': { background: 'red' }
+      }
+    });
+
+    expect(_stylesheet.getRules()).toEqual('.css-0 .foo{background:red;}');
+  });
+
+  it('can have same element class selectors', () => {
+    styleToClassName({
+      selectors: {
+        '&.foo': [{ background: 'red' }]
+      }
+    });
+
+    expect(_stylesheet.getRules()).toEqual('.css-0.foo{background:red;}');
+  });
+
   it('can register pseudo selectors', () => {
     const className = styleToClassName({
       selectors: {
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index 7164b95572016..b23a2f59ea402 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -228,7 +228,7 @@ export const getStyles = memoizeFunction((
         textOverflow: 'ellipsis',
         boxSizing: 'content-box',
         selectors: {
-          ' .ms-Label': {
+          '.ms-Label': {
             display: 'inline-block',
             marginBottom: '8px',
           }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
index 9bcf541bbb886..bba161287975b 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
@@ -45,7 +45,7 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
         &:hover {
           border-color: #0078d7;
         }
-        @media screen and (-ms-high-contrast: active) & {
+        @media screen and (-ms-high-contrast: active){&:hover {
           -ms-high-contrast-adjust: none;
           border-color: Highlight;
           color: HighlightText;
@@ -110,7 +110,6 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
           {
             -moz-osx-font-smoothing: grayscale;
             -webkit-font-smoothing: antialiased;
-            @media screen and (-ms-high-contrast:  active) &:[object Object];
             background-color: transparent;
             border-radius: 0px;
             border: 1px solid transparent;
@@ -149,6 +148,12 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
             top: 0px;
             z-index: 1;
           }
+          @media screen and (-ms-high-contrast: active){& {
+            -ms-high-contrast-adjust: none;
+            background-color: ButtonFace;
+            border-color: ButtonText;
+            color: ButtonText;
+          }
           &:hover {
             background-color: #dadada;
             color: #004578;

From 17ab210b8be470cd2152fb060ca4cc754f1095ad Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 13 Oct 2017 04:00:17 +0000
Subject: [PATCH 0849/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...ng-merge-styles-attr_2017-10-12-23-36.json | 11 ----------
 .../media-queries_2017-10-13-02-10.json       | 11 ----------
 .../phkuo-colorPicker_2017-10-13-00-56.json   | 11 ----------
 packages/merge-styles/CHANGELOG.json          | 21 +++++++++++++++++++
 packages/merge-styles/CHANGELOG.md            | 13 +++++++++++-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 +++++++-
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/package.json                 |  2 +-
 scripts/package.json                          |  2 +-
 16 files changed, 70 insertions(+), 45 deletions(-)
 delete mode 100644 common/changes/@uifabric/merge-styles/adding-merge-styles-attr_2017-10-12-23-36.json
 delete mode 100644 common/changes/@uifabric/merge-styles/media-queries_2017-10-13-02-10.json
 delete mode 100644 common/changes/office-ui-fabric-react/phkuo-colorPicker_2017-10-13-00-56.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index b5bbb016ef0a1..605a6a9b8425a 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.1.1 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.8.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.8.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 10b4504cc1862..3595085b1a822 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.8.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.8.2 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 725a508eba843..2b1263d4e18b9 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.8.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.8.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 5798aea1839ac..db98b997b83f2 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.8.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.8.2 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 8f6254752fe9e..40f921c8686b3 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.8.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.8.2 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/merge-styles/adding-merge-styles-attr_2017-10-12-23-36.json b/common/changes/@uifabric/merge-styles/adding-merge-styles-attr_2017-10-12-23-36.json
deleted file mode 100644
index a9cfc523d8fb7..0000000000000
--- a/common/changes/@uifabric/merge-styles/adding-merge-styles-attr_2017-10-12-23-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "Adding data-merge-styles attribute to the style element so that it can be uniquely identified.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/media-queries_2017-10-13-02-10.json b/common/changes/@uifabric/merge-styles/media-queries_2017-10-13-02-10.json
deleted file mode 100644
index 31e23474faeb6..0000000000000
--- a/common/changes/@uifabric/merge-styles/media-queries_2017-10-13-02-10.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "Fixes to support media queries.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/phkuo-colorPicker_2017-10-13-00-56.json b/common/changes/office-ui-fabric-react/phkuo-colorPicker_2017-10-13-00-56.json
deleted file mode 100644
index a2746172acd6d..0000000000000
--- a/common/changes/office-ui-fabric-react/phkuo-colorPicker_2017-10-13-00-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Colors Utility: add error checking if an invalid string is given",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index 5fee8157a51b1..ac5f57a55faaa 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,27 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.4.0",
+      "tag": "@uifabric/merge-styles_v5.4.0",
+      "date": "Fri, 13 Oct 2017 04:00:17 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "2b318265a85acf7d858bcd5b161641e6c2d7c07a",
+            "comment": "Adding data-merge-styles attribute to the style element so that it can be uniquely identified."
+          }
+        ],
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "2b318265a85acf7d858bcd5b161641e6c2d7c07a",
+            "comment": "Fixes to support media queries."
+          }
+        ]
+      }
+    },
     {
       "version": "5.3.3",
       "tag": "@uifabric/merge-styles_v5.3.3",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index 6d50d687cf120..32ebac3e2a2be 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Fri, 13 Oct 2017 01:36:02 GMT and should not be manually modified.
+This log was last generated on Fri, 13 Oct 2017 04:00:17 GMT and should not be manually modified.
+
+## 5.4.0
+Fri, 13 Oct 2017 04:00:17 GMT
+
+### Minor changes
+
+- Fixes to support media queries.
+
+### Patches
+
+- Adding data-merge-styles attribute to the style element so that it can be uniquely identified.
 
 ## 5.3.3
 Fri, 13 Oct 2017 01:36:02 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index a563d50c82235..6ab41bf001f23 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.3.3",
+  "version": "5.4.0",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 6cbeb7c3afd14..5a522cfc534f1 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.8.2",
+      "tag": "office-ui-fabric-react_v5.8.2",
+      "date": "Fri, 13 Oct 2017 04:00:17 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "39356a1506acd66b52e2d647ec5910525fb88373",
+            "comment": "Colors Utility: add error checking if an invalid string is given"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.3.3 <6.0.0` to `>=5.4.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.8.1",
       "tag": "office-ui-fabric-react_v5.8.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 9ce141d56ce9e..57f37f00cd44c 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 13 Oct 2017 01:36:02 GMT and should not be manually modified.
+This log was last generated on Fri, 13 Oct 2017 04:00:17 GMT and should not be manually modified.
+
+## 5.8.2
+Fri, 13 Oct 2017 04:00:17 GMT
+
+### Patches
+
+- Colors Utility: add error checking if an invalid string is given
 
 ## 5.8.1
 Fri, 13 Oct 2017 01:36:02 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 57216a1eee110..884718550c09b 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.8.1",
+  "version": "5.8.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.1.1 <6.0.0",
-    "@uifabric/merge-styles": ">=5.3.3 <6.0.0",
+    "@uifabric/merge-styles": ">=5.4.0 <6.0.0",
     "@uifabric/styling": ">=5.3.0 <6.0.0",
     "@uifabric/utilities": ">=5.2.1 <6.0.0",
     "prop-types": "^15.5.10",
diff --git a/packages/styling/package.json b/packages/styling/package.json
index f146b08e14ed8..5840a1a051963 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -21,7 +21,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/utilities": ">=5.2.1 <6.0.0",
-    "@uifabric/merge-styles": ">=5.3.3 <6.0.0",
+    "@uifabric/merge-styles": ">=5.4.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/scripts/package.json b/scripts/package.json
index 23c2935cedc52..c3634a37d328f 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -10,7 +10,7 @@
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.7.5",
     "@microsoft/loader-load-themed-styles": "^1.6.0",
-    "@uifabric/merge-styles": ">=5.3.3 <6.0.0",
+    "@uifabric/merge-styles": ">=5.4.0 <6.0.0",
     "autoprefixer": "^7.1.5",
     "awesome-typescript-loader": "^3.2.3",
     "bundlesize": "^0.15.2",

From 2160f2eb3f73deb473b879273030ed2b737d63a0 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 13 Oct 2017 11:38:14 -0700
Subject: [PATCH 0850/1641] Icon fix (#3117)

* Ugh. IconNames should not produce javascript.

* Adding change file.
---
 .../@uifabric/icons/icon-fix_2017-10-13-18-37.json    | 11 +++++++++++
 packages/icons/tsconfig.json                          |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/icons/icon-fix_2017-10-13-18-37.json

diff --git a/common/changes/@uifabric/icons/icon-fix_2017-10-13-18-37.json b/common/changes/@uifabric/icons/icon-fix_2017-10-13-18-37.json
new file mode 100644
index 0000000000000..9b82a819c9ccc
--- /dev/null
+++ b/common/changes/@uifabric/icons/icon-fix_2017-10-13-18-37.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/icons",
+      "comment": "IconNames should not produce javascript.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/icons",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/icons/tsconfig.json b/packages/icons/tsconfig.json
index 0942199fbd053..557f7a5e7df28 100644
--- a/packages/icons/tsconfig.json
+++ b/packages/icons/tsconfig.json
@@ -14,7 +14,7 @@
     "strict": true,
     "forceConsistentCasingInFileNames": true,
     "moduleResolution": "node",
-    "preserveConstEnums": true,
+    "preserveConstEnums": false,
     "types": []
   },
   "include": [

From b35b710922dd722401819078fbd39b4a01443130 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 13 Oct 2017 21:59:12 +0000
Subject: [PATCH 0851/1641] Applying package updates.

---
 apps/fabric-website/package.json                   |  2 +-
 apps/ssr-tests/package.json                        |  2 +-
 .../@uifabric/icons/icon-fix_2017-10-13-18-37.json | 11 -----------
 packages/experiments/package.json                  |  4 ++--
 packages/icons/CHANGELOG.json                      | 14 ++++++++++++++
 packages/icons/CHANGELOG.md                        |  9 ++++++++-
 packages/icons/package.json                        |  2 +-
 packages/office-ui-fabric-react/package.json       |  2 +-
 8 files changed, 28 insertions(+), 18 deletions(-)
 delete mode 100644 common/changes/@uifabric/icons/icon-fix_2017-10-13-18-37.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 605a6a9b8425a..d1047f8b31f58 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -42,7 +42,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/icons": ">=5.1.1 <6.0.0",
+    "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
     "office-ui-fabric-react": ">=5.8.2 <6.0.0",
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 3595085b1a822..85257f8fd3316 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -17,7 +17,7 @@
   "license": "MIT",
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.5.1",
-    "@uifabric/icons": ">=5.1.1 <6.0.0",
+    "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.8",
     "@types/es6-promise": "^0.0.32",
diff --git a/common/changes/@uifabric/icons/icon-fix_2017-10-13-18-37.json b/common/changes/@uifabric/icons/icon-fix_2017-10-13-18-37.json
deleted file mode 100644
index 9b82a819c9ccc..0000000000000
--- a/common/changes/@uifabric/icons/icon-fix_2017-10-13-18-37.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/icons",
-      "comment": "IconNames should not produce javascript.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/icons",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index fc8b5fbca2037..49b1b50862f7c 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -29,7 +29,7 @@
     "@types/enzyme": "^2.8.8",
     "@types/webpack-env": "1.13.0",
     "@uifabric/example-app-base": ">=5.1.1 <6.0.0",
-    "@uifabric/icons": ">=5.1.1 <6.0.0",
+    "@uifabric/icons": ">=5.2.0 <6.0.0",
     "es6-weak-map": "^2.0.2",
     "enzyme": "^2.9.1",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
@@ -43,7 +43,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "office-ui-fabric-react": ">=5.8.1 <6.0.0",
-    "@uifabric/icons": ">=5.1.1 <6.0.0",
+    "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/icons/CHANGELOG.json b/packages/icons/CHANGELOG.json
index 0bb61aa7fa4d2..89a1bb16cceff 100644
--- a/packages/icons/CHANGELOG.json
+++ b/packages/icons/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/icons",
   "entries": [
+    {
+      "version": "5.2.0",
+      "tag": "@uifabric/icons_v5.2.0",
+      "date": "Fri, 13 Oct 2017 21:59:12 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "2160f2eb3f73deb473b879273030ed2b737d63a0",
+            "comment": "IconNames should not produce javascript."
+          }
+        ]
+      }
+    },
     {
       "version": "5.1.1",
       "tag": "@uifabric/icons_v5.1.1",
diff --git a/packages/icons/CHANGELOG.md b/packages/icons/CHANGELOG.md
index 8197e89fd7723..6009ce5e7b08b 100644
--- a/packages/icons/CHANGELOG.md
+++ b/packages/icons/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/icons
 
-This log was last generated on Fri, 06 Oct 2017 10:18:41 GMT and should not be manually modified.
+This log was last generated on Fri, 13 Oct 2017 21:59:12 GMT and should not be manually modified.
+
+## 5.2.0
+Fri, 13 Oct 2017 21:59:12 GMT
+
+### Minor changes
+
+- IconNames should not produce javascript.
 
 ## 5.1.1
 Fri, 06 Oct 2017 10:18:41 GMT
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 521d9226fdcd7..cc5d073ef98d7 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/icons",
-  "version": "5.1.1",
+  "version": "5.2.0",
   "description": "Office UI Fabric icon set.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 884718550c09b..5f8bf9b286921 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/icons": ">=5.1.1 <6.0.0",
+    "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.4.0 <6.0.0",
     "@uifabric/styling": ">=5.3.0 <6.0.0",
     "@uifabric/utilities": ">=5.2.1 <6.0.0",

From b4f7b0fac2d6d1d6f668cda3c296fb68851c09b7 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Fri, 13 Oct 2017 15:07:16 -0700
Subject: [PATCH 0852/1641] Slider: Fix rounding issue (#3114)

* Fix Slider rounding

* Change file
---
 .../fix-slider-rounding_2017-10-13-17-25.json         | 11 +++++++++++
 .../src/components/Slider/Slider.tsx                  |  8 ++++++--
 2 files changed, 17 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-slider-rounding_2017-10-13-17-25.json

diff --git a/common/changes/office-ui-fabric-react/fix-slider-rounding_2017-10-13-17-25.json b/common/changes/office-ui-fabric-react/fix-slider-rounding_2017-10-13-17-25.json
new file mode 100644
index 0000000000000..2e0c779d20b39
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-slider-rounding_2017-10-13-17-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix rounding issue in Slider when step is less than 1",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "a.erich@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
index 4bb4a191da8f6..ab6faa86ae77d 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
@@ -240,10 +240,14 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     return currentPosition;
   }
   private _updateValue(value: number, renderedValue: number) {
-    let valueChanged = value !== this.state.value;
+    let interval: number = 1.0 / this.props.step!;
+    // Make sure value has correct number of decimal places based on steps without JS's floating point issues
+    let roundedValue: number = Math.round(value * interval) / interval;
+
+    let valueChanged = roundedValue !== this.state.value;
 
     this.setState({
-      value,
+      value: roundedValue,
       renderedValue
     }, () => {
       if (valueChanged && this.props.onChange) {

From 8e5a33aca736718ff5a8b5b22606d51809c222fe Mon Sep 17 00:00:00 2001
From: Yana Bernadskaya <yabern@microsoft.com>
Date: Fri, 13 Oct 2017 15:57:48 -0700
Subject: [PATCH 0853/1641] Date picker week numbers settings (#3001)

* Calculating week numbers based on passed settings

* Adding change file

* Updating doule quotes back to single quotes

* Cleanup calendar file

* DateMath cleanup

* Final touch

cleaning up after JS Beautifier

* all tests passed

* Savingt o try different approach

* I gave up

* cleanup

* blank line cleanup

* Updating to pass only last day of week for each week

* tests failing ts compile

* updating tests

* unused

* updating props description

* adding test card

* yarn goes

* rearranging functions

* tests
---
 ...rWeekNumbersSettings_2017-10-02-20-35.json |  11 ++
 package.json                                  |   5 +-
 .../src/components/Calendar/Calendar.Props.ts |  11 +-
 .../src/components/Calendar/Calendar.tsx      |   4 +-
 .../src/components/Calendar/CalendarDay.tsx   |  31 +---
 .../components/DatePicker/DatePicker.Props.ts |   8 +
 .../src/components/DatePicker/DatePicker.tsx  |   3 +
 .../components/DatePicker/DatePickerPage.tsx  |   5 +
 .../DatePicker.WeekNumbers.Example.tsx        | 128 ++++++++++++++++
 .../src/utilities/dateMath/DateMath.test.ts   | 120 +++++++++++++++
 .../src/utilities/dateMath/DateMath.ts        | 144 +++++++++++++++---
 .../src/utilities/dateValues/DateValues.ts    |  29 +++-
 .../src/utilities/dateValues/TimeConstants.ts |  15 ++
 13 files changed, 467 insertions(+), 47 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/datePickerWeekNumbersSettings_2017-10-02-20-35.json
 create mode 100644 packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.WeekNumbers.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/utilities/dateValues/TimeConstants.ts

diff --git a/common/changes/office-ui-fabric-react/datePickerWeekNumbersSettings_2017-10-02-20-35.json b/common/changes/office-ui-fabric-react/datePickerWeekNumbersSettings_2017-10-02-20-35.json
new file mode 100644
index 0000000000000..44f18bc6145bc
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/datePickerWeekNumbersSettings_2017-10-02-20-35.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DatePicker getWeekNumbers function accepts firstWeekOfYear settings",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "yabern@microsoft.com"
+}
\ No newline at end of file
diff --git a/package.json b/package.json
index 2eb83d0eb79df..f7151692d291a 100644
--- a/package.json
+++ b/package.json
@@ -26,5 +26,8 @@
   "license": "MIT",
   "devDependencies": {
     "@microsoft/rush": "3.0.12"
+  },
+  "dependencies": {
+    "gulp": "^3.9.1"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
index 6cbab471eaefc..e6102c248b1f9 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
@@ -1,8 +1,8 @@
 import * as React from 'react';
 import { Calendar } from './Calendar';
-import { DayOfWeek, DateRangeType } from '../../utilities/dateValues/DateValues';
+import { DayOfWeek, FirstWeekOfYear, DateRangeType } from '../../utilities/dateValues/DateValues';
 
-export { DayOfWeek, DateRangeType };
+export { DayOfWeek, DateRangeType, FirstWeekOfYear };
 
 export interface ICalendar {
   /** Sets focus to the selected date. */
@@ -111,6 +111,13 @@ export interface ICalendarProps extends React.Props<Calendar> {
   */
   showWeekNumbers?: boolean;
 
+  /**
+  * Defines when the first week of the year should start, FirstWeekOfYear.FirstDay,
+  * FirstWeekOfYear.FirstFullWeek or FirstWeekOfYear.FirstFourDayWeek are the possible values
+  * @defaultvalue FirstWeekOfYear.FirstDay
+  */
+  firstWeekOfYear?: FirstWeekOfYear;
+
   /**
   * Apply additional formating to dates, for example localized date formatting.
   */
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index 11d6f7a676566..b9db14a1468dd 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { ICalendar, ICalendarProps, ICalendarStrings, ICalendarIconStrings, ICalendarFormatDateCallbacks } from './Calendar.Props';
-import { DayOfWeek, DateRangeType } from '../../utilities/dateValues/DateValues';
+import { DayOfWeek, FirstWeekOfYear, DateRangeType } from '../../utilities/dateValues/DateValues';
 import { CalendarDay } from './CalendarDay';
 import { CalendarMonth } from './CalendarMonth';
 import { compareDates, getDateRangeArray } from '../../utilities/dateMath/DateMath';
@@ -58,6 +58,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     highlightCurrentMonth: false,
     navigationIcons: iconStrings,
     showWeekNumbers: false,
+    firstWeekOfYear: FirstWeekOfYear.FirstDay,
     dateTimeFormatter: dateTimeFormatterCallbacks
   };
 
@@ -153,6 +154,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   onHeaderSelect={ onHeaderSelect }
                   navigationIcons={ navigationIcons! }
                   showWeekNumbers={ this.props.showWeekNumbers }
+                  firstWeekOfYear={ this.props.firstWeekOfYear! }
                   dateTimeFormatter={ this.props.dateTimeFormatter! }
                   ref='dayPicker'
                 />
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index 10d75e0cd2241..ffe300037e2fd 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -9,7 +9,7 @@ import {
   getRTLSafeKeyCode
 } from '../../Utilities';
 import { ICalendarStrings, ICalendarIconStrings, ICalendarFormatDateCallbacks } from './Calendar.Props';
-import { DayOfWeek, DateRangeType } from '../../utilities/dateValues/DateValues';
+import { DayOfWeek, MonthOfYear, FirstWeekOfYear, DateRangeType } from '../../utilities/dateValues/DateValues';
 import { FocusZone } from '../../FocusZone';
 import { Icon } from '../../Icon';
 import {
@@ -20,8 +20,10 @@ import {
   compareDatePart,
   getDateRangeArray,
   isInDateRangeArray,
-  getWeekNumber
+  getWeekNumber,
+  getWeekNumbersInMonth
 } from '../../utilities/dateMath/DateMath';
+import TimeConstants from '../../utilities/dateValues/TimeConstants';
 
 import * as stylesImport from './Calendar.scss';
 const styles: any = stylesImport;
@@ -53,6 +55,7 @@ export interface ICalendarDayProps extends React.Props<CalendarDay> {
   today?: Date;
   onHeaderSelect?: (focus: boolean) => void;
   showWeekNumbers?: boolean;
+  firstWeekOfYear: FirstWeekOfYear;
   dateTimeFormatter: ICalendarFormatDateCallbacks;
 }
 
@@ -91,13 +94,13 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
 
   public render() {
     let { activeDescendantId, weeks } = this.state;
-    let { firstDayOfWeek, strings, navigatedDate, selectedDate, dateRangeType, navigationIcons, showWeekNumbers, dateTimeFormatter } = this.props;
+    let { firstDayOfWeek, strings, navigatedDate, selectedDate, dateRangeType, navigationIcons, showWeekNumbers, firstWeekOfYear, dateTimeFormatter } = this.props;
     let dayPickerId = getId('DatePickerDay-dayPicker');
     let monthAndYearId = getId('DatePickerDay-monthAndYear');
     let leftNavigationIcon = navigationIcons.leftNavigation;
     let rightNavigationIcon = navigationIcons.rightNavigation;
-    let weekNumbers = showWeekNumbers ? this._getWeekNumbersInMonth(weeks!.length, firstDayOfWeek, navigatedDate) : null;
-    let selectedDateWeekNumber = showWeekNumbers ? getWeekNumber(selectedDate, firstDayOfWeek) : undefined;
+    let weekNumbers = showWeekNumbers ? getWeekNumbersInMonth(weeks!.length, firstDayOfWeek, firstWeekOfYear, navigatedDate) : null;
+    let selectedDateWeekNumber = showWeekNumbers ? getWeekNumber(selectedDate, firstDayOfWeek, firstWeekOfYear) : undefined;
 
     // When the month is highlighted get the corner dates so that styles can be added to them
     let weekCorners: IWeekCorners = {};
@@ -105,7 +108,6 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
       // navigatedDate is on the current month and current year
       weekCorners = this._getWeekCornerStyles(weeks!);
     }
-
     return (
       <div
         className={ css('ms-DatePicker-dayPicker',
@@ -318,7 +320,6 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
         if (cornerIndexes[cornersLength - 1] !== lastDayIndex) {
           weekCornersStyled[(weekIndex - 1) + '_' + lastDayIndex] = rightCornerStyle;
         }
-
       }
     }
   }
@@ -493,20 +494,4 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
 
     return weeks;
   }
-
-  // Returns the week numbers for each week in a month.  Week numbers are 1 - 52 (53) in a year
-  private _getWeekNumbersInMonth(weeksInMonth: number, firstDayOfWeek: DayOfWeek, navigatedDate: Date) {
-    let selectedYear = navigatedDate.getFullYear();
-    let selectedMonth = navigatedDate.getMonth();
-    let firstDayOfMonth = new Date(selectedYear, selectedMonth, 1);
-
-    let firstWeekNumber = getWeekNumber(firstDayOfMonth, firstDayOfWeek);
-
-    let weeksArray = [];
-    for (let i = 0; i < weeksInMonth; i++) {
-      weeksArray.push(firstWeekNumber + i);
-    }
-
-    return weeksArray;
-  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
index d78567003d0d5..765147124206d 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { DatePicker } from './DatePicker';
 import { DayOfWeek } from '../../Calendar';
+import { FirstWeekOfYear } from '../../utilities/dateValues/DateValues';
 import { ICalendarFormatDateCallbacks } from '../Calendar/Calendar.Props';
 
 export interface IDatePicker {
@@ -116,6 +117,13 @@ export interface IDatePickerProps extends React.Props<DatePicker> {
   */
   showWeekNumbers?: boolean;
 
+  /**
+  * Defines when the first week of the year should start, FirstWeekOfYear.FirstDay,
+  * FirstWeekOfYear.FirstFullWeek or FirstWeekOfYear.FirstFourDayWeek are the possible values
+  * @defaultvalue FirstWeekOfYear.FirstFullWeek
+  */
+  firstWeekOfYear?: FirstWeekOfYear;
+
   /**
    * Whether the "Go to today" link should be shown or not
    */
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 80dd8949bef7f..979d36b627acc 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -7,6 +7,7 @@ import {
   Calendar,
   DayOfWeek
 } from '../../Calendar';
+import { FirstWeekOfYear } from '../../utilities/dateValues/DateValues';
 import { Callout } from '../../Callout';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { TextField } from '../../TextField';
@@ -114,6 +115,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     borderless: false,
     pickerAriaLabel: 'Calender',
     showWeekNumbers: false,
+    firstWeekOfYear: FirstWeekOfYear.FirstDay,
     showGoToToday: true,
     dateTimeFormatter: undefined
   };
@@ -238,6 +240,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
               strings={ strings! }
               highlightCurrentMonth={ this.props.highlightCurrentMonth }
               showWeekNumbers={ this.props.showWeekNumbers }
+              firstWeekOfYear={ this.props.firstWeekOfYear }
               showGoToToday={ this.props.showGoToToday }
               dateTimeFormatter={ this.props.dateTimeFormatter }
               ref={ this._resolveRef('_calendar') }
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
index bfaf3c990d5ba..99d9dc1bb94a8 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
@@ -6,12 +6,14 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { DatePickerBasicExample } from './examples/DatePicker.Basic.Example';
+import { DatePickerWeekNumbersExample } from './examples/DatePicker.WeekNumbers.Example';
 import { DatePickerRequiredExample } from './examples/DatePicker.Required.Example';
 import { DatePickerInputExample } from './examples/DatePicker.Input.Example';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { DatePickerStatus } from './DatePicker.checklist';
 
 const DatePickerBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx') as string;
+const DatePickerWeekNumbersExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.WeekNumbers.Example.tsx') as string;
 const DatePickerRequiredExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Required.Example.tsx') as string;
 const DatePickerInputExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx') as string;
 
@@ -26,6 +28,9 @@ export class DatePickerPage extends React.Component<IComponentDemoPageProps, {}>
             <ExampleCard title='Default DatePicker' code={ DatePickerBasicExampleCode }>
               <DatePickerBasicExample />
             </ExampleCard>
+            <ExampleCard title='DatePicker with week numbers' code={ DatePickerWeekNumbersExampleCode }>
+              <DatePickerWeekNumbersExample />
+            </ExampleCard>
             <ExampleCard title='DatePicker with required field' code={ DatePickerRequiredExampleCode }>
               <DatePickerRequiredExample />
             </ExampleCard>
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.WeekNumbers.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.WeekNumbers.Example.tsx
new file mode 100644
index 0000000000000..8afa7a88e106d
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.WeekNumbers.Example.tsx
@@ -0,0 +1,128 @@
+import * as React from 'react';
+import { autobind } from '../../../Utilities';
+import { Dropdown, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
+import { DatePicker, DayOfWeek, IDatePickerStrings } from 'office-ui-fabric-react/lib/DatePicker';
+
+const DayPickerStrings: IDatePickerStrings = {
+  months: [
+    'January',
+    'February',
+    'March',
+    'April',
+    'May',
+    'June',
+    'July',
+    'August',
+    'September',
+    'October',
+    'November',
+    'December'
+  ],
+
+  shortMonths: [
+    'Jan',
+    'Feb',
+    'Mar',
+    'Apr',
+    'May',
+    'Jun',
+    'Jul',
+    'Aug',
+    'Sep',
+    'Oct',
+    'Nov',
+    'Dec'
+  ],
+
+  days: [
+    'Sunday',
+    'Monday',
+    'Tuesday',
+    'Wednesday',
+    'Thursday',
+    'Friday',
+    'Saturday'
+  ],
+
+  shortDays: [
+    'S',
+    'M',
+    'T',
+    'W',
+    'T',
+    'F',
+    'S'
+  ],
+
+  goToToday: 'Go to today',
+  prevMonthAriaLabel: 'Go to previous month',
+  nextMonthAriaLabel: 'Go to next month',
+  prevYearAriaLabel: 'Go to previous year',
+  nextYearAriaLabel: 'Go to next year'
+};
+
+export interface IDatePickerBasicExampleState {
+  firstDayOfWeek?: DayOfWeek;
+}
+
+export class DatePickerWeekNumbersExample extends React.Component<any, IDatePickerBasicExampleState> {
+  public constructor() {
+    super();
+
+    this.state = {
+      firstDayOfWeek: DayOfWeek.Monday
+    };
+  }
+
+  public render() {
+    let { firstDayOfWeek } = this.state;
+
+    return (
+      <div>
+        <DatePicker firstDayOfWeek={ firstDayOfWeek } strings={ DayPickerStrings } showWeekNumbers={ true } firstWeekOfYear={ 1 } showMonthPickerAsOverlay={ true } placeholder='Select a date...' />
+        <Dropdown
+          label='Select the first day of the week'
+          options={ [
+            {
+              text: 'Sunday',
+              key: DayOfWeek[DayOfWeek.Sunday]
+            },
+            {
+              text: 'Monday',
+              key: DayOfWeek[DayOfWeek.Monday]
+            },
+            {
+              text: 'Tuesday',
+              key: DayOfWeek[DayOfWeek.Tuesday]
+            },
+            {
+              text: 'Wednesday',
+              key: DayOfWeek[DayOfWeek.Wednesday]
+            },
+            {
+              text: 'Thursday',
+              key: DayOfWeek[DayOfWeek.Thursday]
+            },
+            {
+              text: 'Friday',
+              key: DayOfWeek[DayOfWeek.Friday]
+            },
+            {
+              text: 'Saturday',
+              key: DayOfWeek[DayOfWeek.Saturday]
+            }
+          ] }
+          selectedKey={ DayOfWeek[firstDayOfWeek!] }
+          onChanged={ this._onDropdownChanged }
+        />
+      </div>
+    );
+  }
+
+  @autobind
+  private _onDropdownChanged(option: IDropdownOption) {
+    this.setState({
+      firstDayOfWeek: (DayOfWeek as any)[option.key]
+    });
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts
index c6563b10b42d8..f0a6ad38103e1 100644
--- a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts
+++ b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts
@@ -291,4 +291,124 @@ describe('DateMath', () => {
     dateRangeArray = DateMath.getDateRangeArray(date, DateRangeType.Week, DayOfWeek.Tuesday);
     Array(7).forEach((val, i) => expect(DateMath.compareDates(dateRangeArray[i], date)).toBe(true));
   });
+
+  // Generating week numbers array per month
+  it('can calculate week numbers from selected date', () => {
+    // firstDayOfWeek is Monday, firstWeekOfYear is firstFullWeek
+    let date = new Date(2017, 0, 4);
+    let result = DateMath.getWeekNumbersInMonth(6, 1, 1, date);
+    let expected = 52;
+    expect(result[0]).toEqual(expected);
+
+    // firstDayOfWeek is Sunday, firstWeekOfYear is firstFullWeek
+    date = new Date(2000, 11, 31);
+    result = DateMath.getWeekNumbersInMonth(6, 0, 1, date);
+    expected = 53;
+    expect(result[5]).toEqual(expected);
+
+    // firstDayOfWeek is Sunday, firstWeekOfYear is firstFullWeek
+    date = new Date(2010, 0, 1);
+    result = DateMath.getWeekNumbersInMonth(6, 0, 1, date);
+    expected = 52;
+    expect(result[0]).toEqual(expected);
+
+    // firstDayOfWeek is Sunday, firstWeekOfYear is firstFourDayWeek
+    date = new Date(2018, 11, 31);
+    result = DateMath.getWeekNumbersInMonth(6, 0, 2, date);
+    expected = 1;
+    expect(result[5]).toEqual(expected);
+  });
+
+  // First week of year set to FirstWeekOfYear.FirstDay
+  it('can calculate week numbers - option 0', () => {
+    // firstDayOfWeek is Sunday
+    let date1 = new Date(2018, 0, 1);
+    let result = DateMath.getWeekNumber(date1, 0, 0);
+    let expected = 1;
+    expect(result).toEqual(expected);
+
+    // firstDayOfWeek is Sunday
+    date1 = new Date(2010, 0, 1);
+    result = DateMath.getWeekNumber(date1, 0, 0);
+    expected = 1;
+    expect(result).toEqual(expected);
+
+    // firstDayOfWeek is Sunday
+    date1 = new Date(2019, 0, 1);
+    result = DateMath.getWeekNumber(date1, 0, 0);
+    expected = 1;
+    expect(result).toEqual(expected);
+
+    // firstDayOfWeek is Monday
+    date1 = new Date(2010, 11, 31);
+    result = DateMath.getWeekNumber(date1, 1, 0);
+    expected = 53;
+    expect(result).toEqual(expected);
+  });
+
+  // First week of year set to FirstWeekOfYear.FirstFullWeek
+  it('can calculate week numbers - option 1', () => {
+    // firstDayOfWeek is Sunday
+    let date1 = new Date(2018, 0, 1);
+    let result = DateMath.getWeekNumber(date1, 0, 1);
+    let expected = 53;
+    expect(result).toEqual(expected);
+
+    // firstDayOfWeek is Sunday
+    date1 = new Date(2017, 11, 31);
+    result = DateMath.getWeekNumber(date1, 0, 1);
+    expected = 53;
+    expect(result).toEqual(expected);
+
+    // firstDayOfWeek is Sunday
+    date1 = new Date(2010, 11, 31);
+    result = DateMath.getWeekNumber(date1, 0, 1);
+    expected = 52;
+    expect(result).toEqual(expected);
+
+    // firstDayOfWeek is Monday
+    date1 = new Date(2011, 0, 1);
+    result = DateMath.getWeekNumber(date1, 1, 1);
+    expected = 52;
+    expect(result).toEqual(expected);
+  });
+
+  // First week of year set to FirstWeekOfYear.FirstFourDayWeek
+  it('can calculate week numbers - option 2', () => {
+    // firstDayOfWeek is Sunday
+    let date1 = new Date(2019, 0, 5);
+    let result = DateMath.getWeekNumber(date1, 0, 2);
+    let expected = 1;
+    expect(result).toEqual(expected);
+
+    // firstDayOfWeek is Sunday
+    date1 = new Date(2018, 0, 6);
+    result = DateMath.getWeekNumber(date1, 0, 2);
+    expected = 1;
+    expect(result).toEqual(expected);
+
+    // firstDayOfWeek is Sunday
+    date1 = new Date(2014, 11, 31);
+    result = DateMath.getWeekNumber(date1, 0, 2);
+    expected = 53;
+    expect(result).toEqual(expected);
+
+    // firstDayOfWeek is Sunday
+    date1 = new Date(2015, 0, 1);
+    result = DateMath.getWeekNumber(date1, 0, 2);
+    expected = 53;
+    expect(result).toEqual(expected);
+
+    // firstDayOfWeek is Sunday
+    date1 = new Date(2010, 11, 31);
+    result = DateMath.getWeekNumber(date1, 0, 2);
+    expected = 52;
+    expect(result).toEqual(expected);
+
+    // firstDayOfWeek is Monday
+    date1 = new Date(2011, 0, 1);
+    result = DateMath.getWeekNumber(date1, 1, 2);
+    expected = 52;
+    expect(result).toEqual(expected);
+  });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
index 711bb4fde5ceb..599f136445df7 100644
--- a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
+++ b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
@@ -1,9 +1,7 @@
-import { DayOfWeek, DateRangeType } from '../dateValues/DateValues';
+import { DayOfWeek, MonthOfYear, FirstWeekOfYear, DateRangeType } from '../dateValues/DateValues';
+import TimeConstants from '../dateValues/TimeConstants';
 import { assertNever } from '../../Utilities';
 
-const DAYS_IN_WEEK = 7;
-const MONTHS_IN_YEAR = 12;
-
 /**
  * Returns a date offset from the given date by the specified number of days.
  * @param {Date} date - The origin date
@@ -23,7 +21,7 @@ export function addDays(date: Date, days: number): Date {
  * @return {Date} A new Date object offset from the origin date by the given number of weeks
  */
 export function addWeeks(date: Date, weeks: number): Date {
-  return addDays(date, weeks * DAYS_IN_WEEK);
+  return addDays(date, weeks * TimeConstants.DaysInOneWeek);
 }
 
 /**
@@ -42,7 +40,7 @@ export function addMonths(date: Date, months: number): Date {
   // We want to maintain the same day-of-month, but that may not be possible if the new month doesn't have enough days.
   // Loop until we back up to a day the new month has.
   // (Weird modulo math is due to Javascript's treatment of negative numbers in modulo)
-  if (result.getMonth() !== ((newMonth % MONTHS_IN_YEAR) + MONTHS_IN_YEAR) % MONTHS_IN_YEAR) {
+  if (result.getMonth() !== (newMonth % TimeConstants.MonthInOneYear + TimeConstants.MonthInOneYear) % TimeConstants.MonthInOneYear) {
     result = addDays(result, -result.getDate());
   }
   return result;
@@ -63,7 +61,7 @@ export function addYears(date: Date, years: number): Date {
   // We want to maintain the same day-of-month, but that may not be possible if the new month doesn't have enough days.
   // Loop until we back up to a day the new month has.
   // (Weird modulo math is due to Javascript's treatment of negative numbers in modulo)
-  if (result.getMonth() !== ((date.getMonth() % MONTHS_IN_YEAR) + MONTHS_IN_YEAR) % MONTHS_IN_YEAR) {
+  if (result.getMonth() !== (date.getMonth() % TimeConstants.MonthInOneYear + TimeConstants.MonthInOneYear) % TimeConstants.MonthInOneYear) {
     result = addDays(result, -result.getDate());
   }
   return result;
@@ -129,7 +127,7 @@ export function getDateRangeArray(date: Date, dateRangeType: DateRangeType, firs
 
     case DateRangeType.Week:
       startDate = getStartDateOfWeek(getDatePart(date), firstDayOfWeek);
-      endDate = addDays(startDate, DAYS_IN_WEEK);
+      endDate = addDays(startDate, TimeConstants.DaysInOneWeek);
       break;
 
     case DateRangeType.Month:
@@ -166,6 +164,64 @@ export function isInDateRangeArray(date: Date, dateRange: Date[]): boolean {
   return false;
 }
 
+/**
+ * Returns the week number for a date.
+ * Week numbers are 1 - 52 (53) in a year
+ * @param {navigatedDate} Date - A date to find the week number for.
+ * @param {firstDayOfWeek} DayOfWeek - The first day of the week (0-6, Sunday = 0)
+ * @param {firstWeekOfYear} FirstWeekOfYear - The first week of the year (1-2)
+ * @return {weeksArray} The weeks number array for the current month.
+ */
+export function getWeekNumbersInMonth(
+  weeksInMonth: number,
+  firstDayOfWeek: DayOfWeek,
+  firstWeekOfYear: FirstWeekOfYear,
+  navigatedDate: Date) {
+  let selectedYear = navigatedDate.getFullYear();
+  let selectedMonth = navigatedDate.getMonth();
+  let dayOfMonth = 1;
+  let fistDayOfMonth = new Date(selectedYear, selectedMonth, dayOfMonth);
+  let endOfFirstWeek = dayOfMonth
+    + (firstDayOfWeek + TimeConstants.DaysInOneWeek - 1)
+    - adjustWeekDay(firstDayOfWeek, fistDayOfMonth.getDay());
+  let endOfWeekRange = new Date(selectedYear, selectedMonth, endOfFirstWeek);
+  dayOfMonth = endOfWeekRange.getDate();
+
+  let weeksArray = [];
+  for (let i = 0; i < weeksInMonth; i++) {
+    // Get week number for end of week
+    weeksArray.push(getWeekNumber(endOfWeekRange, firstDayOfWeek, firstWeekOfYear));
+    dayOfMonth += TimeConstants.DaysInOneWeek;
+    endOfWeekRange = new Date(selectedYear, selectedMonth, dayOfMonth);
+  }
+  return weeksArray;
+}
+
+/**
+ * Returns the week number for a date.
+ * Week numbers are 1 - 52 (53) in a year
+ * @param {Date} date - A date to find the week number for.
+ * @param {DayOfWeek} firstDayOfWeek - The first day of the week (0-6, Sunday = 0)
+ * @param {firstWeekOfYear} firstWeekOfYear - The first week of the year (1-2)
+ * @return {Number} The week's number in the year.
+ */
+export function getWeekNumber(date: Date, firstDayOfWeek: DayOfWeek, firstWeekOfYear: FirstWeekOfYear) {
+  // First four-day week of the year - minumum days count
+  const fourDayWeek = 4;
+
+  switch (firstWeekOfYear) {
+
+    case FirstWeekOfYear.FirstFullWeek:
+      return getWeekOfYearFullDays(date, firstDayOfWeek, TimeConstants.DaysInOneWeek);
+
+    case FirstWeekOfYear.FirstFourDayWeek:
+      return getWeekOfYearFullDays(date, firstDayOfWeek, fourDayWeek);
+
+    default:
+      return getFirstDayWeekOfYear(date, firstDayOfWeek);
+  }
+}
+
 /**
  * Gets a new date with the time portion zeroed out, i.e., set to midnight
  * @param {Date} date - The origin date
@@ -185,7 +241,7 @@ function getStartDateOfWeek(date: Date, firstDayOfWeek: DayOfWeek): Date {
   let daysOffset = firstDayOfWeek - date.getDay();
   if (daysOffset > 0) {
     // If first day of week is > date, go 1 week back, to ensure resulting date is in the past.
-    daysOffset -= DAYS_IN_WEEK;
+    daysOffset -= TimeConstants.DaysInOneWeek;
   }
   return addDays(date, daysOffset);
 }
@@ -201,17 +257,67 @@ function getDatePartHashValue(date: Date) {
 }
 
 /**
- * Returns the week number for a date.
- * Week numbers are 1 - 52 (53) in a year
- * @param {Date} date - A date to find the week number for.
- * @param {DayOfWeek} firstDayOfWeek - The first day of the week (0-6, Sunday = 0)
- * @return {Number} The week's number in the year.
- */
-export function getWeekNumber(date: Date, firstDayOfWeek: DayOfWeek) {
+* Helper function for getWeekNumber.
+* Returns week number for a date
+* @param {date} Date - current selected date.
+* @param {firstDayOfWeek} DayOfWeek - The first day of week (0-6, Sunday = 0)
+* @param {numberOfFullDays} number - week settings.
+* @return {Number} The week's number in the year.
+*/
+function getWeekOfYearFullDays(date: Date, firstDayOfWeek: DayOfWeek, numberOfFullDays: number) {
+  let dayOfYear = getDayOfYear(date) - 1;
+  let dateWeekDay = date.getDay();
+  let num = (date.getDay()) - (dayOfYear % TimeConstants.DaysInOneWeek);
+
+  let lastDayOfyear = new Date(date.getFullYear(), MonthOfYear.December, 31);
+  let daysInYear = getDayOfYear(lastDayOfyear) - 1;
+
+  let adjustedWeekDay = adjustWeekDay(firstDayOfWeek, dateWeekDay);
+
+  let num2 = ((firstDayOfWeek - num) + (2 * TimeConstants.DaysInOneWeek)) % TimeConstants.DaysInOneWeek;
+  if ((num2 !== 0) && (num2 >= numberOfFullDays)) {
+    num2 -= TimeConstants.DaysInOneWeek;
+  }
+
+  let num3 = dayOfYear - num2;
+  if (num3 < 0) {
+    num -= daysInYear % TimeConstants.DaysInOneWeek;
+    num2 = ((firstDayOfWeek - num) + (2 * TimeConstants.DaysInOneWeek)) % TimeConstants.DaysInOneWeek;
+    if ((num2 !== 0) && (num2 + 1 >= numberOfFullDays)) {
+      num2 -= TimeConstants.DaysInOneWeek;
+    }
+
+    num3 = daysInYear - num2;
+  }
+
+  return Math.floor((num3 / TimeConstants.DaysInOneWeek) + 1);
+}
+
+/**
+* Helper function for getWeekNumber.
+* Returns week number for a date
+* @param {date} Date - current selected date.
+* @param {firstDayOfWeek} DayOfWeek - The first day of week (0-6, Sunday = 0)
+* @return {Number} The week's number in the year.
+*/
+function getFirstDayWeekOfYear(date: Date, firstDayOfWeek: number) {
   let num = getDayOfYear(date) - 1;
-  let num2 = date.getDay() - (num % 7);
-  let num3 = ((num2 - firstDayOfWeek) + 14) % 7;
-  return Math.floor(((num + num3) / 7) + 1);
+  let num2 = (date.getDay()) - (num % TimeConstants.DaysInOneWeek);
+  let num3 = ((num2 - firstDayOfWeek) + 2 * TimeConstants.DaysInOneWeek) % TimeConstants.DaysInOneWeek;
+
+  return Math.floor(((num + num3) / TimeConstants.DaysInOneWeek) + 1);
+}
+
+/**
+* Helper function for getWeekNumber.
+* Returns adjusted week day number when firstDayOfWeek is other than Sunday
+* For Week Day Number comparison checks
+* @param {firstDayOfWeek} DayOfWeek - The first day of week (0-6, Sunday = 0)
+* @param {dateWeekDay} DayOfWeek - shifts number forward to 1 week in case passed as true
+* @return {DayOfWeek} The day of week adjusted to firstDayOfWeek. E.g. when FirstDyOfWeek is Monday (1), Sunday becomes = 7 (7 > 1).
+*/
+function adjustWeekDay(firstDayOfWeek: DayOfWeek, dateWeekDay: DayOfWeek) {
+  return (firstDayOfWeek !== DayOfWeek.Sunday && dateWeekDay < firstDayOfWeek) ? dateWeekDay + TimeConstants.DaysInOneWeek : dateWeekDay;
 }
 
 /**
diff --git a/packages/office-ui-fabric-react/src/utilities/dateValues/DateValues.ts b/packages/office-ui-fabric-react/src/utilities/dateValues/DateValues.ts
index 23b2ac914fec5..02df413075506 100644
--- a/packages/office-ui-fabric-react/src/utilities/dateValues/DateValues.ts
+++ b/packages/office-ui-fabric-react/src/utilities/dateValues/DateValues.ts
@@ -11,6 +11,33 @@ export enum DayOfWeek {
   Saturday = 6
 }
 
+/**
+ * The months
+ */
+export enum MonthOfYear {
+  January = 0,
+  February = 1,
+  March = 2,
+  April = 3,
+  May = 4,
+  June = 5,
+  July = 6,
+  August = 7,
+  September = 8,
+  October = 9,
+  November = 10,
+  December = 11
+}
+
+/**
+ * First week of the year settings types
+ */
+export enum FirstWeekOfYear {
+  FirstDay = 0,
+  FirstFullWeek = 1,
+  FirstFourDayWeek = 2
+}
+
 /**
  * The supported date range types
  */
@@ -18,4 +45,4 @@ export enum DateRangeType {
   Day = 0,
   Week = 1,
   Month = 2
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/utilities/dateValues/TimeConstants.ts b/packages/office-ui-fabric-react/src/utilities/dateValues/TimeConstants.ts
new file mode 100644
index 0000000000000..b81095d5c4af0
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/utilities/dateValues/TimeConstants.ts
@@ -0,0 +1,15 @@
+/**
+ * Common constants and methods
+ */
+let TimeConstants = {
+  MillisecondsInOneDay: 86400000,
+  MillisecondsIn1Sec: 1000,
+  MillisecondsIn1Min: 60000,
+  MillisecondsIn30Mins: 1800000,
+  MillisecondsIn1Hour: 3600000,
+  MinutesInOneDay: 1440,
+  MinutesInOneHour: 60,
+  DaysInOneWeek: 7,
+  MonthInOneYear: 12
+};
+export default TimeConstants;

From 116176a27ab14f5dd20b79119dd2215727b350d3 Mon Sep 17 00:00:00 2001
From: cicciodm <f.dimauro92@gmail.com>
Date: Mon, 16 Oct 2017 02:38:22 +0200
Subject: [PATCH 0854/1641] Nav: Fix Styles bugs related to CommandButton
 entries (#2728)

* Fix Styles related to CommandButton entries:
 - "Selected" & ":hover" Style are now applied to button elements with compositeLink class
 - Button elements have now width: 100%
 - Correct indentation is applied to CommandButton components for different indentation levels
 - No iconProps are passed to CommandButton if none are present (avoids unnecessary padding)
 - The span for CommandButton description is given 0 margin when no icon is present (avoids unnecessary padding)

* Add change file

* - Use mergeStyles utility to avoid using the styles prop.
- Remove padding definitions from CSS, padding is all handled by tsx
- !important was added to the style definitions for the CommandButton component, as some internal stylings were overriding padding

* Removed empty CSS class

* Pass IButtonStyles to CommandButton to achieve correct padding

* Removed quotes from property names

* Apply margin to chevron button (as opposed to padding), and get correct indentation

* Changed variable name

* Added missing semicolon

* turn everything into buttons. Needs work.

* Some cleanup

* Removed generic css selector in favor of .link
---
 .../master_2017-09-06-10-30.json              |  11 ++
 .../src/components/Nav/Nav.scss               |  20 ++--
 .../src/components/Nav/Nav.tsx                | 100 ++++++++++--------
 .../Nav/examples/Nav.Basic.Example.tsx        |   2 +-
 4 files changed, 72 insertions(+), 61 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/master_2017-09-06-10-30.json

diff --git a/common/changes/office-ui-fabric-react/master_2017-09-06-10-30.json b/common/changes/office-ui-fabric-react/master_2017-09-06-10-30.json
new file mode 100644
index 0000000000000..ffcd47447902a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2017-09-06-10-30.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix CommandButton styles for Nav entries",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "frdim@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.scss b/packages/office-ui-fabric-react/src/components/Nav/Nav.scss
index 8d8789ce4f430..72aac142b960a 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.scss
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.scss
@@ -109,7 +109,6 @@ $linkRightPadding: 20px;
     height: $navnode-height - 2;
     position: absolute;
     top: 1px;
-    @include ms-left(1px);
     z-index: 1;
     padding: 0;
     margin: 0;
@@ -119,15 +118,12 @@ $linkRightPadding: 20px;
     }
   }
 
-  & a {
-  color: $unselectedForegroundColor;
-  }
   color: $unselectedForegroundColor;
   background: $unselectedBackgroundColor;
 
   &:hover {
 
-    & a,
+    & .link,
     & .chevronButton {
       background: $unselectedHoverBackgroundColor;
       color: $unselectedHoverForegroundColor;
@@ -141,7 +137,7 @@ $linkRightPadding: 20px;
   }
 
   &.compositeLinkIsSelected {
-    & a,
+    & .link,
     & .chevronButton {
 
       color: $ms-color-themePrimary;
@@ -165,9 +161,9 @@ $linkRightPadding: 20px;
   display: block;
   position: relative;
   height: $navnode-height;
+  width: 100%;
   line-height: $navnode-height;
   text-decoration: none;
-  padding: 0 20px;
   cursor: pointer;
   text-overflow: ellipsis;
   text-decoration: none;
@@ -175,6 +171,10 @@ $linkRightPadding: 20px;
   overflow: hidden;
 }
 
+.buttonEntry {
+  color: $ms-color-themePrimary;
+}
+
 .groupHeaderFontSize {
   @include ms-font-l;
 }
@@ -187,13 +187,7 @@ $linkRightPadding: 20px;
 }
 
 .root .link {
-  @include ms-padding-left($noExpandButtonLinkLeftPadding);
   :global(.ms-Button-label) {
     @include ms-font-m;
-    color: $ms-color-themePrimary;
-  }
-
-  &.linkIsOnExpanded {
-  @include ms-padding-left($hasExpandButtonLinkLeftPadding);
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
index cc2863e1a95bc..e0b0f2104d7cc 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
@@ -7,8 +7,9 @@ import {
   getNativeProps,
   getRTL
 } from '../../Utilities';
+import { mergeStyles } from '@uifabric/styling';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
-import { CommandButton } from '../../Button';
+import { ActionButton, IButtonStyles } from '../../Button';
 import { Icon } from '../../Icon';
 import * as stylesImport from './Nav.scss';
 const styles: any = stylesImport;
@@ -22,10 +23,12 @@ import {
 
 // The number pixels per indentation level for Nav links.
 const _indentationSize: number = 14;
-// Tne number of pixels of left margin when there is expand/collaps button
-const _indentWithExpandButton: number = 28;
-// Tne number of pixels of left margin when there is expand/collaps button
-const _indentNoExpandButton: number = 20;
+
+// The number of pixels of left margin
+const _baseIndent: number = 3;
+
+// The number of pixels of padding to add to the far side of the button (allows ellipsis to happen)
+const _farSidePadding: number = 20;
 
 // global var used in _isLinkSelectedKey
 let _urlResolver: HTMLAnchorElement | undefined;
@@ -129,58 +132,54 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
     return this.state.selectedKey;
   }
 
-  private _renderAnchorLink(link: INavLink, linkIndex: number, nestingLevel: number): React.ReactElement<{}> {
-    // Determine the appropriate padding to add before this link.
-    // In RTL, the "before" padding will go on the right instead of the left.
+  private _renderNavLink(link: INavLink, linkIndex: number, nestingLevel: number) {
     const isRtl: boolean = getRTL();
-    const paddingBefore = _indentationSize * nestingLevel +
-      (this._hasExpandButton ? _indentWithExpandButton : _indentNoExpandButton);
+    const paddingBefore = _indentationSize * nestingLevel + _baseIndent;
+    const buttonStyles: IButtonStyles = {
+      root: {
+        [isRtl ? 'paddingRight' : 'paddingLeft']: paddingBefore,
+        [isRtl ? 'paddingLeft' : 'paddingRight']: _farSidePadding,
+      },
+      textContainer: {
+        overflow: 'hidden',
+      },
+      label: {
+        whiteSpace: 'nowrap',
+        textOverflow: 'ellipsis',
+        overflow: 'hidden',
+        lineHeight: '36px'
+      }
+    };
+
     // Prevent hijacking of the parent window if link.target is defined
     const rel = link.url && link.target && !isRelativeUrl(link.url) ? 'noopener noreferrer' : undefined;
 
     return (
-      <a
-        className={ css('ms-Nav-link', styles.link) }
-        style={ { [isRtl ? 'paddingRight' : 'paddingLeft']: paddingBefore + 'px' } }
-        href={ link.url || 'javascript:' }
-        onClick={ this._onNavAnchorLinkClicked.bind(this, link) }
-        aria-label={ link.ariaLabel }
-        title={ link.title || link.name }
-        target={ link.target }
-        rel={ rel }
-      >
-        { link.iconClassName && (
-          <Icon
-            className={ css(link.iconClassName, styles.iconLink) }
-            iconName='IconLink'
-          />
-        ) }
-        { this.props.onRenderLink!(link) }
-      </a>
-    );
-  }
-
-  private _renderButtonLink(link: INavLink, linkIndex: number) {
-    return (
-      <CommandButton
-        className={ css(
-          'ms-Nav-link ms-Nav-linkButton',
+      <ActionButton
+        className={ mergeStyles(
+          'ms-Nav-link' + link.onClick && 'ms-Nav-linkButton',
           styles.link,
-          this._hasExpandButton && 'isOnExpanded ' + styles.linkIsOnExpanded
-        ) }
+          link.onClick && styles.buttonEntry,
+          this._hasExpandButton && 'isOnExpanded') as string
+        }
+        styles={ buttonStyles }
         href={ link.url }
-        iconProps={ { iconName: link.icon } }
+        iconProps={ { iconName: link.icon || '' } }
         description={ link.title || link.name }
-        onClick={ this._onNavButtonLinkClicked.bind(this, link) }
+        onClick={ link.onClick ? this._onNavButtonLinkClicked.bind(this, link) : this._onNavAnchorLinkClicked.bind(this, link) }
+        title={ link.title || link.name }
+        target={ link.target }
+        rel={ rel }
+        aria-label={ link.ariaLabel }
       >
         { link.name }
-      </CommandButton>);
+      </ActionButton>);
   }
 
   private _renderCompositeLink(link: INavLink, linkIndex: number, nestingLevel: number): React.ReactElement<{}> {
     const isLinkSelected: boolean = this._isLinkSelected(link);
     const isRtl: boolean = getRTL();
-    const paddingBefore: string = `${_indentationSize * nestingLevel}px`;
+    const absolutePositionString = `${_indentationSize * nestingLevel + 1}px`;
 
     return (
       <div
@@ -197,8 +196,17 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
       >
         { (link.links && link.links.length > 0 ?
           <button
-            style={ { [isRtl ? 'marginRight' : 'marginLeft']: paddingBefore } }
-            className={ css('ms-Nav-chevronButton ms-Nav-chevronButton--link', styles.chevronButton, styles.chevronButtonLink) }
+            className={ mergeStyles(
+              'ms-Nav-chevronButton ms-Nav-chevronButton--link',
+              styles.chevronButton,
+              styles.chevronButtonLink,
+              isRtl && {
+                right: absolutePositionString,
+              },
+              !isRtl && {
+                left: absolutePositionString,
+              }) as string
+            }
             onClick={ this._onLinkExpandClicked.bind(this, link) }
             aria-label={ this.props.expandButtonAriaLabel }
             aria-expanded={ link.isExpanded ? 'true' : 'false' }
@@ -209,9 +217,7 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
             />
           </button> : null
         ) }
-        { link.onClick && !link.forceAnchor
-          ? this._renderButtonLink(link, linkIndex)
-          : this._renderAnchorLink(link, linkIndex, nestingLevel) }
+        { this._renderNavLink(link, linkIndex, nestingLevel) }
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.Basic.Example.tsx
index 4be70a35ceac9..a54d521da4ce5 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.Basic.Example.tsx
@@ -35,7 +35,7 @@ export class NavBasicExample extends React.Component<any, any> {
                   { name: 'Documents', url: 'http://example.com', key: 'key3', isExpanded: true },
                   { name: 'Pages', url: 'http://msn.com', key: 'key4' },
                   { name: 'Notebook', url: 'http://msn.com', key: 'key5' },
-                  { name: 'Long Name Test for elipse', url: 'http://msn.com', key: 'key6' },
+                  { name: 'Long Name Test for ellipse', url: 'http://msn.com', key: 'key6' },
                   {
                     name: 'Edit',
                     url: 'http://cnn.com',

From 033885d41e71f8636d2a13d0a595cf9d41ef8018 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Sun, 15 Oct 2017 17:43:26 -0700
Subject: [PATCH 0855/1641] Slider: fix css (#3120)

* Fix slider css

* Add change file

* Fix Slider stories
---
 apps/vr-tests/src/stories/Slider.stories.tsx  | 69 ++++++++++---------
 .../fix-slider-css_2017-10-13-22-57.json      | 11 +++
 .../src/components/Slider/Slider.scss         |  4 ++
 3 files changed, 50 insertions(+), 34 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-slider-css_2017-10-13-22-57.json

diff --git a/apps/vr-tests/src/stories/Slider.stories.tsx b/apps/vr-tests/src/stories/Slider.stories.tsx
index 7f8bc63fbeb47..239cabb7ea6aa 100644
--- a/apps/vr-tests/src/stories/Slider.stories.tsx
+++ b/apps/vr-tests/src/stories/Slider.stories.tsx
@@ -2,17 +2,12 @@
 import * as React from 'react';
 import Screener, { Steps } from 'screener-storybook/src/screener';
 import { storiesOf } from '@storybook/react';
-import { FabricDecorator } from '../utilities';
+import { FabricDecoratorTall } from '../utilities';
 import { Slider } from 'office-ui-fabric-react';
 
+// tslint:disable:jsx-ban-props
 storiesOf('Slider', module)
-  .addDecorator(story => (
-    // tslint:disable:jsx-ban-props
-    <div style={ { width: '300px', height: '200px', display: 'flex' } }>
-      { story() }
-    </div>
-  ))
-  .addDecorator(FabricDecorator)
+  .addDecorator(FabricDecoratorTall)
   .addDecorator(story => (
     <Screener
       steps={ new Screener.Steps()
@@ -25,33 +20,39 @@ storiesOf('Slider', module)
       { story() }
     </Screener>
   )).add('Root', () => (
-    <Slider
-      label='Basic example:'
-      min={ 1 }
-      max={ 3 }
-      step={ 1 }
-      defaultValue={ 2 }
-      showValue={ true }
-    />
+    <div style={ { flexDirection: 'column', width: '300px', display: 'flex' } }>
+      <Slider
+        label='Basic example:'
+        min={ 1 }
+        max={ 3 }
+        step={ 1 }
+        defaultValue={ 2 }
+        showValue={ true }
+      />
+    </div>
   ))
   .add('Disabled', () => (
-    <Slider
-      label='Basic example:'
-      min={ 1 }
-      max={ 3 }
-      step={ 1 }
-      defaultValue={ 2 }
-      showValue={ true }
-      disabled
-    />
+    <div style={ { flexDirection: 'column', width: '300px', display: 'flex' } }>
+      <Slider
+        label='Basic example:'
+        min={ 1 }
+        max={ 3 }
+        step={ 1 }
+        defaultValue={ 2 }
+        showValue={ true }
+        disabled
+      />
+    </div>
   )).add('Vertical', () => (
-    <Slider
-      label='Basic example:'
-      min={ 1 }
-      max={ 3 }
-      step={ 1 }
-      defaultValue={ 2 }
-      showValue={ true }
-      vertical={ true }
-    />
+    <div style={ { flexDirection: 'row', height: '200px', display: 'flex' } }>
+      <Slider
+        label='Basic example:'
+        min={ 1 }
+        max={ 3 }
+        step={ 1 }
+        defaultValue={ 2 }
+        showValue={ true }
+        vertical={ true }
+      />
+    </div>
   ));
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-slider-css_2017-10-13-22-57.json b/common/changes/office-ui-fabric-react/fix-slider-css_2017-10-13-22-57.json
new file mode 100644
index 0000000000000..d838cf9542b83
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-slider-css_2017-10-13-22-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix Slider css so label does not break lines if value is long",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "a.erich@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.scss b/packages/office-ui-fabric-react/src/components/Slider/Slider.scss
index f28d9295c7a6f..131cc9e91f8d4 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.scss
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.scss
@@ -70,6 +70,8 @@
 
   .valueLabel {
     margin: 0 8px;
+    white-space: nowrap;
+    width: 40px;
   }
 }
 
@@ -109,6 +111,8 @@
 
   .valueLabel {
     margin: 0 auto;
+    white-space: nowrap;
+    width: 40px;
   }
 }
 

From 7c11fc11a0cdb10f4f80377b47c5a029b7340bd0 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sun, 15 Oct 2017 18:08:13 -0700
Subject: [PATCH 0856/1641] Adding merge-styles jest serializer package.
 (#3123)

* Adding a jest serializer package.

* updated license

* Doc edits.

* test tweak

* Updates

* Fixing paths.

* Fixing nav test. It seems that Nav has regressed.

* Removing global css rule that makes little sense.
---
 apps/vr-tests/package.json                    |   3 +-
 apps/vr-tests/src/stories/Nav.stories.tsx     |   6 +-
 common/config/rush/npm-shrinkwrap.json        | 711 +++---------------
 packages/experiments/jest.config.js           |   3 +
 packages/experiments/package.json             |   1 +
 .../jest-serializer-merge-styles/.npmignore   |  23 +
 packages/jest-serializer-merge-styles/.npmrc  |   2 +
 packages/jest-serializer-merge-styles/LICENSE |  15 +
 .../jest-serializer-merge-styles/README.md    |  47 ++
 .../jest.config.js                            |   3 +
 .../jest-serializer-merge-styles/package.json |  29 +
 .../src/index.test.tsx                        |  60 ++
 .../jest-serializer-merge-styles/src/index.ts |  62 ++
 .../tsconfig.json                             |  26 +
 .../jest-serializer-merge-styles/tslint.json  |   8 +
 packages/merge-styles/gulpfile.js             |  17 -
 .../office-ui-fabric-react/jest.config.js     |   5 +-
 packages/office-ui-fabric-react/package.json  |   1 +
 rush.json                                     |   5 +
 scripts/tasks/jest-resources.js               |   4 -
 scripts/tasks/jest-serializer-merge-styles.js |  60 --
 21 files changed, 379 insertions(+), 712 deletions(-)
 create mode 100644 packages/jest-serializer-merge-styles/.npmignore
 create mode 100644 packages/jest-serializer-merge-styles/.npmrc
 create mode 100644 packages/jest-serializer-merge-styles/LICENSE
 create mode 100644 packages/jest-serializer-merge-styles/README.md
 create mode 100644 packages/jest-serializer-merge-styles/jest.config.js
 create mode 100644 packages/jest-serializer-merge-styles/package.json
 create mode 100644 packages/jest-serializer-merge-styles/src/index.test.tsx
 create mode 100644 packages/jest-serializer-merge-styles/src/index.ts
 create mode 100644 packages/jest-serializer-merge-styles/tsconfig.json
 create mode 100644 packages/jest-serializer-merge-styles/tslint.json
 delete mode 100644 packages/merge-styles/gulpfile.js
 delete mode 100644 scripts/tasks/jest-serializer-merge-styles.js

diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 40f921c8686b3..d136882ee690d 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -8,7 +8,7 @@
     "clean": "",
     "screener": "screener-storybook --conf screener.config.js --debug",
     "screener:local": "screener-storybook --conf screener.local.config.js --debug",
-    "storybook": "start-storybook --port 5555"
+    "start": "start-storybook --port 5555"
   },
   "devDependencies": {
     "@storybook/addon-options": "=3.2.3",
@@ -28,6 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
+    "@uifabric/icons": ">=5.2.0 <6.0.0",
     "office-ui-fabric-react": ">=5.8.2 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/vr-tests/src/stories/Nav.stories.tsx b/apps/vr-tests/src/stories/Nav.stories.tsx
index 488b2aa154653..6345c82624a7f 100644
--- a/apps/vr-tests/src/stories/Nav.stories.tsx
+++ b/apps/vr-tests/src/stories/Nav.stories.tsx
@@ -4,6 +4,7 @@ import Screener, { Steps } from 'screener-storybook/src/screener';
 import { storiesOf } from '@storybook/react';
 import { FabricDecorator } from '../utilities';
 import { Nav } from 'office-ui-fabric-react';
+import { IconNames } from '@uifabric/icons';
 
 // tslint:disable:max-line-length
 storiesOf('Nav', module)
@@ -37,6 +38,7 @@ storiesOf('Nav', module)
                   url: 'http://example.com',
                   links: [{
                     name: 'Activity',
+                    icon: IconNames.Upload,
                     url: 'http://msn.com',
                     key: 'key1'
                   },
@@ -47,14 +49,14 @@ storiesOf('Nav', module)
                   }],
                   isExpanded: true
                 },
-                { name: 'Documents', url: 'http://example.com', key: 'key3' },
+                { name: 'Documents', icon: IconNames.Accept, url: 'http://example.com', key: 'key3' },
                 { name: 'Pages', url: 'http://msn.com', key: 'key4' },
                 { name: 'Notebook', url: 'http://msn.com', key: 'key5' },
                 { name: 'Long Name Test for elipse', url: 'http://msn.com', key: 'key6' },
                 {
                   name: 'Edit',
                   url: 'http://cnn.com',
-                  icon: 'Edit',
+                  icon: IconNames.Edit,
                   key: 'key8'
                 }
               ]
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 03daaccea0144..4f16025a83d65 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -19,7 +19,7 @@
       "integrity": "sha1-apeiLzpi5UwLUwo+jxSYrSuE19w="
     },
     "@rush-temp/build": {
-      "version": "file:projects\\build",
+      "version": "file:projects/build",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -51,8 +51,7 @@
           "dependencies": {
             "browserslist": {
               "version": "2.5.1",
-              "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.5.1.tgz",
-              "integrity": "sha512-jAvM2ku7YDJ+leAq3bFH1DE0Ylw+F+EQDq4GkqZfgPEqpWYw9ofQH85uKSB9r3Tv7XDbfqVtE+sdvKJW7IlPJA=="
+              "bundled": true
             }
           }
         },
@@ -100,40 +99,33 @@
           "dependencies": {
             "ansi-regex": {
               "version": "2.1.1",
-              "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
-              "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
+              "bundled": true
             },
             "chalk": {
               "version": "1.1.3",
-              "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-              "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+              "bundled": true,
               "dependencies": {
                 "supports-color": {
                   "version": "2.0.0",
-                  "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-                  "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+                  "bundled": true
                 }
               }
             },
             "has-flag": {
               "version": "1.0.0",
-              "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
-              "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
+              "bundled": true
             },
             "postcss": {
               "version": "5.2.18",
-              "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-              "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+              "bundled": true
             },
             "strip-ansi": {
               "version": "3.0.1",
-              "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
-              "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8="
+              "bundled": true
             },
             "supports-color": {
               "version": "3.2.3",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-              "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+              "bundled": true
             }
           }
         },
@@ -323,8 +315,7 @@
           "dependencies": {
             "yargs": {
               "version": "8.0.2",
-              "resolved": "https://registry.npmjs.org/yargs/-/yargs-8.0.2.tgz",
-              "integrity": "sha1-YpmpBVsc78lp/355wdkY3Osiw2A="
+              "bundled": true
             }
           }
         },
@@ -379,7 +370,7 @@
       }
     },
     "@rush-temp/example-app-base": {
-      "version": "file:projects\\example-app-base",
+      "version": "file:projects/example-app-base",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -666,7 +657,7 @@
       }
     },
     "@rush-temp/experiments": {
-      "version": "file:projects\\experiments",
+      "version": "file:projects/experiments",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -921,7 +912,7 @@
       }
     },
     "@rush-temp/fabric-website": {
-      "version": "file:projects\\fabric-website",
+      "version": "file:projects/fabric-website",
       "dependencies": {
         "@types/react-addons-test-utils": {
           "version": "0.14.19",
@@ -1242,10 +1233,19 @@
       }
     },
     "@rush-temp/icons": {
-      "version": "file:projects\\icons"
+      "version": "file:projects/icons"
+    },
+    "@rush-temp/jest-serializer-merge-styles": {
+      "version": "file:projects/jest-serializer-merge-styles",
+      "dependencies": {
+        "@types/jest": {
+          "version": "21.1.0",
+          "bundled": true
+        }
+      }
     },
     "@rush-temp/merge-styles": {
-      "version": "file:projects\\merge-styles",
+      "version": "file:projects/merge-styles",
       "dependencies": {
         "@types/jest": {
           "version": "21.1.0",
@@ -1278,7 +1278,7 @@
       }
     },
     "@rush-temp/office-ui-fabric-react": {
-      "version": "file:projects\\office-ui-fabric-react",
+      "version": "file:projects/office-ui-fabric-react",
       "dependencies": {
         "@types/jest": {
           "version": "21.1.0",
@@ -1587,10 +1587,10 @@
       }
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
-      "version": "file:projects\\office-ui-fabric-react-tslint"
+      "version": "file:projects/office-ui-fabric-react-tslint"
     },
     "@rush-temp/ssr-tests": {
-      "version": "file:projects\\ssr-tests",
+      "version": "file:projects/ssr-tests",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -1827,7 +1827,7 @@
       }
     },
     "@rush-temp/styling": {
-      "version": "file:projects\\styling",
+      "version": "file:projects/styling",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -2064,7 +2064,7 @@
       }
     },
     "@rush-temp/test-bundle-button": {
-      "version": "file:projects\\test-bundle-button",
+      "version": "file:projects/test-bundle-button",
       "dependencies": {
         "acorn": {
           "version": "5.1.1",
@@ -2277,7 +2277,7 @@
       }
     },
     "@rush-temp/todo-app": {
-      "version": "file:projects\\todo-app",
+      "version": "file:projects/todo-app",
       "dependencies": {
         "typescript": {
           "version": "2.4.2",
@@ -2286,7 +2286,7 @@
       }
     },
     "@rush-temp/utilities": {
-      "version": "file:projects\\utilities",
+      "version": "file:projects/utilities",
       "dependencies": {
         "@types/jest": {
           "version": "21.1.0",
@@ -2349,7 +2349,7 @@
       }
     },
     "@rush-temp/vr-tests": {
-      "version": "file:projects\\vr-tests",
+      "version": "file:projects/vr-tests",
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -2546,14 +2546,14 @@
       "integrity": "sha1-MEQ4FkfhHulzxa8uklMjkw9pHYA="
     },
     "@uifabric/icons": {
-      "version": "5.1.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.1.1.tgz",
-      "integrity": "sha512-D0wjw2xxwgjP2lPzPQVZaigf01iRFSXQe05rWeHOHQgUK/ChOMX4hYCcXsj7YoPsTp75yfQ+0d1CQ8rDpDjgeg=="
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.2.0.tgz",
+      "integrity": "sha512-P5kfPej/wxgR8jZt/GqnU0FqYcz+JH1iCcaaYd6p9L3opmZtu4w5duKeqs+Bc1u7K16r800EQfLgKe76rt6AuA=="
     },
     "@uifabric/merge-styles": {
-      "version": "5.3.2",
-      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.3.2.tgz",
-      "integrity": "sha512-RHY33Bs6OIS60z8l5taXAps8J7FT4hUkwaM99G3vop4cEAevTYm3RVoYJALT/Q/Ta15QO6X11zqkH2S0J0N7IA=="
+      "version": "5.4.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.4.0.tgz",
+      "integrity": "sha512-u96gLbtiUsPcRjTBcEK7KuWuYwmKrq6tosYV3JcB4t2BIusEog5bIcXwRueH/511XNDNTL/NDCjYHgaxGuAULg=="
     },
     "@uifabric/styling": {
       "version": "5.3.0",
@@ -3748,9 +3748,9 @@
       "integrity": "sha1-81HTKWnTL6XXpVZxVCY9korjvR8="
     },
     "browserify-aes": {
-      "version": "1.0.8",
-      "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.0.8.tgz",
-      "integrity": "sha512-WYCMOT/PtGTlpOKFht0YJFYcPy6pLCR98CtWfzK13zoynLlBMvAdEMSRGmgnJCw2M2j/5qxBkinZQFobieM8dQ=="
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.1.0.tgz",
+      "integrity": "sha512-W2bIMLYoZ9oow7TyePpMJk9l9LY7O3R61a/68bVCDOtnJynnwe3ZeW2IzzSkrQnPKNdJrxVDn3ALZNisSBwb7g=="
     },
     "browserify-cipher": {
       "version": "1.0.0",
@@ -3818,9 +3818,9 @@
       "integrity": "sha1-hZgoeOIbmOHGZCXgPQF0eI9Wnug="
     },
     "bundlesize": {
-      "version": "0.15.2",
-      "resolved": "https://registry.npmjs.org/bundlesize/-/bundlesize-0.15.2.tgz",
-      "integrity": "sha512-qtn2xv9yd02nTSEzW/qWAEgzjrZhoqxb7v3uE0l0LyuCE3VbVjfxJ+ZmIiAN/Gxv4ystlFFSkOjNGTQDf+pCJA==",
+      "version": "0.15.3",
+      "resolved": "https://registry.npmjs.org/bundlesize/-/bundlesize-0.15.3.tgz",
+      "integrity": "sha512-CqLtaDKQFZVh9l53Py67lJOLOT//aNrmF9xT1v5cS080bbqyhOdTX5+LuoVI8LOKa351fUikGcxsQDYWQXfizg==",
       "dependencies": {
         "gzip-size": {
           "version": "4.0.0",
@@ -4181,9 +4181,9 @@
       }
     },
     "connect-history-api-fallback": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.3.0.tgz",
-      "integrity": "sha1-5R0X+PDvDbkKZP20feMFFVbp8Wk="
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.4.0.tgz",
+      "integrity": "sha1-PbJPlz9LkjsOgvYZzg3wJBHKYj0="
     },
     "console-browserify": {
       "version": "1.1.0",
@@ -4726,9 +4726,9 @@
       "integrity": "sha1-zIcsFoiArjxxiXYv1f/ACJbJUYo="
     },
     "electron-to-chromium": {
-      "version": "1.3.25",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.25.tgz",
-      "integrity": "sha1-RTshAJg20Jl9hgNWAf9srkeRxGA="
+      "version": "1.3.26",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.26.tgz",
+      "integrity": "sha1-mWQnKUhhp02cfIK5Jg6jAejALWY="
     },
     "elliptic": {
       "version": "6.4.0",
@@ -4786,9 +4786,9 @@
       "integrity": "sha1-RTVSSKiJeQNLZ5Lhm7gfK3l13Q0="
     },
     "es5-ext": {
-      "version": "0.10.31",
-      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.31.tgz",
-      "integrity": "sha1-e7k4yVp/G59ygJLcCcQe3MOY7v4="
+      "version": "0.10.35",
+      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.35.tgz",
+      "integrity": "sha1-GO6FjOajxFx9eekcFfzKnsVoSU8="
     },
     "es5-shim": {
       "version": "4.5.9",
@@ -5203,549 +5203,6 @@
       "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
       "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
     },
-    "fsevents": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.2.tgz",
-      "integrity": "sha512-Sn44E5wQW4bTHXvQmvSHwqbuiXtduD6Rrjm2ZtUEGbyrig+nUH3t/QD4M4/ZXViY556TBpRgZkHLDx3JxPwxiw==",
-      "optional": true,
-      "dependencies": {
-        "abbrev": {
-          "version": "1.1.0",
-          "bundled": true,
-          "optional": true
-        },
-        "ajv": {
-          "version": "4.11.8",
-          "bundled": true,
-          "optional": true
-        },
-        "ansi-regex": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "aproba": {
-          "version": "1.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "are-we-there-yet": {
-          "version": "1.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "asn1": {
-          "version": "0.2.3",
-          "bundled": true,
-          "optional": true
-        },
-        "assert-plus": {
-          "version": "0.2.0",
-          "bundled": true,
-          "optional": true
-        },
-        "asynckit": {
-          "version": "0.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "aws-sign2": {
-          "version": "0.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "aws4": {
-          "version": "1.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "balanced-match": {
-          "version": "0.4.2",
-          "bundled": true
-        },
-        "bcrypt-pbkdf": {
-          "version": "1.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "block-stream": {
-          "version": "0.0.9",
-          "bundled": true
-        },
-        "boom": {
-          "version": "2.10.1",
-          "bundled": true
-        },
-        "brace-expansion": {
-          "version": "1.1.7",
-          "bundled": true
-        },
-        "buffer-shims": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "caseless": {
-          "version": "0.12.0",
-          "bundled": true,
-          "optional": true
-        },
-        "co": {
-          "version": "4.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "code-point-at": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "combined-stream": {
-          "version": "1.0.5",
-          "bundled": true
-        },
-        "concat-map": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "console-control-strings": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "core-util-is": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "cryptiles": {
-          "version": "2.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "dashdash": {
-          "version": "1.14.1",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true,
-          "optional": true
-        },
-        "deep-extend": {
-          "version": "0.4.2",
-          "bundled": true,
-          "optional": true
-        },
-        "delayed-stream": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "delegates": {
-          "version": "1.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "ecc-jsbn": {
-          "version": "0.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "extend": {
-          "version": "3.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "extsprintf": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "forever-agent": {
-          "version": "0.6.1",
-          "bundled": true,
-          "optional": true
-        },
-        "form-data": {
-          "version": "2.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "fs.realpath": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "fstream": {
-          "version": "1.0.11",
-          "bundled": true
-        },
-        "fstream-ignore": {
-          "version": "1.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "gauge": {
-          "version": "2.7.4",
-          "bundled": true,
-          "optional": true
-        },
-        "getpass": {
-          "version": "0.1.7",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "glob": {
-          "version": "7.1.2",
-          "bundled": true
-        },
-        "graceful-fs": {
-          "version": "4.1.11",
-          "bundled": true
-        },
-        "har-schema": {
-          "version": "1.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "har-validator": {
-          "version": "4.2.1",
-          "bundled": true,
-          "optional": true
-        },
-        "has-unicode": {
-          "version": "2.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "hawk": {
-          "version": "3.1.3",
-          "bundled": true,
-          "optional": true
-        },
-        "hoek": {
-          "version": "2.16.3",
-          "bundled": true
-        },
-        "http-signature": {
-          "version": "1.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "inflight": {
-          "version": "1.0.6",
-          "bundled": true
-        },
-        "inherits": {
-          "version": "2.0.3",
-          "bundled": true
-        },
-        "ini": {
-          "version": "1.3.4",
-          "bundled": true,
-          "optional": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "is-typedarray": {
-          "version": "1.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "isstream": {
-          "version": "0.1.2",
-          "bundled": true,
-          "optional": true
-        },
-        "jodid25519": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "jsbn": {
-          "version": "0.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "json-schema": {
-          "version": "0.2.3",
-          "bundled": true,
-          "optional": true
-        },
-        "json-stable-stringify": {
-          "version": "1.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "json-stringify-safe": {
-          "version": "5.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "jsonify": {
-          "version": "0.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "jsprim": {
-          "version": "1.4.0",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "mime-db": {
-          "version": "1.27.0",
-          "bundled": true
-        },
-        "mime-types": {
-          "version": "2.1.15",
-          "bundled": true
-        },
-        "minimatch": {
-          "version": "3.0.4",
-          "bundled": true
-        },
-        "minimist": {
-          "version": "0.0.8",
-          "bundled": true
-        },
-        "mkdirp": {
-          "version": "0.5.1",
-          "bundled": true
-        },
-        "ms": {
-          "version": "2.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "node-pre-gyp": {
-          "version": "0.6.36",
-          "bundled": true,
-          "optional": true
-        },
-        "nopt": {
-          "version": "4.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "npmlog": {
-          "version": "4.1.0",
-          "bundled": true,
-          "optional": true
-        },
-        "number-is-nan": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "oauth-sign": {
-          "version": "0.8.2",
-          "bundled": true,
-          "optional": true
-        },
-        "object-assign": {
-          "version": "4.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "once": {
-          "version": "1.4.0",
-          "bundled": true
-        },
-        "os-homedir": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "os-tmpdir": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "osenv": {
-          "version": "0.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "path-is-absolute": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "performance-now": {
-          "version": "0.2.0",
-          "bundled": true,
-          "optional": true
-        },
-        "process-nextick-args": {
-          "version": "1.0.7",
-          "bundled": true
-        },
-        "punycode": {
-          "version": "1.4.1",
-          "bundled": true,
-          "optional": true
-        },
-        "qs": {
-          "version": "6.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "rc": {
-          "version": "1.2.1",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "minimist": {
-              "version": "1.2.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "readable-stream": {
-          "version": "2.2.9",
-          "bundled": true
-        },
-        "request": {
-          "version": "2.81.0",
-          "bundled": true,
-          "optional": true
-        },
-        "rimraf": {
-          "version": "2.6.1",
-          "bundled": true
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "bundled": true
-        },
-        "semver": {
-          "version": "5.3.0",
-          "bundled": true,
-          "optional": true
-        },
-        "set-blocking": {
-          "version": "2.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "signal-exit": {
-          "version": "3.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "sntp": {
-          "version": "1.0.9",
-          "bundled": true,
-          "optional": true
-        },
-        "sshpk": {
-          "version": "1.13.0",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "string_decoder": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "stringstream": {
-          "version": "0.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "strip-ansi": {
-          "version": "3.0.1",
-          "bundled": true
-        },
-        "strip-json-comments": {
-          "version": "2.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "tar": {
-          "version": "2.2.1",
-          "bundled": true
-        },
-        "tar-pack": {
-          "version": "3.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "tough-cookie": {
-          "version": "2.3.2",
-          "bundled": true,
-          "optional": true
-        },
-        "tunnel-agent": {
-          "version": "0.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "tweetnacl": {
-          "version": "0.14.5",
-          "bundled": true,
-          "optional": true
-        },
-        "uid-number": {
-          "version": "0.0.6",
-          "bundled": true,
-          "optional": true
-        },
-        "util-deprecate": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "uuid": {
-          "version": "3.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "verror": {
-          "version": "1.3.6",
-          "bundled": true,
-          "optional": true
-        },
-        "wide-align": {
-          "version": "1.1.2",
-          "bundled": true,
-          "optional": true
-        },
-        "wrappy": {
-          "version": "1.0.2",
-          "bundled": true
-        }
-      }
-    },
     "fstream": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
@@ -7104,9 +6561,9 @@
       "integrity": "sha1-lkojxU5IiUBbSGGlyfBIDUUUHfo="
     },
     "kind-of": {
-      "version": "5.0.2",
-      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
-      "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
+      "integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw=="
     },
     "lazy-cache": {
       "version": "2.0.2",
@@ -7755,9 +7212,9 @@
       "integrity": "sha1-a+lPysqNd63gqWcNxGCRTJRHJEQ="
     },
     "ngrok": {
-      "version": "2.2.22",
-      "resolved": "https://registry.npmjs.org/ngrok/-/ngrok-2.2.22.tgz",
-      "integrity": "sha1-j3YmTmMFedJSSu+yOzG/5OFeEOs="
+      "version": "2.2.23",
+      "resolved": "https://registry.npmjs.org/ngrok/-/ngrok-2.2.23.tgz",
+      "integrity": "sha1-dSxID4BWMzUmT3bc6/Tq9DSa90c="
     },
     "nise": {
       "version": "1.1.1",
@@ -7903,9 +7360,9 @@
       "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0="
     },
     "nwmatcher": {
-      "version": "1.4.2",
-      "resolved": "https://registry.npmjs.org/nwmatcher/-/nwmatcher-1.4.2.tgz",
-      "integrity": "sha512-QMkCGQFYp5p+zwU3INntLmz1HMfSx9dMVJMYKmE1yuSf/22Wjo6VPFa405mCLUuQn9lbQvH2DZN9lt10ZNvtAg=="
+      "version": "1.4.3",
+      "resolved": "https://registry.npmjs.org/nwmatcher/-/nwmatcher-1.4.3.tgz",
+      "integrity": "sha512-IKdSTiDWCarf2JTS5e9e2+5tPZGdkRJ79XjYV0pzK8Q9BpsFyBq1RGKxzs7Q8UBushGw7m6TzVKz6fcY99iSWw=="
     },
     "oauth-sign": {
       "version": "0.8.2",
@@ -7933,9 +7390,9 @@
           "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg==",
           "dependencies": {
             "kind-of": {
-              "version": "5.0.2",
-              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.0.2.tgz",
-              "integrity": "sha512-ru8+TQHbN8956c7ZlkgK5Imjx0GMat3jN45GNIthpPeb+SzLrqSg/NG7llQtIqUTbrdu5Oi0lSnIoJmDTwwSzw=="
+              "version": "5.1.0",
+              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
+              "integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw=="
             }
           }
         },
@@ -8002,9 +7459,9 @@
       "integrity": "sha1-43rwTiOwkfZTYNsknbi7DzEpH2A="
     },
     "office-ui-fabric-react": {
-      "version": "5.7.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.7.0.tgz",
-      "integrity": "sha512-ibAhXKAWFsyL4jQXv9b7fy/NhVxXsjfO1HTOrNBDqD9M7Y938SCoq0qcMNRYtdrSTxdLMhRx23F5XxUxOHIECw=="
+      "version": "5.8.2",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.8.2.tgz",
+      "integrity": "sha512-Cu3vdwv6FDQJgaMEpH621TOC8UKDJdWKZLC45yUonX9SZx6DRlFKipceFMhko+FJ58lCLztv9aOcYGOrN5HvMg=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -8710,9 +8167,9 @@
       "integrity": "sha1-dFdoEWWZrKLwCfrUJrABdQSdjZI="
     },
     "postcss-loader": {
-      "version": "2.0.7",
-      "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-2.0.7.tgz",
-      "integrity": "sha512-eTPw6KbYiYpLJsTtevT4kX1aDL7HuSNmMWKLz/HascJClww/KJ3AWtMOY/z+sQd14F3SnIA/WE208/S7JDOzEQ=="
+      "version": "2.0.8",
+      "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-2.0.8.tgz",
+      "integrity": "sha512-KtXBiQ/r/WYW8LxTSJK7h8wLqvCMSub/BqmRnud/Mu8RzwflW9cmXxwsMwbn15TNv287Hcufdb3ZSs7xHKnG8Q=="
     },
     "postcss-merge-idents": {
       "version": "2.1.7",
@@ -9491,9 +8948,9 @@
       "integrity": "sha512-KLiwAXXfSWXZqGmZlnKPuGMTFp+0QbcySplL1ft9gfteT/BNsG64Xo8u2Qr9r+qnsIZWBQ66Zs8tg+8s2fmzvw=="
     },
     "private": {
-      "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/private/-/private-0.1.7.tgz",
-      "integrity": "sha1-aM5eih7woju1cMwoU3tTMqumPvE="
+      "version": "0.1.8",
+      "resolved": "https://registry.npmjs.org/private/-/private-0.1.8.tgz",
+      "integrity": "sha512-VvivMrbvd2nKkiG38qjULzlc+4Vx4wm/whI9pQD35YrARNnhxeiRktSOhSukRLFNlzg6Br/cJPet5J/u19r/mg=="
     },
     "process": {
       "version": "0.11.10",
@@ -9682,9 +9139,9 @@
       "integrity": "sha512-3WQCn3xqkbEUvxRUO3nkeqxMNgt1F4CyEU3BiUIrg7C71tnqjQIuSE7+JXp85yFl8X1iRTJouySNpwNqv4kiWg=="
     },
     "react-remarkable": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/react-remarkable/-/react-remarkable-1.1.2.tgz",
-      "integrity": "sha512-Sx8qreEu1jYJaVLtAbTZKHMxvJdzUJxSjbSHero961pO+FsXUENTFo23ieVHvPob74WH6/LR/6QSZTrUBghUWA=="
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/react-remarkable/-/react-remarkable-1.1.3.tgz",
+      "integrity": "sha512-H4kfiT0Q84OzNAcNfWKDMe1Xhm/7jJAIHV5n4mAff2N0nGpPtRN2M7zhLXaTalD5DNGCGKEq1b4XApZ/1QpKbg=="
     },
     "react-simple-di": {
       "version": "1.2.0",
@@ -11276,9 +10733,9 @@
       "integrity": "sha1-XAgOXWYcu+OCWdLnCjxyU+hziB0="
     },
     "ua-parser-js": {
-      "version": "0.7.14",
-      "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.14.tgz",
-      "integrity": "sha1-EQ1T+kw/MmwSEpK76skE0uAzh8o="
+      "version": "0.7.17",
+      "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.17.tgz",
+      "integrity": "sha512-uRdSdu1oA1rncCQL7sCj8vSyZkgtL7faaw9Tc9rZ3mGgraQ7+Pdx7w5mnOSF3gw9ZNG6oc+KXfkon3bKuROm0g=="
     },
     "uglify-js": {
       "version": "2.8.29",
@@ -11642,9 +11099,9 @@
       "integrity": "sha1-007++y7dp+HTtdvgcolRMhllFwk="
     },
     "webpack-dev-server": {
-      "version": "2.9.1",
-      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.9.1.tgz",
-      "integrity": "sha512-qFKs4Wg6JI6FkAQ6WFqeDCCxXEBLsDHkqJB3f9tmlqx8C68Y9vQWwcaMT4Q9H8WF32Q6QUNmgK4qQkdHfXvj/g==",
+      "version": "2.9.2",
+      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.9.2.tgz",
+      "integrity": "sha512-ppL53TttdTPfiZA4EphKRE4QgtXssjLdHBwNs/MOx/fWLHCrZ0JeyE+eFcHrAcv7qOJgvR5jFZ1quO7i1LNieA==",
       "dependencies": {
         "opn": {
           "version": "5.1.0",
@@ -11959,4 +11416,4 @@
       }
     }
   }
-}
+}
\ No newline at end of file
diff --git a/packages/experiments/jest.config.js b/packages/experiments/jest.config.js
index 8132ae9861d75..31e0e251fc61d 100644
--- a/packages/experiments/jest.config.js
+++ b/packages/experiments/jest.config.js
@@ -4,6 +4,9 @@ let path = require('path');
 const config = createConfig({
   setupFiles: [
     path.resolve(__dirname, 'lib/common/tests.js')
+  ],
+  snapshotSerializers: [
+    path.resolve(__dirname, './node_modules/@uifabric/jest-serializer-merge-styles')
   ]
 });
 
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 49b1b50862f7c..fbd898d703b2d 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -30,6 +30,7 @@
     "@types/webpack-env": "1.13.0",
     "@uifabric/example-app-base": ">=5.1.1 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
+    "@uifabric/jest-serializer-merge-styles": ">=5.0.0 <6.0.0",
     "es6-weak-map": "^2.0.2",
     "enzyme": "^2.9.1",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
diff --git a/packages/jest-serializer-merge-styles/.npmignore b/packages/jest-serializer-merge-styles/.npmignore
new file mode 100644
index 0000000000000..297907e771e9b
--- /dev/null
+++ b/packages/jest-serializer-merge-styles/.npmignore
@@ -0,0 +1,23 @@
+*.config.js
+*.nuspec
+*.yml
+*.test.*
+.editorconfig
+.gitattributes
+.gitignore
+.vscode
+coverage
+dist/*.stats.html
+dist/demo*.*
+gulpfile.js
+index.html
+jsconfig.json
+karma.config.js
+node_modules
+src
+tsconfig.json
+tsd.json
+tslint.json
+typings
+webpack.config.js
+jest.config.js
diff --git a/packages/jest-serializer-merge-styles/.npmrc b/packages/jest-serializer-merge-styles/.npmrc
new file mode 100644
index 0000000000000..825c83e09df4d
--- /dev/null
+++ b/packages/jest-serializer-merge-styles/.npmrc
@@ -0,0 +1,2 @@
+registry=https://registry.npmjs.org/
+
diff --git a/packages/jest-serializer-merge-styles/LICENSE b/packages/jest-serializer-merge-styles/LICENSE
new file mode 100644
index 0000000000000..e4cb6d1ead80b
--- /dev/null
+++ b/packages/jest-serializer-merge-styles/LICENSE
@@ -0,0 +1,15 @@
+Office UI Fabric React - jest-serializer-merge-styles
+
+Copyright (c) Microsoft Corporation
+
+All rights reserved.
+
+MIT License
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the ""Software""), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED *AS IS*, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
+Note: Usage of the fonts and icons referenced in Office UI Fabric is subject to the terms listed at http://aka.ms/fabric-assets-license
\ No newline at end of file
diff --git a/packages/jest-serializer-merge-styles/README.md b/packages/jest-serializer-merge-styles/README.md
new file mode 100644
index 0000000000000..c248fcbdbc703
--- /dev/null
+++ b/packages/jest-serializer-merge-styles/README.md
@@ -0,0 +1,47 @@
+# [jest-serializer-merge-styles](http://dev.office.com/fabric)
+
+Provides a Jest serializizer for `@uifabric/merge-styles` which expands class names into css rules.
+
+## Overview
+
+When using Jest snapshot testing with components that use `@uifabric/merge-styles`, class names may be rendered as such in the snapshot (Note the `css-2342` generated class name):
+
+```
+<div className='ms-Foo css-2432'>
+  Hello world
+</div>
+```
+
+Using this serializer, the generated `css-2342` class name will be auto expanded to the rules resolved by merge-styles:
+
+```
+<div
+  className=
+      ms-Foo
+      {
+        background-color: #f4f4f4;
+        box-sizing: border-box;
+        color: #333333;
+        cursor: pointer;
+      }
+      &:hover {
+        background-color: #f8f8f8;
+      }
+>
+  Hello world
+</div>
+```
+
+This means that your tests can pass reliably (no generated class names) and your rules get included in the snapshot. (Snapshots need updates when css is moved around.)
+
+## Usage
+
+In your jest.config.js (or appropriate config location) include a `snapshotSerializers` array that references this package:
+
+```js
+module.exports = {
+  snapshotSerializers: [
+    path.resolve(__dirname, 'jest-serializer-merge-styles')
+  ]
+}
+```
diff --git a/packages/jest-serializer-merge-styles/jest.config.js b/packages/jest-serializer-merge-styles/jest.config.js
new file mode 100644
index 0000000000000..a92c71220a900
--- /dev/null
+++ b/packages/jest-serializer-merge-styles/jest.config.js
@@ -0,0 +1,3 @@
+let { createConfig } = require('../../scripts/tasks/jest-resources');
+
+module.exports = createConfig();
diff --git a/packages/jest-serializer-merge-styles/package.json b/packages/jest-serializer-merge-styles/package.json
new file mode 100644
index 0000000000000..606bf1708e7ff
--- /dev/null
+++ b/packages/jest-serializer-merge-styles/package.json
@@ -0,0 +1,29 @@
+{
+  "name": "@uifabric/jest-serializer-merge-styles",
+  "version": "5.0.0",
+  "description": "Jest serializer for merge-styles.",
+  "main": "lib/index.js",
+  "typings": "lib/index.d.ts",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/OfficeDev/office-ui-fabric-react"
+  },
+  "license": "MIT",
+  "scripts": {
+    "build": "node ../../scripts/build.js",
+    "clean": "node ../../scripts/clean.js",
+    "start-test": "node ../../scripts/start-test.js"
+  },
+  "disabledTasks": [
+    "copy",
+    "sass",
+    "karma"
+  ],
+  "devDependencies": {
+    "@types/jest": "21.1.0",
+    "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
+  },
+  "dependencies": {
+    "@uifabric/merge-styles": ">=5.4.0 <6.0.0"
+  }
+}
\ No newline at end of file
diff --git a/packages/jest-serializer-merge-styles/src/index.test.tsx b/packages/jest-serializer-merge-styles/src/index.test.tsx
new file mode 100644
index 0000000000000..784fbbaa6207b
--- /dev/null
+++ b/packages/jest-serializer-merge-styles/src/index.test.tsx
@@ -0,0 +1,60 @@
+import { print, test } from './index';
+import { Stylesheet, InjectionMode, mergeStyles } from '@uifabric/merge-styles';
+
+const _stylesheet: Stylesheet = Stylesheet.getInstance();
+_stylesheet.setConfig({ injectionMode: InjectionMode.none });
+
+describe('test', () => {
+  beforeEach(() => {
+    _stylesheet.reset();
+  });
+
+  it('returns true if the attribute value contains merged styles', () => {
+    mergeStyles({ background: 'red', color: 'white' });
+    expect(test('a b css-0')).toEqual(true);
+    expect(test('a b')).toEqual(false);
+  });
+
+});
+
+describe('print', () => {
+  beforeEach(() => {
+    _stylesheet.reset();
+  });
+
+  it('can format, sort, and indent the class names', () => {
+
+    const indent = (val: string): string => '    ' + val;
+    const classNames = mergeStyles(
+      'ms-GlobalClassName',
+      {
+        color: 'white',
+        background: 'red',
+        selectors: {
+          ':hover': {
+            background: 'green'
+          }
+        }
+      }
+    );
+
+    expect(
+      print(
+        classNames,
+        () => '',
+        indent
+      )
+    ).toEqual([
+      '',
+      indent('ms-GlobalClassName'),
+      indent('{'),
+      indent('  background: red;'),
+      indent('  color: white;'),
+      indent('}'),
+      indent('&:hover {'),
+      indent('  background: green;'),
+      indent('}'),
+    ].join('\n'));
+  });
+
+});
\ No newline at end of file
diff --git a/packages/jest-serializer-merge-styles/src/index.ts b/packages/jest-serializer-merge-styles/src/index.ts
new file mode 100644
index 0000000000000..44c244fca9ab4
--- /dev/null
+++ b/packages/jest-serializer-merge-styles/src/index.ts
@@ -0,0 +1,62 @@
+import { Stylesheet } from '@uifabric/merge-styles';
+
+export function print(
+  val: string,
+  serialize: () => string,
+  indent: (val: string) => string
+): string {
+  const classNames = [];
+  const rules = [];
+  const parts = val.split(' ');
+
+  for (const part of parts) {
+    const ruleSet = Stylesheet.getInstance().insertedRulesFromClassName(part);
+
+    if (ruleSet) {
+      rules.push(_serializeRules(ruleSet, indent));
+    } else {
+      classNames.push(part);
+    }
+  }
+
+  return (
+    [
+      ``,
+      `${classNames.map((cn: string) => indent(cn)).join('\n')}`,
+      `${rules.join('\n')}`
+    ].join('\n')
+  );
+}
+
+export function test(val: string): boolean {
+  if (typeof val === 'string') {
+    const parts = val.split(' ');
+
+    return parts.some((part: string): boolean => !!Stylesheet.getInstance().insertedRulesFromClassName(part));
+  }
+
+  return false;
+}
+
+function _serializeRules(rules: string[], indent: (val: string) => string): string {
+  const ruleStrings: string[] = [];
+
+  for (let i = 0; i < rules.length; i += 2) {
+    const selector = rules[i];
+    const insertedRules = rules[i + 1];
+
+    if (insertedRules) {
+      ruleStrings.push(indent((i === 0 ? '' : selector + ' ') + `{`));
+
+      insertedRules.split(';').sort().forEach((rule: string) => {
+        if (rule) {
+          ruleStrings.push(indent('  ' + rule.replace(':', ': ') + ';'));
+        }
+      });
+
+      ruleStrings.push(indent('}'));
+    }
+  }
+
+  return ruleStrings.join('\n');
+}
\ No newline at end of file
diff --git a/packages/jest-serializer-merge-styles/tsconfig.json b/packages/jest-serializer-merge-styles/tsconfig.json
new file mode 100644
index 0000000000000..93c5fccb2af87
--- /dev/null
+++ b/packages/jest-serializer-merge-styles/tsconfig.json
@@ -0,0 +1,26 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "outDir": "lib",
+    "module": "commonjs",
+    "lib": [
+      "es2017",
+      "dom"
+    ],
+    "jsx": "react",
+    "declaration": true,
+    "sourceMap": true,
+    "experimentalDecorators": true,
+    "importHelpers": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "moduleResolution": "node",
+    "preserveConstEnums": true,
+    "types": [
+      "jest"
+    ]
+  },
+  "include": [
+    "src"
+  ]
+}
\ No newline at end of file
diff --git a/packages/jest-serializer-merge-styles/tslint.json b/packages/jest-serializer-merge-styles/tslint.json
new file mode 100644
index 0000000000000..009d06e3cf447
--- /dev/null
+++ b/packages/jest-serializer-merge-styles/tslint.json
@@ -0,0 +1,8 @@
+{
+  "extends": [
+    "office-ui-fabric-react-tslint"
+  ],
+  "rules": {
+    "prefer-const": true
+  }
+}
\ No newline at end of file
diff --git a/packages/merge-styles/gulpfile.js b/packages/merge-styles/gulpfile.js
deleted file mode 100644
index 8a0959526eaad..0000000000000
--- a/packages/merge-styles/gulpfile.js
+++ /dev/null
@@ -1,17 +0,0 @@
-'use strict';
-
-let gulp = require('gulp');
-let build = require('@microsoft/web-library-build');
-
-build.task('tslint', build.tslint);
-build.task('sass', build.sass);
-build.task('karma', build.karma);
-build.task('webpack', build.webpack);
-
-// initialize tasks.
-build.initialize(gulp);
-
-// Always fail on test failures.
-build.karma.setConfig({
-  failBuildOnErrors: true
-});
diff --git a/packages/office-ui-fabric-react/jest.config.js b/packages/office-ui-fabric-react/jest.config.js
index 8132ae9861d75..f21e20aca43f6 100644
--- a/packages/office-ui-fabric-react/jest.config.js
+++ b/packages/office-ui-fabric-react/jest.config.js
@@ -4,7 +4,10 @@ let path = require('path');
 const config = createConfig({
   setupFiles: [
     path.resolve(__dirname, 'lib/common/tests.js')
-  ]
+  ],
+  snapshotSerializers: [
+    path.resolve(__dirname, './node_modules/@uifabric/jest-serializer-merge-styles')
+  ],
 });
 
 module.exports = config;
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 5f8bf9b286921..27db1d1121280 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -27,6 +27,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
+    "@uifabric/jest-serializer-merge-styles": ">=5.0.0 <6.0.0",
     "@uifabric/example-app-base": ">=5.1.1 <6.0.0",
     "enzyme": "^2.9.1",
     "es6-promise": "^4.1.0",
diff --git a/rush.json b/rush.json
index f16cd7977b776..8fb498263a546 100644
--- a/rush.json
+++ b/rush.json
@@ -25,6 +25,11 @@
       "projectFolder": "packages/merge-styles",
       "shouldPublish": true
     },
+    {
+      "packageName": "@uifabric/jest-serializer-merge-styles",
+      "projectFolder": "packages/jest-serializer-merge-styles",
+      "shouldPublish": true
+    },
     {
       "packageName": "@uifabric/utilities",
       "projectFolder": "packages/utilities",
diff --git a/scripts/tasks/jest-resources.js b/scripts/tasks/jest-resources.js
index 4c792048fea90..2a145b8bc9850 100644
--- a/scripts/tasks/jest-resources.js
+++ b/scripts/tasks/jest-resources.js
@@ -44,10 +44,6 @@ const styleMockPath =
           path.resolve(__dirname, '../node_modules')
         ],
 
-        'snapshotSerializers': [
-          path.resolve(__dirname, 'jest-serializer-merge-styles')
-        ],
-
         globals: {
           'ts-jest': {
             tsConfigFile: path.resolve(process.cwd(), 'tsconfig.json')
diff --git a/scripts/tasks/jest-serializer-merge-styles.js b/scripts/tasks/jest-serializer-merge-styles.js
deleted file mode 100644
index bd59e50f7d69b..0000000000000
--- a/scripts/tasks/jest-serializer-merge-styles.js
+++ /dev/null
@@ -1,60 +0,0 @@
-let { Stylesheet } = require('@uifabric/merge-styles');
-
-module.exports = {
-  print(val, serialize, indent) {
-    let classNames = [];
-    let rules = [];
-    let parts = val.split(' ');
-
-    for (let part of parts) {
-      let ruleSet = Stylesheet.getInstance().insertedRulesFromClassName(part);
-
-      if (ruleSet) {
-        rules.push(serializeRules(ruleSet, indent));
-      } else {
-        classNames.push(part);
-      }
-    }
-
-    return (
-      [
-        ``,
-        `${classNames.map(cn => indent(cn)).join('\n')}`,
-        `${rules.join('\n')}`
-      ].join('\n')
-    );
-  },
-
-  test(val) {
-    if (typeof val === 'string') {
-      let parts = val.split(' ');
-
-      return parts.some(part => Stylesheet.getInstance().insertedRulesFromClassName(part));
-    }
-
-    return false;
-  }
-};
-
-function serializeRules(rules, indent) {
-  let ruleStrings = [];
-
-  for (let i = 0; i < rules.length; i += 2) {
-    const selector = rules[i];
-    const insertedRules = rules[i + 1];
-
-    if (insertedRules) {
-      ruleStrings.push(indent((i === 0 ? '' : selector + ' ') + `{`));
-
-      insertedRules.split(';').sort().forEach(rule => {
-        if (rule) {
-          ruleStrings.push(indent('  ' + rule.replace(':', ': ') + ';'));
-        }
-      });
-
-      ruleStrings.push(indent('}'));
-    }
-  }
-
-  return ruleStrings.join('\n');
-}
\ No newline at end of file

From a073712c6c61c65202fe7e2a3461ccd0f7dd6eec Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 16 Oct 2017 10:20:41 +0000
Subject: [PATCH 0857/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...rWeekNumbersSettings_2017-10-02-20-35.json | 11 -------
 .../fix-slider-css_2017-10-13-22-57.json      | 11 -------
 .../fix-slider-rounding_2017-10-13-17-25.json | 11 -------
 .../master_2017-09-06-10-30.json              | 11 -------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 31 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 ++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 13 files changed, 52 insertions(+), 52 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/datePickerWeekNumbersSettings_2017-10-02-20-35.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-slider-css_2017-10-13-22-57.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-slider-rounding_2017-10-13-17-25.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2017-09-06-10-30.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index d1047f8b31f58..639bf9cac47bf 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.8.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.9.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 85257f8fd3316..e01ae3921668f 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.8.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.9.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 2b1263d4e18b9..a776c65e088b4 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.8.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.9.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index db98b997b83f2..e6daeffd716e8 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.8.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.9.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index d136882ee690d..50ca18c784ed0 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.8.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.9.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/datePickerWeekNumbersSettings_2017-10-02-20-35.json b/common/changes/office-ui-fabric-react/datePickerWeekNumbersSettings_2017-10-02-20-35.json
deleted file mode 100644
index 44f18bc6145bc..0000000000000
--- a/common/changes/office-ui-fabric-react/datePickerWeekNumbersSettings_2017-10-02-20-35.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DatePicker getWeekNumbers function accepts firstWeekOfYear settings",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "yabern@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-slider-css_2017-10-13-22-57.json b/common/changes/office-ui-fabric-react/fix-slider-css_2017-10-13-22-57.json
deleted file mode 100644
index d838cf9542b83..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-slider-css_2017-10-13-22-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix Slider css so label does not break lines if value is long",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "a.erich@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-slider-rounding_2017-10-13-17-25.json b/common/changes/office-ui-fabric-react/fix-slider-rounding_2017-10-13-17-25.json
deleted file mode 100644
index 2e0c779d20b39..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-slider-rounding_2017-10-13-17-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix rounding issue in Slider when step is less than 1",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "a.erich@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2017-09-06-10-30.json b/common/changes/office-ui-fabric-react/master_2017-09-06-10-30.json
deleted file mode 100644
index ffcd47447902a..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2017-09-06-10-30.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix CommandButton styles for Nav entries",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "frdim@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index fbd898d703b2d..d11aaa6e80dce 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.8.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.9.0 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 5a522cfc534f1..efd624a689d39 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,37 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.9.0",
+      "tag": "office-ui-fabric-react_v5.9.0",
+      "date": "Mon, 16 Oct 2017 10:20:41 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Yana Bernadskaya <yabern@microsoft.com>",
+            "commit": "8e5a33aca736718ff5a8b5b22606d51809c222fe",
+            "comment": "DatePicker getWeekNumbers function accepts firstWeekOfYear settings"
+          }
+        ],
+        "patch": [
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "033885d41e71f8636d2a13d0a595cf9d41ef8018",
+            "comment": "Fix Slider css so label does not break lines if value is long"
+          },
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "b4f7b0fac2d6d1d6f668cda3c296fb68851c09b7",
+            "comment": "Fix rounding issue in Slider when step is less than 1"
+          },
+          {
+            "author": "cicciodm <f.dimauro92@gmail.com>",
+            "commit": "116176a27ab14f5dd20b79119dd2215727b350d3",
+            "comment": "Fix CommandButton styles for Nav entries"
+          }
+        ]
+      }
+    },
     {
       "version": "5.8.2",
       "tag": "office-ui-fabric-react_v5.8.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 57f37f00cd44c..567a6d7607451 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 13 Oct 2017 04:00:17 GMT and should not be manually modified.
+This log was last generated on Mon, 16 Oct 2017 10:20:41 GMT and should not be manually modified.
+
+## 5.9.0
+Mon, 16 Oct 2017 10:20:41 GMT
+
+### Minor changes
+
+- DatePicker getWeekNumbers function accepts firstWeekOfYear settings
+
+### Patches
+
+- Fix Slider css so label does not break lines if value is long
+- Fix rounding issue in Slider when step is less than 1
+- Fix CommandButton styles for Nav entries
 
 ## 5.8.2
 Fri, 13 Oct 2017 04:00:17 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 27db1d1121280..2cf729e86d324 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.8.2",
+  "version": "5.9.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From b75c8c6ac7e0049598499784d1d1f7b4ffe67688 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 16 Oct 2017 11:32:47 -0700
Subject: [PATCH 0858/1641] Update README.md

---
 packages/jest-serializer-merge-styles/README.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/jest-serializer-merge-styles/README.md b/packages/jest-serializer-merge-styles/README.md
index c248fcbdbc703..5148aa96e6195 100644
--- a/packages/jest-serializer-merge-styles/README.md
+++ b/packages/jest-serializer-merge-styles/README.md
@@ -1,6 +1,6 @@
 # [jest-serializer-merge-styles](http://dev.office.com/fabric)
 
-Provides a Jest serializizer for `@uifabric/merge-styles` which expands class names into css rules.
+Provides a Jest serializer for `@uifabric/merge-styles` which expands class names into css rules.
 
 ## Overview
 
@@ -32,7 +32,7 @@ Using this serializer, the generated `css-2342` class name will be auto expanded
 </div>
 ```
 
-This means that your tests can pass reliably (no generated class names) and your rules get included in the snapshot. (Snapshots need updates when css is moved around.)
+This means that your tests can pass reliably (no generated class names) and your rules get included in the snapshot. (Snapshots need updates when css is altered.)
 
 ## Usage
 

From b21ddc7fb0efd0ca2b7fb6e990e0db7eeaee6ebc Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 16 Oct 2017 12:17:23 -0700
Subject: [PATCH 0859/1641] Dropdown: now with less crash (#3125)

* Fixing dropdown.

* Adding change file.

* oops.

* uh fixing unnecessaries.
---
 .../fix-dropdown_2017-10-16-17-38.json                | 11 +++++++++++
 .../src/components/Dropdown/Dropdown.tsx              | 10 ++++++----
 2 files changed, 17 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-dropdown_2017-10-16-17-38.json

diff --git a/common/changes/office-ui-fabric-react/fix-dropdown_2017-10-16-17-38.json b/common/changes/office-ui-fabric-react/fix-dropdown_2017-10-16-17-38.json
new file mode 100644
index 0000000000000..7dc41d77950e3
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-dropdown_2017-10-16-17-38.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: Fixing nullref when nothing is selected in multi select rendering.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index b699eccec7f58..14420ef2acac3 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -557,11 +557,13 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   private _getAllSelectedOptions(options: IDropdownOption[], selectedIndices: number[]) {
     let selectedOptions: IDropdownOption[] = [];
     for (let index of selectedIndices) {
-      selectedOptions.push(options[index]);
-    }
-    if (selectedOptions.length < 1) {
-      return [];
+      const option = options[index];
+
+      if (option) {
+        selectedOptions.push(option);
+      }
     }
+
     return selectedOptions;
   }
 

From bbccb7d7ef5562bc6ed7a7c8c9e68bd7c4786496 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Mon, 16 Oct 2017 12:23:38 -0700
Subject: [PATCH 0860/1641] Website: Updating the FabricCore package (#3124)

* Updated fabric-core range in package.json

* Updated shrinkwrap

* Updated website docs to most recent fabric core

* Added change file

* Removed fsevents object
---
 apps/fabric-website/package.json              |  2 +-
 .../src/pages/GetStarted/GetStartedPage.tsx   |  2 +-
 apps/fabric-website/src/root.tsx              |  2 +-
 .../update-fabric-core_2017-10-16-16-29.json  | 11 ++++++++++
 .../update-fabric-core_2017-10-16-16-29.json  | 11 ++++++++++
 common/config/rush/npm-shrinkwrap.json        | 22 +++++++++++--------
 ghdocs/README.md                              |  2 +-
 7 files changed, 39 insertions(+), 13 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/update-fabric-core_2017-10-16-16-29.json
 create mode 100644 common/changes/office-ui-fabric-react/update-fabric-core_2017-10-16-16-29.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 639bf9cac47bf..88921dd28eabc 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -33,7 +33,7 @@
     "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
     "highlight.js": "^9.6.0",
-    "office-ui-fabric-core": ">=7.1.2 <8.0.0",
+    "office-ui-fabric-core": ">=9.0.0 <10.0.0",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
index 4852fc2abc370..debedd21e98e5 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
@@ -185,7 +185,7 @@ initializeIcons('https://my.cdn.com/path/to/icons/');`
               <p>Add the following line to the &lt;head&gt; of your webpage:</p>
               <CodeBlock language='html' isLightTheme={ true }>
                 {
-                  `<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/7.3.0/css/fabric.min.css">`
+                  `<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/9.0.0/css/fabric.min.css">`
                 }
               </CodeBlock>
             </li>
diff --git a/apps/fabric-website/src/root.tsx b/apps/fabric-website/src/root.tsx
index f2966c313bf06..53f9a873a2f0f 100644
--- a/apps/fabric-website/src/root.tsx
+++ b/apps/fabric-website/src/root.tsx
@@ -145,4 +145,4 @@ function addCSSToHeader(fileName: string) {
   headEl.appendChild(linkEl);
 }
 
-addCSSToHeader('https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/7.3.0/css/fabric.min.css');
+addCSSToHeader('https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/9.0.0/css/fabric.min.css');
diff --git a/common/changes/@uifabric/fabric-website/update-fabric-core_2017-10-16-16-29.json b/common/changes/@uifabric/fabric-website/update-fabric-core_2017-10-16-16-29.json
new file mode 100644
index 0000000000000..372360413d647
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/update-fabric-core_2017-10-16-16-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Updating to Fabric Core 9.0",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/update-fabric-core_2017-10-16-16-29.json b/common/changes/office-ui-fabric-react/update-fabric-core_2017-10-16-16-29.json
new file mode 100644
index 0000000000000..fa56624830c7b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/update-fabric-core_2017-10-16-16-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Updating shrinkwrap for Fabric Core package update",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 4f16025a83d65..6e3b753313bfe 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -1410,6 +1410,10 @@
           "version": "2.0.0",
           "bundled": true
         },
+        "office-ui-fabric-core": {
+          "version": "7.3.0",
+          "bundled": true
+        },
         "os-browserify": {
           "version": "0.2.1",
           "bundled": true
@@ -7454,14 +7458,14 @@
       "integrity": "sha1-EEEktsYCxnlogaBCVB0220OlJk4="
     },
     "office-ui-fabric-core": {
-      "version": "7.3.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-7.3.0.tgz",
-      "integrity": "sha1-43rwTiOwkfZTYNsknbi7DzEpH2A="
+      "version": "9.0.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-9.0.0.tgz",
+      "integrity": "sha512-ufX0JB8kePhv4DZNeOzJmkG4J5JMDUnEx22xlYc7yEpByaqTsVl9CWixrKvOlN27+LsnUoU0GqwgspFZd5OaJw=="
     },
     "office-ui-fabric-react": {
-      "version": "5.8.2",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.8.2.tgz",
-      "integrity": "sha512-Cu3vdwv6FDQJgaMEpH621TOC8UKDJdWKZLC45yUonX9SZx6DRlFKipceFMhko+FJ58lCLztv9aOcYGOrN5HvMg=="
+      "version": "5.9.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.9.0.tgz",
+      "integrity": "sha512-+WuNSZEaCREhcJrDJXgpwCkWVWhZ24dOC4mbt7TgFMaXQTFeFrYOG7viRtad8E8yUBNIJ4SSHFDjPTcvfh+RHw=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -11111,9 +11115,9 @@
       }
     },
     "webpack-hot-middleware": {
-      "version": "2.19.1",
-      "resolved": "https://registry.npmjs.org/webpack-hot-middleware/-/webpack-hot-middleware-2.19.1.tgz",
-      "integrity": "sha512-2x60xmz7XBCNN/Drol+7i85E/5RrNrf+ivOPCgrxhP1F3q3WxpVjjvj8n8fOS1bS9oTRKEDfBYVAtkxqsG7LwQ=="
+      "version": "2.20.0",
+      "resolved": "https://registry.npmjs.org/webpack-hot-middleware/-/webpack-hot-middleware-2.20.0.tgz",
+      "integrity": "sha512-AYwVG9DCvMoXbwx8eK16CbJY3Ltwap44lW3T7hFsE0U3zRwtViHMw1DFpY5hMwXNqKsUk3HtNcf3PoV+gIxJeg=="
     },
     "webpack-notifier": {
       "version": "1.5.0",
diff --git a/ghdocs/README.md b/ghdocs/README.md
index 3b6c30acf5688..a72bbbfbda658 100644
--- a/ghdocs/README.md
+++ b/ghdocs/README.md
@@ -124,7 +124,7 @@ You can specify the default direction in your `index.html`. Add the `dir` attrib
 Load Office UI Fabric styles by linking to the Office UI Fabric CDN. Add the following to the `<head`> element:
 
 ```html
-<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/7.3.0/css/fabric.min.css">
+<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/9.0.0/css/fabric.min.css">
 ```
 
 Save the file.

From 0ae5a1fd8ba6664a3f947619dcceaed2bdc23200 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 16 Oct 2017 20:00:51 +0000
Subject: [PATCH 0861/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 19 +++++++++++++++++++
 apps/fabric-website/CHANGELOG.md              |  9 ++++++++-
 apps/fabric-website/package.json              |  4 ++--
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../update-fabric-core_2017-10-16-16-29.json  | 11 -----------
 .../fix-dropdown_2017-10-16-17-38.json        | 11 -----------
 .../update-fabric-core_2017-10-16-16-29.json  | 11 -----------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 14 files changed, 63 insertions(+), 43 deletions(-)
 delete mode 100644 common/changes/@uifabric/fabric-website/update-fabric-core_2017-10-16-16-29.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-dropdown_2017-10-16-17-38.json
 delete mode 100644 common/changes/office-ui-fabric-react/update-fabric-core_2017-10-16-16-29.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index bf4c7b8b9bc89..b908b3c302a2b 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.0.11",
+      "tag": "@uifabric/fabric-website_v5.0.11",
+      "date": "Mon, 16 Oct 2017 20:00:51 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "bbccb7d7ef5562bc6ed7a7c8c9e68bd7c4786496",
+            "comment": "Updating to Fabric Core 9.0"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.9.0 <6.0.0` to `>=5.9.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.10",
       "tag": "@uifabric/fabric-website_v5.0.10",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index dcb37bcb3c88a..f44b5ef70f216 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Thu, 12 Oct 2017 10:20:49 GMT and should not be manually modified.
+This log was last generated on Mon, 16 Oct 2017 20:00:51 GMT and should not be manually modified.
+
+## 5.0.11
+Mon, 16 Oct 2017 20:00:51 GMT
+
+### Patches
+
+- Updating to Fabric Core 9.0
 
 ## 5.0.10
 Thu, 12 Oct 2017 10:20:49 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 88921dd28eabc..68cbcd2e5d68a 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.0.10",
+  "version": "5.0.11",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.9.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.9.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index e01ae3921668f..03c2a7835d70a 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.9.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.9.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index a776c65e088b4..fe11d69d29ac3 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.9.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.9.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index e6daeffd716e8..6f0f16a3c2f7f 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.9.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.9.1 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 50ca18c784ed0..e8e9b31f69f03 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.9.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.9.1 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/fabric-website/update-fabric-core_2017-10-16-16-29.json b/common/changes/@uifabric/fabric-website/update-fabric-core_2017-10-16-16-29.json
deleted file mode 100644
index 372360413d647..0000000000000
--- a/common/changes/@uifabric/fabric-website/update-fabric-core_2017-10-16-16-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Updating to Fabric Core 9.0",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-dropdown_2017-10-16-17-38.json b/common/changes/office-ui-fabric-react/fix-dropdown_2017-10-16-17-38.json
deleted file mode 100644
index 7dc41d77950e3..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-dropdown_2017-10-16-17-38.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: Fixing nullref when nothing is selected in multi select rendering.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/update-fabric-core_2017-10-16-16-29.json b/common/changes/office-ui-fabric-react/update-fabric-core_2017-10-16-16-29.json
deleted file mode 100644
index fa56624830c7b..0000000000000
--- a/common/changes/office-ui-fabric-react/update-fabric-core_2017-10-16-16-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Updating shrinkwrap for Fabric Core package update",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index d11aaa6e80dce..83553bdc135e1 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.9.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.9.1 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index efd624a689d39..4383fbab4b233 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.9.1",
+      "tag": "office-ui-fabric-react_v5.9.1",
+      "date": "Mon, 16 Oct 2017 20:00:51 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "b21ddc7fb0efd0ca2b7fb6e990e0db7eeaee6ebc",
+            "comment": "Dropdown: Fixing nullref when nothing is selected in multi select rendering."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "bbccb7d7ef5562bc6ed7a7c8c9e68bd7c4786496",
+            "comment": "Updating shrinkwrap for Fabric Core package update"
+          }
+        ]
+      }
+    },
     {
       "version": "5.9.0",
       "tag": "office-ui-fabric-react_v5.9.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 567a6d7607451..c78681d1409b5 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 16 Oct 2017 10:20:41 GMT and should not be manually modified.
+This log was last generated on Mon, 16 Oct 2017 20:00:51 GMT and should not be manually modified.
+
+## 5.9.1
+Mon, 16 Oct 2017 20:00:51 GMT
+
+### Patches
+
+- Dropdown: Fixing nullref when nothing is selected in multi select rendering.
+- Updating shrinkwrap for Fabric Core package update
 
 ## 5.9.0
 Mon, 16 Oct 2017 10:20:41 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 2cf729e86d324..bbd447a0a1475 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.9.0",
+  "version": "5.9.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 7dd6bcaeda6837c202f443002a1ee5de5d64cc14 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 16 Oct 2017 15:37:23 -0700
Subject: [PATCH 0862/1641] Nav: Adding missing reference in index. (#3131)

* Fixing import.

* change file.
---
 .../fix-amd-import_2017-10-16-22-36.json              | 11 +++++++++++
 .../office-ui-fabric-react/src/components/Nav/Nav.tsx |  3 +--
 2 files changed, 12 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-amd-import_2017-10-16-22-36.json

diff --git a/common/changes/office-ui-fabric-react/fix-amd-import_2017-10-16-22-36.json b/common/changes/office-ui-fabric-react/fix-amd-import_2017-10-16-22-36.json
new file mode 100644
index 0000000000000..9c98d05212510
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-amd-import_2017-10-16-22-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Nav: fixing amd-incompatible import.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
index e0b0f2104d7cc..1ddffa0c49627 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
@@ -7,13 +7,12 @@ import {
   getNativeProps,
   getRTL
 } from '../../Utilities';
-import { mergeStyles } from '@uifabric/styling';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { ActionButton, IButtonStyles } from '../../Button';
 import { Icon } from '../../Icon';
 import * as stylesImport from './Nav.scss';
 const styles: any = stylesImport;
-import { AnimationClassNames } from '../../Styling';
+import { AnimationClassNames, mergeStyles } from '../../Styling';
 import {
   INav,
   INavProps,

From 18046e1a9d29d0a1998b5d472b9320f29ef4c6a4 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 16 Oct 2017 22:49:02 +0000
Subject: [PATCH 0863/1641] Applying package updates.

---
 apps/fabric-website/package.json                   |  2 +-
 apps/ssr-tests/package.json                        |  2 +-
 apps/test-bundle-button/package.json               |  2 +-
 apps/todo-app/package.json                         |  2 +-
 apps/vr-tests/package.json                         |  2 +-
 .../fix-amd-import_2017-10-16-22-36.json           | 11 -----------
 packages/experiments/package.json                  |  2 +-
 packages/office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md       |  9 ++++++++-
 packages/office-ui-fabric-react/package.json       |  2 +-
 10 files changed, 29 insertions(+), 19 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/fix-amd-import_2017-10-16-22-36.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 68cbcd2e5d68a..8748a8b5650ec 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.9.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.9.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 03c2a7835d70a..59ee998a7bda8 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.9.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.9.2 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index fe11d69d29ac3..c309a10d0f05e 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.9.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.9.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 6f0f16a3c2f7f..d38b131840d43 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.9.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.9.2 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index e8e9b31f69f03..90f397496feb8 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.9.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.9.2 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/fix-amd-import_2017-10-16-22-36.json b/common/changes/office-ui-fabric-react/fix-amd-import_2017-10-16-22-36.json
deleted file mode 100644
index 9c98d05212510..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-amd-import_2017-10-16-22-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Nav: fixing amd-incompatible import.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 83553bdc135e1..f048b8f402501 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.9.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.9.2 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 4383fbab4b233..323971d286480 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.9.2",
+      "tag": "office-ui-fabric-react_v5.9.2",
+      "date": "Mon, 16 Oct 2017 22:49:01 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "7dd6bcaeda6837c202f443002a1ee5de5d64cc14",
+            "comment": "Nav: fixing amd-incompatible import."
+          }
+        ]
+      }
+    },
     {
       "version": "5.9.1",
       "tag": "office-ui-fabric-react_v5.9.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index c78681d1409b5..c4959758fef1d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 16 Oct 2017 20:00:51 GMT and should not be manually modified.
+This log was last generated on Mon, 16 Oct 2017 22:49:01 GMT and should not be manually modified.
+
+## 5.9.2
+Mon, 16 Oct 2017 22:49:01 GMT
+
+### Patches
+
+- Nav: fixing amd-incompatible import.
 
 ## 5.9.1
 Mon, 16 Oct 2017 20:00:51 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index bbd447a0a1475..4990a941443d9 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.9.1",
+  "version": "5.9.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 44391e1f9fc8724a690e74ea9ea2ea34ab1c0047 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Mon, 16 Oct 2017 17:35:07 -0700
Subject: [PATCH 0864/1641] ContextualMenu: Make it possible for menu items
 using onRender to dismiss the menu (#3105)

* Add a parameter to onRender that can be used to dismiss a menu

* Update example and make it compile

* Rush change

* Update the property name

* Rename example as well

* Fix build break
---
 .../onDismissRenderParam_2017-10-12-23-26.json    | 11 +++++++++++
 .../src/components/CommandBar/CommandBar.tsx      |  6 +++++-
 .../src/components/CommandBar/CommandBar.tsx      |  2 +-
 .../ContextualMenu/ContextualMenu.Props.ts        |  5 ++++-
 .../components/ContextualMenu/ContextualMenu.tsx  |  2 +-
 .../ContextualMenu.Customization.Example.tsx      | 15 ++-------------
 6 files changed, 24 insertions(+), 17 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/onDismissRenderParam_2017-10-12-23-26.json

diff --git a/common/changes/office-ui-fabric-react/onDismissRenderParam_2017-10-12-23-26.json b/common/changes/office-ui-fabric-react/onDismissRenderParam_2017-10-12-23-26.json
new file mode 100644
index 0000000000000..828591f6e1221
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/onDismissRenderParam_2017-10-12-23-26.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: Pass in a menu dismiss function into onRender to allow custom rendered menu items to dismiss the menu",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.tsx b/packages/experiments/src/components/CommandBar/CommandBar.tsx
index 0e7d87703720e..0d0d70f537b72 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBar.tsx
@@ -183,7 +183,11 @@ export class CommandBar extends BaseComponent<ICommandBarProps, {}> implements I
   private _onRenderItems(item: ICommandBarItemProps): JSX.Element | React.ReactNode {
     let { buttonStyles } = this.props;
 
-    if (item.onRender) { return item.onRender(item); }
+    if (item.onRender) {
+      // These are the top level items, there is no relevant menu dismissing function to
+      // provide for the IContextualMenuItem onRender function. Pass in a no op function instead.
+      return item.onRender(item, () => undefined);
+    }
     const commandButtonProps: ICommandBarItemProps = {
       ...item,
       styles: { root: { height: COMMANDBAR_HEIGHT }, ...item.styles, ...buttonStyles },
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 4a1516cf32b5a..9f4fe727f56a3 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -166,7 +166,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
     if (item.onRender) {
       return (
         <div className={ css('ms-CommandBarItem', styles.item, item.className) } key={ item.key } ref={ item.key }>
-          { item.onRender(item) }
+          { item.onRender(item, this._onContextMenuDismiss) }
         </div>
       );
     }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
index ee2b3aadc5906..8c389fa4ce9d7 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
@@ -354,9 +354,12 @@ export interface IContextualMenuItem {
    * Method to custom render this menu item.
    * For keyboard accessibility, the top-level rendered item should be a focusable element
    * (like an anchor or a button) or have the `data-is-focusable` property set to true.
+   *
+   * The function receives a function that can be called to dismiss the menu as a second argument.
+   *  This can be used to make sure that a custom menu item click dismisses the menu.
    * @defaultvalue undefined
    */
-  onRender?: (item: any) => React.ReactNode;
+  onRender?: (item: any, dismissMenu: (ev?: any, dismissAll?: boolean) => void) => React.ReactNode;
 
   /**
    * A function to be executed onMouseDown. This is executed before an onClick event and can
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index de1cb057ea459..5bb665519e2cc 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -411,7 +411,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
   private _renderNormalItem(item: IContextualMenuItem, classNames: IMenuItemClassNames, index: number, focusableElementIndex: number, totalItemCount: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
     if (item.onRender) {
-      return [item.onRender(item)];
+      return [item.onRender(item, this.dismiss)];
     }
     if (item.href) {
       return this._renderAnchorMenuItem(item, classNames, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons);
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
index 845d48999c123..c5b6e1612c566 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
@@ -6,13 +6,9 @@ import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import './ContextualMenuExample.scss';
 
 export class ContextualMenuCustomizationExample extends React.Component<{}, {}> {
-  private _button: IButton | undefined;
-
   public render() {
     return (
       <DefaultButton
-        // tslint:disable-next-line:jsx-no-lambda
-        componentRef={ (button) => this._button = button }
         className='ContextualMenuButton3'
         text='Click for ContextualMenu'
         menuProps={
@@ -192,20 +188,13 @@ export class ContextualMenuCustomizationExample extends React.Component<{}, {}>
   }
 
   @autobind
-  private _dismissMenu() {
-    if (this._button) {
-      this._button.dismissMenu();
-    }
-  }
-
-  @autobind
-  private _renderCharmMenuItem(item: any) {
+  private _renderCharmMenuItem(item: any, dismissMenu: () => void) {
     return (
       <IconButton
         iconProps={ { iconName: item.name } }
         className='ms-ContextualMenu-customizationExample-icon ms-ContextualMenu-link'
         data-is-focusable={ true }
-        onClick={ this._dismissMenu }
+        onClick={ dismissMenu }
       />
     );
   }

From 807f6afe2fc8019f6c068f909a4be8ceeb9c8e9a Mon Sep 17 00:00:00 2001
From: cicciodm <f.dimauro92@gmail.com>
Date: Tue, 17 Oct 2017 17:40:09 +0200
Subject: [PATCH 0865/1641] SearchBox: Expose onKeyDown Event by invoking an
 external prop (#3128)

* SearchBox: Expose onKeyDown Event by invoking an external prop

* Adding changefile
---
 ...cicciodm-searchBox-onKeyDown_2017-10-16-21-18.json | 11 +++++++++++
 .../src/components/SearchBox/SearchBox.tsx            |  6 +++++-
 2 files changed, 16 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/cicciodm-searchBox-onKeyDown_2017-10-16-21-18.json

diff --git a/common/changes/office-ui-fabric-react/cicciodm-searchBox-onKeyDown_2017-10-16-21-18.json b/common/changes/office-ui-fabric-react/cicciodm-searchBox-onKeyDown_2017-10-16-21-18.json
new file mode 100644
index 0000000000000..2957e9cf1d322
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/cicciodm-searchBox-onKeyDown_2017-10-16-21-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SearchBox: expose onKeyDown event by invoking external prop",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "f.dimauro92@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
index 29ffa5350e57c..553c167ded8c4 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
@@ -145,7 +145,11 @@ export class SearchBox extends BaseComponent<ISearchBoxProps, ISearchBoxState> {
         break;
 
       default:
-        return;
+        if (this.props.onKeyDown) {
+          this.props.onKeyDown(ev);
+        } else {
+          return;
+        }
     }
 
     // We only get here if the keypress has been handled.

From ddecb07ddeb35964ee17705d2ebccabd6c44f8dd Mon Sep 17 00:00:00 2001
From: amyngu <31973030+amyngu@users.noreply.github.com>
Date: Tue, 17 Oct 2017 09:52:39 -0700
Subject: [PATCH 0866/1641] Create extended picker and base floating picker
 experiments (#3045)

* start basewell and basefloating pickers

* experimental well people picker

* move everything to experiments, rename, create test pages

* remove old files

* Add change files

* Fix tslint issues

* Create ExtendedPicker by extending BasePicker, remove BaseWellPicker

* fix tslint issues, pass in suggestions controller

* make floatingPickerType mandatory, update change file

* use target, instead of targetElement

* remove IPersonaProps, keep items generic
---
 ...ndBaseFloatingPicker_2017-10-05-17-24.json |  11 +
 packages/experiments/src/ExtendedPicker.ts    |   1 +
 .../BaseExtendedPicker.Props.ts               |  11 +
 .../ExtendedPicker/BaseExtendedPicker.scss    |  32 ++
 .../ExtendedPicker/BaseExtendedPicker.tsx     | 100 ++++
 .../BaseFloatingPicker.Props.ts               |  98 ++++
 .../ExtendedPicker/BaseFloatingPicker.tsx     | 477 ++++++++++++++++++
 .../PeoplePicker/ExtendedPeoplePicker.tsx     |  30 ++
 .../PeoplePicker/ExtendedPeoplePickerPage.tsx |  73 +++
 .../PeoplePicker/FloatingPeoplePicker.tsx     |  38 ++
 .../PeoplePicker/FloatingPeoplePickerPage.tsx |  66 +++
 .../PeoplePicker/PeoplePicker.scss            |  30 ++
 .../PeoplePickerItems/PickerItemsDefault.scss | 117 +++++
 .../PeoplePickerItems/SelectedItemDefault.tsx |  63 +++
 .../SuggestionItemDefault.tsx                 |  22 +
 .../ExtendedPeoplePicker.Basic.Example.scss   |   9 +
 .../ExtendedPeoplePicker.Basic.Example.tsx    | 174 +++++++
 .../FloatingPeoplePicker.Basic.Example.tsx    | 173 +++++++
 .../examples/PeoplePickerExampleData.ts       | 408 +++++++++++++++
 .../src/components/ExtendedPicker/index.ts    |   5 +
 .../experiments/src/demo/AppDefinition.tsx    |  12 +
 packages/experiments/src/index.ts             |   3 +-
 22 files changed, 1952 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/experiments/createBaseWellPickerAndBaseFloatingPicker_2017-10-05-17-24.json
 create mode 100644 packages/experiments/src/ExtendedPicker.ts
 create mode 100644 packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.Props.ts
 create mode 100644 packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.scss
 create mode 100644 packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
 create mode 100644 packages/experiments/src/components/ExtendedPicker/BaseFloatingPicker.Props.ts
 create mode 100644 packages/experiments/src/components/ExtendedPicker/BaseFloatingPicker.tsx
 create mode 100644 packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.tsx
 create mode 100644 packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePickerPage.tsx
 create mode 100644 packages/experiments/src/components/ExtendedPicker/PeoplePicker/FloatingPeoplePicker.tsx
 create mode 100644 packages/experiments/src/components/ExtendedPicker/PeoplePicker/FloatingPeoplePickerPage.tsx
 create mode 100644 packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePicker.scss
 create mode 100644 packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
 create mode 100644 packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
 create mode 100644 packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
 create mode 100644 packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/ExtendedPeoplePicker.Basic.Example.scss
 create mode 100644 packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
 create mode 100644 packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
 create mode 100644 packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/PeoplePickerExampleData.ts
 create mode 100644 packages/experiments/src/components/ExtendedPicker/index.ts

diff --git a/common/changes/@uifabric/experiments/createBaseWellPickerAndBaseFloatingPicker_2017-10-05-17-24.json b/common/changes/@uifabric/experiments/createBaseWellPickerAndBaseFloatingPicker_2017-10-05-17-24.json
new file mode 100644
index 0000000000000..15c945c7df075
--- /dev/null
+++ b/common/changes/@uifabric/experiments/createBaseWellPickerAndBaseFloatingPicker_2017-10-05-17-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Create BaseExtendedPicker which extends current BasePicker to experiment with adding new functionality and create BaseFloatingPicker support @mention like scenarios, respectively",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "amyngu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/ExtendedPicker.ts b/packages/experiments/src/ExtendedPicker.ts
new file mode 100644
index 0000000000000..f7300314ceac2
--- /dev/null
+++ b/packages/experiments/src/ExtendedPicker.ts
@@ -0,0 +1 @@
+export * from './components/ExtendedPicker/index';
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.Props.ts b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.Props.ts
new file mode 100644
index 0000000000000..9f2bcad8b5c9f
--- /dev/null
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.Props.ts
@@ -0,0 +1,11 @@
+
+import { IBasePickerProps } from 'office-ui-fabric-react/lib/Pickers';
+import { IBaseFloatingPickerProps } from './BaseFloatingPicker.Props';
+import { BaseFloatingPicker } from './BaseFloatingPicker';
+
+export interface IBaseExtendedPickerProps<T> extends IBasePickerProps<T> {
+  /**
+ * The floating picker type
+ */
+  floatingPickerType: new (props: IBaseFloatingPickerProps<T>) => BaseFloatingPicker<T, IBaseFloatingPickerProps<T>>;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.scss b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.scss
new file mode 100644
index 0000000000000..b14a992fde4f9
--- /dev/null
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.scss
@@ -0,0 +1,32 @@
+@import '~office-ui-fabric-react/src/common/common';
+
+.pickerText {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  box-sizing: border-box;
+  border: 1px solid $ms-color-neutralTertiary;
+  min-width: 180px;
+  padding: 1px;
+  min-height: 32px;
+  &:hover {
+    border-color: $ms-color-themeLight;
+  }
+
+  &.inputFocused {
+    border-color: $ms-color-themePrimary;
+  }
+}
+
+.pickerInput {
+  height: 34px;
+  border: none;
+  flex-grow: 1;
+  outline: none;
+  padding: 0 6px 0px;
+  margin: 1px;
+}
+
+.screenReaderOnly {
+  @include ms-screenReaderOnly;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
new file mode 100644
index 0000000000000..6ba4cb34daf93
--- /dev/null
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
@@ -0,0 +1,100 @@
+/* tslint:disable */
+import * as React from 'react';
+/* tslint:enable */
+import { BasePicker, BaseAutoFill } from 'office-ui-fabric-react/lib/Pickers';
+import { autobind, KeyCodes } from '../../Utilities';
+import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
+import { IObjectWithKey } from 'office-ui-fabric-react/src/utilities/selection/index';
+import { IBaseFloatingPickerProps } from './BaseFloatingPicker.Props';
+import { IBaseExtendedPickerProps } from './BaseExtendedPicker.Props';
+import { BaseFloatingPicker } from './BaseFloatingPicker';
+
+export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extends BasePicker<T, P> {
+
+  protected floatingPicker: BaseFloatingPicker<IPersonaProps, IBaseFloatingPickerProps<IPersonaProps>>;
+
+  public componentDidMount(): void {
+    this.selection.setItems(this.state.items as IObjectWithKey[]);
+    this.forceUpdate();
+  }
+
+  protected renderSuggestions(): JSX.Element | null {
+    let TypedFloatingPicker = this.props.floatingPickerType as (new (props: IBaseFloatingPickerProps<IPersonaProps>) =>
+      BaseFloatingPicker<IPersonaProps, IBaseFloatingPickerProps<IPersonaProps>>);
+    return (
+      <TypedFloatingPicker
+        suggestionsController={ this.suggestionStore }
+        onZeroQuerySuggestion={ this.props.onEmptyInputFocus }
+        onRenderSuggestionsItem={ this.props.onRenderSuggestionsItem }
+        onResolveSuggestions={ this.props.onResolveSuggestions }
+        onGetMoreResults={ this.props.onGetMoreResults }
+        onRemoveSuggestion={ this.props.onRemoveSuggestion }
+        onValidateInput={ this.props.onValidateInput }
+        createGenericItem={ this.props.createGenericItem }
+        getTextFromItem={ this.props.getTextFromItem }
+        pickerSuggestionsProps={ this.props.pickerSuggestionsProps }
+        ref={ this._resolveRef('floatingPicker') }
+        onChange={ this.addItem }
+        inputElement={ this.input ? this.input.inputElement : undefined }
+        selectedItems={ this.state.items }
+      />
+    );
+  }
+
+  // This is protected because we may expect the backspace key to work differently in a different kind of picker.
+  // This lets the subclass override it and provide it's own onBackspace. For an example see the BasePickerListBelow
+  @autobind
+  protected onBackspace(ev: React.KeyboardEvent<HTMLElement>): void {
+    if (ev.which !== KeyCodes.backspace) {
+      return;
+    }
+    if (this.state.items.length && !this.input || !this.input.isValueSelected) {
+      if (this.selection.getSelectedCount() > 0) {
+        ev.preventDefault();
+        this.removeItems(this.selection.getSelection());
+        this.input.focus();
+      } else if ((this.input as BaseAutoFill).cursorLocation === 0) {
+        this.removeItem(this.state.items[this.state.items.length - 1]);
+      }
+    }
+  }
+
+  @autobind
+  protected onInputChange(value: string): void {
+    this.floatingPicker.onQueryStringChanged(value);
+  }
+
+  @autobind
+  protected onInputFocus(ev: React.FocusEvent<HTMLInputElement | BaseAutoFill>): void {
+    this.selection.setAllSelected(false);
+    this.floatingPicker.showPicker();
+
+    if (this.props.inputProps && this.props.inputProps.onFocus) {
+      this.props.inputProps.onFocus(ev as React.FocusEvent<HTMLInputElement>);
+    }
+  }
+
+  @autobind
+  protected _isFocusZoneInnerKeystroke(ev: React.KeyboardEvent<HTMLElement>): boolean {
+    // If suggestions are shown let up/down keys control them, otherwise allow them through to control the focusZone.
+    if (this.floatingPicker.isSuggestionsShown) {
+      switch (ev.which) {
+        case KeyCodes.up:
+        case KeyCodes.down:
+          return true;
+      }
+    }
+
+    if (ev.which === KeyCodes.enter) {
+      return true;
+    }
+
+    return false;
+  }
+
+  @autobind
+  protected addItem(item: T): void {
+    super.addItem(item);
+    this.input.clear();
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseFloatingPicker.Props.ts b/packages/experiments/src/components/ExtendedPicker/BaseFloatingPicker.Props.ts
new file mode 100644
index 0000000000000..56078d5b86c4b
--- /dev/null
+++ b/packages/experiments/src/components/ExtendedPicker/BaseFloatingPicker.Props.ts
@@ -0,0 +1,98 @@
+import * as React from 'react';
+import { ISuggestionModel, ValidationState, IBasePickerSuggestionsProps, SuggestionsController } from 'office-ui-fabric-react/lib/Pickers';
+import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
+
+export interface IBaseFloatingPicker {
+  /** Whether the suggestions are shown */
+  isSuggestionsShown: boolean;
+
+  /** On queryString changed */
+  onQueryStringChanged: (input: string) => void;
+
+  /** Hides the picker */
+  hidePicker: () => void;
+
+  /** Shows the picker */
+  showPicker: () => void;
+}
+
+// Type T is the type of the item that is displayed
+// and searched for by the people picker. For example, if the picker is
+// displaying persona's than type T could either be of Persona or Ipersona props
+// tslint:disable-next-line:no-any
+export interface IBaseFloatingPickerProps<T> extends React.Props<any> {
+  componentRef?: (component?: IBaseFloatingPicker) => void;
+
+  /** The suggestions controller */
+  suggestionsController: SuggestionsController<T>;
+
+  /**
+   * The suggestions to show on zero query
+   */
+  onZeroQuerySuggestion?: (selectedItems?: T[]) => T[] | PromiseLike<T[]>;
+
+  /**
+   * The input element to listen on events
+   */
+  inputElement?: HTMLElement;
+
+  /**
+   * Function that specifies how an individual suggestion item will appear.
+   */
+  // tslint:disable-next-line:no-any
+  onRenderSuggestionsItem?: (props: T, itemProps: any) => JSX.Element;
+  /**
+   * A callback for what should happen when a person types text into the input.
+   * Returns the already selected items so the resolver can filter them out.
+   */
+  onResolveSuggestions: (filter: string, selectedItems?: T[]) => T[] | PromiseLike<T[]>;
+
+  /**
+   * A callback for when a suggestion is clicked
+   */
+  onChange?: (item: T) => void;
+
+  /**
+   * A callback that gets the rest of the results when a user clicks get more results.
+   */
+  onGetMoreResults?: (filter: string, selectedItems?: T[]) => T[] | PromiseLike<T[]>;
+  /**
+   * ClassName for the picker.
+   */
+  className?: string;
+  /**
+   * The properties that will get passed to the Suggestions component.
+   */
+  pickerSuggestionsProps?: IBasePickerSuggestionsProps;
+  /**
+   * A callback for when a persona is removed from the suggestion list
+   */
+  onRemoveSuggestion?: (item: IPersonaProps) => void;
+  /**
+   * A function used to validate if raw text entered into the well can be added
+   */
+  onValidateInput?: (input: string) => ValidationState;
+  /**
+   * The text to display while searching for more results in a limited suggestions list
+   */
+  searchingText?: ((props: { input: string }) => string) | string;
+
+  /**
+   * Function that specifies how arbitrary text entered into the well is handled.
+   */
+  createGenericItem?: (
+    input: string,
+    ValidationState: ValidationState
+  ) => ISuggestionModel<T>;
+
+  /**
+   * The items that the base picker should currently display as selected. If this is provided then the picker will act as a controlled
+   * component.
+   */
+  selectedItems?: T[];
+
+  /**
+   * A callback to get text from an item. Used to autofill text in the pickers.
+   */
+  getTextFromItem?: (item: T, currentValue?: string) => string;
+}
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseFloatingPicker.tsx b/packages/experiments/src/components/ExtendedPicker/BaseFloatingPicker.tsx
new file mode 100644
index 0000000000000..87eeee0cbe5b3
--- /dev/null
+++ b/packages/experiments/src/components/ExtendedPicker/BaseFloatingPicker.tsx
@@ -0,0 +1,477 @@
+import * as React from 'react';
+import {
+  BaseComponent,
+  KeyCodes,
+  autobind,
+  css,
+  getRTL
+} from '../../Utilities';
+import { Callout, DirectionalHint } from 'office-ui-fabric-react/lib/Callout';
+import { ValidationState, Suggestions, ISuggestionsProps, SuggestionsController, IBasePickerSuggestionsProps, ISuggestionModel }
+  from 'office-ui-fabric-react/lib/Pickers';
+import { IBaseFloatingPicker, IBaseFloatingPickerProps } from './BaseFloatingPicker.Props';
+
+export interface IBaseFloatingPickerState {
+  queryString: string;
+  suggestedDisplayValue?: string;
+  moreSuggestionsAvailable?: boolean;
+  isSearching?: boolean;
+  isMostRecentlyUsedVisible?: boolean;
+  suggestionsVisible?: boolean;
+  suggestionsLoading?: boolean;
+  isResultsFooterVisible?: boolean;
+  didBind: boolean;
+}
+
+export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extends BaseComponent<P, IBaseFloatingPickerState>
+  implements IBaseFloatingPicker {
+  protected selection: Selection;
+
+  protected root: HTMLElement;
+  protected suggestionElement: Suggestions<T>;
+
+  protected suggestionStore: SuggestionsController<T>;
+  protected SuggestionOfProperType: new (props: ISuggestionsProps<T>) => Suggestions<T> =
+  Suggestions as new (props: ISuggestionsProps<T>) => Suggestions<T>;
+  protected loadingTimer: number | undefined;
+  // tslint:disable-next-line:no-any
+  protected currentPromise: PromiseLike<any>;
+
+  constructor(basePickerProps: P) {
+    super(basePickerProps);
+
+    this.suggestionStore = basePickerProps.suggestionsController;
+    this.state = {
+      queryString: '',
+      suggestedDisplayValue: '',
+      isMostRecentlyUsedVisible: false,
+      moreSuggestionsAvailable: false,
+      isSearching: false,
+      didBind: false,
+    };
+  }
+
+  public get isSuggestionsShown(): boolean {
+    return this.state.suggestionsVisible ? false : this.state.suggestionsVisible as boolean;
+  }
+
+  public onQueryStringChanged(queryString: string): void {
+    if (queryString !== this.state.queryString) {
+      this.setState({
+        queryString: queryString,
+        moreSuggestionsAvailable: true,
+        isMostRecentlyUsedVisible: false,
+        suggestionsVisible: true,
+      });
+      if (queryString === '') {
+        this.updateSuggestionWithZeroState();
+      } else {
+        this.updateValue(queryString);
+      }
+
+    }
+  }
+
+  public hidePicker(): void {
+    this.setState({
+      suggestionsVisible: false,
+    });
+  }
+
+  public showPicker(): void {
+    this.setState({
+      suggestionsVisible: true,
+    });
+
+    if (this.state.queryString === '') {
+      this.updateSuggestionWithZeroState();
+    } else {
+      this.updateValue(this.state.queryString);
+    }
+  }
+
+  public componentDidMount(): void {
+    this._bindToInputElement();
+  }
+
+  public componentDidUpdate(): void {
+    this._bindToInputElement();
+  }
+
+  public componentWillUnmount(): void {
+    this._unbindFromInputElement();
+  }
+
+  @autobind
+  public dismissSuggestions(): void {
+    this.setState({ suggestionsVisible: false });
+  }
+
+  public completeSuggestion(): void {
+    if (this.suggestionStore.hasSelectedSuggestion()) {
+      this.onChange(this.suggestionStore.currentSuggestion!.item);
+    }
+  }
+
+  @autobind
+  public refocusSuggestions(keyCode: KeyCodes): void {
+    if (keyCode === KeyCodes.up) {
+      this.suggestionStore.setSelectedSuggestion(
+        this.suggestionStore.suggestions.length - 1
+      );
+    } else if (keyCode === KeyCodes.down) {
+      this.suggestionStore.setSelectedSuggestion(0);
+    }
+  }
+
+  public render(): JSX.Element {
+    let { className } = this.props;
+    return (
+      <div
+        ref={ this._resolveRef('root') }
+        className={ css('ms-BasePicker', className ? className : '') }
+      >
+        { this.renderSuggestions() }
+      </div>
+    );
+  }
+  protected renderSuggestions(): JSX.Element | null {
+    let TypedSuggestion = this.SuggestionOfProperType;
+    return this.state.suggestionsVisible ? (
+      <Callout
+        isBeakVisible={ false }
+        gapSpace={ 5 }
+        target={ this.props.inputElement }
+        onDismiss={ this.dismissSuggestions }
+        directionalHint={
+          getRTL() ? (
+            DirectionalHint.bottomRightEdge
+          ) : (
+              DirectionalHint.bottomLeftEdge
+            )
+        }
+      >
+        <TypedSuggestion
+          onRenderSuggestion={ this.props.onRenderSuggestionsItem }
+          onSuggestionClick={ this.onSuggestionClick }
+          onSuggestionRemove={ this.onSuggestionRemove }
+          suggestions={ this.suggestionStore.getSuggestions() }
+          ref={ this._resolveRef('suggestionElement') }
+          onGetMoreResults={ this.onGetMoreResults }
+          moreSuggestionsAvailable={ this.state.moreSuggestionsAvailable }
+          isLoading={ this.state.suggestionsLoading }
+          isSearching={ this.state.isSearching }
+          isMostRecentlyUsedVisible={ this.state.isMostRecentlyUsedVisible }
+          isResultsFooterVisible={ this.state.isResultsFooterVisible }
+          refocusSuggestions={ this.refocusSuggestions }
+          {...this.props.pickerSuggestionsProps as IBasePickerSuggestionsProps}
+        />
+      </Callout>
+    ) : null;
+  }
+
+  protected onSuggestionSelect(): void {
+    if (this.suggestionStore.currentSuggestion) {
+      let currentValue: string = this.state.queryString;
+      let itemValue: string = this._getTextFromItem(
+        this.suggestionStore.currentSuggestion.item,
+        currentValue
+      );
+      this.setState({ suggestedDisplayValue: itemValue });
+    }
+  }
+
+  protected onSelectionChange(): void {
+    this.forceUpdate();
+  }
+
+  protected updateSuggestions(suggestions: T[]): void {
+    this.suggestionStore.updateSuggestions(suggestions, 0);
+    this.forceUpdate();
+  }
+
+  protected updateValue(updatedValue: string): void {
+    let suggestions: T[] | PromiseLike<T[]> = this.props.onResolveSuggestions(
+      updatedValue,
+      this.props.selectedItems
+    );
+    this.updateSuggestionsList(suggestions, updatedValue);
+  }
+
+  protected updateSuggestionWithZeroState(): void {
+    if (this.props.onZeroQuerySuggestion) {
+      let onEmptyInputFocus = this.props.onZeroQuerySuggestion as (selectedItems?: T[]) => T[] | PromiseLike<T[]>;
+      let suggestions: T[] | PromiseLike<T[]> = onEmptyInputFocus(this.props.selectedItems);
+      this.updateSuggestionsList(suggestions);
+    } else {
+      this.setState({ suggestionsVisible: false });
+    }
+  }
+
+  protected updateSuggestionsList(
+    suggestions: T[] | PromiseLike<T[]>,
+    updatedValue?: string
+  ): void {
+    let suggestionsArray: T[] = suggestions as T[];
+    let suggestionsPromiseLike: PromiseLike<T[]> = suggestions as PromiseLike<
+      T[]
+      >;
+
+    // Check to see if the returned value is an array, if it is then just pass it into the next function.
+    // If the returned value is not an array then check to see if it's a promise or PromiseLike. If it is then resolve it asynchronously.
+    if (Array.isArray(suggestionsArray)) {
+      if (updatedValue !== undefined) {
+        this.resolveNewValue(updatedValue, suggestionsArray);
+      } else {
+        this.suggestionStore.updateSuggestions(suggestionsArray, 0);
+      }
+    } else if (suggestionsPromiseLike && suggestionsPromiseLike.then) {
+      if (!this.loadingTimer) {
+        this.loadingTimer = this._async.setTimeout(
+          () =>
+            this.setState({
+              suggestionsLoading: true
+            }),
+          500
+        );
+      }
+
+      // Clear suggestions
+      this.suggestionStore.updateSuggestions([]);
+
+      if (updatedValue !== undefined) {
+        this.setState({
+          suggestionsVisible: updatedValue !== ''
+        });
+      } else {
+        this.setState({
+          suggestionsVisible: false
+        });
+      }
+
+      // Ensure that the promise will only use the callback if it was the most recent one.
+      let promise: PromiseLike<
+        T[]
+        > = (this.currentPromise = suggestionsPromiseLike);
+      promise.then((newSuggestions: T[]) => {
+        if (promise === this.currentPromise) {
+          if (updatedValue !== undefined) {
+            this.resolveNewValue(updatedValue, newSuggestions);
+          } else {
+            this.suggestionStore.updateSuggestions(newSuggestions);
+            this.setState({
+              suggestionsLoading: false
+            });
+          }
+          if (this.loadingTimer) {
+            this._async.clearTimeout(this.loadingTimer);
+            this.loadingTimer = undefined;
+          }
+        }
+      });
+    }
+  }
+
+  protected resolveNewValue(updatedValue: string, suggestions: T[]): void {
+    this.suggestionStore.updateSuggestions(suggestions, 0);
+    let itemValue: string | undefined = undefined;
+
+    if (this.suggestionStore.currentSuggestion) {
+      itemValue = this._getTextFromItem(
+        this.suggestionStore.currentSuggestion.item,
+        updatedValue
+      );
+    }
+
+    this.setState({
+      suggestionsLoading: false,
+      suggestedDisplayValue: itemValue,
+      suggestionsVisible: updatedValue !== ''
+    });
+  }
+
+  protected onChange(item: T): void {
+    if (this.props.onChange) {
+      (this.props.onChange as ((items: T) => void))(item);
+    }
+  }
+
+  @autobind
+  protected onSuggestionClick(
+    ev: React.MouseEvent<HTMLElement>,
+    item: T,
+    index: number
+    ): void {
+    this.onChange(item);
+  }
+
+  @autobind
+  protected onSuggestionRemove(
+    ev: React.MouseEvent<HTMLElement>,
+    item: T,
+    index: number
+    ): void {
+    if (this.props.onRemoveSuggestion) {
+      (this.props.onRemoveSuggestion as ((item: T) => void))(item);
+    }
+    this.suggestionStore.removeSuggestion(index);
+  }
+
+  @autobind
+  protected onKeyDown(ev: MouseEvent): void {
+    if (!this.state.suggestionsVisible ||
+      (this.props.inputElement &&
+        !(this.props.inputElement as HTMLElement).contains(ev.target as HTMLElement))) {
+      return;
+    }
+    switch (ev.which) {
+      case KeyCodes.escape:
+        this.setState({ suggestionsVisible: false });
+        ev.preventDefault();
+        ev.stopPropagation();
+        break;
+
+      case KeyCodes.tab:
+      case KeyCodes.enter:
+        if (
+          !ev.shiftKey &&
+          this.suggestionStore.hasSelectedSuggestion()) {
+          this.completeSuggestion();
+          ev.preventDefault();
+          ev.stopPropagation();
+        } else {
+          this._onValidateInput();
+        }
+        break;
+
+      case KeyCodes.del:
+        if (this.suggestionStore.currentIndex !== -1) {
+          if (this.props.onRemoveSuggestion) {
+            (this.props.onRemoveSuggestion as ((item: T) => void))(
+              this.suggestionStore.currentSuggestion!.item
+            );
+          }
+          this.suggestionStore.removeSuggestion(
+            this.suggestionStore.currentIndex
+          );
+          this.forceUpdate();
+        }
+        ev.stopPropagation();
+        break;
+
+      case KeyCodes.up:
+        if (
+          this.state.moreSuggestionsAvailable &&
+          this.suggestionElement.props.searchForMoreText &&
+          this.suggestionStore.currentIndex === 0
+        ) {
+          this.suggestionElement.focusSearchForMoreButton();
+          this.suggestionStore.deselectAllSuggestions();
+          this.forceUpdate();
+        } else {
+          if (this.suggestionStore.previousSuggestion()) {
+            ev.preventDefault();
+            ev.stopPropagation();
+            this.onSuggestionSelect();
+          }
+        }
+        break;
+
+      case KeyCodes.down:
+        if (
+          this.state.moreSuggestionsAvailable &&
+          this.suggestionElement.props.searchForMoreText &&
+          this.suggestionStore.currentIndex + 1 ===
+          this.suggestionStore.suggestions.length
+        ) {
+          this.suggestionElement.focusSearchForMoreButton();
+          this.suggestionStore.deselectAllSuggestions();
+          this.forceUpdate();
+        } else {
+          if (this.suggestionStore.nextSuggestion()) {
+            ev.preventDefault();
+            ev.stopPropagation();
+            this.onSuggestionSelect();
+          }
+        }
+        break;
+    }
+  }
+
+  @autobind
+  protected onGetMoreResults(): void {
+    this.setState(
+      {
+        isSearching: true
+      },
+      () => {
+        if (this.props.onGetMoreResults) {
+          let suggestions: T[] | PromiseLike<T[]> =
+            (this.props.onGetMoreResults as ((filter: string, selectedItems?: T[]) => T[] | PromiseLike<T[]>))
+              (this.state.queryString, []);
+          let suggestionsArray: T[] = suggestions as T[];
+          let suggestionsPromiseLike: PromiseLike<
+            T[]
+            > = suggestions as PromiseLike<T[]>;
+
+          if (Array.isArray(suggestionsArray)) {
+            this.updateSuggestions(suggestionsArray);
+            this.setState({ isSearching: false });
+          } else if (suggestionsPromiseLike.then) {
+            suggestionsPromiseLike.then((newSuggestions: T[]) => {
+              this.updateSuggestions(newSuggestions);
+              this.setState({ isSearching: false });
+            });
+          }
+        } else {
+          this.setState({ isSearching: false });
+        }
+        this.setState({
+          moreSuggestionsAvailable: false,
+          isResultsFooterVisible: true
+        });
+      }
+    );
+  }
+
+  private _onValidateInput(): void {
+    if (
+      this.props.onValidateInput &&
+      (this.props.onValidateInput as ((input: string) => ValidationState))(this.state.queryString) !==
+      ValidationState.invalid &&
+      this.props.createGenericItem
+    ) {
+      let itemToConvert = (this.props.createGenericItem as ((
+        input: string,
+        ValidationState: ValidationState
+      ) => ISuggestionModel<T>))(
+        this.state.queryString,
+        (this.props.onValidateInput as ((input: string) => ValidationState))(this.state.queryString)
+        );
+      this.suggestionStore.createGenericSuggestion(itemToConvert);
+      this.completeSuggestion();
+    }
+  }
+
+  private _getTextFromItem(item: T, currentValue?: string): string {
+    if (this.props.getTextFromItem) {
+      return (this.props.getTextFromItem as ((item: T, currentValue?: string) => string))(item, currentValue);
+    } else {
+      return '';
+    }
+  }
+
+  private _bindToInputElement(): void {
+    if (this.props.inputElement && !this.state.didBind) {
+      this.props.inputElement.addEventListener('keydown', this.onKeyDown);
+      this.setState({ didBind: true });
+    }
+  }
+
+  private _unbindFromInputElement(): void {
+    if (this.props.inputElement && this.state.didBind) {
+      this.props.inputElement.removeEventListener('keydown', this.onKeyDown);
+      this.setState({ didBind: false });
+    }
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.tsx b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.tsx
new file mode 100644
index 0000000000000..fd5219a9628d2
--- /dev/null
+++ b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.tsx
@@ -0,0 +1,30 @@
+/* tslint:disable */
+import * as React from 'react';
+import { IPickerItemProps, ValidationState, IBasePickerProps } from 'office-ui-fabric-react/lib/Pickers';
+/* tslint:enable */
+import { BaseExtendedPicker } from '../BaseExtendedPicker';
+import { SelectedItemDefault } from './PeoplePickerItems/SelectedItemDefault';
+import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
+import './PeoplePicker.scss';
+import { FloatingPeoplePicker, BaseFloatingPeoplePicker } from './FloatingPeoplePicker';
+import { BaseFloatingPicker } from '../BaseFloatingPicker';
+import { IBaseFloatingPickerProps } from '../BaseFloatingPicker.Props';
+
+export interface IPeoplePickerItemProps extends IPickerItemProps<IPersonaProps & { ValidationState: ValidationState }> {
+}
+
+export interface IPeopleWellPickerProps extends IBasePickerProps<IPersonaProps> {
+  floatingPickerType: new (props: IBaseFloatingPickerProps<IPersonaProps>) =>
+    BaseFloatingPicker<IPersonaProps, IBaseFloatingPickerProps<IPersonaProps>>;
+}
+
+export class BaseExtendedPeoplePicker extends BaseExtendedPicker<IPersonaProps, IPeopleWellPickerProps> {
+}
+
+export class ExtendedPeoplePicker extends BaseExtendedPeoplePicker {
+  // tslint:disable-next-line:no-any
+  public static defaultProps: any = {
+    onRenderItem: (props: IPeoplePickerItemProps) => <SelectedItemDefault {...props} />,
+    floatingPickerType: FloatingPeoplePicker as new (props: IBaseFloatingPickerProps<IPersonaProps>) => BaseFloatingPeoplePicker,
+  };
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePickerPage.tsx b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePickerPage.tsx
new file mode 100644
index 0000000000000..af46933cc8900
--- /dev/null
+++ b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePickerPage.tsx
@@ -0,0 +1,73 @@
+import * as React from 'react';
+import {
+  ExampleCard,
+  ComponentPage,
+  IComponentDemoPageProps,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+import { ExtendedPeoplePickerTypesExample } from './examples/ExtendedPeoplePicker.Basic.Example';
+
+const ExtendedPeoplePickerBasicExampleCode = require(
+  '!raw-loader!experiments/src/components/ExtendedPicker/PeoplePicker/examples/ExtendedPeoplePicker.Basic.Example.tsx'
+) as string;
+
+export class ExtendedPeoplePickerPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render(): JSX.Element {
+    return (
+      <ComponentPage
+        title='ExtendedPeoplePicker'
+        componentName='ExtendedPeoplePickerExample'
+        exampleCards={
+          <div>
+            <ExampleCard title='Extended People Picker' code={ ExtendedPeoplePickerBasicExampleCode }>
+              <ExtendedPeoplePickerTypesExample />
+            </ExampleCard>
+          </div>
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!experiments/src/components/ExtendedPicker/BaseExtendedPicker.Props.ts')
+            ] }
+          />
+        }
+        overview={
+          <div>
+            <span>ExtendedPeoplePicker are used to pick recipients. The difference between this and the current PeoplePicker are:</span>
+            <ul>
+              <li>Will show suggestions on empty query</li>
+              <li>Will remove selected items on backspace even if there is text in the input area</li>
+            </ul>
+          </div>
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }
+        bestPractices={
+          <div>The ExtendedPeoplePicker is used to select one or more entities, such as people or groups. Entry points for
+            ExtendedPeoplePicker are
+            typically specialized TextField-like input fields known as a "well", which are used to search for recipients from a list. When
+            a recipient is selected from the list, it is added to the well as a specialized Persona that can be interacted with or removed.
+            Clicking on a Persona from the well should invoke a PersonaCard or open a profile pane for that recipient.</div>
+        }
+        dos={
+          <div>
+            <ul>
+              <li>Use the ExtendedPeoplePicker to quickly search for a few people</li>
+              <li>Use the ExtendedPeoplePicker to manage a group of people</li>
+              <li>Use defaultSelectedItems when some people have already been selected</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul>
+              <li>Use the ExtendedPeoplePicker to select something other than people</li>
+              <li>Use the ExtendedPeoplePicker to only display people</li>
+              <li>Use the ExtendedPeoplePicker without sufficient space</li>
+            </ul>
+          </div>
+        }
+      />
+    );
+  }
+
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/FloatingPeoplePicker.tsx b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/FloatingPeoplePicker.tsx
new file mode 100644
index 0000000000000..cea56855ed4ee
--- /dev/null
+++ b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/FloatingPeoplePicker.tsx
@@ -0,0 +1,38 @@
+import { getRTL, getInitials } from '../../../Utilities';
+import { BaseFloatingPicker } from '../BaseFloatingPicker';
+import { IBaseFloatingPickerProps } from '../BaseFloatingPicker.Props';
+import { SuggestionItemNormal } from './PeoplePickerItems/SuggestionItemDefault';
+import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
+import './PeoplePicker.scss';
+import { ValidationState, IBasePickerSuggestionsProps, ISuggestionModel } from 'office-ui-fabric-react/lib/Pickers';
+
+export interface IPeopleFloatingPickerProps extends IBaseFloatingPickerProps<IPersonaProps> {
+}
+
+export class BaseFloatingPeoplePicker extends BaseFloatingPicker<IPersonaProps, IPeopleFloatingPickerProps> {
+}
+
+export class FloatingPeoplePicker extends BaseFloatingPeoplePicker {
+  // tslint:disable-next-line:no-any
+  public static defaultProps: any = {
+    onRenderSuggestionsItem: (props: IPersonaProps, itemProps?: IBasePickerSuggestionsProps) => SuggestionItemNormal({ ...props },
+      { ...itemProps }),
+    createGenericItem: createGenericItem,
+  };
+}
+
+export function createGenericItem(name: string, currentValidationState: ValidationState): ISuggestionModel<IPersonaProps> {
+  // tslint:disable-next-line:no-any
+  let personaToConvert: any = {
+    key: name,
+    primaryText: name,
+    imageInitials: '!',
+    ValidationState: currentValidationState
+  };
+
+  if (currentValidationState !== ValidationState.warning) {
+    personaToConvert.imageInitials = getInitials(name, getRTL());
+  }
+
+  return personaToConvert;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/FloatingPeoplePickerPage.tsx b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/FloatingPeoplePickerPage.tsx
new file mode 100644
index 0000000000000..994e6d0354403
--- /dev/null
+++ b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/FloatingPeoplePickerPage.tsx
@@ -0,0 +1,66 @@
+import * as React from 'react';
+import {
+  ExampleCard,
+  ComponentPage,
+  IComponentDemoPageProps,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+import { FloatingPeoplePickerTypesExample } from '../PeoplePicker/examples/FloatingPeoplePicker.Basic.Example';
+
+const FloatingPeoplePickerBasicExampleCode = require(
+  '!raw-loader!experiments/src/components/ExtendedPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx'
+) as string;
+
+export class FloatingPeoplePickerPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render(): JSX.Element {
+    return (
+      <ComponentPage
+        title='FloatingPeoplePicker'
+        componentName='FloatingPeoplePickerExample'
+        exampleCards={
+          <div>
+            <ExampleCard title='Floating People Picker' code={ FloatingPeoplePickerBasicExampleCode }>
+              <FloatingPeoplePickerTypesExample />
+            </ExampleCard>
+          </div>
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!experiments/src/components/ExtendedPicker/BaseFloatingPicker.Props.ts')
+            ] }
+          />
+        }
+        overview={
+          <div>
+            <span> FloatingPeoplePicker are used to pick recipients but do not need a well or necessarily keep track of selected
+              people</span>
+          </div>
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }
+        bestPractices={
+          <div>The FloatingPeoplePicker is used to select one or more entities, such as people or groups. Entry points for PeoplePickers
+            are typically specialized TextField-like input fields known as a "well", which are used to search for recipients from a list.
+            When a recipient is selected from the list, it is added to the well as a specialized Persona that can be interacted with or
+            removed. Clicking on a Persona from the well should invoke a PersonaCard or open a profile pane for that recipient.</div>
+        }
+        dos={
+          <div>
+            <ul>
+              <li>Use the FloatingPeoplePicker to quickly search for a few people</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul>
+              <li>Use the FloatingPeoplePicker to select something other than people</li>
+              <li>Use the FloatingPeoplePicker without sufficient space</li>
+            </ul>
+          </div>
+        }
+      />
+    );
+  }
+
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePicker.scss b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePicker.scss
new file mode 100644
index 0000000000000..635afea0d6e67
--- /dev/null
+++ b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePicker.scss
@@ -0,0 +1,30 @@
+
+@import '~office-ui-fabric-react/src/common/common';
+
+.resultContent {
+  display: table-row;
+  .resultItem {
+    display: table-cell;
+    vertical-align: bottom;
+  }
+}
+
+.peoplePickerPersona {
+  width: 180px;
+   :global(.ms-Persona-details) {
+    width: 100%;
+  }
+}
+
+.peoplePicker {
+   :global(.ms-BasePicker-text) {
+    min-height: 40px;
+  }
+}
+
+.peoplePickerPersonaContent {
+  display: flex;
+  width: 100%;
+  justify-content: space-between;
+  align-items: center;
+}
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
new file mode 100644
index 0000000000000..a6dbb4e7e0d1f
--- /dev/null
+++ b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
@@ -0,0 +1,117 @@
+
+@import '~office-ui-fabric-react/src/common/common';
+
+.personaContainer {
+  @include focus-border(-2px);
+  border-radius: 15px;
+  display: inline-flex;
+  align-items: center;
+  background: $ms-color-neutralLighter;
+  margin: 4px;
+  cursor: default;
+  user-select: none;
+  max-width: 300px;
+  vertical-align: middle;
+
+  &:hover {
+    background: $ms-color-neutralLight;
+
+    .removeButton {
+      color: $ms-color-neutralPrimary;
+    }
+  }
+
+  &.personaContainerIsSelected {
+    background: $ms-color-blue;
+
+    // Setting global values here to override persona's normal behavior specifically in this selected variation
+    :global(.ms-Persona-primaryText) {
+      color: $ms-color-white;
+
+      @include high-contrast {
+        color: HighlightText;
+      }
+    }
+
+    .removeButton {
+      :global(.ms-Button-icon) {
+        color: $ms-color-white;
+
+        @include high-contrast {
+          color: HighlightText;
+        }
+      }
+
+      &:hover {
+        color: $ms-color-white;
+        background: $ms-color-themeDark;
+      }
+    }
+
+    @include high-contrast {
+      border-color: Highlight;
+      background: Highlight;
+      -ms-high-contrast-adjust: none;
+    }
+  }
+
+  &.validationError {
+    // Setting global values here to override persona's normal behavior in the error version
+    :global(.ms-Persona-primaryText) {
+      color: $ms-color-redDark;
+      border-bottom: 2px dotted $ms-color-redDark;
+    }
+
+    :global(.ms-Persona-initials) {
+      font-size: 20px;
+    }
+
+    &.personaContainerIsSelected {
+      background: $ms-color-redDark;
+
+      :global(.ms-Persona-primaryText) {
+        color: $ms-color-white;
+        border-bottom: 2px dotted $ms-color-white;
+      }
+
+      .removeButton:hover {
+        background: $ms-color-red;
+      }
+    }
+  }
+
+  @include high-contrast {
+    border: 1px solid WindowText;
+  }
+
+  .itemContent {
+    flex: 0 1 auto;
+    min-width: 0px;
+
+    /** CSS below is needed for IE 11 to properly truncate long persona names in the picker **/
+    max-width: 100%;
+    overflow-x: hidden;
+  }
+
+  .removeButton {
+    border-radius: 15px;
+    flex: 0 0 auto;
+    width: 28px;
+    height: 28px;
+    flex-basis: 28px;
+
+    &:hover {
+      background: $ms-color-neutralTertiaryAlt;
+      color: $ms-color-neutralDark;
+    }
+  }
+
+  .personaDetails {
+    flex: 0 1 auto;
+  }
+}
+
+.itemContainer {
+  display: inline-block;
+  vertical-align: top;
+}
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
new file mode 100644
index 0000000000000..25bf24c2c545e
--- /dev/null
+++ b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
@@ -0,0 +1,63 @@
+/* tslint:disable */
+import * as React from 'react';
+/* tslint:enable */
+import { css, getId } from '../../../../Utilities';
+import { Persona, PersonaSize, PersonaPresence } from 'office-ui-fabric-react/lib/Persona';
+import { IPeoplePickerItemProps } from '../ExtendedPeoplePicker';
+import { ValidationState } from 'office-ui-fabric-react/lib/Pickers';
+import { IconButton } from 'office-ui-fabric-react/lib/Button';
+import * as stylesImport from './PickerItemsDefault.scss';
+// tslint:disable-next-line:no-any
+const styles: any = stylesImport;
+
+export const SelectedItemDefault: (props: IPeoplePickerItemProps) => JSX.Element = (peoplePickerItemProps: IPeoplePickerItemProps) => {
+  let {
+    item,
+    onRemoveItem,
+    index,
+    selected,
+    removeButtonAriaLabel
+  } = peoplePickerItemProps;
+
+  const itemId = getId();
+  const onClickIconButton = (removeItem: (() => void) | undefined): () => void => {
+    return (): void => {
+      if (removeItem) {
+        removeItem();
+      }
+    };
+  };
+
+  return (
+    <div
+      className={ css(
+        'ms-PickerPersona-container',
+        styles.personaContainer,
+        { ['is-selected ' + styles.personaContainerIsSelected]: selected },
+        { ['is-invalid ' + styles.validationError]: item.ValidationState === ValidationState.warning }
+      ) }
+      data-is-focusable={ true }
+      data-is-sub-focuszone={ true }
+      data-selection-index={ index }
+      role={ 'listitem' }
+      aria-labelledby={ 'selectedItemPersona-' + itemId }
+    >
+      <div
+        className={ css('ms-PickerItem-content', styles.itemContent) }
+        id={ 'selectedItemPersona-' + itemId }
+      >
+        <Persona
+          { ...item }
+          presence={ item.presence !== undefined ? item.presence : PersonaPresence.none }
+          size={ PersonaSize.size28 }
+        />
+      </div>
+      <IconButton
+        onClick={ onClickIconButton(onRemoveItem) }
+        iconProps={ { iconName: 'Cancel', style: { fontSize: '12px' } } }
+        className={ css('ms-PickerItem-removeButton', styles.removeButton) }
+        ariaLabel={ removeButtonAriaLabel }
+      />
+    </div >
+  );
+};
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
new file mode 100644
index 0000000000000..26ddc3081ee95
--- /dev/null
+++ b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
@@ -0,0 +1,22 @@
+/* tslint:disable */
+import * as React from 'react';
+/* tslint:enable */
+import { css } from '../../../../Utilities';
+import { Persona, PersonaSize, IPersonaProps, PersonaPresence } from 'office-ui-fabric-react/lib/Persona';
+import { IBasePickerSuggestionsProps, ISuggestionItemProps } from 'office-ui-fabric-react/lib/Pickers';
+import * as stylesImport from '../PeoplePicker.scss';
+
+export const SuggestionItemNormal: (persona: IPersonaProps, suggestionProps?: IBasePickerSuggestionsProps) => JSX.Element =
+  (personaProps: IPersonaProps, suggestionItemProps?: ISuggestionItemProps<IPersonaProps>) => {
+    return (
+      <div className={ css('ms-PeoplePicker-personaContent', stylesImport.peoplePickerPersonaContent) }>
+        <Persona
+          presence={ personaProps.presence !== undefined ? personaProps.presence : PersonaPresence.none }
+          size={ PersonaSize.extraExtraSmall }
+          className={ css('ms-PeoplePicker-Persona', stylesImport.peoplePickerPersona) }
+          showSecondaryText={ true }
+          { ...personaProps }
+        />
+      </div>
+    );
+  };
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/ExtendedPeoplePicker.Basic.Example.scss b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/ExtendedPeoplePicker.Basic.Example.scss
new file mode 100644
index 0000000000000..d8e0a86cbf7d1
--- /dev/null
+++ b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/ExtendedPeoplePicker.Basic.Example.scss
@@ -0,0 +1,9 @@
+:global {
+  .ms-PeoplePicker {
+    width: 100%;
+  }
+
+  .ms-SearchBoxSmallExample {
+    width: 208px;
+  }
+}
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/ExtendedPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
new file mode 100644
index 0000000000000..d1549cbe29bf9
--- /dev/null
+++ b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
@@ -0,0 +1,174 @@
+/* tslint:disable */
+import * as React from 'react';
+/* tslint:enable */
+import {
+  BaseComponent,
+  assign,
+  autobind
+} from 'office-ui-fabric-react/lib/Utilities';
+import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
+import { IBasePicker, IBasePickerSuggestionsProps, ValidationState } from 'office-ui-fabric-react/lib/Pickers';
+import { ExtendedPeoplePicker } from '../ExtendedPeoplePicker';
+import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
+import { IPersonaWithMenu } from 'office-ui-fabric-react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.Props';
+import { people, mru } from './PeoplePickerExampleData';
+import { FloatingPeoplePicker, BaseFloatingPeoplePicker } from '../FloatingPeoplePicker';
+import { IBaseFloatingPickerProps } from '../../BaseFloatingPicker.Props';
+import './ExtendedPeoplePicker.Basic.Example.scss';
+
+export interface IPeoplePickerExampleState {
+  currentPicker?: number | string;
+  peopleList: IPersonaProps[];
+  mostRecentlyUsed: IPersonaProps[];
+  currentSelectedItems?: IPersonaProps[];
+}
+
+const suggestionProps: IBasePickerSuggestionsProps = {
+  suggestionsHeaderText: 'Suggested People',
+  mostRecentlyUsedHeaderText: 'Suggested Contacts',
+  noResultsFoundText: 'No results found',
+  loadingText: 'Loading',
+  showRemoveButtons: true,
+  suggestionsAvailableAlertText: 'People Picker Suggestions available',
+  suggestionsContainerAriaLabel: 'Suggested contacts'
+};
+
+// tslint:disable-next-line:no-any
+export class ExtendedPeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerExampleState> {
+  private _picker: IBasePicker<IPersonaProps>;
+
+  constructor() {
+    super();
+    let peopleList: IPersonaWithMenu[] = [];
+    people.forEach((persona: IPersonaProps) => {
+      let target: IPersonaWithMenu = {};
+
+      assign(target, persona);
+      peopleList.push(target);
+    });
+
+    this.state = {
+      peopleList: peopleList,
+      mostRecentlyUsed: mru,
+      currentSelectedItems: []
+    };
+  }
+
+  public render(): JSX.Element {
+    return (
+      <div>
+        { this._renderExtendedPicker() }
+        <PrimaryButton
+          text='Set focus'
+          onClick={ this._onSetFocusButtonClicked }
+        />
+      </div>
+    );
+  }
+
+  private _renderExtendedPicker(): JSX.Element {
+    return (
+      <ExtendedPeoplePicker
+        floatingPickerType={ FloatingPeoplePicker as new (props: IBaseFloatingPickerProps<IPersonaProps>) => BaseFloatingPeoplePicker }
+        onResolveSuggestions={ this._onFilterChanged }
+        onEmptyInputFocus={ this._returnMostRecentlyUsed }
+        getTextFromItem={ this._getTextFromItem }
+        pickerSuggestionsProps={ suggestionProps }
+        className={ 'ms-PeoplePicker' }
+        key={ 'normal' }
+        onRemoveSuggestion={ this._onRemoveSuggestion }
+        onValidateInput={ this._validateInput }
+        removeButtonAriaLabel={ 'Remove' }
+        inputProps={ {
+          onBlur: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onBlur called'),
+          onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called'),
+          'aria-label': 'People Picker'
+        } }
+        componentRef={ this._setComponentRef }
+      />
+    );
+  }
+
+  @autobind
+  private _setComponentRef(component: IBasePicker<IPersonaProps>): void {
+    this._picker = component;
+  }
+
+  @autobind
+  private _onSetFocusButtonClicked(): void {
+    if (this._picker) {
+      this._picker.focus();
+    }
+  }
+
+  @autobind
+  private _onRemoveSuggestion(item: IPersonaProps): void {
+    let { peopleList, mostRecentlyUsed: mruState } = this.state;
+    let indexPeopleList: number = peopleList.indexOf(item);
+    let indexMostRecentlyUsed: number = mruState.indexOf(item);
+
+    if (indexPeopleList >= 0) {
+      let newPeople: IPersonaProps[] = peopleList.slice(0, indexPeopleList).concat(peopleList.slice(indexPeopleList + 1));
+      this.setState({ peopleList: newPeople });
+    }
+
+    if (indexMostRecentlyUsed >= 0) {
+      let newSuggestedPeople: IPersonaProps[] = mruState.slice(0, indexMostRecentlyUsed).concat(mruState.slice(indexMostRecentlyUsed + 1));
+      this.setState({ mostRecentlyUsed: newSuggestedPeople });
+    }
+  }
+
+  @autobind
+  private _onFilterChanged(filterText: string, currentPersonas: IPersonaProps[], limitResults?: number): IPersonaProps[] {
+    if (filterText) {
+      let filteredPersonas: IPersonaProps[] = this._filterPersonasByText(filterText);
+
+      filteredPersonas = this._removeDuplicates(filteredPersonas, currentPersonas);
+      filteredPersonas = limitResults ? filteredPersonas.splice(0, limitResults) : filteredPersonas;
+      return filteredPersonas;
+    } else {
+      return [];
+    }
+  }
+
+  @autobind
+  private _returnMostRecentlyUsed(currentPersonas: IPersonaProps[]): IPersonaProps[] | Promise<IPersonaProps[]> {
+    let { mostRecentlyUsed } = this.state;
+    mostRecentlyUsed = this._removeDuplicates(mostRecentlyUsed, currentPersonas);
+    return mostRecentlyUsed;
+  }
+
+  private _listContainsPersona(persona: IPersonaProps, personas: IPersonaProps[]): boolean {
+    if (!personas || !personas.length || personas.length === 0) {
+      return false;
+    }
+    return personas.filter((item: IPersonaProps) => item.primaryText === persona.primaryText).length > 0;
+  }
+
+  private _filterPersonasByText(filterText: string): IPersonaProps[] {
+    return this.state.peopleList.filter((item: IPersonaProps) => this._doesTextStartWith(item.primaryText as string, filterText));
+  }
+
+  private _doesTextStartWith(text: string, filterText: string): boolean {
+    return text.toLowerCase().indexOf(filterText.toLowerCase()) === 0;
+  }
+
+  private _removeDuplicates(personas: IPersonaProps[], possibleDupes: IPersonaProps[]): IPersonaProps[] {
+    return personas.filter((persona: IPersonaProps) => !this._listContainsPersona(persona, possibleDupes));
+  }
+
+  private _getTextFromItem(persona: IPersonaProps): string {
+    return persona.primaryText as string;
+  }
+
+  @autobind
+  private _validateInput(input: string): ValidationState {
+    if (input.indexOf('@') !== -1) {
+      return ValidationState.valid;
+    } else if (input.length > 1) {
+      return ValidationState.warning;
+    } else {
+      return ValidationState.invalid;
+    }
+  }
+}
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
new file mode 100644
index 0000000000000..bffe0e2cb9217
--- /dev/null
+++ b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
@@ -0,0 +1,173 @@
+/* tslint:disable */
+import * as React from 'react';
+/* tslint:enable */
+import {
+  BaseComponent,
+  assign,
+  autobind
+} from 'office-ui-fabric-react/lib/Utilities';
+import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
+import { IBasePickerSuggestionsProps, ValidationState, SuggestionsController } from 'office-ui-fabric-react/lib/Pickers';
+import { IBaseFloatingPicker } from '../../BaseFloatingPicker.Props';
+import { FloatingPeoplePicker } from '../FloatingPeoplePicker';
+import { IPersonaWithMenu } from 'office-ui-fabric-react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.Props';
+import { people, mru } from './PeoplePickerExampleData';
+import './ExtendedPeoplePicker.Basic.Example.scss';
+import { SearchBox } from 'office-ui-fabric-react/lib/SearchBox';
+
+export interface IPeoplePickerExampleState {
+  currentPicker?: number | string;
+  peopleList: IPersonaProps[];
+  mostRecentlyUsed: IPersonaProps[];
+  currentSelectedItems?: IPersonaProps[];
+  searchValue: string;
+}
+
+const suggestionProps: IBasePickerSuggestionsProps = {
+  suggestionsHeaderText: 'Suggested People',
+  mostRecentlyUsedHeaderText: 'Suggested Contacts',
+  noResultsFoundText: 'No results found',
+  loadingText: 'Loading',
+  showRemoveButtons: true,
+  suggestionsAvailableAlertText: 'People Picker Suggestions available',
+  suggestionsContainerAriaLabel: 'Suggested contacts'
+};
+
+// tslint:disable-next-line:no-any
+export class FloatingPeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerExampleState> {
+  private _picker: IBaseFloatingPicker;
+  private _inputElement: HTMLDivElement;
+
+  constructor() {
+    super();
+    let peopleList: IPersonaWithMenu[] = [];
+    people.forEach((persona: IPersonaProps) => {
+      let target: IPersonaWithMenu = {};
+
+      assign(target, persona);
+      peopleList.push(target);
+    });
+
+    this.state = {
+      peopleList: peopleList,
+      mostRecentlyUsed: mru,
+      currentSelectedItems: [],
+      searchValue: ''
+    };
+  }
+
+  public render(): JSX.Element {
+    return (
+      <div>
+        <div className='ms-SearchBoxSmallExample' ref={ (ref: HTMLDivElement) => this._inputElement = ref }>
+          <SearchBox
+            labelText={ 'Search a person' }
+            onChange={ this._onSearchChange }
+            value={ this.state.searchValue }
+          />
+        </div>
+        { this._renderFloatingPicker() }
+      </div>
+    );
+  }
+
+  private _renderFloatingPicker(): JSX.Element {
+    return (
+      <FloatingPeoplePicker
+        suggestionsController={ new SuggestionsController<IPersonaProps>() }
+        onResolveSuggestions={ this._onFilterChanged }
+        getTextFromItem={ this._getTextFromItem }
+        pickerSuggestionsProps={ suggestionProps }
+        key={ 'normal' }
+        onRemoveSuggestion={ this._onRemoveSuggestion }
+        onValidateInput={ this._validateInput }
+        componentRef={ this._setComponentRef }
+        onChange={ this._onPickerChange }
+        inputElement={ this._inputElement }
+      />
+    );
+  }
+
+  @autobind
+  private _setComponentRef(component: IBaseFloatingPicker): void {
+    this._picker = component;
+  }
+
+  @autobind
+  private _onSearchChange(newValue: string): void {
+    if (newValue !== this.state.searchValue) {
+      this.setState({ searchValue: newValue });
+      this._picker.onQueryStringChanged(newValue);
+    }
+  }
+
+  @autobind
+  private _onPickerChange(selectedSuggestion: IPersonaProps): void {
+    this.setState({ searchValue: selectedSuggestion.primaryText ? selectedSuggestion.primaryText : '' });
+    this._picker.hidePicker();
+  }
+
+  @autobind
+  private _onRemoveSuggestion(item: IPersonaProps): void {
+    let { peopleList, mostRecentlyUsed: mruState } = this.state;
+    let indexPeopleList: number = peopleList.indexOf(item);
+    let indexMostRecentlyUsed: number = mruState.indexOf(item);
+
+    if (indexPeopleList >= 0) {
+      let newPeople: IPersonaProps[] = peopleList.slice(0, indexPeopleList).concat(peopleList.slice(indexPeopleList + 1));
+      this.setState({ peopleList: newPeople });
+    }
+
+    if (indexMostRecentlyUsed >= 0) {
+      let newSuggestedPeople: IPersonaProps[] = mruState.slice(0, indexMostRecentlyUsed).concat(mruState.slice(indexMostRecentlyUsed + 1));
+      this.setState({ mostRecentlyUsed: newSuggestedPeople });
+    }
+  }
+
+  @autobind
+  private _onFilterChanged(filterText: string, currentPersonas: IPersonaProps[], limitResults?: number): IPersonaProps[] {
+    if (filterText) {
+      let filteredPersonas: IPersonaProps[] = this._filterPersonasByText(filterText);
+
+      filteredPersonas = this._removeDuplicates(filteredPersonas, currentPersonas);
+      filteredPersonas = limitResults ? filteredPersonas.splice(0, limitResults) : filteredPersonas;
+      return filteredPersonas;
+    } else {
+      return [];
+    }
+  }
+
+  private _getTextFromItem(persona: IPersonaProps): string {
+    return persona.primaryText as string;
+  }
+
+  private _listContainsPersona(persona: IPersonaProps, personas: IPersonaProps[]): boolean {
+    if (!personas || !personas.length || personas.length === 0) {
+      return false;
+    }
+    return personas.filter((item: IPersonaProps) => item.primaryText === persona.primaryText).length > 0;
+  }
+
+  private _filterPersonasByText(filterText: string): IPersonaProps[] {
+    return this.state.peopleList.filter((item: IPersonaProps) => this._doesTextStartWith(item.primaryText as string, filterText));
+  }
+
+  private _doesTextStartWith(text: string, filterText: string): boolean {
+    return text.toLowerCase().indexOf(filterText.toLowerCase()) === 0;
+  }
+
+  private _removeDuplicates(personas: IPersonaProps[], possibleDupes: IPersonaProps[]): IPersonaProps[] {
+    return personas.filter((persona: IPersonaProps) => !this._listContainsPersona(persona, possibleDupes));
+  }
+
+  @autobind
+  private _validateInput(input: string): ValidationState {
+    if (input.indexOf('@') !== -1) {
+      return ValidationState.valid;
+    } else if (input.length > 1) {
+      return ValidationState.warning;
+    } else {
+      return ValidationState.invalid;
+    }
+  }
+}
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/PeoplePickerExampleData.ts b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/PeoplePickerExampleData.ts
new file mode 100644
index 0000000000000..35db5ebffc4a7
--- /dev/null
+++ b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/PeoplePickerExampleData.ts
@@ -0,0 +1,408 @@
+import { IPersonaProps, PersonaPresence } from 'office-ui-fabric-react/lib/Persona';
+import { TestImages } from 'office-ui-fabric-react/lib/common/TestImages';
+
+export const people: (IPersonaProps & { key: string | number })[] = [
+  {
+    key: 1,
+    imageUrl: TestImages.personaFemale,
+    imageInitials: 'PV',
+    primaryText: 'Annie Lindqvist',
+    secondaryText: 'Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.online
+  },
+  {
+    key: 2,
+    imageUrl: TestImages.personaMale,
+    imageInitials: 'AR',
+    primaryText: 'Aaron Reid',
+    secondaryText: 'Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.busy
+  },
+  {
+    key: 3,
+    imageUrl: TestImages.personaMale,
+    imageInitials: 'AL',
+    primaryText: 'Alex Lundberg',
+    secondaryText: 'Software Developer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.dnd
+  },
+  {
+    key: 4,
+    imageUrl: TestImages.personaMale,
+    imageInitials: 'RK',
+    primaryText: 'Roko Kolar',
+    secondaryText: 'Financial Analyst',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.offline
+  },
+  {
+    key: 5,
+    imageUrl: TestImages.personaMale,
+    imageInitials: 'CB',
+    primaryText: 'Christian Bergqvist',
+    secondaryText: 'Sr. Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.online
+  },
+  {
+    key: 6,
+    imageUrl: TestImages.personaFemale,
+    imageInitials: 'VL',
+    primaryText: 'Valentina Lovric',
+    secondaryText: 'Design Developer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.online
+  },
+  {
+    key: 7,
+    imageUrl: TestImages.personaMale,
+    imageInitials: 'MS',
+    primaryText: 'Maor Sharett',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.away
+  },
+  {
+    key: 8,
+    imageUrl: TestImages.personaFemale,
+    imageInitials: 'PV',
+    primaryText: 'Anny Lindqvist',
+    secondaryText: 'Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.busy
+  },
+  {
+    key: 9,
+    imageUrl: TestImages.personaMale,
+    imageInitials: 'AR',
+    primaryText: 'Aron Reid',
+    secondaryText: 'Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.dnd
+  },
+  {
+    key: 10,
+    imageUrl: TestImages.personaMale,
+    imageInitials: 'AL',
+    primaryText: 'Alix Lundberg',
+    secondaryText: 'Software Developer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.offline
+  },
+  {
+    key: 11,
+    imageUrl: TestImages.personaMale,
+    imageInitials: 'RK',
+    primaryText: 'Roko Kular',
+    secondaryText: 'Financial Analyst',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.none
+
+  },
+  {
+    key: 12,
+    imageUrl: TestImages.personaMale,
+    imageInitials: 'CB',
+    primaryText: 'Christian Bergqvest',
+    secondaryText: 'Sr. Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.busy
+  },
+  {
+    key: 13,
+    imageUrl: TestImages.personaFemale,
+    imageInitials: 'VL',
+    primaryText: 'Valintina Lovric',
+    secondaryText: 'Design Developer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.busy
+  },
+  {
+    key: 14,
+    imageUrl: TestImages.personaMale,
+    imageInitials: 'MS',
+    primaryText: 'Maor Sharet',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.blocked
+  },
+  {
+    key: 15,
+    imageUrl: TestImages.personaFemale,
+    imageInitials: 'VL',
+    primaryText: 'Anny Lindqvest',
+    secondaryText: 'SDE',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.blocked
+  },
+  {
+    key: 16,
+    imageUrl: TestImages.personaMale,
+    imageInitials: 'MS',
+    primaryText: 'Alix Lunberg',
+    secondaryText: 'SE',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.away
+  },
+  {
+    key: 17,
+    imageUrl: TestImages.personaFemale,
+    imageInitials: 'VL',
+    primaryText: 'Annie Lindqvest',
+    secondaryText: 'SDET',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.online
+  },
+  {
+    key: 18,
+    imageUrl: TestImages.personaMale,
+    imageInitials: 'MS',
+    primaryText: 'Alixander Lundberg',
+    secondaryText: 'Senior Manager of SDET',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.offline
+  },
+  {
+    key: 19,
+    imageUrl: TestImages.personaFemale,
+    imageInitials: 'VL',
+    primaryText: 'Anny Lundqvist',
+    secondaryText: 'Junior Manager of Software',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.away
+  },
+  {
+    key: 20,
+    imageUrl: TestImages.personaMale,
+    imageInitials: 'MS',
+    primaryText: 'Maor Shorett',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.blocked
+  },
+  {
+    key: 21,
+    imageUrl: TestImages.personaFemale,
+    imageInitials: 'VL',
+    primaryText: 'Valentina Lovrics',
+    secondaryText: 'Design Developer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.online
+  },
+  {
+    key: 22,
+    imageUrl: TestImages.personaMale,
+    imageInitials: 'MS',
+    primaryText: 'Maor Sharet',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.online
+  },
+  {
+    key: 23,
+    imageUrl: TestImages.personaFemale,
+    imageInitials: 'VL',
+    primaryText: 'Valentina Lovrecs',
+    secondaryText: 'Design Developer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.blocked
+  },
+  {
+    key: 24,
+    imageUrl: TestImages.personaMale,
+    imageInitials: 'MS',
+    primaryText: 'Maor Sharitt',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.offline
+  },
+  {
+    key: 25,
+    imageUrl: './images/persona-male.png',
+    imageInitials: 'MS',
+    primaryText: 'Maor Shariett',
+    secondaryText: 'Design Developer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 3:00pm',
+    presence: PersonaPresence.online
+  },
+  {
+    key: 26,
+    imageUrl: './images/persona-female.png',
+    imageInitials: 'AL',
+    primaryText: 'Alix Lundburg',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 3:00pm',
+    presence: PersonaPresence.away
+  },
+  {
+    key: 27,
+    imageUrl: './images/persona-female.png',
+    imageInitials: 'VL',
+    primaryText: 'Valantena Lovric',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.busy
+  },
+  {
+    key: 28,
+    imageUrl: './images/persona-female.png',
+    imageInitials: 'VL',
+    primaryText: 'Velatine Lourvric',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.online
+  },
+  {
+    key: 29,
+    imageUrl: './images/persona-female.png',
+    imageInitials: 'VL',
+    primaryText: 'Valentyna Lovrique',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.busy
+  },
+  {
+    key: 30,
+    imageUrl: './images/persona-female.png',
+    imageInitials: 'AL',
+    primaryText: 'Annie Lindquest',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.dnd
+  },
+  {
+    key: 31,
+    imageUrl: './images/persona-female.png',
+    imageInitials: 'AL',
+    primaryText: 'Anne Lindquist',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.blocked
+  },
+  {
+    key: 32,
+    imageUrl: './images/persona-female.png',
+    imageInitials: 'AL',
+    primaryText: 'Ann Lindqiest',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.online
+  },
+  {
+    key: 33,
+    imageUrl: './images/persona-male.png',
+    imageInitials: 'AR',
+    primaryText: 'Aron Reid',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.away
+  },
+  {
+    key: 34,
+    imageUrl: './images/persona-male.png',
+    imageInitials: 'AR',
+    primaryText: 'Aaron Reed',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.offline
+  },
+  {
+    key: 35,
+    imageUrl: './images/persona-female.png',
+    imageInitials: 'AL',
+    primaryText: 'Alix Lindberg',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.busy
+  },
+  {
+    key: 36,
+    imageUrl: './images/persona-male.png',
+    imageInitials: 'AL',
+    primaryText: 'Alan Lindberg',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.busy
+  },
+  {
+    key: 37,
+    imageUrl: './images/persona-male.png',
+    imageInitials: 'MS',
+    primaryText: 'Maor Sharit',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.offline
+  },
+  {
+    key: 38,
+    imageUrl: './images/persona-male.png',
+    imageInitials: 'MS',
+    primaryText: 'Maorr Sherit',
+    secondaryText: 'UX Designer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.online
+  },
+  {
+    key: 39,
+    imageUrl: './images/persona-male.png',
+    imageInitials: 'AL',
+    primaryText: 'Alex Lindbirg',
+    secondaryText: 'Software Developer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.dnd
+  },
+  {
+    key: 40,
+    imageUrl: './images/persona-male.png',
+    imageInitials: 'AL',
+    primaryText: 'Alex Lindbarg',
+    secondaryText: 'Software Developer',
+    tertiaryText: 'In a meeting',
+    optionalText: 'Available at 4:00pm',
+    presence: PersonaPresence.online
+  }
+];
+
+export const mru: IPersonaProps[] = people.slice(0, 5);
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/index.ts b/packages/experiments/src/components/ExtendedPicker/index.ts
new file mode 100644
index 0000000000000..5bcd85209d190
--- /dev/null
+++ b/packages/experiments/src/components/ExtendedPicker/index.ts
@@ -0,0 +1,5 @@
+export * from './BaseFloatingPicker';
+export * from './BaseFloatingPicker.Props';
+export * from './BaseExtendedPicker';
+export * from './PeoplePicker/ExtendedPeoplePicker';
+export * from './PeoplePicker/FloatingPeoplePicker';
\ No newline at end of file
diff --git a/packages/experiments/src/demo/AppDefinition.tsx b/packages/experiments/src/demo/AppDefinition.tsx
index b262e1a972458..900825cc51232 100644
--- a/packages/experiments/src/demo/AppDefinition.tsx
+++ b/packages/experiments/src/demo/AppDefinition.tsx
@@ -39,6 +39,18 @@ export const AppDefinition: IAppDefinition = {
           key: 'TilesList',
           name: 'TilesList',
           url: '#/examples/tileslist'
+        },
+        {
+          component: require<any>('../components/ExtendedPicker/PeoplePicker/ExtendedPeoplePickerPage').ExtendedPeoplePickerPage,
+          key: 'ExtendedPeoplePicker',
+          name: 'ExtendedPeoplePicker',
+          url: '#/examples/extendedpeoplepicker'
+        },
+        {
+          component: require<any>('../components/ExtendedPicker/PeoplePicker/FloatingPeoplePickerPage').FloatingPeoplePickerPage,
+          key: 'FloatingPeoplePicker',
+          name: 'FloatingPeoplePicker',
+          url: '#/examples/floatingpeoplepicker'
         }
       ]
     }
diff --git a/packages/experiments/src/index.ts b/packages/experiments/src/index.ts
index 7fe886277ffed..9ab403a39e978 100644
--- a/packages/experiments/src/index.ts
+++ b/packages/experiments/src/index.ts
@@ -3,4 +3,5 @@ export { LayoutGroup } from './LayoutGroup';
 export { FolderCover } from './FolderCover';
 export { Tile } from './Tile';
 export { TilesList } from './TilesList';
-export { CommandBar as ExperimentCommandBar } from './CommandBar';
\ No newline at end of file
+export { CommandBar as ExperimentCommandBar } from './CommandBar';
+export { ExtendedPeoplePicker, FloatingPeoplePicker } from './ExtendedPicker';
\ No newline at end of file

From ab9e5db6f06d9f52c648281cd97bbbce4cf9fa77 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 17 Oct 2017 09:57:50 -0700
Subject: [PATCH 0867/1641] Merge styles: fixed RTL registration case. (#3136)

* Addressing issue when registering opacity: 0 in rtl using mergeStyles keyframes helper.

* Adding change file.
---
 .../merge-styles-fix_2017-10-17-16-40.json    | 11 ++++++++++
 packages/merge-styles/src/keyframes.test.ts   | 21 +++++++++++++++++++
 packages/merge-styles/src/mergeStyles.test.ts | 16 ++++++++++++++
 .../src/transforms/provideUnits.test.ts       |  2 +-
 .../src/transforms/provideUnits.ts            |  9 ++++----
 5 files changed, 53 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/@uifabric/merge-styles/merge-styles-fix_2017-10-17-16-40.json

diff --git a/common/changes/@uifabric/merge-styles/merge-styles-fix_2017-10-17-16-40.json b/common/changes/@uifabric/merge-styles/merge-styles-fix_2017-10-17-16-40.json
new file mode 100644
index 0000000000000..7a4a15669e595
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/merge-styles-fix_2017-10-17-16-40.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "mergeStyles: in RTL we were seeing exceptions with registering opacity: 0 in keyframes. This has been addressed and a test has been added to cover the case.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/merge-styles/src/keyframes.test.ts b/packages/merge-styles/src/keyframes.test.ts
index 064596cd05d35..8ff596e0df659 100644
--- a/packages/merge-styles/src/keyframes.test.ts
+++ b/packages/merge-styles/src/keyframes.test.ts
@@ -3,6 +3,7 @@ import {
   Stylesheet,
   InjectionMode
 } from './Stylesheet';
+import { setRTL } from './transforms/rtlifyRules';
 
 const _stylesheet: Stylesheet = Stylesheet.getInstance();
 
@@ -13,6 +14,10 @@ describe('keyframes', () => {
     _stylesheet.reset();
   });
 
+  afterEach(() => {
+    setRTL(false);
+  });
+
   it('can register from/to keyframes', () => {
     keyframes({
       from: {
@@ -28,6 +33,22 @@ describe('keyframes', () => {
     );
   });
 
+  it('can register from/to keyframes in rtl', () => {
+    setRTL(true);
+    keyframes({
+      from: {
+        opacity: 0,
+      },
+      to: {
+        opacity: 1
+      }
+    });
+
+    expect(_stylesheet.getRules()).toEqual(
+      '@keyframes css-0{from{opacity:0;}to{opacity:1;}}'
+    );
+  });
+
   it('can register percentage keyframes', () => {
     keyframes({
       '0%': {
diff --git a/packages/merge-styles/src/mergeStyles.test.ts b/packages/merge-styles/src/mergeStyles.test.ts
index 3e205f1dc5d17..744a9421ec143 100644
--- a/packages/merge-styles/src/mergeStyles.test.ts
+++ b/packages/merge-styles/src/mergeStyles.test.ts
@@ -3,6 +3,7 @@ import {
   Stylesheet,
   InjectionMode
 } from './Stylesheet';
+import { setRTL } from './transforms/rtlifyRules';
 
 const _stylesheet: Stylesheet = Stylesheet.getInstance();
 
@@ -13,6 +14,21 @@ describe('mergeStyles', () => {
     _stylesheet.reset();
   });
 
+  afterEach(() => {
+    setRTL(false);
+  });
+
+  it('can register left', () => {
+    mergeStyles({ left: 10 });
+    expect(_stylesheet.getRules()).toEqual('.css-0{left:10px;}');
+  });
+
+  it('can register left in rtl', () => {
+    setRTL(true);
+    mergeStyles({ left: 10 });
+    expect(_stylesheet.getRules()).toEqual('.css-0{right:10px;}');
+  });
+
   it('can join strings', () => {
     expect(mergeStyles('a', false, null, undefined, 'b')).toEqual('a b');
   });
diff --git a/packages/merge-styles/src/transforms/provideUnits.test.ts b/packages/merge-styles/src/transforms/provideUnits.test.ts
index 459ab0ee37c02..e45391fc0d009 100644
--- a/packages/merge-styles/src/transforms/provideUnits.test.ts
+++ b/packages/merge-styles/src/transforms/provideUnits.test.ts
@@ -55,7 +55,7 @@ describe('provideUnits', () => {
 
     provideUnits(testSet, 0);
 
-    expect(testSet).toEqual(['opacity', 0]);
+    expect(testSet).toEqual(['opacity', '0']);
   });
 
 });
\ No newline at end of file
diff --git a/packages/merge-styles/src/transforms/provideUnits.ts b/packages/merge-styles/src/transforms/provideUnits.ts
index 86d3997c03bc8..2d2fe1e018988 100644
--- a/packages/merge-styles/src/transforms/provideUnits.ts
+++ b/packages/merge-styles/src/transforms/provideUnits.ts
@@ -18,10 +18,9 @@ export function provideUnits(
   const name = rulePairs[index];
   const value = rulePairs[index + 1];
 
-  if (
-    typeof value === 'number' &&
-    NON_PIXEL_NUMBER_PROPS.indexOf(name as string) === -1
-  ) {
-    rulePairs[index + 1] = `${value}px`;
+  if (typeof value === 'number') {
+    const unit = (NON_PIXEL_NUMBER_PROPS.indexOf(name as string) === -1) ? 'px' : '';
+
+    rulePairs[index + 1] = `${value}${unit}`;
   }
 }

From de4803c41fb8d78b1410ad354d0111cd4d958f29 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 17 Oct 2017 10:17:41 -0700
Subject: [PATCH 0868/1641] Applying package updates.

---
 ...ndBaseFloatingPicker_2017-10-05-17-24.json | 11 ---------
 .../merge-styles-fix_2017-10-17-16-40.json    | 11 ---------
 ...-searchBox-onKeyDown_2017-10-16-21-18.json | 11 ---------
 ...onDismissRenderParam_2017-10-12-23-26.json | 11 ---------
 packages/experiments/CHANGELOG.json           | 19 +++++++++++++++
 packages/experiments/CHANGELOG.md             |  9 ++++++-
 packages/experiments/package.json             |  4 ++--
 .../CHANGELOG.json                            | 17 +++++++++++++
 .../jest-serializer-merge-styles/CHANGELOG.md |  9 +++++++
 .../jest-serializer-merge-styles/package.json |  2 +-
 packages/merge-styles/CHANGELOG.json          | 14 +++++++++++
 packages/merge-styles/CHANGELOG.md            |  9 ++++++-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 24 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++++-
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/package.json                 |  2 +-
 scripts/package.json                          |  2 +-
 18 files changed, 116 insertions(+), 55 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/createBaseWellPickerAndBaseFloatingPicker_2017-10-05-17-24.json
 delete mode 100644 common/changes/@uifabric/merge-styles/merge-styles-fix_2017-10-17-16-40.json
 delete mode 100644 common/changes/office-ui-fabric-react/cicciodm-searchBox-onKeyDown_2017-10-16-21-18.json
 delete mode 100644 common/changes/office-ui-fabric-react/onDismissRenderParam_2017-10-12-23-26.json
 create mode 100644 packages/jest-serializer-merge-styles/CHANGELOG.json
 create mode 100644 packages/jest-serializer-merge-styles/CHANGELOG.md

diff --git a/common/changes/@uifabric/experiments/createBaseWellPickerAndBaseFloatingPicker_2017-10-05-17-24.json b/common/changes/@uifabric/experiments/createBaseWellPickerAndBaseFloatingPicker_2017-10-05-17-24.json
deleted file mode 100644
index 15c945c7df075..0000000000000
--- a/common/changes/@uifabric/experiments/createBaseWellPickerAndBaseFloatingPicker_2017-10-05-17-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Create BaseExtendedPicker which extends current BasePicker to experiment with adding new functionality and create BaseFloatingPicker support @mention like scenarios, respectively",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "amyngu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/merge-styles-fix_2017-10-17-16-40.json b/common/changes/@uifabric/merge-styles/merge-styles-fix_2017-10-17-16-40.json
deleted file mode 100644
index 7a4a15669e595..0000000000000
--- a/common/changes/@uifabric/merge-styles/merge-styles-fix_2017-10-17-16-40.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "mergeStyles: in RTL we were seeing exceptions with registering opacity: 0 in keyframes. This has been addressed and a test has been added to cover the case.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/cicciodm-searchBox-onKeyDown_2017-10-16-21-18.json b/common/changes/office-ui-fabric-react/cicciodm-searchBox-onKeyDown_2017-10-16-21-18.json
deleted file mode 100644
index 2957e9cf1d322..0000000000000
--- a/common/changes/office-ui-fabric-react/cicciodm-searchBox-onKeyDown_2017-10-16-21-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SearchBox: expose onKeyDown event by invoking external prop",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "f.dimauro92@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/onDismissRenderParam_2017-10-12-23-26.json b/common/changes/office-ui-fabric-react/onDismissRenderParam_2017-10-12-23-26.json
deleted file mode 100644
index 828591f6e1221..0000000000000
--- a/common/changes/office-ui-fabric-react/onDismissRenderParam_2017-10-12-23-26.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: Pass in a menu dismiss function into onRender to allow custom rendered menu items to dismiss the menu",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 24fde6cb9a635..0cf20a4828af0 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.1.0",
+      "tag": "@uifabric/experiments_v5.1.0",
+      "date": "Tue, 17 Oct 2017 17:17:41 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "amyngu <31973030+amyngu@users.noreply.github.com>",
+            "commit": "ddecb07ddeb35964ee17705d2ebccabd6c44f8dd",
+            "comment": "Create BaseExtendedPicker which extends current BasePicker to experiment with adding new functionality and create BaseFloatingPicker support @mention like scenarios, respectively"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.9.2 <6.0.0` to `>=5.9.3 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.5",
       "tag": "@uifabric/experiments_v5.0.5",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 8421e4d97ce16..742382b13e572 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Fri, 13 Oct 2017 01:36:01 GMT and should not be manually modified.
+This log was last generated on Tue, 17 Oct 2017 17:17:41 GMT and should not be manually modified.
+
+## 5.1.0
+Tue, 17 Oct 2017 17:17:41 GMT
+
+### Minor changes
+
+- Create BaseExtendedPicker which extends current BasePicker to experiment with adding new functionality and create BaseFloatingPicker support @mention like scenarios, respectively
 
 ## 5.0.5
 Fri, 13 Oct 2017 01:36:01 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index f048b8f402501..11ab1285ebcf4 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.0.5",
+  "version": "5.1.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.9.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.9.3 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/jest-serializer-merge-styles/CHANGELOG.json b/packages/jest-serializer-merge-styles/CHANGELOG.json
new file mode 100644
index 0000000000000..e58ae912441c7
--- /dev/null
+++ b/packages/jest-serializer-merge-styles/CHANGELOG.json
@@ -0,0 +1,17 @@
+{
+  "name": "@uifabric/jest-serializer-merge-styles",
+  "entries": [
+    {
+      "version": "5.0.0",
+      "tag": "@uifabric/jest-serializer-merge-styles_v5.0.0",
+      "date": "Tue, 17 Oct 2017 17:17:41 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.4.0 <6.0.0` to `>=5.4.1 <6.0.0`"
+          }
+        ]
+      }
+    }
+  ]
+}
\ No newline at end of file
diff --git a/packages/jest-serializer-merge-styles/CHANGELOG.md b/packages/jest-serializer-merge-styles/CHANGELOG.md
new file mode 100644
index 0000000000000..24f6f0f3bce9c
--- /dev/null
+++ b/packages/jest-serializer-merge-styles/CHANGELOG.md
@@ -0,0 +1,9 @@
+# Change Log - @uifabric/jest-serializer-merge-styles
+
+This log was last generated on Tue, 17 Oct 2017 17:17:41 GMT and should not be manually modified.
+
+## 5.0.0
+Tue, 17 Oct 2017 17:17:41 GMT
+
+*Initial release*
+
diff --git a/packages/jest-serializer-merge-styles/package.json b/packages/jest-serializer-merge-styles/package.json
index 606bf1708e7ff..c6e9c48dbabdd 100644
--- a/packages/jest-serializer-merge-styles/package.json
+++ b/packages/jest-serializer-merge-styles/package.json
@@ -24,6 +24,6 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/merge-styles": ">=5.4.0 <6.0.0"
+    "@uifabric/merge-styles": ">=5.4.1 <6.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index ac5f57a55faaa..fc83f9bf3761d 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.4.1",
+      "tag": "@uifabric/merge-styles_v5.4.1",
+      "date": "Tue, 17 Oct 2017 17:17:41 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "ab9e5db6f06d9f52c648281cd97bbbce4cf9fa77",
+            "comment": "mergeStyles: in RTL we were seeing exceptions with registering opacity: 0 in keyframes. This has been addressed and a test has been added to cover the case."
+          }
+        ]
+      }
+    },
     {
       "version": "5.4.0",
       "tag": "@uifabric/merge-styles_v5.4.0",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index 32ebac3e2a2be..b4b2d844f984a 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Fri, 13 Oct 2017 04:00:17 GMT and should not be manually modified.
+This log was last generated on Tue, 17 Oct 2017 17:17:41 GMT and should not be manually modified.
+
+## 5.4.1
+Tue, 17 Oct 2017 17:17:41 GMT
+
+### Patches
+
+- mergeStyles: in RTL we were seeing exceptions with registering opacity: 0 in keyframes. This has been addressed and a test has been added to cover the case.
 
 ## 5.4.0
 Fri, 13 Oct 2017 04:00:17 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index 6ab41bf001f23..ba94c921a08c7 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.4.0",
+  "version": "5.4.1",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 323971d286480..cd74bc93799c2 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.9.3",
+      "tag": "office-ui-fabric-react_v5.9.3",
+      "date": "Tue, 17 Oct 2017 17:17:41 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "cicciodm <f.dimauro92@gmail.com>",
+            "commit": "807f6afe2fc8019f6c068f909a4be8ceeb9c8e9a",
+            "comment": "SearchBox: expose onKeyDown event by invoking external prop"
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "44391e1f9fc8724a690e74ea9ea2ea34ab1c0047",
+            "comment": "ContextualMenu: Pass in a menu dismiss function into onRender to allow custom rendered menu items to dismiss the menu"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.4.0 <6.0.0` to `>=5.4.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.9.2",
       "tag": "office-ui-fabric-react_v5.9.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index c4959758fef1d..79fe03f9fbce1 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 16 Oct 2017 22:49:01 GMT and should not be manually modified.
+This log was last generated on Tue, 17 Oct 2017 17:17:41 GMT and should not be manually modified.
+
+## 5.9.3
+Tue, 17 Oct 2017 17:17:41 GMT
+
+### Patches
+
+- SearchBox: expose onKeyDown event by invoking external prop
+- ContextualMenu: Pass in a menu dismiss function into onRender to allow custom rendered menu items to dismiss the menu
 
 ## 5.9.2
 Mon, 16 Oct 2017 22:49:01 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 4990a941443d9..b990e1a808988 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.9.2",
+  "version": "5.9.3",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -46,7 +46,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.4.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.4.1 <6.0.0",
     "@uifabric/styling": ">=5.3.0 <6.0.0",
     "@uifabric/utilities": ">=5.2.1 <6.0.0",
     "prop-types": "^15.5.10",
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 5840a1a051963..91e7b2b943471 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -21,7 +21,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/utilities": ">=5.2.1 <6.0.0",
-    "@uifabric/merge-styles": ">=5.4.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.4.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/scripts/package.json b/scripts/package.json
index c3634a37d328f..799ff7c1f4722 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -10,7 +10,7 @@
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.7.5",
     "@microsoft/loader-load-themed-styles": "^1.6.0",
-    "@uifabric/merge-styles": ">=5.4.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.4.1 <6.0.0",
     "autoprefixer": "^7.1.5",
     "awesome-typescript-loader": "^3.2.3",
     "bundlesize": "^0.15.2",

From 385db1890e957ed7410f615b0ae6b452ef53488c Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Tue, 17 Oct 2017 13:07:30 -0700
Subject: [PATCH 0869/1641] ComboBox/Toggle: Gray out combobox & toggle label
 when component is disabled (#3094)

* Fix missing disabled prop from label component in ComboBox

* Add npm run change file

* Make label gray when in high contrast

* Make label gray for toggle component

* Update malozano-ComboBoxDisableStyle_2017-10-11-23-28.json

* Add selectors keyword to highcontrast media query

* Add selectors to toggle text

* Change @media query for toggle text to the right rule disabled rule
---
 ...ComboBoxDisableStyle_2017-10-11-23-28.json | 11 ++++++++++
 .../src/components/ComboBox/ComboBox.tsx      |  2 +-
 .../src/components/Label/Label.classNames.ts  |  9 +++++++-
 .../components/Toggle/Toggle.classNames.ts    | 21 ++++++++++++++++---
 4 files changed, 38 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/malozano-ComboBoxDisableStyle_2017-10-11-23-28.json

diff --git a/common/changes/office-ui-fabric-react/malozano-ComboBoxDisableStyle_2017-10-11-23-28.json b/common/changes/office-ui-fabric-react/malozano-ComboBoxDisableStyle_2017-10-11-23-28.json
new file mode 100644
index 0000000000000..cbd6c0cbc522d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-ComboBoxDisableStyle_2017-10-11-23-28.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: the label now appears disabled when the ComboBox is disabled.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 8ba905ce5118c..b962134ea3122 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -248,7 +248,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     return (
       <div {...divProps } ref='root' className={ this._classNames.container }>
         { label && (
-          <Label id={ id + '-label' } required={ required } htmlFor={ id } className={ this._classNames.label }>{ label }</Label>
+          <Label id={ id + '-label' } disabled={ disabled } required={ required } htmlFor={ id } className={ this._classNames.label }>{ label }</Label>
         ) }
         <div
           ref={ this._resolveRef('_comboBoxWrapper') }
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.classNames.ts b/packages/office-ui-fabric-react/src/components/Label/Label.classNames.ts
index 96f0ed736f21e..a5026cb0c1e60 100644
--- a/packages/office-ui-fabric-react/src/components/Label/Label.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Label/Label.classNames.ts
@@ -5,6 +5,8 @@ export interface ILabelClassNames {
   root: string;
 }
 
+const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
+
 export const getLabelClassNames = memoizeFunction((theme: ITheme, className: string | undefined, disabled: boolean, required: boolean): ILabelClassNames => {
   return mergeStyleSets({
     root:
@@ -20,7 +22,12 @@ export const getLabelClassNames = memoizeFunction((theme: ITheme, className: str
         overflowWrap: 'break-word',
       },
       disabled && {
-        color: theme.semanticColors.disabledText
+        color: theme.semanticColors.disabledText,
+        selectors: {
+          [MS_HIGHCONTRAST_ACTIVE]: {
+            color: 'GrayText'
+          }
+        }
       },
       required && {
         selectors: {
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
index 011b316bb60e1..d7a6937361808 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
@@ -15,6 +15,8 @@ export interface IToggleClassNames {
   text?: string;
 }
 
+const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
+
 export const getClassNames = memoizeFunction((
   theme: ITheme,
   styles: IToggleStyles,
@@ -53,7 +55,15 @@ export const getClassNames = memoizeFunction((
 
     label: [
       'ms-Toggle-label',
-      styles.label
+      styles.label,
+      disabled && {
+        color: textDisabledColor,
+        selectors: {
+          [MS_HIGHCONTRAST_ACTIVE]: {
+            color: 'GrayText'
+          },
+        }
+      }
     ],
 
     container: [
@@ -189,14 +199,19 @@ export const getClassNames = memoizeFunction((
           '&&': {
             padding: '0',
             margin: '0 10px',
-            userSelect: 'none'
+            userSelect: 'none',
           }
         }
       },
       disabled && {
         selectors: {
           '&&': {
-            color: textDisabledColor
+            color: textDisabledColor,
+            selectors: {
+              [MS_HIGHCONTRAST_ACTIVE]: {
+                color: 'GrayText'
+              },
+            }
           }
         }
       },

From 046c4698dd69553e32193c1e2cdd973dc6ee27f9 Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Tue, 17 Oct 2017 14:08:13 -0700
Subject: [PATCH 0870/1641] ContextualMenu: Render splitbuttons inside menu
 sections (#3122)

* Add split prop

* render split as button with base button

* Render primary button

* Make split button render in CM with logic inside CM component

* FIx split button click handlers

* Delete unused prototype code

* Make SplitButtons in menus checkable

* Add aria checked attribute

* Add npm run change file

* Remove unused import

* Remove unused codepath

* Remove extra example of splitButton in Menu

* Remove unused alert

* Change to only render as split button if split is true and item has submenuprops

* Change primaryButton render method name to a show this is a split button function

* Add height to splitButtonDivider

* Rename splitDivider to splitButtonSeparator

* Change name of checkable contextual menu examplecard
---
 ...alozano-splitInMenus_2017-10-14-00-24.json | 11 +++
 .../ContextualMenu/ContextualMenu.Props.ts    | 17 +++++
 .../ContextualMenu.classNames.ts              | 47 +++++++++++-
 .../ContextualMenu/ContextualMenu.styles.ts   | 15 ++++
 .../ContextualMenu/ContextualMenu.tsx         | 72 +++++++++++++++++++
 .../ContextualMenu/ContextualMenuPage.tsx     |  2 +-
 .../ContextualMenu.Checkmarks.Example.tsx     |  6 +-
 7 files changed, 167 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/malozano-splitInMenus_2017-10-14-00-24.json

diff --git a/common/changes/office-ui-fabric-react/malozano-splitInMenus_2017-10-14-00-24.json b/common/changes/office-ui-fabric-react/malozano-splitInMenus_2017-10-14-00-24.json
new file mode 100644
index 0000000000000..bfd4d694dd685
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-splitInMenus_2017-10-14-00-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "\"ContextualMenu: SplitButtons can now appear inside menus\"",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
index 8c389fa4ce9d7..f2e27c78b7ccf 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
@@ -242,6 +242,12 @@ export interface IContextualMenuItem {
    */
   disabled?: boolean;
 
+  /**
+   * If the menu item is a split button, this prop disables purely the primary action of the button.
+   * @defaultvalue false
+   */
+  primaryDisabled?: boolean;
+
   /**
    * Deprecated at v0.65.1 and will be removed by v 1.0. Use 'disabled' instead.
    * @deprecated
@@ -271,6 +277,12 @@ export interface IContextualMenuItem {
    */
   isChecked?: boolean;
 
+  /**
+   * Whether or not this menu item is a splitButton.
+   * @defaultvalue false
+   */
+  split?: boolean;
+
   /**
    * Any custom data the developer wishes to associate with the menu item.
    */
@@ -433,6 +445,11 @@ export interface IMenuItemStyles extends IButtonStyles {
   * Styles for a divider item of a ConextualMenu.
   */
   divider: IStyle;
+
+  /**
+   * Styles for a split button divider in a menu item
+   */
+  splitButtonSeparator: IStyle;
 }
 
 export interface IContextualMenuStyles {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
index d03d7f421210e..635fc3eaf5dd7 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
@@ -18,6 +18,10 @@ export interface IMenuItemClassNames {
   icon: string;
   subMenuIcon: string;
   label: string;
+  splitButtonSeparator: string;
+  splitContainer: string;
+  splitPrimary: string;
+  splitMenu: string;
 }
 
 export const getContextualMenuClassNames = memoizeFunction((
@@ -101,6 +105,45 @@ export const getItemClassNames = memoizeFunction((
         }
       }],
     ],
+    splitPrimary: [
+      styles.root,
+      checked && [
+        'is-checked',
+        styles.rootChecked
+      ],
+      disabled && [
+        'is-disabled',
+        styles.rootDisabled
+      ],
+      !disabled && !checked && [{
+        selectors: {
+          ':hover': styles.rootHovered,
+          ':active': styles.rootPressed,
+          '.ms-Fabric.is-focusVisible &:focus': styles.rootFocused
+        }
+      }]
+    ],
+    splitMenu: [
+      styles.root,
+      {
+        width: 32
+      },
+      expanded && [
+        'is-expanded',
+        styles.rootExpanded
+      ],
+      disabled && [
+        'is-disabled',
+        styles.rootDisabled
+      ],
+      !disabled && !expanded && [{
+        selectors: {
+          ':hover': styles.rootHovered,
+          ':active': styles.rootPressed,
+          '.ms-Fabric.is-focusVisible &:focus': styles.rootFocused
+        }
+      }]
+    ],
     linkContent: [
       'ms-ContextualMenu-linkContent',
       styles.linkContent
@@ -119,6 +162,8 @@ export const getItemClassNames = memoizeFunction((
     label: [
       'ms-ContextualMenu-itemText',
       styles.label
-    ]
+    ],
+    splitButtonSeparator: styles.splitButtonSeparator,
+    splitContainer: styles.splitButtonFlexContainer,
   });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
index db4e0865e4c20..4f689ad7d250d 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
@@ -39,6 +39,7 @@ export const getMenuItemStyles = memoizeFunction((
   const ContextualMenuTextSelectedColor = semanticColors.bodySelectedText;
   const ContextualMenuTextDisabledColor = semanticColors.disabledText;
   const ContextualMenuDividerColor = semanticColors.bodyDivider;
+  const SplitButtonDividerHeight = 16;
 
   const menuItemStyles: IMenuItemStyles = {
     item: [
@@ -150,6 +151,20 @@ export const getMenuItemStyles = memoizeFunction((
       verticalAlign: 'middle',
       flexShrink: '0',
       fontSize: FontSizes.mini
+    },
+    splitButtonSeparator: {
+      backgroundColor: ContextualMenuDividerColor,
+      position: 'absolute',
+      width: 1,
+      right: 31,
+      height: SplitButtonDividerHeight,
+    },
+    splitButtonFlexContainer: {
+      display: 'flex',
+      height: '100%',
+      flexWrap: 'nowrap',
+      justifyContent: 'center',
+      alignItems: 'center'
     }
   };
 
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 5bb665519e2cc..66887df7a6c21 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -416,6 +416,11 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     if (item.href) {
       return this._renderAnchorMenuItem(item, classNames, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons);
     }
+
+    if (item.split && hasSubmenuItems(item)) {
+      return this._renderSplitButton(item, classNames, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons);
+    }
+
     return this._renderButtonItem(item, classNames, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons);
   }
 
@@ -494,6 +499,73 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       this._renderMenuItemChildren(item, classNames, index, hasCheckmarks!, hasIcons!));
   }
 
+  private _renderSplitButton(
+    item: IContextualMenuItem,
+    classNames: IMenuItemClassNames,
+    index: number,
+    focusableElementIndex: number,
+    totalItemCount: number,
+    hasCheckmarks?: boolean,
+    hasIcons?: boolean): JSX.Element {
+
+    return (
+      <div
+        aria-labelledby={ item.ariaLabel }
+        aria-disabled={ item.isDisabled || item.disabled }
+        aria-haspopup={ true }
+        aria-describedby={ item.ariaDescription }
+        aria-checked={ item.isChecked || item.checked }
+      >
+        <span
+          aria-hidden={ true }
+          className={ classNames.splitContainer }
+        >
+          { this._renderSplitPrimaryButton(item, classNames, index, hasCheckmarks!, hasIcons!) }
+          { this._renderSplitIconButton(item, classNames, index) }
+          { this._renderSplitDivider(classNames) }
+        </span>
+      </div>
+    );
+  }
+
+  private _renderSplitPrimaryButton(item: IContextualMenuItem, classNames: IMenuItemClassNames, index: number, hasCheckmarks: boolean, hasIcons: boolean) {
+
+    const isChecked: boolean | null | undefined = getIsChecked(item);
+    const canCheck: boolean = isChecked !== null;
+    const defaultRole = canCheck ? 'menuitemcheckbox' : 'menuitem';
+
+    const itemProps = {
+      onClick: this._executeItemClick.bind(this, item),
+      disabled: item.disabled || item.primaryDisabled,
+      name: item.name,
+      className: classNames.splitPrimary,
+      role: item.role || defaultRole,
+      canCheck: item.canCheck,
+      isChecked: item.isChecked,
+      checked: item.checked,
+    } as IContextualMenuItem;
+    return React.createElement('button',
+      getNativeProps(itemProps, buttonProperties),
+      this._renderMenuItemChildren(itemProps, classNames, index, hasCheckmarks, hasIcons));
+  }
+
+  private _renderSplitIconButton(item: IContextualMenuItem, classNames: IMenuItemClassNames, index: number) {
+    const itemProps = {
+      onClick: this._onItemClick.bind(this, item),
+      disabled: item.disabled,
+      className: classNames.splitMenu,
+      subMenuProps: item.subMenuProps,
+      submenuIconProps: item.submenuIconProps
+    } as IContextualMenuItem;
+    return React.createElement('button',
+      getNativeProps(itemProps, buttonProperties),
+      this._renderMenuItemChildren(itemProps, classNames, index, false, false));
+  }
+
+  private _renderSplitDivider(classNames: IMenuItemClassNames) {
+    return <span className={ classNames.splitButtonSeparator } />;
+  }
+
   private _renderMenuItemChildren(item: IContextualMenuItem, classNames: IMenuItemClassNames, index: number, hasCheckmarks: boolean, hasIcons: boolean) {
     const isItemChecked: boolean | null | undefined = getIsChecked(item);
     return (
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
index e4a6b6f4d8823..851e175e87a56 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
@@ -56,7 +56,7 @@ export class ContextualMenuPage extends React.Component<IComponentDemoPageProps,
               <ContextualMenuSectionExample />
             </ExampleCard>
             <ExampleCard
-              title='ContextualMenu with checkable menu items'
+              title='ContextualMenu with checkable menu items and toggable split button'
               code={ ContextualMenuCheckmarksExampleCode }
             >
               <ContextualMenuCheckmarksExample />
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
index 9714b4e60dc28..5e32382c898c2 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
@@ -93,7 +93,11 @@ export class ContextualMenuCheckmarksExample extends React.Component<any, IConte
                     }
                   ],
                 },
-                name: 'New'
+                name: 'Split Button',
+                canCheck: true,
+                isChecked: selection![keys[5]],
+                split: true,
+                onClick: this._onToggleSelect,
               },
             ]
           }

From 608f8d4811dd799cfb20210332d3672ee229dada Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Tue, 17 Oct 2017 15:09:00 -0700
Subject: [PATCH 0871/1641] Theming: add SASS variables for semantic theming to
 support legacy scenarios (#3134)

* Theming: add SASS variables for semantic theming to support legacy scenarios

* change file
---
 ...o-finalSemanticSlots_2017-10-17-00-50.json | 11 ++++++
 .../src/common/_semanticColorVariables.scss   |  2 +
 .../src/common/_semanticSlots.scss            | 39 +++++++++++++++++++
 .../src/common/_themeOverrides.scss           |  4 +-
 4 files changed, 55 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/phkuo-finalSemanticSlots_2017-10-17-00-50.json
 create mode 100644 packages/office-ui-fabric-react/src/common/_semanticSlots.scss

diff --git a/common/changes/office-ui-fabric-react/phkuo-finalSemanticSlots_2017-10-17-00-50.json b/common/changes/office-ui-fabric-react/phkuo-finalSemanticSlots_2017-10-17-00-50.json
new file mode 100644
index 0000000000000..78d4abbfe54f8
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/phkuo-finalSemanticSlots_2017-10-17-00-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Theming: add SASS variables for semantic theming to support legacy scenarios\"",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss b/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
index 8da4afc2594e1..803a82ff1182c 100644
--- a/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
+++ b/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
@@ -1,5 +1,7 @@
 @import './themeOverrides';
 
+/* Don't use the variables in this file anymore! Instead use the ones from ./_semanticSlots.scss */
+
 $focusedBorderColor: $ms-color-neutralSecondary;
 
 $bodyBackgroundColor: $ms-color-white;
diff --git a/packages/office-ui-fabric-react/src/common/_semanticSlots.scss b/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
new file mode 100644
index 0000000000000..cdb050eefea09
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
@@ -0,0 +1,39 @@
+/* Base slots */
+$bodyBackgroundColor: "[theme:bodyBackground, default: #ffffff]";
+$bodyTextColor: "[theme:bodyText, default: #333333]";
+$bodySubtextColor: "[theme:bodySubtext, default: #666666]";
+$bodyDividerColor: "[theme:bodyDivider, default: #eaeaea]";
+
+$disabledBackgroundColor: "[theme:disabledBackground, default: #f4f4f4]";
+$disabledTextColor: "[theme:disabledText, default: #c8c8c8]";
+$disabledSubtextColor: "[theme:disabledSubtext, default: #dadada]";
+
+$focusBorderColor: "[theme:focusBorder, default: #000000]";
+
+$errorTextColor: "[theme:errorText, default: #a80000]";
+$errorBackgroundColor: "[theme:errorBackground, default: rgba(232,17,35,.2)]";
+$blockingBackgroundColor: "[theme:blockingBackground, default: rgba(234,67,0,.2)]";
+$warningBackgroundColor: "[theme:warningBackground, default: rgba(255,185,0,.2)]";
+$warningHighlightColor: "[theme:warningHighlight, default: #ffb900]";
+$successBackgroundColor: "[theme:successBackground, default: rgba(186,216,10,.2)]";
+
+/* Input controls */
+$inputBorderColor: "[theme:inputBorder, default: #a6a6a6]";
+$inputBorderHoveredColor: "[theme:inputBorderHovered, default: #333333]";
+$inputBackgroundCheckedColor: "[theme:inputBackgroundChecked, default: #0078d7]";
+$inputBackgroundCheckedHoveredColor: "[theme:inputBackgroundCheckedHovered, default: #106ebe]";
+$inputForegroundCheckedColor: "[theme:inputForegroundChecked, default: #ffffff]";
+$inputFocusBorderAltColor: "[theme:inputFocusBorderAlt, default: #0078d7]";
+
+/* Menus */
+$menuItemBackgroundHoveredColor: "[theme:menuItemBackgroundHovered, default: #f8f8f8]";
+$menuItemBackgroundCheckedColor: "[theme:menuItemBackgroundChecked, default: #d0d0d0]";
+$menuIconColor: "[theme:menuIcon, default: #0078d7]";
+$menuHeaderColor: "[theme:menuHeader, default: #0078d7]";
+
+/* Lists */
+$listBackgroundColor: "[theme:listBackground, default: #ffffff]";
+$listTextColor: "[theme:listText, default: #333333]";
+$listItemBackgroundHoveredColor: "[theme:listItemBackgroundHovered, default: #f8f8f8]";
+$listItemBackgroundCheckedColor: "[theme:listItemBackgroundChecked, default: #eaeaea]";
+$listItemBackgroundCheckedHoveredColor: "[theme:listItemBackgroundCheckedHovered, default: #d0d0d0]";
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/common/_themeOverrides.scss b/packages/office-ui-fabric-react/src/common/_themeOverrides.scss
index 44912e2a55c07..865e7ede3ea1b 100644
--- a/packages/office-ui-fabric-react/src/common/_themeOverrides.scss
+++ b/packages/office-ui-fabric-react/src/common/_themeOverrides.scss
@@ -1,4 +1,3 @@
-/* themed tokens */
 $ms-color-themeDarker: "[theme:themeDarker, default: #004578]";
 $ms-color-themeDark: "[theme:themeDark, default: #005a9e]";
 $ms-color-themeDarkAlt: "[theme:themeDarkAlt, default: #106ebe]";
@@ -8,6 +7,7 @@ $ms-color-themeTertiary: "[theme:themeTertiary, default: #71afe5]";
 $ms-color-themeLight: "[theme:themeLight, default: #c7e0f4]";
 $ms-color-themeLighter: "[theme:themeLighter, default: #deecf9]";
 $ms-color-themeLighterAlt: "[theme:themeLighterAlt, default: #eff6fc]";
+
 $ms-color-black: "[theme:black, default: #000000]";
 $ms-color-neutralDark: "[theme:neutralDark, default: #212121]";
 $ms-color-neutralPrimary: "[theme:neutralPrimary, default: #333333]";
@@ -22,8 +22,10 @@ $ms-color-neutralLight: "[theme:neutralLight, default: #eaeaea]";
 $ms-color-neutralLighter: "[theme:neutralLighter, default: #f4f4f4]";
 $ms-color-neutralLighterAlt: "[theme:neutralLighterAlt, default: #f8f8f8]";
 $ms-color-white: "[theme:white, default: #ffffff]";
+
 $ms-color-blackTranslucent40: "[theme:blackTranslucent40, default: rgba(0,0,0,.4)]";
 $ms-color-whiteTranslucent40: "[theme:whiteTranslucent40, default: rgba(255,255,255,.4)]";
+
 $ms-color-yellow: "[theme:yellow, default: #ffb900]";
 $ms-color-yellowLight: "[theme:yellowLight, default: #fff100]";
 $ms-color-orange: "[theme:orange, default: #d83b01]";

From 68a345d9e55491298d70cee431bd1f418a67fd44 Mon Sep 17 00:00:00 2001
From: Alex Bettadapur <alexbettadapur@gmail.com>
Date: Tue, 17 Oct 2017 21:23:24 -0700
Subject: [PATCH 0872/1641] [Experiments] Add a form control (#3075)

* Add form and add form base input

* Make debounce cancelable

* Add text input and example

* Initial working component

* Copy over the rest of the inputs

* Lint

* TSLINT

* Finish examples

*  Finish page

* Finish page

* lint

* Changes file

* Add props files for inputs

* Add test files and barrel

* Add form and validator tests

* Add tests for the remaining components

* Save

* Remove old changes

* Update formControl_2017-10-10-23-55.json

* some CR

* Quotes
---
 .../formControl_2017-10-10-23-55.json         |  11 +
 .../formControl_2017-10-10-23-55.json         |  11 +
 .../formControl_2017-10-10-23-55.json         |  11 +
 packages/experiments/src/Form.ts              |   1 +
 .../src/components/Form/Form.Props.ts         |  21 ++
 .../src/components/Form/Form.test.tsx         | 266 ++++++++++++++++++
 .../experiments/src/components/Form/Form.tsx  | 256 +++++++++++++++++
 .../components/Form/FormBaseInput.Props.ts    |  19 ++
 .../src/components/Form/FormBaseInput.ts      | 173 ++++++++++++
 .../src/components/Form/FormPage.scss         |  10 +
 .../src/components/Form/FormPage.tsx          |  88 ++++++
 .../Form/examples/Form.Autosave.Example.tsx   |  62 ++++
 .../Form/examples/Form.Basic.Example.tsx      |  35 +++
 .../Form/examples/Form.Validation.Example.tsx |  61 ++++
 .../experiments/src/components/Form/index.ts  |  15 +
 .../inputs/checkbox/FormCheckBox.Props.ts     |   8 +
 .../inputs/checkbox/FormCheckBox.test.tsx     | 126 +++++++++
 .../Form/inputs/checkbox/FormCheckBox.tsx     |  58 ++++
 .../ConditionalSubmitButton.test.tsx          |  47 ++++
 .../FormConditionalSubmitButton.Props.ts      |  10 +
 .../FormConditionalSubmitButton.tsx           |  50 ++++
 .../inputs/datePicker/FormDatePicker.Props.ts |   8 +
 .../inputs/datePicker/FormDatePicker.scss     |  18 ++
 .../inputs/datePicker/FormDatePicker.test.tsx | 120 ++++++++
 .../Form/inputs/datePicker/FormDatePicker.tsx |  85 ++++++
 .../inputs/dropdown/FormDropdown.Props.ts     |   8 +
 .../inputs/dropdown/FormDropdown.test.tsx     | 139 +++++++++
 .../Form/inputs/dropdown/FormDropdown.tsx     |  64 +++++
 .../inputs/textInput/FormTextInput.Props.ts   |  10 +
 .../inputs/textInput/FormTextInput.test.tsx   | 210 ++++++++++++++
 .../Form/inputs/textInput/FormTextInput.tsx   |  70 +++++
 .../Form/validators/Validators.test.ts        |  75 +++++
 .../components/Form/validators/Validators.ts  | 145 ++++++++++
 .../experiments/src/demo/AppDefinition.tsx    |   6 +
 .../src/components/DatePicker/DatePicker.tsx  |  18 +-
 .../src/components/Dropdown/Dropdown.tsx      |   9 +-
 packages/utilities/src/Async.ts               |  63 ++++-
 37 files changed, 2359 insertions(+), 28 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/formControl_2017-10-10-23-55.json
 create mode 100644 common/changes/@uifabric/utilities/formControl_2017-10-10-23-55.json
 create mode 100644 common/changes/office-ui-fabric-react/formControl_2017-10-10-23-55.json
 create mode 100644 packages/experiments/src/Form.ts
 create mode 100644 packages/experiments/src/components/Form/Form.Props.ts
 create mode 100644 packages/experiments/src/components/Form/Form.test.tsx
 create mode 100644 packages/experiments/src/components/Form/Form.tsx
 create mode 100644 packages/experiments/src/components/Form/FormBaseInput.Props.ts
 create mode 100644 packages/experiments/src/components/Form/FormBaseInput.ts
 create mode 100644 packages/experiments/src/components/Form/FormPage.scss
 create mode 100644 packages/experiments/src/components/Form/FormPage.tsx
 create mode 100644 packages/experiments/src/components/Form/examples/Form.Autosave.Example.tsx
 create mode 100644 packages/experiments/src/components/Form/examples/Form.Basic.Example.tsx
 create mode 100644 packages/experiments/src/components/Form/examples/Form.Validation.Example.tsx
 create mode 100644 packages/experiments/src/components/Form/index.ts
 create mode 100644 packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.Props.ts
 create mode 100644 packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.test.tsx
 create mode 100644 packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.tsx
 create mode 100644 packages/experiments/src/components/Form/inputs/conditionalSubmit/ConditionalSubmitButton.test.tsx
 create mode 100644 packages/experiments/src/components/Form/inputs/conditionalSubmit/FormConditionalSubmitButton.Props.ts
 create mode 100644 packages/experiments/src/components/Form/inputs/conditionalSubmit/FormConditionalSubmitButton.tsx
 create mode 100644 packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.Props.ts
 create mode 100644 packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.scss
 create mode 100644 packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.test.tsx
 create mode 100644 packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.tsx
 create mode 100644 packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.Props.ts
 create mode 100644 packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.test.tsx
 create mode 100644 packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.tsx
 create mode 100644 packages/experiments/src/components/Form/inputs/textInput/FormTextInput.Props.ts
 create mode 100644 packages/experiments/src/components/Form/inputs/textInput/FormTextInput.test.tsx
 create mode 100644 packages/experiments/src/components/Form/inputs/textInput/FormTextInput.tsx
 create mode 100644 packages/experiments/src/components/Form/validators/Validators.test.ts
 create mode 100644 packages/experiments/src/components/Form/validators/Validators.ts

diff --git a/common/changes/@uifabric/experiments/formControl_2017-10-10-23-55.json b/common/changes/@uifabric/experiments/formControl_2017-10-10-23-55.json
new file mode 100644
index 0000000000000..68a6a3c1838cc
--- /dev/null
+++ b/common/changes/@uifabric/experiments/formControl_2017-10-10-23-55.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Add Form control",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "alebet@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/formControl_2017-10-10-23-55.json b/common/changes/@uifabric/utilities/formControl_2017-10-10-23-55.json
new file mode 100644
index 0000000000000..a096c4f7fba3a
--- /dev/null
+++ b/common/changes/@uifabric/utilities/formControl_2017-10-10-23-55.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Add cancel/flush to debounce",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "alebet@microsoft.com"
+}
diff --git a/common/changes/office-ui-fabric-react/formControl_2017-10-10-23-55.json b/common/changes/office-ui-fabric-react/formControl_2017-10-10-23-55.json
new file mode 100644
index 0000000000000..38e3d5ee7b3fa
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/formControl_2017-10-10-23-55.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix refs in Dropdown and Datepicker",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "alebet@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/Form.ts b/packages/experiments/src/Form.ts
new file mode 100644
index 0000000000000..643cfe7c888de
--- /dev/null
+++ b/packages/experiments/src/Form.ts
@@ -0,0 +1 @@
+export * from './components/Form/index';
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/Form.Props.ts b/packages/experiments/src/components/Form/Form.Props.ts
new file mode 100644
index 0000000000000..ae181f468c8cf
--- /dev/null
+++ b/packages/experiments/src/components/Form/Form.Props.ts
@@ -0,0 +1,21 @@
+/* tslint:disable:no-any */
+import * as React from 'react';
+
+/**
+ * The props for Form
+ */
+export interface IFormProps extends React.AllHTMLAttributes<HTMLFormElement> {
+  componentRef?: (component: any) => void;
+
+  /** The submit handler. Passes back results keyed by the names of the inputs */
+  onSubmit?: (results: { [key: string]: any }) => void;
+
+  /** The invalid submit handler. Passes back results when the form is submitted but fails validation */
+  onInvalidSubmit?: (results: { [key: string]: any }) => void;
+
+  /** The update handler. Passes back the valid, updated value of form inputs */
+  onUpdated?: (key: string, value: any) => void;
+
+  /** Should the form show errors when it is pristine? */
+  showErrorsWhenPristine?: boolean;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/Form.test.tsx b/packages/experiments/src/components/Form/Form.test.tsx
new file mode 100644
index 0000000000000..98a1b00562260
--- /dev/null
+++ b/packages/experiments/src/components/Form/Form.test.tsx
@@ -0,0 +1,266 @@
+/* tslint:disable:no-any no-string-literal jsx-no-lambda */
+
+import * as React from 'react';
+import * as ReactTestUtils from 'react-dom/test-utils';
+import * as sinon from 'sinon';
+
+// Controls
+import { Form } from './Form';
+import { IFormProps } from './Form.Props';
+import { DEFAULT_DEBOUNCE } from './FormBaseInput';
+import { FormTextInput } from './inputs/textInput/FormTextInput';
+import { IFormTextInputProps } from './inputs/textInput/FormTextInput.Props';
+import { Validators } from './validators/Validators';
+
+describe('Form', () => {
+  let formProps: IFormProps;
+  let formTextInputProps: IFormTextInputProps;
+  let formRequiredTestMessage = 'This field is required';
+  let formTextBoxValidatorTestMessage = 'Error message for number field';
+
+  describe('Form renders for different props', () => {
+    let renderedForm: Form;
+
+    beforeEach(() => {
+      (renderedForm as any) = undefined;
+
+      formProps = {
+        onSubmit: (value: any) => { /* stub */ }
+      };
+
+      formTextInputProps = {
+        inputKey: 'field',
+        textFieldProps: { label: 'Field' }
+      };
+    });
+
+    afterEach(() => {
+      expect(renderedForm).toBeTruthy();
+    });
+
+    it('Null props', () => {
+      (formProps.onSubmit as any) = null;
+      renderedForm = ReactTestUtils.renderIntoDocument(
+        <Form
+          { ...formProps }
+        />
+      ) as Form;
+    });
+
+    it('One form value', () => {
+      renderedForm = ReactTestUtils.renderIntoDocument(
+        <Form
+          { ...formProps }
+        >
+          <FormTextInput
+            { ...formTextInputProps }
+          />
+        </Form>
+      ) as Form;
+
+      let textInput: Element = ReactTestUtils.findRenderedDOMComponentWithClass(renderedForm, 'ms-TextField');
+      expect(textInput).toBeTruthy();
+    });
+
+    it('Two form values', () => {
+      renderedForm = ReactTestUtils.renderIntoDocument(
+        <Form
+          { ...formProps }
+        >
+          <FormTextInput
+            { ...formTextInputProps }
+          />
+          <FormTextInput
+            { ...formTextInputProps }
+          />
+        </Form>
+      ) as Form;
+
+      let textInputs: Element[] = ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedForm, 'ms-TextField');
+      expect(textInputs.length).toEqual(2);
+    });
+
+    it('Initial form value', () => {
+      formTextInputProps.value = 'Value';
+      renderedForm = ReactTestUtils.renderIntoDocument(
+        <Form
+          { ...formProps }
+        >
+          <FormTextInput
+            { ...formTextInputProps }
+          />
+        </Form>
+      ) as Form;
+
+      let textInput: HTMLInputElement = ReactTestUtils.findRenderedDOMComponentWithTag(renderedForm, 'input') as HTMLInputElement;
+      expect(textInput.value).toEqual('Value');
+    });
+  });
+
+  class ExtendsTextBox extends FormTextInput {
+    public setValue(value: string): void {
+      super.setValue(value);
+    }
+  }
+
+  describe('Simple form validates and return values', () => {
+    let clock: sinon.SinonFakeTimers;
+    beforeEach(() => {
+      clock = sinon.useFakeTimers(Date.now());
+
+      formTextInputProps = {
+        inputKey: 'field',
+        textFieldProps: { label: 'Field' }
+      };
+    });
+
+    afterEach(() => {
+      clock.restore();
+    });
+
+    it('Valid values are returned correctly', () => {
+      let result: any;
+      let renderedForm: Form = ReactTestUtils.renderIntoDocument(
+        <Form
+          onSubmit={ (value: any) => { result = value; } }
+        >
+          <FormTextInput
+            inputKey='field'
+            value='Value'
+          />
+
+          <FormTextInput
+            inputKey='fieldnumber'
+            value='2'
+            validators={ [Validators.isNumber('')] }
+          />
+        </Form>
+      ) as Form;
+      let form: HTMLFormElement = ReactTestUtils.findRenderedDOMComponentWithTag(renderedForm, 'form') as HTMLFormElement;
+      ReactTestUtils.Simulate.submit(form);
+
+      expect(result['field']).toEqual('Value');
+      expect(result['fieldnumber']).toEqual('2');
+    });
+
+    it('Invalid values are not returned', () => {
+      let result: any;
+      let renderedForm: Form = ReactTestUtils.renderIntoDocument(
+        <Form
+          onSubmit={ (value: any) => { result = value; } }
+        >
+          <FormTextInput
+            inputKey='field'
+            validators={ [Validators.required(formRequiredTestMessage)] }
+            value=''
+          />
+
+          <FormTextInput
+            inputKey='field2'
+            value='NAN'
+            validators={ [Validators.isNumber(formTextBoxValidatorTestMessage)] }
+          />
+        </Form>
+      ) as Form;
+
+      let form: HTMLFormElement = ReactTestUtils.findRenderedDOMComponentWithTag(renderedForm, 'form') as HTMLFormElement;
+      ReactTestUtils.Simulate.submit(form);
+
+      let textBox: FormTextInput[] = ReactTestUtils.scryRenderedComponentsWithType(renderedForm, FormTextInput);
+      expect(textBox[0].state.currentError).toEqual(formRequiredTestMessage);
+      expect(textBox[1].state.currentError).toEqual(formTextBoxValidatorTestMessage);
+    });
+
+    it('Number fields with initial value of 0 are displayed properly', () => {
+      let renderedForm: Form = ReactTestUtils.renderIntoDocument(
+        <Form
+          onSubmit={ (value: any) => { /*stub*/ } }
+        >
+          <FormTextInput
+            inputKey='field'
+            value='0'
+          />
+        </Form>
+      ) as Form;
+      let numberField: HTMLDivElement =
+        ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedForm, 'ms-TextField')[0] as HTMLDivElement;
+      let input: HTMLInputElement = numberField.getElementsByTagName('input')[0];
+      expect(input.getAttribute('value')).toEqual('0');
+    });
+
+    it('OnUpdated callback is called without submitting form', () => {
+      let updateCallback: sinon.SinonStub = sinon.stub();
+      let renderedForm: Form = ReactTestUtils.renderIntoDocument(
+        <Form
+          onUpdated={ updateCallback }
+        >
+          <ExtendsTextBox
+            inputKey='field'
+            value='0'
+          />
+        </Form>
+      ) as Form;
+      let textBox: ExtendsTextBox = ReactTestUtils.findRenderedComponentWithType(renderedForm, ExtendsTextBox);
+      textBox.setValue('1');
+      clock.tick(DEFAULT_DEBOUNCE);
+      expect(updateCallback.calledOnce).toBeTruthy();
+    });
+
+    it('Errors are hidden when pristine', () => {
+      let renderedForm: Form = ReactTestUtils.renderIntoDocument(
+        <Form>
+          <ExtendsTextBox
+            inputKey='field'
+            validators={ [Validators.required(formRequiredTestMessage)] }
+          />
+        </Form>
+      ) as Form;
+      // Error message is gated behind <DelayedRender>, tick the clock to make it show up
+      clock.tick(DEFAULT_DEBOUNCE);
+
+      let errors: HTMLElement[] =
+        ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedForm, 'ms-TextField-errorMessage') as HTMLElement[];
+      expect(errors.length).toEqual(0);
+    });
+
+    it('Errors are shown when pristine and prop is set', () => {
+      let renderedForm: Form = ReactTestUtils.renderIntoDocument(
+        <Form
+          showErrorsWhenPristine={ true }
+        >
+          <ExtendsTextBox
+            inputKey='field'
+            validators={ [Validators.required(formRequiredTestMessage)] }
+          />
+        </Form>
+      ) as Form;
+      // Error message is gated behind <DelayedRender>, tick the clock to make it show up
+      clock.tick(DEFAULT_DEBOUNCE);
+
+      let errors: HTMLElement[] =
+        ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedForm, 'ms-TextField-errorMessage') as HTMLElement[];
+      expect(errors.length).toEqual(1);
+    });
+
+    it('Debounce interval can be changed', () => {
+      let updateCallback: sinon.SinonStub = sinon.stub();
+      let renderedForm: Form = ReactTestUtils.renderIntoDocument(
+        <Form
+          onUpdated={ updateCallback }
+        >
+          <ExtendsTextBox
+            inputKey='field'
+            value='0'
+            debounceInterval={ 3000 }
+          />
+        </Form>
+      ) as Form;
+      let textBox: ExtendsTextBox = ReactTestUtils.findRenderedComponentWithType(renderedForm, ExtendsTextBox);
+      textBox.setValue('1');
+      clock.tick(DEFAULT_DEBOUNCE);
+      expect(updateCallback.calledOnce).toBeFalsy();
+      clock.tick(3000);
+      expect(updateCallback.calledOnce).toBeTruthy();
+    });
+  });
+});
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/Form.tsx b/packages/experiments/src/components/Form/Form.tsx
new file mode 100644
index 0000000000000..799b308620f57
--- /dev/null
+++ b/packages/experiments/src/components/Form/Form.tsx
@@ -0,0 +1,256 @@
+/* tslint:disable:no-any */
+
+import * as React from 'react';
+import * as PropTypes from 'prop-types';
+
+// Components
+import { IFormProps } from './Form.Props';
+import { GenericFormInput } from './FormBaseInput';
+
+// Utilities
+import {
+  autobind,
+  BaseComponent,
+  getNativeProps,
+  divProperties
+} from 'office-ui-fabric-react/lib/Utilities';
+
+/**
+ * Validation result for a simple form input. All calls to validate return this type
+ */
+export type IFormValidationResult = {
+  /**
+   * Is the field valid?
+   */
+  isValid: boolean;
+
+  /**
+   * Optional error message
+   */
+  errorMessage?: string;
+
+  /**
+   * The validated input
+   */
+  component: GenericFormInput;
+};
+
+/**
+ * The child context for form inputs to use
+ */
+export type IFormContext = {
+  /**
+   * Is the form valid currently?
+   */
+  isFormValid: () => boolean;
+
+  /**
+   * Register the input with SimpleForm. Should be called during componentWillMount
+   */
+  mountInput: (input: GenericFormInput) => void;
+
+  /**
+   * Unregister the input with SimpleForm. Should be called during componentWillUnmount
+   */
+  unmountInput: (input: GenericFormInput) => void;
+
+  /**
+   * Validate the passed in field, set its error state, and call the onUpdate handler if there is one
+   */
+  submitValue: (input: GenericFormInput) => void;
+};
+
+/**
+ * The state for Form
+ */
+export interface IFormState {
+  /** The current validation results for the inputs in the form */
+  validationResults: { [key: string]: IFormValidationResult };
+}
+
+/**
+ * Use this component to host forms
+ */
+export class Form extends BaseComponent<IFormProps, IFormState> {
+  /**
+   * This is needed because React 15's context does not work well with typescript
+   */
+  protected static childContextTypes: React.ValidationMap<IFormContext> = {
+    isFormValid: PropTypes.func.isRequired,
+    mountInput: PropTypes.func.isRequired,
+    unmountInput: PropTypes.func.isRequired,
+    submitValue: PropTypes.func.isRequired
+  };
+
+  /**
+   * All registered inputs the form is aware of
+   */
+  private _mountedInputs: GenericFormInput[];
+
+  /** Flag which marks whether or not the form has attempted to have been submitted */
+  private _pristine: boolean;
+
+  constructor(props: IFormProps) {
+    super(props);
+    this._mountedInputs = [];
+    this._pristine = true;
+    this.state = {
+      validationResults: {}
+    };
+  }
+
+  /**
+   * Renders a form component and all child inputs
+   */
+  public render(): JSX.Element {
+    let nativeProps = getNativeProps(this.props, divProperties);
+    return (
+      <form
+        {...nativeProps}
+        onSubmit={ this._onSubmit }
+      >
+        { this.props.children }
+      </form>
+    );
+  }
+
+  /**
+   * Get the context for child components to use
+   */
+  public getChildContext(): IFormContext {
+    return {
+      isFormValid: this._isFormValid,
+      mountInput: this._mountInput,
+      unmountInput: this._unmountInput,
+      submitValue: this._submitValue
+    };
+  }
+
+  /**
+   * Get all the values from the inputs that have registered with the form
+   * Returns a dictionary keyed by the input names
+   */
+  private _getFormValues(): { [key: string]: any } {
+    let formValues: { [key: string]: any } = {};
+    this._mountedInputs.forEach((input: GenericFormInput) => {
+      formValues[input.props.inputKey] = input.state.currentValue;
+    });
+
+    return formValues;
+  }
+
+  /**
+   * Validate an individual input and set its error state
+   * Returns the validation result
+   * @param input The input to validate
+   */
+  private _validateComponent(input: GenericFormInput): IFormValidationResult {
+    let validationResult = input.doValidate();
+    if (!validationResult.isValid && (this.props.showErrorsWhenPristine || !this._pristine)) {
+      input.setError(validationResult.errorMessage);
+    } else {
+      input.clearError();
+    }
+
+    return validationResult;
+  }
+
+  /**
+   * Validate all the individual inputs and set their error state
+   * Returns a list of the validation results
+   */
+  private _validateForm(): { [key: string]: IFormValidationResult } {
+    let validationResults: { [key: string]: IFormValidationResult } = {};
+    this._mountedInputs.forEach((input: GenericFormInput) => {
+      validationResults[input.props.inputKey] = this._validateComponent(input);
+    });
+
+    this.setState((prevState: IFormState) => {
+      prevState.validationResults = validationResults;
+      return prevState;
+    });
+
+    return validationResults;
+  }
+
+  /**
+   * When the form is submitted. This will validate the form and call the appropriate submit callback
+   * @param event The form event
+   */
+  @autobind
+  private _onSubmit(event: React.FormEvent<HTMLElement>): void {
+    event.preventDefault();
+    if (this._pristine) {
+      this._pristine = false;
+    }
+
+    if (this.props.onSubmit) {
+      let validationResults = this._validateForm();
+      let formIsValid: boolean = this._isFormValid(validationResults);
+      let formValues: { [key: string]: any } = this._getFormValues();
+
+      if (formIsValid) {
+        this.props.onSubmit(formValues);
+      } else if (this.props.onInvalidSubmit) {
+        this.props.onInvalidSubmit(formValues);
+      }
+    }
+  }
+
+  /**
+   * Register an input with the form
+   * @param input The input to register
+   */
+  @autobind
+  private _mountInput(input: GenericFormInput): void {
+    if (this._mountedInputs.indexOf(input) === -1) {
+      this._mountedInputs.push(input);
+      this.setState((prevState: IFormState) => {
+        prevState.validationResults[input.props.inputKey] = this._validateComponent(input);
+        return prevState;
+      });
+    }
+  }
+
+  @autobind
+  private _submitValue(input: GenericFormInput): void {
+    let validationResult: IFormValidationResult = this._validateComponent(input);
+    this.setState((prevState: IFormState) => {
+      prevState.validationResults[input.props.inputKey] = validationResult;
+      return prevState;
+    });
+
+    if (validationResult.isValid) {
+      if (this.props.onUpdated) {
+        this.props.onUpdated(input.props.inputKey, input.state.currentValue);
+      }
+    }
+  }
+
+  /**
+   * Unregister an input with the form
+   * @param input The input to unregister
+   */
+  @autobind
+  private _unmountInput(input: GenericFormInput): void {
+    let currentIndex: number = this._mountedInputs.indexOf(input);
+    if (currentIndex > -1) {
+      this._mountedInputs.splice(currentIndex, 1);
+      this.setState((prevState: IFormState) => {
+        delete prevState.validationResults[input.props.inputKey];
+        return prevState;
+      });
+    }
+  }
+
+  @autobind
+  private _isFormValid(validationResults: { [key: string]: IFormValidationResult } = this.state.validationResults): boolean {
+    for (let key in validationResults) {
+      if (!validationResults[key].isValid) {
+        return false;
+      }
+    }
+
+    return true;
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/FormBaseInput.Props.ts b/packages/experiments/src/components/Form/FormBaseInput.Props.ts
new file mode 100644
index 0000000000000..b88e4652fcbfa
--- /dev/null
+++ b/packages/experiments/src/components/Form/FormBaseInput.Props.ts
@@ -0,0 +1,19 @@
+import { IBaseProps } from 'office-ui-fabric-react/lib/Utilities';
+import { IValidator } from './validators/Validators';
+
+/**
+ * The base props for any simple form input
+ */
+export interface IFormBaseInputProps<T> extends IBaseProps {
+  /** The key of this input. This value will be used to key form results */
+  inputKey: string;
+
+  /** The initial value of this input */
+  value?: T;
+
+  /** Any validator functions to run when the input is updated */
+  validators?: IValidator[];
+
+  /** The interval when validation and update callbacks should be fired */
+  debounceInterval?: number;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/FormBaseInput.ts b/packages/experiments/src/components/Form/FormBaseInput.ts
new file mode 100644
index 0000000000000..a781b32ff0c34
--- /dev/null
+++ b/packages/experiments/src/components/Form/FormBaseInput.ts
@@ -0,0 +1,173 @@
+/* tslint:disable:no-any */
+
+import * as React from 'react';
+import * as PropTypes from 'prop-types';
+
+import { IFormContext, IFormValidationResult } from './Form';
+import { IFormBaseInputProps } from './FormBaseInput.Props';
+export { IFormBaseInputProps };
+
+// Components
+import {
+  BaseComponent,
+  ICancelable
+} from 'office-ui-fabric-react/lib/Utilities';
+
+export const DEFAULT_DEBOUNCE = 250;
+
+/**
+ * The base state for any simple form input
+ */
+export interface IFormBaseInputState<T> {
+  isValid: boolean;
+  currentValue?: T;
+  currentError?: string;
+}
+
+/**
+ * Type alias for any simple form input
+ */
+export type GenericFormInput = FormBaseInput<any, IFormBaseInputProps<any>, IFormBaseInputState<any>>;
+
+/**
+ * The base class that all simple form inputs should inherit from
+ * The T generic should be the type of value this input accepts. For example, a TextBox would probably define T as string
+ */
+export abstract class FormBaseInput<T, P extends IFormBaseInputProps<T>, S extends IFormBaseInputState<T>> extends BaseComponent<P, S> {
+  public static contextTypes: React.ValidationMap<IFormContext> = {
+    isFormValid: PropTypes.func.isRequired,
+    mountInput: PropTypes.func.isRequired,
+    unmountInput: PropTypes.func.isRequired,
+    submitValue: PropTypes.func.isRequired
+  };
+
+  /**
+   * The debounced version of formContext.submitValue
+   */
+  protected readonly debouncedSubmitValue: ICancelable<void> & ((input: GenericFormInput) => void);
+
+  /**
+   * Form context passed by the parent form
+   */
+  private formContext: IFormContext;
+
+  /**
+   * Constructor for any Simple Form input
+   * @param props The props for this component
+   * @param context The context for this component
+   * @param leadingDebounce Sets the debounce setting for updates on this input.
+   * If leading, the component will update immediately and then debounce.
+   * Otherwise, the component will only update after the debounce interval. Defaults to true
+   */
+  constructor(props: P, context: IFormContext, leadingDebounce?: boolean) {
+    super(props, context);
+    this.formContext = context;
+    this.debouncedSubmitValue = this._async.debounce(
+      this.formContext.submitValue,
+      (
+        (this.props.debounceInterval !== null && this.props.debounceInterval !== undefined) ?
+          this.props.debounceInterval : DEFAULT_DEBOUNCE
+      ),
+      {
+        leading: (leadingDebounce === null || leadingDebounce === undefined ? true : leadingDebounce)
+      });
+    this._validateProps(props);
+  }
+
+  /**
+   * React Lifecycle Method - Because this method uses state when rendering, the state must be
+   * updated when the prop's value updates
+   * @param nextProps The props that the component is receiving
+   */
+  public componentWillReceiveProps(nextProps: P): void {
+    this._validateProps(nextProps);
+    if (nextProps.value !== this.props.value && this.props.value === this.state.currentValue) {
+      // If the props have changed and the previous props are equal to the current value, then we want to update the internal state value
+      this.setState((prevState: S) => {
+        prevState.currentValue = nextProps.value;
+        return prevState;
+      });
+    }
+  }
+
+  public componentWillMount(): void {
+    this.formContext.mountInput(this);
+  }
+
+  public componentWillUnmount(): void {
+    this.debouncedSubmitValue.flush();
+    this.formContext.unmountInput(this);
+  }
+
+  /**
+   * Validate the input. By default, this function will run through all the validators and ensure they pass
+   */
+  public doValidate(): IFormValidationResult {
+    const {
+      validators = []
+    } = this.props;
+
+    let validationResult: IFormValidationResult = {
+      isValid: true,
+      component: this
+    };
+
+    for (let validator of (validators as any)) {
+      let error: string = validator(this.state.currentValue);
+      if (error) {
+        validationResult.isValid = false;
+        validationResult.errorMessage = error;
+        return validationResult;
+      }
+    }
+
+    return validationResult;
+  }
+
+  /**
+   * Set the error state of this input
+   */
+  public setError(errorMessage?: string): void {
+    this.setState((prevState: S) => {
+      prevState.isValid = false;
+      prevState.currentError = errorMessage;
+      return prevState;
+    });
+  }
+
+  /**
+   * Clear any errors from this input
+   */
+  public clearError(): void {
+    this.setState((prevState: S) => {
+      prevState.isValid = true;
+      prevState.currentError = undefined;
+      return prevState;
+    });
+  }
+
+  /**
+   * Set the current value of this input and validate it
+   */
+  protected setValue(value: T): void {
+    this.setState(
+      (prevState: S): S => {
+        prevState.currentValue = value;
+        return prevState;
+      },
+      () => {
+        this.debouncedSubmitValue(this);
+      }
+    );
+  }
+
+  /**
+   * Validate incoming props
+   * @param props Props to validate
+   */
+  private _validateProps(props: P): void {
+    if (!props.inputKey) {
+      throw new Error('FormBaseInput: name must defined on all form inputs');
+    }
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/FormPage.scss b/packages/experiments/src/components/Form/FormPage.scss
new file mode 100644
index 0000000000000..e8c26c153c310
--- /dev/null
+++ b/packages/experiments/src/components/Form/FormPage.scss
@@ -0,0 +1,10 @@
+form {
+  max-width: 800px;
+  display: flex;
+  flex-direction: column;
+
+  button {
+    margin-top: 12px;
+    align-self: flex-end;
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/FormPage.tsx b/packages/experiments/src/components/Form/FormPage.tsx
new file mode 100644
index 0000000000000..4a7c0c8968225
--- /dev/null
+++ b/packages/experiments/src/components/Form/FormPage.tsx
@@ -0,0 +1,88 @@
+import * as React from 'react';
+import './FormPage.scss';
+
+import {
+  ExampleCard,
+  IComponentDemoPageProps,
+  ComponentPage,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+
+const FormAutosaveExampleCode = require('!raw-loader!experiments/src/components/Form/examples/Form.Autosave.Example.tsx') as string;
+const FormBasicExampleCode = require('!raw-loader!experiments/src/components/Form/examples/Form.Basic.Example.tsx') as string;
+const FormValidationExampleCode = require('!raw-loader!experiments/src/components/Form/examples/Form.Validation.Example.tsx') as string;
+
+import { FormAutosaveExample } from './examples/Form.Autosave.Example';
+import { FormBasicExample } from './examples/Form.Basic.Example';
+import { FormValidationExample } from './examples/Form.Validation.Example';
+
+export class FormPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render(): JSX.Element {
+    return (
+      <ComponentPage
+        title='Form'
+        componentName='FormExample'
+        exampleCards={
+          <div>
+            <ExampleCard title='Basic Form with one input and a submit button' code={ FormBasicExampleCode }>
+              <FormBasicExample />
+            </ExampleCard>
+            <ExampleCard title='Form with validation and conditional submit button' code={ FormValidationExampleCode }>
+              <FormValidationExample />
+            </ExampleCard>
+            <ExampleCard title='Form with validation and autosave' code={ FormAutosaveExampleCode }>
+              <FormAutosaveExample />
+            </ExampleCard>
+          </div>
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!experiments/src/components/Form/Form.Props.ts'),
+              require<string>('!raw-loader!experiments/src/components/Form/FormBaseInput.Props.ts')
+            ] }
+          />
+        }
+        /* tslint:disable:max-line-length */
+        overview={
+          <div>
+            <p>
+              Form is a wrapper component that aids in the creation of HTML forms. When used with the included Form input components, it provides a way to consolidate all of your form state into the Form component. The host of the Form only needs to be concerned about the values that are returned from the onSumbit and onUpdated callbacks
+            </p>
+            <p>
+              A set of input components are provided out of the box, including text, dropdown, checkbox, and date. More components can easily be added by extending the FormBaseInput component and rendering the desired component.
+            </p>
+            <p>
+              When the user submits the form, the Form host can listen to the onSubmit callback. The argument to this callback is an object which contains all the form values, keyed by 'inputKey' prop specified on all of the Form input components. The host component can also listen to the onUpdated callback, which is called each time an input is updated. This is useful for forms that should be saved automatically.
+            </p>
+          </div>
+        }
+        /* tslint:enable:max-line-length */
+        bestPractices={
+          <div />
+        }
+        dos={
+          <div>
+            <ul>
+              <li>Wrap multiple form inputs under one Form component</li>
+              <li>Use any layout you want within the Form component. The inputs do not have to be direct children</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul>
+              <li>Store the Form values in the parent component. The Form component will take care of all the state</li>
+              <li>Control the form inputs using value. Their values are managed by the Form compoennt</li>
+            </ul>
+          </div>
+        }
+        related={
+          <a href='https://dev.office.com/fabric-js/Components/CommandBar/CommandBar.html'>Fabric JS</a>
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }
+      />
+    );
+  }
+
+}
diff --git a/packages/experiments/src/components/Form/examples/Form.Autosave.Example.tsx b/packages/experiments/src/components/Form/examples/Form.Autosave.Example.tsx
new file mode 100644
index 0000000000000..219ba13c0555c
--- /dev/null
+++ b/packages/experiments/src/components/Form/examples/Form.Autosave.Example.tsx
@@ -0,0 +1,62 @@
+/* tslint:disable:no-any */
+import * as React from 'react';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { Form, FormDatePicker, FormTextInput, Validators } from '../../Form';
+
+export interface IFormAutosaveExampleState {
+  formResults: any;
+}
+
+export class FormAutosaveExample extends React.Component<{}, IFormAutosaveExampleState> {
+
+  public render(): JSX.Element {
+    return (
+      <div>
+        <Form onUpdated={ this._onUpdate } >
+          <FormTextInput
+            textFieldProps={ { label: 'Text Input with max length of 10' } }
+            inputKey='maxLength'
+            validators={ [Validators.maxLength(10, (length: number) => 'Must be less than 10 characters')] }
+          />
+          <FormTextInput
+            textFieldProps={ { label: 'Text input with min length of 10' } }
+            inputKey='minLength'
+            validators={ [Validators.minLength(10, (length: number) => 'Must be greater than 10 characters')] }
+          />
+          <FormTextInput
+            textFieldProps={ { label: 'Required text input' } }
+            inputKey='required'
+            validators={ [Validators.required('Field is required')] }
+          />
+          <FormDatePicker
+            datePickerProps={ { label: 'Date Picker with date no less than ye' } }
+            inputKey='date'
+            validators={ [(value: Date) => {
+              if (value) {
+                let date = new Date();
+                date.setDate(date.getDate() - 1);
+                if (value.getTime() < date.getTime()) {
+                  return 'Date must be today or later';
+                }
+              }
+            }] }
+          />
+        </Form>
+        {
+          this.state && this.state.formResults &&
+          <div className='results-view'>
+            <h4>Results</h4>
+            { JSON.stringify(this.state.formResults) }
+          </div>
+        }
+      </div>
+    );
+  }
+
+  @autobind
+  private _onUpdate(key: string, value: any): void {
+    let newFormResults = this.state && this.state.formResults ? { ...this.state.formResults } : {};
+    newFormResults[key] = value;
+    this.setState({ formResults: newFormResults });
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/examples/Form.Basic.Example.tsx b/packages/experiments/src/components/Form/examples/Form.Basic.Example.tsx
new file mode 100644
index 0000000000000..dc29ede547986
--- /dev/null
+++ b/packages/experiments/src/components/Form/examples/Form.Basic.Example.tsx
@@ -0,0 +1,35 @@
+/* tslint:disable:no-any */
+import * as React from 'react';
+import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { Form, FormTextInput } from '../../Form';
+
+export interface IFormBasicExampleState {
+  formResults: any;
+}
+
+export class FormBasicExample extends React.Component<{}, IFormBasicExampleState> {
+
+  public render(): JSX.Element {
+    return (
+      <div>
+        <Form onSubmit={ this._onSubmit }>
+          <FormTextInput textFieldProps={ { label: 'Name' } } inputKey='name' />
+          <PrimaryButton>Submit</PrimaryButton>
+        </Form>
+        {
+          this.state && this.state.formResults &&
+          <div className='results-view'>
+            <h4>Results</h4>
+            { JSON.stringify(this.state.formResults) }
+          </div>
+        }
+      </div>
+    );
+  }
+
+  @autobind
+  private _onSubmit(values: { [key: string]: any }): void {
+    this.setState({ formResults: values });
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/examples/Form.Validation.Example.tsx b/packages/experiments/src/components/Form/examples/Form.Validation.Example.tsx
new file mode 100644
index 0000000000000..420826ac69438
--- /dev/null
+++ b/packages/experiments/src/components/Form/examples/Form.Validation.Example.tsx
@@ -0,0 +1,61 @@
+/* tslint:disable:no-any */
+import * as React from 'react';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { Form, FormConditionalSubmitButton, FormDatePicker, FormTextInput, Validators } from '../../Form';
+
+export interface IFormValidationExampleState {
+  formResults: any;
+}
+
+export class FormValidationExample extends React.Component<{}, IFormValidationExampleState> {
+
+  public render(): JSX.Element {
+    return (
+      <div>
+        <Form onSubmit={ this._onSubmit } >
+          <FormTextInput
+            textFieldProps={ { label: 'Text Input with max length of 10' } }
+            inputKey='maxLength'
+            validators={ [Validators.maxLength(10, (length: number) => 'Must be less than 10 characters')] }
+          />
+          <FormTextInput
+            textFieldProps={ { label: 'Text input with min length of 10' } }
+            inputKey='minLength'
+            validators={ [Validators.minLength(10, (length: number) => 'Must be greater than 10 characters')] }
+          />
+          <FormTextInput
+            textFieldProps={ { label: 'Required text input' } }
+            inputKey='required'
+            validators={ [Validators.required('Field is required')] }
+          />
+          <FormDatePicker
+            datePickerProps={ { label: 'Date Picker with date no less than yesterday' } }
+            inputKey='date'
+            validators={ [(value: Date) => {
+              if (value) {
+                let date = new Date();
+                date.setDate(date.getDate() - 1);
+                if (value.getTime() < date.getTime()) {
+                  return 'Date must be today or later';
+                }
+              }
+            }] }
+          />
+          <FormConditionalSubmitButton>Submit</FormConditionalSubmitButton>
+        </Form>
+        {
+          this.state && this.state.formResults &&
+          <div className='results-view'>
+            <h4>Results</h4>
+            { JSON.stringify(this.state.formResults) }
+          </div>
+        }
+      </div>
+    );
+  }
+
+  @autobind
+  private _onSubmit(values: { [key: string]: any }): void {
+    this.setState({ formResults: values });
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/index.ts b/packages/experiments/src/components/Form/index.ts
new file mode 100644
index 0000000000000..fa8e3ff7a2b77
--- /dev/null
+++ b/packages/experiments/src/components/Form/index.ts
@@ -0,0 +1,15 @@
+export * from './Form';
+export * from './Form.Props';
+export * from './FormBaseInput';
+export * from './FormBaseInput.Props';
+export * from './inputs/checkbox/FormCheckBox';
+export * from './inputs/checkbox/FormCheckBox.Props';
+export * from './inputs/conditionalSubmit/FormConditionalSubmitButton';
+export * from './inputs/conditionalSubmit/FormConditionalSubmitButton.Props';
+export * from './inputs/datePicker/FormDatePicker';
+export * from './inputs/datePicker/FormDatePicker.Props';
+export * from './inputs/dropdown/FormDropdown';
+export * from './inputs/dropdown/FormDropdown.Props';
+export * from './inputs/textInput/FormTextInput';
+export * from './inputs/textInput/FormTextInput.Props';
+export * from './validators/Validators';
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.Props.ts b/packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.Props.ts
new file mode 100644
index 0000000000000..ca6526e9d7b22
--- /dev/null
+++ b/packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.Props.ts
@@ -0,0 +1,8 @@
+import { IFormBaseInputProps } from '../../FormBaseInput';
+import { ICheckboxProps } from 'office-ui-fabric-react/lib/Checkbox';
+export { ICheckboxProps };
+
+export interface IFormCheckBoxProps extends IFormBaseInputProps<boolean> {
+  /** Extra props for the Fabric checkbox */
+  checkboxProps?: ICheckboxProps;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.test.tsx b/packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.test.tsx
new file mode 100644
index 0000000000000..842eea5d941c3
--- /dev/null
+++ b/packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.test.tsx
@@ -0,0 +1,126 @@
+/* tslint:disable:no-any jsx-no-lambda no-string-literal */
+import * as React from 'react';
+import * as ReactTestUtils from 'react-dom/test-utils';
+import * as sinon from 'sinon';
+
+import { Form } from '../../Form';
+import { DEFAULT_DEBOUNCE } from '../../FormBaseInput';
+import { FormCheckBox } from './FormCheckBox';
+
+describe('FormCheckBox Unit Tests', () => {
+  let sandbox: sinon.SinonSandbox;
+
+  beforeAll(() => {
+    sandbox = sinon.sandbox.create();
+  });
+
+  afterEach(() => {
+    sandbox.restore();
+  });
+
+  describe('Renders for all combinations of props', () => {
+    let renderedForm: Form;
+    let renderedInput: HTMLElement;
+
+    beforeEach(() => {
+      (renderedForm as any) = undefined;
+      (renderedInput as any) = undefined;
+    });
+
+    afterEach(() => {
+      expect(renderedForm).toBeTruthy();
+      expect(renderedInput).toBeTruthy();
+    });
+
+    it('Null name throws error', () => {
+      let errorFunction = () => {
+        ReactTestUtils.renderIntoDocument(
+          <Form
+            onSubmit={ undefined }
+          >
+            <FormCheckBox
+              inputKey={ null as any }
+              value={ undefined }
+            />
+          </Form>
+        );
+      };
+
+      expect(errorFunction).toThrow();
+
+      (renderedForm as any) = {};
+      (renderedInput as any) = {};
+    });
+
+    it('Null props still render', () => {
+      renderedForm = ReactTestUtils.renderIntoDocument(
+        <Form
+          onSubmit={ undefined }
+        >
+          <FormCheckBox
+            inputKey='name'
+            value={ undefined }
+            validators={ undefined }
+          />
+        </Form>
+      ) as Form;
+
+      renderedInput = ReactTestUtils.findRenderedDOMComponentWithClass(renderedForm, 'ms-Checkbox') as HTMLElement;
+    });
+
+    it('With initial value', () => {
+      let result: any;
+      renderedForm = ReactTestUtils.renderIntoDocument(
+        <Form
+          onSubmit={ (value: any) => { result = value; } }
+        >
+          <FormCheckBox
+            inputKey='name'
+            value={ true }
+          />
+        </Form>
+      ) as Form;
+
+      renderedInput = ReactTestUtils.findRenderedDOMComponentWithClass(renderedForm, 'ms-Checkbox') as HTMLElement;
+      let form: HTMLFormElement = ReactTestUtils.findRenderedDOMComponentWithTag(renderedForm, 'form') as HTMLFormElement;
+      ReactTestUtils.Simulate.submit(form);
+
+      expect(result['name']).toBeTruthy();
+    });
+  });
+
+  describe('Checkbox update tests', () => {
+    class ExtendsCheckbox extends FormCheckBox {
+      public setValue(value: boolean): void {
+        super.setValue(value);
+      }
+    }
+
+    let clock: sinon.SinonFakeTimers;
+    beforeEach(() => {
+      clock = sandbox.useFakeTimers(Date.now());
+    });
+
+    it('Checkbox is leading and trailing debounced', () => {
+      let updateStub: sinon.SinonStub = sandbox.stub();
+      let renderedForm = ReactTestUtils.renderIntoDocument(
+        <Form
+          onUpdated={ updateStub }
+        >
+          <ExtendsCheckbox
+            inputKey='name'
+            value={ true }
+          />
+        </Form>
+      ) as Form;
+
+      let checkBox: ExtendsCheckbox = ReactTestUtils.findRenderedComponentWithType(renderedForm, ExtendsCheckbox);
+      checkBox.setValue(true);
+      expect(updateStub.callCount).toEqual(1);
+      checkBox.setValue(false);
+      expect(updateStub.callCount).toEqual(1);
+      clock.tick(DEFAULT_DEBOUNCE);
+      expect(updateStub.callCount).toEqual(2);
+    });
+  });
+});
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.tsx b/packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.tsx
new file mode 100644
index 0000000000000..44f2388568c44
--- /dev/null
+++ b/packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.tsx
@@ -0,0 +1,58 @@
+import * as React from 'react';
+
+// Components
+import { Checkbox, ICheckboxProps } from 'office-ui-fabric-react/lib/Checkbox';
+import { IFormCheckBoxProps } from './FormCheckBox.Props';
+import { FormBaseInput, IFormBaseInputState } from '../../FormBaseInput';
+import { IFormContext } from '../../Form';
+
+// Utilities
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+
+/**
+ * Checkbox input for the Form. Displays a boolean value as a checkbox
+ */
+export class FormCheckBox extends FormBaseInput<boolean, IFormCheckBoxProps, IFormBaseInputState<boolean>> {
+
+  constructor(props: IFormCheckBoxProps, context: IFormContext) {
+    super(props, context);
+    this.state = {
+      isValid: true,
+      currentValue: this.props.value || false,
+      currentError: undefined
+    };
+
+    this._validateCheckboxProps(props.checkboxProps);
+  }
+
+  /**
+   * Render a checkbox
+   */
+  public render(): JSX.Element {
+    return (
+      <Checkbox
+        {...this.props.checkboxProps}
+        key={ this.props.inputKey }
+        onChange={ this._onChange }
+        checked={ this.state.currentValue }
+      />
+    );
+  }
+
+  @autobind
+  private _onChange(event: React.FormEvent<HTMLElement>, isChecked: boolean): void {
+    this.setValue(isChecked);
+  }
+
+  private _validateCheckboxProps(props?: ICheckboxProps): void {
+    if (props) {
+      if (props.checked !== null && props.checked !== undefined) {
+        console.warn(`FormCheckBox: 'checked' prop was specified and will be ignored`);
+      }
+
+      if (props.onChange) {
+        console.warn(`FormCheckBox: 'onChange' prop was specified and will be ignored`);
+      }
+    }
+  }
+}
diff --git a/packages/experiments/src/components/Form/inputs/conditionalSubmit/ConditionalSubmitButton.test.tsx b/packages/experiments/src/components/Form/inputs/conditionalSubmit/ConditionalSubmitButton.test.tsx
new file mode 100644
index 0000000000000..66b5d7e4de8d7
--- /dev/null
+++ b/packages/experiments/src/components/Form/inputs/conditionalSubmit/ConditionalSubmitButton.test.tsx
@@ -0,0 +1,47 @@
+import * as React from 'react';
+import * as ReactTestUtils from 'react-dom/test-utils';
+import * as sinon from 'sinon';
+
+import { Form } from '../../Form';
+import { DEFAULT_DEBOUNCE } from '../../FormBaseInput';
+import { FormConditionalSubmitButton } from './FormConditionalSubmitButton';
+import { FormTextInput } from '../textInput/FormTextInput';
+import { Validators } from '../../validators/Validators';
+
+describe('FormSubmitButton Unit Tests', () => {
+  class ExtendsTextBox extends FormTextInput {
+    public setValue(value: string): void {
+      super.setValue(value);
+    }
+  }
+
+  let clock: sinon.SinonFakeTimers;
+  beforeEach(() => {
+    clock = sinon.useFakeTimers(Date.now());
+  });
+
+  afterEach(() => {
+    clock.restore();
+  });
+
+  it('Button is disabled when form is invalid and enabled when form is valid', () => {
+    let renderedForm = ReactTestUtils.renderIntoDocument(
+      <Form>
+        <ExtendsTextBox
+          inputKey='name'
+          validators={ [Validators.required('Error')] }
+        />
+
+        <FormConditionalSubmitButton />
+      </Form>
+    ) as Form;
+
+    let button: HTMLButtonElement = ReactTestUtils.findRenderedDOMComponentWithClass(renderedForm, 'ms-Button') as HTMLButtonElement;
+    let textBox: ExtendsTextBox = ReactTestUtils.findRenderedComponentWithType(renderedForm, ExtendsTextBox);
+
+    expect(button.getAttribute('disabled')).toEqual('');
+    textBox.setValue('Value');
+    clock.tick(DEFAULT_DEBOUNCE);
+    expect(button.getAttribute('disabled')).toBeFalsy();
+  });
+});
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/inputs/conditionalSubmit/FormConditionalSubmitButton.Props.ts b/packages/experiments/src/components/Form/inputs/conditionalSubmit/FormConditionalSubmitButton.Props.ts
new file mode 100644
index 0000000000000..dec9c04fca863
--- /dev/null
+++ b/packages/experiments/src/components/Form/inputs/conditionalSubmit/FormConditionalSubmitButton.Props.ts
@@ -0,0 +1,10 @@
+
+import { IBaseProps } from 'office-ui-fabric-react/lib/Utilities';
+import { IButtonProps } from 'office-ui-fabric-react/lib/Button';
+
+export { IButtonProps };
+
+export interface IFormConditionalSubmitButtonProps extends IBaseProps {
+  /** Props for the fabric button */
+  buttonProps?: IButtonProps;
+}
diff --git a/packages/experiments/src/components/Form/inputs/conditionalSubmit/FormConditionalSubmitButton.tsx b/packages/experiments/src/components/Form/inputs/conditionalSubmit/FormConditionalSubmitButton.tsx
new file mode 100644
index 0000000000000..c1931aa6178b5
--- /dev/null
+++ b/packages/experiments/src/components/Form/inputs/conditionalSubmit/FormConditionalSubmitButton.tsx
@@ -0,0 +1,50 @@
+import * as React from 'react';
+import * as PropTypes from 'prop-types';
+
+// Components
+import { IFormConditionalSubmitButtonProps } from './FormConditionalSubmitButton.Props';
+import { BaseComponent } from 'office-ui-fabric-react/lib/Utilities';
+import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
+import { IFormContext } from '../../Form';
+
+/**
+ * Submit button for the form which is disabled when the form is invalid
+ */
+export class FormConditionalSubmitButton extends BaseComponent<IFormConditionalSubmitButtonProps> {
+
+  protected static contextTypes: React.ValidationMap<IFormContext> = {
+    isFormValid: PropTypes.func.isRequired,
+    mountInput: PropTypes.func.isRequired,
+    unmountInput: PropTypes.func.isRequired,
+    submitValue: PropTypes.func.isRequired
+  };
+
+  /**
+   * Form context passed by the parent form
+   */
+  private formContext: IFormContext;
+
+  constructor(props: IFormConditionalSubmitButtonProps, formContext: IFormContext) {
+    super(props, formContext);
+    this.formContext = formContext;
+  }
+
+  /**
+   * Render a Fabric Dropdown
+   */
+  public render(): JSX.Element {
+    const {
+        children
+    } = this.props;
+
+    return (
+      <PrimaryButton
+        type='submit'
+        disabled={ !this.formContext.isFormValid() }
+        {...this.props.buttonProps}
+      >
+        { children }
+      </PrimaryButton>
+    );
+  }
+}
diff --git a/packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.Props.ts b/packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.Props.ts
new file mode 100644
index 0000000000000..7cbc7719c0567
--- /dev/null
+++ b/packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.Props.ts
@@ -0,0 +1,8 @@
+import { IDatePickerProps } from 'office-ui-fabric-react/lib/DatePicker';
+import { IFormBaseInputProps } from '../../FormBaseInput';
+export { IDatePickerProps };
+
+export interface IFormDatePickerProps extends IFormBaseInputProps<Date> {
+  /** Props for the Fabric date picker */
+  datePickerProps?: IDatePickerProps;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.scss b/packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.scss
new file mode 100644
index 0000000000000..2724c14e1feb1
--- /dev/null
+++ b/packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.scss
@@ -0,0 +1,18 @@
+@import '~office-ui-fabric-react/src/common/common';
+
+.formDatePicker {
+
+    .inputError {
+        @include ms-font-s;
+        color: $ms-color-redDark;
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+
+        > i {
+            @include ms-margin-right(5px);
+            margin-top: auto;
+            font-size: 14px; // Fabric TextField's validation icon size
+        }
+    }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.test.tsx b/packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.test.tsx
new file mode 100644
index 0000000000000..c9750bd8a34af
--- /dev/null
+++ b/packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.test.tsx
@@ -0,0 +1,120 @@
+/* tslint:disable:no-any jsx-no-lambda no-string-literal */
+import * as React from 'react';
+import * as ReactTestUtils from 'react-dom/test-utils';
+import * as sinon from 'sinon';
+
+import { Form } from '../../Form';
+import { DEFAULT_DEBOUNCE } from '../../FormBaseInput';
+import { FormDatePicker } from './FormDatePicker';
+
+describe('FormDatePicker Unit Tests', () => {
+  describe('Renders for all combinations of props', () => {
+    let renderedForm: Form;
+    let renderedInput: HTMLElement;
+
+    beforeEach(() => {
+      (renderedForm as any) = undefined;
+      (renderedForm as any) = undefined;
+    });
+
+    afterEach(() => {
+      expect(renderedForm).toBeTruthy();
+      expect(renderedInput).toBeTruthy();
+    });
+
+    it('Null name throws error', () => {
+      let errorFunction = () => {
+        ReactTestUtils.renderIntoDocument(
+          <Form
+            onSubmit={ undefined }
+          >
+            <FormDatePicker
+              inputKey={ null as any }
+              value={ undefined }
+            />
+          </Form>
+        );
+      };
+
+      expect(errorFunction).toThrow();
+
+      (renderedForm as any) = {};
+      (renderedInput as any) = {};
+    });
+
+    it('Null props still render', () => {
+      renderedForm = ReactTestUtils.renderIntoDocument(
+        <Form
+          onSubmit={ undefined }
+        >
+          <FormDatePicker
+            inputKey='name'
+            value={ undefined }
+            validators={ undefined }
+          />
+        </Form>
+      ) as Form;
+
+      renderedInput = ReactTestUtils.findRenderedDOMComponentWithClass(renderedForm, 'ms-DatePicker') as HTMLElement;
+    });
+
+    it('With initial value', () => {
+      let result: any;
+      let now: Date = new Date();
+      renderedForm = ReactTestUtils.renderIntoDocument(
+        <Form
+          onSubmit={ (value: any) => { result = value; } }
+        >
+          <FormDatePicker
+            inputKey='name'
+            value={ now }
+          />
+        </Form>
+      ) as Form;
+
+      renderedInput = ReactTestUtils.findRenderedDOMComponentWithClass(renderedForm, 'ms-DatePicker') as HTMLElement;
+      let form: HTMLFormElement = ReactTestUtils.findRenderedDOMComponentWithTag(renderedForm, 'form') as HTMLFormElement;
+      ReactTestUtils.Simulate.submit(form);
+
+      expect(result['name']).toEqual(now);
+    });
+  });
+  describe('DatePicker update tests', () => {
+    class ExtendsDatePicker extends FormDatePicker {
+      public setValue(value: Date): void {
+        super.setValue(value);
+      }
+    }
+
+    let clock: sinon.SinonFakeTimers;
+    beforeEach(() => {
+      clock = sinon.useFakeTimers(Date.now());
+    });
+
+    afterEach(() => {
+      clock.restore();
+    });
+
+    it('DatePicker is leading and trailing debounced', () => {
+      let updateStub: sinon.SinonStub = sinon.stub();
+      let renderedForm = ReactTestUtils.renderIntoDocument(
+        <Form
+          onUpdated={ updateStub }
+        >
+          <ExtendsDatePicker
+            inputKey='name'
+            value={ new Date() }
+          />
+        </Form>
+      ) as Form;
+
+      let datePicker: ExtendsDatePicker = ReactTestUtils.findRenderedComponentWithType(renderedForm, ExtendsDatePicker);
+      datePicker.setValue(new Date('2015-05-05'));
+      expect(updateStub.callCount).toEqual(1);
+      datePicker.setValue(new Date('2014-05-05'));
+      expect(updateStub.callCount).toEqual(1);
+      clock.tick(DEFAULT_DEBOUNCE);
+      expect(updateStub.callCount).toEqual(2);
+    });
+  });
+});
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.tsx b/packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.tsx
new file mode 100644
index 0000000000000..0f4a67186e2fa
--- /dev/null
+++ b/packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.tsx
@@ -0,0 +1,85 @@
+import * as DatePickerStylesModule from './FormDatePicker.scss';
+/*tslint:disable:no-any */
+const DatePickerStyles = DatePickerStylesModule as any;
+/*tslint:enable:no-any */
+
+import * as React from 'react';
+
+// Components
+import { IFormDatePickerProps } from './FormDatePicker.Props';
+import { DatePicker, IDatePickerProps } from 'office-ui-fabric-react/lib/DatePicker';
+import { Icon } from 'office-ui-fabric-react/lib/Icon';
+import { FormBaseInput, IFormBaseInputState } from '../../FormBaseInput';
+import { IFormContext } from '../../Form';
+
+// Utilities
+import { autobind, css } from 'office-ui-fabric-react/lib/Utilities';
+
+/**
+ * DatePicker input for Form
+ */
+export class FormDatePicker extends FormBaseInput<Date, IFormDatePickerProps, IFormBaseInputState<Date>> {
+
+  constructor(props: IFormDatePickerProps, context: IFormContext) {
+    super(props, context);
+    this.state = {
+      isValid: true,
+      currentValue: this.props.value,
+      currentError: undefined
+    };
+
+    this._validateDatePickerProps(this.props.datePickerProps);
+  }
+
+  /**
+   * Render a Fabric DatePicker
+   */
+  public render(): JSX.Element {
+    return (
+      <div className={ css('form-date-picker', DatePickerStyles.formDatePicker) }>
+        <DatePicker
+          {...this.props.datePickerProps}
+          // These props cannot be overridden
+          key={ this.props.inputKey }
+          value={ this.state.currentValue }
+          onSelectDate={ this._onDateChanged }
+        />
+        { this.state.currentError && this._renderError() }
+      </div>
+    );
+  }
+
+  private _renderError(): JSX.Element {
+    return (
+      <div className={ css('input-error', DatePickerStyles.inputError) }>
+        <Icon iconName='Error' />
+        { this.state.currentError }
+      </div>
+    );
+  }
+
+  @autobind
+  private _onDateChanged(date: Date): void {
+    this.setValue(date);
+  }
+
+  private _validateDatePickerProps(props?: IDatePickerProps): void {
+    if (props) {
+      if (props.key) {
+        console.warn(`FormDatePicker: 'key' prop was specified and will be ignored`);
+      }
+
+      if (props.ref) {
+        console.warn(`FormDatePicker: 'ref' prop was specified and will be ignored`);
+      }
+
+      if (props.onSelectDate) {
+        console.warn(`FormDatePicker: 'onSelectDate' prop was specified and will be ignored`);
+      }
+
+      if (props.strings) {
+        console.warn(`FormDatePicker: 'strings' prop was specified and will be ignored`);
+      }
+    }
+  }
+}
diff --git a/packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.Props.ts b/packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.Props.ts
new file mode 100644
index 0000000000000..f983af2563fe6
--- /dev/null
+++ b/packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.Props.ts
@@ -0,0 +1,8 @@
+import { IDropdownProps } from 'office-ui-fabric-react/lib/Dropdown';
+import { IFormBaseInputProps } from '../../FormBaseInput';
+export { IDropdownProps };
+
+export interface IFormDropdownProps extends IFormBaseInputProps<number | string> {
+  /** Props for the Dropdown component */
+  dropdownProps?: IDropdownProps;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.test.tsx b/packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.test.tsx
new file mode 100644
index 0000000000000..8ac1bbb90ee35
--- /dev/null
+++ b/packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.test.tsx
@@ -0,0 +1,139 @@
+/* tslint:disable:no-any jsx-no-lambda no-string-literal */
+
+import * as React from 'react';
+import * as ReactTestUtils from 'react-dom/test-utils';
+import * as sinon from 'sinon';
+
+import { Form } from '../../Form';
+import { DEFAULT_DEBOUNCE } from '../../FormBaseInput';
+import { FormDropdown } from './FormDropdown';
+
+describe('FormDropdown Unit Tests', () => {
+  describe('Renders for all combinations of props', () => {
+    let renderedForm: Form;
+    let renderedInput: HTMLElement;
+
+    beforeEach(() => {
+      (renderedForm as any) = undefined;
+      (renderedInput as any) = undefined;
+    });
+
+    afterEach(() => {
+      expect(renderedForm).toBeTruthy();
+      expect(renderedInput).toBeTruthy();
+    });
+
+    it('Null name throws error', () => {
+      let errorFunction = () => {
+        ReactTestUtils.renderIntoDocument(
+          <Form
+            onSubmit={ undefined }
+          >
+            <FormDropdown
+              inputKey={ null as any }
+              value={ undefined }
+            />
+          </Form>
+        );
+      };
+
+      expect(errorFunction).toThrow();
+
+      (renderedForm as any) = {};
+      (renderedInput as any) = {};
+    });
+
+    it('Null props still render', () => {
+      renderedForm = ReactTestUtils.renderIntoDocument(
+        <Form
+          onSubmit={ undefined }
+        >
+          <FormDropdown
+            inputKey='name'
+            value={ undefined }
+          />
+        </Form>
+      ) as Form;
+
+      renderedInput = ReactTestUtils.findRenderedDOMComponentWithClass(renderedForm, 'ms-Dropdown') as HTMLElement;
+    });
+
+    it('With initial value', () => {
+      let result: any;
+      renderedForm = ReactTestUtils.renderIntoDocument(
+        <Form
+          onSubmit={ (value: any) => { result = value; } }
+        >
+          <FormDropdown
+            inputKey='name'
+            dropdownProps={ {
+              options: [
+                { key: 1, text: 'Option 1' },
+                { key: 0, text: 'Option 2' },
+                { key: 2, text: 'Option 3' }
+              ]
+            } }
+            value={ 0 }
+          />
+        </Form>
+      ) as Form;
+
+      renderedInput = ReactTestUtils.findRenderedDOMComponentWithClass(renderedForm, 'ms-Dropdown') as HTMLElement;
+      let form: HTMLFormElement = ReactTestUtils.findRenderedDOMComponentWithTag(renderedForm, 'form') as HTMLFormElement;
+      ReactTestUtils.Simulate.submit(form);
+
+      expect(result['name']).toEqual(0);
+    });
+  });
+
+  describe('Dropdown update tests', () => {
+    class ExtendsDropdown extends FormDropdown {
+      public setValue(value: number): void {
+        super.setValue(value);
+      }
+    }
+
+    let clock: sinon.SinonFakeTimers;
+    beforeEach(() => {
+      clock = sinon.useFakeTimers(Date.now());
+    });
+
+    afterEach(() => {
+      clock.restore();
+    });
+
+    it('Dropdown is leading and trailing debounced', () => {
+      let updateStub: sinon.SinonStub = sinon.stub();
+      let renderedForm = ReactTestUtils.renderIntoDocument(
+        <Form
+          onUpdated={ updateStub }
+        >
+          <ExtendsDropdown
+            inputKey='name'
+            value={ 0 }
+            dropdownProps={ {
+              options: [
+                {
+                  key: 0,
+                  text: ''
+                },
+                {
+                  key: 1,
+                  text: ''
+                }
+              ]
+            } }
+          />
+        </Form>
+      ) as Form;
+
+      let datePicker: ExtendsDropdown = ReactTestUtils.findRenderedComponentWithType(renderedForm, ExtendsDropdown);
+      datePicker.setValue(0);
+      expect(updateStub.callCount).toEqual(1);
+      datePicker.setValue(1);
+      expect(updateStub.callCount).toEqual(1);
+      clock.tick(DEFAULT_DEBOUNCE);
+      expect(updateStub.callCount).toEqual(2);
+    });
+  });
+});
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.tsx b/packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.tsx
new file mode 100644
index 0000000000000..7bcf0f92c7d2e
--- /dev/null
+++ b/packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.tsx
@@ -0,0 +1,64 @@
+import * as React from 'react';
+
+// Components
+import { IFormDropdownProps } from './FormDropdown.Props';
+import { Dropdown, IDropdownOption, IDropdownProps } from 'office-ui-fabric-react/lib/Dropdown';
+import { FormBaseInput, IFormBaseInputState } from '../../FormBaseInput';
+import { IFormContext } from '../../Form';
+
+// Utilities
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+
+/**
+ * Dropdown input for Form
+ */
+export class FormDropdown extends FormBaseInput<number | string, IFormDropdownProps, IFormBaseInputState<number | string>> {
+
+  constructor(props: IFormDropdownProps, context: IFormContext) {
+    super(props, context);
+    this.state = {
+      isValid: true,
+      currentValue: this.props.value !== null && this.props.value !== undefined ?
+        this.props.value :
+        (
+          (this.props.dropdownProps && this.props.dropdownProps.options && this.props.dropdownProps.options.length > 0) ?
+            this.props.dropdownProps.options[0].key : undefined
+        ),
+      currentError: undefined
+    };
+    this._validateDropdownProps(this.props.dropdownProps);
+  }
+
+  /**
+   * Render a Fabric Dropdown
+   */
+  public render(): JSX.Element {
+    return (
+      <Dropdown
+        {...this.props.dropdownProps}
+
+        // These props cannot be overridden
+        key={ this.props.inputKey }
+        onChanged={ this._onChanged }
+        selectedKey={ this.state.currentValue }
+      />
+    );
+  }
+
+  @autobind
+  private _onChanged(option: IDropdownOption): void {
+    this.setValue(option.key);
+  }
+
+  private _validateDropdownProps(props?: IDropdownProps): void {
+    if (props) {
+      if (props.selectedKey !== null && props.selectedKey !== undefined) {
+        console.warn(`FormDropdown: 'selectedKey' prop was specified and will be ignored`);
+      }
+
+      if (props.onChanged) {
+        console.warn(`FormDropdown: 'onChanged' prop was specified and will be ignored`);
+      }
+    }
+  }
+}
diff --git a/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.Props.ts b/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.Props.ts
new file mode 100644
index 0000000000000..1a9c2ece61ba6
--- /dev/null
+++ b/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.Props.ts
@@ -0,0 +1,10 @@
+
+import { IFormBaseInputProps } from '../../FormBaseInput';
+import { ITextFieldProps } from 'office-ui-fabric-react/lib/TextField';
+
+export { ITextFieldProps };
+
+export interface IFormTextInputProps extends IFormBaseInputProps<string> {
+  /** Props for the TextField component */
+  textFieldProps?: ITextFieldProps;
+}
diff --git a/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.test.tsx b/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.test.tsx
new file mode 100644
index 0000000000000..675d4abd96b44
--- /dev/null
+++ b/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.test.tsx
@@ -0,0 +1,210 @@
+/* tslint:disable:no-any jsx-no-lambda no-string-literal */
+import * as React from 'react';
+import * as ReactDom from 'react-dom';
+import * as ReactTestUtils from 'react-dom/test-utils';
+import * as sinon from 'sinon';
+
+// Controls
+import { Form } from '../../Form';
+import { IFormProps } from '../../Form.Props';
+import { DEFAULT_DEBOUNCE } from '../../FormBaseInput';
+import { FormTextInput } from './FormTextInput';
+import { IFormTextInputProps } from './FormTextInput.Props';
+import { TextField } from 'office-ui-fabric-react/lib/TextField';
+
+// Utilities
+import { Validators } from '../../validators/Validators';
+
+describe('FormTextInput Unit Tests', () => {
+  describe('Renders for all combinations of props', () => {
+    let renderedForm: Form;
+    let renderedInput: HTMLElement;
+    let formProps: IFormProps;
+    let formTextInputProps: IFormTextInputProps;
+
+    beforeEach(() => {
+      (renderedForm as any) = undefined;
+      (renderedInput as any) = undefined;
+      formProps = {
+        onSubmit: undefined
+      };
+      formTextInputProps = {
+        inputKey: null as any,
+        value: undefined
+      };
+    });
+
+    afterEach(() => {
+      expect(renderedForm).toBeTruthy();
+      expect(renderedInput).toBeTruthy();
+    });
+
+    it('Null name throws error', () => {
+      let errorFunction = () => {
+        ReactTestUtils.renderIntoDocument(
+          <Form
+            { ...formProps }
+          >
+            <FormTextInput
+              { ...formTextInputProps }
+            />
+          </Form>
+        );
+      };
+
+      expect(errorFunction).toThrow();
+
+      (renderedForm as any) = {};
+      (renderedInput as any) = {};
+    });
+
+    it('Null props still render', () => {
+      formTextInputProps.inputKey = 'name';
+      renderedForm = ReactTestUtils.renderIntoDocument(
+        <Form
+          { ...formProps }
+        >
+          <FormTextInput
+            { ...formTextInputProps }
+          />
+        </Form>
+      ) as Form;
+
+      renderedInput = ReactTestUtils.findRenderedDOMComponentWithClass(renderedForm, 'ms-TextField') as HTMLElement;
+    });
+
+    it('With initial value', () => {
+      formTextInputProps.inputKey = 'name';
+      formTextInputProps.value = 'Value';
+      renderedForm = ReactTestUtils.renderIntoDocument(
+        <Form
+          { ...formProps }
+        >
+          <FormTextInput
+            { ...formTextInputProps }
+          />
+        </Form>
+      ) as Form;
+
+      renderedInput = ReactTestUtils.findRenderedDOMComponentWithClass(renderedForm, 'ms-TextField') as HTMLElement;
+    });
+  });
+
+  describe('Common validations', () => {
+    xit('Validators run properly', () => {
+      let result: any;
+
+      let renderedForm: Form = ReactTestUtils.renderIntoDocument(
+        <Form
+          onSubmit={ (value: any) => { result = value; } }
+        >
+          <FormTextInput
+            inputKey='field'
+            value=''
+            validators={ [
+              Validators.required('Message')
+            ] }
+          />
+        </Form>
+      ) as Form;
+
+      let form: HTMLFormElement = ReactTestUtils.findRenderedDOMComponentWithTag(renderedForm, 'form') as HTMLFormElement;
+      ReactTestUtils.Simulate.submit(form);
+
+      // Find the TextField component
+      let field = ReactTestUtils.findRenderedComponentWithType(renderedForm, TextField);
+      expect(field.state.errorMessage).toBeTruthy();
+      expect(result).toBeFalsy();
+    });
+  });
+
+  describe('Textbox update tests', () => {
+    class ExtendsTextInput extends FormTextInput {
+      public setValue(value: string): void {
+        super.setValue(value);
+      }
+    }
+
+    let clock: sinon.SinonFakeTimers;
+    beforeEach(() => {
+      clock = sinon.useFakeTimers(Date.now());
+    });
+
+    afterEach(() => {
+      clock.restore();
+    });
+
+    it('TextInput is only trailing debounced', () => {
+      let updateStub: sinon.SinonStub = sinon.stub();
+      let renderedForm = ReactTestUtils.renderIntoDocument(
+        <Form
+          onUpdated={ updateStub }
+        >
+          <ExtendsTextInput
+            inputKey='name'
+            value={ '' }
+          />
+        </Form>
+      ) as Form;
+
+      let datePicker: ExtendsTextInput = ReactTestUtils.findRenderedComponentWithType(renderedForm, ExtendsTextInput);
+      datePicker.setValue('0');
+      expect(updateStub.callCount).toEqual(0);
+      datePicker.setValue('1');
+      expect(updateStub.callCount).toEqual(0);
+      clock.tick(DEFAULT_DEBOUNCE);
+      expect(updateStub.callCount).toEqual(1);
+    });
+
+    it('TextInput state updates from props value change', () => {
+      let updatedValue = 'updated';
+      let parent = document.createElement('div');
+      let renderedForm = ReactDom.render(
+        <Form>
+          <FormTextInput
+            inputKey='name'
+            key='key'
+            value={ 'old value' }
+          />
+        </Form>, parent) as Form;
+      let textboxElement: FormTextInput = ReactTestUtils.findRenderedComponentWithType(renderedForm, FormTextInput);
+      let propsUpdateSpy = sinon.spy(textboxElement, 'componentWillReceiveProps');
+      renderedForm = ReactDom.render(
+        <Form>
+          <FormTextInput
+            inputKey='name'
+            key='key'
+            value={ updatedValue }
+          />
+        </Form >, parent) as Form;
+
+      expect(textboxElement.state.currentValue).toEqual(updatedValue);
+      expect(propsUpdateSpy.callCount).toEqual(1);
+    });
+
+    it(`TextInput state doesn't update with no new props value`, () => {
+      let oldValue = 'old value';
+      let parent = document.createElement('div');
+      let renderedForm = ReactDom.render(
+        <Form>
+          <FormTextInput
+            inputKey='name'
+            key='key'
+            value={ oldValue }
+          />
+        </Form>, parent) as Form;
+      let textboxElement: FormTextInput = ReactTestUtils.findRenderedComponentWithType(renderedForm, FormTextInput);
+      let setStateSpy = sinon.spy(textboxElement, 'setState');
+      renderedForm = ReactDom.render(
+        <Form>
+          <FormTextInput
+            inputKey='name'
+            key='key'
+            value={ oldValue }
+          />
+        </Form>, parent) as Form;
+
+      expect(setStateSpy.callCount).toEqual(0);
+    });
+  });
+});
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.tsx b/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.tsx
new file mode 100644
index 0000000000000..e8c0328035ac5
--- /dev/null
+++ b/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.tsx
@@ -0,0 +1,70 @@
+import * as React from 'react';
+
+// Components
+import { IFormTextInputProps } from './FormTextInput.Props';
+import { FormBaseInput, IFormBaseInputState } from '../../FormBaseInput';
+import { IFormContext } from '../../Form';
+import { TextField, ITextFieldProps } from 'office-ui-fabric-react/lib/TextField';
+
+// Utilities
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+
+/**
+ * TextBox input for the Form.
+ */
+export class FormTextInput extends FormBaseInput<string, IFormTextInputProps, IFormBaseInputState<string>> {
+
+  constructor(props: IFormTextInputProps, context: IFormContext) {
+    super(props, context, false /* Leading edge debounce */);
+    this.state = {
+      isValid: true,
+      currentValue: this.props.value || '',
+      currentError: undefined
+    };
+
+    this._validateTextFieldProps(this.props.textFieldProps);
+  }
+
+  /**
+   * Name of this component
+   */
+  public name(): string {
+    return 'FormTextBox';
+  }
+
+  /**
+   * Render a Fabric TextBox
+   */
+  public render(): JSX.Element {
+    return (
+      <TextField
+        {...this.props.textFieldProps}
+        key={ this.props.inputKey }
+        value={ this.state.currentValue }
+        onBeforeChange={ this._onChange }
+        errorMessage={ this.state.currentError }
+      />
+    );
+  }
+
+  @autobind
+  private _onChange(value: string): void {
+    this.setValue(value);
+  }
+
+  private _validateTextFieldProps(props?: ITextFieldProps): void {
+    if (props) {
+      if (props.errorMessage) {
+        console.warn(`FormTextBox: 'errorMessage' prop was specified and will be ignored`);
+      }
+
+      if (props.value) {
+        console.warn(`FormTextBox: 'value' prop was specified and will be ignored`);
+      }
+
+      if (props.onBeforeChange) {
+        console.warn(`FormTextBox: 'onBeforeChange' prop was specified and will be ignored`);
+      }
+    }
+  }
+}
diff --git a/packages/experiments/src/components/Form/validators/Validators.test.ts b/packages/experiments/src/components/Form/validators/Validators.test.ts
new file mode 100644
index 0000000000000..298a1f091aadb
--- /dev/null
+++ b/packages/experiments/src/components/Form/validators/Validators.test.ts
@@ -0,0 +1,75 @@
+import { Validators } from './Validators';
+
+describe('Simple form validators test', () => {
+  let customMessage = 'Custom Error Message';
+
+  it('Integer validator', () => {
+    expect(Validators.isInteger(customMessage)(null)).toBeFalsy();
+    expect(Validators.isInteger(customMessage)(undefined)).toBeFalsy();
+    expect(Validators.isInteger(customMessage)('4.1')).toEqual(customMessage);
+    expect(Validators.isInteger(customMessage)('4')).toBeFalsy();
+    expect(Validators.isInteger(customMessage)('4.0')).toBeFalsy();
+  });
+  it('Length validator', () => {
+    expect(Validators.length(4, () => customMessage)('----')).toBeFalsy();
+    expect(Validators.length(4, () => customMessage)('-----')).toBeTruthy();
+    expect(Validators.length(4, () => customMessage)(null)).toEqual(customMessage);
+    expect(Validators.length(4, () => customMessage)(undefined)).toEqual(customMessage);
+  });
+
+  it('MinLength validator', () => {
+    expect(Validators.minLength(4, () => customMessage)('----')).toBeFalsy();
+    expect(Validators.minLength(4, () => customMessage)('-----')).toBeFalsy();
+    expect(Validators.minLength(4, () => customMessage)('---')).toEqual(customMessage);
+    expect(Validators.minLength(4, () => customMessage)(null)).toEqual(customMessage);
+    expect(Validators.minLength(4, () => customMessage)(undefined)).toEqual(customMessage);
+  });
+
+  it('MaxLength validator', () => {
+    expect(Validators.maxLength(4, () => customMessage)(null)).toBeFalsy();
+    expect(Validators.maxLength(4, () => customMessage)(undefined)).toBeFalsy();
+    expect(Validators.maxLength(4, () => customMessage)('----')).toBeFalsy();
+    expect(Validators.maxLength(4, () => customMessage)('-----')).toEqual(customMessage);
+  });
+
+  it('MinValue validator', () => {
+    expect(Validators.minValue(4, () => customMessage)(null)).toBeFalsy();
+    expect(Validators.minValue(4, () => customMessage)(undefined)).toBeFalsy();
+    expect(Validators.minValue(4, () => customMessage)('----')).toBeFalsy();
+    expect(Validators.minValue(4, () => customMessage)('3')).toEqual(customMessage);
+    expect(Validators.minValue(4, () => customMessage)('5')).toBeFalsy();
+    expect(Validators.minValue(0, () => customMessage)('.8')).toBeFalsy();
+  });
+
+  it('MaxValue validator', () => {
+    expect(Validators.maxValue(4, () => customMessage)(null)).toBeFalsy();
+    expect(Validators.maxValue(4, () => customMessage)(undefined)).toBeFalsy();
+    expect(Validators.maxValue(4, () => customMessage)('----')).toBeFalsy();
+    expect(Validators.maxValue(4, () => customMessage)('5')).toEqual(customMessage);
+    expect(Validators.maxValue(4, () => customMessage)('3')).toBeFalsy();
+    expect(Validators.maxValue(4, () => customMessage)('.8')).toBeFalsy();
+  });
+
+  it('Regex validator', () => {
+    expect(Validators.regex(/^(.)*$/, customMessage)('anything')).toBeFalsy();
+    expect(Validators.regex(/^([0-9])*$/, customMessage)('10202')).toBeFalsy();
+    expect(Validators.regex(/^([0-9])*$/, customMessage)('letters')).toEqual(customMessage);
+  });
+
+  it('Number validator', () => {
+    expect(Validators.isNumber(customMessage)('abcd')).toEqual(customMessage);
+    expect(Validators.isNumber(customMessage)(null)).toBeFalsy();
+    expect(Validators.isNumber(customMessage)('')).toBeFalsy();
+    expect(Validators.isNumber(customMessage)('10')).toBeFalsy();
+    expect(Validators.isNumber(customMessage)('10.1')).toBeFalsy();
+  });
+
+  it('Required validator', () => {
+    expect(Validators.required(customMessage)(null)).toEqual(customMessage);
+    expect(Validators.required(customMessage)(undefined)).toEqual(customMessage);
+    expect(Validators.required(customMessage)('')).toEqual(customMessage);
+
+    expect(Validators.required(customMessage)(0)).toBeFalsy();
+    expect(Validators.required(customMessage)('HelloWorld')).toBeFalsy();
+  });
+});
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/validators/Validators.ts b/packages/experiments/src/components/Form/validators/Validators.ts
new file mode 100644
index 0000000000000..095fc79e5e6f2
--- /dev/null
+++ b/packages/experiments/src/components/Form/validators/Validators.ts
@@ -0,0 +1,145 @@
+/* tslint:disable:no-any */
+export namespace Validators {
+  'use strict';
+
+  /**
+   * Returns a validator that checks for null and whitespace
+   * @param errorMessage Required error message to display
+   */
+  export function required(errorMessage: string): (value?: any | null) => string | undefined {
+    'use strict';
+    return (value?: any): string | undefined => {
+      if (value === null || value === undefined || value === '') {
+        return errorMessage;
+      }
+    };
+  }
+
+  /**
+   * Returns a validator that checks the length of a string and ensures its equal to a value. If input null return -1
+   * @param desiredLength The length of the string
+   * @param formatError a callback which takes the length and formats an appropriate error message for validation failed
+   */
+  export function length(desiredLength: number, formatError: (length: number) => string): (value?: string | null) => string | undefined {
+    'use strict';
+    return (value?: string | null): string | undefined => {
+      value = ((value !== null && value !== undefined) ? value : '');
+      if (value.length !== desiredLength) {
+        return formatError(value.length);
+      }
+    };
+  }
+
+  /**
+   * Returns a validator that checks the length of a string and ensures its greater than a value (inclusive)
+   * @param lengthBound The min length of the string
+   * @param formatError a callback which takes the values Length and formats an appropriate error message for validation failed
+   */
+  export function minLength(lengthBound: number, formatError: (length: number) => string): (value?: string | null) => string | undefined {
+    'use strict';
+    return (value?: string | null): string | undefined => {
+      value = ((value !== null && value !== undefined) ? value : '');
+      if (value.length < lengthBound) {
+        return formatError(value.length);
+      }
+    };
+  }
+
+  /**
+   * Returns a validator that checks the length of a string and ensures its less than a value (inclusive)
+   * @param lengthBound The max length of the string
+   * @param formatError a callback which takes the values length and formats an appropriate error message for validation failed
+   */
+  export function maxLength(lengthBound: number, formatError: (length: number) => string): (value?: string | null) => string | undefined {
+    'use strict';
+    return (value?: string | null): string | undefined => {
+      value = ((value !== null && value !== undefined) ? value : '');
+      if (value.length > lengthBound) {
+        return formatError(value.length);
+      }
+    };
+  }
+
+  /**
+   * Returns a validator that calls the passed in regular expression aganist the string using exec()
+   * @param expression The regular expression to use.
+   * @param errorMessage Required error message to display
+   */
+  export function regex(expression: RegExp, errorMessage: string): (value?: string | null) => string | undefined {
+    'use strict';
+    return (value?: string | null): string | undefined => {
+      if (value) {
+        let match = expression.exec(value);
+        if (match === null || match === undefined) {
+          return errorMessage;
+        }
+      }
+    };
+  }
+
+  /**
+   * Returns a validator that checks if a number is greater than the provided bound
+   * @param bound The bound
+   * @param formatError a callback which takes the length and formats an appropriate error message for validation failed
+   */
+  export function minValue(bound: number, formatError: (length: number) => string): (value?: string | null) => string | undefined {
+    'use strict';
+    return (value?: string | null): string | undefined => {
+      if (value) {
+        let intValue: number = Number(value);
+        if (!isNaN(intValue) && intValue < bound) {
+          return formatError(intValue);
+        }
+      }
+    };
+  }
+
+  /**
+   * Returns a validator that checks if a number is less than the provided bound
+   * @param bound The bound
+   * @param formatError a callback which takes the length and formats an appropriate error message for validation failed
+   */
+  export function maxValue(bound: number, formatError: (length: number) => string): (value?: string | null) => string | undefined {
+    'use strict';
+    return (value?: string | null): string | undefined => {
+      if (value) {
+        let intValue: number = Number(value);
+        if (!isNaN(intValue) && intValue > bound) {
+          return formatError(intValue);
+        }
+      }
+    };
+  }
+
+  /**
+   * Returns a validator that checks if a number is an integer
+   * @param errorMessage Required error message to display
+   */
+  export function isInteger(errorMessage: string): (value?: string | null) => string | undefined {
+    'use strict';
+    return (value?: string | null): string | undefined => {
+      if (value) {
+        if (Number(value) % 1 !== 0) {
+          return errorMessage;
+        }
+      }
+    };
+  }
+
+  /**
+   * Returns a validator that ensures the value is a number
+   * @param errorMessage Required error message to display
+   */
+  export function isNumber(errorMessage: string): (value?: string | null) => string | undefined {
+    'use strict';
+    return (value?: string | null): string | undefined => {
+      if (value) {
+        if (isNaN(Number(value))) {
+          return errorMessage;
+        }
+      }
+    };
+  }
+}
+
+export type IValidator = (value?: any) => string | undefined;
\ No newline at end of file
diff --git a/packages/experiments/src/demo/AppDefinition.tsx b/packages/experiments/src/demo/AppDefinition.tsx
index 900825cc51232..8a9c1dfe669ee 100644
--- a/packages/experiments/src/demo/AppDefinition.tsx
+++ b/packages/experiments/src/demo/AppDefinition.tsx
@@ -22,6 +22,12 @@ export const AppDefinition: IAppDefinition = {
           name: 'FolderCover',
           url: '#/examples/foldercover'
         },
+        {
+          component: require<any>('../components/Form/FormPage').FormPage,
+          key: 'Form',
+          name: 'Form',
+          url: '#/examples/form'
+        },
         {
           component: require<any>('../components/LayoutGroup/LayoutGroupPage').LayoutGroupPage,
           key: 'LayoutGroup',
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 979d36b627acc..f78f2877a1e5b 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -120,14 +120,10 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     dateTimeFormatter: undefined
   };
 
-  public refs: {
-    [key: string]: React.ReactInstance;
-    root: HTMLElement;
-    textField: TextField;
-  };
-
+  private _root: HTMLElement;
   private _calendar: Calendar;
   private _datepicker: HTMLDivElement;
+  private _textField: TextField;
   private _preventFocusOpeningPicker: boolean;
   private _focusOnSelectedDateOnUpdate: boolean;
 
@@ -185,8 +181,8 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     const { isDatePickerShown, formattedDate, selectedDate, errorMessage } = this.state;
 
     return (
-      <div className={ css('ms-DatePicker', styles.root, className) } ref='root'>
-        <div ref={ (c): HTMLElement => this._datepicker = c! }>
+      <div className={ css('ms-DatePicker', styles.root, className) } ref={ this._resolveRef('_root') }>
+        <div ref={ this._resolveRef('_datepicker') }>
           <TextField
             className={ styles.textField }
             ariaLabel={ ariaLabel }
@@ -213,7 +209,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
             } }
             readOnly={ !allowTextInput }
             value={ formattedDate }
-            ref='textField'
+            ref={ this._resolveRef('_textField') }
             role={ allowTextInput ? 'combobox' : 'menu' }
           />
         </div>
@@ -383,8 +379,8 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     this._preventFocusOpeningPicker = true;
     this._dismissDatePickerPopup();
 
-    if (this.refs.textField) {
-      this.refs.textField.focus();
+    if (this._textField) {
+      this._textField.focus();
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 14420ef2acac3..253678da624fd 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -43,12 +43,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
 
   private static Option: string = 'option';
 
-  public refs: {
-    [key: string]: React.ReactInstance,
-    root: HTMLElement,
-    focusZone: FocusZone
-  };
-
+  private _root: HTMLElement;
   private _focusZone: FocusZone;
   private _dropDown: HTMLDivElement;
   // tslint:disable-next-line:no-unused-variable
@@ -143,7 +138,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     }
 
     return (
-      <div ref='root' className={ css('ms-Dropdown-container') }>
+      <div ref={ this._resolveRef('_root') } className={ css('ms-Dropdown-container') }>
         { label && (
           <Label className={ css('ms-Dropdown-label') } id={ id + '-label' } htmlFor={ id } ref={ this._resolveRef('_dropdownLabel') } required={ required }>{ label }</Label>
         ) }
diff --git a/packages/utilities/src/Async.ts b/packages/utilities/src/Async.ts
index 8849e926ed2c3..b35c62ba50e88 100644
--- a/packages/utilities/src/Async.ts
+++ b/packages/utilities/src/Async.ts
@@ -320,10 +320,20 @@ export class Async {
     leading?: boolean;
     maxWait?: number;
     trailing?: boolean;
-  }): T | (() => void) {
+  }): ICancelable<T> & (() => void) {
 
     if (this._isDisposed) {
-      return this._noop;
+      let noOpFunction: ICancelable<T> & (() => T) = (() => {
+        /** Do nothing */
+      }) as ICancelable<T> & (() => T);
+
+      noOpFunction.cancel = () => { return; };
+      /* tslint:disable:no-any */
+      noOpFunction.flush = (() => null) as any;
+      /* tslint:enable:no-any */
+      noOpFunction.pending = () => false;
+
+      return noOpFunction;
     }
 
     let waitMS = wait || 0;
@@ -349,6 +359,15 @@ export class Async {
       maxWait = options.maxWait;
     }
 
+    let invokeFunction = (time: number) => {
+      if (timeoutId) {
+        this.clearTimeout(timeoutId);
+        timeoutId = null;
+      }
+      lastExecuteTime = time;
+      lastResult = func.apply(this._parent, lastArgs);
+    };
+
     let callback = (userCall?: boolean) => {
       let now = (new Date).getTime();
       let executeImmediately = false;
@@ -373,12 +392,7 @@ export class Async {
       }
 
       if (delta >= waitMS || maxWaitExpired || executeImmediately) {
-        if (timeoutId) {
-          this.clearTimeout(timeoutId);
-          timeoutId = null;
-        }
-        lastExecuteTime = now;
-        lastResult = func.apply(this._parent, lastArgs);
+        invokeFunction(now);
       } else if ((timeoutId === null || !userCall) && trailing) {
         timeoutId = this.setTimeout(callback, waitLength);
       }
@@ -386,11 +400,34 @@ export class Async {
       return lastResult;
     };
 
+    let cancel = (): void => {
+      if (timeoutId) {
+        this.clearTimeout(timeoutId);
+      }
+    };
+
+    let flush = (): T => {
+      if (timeoutId) {
+        this.clearTimeout(timeoutId);
+        invokeFunction(new Date().getTime());
+      }
+
+      return lastResult;
+    };
+
+    let pending = (): boolean => {
+      return !!timeoutId;
+    };
+
     // tslint:disable-next-line:no-any
-    let resultFunction: () => T = (...args: any[]) => {
+    let resultFunction: ICancelable<T> & (() => T) = ((...args: any[]) => {
       lastArgs = args;
       return callback(true);
-    };
+    }) as ICancelable<T> & (() => T);
+
+    resultFunction.cancel = cancel;
+    resultFunction.flush = flush;
+    resultFunction.pending = pending;
 
     return resultFunction;
   }
@@ -444,3 +481,9 @@ export class Async {
     }
   }
 }
+
+export type ICancelable<T> = {
+  flush: () => T;
+  cancel: () => void;
+  pending: () => boolean;
+};
\ No newline at end of file

From 13e4d1734abd87adb983b1cfc57171033ef88bc3 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Tue, 17 Oct 2017 21:24:41 -0700
Subject: [PATCH 0873/1641] Image: Fix conditional for fade in and update docs
 (#3127)

* Update shouldFadeIn default in docs

* Fix shouldStartVisible overriding fade if true

* Change file
---
 .../fix-image-fade_2017-10-16-20-22.json              | 11 +++++++++++
 .../src/components/Image/Image.Props.ts               |  2 +-
 .../src/components/Image/Image.tsx                    |  4 ++--
 3 files changed, 14 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-image-fade_2017-10-16-20-22.json

diff --git a/common/changes/office-ui-fabric-react/fix-image-fade_2017-10-16-20-22.json b/common/changes/office-ui-fabric-react/fix-image-fade_2017-10-16-20-22.json
new file mode 100644
index 0000000000000..0596c0b132484
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-image-fade_2017-10-16-20-22.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix Image css so it doesn't fade in if shouldStartVisible is true",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "a.erich@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.Props.ts b/packages/office-ui-fabric-react/src/components/Image/Image.Props.ts
index 7fb7bec3c9de3..e1374ad052553 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.Props.ts
@@ -13,7 +13,7 @@ export interface IImageProps extends React.ImgHTMLAttributes<HTMLImageElement> {
 
   /**
    * If true, fades the image in when loaded.
-   * @defaultvalue false;
+   * @defaultvalue true
    */
   shouldFadeIn?: boolean;
 
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.tsx
index ac2383b5fd8ac..0845233e5c439 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.tsx
@@ -73,7 +73,7 @@ export class Image extends BaseComponent<IImageProps, IImageState> {
 
   public render() {
     let imageProps = getNativeProps(this.props, imageProperties, ['width', 'height']);
-    let { src, alt, width, height, shouldFadeIn, className, imageFit, role, maximizeFrame } = this.props;
+    let { src, alt, width, height, shouldFadeIn, shouldStartVisible, className, imageFit, role, maximizeFrame } = this.props;
     let { loadState } = this.state;
     let coverStyle = this.props.coverStyle !== undefined ? this.props.coverStyle : this._coverStyle;
     let loaded = loadState === ImageLoadState.loaded || (loadState === ImageLoadState.notLoaded && this.props.shouldStartVisible);
@@ -107,7 +107,7 @@ export class Image extends BaseComponent<IImageProps, IImageState> {
               loaded && 'is-loaded ' + styles.imageIsLoaded,
               shouldFadeIn && 'is-fadeIn',
               loadState === ImageLoadState.error && 'is-error',
-              loaded && shouldFadeIn && AnimationClassNames.fadeIn400,
+              loaded && shouldFadeIn && !shouldStartVisible && AnimationClassNames.fadeIn400,
               {
                 ['ms-Image-image--scaleWidth ' + styles.imageIsScaleWidth]: (imageFit === undefined && !!width && !height),
                 ['ms-Image-image--scaleHeight ' + styles.imageIsScaleHeight]: (imageFit === undefined && !width && !!height),

From 745cec67c600088d6d0423ed4daed8e1c8ed2909 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 17 Oct 2017 21:31:50 -0700
Subject: [PATCH 0874/1641] Website: Updates to links for license and branding
 guidance + link styling fixes (#3130)

* Fixed link colors, removed branding guidance link per CELA

* Added change file

* Updated asset license agreement

* Revised change file
---
 apps/fabric-website/README.md                 |  2 +-
 .../src/pages/GetStarted/GetStartedPage.tsx   |  2 +-
 .../src/pages/HomePage/HomePage.tsx           |  2 +-
 .../BrandIconsPage/BrandIconsPage.module.scss |  4 +++
 .../Styles/BrandIconsPage/BrandIconsPage.tsx  |  9 ++++---
 .../Styles/ColorsPage/ColorsPage.module.scss  |  4 +++
 .../pages/Styles/ColorsPage/ColorsPage.tsx    |  4 +--
 .../Styles/IconsPage/IconsPage.module.scss    | 25 +++----------------
 .../src/pages/Styles/IconsPage/IconsPage.tsx  |  9 ++++---
 .../TypographyPage/TypographyPage.module.scss |  5 ++++
 .../Styles/TypographyPage/TypographyPage.tsx  |  7 ++++--
 .../cela-branding_2017-10-16-21-07.json       | 11 ++++++++
 12 files changed, 48 insertions(+), 36 deletions(-)
 create mode 100644 apps/fabric-website/src/pages/Styles/TypographyPage/TypographyPage.module.scss
 create mode 100644 common/changes/@uifabric/fabric-website/cela-branding_2017-10-16-21-07.json

diff --git a/apps/fabric-website/README.md b/apps/fabric-website/README.md
index 90ec8e4526209..e78385fb9b543 100644
--- a/apps/fabric-website/README.md
+++ b/apps/fabric-website/README.md
@@ -19,7 +19,7 @@ Before you get started, make sure you have [node.js](https://nodejs.org/), [gulp
 
 All files on the Office UI Fabric React GitHub repository are subject to the MIT license. Please read the License file at the root of the project.
 
-Usage of the fonts referenced in Office UI Fabric files is subject to the [license](https://spoprod-a.akamaihd.net/files/fabric/assets/microsoft_fabric_assets_license_agreement_sept092017.pdf).
+Usage of the fonts referenced in Office UI Fabric files is subject to the [license](https://spoprod-a.akamaihd.net/files/fabric/assets/microsoft_fabric_assets_license_agreement_v2_09262017.pdf).
 
 - - -
 
diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
index debedd21e98e5..dd76e1aa02a68 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
@@ -206,7 +206,7 @@ initializeIcons('https://my.cdn.com/path/to/icons/');`
           <h3>Need an icon or feature Fabric Core doesn&rsquo;t have?</h3>
           <p>First, check the <a className={ styles.getStartedLink } href='https://github.com/OfficeDev/office-ui-fabric-react/issues'>Fabric React issue queue</a> or <a className={ styles.getStartedLink } href='https://github.com/OfficeDev/office-ui-fabric-react/projects'>projects</a> to see if your component has already been requested or is being worked on. If you don't see an existing issue or project for the component you're looking for, please <a className={ styles.getStartedLink } href='https://github.com/OfficeDev/office-ui-fabric-react/issues'>file an issue in the repo</a>, and we'll respond if it's being built or on our radar.</p>
 
-          <p className={ styles.trademark }>Usage of Fabric assets, such as fonts and icons, is subject to the <a className={ styles.getStartedLink } href='https://static2.sharepointonline.com/files/fabric/assets/microsoft_fabric_assets_license_agreement_sept092017.pdf'>assets license agreement</a>.</p>
+          <p className={ styles.trademark }>Usage of Fabric assets, such as fonts and icons, is subject to the <a className={ styles.getStartedLink } href='https://static2.sharepointonline.com/files/fabric/assets/microsoft_fabric_assets_license_agreement_v2_09262017.pdf'>assets license agreement</a>.</p>
         </div>
 
       </div>
diff --git a/apps/fabric-website/src/pages/HomePage/HomePage.tsx b/apps/fabric-website/src/pages/HomePage/HomePage.tsx
index 6545d5a36fdd6..d7be28efd0838 100644
--- a/apps/fabric-website/src/pages/HomePage/HomePage.tsx
+++ b/apps/fabric-website/src/pages/HomePage/HomePage.tsx
@@ -81,7 +81,7 @@ export class HomePage extends React.Component<any, any> {
               </a>
             </li>
           </ul>
-          <span className={ styles.trademark }>All trademarks are the property of their respective owners. Usage of Fabric assets, such as fonts and icons, is subject to the <a className={ styles.homePageLink } href='https://static2.sharepointonline.com/files/fabric/assets/microsoft_fabric_assets_license_agreement_sept092017.pdf'>assets license agreement</a>.</span>
+          <span className={ styles.trademark }>All trademarks are the property of their respective owners. Usage of Fabric assets, such as fonts and icons, is subject to the <a className={ styles.homePageLink } href='https://static2.sharepointonline.com/files/fabric/assets/microsoft_fabric_assets_license_agreement_v2_09262017.pdf'>assets license agreement</a>.</span>
           <span className={ styles.featuredTitle }>Design Toolkit</span>
           <span className={ styles.featuredDescription } id={ styles.toolkitDescription }>The Fabric design toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Office experiences. <a className={ styles.homePageLink } href='#/resources'>Learn more</a></span>
         </div>
diff --git a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss
index 02759d646eeb0..c592be55e3dc3 100644
--- a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss
+++ b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.module.scss
@@ -52,6 +52,10 @@
   }
 }
 
+.brandIconsPage .brandIconsPageLink {
+  color: $ms-color-themePrimary;
+}
+
 @media screen and (min-width: $uhf-screen-min-mobile) {
   .iconList {
     li {
diff --git a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
index 612638ff35294..b367773a96ff0 100644
--- a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { CodeBlock } from '../../../components/CodeBlock/CodeBlock';
+import { css } from 'office-ui-fabric-react/lib/Utilities';
 import { PageHeader } from '../../../components/PageHeader/PageHeader';
 import { Table } from '../../../components/Table/Table';
 import { IconGrid } from '../../../components/IconGrid/IconGrid';
@@ -19,7 +20,7 @@ export class BrandIconsPage extends React.Component<any, any> {
     let documentIcons = documentIconsData;
 
     return (
-      <div className={ pageStyles.basePage }>
+      <div className={ css(pageStyles.basePage, styles.brandIconsPage) }>
         <PageHeader
           pageTitle='Office brand icons'
           links={
@@ -52,7 +53,7 @@ export class BrandIconsPage extends React.Component<any, any> {
         <div className={ pageStyles.u_maxTextWidth }>
           <h2 id='overview'>Overview</h2>
           <p>Fabric includes product and document icons that you can use to connect your experience with other Office and Office 365 endpoints. The icons come in three formats &mdash; SVG and PNG for multicolor and the icon font for monochrome &mdash; in a variety of sizes and resolutions.</p>
-          <p>Usage of these icons is subject to the <a href='https://static2.sharepointonline.com/files/fabric/assets/microsoft_fabric_assets_license_agreement_sept092017.pdf'>assets license agreement (PDF)</a> and our <a href={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/files/office_marketing_guidelines.pdf' }>brand guidelines (PDF)</a>. Please read this document and the resolution/size guidance carefully to ensure that you use our branded icons correctly to create the best experience.</p>
+          <p>Usage of these icons is subject to the <a className={ styles.brandIconsPageLink } href='https://static2.sharepointonline.com/files/fabric/assets/microsoft_fabric_assets_license_agreement_v2_09262017.pdf'>assets license agreement (PDF)</a>. Please read this document and the resolution/size guidance carefully to ensure that you use our branded icons correctly to create the best experience.</p>
         </div>
         <h3>Product icons</h3>
         <div className='ms-Grid ms-Grid--wide'>
@@ -105,7 +106,7 @@ export class BrandIconsPage extends React.Component<any, any> {
               <p className={ styles.paragraphInGrid }>Multicolor product and document icons look best at 16x16, 48x48, and 96x96 px sizes in the UI of Microsoft products. Fabric provides these icons in both SVG and PNG formats. SVGs are more versatile but are not supported by all browsers. PNGs are supported by most browsers, but require many sizes to remain visually crisp.</p>
               <p className={ styles.paragraphInGrid }>PNGs come in 16x16, 32x32, 48x48, and 96x96 pixel sizes. Where possible, use the default sizes to prevent artifacts and split pixels. Otherwise, use a size that is close to one of the default sizes.</p>
               <p className={ styles.paragraphInGrid }>Because SVGs are vectors, you can resize them more easily. They come in two sizes: 16x16 and 48x48 px. Use the size that most closely maps to what you need for your experience for the best quality.</p>
-              <p className={ styles.paragraphInGrid }>Monochrome product icons that are included in the icon font are subject to the branding guidelines, but you can reference them just like other icons noted in the <a href='#/styles/icons'>icons section</a>.</p>
+              <p className={ styles.paragraphInGrid }>Monochrome product icons that are included in the icon font are subject to the branding guidelines, but you can reference them just like other icons noted in the <a className={ styles.brandIconsPageLink } href='#/styles/icons'>icons section</a>.</p>
             </div>
             <div className='ms-Grid-col ms-sm12 ms-lg6'>
               <ul className={ styles.exampleIcons }>
@@ -242,7 +243,7 @@ https://static2.sharepointonline.com/files/fabric/assets/brand-icons/document/pn
         </ul>
 
         <h3>Single-color icons</h3>
-        <p>Fabric&rsquo;s <a href='#/styles/icons'>icon set</a> also contains single-color product and document icons. You use these single-color icons like all other icons in Fabric. For more information, see the <a href='#/styles/icons'>icons page</a> or the following example:</p>
+        <p>Fabric&rsquo;s <a className={ styles.brandIconsPageLink } href='#/styles/icons'>icon set</a> also contains single-color product and document icons. You use these single-color icons like all other icons in Fabric. For more information, see the <a className={ styles.brandIconsPageLink } href='#/styles/icons'>icons page</a> or the following example:</p>
         <CodeBlock language='html' isLightTheme={ true }>
           {
             `<i class="ms-Icon ms-Icon--AccessLogo" aria-hidden="true"></i>`
diff --git a/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.module.scss b/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.module.scss
index a8b1d37d02bcb..338e01d11fed7 100644
--- a/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.module.scss
+++ b/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.module.scss
@@ -4,6 +4,10 @@
   @include ms-padding-left($contentInGrid);
 }
 
+.overview .colorsPageLink {
+  color: $ms-color-themePrimary;
+}
+
 // XL and up
 @media screen and (min-width: $ms-screen-min-xl) {
   .accentGroup {
diff --git a/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx b/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
index cae1d758b8387..e92d5cfaa5d8d 100644
--- a/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
@@ -36,9 +36,9 @@ export class ColorsPage extends React.Component<any, any> {
           }
           backgroundColor='#006f94'
         />
-        <div className={ pageStyles.u_maxTextWidth }>
+        <div className={ css(pageStyles.u_maxTextWidth, styles.overview) }>
           <h2 id='Overview'>Overview</h2>
-          <p>Fabric includes 9 theme colors and 11 neutral colors. Each has helper classes for text, background, border, and hover states. When selecting colors, refer to the <a href={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/files/coloraccessibility_29sep2016.pdf' }>color accessibility guidance (PDF)</a> to ensure that your text can be ready by everyone.</p>
+          <p>Fabric includes 9 theme colors and 11 neutral colors. Each has helper classes for text, background, border, and hover states. When selecting colors, refer to the <a className={ styles.colorsPageLink } href={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/files/coloraccessibility_29sep2016.pdf' }>color accessibility guidance (PDF)</a> to ensure that your text can be ready by everyone.</p>
         </div>
         <h2 id='implementation'>Implementation</h2>
         <p>Colors can be applied to text, backgrounds, or borders using the following class name conventions:</p>
diff --git a/apps/fabric-website/src/pages/Styles/IconsPage/IconsPage.module.scss b/apps/fabric-website/src/pages/Styles/IconsPage/IconsPage.module.scss
index 65e421f522e9c..5b464f41057f8 100644
--- a/apps/fabric-website/src/pages/Styles/IconsPage/IconsPage.module.scss
+++ b/apps/fabric-website/src/pages/Styles/IconsPage/IconsPage.module.scss
@@ -1,24 +1,5 @@
 @import '../../../styles/variables';
 
-.iconGrid {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: space-between;
-
-  li {
-    align-items: center;
-    display: flex;
-    font-size: $font-size-bigger;
-    height: 48px;
-    justify-content: center;
-    padding: 30px;
-    width: 48px;
-  }
-
-  // Add a flexible element that fills the available space
-  // remaining in a row, preventing icons from being far apart
-  &:after {
-    content: "";
-    flex: auto;
-  }
-}
+.iconsPage .iconsPageLink {
+  color: $ms-color-themePrimary;
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/pages/Styles/IconsPage/IconsPage.tsx b/apps/fabric-website/src/pages/Styles/IconsPage/IconsPage.tsx
index 7728732259c80..3a754649c6704 100644
--- a/apps/fabric-website/src/pages/Styles/IconsPage/IconsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/IconsPage/IconsPage.tsx
@@ -1,7 +1,10 @@
 import * as React from 'react';
 import { CodeBlock } from '../../../components/CodeBlock/CodeBlock';
+import { css } from 'office-ui-fabric-react/lib/Utilities';
 import { IconGrid } from '../../../components/IconGrid/IconGrid';
 import { PageHeader } from '../../../components/PageHeader/PageHeader';
+import * as stylesImport from './IconsPage.module.scss';
+const styles: any = stylesImport;
 const pageStyles: any = require('../../PageStyles.module.scss');
 
 const iconData = require('../../../../node_modules/office-ui-fabric-core/src/data/icons.json');
@@ -9,7 +12,7 @@ const iconData = require('../../../../node_modules/office-ui-fabric-core/src/dat
 export class IconsPage extends React.Component<any, any> {
   public render() {
     return (
-      <div className={ pageStyles.basePage }>
+      <div className={ css(pageStyles.basePage, styles.iconsPage) }>
         <PageHeader
           pageTitle='Icons'
           links={
@@ -37,10 +40,10 @@ export class IconsPage extends React.Component<any, any> {
           }
         </CodeBlock>
         <div className={ pageStyles.u_maxTextWidth }>
-          <p>Note the <code>aria-hidden</code> attribute, which prevents screen readers from reading the icon. In cases where meaning is conveyed only through the icon, such as an icon-only navigation bar, use the <a href='https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-label_attribute'><code>aria-label</code> attribute</a> on the button for accessibility.</p>
+          <p>Note the <code>aria-hidden</code> attribute, which prevents screen readers from reading the icon. In cases where meaning is conveyed only through the icon, such as an icon-only navigation bar, use the <a className={ styles.iconsPageLink } href='https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-label_attribute'><code>aria-label</code> attribute</a> on the button for accessibility.</p>
         </div>
 
-        <strong>See the <a href='#/styles/brand-icons'>brand icons page</a> for multi-color product and document icons.</strong>
+        <strong>See the <a className={ styles.iconsPageLink } href='#/styles/brand-icons'>brand icons page</a> for multi-color product and document icons.</strong>
 
         <h2 id='icons'>Icons</h2>
 
diff --git a/apps/fabric-website/src/pages/Styles/TypographyPage/TypographyPage.module.scss b/apps/fabric-website/src/pages/Styles/TypographyPage/TypographyPage.module.scss
new file mode 100644
index 0000000000000..0c6487a805195
--- /dev/null
+++ b/apps/fabric-website/src/pages/Styles/TypographyPage/TypographyPage.module.scss
@@ -0,0 +1,5 @@
+@import '../../../styles/variables';
+
+.typographyPage .typographyPageLink {
+  color: $ms-color-themePrimary;
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/pages/Styles/TypographyPage/TypographyPage.tsx b/apps/fabric-website/src/pages/Styles/TypographyPage/TypographyPage.tsx
index f92ff1cba16cd..19d6955bd429b 100644
--- a/apps/fabric-website/src/pages/Styles/TypographyPage/TypographyPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/TypographyPage/TypographyPage.tsx
@@ -1,6 +1,9 @@
 import * as React from 'react';
+import { css } from 'office-ui-fabric-react/lib/Utilities';
 import { PageHeader } from '../../../components/PageHeader/PageHeader';
 import { Table } from '../../../components/Table/Table';
+import * as stylesImport from './TypographyPage.module.scss';
+const styles: any = stylesImport;
 const pageStyles: any = require('../../PageStyles.module.scss');
 
 const typeRampData = require('../../../data/type-ramp.json');
@@ -10,7 +13,7 @@ const typeWeightData = require('../../../data/type-weights.json');
 export class TypographyPage extends React.Component<any, any> {
   public render() {
     return (
-      <div className={ pageStyles.basePage }>
+      <div className={ css(pageStyles.basePage, styles.typographyPage) }>
         <PageHeader
           pageTitle='Typography'
           links={
@@ -39,7 +42,7 @@ export class TypographyPage extends React.Component<any, any> {
         <Table responsive={ true } content={ typeRampData } />
 
         <div className={ pageStyles.u_maxTextWidth }>
-          <p>To provide flexibility, text color is not included in these base classes. We recommend using 'neutral primary' for most text on white backgrounds. See the <a href='#/styles/colors'>color documentation</a> for guidance.</p>
+          <p>To provide flexibility, text color is not included in these base classes. We recommend using 'neutral primary' for most text on white backgrounds. See the <a className={ styles.typographyPageLink } href='#/styles/colors'>color documentation</a> for guidance.</p>
         </div>
         <h2 id='size'>Size classes</h2>
         <p>To set the text size independent of the weight, use a size class.</p>
diff --git a/common/changes/@uifabric/fabric-website/cela-branding_2017-10-16-21-07.json b/common/changes/@uifabric/fabric-website/cela-branding_2017-10-16-21-07.json
new file mode 100644
index 0000000000000..670394811f2bb
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/cela-branding_2017-10-16-21-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Removed branding guidance pdf, updated fabric asset license pdf, and fixed link colors",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}

From c00e9caa7e878f476462af2f86b174b7d3423008 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Tue, 17 Oct 2017 21:32:53 -0700
Subject: [PATCH 0875/1641] Additional snapshot tests (#3116)

---
 .../src/components/Label/Label.test.tsx       |    9 +
 .../Label/__snapshots__/Label.test.tsx.snap   |   26 +
 .../src/components/Layer/Layer.test.tsx       |    6 +
 .../Layer/__snapshots__/Layer.test.tsx.snap   |    7 +
 .../components/MessageBar/MessageBar.test.tsx |    7 +
 .../__snapshots__/MessageBar.test.tsx.snap    |   39 +
 .../src/components/Rating/Rating.test.tsx     |    7 +
 .../Rating/__snapshots__/Rating.test.tsx.snap |  210 +++
 .../src/components/Slider/Slider.test.tsx     |    7 +
 .../Slider/__snapshots__/Slider.test.tsx.snap |   78 +
 .../components/SpinButton/SpinButton.test.tsx |    7 +
 .../__snapshots__/SpinButton.test.tsx.snap    |  363 +++++
 .../SwatchColorPicker.test.tsx                |   11 +
 .../SwatchColorPicker.test.tsx.snap           | 1315 +++++++++++++++++
 .../TeachingBubble/TeachingBubble.test.tsx    |   12 +
 .../TeachingBubble.test.tsx.snap              |   36 +
 .../components/TextField/TextField.test.tsx   |    7 +
 .../__snapshots__/TextField.test.tsx.snap     |   52 +
 .../src/components/Toggle/Toggle.test.tsx     |   11 +
 .../Toggle/__snapshots__/Toggle.test.tsx.snap |  112 ++
 .../components/pickers/BasePicker.test.tsx    |   23 +
 .../__snapshots__/BasePicker.test.tsx.snap    |  125 ++
 22 files changed, 2470 insertions(+)
 create mode 100644 packages/office-ui-fabric-react/src/components/Label/__snapshots__/Label.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/Layer/__snapshots__/Layer.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/MessageBar/__snapshots__/MessageBar.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/Slider/__snapshots__/Slider.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/TeachingBubble/__snapshots__/TeachingBubble.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/TextField/__snapshots__/TextField.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap

diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.test.tsx b/packages/office-ui-fabric-react/src/components/Label/Label.test.tsx
index b1db5d418fa89..a19745b54f801 100644
--- a/packages/office-ui-fabric-react/src/components/Label/Label.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Label/Label.test.tsx
@@ -4,6 +4,7 @@ import * as React from 'react';
 
 import * as ReactDOM from 'react-dom';
 import * as ReactTestUtils from 'react-dom/test-utils';
+import * as renderer from 'react-test-renderer';
 
 import { Label } from './Label';
 
@@ -18,4 +19,12 @@ describe('Label', () => {
     expect(renderedDOM.textContent).toEqual('test');
   });
 
+  it('renders label correctly', () => {
+    const component = renderer.create(
+      <Label>test</Label>
+    );
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
 });
diff --git a/packages/office-ui-fabric-react/src/components/Label/__snapshots__/Label.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Label/__snapshots__/Label.test.tsx.snap
new file mode 100644
index 0000000000000..31b3c59d3f7d1
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Label/__snapshots__/Label.test.tsx.snap
@@ -0,0 +1,26 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Label renders label correctly 1`] = `
+<label
+  className=
+      ms-Label
+      {
+        box-shadow: none;
+        box-sizing: border-box;
+        color: #333333;
+        display: block;
+        margin-bottom: 0px;
+        margin-left: 0px;
+        margin-right: 0px;
+        margin-top: 0px;
+        overflow-wrap: break-word;
+        padding-bottom: 5px;
+        padding-left: 0;
+        padding-right: 0;
+        padding-top: 5px;
+        word-wrap: break-word;
+      }
+>
+  test
+</label>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.test.tsx b/packages/office-ui-fabric-react/src/components/Layer/Layer.test.tsx
index 6ef9b89c09bb6..dcd760279bfa1 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/Layer.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.test.tsx
@@ -3,11 +3,17 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import * as PropTypes from 'prop-types';
 /* tslint:enable:no-unused-variable */
+import * as renderer from 'react-test-renderer';
 
 import { Layer } from './Layer';
 import { LayerHost } from './LayerHost';
 
 describe('Layer', () => {
+  it('renders Layer correctly', () => {
+    const component = renderer.create(<Layer>Content</Layer>);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
 
   it('can render in a targeted LayerHost and pass context through', () => {
 
diff --git a/packages/office-ui-fabric-react/src/components/Layer/__snapshots__/Layer.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Layer/__snapshots__/Layer.test.tsx.snap
new file mode 100644
index 0000000000000..2ea317e206ef8
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Layer/__snapshots__/Layer.test.tsx.snap
@@ -0,0 +1,7 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Layer renders Layer correctly 1`] = `
+<span
+  className="ms-Layer"
+/>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.test.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.test.tsx
index 4117a48d203a9..311197014777e 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.test.tsx
@@ -3,6 +3,7 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import * as ReactDOM from 'react-dom';
 import * as ReactTestUtils from 'react-dom/test-utils';
+import * as renderer from 'react-test-renderer';
 
 import { MessageBar } from './MessageBar';
 
@@ -17,6 +18,12 @@ describe('MessageBar', () => {
     return renderedDOM as HTMLElement;
   }
 
+  it('renders MessageBar correctly', () => {
+    const component = renderer.create(<MessageBar>Message</MessageBar>);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
   describe('dismiss', () => {
     describe('single-line', () => {
       it('is present when onDismiss exists', () => {
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/__snapshots__/MessageBar.test.tsx.snap b/packages/office-ui-fabric-react/src/components/MessageBar/__snapshots__/MessageBar.test.tsx.snap
new file mode 100644
index 0000000000000..2880cfdad049c
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/__snapshots__/MessageBar.test.tsx.snap
@@ -0,0 +1,39 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`MessageBar renders MessageBar correctly 1`] = `
+<div
+  aria-live="polite"
+  className="ms-MessageBar ms-MessageBar undefined ms-MessageBar-multiline"
+  role="status"
+>
+  <div
+    className="ms-MessageBar-content"
+  >
+    <div
+      className="ms-MessageBar-icon"
+    >
+      <i
+        aria-hidden={true}
+        aria-label={undefined}
+        className=
+            ms-Icon
+            {
+              display: inline-block;
+            }
+        data-icon-name="Info"
+        role="presentation"
+      />
+    </div>
+    <div
+      className="ms-MessageBar-text"
+      id="MessageBar0"
+    >
+      <span
+        aria-live="polite"
+        className="ms-MessageBar-innerText undefined"
+        role="status"
+      />
+    </div>
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx b/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
index 7bdf424f116b8..010edd5344dd3 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
@@ -4,10 +4,17 @@ import * as React from 'react';
 
 import * as ReactDOM from 'react-dom';
 import * as ReactTestUtils from 'react-dom/test-utils';
+import * as renderer from 'react-test-renderer';
 
 import { Rating } from './Rating';
 
 describe('Rating', () => {
+  it('Renders Rating correctly', () => {
+    const component = renderer.create(<Rating />);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
   it('Can change rating.', () => {
     let exception;
     let threwException = false;
diff --git a/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap
new file mode 100644
index 0000000000000..c0081089036b9
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap
@@ -0,0 +1,210 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Rating Renders Rating correctly 1`] = `
+<div
+  className="ms-Rating"
+  role="application"
+>
+  <div
+    aria-labelledby={undefined}
+    className="ms-Rating-container"
+    role="radiogroup"
+  >
+    <div
+      className="ms-Rating-star is-selected undefined"
+    >
+      <input
+        aria-labelledby="RatingLabel1-1"
+        checked={true}
+        className="ms-Rating-input"
+        disabled={undefined}
+        id="Rating0-1"
+        name="Rating0"
+        onBlur={[Function]}
+        onChange={[Function]}
+        onFocus={[Function]}
+        type="radio"
+        value={1}
+      />
+      <label
+        className="ms-Rating-label"
+        htmlFor="Rating0-1"
+      >
+        <span
+          className="ms-Rating-labelText"
+          id="RatingLabel1-1"
+        >
+          1 Star
+        </span>
+        <i
+          aria-hidden={true}
+          aria-label={undefined}
+          className=
+              ms-Icon
+              {
+                display: inline-block;
+              }
+          data-icon-name="favoriteStarFill"
+          role="presentation"
+        />
+      </label>
+    </div>
+    <div
+      className="ms-Rating-star"
+    >
+      <input
+        aria-labelledby="RatingLabel1-2"
+        checked={false}
+        className="ms-Rating-input"
+        disabled={undefined}
+        id="Rating0-2"
+        name="Rating0"
+        onBlur={[Function]}
+        onChange={[Function]}
+        onFocus={[Function]}
+        type="radio"
+        value={2}
+      />
+      <label
+        className="ms-Rating-label"
+        htmlFor="Rating0-2"
+      >
+        <span
+          className="ms-Rating-labelText"
+          id="RatingLabel1-2"
+        >
+          2 Star
+        </span>
+        <i
+          aria-hidden={true}
+          aria-label={undefined}
+          className=
+              ms-Icon
+              {
+                display: inline-block;
+              }
+          data-icon-name="favoriteStarFill"
+          role="presentation"
+        />
+      </label>
+    </div>
+    <div
+      className="ms-Rating-star"
+    >
+      <input
+        aria-labelledby="RatingLabel1-3"
+        checked={false}
+        className="ms-Rating-input"
+        disabled={undefined}
+        id="Rating0-3"
+        name="Rating0"
+        onBlur={[Function]}
+        onChange={[Function]}
+        onFocus={[Function]}
+        type="radio"
+        value={3}
+      />
+      <label
+        className="ms-Rating-label"
+        htmlFor="Rating0-3"
+      >
+        <span
+          className="ms-Rating-labelText"
+          id="RatingLabel1-3"
+        >
+          3 Star
+        </span>
+        <i
+          aria-hidden={true}
+          aria-label={undefined}
+          className=
+              ms-Icon
+              {
+                display: inline-block;
+              }
+          data-icon-name="favoriteStarFill"
+          role="presentation"
+        />
+      </label>
+    </div>
+    <div
+      className="ms-Rating-star"
+    >
+      <input
+        aria-labelledby="RatingLabel1-4"
+        checked={false}
+        className="ms-Rating-input"
+        disabled={undefined}
+        id="Rating0-4"
+        name="Rating0"
+        onBlur={[Function]}
+        onChange={[Function]}
+        onFocus={[Function]}
+        type="radio"
+        value={4}
+      />
+      <label
+        className="ms-Rating-label"
+        htmlFor="Rating0-4"
+      >
+        <span
+          className="ms-Rating-labelText"
+          id="RatingLabel1-4"
+        >
+          4 Star
+        </span>
+        <i
+          aria-hidden={true}
+          aria-label={undefined}
+          className=
+              ms-Icon
+              {
+                display: inline-block;
+              }
+          data-icon-name="favoriteStarFill"
+          role="presentation"
+        />
+      </label>
+    </div>
+    <div
+      className="ms-Rating-star"
+    >
+      <input
+        aria-labelledby="RatingLabel1-5"
+        checked={false}
+        className="ms-Rating-input"
+        disabled={undefined}
+        id="Rating0-5"
+        name="Rating0"
+        onBlur={[Function]}
+        onChange={[Function]}
+        onFocus={[Function]}
+        type="radio"
+        value={5}
+      />
+      <label
+        className="ms-Rating-label"
+        htmlFor="Rating0-5"
+      >
+        <span
+          className="ms-Rating-labelText"
+          id="RatingLabel1-5"
+        >
+          5 Star
+        </span>
+        <i
+          aria-hidden={true}
+          aria-label={undefined}
+          className=
+              ms-Icon
+              {
+                display: inline-block;
+              }
+          data-icon-name="favoriteStarFill"
+          role="presentation"
+        />
+      </label>
+    </div>
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
index b42e87db348ea..beda0a55abd92 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
@@ -4,12 +4,19 @@ import * as React from 'react';
 
 import * as ReactDOM from 'react-dom';
 import * as ReactTestUtils from 'react-dom/test-utils';
+import * as renderer from 'react-test-renderer';
 
 import { Slider } from './Slider';
 import { ISlider } from './Slider.Props';
 
 describe('Slider', () => {
 
+  it('renders Slider correctly', () => {
+    const component = renderer.create(<Slider />);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
   it('renders a slider', () => {
     let component = ReactTestUtils.renderIntoDocument(
       <Slider label='slider' />
diff --git a/packages/office-ui-fabric-react/src/components/Slider/__snapshots__/Slider.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Slider/__snapshots__/Slider.test.tsx.snap
new file mode 100644
index 0000000000000..89d5a55c49be3
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Slider/__snapshots__/Slider.test.tsx.snap
@@ -0,0 +1,78 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Slider renders Slider correctly 1`] = `
+<div
+  className="ms-Slider ms-Slider-enabled undefined ms-Slider-row undefined"
+>
+  <div
+    className="ms-Slider-container"
+  >
+    <button
+      aria-label={undefined}
+      aria-valuemax={10}
+      aria-valuemin={0}
+      aria-valuenow={0}
+      className="ms-Slider-slideBox ms-Slider-showValue ms-Slider-showTransitions undefined"
+      disabled={false}
+      id="Slider0"
+      onKeyDown={[Function]}
+      onMouseDown={[Function]}
+      onTouchStart={[Function]}
+      role="slider"
+      type="button"
+    >
+      <div
+        className="ms-Slider-line"
+      >
+        <span
+          className="ms-Slider-thumb"
+          style={
+            Object {
+              "left": "0%",
+            }
+          }
+        />
+        <span
+          className="ms-Slider-active"
+          style={
+            Object {
+              "width": "0%",
+            }
+          }
+        />
+        <span
+          className="ms-Slider-inactive"
+          style={
+            Object {
+              "width": "100%",
+            }
+          }
+        />
+      </div>
+    </button>
+    <label
+      className=
+          ms-Label
+          ms-Slider-value
+          {
+            box-shadow: none;
+            box-sizing: border-box;
+            color: #333333;
+            display: block;
+            margin-bottom: 0px;
+            margin-left: 0px;
+            margin-right: 0px;
+            margin-top: 0px;
+            overflow-wrap: break-word;
+            padding-bottom: 5px;
+            padding-left: 0;
+            padding-right: 0;
+            padding-top: 5px;
+            word-wrap: break-word;
+          }
+    >
+      0
+    </label>
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
index 0ff9d6bd042f5..4a8cee61cb9bd 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
@@ -2,6 +2,7 @@ import { Promise } from 'es6-promise';
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import * as ReactTestUtils from 'react-dom/test-utils';
+import * as renderer from 'react-test-renderer';
 import { SpinButton } from './SpinButton';
 import { KeyCodes } from '../../Utilities';
 
@@ -18,6 +19,12 @@ describe('SpinButton', () => {
     return event;
   }
 
+  it('renders SpinButton correctly', () => {
+    const component = renderer.create(<SpinButton label='label' />);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
   it('should render a spinner with the default value on the input element', () => {
     const exampleLabelValue: string = 'SpinButton';
     const exampleMinValue: number = 2;
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
new file mode 100644
index 0000000000000..49102ed3800b6
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
@@ -0,0 +1,363 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`SpinButton renders SpinButton correctly 1`] = `
+<div
+  className=
+
+      {
+        font-size: 14px;
+        min-width: 86px;
+        outline: none;
+        padding-bottom: 2px;
+        padding-left: 2px;
+        padding-right: 2px;
+        padding-top: 2px;
+        width: 100%;
+      }
+>
+  <div
+    className=
+
+        {
+          display: inline-flex;
+          float: left;
+          margin-right: 10px;
+        }
+  >
+    <label
+      className=
+          ms-Label
+          {
+            box-shadow: none;
+            box-sizing: border-box;
+            color: #333333;
+            display: block;
+            margin-bottom: 0px;
+            margin-left: 0px;
+            margin-right: 0px;
+            margin-top: 0px;
+            overflow-wrap: break-word;
+            padding-bottom: 2px;
+            padding-left: 0;
+            padding-right: 0;
+            padding-top: 2px;
+            pointer-events: none;
+            word-wrap: break-word;
+          }
+      htmlFor="input1"
+      id="Label0"
+    >
+      label
+    </label>
+  </div>
+  <div
+    aria-label={undefined}
+    className=
+
+        {
+          border-color: #c8c8c8;
+          border-style: solid;
+          border-width: 1px;
+          display: flex;
+          height: 26px;
+          min-width: 86px;
+        }
+        &:hover {
+          border-color: #666666;
+          outline: 2px dashed transparent;
+        }
+        @media screen and (-ms-high-contrast: active){&:hover {
+          border-color: Highlight;
+        }
+    title={undefined}
+  >
+    <input
+      aria-disabled={false}
+      aria-labelledby="Label0"
+      aria-valuemax="100"
+      aria-valuemin={0}
+      aria-valuenow="0"
+      className=
+          ms-spinButton-input
+          {
+            border-style: none;
+            box-shadow: none;
+            box-sizing: border-box;
+            color: #333333;
+            cursor: text;
+            display: block;
+            float: left;
+            font-size: 14px;
+            height: 100%;
+            margin-bottom: 0;
+            margin-left: 0;
+            margin-right: 0;
+            margin-top: 0;
+            min-width: 72px;
+            outline: 0;
+            overflow: hidden;
+            padding-bottom: 4px;
+            padding-left: 4px;
+            padding-right: 3px;
+            padding-top: 3px;
+            text-overflow: ellipsis;
+            user-select: text;
+            width: calc(100% - 14px);
+          }
+          &::selection {
+            background-color: #0078d7;
+            color: #ffffff;
+          }
+          @media screen and (-ms-high-contrast: active){&::selection {
+            background-color: Highlight;
+            border-color: Highlight;
+            color: HighlightText;
+          }
+      disabled={false}
+      id="input1"
+      onBlur={[Function]}
+      onChange={[Function]}
+      onFocus={[Function]}
+      onInput={[Function]}
+      onKeyDown={[Function]}
+      onKeyUp={[Function]}
+      readOnly={false}
+      role="spinbutton"
+      type="text"
+      value="0"
+    />
+    <span
+      className=
+
+          {
+            box-sizing: border-box;
+            cursor: default;
+            display: block;
+            float: left;
+            font-size: 12px;
+            height: 100%;
+            outline: none;
+            padding-bottom: 0;
+            padding-left: 0;
+            padding-right: 0;
+            padding-top: 0;
+          }
+    >
+      <button
+        aria-describedby={null}
+        aria-hidden="true"
+        aria-label={undefined}
+        aria-labelledby={null}
+        aria-pressed={false}
+        checked={false}
+        className=
+            ms-UpButton
+            ms-Button
+            ms-Button--icon
+            {
+              -moz-osx-font-smoothing: grayscale;
+              -webkit-font-smoothing: antialiased;
+              background-color: transparent;
+              border-radius: 0px;
+              border: 1px solid transparent;
+              box-sizing: border-box;
+              color: #333333;
+              cursor: default;
+              display: block;
+              font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+              font-size: 14px;
+              font-weight: 400;
+              height: 50%;
+              outline: none;
+              padding-bottom: 0;
+              padding-left: 0;
+              padding-right: 0;
+              padding-top: 0;
+              position: relative;
+              text-align: center;
+              text-decoration: none;
+              user-select: none;
+              vertical-align: top;
+              width: 14px;
+            }
+            &::-moz-focus-inner {
+              border: 0;
+            }
+            .ms-Fabric.is-focusVisible &:focus:after {
+              border: 1px solid #ffffff;
+              bottom: 0px;
+              content: "";
+              left: 0px;
+              outline: 1px solid #666666;
+              position: absolute;
+              right: 0px;
+              top: 0px;
+              z-index: 1;
+            }
+            &:hover {
+              background-color: #eaeaea;
+              color: #004578;
+            }
+            &:active {
+              background-color: #0078d7;
+              color: #ffffff;
+            }
+            @media screen and (-ms-high-contrast: active){&:active {
+              background-color: Highlight;
+              color: HighlightText;
+            }
+        data-is-focusable={true}
+        disabled={undefined}
+        onMouseDown={[Function]}
+        onMouseLeave={[Function]}
+        onMouseUp={[Function]}
+        tabIndex={-1}
+        type="button"
+      >
+        <div
+          className=
+              ms-Button-flexContainer
+              {
+                align-items: center;
+                display: flex;
+                flex-wrap: nowrap;
+                height: 100%;
+                justify-content: center;
+              }
+        >
+          <i
+            aria-hidden={true}
+            aria-label={undefined}
+            className=
+                ms-Icon
+                ms-Button-icon
+                {
+                  display: inline-block;
+                }
+                {
+                  font-size: 6px;
+                  height: 16px;
+                  line-height: 16px;
+                  margin-bottom: 0;
+                  margin-left: 0;
+                  margin-right: 0;
+                  margin-top: 0;
+                  text-align: center;
+                  vertical-align: middle;
+                }
+            data-icon-name="ChevronUpSmall"
+            role="presentation"
+          />
+        </div>
+      </button>
+      <button
+        aria-describedby={null}
+        aria-hidden="true"
+        aria-label={undefined}
+        aria-labelledby={null}
+        aria-pressed={false}
+        checked={false}
+        className=
+            ms-DownButton
+            ms-Button
+            ms-Button--icon
+            {
+              -moz-osx-font-smoothing: grayscale;
+              -webkit-font-smoothing: antialiased;
+              background-color: transparent;
+              border-radius: 0px;
+              border: 1px solid transparent;
+              box-sizing: border-box;
+              color: #333333;
+              cursor: default;
+              display: block;
+              font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+              font-size: 14px;
+              font-weight: 400;
+              height: 50%;
+              outline: none;
+              padding-bottom: 0;
+              padding-left: 0;
+              padding-right: 0;
+              padding-top: 0;
+              position: relative;
+              text-align: center;
+              text-decoration: none;
+              user-select: none;
+              vertical-align: top;
+              width: 14px;
+            }
+            &::-moz-focus-inner {
+              border: 0;
+            }
+            .ms-Fabric.is-focusVisible &:focus:after {
+              border: 1px solid #ffffff;
+              bottom: 0px;
+              content: "";
+              left: 0px;
+              outline: 1px solid #666666;
+              position: absolute;
+              right: 0px;
+              top: 0px;
+              z-index: 1;
+            }
+            &:hover {
+              background-color: #eaeaea;
+              color: #004578;
+            }
+            &:active {
+              background-color: #0078d7;
+              color: #ffffff;
+            }
+            @media screen and (-ms-high-contrast: active){&:active {
+              background-color: Highlight;
+              color: HighlightText;
+            }
+        data-is-focusable={true}
+        disabled={undefined}
+        onMouseDown={[Function]}
+        onMouseLeave={[Function]}
+        onMouseUp={[Function]}
+        tabIndex={-1}
+        type="button"
+      >
+        <div
+          className=
+              ms-Button-flexContainer
+              {
+                align-items: center;
+                display: flex;
+                flex-wrap: nowrap;
+                height: 100%;
+                justify-content: center;
+              }
+        >
+          <i
+            aria-hidden={true}
+            aria-label={undefined}
+            className=
+                ms-Icon
+                ms-Button-icon
+                {
+                  display: inline-block;
+                }
+                {
+                  font-size: 6px;
+                  height: 16px;
+                  line-height: 16px;
+                  margin-bottom: 0;
+                  margin-left: 0;
+                  margin-right: 0;
+                  margin-top: 0;
+                  text-align: center;
+                  vertical-align: middle;
+                }
+            data-icon-name="ChevronDownSmall"
+            role="presentation"
+          />
+        </div>
+      </button>
+    </span>
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
index b9ce469eab5be..a8a31f50c9c95 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
@@ -3,6 +3,7 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
 import * as ReactTestUtils from 'react-dom/test-utils';
+import * as renderer from 'react-test-renderer';
 import { mount } from 'enzyme';
 import { SwatchColorPicker } from './SwatchColorPicker';
 import { IColorCellProps } from './SwatchColorPicker.Props';
@@ -24,6 +25,16 @@ const DEFAULT_OPTIONS: IColorCellProps[] = [
 
 describe('SwatchColorPicker', () => {
 
+  it('renders SwatchColorPicker correctly', () => {
+    const component = renderer.create(
+      <SwatchColorPicker
+        colorCells={ DEFAULT_OPTIONS }
+        columnCount={ 4 }
+      />);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
   it('Can render in full without being parented to a button', () => {
     const wrapper = mount(
       <SwatchColorPicker
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
new file mode 100644
index 0000000000000..03a6d50231e36
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
@@ -0,0 +1,1315 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
+<div
+  aria-describedby={undefined}
+  aria-labelledby={undefined}
+  className="ms-FocusZone ms-swatchColorPickerBodyContainer"
+  data-focuszone-id="FocusZone3"
+  onBlur={[Function]}
+  onFocus={[Function]}
+  onKeyDown={[Function]}
+  onMouseDownCapture={[Function]}
+  role="presentation"
+>
+  <table
+    aria-posinset={undefined}
+    aria-setsize={undefined}
+    id="2"
+    role="grid"
+    style={
+      Object {
+        "outline": "none",
+        "padding": "2px",
+      }
+    }
+  >
+    <tbody>
+      <tr
+        role="row"
+      >
+        <td
+          role="presentation"
+          style={
+            Object {
+              "padding": "0px",
+            }
+          }
+        >
+          <button
+            aria-describedby={null}
+            aria-label="green"
+            aria-labelledby={null}
+            aria-pressed={undefined}
+            aria-selected={false}
+            className=
+                ms-Button
+                ms-Button--action
+                ms-Button--command
+                {
+                  -moz-osx-font-smoothing: grayscale;
+                  -webkit-font-smoothing: antialiased;
+                  background-color: transparent;
+                  border-radius: 0px;
+                  border: 1px solid transparent;
+                  box-sizing: border-box;
+                  color: #333333;
+                  cursor: pointer;
+                  display: inline-block;
+                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-size: 14px;
+                  font-weight: 400;
+                  height: 40px;
+                  outline: transparent;
+                  padding-bottom: 0;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 0;
+                  position: relative;
+                  text-align: center;
+                  text-decoration: none;
+                  user-select: none;
+                  vertical-align: top;
+                }
+                &::-moz-focus-inner {
+                  border: 0;
+                }
+                .ms-Fabric.is-focusVisible &:focus:after {
+                  border: 1px solid #ffffff;
+                  bottom: 0px;
+                  content: "";
+                  left: 0px;
+                  outline: 1px solid #666666;
+                  position: absolute;
+                  right: 0px;
+                  top: 0px;
+                  z-index: 1;
+                }
+                &:hover {
+                  color: #0078d7;
+                }
+                &:hover .ms-Button-icon {
+                  color: #0078d7;
+                }
+                &:active {
+                  color: #000000;
+                }
+                &:active .ms-Button-icon {
+                  color: #004578;
+                }
+            data-index={undefined}
+            data-is-focusable={true}
+            disabled={undefined}
+            id="swatchColorPicker1-itemundefined"
+            onClick={[Function]}
+            onFocus={[Function]}
+            onMouseEnter={[Function]}
+            onMouseLeave={[Function]}
+            role="gridcell"
+            title="green"
+            type="button"
+          >
+            <div
+              className=
+                  ms-Button-flexContainer
+                  {
+                    align-items: center;
+                    display: flex;
+                    flex-wrap: nowrap;
+                    height: 100%;
+                    justify-content: flex-start;
+                  }
+            >
+              <svg
+                className="circle"
+                fill="#00ff00"
+                viewBox="0 0 20 20"
+              >
+                <circle
+                  cx="50%"
+                  cy="50%"
+                  r="50%"
+                />
+              </svg>
+            </div>
+          </button>
+        </td>
+        <td
+          role="presentation"
+          style={
+            Object {
+              "padding": "0px",
+            }
+          }
+        >
+          <button
+            aria-describedby={null}
+            aria-label="orange"
+            aria-labelledby={null}
+            aria-pressed={undefined}
+            aria-selected={false}
+            className=
+                ms-Button
+                ms-Button--action
+                ms-Button--command
+                {
+                  -moz-osx-font-smoothing: grayscale;
+                  -webkit-font-smoothing: antialiased;
+                  background-color: transparent;
+                  border-radius: 0px;
+                  border: 1px solid transparent;
+                  box-sizing: border-box;
+                  color: #333333;
+                  cursor: pointer;
+                  display: inline-block;
+                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-size: 14px;
+                  font-weight: 400;
+                  height: 40px;
+                  outline: transparent;
+                  padding-bottom: 0;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 0;
+                  position: relative;
+                  text-align: center;
+                  text-decoration: none;
+                  user-select: none;
+                  vertical-align: top;
+                }
+                &::-moz-focus-inner {
+                  border: 0;
+                }
+                .ms-Fabric.is-focusVisible &:focus:after {
+                  border: 1px solid #ffffff;
+                  bottom: 0px;
+                  content: "";
+                  left: 0px;
+                  outline: 1px solid #666666;
+                  position: absolute;
+                  right: 0px;
+                  top: 0px;
+                  z-index: 1;
+                }
+                &:hover {
+                  color: #0078d7;
+                }
+                &:hover .ms-Button-icon {
+                  color: #0078d7;
+                }
+                &:active {
+                  color: #000000;
+                }
+                &:active .ms-Button-icon {
+                  color: #004578;
+                }
+            data-index={undefined}
+            data-is-focusable={true}
+            disabled={undefined}
+            id="swatchColorPicker1-itemundefined"
+            onClick={[Function]}
+            onFocus={[Function]}
+            onMouseEnter={[Function]}
+            onMouseLeave={[Function]}
+            role="gridcell"
+            title="orange"
+            type="button"
+          >
+            <div
+              className=
+                  ms-Button-flexContainer
+                  {
+                    align-items: center;
+                    display: flex;
+                    flex-wrap: nowrap;
+                    height: 100%;
+                    justify-content: flex-start;
+                  }
+            >
+              <svg
+                className="circle"
+                fill="#ffa500"
+                viewBox="0 0 20 20"
+              >
+                <circle
+                  cx="50%"
+                  cy="50%"
+                  r="50%"
+                />
+              </svg>
+            </div>
+          </button>
+        </td>
+        <td
+          role="presentation"
+          style={
+            Object {
+              "padding": "0px",
+            }
+          }
+        >
+          <button
+            aria-describedby={null}
+            aria-label="blue"
+            aria-labelledby={null}
+            aria-pressed={undefined}
+            aria-selected={false}
+            className=
+                ms-Button
+                ms-Button--action
+                ms-Button--command
+                {
+                  -moz-osx-font-smoothing: grayscale;
+                  -webkit-font-smoothing: antialiased;
+                  background-color: transparent;
+                  border-radius: 0px;
+                  border: 1px solid transparent;
+                  box-sizing: border-box;
+                  color: #333333;
+                  cursor: pointer;
+                  display: inline-block;
+                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-size: 14px;
+                  font-weight: 400;
+                  height: 40px;
+                  outline: transparent;
+                  padding-bottom: 0;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 0;
+                  position: relative;
+                  text-align: center;
+                  text-decoration: none;
+                  user-select: none;
+                  vertical-align: top;
+                }
+                &::-moz-focus-inner {
+                  border: 0;
+                }
+                .ms-Fabric.is-focusVisible &:focus:after {
+                  border: 1px solid #ffffff;
+                  bottom: 0px;
+                  content: "";
+                  left: 0px;
+                  outline: 1px solid #666666;
+                  position: absolute;
+                  right: 0px;
+                  top: 0px;
+                  z-index: 1;
+                }
+                &:hover {
+                  color: #0078d7;
+                }
+                &:hover .ms-Button-icon {
+                  color: #0078d7;
+                }
+                &:active {
+                  color: #000000;
+                }
+                &:active .ms-Button-icon {
+                  color: #004578;
+                }
+            data-index={undefined}
+            data-is-focusable={true}
+            disabled={undefined}
+            id="swatchColorPicker1-itemundefined"
+            onClick={[Function]}
+            onFocus={[Function]}
+            onMouseEnter={[Function]}
+            onMouseLeave={[Function]}
+            role="gridcell"
+            title="blue"
+            type="button"
+          >
+            <div
+              className=
+                  ms-Button-flexContainer
+                  {
+                    align-items: center;
+                    display: flex;
+                    flex-wrap: nowrap;
+                    height: 100%;
+                    justify-content: flex-start;
+                  }
+            >
+              <svg
+                className="circle"
+                fill="#0000ff"
+                viewBox="0 0 20 20"
+              >
+                <circle
+                  cx="50%"
+                  cy="50%"
+                  r="50%"
+                />
+              </svg>
+            </div>
+          </button>
+        </td>
+        <td
+          role="presentation"
+          style={
+            Object {
+              "padding": "0px",
+            }
+          }
+        >
+          <button
+            aria-describedby={null}
+            aria-label="red"
+            aria-labelledby={null}
+            aria-pressed={undefined}
+            aria-selected={false}
+            className=
+                ms-Button
+                ms-Button--action
+                ms-Button--command
+                {
+                  -moz-osx-font-smoothing: grayscale;
+                  -webkit-font-smoothing: antialiased;
+                  background-color: transparent;
+                  border-radius: 0px;
+                  border: 1px solid transparent;
+                  box-sizing: border-box;
+                  color: #333333;
+                  cursor: pointer;
+                  display: inline-block;
+                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-size: 14px;
+                  font-weight: 400;
+                  height: 40px;
+                  outline: transparent;
+                  padding-bottom: 0;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 0;
+                  position: relative;
+                  text-align: center;
+                  text-decoration: none;
+                  user-select: none;
+                  vertical-align: top;
+                }
+                &::-moz-focus-inner {
+                  border: 0;
+                }
+                .ms-Fabric.is-focusVisible &:focus:after {
+                  border: 1px solid #ffffff;
+                  bottom: 0px;
+                  content: "";
+                  left: 0px;
+                  outline: 1px solid #666666;
+                  position: absolute;
+                  right: 0px;
+                  top: 0px;
+                  z-index: 1;
+                }
+                &:hover {
+                  color: #0078d7;
+                }
+                &:hover .ms-Button-icon {
+                  color: #0078d7;
+                }
+                &:active {
+                  color: #000000;
+                }
+                &:active .ms-Button-icon {
+                  color: #004578;
+                }
+            data-index={undefined}
+            data-is-focusable={true}
+            disabled={undefined}
+            id="swatchColorPicker1-itemundefined"
+            onClick={[Function]}
+            onFocus={[Function]}
+            onMouseEnter={[Function]}
+            onMouseLeave={[Function]}
+            role="gridcell"
+            title="red"
+            type="button"
+          >
+            <div
+              className=
+                  ms-Button-flexContainer
+                  {
+                    align-items: center;
+                    display: flex;
+                    flex-wrap: nowrap;
+                    height: 100%;
+                    justify-content: flex-start;
+                  }
+            >
+              <svg
+                className="circle"
+                fill="#ff0000"
+                viewBox="0 0 20 20"
+              >
+                <circle
+                  cx="50%"
+                  cy="50%"
+                  r="50%"
+                />
+              </svg>
+            </div>
+          </button>
+        </td>
+      </tr>
+      <tr
+        role="row"
+      >
+        <td
+          role="presentation"
+          style={
+            Object {
+              "padding": "0px",
+            }
+          }
+        >
+          <button
+            aria-describedby={null}
+            aria-label="green"
+            aria-labelledby={null}
+            aria-pressed={undefined}
+            aria-selected={false}
+            className=
+                ms-Button
+                ms-Button--action
+                ms-Button--command
+                {
+                  -moz-osx-font-smoothing: grayscale;
+                  -webkit-font-smoothing: antialiased;
+                  background-color: transparent;
+                  border-radius: 0px;
+                  border: 1px solid transparent;
+                  box-sizing: border-box;
+                  color: #333333;
+                  cursor: pointer;
+                  display: inline-block;
+                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-size: 14px;
+                  font-weight: 400;
+                  height: 40px;
+                  outline: transparent;
+                  padding-bottom: 0;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 0;
+                  position: relative;
+                  text-align: center;
+                  text-decoration: none;
+                  user-select: none;
+                  vertical-align: top;
+                }
+                &::-moz-focus-inner {
+                  border: 0;
+                }
+                .ms-Fabric.is-focusVisible &:focus:after {
+                  border: 1px solid #ffffff;
+                  bottom: 0px;
+                  content: "";
+                  left: 0px;
+                  outline: 1px solid #666666;
+                  position: absolute;
+                  right: 0px;
+                  top: 0px;
+                  z-index: 1;
+                }
+                &:hover {
+                  color: #0078d7;
+                }
+                &:hover .ms-Button-icon {
+                  color: #0078d7;
+                }
+                &:active {
+                  color: #000000;
+                }
+                &:active .ms-Button-icon {
+                  color: #004578;
+                }
+            data-index={undefined}
+            data-is-focusable={true}
+            disabled={undefined}
+            id="swatchColorPicker1-itemundefined"
+            onClick={[Function]}
+            onFocus={[Function]}
+            onMouseEnter={[Function]}
+            onMouseLeave={[Function]}
+            role="gridcell"
+            title="green"
+            type="button"
+          >
+            <div
+              className=
+                  ms-Button-flexContainer
+                  {
+                    align-items: center;
+                    display: flex;
+                    flex-wrap: nowrap;
+                    height: 100%;
+                    justify-content: flex-start;
+                  }
+            >
+              <svg
+                className="circle"
+                fill="green"
+                viewBox="0 0 20 20"
+              >
+                <circle
+                  cx="50%"
+                  cy="50%"
+                  r="50%"
+                />
+              </svg>
+            </div>
+          </button>
+        </td>
+        <td
+          role="presentation"
+          style={
+            Object {
+              "padding": "0px",
+            }
+          }
+        >
+          <button
+            aria-describedby={null}
+            aria-label="orange"
+            aria-labelledby={null}
+            aria-pressed={undefined}
+            aria-selected={false}
+            className=
+                ms-Button
+                ms-Button--action
+                ms-Button--command
+                {
+                  -moz-osx-font-smoothing: grayscale;
+                  -webkit-font-smoothing: antialiased;
+                  background-color: transparent;
+                  border-radius: 0px;
+                  border: 1px solid transparent;
+                  box-sizing: border-box;
+                  color: #333333;
+                  cursor: pointer;
+                  display: inline-block;
+                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-size: 14px;
+                  font-weight: 400;
+                  height: 40px;
+                  outline: transparent;
+                  padding-bottom: 0;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 0;
+                  position: relative;
+                  text-align: center;
+                  text-decoration: none;
+                  user-select: none;
+                  vertical-align: top;
+                }
+                &::-moz-focus-inner {
+                  border: 0;
+                }
+                .ms-Fabric.is-focusVisible &:focus:after {
+                  border: 1px solid #ffffff;
+                  bottom: 0px;
+                  content: "";
+                  left: 0px;
+                  outline: 1px solid #666666;
+                  position: absolute;
+                  right: 0px;
+                  top: 0px;
+                  z-index: 1;
+                }
+                &:hover {
+                  color: #0078d7;
+                }
+                &:hover .ms-Button-icon {
+                  color: #0078d7;
+                }
+                &:active {
+                  color: #000000;
+                }
+                &:active .ms-Button-icon {
+                  color: #004578;
+                }
+            data-index={undefined}
+            data-is-focusable={true}
+            disabled={undefined}
+            id="swatchColorPicker1-itemundefined"
+            onClick={[Function]}
+            onFocus={[Function]}
+            onMouseEnter={[Function]}
+            onMouseLeave={[Function]}
+            role="gridcell"
+            title="orange"
+            type="button"
+          >
+            <div
+              className=
+                  ms-Button-flexContainer
+                  {
+                    align-items: center;
+                    display: flex;
+                    flex-wrap: nowrap;
+                    height: 100%;
+                    justify-content: flex-start;
+                  }
+            >
+              <svg
+                className="circle"
+                fill="orange"
+                viewBox="0 0 20 20"
+              >
+                <circle
+                  cx="50%"
+                  cy="50%"
+                  r="50%"
+                />
+              </svg>
+            </div>
+          </button>
+        </td>
+        <td
+          role="presentation"
+          style={
+            Object {
+              "padding": "0px",
+            }
+          }
+        >
+          <button
+            aria-describedby={null}
+            aria-label="blue"
+            aria-labelledby={null}
+            aria-pressed={undefined}
+            aria-selected={false}
+            className=
+                ms-Button
+                ms-Button--action
+                ms-Button--command
+                {
+                  -moz-osx-font-smoothing: grayscale;
+                  -webkit-font-smoothing: antialiased;
+                  background-color: transparent;
+                  border-radius: 0px;
+                  border: 1px solid transparent;
+                  box-sizing: border-box;
+                  color: #333333;
+                  cursor: pointer;
+                  display: inline-block;
+                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-size: 14px;
+                  font-weight: 400;
+                  height: 40px;
+                  outline: transparent;
+                  padding-bottom: 0;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 0;
+                  position: relative;
+                  text-align: center;
+                  text-decoration: none;
+                  user-select: none;
+                  vertical-align: top;
+                }
+                &::-moz-focus-inner {
+                  border: 0;
+                }
+                .ms-Fabric.is-focusVisible &:focus:after {
+                  border: 1px solid #ffffff;
+                  bottom: 0px;
+                  content: "";
+                  left: 0px;
+                  outline: 1px solid #666666;
+                  position: absolute;
+                  right: 0px;
+                  top: 0px;
+                  z-index: 1;
+                }
+                &:hover {
+                  color: #0078d7;
+                }
+                &:hover .ms-Button-icon {
+                  color: #0078d7;
+                }
+                &:active {
+                  color: #000000;
+                }
+                &:active .ms-Button-icon {
+                  color: #004578;
+                }
+            data-index={undefined}
+            data-is-focusable={true}
+            disabled={undefined}
+            id="swatchColorPicker1-itemundefined"
+            onClick={[Function]}
+            onFocus={[Function]}
+            onMouseEnter={[Function]}
+            onMouseLeave={[Function]}
+            role="gridcell"
+            title="blue"
+            type="button"
+          >
+            <div
+              className=
+                  ms-Button-flexContainer
+                  {
+                    align-items: center;
+                    display: flex;
+                    flex-wrap: nowrap;
+                    height: 100%;
+                    justify-content: flex-start;
+                  }
+            >
+              <svg
+                className="circle"
+                fill="blue"
+                viewBox="0 0 20 20"
+              >
+                <circle
+                  cx="50%"
+                  cy="50%"
+                  r="50%"
+                />
+              </svg>
+            </div>
+          </button>
+        </td>
+        <td
+          role="presentation"
+          style={
+            Object {
+              "padding": "0px",
+            }
+          }
+        >
+          <button
+            aria-describedby={null}
+            aria-label="red"
+            aria-labelledby={null}
+            aria-pressed={undefined}
+            aria-selected={false}
+            className=
+                ms-Button
+                ms-Button--action
+                ms-Button--command
+                {
+                  -moz-osx-font-smoothing: grayscale;
+                  -webkit-font-smoothing: antialiased;
+                  background-color: transparent;
+                  border-radius: 0px;
+                  border: 1px solid transparent;
+                  box-sizing: border-box;
+                  color: #333333;
+                  cursor: pointer;
+                  display: inline-block;
+                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-size: 14px;
+                  font-weight: 400;
+                  height: 40px;
+                  outline: transparent;
+                  padding-bottom: 0;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 0;
+                  position: relative;
+                  text-align: center;
+                  text-decoration: none;
+                  user-select: none;
+                  vertical-align: top;
+                }
+                &::-moz-focus-inner {
+                  border: 0;
+                }
+                .ms-Fabric.is-focusVisible &:focus:after {
+                  border: 1px solid #ffffff;
+                  bottom: 0px;
+                  content: "";
+                  left: 0px;
+                  outline: 1px solid #666666;
+                  position: absolute;
+                  right: 0px;
+                  top: 0px;
+                  z-index: 1;
+                }
+                &:hover {
+                  color: #0078d7;
+                }
+                &:hover .ms-Button-icon {
+                  color: #0078d7;
+                }
+                &:active {
+                  color: #000000;
+                }
+                &:active .ms-Button-icon {
+                  color: #004578;
+                }
+            data-index={undefined}
+            data-is-focusable={true}
+            disabled={undefined}
+            id="swatchColorPicker1-itemundefined"
+            onClick={[Function]}
+            onFocus={[Function]}
+            onMouseEnter={[Function]}
+            onMouseLeave={[Function]}
+            role="gridcell"
+            title="red"
+            type="button"
+          >
+            <div
+              className=
+                  ms-Button-flexContainer
+                  {
+                    align-items: center;
+                    display: flex;
+                    flex-wrap: nowrap;
+                    height: 100%;
+                    justify-content: flex-start;
+                  }
+            >
+              <svg
+                className="circle"
+                fill="red"
+                viewBox="0 0 20 20"
+              >
+                <circle
+                  cx="50%"
+                  cy="50%"
+                  r="50%"
+                />
+              </svg>
+            </div>
+          </button>
+        </td>
+      </tr>
+      <tr
+        role="row"
+      >
+        <td
+          role="presentation"
+          style={
+            Object {
+              "padding": "0px",
+            }
+          }
+        >
+          <button
+            aria-describedby={null}
+            aria-label="black"
+            aria-labelledby={null}
+            aria-pressed={undefined}
+            aria-selected={false}
+            className=
+                ms-Button
+                ms-Button--action
+                ms-Button--command
+                {
+                  -moz-osx-font-smoothing: grayscale;
+                  -webkit-font-smoothing: antialiased;
+                  background-color: transparent;
+                  border-radius: 0px;
+                  border: 1px solid transparent;
+                  box-sizing: border-box;
+                  color: #333333;
+                  cursor: pointer;
+                  display: inline-block;
+                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-size: 14px;
+                  font-weight: 400;
+                  height: 40px;
+                  outline: transparent;
+                  padding-bottom: 0;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 0;
+                  position: relative;
+                  text-align: center;
+                  text-decoration: none;
+                  user-select: none;
+                  vertical-align: top;
+                }
+                &::-moz-focus-inner {
+                  border: 0;
+                }
+                .ms-Fabric.is-focusVisible &:focus:after {
+                  border: 1px solid #ffffff;
+                  bottom: 0px;
+                  content: "";
+                  left: 0px;
+                  outline: 1px solid #666666;
+                  position: absolute;
+                  right: 0px;
+                  top: 0px;
+                  z-index: 1;
+                }
+                &:hover {
+                  color: #0078d7;
+                }
+                &:hover .ms-Button-icon {
+                  color: #0078d7;
+                }
+                &:active {
+                  color: #000000;
+                }
+                &:active .ms-Button-icon {
+                  color: #004578;
+                }
+            data-index={undefined}
+            data-is-focusable={true}
+            disabled={undefined}
+            id="swatchColorPicker1-itemundefined"
+            onClick={[Function]}
+            onFocus={[Function]}
+            onMouseEnter={[Function]}
+            onMouseLeave={[Function]}
+            role="gridcell"
+            title="black"
+            type="button"
+          >
+            <div
+              className=
+                  ms-Button-flexContainer
+                  {
+                    align-items: center;
+                    display: flex;
+                    flex-wrap: nowrap;
+                    height: 100%;
+                    justify-content: flex-start;
+                  }
+            >
+              <svg
+                className="circle"
+                fill="black"
+                viewBox="0 0 20 20"
+              >
+                <circle
+                  cx="50%"
+                  cy="50%"
+                  r="50%"
+                />
+              </svg>
+            </div>
+          </button>
+        </td>
+        <td
+          role="presentation"
+          style={
+            Object {
+              "padding": "0px",
+            }
+          }
+        >
+          <button
+            aria-describedby={null}
+            aria-label="grey"
+            aria-labelledby={null}
+            aria-pressed={undefined}
+            aria-selected={false}
+            className=
+                ms-Button
+                ms-Button--action
+                ms-Button--command
+                {
+                  -moz-osx-font-smoothing: grayscale;
+                  -webkit-font-smoothing: antialiased;
+                  background-color: transparent;
+                  border-radius: 0px;
+                  border: 1px solid transparent;
+                  box-sizing: border-box;
+                  color: #333333;
+                  cursor: pointer;
+                  display: inline-block;
+                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-size: 14px;
+                  font-weight: 400;
+                  height: 40px;
+                  outline: transparent;
+                  padding-bottom: 0;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 0;
+                  position: relative;
+                  text-align: center;
+                  text-decoration: none;
+                  user-select: none;
+                  vertical-align: top;
+                }
+                &::-moz-focus-inner {
+                  border: 0;
+                }
+                .ms-Fabric.is-focusVisible &:focus:after {
+                  border: 1px solid #ffffff;
+                  bottom: 0px;
+                  content: "";
+                  left: 0px;
+                  outline: 1px solid #666666;
+                  position: absolute;
+                  right: 0px;
+                  top: 0px;
+                  z-index: 1;
+                }
+                &:hover {
+                  color: #0078d7;
+                }
+                &:hover .ms-Button-icon {
+                  color: #0078d7;
+                }
+                &:active {
+                  color: #000000;
+                }
+                &:active .ms-Button-icon {
+                  color: #004578;
+                }
+            data-index={undefined}
+            data-is-focusable={true}
+            disabled={undefined}
+            id="swatchColorPicker1-itemundefined"
+            onClick={[Function]}
+            onFocus={[Function]}
+            onMouseEnter={[Function]}
+            onMouseLeave={[Function]}
+            role="gridcell"
+            title="grey"
+            type="button"
+          >
+            <div
+              className=
+                  ms-Button-flexContainer
+                  {
+                    align-items: center;
+                    display: flex;
+                    flex-wrap: nowrap;
+                    height: 100%;
+                    justify-content: flex-start;
+                  }
+            >
+              <svg
+                className="circle"
+                fill="grey"
+                viewBox="0 0 20 20"
+              >
+                <circle
+                  cx="50%"
+                  cy="50%"
+                  r="50%"
+                />
+              </svg>
+            </div>
+          </button>
+        </td>
+        <td
+          role="presentation"
+          style={
+            Object {
+              "padding": "0px",
+            }
+          }
+        >
+          <button
+            aria-describedby={null}
+            aria-label="purple"
+            aria-labelledby={null}
+            aria-pressed={undefined}
+            aria-selected={false}
+            className=
+                ms-Button
+                ms-Button--action
+                ms-Button--command
+                {
+                  -moz-osx-font-smoothing: grayscale;
+                  -webkit-font-smoothing: antialiased;
+                  background-color: transparent;
+                  border-radius: 0px;
+                  border: 1px solid transparent;
+                  box-sizing: border-box;
+                  color: #333333;
+                  cursor: pointer;
+                  display: inline-block;
+                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-size: 14px;
+                  font-weight: 400;
+                  height: 40px;
+                  outline: transparent;
+                  padding-bottom: 0;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 0;
+                  position: relative;
+                  text-align: center;
+                  text-decoration: none;
+                  user-select: none;
+                  vertical-align: top;
+                }
+                &::-moz-focus-inner {
+                  border: 0;
+                }
+                .ms-Fabric.is-focusVisible &:focus:after {
+                  border: 1px solid #ffffff;
+                  bottom: 0px;
+                  content: "";
+                  left: 0px;
+                  outline: 1px solid #666666;
+                  position: absolute;
+                  right: 0px;
+                  top: 0px;
+                  z-index: 1;
+                }
+                &:hover {
+                  color: #0078d7;
+                }
+                &:hover .ms-Button-icon {
+                  color: #0078d7;
+                }
+                &:active {
+                  color: #000000;
+                }
+                &:active .ms-Button-icon {
+                  color: #004578;
+                }
+            data-index={undefined}
+            data-is-focusable={true}
+            disabled={undefined}
+            id="swatchColorPicker1-itemundefined"
+            onClick={[Function]}
+            onFocus={[Function]}
+            onMouseEnter={[Function]}
+            onMouseLeave={[Function]}
+            role="gridcell"
+            title="purple"
+            type="button"
+          >
+            <div
+              className=
+                  ms-Button-flexContainer
+                  {
+                    align-items: center;
+                    display: flex;
+                    flex-wrap: nowrap;
+                    height: 100%;
+                    justify-content: flex-start;
+                  }
+            >
+              <svg
+                className="circle"
+                fill="purple"
+                viewBox="0 0 20 20"
+              >
+                <circle
+                  cx="50%"
+                  cy="50%"
+                  r="50%"
+                />
+              </svg>
+            </div>
+          </button>
+        </td>
+        <td
+          role="presentation"
+          style={
+            Object {
+              "padding": "0px",
+            }
+          }
+        >
+          <button
+            aria-describedby={null}
+            aria-label="yellow"
+            aria-labelledby={null}
+            aria-pressed={undefined}
+            aria-selected={false}
+            className=
+                ms-Button
+                ms-Button--action
+                ms-Button--command
+                {
+                  -moz-osx-font-smoothing: grayscale;
+                  -webkit-font-smoothing: antialiased;
+                  background-color: transparent;
+                  border-radius: 0px;
+                  border: 1px solid transparent;
+                  box-sizing: border-box;
+                  color: #333333;
+                  cursor: pointer;
+                  display: inline-block;
+                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-size: 14px;
+                  font-weight: 400;
+                  height: 40px;
+                  outline: transparent;
+                  padding-bottom: 0;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 0;
+                  position: relative;
+                  text-align: center;
+                  text-decoration: none;
+                  user-select: none;
+                  vertical-align: top;
+                }
+                &::-moz-focus-inner {
+                  border: 0;
+                }
+                .ms-Fabric.is-focusVisible &:focus:after {
+                  border: 1px solid #ffffff;
+                  bottom: 0px;
+                  content: "";
+                  left: 0px;
+                  outline: 1px solid #666666;
+                  position: absolute;
+                  right: 0px;
+                  top: 0px;
+                  z-index: 1;
+                }
+                &:hover {
+                  color: #0078d7;
+                }
+                &:hover .ms-Button-icon {
+                  color: #0078d7;
+                }
+                &:active {
+                  color: #000000;
+                }
+                &:active .ms-Button-icon {
+                  color: #004578;
+                }
+            data-index={undefined}
+            data-is-focusable={true}
+            disabled={undefined}
+            id="swatchColorPicker1-itemundefined"
+            onClick={[Function]}
+            onFocus={[Function]}
+            onMouseEnter={[Function]}
+            onMouseLeave={[Function]}
+            role="gridcell"
+            title="yellow"
+            type="button"
+          >
+            <div
+              className=
+                  ms-Button-flexContainer
+                  {
+                    align-items: center;
+                    display: flex;
+                    flex-wrap: nowrap;
+                    height: 100%;
+                    justify-content: flex-start;
+                  }
+            >
+              <svg
+                className="circle"
+                fill="yellow"
+                viewBox="0 0 20 20"
+              >
+                <circle
+                  cx="50%"
+                  cy="50%"
+                  r="50%"
+                />
+              </svg>
+            </div>
+          </button>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.test.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.test.tsx
index 4fea19400bc9c..963a3cc0d6c49 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.test.tsx
@@ -4,10 +4,22 @@ import * as React from 'react';
 
 import * as ReactDOM from 'react-dom';
 import * as ReactTestUtils from 'react-dom/test-utils';
+import * as renderer from 'react-test-renderer';
+import { TeachingBubble } from './TeachingBubble';
 import { TeachingBubbleContent } from './TeachingBubbleContent';
 
 describe('TeachingBubble', () => {
 
+  it('renders TeachingBubble correctly', () => {
+    const component = renderer.create(<TeachingBubble>Content</TeachingBubble>);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+
+    const componentContent = renderer.create(<TeachingBubbleContent headline='Title'>Content</TeachingBubbleContent>);
+    let treeContent = componentContent.toJSON();
+    expect(treeContent).toMatchSnapshot();
+  });
+
   // <Layer> components will lead ReactDOM.findDOMNode(test_component) return null, so the test is based on the teaching bubble content.
   it('renders a label', () => {
     let component = ReactTestUtils.renderIntoDocument(
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/__snapshots__/TeachingBubble.test.tsx.snap b/packages/office-ui-fabric-react/src/components/TeachingBubble/__snapshots__/TeachingBubble.test.tsx.snap
new file mode 100644
index 0000000000000..5cd04d29e0032
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/__snapshots__/TeachingBubble.test.tsx.snap
@@ -0,0 +1,36 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`TeachingBubble renders TeachingBubble correctly 1`] = `
+<span
+  className="ms-Layer"
+/>
+`;
+
+exports[`TeachingBubble renders TeachingBubble correctly 2`] = `
+<div
+  className="ms-TeachingBubble-content"
+>
+  <div
+    className="ms-TeachingBubble-bodycontent"
+  >
+    <div
+      className="ms-TeachingBubble-header ms-TeachingBubble-header--large undefined"
+    >
+      <p
+        className="ms-TeachingBubble-headline"
+      >
+        Title
+      </p>
+    </div>
+    <div
+      className="ms-TeachingBubble-body"
+    >
+      <p
+        className="ms-TeachingBubble-subText"
+      >
+        Content
+      </p>
+    </div>
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
index b76889b625932..c43d730a83c59 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
@@ -2,6 +2,7 @@ import { Promise } from 'es6-promise';
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import * as ReactTestUtils from 'react-dom/test-utils';
+import * as renderer from 'react-test-renderer';
 
 import { TextField } from './TextField';
 
@@ -23,6 +24,12 @@ describe('TextField', () => {
     return new Promise<void>((resolve) => setTimeout(resolve, millisecond));
   }
 
+  it('renders TextField correctly', () => {
+    const component = renderer.create(<TextField label='Label' />);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
   it('should render label and value to input element', () => {
     const exampleLabel: string = 'this is label';
     const exampleValue: string = 'this is value';
diff --git a/packages/office-ui-fabric-react/src/components/TextField/__snapshots__/TextField.test.tsx.snap b/packages/office-ui-fabric-react/src/components/TextField/__snapshots__/TextField.test.tsx.snap
new file mode 100644
index 0000000000000..5fb70d8366cdf
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/TextField/__snapshots__/TextField.test.tsx.snap
@@ -0,0 +1,52 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`TextField renders TextField correctly 1`] = `
+<div
+  className="ms-TextField"
+>
+  <div
+    className="ms-TextField-wrapper"
+  >
+    <label
+      className=
+          ms-Label
+          {
+            box-shadow: none;
+            box-sizing: border-box;
+            color: #333333;
+            display: block;
+            margin-bottom: 0px;
+            margin-left: 0px;
+            margin-right: 0px;
+            margin-top: 0px;
+            overflow-wrap: break-word;
+            padding-bottom: 5px;
+            padding-left: 0;
+            padding-right: 0;
+            padding-top: 5px;
+            word-wrap: break-word;
+          }
+      htmlFor="TextField0"
+    >
+      Label
+    </label>
+    <div
+      className="ms-TextField-fieldGroup"
+    >
+      <input
+        aria-describedby={null}
+        aria-invalid={false}
+        aria-label={undefined}
+        className="ms-TextField-field"
+        id="TextField0"
+        onBlur={[Function]}
+        onChange={[Function]}
+        onFocus={[Function]}
+        onInput={[Function]}
+        type="text"
+        value=""
+      />
+    </div>
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
index bc2cea2dc6304..a99bed449e66b 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
@@ -4,6 +4,7 @@ import * as React from 'react';
 import { mount } from 'enzyme';
 import * as ReactDOM from 'react-dom';
 import * as ReactTestUtils from 'react-dom/test-utils';
+import * as renderer from 'react-test-renderer';
 import * as sinon from 'sinon';
 
 import { Toggle } from './Toggle';
@@ -22,6 +23,16 @@ describe('Toggle', () => {
     expect(labelElement.textContent).toEqual('Label');
   });
 
+  it('renders toggle correctly', () => {
+    const component = renderer.create(
+      <Toggle
+        label='Label'
+      />
+    );
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
   it('renders aria-label', () => {
     let component = ReactTestUtils.renderIntoDocument(
       <Toggle
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap
new file mode 100644
index 0000000000000..a54b964b8dac9
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap
@@ -0,0 +1,112 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Toggle renders toggle correctly 1`] = `
+<div
+  className=
+      ms-Toggle
+      is-enabled
+      {
+        margin-bottom: 8px;
+      }
+>
+  <label
+    className=
+        ms-Label
+        ms-Toggle-label
+
+        {
+          box-shadow: none;
+          box-sizing: border-box;
+          color: #333333;
+          display: block;
+          margin-bottom: 0px;
+          margin-left: 0px;
+          margin-right: 0px;
+          margin-top: 0px;
+          overflow-wrap: break-word;
+          padding-bottom: 5px;
+          padding-left: 0;
+          padding-right: 0;
+          padding-top: 5px;
+          word-wrap: break-word;
+        }
+    htmlFor="Toggle1"
+  >
+    Label
+  </label>
+  <div
+    className=
+        ms-Toggle-innerContainer
+        {
+          display: inline-flex;
+          position: relative;
+        }
+  >
+    <button
+      aria-disabled={undefined}
+      aria-label={undefined}
+      aria-pressed={false}
+      className=
+          ms-Toggle-background
+          {
+            background: #ffffff;
+            border-color: #a6a6a6;
+            border-radius: 1em;
+            border-style: solid;
+            border-width: 1px;
+            box-sizing: border-box;
+            cursor: pointer;
+            font-size: 20px;
+            height: 1em;
+            line-height: 1em;
+            outline: transparent;
+            position: relative;
+            transition: all 0.1s ease;
+            width: 2.2em;
+          }
+          &::-moz-focus-inner {
+            border: 0;
+          }
+          .ms-Fabric.is-focusVisible &:focus:after {
+            border: 1px solid #ffffff;
+            bottom: -2px;
+            content: "";
+            left: -2px;
+            outline: 1px solid #666666;
+            position: absolute;
+            right: -2px;
+            top: -2px;
+            z-index: 1;
+          }
+          &:hover {
+            border-color: #333333;
+          }
+      data-is-focusable={true}
+      disabled={undefined}
+      id="Toggle1"
+      onChange={[Function]}
+      onClick={[Function]}
+      type="button"
+    >
+      <div
+        className=
+            ms-Toggle-thumb
+            {
+              background-color: #333333;
+              border-color: transparent;
+              border-radius: .5em;
+              border-style: solid;
+              border-width: .27em;
+              box-sizing: border-box;
+              height: .5em;
+              left: .2em;
+              position: absolute;
+              top: .2em;
+              transition: all 0.1s ease;
+              width: .5em;
+            }
+      />
+    </button>
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
index f3f883a835bde..f070596f8543a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
@@ -3,6 +3,7 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import * as ReactTestUtils from 'react-dom/test-utils';
 /* tslint:enable:no-unused-variable */
+import * as renderer from 'react-test-renderer';
 
 import { TagPicker, ITag } from './TagPicker/TagPicker';
 import { IBasePickerProps } from './BasePicker.Props';
@@ -53,6 +54,19 @@ describe('Pickers', () => {
           { basicRenderer(props) }
         </div>
       );
+
+    it('renders BasePicker correctly', () => {
+      const component = renderer.create(
+        <BasePickerWithType
+          onResolveSuggestions={ onResolveSuggestions }
+          onRenderItem={ onRenderItem }
+          onRenderSuggestionsItem={ basicSuggestionRenderer }
+        />
+      );
+      let tree = component.toJSON();
+      expect(tree).toMatchSnapshot();
+    });
+
     it('can provide custom renderers', () => {
       let root = document.createElement('div');
       document.body.appendChild(root);
@@ -154,6 +168,15 @@ describe('Pickers', () => {
   });
 
   describe('TagPicker', () => {
+    it('renders TagPicker correctly', () => {
+      const component = renderer.create(
+        <TagPicker
+          onResolveSuggestions={ onResolveSuggestions }
+        />
+      );
+      let tree = component.toJSON();
+      expect(tree).toMatchSnapshot();
+    });
 
     it('can search for and select tags', () => {
       let root = document.createElement('div');
diff --git a/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
new file mode 100644
index 0000000000000..5f82ce3c5d212
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
@@ -0,0 +1,125 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Pickers BasePicker renders BasePicker correctly 1`] = `
+<div
+  className="ms-BasePicker"
+  onKeyDown={[Function]}
+>
+  <div
+    aria-describedby={undefined}
+    aria-labelledby={undefined}
+    className="ms-FocusZone"
+    data-focuszone-id="FocusZone0"
+    onFocus={[Function]}
+    onKeyDown={[Function]}
+    onMouseDownCapture={[Function]}
+    role="presentation"
+  >
+    <div
+      aria-live="assertive"
+      className={undefined}
+      id="selected-suggestion-alert"
+      role="alert"
+    >
+       
+    </div>
+    <div
+      className="ms-SelectionZone"
+      onClick={[Function]}
+      onContextMenu={[Function]}
+      onDoubleClick={[Function]}
+      onFocusCapture={[Function]}
+      onKeyDown={[Function]}
+      onKeyDownCapture={[Function]}
+      onMouseDown={[Function]}
+      onMouseDownCapture={[Function]}
+      role="presentation"
+    >
+      <div
+        className="ms-BasePicker-text"
+        role="list"
+      >
+        <input
+          aria-activedescendant="sug--1"
+          aria-controls="selected-suggestion-alert"
+          aria-expanded="true"
+          aria-haspopup="true"
+          aria-owns="suggestion-list"
+          autoCapitalize="off"
+          autoComplete="off"
+          className="ms-BasePicker-input"
+          disabled={undefined}
+          onChange={[Function]}
+          onClick={[Function]}
+          onFocus={[Function]}
+          onKeyDown={[Function]}
+          role="combobox"
+          value=""
+        />
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`Pickers TagPicker renders TagPicker correctly 1`] = `
+<div
+  className="ms-BasePicker"
+  onKeyDown={[Function]}
+>
+  <div
+    aria-describedby={undefined}
+    aria-labelledby={undefined}
+    className="ms-FocusZone"
+    data-focuszone-id="FocusZone17"
+    onFocus={[Function]}
+    onKeyDown={[Function]}
+    onMouseDownCapture={[Function]}
+    role="presentation"
+  >
+    <div
+      aria-live="assertive"
+      className={undefined}
+      id="selected-suggestion-alert"
+      role="alert"
+    >
+       
+    </div>
+    <div
+      className="ms-SelectionZone"
+      onClick={[Function]}
+      onContextMenu={[Function]}
+      onDoubleClick={[Function]}
+      onFocusCapture={[Function]}
+      onKeyDown={[Function]}
+      onKeyDownCapture={[Function]}
+      onMouseDown={[Function]}
+      onMouseDownCapture={[Function]}
+      role="presentation"
+    >
+      <div
+        className="ms-BasePicker-text"
+        role="list"
+      >
+        <input
+          aria-activedescendant="sug--1"
+          aria-controls="selected-suggestion-alert"
+          aria-expanded="true"
+          aria-haspopup="true"
+          aria-owns="suggestion-list"
+          autoCapitalize="off"
+          autoComplete="off"
+          className="ms-BasePicker-input"
+          disabled={undefined}
+          onChange={[Function]}
+          onClick={[Function]}
+          onFocus={[Function]}
+          onKeyDown={[Function]}
+          role="combobox"
+          value=""
+        />
+      </div>
+    </div>
+  </div>
+</div>
+`;

From 378de1a305bf961e9a416d3256a880620b134b95 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Tue, 17 Oct 2017 21:33:31 -0700
Subject: [PATCH 0876/1641] vr-tests: Update Storybook config to prevent log
 spam in Travis (#3143)

* Update webpack config to reduce logging

* Update with maxModules

* Update config

* Update webpack config to hide spam

* Remove screener -debug arg to reduce log spam

* Clean up config to be more future-proof
---
 apps/vr-tests/.storybook/webpack.config.js | 83 ++++++++++++----------
 apps/vr-tests/package.json                 |  2 +-
 2 files changed, 47 insertions(+), 38 deletions(-)

diff --git a/apps/vr-tests/.storybook/webpack.config.js b/apps/vr-tests/.storybook/webpack.config.js
index e1f313a9edc64..e5848846fc1bd 100644
--- a/apps/vr-tests/.storybook/webpack.config.js
+++ b/apps/vr-tests/.storybook/webpack.config.js
@@ -1,40 +1,49 @@
 /*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
 
-module.exports = {
-  module: {
-    rules: [
-      {
-        test: /.css$/,
-        loaders: ['style-loader', 'css-loader'],
-      },
-      {
-        test: /\.tsx?$/,
-        exclude: /node_modules/,
-        loaders: ['babel-loader', 'awesome-typescript-loader'],
-      },
-      {
-        test: /\.(gif|jpg|jpeg|png|svg)$/,
-        loader: 'file-loader?name=[name].[ext]',
-      },
-      {
-        test: /\.(woff|woff2|ttf)$/,
-        loader: 'file-loader?name=[name].[ext]',
-      },
-      {
-        test: /\.md$/,
-        loader: 'raw-loader',
-      },
-    ],
-  },
-  resolve: {
-    // This replaces Storybook's resolve.extensions so we need to provide all of these
-    extensions: [
-      '.js',
-      '.json',
-      '.jsx',
-      '.ts',
-      '.tsx',
-      '.md',
-    ],
-  },
+const path = require('path');
+
+module.exports = (storybookBaseConfig, configType) => {
+
+  const rules = [
+    {
+      test: /.css$/,
+      loaders: ['style-loader', 'css-loader'],
+    },
+    {
+      test: /\.tsx?$/,
+      exclude: /node_modules/,
+      loaders: ['babel-loader', 'awesome-typescript-loader'],
+    },
+    {
+      test: /\.(gif|jpg|jpeg|png|svg)$/,
+      loader: 'file-loader?name=[name].[ext]',
+    },
+    {
+      test: /\.(woff|woff2|ttf)$/,
+      loader: 'file-loader?name=[name].[ext]',
+    },
+    {
+      test: /\.md$/,
+      loader: 'raw-loader',
+    },
+  ];
+
+  // This replaces Storybook's resolve.extensions so we need to provide all of these
+  const extensions = [
+    '.js',
+    '.json',
+    '.jsx',
+    '.ts',
+    '.tsx',
+    '.md',
+  ];
+
+  rules.forEach(rule => storybookBaseConfig.module.rules.push(rule));
+  extensions.forEach(ext => storybookBaseConfig.resolve.extensions.push(ext));
+
+  // Remove this plugin because it spams Travis log
+  storybookBaseConfig.plugins = storybookBaseConfig.plugins.filter(plugin => plugin.constructor.name !== 'ProgressPlugin');
+
+  // Return the altered config
+  return storybookBaseConfig;
 };
\ No newline at end of file
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 90f397496feb8..3a77476f4bdc9 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -6,7 +6,7 @@
   "scripts": {
     "build": "",
     "clean": "",
-    "screener": "screener-storybook --conf screener.config.js --debug",
+    "screener": "screener-storybook --conf screener.config.js",
     "screener:local": "screener-storybook --conf screener.local.config.js --debug",
     "start": "start-storybook --port 5555"
   },

From 5ee04de940661f1d3b32197aa6b8b11a158e6a72 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 17 Oct 2017 21:34:23 -0700
Subject: [PATCH 0877/1641]  Updated fabric react's fabric core package version
 (#3126)

* Updated fabric react's fabric core package version

* Added change file

* Fixed indentation issue
---
 .../fabric-react-core_2017-10-16-19-47.json           | 11 +++++++++++
 common/config/rush/npm-shrinkwrap.json                |  2 +-
 packages/office-ui-fabric-react/package.json          |  2 +-
 3 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fabric-react-core_2017-10-16-19-47.json

diff --git a/common/changes/office-ui-fabric-react/fabric-react-core_2017-10-16-19-47.json b/common/changes/office-ui-fabric-react/fabric-react-core_2017-10-16-19-47.json
new file mode 100644
index 0000000000000..c9f9cd59b0c2c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fabric-react-core_2017-10-16-19-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Updated the Fabric Core package version",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 6e3b753313bfe..8e47e13d1a521 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -1411,7 +1411,7 @@
           "bundled": true
         },
         "office-ui-fabric-core": {
-          "version": "7.3.0",
+          "version": "9.0.0",
           "bundled": true
         },
         "os-browserify": {
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index b990e1a808988..fda3de33c9d56 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -34,7 +34,7 @@
     "es6-map": "^0.1.5",
     "es6-weak-map": "^2.0.2",
     "highlight.js": "^9.6.0",
-    "office-ui-fabric-core": ">=7.1.2 <8.0.0",
+    "office-ui-fabric-core": ">=9.0.0 <10.0.0",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",

From ffd057952717cffcf356f308699f2ed88139a00b Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 17 Oct 2017 21:37:34 -0700
Subject: [PATCH 0878/1641] Website: Fix in page navigation for Chrome and
 Firefox (#3139)

* Fixed broken in page nav for firefox and chrome

* Added change file
---
 .../PageHeaderLink/PageHeaderLink.tsx           | 17 +++++++++--------
 .../in-page-nav_2017-10-17-18-48.json           | 11 +++++++++++
 2 files changed, 20 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/in-page-nav_2017-10-17-18-48.json

diff --git a/apps/fabric-website/src/components/PageHeaderLink/PageHeaderLink.tsx b/apps/fabric-website/src/components/PageHeaderLink/PageHeaderLink.tsx
index 7df2fe10da8d4..9885099a843eb 100644
--- a/apps/fabric-website/src/components/PageHeaderLink/PageHeaderLink.tsx
+++ b/apps/fabric-website/src/components/PageHeaderLink/PageHeaderLink.tsx
@@ -44,26 +44,27 @@ export class PageHeaderLink extends React.Component<IPageHeaderLink, {}> {
   private _eventListener(event) {
     event.preventDefault();
     history.pushState({}, '', this._els.link.getAttribute('href'));
+    let navigatorUserAgent = navigator.userAgent.toLowerCase();
     let hash = this._extractAnchorLink(window.location.hash);
-    if (navigator.userAgent.toLowerCase().indexOf('firefox') > -1) {
+    if (navigatorUserAgent.indexOf('firefox') > -1) {
       hash = decodeURI(hash);
     }
     let el = document.getElementById(hash);
     let elRect = el.getBoundingClientRect();
     let bodySTop = document.body.scrollTop;
-    let currentScrollPosition;
+    let currentScrollPosition = bodySTop + elRect.top;
+    let scrollTarget: HTMLBodyElement | HTMLHtmlElement = document.querySelector('body');
 
-    currentScrollPosition = bodySTop + elRect.top;
+    if (navigatorUserAgent.indexOf('firefox') > -1 || navigatorUserAgent.indexOf('chrome') > -1 && navigatorUserAgent.indexOf('edge') < 0) {
+      currentScrollPosition += window.scrollY;
+      scrollTarget = document.querySelector('html');
+    }
 
     if (currentScrollPosition < 0) {
       currentScrollPosition = 0;
     }
 
-    let scrollTarget = (navigator.userAgent.toLowerCase().indexOf('firefox') > -1) ?
-      document.querySelector('html') :
-      document.querySelector('body');
-
-    Animate.scrollTo(scrollTarget as HTMLElement, {
+    Animate.scrollTo(scrollTarget, {
       duration: 0.3,
       top: currentScrollPosition - this.scrollDistance
     });
diff --git a/common/changes/@uifabric/fabric-website/in-page-nav_2017-10-17-18-48.json b/common/changes/@uifabric/fabric-website/in-page-nav_2017-10-17-18-48.json
new file mode 100644
index 0000000000000..c267c8420e809
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/in-page-nav_2017-10-17-18-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Fixed in page navigation for Chrome and Firefox.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From 5c408b0984d9d83323a2b3b22aa50b3768c2d711 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 17 Oct 2017 21:40:24 -0700
Subject: [PATCH 0879/1641] Added implementation examples to ButtonPage,
 included some related style fixes (#3132)

* Improvements to TextField page spacing

* Button implementation examples

* Added change files

* Removed spaces from ids
---
 .../src/components/ComponentPage/ComponentPage.scss   |  4 ++++
 .../src/pages/Components/BreadcrumbComponentPage.tsx  |  2 +-
 .../src/pages/Components/ButtonComponentPage.tsx      |  6 +++++-
 .../src/pages/Components/CalloutComponentPage.tsx     |  2 +-
 .../src/pages/Components/CheckboxComponentPage.tsx    |  2 +-
 .../src/pages/Components/ChoiceGroupComponentPage.tsx |  2 +-
 .../src/pages/Components/CommandBarComponentPage.tsx  |  2 +-
 .../pages/Components/ContextualMenuComponentPage.tsx  |  2 +-
 .../src/pages/Components/DatePickerComponentPage.tsx  |  2 +-
 .../src/pages/Components/DetailsListComponentPage.tsx |  2 +-
 .../src/pages/Components/DialogComponentPage.tsx      |  2 +-
 .../pages/Components/DocumentCardComponentPage.tsx    |  2 +-
 .../src/pages/Components/DropdownComponentPage.tsx    |  2 +-
 .../src/pages/Components/FacepileComponentPage.tsx    |  2 +-
 .../src/pages/Components/IconComponentPage.tsx        |  2 +-
 .../src/pages/Components/ImageComponentPage.tsx       |  2 +-
 .../src/pages/Components/LabelComponentPage.tsx       |  2 +-
 .../src/pages/Components/LayerComponentPage.tsx       |  2 +-
 .../src/pages/Components/LinkComponentPage.tsx        |  2 +-
 .../src/pages/Components/MessageBarComponentPage.tsx  |  2 +-
 .../src/pages/Components/ModalComponentPage.tsx       |  2 +-
 .../src/pages/Components/NavComponentPage.tsx         |  2 +-
 .../src/pages/Components/OverlayComponentPage.tsx     |  2 +-
 .../src/pages/Components/PanelComponentPage.tsx       |  2 +-
 .../pages/Components/PeoplePickerComponentPage.tsx    |  2 +-
 .../src/pages/Components/PersonaComponentPage.tsx     |  2 +-
 .../src/pages/Components/PivotComponentPage.tsx       |  2 +-
 .../Components/ProgressIndicatorComponentPage.tsx     |  2 +-
 .../src/pages/Components/RatingComponentPage.tsx      |  2 +-
 .../src/pages/Components/ResizeGroupComponentPage.tsx |  2 +-
 .../src/pages/Components/SearchBoxComponentPage.tsx   |  2 +-
 .../src/pages/Components/SliderComponentPage.tsx      |  2 +-
 .../src/pages/Components/SpinButtonComponentPage.tsx  |  2 +-
 .../src/pages/Components/SpinnerComponentPage.tsx     |  2 +-
 .../Components/SwatchColorPickerComponentPage.tsx     |  2 +-
 .../src/pages/Components/TextFieldComponentPage.tsx   |  4 ++--
 .../src/pages/Components/ToggleComponentPage.tsx      |  2 +-
 .../button-impl-examples_2017-10-16-23-05.json        | 11 +++++++++++
 .../button-impl-examples_2017-10-16-23-05.json        | 11 +++++++++++
 .../src/components/ComponentPage/ComponentPage.tsx    |  8 ++++----
 .../src/components/Button/ButtonPage.tsx              |  4 ++++
 .../examples/TextField.Borderless.Example.tsx         |  8 ++++----
 .../TextField/examples/TextField.Examples.scss        |  2 +-
 43 files changed, 80 insertions(+), 46 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/button-impl-examples_2017-10-16-23-05.json
 create mode 100644 common/changes/office-ui-fabric-react/button-impl-examples_2017-10-16-23-05.json

diff --git a/apps/fabric-website/src/components/ComponentPage/ComponentPage.scss b/apps/fabric-website/src/components/ComponentPage/ComponentPage.scss
index bfca111ccb98c..9487b879b3a2d 100644
--- a/apps/fabric-website/src/components/ComponentPage/ComponentPage.scss
+++ b/apps/fabric-website/src/components/ComponentPage/ComponentPage.scss
@@ -16,4 +16,8 @@
     @include contentPadding(50px, 50px);  // Override padding to match this website
   }
 
+  #BestPractices, #Variants, #ImplementationExamples, #Implementation {
+    margin-top: 0;
+  }
+
 }
\ No newline at end of file
diff --git a/apps/fabric-website/src/pages/Components/BreadcrumbComponentPage.tsx b/apps/fabric-website/src/pages/Components/BreadcrumbComponentPage.tsx
index d276e6eefde03..f4f9be714e055 100644
--- a/apps/fabric-website/src/pages/Components/BreadcrumbComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/BreadcrumbComponentPage.tsx
@@ -18,7 +18,7 @@ export class BreadcrumbComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/ButtonComponentPage.tsx b/apps/fabric-website/src/pages/Components/ButtonComponentPage.tsx
index 557def4212b0b..6a3232b9b1f1b 100644
--- a/apps/fabric-website/src/pages/Components/ButtonComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ButtonComponentPage.tsx
@@ -19,12 +19,16 @@ export class ButtonComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
                   'location': 'Variants'
                 },
+                {
+                  'text': 'Implementation Examples',
+                  'location': 'ImplementationExamples'
+                },
                 {
                   'text': 'Implementation',
                   'location': 'Implementation'
diff --git a/apps/fabric-website/src/pages/Components/CalloutComponentPage.tsx b/apps/fabric-website/src/pages/Components/CalloutComponentPage.tsx
index f75a934d3b92a..dfe53b8634548 100644
--- a/apps/fabric-website/src/pages/Components/CalloutComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/CalloutComponentPage.tsx
@@ -18,7 +18,7 @@ export class CalloutComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/CheckboxComponentPage.tsx b/apps/fabric-website/src/pages/Components/CheckboxComponentPage.tsx
index 0a00ae64e12c5..0175c42a03ed8 100644
--- a/apps/fabric-website/src/pages/Components/CheckboxComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/CheckboxComponentPage.tsx
@@ -18,7 +18,7 @@ export class CheckboxComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/ChoiceGroupComponentPage.tsx b/apps/fabric-website/src/pages/Components/ChoiceGroupComponentPage.tsx
index f00d02b324282..4182b09dfb1a4 100644
--- a/apps/fabric-website/src/pages/Components/ChoiceGroupComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ChoiceGroupComponentPage.tsx
@@ -18,7 +18,7 @@ export class ChoiceGroupComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/CommandBarComponentPage.tsx b/apps/fabric-website/src/pages/Components/CommandBarComponentPage.tsx
index c56ae3087a988..25be30d714a4f 100644
--- a/apps/fabric-website/src/pages/Components/CommandBarComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/CommandBarComponentPage.tsx
@@ -18,7 +18,7 @@ export class CommandBarComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/ContextualMenuComponentPage.tsx b/apps/fabric-website/src/pages/Components/ContextualMenuComponentPage.tsx
index 75d5f8f2f4044..1532af2aed26a 100644
--- a/apps/fabric-website/src/pages/Components/ContextualMenuComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ContextualMenuComponentPage.tsx
@@ -18,7 +18,7 @@ export class ContextualMenuComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/DatePickerComponentPage.tsx b/apps/fabric-website/src/pages/Components/DatePickerComponentPage.tsx
index 5a9f09b8f3247..204c5dec1575f 100644
--- a/apps/fabric-website/src/pages/Components/DatePickerComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/DatePickerComponentPage.tsx
@@ -18,7 +18,7 @@ export class DatePickerComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/DetailsListComponentPage.tsx b/apps/fabric-website/src/pages/Components/DetailsListComponentPage.tsx
index 7ede8a0ac6516..2ac9254e714f8 100644
--- a/apps/fabric-website/src/pages/Components/DetailsListComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/DetailsListComponentPage.tsx
@@ -18,7 +18,7 @@ export class DetailsListComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/DialogComponentPage.tsx b/apps/fabric-website/src/pages/Components/DialogComponentPage.tsx
index dd0660f25c176..b3bf165e8e8d7 100644
--- a/apps/fabric-website/src/pages/Components/DialogComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/DialogComponentPage.tsx
@@ -18,7 +18,7 @@ export class DialogComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/DocumentCardComponentPage.tsx b/apps/fabric-website/src/pages/Components/DocumentCardComponentPage.tsx
index 6371bdc573d00..b1bae3dc7b2a9 100644
--- a/apps/fabric-website/src/pages/Components/DocumentCardComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/DocumentCardComponentPage.tsx
@@ -18,7 +18,7 @@ export class DocumentCardComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/DropdownComponentPage.tsx b/apps/fabric-website/src/pages/Components/DropdownComponentPage.tsx
index 96ad4d5db6628..dac02d95e18f8 100644
--- a/apps/fabric-website/src/pages/Components/DropdownComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/DropdownComponentPage.tsx
@@ -18,7 +18,7 @@ export class DropdownComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/FacepileComponentPage.tsx b/apps/fabric-website/src/pages/Components/FacepileComponentPage.tsx
index 9f848c4b5be6d..3ed0df6639a62 100644
--- a/apps/fabric-website/src/pages/Components/FacepileComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/FacepileComponentPage.tsx
@@ -18,7 +18,7 @@ export class FacepileComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/IconComponentPage.tsx b/apps/fabric-website/src/pages/Components/IconComponentPage.tsx
index f9b32ba36ce77..0357bd7b5cdc8 100644
--- a/apps/fabric-website/src/pages/Components/IconComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/IconComponentPage.tsx
@@ -18,7 +18,7 @@ export class IconComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/ImageComponentPage.tsx b/apps/fabric-website/src/pages/Components/ImageComponentPage.tsx
index fd5ba3eef6504..f8af3614d787e 100644
--- a/apps/fabric-website/src/pages/Components/ImageComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ImageComponentPage.tsx
@@ -18,7 +18,7 @@ export class ImageComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/LabelComponentPage.tsx b/apps/fabric-website/src/pages/Components/LabelComponentPage.tsx
index f258b515f10b7..f576070430911 100644
--- a/apps/fabric-website/src/pages/Components/LabelComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/LabelComponentPage.tsx
@@ -18,7 +18,7 @@ export class LabelComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/LayerComponentPage.tsx b/apps/fabric-website/src/pages/Components/LayerComponentPage.tsx
index e70bfb15411ab..21a3374c8f20b 100644
--- a/apps/fabric-website/src/pages/Components/LayerComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/LayerComponentPage.tsx
@@ -18,7 +18,7 @@ export class LayerComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/LinkComponentPage.tsx b/apps/fabric-website/src/pages/Components/LinkComponentPage.tsx
index 18c969976a7d7..2e09a43deffda 100644
--- a/apps/fabric-website/src/pages/Components/LinkComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/LinkComponentPage.tsx
@@ -18,7 +18,7 @@ export class LinkComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/MessageBarComponentPage.tsx b/apps/fabric-website/src/pages/Components/MessageBarComponentPage.tsx
index 36cd649cde689..d215e845f2ecf 100644
--- a/apps/fabric-website/src/pages/Components/MessageBarComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/MessageBarComponentPage.tsx
@@ -18,7 +18,7 @@ export class MessageBarComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/ModalComponentPage.tsx b/apps/fabric-website/src/pages/Components/ModalComponentPage.tsx
index 8af83e7c5e094..a407a065e0a9a 100644
--- a/apps/fabric-website/src/pages/Components/ModalComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ModalComponentPage.tsx
@@ -18,7 +18,7 @@ export class ModalComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/NavComponentPage.tsx b/apps/fabric-website/src/pages/Components/NavComponentPage.tsx
index 6256e255061da..dd0e8f5f59b2a 100644
--- a/apps/fabric-website/src/pages/Components/NavComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/NavComponentPage.tsx
@@ -18,7 +18,7 @@ export class NavComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/OverlayComponentPage.tsx b/apps/fabric-website/src/pages/Components/OverlayComponentPage.tsx
index ed3934c108ffa..36e654cc461c8 100644
--- a/apps/fabric-website/src/pages/Components/OverlayComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/OverlayComponentPage.tsx
@@ -18,7 +18,7 @@ export class OverlayComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/PanelComponentPage.tsx b/apps/fabric-website/src/pages/Components/PanelComponentPage.tsx
index 8089c52e3ac33..9e158348e4bfb 100644
--- a/apps/fabric-website/src/pages/Components/PanelComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/PanelComponentPage.tsx
@@ -18,7 +18,7 @@ export class PanelComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/PeoplePickerComponentPage.tsx b/apps/fabric-website/src/pages/Components/PeoplePickerComponentPage.tsx
index 0ca864017c362..a6570e9a22f00 100644
--- a/apps/fabric-website/src/pages/Components/PeoplePickerComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/PeoplePickerComponentPage.tsx
@@ -18,7 +18,7 @@ export class PeoplePickerComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/PersonaComponentPage.tsx b/apps/fabric-website/src/pages/Components/PersonaComponentPage.tsx
index 8ec50017215dd..6207c0bcaf109 100644
--- a/apps/fabric-website/src/pages/Components/PersonaComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/PersonaComponentPage.tsx
@@ -18,7 +18,7 @@ export class PersonaComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/PivotComponentPage.tsx b/apps/fabric-website/src/pages/Components/PivotComponentPage.tsx
index 82620b7ec12b9..a991a20e89881 100644
--- a/apps/fabric-website/src/pages/Components/PivotComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/PivotComponentPage.tsx
@@ -18,7 +18,7 @@ export class PivotComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/ProgressIndicatorComponentPage.tsx b/apps/fabric-website/src/pages/Components/ProgressIndicatorComponentPage.tsx
index 689183f66f06e..3d756d2edbc24 100644
--- a/apps/fabric-website/src/pages/Components/ProgressIndicatorComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ProgressIndicatorComponentPage.tsx
@@ -18,7 +18,7 @@ export class ProgressIndicatorComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/RatingComponentPage.tsx b/apps/fabric-website/src/pages/Components/RatingComponentPage.tsx
index 425400fe3f25d..268f915e2603b 100644
--- a/apps/fabric-website/src/pages/Components/RatingComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/RatingComponentPage.tsx
@@ -18,7 +18,7 @@ export class RatingComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/ResizeGroupComponentPage.tsx b/apps/fabric-website/src/pages/Components/ResizeGroupComponentPage.tsx
index 5946c7507bf6c..5a11a629e2ce4 100644
--- a/apps/fabric-website/src/pages/Components/ResizeGroupComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ResizeGroupComponentPage.tsx
@@ -18,7 +18,7 @@ export class ResizeGroupComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/SearchBoxComponentPage.tsx b/apps/fabric-website/src/pages/Components/SearchBoxComponentPage.tsx
index 54a864ff727d4..3ee30b89ea0a5 100644
--- a/apps/fabric-website/src/pages/Components/SearchBoxComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/SearchBoxComponentPage.tsx
@@ -18,7 +18,7 @@ export class SearchBoxComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/SliderComponentPage.tsx b/apps/fabric-website/src/pages/Components/SliderComponentPage.tsx
index 3e0942992e260..962688361f6bd 100644
--- a/apps/fabric-website/src/pages/Components/SliderComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/SliderComponentPage.tsx
@@ -18,7 +18,7 @@ export class SliderComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/SpinButtonComponentPage.tsx b/apps/fabric-website/src/pages/Components/SpinButtonComponentPage.tsx
index 63720a4123f92..a43701393039a 100644
--- a/apps/fabric-website/src/pages/Components/SpinButtonComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/SpinButtonComponentPage.tsx
@@ -18,7 +18,7 @@ export class SpinButtonComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/SpinnerComponentPage.tsx b/apps/fabric-website/src/pages/Components/SpinnerComponentPage.tsx
index d87f8483ef9bb..a68576a591830 100644
--- a/apps/fabric-website/src/pages/Components/SpinnerComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/SpinnerComponentPage.tsx
@@ -18,7 +18,7 @@ export class SpinnerComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/SwatchColorPickerComponentPage.tsx b/apps/fabric-website/src/pages/Components/SwatchColorPickerComponentPage.tsx
index 2d031b9cfa5a9..e0377f11c6009 100644
--- a/apps/fabric-website/src/pages/Components/SwatchColorPickerComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/SwatchColorPickerComponentPage.tsx
@@ -18,7 +18,7 @@ export class SwatchColorPickerComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/apps/fabric-website/src/pages/Components/TextFieldComponentPage.tsx b/apps/fabric-website/src/pages/Components/TextFieldComponentPage.tsx
index 11dd74f30d8a0..481664c191be8 100644
--- a/apps/fabric-website/src/pages/Components/TextFieldComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/TextFieldComponentPage.tsx
@@ -18,7 +18,7 @@ export class TextFieldComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
@@ -26,7 +26,7 @@ export class TextFieldComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Implementation Examples',
-                  'location': 'Implementation Examples'
+                  'location': 'ImplementationExamples'
                 },
                 {
                   'text': 'Implementation',
diff --git a/apps/fabric-website/src/pages/Components/ToggleComponentPage.tsx b/apps/fabric-website/src/pages/Components/ToggleComponentPage.tsx
index cb4d0cefa8ef2..a9dd35ef26705 100644
--- a/apps/fabric-website/src/pages/Components/ToggleComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ToggleComponentPage.tsx
@@ -18,7 +18,7 @@ export class ToggleComponentPage extends React.Component<any, any> {
                 },
                 {
                   'text': 'Best Practices',
-                  'location': 'Best Practices'
+                  'location': 'BestPractices'
                 },
                 {
                   'text': 'Variants',
diff --git a/common/changes/@uifabric/fabric-website/button-impl-examples_2017-10-16-23-05.json b/common/changes/@uifabric/fabric-website/button-impl-examples_2017-10-16-23-05.json
new file mode 100644
index 0000000000000..b27abc366fc53
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/button-impl-examples_2017-10-16-23-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "TextField documentation style updates",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/button-impl-examples_2017-10-16-23-05.json b/common/changes/office-ui-fabric-react/button-impl-examples_2017-10-16-23-05.json
new file mode 100644
index 0000000000000..07c4c1db6a26f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/button-impl-examples_2017-10-16-23-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added implementation examples section to Button Page. Rearranged TextField borderless example.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx b/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
index cc123dae13e0a..8461dfeb7d4fa 100644
--- a/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
+++ b/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
@@ -103,7 +103,7 @@ export class ComponentPage extends React.Component<IComponentPageProps, {}> {
     if (bestPractices && dos && donts) {
       links.push(
         <div className='ComponentPage-navLink' key='nav-link'>
-          <Link { ...{ href: this._baseUrl + '#Best Practices' } }>Best Practices</Link>
+          <Link { ...{ href: this._baseUrl + '#BestPractices' } }>Best Practices</Link>
         </div>
       );
     }
@@ -118,7 +118,7 @@ export class ComponentPage extends React.Component<IComponentPageProps, {}> {
           <Link { ...{ href: this._baseUrl + '#Variants' } }>Variants</Link>
         </div> }
         { this.props.implementationExampleCards && <div className='ComponentPage-navLink'>
-          <Link { ...{ href: this._baseUrl + '#Implementation Examples' } }>Implementation Examples</Link>
+          <Link { ...{ href: this._baseUrl + '#ImplementationExamples' } }>Implementation Examples</Link>
         </div> }
         { this.props.propertiesTables && <div className='ComponentPage-navLink'>
           <Link { ...{ href: this._baseUrl + '#Implementation' } }>Implementation</Link>
@@ -164,7 +164,7 @@ export class ComponentPage extends React.Component<IComponentPageProps, {}> {
 
     if (this.props.bestPractices) {
       dosAndDonts.push(
-        <div className='ComponentPage-usage' id='Best Practices' key='best-practices'>
+        <div className='ComponentPage-usage' id='BestPractices' key='best-practices'>
           <h2 className='ComponentPage-subHeading'>Best Practices</h2>
           { this.props.bestPractices }
         </div>
@@ -212,7 +212,7 @@ export class ComponentPage extends React.Component<IComponentPageProps, {}> {
     if (this.props.implementationExampleCards) {
       return (
         <div className='ComponentPage-implementationExamplesSection'>
-          <h2 className='ComponentPage-subHeading ComponentPage-variantsTitle' id='Implementation Examples'>Implementation Examples</h2>
+          <h2 className='ComponentPage-subHeading ComponentPage-variantsTitle' id='ImplementationExamples'>Implementation Examples</h2>
           { this.props.implementationExampleCards }
         </div>
       );
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
index 887c06b84a7c9..1534631d4f28f 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
@@ -109,6 +109,10 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
             <ExampleCard title='Action Button' code={ ButtonActionExampleCode }>
               <ButtonActionExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
+          </div>
+        }
+        implementationExampleCards={
+          <div>
             <ExampleCard title='Button Like Anchor' code={ ButtonAnchorExampleCode }>
               <ButtonAnchorExample disabled={ this.state.areButtonsDisabled } checked={ this.state.areButtonsChecked } />
             </ExampleCard>
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Borderless.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Borderless.Example.tsx
index 4d055da03d776..4fbf848632fc6 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Borderless.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Borderless.Example.tsx
@@ -7,14 +7,14 @@ export class TextFieldBorderlessExample extends React.Component<any, any> {
     return (
       <div className='ms-TextFieldExample'>
         <TextField
-          label='Borderless Standard TextField'
+          label='Borderless Multiline TextField'
+          multiline
+          rows={ 4 }
           borderless
           placeholder='No borders here, folks.'
         />
         <TextField
-          label='Borderless Multiline TextField'
-          multiline
-          rows={ 4 }
+          label='Borderless Standard TextField'
           borderless
           placeholder='No borders here, folks.'
         />
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Examples.scss b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Examples.scss
index c7832b08fcdf7..ad51a442ee46b 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Examples.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Examples.scss
@@ -1,5 +1,5 @@
 :global {
   .ms-TextFieldExample .ms-TextField {
-    margin: 0 0 10px 0;
+    margin: 0 0 15px 0;
   }
 }
\ No newline at end of file

From a8d39901a6322d02c00ccaeb5c755f9cf42827b9 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 18 Oct 2017 10:21:25 +0000
Subject: [PATCH 0880/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 29 +++++++++++
 apps/fabric-website/CHANGELOG.md              | 11 +++-
 apps/fabric-website/package.json              |  4 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../formControl_2017-10-10-23-55.json         | 11 ----
 ...button-impl-examples_2017-10-16-23-05.json | 11 ----
 .../cela-branding_2017-10-16-21-07.json       | 11 ----
 .../in-page-nav_2017-10-17-18-48.json         | 11 ----
 .../formControl_2017-10-10-23-55.json         | 11 ----
 ...button-impl-examples_2017-10-16-23-05.json | 11 ----
 .../fabric-react-core_2017-10-16-19-47.json   | 11 ----
 .../fix-image-fade_2017-10-16-20-22.json      | 11 ----
 .../formControl_2017-10-10-23-55.json         | 11 ----
 ...ComboBoxDisableStyle_2017-10-11-23-28.json | 11 ----
 ...alozano-splitInMenus_2017-10-14-00-24.json | 11 ----
 ...o-finalSemanticSlots_2017-10-17-00-50.json | 11 ----
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/CHANGELOG.json           | 19 +++++++
 packages/experiments/CHANGELOG.md             |  9 +++-
 packages/experiments/package.json             |  4 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 51 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 18 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 +++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  2 +-
 30 files changed, 169 insertions(+), 149 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/formControl_2017-10-10-23-55.json
 delete mode 100644 common/changes/@uifabric/fabric-website/button-impl-examples_2017-10-16-23-05.json
 delete mode 100644 common/changes/@uifabric/fabric-website/cela-branding_2017-10-16-21-07.json
 delete mode 100644 common/changes/@uifabric/fabric-website/in-page-nav_2017-10-17-18-48.json
 delete mode 100644 common/changes/@uifabric/utilities/formControl_2017-10-10-23-55.json
 delete mode 100644 common/changes/office-ui-fabric-react/button-impl-examples_2017-10-16-23-05.json
 delete mode 100644 common/changes/office-ui-fabric-react/fabric-react-core_2017-10-16-19-47.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-image-fade_2017-10-16-20-22.json
 delete mode 100644 common/changes/office-ui-fabric-react/formControl_2017-10-10-23-55.json
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-ComboBoxDisableStyle_2017-10-11-23-28.json
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-splitInMenus_2017-10-14-00-24.json
 delete mode 100644 common/changes/office-ui-fabric-react/phkuo-finalSemanticSlots_2017-10-17-00-50.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index b908b3c302a2b..f5b831223f370 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,35 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.0.12",
+      "tag": "@uifabric/fabric-website_v5.0.12",
+      "date": "Wed, 18 Oct 2017 10:21:25 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "5c408b0984d9d83323a2b3b22aa50b3768c2d711",
+            "comment": "TextField documentation style updates"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "745cec67c600088d6d0423ed4daed8e1c8ed2909",
+            "comment": "Removed branding guidance pdf, updated fabric asset license pdf, and fixed link colors"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "ffd057952717cffcf356f308699f2ed88139a00b",
+            "comment": "Fixed in page navigation for Chrome and Firefox."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.9.2 <6.0.0` to `>=5.10.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.11",
       "tag": "@uifabric/fabric-website_v5.0.11",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index f44b5ef70f216..0bcee467e659e 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,15 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Mon, 16 Oct 2017 20:00:51 GMT and should not be manually modified.
+This log was last generated on Wed, 18 Oct 2017 10:21:25 GMT and should not be manually modified.
+
+## 5.0.12
+Wed, 18 Oct 2017 10:21:25 GMT
+
+### Patches
+
+- TextField documentation style updates
+- Removed branding guidance pdf, updated fabric asset license pdf, and fixed link colors
+- Fixed in page navigation for Chrome and Firefox.
 
 ## 5.0.11
 Mon, 16 Oct 2017 20:00:51 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 8748a8b5650ec..c5e50720884a3 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.0.11",
+  "version": "5.0.12",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.9.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.10.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 59ee998a7bda8..59d823db28deb 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.9.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.10.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index c309a10d0f05e..45ac68cf7c944 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.9.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.10.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index d38b131840d43..b324cff63dcdd 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.9.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.10.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 3a77476f4bdc9..a7857bf9447f5 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.9.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.10.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/experiments/formControl_2017-10-10-23-55.json b/common/changes/@uifabric/experiments/formControl_2017-10-10-23-55.json
deleted file mode 100644
index 68a6a3c1838cc..0000000000000
--- a/common/changes/@uifabric/experiments/formControl_2017-10-10-23-55.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Add Form control",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "alebet@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/button-impl-examples_2017-10-16-23-05.json b/common/changes/@uifabric/fabric-website/button-impl-examples_2017-10-16-23-05.json
deleted file mode 100644
index b27abc366fc53..0000000000000
--- a/common/changes/@uifabric/fabric-website/button-impl-examples_2017-10-16-23-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "TextField documentation style updates",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/cela-branding_2017-10-16-21-07.json b/common/changes/@uifabric/fabric-website/cela-branding_2017-10-16-21-07.json
deleted file mode 100644
index 670394811f2bb..0000000000000
--- a/common/changes/@uifabric/fabric-website/cela-branding_2017-10-16-21-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Removed branding guidance pdf, updated fabric asset license pdf, and fixed link colors",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
diff --git a/common/changes/@uifabric/fabric-website/in-page-nav_2017-10-17-18-48.json b/common/changes/@uifabric/fabric-website/in-page-nav_2017-10-17-18-48.json
deleted file mode 100644
index c267c8420e809..0000000000000
--- a/common/changes/@uifabric/fabric-website/in-page-nav_2017-10-17-18-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Fixed in page navigation for Chrome and Firefox.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/formControl_2017-10-10-23-55.json b/common/changes/@uifabric/utilities/formControl_2017-10-10-23-55.json
deleted file mode 100644
index a096c4f7fba3a..0000000000000
--- a/common/changes/@uifabric/utilities/formControl_2017-10-10-23-55.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Add cancel/flush to debounce",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "alebet@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/button-impl-examples_2017-10-16-23-05.json b/common/changes/office-ui-fabric-react/button-impl-examples_2017-10-16-23-05.json
deleted file mode 100644
index 07c4c1db6a26f..0000000000000
--- a/common/changes/office-ui-fabric-react/button-impl-examples_2017-10-16-23-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added implementation examples section to Button Page. Rearranged TextField borderless example.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fabric-react-core_2017-10-16-19-47.json b/common/changes/office-ui-fabric-react/fabric-react-core_2017-10-16-19-47.json
deleted file mode 100644
index c9f9cd59b0c2c..0000000000000
--- a/common/changes/office-ui-fabric-react/fabric-react-core_2017-10-16-19-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Updated the Fabric Core package version",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-image-fade_2017-10-16-20-22.json b/common/changes/office-ui-fabric-react/fix-image-fade_2017-10-16-20-22.json
deleted file mode 100644
index 0596c0b132484..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-image-fade_2017-10-16-20-22.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix Image css so it doesn't fade in if shouldStartVisible is true",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "a.erich@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/formControl_2017-10-10-23-55.json b/common/changes/office-ui-fabric-react/formControl_2017-10-10-23-55.json
deleted file mode 100644
index 38e3d5ee7b3fa..0000000000000
--- a/common/changes/office-ui-fabric-react/formControl_2017-10-10-23-55.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix refs in Dropdown and Datepicker",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "alebet@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/malozano-ComboBoxDisableStyle_2017-10-11-23-28.json b/common/changes/office-ui-fabric-react/malozano-ComboBoxDisableStyle_2017-10-11-23-28.json
deleted file mode 100644
index cbd6c0cbc522d..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-ComboBoxDisableStyle_2017-10-11-23-28.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: the label now appears disabled when the ComboBox is disabled.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/malozano-splitInMenus_2017-10-14-00-24.json b/common/changes/office-ui-fabric-react/malozano-splitInMenus_2017-10-14-00-24.json
deleted file mode 100644
index bfd4d694dd685..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-splitInMenus_2017-10-14-00-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "\"ContextualMenu: SplitButtons can now appear inside menus\"",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/phkuo-finalSemanticSlots_2017-10-17-00-50.json b/common/changes/office-ui-fabric-react/phkuo-finalSemanticSlots_2017-10-17-00-50.json
deleted file mode 100644
index 78d4abbfe54f8..0000000000000
--- a/common/changes/office-ui-fabric-react/phkuo-finalSemanticSlots_2017-10-17-00-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Theming: add SASS variables for semantic theming to support legacy scenarios\"",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 8c095d4697ab3..eb33b22461522 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -39,7 +39,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.3.0 <6.0.0",
-    "@uifabric/utilities": ">=5.2.1 <6.0.0",
+    "@uifabric/utilities": ">=5.3.0 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 0cf20a4828af0..1da9e898c6d9f 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.2.0",
+      "tag": "@uifabric/experiments_v5.2.0",
+      "date": "Wed, 18 Oct 2017 10:21:25 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Alex Bettadapur <alexbettadapur@gmail.com>",
+            "commit": "68a345d9e55491298d70cee431bd1f418a67fd44",
+            "comment": "Add Form control"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.9.3 <6.0.0` to `>=5.10.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.1.0",
       "tag": "@uifabric/experiments_v5.1.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 742382b13e572..4c16e6fbe9e33 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Tue, 17 Oct 2017 17:17:41 GMT and should not be manually modified.
+This log was last generated on Wed, 18 Oct 2017 10:21:25 GMT and should not be manually modified.
+
+## 5.2.0
+Wed, 18 Oct 2017 10:21:25 GMT
+
+### Minor changes
+
+- Add Form control
 
 ## 5.1.0
 Tue, 17 Oct 2017 17:17:41 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 11ab1285ebcf4..730911781bd78 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.1.0",
+  "version": "5.2.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.9.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.10.0 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index cd74bc93799c2..8b4f5fa2eab4b 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,57 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.10.0",
+      "tag": "office-ui-fabric-react_v5.10.0",
+      "date": "Wed, 18 Oct 2017 10:21:25 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "5c408b0984d9d83323a2b3b22aa50b3768c2d711",
+            "comment": "Added implementation examples section to Button Page. Rearranged TextField borderless example."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "5ee04de940661f1d3b32197aa6b8b11a158e6a72",
+            "comment": "Updated the Fabric Core package version"
+          },
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "13e4d1734abd87adb983b1cfc57171033ef88bc3",
+            "comment": "Fix Image css so it doesn't fade in if shouldStartVisible is true"
+          },
+          {
+            "author": "Alex Bettadapur <alexbettadapur@gmail.com>",
+            "commit": "68a345d9e55491298d70cee431bd1f418a67fd44",
+            "comment": "Fix refs in Dropdown and Datepicker"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "385db1890e957ed7410f615b0ae6b452ef53488c",
+            "comment": "ComboBox: the label now appears disabled when the ComboBox is disabled."
+          },
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "046c4698dd69553e32193c1e2cdd973dc6ee27f9",
+            "comment": "\"ContextualMenu: SplitButtons can now appear inside menus\""
+          },
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "608f8d4811dd799cfb20210332d3672ee229dada",
+            "comment": "Theming: add SASS variables for semantic theming to support legacy scenarios\""
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.2.1 <6.0.0` to `>=5.3.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.9.3",
       "tag": "office-ui-fabric-react_v5.9.3",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 79fe03f9fbce1..686430ff16b1d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,22 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 17 Oct 2017 17:17:41 GMT and should not be manually modified.
+This log was last generated on Wed, 18 Oct 2017 10:21:25 GMT and should not be manually modified.
+
+## 5.10.0
+Wed, 18 Oct 2017 10:21:25 GMT
+
+### Minor changes
+
+- ComboBox: the label now appears disabled when the ComboBox is disabled.
+- "ContextualMenu: SplitButtons can now appear inside menus"
+- Theming: add SASS variables for semantic theming to support legacy scenarios"
+
+### Patches
+
+- Added implementation examples section to Button Page. Rearranged TextField borderless example.
+- Updated the Fabric Core package version
+- Fix Image css so it doesn't fade in if shouldStartVisible is true
+- Fix refs in Dropdown and Datepicker
 
 ## 5.9.3
 Tue, 17 Oct 2017 17:17:41 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index fda3de33c9d56..406dff3ae4811 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.9.3",
+  "version": "5.10.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -48,7 +48,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.4.1 <6.0.0",
     "@uifabric/styling": ">=5.3.0 <6.0.0",
-    "@uifabric/utilities": ">=5.2.1 <6.0.0",
+    "@uifabric/utilities": ">=5.3.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 91e7b2b943471..656c6a51c364b 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=5.2.1 <6.0.0",
+    "@uifabric/utilities": ">=5.3.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.4.1 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index de6962c14f725..4d59e823c51a7 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.3.0",
+      "tag": "@uifabric/utilities_v5.3.0",
+      "date": "Wed, 18 Oct 2017 10:21:25 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Alex Bettadapur <alexbettadapur@gmail.com>",
+            "commit": "68a345d9e55491298d70cee431bd1f418a67fd44",
+            "comment": "Add cancel/flush to debounce"
+          }
+        ]
+      }
+    },
     {
       "version": "5.2.1",
       "tag": "@uifabric/utilities_v5.2.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index ba77667f1a5b6..f0f3cd5b9fd19 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Fri, 06 Oct 2017 10:18:41 GMT and should not be manually modified.
+This log was last generated on Wed, 18 Oct 2017 10:21:25 GMT and should not be manually modified.
+
+## 5.3.0
+Wed, 18 Oct 2017 10:21:25 GMT
+
+### Minor changes
+
+- Add cancel/flush to debounce
 
 ## 5.2.1
 Fri, 06 Oct 2017 10:18:41 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index bdb48a9a7e5cb..c81bb96a189d8 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.2.1",
+  "version": "5.3.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 74e329e01e32d23b5669c469fe7e4c4a2b4eee89 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 18 Oct 2017 16:02:40 -0700
Subject: [PATCH 0881/1641] MergeStyles now expands classes that are embedded
 in classname strings. (#3146)

* Fixing merge-styles to deal with classnames that have multiple classes in them.

* change file.

* Remove debugger statement.

* Updating snapshot.
---
 ...ge-styles-classnames_2017-10-18-17-58.json | 11 +++++++
 .../src/extractStyleParts.test.ts             | 31 +++++++++++++++++
 .../merge-styles/src/extractStyleParts.ts     | 13 +++++---
 .../merge-styles/src/mergeStyleSets.test.ts   | 33 +++++++++++++++++--
 packages/merge-styles/src/mergeStyles.test.ts | 14 +++++++-
 .../Toggle/__snapshots__/Toggle.test.tsx.snap |  1 -
 6 files changed, 95 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/@uifabric/merge-styles/merge-styles-classnames_2017-10-18-17-58.json
 create mode 100644 packages/merge-styles/src/extractStyleParts.test.ts

diff --git a/common/changes/@uifabric/merge-styles/merge-styles-classnames_2017-10-18-17-58.json b/common/changes/@uifabric/merge-styles/merge-styles-classnames_2017-10-18-17-58.json
new file mode 100644
index 0000000000000..91d41e9bf80c4
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/merge-styles-classnames_2017-10-18-17-58.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "Calling `mergeStyles` with strings containing space delimited class names was not expanding merge-styles generated class names in the final merge. Fixed so that it does.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/merge-styles/src/extractStyleParts.test.ts b/packages/merge-styles/src/extractStyleParts.test.ts
new file mode 100644
index 0000000000000..5e8bd60ee690c
--- /dev/null
+++ b/packages/merge-styles/src/extractStyleParts.test.ts
@@ -0,0 +1,31 @@
+import { extractStyleParts } from './extractStyleParts';
+import { mergeStyles } from './mergeStyles';
+import {
+  Stylesheet,
+  InjectionMode
+} from './Stylesheet';
+
+const _stylesheet: Stylesheet = Stylesheet.getInstance();
+
+_stylesheet.setConfig({ injectionMode: InjectionMode.none });
+
+describe('extractStyleParts', () => {
+  beforeEach(() => {
+    _stylesheet.reset();
+  });
+
+  it('can extract classes and objects', () => {
+    const { classes, objects } = extractStyleParts('a', 'b', ['c', 'd'], { left: 1 }, ['e', { left: 2 }, { left: 3 }]);
+
+    expect(classes).toEqual(['a', 'b', 'c', 'd', 'e']);
+    expect(objects).toEqual([{ left: 1 }, { left: 2 }, { left: 3 }]);
+  });
+
+  it('can expand previously registered rules', () => {
+    const className = mergeStyles({ left: 1 });
+    const { classes, objects } = extractStyleParts(className, { left: 2 });
+
+    expect(classes).toEqual([]);
+    expect(objects).toEqual([{ left: 1 }, { left: 2 }]);
+  });
+});
\ No newline at end of file
diff --git a/packages/merge-styles/src/extractStyleParts.ts b/packages/merge-styles/src/extractStyleParts.ts
index 175d1c964fc76..2bba52e449b4b 100644
--- a/packages/merge-styles/src/extractStyleParts.ts
+++ b/packages/merge-styles/src/extractStyleParts.ts
@@ -16,11 +16,16 @@ export function extractStyleParts(
     for (const arg of argsList) {
       if (arg) {
         if (typeof arg === 'string') {
-          const translatedArgs = stylesheet.argsFromClassName(arg);
-          if (translatedArgs) {
-            objects.push(translatedArgs);
+          if (arg.indexOf(' ') >= 0) {
+            _processArgs(arg.split(' '));
           } else {
-            classes.push(arg);
+            const translatedArgs = stylesheet.argsFromClassName(arg);
+
+            if (translatedArgs) {
+              _processArgs(translatedArgs);
+            } else {
+              classes.push(arg);
+            }
           }
         } else if (Array.isArray(arg)) {
           _processArgs(arg);
diff --git a/packages/merge-styles/src/mergeStyleSets.test.ts b/packages/merge-styles/src/mergeStyleSets.test.ts
index f295d406b6001..f7554cf5385b4 100644
--- a/packages/merge-styles/src/mergeStyleSets.test.ts
+++ b/packages/merge-styles/src/mergeStyleSets.test.ts
@@ -6,6 +6,10 @@ import {
 
 const _stylesheet: Stylesheet = Stylesheet.getInstance();
 
+interface ITestClasses {
+  root: string;
+}
+
 _stylesheet.setConfig({ injectionMode: InjectionMode.none });
 
 describe('mergeStyleSets', () => {
@@ -89,8 +93,8 @@ describe('mergeStyleSets', () => {
   });
 
   it('can auto expand a previously registered style', () => {
-    const styles: { root: string } = mergeStyleSets({ root: { background: 'red' } });
-    const styles2: { root: string } = mergeStyleSets({ root: [{ background: 'purple' }, styles.root] });
+    const styles: ITestClasses = mergeStyleSets({ root: { background: 'red' } });
+    const styles2: ITestClasses = mergeStyleSets({ root: [{ background: 'purple' }, styles.root] });
 
     expect(styles.root).toEqual(styles2.root);
 
@@ -98,4 +102,29 @@ describe('mergeStyleSets', () => {
       '.root-0{background:red;}'
     );
   });
+
+  it('can merge two sets with class names', () => {
+    const styleSet1: ITestClasses = mergeStyleSets({
+      root: [
+        'ms-Foo',
+        { background: 'red' }
+      ]
+    });
+    const styleSet2: ITestClasses = mergeStyleSets(
+      styleSet1,
+      {
+        root: [
+          'ms-Bar',
+          { background: 'green' }
+        ]
+      }
+    );
+
+    expect(styleSet2).toEqual({ root: 'ms-Foo ms-Bar root-1' });
+    expect(_stylesheet.getRules()).toEqual(
+      '.root-0{background:red;}' +
+      '.root-1{background:green;}'
+    );
+  });
+
 });
\ No newline at end of file
diff --git a/packages/merge-styles/src/mergeStyles.test.ts b/packages/merge-styles/src/mergeStyles.test.ts
index 744a9421ec143..12f7cbdf4fd1a 100644
--- a/packages/merge-styles/src/mergeStyles.test.ts
+++ b/packages/merge-styles/src/mergeStyles.test.ts
@@ -53,7 +53,8 @@ describe('mergeStyles', () => {
     expect(className).toEqual('css-0');
     expect(newClassName).toEqual('css-1');
     expect(_stylesheet.getRules()).toEqual(
-      '.css-0{background:red;color:black;}.css-1{background:red;color:white;}'
+      '.css-0{background:red;color:black;}' +
+      '.css-1{background:red;color:white;}'
     );
   });
 
@@ -64,4 +65,15 @@ describe('mergeStyles', () => {
     );
   });
 
+  it('can expand className lists', () => {
+    const classes1 = mergeStyles('ms-Foo', { background: 'red' });
+    const classes2 = mergeStyles(classes1, { background: 'green' });
+
+    expect(classes2).toEqual('ms-Foo css-1');
+    expect(_stylesheet.getRules()).toEqual(
+      '.css-0{background:red;}' +
+      '.css-1{background:green;}'
+    );
+  });
+
 });
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap
index a54b964b8dac9..a420fb64ed86d 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap
@@ -13,7 +13,6 @@ exports[`Toggle renders toggle correctly 1`] = `
     className=
         ms-Label
         ms-Toggle-label
-
         {
           box-shadow: none;
           box-sizing: border-box;

From 75bcda3b83570e315c0fde75f6a8972e04b9eb44 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Wed, 18 Oct 2017 17:18:05 -0700
Subject: [PATCH 0882/1641] ComboBox: Fix custom styling issues (#3156)

* Fix getComboBoxOptionClassNames

* Rush change
---
 .../combo-box-classnames_2017-10-18-23-28.json        | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.classNames.ts    |  4 +---
 .../src/components/ComboBox/ComboBox.tsx              |  7 ++++---
 3 files changed, 16 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/combo-box-classnames_2017-10-18-23-28.json

diff --git a/common/changes/office-ui-fabric-react/combo-box-classnames_2017-10-18-23-28.json b/common/changes/office-ui-fabric-react/combo-box-classnames_2017-10-18-23-28.json
new file mode 100644
index 0000000000000..f9864b2b3d936
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/combo-box-classnames_2017-10-18-23-28.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Fix custom styling on menu options",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
index 084ec716a9e51..2e9f07097b00b 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
@@ -89,9 +89,7 @@ export const getClassNames = memoizeFunction((
 });
 
 export const getComboBoxOptionClassNames = memoizeFunction((
-  styles: IComboBoxOptionStyles,
-  optionIsSelected: boolean,
-  disabled: boolean,
+  styles: Partial<IComboBoxOptionStyles>,
 ): IComboBoxOptionClassNames => {
   return {
     optionText: mergeStyles(
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index b962134ea3122..38e11d84d7218 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -26,7 +26,8 @@ import {
 } from './ComboBox.styles';
 import {
   IComboBoxClassNames,
-  getClassNames
+  getClassNames,
+  getComboBoxOptionClassNames
 } from './ComboBox.classNames';
 
 export interface IComboBoxState {
@@ -936,8 +937,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   // Render content of item
   @autobind
   private _onRenderOption(item: IComboBoxOption): JSX.Element {
-    const optionStyles = this._getCurrentOptionStyles(item);
-    return <span className={ optionStyles.optionText as string }>{ item.text }</span>;
+    const optionClassNames = getComboBoxOptionClassNames(this._getCurrentOptionStyles(item));
+    return <span className={ optionClassNames.optionText }>{ item.text }</span>;
   }
 
   /**

From ccd01417a150a26e471bfc840783deb3faea0b54 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 18 Oct 2017 18:26:32 -0700
Subject: [PATCH 0883/1641] Updating shrinkwrap. (#3158)

---
 common/config/rush/npm-shrinkwrap.json | 644 +++++++++++++++++++++++--
 1 file changed, 597 insertions(+), 47 deletions(-)

diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 8e47e13d1a521..3fe8e05ce6197 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -2455,9 +2455,9 @@
       }
     },
     "@storybook/react-fuzzy": {
-      "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/@storybook/react-fuzzy/-/react-fuzzy-0.4.0.tgz",
-      "integrity": "sha1-KWHoofbBr8zpfp6aFNHf6dkGEIc="
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/@storybook/react-fuzzy/-/react-fuzzy-0.4.1.tgz",
+      "integrity": "sha512-UCV8HZ3rzEpn36Tn+Ip0ZqcwQjphIcxmnWDF7MgjBJkCPlSahSzALhS9EH6WLBeCDzajoDynAAUhwqC1EPkhkA=="
     },
     "@storybook/ui": {
       "version": "3.2.12",
@@ -2490,9 +2490,9 @@
       "integrity": "sha1-7WM2lV6vIzt163kjubHzc9BF7wE="
     },
     "@types/jest": {
-      "version": "21.1.2",
-      "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.2.tgz",
-      "integrity": "sha512-mZ0zVDNxpz44GzPHtKCFOUDEdcRUk2c1fDzWCpiGuyeJLLMOLuLlzuqOQk5fufVUJarwm4aZcQHLdYH22h25zg=="
+      "version": "21.1.4",
+      "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.4.tgz",
+      "integrity": "sha512-CItNfCz6osAOxdhWMbUYbSz0iMGKuxDHu/0iaqnsGKQd98OY2J8EBtVQvozc3gXvPh2Y3uAjTGgqYv8rEj6qzA=="
     },
     "@types/mocha": {
       "version": "2.2.39",
@@ -2555,9 +2555,9 @@
       "integrity": "sha512-P5kfPej/wxgR8jZt/GqnU0FqYcz+JH1iCcaaYd6p9L3opmZtu4w5duKeqs+Bc1u7K16r800EQfLgKe76rt6AuA=="
     },
     "@uifabric/merge-styles": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.4.0.tgz",
-      "integrity": "sha512-u96gLbtiUsPcRjTBcEK7KuWuYwmKrq6tosYV3JcB4t2BIusEog5bIcXwRueH/511XNDNTL/NDCjYHgaxGuAULg=="
+      "version": "5.4.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.4.1.tgz",
+      "integrity": "sha512-xXwP5gMwTXjBVMcJBPVDm25/ZINzBzIpweogvxfrPwhINV13KFb0NCWweHAOR9tv32LWcSVJ5aaqetK2Q4qqVg=="
     },
     "@uifabric/styling": {
       "version": "5.3.0",
@@ -2565,9 +2565,9 @@
       "integrity": "sha512-K+IvuSlwK2i5L1Pxoes1kCjsCjANjlcTJP6ZDv2uhhHjn4HsA2iPFaMSmIfly/gagaH6IYVBRcQ+SyXDKFsjiA=="
     },
     "@uifabric/utilities": {
-      "version": "5.2.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.2.1.tgz",
-      "integrity": "sha512-rOM5lS0Tx2p505E5OsX70HKKIOHNUDggdkzgUVmeOyPYO8u+nNG62HuqG9fFh113EfcbMzH3IIXz21JGrqxRfg=="
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.3.0.tgz",
+      "integrity": "sha512-geCMrHaEBmHz0RKWq9Lf0ExKLfYmq9nqx+9iyp/l7RN5x5AqMQpy4b6NXwEbpeo//1+HQnAdg7q6ZS7Ll5+vjQ=="
     },
     "abab": {
       "version": "1.0.4",
@@ -3511,9 +3511,9 @@
       "integrity": "sha1-g2TKYt+Or7gwSZ9pkXdGbDsDSZ0="
     },
     "babel-preset-env": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/babel-preset-env/-/babel-preset-env-1.6.0.tgz",
-      "integrity": "sha512-OVgtQRuOZKckrILgMA5rvctvFZPv72Gua9Rt006AiPoB0DJKGN07UmaQA+qRrYgK71MVct8fFhT0EyNWYorVew==",
+      "version": "1.6.1",
+      "resolved": "https://registry.npmjs.org/babel-preset-env/-/babel-preset-env-1.6.1.tgz",
+      "integrity": "sha512-W6VIyA6Ch9ePMI7VptNn2wBM6dbG0eSz25HEiL40nQXCsXGTGZSTZu1Iap+cj3Q0S5a7T9+529l/5Bkvd+afNA==",
       "dependencies": {
         "browserslist": {
           "version": "2.5.1",
@@ -3871,14 +3871,14 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
     },
     "caniuse-db": {
-      "version": "1.0.30000746",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000746.tgz",
-      "integrity": "sha1-UBCYxm9fu/Y0wC8lUIsF6ICZEPQ="
+      "version": "1.0.30000747",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000747.tgz",
+      "integrity": "sha1-j1vWweXmBFpNTmxqOlktGeGotRQ="
     },
     "caniuse-lite": {
-      "version": "1.0.30000746",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000746.tgz",
-      "integrity": "sha1-xk+Vo5Jc/TAgejCO12wa6W6gnqA="
+      "version": "1.0.30000747",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000747.tgz",
+      "integrity": "sha1-2obnjhLQZBq+6u5uzVXYG9m9O10="
     },
     "cardinal": {
       "version": "1.0.0",
@@ -3918,9 +3918,9 @@
       "integrity": "sha1-XqtQsor+WAdNDVgpE4iCi15fvJg="
     },
     "chalk": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
-      "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ=="
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.2.0.tgz",
+      "integrity": "sha512-0BMM/2hG3ZaoPfR6F+h/oWpZtsh3b/s62TjSM6MGCJWEbJDN1acqCXvyhhZsDSVFklpebUoQ5O1kKC7lOzrn9g=="
     },
     "cheerio": {
       "version": "0.22.0",
@@ -4800,9 +4800,9 @@
       "integrity": "sha1-Kh4rnlg/9f7Qwgo+4svz91IwpcA="
     },
     "es6-iterator": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.1.tgz",
-      "integrity": "sha1-jjGcnwRTv1ddN0lAplWSDlnKVRI="
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.3.tgz",
+      "integrity": "sha1-p96IkUGgWpSwhUQDstCg+/qY87c="
     },
     "es6-map": {
       "version": "0.1.5",
@@ -5101,9 +5101,9 @@
       "integrity": "sha1-jnVIqW08wjJ+5eZ0FocjozO7oqA="
     },
     "filesize": {
-      "version": "3.5.10",
-      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.5.10.tgz",
-      "integrity": "sha1-/I+iPdtO+eXgq24eZPZ5okpWdh8="
+      "version": "3.5.11",
+      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.5.11.tgz",
+      "integrity": "sha512-ZH7loueKBoDb7yG9esn1U+fgq7BzlzW6NRi5/rMdxIZ05dj7GFD/Xc5rq2CDt5Yq86CyfSYVyx4242QQNZbx1g=="
     },
     "fill-range": {
       "version": "4.0.0",
@@ -5207,6 +5207,549 @@
       "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
       "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
     },
+    "fsevents": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.2.tgz",
+      "integrity": "sha512-Sn44E5wQW4bTHXvQmvSHwqbuiXtduD6Rrjm2ZtUEGbyrig+nUH3t/QD4M4/ZXViY556TBpRgZkHLDx3JxPwxiw==",
+      "optional": true,
+      "dependencies": {
+        "abbrev": {
+          "version": "1.1.0",
+          "bundled": true,
+          "optional": true
+        },
+        "ajv": {
+          "version": "4.11.8",
+          "bundled": true,
+          "optional": true
+        },
+        "ansi-regex": {
+          "version": "2.1.1",
+          "bundled": true
+        },
+        "aproba": {
+          "version": "1.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "are-we-there-yet": {
+          "version": "1.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "asn1": {
+          "version": "0.2.3",
+          "bundled": true,
+          "optional": true
+        },
+        "assert-plus": {
+          "version": "0.2.0",
+          "bundled": true,
+          "optional": true
+        },
+        "asynckit": {
+          "version": "0.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "aws-sign2": {
+          "version": "0.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "aws4": {
+          "version": "1.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "balanced-match": {
+          "version": "0.4.2",
+          "bundled": true
+        },
+        "bcrypt-pbkdf": {
+          "version": "1.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "block-stream": {
+          "version": "0.0.9",
+          "bundled": true
+        },
+        "boom": {
+          "version": "2.10.1",
+          "bundled": true
+        },
+        "brace-expansion": {
+          "version": "1.1.7",
+          "bundled": true
+        },
+        "buffer-shims": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "caseless": {
+          "version": "0.12.0",
+          "bundled": true,
+          "optional": true
+        },
+        "co": {
+          "version": "4.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "code-point-at": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "combined-stream": {
+          "version": "1.0.5",
+          "bundled": true
+        },
+        "concat-map": {
+          "version": "0.0.1",
+          "bundled": true
+        },
+        "console-control-strings": {
+          "version": "1.1.0",
+          "bundled": true
+        },
+        "core-util-is": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "cryptiles": {
+          "version": "2.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "dashdash": {
+          "version": "1.14.1",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "debug": {
+          "version": "2.6.8",
+          "bundled": true,
+          "optional": true
+        },
+        "deep-extend": {
+          "version": "0.4.2",
+          "bundled": true,
+          "optional": true
+        },
+        "delayed-stream": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "delegates": {
+          "version": "1.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "ecc-jsbn": {
+          "version": "0.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "extend": {
+          "version": "3.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "extsprintf": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "forever-agent": {
+          "version": "0.6.1",
+          "bundled": true,
+          "optional": true
+        },
+        "form-data": {
+          "version": "2.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "fs.realpath": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "fstream": {
+          "version": "1.0.11",
+          "bundled": true
+        },
+        "fstream-ignore": {
+          "version": "1.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "gauge": {
+          "version": "2.7.4",
+          "bundled": true,
+          "optional": true
+        },
+        "getpass": {
+          "version": "0.1.7",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "glob": {
+          "version": "7.1.2",
+          "bundled": true
+        },
+        "graceful-fs": {
+          "version": "4.1.11",
+          "bundled": true
+        },
+        "har-schema": {
+          "version": "1.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "har-validator": {
+          "version": "4.2.1",
+          "bundled": true,
+          "optional": true
+        },
+        "has-unicode": {
+          "version": "2.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "hawk": {
+          "version": "3.1.3",
+          "bundled": true,
+          "optional": true
+        },
+        "hoek": {
+          "version": "2.16.3",
+          "bundled": true
+        },
+        "http-signature": {
+          "version": "1.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "inflight": {
+          "version": "1.0.6",
+          "bundled": true
+        },
+        "inherits": {
+          "version": "2.0.3",
+          "bundled": true
+        },
+        "ini": {
+          "version": "1.3.4",
+          "bundled": true,
+          "optional": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "is-typedarray": {
+          "version": "1.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true
+        },
+        "isstream": {
+          "version": "0.1.2",
+          "bundled": true,
+          "optional": true
+        },
+        "jodid25519": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "jsbn": {
+          "version": "0.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "json-schema": {
+          "version": "0.2.3",
+          "bundled": true,
+          "optional": true
+        },
+        "json-stable-stringify": {
+          "version": "1.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "json-stringify-safe": {
+          "version": "5.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "jsonify": {
+          "version": "0.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "jsprim": {
+          "version": "1.4.0",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "mime-db": {
+          "version": "1.27.0",
+          "bundled": true
+        },
+        "mime-types": {
+          "version": "2.1.15",
+          "bundled": true
+        },
+        "minimatch": {
+          "version": "3.0.4",
+          "bundled": true
+        },
+        "minimist": {
+          "version": "0.0.8",
+          "bundled": true
+        },
+        "mkdirp": {
+          "version": "0.5.1",
+          "bundled": true
+        },
+        "ms": {
+          "version": "2.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "node-pre-gyp": {
+          "version": "0.6.36",
+          "bundled": true,
+          "optional": true
+        },
+        "nopt": {
+          "version": "4.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "npmlog": {
+          "version": "4.1.0",
+          "bundled": true,
+          "optional": true
+        },
+        "number-is-nan": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "oauth-sign": {
+          "version": "0.8.2",
+          "bundled": true,
+          "optional": true
+        },
+        "object-assign": {
+          "version": "4.1.1",
+          "bundled": true,
+          "optional": true
+        },
+        "once": {
+          "version": "1.4.0",
+          "bundled": true
+        },
+        "os-homedir": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "os-tmpdir": {
+          "version": "1.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "osenv": {
+          "version": "0.1.4",
+          "bundled": true,
+          "optional": true
+        },
+        "path-is-absolute": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "performance-now": {
+          "version": "0.2.0",
+          "bundled": true,
+          "optional": true
+        },
+        "process-nextick-args": {
+          "version": "1.0.7",
+          "bundled": true
+        },
+        "punycode": {
+          "version": "1.4.1",
+          "bundled": true,
+          "optional": true
+        },
+        "qs": {
+          "version": "6.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "rc": {
+          "version": "1.2.1",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "minimist": {
+              "version": "1.2.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "readable-stream": {
+          "version": "2.2.9",
+          "bundled": true
+        },
+        "request": {
+          "version": "2.81.0",
+          "bundled": true,
+          "optional": true
+        },
+        "rimraf": {
+          "version": "2.6.1",
+          "bundled": true
+        },
+        "safe-buffer": {
+          "version": "5.0.1",
+          "bundled": true
+        },
+        "semver": {
+          "version": "5.3.0",
+          "bundled": true,
+          "optional": true
+        },
+        "set-blocking": {
+          "version": "2.0.0",
+          "bundled": true,
+          "optional": true
+        },
+        "signal-exit": {
+          "version": "3.0.2",
+          "bundled": true,
+          "optional": true
+        },
+        "sntp": {
+          "version": "1.0.9",
+          "bundled": true,
+          "optional": true
+        },
+        "sshpk": {
+          "version": "1.13.0",
+          "bundled": true,
+          "optional": true,
+          "dependencies": {
+            "assert-plus": {
+              "version": "1.0.0",
+              "bundled": true,
+              "optional": true
+            }
+          }
+        },
+        "string_decoder": {
+          "version": "1.0.1",
+          "bundled": true
+        },
+        "string-width": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "stringstream": {
+          "version": "0.0.5",
+          "bundled": true,
+          "optional": true
+        },
+        "strip-ansi": {
+          "version": "3.0.1",
+          "bundled": true
+        },
+        "strip-json-comments": {
+          "version": "2.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "tar": {
+          "version": "2.2.1",
+          "bundled": true
+        },
+        "tar-pack": {
+          "version": "3.4.0",
+          "bundled": true,
+          "optional": true
+        },
+        "tough-cookie": {
+          "version": "2.3.2",
+          "bundled": true,
+          "optional": true
+        },
+        "tunnel-agent": {
+          "version": "0.6.0",
+          "bundled": true,
+          "optional": true
+        },
+        "tweetnacl": {
+          "version": "0.14.5",
+          "bundled": true,
+          "optional": true
+        },
+        "uid-number": {
+          "version": "0.0.6",
+          "bundled": true,
+          "optional": true
+        },
+        "util-deprecate": {
+          "version": "1.0.2",
+          "bundled": true
+        },
+        "uuid": {
+          "version": "3.0.1",
+          "bundled": true,
+          "optional": true
+        },
+        "verror": {
+          "version": "1.3.6",
+          "bundled": true,
+          "optional": true
+        },
+        "wide-align": {
+          "version": "1.1.2",
+          "bundled": true,
+          "optional": true
+        },
+        "wrappy": {
+          "version": "1.0.2",
+          "bundled": true
+        }
+      }
+    },
     "fstream": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
@@ -5425,9 +5968,9 @@
       "integrity": "sha1-/Xqtcmvxpf0W38KbL3pmAdJxOcQ="
     },
     "handlebars": {
-      "version": "4.0.10",
-      "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.0.10.tgz",
-      "integrity": "sha1-PTDHGLCaPZbyPqTMH0A8TTup/08=",
+      "version": "4.0.11",
+      "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.0.11.tgz",
+      "integrity": "sha1-Ywo13+ApS8KB7a5v/F0yn8eYLcw=",
       "dependencies": {
         "async": {
           "version": "1.5.2",
@@ -7463,9 +8006,9 @@
       "integrity": "sha512-ufX0JB8kePhv4DZNeOzJmkG4J5JMDUnEx22xlYc7yEpByaqTsVl9CWixrKvOlN27+LsnUoU0GqwgspFZd5OaJw=="
     },
     "office-ui-fabric-react": {
-      "version": "5.9.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.9.0.tgz",
-      "integrity": "sha512-+WuNSZEaCREhcJrDJXgpwCkWVWhZ24dOC4mbt7TgFMaXQTFeFrYOG7viRtad8E8yUBNIJ4SSHFDjPTcvfh+RHw=="
+      "version": "5.10.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.10.0.tgz",
+      "integrity": "sha512-+GokE/FRl6tEC1fOm2SNdEaT3Wb9+Ve4VY5oVbn2DMEG+dpy0KZnOqxszvEml+GZUuoRip4ptIT3jIvtO21c5w=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -8949,7 +9492,14 @@
     "prettycli": {
       "version": "1.4.3",
       "resolved": "https://registry.npmjs.org/prettycli/-/prettycli-1.4.3.tgz",
-      "integrity": "sha512-KLiwAXXfSWXZqGmZlnKPuGMTFp+0QbcySplL1ft9gfteT/BNsG64Xo8u2Qr9r+qnsIZWBQ66Zs8tg+8s2fmzvw=="
+      "integrity": "sha512-KLiwAXXfSWXZqGmZlnKPuGMTFp+0QbcySplL1ft9gfteT/BNsG64Xo8u2Qr9r+qnsIZWBQ66Zs8tg+8s2fmzvw==",
+      "dependencies": {
+        "chalk": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
+          "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ=="
+        }
+      }
     },
     "private": {
       "version": "0.1.8",
@@ -10370,9 +10920,9 @@
       }
     },
     "supports-color": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.4.0.tgz",
-      "integrity": "sha512-rKC3+DyXWgK0ZLKwmRsrkyHVZAjNkfzeehuFWdGGcqGDTZFH73+RH6S/RDAAxl9GusSjZSUWYLmT9N5pzXFOXQ=="
+      "version": "4.5.0",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.5.0.tgz",
+      "integrity": "sha1-vnoN5ITexcXN34s9WRJQRJEvY1s="
     },
     "svg-tag-names": {
       "version": "1.1.1",
@@ -10625,9 +11175,9 @@
       "integrity": "sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM="
     },
     "ts-jest": {
-      "version": "21.1.2",
-      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-21.1.2.tgz",
-      "integrity": "sha512-bcYDSvjxL1ralSBxAnM1fY6D3suWDMe73feNIEDKSuM30AsRag2ktv+9YcfM+ctXVUKFFJDyxZDNsHiFTz98lQ==",
+      "version": "21.1.3",
+      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-21.1.3.tgz",
+      "integrity": "sha512-hTRIvxOjykHeuaNC9XkdNk+dbrt1NYzV3C6/CN4Ty9mCtBWrDLNCUtny9gKoIJS0UtwteuSmEdoLgr2biL+bDw==",
       "dependencies": {
         "camelcase": {
           "version": "4.1.0",
@@ -11022,9 +11572,9 @@
       "integrity": "sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg=="
     },
     "webpack": {
-      "version": "3.7.1",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-3.7.1.tgz",
-      "integrity": "sha512-8MR+gVfxsvtx4J1UlbRGkUJEpDQUBFmisRmpPO5cVLgF21R8UMChX39OOjDz63a+m/iswGoqATszdZB2VCsYuA==",
+      "version": "3.8.1",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-3.8.1.tgz",
+      "integrity": "sha512-5ZXLWWsMqHKFr5y0N3Eo5IIisxeEeRAajNq4mELb/WELOR7srdbQk2N5XiyNy2A/AgvlR3AmeBCZJW8lHrolbw==",
       "dependencies": {
         "acorn": {
           "version": "5.1.2",
@@ -11420,4 +11970,4 @@
       }
     }
   }
-}
\ No newline at end of file
+}

From cdb18aaac357aa7d91bc2dd9af3f5756de00b4cb Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Thu, 19 Oct 2017 09:43:35 -0700
Subject: [PATCH 0884/1641] Icons: updated fabric-icon sets with subsetter
 (#3129)

* Updated font sets with logos

* Updated IconNames and configs to reflect changes to icon sets

* Added change files

* Removed website change file - separated out PRs

* Refreshed set 6 with ShareiOS
---
 .../icons/cela-fixes_2017-10-16-20-55.json     | 11 +++++++++++
 packages/icons/config/fabric-icons-10.json     | 18 +-----------------
 packages/icons/config/fabric-icons-4.json      | 18 +-----------------
 packages/icons/config/fabric-icons-5.json      |  6 +-----
 packages/icons/config/fabric-icons-6.json      | 10 +---------
 packages/icons/src/IconNames.ts                | 11 -----------
 packages/icons/src/fabric-icons-10-inline.ts   |  6 +-----
 packages/icons/src/fabric-icons-10.ts          |  6 +-----
 packages/icons/src/fabric-icons-4-inline.ts    |  8 ++------
 packages/icons/src/fabric-icons-4.ts           |  8 ++------
 packages/icons/src/fabric-icons-5-inline.ts    |  3 +--
 packages/icons/src/fabric-icons-5.ts           |  3 +--
 packages/icons/src/fabric-icons-6-inline.ts    |  4 +---
 packages/icons/src/fabric-icons-6.ts           |  4 +---
 14 files changed, 25 insertions(+), 91 deletions(-)
 create mode 100644 common/changes/@uifabric/icons/cela-fixes_2017-10-16-20-55.json

diff --git a/common/changes/@uifabric/icons/cela-fixes_2017-10-16-20-55.json b/common/changes/@uifabric/icons/cela-fixes_2017-10-16-20-55.json
new file mode 100644
index 0000000000000..1fda240f91612
--- /dev/null
+++ b/common/changes/@uifabric/icons/cela-fixes_2017-10-16-20-55.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "Updated icon sets to remove certain logos.",
+      "packageName": "@uifabric/icons",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/icons",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-10.json b/packages/icons/config/fabric-icons-10.json
index d1dbc8f15ea8d..f4e4b4a7689d0 100644
--- a/packages/icons/config/fabric-icons-10.json
+++ b/packages/icons/config/fabric-icons-10.json
@@ -2,7 +2,7 @@
 	"fontName": "fabric-icons-10",
 	"fontFamilyName": "FabricMDL2Icons-10",
 	"excludeGlyphs": false,
-	"chunkSubsets": true,
+	"chunkSubsets": false,
 	"hashFontFileName": true,
 	"subsetChunkSettings": {
 		"maxSubsetSize": 100
@@ -152,22 +152,6 @@
 			"name": "ChevronRightEnd6",
 			"unicode": "F372"
 		},
-		{
-			"name": "EgnyteLogo",
-			"unicode": "F373"
-		},
-		{
-			"name": "GoogleDriveLogoLeftGreen",
-			"unicode": "F374"
-		},
-		{
-			"name": "GoogleDriveLogoBottomBlue",
-			"unicode": "F375"
-		},
-		{
-			"name": "GoogleDriveLogoRightYellow",
-			"unicode": "F376"
-		},
 		{
 			"name": "AzureAPIManagement",
 			"unicode": "F37F"
diff --git a/packages/icons/config/fabric-icons-4.json b/packages/icons/config/fabric-icons-4.json
index d250f6c1c128c..8f4d52e86d2e7 100644
--- a/packages/icons/config/fabric-icons-4.json
+++ b/packages/icons/config/fabric-icons-4.json
@@ -2,7 +2,7 @@
 	"fontName": "fabric-icons-4",
 	"fontFamilyName": "FabricMDL2Icons-4",
 	"excludeGlyphs": false,
-	"chunkSubsets": true,
+	"chunkSubsets": false,
 	"hashFontFileName": true,
 	"subsetChunkSettings": {
 		"maxSubsetSize": 100
@@ -192,10 +192,6 @@
 			"name": "POI",
 			"unicode": "ECAF"
 		},
-		{
-			"name": "FacebookLogo",
-			"unicode": "ECB3"
-		},
 		{
 			"name": "AddTo",
 			"unicode": "ECC8"
@@ -380,18 +376,10 @@
 			"name": "AdminYLogoInverse32",
 			"unicode": "ED73"
 		},
-		{
-			"name": "BoxLogo",
-			"unicode": "ED75"
-		},
 		{
 			"name": "DelveLogoInverse",
 			"unicode": "ED76"
 		},
-		{
-			"name": "DropboxLogo",
-			"unicode": "ED77"
-		},
 		{
 			"name": "ExchangeLogoInverse",
 			"unicode": "ED78"
@@ -403,10 +391,6 @@
 		{
 			"name": "OfficeVideoLogoInverse",
 			"unicode": "ED7A"
-		},
-		{
-			"name": "ParatureLogo",
-			"unicode": "ED7B"
 		}
 	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-5.json b/packages/icons/config/fabric-icons-5.json
index a7a0fdeeea738..57ae89ef62557 100644
--- a/packages/icons/config/fabric-icons-5.json
+++ b/packages/icons/config/fabric-icons-5.json
@@ -2,7 +2,7 @@
 	"fontName": "fabric-icons-5",
 	"fontFamilyName": "FabricMDL2Icons-5",
 	"excludeGlyphs": false,
-	"chunkSubsets": true,
+	"chunkSubsets": false,
 	"hashFontFileName": true,
 	"subsetChunkSettings": {
 		"maxSubsetSize": 100
@@ -328,10 +328,6 @@
 			"name": "ReplyAll",
 			"unicode": "EE0A"
 		},
-		{
-			"name": "GoogleDriveLogo",
-			"unicode": "EE0B"
-		},
 		{
 			"name": "Questionnaire",
 			"unicode": "EE19"
diff --git a/packages/icons/config/fabric-icons-6.json b/packages/icons/config/fabric-icons-6.json
index a947e7ec8a447..99a1066e731f4 100644
--- a/packages/icons/config/fabric-icons-6.json
+++ b/packages/icons/config/fabric-icons-6.json
@@ -2,7 +2,7 @@
 	"fontName": "fabric-icons-6",
 	"fontFamilyName": "FabricMDL2Icons-6",
 	"excludeGlyphs": false,
-	"chunkSubsets": true,
+	"chunkSubsets": false,
 	"hashFontFileName": true,
 	"subsetChunkSettings": {
 		"maxSubsetSize": 100
@@ -372,14 +372,6 @@
 			"name": "Hide2",
 			"unicode": "EF89"
 		},
-		{
-			"name": "iOSAppStoreLogo",
-			"unicode": "EF8A"
-		},
-		{
-			"name": "AndroidLogo",
-			"unicode": "EF8B"
-		},
 		{
 			"name": "Breadcrumb",
 			"unicode": "EF8C"
diff --git a/packages/icons/src/IconNames.ts b/packages/icons/src/IconNames.ts
index d3656466cd088..995f7100446d1 100644
--- a/packages/icons/src/IconNames.ts
+++ b/packages/icons/src/IconNames.ts
@@ -485,7 +485,6 @@ export const enum IconNames {
   Photo2Add = 'Photo2Add',
   Photo2Remove = 'Photo2Remove',
   POI = 'POI',
-  FacebookLogo = 'FacebookLogo',
   AddTo = 'AddTo',
   RadioBtnOff = 'RadioBtnOff',
   RadioBtnOn = 'RadioBtnOn',
@@ -533,13 +532,10 @@ export const enum IconNames {
   AdminPLogoInverse32 = 'AdminPLogoInverse32',
   AdminSLogoInverse32 = 'AdminSLogoInverse32',
   AdminYLogoInverse32 = 'AdminYLogoInverse32',
-  BoxLogo = 'BoxLogo',
   DelveLogoInverse = 'DelveLogoInverse',
-  DropboxLogo = 'DropboxLogo',
   ExchangeLogoInverse = 'ExchangeLogoInverse',
   LyncLogo = 'LyncLogo',
   OfficeVideoLogoInverse = 'OfficeVideoLogoInverse',
-  ParatureLogo = 'ParatureLogo',
   SocialListeningLogo = 'SocialListeningLogo',
   VisioLogoInverse = 'VisioLogoInverse',
   Balloons = 'Balloons',
@@ -622,7 +618,6 @@ export const enum IconNames {
   SingleBookmark = 'SingleBookmark',
   DoubleChevronDown = 'DoubleChevronDown',
   ReplyAll = 'ReplyAll',
-  GoogleDriveLogo = 'GoogleDriveLogo',
   Questionnaire = 'Questionnaire',
   ReplyMirrored = 'ReplyMirrored',
   ReplyAllMirrored = 'ReplyAllMirrored',
@@ -740,8 +735,6 @@ export const enum IconNames {
   RecycleBin = 'RecycleBin',
   EmptyRecycleBin = 'EmptyRecycleBin',
   Hide2 = 'Hide2',
-  iOSAppStoreLogo = 'iOSAppStoreLogo',
-  AndroidLogo = 'AndroidLogo',
   Breadcrumb = 'Breadcrumb',
   ClearFilter = 'ClearFilter',
   Flow = 'Flow',
@@ -1089,10 +1082,6 @@ export const enum IconNames {
   ChevronUpEnd6 = 'ChevronUpEnd6',
   ChevronLeftEnd6 = 'ChevronLeftEnd6',
   ChevronRightEnd6 = 'ChevronRightEnd6',
-  EgnyteLogo = 'EgnyteLogo',
-  GoogleDriveLogoLeftGreen = 'GoogleDriveLogoLeftGreen',
-  GoogleDriveLogoBottomBlue = 'GoogleDriveLogoBottomBlue',
-  GoogleDriveLogoRightYellow = 'GoogleDriveLogoRightYellow',
   AzureAPIManagement = 'AzureAPIManagement',
   AzureServiceEndpoint = 'AzureServiceEndpoint',
   VSTSLogo = 'VSTSLogo',
diff --git a/packages/icons/src/fabric-icons-10-inline.ts b/packages/icons/src/fabric-icons-10-inline.ts
index cf074558baf3d..9be3bd2af8260 100644
--- a/packages/icons/src/fabric-icons-10-inline.ts
+++ b/packages/icons/src/fabric-icons-10-inline.ts
@@ -13,7 +13,7 @@ export function initializeIcons(baseUrl: string = ''): void {
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-10"`,
-      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
+      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
     },
     icons: {
       'BankSolid': '\uF34F',
@@ -52,10 +52,6 @@ export function initializeIcons(baseUrl: string = ''): void {
       'ChevronUpEnd6': '\uF370',
       'ChevronLeftEnd6': '\uF371',
       'ChevronRightEnd6': '\uF372',
-      'EgnyteLogo': '\uF373',
-      'GoogleDriveLogoLeftGreen': '\uF374',
-      'GoogleDriveLogoBottomBlue': '\uF375',
-      'GoogleDriveLogoRightYellow': '\uF376',
       'AzureAPIManagement': '\uF37F',
       'AzureServiceEndpoint': '\uF380',
       'VSTSLogo': '\uF381',
diff --git a/packages/icons/src/fabric-icons-10.ts b/packages/icons/src/fabric-icons-10.ts
index b4c91710d8ca4..eef344ce8998a 100644
--- a/packages/icons/src/fabric-icons-10.ts
+++ b/packages/icons/src/fabric-icons-10.ts
@@ -13,7 +13,7 @@ export function initializeIcons(baseUrl: string = ''): void {
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-10"`,
-      src: `url('${baseUrl}fabric-icons-10-795d6e25.woff') format('woff')`, 
+      src: `url('${baseUrl}fabric-icons-10-a9486bb8.woff') format('woff')`, 
     },
     icons: {
       'BankSolid': '\uF34F',
@@ -52,10 +52,6 @@ export function initializeIcons(baseUrl: string = ''): void {
       'ChevronUpEnd6': '\uF370',
       'ChevronLeftEnd6': '\uF371',
       'ChevronRightEnd6': '\uF372',
-      'EgnyteLogo': '\uF373',
-      'GoogleDriveLogoLeftGreen': '\uF374',
-      'GoogleDriveLogoBottomBlue': '\uF375',
-      'GoogleDriveLogoRightYellow': '\uF376',
       'AzureAPIManagement': '\uF37F',
       'AzureServiceEndpoint': '\uF380',
       'VSTSLogo': '\uF381',
diff --git a/packages/icons/src/fabric-icons-4-inline.ts b/packages/icons/src/fabric-icons-4-inline.ts
index 74e9384b837cd..0ab8553d50318 100644
--- a/packages/icons/src/fabric-icons-4-inline.ts
+++ b/packages/icons/src/fabric-icons-4-inline.ts
@@ -13,7 +13,7 @@ export function initializeIcons(baseUrl: string = ''): void {
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-4"`,
-      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
+      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
     },
     icons: {
       'ReminderGroup': '\uEBF8',
@@ -62,7 +62,6 @@ export function initializeIcons(baseUrl: string = ''): void {
       'Photo2Add': '\uECAB',
       'Photo2Remove': '\uECAC',
       'POI': '\uECAF',
-      'FacebookLogo': '\uECB3',
       'AddTo': '\uECC8',
       'RadioBtnOff': '\uECCA',
       'RadioBtnOn': '\uECCB',
@@ -109,13 +108,10 @@ export function initializeIcons(baseUrl: string = ''): void {
       'AdminPLogoInverse32': '\uED71',
       'AdminSLogoInverse32': '\uED72',
       'AdminYLogoInverse32': '\uED73',
-      'BoxLogo': '\uED75',
       'DelveLogoInverse': '\uED76',
-      'DropboxLogo': '\uED77',
       'ExchangeLogoInverse': '\uED78',
       'LyncLogo': '\uED79',
-      'OfficeVideoLogoInverse': '\uED7A',
-      'ParatureLogo': '\uED7B'
+      'OfficeVideoLogoInverse': '\uED7A'
     }
   });
 }
diff --git a/packages/icons/src/fabric-icons-4.ts b/packages/icons/src/fabric-icons-4.ts
index f95af49e34ffd..16ee779fcc03a 100644
--- a/packages/icons/src/fabric-icons-4.ts
+++ b/packages/icons/src/fabric-icons-4.ts
@@ -13,7 +13,7 @@ export function initializeIcons(baseUrl: string = ''): void {
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-4"`,
-      src: `url('${baseUrl}fabric-icons-4-03329fef.woff') format('woff')`, 
+      src: `url('${baseUrl}fabric-icons-4-46fbc7bc.woff') format('woff')`, 
     },
     icons: {
       'ReminderGroup': '\uEBF8',
@@ -62,7 +62,6 @@ export function initializeIcons(baseUrl: string = ''): void {
       'Photo2Add': '\uECAB',
       'Photo2Remove': '\uECAC',
       'POI': '\uECAF',
-      'FacebookLogo': '\uECB3',
       'AddTo': '\uECC8',
       'RadioBtnOff': '\uECCA',
       'RadioBtnOn': '\uECCB',
@@ -109,13 +108,10 @@ export function initializeIcons(baseUrl: string = ''): void {
       'AdminPLogoInverse32': '\uED71',
       'AdminSLogoInverse32': '\uED72',
       'AdminYLogoInverse32': '\uED73',
-      'BoxLogo': '\uED75',
       'DelveLogoInverse': '\uED76',
-      'DropboxLogo': '\uED77',
       'ExchangeLogoInverse': '\uED78',
       'LyncLogo': '\uED79',
-      'OfficeVideoLogoInverse': '\uED7A',
-      'ParatureLogo': '\uED7B'
+      'OfficeVideoLogoInverse': '\uED7A'
     }
   });
 }
diff --git a/packages/icons/src/fabric-icons-5-inline.ts b/packages/icons/src/fabric-icons-5-inline.ts
index 63b2c4440162d..399706134e442 100644
--- a/packages/icons/src/fabric-icons-5-inline.ts
+++ b/packages/icons/src/fabric-icons-5-inline.ts
@@ -13,7 +13,7 @@ export function initializeIcons(baseUrl: string = ''): void {
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-5"`,
-      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
+      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
     },
     icons: {
       'SocialListeningLogo': '\uED7C',
@@ -96,7 +96,6 @@ export function initializeIcons(baseUrl: string = ''): void {
       'SingleBookmark': '\uEDFF',
       'DoubleChevronDown': '\uEE04',
       'ReplyAll': '\uEE0A',
-      'GoogleDriveLogo': '\uEE0B',
       'Questionnaire': '\uEE19',
       'ReplyMirrored': '\uEE35',
       'ReplyAllMirrored': '\uEE36',
diff --git a/packages/icons/src/fabric-icons-5.ts b/packages/icons/src/fabric-icons-5.ts
index 5eef18918ebdb..e41ce2e610332 100644
--- a/packages/icons/src/fabric-icons-5.ts
+++ b/packages/icons/src/fabric-icons-5.ts
@@ -13,7 +13,7 @@ export function initializeIcons(baseUrl: string = ''): void {
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-5"`,
-      src: `url('${baseUrl}fabric-icons-5-82c8b87c.woff') format('woff')`, 
+      src: `url('${baseUrl}fabric-icons-5-5bc71068.woff') format('woff')`, 
     },
     icons: {
       'SocialListeningLogo': '\uED7C',
@@ -96,7 +96,6 @@ export function initializeIcons(baseUrl: string = ''): void {
       'SingleBookmark': '\uEDFF',
       'DoubleChevronDown': '\uEE04',
       'ReplyAll': '\uEE0A',
-      'GoogleDriveLogo': '\uEE0B',
       'Questionnaire': '\uEE19',
       'ReplyMirrored': '\uEE35',
       'ReplyAllMirrored': '\uEE36',
diff --git a/packages/icons/src/fabric-icons-6-inline.ts b/packages/icons/src/fabric-icons-6-inline.ts
index 4eeabd25ec662..065ca23d3a5ff 100644
--- a/packages/icons/src/fabric-icons-6-inline.ts
+++ b/packages/icons/src/fabric-icons-6-inline.ts
@@ -13,7 +13,7 @@ export function initializeIcons(baseUrl: string = ''): void {
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-6"`,
-      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
+      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
     },
     icons: {
       'CalendarAgenda': '\uEE9A',
@@ -107,8 +107,6 @@ export function initializeIcons(baseUrl: string = ''): void {
       'RecycleBin': '\uEF87',
       'EmptyRecycleBin': '\uEF88',
       'Hide2': '\uEF89',
-      'iOSAppStoreLogo': '\uEF8A',
-      'AndroidLogo': '\uEF8B',
       'Breadcrumb': '\uEF8C',
       'PageEdit': '\uEFB6',
       'Database': '\uEFC7',
diff --git a/packages/icons/src/fabric-icons-6.ts b/packages/icons/src/fabric-icons-6.ts
index 782b5bb7d014a..3b7c283f98d16 100644
--- a/packages/icons/src/fabric-icons-6.ts
+++ b/packages/icons/src/fabric-icons-6.ts
@@ -13,7 +13,7 @@ export function initializeIcons(baseUrl: string = ''): void {
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-6"`,
-      src: `url('${baseUrl}fabric-icons-6-2ab76fc9.woff') format('woff')`, 
+      src: `url('${baseUrl}fabric-icons-6-328cd253.woff') format('woff')`, 
     },
     icons: {
       'CalendarAgenda': '\uEE9A',
@@ -107,8 +107,6 @@ export function initializeIcons(baseUrl: string = ''): void {
       'RecycleBin': '\uEF87',
       'EmptyRecycleBin': '\uEF88',
       'Hide2': '\uEF89',
-      'iOSAppStoreLogo': '\uEF8A',
-      'AndroidLogo': '\uEF8B',
       'Breadcrumb': '\uEF8C',
       'PageEdit': '\uEFB6',
       'Database': '\uEFC7',

From 8e2ad86f359aa2029d14b2becd9d961e96cfe11e Mon Sep 17 00:00:00 2001
From: Bryan Watts <brwatt@microsoft.com>
Date: Thu, 19 Oct 2017 10:52:24 -0700
Subject: [PATCH 0885/1641] Fix minor state update bug with Sticky (#3154)

* Fix minor state update bug with Sticky

* add change file
---
 .../brwatt-sticky-fix_2017-10-18-23-12.json           | 11 +++++++++++
 .../src/components/Sticky/Sticky.tsx                  |  5 ++++-
 2 files changed, 15 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/brwatt-sticky-fix_2017-10-18-23-12.json

diff --git a/common/changes/office-ui-fabric-react/brwatt-sticky-fix_2017-10-18-23-12.json b/common/changes/office-ui-fabric-react/brwatt-sticky-fix_2017-10-18-23-12.json
new file mode 100644
index 0000000000000..1e43b43840553
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/brwatt-sticky-fix_2017-10-18-23-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix minor state update bug with Sticky",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "brwatt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
index 646b4d04c6516..ad8b7611ba688 100644
--- a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
+++ b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
@@ -93,6 +93,7 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
     if (this.props.children !== prevProps.children) {
       ReactDOM.render(<div>{ this.props.children }</div>, this.content);
     }
+
     if (isStickyTop && !prevState.isStickyTop) {
       this._setSticky(() => {
         scrollablePane.addStickyHeader(this);
@@ -101,7 +102,9 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
       this._resetSticky(() => {
         scrollablePane.removeStickyHeader(this);
       });
-    } else if (isStickyBottom && !prevState.isStickyBottom) {
+    }
+
+    if (isStickyBottom && !prevState.isStickyBottom) {
       this._setSticky(() => {
         scrollablePane.addStickyFooter(this);
       });

From dcee15b2a8e47acc3b7bd5fd4f3125139c660a62 Mon Sep 17 00:00:00 2001
From: Bryan Watts <brwatt@microsoft.com>
Date: Thu, 19 Oct 2017 10:52:33 -0700
Subject: [PATCH 0886/1641] Add a way to force a layout update for
 ScrollablePane (#3152)

* Add a way to force a layout update for ScrollablePane

* Add change file
---
 .../brwatt-scrollable-ref_2017-10-18-22-20.json       | 11 +++++++++++
 .../components/ScrollablePane/ScrollablePane.Props.ts | 10 ++++++++--
 .../src/components/ScrollablePane/ScrollablePane.tsx  |  8 ++++++--
 3 files changed, 25 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/brwatt-scrollable-ref_2017-10-18-22-20.json

diff --git a/common/changes/office-ui-fabric-react/brwatt-scrollable-ref_2017-10-18-22-20.json b/common/changes/office-ui-fabric-react/brwatt-scrollable-ref_2017-10-18-22-20.json
new file mode 100644
index 0000000000000..14c511058231f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/brwatt-scrollable-ref_2017-10-18-22-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add a way to force a layout update for ScrollablePane",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "brwatt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.Props.ts b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.Props.ts
index 50b229bb05c1c..c55e41bd2d365 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.Props.ts
@@ -1,11 +1,17 @@
 import * as React from 'react';
 import { ScrollablePane } from './ScrollablePane';
 
+export interface IScrollablePane {
+  /** Triggers a layout update for the pane. */
+  forceLayoutUpdate(): void;
+}
+
 export interface IScrollablePaneProps extends React.HTMLAttributes<HTMLElement | ScrollablePane> {
   /**
-   * Gets ref to component interface.
+   * Optional callback to access the IScrollablePane interface. Use this instead of ref for accessing
+   * the public methods and properties of the component.
    */
-  componentRef?: (component: IScrollablePaneProps) => void;
+  componentRef?: (component: IScrollablePane) => void;
 
   /**
    * Class name to apply to the root in addition to ms-ScrollablePane.
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
index ec5ccdf7cb3da..00cefe71ef610 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
@@ -8,7 +8,7 @@ import {
   BaseComponent,
   css
 } from '../../Utilities';
-import { IScrollablePaneProps } from './ScrollablePane.Props';
+import { IScrollablePane, IScrollablePaneProps } from './ScrollablePane.Props';
 import { Sticky } from '../../Sticky';
 import * as stylesImport from './ScrollablePane.scss';
 const styles: any = stylesImport;
@@ -17,7 +17,7 @@ export interface IScrollablePaneContext {
   scrollablePane: PropTypes.Requireable<object>;
 }
 
-export class ScrollablePane extends BaseComponent<IScrollablePaneProps, {}> {
+export class ScrollablePane extends BaseComponent<IScrollablePaneProps, {}> implements IScrollablePane {
   public static childContextTypes: IScrollablePaneContext = {
     scrollablePane: PropTypes.object
   };
@@ -96,6 +96,10 @@ export class ScrollablePane extends BaseComponent<IScrollablePaneProps, {}> {
     );
   }
 
+  public forceLayoutUpdate() {
+    this._onWindowResize();
+  }
+
   @autobind
   public subscribe(handler: (headerBound: ClientRect, footerBound: ClientRect) => void) {
     this._subscribers.add(handler);

From 1bec4b511555bb5d30c63e15bad62f50d04a9a7d Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Thu, 19 Oct 2017 11:25:52 -0700
Subject: [PATCH 0887/1641] Split Button in Menus: Launch Menu with right arrow
 key (#3162)

* Launch split button menu with right arrow key

* Fix styling bug introduced with previous commit

* Add npm run change file

* Update malozano-splitMenuLaunch_2017-10-19-15-20.json
---
 .../malozano-splitMenuLaunch_2017-10-19-15-20.json    | 11 +++++++++++
 .../src/components/ContextualMenu/ContextualMenu.tsx  |  5 ++++-
 .../examples/ContextualMenu.Checkmarks.Example.tsx    |  2 +-
 3 files changed, 16 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/malozano-splitMenuLaunch_2017-10-19-15-20.json

diff --git a/common/changes/office-ui-fabric-react/malozano-splitMenuLaunch_2017-10-19-15-20.json b/common/changes/office-ui-fabric-react/malozano-splitMenuLaunch_2017-10-19-15-20.json
new file mode 100644
index 0000000000000..8913130061d15
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-splitMenuLaunch_2017-10-19-15-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Menu Split Button: Launch split button menu with right arrow key",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 66887df7a6c21..d8be240064e9d 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -557,8 +557,11 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       subMenuProps: item.subMenuProps,
       submenuIconProps: item.submenuIconProps
     } as IContextualMenuItem;
+
     return React.createElement('button',
-      getNativeProps(itemProps, buttonProperties),
+      assign({}, getNativeProps(itemProps, buttonProperties), {
+        onKeyDown: this._onItemKeyDown.bind(this, item)
+      }),
       this._renderMenuItemChildren(itemProps, classNames, index, false, false));
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
index 5e32382c898c2..6af6abd3a1608 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
@@ -30,7 +30,7 @@ export class ContextualMenuCheckmarksExample extends React.Component<any, IConte
         text='Click for ContextualMenu'
         menuProps={
           {
-            shouldFocusOnMount: false,
+            shouldFocusOnMount: true,
             items:
             [
               {

From 36d809394bb470422763fda1a5b6cec95c9afd6e Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Thu, 19 Oct 2017 16:18:13 -0700
Subject: [PATCH 0888/1641] Jest: Added snapshot tests (#3155)

* Added tests

* Additional tests

* Added tests

* Update tests

* Update tests
---
 .../ActivityItem/ActivitiyItem.test.tsx       |  19 +
 .../__snapshots__/ActivitiyItem.test.tsx.snap |  70 +++
 .../src/components/Button/Button.test.tsx     | 566 +++++++++--------
 .../Button/__snapshots__/Button.test.tsx.snap | 578 ++++++++++++++++++
 .../src/components/Checkbox/Checkbox.test.tsx |  16 +
 .../__snapshots__/Checkbox.test.tsx.snap      | 131 ++++
 .../components/DatePicker/DatePicker.test.tsx |  13 +
 .../__snapshots__/DatePicker.test.tsx.snap    |  57 ++
 .../src/components/Dialog/Dialog.test.tsx     |   8 +
 .../Dialog/__snapshots__/Dialog.test.tsx.snap |  27 +
 .../DocumentCard/DocumentCard.test.tsx        |  29 +
 .../__snapshots__/DocumentCard.test.tsx.snap  |  87 +++
 .../src/components/Icon/Icon.test.tsx         |  12 +
 .../Icon/__snapshots__/Icon.test.tsx.snap     |  15 +
 .../src/components/Link/Link.test.tsx         |  12 +
 .../Link/__snapshots__/Link.test.tsx.snap     |  12 +
 .../src/components/List/List.test.tsx         |  16 +
 .../List/__snapshots__/List.test.tsx.snap     |  13 +
 .../src/components/Nav/Nav.test.tsx           |  23 +
 .../Nav/__snapshots__/Nav.test.tsx.snap       | 164 +++++
 .../src/components/Persona/Persona.test.tsx   |  15 +-
 .../__snapshots__/Persona.test.tsx.snap       | 201 ++++++
 .../src/components/Pivot/Pivot.test.tsx       |  17 +
 .../Pivot/__snapshots__/Pivot.test.tsx.snap   | 216 +++++++
 .../ProgressIndicator.test.tsx                |  12 +
 .../ProgressIndicator.test.tsx.snap           |  38 ++
 26 files changed, 2114 insertions(+), 253 deletions(-)
 create mode 100644 packages/office-ui-fabric-react/src/components/ActivityItem/ActivitiyItem.test.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivitiyItem.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.test.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/Dialog/__snapshots__/Dialog.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.test.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/Icon/Icon.test.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Icon/__snapshots__/Icon.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/Link/Link.test.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/List/List.test.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/List/__snapshots__/List.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/Nav/Nav.test.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/Pivot/Pivot.test.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.test.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ProgressIndicator/__snapshots__/ProgressIndicator.test.tsx.snap

diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivitiyItem.test.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivitiyItem.test.tsx
new file mode 100644
index 0000000000000..c91fd19c2baec
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivitiyItem.test.tsx
@@ -0,0 +1,19 @@
+import * as React from 'react';
+import * as renderer from 'react-test-renderer';
+
+import { ActivityItem } from './ActivityItem';
+
+const defaultProps = {
+  key: 1,
+  activityDescription: <span>Activity description content</span>,
+  comments: <span>Comment content</span>,
+  timeStamp: 'Timestamp content'
+};
+
+describe('ActivityItem', () => {
+  it('renders ActivitiyItem correctly', () => {
+    const component = renderer.create(<ActivityItem {...defaultProps} />);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivitiyItem.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivitiyItem.test.tsx.snap
new file mode 100644
index 0000000000000..f3773b3806034
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivitiyItem.test.tsx.snap
@@ -0,0 +1,70 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ActivityItem renders ActivitiyItem correctly 1`] = `
+<div
+  className=
+      ms-ActivityItem
+      {
+        -moz-osx-font-smoothing: grayscale;
+        -webkit-font-smoothing: antialiased;
+        align-items: flex-start;
+        box-sizing: border-box;
+        color: #666666;
+        display: flex;
+        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-size: 12px;
+        font-weight: 400;
+        justify-content: flex-start;
+        line-height: 17px;
+      }
+  style={undefined}
+>
+  <div
+    className=
+        ms-ActivityItem-activityContent
+        {
+          padding-bottom: 0;
+          padding-left: 8px;
+          padding-right: 8px;
+          padding-top: 0;
+        }
+  >
+    <span
+      className=
+          ms-ActivityItem-activityText
+          {
+            display: inline;
+          }
+    >
+      <span>
+        Activity description content
+      </span>
+    </span>
+    <div
+      className=
+          ms-ActivityItem-commentText
+          {
+            color: #333333;
+          }
+    >
+      <span>
+        Comment content
+      </span>
+    </div>
+    <div
+      className=
+          ms-ActivityItem-timeStamp
+          {
+            -moz-osx-font-smoothing: grayscale;
+            -webkit-font-smoothing: antialiased;
+            color: #666666;
+            font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+            font-size: 10px;
+            font-weight: 400;
+          }
+    >
+      Timestamp content
+    </div>
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
index 96771bd09d4b1..94643d254290a 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
@@ -4,277 +4,245 @@ import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
 
 import * as ReactTestUtils from 'react-dom/test-utils';
+import * as renderer from 'react-test-renderer';
+
 import { DefaultButton } from './DefaultButton/DefaultButton';
 import { IconButton } from './IconButton/IconButton';
+import { ActionButton } from './ActionButton/ActionButton';
+import { CommandBarButton } from './CommandBarButton/CommandBarButton';
 import { CompoundButton } from './CompoundButton/CompoundButton';
 import { KeyCodes } from '../../Utilities';
 // import { IconButton } from "src";
 
 const alertClicked = (): void => { /*noop*/ };
 
-describe('DefaultButton', () => {
-  function renderIntoDocument(element: React.ReactElement<any>): HTMLElement {
-    const component = ReactTestUtils.renderIntoDocument(element);
-    const renderedDOM: Element = ReactDOM.findDOMNode(component as React.ReactInstance);
-    return renderedDOM as HTMLElement;
-  }
-
-  it('can render without an onClick.', () => {
-    const button = ReactTestUtils.renderIntoDocument<any>(
-      <DefaultButton>Hello</DefaultButton>
-    );
-    const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
-    expect(renderedDOM.tagName).toEqual('BUTTON');
+describe('Button', () => {
+  it('renders DefaultButton correctly', () => {
+    const component = renderer.create(<DefaultButton text='Button' />);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
   });
 
-  it('can render with an onClick.', () => {
-    let onClick: () => null = () => null;
+  it('renders ActionButton correctly', () => {
+    const component = renderer.create(<ActionButton>Button</ActionButton>);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
 
-    const button = ReactTestUtils.renderIntoDocument<any>(
-      <DefaultButton onClick={ onClick }>Hello</DefaultButton>
-    );
-    const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
-    expect(renderedDOM.tagName).toEqual('BUTTON');
+  it('renders CommandBarButton correctly', () => {
+    const component = renderer.create(
+      <CommandBarButton
+        iconProps={ { iconName: 'Add' } }
+        text='Create account'
+        menuProps={ {
+          items: [
+            {
+              key: 'emailMessage',
+              name: 'Email message',
+              icon: 'Mail'
+            },
+            {
+              key: 'calendarEvent',
+              name: 'Calendar event',
+              icon: 'Calendar'
+            }
+          ]
+        } }
+      />);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
   });
 
-  it('can render with an href', () => {
-    const button = ReactTestUtils.renderIntoDocument<any>(
-      <DefaultButton href='http://www.microsoft.com' target='_blank'>Hello</DefaultButton>
-    );
-    const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
-    expect(renderedDOM.tagName).toEqual('A');
+  it('renders CompoundButton correctly', () => {
+    const component = renderer.create(
+      <CompoundButton description='You can create a new account here.'>
+        Create account
+    </CompoundButton>);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
   });
 
-  it('applies the correct aria attributes', () => {
-    let button: any;
-    let renderedDOM: any;
-
-    button = ReactTestUtils.renderIntoDocument<any>(
-      <DefaultButton
-        href='http://www.microsoft.com'
-        target='_blank'
-      >
-        Hello
-      </DefaultButton>
-    );
-    renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
-    expect(renderedDOM.getAttribute('aria-label') === null);
-    expect(renderedDOM.getAttribute('aria-labelledby') === null);
-    expect(renderedDOM.getAttribute('aria-describedby') === null);
-
-    button = ReactTestUtils.renderIntoDocument<any>(
-      <DefaultButton
-        href='http://www.microsoft.com'
-        target='_blank'
-        aria-label='MyLabel'
-      >
-        Hello
-      </DefaultButton>
-    );
-    renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
-    expect(renderedDOM.getAttribute('aria-label') === 'MyLabel');
-    expect(renderedDOM.getAttribute('aria-labelledby') === null);
-    expect(renderedDOM.getAttribute('aria-describedby') === null);
-
-    button = ReactTestUtils.renderIntoDocument<any>(
-      <DefaultButton
-        href='http://www.microsoft.com'
-        target='_blank'
-        aria-labelledby='someid'
-      >
-        Hello
-      </DefaultButton>
-    );
-    renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
-    expect(renderedDOM.getAttribute('aria-label') === 'MyLabel');
-    expect(renderedDOM.getAttribute('aria-labelledby') === 'someid');
-    expect(renderedDOM.getAttribute('aria-describedby') === null);
-
-    button = ReactTestUtils.renderIntoDocument<any>(
-      <DefaultButton
-        href='http://www.microsoft.com'
-        target='_blank'
-        ariaDescription='This description is not visible'
-        styles={ { screenReaderText: 'some-screenreader-class' } }
-      >
-        Hello
-      </DefaultButton>
-    );
-    renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
-    expect(renderedDOM.getAttribute('aria-label') === null);
-    expect(renderedDOM.getAttribute('aria-labelledby') === renderedDOM.querySelector(`.ms-Button-label`).id);
-    expect(renderedDOM.getAttribute('aria-describedby') === renderedDOM.querySelector('.some-screenreader-class').id);
-
-    button = ReactTestUtils.renderIntoDocument<any>(
+  it('renders IconButton correctly', () => {
+    const component = renderer.create(
       <IconButton
         iconProps={ { iconName: 'Emoji2' } }
-        ariaDescription='Description on icon button'
-        styles={ { screenReaderText: 'some-screenreader-class' } }
-      />
-    );
-    renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
-    expect(renderedDOM.getAttribute('aria-label') === null);
-    expect(renderedDOM.getAttribute('aria-labelledby') === null);
-    expect(renderedDOM.getAttribute('aria-describedby') === renderedDOM.querySelector('.some-screenreader-class').id);
-
-    button = ReactTestUtils.renderIntoDocument<any>(
-      <CompoundButton
-        description='Some awesome description'
-        ariaDescription='Description on icon button'
-      >
-        And this is the label
-      </CompoundButton>
-    );
-    renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
-    expect(renderedDOM.getAttribute('aria-label') === null);
-    expect(renderedDOM.getAttribute('aria-labelledby') === renderedDOM.querySelector('.ms-Button-label').id);
-    expect(renderedDOM.getAttribute('aria-describedby') === renderedDOM.querySelector('.ms-Button-description').id);
+        title='Emoji'
+        ariaLabel='Emoji'
+      />);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
   });
 
-  describe('with menuProps', () => {
-    let button: Element;
+  describe('DefaultButton', () => {
+    function renderIntoDocument(element: React.ReactElement<any>): HTMLElement {
+      const component = ReactTestUtils.renderIntoDocument(element);
+      const renderedDOM: Element = ReactDOM.findDOMNode(component as React.ReactInstance);
+      return renderedDOM as HTMLElement;
+    }
 
-    beforeAll(() => {
-      const wrapper = ReactTestUtils.renderIntoDocument<any>(
-        <DefaultButton menuProps={ { items: [{ key: 'item', name: 'Item' }] } }>Hello</DefaultButton>
-      ) as DefaultButton;
-      button = ReactTestUtils.findRenderedDOMComponentWithTag(wrapper, 'button');
-    });
-
-    it('contains aria-haspopup=true', () => {
-      expect(button.getAttribute('aria-haspopup')).toEqual('true');
+    it('can render without an onClick.', () => {
+      const button = ReactTestUtils.renderIntoDocument<any>(
+        <DefaultButton>Hello</DefaultButton>
+      );
+      const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+      expect(renderedDOM.tagName).toEqual('BUTTON');
     });
-  });
 
-  describe('without menuProps', () => {
-    let button: Element;
+    it('can render with an onClick.', () => {
+      let onClick: () => null = () => null;
 
-    beforeAll(() => {
-      const wrapper = ReactTestUtils.renderIntoDocument<any>(
-        <DefaultButton>Hello</DefaultButton>
-      ) as DefaultButton;
-      button = ReactTestUtils.findRenderedDOMComponentWithTag(wrapper, 'button');
+      const button = ReactTestUtils.renderIntoDocument<any>(
+        <DefaultButton onClick={ onClick }>Hello</DefaultButton>
+      );
+      const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+      expect(renderedDOM.tagName).toEqual('BUTTON');
     });
 
-    it('does not contain aria-haspopup', () => {
-      expect(button.getAttribute('aria-haspopup')).toEqual(null);
+    it('can render with an href', () => {
+      const button = ReactTestUtils.renderIntoDocument<any>(
+        <DefaultButton href='http://www.microsoft.com' target='_blank'>Hello</DefaultButton>
+      );
+      const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+      expect(renderedDOM.tagName).toEqual('A');
     });
-  });
 
-  describe('with menuIconProps', () => {
-    let button: Element;
+    it('applies the correct aria attributes', () => {
+      let button: any;
+      let renderedDOM: any;
 
-    beforeAll(() => {
-      const wrapper = ReactTestUtils.renderIntoDocument<any>(
-        <DefaultButton menuIconProps={ { iconName: 'fontColor' } }>Hello</DefaultButton>
-      ) as DefaultButton;
-      button = ReactTestUtils.findRenderedDOMComponentWithTag(wrapper, 'button');
+      button = ReactTestUtils.renderIntoDocument<any>(
+        <DefaultButton
+          href='http://www.microsoft.com'
+          target='_blank'
+        >
+          Hello
+        </DefaultButton>
+      );
+      renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+      expect(renderedDOM.getAttribute('aria-label') === null);
+      expect(renderedDOM.getAttribute('aria-labelledby') === null);
+      expect(renderedDOM.getAttribute('aria-describedby') === null);
+
+      button = ReactTestUtils.renderIntoDocument<any>(
+        <DefaultButton
+          href='http://www.microsoft.com'
+          target='_blank'
+          aria-label='MyLabel'
+        >
+          Hello
+        </DefaultButton>
+      );
+      renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+      expect(renderedDOM.getAttribute('aria-label') === 'MyLabel');
+      expect(renderedDOM.getAttribute('aria-labelledby') === null);
+      expect(renderedDOM.getAttribute('aria-describedby') === null);
+
+      button = ReactTestUtils.renderIntoDocument<any>(
+        <DefaultButton
+          href='http://www.microsoft.com'
+          target='_blank'
+          aria-labelledby='someid'
+        >
+          Hello
+        </DefaultButton>
+      );
+      renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+      expect(renderedDOM.getAttribute('aria-label') === 'MyLabel');
+      expect(renderedDOM.getAttribute('aria-labelledby') === 'someid');
+      expect(renderedDOM.getAttribute('aria-describedby') === null);
+
+      button = ReactTestUtils.renderIntoDocument<any>(
+        <DefaultButton
+          href='http://www.microsoft.com'
+          target='_blank'
+          ariaDescription='This description is not visible'
+          styles={ { screenReaderText: 'some-screenreader-class' } }
+        >
+          Hello
+        </DefaultButton>
+      );
+      renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+      expect(renderedDOM.getAttribute('aria-label') === null);
+      expect(renderedDOM.getAttribute('aria-labelledby') === renderedDOM.querySelector(`.ms-Button-label`).id);
+      expect(renderedDOM.getAttribute('aria-describedby') === renderedDOM.querySelector('.some-screenreader-class').id);
+
+      button = ReactTestUtils.renderIntoDocument<any>(
+        <IconButton
+          iconProps={ { iconName: 'Emoji2' } }
+          ariaDescription='Description on icon button'
+          styles={ { screenReaderText: 'some-screenreader-class' } }
+        />
+      );
+      renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+      expect(renderedDOM.getAttribute('aria-label') === null);
+      expect(renderedDOM.getAttribute('aria-labelledby') === null);
+      expect(renderedDOM.getAttribute('aria-describedby') === renderedDOM.querySelector('.some-screenreader-class').id);
+
+      button = ReactTestUtils.renderIntoDocument<any>(
+        <CompoundButton
+          description='Some awesome description'
+          ariaDescription='Description on icon button'
+        >
+          And this is the label
+        </CompoundButton>
+      );
+      renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+      expect(renderedDOM.getAttribute('aria-label') === null);
+      expect(renderedDOM.getAttribute('aria-labelledby') === renderedDOM.querySelector('.ms-Button-label').id);
+      expect(renderedDOM.getAttribute('aria-describedby') === renderedDOM.querySelector('.ms-Button-description').id);
     });
 
-    it('Contains the expected icon via menuIconProps', () => {
-      expect(button.querySelectorAll('[data-icon-name="fontColor"]').length).toEqual(1);
+    describe('with menuProps', () => {
+      let button: Element;
+
+      beforeAll(() => {
+        const wrapper = ReactTestUtils.renderIntoDocument<any>(
+          <DefaultButton menuProps={ { items: [{ key: 'item', name: 'Item' }] } }>Hello</DefaultButton>
+        ) as DefaultButton;
+        button = ReactTestUtils.findRenderedDOMComponentWithTag(wrapper, 'button');
+      });
+
+      it('contains aria-haspopup=true', () => {
+        expect(button.getAttribute('aria-haspopup')).toEqual('true');
+      });
     });
-  });
 
-  it('Providing onClick and menuProps does not render a SplitButton', () => {
-    const button = ReactTestUtils.renderIntoDocument<any>(
-      <DefaultButton
-        data-automation-id='test'
-        text='Create account'
-        onClick={ alertClicked }
-        menuProps={ {
-          items: [
-            {
-              key: 'emailMessage',
-              name: 'Email message',
-              icon: 'Mail'
-            },
-            {
-              key: 'calendarEvent',
-              name: 'Calendar event',
-              icon: 'Calendar'
-            }
-          ]
-        } }
-      />
-    );
-    const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
-    expect(renderedDOM.tagName).not.toEqual('DIV');
-  });
+    describe('without menuProps', () => {
+      let button: Element;
 
-  it('Providing onClick, menuProps and setting splitButton to true renders a SplitButton', () => {
-    const button = ReactTestUtils.renderIntoDocument<any>(
-      <DefaultButton
-        data-automation-id='test'
-        text='Create account'
-        split={ true }
-        onClick={ alertClicked }
-        menuProps={ {
-          items: [
-            {
-              key: 'emailMessage',
-              name: 'Email message',
-              icon: 'Mail'
-            },
-            {
-              key: 'calendarEvent',
-              name: 'Calendar event',
-              icon: 'Calendar'
-            }
-          ]
-        } }
-      />
-    );
-    const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
-    expect(renderedDOM.tagName).toEqual('DIV');
-  });
+      beforeAll(() => {
+        const wrapper = ReactTestUtils.renderIntoDocument<any>(
+          <DefaultButton>Hello</DefaultButton>
+        ) as DefaultButton;
+        button = ReactTestUtils.findRenderedDOMComponentWithTag(wrapper, 'button');
+      });
 
-  it('Tapping menu button of SplitButton expands menu', () => {
-    const button = ReactTestUtils.renderIntoDocument<any>(
-      <DefaultButton
-        data-automation-id='test'
-        text='Create account'
-        split={ true }
-        onClick={ alertClicked }
-        menuProps={ {
-          items: [
-            {
-              key: 'emailMessage',
-              name: 'Email message',
-              icon: 'Mail'
-            },
-            {
-              key: 'calendarEvent',
-              name: 'Calendar event',
-              icon: 'Calendar'
-            }
-          ]
-        } }
-      />
-    );
-    const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
-    const menuButtonDOM: HTMLButtonElement = renderedDOM.getElementsByTagName('button')[1] as HTMLButtonElement;
-    ReactTestUtils.Simulate.click(menuButtonDOM);
-    expect(renderedDOM.getAttribute('aria-expanded')).toEqual('true');
-  });
+      it('does not contain aria-haspopup', () => {
+        expect(button.getAttribute('aria-haspopup')).toEqual(null);
+      });
+    });
+
+    describe('with menuIconProps', () => {
+      let button: Element;
 
-  describe('Response to click event', () => {
-    let didClick = false;
-    const setTrue = (): void => {
-      didClick = true;
-    };
+      beforeAll(() => {
+        const wrapper = ReactTestUtils.renderIntoDocument<any>(
+          <DefaultButton menuIconProps={ { iconName: 'fontColor' } }>Hello</DefaultButton>
+        ) as DefaultButton;
+        button = ReactTestUtils.findRenderedDOMComponentWithTag(wrapper, 'button');
+      });
 
-    beforeEach(() => {
-      didClick = false;
+      it('Contains the expected icon via menuIconProps', () => {
+        expect(button.querySelectorAll('[data-icon-name="fontColor"]').length).toEqual(1);
+      });
     });
 
-    it('Clicking SplitButton button triggers action', () => {
-      const renderedDOM: HTMLElement = renderIntoDocument(
+    it('Providing onClick and menuProps does not render a SplitButton', () => {
+      const button = ReactTestUtils.renderIntoDocument<any>(
         <DefaultButton
           data-automation-id='test'
           text='Create account'
-          split={ true }
-          onClick={ setTrue }
+          onClick={ alertClicked }
           menuProps={ {
             items: [
               {
@@ -291,19 +259,17 @@ describe('DefaultButton', () => {
           } }
         />
       );
-      const menuButtonDOM: HTMLButtonElement = renderedDOM.querySelectorAll('button')[0];
-
-      ReactTestUtils.Simulate.click(menuButtonDOM);
-      expect(didClick).toEqual(true);
+      const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+      expect(renderedDOM.tagName).not.toEqual('DIV');
     });
 
-    it('Pressing down on SplitButton triggers menu', () => {
-      const renderedDOM: HTMLElement = renderIntoDocument(
+    it('Providing onClick, menuProps and setting splitButton to true renders a SplitButton', () => {
+      const button = ReactTestUtils.renderIntoDocument<any>(
         <DefaultButton
           data-automation-id='test'
           text='Create account'
           split={ true }
-          onClick={ setTrue }
+          onClick={ alertClicked }
           menuProps={ {
             items: [
               {
@@ -320,24 +286,17 @@ describe('DefaultButton', () => {
           } }
         />
       );
-
-      const menuButtonElement = renderedDOM.querySelectorAll('button')[1];
-
-      ReactTestUtils.Simulate.keyDown(menuButtonElement,
-        {
-          which: KeyCodes.down
-        });
-      expect(renderedDOM.getAttribute('aria-expanded')).toEqual('true');
+      const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+      expect(renderedDOM.tagName).toEqual('DIV');
     });
 
-    it('A disabled SplitButton does not respond to clicks', () => {
-      const renderedDOM: HTMLElement = renderIntoDocument(
+    it('Tapping menu button of SplitButton expands menu', () => {
+      const button = ReactTestUtils.renderIntoDocument<any>(
         <DefaultButton
-          disabled={ true }
           data-automation-id='test'
           text='Create account'
           split={ true }
-          onClick={ setTrue }
+          onClick={ alertClicked }
           menuProps={ {
             items: [
               {
@@ -354,10 +313,113 @@ describe('DefaultButton', () => {
           } }
         />
       );
-      const buttonElement = renderedDOM.querySelectorAll('button')[0];
+      const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+      const menuButtonDOM: HTMLButtonElement = renderedDOM.getElementsByTagName('button')[1] as HTMLButtonElement;
+      ReactTestUtils.Simulate.click(menuButtonDOM);
+      expect(renderedDOM.getAttribute('aria-expanded')).toEqual('true');
+    });
 
-      ReactTestUtils.Simulate.click(buttonElement);
-      expect(didClick).toEqual(false);
+    describe('Response to click event', () => {
+      let didClick = false;
+      const setTrue = (): void => {
+        didClick = true;
+      };
+
+      beforeEach(() => {
+        didClick = false;
+      });
+
+      it('Clicking SplitButton button triggers action', () => {
+        const renderedDOM: HTMLElement = renderIntoDocument(
+          <DefaultButton
+            data-automation-id='test'
+            text='Create account'
+            split={ true }
+            onClick={ setTrue }
+            menuProps={ {
+              items: [
+                {
+                  key: 'emailMessage',
+                  name: 'Email message',
+                  icon: 'Mail'
+                },
+                {
+                  key: 'calendarEvent',
+                  name: 'Calendar event',
+                  icon: 'Calendar'
+                }
+              ]
+            } }
+          />
+        );
+        const menuButtonDOM: HTMLButtonElement = renderedDOM.querySelectorAll('button')[0];
+
+        ReactTestUtils.Simulate.click(menuButtonDOM);
+        expect(didClick).toEqual(true);
+      });
+
+      it('Pressing down on SplitButton triggers menu', () => {
+        const renderedDOM: HTMLElement = renderIntoDocument(
+          <DefaultButton
+            data-automation-id='test'
+            text='Create account'
+            split={ true }
+            onClick={ setTrue }
+            menuProps={ {
+              items: [
+                {
+                  key: 'emailMessage',
+                  name: 'Email message',
+                  icon: 'Mail'
+                },
+                {
+                  key: 'calendarEvent',
+                  name: 'Calendar event',
+                  icon: 'Calendar'
+                }
+              ]
+            } }
+          />
+        );
+
+        const menuButtonElement = renderedDOM.querySelectorAll('button')[1];
+
+        ReactTestUtils.Simulate.keyDown(menuButtonElement,
+          {
+            which: KeyCodes.down
+          });
+        expect(renderedDOM.getAttribute('aria-expanded')).toEqual('true');
+      });
+
+      it('A disabled SplitButton does not respond to clicks', () => {
+        const renderedDOM: HTMLElement = renderIntoDocument(
+          <DefaultButton
+            disabled={ true }
+            data-automation-id='test'
+            text='Create account'
+            split={ true }
+            onClick={ setTrue }
+            menuProps={ {
+              items: [
+                {
+                  key: 'emailMessage',
+                  name: 'Email message',
+                  icon: 'Mail'
+                },
+                {
+                  key: 'calendarEvent',
+                  name: 'Calendar event',
+                  icon: 'Calendar'
+                }
+              ]
+            } }
+          />
+        );
+        const buttonElement = renderedDOM.querySelectorAll('button')[0];
+
+        ReactTestUtils.Simulate.click(buttonElement);
+        expect(didClick).toEqual(false);
+      });
     });
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
new file mode 100644
index 0000000000000..7f417942124fc
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
@@ -0,0 +1,578 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Button renders ActionButton correctly 1`] = `
+<button
+  aria-describedby={null}
+  aria-label={undefined}
+  aria-labelledby={null}
+  aria-pressed={undefined}
+  className=
+      ms-Button
+      ms-Button--action
+      ms-Button--command
+      {
+        -moz-osx-font-smoothing: grayscale;
+        -webkit-font-smoothing: antialiased;
+        background-color: transparent;
+        border-radius: 0px;
+        border: 1px solid transparent;
+        box-sizing: border-box;
+        color: #333333;
+        cursor: pointer;
+        display: inline-block;
+        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-size: 14px;
+        font-weight: 400;
+        height: 40px;
+        outline: transparent;
+        padding-bottom: 0;
+        padding-left: 4px;
+        padding-right: 4px;
+        padding-top: 0;
+        position: relative;
+        text-align: center;
+        text-decoration: none;
+        user-select: none;
+        vertical-align: top;
+      }
+      &::-moz-focus-inner {
+        border: 0;
+      }
+      .ms-Fabric.is-focusVisible &:focus:after {
+        border: 1px solid #ffffff;
+        bottom: 0px;
+        content: "";
+        left: 0px;
+        outline: 1px solid #666666;
+        position: absolute;
+        right: 0px;
+        top: 0px;
+        z-index: 1;
+      }
+      &:hover {
+        color: #0078d7;
+      }
+      &:hover .ms-Button-icon {
+        color: #0078d7;
+      }
+      &:active {
+        color: #000000;
+      }
+      &:active .ms-Button-icon {
+        color: #004578;
+      }
+  data-is-focusable={true}
+  disabled={undefined}
+  type="button"
+>
+  <div
+    className=
+        ms-Button-flexContainer
+        {
+          align-items: center;
+          display: flex;
+          flex-wrap: nowrap;
+          height: 100%;
+          justify-content: flex-start;
+        }
+  >
+    <div
+      className=
+          ms-Button-textContainer
+          {
+            flex-grow: 0;
+          }
+    >
+      <div
+        className=
+            ms-Button-label
+            {
+              line-height: 100%;
+              margin-bottom: 0;
+              margin-left: 4px;
+              margin-right: 4px;
+              margin-top: 0;
+            }
+        id="3"
+      >
+        Button
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`Button renders CommandBarButton correctly 1`] = `
+<button
+  aria-describedby={null}
+  aria-expanded={false}
+  aria-haspopup={true}
+  aria-label={undefined}
+  aria-labelledby={null}
+  aria-owns={null}
+  aria-pressed={undefined}
+  className=
+      ms-Button
+      ms-Button--commandBar
+      {
+        -moz-osx-font-smoothing: grayscale;
+        -webkit-font-smoothing: antialiased;
+        background-color: #f4f4f4;
+        border-radius: 0px;
+        border: 1px solid transparent;
+        box-sizing: border-box;
+        color: #333333;
+        cursor: pointer;
+        display: inline-block;
+        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-size: 14px;
+        font-weight: 400;
+        min-width: 40px;
+        outline: transparent;
+        padding-bottom: 0;
+        padding-left: 4px;
+        padding-right: 4px;
+        padding-top: 0;
+        position: relative;
+        text-align: center;
+        text-decoration: none;
+        user-select: none;
+        vertical-align: top;
+      }
+      &::-moz-focus-inner {
+        border: 0;
+      }
+      .ms-Fabric.is-focusVisible &:focus:after {
+        border: 1px solid #ffffff;
+        bottom: 0px;
+        content: "";
+        left: 0px;
+        outline: 1px solid #666666;
+        position: absolute;
+        right: 0px;
+        top: 0px;
+        z-index: 1;
+      }
+      &:hover {
+        background-color: #eaeaea;
+        color: #212121;
+      }
+      &:active {
+        background-color: #dadada;
+        color: #000000;
+      }
+  data-is-focusable={true}
+  disabled={undefined}
+  onClick={[Function]}
+  type="button"
+>
+  <div
+    className=
+        ms-Button-flexContainer
+        {
+          align-items: center;
+          display: flex;
+          flex-wrap: nowrap;
+          height: 100%;
+          justify-content: center;
+        }
+  >
+    <i
+      aria-hidden={true}
+      aria-label={undefined}
+      className=
+          ms-Icon
+          ms-Button-icon
+          {
+            display: inline-block;
+          }
+          {
+            color: #106ebe;
+            font-size: 16px;
+            height: 16px;
+            line-height: 16px;
+            margin-bottom: 0;
+            margin-left: 4px;
+            margin-right: 4px;
+            margin-top: 0;
+            text-align: center;
+            vertical-align: middle;
+          }
+      data-icon-name="Add"
+      role="presentation"
+    />
+    <div
+      className=
+          ms-Button-textContainer
+          {
+            flex-grow: 1;
+          }
+    >
+      <div
+        className=
+            ms-Button-label
+            {
+              font-weight: normal;
+              line-height: 100%;
+              margin-bottom: 0;
+              margin-left: 4px;
+              margin-right: 4px;
+              margin-top: 0;
+            }
+        id="6"
+      >
+        Create account
+      </div>
+    </div>
+    <i
+      aria-hidden={true}
+      aria-label={undefined}
+      className=
+          ms-Icon
+          ms-Button-menuIcon
+          {
+            display: inline-block;
+          }
+          {
+            color: #666666;
+            font-size: 12px;
+            height: 16px;
+            line-height: 16px;
+            margin-bottom: 0;
+            margin-left: 4px;
+            margin-right: 4px;
+            margin-top: 0;
+            text-align: center;
+            vertical-align: middle;
+          }
+      data-icon-name="ChevronDown"
+      role="presentation"
+    />
+  </div>
+</button>
+`;
+
+exports[`Button renders CompoundButton correctly 1`] = `
+<button
+  aria-describedby="10"
+  aria-label={undefined}
+  aria-labelledby={null}
+  aria-pressed={undefined}
+  className=
+      ms-Button
+      ms-Button--compound
+      {
+        -moz-osx-font-smoothing: grayscale;
+        -webkit-font-smoothing: antialiased;
+        background-color: #f4f4f4;
+        border-radius: 0px;
+        border: 1px solid transparent;
+        box-sizing: border-box;
+        color: #333333;
+        cursor: pointer;
+        display: inline-block;
+        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-size: 14px;
+        font-weight: 400;
+        height: auto;
+        max-width: 280px;
+        min-height: 72px;
+        outline: transparent;
+        padding-bottom: 20px;
+        padding-left: 20px;
+        padding-right: 20px;
+        padding-top: 20px;
+        position: relative;
+        text-align: center;
+        text-decoration: none;
+        user-select: none;
+        vertical-align: top;
+      }
+      &::-moz-focus-inner {
+        border: 0;
+      }
+      .ms-Fabric.is-focusVisible &:focus:after {
+        border: 1px solid #ffffff;
+        bottom: 0px;
+        content: "";
+        left: 0px;
+        outline: 1px solid #666666;
+        position: absolute;
+        right: 0px;
+        top: 0px;
+        z-index: 1;
+      }
+      &:hover {
+        background-color: #eaeaea;
+        color: #000000;
+      }
+      &:hover .ms-Button-description {
+        color: #212121;
+      }
+      &:active {
+        background-color: #c8c8c8;
+        color: #212121;
+      }
+      &:active .ms-Button-description {
+        color: inherit;
+      }
+  data-is-focusable={true}
+  disabled={undefined}
+  type="button"
+>
+  <div
+    className=
+        ms-Button-flexContainer
+        {
+          align-items: flex-start;
+          display: flex;
+          flex-direction: row;
+          flex-wrap: nowrap;
+          height: 100%;
+          justify-content: center;
+          margin-bottom: ;
+          margin-left: ;
+          margin-right: ;
+          margin-top: ;
+          min-width: 100%;
+        }
+  >
+    <div
+      className=
+          ms-Button-textContainer
+          {
+            flex-grow: 1;
+            text-align: left;
+          }
+    >
+      <div
+        className=
+            ms-Button-label
+            {
+              font-weight: 600;
+              line-height: 100%;
+              margin-bottom: 5px;
+              margin-left: 0;
+              margin-right: 0;
+              margin-top: 0;
+            }
+        id="9"
+      >
+        Create account
+      </div>
+      <div
+        className=
+            ms-Button-description
+            {
+              -moz-osx-font-smoothing: grayscale;
+              -webkit-font-smoothing: antialiased;
+              color: #666666;
+              font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+              font-size: 12px;
+              font-weight: 400;
+              line-height: 100%;
+            }
+        id="10"
+      >
+        You can create a new account here.
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`Button renders DefaultButton correctly 1`] = `
+<button
+  aria-describedby={null}
+  aria-label={undefined}
+  aria-labelledby={null}
+  aria-pressed={undefined}
+  className=
+      ms-Button
+      ms-Button--default
+      {
+        -moz-osx-font-smoothing: grayscale;
+        -webkit-font-smoothing: antialiased;
+        background-color: #f4f4f4;
+        border-radius: 0px;
+        border: 1px solid transparent;
+        box-sizing: border-box;
+        color: #333333;
+        cursor: pointer;
+        display: inline-block;
+        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-size: 14px;
+        font-weight: 400;
+        height: 32px;
+        min-width: 80px;
+        outline: transparent;
+        padding-bottom: 0;
+        padding-left: 16px;
+        padding-right: 16px;
+        padding-top: 0;
+        position: relative;
+        text-align: center;
+        text-decoration: none;
+        user-select: none;
+        vertical-align: top;
+      }
+      &::-moz-focus-inner {
+        border: 0;
+      }
+      .ms-Fabric.is-focusVisible &:focus:after {
+        border: 1px solid #ffffff;
+        bottom: 0px;
+        content: "";
+        left: 0px;
+        outline: 1px solid #666666;
+        position: absolute;
+        right: 0px;
+        top: 0px;
+        z-index: 1;
+      }
+      &:hover {
+        background-color: #eaeaea;
+        color: #000000;
+      }
+      &:active {
+        background-color: #c8c8c8;
+        color: #212121;
+      }
+  data-is-focusable={true}
+  disabled={undefined}
+  type="button"
+>
+  <div
+    className=
+        ms-Button-flexContainer
+        {
+          align-items: center;
+          display: flex;
+          flex-wrap: nowrap;
+          height: 100%;
+          justify-content: center;
+        }
+  >
+    <div
+      className=
+          ms-Button-textContainer
+          {
+            flex-grow: 1;
+          }
+    >
+      <div
+        className=
+            ms-Button-label
+            {
+              font-weight: 600;
+              line-height: 100%;
+              margin-bottom: 0;
+              margin-left: 4px;
+              margin-right: 4px;
+              margin-top: 0;
+            }
+        id="0"
+      >
+        Button
+      </div>
+    </div>
+  </div>
+</button>
+`;
+
+exports[`Button renders IconButton correctly 1`] = `
+<button
+  aria-describedby={null}
+  aria-label="Emoji"
+  aria-labelledby={null}
+  aria-pressed={undefined}
+  className=
+      ms-Button
+      ms-Button--icon
+      {
+        -moz-osx-font-smoothing: grayscale;
+        -webkit-font-smoothing: antialiased;
+        background-color: transparent;
+        border-radius: 0px;
+        border: 1px solid transparent;
+        box-sizing: border-box;
+        cursor: pointer;
+        display: inline-block;
+        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-size: 14px;
+        font-weight: 400;
+        height: 32px;
+        outline: transparent;
+        padding-bottom: 0;
+        padding-left: 4px;
+        padding-right: 4px;
+        padding-top: 0;
+        position: relative;
+        text-align: center;
+        text-decoration: none;
+        user-select: none;
+        vertical-align: top;
+        width: 32px;
+      }
+      &::-moz-focus-inner {
+        border: 0;
+      }
+      .ms-Fabric.is-focusVisible &:focus:after {
+        border: 1px solid #ffffff;
+        bottom: 0px;
+        content: "";
+        left: 0px;
+        outline: 1px solid #666666;
+        position: absolute;
+        right: 0px;
+        top: 0px;
+        z-index: 1;
+      }
+      &:hover {
+        color: #004578;
+      }
+      &:active {
+        color: #0078d7;
+      }
+  data-is-focusable={true}
+  disabled={undefined}
+  title="Emoji"
+  type="button"
+>
+  <div
+    className=
+        ms-Button-flexContainer
+        {
+          align-items: center;
+          display: flex;
+          flex-wrap: nowrap;
+          height: 100%;
+          justify-content: center;
+        }
+  >
+    <i
+      aria-hidden={true}
+      aria-label={undefined}
+      className=
+          ms-Icon
+          ms-Button-icon
+          {
+            display: inline-block;
+          }
+          {
+            font-size: 16px;
+            height: 16px;
+            line-height: 16px;
+            margin-bottom: 0;
+            margin-left: 4px;
+            margin-right: 4px;
+            margin-top: 0;
+            text-align: center;
+            vertical-align: middle;
+          }
+      data-icon-name="Emoji2"
+      role="presentation"
+    />
+  </div>
+</button>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.test.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.test.tsx
new file mode 100644
index 0000000000000..6073672f66c56
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.test.tsx
@@ -0,0 +1,16 @@
+import * as React from 'react';
+import * as renderer from 'react-test-renderer';
+
+import { Checkbox } from './Checkbox';
+
+describe('Checkbox', () => {
+  it('renders Checkbox correctly', () => {
+    const component = renderer.create(
+      <Checkbox
+        label='Standard checkbox'
+        ariaDescribedBy={ 'descriptionID' }
+      />);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
new file mode 100644
index 0000000000000..43603b35f6906
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
@@ -0,0 +1,131 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Checkbox renders Checkbox correctly 1`] = `
+<button
+  aria-checked={false}
+  aria-describedby="descriptionID"
+  aria-disabled={undefined}
+  aria-label={undefined}
+  aria-labelledby={undefined}
+  className=
+      ms-Checkbox
+      is-enabled
+      {
+        background: none;
+        border: none;
+        cursor: pointer;
+        display: block;
+        margin-bottom: 0;
+        margin-left: 0;
+        margin-right: 0;
+        margin-top: 0;
+        outline: none;
+        padding-bottom: 0;
+        padding-left: 0;
+        padding-right: 0;
+        padding-top: 0;
+        position: relative;
+      }
+      &::-moz-focus-inner {
+        border: 0;
+      }
+      .ms-Fabric.is-focusVisible &:focus:after {
+        border: 1px solid #ffffff;
+        bottom: -1px;
+        content: "";
+        left: -1px;
+        outline: 1px solid #666666;
+        position: absolute;
+        right: -1px;
+        top: -1px;
+        z-index: 1;
+      }
+      &:hover .ms-Checkbox-checkbox {
+        border-color: #333333;
+      }
+      &:hover .ms-Checkbox-text {
+        color: #000000;
+      }
+  disabled={undefined}
+  id="checkbox-0"
+  name={undefined}
+  onBlur={[Function]}
+  onClick={[Function]}
+  onFocus={[Function]}
+  role="checkbox"
+  type="button"
+>
+  <label
+    className=
+        ms-Checkbox-label
+        {
+          align-items: center;
+          cursor: pointer;
+          display: inline-flex;
+          margin-bottom: 0;
+          margin-left: -4px;
+          margin-right: -4px;
+          margin-top: 0;
+          position: relative;
+          text-align: left;
+          user-select: none;
+        }
+    htmlFor="checkbox-0"
+  >
+    <div
+      className=
+          ms-Checkbox-checkbox
+          {
+            align-items: center;
+            border-color: #a6a6a6;
+            border-style: solid;
+            border-width: 1px;
+            box-sizing: border-box;
+            display: flex;
+            flex-shrink: 0;
+            height: 20px;
+            justify-content: center;
+            margin-bottom: 0;
+            margin-left: 4px;
+            margin-right: 4px;
+            margin-top: 0;
+            overflow: hidden;
+            transition-duration: 200ms;
+            transition-property: background, border, border-color;
+            transition-timing-function: cubic-bezier(.4, 0, .23, 1);
+            width: 20px;
+          }
+    >
+      <i
+        aria-hidden={true}
+        aria-label={undefined}
+        className=
+            ms-Icon
+            {
+              display: inline-block;
+            }
+            {
+              color: #ffffff;
+              opacity: 0;
+            }
+        data-icon-name="CheckMark"
+        role="presentation"
+      />
+    </div>
+    <span
+      className=
+          ms-Checkbox-text
+          {
+            color: #333333;
+            font-size: 14px;
+            margin-bottom: 0;
+            margin-left: 4px;
+            margin-right: 4px;
+            margin-top: 0;
+          }
+    >
+      Standard checkbox
+    </span>
+  </label>
+</button>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx
new file mode 100644
index 0000000000000..d79612d649bdf
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx
@@ -0,0 +1,13 @@
+import * as React from 'react';
+import * as renderer from 'react-test-renderer';
+
+import { DatePicker } from './DatePicker';
+
+describe('Checkbox', () => {
+  it('renders Checkbox correctly', () => {
+    // This will only render the input. Calendar component has its own snapshot.
+    const component = renderer.create(<DatePicker />);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap
new file mode 100644
index 0000000000000..7b799f09a4d4b
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap
@@ -0,0 +1,57 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Checkbox renders Checkbox correctly 1`] = `
+<div
+  className="ms-DatePicker"
+>
+  <div>
+    <div
+      className="ms-TextField"
+    >
+      <div
+        className="ms-TextField-wrapper"
+      >
+        <div
+          className="ms-TextField-fieldGroup"
+        >
+          <input
+            aria-describedby={null}
+            aria-expanded={false}
+            aria-haspopup="true"
+            aria-invalid={false}
+            aria-label={undefined}
+            className="ms-TextField-field"
+            disabled={undefined}
+            id="TextField0"
+            onBlur={[Function]}
+            onChange={[Function]}
+            onClick={[Function]}
+            onFocus={[Function]}
+            onInput={[Function]}
+            onKeyDown={[Function]}
+            placeholder={undefined}
+            readOnly={true}
+            required={false}
+            role="menu"
+            type="text"
+            value=""
+          />
+          <i
+            aria-hidden={true}
+            aria-label={undefined}
+            className=
+                ms-Icon
+                ms-DatePicker-event--without-label
+                {
+                  display: inline-block;
+                }
+            data-icon-name="Calendar"
+            onClick={[Function]}
+            role="presentation"
+          />
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
index 214e1df2b5f42..2bc24fb81ada3 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
@@ -1,15 +1,23 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
+import * as renderer from 'react-test-renderer';
 
 import { mount } from 'enzyme';
 
 import { Dialog } from './Dialog';
+import { DialogContent } from './DialogContent';
 import { DialogType } from './DialogContent.Props';
 
 /* tslint:disable:no-unused-expression */// for express fluent assertions
 
 describe('Dialog', () => {
+  it('renders Dialog correctly', () => {
+    const component = renderer.create(<DialogContent />);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
   it('Fires dismissed after closing', (done) => {
     let dismissedCalled = false;
 
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/__snapshots__/Dialog.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Dialog/__snapshots__/Dialog.test.tsx.snap
new file mode 100644
index 0000000000000..fdd5a77567304
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Dialog/__snapshots__/Dialog.test.tsx.snap
@@ -0,0 +1,27 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Dialog renders Dialog correctly 1`] = `
+<div
+  className=""
+>
+  <div
+    className="ms-Dialog-header"
+  >
+    <p
+      className="ms-Dialog-title"
+      id={undefined}
+      role="heading"
+    />
+    <div
+      className="ms-Dialog-topButton"
+    />
+  </div>
+  <div
+    className="ms-Dialog-inner"
+  >
+    <div
+      className="ms-Dialog-content"
+    />
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.test.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.test.tsx
new file mode 100644
index 0000000000000..391ba31a71bf3
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.test.tsx
@@ -0,0 +1,29 @@
+import * as React from 'react';
+import * as renderer from 'react-test-renderer';
+
+import { DocumentCard } from './DocumentCard';
+import { DocumentCardTitle } from './DocumentCardTitle';
+import { DocumentCardPreview } from './DocumentCardPreview';
+import { DocumentCardActivity } from './DocumentCardActivity';
+
+describe('DocumentCard', () => {
+  it('renders DocumentCard correctly', () => {
+    const component = renderer.create(
+      <DocumentCard>
+        <DocumentCardPreview previewImages={ [] } />
+        <DocumentCardTitle
+          title=''
+        />
+        <DocumentCardActivity
+          activity=''
+          people={
+            [
+              { name: '', profileImageSrc: '' }
+            ]
+          }
+        />
+      </DocumentCard>);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap b/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap
new file mode 100644
index 0000000000000..06f64c28a2ed2
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap
@@ -0,0 +1,87 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`DocumentCard renders DocumentCard correctly 1`] = `
+<div
+  className="ms-DocumentCard"
+  onClick={undefined}
+  onKeyDown={undefined}
+  role={undefined}
+  style={undefined}
+  tabIndex={undefined}
+>
+  <div
+    className="ms-DocumentCardPreview"
+    style={undefined}
+  />
+  <div
+    className="ms-DocumentCardTitle"
+    title=""
+  >
+    
+  </div>
+  <div
+    className="ms-DocumentCardActivity"
+  >
+    <div
+      className="ms-DocumentCardActivity-avatars"
+    >
+      <div
+        className="ms-DocumentCardActivity-avatar"
+      >
+        <div
+          className="ms-Persona-coin ms-Persona--xs undefined"
+          role="persentation"
+          size={2}
+        >
+          <div
+            className="ms-Persona-imageArea"
+            style={undefined}
+          >
+            <div
+              aria-hidden="true"
+              className="ms-Persona-initials ms-Persona-initials--blue undefined"
+              style={undefined}
+            >
+              <span>
+                
+              </span>
+            </div>
+            <div
+              className="ms-Image ms-Persona-image"
+              style={
+                Object {
+                  "height": 32,
+                  "width": 32,
+                }
+              }
+            >
+              <img
+                alt=""
+                className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+                onError={[Function]}
+                onLoad={[Function]}
+                role={undefined}
+                src=""
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      className="ms-DocumentCardActivity-details"
+    >
+      <span
+        className="ms-DocumentCardActivity-name"
+      >
+        
+      </span>
+      <span
+        className="ms-DocumentCardActivity-activity"
+      >
+        
+      </span>
+    </div>
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.test.tsx b/packages/office-ui-fabric-react/src/components/Icon/Icon.test.tsx
new file mode 100644
index 0000000000000..56d0c7a9b99fc
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.test.tsx
@@ -0,0 +1,12 @@
+import * as React from 'react';
+import * as renderer from 'react-test-renderer';
+
+import { Icon } from './Icon';
+
+describe('Icon', () => {
+  it('renders Icon correctly', () => {
+    const component = renderer.create(<Icon iconName='CompassNW' />);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Icon/__snapshots__/Icon.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Icon/__snapshots__/Icon.test.tsx.snap
new file mode 100644
index 0000000000000..51ea391b750b4
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Icon/__snapshots__/Icon.test.tsx.snap
@@ -0,0 +1,15 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Icon renders Icon correctly 1`] = `
+<i
+  aria-hidden={true}
+  aria-label={undefined}
+  className=
+      ms-Icon
+      {
+        display: inline-block;
+      }
+  data-icon-name="CompassNW"
+  role="presentation"
+/>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.test.tsx b/packages/office-ui-fabric-react/src/components/Link/Link.test.tsx
new file mode 100644
index 0000000000000..b04c4980938ff
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.test.tsx
@@ -0,0 +1,12 @@
+import * as React from 'react';
+import * as renderer from 'react-test-renderer';
+
+import { Link } from './Link';
+
+describe('Link', () => {
+  it('renders Link correctly', () => {
+    const component = renderer.create(<Link href='#'>I'm a link</Link>);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap
new file mode 100644
index 0000000000000..45c9d5b0ed617
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap
@@ -0,0 +1,12 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Link renders Link correctly 1`] = `
+<a
+  className="ms-Link"
+  href="#"
+  onClick={[Function]}
+  target={undefined}
+>
+  I'm a link
+</a>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/List/List.test.tsx b/packages/office-ui-fabric-react/src/components/List/List.test.tsx
new file mode 100644
index 0000000000000..4c05d1aa75175
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/List/List.test.tsx
@@ -0,0 +1,16 @@
+import * as React from 'react';
+import * as renderer from 'react-test-renderer';
+
+import { List } from './List';
+
+describe('List', () => {
+  it('renders List correctly', () => {
+    List.prototype.componentDidMount = jest.fn();
+
+    const component = renderer.create(
+      // tslint:disable-next-line:jsx-no-lambda
+      <List items={ [] } onRenderCell={ () => null } />);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/List/__snapshots__/List.test.tsx.snap b/packages/office-ui-fabric-react/src/components/List/__snapshots__/List.test.tsx.snap
new file mode 100644
index 0000000000000..2faea37c6cce5
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/List/__snapshots__/List.test.tsx.snap
@@ -0,0 +1,13 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`List renders List correctly 1`] = `
+<div
+  className="ms-List"
+  role="list"
+>
+  <div
+    className="ms-List-surface"
+    role="presentation"
+  />
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.test.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.test.tsx
new file mode 100644
index 0000000000000..13cd615147437
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.test.tsx
@@ -0,0 +1,23 @@
+import * as React from 'react';
+import * as renderer from 'react-test-renderer';
+
+import { Nav } from './Nav';
+
+describe('Nav', () => {
+  it('renders Nav correctly', () => {
+    const component = renderer.create(
+      <Nav
+        groups={ [
+          {
+            links: [
+              {
+                name: '',
+                url: ''
+              }]
+          }
+        ] }
+      />);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
new file mode 100644
index 0000000000000..0e435dd99d7e8
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
@@ -0,0 +1,164 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Nav renders Nav correctly 1`] = `
+<div
+  aria-describedby={undefined}
+  aria-labelledby={undefined}
+  className="ms-FocusZone"
+  data-focuszone-id="FocusZone0"
+  onFocus={[Function]}
+  onKeyDown={[Function]}
+  onMouseDownCapture={[Function]}
+  role="presentation"
+>
+  <nav
+    className="ms-Nav"
+    role="navigation"
+  >
+    <div
+      className="ms-Nav-group is-expanded undefined"
+    >
+      <div
+        className=
+            ms-Nav-groupContent
+            {
+              animation-duration: 0.367s;
+              animation-fill-mode: both;
+              animation-name: css-0,css-13;
+              animation-timing-function: cubic-bezier(.1,.9,.2,1);
+            }
+      >
+        <ul
+          aria-label={undefined}
+          className=""
+          role="list"
+        >
+          <li
+            className=""
+            role="listitem"
+          >
+            <div
+              className="ms-Nav-compositeLink"
+              name=""
+            >
+              <button
+                aria-describedby={null}
+                aria-label={undefined}
+                aria-labelledby={null}
+                aria-pressed={undefined}
+                className=
+                    ms-Nav-linkButton
+                    ms-Button
+                    ms-Button--action
+                    ms-Button--command
+                    {
+                      -moz-osx-font-smoothing: grayscale;
+                      -webkit-font-smoothing: antialiased;
+                      background-color: transparent;
+                      border-radius: 0px;
+                      border: 1px solid transparent;
+                      box-sizing: border-box;
+                      color: #333333;
+                      cursor: pointer;
+                      display: inline-block;
+                      font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                      font-size: 14px;
+                      font-weight: 400;
+                      height: 40px;
+                      outline: transparent;
+                      padding-bottom: 0;
+                      padding-left: 3px;
+                      padding-right: 20px;
+                      padding-top: 0;
+                      position: relative;
+                      text-align: center;
+                      text-decoration: none;
+                      user-select: none;
+                      vertical-align: top;
+                    }
+                    &::-moz-focus-inner {
+                      border: 0;
+                    }
+                    .ms-Fabric.is-focusVisible &:focus:after {
+                      border: 1px solid #ffffff;
+                      bottom: 0px;
+                      content: "";
+                      left: 0px;
+                      outline: 1px solid #666666;
+                      position: absolute;
+                      right: 0px;
+                      top: 0px;
+                      z-index: 1;
+                    }
+                    &:hover {
+                      color: #0078d7;
+                    }
+                    &:hover .ms-Button-icon {
+                      color: #0078d7;
+                    }
+                    &:active {
+                      color: #000000;
+                    }
+                    &:active .ms-Button-icon {
+                      color: #004578;
+                    }
+                data-is-focusable={true}
+                disabled={undefined}
+                onClick={[Function]}
+                rel={undefined}
+                title=""
+                type="button"
+              >
+                <div
+                  className=
+                      ms-Button-flexContainer
+                      {
+                        align-items: center;
+                        display: flex;
+                        flex-wrap: nowrap;
+                        height: 100%;
+                        justify-content: flex-start;
+                      }
+                >
+                  <i
+                    aria-hidden={true}
+                    aria-label={undefined}
+                    className=
+                        ms-Icon
+                        ms-Icon-placeHolder
+                        ms-Button-icon
+                        {
+                          width: 1em;
+                        }
+                        {
+                          color: #106ebe;
+                          font-size: 16px;
+                          height: 16px;
+                          line-height: 16px;
+                          margin-bottom: 0;
+                          margin-left: 4px;
+                          margin-right: 4px;
+                          margin-top: 0;
+                          text-align: center;
+                          vertical-align: middle;
+                        }
+                    role="presentation"
+                  />
+                  <div
+                    className=
+                        ms-Button-textContainer
+                        {
+                          flex-grow: 0;
+                          overflow: hidden;
+                        }
+                  />
+                </div>
+              </button>
+            </div>
+          </li>
+        </ul>
+      </div>
+    </div>
+  </nav>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
index 09414bd5af25a..eae127131ecbc 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
@@ -1,5 +1,6 @@
 /* tslint:disable-next-line:no-unused-variable */
 import * as React from 'react';
+import * as renderer from 'react-test-renderer';
 import { setRTL } from '../../Utilities';
 import { Persona } from './Persona';
 import { PersonaInitialsColor } from './Persona.Props';
@@ -19,6 +20,18 @@ describe('Persona', () => {
     setRTL(false);
   });
 
+  it('renders Persona correctly with initials', () => {
+    const component = renderer.create(<Persona primaryText='Kat Larrson' />);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
+  it('renders Persona correctly with image', () => {
+    const component = renderer.create(<Persona primaryText='Kat Larrson' imageUrl={ testImage1x1 } />);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
   describe('initials and colors', () => {
     it('renders with expected initialsColor if none was provided', () => {
       const wrapper = mount(<Persona primaryText='Kat Larrson' />);
@@ -36,7 +49,7 @@ describe('Persona', () => {
       expect(result).toHaveLength(1);
     });
 
-    it.only('calculates an expected initials in LTR if one was not specified', () => {
+    it('calculates an expected initials in LTR if one was not specified', () => {
       let wrapper = mount(<Persona primaryText='Kat Larrson' />);
       let result = wrapper.find(STYLES.initials);
       expect(result).toHaveLength(1);
diff --git a/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap
new file mode 100644
index 0000000000000..86af4ef8f37ef
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap
@@ -0,0 +1,201 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Persona renders Persona correctly with image 1`] = `
+<div
+  className="ms-Persona"
+  size={4}
+  style={undefined}
+>
+  <div
+    className="ms-Persona-coin"
+    size={4}
+  >
+    <div
+      className="ms-Persona-imageArea"
+      style={undefined}
+    >
+      <div
+        aria-hidden="true"
+        className="ms-Persona-initials ms-Persona-initials--red undefined"
+        style={undefined}
+      >
+        <span>
+          KL
+        </span>
+      </div>
+      <div
+        className="ms-Image ms-Persona-image"
+        style={
+          Object {
+            "height": 48,
+            "width": 48,
+          }
+        }
+      >
+        <img
+          alt=""
+          className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+          onError={[Function]}
+          onLoad={[Function]}
+          role={undefined}
+          src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQImWP4DwQACfsD/eNV8pwAAAAASUVORK5CYII="
+        />
+      </div>
+    </div>
+  </div>
+  <div
+    className="ms-Persona-details"
+  >
+    <div
+      className="ms-Persona-primaryText"
+    >
+      <div
+        aria-describedby={undefined}
+        className="ms-TooltipHost"
+        onBlurCapture={[Function]}
+        onFocusCapture={[Function]}
+        onMouseEnter={[Function]}
+        onMouseLeave={[Function]}
+      >
+        Kat Larrson
+      </div>
+    </div>
+    <div
+      className="ms-Persona-secondaryText"
+    >
+      <div
+        aria-describedby={undefined}
+        className="ms-TooltipHost"
+        onBlurCapture={[Function]}
+        onFocusCapture={[Function]}
+        onMouseEnter={[Function]}
+        onMouseLeave={[Function]}
+      />
+    </div>
+    <div
+      className="ms-Persona-tertiaryText"
+    >
+      <div
+        aria-describedby={undefined}
+        className="ms-TooltipHost"
+        onBlurCapture={[Function]}
+        onFocusCapture={[Function]}
+        onMouseEnter={[Function]}
+        onMouseLeave={[Function]}
+      />
+    </div>
+    <div
+      className="ms-Persona-optionalText"
+    >
+      <div
+        aria-describedby={undefined}
+        className="ms-TooltipHost"
+        onBlurCapture={[Function]}
+        onFocusCapture={[Function]}
+        onMouseEnter={[Function]}
+        onMouseLeave={[Function]}
+      />
+    </div>
+  </div>
+</div>
+`;
+
+exports[`Persona renders Persona correctly with initials 1`] = `
+<div
+  className="ms-Persona"
+  size={4}
+  style={undefined}
+>
+  <div
+    className="ms-Persona-coin"
+    size={4}
+  >
+    <div
+      className="ms-Persona-imageArea"
+      style={undefined}
+    >
+      <div
+        aria-hidden="true"
+        className="ms-Persona-initials ms-Persona-initials--red undefined"
+        style={undefined}
+      >
+        <span>
+          KL
+        </span>
+      </div>
+      <div
+        className="ms-Image ms-Persona-image"
+        style={
+          Object {
+            "height": 48,
+            "width": 48,
+          }
+        }
+      >
+        <img
+          alt=""
+          className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+          onError={[Function]}
+          onLoad={[Function]}
+          role={undefined}
+          src={undefined}
+        />
+      </div>
+    </div>
+  </div>
+  <div
+    className="ms-Persona-details"
+  >
+    <div
+      className="ms-Persona-primaryText"
+    >
+      <div
+        aria-describedby={undefined}
+        className="ms-TooltipHost"
+        onBlurCapture={[Function]}
+        onFocusCapture={[Function]}
+        onMouseEnter={[Function]}
+        onMouseLeave={[Function]}
+      >
+        Kat Larrson
+      </div>
+    </div>
+    <div
+      className="ms-Persona-secondaryText"
+    >
+      <div
+        aria-describedby={undefined}
+        className="ms-TooltipHost"
+        onBlurCapture={[Function]}
+        onFocusCapture={[Function]}
+        onMouseEnter={[Function]}
+        onMouseLeave={[Function]}
+      />
+    </div>
+    <div
+      className="ms-Persona-tertiaryText"
+    >
+      <div
+        aria-describedby={undefined}
+        className="ms-TooltipHost"
+        onBlurCapture={[Function]}
+        onFocusCapture={[Function]}
+        onMouseEnter={[Function]}
+        onMouseLeave={[Function]}
+      />
+    </div>
+    <div
+      className="ms-Persona-optionalText"
+    >
+      <div
+        aria-describedby={undefined}
+        className="ms-TooltipHost"
+        onBlurCapture={[Function]}
+        onFocusCapture={[Function]}
+        onMouseEnter={[Function]}
+        onMouseLeave={[Function]}
+      />
+    </div>
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.test.tsx b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.test.tsx
new file mode 100644
index 0000000000000..2f0951b9c4198
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.test.tsx
@@ -0,0 +1,17 @@
+import * as React from 'react';
+import * as renderer from 'react-test-renderer';
+
+import { Pivot } from './Pivot';
+import { PivotItem } from './PivotItem';
+
+describe('Pivot', () => {
+  it('renders Pivot correctly', () => {
+    const component = renderer.create(
+      <Pivot>
+        <PivotItem linkText='' />
+        <PivotItem linkText='' />
+      </Pivot>);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap
new file mode 100644
index 0000000000000..9683adf9a2922
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap
@@ -0,0 +1,216 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Pivot renders Pivot correctly 1`] = `
+<div>
+  <div
+    aria-describedby={undefined}
+    aria-labelledby={undefined}
+    className="ms-FocusZone"
+    data-focuszone-id="FocusZone1"
+    onFocus={[Function]}
+    onKeyDown={[Function]}
+    onMouseDownCapture={[Function]}
+    role="presentation"
+  >
+    <ul
+      className="ms-Pivot"
+      role="tablist"
+    >
+      <button
+        aria-describedby={null}
+        aria-label={undefined}
+        aria-labelledby={null}
+        aria-pressed={undefined}
+        aria-selected={true}
+        className=
+            ms-Pivot-link
+            is-selected
+            undefined
+            ms-Button
+            ms-Button--action
+            ms-Button--command
+            {
+              -moz-osx-font-smoothing: grayscale;
+              -webkit-font-smoothing: antialiased;
+              background-color: transparent;
+              border-radius: 0px;
+              border: 1px solid transparent;
+              box-sizing: border-box;
+              color: #333333;
+              cursor: pointer;
+              display: inline-block;
+              font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+              font-size: 14px;
+              font-weight: 400;
+              height: 40px;
+              outline: transparent;
+              padding-bottom: 0;
+              padding-left: 4px;
+              padding-right: 4px;
+              padding-top: 0;
+              position: relative;
+              text-align: center;
+              text-decoration: none;
+              user-select: none;
+              vertical-align: top;
+            }
+            &::-moz-focus-inner {
+              border: 0;
+            }
+            .ms-Fabric.is-focusVisible &:focus:after {
+              border: 1px solid #ffffff;
+              bottom: 0px;
+              content: "";
+              left: 0px;
+              outline: 1px solid #666666;
+              position: absolute;
+              right: 0px;
+              top: 0px;
+              z-index: 1;
+            }
+            &:hover {
+              color: #0078d7;
+            }
+            &:hover .ms-Button-icon {
+              color: #0078d7;
+            }
+            &:active {
+              color: #000000;
+            }
+            &:active .ms-Button-icon {
+              color: #004578;
+            }
+        data-is-focusable={true}
+        disabled={undefined}
+        id="Pivot0-Tab0"
+        onClick={[Function]}
+        onKeyPress={[Function]}
+        role="tab"
+        type="button"
+      >
+        <div
+          className=
+              ms-Button-flexContainer
+              {
+                align-items: center;
+                display: flex;
+                flex-wrap: nowrap;
+                height: 100%;
+                justify-content: flex-start;
+              }
+        >
+          <span
+            className="ms-Pivot-link-content"
+          >
+            <span
+              className="ms-Pivot-text"
+            >
+               
+              
+            </span>
+          </span>
+        </div>
+      </button>
+      <button
+        aria-describedby={null}
+        aria-label={undefined}
+        aria-labelledby={null}
+        aria-pressed={undefined}
+        aria-selected={false}
+        className=
+            ms-Pivot-link
+            ms-Button
+            ms-Button--action
+            ms-Button--command
+            {
+              -moz-osx-font-smoothing: grayscale;
+              -webkit-font-smoothing: antialiased;
+              background-color: transparent;
+              border-radius: 0px;
+              border: 1px solid transparent;
+              box-sizing: border-box;
+              color: #333333;
+              cursor: pointer;
+              display: inline-block;
+              font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+              font-size: 14px;
+              font-weight: 400;
+              height: 40px;
+              outline: transparent;
+              padding-bottom: 0;
+              padding-left: 4px;
+              padding-right: 4px;
+              padding-top: 0;
+              position: relative;
+              text-align: center;
+              text-decoration: none;
+              user-select: none;
+              vertical-align: top;
+            }
+            &::-moz-focus-inner {
+              border: 0;
+            }
+            .ms-Fabric.is-focusVisible &:focus:after {
+              border: 1px solid #ffffff;
+              bottom: 0px;
+              content: "";
+              left: 0px;
+              outline: 1px solid #666666;
+              position: absolute;
+              right: 0px;
+              top: 0px;
+              z-index: 1;
+            }
+            &:hover {
+              color: #0078d7;
+            }
+            &:hover .ms-Button-icon {
+              color: #0078d7;
+            }
+            &:active {
+              color: #000000;
+            }
+            &:active .ms-Button-icon {
+              color: #004578;
+            }
+        data-is-focusable={true}
+        disabled={undefined}
+        id="Pivot0-Tab1"
+        onClick={[Function]}
+        onKeyPress={[Function]}
+        role="tab"
+        type="button"
+      >
+        <div
+          className=
+              ms-Button-flexContainer
+              {
+                align-items: center;
+                display: flex;
+                flex-wrap: nowrap;
+                height: 100%;
+                justify-content: flex-start;
+              }
+        >
+          <span
+            className="ms-Pivot-link-content"
+          >
+            <span
+              className="ms-Pivot-text"
+            >
+               
+              
+            </span>
+          </span>
+        </div>
+      </button>
+    </ul>
+  </div>
+  <div
+    aria-labelledby="Pivot0-Tab0"
+    role="tabpanel"
+  >
+    <div />
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.test.tsx b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.test.tsx
new file mode 100644
index 0000000000000..dbef4b0000313
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.test.tsx
@@ -0,0 +1,12 @@
+import * as React from 'react';
+import * as renderer from 'react-test-renderer';
+
+import { ProgressIndicator } from './ProgressIndicator';
+
+describe('ProgressIndicator', () => {
+  it('renders ProgressIndicator correctly', () => {
+    const component = renderer.create(<ProgressIndicator />);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/__snapshots__/ProgressIndicator.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ProgressIndicator/__snapshots__/ProgressIndicator.test.tsx.snap
new file mode 100644
index 0000000000000..8a72e32525a1f
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/__snapshots__/ProgressIndicator.test.tsx.snap
@@ -0,0 +1,38 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ProgressIndicator renders ProgressIndicator correctly 1`] = `
+<div
+  className="ms-ProgressIndicator"
+>
+  <div
+    className="ms-ProgressIndicator-itemName"
+  >
+    
+  </div>
+  <div
+    className="ms-ProgressIndicator-itemProgress"
+  >
+    <div
+      className="ms-ProgressIndicator-progressTrack"
+    />
+    <div
+      aria-valuemax="100"
+      aria-valuemin="0"
+      aria-valuenow="0"
+      aria-valuetext={undefined}
+      className="ms-ProgressIndicator-progressBar"
+      role="progressbar"
+      style={
+        Object {
+          "width": "0%",
+        }
+      }
+    />
+  </div>
+  <div
+    className="ms-ProgressIndicator-itemDescription"
+  >
+    
+  </div>
+</div>
+`;

From 8505921f6822a7323852c28aaa6c65cb15f36c82 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Thu, 19 Oct 2017 18:29:56 -0700
Subject: [PATCH 0889/1641] Add modal selection support on touch to Selection
 Zone and List controls (#3153)

* Update SelectionZone so invoking an item will not select it

* Support Ctrl + Shift union selection in MarqueeSelection

* Add modal selection behavior to Tile component

* Add modal selection on touch to SelectionZone

* Update TilesList examples to use selection modality

* Add selection modality to DetailsList

* Update change output

* Update snapshot output
---
 .../tile-selection_2017-10-18-22-10.json      | 11 +++
 .../tile-selection_2017-10-18-22-10.json      | 11 +++
 .../src/components/Tile/Tile.Props.ts         |  7 ++
 .../experiments/src/components/Tile/Tile.scss | 56 ++++++++++---
 .../experiments/src/components/Tile/Tile.tsx  | 42 +++++++---
 .../examples/TilesList.Document.Example.tsx   | 50 +++++++++--
 .../examples/TilesList.Media.Example.tsx      | 50 +++++++++--
 .../DetailsList/DetailsList.Props.ts          |  5 ++
 .../components/DetailsList/DetailsList.tsx    |  1 +
 .../components/DetailsList/DetailsRow.scss    | 21 ++++-
 .../src/components/DetailsList/DetailsRow.tsx | 27 ++++--
 .../DetailsList/DetailsRowCheck.scss          | 18 ++--
 .../DetailsList/DetailsRowCheck.tsx           | 26 +++---
 .../examples/DetailsList.Advanced.Example.tsx |  2 +-
 .../DetailsList.Documents.Example.tsx         | 44 +++++++---
 .../MarqueeSelection/MarqueeSelection.tsx     | 33 ++++++++
 .../__snapshots__/BasePicker.test.tsx.snap    |  4 +
 .../src/utilities/selection/Selection.ts      | 82 ++++++++++++++++---
 .../selection/SelectionZone.test.tsx          | 14 +++-
 .../src/utilities/selection/SelectionZone.tsx | 65 ++++++++++++++-
 .../src/utilities/selection/interfaces.ts     |  5 ++
 21 files changed, 470 insertions(+), 104 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/tile-selection_2017-10-18-22-10.json
 create mode 100644 common/changes/office-ui-fabric-react/tile-selection_2017-10-18-22-10.json

diff --git a/common/changes/@uifabric/experiments/tile-selection_2017-10-18-22-10.json b/common/changes/@uifabric/experiments/tile-selection_2017-10-18-22-10.json
new file mode 100644
index 0000000000000..e71dc005b1cdd
--- /dev/null
+++ b/common/changes/@uifabric/experiments/tile-selection_2017-10-18-22-10.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Add modal selection behavior to TilesList",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/tile-selection_2017-10-18-22-10.json b/common/changes/office-ui-fabric-react/tile-selection_2017-10-18-22-10.json
new file mode 100644
index 0000000000000..2cb79ee400442
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/tile-selection_2017-10-18-22-10.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add opt-in modal selection behavior on touch",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Tile/Tile.Props.ts b/packages/experiments/src/components/Tile/Tile.Props.ts
index 8f5e7a43b9d4b..f129480b2e78b 100644
--- a/packages/experiments/src/components/Tile/Tile.Props.ts
+++ b/packages/experiments/src/components/Tile/Tile.Props.ts
@@ -38,6 +38,13 @@ export interface ITileProps extends IBaseProps, React.AllHTMLAttributes<HTMLSpan
    * @memberof ITileProps
    */
   selection?: ISelection;
+  /**
+   * Whether or not the item should be invoked if clicked.
+   *
+   * @type {boolean}
+   * @memberof ITileProps
+   */
+  invokeSelection?: boolean;
   /**
    * Name to use on the nameplate for the tile.
    *
diff --git a/packages/experiments/src/components/Tile/Tile.scss b/packages/experiments/src/components/Tile/Tile.scss
index 10b55dd817e58..207b5f43611e6 100644
--- a/packages/experiments/src/components/Tile/Tile.scss
+++ b/packages/experiments/src/components/Tile/Tile.scss
@@ -15,7 +15,9 @@
   transition: transform 0.1s linear;
   color: $ms-color-neutralPrimary;
 
-  &:hover {
+  user-select: none;
+
+  &.selectable:hover {
     background-color: $ms-color-neutralLighter;
 
     &.selected {
@@ -46,7 +48,7 @@
   &.hasBackgroundFrame {
     box-shadow: 0 1px 3px 1px rgba(1, 1, 0, 0.05);
 
-    &:hover {
+    &.selectable:hover {
       outline: 1px solid $ms-color-neutralTertiaryAlt;
     }
 
@@ -71,7 +73,7 @@
     }
   }
 
-  &:active {
+  &.invokable:active {
     transform: scale(0.95);
   }
 }
@@ -100,6 +102,8 @@
   align-items: stretch;
   align-content: stretch;
   text-decoration: none;
+
+  pointer-events: none;
 }
 
 .foreground {
@@ -114,6 +118,11 @@
   opacity: 1;
   transition: opacity 0.2s linear;
 
+  .tile.invokable & {
+    pointer-events: auto;
+    cursor: pointer;
+  }
+
   &.foregroundHide {
     opacity: 0;
   }
@@ -141,18 +150,29 @@
 .check {
   @include focus-border($position: absolute);
   display: none;
+  flex-direction: column;
+  align-items: flex-end;
+  justify-content: flex-start;
   top: 0;
   @include right(0);
   border: none;
   background: none;
   opacity: 0;
+  box-sizing: border-box;
+  padding: 6px;
+
+  .tile.uninvokable & {
+    width: 100%;
+    height: 100%;
+  }
 
   .tile.selectable & {
-    display: block;
+    display: flex;
   }
 
   .tile.selected &,
-  .tile:hover & {
+  .tile:hover &,
+  .tile.showCheck & {
     opacity: 1;
   }
 
@@ -169,10 +189,6 @@
   }
 }
 
-button.check {
-  padding: 6px;
-}
-
 .background {
   position: absolute;
   top: 0;
@@ -185,6 +201,11 @@ button.check {
   align-items: center;
   justify-content: center;
 
+  .tile.invokable & {
+    cursor: pointer;
+    pointer-events: auto;
+  }
+
   opacity: 1;
 
   transition: opacity 0.2s linear;
@@ -217,7 +238,10 @@ button.check {
 }
 
 .nameplate {
-  display: block;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: flex-end;
   position: relative;
   margin: auto 0 0 0;
   padding: 12px 8px;
@@ -225,7 +249,16 @@ button.check {
   z-index: 0;
 
   .name {
+    .tile.invokable & {
+      pointer-events: auto;
+      cursor: pointer;
+    }
+
     transition: color 0.2s linear;
+
+    .link:hover & {
+      text-decoration: underline;
+    }
   }
 
   .activity {
@@ -233,6 +266,7 @@ button.check {
   }
 
   .tile.hasBackgroundFrame & {
+    align-items: flex-start;
     padding: 12px 10px;
   }
 }
@@ -263,6 +297,7 @@ button.check {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
+  max-width: 100%;
 
   @include margin-left(-8px);
   @include padding-left(8px);
@@ -302,6 +337,7 @@ button.check {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
+  max-width: 100%;
 
   // Simulate a 20px line-height by using negative margins.
   // This allows extenders and descenders to fit while still enforcing bounds
diff --git a/packages/experiments/src/components/Tile/Tile.tsx b/packages/experiments/src/components/Tile/Tile.tsx
index d5080f5a65bd3..0c00518d0b9f0 100644
--- a/packages/experiments/src/components/Tile/Tile.tsx
+++ b/packages/experiments/src/components/Tile/Tile.tsx
@@ -26,6 +26,7 @@ const enum TileLayoutValues {
 
 export interface ITileState {
   isSelected?: boolean;
+  isModal?: boolean;
 }
 
 const SIZES: {
@@ -81,9 +82,11 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
     } = props;
 
     const isSelected = !!selection && selectionIndex > -1 && selection.isIndexSelected(selectionIndex);
+    const isModal = !!selection && !!selection.isModal && selection.isModal();
 
     this.state = {
-      isSelected: isSelected
+      isSelected: isSelected,
+      isModal: isModal
     };
   }
 
@@ -100,9 +103,11 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
 
     if (selection !== nextSelection || selectionIndex !== nextSelectionIndex) {
       const isSelected = !!nextSelection && nextSelectionIndex > -1 && nextSelection.isIndexSelected(nextSelectionIndex);
+      const isModal = !!nextSelection && nextSelection.isModal && nextSelection.isModal();
 
       this.setState({
-        isSelected: isSelected
+        isSelected: isSelected,
+        isModal: isModal
       });
     }
   }
@@ -141,6 +146,7 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
     const {
       children,
       selectionIndex = -1,
+      invokeSelection = false,
       selection,
       background,
       foreground,
@@ -161,12 +167,14 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
       ...divProps
     } = this.props;
 
-    const isSelectable = !!selection && selectionIndex > -1;
-
     const {
-      isSelected = false
+      isSelected = false,
+      isModal = false
     } = this.state;
 
+    const isSelectable = !!selection && selectionIndex > -1;
+    const isInvokable = (!!href || !!onClick || !!invokeSelection) && !isModal;
+
     return (
       <div
         aria-selected={ isSelected }
@@ -182,7 +190,11 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
           [`ms-Tile--isSelectable ${TileStyles.selectable}`]: isSelectable,
           [`ms-Tile--hasBackground ${TileStyles.hasBackground}`]: !!background,
           [SignalStyles.dark]: !!background && !hideBackground,
-          [`ms-Tile--showBackground ${TileStyles.showBackground}`]: !hideBackground
+          [`ms-Tile--showBackground ${TileStyles.showBackground}`]: !hideBackground,
+          [`ms-Tile--invokable ${TileStyles.invokable}`]: isInvokable,
+          [`ms-Tile--uninvokable ${TileStyles.uninvokable}`]: !isInvokable,
+          [`ms-Tile--isDisabled ${TileStyles.disabled}`]: !isSelectable && !isInvokable,
+          [`ms-Tile--showCheck ${TileStyles.showCheck}`]: isModal
         }) }
         data-is-focusable={ true }
         data-is-sub-focuszone={ true }
@@ -192,7 +204,7 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
         <a
           href={ href }
           onClick={ onClick }
-          data-selection-invoke={ (selectionIndex > -1) ? true : undefined }
+          data-selection-invoke={ (isInvokable && selectionIndex > -1) ? true : undefined }
           className={ css('ms-Tile-link', TileStyles.link) }
         >
           {
@@ -331,17 +343,19 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
       isSelected: boolean;
     }): JSX.Element {
     return (
-      <button
+      <span
+        role='checkbox'
         aria-label={ this.props.toggleSelectionAriaLabel }
-        className={ css('ms-Tile-check', TileStyles.check, CheckStyles.checkHost) }
+        className={ css('ms-Tile-check', TileStyles.check, CheckStyles.checkHost, {
+          [CheckStyles.hostShowCheck]: this.state.isModal
+        }) }
         data-selection-toggle={ true }
-        role='checkbox'
         aria-checked={ isSelected }
       >
         <Check
           checked={ isSelected }
         />
-      </button>
+      </span>
     );
   }
 
@@ -352,8 +366,12 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
       selectionIndex = -1
     } = this.props;
 
+    const isSelected = selectionIndex > -1 && !!selection && selection.isIndexSelected(selectionIndex);
+    const isModal = !!selection && !!selection.isModal && selection.isModal();
+
     this.setState({
-      isSelected: selectionIndex > -1 && selection && selection.isIndexSelected(selectionIndex)
+      isSelected: isSelected,
+      isModal: isModal
     });
   }
 }
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
index 5e319ef50ee81..88314a614f37d 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
@@ -1,9 +1,12 @@
 
 import * as React from 'react';
 import {
-  TilesList
+  TilesList,
+  ITilesGridItem,
+  ITilesGridSegment
 } from '../../TilesList';
 import { Tile } from '../../../Tile';
+import { Toggle } from 'office-ui-fabric-react/lib/Toggle';
 import { Selection, SelectionZone } from 'office-ui-fabric-react/lib/Selection';
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
@@ -34,7 +37,12 @@ declare class TilesListClass extends TilesList<IExampleItem> { }
 
 const TilesListType: typeof TilesListClass = TilesList;
 
-export class TilesListDocumentExample extends React.Component<{}, {}> {
+export interface ITilesListDocumentExampleState {
+  isModalSelection: boolean;
+  cells: (ITilesGridItem<IExampleItem> | ITilesGridSegment<IExampleItem>)[];
+}
+
+export class TilesListDocumentExample extends React.Component<{}, ITilesListDocumentExampleState> {
   private _selection: Selection;
 
   constructor() {
@@ -42,27 +50,40 @@ export class TilesListDocumentExample extends React.Component<{}, {}> {
 
     this._selection = new Selection({
       getKey: (item: IExampleItem) => item.key,
+      onSelectionChanged: this._onSelectionChange
     });
 
     this._selection.setItems(ITEMS);
+
+    this.state = {
+      isModalSelection: this._selection.isModal(),
+      cells: getTileCells(GROUPS, {
+        onRenderCell: this._onRenderDocumentCell,
+        onRenderHeader: this._onRenderHeader
+      })
+    };
   }
-  public render(): JSX.Element {
-    const items = getTileCells(GROUPS, {
-      onRenderCell: this._onRenderDocumentCell,
-      onRenderHeader: this._onRenderHeader
-    });
 
+  public render(): JSX.Element {
     return (
       // tslint:disable-next-line:jsx-ban-props
       <div style={ { padding: '4px' } }>
+        <Toggle
+          label='Enable Modal Selection'
+          checked={ this.state.isModalSelection }
+          onChanged={ this._onToggleIsModalSelection }
+          onText='Modal'
+          offText='Normal'
+        />
         <MarqueeSelection selection={ this._selection }>
           <SelectionZone
             selection={ this._selection }
             onItemInvoked={ this._onItemInvoked }
+            enterModalOnTouch={ true }
           >
             <TilesListType
               role='list'
-              items={ items }
+              items={ this.state.cells }
             />
           </SelectionZone>
         </MarqueeSelection>
@@ -70,6 +91,18 @@ export class TilesListDocumentExample extends React.Component<{}, {}> {
     );
   }
 
+    @autobind
+    private _onToggleIsModalSelection(checked: boolean): void {
+      this._selection.setModal(checked);
+    }
+
+    @autobind
+    private _onSelectionChange(): void {
+      this.setState({
+        isModalSelection: this._selection.isModal()
+      });
+    }
+
   @autobind
   private _onItemInvoked(item: IExampleItem, index: number, event: Event): void {
     event.stopPropagation();
@@ -88,6 +121,7 @@ export class TilesListDocumentExample extends React.Component<{}, {}> {
         className={ AnimationClassNames.fadeIn400 }
         selection={ this._selection }
         selectionIndex={ item.index }
+        invokeSelection={ true }
         foreground={
           <img
             src={
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
index 066601a93e831..ed21c13734527 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
@@ -2,9 +2,12 @@
 import * as React from 'react';
 import {
   TilesList,
-  ITileSize
+  ITileSize,
+  ITilesGridItem,
+  ITilesGridSegment
 } from '../../TilesList';
 import { Tile, getTileLayout, renderTileWithLayout } from '../../../Tile';
+import { Toggle } from 'office-ui-fabric-react/lib/Toggle';
 import { Selection, SelectionZone } from 'office-ui-fabric-react/lib/Selection';
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
@@ -39,7 +42,12 @@ declare class TilesListClass extends TilesList<IExampleItem> { }
 
 const TilesListType: typeof TilesListClass = TilesList;
 
-export class TilesListMediaExample extends React.Component<{}, {}> {
+export interface ITilesListMediaExampleState {
+  isModalSelection: boolean;
+  cells: (ITilesGridItem<IExampleItem> | ITilesGridSegment<IExampleItem>)[];
+}
+
+export class TilesListMediaExample extends React.Component<{}, ITilesListMediaExampleState> {
   private _selection: Selection;
 
   constructor() {
@@ -47,27 +55,40 @@ export class TilesListMediaExample extends React.Component<{}, {}> {
 
     this._selection = new Selection({
       getKey: (item: IExampleItem) => item.key,
+      onSelectionChanged: this._onSelectionChange
     });
 
     this._selection.setItems(ITEMS);
+
+    this.state = {
+      isModalSelection: this._selection.isModal(),
+      cells: getTileCells(GROUPS, {
+        onRenderCell: this._onRenderMediaCell,
+        onRenderHeader: this._onRenderHeader
+      })
+    };
   }
-  public render(): JSX.Element {
-    const items = getTileCells(GROUPS, {
-      onRenderCell: this._onRenderMediaCell,
-      onRenderHeader: this._onRenderHeader
-    });
 
+  public render(): JSX.Element {
     return (
       // tslint:disable-next-line:jsx-ban-props
       <div style={ { padding: '4px' } }>
+        <Toggle
+          label='Enable Modal Selection'
+          checked={ this.state.isModalSelection }
+          onChanged={ this._onToggleIsModalSelection }
+          onText='Modal'
+          offText='Normal'
+        />
         <MarqueeSelection selection={ this._selection }>
           <SelectionZone
             selection={ this._selection }
             onItemInvoked={ this._onItemInvoked }
+            enterModalOnTouch={ true }
           >
             <TilesListType
               role='list'
-              items={ items }
+              items={ this.state.cells }
             />
           </SelectionZone>
         </MarqueeSelection>
@@ -75,6 +96,18 @@ export class TilesListMediaExample extends React.Component<{}, {}> {
     );
   }
 
+  @autobind
+  private _onToggleIsModalSelection(checked: boolean): void {
+    this._selection.setModal(checked);
+  }
+
+  @autobind
+  private _onSelectionChange(): void {
+    this.setState({
+      isModalSelection: this._selection.isModal()
+    });
+  }
+
   @autobind
   private _onItemInvoked(item: IExampleItem, index: number, event: Event): void {
     event.stopPropagation();
@@ -94,6 +127,7 @@ export class TilesListMediaExample extends React.Component<{}, {}> {
         className={ AnimationClassNames.fadeIn400 }
         selection={ this._selection }
         selectionIndex={ item.index }
+        invokeSelection={ true }
         background={
           <span /> // Placeholder
         }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
index cc4e0eb489ba6..8b3be55e7204d 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
@@ -205,6 +205,11 @@ export interface IDetailsListProps extends React.Props<DetailsList>, IWithViewpo
    * Optional class name to add to the cell of a checkbox
    */
   checkboxCellClassName?: string;
+
+  /**
+   * Whether or not the selection zone should enter modal state on touch.
+   */
+  enterModalSelectionOnTouch?: boolean;
 }
 
 export interface IColumn {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 0fea6a7323ded..fdddc26cdbf8f 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -322,6 +322,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
                 selectionMode={ selectionMode }
                 onItemInvoked={ onItemInvoked }
                 onItemContextMenu={ onItemContextMenu }
+                enterModalOnTouch={ this.props.enterModalSelectionOnTouch }
               >
                 { groups ? (
                   <GroupedList
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
index 9c4f0798e23f3..f4d4cc67cd88b 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.scss
@@ -190,6 +190,11 @@ $detailsList-item-focus-meta-text-color: $ms-color-neutralDark;
 
   &.checkCell {
     padding: 0;
+    // Ensure that the check cell covers the top border of the cell.
+    // This ensures the click target does not leave a spot which would
+    // cause other items to be deselected.
+    padding-top: 1px;
+    margin-top: -1px;
   }
 
   & > button {
@@ -212,8 +217,7 @@ $detailsList-item-focus-meta-text-color: $ms-color-neutralDark;
   @include ms-padding-right($isPaddedMargin + $rowHorizontalPadding);
 
   &.checkCell {
-    padding: 0;
-    margin: 0;
+    @include ms-padding-right(0);
   }
 }
 
@@ -232,3 +236,16 @@ $detailsList-item-focus-meta-text-color: $ms-color-neutralDark;
   overflow: visible;
   white-space: nowrap;
 }
+
+.checkCover {
+  position: absolute;
+  top: -1px;
+  left: 0;
+  bottom: 0;
+  right: 0;
+  display: none;
+
+  .anySelected & {
+    display: block;
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index e863f240ffcee..eee280f4ea94c 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -23,10 +23,11 @@ import {
   IDragDropOptions,
 } from './../../utilities/dragdrop/interfaces';
 import { IViewport } from '../../utilities/decorators/withViewport';
+import { AnimationClassNames } from '../../Styling';
 import * as stylesImport from './DetailsRow.scss';
 const styles: any = stylesImport;
-import { AnimationClassNames } from '../../Styling';
-import * as checkStyles from './DetailsRowCheck.scss';
+import * as checkStylesImport from './DetailsRowCheck.scss';
+const checkStyles: any = checkStylesImport;
 
 export interface IDetailsRowProps extends React.Props<DetailsRow> {
   componentRef?: () => void;
@@ -54,7 +55,7 @@ export interface IDetailsRowProps extends React.Props<DetailsRow> {
 
 export interface IDetailsRowSelectionState {
   isSelected: boolean;
-  anySelected: boolean;
+  isSelectionModal: boolean;
 }
 
 export interface IDetailsRowState {
@@ -186,10 +187,10 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
       getRowAriaLabel,
       checkButtonAriaLabel,
       checkboxCellClassName,
-      selection
+      selection,
     } = this.props;
     const { columnMeasureInfo, isDropping, groupNestingDepth } = this.state;
-    const { isSelected, anySelected } = this.state.selectionState as IDetailsRowSelectionState;
+    const { isSelected = false, isSelectionModal = false } = this.state.selectionState as IDetailsRowSelectionState;
     const isDraggable = Boolean(dragDropEvents && dragDropEvents.canDrag && dragDropEvents.canDrag(item));
     const droppingClassName = isDropping ? (this._droppingClassNames ? this._droppingClassNames : DEFAULT_DROPPING_CSS_CLASS) : '';
     const ariaLabel = getRowAriaLabel ? getRowAriaLabel(item) : null;
@@ -214,6 +215,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
           {
             [`is-contentUnselectable ${styles.rootIsContentUnselectable}`]: isContentUnselectable,
             [`is-selected ${checkStyles.isSelected} ${styles.rootIsSelected}`]: isSelected,
+            [`${styles.anySelected} ${checkStyles.anySelected}`]: isSelectionModal,
             [`is-check-visible ${checkStyles.isVisible}`]: checkboxVisibility === CheckboxVisibility.always
           }) }
         data-is-focusable={ true }
@@ -235,10 +237,10 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
             className={ css('ms-DetailsRow-cell', 'ms-DetailsRow-cellCheck', checkStyles.owner, styles.cell, styles.checkCell, checkboxCellClassName) }
           >
             { onRenderCheck({
-              isSelected,
-              anySelected,
+              selected: isSelected,
+              anySelected: isSelectionModal,
               title: checkButtonAriaLabel,
-              canSelect
+              canSelect: canSelect
             }) }
           </div>
         ) }
@@ -270,6 +272,13 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
             />
           </span>
         ) }
+
+        <span
+          role='checkbox'
+          className={ css(styles.checkCover) }
+          aria-checked={ isSelected }
+          data-selection-toggle={ true }
+        />
       </FocusZone>
     );
   }
@@ -310,7 +319,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
 
     return {
       isSelected: selection.isIndexSelected(itemIndex),
-      anySelected: selection.getSelectedCount() > 0
+      isSelectionModal: !!selection.isModal && selection.isModal()
     };
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
index a00a3769eddf7..7a887fe60b318 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
@@ -4,7 +4,9 @@
 .check {
   @include focus-border();
 
-  display: inline-block;
+  display: flex;
+  align-items: center;
+  justify-content: center;
   cursor: default;
   box-sizing: border-box;
   vertical-align: top;
@@ -12,24 +14,20 @@
   border: none;
   opacity: 0;
 
-  &:focus {
-    opacity: 1;
-  }
-}
-
-button.check {
   height: 40px;
   width: 40px;
   padding: 0;
   margin: 0;
-  display: flex;
-  align-items: center;
-  justify-content: center;
+
+  @include focus(true) {
+    opacity: 1;
+  }
 }
 
 .owner {
   &.isSelected,
   &.isVisible,
+  &.anySelected,
   &:hover {
     .check {
       opacity: 1;
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx
index 5642e3de56d6b..f5bd1ed4c870e 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx
@@ -17,32 +17,30 @@ export interface IDetailsRowCheckProps extends React.HTMLAttributes<HTMLElement>
    * @deprecated
    */
   isSelected?: boolean;
-  anySelected: boolean;
+  anySelected?: boolean;
   canSelect: boolean;
 }
 
 export const DetailsRowCheck = (props: IDetailsRowCheckProps) => {
   const {
-    canSelect,
-    isSelected,
-    anySelected,
-    selected,
+    canSelect = false,
+    isSelected = false,
+    anySelected = false,
+    selected = false,
     ...buttonProps
   } = props;
 
   let isPressed = props.isSelected || props.selected;
 
   return (
-    <button
+    <div
       { ...buttonProps }
       role='checkbox'
-      className={ css(
-        'ms-DetailsRow-check',
-        DetailsRowCheckStyles.check,
-        CheckStyles.checkHost,
-        !props.canSelect && DetailsRowCheckStyles.isDisabled,
-        !props.canSelect && 'ms-DetailsRow-check--isDisabled'
-      ) }
+      className={
+        css('ms-DetailsRow-check', DetailsRowCheckStyles.check, CheckStyles.checkHost, {
+          [`ms-DetailsRow-check--isDisabled ${DetailsRowCheckStyles.isDisabled}`]: !props.canSelect
+        })
+      }
       aria-checked={ isPressed }
       data-selection-toggle={ true }
       data-automationid='DetailsRowCheck'
@@ -50,6 +48,6 @@ export const DetailsRowCheck = (props: IDetailsRowCheckProps) => {
       <Check
         checked={ isPressed }
       />
-    </button>
+    </div>
   );
 };
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
index 680420df54217..a7844c152b761 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
@@ -618,7 +618,7 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
         column.minWidth = 200;
       } else if (column.key === 'name') {
         column.onRender = (item) => (
-          <Link>{ item.name }</Link>
+          <Link data-selection-invoke={ true }>{ item.name }</Link>
         );
       } else if (column.key === 'key') {
         column.columnActionsMode = ColumnActionsMode.disabled;
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
index ca69ad4f51b78..01151d06021f9 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
@@ -46,6 +46,7 @@ export interface IDetailsListDocumentsExampleState {
   columns: IColumn[];
   items: IDocument[];
   selectionDetails: string;
+  isModalSelection: boolean;
   isCompactMode: boolean;
 }
 
@@ -137,9 +138,7 @@ export class DetailsListDocumentsExample extends React.Component<any, IDetailsLi
         data: 'number',
         onRender: (item: IDocument) => {
           return (
-            <span
-              data-is-focusable={ true }
-            >
+            <span>
               { item.dateModified }
             </span>
           );
@@ -157,9 +156,7 @@ export class DetailsListDocumentsExample extends React.Component<any, IDetailsLi
         onColumnClick: this._onColumnClick,
         onRender: (item: IDocument) => {
           return (
-            <span
-              data-is-focusable={ true }
-            >
+            <span>
               { item.modifiedBy }
             </span>
           );
@@ -177,9 +174,7 @@ export class DetailsListDocumentsExample extends React.Component<any, IDetailsLi
         onColumnClick: this._onColumnClick,
         onRender: (item: IDocument) => {
           return (
-            <span
-              data-is-focusable={ true }
-            >
+            <span>
               { item.fileSize }
             </span>
           );
@@ -188,13 +183,19 @@ export class DetailsListDocumentsExample extends React.Component<any, IDetailsLi
     ];
 
     this._selection = new Selection({
-      onSelectionChanged: () => this.setState({ selectionDetails: this._getSelectionDetails() })
+      onSelectionChanged: () => {
+        this.setState({
+          selectionDetails: this._getSelectionDetails(),
+          isModalSelection: this._selection.isModal()
+        });
+      }
     });
 
     this.state = {
       items: _items,
       columns: _columns,
       selectionDetails: this._getSelectionDetails(),
+      isModalSelection: this._selection.isModal(),
       isCompactMode: false
     };
   }
@@ -207,10 +208,17 @@ export class DetailsListDocumentsExample extends React.Component<any, IDetailsLi
         <Toggle
           label='Enable Compact Mode'
           checked={ isCompactMode }
-          onChanged={ this._onChangeToggle }
+          onChanged={ this._onChangeCompactMode }
           onText='Compact'
           offText='Normal'
         />
+        <Toggle
+          label='Enable Modal Selection'
+          checked={ this.state.isModalSelection }
+          onChanged={ this._onChangeModalSelection }
+          onText='Modal'
+          offText='Normal'
+        />
         <div>{ selectionDetails }</div>
         <TextField
           label='Filter by name:'
@@ -227,17 +235,29 @@ export class DetailsListDocumentsExample extends React.Component<any, IDetailsLi
             selection={ this._selection }
             selectionPreservedOnEmptyClick={ true }
             onItemInvoked={ this._onItemInvoked }
+            enterModalSelectionOnTouch={ true }
           />
         </MarqueeSelection>
       </div>
     );
   }
 
+  public componentDidUpdate(previousProps: any, previousState: IDetailsListDocumentsExampleState) {
+    if (previousState.isModalSelection !== this.state.isModalSelection) {
+      this._selection.setModal(this.state.isModalSelection);
+    }
+  }
+
   @autobind
-  private _onChangeToggle(checked: boolean): void {
+  private _onChangeCompactMode(checked: boolean): void {
     this.setState({ isCompactMode: checked });
   }
 
+  @autobind
+  private _onChangeModalSelection(checked: boolean): void {
+    this.setState({ isModalSelection: checked });
+  }
+
   @autobind
   private _onChangeText(text: any): void {
     this.setState({ items: text ? _items.filter(i => i.name.toLowerCase().indexOf(text) > -1) : _items });
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
index bfe5a6e55cdb7..a9fae0a1631f9 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
@@ -48,6 +48,7 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
   private _lastMouseEvent: MouseEvent | undefined;
   private _autoScroll: AutoScroll | undefined;
   private _selectedIndicies: { [key: string]: boolean } | undefined;
+  private _preservedIndicies: number[] | undefined;
   private _itemRectCache: { [key: string]: IRectangle } | undefined;
   private _scrollableParent: HTMLElement;
   private _scrollableSurface: HTMLElement;
@@ -164,9 +165,14 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
       return;
     }
 
+    if (this._isInSelectionToggle(ev)) {
+      return;
+    }
+
     if (!this._isTouch && isEnabled && !this._isDragStartInSelection(ev) && (!onShouldStartSelection || onShouldStartSelection(ev))) {
       if (this._scrollableSurface && ev.button === 0) {
         this._selectedIndicies = {};
+        this._preservedIndicies = undefined;
         this._events.on(window, 'mousemove', this._onAsyncMouseMove);
         this._events.on(this._scrollableParent, 'scroll', this._onAsyncMouseMove);
         this._events.on(window, 'click', this._onMouseUp, true);
@@ -238,6 +244,13 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
       this._onMouseUp(ev);
     } else {
       if (this.state.dragRect || getDistanceBetweenPoints(this._dragOrigin, currentPoint) > MIN_DRAG_DISTANCE) {
+        if (!this.state.dragRect) {
+          const {
+            selection
+          } = this.props;
+
+          this._preservedIndicies = selection && selection.getSelectedIndices && selection.getSelectedIndices();
+        }
         // We need to constrain the current point to the rootRect boundaries.
         let constrainedPoint = this.props.isDraggingConstrainedToRoot ? {
           x: Math.max(0, Math.min(rootRect.width, this._lastMouseEvent!.clientX - rootRect.left)),
@@ -316,6 +329,20 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
     return false;
   }
 
+  private _isInSelectionToggle(ev: MouseEvent): boolean {
+    let element: HTMLElement | null = ev.target as HTMLElement;
+
+    while (element && element !== this.refs.root) {
+      if (element.getAttribute('data-selection-toggle') === 'true') {
+        return true;
+      }
+
+      element = element.parentElement;
+    }
+
+    return false;
+  }
+
   private _evaluateSelection(dragRect: IRectangle, rootRect: IRectangle) {
     // Break early if we don't need to evaluate.
     if (!dragRect) {
@@ -376,6 +403,12 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
       }
     }
 
+    if (this._preservedIndicies) {
+      for (const index of this._preservedIndicies) {
+        selection.setIndexSelected(index, true, false);
+      }
+    }
+
     selection.setChangeEvents(true);
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
index 5f82ce3c5d212..58c34d01731c6 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
@@ -33,6 +33,8 @@ exports[`Pickers BasePicker renders BasePicker correctly 1`] = `
       onKeyDownCapture={[Function]}
       onMouseDown={[Function]}
       onMouseDownCapture={[Function]}
+      onTouchEndCapture={[Function]}
+      onTouchStartCapture={[Function]}
       role="presentation"
     >
       <div
@@ -95,6 +97,8 @@ exports[`Pickers TagPicker renders TagPicker correctly 1`] = `
       onKeyDownCapture={[Function]}
       onMouseDown={[Function]}
       onMouseDownCapture={[Function]}
+      onTouchEndCapture={[Function]}
+      onTouchStartCapture={[Function]}
       role="presentation"
     >
       <div
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts b/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
index 59116b8f83383..13c319b420b11 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
@@ -19,6 +19,7 @@ export class Selection implements ISelection {
   private _changeEventSuppressionCount: number;
   private _items: IObjectWithKey[];
   private _selectedItems: IObjectWithKey[] | null;
+  private _selectedIndices: number[] | undefined;
   private _isAllSelected: boolean;
   private _exemptedIndices: { [index: string]: boolean };
   private _exemptedCount: number;
@@ -28,6 +29,7 @@ export class Selection implements ISelection {
   private _hasChanged: boolean;
   private _unselectableIndices: { [index: string]: boolean };
   private _unselectableCount: number;
+  private _isModal: boolean;
 
   constructor(options: ISelectionOptions = {}) {
     const {
@@ -49,6 +51,8 @@ export class Selection implements ISelection {
     this._onSelectionChanged = onSelectionChanged;
     this._canSelectItem = canSelectItem;
 
+    this._isModal = false;
+
     this.setItems([], true);
   }
 
@@ -76,6 +80,26 @@ export class Selection implements ISelection {
     }
   }
 
+  public isModal(): boolean {
+    return this._isModal;
+  }
+
+  public setModal(isModal: boolean): void {
+    if (this._isModal !== isModal) {
+      this.setChangeEvents(true);
+
+      this._isModal = isModal;
+
+      if (!isModal) {
+        this.setAllSelected(false);
+      }
+
+      this._change();
+
+      this.setChangeEvents(false);
+    }
+  }
+
   /**
    * Selection needs the items, call this method to set them. If the set
    * of items is the same, this will re-evaluate selection and index maps.
@@ -157,9 +181,13 @@ export class Selection implements ISelection {
     if (!this._selectedItems) {
       this._selectedItems = [];
 
-      for (let i = 0; i < this._items.length; i++) {
-        if (this.isIndexSelected(i)) {
-          this._selectedItems.push(this._items[i]);
+      const items = this._items;
+
+      if (items) {
+        for (let i = 0; i < items.length; i++) {
+          if (this.isIndexSelected(i)) {
+            this._selectedItems.push(items[i]);
+          }
         }
       }
     }
@@ -171,6 +199,24 @@ export class Selection implements ISelection {
     return this._isAllSelected ? (this._items.length - this._exemptedCount - this._unselectableCount) : (this._exemptedCount);
   }
 
+  public getSelectedIndices(): number[] {
+    if (!this._selectedIndices) {
+      this._selectedIndices = [];
+
+      const items = this._items;
+
+      if (items) {
+        for (let i = 0; i < items.length; i++) {
+          if (this.isIndexSelected(i)) {
+            this._selectedIndices.push(i);
+          }
+        }
+      }
+    }
+
+    return this._selectedIndices;
+  }
+
   public isRangeSelected(fromIndex: number, count: number): boolean {
     if (count === 0) {
       return false;
@@ -221,12 +267,21 @@ export class Selection implements ISelection {
 
     let selectableCount = this._items ? (this._items.length - this._unselectableCount) : 0;
 
+    this.setChangeEvents(false);
+
     if (selectableCount > 0 && (this._exemptedCount > 0 || isAllSelected !== this._isAllSelected)) {
       this._exemptedIndices = {};
-      this._exemptedCount = 0;
-      this._isAllSelected = isAllSelected;
+
+      if (isAllSelected !== this._isAllSelected || this._exemptedCount > 0) {
+        this._exemptedCount = 0;
+        this._isAllSelected = isAllSelected;
+        this._change();
+      }
+
       this._updateCount();
     }
+
+    this.setChangeEvents(true);
   }
 
   public setKeySelected(key: string, isSelected: boolean, shouldAnchor: boolean): void {
@@ -287,9 +342,7 @@ export class Selection implements ISelection {
       }
     }
 
-    if (hasChanged) {
-      this._updateCount();
-    }
+    this._updateCount();
 
     this.setChangeEvents(true);
   }
@@ -357,13 +410,22 @@ export class Selection implements ISelection {
   }
 
   private _updateCount(): void {
-    this.count = this.getSelectedCount();
-    this._change();
+    const count = this.getSelectedCount();
+
+    if (count !== this.count) {
+      this.count = count;
+      this._change();
+    }
+
+    if (!this.count) {
+      this.setModal(false);
+    }
   }
 
   private _change(): void {
     if (this._changeEventSuppressionCount === 0) {
       this._selectedItems = null;
+      this._selectedIndices = undefined;
 
       EventGroup.raise(this, SELECTION_CHANGE);
 
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
index d4fa230b74428..42dfb6d0c2007 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
@@ -99,12 +99,12 @@ describe('SelectionZone', () => {
     expect(_onItemInvokeCalled).toEqual(0);
   });
 
-  it('selects an unselected item on mousedown of invoke without modifiers pressed', () => {
+  it('selects an unselected item on mousedown of surface without modifiers pressed', () => {
     _selection.setAllSelected(true);
     _selection.setIndexSelected(0, false, true);
 
     // Mousedown on the only unselected item's invoke surface should deselect all and select that one.
-    ReactTestUtils.Simulate.mouseDown(_invoke0);
+    ReactTestUtils.Simulate.mouseDown(_surface0);
     expect(_selection.isIndexSelected(0)).toEqual(true);
     expect(_selection.getSelectedCount()).toEqual(1);
   });
@@ -134,9 +134,9 @@ describe('SelectionZone', () => {
     expect(_onItemInvokeCalled).toEqual(0);
   });
 
-  it('does not select an unselected item on mousedown of item surface element', () => {
+  it('selects an unselected item on mousedown of item surface element', () => {
     ReactTestUtils.Simulate.mouseDown(_surface0);
-    expect(_selection.isIndexSelected(0)).toEqual(false);
+    expect(_selection.isIndexSelected(0)).toEqual(true);
   });
 
   it('invokes an item on double clicking the surface element', () => {
@@ -228,6 +228,12 @@ describe('SelectionZone', () => {
 
     expect(_selection.getSelectedCount()).toEqual(0);
   });
+
+  it('does not select an item on mousedown of the surface with no modifiers', () => {
+    ReactTestUtils.Simulate.mouseDown(_invoke0);
+    expect(_selection.isIndexSelected(0)).toEqual(false);
+    expect(_onItemInvokeCalled).toEqual(0);
+  });
 });
 
 function _simulateClick(el: Element, eventData?: ReactTestUtils.SyntheticEventData) {
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
index 163534d1b8b4a..300f97b141075 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
@@ -45,6 +45,7 @@ export interface ISelectionZoneProps extends React.Props<SelectionZone> {
   layout?: ISelectionLayout;
   selectionMode?: SelectionMode;
   selectionPreservedOnEmptyClick?: boolean;
+  enterModalOnTouch?: boolean;
   isSelectedOnFocus?: boolean;
   onItemInvoked?: (item?: any, index?: number, ev?: Event) => void;
   onItemContextMenu?: (item?: any, index?: number, ev?: Event) => void | boolean;
@@ -68,6 +69,8 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   private _isMetaPressed: boolean;
   private _shouldHandleFocus: boolean;
   private _shouldHandleFocusTimeoutId: number | undefined;
+  private _isTouch: boolean;
+  private _isTouchTimeoutId: number | undefined;
 
   public componentDidMount() {
     let win = getWindow(this.refs.root);
@@ -86,6 +89,8 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
         onKeyDown={ this._onKeyDown }
         onMouseDown={ this._onMouseDown }
         onKeyDownCapture={ this._onKeyDownCapture }
+        onTouchStartCapture={ this._onTouchStartCapture }
+        onTouchEndCapture={ this._onTouchStartCapture }
         onClick={ this._onClick }
         role='presentation'
 
@@ -116,6 +121,22 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   private _onMouseDownCapture(ev: any) {
     if (document.activeElement !== ev.target && !elementContains(document.activeElement as HTMLElement, ev.target)) {
       this.ignoreNextFocus();
+      return;
+    }
+
+    if (!elementContains(ev.target, this.refs.root)) {
+      return;
+    }
+
+    let target = ev.target as HTMLElement;
+
+    while (target !== this.refs.root) {
+      if (this._hasAttribute(target, SELECTION_INVOKE_ATTRIBUTE_NAME)) {
+        this.ignoreNextFocus();
+        break;
+      }
+
+      target = getParent(target) as HTMLElement;
     }
   }
 
@@ -142,6 +163,10 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
         if (isToggleModifierPressed) {
           // set anchor only.
           selection.setIndexSelected(index, selection.isIndexSelected(index), true);
+          if (this.props.enterModalOnTouch && this._isTouch && selection.setModal) {
+            selection.setModal(true);
+            this._setIsTouch(false);
+          }
         } else {
           if (this.props.isSelectedOnFocus) {
             this._onItemSurfaceClick(ev, index);
@@ -167,9 +192,9 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
         if (this._hasAttribute(target, SELECTION_TOGGLE_ATTRIBUTE_NAME)) {
           break;
         } else if (this._hasAttribute(target, SELECTION_INVOKE_ATTRIBUTE_NAME)) {
-          this._onInvokeMouseDown(ev, this._getItemIndex(itemRoot));
           break;
-        } else if (target === itemRoot) {
+        } else if (target === itemRoot && !this._isShiftPressed && !this._isCtrlPressed) {
+          this._onInvokeMouseDown(ev, this._getItemIndex(itemRoot));
           break;
         }
       }
@@ -178,6 +203,11 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     }
   }
 
+  @autobind
+  private _onTouchStartCapture(ev: React.TouchEvent<HTMLElement>) {
+    this._setIsTouch(true);
+  }
+
   @autobind
   private _onClick(ev: React.MouseEvent<HTMLElement>) {
     this._updateModifiers(ev);
@@ -381,18 +411,26 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
 
     const selectionMode = this._getSelectionMode();
 
+    selection.setChangeEvents(false);
+
+    if (this.props.enterModalOnTouch && this._isTouch && !selection.isIndexSelected(index) && selection.setModal) {
+      selection.setModal(true);
+      this._setIsTouch(false);
+    }
+
     if (selectionMode === SelectionMode.multiple) {
       selection.toggleIndexSelected(index);
     } else if (selectionMode === SelectionMode.single) {
       let isSelected = selection.isIndexSelected(index);
-      selection.setChangeEvents(false);
       selection.setAllSelected(false);
       selection.setIndexSelected(index, !isSelected, true);
-      selection.setChangeEvents(true);
     } else {
+      selection.setChangeEvents(true);
       return;
     }
 
+    selection.setChangeEvents(true);
+
     ev.stopPropagation();
 
     // NOTE: ev.preventDefault is not called for toggle clicks, because this will kill the browser behavior
@@ -456,6 +494,10 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
       selection.setChangeEvents(false);
       selection.setAllSelected(false);
       selection.setIndexSelected(index, true, true);
+      if (this.props.enterModalOnTouch && this._isTouch && selection.setModal) {
+        selection.setModal(true);
+        this._setIsTouch(false);
+      }
       selection.setChangeEvents(true);
     }
   }
@@ -541,6 +583,21 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     }
   }
 
+  private _setIsTouch(isTouch: boolean) {
+    if (this._isTouchTimeoutId) {
+      this._async.clearTimeout(this._isTouchTimeoutId);
+      this._isTouchTimeoutId = undefined;
+    }
+
+    this._isTouch = true;
+
+    if (isTouch) {
+      this._async.setTimeout(() => {
+        this._isTouch = false;
+      }, 300);
+    }
+  }
+
   private _getSelectionMode(): SelectionMode {
     const {
       selection
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/interfaces.ts b/packages/office-ui-fabric-react/src/utilities/selection/interfaces.ts
index 3b6783c4855be..58434ad2ea950 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/interfaces.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selection/interfaces.ts
@@ -27,6 +27,7 @@ export interface ISelection {
   // Read selection methods.
 
   getSelection(): IObjectWithKey[];
+  getSelectedIndices?(): number[]; // TODO make non-optional on next breaking change
   getSelectedCount(): number;
   isRangeSelected(fromIndex: number, count: number): boolean;
 
@@ -34,12 +35,16 @@ export interface ISelection {
   isKeySelected(key: string): boolean;
   isIndexSelected(index: number): boolean;
 
+  isModal?(): boolean;
+
   // Write selection methods.
 
   setAllSelected(isAllSelected: boolean): void;
   setKeySelected(key: string, isSelected: boolean, shouldAnchor: boolean): void;
   setIndexSelected(index: number, isSelected: boolean, shouldAnchor: boolean): void;
 
+  setModal?(isModal: boolean): void; // TODO make non-optional on next breaking change
+
   // Write range selection methods.
 
   selectToKey(key: string, clearSelection?: boolean): void;

From b2fd8a79c7376328a80497ff8ddb3be97b0814cf Mon Sep 17 00:00:00 2001
From: Spencer Lynn <sllynn8907@gmail.com>
Date: Thu, 19 Oct 2017 20:53:52 -0700
Subject: [PATCH 0890/1641]  Adding hex/red/green/blue/alpha label props so
 applications can provide localized strings. (#3160)

* Adding hex/red/green/blue/alpha label props so applications can provide localized strings. Also turns off spell check for corresponding text fields.

* Rush change

* Moving default values to default props.

* Update color-picker-custom-labels_2017-10-19-05-42.json
---
 ...picker-custom-labels_2017-10-19-05-42.json | 11 +++
 .../ColorPicker/ColorPicker.Props.ts          | 30 ++++++++
 .../ColorPicker/ColorPicker.test.tsx          | 77 +++++++++++++++++--
 .../components/ColorPicker/ColorPicker.tsx    | 23 ++++--
 .../__snapshots__/ColorPicker.test.tsx.snap   |  5 ++
 5 files changed, 133 insertions(+), 13 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/color-picker-custom-labels_2017-10-19-05-42.json

diff --git a/common/changes/office-ui-fabric-react/color-picker-custom-labels_2017-10-19-05-42.json b/common/changes/office-ui-fabric-react/color-picker-custom-labels_2017-10-19-05-42.json
new file mode 100644
index 0000000000000..f84b6be2b26e7
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/color-picker-custom-labels_2017-10-19-05-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ColorPicker: Adding hex/red/green/blue/alpha label props so applications can provide localized strings. Also turns off spell check for corresponding text fields.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "sllynn8907@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts
index b278d7599cbbf..3044d38f1b7e5 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts
@@ -18,4 +18,34 @@ export interface IColorPickerProps {
    * The setting of whether to hide the alpha control slider.
    */
   alphaSliderHidden?: boolean;
+
+  /**
+   * Label for the hex textfield.
+   * @default Hex
+   */
+  hexLabel?: string;
+
+  /**
+   * Label for the red textfield
+   * @default Red
+   */
+  redLabel?: string;
+
+  /**
+   * Label for the green textfield
+   * @default Green
+   */
+  greenLabel?: string;
+
+  /**
+   * Label for the blue textfield
+   * @default Blue
+   */
+  blueLabel?: string;
+
+  /**
+   * Label for the alpha textfield
+   * @default Alpha
+   */
+  alphaLabel?: string;
 }
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.test.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.test.tsx
index 24b8ccc30889e..16a320b015aa6 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.test.tsx
@@ -17,7 +17,7 @@ describe('ColorPicker', () => {
   });
 
   it('Props are correctly parsed', () => {
-    let component = ReactTestUtils.renderIntoDocument(
+    const component = ReactTestUtils.renderIntoDocument(
       <ColorPicker color='#FFFFFF' />
     ) as ColorPicker;
 
@@ -25,7 +25,7 @@ describe('ColorPicker', () => {
   });
 
   it('Reacts to props changes', () => {
-    let component = ReactTestUtils.renderIntoDocument(
+    const component = ReactTestUtils.renderIntoDocument(
       <ColorPicker color='#FFFFFF' />
     ) as ColorPicker;
 
@@ -39,7 +39,7 @@ describe('ColorPicker', () => {
       color = str;
     };
 
-    let component = ReactTestUtils.renderIntoDocument(
+    const component = ReactTestUtils.renderIntoDocument(
       <ColorPicker
         color={ color }
         onColorChanged={ onColorChanged }
@@ -54,17 +54,78 @@ describe('ColorPicker', () => {
   });
 
   it('Hides alpha control slider', () => {
-    let component = ReactTestUtils.renderIntoDocument(
+    const component = ReactTestUtils.renderIntoDocument(
       <ColorPicker color='#FFFFFF' alphaSliderHidden={ true } />
     ) as ColorPicker;
 
-    let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
-    let alphaSlider = renderedDOM.querySelector('.is-alpha');
-    let alphaTableHeader = renderedDOM.querySelector('.ms-ColorPicker-table > thead > tr > td:nth-child(5)');
-    let alphaTableInput = renderedDOM.querySelector('.ms-ColorPicker-table > tbody> tr > td:nth-child(5)');
+    const renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
+    const alphaSlider = renderedDOM.querySelector('.is-alpha');
+    const alphaTableHeader = renderedDOM.querySelector('.ms-ColorPicker-table > thead > tr > td:nth-child(5)');
+    const alphaTableInput = renderedDOM.querySelector('.ms-ColorPicker-table > tbody> tr > td:nth-child(5)');
 
     expect(alphaSlider).toBeNull();
     expect(alphaTableHeader).toBeNull();
     expect(alphaTableInput).toBeNull();
   });
+
+  it('Renders default RGBA/Hex strings', () => {
+    const component = ReactTestUtils.renderIntoDocument(
+      <ColorPicker color='#FFFFFF' />
+    ) as ColorPicker;
+
+    const renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
+    const tableHeaders = renderedDOM.querySelectorAll('.ms-ColorPicker-table > thead > tr > td') as NodeListOf<HTMLTableDataCellElement>;
+
+    const hexTableHeader = tableHeaders[0];
+    expect(hexTableHeader.textContent).toEqual(ColorPicker.defaultProps.hexLabel);
+
+    const redTableHeader = tableHeaders[1];
+    expect(redTableHeader.textContent).toEqual(ColorPicker.defaultProps.redLabel);
+
+    const greenTableHeader = tableHeaders[2];
+    expect(greenTableHeader.textContent).toEqual(ColorPicker.defaultProps.greenLabel);
+
+    const blueTableHeader = tableHeaders[3];
+    expect(blueTableHeader.textContent).toEqual(ColorPicker.defaultProps.blueLabel);
+
+    const alphaTableHeader = tableHeaders[4];
+    expect(alphaTableHeader.textContent).toEqual(ColorPicker.defaultProps.alphaLabel);
+  });
+
+  it('Renders custom RGBA/Hex strings', () => {
+    const customHexLabel = 'Custom Hex';
+    const customRedLabel = 'Custom Red';
+    const customGreenLabel = 'Custom Green';
+    const customBlueLabel = 'Custom Blue';
+    const customAlphaLabel = 'Custom Alpha';
+
+    const component = ReactTestUtils.renderIntoDocument(
+      <ColorPicker
+        color='#FFFFFF'
+        hexLabel={ customHexLabel }
+        redLabel={ customRedLabel }
+        greenLabel={ customGreenLabel }
+        blueLabel={ customBlueLabel }
+        alphaLabel={ customAlphaLabel }
+      />
+    ) as ColorPicker;
+
+    const renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
+    const tableHeaders = renderedDOM.querySelectorAll('.ms-ColorPicker-table > thead > tr > td') as NodeListOf<HTMLTableDataCellElement>;
+
+    const hexTableHeader = tableHeaders[0];
+    expect(hexTableHeader.textContent).toEqual(customHexLabel);
+
+    const redTableHeader = tableHeaders[1];
+    expect(redTableHeader.textContent).toEqual(customRedLabel);
+
+    const greenTableHeader = tableHeaders[2];
+    expect(greenTableHeader.textContent).toEqual(customGreenLabel);
+
+    const blueTableHeader = tableHeaders[3];
+    expect(blueTableHeader.textContent).toEqual(customBlueLabel);
+
+    const alphaTableHeader = tableHeaders[4];
+    expect(alphaTableHeader.textContent).toEqual(customAlphaLabel);
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
index a9032fa7e8aa6..3ebcd3900b2b2 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
@@ -27,6 +27,14 @@ export interface IColorPickerState {
 }
 
 export class ColorPicker extends BaseComponent<IColorPickerProps, IColorPickerState> {
+  public static defaultProps = {
+    hexLabel: 'Hex',
+    redLabel: 'Red',
+    greenLabel: 'Green',
+    blueLabel: 'Blue',
+    alphaLabel: 'Alpha'
+  };
+
   private hexText: TextField;
   private rText: TextField;
   private gText: TextField;
@@ -73,12 +81,12 @@ export class ColorPicker extends BaseComponent<IColorPickerProps, IColorPickerSt
           <table className={ css('ms-ColorPicker-table', styles.table) } cellPadding='0' cellSpacing='0'>
             <thead>
               <tr className={ FontClassNames.small }>
-                <td className={ styles.tableHexCell }>Hex</td>
-                <td>Red</td>
-                <td>Green</td>
-                <td>Blue</td>
+                <td className={ styles.tableHexCell }>{ this.props.hexLabel }</td>
+                <td>{ this.props.redLabel }</td>
+                <td>{ this.props.greenLabel }</td>
+                <td>{ this.props.blueLabel }</td>
                 { !this.props.alphaSliderHidden && (
-                  <td>Alpha</td>) }
+                  <td>{ this.props.alphaLabel }</td>) }
               </tr>
             </thead>
             <tbody>
@@ -89,6 +97,7 @@ export class ColorPicker extends BaseComponent<IColorPickerProps, IColorPickerSt
                     value={ color.hex }
                     ref={ (ref) => this.hexText = ref! }
                     onBlur={ this._onHexChanged }
+                    spellCheck={ false }
                   />
                 </td>
                 <td style={ { width: '18%' } }>
@@ -97,6 +106,7 @@ export class ColorPicker extends BaseComponent<IColorPickerProps, IColorPickerSt
                     onBlur={ this._onRGBAChanged }
                     value={ String(color.r) }
                     ref={ (ref) => this.rText = ref! }
+                    spellCheck={ false }
                   />
                 </td>
                 <td style={ { width: '18%' } }>
@@ -105,6 +115,7 @@ export class ColorPicker extends BaseComponent<IColorPickerProps, IColorPickerSt
                     onBlur={ this._onRGBAChanged }
                     value={ String(color.g) }
                     ref={ (ref) => this.gText = ref! }
+                    spellCheck={ false }
                   />
                 </td>
                 <td style={ { width: '18%' } }>
@@ -113,6 +124,7 @@ export class ColorPicker extends BaseComponent<IColorPickerProps, IColorPickerSt
                     onBlur={ this._onRGBAChanged }
                     value={ String(color.b) }
                     ref={ (ref) => this.bText = ref! }
+                    spellCheck={ false }
                   />
                 </td>
                 { !this.props.alphaSliderHidden && (
@@ -122,6 +134,7 @@ export class ColorPicker extends BaseComponent<IColorPickerProps, IColorPickerSt
                       onBlur={ this._onRGBAChanged }
                       value={ String(color.a) }
                       ref={ (ref) => this.aText = ref! }
+                      spellCheck={ false }
                     />
                   </td>
                 ) }
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/__snapshots__/ColorPicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ColorPicker/__snapshots__/ColorPicker.test.tsx.snap
index 13819c8f7b9b3..0776b8f363c6d 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/__snapshots__/ColorPicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/__snapshots__/ColorPicker.test.tsx.snap
@@ -131,6 +131,7 @@ exports[`ColorPicker renders ColorPicker correctly 1`] = `
                     onChange={[Function]}
                     onFocus={[Function]}
                     onInput={[Function]}
+                    spellCheck={false}
                     type="text"
                     value="ffffff"
                   />
@@ -164,6 +165,7 @@ exports[`ColorPicker renders ColorPicker correctly 1`] = `
                     onChange={[Function]}
                     onFocus={[Function]}
                     onInput={[Function]}
+                    spellCheck={false}
                     type="text"
                     value="255"
                   />
@@ -197,6 +199,7 @@ exports[`ColorPicker renders ColorPicker correctly 1`] = `
                     onChange={[Function]}
                     onFocus={[Function]}
                     onInput={[Function]}
+                    spellCheck={false}
                     type="text"
                     value="255"
                   />
@@ -230,6 +233,7 @@ exports[`ColorPicker renders ColorPicker correctly 1`] = `
                     onChange={[Function]}
                     onFocus={[Function]}
                     onInput={[Function]}
+                    spellCheck={false}
                     type="text"
                     value="255"
                   />
@@ -263,6 +267,7 @@ exports[`ColorPicker renders ColorPicker correctly 1`] = `
                     onChange={[Function]}
                     onFocus={[Function]}
                     onInput={[Function]}
+                    spellCheck={false}
                     type="text"
                     value="100"
                   />

From 17fb73e7fe22cb2b4a8493d95da52636b933df9d Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Thu, 19 Oct 2017 21:20:40 -0700
Subject: [PATCH 0891/1641] Theming: add high level documentation for whole
 feature (#3157)

* documentation for theming

* change file

* cr feedback

* Update phkuo-themingDoc_2017-10-19-00-40.json
---
 .../phkuo-themingDoc_2017-10-19-00-40.json    | 11 +++
 .../phkuo-themingDoc_2017-10-19-00-40.json    | 11 +++
 .../phkuo-themingDoc_2017-10-19-00-40.json    | 11 +++
 .../phkuo-themingDoc_2017-10-19-00-40.json    | 11 +++
 .../phkuo-themingDoc_2017-10-19-00-40.json    | 11 +++
 .../phkuo-themingDoc_2017-10-19-00-40.json    | 11 +++
 ghdocs/Theming.md                             | 84 +++++++++++++++++++
 7 files changed, 150 insertions(+)
 create mode 100644 common/changes/@uifabric/experiments/phkuo-themingDoc_2017-10-19-00-40.json
 create mode 100644 common/changes/@uifabric/fabric-website/phkuo-themingDoc_2017-10-19-00-40.json
 create mode 100644 common/changes/@uifabric/jest-serializer-merge-styles/phkuo-themingDoc_2017-10-19-00-40.json
 create mode 100644 common/changes/@uifabric/merge-styles/phkuo-themingDoc_2017-10-19-00-40.json
 create mode 100644 common/changes/@uifabric/styling/phkuo-themingDoc_2017-10-19-00-40.json
 create mode 100644 common/changes/office-ui-fabric-react/phkuo-themingDoc_2017-10-19-00-40.json
 create mode 100644 ghdocs/Theming.md

diff --git a/common/changes/@uifabric/experiments/phkuo-themingDoc_2017-10-19-00-40.json b/common/changes/@uifabric/experiments/phkuo-themingDoc_2017-10-19-00-40.json
new file mode 100644
index 0000000000000..8b47ce48184d1
--- /dev/null
+++ b/common/changes/@uifabric/experiments/phkuo-themingDoc_2017-10-19-00-40.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/experiments",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/phkuo-themingDoc_2017-10-19-00-40.json b/common/changes/@uifabric/fabric-website/phkuo-themingDoc_2017-10-19-00-40.json
new file mode 100644
index 0000000000000..3d260bd7a567b
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/phkuo-themingDoc_2017-10-19-00-40.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/jest-serializer-merge-styles/phkuo-themingDoc_2017-10-19-00-40.json b/common/changes/@uifabric/jest-serializer-merge-styles/phkuo-themingDoc_2017-10-19-00-40.json
new file mode 100644
index 0000000000000..e235ae362c1b9
--- /dev/null
+++ b/common/changes/@uifabric/jest-serializer-merge-styles/phkuo-themingDoc_2017-10-19-00-40.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/jest-serializer-merge-styles",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/jest-serializer-merge-styles",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/phkuo-themingDoc_2017-10-19-00-40.json b/common/changes/@uifabric/merge-styles/phkuo-themingDoc_2017-10-19-00-40.json
new file mode 100644
index 0000000000000..8857a0239222a
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/phkuo-themingDoc_2017-10-19-00-40.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/merge-styles",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/phkuo-themingDoc_2017-10-19-00-40.json b/common/changes/@uifabric/styling/phkuo-themingDoc_2017-10-19-00-40.json
new file mode 100644
index 0000000000000..581caa0e9c26b
--- /dev/null
+++ b/common/changes/@uifabric/styling/phkuo-themingDoc_2017-10-19-00-40.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/phkuo-themingDoc_2017-10-19-00-40.json b/common/changes/office-ui-fabric-react/phkuo-themingDoc_2017-10-19-00-40.json
new file mode 100644
index 0000000000000..5a6288b2262d9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/phkuo-themingDoc_2017-10-19-00-40.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Theming: add documentation describing theming at a high level",
+      "type": "none"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "phkuo@microsoft.com"
+}
diff --git a/ghdocs/Theming.md b/ghdocs/Theming.md
new file mode 100644
index 0000000000000..1c2b28edfd90f
--- /dev/null
+++ b/ghdocs/Theming.md
@@ -0,0 +1,84 @@
+# Theming
+
+This document describes theming at a high level. For low level technical details, follow the links.
+
+
+## What is theming?
+
+Theming is a mechanism by which a consistent look and feel can be applied to all the components on a page. For now, this means sharing a color scheme across the entire page.
+
+
+## What's in a theme?
+A theme is defined by a simple collection of variables (which we call slots) with string values.
+For example, `themePrimary` by default is `"#0078d7"`, but it could easily be `"rgba(0, 120, 215)"`.
+
+
+## What are theme slots?
+
+There are two kinds of theme slots: Fabric palette slots and semantic slots.
+
+Fabric palette slots are documented in [IPalette.ts](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/styling/src/interfaces/IPalette.ts).
+These are descriptive slots, it gives you an idea of what the color is, but you decide how to use it.
+Most slots with color names (besides `white` and `black`), such as `yellow` and `yellowLight`, will remain a shade of yellow in all themes, useful in cases where color has meaning (such as for errors and warnings).
+Customizing Fabric palette slots allows broad-stroke changes to the overall color scheme.
+
+Semantic slots are documented in [ISemanticColors.ts](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/styling/src/interfaces/ISemanticColors.ts).
+These, on the other hand, are prescriptive slots, each slot having an intended use.
+This allows more targeted customizations.
+For example, you could change the light gray color of a disabled checkbox without affecting the light gray used by list item hover/selection state.
+We highly recommend using semantic slots wherever possible.
+
+
+## How do I make a theme?
+
+Check out the [Theme Generator](https://developer.microsoft.com/en-us/fabric#/styles/themegenerator) tool to quickly create a custom theme.
+Currently only Fabric palette slots are generated. Semantic slots can be manually added to the resulting output.
+
+You can define just the subset of slots you want to customize.
+For instance, you could overwrite all the `neutral*`s with shades of red.
+Anything using one of those Fabric palette slots will become reddish.
+
+Semantic slots usually "inherit" from a Fabric palette slot.
+For example, the `bodyText` semantic slot, if uncustomized, will always pick up the color from the Fabric palette slot `neutralPrimary`.
+You can see these default assignments in [theme.ts](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/styling/src/styles/theme.ts) in `_makeSemanticColorsFromPalette()`.
+
+
+## What happens when you theme?
+
+At a high level, there is a theme definition, which defines the desired color scheme. The theming module, which does the actual work, parses this theme definition, then updates any registered CSS to match the given color scheme.
+
+Inside the registered CSS are theme tokens that the theming module keeps track of. These theme tokens are basically variables, whose values the theming module changes based on the provided theme definition.
+
+
+## What does the theming?
+
+We have two theming modules that can apply a theme.
+The first operates on raw CSS, the second manages styles defined in code that are not put onto the page until needed.
+
+### `load-themed-styles` package
+
+The old way, which most of our components still use, uses the [load-themed-styles package](https://github.com/Microsoft/web-build-tools/tree/292582a72afbcff6409c89bfb258ca6fa65f27b3/libraries/load-themed-styles).
+This is a backwards-compatible method of theming that operates on raw CSS, such as CSS written by hand or compiled from SASS or LESS.
+The raw CSS uses theming tokens, which are strings, as variables, in place of actual colors.
+The module will find these tokens and replace them with the value of the corresponding slot as the theme changes.
+All styles must also be registered through this module instead of being put directly on the page.
+See the documentation for more details on implementation.
+
+### `styling` package
+The new and recommended way is the [styling package](https://github.com/OfficeDev/office-ui-fabric-react/tree/master/packages/styling) in this repo.
+Styles are defined in a JSON format and managed in code, avoiding issues like specificity and providing a typesafe surface for customization.
+The theme itself gets passed to the component. As the theme changes, the state of the component changes as well, and it will modify its own CSS to match.
+
+This is the recommended path forward for new components, but it does have quite a learning curve.
+[todo: link to new documentation about conversion process]
+
+The `loadTheme()` call in the `styling` package will automatically invoke `loadTheme()` from `load-themed-styles` as well.
+Thus, new environments should implement theming with the `styling` package regardless of whether they intend to do styles-in-code or styles with a CSS preprocessor.
+Additionally, the `styling` package contains logic for defining default and fallback values for certain theme slots.
+
+
+## Who applies the theme?
+
+The host app is responsible for getting the theme and then applying it to the page by calling `loadTheme()`.
+This can be called multiple times to dynamically change the theme.
+

From a360af7a689c30f406ff7cb2346fafb3a972ab1a Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 19 Oct 2017 23:07:33 -0700
Subject: [PATCH 0892/1641] registerIcons svg support alternative (#3159)

* Icon alternative

* Adding change files.

* Moving example.

* tslint fixes.

* Adding example to create special svg icons that can be colorized.

* lint
---
 .../icon-alternative_2017-10-19-03-03.json    |  11 ++
 .../icon-alternative_2017-10-19-03-03.json    |  11 ++
 .../src/components/Icon/IconPage.tsx          |   5 +
 .../Icon/examples/Icon.Svg.Example.tsx        | 102 ++++++++++++++++++
 .../components/Icon/examples/IconExample.scss |   5 +-
 packages/styling/package.json                 |   1 +
 packages/styling/src/utilities/icons.ts       |   9 +-
 packages/styling/tsconfig.json                |   3 +-
 8 files changed, 140 insertions(+), 7 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/icon-alternative_2017-10-19-03-03.json
 create mode 100644 common/changes/office-ui-fabric-react/icon-alternative_2017-10-19-03-03.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Icon/examples/Icon.Svg.Example.tsx

diff --git a/common/changes/@uifabric/styling/icon-alternative_2017-10-19-03-03.json b/common/changes/@uifabric/styling/icon-alternative_2017-10-19-03-03.json
new file mode 100644
index 0000000000000..e808f3982a1cc
--- /dev/null
+++ b/common/changes/@uifabric/styling/icon-alternative_2017-10-19-03-03.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Adjusting the `registerIcons` code to allow for icons to map to JSX.Elements or icon code strings.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/icon-alternative_2017-10-19-03-03.json b/common/changes/office-ui-fabric-react/icon-alternative_2017-10-19-03-03.json
new file mode 100644
index 0000000000000..4cc4c553d938a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/icon-alternative_2017-10-19-03-03.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Updated example to render some custom icons.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx b/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx
index 1a3df633b5959..aeac142401e5c 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx
@@ -6,12 +6,14 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { IconBasicExample } from './examples/Icon.Basic.Example';
+import { IconSvgExample } from './examples/Icon.Svg.Example';
 import { IconColorExample } from './examples/Icon.Color.Example';
 import { IconImageSheetExample } from './examples/Icon.ImageSheet.Example';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { IconStatus } from './Icon.checklist';
 
 const IconBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Icon/examples/Icon.Basic.Example.tsx') as string;
+const IconSvgExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Icon/examples/Icon.Svg.Example.tsx') as string;
 const IconColorExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Icon/examples/Icon.Color.Example.tsx') as string;
 const IconImageSheetExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Icon/examples/Icon.ImageSheet.Example.tsx') as string;
 
@@ -29,6 +31,9 @@ export class IconPage extends React.Component<IComponentDemoPageProps, {}> {
             <ExampleCard title='Icon with custom color' code={ IconColorExampleCode }>
               <IconColorExample />
             </ExampleCard>
+            <ExampleCard title='Icon using custom svg' code={ IconSvgExampleCode }>
+              <IconSvgExample />
+            </ExampleCard>
             <ExampleCard title='Icon using image sheet' code={ IconImageSheetExampleCode }>
               <IconImageSheetExample />
             </ExampleCard>
diff --git a/packages/office-ui-fabric-react/src/components/Icon/examples/Icon.Svg.Example.tsx b/packages/office-ui-fabric-react/src/components/Icon/examples/Icon.Svg.Example.tsx
new file mode 100644
index 0000000000000..4ed9cd24e195b
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Icon/examples/Icon.Svg.Example.tsx
@@ -0,0 +1,102 @@
+/* tslint:disable:jsx-wrap-multiline */
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+import { Icon } from 'office-ui-fabric-react/lib/Icon';
+import './IconExample.scss';
+import { mergeStyles, registerIcons } from 'office-ui-fabric-react/lib/Styling';
+
+/**
+ * Use the registerIcons api from the styling package to register custom svg icons so that they
+ * can be used by the Icon component (or in anything that renders Icons, like Buttons.)
+ */
+registerIcons({
+  icons: {
+    'onedrive':
+    <svg xmlns='http://www.w3.org/2000/svg' viewBox='0,0,2048,2048'>
+      <g fill='#1B559B'>
+        <path
+          d='M 1860 1196 q 53 10 94 37 q 18 12 35 29 q 16 16 30 40 q 13 23 21 53 q 8 30 8 68 q 0 37 -10 75 q -11 38 -34 69 q -23 31 -58 51 q -36 20 -86 20 h -1079 q -78 0 -131 -24 q -54 -25 -87 -65 q -34 -40 -49 -91 q -15 -52 -15 -107 q 0 -46 12 -81 q 11 -35 31 -61 q 19 -27 43 -45 q 24 -19 50 -31 q 60 -29 136 -35 q 0 -1 4 -26 q 3 -25 16 -61 q 12 -37 36 -80 q 24 -43 64 -79 q 39 -37 98 -61 q 59 -25 141 -25 q 57 0 103 15 q 45 15 81 38 q 35 23 62 52 q 26 28 44 55 q 18 -10 42 -18 q 20 -7 48 -12 q 27 -6 60 -6 q 40 0 91 15 q 50 14 94 48 q 44 33 75 88 q 30 55 30 136 m -1463 174 q 0 53 10 99 q 10 46 29 86 h -170 q -52 0 -100 -23 q -48 -23 -85 -61 q -37 -38 -59 -87 q -22 -50 -22 -104 q 0 -49 11 -87 q 10 -38 27 -66 q 17 -29 39 -49 q 21 -21 44 -35 q 53 -33 121 -41 q -1 -9 -1 -18 q -1 -9 -1 -17 q 0 -72 27 -134 q 27 -63 73 -110 q 45 -47 106 -74 q 60 -27 127 -27 q 36 0 66 7 q 29 6 51 14 q 25 10 45 21 q 27 -48 65 -89 q 37 -41 84 -71 q 46 -30 101 -47 q 55 -17 115 -17 q 39 0 80 8 q 41 7 83 24 q 72 28 121 71 q 49 42 81 90 q 32 47 49 94 q 16 46 22 82 q -23 2 -43 5 q -21 3 -40 8 q -66 -69 -148 -104 q -82 -36 -177 -36 q -76 0 -136 17 q -60 17 -106 45 q -47 28 -81 64 q -34 36 -58 75 q -24 38 -39 76 q -15 37 -23 67 q -51 12 -102 38 q -52 26 -93 68 q -42 42 -67 101 q -26 59 -26 137'
+        />
+      </g>
+    </svg>,
+
+    'yammer':
+    <svg xmlns='http://www.w3.org/2000/svg' viewBox='0,0,2048,2048'>
+      <g className='thing'>
+        <path
+          d='M 1887 888 q 33 8 54 34 q 21 26 21 61 q 0 35 -22 62 q -23 26 -57 31 q -57 0 -121 -2 q -64 -3 -128 -7 q -64 -5 -122 -11 q -59 -7 -104 -16 q -45 -9 -72 -20 q -27 -12 -27 -26 q 0 -13 37 -26 q 37 -13 94 -24 q 57 -12 126 -22 q 68 -11 131 -18 q 63 -8 112 -12 q 48 -4 66 -4 m -163 549 q 17 14 26 34 q 9 20 9 41 q 0 21 -8 39 q -8 17 -21 30 q -14 13 -31 20 q -17 7 -36 7 q -10 0 -18 -2 q -8 -2 -19 -8 q -15 -8 -54 -34 q -39 -26 -88 -61 q -50 -35 -104 -76 q -54 -41 -98 -78 q -45 -37 -74 -67 q -29 -30 -29 -44 q 0 -8 9 -10 q 8 -3 19 -3 q 22 0 57 9 q 34 9 77 25 q 42 15 91 36 q 48 20 98 44 q 50 23 100 49 q 49 25 94 49 m 0 -901 q -67 37 -144 75 q -77 38 -149 69 q -73 30 -132 50 q -60 19 -93 19 q -11 0 -19 -2 q -8 -3 -8 -10 q 0 -14 29 -44 q 29 -30 74 -67 q 44 -38 98 -78 q 54 -41 104 -76 q 49 -36 88 -62 q 39 -26 54 -34 q 11 -6 20 -8 q 8 -2 18 -2 q 18 0 36 8 q 17 7 30 20 q 13 12 21 30 q 8 17 8 38 q 0 21 -9 41 q -9 19 -26 33 m -1191 823 l -430 -1051 q -6 -16 -6 -33 q 0 -20 8 -38 q 7 -19 21 -33 q 13 -15 33 -24 q 19 -9 42 -9 q 30 0 56 16 q 26 16 40 44 l 343 866 h 4 l 326 -860 q 11 -29 37 -46 q 25 -18 56 -18 q 22 0 40 9 q 18 8 31 22 q 13 13 21 31 q 7 17 7 36 q 0 14 -5 31 l -462 1154 q -30 74 -62 136 q -32 62 -76 107 q -44 44 -105 69 q -62 24 -151 24 q -28 0 -57 -2 q -30 -3 -54 -12 q -24 -10 -39 -28 q -16 -19 -16 -52 q 0 -21 8 -38 q 8 -17 21 -29 q 13 -12 30 -18 q 17 -6 35 -6 q 1 0 9 1 q 7 0 17 1 q 10 0 19 1 q 9 0 14 0 q 48 0 84 -15 q 36 -15 65 -46 q 28 -31 51 -78 q 22 -48 45 -112'
+        />
+      </g>
+    </svg>,
+    'borderblinds':
+    <svg viewBox='0 0 40 40' style={ { marginLeft: 'calc(50% - 0.5em)' } }>
+      <g transform='scale(0.03125 0.03125)'>
+        <path className='borderblinds-part1' d='M0 192l320-128v768l-320 128z' />
+        <path className='borderblinds-part2' d='M384 32l320 192v736l-320-160z' />
+        <path className='borderblinds-part3' d='M768 224l256-192v768l-256 192z' />
+      </g>
+    </svg>
+  }
+});
+
+const BorderBlindsIcon = (props: { col1?: string, col2?: string, col3?: string }) => {
+  const {
+    col1 = 'red',
+    col2 = 'green',
+    col3 = 'blue'
+  } = props;
+
+  return (
+    <Icon
+      iconName='borderblinds'
+      className={
+        mergeStyles(
+          'ms-IconExample',
+          {
+            width: 50,
+            height: 50,
+            selectors: {
+              '.borderblinds-part1': {
+                fill: col1
+              },
+              '.borderblinds-part2': {
+                fill: col2
+              },
+              '.borderblinds-part3': {
+                fill: col3
+              }
+            }
+          }
+        )
+      }
+    />
+  );
+};
+
+export class IconSvgExample extends React.Component<any, any> {
+  public render() {
+    return (
+      <div>
+        <Icon iconName='onedrive' className='ms-IconExample' />
+        <Icon
+          iconName='yammer'
+          className={
+            mergeStyles(
+              'ms-IconExample',
+              {
+                fill: 'red',
+                selectors: {
+                  '.thing': {
+                    fill: 'green'
+                  }
+                }
+              }
+            )
+          }
+        />
+        <BorderBlindsIcon col3='pink' />
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/Icon/examples/IconExample.scss b/packages/office-ui-fabric-react/src/components/Icon/examples/IconExample.scss
index 979d37e0f632e..c95046522a895 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/examples/IconExample.scss
+++ b/packages/office-ui-fabric-react/src/components/Icon/examples/IconExample.scss
@@ -2,8 +2,9 @@
 
   .ms-IconExample {
     font-size: 50px;
-    margin-left: 25px;
-    margin-right: 25px;
+    height: 50px;
+    width: 50px;
+    margin: 0 25px;
   }
 
   .ms-IconColorExample-deepSkyBlue {
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 656c6a51c364b..c93cb9e5683f8 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -14,6 +14,7 @@
     "@types/enzyme": "2.8.8",
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
+    "@types/react": "15.0.38",
     "es6-map": "^0.1.5",
     "es6-weak-map": "^2.0.2",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
diff --git a/packages/styling/src/utilities/icons.ts b/packages/styling/src/utilities/icons.ts
index b66c2427a6fa0..473d9bb852a60 100644
--- a/packages/styling/src/utilities/icons.ts
+++ b/packages/styling/src/utilities/icons.ts
@@ -12,10 +12,11 @@ import {
 } from '@uifabric/merge-styles/lib/index';
 
 export interface IIconSubset {
-  fontFace: IFontFace;
+  fontFace?: IFontFace;
   icons: {
-    [key: string]: string;
+    [key: string]: string | JSX.Element;
   };
+
   style?: IRawStyle;
 }
 
@@ -25,7 +26,7 @@ export interface IIconSubsetRecord extends IIconSubset {
 }
 
 export interface IIconRecord {
-  code: string;
+  code: string | undefined;
   subset: IIconSubsetRecord;
 }
 
@@ -103,7 +104,7 @@ export function getIcon(name?: string): IIconRecord | undefined {
     if (icon) {
       let { subset } = icon;
 
-      if (!subset.isRegistered) {
+      if (subset.fontFace && !subset.isRegistered) {
         // Register font face for given icons.
         fontFace(subset.fontFace);
 
diff --git a/packages/styling/tsconfig.json b/packages/styling/tsconfig.json
index 819b22a0a41ce..02fac4792a7a8 100644
--- a/packages/styling/tsconfig.json
+++ b/packages/styling/tsconfig.json
@@ -19,7 +19,8 @@
       "dom"
     ],
     "types": [
-      "webpack-env"
+      "webpack-env",
+      "react"
     ],
     "paths": {
       "@uifabric/styling": [

From 3e9c785220cfdcf7f4f6927e438f8bdf8be468f4 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 19 Oct 2017 23:18:45 -0700
Subject: [PATCH 0893/1641] Adding some top level exports (#3169)

* Adding top level exports.

* Adding change file.
---
 .../add-check_2017-10-20-05-59.json                   | 11 +++++++++++
 packages/office-ui-fabric-react/src/Icons.ts          |  1 +
 packages/office-ui-fabric-react/src/index.ts          |  6 +++---
 3 files changed, 15 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/add-check_2017-10-20-05-59.json
 create mode 100644 packages/office-ui-fabric-react/src/Icons.ts

diff --git a/common/changes/office-ui-fabric-react/add-check_2017-10-20-05-59.json b/common/changes/office-ui-fabric-react/add-check_2017-10-20-05-59.json
new file mode 100644
index 0000000000000..921b66667aea4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/add-check_2017-10-20-05-59.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Adding an Icons export in lib folder, as well as adding Check to the root index exports.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/Icons.ts b/packages/office-ui-fabric-react/src/Icons.ts
new file mode 100644
index 0000000000000..5204ce52d5254
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/Icons.ts
@@ -0,0 +1 @@
+export * from '@uifabric/icons/lib/index';
diff --git a/packages/office-ui-fabric-react/src/index.ts b/packages/office-ui-fabric-react/src/index.ts
index c82b7c2b29534..9ced214da911e 100644
--- a/packages/office-ui-fabric-react/src/index.ts
+++ b/packages/office-ui-fabric-react/src/index.ts
@@ -7,6 +7,7 @@ export * from './Breadcrumb';
 export * from './Button';
 export * from './Calendar';
 export * from './Callout';
+export * from './Check';
 export * from './Checkbox';
 export * from './ChoiceGroup';
 export * from './ColorPicker';
@@ -60,7 +61,6 @@ export * from './Utilities';
 // Using the default import, include all icon definitions. Products that care
 // about bundle size should not be using the main entry, until tree shaking
 // is perfected. (Use the top level imports instead.)
-import { initializeIcons } from '@uifabric/icons/lib/index';
+import { initializeIcons } from './Icons';
 
-// TODO: remove the @beta tag once they're publised to the CDN.
-initializeIcons('//unpkg.com/office-ui-fabric-react@beta/dist/');
+initializeIcons();

From 4dd5fce9077422822ae86ae78848ecbe728e82e6 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Thu, 19 Oct 2017 23:28:35 -0700
Subject: [PATCH 0894/1641] PersonaCoin: Display initials only if no imageUrl
 or error loading image (#3137)

* Display initials only if no imageUrl or error loading image

* Add change file

* Update snapshots
---
 ...rsonacoin-fix-flicker_2017-10-17-18-02.json | 11 +++++++++++
 .../__snapshots__/Facepile.test.tsx.snap       | 18 ------------------
 .../src/components/Persona/PersonaCoin.tsx     |  6 +++++-
 3 files changed, 16 insertions(+), 19 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/personacoin-fix-flicker_2017-10-17-18-02.json

diff --git a/common/changes/office-ui-fabric-react/personacoin-fix-flicker_2017-10-17-18-02.json b/common/changes/office-ui-fabric-react/personacoin-fix-flicker_2017-10-17-18-02.json
new file mode 100644
index 0000000000000..89b04377d2223
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/personacoin-fix-flicker_2017-10-17-18-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "PersonaCoin - display initials only if no imageUrl is provided or if error loading image",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "a.erich@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
index f61f4dc6df462..94ddf45cfc11c 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
@@ -34,15 +34,6 @@ exports[`Facepile Render personas and buttons renders Facepile correctly 1`] = `
             className="ms-Persona-imageArea"
             style={undefined}
           >
-            <div
-              aria-hidden="true"
-              className="ms-Persona-initials ms-Persona-initials--darkRed undefined"
-              style={undefined}
-            >
-              <span>
-                AL
-              </span>
-            </div>
             <div
               className="ms-Image ms-Persona-image"
               style={
@@ -81,15 +72,6 @@ exports[`Facepile Render personas and buttons renders Facepile correctly 1`] = `
             className="ms-Persona-imageArea"
             style={undefined}
           >
-            <div
-              aria-hidden="true"
-              className="ms-Persona-initials ms-Persona-initials--lightPink undefined"
-              style={undefined}
-            >
-              <span>
-                AR
-              </span>
-            </div>
             <div
               className="ms-Image ms-Persona-image"
               style={
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
index 1984ad4648a5e..2391c518176ad 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
@@ -55,6 +55,7 @@ const COLOR_SWATCHES_NUM_ENTRIES = COLOR_SWATCHES_LOOKUP.length;
 
 export interface IPersonaState {
   isImageLoaded?: boolean;
+  isImageError?: boolean;
 }
 
 export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
@@ -70,6 +71,7 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
 
     this.state = {
       isImageLoaded: false,
+      isImageError: false
     };
   }
 
@@ -105,6 +107,7 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
           >
             {
               !this.state.isImageLoaded &&
+              (!imageUrl || this.state.isImageError) &&
               (
                 <div
                   className={ css(
@@ -176,7 +179,8 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
   @autobind
   private _onPhotoLoadingStateChange(loadState: ImageLoadState) {
     this.setState({
-      isImageLoaded: loadState === ImageLoadState.loaded
+      isImageLoaded: loadState === ImageLoadState.loaded,
+      isImageError: loadState === ImageLoadState.error
     });
   }
 }
\ No newline at end of file

From 6ccc0457cfb4a5af1105523d3979cf8bc5dcc481 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 19 Oct 2017 23:29:34 -0700
Subject: [PATCH 0895/1641] SpinButton: Prevent LastPass autofill icon from
 showing up (#3149)

* Set lastpass ignore on combo boxes and spin buttons

* Rush change

* Fix snapshots
---
 .../lp-ignore_2017-10-18-20-31.json                   | 11 +++++++++++
 .../ComboBox/__snapshots__/ComboBox.test.tsx.snap     |  1 +
 .../src/components/SpinButton/SpinButton.tsx          |  1 +
 .../SpinButton/__snapshots__/SpinButton.test.tsx.snap |  1 +
 .../src/components/pickers/AutoFill/BaseAutoFill.tsx  |  1 +
 .../pickers/__snapshots__/BasePicker.test.tsx.snap    |  2 ++
 6 files changed, 17 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/lp-ignore_2017-10-18-20-31.json

diff --git a/common/changes/office-ui-fabric-react/lp-ignore_2017-10-18-20-31.json b/common/changes/office-ui-fabric-react/lp-ignore_2017-10-18-20-31.json
new file mode 100644
index 0000000000000..741a8011637fb
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/lp-ignore_2017-10-18-20-31.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SpinButton: Disable last pass autofill",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
index bba161287975b..5876219a98d81 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
@@ -84,6 +84,7 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
             width: 100%;
           }
       data-is-interactable={true}
+      data-lpignore={true}
       id="ComboBox0-input"
       onBlur={[Function]}
       onChange={[Function]}
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index 0278f8be8cc52..1685860d7e06e 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -188,6 +188,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
             readOnly={ disabled }
             disabled={ disabled }
             aria-disabled={ disabled }
+            data-lpignore={ true }
           />
           <span className={ classNames.arrowBox }>
             <IconButton
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
index 49102ed3800b6..c648858f9689f 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
@@ -113,6 +113,7 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
             border-color: Highlight;
             color: HighlightText;
           }
+      data-lpignore={true}
       disabled={false}
       id="input1"
       onBlur={[Function]}
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
index a7b238f0434d1..b27ea3b7356b9 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
@@ -126,6 +126,7 @@ export class BaseAutoFill extends BaseComponent<IBaseAutoFillProps, IBaseAutoFil
         onChange={ this._onChange }
         onKeyDown={ this._onKeyDown }
         onClick={ this.props.onClick ? this.props.onClick : this._onClick }
+        data-lpignore={ true }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
index 58c34d01731c6..2cf3f9d99d088 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
@@ -50,6 +50,7 @@ exports[`Pickers BasePicker renders BasePicker correctly 1`] = `
           autoCapitalize="off"
           autoComplete="off"
           className="ms-BasePicker-input"
+          data-lpignore={true}
           disabled={undefined}
           onChange={[Function]}
           onClick={[Function]}
@@ -114,6 +115,7 @@ exports[`Pickers TagPicker renders TagPicker correctly 1`] = `
           autoCapitalize="off"
           autoComplete="off"
           className="ms-BasePicker-input"
+          data-lpignore={true}
           disabled={undefined}
           onChange={[Function]}
           onClick={[Function]}

From e79a386c39690762310b1048ac343a066e660e04 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Thu, 19 Oct 2017 23:32:43 -0700
Subject: [PATCH 0896/1641] Docs: Add ISelectableDroppableText to Dropdown docs
 page (#3121)

* Add ISelectableDropdown to Dropdown docs page

* Add change file

* Update dropdown-docs_2017-10-17-18-29.json
---
 .../dropdown-docs_2017-10-17-18-29.json               | 11 +++++++++++
 .../src/components/Dropdown/DropdownPage.tsx          |  3 ++-
 2 files changed, 13 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/dropdown-docs_2017-10-17-18-29.json

diff --git a/common/changes/office-ui-fabric-react/dropdown-docs_2017-10-17-18-29.json b/common/changes/office-ui-fabric-react/dropdown-docs_2017-10-17-18-29.json
new file mode 100644
index 0000000000000..67d85f3f3bba6
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/dropdown-docs_2017-10-17-18-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add ISelectableDroppableText to Dropdown docs.",
+      "type": "none"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "a.erich@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
index 5bf894388958f..1372240cdce20 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
@@ -35,7 +35,8 @@ export class DropdownPage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts'),
+              require<string>('!raw-loader!office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.Props.ts')
             ] }
           />
         }

From 9d62fdd1491ba3088186a94150ec30e301fe4da5 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 20 Oct 2017 11:17:14 -0700
Subject: [PATCH 0897/1641] Updating master to remove warning in build.

---
 .../components/Icon/examples/Icon.Svg.Example.tsx    | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/Icon/examples/Icon.Svg.Example.tsx b/packages/office-ui-fabric-react/src/components/Icon/examples/Icon.Svg.Example.tsx
index 4ed9cd24e195b..8303d934b47c6 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/examples/Icon.Svg.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/examples/Icon.Svg.Example.tsx
@@ -12,7 +12,7 @@ import { mergeStyles, registerIcons } from 'office-ui-fabric-react/lib/Styling';
  */
 registerIcons({
   icons: {
-    'onedrive':
+    'onedrive-svg':
     <svg xmlns='http://www.w3.org/2000/svg' viewBox='0,0,2048,2048'>
       <g fill='#1B559B'>
         <path
@@ -21,7 +21,7 @@ registerIcons({
       </g>
     </svg>,
 
-    'yammer':
+    'yammer-svg':
     <svg xmlns='http://www.w3.org/2000/svg' viewBox='0,0,2048,2048'>
       <g className='thing'>
         <path
@@ -29,7 +29,7 @@ registerIcons({
         />
       </g>
     </svg>,
-    'borderblinds':
+    'borderblinds-svg':
     <svg viewBox='0 0 40 40' style={ { marginLeft: 'calc(50% - 0.5em)' } }>
       <g transform='scale(0.03125 0.03125)'>
         <path className='borderblinds-part1' d='M0 192l320-128v768l-320 128z' />
@@ -49,7 +49,7 @@ const BorderBlindsIcon = (props: { col1?: string, col2?: string, col3?: string }
 
   return (
     <Icon
-      iconName='borderblinds'
+      iconName='borderblinds-svg'
       className={
         mergeStyles(
           'ms-IconExample',
@@ -78,9 +78,9 @@ export class IconSvgExample extends React.Component<any, any> {
   public render() {
     return (
       <div>
-        <Icon iconName='onedrive' className='ms-IconExample' />
+        <Icon iconName='onedrive-svg' className='ms-IconExample' />
         <Icon
-          iconName='yammer'
+          iconName='yammer-svg'
           className={
             mergeStyles(
               'ms-IconExample',

From b92a62e1a5de2741779bd39aaf8a37b41a380cd6 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Fri, 20 Oct 2017 11:17:33 -0700
Subject: [PATCH 0898/1641] Jest: Update snapshots (#3174)

* Update snapshots

* Fix Toggle snapshot
---
 .../Persona/__snapshots__/Persona.test.tsx.snap          | 9 ---------
 1 file changed, 9 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap
index 86af4ef8f37ef..e867e7c4ef7d9 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap
@@ -14,15 +14,6 @@ exports[`Persona renders Persona correctly with image 1`] = `
       className="ms-Persona-imageArea"
       style={undefined}
     >
-      <div
-        aria-hidden="true"
-        className="ms-Persona-initials ms-Persona-initials--red undefined"
-        style={undefined}
-      >
-        <span>
-          KL
-        </span>
-      </div>
       <div
         className="ms-Image ms-Persona-image"
         style={

From ee9cd4b760b1b0de70890f035a36058cc67e70d7 Mon Sep 17 00:00:00 2001
From: Fabio Pintos <fabio.pintos@outlook.com>
Date: Fri, 20 Oct 2017 11:29:08 -0700
Subject: [PATCH 0899/1641] date picker: 3161: do not parse formatted dates
 (#3168)

* DatePicker: don't parse text input if the selected date has the same formatted string that we're about to parse, to avoid losing a selected date to an ambiguous string.

* Add change file.

* Fix tslint errors
---
 ...arse_formatted_dates_2017-10-19-21-44.json |  11 ++
 .../src/components/DatePicker/DatePicker.tsx  |  27 ++--
 .../components/DatePicker/DatePickerPage.tsx  |   6 +
 .../examples/DatePicker.Format.Example.tsx    | 152 ++++++++++++++++++
 4 files changed, 186 insertions(+), 10 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fpintos-datePicker_3161_do_not_parse_formatted_dates_2017-10-19-21-44.json
 create mode 100644 packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Format.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/fpintos-datePicker_3161_do_not_parse_formatted_dates_2017-10-19-21-44.json b/common/changes/office-ui-fabric-react/fpintos-datePicker_3161_do_not_parse_formatted_dates_2017-10-19-21-44.json
new file mode 100644
index 0000000000000..f2505518fa69b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fpintos-datePicker_3161_do_not_parse_formatted_dates_2017-10-19-21-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DatePicker will not try to parse a string if the formatted string of the selected date is the same as the string to be parsed.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "fpintos@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index f78f2877a1e5b..27ffeff865986 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -391,7 +391,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
 
   @autobind
   private _validateTextInput() {
-    let { isRequired, allowTextInput, strings, parseDateFromString, onSelectDate } = this.props;
+    let { isRequired, allowTextInput, strings, parseDateFromString, onSelectDate, formatDate } = this.props;
     const inputValue = this.state.formattedDate;
 
     // Do validation only if DatePicker's popup is dismissed
@@ -412,16 +412,23 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     if (allowTextInput) {
       let date = null;
       if (inputValue) {
-        date = parseDateFromString!(inputValue);
-        if (!date) {
-          this.setState({
-            errorMessage: strings!.invalidInputErrorMessage || '*'
-          });
+        // Don't parse if the selected date has the same formatted string as what we're about to parse.
+        // The formatted string might be ambiguous (ex: "1/2/3" or "New Year Eve") and the parser might
+        // not be able to come up with the exact same date.
+        if (this.state.selectedDate && formatDate && formatDate(this.state.selectedDate) === inputValue) {
+          date = this.state.selectedDate;
         } else {
-          this.setState({
-            selectedDate: date,
-            errorMessage: ''
-          });
+          date = parseDateFromString!(inputValue);
+          if (!date) {
+            this.setState({
+              errorMessage: strings!.invalidInputErrorMessage || '*'
+            });
+          } else {
+            this.setState({
+              selectedDate: date,
+              errorMessage: ''
+            });
+          }
         }
       } else {
         // No input date string shouldn't be an error if field is not required
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
index 99d9dc1bb94a8..1f0a36b122460 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
@@ -9,6 +9,7 @@ import { DatePickerBasicExample } from './examples/DatePicker.Basic.Example';
 import { DatePickerWeekNumbersExample } from './examples/DatePicker.WeekNumbers.Example';
 import { DatePickerRequiredExample } from './examples/DatePicker.Required.Example';
 import { DatePickerInputExample } from './examples/DatePicker.Input.Example';
+import { DatePickerFormatExample } from './examples/DatePicker.Format.Example';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { DatePickerStatus } from './DatePicker.checklist';
 
@@ -16,6 +17,8 @@ const DatePickerBasicExampleCode = require('!raw-loader!office-ui-fabric-react/s
 const DatePickerWeekNumbersExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.WeekNumbers.Example.tsx') as string;
 const DatePickerRequiredExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Required.Example.tsx') as string;
 const DatePickerInputExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx') as string;
+const DatePickerFormatExampleCode = require
+('!raw-loader!office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Format.Example.tsx') as string;
 
 export class DatePickerPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
@@ -37,6 +40,9 @@ export class DatePickerPage extends React.Component<IComponentDemoPageProps, {}>
             <ExampleCard title='DatePicker allows input date string' code={ DatePickerInputExampleCode }>
               <DatePickerInputExample />
             </ExampleCard>
+            <ExampleCard title='DatePicker allows dates to be formatted' code={ DatePickerFormatExampleCode }>
+              <DatePickerFormatExample />
+            </ExampleCard>
           </div>
         }
         propertiesTables={
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Format.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Format.Example.tsx
new file mode 100644
index 0000000000000..ead84a63a0a4d
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Format.Example.tsx
@@ -0,0 +1,152 @@
+import * as React from 'react';
+import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
+import {
+  DatePicker,
+  DayOfWeek,
+  IDatePickerStrings
+} from 'office-ui-fabric-react/lib/DatePicker';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+
+const DayPickerStrings: IDatePickerStrings = {
+  months: [
+    'January',
+    'February',
+    'March',
+    'April',
+    'May',
+    'June',
+    'July',
+    'August',
+    'September',
+    'October',
+    'November',
+    'December'
+  ],
+
+  shortMonths: [
+    'Jan',
+    'Feb',
+    'Mar',
+    'Apr',
+    'May',
+    'Jun',
+    'Jul',
+    'Aug',
+    'Sep',
+    'Oct',
+    'Nov',
+    'Dec'
+  ],
+
+  days: [
+    'Sunday',
+    'Monday',
+    'Tuesday',
+    'Wednesday',
+    'Thursday',
+    'Friday',
+    'Saturday'
+  ],
+
+  shortDays: ['S', 'M', 'T', 'W', 'T', 'F', 'S'],
+
+  goToToday: 'Go to today',
+  prevMonthAriaLabel: 'Go to previous month',
+  nextMonthAriaLabel: 'Go to next month',
+  prevYearAriaLabel: 'Go to previous year',
+  nextYearAriaLabel: 'Go to next year',
+
+  isRequiredErrorMessage: 'Start date is required.',
+
+  invalidInputErrorMessage: 'Invalid date format.'
+};
+
+export interface IDatePickerFormatExampleState {
+  firstDayOfWeek?: DayOfWeek;
+  value?: Date | null;
+}
+
+export class DatePickerFormatExample extends React.Component<
+  any,
+  IDatePickerFormatExampleState
+> {
+  public constructor() {
+    super();
+
+    this.state = {
+      firstDayOfWeek: DayOfWeek.Sunday,
+      value: null
+    };
+  }
+
+  public render() {
+    let { firstDayOfWeek, value } = this.state;
+    const desc =
+      'This field is required. One of the support input formats is year dash month dash day.';
+    return (
+      <div>
+        <p>
+          Applications can customize how dates are formatted and parsed.
+          Formatted dates can be ambiguous, so the control will avoid parsing
+          the formatted strings of dates selected using the UI when text input
+          is allowed. In this example, we are formatting and parsing dates as
+          dd/MM/yy.
+        </p>
+        <DatePicker
+          label='Start date'
+          isRequired={false}
+          allowTextInput={true}
+          ariaLabel={desc}
+          firstDayOfWeek={firstDayOfWeek}
+          strings={DayPickerStrings}
+          value={value!}
+          onSelectDate={this._onSelectDate}
+          formatDate={this._onFormatDate}
+          parseDateFromString={this._onParseDateFromString}
+        />
+        <DefaultButton onClick={this._onClick} text='Clear' />
+        <div>{(this.state.value || '').toString()}</div>
+      </div>
+    );
+  }
+
+  @autobind
+  private _onSelectDate(date: Date | null | undefined): void {
+    this.setState({ value: date });
+  }
+
+  @autobind
+  private _onClick(): void {
+    this.setState({ value: null });
+  }
+
+  @autobind
+  private _onFormatDate(date: Date): string {
+    return (
+      date.getDate() +
+      '/' +
+      (date.getMonth() + 1) +
+      '/' +
+      date.getFullYear() % 100
+    );
+  }
+
+  @autobind
+  private _onParseDateFromString(value: string): Date {
+    let date = this.state.value || new Date();
+    let values = (value || '').trim().split('/');
+    let day =
+      values.length > 0
+        ? Math.max(1, Math.min(31, parseInt(values[0], 10)))
+        : date.getDate();
+    let month =
+      values.length > 1
+        ? Math.max(1, Math.min(12, parseInt(values[1], 10))) - 1
+        : date.getMonth();
+    let year = values.length > 2 ? parseInt(values[2], 10) : date.getFullYear();
+    if (year < 100) {
+      year += date.getFullYear() - date.getFullYear() % 100;
+    }
+    return new Date(year, month, day);
+  }
+}

From 1907658409ff4086d6936200842c8a452982c383 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 20 Oct 2017 18:42:09 +0000
Subject: [PATCH 0900/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../phkuo-themingDoc_2017-10-19-00-40.json    | 11 ---
 .../tile-selection_2017-10-18-22-10.json      | 11 ---
 .../phkuo-themingDoc_2017-10-19-00-40.json    | 11 ---
 .../icons/cela-fixes_2017-10-16-20-55.json    | 11 ---
 .../phkuo-themingDoc_2017-10-19-00-40.json    | 11 ---
 ...ge-styles-classnames_2017-10-18-17-58.json | 11 ---
 .../phkuo-themingDoc_2017-10-19-00-40.json    | 11 ---
 .../icon-alternative_2017-10-19-03-03.json    | 11 ---
 .../phkuo-themingDoc_2017-10-19-00-40.json    | 11 ---
 .../add-check_2017-10-20-05-59.json           | 11 ---
 ...rwatt-scrollable-ref_2017-10-18-22-20.json | 11 ---
 .../brwatt-sticky-fix_2017-10-18-23-12.json   | 11 ---
 ...picker-custom-labels_2017-10-19-05-42.json | 11 ---
 ...combo-box-classnames_2017-10-18-23-28.json | 11 ---
 .../dropdown-docs_2017-10-17-18-29.json       | 11 ---
 .../icon-alternative_2017-10-19-03-03.json    | 11 ---
 .../lp-ignore_2017-10-18-20-31.json           | 11 ---
 ...zano-splitMenuLaunch_2017-10-19-15-20.json | 11 ---
 ...sonacoin-fix-flicker_2017-10-17-18-02.json | 11 ---
 .../phkuo-themingDoc_2017-10-19-00-40.json    | 11 ---
 .../tile-selection_2017-10-18-22-10.json      | 11 ---
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/CHANGELOG.json           | 19 +++++
 packages/experiments/CHANGELOG.md             |  9 ++-
 packages/experiments/package.json             |  4 +-
 packages/icons/package.json                   |  2 +-
 .../jest-serializer-merge-styles/package.json |  2 +-
 packages/merge-styles/CHANGELOG.json          | 14 ++++
 packages/merge-styles/CHANGELOG.md            |  9 ++-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 81 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 21 ++++-
 packages/office-ui-fabric-react/package.json  |  6 +-
 packages/styling/CHANGELOG.json               | 19 +++++
 packages/styling/CHANGELOG.md                 |  9 ++-
 packages/styling/package.json                 |  4 +-
 41 files changed, 193 insertions(+), 251 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/phkuo-themingDoc_2017-10-19-00-40.json
 delete mode 100644 common/changes/@uifabric/experiments/tile-selection_2017-10-18-22-10.json
 delete mode 100644 common/changes/@uifabric/fabric-website/phkuo-themingDoc_2017-10-19-00-40.json
 delete mode 100644 common/changes/@uifabric/icons/cela-fixes_2017-10-16-20-55.json
 delete mode 100644 common/changes/@uifabric/jest-serializer-merge-styles/phkuo-themingDoc_2017-10-19-00-40.json
 delete mode 100644 common/changes/@uifabric/merge-styles/merge-styles-classnames_2017-10-18-17-58.json
 delete mode 100644 common/changes/@uifabric/merge-styles/phkuo-themingDoc_2017-10-19-00-40.json
 delete mode 100644 common/changes/@uifabric/styling/icon-alternative_2017-10-19-03-03.json
 delete mode 100644 common/changes/@uifabric/styling/phkuo-themingDoc_2017-10-19-00-40.json
 delete mode 100644 common/changes/office-ui-fabric-react/add-check_2017-10-20-05-59.json
 delete mode 100644 common/changes/office-ui-fabric-react/brwatt-scrollable-ref_2017-10-18-22-20.json
 delete mode 100644 common/changes/office-ui-fabric-react/brwatt-sticky-fix_2017-10-18-23-12.json
 delete mode 100644 common/changes/office-ui-fabric-react/color-picker-custom-labels_2017-10-19-05-42.json
 delete mode 100644 common/changes/office-ui-fabric-react/combo-box-classnames_2017-10-18-23-28.json
 delete mode 100644 common/changes/office-ui-fabric-react/dropdown-docs_2017-10-17-18-29.json
 delete mode 100644 common/changes/office-ui-fabric-react/icon-alternative_2017-10-19-03-03.json
 delete mode 100644 common/changes/office-ui-fabric-react/lp-ignore_2017-10-18-20-31.json
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-splitMenuLaunch_2017-10-19-15-20.json
 delete mode 100644 common/changes/office-ui-fabric-react/personacoin-fix-flicker_2017-10-17-18-02.json
 delete mode 100644 common/changes/office-ui-fabric-react/phkuo-themingDoc_2017-10-19-00-40.json
 delete mode 100644 common/changes/office-ui-fabric-react/tile-selection_2017-10-18-22-10.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index c5e50720884a3..b58eb18a749af 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.10.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.11.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 59d823db28deb..459524ccbed02 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.10.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.11.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 45ac68cf7c944..8ce717ffa6ee0 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.10.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.11.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index b324cff63dcdd..514e3dd66b946 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.10.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.11.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index a7857bf9447f5..39840b1582043 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.10.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.11.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/experiments/phkuo-themingDoc_2017-10-19-00-40.json b/common/changes/@uifabric/experiments/phkuo-themingDoc_2017-10-19-00-40.json
deleted file mode 100644
index 8b47ce48184d1..0000000000000
--- a/common/changes/@uifabric/experiments/phkuo-themingDoc_2017-10-19-00-40.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/experiments",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/tile-selection_2017-10-18-22-10.json b/common/changes/@uifabric/experiments/tile-selection_2017-10-18-22-10.json
deleted file mode 100644
index e71dc005b1cdd..0000000000000
--- a/common/changes/@uifabric/experiments/tile-selection_2017-10-18-22-10.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Add modal selection behavior to TilesList",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/phkuo-themingDoc_2017-10-19-00-40.json b/common/changes/@uifabric/fabric-website/phkuo-themingDoc_2017-10-19-00-40.json
deleted file mode 100644
index 3d260bd7a567b..0000000000000
--- a/common/changes/@uifabric/fabric-website/phkuo-themingDoc_2017-10-19-00-40.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/cela-fixes_2017-10-16-20-55.json b/common/changes/@uifabric/icons/cela-fixes_2017-10-16-20-55.json
deleted file mode 100644
index 1fda240f91612..0000000000000
--- a/common/changes/@uifabric/icons/cela-fixes_2017-10-16-20-55.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "Updated icon sets to remove certain logos.",
-      "packageName": "@uifabric/icons",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/icons",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/jest-serializer-merge-styles/phkuo-themingDoc_2017-10-19-00-40.json b/common/changes/@uifabric/jest-serializer-merge-styles/phkuo-themingDoc_2017-10-19-00-40.json
deleted file mode 100644
index e235ae362c1b9..0000000000000
--- a/common/changes/@uifabric/jest-serializer-merge-styles/phkuo-themingDoc_2017-10-19-00-40.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/jest-serializer-merge-styles",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/jest-serializer-merge-styles",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/merge-styles-classnames_2017-10-18-17-58.json b/common/changes/@uifabric/merge-styles/merge-styles-classnames_2017-10-18-17-58.json
deleted file mode 100644
index 91d41e9bf80c4..0000000000000
--- a/common/changes/@uifabric/merge-styles/merge-styles-classnames_2017-10-18-17-58.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "Calling `mergeStyles` with strings containing space delimited class names was not expanding merge-styles generated class names in the final merge. Fixed so that it does.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/phkuo-themingDoc_2017-10-19-00-40.json b/common/changes/@uifabric/merge-styles/phkuo-themingDoc_2017-10-19-00-40.json
deleted file mode 100644
index 8857a0239222a..0000000000000
--- a/common/changes/@uifabric/merge-styles/phkuo-themingDoc_2017-10-19-00-40.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/merge-styles",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/icon-alternative_2017-10-19-03-03.json b/common/changes/@uifabric/styling/icon-alternative_2017-10-19-03-03.json
deleted file mode 100644
index e808f3982a1cc..0000000000000
--- a/common/changes/@uifabric/styling/icon-alternative_2017-10-19-03-03.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Adjusting the `registerIcons` code to allow for icons to map to JSX.Elements or icon code strings.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/phkuo-themingDoc_2017-10-19-00-40.json b/common/changes/@uifabric/styling/phkuo-themingDoc_2017-10-19-00-40.json
deleted file mode 100644
index 581caa0e9c26b..0000000000000
--- a/common/changes/@uifabric/styling/phkuo-themingDoc_2017-10-19-00-40.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/add-check_2017-10-20-05-59.json b/common/changes/office-ui-fabric-react/add-check_2017-10-20-05-59.json
deleted file mode 100644
index 921b66667aea4..0000000000000
--- a/common/changes/office-ui-fabric-react/add-check_2017-10-20-05-59.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Adding an Icons export in lib folder, as well as adding Check to the root index exports.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/brwatt-scrollable-ref_2017-10-18-22-20.json b/common/changes/office-ui-fabric-react/brwatt-scrollable-ref_2017-10-18-22-20.json
deleted file mode 100644
index 14c511058231f..0000000000000
--- a/common/changes/office-ui-fabric-react/brwatt-scrollable-ref_2017-10-18-22-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add a way to force a layout update for ScrollablePane",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "brwatt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/brwatt-sticky-fix_2017-10-18-23-12.json b/common/changes/office-ui-fabric-react/brwatt-sticky-fix_2017-10-18-23-12.json
deleted file mode 100644
index 1e43b43840553..0000000000000
--- a/common/changes/office-ui-fabric-react/brwatt-sticky-fix_2017-10-18-23-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix minor state update bug with Sticky",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "brwatt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/color-picker-custom-labels_2017-10-19-05-42.json b/common/changes/office-ui-fabric-react/color-picker-custom-labels_2017-10-19-05-42.json
deleted file mode 100644
index f84b6be2b26e7..0000000000000
--- a/common/changes/office-ui-fabric-react/color-picker-custom-labels_2017-10-19-05-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ColorPicker: Adding hex/red/green/blue/alpha label props so applications can provide localized strings. Also turns off spell check for corresponding text fields.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "sllynn8907@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/combo-box-classnames_2017-10-18-23-28.json b/common/changes/office-ui-fabric-react/combo-box-classnames_2017-10-18-23-28.json
deleted file mode 100644
index f9864b2b3d936..0000000000000
--- a/common/changes/office-ui-fabric-react/combo-box-classnames_2017-10-18-23-28.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Fix custom styling on menu options",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/dropdown-docs_2017-10-17-18-29.json b/common/changes/office-ui-fabric-react/dropdown-docs_2017-10-17-18-29.json
deleted file mode 100644
index 67d85f3f3bba6..0000000000000
--- a/common/changes/office-ui-fabric-react/dropdown-docs_2017-10-17-18-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add ISelectableDroppableText to Dropdown docs.",
-      "type": "none"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "a.erich@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/icon-alternative_2017-10-19-03-03.json b/common/changes/office-ui-fabric-react/icon-alternative_2017-10-19-03-03.json
deleted file mode 100644
index 4cc4c553d938a..0000000000000
--- a/common/changes/office-ui-fabric-react/icon-alternative_2017-10-19-03-03.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Updated example to render some custom icons.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/lp-ignore_2017-10-18-20-31.json b/common/changes/office-ui-fabric-react/lp-ignore_2017-10-18-20-31.json
deleted file mode 100644
index 741a8011637fb..0000000000000
--- a/common/changes/office-ui-fabric-react/lp-ignore_2017-10-18-20-31.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SpinButton: Disable last pass autofill",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/malozano-splitMenuLaunch_2017-10-19-15-20.json b/common/changes/office-ui-fabric-react/malozano-splitMenuLaunch_2017-10-19-15-20.json
deleted file mode 100644
index 8913130061d15..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-splitMenuLaunch_2017-10-19-15-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Menu Split Button: Launch split button menu with right arrow key",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/personacoin-fix-flicker_2017-10-17-18-02.json b/common/changes/office-ui-fabric-react/personacoin-fix-flicker_2017-10-17-18-02.json
deleted file mode 100644
index 89b04377d2223..0000000000000
--- a/common/changes/office-ui-fabric-react/personacoin-fix-flicker_2017-10-17-18-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "PersonaCoin - display initials only if no imageUrl is provided or if error loading image",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "a.erich@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/phkuo-themingDoc_2017-10-19-00-40.json b/common/changes/office-ui-fabric-react/phkuo-themingDoc_2017-10-19-00-40.json
deleted file mode 100644
index 5a6288b2262d9..0000000000000
--- a/common/changes/office-ui-fabric-react/phkuo-themingDoc_2017-10-19-00-40.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Theming: add documentation describing theming at a high level",
-      "type": "none"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "phkuo@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/tile-selection_2017-10-18-22-10.json b/common/changes/office-ui-fabric-react/tile-selection_2017-10-18-22-10.json
deleted file mode 100644
index 2cb79ee400442..0000000000000
--- a/common/changes/office-ui-fabric-react/tile-selection_2017-10-18-22-10.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add opt-in modal selection behavior on touch",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index eb33b22461522..772c9dc1d1918 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -38,7 +38,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.3.0 <6.0.0",
+    "@uifabric/styling": ">=5.4.0 <6.0.0",
     "@uifabric/utilities": ">=5.3.0 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 1da9e898c6d9f..57fd4585471b9 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.3.0",
+      "tag": "@uifabric/experiments_v5.3.0",
+      "date": "Fri, 20 Oct 2017 18:42:08 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "8505921f6822a7323852c28aaa6c65cb15f36c82",
+            "comment": "Add modal selection behavior to TilesList"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.10.0 <6.0.0` to `>=5.11.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.2.0",
       "tag": "@uifabric/experiments_v5.2.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 4c16e6fbe9e33..e44ab040c95bc 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Wed, 18 Oct 2017 10:21:25 GMT and should not be manually modified.
+This log was last generated on Fri, 20 Oct 2017 18:42:08 GMT and should not be manually modified.
+
+## 5.3.0
+Fri, 20 Oct 2017 18:42:08 GMT
+
+### Minor changes
+
+- Add modal selection behavior to TilesList
 
 ## 5.2.0
 Wed, 18 Oct 2017 10:21:25 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 730911781bd78..edf5f2a5611dc 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.2.0",
+  "version": "5.3.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.10.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.11.0 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/icons/package.json b/packages/icons/package.json
index cc5d073ef98d7..4018d9145b643 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -23,7 +23,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.3.0 <6.0.0",
+    "@uifabric/styling": ">=5.4.0 <6.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/jest-serializer-merge-styles/package.json b/packages/jest-serializer-merge-styles/package.json
index c6e9c48dbabdd..91f32c6f23dc1 100644
--- a/packages/jest-serializer-merge-styles/package.json
+++ b/packages/jest-serializer-merge-styles/package.json
@@ -24,6 +24,6 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/merge-styles": ">=5.4.1 <6.0.0"
+    "@uifabric/merge-styles": ">=5.4.2 <6.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index fc83f9bf3761d..402c0ce82a380 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.4.2",
+      "tag": "@uifabric/merge-styles_v5.4.2",
+      "date": "Fri, 20 Oct 2017 18:42:08 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "74e329e01e32d23b5669c469fe7e4c4a2b4eee89",
+            "comment": "Calling `mergeStyles` with strings containing space delimited class names was not expanding merge-styles generated class names in the final merge. Fixed so that it does."
+          }
+        ]
+      }
+    },
     {
       "version": "5.4.1",
       "tag": "@uifabric/merge-styles_v5.4.1",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index b4b2d844f984a..b26d68cbbf5fa 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Tue, 17 Oct 2017 17:17:41 GMT and should not be manually modified.
+This log was last generated on Fri, 20 Oct 2017 18:42:08 GMT and should not be manually modified.
+
+## 5.4.2
+Fri, 20 Oct 2017 18:42:08 GMT
+
+### Patches
+
+- Calling `mergeStyles` with strings containing space delimited class names was not expanding merge-styles generated class names in the final merge. Fixed so that it does.
 
 ## 5.4.1
 Tue, 17 Oct 2017 17:17:41 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index ba94c921a08c7..180f725b94df4 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.4.1",
+  "version": "5.4.2",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 8b4f5fa2eab4b..51becd6d7c8e2 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,87 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.11.0",
+      "tag": "office-ui-fabric-react_v5.11.0",
+      "date": "Fri, 20 Oct 2017 18:42:08 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "3e9c785220cfdcf7f4f6927e438f8bdf8be468f4",
+            "comment": "Adding an Icons export in lib folder, as well as adding Check to the root index exports."
+          },
+          {
+            "author": "Bryan Watts <brwatt@microsoft.com>",
+            "commit": "dcee15b2a8e47acc3b7bd5fd4f3125139c660a62",
+            "comment": "Add a way to force a layout update for ScrollablePane"
+          },
+          {
+            "author": "Spencer Lynn <sllynn8907@gmail.com>",
+            "commit": "b2fd8a79c7376328a80497ff8ddb3be97b0814cf",
+            "comment": "ColorPicker: Adding hex/red/green/blue/alpha label props so applications can provide localized strings. Also turns off spell check for corresponding text fields."
+          },
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "8505921f6822a7323852c28aaa6c65cb15f36c82",
+            "comment": "Add opt-in modal selection behavior on touch"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Bryan Watts <brwatt@microsoft.com>",
+            "commit": "8e2ad86f359aa2029d14b2becd9d961e96cfe11e",
+            "comment": "Fix minor state update bug with Sticky"
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "75bcda3b83570e315c0fde75f6a8972e04b9eb44",
+            "comment": "ComboBox: Fix custom styling on menu options"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "a360af7a689c30f406ff7cb2346fafb3a972ab1a",
+            "comment": "Updated example to render some custom icons."
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "6ccc0457cfb4a5af1105523d3979cf8bc5dcc481",
+            "comment": "SpinButton: Disable last pass autofill"
+          },
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "1bec4b511555bb5d30c63e15bad62f50d04a9a7d",
+            "comment": "Menu Split Button: Launch split button menu with right arrow key"
+          },
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "4dd5fce9077422822ae86ae78848ecbe728e82e6",
+            "comment": "PersonaCoin - display initials only if no imageUrl is provided or if error loading image"
+          }
+        ],
+        "none": [
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "e79a386c39690762310b1048ac343a066e660e04",
+            "comment": "Add ISelectableDroppableText to Dropdown docs."
+          },
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "17fb73e7fe22cb2b4a8493d95da52636b933df9d",
+            "comment": "Theming: add documentation describing theming at a high level"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.4.1 <6.0.0` to `>=5.4.2 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.3.0 <6.0.0` to `>=5.4.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.10.0",
       "tag": "office-ui-fabric-react_v5.10.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 686430ff16b1d..0085432366852 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,25 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 18 Oct 2017 10:21:25 GMT and should not be manually modified.
+This log was last generated on Fri, 20 Oct 2017 18:42:08 GMT and should not be manually modified.
+
+## 5.11.0
+Fri, 20 Oct 2017 18:42:08 GMT
+
+### Minor changes
+
+- Adding an Icons export in lib folder, as well as adding Check to the root index exports.
+- Add a way to force a layout update for ScrollablePane
+- ColorPicker: Adding hex/red/green/blue/alpha label props so applications can provide localized strings. Also turns off spell check for corresponding text fields.
+- Add opt-in modal selection behavior on touch
+
+### Patches
+
+- Fix minor state update bug with Sticky
+- ComboBox: Fix custom styling on menu options
+- Updated example to render some custom icons.
+- SpinButton: Disable last pass autofill
+- Menu Split Button: Launch split button menu with right arrow key
+- PersonaCoin - display initials only if no imageUrl is provided or if error loading image
 
 ## 5.10.0
 Wed, 18 Oct 2017 10:21:25 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 406dff3ae4811..63e0b87966489 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.10.0",
+  "version": "5.11.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -46,8 +46,8 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.4.1 <6.0.0",
-    "@uifabric/styling": ">=5.3.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.4.2 <6.0.0",
+    "@uifabric/styling": ">=5.4.0 <6.0.0",
     "@uifabric/utilities": ">=5.3.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index f2fd7d1ef5fe0..01fbb5bc4b3ae 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.4.0",
+      "tag": "@uifabric/styling_v5.4.0",
+      "date": "Fri, 20 Oct 2017 18:42:08 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "a360af7a689c30f406ff7cb2346fafb3a972ab1a",
+            "comment": "Adjusting the `registerIcons` code to allow for icons to map to JSX.Elements or icon code strings."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.4.1 <6.0.0` to `>=5.4.2 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.3.0",
       "tag": "@uifabric/styling_v5.3.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 49acd0ed4de53..3796d0a6ed2c3 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Tue, 10 Oct 2017 10:24:47 GMT and should not be manually modified.
+This log was last generated on Fri, 20 Oct 2017 18:42:08 GMT and should not be manually modified.
+
+## 5.4.0
+Fri, 20 Oct 2017 18:42:08 GMT
+
+### Minor changes
+
+- Adjusting the `registerIcons` code to allow for icons to map to JSX.Elements or icon code strings.
 
 ## 5.3.0
 Tue, 10 Oct 2017 10:24:47 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index c93cb9e5683f8..bcb0a03cdfb04 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.3.0",
+  "version": "5.4.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -22,7 +22,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/utilities": ">=5.3.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.4.1 <6.0.0",
+    "@uifabric/merge-styles": ">=5.4.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file

From 362fedce0eb72ff8b130e2a0400f7099ffdf2c03 Mon Sep 17 00:00:00 2001
From: Michael Loughry <miclo@microsoft.com>
Date: Fri, 20 Oct 2017 13:21:31 -0700
Subject: [PATCH 0901/1641] Callout/ContextualMenu: Fix (and deprecate) broken
 `targetPoint` prop (#3177)

* Fix broken targetPoint API and deprecate it

* Fix test failures caused by deprecation warning

* Add change file
---
 ...en-target-point-prop_2017-10-20-20-02.json | 11 ++++++++
 .../src/components/Callout/Callout.Props.ts   |  4 ++-
 .../src/components/Callout/Callout.tsx        |  5 ++++
 .../src/components/Callout/CalloutContent.tsx | 26 +++++++++++++------
 .../ContextualMenu/ContextualMenu.Props.ts    |  4 ++-
 .../ContextualMenu/ContextualMenu.tsx         | 21 ++++++++++-----
 .../src/utilities/positioning.ts              | 12 ++++++---
 7 files changed, 63 insertions(+), 20 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-broken-target-point-prop_2017-10-20-20-02.json

diff --git a/common/changes/office-ui-fabric-react/fix-broken-target-point-prop_2017-10-20-20-02.json b/common/changes/office-ui-fabric-react/fix-broken-target-point-prop_2017-10-20-20-02.json
new file mode 100644
index 0000000000000..041e0e2383b9a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-broken-target-point-prop_2017-10-20-20-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu/Callout: Fix (and deprecate) broken 'targetPoint' API",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts b/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
index be4e6c78d9ed7..4234e34676e14 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
@@ -23,7 +23,7 @@ export interface ICalloutProps extends React.Props<Callout | CalloutContent> {
    * It can be either an HTMLElement a querySelector string of a valid HTMLElement
    * or a MouseEvent. If MouseEvent is given then the origin point of the event will be used.
    */
-  target?: HTMLElement | string | MouseEvent | null;
+  target?: HTMLElement | string | MouseEvent | IPoint | null;
 
   /**
    * How the element should be positioned
@@ -75,11 +75,13 @@ export interface ICalloutProps extends React.Props<Callout | CalloutContent> {
   /**
    * If true use a point rather than rectangle to position the Callout.
    * For example it can be used to position based on a click.
+   * @deprecated Use 'target' instead
    */
   useTargetPoint?: boolean;
 
   /**
    * Point used to position the Callout
+   * @deprecated Use 'target' instead
    */
   targetPoint?: IPoint;
 
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.tsx b/packages/office-ui-fabric-react/src/components/Callout/Callout.tsx
index a9f0daa0dad08..f11582568dc99 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.tsx
@@ -11,6 +11,11 @@ export class Callout extends BaseComponent<ICalloutProps, ICalloutState> {
 
   constructor(props: ICalloutProps) {
     super(props);
+
+    this._warnDeprecations({
+      'targetPoint': 'target',
+      'useTargetPoint': 'target',
+    });
   }
 
   public render() {
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index bf51d4f428986..c4a6545f5c815 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -5,6 +5,7 @@ import { ICalloutProps } from './Callout.Props';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import {
   BaseComponent,
+  IPoint,
   IRectangle,
   assign,
   autobind,
@@ -50,7 +51,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
   private _bounds: IRectangle;
   private _maxHeight: number | undefined;
   private _positionAttempts: number;
-  private _target: HTMLElement | MouseEvent | null;
+  private _target: HTMLElement | MouseEvent | IPoint | null;
   private _setHeightOffsetTimer: number;
 
   constructor(props: ICalloutProps) {
@@ -74,14 +75,14 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
   }
 
   public componentWillMount() {
-    let target = this.props.target;
-    this._setTargetWindowAndElement(target!);
+    this._setTargetWindowAndElement(this._getTarget());
   }
 
   public componentWillUpdate(newProps: ICalloutProps) {
     // If the target element changed, find the new one. If we are tracking target with class name, always find element because we do not know if fabric has rendered a new element and disposed the old element.
-    if (newProps.target !== this.props.target || typeof (newProps.target) === 'string' || newProps.target instanceof String) {
-      let newTarget = newProps.target;
+    let newTarget = this._getTarget(newProps);
+    let oldTarget = this._getTarget();
+    if (newTarget !== oldTarget || typeof (newTarget) === 'string' || newTarget instanceof String) {
       this._maxHeight = undefined;
       this._setTargetWindowAndElement(newTarget!);
     }
@@ -118,6 +119,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       finalHeight,
       backgroundColor,
       calloutMaxHeight } = this.props;
+    target = this._getTarget();
     let { positions } = this.state;
     let beakStyleWidth = beakWidth;
 
@@ -342,19 +344,22 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
     return true;
   }
 
-  private _setTargetWindowAndElement(target: HTMLElement | string | MouseEvent): void {
+  private _setTargetWindowAndElement(target: HTMLElement | string | MouseEvent | IPoint | null): void {
     if (target) {
       if (typeof target === 'string') {
         let currentDoc: Document = getDocument()!;
         this._target = currentDoc ? currentDoc.querySelector(target) as HTMLElement : null;
         this._targetWindow = getWindow()!;
       } else if ((target as MouseEvent).stopPropagation) {
-        this._target = target;
         this._targetWindow = getWindow((target as MouseEvent).toElement as HTMLElement)!;
+        this._target = target;
+      } else if ((target as IPoint).x !== undefined && (target as IPoint).y !== undefined) {
+        this._targetWindow = getWindow()!;
+        this._target = target;
       } else {
         let targetElement: HTMLElement = target as HTMLElement;
-        this._target = target;
         this._targetWindow = getWindow(targetElement)!;
+        this._target = target;
       }
     } else {
       this._targetWindow = getWindow()!;
@@ -381,4 +386,9 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       });
     }
   }
+
+  private _getTarget(props: ICalloutProps = this.props): HTMLElement | string | MouseEvent | IPoint | null {
+    let { useTargetPoint, targetPoint, target } = props;
+    return useTargetPoint ? targetPoint! : target!;
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
index f2e27c78b7ccf..12e19f03a7774 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
@@ -38,7 +38,7 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
    * It can be either an HTMLElement a querySelector string of a valid HTMLElement
    * or a MouseEvent. If MouseEvent is given then the origin point of the event will be used.
    */
-  target?: HTMLElement | string | MouseEvent | null;
+  target?: HTMLElement | string | MouseEvent | IPoint | null;
 
   /**
    * How the element should be positioned
@@ -78,11 +78,13 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
   /**
    * If true use a point rather than rectangle to position the ContextualMenu.
    * For example it can be used to position based on a click.
+   * @deprecated Use 'target' instead
    */
   useTargetPoint?: boolean;
 
   /**
    * Point used to position the ContextualMenu
+   * @deprecated Use 'target' instead
    */
   targetPoint?: IPoint;
 
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index d8be240064e9d..096d3ff9e0ea0 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -14,6 +14,7 @@ import {
 } from './ContextualMenu.classNames';
 import {
   BaseComponent,
+  IPoint,
   anchorProperties,
   buttonProperties,
   getNativeProps,
@@ -112,7 +113,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   private _isFocusingPreviousElement: boolean;
   private _enterTimerId: number;
   private _targetWindow: Window;
-  private _target: HTMLElement | MouseEvent | null;
+  private _target: HTMLElement | MouseEvent | IPoint | null;
   private _classNames: IContextualMenuClassNames;
 
   constructor(props: IContextualMenuProps) {
@@ -123,6 +124,11 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       subMenuId: getId('ContextualMenu')
     };
 
+    this._warnDeprecations({
+      'targetPoint': 'target',
+      'useTargetPoint': 'target',
+    });
+
     this._isFocusingPreviousElement = false;
     this._enterTimerId = 0;
   }
@@ -248,9 +254,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       return (
         <Callout
           {...calloutProps}
-          target={ target }
-          targetPoint={ targetPoint }
-          useTargetPoint={ useTargetPoint }
+          target={ useTargetPoint ? targetPoint : target }
           isBeakVisible={ isBeakVisible }
           beakWidth={ beakWidth }
           directionalHint={ directionalHint }
@@ -763,19 +767,22 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     }
   }
 
-  private _setTargetWindowAndElement(target: HTMLElement | string | MouseEvent): void {
+  private _setTargetWindowAndElement(target: HTMLElement | string | MouseEvent | IPoint): void {
     if (target) {
       if (typeof target === 'string') {
         let currentDoc: Document = getDocument()!;
         this._target = currentDoc ? currentDoc.querySelector(target) as HTMLElement : null;
         this._targetWindow = getWindow()!;
       } else if ((target as MouseEvent).stopPropagation) {
-        this._target = target;
         this._targetWindow = getWindow((target as MouseEvent).toElement as HTMLElement)!;
+        this._target = target;
+      } else if ((target as IPoint).x !== undefined && (target as IPoint).y !== undefined) {
+        this._targetWindow = getWindow()!;
+        this._target = target;
       } else {
         let targetElement: HTMLElement = target as HTMLElement;
-        this._target = target;
         this._targetWindow = getWindow(targetElement)!;
+        this._target = target;
       }
     } else {
       this._targetWindow = getWindow()!;
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning.ts b/packages/office-ui-fabric-react/src/utilities/positioning.ts
index 86fd644cc4331..d8d725190edaf 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning.ts
@@ -32,7 +32,7 @@ export class Rectangle extends FullRectangle {
 }
 
 export interface IPositionProps {
-  target?: HTMLElement | MouseEvent;
+  target?: HTMLElement | MouseEvent | IPoint;
   /** how the element should be positioned */
   directionalHint?: DirectionalHint;
 
@@ -620,12 +620,15 @@ export module positioningFunctions {
     return new Rectangle(rect.left, rect.right, rect.top, rect.bottom);
   }
 
-  export function _getTargetRect(bounds: Rectangle, target: HTMLElement | MouseEvent | undefined) {
+  export function _getTargetRect(bounds: Rectangle, target: HTMLElement | MouseEvent | IPoint | undefined) {
     let targetRectangle: Rectangle;
     if (target) {
       if ((target as MouseEvent).preventDefault) {
         let ev: MouseEvent = target as MouseEvent;
         targetRectangle = new Rectangle(ev.clientX, ev.clientX, ev.clientY, ev.clientY);
+      } else if ((target as IPoint).x !== undefined) {
+        let point: IPoint = target as IPoint;
+        targetRectangle = new Rectangle(point.x, point.x, point.y, point.y);
       } else {
         targetRectangle = _getRectangleFromHTMLElement(target as HTMLElement);
       }
@@ -725,9 +728,10 @@ export function getRelativePositions(props: IPositionProps,
  * of the target given.
  * If no bounds are provided then the window is treated as the bounds.
  */
-export function getMaxHeight(target: HTMLElement | MouseEvent, targetEdge: DirectionalHint, gapSpace: number = 0, bounds?: IRectangle) {
+export function getMaxHeight(target: HTMLElement | MouseEvent | IPoint, targetEdge: DirectionalHint, gapSpace: number = 0, bounds?: IRectangle) {
   let mouseTarget: MouseEvent = target as MouseEvent;
   let elementTarget: HTMLElement = target as HTMLElement;
+  let pointTarget: IPoint = target as IPoint;
   let targetRect: Rectangle;
   let boundingRectangle = bounds ?
     positioningFunctions._getRectangleFromIRect(bounds) :
@@ -735,6 +739,8 @@ export function getMaxHeight(target: HTMLElement | MouseEvent, targetEdge: Direc
 
   if (mouseTarget.stopPropagation) {
     targetRect = new Rectangle(mouseTarget.clientX, mouseTarget.clientX, mouseTarget.clientY, mouseTarget.clientY);
+  } else if (pointTarget.x !== undefined && pointTarget.y !== undefined) {
+    targetRect = new Rectangle(pointTarget.x, pointTarget.x, pointTarget.y, pointTarget.y);
   } else {
     targetRect = positioningFunctions._getRectangleFromHTMLElement(elementTarget);
   }

From d4f447f93277ce940464daa1cadf0bab8509a25e Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Sun, 22 Oct 2017 08:57:06 -0700
Subject: [PATCH 0902/1641] Introduce Divider component (#3115)

* Plumbing the code for the initial example

* More setup

* Center align the text.

* Define props for the divider

* More divider stuff

* Rush change

* Update component page

* Remove the divider from fabric-website

* Rename things

* Update the example

* Add custom example

* Remove empty space

* Add comment

* Support themes. Use a function for custom styles.

* Switch to stateless functional component

* remove unused imports

* Move classNames to props

* Add space
---
 .../divider-component_2017-10-13-18-06.json   | 11 +++
 .../office-ui-fabric-react/src/Divider.ts     |  1 +
 .../components/Divider/Divider.checklist.ts   |  9 ++
 .../src/components/Divider/DividerPage.tsx    | 87 +++++++++++++++++++
 .../Divider/VerticalDivider.Props.ts          | 13 +++
 .../Divider/VerticalDivider.classNames.ts     | 18 ++++
 .../components/Divider/VerticalDivider.tsx    | 14 +++
 .../VerticalDivider.Basic.Example.tsx         | 40 +++++++++
 .../VerticalDivider.Custom.Example.tsx        | 49 +++++++++++
 .../src/components/Divider/index.ts           |  2 +
 .../src/demo/AppDefinition.tsx                |  6 ++
 11 files changed, 250 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/divider-component_2017-10-13-18-06.json
 create mode 100644 packages/office-ui-fabric-react/src/Divider.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Divider/Divider.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Divider/DividerPage.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.Props.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.classNames.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Divider/examples/VerticalDivider.Basic.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Divider/examples/VerticalDivider.Custom.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Divider/index.ts

diff --git a/common/changes/office-ui-fabric-react/divider-component_2017-10-13-18-06.json b/common/changes/office-ui-fabric-react/divider-component_2017-10-13-18-06.json
new file mode 100644
index 0000000000000..afe94e84dfb84
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/divider-component_2017-10-13-18-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added a new divider component",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/Divider.ts b/packages/office-ui-fabric-react/src/Divider.ts
new file mode 100644
index 0000000000000..914d007f81bb3
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/Divider.ts
@@ -0,0 +1 @@
+export * from './components/Divider/index';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Divider/Divider.checklist.ts b/packages/office-ui-fabric-react/src/components/Divider/Divider.checklist.ts
new file mode 100644
index 0000000000000..fa5abb6ebeba7
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Divider/Divider.checklist.ts
@@ -0,0 +1,9 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+
+export const DividerStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.unknown,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.unknown
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Divider/DividerPage.tsx b/packages/office-ui-fabric-react/src/components/Divider/DividerPage.tsx
new file mode 100644
index 0000000000000..b4c607a5e546d
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Divider/DividerPage.tsx
@@ -0,0 +1,87 @@
+import * as React from 'react';
+import {
+  ExampleCard,
+  IComponentDemoPageProps,
+  ComponentPage,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+import { VerticalDividerBasicExample } from './examples/VerticalDivider.Basic.Example';
+import { VerticalDividerCustomExample } from './examples/VerticalDivider.Custom.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { DividerStatus } from './Divider.checklist';
+
+const VerticalDividerBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Divider/examples/VerticalDivider.Basic.Example.tsx') as string;
+
+const VerticalDividerCustomExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Divider/examples/VerticalDivider.Custom.Example.tsx') as string;
+
+export class DividerPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render() {
+    return (
+      <ComponentPage
+        title='Divider'
+        componentName='DividerExample'
+        exampleCards={
+          <div>
+            <ExampleCard title='Vertical Divider' code={ VerticalDividerBasicExampleCode }>
+              <VerticalDividerBasicExample />
+            </ExampleCard>
+            <ExampleCard title='Custom Vertical Divider' code={ VerticalDividerCustomExampleCode }>
+              <VerticalDividerCustomExample />
+            </ExampleCard>
+          </div>
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Divider/VerticalDivider.Props.ts')
+            ] }
+          />
+        }
+        overview={
+          <div>
+            <p>
+              A Divider is a line that is used to visually differentiate different parts of a UI. They are commonly used in headers and command bars. This divider automatically center algins itself within the parent container and can be customized to be shown in different heights and colors.
+            </p>
+          </div>
+        }
+        bestPractices={
+          <div>
+            <p>
+              Use a divider component to show a sectional or continuity change in the content between two blocks of information. The spacing around the divider is generally determined by the content surrounding it.
+            </p>
+            <p>
+              There are two recommended divider color combinations:
+              <ol>
+                <li>#C8C8C8/neutralTertiaryAlt divider when used within an #F4F4F4/neutralLighter layout</li>
+                <li> #EAEAEA/neutralLight divider when used within an #FFFFFF/white layout</li>
+              </ol>
+            </p>
+          </div>
+        }
+        dos={
+          <div>
+            <ul>
+              <li>Use a divider to separate sections that may not otherwise have a clear beginning or end.</li>
+              <li>Use a divider to separate information blocks where the context or continuity changes between the blocks.</li>
+              <li>When the divider is used to change the look of the page but does not have all the functional, interactive, or structural relevance implied by the element type, or may be used to provide for an accessible fallback in older browsers that do not support WAI-ARIA use role="presentation".</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul>
+              <li>Do not use dividers for graphic decoration.</li>
+            </ul>
+          </div>
+
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...DividerStatus}
+          />
+        }
+      />
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.Props.ts b/packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.Props.ts
new file mode 100644
index 0000000000000..53b669dafd321
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.Props.ts
@@ -0,0 +1,13 @@
+import { ITheme } from '../../Styling';
+
+export interface IVerticalDividerProps {
+  /**
+   * Optional function to generate the class names for the divider for custom styling
+   */
+  getClassNames?: (theme: ITheme) => IVerticalDividerClassNames;
+}
+
+export interface IVerticalDividerClassNames {
+  wrapper: string;
+  divider: string;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.classNames.ts b/packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.classNames.ts
new file mode 100644
index 0000000000000..16b6fe3f0d551
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.classNames.ts
@@ -0,0 +1,18 @@
+import { memoizeFunction } from '../../Utilities';
+import { mergeStyleSets, ITheme } from '../../Styling';
+import { IVerticalDividerClassNames } from './VerticalDivider.Props';
+
+export const getDividerClassNames = memoizeFunction((theme: ITheme): IVerticalDividerClassNames => {
+  return mergeStyleSets({
+    wrapper: {
+      display: 'inline-flex',
+      height: '100%',
+      alignItems: 'center'
+    },
+    divider: {
+      width: 1,
+      height: '100%',
+      backgroundColor: theme.palette.neutralTertiaryAlt
+    }
+  });
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.tsx b/packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.tsx
new file mode 100644
index 0000000000000..080d5fa021418
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.tsx
@@ -0,0 +1,14 @@
+import * as React from 'react';
+import { getDividerClassNames } from './VerticalDivider.classNames';
+import { IVerticalDividerProps } from './VerticalDivider.Props';
+import { getTheme } from '../../Styling';
+
+export const VerticalDivider = (props: IVerticalDividerProps) => {
+  const theme = getTheme();
+  const classNames = props.getClassNames ? props.getClassNames(theme) : getDividerClassNames(theme);
+
+  return (
+    <span className={ classNames.wrapper }>
+      <span className={ classNames.divider } />
+    </span>);
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Divider/examples/VerticalDivider.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Divider/examples/VerticalDivider.Basic.Example.tsx
new file mode 100644
index 0000000000000..a12b5c06da64f
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Divider/examples/VerticalDivider.Basic.Example.tsx
@@ -0,0 +1,40 @@
+import * as React from 'react';
+import { VerticalDivider } from 'office-ui-fabric-react/lib/Divider';
+import { mergeStyleSets } from 'office-ui-fabric-react/lib/Styling';
+import { memoizeFunction } from 'office-ui-fabric-react/lib/Utilities';
+
+interface IBasicDividerExampleClassNames {
+  wrapper: string;
+  text: string;
+}
+
+const getExampleClassNames = memoizeFunction((): IBasicDividerExampleClassNames => {
+  const exampleHeight = 40;
+  return mergeStyleSets({
+    wrapper: {
+      height: 40,
+      backgroundColor: '#F4F4F4',
+      padding: '0 10px'
+    },
+    text: {
+      display: 'inline-block',
+      padding: '0 8px',
+      height: exampleHeight,
+      lineHeight: exampleHeight,
+      verticalAlign: 'top',
+      margin: 'auto'
+    }
+  });
+});
+
+export class VerticalDividerBasicExample extends React.Component<any, any> {
+  public render() {
+    const classNames = getExampleClassNames();
+    return (
+      <div className={ classNames.wrapper }>
+        <p className={ classNames.text }> Some text before the divider. </p>
+        <VerticalDivider />
+        <p className={ classNames.text }>Some text after the divider. </p>
+      </div>);
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/Divider/examples/VerticalDivider.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/Divider/examples/VerticalDivider.Custom.Example.tsx
new file mode 100644
index 0000000000000..999660bb2130e
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Divider/examples/VerticalDivider.Custom.Example.tsx
@@ -0,0 +1,49 @@
+import * as React from 'react';
+import { VerticalDivider, IVerticalDividerClassNames } from 'office-ui-fabric-react/lib/components/Divider';
+import { getDividerClassNames } from 'office-ui-fabric-react/lib/components/Divider/VerticalDivider.classNames';
+import { mergeStyleSets, ITheme } from 'office-ui-fabric-react/lib/Styling';
+import { memoizeFunction } from 'office-ui-fabric-react/lib/Utilities';
+
+interface ICustomDividerExampleClassNames {
+  wrapper: string;
+  text: string;
+}
+
+const getExampleClassNames = memoizeFunction((): ICustomDividerExampleClassNames => {
+  const exampleHeight = 40;
+  return mergeStyleSets({
+    wrapper: {
+      height: 40,
+      backgroundColor: '#F4F4F4',
+      padding: '0'
+    },
+    text: {
+      display: 'inline-block',
+      padding: '0 8px',
+      height: exampleHeight,
+      lineHeight: exampleHeight,
+      verticalAlign: 'top',
+      margin: 'auto'
+    }
+  });
+});
+
+const getVerticalDividerClassNames = memoizeFunction((theme: ITheme): IVerticalDividerClassNames => {
+  return mergeStyleSets(getDividerClassNames(theme), {
+    divider: {
+      height: 28
+    }
+  });
+});
+
+export class VerticalDividerCustomExample extends React.Component<any, any> {
+  public render() {
+    const exampleClassNames = getExampleClassNames();
+    return (
+      <div className={ exampleClassNames.wrapper }>
+        <p className={ exampleClassNames.text }> Some text before the divider. </p>
+        <VerticalDivider getClassNames={ getVerticalDividerClassNames } />
+        <p className={ exampleClassNames.text }>Some text after the divider. </p>
+      </div>);
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/Divider/index.ts b/packages/office-ui-fabric-react/src/components/Divider/index.ts
new file mode 100644
index 0000000000000..240e0c86a3320
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Divider/index.ts
@@ -0,0 +1,2 @@
+export * from './VerticalDivider';
+export * from './VerticalDivider.Props';
diff --git a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
index 5958b458dcf75..8af25e6e9211d 100644
--- a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
+++ b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
@@ -94,6 +94,12 @@ export const AppDefinition: IAppDefinition = {
           name: 'Dialog',
           url: '#/examples/dialog'
         },
+        {
+          component: require<any>('../components/Divider/DividerPage').DividerPage,
+          key: 'Divider',
+          name: 'Divider',
+          url: '#/examples/Divider'
+        },
         {
           component: require<any>('../components/DocumentCard/DocumentCardPage').DocumentCardPage,
           key: 'DocumentCard',

From 85f8ab5431e70432893d388ff8956a19ab5ffeb8 Mon Sep 17 00:00:00 2001
From: manueldosal <manuel_dosal32@hotmail.com>
Date: Sun, 22 Oct 2017 08:59:01 -0700
Subject: [PATCH 0903/1641] Create on menu opened callback combo box (#3182)

* Adding OnMenuOpened callback

* Adding change file

* Adding UT

* Changing to onMenuOpen

* Update Create_OnMenuOpened_Callback_ComboBox_2017-10-20-22-22.json

* Adding jest for mocking function
---
 ...ned_Callback_ComboBox_2017-10-20-22-22.json | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.Props.ts  |  5 +++++
 .../src/components/ComboBox/ComboBox.test.tsx  | 18 ++++++++++++++++++
 .../src/components/ComboBox/ComboBox.tsx       |  7 ++++++-
 .../examples/ComboBox.Basic.Example.tsx        |  9 +++++++++
 5 files changed, 49 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/Create_OnMenuOpened_Callback_ComboBox_2017-10-20-22-22.json

diff --git a/common/changes/office-ui-fabric-react/Create_OnMenuOpened_Callback_ComboBox_2017-10-20-22-22.json b/common/changes/office-ui-fabric-react/Create_OnMenuOpened_Callback_ComboBox_2017-10-20-22-22.json
new file mode 100644
index 0000000000000..5ddab2a8e155d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/Create_OnMenuOpened_Callback_ComboBox_2017-10-20-22-22.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Adding onMenuOpen callback",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "madosal@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
index 10929524ec5df..9140b4f38233b 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
@@ -42,6 +42,11 @@ export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox>
    */
   onChanged?: (option?: IComboBoxOption, index?: number, value?: string) => void;
 
+  /**
+   * Function that gets invoked when the ComboBox menu is launched
+   */
+  onMenuOpen?: () => void;
+
   /**
    * Callback issued when the options should be resolved, if they have been updated or
    * if they need to be passed in the first time
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
index f71232a4bb22e..63652654d950a 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
@@ -355,4 +355,22 @@ describe('ComboBox', () => {
     buttonElement.simulate('click');
     expect(comboBoxRoot.find('.is-opened').length).toEqual(0);
   });
+
+  it('Call onMenuOpened when clicking on the button', () => {
+    let comboBoxRoot;
+    let buttonElement;
+    const returnUndefined = jest.fn();
+
+    let wrapper = mount(
+      <ComboBox
+        label='testgroup'
+        defaultSelectedKey='1'
+        options={ DEFAULT_OPTIONS2 }
+        onMenuOpen={ returnUndefined }
+      />);
+    comboBoxRoot = wrapper.find('.ms-ComboBox');
+    buttonElement = comboBoxRoot.find('button');
+    buttonElement.simulate('click');
+    expect(returnUndefined.mock.calls.length).toBe(1);
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 38e11d84d7218..cbaa5b42a2d35 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -160,7 +160,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   public componentDidUpdate(prevProps: IComboBoxProps, prevState: IComboBoxState) {
     let {
       allowFreeform,
-      value
+      value,
+      onMenuOpen
     } = this.props;
     let {
       isOpen,
@@ -197,6 +198,10 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       )) {
       this._select();
     }
+
+    if (isOpen && !prevState.isOpen && onMenuOpen) {
+      onMenuOpen();
+    }
   }
 
   public componentWillUnmount() {
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
index 4b7b50e5f1fdc..280714f9ead55 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
@@ -72,6 +72,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
           // tslint:disable:jsx-no-lambda
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
+          onMenuOpen={ () => console.log('ComboBox menu opened') }
         // tslint:enable:jsx-no-lambda
         />
 
@@ -87,6 +88,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
           // tslint:disable:jsx-no-lambda
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
+          onMenuOpen={ () => console.log('ComboBox menu opened') }
         // tslint:enable:jsx-no-lambda
         />
 
@@ -102,6 +104,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
           // tslint:disable:jsx-no-lambda
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
+          onMenuOpen={ () => console.log('ComboBox menu opened') }
         // tslint:enable:jsx-no-lambda
         />
 
@@ -116,6 +119,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
           // tslint:disable:jsx-no-lambda
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
+          onMenuOpen={ () => console.log('ComboBox menu opened') }
         // tslint:enable:jsx-no-lambda
         />
 
@@ -131,6 +135,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
           // tslint:disable:jsx-no-lambda
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
+          onMenuOpen={ () => console.log('ComboBox menu opened') }
         // tslint:enable:jsx-no-lambda
         />
 
@@ -144,6 +149,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
           // tslint:disable:jsx-no-lambda
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
+          onMenuOpen={ () => console.log('ComboBox menu opened') }
         // tslint:enable:jsx-no-lambda
         />
 
@@ -165,6 +171,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
           // tslint:disable:jsx-no-lambda
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
+          onMenuOpen={ () => console.log('ComboBox menu opened') }
         // tslint:enable:jsx-no-lambda
         />
 
@@ -183,6 +190,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
             // tslint:disable:jsx-no-lambda
             onFocus={ () => console.log('onFocus called') }
             onBlur={ () => console.log('onBlur called') }
+            onMenuOpen={ () => console.log('ComboBox menu opened') }
           // tslint:enable:jsx-no-lambda
           />
           :
@@ -200,6 +208,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
             // tslint:disable:jsx-no-lambda
             onFocus={ () => console.log('onFocus called') }
             onBlur={ () => console.log('onBlur called') }
+            onMenuOpen={ () => console.log('ComboBox menu opened') }
           // tslint:enable:jsx-no-lambda
           />
         }

From 515e1c73d21237f8bee92b521851b2f3828aa12b Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 23 Oct 2017 10:24:13 +0000
Subject: [PATCH 0904/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...ed_Callback_ComboBox_2017-10-20-22-22.json | 11 -------
 .../divider-component_2017-10-13-18-06.json   | 11 -------
 ...en-target-point-prop_2017-10-20-20-02.json | 11 -------
 ...arse_formatted_dates_2017-10-19-21-44.json | 11 -------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 31 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 ++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 13 files changed, 52 insertions(+), 52 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/Create_OnMenuOpened_Callback_ComboBox_2017-10-20-22-22.json
 delete mode 100644 common/changes/office-ui-fabric-react/divider-component_2017-10-13-18-06.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-broken-target-point-prop_2017-10-20-20-02.json
 delete mode 100644 common/changes/office-ui-fabric-react/fpintos-datePicker_3161_do_not_parse_formatted_dates_2017-10-19-21-44.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index b58eb18a749af..86c0d55ac19ba 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.11.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.12.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 459524ccbed02..559b88cd53f8b 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.11.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.12.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 8ce717ffa6ee0..43147a8560535 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.11.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.12.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 514e3dd66b946..7aec9407ee772 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.11.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.12.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 39840b1582043..2679cf46e46ce 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.11.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.12.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/Create_OnMenuOpened_Callback_ComboBox_2017-10-20-22-22.json b/common/changes/office-ui-fabric-react/Create_OnMenuOpened_Callback_ComboBox_2017-10-20-22-22.json
deleted file mode 100644
index 5ddab2a8e155d..0000000000000
--- a/common/changes/office-ui-fabric-react/Create_OnMenuOpened_Callback_ComboBox_2017-10-20-22-22.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Adding onMenuOpen callback",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "madosal@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/divider-component_2017-10-13-18-06.json b/common/changes/office-ui-fabric-react/divider-component_2017-10-13-18-06.json
deleted file mode 100644
index afe94e84dfb84..0000000000000
--- a/common/changes/office-ui-fabric-react/divider-component_2017-10-13-18-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added a new divider component",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-broken-target-point-prop_2017-10-20-20-02.json b/common/changes/office-ui-fabric-react/fix-broken-target-point-prop_2017-10-20-20-02.json
deleted file mode 100644
index 041e0e2383b9a..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-broken-target-point-prop_2017-10-20-20-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu/Callout: Fix (and deprecate) broken 'targetPoint' API",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fpintos-datePicker_3161_do_not_parse_formatted_dates_2017-10-19-21-44.json b/common/changes/office-ui-fabric-react/fpintos-datePicker_3161_do_not_parse_formatted_dates_2017-10-19-21-44.json
deleted file mode 100644
index f2505518fa69b..0000000000000
--- a/common/changes/office-ui-fabric-react/fpintos-datePicker_3161_do_not_parse_formatted_dates_2017-10-19-21-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DatePicker will not try to parse a string if the formatted string of the selected date is the same as the string to be parsed.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "fpintos@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index edf5f2a5611dc..a86165b73e43e 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.11.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.12.0 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 51becd6d7c8e2..fc559d43c083c 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,37 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.12.0",
+      "tag": "office-ui-fabric-react_v5.12.0",
+      "date": "Mon, 23 Oct 2017 10:24:13 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "manueldosal <manuel_dosal32@hotmail.com>",
+            "commit": "85f8ab5431e70432893d388ff8956a19ab5ffeb8",
+            "comment": "ComboBox: Adding onMenuOpen callback"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "d4f447f93277ce940464daa1cadf0bab8509a25e",
+            "comment": "Added a new divider component"
+          },
+          {
+            "author": "Michael Loughry <miclo@microsoft.com>",
+            "commit": "362fedce0eb72ff8b130e2a0400f7099ffdf2c03",
+            "comment": "ContextualMenu/Callout: Fix (and deprecate) broken 'targetPoint' API"
+          },
+          {
+            "author": "Fabio Pintos <fabio.pintos@outlook.com>",
+            "commit": "ee9cd4b760b1b0de70890f035a36058cc67e70d7",
+            "comment": "DatePicker will not try to parse a string if the formatted string of the selected date is the same as the string to be parsed."
+          }
+        ]
+      }
+    },
     {
       "version": "5.11.0",
       "tag": "office-ui-fabric-react_v5.11.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 0085432366852..2de213a3e4b41 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 20 Oct 2017 18:42:08 GMT and should not be manually modified.
+This log was last generated on Mon, 23 Oct 2017 10:24:13 GMT and should not be manually modified.
+
+## 5.12.0
+Mon, 23 Oct 2017 10:24:13 GMT
+
+### Minor changes
+
+- ComboBox: Adding onMenuOpen callback
+
+### Patches
+
+- Added a new divider component
+- ContextualMenu/Callout: Fix (and deprecate) broken 'targetPoint' API
+- DatePicker will not try to parse a string if the formatted string of the selected date is the same as the string to be parsed.
 
 ## 5.11.0
 Fri, 20 Oct 2017 18:42:08 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 63e0b87966489..2839be3e52971 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.11.0",
+  "version": "5.12.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 49b9c461a7e2b069e5a39a6e1d439d83edf49c42 Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Mon, 23 Oct 2017 08:44:55 -0700
Subject: [PATCH 0905/1641] update codeowners (#3184)

---
 .github/CODEOWNERS | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index 22846bfd41b74..e905c613c01d1 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -28,6 +28,9 @@
 
   ### Fabric
   # packages/office-ui-fabric-react/src/common/*
+  packages/office-ui-fabric-react/src/common/_semanticSlots.scss  @phkuo
+  packages/office-ui-fabric-react/src/common/_themeOverrides.scss @phkuo
+  packages/office-ui-fabric-react/src/common/_common.scss @phkuo
 
     ## Components
     # packages/office-ui-fabric-react/src/components/ActivityItem/*
@@ -89,6 +92,7 @@
   # packages/office-ui-fabric-react/src/visualtest/*
 
 # packages/office-ui-fabric-react-tslint/*
-packages/styling/*  @dzearing @phkuo
+packages/styling/*  @dzearing
+packages/styling/src/interfaces/* @phkuo
+packages/styling/src/styles/* @phkuo
 # packages/utilities/*
-

From 6b86c95a9f1e52ed5488360608ea83792bad385d Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Mon, 23 Oct 2017 11:54:36 -0700
Subject: [PATCH 0906/1641] Jest: Added some usage and update notes to docs
 (#3176)

* Added some usage notes

* Added Updating Snapshots section

* Punctuation!

* Added change file

* Linked to TESTING.md
---
 .../jest-docs_2017-10-20-18-25.json                   | 11 +++++++++++
 packages/jest-serializer-merge-styles/README.md       |  2 ++
 2 files changed, 13 insertions(+)
 create mode 100644 common/changes/@uifabric/jest-serializer-merge-styles/jest-docs_2017-10-20-18-25.json

diff --git a/common/changes/@uifabric/jest-serializer-merge-styles/jest-docs_2017-10-20-18-25.json b/common/changes/@uifabric/jest-serializer-merge-styles/jest-docs_2017-10-20-18-25.json
new file mode 100644
index 0000000000000..8b3b8a585dd01
--- /dev/null
+++ b/common/changes/@uifabric/jest-serializer-merge-styles/jest-docs_2017-10-20-18-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/jest-serializer-merge-styles",
+      "comment": "Updated jest docs",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/jest-serializer-merge-styles",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/jest-serializer-merge-styles/README.md b/packages/jest-serializer-merge-styles/README.md
index 5148aa96e6195..3ef351f307c78 100644
--- a/packages/jest-serializer-merge-styles/README.md
+++ b/packages/jest-serializer-merge-styles/README.md
@@ -45,3 +45,5 @@ module.exports = {
   ]
 }
 ```
+
+See [Testing](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/TESTING.md) for more detailed usage.
\ No newline at end of file

From e15ecddc2d8813903725ce7b29c39aeeb98f513a Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Mon, 23 Oct 2017 14:30:42 -0700
Subject: [PATCH 0907/1641] ComboBox: Add styling property for the label in the
 disabled state (#3200)

* Add customization hook for label in the disabled state

* Rush change
---
 .../combo-box-label-disabled_2017-10-23-20-57.json    | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.Props.ts         |  5 +++++
 .../src/components/ComboBox/ComboBox.classNames.ts    |  3 ++-
 .../src/components/ComboBox/ComboBox.styles.ts        |  1 +
 4 files changed, 19 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/combo-box-label-disabled_2017-10-23-20-57.json

diff --git a/common/changes/office-ui-fabric-react/combo-box-label-disabled_2017-10-23-20-57.json b/common/changes/office-ui-fabric-react/combo-box-label-disabled_2017-10-23-20-57.json
new file mode 100644
index 0000000000000..08513ef6b868e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/combo-box-label-disabled_2017-10-23-20-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Add support for custom styling of the label in the disabled state",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "<christianjordangonzalez@gmail.com>"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
index 9140b4f38233b..44c475adaf1f4 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
@@ -125,6 +125,11 @@ export interface IComboBoxStyles {
    */
   label: IStyle;
 
+  /**
+   * Style for the label element of the ComboBox in the disabled state.
+   */
+  labelDisabled: IStyle;
+
   /**
    * Base styles for the root element of all ComboBoxes.
    */
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
index 2e9f07097b00b..433236e7d8164 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
@@ -38,7 +38,8 @@ export const getClassNames = memoizeFunction((
       styles.container,
     ),
     label: mergeStyles(
-      styles.label
+      styles.label,
+      disabled && styles.labelDisabled
     ),
     root: mergeStyles(
       'ms-ComboBox',
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index b23a2f59ea402..d2571407a95e4 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -201,6 +201,7 @@ export const getStyles = memoizeFunction((
   const styles: IComboBoxStyles = {
     container: {},
     label: {},
+    labelDisabled: {},
     root: [
       fonts.medium,
       {

From a6297f45ea2d20d54d7ae6741fa2294869f9cda2 Mon Sep 17 00:00:00 2001
From: John Miller <rubixws@gmail.com>
Date: Mon, 23 Oct 2017 14:45:13 -0700
Subject: [PATCH 0908/1641] Create component task, adding instructions to
 CONTRIBUTION.md (#3147)

* Adding Create Component Script

* Updating npm-shrinkwrap

* Adding mustache to package.json

* Added script to Create new component in Fabric

* Added mustache template files for creating a new component.

* Fixing error around folder creation.

* Swaping the template contents

* Fixed mustache reference, fixed typo in error handler, fixed, component folder path.

* Adding new launch.json entry and removed an extra comma

* Adding contributing markdown with instructions on creating a new component.

* Added new script for creating blank components

* Updating package.json and reverting shrinkwrap

* Adding mustache to shrinkwrap

* Updated contributing to include adding a styles file

* Cleaned up create-component and added one more task to write the classnames file.

* Fixing a couple bugs with the create component task

* Added ClassNames template file, updates to empty component template and empty props template.

* Fixed classnames file, added one more step to create an interface for styles in the props file.

* Fixing typo

* Updating contributing.md to reflect the package name change to experiments

* Update path name to use the experiments directory.

* Refactored the callbacks so it's easier to maintain.

* Adding two new template files

* Moved the debug code to the end
---
 .vscode/launch.json                           |  23 ++-
 CONTRIBUTING.md                               |  67 +++++++++
 common/config/rush/npm-shrinkwrap.json        |   5 +
 package.json                                  |   5 +-
 scripts/create-component.js                   | 141 ++++++++++++++++++
 scripts/package.json                          |   1 +
 scripts/templates/EmptyClassNames.mustache    |  22 +++
 scripts/templates/EmptyComponent.mustache     |  11 ++
 .../templates/EmptyComponentIndex.mustache    |   2 +
 .../EmptyGlobalComponentIndex.mustache        |   1 +
 scripts/templates/EmptyProps.mustache         |  13 ++
 11 files changed, 288 insertions(+), 3 deletions(-)
 create mode 100644 CONTRIBUTING.md
 create mode 100644 scripts/create-component.js
 create mode 100644 scripts/templates/EmptyClassNames.mustache
 create mode 100644 scripts/templates/EmptyComponent.mustache
 create mode 100644 scripts/templates/EmptyComponentIndex.mustache
 create mode 100644 scripts/templates/EmptyGlobalComponentIndex.mustache
 create mode 100644 scripts/templates/EmptyProps.mustache

diff --git a/.vscode/launch.json b/.vscode/launch.json
index 8417aa2b9f476..921d117d2edef 100644
--- a/.vscode/launch.json
+++ b/.vscode/launch.json
@@ -29,7 +29,7 @@
       "cwd": "${workspaceRoot}/packages/experiments",
       "stopOnEntry": false,
       "args": [
-        "jest",
+        "jest"
       ],
       "runtimeExecutable": null,
       "runtimeArgs": [
@@ -104,6 +104,27 @@
         "NODE_ENV": "development"
       },
       "sourceMaps": false
+    },
+    {
+      "name": "Debug add new component",
+      "type": "node",
+      "request": "launch",
+      "program": "${workspaceRoot}/scripts/create-component.js",
+      "cwd": "${workspaceRoot}",
+      "stopOnEntry": false,
+      "args": [
+        "--name",
+        "TestComponentName"
+      ],
+      "runtimeExecutable": null,
+      "runtimeArgs": [
+        "--nolazy",
+        "--debug"
+      ],
+      "env": {
+        "NODE_ENV": "development"
+      },
+      "sourceMaps": true
     }
   ]
 }
\ No newline at end of file
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
new file mode 100644
index 0000000000000..2965ff3ddc627
--- /dev/null
+++ b/CONTRIBUTING.md
@@ -0,0 +1,67 @@
+# Contributing to Office UI Fabric
+
+## Creating New Components
+
+### Creating a component via the command line
+1. Open a command prompt in the root directory of your project directory.
+2. Run `npm run create-component -- --name YourAwesomeNewComponentName`
+  * Our components use the Pascal Case naming convention.
+
+### Creating a component manually.
+1. From the root of the project, travel to `packages/experiments/src/components/`
+2. Create a new folder here with your component name
+  * Our components use the Pascal Case naming convention.
+  * In this example the component will be called `ExcitingNewComponent`.
+3. Create a `ExcitingNewComponent.Props.ts` file that will contain an interface for your props
+  * Import React
+    * `import * as React from 'react'`;
+  * Import ExcitingNewComponent
+    * `import { ExcitingNewComponent } from './ExcitingNewComponent'`;
+    * Note: This class and file don't exist yet but they will during step 4 of this small tutorial.
+  * Create an empty interface `IExcitingNewComponent`
+    * `export interface IExcitingNewComponent {}`
+  * Add your props interface to this file.
+    * `export interface IExcitingNewComponentProps extends React.Props<ExcitingNewComponent> { … Props }`
+  * Create and export an interface for ExcitingNewComponent styles.
+```
+    export interface I{{componentName}}Styles {
+      /**
+      * Style for the root element
+      */
+      root?: IStyle;
+    }
+```
+4. Create a react file, `ExcitingNewComponent.tsx`.
+  * Import React
+    * `import * as React from 'react';`
+  * Import BaseComponent
+    * `import { BaseComponent } from '../../Utilities';`
+  * Import IExcitingNewComponentProps
+    * `import { IExcitingNewComponentProps } from './ExcitingNewComponent.Props';`
+  * Add your class to this file.
+    * Add the following example class
+    * `export class ExcitingNewComponent extends BaseComponent<IExcitingNewComponentProps, {}> { };`
+5. Create a class names file `ExcitingNewComponent.classNames.ts`
+  * Import memoizeFunction.
+    * `import { memoizeFunction } from '../../Utilities';`
+  * Import mergeStyles.
+    * `import { mergeStyleSets } from '../../Styling';`
+  * Import ExcitingNewComponent.
+    * `import { IExcitingNewComponentStyles } from './ExcitingNewComponent.Props';`
+  * Create and export an interface for your class names.
+```
+    export interface IExcitingNewComponentClassNames {
+      /**
+      * Root html container for this component.
+      */
+      root?: string;
+    }
+```
+  * Create and export getClassNames
+```
+    export const getClassNames = memoizeFunction((): IExcitingNewComponentClassNames => {
+      return mergeStyleSets({
+        root: []
+      });
+    });
+```
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 3fe8e05ce6197..eb066dab00872 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -7661,6 +7661,11 @@
       "resolved": "https://registry.npmjs.org/mobx/-/mobx-2.7.0.tgz",
       "integrity": "sha1-zz2C0YwMp/RY2PKiQIF7PcflSgE="
     },
+    "mustache": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/mustache/-/mustache-2.3.0.tgz",
+      "integrity": "sha1-QCj3d4sXcIpImTCm5SrDvKDaQdA="
+    },
     "mocha": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz",
diff --git a/package.json b/package.json
index f7151692d291a..3eb7cf92f69d0 100644
--- a/package.json
+++ b/package.json
@@ -21,7 +21,8 @@
     "buildfast": "npm run _rushBuild",
     "change": "node node_modules/@microsoft/rush/bin/rush change",
     "generate": "node node_modules/@microsoft/rush/bin/rush generate",
-    "bundlesize": "cd scripts && npm run bundlesize"
+    "bundlesize": "cd scripts && npm run bundlesize",
+    "create-component": "node scripts/create-component.js"
   },
   "license": "MIT",
   "devDependencies": {
@@ -30,4 +31,4 @@
   "dependencies": {
     "gulp": "^3.9.1"
   }
-}
+}
\ No newline at end of file
diff --git a/scripts/create-component.js b/scripts/create-component.js
new file mode 100644
index 0000000000000..eb8c598f6765c
--- /dev/null
+++ b/scripts/create-component.js
@@ -0,0 +1,141 @@
+// Dependencies
+const mustache = require('mustache');
+const argv = require('yargs').argv;
+const newComponentName = argv.name;
+const fs = require('fs');
+
+// Paths/File Names
+const rootComponentFolderPath = './packages/experiments/src';
+const componentFolderPath = rootComponentFolderPath + '/components/' + newComponentName;
+const componentPropsFileName = newComponentName + '.Props.ts';
+const componentFileName = newComponentName + '.tsx';
+const componentFileClassNamesName = newComponentName + '.classNames.ts';
+const globalIndexFileName = newComponentName + '.ts';
+const templateFolderPath = './scripts/templates';
+const indexFileName = 'index.ts';
+
+// Error strings
+const errorCreatingComponentDir = 'Error creating component directory';
+const errorOpenMustacheTemplateForProps = 'Unable to open mustache template for props';
+const errorUnableToWritePropsFile = 'Unable to write props file';
+const errorUnableToOpenTemplate = 'Unable to open mustache template for component';
+const errorUnableToWriteComponentFile = 'Unable to write component file';
+const errorUnableToWriteComponentClassFile = 'Unable to write component class name file';
+const errorUnableToOpenClassNamesTemplate = 'Unable to open component class files template';
+const errorComponentName = 'Please pass in the component name using --name ExcitingNewComponentName';
+const errorUnableToWriteComponentIndexFile = 'Unable to write component class index file';
+const errorUnableToOpenIndexTemplate = "Unable to open the component index template"
+
+//Success strings
+const successComponentCreated = 'New component ' + newComponentName + ' succesfully created';
+
+function handleError(error, errorPrependMessage) {
+  if (error) {
+    console.error(errorPrependMessage, error);
+    return false;
+  } else {
+    return true;
+  }
+}
+
+function createComponentFiles(mustacheTemplateName, fileName, createFileError, openMustacheTemplateError, cb, customPath) {
+  fs.readFile(templateFolderPath + '/' + mustacheTemplateName, 'utf8', (error, data) => {
+    readFileCallback(error, data, fileName, cb, openMustacheTemplateError, createFileError, customPath);
+  });
+}
+
+function readFileCallback(error, data, fileName, cb, openMustacheTemplateError, createFileError, customPath) {
+  if (!handleError(error, openMustacheTemplateError)) {
+    return;
+  }
+  let path = componentFolderPath + '/' + fileName;
+  if (customPath) {
+    path = customPath + '/' + fileName;
+  }
+
+  const fileData = mustache.render(data, { componentName: newComponentName });
+  fs.writeFile(path, fileData, (error) => { writeFileCallback(error, createFileError, cb); });
+}
+
+function writeFileCallback(error, createFileError, cb) {
+  if (!handleError(error, createFileError)) {
+    return;
+  }
+
+  if (cb) {
+    cb();
+  }
+}
+
+function makeComponentDirectory(error) {
+  if (!handleError(error, errorCreatingComponentDir)) {
+    return;
+  }
+  createPropsFile();
+}
+
+function createPropsFile() {
+  // Create props file
+  createComponentFiles(
+    'EmptyProps.mustache',
+    componentPropsFileName,
+    errorUnableToWritePropsFile,
+    errorOpenMustacheTemplateForProps,
+    createComponentFile // Create component file
+  );
+}
+
+function createComponentFile() {
+  // Create component file
+  createComponentFiles(
+    'EmptyComponent.mustache',
+    componentFileName,
+    errorUnableToWriteComponentFile,
+    errorUnableToOpenTemplate,
+    createClassNamesFile // Create class names file
+  );
+}
+
+function createClassNamesFile() {
+  // Create class names file
+  createComponentFiles(
+    'EmptyClassNames.mustache',
+    componentFileClassNamesName,
+    errorUnableToWriteComponentClassFile,
+    errorUnableToOpenClassNamesTemplate,
+    createLocalIndexFile // Create local index file
+  );
+}
+
+function createLocalIndexFile() {
+  // Create local index import file
+  createComponentFiles(
+    'EmptyComponentIndex.mustache',
+    indexFileName,
+    errorUnableToWriteComponentIndexFile,
+    errorUnableToOpenIndexTemplate,
+    createGlobalIndexFile // Create global index file
+  );
+}
+
+function createGlobalIndexFile() {
+  // Create global index import file
+  createComponentFiles(
+    'EmptyGlobalComponentIndex.mustache',
+    globalIndexFileName,
+    errorUnableToWriteComponentIndexFile,
+    errorUnableToOpenIndexTemplate,
+    null,
+    rootComponentFolderPath
+  );
+
+  // Success! The component has been created.
+  console.log(successComponentCreated);
+}
+
+if (newComponentName) {
+  // Create new folder in packages/src/office-ui-fabric-react
+  fs.mkdir(componentFolderPath, makeComponentDirectory);
+} else {
+  console.error(errorComponentName);
+}
\ No newline at end of file
diff --git a/scripts/package.json b/scripts/package.json
index 799ff7c1f4722..aab2f07324f7c 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -24,6 +24,7 @@
     "json-loader": "^0.5.7",
     "jest": "^21.2.0",
     "ts-jest": "^21.1.2",
+    "mustache": "^2.3.0",
     "node-sass": "^4.5.3",
     "open": "^0.0.5",
     "postcss": "^6.0.9",
diff --git a/scripts/templates/EmptyClassNames.mustache b/scripts/templates/EmptyClassNames.mustache
new file mode 100644
index 0000000000000..69fbd0cbc7f87
--- /dev/null
+++ b/scripts/templates/EmptyClassNames.mustache
@@ -0,0 +1,22 @@
+import { memoizeFunction } from '../../Utilities';
+import { mergeStyleSets} from '../../Styling';
+
+export interface I{{componentName}}Styles {
+   /**
+   * Style for the root element in the default enabled/unchecked state.
+   */
+  root?: IStyle;
+}
+
+export interface I{{componentName}}Names {
+	/**
+	* Root html container for this component.
+	*/
+	root?: string;
+}
+
+export const getClassNames = memoizeFunction((): I{{componentName}}Names => {
+	return mergeStyleSets({
+		root: []
+	});
+});
diff --git a/scripts/templates/EmptyComponent.mustache b/scripts/templates/EmptyComponent.mustache
new file mode 100644
index 0000000000000..0f7fdca00ef6a
--- /dev/null
+++ b/scripts/templates/EmptyComponent.mustache
@@ -0,0 +1,11 @@
+import * as React from 'react';
+import { BaseComponent } from '../../Utilities';
+import { I{{componentName}}Props } from './{{componentName}}.Props';
+
+export class {{componentName}} extends BaseComponent < I{{componentName}}Props, {} > {
+  public render() {
+    return(
+      <div>Hello World!</div>
+    );
+  }
+};
\ No newline at end of file
diff --git a/scripts/templates/EmptyComponentIndex.mustache b/scripts/templates/EmptyComponentIndex.mustache
new file mode 100644
index 0000000000000..9e835d221135e
--- /dev/null
+++ b/scripts/templates/EmptyComponentIndex.mustache
@@ -0,0 +1,2 @@
+export * from './{{componentName}}';
+export * from './{{componentName}}.Props';
\ No newline at end of file
diff --git a/scripts/templates/EmptyGlobalComponentIndex.mustache b/scripts/templates/EmptyGlobalComponentIndex.mustache
new file mode 100644
index 0000000000000..fb2898a489862
--- /dev/null
+++ b/scripts/templates/EmptyGlobalComponentIndex.mustache
@@ -0,0 +1 @@
+export * from './components/{{componentName}}/index';
\ No newline at end of file
diff --git a/scripts/templates/EmptyProps.mustache b/scripts/templates/EmptyProps.mustache
new file mode 100644
index 0000000000000..cdec473a5e7b2
--- /dev/null
+++ b/scripts/templates/EmptyProps.mustache
@@ -0,0 +1,13 @@
+import * as React from 'react';
+import { {{componentName}} } from './{{componentName}}';
+import { IStyle } from '../../Styling';
+
+export interface I{{componentName}} {
+}
+
+export interface I{{componentName}}Props extends React.Props<{{componentName}}> {
+  /**
+  * All props for your component are to be defined here.
+  */
+  componentRef?: (component: I{{componentName}}) => void;
+}

From f1e3474219410a1640ed9c920813987297be2bba Mon Sep 17 00:00:00 2001
From: Michael Loughry <miclo@microsoft.com>
Date: Mon, 23 Oct 2017 15:28:03 -0700
Subject: [PATCH 0909/1641] Dialog: Don't add empty spans to footer for falsy
 children of DialogFooter (#3179)

---
 .../master_2017-10-20-20-08.json                      | 11 +++++++++++
 .../src/components/Dialog/DialogFooter.tsx            |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/master_2017-10-20-20-08.json

diff --git a/common/changes/office-ui-fabric-react/master_2017-10-20-20-08.json b/common/changes/office-ui-fabric-react/master_2017-10-20-20-08.json
new file mode 100644
index 0000000000000..48e4c7400c993
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2017-10-20-20-08.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dialog: Don't add empty spans to footer for falsy children of DialogFooter",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.tsx
index 21a8a03a4f545..ea5498de8b0a6 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.tsx
@@ -16,7 +16,7 @@ export class DialogFooter extends BaseComponent<any, any> {
 
   private _renderChildrenAsActions() {
     return React.Children.map(this.props.children, child =>
-      <span className={ css('ms-Dialog-action', styles.action) }>{ child }</span>
+      child && <span className={ css('ms-Dialog-action', styles.action) }>{ child }</span>
     );
   }
 }

From 6431ff07746eee3c7a919fd7b701ba88c55a2928 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Mon, 23 Oct 2017 15:28:30 -0700
Subject: [PATCH 0910/1641] Website: Deleting deprecated header component
 (#3181)

* Deleting header

* Added change file
---
 .../src/components/Header/Header.scss         | 105 ------------------
 .../src/components/Header/Header.tsx          |  21 ----
 ...remove-header-footer_2017-10-20-21-14.json |  11 ++
 3 files changed, 11 insertions(+), 126 deletions(-)
 delete mode 100644 apps/fabric-website/src/components/Header/Header.scss
 delete mode 100644 apps/fabric-website/src/components/Header/Header.tsx
 create mode 100644 common/changes/@uifabric/fabric-website/remove-header-footer_2017-10-20-21-14.json

diff --git a/apps/fabric-website/src/components/Header/Header.scss b/apps/fabric-website/src/components/Header/Header.scss
deleted file mode 100644
index bb59ec122f9d3..0000000000000
--- a/apps/fabric-website/src/components/Header/Header.scss
+++ /dev/null
@@ -1,105 +0,0 @@
-@import '../../styles/variables';
-@import '../../styles/mixins';
-@import '../DONavigation/_DONavigationVariables';
-
-/* Header styles */
-
-:global {
-  .od-Header {
-    height: $od-Header-height;
-    left: 0;
-    padding: 0 8px;
-    position: fixed;
-    right: 0;
-    top: 0;
-    width: 100%;
-    z-index: 600;
-
-    @include high-contrast {
-      border: 1px solid WindowText;
-      border-top: 0;
-    }
-  }
-
-  .od-Header-banner {
-    height: $od-Header-height;
-    position: relative;
-    width: 100%;
-
-    @media (min-width: $od-Header-bannerWidth) {
-      width: $od-Header-bannerWidth;
-      margin: auto;
-    }
-  }
-
-  @media (min-width: $od-Header-bannerWidth) {
-    .od-Header-logo {
-      @include ms-padding-left(8px);
-    }
-  }
-
-  .od-Header-searchContainer {
-    position: absolute;
-    right: 0;
-    top: 8px;
-    width: 330px;
-    height: $od-Header-searchHeight;
-    display: none;
-
-    @media screen and (min-width: $ms-screen-min-xxl) {
-      display: block;
-    }
-  }
-
-  .od-Header-navigationContainer {
-    position: absolute;
-    left: 0;
-    right: 0;
-    height: $od-Header-height;
-    background-color: $ms-color-black;
-    display: none;
-    padding-bottom: 1px;
-    box-sizing: content-box;
-
-    &.is-open {
-      display: block;
-    }
-
-    @include high-contrast {
-      border: 1px solid WindowText;
-      border-top: 0;
-    }
-  }
-
-  .od-Header-hamburgerButton {
-    position: absolute;
-    right: 14px;
-    top: 5px;
-    width: 40px;
-    height: 40px;
-    font-size: 30px;
-    color: $ms-color-white;
-    cursor: pointer;
-    outline: none;
-    text-align: center;
-    display: none;
-
-    &:focus {
-      box-shadow: inset 0px 0px 0px 1px $ms-color-white;
-
-      @include high-contrast {
-        box-shadow: inset 0px 0px 0px 1px WindowText;
-      }
-
-      @include high-contrast-black-on-white  {
-        box-shadow: inset 0px 0px 0px 1px Highlight;
-      }
-    }
-  }
-
-  @media (min-width: $od-Header-bannerWidth) {
-    .docs-showNavigation {
-      display: block;
-    }
-  }
-}
diff --git a/apps/fabric-website/src/components/Header/Header.tsx b/apps/fabric-website/src/components/Header/Header.tsx
deleted file mode 100644
index b0d4955be45f2..0000000000000
--- a/apps/fabric-website/src/components/Header/Header.tsx
+++ /dev/null
@@ -1,21 +0,0 @@
-import * as React from 'react';
-import './Header.scss';
-
-export interface IHeaderProps {
-}
-
-export interface IHeaderState {
-}
-
-export class Header extends React.Component<IHeaderProps, IHeaderState> {
-
-  public render() {
-    return (
-      <header className='od-Header'>
-        <button className='od-Header-hamburgerButton' role='menu' aria-label='Mobile menu, press enter to open'>
-          <i className='ms-Icon ms-Icon--menu2' aria-hidden='true' />
-        </button>
-      </header>
-    );
-  }
-}
diff --git a/common/changes/@uifabric/fabric-website/remove-header-footer_2017-10-20-21-14.json b/common/changes/@uifabric/fabric-website/remove-header-footer_2017-10-20-21-14.json
new file mode 100644
index 0000000000000..d69ac136fab9d
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/remove-header-footer_2017-10-20-21-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Removed Header component - it was replaced with UHF",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From 33e7f8222a9f8631fd78fcb485debcda2fa49b81 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Mon, 23 Oct 2017 15:29:51 -0700
Subject: [PATCH 0911/1641] Nav: Add 'onRenderLink' back to rendering (#3199)

* Add onRenderLink to JSX

* Add change file

* Update Nav snapshot

* Implement IRenderFunction in onRenderLink

* Fix demo

* Fix css overflow stlyes

* Update styles and snapshot
---
 .../nav-fix-onrender_2017-10-23-17-54.json       | 11 +++++++++++
 .../src/components/Nav/Nav.Props.ts              |  3 ++-
 .../src/components/Nav/Nav.scss                  |  3 +++
 .../src/components/Nav/Nav.tsx                   | 12 +++++++++---
 .../Nav/__snapshots__/Nav.test.tsx.snap          | 11 ++++-------
 .../Nav/examples/Nav.FabricDemoApp.Example.tsx   | 16 +++++++++-------
 6 files changed, 38 insertions(+), 18 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/nav-fix-onrender_2017-10-23-17-54.json

diff --git a/common/changes/office-ui-fabric-react/nav-fix-onrender_2017-10-23-17-54.json b/common/changes/office-ui-fabric-react/nav-fix-onrender_2017-10-23-17-54.json
new file mode 100644
index 0000000000000..30be27100ad91
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/nav-fix-onrender_2017-10-23-17-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Nav: Add onRenderLink back to JSX to allow custom rendering of links",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "a.erich@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.Props.ts b/packages/office-ui-fabric-react/src/components/Nav/Nav.Props.ts
index 60c133cb53653..d2c9ee4a9e637 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.Props.ts
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { IRenderFunction } from '../../Utilities';
 
 export interface INav {
   /**
@@ -31,7 +32,7 @@ export interface INavProps {
    * Used to customize how content inside the link tag is rendered
    * @defaultvalue Default link rendering
    */
-  onRenderLink?: Function;
+  onRenderLink?: IRenderFunction<INavLink>;
 
   /**
    * Function callback invoked when a link in the navigation is clicked
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.scss b/packages/office-ui-fabric-react/src/components/Nav/Nav.scss
index 72aac142b960a..cb4fab8ffd07a 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.scss
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.scss
@@ -96,7 +96,10 @@ $linkRightPadding: 20px;
 }
 
 .linkText {
+  margin: 0 4px;
+  overflow: hidden;
   vertical-align: middle;
+  text-overflow: ellipsis;
 }
 
 .compositeLink {
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
index 1ddffa0c49627..eea5e215d7ddd 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
@@ -46,8 +46,7 @@ export interface INavState {
 export class Nav extends BaseComponent<INavProps, INavState> implements INav {
 
   public static defaultProps: INavProps = {
-    groups: null,
-    onRenderLink: (link: INavLink) => (<span className={ css('ms-Nav-linkText', styles.linkText) }>{ link.name }</span>)
+    groups: null
   };
 
   private _hasExpandButton: boolean;
@@ -131,6 +130,10 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
     return this.state.selectedKey;
   }
 
+  private _onRenderLink(link: INavLink) {
+    return (<div className={ css('ms-Nav-linkText', styles.linkText) }>{ link.name }</div>);
+  }
+
   private _renderNavLink(link: INavLink, linkIndex: number, nestingLevel: number) {
     const isRtl: boolean = getRTL();
     const paddingBefore = _indentationSize * nestingLevel + _baseIndent;
@@ -149,6 +152,9 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
         lineHeight: '36px'
       }
     };
+    let {
+      onRenderLink = this._onRenderLink
+    } = this.props;
 
     // Prevent hijacking of the parent window if link.target is defined
     const rel = link.url && link.target && !isRelativeUrl(link.url) ? 'noopener noreferrer' : undefined;
@@ -171,7 +177,7 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
         rel={ rel }
         aria-label={ link.ariaLabel }
       >
-        { link.name }
+        { onRenderLink(link, this._onRenderLink) }
       </ActionButton>);
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
index 0e435dd99d7e8..fa5a32546f9ee 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
@@ -145,13 +145,10 @@ exports[`Nav renders Nav correctly 1`] = `
                     role="presentation"
                   />
                   <div
-                    className=
-                        ms-Button-textContainer
-                        {
-                          flex-grow: 0;
-                          overflow: hidden;
-                        }
-                  />
+                    className="ms-Nav-linkText"
+                  >
+                    
+                  </div>
                 </div>
               </button>
             </div>
diff --git a/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.FabricDemoApp.Example.tsx b/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.FabricDemoApp.Example.tsx
index f8de41dab438c..1990227e0adc2 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.FabricDemoApp.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.FabricDemoApp.Example.tsx
@@ -13,13 +13,15 @@ export class NavFabricDemoAppExample extends React.Component<any, any> {
     );
   }
 
-  private _onRenderLink(link: any): (JSX.Element | null)[] {
-    return ([
-      <span key={ 1 } className='Nav-linkText'>{ link.name }</span>,
-      (link.status !== undefined ?
-        <span key={ 2 } className={ 'Nav-linkFlair ' + 'is-state' + link.status } >{ ExampleStatus[link.status] }</span> :
-        null)
-    ]);
+  private _onRenderLink(link: any): (JSX.Element | null) {
+    return (
+      <span>
+        <span key={ 1 } className='Nav-linkText'>{ link.name }</span>
+        { link.status !== undefined ?
+          <span key={ 2 } className={ 'Nav-linkFlair ' + 'is-state' + link.status } >{ ExampleStatus[link.status] }</span> :
+          null }
+      </span>
+    );
   }
 
 }

From 3ad7fdc47a3b38813821e680770f188b01cff085 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Mon, 23 Oct 2017 15:30:15 -0700
Subject: [PATCH 0912/1641] Fix selection UX states in DetailsList (#3197)

* Ensure that Select All checkbox can still be focused

* Fix sizing of DetialsRow check in compact mode and in header

* Update change output

* Make header style a prop of DetailsRowCheck
---
 .../select-all_2017-10-20-23-01.json                  | 11 +++++++++++
 .../src/components/DetailsList/DetailsHeader.tsx      |  5 ++++-
 .../src/components/DetailsList/DetailsRowCheck.scss   |  8 ++++++++
 .../src/components/DetailsList/DetailsRowCheck.tsx    |  8 ++++++--
 4 files changed, 29 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/select-all_2017-10-20-23-01.json

diff --git a/common/changes/office-ui-fabric-react/select-all_2017-10-20-23-01.json b/common/changes/office-ui-fabric-react/select-all_2017-10-20-23-01.json
new file mode 100644
index 0000000000000..0e94c70a532e3
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/select-all_2017-10-20-23-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Ensure that Select All checkbox can still be focused",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index b14f22756e71e..52ff8f51dca23 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -17,10 +17,11 @@ import { GroupSpacer } from '../GroupedList/GroupSpacer';
 import { CollapseAllVisibility } from '../../GroupedList';
 import { DetailsRowCheck } from './DetailsRowCheck';
 import { ITooltipHostProps } from '../../Tooltip';
-import * as checkStyles from './DetailsRowCheck.scss';
+import * as checkStylesModule from './DetailsRowCheck.scss';
 import { ISelection, SelectionMode, SELECTION_CHANGE } from '../../utilities/selection/interfaces';
 import * as stylesImport from './DetailsHeader.scss';
 const styles: any = stylesImport;
+const checkStyles: any = checkStylesModule;
 
 const MOUSEDOWN_PRIMARY_BUTTON = 0; // for mouse down event we are using ev.button property, 0 means left button
 const MOUSEMOVE_PRIMARY_BUTTON = 1; // for mouse move event we are using ev.buttons property, 1 means left button
@@ -177,6 +178,8 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
                       id={ `${this._id}-check` }
                       aria-label={ ariaLabelForSelectionColumn }
                       aria-describedby={ `${this._id}-checkTooltip` }
+                      data-is-focusable={ true }
+                      isHeader={ true }
                       selected={ isAllSelected }
                       anySelected={ false }
                       canSelect={ true }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
index 7a887fe60b318..114b7a4a2e21c 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.scss
@@ -22,6 +22,14 @@
   @include focus(true) {
     opacity: 1;
   }
+
+  :global(.ms-DetailsList--Compact) & {
+    height: 32px;
+  }
+
+  &.isHeader {
+    height: 32px;
+  }
 }
 
 .owner {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx
index f5bd1ed4c870e..4d2610476da2c 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx
@@ -11,6 +11,7 @@ const CheckStyles: any = CheckStylesModule;
 // tslint:enable:no-any
 
 export interface IDetailsRowCheckProps extends React.HTMLAttributes<HTMLElement> {
+  isHeader?: boolean;
   selected?: boolean;
   /**
    * Deprecated at v.65.1 and will be removed by v 1.0. Use 'selected' instead.
@@ -27,6 +28,8 @@ export const DetailsRowCheck = (props: IDetailsRowCheckProps) => {
     isSelected = false,
     anySelected = false,
     selected = false,
+    isHeader = false,
+    className,
     ...buttonProps
   } = props;
 
@@ -37,8 +40,9 @@ export const DetailsRowCheck = (props: IDetailsRowCheckProps) => {
       { ...buttonProps }
       role='checkbox'
       className={
-        css('ms-DetailsRow-check', DetailsRowCheckStyles.check, CheckStyles.checkHost, {
-          [`ms-DetailsRow-check--isDisabled ${DetailsRowCheckStyles.isDisabled}`]: !props.canSelect
+        css(className, 'ms-DetailsRow-check', DetailsRowCheckStyles.check, CheckStyles.checkHost, {
+          [`ms-DetailsRow-check--isDisabled ${DetailsRowCheckStyles.isDisabled}`]: !props.canSelect,
+          [`ms-DetailsRow-check--isHeader ${DetailsRowCheckStyles.isHeader}`]: props.isHeader
         })
       }
       aria-checked={ isPressed }

From 1004504eb5cdba55db7f17c6b8af90ef5471010e Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Mon, 23 Oct 2017 15:31:17 -0700
Subject: [PATCH 0913/1641] Theming: remove old semantic slots (#3166)

* remove outdated semantic variables

* change files
---
 ...o-removeOldSemantics_2017-10-19-21-53.json | 11 +++
 ...o-removeOldSemantics_2017-10-19-21-53.json | 11 +++
 .../src/common/_common.scss                   |  2 +-
 .../src/common/_focusBorder.scss              |  8 +-
 .../src/common/_semanticColorVariables.scss   | 96 -------------------
 .../src/common/_semanticSlots.scss            |  1 +
 .../src/components/Breadcrumb/Breadcrumb.scss | 12 +--
 .../components/ChoiceGroup/ChoiceGroup.scss   | 14 +--
 .../components/DetailsList/DetailsHeader.scss | 14 +--
 .../src/components/Dropdown/Dropdown.scss     |  2 +-
 .../components/GroupedList/GroupHeader.scss   |  6 +-
 .../List/examples/List.Basic.Example.scss     |  2 +-
 .../src/components/Nav/Nav.scss               | 24 ++---
 .../src/components/Rating/Rating.scss         |  2 +-
 .../SwatchColorPicker/SwatchColorPicker.scss  | 10 +-
 .../src/components/TextField/TextField.scss   | 12 +--
 .../styling/src/interfaces/ISemanticColors.ts |  4 +-
 17 files changed, 79 insertions(+), 152 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/phkuo-removeOldSemantics_2017-10-19-21-53.json
 create mode 100644 common/changes/office-ui-fabric-react/phkuo-removeOldSemantics_2017-10-19-21-53.json
 delete mode 100644 packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss

diff --git a/common/changes/@uifabric/styling/phkuo-removeOldSemantics_2017-10-19-21-53.json b/common/changes/@uifabric/styling/phkuo-removeOldSemantics_2017-10-19-21-53.json
new file mode 100644
index 0000000000000..8412e29b37a51
--- /dev/null
+++ b/common/changes/@uifabric/styling/phkuo-removeOldSemantics_2017-10-19-21-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "remove outdated semantic slots",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/phkuo-removeOldSemantics_2017-10-19-21-53.json b/common/changes/office-ui-fabric-react/phkuo-removeOldSemantics_2017-10-19-21-53.json
new file mode 100644
index 0000000000000..9f0978b48d019
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/phkuo-removeOldSemantics_2017-10-19-21-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "remove outdated semantic slots",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/common/_common.scss b/packages/office-ui-fabric-react/src/common/_common.scss
index ec398a744b116..47cdfab0b82c0 100644
--- a/packages/office-ui-fabric-react/src/common/_common.scss
+++ b/packages/office-ui-fabric-react/src/common/_common.scss
@@ -2,7 +2,7 @@
 @import './i18n';
 @import './themeOverrides';
 @import './focusBorder';
-@import './semanticColorVariables';
+@import './semanticSlots';
 @import './highContrast';
 
 // Screen sizes that align with UHF breakpoints for the website
diff --git a/packages/office-ui-fabric-react/src/common/_focusBorder.scss b/packages/office-ui-fabric-react/src/common/_focusBorder.scss
index f44de847ea45a..6fbe979ec0302 100644
--- a/packages/office-ui-fabric-react/src/common/_focusBorder.scss
+++ b/packages/office-ui-fabric-react/src/common/_focusBorder.scss
@@ -1,4 +1,4 @@
-@import './semanticColorVariables';
+@import './semanticSlots';
 
 @mixin focus-clear() {
   &::-moz-focus-inner {
@@ -23,7 +23,7 @@
   }
 }
 
-@mixin focus-border($padding: 0, $color: $focusedBorderColor, $thickness: 1px, $onFocus: true, $position: relative) {
+@mixin focus-border($padding: 0, $color: $focusBorderColor, $thickness: 1px, $onFocus: true, $position: relative) {
   @include focus-clear();
 
   & {
@@ -39,7 +39,7 @@
 }
 
 // When focus is set using the keyboard, apply an outline.
-@mixin after-outline ($padding: 0, $color: $focusedBorderColor, $thickness: 1px) {
+@mixin after-outline ($padding: 0, $color: $focusBorderColor, $thickness: 1px) {
     content: '';
     position: absolute;
     top: $padding;
@@ -58,6 +58,6 @@
 // When focus is set using the keyboard, apply an outline.
 @mixin focus-outline {
   :global(.ms-Fabric.is-focusVisible) &:focus {
-    outline: 1px solid $focusedBorderColor;
+    outline: 1px solid $focusBorderColor;
   }
 }
diff --git a/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss b/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
deleted file mode 100644
index 803a82ff1182c..0000000000000
--- a/packages/office-ui-fabric-react/src/common/_semanticColorVariables.scss
+++ /dev/null
@@ -1,96 +0,0 @@
-@import './themeOverrides';
-
-/* Don't use the variables in this file anymore! Instead use the ones from ./_semanticSlots.scss */
-
-$focusedBorderColor: $ms-color-neutralSecondary;
-
-$bodyBackgroundColor: $ms-color-white;
-$bodyForegroundColor: $ms-color-neutralPrimary;
-
-/* Primary item colors, used for Nav, DetailsList headers, Pivots */
-$unselectedBackgroundColor: $bodyBackgroundColor;
-$unselectedForegroundColor: $bodyForegroundColor;
-
-$disabledBackgroundColor: $bodyBackgroundColor;
-$disabledForegroundColor: $ms-color-neutralTertiaryAlt;
-
-$unselectedHoverBackgroundColor: $ms-color-neutralLighterAlt;
-$unselectedHoverForegroundColor: $bodyForegroundColor;
-
-$unselectedActiveBackgroundColor: $ms-color-neutralLight;
-$unselectedActiveForegroundColor: $bodyForegroundColor;
-
-$selectedBackgroundColor: $ms-color-neutralLighter;
-$selectedForegroundColor: $ms-color-neutralPrimary;
-
-$selectedHoverBackgroundColor: $ms-color-neutralLighter;
-$selectedHoverForegroundColor: $ms-color-neutralDark;
-
-$selectedActiveBackgroundColor: $ms-color-neutralTertiaryAlt;
-$selectedActiveForegroundColor: $ms-color-neutralPrimary;
-
-$dividerColor: $ms-color-neutralLight;
-
-// *** New semantic slots
-// todo: convert to theme tokens
-
-/*** BASIC ***/
-$bodyBackgroundColor: $ms-color-white;
-$bodyTextColor: $ms-color-neutralPrimary;
-$bodySubtextColor: $ms-color-neutralSecondary;
-
-$disabledBackgroundColor: $ms-color-neutralLighter;
-$disabledTextColor: $ms-color-neutralTertiaryAlt;
-$disabledSubtextColor: $ms-color-neutralQuaternary;
-
-$focusBorderColor: $ms-color-black;
-
-// $errorBackgroundColor: todo
-$errorTextColor: $ms-color-redDark;
-
-/*** Text fields ***/
-$fieldBackgroundColor: $ms-color-white;
-$fieldTextColor: $ms-color-neutralPrimary;
-
-$fieldBorderColor: $ms-color-neutralTertiary;
-$fieldBorderHoverColor: $ms-color-neutralDark;
-$fieldBorderFocusColor: $ms-color-themePrimary;
-
-$fieldPlaceholderColor: $ms-color-neutralTertiary;
-
-/*** State controls ***/
-$controlBackgroundColor: $ms-color-white;
-$controlBackgroundSelectedColor: $ms-color-themePrimary;
-$controlBackgroundSelectedHoverColor: $ms-color-themeDarkAlt;
-
-$controlForegroundColor: $ms-color-neutralPrimary;
-$controlForegroundHoverColor: $ms-color-black;
-$controlForegroundSelectedColor: $ms-color-white;
-
-$controlBorderUnselectedColor: $ms-color-neutralTertiary;
-$controlBorderUnselectedHoverColor: $ms-color-neutralPrimary;
-// $controlBorderSelectedColor: unused
-$controlBorderSelectedHoverColor: $ms-color-themePrimary;
-
-/*** Menus ***/
-$menuBackgroundColor: $ms-color-white;
-$menuBackgroundHoverColor: $ms-color-neutralLighter;
-$menuBackgroundSelectedColor: $ms-color-neutralLight;
-
-$menuTextColor: $ms-color-neutralPrimary;
-$menuTextSelectedColor: $ms-color-black;
-$menuTextDisabledColor: $ms-color-neutralTertiaryAlt;
-
-$menuIconColor: $ms-color-themeDarkAlt;
-
-$menuHeaderColor: $ms-color-themeDarkAlt;
-
-$menuDividerColor: $ms-color-neutralLight;
-
-/*** Lists ***/
-$listBackgroundColor: transparent;
-$listTextColor: $ms-color-neutralPrimary;
-
-$listItemHoverColor: $ms-color-neutralLighter;
-$listItemSelectedColor: $ms-color-neutralQuaternary;
-$listItemSelectedHoverColor: $ms-color-neutralQuaternaryAlt;
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/common/_semanticSlots.scss b/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
index cdb050eefea09..64813f104e932 100644
--- a/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
+++ b/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
@@ -1,6 +1,7 @@
 /* Base slots */
 $bodyBackgroundColor: "[theme:bodyBackground, default: #ffffff]";
 $bodyTextColor: "[theme:bodyText, default: #333333]";
+$bodySelectedTextColor: "[theme:bodySelectedText, default: #000000]";
 $bodySubtextColor: "[theme:bodySubtext, default: #666666]";
 $bodyDividerColor: "[theme:bodyDivider, default: #eaeaea]";
 
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss
index 50fd8f0538efc..9f059344b0339 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.scss
@@ -73,7 +73,7 @@ $Breadcrumb-chevron-sm: 8px;
   .item,
   .itemLink {
     @include ms-font-xl;
-    color: $ms-color-neutralPrimary;
+    color: $bodyTextColor;
     padding: 0 8px;
     max-width: $Breadcrumb-itemMaxWidth;
     white-space: nowrap;
@@ -98,8 +98,8 @@ $Breadcrumb-chevron-sm: 8px;
   }
 
   &:active {
-    background-color: $selectedActiveBackgroundColor;
-    color: $selectedActiveForegroundColor;
+    background-color: $ms-color-neutralTertiaryAlt;
+    color: $bodyTextColor;
   }
 
   &:active:hover {
@@ -115,7 +115,7 @@ $Breadcrumb-chevron-sm: 8px;
 
 .root .itemLink {
   &:hover {
-    background-color: $selectedHoverBackgroundColor;
+    background-color: $menuItemBackgroundHoveredColor;
     color: initial;
     cursor: pointer;
   }
@@ -126,8 +126,8 @@ $Breadcrumb-chevron-sm: 8px;
 
   &:active {
     outline: transparent;
-    background-color: $selectedActiveBackgroundColor;
-    color: $selectedActiveForegroundColor;
+    background-color: $ms-color-neutralTertiaryAlt;
+    color: $ms-color-neutralPrimary;
   }
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
index 58ec69439b4b2..5afa8785cbac8 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
@@ -7,17 +7,17 @@
 // --------------------------------------------------
 // ChoiceField semantic slots
 
-$radioButton-background-color: $controlBackgroundColor;
+$radioButton-background-color: $bodyBackgroundColor;
 
-$radioButton-text-color: $controlForegroundColor;
-$radioButton-text-hover-color: $controlForegroundHoverColor;
+$radioButton-text-color: $bodyTextColor;
+$radioButton-text-hover-color: $bodySelectedTextColor;
 
-$radioButton-dot-color: $controlBackgroundSelectedColor;
+$radioButton-dot-color: $inputBackgroundCheckedColor;
 
-$radioButton-border-color: $controlBorderUnselectedColor;
-$radioButton-border-hover-color: $controlBorderUnselectedHoverColor;
+$radioButton-border-color: $inputBorderColor;
+$radioButton-border-hover-color: $inputBorderHoveredColor;
 $radioButton-border-selected-color: $radioButton-dot-color;
-$radioButton-border-selected-hover-color: $controlBackgroundSelectedHoverColor;
+$radioButton-border-selected-hover-color: $inputBackgroundCheckedHoveredColor;
 
 $radioButton-text-disabled-color: $disabledTextColor;
 $radioButton-background-unselected-disabled-color: $disabledTextColor;
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
index 25c325b272852..1b2baea32e403 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
@@ -1,8 +1,8 @@
 @import '../../common/common';
 
-$iconForegroundColor: $ms-color-neutralSecondary;
-$headerForegroundColor: $ms-color-neutralPrimary;
-$headerBackgroundColor: $ms-color-white;
+$iconForegroundColor: $bodySubtextColor;
+$headerForegroundColor: $bodyTextColor;
+$headerBackgroundColor: $bodyBackgroundColor;
 $dropdownChevronForegroundColor: $ms-color-neutralTertiary;
 $rowHeight: 32px;
 $resizerColor: $ms-color-neutralTertiaryAlt;
@@ -19,7 +19,7 @@ $isPaddedMargin: 24px;
   line-height: $rowHeight;
   white-space: nowrap;
   padding-bottom: 1px;
-  border-bottom: 1px solid $dividerColor;
+  border-bottom: 1px solid $bodyDividerColor;
   cursor: default;
   user-select: none;
 
@@ -62,12 +62,12 @@ $isPaddedMargin: 24px;
   &.cellIsActionable {
 
     &:hover {
-      color: $ms-color-neutralPrimary;
-      background: $unselectedHoverBackgroundColor;
+      color: $bodyTextColor;
+      background: $bodyBackgroundColor;
     }
 
     &:active {
-      background: $unselectedActiveBackgroundColor;
+      background: $listItemBackgroundHoveredColor;
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
index ba79f379fe879..f3383692a7cc4 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
@@ -243,7 +243,7 @@ $DropDown-item-height: 32px;
 
 .divider {
   height: 1px;
-  background-color: $dividerColor;
+  background-color: $bodyDividerColor;
 }
 
 .optionText {
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss
index d98da3ae67c0d..d72267b6d0b46 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss
@@ -3,9 +3,9 @@
 $rowHeight: 40px;
 
 // component slots
-$detailsList-item-hover-color: $listItemHoverColor;
-$detailsList-item-selected-color: $listItemSelectedColor;
-$detailsList-item-selected-hover-color: $listItemSelectedHoverColor;
+$detailsList-item-hover-color: $listItemBackgroundHoveredColor;
+$detailsList-item-selected-color: $listItemBackgroundCheckedColor;
+$detailsList-item-selected-hover-color: $listItemBackgroundCheckedHoveredColor;
 
 $groupHeader-ease-out-circ: cubic-bezier(0.075, 0.820, 0.165, 1.000);
 $groupHeader-ease-out-sine: cubic-bezier(0.390, 0.575, 0.565, 1.000);
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.scss b/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.scss
index 4fc7083ed1e94..65bbe32ac6010 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.scss
@@ -7,7 +7,7 @@
     min-height: 54px;
     padding: 10px;
     box-sizing: border-box;
-    border-bottom: 1px solid $dividerColor;
+    border-bottom: 1px solid $bodyDividerColor;
     display: flex;
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.scss b/packages/office-ui-fabric-react/src/components/Nav/Nav.scss
index cb4fab8ffd07a..8095e4a0383ee 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.scss
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.scss
@@ -35,8 +35,8 @@ $linkRightPadding: 20px;
 
 .icon {
   padding: 0px;
-  color: $selectedForegroundColor;
-  background: $selectedBackgroundColor;
+  color: $ms-color-neutralPrimary;
+  background: $ms-color-neutralLighter;
   transition: transform .1s linear;
 }
 
@@ -63,22 +63,22 @@ $linkRightPadding: 20px;
 
   cursor: pointer;
 
-  color: $unselectedForegroundColor;
-  background: $unselectedBackgroundColor;
+  color: $bodyTextColor;
+  background: $bodyBackgroundColor;
 
   &:visited {
     color: inherit;
   }
 
   &:hover {
-    color: $unselectedHoverForegroundColor;
-    background: $unselectedHoverBackgroundColor;
+    color: $bodyTextColor;
+    background: $ms-color-neutralLighterAlt;
   }
 
   &.chevronButtonIsGroup {
     width: 100%;
     height: $navnode-height;
-    border-bottom: 1px solid $dividerColor;
+    border-bottom: 1px solid $bodyDividerColor;
   }
 }
 
@@ -121,15 +121,15 @@ $linkRightPadding: 20px;
     }
   }
 
-  color: $unselectedForegroundColor;
-  background: $unselectedBackgroundColor;
+  color: $bodyTextColor;
+  background: $bodyBackgroundColor;
 
   &:hover {
 
     & .link,
     & .chevronButton {
-      background: $unselectedHoverBackgroundColor;
-      color: $unselectedHoverForegroundColor;
+      background: $ms-color-neutralLighterAlt;
+      color: $bodyTextColor;
     }
   }
 
@@ -144,7 +144,7 @@ $linkRightPadding: 20px;
     & .chevronButton {
 
       color: $ms-color-themePrimary;
-      background: $selectedBackgroundColor;
+      background: $ms-color-neutralLighter;
 
       &:after {
         @include border-left(2px, solid, $ms-color-themePrimary);
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.scss b/packages/office-ui-fabric-react/src/components/Rating/Rating.scss
index 6404a1304a267..f9a11d03d16ee 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.scss
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.scss
@@ -114,5 +114,5 @@ $Rating-largeIconSize: 20px;
 
 // Highlight focused star
 :global(.ms-Fabric.is-focusVisible) .starIsInFocus .label {
-  border: 1px solid $focusedBorderColor;
+  border: 1px solid $focusBorderColor;
 }
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
index 1e58d7053931d..0a699f439a72f 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
@@ -22,7 +22,7 @@
   @include ms-font-m;
   @include focus-border();
   @include text-align(left);
-  color: $menuTextColor;
+  color: $bodyTextColor;
   position: relative;
   box-sizing: border-box;
   border: none;
@@ -38,17 +38,17 @@
   white-space: nowrap;
 
   &:hover:not([disabled]) {
-    background: $menuBackgroundHoverColor;
+    background: $menuItemBackgroundHoveredColor;
   }
   &.disabled,
   &[disabled] {
-    color: $menuTextDisabledColor;
+    color: $disabledTextColor;
     cursor: default;
     pointer-events: none;
   }
 
   :global(.is-focusVisible) &:focus {
-    background: $menuBackgroundHoverColor;
+    background: $menuItemBackgroundHoveredColor;
   }
 }
 
@@ -112,7 +112,7 @@
 
     &.disabled,
   &[disabled] {
-    color: $menuTextDisabledColor;
+    color: $disabledTextColor;
     cursor: default;
     pointer-events: none;
     opacity: .3;
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index a3a5602d5a36f..72e25b1035fe0 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -9,19 +9,19 @@
 @import '../Label/LabelMixins.scss';
 
 // component slots
-$field-background-color: $fieldBackgroundColor;
+$field-background-color: $bodyBackgroundColor;
 $field-background-disabled-color: $disabledBackgroundColor;
 
-$field-border-color: $fieldBorderColor;
+$field-border-color: $inputBorderColor;
 $field-border-disabled-color: $disabledBackgroundColor;
-$field-border-hover-color: $fieldBorderHoverColor;
-$field-border-focus-color: $fieldBorderFocusColor;
+$field-border-hover-color: $inputBorderHoveredColor;
+$field-border-focus-color: $inputFocusBorderAltColor;
 $field-border-error-color: $errorTextColor;
 
-$field-text-color: $fieldTextColor;
+$field-text-color: $bodyTextColor;
 $field-text-disabled-color: $disabledTextColor;
 
-$field-placeholder-color: $fieldPlaceholderColor;
+$field-placeholder-color: $bodySubtextColor;
 $field-placeholder-disabled-color: $disabledSubtextColor;
 
 $field-description-color: $bodySubtextColor;
diff --git a/packages/styling/src/interfaces/ISemanticColors.ts b/packages/styling/src/interfaces/ISemanticColors.ts
index 5b58ea761f965..2d6bff3d563a1 100644
--- a/packages/styling/src/interfaces/ISemanticColors.ts
+++ b/packages/styling/src/interfaces/ISemanticColors.ts
@@ -43,7 +43,7 @@
  * This category covers all kinds of lists, whether they're typical one-item-per-row lists (like DetailsList) or ones with a tiled layout.
  */
 export interface ISemanticColors {
-  /* ANY ADDITIONS/REMOVALS HERE MUST ALSO BE MADE TO \packages\styling\src\utilities\theme.ts:_makeSemanticColorsFromPalette() */
+  /* ANY ADDITIONS/REMOVALS HERE MUST ALSO BE MADE TO \packages\office-ui-fabric-react\src\common\_semanticSlots.scss */
 
   //// Base slots
 
@@ -58,7 +58,7 @@ export interface ISemanticColors {
   bodyText: string;
 
   /**
-   * The default text color for a selected menu item title.
+   * Selected text color, e.g. selected menu item text.
    */
   bodySelectedText: string;
 

From 4b8464a807641ae9f33703ccdb7fb34dad22bc37 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Mon, 23 Oct 2017 15:47:35 -0700
Subject: [PATCH 0914/1641] Switch to .svg files for FolderCover images (#3198)

* Switch to .svg files for FolderCover images

* Update change output
---
 .../folder-covers_2017-10-23-16-25.json       | 11 ++++++++
 .../components/FolderCover/FolderCover.scss   | 16 +++---------
 .../components/FolderCover/FolderCover.tsx    | 26 ++++++-------------
 3 files changed, 23 insertions(+), 30 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/folder-covers_2017-10-23-16-25.json

diff --git a/common/changes/@uifabric/experiments/folder-covers_2017-10-23-16-25.json b/common/changes/@uifabric/experiments/folder-covers_2017-10-23-16-25.json
new file mode 100644
index 0000000000000..48e27cc71ad4c
--- /dev/null
+++ b/common/changes/@uifabric/experiments/folder-covers_2017-10-23-16-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Switch to .svg files for FolderCover images",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.scss b/packages/experiments/src/components/FolderCover/FolderCover.scss
index c19ea5e0c0ec0..81bb2bf2279fe 100644
--- a/packages/experiments/src/components/FolderCover/FolderCover.scss
+++ b/packages/experiments/src/components/FolderCover/FolderCover.scss
@@ -20,7 +20,7 @@
   }
 }
 
-.shadow {
+.front {
   display: block;
   position: absolute;
   left: -3px;
@@ -28,20 +28,12 @@
   bottom: -4px;
 }
 
-.front {
-  display: block;
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-}
-
 .back {
   display: block;
   position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
+  left: -3px;
+  right: -3px;
+  bottom: -4px;
 }
 
 .content {
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.tsx b/packages/experiments/src/components/FolderCover/FolderCover.tsx
index c422d564cf60f..4e83260781684 100644
--- a/packages/experiments/src/components/FolderCover/FolderCover.tsx
+++ b/packages/experiments/src/components/FolderCover/FolderCover.tsx
@@ -40,7 +40,6 @@ const SIZES: {
 const ASSETS: {
   [P in FolderCoverSize]: {
     [T in FolderCoverType]: {
-      shadow: string;
       back: string;
       front: string;
     };
@@ -48,26 +47,22 @@ const ASSETS: {
 } = {
     small: {
       default: {
-        shadow: `${ASSET_CDN_BASE_URL}/foldericons/72x52_shadow_empty.png`,
-        back: `${ASSET_CDN_BASE_URL}/foldericons/s-ldefaultback.png`,
-        front: `${ASSET_CDN_BASE_URL}/foldericons/s-ldefaultfront.png`
+        back: `${ASSET_CDN_BASE_URL}/foldericons/folder-small_backplate.svg`,
+        front: `${ASSET_CDN_BASE_URL}/foldericons/folder-small_frontplate_thumbnail.svg` // Yes, it's mis-named.
       },
       media: {
-        shadow: `${ASSET_CDN_BASE_URL}/foldericons/72x52_shadow_empty.png`,
-        back: `${ASSET_CDN_BASE_URL}/foldericons/s-lphotoback.png`,
-        front: `${ASSET_CDN_BASE_URL}/foldericons/s-lphotosfront.png`
+        back: `${ASSET_CDN_BASE_URL}/foldericons/folder-small_backplate.svg`,
+        front: `${ASSET_CDN_BASE_URL}/foldericons//folder-small_frontplate_nopreview.svg` // Yes, it's mis-named
       }
     },
     large: {
       default: {
-        shadow: `${ASSET_CDN_BASE_URL}/foldericons/112x80_shadow_empty.png`,
-        back: `${ASSET_CDN_BASE_URL}/foldericons/xxxxl-xldefaultback.png`,
-        front: `${ASSET_CDN_BASE_URL}/foldericons/xxxxl-xldefaultfront.png`
+        back: `${ASSET_CDN_BASE_URL}/foldericons/folder-large_backplate.svg`,
+        front: `${ASSET_CDN_BASE_URL}/foldericons/folder-large_frontplate_nopreview.svg`
       },
       media: {
-        shadow: `${ASSET_CDN_BASE_URL}/foldericons/112x80_shadow_empty.png`,
-        back: `${ASSET_CDN_BASE_URL}/foldericons/xxxxl-xlphotoback.png`,
-        front: `${ASSET_CDN_BASE_URL}/foldericons/xxxxl-xlphotofront.png`
+        back: `${ASSET_CDN_BASE_URL}/foldericons/folder-large_backplate.svg`,
+        front: `${ASSET_CDN_BASE_URL}/foldericons//folder-large_frontplate_thumbnail.svg`
       }
     }
   };
@@ -95,11 +90,6 @@ export class FolderCover extends React.Component<IFolderCoverProps, IFolderCover
           [`ms-FolderCover--hideContent ${FolderCoverStyles.hideContent}`]: hideContent
         }) }
       >
-        <img
-          aria-hidden={ true }
-          className={ css('ms-FolderCover-shadow', FolderCoverStyles.shadow) }
-          src={ assets.shadow }
-        />
         <img
           aria-hidden={ true }
           className={ css('ms-FolderCover-back', FolderCoverStyles.back) }

From 751fcb25bb51bac1dcd44249a764a666570102a1 Mon Sep 17 00:00:00 2001
From: Joe Martella <martellaj@live.com>
Date: Mon, 23 Oct 2017 17:12:16 -0700
Subject: [PATCH 0915/1641] [BaseAutoFill] Adds onInputChange prop (#3163)

* Adds "onInputChanged" prop to BasePicker

* Adds change files

* Moves "onInputChange" to BaseAutoFill component
---
 ...Picker-sanitize-input_2017-10-19-17-53.json | 11 +++++++++++
 ...Picker-sanitize-input_2017-10-19-17-53.json | 11 +++++++++++
 ...Picker-sanitize-input_2017-10-19-17-53.json | 11 +++++++++++
 ...Picker-sanitize-input_2017-10-19-17-53.json | 11 +++++++++++
 ...Picker-sanitize-input_2017-10-19-17-53.json | 11 +++++++++++
 ...Picker-sanitize-input_2017-10-19-17-53.json | 11 +++++++++++
 ...Picker-sanitize-input_2017-10-19-17-53.json | 11 +++++++++++
 ...Picker-sanitize-input_2017-10-19-17-53.json | 11 +++++++++++
 ...Picker-sanitize-input_2017-10-19-17-53.json | 11 +++++++++++
 .../pickers/AutoFill/BaseAutoFill.Props.ts     |  5 +++++
 .../pickers/AutoFill/BaseAutoFill.tsx          |  5 +++--
 .../src/components/pickers/BasePicker.Props.ts |  4 ++++
 .../src/components/pickers/BasePicker.tsx      |  1 +
 .../examples/PeoplePicker.Types.Example.tsx    | 18 ++++++++++++++++++
 14 files changed, 130 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
 create mode 100644 common/changes/@uifabric/experiments/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
 create mode 100644 common/changes/@uifabric/fabric-website/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
 create mode 100644 common/changes/@uifabric/icons/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
 create mode 100644 common/changes/@uifabric/jest-serializer-merge-styles/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
 create mode 100644 common/changes/@uifabric/merge-styles/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
 create mode 100644 common/changes/@uifabric/styling/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
 create mode 100644 common/changes/@uifabric/utilities/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
 create mode 100644 common/changes/office-ui-fabric-react/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json

diff --git a/common/changes/@uifabric/example-app-base/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json b/common/changes/@uifabric/example-app-base/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
new file mode 100644
index 0000000000000..db89bebafd713
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "joem@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json b/common/changes/@uifabric/experiments/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
new file mode 100644
index 0000000000000..7e01c0faf4fc8
--- /dev/null
+++ b/common/changes/@uifabric/experiments/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/experiments",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "joem@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json b/common/changes/@uifabric/fabric-website/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
new file mode 100644
index 0000000000000..be9847f74d2a6
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "joem@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json b/common/changes/@uifabric/icons/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
new file mode 100644
index 0000000000000..f3446e0987bec
--- /dev/null
+++ b/common/changes/@uifabric/icons/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/icons",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/icons",
+  "email": "joem@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/jest-serializer-merge-styles/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json b/common/changes/@uifabric/jest-serializer-merge-styles/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
new file mode 100644
index 0000000000000..3b9aee34792bb
--- /dev/null
+++ b/common/changes/@uifabric/jest-serializer-merge-styles/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/jest-serializer-merge-styles",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/jest-serializer-merge-styles",
+  "email": "joem@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json b/common/changes/@uifabric/merge-styles/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
new file mode 100644
index 0000000000000..020ecb0b78a35
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/merge-styles",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "joem@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json b/common/changes/@uifabric/styling/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
new file mode 100644
index 0000000000000..ad08fc23dbb50
--- /dev/null
+++ b/common/changes/@uifabric/styling/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "joem@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json b/common/changes/@uifabric/utilities/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
new file mode 100644
index 0000000000000..44aabc466118d
--- /dev/null
+++ b/common/changes/@uifabric/utilities/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "joem@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json b/common/changes/office-ui-fabric-react/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
new file mode 100644
index 0000000000000..355e3b5a8a778
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Adds \"onInputChanged\" prop to BasePicker",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joem@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts
index 132909e814204..80fdb4d2f021b 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts
@@ -51,6 +51,7 @@ export interface IBaseAutoFillProps extends
    * The suggested autofill value that will display.
    */
   suggestedDisplayValue?: string;
+
   /**
    * A callback for when the current input value changes.
    */
@@ -88,4 +89,8 @@ export interface IBaseAutoFillProps extends
    */
   shouldSelectFullInputValueInComponentDidUpdate?: () => boolean;
 
+  /**
+   * A callback used to modify the input string.
+   */
+  onInputChange?: (value: string) => string;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
index b27ea3b7356b9..5caac9d330d8a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
@@ -193,8 +193,9 @@ export class BaseAutoFill extends BaseComponent<IBaseAutoFillProps, IBaseAutoFil
     }
   }
 
+  @autobind
   private _updateValue(newValue: string) {
-    this._value = newValue;
+    this._value = this.props.onInputChange ? this.props.onInputChange(newValue) : newValue;
     let displayValue = newValue;
     if (this.props.suggestedDisplayValue &&
       this._doesTextStartWith(this.props.suggestedDisplayValue, displayValue)
@@ -203,7 +204,7 @@ export class BaseAutoFill extends BaseComponent<IBaseAutoFillProps, IBaseAutoFil
     }
     this.setState({
       displayValue: newValue
-    }, () => this._notifyInputChange(newValue));
+    }, () => this._notifyInputChange(this._value));
   }
 
   private _doesTextStartWith(text: string, startWith: string) {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
index f1ef12c4a3cb0..d8a18da3bad53 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
@@ -116,6 +116,10 @@ export interface IBasePickerProps<T> extends React.Props<any> {
    * The items that the base picker should currently display as selected. If this is provided then the picker will act as a controlled component.
    */
   selectedItems?: T[];
+  /**
+   * A callback used to modify the input string.
+   */
+  onInputChange?: (input: string) => string;
 }
 
 export interface IBasePickerSuggestionsProps {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index db6111975fef4..e314dd200d10e 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -180,6 +180,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
                 role='combobox'
                 disabled={ disabled }
                 aria-controls='selected-suggestion-alert'
+                onInputChange={ this.props.onInputChange }
               />) }
             </div>
           </SelectionZone>
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index 9ccfbce15e1a7..51d6baf3e5d51 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -173,6 +173,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
           'aria-label': 'People Picker'
         } }
         componentRef={ this._resolveRef('_picker') }
+        onInputChange={ this._onInputChange }
       />
     );
   }
@@ -433,4 +434,21 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     }
   }
 
+  /**
+   * Takes in the picker input and modifies it in whichever way
+   * the caller wants, i.e. parsing entries copied from Outlook (sample
+   * input: "Aaron Reid <aaron>").
+   *
+   * @param input The text entered into the picker.
+   */
+  private _onInputChange(input: string): string {
+    const outlookRegEx = /<.*>/g;
+    const emailAddress = outlookRegEx.exec(input);
+
+    if (emailAddress && emailAddress[0]) {
+      return emailAddress[0].substring(1, emailAddress[0].length - 1);
+    }
+
+    return input;
+  }
 }

From ea31239988130fe5750af706893dc3676b0cce06 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 23 Oct 2017 17:17:59 -0700
Subject: [PATCH 0916/1641] Adding stroke css property to typings (#3204)

* Stroke

* change file
---
 .../merge-styles/stroke_2017-10-23-23-19.json         | 11 +++++++++++
 packages/merge-styles/src/IRawStyleBase.ts            |  6 ++++++
 2 files changed, 17 insertions(+)
 create mode 100644 common/changes/@uifabric/merge-styles/stroke_2017-10-23-23-19.json

diff --git a/common/changes/@uifabric/merge-styles/stroke_2017-10-23-23-19.json b/common/changes/@uifabric/merge-styles/stroke_2017-10-23-23-19.json
new file mode 100644
index 0000000000000..a47b858f3513c
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/stroke_2017-10-23-23-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "Adding `stroke` css property to typings.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/merge-styles/src/IRawStyleBase.ts b/packages/merge-styles/src/IRawStyleBase.ts
index 3e1eaf6180a89..7eec66334a749 100644
--- a/packages/merge-styles/src/IRawStyleBase.ts
+++ b/packages/merge-styles/src/IRawStyleBase.ts
@@ -1365,6 +1365,12 @@ export interface IRawStyleBase extends IRawFontStyle {
    */
   speakAs?: ICSSRule | string;
 
+  /**
+   * The stroke property in CSS is for adding a border to SVG shapes.
+   * See SVG 1.1 https://www.w3.org/TR/SVG/painting.html#Stroke
+   */
+  stroke?: ICSSRule | string;
+
   /**
    * SVG: Specifies the opacity of the outline on the current object.
    * See SVG 1.1 https://www.w3.org/TR/SVG/painting.html#StrokeOpacityProperty

From 6fc8b90efd2d0edc978167c1bfd1d6d3c2e7f64c Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 23 Oct 2017 18:31:47 -0700
Subject: [PATCH 0917/1641] Layer: Allow default host to be configurable
 (#3207)

* Exposing a method to set the default target for layers.

* Adding change file.

* Adding documentation.
---
 .../layer-defaulthost_2017-10-24-00-43.json       | 11 +++++++++++
 .../src/components/Layer/Layer.tsx                | 15 ++++++++++++++-
 2 files changed, 25 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/layer-defaulthost_2017-10-24-00-43.json

diff --git a/common/changes/office-ui-fabric-react/layer-defaulthost_2017-10-24-00-43.json b/common/changes/office-ui-fabric-react/layer-defaulthost_2017-10-24-00-43.json
new file mode 100644
index 0000000000000..c94597e1bc386
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/layer-defaulthost_2017-10-24-00-43.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Layer: exposing `setDefaultTarget(selector)` static method to set a default target element where layered content should render by default.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx b/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx
index 9d82019ab6bfe..546e444787e22 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx
@@ -10,6 +10,7 @@ import * as stylesImport from './Layer.scss';
 const styles: any = stylesImport;
 
 let _layersByHostId: { [hostId: string]: Layer[] } = {};
+let _defaultHostSelector: string | undefined;
 
 export class Layer extends BaseComponent<ILayerProps, {}> {
 
@@ -32,6 +33,18 @@ export class Layer extends BaseComponent<ILayerProps, {}> {
     }
   }
 
+  /**
+   * Sets the default target selector to use when determining the host in which
+   * Layered content will be injected into. If not provided, an element will be
+   * created at the end of the document body.
+   *
+   * Passing in a falsey value will clear the default target and reset back to
+   * using a created element at the end of document body.
+   */
+  public static setDefaultTarget(selector?: string) {
+    _defaultHostSelector = selector;
+  }
+
   constructor(props: ILayerProps) {
     super(props);
 
@@ -139,7 +152,7 @@ export class Layer extends BaseComponent<ILayerProps, {}> {
     if (hostId) {
       return doc.getElementById(hostId) as Node;
     } else {
-      return doc.body;
+      return _defaultHostSelector ? doc.querySelector(_defaultHostSelector) as Node : doc.body;
     }
   }
 

From 7afdbc5702090bfc6fa12da69188ea48385a179b Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 24 Oct 2017 10:21:08 +0000
Subject: [PATCH 0918/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 19 +++++++
 apps/fabric-website/CHANGELOG.md              |  9 ++-
 apps/fabric-website/package.json              |  4 +-
 ...icker-sanitize-input_2017-10-19-17-53.json | 11 ----
 .../folder-covers_2017-10-23-16-25.json       | 11 ----
 ...icker-sanitize-input_2017-10-19-17-53.json | 11 ----
 ...icker-sanitize-input_2017-10-19-17-53.json | 11 ----
 ...remove-header-footer_2017-10-20-21-14.json | 11 ----
 ...icker-sanitize-input_2017-10-19-17-53.json | 11 ----
 .../jest-docs_2017-10-20-18-25.json           | 11 ----
 ...icker-sanitize-input_2017-10-19-17-53.json | 11 ----
 ...icker-sanitize-input_2017-10-19-17-53.json | 11 ----
 .../merge-styles/stroke_2017-10-23-23-19.json | 11 ----
 ...icker-sanitize-input_2017-10-19-17-53.json | 11 ----
 ...o-removeOldSemantics_2017-10-19-21-53.json | 11 ----
 ...icker-sanitize-input_2017-10-19-17-53.json | 11 ----
 ...o-box-label-disabled_2017-10-23-20-57.json | 11 ----
 ...icker-sanitize-input_2017-10-19-17-53.json | 11 ----
 .../layer-defaulthost_2017-10-24-00-43.json   | 11 ----
 .../master_2017-10-20-20-08.json              | 11 ----
 .../nav-fix-onrender_2017-10-23-17-54.json    | 11 ----
 ...o-removeOldSemantics_2017-10-19-21-53.json | 11 ----
 .../select-all_2017-10-20-23-01.json          | 11 ----
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/CHANGELOG.json           | 22 +++++++
 packages/experiments/CHANGELOG.md             |  9 ++-
 packages/experiments/package.json             |  6 +-
 packages/icons/package.json                   |  2 +-
 .../CHANGELOG.json                            | 19 +++++++
 .../jest-serializer-merge-styles/CHANGELOG.md |  9 ++-
 .../jest-serializer-merge-styles/package.json |  4 +-
 packages/merge-styles/CHANGELOG.json          | 14 +++++
 packages/merge-styles/CHANGELOG.md            |  9 ++-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 57 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 18 +++++-
 packages/office-ui-fabric-react/package.json  |  8 +--
 packages/styling/CHANGELOG.json               | 19 +++++++
 packages/styling/CHANGELOG.md                 |  9 ++-
 packages/styling/package.json                 |  4 +-
 scripts/package.json                          |  2 +-
 41 files changed, 224 insertions(+), 243 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
 delete mode 100644 common/changes/@uifabric/experiments/folder-covers_2017-10-23-16-25.json
 delete mode 100644 common/changes/@uifabric/experiments/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
 delete mode 100644 common/changes/@uifabric/fabric-website/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
 delete mode 100644 common/changes/@uifabric/fabric-website/remove-header-footer_2017-10-20-21-14.json
 delete mode 100644 common/changes/@uifabric/icons/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
 delete mode 100644 common/changes/@uifabric/jest-serializer-merge-styles/jest-docs_2017-10-20-18-25.json
 delete mode 100644 common/changes/@uifabric/jest-serializer-merge-styles/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
 delete mode 100644 common/changes/@uifabric/merge-styles/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
 delete mode 100644 common/changes/@uifabric/merge-styles/stroke_2017-10-23-23-19.json
 delete mode 100644 common/changes/@uifabric/styling/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
 delete mode 100644 common/changes/@uifabric/styling/phkuo-removeOldSemantics_2017-10-19-21-53.json
 delete mode 100644 common/changes/@uifabric/utilities/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
 delete mode 100644 common/changes/office-ui-fabric-react/combo-box-label-disabled_2017-10-23-20-57.json
 delete mode 100644 common/changes/office-ui-fabric-react/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
 delete mode 100644 common/changes/office-ui-fabric-react/layer-defaulthost_2017-10-24-00-43.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2017-10-20-20-08.json
 delete mode 100644 common/changes/office-ui-fabric-react/nav-fix-onrender_2017-10-23-17-54.json
 delete mode 100644 common/changes/office-ui-fabric-react/phkuo-removeOldSemantics_2017-10-19-21-53.json
 delete mode 100644 common/changes/office-ui-fabric-react/select-all_2017-10-20-23-01.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index f5b831223f370..ba6e1f3de4f12 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.0.13",
+      "tag": "@uifabric/fabric-website_v5.0.13",
+      "date": "Tue, 24 Oct 2017 10:21:08 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "6431ff07746eee3c7a919fd7b701ba88c55a2928",
+            "comment": "Removed Header component - it was replaced with UHF"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.12.0 <6.0.0` to `>=5.13.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.12",
       "tag": "@uifabric/fabric-website_v5.0.12",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 0bcee467e659e..9ba3488e52726 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Wed, 18 Oct 2017 10:21:25 GMT and should not be manually modified.
+This log was last generated on Tue, 24 Oct 2017 10:21:08 GMT and should not be manually modified.
+
+## 5.0.13
+Tue, 24 Oct 2017 10:21:08 GMT
+
+### Patches
+
+- Removed Header component - it was replaced with UHF
 
 ## 5.0.12
 Wed, 18 Oct 2017 10:21:25 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 86c0d55ac19ba..d04a1e5c635b4 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.0.12",
+  "version": "5.0.13",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.12.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.13.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json b/common/changes/@uifabric/example-app-base/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
deleted file mode 100644
index db89bebafd713..0000000000000
--- a/common/changes/@uifabric/example-app-base/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "joem@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/folder-covers_2017-10-23-16-25.json b/common/changes/@uifabric/experiments/folder-covers_2017-10-23-16-25.json
deleted file mode 100644
index 48e27cc71ad4c..0000000000000
--- a/common/changes/@uifabric/experiments/folder-covers_2017-10-23-16-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Switch to .svg files for FolderCover images",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json b/common/changes/@uifabric/experiments/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
deleted file mode 100644
index 7e01c0faf4fc8..0000000000000
--- a/common/changes/@uifabric/experiments/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/experiments",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "joem@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json b/common/changes/@uifabric/fabric-website/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
deleted file mode 100644
index be9847f74d2a6..0000000000000
--- a/common/changes/@uifabric/fabric-website/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "joem@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/remove-header-footer_2017-10-20-21-14.json b/common/changes/@uifabric/fabric-website/remove-header-footer_2017-10-20-21-14.json
deleted file mode 100644
index d69ac136fab9d..0000000000000
--- a/common/changes/@uifabric/fabric-website/remove-header-footer_2017-10-20-21-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Removed Header component - it was replaced with UHF",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json b/common/changes/@uifabric/icons/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
deleted file mode 100644
index f3446e0987bec..0000000000000
--- a/common/changes/@uifabric/icons/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/icons",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/icons",
-  "email": "joem@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/jest-serializer-merge-styles/jest-docs_2017-10-20-18-25.json b/common/changes/@uifabric/jest-serializer-merge-styles/jest-docs_2017-10-20-18-25.json
deleted file mode 100644
index 8b3b8a585dd01..0000000000000
--- a/common/changes/@uifabric/jest-serializer-merge-styles/jest-docs_2017-10-20-18-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/jest-serializer-merge-styles",
-      "comment": "Updated jest docs",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/jest-serializer-merge-styles",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/jest-serializer-merge-styles/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json b/common/changes/@uifabric/jest-serializer-merge-styles/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
deleted file mode 100644
index 3b9aee34792bb..0000000000000
--- a/common/changes/@uifabric/jest-serializer-merge-styles/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/jest-serializer-merge-styles",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/jest-serializer-merge-styles",
-  "email": "joem@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json b/common/changes/@uifabric/merge-styles/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
deleted file mode 100644
index 020ecb0b78a35..0000000000000
--- a/common/changes/@uifabric/merge-styles/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/merge-styles",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "joem@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/stroke_2017-10-23-23-19.json b/common/changes/@uifabric/merge-styles/stroke_2017-10-23-23-19.json
deleted file mode 100644
index a47b858f3513c..0000000000000
--- a/common/changes/@uifabric/merge-styles/stroke_2017-10-23-23-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "Adding `stroke` css property to typings.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json b/common/changes/@uifabric/styling/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
deleted file mode 100644
index ad08fc23dbb50..0000000000000
--- a/common/changes/@uifabric/styling/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "joem@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/phkuo-removeOldSemantics_2017-10-19-21-53.json b/common/changes/@uifabric/styling/phkuo-removeOldSemantics_2017-10-19-21-53.json
deleted file mode 100644
index 8412e29b37a51..0000000000000
--- a/common/changes/@uifabric/styling/phkuo-removeOldSemantics_2017-10-19-21-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "remove outdated semantic slots",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json b/common/changes/@uifabric/utilities/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
deleted file mode 100644
index 44aabc466118d..0000000000000
--- a/common/changes/@uifabric/utilities/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "joem@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/combo-box-label-disabled_2017-10-23-20-57.json b/common/changes/office-ui-fabric-react/combo-box-label-disabled_2017-10-23-20-57.json
deleted file mode 100644
index 08513ef6b868e..0000000000000
--- a/common/changes/office-ui-fabric-react/combo-box-label-disabled_2017-10-23-20-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Add support for custom styling of the label in the disabled state",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "<christianjordangonzalez@gmail.com>"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json b/common/changes/office-ui-fabric-react/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
deleted file mode 100644
index 355e3b5a8a778..0000000000000
--- a/common/changes/office-ui-fabric-react/joem-peoplePicker-sanitize-input_2017-10-19-17-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Adds \"onInputChanged\" prop to BasePicker",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joem@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/layer-defaulthost_2017-10-24-00-43.json b/common/changes/office-ui-fabric-react/layer-defaulthost_2017-10-24-00-43.json
deleted file mode 100644
index c94597e1bc386..0000000000000
--- a/common/changes/office-ui-fabric-react/layer-defaulthost_2017-10-24-00-43.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Layer: exposing `setDefaultTarget(selector)` static method to set a default target element where layered content should render by default.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2017-10-20-20-08.json b/common/changes/office-ui-fabric-react/master_2017-10-20-20-08.json
deleted file mode 100644
index 48e4c7400c993..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2017-10-20-20-08.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dialog: Don't add empty spans to footer for falsy children of DialogFooter",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/nav-fix-onrender_2017-10-23-17-54.json b/common/changes/office-ui-fabric-react/nav-fix-onrender_2017-10-23-17-54.json
deleted file mode 100644
index 30be27100ad91..0000000000000
--- a/common/changes/office-ui-fabric-react/nav-fix-onrender_2017-10-23-17-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Nav: Add onRenderLink back to JSX to allow custom rendering of links",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "a.erich@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/phkuo-removeOldSemantics_2017-10-19-21-53.json b/common/changes/office-ui-fabric-react/phkuo-removeOldSemantics_2017-10-19-21-53.json
deleted file mode 100644
index 9f0978b48d019..0000000000000
--- a/common/changes/office-ui-fabric-react/phkuo-removeOldSemantics_2017-10-19-21-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "remove outdated semantic slots",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/select-all_2017-10-20-23-01.json b/common/changes/office-ui-fabric-react/select-all_2017-10-20-23-01.json
deleted file mode 100644
index 0e94c70a532e3..0000000000000
--- a/common/changes/office-ui-fabric-react/select-all_2017-10-20-23-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Ensure that Select All checkbox can still be focused",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 772c9dc1d1918..b599fc2c191fc 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -38,7 +38,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.4.0 <6.0.0",
+    "@uifabric/styling": ">=5.4.1 <6.0.0",
     "@uifabric/utilities": ">=5.3.0 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 57fd4585471b9..32df0586245bc 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.3.1",
+      "tag": "@uifabric/experiments_v5.3.1",
+      "date": "Tue, 24 Oct 2017 10:21:08 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "4b8464a807641ae9f33703ccdb7fb34dad22bc37",
+            "comment": "Switch to .svg files for FolderCover images"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.12.0 <6.0.0` to `>=5.13.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/jest-serializer-merge-styles\" from `>=5.0.0 <6.0.0` to `>=5.0.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.3.0",
       "tag": "@uifabric/experiments_v5.3.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index e44ab040c95bc..5378d0c500adf 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Fri, 20 Oct 2017 18:42:08 GMT and should not be manually modified.
+This log was last generated on Tue, 24 Oct 2017 10:21:08 GMT and should not be manually modified.
+
+## 5.3.1
+Tue, 24 Oct 2017 10:21:08 GMT
+
+### Patches
+
+- Switch to .svg files for FolderCover images
 
 ## 5.3.0
 Fri, 20 Oct 2017 18:42:08 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index a86165b73e43e..61f86e0260d04 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.3.0",
+  "version": "5.3.1",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -30,7 +30,7 @@
     "@types/webpack-env": "1.13.0",
     "@uifabric/example-app-base": ">=5.1.1 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "@uifabric/jest-serializer-merge-styles": ">=5.0.0 <6.0.0",
+    "@uifabric/jest-serializer-merge-styles": ">=5.0.1 <6.0.0",
     "es6-weak-map": "^2.0.2",
     "enzyme": "^2.9.1",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.12.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.13.0 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 4018d9145b643..1b4e77a899540 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -23,7 +23,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.4.0 <6.0.0",
+    "@uifabric/styling": ">=5.4.1 <6.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/jest-serializer-merge-styles/CHANGELOG.json b/packages/jest-serializer-merge-styles/CHANGELOG.json
index e58ae912441c7..0c1c71e4c7a4a 100644
--- a/packages/jest-serializer-merge-styles/CHANGELOG.json
+++ b/packages/jest-serializer-merge-styles/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/jest-serializer-merge-styles",
   "entries": [
+    {
+      "version": "5.0.1",
+      "tag": "@uifabric/jest-serializer-merge-styles_v5.0.1",
+      "date": "Tue, 24 Oct 2017 10:21:08 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "6b86c95a9f1e52ed5488360608ea83792bad385d",
+            "comment": "Updated jest docs"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.4.2 <6.0.0` to `>=5.5.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.0",
       "tag": "@uifabric/jest-serializer-merge-styles_v5.0.0",
diff --git a/packages/jest-serializer-merge-styles/CHANGELOG.md b/packages/jest-serializer-merge-styles/CHANGELOG.md
index 24f6f0f3bce9c..c90a68c774009 100644
--- a/packages/jest-serializer-merge-styles/CHANGELOG.md
+++ b/packages/jest-serializer-merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/jest-serializer-merge-styles
 
-This log was last generated on Tue, 17 Oct 2017 17:17:41 GMT and should not be manually modified.
+This log was last generated on Tue, 24 Oct 2017 10:21:08 GMT and should not be manually modified.
+
+## 5.0.1
+Tue, 24 Oct 2017 10:21:08 GMT
+
+### Patches
+
+- Updated jest docs
 
 ## 5.0.0
 Tue, 17 Oct 2017 17:17:41 GMT
diff --git a/packages/jest-serializer-merge-styles/package.json b/packages/jest-serializer-merge-styles/package.json
index 91f32c6f23dc1..f0a4ee5348ec0 100644
--- a/packages/jest-serializer-merge-styles/package.json
+++ b/packages/jest-serializer-merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/jest-serializer-merge-styles",
-  "version": "5.0.0",
+  "version": "5.0.1",
   "description": "Jest serializer for merge-styles.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -24,6 +24,6 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/merge-styles": ">=5.4.2 <6.0.0"
+    "@uifabric/merge-styles": ">=5.5.0 <6.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index 402c0ce82a380..692c9e6185a53 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.5.0",
+      "tag": "@uifabric/merge-styles_v5.5.0",
+      "date": "Tue, 24 Oct 2017 10:21:08 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "ea31239988130fe5750af706893dc3676b0cce06",
+            "comment": "Adding `stroke` css property to typings."
+          }
+        ]
+      }
+    },
     {
       "version": "5.4.2",
       "tag": "@uifabric/merge-styles_v5.4.2",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index b26d68cbbf5fa..878c73a127db4 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Fri, 20 Oct 2017 18:42:08 GMT and should not be manually modified.
+This log was last generated on Tue, 24 Oct 2017 10:21:08 GMT and should not be manually modified.
+
+## 5.5.0
+Tue, 24 Oct 2017 10:21:08 GMT
+
+### Minor changes
+
+- Adding `stroke` css property to typings.
 
 ## 5.4.2
 Fri, 20 Oct 2017 18:42:08 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index 180f725b94df4..49cfecc4ce2f0 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.4.2",
+  "version": "5.5.0",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index fc559d43c083c..de58628c11924 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,63 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.13.0",
+      "tag": "office-ui-fabric-react_v5.13.0",
+      "date": "Tue, 24 Oct 2017 10:21:08 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "e15ecddc2d8813903725ce7b29c39aeeb98f513a",
+            "comment": "ComboBox: Add support for custom styling of the label in the disabled state"
+          },
+          {
+            "author": "Michael Loughry <miclo@microsoft.com>",
+            "commit": "f1e3474219410a1640ed9c920813987297be2bba",
+            "comment": "Dialog: Don't add empty spans to footer for falsy children of DialogFooter"
+          },
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "33e7f8222a9f8631fd78fcb485debcda2fa49b81",
+            "comment": "Nav: Add onRenderLink back to JSX to allow custom rendering of links"
+          },
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "1004504eb5cdba55db7f17c6b8af90ef5471010e",
+            "comment": "remove outdated semantic slots"
+          },
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "3ad7fdc47a3b38813821e680770f188b01cff085",
+            "comment": "Ensure that Select All checkbox can still be focused"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Joe Martella <martellaj@live.com>",
+            "commit": "751fcb25bb51bac1dcd44249a764a666570102a1",
+            "comment": "Adds \"onInputChanged\" prop to BasePicker"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "6fc8b90efd2d0edc978167c1bfd1d6d3c2e7f64c",
+            "comment": "Layer: exposing `setDefaultTarget(selector)` static method to set a default target element where layered content should render by default."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.4.2 <6.0.0` to `>=5.5.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.4.0 <6.0.0` to `>=5.4.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/jest-serializer-merge-styles\" from `>=5.0.0 <6.0.0` to `>=5.0.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.12.0",
       "tag": "office-ui-fabric-react_v5.12.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 2de213a3e4b41..527c416ddd945 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,22 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 23 Oct 2017 10:24:13 GMT and should not be manually modified.
+This log was last generated on Tue, 24 Oct 2017 10:21:08 GMT and should not be manually modified.
+
+## 5.13.0
+Tue, 24 Oct 2017 10:21:08 GMT
+
+### Minor changes
+
+- Adds "onInputChanged" prop to BasePicker
+- Layer: exposing `setDefaultTarget(selector)` static method to set a default target element where layered content should render by default.
+
+### Patches
+
+- ComboBox: Add support for custom styling of the label in the disabled state
+- Dialog: Don't add empty spans to footer for falsy children of DialogFooter
+- Nav: Add onRenderLink back to JSX to allow custom rendering of links
+- remove outdated semantic slots
+- Ensure that Select All checkbox can still be focused
 
 ## 5.12.0
 Mon, 23 Oct 2017 10:24:13 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 2839be3e52971..e376996aa0431 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.12.0",
+  "version": "5.13.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -27,7 +27,7 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/jest-serializer-merge-styles": ">=5.0.0 <6.0.0",
+    "@uifabric/jest-serializer-merge-styles": ">=5.0.1 <6.0.0",
     "@uifabric/example-app-base": ">=5.1.1 <6.0.0",
     "enzyme": "^2.9.1",
     "es6-promise": "^4.1.0",
@@ -46,8 +46,8 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.4.2 <6.0.0",
-    "@uifabric/styling": ">=5.4.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.5.0 <6.0.0",
+    "@uifabric/styling": ">=5.4.1 <6.0.0",
     "@uifabric/utilities": ">=5.3.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 01fbb5bc4b3ae..903c3acbcdf4d 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.4.1",
+      "tag": "@uifabric/styling_v5.4.1",
+      "date": "Tue, 24 Oct 2017 10:21:08 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "1004504eb5cdba55db7f17c6b8af90ef5471010e",
+            "comment": "remove outdated semantic slots"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.4.2 <6.0.0` to `>=5.5.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.4.0",
       "tag": "@uifabric/styling_v5.4.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 3796d0a6ed2c3..047b5173b37be 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 20 Oct 2017 18:42:08 GMT and should not be manually modified.
+This log was last generated on Tue, 24 Oct 2017 10:21:08 GMT and should not be manually modified.
+
+## 5.4.1
+Tue, 24 Oct 2017 10:21:08 GMT
+
+### Patches
+
+- remove outdated semantic slots
 
 ## 5.4.0
 Fri, 20 Oct 2017 18:42:08 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index bcb0a03cdfb04..b6b4716fd8093 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.4.0",
+  "version": "5.4.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -22,7 +22,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/utilities": ">=5.3.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.4.2 <6.0.0",
+    "@uifabric/merge-styles": ">=5.5.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/scripts/package.json b/scripts/package.json
index aab2f07324f7c..ff90506be2784 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -10,7 +10,7 @@
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.7.5",
     "@microsoft/loader-load-themed-styles": "^1.6.0",
-    "@uifabric/merge-styles": ">=5.4.1 <6.0.0",
+    "@uifabric/merge-styles": ">=5.5.0 <6.0.0",
     "autoprefixer": "^7.1.5",
     "awesome-typescript-loader": "^3.2.3",
     "bundlesize": "^0.15.2",

From a3760c014672dd40b073fb6dd8eec4bdda7471ea Mon Sep 17 00:00:00 2001
From: Amund Kronen Johansen <32198837+amkronen@users.noreply.github.com>
Date: Tue, 24 Oct 2017 17:19:24 +0200
Subject: [PATCH 0919/1641] Panel: Add optional custom function to handle
 clicks outside the panel when isLightDismiss=true (#3192)

* Added possibility to cusomize the lightdismiss click and added an example

* Added changelog entry
---
 ...-panel_click_outside_2017-10-23-10-38.json | 11 +++
 .../src/components/Panel/Panel.Props.ts       |  5 ++
 .../src/components/Panel/Panel.tsx            |  3 +-
 .../src/components/Panel/PanelPage.tsx        |  5 ++
 .../Panel.LightDismissCustom.Example.tsx      | 80 +++++++++++++++++++
 5 files changed, 103 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/amkronen-panel_click_outside_2017-10-23-10-38.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismissCustom.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/amkronen-panel_click_outside_2017-10-23-10-38.json b/common/changes/office-ui-fabric-react/amkronen-panel_click_outside_2017-10-23-10-38.json
new file mode 100644
index 0000000000000..1d6945bed85ff
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/amkronen-panel_click_outside_2017-10-23-10-38.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Panel: Added possibility of using a custom function to handle clicks outside the panel when using isLightDismiss=true",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "amkronen@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.Props.ts b/packages/office-ui-fabric-react/src/components/Panel/Panel.Props.ts
index f14e31ee5d4dd..3d13851473641 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.Props.ts
@@ -121,6 +121,11 @@ export interface IPanelProps extends React.Props<Panel> {
    */
   layerProps?: ILayerProps;
 
+  /**
+   * Optional custom function to handle clicks outside the panel in lightdismiss mode
+   */
+  onLightDismissClick?: () => void;
+
   /**
    * Optional custom renderer navigation region. Replaces current close button.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
index 55f5f125b6035..5349d4c058616 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
@@ -80,6 +80,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
       layerProps,
       type,
       customWidth,
+      onLightDismissClick = this._onPanelClick,
       onRenderNavigation = this._onRenderNavigation,
       onRenderHeader = this._onRenderHeader,
       onRenderBody = this._onRenderBody,
@@ -107,7 +108,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
             !isOpen && isAnimating && AnimationClassNames.fadeOut200
           ) }
           isDarkThemed={ false }
-          onClick={ isLightDismiss ? this._onPanelClick : undefined }
+          onClick={ isLightDismiss ? onLightDismissClick : undefined }
         />
       );
     }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx b/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
index 592bcfcdef873..21f22c39a14c4 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
@@ -14,6 +14,7 @@ import { PanelLargeFixedExample } from './examples/Panel.LargeFixed.Example';
 import { PanelExtraLargeExample } from './examples/Panel.ExtraLarge.Example';
 import { PanelCustomExample } from './examples/Panel.Custom.Example';
 import { PanelLightDismissExample } from './examples/Panel.LightDismiss.Example';
+import { PanelLightDismissCustomExample } from './examples/Panel.LightDismissCustom.Example';
 import { PanelNonModalExample } from './examples/Panel.NonModal.Example';
 import { PanelFooterExample } from './examples/Panel.Footer.Example';
 import { FontClassNames } from '../../Styling';
@@ -29,6 +30,7 @@ const PanelLargeFixedExampleCode = require('!raw-loader!office-ui-fabric-react/s
 const PanelExtraLargeExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Panel/examples/Panel.ExtraLarge.Example.tsx') as string;
 const PanelCustomExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Panel/examples/Panel.Custom.Example.tsx') as string;
 const PanelLightDismissExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismiss.Example.tsx') as string;
+const PanelLightDismissCustomExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismissCustom.Example.tsx') as string;
 const PanelNonModalExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Panel/examples/Panel.NonModal.Example.tsx') as string;
 const PanelFooterExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Panel/examples/Panel.Footer.Example.tsx') as string;
 
@@ -67,6 +69,9 @@ export class PanelPage extends React.Component<IComponentDemoPageProps, {}> {
             <ExampleCard title='Panel - Light Dismiss' code={ PanelLightDismissExampleCode }>
               <PanelLightDismissExample />
             </ExampleCard>
+            <ExampleCard title='Panel - Custom Light Dismiss' code={ PanelLightDismissCustomExampleCode }>
+              <PanelLightDismissCustomExample />
+            </ExampleCard>
             <ExampleCard title='Panel - Non-Modal' code={ PanelNonModalExampleCode }>
               <PanelNonModalExample />
             </ExampleCard>
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismissCustom.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismissCustom.Example.tsx
new file mode 100644
index 0000000000000..c3eea1a3e69e9
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismissCustom.Example.tsx
@@ -0,0 +1,80 @@
+import * as React from 'react';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { Dialog, DialogType, DialogFooter } from 'office-ui-fabric-react/lib/Dialog';
+import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
+import { Panel } from 'office-ui-fabric-react/lib/Panel';
+
+export class PanelLightDismissCustomExample extends React.Component<any, any> {
+
+  constructor() {
+    super();
+
+    this.state = { showPanel: false, hideDialog: true };
+  }
+
+  public render() {
+    return (
+      <div>
+        <DefaultButton
+          text='Open panel'
+          onClick={ this._showPanel }
+        />
+        <Panel
+          isOpen={ this.state.showPanel }
+          isLightDismiss={ true }
+          headerText='Light Dismiss Panel'
+          onDismiss={ this._hidePanel }
+          onLightDismissClick={ this._showDialog }
+        >
+          <span>Light Dismiss usage is meant for the Contextual Menu on mobile sized breakpoints.</span>
+        </Panel>
+        <Dialog
+          hidden={ this.state.hideDialog }
+          onDismiss={ this._closeDialog }
+          dialogContentProps={ {
+            type: DialogType.normal,
+            title: 'Are you sure you want to close the panel?'
+          } }
+          modalProps={ {
+            titleAriaId: 'myLabelId',
+            subtitleAriaId: 'mySubTextId',
+            isBlocking: true,
+            containerClassName: 'ms-dialogMainOverride'
+          } }
+        >
+          { null /** You can also include null values as the result of conditionals */ }
+          <DialogFooter>
+            <PrimaryButton onClick={ this._closeDialogAndHidePanel } text='Yes' />
+            <DefaultButton onClick={ this._closeDialog } text='No' />
+          </DialogFooter>
+        </Dialog>
+      </div>
+    );
+  }
+
+  @autobind
+  private _showPanel(): void {
+    this.setState({ showPanel: true });
+  }
+
+  @autobind
+  private _hidePanel(): void {
+    this.setState({ showPanel: false });
+  }
+
+  @autobind
+  private _showDialog() {
+    this.setState({ hideDialog: false });
+  }
+
+  @autobind
+  private _closeDialog() {
+    this.setState({ hideDialog: true });
+  }
+
+  @autobind
+  private _closeDialogAndHidePanel() {
+    this._hidePanel();
+    this._closeDialog();
+  }
+}

From e032a48e4b6bac5f6462a90f166b779d186760b1 Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Tue, 24 Oct 2017 11:36:01 -0700
Subject: [PATCH 0920/1641] ComboBox: Added prop to close callout when user it
 typing (#3141)

* no message

* no message

* updating combobox to add prop that keeps callout closed when using test input

* change file

* Adding dismissMenu

* fixing lint errors

* Fixing dismissMenu

* fixing order error

* minor updates
---
 ...rr-ComboBox-undefinedOptions_2017-10-17-23-04.json | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.Props.ts         |  5 +++++
 .../src/components/ComboBox/ComboBox.tsx              |  9 +++++++++
 3 files changed, 25 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-ComboBox-undefinedOptions_2017-10-17-23-04.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-ComboBox-undefinedOptions_2017-10-17-23-04.json b/common/changes/office-ui-fabric-react/kegorr-ComboBox-undefinedOptions_2017-10-17-23-04.json
new file mode 100644
index 0000000000000..5db32b1f7fdf9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-ComboBox-undefinedOptions_2017-10-17-23-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Adding prop that keeps calout closed when using test input",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
index 44c475adaf1f4..c031180e28db2 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
@@ -6,6 +6,11 @@ import { IButtonStyles } from '../../Button';
 import { IRenderFunction } from '../../Utilities';
 
 export interface IComboBox {
+  /**
+  * If there is a menu open this will dismiss the menu
+  */
+  dismissMenu: () => void;
+
   /**
    * Sets focus to the input in the comboBox
    * @returns True if focus could be set, false if no operation was taken.
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index cbaa5b42a2d35..013c55f8d10e7 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -334,6 +334,15 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     }
   }
 
+  /**
+   * Close menu callout if it is open
+   */
+  @autobind
+  public dismissMenu(): void {
+    let { isOpen } = this.state;
+    isOpen && this.setState({ isOpen: false });
+  }
+
   /**
    * componentWillReceiveProps handler for the auto fill component
    * Checks/updates the iput value to set, if needed

From 9748bded80b07b1bdb9c8f994fec39deb22fc787 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 24 Oct 2017 15:07:33 -0700
Subject: [PATCH 0921/1641] SplitButton: now with less rounded corners. (#3217)

* Fixing rounded corners on split.

* Adding change file.
---
 .../button-tweak_2017-10-24-19-17.json                | 11 +++++++++++
 .../Button/SplitButton/SplitButton.styles.ts          |  1 +
 .../Dropdown/examples/Dropdown.Basic.Example.tsx      |  9 ---------
 3 files changed, 12 insertions(+), 9 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/button-tweak_2017-10-24-19-17.json

diff --git a/common/changes/office-ui-fabric-react/button-tweak_2017-10-24-19-17.json b/common/changes/office-ui-fabric-react/button-tweak_2017-10-24-19-17.json
new file mode 100644
index 0000000000000..0393a70a8cc41
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/button-tweak_2017-10-24-19-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Buttons: split button has `borderRadius` set to 0 to override defaults on Mac chrome/safari.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
index c115f910a2c21..06f9deb3c6cbc 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
@@ -31,6 +31,7 @@ export const getStyles = memoizeFunction((
         height: 'auto',
         boxSizing: 'border-box',
         border: '1px solid transparent',
+        borderRadius: 0,
         outline: 'transparent',
         userSelect: 'none',
         display: 'inline-block',
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
index 33fc60c1e12ff..28f30e726f6a8 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
@@ -156,15 +156,6 @@ export class DropdownBasicExample extends React.Component<any, any> {
     );
   }
 
-  public makeList(items: any) {
-    let list = [];
-    for (let i = 0; i < items; i++) {
-      list.push({ key: i, text: 'Option ' + i });
-    }
-
-    return list;
-  }
-
   @autobind
   public changeState(item: IDropdownOption) {
     console.log('here is the things updating...' + item.key + ' ' + item.text + ' ' + item.selected);

From 1a655521ee68a4e7ecaf3df43a1b41b6abd16411 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Tue, 24 Oct 2017 15:08:10 -0700
Subject: [PATCH 0922/1641] Dropdown: Fix selection logic (#3216)

* Fix falsey check for selection

* Add change file

* Add tests for dropdown selection

* Update snapshot
---
 ...x-dropdown-selection_2017-10-24-17-37.json | 11 +++++
 .../src/components/Dropdown/Dropdown.test.tsx | 44 +++++++++++++++++++
 .../src/components/Dropdown/Dropdown.tsx      |  2 +-
 .../__snapshots__/Dropdown.test.tsx.snap      |  6 +--
 4 files changed, 59 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-dropdown-selection_2017-10-24-17-37.json

diff --git a/common/changes/office-ui-fabric-react/fix-dropdown-selection_2017-10-24-17-37.json b/common/changes/office-ui-fabric-react/fix-dropdown-selection_2017-10-24-17-37.json
new file mode 100644
index 0000000000000..f0d4540c862d4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-dropdown-selection_2017-10-24-17-37.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix Dropdown's falsey check in selection to strict check for undefined in case key is 0",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "a.erich@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
index 41ae3ce88e2e4..66398e659b577 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
@@ -4,6 +4,7 @@ import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
 import * as ReactTestUtils from 'react-dom/test-utils';
 import * as renderer from 'react-test-renderer';
+import { mount, shallow } from 'enzyme';
 
 import {
   KeyCodes,
@@ -255,6 +256,27 @@ describe('Dropdown', () => {
       }
     });
 
+    it('sets the selected item even when key is number 0', () => {
+      const options = [{ key: 0, text: 'item1' }, { key: 1, text: 'item2' }];
+      const selectedKey = 0;
+
+      const wrapper = shallow(
+        <Dropdown
+          options={ options }
+        />
+      );
+
+      // Use .dive() because Dropdown is a decorated component
+      let state = wrapper.dive().state('selectedIndices');
+      expect(state).toEqual([]);
+
+      const newProps = { options, selectedKey };
+      wrapper.setProps(newProps);
+      wrapper.update();
+      state = wrapper.dive().state('selectedIndices');
+      expect(state).toEqual([selectedKey]);
+    });
+
     it('issues the onChanged callback when the selected item is different', () => {
       let container = document.createElement('div');
       let dropdownRoot: HTMLElement | undefined;
@@ -401,6 +423,28 @@ describe('Dropdown', () => {
       expect(titleElement.textContent).toEqual('1');
     });
 
+    it('sets the selected items even when key is number 0', () => {
+      const options = [{ key: 0, text: 'item1' }, { key: 1, text: 'item2' }];
+      const selectedKeys = [0, 1];
+
+      const wrapper = shallow(
+        <Dropdown
+          multiSelect
+          options={ options }
+        />
+      );
+
+      // Use .dive() because Dropdown is a decorated component
+      let state = wrapper.dive().state('selectedIndices');
+      expect(state).toEqual([]);
+
+      const newProps = { options, selectedKeys };
+      wrapper.setProps(newProps);
+      wrapper.update();
+      state = wrapper.dive().state('selectedIndices');
+      expect(state).toEqual(selectedKeys);
+    });
+
     it('Renders multiple selected items if multiple options specify selected', () => {
       let container = document.createElement('div');
 
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 253678da624fd..68b8384e2b92e 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -531,7 +531,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
 
   // Get all selected indexes for multi-select mode
   private _getSelectedIndexes(options: IDropdownOption[], selectedKey: string | number | string[] | number[] | undefined): number[] {
-    if (!selectedKey) {
+    if (selectedKey === undefined) {
       if (this.props.multiSelect) {
         return this._getAllSelectedIndices(options);
       }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap
index 5b7e5760cc0aa..20ec6f93ee827 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`Dropdown multi-select Renders multiselect Dropdown correctly 1`] = `
 >
   <div
     aria-activedescendant={null}
-    aria-describedby="Dropdown92-option"
+    aria-describedby="Dropdown94-option"
     aria-disabled={undefined}
     aria-expanded="false"
     aria-label={undefined}
@@ -14,7 +14,7 @@ exports[`Dropdown multi-select Renders multiselect Dropdown correctly 1`] = `
     aria-owns={null}
     className="ms-Dropdown"
     data-is-focusable={true}
-    id="Dropdown92"
+    id="Dropdown94"
     onBlur={[Function]}
     onClick={[Function]}
     onKeyDown={[Function]}
@@ -26,7 +26,7 @@ exports[`Dropdown multi-select Renders multiselect Dropdown correctly 1`] = `
       aria-atomic={true}
       aria-readonly="true"
       className="ms-Dropdown-title ms-Dropdown-titleIsPlaceHolder"
-      id="Dropdown92-option"
+      id="Dropdown94-option"
       role="textbox"
     />
     <span

From cd7317ef23a46a4a8406395fea0c423130446bed Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Tue, 24 Oct 2017 18:34:09 -0700
Subject: [PATCH 0923/1641] Callout: Fix calculation of max height (#3219)

* Fix max height calculation

* Update snapshot

* Change file
---
 .../callout-fix-height_2017-10-24-22-49.json          | 11 +++++++++++
 .../src/components/Callout/CalloutContent.tsx         |  2 +-
 .../Callout/__snapshots__/Callout.test.tsx.snap       |  2 +-
 3 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/callout-fix-height_2017-10-24-22-49.json

diff --git a/common/changes/office-ui-fabric-react/callout-fix-height_2017-10-24-22-49.json b/common/changes/office-ui-fabric-react/callout-fix-height_2017-10-24-22-49.json
new file mode 100644
index 0000000000000..64bed4c021d18
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/callout-fix-height_2017-10-24-22-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "CalloutContent: Fix calculation of max size if calloutMaxHeight is not provided",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "a.erich@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index c4a6545f5c815..fcbbb671da8d2 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -144,7 +144,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       : '';
 
     let getContentMaxHeight: number = this._getMaxHeight() + this.state.heightOffset!;
-    let contentMaxHeight: number = calloutMaxHeight! && (calloutMaxHeight! > getContentMaxHeight) ? getContentMaxHeight : calloutMaxHeight!;
+    let contentMaxHeight: number = calloutMaxHeight! && (calloutMaxHeight! < getContentMaxHeight) ? calloutMaxHeight! : getContentMaxHeight!;
 
     let beakVisible = isBeakVisible && (!!target);
 
diff --git a/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
index 3004deec5a3c4..4007c6e023ce6 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
@@ -23,7 +23,7 @@ exports[`Callout renders Callout correctly 1`] = `
       style={
         Object {
           "backgroundColor": undefined,
-          "maxHeight": undefined,
+          "maxHeight": 750,
         }
       }
     >

From 95a2a2813d2f0f487a2b451b6c4b85f0c0796621 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 24 Oct 2017 18:48:02 -0700
Subject: [PATCH 0924/1641] Example app css tweak (#3220)

* minor css fixes.

* Change file
---
 .../example-app-fix_2017-10-25-01-29.json             | 11 +++++++++++
 packages/example-app-base/src/components/App/App.scss |  1 +
 .../src/components/Header/Header.scss                 |  1 +
 3 files changed, 13 insertions(+)
 create mode 100644 common/changes/@uifabric/example-app-base/example-app-fix_2017-10-25-01-29.json

diff --git a/common/changes/@uifabric/example-app-base/example-app-fix_2017-10-25-01-29.json b/common/changes/@uifabric/example-app-base/example-app-fix_2017-10-25-01-29.json
new file mode 100644
index 0000000000000..e702763d8048b
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/example-app-fix_2017-10-25-01-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Minor css improvements to example header.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/src/components/App/App.scss b/packages/example-app-base/src/components/App/App.scss
index c4e5fec4422e5..b835caa052d16 100644
--- a/packages/example-app-base/src/components/App/App.scss
+++ b/packages/example-app-base/src/components/App/App.scss
@@ -9,6 +9,7 @@
     top: 0;
     min-width: 100%;
     min-height: 100%;
+    -webkit-tap-highlight-color: transparent;
   }
 
   .ms-App-header {
diff --git a/packages/example-app-base/src/components/Header/Header.scss b/packages/example-app-base/src/components/Header/Header.scss
index 2001ae2e7e220..cbf01e3ef1b4f 100644
--- a/packages/example-app-base/src/components/Header/Header.scss
+++ b/packages/example-app-base/src/components/Header/Header.scss
@@ -26,6 +26,7 @@ $Header-fabricWebsiteHeaderColor: #272630;
     display: inline-block;
     vertical-align: top;
     color: white;
+    border-radius: 0;
   }
 
   .Header-title {

From 393f02679e40f6957fcb291b64a434d5b3f53d1a Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 24 Oct 2017 18:49:36 -0700
Subject: [PATCH 0925/1641] Button pass ondismiss (#3205)

* Mix in onDismiss sent from button menuProps

* changefile
---
 .../button-pass-ondismiss_2017-10-23-23-22.json       | 11 +++++++++++
 .../src/components/Button/BaseButton.tsx              |  4 +++-
 2 files changed, 14 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-23-23-22.json

diff --git a/common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-23-23-22.json b/common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-23-23-22.json
new file mode 100644
index 0000000000000..ea3c1e9468d8b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-23-23-22.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Button: Pass specified onDismiss callback to contextual menu",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": ""
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index ec3746d846169..16c5b413943cd 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -350,6 +350,8 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
 
   @autobind
   private _onRenderMenu(menuProps: IContextualMenuProps): JSX.Element {
+    const { onDismiss = this._onToggleMenu } = menuProps;
+
     return (
       <ContextualMenu
         id={ this._labelId + '-menu' }
@@ -358,7 +360,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         className={ 'ms-BaseButton-menuhost ' + menuProps.className }
         target={ this._isSplitButton ? this._splitButtonContainer : this._buttonElement }
         labelElementId={ this._labelId }
-        onDismiss={ this._onToggleMenu }
+        onDismiss={ onDismiss }
       />
     );
   }

From df94503a3264b084561957e328cc13434a58c19e Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 25 Oct 2017 02:03:34 +0000
Subject: [PATCH 0926/1641] Applying package updates.

---
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../example-app-fix_2017-10-25-01-29.json     | 11 -----
 ...-panel_click_outside_2017-10-23-10-38.json | 11 -----
 ...utton-pass-ondismiss_2017-10-23-23-22.json | 11 -----
 .../button-tweak_2017-10-24-19-17.json        | 11 -----
 .../callout-fix-height_2017-10-24-22-49.json  | 11 -----
 ...x-dropdown-selection_2017-10-24-17-37.json | 11 -----
 ...Box-undefinedOptions_2017-10-17-23-04.json | 11 -----
 packages/example-app-base/CHANGELOG.json      | 14 ++++++
 packages/example-app-base/CHANGELOG.md        |  9 +++-
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/package.json             |  4 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 46 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 17 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 18 files changed, 93 insertions(+), 88 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/example-app-fix_2017-10-25-01-29.json
 delete mode 100644 common/changes/office-ui-fabric-react/amkronen-panel_click_outside_2017-10-23-10-38.json
 delete mode 100644 common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-23-23-22.json
 delete mode 100644 common/changes/office-ui-fabric-react/button-tweak_2017-10-24-19-17.json
 delete mode 100644 common/changes/office-ui-fabric-react/callout-fix-height_2017-10-24-22-49.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-dropdown-selection_2017-10-24-17-37.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-ComboBox-undefinedOptions_2017-10-17-23-04.json

diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 559b88cd53f8b..0738caef173aa 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.12.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.14.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 43147a8560535..a84a44eefb871 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.12.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.14.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 7aec9407ee772..2582fc43f7854 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.12.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.14.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 2679cf46e46ce..649725780aee5 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.12.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.14.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/example-app-base/example-app-fix_2017-10-25-01-29.json b/common/changes/@uifabric/example-app-base/example-app-fix_2017-10-25-01-29.json
deleted file mode 100644
index e702763d8048b..0000000000000
--- a/common/changes/@uifabric/example-app-base/example-app-fix_2017-10-25-01-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Minor css improvements to example header.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/amkronen-panel_click_outside_2017-10-23-10-38.json b/common/changes/office-ui-fabric-react/amkronen-panel_click_outside_2017-10-23-10-38.json
deleted file mode 100644
index 1d6945bed85ff..0000000000000
--- a/common/changes/office-ui-fabric-react/amkronen-panel_click_outside_2017-10-23-10-38.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Panel: Added possibility of using a custom function to handle clicks outside the panel when using isLightDismiss=true",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "amkronen@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-23-23-22.json b/common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-23-23-22.json
deleted file mode 100644
index ea3c1e9468d8b..0000000000000
--- a/common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-23-23-22.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Button: Pass specified onDismiss callback to contextual menu",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": ""
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/button-tweak_2017-10-24-19-17.json b/common/changes/office-ui-fabric-react/button-tweak_2017-10-24-19-17.json
deleted file mode 100644
index 0393a70a8cc41..0000000000000
--- a/common/changes/office-ui-fabric-react/button-tweak_2017-10-24-19-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Buttons: split button has `borderRadius` set to 0 to override defaults on Mac chrome/safari.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/callout-fix-height_2017-10-24-22-49.json b/common/changes/office-ui-fabric-react/callout-fix-height_2017-10-24-22-49.json
deleted file mode 100644
index 64bed4c021d18..0000000000000
--- a/common/changes/office-ui-fabric-react/callout-fix-height_2017-10-24-22-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "CalloutContent: Fix calculation of max size if calloutMaxHeight is not provided",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "a.erich@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-dropdown-selection_2017-10-24-17-37.json b/common/changes/office-ui-fabric-react/fix-dropdown-selection_2017-10-24-17-37.json
deleted file mode 100644
index f0d4540c862d4..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-dropdown-selection_2017-10-24-17-37.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix Dropdown's falsey check in selection to strict check for undefined in case key is 0",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "a.erich@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kegorr-ComboBox-undefinedOptions_2017-10-17-23-04.json b/common/changes/office-ui-fabric-react/kegorr-ComboBox-undefinedOptions_2017-10-17-23-04.json
deleted file mode 100644
index 5db32b1f7fdf9..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-ComboBox-undefinedOptions_2017-10-17-23-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Adding prop that keeps calout closed when using test input",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 93ed6804c9b31..68479e0ef33f1 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "5.1.2",
+      "tag": "@uifabric/example-app-base_v5.1.2",
+      "date": "Wed, 25 Oct 2017 02:03:33 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "95a2a2813d2f0f487a2b451b6c4b85f0c0796621",
+            "comment": "Minor css improvements to example header."
+          }
+        ]
+      }
+    },
     {
       "version": "5.1.1",
       "tag": "@uifabric/example-app-base_v5.1.1",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index 00f1baba7a803..bc4984068961f 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Fri, 06 Oct 2017 10:18:41 GMT and should not be manually modified.
+This log was last generated on Wed, 25 Oct 2017 02:03:33 GMT and should not be manually modified.
+
+## 5.1.2
+Wed, 25 Oct 2017 02:03:33 GMT
+
+### Patches
+
+- Minor css improvements to example header.
 
 ## 5.1.1
 Fri, 06 Oct 2017 10:18:41 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index b599fc2c191fc..8b375309aa860 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "5.1.1",
+  "version": "5.1.2",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 61f86e0260d04..1e71860da8d4f 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -28,7 +28,7 @@
     "@types/jest": "^21.1.0",
     "@types/enzyme": "^2.8.8",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=5.1.1 <6.0.0",
+    "@uifabric/example-app-base": ">=5.1.2 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.0.1 <6.0.0",
     "es6-weak-map": "^2.0.2",
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.13.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.14.0 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index de58628c11924..23f60c49c6272 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,52 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.14.0",
+      "tag": "office-ui-fabric-react_v5.14.0",
+      "date": "Wed, 25 Oct 2017 02:03:33 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Amund Kronen Johansen <32198837+amkronen@users.noreply.github.com>",
+            "commit": "a3760c014672dd40b073fb6dd8eec4bdda7471ea",
+            "comment": "Panel: Added possibility of using a custom function to handle clicks outside the panel when using isLightDismiss=true"
+          },
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "e032a48e4b6bac5f6462a90f166b779d186760b1",
+            "comment": "ComboBox: Adding prop that keeps calout closed when using test input"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "393f02679e40f6957fcb291b64a434d5b3f53d1a",
+            "comment": "Button: Pass specified onDismiss callback to contextual menu"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "9748bded80b07b1bdb9c8f994fec39deb22fc787",
+            "comment": "Buttons: split button has `borderRadius` set to 0 to override defaults on Mac chrome/safari."
+          },
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "cd7317ef23a46a4a8406395fea0c423130446bed",
+            "comment": "CalloutContent: Fix calculation of max size if calloutMaxHeight is not provided"
+          },
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "1a655521ee68a4e7ecaf3df43a1b41b6abd16411",
+            "comment": "Fix Dropdown's falsey check in selection to strict check for undefined in case key is 0"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=5.1.1 <6.0.0` to `>=5.1.2 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.13.0",
       "tag": "office-ui-fabric-react_v5.13.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 527c416ddd945..4ae61ebafc267 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,21 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 24 Oct 2017 10:21:08 GMT and should not be manually modified.
+This log was last generated on Wed, 25 Oct 2017 02:03:33 GMT and should not be manually modified.
+
+## 5.14.0
+Wed, 25 Oct 2017 02:03:33 GMT
+
+### Minor changes
+
+- Panel: Added possibility of using a custom function to handle clicks outside the panel when using isLightDismiss=true
+- ComboBox: Adding prop that keeps calout closed when using test input
+
+### Patches
+
+- Button: Pass specified onDismiss callback to contextual menu
+- Buttons: split button has `borderRadius` set to 0 to override defaults on Mac chrome/safari.
+- CalloutContent: Fix calculation of max size if calloutMaxHeight is not provided
+- Fix Dropdown's falsey check in selection to strict check for undefined in case key is 0
 
 ## 5.13.0
 Tue, 24 Oct 2017 10:21:08 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index e376996aa0431..0a8b693bcf6b0 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.13.0",
+  "version": "5.14.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -28,7 +28,7 @@
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.0.1 <6.0.0",
-    "@uifabric/example-app-base": ">=5.1.1 <6.0.0",
+    "@uifabric/example-app-base": ">=5.1.2 <6.0.0",
     "enzyme": "^2.9.1",
     "es6-promise": "^4.1.0",
     "es6-map": "^0.1.5",

From 264fc2f0a83197ec7041c929cb343951479229aa Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Wed, 25 Oct 2017 13:07:58 -0700
Subject: [PATCH 0927/1641] ContextualMenu: Make getIschecked consistent for
 checked and ischecked prop (#3229)

* make getIschecked consistent for checked and ischecked prop

* rush change
---
 .../toggle-button-no-checkmark_2017-10-25-18-09.json  | 11 +++++++++++
 .../src/components/ContextualMenu/ContextualMenu.tsx  |  8 ++++++--
 2 files changed, 17 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/toggle-button-no-checkmark_2017-10-25-18-09.json

diff --git a/common/changes/office-ui-fabric-react/toggle-button-no-checkmark_2017-10-25-18-09.json b/common/changes/office-ui-fabric-react/toggle-button-no-checkmark_2017-10-25-18-09.json
new file mode 100644
index 0000000000000..114b4452a9210
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/toggle-button-no-checkmark_2017-10-25-18-09.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: Make the behavior of getIsChecked consistent for isChecked and checked props",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "<christianjordangonzalez@gmail.com>"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 096d3ff9e0ea0..95b2fcade455c 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -63,15 +63,19 @@ export function getSubmenuItems(item: IContextualMenuItem) {
  * @returns {false} if the item is unchecked.
  * @returns {null} if the item is not checkable.
  */
-function getIsChecked(item: IContextualMenuItem): boolean | null | undefined {
+function getIsChecked(item: IContextualMenuItem): boolean | null {
   if (item.canCheck) {
-    return item.isChecked || item.checked;
+    return !!(item.isChecked || item.checked);
   }
 
   if (typeof item.isChecked === 'boolean') {
     return item.isChecked;
   }
 
+  if (typeof item.checked === 'boolean') {
+    return item.checked;
+  }
+
   // Item is not checkable.
   return null;
 }

From 79160fa76ec89691451507c643803ad9b052174e Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Wed, 25 Oct 2017 14:12:10 -0700
Subject: [PATCH 0928/1641] SplitButton in Menu: Render icon in splitbutton
 primary action (#3228)

* Add missing iconProps to splitPrimaryButton method

* Add npm run change file

* Remove prettier styling changes

* Remove unnecesary span label
---
 ...lozano-SplitButtonInMenuIcon_2017-10-25-18-02.json | 11 +++++++++++
 package.json                                          |  2 +-
 .../src/components/ContextualMenu/ContextualMenu.tsx  |  9 +++++++--
 .../examples/ContextualMenu.Checkmarks.Example.tsx    |  5 ++++-
 4 files changed, 23 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/malozano-SplitButtonInMenuIcon_2017-10-25-18-02.json

diff --git a/common/changes/office-ui-fabric-react/malozano-SplitButtonInMenuIcon_2017-10-25-18-02.json b/common/changes/office-ui-fabric-react/malozano-SplitButtonInMenuIcon_2017-10-25-18-02.json
new file mode 100644
index 0000000000000..9f76713fcab5f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-SplitButtonInMenuIcon_2017-10-25-18-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SplitButtonInMenu: render icon in primary action button",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/package.json b/package.json
index 3eb7cf92f69d0..fe303a238af5d 100644
--- a/package.json
+++ b/package.json
@@ -31,4 +31,4 @@
   "dependencies": {
     "gulp": "^3.9.1"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 95b2fcade455c..2251eda75eaa4 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -551,6 +551,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       canCheck: item.canCheck,
       isChecked: item.isChecked,
       checked: item.checked,
+      icon: item.icon,
+      iconProps: item.iconProps
     } as IContextualMenuItem;
     return React.createElement('button',
       getNativeProps(itemProps, buttonProperties),
@@ -591,7 +593,10 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
         { (hasIcons) ? (
           this._renderIcon(item, classNames)
         ) : (null) }
-        <span className={ classNames.label }>{ item.name }</span>
+        { item.name ? (
+          <span className={ classNames.label }>{ item.name }</span>
+        ) : null
+        }
         { hasSubmenuItems(item) ? (
           <Icon
             iconName={ getRTL() ? 'ChevronLeft' : 'ChevronRight' }
@@ -792,4 +797,4 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       this._targetWindow = getWindow()!;
     }
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
index 6af6abd3a1608..83be3982f417e 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
@@ -75,6 +75,9 @@ export class ContextualMenuCheckmarksExample extends React.Component<any, IConte
               },
               {
                 key: keys[5],
+                iconProps: {
+                  iconName: 'MusicInCollectionFill'
+                },
                 subMenuProps: {
                   items: [
                     {
@@ -115,4 +118,4 @@ export class ContextualMenuCheckmarksExample extends React.Component<any, IConte
       selection: selection
     });
   }
-}
+}
\ No newline at end of file

From ddfe27b00b3daff96359616d77f6bc3a3a53b5ab Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Wed, 25 Oct 2017 16:51:39 -0700
Subject: [PATCH 0929/1641] Callout: Update position comparison function
 (#3232)

* Add undefined check to comparePositions

* Add change file

* Condense conditionals, make sure newPositionEdge is not undefined
---
 .../callout-positioning_2017-10-25-21-50.json         | 11 +++++++++++
 .../src/components/Callout/CalloutContent.tsx         |  4 +++-
 2 files changed, 14 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/callout-positioning_2017-10-25-21-50.json

diff --git a/common/changes/office-ui-fabric-react/callout-positioning_2017-10-25-21-50.json b/common/changes/office-ui-fabric-react/callout-positioning_2017-10-25-21-50.json
new file mode 100644
index 0000000000000..18d3d46bdb178
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/callout-positioning_2017-10-25-21-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Callout: Add check for undefined when comparing old and new position",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "a.erich@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index fcbbb671da8d2..d36fab507d877 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -334,10 +334,12 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
         const oldPositionEdge = oldPositions[key];
         const newPositionEdge = newPositions[key];
 
-        if (oldPositionEdge && newPositionEdge) {
+        if (oldPositionEdge !== undefined && newPositionEdge !== undefined) {
           if (oldPositionEdge.toFixed(2) !== newPositionEdge.toFixed(2)) {
             return false;
           }
+        } else {
+          return false;
         }
       }
     }

From b6ba83e0c27830b87824a8062d97ded3540a7ba7 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 25 Oct 2017 21:21:52 -0700
Subject: [PATCH 0930/1641] Fabric root index no longer calls initializeIcons
 (#3233)

* Removing the initializeIcons call from the fabric import.

* Adding change files

* Adding updates to the warn function export and setWarnCallback.

* Fixing vr tests.
---
 apps/vr-tests/src/utilities/index.ts               |  6 +++++-
 .../register-icons-fix_2017-10-26-00-45.json       | 11 +++++++++++
 .../register-icons-fix_2017-10-26-00-45.json       | 11 +++++++++++
 .../office-ui-fabric-react/src/index.bundle.ts     |  8 ++++++++
 packages/office-ui-fabric-react/src/index.ts       |  7 -------
 packages/office-ui-fabric-react/webpack.config.js  |  2 +-
 packages/styling/src/utilities/icons.ts            | 10 ++++++----
 packages/utilities/src/warn.ts                     | 14 ++++++++------
 8 files changed, 50 insertions(+), 19 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/register-icons-fix_2017-10-26-00-45.json
 create mode 100644 common/changes/office-ui-fabric-react/register-icons-fix_2017-10-26-00-45.json
 create mode 100644 packages/office-ui-fabric-react/src/index.bundle.ts

diff --git a/apps/vr-tests/src/utilities/index.ts b/apps/vr-tests/src/utilities/index.ts
index aaa70dcf4222b..53e88b39b549d 100644
--- a/apps/vr-tests/src/utilities/index.ts
+++ b/apps/vr-tests/src/utilities/index.ts
@@ -1 +1,5 @@
-export * from './FabricDecorator';
\ No newline at end of file
+import { initializeIcons } from '@uifabric/icons';
+
+initializeIcons();
+
+export * from './FabricDecorator';
diff --git a/common/changes/@uifabric/styling/register-icons-fix_2017-10-26-00-45.json b/common/changes/@uifabric/styling/register-icons-fix_2017-10-26-00-45.json
new file mode 100644
index 0000000000000..e251079002257
--- /dev/null
+++ b/common/changes/@uifabric/styling/register-icons-fix_2017-10-26-00-45.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "Updating the icon warning to link to documentation for assistance.",
+      "packageName": "@uifabric/styling",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/register-icons-fix_2017-10-26-00-45.json b/common/changes/office-ui-fabric-react/register-icons-fix_2017-10-26-00-45.json
new file mode 100644
index 0000000000000..62659896dff0c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/register-icons-fix_2017-10-26-00-45.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Removing the `initializeIcons` call from the top level import. The bundle in the dist folder used in codepens will still continue to have it, so that codepens don't stop rendering icons.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/index.bundle.ts b/packages/office-ui-fabric-react/src/index.bundle.ts
new file mode 100644
index 0000000000000..1db338758171a
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/index.bundle.ts
@@ -0,0 +1,8 @@
+export * from './index';
+
+// Using the default import, include all icon definitions. Products that care
+// about bundle size should not be using the main entry, until tree shaking
+// is perfected. (Use the top level imports instead.)
+import { initializeIcons } from './Icons';
+
+initializeIcons();
diff --git a/packages/office-ui-fabric-react/src/index.ts b/packages/office-ui-fabric-react/src/index.ts
index 9ced214da911e..45c4ee48ea8c5 100644
--- a/packages/office-ui-fabric-react/src/index.ts
+++ b/packages/office-ui-fabric-react/src/index.ts
@@ -57,10 +57,3 @@ export * from './TextField';
 export * from './Toggle';
 export * from './Tooltip';
 export * from './Utilities';
-
-// Using the default import, include all icon definitions. Products that care
-// about bundle size should not be using the main entry, until tree shaking
-// is perfected. (Use the top level imports instead.)
-import { initializeIcons } from './Icons';
-
-initializeIcons();
diff --git a/packages/office-ui-fabric-react/webpack.config.js b/packages/office-ui-fabric-react/webpack.config.js
index 5ebc0cf4719fb..7de41eaf3c39a 100644
--- a/packages/office-ui-fabric-react/webpack.config.js
+++ b/packages/office-ui-fabric-react/webpack.config.js
@@ -5,7 +5,7 @@ const BUNDLE_NAME = 'office-ui-fabric-react';
 const IS_PRODUCTION = process.argv.indexOf('--production') > -1;
 
 let entry = {
-  [BUNDLE_NAME]: './lib/index.js'
+  [BUNDLE_NAME]: './lib/index.bundle.js'
 };
 
 // In production builds, produce the demo-app bundle.
diff --git a/packages/styling/src/utilities/icons.ts b/packages/styling/src/utilities/icons.ts
index 473d9bb852a60..6085f75d19299 100644
--- a/packages/styling/src/utilities/icons.ts
+++ b/packages/styling/src/utilities/icons.ts
@@ -31,6 +31,7 @@ export interface IIconRecord {
 }
 
 export interface IIconOptions {
+  disableWarnings: boolean;
   warnOnMissingIcons: boolean;
 }
 
@@ -43,6 +44,7 @@ export interface IIconRecords {
 const ICON_SETTING_NAME = 'icons';
 const _icons = GlobalSettings.getValue<IIconRecords>(ICON_SETTING_NAME, {
   __options: {
+    disableWarnings: false,
     warnOnMissingIcons: true
   },
   __remapped: {}
@@ -66,7 +68,7 @@ export function registerIcons(iconSubset: IIconSubset): void {
       const code = icons[iconName];
       const normalizedIconName = iconName.toLowerCase();
 
-      if (_icons[normalizedIconName]) {
+      if (_icons[normalizedIconName] && !_icons.__options.disableWarnings) {
         warn(`Icon '${iconName} being re-registered`);
       }
 
@@ -120,8 +122,8 @@ export function getIcon(name?: string): IIconRecord | undefined {
         subset.isRegistered = true;
       }
     } else {
-      if (_icons.__options.warnOnMissingIcons) {
-        warn(`The icon "${name}" was referenced but not registered.`);
+      if (_icons.__options.warnOnMissingIcons && !_icons.__options.disableWarnings) {
+        warn(`The icon "${name}" was used but not registered. See http://aka.ms/fabric-icon-usage for more information.`);
       }
     }
   }
@@ -134,7 +136,7 @@ export function getIcon(name?: string): IIconRecord | undefined {
  *
  * @public
  */
-export function setIconOptions(options: IIconOptions): void {
+export function setIconOptions(options: Partial<IIconOptions>): void {
   _icons.__options = {
     ..._icons.__options,
     ...options
diff --git a/packages/utilities/src/warn.ts b/packages/utilities/src/warn.ts
index c5281bd8fb991..2336382c1c8ba 100644
--- a/packages/utilities/src/warn.ts
+++ b/packages/utilities/src/warn.ts
@@ -1,4 +1,4 @@
-let _warningCallback: (message: string) => void = warn;
+let _warningCallback: ((message: string) => void) | undefined = undefined;
 
 export type ISettingsMap<T> = {
   [P in keyof T]?: string;
@@ -26,7 +26,7 @@ export function warnDeprecations<P>(
       if (replacementPropName) {
         deprecationMessage += ` Use '${replacementPropName}' instead.`;
       }
-      _warningCallback(deprecationMessage);
+      warn(deprecationMessage);
     }
   }
 }
@@ -48,7 +48,7 @@ export function warnMutuallyExclusive<P>(
     if (props && propName in props) {
       let propInExclusiveMapValue = exclusiveMap[propName];
       if (propInExclusiveMapValue && propInExclusiveMapValue in props) {
-        _warningCallback(
+        warn(
           `${componentName} property '${propName}' is mutually exclusive with '${exclusiveMap[propName]}'. Use one or the other.`
         );
       }
@@ -76,7 +76,7 @@ export function warnConditionallyRequiredProps<P>(
   if (condition === true) {
     for (const requiredPropName of requiredProps) {
       if (!(requiredPropName in props)) {
-        _warningCallback(
+        warn(
           `${componentName} property '${requiredPropName}' is required when '${conditionalPropName}' is used.'`
         );
       }
@@ -91,7 +91,9 @@ export function warnConditionallyRequiredProps<P>(
  * @param message - Warning message.
  */
 export function warn(message: string): void {
-  if (console && console.warn) {
+  if (_warningCallback) {
+    _warningCallback(message);
+  } else if (console && console.warn) {
     console.warn(message);
   }
 }
@@ -104,5 +106,5 @@ export function warn(message: string): void {
  * @param warningCallback - Callback to override the generated warnings.
  */
 export function setWarningCallback(warningCallback?: (message: string) => void): void {
-  _warningCallback = warningCallback === undefined ? warn : warningCallback;
+  _warningCallback = warningCallback;
 }

From 0216cd3f2d01b4b4fcdeed1eee319fdc0285af3d Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 26 Oct 2017 10:21:37 +0000
Subject: [PATCH 0931/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 .../register-icons-fix_2017-10-26-00-45.json  | 11 ------
 .../callout-positioning_2017-10-25-21-50.json | 11 ------
 ...plitButtonInMenuIcon_2017-10-25-18-02.json | 11 ------
 .../register-icons-fix_2017-10-26-00-45.json  | 11 ------
 ...-button-no-checkmark_2017-10-25-18-09.json | 11 ------
 packages/example-app-base/package.json        |  2 +-
 packages/icons/package.json                   |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 36 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 +++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/CHANGELOG.json               | 14 ++++++++
 packages/styling/CHANGELOG.md                 |  9 ++++-
 packages/styling/package.json                 |  2 +-
 14 files changed, 78 insertions(+), 63 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/register-icons-fix_2017-10-26-00-45.json
 delete mode 100644 common/changes/office-ui-fabric-react/callout-positioning_2017-10-25-21-50.json
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-SplitButtonInMenuIcon_2017-10-25-18-02.json
 delete mode 100644 common/changes/office-ui-fabric-react/register-icons-fix_2017-10-26-00-45.json
 delete mode 100644 common/changes/office-ui-fabric-react/toggle-button-no-checkmark_2017-10-25-18-09.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index d04a1e5c635b4..76ae495f98333 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.13.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.15.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/register-icons-fix_2017-10-26-00-45.json b/common/changes/@uifabric/styling/register-icons-fix_2017-10-26-00-45.json
deleted file mode 100644
index e251079002257..0000000000000
--- a/common/changes/@uifabric/styling/register-icons-fix_2017-10-26-00-45.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "Updating the icon warning to link to documentation for assistance.",
-      "packageName": "@uifabric/styling",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/callout-positioning_2017-10-25-21-50.json b/common/changes/office-ui-fabric-react/callout-positioning_2017-10-25-21-50.json
deleted file mode 100644
index 18d3d46bdb178..0000000000000
--- a/common/changes/office-ui-fabric-react/callout-positioning_2017-10-25-21-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Callout: Add check for undefined when comparing old and new position",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "a.erich@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/malozano-SplitButtonInMenuIcon_2017-10-25-18-02.json b/common/changes/office-ui-fabric-react/malozano-SplitButtonInMenuIcon_2017-10-25-18-02.json
deleted file mode 100644
index 9f76713fcab5f..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-SplitButtonInMenuIcon_2017-10-25-18-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SplitButtonInMenu: render icon in primary action button",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/register-icons-fix_2017-10-26-00-45.json b/common/changes/office-ui-fabric-react/register-icons-fix_2017-10-26-00-45.json
deleted file mode 100644
index 62659896dff0c..0000000000000
--- a/common/changes/office-ui-fabric-react/register-icons-fix_2017-10-26-00-45.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Removing the `initializeIcons` call from the top level import. The bundle in the dist folder used in codepens will still continue to have it, so that codepens don't stop rendering icons.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/toggle-button-no-checkmark_2017-10-25-18-09.json b/common/changes/office-ui-fabric-react/toggle-button-no-checkmark_2017-10-25-18-09.json
deleted file mode 100644
index 114b4452a9210..0000000000000
--- a/common/changes/office-ui-fabric-react/toggle-button-no-checkmark_2017-10-25-18-09.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: Make the behavior of getIsChecked consistent for isChecked and checked props",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "<christianjordangonzalez@gmail.com>"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 8b375309aa860..1c2c8f237c1fb 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -38,7 +38,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.4.1 <6.0.0",
+    "@uifabric/styling": ">=5.5.0 <6.0.0",
     "@uifabric/utilities": ">=5.3.0 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 1b4e77a899540..ff3cfe6b83468 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -23,7 +23,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.4.1 <6.0.0",
+    "@uifabric/styling": ">=5.5.0 <6.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 23f60c49c6272..a19406a5316d4 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,42 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.15.0",
+      "tag": "office-ui-fabric-react_v5.15.0",
+      "date": "Thu, 26 Oct 2017 10:21:37 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "ddfe27b00b3daff96359616d77f6bc3a3a53b5ab",
+            "comment": "Callout: Add check for undefined when comparing old and new position"
+          },
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "79160fa76ec89691451507c643803ad9b052174e",
+            "comment": "SplitButtonInMenu: render icon in primary action button"
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "264fc2f0a83197ec7041c929cb343951479229aa",
+            "comment": "ContextualMenu: Make the behavior of getIsChecked consistent for isChecked and checked props"
+          }
+        ],
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "b6ba83e0c27830b87824a8062d97ded3540a7ba7",
+            "comment": "Removing the `initializeIcons` call from the top level import. The bundle in the dist folder used in codepens will still continue to have it, so that codepens don't stop rendering icons."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.4.1 <6.0.0` to `>=5.5.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.14.0",
       "tag": "office-ui-fabric-react_v5.14.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 4ae61ebafc267..c2154c4907fd6 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 25 Oct 2017 02:03:33 GMT and should not be manually modified.
+This log was last generated on Thu, 26 Oct 2017 10:21:37 GMT and should not be manually modified.
+
+## 5.15.0
+Thu, 26 Oct 2017 10:21:37 GMT
+
+### Minor changes
+
+- Removing the `initializeIcons` call from the top level import. The bundle in the dist folder used in codepens will still continue to have it, so that codepens don't stop rendering icons.
+
+### Patches
+
+- Callout: Add check for undefined when comparing old and new position
+- SplitButtonInMenu: render icon in primary action button
+- ContextualMenu: Make the behavior of getIsChecked consistent for isChecked and checked props
 
 ## 5.14.0
 Wed, 25 Oct 2017 02:03:33 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 0a8b693bcf6b0..792cb2c430c8d 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.14.0",
+  "version": "5.15.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,7 +47,7 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.5.0 <6.0.0",
-    "@uifabric/styling": ">=5.4.1 <6.0.0",
+    "@uifabric/styling": ">=5.5.0 <6.0.0",
     "@uifabric/utilities": ">=5.3.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 903c3acbcdf4d..7764a191f0329 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.5.0",
+      "tag": "@uifabric/styling_v5.5.0",
+      "date": "Thu, 26 Oct 2017 10:21:37 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "b6ba83e0c27830b87824a8062d97ded3540a7ba7",
+            "comment": "Updating the icon warning to link to documentation for assistance."
+          }
+        ]
+      }
+    },
     {
       "version": "5.4.1",
       "tag": "@uifabric/styling_v5.4.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 047b5173b37be..1163aeed8516b 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Tue, 24 Oct 2017 10:21:08 GMT and should not be manually modified.
+This log was last generated on Thu, 26 Oct 2017 10:21:37 GMT and should not be manually modified.
+
+## 5.5.0
+Thu, 26 Oct 2017 10:21:37 GMT
+
+### Minor changes
+
+- Updating the icon warning to link to documentation for assistance.
 
 ## 5.4.1
 Tue, 24 Oct 2017 10:21:08 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index b6b4716fd8093..70a76ac8d4c85 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.4.1",
+  "version": "5.5.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From a2893c4b4372a2b752b2c58273e8380a8806e69d Mon Sep 17 00:00:00 2001
From: cicciodm <f.dimauro92@gmail.com>
Date: Thu, 26 Oct 2017 16:48:26 +0200
Subject: [PATCH 0932/1641] SearchBox onKeyDown: prevent default events only
 when specified by the user (#3190)

* SearchBox onKeyDown: prevent default events only when specified by the user

* Adding change file
---
 ...icciodm-onkeydown-search-fix_2017-10-23-08-32.json | 11 +++++++++++
 .../src/components/SearchBox/SearchBox.tsx            |  8 ++++----
 2 files changed, 15 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/cicciodm-onkeydown-search-fix_2017-10-23-08-32.json

diff --git a/common/changes/office-ui-fabric-react/cicciodm-onkeydown-search-fix_2017-10-23-08-32.json b/common/changes/office-ui-fabric-react/cicciodm-onkeydown-search-fix_2017-10-23-08-32.json
new file mode 100644
index 0000000000000..31083eb919985
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/cicciodm-onkeydown-search-fix_2017-10-23-08-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SearchBox onKeyDown: prevent default events only when specified by the user",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "frdim@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
index 553c167ded8c4..c4b525a3a2b95 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
@@ -145,14 +145,14 @@ export class SearchBox extends BaseComponent<ISearchBoxProps, ISearchBoxState> {
         break;
 
       default:
-        if (this.props.onKeyDown) {
-          this.props.onKeyDown(ev);
-        } else {
+        this.props.onKeyDown && this.props.onKeyDown(ev);
+        if (!ev.defaultPrevented) {
           return;
         }
     }
 
-    // We only get here if the keypress has been handled.
+    // We only get here if the keypress has been handled,
+    // or preventDefault was called in case of default keyDown handler
     ev.preventDefault();
     ev.stopPropagation();
   }

From 02f5ef74858d988b0e5f48a32a688ea65c93b7d2 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Thu, 26 Oct 2017 09:38:10 -0700
Subject: [PATCH 0933/1641] Panel navigation layout (#3231)

* changed navigation layout to use flexbox, and pass overrides directly into button to avoid load order issues

* Change files

* Change to theme.palette

* use correct prop for hover
---
 ...el-navigation-layout_2017-10-25-18-58.json | 11 +++++++
 ...el-navigation-layout_2017-10-25-18-58.json | 11 +++++++
 .../src/components/Panel/Panel.scss           | 21 +++---------
 .../src/components/Panel/Panel.tsx            | 32 ++++++++++++++-----
 .../styling/src/styles/DefaultFontStyles.ts   |  8 +++++
 packages/styling/src/styles/index.ts          |  2 +-
 6 files changed, 59 insertions(+), 26 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/panel-navigation-layout_2017-10-25-18-58.json
 create mode 100644 common/changes/office-ui-fabric-react/panel-navigation-layout_2017-10-25-18-58.json

diff --git a/common/changes/@uifabric/styling/panel-navigation-layout_2017-10-25-18-58.json b/common/changes/@uifabric/styling/panel-navigation-layout_2017-10-25-18-58.json
new file mode 100644
index 0000000000000..9742a96348acc
--- /dev/null
+++ b/common/changes/@uifabric/styling/panel-navigation-layout_2017-10-25-18-58.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Added IconFontSizes",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/panel-navigation-layout_2017-10-25-18-58.json b/common/changes/office-ui-fabric-react/panel-navigation-layout_2017-10-25-18-58.json
new file mode 100644
index 0000000000000..5733818559c46
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/panel-navigation-layout_2017-10-25-18-58.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Panel: changed navigation layout to use flexbox, and pass overrides directly into button to avoid load order issues",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.scss b/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
index 2c1a9f1d4109f..9eed93a8a09bb 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
@@ -184,24 +184,11 @@ $CommandBarHeight: 44px;
   }
 }
 
-// The button in the top right (x)
-.closeButton {
-  background: none;
-  border: 0;
-  cursor: pointer;
-  position: absolute;
-  @include ms-right(4px);
-  top: 0;
+.navigation {
+  padding: 0 5px;
   height: $CommandBarHeight;
-  width: $CommandBarHeight;
-  line-height: $CommandBarHeight;
-  padding: 0;
-  color: $ms-color-neutralSecondary;
-  font-size: $ms-icon-size-l;
-
-  &:hover {
-    color: $ms-color-neutralPrimary;
-  }
+  display: flex;
+  justify-content: flex-end;
 }
 
 // Scrollable content area
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
index 5349d4c058616..6ea1c6edf1c64 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
@@ -15,9 +15,10 @@ import { Layer } from '../Layer/Layer';
 import { Overlay } from '../../Overlay';
 import { Popup } from '../../Popup';
 import { IconButton } from '../../Button';
-import { AnimationClassNames } from '../../Styling';
+import { AnimationClassNames, getTheme, FontSizes, IconFontSizes } from '../../Styling';
 import * as stylesImport from './Panel.scss';
 const styles: any = stylesImport;
+const theme = getTheme();
 
 export interface IPanelState {
   isFooterSticky?: boolean;
@@ -208,13 +209,28 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
     } = props;
     if (hasCloseButton) {
       return (
-        <IconButton
-          className={ css('ms-Panel-closeButton ms-PanelAction-close', styles.closeButton) }
-          onClick={ this._onPanelClick }
-          ariaLabel={ closeButtonAriaLabel }
-          data-is-visible={ true }
-          iconProps={ { iconName: 'Cancel' } }
-        />
+        <div className={ css('ms-Panel-navigation', styles.navigation) } >
+          <IconButton
+            styles={
+              {
+                root: {
+                  height: 'auto',
+                  width: '44px',
+                  color: theme.palette.neutralSecondary,
+                  fontSize: IconFontSizes.large,
+                },
+                rootHovered: {
+                  color: theme.palette.neutralPrimary
+                }
+              }
+            }
+            className={ css('ms-Panel-closeButton ms-PanelAction-close') }
+            onClick={ this._onPanelClick }
+            ariaLabel={ closeButtonAriaLabel }
+            data-is-visible={ true }
+            iconProps={ { iconName: 'Cancel' } }
+          />
+        </div>
       );
     }
     return null;
diff --git a/packages/styling/src/styles/DefaultFontStyles.ts b/packages/styling/src/styles/DefaultFontStyles.ts
index deb3e2f13c1fc..cfe07e681fd69 100644
--- a/packages/styling/src/styles/DefaultFontStyles.ts
+++ b/packages/styling/src/styles/DefaultFontStyles.ts
@@ -96,6 +96,14 @@ export namespace FontWeights {
   export const bold = 700;
 }
 
+// Standard Icon Sizes.
+export namespace IconFontSizes {
+  export const xSmall = '10px';
+  export const small = '12px';
+  export const medium = '16px';
+  export const large = '20px';
+}
+
 // Standard font styling.
 export const DefaultFontStyles: IFontStyles = {
   tiny: _createFont(FontSizes.mini, FontWeights.semibold),
diff --git a/packages/styling/src/styles/index.ts b/packages/styling/src/styles/index.ts
index 9252fb678d8ab..8277a89d758ea 100644
--- a/packages/styling/src/styles/index.ts
+++ b/packages/styling/src/styles/index.ts
@@ -1,6 +1,6 @@
 export { AnimationStyles } from './AnimationStyles';
 export { DefaultPalette } from './DefaultPalette';
-export { DefaultFontStyles, FontSizes, FontWeights } from './DefaultFontStyles';
+export { DefaultFontStyles, FontSizes, FontWeights, IconFontSizes } from './DefaultFontStyles';
 export { getFocusStyle } from './getFocusStyle';
 export { hiddenContentStyle } from './hiddenContentStyle';
 export {

From f0cf2e1a6ffb194a670e9faf6316f304b9677671 Mon Sep 17 00:00:00 2001
From: cicciodm <f.dimauro92@gmail.com>
Date: Thu, 26 Oct 2017 21:06:11 +0200
Subject: [PATCH 0934/1641]  Restore 'forceAnchor' prop for INavLink elements
 (#3213)

* Restore 'forceAnchor' prop for INavLink elements

* Adding changeFile
---
 ...icciodm-navlink-force-anchor_2017-10-24-15-21.json | 11 +++++++++++
 .../office-ui-fabric-react/src/components/Nav/Nav.tsx |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/cicciodm-navlink-force-anchor_2017-10-24-15-21.json

diff --git a/common/changes/office-ui-fabric-react/cicciodm-navlink-force-anchor_2017-10-24-15-21.json b/common/changes/office-ui-fabric-react/cicciodm-navlink-force-anchor_2017-10-24-15-21.json
new file mode 100644
index 0000000000000..ee25c8998f6ac
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/cicciodm-navlink-force-anchor_2017-10-24-15-21.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Restore forceAnchor prop for INavLink elements",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "frdim@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
index eea5e215d7ddd..4c33352e9b3d0 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
@@ -164,11 +164,11 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
         className={ mergeStyles(
           'ms-Nav-link' + link.onClick && 'ms-Nav-linkButton',
           styles.link,
-          link.onClick && styles.buttonEntry,
+          link.onClick && !link.forceAnchor && styles.buttonEntry,
           this._hasExpandButton && 'isOnExpanded') as string
         }
         styles={ buttonStyles }
-        href={ link.url }
+        href={ link.url || (link.forceAnchor ? 'javascript:' : undefined) }
         iconProps={ { iconName: link.icon || '' } }
         description={ link.title || link.name }
         onClick={ link.onClick ? this._onNavButtonLinkClicked.bind(this, link) : this._onNavAnchorLinkClicked.bind(this, link) }

From 64214cc2b97c1ed45968e44e9361ec06fe33af26 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Thu, 26 Oct 2017 12:33:16 -0700
Subject: [PATCH 0935/1641] Website: Updated initializeIcons call to fix the
 IE/Edge icon bug (#3239)

* Removing 'dist' reference to pull icons from cdn

* Added change file
---
 apps/fabric-website/src/root.tsx                      |  2 +-
 .../initializeicons-fix_2017-10-26-18-53.json         | 11 +++++++++++
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/fabric-website/initializeicons-fix_2017-10-26-18-53.json

diff --git a/apps/fabric-website/src/root.tsx b/apps/fabric-website/src/root.tsx
index 53f9a873a2f0f..ef960af0b6116 100644
--- a/apps/fabric-website/src/root.tsx
+++ b/apps/fabric-website/src/root.tsx
@@ -14,7 +14,7 @@ import './styles/styles.scss';
 
 import { initializeIcons } from '@uifabric/icons/lib/index';
 
-initializeIcons('./dist/');
+initializeIcons();
 
 let isProduction = process.argv.indexOf('--production') > -1;
 
diff --git a/common/changes/@uifabric/fabric-website/initializeicons-fix_2017-10-26-18-53.json b/common/changes/@uifabric/fabric-website/initializeicons-fix_2017-10-26-18-53.json
new file mode 100644
index 0000000000000..cbad524672d2e
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/initializeicons-fix_2017-10-26-18-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Fixed initializeIcons call to pull from cdn instead of dist.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From 86fe40e75d27d61869a4cc005f21257104fa7bf8 Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Thu, 26 Oct 2017 13:22:49 -0700
Subject: [PATCH 0936/1641] Theme Generator: improve perf (#3234)

* improved theme generator perf

* change file

* code review comments
---
 .../phkuo-tgPerf_2017-10-26-03-29.json        | 11 ++++
 .../phkuo-tgPerf_2017-10-26-03-29.json        | 11 ++++
 .../phkuo-tgPerf_2017-10-26-03-29.json        | 11 ++++
 .../icons/phkuo-tgPerf_2017-10-26-03-29.json  | 11 ++++
 .../phkuo-tgPerf_2017-10-26-03-29.json        | 11 ++++
 .../phkuo-tgPerf_2017-10-26-03-29.json        | 11 ++++
 .../phkuo-tgPerf_2017-10-26-03-29.json        | 11 ++++
 .../phkuo-tgPerf_2017-10-26-03-29.json        | 11 ++++
 .../ThemeGenerator/IThemeSlotRule.ts          |  2 +
 .../ThemeGenerator/ThemeGenerator.ts          | 19 ++----
 .../ThemeGenerator/ThemeGeneratorPage.tsx     | 65 ++++++++++++-------
 .../ThemeGenerator/ThemeRulesStandard.ts      | 39 ++++++++---
 12 files changed, 166 insertions(+), 47 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/phkuo-tgPerf_2017-10-26-03-29.json
 create mode 100644 common/changes/@uifabric/experiments/phkuo-tgPerf_2017-10-26-03-29.json
 create mode 100644 common/changes/@uifabric/fabric-website/phkuo-tgPerf_2017-10-26-03-29.json
 create mode 100644 common/changes/@uifabric/icons/phkuo-tgPerf_2017-10-26-03-29.json
 create mode 100644 common/changes/@uifabric/jest-serializer-merge-styles/phkuo-tgPerf_2017-10-26-03-29.json
 create mode 100644 common/changes/@uifabric/merge-styles/phkuo-tgPerf_2017-10-26-03-29.json
 create mode 100644 common/changes/@uifabric/styling/phkuo-tgPerf_2017-10-26-03-29.json
 create mode 100644 common/changes/office-ui-fabric-react/phkuo-tgPerf_2017-10-26-03-29.json

diff --git a/common/changes/@uifabric/example-app-base/phkuo-tgPerf_2017-10-26-03-29.json b/common/changes/@uifabric/example-app-base/phkuo-tgPerf_2017-10-26-03-29.json
new file mode 100644
index 0000000000000..bd4f77495b1bf
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/phkuo-tgPerf_2017-10-26-03-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/phkuo-tgPerf_2017-10-26-03-29.json b/common/changes/@uifabric/experiments/phkuo-tgPerf_2017-10-26-03-29.json
new file mode 100644
index 0000000000000..8b47ce48184d1
--- /dev/null
+++ b/common/changes/@uifabric/experiments/phkuo-tgPerf_2017-10-26-03-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/experiments",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/phkuo-tgPerf_2017-10-26-03-29.json b/common/changes/@uifabric/fabric-website/phkuo-tgPerf_2017-10-26-03-29.json
new file mode 100644
index 0000000000000..3d260bd7a567b
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/phkuo-tgPerf_2017-10-26-03-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/phkuo-tgPerf_2017-10-26-03-29.json b/common/changes/@uifabric/icons/phkuo-tgPerf_2017-10-26-03-29.json
new file mode 100644
index 0000000000000..ad14cc3dff257
--- /dev/null
+++ b/common/changes/@uifabric/icons/phkuo-tgPerf_2017-10-26-03-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/icons",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/icons",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/jest-serializer-merge-styles/phkuo-tgPerf_2017-10-26-03-29.json b/common/changes/@uifabric/jest-serializer-merge-styles/phkuo-tgPerf_2017-10-26-03-29.json
new file mode 100644
index 0000000000000..e235ae362c1b9
--- /dev/null
+++ b/common/changes/@uifabric/jest-serializer-merge-styles/phkuo-tgPerf_2017-10-26-03-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/jest-serializer-merge-styles",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/jest-serializer-merge-styles",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/phkuo-tgPerf_2017-10-26-03-29.json b/common/changes/@uifabric/merge-styles/phkuo-tgPerf_2017-10-26-03-29.json
new file mode 100644
index 0000000000000..8857a0239222a
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/phkuo-tgPerf_2017-10-26-03-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/merge-styles",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/phkuo-tgPerf_2017-10-26-03-29.json b/common/changes/@uifabric/styling/phkuo-tgPerf_2017-10-26-03-29.json
new file mode 100644
index 0000000000000..581caa0e9c26b
--- /dev/null
+++ b/common/changes/@uifabric/styling/phkuo-tgPerf_2017-10-26-03-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/phkuo-tgPerf_2017-10-26-03-29.json b/common/changes/office-ui-fabric-react/phkuo-tgPerf_2017-10-26-03-29.json
new file mode 100644
index 0000000000000..0750d387eb012
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/phkuo-tgPerf_2017-10-26-03-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Theme Generator: improve perf",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeSlotRule.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeSlotRule.ts
index b1507ebcc207b..5fc8241dae304 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeSlotRule.ts
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/IThemeSlotRule.ts
@@ -16,4 +16,6 @@ export interface IThemeSlotRule {
   isBackgroundShade?: boolean;
   /* Whether this slot has been manually overridden (else, it was automatically generated based on inheritance). */
   isCustomized?: boolean;
+  /* A collection of rules that inherit from this one. It is the responsibility of the inheriting rule to add itself to its parent's dependentRules collection. */
+  dependentRules: IThemeSlotRule[];
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts
index 231a8fb97006d..dcf94446fc274 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts
@@ -23,7 +23,6 @@ export class ThemeGenerator {
   public static setSlot(
     rule: IThemeSlotRule,
     color: string | IColor,
-    slotRules: IThemeRules,
     isInverted = false,
     isCustomization = false,
     overwriteCustomColor = true
@@ -43,9 +42,9 @@ export class ThemeGenerator {
       } else {
         colorAsIColor = color;
       }
-      ThemeGenerator._setSlot(rule, colorAsIColor, slotRules, isInverted, isCustomization, overwriteCustomColor);
+      ThemeGenerator._setSlot(rule, colorAsIColor, isInverted, isCustomization, overwriteCustomColor);
     } else if (rule.color) {
-      ThemeGenerator._setSlot(rule, rule.color, slotRules, isInverted, isCustomization, overwriteCustomColor);
+      ThemeGenerator._setSlot(rule, rule.color, isInverted, isCustomization, overwriteCustomColor);
     }
   }
 
@@ -63,7 +62,7 @@ export class ThemeGenerator {
           if (!rule.color) {
             throw 'A color slot rule that does not inherit must provide its own color.';
           }
-          ThemeGenerator._setSlot(rule, rule.color, slotRules, isInverted, false, false);
+          ThemeGenerator._setSlot(rule, rule.color, isInverted, false, false);
         }
       }
     }
@@ -147,7 +146,6 @@ export class ThemeGenerator {
   private static _setSlot(
     rule: IThemeSlotRule,
     color: IColor,
-    slotRules: IThemeRules,
     isInverted: boolean,
     isCustomization: boolean,
     overwriteCustomColor = true
@@ -171,14 +169,9 @@ export class ThemeGenerator {
         rule.isCustomized = true;
       }
 
-      // then run through the rest of the rules and update dependent colors
-      for (let ruleName in slotRules) {
-        if (slotRules.hasOwnProperty(ruleName)) {
-          let ruleToUpdate: IThemeSlotRule = slotRules[ruleName];
-          if (ruleToUpdate.inherits === rule) {
-            ThemeGenerator._setSlot(ruleToUpdate, rule.color, slotRules, isInverted, false, overwriteCustomColor);
-          }
-        }
+      // then update dependent colors
+      for (let ruleToUpdate of rule.dependentRules) {
+        ThemeGenerator._setSlot(ruleToUpdate, rule.color, isInverted, false, overwriteCustomColor);
       }
     }
   }
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
index 6ef5004f41625..d53881665f863 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
@@ -1,6 +1,9 @@
 import * as React from 'react';
 import './ThemeGeneratorPage.scss';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+import {
+  BaseComponent,
+  autobind
+} from 'office-ui-fabric-react/lib/Utilities';
 
 import { loadTheme } from 'office-ui-fabric-react/lib/Styling';
 import {
@@ -39,8 +42,8 @@ export interface IThemeGeneratorPageState {
 const BackgroundImageUriKey = 'backgroundImageUri';
 const BackgroundOverlayKey = 'backgroundOverlay';
 
-export class ThemeGeneratorPage extends React.Component<any, IThemeGeneratorPageState> {
-
+export class ThemeGeneratorPage extends BaseComponent<any, IThemeGeneratorPageState> {
+  private _semanticSlotColorChangeTimeout: number;
   private _imgUrl: string;
 
   constructor() {
@@ -301,32 +304,31 @@ export class ThemeGeneratorPage extends React.Component<any, IThemeGeneratorPage
       ThemeGenerator.setSlot(
         themeRules[BaseSlots[BaseSlots.backgroundColor]],
         bgColor,
-        themeRules,
         bgColorIsDark,
         true,
         true);
       ThemeGenerator.setSlot(
         themeRules[BaseSlots[BaseSlots.primaryColor]],
         '#' + response.color.accentColor,
-        themeRules,
         bgColorIsDark,
         true,
         true);
       ThemeGenerator.setSlot(
         themeRules[BaseSlots[BaseSlots.foregroundColor]],
         getHexFromColor(response.color.dominantColorForeground, false),
-        themeRules,
         bgColorIsDark,
         true,
         true);
 
       themeRules[BackgroundImageUriKey] = {
         name: BackgroundImageUriKey,
-        value: 'url(\'' + this._imgUrl + '\')'
+        value: 'url(\'' + this._imgUrl + '\')',
+        dependentRules: []
       };
       themeRules[BackgroundOverlayKey] = {
         name: BackgroundOverlayKey,
-        color: updateA((themeRules[BaseSlots[BaseSlots.backgroundColor]]).color!, 50)
+        color: updateA((themeRules[BaseSlots[BaseSlots.backgroundColor]]).color!, 50),
+        dependentRules: []
       };
 
       this.setState({ themeRules: themeRules }, this._makeNewTheme);
@@ -343,10 +345,17 @@ export class ThemeGeneratorPage extends React.Component<any, IThemeGeneratorPage
 
   @autobind
   private _semanticSlotRuleChanged(slotRule: IThemeSlotRule, color: string) {
-    let { themeRules } = this.state;
+    if (this._semanticSlotColorChangeTimeout) {
+      clearTimeout(this._semanticSlotColorChangeTimeout);
+    }
+    this._semanticSlotColorChangeTimeout = this._async.setTimeout(() => {
+      let { themeRules } = this.state;
 
-    ThemeGenerator.setSlot(slotRule, color, themeRules, isDark(themeRules[BaseSlots[BaseSlots.backgroundColor]].color!), true, true);
-    this.setState({ themeRules: themeRules }, this._makeNewTheme);
+      ThemeGenerator.setSlot(slotRule, color, isDark(themeRules[BaseSlots[BaseSlots.backgroundColor]].color!), true, true);
+      this.setState({ themeRules: themeRules }, this._makeNewTheme);
+    }, 20);
+    // 20ms is low enough that you can slowly drag to change color and see that theme,
+    // but high enough that quick changes don't get bogged down by a million changes inbetween
   }
 
   @autobind
@@ -477,21 +486,29 @@ export class ThemeGeneratorPage extends React.Component<any, IThemeGeneratorPage
 
   @autobind
   private _baseColorSlotPicker(baseSlot: BaseSlots, title: string) {
+    let colorChangeTimeout: number;
+
     function _onColorChanged(newColor: string) {
-      let themeRules = this.state.themeRules;
-      const currentIsDark = isDark(themeRules[BaseSlots[BaseSlots.backgroundColor]].color!);
-      ThemeGenerator.setSlot(
-        themeRules[BaseSlots[baseSlot]],
-        newColor,
-        themeRules,
-        currentIsDark,
-        true,
-        true);
-      if (currentIsDark !== isDark(themeRules[BaseSlots[BaseSlots.backgroundColor]].color!)) {
-        // isInverted got swapped, so need to refresh slots with new shading rules
-        ThemeGenerator.insureSlots(themeRules, !currentIsDark);
+      if (colorChangeTimeout) {
+        clearTimeout(colorChangeTimeout);
       }
-      this.setState({ themeRules: themeRules }, this._makeNewTheme);
+      colorChangeTimeout = this._async.setTimeout(() => {
+        let themeRules = this.state.themeRules;
+        const currentIsDark = isDark(themeRules[BaseSlots[BaseSlots.backgroundColor]].color!);
+        ThemeGenerator.setSlot(
+          themeRules[BaseSlots[baseSlot]],
+          newColor,
+          currentIsDark,
+          true,
+          true);
+        if (currentIsDark !== isDark(themeRules[BaseSlots[BaseSlots.backgroundColor]].color!)) {
+          // isInverted got swapped, so need to refresh slots with new shading rules
+          ThemeGenerator.insureSlots(themeRules, !currentIsDark);
+        }
+        this.setState({ themeRules: themeRules }, this._makeNewTheme);
+      }, 20);
+      // 20ms is low enough that you can slowly drag to change color and see that theme,
+      // but high enough that quick changes don't get bogged down by a million changes inbetween
     }
 
     return (
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
index dd45a9c3dde70..15ef8a67ed633 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
@@ -67,7 +67,8 @@ export function themeRulesStandardCreator() {
     // first make the SlotRule for the unshaded base Color
     slotRules[baseSlot] = {
       name: baseSlot,
-      isCustomized: true
+      isCustomized: true,
+      dependentRules: []
     };
 
     // then make a rule for each shade of this base color, but skip unshaded
@@ -75,13 +76,18 @@ export function themeRulesStandardCreator() {
       if (shadeName === Shade[Shade.Unshaded]) {
         return;
       }
-      slotRules[baseSlot + shadeName] = {
+      let inherits = slotRules[baseSlot];
+      let thisSlotRule = {
         name: baseSlot + shadeName,
         inherits: slotRules[baseSlot],
         asShade: shadeValue,
         isCustomized: false,
-        isBackgroundShade: baseSlot === BaseSlots[BaseSlots.backgroundColor] ? true : false
+        isBackgroundShade: baseSlot === BaseSlots[BaseSlots.backgroundColor] ? true : false,
+        dependentRules: []
       };
+      slotRules[baseSlot + shadeName] = thisSlotRule;
+      inherits.dependentRules.push(thisSlotRule);
+
       return void 0;
     });
 
@@ -114,13 +120,17 @@ export function themeRulesStandardCreator() {
   slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade8]].color = getColorFromString('#000000');
 
   function _makeFabricSlotRule(slotName: string, inheritedBase: BaseSlots, inheritedShade: Shade, isBackgroundShade = false) {
-    slotRules[slotName] = {
+    let inherits = slotRules[BaseSlots[inheritedBase]];
+    let thisSlotRule = {
       name: slotName,
-      inherits: slotRules[BaseSlots[inheritedBase]],
+      inherits: inherits,
       asShade: inheritedShade,
       isCustomized: false,
-      isBackgroundShade: isBackgroundShade
+      isBackgroundShade: isBackgroundShade,
+      dependentRules: []
     };
+    slotRules[slotName] = thisSlotRule;
+    inherits.dependentRules.push(thisSlotRule);
   }
   _makeFabricSlotRule(FabricSlots[FabricSlots.themePrimary], BaseSlots.primaryColor, Shade.Unshaded);
   _makeFabricSlotRule(FabricSlots[FabricSlots.themeLighterAlt], BaseSlots.primaryColor, Shade.Shade1);
@@ -170,23 +180,32 @@ export function themeRulesStandardCreator() {
   slotRules[primaryBackground] = {
     name: primaryBackground,
     inherits: slotRules[FabricSlots[FabricSlots.white]],
-    isCustomized: false
+    isCustomized: false,
+    dependentRules: []
   };
+  slotRules[FabricSlots[FabricSlots.white]].dependentRules.push(slotRules[primaryBackground]);
+
   let primaryText = 'primaryText';
   slotRules[primaryText] = {
     name: primaryText,
     inherits: slotRules[FabricSlots[FabricSlots.neutralPrimary]],
-    isCustomized: false
+    isCustomized: false,
+    dependentRules: []
   };
+  slotRules[FabricSlots[FabricSlots.neutralPrimary]].dependentRules.push(slotRules[primaryText]);
 
   /*** SEMANTIC SLOTS */
   // create the SlotRule for a semantic slot
   function _makeSemanticSlotRule(semanticSlot: SemanticColorSlots, inheritedFabricSlot: FabricSlots) {
-    slotRules[SemanticColorSlots[semanticSlot]] = {
+    let inherits = slotRules[FabricSlots[inheritedFabricSlot]];
+    let thisSlotRule = {
       name: SemanticColorSlots[semanticSlot],
       inherits: slotRules[FabricSlots[inheritedFabricSlot]],
-      isCustomized: false
+      isCustomized: false,
+      dependentRules: []
     };
+    slotRules[SemanticColorSlots[semanticSlot]] = thisSlotRule;
+    inherits.dependentRules.push(thisSlotRule);
   }
 
   // Basics simple content slots

From 81a0fdc4a00eec06237189754ed6b45244a408dd Mon Sep 17 00:00:00 2001
From: Benjamin Kaiser <benjaminjkaiser@gmail.com>
Date: Thu, 26 Oct 2017 17:07:08 -0700
Subject: [PATCH 0937/1641] Add ariaHidden prop to buttons (#3241)

To improve accessibility support, the button component should support
the ariaHidden attribute allowing it to be hidden from screen readers.
---
 .../bekaise-ariaHidden_2017-10-26-19-49.json          | 11 +++++++++++
 .../src/components/Button/BaseButton.tsx              |  5 +++++
 .../src/components/Button/Button.Props.ts             |  5 +++++
 3 files changed, 21 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/bekaise-ariaHidden_2017-10-26-19-49.json

diff --git a/common/changes/office-ui-fabric-react/bekaise-ariaHidden_2017-10-26-19-49.json b/common/changes/office-ui-fabric-react/bekaise-ariaHidden_2017-10-26-19-49.json
new file mode 100644
index 0000000000000..369934539de4c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/bekaise-ariaHidden_2017-10-26-19-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add ariaHidden prop to buttons",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "bekaise@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 16c5b413943cd..bc16285c4b785 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -74,6 +74,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     const {
       ariaDescription,
       ariaLabel,
+      ariaHidden,
       className,
       description,
       disabled,
@@ -158,6 +159,10 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       }
     );
 
+    if (ariaHidden) {
+      buttonProps['aria-hidden'] = true;
+    }
+
     if (this._isSplitButton) {
       return (
         this._onRenderSplitButtonContent(tag, buttonProps)
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
index abf8a88c5d5fa..dcf1e3d863e04 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
@@ -84,6 +84,11 @@ export interface IButtonProps extends React.AllHTMLAttributes<HTMLAnchorElement
    */
   ariaDescription?: string;
 
+  /**
+   * If provided and is true it adds an 'aria-hidden' attribute instructing screen readers to ignore the element.
+   */
+  ariaHidden?: boolean;
+
   /**
   * Text to render button label. If text is supplied, it will override any string in button children. Other children components will be passed through after the text.
   */

From ef0f5b010fc8a8383c75470db3c64340b9a256cb Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 27 Oct 2017 10:25:10 +0000
Subject: [PATCH 0938/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 19 +++++++++
 apps/fabric-website/CHANGELOG.md              |  9 +++-
 apps/fabric-website/package.json              |  4 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../phkuo-tgPerf_2017-10-26-03-29.json        | 11 -----
 .../phkuo-tgPerf_2017-10-26-03-29.json        | 11 -----
 .../initializeicons-fix_2017-10-26-18-53.json | 11 -----
 .../phkuo-tgPerf_2017-10-26-03-29.json        | 11 -----
 .../icons/phkuo-tgPerf_2017-10-26-03-29.json  | 11 -----
 .../phkuo-tgPerf_2017-10-26-03-29.json        | 11 -----
 .../phkuo-tgPerf_2017-10-26-03-29.json        | 11 -----
 ...el-navigation-layout_2017-10-25-18-58.json | 11 -----
 .../phkuo-tgPerf_2017-10-26-03-29.json        | 11 -----
 .../bekaise-ariaHidden_2017-10-26-19-49.json  | 11 -----
 ...navlink-force-anchor_2017-10-24-15-21.json | 11 -----
 ...onkeydown-search-fix_2017-10-23-08-32.json | 11 -----
 ...el-navigation-layout_2017-10-25-18-58.json | 11 -----
 .../phkuo-tgPerf_2017-10-26-03-29.json        | 11 -----
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/package.json             |  2 +-
 packages/icons/package.json                   |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 41 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 16 +++++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/CHANGELOG.json               | 14 +++++++
 packages/styling/CHANGELOG.md                 |  9 +++-
 packages/styling/package.json                 |  2 +-
 30 files changed, 117 insertions(+), 169 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/phkuo-tgPerf_2017-10-26-03-29.json
 delete mode 100644 common/changes/@uifabric/experiments/phkuo-tgPerf_2017-10-26-03-29.json
 delete mode 100644 common/changes/@uifabric/fabric-website/initializeicons-fix_2017-10-26-18-53.json
 delete mode 100644 common/changes/@uifabric/fabric-website/phkuo-tgPerf_2017-10-26-03-29.json
 delete mode 100644 common/changes/@uifabric/icons/phkuo-tgPerf_2017-10-26-03-29.json
 delete mode 100644 common/changes/@uifabric/jest-serializer-merge-styles/phkuo-tgPerf_2017-10-26-03-29.json
 delete mode 100644 common/changes/@uifabric/merge-styles/phkuo-tgPerf_2017-10-26-03-29.json
 delete mode 100644 common/changes/@uifabric/styling/panel-navigation-layout_2017-10-25-18-58.json
 delete mode 100644 common/changes/@uifabric/styling/phkuo-tgPerf_2017-10-26-03-29.json
 delete mode 100644 common/changes/office-ui-fabric-react/bekaise-ariaHidden_2017-10-26-19-49.json
 delete mode 100644 common/changes/office-ui-fabric-react/cicciodm-navlink-force-anchor_2017-10-24-15-21.json
 delete mode 100644 common/changes/office-ui-fabric-react/cicciodm-onkeydown-search-fix_2017-10-23-08-32.json
 delete mode 100644 common/changes/office-ui-fabric-react/panel-navigation-layout_2017-10-25-18-58.json
 delete mode 100644 common/changes/office-ui-fabric-react/phkuo-tgPerf_2017-10-26-03-29.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index ba6e1f3de4f12..573cfaac4f27e 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.0.14",
+      "tag": "@uifabric/fabric-website_v5.0.14",
+      "date": "Fri, 27 Oct 2017 10:25:09 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "64214cc2b97c1ed45968e44e9361ec06fe33af26",
+            "comment": "Fixed initializeIcons call to pull from cdn instead of dist."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.15.0 <6.0.0` to `>=5.16.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.13",
       "tag": "@uifabric/fabric-website_v5.0.13",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 9ba3488e52726..d7144cabf6249 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Tue, 24 Oct 2017 10:21:08 GMT and should not be manually modified.
+This log was last generated on Fri, 27 Oct 2017 10:25:09 GMT and should not be manually modified.
+
+## 5.0.14
+Fri, 27 Oct 2017 10:25:09 GMT
+
+### Patches
+
+- Fixed initializeIcons call to pull from cdn instead of dist.
 
 ## 5.0.13
 Tue, 24 Oct 2017 10:21:08 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 76ae495f98333..b40a3ee2dda3f 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.0.13",
+  "version": "5.0.14",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.15.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.16.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 0738caef173aa..761c8482da2c7 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.14.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.16.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index a84a44eefb871..3cdeeb770dfc4 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.14.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.16.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 2582fc43f7854..8a8c604920e4a 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.14.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.16.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 649725780aee5..82d6a8077a1d0 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.14.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.16.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/example-app-base/phkuo-tgPerf_2017-10-26-03-29.json b/common/changes/@uifabric/example-app-base/phkuo-tgPerf_2017-10-26-03-29.json
deleted file mode 100644
index bd4f77495b1bf..0000000000000
--- a/common/changes/@uifabric/example-app-base/phkuo-tgPerf_2017-10-26-03-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/phkuo-tgPerf_2017-10-26-03-29.json b/common/changes/@uifabric/experiments/phkuo-tgPerf_2017-10-26-03-29.json
deleted file mode 100644
index 8b47ce48184d1..0000000000000
--- a/common/changes/@uifabric/experiments/phkuo-tgPerf_2017-10-26-03-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/experiments",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/initializeicons-fix_2017-10-26-18-53.json b/common/changes/@uifabric/fabric-website/initializeicons-fix_2017-10-26-18-53.json
deleted file mode 100644
index cbad524672d2e..0000000000000
--- a/common/changes/@uifabric/fabric-website/initializeicons-fix_2017-10-26-18-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Fixed initializeIcons call to pull from cdn instead of dist.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/phkuo-tgPerf_2017-10-26-03-29.json b/common/changes/@uifabric/fabric-website/phkuo-tgPerf_2017-10-26-03-29.json
deleted file mode 100644
index 3d260bd7a567b..0000000000000
--- a/common/changes/@uifabric/fabric-website/phkuo-tgPerf_2017-10-26-03-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/phkuo-tgPerf_2017-10-26-03-29.json b/common/changes/@uifabric/icons/phkuo-tgPerf_2017-10-26-03-29.json
deleted file mode 100644
index ad14cc3dff257..0000000000000
--- a/common/changes/@uifabric/icons/phkuo-tgPerf_2017-10-26-03-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/icons",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/icons",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/jest-serializer-merge-styles/phkuo-tgPerf_2017-10-26-03-29.json b/common/changes/@uifabric/jest-serializer-merge-styles/phkuo-tgPerf_2017-10-26-03-29.json
deleted file mode 100644
index e235ae362c1b9..0000000000000
--- a/common/changes/@uifabric/jest-serializer-merge-styles/phkuo-tgPerf_2017-10-26-03-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/jest-serializer-merge-styles",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/jest-serializer-merge-styles",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/phkuo-tgPerf_2017-10-26-03-29.json b/common/changes/@uifabric/merge-styles/phkuo-tgPerf_2017-10-26-03-29.json
deleted file mode 100644
index 8857a0239222a..0000000000000
--- a/common/changes/@uifabric/merge-styles/phkuo-tgPerf_2017-10-26-03-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/merge-styles",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/panel-navigation-layout_2017-10-25-18-58.json b/common/changes/@uifabric/styling/panel-navigation-layout_2017-10-25-18-58.json
deleted file mode 100644
index 9742a96348acc..0000000000000
--- a/common/changes/@uifabric/styling/panel-navigation-layout_2017-10-25-18-58.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Added IconFontSizes",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/phkuo-tgPerf_2017-10-26-03-29.json b/common/changes/@uifabric/styling/phkuo-tgPerf_2017-10-26-03-29.json
deleted file mode 100644
index 581caa0e9c26b..0000000000000
--- a/common/changes/@uifabric/styling/phkuo-tgPerf_2017-10-26-03-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/bekaise-ariaHidden_2017-10-26-19-49.json b/common/changes/office-ui-fabric-react/bekaise-ariaHidden_2017-10-26-19-49.json
deleted file mode 100644
index 369934539de4c..0000000000000
--- a/common/changes/office-ui-fabric-react/bekaise-ariaHidden_2017-10-26-19-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add ariaHidden prop to buttons",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "bekaise@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/cicciodm-navlink-force-anchor_2017-10-24-15-21.json b/common/changes/office-ui-fabric-react/cicciodm-navlink-force-anchor_2017-10-24-15-21.json
deleted file mode 100644
index ee25c8998f6ac..0000000000000
--- a/common/changes/office-ui-fabric-react/cicciodm-navlink-force-anchor_2017-10-24-15-21.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Restore forceAnchor prop for INavLink elements",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "frdim@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/cicciodm-onkeydown-search-fix_2017-10-23-08-32.json b/common/changes/office-ui-fabric-react/cicciodm-onkeydown-search-fix_2017-10-23-08-32.json
deleted file mode 100644
index 31083eb919985..0000000000000
--- a/common/changes/office-ui-fabric-react/cicciodm-onkeydown-search-fix_2017-10-23-08-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SearchBox onKeyDown: prevent default events only when specified by the user",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "frdim@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/panel-navigation-layout_2017-10-25-18-58.json b/common/changes/office-ui-fabric-react/panel-navigation-layout_2017-10-25-18-58.json
deleted file mode 100644
index 5733818559c46..0000000000000
--- a/common/changes/office-ui-fabric-react/panel-navigation-layout_2017-10-25-18-58.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Panel: changed navigation layout to use flexbox, and pass overrides directly into button to avoid load order issues",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/phkuo-tgPerf_2017-10-26-03-29.json b/common/changes/office-ui-fabric-react/phkuo-tgPerf_2017-10-26-03-29.json
deleted file mode 100644
index 0750d387eb012..0000000000000
--- a/common/changes/office-ui-fabric-react/phkuo-tgPerf_2017-10-26-03-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Theme Generator: improve perf",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 1c2c8f237c1fb..ea849ec8d6c4b 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -38,7 +38,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.5.0 <6.0.0",
+    "@uifabric/styling": ">=5.6.0 <6.0.0",
     "@uifabric/utilities": ">=5.3.0 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 1e71860da8d4f..c880d80fe2c39 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.14.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.16.0 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/icons/package.json b/packages/icons/package.json
index ff3cfe6b83468..f1cb8d903269f 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -23,7 +23,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.5.0 <6.0.0",
+    "@uifabric/styling": ">=5.6.0 <6.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index a19406a5316d4..4da188a1d505e 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,47 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.16.0",
+      "tag": "office-ui-fabric-react_v5.16.0",
+      "date": "Fri, 27 Oct 2017 10:25:09 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Benjamin Kaiser <benjaminjkaiser@gmail.com>",
+            "commit": "81a0fdc4a00eec06237189754ed6b45244a408dd",
+            "comment": "Add ariaHidden prop to buttons"
+          }
+        ],
+        "patch": [
+          {
+            "author": "cicciodm <f.dimauro92@gmail.com>",
+            "commit": "f0cf2e1a6ffb194a670e9faf6316f304b9677671",
+            "comment": "Restore forceAnchor prop for INavLink elements"
+          },
+          {
+            "author": "cicciodm <f.dimauro92@gmail.com>",
+            "commit": "a2893c4b4372a2b752b2c58273e8380a8806e69d",
+            "comment": "SearchBox onKeyDown: prevent default events only when specified by the user"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "02f5ef74858d988b0e5f48a32a688ea65c93b7d2",
+            "comment": "Panel: changed navigation layout to use flexbox, and pass overrides directly into button to avoid load order issues"
+          },
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "86fe40e75d27d61869a4cc005f21257104fa7bf8",
+            "comment": "Theme Generator: improve perf"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.5.0 <6.0.0` to `>=5.6.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.15.0",
       "tag": "office-ui-fabric-react_v5.15.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index c2154c4907fd6..33517ed3b0136 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,20 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 26 Oct 2017 10:21:37 GMT and should not be manually modified.
+This log was last generated on Fri, 27 Oct 2017 10:25:09 GMT and should not be manually modified.
+
+## 5.16.0
+Fri, 27 Oct 2017 10:25:09 GMT
+
+### Minor changes
+
+- Add ariaHidden prop to buttons
+
+### Patches
+
+- Restore forceAnchor prop for INavLink elements
+- SearchBox onKeyDown: prevent default events only when specified by the user
+- Panel: changed navigation layout to use flexbox, and pass overrides directly into button to avoid load order issues
+- Theme Generator: improve perf
 
 ## 5.15.0
 Thu, 26 Oct 2017 10:21:37 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 792cb2c430c8d..a882d2b1b950b 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.15.0",
+  "version": "5.16.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,7 +47,7 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.5.0 <6.0.0",
-    "@uifabric/styling": ">=5.5.0 <6.0.0",
+    "@uifabric/styling": ">=5.6.0 <6.0.0",
     "@uifabric/utilities": ">=5.3.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 7764a191f0329..370f1efe67b3f 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.6.0",
+      "tag": "@uifabric/styling_v5.6.0",
+      "date": "Fri, 27 Oct 2017 10:25:09 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "02f5ef74858d988b0e5f48a32a688ea65c93b7d2",
+            "comment": "Added IconFontSizes"
+          }
+        ]
+      }
+    },
     {
       "version": "5.5.0",
       "tag": "@uifabric/styling_v5.5.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 1163aeed8516b..8dfd47d3167e5 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 26 Oct 2017 10:21:37 GMT and should not be manually modified.
+This log was last generated on Fri, 27 Oct 2017 10:25:09 GMT and should not be manually modified.
+
+## 5.6.0
+Fri, 27 Oct 2017 10:25:09 GMT
+
+### Minor changes
+
+- Added IconFontSizes
 
 ## 5.5.0
 Thu, 26 Oct 2017 10:21:37 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 70a76ac8d4c85..8f1289629c2ff 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.5.0",
+  "version": "5.6.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 04e2417775c4fbecde899ac219fb7b1467a84dbc Mon Sep 17 00:00:00 2001
From: Alex Bettadapur <alexbettadapur@gmail.com>
Date: Fri, 27 Oct 2017 11:40:42 -0700
Subject: [PATCH 0939/1641] ComboBox: Check offsetParent exists before calling
 scrollIntoView (#3187)

* Fix null exceptions under test

* Changes

* Fix scroll behavior
---
 .../comboBoxOffsetParent_2017-10-22-22-02.json        | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.tsx              |  6 +++---
 .../src/components/ComboBox/VirtualizedComboBox.tsx   |  1 +
 3 files changed, 15 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/comboBoxOffsetParent_2017-10-22-22-02.json

diff --git a/common/changes/office-ui-fabric-react/comboBoxOffsetParent_2017-10-22-22-02.json b/common/changes/office-ui-fabric-react/comboBoxOffsetParent_2017-10-22-22-02.json
new file mode 100644
index 0000000000000..8f0026d9f784b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/comboBoxOffsetParent_2017-10-22-22-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixed an issue where ComboBox would throw an exception under shallow rendering tests",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "alexbettadapur@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 013c55f8d10e7..ff36b668a6ce9 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -927,11 +927,11 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     if (onScrollToItem) {
       // Use the custom scroll handler
       onScrollToItem((currentPendingValueValidIndex >= 0 || currentPendingValue !== '') ? currentPendingValueValidIndex : selectedIndex);
-    } else {
+    } else if (this._selectedElement && this._selectedElement.offsetParent) {
       // We are using refs, scroll the ref into view
-      if (this._selectedElement && scrollSelectedToTop) {
+      if (scrollSelectedToTop) {
         this._selectedElement.offsetParent.scrollIntoView(true);
-      } else if (this._selectedElement) {
+      } else {
         let alignToTop = true;
 
         if (this._comboBoxMenu.offsetParent) {
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx
index 0017a4cf9163e..d0693229ba702 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx
@@ -37,6 +37,7 @@ export class VirtualizedComboBox extends BaseComponent<IComboBoxProps, {}> {
     );
   }
 
+  @autobind
   protected _onScrollToItem(itemIndex: number): void {
     // We are using the List component, call scrollToIndex
     this._list.scrollToIndex(itemIndex);

From 7f4ece990b065b1d43ec71cd4d4615b5ede0d082 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20Tenn=C3=B8e?= <mariust@outlook.com>
Date: Fri, 27 Oct 2017 23:35:27 +0200
Subject: [PATCH 0940/1641] Reserve red as a color in the personacoin color
 palette (#3249)

* Make red a reserved color for the PersonaCoin, so it can only be used if you override the personacoint color

* Commit change file

* Updated tests

* Fixed typo

* Fixed another broken test
---
 ...-reserve_red_in_personacoin_2017-10-26-14-19.json |  9 +++++++++
 .../Facepile/__snapshots__/Facepile.test.tsx.snap    |  2 +-
 .../src/components/Persona/Persona.Props.ts          |  3 +++
 .../src/components/Persona/Persona.test.tsx          | 12 ++++++------
 .../src/components/Persona/PersonaCoin.tsx           |  6 ++++--
 .../Persona/__snapshots__/Persona.test.tsx.snap      |  2 +-
 6 files changed, 24 insertions(+), 10 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/mtennoe-reserve_red_in_personacoin_2017-10-26-14-19.json

diff --git a/common/changes/office-ui-fabric-react/mtennoe-reserve_red_in_personacoin_2017-10-26-14-19.json b/common/changes/office-ui-fabric-react/mtennoe-reserve_red_in_personacoin_2017-10-26-14-19.json
new file mode 100644
index 0000000000000..04dd16a3aa013
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/mtennoe-reserve_red_in_personacoin_2017-10-26-14-19.json
@@ -0,0 +1,9 @@
+{
+  "changes": [{
+    "packageName": "office-ui-fabric-react",
+    "comment": "Make red a reserved color for the PersonaCoin so it can only be used if you override the personacoin color",
+    "type": "minor"
+  }],
+  "packageName": "office-ui-fabric-react",
+  "email": "mariust@outlook.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
index 94ddf45cfc11c..cef3b7690adf9 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
@@ -122,7 +122,7 @@ exports[`Facepile Render personas and buttons renders Facepile correctly 1`] = `
             >
               <div
                 aria-hidden="true"
-                className="ms-Persona-initials ms-Persona-initials--black undefined"
+                className="ms-Persona-initials ms-Persona-initials--darkGreen undefined"
                 style={undefined}
               >
                 <span>
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts b/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
index d89cf1e309bb9..f209bf8f8e1fe 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
@@ -166,6 +166,9 @@ export enum PersonaInitialsColor {
   purple = 10,
   black = 11,
   orange = 12,
+  /**
+   * Red is a color that often has a special meaning, so it is considered a reserved color and can only be set with overrides
+   */
   red = 13,
   darkRed = 14
 }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
index eae127131ecbc..4ffbe768123c8 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
@@ -8,9 +8,9 @@ import { mount, ReactWrapper } from 'enzyme';
 
 const testImage1x1 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQImWP4DwQACfsD/eNV8pwAAAAASUVORK5CYII=';
 const STYLES = {
-  darkRed: '.ms-Persona-initials--darkRed',
+  green: '.ms-Persona-initials--green',
   initials: '.ms-Persona-initials',
-  lightBlue: '.ms-Persona-initials--lightBlue',
+  black: '.ms-Persona-initials--black',
   red: '.ms-Persona-initials--red',
 
 };
@@ -35,17 +35,17 @@ describe('Persona', () => {
   describe('initials and colors', () => {
     it('renders with expected initialsColor if none was provided', () => {
       const wrapper = mount(<Persona primaryText='Kat Larrson' />);
-      let result = wrapper.find(STYLES.red);
+      let result = wrapper.find(STYLES.black);
       expect(result).toHaveLength(1);
 
       const wrapper2 = mount(<Persona primaryText='Annie Lindqvist' />);
-      result = wrapper2.find(STYLES.darkRed);
+      result = wrapper2.find(STYLES.green);
       expect(result).toHaveLength(1);
     });
 
     it('uses provided initialsColor if one was specified', () => {
-      const wrapper = mount(<Persona primaryText='Kat Larrson' initialsColor={ PersonaInitialsColor.lightBlue } />);
-      let result = wrapper.find(STYLES.lightBlue);
+      const wrapper = mount(<Persona primaryText='Kat Larrson' initialsColor={ PersonaInitialsColor.red } />);
+      let result = wrapper.find(STYLES.red);
       expect(result).toHaveLength(1);
     });
 
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
index 2391c518176ad..89a2750c7d11c 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
@@ -33,6 +33,9 @@ const SIZE_TO_PIXELS = {
   [PersonaSize.extraLarge]: 100
 };
 
+/**
+ * Red is a color that often has a special meaning, so it is considered a reserved color and can only be set with overrides
+ */
 const COLOR_SWATCHES_LOOKUP: PersonaInitialsColor[] = [
   PersonaInitialsColor.lightGreen,
   PersonaInitialsColor.lightBlue,
@@ -47,8 +50,7 @@ const COLOR_SWATCHES_LOOKUP: PersonaInitialsColor[] = [
   PersonaInitialsColor.blue,
   PersonaInitialsColor.darkBlue,
   PersonaInitialsColor.orange,
-  PersonaInitialsColor.darkRed,
-  PersonaInitialsColor.red
+  PersonaInitialsColor.darkRed
 ];
 
 const COLOR_SWATCHES_NUM_ENTRIES = COLOR_SWATCHES_LOOKUP.length;
diff --git a/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap
index e867e7c4ef7d9..1cf36a0814c45 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap
@@ -107,7 +107,7 @@ exports[`Persona renders Persona correctly with initials 1`] = `
     >
       <div
         aria-hidden="true"
-        className="ms-Persona-initials ms-Persona-initials--red undefined"
+        className="ms-Persona-initials ms-Persona-initials--black undefined"
         style={undefined}
       >
         <span>

From 1fa2b61ec7db61acd4a12c8d623f99954f8d8252 Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Fri, 27 Oct 2017 14:55:06 -0700
Subject: [PATCH 0941/1641] Theming: standard button semantic slots, fix
 disabled colors (#3206)

* wip

* wip

* fix slot

* finish sass

* less is more

* change files

* fix disabled colors according to design

* Update phkuo-moreSemantics_2017-10-24-00-39.json

* Update phkuo-moreSemantics_2017-10-24-00-39.json
---
 .../phkuo-moreSemantics_2017-10-24-00-39.json | 11 +++
 .../phkuo-moreSemantics_2017-10-24-00-39.json | 11 +++
 .../src/common/_semanticSlots.scss            | 16 ++++-
 .../components/Button/BaseButton.styles.ts    | 16 +++--
 .../src/components/Button/ButtonThemes.ts     | 34 ++++++---
 .../components/ChoiceGroup/ChoiceGroup.scss   |  4 +-
 .../ContextualMenu/ContextualMenu.styles.ts   |  4 +-
 .../src/components/Label/Label.classNames.ts  |  2 +-
 .../SpinButton/SpinButton.styles.ts           |  9 ++-
 .../SwatchColorPicker/SwatchColorPicker.scss  |  4 +-
 .../src/components/TextField/TextField.scss   |  2 +-
 .../ThemeGenerator/ThemeRulesStandard.ts      |  2 +-
 .../components/Toggle/Toggle.classNames.ts    |  2 +-
 .../styling/src/interfaces/ISemanticColors.ts | 70 ++++++++++++++++---
 packages/styling/src/styles/theme.ts          | 18 ++++-
 15 files changed, 160 insertions(+), 45 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/phkuo-moreSemantics_2017-10-24-00-39.json
 create mode 100644 common/changes/office-ui-fabric-react/phkuo-moreSemantics_2017-10-24-00-39.json

diff --git a/common/changes/@uifabric/styling/phkuo-moreSemantics_2017-10-24-00-39.json b/common/changes/@uifabric/styling/phkuo-moreSemantics_2017-10-24-00-39.json
new file mode 100644
index 0000000000000..1c20678e2034f
--- /dev/null
+++ b/common/changes/@uifabric/styling/phkuo-moreSemantics_2017-10-24-00-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Adding Button related semantic slots.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "phkuo@microsoft.com"
+}
diff --git a/common/changes/office-ui-fabric-react/phkuo-moreSemantics_2017-10-24-00-39.json b/common/changes/office-ui-fabric-react/phkuo-moreSemantics_2017-10-24-00-39.json
new file mode 100644
index 0000000000000..bd15d65f5ad93
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/phkuo-moreSemantics_2017-10-24-00-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Adjustments made to the disabled text color for Toggle and Checkbox.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "phkuo@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/common/_semanticSlots.scss b/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
index 64813f104e932..2ea780d36c6cd 100644
--- a/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
+++ b/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
@@ -1,12 +1,13 @@
 /* Base slots */
 $bodyBackgroundColor: "[theme:bodyBackground, default: #ffffff]";
 $bodyTextColor: "[theme:bodyText, default: #333333]";
-$bodySelectedTextColor: "[theme:bodySelectedText, default: #000000]";
+$bodyTextCheckedColor: "[theme:bodyTextChecked, default: #000000]";
 $bodySubtextColor: "[theme:bodySubtext, default: #666666]";
 $bodyDividerColor: "[theme:bodyDivider, default: #eaeaea]";
 
 $disabledBackgroundColor: "[theme:disabledBackground, default: #f4f4f4]";
-$disabledTextColor: "[theme:disabledText, default: #c8c8c8]";
+$disabledTextColor: "[theme:disabledText, default: #a6a6a6]";
+$disabledBodyTextColor: "[theme:disabledText, default: #c8c8c8]";
 $disabledSubtextColor: "[theme:disabledSubtext, default: #dadada]";
 
 $focusBorderColor: "[theme:focusBorder, default: #000000]";
@@ -26,6 +27,17 @@ $inputBackgroundCheckedHoveredColor: "[theme:inputBackgroundCheckedHovered, defa
 $inputForegroundCheckedColor: "[theme:inputForegroundChecked, default: #ffffff]";
 $inputFocusBorderAltColor: "[theme:inputFocusBorderAlt, default: #0078d7]";
 
+/* Buttons */
+$buttonBackgroundColor: "[theme:buttonBackground, default: #f4f4f4]";
+$buttonBackgroundCheckedColor: "[theme:buttonBackgroundChecked, default: #c8c8c8]";
+$buttonBackgroundHoveredColor: "[theme:buttonBackgroundHovered, default: #eaeaea]";
+$buttonBackgroundCheckedHoveredColor: "[theme:buttonBackgroundCheckedHovered, default: #eaeaea]";
+$buttonBorderColor: "[theme:buttonBorder, default: transparent]";
+$buttonTextColor: "[theme:buttonText, default: #333333]";
+$buttonTextHoveredColor: "[theme:buttonTextHovered, default: #000000]";
+$buttonTextCheckedColor: "[theme:buttonTextChecked, default: #212121]";
+$buttonTextCheckedHoveredColor: "[theme:buttonTextCheckedHovered, default: #000000]";
+
 /* Menus */
 $menuItemBackgroundHoveredColor: "[theme:menuItemBackgroundHovered, default: #f8f8f8]";
 $menuItemBackgroundCheckedColor: "[theme:menuItemBackgroundChecked, default: #d0d0d0]";
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
index 601234f83836d..d09692d6ef202 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
@@ -29,15 +29,19 @@ const iconStyle = {
 export const getStyles = memoizeFunction((
   theme: ITheme
 ): IButtonStyles => {
+  let { semanticColors } = theme;
+
+  let border = semanticColors.buttonBorder;
+  let disabledBackground = semanticColors.disabledBackground;
+  let disabledText = semanticColors.disabledText;
 
   return {
     root: [
       getFocusStyle(theme, -1),
       theme.fonts.medium,
       {
-        // this transparent border converts to the correct colors in HC mode
         boxSizing: 'border-box',
-        border: '1px solid transparent',
+        border: '1px solid ' + border,
         userSelect: 'none',
         display: 'inline-block',
         textDecoration: 'none',
@@ -50,8 +54,8 @@ export const getStyles = memoizeFunction((
     ],
 
     rootDisabled: {
-      backgroundColor: theme.palette.neutralLighter,
-      color: theme.palette.neutralTertiary,
+      backgroundColor: disabledBackground,
+      color: disabledText,
       cursor: 'default',
       pointerEvents: 'none',
       selectors: {
@@ -61,11 +65,11 @@ export const getStyles = memoizeFunction((
     },
 
     iconDisabled: {
-      color: theme.palette.neutralTertiary
+      color: disabledText
     },
 
     menuIconDisabled: {
-      color: theme.palette.neutralTertiary
+      color: disabledText
     },
 
     flexContainer: {
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts b/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
index 047fab19a3445..884b8faf2c17c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
@@ -2,35 +2,47 @@ import { IButtonStyles } from './Button.Props';
 import { ITheme } from '../../Styling';
 
 export function standardStyles(theme: ITheme): IButtonStyles {
+  let s = theme.semanticColors;
+
+  let buttonBackground = s.buttonBackground;
+  let buttonBackgroundChecked = s.buttonBackgroundChecked;
+  let buttonBackgroundHovered = s.buttonBackgroundHovered;
+  let buttonBackgroundCheckedHovered = s.buttonBackgroundCheckedHovered;
+
+  let buttonText = s.buttonText;
+  let buttonTextHovered = s.buttonTextHovered;
+  let buttonTextChecked = s.buttonTextChecked;
+  let buttonTextCheckedHovered = s.buttonTextCheckedHovered;
+
   return {
     root: {
-      backgroundColor: theme.palette.neutralLighter,
-      color: theme.palette.neutralPrimary
+      backgroundColor: buttonBackground,
+      color: buttonText
     },
 
     rootHovered: {
-      backgroundColor: theme.palette.neutralLight,
-      color: theme.palette.black
+      backgroundColor: buttonBackgroundHovered,
+      color: buttonTextHovered
     },
 
     rootPressed: {
-      backgroundColor: theme.palette.neutralTertiaryAlt,
-      color: theme.palette.neutralDark
+      backgroundColor: buttonBackgroundChecked,
+      color: buttonTextChecked
     },
 
     rootExpanded: {
-      backgroundColor: theme.palette.neutralTertiaryAlt,
-      color: theme.palette.neutralDark
+      backgroundColor: buttonBackgroundChecked,
+      color: buttonTextChecked
     },
 
     rootChecked: {
-      backgroundColor: theme.palette.neutralTertiaryAlt,
-      color: theme.palette.neutralDark
+      backgroundColor: buttonBackgroundChecked,
+      color: buttonTextChecked
     },
 
     rootCheckedHovered: {
       backgroundColor: theme.palette.neutralLight,
-      color: theme.palette.black
+      color: buttonTextCheckedHovered
     },
 
     // Split button styles
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
index 5afa8785cbac8..793ecc89b90d0 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
@@ -10,7 +10,7 @@
 $radioButton-background-color: $bodyBackgroundColor;
 
 $radioButton-text-color: $bodyTextColor;
-$radioButton-text-hover-color: $bodySelectedTextColor;
+$radioButton-text-hover-color: $bodyTextCheckedColor;
 
 $radioButton-dot-color: $inputBackgroundCheckedColor;
 
@@ -19,7 +19,7 @@ $radioButton-border-hover-color: $inputBorderHoveredColor;
 $radioButton-border-selected-color: $radioButton-dot-color;
 $radioButton-border-selected-hover-color: $inputBackgroundCheckedHoveredColor;
 
-$radioButton-text-disabled-color: $disabledTextColor;
+$radioButton-text-disabled-color: $disabledBodyTextColor;
 $radioButton-background-unselected-disabled-color: $disabledTextColor;
 $radioButton-dot-disabled-color: $radioButton-background-unselected-disabled-color;
 $radioButton-border-disabled-color: $radioButton-background-unselected-disabled-color;
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
index 4f689ad7d250d..a40a5f68d414b 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
@@ -36,8 +36,8 @@ export const getMenuItemStyles = memoizeFunction((
   const ContextualMenuTextColor = semanticColors.bodyText;
   const ContextualMenuItemBackgroundHoverColor = semanticColors.menuItemBackgroundHovered;
   const ContextualMenuItemBackgroundSelectedColor = semanticColors.menuItemBackgroundChecked;
-  const ContextualMenuTextSelectedColor = semanticColors.bodySelectedText;
-  const ContextualMenuTextDisabledColor = semanticColors.disabledText;
+  const ContextualMenuTextSelectedColor = semanticColors.bodyTextChecked;
+  const ContextualMenuTextDisabledColor = semanticColors.disabledBodyText;
   const ContextualMenuDividerColor = semanticColors.bodyDivider;
   const SplitButtonDividerHeight = 16;
 
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.classNames.ts b/packages/office-ui-fabric-react/src/components/Label/Label.classNames.ts
index a5026cb0c1e60..2ccc60c7066be 100644
--- a/packages/office-ui-fabric-react/src/components/Label/Label.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Label/Label.classNames.ts
@@ -22,7 +22,7 @@ export const getLabelClassNames = memoizeFunction((theme: ITheme, className: str
         overflowWrap: 'break-word',
       },
       disabled && {
-        color: theme.semanticColors.disabledText,
+        color: theme.semanticColors.disabledBodyText,
         selectors: {
           [MS_HIGHCONTRAST_ACTIVE]: {
             color: 'GrayText'
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
index 988daf66eabf1..aa4ec7756bf1e 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
@@ -12,15 +12,14 @@ import { memoizeFunction } from '../../Utilities';
 const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
 
 const _getDisabledStyles = memoizeFunction((theme: ITheme): IRawStyle => {
-  const { palette } = theme;
+  const { semanticColors } = theme;
 
-  const SpinButtonTextColorDisabled = palette.neutralTertiaryAlt;
-  const SpinButtonBackgroundColorDisabled = palette.neutralLighter;
-  const SpinButtonBorderColorDisabled = palette.neutralLighter;
+  const SpinButtonTextColorDisabled = semanticColors.disabledText;
+  const SpinButtonBackgroundColorDisabled = semanticColors.disabledBackground;
 
   return {
     backgroundColor: SpinButtonBackgroundColorDisabled,
-    borderColor: SpinButtonBorderColorDisabled,
+    borderColor: 'transparent',
     pointerEvents: 'none',
     cursor: 'default',
     color: SpinButtonTextColorDisabled,
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
index 0a699f439a72f..9f7fc07da0e87 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
@@ -42,7 +42,7 @@
   }
   &.disabled,
   &[disabled] {
-    color: $disabledTextColor;
+    color: $disabledBodyTextColor;
     cursor: default;
     pointer-events: none;
   }
@@ -112,7 +112,7 @@
 
     &.disabled,
   &[disabled] {
-    color: $disabledTextColor;
+    color: $disabledBodyTextColor;
     cursor: default;
     pointer-events: none;
     opacity: .3;
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index 72e25b1035fe0..7edc5413b58eb 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -22,7 +22,7 @@ $field-text-color: $bodyTextColor;
 $field-text-disabled-color: $disabledTextColor;
 
 $field-placeholder-color: $bodySubtextColor;
-$field-placeholder-disabled-color: $disabledSubtextColor;
+$field-placeholder-disabled-color: $disabledTextColor;
 
 $field-description-color: $bodySubtextColor;
 $field-error-color: $errorTextColor;
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
index 15ef8a67ed633..38a122110f205 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
@@ -208,7 +208,7 @@ export function themeRulesStandardCreator() {
     inherits.dependentRules.push(thisSlotRule);
   }
 
-  // Basics simple content slots
+  // Basic simple slots
   _makeSemanticSlotRule(SemanticColorSlots.bodyBackground, FabricSlots.white);
   _makeSemanticSlotRule(SemanticColorSlots.bodyText, FabricSlots.neutralPrimary);
   _makeSemanticSlotRule(SemanticColorSlots.disabledBackground, FabricSlots.neutralLighter);
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
index d7a6937361808..78420b5ba9ca3 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
@@ -36,7 +36,7 @@ export const getClassNames = memoizeFunction((
   const pillBorderColor = semanticColors.inputBorder;
   const pillBorderHoveredColor = semanticColors.inputBorderHovered;
   const pillBorderDisabledColor = semanticColors.disabledText;
-  const textDisabledColor = semanticColors.disabledText;
+  const textDisabledColor = semanticColors.disabledBodyText;
 
   styles = styles || {};
 
diff --git a/packages/styling/src/interfaces/ISemanticColors.ts b/packages/styling/src/interfaces/ISemanticColors.ts
index 2d6bff3d563a1..914a3dcae96af 100644
--- a/packages/styling/src/interfaces/ISemanticColors.ts
+++ b/packages/styling/src/interfaces/ISemanticColors.ts
@@ -32,6 +32,10 @@
  * This category contains input components commonly used to denote state, including radio buttons,
  * check boxes, toggle switches, sliders, progress bars, and more.
  *
+ * ## Buttons
+ *
+ * Buttons! And all the flavors thereof.
+ *
  * ## Menus
  *
  * Any kind of popup menus uses this category.
@@ -58,9 +62,9 @@ export interface ISemanticColors {
   bodyText: string;
 
   /**
-   * Selected text color, e.g. selected menu item text.
+   * Checked text color, e.g. selected menu item text.
    */
-  bodySelectedText: string;
+  bodyTextChecked: string;
 
   /**
    * De-emphasized text; e.g. metadata, captions, placeholder text.
@@ -78,12 +82,17 @@ export interface ISemanticColors {
   disabledBackground: string;
 
   /**
-   * The default color for disabled text; e.g. user input inside a disabled text field.
+   * The default color for disabled text on top of disabledBackground; e.g. text in a disabled text field, disabled button text.
    */
   disabledText: string;
 
   /**
-   * Disabled de-emphasized text; e.g. placeholder text inside disabled input field.
+   * The default color for disabled text on the default background (bodyBackground).
+   */
+  disabledBodyText: string;
+
+  /**
+   * Disabled de-emphasized text, for use on disabledBackground.
    */
   disabledSubtext: string;
 
@@ -95,13 +104,17 @@ export interface ISemanticColors {
   //// Invariants - slots that rarely change color theme-to-theme because the color has meaning
 
   /**
-   * The background for errors, if necessary, or highlighting the section of the page where the error is present.
+   * The default color of error text, used on bodyBackground.
    */
-  errorBackground: string;
+  errorText: string;
   /**
-   * The default color of error text.
+   * The color of text on errorBackground, warningBackground, blockingBackground, or successBackground.
    */
-  errorText: string;
+  warningText: string;
+  /**
+   * The background for errors, if necessary, or highlighting the section of the page where the error is present.
+   */
+  errorBackground: string;
   /**
    * Background for blocking issues, which is more severe than a warning, but not as bad as an error.
    */
@@ -151,6 +164,47 @@ export interface ISemanticColors {
    */
   inputFocusBorderAlt: string;
 
+  //// Buttons
+
+  /**
+   * Background of a standard button
+   */
+  buttonBackground: string;
+  /**
+   * Background of a hovered standard button
+   */
+  buttonBackgroundHovered: string;
+  /**
+   * Background of a checked standard button; e.g. bold/italicize/underline text button in toolbar
+   */
+  buttonBackgroundChecked: string;
+  /**
+   * Background of a checked and hovered standard button; e.g. bold/italicize/underline text button in toolbar
+   */
+  buttonBackgroundCheckedHovered: string;
+
+  /**
+   * Border of a standard button
+   */
+  buttonBorder: string;
+
+  /**
+   * Color of text in a standard button
+   */
+  buttonText: string;
+  /**
+   * Color of text in a hovered standard button
+   */
+  buttonTextHovered: string;
+  /**
+   * Color of text in a checked standard button
+   */
+  buttonTextChecked: string;
+  /**
+   * Color of text in a checked and hovered standard button
+   */
+  buttonTextCheckedHovered: string;
+
   //// Menus, popups, etc
 
   /**
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index 0b2522017b556..ad11e2f170135 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -83,18 +83,20 @@ function _makeSemanticColorsFromPalette(p: IPalette, isInverted: boolean): ISema
   return {
     bodyBackground: p.white,
     bodyText: p.neutralPrimary,
-    bodySelectedText: p.black,
+    bodyTextChecked: p.black,
     bodySubtext: p.neutralSecondary,
     bodyDivider: p.neutralLight,
 
     disabledBackground: p.neutralLighter,
-    disabledText: p.neutralTertiaryAlt,
+    disabledText: p.neutralTertiary,
+    disabledBodyText: p.neutralTertiaryAlt,
     disabledSubtext: p.neutralQuaternary,
 
     focusBorder: p.black,
 
-    errorBackground: !isInverted ? 'rgba(232, 17, 35, .2)' : 'rgba(232, 17, 35, .5)',
     errorText: !isInverted ? p.redDark : '#ff5f5f',
+    warningText: !isInverted ? '#333333' : '#ffffff',
+    errorBackground: !isInverted ? 'rgba(232, 17, 35, .2)' : 'rgba(232, 17, 35, .5)',
     blockingBackground: !isInverted ? 'rgba(234, 67, 0, .2)' : 'rgba(234, 67, 0, .5)',
     warningBackground: !isInverted ? 'rgba(255, 185, 0, .2)' : 'rgba(255, 251, 0, .6)',
     warningHighlight: !isInverted ? '#ffb900' : '#fff100',
@@ -107,6 +109,16 @@ function _makeSemanticColorsFromPalette(p: IPalette, isInverted: boolean): ISema
     inputForegroundChecked: p.white,
     inputFocusBorderAlt: p.themePrimary,
 
+    buttonBackground: p.neutralLighter,
+    buttonBackgroundChecked: p.neutralTertiaryAlt,
+    buttonBackgroundHovered: p.neutralLight,
+    buttonBackgroundCheckedHovered: p.neutralLight,
+    buttonBorder: 'transparent',
+    buttonText: p.neutralPrimary,
+    buttonTextHovered: p.black,
+    buttonTextChecked: p.neutralDark,
+    buttonTextCheckedHovered: p.black,
+
     menuItemBackgroundHovered: p.neutralLighter,
     menuItemBackgroundChecked: p.neutralQuaternaryAlt,
     menuIcon: p.themePrimary,

From 0e5e1405122e2119e651576ca858151fcd369f21 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 30 Oct 2017 03:23:09 -0700
Subject: [PATCH 0942/1641] Applying package updates.

---
 .../phkuo-moreSemantics_2017-10-24-00-39.json | 11 -------
 ...comboBoxOffsetParent_2017-10-22-22-02.json | 11 -------
 ...e_red_in_personacoin_2017-10-26-14-19.json |  9 ------
 .../phkuo-moreSemantics_2017-10-24-00-39.json | 11 -------
 packages/example-app-base/package.json        |  2 +-
 packages/icons/package.json                   |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 31 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 14 ++++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/CHANGELOG.json               | 14 +++++++++
 packages/styling/CHANGELOG.md                 |  9 +++++-
 packages/styling/package.json                 |  2 +-
 12 files changed, 71 insertions(+), 49 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/phkuo-moreSemantics_2017-10-24-00-39.json
 delete mode 100644 common/changes/office-ui-fabric-react/comboBoxOffsetParent_2017-10-22-22-02.json
 delete mode 100644 common/changes/office-ui-fabric-react/mtennoe-reserve_red_in_personacoin_2017-10-26-14-19.json
 delete mode 100644 common/changes/office-ui-fabric-react/phkuo-moreSemantics_2017-10-24-00-39.json

diff --git a/common/changes/@uifabric/styling/phkuo-moreSemantics_2017-10-24-00-39.json b/common/changes/@uifabric/styling/phkuo-moreSemantics_2017-10-24-00-39.json
deleted file mode 100644
index 1c20678e2034f..0000000000000
--- a/common/changes/@uifabric/styling/phkuo-moreSemantics_2017-10-24-00-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Adding Button related semantic slots.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "phkuo@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/comboBoxOffsetParent_2017-10-22-22-02.json b/common/changes/office-ui-fabric-react/comboBoxOffsetParent_2017-10-22-22-02.json
deleted file mode 100644
index 8f0026d9f784b..0000000000000
--- a/common/changes/office-ui-fabric-react/comboBoxOffsetParent_2017-10-22-22-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixed an issue where ComboBox would throw an exception under shallow rendering tests",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "alexbettadapur@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/mtennoe-reserve_red_in_personacoin_2017-10-26-14-19.json b/common/changes/office-ui-fabric-react/mtennoe-reserve_red_in_personacoin_2017-10-26-14-19.json
deleted file mode 100644
index 04dd16a3aa013..0000000000000
--- a/common/changes/office-ui-fabric-react/mtennoe-reserve_red_in_personacoin_2017-10-26-14-19.json
+++ /dev/null
@@ -1,9 +0,0 @@
-{
-  "changes": [{
-    "packageName": "office-ui-fabric-react",
-    "comment": "Make red a reserved color for the PersonaCoin so it can only be used if you override the personacoin color",
-    "type": "minor"
-  }],
-  "packageName": "office-ui-fabric-react",
-  "email": "mariust@outlook.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/phkuo-moreSemantics_2017-10-24-00-39.json b/common/changes/office-ui-fabric-react/phkuo-moreSemantics_2017-10-24-00-39.json
deleted file mode 100644
index bd15d65f5ad93..0000000000000
--- a/common/changes/office-ui-fabric-react/phkuo-moreSemantics_2017-10-24-00-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Adjustments made to the disabled text color for Toggle and Checkbox.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "phkuo@microsoft.com"
-}
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index ea849ec8d6c4b..d312e67cbbb79 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -38,7 +38,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.6.0 <6.0.0",
+    "@uifabric/styling": ">=5.6.1 <6.0.0",
     "@uifabric/utilities": ">=5.3.0 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
diff --git a/packages/icons/package.json b/packages/icons/package.json
index f1cb8d903269f..0690c899281d0 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -23,7 +23,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.6.0 <6.0.0",
+    "@uifabric/styling": ">=5.6.1 <6.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 4da188a1d505e..50e321e984c3e 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,37 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.17.0",
+      "tag": "office-ui-fabric-react_v5.17.0",
+      "date": "Mon, 30 Oct 2017 10:23:09 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Alex Bettadapur <alexbettadapur@gmail.com>",
+            "commit": "04e2417775c4fbecde899ac219fb7b1467a84dbc",
+            "comment": "Fixed an issue where ComboBox would throw an exception under shallow rendering tests"
+          },
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "1fa2b61ec7db61acd4a12c8d623f99954f8d8252",
+            "comment": "Adjustments made to the disabled text color for Toggle and Checkbox."
+          }
+        ],
+        "minor": [
+          {
+            "author": "Marius Tennøe <mariust@outlook.com>",
+            "commit": "7f4ece990b065b1d43ec71cd4d4615b5ede0d082",
+            "comment": "Make red a reserved color for the PersonaCoin so it can only be used if you override the personacoin color"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.6.0 <6.0.0` to `>=5.6.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.16.0",
       "tag": "office-ui-fabric-react_v5.16.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 33517ed3b0136..31fd5e982fbb2 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,18 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 27 Oct 2017 10:25:09 GMT and should not be manually modified.
+This log was last generated on Mon, 30 Oct 2017 10:23:09 GMT and should not be manually modified.
+
+## 5.17.0
+Mon, 30 Oct 2017 10:23:09 GMT
+
+### Minor changes
+
+- Make red a reserved color for the PersonaCoin so it can only be used if you override the personacoin color
+
+### Patches
+
+- Fixed an issue where ComboBox would throw an exception under shallow rendering tests
+- Adjustments made to the disabled text color for Toggle and Checkbox.
 
 ## 5.16.0
 Fri, 27 Oct 2017 10:25:09 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index a882d2b1b950b..1fda081783a8f 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.16.0",
+  "version": "5.17.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,7 +47,7 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.5.0 <6.0.0",
-    "@uifabric/styling": ">=5.6.0 <6.0.0",
+    "@uifabric/styling": ">=5.6.1 <6.0.0",
     "@uifabric/utilities": ">=5.3.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 370f1efe67b3f..a7301ca836f9e 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.6.1",
+      "tag": "@uifabric/styling_v5.6.1",
+      "date": "Mon, 30 Oct 2017 10:23:09 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "1fa2b61ec7db61acd4a12c8d623f99954f8d8252",
+            "comment": "Adding Button related semantic slots."
+          }
+        ]
+      }
+    },
     {
       "version": "5.6.0",
       "tag": "@uifabric/styling_v5.6.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 8dfd47d3167e5..9ddadaab99714 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 27 Oct 2017 10:25:09 GMT and should not be manually modified.
+This log was last generated on Mon, 30 Oct 2017 10:23:09 GMT and should not be manually modified.
+
+## 5.6.1
+Mon, 30 Oct 2017 10:23:09 GMT
+
+### Patches
+
+- Adding Button related semantic slots.
 
 ## 5.6.0
 Fri, 27 Oct 2017 10:25:09 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 8f1289629c2ff..a8ca4d7692665 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.6.0",
+  "version": "5.6.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 16e38393c2392ca763acde433f346dc54f8f28d1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20Tenn=C3=B8e?= <mariust@outlook.com>
Date: Mon, 30 Oct 2017 17:18:44 +0100
Subject: [PATCH 0943/1641] Add code owners for PersonaCoin component (#3264)

* Add code owners for PersonaCoin files

* Update CODEOWNERS

* Update CODEOWNERS

match PersonaCoin and PersonaConstants
---
 .github/CODEOWNERS | 1 +
 1 file changed, 1 insertion(+)

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index e905c613c01d1..26300f59efb22 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -70,6 +70,7 @@
     # packages/office-ui-fabric-react/src/components/Overlay/*
     # packages/office-ui-fabric-react/src/components/Panel/*
     # packages/office-ui-fabric-react/src/components/Persona/*
+    packages/office-ui-fabric-react/src/components/Persona/PersonaCo* @mtennoe @jakob101
     # packages/office-ui-fabric-react/src/components/pickers/*
     # packages/office-ui-fabric-react/src/components/Pivot/*
     # packages/office-ui-fabric-react/src/components/Popup/*

From e637a59d2e79a7d390b03cc574c95a4473ab19d2 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Mon, 30 Oct 2017 10:00:14 -0700
Subject: [PATCH 0944/1641] Website: Support for IconGrid to handle wide icons
 (#3202)

* New icon class on hover with overflow

* Added missin ref

* Added change file
---
 .../components/IconGrid/IconGrid.module.scss  | 16 +++++++++++++-
 .../src/components/IconGrid/IconGrid.tsx      | 21 +++++++++++++------
 .../icon-grid_2017-10-23-22-00.json           | 11 ++++++++++
 3 files changed, 41 insertions(+), 7 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/icon-grid_2017-10-23-22-00.json

diff --git a/apps/fabric-website/src/components/IconGrid/IconGrid.module.scss b/apps/fabric-website/src/components/IconGrid/IconGrid.module.scss
index c03dd2b53a08d..745f06183bb5c 100644
--- a/apps/fabric-website/src/components/IconGrid/IconGrid.module.scss
+++ b/apps/fabric-website/src/components/IconGrid/IconGrid.module.scss
@@ -15,6 +15,7 @@
     justify-content: space-around;
     padding: 8px;
     width: 80px;
+    overflow: hidden;
 
     span {
       color: $ms-color-neutralPrimary;
@@ -24,14 +25,27 @@
     }
 
     &:hover {
+      overflow: visible;
+
       span {
         opacity: 1;
       }
     }
   }
+
+  i {
+    &:hover {
+      z-index: 1;
+
+      &:global(.hoverIcon) {
+        background-color: $ms-color-neutralLight;
+        padding: 0 8px;
+      }
+    }
+  }
 }
 
 .searchBox {
   margin: 20px 0;
   max-width: 320px;
-}
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/components/IconGrid/IconGrid.tsx b/apps/fabric-website/src/components/IconGrid/IconGrid.tsx
index 5f54105c867e5..ece39ae5f5700 100644
--- a/apps/fabric-website/src/components/IconGrid/IconGrid.tsx
+++ b/apps/fabric-website/src/components/IconGrid/IconGrid.tsx
@@ -36,12 +36,21 @@ export class IconGrid extends React.Component<IIconGridProps, IIconGridState> {
         <ul className={ styles.grid }>
           { icons
             .filter(icon => icon.name.toLowerCase().indexOf(searchQuery.toLowerCase()) !== -1)
-            .map((icon, iconIndex) => (
-              <li key={ iconIndex } aria-label={ icon.name + ' icon' }>
-                <i className={ `ms-Icon ms-Icon--${icon.name}` } title={ `${icon.name}` } aria-hidden='true' />
-                <span>{ icon.name }</span>
-              </li>
-            ))
+            .map((icon, iconIndex) => {
+              let iconJsxElement = <i ref={ (`${icon.name}`) } className={ `ms-Icon ms-Icon--${icon.name}` } title={ `${icon.name}` } aria-hidden='true' />;
+              let iconRefElement = this.refs[icon.name] as HTMLElement;
+
+              if (iconRefElement && iconRefElement.offsetWidth > 80) {
+                iconJsxElement = <i ref={ (`${icon.name}`) } className={ `ms-Icon ms-Icon--${icon.name} hoverIcon` } title={ `${icon.name}` } aria-hidden='true' />;
+              }
+
+              return (
+                < li key={ iconIndex } aria-label={ icon.name + ' icon' } >
+                  { iconJsxElement }
+                  <span>{ icon.name }</span>
+                </li>
+              );
+            })
           }
         </ul>
       </div>
diff --git a/common/changes/@uifabric/fabric-website/icon-grid_2017-10-23-22-00.json b/common/changes/@uifabric/fabric-website/icon-grid_2017-10-23-22-00.json
new file mode 100644
index 0000000000000..c012e7e93f39f
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/icon-grid_2017-10-23-22-00.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Added support to IconGrid for icons wider than the grid.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From 0f79556707307194fe9d689e180976a51ee2c433 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Mon, 30 Oct 2017 11:00:13 -0700
Subject: [PATCH 0945/1641] ContextualMenu - allow dismiss to be prevented on
 itemClick. (#3225)

* Mix in onDismiss sent from button menuProps

* changefile

* Allowed dismiss to be turned off via defaultPrevented in item dismiss function

* Change file

* update docs and exampe
---
 .../button-pass-ondismiss_2017-10-23-23-22.json       | 11 +++++++++++
 .../button-pass-ondismiss_2017-10-25-15-24.json       | 11 +++++++++++
 .../components/ContextualMenu/ContextualMenu.Props.ts |  2 +-
 .../src/components/ContextualMenu/ContextualMenu.tsx  |  2 +-
 .../examples/ContextualMenu.Checkmarks.Example.tsx    |  2 +-
 5 files changed, 25 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-23-23-22.json
 create mode 100644 common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-25-15-24.json

diff --git a/common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-23-23-22.json b/common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-23-23-22.json
new file mode 100644
index 0000000000000..ea3c1e9468d8b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-23-23-22.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Button: Pass specified onDismiss callback to contextual menu",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": ""
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-25-15-24.json b/common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-25-15-24.json
new file mode 100644
index 0000000000000..0d4dc1e3732fd
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-25-15-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: Support suppressing dismiss on ItemClick via preventDefault",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
index 12e19f03a7774..743b83a2de3fb 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
@@ -291,7 +291,7 @@ export interface IContextualMenuItem {
   data?: any;
 
   /**
-   * Callback issued when the menu item is invoked
+   * Callback issued when the menu item is invoked. If ev.preventDefault() is called in onClick, click will not close menu
    */
   onClick?: (ev?: React.MouseEvent<HTMLElement>, item?: IContextualMenuItem) => void;
 
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 2251eda75eaa4..ff6c421c07eb7 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -689,7 +689,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       this.props.onItemClick(ev, item);
     }
 
-    this.dismiss(ev, true);
+    !ev.defaultPrevented && this.dismiss(ev, true);
   }
 
   private _onItemKeyDown(item: any, ev: KeyboardEvent) {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
index 83be3982f417e..985bd210e0237 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
@@ -111,7 +111,7 @@ export class ContextualMenuCheckmarksExample extends React.Component<any, IConte
 
   private _onToggleSelect(ev?: React.MouseEvent<HTMLButtonElement>, item?: IContextualMenuItem) {
     let { selection } = this.state;
-
+    ev!.preventDefault();
     selection![item!.key] = !selection![item!.key];
 
     this.setState({

From 051acb67640ad1daede9914b2f217fddd42f621a Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Mon, 30 Oct 2017 14:07:21 -0700
Subject: [PATCH 0946/1641] Documentation: Accessibility policies and best
 practices (#3254)

* acc docs

* add in section on colors

* hc mode: add paragraph about colors and transparent borders
---
 ghdocs/Accessibility.md | 40 ++++++++++++++++++++++++++++++++++++++++
 1 file changed, 40 insertions(+)
 create mode 100644 ghdocs/Accessibility.md

diff --git a/ghdocs/Accessibility.md b/ghdocs/Accessibility.md
new file mode 100644
index 0000000000000..266ae51e2f676
--- /dev/null
+++ b/ghdocs/Accessibility.md
@@ -0,0 +1,40 @@
+# Accessibility
+
+This document describes our policies and methods for supporting accessibility.
+
+## Colors
+
+Default color choices should conform to contrast requirements as laid out in [WCAG 2.0](https://www.w3.org/TR/WCAG20/) level AA recommendations as laid out in section 1.4.3.
+
+## High Contrast
+
+We best support high contrast in Internet Explorer 11 and Microsoft Edge. Mozilla FireFox is also supported to the extent possible barring technical constraints. Read on for more details.
+
+The recommended approach here is to use the correct elements to match your scenario.
+Sometimes, you'll have to use a similar, but not exactly right, element.
+For example, when making a custom checkbox, you can wrap it in a `<button>` element.
+This will cause it to pick up the correct colors in all three supported browsers.
+
+As a backup approach, high contrast colors can be manually applied in CSS.
+These colors should ONLY be from the [System Colors](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#System_Colors) palette.
+The logic on when to apply these colors can vary, from using media queries (see below) or using code to detect when high contrast is on.
+
+The last approach is to use media queries with `-ms-high-contrast` to scope styles to high contrast.
+Since this only work in Internet Explorer and Microsoft Edge, it is not recommended as a general strategy.
+We use this only where necessary, for complex scenarios such as multiselect.
+
+Note that background images can disappear in high contrast mode. Any icons or images that are required for functionality must not be background images.
+
+In high contrast mode, color should not be the only means of conveying feedback.
+A transparent border or outline will appear in high contrast mode, a useful way of denoting focus without affecting non-high contrast visual design.
+
+## Screen Reader
+
+Follow recommended guidelines using [ARIA](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA) to insure the best support for screen readers.
+Where necessary, add in extra text only visible to the screen reader for descriptions and directions, by positioning it off screen.
+
+Our primary support scenario is Microsoft Edge with Windows Narrator.
+
+## Keyboard and Focus
+
+todo
\ No newline at end of file

From 8fbafbdc97de4debff3aa78fb87ddcc6c70c20b4 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 31 Oct 2017 10:22:26 +0000
Subject: [PATCH 0947/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 19 +++++++++++++++++++
 apps/fabric-website/CHANGELOG.md              |  9 ++++++++-
 apps/fabric-website/package.json              |  4 ++--
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../icon-grid_2017-10-23-22-00.json           | 11 -----------
 ...utton-pass-ondismiss_2017-10-23-23-22.json | 11 -----------
 ...utton-pass-ondismiss_2017-10-25-15-24.json | 11 -----------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 14 files changed, 63 insertions(+), 43 deletions(-)
 delete mode 100644 common/changes/@uifabric/fabric-website/icon-grid_2017-10-23-22-00.json
 delete mode 100644 common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-23-23-22.json
 delete mode 100644 common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-25-15-24.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 573cfaac4f27e..6aab8fe21bab0 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.0.15",
+      "tag": "@uifabric/fabric-website_v5.0.15",
+      "date": "Tue, 31 Oct 2017 10:22:25 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "e637a59d2e79a7d390b03cc574c95a4473ab19d2",
+            "comment": "Added support to IconGrid for icons wider than the grid."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.16.0 <6.0.0` to `>=5.17.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.14",
       "tag": "@uifabric/fabric-website_v5.0.14",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index d7144cabf6249..f4357700bebf7 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Fri, 27 Oct 2017 10:25:09 GMT and should not be manually modified.
+This log was last generated on Tue, 31 Oct 2017 10:22:25 GMT and should not be manually modified.
+
+## 5.0.15
+Tue, 31 Oct 2017 10:22:25 GMT
+
+### Patches
+
+- Added support to IconGrid for icons wider than the grid.
 
 ## 5.0.14
 Fri, 27 Oct 2017 10:25:09 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index b40a3ee2dda3f..1b1e3324d0da0 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.0.14",
+  "version": "5.0.15",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.16.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.17.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 761c8482da2c7..472e201b050f4 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.16.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.17.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 3cdeeb770dfc4..86caa1e097d38 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.16.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.17.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 8a8c604920e4a..5a70c7f121d0a 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.16.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.17.1 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 82d6a8077a1d0..416b9e22bafd1 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.16.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.17.1 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/fabric-website/icon-grid_2017-10-23-22-00.json b/common/changes/@uifabric/fabric-website/icon-grid_2017-10-23-22-00.json
deleted file mode 100644
index c012e7e93f39f..0000000000000
--- a/common/changes/@uifabric/fabric-website/icon-grid_2017-10-23-22-00.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Added support to IconGrid for icons wider than the grid.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-23-23-22.json b/common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-23-23-22.json
deleted file mode 100644
index ea3c1e9468d8b..0000000000000
--- a/common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-23-23-22.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Button: Pass specified onDismiss callback to contextual menu",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": ""
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-25-15-24.json b/common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-25-15-24.json
deleted file mode 100644
index 0d4dc1e3732fd..0000000000000
--- a/common/changes/office-ui-fabric-react/button-pass-ondismiss_2017-10-25-15-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: Support suppressing dismiss on ItemClick via preventDefault",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index c880d80fe2c39..4656aaf382c48 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.16.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.17.1 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 50e321e984c3e..3461758481583 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.17.1",
+      "tag": "office-ui-fabric-react_v5.17.1",
+      "date": "Tue, 31 Oct 2017 10:22:25 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "0f79556707307194fe9d689e180976a51ee2c433",
+            "comment": "Button: Pass specified onDismiss callback to contextual menu"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "0f79556707307194fe9d689e180976a51ee2c433",
+            "comment": "ContextualMenu: Support suppressing dismiss on ItemClick via preventDefault"
+          }
+        ]
+      }
+    },
     {
       "version": "5.17.0",
       "tag": "office-ui-fabric-react_v5.17.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 31fd5e982fbb2..afb79ce469365 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 30 Oct 2017 10:23:09 GMT and should not be manually modified.
+This log was last generated on Tue, 31 Oct 2017 10:22:25 GMT and should not be manually modified.
+
+## 5.17.1
+Tue, 31 Oct 2017 10:22:25 GMT
+
+### Patches
+
+- Button: Pass specified onDismiss callback to contextual menu
+- ContextualMenu: Support suppressing dismiss on ItemClick via preventDefault
 
 ## 5.17.0
 Mon, 30 Oct 2017 10:23:09 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 1fda081783a8f..9d678a69cc01e 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.17.0",
+  "version": "5.17.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From cf1faf49a39564c5d58db44fefab6dfe7f5f3416 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 31 Oct 2017 10:15:28 -0700
Subject: [PATCH 0948/1641] Button icon flexgrow (#3266)

* Button: Added flexShrink: 0 to icons in button so long text won't make them shrink

* Changefile
---
 apps/vr-tests/src/stories/Button.stories.tsx  | 48 +++++++++++++++----
 ...button-icon-flexgrow_2017-10-30-21-43.json | 11 +++++
 .../__snapshots__/Breadcrumb.test.tsx.snap    |  1 +
 .../components/Button/BaseButton.styles.ts    |  3 +-
 .../Button/__snapshots__/Button.test.tsx.snap |  3 ++
 .../__snapshots__/ComboBox.test.tsx.snap      |  1 +
 .../Nav/__snapshots__/Nav.test.tsx.snap       |  1 +
 .../__snapshots__/SpinButton.test.tsx.snap    |  2 +
 8 files changed, 59 insertions(+), 11 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/button-icon-flexgrow_2017-10-30-21-43.json

diff --git a/apps/vr-tests/src/stories/Button.stories.tsx b/apps/vr-tests/src/stories/Button.stories.tsx
index dac2989e97105..00748de83e905 100644
--- a/apps/vr-tests/src/stories/Button.stories.tsx
+++ b/apps/vr-tests/src/stories/Button.stories.tsx
@@ -56,16 +56,6 @@ storiesOf('Button Default', module)
   .add('Primary Disabled', () => (<DefaultButton {...baseProps} primary={ true } disabled={ true } />))
   .add('Primary Checked', () => (<DefaultButton {...baseProps} primary={ true } checked={ true } />));
 
-storiesOf('Button with placeholder', module)
-  .addDecorator(FabricDecorator)
-  .add('primary with placeholder', () => (
-    <div>
-      <DefaultButton {...baseProps} iconProps={ { iconName: '' } } primary={ true } />
-      <br />
-      <DefaultButton {...baseProps} iconProps={ { iconName: 'Add' } } primary={ true } />
-    </div>
-  ));
-
 storiesOf('Button Action', module)
   .addDecorator(FabricDecorator)
   .addDecorator(story => (
@@ -164,3 +154,41 @@ storiesOf('Button Split', module)
   .add('Primary', () => (<DefaultButton {...commandProps} primary={ true } split={ true } />))
   .add('Primary Disabled', () => (<DefaultButton {...commandProps} primary={ true } disabled={ true } split={ true } />))
   .add('Primary Checked', () => (<DefaultButton {...commandProps} primary={ true } checked={ true } split={ true } />));
+
+storiesOf('Button Special Scenarios', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+
+  .add('primary with placeholder', () => (
+    <div>
+      <DefaultButton {...baseProps} iconProps={ { iconName: '' } } primary={ true } />
+      <br />
+      <DefaultButton {...baseProps} iconProps={ { iconName: 'Add' } } primary={ true } />
+    </div>
+  ))
+  .add('no flex shrink', () => (
+    <div style={ { width: '300px' } }>
+      <DefaultButton
+        {...baseProps }
+        iconProps={ { iconName: 'Add' } }
+        menuIconProps={ {} }
+        styles={ { root: { width: '100%' } } }
+      />
+      <DefaultButton
+        {...baseProps }
+        text='This is a much longer string of text in a constrained space'
+        iconProps={ { iconName: 'Add' } }
+        menuIconProps={ {} }
+        styles={ { root: { width: '100%' } } }
+      />
+    </div>
+  ));
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/button-icon-flexgrow_2017-10-30-21-43.json b/common/changes/office-ui-fabric-react/button-icon-flexgrow_2017-10-30-21-43.json
new file mode 100644
index 0000000000000..71aed80055cca
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/button-icon-flexgrow_2017-10-30-21-43.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Button: Added flexShrink: 0 to icons in button so long text won't make them shrink",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
index a6af78873a158..a9c7473c68c5b 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
@@ -264,6 +264,7 @@ exports[`Breadcrumb renders breadcumb correctly 2`] = `
                         display: inline-block;
                       }
                       {
+                        flex-shrink: 0;
                         font-size: 16px;
                         height: 16px;
                         line-height: 16px;
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
index d09692d6ef202..b4ada9c359b5a 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
@@ -18,7 +18,8 @@ const iconStyle = {
   height: '16px',
   lineHeight: '16px',
   textAlign: 'center',
-  verticalAlign: 'middle'
+  verticalAlign: 'middle',
+  flexShrink: 0
 };
 
 /**
diff --git a/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
index 7f417942124fc..2fcf7557b42a8 100644
--- a/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
@@ -188,6 +188,7 @@ exports[`Button renders CommandBarButton correctly 1`] = `
           }
           {
             color: #106ebe;
+            flex-shrink: 0;
             font-size: 16px;
             height: 16px;
             line-height: 16px;
@@ -235,6 +236,7 @@ exports[`Button renders CommandBarButton correctly 1`] = `
           }
           {
             color: #666666;
+            flex-shrink: 0;
             font-size: 12px;
             height: 16px;
             line-height: 16px;
@@ -560,6 +562,7 @@ exports[`Button renders IconButton correctly 1`] = `
             display: inline-block;
           }
           {
+            flex-shrink: 0;
             font-size: 16px;
             height: 16px;
             line-height: 16px;
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
index 5876219a98d81..32273334ff77c 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
@@ -191,6 +191,7 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
                 display: inline-block;
               }
               {
+                flex-shrink: 0;
                 font-size: 16px;
                 height: 16px;
                 line-height: 16px;
diff --git a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
index fa5a32546f9ee..6f52028131098 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
@@ -132,6 +132,7 @@ exports[`Nav renders Nav correctly 1`] = `
                         }
                         {
                           color: #106ebe;
+                          flex-shrink: 0;
                           font-size: 16px;
                           height: 16px;
                           line-height: 16px;
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
index c648858f9689f..3f6c43aa9eff7 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
@@ -236,6 +236,7 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
                   display: inline-block;
                 }
                 {
+                  flex-shrink: 0;
                   font-size: 6px;
                   height: 16px;
                   line-height: 16px;
@@ -343,6 +344,7 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
                   display: inline-block;
                 }
                 {
+                  flex-shrink: 0;
                   font-size: 6px;
                   height: 16px;
                   line-height: 16px;

From 5a67336deaa3d0d788312467c93771a4fadc7798 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 31 Oct 2017 10:24:33 -0700
Subject: [PATCH 0949/1641] Facepile: New FacepileButton and other styling
 fixes for the component and its documentation (#3171)

* New FacepileButton

* Debugged Facepile styling

* Improved facepile documentation

* Added change file

* Updated snapshot

* Updated change file

* Updating Persona test and snapshot - hoping it fixes the build

* Revert "Updating Persona test and snapshot - hoping it fixes the build"

This reverts commit a5e1e299ee6dc3d39ca90e69d1d2dd2f68fc5ca5.

* Fleshed out lightGrey enum

* Switched lightGrey enum/const to transparent

* Changed let to const
---
 .../facepile-polish_2017-10-19-20-54.json     | 11 +++
 .../src/components/Facepile/Facepile.scss     |  4 ++
 .../src/components/Facepile/Facepile.tsx      | 41 +++++++----
 .../components/Facepile/FacepileButton.tsx    | 20 ++++++
 .../src/components/Facepile/FacepilePage.tsx  |  6 +-
 .../__snapshots__/Facepile.test.tsx.snap      | 51 ++++++++++++-
 .../examples/Facepile.Basic.Example.tsx       | 71 ++++++-------------
 .../Facepile/examples/Facepile.Examples.scss  | 15 +++-
 .../examples/Facepile.Overflow.Example.tsx    | 30 ++++----
 .../src/components/Persona/Persona.Props.ts   |  7 +-
 .../src/components/Persona/Persona.scss       | 34 +++++----
 .../src/components/Persona/PersonaCoin.tsx    |  5 +-
 .../src/components/Persona/PersonaConsts.ts   |  3 +-
 13 files changed, 194 insertions(+), 104 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/facepile-polish_2017-10-19-20-54.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Facepile/FacepileButton.tsx

diff --git a/common/changes/office-ui-fabric-react/facepile-polish_2017-10-19-20-54.json b/common/changes/office-ui-fabric-react/facepile-polish_2017-10-19-20-54.json
new file mode 100644
index 0000000000000..b0ef23730ba93
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/facepile-polish_2017-10-19-20-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Facepile style debugging, includes new FacepileButton",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.scss b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.scss
index 15ae30f0143fb..a0e41b21c675a 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.scss
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.scss
@@ -84,6 +84,10 @@ button.descriptiveOverflowButton {
   @include margin-left($spacingAroundItemButton * 2);
 }
 
+.overflowInitialsIcon {
+  color: $ms-color-neutralPrimary;
+}
+
 .screenReaderOnly {
   @include ms-screenReaderOnly;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
index 73f6de7883bc4..2c6e063da4334 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
@@ -17,14 +17,15 @@ import {
   FocusZoneDirection
 } from '../../FocusZone';
 import {
-  BaseButton
-} from '../../Button';
+  FacepileButton
+} from './FacepileButton';
 import {
   Icon
 } from '../../Icon';
 import {
   PersonaCoin,
-  PersonaSize
+  PersonaSize,
+  PersonaInitialsColor
 } from '../../PersonaCoin';
 import * as stylesImport from './Facepile.scss';
 const styles: any = stylesImport;
@@ -116,7 +117,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
 
   private _getElementWithOnClickEvent(personaControl: JSX.Element, persona: IFacepilePersona, index: number): JSX.Element {
     return (
-      <BaseButton
+      <FacepileButton
         { ...getNativeProps(persona, buttonProperties) }
         key={ (!!persona.imageUrl ? 'i' : '') + index }
         data-is-focusable={ true }
@@ -128,7 +129,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
         onMouseOut={ this._onPersonaMouseOut.bind(this, persona) }
       >
         { personaControl }
-      </BaseButton>
+      </FacepileButton>
     );
   }
 
@@ -171,7 +172,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
     let personaNames: string = personas.slice(numPersonasToShow).map((p: IFacepilePersona) => p.personaName).join(', ');
 
     return (
-      <BaseButton
+      <FacepileButton
         { ...overflowButtonProps}
         ariaDescription={ personaNames }
         className={ css('ms-Facepile-descriptiveOverflowButton', 'ms-Facepile-itemButton', styles.descriptiveOverflowButton, styles.itemButton) }
@@ -180,24 +181,27 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
           title={ personaNames }
           size={ personaSize }
           onRenderInitials={ this._renderInitialsNotPictured(numPersonasNotPictured) }
+          initialsColor={ PersonaInitialsColor.transparent }
         />
-      </BaseButton>
+      </FacepileButton>
     );
   }
 
   private _getIconElement(icon: string): JSX.Element {
     let { overflowButtonProps, personaSize } = this.props;
+    let overflowInitialsIcon = true;
 
     return (
-      <BaseButton
+      <FacepileButton
         {...overflowButtonProps}
         className={ css('ms-Facepile-overflowButton', 'ms-Facepile-itemButton', styles.overflowButton, styles.itemButton) }
       >
         <PersonaCoin
           size={ personaSize }
-          onRenderInitials={ this._renderInitials(icon) }
+          onRenderInitials={ this._renderInitials(icon, overflowInitialsIcon) }
+          initialsColor={ PersonaInitialsColor.transparent }
         />
-      </BaseButton>
+      </FacepileButton>
     );
   }
 
@@ -205,7 +209,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
     let { addButtonProps, personaSize } = this.props;
 
     return (
-      <BaseButton
+      <FacepileButton
         {...addButtonProps}
         className={ css('ms-Facepile-addButton', 'ms-Facepile-itemButton', styles.itemButton, styles.addButton) }
       >
@@ -213,7 +217,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
           size={ personaSize }
           onRenderInitials={ this._renderInitials('AddFriend') }
         />
-      </BaseButton>
+      </FacepileButton>
     );
   }
 
@@ -235,10 +239,13 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
     }
   }
 
-  private _renderInitials(iconName: string): () => JSX.Element {
+  private _renderInitials(iconName: string, overflowButton?: boolean): () => JSX.Element {
     return (): JSX.Element => {
       return (
-        <Icon iconName={ iconName } />
+        <Icon
+          iconName={ iconName }
+          className={ overflowButton ? styles.overflowInitialsIcon : '' }
+        />
       );
     };
   }
@@ -246,7 +253,11 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
   private _renderInitialsNotPictured(numPersonasNotPictured: number): () => JSX.Element {
     return (): JSX.Element => {
       return (
-        <span>{ '+' + numPersonasNotPictured }</span>
+        <span
+          className={ styles.overflowInitialsIcon }
+        >
+          { '+' + numPersonasNotPictured }
+        </span>
       );
     };
   }
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/FacepileButton.tsx b/packages/office-ui-fabric-react/src/components/Facepile/FacepileButton.tsx
new file mode 100644
index 0000000000000..383c0282f2e09
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Facepile/FacepileButton.tsx
@@ -0,0 +1,20 @@
+import * as React from 'react';
+import { BaseComponent } from '../../Utilities';
+import { BaseButton, IButtonProps } from '../../Button';
+import { getTheme } from '../../Styling';
+import { getStyles } from '../Button/BaseButton.styles';
+
+export class FacepileButton extends BaseComponent<IButtonProps, {}> {
+
+  public render() {
+    const baseButtonStyles = getStyles(getTheme());
+
+    return (
+      <BaseButton
+        { ...this.props }
+        styles={ baseButtonStyles }
+      />
+    );
+  }
+
+}
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx b/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx
index 0a5d631ba4768..805be59f018e3 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx
@@ -24,13 +24,13 @@ export class FacepilePage extends React.Component<IComponentDemoPageProps, {}> {
         componentName='FacepileExample'
         exampleCards={
           <div>
-            <ExampleCard title='Facepile with Extras' code={ FacepileBasicExampleCode }>
+            <ExampleCard title='Facepile with size and fade in options' code={ FacepileBasicExampleCode }>
               <FacepileBasicExample />
             </ExampleCard>
-            <ExampleCard title='Facepile with Overflow' code={ FacepileOverflowExampleCode }>
+            <ExampleCard title='Facepile with overflow buttons' code={ FacepileOverflowExampleCode }>
               <FacepileOverflowExample />
             </ExampleCard>
-            <ExampleCard title='Facepile with Add Face' code={ FacepileAddFaceExampleCode }>
+            <ExampleCard title='Facepile with face adding functionality' code={ FacepileAddFaceExampleCode }>
               <FacepileAddFaceExample />
             </ExampleCard>
           </div>
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
index cef3b7690adf9..94f57601595c5 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
@@ -98,7 +98,46 @@ exports[`Facepile Render personas and buttons renders Facepile correctly 1`] = `
         aria-label={undefined}
         aria-labelledby={null}
         aria-pressed={undefined}
-        className="ms-Facepile-itemButton ms-Facepile-person ms-Button "
+        className=
+            ms-Facepile-itemButton
+            ms-Facepile-person
+            ms-Button
+            {
+              -moz-osx-font-smoothing: grayscale;
+              -webkit-font-smoothing: antialiased;
+              border-radius: 0px;
+              border: 1px solid transparent;
+              box-sizing: border-box;
+              cursor: pointer;
+              display: inline-block;
+              font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+              font-size: 14px;
+              font-weight: 400;
+              outline: transparent;
+              padding-bottom: 0;
+              padding-left: 16px;
+              padding-right: 16px;
+              padding-top: 0;
+              position: relative;
+              text-align: center;
+              text-decoration: none;
+              user-select: none;
+              vertical-align: top;
+            }
+            &::-moz-focus-inner {
+              border: 0;
+            }
+            .ms-Fabric.is-focusVisible &:focus:after {
+              border: 1px solid #ffffff;
+              bottom: 0px;
+              content: "";
+              left: 0px;
+              outline: 1px solid #666666;
+              position: absolute;
+              right: 0px;
+              top: 0px;
+              z-index: 1;
+            }
         data="75%"
         data-is-focusable={true}
         disabled={undefined}
@@ -110,7 +149,15 @@ exports[`Facepile Render personas and buttons renders Facepile correctly 1`] = `
         type="button"
       >
         <div
-          className="ms-Button-flexContainer"
+          className=
+              ms-Button-flexContainer
+              {
+                align-items: center;
+                display: flex;
+                flex-wrap: nowrap;
+                height: 100%;
+                justify-content: center;
+              }
         >
           <div
             className="ms-Persona-coin ms-Persona--xs undefined"
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
index f19a036f4cd87..87d685ef6ff40 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
@@ -10,15 +10,9 @@ import './Facepile.Examples.scss';
 import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
 const exampleStyles: any = exampleStylesImport;
 
-export enum ExtraDataType {
-  none = 0,
-  name = 1
-}
-
 export interface IFacepileBasicExampleState {
   numberOfFaces: any;
   imagesFadeIn: boolean;
-  extraDataType: ExtraDataType;
   personaSize: PersonaSize;
 }
 
@@ -29,23 +23,16 @@ export class FacepileBasicExample extends React.Component<any, IFacepileBasicExa
     this.state = {
       numberOfFaces: 3,
       imagesFadeIn: true,
-      extraDataType: ExtraDataType.none,
       personaSize: PersonaSize.extraSmall
     };
   }
 
   public render() {
-    let { extraDataType, numberOfFaces, personaSize } = this.state;
+    let { numberOfFaces, personaSize } = this.state;
     let facepileProps: IFacepileProps = {
       personaSize: personaSize,
       personas: facepilePersonas.slice(0, numberOfFaces),
       getPersonaProps: (persona: IFacepilePersona) => {
-        if (extraDataType === ExtraDataType.name) {
-          return {
-            imageShouldFadeIn: this.state.imagesFadeIn,
-            hidePersonaDetails: false
-          };
-        }
         return {
           imageShouldFadeIn: this.state.imagesFadeIn
         };
@@ -66,47 +53,31 @@ export class FacepileBasicExample extends React.Component<any, IFacepileBasicExa
             value={ numberOfFaces }
             onChange={ this._onChangePersonaNumber }
           />
+          <Dropdown
+            label='Persona Size:'
+            selectedKey={ this.state.personaSize }
+            options={
+              [
+                { key: PersonaSize.size16, text: PersonaSize[PersonaSize.size16] },
+                { key: PersonaSize.extraExtraSmall, text: PersonaSize[PersonaSize.extraExtraSmall] },
+                { key: PersonaSize.size28, text: PersonaSize[PersonaSize.size28] },
+                { key: PersonaSize.extraSmall, text: PersonaSize[PersonaSize.extraSmall] },
+                { key: PersonaSize.small, text: PersonaSize[PersonaSize.small] }
+              ]
+            }
+            onChanged={ this._onChangePersonaSize }
+          />
+          <Checkbox
+            className={ exampleStyles.exampleCheckbox }
+            label='Fade In'
+            checked={ this.state.imagesFadeIn }
+            onChange={ this._onChangeFadeIn }
+          />
         </div>
-        <Checkbox
-          className={ exampleStyles.exampleCheckbox }
-          label='Fade In'
-          checked={ this.state.imagesFadeIn }
-          onChange={ this._onChangeFadeIn }
-        />
-        <Dropdown
-          label='Persona Size:'
-          selectedKey={ this.state.personaSize }
-          options={
-            [
-              { key: PersonaSize.extraSmall, text: PersonaSize[PersonaSize.extraSmall] },
-              { key: PersonaSize.extraExtraSmall, text: PersonaSize[PersonaSize.extraExtraSmall] }
-            ]
-          }
-          onChanged={ this._onChangePersonaSize }
-        />
-        <Dropdown
-          label='Additional Data:'
-          selectedKey={ this.state.extraDataType }
-          options={
-            [
-              { key: ExtraDataType.none, text: ExtraDataType[ExtraDataType.none] },
-              { key: ExtraDataType.name, text: ExtraDataType[ExtraDataType.name] }
-            ]
-          }
-          onChanged={ this._onChangeAddtlData }
-        />
       </div>
     );
   }
 
-  @autobind
-  private _onChangeAddtlData(value: IDropdownOption): void {
-    this.setState((prevState: IFacepileBasicExampleState): IFacepileBasicExampleState => {
-      prevState.extraDataType = value.key as ExtraDataType;
-      return prevState;
-    });
-  }
-
   @autobind
   private _onChangeFadeIn(ev: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean): void {
     this.setState((prevState: IFacepileBasicExampleState): IFacepileBasicExampleState => {
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Examples.scss b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Examples.scss
index 4c1e3bdd9c0e0..d19a2898311b0 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Examples.scss
+++ b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Examples.scss
@@ -3,7 +3,20 @@
     max-width: 300px;
 
     .control {
-      padding-top: 8px;
+      padding-top: 20px;
     }
   }
+
+  .ms-Dropdown-container,
+  .ms-Slider {
+    margin: 10px 0 10px 0;
+  }
+
+  .ms-Dropdown-container .ms-Label {
+    padding-top: 0;
+  }
+
+  .ms-Checkbox {
+    padding-top: 15px;
+  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx
index 269de4e0e97a3..4237347b7913a 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx
@@ -47,7 +47,7 @@ export class FacepileOverflowExample extends React.Component<any, IFacepileOverf
         <Facepile {...facepileProps} />
         <div className={ 'control' }>
           <Slider
-            label='Number of Personas Shown:'
+            label='Number of Personas:'
             min={ 0 }
             max={ 6 }
             step={ 1 }
@@ -55,21 +55,21 @@ export class FacepileOverflowExample extends React.Component<any, IFacepileOverf
             value={ this.state.displayedPersonas }
             onChange={ this._onChangePersonaNumber }
           />
+          <Dropdown
+            label='Overflow Button Type:'
+            selectedKey={ this.state.overflowButtonType }
+            options={
+              [
+                { key: OverflowButtonType.none, text: OverflowButtonType[OverflowButtonType.none] },
+                { key: OverflowButtonType.descriptive, text: OverflowButtonType[OverflowButtonType.descriptive] },
+                { key: OverflowButtonType.downArrow, text: OverflowButtonType[OverflowButtonType.downArrow] },
+                { key: OverflowButtonType.more, text: OverflowButtonType[OverflowButtonType.more] },
+              ]
+            }
+            onChanged={ this._onChangeType
+            }
+          />
         </div>
-        <Dropdown
-          label='Overflow Type:'
-          selectedKey={ this.state.overflowButtonType }
-          options={
-            [
-              { key: OverflowButtonType.none, text: OverflowButtonType[OverflowButtonType.none] },
-              { key: OverflowButtonType.descriptive, text: OverflowButtonType[OverflowButtonType.descriptive] },
-              { key: OverflowButtonType.downArrow, text: OverflowButtonType[OverflowButtonType.downArrow] },
-              { key: OverflowButtonType.more, text: OverflowButtonType[OverflowButtonType.more] },
-            ]
-          }
-          onChanged={ this._onChangeType
-          }
-        />
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts b/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
index f209bf8f8e1fe..6a444f7622ea5 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
@@ -170,5 +170,10 @@ export enum PersonaInitialsColor {
    * Red is a color that often has a special meaning, so it is considered a reserved color and can only be set with overrides
    */
   red = 13,
-  darkRed = 14
+  darkRed = 14,
+  /**
+   * Tranparent is not intended to be used with typical initials due to accessibility issues.
+   * Its primary use is for overflow buttons, so it is considered a reserved color and can only be set with overrides.
+   */
+  transparent = 15,
 }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
index d2820c65dc8a3..18af32cedfe62 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
@@ -9,21 +9,22 @@
 
 
 //= Colors used in the initials color block
-$ms-color-initials-lightBlue:   #6BA5E7;
-$ms-color-initials-blue:        #2D89EF;
-$ms-color-initials-darkBlue:    #2B5797;
-$ms-color-initials-teal:        #00ABA9;
-$ms-color-initials-lightGreen:  #99B433;
-$ms-color-initials-green:       #00A300;
-$ms-color-initials-darkGreen:   #1E7145;
-$ms-color-initials-lightPink:   #E773BD;
-$ms-color-initials-pink:        #FF0097;
-$ms-color-initials-magenta:     #7E3878;
-$ms-color-initials-purple:      #603CBA;
-$ms-color-initials-black:       #1D1D1D;
-$ms-color-initials-orange:      #DA532C;
-$ms-color-initials-red:         #EE1111;
-$ms-color-initials-darkRed:     #B91D47;
+$ms-color-initials-transparent:      transparent;
+$ms-color-initials-lightBlue:        #6BA5E7;
+$ms-color-initials-blue:             #2D89EF;
+$ms-color-initials-darkBlue:         #2B5797;
+$ms-color-initials-teal:             #00ABA9;
+$ms-color-initials-lightGreen:       #99B433;
+$ms-color-initials-green:            #00A300;
+$ms-color-initials-darkGreen:        #1E7145;
+$ms-color-initials-lightPink:        #E773BD;
+$ms-color-initials-pink:             #FF0097;
+$ms-color-initials-magenta:          #7E3878;
+$ms-color-initials-purple:           #603CBA;
+$ms-color-initials-black:            #1D1D1D;
+$ms-color-initials-orange:           #DA532C;
+$ms-color-initials-red:              #EE1111;
+$ms-color-initials-darkRed:          #B91D47;
 
 // Skype presence colors
 $ms-color-presence-available:          #7FBA00;
@@ -167,6 +168,9 @@ $ms-Persona-presenceSizeXl: 28px;
   &.initialsIsDarkRed {
     background-color: $ms-color-initials-darkRed;
   }
+  &.initialsIsTransparent {
+    background-color: $ms-color-initials-transparent;
+  }
 }
 
 .image {
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
index 89a2750c7d11c..2bc27040e6569 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
@@ -34,7 +34,10 @@ const SIZE_TO_PIXELS = {
 };
 
 /**
- * Red is a color that often has a special meaning, so it is considered a reserved color and can only be set with overrides
+ * These colors are considered reserved colors and can only be set with overrides:
+ * - Red is a color that often has a special meaning.
+ * - Transparent is not intended to be used with typical initials due to accessibility issues,
+ *   its primary use is for Facepile overflow buttons.
  */
 const COLOR_SWATCHES_LOOKUP: PersonaInitialsColor[] = [
   PersonaInitialsColor.lightGreen,
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts b/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
index 6b2278f34428b..4785075d1df08 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
@@ -42,5 +42,6 @@ export const PERSONA_INITIALS_COLOR = {
   [PersonaInitialsColor.black]: 'ms-Persona-initials--black ' + styles.initialsIsBlack,
   [PersonaInitialsColor.orange]: 'ms-Persona-initials--orange ' + styles.initialsIsOrange,
   [PersonaInitialsColor.red]: 'ms-Persona-initials--red ' + styles.initialsIsRed,
-  [PersonaInitialsColor.darkRed]: 'ms-Persona-initials--darkRed ' + styles.initialsIsDarkRed
+  [PersonaInitialsColor.darkRed]: 'ms-Persona-initials--darkRed ' + styles.initialsIsDarkRed,
+  [PersonaInitialsColor.transparent]: 'ms-Persona-initials--transparent ' + styles.initialsIsTransparent
 };
\ No newline at end of file

From b822bed6c1464675ad12bdfe6340fae98b08874a Mon Sep 17 00:00:00 2001
From: Ben Truelove <betrue@microsoft.com>
Date: Tue, 31 Oct 2017 10:52:26 -0700
Subject: [PATCH 0950/1641] Betrue/fix dropdown states (#3270)

* Updated caret colors to match spec

* changelist added

* Update betrue-fixDropdown_states_2017-10-31-16-31.json
---
 .../betrue-fixDropdown_states_2017-10-31-16-31.json   | 11 +++++++++++
 .../src/components/Dropdown/Dropdown.scss             |  8 ++++----
 2 files changed, 15 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/betrue-fixDropdown_states_2017-10-31-16-31.json

diff --git a/common/changes/office-ui-fabric-react/betrue-fixDropdown_states_2017-10-31-16-31.json b/common/changes/office-ui-fabric-react/betrue-fixDropdown_states_2017-10-31-16-31.json
new file mode 100644
index 0000000000000..c92b4fd028a27
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/betrue-fixDropdown_states_2017-10-31-16-31.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: Updated caret dropdown colors.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "betrue@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
index f3383692a7cc4..028dbd67c0d24 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
@@ -37,7 +37,7 @@ $DropDown-item-height: 32px;
   &:active {
     .title,
     .caretDown {
-      color: $ms-color-black;
+      color: $ms-color-neutralDark;
 
       @include high-contrast {
         // Using Highlight for text here specifically to match the border color that indicates focus on dropdown root elements.
@@ -110,7 +110,7 @@ $DropDown-item-height: 32px;
 }
 
 .caretDown {
-  color: $ms-color-neutralDark;
+  color: $ms-color-neutralSecondary;
   font-size: $ms-icon-size-s;
   pointer-events: none;
 }
@@ -130,8 +130,8 @@ $DropDown-item-height: 32px;
   white-space: nowrap;
   text-overflow: ellipsis;
   &.titleIsError {
-        border-color: $ms-color-error;
-    }
+    border-color: $ms-color-error;
+  }
   &.titleIsPlaceHolder {
     color: $ms-color-neutralSecondary;
   }

From 66134e9ea7352c1bdd46d16508a5dfa2ea38f8a2 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 31 Oct 2017 11:12:03 -0700
Subject: [PATCH 0951/1641] Textfield: required with icon, no label bug fix
 (#3215)

* New class and mixin for required with icon no label

* Changed pseudo element right position to match icon

* Added change file

* New required example

* Revert "New required example"

This reverts commit 590295e21ed39eadb4c4dd9f1d667307a4e0da98.

* Improved icon quality and tweaked positioning for that and astericks

* Moved TextField specific css out of the LabelMixin

* Update textfield-icon-required_2017-10-24-16-24.json
---
 ...tfield-icon-required_2017-10-24-16-24.json | 11 +++++++++
 .../src/components/Label/LabelMixins.scss     |  8 -------
 .../src/components/TextField/TextField.scss   | 23 +++++++++++++++++--
 .../src/components/TextField/TextField.tsx    |  3 ++-
 4 files changed, 34 insertions(+), 11 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/textfield-icon-required_2017-10-24-16-24.json

diff --git a/common/changes/office-ui-fabric-react/textfield-icon-required_2017-10-24-16-24.json b/common/changes/office-ui-fabric-react/textfield-icon-required_2017-10-24-16-24.json
new file mode 100644
index 0000000000000..ec7083f947ecf
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/textfield-icon-required_2017-10-24-16-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "TextField/DatePicker: The required astrisk is now more correctly positioned.",
+      "packageName": "office-ui-fabric-react",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Label/LabelMixins.scss b/packages/office-ui-fabric-react/src/components/Label/LabelMixins.scss
index c816afbe2226e..7e9a7235160b4 100644
--- a/packages/office-ui-fabric-react/src/components/Label/LabelMixins.scss
+++ b/packages/office-ui-fabric-react/src/components/Label/LabelMixins.scss
@@ -7,12 +7,4 @@
     content: ' *';
     color: $ms-color-error;
   }
-}
-
-@mixin ms-TextField-fieldGroup-is-required {
-  &::after {
-    content: ' *';
-    color: $ms-color-error;
-    @include ms-padding-right(12px);
-  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index 7edc5413b58eb..d42ffd4a88997 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -137,7 +137,24 @@ $field-error-color: $errorTextColor;
 
 .root.rootIsRequiredPlaceholderOnly {
   :global(.ms-TextField-fieldGroup) {
-    @include ms-TextField-fieldGroup-is-required;
+    &::after {
+      content: ' *';
+      color: $ms-color-error;
+      @include ms-padding-right(12px);
+    }
+  }
+}
+
+.root.rootIsRequiredPlaceholderIcon {
+  :global(.ms-Icon) {
+    &::before {
+      content: ' *';
+      color: $ms-color-error;
+      position: absolute;
+      top: -4px;
+      @include ms-right(8px);
+      @include ms-padding-right(12px);
+    }
   }
 }
 
@@ -149,9 +166,11 @@ $field-error-color: $errorTextColor;
 .icon {
   pointer-events: none;
   position: absolute;
-  bottom: 8px;
+  bottom: 5px;
   @include right(8px);
   top: auto;
+  font-size: 16px;
+  line-height: 18px;
 }
 
 .description {
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index 5163050a2688f..4d4e58817c6f4 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -146,7 +146,8 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
 
     const textFieldClassName = css('ms-TextField', styles.root, className, {
       ['is-required ' + styles.rootIsRequiredLabel]: this.props.label && required,
-      ['is-required ' + styles.rootIsRequiredPlaceholderOnly]: !this.props.label && required,
+      ['is-required ' + styles.rootIsRequiredPlaceholderOnly]: !this.props.label && required && !iconProps,
+      ['is-required ' + styles.rootIsRequiredPlaceholderIcon]: !this.props.label && required && iconProps,
       ['is-disabled ' + styles.rootIsDisabled]: disabled,
       ['is-active ' + styles.rootIsActive]: isFocused,
       ['ms-TextField--multiline ' + styles.rootIsMultiline]: multiline,

From 5f56a5cb0576b0e9fa5f5a95ca23be6e13a8a530 Mon Sep 17 00:00:00 2001
From: amyngu <31973030+amyngu@users.noreply.github.com>
Date: Tue, 31 Oct 2017 13:42:44 -0700
Subject: [PATCH 0952/1641] Selected items list (#3165)

* selection list experiment

* change do/donts

* copy, expand, and right click menu

* hover/selected states for expand button

* merge master and create extended picker from selected items list and floating picker

* fix expand group UX

* npm run change

* fix current build error

* remove unneeded style import

* address some comments

* Pass menu items into ExtendedSelectedItem
---
 .../selectionItemsList_2017-10-19-17-24.json  |  11 +
 packages/experiments/src/FloatingPicker.ts    |   1 +
 packages/experiments/src/SelectedItemsList.ts |   1 +
 .../BaseExtendedPicker.Props.ts               | 101 ++++++-
 .../ExtendedPicker/BaseExtendedPicker.scss    |   8 -
 .../ExtendedPicker/BaseExtendedPicker.tsx     | 225 +++++++++++---
 ...ePicker.scss => ExtendedPeoplePicker.scss} |   0
 .../PeoplePicker/ExtendedPeoplePicker.tsx     |  26 +-
 .../PeoplePicker/ExtendedPeoplePickerPage.tsx |   5 +-
 .../ExtendedPeoplePicker.Basic.Example.scss   |   0
 .../ExtendedPeoplePicker.Basic.Example.tsx    |  90 ++++--
 .../PeopleExampleData.ts}                     |  25 +-
 .../src/components/ExtendedPicker/index.ts    |   5 +-
 .../BaseFloatingPicker.Props.ts               |   0
 .../BaseFloatingPicker.tsx                    |   3 +-
 .../PeoplePicker/FloatingPeoplePicker.tsx     |   0
 .../PeoplePicker/FloatingPeoplePickerPage.tsx |   4 +-
 .../PeoplePicker/PeoplePicker.scss            |  30 ++
 .../PeoplePickerItems/PickerItemsDefault.scss |   0
 .../PeoplePickerItems/SelectedItemDefault.tsx |   2 +-
 .../SuggestionItemDefault.tsx                 |   0
 .../FloatingPeoplePicker.Basic.Example.scss   |   9 +
 .../FloatingPeoplePicker.Basic.Example.tsx    |   4 +-
 .../src/components/FloatingPicker/index.ts    |   3 +
 .../BaseSelectedItemsList.Props.ts            |  59 ++++
 .../BaseSelectedItemsList.tsx                 | 278 ++++++++++++++++++
 .../Items/ExtendedSelectedItem.scss           | 136 +++++++++
 .../Items/ExtendedSelectedItem.tsx            | 109 +++++++
 .../SelectedPeopleList/SelectedPeopleList.tsx |  95 ++++++
 .../SelectedPeopleListPage.tsx                |  56 ++++
 .../SelectedPeopleList.Basic.Example.tsx      |  91 ++++++
 .../src/components/SelectedItemsList/index.ts |   3 +
 .../experiments/src/demo/AppDefinition.tsx    |  18 +-
 packages/experiments/src/index.ts             |   4 +-
 34 files changed, 1278 insertions(+), 124 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/selectionItemsList_2017-10-19-17-24.json
 create mode 100644 packages/experiments/src/FloatingPicker.ts
 create mode 100644 packages/experiments/src/SelectedItemsList.ts
 rename packages/experiments/src/components/ExtendedPicker/PeoplePicker/{PeoplePicker.scss => ExtendedPeoplePicker.scss} (100%)
 rename packages/experiments/src/components/ExtendedPicker/{PeoplePicker => }/examples/ExtendedPeoplePicker.Basic.Example.scss (100%)
 rename packages/experiments/src/components/ExtendedPicker/{PeoplePicker => }/examples/ExtendedPeoplePicker.Basic.Example.tsx (65%)
 rename packages/experiments/src/components/ExtendedPicker/{PeoplePicker/examples/PeoplePickerExampleData.ts => examples/PeopleExampleData.ts} (94%)
 rename packages/experiments/src/components/{ExtendedPicker => FloatingPicker}/BaseFloatingPicker.Props.ts (100%)
 rename packages/experiments/src/components/{ExtendedPicker => FloatingPicker}/BaseFloatingPicker.tsx (99%)
 rename packages/experiments/src/components/{ExtendedPicker => FloatingPicker}/PeoplePicker/FloatingPeoplePicker.tsx (100%)
 rename packages/experiments/src/components/{ExtendedPicker => FloatingPicker}/PeoplePicker/FloatingPeoplePickerPage.tsx (95%)
 create mode 100644 packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePicker.scss
 rename packages/experiments/src/components/{ExtendedPicker => FloatingPicker}/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss (100%)
 rename packages/experiments/src/components/{ExtendedPicker => FloatingPicker}/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx (96%)
 rename packages/experiments/src/components/{ExtendedPicker => FloatingPicker}/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx (100%)
 create mode 100644 packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.scss
 rename packages/experiments/src/components/{ExtendedPicker => FloatingPicker}/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx (98%)
 create mode 100644 packages/experiments/src/components/FloatingPicker/index.ts
 create mode 100644 packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.Props.ts
 create mode 100644 packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx
 create mode 100644 packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.scss
 create mode 100644 packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx
 create mode 100644 packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
 create mode 100644 packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleListPage.tsx
 create mode 100644 packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
 create mode 100644 packages/experiments/src/components/SelectedItemsList/index.ts

diff --git a/common/changes/@uifabric/experiments/selectionItemsList_2017-10-19-17-24.json b/common/changes/@uifabric/experiments/selectionItemsList_2017-10-19-17-24.json
new file mode 100644
index 0000000000000..772440dddbd2f
--- /dev/null
+++ b/common/changes/@uifabric/experiments/selectionItemsList_2017-10-19-17-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Added SelectedItemsList, change ExtendedPicker from extending BasePicker to be new component utilizing SelectedItemsList and FloatingPicker",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "amyngu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/FloatingPicker.ts b/packages/experiments/src/FloatingPicker.ts
new file mode 100644
index 0000000000000..bbff963dc57cd
--- /dev/null
+++ b/packages/experiments/src/FloatingPicker.ts
@@ -0,0 +1 @@
+export * from './components/FloatingPicker/index';
\ No newline at end of file
diff --git a/packages/experiments/src/SelectedItemsList.ts b/packages/experiments/src/SelectedItemsList.ts
new file mode 100644
index 0000000000000..31b8fe276616d
--- /dev/null
+++ b/packages/experiments/src/SelectedItemsList.ts
@@ -0,0 +1 @@
+export * from './components/SelectedItemsList/index';
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.Props.ts b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.Props.ts
index 9f2bcad8b5c9f..0f4821e1943c1 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.Props.ts
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.Props.ts
@@ -1,11 +1,98 @@
+import * as React from 'react';
+import { BaseAutoFill, IInputProps } from 'office-ui-fabric-react/lib/Pickers';
+import { IBaseFloatingPickerProps } from 'experiments/lib/FloatingPicker';
+import { IBaseSelectedItemsListProps } from 'experiments/lib/SelectedItemsList';
 
-import { IBasePickerProps } from 'office-ui-fabric-react/lib/Pickers';
-import { IBaseFloatingPickerProps } from './BaseFloatingPicker.Props';
-import { BaseFloatingPicker } from './BaseFloatingPicker';
+export interface IBaseExtendedPicker<T> {
+  /** Forces the picker to resolve */
+  forceResolve?: () => void;
+  /** Gets the current value of the input. */
+  items: T[] | undefined;
+  /** Sets focus to the input. */
+  focus: () => void;
+}
 
-export interface IBaseExtendedPickerProps<T> extends IBasePickerProps<T> {
+// Type T is the type of the item that is displayed
+// and searched for by the people picker. For example, if the picker is
+// displaying persona's than type T could either be of Persona or Ipersona props
+export interface IBaseExtendedPickerProps<T> {
+  componentRef?: (component?: IBaseExtendedPicker<T>) => void;
+
+  /**
+   * Initial items that have already been selected and should appear in the people picker.
+   */
+  defaultSelectedItems?: T[];
+
+  /**
+   * A callback for when the selected list of items changes.
+   */
+  onChange?: (items?: T[]) => void;
+
+  /**
+   * A callback for when text is pasted into the input
+   */
+  onPaste?: (pastedText: string) => T[];
+
+  /**
+   * A callback for when the user put focus on the picker
+   */
+  onFocus?: React.FocusEventHandler<HTMLInputElement | BaseAutoFill>;
+
+  /**
+   * A callback for when the user moves the focus away from the picker
+   */
+  onBlur?: React.FocusEventHandler<HTMLInputElement | BaseAutoFill>;
+
+  /**
+   * ClassName for the picker.
+   */
+  className?: string;
+
+  /**
+   * Function that specifies how the floating picker will appear.
+   */
+  onRenderFloatingPicker: (props: IBaseFloatingPickerProps<T>) => JSX.Element;
+
+  /**
+   * Function that specifies how the floating picker will appear.
+   */
+  onRenderSelectedItems: (props: IBaseSelectedItemsListProps<T>) => JSX.Element;
+
+  /**
+   * Floating picker properties
+   */
+  floatingPickerProps: IBaseFloatingPickerProps<T>;
+
+  /**
+   * Selected items list properties
+   */
+  selectedItemsListProps: IBaseSelectedItemsListProps<T>;
+
+  /**
+   * AutoFill input native props
+   * @default undefined
+   */
+  inputProps?: IInputProps;
+
+  /**
+   * Flag for disabling the picker.
+   * @default false
+   */
+  disabled?: boolean;
+
+  /**
+   * Restrict the amount of selectable items.
+   * @default undefined
+   */
+  itemLimit?: number;
+
+  /**
+   * A callback to process a selection after the user selects something from the picker.
+   */
+  onItemSelected?: (selectedItem?: T) => T | PromiseLike<T>;
   /**
- * The floating picker type
- */
-  floatingPickerType: new (props: IBaseFloatingPickerProps<T>) => BaseFloatingPicker<T, IBaseFloatingPickerProps<T>>;
+   * The items that the base picker should currently display as selected. If this is provided then the picker will act as a controlled
+   * component.
+   */
+  selectedItems?: T[];
 }
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.scss b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.scss
index b14a992fde4f9..0569ed71ba119 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.scss
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.scss
@@ -12,10 +12,6 @@
   &:hover {
     border-color: $ms-color-themeLight;
   }
-
-  &.inputFocused {
-    border-color: $ms-color-themePrimary;
-  }
 }
 
 .pickerInput {
@@ -25,8 +21,4 @@
   outline: none;
   padding: 0 6px 0px;
   margin: 1px;
-}
-
-.screenReaderOnly {
-  @include ms-screenReaderOnly;
 }
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
index 6ba4cb34daf93..89a561ddf491b 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
@@ -1,61 +1,160 @@
-/* tslint:disable */
 import * as React from 'react';
-/* tslint:enable */
-import { BasePicker, BaseAutoFill } from 'office-ui-fabric-react/lib/Pickers';
-import { autobind, KeyCodes } from '../../Utilities';
-import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
-import { IObjectWithKey } from 'office-ui-fabric-react/src/utilities/selection/index';
-import { IBaseFloatingPickerProps } from './BaseFloatingPicker.Props';
-import { IBaseExtendedPickerProps } from './BaseExtendedPicker.Props';
-import { BaseFloatingPicker } from './BaseFloatingPicker';
+import {
+  BaseComponent,
+  KeyCodes,
+  autobind,
+  css,
+} from '../../Utilities';
+import {
+  FocusZone,
+  FocusZoneDirection
+} from 'office-ui-fabric-react/lib/FocusZone';
+import { BaseAutoFill } from 'office-ui-fabric-react/lib/components/pickers/AutoFill/BaseAutoFill';
+import { IPickerItemProps, IInputProps } from 'office-ui-fabric-react/lib/Pickers';
+import * as stylesImport from './BaseExtendedPicker.scss';
+import { IBaseExtendedPickerProps, IBaseExtendedPicker } from './BaseExtendedPicker.Props';
+import { IBaseFloatingPickerProps, BaseFloatingPicker } from 'experiments/lib/FloatingPicker';
+import { BaseSelectedItemsList, IBaseSelectedItemsListProps } from 'experiments/lib/SelectedItemsList';
+// tslint:disable-next-line:no-any
+const styles: any = stylesImport;
 
-export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extends BasePicker<T, P> {
+export interface IBaseExtendedPickerState {
+  // tslint:disable-next-line:no-any
+  items?: any;
+  suggestedDisplayValue?: string;
+  moreSuggestionsAvailable?: boolean;
+  isSearching?: boolean;
+  isMostRecentlyUsedVisible?: boolean;
+  suggestionsVisible?: boolean;
+  suggestionsLoading?: boolean;
+  isResultsFooterVisible?: boolean;
+}
 
-  protected floatingPicker: BaseFloatingPicker<IPersonaProps, IBaseFloatingPickerProps<IPersonaProps>>;
+export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extends BaseComponent<P, IBaseExtendedPickerState>
+  implements IBaseExtendedPicker<T> {
+  public floatingPicker: BaseFloatingPicker<T, IBaseFloatingPickerProps<T>>;
+  public selectedItemsList: BaseSelectedItemsList<T, IBaseSelectedItemsListProps<T>>;
+
+  protected root: HTMLElement;
+  protected input: BaseAutoFill;
+  protected focusZone: FocusZone;
+  protected floatingPickerProps: IBaseFloatingPickerProps<T>;
+  protected selectedItemsListProps: IBaseSelectedItemsListProps<T>;
+
+  constructor(basePickerProps: P) {
+    super(basePickerProps);
+
+    let items: T[] = basePickerProps.selectedItems || basePickerProps.defaultSelectedItems || [];
+
+    this.state = {
+      items: items ? items : [],
+      suggestedDisplayValue: '',
+    };
+
+    this.floatingPickerProps = this.props.floatingPickerProps;
+    this.selectedItemsListProps = this.props.selectedItemsListProps;
+  }
+
+  // tslint:disable-next-line:no-any
+  public get items(): any {
+    return this.selectedItemsList ? this.selectedItemsList.items : [];
+  }
 
   public componentDidMount(): void {
-    this.selection.setItems(this.state.items as IObjectWithKey[]);
     this.forceUpdate();
   }
 
-  protected renderSuggestions(): JSX.Element | null {
-    let TypedFloatingPicker = this.props.floatingPickerType as (new (props: IBaseFloatingPickerProps<IPersonaProps>) =>
-      BaseFloatingPicker<IPersonaProps, IBaseFloatingPickerProps<IPersonaProps>>);
+  public focus(): void {
+    console.log('extended picker focus');
+    this.focusZone.focus();
+  }
+
+  public render(): JSX.Element {
+    let { suggestedDisplayValue } = this.state;
+    let {
+      className,
+      inputProps,
+      disabled
+        } = this.props;
+
     return (
-      <TypedFloatingPicker
-        suggestionsController={ this.suggestionStore }
-        onZeroQuerySuggestion={ this.props.onEmptyInputFocus }
-        onRenderSuggestionsItem={ this.props.onRenderSuggestionsItem }
-        onResolveSuggestions={ this.props.onResolveSuggestions }
-        onGetMoreResults={ this.props.onGetMoreResults }
-        onRemoveSuggestion={ this.props.onRemoveSuggestion }
-        onValidateInput={ this.props.onValidateInput }
-        createGenericItem={ this.props.createGenericItem }
-        getTextFromItem={ this.props.getTextFromItem }
-        pickerSuggestionsProps={ this.props.pickerSuggestionsProps }
-        ref={ this._resolveRef('floatingPicker') }
-        onChange={ this.addItem }
-        inputElement={ this.input ? this.input.inputElement : undefined }
-        selectedItems={ this.state.items }
-      />
+      <div
+        ref={ this._resolveRef('root') }
+        className={ css(
+          'ms-BasePicker',
+          className ? className : '') }
+      >
+        <FocusZone
+          ref={ this._resolveRef('focusZone') }
+          direction={ FocusZoneDirection.bidirectional }
+          isInnerZoneKeystroke={ this._isFocusZoneInnerKeystroke }
+          onKeyDown={ this.onBackspace }
+          onCopy={ this.onCopy }
+        >
+          <div className={ css('ms-BasePicker-text', styles.pickerText) } role={ 'list' }>
+            { this.renderSelectedItemsList() }
+            { this.canAddItems() && (<BaseAutoFill
+              { ...inputProps as IInputProps }
+              className={ css('ms-BasePicker-input', styles.pickerInput) }
+              ref={ this._resolveRef('input') }
+              onFocus={ this.onInputFocus }
+              onInputValueChange={ this.onInputChange }
+              suggestedDisplayValue={ suggestedDisplayValue }
+              aria-activedescendant={ 'sug-' + this.state.items.length }
+              aria-owns='suggestion-list'
+              aria-expanded='true'
+              aria-haspopup='true'
+              autoCapitalize='off'
+              autoComplete='off'
+              role='combobox'
+              disabled={ disabled }
+              aria-controls='selected-suggestion-alert'
+            />) }
+          </div>
+        </FocusZone>
+        { this.renderSuggestions() }
+      </div>
     );
   }
 
-  // This is protected because we may expect the backspace key to work differently in a different kind of picker.
-  // This lets the subclass override it and provide it's own onBackspace. For an example see the BasePickerListBelow
-  @autobind
-  protected onBackspace(ev: React.KeyboardEvent<HTMLElement>): void {
-    if (ev.which !== KeyCodes.backspace) {
-      return;
-    }
-    if (this.state.items.length && !this.input || !this.input.isValueSelected) {
-      if (this.selection.getSelectedCount() > 0) {
-        ev.preventDefault();
-        this.removeItems(this.selection.getSelection());
-        this.input.focus();
-      } else if ((this.input as BaseAutoFill).cursorLocation === 0) {
-        this.removeItem(this.state.items[this.state.items.length - 1]);
+  protected canAddItems(): boolean {
+    const { items } = this.state;
+    const { itemLimit } = this.props;
+    return itemLimit === undefined || items.length < itemLimit;
+  }
+
+  protected renderSuggestions(): JSX.Element {
+    let onRenderFloatingPicker = this.props.onRenderFloatingPicker;
+    return (onRenderFloatingPicker({
+      componentRef: this._resolveRef('floatingPicker'),
+      onChange: this._onSuggestionSelected,
+      inputElement: this.input ? this.input.inputElement : undefined,
+      selectedItems: this.selectedItemsList ? this.selectedItemsList.items : [],
+      ...this.floatingPickerProps
+    }));
+  }
+
+  protected renderSelectedItemsList(): JSX.Element {
+    let onRenderSelectedItems = this.props.onRenderSelectedItems;
+    return (onRenderSelectedItems({
+      componentRef: this._resolveRef('selectedItemsList'),
+      ...this.selectedItemsListProps
+    }));
+  }
+
+  protected resetFocus(index?: number): void {
+    let { items } = this.state;
+
+    if (items.length && index! >= 0) {
+      let newEl: HTMLElement = this.root.querySelectorAll('[data-selection-index]')[Math.min(index!, items.length - 1)] as HTMLElement;
+      if (newEl) {
+        this.focusZone.focusElement(newEl);
       }
+    } else if (!this.canAddItems()) {
+      (items[items.length - 1] as IPickerItemProps<T>).selected = true;
+      this.resetFocus(items.length - 1);
+    } else {
+      this.input.focus();
     }
   }
 
@@ -66,7 +165,7 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
 
   @autobind
   protected onInputFocus(ev: React.FocusEvent<HTMLInputElement | BaseAutoFill>): void {
-    this.selection.setAllSelected(false);
+    this.selectedItemsList.unselectAll();
     this.floatingPicker.showPicker();
 
     if (this.props.inputProps && this.props.inputProps.onFocus) {
@@ -74,6 +173,27 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
     }
   }
 
+  // This is protected because we may expect the backspace key to work differently in a different kind of picker.
+  // This lets the subclass override it and provide it's own onBackspace. For an example see the BasePickerListBelow
+  @autobind
+  protected onBackspace(ev: React.KeyboardEvent<HTMLElement>): void {
+    if (ev.which !== KeyCodes.backspace) {
+      return;
+    }
+    if (this.state.items.length && !this.input || !this.input.isValueSelected) {
+      if ((this.input as BaseAutoFill).cursorLocation === 0) {
+        this.selectedItemsList.removeItemAt(this.items.length - 1);
+        this._onSelectedItemsChanged();
+      }
+    }
+  }
+
+  @autobind
+  protected onCopy(ev: React.ClipboardEvent<HTMLElement>): void {
+    // Pass it down into the selected items list
+    this.selectedItemsList.onCopy(ev);
+  }
+
   @autobind
   protected _isFocusZoneInnerKeystroke(ev: React.KeyboardEvent<HTMLElement>): boolean {
     // If suggestions are shown let up/down keys control them, otherwise allow them through to control the focusZone.
@@ -81,11 +201,12 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
       switch (ev.which) {
         case KeyCodes.up:
         case KeyCodes.down:
+        case KeyCodes.enter:
           return true;
       }
     }
 
-    if (ev.which === KeyCodes.enter) {
+    if (ev.ctrlKey) {
       return true;
     }
 
@@ -93,8 +214,14 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
   }
 
   @autobind
-  protected addItem(item: T): void {
-    super.addItem(item);
+  protected _onSuggestionSelected(item: T): void {
+    this.selectedItemsList.addItems([item]);
     this.input.clear();
+    this.floatingPicker.hidePicker();
+  }
+
+  @autobind
+  protected _onSelectedItemsChanged(): void {
+    this.input.focus();
   }
 }
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePicker.scss b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.scss
similarity index 100%
rename from packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePicker.scss
rename to packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.scss
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.tsx b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.tsx
index fd5219a9628d2..c5fb0d567c83d 100644
--- a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.tsx
@@ -1,30 +1,20 @@
 /* tslint:disable */
-import * as React from 'react';
-import { IPickerItemProps, ValidationState, IBasePickerProps } from 'office-ui-fabric-react/lib/Pickers';
+import { IPickerItemProps, ValidationState } from 'office-ui-fabric-react/lib/Pickers';
 /* tslint:enable */
+
+import { IExtendedPersonaProps } from 'experiments/lib/SelectedItemsList';
+import './ExtendedPeoplePicker.scss';
 import { BaseExtendedPicker } from '../BaseExtendedPicker';
-import { SelectedItemDefault } from './PeoplePickerItems/SelectedItemDefault';
-import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
-import './PeoplePicker.scss';
-import { FloatingPeoplePicker, BaseFloatingPeoplePicker } from './FloatingPeoplePicker';
-import { BaseFloatingPicker } from '../BaseFloatingPicker';
-import { IBaseFloatingPickerProps } from '../BaseFloatingPicker.Props';
+import { IBaseExtendedPickerProps } from '../BaseExtendedPicker.Props';
 
-export interface IPeoplePickerItemProps extends IPickerItemProps<IPersonaProps & { ValidationState: ValidationState }> {
+export interface IPeoplePickerItemProps extends IPickerItemProps<IExtendedPersonaProps & { ValidationState: ValidationState }> {
 }
 
-export interface IPeopleWellPickerProps extends IBasePickerProps<IPersonaProps> {
-  floatingPickerType: new (props: IBaseFloatingPickerProps<IPersonaProps>) =>
-    BaseFloatingPicker<IPersonaProps, IBaseFloatingPickerProps<IPersonaProps>>;
+export interface IExtendedPeoplePickerProps extends IBaseExtendedPickerProps<IExtendedPersonaProps> {
 }
 
-export class BaseExtendedPeoplePicker extends BaseExtendedPicker<IPersonaProps, IPeopleWellPickerProps> {
+export class BaseExtendedPeoplePicker extends BaseExtendedPicker<IExtendedPersonaProps, IExtendedPeoplePickerProps> {
 }
 
 export class ExtendedPeoplePicker extends BaseExtendedPeoplePicker {
-  // tslint:disable-next-line:no-any
-  public static defaultProps: any = {
-    onRenderItem: (props: IPeoplePickerItemProps) => <SelectedItemDefault {...props} />,
-    floatingPickerType: FloatingPeoplePicker as new (props: IBaseFloatingPickerProps<IPersonaProps>) => BaseFloatingPeoplePicker,
-  };
 }
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePickerPage.tsx b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePickerPage.tsx
index af46933cc8900..8a73607ba5602 100644
--- a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePickerPage.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePickerPage.tsx
@@ -5,10 +5,10 @@ import {
   IComponentDemoPageProps,
   PropertiesTableSet
 } from '@uifabric/example-app-base';
-import { ExtendedPeoplePickerTypesExample } from './examples/ExtendedPeoplePicker.Basic.Example';
+import { ExtendedPeoplePickerTypesExample } from '../examples/ExtendedPeoplePicker.Basic.Example';
 
 const ExtendedPeoplePickerBasicExampleCode = require(
-  '!raw-loader!experiments/src/components/ExtendedPicker/PeoplePicker/examples/ExtendedPeoplePicker.Basic.Example.tsx'
+  '!raw-loader!experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx'
 ) as string;
 
 export class ExtendedPeoplePickerPage extends React.Component<IComponentDemoPageProps, {}> {
@@ -35,7 +35,6 @@ export class ExtendedPeoplePickerPage extends React.Component<IComponentDemoPage
           <div>
             <span>ExtendedPeoplePicker are used to pick recipients. The difference between this and the current PeoplePicker are:</span>
             <ul>
-              <li>Will show suggestions on empty query</li>
               <li>Will remove selected items on backspace even if there is text in the input area</li>
             </ul>
           </div>
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/ExtendedPeoplePicker.Basic.Example.scss b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.scss
similarity index 100%
rename from packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/ExtendedPeoplePicker.Basic.Example.scss
rename to packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.scss
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/ExtendedPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
similarity index 65%
rename from packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
rename to packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
index d1549cbe29bf9..4d803ea769d41 100644
--- a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
@@ -7,20 +7,19 @@ import {
   autobind
 } from 'office-ui-fabric-react/lib/Utilities';
 import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
-import { IBasePicker, IBasePickerSuggestionsProps, ValidationState } from 'office-ui-fabric-react/lib/Pickers';
-import { ExtendedPeoplePicker } from '../ExtendedPeoplePicker';
+import { IBasePickerSuggestionsProps, ValidationState, SuggestionsController } from 'office-ui-fabric-react/lib/Pickers';
+import { ExtendedPeoplePicker } from '../PeoplePicker/ExtendedPeoplePicker';
 import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
 import { IPersonaWithMenu } from 'office-ui-fabric-react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.Props';
-import { people, mru } from './PeoplePickerExampleData';
-import { FloatingPeoplePicker, BaseFloatingPeoplePicker } from '../FloatingPeoplePicker';
-import { IBaseFloatingPickerProps } from '../../BaseFloatingPicker.Props';
+import { people, mru, groupOne, groupTwo } from './PeopleExampleData';
 import './ExtendedPeoplePicker.Basic.Example.scss';
+import { FloatingPeoplePicker, IBaseFloatingPickerProps } from 'experiments/lib/FloatingPicker';
+import { IBaseSelectedItemsListProps, IExtendedPersonaProps, ISelectedPeopleProps, SelectedPeopleList }
+  from 'experiments/lib/SelectedItemsList';
 
 export interface IPeoplePickerExampleState {
-  currentPicker?: number | string;
   peopleList: IPersonaProps[];
   mostRecentlyUsed: IPersonaProps[];
-  currentSelectedItems?: IPersonaProps[];
 }
 
 const suggestionProps: IBasePickerSuggestionsProps = {
@@ -35,7 +34,9 @@ const suggestionProps: IBasePickerSuggestionsProps = {
 
 // tslint:disable-next-line:no-any
 export class ExtendedPeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerExampleState> {
-  private _picker: IBasePicker<IPersonaProps>;
+  private _picker: ExtendedPeoplePicker;
+  private floatingPickerProps: IBaseFloatingPickerProps<IExtendedPersonaProps>;
+  private selectedItemsListProps: ISelectedPeopleProps;
 
   constructor() {
     super();
@@ -50,7 +51,24 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<any, IPeople
     this.state = {
       peopleList: peopleList,
       mostRecentlyUsed: mru,
-      currentSelectedItems: []
+    };
+
+    this.floatingPickerProps = {
+      suggestionsController: new SuggestionsController<IExtendedPersonaProps>(),
+      onResolveSuggestions: this._onFilterChanged,
+      getTextFromItem: this._getTextFromItem,
+      pickerSuggestionsProps: suggestionProps,
+      key: 'normal',
+      onRemoveSuggestion: this._onRemoveSuggestion,
+      onValidateInput: this._validateInput,
+      onZeroQuerySuggestion: this._returnMostRecentlyUsed,
+    };
+
+    this.selectedItemsListProps = {
+      onCopyItems: this._onCopyItems,
+      onExpandGroup: this._onExpandItem,
+      removeMenuItemText: 'Remove',
+      copyMenuItemText: 'Copy name',
     };
   }
 
@@ -69,16 +87,12 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<any, IPeople
   private _renderExtendedPicker(): JSX.Element {
     return (
       <ExtendedPeoplePicker
-        floatingPickerType={ FloatingPeoplePicker as new (props: IBaseFloatingPickerProps<IPersonaProps>) => BaseFloatingPeoplePicker }
-        onResolveSuggestions={ this._onFilterChanged }
-        onEmptyInputFocus={ this._returnMostRecentlyUsed }
-        getTextFromItem={ this._getTextFromItem }
-        pickerSuggestionsProps={ suggestionProps }
+        floatingPickerProps={ this.floatingPickerProps }
+        selectedItemsListProps={ this.selectedItemsListProps }
+        onRenderFloatingPicker={ this._onRenderFloatingPicker }
+        onRenderSelectedItems={ this._onRenderSelectedItems }
         className={ 'ms-PeoplePicker' }
         key={ 'normal' }
-        onRemoveSuggestion={ this._onRemoveSuggestion }
-        onValidateInput={ this._validateInput }
-        removeButtonAriaLabel={ 'Remove' }
         inputProps={ {
           onBlur: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onBlur called'),
           onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called'),
@@ -89,8 +103,16 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<any, IPeople
     );
   }
 
+  private _onRenderFloatingPicker(props: IBaseFloatingPickerProps<IExtendedPersonaProps>): JSX.Element {
+    return (<FloatingPeoplePicker {...props} />);
+  }
+
+  private _onRenderSelectedItems(props: IBaseSelectedItemsListProps<IExtendedPersonaProps>): JSX.Element {
+    return (<SelectedPeopleList {...props} />);
+  }
+
   @autobind
-  private _setComponentRef(component: IBasePicker<IPersonaProps>): void {
+  private _setComponentRef(component: ExtendedPeoplePicker): void {
     this._picker = component;
   }
 
@@ -101,6 +123,12 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<any, IPeople
     }
   }
 
+  @autobind
+  private _onExpandItem(item: IExtendedPersonaProps): void {
+    // tslint:disable-next-line:no-any
+    (this._picker.selectedItemsList as SelectedPeopleList).onExpandItem(item, this._getExpandedGroupItems(item as any));
+  }
+
   @autobind
   private _onRemoveSuggestion(item: IPersonaProps): void {
     let { peopleList, mostRecentlyUsed: mruState } = this.state;
@@ -134,10 +162,23 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<any, IPeople
   @autobind
   private _returnMostRecentlyUsed(currentPersonas: IPersonaProps[]): IPersonaProps[] | Promise<IPersonaProps[]> {
     let { mostRecentlyUsed } = this.state;
-    mostRecentlyUsed = this._removeDuplicates(mostRecentlyUsed, currentPersonas);
+    mostRecentlyUsed = this._removeDuplicates(mostRecentlyUsed, this._picker.items);
     return mostRecentlyUsed;
   }
 
+  private _onCopyItems(items: IExtendedPersonaProps[]): string {
+    let copyText = '';
+    items.forEach((item: IExtendedPersonaProps, index: number) => {
+      copyText += item.primaryText;
+
+      if (index < items.length - 1) {
+        copyText += ', ';
+      }
+    });
+
+    return copyText;
+  }
+
   private _listContainsPersona(persona: IPersonaProps, personas: IPersonaProps[]): boolean {
     if (!personas || !personas.length || personas.length === 0) {
       return false;
@@ -171,4 +212,15 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<any, IPeople
       return ValidationState.invalid;
     }
   }
+
+  private _getExpandedGroupItems(item: IExtendedPersonaProps): IExtendedPersonaProps[] {
+    switch (item.primaryText) {
+      case 'Group One':
+        return groupOne;
+      case 'Group Two':
+        return groupTwo;
+      default:
+        return [];
+    }
+  }
 }
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/PeoplePickerExampleData.ts b/packages/experiments/src/components/ExtendedPicker/examples/PeopleExampleData.ts
similarity index 94%
rename from packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/PeoplePickerExampleData.ts
rename to packages/experiments/src/components/ExtendedPicker/examples/PeopleExampleData.ts
index 35db5ebffc4a7..39dc4df24b56e 100644
--- a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/PeoplePickerExampleData.ts
+++ b/packages/experiments/src/components/ExtendedPicker/examples/PeopleExampleData.ts
@@ -1,7 +1,8 @@
-import { IPersonaProps, PersonaPresence } from 'office-ui-fabric-react/lib/Persona';
+import { PersonaPresence } from 'office-ui-fabric-react/lib/Persona';
+import { IExtendedPersonaProps } from 'experiments/lib/SelectedItemsList';
 import { TestImages } from 'office-ui-fabric-react/lib/common/TestImages';
 
-export const people: (IPersonaProps & { key: string | number })[] = [
+export const people: (IExtendedPersonaProps & { key: string | number })[] = [
   {
     key: 1,
     imageUrl: TestImages.personaFemale,
@@ -402,7 +403,23 @@ export const people: (IPersonaProps & { key: string | number })[] = [
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
     presence: PersonaPresence.online
-  }
+  },
+  {
+    key: 41,
+    imageInitials: 'GO',
+    primaryText: 'Group One',
+    canExpand: true,
+  },
+  {
+    key: 42,
+    imageInitials: 'GT',
+    primaryText: 'Group Two',
+    canExpand: true,
+  },
 ];
 
-export const mru: IPersonaProps[] = people.slice(0, 5);
\ No newline at end of file
+export const mru: IExtendedPersonaProps[] = people.slice(0, 5);
+
+export const groupOne: IExtendedPersonaProps[] = people.slice(6, 10);
+
+export const groupTwo: IExtendedPersonaProps[] = people.slice(11, 16);
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/index.ts b/packages/experiments/src/components/ExtendedPicker/index.ts
index 5bcd85209d190..de5ef8894258b 100644
--- a/packages/experiments/src/components/ExtendedPicker/index.ts
+++ b/packages/experiments/src/components/ExtendedPicker/index.ts
@@ -1,5 +1,4 @@
-export * from './BaseFloatingPicker';
-export * from './BaseFloatingPicker.Props';
 export * from './BaseExtendedPicker';
+export * from './BaseExtendedPicker.Props';
 export * from './PeoplePicker/ExtendedPeoplePicker';
-export * from './PeoplePicker/FloatingPeoplePicker';
\ No newline at end of file
+export * from './examples/PeopleExampleData';
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseFloatingPicker.Props.ts b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.Props.ts
similarity index 100%
rename from packages/experiments/src/components/ExtendedPicker/BaseFloatingPicker.Props.ts
rename to packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.Props.ts
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseFloatingPicker.tsx b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
similarity index 99%
rename from packages/experiments/src/components/ExtendedPicker/BaseFloatingPicker.tsx
rename to packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
index 87eeee0cbe5b3..284ce1bba65fe 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseFloatingPicker.tsx
+++ b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
@@ -76,6 +76,7 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
     this.setState({
       suggestionsVisible: false,
     });
+    console.log('hidepicker');
   }
 
   public showPicker(): void {
@@ -135,6 +136,7 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
       </div>
     );
   }
+
   protected renderSuggestions(): JSX.Element | null {
     let TypedSuggestion = this.SuggestionOfProperType;
     return this.state.suggestionsVisible ? (
@@ -187,7 +189,6 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
 
   protected updateSuggestions(suggestions: T[]): void {
     this.suggestionStore.updateSuggestions(suggestions, 0);
-    this.forceUpdate();
   }
 
   protected updateValue(updatedValue: string): void {
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/FloatingPeoplePicker.tsx b/packages/experiments/src/components/FloatingPicker/PeoplePicker/FloatingPeoplePicker.tsx
similarity index 100%
rename from packages/experiments/src/components/ExtendedPicker/PeoplePicker/FloatingPeoplePicker.tsx
rename to packages/experiments/src/components/FloatingPicker/PeoplePicker/FloatingPeoplePicker.tsx
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/FloatingPeoplePickerPage.tsx b/packages/experiments/src/components/FloatingPicker/PeoplePicker/FloatingPeoplePickerPage.tsx
similarity index 95%
rename from packages/experiments/src/components/ExtendedPicker/PeoplePicker/FloatingPeoplePickerPage.tsx
rename to packages/experiments/src/components/FloatingPicker/PeoplePicker/FloatingPeoplePickerPage.tsx
index 994e6d0354403..490af5dd053a2 100644
--- a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/FloatingPeoplePickerPage.tsx
+++ b/packages/experiments/src/components/FloatingPicker/PeoplePicker/FloatingPeoplePickerPage.tsx
@@ -8,7 +8,7 @@ import {
 import { FloatingPeoplePickerTypesExample } from '../PeoplePicker/examples/FloatingPeoplePicker.Basic.Example';
 
 const FloatingPeoplePickerBasicExampleCode = require(
-  '!raw-loader!experiments/src/components/ExtendedPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx'
+  '!raw-loader!experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx'
 ) as string;
 
 export class FloatingPeoplePickerPage extends React.Component<IComponentDemoPageProps, {}> {
@@ -27,7 +27,7 @@ export class FloatingPeoplePickerPage extends React.Component<IComponentDemoPage
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!experiments/src/components/ExtendedPicker/BaseFloatingPicker.Props.ts')
+              require<string>('!raw-loader!experiments/src/components/FloatingPicker/BaseFloatingPicker.Props.ts')
             ] }
           />
         }
diff --git a/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePicker.scss b/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePicker.scss
new file mode 100644
index 0000000000000..635afea0d6e67
--- /dev/null
+++ b/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePicker.scss
@@ -0,0 +1,30 @@
+
+@import '~office-ui-fabric-react/src/common/common';
+
+.resultContent {
+  display: table-row;
+  .resultItem {
+    display: table-cell;
+    vertical-align: bottom;
+  }
+}
+
+.peoplePickerPersona {
+  width: 180px;
+   :global(.ms-Persona-details) {
+    width: 100%;
+  }
+}
+
+.peoplePicker {
+   :global(.ms-BasePicker-text) {
+    min-height: 40px;
+  }
+}
+
+.peoplePickerPersonaContent {
+  display: flex;
+  width: 100%;
+  justify-content: space-between;
+  align-items: center;
+}
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss b/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
similarity index 100%
rename from packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
rename to packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx b/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
similarity index 96%
rename from packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
rename to packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
index 25bf24c2c545e..916420bb6c5ac 100644
--- a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
+++ b/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 /* tslint:enable */
 import { css, getId } from '../../../../Utilities';
 import { Persona, PersonaSize, PersonaPresence } from 'office-ui-fabric-react/lib/Persona';
-import { IPeoplePickerItemProps } from '../ExtendedPeoplePicker';
+import { IPeoplePickerItemProps } from 'experiments/lib/ExtendedPicker';
 import { ValidationState } from 'office-ui-fabric-react/lib/Pickers';
 import { IconButton } from 'office-ui-fabric-react/lib/Button';
 import * as stylesImport from './PickerItemsDefault.scss';
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx b/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
similarity index 100%
rename from packages/experiments/src/components/ExtendedPicker/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
rename to packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
diff --git a/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.scss b/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.scss
new file mode 100644
index 0000000000000..d8e0a86cbf7d1
--- /dev/null
+++ b/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.scss
@@ -0,0 +1,9 @@
+:global {
+  .ms-PeoplePicker {
+    width: 100%;
+  }
+
+  .ms-SearchBoxSmallExample {
+    width: 208px;
+  }
+}
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
similarity index 98%
rename from packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
rename to packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
index bffe0e2cb9217..42cea806b2d95 100644
--- a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
+++ b/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
@@ -11,8 +11,8 @@ import { IBasePickerSuggestionsProps, ValidationState, SuggestionsController } f
 import { IBaseFloatingPicker } from '../../BaseFloatingPicker.Props';
 import { FloatingPeoplePicker } from '../FloatingPeoplePicker';
 import { IPersonaWithMenu } from 'office-ui-fabric-react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.Props';
-import { people, mru } from './PeoplePickerExampleData';
-import './ExtendedPeoplePicker.Basic.Example.scss';
+import { people, mru } from 'experiments/lib/ExtendedPicker';
+import './FloatingPeoplePicker.Basic.Example.scss';
 import { SearchBox } from 'office-ui-fabric-react/lib/SearchBox';
 
 export interface IPeoplePickerExampleState {
diff --git a/packages/experiments/src/components/FloatingPicker/index.ts b/packages/experiments/src/components/FloatingPicker/index.ts
new file mode 100644
index 0000000000000..2cf647d414d70
--- /dev/null
+++ b/packages/experiments/src/components/FloatingPicker/index.ts
@@ -0,0 +1,3 @@
+export * from './BaseFloatingPicker';
+export * from './BaseFloatingPicker.Props';
+export * from './PeoplePicker/FloatingPeoplePicker';
\ No newline at end of file
diff --git a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.Props.ts b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.Props.ts
new file mode 100644
index 0000000000000..2f5262bf02dd2
--- /dev/null
+++ b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.Props.ts
@@ -0,0 +1,59 @@
+import * as React from 'react';
+import { IPickerItemProps, ISuggestionModel, ValidationState } from 'office-ui-fabric-react/lib/Pickers';
+
+export interface IBaseSelectedItemsList<T> {
+  /** Gets the current value of the input. */
+  items: T[] | undefined;
+
+  addItems: (items: T[]) => void;
+}
+
+export interface ISelectedItemProps<T> extends IPickerItemProps<T> {
+  onCopyItem: (item: T) => void;
+}
+
+// Type T is the type of the item that is displayed
+// For example, if the picker is displaying persona's than type T could either be of Persona or Ipersona props
+// tslint:disable-next-line:no-any
+export interface IBaseSelectedItemsListProps<T> extends React.Props<any> {
+  componentRef?: (component?: IBaseSelectedItemsList<T>) => void;
+  /**
+   * A callback for when items are copied
+   */
+  onCopyItems?: (items: T[]) => string;
+  /**
+   * Function that specifies how the selected item will appear.
+   */
+  onRenderItem?: (props: ISelectedItemProps<T>) => JSX.Element;
+  /**
+   * Initial items that have already been selected and should appear in the people picker.
+   */
+  defaultSelectedItems?: T[];
+  /**
+   * A callback for when the selected list of items changes.
+   */
+  onChange?: (items?: T[]) => void;
+  /**
+   * ClassName for the picker.
+   */
+  className?: string;
+  /**
+   * Function that specifies how arbitrary text entered into the well is handled.
+   */
+  createGenericItem?: (input: string, ValidationState: ValidationState) => ISuggestionModel<T>;
+  /**
+   * A callback to process a selection after the user selects something from the picker.
+   */
+  onItemSelected?: (selectedItem?: T) => T | PromiseLike<T>;
+  /**
+   * The items that the base picker should currently display as selected. If this is provided then the picker will act as a
+   * controlled component.
+   */
+  selectedItems?: T[];
+
+  /**
+  * Aria label for the 'X' button in the selected item component.
+  * @default ''
+  */
+  removeButtonAriaLabel?: string;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx
new file mode 100644
index 0000000000000..482a85503c6f1
--- /dev/null
+++ b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx
@@ -0,0 +1,278 @@
+import * as React from 'react';
+import {
+  BaseComponent,
+  KeyCodes,
+  autobind,
+  css
+} from '../../Utilities';
+import { FocusZone, FocusZoneDirection } from 'office-ui-fabric-react/lib/FocusZone';
+import { Selection, SelectionZone, SelectionMode } from 'office-ui-fabric-react/lib/Selection';
+import { IBaseSelectedItemsList, IBaseSelectedItemsListProps, ISelectedItemProps } from './BaseSelectedItemsList.Props';
+
+export interface IBaseSelectedItemsListState {
+  // tslint:disable-next-line:no-any
+  items?: any;
+  suggestedDisplayValue?: string;
+  moreSuggestionsAvailable?: boolean;
+  isSearching?: boolean;
+  isMostRecentlyUsedVisible?: boolean;
+  suggestionsVisible?: boolean;
+  suggestionsLoading?: boolean;
+  isResultsFooterVisible?: boolean;
+}
+
+export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
+  extends BaseComponent<P, IBaseSelectedItemsListState> implements IBaseSelectedItemsList<T> {
+
+  protected selection: Selection;
+
+  protected root: HTMLElement;
+  protected focusZone: FocusZone;
+
+  constructor(basePickerProps: P) {
+    super(basePickerProps);
+
+    let items: T[] = basePickerProps.selectedItems || basePickerProps.defaultSelectedItems || [];
+
+    this.selection = new Selection({ onSelectionChanged: () => this.onSelectionChange() });
+    this.selection.setItems(items);
+    this.state = {
+      items: items,
+    };
+  }
+
+  public get items(): T[] {
+    return this.state.items;
+  }
+
+  @autobind
+  public addItems(items: T[]): void {
+    // tslint:disable-next-line:no-any
+    let processedItems: T[] | PromiseLike<T[]> = this.props.onItemSelected ? (this.props.onItemSelected as any)(items) : items;
+
+    let processedItemObjects: T[] = processedItems as T[];
+    let processedItemPromiseLikes: PromiseLike<T[]> = processedItems as PromiseLike<T[]>;
+
+    if (processedItemPromiseLikes && processedItemPromiseLikes.then) {
+      processedItemPromiseLikes.then((resolvedProcessedItems: T[]) => {
+        let newItems: T[] = this.state.items.concat(resolvedProcessedItems);
+        this.updateSelectedItems(newItems);
+      });
+    } else {
+      let newItems: T[] = this.state.items.concat(processedItemObjects);
+      this.updateSelectedItems(newItems);
+    }
+    this.setState({ suggestedDisplayValue: '' });
+  }
+
+  @autobind
+  public removeItemAt(index: number): void {
+    let { items } = this.state;
+    // tslint:disable-next-line:no-any
+    if (index > -1) {
+      let newItems = items.slice(0, index).concat(items.slice(index + 1));
+      this.updateSelectedItems(newItems);
+    }
+  }
+
+  @autobind
+  public onCopy(ev: React.ClipboardEvent<HTMLElement>): void {
+    if (this.props.onCopyItems && this.selection.getSelectedCount() > 0) {
+      let selectedItems: T[] = this.selection.getSelection() as T[];
+      this.copyItems(selectedItems);
+    }
+  }
+
+  public unselectAll(): void {
+    this.selection.setAllSelected(false);
+  }
+
+  public componentWillUpdate(newProps: P, newState: IBaseSelectedItemsListState): void {
+    if (newState.items && newState.items !== this.state.items) {
+      this.selection.setItems(newState.items);
+    }
+  }
+
+  public componentDidMount(): void {
+    this.selection.setItems(this.state.items);
+  }
+
+  public componentWillReceiveProps(newProps: P): void {
+    let newItems = newProps.selectedItems;
+
+    if (newItems) {
+      let focusIndex: number;
+
+      // If there are less new items than old items then something was removed and we
+      // should try to keep focus consistent
+      if (newItems.length < this.state.items.length) {
+        focusIndex = this.state.items.indexOf(this.selection.getSelection()[0]);
+      }
+
+      this.setState({ items: newProps.selectedItems });
+    }
+  }
+
+  public render(): JSX.Element {
+    let { className } = this.props;
+
+    return (
+      <div
+        ref={ this._resolveRef('root') }
+        className={ css(
+          'ms-BasePicker',
+          className ? className : '') }
+        onKeyDown={ this.onKeyDown }
+        onCopy={ this.onCopy }
+      >
+        <FocusZone
+          ref={ this._resolveRef('focusZone') }
+          direction={ FocusZoneDirection.bidirectional }
+          isInnerZoneKeystroke={ this._isFocusZoneInnerKeystroke }
+        >
+          <SelectionZone selection={ this.selection } selectionMode={ SelectionMode.multiple } >
+            <div role={ 'list' }>
+              { this.renderItems() }
+            </div>
+          </SelectionZone>
+        </FocusZone>
+      </div>
+    );
+  }
+
+  @autobind
+  protected renderItems(): JSX.Element[] {
+    let { removeButtonAriaLabel } = this.props;
+    let onRenderItem = this.props.onRenderItem as (props: ISelectedItemProps<T>) => JSX.Element;
+
+    let { items } = this.state;
+    // tslint:disable-next-line:no-any
+    return items.map((item: any, index: number) => onRenderItem({
+      item,
+      index,
+      key: item.key ? item.key : index,
+      selected: this.selection.isIndexSelected(index),
+      onRemoveItem: () => this.removeItem(item),
+      onItemChange: this.onItemChange,
+      removeButtonAriaLabel: removeButtonAriaLabel,
+      onCopyItem: (itemToCopy: T) => this.copyItems([itemToCopy]),
+    }));
+  }
+
+  protected onSelectionChange(): void {
+    this.forceUpdate();
+  }
+
+  protected onChange(items?: T[]): void {
+    if (this.props.onChange) {
+      (this.props.onChange as (items?: T[]) => void)(items);
+    }
+  }
+
+  @autobind
+  protected onKeyDown(ev: React.KeyboardEvent<HTMLElement>): void {
+    switch (ev.which) {
+      case KeyCodes.backspace:
+        ev.stopPropagation();
+        this.onBackspace(ev);
+        break;
+
+      case KeyCodes.del:
+        this.onBackspace(ev);
+    }
+  }
+
+  @autobind
+  protected onItemChange(changedItem: T, index: number): void {
+    let { items } = this.state;
+
+    if (index >= 0) {
+      let newItems: T[] = items;
+      newItems[index] = changedItem;
+
+      this.updateSelectedItems(newItems);
+    }
+  }
+
+  @autobind
+  protected removeItem(item: ISelectedItemProps<T>): void {
+    let { items } = this.state;
+    let index: number = items.indexOf(item);
+
+    if (index >= 0) {
+      let newItems: T[] = items.slice(0, index).concat(items.slice(index + 1));
+      this.updateSelectedItems(newItems);
+    }
+  }
+
+  @autobind
+  // tslint:disable-next-line:no-any
+  protected removeItems(itemsToRemove: any[]): void {
+    let { items } = this.state;
+    // tslint:disable-next-line:no-any
+    let newItems: T[] = items.filter((item: any) => itemsToRemove.indexOf(item) === -1);
+    let firstItemToRemove = itemsToRemove[0];
+    let index: number = items.indexOf(firstItemToRemove);
+
+    this.updateSelectedItems(newItems, index);
+  }
+
+  // This is protected because we may expect the backspace key to work differently in a different kind of picker.
+  // This lets the subclass override it and provide it's own onBackspace. For an example see the BasePickerListBelow
+  protected onBackspace(ev: React.KeyboardEvent<HTMLElement>): void {
+    if (this.state.items.length) {
+      if (this.selection.getSelectedCount() > 0) {
+        this.removeItems(this.selection.getSelection());
+      } else {
+        this.removeItem(this.state.items[this.state.items.length - 1]);
+      }
+    }
+  }
+
+  /**
+   * Controls what happens whenever there is an action that impacts the selected items.
+   * If selectedItems is provided as a property then this will act as a controlled component and it will not update it's own state.
+  */
+  protected updateSelectedItems(items: T[], focusIndex?: number): void {
+    if (this.props.selectedItems) {
+      // If the component is a controlled component then the controlling component will need
+      this.onChange(items);
+    } else {
+      this.setState({ items: items }, () => {
+        this._onSelectedItemsUpdated(items, focusIndex);
+      });
+    }
+  }
+
+  protected copyItems(items: T[]): void {
+    if (this.props.onCopyItems) {
+      // tslint:disable-next-line:no-any
+      let copyText = (this.props.onCopyItems as any)(items);
+
+      let copyInput = document.createElement('input') as HTMLInputElement;
+      document.body.appendChild(copyInput);
+
+      try {
+        // Try to copy the text directly to the clipboard
+        copyInput.value = copyText;
+        copyInput.select();
+        if (!document.execCommand('copy')) {
+          // The command failed. Fallback to the method below.
+          throw new Error();
+        }
+      } catch (err) {
+        // no op
+      } finally {
+        document.body.removeChild(copyInput);
+      }
+    }
+  }
+
+  protected _isFocusZoneInnerKeystroke(ev: React.KeyboardEvent<HTMLElement>): boolean {
+    return false;
+  }
+
+  private _onSelectedItemsUpdated(items?: T[], focusIndex?: number): void {
+    this.onChange(items);
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.scss b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.scss
new file mode 100644
index 0000000000000..322c8b7bcd3c9
--- /dev/null
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.scss
@@ -0,0 +1,136 @@
+@import '~office-ui-fabric-react/src/common/common';
+
+.personaContainer {
+  @include focus-border(-2px);
+  border-radius: 15px;
+  display: inline-flex;
+  align-items: center;
+  background: $ms-color-neutralLighter;
+  margin: 4px;
+  cursor: default;
+  user-select: none;
+  max-width: 300px;
+  vertical-align: middle;
+  position: relative;
+
+  &:hover {
+    background: $ms-color-neutralLight;
+
+    .removeButton {
+      color: $ms-color-neutralPrimary;
+    }
+  }
+
+  &.personaContainerIsSelected {
+    background: $ms-color-blue;
+
+    // Setting global values here to override persona's normal behavior specifically in this selected variation
+    :global(.ms-Persona-primaryText) {
+      color: $ms-color-white;
+
+      @include high-contrast {
+        color: HighlightText;
+      }
+    }
+
+    .actionButton {
+      :global(.ms-Button-icon) {
+        color: $ms-color-white;
+
+        @include high-contrast {
+          color: HighlightText;
+        }
+      }
+
+      &:hover {
+        color: $ms-color-white;
+        background: $ms-color-themeDark;
+      }
+    }
+
+    @include high-contrast {
+      border-color: Highlight;
+      background: Highlight;
+      -ms-high-contrast-adjust: none;
+    }
+  }
+
+  &.validationError {
+    // Setting global values here to override persona's normal behavior in the error version
+    :global(.ms-Persona-primaryText) {
+      color: $ms-color-redDark;
+      border-bottom: 2px dotted $ms-color-redDark;
+    }
+
+    :global(.ms-Persona-initials) {
+      font-size: 20px;
+    }
+
+    &.personaContainerIsSelected {
+      background: $ms-color-redDark;
+
+      :global(.ms-Persona-primaryText) {
+        color: $ms-color-white;
+        border-bottom: 2px dotted $ms-color-white;
+      }
+
+      .removeButton:hover {
+        background: $ms-color-red;
+      }
+    }
+  }
+
+  @include high-contrast {
+    border: 1px solid WindowText;
+  }
+
+  .itemContent {
+    flex: 0 1 auto;
+    min-width: 0px;
+
+    /** CSS below is needed for IE 11 to properly truncate long persona names in the picker **/
+    max-width: 100%;
+    overflow-x: hidden;
+  }
+
+  .removeButton {
+    border-radius: 15px;
+    flex: 0 0 auto;
+    width: 28px;
+    height: 28px;
+    flex-basis: 28px;
+
+    &:hover {
+      background: $ms-color-neutralTertiaryAlt;
+      color: $ms-color-neutralDark;
+    }
+  }
+
+  .expandButton {
+    border-radius: 15px 0px 0px 15px;
+    height: 28px;
+    flex-basis: 28px;
+    padding-right: 12px;
+    position: inherit;
+    margin-right: -8px;
+
+    &:hover {
+      background: $ms-color-neutralTertiaryAlt;
+      color: $ms-color-neutralDark;
+    }
+  }
+
+  .personaWrapper {
+    position: relative;
+    display: inherit;
+  }
+
+  .personaDetails {
+    flex: 0 1 auto;
+  }
+}
+
+.itemContainer {
+  display: inline-block;
+  vertical-align: top;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx
new file mode 100644
index 0000000000000..f2802a5602b28
--- /dev/null
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx
@@ -0,0 +1,109 @@
+/* tslint:disable */
+import * as React from 'react';
+/* tslint:enable */
+import { BaseComponent, autobind, css, getId } from '../../../../Utilities';
+import { Persona, PersonaSize, PersonaPresence } from 'office-ui-fabric-react/lib/Persona';
+import { ValidationState } from 'office-ui-fabric-react/lib/Pickers';
+import { ISelectedPeopleItemProps } from '../SelectedPeopleList';
+import { IconButton } from 'office-ui-fabric-react/lib/Button';
+import { ContextualMenu, DirectionalHint } from 'office-ui-fabric-react/lib/ContextualMenu';
+import * as stylesImport from './ExtendedSelectedItem.scss';
+// tslint:disable-next-line:no-any
+const styles: any = stylesImport;
+
+export interface IPeoplePickerItemState {
+  contextualMenuVisible: boolean;
+}
+
+export class ExtendedSelectedItem extends BaseComponent<ISelectedPeopleItemProps, IPeoplePickerItemState> {
+  protected persona: HTMLElement;
+
+  constructor(props: ISelectedPeopleItemProps) {
+    super(props);
+    this.state = { contextualMenuVisible: false };
+  }
+
+  public render(): JSX.Element {
+    let {
+      item,
+      onExpandItem,
+      onRemoveItem,
+      removeButtonAriaLabel,
+      index,
+      selected
+    } = this.props;
+    const itemId = getId();
+    return (
+      <div
+        ref={ this._resolveRef('persona') }
+        className={ css(
+          'ms-PickerPersona-container',
+          styles.personaContainer,
+          { ['is-selected ' + styles.personaContainerIsSelected]: selected },
+          { ['is-invalid ' + styles.validationError]: item.ValidationState === ValidationState.warning }
+        ) }
+        data-is-focusable={ true }
+        data-is-sub-focuszone={ true }
+        data-selection-index={ index }
+        role={ 'listitem' }
+        aria-labelledby={ 'selectedItemPersona-' + itemId }
+        onContextMenu={ this._onClick }
+      >
+        <div hidden={ !item.canExpand || onExpandItem === undefined }>
+          <IconButton
+            onClick={ this.onClickIconButton(onExpandItem) }
+            iconProps={ { iconName: 'Add', style: { fontSize: '12px' } } }
+            className={ css('ms-PickerItem-removeButton', styles.expandButton, styles.actionButton) }
+            ariaLabel={ removeButtonAriaLabel }
+          />
+        </div>
+        <div className={ css(styles.personaWrapper) }>
+          <div
+            className={ css('ms-PickerItem-content', styles.itemContent) }
+            id={ 'selectedItemPersona-' + itemId }
+          >
+            <Persona
+              { ...item }
+              presence={ item.presence !== undefined ? item.presence : PersonaPresence.none }
+              size={ PersonaSize.size28 }
+            />
+          </div>
+          <IconButton
+            onClick={ this.onClickIconButton(onRemoveItem) }
+            iconProps={ { iconName: 'Cancel', style: { fontSize: '12px' } } }
+            className={ css('ms-PickerItem-removeButton', styles.removeButton, styles.actionButton) }
+            ariaLabel={ removeButtonAriaLabel }
+          />
+        </div >
+        { this.state.contextualMenuVisible ? (
+          <ContextualMenu
+            items={ this.props.menuItems }
+            shouldFocusOnMount={ true }
+            target={ this.persona }
+            onDismiss={ this._onCloseContextualMenu }
+            directionalHint={ DirectionalHint.bottomAutoEdge }
+          />)
+          : null
+        }
+      </div >);
+  }
+
+  private onClickIconButton = (action: (() => void) | undefined): () => void => {
+    return (): void => {
+      if (action) {
+        action();
+      }
+    };
+  }
+
+  @autobind
+  private _onClick(ev: React.MouseEvent<HTMLElement>): void {
+    ev.preventDefault();
+    this.setState({ contextualMenuVisible: true });
+  }
+
+  @autobind
+  private _onCloseContextualMenu(ev: Event): void {
+    this.setState({ contextualMenuVisible: false });
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
new file mode 100644
index 0000000000000..201685b58200e
--- /dev/null
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
@@ -0,0 +1,95 @@
+/* tslint:disable */
+import * as React from 'react';
+import { ValidationState } from 'office-ui-fabric-react/lib/Pickers';
+/* tslint:enable */
+import { BaseSelectedItemsList } from '../BaseSelectedItemsList';
+import { IBaseSelectedItemsListProps, ISelectedItemProps } from '../BaseSelectedItemsList.Props';
+import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
+import { ExtendedSelectedItem } from './Items/ExtendedSelectedItem';
+import { autobind } from '../../../Utilities';
+import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
+
+export interface IExtendedPersonaProps extends IPersonaProps {
+  canExpand?: boolean;
+}
+
+export interface ISelectedPeopleItemProps extends ISelectedItemProps<IExtendedPersonaProps & { ValidationState: ValidationState }> {
+  onExpandItem?: () => void;
+  menuItems: IContextualMenuItem[];
+}
+
+export interface ISelectedPeopleProps extends IBaseSelectedItemsListProps<IExtendedPersonaProps> {
+  onExpandGroup?: (item: IExtendedPersonaProps) => void;
+  removeMenuItemText?: string;
+  copyMenuItemText?: string;
+}
+
+export class BasePeopleSelectedItemsList extends BaseSelectedItemsList<IExtendedPersonaProps, ISelectedPeopleProps> {
+}
+
+/**
+ * Standard People Picker.
+ */
+export class SelectedPeopleList extends BasePeopleSelectedItemsList {
+
+  // tslint:disable-next-line:no-any
+  public static defaultProps: any = {
+    onRenderItem: (props: ISelectedPeopleItemProps) => <ExtendedSelectedItem {...props} />,
+  };
+
+  public onExpandItem(itemToExpand: IExtendedPersonaProps, expandedItems: IExtendedPersonaProps[]): void {
+    let { items } = this.state;
+    let index: number = items.indexOf(itemToExpand);
+    // tslint:disable-next-line:no-any
+    let filteredExpandedItems = expandedItems.filter((item: any) => items.indexOf(item) === -1);
+    if (index > -1) {
+      let newItems = items.slice(0, index).concat(filteredExpandedItems).concat(items.slice(index + 1));
+      this.updateSelectedItems(newItems);
+    }
+  }
+
+  @autobind
+  protected renderItems(): JSX.Element[] {
+    let { removeButtonAriaLabel } = this.props;
+    let onRenderItem = this.props.onRenderItem as (props: ISelectedPeopleItemProps) => JSX.Element;
+
+    let { items } = this.state;
+    // tslint:disable-next-line:no-any
+    return items.map((item: any, index: number) => onRenderItem({
+      item,
+      index,
+      key: item.key ? item.key : index,
+      selected: this.selection.isIndexSelected(index),
+      onRemoveItem: () => this.removeItem(item),
+      onItemChange: this.onItemChange,
+      removeButtonAriaLabel: removeButtonAriaLabel,
+      onCopyItem: (itemToCopy: IExtendedPersonaProps) => this.copyItems([itemToCopy]),
+      onExpandItem: this.props.onExpandGroup ? () => (this.props.onExpandGroup as (item: IExtendedPersonaProps) => void)(item) : undefined,
+      menuItems: this._createMenuItems(item),
+    }));
+  }
+
+  // tslint:disable-next-line:no-any
+  private _createMenuItems(item: any): IContextualMenuItem[] {
+    return [
+      {
+        key: 'Copy',
+        name: this.props.copyMenuItemText ? this.props.copyMenuItemText : 'Copy',
+        onClick: (ev: React.MouseEvent<HTMLElement>, menuItem: IContextualMenuItem) => {
+          if (this.props.onCopyItems) {
+            (this.copyItems as (items: IExtendedPersonaProps[]) => void)([menuItem.data] as IExtendedPersonaProps[]);
+          }
+        },
+        data: item,
+      },
+      {
+        key: 'Remove',
+        name: this.props.removeMenuItemText ? this.props.removeMenuItemText : 'Remove',
+        onClick: (ev: React.MouseEvent<HTMLElement>, menuItem: IContextualMenuItem) => {
+          this.removeItem(menuItem.data as ISelectedItemProps<IExtendedPersonaProps>);
+        },
+        data: item,
+      },
+    ];
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleListPage.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleListPage.tsx
new file mode 100644
index 0000000000000..28b0f46bf4dd1
--- /dev/null
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleListPage.tsx
@@ -0,0 +1,56 @@
+import * as React from 'react';
+import {
+  ExampleCard,
+  IComponentDemoPageProps,
+  ComponentPage,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+
+import { PeopleSelectedItemsListExample } from '../examples/SelectedPeopleList.Basic.Example';
+const PeopleSelectedItemsListExampleCode =
+  require('!raw-loader!experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example') as string;
+
+export class SelectedPeopleListPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render(): JSX.Element {
+    return (
+      <ComponentPage
+        title='SelectedPeopleList'
+        componentName='SelectedPeopleList'
+        exampleCards={
+          <div>
+            <ExampleCard title='Selected People List' code={ PeopleSelectedItemsListExampleCode }>
+              <PeopleSelectedItemsListExample />
+            </ExampleCard>
+          </div>
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!experiments/src/components/SelectedItemsList/BaseSelectedItemsList.props.ts')
+            ] }
+          />
+        }
+        overview={
+          <div />
+        }
+        bestPractices={
+          <div />
+        }
+        dos={
+          <div>
+            <ul>
+              <li>Use them to represent list of selected people.</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul>
+              <li>Use for other items besides selected people</li>
+            </ul>
+          </div>
+        }
+      />
+    );
+  }
+}
diff --git a/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx b/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
new file mode 100644
index 0000000000000..a6906fe3ceb90
--- /dev/null
+++ b/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
@@ -0,0 +1,91 @@
+/* tslint:disable */
+import * as React from 'react';
+/* tslint:enable */
+import {
+  BaseComponent,
+  autobind
+} from 'office-ui-fabric-react/lib/Utilities';
+import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
+import { people, groupOne, groupTwo } from 'experiments/lib/ExtendedPicker';
+import '../../../../../office-ui-fabric-react/src/components/Pickers/PeoplePicker/examples/PeoplePicker.Types.Example.scss';
+import { IBaseSelectedItemsListProps } from '../BaseSelectedItemsList.Props';
+import { IExtendedPersonaProps, SelectedPeopleList } from '../SelectedPeopleList/SelectedPeopleList';
+
+export class PeopleSelectedItemsListExample extends BaseComponent<IBaseSelectedItemsListProps<IExtendedPersonaProps>, {}> {
+  private _selectionList: SelectedPeopleList;
+  private index: number;
+
+  public render(): JSX.Element {
+    return (
+      <div className={ 'ms-BasePicker-text' }>
+        <PrimaryButton
+          text='Add another item'
+          onClick={ this._onAddItemButtonClicked }
+        />
+        { this._renderExtendedPicker() }
+      </div>
+    );
+  }
+
+  private _renderExtendedPicker(): JSX.Element {
+    return (
+      <SelectedPeopleList
+        className={ 'ms-PeoplePicker' }
+        key={ 'normal' }
+        removeButtonAriaLabel={ 'Remove' }
+        defaultSelectedItems={ [people[40]] }
+        componentRef={ this._setComponentRef }
+        onCopyItems={ this._onCopyItems }
+        onExpandGroup={ this._onExpandItem }
+        copyMenuItemText={ 'Copy' }
+        removeMenuItemText={ 'Remove' }
+      />
+    );
+  }
+
+  @autobind
+  private _setComponentRef(component: SelectedPeopleList): void {
+    this._selectionList = component;
+  }
+
+  @autobind
+  private _onAddItemButtonClicked(): void {
+    if (this._selectionList) {
+      if (!this.index) {
+        this.index = 0;
+      }
+      this._selectionList.addItems([people[this.index]]);
+      this.index++;
+    }
+  }
+
+  @autobind
+  private _onExpandItem(item: IExtendedPersonaProps): void {
+    // tslint:disable-next-line:no-any
+    this._selectionList.onExpandItem(item, this._getExpandedGroupItems(item as any));
+  }
+
+  private _onCopyItems(items: IExtendedPersonaProps[]): string {
+    let copyText = '';
+    items.forEach((item: IExtendedPersonaProps, index: number) => {
+      copyText += item.primaryText;
+
+      if (index < items.length - 1) {
+        copyText += ', ';
+      }
+    });
+
+    return copyText;
+  }
+
+  private _getExpandedGroupItems(item: IExtendedPersonaProps): IExtendedPersonaProps[] {
+    switch (item.primaryText) {
+      case 'Group One':
+        return groupOne;
+      case 'Group Two':
+        return groupTwo;
+      default:
+        return [];
+    }
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/SelectedItemsList/index.ts b/packages/experiments/src/components/SelectedItemsList/index.ts
new file mode 100644
index 0000000000000..eafcf21f73735
--- /dev/null
+++ b/packages/experiments/src/components/SelectedItemsList/index.ts
@@ -0,0 +1,3 @@
+export * from './BaseSelectedItemsList.Props';
+export * from './BaseSelectedItemsList';
+export * from './SelectedPeopleList/SelectedPeopleList';
\ No newline at end of file
diff --git a/packages/experiments/src/demo/AppDefinition.tsx b/packages/experiments/src/demo/AppDefinition.tsx
index 8a9c1dfe669ee..34c59d5027382 100644
--- a/packages/experiments/src/demo/AppDefinition.tsx
+++ b/packages/experiments/src/demo/AppDefinition.tsx
@@ -46,18 +46,24 @@ export const AppDefinition: IAppDefinition = {
           name: 'TilesList',
           url: '#/examples/tileslist'
         },
+        {
+          component: require<any>('../components/FloatingPicker/PeoplePicker/FloatingPeoplePickerPage').FloatingPeoplePickerPage,
+          key: 'FloatingPeoplePicker',
+          name: 'FloatingPeoplePicker',
+          url: '#/examples/floatingpeoplepicker'
+        },
+        {
+          component: require<any>('../components/SelectedItemsList/SelectedPeopleList/SelectedPeopleListPage').SelectedPeopleListPage,
+          key: 'PeopleItemList',
+          name: 'PeopleItemList',
+          url: '#/examples/peopleitemlist'
+        },
         {
           component: require<any>('../components/ExtendedPicker/PeoplePicker/ExtendedPeoplePickerPage').ExtendedPeoplePickerPage,
           key: 'ExtendedPeoplePicker',
           name: 'ExtendedPeoplePicker',
           url: '#/examples/extendedpeoplepicker'
         },
-        {
-          component: require<any>('../components/ExtendedPicker/PeoplePicker/FloatingPeoplePickerPage').FloatingPeoplePickerPage,
-          key: 'FloatingPeoplePicker',
-          name: 'FloatingPeoplePicker',
-          url: '#/examples/floatingpeoplepicker'
-        }
       ]
     }
   ],
diff --git a/packages/experiments/src/index.ts b/packages/experiments/src/index.ts
index 9ab403a39e978..584e8cffa5718 100644
--- a/packages/experiments/src/index.ts
+++ b/packages/experiments/src/index.ts
@@ -4,4 +4,6 @@ export { FolderCover } from './FolderCover';
 export { Tile } from './Tile';
 export { TilesList } from './TilesList';
 export { CommandBar as ExperimentCommandBar } from './CommandBar';
-export { ExtendedPeoplePicker, FloatingPeoplePicker } from './ExtendedPicker';
\ No newline at end of file
+export { FloatingPeoplePicker } from './FloatingPicker';
+export { SelectedPeopleList } from './SelectedItemsList';
+export { ExtendedPeoplePicker } from './ExtendedPicker';
\ No newline at end of file

From 68e102d1529fb7943b7a0697fdeadd21e34ec2d4 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 31 Oct 2017 14:23:49 -0700
Subject: [PATCH 0953/1641] Button on menu click (#3271)

* BaseButton: onMenuClick to support other actions for menu and split buttons

* Changelog

* Remove unused import

* Move onMenuClick to main props
---
 .../button-onMenuClick_2017-10-31-17-19.json  | 11 +++++
 .../src/components/Button/BaseButton.tsx      | 42 ++++++++++++-------
 .../src/components/Button/Button.Props.ts     |  5 +++
 .../Button.ContextualMenu.Example.tsx         |  2 +
 4 files changed, 45 insertions(+), 15 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/button-onMenuClick_2017-10-31-17-19.json

diff --git a/common/changes/office-ui-fabric-react/button-onMenuClick_2017-10-31-17-19.json b/common/changes/office-ui-fabric-react/button-onMenuClick_2017-10-31-17-19.json
new file mode 100644
index 0000000000000..ac8fce2dd3391
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/button-onMenuClick_2017-10-31-17-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "BaseButton: onMenuClick to support other actions for menu and split buttons",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index bc16285c4b785..2f9afec02b297 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -171,7 +171,8 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       assign(
         buttonProps,
         {
-          'onClick': this._onToggleMenu,
+          'onKeyDown': this._onMenuKeyDown,
+          'onClick': this._onMenuClick,
           'aria-expanded': this._isExpanded,
           'aria-owns': this.state.menuProps ? this._labelId + '-menu' : null,
           'aria-haspopup': true
@@ -395,7 +396,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         aria-pressed={ this.props.checked }
         aria-describedby={ buttonProps.ariaDescription }
         className={ classNames && classNames.splitButtonContainer }
-        onKeyDown={ this._onSplitButtonKeyDown }
+        onKeyDown={ this._onMenuKeyDown }
         ref={ this._resolveRef('_splitButtonContainer') }
       >
         <span
@@ -428,25 +429,36 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         iconName: 'ChevronDown'
       };
     }
-    return (
-      <BaseButton
-        styles={ classNames }
-        checked={ this.props.checked }
-        disabled={ this.props.disabled }
-        onClick={ this._onToggleMenu }
-        menuProps={ undefined }
-        iconProps={ menuIconProps }
-      />
-    );
+
+    let splitButtonProps = {
+      'styles': classNames,
+      'checked': this.props.checked,
+      'disabled': this.props.disabled,
+      'onClick': this._onMenuClick,
+      'menuProps': undefined,
+      'iconProps': menuIconProps
+    };
+
+    return <BaseButton {...splitButtonProps} />;
   }
 
   @autobind
-  private _onSplitButtonKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+  private _onMenuKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
     if (ev.which === KeyCodes.down) {
-      this._onToggleMenu();
+      let { onMenuClick } = this.props;
+      onMenuClick && onMenuClick(ev, this);
+      !ev.defaultPrevented && this._onToggleMenu();
       ev.preventDefault();
       ev.stopPropagation();
     }
+  }
 
+  @autobind
+  private _onMenuClick(ev: React.MouseEvent<HTMLAnchorElement>) {
+    let { onMenuClick } = this.props;
+    onMenuClick && onMenuClick(ev, this);
+    !ev.defaultPrevented && this._onToggleMenu();
+    ev.preventDefault();
+    ev.stopPropagation();
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
index dcf1e3d863e04..c26fcf07fdb7b 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
@@ -115,6 +115,11 @@ export interface IButtonProps extends React.AllHTMLAttributes<HTMLAnchorElement
    */
   menuIconProps?: IIconProps;
 
+  /**
+   * Optional callback when menu is clicked.
+   */
+  onMenuClick?: (ev?: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>, button?: IButtonProps) => void;
+
   /**
    * Custom render function for the icon
    */
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.ContextualMenu.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.ContextualMenu.Example.tsx
index 0c1d67f49d371..fe610776134a1 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.ContextualMenu.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.ContextualMenu.Example.tsx
@@ -14,6 +14,8 @@ export class ButtonContextualMenuExample extends React.Component<IButtonProps, {
             checked={ checked }
             iconProps={ { iconName: 'Add' } }
             text='New'
+            // tslint:disable-next-line:jsx-no-lambda
+            onMenuClick={ (ev) => { console.log(ev); } }
             menuProps={ {
               items: [
                 {

From 5b05c4b6b711ef465dc0e93fb1f44ddb6094866f Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 31 Oct 2017 15:29:57 -0700
Subject: [PATCH 0954/1641] Snapshots (#3275)

* BaseButton: onMenuClick to support other actions for menu and split buttons

* Changelog

* Remove unused import

* Move onMenuClick to main props

* updated button snapshots
---
 .../components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap | 1 +
 .../src/components/Button/__snapshots__/Button.test.tsx.snap     | 1 +
 2 files changed, 2 insertions(+)

diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
index a9c7473c68c5b..9e5dd8b40e399 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
@@ -240,6 +240,7 @@ exports[`Breadcrumb renders breadcumb correctly 2`] = `
               data-is-focusable={true}
               disabled={undefined}
               onClick={[Function]}
+              onKeyDown={[Function]}
               role="button"
               type="button"
             >
diff --git a/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
index 2fcf7557b42a8..a247976f8c199 100644
--- a/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
@@ -164,6 +164,7 @@ exports[`Button renders CommandBarButton correctly 1`] = `
   data-is-focusable={true}
   disabled={undefined}
   onClick={[Function]}
+  onKeyDown={[Function]}
   type="button"
 >
   <div

From 3de812e3764fe33fceb377a480b2b5c24316eccd Mon Sep 17 00:00:00 2001
From: Micah Godbolt <mgodbolt@microsoft.com>
Date: Wed, 1 Nov 2017 08:15:45 -0700
Subject: [PATCH 0955/1641] Bump max bundle size to 41k

---
 scripts/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/scripts/package.json b/scripts/package.json
index ff90506be2784..41aeb58919e75 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -48,7 +48,7 @@
   "bundlesize": [
     {
       "path": "../apps/test-bundle-button/dist/main.min.js",
-      "maxSize": "40 kB"
+      "maxSize": "41 kB"
     }
   ]
 }
\ No newline at end of file

From e5b10b8912c8be7cb97bffca8e1d1c3446045421 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pablo=20N=C3=BA=C3=B1ez?= <pablonete@gmail.com>
Date: Wed, 1 Nov 2017 16:51:11 +0100
Subject: [PATCH 0956/1641] CommandBar: iconOnly prop (target 5.0) (#3268)

* New iconOnly prop to hide name of commands #1840

* Add tooltip to iconOnly commands so name is visible #1840

* Change details.

* Prevent changes in previous behavior (so snapshot doesn't need to be regenerated).
---
 ...mmandBar-iconOnly5.0_2017-10-31-14-20.json |  11 ++
 .../components/CommandBar/CommandBar.Props.ts |   8 +
 .../src/components/CommandBar/CommandBar.tsx  | 155 ++++++++++--------
 .../examples/CommandBar.Basic.Example.tsx     |   6 +-
 4 files changed, 109 insertions(+), 71 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/commandBar-iconOnly5.0_2017-10-31-14-20.json

diff --git a/common/changes/office-ui-fabric-react/commandBar-iconOnly5.0_2017-10-31-14-20.json b/common/changes/office-ui-fabric-react/commandBar-iconOnly5.0_2017-10-31-14-20.json
new file mode 100644
index 0000000000000..ce4f78bafe863
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/commandBar-iconOnly5.0_2017-10-31-14-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "CommandBar: iconOnly items prop",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-panu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.Props.ts b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.Props.ts
index 317dd8184b2bf..fb74b38ee7ad4 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.Props.ts
@@ -51,4 +51,12 @@ export interface ICommandBarProps extends React.HTMLAttributes<HTMLDivElement> {
    * @defaultvalue undefined
    */
   className?: string;
+}
+
+export interface ICommandBarItemProps extends IContextualMenuItem {
+  /**
+   * Remove text when button is not in the overflow
+   * @defaultvalue false
+   */
+  iconOnly?: boolean;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 9f4fe727f56a3..cd52d195bc686 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -9,7 +9,7 @@ import {
   getId,
   getNativeProps
 } from '../../Utilities';
-import { ICommandBar, ICommandBarProps } from './CommandBar.Props';
+import { ICommandBar, ICommandBarProps, ICommandBarItemProps } from './CommandBar.Props';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { ContextualMenu, IContextualMenuProps, IContextualMenuItem, hasSubmenuItems } from '../../ContextualMenu';
 import { DirectionalHint } from '../../common/DirectionalHint';
@@ -18,6 +18,7 @@ import {
   IIconProps
 } from '../../Icon';
 import { FontClassNames } from '../../Styling';
+import { TooltipHost } from '../../Tooltip';
 import * as stylesImport from './CommandBar.scss';
 const styles: any = stylesImport;
 
@@ -162,7 +163,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
     this.refs.focusZone.focus();
   }
 
-  private _renderItemInCommandBar(item: IContextualMenuItem, index: number, expandedMenuItemKey: string, isFarItem?: boolean) {
+  private _renderItemInCommandBar(item: ICommandBarItemProps, index: number, expandedMenuItemKey: string, isFarItem?: boolean) {
     if (item.onRender) {
       return (
         <div className={ css('ms-CommandBarItem', styles.item, item.className) } key={ item.key } ref={ item.key }>
@@ -179,75 +180,93 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
       (expandedMenuItemKey === item.key) && ('is-expanded ' + styles.itemLinkIsExpanded)
     );
     let hasIcon = !!item.icon || !!item.iconProps;
-
-    return (
-      <div className={ css('ms-CommandBarItem', styles.item, item.className) } key={ itemKey } ref={ itemKey }>
-        { (() => {
-          if (isLink) {
-            return <button
-              { ...getNativeProps(item, buttonProperties) }
-              id={ this._id + item.key }
-              className={ className }
-              onClick={ this._onItemClick(item) }
-              data-command-key={ itemKey }
-              aria-haspopup={ hasSubmenuItems(item) }
-              aria-expanded={ hasSubmenuItems(item) ? expandedMenuItemKey === item.key : undefined }
-              role='menuitem'
-              aria-label={ item.ariaLabel }
+    const isNameVisible = !!item.name && !item.iconOnly;
+    const ariaLabel = item.ariaLabel || (item.iconOnly ? item.name : undefined);
+
+    let command: React.ReactNode;
+    if (isLink) {
+      command = (
+        <button
+          { ...getNativeProps(item, buttonProperties) }
+          id={ this._id + item.key }
+          className={ className }
+          onClick={ this._onItemClick(item) }
+          data-command-key={ itemKey }
+          aria-haspopup={ hasSubmenuItems(item) }
+          aria-expanded={ hasSubmenuItems(item) ? expandedMenuItemKey === item.key : undefined }
+          role='menuitem'
+          aria-label={ ariaLabel }
+        >
+          { (hasIcon) ? this._renderIcon(item) : (null) }
+          { isNameVisible && (
+            <span
+              className={ css('ms-CommandBarItem-commandText', styles.itemCommandText) }
             >
-              { (hasIcon) ? this._renderIcon(item) : (null) }
-              { (!!item.name) && (
-                <span
-                  className={ css('ms-CommandBarItem-commandText', styles.itemCommandText) }
-                >
-                  { item.name }
-                </span>
-              ) }
-              { hasSubmenuItems(item) ? (
-                <Icon className={ css('ms-CommandBarItem-chevronDown', styles.itemChevronDown) } iconName='ChevronDown' />
-              ) : (null) }
-            </button>;
-          } else if (item.href) {
-            return <a
-              { ...getNativeProps(item, anchorProperties) }
-              id={ this._id + item.key }
-              className={ className }
-              href={ item.href }
-              data-command-key={ itemKey }
-              aria-haspopup={ hasSubmenuItems(item) }
-              role='menuitem'
-              aria-label={ item.ariaLabel }
+              { item.name }
+            </span>
+          ) }
+          { hasSubmenuItems(item) ? (
+            <Icon className={ css('ms-CommandBarItem-chevronDown', styles.itemChevronDown) } iconName='ChevronDown' />
+          ) : (null) }
+        </button>
+      );
+    } else if (item.href) {
+      command = (
+        <a
+          { ...getNativeProps(item, anchorProperties) }
+          id={ this._id + item.key }
+          className={ className }
+          href={ item.href }
+          data-command-key={ itemKey }
+          aria-haspopup={ hasSubmenuItems(item) }
+          role='menuitem'
+          aria-label={ ariaLabel }
+        >
+          { (hasIcon) ? this._renderIcon(item) : (null) }
+          { isNameVisible && (
+            <span
+              className={ css('ms-CommandBarItem-commandText', styles.itemCommandText) }
             >
-              { (hasIcon) ? this._renderIcon(item) : (null) }
-              { (!!item.name) && (
-                <span
-                  className={ css('ms-CommandBarItem-commandText', styles.itemCommandText) }
-                >
-                  { item.name }
-                </span>
-              ) }
-            </a>;
-          } else {
-            return <div
-              { ...getNativeProps(item, divProperties) }
-              id={ this._id + item.key }
-              className={ className }
-              data-command-key={ itemKey }
-              aria-haspopup={ hasSubmenuItems(item) }
+              { item.name }
+            </span>
+          ) }
+        </a>
+      );
+    } else {
+      command = (
+        <div
+          { ...getNativeProps(item, divProperties) }
+          id={ this._id + item.key }
+          className={ className }
+          data-command-key={ itemKey }
+          aria-haspopup={ hasSubmenuItems(item) }
+          aria-label={ ariaLabel }
+        >
+          { (hasIcon) ? this._renderIcon(item) : (null) }
+          { (isNameVisible) && (
+            <span
+              className={ css('ms-CommandBarItem-commandText', styles.itemCommandText) }
+              aria-hidden='true'
+              role='presentation'
             >
-              { (hasIcon) ? this._renderIcon(item) : (null) }
-              { (!!item.name) && (
-                <span
-                  className={ css('ms-CommandBarItem-commandText', styles.itemCommandText) }
-                  aria-hidden='true'
-                  role='presentation'
-                >
-                  { item.name }
-                </span>
-              ) }
-            </div>;
-          }
-        })() }
+              { item.name }
+            </span>
+          ) }
+        </div>
+      );
+    }
+
+    if (item.iconOnly && item.name) {
+      command = (
+        <TooltipHost content={ item.name }>
+          { command }
+        </TooltipHost>
+      );
+    }
+
+    return (
+      <div className={ css('ms-CommandBarItem', styles.item, item.className) } key={ itemKey } ref={ itemKey }>
+        { command }
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
index 71ef289bfc623..f7d87a782f4a2 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
@@ -19,17 +19,17 @@ export class CommandBarBasicExample extends React.Component<any, any> {
     let { isSearchBoxVisible: searchBoxVisible, areIconsVisible: iconsVisible, areNamesVisible: namesVisible } = this.state;
 
     let filteredItems = items.map((item: any) => assign({}, item, {
-      name: namesVisible ? item.name : '',
+      iconOnly: !namesVisible,
       icon: iconsVisible ? item.icon : ''
     }));
 
     let filteredOverflowItems = overflowItems.map((item: any) => assign({}, item, {
-      name: namesVisible ? item.name : '',
+      iconOnly: !namesVisible,
       icon: iconsVisible ? item.icon : ''
     }));
 
     let filteredFarItems = farItems.map((item: any) => assign({}, item, {
-      name: namesVisible ? item.name : '',
+      iconOnly: !namesVisible,
       icon: iconsVisible ? item.icon : ''
     }));
 

From 58d527793e44d5b518ac91794e58d17b7d0f39f1 Mon Sep 17 00:00:00 2001
From: chaofeng2014 <fengchao199011@hotmail.com>
Date: Wed, 1 Nov 2017 10:46:48 -0700
Subject: [PATCH 0957/1641] Hover card accessibility behavior (#3203)

* 1. enable focus trap in hover card.
2. set focus to hover card if focus trap is set
3. enable "ESC" key to close hover card.

* rush change

* fix errors

* pass build.

* enable scroll to close the hover card

* fix focus zone and focus trap zone issues.

* Fix import of FocusTrapZone

* polish hover card target example

* add detailsList in hover card target example

* remove unnecessary tab stop

* reduce bundle size

* still need reduce bundle size

* try reduce bundle size

* bundle size

* remove unused interface.
---
 ...erCard_Accessibility_2017-10-23-23-32.json | 11 +++++
 .../FocusTrapZone/FocusTrapZone.tsx           |  4 +-
 .../src/components/FocusZone/FocusZone.tsx    | 16 ++++---
 .../HoverCard/ExpandingCard.Props.ts          |  5 +++
 .../components/HoverCard/ExpandingCard.tsx    | 44 ++++++++++++++-----
 .../components/HoverCard/HoverCard.Props.ts   |  5 +++
 .../src/components/HoverCard/HoverCard.tsx    | 24 +++++++---
 .../examples/HoverCard.Target.Example.tsx     |  4 +-
 packages/utilities/api/utilities.api.ts       |  5 +++
 packages/utilities/src/dom.ts                 | 23 ++++++++++
 packages/utilities/src/focus.ts               | 35 +++++++++++----
 11 files changed, 142 insertions(+), 34 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/chf-2017-10-hoverCard_Accessibility_2017-10-23-23-32.json

diff --git a/common/changes/office-ui-fabric-react/chf-2017-10-hoverCard_Accessibility_2017-10-23-23-32.json b/common/changes/office-ui-fabric-react/chf-2017-10-hoverCard_Accessibility_2017-10-23-23-32.json
new file mode 100644
index 0000000000000..79546a4122cac
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/chf-2017-10-hoverCard_Accessibility_2017-10-23-23-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "add accessibility behavior of hover card",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chf@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
index 949425aae393c..383fc2441a3dd 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
@@ -7,7 +7,7 @@ import {
   getNativeProps,
   divProperties,
   getFirstFocusable,
-  getLastFocusable,
+  getLastTabbable,
   getNextElement
 } from '../../Utilities';
 import { IFocusTrapZone, IFocusTrapZoneProps } from './FocusTrapZone.Props';
@@ -131,7 +131,7 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
     let { root } = this.refs;
 
     const _firstFocusableChild = getFirstFocusable(root, root.firstChild as HTMLElement, true);
-    const _lastFocusableChild = getLastFocusable(root, root.lastChild as HTMLElement, true);
+    const _lastFocusableChild = getLastTabbable(root, root.lastChild as HTMLElement, true);
 
     if (ev.shiftKey && _firstFocusableChild === ev.target) {
       _lastFocusableChild!.focus();
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 790e7a659b341..73949cf3d2944 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -40,6 +40,8 @@ interface IPoint {
 }
 const ALLOWED_INPUT_TYPES = ['text', 'number', 'password', 'email', 'tel', 'url', 'search'];
 
+const ALLOW_VIRTUAL_ELEMENTS = false;
+
 export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFocusZone {
 
   public static defaultProps: IFocusZoneProps = {
@@ -71,7 +73,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     if (this._root) {
       const windowElement = this._root.ownerDocument.defaultView;
 
-      let parentElement = getParent(this._root);
+      let parentElement = getParent(this._root, ALLOW_VIRTUAL_ELEMENTS);
 
       while (
         parentElement &&
@@ -82,7 +84,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
           this._isInnerZone = true;
           break;
         }
-        parentElement = getParent(parentElement);
+        parentElement = getParent(parentElement, ALLOW_VIRTUAL_ELEMENTS);
       }
 
       if (!this._isInnerZone) {
@@ -199,7 +201,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
           this._activeElement = parentElement;
           break;
         }
-        parentElement = getParent(parentElement) as HTMLElement;
+        parentElement = getParent(parentElement, ALLOW_VIRTUAL_ELEMENTS) as HTMLElement;
       }
     }
     if (onActiveElementChanged) {
@@ -229,7 +231,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
     while (target && target !== this._root) {
       path.push(target);
-      target = getParent(target) as HTMLElement;
+      target = getParent(target, ALLOW_VIRTUAL_ELEMENTS) as HTMLElement;
     }
 
     while (path.length) {
@@ -409,7 +411,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
         return true;
       }
 
-      target = getParent(target) as HTMLElement;
+      target = getParent(target, ALLOW_VIRTUAL_ELEMENTS) as HTMLElement;
     } while (target !== this._root);
 
     return false;
@@ -656,14 +658,14 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   }
 
   private _getOwnerZone(element?: HTMLElement): HTMLElement {
-    let parentElement = getParent(element as HTMLElement);
+    let parentElement = getParent(element as HTMLElement, ALLOW_VIRTUAL_ELEMENTS);
 
     while (parentElement && parentElement !== this._root && parentElement !== document.body) {
       if (isElementFocusZone(parentElement)) {
         return parentElement;
       }
 
-      parentElement = getParent(parentElement);
+      parentElement = getParent(parentElement, ALLOW_VIRTUAL_ELEMENTS);
     }
 
     return this._root;
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts
index 424e83afd29f5..b6802755bd84f 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts
@@ -87,6 +87,11 @@ export interface IExpandingCardProps extends React.HTMLAttributes<HTMLDivElement
    * Custom styles for this component
    */
   styles?: IExpandingCardStyles;
+
+  /**
+   * Trap focus or not
+   */
+  trapFocus?: boolean;
 }
 
 export enum ExpandingCardMode {
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
index d45426408e57f..d54435d1ec90d 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
@@ -12,7 +12,7 @@ import { IExpandingCardProps, IExpandingCardStyles, ExpandingCardMode } from './
 import { Callout, ICallout } from '../../Callout';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { AnimationStyles, mergeStyles } from '../../Styling';
-
+import { FocusTrapZone } from '../FocusTrapZone';
 import { getStyles } from './ExpandingCard.styles';
 
 export interface IExpandingCardState {
@@ -29,6 +29,8 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
     gapSpace: 0
   };
 
+  private _expandingCard: HTMLElement;
+
   private _styles: IExpandingCardStyles;
   // tslint:disable-next-line:no-unused-variable
   private _callout: ICallout;
@@ -49,6 +51,11 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
         needsScroll: true
       });
     }
+
+    if (this.props.trapFocus) {
+      this._expandingCard.focus();
+      this._events.on(this._expandingCard, 'keydown', this._onDismiss);
+    }
   }
 
   public componentWillUnmount() {
@@ -65,6 +72,19 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
     } = this.props;
     this._styles = getStyles(theme!, customStyles);
 
+    const content = (
+      <div
+        ref={ this._resolveRef('_expandingCard') }
+        onFocusCapture={ this.props.onEnter }
+        onBlurCapture={ this.props.onLeave }
+        onMouseEnter={ this.props.onEnter }
+        onMouseLeave={ this.props.onLeave }
+      >
+        { this._onRenderCompactCard() }
+        { this._onRenderExpandedCard() }
+      </div>
+    );
+
     return (
       <Callout
         { ...getNativeProps(this.props, divProperties) }
@@ -81,19 +101,23 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
         minPagePadding={ 24 }
         gapSpace={ this.props.gapSpace }
       >
-        <div
-          onFocusCapture={ this.props.onEnter }
-          onBlurCapture={ this.props.onLeave }
-          onMouseEnter={ this.props.onEnter }
-          onMouseLeave={ this.props.onLeave }
-        >
-          { this._onRenderCompactCard() }
-          { this._onRenderExpandedCard() }
-        </div>
+        { this.props.trapFocus ?
+          <FocusTrapZone>
+            { content }
+          </FocusTrapZone> :
+          content
+        }
       </Callout >
     );
   }
 
+  @autobind
+  private _onDismiss(ev: MouseEvent): void {
+    if (ev.type === 'keydown') {
+      this.props.onLeave && this.props.onLeave(ev);
+    }
+  }
+
   @autobind
   private _onRenderCompactCard(): JSX.Element {
     return (
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts
index 25cfb34eb44aa..87260956771d7 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts
@@ -77,6 +77,11 @@ export interface IHoverCardProps extends React.HTMLAttributes<HTMLDivElement | H
    * Callback when card hides
    */
   onCardHide?: () => void;
+
+  /**
+   * Trap focus or not
+   */
+  trapFocus?: boolean;
 }
 
 export interface IHoverCardStyles {
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
index 333cc80cf73d7..dae1da029a6a0 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
@@ -7,6 +7,7 @@ import {
   divProperties,
   getNativeProps,
   getId,
+  KeyCodes,
   getDocument
 } from '../../Utilities';
 import {
@@ -16,8 +17,8 @@ import {
 import { IHoverCardProps, IHoverCardStyles } from './HoverCard.Props';
 import { ExpandingCard } from './ExpandingCard';
 import { ExpandingCardMode } from './ExpandingCard.Props';
-
 import { getStyles } from './HoverCard.styles';
+import { FocusTrapZone } from 'office-ui-fabric-react/lib/FocusTrapZone';
 
 export interface IHoverCardState {
   isHoverCardVisible: boolean;
@@ -57,8 +58,12 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
 
     this._events.on(target, 'mouseenter', this._cardOpen);
     this._events.on(target, 'mouseleave', this._cardDismiss);
-    this._events.on(target, 'focus', this._cardOpen);
-    this._events.on(target, 'blur', this._cardDismiss);
+    if (this.props.trapFocus) {
+      this._events.on(target, 'keydown', this._cardOpen);
+    } else {
+      this._events.on(target, 'focus', this._cardOpen);
+      this._events.on(target, 'blur', this._cardDismiss);
+    }
     if (this.props.instantOpenOnClick) {
       this._events.on(target, 'click', this._instantOpenExpanded);
     } else {
@@ -111,6 +116,7 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
             componentRef={ this._resolveRef('_expandingCard') }
             { ...getNativeProps(this.props, divProperties) }
             id={ hoverCardId }
+            trapFocus={ !!this.props.trapFocus }
             targetElement={ this._getTargetElement() }
             onEnter={ this._cardOpen }
             onLeave={ this._cardDismiss }
@@ -140,8 +146,13 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
   // Show HoverCard
   @autobind
   private _cardOpen(ev: MouseEvent) {
+    if (ev.type === 'keydown' && !(ev.shiftKey && ev.which === KeyCodes.space)) {
+      return;
+    }
     this._async.clearTimeout(this._dismissTimerId);
-    this._currentMouseTarget = ev.currentTarget;
+    if (ev.type === 'mouseenter') {
+      this._currentMouseTarget = ev.currentTarget;
+    }
 
     this._openTimerId = this._async.setTimeout(() => {
       if (!this.state.isHoverCardVisible) {
@@ -156,10 +167,13 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
   // Hide HoverCard
   @autobind
   private _cardDismiss(ev: MouseEvent) {
+    if (ev.type === 'keydown' && (ev.which !== KeyCodes.escape)) {
+      return;
+    }
     this._async.clearTimeout(this._openTimerId);
 
     // Dismiss if not sticky and currentTarget is the same element that mouse last entered
-    if (!this.props.sticky && this._currentMouseTarget === ev.currentTarget) {
+    if (!this.props.sticky && (this._currentMouseTarget === ev.currentTarget || (ev.which === KeyCodes.escape))) {
       this._dismissTimerId = this._async.setTimeout(() => {
         this.setState({
           isHoverCardVisible: false,
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
index 207acdda15fc7..da97820a6a7cc 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
@@ -41,7 +41,7 @@ class HoverCardField extends BaseComponent<IHoverCardFieldProps, IHoverCardField
 
   public render() {
     return (
-      <div ref={ (c: HTMLDivElement) => !this.state.contentRendered && this.setState({ contentRendered: c }) } >
+      <div ref={ (c: HTMLDivElement) => !this.state.contentRendered && this.setState({ contentRendered: c }) } data-is-focusable={ true }>
         { this.props.content }
         {
           this.state.contentRendered &&
@@ -51,6 +51,7 @@ class HoverCardField extends BaseComponent<IHoverCardFieldProps, IHoverCardField
             cardDismissDelay={ 300 }
             onCardVisible={ this._log('onCardVisible') }
             onCardHide={ this._log('onCardHide') }
+            trapFocus={ true }
           />
         }
       </div>
@@ -88,6 +89,7 @@ export class HoverCardTargetExample extends BaseComponent<{}, IHoverCardExampleS
           items={ items! }
           columns={ columns }
           onRenderItemColumn={ this._onRenderItemColumn }
+          ariaLabel={ 'Hover card DetailsList test' }
         />
       </div>
     );
diff --git a/packages/utilities/api/utilities.api.ts b/packages/utilities/api/utilities.api.ts
index 268a86ac67688..c52c1e513dfee 100644
--- a/packages/utilities/api/utilities.api.ts
+++ b/packages/utilities/api/utilities.api.ts
@@ -141,6 +141,11 @@ export function getLastFocusable(rootElement: HTMLElement,
   currentElement: HTMLElement,
   includeElementsInFocusZones?: boolean): HTMLElement | null;
 
+// @public
+export function getLastTabbable(rootElement: HTMLElement,
+  currentElement: HTMLElement,
+  includeElementsInFocusZones?: boolean): HTMLElement | null;
+
 // @public
 export function getNativeProps < T >(props: any, allowedPropNames: string[], excludedPropNames?: string[]): T;
 
diff --git a/packages/utilities/src/dom.ts b/packages/utilities/src/dom.ts
index 8efaaff52ed64..a4ead03438601 100644
--- a/packages/utilities/src/dom.ts
+++ b/packages/utilities/src/dom.ts
@@ -80,6 +80,29 @@ export function getParent(child: HTMLElement, allowVirtualParents: boolean = tru
   );
 }
 
+/**
+ * Gets the elements which are child elements of the given element.
+ * If `allowVirtualChildren` is `true`, this method enumerates virtual child elements
+ * after the original children.
+ * @param parent
+ * @param allowVirtualChildren
+ */
+export function getChildren(parent: HTMLElement, allowVirtualChildren: boolean = true): HTMLElement[] {
+  const children: HTMLElement[] = [];
+
+  if (parent) {
+    for (let i = 0; i < parent.children.length; i++) {
+      children.push(parent.children.item(i) as HTMLElement);
+    }
+
+    if (allowVirtualChildren && isVirtualElement(parent)) {
+      children.push(...parent._virtual.children);
+    }
+  }
+
+  return children;
+}
+
 /**
  * Determines whether or not a parent element contains a given child element.
  * If `allowVirtualParents` is true, this method may return `true` if the child
diff --git a/packages/utilities/src/focus.ts b/packages/utilities/src/focus.ts
index 654d37d0234d8..984e3a3562d56 100644
--- a/packages/utilities/src/focus.ts
+++ b/packages/utilities/src/focus.ts
@@ -33,6 +33,19 @@ export function getLastFocusable(
   return getPreviousElement(rootElement, currentElement, true, false, true, includeElementsInFocusZones);
 }
 
+/**
+ * Gets the last tabbable element.
+ *
+ * @public
+ */
+export function getLastTabbable(
+  rootElement: HTMLElement,
+  currentElement: HTMLElement,
+  includeElementsInFocusZones?: boolean): HTMLElement | null {
+
+  return getPreviousElement(rootElement, currentElement, true, false, true, includeElementsInFocusZones, false, true);
+}
+
 /**
  * Attempts to focus the first focusable element that is a child or child's child of the rootElement.
  *
@@ -63,7 +76,8 @@ export function getPreviousElement(
   suppressParentTraversal?: boolean,
   traverseChildren?: boolean,
   includeElementsInFocusZones?: boolean,
-  allowFocusRoot?: boolean): HTMLElement | null {
+  allowFocusRoot?: boolean,
+  tabbable?: boolean): HTMLElement | null {
 
   if (!currentElement ||
     (!allowFocusRoot && currentElement === rootElement)) {
@@ -82,9 +96,10 @@ export function getPreviousElement(
       true,
       true,
       includeElementsInFocusZones,
-      allowFocusRoot);
+      allowFocusRoot,
+      tabbable);
 
-    if (childMatch) {
+    if (childMatch && ((tabbable && (isElementTabbable(childMatch, true))) || !tabbable)) {
       return childMatch;
     }
   }
@@ -102,7 +117,8 @@ export function getPreviousElement(
     true,
     true,
     includeElementsInFocusZones,
-    allowFocusRoot);
+    allowFocusRoot,
+    tabbable);
 
   if (siblingMatch) {
     return siblingMatch;
@@ -111,7 +127,7 @@ export function getPreviousElement(
   // Check its parent.
   if (!suppressParentTraversal) {
     return getPreviousElement(rootElement, currentElement.parentElement, true, false, false, includeElementsInFocusZones,
-      allowFocusRoot);
+      allowFocusRoot, tabbable);
   }
 
   return null;
@@ -217,7 +233,7 @@ export function isElementVisible(element: HTMLElement | undefined | null): boole
  *
  * @public
  */
-export function isElementTabbable(element: HTMLElement): boolean {
+export function isElementTabbable(element: HTMLElement, checkTabIndex?: boolean): boolean {
 
   // If this element is null or is disabled, it is not considered tabbable.
   if (!element || (element as HTMLButtonElement).disabled) {
@@ -238,8 +254,7 @@ export function isElementTabbable(element: HTMLElement): boolean {
   let isFocusableAttribute = element.getAttribute ? element.getAttribute(IS_FOCUSABLE_ATTRIBUTE) : null;
   let isTabIndexSet = tabIndexAttributeValue !== null && tabIndex >= 0;
 
-  return (
-    !!element &&
+  const result = !!element &&
     isFocusableAttribute !== 'false' &&
     (element.tagName === 'A' ||
       (element.tagName === 'BUTTON') ||
@@ -248,7 +263,9 @@ export function isElementTabbable(element: HTMLElement): boolean {
       isFocusableAttribute === 'true' ||
       isTabIndexSet ||
       element.getAttribute && element.getAttribute('role') === 'button'
-    ));
+    );
+
+  return checkTabIndex ? (tabIndex !== -1) && result : result;
 }
 
 /**

From 172271139a07fb9626813fda43fa16a935022c3c Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Wed, 1 Nov 2017 11:32:52 -0700
Subject: [PATCH 0958/1641] Persona: Standardized naming of Persona sizes, all
 numerical now (#3276)

* Deprecated non-numeric PersonaSize enums

* Persona sizes round 2

* Updated sizing in comopnents

* Mapped old class names to pick up styles of new classnames

* Updated tests

* Updated size40 scss

* Example label update

* Removed unused css variables

* Added change file

* Updated custom render example documentation

* Changed classNames to include 'size'
---
 .../vr-tests/src/stories/Facepile.stories.tsx |   2 +-
 apps/vr-tests/src/stories/Persona.stories.tsx |  14 +-
 .../persona-sizes_2017-10-31-21-15.json       |  11 ++
 .../SuggestionItemDefault.tsx                 |   2 +-
 .../components/ActivityItem/ActivityItem.tsx  |   2 +-
 .../Checkbox.ImplementationExamples.tsx       |   2 +-
 .../DocumentCard/DocumentCardActivity.tsx     |   2 +-
 .../__snapshots__/DocumentCard.test.tsx.snap  |   4 +-
 .../src/components/Facepile/Facepile.Props.ts |   2 +-
 .../src/components/Facepile/Facepile.test.tsx |  14 +-
 .../src/components/Facepile/Facepile.tsx      |   2 +-
 .../__snapshots__/Facepile.test.tsx.snap      |  12 +-
 .../examples/Facepile.Basic.Example.tsx       |   8 +-
 .../src/components/Persona/Persona.Props.ts   |  40 +++++-
 .../src/components/Persona/Persona.scss       | 122 +++++++++---------
 .../src/components/Persona/Persona.tsx        |   4 +-
 .../src/components/Persona/PersonaCoin.tsx    |  18 +--
 .../src/components/Persona/PersonaConsts.ts   |  25 ++--
 .../__snapshots__/Persona.test.tsx.snap       |  16 +--
 .../examples/Persona.Alternate.Example.tsx    |   4 +-
 .../examples/Persona.Basic.Example.tsx        |  28 ++--
 .../examples/Persona.CustomRender.Example.tsx |   6 +-
 .../SuggestionItemDefault.tsx                 |   4 +-
 .../examples/Picker.CustomResult.Example.tsx  |   2 +-
 24 files changed, 201 insertions(+), 145 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/persona-sizes_2017-10-31-21-15.json

diff --git a/apps/vr-tests/src/stories/Facepile.stories.tsx b/apps/vr-tests/src/stories/Facepile.stories.tsx
index d7a65ba1b8f18..4b4942a4d8a1e 100644
--- a/apps/vr-tests/src/stories/Facepile.stories.tsx
+++ b/apps/vr-tests/src/stories/Facepile.stories.tsx
@@ -62,7 +62,7 @@ storiesOf('Facepile', module)
     <Facepile {...facepileProps} />
   ))
   .add('Extra extra small', () => (
-    <Facepile {...facepileProps} personaSize={ PersonaSize.extraExtraSmall } />
+    <Facepile {...facepileProps} personaSize={ PersonaSize.size24 } />
   ))
   .add('Overflow', () => (
     <Facepile
diff --git a/apps/vr-tests/src/stories/Persona.stories.tsx b/apps/vr-tests/src/stories/Persona.stories.tsx
index 6ce44bd391a6b..f6cc8081b3cd4 100644
--- a/apps/vr-tests/src/stories/Persona.stories.tsx
+++ b/apps/vr-tests/src/stories/Persona.stories.tsx
@@ -30,13 +30,13 @@ storiesOf('Persona', module)
   .add('Tiny', () => (
     <Persona
       { ...examplePersona }
-      size={ PersonaSize.tiny }
+      size={ PersonaSize.size12 }
       presence={ PersonaPresence.offline }
     />
   )).add('Extra extra small', () => (
     <Persona
       { ...examplePersona }
-      size={ PersonaSize.extraExtraSmall }
+      size={ PersonaSize.size24 }
       presence={ PersonaPresence.none }
     />
   )).add('Size 28', () => (
@@ -48,20 +48,20 @@ storiesOf('Persona', module)
   )).add('Extra small', () => (
     <Persona
       { ...examplePersona }
-      size={ PersonaSize.extraSmall }
+      size={ PersonaSize.size32 }
       presence={ PersonaPresence.online }
     />
   )).add('Extra small with details', () => (
     <Persona
       { ...examplePersona }
-      size={ PersonaSize.extraSmall }
+      size={ PersonaSize.size32 }
       presence={ PersonaPresence.none }
       showSecondaryText
     />
   )).add('Small', () => (
     <Persona
       { ...examplePersona }
-      size={ PersonaSize.small }
+      size={ PersonaSize.size40 }
       presence={ PersonaPresence.away }
     />
   )).add('Medium', () => (
@@ -78,13 +78,13 @@ storiesOf('Persona', module)
   )).add('Large', () => (
     <Persona
       { ...examplePersona }
-      size={ PersonaSize.large }
+      size={ PersonaSize.size72 }
       presence={ PersonaPresence.dnd }
     />
   )).add('Extra large', () => (
     <Persona
       { ...examplePersona }
-      size={ PersonaSize.extraLarge }
+      size={ PersonaSize.size100 }
       presence={ PersonaPresence.blocked }
     />
   )).add('Initials', () => (
diff --git a/common/changes/office-ui-fabric-react/persona-sizes_2017-10-31-21-15.json b/common/changes/office-ui-fabric-react/persona-sizes_2017-10-31-21-15.json
new file mode 100644
index 0000000000000..272b79b67cd02
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/persona-sizes_2017-10-31-21-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Persona: Changed PersonaSize names from descriptive to numerical. ",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx b/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
index 26ddc3081ee95..140416399fb09 100644
--- a/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
+++ b/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
@@ -12,7 +12,7 @@ export const SuggestionItemNormal: (persona: IPersonaProps, suggestionProps?: IB
       <div className={ css('ms-PeoplePicker-personaContent', stylesImport.peoplePickerPersonaContent) }>
         <Persona
           presence={ personaProps.presence !== undefined ? personaProps.presence : PersonaPresence.none }
-          size={ PersonaSize.extraExtraSmall }
+          size={ PersonaSize.size24 }
           className={ css('ms-PeoplePicker-Persona', stylesImport.peoplePickerPersona) }
           showSecondaryText={ true }
           { ...personaProps }
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
index cc1a080795641..8db02241f4404 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
@@ -120,7 +120,7 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
             // tslint:disable-next-line:no-string-literal
             key={ person['key'] ? person['key'] : index }
             className={ this._classNames.activityPersona }
-            size={ showSize16Personas ? PersonaSize.size16 : PersonaSize.extraSmall }
+            size={ showSize16Personas ? PersonaSize.size16 : PersonaSize.size32 }
             style={ style }
           />
         );
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.ImplementationExamples.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.ImplementationExamples.tsx
index 73ecfb1f03ba1..eaf8748011b4f 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.ImplementationExamples.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.ImplementationExamples.tsx
@@ -102,6 +102,6 @@ export class CheckboxImplementationExamples extends React.Component<{}, ICheckbo
 
   private _renderPersonaLabel(props: ICheckboxProps) {
     const DEFAULT_IMAGE_URL = '/_layouts/15/userphoto.aspx?size=S&accountname=';
-    return <Persona primaryText={ props.label } imageUrl={ DEFAULT_IMAGE_URL } size={ PersonaSize.extraSmall } />;
+    return <Persona primaryText={ props.label } imageUrl={ DEFAULT_IMAGE_URL } size={ PersonaSize.size32 } />;
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx
index 314298eb40d08..02c9bdf4d95a1 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx
@@ -47,7 +47,7 @@ export class DocumentCardActivity extends BaseComponent<IDocumentCardActivityPro
           imageUrl={ person.profileImageSrc }
           initialsColor={ person.initialsColor }
           role='persentation'
-          size={ PersonaSize.extraSmall }
+          size={ PersonaSize.size32 }
         />
 
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap b/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap
index 06f64c28a2ed2..502a1a34841f8 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap
@@ -29,9 +29,9 @@ exports[`DocumentCard renders DocumentCard correctly 1`] = `
         className="ms-DocumentCardActivity-avatar"
       >
         <div
-          className="ms-Persona-coin ms-Persona--xs undefined"
+          className="ms-Persona-coin ms-Persona--size32 undefined"
           role="persentation"
-          size={2}
+          size={11}
         >
           <div
             className="ms-Persona-imageArea"
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.Props.ts b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.Props.ts
index 1dd218b2cf367..13e68697179ff 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.Props.ts
@@ -20,7 +20,7 @@ export interface IFacepileProps extends React.Props<Facepile> {
 
   /**
    * Array of IPersonaProps that define each Persona. Note that the size
-   * is fixed at PersonaSize.extraSmall regardless of what is specified.
+   * is fixed at PersonaSize.size32 regardless of what is specified.
    */
   personas: IFacepilePersona[];
 
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
index 20386e2475e40..0cf824abb5f20 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
@@ -154,14 +154,14 @@ describe('Facepile', () => {
           overflowButtonType={ OverflowButtonType.downArrow }
         />);
       let facepile = ReactDOM.findDOMNode(wrapper as React.ReactInstance);
-      let addButton = facepile.querySelectorAll('.ms-Facepile-addButton .ms-Persona-coin.ms-Persona--xs');
+      let addButton = facepile.querySelectorAll('.ms-Facepile-addButton .ms-Persona-coin.ms-Persona--size32');
       expect(addButton).toHaveLength(1);
       let faces = facepile.querySelectorAll('.ms-Facepile-person');
       expect(faces).toHaveLength(facepilePersonas.length);
       for (let i = 0; i < faces.length; ++i) {
-        expect(faces[i].innerHTML).toEqual(expect.stringMatching('ms-Persona--xs'));
+        expect(faces[i].innerHTML).toEqual(expect.stringMatching('ms-Persona--size32'));
       }
-      let overflowButton = facepile.querySelectorAll('.ms-Facepile-overflowButton .ms-Persona--xs');
+      let overflowButton = facepile.querySelectorAll('.ms-Facepile-overflowButton .ms-Persona--size32');
       expect(overflowButton).toHaveLength(1);
     });
 
@@ -170,24 +170,24 @@ describe('Facepile', () => {
       let wrapper = shallow(
         <Facepile
           personas={ facepilePersonas }
-          personaSize={ PersonaSize.extraExtraSmall }
+          personaSize={ PersonaSize.size24 }
         />);
       let faces = wrapper.find(PersonaCoin);
       expect(faces).toHaveLength(facepilePersonas.length);
       wrapper.find(PersonaCoin).forEach((node) => {
-        expect(node.html()).toEqual(expect.stringMatching('ms-Persona--xxs'));
+        expect(node.html()).toEqual(expect.stringMatching('ms-Persona--size24'));
       });
 
       // Test small size renders
       wrapper = shallow(
         <Facepile
           personas={ facepilePersonas }
-          personaSize={ PersonaSize.small }
+          personaSize={ PersonaSize.size40 }
         />);
       faces = wrapper.find(PersonaCoin);
       expect(faces).toHaveLength(facepilePersonas.length);
       wrapper.find(PersonaCoin).forEach((node) => {
-        expect(node.html()).toEqual(expect.stringMatching('ms-Persona--sm'));
+        expect(node.html()).toEqual(expect.stringMatching('ms-Persona--size40'));
       });
     });
   });
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
index 2c6e063da4334..14519ad2a006c 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
@@ -34,7 +34,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
   public static defaultProps: IFacepileProps = {
     maxDisplayablePersonas: 5,
     personas: [],
-    personaSize: PersonaSize.extraSmall
+    personaSize: PersonaSize.size32
   };
 
   private _ariaDescriptionId: string;
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
index 94f57601595c5..11fd683b5c87b 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
@@ -27,8 +27,8 @@ exports[`Facepile Render personas and buttons renders Facepile correctly 1`] = `
         title="Annie Lindqvist"
       >
         <div
-          className="ms-Persona-coin ms-Persona--xs undefined"
-          size={2}
+          className="ms-Persona-coin ms-Persona--size32 undefined"
+          size={11}
         >
           <div
             className="ms-Persona-imageArea"
@@ -65,8 +65,8 @@ exports[`Facepile Render personas and buttons renders Facepile correctly 1`] = `
         title="Aaron Reid"
       >
         <div
-          className="ms-Persona-coin ms-Persona--xs undefined"
-          size={2}
+          className="ms-Persona-coin ms-Persona--size32 undefined"
+          size={11}
         >
           <div
             className="ms-Persona-imageArea"
@@ -160,8 +160,8 @@ exports[`Facepile Render personas and buttons renders Facepile correctly 1`] = `
               }
         >
           <div
-            className="ms-Persona-coin ms-Persona--xs undefined"
-            size={2}
+            className="ms-Persona-coin ms-Persona--size32 undefined"
+            size={11}
           >
             <div
               className="ms-Persona-imageArea"
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
index 87d685ef6ff40..0edc2e188ea03 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
@@ -23,7 +23,7 @@ export class FacepileBasicExample extends React.Component<any, IFacepileBasicExa
     this.state = {
       numberOfFaces: 3,
       imagesFadeIn: true,
-      personaSize: PersonaSize.extraSmall
+      personaSize: PersonaSize.size32
     };
   }
 
@@ -59,10 +59,10 @@ export class FacepileBasicExample extends React.Component<any, IFacepileBasicExa
             options={
               [
                 { key: PersonaSize.size16, text: PersonaSize[PersonaSize.size16] },
-                { key: PersonaSize.extraExtraSmall, text: PersonaSize[PersonaSize.extraExtraSmall] },
+                { key: PersonaSize.size24, text: PersonaSize[PersonaSize.size24] },
                 { key: PersonaSize.size28, text: PersonaSize[PersonaSize.size28] },
-                { key: PersonaSize.extraSmall, text: PersonaSize[PersonaSize.extraSmall] },
-                { key: PersonaSize.small, text: PersonaSize[PersonaSize.small] }
+                { key: PersonaSize.size32, text: PersonaSize[PersonaSize.size32] },
+                { key: PersonaSize.size40, text: PersonaSize[PersonaSize.size40] }
               ]
             }
             onChanged={ this._onChangePersonaSize }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts b/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
index 6a444f7622ea5..733437a8330a0 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
@@ -25,7 +25,7 @@ export interface IPersonaProps extends React.HTMLAttributes<Persona> {
 
   /**
    * Decides the size of the control.
-   * @defaultvalue PersonaSize.regular
+   * @defaultvalue PersonaSize.size48
    */
   size?: PersonaSize;
 
@@ -131,15 +131,51 @@ export interface IPersonaProps extends React.HTMLAttributes<Persona> {
 }
 
 export enum PersonaSize {
+  /**
+   * tiny size has been deprecated in favor of standardized numeric sizing. Use size12 instead.
+   * @deprecated
+   */
   tiny = 0,
+  /**
+   *
+   * extraExtraSmall size has been deprecated in favor of standardized numeric sizing. Use size24 instead.
+   * @deprecated
+   */
   extraExtraSmall = 1,
+  /**
+   * extraSmall size has been deprecated in favor of standardized numeric sizing. Use size32 instead.
+   * @deprecated
+   */
   extraSmall = 2,
+  /**
+   * small size has been deprecated in favor of standardized numeric sizing. Use size40 instead.
+   * @deprecated
+   */
   small = 3,
+  /**
+   * regular size has been deprecated in favor of standardized numeric sizing. Use size48 instead.
+   * @deprecated
+   */
   regular = 4,
+  /**
+   * large size has been deprecated in favor of standardized numeric sizing. Use size72 instead.
+   * @deprecated
+   */
   large = 5,
+  /**
+   * extraLarge size has been deprecated in favor of standardized numeric sizing. Use size100 instead.
+   * @deprecated
+   */
   extraLarge = 6,
   size28 = 7,
-  size16 = 8
+  size16 = 8,
+  size12 = 9,
+  size24 = 10,
+  size32 = 11,
+  size40 = 12,
+  size48 = 13,
+  size72 = 14,
+  size100 = 15
 }
 
 export enum PersonaPresence {
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
index 18af32cedfe62..581a3e7359af8 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
@@ -43,15 +43,15 @@ $ms-color-presence-busy-stripe-dark:   #D00E0D;
 $ms-color-presence-busy-average:       #D93B3B;
 
 // Persona Sizes
-$ms-Persona-sizeTiny: 30px;
+$ms-Persona-size12:  30px;
 $ms-Persona-size16:  16px;
-$ms-Persona-sizeXxs:  24px;
+$ms-Persona-size24:  24px;
 $ms-Persona-size28:  28px;
-$ms-Persona-sizeXs:   32px;
-$ms-Persona-sizeSm:   40px;
-$ms-Persona-sizeMd:   48px;
-$ms-Persona-sizeLg:   72px;
-$ms-Persona-sizeXl:   100px;
+$ms-Persona-size32:  32px;
+$ms-Persona-size40:  40px;
+$ms-Persona-size48:  48px;
+$ms-Persona-size72:  72px;
+$ms-Persona-size100: 100px;
 
 // Details Spacing
 $ms-Persona-imageDetailsSmSpace: 8px;
@@ -70,7 +70,7 @@ $ms-Persona-presenceSizeXl: 28px;
   font-size: $ms-font-size-m;
   font-weight: $ms-font-weight-regular;
   position: relative;
-  height: $ms-Persona-sizeMd;
+  height: $ms-Persona-size48;
   display: flex;
   align-items: center;
   overflow: hidden;
@@ -90,8 +90,8 @@ $ms-Persona-presenceSizeXl: 28px;
   position: relative;
   text-align: center;
   flex: 0 0 auto;
-  height: $ms-Persona-sizeMd;
-  width: $ms-Persona-sizeMd;
+  height: $ms-Persona-size48;
+  width: $ms-Persona-size48;
 
   @include high-contrast {
     border: 1px solid WindowText;
@@ -121,7 +121,7 @@ $ms-Persona-presenceSizeXl: 28px;
   font-size: $ms-font-size-l;
   font-weight: $ms-font-weight-regular;
   line-height: 46px;
-  height: $ms-Persona-sizeMd;
+  height: $ms-Persona-size48;
 
   &.initialsIsLightBlue {
     background-color: $ms-color-initials-lightBlue;
@@ -263,12 +263,12 @@ $ms-Persona-presenceSizeXl: 28px;
 
 //== Modifier: Tiny Persona
 //
-.root.rootIsTiny {
-  height: $ms-Persona-sizeTiny;
-  min-width: $ms-Persona-sizeTiny;
+.root.rootIsSize12 {
+  height: $ms-Persona-size12;
+  min-width: $ms-Persona-size12;
 }
 
-.rootIsTiny{
+.rootIsSize12{
   .imageArea {
     overflow: visible;
     background: transparent;
@@ -294,7 +294,7 @@ $ms-Persona-presenceSizeXl: 28px;
 
   .primaryText {
     font-size: $ms-font-size-m;
-    line-height: $ms-Persona-sizeTiny;
+    line-height: $ms-Persona-size12;
   }
 
   .secondaryText {
@@ -307,7 +307,7 @@ $ms-Persona-presenceSizeXl: 28px;
 //
 // This variant includes a semicolon, and is
 // most often presented within a People Picker.
-.root.rootIsTiny.rootIsReadonly {
+.root.rootIsSize12.rootIsReadonly {
   padding: 0;
   background-color: transparent;
 
@@ -318,13 +318,13 @@ $ms-Persona-presenceSizeXl: 28px;
 
 //== Modifier: 16px Persona
 //
-.root.rootIs16 {
+.root.rootIsSize16 {
   height: $ms-Persona-size16;
   min-width: $ms-Persona-size16;
   overflow: hidden;
 }
 
-.rootIs16 {
+.rootIsSize16 {
   .imageArea {
     box-shadow: 0 0 0 2px $ms-color-white;
   }
@@ -369,16 +369,16 @@ $ms-Persona-presenceSizeXl: 28px;
 
 //== Modifier: Extra Small Persona
 //
-.root.rootIsExtraExtraSmall {
-  height: $ms-Persona-sizeXs;
-  min-width: $ms-Persona-sizeXs;
+.root.rootIsSize24 {
+  height: $ms-Persona-size32;
+  min-width: $ms-Persona-size32;
 }
 
-.rootIsExtraExtraSmall {
+.rootIsSize24 {
   .imageArea,
   .image {
-    height: $ms-Persona-sizeXxs;
-    width: $ms-Persona-sizeXxs;
+    height: $ms-Persona-size24;
+    width: $ms-Persona-size24;
   }
 
   .placeholder {
@@ -388,8 +388,8 @@ $ms-Persona-presenceSizeXl: 28px;
 
   .initials {
     font-size: $ms-font-size-xs;
-    height: $ms-Persona-sizeXxs;
-    line-height: $ms-Persona-sizeXxs;
+    height: $ms-Persona-size24;
+    line-height: $ms-Persona-size24;
   }
 
   .presence {
@@ -435,13 +435,13 @@ $ms-Persona-presenceSizeXl: 28px;
 
 //== Modifier: 28px Persona
 //
-.root.rootIs28 {
+.root.rootIsSize28 {
   height: $ms-Persona-size28;
   min-width: $ms-Persona-size28;
   overflow: hidden;
 }
 
-.rootIs28 {
+.rootIsSize28 {
   .imageArea,
   .image {
     height: $ms-Persona-size28;
@@ -502,16 +502,16 @@ $ms-Persona-presenceSizeXl: 28px;
 
 //== Modifier: Extra Small Persona
 //
-.root.rootIsExtraSmall {
-  height: $ms-Persona-sizeXs;
-  min-width: $ms-Persona-sizeXs;
+.root.rootIsSize32 {
+  height: $ms-Persona-size32;
+  min-width: $ms-Persona-size32;
 }
 
-.rootIsExtraSmall {
+.rootIsSize32 {
   .imageArea,
   .image {
-    height: $ms-Persona-sizeXs;
-    width: $ms-Persona-sizeXs;
+    height: $ms-Persona-size32;
+    width: $ms-Persona-size32;
   }
 
   .placeholder {
@@ -521,8 +521,8 @@ $ms-Persona-presenceSizeXl: 28px;
 
   .initials {
     font-size: $ms-font-size-m;
-    height: $ms-Persona-sizeXs;
-    line-height: $ms-Persona-sizeXs;
+    height: $ms-Persona-size32;
+    line-height: $ms-Persona-size32;
   }
 
   .details {
@@ -551,16 +551,16 @@ $ms-Persona-presenceSizeXl: 28px;
 
 //== Modifier: Small Persona
 //
-.root.rootIsSmall {
-  height: $ms-Persona-sizeSm;
-  min-width: $ms-Persona-sizeSm;
+.root.rootIsSize40 {
+  height: $ms-Persona-size40;
+  min-width: $ms-Persona-size40;
 }
 
-.rootIsSmall {
+.rootIsSize40 {
   .imageArea,
   .image {
-    height: $ms-Persona-sizeSm;
-    width: $ms-Persona-sizeSm;
+    height: $ms-Persona-size40;
+    width: $ms-Persona-size40;
   }
 
   .placeholder {
@@ -570,8 +570,8 @@ $ms-Persona-presenceSizeXl: 28px;
 
   .initials {
     font-size: $ms-font-size-m;
-    height: $ms-Persona-sizeSm;
-    line-height: $ms-Persona-sizeSm;
+    height: $ms-Persona-size40;
+    line-height: $ms-Persona-size40;
   }
 
   .primaryText {
@@ -582,16 +582,16 @@ $ms-Persona-presenceSizeXl: 28px;
 
 //== Modifier: Large Persona
 //
-.root.rootIsLarge {
-  height: $ms-Persona-sizeLg;
-  min-width: $ms-Persona-sizeLg;
+.root.rootIsSize72 {
+  height: $ms-Persona-size72;
+  min-width: $ms-Persona-size72;
 }
 
-.rootIsLarge {
+.rootIsSize72 {
   .imageArea,
   .image {
-    height: $ms-Persona-sizeLg;
-    width: $ms-Persona-sizeLg;
+    height: $ms-Persona-size72;
+    width: $ms-Persona-size72;
   }
 
   .placeholder {
@@ -601,7 +601,7 @@ $ms-Persona-presenceSizeXl: 28px;
 
   .initials {
     font-size: $ms-font-size-xxl;
-    height: $ms-Persona-sizeLg;
+    height: $ms-Persona-size72;
     line-height: 70px;
   }
 
@@ -624,16 +624,16 @@ $ms-Persona-presenceSizeXl: 28px;
 
 //== Modifier: Extra Large Persona
 //
-.root.rootIsExtraLarge {
-  height: $ms-Persona-sizeXl;
-  min-width: $ms-Persona-sizeXl;
+.root.rootIsSize100 {
+  height: $ms-Persona-size100;
+  min-width: $ms-Persona-size100;
 }
 
-.rootIsExtraLarge {
+.rootIsSize100 {
   .imageArea,
   .image {
-    height: $ms-Persona-sizeXl;
-    width: $ms-Persona-sizeXl;
+    height: $ms-Persona-size100;
+    width: $ms-Persona-size100;
   }
 
   .placeholder {
@@ -643,7 +643,7 @@ $ms-Persona-presenceSizeXl: 28px;
 
   .initials {
     font-size: $ms-font-size-su;
-    height: $ms-Persona-sizeXl;
+    height: $ms-Persona-size100;
     line-height: 96px;
   }
 
@@ -796,7 +796,7 @@ $ms-Persona-presenceSizeXl: 28px;
     }
   }
 
-  &.rootIsLarge {
+  &.rootIsSize72 {
     .presence {
       &::after {
         top: 9px;
@@ -804,7 +804,7 @@ $ms-Persona-presenceSizeXl: 28px;
     }
   }
 
-  &.rootIsExtraLarge {
+  &.rootIsSize100 {
     .presence {
       &::after {
         top: 13px;
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index 682feed9bb1fd..8520d62c6d31c 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -24,7 +24,7 @@ const styles: any = stylesImport;
 export class Persona extends BaseComponent<IPersonaProps, {}> {
   public static defaultProps: IPersonaProps = {
     primaryText: '',
-    size: PersonaSize.regular,
+    size: PersonaSize.size48,
     presence: PersonaPresenceEnum.none,
     imageAlt: ''
   };
@@ -111,7 +111,7 @@ export class Persona extends BaseComponent<IPersonaProps, {}> {
         style={ coinSize ? { height: coinSize, minWidth: coinSize } : undefined }
       >
         <PersonaCoin { ...personaCoinProps } />
-        { (!hidePersonaDetails || (size === PersonaSize.tiny)) && personaDetails }
+        { (!hidePersonaDetails || (size === PersonaSize.size12)) && personaDetails }
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
index 2bc27040e6569..41d6db604d29a 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
@@ -23,14 +23,14 @@ import * as stylesImport from './Persona.scss';
 const styles: any = stylesImport;
 
 const SIZE_TO_PIXELS = {
-  [PersonaSize.extraExtraSmall]: 24,
+  [PersonaSize.size24]: 24,
   [PersonaSize.size28]: 28,
-  [PersonaSize.tiny]: 30,
-  [PersonaSize.extraSmall]: 32,
-  [PersonaSize.small]: 40,
-  [PersonaSize.regular]: 48,
-  [PersonaSize.large]: 72,
-  [PersonaSize.extraLarge]: 100
+  [PersonaSize.size12]: 30,
+  [PersonaSize.size32]: 32,
+  [PersonaSize.size40]: 40,
+  [PersonaSize.size48]: 48,
+  [PersonaSize.size72]: 72,
+  [PersonaSize.size100]: 100
 };
 
 /**
@@ -66,7 +66,7 @@ export interface IPersonaState {
 export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
   public static defaultProps: IPersonaProps = {
     primaryText: '',
-    size: PersonaSize.regular,
+    size: PersonaSize.size48,
     presence: PersonaPresenceEnum.none,
     imageAlt: ''
   };
@@ -104,7 +104,7 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
         { ...divProps }
         className={ css('ms-Persona-coin', PERSONA_SIZE[size]) }
       >
-        { size !== PersonaSize.tiny && (
+        { size !== PersonaSize.size12 && (
           <div
             { ...coinProps }
             className={ css('ms-Persona-imageArea', styles.imageArea) }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts b/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
index 4785075d1df08..a20a8857d9034 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
@@ -7,15 +7,24 @@ import * as stylesImport from './Persona.scss';
 const styles: any = stylesImport;
 
 export const PERSONA_SIZE = {
-  [PersonaSize.tiny]: 'ms-Persona--tiny ' + styles.rootIsTiny,
-  [PersonaSize.extraExtraSmall]: 'ms-Persona--xxs ' + styles.rootIsExtraExtraSmall,
-  [PersonaSize.extraSmall]: 'ms-Persona--xs ' + styles.rootIsExtraSmall,
-  [PersonaSize.small]: 'ms-Persona--sm ' + styles.rootIsSmall,
+  // All non-numerically named sizes are deprecated, use the numerically named classes below
+  [PersonaSize.tiny]: 'ms-Persona--tiny ' + styles.rootIsTiny + styles.rootIsSize12,
+  [PersonaSize.extraExtraSmall]: 'ms-Persona--xxs ' + styles.rootIsExtraExtraSmall + styles.rootIsSize24,
+  [PersonaSize.extraSmall]: 'ms-Persona--xs ' + styles.rootIsExtraSmall + styles.rootIsSize28,
+  [PersonaSize.small]: 'ms-Persona--sm ' + styles.rootIsSmall + styles.rootIsSize40,
   [PersonaSize.regular]: '',
-  [PersonaSize.large]: 'ms-Persona--lg ' + styles.rootIsLarge,
-  [PersonaSize.extraLarge]: 'ms-Persona--xl ' + styles.rootIsExtraLarge,
-  [PersonaSize.size28]: 'ms-Persona--28 ' + styles.rootIs28,
-  [PersonaSize.size16]: 'ms-Persona--16 ' + styles.rootIs16
+  [PersonaSize.large]: 'ms-Persona--lg ' + styles.rootIsLarge + styles.rootIsSize72,
+  [PersonaSize.extraLarge]: 'ms-Persona--xl ' + styles.rootIsExtraLarge + styles.rootIsSize100,
+
+  [PersonaSize.size28]: 'ms-Persona--size28 ' + styles.rootIsSize28,
+  [PersonaSize.size16]: 'ms-Persona--size16 ' + styles.rootIsSize16,
+  [PersonaSize.size12]: 'ms-Persona--size12 ' + styles.rootIsSize12,
+  [PersonaSize.size24]: 'ms-Persona--size24 ' + styles.rootIsSize24,
+  [PersonaSize.size32]: 'ms-Persona--size32 ' + styles.rootIsSize32,
+  [PersonaSize.size40]: 'ms-Persona--size40 ' + styles.rootIsSize40,
+  [PersonaSize.size48]: 'ms-Persona--size48 ' + styles.rootIsSize48,
+  [PersonaSize.size72]: 'ms-Persona--size72 ' + styles.rootIsSize72,
+  [PersonaSize.size100]: 'ms-Persona--size100 ' + styles.rootIsSize100
 };
 
 export const PERSONA_PRESENCE = {
diff --git a/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap
index 1cf36a0814c45..72cac84392c73 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap
@@ -2,13 +2,13 @@
 
 exports[`Persona renders Persona correctly with image 1`] = `
 <div
-  className="ms-Persona"
-  size={4}
+  className="ms-Persona ms-Persona--size48 undefined"
+  size={13}
   style={undefined}
 >
   <div
-    className="ms-Persona-coin"
-    size={4}
+    className="ms-Persona-coin ms-Persona--size48 undefined"
+    size={13}
   >
     <div
       className="ms-Persona-imageArea"
@@ -93,13 +93,13 @@ exports[`Persona renders Persona correctly with image 1`] = `
 
 exports[`Persona renders Persona correctly with initials 1`] = `
 <div
-  className="ms-Persona"
-  size={4}
+  className="ms-Persona ms-Persona--size48 undefined"
+  size={13}
   style={undefined}
 >
   <div
-    className="ms-Persona-coin"
-    size={4}
+    className="ms-Persona-coin ms-Persona--size48 undefined"
+    size={13}
   >
     <div
       className="ms-Persona-imageArea"
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Alternate.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Alternate.Example.tsx
index 3e510b9baefbc..56e44962d79a2 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Alternate.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Alternate.Example.tsx
@@ -31,7 +31,7 @@ export class PersonaAlternateExample extends React.Component<React.Props<Persona
       <div>
         <Persona
           { ...examplePersona }
-          size={ PersonaSize.extraExtraSmall }
+          size={ PersonaSize.size24 }
           presence={ PersonaPresence.none }
           hidePersonaDetails={ !renderPersonaDetails }
         />
@@ -43,7 +43,7 @@ export class PersonaAlternateExample extends React.Component<React.Props<Persona
         />
         <Persona
           { ...examplePersona }
-          size={ PersonaSize.extraSmall }
+          size={ PersonaSize.size32 }
           presence={ PersonaPresence.online }
           hidePersonaDetails={ !renderPersonaDetails }
         />
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
index f34ef517db17b..aaf15d5abc925 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
@@ -42,60 +42,60 @@ export class PersonaBasicExample extends React.Component<React.Props<PersonaBasi
           />
         </div>
 
-        <Label className={ exampleStyles.exampleLabel }>Tiny Persona (12px)</Label>
+        <Label className={ exampleStyles.exampleLabel }>Size 12 Persona</Label>
         <Persona
           { ...examplePersona }
-          size={ PersonaSize.tiny }
+          size={ PersonaSize.size12 }
           presence={ PersonaPresence.offline }
           hidePersonaDetails={ !renderPersonaDetails }
         />
-        <Label className={ exampleStyles.exampleLabel }>Extra Extra Small Persona (24px)</Label>
+        <Label className={ exampleStyles.exampleLabel }>Size 24 Persona</Label>
         <Persona
           { ...examplePersona }
-          size={ PersonaSize.extraExtraSmall }
+          size={ PersonaSize.size24 }
           presence={ PersonaPresence.none }
           hidePersonaDetails={ !renderPersonaDetails }
         />
-        <Label className={ exampleStyles.exampleLabel }>Size 28 Persona (28px)</Label>
+        <Label className={ exampleStyles.exampleLabel }>Size 28 Persona</Label>
         <Persona
           { ...examplePersona }
           size={ PersonaSize.size28 }
           presence={ PersonaPresence.none }
           hidePersonaDetails={ !renderPersonaDetails }
         />
-        <Label className={ exampleStyles.exampleLabel }>Extra Small Persona (32px)</Label>
+        <Label className={ exampleStyles.exampleLabel }>Size 32 Persona</Label>
         <Persona
           { ...examplePersona }
-          size={ PersonaSize.extraSmall }
+          size={ PersonaSize.size32 }
           presence={ PersonaPresence.online }
           hidePersonaDetails={ !renderPersonaDetails }
         />
 
-        <Label className={ exampleStyles.exampleLabel }>Small Persona (40px)</Label>
+        <Label className={ exampleStyles.exampleLabel }>Size 40 Persona</Label>
         <Persona
           { ...examplePersona }
-          size={ PersonaSize.small }
+          size={ PersonaSize.size40 }
           presence={ PersonaPresence.away }
           hidePersonaDetails={ !renderPersonaDetails }
         />
-        <Label className={ exampleStyles.exampleLabel }>Medium Persona (48px)</Label>
+        <Label className={ exampleStyles.exampleLabel }>Size 48 Persona (default) </Label>
         <Persona
           { ...examplePersona }
           hidePersonaDetails={ !renderPersonaDetails }
           presence={ PersonaPresence.busy }
         />
 
-        <Label className={ exampleStyles.exampleLabel }>Large Persona (72px)</Label>
+        <Label className={ exampleStyles.exampleLabel }>Size 72 Persona</Label>
         <Persona
           { ...examplePersona }
-          size={ PersonaSize.large }
+          size={ PersonaSize.size72 }
           presence={ PersonaPresence.dnd }
           hidePersonaDetails={ !renderPersonaDetails }
         />
-        <Label className={ exampleStyles.exampleLabel }>Extra Large Persona (100px)</Label>
+        <Label className={ exampleStyles.exampleLabel }>Size 100 Persona</Label>
         <Persona
           { ...examplePersona }
-          size={ PersonaSize.extraLarge }
+          size={ PersonaSize.size100 }
           presence={ PersonaPresence.blocked }
           hidePersonaDetails={ !renderPersonaDetails }
         />
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx
index 94c39efa2db84..796b1615370a4 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx
@@ -29,14 +29,14 @@ export class PersonaCustomRenderExample extends React.Component<React.Props<Pers
       <div>
         <Persona
           { ...examplePersona }
-          size={ PersonaSize.large }
+          size={ PersonaSize.size72 }
           presence={ PersonaPresence.offline }
           onRenderSecondaryText={ this._onRenderSecondaryText }
         />
-        <div>custom coin size = 150, Persona size is extraLarge.</div>
+        <div>custom coin size = 150, Persona size is size100.</div>
         <Persona
           { ...examplePersona }
-          size={ PersonaSize.extraLarge }
+          size={ PersonaSize.size100 }
           coinSize={ 150 }
           presence={ PersonaPresence.offline }
           onRenderSecondaryText={ this._onRenderSecondaryText }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
index ab799ea02335a..2ca73c550c419 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
@@ -12,7 +12,7 @@ export const SuggestionItemNormal: (persona: IPersonaProps, suggestionProps?: IB
     <div className={ css('ms-PeoplePicker-personaContent', styles.peoplePickerPersonaContent) }>
       <Persona
         presence={ personaProps.presence !== undefined ? personaProps.presence : PersonaPresence.none }
-        size={ PersonaSize.extraExtraSmall }
+        size={ PersonaSize.size24 }
         className={ css('ms-PeoplePicker-Persona', styles.peoplePickerPersona) }
         showSecondaryText={ true }
         { ...personaProps }
@@ -26,7 +26,7 @@ export const SuggestionItemSmall: (persona: IPersonaProps, suggestionProps?: IBa
     <div className={ css('ms-PeoplePicker-personaContent', styles.peoplePickerPersonaContent) }>
       <Persona
         presence={ personaProps.presence !== undefined ? personaProps.presence : PersonaPresence.none }
-        size={ PersonaSize.extraExtraSmall }
+        size={ PersonaSize.size24 }
         className={ css('ms-PeoplePicker-Persona', styles.peoplePickerPersona) }
         { ...personaProps }
       />
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
index f7807682de7eb..713655a00f4c1 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
@@ -291,7 +291,7 @@ export const SuggestedBigItem: (documentProps: IFullDocumentCardProps, itemProps
     <Persona
       imageUrl={ documentPreviewProps && documentPreviewProps.previewImages[0].previewImageSrc }
       primaryText={ documentTitleProps && documentTitleProps.title }
-      size={ PersonaSize.small }
+      size={ PersonaSize.size40 }
     />
   );
 };

From d38e848fb2564059b1227df92b3e7916b85a6d74 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Wed, 1 Nov 2017 11:41:38 -0700
Subject: [PATCH 0959/1641] Experiments: Fix import that was causing build
 issue (#3286)

* Fix import in experiments

* Add change file

* Change import from src to lib
---
 .../experiments/experiments-fix_2017-11-01-18-07.json | 11 +++++++++++
 .../examples/SelectedPeopleList.Basic.Example.tsx     |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/experiments-fix_2017-11-01-18-07.json

diff --git a/common/changes/@uifabric/experiments/experiments-fix_2017-11-01-18-07.json b/common/changes/@uifabric/experiments/experiments-fix_2017-11-01-18-07.json
new file mode 100644
index 0000000000000..42fb0edff9447
--- /dev/null
+++ b/common/changes/@uifabric/experiments/experiments-fix_2017-11-01-18-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Fix import that was causing build error",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "a.erich@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx b/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
index a6906fe3ceb90..b9685974786a4 100644
--- a/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
@@ -7,7 +7,7 @@ import {
 } from 'office-ui-fabric-react/lib/Utilities';
 import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
 import { people, groupOne, groupTwo } from 'experiments/lib/ExtendedPicker';
-import '../../../../../office-ui-fabric-react/src/components/Pickers/PeoplePicker/examples/PeoplePicker.Types.Example.scss';
+import 'office-ui-fabric-react/lib/components/Pickers/PeoplePicker/examples/PeoplePicker.Types.Example.scss';
 import { IBaseSelectedItemsListProps } from '../BaseSelectedItemsList.Props';
 import { IExtendedPersonaProps, SelectedPeopleList } from '../SelectedPeopleList/SelectedPeopleList';
 
@@ -88,4 +88,4 @@ export class PeopleSelectedItemsListExample extends BaseComponent<IBaseSelectedI
         return [];
     }
   }
-}
\ No newline at end of file
+}

From c0b9c8bb36adde77f83d7c557a96b690d894f89c Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Wed, 1 Nov 2017 12:52:22 -0700
Subject: [PATCH 0960/1641] ContextualMenu: Fixed state colors (#3259)

* Fixed ContextualMenu state colors

* Added change file

* Removed menuCheckmarkIcon in favor of bodySubtext semantic slot

* Removed reference to color in checkmarkIcon IStyle

* Removed sass slot + fixed classnames

* Increased menu item height to match toolkit

* Revert "Increased menu item height to match toolkit"

This reverts commit 0d7b47207b426b276e39313f25cbd719e648e38f.
---
 .../contextualmenu-states_2017-10-28-00-33.json       | 11 +++++++++++
 .../components/ContextualMenu/ContextualMenu.Props.ts |  5 +++++
 .../ContextualMenu/ContextualMenu.classNames.ts       |  9 ++++++++-
 .../ContextualMenu/ContextualMenu.styles.ts           | 10 +++++++++-
 .../src/components/ContextualMenu/ContextualMenu.tsx  |  2 +-
 packages/styling/src/interfaces/ISemanticColors.ts    |  1 +
 6 files changed, 35 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/contextualmenu-states_2017-10-28-00-33.json

diff --git a/common/changes/office-ui-fabric-react/contextualmenu-states_2017-10-28-00-33.json b/common/changes/office-ui-fabric-react/contextualmenu-states_2017-10-28-00-33.json
new file mode 100644
index 0000000000000..0d9ef2ada8cfd
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/contextualmenu-states_2017-10-28-00-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixed contextual menu state colors.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
index 743b83a2de3fb..624aa4e510d49 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
@@ -438,6 +438,11 @@ export interface IMenuItemStyles extends IButtonStyles {
    */
   iconColor: IStyle;
 
+  /**
+   * Default style for checkmark icons.
+   */
+  checkmarkIcon: IStyle;
+
   /**
    * Styles for the submenu icon of a menu item.
    */
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
index 635fc3eaf5dd7..c99a3036d257f 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
@@ -16,6 +16,7 @@ export interface IMenuItemClassNames {
   root: string;
   linkContent: string;
   icon: string;
+  checkmarkIcon: string;
   subMenuIcon: string;
   label: string;
   splitButtonSeparator: string;
@@ -97,7 +98,7 @@ export const getItemClassNames = memoizeFunction((
         'is-disabled',
         styles.rootDisabled
       ],
-      !disabled && !expanded && !checked && [{
+      !disabled && !expanded && [{
         selectors: {
           ':hover': styles.rootHovered,
           ':active': styles.rootPressed,
@@ -154,6 +155,12 @@ export const getItemClassNames = memoizeFunction((
       styles.icon,
       iconClassName,
     ],
+    checkmarkIcon: [
+      'ms-ContextualMenu-checkmarkIcon',
+      knownIcon && 'ms-ContextualMenu-checkmarkIcon ' && styles.checkmarkIcon,
+      styles.icon,
+      iconClassName,
+    ],
     subMenuIcon: [
       'ms-ContextualMenu-submenuIcon',
       styles.subMenuIcon,
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
index a40a5f68d414b..7895f3b8b3f62 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
@@ -33,6 +33,7 @@ export const getMenuItemStyles = memoizeFunction((
 ): IMenuItemStyles => {
   const { semanticColors, fonts } = theme;
   const ContextualMenuIconColor = semanticColors.menuIcon;
+  const ContextualMenuCheckColor = semanticColors.bodySubtext;
   const ContextualMenuTextColor = semanticColors.bodyText;
   const ContextualMenuItemBackgroundHoverColor = semanticColors.menuItemBackgroundHovered;
   const ContextualMenuItemBackgroundSelectedColor = semanticColors.menuItemBackgroundChecked;
@@ -85,7 +86,6 @@ export const getMenuItemStyles = memoizeFunction((
       ...getItemHighContrastStyles()
     },
     rootChecked: {
-      backgroundColor: ContextualMenuItemBackgroundSelectedColor,
       ...getItemHighContrastStyles()
     },
     rootPressed: {
@@ -143,6 +143,14 @@ export const getMenuItemStyles = memoizeFunction((
         }
       }
     },
+    checkmarkIcon: {
+      color: ContextualMenuCheckColor,
+      selectors: {
+        [MS_HIGHCONTRAST_ACTIVE]: {
+          color: 'HighlightText',
+        }
+      }
+    },
     subMenuIcon: {
       height: ContextualMenuItemHeight,
       lineHeight: ContextualMenuItemHeight,
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index ff6c421c07eb7..0f34c134d55a0 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -586,7 +586,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
         { (hasCheckmarks) ? (
           <Icon
             iconName={ isItemChecked === true ? 'CheckMark' : '' }
-            className={ classNames.icon }
+            className={ classNames.checkmarkIcon }
             onClick={ this._onItemClick.bind(this, item) }
           />
         ) : (null) }
diff --git a/packages/styling/src/interfaces/ISemanticColors.ts b/packages/styling/src/interfaces/ISemanticColors.ts
index 914a3dcae96af..62c541a429e30 100644
--- a/packages/styling/src/interfaces/ISemanticColors.ts
+++ b/packages/styling/src/interfaces/ISemanticColors.ts
@@ -213,6 +213,7 @@ export interface ISemanticColors {
   menuItemBackgroundHovered: string;
 
   /**
+   * @deprecated
    * The background of checked menu item; e.g. a menu item whose submenu is open, a selected dropdown item.
    */
   menuItemBackgroundChecked: string;

From 3409ce164a3d76f4d026e7d4dcc4012b9dbcc623 Mon Sep 17 00:00:00 2001
From: Fabio Pintos <fabio.pintos@outlook.com>
Date: Wed, 1 Nov 2017 14:09:11 -0700
Subject: [PATCH 0961/1641] Add 'today' to DatePicker properties and forward it
 to the Calendar. (#3288)

* Add 'today' property to DatePicker, forward to Calendar.

* Add tests that check that DatePicker renders the Calendar component with correct properties

* lint fixes

* Add change file
---
 ...atePicker_3280_today_2017-11-01-20-34.json |  11 ++
 .../components/DatePicker/DatePicker.Props.ts |   5 +
 .../components/DatePicker/DatePicker.test.tsx | 109 +++++++++++++++++-
 .../src/components/DatePicker/DatePicker.tsx  |   1 +
 .../__snapshots__/DatePicker.test.tsx.snap    |   2 +-
 5 files changed, 123 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fpintos-datePicker_3280_today_2017-11-01-20-34.json

diff --git a/common/changes/office-ui-fabric-react/fpintos-datePicker_3280_today_2017-11-01-20-34.json b/common/changes/office-ui-fabric-react/fpintos-datePicker_3280_today_2017-11-01-20-34.json
new file mode 100644
index 0000000000000..088ba1771c5f8
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fpintos-datePicker_3280_today_2017-11-01-20-34.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add 'today' to DatePicker properties and forward it to the Calendar.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "fpintos@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
index 765147124206d..3eecfb28a82e4 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
@@ -77,6 +77,11 @@ export interface IDatePickerProps extends React.Props<DatePicker> {
    */
   placeholder?: string;
 
+  /**
+    * Value of today. If null, current time in client machine will be used.
+    */
+    today?: Date;
+
   /**
    * Default value of the DatePicker, if any
    */
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx
index d79612d649bdf..83ed6db06ca81 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx
@@ -1,13 +1,114 @@
 import * as React from 'react';
 import * as renderer from 'react-test-renderer';
-
+import { Calendar, ICalendarStrings } from '../Calendar';
 import { DatePicker } from './DatePicker';
+import { FirstWeekOfYear } from '../../utilities/dateValues/DateValues';
+import { shallow } from 'enzyme';
 
-describe('Checkbox', () => {
-  it('renders Checkbox correctly', () => {
+describe('DatePicker', () => {
+  it('renders default DatePicker correctly', () => {
     // This will only render the input. Calendar component has its own snapshot.
     const component = renderer.create(<DatePicker />);
     let tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
-});
\ No newline at end of file
+
+  describe('when Calendar properties are not specified', () => {
+    const datePicker = shallow(<DatePicker />);
+    datePicker.setState({ isDatePickerShown: true });
+    const calendarProps = datePicker.find(Calendar).props();
+
+    it('renders Calendar with isMonthPickerVisible as true by defaut', () => {
+      expect(calendarProps.isMonthPickerVisible).toBe(true);
+    });
+
+    it('renders Calendar with showMonthPickerAsOverlay as false by defaut', () => {
+      expect(calendarProps.showMonthPickerAsOverlay).toBe(false);
+    });
+
+    it('renders Calendar with highlightCurrentMonth as false by defaut', () => {
+      expect(calendarProps.highlightCurrentMonth).toBe(false);
+    });
+
+    it('renders Calendar with showWeekNumbers as false by defaut', () => {
+      expect(calendarProps.showWeekNumbers).toBe(false);
+    });
+
+    it('renders Calendar with firstWeekOfYear as FirstWeekOfYear.FirstDay by defaut', () => {
+      expect(calendarProps.firstWeekOfYear).toBe(FirstWeekOfYear.FirstDay);
+    });
+
+    it('renders Calendar with showGoToToday as true by defaut', () => {
+      expect(calendarProps.showGoToToday).toBe(true);
+    });
+  });
+
+  describe('when Calendar properties are specified', () => {
+    const value = new Date(2017, 10, 1);
+    const today = new Date(2017, 9, 31);
+    const dateTimeFormatter = {
+      formatMonthDayYear: (date: Date, strings?: ICalendarStrings) => 'm/d/y',
+      formatMonthYear: (date: Date, strings?: ICalendarStrings) => 'm/y',
+      formatDay: (date: Date) => 'd',
+      formatYear: (date: Date) => 'y'
+    };
+
+    const datePicker = shallow(
+      <DatePicker
+        isMonthPickerVisible={false}
+        showMonthPickerAsOverlay={true}
+        value={value}
+        today={today}
+        firstDayOfWeek={2}
+        highlightCurrentMonth={true}
+        showWeekNumbers={true}
+        firstWeekOfYear={FirstWeekOfYear.FirstFullWeek}
+        showGoToToday={false}
+        dateTimeFormatter={dateTimeFormatter}
+      />
+    );
+    datePicker.setState({ isDatePickerShown: true });
+
+    const calendarProps = datePicker.find(Calendar).props();
+
+    it('renders Calendar with same isMonthPickerVisible', () => {
+      expect(calendarProps.isMonthPickerVisible).toBe(false);
+    });
+
+    it('renders Calendar with same showMonthPickerAsOverlay', () => {
+      expect(calendarProps.showMonthPickerAsOverlay).toBe(true);
+    });
+
+    it('renders Calendar with same value', () => {
+      expect(calendarProps.value).toBe(value);
+    });
+
+    it('renders Calendar with same today', () => {
+      expect(calendarProps.today).toBe(today);
+    });
+
+    it('renders Calendar with same firstDayOfWeek', () => {
+      expect(calendarProps.firstDayOfWeek).toBe(2);
+    });
+
+    it('renders Calendar with same highlightCurrentMonth', () => {
+      expect(calendarProps.highlightCurrentMonth).toBe(true);
+    });
+
+    it('renders Calendar with same showWeekNumbers', () => {
+      expect(calendarProps.showWeekNumbers).toBe(true);
+    });
+
+    it('renders Calendar with same firstWeekOfYear', () => {
+      expect(calendarProps.firstWeekOfYear).toBe(FirstWeekOfYear.FirstFullWeek);
+    });
+
+    it('renders Calendar with same showGoToToday', () => {
+      expect(calendarProps.showGoToToday).toBe(false);
+    });
+
+    it('renders Calendar with same dateTimeFormatter', () => {
+      expect(calendarProps.dateTimeFormatter).toBe(dateTimeFormatter);
+    });
+  });
+});
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 27ffeff865986..573fcf381984f 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -231,6 +231,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
               onDismiss={ this._calendarDismissed }
               isMonthPickerVisible={ this.props.isMonthPickerVisible }
               showMonthPickerAsOverlay={ this.props.showMonthPickerAsOverlay }
+              today={ this.props.today }
               value={ selectedDate }
               firstDayOfWeek={ firstDayOfWeek }
               strings={ strings! }
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap
index 7b799f09a4d4b..ea0e3e73a30de 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap
@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Checkbox renders Checkbox correctly 1`] = `
+exports[`DatePicker renders default DatePicker correctly 1`] = `
 <div
   className="ms-DatePicker"
 >

From 5e58d5a68692b2fcef119444fb52361b51118b1f Mon Sep 17 00:00:00 2001
From: stephenzsy <stephen.zsy@gmail.com>
Date: Wed, 1 Nov 2017 14:22:01 -0700
Subject: [PATCH 0962/1641] =?UTF-8?q?Fix=20merge-styles:=20class=20names?=
 =?UTF-8?q?=20in=20selector=20values=20expanded=20into=20parent=E2=80=A6?=
 =?UTF-8?q?=20(#3279)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Fix merge-styles: class names in selector values expanded into parent scope instead within the selector

* add test case

* change file

* Update style-to-classname_2017-10-31-23-57.json
---
 .../style-to-classname_2017-10-31-23-57.json         | 11 +++++++++++
 packages/merge-styles/src/styleToClassName.test.ts   | 12 ++++++++++++
 packages/merge-styles/src/styleToClassName.ts        |  2 +-
 3 files changed, 24 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/merge-styles/style-to-classname_2017-10-31-23-57.json

diff --git a/common/changes/@uifabric/merge-styles/style-to-classname_2017-10-31-23-57.json b/common/changes/@uifabric/merge-styles/style-to-classname_2017-10-31-23-57.json
new file mode 100644
index 0000000000000..dda1b47176035
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/style-to-classname_2017-10-31-23-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "When selectors use previously registered class names as values, they are now correctly auto expanded.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "stzh@microsoft.com"
+}
diff --git a/packages/merge-styles/src/styleToClassName.test.ts b/packages/merge-styles/src/styleToClassName.test.ts
index afe0cb405dd25..ba6e63ac23f9b 100644
--- a/packages/merge-styles/src/styleToClassName.test.ts
+++ b/packages/merge-styles/src/styleToClassName.test.ts
@@ -129,6 +129,18 @@ describe('styleToClassName', () => {
     expect(_stylesheet.getRules()).toEqual('.css-0{background:red;}.css-1{background:red;color:white;}');
   });
 
+  it('can expand previously defined rules in selectors', () => {
+    const className = styleToClassName({ background: 'red' });
+    const newClassName = styleToClassName({
+      selectors: {
+        '& > *': className
+      },
+    });
+
+    expect(newClassName).toEqual('css-1');
+    expect(_stylesheet.getRules()).toEqual('.css-0{background:red;}.css-1 > *{background:red;}');
+  });
+
   it('can expand an array of rules', () => {
     styleToClassName([
       { background: 'red' },
diff --git a/packages/merge-styles/src/styleToClassName.ts b/packages/merge-styles/src/styleToClassName.ts
index 2a3f61f5fc045..b9baa77160f91 100644
--- a/packages/merge-styles/src/styleToClassName.ts
+++ b/packages/merge-styles/src/styleToClassName.ts
@@ -42,7 +42,7 @@ function extractRules(
       const expandedRules = stylesheet.argsFromClassName(arg);
 
       if (expandedRules) {
-        extractRules(expandedRules, rules);
+        extractRules(expandedRules, rules, currentSelector);
       }
       // Else if the arg is an array, we need to recurse in.
     } else if (Array.isArray(arg)) {

From eba1cc63e2c3474031a51e0f849936402c21e7dd Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Thu, 2 Nov 2017 07:20:34 -0700
Subject: [PATCH 0963/1641] Split Button In Menu: Add Vertical Divider
 component and Chevron Menu classname hook (#3245)

* Use VerticalDivider component as separator for splitbutton in menu component

* Add verticaldividerclassnames func

* Add linkContentMenu classname with justifyContent

* Add npm run change file

* Fix path of import

* Add more specific path

* Remove unncessary import

* Add back splitButtonSeparator with deprecated attribute

* Remove unused style imports and simplifiy getClassnames assignment

* Rename to getSplitButtonVerticalDividerClassNames

* Add css inline for unique props to reduce size
---
 ...no-SplitButtonInMenu_2017-10-27-00-59.json | 11 ++++++
 .../ContextualMenu/ContextualMenu.Props.ts    | 10 +++++-
 .../ContextualMenu.classNames.ts              | 24 +++++++++++--
 .../ContextualMenu/ContextualMenu.styles.ts   | 34 ++++++-------------
 .../ContextualMenu/ContextualMenu.tsx         | 26 +++++++-------
 5 files changed, 66 insertions(+), 39 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/malozano-SplitButtonInMenu_2017-10-27-00-59.json

diff --git a/common/changes/office-ui-fabric-react/malozano-SplitButtonInMenu_2017-10-27-00-59.json b/common/changes/office-ui-fabric-react/malozano-SplitButtonInMenu_2017-10-27-00-59.json
new file mode 100644
index 0000000000000..2e1c8216a6faf
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-SplitButtonInMenu_2017-10-27-00-59.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Split Button in Menu: add vertical divider component and hook to customize splitbutton in menu div classname",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
index 624aa4e510d49..bdd50bb1ad2ef 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
@@ -14,6 +14,7 @@ import {
 import { IWithResponsiveModeState } from '../../utilities/decorators/withResponsiveMode';
 import { IContextualMenuClassNames, IMenuItemClassNames } from './ContextualMenu.classNames';
 export { DirectionalHint } from '../../common/DirectionalHint';
+import { IVerticalDividerClassNames } from '../Divider/VerticalDivider.Props';
 
 export enum ContextualMenuItemType {
   Normal = 0,
@@ -335,6 +336,12 @@ export interface IContextualMenuItem {
     iconClassName?: string,
     subMenuClassName?: string) => IMenuItemClassNames;
 
+  /**
+  * Method to provide the classnames to style the Vertical Divider of a split button inside a menu. Default value is the getVerticalDividerClassnames func defined in ContextualMenu.classnames
+  * @default getSplitButtonVerticalDividerClassNames
+  */
+  getSplitButtonVerticalDividerClassNames?: (theme: ITheme) => IVerticalDividerClassNames;
+
   /**
    *  Properties to apply to render this item as a section.
    *  This prop is mutually exclusive with subMenuProps.
@@ -454,7 +461,8 @@ export interface IMenuItemStyles extends IButtonStyles {
   divider: IStyle;
 
   /**
-   * Styles for a split button divider in a menu item
+   *  Styles for a split button divider in a menu item
+   * @deprecated
    */
   splitButtonSeparator: IStyle;
 }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
index c99a3036d257f..75774d55a757a 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
@@ -2,6 +2,9 @@ import { memoizeFunction } from '../../Utilities';
 import { ITheme, mergeStyleSets } from '../../Styling';
 import { IContextualMenuStyles, IMenuItemStyles } from './ContextualMenu.Props';
 import { getStyles as getContextualMenuStyles, getMenuItemStyles } from './ContextualMenu.styles';
+import { IVerticalDividerClassNames } from '../Divider/VerticalDivider.Props';
+import { getDividerClassNames } from '../Divider/VerticalDivider.classNames';
+
 export interface IContextualMenuClassNames {
   container: string;
   root: string;
@@ -19,12 +22,23 @@ export interface IMenuItemClassNames {
   checkmarkIcon: string;
   subMenuIcon: string;
   label: string;
-  splitButtonSeparator: string;
   splitContainer: string;
   splitPrimary: string;
   splitMenu: string;
+  linkContentMenu: string;
 }
 
+export const getSplitButtonVerticalDividerClassNames = memoizeFunction((theme: ITheme): IVerticalDividerClassNames => {
+  const { semanticColors } = theme;
+  const ContextualMenuDividerColor = semanticColors.bodyDivider;
+  return mergeStyleSets(getDividerClassNames(theme), {
+    divider: {
+      height: 16,
+      width: 1,
+    }
+  });
+});
+
 export const getContextualMenuClassNames = memoizeFunction((
   theme: ITheme,
   className?: string
@@ -149,6 +163,13 @@ export const getItemClassNames = memoizeFunction((
       'ms-ContextualMenu-linkContent',
       styles.linkContent
     ],
+    linkContentMenu: [
+      'ms-ContextualMenu-linkContent',
+      styles.linkContent,
+      {
+        justifyContent: 'center',
+      }
+    ],
     icon: [
       'ms-ContextualMenu-icon',
       knownIcon && 'ms-ContextualMenu-iconColor ' && styles.iconColor,
@@ -170,7 +191,6 @@ export const getItemClassNames = memoizeFunction((
       'ms-ContextualMenu-itemText',
       styles.label
     ],
-    splitButtonSeparator: styles.splitButtonSeparator,
     splitContainer: styles.splitButtonFlexContainer,
   });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
index 7895f3b8b3f62..ebd66d0ffcbb2 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
@@ -13,7 +13,6 @@ import { memoizeFunction } from '../../Utilities';
 const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
 
 const ContextualMenuItemHeight = '32px';
-const ContextualMenuIconWidth = '14px';
 
 const getItemHighContrastStyles = memoizeFunction((): IRawStyle => {
   return {
@@ -32,28 +31,21 @@ export const getMenuItemStyles = memoizeFunction((
   theme: ITheme,
 ): IMenuItemStyles => {
   const { semanticColors, fonts } = theme;
-  const ContextualMenuIconColor = semanticColors.menuIcon;
-  const ContextualMenuCheckColor = semanticColors.bodySubtext;
-  const ContextualMenuTextColor = semanticColors.bodyText;
   const ContextualMenuItemBackgroundHoverColor = semanticColors.menuItemBackgroundHovered;
   const ContextualMenuItemBackgroundSelectedColor = semanticColors.menuItemBackgroundChecked;
-  const ContextualMenuTextSelectedColor = semanticColors.bodyTextChecked;
-  const ContextualMenuTextDisabledColor = semanticColors.disabledBodyText;
-  const ContextualMenuDividerColor = semanticColors.bodyDivider;
-  const SplitButtonDividerHeight = 16;
 
   const menuItemStyles: IMenuItemStyles = {
     item: [
       fonts.medium,
       {
-        color: ContextualMenuTextColor,
+        color: semanticColors.bodyText,
         position: 'relative',
         boxSizing: 'border-box',
       }],
     divider: {
       display: 'block',
       height: '1px',
-      backgroundColor: ContextualMenuDividerColor,
+      backgroundColor: semanticColors.bodyDivider,
       position: 'relative'
     },
     root: [
@@ -73,7 +65,7 @@ export const getMenuItemStyles = memoizeFunction((
       },
     ],
     rootDisabled: {
-      color: ContextualMenuTextDisabledColor,
+      color: semanticColors.disabledBodyText,
       cursor: 'default',
       pointerEvents: 'none',
     },
@@ -94,7 +86,7 @@ export const getMenuItemStyles = memoizeFunction((
     },
     rootExpanded: {
       backgroundColor: ContextualMenuItemBackgroundSelectedColor,
-      color: ContextualMenuTextSelectedColor,
+      color: semanticColors.bodyTextChecked,
       fontWeight: FontWeights.semibold,
       ...getItemHighContrastStyles()
     },
@@ -130,13 +122,13 @@ export const getMenuItemStyles = memoizeFunction((
       display: 'inline-block',
       minHeight: '1px',
       maxHeight: ContextualMenuItemHeight,
-      width: ContextualMenuIconWidth,
+      width: '14px',
       margin: '0 4px',
       verticalAlign: 'middle',
       flexShrink: '0',
     },
     iconColor: {
-      color: ContextualMenuIconColor,
+      color: semanticColors.menuIcon,
       selectors: {
         [MS_HIGHCONTRAST_ACTIVE]: {
           color: 'HighlightText',
@@ -144,7 +136,7 @@ export const getMenuItemStyles = memoizeFunction((
       }
     },
     checkmarkIcon: {
-      color: ContextualMenuCheckColor,
+      color: semanticColors.bodySubtext,
       selectors: {
         [MS_HIGHCONTRAST_ACTIVE]: {
           color: 'HighlightText',
@@ -160,20 +152,14 @@ export const getMenuItemStyles = memoizeFunction((
       flexShrink: '0',
       fontSize: FontSizes.mini
     },
-    splitButtonSeparator: {
-      backgroundColor: ContextualMenuDividerColor,
-      position: 'absolute',
-      width: 1,
-      right: 31,
-      height: SplitButtonDividerHeight,
-    },
     splitButtonFlexContainer: {
       display: 'flex',
-      height: '100%',
+      height: ContextualMenuItemHeight,
       flexWrap: 'nowrap',
       justifyContent: 'center',
       alignItems: 'center'
-    }
+    },
+    splitButtonSeparator: {}
   };
 
   return concatStyleSets(menuItemStyles);
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 0f34c134d55a0..43f9dd15d2984 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -2,15 +2,12 @@ import * as React from 'react';
 import { IContextualMenuProps, IContextualMenuItem, ContextualMenuItemType } from './ContextualMenu.Props';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
-import {
-  getStyles,
-  getMenuItemStyles
-} from './ContextualMenu.styles';
 import {
   IMenuItemClassNames,
   IContextualMenuClassNames,
   getContextualMenuClassNames,
-  getItemClassNames
+  getItemClassNames,
+  getSplitButtonVerticalDividerClassNames
 } from './ContextualMenu.classNames';
 import {
   BaseComponent,
@@ -33,6 +30,9 @@ import {
   Icon,
   IIconProps
 } from '../../Icon';
+import {
+  VerticalDivider
+} from '../../Divider';
 export interface IContextualMenuState {
   expandedMenuItemKey?: string;
   dismissedMenuItemKey?: string;
@@ -210,7 +210,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       onRenderSubMenu = this._onRenderSubMenu
     } = this.props;
 
-    let menuClassNames = this.props.getMenuClassNames ? this.props.getMenuClassNames : getContextualMenuClassNames;
+    let menuClassNames = this.props.getMenuClassNames || getContextualMenuClassNames;
     this._classNames = menuClassNames(theme!, className);
 
     let hasIcons = itemsHaveIcons(items);
@@ -316,7 +316,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     // We only send a dividerClassName when the item to be rendered is a divider. For all other cases, the default divider style is used.
     let dividerClassName = item.itemType === ContextualMenuItemType.Divider ? item.className : undefined;
     let subMenuIconClassName = item.submenuIconProps ? item.submenuIconProps.className : '';
-    let getClassNames = item.getItemClassNames ? item.getItemClassNames : getItemClassNames;
+    let getClassNames = item.getItemClassNames || getItemClassNames;
     let itemClassNames = getClassNames(
       this.props.theme!,
       !!item.disabled,
@@ -529,8 +529,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
           className={ classNames.splitContainer }
         >
           { this._renderSplitPrimaryButton(item, classNames, index, hasCheckmarks!, hasIcons!) }
+          { this._renderSplitDivider(item) }
           { this._renderSplitIconButton(item, classNames, index) }
-          { this._renderSplitDivider(classNames) }
         </span>
       </div>
     );
@@ -565,7 +565,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       disabled: item.disabled,
       className: classNames.splitMenu,
       subMenuProps: item.subMenuProps,
-      submenuIconProps: item.submenuIconProps
+      submenuIconProps: item.submenuIconProps,
+      split: true,
     } as IContextualMenuItem;
 
     return React.createElement('button',
@@ -575,14 +576,15 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       this._renderMenuItemChildren(itemProps, classNames, index, false, false));
   }
 
-  private _renderSplitDivider(classNames: IMenuItemClassNames) {
-    return <span className={ classNames.splitButtonSeparator } />;
+  private _renderSplitDivider(item: IContextualMenuItem) {
+    let getDividerClassnames = item.getSplitButtonVerticalDividerClassNames || getSplitButtonVerticalDividerClassNames;
+    return <VerticalDivider getClassNames={ getDividerClassnames } />;
   }
 
   private _renderMenuItemChildren(item: IContextualMenuItem, classNames: IMenuItemClassNames, index: number, hasCheckmarks: boolean, hasIcons: boolean) {
     const isItemChecked: boolean | null | undefined = getIsChecked(item);
     return (
-      <div className={ classNames.linkContent }>
+      <div className={ item.split ? classNames.linkContentMenu : classNames.linkContent }>
         { (hasCheckmarks) ? (
           <Icon
             iconName={ isItemChecked === true ? 'CheckMark' : '' }

From 83c12463a1a1bc06c98d50662eff239e2984707c Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Thu, 2 Nov 2017 09:48:14 -0700
Subject: [PATCH 0964/1641] Slider: Add aria-valuetext property (#3257)

* Add aria-valuetext

* Add tests

* Update snapshot

* Add change file

* Update slider-ariavaluetext_2017-10-27-23-04.json

* Update slider-ariavaluetext_2017-10-27-23-04.json
---
 ...slider-ariavaluetext_2017-10-27-23-04.json | 11 ++++++++
 .../src/components/Slider/Slider.Props.ts     |  4 +++
 .../src/components/Slider/Slider.test.tsx     | 27 +++++++++++++++++++
 .../src/components/Slider/Slider.tsx          |  8 ++++++
 .../Slider/__snapshots__/Slider.test.tsx.snap |  1 +
 5 files changed, 51 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/slider-ariavaluetext_2017-10-27-23-04.json

diff --git a/common/changes/office-ui-fabric-react/slider-ariavaluetext_2017-10-27-23-04.json b/common/changes/office-ui-fabric-react/slider-ariavaluetext_2017-10-27-23-04.json
new file mode 100644
index 0000000000000..25447744847f2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/slider-ariavaluetext_2017-10-27-23-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Slider: added `ariaValueText` property for better screen-reader support.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "a.erich@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.Props.ts b/packages/office-ui-fabric-react/src/components/Slider/Slider.Props.ts
index 888ff777591a8..2f3001ef0a82b 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.Props.ts
@@ -64,6 +64,10 @@ export interface ISliderProps {
    */
   ariaLabel?: string;
 
+  /**
+   * A text description of the Slider number value for the benefit of screen readers. This should be used when the Slider number value is not accurately represented by a number.
+   */
+  ariaValueText?: (value: number) => string;
   /**
    * Optional flag to render the slider vertically. Defaults to rendering horizontal.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
index beda0a55abd92..4a0645f7aaffd 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
@@ -94,4 +94,31 @@ describe('Slider', () => {
     );
     expect(slider!.value).toEqual(12);
   });
+
+  it('renders correct aria-valuetext', () => {
+    let component = ReactTestUtils.renderIntoDocument(
+      <Slider />
+    );
+    let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
+    let button = renderedDOM.querySelector('.ms-Slider-slideBox') as HTMLElement;
+    let ariaValueText = button.getAttribute('aria-valuetext');
+
+    expect(ariaValueText).toBeNull();
+
+    const values = ['small', 'medium', 'large'];
+    const selected = 1;
+    const getTextValue = (value: number) => values[value];
+
+    component = ReactTestUtils.renderIntoDocument(
+      <Slider
+        value={ selected }
+        ariaValueText={ getTextValue }
+      />
+    );
+    renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
+    button = renderedDOM.querySelector('.ms-Slider-slideBox') as HTMLElement;
+    ariaValueText = button.getAttribute('aria-valuetext');
+
+    expect(ariaValueText).toEqual(values[selected]);
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
index ab6faa86ae77d..660be33e3fad9 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
@@ -114,6 +114,7 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
             aria-valuenow={ value }
             aria-valuemin={ min }
             aria-valuemax={ max }
+            aria-valuetext={ this._getAriaValueText(value) }
             aria-label={ ariaLabel || label }
             { ...onMouseDownProp }
             { ...onTouchStartProp }
@@ -165,6 +166,13 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     return this.state.value;
   }
 
+  @autobind
+  private _getAriaValueText(value: number | undefined): string | void {
+    if (this.props.ariaValueText && value !== undefined) {
+      return this.props.ariaValueText(value);
+    }
+  }
+
   private _getThumbStyle(vertical: boolean | undefined, thumbOffsetPercent: number): any {
     let direction: string = vertical ? 'bottom' : (getRTL() ? 'right' : 'left');
     return {
diff --git a/packages/office-ui-fabric-react/src/components/Slider/__snapshots__/Slider.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Slider/__snapshots__/Slider.test.tsx.snap
index 89d5a55c49be3..a0a17a02b7dd2 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/__snapshots__/Slider.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Slider/__snapshots__/Slider.test.tsx.snap
@@ -12,6 +12,7 @@ exports[`Slider renders Slider correctly 1`] = `
       aria-valuemax={10}
       aria-valuemin={0}
       aria-valuenow={0}
+      aria-valuetext={undefined}
       className="ms-Slider-slideBox ms-Slider-showValue ms-Slider-showTransitions undefined"
       disabled={false}
       id="Slider0"

From 1a556bf49b9363c8ca4868c9fa0dac0673634872 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Thu, 2 Nov 2017 10:15:59 -0700
Subject: [PATCH 0965/1641] Grid: Add prop to for FocusZone presence (#3295)

* initial check in

* add the ability for the grid control to not be contained within a FocusZone

* rush change

* update comments
---
 ...ForFocusZonePresnece_2017-11-01-23-59.json | 11 +++
 .../SwatchColorPicker.Props.ts                | 10 ++-
 .../SwatchColorPicker/SwatchColorPicker.tsx   |  4 +-
 .../src/utilities/grid/Grid.Props.ts          |  9 ++-
 .../src/utilities/grid/Grid.tsx               | 81 ++++++++++---------
 5 files changed, 74 insertions(+), 41 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-GridAddPropToForFocusZonePresnece_2017-11-01-23-59.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-GridAddPropToForFocusZonePresnece_2017-11-01-23-59.json b/common/changes/office-ui-fabric-react/jspurlin-GridAddPropToForFocusZonePresnece_2017-11-01-23-59.json
new file mode 100644
index 0000000000000..bff0ed24936d9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-GridAddPropToForFocusZonePresnece_2017-11-01-23-59.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Grid: Add prop to for FocusZone presence",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts
index 4aa5857aa20b4..b9991f049205c 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts
@@ -71,9 +71,17 @@ export interface ISwatchColorPickerProps {
   setSize?: number;
 
   /**
-   * Should focus cycle to the beginning of once the user navigates past the end (and visa vsersa). Defaults to true
+   * Should focus cycle to the beginning of once the user navigates past the end (and visa vsersa).
+   * This prop is only relevant if doNotcontainWithinFocusZone is not true
+   * @default to true
    */
   shouldFocusCircularNavigate?: boolean;
+
+  /**
+   * If true do not contain the grid inside of a FocusZone.
+   * If false contain the grid inside of a FocusZone.
+   */
+  doNotContainWithinFocusZone?: boolean;
 }
 
 export interface IColorCellProps {
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
index 8cb15dfedd954..a45dcf8215288 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
@@ -71,7 +71,8 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
       positionInSet,
       setSize,
       shouldFocusCircularNavigate,
-      className
+      className,
+      doNotContainWithinFocusZone
     } = this.props;
 
     if (colorCells.length < 1 || columnCount < 1) {
@@ -86,6 +87,7 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
         positionInSet={ positionInSet && positionInSet }
         setSize={ setSize && setSize }
         shouldFocusCircularNavigate={ shouldFocusCircularNavigate }
+        doNotContainWithinFocusZone={ doNotContainWithinFocusZone }
         onBlur={ this._onSwatchColorPickerBlur }
         containerClassName={ css('ms-swatchColorPickerBodyContainer', styles.swatchColorPickerContainer, className) }
       />);
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.Props.ts b/packages/office-ui-fabric-react/src/utilities/grid/Grid.Props.ts
index a179682c67be5..367b9b8263068 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.Props.ts
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.Props.ts
@@ -20,10 +20,17 @@ export interface IGridProps {
   onRenderItem: (item: any, index: number) => JSX.Element;
 
   /**
-   * Boolean indicating if the focus should support circular navigation
+   * Boolean indicating if the focus should support circular navigation.
+   * This prop is only relevant if doNotcontainWithinFocusZone is not true
    */
   shouldFocusCircularNavigate?: boolean;
 
+  /**
+   * If true do not contain the grid inside of a FocusZone.
+   * If false contain the grid inside of a FocusZone.
+   */
+  doNotContainWithinFocusZone?: boolean;
+
   /**
    * Optional, class name for the FocusZone container for the grid
    */
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx b/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
index 2cd9c9dc5f23c..1d7ba4d2ace56 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
@@ -28,46 +28,51 @@ export class Grid extends BaseComponent<IGridProps, {}> {
     // Array to store the cells in the correct row index
     let rowsOfItems: any[][] = toMatrix(items, columnCount);
 
+    let content = (
+      <table
+        id={ this._id }
+        role={ 'grid' }
+        aria-posinset={ positionInSet }
+        aria-setsize={ setSize }
+        style={ { padding: '2px', outline: 'none' } }
+      >
+        <tbody>
+          {
+            rowsOfItems.map((rows: any[], rowIndex) => {
+              return (
+                <tr
+                  role={ 'row' }
+                  key={ this._id + '-' + rowIndex + '-row' }
+                >
+                  { rows.map((cell, cellIndex) => {
+                    return (
+                      <td
+                        role={ 'presentation' }
+                        key={ this._id + '-' + cellIndex + '-cell' }
+                        style={ { padding: '0px' } }
+                      >
+                        { onRenderItem(cell, cellIndex) }
+                      </td>
+                    );
+                  }) }
+                </tr>
+              );
+            })
+          }
+        </tbody>
+      </table>
+    );
+
     // Create the table/grid
     return (
-      <FocusZone
-        isCircularNavigation={ this.props.shouldFocusCircularNavigate }
-        className={ this.props.containerClassName }
-        onBlur={ this.props.onBlur }
-      >
-        <table
-          id={ this._id }
-          role={ 'grid' }
-          aria-posinset={ positionInSet }
-          aria-setsize={ setSize }
-          style={ { padding: '2px', outline: 'none' } }
+      this.props.doNotContainWithinFocusZone ? content : (
+        <FocusZone
+          isCircularNavigation={ this.props.shouldFocusCircularNavigate }
+          className={ this.props.containerClassName }
+          onBlur={ this.props.onBlur }
         >
-          <tbody>
-            {
-              rowsOfItems.map((rows: any[], rowIndex) => {
-                return (
-                  <tr
-                    role={ 'row' }
-                    key={ this._id + '-' + rowIndex + '-row' }
-                  >
-                    { rows.map((cell, cellIndex) => {
-                      return (
-                        <td
-                          role={ 'presentation' }
-                          key={ this._id + '-' + cellIndex + '-cell' }
-                          style={ { padding: '0px' } }
-                        >
-                          { onRenderItem(cell, cellIndex) }
-                        </td>
-                      );
-                    }) }
-                  </tr>
-                );
-              })
-            }
-          </tbody>
-        </table>
-      </FocusZone>
-    );
+          { content }
+        </FocusZone>
+      ));
   }
 }
\ No newline at end of file

From 72b103d989212d8c3e7976e6dfc285c17356d9be Mon Sep 17 00:00:00 2001
From: KyleMcNutt <mcnuttkyle93@gmail.com>
Date: Thu, 2 Nov 2017 10:20:10 -0700
Subject: [PATCH 0966/1641] Adding ES2015 Module Support. (#3260)

* Adding ES2015 Module Support.

Adding to the ts script to target es2015 and set the module format to es2015. This outputs into lib-es2015. This will provide better support for bundling tools like Rollup that don't support CommonJS.

* Adding change request file.

* Changing target to es5 for es2015 modules so TypeScript down-compiles correctly.

* Adding change request file.
---
 .gitignore                                            |  2 +-
 .vscode/settings.json                                 |  4 ++--
 apps/todo-app/src/DataProvider.ts                     |  2 +-
 .../addES2015Support_2017-10-28-00-55.json            | 11 +++++++++++
 .../addES2015Support_2017-11-01-23-14.json            | 11 +++++++++++
 .../examples/CommandBar.Customization.Example.tsx     |  2 +-
 .../src/components/ResizeGroup/ResizeGroup.tsx        |  2 +-
 scripts/clean.js                                      |  2 +-
 scripts/tasks/ts.js                                   |  4 ++--
 9 files changed, 31 insertions(+), 9 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/addES2015Support_2017-10-28-00-55.json
 create mode 100644 common/changes/office-ui-fabric-react/addES2015Support_2017-11-01-23-14.json

diff --git a/.gitignore b/.gitignore
index 5e4728c515245..037b95769bc43 100644
--- a/.gitignore
+++ b/.gitignore
@@ -42,7 +42,7 @@ node_modules
 temp
 lib
 lib-amd
-lib-es6
+lib-es2015
 coverage
 dist
 npm-debug.log
diff --git a/.vscode/settings.json b/.vscode/settings.json
index 3f212824c4a6c..e41d096237597 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -20,7 +20,7 @@
     "**/node_modules": true,
     "**/lib": true,
     "**/lib-amd": true,
-    "/**lib-es6": true,
+    "/**lib-es2015": true,
     "**/temp": true,
     "**/dist": true,
     "**/*.scss.ts": true,
@@ -32,7 +32,7 @@
     "**/node_modules": true,
     "**/lib": true,
     "**/lib-amd": true,
-    "**/lib-es6": true,
+    "**/lib-es2015": true,
     "**/dist": true,
     "**/*.scss.ts": true
   },
diff --git a/apps/todo-app/src/DataProvider.ts b/apps/todo-app/src/DataProvider.ts
index 9074b13c49484..630f1a4278f06 100644
--- a/apps/todo-app/src/DataProvider.ts
+++ b/apps/todo-app/src/DataProvider.ts
@@ -1,4 +1,4 @@
-import update = require('immutability-helper');
+import * as update from 'immutability-helper';
 import { Promise } from 'es6-promise';
 import { findIndex } from 'office-ui-fabric-react/lib/Utilities';
 import { ITodoItem, IDataProvider } from './types/index';
diff --git a/common/changes/office-ui-fabric-react/addES2015Support_2017-10-28-00-55.json b/common/changes/office-ui-fabric-react/addES2015Support_2017-10-28-00-55.json
new file mode 100644
index 0000000000000..9a893d6cfdb90
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/addES2015Support_2017-10-28-00-55.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Adding ES2015 Module Support",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kymcnutt@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/addES2015Support_2017-11-01-23-14.json b/common/changes/office-ui-fabric-react/addES2015Support_2017-11-01-23-14.json
new file mode 100644
index 0000000000000..e9c6bd5253edf
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/addES2015Support_2017-11-01-23-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Changed es2015 module output to target es5 so that TypeScript downcompiles the code.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kymcnutt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
index e4c8ad78ea020..ef28110f38991 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { CommandButton } from 'office-ui-fabric-react/lib/Button';
 import { CommandBar } from 'office-ui-fabric-react/lib/CommandBar';
 import { css, autobind, } from 'office-ui-fabric-react/lib/Utilities';
-import styles = require('./CommandBar.Example.scss');
+import * as styles from './CommandBar.Example.scss';
 import { IContextualMenuItem } from '../../ContextualMenu';
 
 export interface ISplitDropDownButtonState {
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index 485a7f0a2b669..e8119d512fad2 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -4,7 +4,7 @@ import {
   BaseComponent
 } from '../../Utilities';
 import { IResizeGroupProps } from './ResizeGroup.Props';
-import styles = require('./ResizeGroup.scss');
+import * as styles from './ResizeGroup.scss';
 
 const RESIZE_DELAY = 16;
 
diff --git a/scripts/clean.js b/scripts/clean.js
index 8264c37807e85..10e03833a7b69 100644
--- a/scripts/clean.js
+++ b/scripts/clean.js
@@ -6,7 +6,7 @@ const path = require('path');
   'temp',
   'dist',
   'lib-amd',
-  'lib-es6',
+  'lib-es2015',
   'coverage'
 ].forEach(folder => {
   rimraf(path.resolve(process.cwd(), folder));
diff --git a/scripts/tasks/ts.js b/scripts/tasks/ts.js
index 05cc2c8295405..57508c4d68d9a 100644
--- a/scripts/tasks/ts.js
+++ b/scripts/tasks/ts.js
@@ -10,6 +10,6 @@ module.exports = function (options) {
 
   if (options.isProduction) {
     execSync(typescriptPath + ' -outDir lib-amd -t es5 -m amd ' + extraParams);
-    // execSync(typescriptPath + ' -outDir lib-es6 -t es6 -m es6 ' + extraParams, 'typescript es6');
+    execSync(typescriptPath + ' -outDir lib-es2015 -t es5 -m es2015 ' + extraParams);
   }
-};
+};
\ No newline at end of file

From b1f263aff594d1926081be2f67cd54ad64296b89 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Thu, 2 Nov 2017 10:48:43 -0700
Subject: [PATCH 0967/1641] ContextualMenu/ComboBox/Dropdown: Update so they
 have one notion of focus (from both hover and keyboard) (#3274)

* Update contextualMenu, comboBox and dropdown to have one notion of focus

* rush change

* update some styling

* clean up a little styling

* remove some duplicate code

* update the checkbox rest state border color

* add a unit test for focus being updated on hover

* Make sure the checkbox checked state borderColor is not changed

* make the checkbox checked state border color align with the checked background color

* make the checked, checkHovered, and checkedFocused borderColor align with the backgroundColor
---
 ...UnifiedMenuFocusRect_2017-10-31-15-13.json |  11 ++
 .../src/components/Checkbox/Checkbox.Props.ts |  15 +++
 .../Checkbox/Checkbox.classNames.ts           |   9 +-
 .../components/Checkbox/Checkbox.styles.ts    |  16 ++-
 .../__snapshots__/Checkbox.test.tsx.snap      |   8 +-
 .../components/ComboBox/ComboBox.styles.ts    |  11 +-
 .../src/components/ComboBox/ComboBox.tsx      | 103 ++++++++++++++++--
 .../ContextualMenu.classNames.ts              |  14 ++-
 .../ContextualMenu/ContextualMenu.test.tsx    |  41 +++++++
 .../ContextualMenu/ContextualMenu.tsx         |  71 +++++++++++-
 .../src/components/Dropdown/Dropdown.scss     |  16 +--
 .../src/components/Dropdown/Dropdown.tsx      |  56 +++++++++-
 12 files changed, 332 insertions(+), 39 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-UnifiedMenuFocusRect_2017-10-31-15-13.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-UnifiedMenuFocusRect_2017-10-31-15-13.json b/common/changes/office-ui-fabric-react/jspurlin-UnifiedMenuFocusRect_2017-10-31-15-13.json
new file mode 100644
index 0000000000000..1f3c8a0c68988
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-UnifiedMenuFocusRect_2017-10-31-15-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Menus: Update so they have one notion of focus (from both hover and keyboard)",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
index 6a0fdceef82d0..a05bb39e96722 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
@@ -131,6 +131,11 @@ export interface ICheckboxStyles {
    */
   checkboxHovered?: IStyle;
 
+  /**
+   * Style override for checkbox when enabled/unchecked/focused.
+   */
+  checkboxFocused?: IStyle;
+
   /**
    * Style override for checkbox when enabled/checked.
    */
@@ -141,6 +146,11 @@ export interface ICheckboxStyles {
    */
   checkboxCheckedHovered?: IStyle;
 
+  /**
+   * Style override for checkbox when enabled/checked/focused.
+   */
+  checkboxCheckedFocused?: IStyle;
+
   /**
    * Style override for checkbox when disabled/unchecked.
    */
@@ -181,6 +191,11 @@ export interface ICheckboxStyles {
    */
   textHovered?: IStyle;
 
+  /**
+   * Style override for text appearing with the checkbox when enabled/focused.
+   */
+  textFocused?: IStyle;
+
   /**
    * Style override for text appearing with the checkbox when disabled.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.classNames.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.classNames.ts
index 1a9cb446ff02e..11854463e0621 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.classNames.ts
@@ -29,17 +29,20 @@ export const getClassNames = memoizeFunction((
       !disabled && [
         !isChecked && {
           selectors: {
-            ':hover .ms-Checkbox-checkbox': styles.checkboxHovered
+            ':hover .ms-Checkbox-checkbox': styles.checkboxHovered,
+            ':focus .ms-Checkbox-checkbox': styles.checkboxFocused
           }
         },
         isChecked && {
           selectors: {
-            ':hover .ms-Checkbox-checkbox': styles.checkboxCheckedHovered
+            ':hover .ms-Checkbox-checkbox': styles.checkboxCheckedHovered,
+            ':focus .ms-Checkbox-checkbox': styles.checkboxCheckedFocused
           }
         },
         {
           selectors: {
-            ':hover .ms-Checkbox-text': styles.textHovered
+            ':hover .ms-Checkbox-text': styles.textHovered,
+            ':focus .ms-Checkbox-text': styles.textFocused
           }
         }
       ]
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
index 664c6baf4a89c..1e3115b0d0a63 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
@@ -18,11 +18,13 @@ export const getStyles = memoizeFunction((
   const { semanticColors, palette } = theme;
   const checkmarkFontColor = semanticColors.inputForegroundChecked;
   const checkmarkFontColorCheckedDisabled = semanticColors.disabledBackground;
-  const checkboxBorderColor = semanticColors.inputBorder;
+  const checkboxBorderColor = semanticColors.inputBorderHovered;
+  const checkboxBorderColorChecked = semanticColors.inputBackgroundChecked;
   const checkboxBorderColorDisabled = semanticColors.disabledText;
   const checkboxBorderHoveredColor = semanticColors.inputBorderHovered;
   const checkboxBackgroundChecked = semanticColors.inputBackgroundChecked;
   const checkboxBackgroundCheckedHovered = semanticColors.inputBackgroundCheckedHovered;
+  const checkboxBorderColorCheckedHovered = semanticColors.inputBackgroundCheckedHovered;
   const checkboxBackgroundDisabled = semanticColors.disabledText;
   const checkboxTextColor = semanticColors.bodyText;
   const checkboxTextColorDisabled = semanticColors.disabledText;
@@ -78,11 +80,20 @@ export const getStyles = memoizeFunction((
     checkboxHovered: {
       borderColor: checkboxBorderHoveredColor,
     },
+    checkboxFocused: {
+      borderColor: checkboxBorderHoveredColor,
+    },
     checkboxChecked: {
       background: checkboxBackgroundChecked,
+      borderColor: checkboxBorderColorChecked
     },
     checkboxCheckedHovered: {
       background: checkboxBackgroundCheckedHovered,
+      borderColor: checkboxBorderColorCheckedHovered
+    },
+    checkboxCheckedFocused: {
+      background: checkboxBackgroundCheckedHovered,
+      borderColor: checkboxBorderColorCheckedHovered
     },
     checkboxDisabled: {
       background: checkboxBackgroundDisabled,
@@ -113,6 +124,9 @@ export const getStyles = memoizeFunction((
     textHovered: {
       color: palette.black,
     },
+    textFocused: {
+      color: palette.black,
+    },
     textDisabled: {
       color: checkboxTextColorDisabled,   // ms-fontColor-neutralTertiary
     }
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
index 43603b35f6906..c92d8ec0aa2b9 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
@@ -43,9 +43,15 @@ exports[`Checkbox renders Checkbox correctly 1`] = `
       &:hover .ms-Checkbox-checkbox {
         border-color: #333333;
       }
+      &:focus .ms-Checkbox-checkbox {
+        border-color: #333333;
+      }
       &:hover .ms-Checkbox-text {
         color: #000000;
       }
+      &:focus .ms-Checkbox-text {
+        color: #000000;
+      }
   disabled={undefined}
   id="checkbox-0"
   name={undefined}
@@ -77,7 +83,7 @@ exports[`Checkbox renders Checkbox correctly 1`] = `
           ms-Checkbox-checkbox
           {
             align-items: center;
-            border-color: #a6a6a6;
+            border-color: #333333;
             border-style: solid;
             border-width: 1px;
             box-sizing: border-box;
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index d2571407a95e4..1702f09fc25db 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -61,7 +61,7 @@ export const getOptionStyles = memoizeFunction((
 
   const ComboBoxOptionBackgroundSelected = semanticColors.menuItemBackgroundChecked;
   const ComboBoxOptionBackgroundHovered = semanticColors.menuItemBackgroundHovered;
-  const ComboBoxOptionTextColorHovered = palette.black;
+  const ComboBoxOptionTextColorHovered = semanticColors.bodyText;
   const ComboBoxOptionTextColorSelected = palette.black;
   const ComboBoxOptionTextColorDisabled = semanticColors.disabledText;
   const ComboBoxOptionBackgroundDisabled = semanticColors.disabledBackground;
@@ -94,16 +94,14 @@ export const getOptionStyles = memoizeFunction((
       getFocusStyle(theme),
     ],
     rootHovered: {
-      backgroundColor: ComboBoxOptionBackgroundHovered,
-      color: ComboBoxOptionTextColorHovered,
-      ...getListOptionHighContrastStyles(theme)
+      color: ComboBoxOptionTextColorHovered
     },
     rootFocused: {
       backgroundColor: ComboBoxOptionBackgroundHovered
     },
     rootPressed: {
       backgroundColor: ComboBoxOptionBackgroundHovered,
-      color: ComboBoxOptionTextColorHovered
+      color: ComboBoxOptionTextColorSelected
     },
     rootChecked: [
       {
@@ -113,9 +111,6 @@ export const getOptionStyles = memoizeFunction((
       getFocusStyle(theme),
       getListOptionHighContrastStyles(theme)
     ],
-    rootCheckedHovered: {
-      backgroundColor: ComboBoxOptionBackgroundSelected
-    },
     rootDisabled: {
       backgroundColor: ComboBoxOptionBackgroundDisabled,
       color: ComboBoxOptionTextColorDisabled,
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index ff36b668a6ce9..c488ff6a3c260 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -51,6 +51,10 @@ export interface IComboBoxState {
   // that the options input matches (-1 if no input or match)
   currentPendingValueValidIndex: number;
 
+  // This will store the hovered over value in the dropdown
+  // it is used for styling the options without updating the input
+  currentPendingValueValidIndexOnHover: number;
+
   // when taking input, this will store
   // the actual text that is being entered
   currentPendingValue: string;
@@ -62,6 +66,15 @@ enum SearchDirection {
   forward = 1
 }
 
+enum HoverStatus {
+  // This is used when the user was hovering
+  // and has since moused out of the menu items
+  clearAll = -2,
+  // This is the default "normal" state
+  // when no hover has happened or a hover is in progress
+  default = -1
+}
+
 @customizable('ComboBox', ['theme'])
 export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
@@ -132,7 +145,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       suggestedDisplayValue: '',
       currentOptions: this.props.options,
       currentPendingValueValidIndex: -1,
-      currentPendingValue: ''
+      currentPendingValue: '',
+      currentPendingValueValidIndexOnHover: HoverStatus.default
     };
   }
 
@@ -727,7 +741,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     let {
       currentPendingValue,
       currentPendingValueValidIndex,
-      currentOptions
+      currentOptions,
+      currentPendingValueValidIndexOnHover
     } = this.state;
 
     // If we allow freeform and we have a pending value, we
@@ -767,6 +782,9 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       // Since we are not allowing freeform, we must have a matching
       // to be able to update state
       this._setSelectedIndex(currentPendingValueValidIndex);
+    } else if (currentPendingValueValidIndexOnHover >= 0) {
+      // If all else failed and we were hovering over an item, select it
+      this._setSelectedIndex(currentPendingValueValidIndexOnHover);
     }
 
     // Finally, clear the pending info
@@ -883,6 +901,9 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         styles={ this._getCurrentOptionStyles(item) }
         checked={ isSelected }
         onClick={ this._onItemClick(item.index) }
+        onMouseEnter={ this._onOptionMouseEnter.bind(this, item.index) }
+        onMouseMove={ this._onOptionMouseMove.bind(this, item.index) }
+        onMouseLeave={ this._onOptionMouseLeave }
         role='option'
         aria-selected={ isSelected ? 'true' : 'false' }
         ariaLabel={ item.text }
@@ -895,18 +916,51 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   }
 
   /**
+   * If we are coming from a mouseOut:
+   * there is no visible selected option.
+   *
+   * Else if We are hovering over an item:
+   * that gets the selected look.
+   *
+   * Else:
    * Use the current valid pending index if it exists OR
    * we do not have a valid index and we currently have a pending input value,
    * otherwise use the selected index
    * */
   private _isOptionSelected(index: number | undefined): boolean {
     let {
+      currentPendingValueValidIndexOnHover
+    } = this.state;
+
+    // If the hover state is set to clearAll, don't show a selected index.
+    // Note, this happens when the user moused out of the menu items
+    if (currentPendingValueValidIndexOnHover === HoverStatus.clearAll) {
+      return false;
+    }
+
+    return this._getPendingSelectedIndex(true /* includePendingValue */) === index;
+  }
+
+  /**
+   * Gets the pending selected index taking into account hover, valueValidIndex, and selectedIndex
+   * @param includeCurrentPendingValue - Should we include the currentPendingValue when
+   * finding the index
+   */
+  private _getPendingSelectedIndex(includeCurrentPendingValue: boolean): number {
+    let {
+      currentPendingValueValidIndexOnHover,
       currentPendingValueValidIndex,
       currentPendingValue,
       selectedIndex
     } = this.state;
-    return ((currentPendingValueValidIndex >= 0 || currentPendingValue !== '') ?
-      currentPendingValueValidIndex === index : selectedIndex === index);
+
+    return (
+      currentPendingValueValidIndexOnHover >= 0 ?
+        currentPendingValueValidIndexOnHover :
+        (currentPendingValueValidIndex >= 0 || (includeCurrentPendingValue && currentPendingValue !== '')) ?
+          currentPendingValueValidIndex :
+          selectedIndex
+    );
   }
 
   /**
@@ -1041,7 +1095,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     this.setState({
       currentPendingValue: currentPendingValue,
       currentPendingValueValidIndex: currentPendingValueValidIndex,
-      suggestedDisplayValue: suggestedDisplayValue
+      suggestedDisplayValue: suggestedDisplayValue,
+      currentPendingValueValidIndexOnHover: HoverStatus.default
     });
   }
 
@@ -1097,8 +1152,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     let {
       isOpen,
       currentPendingValueValidIndex,
-      selectedIndex,
-      currentOptions
+      currentOptions,
+      currentPendingValueValidIndexOnHover
     } = this.state;
 
     if (disabled) {
@@ -1106,7 +1161,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       return;
     }
 
-    let index = currentPendingValueValidIndex >= 0 ? currentPendingValueValidIndex : selectedIndex;
+    let index = this._getPendingSelectedIndex(false /* includeCurrentPendingValue */);
 
     switch (ev.which) {
       case KeyCodes.enter:
@@ -1163,6 +1218,13 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         break;
 
       case KeyCodes.up:
+        // if we are in clearAll state (e.g. the user as hovering
+        // and has since mousedOut of the menu items),
+        // go to the last index
+        if (currentPendingValueValidIndexOnHover === HoverStatus.clearAll) {
+          index = this.state.currentOptions.length;
+        }
+
         // Go to the previous option
         this._setInfoForIndexAndDirection(index, SearchDirection.backward);
         break;
@@ -1172,6 +1234,13 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         if (ev.altKey || ev.metaKey) {
           this.setState({ isOpen: true });
         } else {
+          // if we are in clearAll state (e.g. the user as hovering
+          // and has since mousedOut of the menu items),
+          // go to the first index
+          if (currentPendingValueValidIndexOnHover === HoverStatus.clearAll) {
+            index = -1;
+          }
+
           // Got to the next option
           this._setInfoForIndexAndDirection(index, SearchDirection.forward);
         }
@@ -1271,6 +1340,24 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     ev.preventDefault();
   }
 
+  private _onOptionMouseEnter(index: number) {
+    this.setState({
+      currentPendingValueValidIndexOnHover: index
+    });
+  }
+
+  private _onOptionMouseMove(index: number) {
+    this.setState({
+      currentPendingValueValidIndexOnHover: index
+    });
+  }
+
+  private _onOptionMouseLeave = () => {
+    this.setState({
+      currentPendingValueValidIndexOnHover: HoverStatus.clearAll
+    });
+  }
+
   /**
    * Handle dismissing the menu and
    * eating the required key event when disabled
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
index 75774d55a757a..525da8eb9b60c 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
@@ -51,6 +51,11 @@ export const getContextualMenuClassNames = memoizeFunction((
       'ms-ContextualMenu-container',
       styles.container,
       className,
+      [{
+        selectors: {
+          ':focus': { outline: 0 }
+        }
+      }]
     ],
     root: [
       'ms-ContextualMenu is-open',
@@ -116,7 +121,8 @@ export const getItemClassNames = memoizeFunction((
         selectors: {
           ':hover': styles.rootHovered,
           ':active': styles.rootPressed,
-          '.ms-Fabric.is-focusVisible &:focus': styles.rootFocused
+          '.ms-Fabric.is-focusVisible &:focus, .ms-Fabric.is-focusVisible &:focus:hover': styles.rootFocused,
+          '.ms-Fabric.is-focusVisible &:hover': { background: 'inherit;' }
         }
       }],
     ],
@@ -134,7 +140,8 @@ export const getItemClassNames = memoizeFunction((
         selectors: {
           ':hover': styles.rootHovered,
           ':active': styles.rootPressed,
-          '.ms-Fabric.is-focusVisible &:focus': styles.rootFocused
+          '.ms-Fabric.is-focusVisible &:focus, .ms-Fabric.is-focusVisible &:focus:hover': styles.rootFocused,
+          '.ms-Fabric.is-focusVisible &:hover': { background: 'inherit;' }
         }
       }]
     ],
@@ -155,7 +162,8 @@ export const getItemClassNames = memoizeFunction((
         selectors: {
           ':hover': styles.rootHovered,
           ':active': styles.rootPressed,
-          '.ms-Fabric.is-focusVisible &:focus': styles.rootFocused
+          '.ms-Fabric.is-focusVisible &:focus, .ms-Fabric.is-focusVisible &:focus:hover': styles.rootFocused,
+          '.ms-Fabric.is-focusVisible &:hover': { background: 'inherit;' }
         }
       }]
     ],
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
index 5dcc75688cadc..4488ed12e7357 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
@@ -370,6 +370,47 @@ describe('ContextualMenu', () => {
 
   });
 
+  it('Hover correctly focuses the second element', (done) => {
+    const items: IContextualMenuItem[] = [
+      {
+        name: 'TestText 1',
+        key: 'TestKey1',
+        className: 'testkey1'
+      },
+      {
+        name: 'TestText 2',
+        key: 'TestKey2',
+        className: 'testkey2'
+      },
+    ];
+
+    ReactTestUtils.renderIntoDocument<ContextualMenu>(
+      <ContextualMenu
+        items={ items }
+      />
+    );
+
+    new Promise<any>(resolve => {
+      let focusedItem;
+      for (let i = 0; i < 20; i++) {
+        focusedItem = document.querySelector('.testkey2')!.firstChild;
+
+        if (focusedItem) {
+          let focusedItemElement = focusedItem as HTMLElement;
+          let eventObject = document.createEvent('Events');
+          eventObject.initEvent('mouseenter', true, false);
+          focusedItemElement.dispatchEvent(eventObject);
+        }
+        if (focusedItem === document.activeElement) {
+          break;
+        }
+      }
+      expect(document.activeElement).toEqual(focusedItem);
+      done();
+      resolve();
+    }).catch(done());
+  });
+
   it('ContextualMenu menuOpened callback is called only when menu is available', () => {
     let layerMounted = false;
     let menuMounted = false;
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 43f9dd15d2984..e0c86474ac3ba 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -22,7 +22,9 @@ import {
   KeyCodes,
   getDocument,
   getWindow,
-  customizable
+  customizable,
+  getFirstFocusable,
+  getLastFocusable
 } from '../../Utilities';
 import { withResponsiveMode, ResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
 import { Callout } from '../../Callout';
@@ -272,7 +274,15 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
           bounds={ bounds }
           directionalHintFixed={ directionalHintFixed }
         >
-          <div style={ contextMenuStyle } ref={ (host: HTMLDivElement) => this._host = host } id={ id } className={ this._classNames.container }>
+          <div
+            role='menu'
+            style={ contextMenuStyle }
+            ref={ (host: HTMLDivElement) => this._host = host }
+            id={ id }
+            className={ this._classNames.container }
+            tabIndex={ 0 }
+            onKeyDown={ this._onMenuKeyDown }
+          >
             { title && <div className={ this._classNames.title } role='heading' aria-level={ 1 }> { title } </div> }
             { (items && items.length) ? (
               <FocusZone
@@ -281,7 +291,6 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
                 isCircularNavigation={ true }
               >
                 <ul
-                  role='menu'
                   aria-label={ ariaLabel }
                   aria-labelledby={ labelElementId }
                   className={ this._classNames.list }
@@ -485,8 +494,9 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       onClick: this._onItemClick.bind(this, item),
       onKeyDown: hasSubmenuItems(item) ? this._onItemKeyDown.bind(this, item) : null,
       onMouseEnter: this._onItemMouseEnter.bind(this, item),
-      onMouseLeave: this._onMouseLeave,
+      onMouseLeave: this._onMouseItemLeave.bind(this, item),
       onMouseDown: (ev: any) => this._onItemMouseDown(item, ev),
+      onMouseMove: this._onItemMouseMove.bind(this, item),
       disabled: item.isDisabled || item.disabled,
       href: item.href,
       title: item.title,
@@ -639,6 +649,31 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     }
   }
 
+  @autobind
+  private _onMenuKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+    if (ev.which === KeyCodes.escape) {
+      this._isFocusingPreviousElement = true;
+      ev.preventDefault();
+      ev.stopPropagation();
+      this.dismiss(ev);
+      return;
+    }
+
+    if (!this._host) {
+      return;
+    }
+
+    let elementToFocus = ev.which === KeyCodes.up ?
+      getLastFocusable(this._host, (this._host.lastChild as HTMLElement), true) :
+      ev.which === KeyCodes.down ?
+        getFirstFocusable(this._host, (this._host.firstChild as HTMLElement), true) :
+        null;
+
+    if (elementToFocus) {
+      elementToFocus.focus();
+    }
+  }
+
   private _onItemMouseEnter(item: any, ev: React.MouseEvent<HTMLElement>) {
     let targetElement = ev.currentTarget as HTMLElement;
 
@@ -649,11 +684,37 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
         this._enterTimerId = this._async.setTimeout(() => this._onSubMenuDismiss(ev), 500);
       }
     }
+
+    targetElement.focus();
+  }
+
+  private _onItemMouseMove(item: any, ev: React.MouseEvent<HTMLElement>) {
+    let targetElement = ev.currentTarget as HTMLElement;
+
+    if (targetElement === this._targetWindow.document.activeElement as HTMLElement) {
+      return;
+    }
+
+    if (item.key !== this.state.expandedMenuItemKey) {
+      if (hasSubmenuItems(item)) {
+        this._enterTimerId = this._async.setTimeout(() => this._onItemSubMenuExpand(item, targetElement), 500);
+      } else {
+        this._enterTimerId = this._async.setTimeout(() => this._onSubMenuDismiss(ev), 500);
+      }
+    }
+
+    targetElement.focus();
   }
 
   @autobind
-  private _onMouseLeave(ev: React.MouseEvent<HTMLElement>) {
+  private _onMouseItemLeave(item: any, ev: React.MouseEvent<HTMLElement>) {
     this._async.clearTimeout(this._enterTimerId);
+
+    if (item.key === this.state.expandedMenuItemKey && hasSubmenuItems(item)) {
+      return;
+    }
+
+    this._host.focus();
   }
 
   private _onItemMouseDown(item: IContextualMenuItem, ev: React.MouseEvent<HTMLElement>) {
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
index 028dbd67c0d24..bd7f9d72f78bd 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
@@ -101,6 +101,12 @@ $DropDown-item-height: 32px;
   }
 }
 
+.listWrapper {
+  &:focus {
+    outline: 0
+  }
+}
+
 .caretDownWrapper {
   position: absolute;
   top: 1px; // border
@@ -186,16 +192,14 @@ $DropDown-item-height: 32px;
   }
 
   &:hover {
-    background-color: $Dropdown-selectedItem-hover-bg;
-    color: $ms-color-black;
-
-    @include highContrastListItemState;
+    color: inherit;
   }
 
   @include focus-border();
 
   &:focus {
     background-color: $ms-color-neutralLighter;
+    @include highContrastListItemState;
   }
 
   &:active {
@@ -218,10 +222,6 @@ $DropDown-item-height: 32px;
   background-color: $Dropdown-selectedItem-bg;
   color: $ms-color-black;
 
-  &:hover {
-    background-color: $Dropdown-selectedItem-bg;
-  }
-
   @include focus-border();
 
   @include highContrastListItemState;
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 68b8384e2b92e..67b20eb592bc3 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -18,11 +18,15 @@ import {
   findIndex,
   getId,
   getNativeProps,
-  divProperties
+  divProperties,
+  getFirstFocusable,
+  getLastFocusable
 } from '../../Utilities';
 import { SelectableOptionMenuItemType } from '../../utilities/selectableOption/SelectableOption.Props';
 import * as stylesImport from './Dropdown.scss';
 const styles: any = stylesImport;
+import { getStyles as getCheckboxStyles } from '../Checkbox/Checkbox.styles';
+import { getTheme } from '../../Styling';
 
 // Internal only props interface to support mixing in responsive mode
 export interface IDropdownInternalProps extends IDropdownProps, IWithResponsiveModeState {
@@ -44,6 +48,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   private static Option: string = 'option';
 
   private _root: HTMLElement;
+  private _host: HTMLDivElement;
   private _focusZone: FocusZone;
   private _dropDown: HTMLDivElement;
   // tslint:disable-next-line:no-unused-variable
@@ -387,7 +392,12 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     let { selectedIndices = [] } = this.state;
 
     return (
-      <div onKeyDown={ this._onZoneKeyDown }>
+      <div
+        className={ styles.listWrapper }
+        onKeyDown={ this._onZoneKeyDown }
+        ref={ this._resolveRef('_host') }
+        tabIndex={ 0 }
+      >
         <FocusZone
           ref={ this._resolveRef('_focusZone') }
           direction={ FocusZoneDirection.vertical }
@@ -450,6 +460,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     let { selectedIndices = [] } = this.state;
     let id = this._id;
     let isItemSelected = item.index !== undefined && selectedIndices ? selectedIndices.indexOf(item.index) > -1 : false;
+    let checkboxStyles = getCheckboxStyles(getTheme());
 
     return (
       !this.props.multiSelect ?
@@ -467,6 +478,9 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
               }
             ) }
             onClick={ this._onItemClick(item.index!) }
+            onMouseEnter={ this._onItemMouseEnter.bind(this, item) }
+            onMouseLeave={ this._onMouseItemLeave.bind(this, item) }
+            onMouseMove={ this._onItemMouseMove.bind(this, item) }
             role='option'
             aria-selected={ isItemSelected ? 'true' : 'false' }
             ariaLabel={ item.ariaLabel || item.text }
@@ -482,6 +496,11 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
             data-index={ item.index }
             data-is-focusable={ true }
             onChange={ this._onItemClick(item.index!) }
+            inputProps={ {
+              onMouseEnter: this._onItemMouseEnter.bind(this, item),
+              onMouseLeave: this._onMouseItemLeave.bind(this, item),
+              onMouseMove: this._onItemMouseMove.bind(this, item)
+            } }
             label={ item.text }
             className={ css(
               'ms-ColumnManagementPanel-checkbox',
@@ -493,6 +512,13 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
             role='option'
             aria-selected={ isItemSelected ? 'true' : 'false' }
             checked={ isItemSelected }
+            // Hover is being handled by focus styles
+            // so clear out the explicit hover styles
+            styles={ {
+              checkboxHovered: checkboxStyles.checkbox,
+              checkboxCheckedHovered: checkboxStyles.checkboxChecked,
+              textHovered: checkboxStyles.text
+            } }
           >{ onRenderOption(item, this._onRenderOption) }
           </Checkbox>
         )
@@ -523,6 +549,21 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     };
   }
 
+  private _onItemMouseEnter(item: any, ev: React.MouseEvent<HTMLElement>) {
+    let targetElement = ev.currentTarget as HTMLElement;
+    targetElement.focus();
+  }
+
+  private _onItemMouseMove(item: any, ev: React.MouseEvent<HTMLElement>) {
+    let targetElement = ev.currentTarget as HTMLElement;
+    targetElement.focus();
+  }
+
+  @autobind
+  private _onMouseItemLeave(item: any, ev: React.MouseEvent<HTMLElement>) {
+    this._host.focus();
+  }
+
   @autobind
   private _onDismiss() {
     this.setState({ isOpen: false });
@@ -686,11 +727,15 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
 
   @autobind
   private _onZoneKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+    let elementToFocus;
+
     switch (ev.which) {
 
       case KeyCodes.up:
         if (ev.altKey || ev.metaKey) {
           this.setState({ isOpen: false });
+        } else {
+          elementToFocus = getLastFocusable(this._host, (this._host.lastChild as HTMLElement), true);
         }
         break;
 
@@ -700,7 +745,10 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
       case KeyCodes.end:
       case KeyCodes.pageUp:
       case KeyCodes.pageDown:
+        break;
+
       case KeyCodes.down:
+        elementToFocus = getFirstFocusable(this._host, (this._host.firstChild as HTMLElement), true);
         break;
 
       case KeyCodes.escape:
@@ -715,6 +763,10 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
         return;
     }
 
+    if (elementToFocus) {
+      elementToFocus.focus();
+    }
+
     ev.stopPropagation();
     ev.preventDefault();
   }

From fa44ea244fcb099d89130202b9ef8fd0e86a93c6 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 2 Nov 2017 18:20:18 +0000
Subject: [PATCH 0968/1641] Applying package updates.

---
 .../experiments-fix_2017-11-01-18-07.json     | 11 ---
 .../selectionItemsList_2017-10-19-17-24.json  | 11 ---
 .../style-to-classname_2017-10-31-23-57.json  | 11 ---
 .../addES2015Support_2017-10-28-00-55.json    | 11 ---
 .../addES2015Support_2017-11-01-23-14.json    | 11 ---
 ...e-fixDropdown_states_2017-10-31-16-31.json | 11 ---
 ...button-icon-flexgrow_2017-10-30-21-43.json | 11 ---
 .../button-onMenuClick_2017-10-31-17-19.json  | 11 ---
 ...erCard_Accessibility_2017-10-23-23-32.json | 11 ---
 ...mmandBar-iconOnly5.0_2017-10-31-14-20.json | 11 ---
 ...ontextualmenu-states_2017-10-28-00-33.json | 11 ---
 .../facepile-polish_2017-10-19-20-54.json     | 11 ---
 ...atePicker_3280_today_2017-11-01-20-34.json | 11 ---
 ...ForFocusZonePresnece_2017-11-01-23-59.json | 11 ---
 ...UnifiedMenuFocusRect_2017-10-31-15-13.json | 11 ---
 ...no-SplitButtonInMenu_2017-10-27-00-59.json | 11 ---
 .../persona-sizes_2017-10-31-21-15.json       | 11 ---
 ...slider-ariavaluetext_2017-10-27-23-04.json | 11 ---
 ...tfield-icon-required_2017-10-24-16-24.json | 11 ---
 packages/experiments/CHANGELOG.json           | 26 +++++
 packages/experiments/CHANGELOG.md             | 13 ++-
 packages/experiments/package.json             |  4 +-
 .../jest-serializer-merge-styles/package.json |  2 +-
 packages/merge-styles/CHANGELOG.json          | 14 +++
 packages/merge-styles/CHANGELOG.md            |  9 +-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 96 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 27 +++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/package.json                 |  2 +-
 scripts/package.json                          |  2 +-
 31 files changed, 190 insertions(+), 220 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/experiments-fix_2017-11-01-18-07.json
 delete mode 100644 common/changes/@uifabric/experiments/selectionItemsList_2017-10-19-17-24.json
 delete mode 100644 common/changes/@uifabric/merge-styles/style-to-classname_2017-10-31-23-57.json
 delete mode 100644 common/changes/office-ui-fabric-react/addES2015Support_2017-10-28-00-55.json
 delete mode 100644 common/changes/office-ui-fabric-react/addES2015Support_2017-11-01-23-14.json
 delete mode 100644 common/changes/office-ui-fabric-react/betrue-fixDropdown_states_2017-10-31-16-31.json
 delete mode 100644 common/changes/office-ui-fabric-react/button-icon-flexgrow_2017-10-30-21-43.json
 delete mode 100644 common/changes/office-ui-fabric-react/button-onMenuClick_2017-10-31-17-19.json
 delete mode 100644 common/changes/office-ui-fabric-react/chf-2017-10-hoverCard_Accessibility_2017-10-23-23-32.json
 delete mode 100644 common/changes/office-ui-fabric-react/commandBar-iconOnly5.0_2017-10-31-14-20.json
 delete mode 100644 common/changes/office-ui-fabric-react/contextualmenu-states_2017-10-28-00-33.json
 delete mode 100644 common/changes/office-ui-fabric-react/facepile-polish_2017-10-19-20-54.json
 delete mode 100644 common/changes/office-ui-fabric-react/fpintos-datePicker_3280_today_2017-11-01-20-34.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-GridAddPropToForFocusZonePresnece_2017-11-01-23-59.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-UnifiedMenuFocusRect_2017-10-31-15-13.json
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-SplitButtonInMenu_2017-10-27-00-59.json
 delete mode 100644 common/changes/office-ui-fabric-react/persona-sizes_2017-10-31-21-15.json
 delete mode 100644 common/changes/office-ui-fabric-react/slider-ariavaluetext_2017-10-27-23-04.json
 delete mode 100644 common/changes/office-ui-fabric-react/textfield-icon-required_2017-10-24-16-24.json

diff --git a/common/changes/@uifabric/experiments/experiments-fix_2017-11-01-18-07.json b/common/changes/@uifabric/experiments/experiments-fix_2017-11-01-18-07.json
deleted file mode 100644
index 42fb0edff9447..0000000000000
--- a/common/changes/@uifabric/experiments/experiments-fix_2017-11-01-18-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Fix import that was causing build error",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "a.erich@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/selectionItemsList_2017-10-19-17-24.json b/common/changes/@uifabric/experiments/selectionItemsList_2017-10-19-17-24.json
deleted file mode 100644
index 772440dddbd2f..0000000000000
--- a/common/changes/@uifabric/experiments/selectionItemsList_2017-10-19-17-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Added SelectedItemsList, change ExtendedPicker from extending BasePicker to be new component utilizing SelectedItemsList and FloatingPicker",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "amyngu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/style-to-classname_2017-10-31-23-57.json b/common/changes/@uifabric/merge-styles/style-to-classname_2017-10-31-23-57.json
deleted file mode 100644
index dda1b47176035..0000000000000
--- a/common/changes/@uifabric/merge-styles/style-to-classname_2017-10-31-23-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "When selectors use previously registered class names as values, they are now correctly auto expanded.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "stzh@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/addES2015Support_2017-10-28-00-55.json b/common/changes/office-ui-fabric-react/addES2015Support_2017-10-28-00-55.json
deleted file mode 100644
index 9a893d6cfdb90..0000000000000
--- a/common/changes/office-ui-fabric-react/addES2015Support_2017-10-28-00-55.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Adding ES2015 Module Support",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kymcnutt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/addES2015Support_2017-11-01-23-14.json b/common/changes/office-ui-fabric-react/addES2015Support_2017-11-01-23-14.json
deleted file mode 100644
index e9c6bd5253edf..0000000000000
--- a/common/changes/office-ui-fabric-react/addES2015Support_2017-11-01-23-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Changed es2015 module output to target es5 so that TypeScript downcompiles the code.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kymcnutt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/betrue-fixDropdown_states_2017-10-31-16-31.json b/common/changes/office-ui-fabric-react/betrue-fixDropdown_states_2017-10-31-16-31.json
deleted file mode 100644
index c92b4fd028a27..0000000000000
--- a/common/changes/office-ui-fabric-react/betrue-fixDropdown_states_2017-10-31-16-31.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: Updated caret dropdown colors.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "betrue@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/button-icon-flexgrow_2017-10-30-21-43.json b/common/changes/office-ui-fabric-react/button-icon-flexgrow_2017-10-30-21-43.json
deleted file mode 100644
index 71aed80055cca..0000000000000
--- a/common/changes/office-ui-fabric-react/button-icon-flexgrow_2017-10-30-21-43.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Button: Added flexShrink: 0 to icons in button so long text won't make them shrink",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/button-onMenuClick_2017-10-31-17-19.json b/common/changes/office-ui-fabric-react/button-onMenuClick_2017-10-31-17-19.json
deleted file mode 100644
index ac8fce2dd3391..0000000000000
--- a/common/changes/office-ui-fabric-react/button-onMenuClick_2017-10-31-17-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "BaseButton: onMenuClick to support other actions for menu and split buttons",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/chf-2017-10-hoverCard_Accessibility_2017-10-23-23-32.json b/common/changes/office-ui-fabric-react/chf-2017-10-hoverCard_Accessibility_2017-10-23-23-32.json
deleted file mode 100644
index 79546a4122cac..0000000000000
--- a/common/changes/office-ui-fabric-react/chf-2017-10-hoverCard_Accessibility_2017-10-23-23-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "add accessibility behavior of hover card",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chf@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/commandBar-iconOnly5.0_2017-10-31-14-20.json b/common/changes/office-ui-fabric-react/commandBar-iconOnly5.0_2017-10-31-14-20.json
deleted file mode 100644
index ce4f78bafe863..0000000000000
--- a/common/changes/office-ui-fabric-react/commandBar-iconOnly5.0_2017-10-31-14-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "CommandBar: iconOnly items prop",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-panu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/contextualmenu-states_2017-10-28-00-33.json b/common/changes/office-ui-fabric-react/contextualmenu-states_2017-10-28-00-33.json
deleted file mode 100644
index 0d9ef2ada8cfd..0000000000000
--- a/common/changes/office-ui-fabric-react/contextualmenu-states_2017-10-28-00-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixed contextual menu state colors.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/facepile-polish_2017-10-19-20-54.json b/common/changes/office-ui-fabric-react/facepile-polish_2017-10-19-20-54.json
deleted file mode 100644
index b0ef23730ba93..0000000000000
--- a/common/changes/office-ui-fabric-react/facepile-polish_2017-10-19-20-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Facepile style debugging, includes new FacepileButton",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/fpintos-datePicker_3280_today_2017-11-01-20-34.json b/common/changes/office-ui-fabric-react/fpintos-datePicker_3280_today_2017-11-01-20-34.json
deleted file mode 100644
index 088ba1771c5f8..0000000000000
--- a/common/changes/office-ui-fabric-react/fpintos-datePicker_3280_today_2017-11-01-20-34.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add 'today' to DatePicker properties and forward it to the Calendar.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "fpintos@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-GridAddPropToForFocusZonePresnece_2017-11-01-23-59.json b/common/changes/office-ui-fabric-react/jspurlin-GridAddPropToForFocusZonePresnece_2017-11-01-23-59.json
deleted file mode 100644
index bff0ed24936d9..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-GridAddPropToForFocusZonePresnece_2017-11-01-23-59.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Grid: Add prop to for FocusZone presence",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-UnifiedMenuFocusRect_2017-10-31-15-13.json b/common/changes/office-ui-fabric-react/jspurlin-UnifiedMenuFocusRect_2017-10-31-15-13.json
deleted file mode 100644
index 1f3c8a0c68988..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-UnifiedMenuFocusRect_2017-10-31-15-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Menus: Update so they have one notion of focus (from both hover and keyboard)",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/malozano-SplitButtonInMenu_2017-10-27-00-59.json b/common/changes/office-ui-fabric-react/malozano-SplitButtonInMenu_2017-10-27-00-59.json
deleted file mode 100644
index 2e1c8216a6faf..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-SplitButtonInMenu_2017-10-27-00-59.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Split Button in Menu: add vertical divider component and hook to customize splitbutton in menu div classname",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/persona-sizes_2017-10-31-21-15.json b/common/changes/office-ui-fabric-react/persona-sizes_2017-10-31-21-15.json
deleted file mode 100644
index 272b79b67cd02..0000000000000
--- a/common/changes/office-ui-fabric-react/persona-sizes_2017-10-31-21-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Persona: Changed PersonaSize names from descriptive to numerical. ",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/slider-ariavaluetext_2017-10-27-23-04.json b/common/changes/office-ui-fabric-react/slider-ariavaluetext_2017-10-27-23-04.json
deleted file mode 100644
index 25447744847f2..0000000000000
--- a/common/changes/office-ui-fabric-react/slider-ariavaluetext_2017-10-27-23-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Slider: added `ariaValueText` property for better screen-reader support.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "a.erich@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/textfield-icon-required_2017-10-24-16-24.json b/common/changes/office-ui-fabric-react/textfield-icon-required_2017-10-24-16-24.json
deleted file mode 100644
index ec7083f947ecf..0000000000000
--- a/common/changes/office-ui-fabric-react/textfield-icon-required_2017-10-24-16-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "TextField/DatePicker: The required astrisk is now more correctly positioned.",
-      "packageName": "office-ui-fabric-react",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 32df0586245bc..ee2148806a9bb 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.4.0",
+      "tag": "@uifabric/experiments_v5.4.0",
+      "date": "Thu, 02 Nov 2017 18:20:18 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "d38e848fb2564059b1227df92b3e7916b85a6d74",
+            "comment": "Fix import that was causing build error"
+          }
+        ],
+        "minor": [
+          {
+            "author": "amyngu <31973030+amyngu@users.noreply.github.com>",
+            "commit": "5f56a5cb0576b0e9fa5f5a95ca23be6e13a8a530",
+            "comment": "Added SelectedItemsList, change ExtendedPicker from extending BasePicker to be new component utilizing SelectedItemsList and FloatingPicker"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.17.1 <6.0.0` to `>=5.18.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.3.1",
       "tag": "@uifabric/experiments_v5.3.1",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 5378d0c500adf..0f3ecaad4a278 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Tue, 24 Oct 2017 10:21:08 GMT and should not be manually modified.
+This log was last generated on Thu, 02 Nov 2017 18:20:18 GMT and should not be manually modified.
+
+## 5.4.0
+Thu, 02 Nov 2017 18:20:18 GMT
+
+### Minor changes
+
+- Added SelectedItemsList, change ExtendedPicker from extending BasePicker to be new component utilizing SelectedItemsList and FloatingPicker
+
+### Patches
+
+- Fix import that was causing build error
 
 ## 5.3.1
 Tue, 24 Oct 2017 10:21:08 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 4656aaf382c48..7fac32ac1c58b 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.3.1",
+  "version": "5.4.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.17.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.18.0 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/jest-serializer-merge-styles/package.json b/packages/jest-serializer-merge-styles/package.json
index f0a4ee5348ec0..633120b4f6183 100644
--- a/packages/jest-serializer-merge-styles/package.json
+++ b/packages/jest-serializer-merge-styles/package.json
@@ -24,6 +24,6 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/merge-styles": ">=5.5.0 <6.0.0"
+    "@uifabric/merge-styles": ">=5.5.1 <6.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index 692c9e6185a53..12ff39a11fce2 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.5.1",
+      "tag": "@uifabric/merge-styles_v5.5.1",
+      "date": "Thu, 02 Nov 2017 18:20:18 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "stephenzsy <stephen.zsy@gmail.com>",
+            "commit": "5e58d5a68692b2fcef119444fb52361b51118b1f",
+            "comment": "When selectors use previously registered class names as values, they are now correctly auto expanded."
+          }
+        ]
+      }
+    },
     {
       "version": "5.5.0",
       "tag": "@uifabric/merge-styles_v5.5.0",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index 878c73a127db4..151f2f48eec9e 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Tue, 24 Oct 2017 10:21:08 GMT and should not be manually modified.
+This log was last generated on Thu, 02 Nov 2017 18:20:18 GMT and should not be manually modified.
+
+## 5.5.1
+Thu, 02 Nov 2017 18:20:18 GMT
+
+### Patches
+
+- When selectors use previously registered class names as values, they are now correctly auto expanded.
 
 ## 5.5.0
 Tue, 24 Oct 2017 10:21:08 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index 49cfecc4ce2f0..ecd35bc682fef 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.5.0",
+  "version": "5.5.1",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 3461758481583..d24d654093910 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,102 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.18.0",
+      "tag": "office-ui-fabric-react_v5.18.0",
+      "date": "Thu, 02 Nov 2017 18:20:18 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "KyleMcNutt <mcnuttkyle93@gmail.com>",
+            "commit": "72b103d989212d8c3e7976e6dfc285c17356d9be",
+            "comment": "Adding ES2015 Module Support"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "68e102d1529fb7943b7a0697fdeadd21e34ec2d4",
+            "comment": "BaseButton: onMenuClick to support other actions for menu and split buttons"
+          },
+          {
+            "author": "chaofeng2014 <fengchao199011@hotmail.com>",
+            "commit": "58d527793e44d5b518ac91794e58d17b7d0f39f1",
+            "comment": "add accessibility behavior of hover card"
+          },
+          {
+            "author": "Pablo Núñez <pablonete@gmail.com>",
+            "commit": "e5b10b8912c8be7cb97bffca8e1d1c3446045421",
+            "comment": "CommandBar: iconOnly items prop"
+          },
+          {
+            "author": "Fabio Pintos <fabio.pintos@outlook.com>",
+            "commit": "3409ce164a3d76f4d026e7d4dcc4012b9dbcc623",
+            "comment": "Add 'today' to DatePicker properties and forward it to the Calendar."
+          },
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "1a556bf49b9363c8ca4868c9fa0dac0673634872",
+            "comment": "Grid: Add prop to for FocusZone presence"
+          },
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "83c12463a1a1bc06c98d50662eff239e2984707c",
+            "comment": "Slider: added `ariaValueText` property for better screen-reader support."
+          }
+        ],
+        "patch": [
+          {
+            "author": "KyleMcNutt <mcnuttkyle93@gmail.com>",
+            "commit": "72b103d989212d8c3e7976e6dfc285c17356d9be",
+            "comment": "Changed es2015 module output to target es5 so that TypeScript downcompiles the code."
+          },
+          {
+            "author": "Ben Truelove <betrue@microsoft.com>",
+            "commit": "b822bed6c1464675ad12bdfe6340fae98b08874a",
+            "comment": "Dropdown: Updated caret dropdown colors."
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "cf1faf49a39564c5d58db44fefab6dfe7f5f3416",
+            "comment": "Button: Added flexShrink: 0 to icons in button so long text won't make them shrink"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "c0b9c8bb36adde77f83d7c557a96b690d894f89c",
+            "comment": "Fixed contextual menu state colors."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "5a67336deaa3d0d788312467c93771a4fadc7798",
+            "comment": "Facepile style debugging, includes new FacepileButton"
+          },
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "b1f263aff594d1926081be2f67cd54ad64296b89",
+            "comment": "Menus: Update so they have one notion of focus (from both hover and keyboard)"
+          },
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "eba1cc63e2c3474031a51e0f849936402c21e7dd",
+            "comment": "Split Button in Menu: add vertical divider component and hook to customize splitbutton in menu div classname"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "172271139a07fb9626813fda43fa16a935022c3c",
+            "comment": "Persona: Changed PersonaSize names from descriptive to numerical. "
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "66134e9ea7352c1bdd46d16508a5dfa2ea38f8a2",
+            "comment": "TextField/DatePicker: The required astrisk is now more correctly positioned."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.5.0 <6.0.0` to `>=5.5.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.17.1",
       "tag": "office-ui-fabric-react_v5.17.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index afb79ce469365..6302d7b41c6b2 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,31 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 31 Oct 2017 10:22:25 GMT and should not be manually modified.
+This log was last generated on Thu, 02 Nov 2017 18:20:18 GMT and should not be manually modified.
+
+## 5.18.0
+Thu, 02 Nov 2017 18:20:18 GMT
+
+### Minor changes
+
+- Adding ES2015 Module Support
+- BaseButton: onMenuClick to support other actions for menu and split buttons
+- add accessibility behavior of hover card
+- CommandBar: iconOnly items prop
+- Add 'today' to DatePicker properties and forward it to the Calendar.
+- Grid: Add prop to for FocusZone presence
+- Slider: added `ariaValueText` property for better screen-reader support.
+
+### Patches
+
+- Changed es2015 module output to target es5 so that TypeScript downcompiles the code.
+- Dropdown: Updated caret dropdown colors.
+- Button: Added flexShrink: 0 to icons in button so long text won't make them shrink
+- Fixed contextual menu state colors.
+- Facepile style debugging, includes new FacepileButton
+- Menus: Update so they have one notion of focus (from both hover and keyboard)
+- Split Button in Menu: add vertical divider component and hook to customize splitbutton in menu div classname
+- Persona: Changed PersonaSize names from descriptive to numerical. 
+- TextField/DatePicker: The required astrisk is now more correctly positioned.
 
 ## 5.17.1
 Tue, 31 Oct 2017 10:22:25 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 9d678a69cc01e..b48c1790672e5 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.17.1",
+  "version": "5.18.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -46,7 +46,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.5.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.5.1 <6.0.0",
     "@uifabric/styling": ">=5.6.1 <6.0.0",
     "@uifabric/utilities": ">=5.3.0 <6.0.0",
     "prop-types": "^15.5.10",
diff --git a/packages/styling/package.json b/packages/styling/package.json
index a8ca4d7692665..6d6d4d3f9af11 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -22,7 +22,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/utilities": ">=5.3.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.5.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.5.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/scripts/package.json b/scripts/package.json
index 41aeb58919e75..e781574d58ee9 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -10,7 +10,7 @@
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.7.5",
     "@microsoft/loader-load-themed-styles": "^1.6.0",
-    "@uifabric/merge-styles": ">=5.5.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.5.1 <6.0.0",
     "autoprefixer": "^7.1.5",
     "awesome-typescript-loader": "^3.2.3",
     "bundlesize": "^0.15.2",

From e97a8c36e74abd3d487f2ae8b2faafde009b2d67 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Thu, 2 Nov 2017 13:15:08 -0700
Subject: [PATCH 0969/1641] Overflow set vertical (#3287)

* Overflow vertical updates

* Cleanup and adding tests

* Removed consolelog

* change file

* change to boolean vertical, and add new example

* fixed story
---
 .../src/stories/OverflowSet.stories.tsx       | 45 +++++++++-
 ...overflowSet-vertical_2017-11-01-20-16.json | 11 +++
 .../OverflowSet/OverflowSet.Props.ts          |  6 ++
 .../components/OverflowSet/OverflowSet.scss   |  4 +
 .../components/OverflowSet/OverflowSet.tsx    | 23 ++++-
 .../OverflowSet/OverflowSetPage.tsx           |  5 ++
 .../examples/OverflowSet.Basic.Example.tsx    |  3 +-
 .../examples/OverflowSet.Custom.Example.tsx   |  3 +-
 .../examples/OverflowSet.Vertical.Example.tsx | 90 +++++++++++++++++++
 9 files changed, 182 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/overflowSet-vertical_2017-11-01-20-16.json
 create mode 100644 packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Vertical.Example.tsx

diff --git a/apps/vr-tests/src/stories/OverflowSet.stories.tsx b/apps/vr-tests/src/stories/OverflowSet.stories.tsx
index 116ee7f56ae57..17af5ef8deb40 100644
--- a/apps/vr-tests/src/stories/OverflowSet.stories.tsx
+++ b/apps/vr-tests/src/stories/OverflowSet.stories.tsx
@@ -9,7 +9,6 @@ const onRenderItem = (item) => item.name;
 const onRenderOverflowButton = (overflowItems) => {
   return (
     <IconButton
-      iconProps={ { iconName: 'More' } }
       menuProps={ { items: overflowItems! } }
     />
   );
@@ -59,4 +58,48 @@ storiesOf('OverflowSet', module)
       onRenderOverflowButton={ onRenderOverflowButton }
       onRenderItem={ onRenderItem }
     />
+  ));
+
+storiesOf('OverflowSet varient', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  )).add('Vertical Direction', () => (
+    <OverflowSet
+      vertical
+      items={ [
+        {
+          key: 'item1',
+          name: 'Link 1'
+        },
+        {
+          key: 'item2',
+          name: 'Link 2'
+        },
+        {
+          key: 'item3',
+          name: 'Link 3'
+        }
+      ] }
+      overflowItems={ [
+        {
+          key: 'item4',
+          name: 'Overflow Link 1'
+        },
+        {
+          key: 'item5',
+          name: 'Overflow Link 2'
+        }
+      ]
+      }
+      onRenderOverflowButton={ onRenderOverflowButton }
+      onRenderItem={ onRenderItem }
+    />
   ));
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/overflowSet-vertical_2017-11-01-20-16.json b/common/changes/office-ui-fabric-react/overflowSet-vertical_2017-11-01-20-16.json
new file mode 100644
index 0000000000000..8833c744fe501
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/overflowSet-vertical_2017-11-01-20-16.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "OverflowSet: Support vertical orientation",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.Props.ts b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.Props.ts
index 6ee14580b6f15..8a1ba3d6d5baa 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.Props.ts
@@ -26,6 +26,12 @@ export interface IOverflowSetProps extends React.Props<OverflowSet> {
   */
   items?: IOverflowSetItemProps[];
 
+  /**
+   * Change item layout direction to vertical/stacked
+   * @default false
+  */
+  vertical?: boolean;
+
   /**
    * An array of items to be passed to overflow contextual menu
   */
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.scss b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.scss
index 43aa0b1a386bc..834eee5e41aa9 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.scss
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.scss
@@ -6,6 +6,10 @@
   flex-wrap: nowrap;
 }
 
+.rootVertical {
+  flex-direction: column;
+}
+
 .item {
   flex-shrink: 0;
   display: inherit;
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
index d94f24b25d054..609b1419c47cd 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
@@ -4,6 +4,7 @@ import {
   autobind,
   BaseComponent
 } from '../../Utilities';
+import { mergeStyles } from '../../Styling';
 import { IOverflowSet, IOverflowSetProps } from './OverflowSet.Props';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 
@@ -21,6 +22,7 @@ export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> implements
       onRenderOverflowButton,
       className,
       focusZoneProps,
+      vertical = false,
       role = 'menubar'
     } = this.props;
 
@@ -28,12 +30,17 @@ export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> implements
       <FocusZone
         { ...focusZoneProps }
         componentRef={ this._resolveRef('_focusZone') }
-        className={ css('ms-OverflowSet', styles.root, className) }
-        direction={ FocusZoneDirection.horizontal }
+        className={ mergeStyles(
+          'ms-OverflowSet',
+          styles.root,
+          vertical && styles.rootVertical,
+          className
+        ) }
+        direction={ vertical ? FocusZoneDirection.vertical : FocusZoneDirection.horizontal }
         role={ role }
       >
         { items && this._onRenderItems(items) }
-        { overflowItems && overflowItems.length > 0 && onRenderOverflowButton(overflowItems) }
+        { overflowItems && overflowItems.length > 0 && this._onRenderOverflowButtonWrapper(overflowItems) }
       </FocusZone>
     );
   }
@@ -59,4 +66,14 @@ export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> implements
     });
   }
 
+  @autobind
+  private _onRenderOverflowButtonWrapper(items: any[]): JSX.Element {
+    let wrapperDivProps: React.HTMLProps<HTMLDivElement> = { className: css('ms-OverflowSet-overflowButton', styles.item) };
+    return (
+      <div {...wrapperDivProps}>
+        { this.props.onRenderOverflowButton(items) }
+      </div>
+    );
+  }
+
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSetPage.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSetPage.tsx
index e58fca2f00be0..af2ce310077f5 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSetPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSetPage.tsx
@@ -7,11 +7,13 @@ import {
 } from '@uifabric/example-app-base';
 import { OverflowSetCustomExample } from './examples/OverflowSet.Custom.Example';
 import { OverflowSetBasicExample } from './examples/OverflowSet.Basic.Example';
+import { OverflowSetVerticalExample } from './examples/OverflowSet.Vertical.Example';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { OverflowSetStatus } from './OverflowSet.checklist';
 
 const OverflowSetCustomExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx') as string;
 const OverflowSetBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Basic.Example.tsx') as string;
+const OverflowSetVerticalExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Vertical.Example.tsx') as string;
 
 export class OverflowSetPage extends React.Component<any, any> {
   public render() {
@@ -32,6 +34,9 @@ export class OverflowSetPage extends React.Component<any, any> {
             <ExampleCard title='OverflowSet Basic Example' code={ OverflowSetBasicExampleCode }>
               <OverflowSetBasicExample />
             </ExampleCard>
+            <ExampleCard title='OverflowSet Vertical Example' code={ OverflowSetVerticalExampleCode }>
+              <OverflowSetVerticalExample />
+            </ExampleCard>
             <ExampleCard title='OverflowSet Custom Example' code={ OverflowSetCustomExampleCode }>
               <OverflowSetCustomExample />
             </ExampleCard>
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Basic.Example.tsx
index 4eaef3e1be1f5..0e6fdeacb756f 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Basic.Example.tsx
@@ -68,8 +68,7 @@ export class OverflowSetBasicExample extends BaseComponent<any, any> {
     return (
       <IconButton
         className={ css(styles.overflowButton) }
-        iconProps={ { iconName: 'More' } }
-        menuIconProps={ undefined }
+        menuIconProps={ { iconName: 'More' } }
         menuProps={ { items: overflowItems! } }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx
index 9f008d0a9f786..ce5992e638ca1 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx
@@ -136,8 +136,7 @@ export class OverflowSetCustomExample extends BaseComponent<any, any> {
     return (
       <DefaultButton
         className={ css(styles.overflowButton) }
-        iconProps={ { iconName: 'More' } }
-        menuIconProps={ undefined }
+        menuIconProps={ { iconName: 'More' } }
         menuProps={ { items: overflowItems! } }
       />
     );
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Vertical.Example.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Vertical.Example.tsx
new file mode 100644
index 0000000000000..e46f7ec8d6610
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Vertical.Example.tsx
@@ -0,0 +1,90 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+import { BaseComponent, css } from 'office-ui-fabric-react/lib/Utilities';
+import { IconButton } from 'office-ui-fabric-react/lib/Button';
+import { CommandBarButton } from 'office-ui-fabric-react/lib/Button';
+import { TooltipHost } from 'office-ui-fabric-react/lib/Tooltip';
+import { DirectionalHint } from 'office-ui-fabric-react/lib/common/DirectionalHint';
+import {
+  IOverflowSetItemProps,
+  OverflowSet
+} from 'office-ui-fabric-react/lib/OverflowSet';
+
+import * as stylesImport from './OverflowSet.Example.scss';
+const styles: any = stylesImport;
+
+export class OverflowSetVerticalExample extends BaseComponent<any, any> {
+
+  public render() {
+    return (
+      <OverflowSet
+        vertical
+        items={ [
+          {
+            key: 'item1',
+            icon: 'Add',
+            name: 'Link 1',
+            ariaLabel: 'New. Use left and right arrow keys to navigate',
+            onClick: () => { return; },
+          },
+          {
+            key: 'item2',
+            icon: 'Upload',
+            name: 'Link 2',
+            onClick: () => { return; },
+          },
+          {
+            key: 'item3',
+            icon: 'Share',
+            name: 'Link 3',
+            onClick: () => { return; }
+          }
+        ] }
+        overflowItems={ [
+          {
+            key: 'item4',
+            icon: 'Mail',
+            name: 'Overflow Link 1',
+            onClick: () => { return; }
+          },
+          {
+            key: 'item5',
+            icon: 'Calendar',
+            name: 'Overflow Link 2',
+            onClick: () => { return; }
+          }
+        ]
+        }
+        onRenderOverflowButton={ this._onRenderOverflowButton }
+        onRenderItem={ this._onRenderItem }
+      />
+    );
+  }
+
+  private _onRenderItem(item: IOverflowSetItemProps): JSX.Element {
+    return (
+
+      <TooltipHost
+        content={ item.name }
+        calloutProps={ { directionalHint: DirectionalHint.rightCenter, beakWidth: 12 } }
+      >
+        <CommandBarButton
+          styles={ { root: { padding: '10px' } } }
+          iconProps={ { iconName: item.icon } }
+          onClick={ item.onClick }
+        />
+      </TooltipHost>
+    );
+  }
+
+  private _onRenderOverflowButton(overflowItems: any[] | undefined): JSX.Element {
+    return (
+      <CommandBarButton
+        styles={ { root: { padding: '10px' }, menuIcon: { fontSize: '16px' } } }
+        menuIconProps={ { iconName: 'More' } }
+        menuProps={ { items: overflowItems! } }
+      />
+    );
+  }
+}
\ No newline at end of file

From f20fb3eca8d4f9e369e9f93e587c2912bbb11ac8 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 2 Nov 2017 17:29:46 -0700
Subject: [PATCH 0970/1641] SpinButton: Allow custom styling for the icon when
 in disabled state (#3302)

* Allow the spin button icon to be styled when it is disabled

* Ruch change
---
 ...button-disabled-icon_2017-11-02-22-48.json | 11 ++++++++++
 .../components/SpinButton/SpinButton.Props.ts |  5 +++++
 .../SpinButton/SpinButton.classNames.ts       |  1 +
 .../SpinButton/SpinButton.styles.ts           |  7 ++++++-
 .../components/SpinButton/SpinButtonPage.tsx  | 11 +++++++++-
 ...inButton.BasicWithIconDisabled.Example.tsx | 20 +++++++++++++++++++
 6 files changed, 53 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/spinbutton-disabled-icon_2017-11-02-22-48.json
 create mode 100644 packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIconDisabled.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/spinbutton-disabled-icon_2017-11-02-22-48.json b/common/changes/office-ui-fabric-react/spinbutton-disabled-icon_2017-11-02-22-48.json
new file mode 100644
index 0000000000000..a13251b8c06ac
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/spinbutton-disabled-icon_2017-11-02-22-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SpinButton: Allow for styling of the icon when the component is disabled",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts
index 9073df0870d4c..f00467988a911 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts
@@ -195,6 +195,11 @@ export interface ISpinButtonStyles {
    */
   icon: IStyle;
 
+  /**
+ * Style for the icon.
+ */
+  iconDisabled: IStyle;
+
   /**
    * Style for the label text
    */
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts
index cdba7dff99c86..1986ae5dda789 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts
@@ -31,6 +31,7 @@ export const getClassNames = memoizeFunction((
     ),
     icon: mergeStyles(
       styles.icon,
+      disabled && styles.iconDisabled
     ),
     label: mergeStyles(
       styles.label,
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
index aa4ec7756bf1e..e3238456fd98b 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
@@ -120,7 +120,7 @@ export const getStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: Partial<ISpinButtonStyles>
 ): ISpinButtonStyles => {
-  const { fonts, palette } = theme;
+  const { fonts, palette, semanticColors } = theme;
 
   const SpinButtonRootBorderColor = palette.neutralTertiaryAlt;
   const SpinButtonRootBorderColorHovered = palette.neutralSecondary;
@@ -131,6 +131,8 @@ export const getStyles = memoizeFunction((
   const SpinButtonInputTextColorSelected = palette.white;
   const SpinButtonInputBackgroundColorSelected = palette.themePrimary;
 
+  const SpinButtonIconDisabledColor = semanticColors.disabledText;
+
   const defaultStyles: ISpinButtonStyles = {
     root: {
       outline: 'none',
@@ -167,6 +169,9 @@ export const getStyles = memoizeFunction((
 
       fontSize: '20px'
     },
+    iconDisabled: {
+      color: SpinButtonIconDisabledColor
+    },
     label: {
       pointerEvents: 'none',
       paddingTop: '2px',
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
index a96c4de72605e..34ad61c4cd1a5 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
@@ -9,6 +9,7 @@ import { SpinButtonBasicExample } from './examples/SpinButton.Basic.Example';
 import { SpinButtonBasicDisabledExample } from './examples/SpinButton.BasicDisabled.Example';
 import { SpinButtonStatefulExample } from './examples/SpinButton.Stateful.Example';
 import { SpinButtonBasicWithIconExample } from './examples/SpinButton.BasicWithIcon.Example';
+import { SpinButtonBasicWithIconDisabledExample } from './examples/SpinButton.BasicWithIconDisabled.Example';
 import { SpinButtonBasicWithEndPositionExample } from './examples/SpinButton.BasicWithEndPosition.Example';
 import { SpinButtonCustomStyledExample } from './examples/SpinButton.CustomStyled.Example';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
@@ -17,7 +18,9 @@ import { SpinButtonStatus } from './SpinButton.checklist';
 const SpinButtonBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx') as string;
 const SpinButtonBasicDisabledExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicDisabled.Example.tsx') as string;
 const SpinButtonStatefulExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx') as string;
-const SpinButtonBasicWithIconExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx') as string;
+const SpinButtonBasicWithIconExampleCode = require
+  ('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIcon.Example.tsx') as string;
+const SpinButtonBasicWithIconDisabledExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIconDisabled.Example.tsx') as string;
 const SpinButtonBasicWithEndPositionExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithEndPosition.Example.tsx') as string;
 const SpinButtonCustomStyledExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.CustomStyled.Example.tsx') as string;
 
@@ -53,6 +56,12 @@ export class SpinButtonPage extends React.Component<IComponentDemoPageProps, {}>
             >
               <SpinButtonBasicWithIconExample />
             </ExampleCard>
+            <ExampleCard
+              title={ 'Basic SpinButton With Icon Disabled' }
+              code={ SpinButtonBasicWithIconDisabledExampleCode }
+            >
+              <SpinButtonBasicWithIconDisabledExample />
+            </ExampleCard>
             <ExampleCard
               title={ 'Basic SpinButton With Icon and Positioned at the End' }
               code={ SpinButtonBasicWithEndPositionExampleCode }
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIconDisabled.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIconDisabled.Example.tsx
new file mode 100644
index 0000000000000..cdefb7c4640e3
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.BasicWithIconDisabled.Example.tsx
@@ -0,0 +1,20 @@
+import * as React from 'react';
+import { SpinButton } from 'office-ui-fabric-react/lib/SpinButton';
+
+export class SpinButtonBasicWithIconDisabledExample extends React.Component<any, any> {
+  public render() {
+    return (
+      <div style={ { width: '400px' } }>
+        <SpinButton
+          defaultValue='0'
+          disabled={ true }
+          iconProps={ { iconName: 'IncreaseIndentLegacy' } }
+          label={ 'Basic SpinButton:' }
+          min={ 0 }
+          max={ 100 }
+          step={ 1 }
+        />
+      </div>
+    );
+  }
+}

From ff6066cbba59fc67313c68747e63dd53afe3c1f3 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 3 Nov 2017 14:09:56 +0000
Subject: [PATCH 0971/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...overflowSet-vertical_2017-11-01-20-16.json | 11 ----------
 ...button-disabled-icon_2017-11-02-22-48.json | 11 ----------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 21 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 13 +++++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 11 files changed, 40 insertions(+), 30 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/overflowSet-vertical_2017-11-01-20-16.json
 delete mode 100644 common/changes/office-ui-fabric-react/spinbutton-disabled-icon_2017-11-02-22-48.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 1b1e3324d0da0..49fe1682f3874 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.17.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.19.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 472e201b050f4..17e3935c7a44b 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.17.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.19.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 86caa1e097d38..3a7317c55601e 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.17.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.19.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 5a70c7f121d0a..177217c499212 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.17.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.19.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 416b9e22bafd1..ded2e8ac93f29 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.17.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.19.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/overflowSet-vertical_2017-11-01-20-16.json b/common/changes/office-ui-fabric-react/overflowSet-vertical_2017-11-01-20-16.json
deleted file mode 100644
index 8833c744fe501..0000000000000
--- a/common/changes/office-ui-fabric-react/overflowSet-vertical_2017-11-01-20-16.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "OverflowSet: Support vertical orientation",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/spinbutton-disabled-icon_2017-11-02-22-48.json b/common/changes/office-ui-fabric-react/spinbutton-disabled-icon_2017-11-02-22-48.json
deleted file mode 100644
index a13251b8c06ac..0000000000000
--- a/common/changes/office-ui-fabric-react/spinbutton-disabled-icon_2017-11-02-22-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SpinButton: Allow for styling of the icon when the component is disabled",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 7fac32ac1c58b..6e2f584072bcb 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.18.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.19.0 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index d24d654093910..68e1ff1433d8f 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,27 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.19.0",
+      "tag": "office-ui-fabric-react_v5.19.0",
+      "date": "Fri, 03 Nov 2017 14:09:56 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "e97a8c36e74abd3d487f2ae8b2faafde009b2d67",
+            "comment": "OverflowSet: Support vertical orientation"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "f20fb3eca8d4f9e369e9f93e587c2912bbb11ac8",
+            "comment": "SpinButton: Allow for styling of the icon when the component is disabled"
+          }
+        ]
+      }
+    },
     {
       "version": "5.18.0",
       "tag": "office-ui-fabric-react_v5.18.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 6302d7b41c6b2..9985021edda91 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 02 Nov 2017 18:20:18 GMT and should not be manually modified.
+This log was last generated on Fri, 03 Nov 2017 14:09:56 GMT and should not be manually modified.
+
+## 5.19.0
+Fri, 03 Nov 2017 14:09:56 GMT
+
+### Minor changes
+
+- OverflowSet: Support vertical orientation
+
+### Patches
+
+- SpinButton: Allow for styling of the icon when the component is disabled
 
 ## 5.18.0
 Thu, 02 Nov 2017 18:20:18 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index b48c1790672e5..ec2bea7138e13 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.18.0",
+  "version": "5.19.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From fbc91124227072ddeda35020e0c3f9e442ad5e12 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 3 Nov 2017 07:45:56 -0700
Subject: [PATCH 0972/1641] Fix amd import in ExpandingCard (#3303)

* fix import.

* fixing amd import.
---
 .../fix-amd_2017-11-03-14-43.json                     | 11 +++++++++++
 .../src/components/HoverCard/ExpandingCard.tsx        |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-amd_2017-11-03-14-43.json

diff --git a/common/changes/office-ui-fabric-react/fix-amd_2017-11-03-14-43.json b/common/changes/office-ui-fabric-react/fix-amd_2017-11-03-14-43.json
new file mode 100644
index 0000000000000..8474b0a579eea
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-amd_2017-11-03-14-43.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "HoverCard: fixing an import to be AMD compliant.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
index d54435d1ec90d..75d14f968d8d7 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
@@ -12,7 +12,7 @@ import { IExpandingCardProps, IExpandingCardStyles, ExpandingCardMode } from './
 import { Callout, ICallout } from '../../Callout';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { AnimationStyles, mergeStyles } from '../../Styling';
-import { FocusTrapZone } from '../FocusTrapZone';
+import { FocusTrapZone } from '../../FocusTrapZone';
 import { getStyles } from './ExpandingCard.styles';
 
 export interface IExpandingCardState {

From 5d816416e75063a88919e4d7fbdd01f3a6fa7020 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Fri, 3 Nov 2017 07:48:01 -0700
Subject: [PATCH 0973/1641] Persona: Polish to match toolkit (#3291)

* Update Persona text font sizes

* Render size12 persona presence

* Size12 is really size10

* Css to match toolkit

* Added change file

* Turns out size24 really did need size32

* Checked with design, tertiary text didn't need padding

* Tweaked padding and borders to match toolkit

* Presence icon resizing

* Presence positioning

* Sass cleanup

* Best practices use new sizing

* Examples should have presence
---
 apps/vr-tests/src/stories/Persona.stories.tsx |   2 +-
 .../persona-polish_2017-11-01-22-23.json      |  11 ++
 .../src/components/Persona/Persona.Props.ts   |   4 +-
 .../src/components/Persona/Persona.scss       | 176 ++++++++++--------
 .../src/components/Persona/Persona.tsx        |   2 +-
 .../src/components/Persona/PersonaCoin.tsx    |  19 +-
 .../src/components/Persona/PersonaConsts.ts   |   4 +-
 .../src/components/Persona/PersonaPage.tsx    |   8 +-
 .../examples/Persona.Basic.Example.tsx        |  14 +-
 9 files changed, 144 insertions(+), 96 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/persona-polish_2017-11-01-22-23.json

diff --git a/apps/vr-tests/src/stories/Persona.stories.tsx b/apps/vr-tests/src/stories/Persona.stories.tsx
index f6cc8081b3cd4..b000971f00106 100644
--- a/apps/vr-tests/src/stories/Persona.stories.tsx
+++ b/apps/vr-tests/src/stories/Persona.stories.tsx
@@ -30,7 +30,7 @@ storiesOf('Persona', module)
   .add('Tiny', () => (
     <Persona
       { ...examplePersona }
-      size={ PersonaSize.size12 }
+      size={ PersonaSize.size10 }
       presence={ PersonaPresence.offline }
     />
   )).add('Extra extra small', () => (
diff --git a/common/changes/office-ui-fabric-react/persona-polish_2017-11-01-22-23.json b/common/changes/office-ui-fabric-react/persona-polish_2017-11-01-22-23.json
new file mode 100644
index 0000000000000..bcf556c719e19
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/persona-polish_2017-11-01-22-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Persona: Renamed Persona size12 to Persona size10. Polished style to reflect the toolkit.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts b/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
index 733437a8330a0..40825044261f4 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
@@ -132,7 +132,7 @@ export interface IPersonaProps extends React.HTMLAttributes<Persona> {
 
 export enum PersonaSize {
   /**
-   * tiny size has been deprecated in favor of standardized numeric sizing. Use size12 instead.
+   * tiny size has been deprecated in favor of standardized numeric sizing. Use size10 instead.
    * @deprecated
    */
   tiny = 0,
@@ -169,7 +169,7 @@ export enum PersonaSize {
   extraLarge = 6,
   size28 = 7,
   size16 = 8,
-  size12 = 9,
+  size10 = 9,
   size24 = 10,
   size32 = 11,
   size40 = 12,
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
index 581a3e7359af8..bc54e1b456a76 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
@@ -43,7 +43,7 @@ $ms-color-presence-busy-stripe-dark:   #D00E0D;
 $ms-color-presence-busy-average:       #D93B3B;
 
 // Persona Sizes
-$ms-Persona-size12:  30px;
+$ms-Persona-size10:  20px;
 $ms-Persona-size16:  16px;
 $ms-Persona-size24:  24px;
 $ms-Persona-size28:  28px;
@@ -53,16 +53,13 @@ $ms-Persona-size48:  48px;
 $ms-Persona-size72:  72px;
 $ms-Persona-size100: 100px;
 
-// Details Spacing
-$ms-Persona-imageDetailsSmSpace: 8px;
-$ms-Persona-imageDetailsLgSpace: 12px;
-$ms-Persona-imageDetailsXlSpace: 20px;
-
 // Presence Sizes
-$ms-Persona-presenceSizeXxs: 8px;
-$ms-Persona-presenceSizeMd: 12px;
-$ms-Persona-presenceSizeLg: 20px;
-$ms-Persona-presenceSizeXl: 28px;
+$ms-Persona-presenceSize6: 6px;
+$ms-Persona-presenceSize8: 8px;
+$ms-Persona-presenceSize12: 12px;
+$ms-Persona-presenceSize20: 20px;
+$ms-Persona-presenceSize28: 28px;
+$ms-Persona-presenceBorder: 2px;
 
 .root {
   @include ms-normalize;
@@ -191,13 +188,13 @@ $ms-Persona-presenceSizeXl: 28px;
 .presence {
   background-color: $ms-color-presence-available;
   position: absolute;
-  height: $ms-Persona-presenceSizeMd;
-  width: $ms-Persona-presenceSizeMd;
+  height: $ms-Persona-presenceSize12;
+  width: $ms-Persona-presenceSize12;
   border-radius: 50%;
   top: auto;
-  @include ms-right(0px);
-  bottom: -1px;
-  border: 2px solid $ms-color-white;
+  @include ms-right(-$ms-Persona-presenceBorder);
+  bottom: -$ms-Persona-presenceBorder;
+  border: $ms-Persona-presenceBorder solid $ms-color-white;
   text-align: center;
   box-sizing: content-box;
   // Setting -ms-high-contrast-adjust to none Overrides the default behaviors of high contrast more in the Edge browser.
@@ -212,8 +209,8 @@ $ms-Persona-presenceSizeXl: 28px;
 
   .presenceIcon {
     color: $ms-color-white;
-    font-size: 8px;
-    line-height: $ms-Persona-presenceSizeMd;
+    font-size: 6px;
+    line-height: $ms-Persona-presenceSize12;
     vertical-align: top;
 
     @include high-contrast {
@@ -223,7 +220,7 @@ $ms-Persona-presenceSizeXl: 28px;
 }
 
 .details {
-  @include padding(0, 24px, 0, 12px);
+  @include padding(0, 24px, 0, 16px);
   min-width: 0;
   width: 100%;
   @include text-align(left);
@@ -261,14 +258,14 @@ $ms-Persona-presenceSizeXl: 28px;
 }
 
 
-//== Modifier: Tiny Persona
+//== Modifier: Size 10 Persona
 //
-.root.rootIsSize12 {
-  height: $ms-Persona-size12;
-  min-width: $ms-Persona-size12;
+.root.rootIsSize10 {
+  height: $ms-Persona-size10;
+  min-width: $ms-Persona-size10;
 }
 
-.rootIsSize12{
+.rootIsSize10{
   .imageArea {
     overflow: visible;
     background: transparent;
@@ -278,23 +275,29 @@ $ms-Persona-presenceSizeXl: 28px;
 
   .presence {
     @include ms-right(auto);
-    top: 10px;
+    top: 7px;
     @include ms-left(0);
     border: 0;
+    height: $ms-Persona-presenceSize8;
+    width: $ms-Persona-presenceSize8;
 
     @include high-contrast {
       top: 9px;
       border: 1px solid WindowText;
     }
+
+    .presenceIcon {
+      display: none;
+    }
   }
 
   .details {
-    @include ms-padding-left(20px);
+    @include ms-padding-left(17px);
   }
 
   .primaryText {
-    font-size: $ms-font-size-m;
-    line-height: $ms-Persona-size12;
+    font-size: $ms-font-size-s;
+    line-height: $ms-Persona-size10;
   }
 
   .secondaryText {
@@ -302,12 +305,19 @@ $ms-Persona-presenceSizeXl: 28px;
   }
 }
 
+.size10NoPresenceIcon {
+  font-size: 10px;
+  position: absolute;
+  top: 5px;
+  @include ms-right(auto);
+  @include ms-left(0);
+}
 
-//== Modifier: Tiny Persona with read only state
+//== Modifier: Size 10 Persona with read only state
 //
 // This variant includes a semicolon, and is
 // most often presented within a People Picker.
-.root.rootIsSize12.rootIsReadonly {
+.root.rootIsSize10.rootIsReadonly {
   padding: 0;
   background-color: transparent;
 
@@ -316,11 +326,11 @@ $ms-Persona-presenceSizeXl: 28px;
   }
 }
 
-//== Modifier: 16px Persona
+//== Modifier: Size 16 Persona
 //
 .root.rootIsSize16 {
-  height: $ms-Persona-size16;
-  min-width: $ms-Persona-size16;
+  height: $ms-Persona-size16 + $ms-Persona-presenceBorder;
+  min-width: $ms-Persona-size16  + $ms-Persona-presenceBorder;
   overflow: hidden;
 }
 
@@ -347,14 +357,13 @@ $ms-Persona-presenceSizeXl: 28px;
   }
 
   .presence {
-    height: $ms-Persona-presenceSizeXxs;
-    width: $ms-Persona-presenceSizeXxs;
-    border: 2px solid $ms-color-white;
+    height: $ms-Persona-presenceSize6;
+    width: $ms-Persona-presenceSize6;
+    border-width: 1.5px;
   }
 
   .presenceIcon {
-    font-size: 6px;
-    line-height: 9px;
+    display: none;
   }
 
   .primaryText {
@@ -367,11 +376,11 @@ $ms-Persona-presenceSizeXl: 28px;
   }
 }
 
-//== Modifier: Extra Small Persona
+//== Modifier: Size 24 Persona
 //
 .root.rootIsSize24 {
-  height: $ms-Persona-size32;
-  min-width: $ms-Persona-size32;
+  height: $ms-Persona-size24 + $ms-Persona-presenceBorder;
+  min-width: $ms-Persona-size24 + $ms-Persona-presenceBorder;
 }
 
 .rootIsSize24 {
@@ -393,10 +402,8 @@ $ms-Persona-presenceSizeXl: 28px;
   }
 
   .presence {
-    height: $ms-Persona-presenceSizeXxs;
-    width: $ms-Persona-presenceSizeXxs;
-    border: 2px solid $ms-color-white;
-    top: 18px;
+    height: $ms-Persona-presenceSize8;
+    width: $ms-Persona-presenceSize8;
 
     &:after {
       display: none;
@@ -408,7 +415,7 @@ $ms-Persona-presenceSizeXl: 28px;
   }
 
   .details {
-    padding: 0 8px;
+    padding: 0 12px;
   }
 
   .primaryText {
@@ -433,11 +440,11 @@ $ms-Persona-presenceSizeXl: 28px;
 }
 
 
-//== Modifier: 28px Persona
+//== Modifier: Size 28 Persona
 //
 .root.rootIsSize28 {
-  height: $ms-Persona-size28;
-  min-width: $ms-Persona-size28;
+  height: $ms-Persona-size28 + $ms-Persona-presenceBorder;
+  min-width: $ms-Persona-size28 + $ms-Persona-presenceBorder;
   overflow: hidden;
 }
 
@@ -460,10 +467,8 @@ $ms-Persona-presenceSizeXl: 28px;
   }
 
   .presence {
-    height: $ms-Persona-presenceSizeXxs;
-    width: $ms-Persona-presenceSizeXxs;
-    border: 2px solid $ms-color-white;
-    top: 18px;
+    height: $ms-Persona-presenceSize8;
+    width: $ms-Persona-presenceSize8;
 
     &:after {
       display: none;
@@ -475,7 +480,7 @@ $ms-Persona-presenceSizeXl: 28px;
   }
 
   .details {
-    padding: 0 8px;
+    padding: 0 12px;
   }
 
   .primaryText {
@@ -500,11 +505,11 @@ $ms-Persona-presenceSizeXl: 28px;
 }
 
 
-//== Modifier: Extra Small Persona
+//== Modifier: Size 32 Persona
 //
 .root.rootIsSize32 {
-  height: $ms-Persona-size32;
-  min-width: $ms-Persona-size32;
+  height: $ms-Persona-size32 + $ms-Persona-presenceBorder;
+  min-width: $ms-Persona-size32 + $ms-Persona-presenceBorder;
 }
 
 .rootIsSize32 {
@@ -525,8 +530,13 @@ $ms-Persona-presenceSizeXl: 28px;
     line-height: $ms-Persona-size32;
   }
 
-  .details {
-    padding: 0 8px;
+  .presence {
+    height: $ms-Persona-presenceSize8;
+    width: $ms-Persona-presenceSize8;
+  }
+
+  .presenceIcon {
+    display: none;
   }
 
   .primaryText {
@@ -549,11 +559,11 @@ $ms-Persona-presenceSizeXl: 28px;
 }
 
 
-//== Modifier: Small Persona
+//== Modifier: Size 40 Persona
 //
 .root.rootIsSize40 {
-  height: $ms-Persona-size40;
-  min-width: $ms-Persona-size40;
+  height: $ms-Persona-size40 + $ms-Persona-presenceBorder;
+  min-width: $ms-Persona-size40 + $ms-Persona-presenceBorder;
 }
 
 .rootIsSize40 {
@@ -575,16 +585,16 @@ $ms-Persona-presenceSizeXl: 28px;
   }
 
   .primaryText {
-    font-size: $ms-font-size-m;
+    font-size: $ms-font-size-l;
   }
 }
 
 
-//== Modifier: Large Persona
+//== Modifier: Size 72 Persona
 //
 .root.rootIsSize72 {
-  height: $ms-Persona-size72;
-  min-width: $ms-Persona-size72;
+  height: $ms-Persona-size72 + $ms-Persona-presenceBorder;
+  min-width: $ms-Persona-size72 + $ms-Persona-presenceBorder;
 }
 
 .rootIsSize72 {
@@ -606,13 +616,20 @@ $ms-Persona-presenceSizeXl: 28px;
   }
 
   .presence {
-    height: $ms-Persona-presenceSizeLg;
-    width: $ms-Persona-presenceSizeLg;
-    border-width: 3px;
+    height: $ms-Persona-presenceSize20;
+    width: $ms-Persona-presenceSize20;
   }
 
   .presenceIcon {
-    line-height: $ms-Persona-presenceSizeLg;
+    line-height: $ms-Persona-presenceSize20;
+    font-size: $ms-font-size-s;
+  }
+
+  .primaryText {
+    font-size: $ms-font-size-xl;
+  }
+
+  .secondaryText {
     font-size: $ms-font-size-m;
   }
 
@@ -622,11 +639,11 @@ $ms-Persona-presenceSizeXl: 28px;
 }
 
 
-//== Modifier: Extra Large Persona
+//== Modifier: Size 100 Persona
 //
 .root.rootIsSize100 {
-  height: $ms-Persona-size100;
-  min-width: $ms-Persona-size100;
+  height: $ms-Persona-size100 + $ms-Persona-presenceBorder;
+  min-width: $ms-Persona-size100 + $ms-Persona-presenceBorder;
 }
 
 .rootIsSize100 {
@@ -648,16 +665,13 @@ $ms-Persona-presenceSizeXl: 28px;
   }
 
   .presence {
-    height: $ms-Persona-presenceSizeXl;
-    width: $ms-Persona-presenceSizeXl;
-    border-width: 4px;
+    height: $ms-Persona-presenceSize28;
+    width: $ms-Persona-presenceSize28;
   }
 
   .presenceIcon {
-    line-height: $ms-Persona-presenceSizeXl;
-    font-size: $ms-font-size-xl;
-    position: relative;
-    top: 1px;
+    line-height: $ms-Persona-presenceSize28;
+    font-size: $ms-font-size-m;
   }
 
   .primaryText {
@@ -665,6 +679,10 @@ $ms-Persona-presenceSizeXl: 28px;
     font-weight: $ms-font-weight-semilight;
   }
 
+  .secondaryText {
+    font-size: $ms-font-size-m;
+  }
+
   .tertiaryText,
   .optionalText {
     display: block; // Show tertiary and optional text
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index 8520d62c6d31c..0324b9cb06c2a 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -111,7 +111,7 @@ export class Persona extends BaseComponent<IPersonaProps, {}> {
         style={ coinSize ? { height: coinSize, minWidth: coinSize } : undefined }
       >
         <PersonaCoin { ...personaCoinProps } />
-        { (!hidePersonaDetails || (size === PersonaSize.size12)) && personaDetails }
+        { (!hidePersonaDetails || (size === PersonaSize.size10)) && personaDetails }
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
index 41d6db604d29a..2244692fe7a89 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
@@ -19,13 +19,16 @@ import {
   PERSONA_INITIALS_COLOR,
   PERSONA_SIZE
 } from './PersonaConsts';
+import {
+  Icon
+} from '../Icon';
 import * as stylesImport from './Persona.scss';
 const styles: any = stylesImport;
 
 const SIZE_TO_PIXELS = {
   [PersonaSize.size24]: 24,
   [PersonaSize.size28]: 28,
-  [PersonaSize.size12]: 30,
+  [PersonaSize.size10]: 20,
   [PersonaSize.size32]: 32,
   [PersonaSize.size40]: 40,
   [PersonaSize.size48]: 48,
@@ -104,7 +107,7 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
         { ...divProps }
         className={ css('ms-Persona-coin', PERSONA_SIZE[size]) }
       >
-        { size !== PersonaSize.size12 && (
+        { size !== PersonaSize.size10 ? (
           <div
             { ...coinProps }
             className={ css('ms-Persona-imageArea', styles.imageArea) }
@@ -140,7 +143,17 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
             />
             <PersonaPresence { ...this.props } />
           </div>
-        ) }
+        ) :
+          (this.props.presence ?
+            <PersonaPresence
+              { ...this.props }
+            /> :
+            <Icon
+              iconName='Contact'
+              className={ styles.size10NoPresenceIcon }
+            />
+          )
+        }
         { this.props.children }
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts b/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
index a20a8857d9034..61d20737f6496 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
@@ -8,7 +8,7 @@ const styles: any = stylesImport;
 
 export const PERSONA_SIZE = {
   // All non-numerically named sizes are deprecated, use the numerically named classes below
-  [PersonaSize.tiny]: 'ms-Persona--tiny ' + styles.rootIsTiny + styles.rootIsSize12,
+  [PersonaSize.tiny]: 'ms-Persona--tiny ' + styles.rootIsTiny + styles.rootIssize10,
   [PersonaSize.extraExtraSmall]: 'ms-Persona--xxs ' + styles.rootIsExtraExtraSmall + styles.rootIsSize24,
   [PersonaSize.extraSmall]: 'ms-Persona--xs ' + styles.rootIsExtraSmall + styles.rootIsSize28,
   [PersonaSize.small]: 'ms-Persona--sm ' + styles.rootIsSmall + styles.rootIsSize40,
@@ -18,7 +18,7 @@ export const PERSONA_SIZE = {
 
   [PersonaSize.size28]: 'ms-Persona--size28 ' + styles.rootIsSize28,
   [PersonaSize.size16]: 'ms-Persona--size16 ' + styles.rootIsSize16,
-  [PersonaSize.size12]: 'ms-Persona--size12 ' + styles.rootIsSize12,
+  [PersonaSize.size10]: 'ms-Persona--size10 ' + styles.rootIsSize10,
   [PersonaSize.size24]: 'ms-Persona--size24 ' + styles.rootIsSize24,
   [PersonaSize.size32]: 'ms-Persona--size32 ' + styles.rootIsSize32,
   [PersonaSize.size40]: 'ms-Persona--size40 ' + styles.rootIsSize40,
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
index e030d24c0d624..c034c31d01760 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
@@ -59,10 +59,10 @@ export class PersonaPage extends React.Component<IComponentDemoPageProps, {}> {
         dos={
           <div>
             <ul>
-              <li>Use XXS size Persona in text fields in read mode or in experiences such as multi-column list view which need compact Persona representations.</li>
-              <li>Use XS size Persona in text fields in edit mode.</li>
-              <li>Use XS, S and M size Personas in menus and list views.</li>
-              <li>Use L and XXL size Personas in profile cards and views.</li>
+              <li>Use Size 24 Persona in text fields in read mode or in experiences such as multi-column list view which need compact Persona representations.</li>
+              <li>Use Size 32 Persona in text fields in edit mode.</li>
+              <li>Use Size 32, Size 40, and Size 48 Personas in menus and list views.</li>
+              <li>Use Size 72 and Size 100 Personas in profile cards and views.</li>
             </ul>
           </div>
         }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
index aaf15d5abc925..890a4313a1b82 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
@@ -42,10 +42,16 @@ export class PersonaBasicExample extends React.Component<React.Props<PersonaBasi
           />
         </div>
 
-        <Label className={ exampleStyles.exampleLabel }>Size 12 Persona</Label>
+        <Label className={ exampleStyles.exampleLabel }>Size 10 Persona, with no presence</Label>
         <Persona
           { ...examplePersona }
-          size={ PersonaSize.size12 }
+          size={ PersonaSize.size10 }
+          hidePersonaDetails={ !renderPersonaDetails }
+        />
+        <Label className={ exampleStyles.exampleLabel }>Size 10 Persona, with presence</Label>
+        <Persona
+          { ...examplePersona }
+          size={ PersonaSize.size10 }
           presence={ PersonaPresence.offline }
           hidePersonaDetails={ !renderPersonaDetails }
         />
@@ -53,14 +59,14 @@ export class PersonaBasicExample extends React.Component<React.Props<PersonaBasi
         <Persona
           { ...examplePersona }
           size={ PersonaSize.size24 }
-          presence={ PersonaPresence.none }
+          presence={ PersonaPresence.online }
           hidePersonaDetails={ !renderPersonaDetails }
         />
         <Label className={ exampleStyles.exampleLabel }>Size 28 Persona</Label>
         <Persona
           { ...examplePersona }
           size={ PersonaSize.size28 }
-          presence={ PersonaPresence.none }
+          presence={ PersonaPresence.online }
           hidePersonaDetails={ !renderPersonaDetails }
         />
         <Label className={ exampleStyles.exampleLabel }>Size 32 Persona</Label>

From 5119600f317622ea9fbc96518be540b46974d12e Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 3 Nov 2017 15:06:55 +0000
Subject: [PATCH 0974/1641] Applying package updates.

---
 apps/fabric-website/package.json                   |  2 +-
 apps/ssr-tests/package.json                        |  2 +-
 apps/test-bundle-button/package.json               |  2 +-
 apps/todo-app/package.json                         |  2 +-
 apps/vr-tests/package.json                         |  2 +-
 .../fix-amd_2017-11-03-14-43.json                  | 11 -----------
 packages/experiments/package.json                  |  2 +-
 packages/office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md       |  9 ++++++++-
 packages/office-ui-fabric-react/package.json       |  2 +-
 10 files changed, 29 insertions(+), 19 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/fix-amd_2017-11-03-14-43.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 49fe1682f3874..07384c113a099 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.19.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.19.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 17e3935c7a44b..251a121d7d987 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.19.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.19.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 3a7317c55601e..9640738d0c41c 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.19.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.19.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 177217c499212..3b7de70802ea4 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.19.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.19.1 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index ded2e8ac93f29..74831a147df0c 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.19.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.19.1 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/fix-amd_2017-11-03-14-43.json b/common/changes/office-ui-fabric-react/fix-amd_2017-11-03-14-43.json
deleted file mode 100644
index 8474b0a579eea..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-amd_2017-11-03-14-43.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "HoverCard: fixing an import to be AMD compliant.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 6e2f584072bcb..5cf6790b6f2cf 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.19.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.19.1 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 68e1ff1433d8f..f5660962b6d1d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.19.1",
+      "tag": "office-ui-fabric-react_v5.19.1",
+      "date": "Fri, 03 Nov 2017 15:06:54 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "fbc91124227072ddeda35020e0c3f9e442ad5e12",
+            "comment": "HoverCard: fixing an import to be AMD compliant."
+          }
+        ]
+      }
+    },
     {
       "version": "5.19.0",
       "tag": "office-ui-fabric-react_v5.19.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 9985021edda91..73211913321a8 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 03 Nov 2017 14:09:56 GMT and should not be manually modified.
+This log was last generated on Fri, 03 Nov 2017 15:06:54 GMT and should not be manually modified.
+
+## 5.19.1
+Fri, 03 Nov 2017 15:06:54 GMT
+
+### Patches
+
+- HoverCard: fixing an import to be AMD compliant.
 
 ## 5.19.0
 Fri, 03 Nov 2017 14:09:56 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index ec2bea7138e13..d94b9824b67cf 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.19.0",
+  "version": "5.19.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 774ca00f97ff687fd343e1e5d37593d5b79dcc41 Mon Sep 17 00:00:00 2001
From: chaofeng2014 <fengchao199011@hotmail.com>
Date: Fri, 3 Nov 2017 11:31:52 -0700
Subject: [PATCH 0975/1641] add directionalHintFixed as a prop in hover card
 (#3294)

* add directionalHintFixed as a prop in hover card

* remove space

* put default value in right place

* Add comment in expanding card props

* rebuild
---
 .../src/components/HoverCard/ExpandingCard.Props.ts         | 6 ++++++
 .../src/components/HoverCard/ExpandingCard.tsx              | 4 +++-
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts
index b6802755bd84f..6c80350458e7e 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts
@@ -88,6 +88,12 @@ export interface IExpandingCardProps extends React.HTMLAttributes<HTMLDivElement
    */
   styles?: IExpandingCardStyles;
 
+  /**
+   * Make callout content show on the set side
+   * @default true
+   */
+  directionalHintFixed?: boolean;
+
   /**
    * Trap focus or not
    */
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
index 75d14f968d8d7..d02730d870060 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
@@ -26,6 +26,7 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
     compactCardHeight: 156,
     expandedCardHeight: 384,
     directionalHint: DirectionalHint.bottomLeftEdge,
+    directionalHintFixed: true,
     gapSpace: 0
   };
 
@@ -68,6 +69,7 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
       theme,
       styles: customStyles,
       compactCardHeight,
+      directionalHintFixed,
       expandedCardHeight
     } = this.props;
     this._styles = getStyles(theme!, customStyles);
@@ -96,7 +98,7 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
         target={ targetElement }
         isBeakVisible={ false }
         directionalHint={ this.props.directionalHint }
-        directionalHintFixed={ true }
+        directionalHintFixed={ directionalHintFixed }
         finalHeight={ compactCardHeight! + expandedCardHeight! }
         minPagePadding={ 24 }
         gapSpace={ this.props.gapSpace }

From f8fee750ee10805a19b4dfad0b6e3093199d92b8 Mon Sep 17 00:00:00 2001
From: Evan Levy <33076550+evlevy@users.noreply.github.com>
Date: Fri, 3 Nov 2017 15:14:27 -0400
Subject: [PATCH 0976/1641] initial commit (#3253)

---
 .../calendar-minmax_2017-10-27-16-08.json     |  11 +
 .../src/components/Calendar/Calendar.Props.ts |  10 +
 .../src/components/Calendar/Calendar.scss     | 260 +++++++-----------
 .../src/components/Calendar/Calendar.test.tsx | 113 ++++++++
 .../src/components/Calendar/Calendar.tsx      |   6 +-
 .../src/components/Calendar/CalendarDay.tsx   |  99 +++++--
 .../src/components/Calendar/CalendarMonth.tsx |  52 ++--
 .../src/utilities/dateMath/DateMath.test.ts   |  20 ++
 .../src/utilities/dateMath/DateMath.ts        |  36 +++
 9 files changed, 402 insertions(+), 205 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/calendar-minmax_2017-10-27-16-08.json

diff --git a/common/changes/office-ui-fabric-react/calendar-minmax_2017-10-27-16-08.json b/common/changes/office-ui-fabric-react/calendar-minmax_2017-10-27-16-08.json
new file mode 100644
index 0000000000000..de1b800a8e40b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/calendar-minmax_2017-10-27-16-08.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Allow optional minimum and maximum date boundaries on Calendar component. ",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "evlevy@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
index e6102c248b1f9..e74dcb1b1c90d 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
@@ -122,6 +122,16 @@ export interface ICalendarProps extends React.Props<Calendar> {
   * Apply additional formating to dates, for example localized date formatting.
   */
   dateTimeFormatter?: ICalendarFormatDateCallbacks;
+
+  /**
+  * If set the Calendar will not allow navigation to or selection of a date earlier than this value.
+  */
+  minDate?: Date;
+
+  /**
+  * If set the Calendar will not allow navigation to or selection of a date later than this value.
+  */
+  maxDate?: Date;
 }
 
 export interface ICalendarStrings {
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
index 285e1d1c34d52..be5d577f44230 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
@@ -1,14 +1,11 @@
 @import '../../common/common';
 // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
-
 //
 // Office UI Fabric
 // --------------------------------------------------
 // Calendar styles
-
 $Calendar-day:40px;
 $Calendar-dayPicker-margin: 10px;
-
 .root {
   @include ms-normalize;
 }
@@ -28,7 +25,6 @@ $Calendar-dayPicker-margin: 10px;
   display: none;
 }
 
-
 // When the picker opens, reveal the content.
 .picker.pickerIsOpened .holder {
   @include ms-borderBox;
@@ -40,7 +36,6 @@ $Calendar-dayPicker-margin: 10px;
   position: relative;
 }
 
-
 // The frame and wrap work together to ensure that
 // clicks within the picker don’t reach the holder.
 .frame {
@@ -54,13 +49,11 @@ $Calendar-dayPicker-margin: 10px;
   display: flex;
 }
 
-
 // Wrapper containing the calendar view to pick a specific date.
 .dayPicker {
   display: block;
 }
 
-
 // The header containing the month and year.
 .header {
   position: relative;
@@ -69,7 +62,6 @@ $Calendar-dayPicker-margin: 10px;
   line-height: 44px;
 }
 
-
 // The month and year labels.
 .monthAndYear,
 .year {
@@ -89,7 +81,6 @@ $Calendar-dayPicker-margin: 10px;
   @include margin-left(5px);
 }
 
-
 // The calendar table of dates.
 .table {
   text-align: center;
@@ -98,11 +89,9 @@ $Calendar-dayPicker-margin: 10px;
   table-layout: fixed;
   font-size: inherit;
   margin-top: 10px;
-
   td {
     margin: 0;
     padding: 0;
-
     &:hover {
       outline: 1px solid transparent;
     }
@@ -110,42 +99,38 @@ $Calendar-dayPicker-margin: 10px;
 }
 
 // The days on the calendar.
-.day, .weekday {
+.day,
+.weekday {
   width: $Calendar-day;
   height: $Calendar-day;
   padding: 0;
   line-height: $Calendar-day;
   @include ms-font-m-plus;
   color: $ms-color-neutralPrimary;
-  box-sizing: border-box;
-  // border-radius: 2px;
+  box-sizing: border-box; // border-radius: 2px;
 }
 
-
 // Today.
 .dayIsToday {
   position: relative;
   background-color: $ms-color-themeLight;
-
   @include high-contrast {
     border: 1px solid WindowText;
   }
 }
 
-
 // Disabled day.
 .dayIsDisabled:before {
   border-top-color: $ms-color-neutralTertiary;
 }
 
-
 // Out of focus days.
-.dayIsUnfocused {
+.dayIsUnfocused,
+.dayIsDisabled {
   color: $ms-color-neutralTertiary;
   font-weight: $ms-font-weight-regular;
 }
 
-
 // Hovered date picker items.
 .dayIsFocused:hover,
 .dayIsUnfocused:hover {
@@ -155,7 +140,6 @@ $Calendar-dayPicker-margin: 10px;
 
 .day.dayIsHighlighted.dayIsFocused {
   @include focus-border(1px, $ms-color-white);
-
   @include high-contrast {
     @include focus-border(1px, WindowText);
   }
@@ -165,14 +149,15 @@ $Calendar-dayPicker-margin: 10px;
 .dayIsHighlighted:hover,
 .pickerIsFocused .dayIsHighlighted {
   cursor: pointer;
-
   @include high-contrast {
     border: 2px solid Highlight;
   }
 }
 
-.dayIsUnfocused:active, .dayIsFocused:active, .dayIsHighlighted{
-  &.day{
+.dayIsUnfocused:active,
+.dayIsFocused:active,
+.dayIsHighlighted {
+  &.day {
     color: $ms-color-black;
     background: $ms-color-themeLight;
   }
@@ -185,7 +170,8 @@ $Calendar-dayPicker-margin: 10px;
 }
 
 // Today.
-.dayIsToday, .pickerIsFocused .dayIsToday {
+.dayIsToday,
+.pickerIsFocused .dayIsToday {
   position: relative;
   color: $ms-color-white;
   background-color: $ms-color-themePrimary;
@@ -193,56 +179,59 @@ $Calendar-dayPicker-margin: 10px;
 }
 
 // Highlighted date squares
-.dayBackground, .weekBackground, .monthBackground{
-    background: $ms-color-neutralLight;
+.dayBackground,
+.weekBackground,
+.monthBackground {
+  background: $ms-color-neutralLight;
 }
 
-.dayBackground{
+.dayBackground {
   // border-radius: 2px;
 }
 
-.weekBackground{
-    &:first-child{
-      // border-radius: 2px 0px 0px 2px;
-    }
-
-    &:last-child{
-      // border-radius: 0px 2px 2px 0px;
-    }
+.weekBackground {
+  &:first-child {
+    // border-radius: 2px 0px 0px 2px;
+  }
+  &:last-child {
+    // border-radius: 0px 2px 2px 0px;
+  }
 }
 
-.showWeekNumbers{
-  .weekNumbers{
+.showWeekNumbers {
+  .weekNumbers {
     position: absolute;
     margin-top: $Calendar-day;
     border-right: 1px solid $ms-color-neutralLight;
     box-sizing: border-box;
     width: 30px;
-    .day{
+    .day {
       color: $ms-color-neutralSecondary;
-      &.weekIsHighlighted{
+      &.weekIsHighlighted {
         color: $ms-color-black;
       }
     }
   }
-  .table{
-    &:not(.weekNumbers){
+  .table {
+    &:not(.weekNumbers) {
       margin-left: 30px;
     }
-    .day, .weekday{
+    .day,
+    .weekday {
       width: 30px;
     }
   }
 }
 
 // Month and year previous/next components.
-.monthComponents,.yearComponents,
+.monthComponents,
+.yearComponents,
 .decadeComponents {
   display: inline-flex;
   margin-left: 3px;
 }
 
-.yearComponents{
+.yearComponents {
   margin-left: 3px;
 }
 
@@ -262,7 +251,6 @@ $Calendar-dayPicker-margin: 10px;
   color: $ms-color-neutralDark;
   position: relative;
   top: 2px;
-
   &:hover {
     color: $ms-color-neutralDark;
     cursor: pointer;
@@ -270,6 +258,15 @@ $Calendar-dayPicker-margin: 10px;
   }
 }
 
+.prevMonthIsDisabled,
+.nextMonthIsDisabled,
+.prevYearIsDisabled,
+.nextYearIsDisabled,
+.prevDecadeIsDisabled,
+.nextDecadeIsDisabled {
+  visibility: hidden;
+}
+
 // Without modifying the Pickadate JS, this transparent
 // button is necessary to toggle the month view.
 .headerToggleView:hover {
@@ -310,22 +307,24 @@ $Calendar-dayPicker-margin: 10px;
   @include margin(0, 10px, 10px, 0);
   @include ms-font-s-plus;
   color: $ms-color-neutralPrimary;
-  text-align: center;
-  // border-radius: 2px;
-
+  text-align: center; // border-radius: 2px;
   &:hover {
     color: $ms-color-black;
     background-color: $ms-color-neutralTertiaryAlt;
     outline: 1px solid transparent;
   }
-
   &.isHighlighted {
     background-color: $ms-color-neutralPrimary;
     color: $ms-color-white;
   }
-
 }
 
+.monthOptionIsDisabled,
+.yearOptionIsDisabled {
+  background-color: $ms-color-neutralLighter;
+  color: $ms-color-neutralTertiaryAlt;
+  pointer-events: none;
+}
 
 // Button to navigate to the current date.
 .goToday {
@@ -339,19 +338,17 @@ $Calendar-dayPicker-margin: 10px;
   padding: 0 10px;
   position: absolute !important;
   @include ms-right(13px);
-
   &:hover {
     color: $ms-color-themePrimary;
     outline: 1px solid transparent;
   }
-
   &:active {
     color: $ms-color-themeDark;
   }
 }
 
 // Additional 30px margin needed when "Go to today" button is visible
-.wrap.goTodaySpacing{
+.wrap.goTodaySpacing {
   margin-bottom: 30px;
 }
 
@@ -361,12 +358,10 @@ $Calendar-dayPicker-margin: 10px;
   .dayPicker,
   .monthComponents {
     display: none;
-  }
-  // Hide the month picking components.
+  } // Hide the month picking components.
   .monthPicker {
     display: none;
-  }
-  // Show the year picking components.
+  } // Show the year picking components.
   .yearPicker {
     display: block;
   }
@@ -376,35 +371,26 @@ $Calendar-dayPicker-margin: 10px;
 //
 // On screens that can fit it, we show the month picker next to the day picker if we have it enabled.
 @media (min-device-width: 460px) {
-
   $Calendar-day: 28px;
   $Calendar-month: 40px;
-
   .wrap {
     padding: 9px 8px;
-  }
-  // Update the spacing and text for the day and month pickers
-
-  .dayPicker,.monthPicker {
+  } // Update the spacing and text for the day and month pickers
+  .dayPicker,
+  .monthPicker {
     min-height: 214px;
   }
-
   .header {
     height: $Calendar-day;
     line-height: $Calendar-day;
-  }
-
-  // Calendar day cells are smaller.
+  } // Calendar day cells are smaller.
   .day,
   .weekday {
     width: $Calendar-day;
     height: $Calendar-day;
     line-height: $Calendar-day;
     font-size: $ms-font-size-s;
-  }
-
-
-  // Reduce the size of arrows to change month/year.
+  } // Reduce the size of arrows to change month/year.
   .prevMonth,
   .nextMonth,
   .prevYear,
@@ -416,76 +402,61 @@ $Calendar-dayPicker-margin: 10px;
     height: 24px;
     line-height: 24px;
   }
-
   .holder {
     width: 212px;
     height: auto;
   }
-
   .monthAndYear,
   .year {
     font-size: 17px;
     color: $ms-color-neutralPrimary;
   }
-
-  .yearComponents{
+  .yearComponents {
     margin-left: 1px;
   }
-
   .goToday {
     padding: 0 3px;
   }
-
-  .showWeekNumbers{
-    .weekNumbers{
+  .showWeekNumbers {
+    .weekNumbers {
       margin-top: $Calendar-day;
       width: 26px;
       margin-left: -7px
     }
-    .table{
-      &:not(.weekNumbers){
+    .table {
+      &:not(.weekNumbers) {
         margin-left: 19px;
       }
-      .day, .weekday{
+      .day,
+      .weekday {
         width: 26px;
       }
     }
-  }
-
-  // Show month picker, if enabled
+  } // Show month picker, if enabled
   .monthPickerVisible {
-
     .wrap {
       padding: 10px;
-    }
-
-    // Swap margin for padding so that the border extends the full height.
+    } // Swap margin for padding so that the border extends the full height.
     .dayPicker {
       margin: -$Calendar-dayPicker-margin 0;
       padding: $Calendar-dayPicker-margin 0;
-    }
-
-    // Contains the calendar view for picking a day.
+    } // Contains the calendar view for picking a day.
     .dayPicker {
       @include ms-borderBox;
       @include border-right(1px, solid, $ms-color-neutralLight);
       width: 212px;
       min-height: 214px;
-    }
-    // Show the month picker.
+    } // Show the month picker.
     .monthPicker {
       display: block;
     }
-
     .optionGrid {
       height: 150px;
       width: 212px;
-    }
-    // This component is only used on small displays.
+    } // This component is only used on small displays.
     .toggleMonthView {
       display: none;
-    }
-    // Position the current year and decade labels.
+    } // Position the current year and decade labels.
     .currentYear,
     .currentDecade {
       font-size: 17px;
@@ -493,9 +464,7 @@ $Calendar-dayPicker-margin: 10px;
       height: $Calendar-day;
       line-height: 26px;
       display: inline-block;
-    }
-
-    // Reduce the size of the month buttons.
+    } // Reduce the size of the month buttons.
     .monthOption,
     .yearOption {
       width: $Calendar-month;
@@ -503,16 +472,13 @@ $Calendar-dayPicker-margin: 10px;
       line-height: $Calendar-month;
       font-size: 12px;
       @include margin(0, 11px, 11px, 0);
-
       &:hover {
         outline: 1px solid transparent;
       }
-
-      &:nth-child(4n+4){
+      &:nth-child(4n+4) {
         @include margin(0, 0px, 11px, 0);
       }
-    }
-    // Position the "Go to today" button below the month picker.
+    } // Position the "Go to today" button below the month picker.
     .goToday {
       @include ms-borderBox;
       font-size: 12px;
@@ -522,12 +488,10 @@ $Calendar-dayPicker-margin: 10px;
       @include ms-right(8px);
       @include text-align(right);
       top: 199px;
-    }
-    // When date and month picker are side-by-side and "Go to today" button is visible no additional margin is needed
-    .wrap.goTodaySpacing{
+    } // When date and month picker are side-by-side and "Go to today" button is visible no additional margin is needed
+    .wrap.goTodaySpacing {
       margin-bottom: 0px;
-    }
-    // State: The picker is showing the year components.
+    } // State: The picker is showing the year components.
     // On larger screens the calendar will remain and the years
     // will replace the months.
     .root.isPickingYears {
@@ -536,59 +500,48 @@ $Calendar-dayPicker-margin: 10px;
       .dayPicker,
       .monthComponents {
         display: block;
-      }
-      // Hide the month picking components.
+      } // Hide the month picking components.
       .monthPicker {
         display: none;
-      }
-      // Show the year picking components.
+      } // Show the year picking components.
       .yearPicker {
         display: block;
       }
     }
   }
-
-  .calendarsInline{
+  .calendarsInline {
     .wrap {
       padding: 9px 12px;
     }
-
     .holder {
       width: 440px;
       height: auto;
     }
-
-    .table{
+    .table {
       margin-right: 12px
     }
-
-     .dayPicker {
+    .dayPicker {
       width: auto;
     }
-
-    .monthPicker{
+    .monthPicker {
       margin-left: 13px;
     }
-
     .goToday {
       @include ms-right(13px);
       padding: 0 10px;
     }
-  }
-
-  //when month picker is only visible
-  .monthPickerOnly{
-    .wrap{
+  } //when month picker is only visible
+  .monthPickerOnly {
+    .wrap {
       padding: 10px;
     }
   }
-
-  .monthPickerAsOverlay{
+  .monthPickerAsOverlay {
     .wrap {
       padding-top: 4px;
       padding-bottom: 4px;
     }
-    .holder{
+    .holder {
       height: 240px;
     }
   }
@@ -596,30 +549,23 @@ $Calendar-dayPicker-margin: 10px;
 
 // On smaller screens the month button toggles to the picking months state.
 @media (max-device-width: 459px) {
-
   // Stop elements from going off screen
   .holder {
     width: 300px;
   }
-
-  .calendarsInline{
+  .calendarsInline {
     // Month and year pickers, hidden on small screens by default.
     .monthPicker,
     .yearPicker {
       display: none;
     }
-  }
-
-  // position year components so they do not move when switching between calendars (overlayed calendars)
+  } // position year components so they do not move when switching between calendars (overlayed calendars)
   .yearComponents {
     margin-top: 2px;
   }
 }
 
-
 // Custom CSS for fabric-React
-
-
 .wrap span:focus,
 .wrap div:focus {
   @include focus-border(1px, $ms-color-neutralSecondary);
@@ -634,8 +580,7 @@ $Calendar-dayPicker-margin: 10px;
 .nextYear,
 .prevYear {
   display: inline-block;
-
-  &:hover{
+  &:hover {
     background-color: $ms-color-neutralTertiaryAlt;
   }
 }
@@ -645,10 +590,9 @@ $Calendar-dayPicker-margin: 10px;
   margin-left: 3px;
 }
 
-.monthIsHighlighted{
+.monthIsHighlighted {
   background-color: $ms-color-themeLight;
-
-  &.monthOption:hover{
+  &.monthOption:hover {
     background-color: $ms-color-themeLight;
   }
 }
@@ -657,41 +601,39 @@ $Calendar-dayPicker-margin: 10px;
   font-weight: 600;
   color: $ms-color-white;
   background-color: $ms-color-themePrimary;
-
-  &.monthOption:hover{
+  &.monthOption:hover {
     font-weight: 600;
     color: $ms-color-white;
     background-color: $ms-color-themePrimary;
   }
 }
 
-.monthOption:active{
+.monthOption:active {
   background-color: $ms-color-themeLight;
 }
 
-
 // Highlighted Month date styling.
 // Border-radius to be updated once rolled out across fabric
-.topLeftCornerDate{
+.topLeftCornerDate {
   border-radius: 0;
 }
 
-.topRightCornerDate{
+.topRightCornerDate {
   border-radius: 0;
 }
 
-.bottomLeftCornerDate{
+.bottomLeftCornerDate {
   border-radius: 0;
 }
 
-.bottomRightCornerDate{
+.bottomRightCornerDate {
   border-radius: 0;
 }
 
-.singleTopDate{
+.singleTopDate {
   border-radius: 0;
 }
 
-.singleBottomDate{
+.singleBottomDate {
   border-radius: 0;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
index aefdb90781b13..42e1da0604e3b 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
@@ -247,4 +247,117 @@ describe('Calendar', () => {
       lastSelectedDateRange!.forEach((val, i) => expect(compareDates(val, addDays(firstDate, i))).toEqual(true));
     });
   });
+
+  describe('render with date boundaries', () => {
+    it('out-of-bounds days should be disabled', () => {
+      const defaultDate = new Date('Mar 16 2017');
+      const minDate = new Date('Mar 6 2017');
+      const maxDate = new Date('Mar 24 2017');
+      const renderedComponent = ReactTestUtils.renderIntoDocument(
+        <Calendar
+          strings={ dayPickerStrings }
+          value={ defaultDate }
+          firstDayOfWeek={ DayOfWeek.Sunday }
+          dateRangeType={ DateRangeType.Day }
+          minDate={ minDate }
+          maxDate={ maxDate }
+        />) as Calendar;
+
+      const days = ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedComponent, 'ms-DatePicker-day');
+
+      expect(days.slice(0, 7).every(e => e.classList.contains('ms-DatePicker-day--disabled'))).toBe(true);
+      expect(days.slice(8, 26).every(e => e.classList.contains('ms-DatePicker-day--disabled'))).toBe(false);
+      expect(days.slice(27).every(e => e.classList.contains('ms-DatePicker-day--disabled'))).toBe(true);
+    });
+
+    it('out-of-bounds days should not be part of selected range', () => {
+      let lastSelectedDateRange: Date[] = new Array();
+      const defaultDate = new Date('Mar 16 2017');
+      const minDate = new Date('Mar 6 2017');
+      const maxDate = new Date('Mar 24 2017');
+      const onSelectDate = (): (date: Date, dateRangeArray: Date[]) => void => {
+        return (date: Date, dateRangeArray: Date[]): void => {
+          lastSelectedDateRange = dateRangeArray;
+        };
+      };
+      const renderedComponent = ReactTestUtils.renderIntoDocument(
+        <Calendar
+          strings={ dayPickerStrings }
+          value={ defaultDate }
+          firstDayOfWeek={ DayOfWeek.Sunday }
+          dateRangeType={ DateRangeType.Month }
+          minDate={ minDate }
+          maxDate={ maxDate }
+          onSelectDate={ onSelectDate() }
+        />) as Calendar;
+
+      let days = ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedComponent, 'ms-DatePicker-day');
+      ReactTestUtils.Simulate.click(days[18]);
+      expect(lastSelectedDateRange!.length).toEqual(19);
+      lastSelectedDateRange!.forEach((val, i) => expect(compareDates(val, addDays(minDate, i))).toEqual(true));
+    });
+  });
+
+  it('navigators to out-of-bounds months should be disabled', () => {
+    const defaultDate = new Date('Mar 15 2017');
+    const minDate = new Date('Mar 1 2017');
+    const maxDate = new Date('Mar 31 2017');
+    const renderedComponent = ReactTestUtils.renderIntoDocument(
+      <Calendar
+        strings={ dayPickerStrings }
+        value={ defaultDate }
+        firstDayOfWeek={ DayOfWeek.Sunday }
+        dateRangeType={ DateRangeType.Day }
+        minDate={ minDate }
+        maxDate={ maxDate }
+      />) as Calendar;
+
+    const prevMonth = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-prevMonth');
+    const nextMonth = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-nextMonth');
+
+    expect(prevMonth.classList.contains('ms-DatePicker-prevMonth--disabled')).toBe(true);
+    expect(nextMonth.classList.contains('ms-DatePicker-nextMonth--disabled')).toBe(true);
+  });
+
+  it('out-of-bounds months should be disabled', () => {
+    const defaultDate = new Date('Mar 15 2017');
+    const minDate = new Date('Mar 1 2017');
+    const maxDate = new Date('Oct 1 2017');
+    const renderedComponent = ReactTestUtils.renderIntoDocument(
+      <Calendar
+        strings={ dayPickerStrings }
+        value={ defaultDate }
+        firstDayOfWeek={ DayOfWeek.Sunday }
+        dateRangeType={ DateRangeType.Day }
+        minDate={ minDate }
+        maxDate={ maxDate }
+      />) as Calendar;
+
+    const months = ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedComponent, 'ms-DatePicker-monthOption');
+
+    expect(months.slice(0, 1).every(e => e.classList.contains('ms-DatePicker-monthOption--disabled'))).toBe(true);
+    expect(months.slice(2, 9).some(e => e.classList.contains('ms-DatePicker-monthOption--disabled'))).toBe(false);
+    expect(months.slice(10).every(e => e.classList.contains('ms-DatePicker-monthOption--disabled'))).toBe(true);
+  });
+
+  it('navigators to out-of-bounds years should be disabled', () => {
+    const defaultDate = new Date('Mar 15 2017');
+    const minDate = new Date('Jan 1 2017');
+    const maxDate = new Date('Dec 31 2017');
+    const renderedComponent = ReactTestUtils.renderIntoDocument(
+      <Calendar
+        strings={ dayPickerStrings }
+        value={ defaultDate }
+        firstDayOfWeek={ DayOfWeek.Sunday }
+        dateRangeType={ DateRangeType.Day }
+        minDate={ minDate }
+        maxDate={ maxDate }
+      />) as Calendar;
+
+    const prevMonth = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-prevYear');
+    const nextMonth = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-nextYear');
+
+    expect(prevMonth.classList.contains('ms-DatePicker-prevYear--disabled')).toBe(true);
+    expect(nextMonth.classList.contains('ms-DatePicker-nextYear--disabled')).toBe(true);
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index b9db14a1468dd..b225d8464b2a3 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -118,7 +118,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
 
   public render() {
     let rootClass = 'ms-DatePicker';
-    let { firstDayOfWeek, dateRangeType, strings, showMonthPickerAsOverlay, autoNavigateOnSelection, showGoToToday, highlightCurrentMonth, navigationIcons } = this.props;
+    let { firstDayOfWeek, dateRangeType, strings, showMonthPickerAsOverlay, autoNavigateOnSelection, showGoToToday, highlightCurrentMonth, navigationIcons, minDate, maxDate } = this.props;
     let { selectedDate, navigatedDate, isMonthPickerVisible, isDayPickerVisible } = this.state;
     let onHeaderSelect = showMonthPickerAsOverlay ? this._onHeaderSelect : undefined;
     let monthPickerOnly = !showMonthPickerAsOverlay && !isDayPickerVisible;
@@ -156,6 +156,8 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   showWeekNumbers={ this.props.showWeekNumbers }
                   firstWeekOfYear={ this.props.firstWeekOfYear! }
                   dateTimeFormatter={ this.props.dateTimeFormatter! }
+                  minDate={ minDate }
+                  maxDate={ maxDate }
                   ref='dayPicker'
                 />
                 }
@@ -169,6 +171,8 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   onHeaderSelect={ onHeaderSelect }
                   navigationIcons={ navigationIcons! }
                   dateTimeFormatter={ this.props.dateTimeFormatter! }
+                  minDate={ minDate }
+                  maxDate={ maxDate }
                   ref='monthPicker'
                 /> }
 
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index ffe300037e2fd..918e618762fed 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -21,7 +21,9 @@ import {
   getDateRangeArray,
   isInDateRangeArray,
   getWeekNumber,
-  getWeekNumbersInMonth
+  getWeekNumbersInMonth,
+  getMonthStart,
+  getMonthEnd
 } from '../../utilities/dateMath/DateMath';
 import TimeConstants from '../../utilities/dateValues/TimeConstants';
 
@@ -37,6 +39,7 @@ export interface IDayInfo {
   isInMonth: boolean;
   isToday: boolean;
   isSelected: boolean;
+  isInBounds: boolean;
   onSelected: () => void;
 }
 
@@ -57,6 +60,8 @@ export interface ICalendarDayProps extends React.Props<CalendarDay> {
   showWeekNumbers?: boolean;
   firstWeekOfYear: FirstWeekOfYear;
   dateTimeFormatter: ICalendarFormatDateCallbacks;
+  minDate?: Date;
+  maxDate?: Date;
 }
 
 export interface ICalendarDayState {
@@ -94,7 +99,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
 
   public render() {
     let { activeDescendantId, weeks } = this.state;
-    let { firstDayOfWeek, strings, navigatedDate, selectedDate, dateRangeType, navigationIcons, showWeekNumbers, firstWeekOfYear, dateTimeFormatter } = this.props;
+    let { firstDayOfWeek, strings, navigatedDate, selectedDate, dateRangeType, navigationIcons, showWeekNumbers, firstWeekOfYear, dateTimeFormatter, minDate, maxDate } = this.props;
     let dayPickerId = getId('DatePickerDay-dayPicker');
     let monthAndYearId = getId('DatePickerDay-monthAndYear');
     let leftNavigationIcon = navigationIcons.leftNavigation;
@@ -108,6 +113,11 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
       // navigatedDate is on the current month and current year
       weekCorners = this._getWeekCornerStyles(weeks!);
     }
+
+    // determine if previous/next months are in bounds
+    const prevMonthInBounds = minDate ? compareDatePart(minDate, getMonthStart(navigatedDate)) < 0 : true;
+    const nextMonthInBounds = maxDate ? compareDatePart(getMonthEnd(navigatedDate), maxDate) < 0 : true;
+
     return (
       <div
         className={ css('ms-DatePicker-dayPicker',
@@ -119,7 +129,11 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
         <div className={ css('ms-DatePicker-monthComponents', styles.monthComponents) }>
           <div className={ css('ms-DatePicker-navContainer', styles.navContainer) }>
             <span
-              className={ css('ms-DatePicker-prevMonth js-prevMonth', styles.prevMonth) }
+              className={ css('ms-DatePicker-prevMonth js-prevMonth', styles.prevMonth,
+                {
+                  ['ms-DatePicker-prevMonth--disabled ' + styles.prevMonthIsDisabled]: !prevMonthInBounds
+                }
+              ) }
               onClick={ this._onSelectPrevMonth }
               onKeyDown={ this._onPrevMonthKeyDown }
               aria-controls={ dayPickerId }
@@ -130,7 +144,10 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
               <Icon iconName={ getRTL() ? rightNavigationIcon : leftNavigationIcon } />
             </span >
             <span
-              className={ css('ms-DatePicker-nextMonth js-nextMonth', styles.nextMonth) }
+              className={ css('ms-DatePicker-nextMonth js-nextMonth', styles.nextMonth,
+                {
+                  ['ms-DatePicker-nextMonth--disabled ' + styles.nextMonthIsDisabled]: !nextMonthInBounds
+                }) }
               onClick={ this._onSelectNextMonth }
               onKeyDown={ this._onNextMonthKeyDown }
               aria-controls={ dayPickerId }
@@ -215,8 +232,9 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
             <tbody>
               { weeks!.map((week, weekIndex) =>
                 <tr key={ weekIndex } role='row'>
-                  { week.map((day, dayIndex) =>
-                    <td
+                  { week.map((day, dayIndex) => {
+                    const isNavigatedDate = compareDates(navigatedDate, day.originalDate);
+                    return <td
                       key={ day.key }
                       className={ css(
                         {
@@ -230,25 +248,26 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
                           'ms-DatePicker-day',
                           styles.day,
                           {
-                            ['ms-DatePicker-day--infocus ' + styles.dayIsFocused]: day.isInMonth,
-                            ['ms-DatePicker-day--outfocus ' + styles.dayIsUnfocused]: !day.isInMonth,
+                            ['ms-DatePicker-day--disabled ' + styles.dayIsDisabled]: !day.isInBounds,
+                            ['ms-DatePicker-day--infocus ' + styles.dayIsFocused]: day.isInBounds && day.isInMonth,
+                            ['ms-DatePicker-day--outfocus ' + styles.dayIsUnfocused]: day.isInBounds && !day.isInMonth,
                             ['ms-DatePicker-day--today ' + styles.dayIsToday]: day.isToday,
                             ['ms-DatePicker-day--highlighted ' + styles.dayIsHighlighted]: day.isSelected && dateRangeType === DateRangeType.Day
                           }) }
-                        role='gridcell'
-                        onClick={ day.onSelected }
+                        role={ 'gridcell' }
+                        onClick={ day.isInBounds ? day.onSelected : undefined }
                         onKeyDown={ this._onDayKeyDown(day.originalDate, weekIndex, dayIndex) }
                         aria-label={ dateTimeFormatter.formatMonthDayYear(day.originalDate, strings) }
-                        id={ compareDates(navigatedDate, day.originalDate) ? activeDescendantId : undefined }
-                        aria-selected={ day.isSelected }
-                        data-is-focusable={ true }
-                        ref={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : undefined }
-                        key={ compareDates(navigatedDate, day.originalDate) ? 'navigatedDay' : undefined }
+                        id={ isNavigatedDate ? activeDescendantId : undefined }
+                        aria-selected={ day.isInBounds ? day.isSelected : undefined }
+                        data-is-focusable={ day.isInBounds ? true : undefined }
+                        ref={ isNavigatedDate ? 'navigatedDay' : undefined }
+                        key={ isNavigatedDate ? 'navigatedDay' : undefined }
                       >
                         <span aria-hidden='true'>{ dateTimeFormatter.formatDay(day.originalDate) }</span>
                       </div>
-                    </td>
-                  ) }
+                    </td>;
+                  }) }
                 </tr>
               ) }
             </tbody>
@@ -359,17 +378,22 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
   }
 
   private _navigateMonthEdge(ev: React.KeyboardEvent<HTMLElement>, date: Date, weekIndex: number, dayIndex: number) {
+    const { minDate, maxDate } = this.props;
+    let targetDate: Date | undefined = undefined;
+
     if (weekIndex === 0 && ev.which === KeyCodes.up) {
-      this.props.onNavigateDate(addWeeks(date, -1), true);
-      ev.preventDefault();
+      targetDate = addWeeks(date, -1);
     } else if (weekIndex === (this.state.weeks!.length - 1) && ev.which === KeyCodes.down) {
-      this.props.onNavigateDate(addWeeks(date, 1), true);
-      ev.preventDefault();
+      targetDate = addWeeks(date, 1);
     } else if (dayIndex === 0 && ev.which === getRTLSafeKeyCode(KeyCodes.left)) {
-      this.props.onNavigateDate(addDays(date, -1), true);
-      ev.preventDefault();
+      targetDate = addDays(date, -1);
     } else if (dayIndex === (DAYS_IN_WEEK - 1) && ev.which === getRTLSafeKeyCode(KeyCodes.right)) {
-      this.props.onNavigateDate(addDays(date, 1), true);
+      targetDate = addDays(date, 1);
+    }
+
+    // Don't navigate to out-of-bounds date
+    if (targetDate && (minDate ? compareDatePart(minDate, targetDate) < 1 : true) && (maxDate ? compareDatePart(targetDate, maxDate) < 1 : true)) {
+      this.props.onNavigateDate(targetDate, true);
       ev.preventDefault();
     }
   }
@@ -391,9 +415,13 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
 
   @autobind
   private _onSelectDate(selectedDate: Date) {
-    let { onSelectDate, dateRangeType, firstDayOfWeek, navigatedDate, autoNavigateOnSelection } = this.props;
+    let { onSelectDate, dateRangeType, firstDayOfWeek, navigatedDate, autoNavigateOnSelection, minDate, maxDate } = this.props;
 
     let dateRange = getDateRangeArray(selectedDate, dateRangeType, firstDayOfWeek);
+    if (dateRangeType !== DateRangeType.Day) {
+      dateRange = this._getBoundedDateRange(dateRange, minDate, maxDate);
+    }
+
     if (onSelectDate) {
       onSelectDate(selectedDate, dateRange);
     }
@@ -446,7 +474,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
   }
 
   private _getWeeks(propsToUse: ICalendarDayProps): IDayInfo[][] {
-    let { navigatedDate, selectedDate, dateRangeType, firstDayOfWeek, today } = propsToUse;
+    let { navigatedDate, selectedDate, dateRangeType, firstDayOfWeek, today, minDate, maxDate } = propsToUse;
     let date = new Date(navigatedDate.getFullYear(), navigatedDate.getMonth(), 1);
     let todaysDate = today || new Date();
     let weeks: IDayInfo[][] = [];
@@ -460,6 +488,9 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
     let isAllDaysOfWeekOutOfMonth = false;
 
     let selectedDates = getDateRangeArray(selectedDate, dateRangeType, firstDayOfWeek);
+    if (dateRangeType !== DateRangeType.Day) {
+      selectedDates = this._getBoundedDateRange(selectedDates, minDate, maxDate);
+    }
 
     for (let weekIndex = 0; !isAllDaysOfWeekOutOfMonth; weekIndex++) {
       let week: IDayInfo[] = [];
@@ -475,7 +506,8 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
           isInMonth: date.getMonth() === navigatedDate.getMonth(),
           isToday: compareDates(todaysDate, date),
           isSelected: isInDateRangeArray(date, selectedDates),
-          onSelected: this._onSelectDate.bind(this, originalDate)
+          onSelected: this._onSelectDate.bind(this, originalDate),
+          isInBounds: (minDate ? compareDatePart(minDate, date) < 1 : true) && (maxDate ? compareDatePart(date, maxDate) < 1 : true)
         };
 
         week.push(dayInfo);
@@ -494,4 +526,15 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
 
     return weeks;
   }
-}
+
+  private _getBoundedDateRange(dateRange: Date[], minDate?: Date, maxDate?: Date): Date[] {
+    let boundedDateRange = [...dateRange];
+    if (minDate) {
+      boundedDateRange = boundedDateRange.filter((date) => compareDatePart(date, minDate as Date) >= 0);
+    }
+    if (maxDate) {
+      boundedDateRange = boundedDateRange.filter((date) => compareDatePart(date, maxDate as Date) <= 0);
+    }
+    return boundedDateRange;
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
index 947d036669ecc..5e2993b717583 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
@@ -8,7 +8,7 @@ import {
 } from '../../Utilities';
 import { ICalendarStrings, ICalendarIconStrings, ICalendarFormatDateCallbacks } from './Calendar.Props';
 import { FocusZone } from '../../FocusZone';
-import { addYears, setMonth } from '../../utilities/dateMath/DateMath';
+import { addYears, setMonth, getYearStart, getYearEnd, getMonthStart, getMonthEnd, compareDatePart } from '../../utilities/dateMath/DateMath';
 import { Icon } from '../../Icon';
 import * as stylesImport from './Calendar.scss';
 const styles: any = stylesImport;
@@ -23,6 +23,8 @@ export interface ICalendarMonthProps extends React.Props<CalendarMonth> {
   onHeaderSelect?: (focus: boolean) => void;
   navigationIcons: ICalendarIconStrings;
   dateTimeFormatter: ICalendarFormatDateCallbacks;
+  minDate?: Date;
+  maxDate?: Date;
 }
 
 export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
@@ -49,16 +51,22 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
 
   public render() {
 
-    let { navigatedDate, strings, today, highlightCurrentMonth, navigationIcons, dateTimeFormatter } = this.props;
+    let { navigatedDate, strings, today, highlightCurrentMonth, navigationIcons, dateTimeFormatter, minDate, maxDate } = this.props;
     let leftNavigationIcon = navigationIcons.leftNavigation;
     let rightNavigationIcon = navigationIcons.rightNavigation;
 
+    // determine if previous/next years are in bounds
+    const isPrevYearInBounds = minDate ? compareDatePart(minDate, getYearStart(navigatedDate)) < 0 : true;
+    const isNextYearInBounds = maxDate ? compareDatePart(getYearEnd(navigatedDate), maxDate) < 0 : true;
+
     return (
       <div className={ css('ms-DatePicker-monthPicker', styles.monthPicker) }>
         <div className={ css('ms-DatePicker-yearComponents', styles.yearComponents) }>
           <div className={ css('ms-DatePicker-navContainer', styles.navContainer) }>
             <span
-              className={ css('ms-DatePicker-prevYear js-prevYear', styles.prevYear) }
+              className={ css('ms-DatePicker-prevYear js-prevYear', styles.prevYear, {
+                ['ms-DatePicker-prevYear--disabled ' + styles.prevYearIsDisabled]: !isPrevYearInBounds
+              }) }
               onClick={ this._onSelectPrevYear }
               onKeyDown={ this._onSelectPrevYearKeyDown }
               aria-label={ strings.prevYearAriaLabel ? strings.prevYearAriaLabel + ' ' + dateTimeFormatter.formatYear(addYears(navigatedDate, -1)) : undefined }
@@ -68,7 +76,9 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
               <Icon iconName={ getRTL() ? rightNavigationIcon : leftNavigationIcon } />
             </span>
             <span
-              className={ css('ms-DatePicker-nextYear js-nextYear', styles.nextYear) }
+              className={ css('ms-DatePicker-nextYear js-nextYear', styles.nextYear, {
+                ['ms-DatePicker-nextYear--disabled ' + styles.nextYearIsDisabled]: !isNextYearInBounds
+              }) }
               onClick={ this._onSelectNextYear }
               onKeyDown={ this._onSelectNextYearKeyDown }
               aria-label={ strings.nextYearAriaLabel ? strings.nextYearAriaLabel + ' ' + dateTimeFormatter.formatYear(addYears(navigatedDate, 1)) : undefined }
@@ -102,26 +112,34 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
             className={ css('ms-DatePicker-optionGrid', styles.optionGrid) }
             role='grid'
           >
-            { strings.shortMonths.map((month, index) =>
-              <span
-                role='gridcell'
+            { strings.shortMonths.map((month, index) => {
+
+              const indexedMonth = setMonth(navigatedDate, index);
+              const isCurrentMonth = this._isCurrentMonth(index, navigatedDate.getFullYear(), today!);
+              const isNavigatedMonth = navigatedDate.getMonth() === index;
+              const isInBounds = (minDate ? compareDatePart(minDate, getMonthEnd(indexedMonth)) < 1 : true) &&
+                (maxDate ? compareDatePart(getMonthStart(indexedMonth), maxDate) < 1 : true);
+
+              return <span
+                role={ 'gridcell' }
                 className={
-                  css('ms-DatePicker-monthOption',
-                    styles.monthOption,
+                  css('ms-DatePicker-monthOption', styles.monthOption,
                     {
-                      ['ms-DatePicker-day--today ' + styles.monthIsCurrentMonth]: highlightCurrentMonth && this._isCurrentMonth(index, navigatedDate.getFullYear(), today!),
-                      ['ms-DatePicker-day--highlighted ' + styles.monthIsHighlighted]: highlightCurrentMonth && (navigatedDate.getMonth() === index)
+                      ['ms-DatePicker-day--today ' + styles.monthIsCurrentMonth]: highlightCurrentMonth && isCurrentMonth!,
+                      ['ms-DatePicker-day--highlighted ' + styles.monthIsHighlighted]: highlightCurrentMonth && isNavigatedMonth,
+                      ['ms-DatePicker-monthOption--disabled ' + styles.monthOptionIsDisabled]: !isInBounds
                     })
                 }
                 key={ index }
-                onClick={ this._selectMonthCallbacks[index] }
-                aria-label={ dateTimeFormatter.formatMonthYear(setMonth(navigatedDate, index), strings) }
-                aria-selected={ this._isCurrentMonth(index, navigatedDate.getFullYear(), today!) || (navigatedDate.getMonth() === index) }
-                data-is-focusable={ true }
-                ref={ navigatedDate.getMonth() === index ? 'navigatedMonth' : undefined }
+                onClick={ isInBounds ? this._selectMonthCallbacks[index] : undefined }
+                aria-label={ dateTimeFormatter.formatMonthYear(indexedMonth, strings) }
+                aria-selected={ isCurrentMonth || isNavigatedMonth }
+                data-is-focusable={ isInBounds ? true : undefined }
+                ref={ isNavigatedMonth ? 'navigatedMonth' : undefined }
               >
                 { month }
-              </span>
+              </span>;
+            }
             ) }
           </div>
         </FocusZone>
diff --git a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts
index f0a6ad38103e1..5c1fa97cecdeb 100644
--- a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts
+++ b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts
@@ -411,4 +411,24 @@ describe('DateMath', () => {
     expected = 52;
     expect(result).toEqual(expected);
   });
+
+  it('can get the month start and end', () => {
+    let date = new Date('Dec 15 2017');
+
+    // First day of month
+    expect(DateMath.compareDates(new Date('Dec 1 2017'), DateMath.getMonthStart(date))).toBe(true);
+
+    // Last day of month
+    expect(DateMath.compareDates(new Date('Dec 31 2017'), DateMath.getMonthEnd(date))).toBe(true);
+  });
+
+  it('can get the year start and end', () => {
+    let date = new Date('Dec 15 2017');
+
+    // First day of year
+    expect(DateMath.compareDates(new Date('Jan 1 2017'), DateMath.getYearStart(date))).toBe(true);
+
+    // Last day of year
+    expect(DateMath.compareDates(new Date('Dec 31 2017'), DateMath.getYearEnd(date))).toBe(true);
+  });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
index 599f136445df7..0c35b321d6a6a 100644
--- a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
+++ b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
@@ -67,6 +67,42 @@ export function addYears(date: Date, years: number): Date {
   return result;
 }
 
+/**
+ * Returns a date that is the first day of the month of the provided date.
+ * @param {Date} date - The origin date
+ * @return {Date} A new Date object with the day set to the first day of the month.
+ */
+export function getMonthStart(date: Date): Date {
+  return new Date(date.getFullYear(), date.getMonth(), 1, 0, 0, 0, 0);
+}
+
+/**
+ * Returns a date that is the last day of the month of the provided date.
+ * @param {Date} date - The origin date
+ * @return {Date} A new Date object with the day set to the last day of the month.
+ */
+export function getMonthEnd(date: Date): Date {
+  return new Date(date.getFullYear(), date.getMonth() + 1, 0, 0, 0, 0, 0);
+}
+
+/**
+ * Returns a date that is the first day of the year of the provided date.
+ * @param {Date} date - The origin date
+ * @return {Date} A new Date object with the day set to the first day of the year.
+ */
+export function getYearStart(date: Date): Date {
+  return new Date(date.getFullYear(), 0, 1, 0, 0, 0, 0);
+}
+
+/**
+ * Returns a date that is the last day of the year of the provided date.
+ * @param {Date} date - The origin date
+ * @return {Date} A new Date object with the day set to the last day of the year.
+ */
+export function getYearEnd(date: Date): Date {
+  return new Date(date.getFullYear() + 1, 0, 0, 0, 0, 0, 0);
+}
+
 /**
  * Returns a date that is a copy of the given date, aside from the month changing to the given month.
  *  The method tries to preserve the day-of-month; however, if the new month does not have enough days

From aee444245b1b78a3a8dc7f5321fad5ae5c45b995 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Fri, 3 Nov 2017 12:34:23 -0700
Subject: [PATCH 0977/1641] Update README.md

---
 README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/README.md b/README.md
index e0fb8e5bcf491..2552301619fa3 100644
--- a/README.md
+++ b/README.md
@@ -41,7 +41,7 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import { Button } from 'office-ui-fabric-react/lib/Button';
 
-const MyPage = () => (<div><Button>I am a button.</Button></div>);
+const MyPage = () => (<Button>I am a button.</Button>);
 
 ReactDOM.render(<MyPage />, document.body.firstChild);
 ```

From 24fecdb8f7b338c793542b18a4bce2d9c32998a5 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 3 Nov 2017 12:36:11 -0700
Subject: [PATCH 0978/1641] Update README.md

---
 README.md | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/README.md b/README.md
index 2552301619fa3..3cfb4c003e016 100644
--- a/README.md
+++ b/README.md
@@ -39,11 +39,14 @@ The library includes commonjs entry points under the lib folder. To use a contro
 ```js
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
-import { Button } from 'office-ui-fabric-react/lib/Button';
-
-const MyPage = () => (<Button>I am a button.</Button>);
-
-ReactDOM.render(<MyPage />, document.body.firstChild);
+import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
+
+ReactDOM.render(
+  <PrimaryButton>
+    I am a button.
+  </PrimaryButton>,
+  document.body.firstChild
+);
 ```
 
 ## Browser support

From 5346d5adda7957fceffdf7381620780ce9efda81 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sun, 5 Nov 2017 15:03:44 -0800
Subject: [PATCH 0979/1641] Persona: respecting PersonaSize legacy values.
 (#3311)

* Fixing persona.

* add change file.
---
 apps/vr-tests/src/stories/Persona.stories.tsx | 183 +++++++++++++-----
 .../fix-persona_2017-11-05-22-16.json         |  11 ++
 .../src/components/Persona/Persona.tsx        |   2 +-
 .../src/components/Persona/PersonaCoin.tsx    |  10 +-
 .../src/components/Persona/PersonaConsts.ts   |  16 +-
 5 files changed, 162 insertions(+), 60 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-persona_2017-11-05-22-16.json

diff --git a/apps/vr-tests/src/stories/Persona.stories.tsx b/apps/vr-tests/src/stories/Persona.stories.tsx
index b000971f00106..2ae265794024c 100644
--- a/apps/vr-tests/src/stories/Persona.stories.tsx
+++ b/apps/vr-tests/src/stories/Persona.stories.tsx
@@ -27,66 +27,149 @@ storiesOf('Persona', module)
       { story() }
     </Screener>
   ))
-  .add('Tiny', () => (
-    <Persona
-      { ...examplePersona }
-      size={ PersonaSize.size10 }
-      presence={ PersonaPresence.offline }
-    />
-  )).add('Extra extra small', () => (
-    <Persona
-      { ...examplePersona }
-      size={ PersonaSize.size24 }
-      presence={ PersonaPresence.none }
-    />
-  )).add('Size 28', () => (
-    <Persona
-      { ...examplePersona }
-      size={ PersonaSize.size28 }
-      presence={ PersonaPresence.none }
-    />
-  )).add('Extra small', () => (
+  .add('size10 (tiny)', () => (
+    <div>
+      <Persona
+        { ...examplePersona }
+        size={ PersonaSize.size10 }
+        presence={ PersonaPresence.offline }
+      />
+      <Persona
+        { ...examplePersona }
+        size={ PersonaSize.tiny }
+        presence={ PersonaPresence.offline }
+      />
+    </div>
+  )).add('size24 (extraExtraSmall)', () => (
+    <div>
+      <Persona
+        { ...examplePersona }
+        size={ PersonaSize.size24 }
+        presence={ PersonaPresence.none }
+      />
+      <Persona
+        { ...examplePersona }
+        size={ PersonaSize.extraExtraSmall }
+        presence={ PersonaPresence.none }
+      />
+    </div>
+  )).add('size28 (extraSmall)', () => (
+    <div>
+      <Persona
+        { ...examplePersona }
+        size={ PersonaSize.size28 }
+        presence={ PersonaPresence.none }
+      />
+      <Persona
+        { ...examplePersona }
+        size={ PersonaSize.extraSmall }
+        presence={ PersonaPresence.none }
+      />
+    </div>
+  )).add('size32', () => (
     <Persona
       { ...examplePersona }
       size={ PersonaSize.size32 }
       presence={ PersonaPresence.online }
     />
-  )).add('Extra small with details', () => (
-    <Persona
-      { ...examplePersona }
-      size={ PersonaSize.size32 }
-      presence={ PersonaPresence.none }
-      showSecondaryText
-    />
-  )).add('Small', () => (
-    <Persona
-      { ...examplePersona }
-      size={ PersonaSize.size40 }
-      presence={ PersonaPresence.away }
-    />
-  )).add('Medium', () => (
-    <Persona
-      { ...examplePersona }
-      presence={ PersonaPresence.busy }
-    />
-  )).add('Medium, details hidden', () => (
+  )).add('size40 (small)', () => (
+    <div>
+      <Persona
+        { ...examplePersona }
+        size={ PersonaSize.size40 }
+        presence={ PersonaPresence.none }
+        showSecondaryText
+      />
+      <Persona
+        { ...examplePersona }
+        size={ PersonaSize.small }
+        presence={ PersonaPresence.none }
+        showSecondaryText
+      />
+    </div>
+  )).add('size48 (regular)', () => (
+    <div>
+      <Persona
+        { ...examplePersona }
+        size={ PersonaSize.size48 }
+        presence={ PersonaPresence.away }
+      />
+      <Persona
+        { ...examplePersona }
+        size={ PersonaSize.regular }
+        presence={ PersonaPresence.away }
+      />
+    </div>
+  )).add('default size, presences', () => (
+    <div>
+      <Persona
+        { ...examplePersona }
+        primaryText='PersonaPresence.away'
+        presence={ PersonaPresence.away }
+      />
+      <Persona
+        { ...examplePersona }
+        primaryText='PersonaPresence.blocked'
+        presence={ PersonaPresence.blocked }
+      />
+      <Persona
+        { ...examplePersona }
+        primaryText='PersonaPresence.busy'
+        presence={ PersonaPresence.busy }
+      />
+      <Persona
+        { ...examplePersona }
+        primaryText='PersonaPresence.dnd'
+        presence={ PersonaPresence.dnd }
+      />
+      <Persona
+        { ...examplePersona }
+        primaryText='PersonaPresence.none'
+        presence={ PersonaPresence.none }
+      />
+      <Persona
+        { ...examplePersona }
+        primaryText='PersonaPresence.offline'
+        presence={ PersonaPresence.offline }
+      />
+      <Persona
+        { ...examplePersona }
+        primaryText='PersonaPresence.online'
+        presence={ PersonaPresence.online }
+      />
+    </div>
+  )).add('default size, details hidden', () => (
     <Persona
       { ...examplePersona }
       presence={ PersonaPresence.busy }
       hidePersonaDetails
     />
-  )).add('Large', () => (
-    <Persona
-      { ...examplePersona }
-      size={ PersonaSize.size72 }
-      presence={ PersonaPresence.dnd }
-    />
-  )).add('Extra large', () => (
-    <Persona
-      { ...examplePersona }
-      size={ PersonaSize.size100 }
-      presence={ PersonaPresence.blocked }
-    />
+  )).add('size72 (large)', () => (
+    <div>
+      <Persona
+        { ...examplePersona }
+        size={ PersonaSize.size72 }
+        presence={ PersonaPresence.dnd }
+      />
+      <Persona
+        { ...examplePersona }
+        size={ PersonaSize.large }
+        presence={ PersonaPresence.dnd }
+      />
+    </div>
+  )).add('size100 (extraLarge)', () => (
+    <div>
+      <Persona
+        { ...examplePersona }
+        size={ PersonaSize.size100 }
+        presence={ PersonaPresence.blocked }
+      />
+      <Persona
+        { ...examplePersona }
+        size={ PersonaSize.extraLarge }
+        presence={ PersonaPresence.blocked }
+      />
+    </div>
   )).add('Initials', () => (
     <Persona
       { ...examplePersona }
diff --git a/common/changes/office-ui-fabric-react/fix-persona_2017-11-05-22-16.json b/common/changes/office-ui-fabric-react/fix-persona_2017-11-05-22-16.json
new file mode 100644
index 0000000000000..9c507835f1bd7
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-persona_2017-11-05-22-16.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Persona: respecting the deprecated PersonaSize enum values to avoid breaking changes.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index 0324b9cb06c2a..36e495e8f10a0 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -111,7 +111,7 @@ export class Persona extends BaseComponent<IPersonaProps, {}> {
         style={ coinSize ? { height: coinSize, minWidth: coinSize } : undefined }
       >
         <PersonaCoin { ...personaCoinProps } />
-        { (!hidePersonaDetails || (size === PersonaSize.size10)) && personaDetails }
+        { (!hidePersonaDetails || (size === PersonaSize.size10 || size === PersonaSize.tiny)) && personaDetails }
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
index 2244692fe7a89..536536bdc1568 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
@@ -26,6 +26,14 @@ import * as stylesImport from './Persona.scss';
 const styles: any = stylesImport;
 
 const SIZE_TO_PIXELS = {
+  [PersonaSize.tiny]: 20,
+  [PersonaSize.extraExtraSmall]: 24,
+  [PersonaSize.extraSmall]: 28,
+  [PersonaSize.small]: 40,
+  [PersonaSize.regular]: 48,
+  [PersonaSize.large]: 72,
+  [PersonaSize.extraLarge]: 100,
+
   [PersonaSize.size24]: 24,
   [PersonaSize.size28]: 28,
   [PersonaSize.size10]: 20,
@@ -107,7 +115,7 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
         { ...divProps }
         className={ css('ms-Persona-coin', PERSONA_SIZE[size]) }
       >
-        { size !== PersonaSize.size10 ? (
+        { (size !== PersonaSize.size10 && size !== PersonaSize.tiny) ? (
           <div
             { ...coinProps }
             className={ css('ms-Persona-imageArea', styles.imageArea) }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts b/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
index 61d20737f6496..03873d13c388b 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
@@ -8,18 +8,18 @@ const styles: any = stylesImport;
 
 export const PERSONA_SIZE = {
   // All non-numerically named sizes are deprecated, use the numerically named classes below
-  [PersonaSize.tiny]: 'ms-Persona--tiny ' + styles.rootIsTiny + styles.rootIssize10,
-  [PersonaSize.extraExtraSmall]: 'ms-Persona--xxs ' + styles.rootIsExtraExtraSmall + styles.rootIsSize24,
-  [PersonaSize.extraSmall]: 'ms-Persona--xs ' + styles.rootIsExtraSmall + styles.rootIsSize28,
-  [PersonaSize.small]: 'ms-Persona--sm ' + styles.rootIsSmall + styles.rootIsSize40,
+  [PersonaSize.tiny]: 'ms-Persona--tiny ' + styles.rootIsSize10,
+  [PersonaSize.extraExtraSmall]: 'ms-Persona--xxs ' + styles.rootIsSize24,
+  [PersonaSize.extraSmall]: 'ms-Persona--xs ' + styles.rootIsSize28,
+  [PersonaSize.small]: 'ms-Persona--sm ' + styles.rootIsSize40,
   [PersonaSize.regular]: '',
-  [PersonaSize.large]: 'ms-Persona--lg ' + styles.rootIsLarge + styles.rootIsSize72,
-  [PersonaSize.extraLarge]: 'ms-Persona--xl ' + styles.rootIsExtraLarge + styles.rootIsSize100,
+  [PersonaSize.large]: 'ms-Persona--lg ' + styles.rootIsSize72,
+  [PersonaSize.extraLarge]: 'ms-Persona--xl ' + styles.rootIsSize100,
 
-  [PersonaSize.size28]: 'ms-Persona--size28 ' + styles.rootIsSize28,
-  [PersonaSize.size16]: 'ms-Persona--size16 ' + styles.rootIsSize16,
   [PersonaSize.size10]: 'ms-Persona--size10 ' + styles.rootIsSize10,
+  [PersonaSize.size16]: 'ms-Persona--size16 ' + styles.rootIsSize16,
   [PersonaSize.size24]: 'ms-Persona--size24 ' + styles.rootIsSize24,
+  [PersonaSize.size28]: 'ms-Persona--size28 ' + styles.rootIsSize28,
   [PersonaSize.size32]: 'ms-Persona--size32 ' + styles.rootIsSize32,
   [PersonaSize.size40]: 'ms-Persona--size40 ' + styles.rootIsSize40,
   [PersonaSize.size48]: 'ms-Persona--size48 ' + styles.rootIsSize48,

From 8047387e472e2159c2b708decc059be40cd8ce6f Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Sun, 5 Nov 2017 15:27:33 -0800
Subject: [PATCH 0980/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../calendar-minmax_2017-10-27-16-08.json     | 11 --------
 .../fix-persona_2017-11-05-22-16.json         | 11 --------
 .../persona-polish_2017-11-01-22-23.json      | 11 --------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 26 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 14 +++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 12 files changed, 46 insertions(+), 41 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/calendar-minmax_2017-10-27-16-08.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-persona_2017-11-05-22-16.json
 delete mode 100644 common/changes/office-ui-fabric-react/persona-polish_2017-11-01-22-23.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 07384c113a099..cd6c6de467c14 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.19.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.20.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 251a121d7d987..53a15494041c6 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.19.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.20.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 9640738d0c41c..355169f746391 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.19.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.20.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 3b7de70802ea4..8e89047afa86b 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.19.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.20.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 74831a147df0c..92e9a7f3704ef 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.19.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.20.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/calendar-minmax_2017-10-27-16-08.json b/common/changes/office-ui-fabric-react/calendar-minmax_2017-10-27-16-08.json
deleted file mode 100644
index de1b800a8e40b..0000000000000
--- a/common/changes/office-ui-fabric-react/calendar-minmax_2017-10-27-16-08.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Allow optional minimum and maximum date boundaries on Calendar component. ",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "evlevy@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-persona_2017-11-05-22-16.json b/common/changes/office-ui-fabric-react/fix-persona_2017-11-05-22-16.json
deleted file mode 100644
index 9c507835f1bd7..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-persona_2017-11-05-22-16.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Persona: respecting the deprecated PersonaSize enum values to avoid breaking changes.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/persona-polish_2017-11-01-22-23.json b/common/changes/office-ui-fabric-react/persona-polish_2017-11-01-22-23.json
deleted file mode 100644
index bcf556c719e19..0000000000000
--- a/common/changes/office-ui-fabric-react/persona-polish_2017-11-01-22-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Persona: Renamed Persona size12 to Persona size10. Polished style to reflect the toolkit.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 5cf6790b6f2cf..64c0ccd6bf72d 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.19.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.20.0 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index f5660962b6d1d..e73aa4765b816 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.20.0",
+      "tag": "office-ui-fabric-react_v5.20.0",
+      "date": "Sun, 05 Nov 2017 23:27:32 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Evan Levy <33076550+evlevy@users.noreply.github.com>",
+            "commit": "f8fee750ee10805a19b4dfad0b6e3093199d92b8",
+            "comment": "Allow optional minimum and maximum date boundaries on Calendar component. "
+          }
+        ],
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "5346d5adda7957fceffdf7381620780ce9efda81",
+            "comment": "Persona: respecting the deprecated PersonaSize enum values to avoid breaking changes."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "5d816416e75063a88919e4d7fbdd01f3a6fa7020",
+            "comment": "Persona: Renamed Persona size12 to Persona size10. Polished style to reflect the toolkit."
+          }
+        ]
+      }
+    },
     {
       "version": "5.19.1",
       "tag": "office-ui-fabric-react_v5.19.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 73211913321a8..b4882f66e573a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,18 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 03 Nov 2017 15:06:54 GMT and should not be manually modified.
+This log was last generated on Sun, 05 Nov 2017 23:27:32 GMT and should not be manually modified.
+
+## 5.20.0
+Sun, 05 Nov 2017 23:27:32 GMT
+
+### Minor changes
+
+- Allow optional minimum and maximum date boundaries on Calendar component. 
+
+### Patches
+
+- Persona: respecting the deprecated PersonaSize enum values to avoid breaking changes.
+- Persona: Renamed Persona size12 to Persona size10. Polished style to reflect the toolkit.
 
 ## 5.19.1
 Fri, 03 Nov 2017 15:06:54 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index d94b9824b67cf..b4fdc30a9941a 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.19.1",
+  "version": "5.20.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 165410693af6956c62b0e61f151569c8e37e7edf Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 6 Nov 2017 10:21:41 -0800
Subject: [PATCH 0981/1641] Fix persona import to be amd compliant. (#3317)

* fixing import.j

* adding change file.
---
 .../fix-persona-import_2017-11-06-18-20.json          | 11 +++++++++++
 .../src/components/Persona/PersonaCoin.tsx            |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-persona-import_2017-11-06-18-20.json

diff --git a/common/changes/office-ui-fabric-react/fix-persona-import_2017-11-06-18-20.json b/common/changes/office-ui-fabric-react/fix-persona-import_2017-11-06-18-20.json
new file mode 100644
index 0000000000000..bdff888efb61d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-persona-import_2017-11-06-18-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixing Icon amd import.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
index 536536bdc1568..c5d7eff243c02 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
@@ -21,7 +21,7 @@ import {
 } from './PersonaConsts';
 import {
   Icon
-} from '../Icon';
+} from '../../Icon';
 import * as stylesImport from './Persona.scss';
 const styles: any = stylesImport;
 

From 5ff8c7c30cff1b5bd9050c1cde2b6a7534fbf414 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 6 Nov 2017 10:44:43 -0800
Subject: [PATCH 0982/1641] Applying package updates.

---
 apps/fabric-website/package.json                   |  2 +-
 apps/ssr-tests/package.json                        |  2 +-
 apps/test-bundle-button/package.json               |  2 +-
 apps/todo-app/package.json                         |  2 +-
 apps/vr-tests/package.json                         |  2 +-
 .../fix-persona-import_2017-11-06-18-20.json       | 11 -----------
 packages/experiments/package.json                  |  2 +-
 packages/office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md       |  9 ++++++++-
 packages/office-ui-fabric-react/package.json       |  2 +-
 10 files changed, 29 insertions(+), 19 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/fix-persona-import_2017-11-06-18-20.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index cd6c6de467c14..b3daf755b9140 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.20.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.20.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 53a15494041c6..965ea7ad2ca58 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.20.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.20.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 355169f746391..5af9ca183b1d7 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.20.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.20.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 8e89047afa86b..a04d0031f3c70 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.20.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.20.1 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 92e9a7f3704ef..676d1ee27d56a 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.20.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.20.1 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/fix-persona-import_2017-11-06-18-20.json b/common/changes/office-ui-fabric-react/fix-persona-import_2017-11-06-18-20.json
deleted file mode 100644
index bdff888efb61d..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-persona-import_2017-11-06-18-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixing Icon amd import.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 64c0ccd6bf72d..e99f9ce7cd36c 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.20.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.20.1 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index e73aa4765b816..e16aa07a03f4c 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.20.1",
+      "tag": "office-ui-fabric-react_v5.20.1",
+      "date": "Mon, 06 Nov 2017 18:44:43 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "165410693af6956c62b0e61f151569c8e37e7edf",
+            "comment": "Fixing Icon amd import."
+          }
+        ]
+      }
+    },
     {
       "version": "5.20.0",
       "tag": "office-ui-fabric-react_v5.20.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index b4882f66e573a..7fc50883b7cfd 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Sun, 05 Nov 2017 23:27:32 GMT and should not be manually modified.
+This log was last generated on Mon, 06 Nov 2017 18:44:43 GMT and should not be manually modified.
+
+## 5.20.1
+Mon, 06 Nov 2017 18:44:43 GMT
+
+### Patches
+
+- Fixing Icon amd import.
 
 ## 5.20.0
 Sun, 05 Nov 2017 23:27:32 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index b4fdc30a9941a..99b9cfd51b8b8 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.20.0",
+  "version": "5.20.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 3106efb71237b4bffcc85fd286dd4ad3aa1c886c Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Mon, 6 Nov 2017 12:37:41 -0800
Subject: [PATCH 0983/1641] Checkbox: Expose icon props for the check mark
 (#3292)

* Allow custom checkmark icons

* Rush change

* Make checkmark icon props optional
---
 .../checkmark-icon_2017-11-01-22-37.json              | 11 +++++++++++
 .../src/components/Checkbox/Checkbox.Props.ts         |  6 ++++++
 .../src/components/Checkbox/Checkbox.tsx              |  5 +++--
 3 files changed, 20 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/checkmark-icon_2017-11-01-22-37.json

diff --git a/common/changes/office-ui-fabric-react/checkmark-icon_2017-11-01-22-37.json b/common/changes/office-ui-fabric-react/checkmark-icon_2017-11-01-22-37.json
new file mode 100644
index 0000000000000..cac44a3bd476b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/checkmark-icon_2017-11-01-22-37.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Checkbox: Expose icon props for the check mark",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
index a05bb39e96722..230791b048a40 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { IStyle, ITheme } from '../../Styling';
 import { IRenderFunction } from '../../Utilities';
+import { IIconProps } from '../Icon/Icon.Props';
 
 /**
  * Checkbox class interface.
@@ -98,6 +99,11 @@ export interface ICheckboxProps extends React.ButtonHTMLAttributes<HTMLElement |
    * Custom render function for the label.
    */
   onRenderLabel?: IRenderFunction<ICheckboxProps>;
+
+  /**
+   * Custom icon props for the check mark rendered by the checkbox
+   */
+  checkmarkIconProps?: IIconProps;
 }
 
 export interface ICheckboxStyles {
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
index 69eb70b3bef88..ac4821ee60af4 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
@@ -81,7 +81,8 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
       ariaLabelledBy,
       ariaDescribedBy,
       styles: customStyles,
-      onRenderLabel = this._onRenderLabel
+      onRenderLabel = this._onRenderLabel,
+      checkmarkIconProps,
     } = this.props;
 
     const isChecked = checked === undefined ? this.state.isChecked : checked;
@@ -118,7 +119,7 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
       >
         <label className={ this._classNames.label } htmlFor={ this._id } >
           <div className={ this._classNames.checkbox }>
-            <Icon iconName='CheckMark' className={ this._classNames.checkmark } />
+            <Icon iconName='CheckMark' {...checkmarkIconProps} className={ this._classNames.checkmark } />
           </div>
           { onRenderLabel(this.props, this._onRenderLabel) }
         </label>

From d93bec6b7e866a697ef4a108289c861becacb7ad Mon Sep 17 00:00:00 2001
From: lejimsft <32402358+lejimsft@users.noreply.github.com>
Date: Mon, 6 Nov 2017 15:21:41 -0800
Subject: [PATCH 0984/1641] Leji/context menu state (#3321)

* added aria-expanded property so that narrator will announce expand/collapse state of a menu item that has submenu items.

* adding change file
---
 .../leji-contextMenu-state_2017-11-06-19-54.json      | 11 +++++++++++
 .../src/components/ContextualMenu/ContextualMenu.tsx  |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/leji-contextMenu-state_2017-11-06-19-54.json

diff --git a/common/changes/office-ui-fabric-react/leji-contextMenu-state_2017-11-06-19-54.json b/common/changes/office-ui-fabric-react/leji-contextMenu-state_2017-11-06-19-54.json
new file mode 100644
index 0000000000000..6056194b37995
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/leji-contextMenu-state_2017-11-06-19-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "added aira0expanded property to contextMenu item so that narrator will announce expand/collapse state of a menu item if it has submenu items.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "leji@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index e0c86474ac3ba..8e171dfe70fb9 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -503,6 +503,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       'aria-label': ariaLabel,
       'aria-haspopup': hasSubmenuItems(item) || null,
       'aria-owns': item.key === expandedMenuItemKey ? subMenuId : null,
+      'aria-expanded': hasSubmenuItems(item) ? item.key === expandedMenuItemKey : null,
       'aria-checked': isChecked,
       'aria-posinset': focusableElementIndex + 1,
       'aria-setsize': totalItemCount,

From 021448a342bb50273c48ef46ea910e01f7a31925 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 7 Nov 2017 11:22:31 +0000
Subject: [PATCH 0985/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../checkmark-icon_2017-11-01-22-37.json      | 11 -----------
 ...ji-contextMenu-state_2017-11-06-19-54.json | 11 -----------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 11 files changed, 35 insertions(+), 30 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/checkmark-icon_2017-11-01-22-37.json
 delete mode 100644 common/changes/office-ui-fabric-react/leji-contextMenu-state_2017-11-06-19-54.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index b3daf755b9140..3ae89f561eaa4 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.20.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.20.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 965ea7ad2ca58..c4e0d2dc99d8e 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.20.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.20.2 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 5af9ca183b1d7..df19718f2fe37 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.20.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.20.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index a04d0031f3c70..c0111233e33e6 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.20.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.20.2 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 676d1ee27d56a..24d696fd2df6f 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.20.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.20.2 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/checkmark-icon_2017-11-01-22-37.json b/common/changes/office-ui-fabric-react/checkmark-icon_2017-11-01-22-37.json
deleted file mode 100644
index cac44a3bd476b..0000000000000
--- a/common/changes/office-ui-fabric-react/checkmark-icon_2017-11-01-22-37.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Checkbox: Expose icon props for the check mark",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/leji-contextMenu-state_2017-11-06-19-54.json b/common/changes/office-ui-fabric-react/leji-contextMenu-state_2017-11-06-19-54.json
deleted file mode 100644
index 6056194b37995..0000000000000
--- a/common/changes/office-ui-fabric-react/leji-contextMenu-state_2017-11-06-19-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "added aira0expanded property to contextMenu item so that narrator will announce expand/collapse state of a menu item if it has submenu items.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "leji@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index e99f9ce7cd36c..b79daec7f993c 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.20.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.20.2 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index e16aa07a03f4c..989ad9abc3db8 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.20.2",
+      "tag": "office-ui-fabric-react_v5.20.2",
+      "date": "Tue, 07 Nov 2017 11:22:30 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "3106efb71237b4bffcc85fd286dd4ad3aa1c886c",
+            "comment": "Checkbox: Expose icon props for the check mark"
+          },
+          {
+            "author": "lejimsft <32402358+lejimsft@users.noreply.github.com>",
+            "commit": "d93bec6b7e866a697ef4a108289c861becacb7ad",
+            "comment": "added aira0expanded property to contextMenu item so that narrator will announce expand/collapse state of a menu item if it has submenu items."
+          }
+        ]
+      }
+    },
     {
       "version": "5.20.1",
       "tag": "office-ui-fabric-react_v5.20.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 7fc50883b7cfd..3a86a6522003b 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 06 Nov 2017 18:44:43 GMT and should not be manually modified.
+This log was last generated on Tue, 07 Nov 2017 11:22:31 GMT and should not be manually modified.
+
+## 5.20.2
+Tue, 07 Nov 2017 11:22:30 GMT
+
+### Patches
+
+- Checkbox: Expose icon props for the check mark
+- added aira0expanded property to contextMenu item so that narrator will announce expand/collapse state of a menu item if it has submenu items.
 
 ## 5.20.1
 Mon, 06 Nov 2017 18:44:43 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 99b9cfd51b8b8..af23746d9e314 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.20.1",
+  "version": "5.20.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 41f4a086881f10b30ab8159e66c559be7042eea7 Mon Sep 17 00:00:00 2001
From: Evan Levy <evlevy@microsoft.com>
Date: Tue, 7 Nov 2017 13:13:21 -0500
Subject: [PATCH 0986/1641] Add Calendar with date boundary example (#3306)

* Add Calendar with date boundary example

* Update CalendarPage.tsx
---
 .../src/components/Calendar/CalendarPage.tsx     | 16 ++++++++++++++++
 .../examples/Calendar.Inline.Example.tsx         | 10 ++++++++++
 2 files changed, 26 insertions(+)

diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
index 95483509ea715..ed21dce1020d3 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
@@ -10,12 +10,14 @@ import { CalendarButtonExample } from './examples/Calendar.Button.Example';
 import { CalendarInlineExample } from './examples/Calendar.Inline.Example';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { CalendarStatus } from './Calendar.checklist';
+import { addMonths, addYears } from '../../utilities/dateMath/DateMath';
 
 const CalendarButtonExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx') as string;
 const CalendarInlineExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx') as string;
 
 export class CalendarPage extends React.Component<IComponentDemoPageProps, any> {
   public render() {
+    const today = new Date(Date.now());
     return (
       <ComponentPage
         title={ 'Calendar' }
@@ -93,6 +95,20 @@ export class CalendarPage extends React.Component<IComponentDemoPageProps, any>
                 isDayPickerVisible={ false }
               />
             </ExampleCard>
+            <ExampleCard
+              title='Inline Calendar with date boundary (minDate, maxDate)'
+              code={ CalendarInlineExampleCode }
+            >
+              <CalendarInlineExample
+                dateRangeType={ DateRangeType.Day }
+                autoNavigateOnSelection={ true }
+                highlightCurrentMonth={ true }
+                showGoToToday={ false }
+                minDate={ addMonths(today, -1) }
+                maxDate={ addYears(today, 1) }
+              />
+
+            </ExampleCard>
             <ExampleCard
               title='Calendar launched from a button'
               code={ CalendarButtonExampleCode }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
index 21d375938ed17..2ca2d0e7bba87 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
@@ -76,6 +76,8 @@ export interface ICalendarInlineExampleProps {
   isDayPickerVisible?: boolean;
   showMonthPickerAsOverlay?: boolean;
   showWeekNumbers?: boolean;
+  minDate?: Date;
+  maxDate?: Date;
 }
 
 export class CalendarInlineExample extends React.Component<ICalendarInlineExampleProps, ICalendarInlineExampleState> {
@@ -118,6 +120,12 @@ export class CalendarInlineExample extends React.Component<ICalendarInlineExampl
           Selected dates:
           <span> { !dateRangeString ? 'Not set' : dateRangeString }</span>
         </div>
+        { (this.props.minDate || this.props.maxDate) &&
+          <div>
+            Date boundary:
+            <span> { this.props.minDate ? this.props.minDate.toLocaleDateString() : 'Not set' }-{ this.props.maxDate ? this.props.maxDate.toLocaleDateString() : 'Not set' }</span>
+          </div>
+        }
         <Calendar
           onSelectDate={ this._onSelectDate }
           onDismiss={ this._onDismiss }
@@ -132,6 +140,8 @@ export class CalendarInlineExample extends React.Component<ICalendarInlineExampl
           isDayPickerVisible={ this.props.isDayPickerVisible }
           showMonthPickerAsOverlay={ this.props.showMonthPickerAsOverlay }
           showWeekNumbers={ this.props.showWeekNumbers }
+          minDate={ this.props.minDate }
+          maxDate={ this.props.maxDate }
         />
         { this.props.showNavigateButtons &&
           <div>

From 593e3aa8ea5b6e0aef67efc51b154513e6233ace Mon Sep 17 00:00:00 2001
From: Spencer Elliott <me@elliottsj.com>
Date: Tue, 7 Nov 2017 11:13:45 -0800
Subject: [PATCH 0987/1641] Preserve focus in DetailsList when items change
 (#3326)

When DetailsList `props.items` changes and the currently-focused item
is removed, restore focus to the item which is now at the index of the
previously-focused item. If the index of the previously-focused item is
out of range, select the last item.

This provides a better user experience for
those who use the keyboard to navigate.
---
 ...t-details-list-focus_2017-11-06-23-41.json | 11 ++++
 .../components/DetailsList/DetailsList.tsx    | 59 ++++++++++++++++---
 2 files changed, 61 insertions(+), 9 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/spelliot-details-list-focus_2017-11-06-23-41.json

diff --git a/common/changes/office-ui-fabric-react/spelliot-details-list-focus_2017-11-06-23-41.json b/common/changes/office-ui-fabric-react/spelliot-details-list-focus_2017-11-06-23-41.json
new file mode 100644
index 0000000000000..900f5dc0aceba
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/spelliot-details-list-focus_2017-11-06-23-41.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Preserve focus in DetailsList when items change",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "spelliot@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index fdddc26cdbf8f..302cefdf2cdb5 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -39,6 +39,8 @@ import { withViewport } from '../../utilities/decorators/withViewport';
 const styles: any = stylesImport;
 
 export interface IDetailsListState {
+  focusedItem?: DetailsRow;
+  focusedItemIndex: number;
   lastWidth?: number;
   lastSelectionMode?: SelectionMode;
   adjustedColumns?: IColumn[];
@@ -97,12 +99,15 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     this._onRowWillUnmount = this._onRowWillUnmount.bind(this);
     this._onToggleCollapse = this._onToggleCollapse.bind(this);
     this._onActiveRowChanged = this._onActiveRowChanged.bind(this);
+    this._onBlur = this._onBlur.bind(this);
     this._onHeaderKeyDown = this._onHeaderKeyDown.bind(this);
     this._onContentKeyDown = this._onContentKeyDown.bind(this);
     this._onRenderCell = this._onRenderCell.bind(this);
     this._onGroupExpandStateChanged = this._onGroupExpandStateChanged.bind(this);
 
     this.state = {
+      focusedItem: undefined,
+      focusedItemIndex: -1,
       lastWidth: 0,
       adjustedColumns: this._getAdjustedColumns(props),
       isSizing: false,
@@ -143,6 +148,25 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       }
     }
 
+    if (
+      this.props.items !== prevProps.items &&
+      this.props.items.length > 0 &&
+      this.state.focusedItemIndex !== -1 &&
+      this.props.items.indexOf(this.state.focusedItem) === -1
+    ) {
+      // Item set has changed and previously-focused item is gone.
+      // Set focus to item at index of previously-focused item if it is in range,
+      // else set focus to the last item.
+      const item = this.state.focusedItemIndex < this.props.items.length
+        ? this.props.items[this.state.focusedItemIndex]
+        : this.props.items[this.props.items.length - 1];
+      const itemKey = this._getItemKey(item, this.state.focusedItemIndex);
+      const row = this._activeRows[itemKey];
+      if (row) {
+        this._setFocusToRow(row);
+      }
+    }
+
     if (this.props.onDidUpdate) {
       this.props.onDidUpdate(this);
     }
@@ -314,6 +338,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
               direction={ FocusZoneDirection.vertical }
               isInnerZoneKeystroke={ isRightArrow }
               onActiveElementChanged={ this._onActiveRowChanged }
+              onBlur={ this._onBlur }
             >
               <SelectionZone
                 ref={ this._resolveRef('_selectionZone') }
@@ -493,17 +518,20 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   private _setFocusToRowIfPending(row: DetailsRow) {
     const { itemIndex } = row.props;
     if (this._initialFocusedIndex !== undefined && itemIndex === this._initialFocusedIndex) {
-      if (this._selectionZone) {
-        this._selectionZone.ignoreNextFocus();
-      }
-      this._async.setTimeout(() => {
-        row.focus();
-      }, 0);
-
+      this._setFocusToRow(row);
       delete this._initialFocusedIndex;
     }
   }
 
+  private _setFocusToRow(row: DetailsRow) {
+    if (this._selectionZone) {
+      this._selectionZone.ignoreNextFocus();
+    }
+    this._async.setTimeout(() => {
+      row.focus();
+    }, 0);
+  }
+
   private _onRowWillUnmount(row: DetailsRow) {
     let { onRowWillUnmount } = this.props;
 
@@ -723,15 +751,28 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   private _onActiveRowChanged(el?: HTMLElement, ev?: React.FocusEvent<HTMLElement>) {
     let { items, onActiveItemChanged } = this.props;
 
-    if (!onActiveItemChanged || !el) {
+    if (!el) {
       return;
     }
     let index = Number(el.getAttribute('data-item-index'));
     if (index >= 0) {
-      onActiveItemChanged(items[index], index, ev);
+      if (onActiveItemChanged) {
+        onActiveItemChanged(items[index], index, ev);
+      }
+      this.setState({
+        focusedItem: items[index],
+        focusedItemIndex: index
+      });
     }
   }
 
+  private _onBlur(event: React.FocusEvent<HTMLElement>) {
+    this.setState({
+      focusedItem: undefined,
+      focusedItemIndex: -1
+    });
+  }
+
   private _getItemKey(item: any, itemIndex: number): string | number {
     const { getKey } = this.props;
 

From 662a8915c065283971b1153ce743db943e2af8bb Mon Sep 17 00:00:00 2001
From: John Lorenz <jcl47@duke.edu>
Date: Tue, 7 Nov 2017 12:33:10 -0800
Subject: [PATCH 0988/1641] trying to enable second codeowner for calendar
 components (#3330)

---
 .github/CODEOWNERS | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index 26300f59efb22..5361016596541 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -36,7 +36,7 @@
     # packages/office-ui-fabric-react/src/components/ActivityItem/*
     # packages/office-ui-fabric-react/src/components/Breadcrumb/*
     # packages/office-ui-fabric-react/src/components/Button/*
-    packages/office-ui-fabric-react/src/components/Calendar/*   @johannao76 @lorejoh12
+    packages/office-ui-fabric-react/src/components/Calendar/*   @johannao76 @lorejoh12@gmail.com @jolore@microsoft.com
     # packages/office-ui-fabric-react/src/components/Callout/*
     # packages/office-ui-fabric-react/src/components/Check/*
     # packages/office-ui-fabric-react/src/components/Checkbox/*
@@ -45,7 +45,7 @@
     # packages/office-ui-fabric-react/src/components/ComboBox/*
     packages/office-ui-fabric-react/src/components/CommandBar/*   @micahgodbolt
     # packages/office-ui-fabric-react/src/components/ContextualMenu/*
-    packages/office-ui-fabric-react/src/components/DatePicker/*   @johannao76 @lorejoh12
+    packages/office-ui-fabric-react/src/components/DatePicker/*   @johannao76 @lorejoh12@gmail.com @jolore@microsoft.com
     # packages/office-ui-fabric-react/src/components/DetailsList/*
     # packages/office-ui-fabric-react/src/components/Dialog/*
     # packages/office-ui-fabric-react/src/components/DocumentCard/*

From e30b47ff60bbbfe6a09d336224797606275b3c26 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 7 Nov 2017 15:55:09 -0800
Subject: [PATCH 0989/1641] Person: Polish documentation and custom variants
 (#3315)

* coinSize flex presence sizing and tooltip bug fix

* Persona variant spacing and cleanup

* Persona page titles

* Added change file

* Reversed coinSize flex presence sizing

* Update person-edge-polish_2017-11-06-16-27.json
---
 .../person-edge-polish_2017-11-06-16-27.json         | 11 +++++++++++
 .../src/components/Persona/Persona.tsx               | 10 ++++++++--
 .../src/components/Persona/PersonaPage.tsx           |  4 ++--
 .../Persona/examples/Persona.Alternate.Example.tsx   |  3 ++-
 .../examples/Persona.CustomRender.Example.tsx        | 12 +++++++-----
 .../Persona/examples/Persona.Initials.Example.tsx    |  3 ++-
 .../components/Persona/examples/PersonaExample.scss  |  4 ++++
 7 files changed, 36 insertions(+), 11 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/person-edge-polish_2017-11-06-16-27.json

diff --git a/common/changes/office-ui-fabric-react/person-edge-polish_2017-11-06-16-27.json b/common/changes/office-ui-fabric-react/person-edge-polish_2017-11-06-16-27.json
new file mode 100644
index 0000000000000..ab1b6295d063b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/person-edge-polish_2017-11-06-16-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Persona: DirectionalHint for Tooltip location, polished example spacing and documentation on PersonaPage.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index 36e495e8f10a0..a646a331cf7cd 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -7,7 +7,7 @@ import {
   getNativeProps,
   IRenderFunction
 } from '../../Utilities';
-import { TooltipHost, TooltipOverflowMode } from '../../Tooltip';
+import { TooltipHost, TooltipOverflowMode, DirectionalHint } from '../../Tooltip';
 import { PersonaCoin } from './PersonaCoin';
 import {
   IPersonaProps,
@@ -122,7 +122,13 @@ export class Persona extends BaseComponent<IPersonaProps, {}> {
       <div className={ className }>
         { render
           ? render(this.props)
-          : <TooltipHost content={ text } overflowMode={ TooltipOverflowMode.Parent }>{ text }</TooltipHost>
+          : <TooltipHost
+            content={ text }
+            overflowMode={ TooltipOverflowMode.Parent }
+            directionalHint={ DirectionalHint.topLeftEdge }
+          >
+            { text }
+          </TooltipHost>
         }
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
index c034c31d01760..645ccf305ea3f 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
@@ -31,10 +31,10 @@ export class PersonaPage extends React.Component<IComponentDemoPageProps, {}> {
             <ExampleCard title='Alternative small personas' code={ PersonaAlternateExampleCode }>
               <PersonaAlternateExample />
             </ExampleCard>
-            <ExampleCard title='Persona in initials' code={ PersonaInitialsExampleCode }>
+            <ExampleCard title='Persona with initials' code={ PersonaInitialsExampleCode }>
               <PersonaInitialsExample />
             </ExampleCard>
-            <ExampleCard title='Rendering custom persona text' code={ PersonaCustomRenderExampleCode }>
+            <ExampleCard title='Rendering custom persona text and custom coin size' code={ PersonaCustomRenderExampleCode }>
               <PersonaCustomRenderExample />
             </ExampleCard>
           </div>
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Alternate.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Alternate.Example.tsx
index 56e44962d79a2..c79a5890f12d0 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Alternate.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Alternate.Example.tsx
@@ -5,6 +5,7 @@ import {
   PersonaPresence
 } from 'office-ui-fabric-react/lib/Persona';
 import { TestImages } from '../../../common/TestImages';
+import './PersonaExample.scss';
 
 const examplePersona = {
   imageUrl: TestImages.personaMale,
@@ -28,7 +29,7 @@ export class PersonaAlternateExample extends React.Component<React.Props<Persona
     let { renderPersonaDetails } = this.state;
 
     return (
-      <div>
+      <div className='ms-PersonaExample'>
         <Persona
           { ...examplePersona }
           size={ PersonaSize.size24 }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx
index 796b1615370a4..2049e558024c5 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx
@@ -7,8 +7,10 @@ import {
   PersonaPresence
 } from 'office-ui-fabric-react/lib/Persona';
 import { Icon } from 'office-ui-fabric-react/lib/Icon';
-import './PersonaExample.scss';
 import { TestImages } from '../../../common/TestImages';
+import './PersonaExample.scss';
+import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
+const exampleStyles: any = exampleStylesImport;
 
 const examplePersona = {
   imageUrl: TestImages.personaFemale,
@@ -26,19 +28,19 @@ export class PersonaCustomRenderExample extends React.Component<React.Props<Pers
 
   public render() {
     return (
-      <div>
+      <div className='ms-PersonaExample'>
+        <div className={ exampleStyles.exampleLabel }>Custom icon in secondary text</div>
         <Persona
           { ...examplePersona }
           size={ PersonaSize.size72 }
           presence={ PersonaPresence.offline }
           onRenderSecondaryText={ this._onRenderSecondaryText }
         />
-        <div>custom coin size = 150, Persona size is size100.</div>
+        <div className={ exampleStyles.exampleLabel }>Custom coin size = 150</div>
         <Persona
           { ...examplePersona }
-          size={ PersonaSize.size100 }
           coinSize={ 150 }
-          presence={ PersonaPresence.offline }
+          presence={ PersonaPresence.online }
           onRenderSecondaryText={ this._onRenderSecondaryText }
         />
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Initials.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Initials.Example.tsx
index 4fd7292f6668f..cba8dc222a5ea 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Initials.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Initials.Example.tsx
@@ -3,6 +3,7 @@ import {
   Persona,
   PersonaInitialsColor,
 } from 'office-ui-fabric-react/lib/Persona';
+import './PersonaExample.scss';
 
 const examplePersona = {
   secondaryText: 'Designer',
@@ -19,7 +20,7 @@ const personaWithInitials = {
 export class PersonaInitialsExample extends React.Component<any, any> {
   public render() {
     return (
-      <div>
+      <div className='ms-PersonaExample'>
         <Persona
           { ...examplePersona  }
           primaryText='Kat Larrson'
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/PersonaExample.scss b/packages/office-ui-fabric-react/src/components/Persona/examples/PersonaExample.scss
index eacbd1da8d60c..3f6089366153c 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/PersonaExample.scss
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/PersonaExample.scss
@@ -1,4 +1,8 @@
 :global {
+  .ms-PersonaExample .ms-Persona {
+    margin: 0 0 10px 0;
+  }
+
   .ms-JobIconExample {
     margin-right: 5px;
   }

From 6055741480986f3e593feaf297001c6cec698b64 Mon Sep 17 00:00:00 2001
From: chaofeng2014 <fengchao199011@hotmail.com>
Date: Tue, 7 Nov 2017 20:01:32 -0800
Subject: [PATCH 0990/1641] Publish a new version of utilities (#3336)

* update utilities version

* update utilities with a new version

* Update focus.ts
---
 ...utilities_NewVersion_Publish_2017-11-08-01-02.json | 11 +++++++++++
 1 file changed, 11 insertions(+)
 create mode 100644 common/changes/@uifabric/utilities/chf-2017-11-utilities_NewVersion_Publish_2017-11-08-01-02.json

diff --git a/common/changes/@uifabric/utilities/chf-2017-11-utilities_NewVersion_Publish_2017-11-08-01-02.json b/common/changes/@uifabric/utilities/chf-2017-11-utilities_NewVersion_Publish_2017-11-08-01-02.json
new file mode 100644
index 0000000000000..06739d0da331a
--- /dev/null
+++ b/common/changes/@uifabric/utilities/chf-2017-11-utilities_NewVersion_Publish_2017-11-08-01-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Update @uifabric/utilities",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "chf@microsoft.com"
+}
\ No newline at end of file

From f35ef51ff9ca57ba057c7edd54c9548f0cebae7a Mon Sep 17 00:00:00 2001
From: KatherineThayerMicrosoft <kathayer@microsoft.com>
Date: Tue, 7 Nov 2017 20:05:23 -0800
Subject: [PATCH 0991/1641] Selection: fix bug in setItems (#3337)

* Fix selection bug

* Add change file

* Update kathayer-fixselection_2017-11-08-01-39.json
---
 .../kathayer-fixselection_2017-11-08-01-39.json       | 11 +++++++++++
 .../src/utilities/selection/Selection.ts              |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/kathayer-fixselection_2017-11-08-01-39.json

diff --git a/common/changes/office-ui-fabric-react/kathayer-fixselection_2017-11-08-01-39.json b/common/changes/office-ui-fabric-react/kathayer-fixselection_2017-11-08-01-39.json
new file mode 100644
index 0000000000000..13e1c52f5b535
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kathayer-fixselection_2017-11-08-01-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Selection: calling `setItems` with new items will now invalidate the internal selection array.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kathayer@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts b/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
index 13c319b420b11..908233730a509 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
@@ -165,6 +165,7 @@ export class Selection implements ISelection {
     this._keyToIndexMap = newKeyToIndexMap;
     this._unselectableIndices = newUnselectableIndices;
     this._items = items || [];
+    this._selectedItems = null;
 
     if (hasSelectionChanged) {
       this._change();

From 124c231295cce3b2afa794507e890398929da37e Mon Sep 17 00:00:00 2001
From: lejimsft <32402358+lejimsft@users.noreply.github.com>
Date: Tue, 7 Nov 2017 20:08:26 -0800
Subject: [PATCH 0992/1641] Leji/add atp signal (#3334)

* Adding ATP signal

* adding change file
---
 .../leji-add-ATP-signal_2017-11-07-22-02.json         | 11 +++++++++++
 .../experiments/src/components/signals/Signals.scss   |  5 +++++
 .../experiments/src/components/signals/Signals.tsx    | 10 ++++++++++
 3 files changed, 26 insertions(+)
 create mode 100644 common/changes/@uifabric/experiments/leji-add-ATP-signal_2017-11-07-22-02.json

diff --git a/common/changes/@uifabric/experiments/leji-add-ATP-signal_2017-11-07-22-02.json b/common/changes/@uifabric/experiments/leji-add-ATP-signal_2017-11-07-22-02.json
new file mode 100644
index 0000000000000..abaaac0a73767
--- /dev/null
+++ b/common/changes/@uifabric/experiments/leji-add-ATP-signal_2017-11-07-22-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "added ATP signal",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "leji@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/signals/Signals.scss b/packages/experiments/src/components/signals/Signals.scss
index 98c98b59d70c1..288f5e6d67315 100644
--- a/packages/experiments/src/components/signals/Signals.scss
+++ b/packages/experiments/src/components/signals/Signals.scss
@@ -88,6 +88,11 @@
   }
 }
 
+.atp {
+  color: $ms-color-redDark;
+  top: 3px;
+}
+
 .signal {
   transition: color 0.2s linear;
 
diff --git a/packages/experiments/src/components/signals/Signals.tsx b/packages/experiments/src/components/signals/Signals.tsx
index cdd226b513b1c..facd5bb08a155 100644
--- a/packages/experiments/src/components/signals/Signals.tsx
+++ b/packages/experiments/src/components/signals/Signals.tsx
@@ -243,3 +243,13 @@ export const SharedSignal: Signal = (props: ISignalProps): JSX.Element => {
     />
   );
 };
+
+export const ATPSignal: Signal = (props: ISignalProps): JSX.Element => {
+  return (
+    <Icon
+      ariaLabel={ props.ariaLabel }
+      className={ css(SignalStyles.signal, SignalStyles.atp) }
+      iconName='ATPLogo'
+    />
+  );
+};
\ No newline at end of file

From ca846b94cc96cdafc6a73c0ef2d6ad3aa9b77e75 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 8 Nov 2017 06:05:34 +0000
Subject: [PATCH 0993/1641] Applying package updates.

---
 .../leji-add-ATP-signal_2017-11-07-22-02.json | 11 -------
 ...s_NewVersion_Publish_2017-11-08-01-02.json | 11 -------
 ...athayer-fixselection_2017-11-08-01-39.json | 11 -------
 .../person-edge-polish_2017-11-06-16-27.json  | 11 -------
 ...t-details-list-focus_2017-11-06-23-41.json | 11 -------
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/CHANGELOG.json           | 19 ++++++++++++
 packages/experiments/CHANGELOG.md             |  9 +++++-
 packages/experiments/package.json             |  4 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 29 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 11 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 +++++++++
 packages/utilities/CHANGELOG.md               |  9 +++++-
 packages/utilities/package.json               |  2 +-
 16 files changed, 95 insertions(+), 65 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/leji-add-ATP-signal_2017-11-07-22-02.json
 delete mode 100644 common/changes/@uifabric/utilities/chf-2017-11-utilities_NewVersion_Publish_2017-11-08-01-02.json
 delete mode 100644 common/changes/office-ui-fabric-react/kathayer-fixselection_2017-11-08-01-39.json
 delete mode 100644 common/changes/office-ui-fabric-react/person-edge-polish_2017-11-06-16-27.json
 delete mode 100644 common/changes/office-ui-fabric-react/spelliot-details-list-focus_2017-11-06-23-41.json

diff --git a/common/changes/@uifabric/experiments/leji-add-ATP-signal_2017-11-07-22-02.json b/common/changes/@uifabric/experiments/leji-add-ATP-signal_2017-11-07-22-02.json
deleted file mode 100644
index abaaac0a73767..0000000000000
--- a/common/changes/@uifabric/experiments/leji-add-ATP-signal_2017-11-07-22-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "added ATP signal",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "leji@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/chf-2017-11-utilities_NewVersion_Publish_2017-11-08-01-02.json b/common/changes/@uifabric/utilities/chf-2017-11-utilities_NewVersion_Publish_2017-11-08-01-02.json
deleted file mode 100644
index 06739d0da331a..0000000000000
--- a/common/changes/@uifabric/utilities/chf-2017-11-utilities_NewVersion_Publish_2017-11-08-01-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Update @uifabric/utilities",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "chf@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kathayer-fixselection_2017-11-08-01-39.json b/common/changes/office-ui-fabric-react/kathayer-fixselection_2017-11-08-01-39.json
deleted file mode 100644
index 13e1c52f5b535..0000000000000
--- a/common/changes/office-ui-fabric-react/kathayer-fixselection_2017-11-08-01-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Selection: calling `setItems` with new items will now invalidate the internal selection array.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kathayer@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/person-edge-polish_2017-11-06-16-27.json b/common/changes/office-ui-fabric-react/person-edge-polish_2017-11-06-16-27.json
deleted file mode 100644
index ab1b6295d063b..0000000000000
--- a/common/changes/office-ui-fabric-react/person-edge-polish_2017-11-06-16-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Persona: DirectionalHint for Tooltip location, polished example spacing and documentation on PersonaPage.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/spelliot-details-list-focus_2017-11-06-23-41.json b/common/changes/office-ui-fabric-react/spelliot-details-list-focus_2017-11-06-23-41.json
deleted file mode 100644
index 900f5dc0aceba..0000000000000
--- a/common/changes/office-ui-fabric-react/spelliot-details-list-focus_2017-11-06-23-41.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Preserve focus in DetailsList when items change",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "spelliot@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index d312e67cbbb79..f6635a08086b0 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -39,7 +39,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.6.1 <6.0.0",
-    "@uifabric/utilities": ">=5.3.0 <6.0.0",
+    "@uifabric/utilities": ">=5.3.1 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index ee2148806a9bb..f666e909bc9ac 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.5.0",
+      "tag": "@uifabric/experiments_v5.5.0",
+      "date": "Wed, 08 Nov 2017 06:05:34 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "lejimsft <32402358+lejimsft@users.noreply.github.com>",
+            "commit": "124c231295cce3b2afa794507e890398929da37e",
+            "comment": "added ATP signal"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.20.2 <6.0.0` to `>=5.20.3 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.4.0",
       "tag": "@uifabric/experiments_v5.4.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 0f3ecaad4a278..7ebcd73b44e92 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Thu, 02 Nov 2017 18:20:18 GMT and should not be manually modified.
+This log was last generated on Wed, 08 Nov 2017 06:05:34 GMT and should not be manually modified.
+
+## 5.5.0
+Wed, 08 Nov 2017 06:05:34 GMT
+
+### Minor changes
+
+- added ATP signal
 
 ## 5.4.0
 Thu, 02 Nov 2017 18:20:18 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index b79daec7f993c..e378635a29a9b 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.4.0",
+  "version": "5.5.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.20.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.20.3 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 989ad9abc3db8..02e2a7aca8e56 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,35 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.20.3",
+      "tag": "office-ui-fabric-react_v5.20.3",
+      "date": "Wed, 08 Nov 2017 06:05:34 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "KatherineThayerMicrosoft <kathayer@microsoft.com>",
+            "commit": "f35ef51ff9ca57ba057c7edd54c9548f0cebae7a",
+            "comment": "Selection: calling `setItems` with new items will now invalidate the internal selection array."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "e30b47ff60bbbfe6a09d336224797606275b3c26",
+            "comment": "Persona: DirectionalHint for Tooltip location, polished example spacing and documentation on PersonaPage."
+          },
+          {
+            "author": "Spencer Elliott <me@elliottsj.com>",
+            "commit": "593e3aa8ea5b6e0aef67efc51b154513e6233ace",
+            "comment": "Preserve focus in DetailsList when items change"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.3.0 <6.0.0` to `>=5.3.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.20.2",
       "tag": "office-ui-fabric-react_v5.20.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 3a86a6522003b..cb299fccddc03 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,15 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 07 Nov 2017 11:22:31 GMT and should not be manually modified.
+This log was last generated on Wed, 08 Nov 2017 06:05:34 GMT and should not be manually modified.
+
+## 5.20.3
+Wed, 08 Nov 2017 06:05:34 GMT
+
+### Patches
+
+- Selection: calling `setItems` with new items will now invalidate the internal selection array.
+- Persona: DirectionalHint for Tooltip location, polished example spacing and documentation on PersonaPage.
+- Preserve focus in DetailsList when items change
 
 ## 5.20.2
 Tue, 07 Nov 2017 11:22:30 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index af23746d9e314..167ba6f73f36b 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.20.2",
+  "version": "5.20.3",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -48,7 +48,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.5.1 <6.0.0",
     "@uifabric/styling": ">=5.6.1 <6.0.0",
-    "@uifabric/utilities": ">=5.3.0 <6.0.0",
+    "@uifabric/utilities": ">=5.3.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 6d6d4d3f9af11..bc63b05d9d004 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -21,7 +21,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=5.3.0 <6.0.0",
+    "@uifabric/utilities": ">=5.3.1 <6.0.0",
     "@uifabric/merge-styles": ">=5.5.1 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 4d59e823c51a7..4ffb78763eb37 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.3.1",
+      "tag": "@uifabric/utilities_v5.3.1",
+      "date": "Wed, 08 Nov 2017 06:05:34 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "chaofeng2014 <fengchao199011@hotmail.com>",
+            "commit": "6055741480986f3e593feaf297001c6cec698b64",
+            "comment": "Update @uifabric/utilities"
+          }
+        ]
+      }
+    },
     {
       "version": "5.3.0",
       "tag": "@uifabric/utilities_v5.3.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index f0f3cd5b9fd19..3d46c8db70469 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Wed, 18 Oct 2017 10:21:25 GMT and should not be manually modified.
+This log was last generated on Wed, 08 Nov 2017 06:05:34 GMT and should not be manually modified.
+
+## 5.3.1
+Wed, 08 Nov 2017 06:05:34 GMT
+
+### Patches
+
+- Update @uifabric/utilities
 
 ## 5.3.0
 Wed, 18 Oct 2017 10:21:25 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index c81bb96a189d8..23681c0514c96 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.3.0",
+  "version": "5.3.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 07ff9612172861245b7cf01ffa38f9c5167e5d3a Mon Sep 17 00:00:00 2001
From: Cody Hoover <hoovercj@users.noreply.github.com>
Date: Wed, 8 Nov 2017 07:09:33 +0100
Subject: [PATCH 0994/1641] Modify how setPeriodicReset works (#3248)

* Only set a global timeout when measure is called

This PR addresses #3226 by removing the automatic call to `setPeriodicReset`. Now it is only called when `measure` is called. This prevents unnecessary resets from occurring before measure is even called.

Additionally, `reset` no longer calls `setPeriodicReset`, and instead waits again for the next `measure` to set the timeout.

* changes needed to submit PR
---
 .../@uifabric/utilities/patch-1_2017-10-27-10-12.json | 11 +++++++++++
 packages/utilities/src/FabricPerformance.ts           |  8 +++++---
 2 files changed, 16 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/patch-1_2017-10-27-10-12.json

diff --git a/common/changes/@uifabric/utilities/patch-1_2017-10-27-10-12.json b/common/changes/@uifabric/utilities/patch-1_2017-10-27-10-12.json
new file mode 100644
index 0000000000000..857d523affb40
--- /dev/null
+++ b/common/changes/@uifabric/utilities/patch-1_2017-10-27-10-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "This PR addresses #3226 by removing the automatic call to `setPeriodicReset`. Now it is only called when `measure` is called. This prevents unnecessary resets from occurring before measure is even called. Additionally, `reset` no longer calls `setPeriodicReset`, and instead waits again for the next `measure` to set the timeout.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "cohoov@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/src/FabricPerformance.ts b/packages/utilities/src/FabricPerformance.ts
index 4b68917b90205..f76c25e13ac7f 100644
--- a/packages/utilities/src/FabricPerformance.ts
+++ b/packages/utilities/src/FabricPerformance.ts
@@ -40,6 +40,7 @@ const RESET_INTERVAL = 3 * 60 * 1000; // auto reset every 3 minutes
 export class FabricPerformance {
   public static summary: IPerfSummary = {};
   private static _timeoutId: number;
+
   /**
    * Measures execution time of the given syncronous function. If the same logic is executed multiple times,
    * each individual measurement will be collected as well the overall numbers.
@@ -47,6 +48,9 @@ export class FabricPerformance {
    * @param func - The logic to be measured for execution time
    */
   public static measure(name: string, func: () => void): void {
+    if (Number.isInteger(FabricPerformance._timeoutId)) {
+      FabricPerformance.setPeriodicReset();
+    }
     const start = now();
     func();
     const end = now();
@@ -68,12 +72,10 @@ export class FabricPerformance {
   public static reset(): void {
     FabricPerformance.summary = {};
     clearTimeout(FabricPerformance._timeoutId);
-    FabricPerformance.setPeriodicReset();
+    FabricPerformance._timeoutId = NaN;
   }
 
   public static setPeriodicReset(): void {
     FabricPerformance._timeoutId = setTimeout(() => FabricPerformance.reset(), RESET_INTERVAL);
   }
 }
-
-FabricPerformance.setPeriodicReset();

From 4af244d78e2887009a852192cc8bb4e23278adb9 Mon Sep 17 00:00:00 2001
From: MaxLustig <maxslustig@gmail.com>
Date: Tue, 7 Nov 2017 22:10:09 -0800
Subject: [PATCH 0995/1641] Fix alignment for trending icon in list (#3277)

* Fix alignment with trending icon

* Rush change

* Use flex-box instead of padding to center icon
---
 .../maxlus-trendingIcon_2017-10-31-22-12.json        | 11 +++++++++++
 .../experiments/src/components/signals/Signals.scss  |  6 ++++++
 .../experiments/src/components/signals/Signals.tsx   | 12 +++++++-----
 3 files changed, 24 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/maxlus-trendingIcon_2017-10-31-22-12.json

diff --git a/common/changes/@uifabric/experiments/maxlus-trendingIcon_2017-10-31-22-12.json b/common/changes/@uifabric/experiments/maxlus-trendingIcon_2017-10-31-22-12.json
new file mode 100644
index 0000000000000..bf4c6b3e28f01
--- /dev/null
+++ b/common/changes/@uifabric/experiments/maxlus-trendingIcon_2017-10-31-22-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Fix alignment with trending icon",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "maxlus@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/signals/Signals.scss b/packages/experiments/src/components/signals/Signals.scss
index 288f5e6d67315..6bff76a8a77b3 100644
--- a/packages/experiments/src/components/signals/Signals.scss
+++ b/packages/experiments/src/components/signals/Signals.scss
@@ -15,6 +15,12 @@
   }
 }
 
+.centeredSignal {
+    display: inline-flex;
+    flex-direction: column;
+    justify-content: center;
+}
+
 .newItem {
   width: 0;
   height: 1em;
diff --git a/packages/experiments/src/components/signals/Signals.tsx b/packages/experiments/src/components/signals/Signals.tsx
index facd5bb08a155..cb4c4e5d7aa7e 100644
--- a/packages/experiments/src/components/signals/Signals.tsx
+++ b/packages/experiments/src/components/signals/Signals.tsx
@@ -113,11 +113,13 @@ export const AwaitingApprovalSignal: Signal = (props: ISignalProps): JSX.Element
 
 export const TrendingSignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
-    <Icon
-      ariaLabel={ props.ariaLabel }
-      className={ css(SignalStyles.signal, SignalStyles.trending) }
-      iconName='market'
-    />
+    <span className={ css(SignalStyles.signal, SignalStyles.centeredSignal) }>
+      <Icon
+        ariaLabel={ props.ariaLabel }
+        className={ css(SignalStyles.signal, SignalStyles.trending) }
+        iconName='market'
+      />
+    </span>
   );
 };
 

From d4b74705e7069a0a88261e644b499f75c450208b Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 8 Nov 2017 11:11:27 +0000
Subject: [PATCH 0996/1641] Applying package updates.

---
 .../maxlus-trendingIcon_2017-10-31-22-12.json      | 11 -----------
 .../utilities/patch-1_2017-10-27-10-12.json        | 11 -----------
 packages/example-app-base/package.json             |  2 +-
 packages/experiments/CHANGELOG.json                | 14 ++++++++++++++
 packages/experiments/CHANGELOG.md                  |  9 ++++++++-
 packages/experiments/package.json                  |  2 +-
 packages/office-ui-fabric-react/package.json       |  2 +-
 packages/styling/package.json                      |  2 +-
 packages/utilities/CHANGELOG.json                  | 14 ++++++++++++++
 packages/utilities/CHANGELOG.md                    |  9 ++++++++-
 packages/utilities/package.json                    |  2 +-
 11 files changed, 49 insertions(+), 29 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/maxlus-trendingIcon_2017-10-31-22-12.json
 delete mode 100644 common/changes/@uifabric/utilities/patch-1_2017-10-27-10-12.json

diff --git a/common/changes/@uifabric/experiments/maxlus-trendingIcon_2017-10-31-22-12.json b/common/changes/@uifabric/experiments/maxlus-trendingIcon_2017-10-31-22-12.json
deleted file mode 100644
index bf4c6b3e28f01..0000000000000
--- a/common/changes/@uifabric/experiments/maxlus-trendingIcon_2017-10-31-22-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Fix alignment with trending icon",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "maxlus@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/patch-1_2017-10-27-10-12.json b/common/changes/@uifabric/utilities/patch-1_2017-10-27-10-12.json
deleted file mode 100644
index 857d523affb40..0000000000000
--- a/common/changes/@uifabric/utilities/patch-1_2017-10-27-10-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "This PR addresses #3226 by removing the automatic call to `setPeriodicReset`. Now it is only called when `measure` is called. This prevents unnecessary resets from occurring before measure is even called. Additionally, `reset` no longer calls `setPeriodicReset`, and instead waits again for the next `measure` to set the timeout.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "cohoov@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index f6635a08086b0..d2206784c8543 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -39,7 +39,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.6.1 <6.0.0",
-    "@uifabric/utilities": ">=5.3.1 <6.0.0",
+    "@uifabric/utilities": ">=5.3.2 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index f666e909bc9ac..41e974a584dc0 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.5.1",
+      "tag": "@uifabric/experiments_v5.5.1",
+      "date": "Wed, 08 Nov 2017 11:11:27 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "MaxLustig <maxslustig@gmail.com>",
+            "commit": "4af244d78e2887009a852192cc8bb4e23278adb9",
+            "comment": "Fix alignment with trending icon"
+          }
+        ]
+      }
+    },
     {
       "version": "5.5.0",
       "tag": "@uifabric/experiments_v5.5.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 7ebcd73b44e92..ead55b788878a 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Wed, 08 Nov 2017 06:05:34 GMT and should not be manually modified.
+This log was last generated on Wed, 08 Nov 2017 11:11:27 GMT and should not be manually modified.
+
+## 5.5.1
+Wed, 08 Nov 2017 11:11:27 GMT
+
+### Patches
+
+- Fix alignment with trending icon
 
 ## 5.5.0
 Wed, 08 Nov 2017 06:05:34 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index e378635a29a9b..e7519e51c5031 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.5.0",
+  "version": "5.5.1",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 167ba6f73f36b..31d86514fca62 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -48,7 +48,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.5.1 <6.0.0",
     "@uifabric/styling": ">=5.6.1 <6.0.0",
-    "@uifabric/utilities": ">=5.3.1 <6.0.0",
+    "@uifabric/utilities": ">=5.3.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index bc63b05d9d004..022baa29b0b82 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -21,7 +21,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=5.3.1 <6.0.0",
+    "@uifabric/utilities": ">=5.3.2 <6.0.0",
     "@uifabric/merge-styles": ">=5.5.1 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 4ffb78763eb37..1612069acc9ca 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.3.2",
+      "tag": "@uifabric/utilities_v5.3.2",
+      "date": "Wed, 08 Nov 2017 11:11:27 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Cody Hoover <hoovercj@users.noreply.github.com>",
+            "commit": "07ff9612172861245b7cf01ffa38f9c5167e5d3a",
+            "comment": "This PR addresses #3226 by removing the automatic call to `setPeriodicReset`. Now it is only called when `measure` is called. This prevents unnecessary resets from occurring before measure is even called. Additionally, `reset` no longer calls `setPeriodicReset`, and instead waits again for the next `measure` to set the timeout."
+          }
+        ]
+      }
+    },
     {
       "version": "5.3.1",
       "tag": "@uifabric/utilities_v5.3.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 3d46c8db70469..bf0e0132e549b 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Wed, 08 Nov 2017 06:05:34 GMT and should not be manually modified.
+This log was last generated on Wed, 08 Nov 2017 11:11:27 GMT and should not be manually modified.
+
+## 5.3.2
+Wed, 08 Nov 2017 11:11:27 GMT
+
+### Patches
+
+- This PR addresses #3226 by removing the automatic call to `setPeriodicReset`. Now it is only called when `measure` is called. This prevents unnecessary resets from occurring before measure is even called. Additionally, `reset` no longer calls `setPeriodicReset`, and instead waits again for the next `measure` to set the timeout.
 
 ## 5.3.1
 Wed, 08 Nov 2017 06:05:34 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 23681c0514c96..f819f0d5c5287 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.3.1",
+  "version": "5.3.2",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 360596259b7e047fd6987cc05aafdc4f88d878d3 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 8 Nov 2017 12:25:00 -0800
Subject: [PATCH 0997/1641] Fix getIconClassName to return inline-block
 styling. (#3343)

* Icons registered from getIconClassName should have display: inline-block.

* Updating vr tests.

* change
---
 apps/vr-tests/src/stories/Icon.stories.tsx        | 15 +++++++++++++--
 .../styling/fixGetIconCN_2017-11-08-19-42.json    | 11 +++++++++++
 .../styling/src/utilities/getIconClassName.ts     |  5 +++++
 3 files changed, 29 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/fixGetIconCN_2017-11-08-19-42.json

diff --git a/apps/vr-tests/src/stories/Icon.stories.tsx b/apps/vr-tests/src/stories/Icon.stories.tsx
index c0b7395f49baa..07ae7372a7795 100644
--- a/apps/vr-tests/src/stories/Icon.stories.tsx
+++ b/apps/vr-tests/src/stories/Icon.stories.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 import Screener, { Steps } from 'screener-storybook/src/screener';
 import { storiesOf } from '@storybook/react';
 import { FabricDecorator } from '../utilities';
-import { Icon, IconType } from 'office-ui-fabric-react';
+import { Icon, IconType, getIconClassName } from 'office-ui-fabric-react';
 import { TestImages } from '../common/TestImages';
 
 storiesOf('Icon', module)
@@ -18,7 +18,18 @@ storiesOf('Icon', module)
       { story() }
     </Screener>
   )).add('Root', () => (
-    <Icon iconName='CompassNW' />
+    <div>
+      <div>
+        <Icon iconName='CompassNW' />
+        <Icon iconName='Upload' />
+        <Icon iconName='Share' />
+      </div>
+      <div>
+        <Icon className={ getIconClassName('CompassNW') } />
+        <Icon className={ getIconClassName('Upload') } />
+        <Icon className={ getIconClassName('Share') } />
+      </div>
+    </div>
   )).add('Color', () => (
     // tslint:disable-next-line:jsx-ban-props
     <Icon iconName={ 'CompassNW' } style={ { color: 'red' } } />
diff --git a/common/changes/@uifabric/styling/fixGetIconCN_2017-11-08-19-42.json b/common/changes/@uifabric/styling/fixGetIconCN_2017-11-08-19-42.json
new file mode 100644
index 0000000000000..7ea3fa4dca387
--- /dev/null
+++ b/common/changes/@uifabric/styling/fixGetIconCN_2017-11-08-19-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Updating `getIconClassName` to return display: inline-block to be consistent with the styled used by `ms-Icon ms-Icon--*`.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/styling/src/utilities/getIconClassName.ts b/packages/styling/src/utilities/getIconClassName.ts
index a589f67b7b126..945ab5e19350f 100644
--- a/packages/styling/src/utilities/getIconClassName.ts
+++ b/packages/styling/src/utilities/getIconClassName.ts
@@ -3,6 +3,10 @@ import {
 } from '@uifabric/merge-styles/lib/index';
 import { getIcon } from './icons';
 
+const defaultIconStyles = {
+  display: 'inline-block'
+};
+
 /**
  * Gets an icon classname. You should be able to add this classname to an I tag with no
  * additional classnames, and render the icon.
@@ -16,6 +20,7 @@ export function getIconClassName(name: string): string {
   if (icon) {
     className = mergeStyles(
       icon.subset.className,
+      defaultIconStyles,
       {
         selectors: {
           '::before': {

From 96f6e32d57bf08b76493fb090ff88c1ab0b23de8 Mon Sep 17 00:00:00 2001
From: Yimin Wu <yimwu@microsoft.com>
Date: Wed, 8 Nov 2017 12:58:17 -0800
Subject: [PATCH 0998/1641] Yimwu/pickerfocus (#3342)

* Add focusInput method in BasePicker to allow set focus to input element directly.

* Add change file
---
 .../yimwu-pickerfocus_2017-11-08-17-51.json           | 11 +++++++++++
 .../src/components/pickers/BasePicker.Props.ts        |  5 ++++-
 .../src/components/pickers/BasePicker.tsx             |  6 ++++++
 .../examples/PeoplePicker.Types.Example.tsx           |  2 +-
 4 files changed, 22 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/yimwu-pickerfocus_2017-11-08-17-51.json

diff --git a/common/changes/office-ui-fabric-react/yimwu-pickerfocus_2017-11-08-17-51.json b/common/changes/office-ui-fabric-react/yimwu-pickerfocus_2017-11-08-17-51.json
new file mode 100644
index 0000000000000..1d472eb13fa1e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/yimwu-pickerfocus_2017-11-08-17-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add focusInput method in BasePicker to allow set focus to input element directly.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "yimwu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
index d8a18da3bad53..e8881471f036d 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
@@ -9,8 +9,11 @@ export interface IBasePicker<T> {
   /** Gets the current value of the input. */
   items: T[] | undefined;
 
-  /** Sets focus to the input. */
+  /** Sets focus to the focus zone. */
   focus: () => void;
+
+  /** Set focus to the input */
+  focusInput: () => void;
 }
 
 // Type T is the type of the item that is displayed
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index e314dd200d10e..16bb878d4f589 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -101,6 +101,12 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     this.focusZone.focus();
   }
 
+  public focusInput() {
+    if (this.input) {
+      this.input.focus();
+    }
+  }
+
   @autobind
   public dismissSuggestions() {
     // Select the first suggestion if one is available when user leaves.
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index 51d6baf3e5d51..5843246c023bf 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -316,7 +316,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
   @autobind
   private _onSetFocusButtonClicked() {
     if (this._picker) {
-      this._picker.focus();
+      this._picker.focusInput();
     }
   }
 

From a0cc83c1f2ce44585d1af54a1fb4a189baf65c2e Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 8 Nov 2017 13:30:37 -0800
Subject: [PATCH 0999/1641] Bumping rush to 4.0, npm and node dependencies as
 well (#3344)

* Bumping rush, npm and node dependencies.

* Fixing build errors.
---
 .travis.yml                                   |     2 +-
 common/config/rush/command-line.json          |    12 +
 common/config/rush/npm-shrinkwrap.json        | 12137 ++++++++++------
 package.json                                  |     7 +-
 .../src/components/App/App.tsx                |     3 +-
 rush.json                                     |     6 +-
 6 files changed, 7365 insertions(+), 4802 deletions(-)
 create mode 100644 common/config/rush/command-line.json

diff --git a/.travis.yml b/.travis.yml
index ebfc16dc9df98..2bd87e1605382 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -1,6 +1,6 @@
 language: node_js
 node_js:
-  - '7'
+  - '8'
 script:
   - npm run buildfast
   - npm run bundlesize
diff --git a/common/config/rush/command-line.json b/common/config/rush/command-line.json
new file mode 100644
index 0000000000000..79341f3499911
--- /dev/null
+++ b/common/config/rush/command-line.json
@@ -0,0 +1,12 @@
+{
+  "customOptions": {
+    "--production": {
+      "optionType": "flag",
+      "description": "Builds production bits.",
+      "associatedCommands": [
+        "build",
+        "rebuild"
+      ]
+    }
+  }
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index eb066dab00872..57b1d2993b41d 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -2,6 +2,7 @@
   "name": "rush-common",
   "version": "0.0.0",
   "lockfileVersion": 1,
+  "requires": true,
   "dependencies": {
     "@hypnosphi/fuse.js": {
       "version": "3.0.9",
@@ -9,2952 +10,1388 @@
       "integrity": "sha1-6pn2EhtKjwZbTHH4VZXbJxRJiAc="
     },
     "@microsoft/load-themed-styles": {
-      "version": "1.7.5",
-      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.5.tgz",
-      "integrity": "sha1-KlXL2LP1TOy9I2ycP93AvBNWu8k="
+      "version": "1.7.8",
+      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.8.tgz",
+      "integrity": "sha1-W42m+k7d2pkYgU5+qYkyRYo6Xtw="
     },
     "@microsoft/loader-load-themed-styles": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.6.0.tgz",
-      "integrity": "sha1-apeiLzpi5UwLUwo+jxSYrSuE19w="
+      "version": "1.6.3",
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.6.3.tgz",
+      "integrity": "sha1-U9zUwqMA1jms14PxFr9wR3fpVjs=",
+      "requires": {
+        "@microsoft/load-themed-styles": "1.7.8",
+        "loader-utils": "1.1.0"
+      }
     },
     "@rush-temp/build": {
-      "version": "file:projects/build",
+      "version": "file:projects/build.tgz",
+      "integrity": "sha1-QyuX3XK61fNyPzj8Grpmem4luxU=",
+      "requires": {
+        "@microsoft/load-themed-styles": "1.7.8",
+        "@microsoft/loader-load-themed-styles": "1.6.3",
+        "autoprefixer": "7.1.6",
+        "awesome-typescript-loader": "3.3.0",
+        "bundlesize": "0.15.3",
+        "chalk": "2.3.0",
+        "command-line-args": "4.0.7",
+        "cpx": "1.5.0",
+        "css-loader": "0.28.7",
+        "github": "7.3.2",
+        "glob": "7.1.2",
+        "gzip-size": "3.0.0",
+        "jest": "21.2.1",
+        "json-loader": "0.5.7",
+        "mustache": "2.3.0",
+        "node-sass": "4.6.0",
+        "open": "0.0.5",
+        "postcss": "6.0.14",
+        "postcss-loader": "2.0.8",
+        "postcss-modules": "0.8.0",
+        "raw-loader": "0.5.1",
+        "sass-loader": "6.0.6",
+        "sinon": "4.1.2",
+        "source-map-loader": "0.2.3",
+        "style-loader": "0.18.2",
+        "ts-jest": "21.2.1",
+        "tslint": "5.8.0",
+        "tslint-microsoft-contrib": "5.0.1",
+        "typescript": "2.5.3",
+        "uglifyjs-webpack-plugin": "0.4.6",
+        "webpack": "3.8.1",
+        "webpack-bundle-analyzer": "2.9.0",
+        "webpack-dev-server": "2.9.4",
+        "webpack-notifier": "1.5.0",
+        "yargs": "6.6.0"
+      }
+    },
+    "@rush-temp/example-app-base": {
+      "version": "file:projects/example-app-base.tgz",
+      "integrity": "sha1-Ysmm2rkWSlOFLrvOsHbGufWf3bQ=",
+      "requires": {
+        "@types/chai": "3.4.35",
+        "@types/enzyme": "2.8.8",
+        "@types/es6-promise": "0.0.32",
+        "@types/highlight.js": "9.1.9",
+        "@types/mocha": "2.2.39",
+        "@types/react": "15.0.38",
+        "@types/react-addons-test-utils": "0.14.18",
+        "@types/react-dom": "15.5.1",
+        "@types/webpack-env": "1.13.0",
+        "enzyme": "2.9.1",
+        "es6-map": "0.1.5",
+        "es6-promise": "4.1.1",
+        "es6-weak-map": "2.0.2",
+        "highlight.js": "9.12.0",
+        "office-ui-fabric-react": "5.20.3",
+        "react": "15.6.2",
+        "react-addons-test-utils": "15.6.2",
+        "react-dom": "15.6.2",
+        "tslib": "1.8.0"
+      }
+    },
+    "@rush-temp/experiments": {
+      "version": "file:projects/experiments.tgz",
+      "integrity": "sha1-/9KdZYtmK1AmQAHPGxVIyGktxHo=",
+      "requires": {
+        "@microsoft/load-themed-styles": "1.7.8",
+        "@types/enzyme": "2.8.8",
+        "@types/es6-promise": "0.0.32",
+        "@types/jest": "21.1.5",
+        "@types/prop-types": "15.5.1",
+        "@types/react": "15.0.38",
+        "@types/react-addons-test-utils": "0.14.18",
+        "@types/react-dom": "15.5.1",
+        "@types/react-test-renderer": "15.5.5",
+        "@types/resemblejs": "1.3.28",
+        "@types/sinon": "2.2.2",
+        "@types/webpack-env": "1.13.0",
+        "enzyme": "2.9.1",
+        "es6-weak-map": "2.0.2",
+        "react": "15.6.2",
+        "react-addons-test-utils": "15.6.2",
+        "react-dom": "15.6.2",
+        "react-highlight": "0.9.0",
+        "react-test-renderer": "15.6.2",
+        "sinon": "2.4.1",
+        "tslib": "1.8.0"
+      },
       "dependencies": {
-        "acorn": {
-          "version": "5.1.1",
-          "bundled": true
-        },
-        "ajv": {
-          "version": "5.2.2",
-          "bundled": true
-        },
-        "ajv-keywords": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "ansi-regex": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "ansi-styles": {
-          "version": "2.2.1",
-          "bundled": true
-        },
-        "async": {
-          "version": "2.5.0",
-          "bundled": true
+        "lolex": {
+          "version": "1.6.0",
+          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
+          "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
         },
-        "autoprefixer": {
-          "version": "7.1.5",
-          "bundled": true,
-          "dependencies": {
-            "browserslist": {
-              "version": "2.5.1",
-              "bundled": true
-            }
+        "sinon": {
+          "version": "2.4.1",
+          "resolved": "https://registry.npmjs.org/sinon/-/sinon-2.4.1.tgz",
+          "integrity": "sha512-vFTrO9Wt0ECffDYIPSP/E5bBugt0UjcBQOfQUMh66xzkyPEnhl/vM2LRZi2ajuTdkH07sA6DzrM6KvdvGIH8xw==",
+          "requires": {
+            "diff": "3.4.0",
+            "formatio": "1.2.0",
+            "lolex": "1.6.0",
+            "native-promise-only": "0.8.1",
+            "path-to-regexp": "1.7.0",
+            "samsam": "1.3.0",
+            "text-encoding": "0.6.4",
+            "type-detect": "4.0.3"
           }
+        }
+      }
+    },
+    "@rush-temp/fabric-website": {
+      "version": "file:projects/fabric-website.tgz",
+      "integrity": "sha1-Qpha6ldq/d9xCDsIyu6ScWdN1PQ=",
+      "requires": {
+        "@microsoft/load-themed-styles": "1.7.8",
+        "@types/chai": "3.4.35",
+        "@types/enzyme": "2.8.8",
+        "@types/es6-promise": "0.0.32",
+        "@types/mocha": "2.2.39",
+        "@types/node": "8.0.26",
+        "@types/prop-types": "15.5.1",
+        "@types/react": "15.0.38",
+        "@types/react-dom": "15.5.1",
+        "@types/resemblejs": "1.3.28",
+        "@types/sinon": "2.2.2",
+        "@types/webpack-env": "1.13.0",
+        "color-functions": "1.1.0",
+        "enzyme": "2.9.1",
+        "es6-promise": "4.1.1",
+        "es6-weak-map": "2.0.2",
+        "highlight.js": "9.12.0",
+        "json-loader": "0.5.7",
+        "office-ui-fabric-core": "9.1.0",
+        "react": "15.6.2",
+        "react-dom": "15.6.2",
+        "react-highlight": "0.9.0",
+        "tslib": "1.8.0",
+        "write-file-webpack-plugin": "4.2.0"
+      }
+    },
+    "@rush-temp/icons": {
+      "version": "file:projects/icons.tgz",
+      "integrity": "sha1-GYYT4jX6C+/jrLc/0NNHpzIjACE=",
+      "requires": {
+        "tslib": "1.8.0"
+      }
+    },
+    "@rush-temp/jest-serializer-merge-styles": {
+      "version": "file:projects/jest-serializer-merge-styles.tgz",
+      "integrity": "sha1-ME7RL1ELOBB8bgof5tOy7DFYenw=",
+      "requires": {
+        "@types/jest": "21.1.0"
+      },
+      "dependencies": {
+        "@types/jest": {
+          "version": "21.1.0",
+          "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.0.tgz",
+          "integrity": "sha512-7W+tgzauU0s467L7SG1GuHKr4jOmMTXOvR78LP6/YfuaM8JNRF+ayV2+vmNmlaBhbNPvckeJfak2aP+7VJ3g5A=="
+        }
+      }
+    },
+    "@rush-temp/merge-styles": {
+      "version": "file:projects/merge-styles.tgz",
+      "integrity": "sha1-tqtj0H2w4fRqAk55j7TqrtaWlYw=",
+      "requires": {
+        "@types/jest": "21.1.0",
+        "tslib": "1.8.0"
+      },
+      "dependencies": {
+        "@types/jest": {
+          "version": "21.1.0",
+          "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.0.tgz",
+          "integrity": "sha512-7W+tgzauU0s467L7SG1GuHKr4jOmMTXOvR78LP6/YfuaM8JNRF+ayV2+vmNmlaBhbNPvckeJfak2aP+7VJ3g5A=="
+        }
+      }
+    },
+    "@rush-temp/office-ui-fabric-react": {
+      "version": "file:projects/office-ui-fabric-react.tgz",
+      "integrity": "sha1-MBCHesJH5L5/BOh7T0BNd4RQ9Y8=",
+      "requires": {
+        "@microsoft/load-themed-styles": "1.7.8",
+        "@types/enzyme": "2.8.8",
+        "@types/es6-promise": "0.0.32",
+        "@types/jest": "21.1.0",
+        "@types/prop-types": "15.5.1",
+        "@types/react": "15.0.38",
+        "@types/react-dom": "15.5.5",
+        "@types/react-test-renderer": "15.5.5",
+        "@types/resemblejs": "1.3.28",
+        "@types/sinon": "2.2.2",
+        "@types/webpack-env": "1.13.0",
+        "enzyme": "2.9.1",
+        "es6-map": "0.1.5",
+        "es6-promise": "4.1.1",
+        "es6-weak-map": "2.0.2",
+        "highlight.js": "9.12.0",
+        "office-ui-fabric-core": "9.1.0",
+        "prop-types": "15.6.0",
+        "react": "15.6.2",
+        "react-dom": "15.6.2",
+        "react-highlight": "0.9.0",
+        "react-test-renderer": "15.6.2",
+        "resemblejs": "2.2.6",
+        "sinon": "2.4.1",
+        "tslib": "1.8.0"
+      },
+      "dependencies": {
+        "@types/jest": {
+          "version": "21.1.0",
+          "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.0.tgz",
+          "integrity": "sha512-7W+tgzauU0s467L7SG1GuHKr4jOmMTXOvR78LP6/YfuaM8JNRF+ayV2+vmNmlaBhbNPvckeJfak2aP+7VJ3g5A=="
         },
-        "browserslist": {
-          "version": "2.3.3",
-          "bundled": true
+        "@types/react-dom": {
+          "version": "15.5.5",
+          "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-15.5.5.tgz",
+          "integrity": "sha512-o9mYuvKgPdyzk20DSIqEBUSGVsSb1QnWtOQoPK/ExcF70Qnhr80no4MgbrEw/2pHiZbLKOjV7mWgKYTLq6f04g==",
+          "requires": {
+            "@types/react": "15.0.38"
+          }
         },
-        "camelcase": {
-          "version": "4.1.0",
-          "bundled": true
+        "lolex": {
+          "version": "1.6.0",
+          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
+          "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
         },
-        "cliui": {
-          "version": "3.2.0",
-          "bundled": true,
-          "dependencies": {
-            "ansi-regex": {
-              "version": "2.1.1",
-              "bundled": true
-            },
-            "is-fullwidth-code-point": {
-              "version": "1.0.0",
-              "bundled": true
-            },
-            "string-width": {
-              "version": "1.0.2",
-              "bundled": true
-            },
-            "strip-ansi": {
-              "version": "3.0.1",
-              "bundled": true
-            }
+        "sinon": {
+          "version": "2.4.1",
+          "resolved": "https://registry.npmjs.org/sinon/-/sinon-2.4.1.tgz",
+          "integrity": "sha512-vFTrO9Wt0ECffDYIPSP/E5bBugt0UjcBQOfQUMh66xzkyPEnhl/vM2LRZi2ajuTdkH07sA6DzrM6KvdvGIH8xw==",
+          "requires": {
+            "diff": "3.4.0",
+            "formatio": "1.2.0",
+            "lolex": "1.6.0",
+            "native-promise-only": "0.8.1",
+            "path-to-regexp": "1.7.0",
+            "samsam": "1.3.0",
+            "text-encoding": "0.6.4",
+            "type-detect": "4.0.3"
           }
+        }
+      }
+    },
+    "@rush-temp/office-ui-fabric-react-tslint": {
+      "version": "file:projects/office-ui-fabric-react-tslint.tgz",
+      "integrity": "sha1-1nzo8k0PDm/NtJv0G5B/LgTBDa4=",
+      "requires": {
+        "tslint-react": "3.2.0"
+      }
+    },
+    "@rush-temp/ssr-tests": {
+      "version": "file:projects/ssr-tests.tgz",
+      "integrity": "sha1-Pg1YyaBXIiKSX55opn+eZXAf61U=",
+      "requires": {
+        "@microsoft/load-themed-styles": "1.7.8",
+        "@types/chai": "3.4.35",
+        "@types/enzyme": "2.8.8",
+        "@types/es6-promise": "0.0.32",
+        "@types/mocha": "2.2.39",
+        "@types/webpack-env": "1.13.0",
+        "es6-promise": "4.1.1",
+        "mocha": "3.3.0",
+        "raw-loader": "0.5.1",
+        "react": "15.6.2",
+        "react-dom": "15.6.2",
+        "tslib": "1.8.0",
+        "webpack": "3.8.1"
+      }
+    },
+    "@rush-temp/styling": {
+      "version": "file:projects/styling.tgz",
+      "integrity": "sha1-5Rlp4htpyjfFdIqnSAZShM+qdXU=",
+      "requires": {
+        "@microsoft/load-themed-styles": "1.7.8",
+        "@types/chai": "3.4.35",
+        "@types/enzyme": "2.8.8",
+        "@types/mocha": "2.2.39",
+        "@types/react": "15.0.38",
+        "@types/webpack-env": "1.13.0",
+        "es6-map": "0.1.5",
+        "es6-weak-map": "2.0.2",
+        "tslib": "1.8.0"
+      }
+    },
+    "@rush-temp/test-bundle-button": {
+      "version": "file:projects/test-bundle-button.tgz",
+      "integrity": "sha1-sK7hEW3440de25uAsFvnZCbi7ts=",
+      "requires": {
+        "@types/prop-types": "15.5.1",
+        "@types/react": "15.0.38",
+        "@types/react-dom": "15.5.1",
+        "@types/webpack-env": "1.13.0",
+        "react": "15.6.2",
+        "react-dom": "15.6.2",
+        "tslib": "1.8.0"
+      }
+    },
+    "@rush-temp/todo-app": {
+      "version": "file:projects/todo-app.tgz",
+      "integrity": "sha1-1aYD4UIapo/Ltg8NJ+Zs9U9ipNs=",
+      "requires": {
+        "@microsoft/load-themed-styles": "1.7.8",
+        "@types/chai": "3.4.35",
+        "@types/enzyme": "2.8.8",
+        "@types/es6-promise": "0.0.32",
+        "@types/mocha": "2.2.39",
+        "@types/react": "15.0.38",
+        "@types/react-dom": "15.5.1",
+        "@types/webpack-env": "1.13.0",
+        "es6-promise": "4.1.1",
+        "immutability-helper": "2.5.0",
+        "react": "15.6.2",
+        "react-dom": "15.6.2",
+        "tslib": "1.8.0",
+        "typescript": "2.4.2"
+      },
+      "dependencies": {
+        "typescript": {
+          "version": "2.4.2",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.4.2.tgz",
+          "integrity": "sha1-+DlfhdRZJ2BnyYiqQYN6j4KHCEQ="
+        }
+      }
+    },
+    "@rush-temp/utilities": {
+      "version": "file:projects/utilities.tgz",
+      "integrity": "sha1-YnAExvB6fTvRq/irpcEH2pBL1ko=",
+      "requires": {
+        "@microsoft/load-themed-styles": "1.7.8",
+        "@types/enzyme": "2.8.8",
+        "@types/jest": "21.1.0",
+        "@types/prop-types": "15.5.1",
+        "@types/react": "15.0.38",
+        "@types/react-dom": "15.5.1",
+        "@types/sinon": "2.2.2",
+        "enzyme": "2.9.1",
+        "prop-types": "15.6.0",
+        "react": "15.6.2",
+        "react-dom": "15.6.2",
+        "sinon": "2.4.1",
+        "tslib": "1.8.0"
+      },
+      "dependencies": {
+        "@types/jest": {
+          "version": "21.1.0",
+          "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.0.tgz",
+          "integrity": "sha512-7W+tgzauU0s467L7SG1GuHKr4jOmMTXOvR78LP6/YfuaM8JNRF+ayV2+vmNmlaBhbNPvckeJfak2aP+7VJ3g5A=="
         },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "bundled": true
+        "lolex": {
+          "version": "1.6.0",
+          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
+          "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
         },
-        "crypto-browserify": {
-          "version": "3.11.1",
-          "bundled": true
+        "sinon": {
+          "version": "2.4.1",
+          "resolved": "https://registry.npmjs.org/sinon/-/sinon-2.4.1.tgz",
+          "integrity": "sha512-vFTrO9Wt0ECffDYIPSP/E5bBugt0UjcBQOfQUMh66xzkyPEnhl/vM2LRZi2ajuTdkH07sA6DzrM6KvdvGIH8xw==",
+          "requires": {
+            "diff": "3.4.0",
+            "formatio": "1.2.0",
+            "lolex": "1.6.0",
+            "native-promise-only": "0.8.1",
+            "path-to-regexp": "1.7.0",
+            "samsam": "1.3.0",
+            "text-encoding": "0.6.4",
+            "type-detect": "4.0.3"
+          }
+        }
+      }
+    },
+    "@rush-temp/vr-tests": {
+      "version": "file:projects/vr-tests.tgz",
+      "integrity": "sha1-zwfmYV6/SrsaXW26UIFdUo51U+U=",
+      "requires": {
+        "@storybook/addon-options": "3.2.3",
+        "@storybook/react": "3.2.14",
+        "@types/react": "15.0.38",
+        "@types/react-dom": "15.5.1",
+        "@types/storybook__react": "3.0.5",
+        "awesome-typescript-loader": "3.3.0",
+        "css-loader": "0.27.3",
+        "file-loader": "0.11.1",
+        "postcss-loader": "1.3.3",
+        "raw-loader": "0.5.1",
+        "react": "15.6.2",
+        "react-dom": "15.6.2",
+        "screener-runner": "0.6.19",
+        "screener-storybook": "0.9.8",
+        "storybook-readme": "3.0.6",
+        "style-loader": "0.16.1",
+        "tslib": "1.8.0",
+        "typescript": "2.4.2"
+      },
+      "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
         },
-        "css-loader": {
-          "version": "0.28.7",
-          "bundled": true,
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
-            "ansi-regex": {
-              "version": "2.1.1",
-              "bundled": true
-            },
-            "chalk": {
-              "version": "1.1.3",
-              "bundled": true,
-              "dependencies": {
-                "supports-color": {
-                  "version": "2.0.0",
-                  "bundled": true
-                }
-              }
-            },
-            "has-flag": {
-              "version": "1.0.0",
-              "bundled": true
-            },
-            "postcss": {
-              "version": "5.2.18",
-              "bundled": true
-            },
-            "strip-ansi": {
-              "version": "3.0.1",
-              "bundled": true
-            },
             "supports-color": {
-              "version": "3.2.3",
-              "bundled": true
+              "version": "2.0.0",
+              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
             }
           }
         },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true
-        },
-        "enhanced-resolve": {
-          "version": "3.4.1",
-          "bundled": true
-        },
-        "etag": {
-          "version": "1.8.0",
-          "bundled": true
-        },
-        "express": {
-          "version": "4.15.4",
-          "bundled": true
-        },
-        "find-up": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "fresh": {
-          "version": "0.5.0",
-          "bundled": true
+        "css-loader": {
+          "version": "0.27.3",
+          "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.27.3.tgz",
+          "integrity": "sha1-aatvR7ab+xtazuYbrCqrFDAv8Nw=",
+          "requires": {
+            "babel-code-frame": "6.26.0",
+            "css-selector-tokenizer": "0.7.0",
+            "cssnano": "3.10.0",
+            "loader-utils": "1.1.0",
+            "lodash.camelcase": "4.3.0",
+            "object-assign": "4.1.1",
+            "postcss": "5.2.18",
+            "postcss-modules-extract-imports": "1.1.0",
+            "postcss-modules-local-by-default": "1.2.0",
+            "postcss-modules-scope": "1.1.0",
+            "postcss-modules-values": "1.3.0",
+            "source-list-map": "0.1.8"
+          }
         },
         "has-flag": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "isarray": {
           "version": "1.0.0",
-          "bundled": true
-        },
-        "load-json-file": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "loader-utils": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "lodash.camelcase": {
-          "version": "4.3.0",
-          "bundled": true
-        },
-        "mime": {
-          "version": "1.3.4",
-          "bundled": true
-        },
-        "node-libs-browser": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "os-browserify": {
-          "version": "0.2.1",
-          "bundled": true
-        },
-        "os-locale": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "path-to-regexp": {
-          "version": "0.1.7",
-          "bundled": true
-        },
-        "path-type": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "pify": {
-          "version": "2.3.0",
-          "bundled": true
-        },
-        "qs": {
-          "version": "6.5.0",
-          "bundled": true
-        },
-        "read-pkg": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg-up": {
-          "version": "2.0.0",
-          "bundled": true
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
+          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
-        "readable-stream": {
-          "version": "2.3.3",
-          "bundled": true,
-          "dependencies": {
-            "string_decoder": {
-              "version": "1.0.3",
-              "bundled": true
-            }
+        "postcss": {
+          "version": "5.2.18",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
           }
         },
-        "semver": {
-          "version": "5.4.1",
-          "bundled": true
-        },
-        "send": {
-          "version": "0.15.4",
-          "bundled": true
-        },
-        "serve-static": {
-          "version": "1.12.4",
-          "bundled": true
+        "postcss-loader": {
+          "version": "1.3.3",
+          "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-1.3.3.tgz",
+          "integrity": "sha1-piHqH6KQYqg5cqRvVEhncTAZFus=",
+          "requires": {
+            "loader-utils": "1.1.0",
+            "object-assign": "4.1.1",
+            "postcss": "5.2.18",
+            "postcss-load-config": "1.2.0"
+          }
         },
         "source-list-map": {
-          "version": "2.0.0",
-          "bundled": true
+          "version": "0.1.8",
+          "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-0.1.8.tgz",
+          "integrity": "sha1-xVCyq1Qn9rPyH1r+rYjE9Vh7IQY="
         },
         "source-map": {
           "version": "0.5.7",
-          "bundled": true
-        },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "bundled": true
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "strip-ansi": {
-          "version": "4.0.0",
-          "bundled": true
-        },
-        "strip-bom": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "4.2.1",
-          "bundled": true
-        },
-        "tapable": {
-          "version": "0.2.8",
-          "bundled": true
-        },
-        "timers-browserify": {
-          "version": "2.0.4",
-          "bundled": true
-        },
-        "tslint": {
-          "version": "5.7.0",
-          "bundled": true
-        },
-        "ultron": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "url": {
-          "version": "0.11.0",
-          "bundled": true,
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "bundled": true
-            }
-          }
-        },
-        "utils-merge": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "watchpack": {
-          "version": "1.4.0",
-          "bundled": true
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
-        "webpack": {
-          "version": "3.7.1",
-          "bundled": true,
-          "dependencies": {
-            "yargs": {
-              "version": "8.0.2",
-              "bundled": true
-            }
+        "style-loader": {
+          "version": "0.16.1",
+          "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.16.1.tgz",
+          "integrity": "sha1-UOMlJY1OeEId2WgGNrQehmFZXRA=",
+          "requires": {
+            "loader-utils": "1.1.0"
           }
         },
-        "webpack-bundle-analyzer": {
-          "version": "2.9.0",
-          "bundled": true,
-          "dependencies": {
-            "ansi-regex": {
-              "version": "2.1.1",
-              "bundled": true
-            },
-            "chalk": {
-              "version": "1.1.3",
-              "bundled": true
-            },
-            "lodash": {
-              "version": "4.17.4",
-              "bundled": true
-            },
-            "strip-ansi": {
-              "version": "3.0.1",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "2.0.0",
-              "bundled": true
-            }
+        "supports-color": {
+          "version": "3.2.3",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
           }
         },
-        "webpack-sources": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "which-module": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "ws": {
-          "version": "2.3.1",
-          "bundled": true,
-          "dependencies": {
-            "safe-buffer": {
-              "version": "5.0.1",
-              "bundled": true
-            }
-          }
-        },
-        "yargs-parser": {
-          "version": "7.0.0",
-          "bundled": true
+        "typescript": {
+          "version": "2.4.2",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.4.2.tgz",
+          "integrity": "sha1-+DlfhdRZJ2BnyYiqQYN6j4KHCEQ="
         }
       }
     },
-    "@rush-temp/example-app-base": {
-      "version": "file:projects/example-app-base",
+    "@storybook/addon-actions": {
+      "version": "3.2.14",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-actions/-/addon-actions-3.2.14.tgz",
+      "integrity": "sha512-tVsgiVxEkygGBs9l8fVqxNAm5cs0ab05DrLcBx3rgMLYzqaadmee7hkQb/Cy0PPoiW9dLSzcZbY/ym8bU24Z3Q==",
+      "requires": {
+        "@storybook/addons": "3.2.14",
+        "deep-equal": "1.0.1",
+        "json-stringify-safe": "5.0.1",
+        "prop-types": "15.6.0",
+        "react-inspector": "2.2.1",
+        "uuid": "3.1.0"
+      }
+    },
+    "@storybook/addon-links": {
+      "version": "3.2.14",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-links/-/addon-links-3.2.14.tgz",
+      "integrity": "sha512-IKCNCs245Bt+ngRypJ0TFcnh/9X9yjvDNGQwc52ioY0287taY71hM1r9tFSKTFzyEISfLFzosfH3D6xEiD5/jg==",
+      "requires": {
+        "@storybook/addons": "3.2.14"
+      }
+    },
+    "@storybook/addon-options": {
+      "version": "3.2.3",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-options/-/addon-options-3.2.3.tgz",
+      "integrity": "sha1-6jdA0onUKc52fpaZvzpkfddBWS0=",
+      "requires": {
+        "@storybook/addons": "3.2.14"
+      }
+    },
+    "@storybook/addons": {
+      "version": "3.2.14",
+      "resolved": "https://registry.npmjs.org/@storybook/addons/-/addons-3.2.14.tgz",
+      "integrity": "sha512-DTOuK8/vuK3gPUA8HLYrfF3s+YxWmepHdm0JrbvqL0LUO/xzPZTQrpNhPm9dS96c5hTI41Bwc89/8WyQojiuAQ=="
+    },
+    "@storybook/channel-postmessage": {
+      "version": "3.2.14",
+      "resolved": "https://registry.npmjs.org/@storybook/channel-postmessage/-/channel-postmessage-3.2.14.tgz",
+      "integrity": "sha512-ehrJniC2pjiAMyzY3ABFskHZ7W93UqbZ8XWN3q7jkNNzpo1LXk24jJ6Lv047bat+7pcqmeuEq8OL2T5mdi0avQ==",
+      "requires": {
+        "@storybook/channels": "3.2.14",
+        "global": "4.3.2",
+        "json-stringify-safe": "5.0.1"
+      }
+    },
+    "@storybook/channels": {
+      "version": "3.2.14",
+      "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-3.2.14.tgz",
+      "integrity": "sha512-n/LhZ9sfXL0TbKbr1ZqAW0m73qoQD3IplcLrmQXmY6zZ613jtbPt0UAoM8cJCFM5TDxQAj5H+6Fb6gHzCwESWA=="
+    },
+    "@storybook/components": {
+      "version": "3.2.14",
+      "resolved": "https://registry.npmjs.org/@storybook/components/-/components-3.2.14.tgz",
+      "integrity": "sha512-Qyi5JxLg7l2QPxgz0ZnFFDlwsbPW37Xx7aqtWcwbhNoMGuKIhkbmVl8O2u5b0QJjYkkKJoYSqqTY8RcrhG3j0Q==",
+      "requires": {
+        "glamor": "2.20.40",
+        "glamorous": "4.11.0",
+        "prop-types": "15.6.0"
+      }
+    },
+    "@storybook/react": {
+      "version": "3.2.14",
+      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-3.2.14.tgz",
+      "integrity": "sha512-Cysxmp5V49AS27CCBQAzLuCa5lLN+wRQ6e3EbYsJJ+9mVMh3fdPDxa508alFn2fMdMW9b6MLYYjoqCWus/Pniw==",
+      "requires": {
+        "@storybook/addon-actions": "3.2.14",
+        "@storybook/addon-links": "3.2.14",
+        "@storybook/addons": "3.2.14",
+        "@storybook/channel-postmessage": "3.2.14",
+        "@storybook/ui": "3.2.14",
+        "airbnb-js-shims": "1.3.0",
+        "autoprefixer": "7.1.6",
+        "babel-core": "6.26.0",
+        "babel-loader": "7.1.2",
+        "babel-plugin-react-docgen": "1.8.1",
+        "babel-plugin-transform-regenerator": "6.26.0",
+        "babel-plugin-transform-runtime": "6.23.0",
+        "babel-preset-env": "1.6.1",
+        "babel-preset-minify": "0.2.0",
+        "babel-preset-react": "6.24.1",
+        "babel-preset-react-app": "3.1.0",
+        "babel-preset-stage-0": "6.24.1",
+        "babel-runtime": "6.26.0",
+        "case-sensitive-paths-webpack-plugin": "2.1.1",
+        "chalk": "2.3.0",
+        "commander": "2.11.0",
+        "common-tags": "1.4.0",
+        "configstore": "3.1.1",
+        "core-js": "2.5.1",
+        "css-loader": "0.28.7",
+        "express": "4.16.2",
+        "file-loader": "0.11.2",
+        "find-cache-dir": "1.0.0",
+        "glamor": "2.20.40",
+        "glamorous": "4.11.0",
+        "global": "4.3.2",
+        "json-loader": "0.5.7",
+        "json-stringify-safe": "5.0.1",
+        "json5": "0.5.1",
+        "lodash.flattendeep": "4.4.0",
+        "lodash.pick": "4.4.0",
+        "postcss-flexbugs-fixes": "3.2.0",
+        "postcss-loader": "2.0.8",
+        "prop-types": "15.6.0",
+        "qs": "6.5.1",
+        "react-modal": "2.4.1",
+        "redux": "3.7.2",
+        "request": "2.83.0",
+        "serve-favicon": "2.4.5",
+        "shelljs": "0.7.8",
+        "style-loader": "0.18.2",
+        "url-loader": "0.6.2",
+        "util-deprecate": "1.0.2",
+        "uuid": "3.1.0",
+        "webpack": "3.8.1",
+        "webpack-dev-middleware": "1.12.0",
+        "webpack-hot-middleware": "2.20.0"
+      },
       "dependencies": {
-        "acorn": {
-          "version": "5.1.1",
-          "bundled": true
-        },
-        "ajv": {
-          "version": "5.2.2",
-          "bundled": true
-        },
-        "ajv-keywords": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "ansi-regex": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "async": {
-          "version": "2.5.0",
-          "bundled": true
-        },
-        "camelcase": {
-          "version": "4.1.0",
-          "bundled": true
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "bundled": true,
-          "dependencies": {
-            "ansi-regex": {
-              "version": "2.1.1",
-              "bundled": true
-            },
-            "strip-ansi": {
-              "version": "3.0.1",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "2.0.0",
-              "bundled": true
-            }
-          }
-        },
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true
-        },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "crypto-browserify": {
-          "version": "3.11.1",
-          "bundled": true
-        },
-        "css-loader": {
-          "version": "0.28.5",
-          "bundled": true
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true,
-          "dependencies": {
-            "ms": {
-              "version": "2.0.0",
-              "bundled": true
-            }
-          }
-        },
-        "diff": {
-          "version": "3.2.0",
-          "bundled": true
-        },
-        "enhanced-resolve": {
-          "version": "3.4.1",
-          "bundled": true
-        },
-        "find-up": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "glob": {
-          "version": "7.1.1",
-          "bundled": true
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "load-json-file": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "loader-utils": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "lodash.camelcase": {
-          "version": "4.3.0",
-          "bundled": true
-        },
-        "mocha": {
-          "version": "3.5.0",
-          "bundled": true
-        },
-        "ms": {
-          "version": "0.7.2",
-          "bundled": true
-        },
-        "node-libs-browser": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "os-browserify": {
-          "version": "0.2.1",
-          "bundled": true
-        },
-        "os-locale": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "path-type": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "postcss": {
-          "version": "5.2.17",
-          "bundled": true,
-          "dependencies": {
-            "supports-color": {
-              "version": "3.2.3",
-              "bundled": true
-            }
-          }
-        },
-        "read-pkg": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg-up": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "bundled": true,
-          "dependencies": {
-            "string_decoder": {
-              "version": "1.0.3",
-              "bundled": true
-            }
-          }
-        },
-        "source-list-map": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "0.9.2",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "0.2.17",
-              "bundled": true
-            }
-          }
-        },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "strip-ansi": {
-          "version": "4.0.0",
-          "bundled": true
-        },
-        "strip-bom": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "style-loader": {
-          "version": "0.17.0",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "3.1.2",
-          "bundled": true
-        },
-        "tapable": {
-          "version": "0.2.8",
-          "bundled": true
-        },
-        "timers-browserify": {
-          "version": "2.0.4",
-          "bundled": true
-        },
-        "url": {
-          "version": "0.11.0",
-          "bundled": true,
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "bundled": true
-            }
-          }
-        },
-        "watchpack": {
-          "version": "1.4.0",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            }
-          }
-        },
-        "webpack": {
-          "version": "3.5.5",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            },
-            "has-flag": {
-              "version": "2.0.0",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "1.1.0",
-              "bundled": true
-            },
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "4.2.1",
-              "bundled": true
-            }
-          }
-        },
-        "webpack-sources": {
-          "version": "1.0.1",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            }
+        "file-loader": {
+          "version": "0.11.2",
+          "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.11.2.tgz",
+          "integrity": "sha512-N+uhF3mswIFeziHQjGScJ/yHXYt3DiLBeC+9vWW+WjUBiClMSOlV1YrXQi+7KM2aA3Rn4Bybgv+uXFQbfkzpvg==",
+          "requires": {
+            "loader-utils": "1.1.0"
           }
-        },
-        "which-module": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "yargs": {
-          "version": "8.0.2",
-          "bundled": true
-        },
-        "yargs-parser": {
-          "version": "7.0.0",
-          "bundled": true
         }
       }
     },
-    "@rush-temp/experiments": {
-      "version": "file:projects/experiments",
-      "dependencies": {
-        "acorn": {
-          "version": "5.1.1",
-          "bundled": true
-        },
-        "ajv": {
-          "version": "5.2.2",
-          "bundled": true
-        },
-        "ajv-keywords": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "ansi-regex": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "async": {
-          "version": "2.5.0",
-          "bundled": true
-        },
-        "autoprefixer": {
-          "version": "6.7.7",
-          "bundled": true
-        },
-        "browserslist": {
-          "version": "1.7.7",
-          "bundled": true
-        },
-        "camelcase": {
-          "version": "4.1.0",
-          "bundled": true
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "bundled": true,
-          "dependencies": {
-            "ansi-regex": {
-              "version": "2.1.1",
-              "bundled": true
-            },
-            "strip-ansi": {
-              "version": "3.0.1",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "2.0.0",
-              "bundled": true
-            }
-          }
-        },
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true
-        },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "crypto-browserify": {
-          "version": "3.11.1",
-          "bundled": true
-        },
-        "css-loader": {
-          "version": "0.28.5",
-          "bundled": true
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true
-        },
-        "diff": {
-          "version": "3.2.0",
-          "bundled": true
-        },
-        "enhanced-resolve": {
-          "version": "3.4.1",
-          "bundled": true
-        },
-        "find-up": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "glob": {
-          "version": "7.1.1",
-          "bundled": true
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "load-json-file": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "loader-utils": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "lodash.camelcase": {
-          "version": "4.3.0",
-          "bundled": true
-        },
-        "lolex": {
-          "version": "1.6.0",
-          "bundled": true
-        },
-        "mocha": {
-          "version": "3.5.0",
-          "bundled": true
-        },
-        "node-libs-browser": {
+    "@storybook/react-fuzzy": {
+      "version": "0.4.3",
+      "resolved": "https://registry.npmjs.org/@storybook/react-fuzzy/-/react-fuzzy-0.4.3.tgz",
+      "integrity": "sha512-TaFbDiEc/34eiAFyOjyvrh5tOqoKscyVH2BHJB15cQ8RepccX3LKIBqSNr7IUi1jmMB5aWjeefvJywPQf13ByQ==",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "classnames": "2.2.5",
+        "fuse.js": "3.2.0",
+        "prop-types": "15.6.0"
+      }
+    },
+    "@storybook/ui": {
+      "version": "3.2.14",
+      "resolved": "https://registry.npmjs.org/@storybook/ui/-/ui-3.2.14.tgz",
+      "integrity": "sha512-0OErMwjq7EtDlTeBRisNcgzmUYHPi7JLW90s2M/i+cYUHRZMvz4JmYH9HwxG8U32QrekJ7l0Ki8eWWzJu6deug==",
+      "requires": {
+        "@hypnosphi/fuse.js": "3.0.9",
+        "@storybook/components": "3.2.14",
+        "@storybook/react-fuzzy": "0.4.3",
+        "babel-runtime": "6.26.0",
+        "deep-equal": "1.0.1",
+        "events": "1.1.1",
+        "global": "4.3.2",
+        "json-stringify-safe": "5.0.1",
+        "keycode": "2.1.9",
+        "lodash.debounce": "4.0.8",
+        "lodash.pick": "4.4.0",
+        "lodash.sortby": "4.7.0",
+        "mantra-core": "1.7.0",
+        "podda": "1.2.2",
+        "prop-types": "15.6.0",
+        "qs": "6.5.1",
+        "react-icons": "2.2.7",
+        "react-inspector": "2.2.1",
+        "react-komposer": "2.0.0",
+        "react-modal": "2.4.1",
+        "react-split-pane": "0.1.68",
+        "react-treebeard": "2.1.0",
+        "redux": "3.7.2"
+      }
+    },
+    "@types/chai": {
+      "version": "3.4.35",
+      "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.35.tgz",
+      "integrity": "sha1-6NZfg0ktKUT4FvxiB0GCHCioyQA="
+    },
+    "@types/cheerio": {
+      "version": "0.22.5",
+      "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.5.tgz",
+      "integrity": "sha512-Moft0SFkFG4RbRykJSsRFnPOS306hMF/lH+Ru/ugej/vzcGBpjzoJrf8P7gupouQYbbiXxhtN/5JMJWlsHYqIw=="
+    },
+    "@types/enzyme": {
+      "version": "2.8.8",
+      "resolved": "https://registry.npmjs.org/@types/enzyme/-/enzyme-2.8.8.tgz",
+      "integrity": "sha512-KBw0ZzOQNtwVGO4egRjEpQbXMFCSevy+gRFzaLXrU64LrVVuJF0FqVIdzed0NCSP+nMALj001//dwYKV/VDlCA==",
+      "requires": {
+        "@types/cheerio": "0.22.5",
+        "@types/react": "15.0.38"
+      }
+    },
+    "@types/es6-promise": {
+      "version": "0.0.32",
+      "resolved": "https://registry.npmjs.org/@types/es6-promise/-/es6-promise-0.0.32.tgz",
+      "integrity": "sha1-O89E+x5Cnz33YYjIxth0Rjujcf0="
+    },
+    "@types/highlight.js": {
+      "version": "9.1.9",
+      "resolved": "https://registry.npmjs.org/@types/highlight.js/-/highlight.js-9.1.9.tgz",
+      "integrity": "sha1-7WM2lV6vIzt163kjubHzc9BF7wE="
+    },
+    "@types/inline-style-prefixer": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/@types/inline-style-prefixer/-/inline-style-prefixer-3.0.1.tgz",
+      "integrity": "sha512-+kbOcYW1/noncDwRryRoB9tH87IYcMfdBGvw98iocK39LtTA2DFL7agmk4UHW/GxjzVfwrxfjlLrqrgA7MCtmg=="
+    },
+    "@types/jest": {
+      "version": "21.1.5",
+      "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.5.tgz",
+      "integrity": "sha512-HwBIPK96DROvcB4EX5mA7L2nzhZ3sh8AcDSFODB4eG43S3q3d0+oo356J51qCxw9Bbn7G1DOmBmrw6vf+WiGTg=="
+    },
+    "@types/mocha": {
+      "version": "2.2.39",
+      "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.39.tgz",
+      "integrity": "sha1-9o1j24tpw46VWLQHNSXPlsT3qCk="
+    },
+    "@types/node": {
+      "version": "8.0.26",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-8.0.26.tgz",
+      "integrity": "sha512-wbKN0MB4XsjdnSE04HiCzLoBDirGCM6zXrqavSj44nZnPFYpnrTF64E9O6Xmf0ca/IuKK/BHUcXwMiwk92gW6Q=="
+    },
+    "@types/prop-types": {
+      "version": "15.5.1",
+      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.5.1.tgz",
+      "integrity": "sha1-Hs9SYhKZ5luFU3Qzf7Ef0tEGb8E="
+    },
+    "@types/react": {
+      "version": "15.0.38",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.38.tgz",
+      "integrity": "sha512-CkRB27L/kMDu7K20U0V7BwYK9/kPd9Im6Jlxv2vAEolYBvQy6JrSpPJsbZXtOk4MoDUomkct8Q7PNBUSLd0fmg=="
+    },
+    "@types/react-addons-test-utils": {
+      "version": "0.14.18",
+      "resolved": "https://registry.npmjs.org/@types/react-addons-test-utils/-/react-addons-test-utils-0.14.18.tgz",
+      "integrity": "sha1-g+EK8dvl7CU1vC3FNz17w7gv3uE=",
+      "requires": {
+        "@types/react": "15.0.38"
+      }
+    },
+    "@types/react-dom": {
+      "version": "15.5.1",
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-15.5.1.tgz",
+      "integrity": "sha512-4c+e/QPfvSa48YhgGOcQWoHishTo6BuJqka0Bh8qeLdnK1jS+1Nz8W/w1G17AIjtLxONYFUqmi8qyt+8p/yMFA==",
+      "requires": {
+        "@types/react": "15.0.38"
+      }
+    },
+    "@types/react-test-renderer": {
+      "version": "15.5.5",
+      "resolved": "https://registry.npmjs.org/@types/react-test-renderer/-/react-test-renderer-15.5.5.tgz",
+      "integrity": "sha512-SEt2f9Hf+Y/OGstIDrINnls6wpeZGt9xiROBFjfMxXKbqg7zYkPVB7D58Rg9TZbi2kuxatchVTdiliYLs8WK0g==",
+      "requires": {
+        "@types/react": "15.0.38"
+      }
+    },
+    "@types/resemblejs": {
+      "version": "1.3.28",
+      "resolved": "https://registry.npmjs.org/@types/resemblejs/-/resemblejs-1.3.28.tgz",
+      "integrity": "sha1-Lg2ztf2w8vPUVPXXLhMkEgnql60="
+    },
+    "@types/sinon": {
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/@types/sinon/-/sinon-2.2.2.tgz",
+      "integrity": "sha1-qA2khougisysvOTTcnbzXhugpS8="
+    },
+    "@types/storybook__react": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/@types/storybook__react/-/storybook__react-3.0.5.tgz",
+      "integrity": "sha512-febLx40iQWoQKVaEMpxdzkJnqncPHoRivlilc3JhHJiRuBY1Mqa1yTKcvQ5RiFAYFIuv4x+bRuSIXErk5v41Bg==",
+      "requires": {
+        "@types/react": "15.0.38",
+        "@types/webpack-env": "1.13.0"
+      }
+    },
+    "@types/webpack-env": {
+      "version": "1.13.0",
+      "resolved": "https://registry.npmjs.org/@types/webpack-env/-/webpack-env-1.13.0.tgz",
+      "integrity": "sha1-MEQ4FkfhHulzxa8uklMjkw9pHYA="
+    },
+    "@uifabric/icons": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.2.0.tgz",
+      "integrity": "sha512-P5kfPej/wxgR8jZt/GqnU0FqYcz+JH1iCcaaYd6p9L3opmZtu4w5duKeqs+Bc1u7K16r800EQfLgKe76rt6AuA==",
+      "requires": {
+        "@uifabric/styling": "5.6.1",
+        "tslib": "1.8.0"
+      }
+    },
+    "@uifabric/merge-styles": {
+      "version": "5.5.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.5.1.tgz",
+      "integrity": "sha512-T16obR1JtHZWsOn5B8KvXaduJ07WwARAxMRZ7WiygckpKB55ZO987UhY3N930fLlTanslmiY68dN8hgBHJra+A==",
+      "requires": {
+        "tslib": "1.8.0"
+      }
+    },
+    "@uifabric/styling": {
+      "version": "5.6.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.6.1.tgz",
+      "integrity": "sha512-bOt9GH+jjxtivCOIRr8kBlk45/nCOS0jiiSyCPjWFinlP0/x4GZW87pLzl55AHX87VtMu1aSgx9DPHsf9fNxlQ==",
+      "requires": {
+        "@microsoft/load-themed-styles": "1.7.8",
+        "@uifabric/merge-styles": "5.5.1",
+        "@uifabric/utilities": "5.3.2",
+        "tslib": "1.8.0"
+      }
+    },
+    "@uifabric/utilities": {
+      "version": "5.3.2",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.3.2.tgz",
+      "integrity": "sha512-Q4Pl2jn3yoH+NRhSdm+u5YqLhxAT3EcXRRUbHeGbo5YKDH6Vhq0/TJ6SD0EhRUvbHFtdLmcOe7XIc4XknEzGdw==",
+      "requires": {
+        "@microsoft/load-themed-styles": "1.7.8",
+        "prop-types": "15.6.0",
+        "tslib": "1.8.0"
+      }
+    },
+    "abab": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/abab/-/abab-1.0.4.tgz",
+      "integrity": "sha1-X6rZwsB/YN12dw9xzwJbYqY8/U4="
+    },
+    "abbrev": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz",
+      "integrity": "sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q=="
+    },
+    "accepts": {
+      "version": "1.3.4",
+      "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.4.tgz",
+      "integrity": "sha1-hiRnWMfdbSGmR0/whKR0DsBesh8=",
+      "requires": {
+        "mime-types": "2.1.17",
+        "negotiator": "0.6.1"
+      }
+    },
+    "acorn": {
+      "version": "4.0.13",
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
+      "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c="
+    },
+    "acorn-dynamic-import": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/acorn-dynamic-import/-/acorn-dynamic-import-2.0.2.tgz",
+      "integrity": "sha1-x1K9IQvvZ5UBtsbLf8hPj0cVjMQ=",
+      "requires": {
+        "acorn": "4.0.13"
+      }
+    },
+    "acorn-globals": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/acorn-globals/-/acorn-globals-3.1.0.tgz",
+      "integrity": "sha1-/YJw9x+7SZawBPqIDuXUZXOnMb8=",
+      "requires": {
+        "acorn": "4.0.13"
+      }
+    },
+    "agent-base": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-2.1.1.tgz",
+      "integrity": "sha1-1t4Q1a9hMtW9aSQn1G/FOFOQlMc=",
+      "requires": {
+        "extend": "3.0.1",
+        "semver": "5.0.3"
+      },
+      "dependencies": {
+        "semver": {
+          "version": "5.0.3",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.0.3.tgz",
+          "integrity": "sha1-d0Zt5YnNXTyV8TiqeLxWmjy10no="
+        }
+      }
+    },
+    "airbnb-js-shims": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/airbnb-js-shims/-/airbnb-js-shims-1.3.0.tgz",
+      "integrity": "sha512-Y/9jgf3uEdNyeWPUV1N49FowM/qMIiKSTkRUpYT4jpHkSADfTiRVwI8Mm6o4CIxhnBK1uMf4RIYNYKwwILMCAQ==",
+      "requires": {
+        "array-includes": "3.0.3",
+        "es5-shim": "4.5.9",
+        "es6-shim": "0.35.3",
+        "function.prototype.name": "1.0.3",
+        "object.entries": "1.0.4",
+        "object.getownpropertydescriptors": "2.0.3",
+        "object.values": "1.0.4",
+        "promise.prototype.finally": "3.1.0",
+        "string.prototype.padend": "3.0.0",
+        "string.prototype.padstart": "3.0.0"
+      }
+    },
+    "ajv": {
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-5.3.0.tgz",
+      "integrity": "sha1-RBT/dKUIecII7l/cgm4ywwNUnto=",
+      "requires": {
+        "co": "4.6.0",
+        "fast-deep-equal": "1.0.0",
+        "fast-json-stable-stringify": "2.0.0",
+        "json-schema-traverse": "0.3.1"
+      }
+    },
+    "ajv-keywords": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-2.1.1.tgz",
+      "integrity": "sha1-YXmX/F9gV2iUxDX5QNgZ4TW4B2I="
+    },
+    "align-text": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/align-text/-/align-text-0.1.4.tgz",
+      "integrity": "sha1-DNkKVhCT810KmSVsIrcGlDP60Rc=",
+      "requires": {
+        "kind-of": "3.2.2",
+        "longest": "1.0.1",
+        "repeat-string": "1.6.1"
+      },
+      "dependencies": {
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+          "requires": {
+            "is-buffer": "1.1.6"
+          }
+        }
+      }
+    },
+    "alphanum-sort": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/alphanum-sort/-/alphanum-sort-1.0.2.tgz",
+      "integrity": "sha1-l6ERlkmyEa0zaR2fn0hqjsn74KM="
+    },
+    "amdefine": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz",
+      "integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU="
+    },
+    "ansi-escapes": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz",
+      "integrity": "sha1-06ioOzGapneTZisT52HHkRQiMG4="
+    },
+    "ansi-html": {
+      "version": "0.0.7",
+      "resolved": "https://registry.npmjs.org/ansi-html/-/ansi-html-0.0.7.tgz",
+      "integrity": "sha1-gTWEAhliqenm/QOflA0S9WynhZ4="
+    },
+    "ansi-regex": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
+      "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
+    },
+    "ansi-styles": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
+      "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug==",
+      "requires": {
+        "color-convert": "1.9.0"
+      }
+    },
+    "ansicolors": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/ansicolors/-/ansicolors-0.2.1.tgz",
+      "integrity": "sha1-vgiVmQl7dKXJxKhKDNvNtivYeu8="
+    },
+    "anymatch": {
+      "version": "1.3.2",
+      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-1.3.2.tgz",
+      "integrity": "sha512-0XNayC8lTHQ2OI8aljNCN3sSx6hsr/1+rlcDAotXJR7C1oZZHCNsfpbKwMjRA3Uqb5tF1Rae2oloTr4xpq+WjA==",
+      "requires": {
+        "micromatch": "2.3.11",
+        "normalize-path": "2.1.1"
+      },
+      "dependencies": {
+        "arr-diff": {
           "version": "2.0.0",
-          "bundled": true
+          "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
+          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8=",
+          "requires": {
+            "arr-flatten": "1.1.0"
+          }
         },
-        "os-browserify": {
+        "array-unique": {
           "version": "0.2.1",
-          "bundled": true
-        },
-        "os-locale": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "path-type": {
-          "version": "2.0.0",
-          "bundled": true
+          "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
+          "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM="
         },
-        "postcss": {
-          "version": "5.2.17",
-          "bundled": true,
-          "dependencies": {
-            "supports-color": {
-              "version": "3.2.3",
-              "bundled": true
-            }
+        "braces": {
+          "version": "1.8.5",
+          "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
+          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc=",
+          "requires": {
+            "expand-range": "1.8.2",
+            "preserve": "0.2.0",
+            "repeat-element": "1.1.2"
           }
         },
-        "postcss-loader": {
-          "version": "1.3.3",
-          "bundled": true
-        },
-        "read-pkg": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg-up": {
-          "version": "2.0.0",
-          "bundled": true
+        "expand-brackets": {
+          "version": "0.1.5",
+          "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
+          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s=",
+          "requires": {
+            "is-posix-bracket": "0.1.1"
+          }
         },
-        "readable-stream": {
-          "version": "2.3.3",
-          "bundled": true,
-          "dependencies": {
-            "string_decoder": {
-              "version": "1.0.3",
-              "bundled": true
-            }
+        "extglob": {
+          "version": "0.3.2",
+          "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
+          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE=",
+          "requires": {
+            "is-extglob": "1.0.0"
           }
         },
-        "sinon": {
-          "version": "2.4.1",
-          "bundled": true
-        },
-        "source-list-map": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "strip-ansi": {
-          "version": "4.0.0",
-          "bundled": true
-        },
-        "strip-bom": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "style-loader": {
-          "version": "0.17.0",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "3.1.2",
-          "bundled": true
-        },
-        "tapable": {
-          "version": "0.2.8",
-          "bundled": true
-        },
-        "timers-browserify": {
-          "version": "2.0.4",
-          "bundled": true
-        },
-        "url": {
-          "version": "0.11.0",
-          "bundled": true,
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "bundled": true
-            }
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+          "requires": {
+            "is-buffer": "1.1.6"
           }
         },
-        "watchpack": {
-          "version": "1.4.0",
-          "bundled": true
-        },
-        "webpack": {
-          "version": "3.5.5",
-          "bundled": true,
-          "dependencies": {
-            "has-flag": {
-              "version": "2.0.0",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "4.2.1",
-              "bundled": true
-            }
+        "micromatch": {
+          "version": "2.3.11",
+          "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
+          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU=",
+          "requires": {
+            "arr-diff": "2.0.0",
+            "array-unique": "0.2.1",
+            "braces": "1.8.5",
+            "expand-brackets": "0.1.5",
+            "extglob": "0.3.2",
+            "filename-regex": "2.0.1",
+            "is-extglob": "1.0.0",
+            "is-glob": "2.0.1",
+            "kind-of": "3.2.2",
+            "normalize-path": "2.1.1",
+            "object.omit": "2.0.1",
+            "parse-glob": "3.0.4",
+            "regex-cache": "0.4.4"
           }
-        },
-        "webpack-sources": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "which-module": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "yargs": {
-          "version": "8.0.2",
-          "bundled": true
-        },
-        "yargs-parser": {
-          "version": "7.0.0",
-          "bundled": true
         }
       }
     },
-    "@rush-temp/fabric-website": {
-      "version": "file:projects/fabric-website",
-      "dependencies": {
-        "@types/react-addons-test-utils": {
-          "version": "0.14.19",
-          "bundled": true
-        },
-        "acorn": {
-          "version": "5.1.1",
-          "bundled": true
-        },
-        "ajv": {
-          "version": "5.2.2",
-          "bundled": true
-        },
-        "ajv-keywords": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "ansi-regex": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "async": {
-          "version": "2.5.0",
-          "bundled": true
-        },
-        "autoprefixer": {
-          "version": "6.7.7",
-          "bundled": true
-        },
-        "browserslist": {
-          "version": "1.7.7",
-          "bundled": true
-        },
-        "camelcase": {
-          "version": "4.1.0",
-          "bundled": true
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "bundled": true,
-          "dependencies": {
-            "ansi-regex": {
-              "version": "2.1.1",
-              "bundled": true
-            },
-            "strip-ansi": {
-              "version": "3.0.1",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "2.0.0",
-              "bundled": true
-            }
-          }
-        },
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true
-        },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "crypto-browserify": {
-          "version": "3.11.1",
-          "bundled": true
-        },
-        "css-loader": {
-          "version": "0.28.5",
-          "bundled": true
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true
-        },
-        "diff": {
-          "version": "3.2.0",
-          "bundled": true
-        },
-        "enhanced-resolve": {
-          "version": "3.4.1",
-          "bundled": true
-        },
-        "find-up": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "glob": {
-          "version": "7.1.1",
-          "bundled": true
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "load-json-file": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "loader-utils": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "lodash.camelcase": {
-          "version": "4.3.0",
-          "bundled": true
-        },
-        "mocha": {
-          "version": "3.5.0",
-          "bundled": true
-        },
-        "node-libs-browser": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "os-browserify": {
-          "version": "0.2.1",
-          "bundled": true
-        },
-        "os-locale": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "path-type": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "postcss": {
-          "version": "5.2.17",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.7",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "3.2.3",
-              "bundled": true
-            }
-          }
-        },
-        "postcss-loader": {
-          "version": "1.3.3",
-          "bundled": true
-        },
-        "react": {
-          "version": "15.6.1",
-          "bundled": true
-        },
-        "react-dom": {
-          "version": "15.6.1",
-          "bundled": true
-        },
-        "react-highlight": {
-          "version": "0.9.0",
-          "bundled": true
-        },
-        "read-pkg": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg-up": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "bundled": true,
-          "dependencies": {
-            "string_decoder": {
-              "version": "1.0.3",
-              "bundled": true
-            }
-          }
-        },
-        "sinon": {
-          "version": "2.4.1",
-          "bundled": true
-        },
-        "source-list-map": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "0.9.2",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "0.2.17",
-              "bundled": true
-            }
-          }
-        },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "strip-ansi": {
-          "version": "4.0.0",
-          "bundled": true
-        },
-        "strip-bom": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "3.1.2",
-          "bundled": true
-        },
-        "tapable": {
-          "version": "0.2.8",
-          "bundled": true
-        },
-        "timers-browserify": {
-          "version": "2.0.4",
-          "bundled": true
-        },
-        "url": {
-          "version": "0.11.0",
-          "bundled": true,
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "bundled": true
-            }
-          }
-        },
-        "watchpack": {
-          "version": "1.4.0",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            }
-          }
-        },
-        "webpack": {
-          "version": "3.5.5",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            },
-            "camelcase": {
-              "version": "4.1.0",
-              "bundled": true
-            },
-            "has-flag": {
-              "version": "2.0.0",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "1.1.0",
-              "bundled": true
-            },
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "4.2.1",
-              "bundled": true
-            },
-            "yargs": {
-              "version": "8.0.2",
-              "bundled": true
-            },
-            "yargs-parser": {
-              "version": "7.0.0",
-              "bundled": true
-            }
-          }
-        },
-        "webpack-sources": {
-          "version": "1.0.1",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            }
-          }
-        },
-        "which-module": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "yargs": {
-          "version": "8.0.2",
-          "bundled": true
-        },
-        "yargs-parser": {
-          "version": "7.0.0",
-          "bundled": true
-        }
+    "append-transform": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/append-transform/-/append-transform-0.4.0.tgz",
+      "integrity": "sha1-126/jKlNJ24keja61EpLdKthGZE=",
+      "requires": {
+        "default-require-extensions": "1.0.0"
       }
     },
-    "@rush-temp/icons": {
-      "version": "file:projects/icons"
+    "aproba": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.2.0.tgz",
+      "integrity": "sha512-Y9J6ZjXtoYh8RnXVCMOU/ttDmk1aBjunq9vO0ta5x85WDQiQfUF9sIPBITdbiiIVcBo03Hi3jMxigBtsddlXRw=="
     },
-    "@rush-temp/jest-serializer-merge-styles": {
-      "version": "file:projects/jest-serializer-merge-styles",
-      "dependencies": {
-        "@types/jest": {
-          "version": "21.1.0",
-          "bundled": true
-        }
+    "are-we-there-yet": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/are-we-there-yet/-/are-we-there-yet-1.1.4.tgz",
+      "integrity": "sha1-u13KOCu5TwXhUZQ3PRb9O6HKEQ0=",
+      "requires": {
+        "delegates": "1.0.0",
+        "readable-stream": "2.3.3"
       }
     },
-    "@rush-temp/merge-styles": {
-      "version": "file:projects/merge-styles",
-      "dependencies": {
-        "@types/jest": {
-          "version": "21.1.0",
-          "bundled": true
-        },
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true
-        },
-        "diff": {
-          "version": "3.2.0",
-          "bundled": true
-        },
-        "glob": {
-          "version": "7.1.1",
-          "bundled": true
-        },
-        "mocha": {
-          "version": "3.5.0",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "3.1.2",
-          "bundled": true
-        }
+    "argparse": {
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.9.tgz",
+      "integrity": "sha1-c9g7wmP4bpf4zE9rrhsOkKfSLIY=",
+      "requires": {
+        "sprintf-js": "1.0.3"
       }
     },
-    "@rush-temp/office-ui-fabric-react": {
-      "version": "file:projects/office-ui-fabric-react",
+    "arr-diff": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-4.0.0.tgz",
+      "integrity": "sha1-1kYQdP6/7HHn4VI1dhoyml3HxSA="
+    },
+    "arr-flatten": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.1.0.tgz",
+      "integrity": "sha512-L3hKV5R/p5o81R7O02IGnwpDmkp6E982XhtbuwSe3O4qOtMMMtodicASA1Cny2U+aCXcNpml+m4dPsvsJ3jatg=="
+    },
+    "arr-union": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/arr-union/-/arr-union-3.1.0.tgz",
+      "integrity": "sha1-45sJrqne+Gao8gbiiK9jkZuuOcQ="
+    },
+    "array-back": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/array-back/-/array-back-2.0.0.tgz",
+      "integrity": "sha512-eJv4pLLufP3g5kcZry0j6WXpIbzYw9GUB4mVJZno9wfwiBxbizTnHCw3VJb07cBihbFX48Y7oSrW9y+gt4glyw==",
+      "requires": {
+        "typical": "2.6.1"
+      }
+    },
+    "array-equal": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/array-equal/-/array-equal-1.0.0.tgz",
+      "integrity": "sha1-jCpe8kcv2ep0KwTHenUJO6J1fJM="
+    },
+    "array-filter": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/array-filter/-/array-filter-0.0.1.tgz",
+      "integrity": "sha1-fajPLiZijtcygDWB/SH2fKzS7uw="
+    },
+    "array-find": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/array-find/-/array-find-1.0.0.tgz",
+      "integrity": "sha1-bI4obRHtdoMn+OYuzuhzU8o+eLg="
+    },
+    "array-find-index": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/array-find-index/-/array-find-index-1.0.2.tgz",
+      "integrity": "sha1-3wEKoSh+Fku9pvlyOwqWoexBh6E="
+    },
+    "array-flatten": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
+      "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI="
+    },
+    "array-includes": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/array-includes/-/array-includes-3.0.3.tgz",
+      "integrity": "sha1-GEtI9i2S10UrsxsyMWXH+L0CJm0=",
+      "requires": {
+        "define-properties": "1.1.2",
+        "es-abstract": "1.9.0"
+      }
+    },
+    "array-map": {
+      "version": "0.0.0",
+      "resolved": "https://registry.npmjs.org/array-map/-/array-map-0.0.0.tgz",
+      "integrity": "sha1-iKK6tz0c97zVwbEYoAP2b2ZfpmI="
+    },
+    "array-reduce": {
+      "version": "0.0.0",
+      "resolved": "https://registry.npmjs.org/array-reduce/-/array-reduce-0.0.0.tgz",
+      "integrity": "sha1-FziZ0//Rx9k4PkR5Ul2+J4yrXys="
+    },
+    "array-union": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz",
+      "integrity": "sha1-mjRBDk9OPaI96jdb5b5w8kd47Dk=",
+      "requires": {
+        "array-uniq": "1.0.3"
+      }
+    },
+    "array-uniq": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz",
+      "integrity": "sha1-r2rId6Jcx/dOBYiUdThY39sk/bY="
+    },
+    "array-unique": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.3.2.tgz",
+      "integrity": "sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg="
+    },
+    "arrify": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz",
+      "integrity": "sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0="
+    },
+    "asap": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz",
+      "integrity": "sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY="
+    },
+    "asn1": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.3.tgz",
+      "integrity": "sha1-2sh4dxPJlmhJ/IGAd36+nB3fO4Y="
+    },
+    "asn1.js": {
+      "version": "4.9.2",
+      "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-4.9.2.tgz",
+      "integrity": "sha512-b/OsSjvWEo8Pi8H0zsDd2P6Uqo2TK2pH8gNLSJtNLM2Db0v2QaAZ0pBQJXVjAn4gBuugeVDr7s63ZogpUIwWDg==",
+      "requires": {
+        "bn.js": "4.11.8",
+        "inherits": "2.0.3",
+        "minimalistic-assert": "1.0.0"
+      }
+    },
+    "assert": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/assert/-/assert-1.4.1.tgz",
+      "integrity": "sha1-mZEtWRg2tab1s0XA8H7vwI/GXZE=",
+      "requires": {
+        "util": "0.10.3"
+      }
+    },
+    "assert-plus": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
+      "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
+    },
+    "ast-types": {
+      "version": "0.9.14",
+      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.9.14.tgz",
+      "integrity": "sha512-Ebvx7/0lLboCdyEmAw/4GqwBeKIijPveXNiVGhCGCNxc7z26T5he7DC6ARxu8ByKuzUZZcLog+VP8GMyZrBzJw=="
+    },
+    "astral-regex": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/astral-regex/-/astral-regex-1.0.0.tgz",
+      "integrity": "sha512-+Ryf6g3BKoRc7jfp7ad8tM4TtMiaWvbF/1/sQcZPkkS7ag3D5nMBCe2UfOTONtAkaG0tO0ij3C5Lwmf1EiyjHg=="
+    },
+    "async": {
+      "version": "2.6.0",
+      "resolved": "https://registry.npmjs.org/async/-/async-2.6.0.tgz",
+      "integrity": "sha512-xAfGg1/NTLBBKlHFmnd7PlmUW9KhVQIUuSrYem9xzFUZy13ScvtyGGejaae9iAVRiRq9+Cx7DPFaAAhCpyxyPw==",
+      "requires": {
+        "lodash": "4.17.4"
+      }
+    },
+    "async-each": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/async-each/-/async-each-1.0.1.tgz",
+      "integrity": "sha1-GdOGodntxufByF04iu28xW0zYC0="
+    },
+    "async-foreach": {
+      "version": "0.1.3",
+      "resolved": "https://registry.npmjs.org/async-foreach/-/async-foreach-0.1.3.tgz",
+      "integrity": "sha1-NhIfhFwFeBct5Bmpfb6x0W7DRUI="
+    },
+    "asynckit": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
+      "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k="
+    },
+    "atob": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/atob/-/atob-2.0.3.tgz",
+      "integrity": "sha1-GcenYEc3dEaPILLS0DNyrX1Mv10="
+    },
+    "autolinker": {
+      "version": "0.15.3",
+      "resolved": "https://registry.npmjs.org/autolinker/-/autolinker-0.15.3.tgz",
+      "integrity": "sha1-NCQX2PLzRhsUzwkIjV7fh5HcmDI="
+    },
+    "autoprefixer": {
+      "version": "7.1.6",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-7.1.6.tgz",
+      "integrity": "sha512-C9yv/UF3X+eJTi/zvfxuyfxmLibYrntpF3qoJYrMeQwgUJOZrZvpJiMG2FMQ3qnhWtF/be4pYONBBw95ZGe3vA==",
+      "requires": {
+        "browserslist": "2.8.0",
+        "caniuse-lite": "1.0.30000760",
+        "normalize-range": "0.1.2",
+        "num2fraction": "1.2.2",
+        "postcss": "6.0.14",
+        "postcss-value-parser": "3.3.0"
+      }
+    },
+    "awesome-typescript-loader": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/awesome-typescript-loader/-/awesome-typescript-loader-3.3.0.tgz",
+      "integrity": "sha512-BZklPjSHwOF15sQ28Bo25HMzH4WrF1i2CLr105lXe2p/o++F5n4Mi4My3WHJhG8bEpXweqlVN6b03ZFKvANXiA==",
+      "requires": {
+        "colors": "1.1.2",
+        "enhanced-resolve": "3.3.0",
+        "loader-utils": "1.1.0",
+        "lodash": "4.17.4",
+        "micromatch": "3.1.4",
+        "mkdirp": "0.5.1",
+        "object-assign": "4.1.1",
+        "source-map-support": "0.4.18"
+      }
+    },
+    "aws-sign2": {
+      "version": "0.7.0",
+      "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.7.0.tgz",
+      "integrity": "sha1-tG6JCTSpWR8tL2+G1+ap8bP+dqg="
+    },
+    "aws4": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.6.0.tgz",
+      "integrity": "sha1-g+9cqGCysy5KDe7e6MdxudtXRx4="
+    },
+    "axios": {
+      "version": "0.16.2",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-0.16.2.tgz",
+      "integrity": "sha1-uk+S8XFn37q0CYN4VFS5rBScPG0=",
+      "requires": {
+        "follow-redirects": "1.2.5",
+        "is-buffer": "1.1.6"
+      }
+    },
+    "babel-code-frame": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
+      "integrity": "sha1-Y/1D99weO7fONZR9uP42mj9Yx0s=",
+      "requires": {
+        "chalk": "1.1.3",
+        "esutils": "2.0.2",
+        "js-tokens": "3.0.2"
+      },
       "dependencies": {
-        "@types/jest": {
-          "version": "21.1.0",
-          "bundled": true
-        },
-        "@types/react-dom": {
-          "version": "15.5.5",
-          "bundled": true
-        },
-        "acorn": {
-          "version": "5.1.1",
-          "bundled": true
-        },
-        "ajv": {
-          "version": "5.2.2",
-          "bundled": true
-        },
-        "ajv-keywords": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "ansi-regex": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "async": {
-          "version": "2.5.0",
-          "bundled": true
-        },
-        "autoprefixer": {
-          "version": "6.7.7",
-          "bundled": true
-        },
-        "browserslist": {
-          "version": "1.7.7",
-          "bundled": true
-        },
-        "camelcase": {
-          "version": "4.1.0",
-          "bundled": true
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
         },
         "chalk": {
           "version": "1.1.3",
-          "bundled": true,
-          "dependencies": {
-            "ansi-regex": {
-              "version": "2.1.1",
-              "bundled": true
-            },
-            "strip-ansi": {
-              "version": "3.0.1",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "2.0.0",
-              "bundled": true
-            }
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
           }
         },
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true
-        },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "crypto-browserify": {
-          "version": "3.11.1",
-          "bundled": true
-        },
-        "css-loader": {
-          "version": "0.28.5",
-          "bundled": true
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true
-        },
-        "diff": {
-          "version": "3.2.0",
-          "bundled": true
-        },
-        "enhanced-resolve": {
-          "version": "3.4.1",
-          "bundled": true
-        },
-        "find-up": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "glob": {
-          "version": "7.1.1",
-          "bundled": true
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "is-fullwidth-code-point": {
+        "supports-color": {
           "version": "2.0.0",
-          "bundled": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "load-json-file": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "loader-utils": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "lodash.camelcase": {
-          "version": "4.3.0",
-          "bundled": true
-        },
-        "lolex": {
-          "version": "1.6.0",
-          "bundled": true
-        },
-        "mocha": {
-          "version": "3.5.0",
-          "bundled": true
-        },
-        "node-libs-browser": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "office-ui-fabric-core": {
-          "version": "9.0.0",
-          "bundled": true
-        },
-        "os-browserify": {
-          "version": "0.2.1",
-          "bundled": true
-        },
-        "os-locale": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "path-type": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "postcss": {
-          "version": "5.2.17",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.7",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "3.2.3",
-              "bundled": true
-            }
-          }
-        },
-        "postcss-loader": {
-          "version": "1.3.3",
-          "bundled": true
-        },
-        "read-pkg": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg-up": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "bundled": true,
-          "dependencies": {
-            "string_decoder": {
-              "version": "1.0.3",
-              "bundled": true
-            }
-          }
-        },
-        "sinon": {
-          "version": "2.4.1",
-          "bundled": true
-        },
-        "source-list-map": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "0.9.2",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "0.2.17",
-              "bundled": true
-            }
-          }
-        },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "strip-ansi": {
-          "version": "4.0.0",
-          "bundled": true
-        },
-        "strip-bom": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "style-loader": {
-          "version": "0.17.0",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "3.1.2",
-          "bundled": true
-        },
-        "tapable": {
-          "version": "0.2.8",
-          "bundled": true
-        },
-        "timers-browserify": {
-          "version": "2.0.4",
-          "bundled": true
-        },
-        "url": {
-          "version": "0.11.0",
-          "bundled": true,
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "bundled": true
-            }
-          }
-        },
-        "watchpack": {
-          "version": "1.4.0",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            }
-          }
-        },
-        "webpack": {
-          "version": "3.5.5",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            },
-            "has-flag": {
-              "version": "2.0.0",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "1.1.0",
-              "bundled": true
-            },
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "4.2.1",
-              "bundled": true
-            }
-          }
-        },
-        "webpack-sources": {
-          "version": "1.0.1",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            }
-          }
-        },
-        "which-module": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "yargs": {
-          "version": "8.0.2",
-          "bundled": true
-        },
-        "yargs-parser": {
-          "version": "7.0.0",
-          "bundled": true
-        }
-      }
-    },
-    "@rush-temp/office-ui-fabric-react-tslint": {
-      "version": "file:projects/office-ui-fabric-react-tslint"
-    },
-    "@rush-temp/ssr-tests": {
-      "version": "file:projects/ssr-tests",
-      "dependencies": {
-        "acorn": {
-          "version": "5.1.1",
-          "bundled": true
-        },
-        "ajv": {
-          "version": "5.2.2",
-          "bundled": true
-        },
-        "ajv-keywords": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "ansi-regex": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "async": {
-          "version": "2.5.0",
-          "bundled": true
-        },
-        "camelcase": {
-          "version": "4.1.0",
-          "bundled": true
-        },
-        "cliui": {
-          "version": "3.2.0",
-          "bundled": true,
-          "dependencies": {
-            "ansi-regex": {
-              "version": "2.1.1",
-              "bundled": true
-            },
-            "is-fullwidth-code-point": {
-              "version": "1.0.0",
-              "bundled": true
-            },
-            "string-width": {
-              "version": "1.0.2",
-              "bundled": true
-            },
-            "strip-ansi": {
-              "version": "3.0.1",
-              "bundled": true
-            }
-          }
-        },
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true
-        },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "crypto-browserify": {
-          "version": "3.11.1",
-          "bundled": true
-        },
-        "debug": {
-          "version": "2.6.0",
-          "bundled": true
-        },
-        "diff": {
-          "version": "3.2.0",
-          "bundled": true
-        },
-        "enhanced-resolve": {
-          "version": "3.4.1",
-          "bundled": true
-        },
-        "find-up": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "glob": {
-          "version": "7.1.1",
-          "bundled": true
-        },
-        "has-flag": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "load-json-file": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "loader-utils": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "mocha": {
-          "version": "3.3.0",
-          "bundled": true
-        },
-        "ms": {
-          "version": "0.7.2",
-          "bundled": true
-        },
-        "node-libs-browser": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "os-browserify": {
-          "version": "0.2.1",
-          "bundled": true
-        },
-        "os-locale": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "path-type": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "pify": {
-          "version": "2.3.0",
-          "bundled": true
-        },
-        "read-pkg": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg-up": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "bundled": true,
-          "dependencies": {
-            "string_decoder": {
-              "version": "1.0.3",
-              "bundled": true
-            }
-          }
-        },
-        "source-list-map": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "source-map": {
-          "version": "0.5.7",
-          "bundled": true
-        },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "bundled": true
-        },
-        "string_decoder": {
-          "version": "0.10.31",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "strip-ansi": {
-          "version": "4.0.0",
-          "bundled": true
-        },
-        "strip-bom": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "3.1.2",
-          "bundled": true
-        },
-        "tapable": {
-          "version": "0.2.8",
-          "bundled": true
-        },
-        "timers-browserify": {
-          "version": "2.0.4",
-          "bundled": true
-        },
-        "url": {
-          "version": "0.11.0",
-          "bundled": true,
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "bundled": true
-            }
-          }
-        },
-        "watchpack": {
-          "version": "1.4.0",
-          "bundled": true
-        },
-        "webpack": {
-          "version": "3.5.5",
-          "bundled": true,
-          "dependencies": {
-            "has-flag": {
-              "version": "2.0.0",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "4.2.1",
-              "bundled": true
-            }
-          }
-        },
-        "webpack-sources": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "which-module": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "yargs": {
-          "version": "8.0.2",
-          "bundled": true
-        },
-        "yargs-parser": {
-          "version": "7.0.0",
-          "bundled": true
-        }
-      }
-    },
-    "@rush-temp/styling": {
-      "version": "file:projects/styling",
-      "dependencies": {
-        "acorn": {
-          "version": "5.1.1",
-          "bundled": true
-        },
-        "ajv": {
-          "version": "5.2.2",
-          "bundled": true
-        },
-        "ajv-keywords": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "ansi-regex": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "async": {
-          "version": "2.5.0",
-          "bundled": true
-        },
-        "camelcase": {
-          "version": "4.1.0",
-          "bundled": true
-        },
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true
-        },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "crypto-browserify": {
-          "version": "3.11.1",
-          "bundled": true
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true
-        },
-        "diff": {
-          "version": "3.2.0",
-          "bundled": true
-        },
-        "enhanced-resolve": {
-          "version": "3.4.1",
-          "bundled": true
-        },
-        "find-up": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "glob": {
-          "version": "7.1.1",
-          "bundled": true
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "load-json-file": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "loader-utils": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "mocha": {
-          "version": "3.5.0",
-          "bundled": true
-        },
-        "node-libs-browser": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "os-browserify": {
-          "version": "0.2.1",
-          "bundled": true
-        },
-        "os-locale": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "path-type": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg-up": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "bundled": true,
-          "dependencies": {
-            "string_decoder": {
-              "version": "1.0.3",
-              "bundled": true
-            }
-          }
-        },
-        "source-list-map": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "0.9.2",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "0.2.17",
-              "bundled": true
-            }
-          }
-        },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "strip-ansi": {
-          "version": "4.0.0",
-          "bundled": true
-        },
-        "strip-bom": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "3.1.2",
-          "bundled": true
-        },
-        "tapable": {
-          "version": "0.2.8",
-          "bundled": true
-        },
-        "timers-browserify": {
-          "version": "2.0.4",
-          "bundled": true
-        },
-        "url": {
-          "version": "0.11.0",
-          "bundled": true,
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "bundled": true
-            }
-          }
-        },
-        "watchpack": {
-          "version": "1.4.0",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            }
-          }
-        },
-        "webpack": {
-          "version": "3.5.5",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            },
-            "has-flag": {
-              "version": "2.0.0",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "1.1.0",
-              "bundled": true
-            },
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            },
-            "supports-color": {
-              "version": "4.2.1",
-              "bundled": true
-            }
-          }
-        },
-        "webpack-sources": {
-          "version": "1.0.1",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            }
-          }
-        },
-        "which-module": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "yargs": {
-          "version": "8.0.2",
-          "bundled": true
-        },
-        "yargs-parser": {
-          "version": "7.0.0",
-          "bundled": true
-        }
-      }
-    },
-    "@rush-temp/test-bundle-button": {
-      "version": "file:projects/test-bundle-button",
-      "dependencies": {
-        "acorn": {
-          "version": "5.1.1",
-          "bundled": true
-        },
-        "ajv": {
-          "version": "5.2.2",
-          "bundled": true
-        },
-        "ajv-keywords": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "ansi-regex": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "async": {
-          "version": "2.5.0",
-          "bundled": true
-        },
-        "camelcase": {
-          "version": "4.1.0",
-          "bundled": true
-        },
-        "constants-browserify": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "crypto-browserify": {
-          "version": "3.11.1",
-          "bundled": true
-        },
-        "enhanced-resolve": {
-          "version": "3.4.1",
-          "bundled": true
-        },
-        "find-up": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "has-flag": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "https-browserify": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "load-json-file": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "loader-utils": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "node-libs-browser": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "os-browserify": {
-          "version": "0.2.1",
-          "bundled": true
-        },
-        "os-locale": {
-          "version": "2.1.0",
-          "bundled": true
-        },
-        "path-type": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "read-pkg-up": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "readable-stream": {
-          "version": "2.3.3",
-          "bundled": true,
-          "dependencies": {
-            "string_decoder": {
-              "version": "1.0.3",
-              "bundled": true
-            }
-          }
-        },
-        "source-list-map": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "0.9.2",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "0.2.17",
-              "bundled": true
-            }
-          }
-        },
-        "stream-browserify": {
-          "version": "2.0.1",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "strip-ansi": {
-          "version": "4.0.0",
-          "bundled": true
-        },
-        "strip-bom": {
-          "version": "3.0.0",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "4.2.1",
-          "bundled": true
-        },
-        "tapable": {
-          "version": "0.2.8",
-          "bundled": true
-        },
-        "timers-browserify": {
-          "version": "2.0.4",
-          "bundled": true
-        },
-        "url": {
-          "version": "0.11.0",
-          "bundled": true,
-          "dependencies": {
-            "punycode": {
-              "version": "1.3.2",
-              "bundled": true
-            }
-          }
-        },
-        "watchpack": {
-          "version": "1.4.0",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            }
-          }
-        },
-        "webpack": {
-          "version": "3.5.5",
-          "bundled": true,
-          "dependencies": {
-            "async": {
-              "version": "2.5.0",
-              "bundled": true
-            },
-            "loader-utils": {
-              "version": "1.1.0",
-              "bundled": true
-            },
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            }
-          }
-        },
-        "webpack-sources": {
-          "version": "1.0.1",
-          "bundled": true,
-          "dependencies": {
-            "source-map": {
-              "version": "0.5.6",
-              "bundled": true
-            }
-          }
-        },
-        "which-module": {
-          "version": "2.0.0",
-          "bundled": true
-        },
-        "yargs": {
-          "version": "8.0.2",
-          "bundled": true
-        },
-        "yargs-parser": {
-          "version": "7.0.0",
-          "bundled": true
-        }
-      }
-    },
-    "@rush-temp/todo-app": {
-      "version": "file:projects/todo-app",
-      "dependencies": {
-        "typescript": {
-          "version": "2.4.2",
-          "bundled": true
-        }
-      }
-    },
-    "@rush-temp/utilities": {
-      "version": "file:projects/utilities",
-      "dependencies": {
-        "@types/jest": {
-          "version": "21.1.0",
-          "bundled": true
-        },
-        "async": {
-          "version": "0.9.2",
-          "bundled": true
-        },
-        "commander": {
-          "version": "2.9.0",
-          "bundled": true
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true,
-          "dependencies": {
-            "ms": {
-              "version": "2.0.0",
-              "bundled": true
-            }
-          }
-        },
-        "diff": {
-          "version": "3.2.0",
-          "bundled": true
-        },
-        "glob": {
-          "version": "7.1.1",
-          "bundled": true
-        },
-        "lolex": {
-          "version": "1.6.0",
-          "bundled": true
-        },
-        "mocha": {
-          "version": "3.5.0",
-          "bundled": true
-        },
-        "ms": {
-          "version": "0.7.2",
-          "bundled": true
-        },
-        "sinon": {
-          "version": "2.4.1",
-          "bundled": true
-        },
-        "source-map": {
-          "version": "0.1.43",
-          "bundled": true
-        },
-        "source-map-loader": {
-          "version": "0.2.1",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "3.1.2",
-          "bundled": true
-        }
-      }
-    },
-    "@rush-temp/vr-tests": {
-      "version": "file:projects/vr-tests",
-      "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "bundled": true
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "bundled": true,
-          "dependencies": {
-            "supports-color": {
-              "version": "2.0.0",
-              "bundled": true
-            }
-          }
-        },
-        "css-loader": {
-          "version": "0.27.3",
-          "bundled": true
-        },
-        "has-flag": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "postcss": {
-          "version": "5.2.17",
-          "bundled": true
-        },
-        "postcss-loader": {
-          "version": "1.3.3",
-          "bundled": true
-        },
-        "source-list-map": {
-          "version": "0.1.8",
-          "bundled": true
-        },
-        "source-map": {
-          "version": "0.5.7",
-          "bundled": true
-        },
-        "style-loader": {
-          "version": "0.16.1",
-          "bundled": true
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "bundled": true
-        },
-        "typescript": {
-          "version": "2.4.2",
-          "bundled": true
-        }
-      }
-    },
-    "@storybook/addon-actions": {
-      "version": "3.2.12",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-actions/-/addon-actions-3.2.12.tgz",
-      "integrity": "sha512-or4PAzYD2aUQ7E52zZkB97S96r7YUh15ZiLJesMYoJPs44gNFTCuvThO63yvV5IslD0v8gINgS9muOE0aEI+gg=="
-    },
-    "@storybook/addon-links": {
-      "version": "3.2.12",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-links/-/addon-links-3.2.12.tgz",
-      "integrity": "sha512-8cv5Pcoersdbp3QrYnzp+vXpCut4EIWEVoqkJUDosC4r+qT36nnq3l+Ot7ic9R4f87CdPM/Wjt2qzgTpamoSvA=="
-    },
-    "@storybook/addon-options": {
-      "version": "3.2.3",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-options/-/addon-options-3.2.3.tgz",
-      "integrity": "sha1-6jdA0onUKc52fpaZvzpkfddBWS0="
-    },
-    "@storybook/addons": {
-      "version": "3.2.12",
-      "resolved": "https://registry.npmjs.org/@storybook/addons/-/addons-3.2.12.tgz",
-      "integrity": "sha512-gbbW68MWfDxsht9v9V/rqx6aVZUBw6akwyv45T5+lM23Sy7GfoOQ0jR7eRl+DM4KmA/74P/rIZRu0mznT9IfCg=="
-    },
-    "@storybook/channel-postmessage": {
-      "version": "3.2.12",
-      "resolved": "https://registry.npmjs.org/@storybook/channel-postmessage/-/channel-postmessage-3.2.12.tgz",
-      "integrity": "sha512-IjSI7Mjf/u+Msf8Jm+zlYlTuzYxj2yvcQV/rFkm7fkhmv2UAZTsb5B8Mi3KKN7Lr9d5eRumLCtUBkzkBOcSzSg=="
-    },
-    "@storybook/channels": {
-      "version": "3.2.12",
-      "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-3.2.12.tgz",
-      "integrity": "sha512-smexrg30+mlXIsS/z/0CN+a3Tn/DePZETnu3G42r8Qdm7PbdRo1oC2pcHAEmIjaukRp5qK+txuDJ6WdOvyVsMw=="
-    },
-    "@storybook/components": {
-      "version": "3.2.12",
-      "resolved": "https://registry.npmjs.org/@storybook/components/-/components-3.2.12.tgz",
-      "integrity": "sha512-vMVrPmXKP7Rh3JfHfN7dAf+MJkjyl0iaU4TePsSZD3esqpkr24H+yw0HiLKBsINPJvFlEGLfDT73urXcb4oPQQ=="
-    },
-    "@storybook/react": {
-      "version": "3.2.12",
-      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-3.2.12.tgz",
-      "integrity": "sha512-/TWoVYHfoUnEAjcEj463zRIA7SJjB6RIzShFzI2HtJw+P2EdT8mFN2EYGdsuGHQqkbGSC3owHSy1Jxuy1GVuqQ==",
-      "dependencies": {
-        "file-loader": {
-          "version": "0.11.2",
-          "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.11.2.tgz",
-          "integrity": "sha512-N+uhF3mswIFeziHQjGScJ/yHXYt3DiLBeC+9vWW+WjUBiClMSOlV1YrXQi+7KM2aA3Rn4Bybgv+uXFQbfkzpvg=="
-        }
-      }
-    },
-    "@storybook/react-fuzzy": {
-      "version": "0.4.1",
-      "resolved": "https://registry.npmjs.org/@storybook/react-fuzzy/-/react-fuzzy-0.4.1.tgz",
-      "integrity": "sha512-UCV8HZ3rzEpn36Tn+Ip0ZqcwQjphIcxmnWDF7MgjBJkCPlSahSzALhS9EH6WLBeCDzajoDynAAUhwqC1EPkhkA=="
-    },
-    "@storybook/ui": {
-      "version": "3.2.12",
-      "resolved": "https://registry.npmjs.org/@storybook/ui/-/ui-3.2.12.tgz",
-      "integrity": "sha512-g7O+YO92qJiWqgSp1U1q4sSgiobNxRBSWCrlYmRfHAUzEzD4cgYDnlldFWWUvR4zCEOCIG/MbJKtqG4727srNg=="
-    },
-    "@types/chai": {
-      "version": "3.4.35",
-      "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.35.tgz",
-      "integrity": "sha1-6NZfg0ktKUT4FvxiB0GCHCioyQA="
-    },
-    "@types/cheerio": {
-      "version": "0.22.3",
-      "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.3.tgz",
-      "integrity": "sha512-E7MRbFAckaHrH5+CGngj5Iw9bJT1G4vqxqcQdOawdWegaKtgedbrGprHihLVLeADuMIS4H9CxAQzV561gD5buA=="
-    },
-    "@types/enzyme": {
-      "version": "2.8.8",
-      "resolved": "https://registry.npmjs.org/@types/enzyme/-/enzyme-2.8.8.tgz",
-      "integrity": "sha512-KBw0ZzOQNtwVGO4egRjEpQbXMFCSevy+gRFzaLXrU64LrVVuJF0FqVIdzed0NCSP+nMALj001//dwYKV/VDlCA=="
-    },
-    "@types/es6-promise": {
-      "version": "0.0.32",
-      "resolved": "https://registry.npmjs.org/@types/es6-promise/-/es6-promise-0.0.32.tgz",
-      "integrity": "sha1-O89E+x5Cnz33YYjIxth0Rjujcf0="
-    },
-    "@types/highlight.js": {
-      "version": "9.1.9",
-      "resolved": "https://registry.npmjs.org/@types/highlight.js/-/highlight.js-9.1.9.tgz",
-      "integrity": "sha1-7WM2lV6vIzt163kjubHzc9BF7wE="
-    },
-    "@types/jest": {
-      "version": "21.1.4",
-      "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.4.tgz",
-      "integrity": "sha512-CItNfCz6osAOxdhWMbUYbSz0iMGKuxDHu/0iaqnsGKQd98OY2J8EBtVQvozc3gXvPh2Y3uAjTGgqYv8rEj6qzA=="
-    },
-    "@types/mocha": {
-      "version": "2.2.39",
-      "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-2.2.39.tgz",
-      "integrity": "sha1-9o1j24tpw46VWLQHNSXPlsT3qCk="
-    },
-    "@types/node": {
-      "version": "8.0.26",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-8.0.26.tgz",
-      "integrity": "sha512-wbKN0MB4XsjdnSE04HiCzLoBDirGCM6zXrqavSj44nZnPFYpnrTF64E9O6Xmf0ca/IuKK/BHUcXwMiwk92gW6Q=="
-    },
-    "@types/prop-types": {
-      "version": "15.5.1",
-      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.5.1.tgz",
-      "integrity": "sha1-Hs9SYhKZ5luFU3Qzf7Ef0tEGb8E="
-    },
-    "@types/react": {
-      "version": "15.0.38",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.38.tgz",
-      "integrity": "sha512-CkRB27L/kMDu7K20U0V7BwYK9/kPd9Im6Jlxv2vAEolYBvQy6JrSpPJsbZXtOk4MoDUomkct8Q7PNBUSLd0fmg=="
-    },
-    "@types/react-addons-test-utils": {
-      "version": "0.14.18",
-      "resolved": "https://registry.npmjs.org/@types/react-addons-test-utils/-/react-addons-test-utils-0.14.18.tgz",
-      "integrity": "sha1-g+EK8dvl7CU1vC3FNz17w7gv3uE="
-    },
-    "@types/react-dom": {
-      "version": "15.5.1",
-      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-15.5.1.tgz",
-      "integrity": "sha512-4c+e/QPfvSa48YhgGOcQWoHishTo6BuJqka0Bh8qeLdnK1jS+1Nz8W/w1G17AIjtLxONYFUqmi8qyt+8p/yMFA=="
-    },
-    "@types/react-test-renderer": {
-      "version": "15.5.5",
-      "resolved": "https://registry.npmjs.org/@types/react-test-renderer/-/react-test-renderer-15.5.5.tgz",
-      "integrity": "sha512-SEt2f9Hf+Y/OGstIDrINnls6wpeZGt9xiROBFjfMxXKbqg7zYkPVB7D58Rg9TZbi2kuxatchVTdiliYLs8WK0g=="
-    },
-    "@types/resemblejs": {
-      "version": "1.3.28",
-      "resolved": "https://registry.npmjs.org/@types/resemblejs/-/resemblejs-1.3.28.tgz",
-      "integrity": "sha1-Lg2ztf2w8vPUVPXXLhMkEgnql60="
-    },
-    "@types/sinon": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/@types/sinon/-/sinon-2.2.2.tgz",
-      "integrity": "sha1-qA2khougisysvOTTcnbzXhugpS8="
-    },
-    "@types/storybook__react": {
-      "version": "3.0.5",
-      "resolved": "https://registry.npmjs.org/@types/storybook__react/-/storybook__react-3.0.5.tgz",
-      "integrity": "sha512-febLx40iQWoQKVaEMpxdzkJnqncPHoRivlilc3JhHJiRuBY1Mqa1yTKcvQ5RiFAYFIuv4x+bRuSIXErk5v41Bg=="
-    },
-    "@types/webpack-env": {
-      "version": "1.13.0",
-      "resolved": "https://registry.npmjs.org/@types/webpack-env/-/webpack-env-1.13.0.tgz",
-      "integrity": "sha1-MEQ4FkfhHulzxa8uklMjkw9pHYA="
-    },
-    "@uifabric/icons": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.2.0.tgz",
-      "integrity": "sha512-P5kfPej/wxgR8jZt/GqnU0FqYcz+JH1iCcaaYd6p9L3opmZtu4w5duKeqs+Bc1u7K16r800EQfLgKe76rt6AuA=="
-    },
-    "@uifabric/merge-styles": {
-      "version": "5.4.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.4.1.tgz",
-      "integrity": "sha512-xXwP5gMwTXjBVMcJBPVDm25/ZINzBzIpweogvxfrPwhINV13KFb0NCWweHAOR9tv32LWcSVJ5aaqetK2Q4qqVg=="
-    },
-    "@uifabric/styling": {
-      "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.3.0.tgz",
-      "integrity": "sha512-K+IvuSlwK2i5L1Pxoes1kCjsCjANjlcTJP6ZDv2uhhHjn4HsA2iPFaMSmIfly/gagaH6IYVBRcQ+SyXDKFsjiA=="
-    },
-    "@uifabric/utilities": {
-      "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.3.0.tgz",
-      "integrity": "sha512-geCMrHaEBmHz0RKWq9Lf0ExKLfYmq9nqx+9iyp/l7RN5x5AqMQpy4b6NXwEbpeo//1+HQnAdg7q6ZS7Ll5+vjQ=="
-    },
-    "abab": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/abab/-/abab-1.0.4.tgz",
-      "integrity": "sha1-X6rZwsB/YN12dw9xzwJbYqY8/U4="
-    },
-    "abbrev": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz",
-      "integrity": "sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q=="
-    },
-    "accepts": {
-      "version": "1.3.4",
-      "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.4.tgz",
-      "integrity": "sha1-hiRnWMfdbSGmR0/whKR0DsBesh8="
-    },
-    "acorn": {
-      "version": "4.0.13",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
-      "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c="
-    },
-    "acorn-dynamic-import": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/acorn-dynamic-import/-/acorn-dynamic-import-2.0.2.tgz",
-      "integrity": "sha1-x1K9IQvvZ5UBtsbLf8hPj0cVjMQ="
-    },
-    "acorn-globals": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/acorn-globals/-/acorn-globals-3.1.0.tgz",
-      "integrity": "sha1-/YJw9x+7SZawBPqIDuXUZXOnMb8="
-    },
-    "agent-base": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-2.1.1.tgz",
-      "integrity": "sha1-1t4Q1a9hMtW9aSQn1G/FOFOQlMc=",
-      "dependencies": {
-        "semver": {
-          "version": "5.0.3",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.0.3.tgz",
-          "integrity": "sha1-d0Zt5YnNXTyV8TiqeLxWmjy10no="
-        }
-      }
-    },
-    "airbnb-js-shims": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/airbnb-js-shims/-/airbnb-js-shims-1.3.0.tgz",
-      "integrity": "sha512-Y/9jgf3uEdNyeWPUV1N49FowM/qMIiKSTkRUpYT4jpHkSADfTiRVwI8Mm6o4CIxhnBK1uMf4RIYNYKwwILMCAQ=="
-    },
-    "ajv": {
-      "version": "5.2.3",
-      "resolved": "https://registry.npmjs.org/ajv/-/ajv-5.2.3.tgz",
-      "integrity": "sha1-wG9Zh3jETGsWGrr+NGa4GtGBTtI="
-    },
-    "ajv-keywords": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-2.1.0.tgz",
-      "integrity": "sha1-opbhf3v658HOT34N5T0pyzIWLfA="
-    },
-    "align-text": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/align-text/-/align-text-0.1.4.tgz",
-      "integrity": "sha1-DNkKVhCT810KmSVsIrcGlDP60Rc=",
-      "dependencies": {
-        "kind-of": {
-          "version": "3.2.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
-        }
-      }
-    },
-    "alphanum-sort": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/alphanum-sort/-/alphanum-sort-1.0.2.tgz",
-      "integrity": "sha1-l6ERlkmyEa0zaR2fn0hqjsn74KM="
-    },
-    "amdefine": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz",
-      "integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU="
-    },
-    "ansi-escapes": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-1.4.0.tgz",
-      "integrity": "sha1-06ioOzGapneTZisT52HHkRQiMG4="
-    },
-    "ansi-html": {
-      "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/ansi-html/-/ansi-html-0.0.7.tgz",
-      "integrity": "sha1-gTWEAhliqenm/QOflA0S9WynhZ4="
-    },
-    "ansi-regex": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
-      "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
-    },
-    "ansi-styles": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
-      "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug=="
-    },
-    "ansicolors": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/ansicolors/-/ansicolors-0.2.1.tgz",
-      "integrity": "sha1-vgiVmQl7dKXJxKhKDNvNtivYeu8="
-    },
-    "anymatch": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-1.3.2.tgz",
-      "integrity": "sha512-0XNayC8lTHQ2OI8aljNCN3sSx6hsr/1+rlcDAotXJR7C1oZZHCNsfpbKwMjRA3Uqb5tF1Rae2oloTr4xpq+WjA==",
-      "dependencies": {
-        "arr-diff": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
-          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8="
-        },
-        "array-unique": {
-          "version": "0.2.1",
-          "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
-          "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM="
-        },
-        "braces": {
-          "version": "1.8.5",
-          "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
-          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
-        },
-        "expand-brackets": {
-          "version": "0.1.5",
-          "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
-          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s="
-        },
-        "extglob": {
-          "version": "0.3.2",
-          "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
-          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
-        },
-        "kind-of": {
-          "version": "3.2.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
-        },
-        "micromatch": {
-          "version": "2.3.11",
-          "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
-          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
-        }
-      }
-    },
-    "append-transform": {
-      "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/append-transform/-/append-transform-0.4.0.tgz",
-      "integrity": "sha1-126/jKlNJ24keja61EpLdKthGZE="
-    },
-    "aproba": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.2.0.tgz",
-      "integrity": "sha512-Y9J6ZjXtoYh8RnXVCMOU/ttDmk1aBjunq9vO0ta5x85WDQiQfUF9sIPBITdbiiIVcBo03Hi3jMxigBtsddlXRw=="
-    },
-    "are-we-there-yet": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/are-we-there-yet/-/are-we-there-yet-1.1.4.tgz",
-      "integrity": "sha1-u13KOCu5TwXhUZQ3PRb9O6HKEQ0="
-    },
-    "argparse": {
-      "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.9.tgz",
-      "integrity": "sha1-c9g7wmP4bpf4zE9rrhsOkKfSLIY="
-    },
-    "arr-diff": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-4.0.0.tgz",
-      "integrity": "sha1-1kYQdP6/7HHn4VI1dhoyml3HxSA="
-    },
-    "arr-flatten": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/arr-flatten/-/arr-flatten-1.1.0.tgz",
-      "integrity": "sha512-L3hKV5R/p5o81R7O02IGnwpDmkp6E982XhtbuwSe3O4qOtMMMtodicASA1Cny2U+aCXcNpml+m4dPsvsJ3jatg=="
-    },
-    "arr-union": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/arr-union/-/arr-union-3.1.0.tgz",
-      "integrity": "sha1-45sJrqne+Gao8gbiiK9jkZuuOcQ="
-    },
-    "array-back": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/array-back/-/array-back-2.0.0.tgz",
-      "integrity": "sha512-eJv4pLLufP3g5kcZry0j6WXpIbzYw9GUB4mVJZno9wfwiBxbizTnHCw3VJb07cBihbFX48Y7oSrW9y+gt4glyw=="
-    },
-    "array-equal": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/array-equal/-/array-equal-1.0.0.tgz",
-      "integrity": "sha1-jCpe8kcv2ep0KwTHenUJO6J1fJM="
-    },
-    "array-filter": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/array-filter/-/array-filter-0.0.1.tgz",
-      "integrity": "sha1-fajPLiZijtcygDWB/SH2fKzS7uw="
-    },
-    "array-find": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/array-find/-/array-find-1.0.0.tgz",
-      "integrity": "sha1-bI4obRHtdoMn+OYuzuhzU8o+eLg="
-    },
-    "array-find-index": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/array-find-index/-/array-find-index-1.0.2.tgz",
-      "integrity": "sha1-3wEKoSh+Fku9pvlyOwqWoexBh6E="
-    },
-    "array-flatten": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
-      "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI="
-    },
-    "array-includes": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/array-includes/-/array-includes-3.0.3.tgz",
-      "integrity": "sha1-GEtI9i2S10UrsxsyMWXH+L0CJm0="
-    },
-    "array-map": {
-      "version": "0.0.0",
-      "resolved": "https://registry.npmjs.org/array-map/-/array-map-0.0.0.tgz",
-      "integrity": "sha1-iKK6tz0c97zVwbEYoAP2b2ZfpmI="
-    },
-    "array-reduce": {
-      "version": "0.0.0",
-      "resolved": "https://registry.npmjs.org/array-reduce/-/array-reduce-0.0.0.tgz",
-      "integrity": "sha1-FziZ0//Rx9k4PkR5Ul2+J4yrXys="
-    },
-    "array-union": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz",
-      "integrity": "sha1-mjRBDk9OPaI96jdb5b5w8kd47Dk="
-    },
-    "array-uniq": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz",
-      "integrity": "sha1-r2rId6Jcx/dOBYiUdThY39sk/bY="
-    },
-    "array-unique": {
-      "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.3.2.tgz",
-      "integrity": "sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg="
-    },
-    "arrify": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz",
-      "integrity": "sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0="
-    },
-    "asap": {
-      "version": "2.0.6",
-      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz",
-      "integrity": "sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY="
-    },
-    "asn1": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.3.tgz",
-      "integrity": "sha1-2sh4dxPJlmhJ/IGAd36+nB3fO4Y="
-    },
-    "asn1.js": {
-      "version": "4.9.1",
-      "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-4.9.1.tgz",
-      "integrity": "sha1-SLokC0WpKA6UdImQull9IWYX/UA="
-    },
-    "assert": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/assert/-/assert-1.4.1.tgz",
-      "integrity": "sha1-mZEtWRg2tab1s0XA8H7vwI/GXZE="
-    },
-    "assert-plus": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-      "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
-    },
-    "ast-types": {
-      "version": "0.9.12",
-      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.9.12.tgz",
-      "integrity": "sha1-sTYwDWcCZiWuFTJpgsqZGOXbc8k="
-    },
-    "astral-regex": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/astral-regex/-/astral-regex-1.0.0.tgz",
-      "integrity": "sha512-+Ryf6g3BKoRc7jfp7ad8tM4TtMiaWvbF/1/sQcZPkkS7ag3D5nMBCe2UfOTONtAkaG0tO0ij3C5Lwmf1EiyjHg=="
-    },
-    "async": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/async/-/async-2.5.0.tgz",
-      "integrity": "sha512-e+lJAJeNWuPCNyxZKOBdaJGyLGHugXVQtrAwtuAe2vhxTYxFTKE73p8JuTmdH0qdQZtDvI4dhJwjZc5zsfIsYw=="
-    },
-    "async-each": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/async-each/-/async-each-1.0.1.tgz",
-      "integrity": "sha1-GdOGodntxufByF04iu28xW0zYC0="
-    },
-    "async-foreach": {
-      "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/async-foreach/-/async-foreach-0.1.3.tgz",
-      "integrity": "sha1-NhIfhFwFeBct5Bmpfb6x0W7DRUI="
-    },
-    "asynckit": {
-      "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
-      "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k="
-    },
-    "atob": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/atob/-/atob-2.0.3.tgz",
-      "integrity": "sha1-GcenYEc3dEaPILLS0DNyrX1Mv10="
-    },
-    "autolinker": {
-      "version": "0.15.3",
-      "resolved": "https://registry.npmjs.org/autolinker/-/autolinker-0.15.3.tgz",
-      "integrity": "sha1-NCQX2PLzRhsUzwkIjV7fh5HcmDI="
-    },
-    "autoprefixer": {
-      "version": "7.1.5",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-7.1.5.tgz",
-      "integrity": "sha512-sMN453qIm8Z+tunzYWW+Y490wWkICHhCYm/VohLjjl+N7ARSFuF5au7E6tr7oEbeeXj8mNjpSw2kxjJaO6YCOw==",
-      "dependencies": {
-        "browserslist": {
-          "version": "2.5.1",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.5.1.tgz",
-          "integrity": "sha512-jAvM2ku7YDJ+leAq3bFH1DE0Ylw+F+EQDq4GkqZfgPEqpWYw9ofQH85uKSB9r3Tv7XDbfqVtE+sdvKJW7IlPJA=="
-        }
-      }
-    },
-    "awesome-typescript-loader": {
-      "version": "3.2.3",
-      "resolved": "https://registry.npmjs.org/awesome-typescript-loader/-/awesome-typescript-loader-3.2.3.tgz",
-      "integrity": "sha512-zGGD6j6jYYtIOBtfhtnrbNB3dlDThVdgF9CQhkPqBwPUUsyJOHNxj9d2LOmVJY1PlBoNPABoDeyRfphIDeYGxA=="
-    },
-    "aws-sign2": {
-      "version": "0.7.0",
-      "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.7.0.tgz",
-      "integrity": "sha1-tG6JCTSpWR8tL2+G1+ap8bP+dqg="
-    },
-    "aws4": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.6.0.tgz",
-      "integrity": "sha1-g+9cqGCysy5KDe7e6MdxudtXRx4="
-    },
-    "axios": {
-      "version": "0.16.2",
-      "resolved": "https://registry.npmjs.org/axios/-/axios-0.16.2.tgz",
-      "integrity": "sha1-uk+S8XFn37q0CYN4VFS5rBScPG0="
-    },
-    "babel-code-frame": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
-      "integrity": "sha1-Y/1D99weO7fONZR9uP42mj9Yx0s=",
-      "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
-        },
-        "supports-color": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-        }
-      }
-    },
-    "babel-core": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-core/-/babel-core-6.26.0.tgz",
-      "integrity": "sha1-rzL3izGm/O8RnIew/Y2XU/A6C7g=",
-      "dependencies": {
-        "source-map": {
-          "version": "0.5.7",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
-          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
-        }
-      }
-    },
-    "babel-generator": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-generator/-/babel-generator-6.26.0.tgz",
-      "integrity": "sha1-rBriAHC3n248odMmlhMFN3TyDcU=",
-      "dependencies": {
-        "jsesc": {
-          "version": "1.3.0",
-          "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-1.3.0.tgz",
-          "integrity": "sha1-RsP+yMGJKxKwgz25vHYiF226s0s="
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+        }
+      }
+    },
+    "babel-core": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-core/-/babel-core-6.26.0.tgz",
+      "integrity": "sha1-rzL3izGm/O8RnIew/Y2XU/A6C7g=",
+      "requires": {
+        "babel-code-frame": "6.26.0",
+        "babel-generator": "6.26.0",
+        "babel-helpers": "6.24.1",
+        "babel-messages": "6.23.0",
+        "babel-register": "6.26.0",
+        "babel-runtime": "6.26.0",
+        "babel-template": "6.26.0",
+        "babel-traverse": "6.26.0",
+        "babel-types": "6.26.0",
+        "babylon": "6.18.0",
+        "convert-source-map": "1.5.0",
+        "debug": "2.6.9",
+        "json5": "0.5.1",
+        "lodash": "4.17.4",
+        "minimatch": "3.0.4",
+        "path-is-absolute": "1.0.1",
+        "private": "0.1.8",
+        "slash": "1.0.0",
+        "source-map": "0.5.7"
+      },
+      "dependencies": {
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
+        }
+      }
+    },
+    "babel-generator": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-generator/-/babel-generator-6.26.0.tgz",
+      "integrity": "sha1-rBriAHC3n248odMmlhMFN3TyDcU=",
+      "requires": {
+        "babel-messages": "6.23.0",
+        "babel-runtime": "6.26.0",
+        "babel-types": "6.26.0",
+        "detect-indent": "4.0.0",
+        "jsesc": "1.3.0",
+        "lodash": "4.17.4",
+        "source-map": "0.5.7",
+        "trim-right": "1.0.1"
+      },
+      "dependencies": {
+        "jsesc": {
+          "version": "1.3.0",
+          "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-1.3.0.tgz",
+          "integrity": "sha1-RsP+yMGJKxKwgz25vHYiF226s0s="
         },
         "source-map": {
           "version": "0.5.7",
@@ -2966,27 +1403,54 @@
     "babel-helper-bindify-decorators": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-helper-bindify-decorators/-/babel-helper-bindify-decorators-6.24.1.tgz",
-      "integrity": "sha1-FMGeXxQte0fxmlJDHlKxzLxAozA="
+      "integrity": "sha1-FMGeXxQte0fxmlJDHlKxzLxAozA=",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "babel-traverse": "6.26.0",
+        "babel-types": "6.26.0"
+      }
     },
     "babel-helper-builder-binary-assignment-operator-visitor": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-helper-builder-binary-assignment-operator-visitor/-/babel-helper-builder-binary-assignment-operator-visitor-6.24.1.tgz",
-      "integrity": "sha1-zORReto1b0IgvK6KAsKzRvmlZmQ="
+      "integrity": "sha1-zORReto1b0IgvK6KAsKzRvmlZmQ=",
+      "requires": {
+        "babel-helper-explode-assignable-expression": "6.24.1",
+        "babel-runtime": "6.26.0",
+        "babel-types": "6.26.0"
+      }
     },
     "babel-helper-builder-react-jsx": {
       "version": "6.26.0",
       "resolved": "https://registry.npmjs.org/babel-helper-builder-react-jsx/-/babel-helper-builder-react-jsx-6.26.0.tgz",
-      "integrity": "sha1-Of+DE7dci2Xc7/HzHTg+D/KkCKA="
+      "integrity": "sha1-Of+DE7dci2Xc7/HzHTg+D/KkCKA=",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "babel-types": "6.26.0",
+        "esutils": "2.0.2"
+      }
     },
     "babel-helper-call-delegate": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-helper-call-delegate/-/babel-helper-call-delegate-6.24.1.tgz",
-      "integrity": "sha1-7Oaqzdx25Bw0YfiL/Fdb0Nqi340="
+      "integrity": "sha1-7Oaqzdx25Bw0YfiL/Fdb0Nqi340=",
+      "requires": {
+        "babel-helper-hoist-variables": "6.24.1",
+        "babel-runtime": "6.26.0",
+        "babel-traverse": "6.26.0",
+        "babel-types": "6.26.0"
+      }
     },
     "babel-helper-define-map": {
       "version": "6.26.0",
       "resolved": "https://registry.npmjs.org/babel-helper-define-map/-/babel-helper-define-map-6.26.0.tgz",
-      "integrity": "sha1-pfVtq0GiX5fstJjH66ypgZ+Vvl8="
+      "integrity": "sha1-pfVtq0GiX5fstJjH66ypgZ+Vvl8=",
+      "requires": {
+        "babel-helper-function-name": "6.24.1",
+        "babel-runtime": "6.26.0",
+        "babel-types": "6.26.0",
+        "lodash": "4.17.4"
+      }
     },
     "babel-helper-evaluate-path": {
       "version": "0.2.0",
@@ -2996,12 +1460,23 @@
     "babel-helper-explode-assignable-expression": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-helper-explode-assignable-expression/-/babel-helper-explode-assignable-expression-6.24.1.tgz",
-      "integrity": "sha1-8luCz33BBDPFX3BZLVdGQArCLKo="
+      "integrity": "sha1-8luCz33BBDPFX3BZLVdGQArCLKo=",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "babel-traverse": "6.26.0",
+        "babel-types": "6.26.0"
+      }
     },
     "babel-helper-explode-class": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-helper-explode-class/-/babel-helper-explode-class-6.24.1.tgz",
-      "integrity": "sha1-fcKjkQ3uAHBW4eMdZAztPVTqqes="
+      "integrity": "sha1-fcKjkQ3uAHBW4eMdZAztPVTqqes=",
+      "requires": {
+        "babel-helper-bindify-decorators": "6.24.1",
+        "babel-runtime": "6.26.0",
+        "babel-traverse": "6.26.0",
+        "babel-types": "6.26.0"
+      }
     },
     "babel-helper-flip-expressions": {
       "version": "0.2.0",
@@ -3011,17 +1486,32 @@
     "babel-helper-function-name": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-helper-function-name/-/babel-helper-function-name-6.24.1.tgz",
-      "integrity": "sha1-00dbjAPtmCQqJbSDUasYOZ01gKk="
+      "integrity": "sha1-00dbjAPtmCQqJbSDUasYOZ01gKk=",
+      "requires": {
+        "babel-helper-get-function-arity": "6.24.1",
+        "babel-runtime": "6.26.0",
+        "babel-template": "6.26.0",
+        "babel-traverse": "6.26.0",
+        "babel-types": "6.26.0"
+      }
     },
     "babel-helper-get-function-arity": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-helper-get-function-arity/-/babel-helper-get-function-arity-6.24.1.tgz",
-      "integrity": "sha1-j3eCqpNAfEHTqlCQj4mwMbG2hT0="
+      "integrity": "sha1-j3eCqpNAfEHTqlCQj4mwMbG2hT0=",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "babel-types": "6.26.0"
+      }
     },
     "babel-helper-hoist-variables": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-helper-hoist-variables/-/babel-helper-hoist-variables-6.24.1.tgz",
-      "integrity": "sha1-HssnaJydJVE+rbyZFKc/VAi+enY="
+      "integrity": "sha1-HssnaJydJVE+rbyZFKc/VAi+enY=",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "babel-types": "6.26.0"
+      }
     },
     "babel-helper-is-nodes-equiv": {
       "version": "0.0.1",
@@ -3041,17 +1531,33 @@
     "babel-helper-optimise-call-expression": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-helper-optimise-call-expression/-/babel-helper-optimise-call-expression-6.24.1.tgz",
-      "integrity": "sha1-96E0J7qfc/j0+pk8VKl4gtEkQlc="
+      "integrity": "sha1-96E0J7qfc/j0+pk8VKl4gtEkQlc=",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "babel-types": "6.26.0"
+      }
     },
     "babel-helper-regex": {
       "version": "6.26.0",
       "resolved": "https://registry.npmjs.org/babel-helper-regex/-/babel-helper-regex-6.26.0.tgz",
-      "integrity": "sha1-MlxZ+QL4LyS3T6zu0DY5VPZJXnI="
+      "integrity": "sha1-MlxZ+QL4LyS3T6zu0DY5VPZJXnI=",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "babel-types": "6.26.0",
+        "lodash": "4.17.4"
+      }
     },
     "babel-helper-remap-async-to-generator": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-helper-remap-async-to-generator/-/babel-helper-remap-async-to-generator-6.24.1.tgz",
-      "integrity": "sha1-XsWBgnrXI/7N04HxySg5BnbkVRs="
+      "integrity": "sha1-XsWBgnrXI/7N04HxySg5BnbkVRs=",
+      "requires": {
+        "babel-helper-function-name": "6.24.1",
+        "babel-runtime": "6.26.0",
+        "babel-template": "6.26.0",
+        "babel-traverse": "6.26.0",
+        "babel-types": "6.26.0"
+      }
     },
     "babel-helper-remove-or-void": {
       "version": "0.2.0",
@@ -3061,7 +1567,15 @@
     "babel-helper-replace-supers": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-helper-replace-supers/-/babel-helper-replace-supers-6.24.1.tgz",
-      "integrity": "sha1-v22/5Dk40XNpohPKiov3S2qQqxo="
+      "integrity": "sha1-v22/5Dk40XNpohPKiov3S2qQqxo=",
+      "requires": {
+        "babel-helper-optimise-call-expression": "6.24.1",
+        "babel-messages": "6.23.0",
+        "babel-runtime": "6.26.0",
+        "babel-template": "6.26.0",
+        "babel-traverse": "6.26.0",
+        "babel-types": "6.26.0"
+      }
     },
     "babel-helper-to-multiple-sequence-expressions": {
       "version": "0.2.0",
@@ -3071,37 +1585,66 @@
     "babel-helpers": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-helpers/-/babel-helpers-6.24.1.tgz",
-      "integrity": "sha1-NHHenK7DiOXIUOWX5Yom3fN2ArI="
+      "integrity": "sha1-NHHenK7DiOXIUOWX5Yom3fN2ArI=",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "babel-template": "6.26.0"
+      }
     },
     "babel-jest": {
       "version": "21.2.0",
       "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-21.2.0.tgz",
-      "integrity": "sha512-O0W2qLoWu1QOoOGgxiR2JID4O6WSpxPiQanrkyi9SSlM0PJ60Ptzlck47lhtnr9YZO3zYOsxHwnyeWJ6AffoBQ=="
+      "integrity": "sha512-O0W2qLoWu1QOoOGgxiR2JID4O6WSpxPiQanrkyi9SSlM0PJ60Ptzlck47lhtnr9YZO3zYOsxHwnyeWJ6AffoBQ==",
+      "requires": {
+        "babel-plugin-istanbul": "4.1.5",
+        "babel-preset-jest": "21.2.0"
+      }
     },
     "babel-loader": {
       "version": "7.1.2",
       "resolved": "https://registry.npmjs.org/babel-loader/-/babel-loader-7.1.2.tgz",
-      "integrity": "sha512-jRwlFbINAeyDStqK6Dd5YuY0k5YuzQUvlz2ZamuXrXmxav3pNqe9vfJ402+2G+OmlJSXxCOpB6Uz0INM7RQe2A=="
+      "integrity": "sha512-jRwlFbINAeyDStqK6Dd5YuY0k5YuzQUvlz2ZamuXrXmxav3pNqe9vfJ402+2G+OmlJSXxCOpB6Uz0INM7RQe2A==",
+      "requires": {
+        "find-cache-dir": "1.0.0",
+        "loader-utils": "1.1.0",
+        "mkdirp": "0.5.1"
+      }
     },
     "babel-messages": {
       "version": "6.23.0",
       "resolved": "https://registry.npmjs.org/babel-messages/-/babel-messages-6.23.0.tgz",
-      "integrity": "sha1-8830cDhYA1sqKVHG7F7fbGLyYw4="
+      "integrity": "sha1-8830cDhYA1sqKVHG7F7fbGLyYw4=",
+      "requires": {
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-check-es2015-constants": {
       "version": "6.22.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-check-es2015-constants/-/babel-plugin-check-es2015-constants-6.22.0.tgz",
-      "integrity": "sha1-NRV7EBQm/S/9PaP3XH0ekYNbv4o="
+      "integrity": "sha1-NRV7EBQm/S/9PaP3XH0ekYNbv4o=",
+      "requires": {
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-dynamic-import-node": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/babel-plugin-dynamic-import-node/-/babel-plugin-dynamic-import-node-1.0.2.tgz",
-      "integrity": "sha1-rbW8j0iokxFUA5WunwzD7UsQuy4="
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-dynamic-import-node/-/babel-plugin-dynamic-import-node-1.1.0.tgz",
+      "integrity": "sha512-tTfZbM9Ecwj3GK50mnPrUpinTwA4xXmDiQGCk/aBYbvl1+X8YqldK86wZ1owVJ4u3mrKbRlXMma80J18qwiaTQ==",
+      "requires": {
+        "babel-plugin-syntax-dynamic-import": "6.18.0",
+        "babel-template": "6.26.0",
+        "babel-types": "6.26.0"
+      }
     },
     "babel-plugin-istanbul": {
       "version": "4.1.5",
       "resolved": "https://registry.npmjs.org/babel-plugin-istanbul/-/babel-plugin-istanbul-4.1.5.tgz",
-      "integrity": "sha1-Z2DN2Xf0EdPhdbsGTyvDJ9mbK24="
+      "integrity": "sha1-Z2DN2Xf0EdPhdbsGTyvDJ9mbK24=",
+      "requires": {
+        "find-up": "2.1.0",
+        "istanbul-lib-instrument": "1.9.1",
+        "test-exclude": "4.1.1"
+      }
     },
     "babel-plugin-jest-hoist": {
       "version": "21.2.0",
@@ -3111,27 +1654,45 @@
     "babel-plugin-minify-builtins": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-minify-builtins/-/babel-plugin-minify-builtins-0.2.0.tgz",
-      "integrity": "sha512-4i+8ntaS8gwVUcOz5y+zE+55OVOl2nTbmHV51D4wAIiKcRI8U5K//ip1GHfhsgk/NJrrHK7h97Oy5jpqt0Iixg=="
+      "integrity": "sha512-4i+8ntaS8gwVUcOz5y+zE+55OVOl2nTbmHV51D4wAIiKcRI8U5K//ip1GHfhsgk/NJrrHK7h97Oy5jpqt0Iixg==",
+      "requires": {
+        "babel-helper-evaluate-path": "0.2.0"
+      }
     },
     "babel-plugin-minify-constant-folding": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-minify-constant-folding/-/babel-plugin-minify-constant-folding-0.2.0.tgz",
-      "integrity": "sha512-B3ffQBEUQ8ydlIkYv2MkZtTCbV7FAkWAV7NkyhcXlGpD10PaCxNGQ/B9oguXGowR1m16Q5nGhvNn8Pkn1MO6Hw=="
+      "integrity": "sha512-B3ffQBEUQ8ydlIkYv2MkZtTCbV7FAkWAV7NkyhcXlGpD10PaCxNGQ/B9oguXGowR1m16Q5nGhvNn8Pkn1MO6Hw==",
+      "requires": {
+        "babel-helper-evaluate-path": "0.2.0"
+      }
     },
     "babel-plugin-minify-dead-code-elimination": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-minify-dead-code-elimination/-/babel-plugin-minify-dead-code-elimination-0.2.0.tgz",
-      "integrity": "sha512-zE7y3pRyzA4zK5nBou0kTcwUTSQ/AiFrynt1cIEYN7vcO2gS9ZFZoI0aO9JYLUdct5fsC1vfB35408yrzTyVfg=="
+      "integrity": "sha512-zE7y3pRyzA4zK5nBou0kTcwUTSQ/AiFrynt1cIEYN7vcO2gS9ZFZoI0aO9JYLUdct5fsC1vfB35408yrzTyVfg==",
+      "requires": {
+        "babel-helper-evaluate-path": "0.2.0",
+        "babel-helper-mark-eval-scopes": "0.2.0",
+        "babel-helper-remove-or-void": "0.2.0",
+        "lodash.some": "4.6.0"
+      }
     },
     "babel-plugin-minify-flip-comparisons": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-minify-flip-comparisons/-/babel-plugin-minify-flip-comparisons-0.2.0.tgz",
-      "integrity": "sha512-QOqXSEmD/LhT3LpM1WCyzAGcQZYYKJF7oOHvS6QbpomHenydrV53DMdPX2mK01icBExKZcJAHF209wvDBa+CSg=="
+      "integrity": "sha512-QOqXSEmD/LhT3LpM1WCyzAGcQZYYKJF7oOHvS6QbpomHenydrV53DMdPX2mK01icBExKZcJAHF209wvDBa+CSg==",
+      "requires": {
+        "babel-helper-is-void-0": "0.2.0"
+      }
     },
     "babel-plugin-minify-guarded-expressions": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-minify-guarded-expressions/-/babel-plugin-minify-guarded-expressions-0.2.0.tgz",
-      "integrity": "sha512-5+NSPdRQ9mnrHaA+zFj+D5OzmSiv90EX5zGH6cWQgR/OUqmCHSDqgTRPFvOctgpo8MJyO7Rt7ajs2UfLnlAwYg=="
+      "integrity": "sha512-5+NSPdRQ9mnrHaA+zFj+D5OzmSiv90EX5zGH6cWQgR/OUqmCHSDqgTRPFvOctgpo8MJyO7Rt7ajs2UfLnlAwYg==",
+      "requires": {
+        "babel-helper-flip-expressions": "0.2.0"
+      }
     },
     "babel-plugin-minify-infinity": {
       "version": "0.2.0",
@@ -3141,7 +1702,10 @@
     "babel-plugin-minify-mangle-names": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-minify-mangle-names/-/babel-plugin-minify-mangle-names-0.2.0.tgz",
-      "integrity": "sha512-Gixuak1/CO7VCdjn15/8Bxe/QsAtDG4zPbnsNoe1mIJGCIH/kcmSjFhMlGJtXDQZd6EKzeMfA5WmX9+jvGRefw=="
+      "integrity": "sha512-Gixuak1/CO7VCdjn15/8Bxe/QsAtDG4zPbnsNoe1mIJGCIH/kcmSjFhMlGJtXDQZd6EKzeMfA5WmX9+jvGRefw==",
+      "requires": {
+        "babel-helper-mark-eval-scopes": "0.2.0"
+      }
     },
     "babel-plugin-minify-numeric-literals": {
       "version": "0.2.0",
@@ -3156,17 +1720,30 @@
     "babel-plugin-minify-simplify": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-minify-simplify/-/babel-plugin-minify-simplify-0.2.0.tgz",
-      "integrity": "sha512-Mj3Mwy2zVosMfXDWXZrQH5/uMAyfJdmDQ1NVqit+ArbHC3LlXVzptuyC1JxTyai/wgFvjLaichm/7vSUshkWqw=="
+      "integrity": "sha512-Mj3Mwy2zVosMfXDWXZrQH5/uMAyfJdmDQ1NVqit+ArbHC3LlXVzptuyC1JxTyai/wgFvjLaichm/7vSUshkWqw==",
+      "requires": {
+        "babel-helper-flip-expressions": "0.2.0",
+        "babel-helper-is-nodes-equiv": "0.0.1",
+        "babel-helper-to-multiple-sequence-expressions": "0.2.0"
+      }
     },
     "babel-plugin-minify-type-constructors": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-minify-type-constructors/-/babel-plugin-minify-type-constructors-0.2.0.tgz",
-      "integrity": "sha512-NiOvvA9Pq6bki6nP4BayXwT5GZadw7DJFDDzHmkpnOQpENWe8RtHtKZM44MG1R6EQ5XxgbLdsdhswIzTkFlO5g=="
+      "integrity": "sha512-NiOvvA9Pq6bki6nP4BayXwT5GZadw7DJFDDzHmkpnOQpENWe8RtHtKZM44MG1R6EQ5XxgbLdsdhswIzTkFlO5g==",
+      "requires": {
+        "babel-helper-is-void-0": "0.2.0"
+      }
     },
     "babel-plugin-react-docgen": {
       "version": "1.8.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-react-docgen/-/babel-plugin-react-docgen-1.8.1.tgz",
-      "integrity": "sha512-11Yxwk8/iEULr+n5DG0BxXD6j/9htpiiR0/hLfi/gtEAK/d6NCNkyKFrC8loQcyMvF3hehPo30SKXG/itSX+hw=="
+      "integrity": "sha512-11Yxwk8/iEULr+n5DG0BxXD6j/9htpiiR0/hLfi/gtEAK/d6NCNkyKFrC8loQcyMvF3hehPo30SKXG/itSX+hw==",
+      "requires": {
+        "babel-types": "6.26.0",
+        "lodash": "4.17.4",
+        "react-docgen": "2.19.0"
+      }
     },
     "babel-plugin-syntax-async-functions": {
       "version": "6.13.0",
@@ -3241,169 +1818,325 @@
     "babel-plugin-transform-async-generator-functions": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-async-generator-functions/-/babel-plugin-transform-async-generator-functions-6.24.1.tgz",
-      "integrity": "sha1-8FiQAUX9PpkHpt3yjaWfIVJYpds="
+      "integrity": "sha1-8FiQAUX9PpkHpt3yjaWfIVJYpds=",
+      "requires": {
+        "babel-helper-remap-async-to-generator": "6.24.1",
+        "babel-plugin-syntax-async-generators": "6.13.0",
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-async-to-generator": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-async-to-generator/-/babel-plugin-transform-async-to-generator-6.24.1.tgz",
-      "integrity": "sha1-ZTbjeK/2yx1VF6wOQOs+n8jQh2E="
+      "integrity": "sha1-ZTbjeK/2yx1VF6wOQOs+n8jQh2E=",
+      "requires": {
+        "babel-helper-remap-async-to-generator": "6.24.1",
+        "babel-plugin-syntax-async-functions": "6.13.0",
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-class-constructor-call": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-class-constructor-call/-/babel-plugin-transform-class-constructor-call-6.24.1.tgz",
-      "integrity": "sha1-gNwoVQWsBn3LjWxl4vbxGrd2Xvk="
+      "integrity": "sha1-gNwoVQWsBn3LjWxl4vbxGrd2Xvk=",
+      "requires": {
+        "babel-plugin-syntax-class-constructor-call": "6.18.0",
+        "babel-runtime": "6.26.0",
+        "babel-template": "6.26.0"
+      }
     },
     "babel-plugin-transform-class-properties": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-class-properties/-/babel-plugin-transform-class-properties-6.24.1.tgz",
-      "integrity": "sha1-anl2PqYdM9NvN7YRqp3vgagbRqw="
+      "integrity": "sha1-anl2PqYdM9NvN7YRqp3vgagbRqw=",
+      "requires": {
+        "babel-helper-function-name": "6.24.1",
+        "babel-plugin-syntax-class-properties": "6.13.0",
+        "babel-runtime": "6.26.0",
+        "babel-template": "6.26.0"
+      }
     },
     "babel-plugin-transform-decorators": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-decorators/-/babel-plugin-transform-decorators-6.24.1.tgz",
-      "integrity": "sha1-eIAT2PjGtSIr33s0Q5Df13Vp4k0="
+      "integrity": "sha1-eIAT2PjGtSIr33s0Q5Df13Vp4k0=",
+      "requires": {
+        "babel-helper-explode-class": "6.24.1",
+        "babel-plugin-syntax-decorators": "6.13.0",
+        "babel-runtime": "6.26.0",
+        "babel-template": "6.26.0",
+        "babel-types": "6.26.0"
+      }
     },
     "babel-plugin-transform-do-expressions": {
       "version": "6.22.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-do-expressions/-/babel-plugin-transform-do-expressions-6.22.0.tgz",
-      "integrity": "sha1-KMyvkoEtlJws0SgfaQyP3EaK6bs="
+      "integrity": "sha1-KMyvkoEtlJws0SgfaQyP3EaK6bs=",
+      "requires": {
+        "babel-plugin-syntax-do-expressions": "6.13.0",
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-es2015-arrow-functions": {
       "version": "6.22.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-arrow-functions/-/babel-plugin-transform-es2015-arrow-functions-6.22.0.tgz",
-      "integrity": "sha1-RSaSy3EdX3ncf4XkQM5BufJE0iE="
+      "integrity": "sha1-RSaSy3EdX3ncf4XkQM5BufJE0iE=",
+      "requires": {
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-es2015-block-scoped-functions": {
       "version": "6.22.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-block-scoped-functions/-/babel-plugin-transform-es2015-block-scoped-functions-6.22.0.tgz",
-      "integrity": "sha1-u8UbSflk1wy42OC5ToICRs46YUE="
+      "integrity": "sha1-u8UbSflk1wy42OC5ToICRs46YUE=",
+      "requires": {
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-es2015-block-scoping": {
       "version": "6.26.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-block-scoping/-/babel-plugin-transform-es2015-block-scoping-6.26.0.tgz",
-      "integrity": "sha1-1w9SmcEwjQXBL0Y4E7CgnnOxiV8="
+      "integrity": "sha1-1w9SmcEwjQXBL0Y4E7CgnnOxiV8=",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "babel-template": "6.26.0",
+        "babel-traverse": "6.26.0",
+        "babel-types": "6.26.0",
+        "lodash": "4.17.4"
+      }
     },
     "babel-plugin-transform-es2015-classes": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-classes/-/babel-plugin-transform-es2015-classes-6.24.1.tgz",
-      "integrity": "sha1-WkxYpQyclGHlZLSyo7+ryXolhNs="
+      "integrity": "sha1-WkxYpQyclGHlZLSyo7+ryXolhNs=",
+      "requires": {
+        "babel-helper-define-map": "6.26.0",
+        "babel-helper-function-name": "6.24.1",
+        "babel-helper-optimise-call-expression": "6.24.1",
+        "babel-helper-replace-supers": "6.24.1",
+        "babel-messages": "6.23.0",
+        "babel-runtime": "6.26.0",
+        "babel-template": "6.26.0",
+        "babel-traverse": "6.26.0",
+        "babel-types": "6.26.0"
+      }
     },
     "babel-plugin-transform-es2015-computed-properties": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-computed-properties/-/babel-plugin-transform-es2015-computed-properties-6.24.1.tgz",
-      "integrity": "sha1-b+Ko0WiV1WNPTNmZttNICjCBWbM="
+      "integrity": "sha1-b+Ko0WiV1WNPTNmZttNICjCBWbM=",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "babel-template": "6.26.0"
+      }
     },
     "babel-plugin-transform-es2015-destructuring": {
       "version": "6.23.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-destructuring/-/babel-plugin-transform-es2015-destructuring-6.23.0.tgz",
-      "integrity": "sha1-mXux8auWf2gtKwh2/jWNYOdlxW0="
+      "integrity": "sha1-mXux8auWf2gtKwh2/jWNYOdlxW0=",
+      "requires": {
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-es2015-duplicate-keys": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-duplicate-keys/-/babel-plugin-transform-es2015-duplicate-keys-6.24.1.tgz",
-      "integrity": "sha1-c+s9MQypaePvnskcU3QabxV2Qj4="
+      "integrity": "sha1-c+s9MQypaePvnskcU3QabxV2Qj4=",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "babel-types": "6.26.0"
+      }
     },
     "babel-plugin-transform-es2015-for-of": {
       "version": "6.23.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-for-of/-/babel-plugin-transform-es2015-for-of-6.23.0.tgz",
-      "integrity": "sha1-9HyVsrYT3x0+zC/bdXNiPHUkhpE="
+      "integrity": "sha1-9HyVsrYT3x0+zC/bdXNiPHUkhpE=",
+      "requires": {
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-es2015-function-name": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-function-name/-/babel-plugin-transform-es2015-function-name-6.24.1.tgz",
-      "integrity": "sha1-g0yJhTvDaxrw86TF26qU/Y6sqos="
+      "integrity": "sha1-g0yJhTvDaxrw86TF26qU/Y6sqos=",
+      "requires": {
+        "babel-helper-function-name": "6.24.1",
+        "babel-runtime": "6.26.0",
+        "babel-types": "6.26.0"
+      }
     },
     "babel-plugin-transform-es2015-literals": {
       "version": "6.22.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-literals/-/babel-plugin-transform-es2015-literals-6.22.0.tgz",
-      "integrity": "sha1-T1SgLWzWbPkVKAAZox0xklN3yi4="
+      "integrity": "sha1-T1SgLWzWbPkVKAAZox0xklN3yi4=",
+      "requires": {
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-es2015-modules-amd": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-modules-amd/-/babel-plugin-transform-es2015-modules-amd-6.24.1.tgz",
-      "integrity": "sha1-Oz5UAXI5hC1tGcMBHEvS8AoA0VQ="
+      "integrity": "sha1-Oz5UAXI5hC1tGcMBHEvS8AoA0VQ=",
+      "requires": {
+        "babel-plugin-transform-es2015-modules-commonjs": "6.26.0",
+        "babel-runtime": "6.26.0",
+        "babel-template": "6.26.0"
+      }
     },
     "babel-plugin-transform-es2015-modules-commonjs": {
       "version": "6.26.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-modules-commonjs/-/babel-plugin-transform-es2015-modules-commonjs-6.26.0.tgz",
-      "integrity": "sha1-DYOUApt9xqvhqX7xgeAHWN0uXYo="
+      "integrity": "sha1-DYOUApt9xqvhqX7xgeAHWN0uXYo=",
+      "requires": {
+        "babel-plugin-transform-strict-mode": "6.24.1",
+        "babel-runtime": "6.26.0",
+        "babel-template": "6.26.0",
+        "babel-types": "6.26.0"
+      }
     },
     "babel-plugin-transform-es2015-modules-systemjs": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-modules-systemjs/-/babel-plugin-transform-es2015-modules-systemjs-6.24.1.tgz",
-      "integrity": "sha1-/4mhQrkRmpBhlfXxBuzzBdlAfSM="
+      "integrity": "sha1-/4mhQrkRmpBhlfXxBuzzBdlAfSM=",
+      "requires": {
+        "babel-helper-hoist-variables": "6.24.1",
+        "babel-runtime": "6.26.0",
+        "babel-template": "6.26.0"
+      }
     },
     "babel-plugin-transform-es2015-modules-umd": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-modules-umd/-/babel-plugin-transform-es2015-modules-umd-6.24.1.tgz",
-      "integrity": "sha1-rJl+YoXNGO1hdq22B9YCNErThGg="
+      "integrity": "sha1-rJl+YoXNGO1hdq22B9YCNErThGg=",
+      "requires": {
+        "babel-plugin-transform-es2015-modules-amd": "6.24.1",
+        "babel-runtime": "6.26.0",
+        "babel-template": "6.26.0"
+      }
     },
     "babel-plugin-transform-es2015-object-super": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-object-super/-/babel-plugin-transform-es2015-object-super-6.24.1.tgz",
-      "integrity": "sha1-JM72muIcuDp/hgPa0CH1cusnj40="
+      "integrity": "sha1-JM72muIcuDp/hgPa0CH1cusnj40=",
+      "requires": {
+        "babel-helper-replace-supers": "6.24.1",
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-es2015-parameters": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-parameters/-/babel-plugin-transform-es2015-parameters-6.24.1.tgz",
-      "integrity": "sha1-V6w1GrScrxSpfNE7CfZv3wpiXys="
+      "integrity": "sha1-V6w1GrScrxSpfNE7CfZv3wpiXys=",
+      "requires": {
+        "babel-helper-call-delegate": "6.24.1",
+        "babel-helper-get-function-arity": "6.24.1",
+        "babel-runtime": "6.26.0",
+        "babel-template": "6.26.0",
+        "babel-traverse": "6.26.0",
+        "babel-types": "6.26.0"
+      }
     },
     "babel-plugin-transform-es2015-shorthand-properties": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-shorthand-properties/-/babel-plugin-transform-es2015-shorthand-properties-6.24.1.tgz",
-      "integrity": "sha1-JPh11nIch2YbvZmkYi5R8U3jiqA="
+      "integrity": "sha1-JPh11nIch2YbvZmkYi5R8U3jiqA=",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "babel-types": "6.26.0"
+      }
     },
     "babel-plugin-transform-es2015-spread": {
       "version": "6.22.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-spread/-/babel-plugin-transform-es2015-spread-6.22.0.tgz",
-      "integrity": "sha1-1taKmfia7cRTbIGlQujdnxdG+NE="
+      "integrity": "sha1-1taKmfia7cRTbIGlQujdnxdG+NE=",
+      "requires": {
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-es2015-sticky-regex": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-sticky-regex/-/babel-plugin-transform-es2015-sticky-regex-6.24.1.tgz",
-      "integrity": "sha1-AMHNsaynERLN8M9hJsLta0V8zbw="
+      "integrity": "sha1-AMHNsaynERLN8M9hJsLta0V8zbw=",
+      "requires": {
+        "babel-helper-regex": "6.26.0",
+        "babel-runtime": "6.26.0",
+        "babel-types": "6.26.0"
+      }
     },
     "babel-plugin-transform-es2015-template-literals": {
       "version": "6.22.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-template-literals/-/babel-plugin-transform-es2015-template-literals-6.22.0.tgz",
-      "integrity": "sha1-qEs0UPfp+PH2g51taH2oS7EjbY0="
+      "integrity": "sha1-qEs0UPfp+PH2g51taH2oS7EjbY0=",
+      "requires": {
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-es2015-typeof-symbol": {
       "version": "6.23.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-typeof-symbol/-/babel-plugin-transform-es2015-typeof-symbol-6.23.0.tgz",
-      "integrity": "sha1-3sCfHN3/lLUqxz1QXITfWdzOs3I="
+      "integrity": "sha1-3sCfHN3/lLUqxz1QXITfWdzOs3I=",
+      "requires": {
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-es2015-unicode-regex": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-es2015-unicode-regex/-/babel-plugin-transform-es2015-unicode-regex-6.24.1.tgz",
       "integrity": "sha1-04sS9C6nMj9yk4fxinxa4frrNek=",
+      "requires": {
+        "babel-helper-regex": "6.26.0",
+        "babel-runtime": "6.26.0",
+        "regexpu-core": "2.0.0"
+      },
       "dependencies": {
         "regexpu-core": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-2.0.0.tgz",
-          "integrity": "sha1-SdA4g3uNz4v6W5pCE5k45uoq4kA="
+          "integrity": "sha1-SdA4g3uNz4v6W5pCE5k45uoq4kA=",
+          "requires": {
+            "regenerate": "1.3.3",
+            "regjsgen": "0.2.0",
+            "regjsparser": "0.1.5"
+          }
         }
       }
     },
     "babel-plugin-transform-exponentiation-operator": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-exponentiation-operator/-/babel-plugin-transform-exponentiation-operator-6.24.1.tgz",
-      "integrity": "sha1-KrDJx/MJj6SJB3cruBP+QejeOg4="
+      "integrity": "sha1-KrDJx/MJj6SJB3cruBP+QejeOg4=",
+      "requires": {
+        "babel-helper-builder-binary-assignment-operator-visitor": "6.24.1",
+        "babel-plugin-syntax-exponentiation-operator": "6.13.0",
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-export-extensions": {
       "version": "6.22.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-export-extensions/-/babel-plugin-transform-export-extensions-6.22.0.tgz",
-      "integrity": "sha1-U3OLR+deghhYnuqUbLvTkQm75lM="
+      "integrity": "sha1-U3OLR+deghhYnuqUbLvTkQm75lM=",
+      "requires": {
+        "babel-plugin-syntax-export-extensions": "6.13.0",
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-flow-strip-types": {
       "version": "6.22.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-flow-strip-types/-/babel-plugin-transform-flow-strip-types-6.22.0.tgz",
-      "integrity": "sha1-hMtnKTXUNxT9wyvOhFaNh0Qc988="
+      "integrity": "sha1-hMtnKTXUNxT9wyvOhFaNh0Qc988=",
+      "requires": {
+        "babel-plugin-syntax-flow": "6.18.0",
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-function-bind": {
       "version": "6.22.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-function-bind/-/babel-plugin-transform-function-bind-6.22.0.tgz",
-      "integrity": "sha1-xvuOlqwpajELjPjqQBRiQH3fapc="
+      "integrity": "sha1-xvuOlqwpajELjPjqQBRiQH3fapc=",
+      "requires": {
+        "babel-plugin-syntax-function-bind": "6.13.0",
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-inline-consecutive-adds": {
       "version": "0.2.0",
@@ -3426,44 +2159,73 @@
       "integrity": "sha512-bPbUhkeN2Nc0KH0/A19GwQGj8w+CvdJzyu8t59VoEDgsNMQ9Bopzi5DrVkrSsVjbYUaZpzq/DYLrH+wD5K2Tig=="
     },
     "babel-plugin-transform-object-rest-spread": {
-      "version": "6.23.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-object-rest-spread/-/babel-plugin-transform-object-rest-spread-6.23.0.tgz",
-      "integrity": "sha1-h11ryb52HFiirj/u5dxIldjH+SE="
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-object-rest-spread/-/babel-plugin-transform-object-rest-spread-6.26.0.tgz",
+      "integrity": "sha1-DzZpLVD+9rfi1LOsFHgTepY7ewY=",
+      "requires": {
+        "babel-plugin-syntax-object-rest-spread": "6.13.0",
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-property-literals": {
       "version": "6.8.5",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-property-literals/-/babel-plugin-transform-property-literals-6.8.5.tgz",
-      "integrity": "sha512-MmiQsQ5AcIaRZMJD0zY5C4H3xuHm06/nWgtOsz7AXV44VEIXIlPiJ39IFYJ4Qx67/fEm8zJAedzR8t+B7d10Bg=="
+      "integrity": "sha512-MmiQsQ5AcIaRZMJD0zY5C4H3xuHm06/nWgtOsz7AXV44VEIXIlPiJ39IFYJ4Qx67/fEm8zJAedzR8t+B7d10Bg==",
+      "requires": {
+        "esutils": "2.0.2"
+      }
     },
     "babel-plugin-transform-react-constant-elements": {
       "version": "6.23.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-react-constant-elements/-/babel-plugin-transform-react-constant-elements-6.23.0.tgz",
-      "integrity": "sha1-LxGb9NLN1F65uqrldAU8YE9hR90="
+      "integrity": "sha1-LxGb9NLN1F65uqrldAU8YE9hR90=",
+      "requires": {
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-react-display-name": {
       "version": "6.25.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-react-display-name/-/babel-plugin-transform-react-display-name-6.25.0.tgz",
-      "integrity": "sha1-Z+K/Hx6ck6sI25Z5LgU5K/LMKNE="
+      "integrity": "sha1-Z+K/Hx6ck6sI25Z5LgU5K/LMKNE=",
+      "requires": {
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-react-jsx": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-react-jsx/-/babel-plugin-transform-react-jsx-6.24.1.tgz",
-      "integrity": "sha1-hAoCjn30YN/DotKfDA2R9jduZqM="
+      "integrity": "sha1-hAoCjn30YN/DotKfDA2R9jduZqM=",
+      "requires": {
+        "babel-helper-builder-react-jsx": "6.26.0",
+        "babel-plugin-syntax-jsx": "6.18.0",
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-react-jsx-self": {
       "version": "6.22.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-react-jsx-self/-/babel-plugin-transform-react-jsx-self-6.22.0.tgz",
-      "integrity": "sha1-322AqdomEqEh5t3XVYvL7PBuY24="
+      "integrity": "sha1-322AqdomEqEh5t3XVYvL7PBuY24=",
+      "requires": {
+        "babel-plugin-syntax-jsx": "6.18.0",
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-react-jsx-source": {
       "version": "6.22.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-react-jsx-source/-/babel-plugin-transform-react-jsx-source-6.22.0.tgz",
-      "integrity": "sha1-ZqwSFT9c0tF7PBkmj0vwGX9E7NY="
+      "integrity": "sha1-ZqwSFT9c0tF7PBkmj0vwGX9E7NY=",
+      "requires": {
+        "babel-plugin-syntax-jsx": "6.18.0",
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-regenerator": {
       "version": "6.26.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-regenerator/-/babel-plugin-transform-regenerator-6.26.0.tgz",
-      "integrity": "sha1-4HA2lvveJ/Cj78rPi03KL3s6jy8="
+      "integrity": "sha1-4HA2lvveJ/Cj78rPi03KL3s6jy8=",
+      "requires": {
+        "regenerator-transform": "0.10.1"
+      }
     },
     "babel-plugin-transform-regexp-constructors": {
       "version": "0.2.0",
@@ -3483,12 +2245,18 @@
     "babel-plugin-transform-remove-undefined": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-remove-undefined/-/babel-plugin-transform-remove-undefined-0.2.0.tgz",
-      "integrity": "sha512-O8v57tPMHkp89kA4ZfQEYds/pzgvz/QYerBJjIuL5/Jc7RnvMVRA5gJY9zFKP7WayW8WOSBV4vh8Y8FJRio+ow=="
+      "integrity": "sha512-O8v57tPMHkp89kA4ZfQEYds/pzgvz/QYerBJjIuL5/Jc7RnvMVRA5gJY9zFKP7WayW8WOSBV4vh8Y8FJRio+ow==",
+      "requires": {
+        "babel-helper-evaluate-path": "0.2.0"
+      }
     },
     "babel-plugin-transform-runtime": {
       "version": "6.23.0",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-runtime/-/babel-plugin-transform-runtime-6.23.0.tgz",
-      "integrity": "sha1-iEkNRGUC6puOfvsP4J7E2ZR5se4="
+      "integrity": "sha1-iEkNRGUC6puOfvsP4J7E2ZR5se4=",
+      "requires": {
+        "babel-runtime": "6.26.0"
+      }
     },
     "babel-plugin-transform-simplify-comparison-operators": {
       "version": "6.8.5",
@@ -3498,7 +2266,11 @@
     "babel-plugin-transform-strict-mode": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-transform-strict-mode/-/babel-plugin-transform-strict-mode-6.24.1.tgz",
-      "integrity": "sha1-1fr3qleKZbvlkc9e2uBKDGcCB1g="
+      "integrity": "sha1-1fr3qleKZbvlkc9e2uBKDGcCB1g=",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "babel-types": "6.26.0"
+      }
     },
     "babel-plugin-transform-undefined-to-void": {
       "version": "6.8.3",
@@ -3508,96 +2280,194 @@
     "babel-polyfill": {
       "version": "6.23.0",
       "resolved": "https://registry.npmjs.org/babel-polyfill/-/babel-polyfill-6.23.0.tgz",
-      "integrity": "sha1-g2TKYt+Or7gwSZ9pkXdGbDsDSZ0="
+      "integrity": "sha1-g2TKYt+Or7gwSZ9pkXdGbDsDSZ0=",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "core-js": "2.5.1",
+        "regenerator-runtime": "0.10.5"
+      }
     },
     "babel-preset-env": {
       "version": "1.6.1",
       "resolved": "https://registry.npmjs.org/babel-preset-env/-/babel-preset-env-1.6.1.tgz",
       "integrity": "sha512-W6VIyA6Ch9ePMI7VptNn2wBM6dbG0eSz25HEiL40nQXCsXGTGZSTZu1Iap+cj3Q0S5a7T9+529l/5Bkvd+afNA==",
-      "dependencies": {
-        "browserslist": {
-          "version": "2.5.1",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.5.1.tgz",
-          "integrity": "sha512-jAvM2ku7YDJ+leAq3bFH1DE0Ylw+F+EQDq4GkqZfgPEqpWYw9ofQH85uKSB9r3Tv7XDbfqVtE+sdvKJW7IlPJA=="
-        }
+      "requires": {
+        "babel-plugin-check-es2015-constants": "6.22.0",
+        "babel-plugin-syntax-trailing-function-commas": "6.22.0",
+        "babel-plugin-transform-async-to-generator": "6.24.1",
+        "babel-plugin-transform-es2015-arrow-functions": "6.22.0",
+        "babel-plugin-transform-es2015-block-scoped-functions": "6.22.0",
+        "babel-plugin-transform-es2015-block-scoping": "6.26.0",
+        "babel-plugin-transform-es2015-classes": "6.24.1",
+        "babel-plugin-transform-es2015-computed-properties": "6.24.1",
+        "babel-plugin-transform-es2015-destructuring": "6.23.0",
+        "babel-plugin-transform-es2015-duplicate-keys": "6.24.1",
+        "babel-plugin-transform-es2015-for-of": "6.23.0",
+        "babel-plugin-transform-es2015-function-name": "6.24.1",
+        "babel-plugin-transform-es2015-literals": "6.22.0",
+        "babel-plugin-transform-es2015-modules-amd": "6.24.1",
+        "babel-plugin-transform-es2015-modules-commonjs": "6.26.0",
+        "babel-plugin-transform-es2015-modules-systemjs": "6.24.1",
+        "babel-plugin-transform-es2015-modules-umd": "6.24.1",
+        "babel-plugin-transform-es2015-object-super": "6.24.1",
+        "babel-plugin-transform-es2015-parameters": "6.24.1",
+        "babel-plugin-transform-es2015-shorthand-properties": "6.24.1",
+        "babel-plugin-transform-es2015-spread": "6.22.0",
+        "babel-plugin-transform-es2015-sticky-regex": "6.24.1",
+        "babel-plugin-transform-es2015-template-literals": "6.22.0",
+        "babel-plugin-transform-es2015-typeof-symbol": "6.23.0",
+        "babel-plugin-transform-es2015-unicode-regex": "6.24.1",
+        "babel-plugin-transform-exponentiation-operator": "6.24.1",
+        "babel-plugin-transform-regenerator": "6.26.0",
+        "browserslist": "2.8.0",
+        "invariant": "2.2.2",
+        "semver": "5.4.1"
       }
     },
     "babel-preset-flow": {
       "version": "6.23.0",
       "resolved": "https://registry.npmjs.org/babel-preset-flow/-/babel-preset-flow-6.23.0.tgz",
-      "integrity": "sha1-5xIYiHCFrpoktb5Baa/7WZgWxJ0="
+      "integrity": "sha1-5xIYiHCFrpoktb5Baa/7WZgWxJ0=",
+      "requires": {
+        "babel-plugin-transform-flow-strip-types": "6.22.0"
+      }
     },
     "babel-preset-jest": {
       "version": "21.2.0",
       "resolved": "https://registry.npmjs.org/babel-preset-jest/-/babel-preset-jest-21.2.0.tgz",
-      "integrity": "sha512-hm9cBnr2h3J7yXoTtAVV0zg+3vg0Q/gT2GYuzlreTU0EPkJRtlNgKJJ3tBKEn0+VjAi3JykV6xCJkuUYttEEfA=="
+      "integrity": "sha512-hm9cBnr2h3J7yXoTtAVV0zg+3vg0Q/gT2GYuzlreTU0EPkJRtlNgKJJ3tBKEn0+VjAi3JykV6xCJkuUYttEEfA==",
+      "requires": {
+        "babel-plugin-jest-hoist": "21.2.0",
+        "babel-plugin-syntax-object-rest-spread": "6.13.0"
+      }
     },
     "babel-preset-minify": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/babel-preset-minify/-/babel-preset-minify-0.2.0.tgz",
-      "integrity": "sha512-mR8Q44RmMzm18bM2Lqd9uiPopzk5GDCtVuquNbLFmX6lOKnqWoenaNBxnWW0UhBFC75lEHTIgNGCbnsRI0pJVw=="
+      "integrity": "sha512-mR8Q44RmMzm18bM2Lqd9uiPopzk5GDCtVuquNbLFmX6lOKnqWoenaNBxnWW0UhBFC75lEHTIgNGCbnsRI0pJVw==",
+      "requires": {
+        "babel-plugin-minify-builtins": "0.2.0",
+        "babel-plugin-minify-constant-folding": "0.2.0",
+        "babel-plugin-minify-dead-code-elimination": "0.2.0",
+        "babel-plugin-minify-flip-comparisons": "0.2.0",
+        "babel-plugin-minify-guarded-expressions": "0.2.0",
+        "babel-plugin-minify-infinity": "0.2.0",
+        "babel-plugin-minify-mangle-names": "0.2.0",
+        "babel-plugin-minify-numeric-literals": "0.2.0",
+        "babel-plugin-minify-replace": "0.2.0",
+        "babel-plugin-minify-simplify": "0.2.0",
+        "babel-plugin-minify-type-constructors": "0.2.0",
+        "babel-plugin-transform-inline-consecutive-adds": "0.2.0",
+        "babel-plugin-transform-member-expression-literals": "6.8.5",
+        "babel-plugin-transform-merge-sibling-variables": "6.8.6",
+        "babel-plugin-transform-minify-booleans": "6.8.3",
+        "babel-plugin-transform-property-literals": "6.8.5",
+        "babel-plugin-transform-regexp-constructors": "0.2.0",
+        "babel-plugin-transform-remove-console": "6.8.5",
+        "babel-plugin-transform-remove-debugger": "6.8.5",
+        "babel-plugin-transform-remove-undefined": "0.2.0",
+        "babel-plugin-transform-simplify-comparison-operators": "6.8.5",
+        "babel-plugin-transform-undefined-to-void": "6.8.3",
+        "lodash.isplainobject": "4.0.6"
+      }
     },
     "babel-preset-react": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-preset-react/-/babel-preset-react-6.24.1.tgz",
-      "integrity": "sha1-umnfrqRfw+xjm2pOzqbhdwLJE4A="
+      "integrity": "sha1-umnfrqRfw+xjm2pOzqbhdwLJE4A=",
+      "requires": {
+        "babel-plugin-syntax-jsx": "6.18.0",
+        "babel-plugin-transform-react-display-name": "6.25.0",
+        "babel-plugin-transform-react-jsx": "6.24.1",
+        "babel-plugin-transform-react-jsx-self": "6.22.0",
+        "babel-plugin-transform-react-jsx-source": "6.22.0",
+        "babel-preset-flow": "6.23.0"
+      }
     },
     "babel-preset-react-app": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/babel-preset-react-app/-/babel-preset-react-app-3.0.3.tgz",
-      "integrity": "sha512-hK1hPq8xOFxmnNwpsOcQ2wSRAQwNBhDqsMV75gyKYQ7Z39KmTRpMN2Jx6Wp0Mberqd2QEWsUqd9ccP2jfd4z2Q==",
-      "dependencies": {
-        "babel-plugin-transform-regenerator": {
-          "version": "6.24.1",
-          "resolved": "https://registry.npmjs.org/babel-plugin-transform-regenerator/-/babel-plugin-transform-regenerator-6.24.1.tgz",
-          "integrity": "sha1-uNowWtQ8PJm0hI5P5AN7dw0jxBg="
-        },
-        "babel-preset-env": {
-          "version": "1.5.2",
-          "resolved": "https://registry.npmjs.org/babel-preset-env/-/babel-preset-env-1.5.2.tgz",
-          "integrity": "sha1-zUrpCm6Utwn5c3SzPl+LmDVWre8="
-        },
-        "browserslist": {
-          "version": "2.5.1",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.5.1.tgz",
-          "integrity": "sha512-jAvM2ku7YDJ+leAq3bFH1DE0Ylw+F+EQDq4GkqZfgPEqpWYw9ofQH85uKSB9r3Tv7XDbfqVtE+sdvKJW7IlPJA=="
-        },
-        "regenerator-transform": {
-          "version": "0.9.11",
-          "resolved": "https://registry.npmjs.org/regenerator-transform/-/regenerator-transform-0.9.11.tgz",
-          "integrity": "sha1-On0GdSDLe3F2dp61/4aGkb7+EoM="
-        }
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/babel-preset-react-app/-/babel-preset-react-app-3.1.0.tgz",
+      "integrity": "sha512-jEAeVozxLzftLl0iDZ0d5jrmfbo3yogON/eI4AsEDIs8p6WW+t9mDRUsj5l12bqPOLSiVOElCQ3QyGjMcyBiwA==",
+      "requires": {
+        "babel-plugin-dynamic-import-node": "1.1.0",
+        "babel-plugin-syntax-dynamic-import": "6.18.0",
+        "babel-plugin-transform-class-properties": "6.24.1",
+        "babel-plugin-transform-object-rest-spread": "6.26.0",
+        "babel-plugin-transform-react-constant-elements": "6.23.0",
+        "babel-plugin-transform-react-jsx": "6.24.1",
+        "babel-plugin-transform-react-jsx-self": "6.22.0",
+        "babel-plugin-transform-react-jsx-source": "6.22.0",
+        "babel-plugin-transform-regenerator": "6.26.0",
+        "babel-plugin-transform-runtime": "6.23.0",
+        "babel-preset-env": "1.6.1",
+        "babel-preset-react": "6.24.1"
       }
     },
     "babel-preset-stage-0": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-preset-stage-0/-/babel-preset-stage-0-6.24.1.tgz",
-      "integrity": "sha1-VkLRUEL5E4TX5a+LyIsduVsDnmo="
+      "integrity": "sha1-VkLRUEL5E4TX5a+LyIsduVsDnmo=",
+      "requires": {
+        "babel-plugin-transform-do-expressions": "6.22.0",
+        "babel-plugin-transform-function-bind": "6.22.0",
+        "babel-preset-stage-1": "6.24.1"
+      }
     },
     "babel-preset-stage-1": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-preset-stage-1/-/babel-preset-stage-1-6.24.1.tgz",
-      "integrity": "sha1-dpLNfc1oSZB+auSgqFWJz7niv7A="
+      "integrity": "sha1-dpLNfc1oSZB+auSgqFWJz7niv7A=",
+      "requires": {
+        "babel-plugin-transform-class-constructor-call": "6.24.1",
+        "babel-plugin-transform-export-extensions": "6.22.0",
+        "babel-preset-stage-2": "6.24.1"
+      }
     },
     "babel-preset-stage-2": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-preset-stage-2/-/babel-preset-stage-2-6.24.1.tgz",
-      "integrity": "sha1-2eKWD7PXEYfw5k7sYrwHdnIZvcE="
+      "integrity": "sha1-2eKWD7PXEYfw5k7sYrwHdnIZvcE=",
+      "requires": {
+        "babel-plugin-syntax-dynamic-import": "6.18.0",
+        "babel-plugin-transform-class-properties": "6.24.1",
+        "babel-plugin-transform-decorators": "6.24.1",
+        "babel-preset-stage-3": "6.24.1"
+      }
     },
     "babel-preset-stage-3": {
       "version": "6.24.1",
       "resolved": "https://registry.npmjs.org/babel-preset-stage-3/-/babel-preset-stage-3-6.24.1.tgz",
-      "integrity": "sha1-g2raCp56f6N8sTj7kyb4eTSkg5U="
+      "integrity": "sha1-g2raCp56f6N8sTj7kyb4eTSkg5U=",
+      "requires": {
+        "babel-plugin-syntax-trailing-function-commas": "6.22.0",
+        "babel-plugin-transform-async-generator-functions": "6.24.1",
+        "babel-plugin-transform-async-to-generator": "6.24.1",
+        "babel-plugin-transform-exponentiation-operator": "6.24.1",
+        "babel-plugin-transform-object-rest-spread": "6.26.0"
+      }
     },
     "babel-register": {
       "version": "6.26.0",
       "resolved": "https://registry.npmjs.org/babel-register/-/babel-register-6.26.0.tgz",
-      "integrity": "sha1-btAhFz4vy0htestFxgCahW9kcHE="
+      "integrity": "sha1-btAhFz4vy0htestFxgCahW9kcHE=",
+      "requires": {
+        "babel-core": "6.26.0",
+        "babel-runtime": "6.26.0",
+        "core-js": "2.5.1",
+        "home-or-tmp": "2.0.0",
+        "lodash": "4.17.4",
+        "mkdirp": "0.5.1",
+        "source-map-support": "0.4.18"
+      }
     },
     "babel-runtime": {
       "version": "6.26.0",
       "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz",
       "integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4=",
+      "requires": {
+        "core-js": "2.5.1",
+        "regenerator-runtime": "0.11.0"
+      },
       "dependencies": {
         "regenerator-runtime": {
           "version": "0.11.0",
@@ -3609,17 +2479,41 @@
     "babel-template": {
       "version": "6.26.0",
       "resolved": "https://registry.npmjs.org/babel-template/-/babel-template-6.26.0.tgz",
-      "integrity": "sha1-3gPi0WOWsGn0bdn/+FIfsaDjXgI="
+      "integrity": "sha1-3gPi0WOWsGn0bdn/+FIfsaDjXgI=",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "babel-traverse": "6.26.0",
+        "babel-types": "6.26.0",
+        "babylon": "6.18.0",
+        "lodash": "4.17.4"
+      }
     },
     "babel-traverse": {
       "version": "6.26.0",
       "resolved": "https://registry.npmjs.org/babel-traverse/-/babel-traverse-6.26.0.tgz",
-      "integrity": "sha1-RqnL1+3MYsjlwGTi0tjQ9ANXZu4="
+      "integrity": "sha1-RqnL1+3MYsjlwGTi0tjQ9ANXZu4=",
+      "requires": {
+        "babel-code-frame": "6.26.0",
+        "babel-messages": "6.23.0",
+        "babel-runtime": "6.26.0",
+        "babel-types": "6.26.0",
+        "babylon": "6.18.0",
+        "debug": "2.6.9",
+        "globals": "9.18.0",
+        "invariant": "2.2.2",
+        "lodash": "4.17.4"
+      }
     },
     "babel-types": {
       "version": "6.26.0",
       "resolved": "https://registry.npmjs.org/babel-types/-/babel-types-6.26.0.tgz",
-      "integrity": "sha1-o7Bz+Uq0nrb6Vc1lInozQ4BjJJc="
+      "integrity": "sha1-o7Bz+Uq0nrb6Vc1lInozQ4BjJJc=",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "esutils": "2.0.2",
+        "lodash": "4.17.4",
+        "to-fast-properties": "1.0.3"
+      }
     },
     "babylon": {
       "version": "6.18.0",
@@ -3634,7 +2528,16 @@
     "base": {
       "version": "0.11.2",
       "resolved": "https://registry.npmjs.org/base/-/base-0.11.2.tgz",
-      "integrity": "sha512-5T6P4xPgpp0YDFvSWwEZ4NoE3aM4QBQXDzmVbraCkFj8zHM+mba8SyqB5DbZWyR7mYHo6Y7BdQo3MoA4m0TeQg=="
+      "integrity": "sha512-5T6P4xPgpp0YDFvSWwEZ4NoE3aM4QBQXDzmVbraCkFj8zHM+mba8SyqB5DbZWyR7mYHo6Y7BdQo3MoA4m0TeQg==",
+      "requires": {
+        "cache-base": "1.0.1",
+        "class-utils": "0.3.5",
+        "component-emitter": "1.2.1",
+        "define-property": "1.0.0",
+        "isobject": "3.0.1",
+        "mixin-deep": "1.2.0",
+        "pascalcase": "0.1.1"
+      }
     },
     "base64-js": {
       "version": "1.2.1",
@@ -3646,12 +2549,6 @@
       "resolved": "https://registry.npmjs.org/batch/-/batch-0.6.1.tgz",
       "integrity": "sha1-3DQxT05nkxgJP8dgJyUl+UvyXBY="
     },
-    "bcrypt-pbkdf": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/bcrypt-pbkdf/-/bcrypt-pbkdf-1.0.1.tgz",
-      "integrity": "sha1-Y7xdy2EzG5K8Bf1SiVPDNGKgb40=",
-      "optional": true
-    },
     "big.js": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/big.js/-/big.js-3.2.0.tgz",
@@ -3660,7 +2557,11 @@
     "binary": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/binary/-/binary-0.3.0.tgz",
-      "integrity": "sha1-n2BVO8XOjDOG87VTz/R0Yq3sqnk="
+      "integrity": "sha1-n2BVO8XOjDOG87VTz/R0Yq3sqnk=",
+      "requires": {
+        "buffers": "0.1.1",
+        "chainsaw": "0.1.0"
+      }
     },
     "binary-extensions": {
       "version": "1.10.0",
@@ -3670,7 +2571,10 @@
     "block-stream": {
       "version": "0.0.9",
       "resolved": "https://registry.npmjs.org/block-stream/-/block-stream-0.0.9.tgz",
-      "integrity": "sha1-E+v+d4oDIFz+A3UUgeu0szAMEmo="
+      "integrity": "sha1-E+v+d4oDIFz+A3UUgeu0szAMEmo=",
+      "requires": {
+        "inherits": "2.0.3"
+      }
     },
     "bluebird": {
       "version": "3.4.7",
@@ -3685,12 +2589,32 @@
     "body-parser": {
       "version": "1.18.2",
       "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.18.2.tgz",
-      "integrity": "sha1-h2eKGdhLR9hZuDGZvVm84iKxBFQ="
+      "integrity": "sha1-h2eKGdhLR9hZuDGZvVm84iKxBFQ=",
+      "requires": {
+        "bytes": "3.0.0",
+        "content-type": "1.0.4",
+        "debug": "2.6.9",
+        "depd": "1.1.1",
+        "http-errors": "1.6.2",
+        "iconv-lite": "0.4.19",
+        "on-finished": "2.3.0",
+        "qs": "6.5.1",
+        "raw-body": "2.3.2",
+        "type-is": "1.6.15"
+      }
     },
     "bonjour": {
       "version": "3.5.0",
       "resolved": "https://registry.npmjs.org/bonjour/-/bonjour-3.5.0.tgz",
       "integrity": "sha1-jokKGD2O6aI5OzhExpGkK897yfU=",
+      "requires": {
+        "array-flatten": "2.1.1",
+        "deep-equal": "1.0.1",
+        "dns-equal": "1.0.0",
+        "dns-txt": "2.0.2",
+        "multicast-dns": "6.1.1",
+        "multicast-dns-service-types": "1.1.0"
+      },
       "dependencies": {
         "array-flatten": {
           "version": "2.1.1",
@@ -3707,22 +2631,42 @@
     "boom": {
       "version": "4.3.1",
       "resolved": "https://registry.npmjs.org/boom/-/boom-4.3.1.tgz",
-      "integrity": "sha1-T4owBctKfjiJ90kDD9JbluAdLjE="
+      "integrity": "sha1-T4owBctKfjiJ90kDD9JbluAdLjE=",
+      "requires": {
+        "hoek": "4.2.0"
+      }
     },
     "bowser": {
-      "version": "1.8.0",
-      "resolved": "https://registry.npmjs.org/bowser/-/bowser-1.8.0.tgz",
-      "integrity": "sha512-ARpB9VfvItCA47oBk9tVA/L93fU83Q2YwE1yTjhCyr1tu6Zw74mDHdpXNWutl5/tFGYhgCOfBH83WJY4RBGA3A=="
+      "version": "1.8.1",
+      "resolved": "https://registry.npmjs.org/bowser/-/bowser-1.8.1.tgz",
+      "integrity": "sha512-NMPaR8ILtdLSWzxQtEs16XbxMcY8ohWGQ5V+TZSJS3fNUt/PBAGkF6YWO9B/4qWE23bK3o0moQKq8UyFEosYkA=="
     },
     "brace-expansion": {
       "version": "1.1.8",
       "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.8.tgz",
-      "integrity": "sha1-wHshHHyVLsH479Uad+8NHTmQopI="
+      "integrity": "sha1-wHshHHyVLsH479Uad+8NHTmQopI=",
+      "requires": {
+        "balanced-match": "1.0.0",
+        "concat-map": "0.0.1"
+      }
     },
     "braces": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/braces/-/braces-2.2.2.tgz",
-      "integrity": "sha1-JB+GjCsmkNn+vu5afIP7vyXQCxs="
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/braces/-/braces-2.3.0.tgz",
+      "integrity": "sha512-P4O8UQRdGiMLWSizsApmXVQDBS6KCt7dSexgLKBmH5Hr1CZq7vsnscFh8oR1sP1ab1Zj0uCHCEzZeV6SfUf3rA==",
+      "requires": {
+        "arr-flatten": "1.1.0",
+        "array-unique": "0.3.2",
+        "define-property": "1.0.0",
+        "extend-shallow": "2.0.1",
+        "fill-range": "4.0.0",
+        "isobject": "3.0.1",
+        "repeat-element": "1.1.2",
+        "snapdragon": "0.8.1",
+        "snapdragon-node": "2.1.1",
+        "split-string": "3.0.2",
+        "to-regex": "3.0.1"
+      }
     },
     "brcast": {
       "version": "3.0.1",
@@ -3738,6 +2682,9 @@
       "version": "1.11.2",
       "resolved": "https://registry.npmjs.org/browser-resolve/-/browser-resolve-1.11.2.tgz",
       "integrity": "sha1-j/CbCixCFxihBRwmCzLkj0QpOM4=",
+      "requires": {
+        "resolve": "1.1.7"
+      },
       "dependencies": {
         "resolve": {
           "version": "1.1.7",
@@ -3752,49 +2699,95 @@
       "integrity": "sha1-81HTKWnTL6XXpVZxVCY9korjvR8="
     },
     "browserify-aes": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.1.0.tgz",
-      "integrity": "sha512-W2bIMLYoZ9oow7TyePpMJk9l9LY7O3R61a/68bVCDOtnJynnwe3ZeW2IzzSkrQnPKNdJrxVDn3ALZNisSBwb7g=="
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.1.1.tgz",
+      "integrity": "sha512-UGnTYAnB2a3YuYKIRy1/4FB2HdM866E0qC46JXvVTYKlBlZlnvfpSfY6OKfXZAkv70eJ2a1SqzpAo5CRhZGDFg==",
+      "requires": {
+        "buffer-xor": "1.0.3",
+        "cipher-base": "1.0.4",
+        "create-hash": "1.1.3",
+        "evp_bytestokey": "1.0.3",
+        "inherits": "2.0.3",
+        "safe-buffer": "5.1.1"
+      }
     },
     "browserify-cipher": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/browserify-cipher/-/browserify-cipher-1.0.0.tgz",
-      "integrity": "sha1-mYgkSHS/XtTijalWZtzWasj8Njo="
+      "integrity": "sha1-mYgkSHS/XtTijalWZtzWasj8Njo=",
+      "requires": {
+        "browserify-aes": "1.1.1",
+        "browserify-des": "1.0.0",
+        "evp_bytestokey": "1.0.3"
+      }
     },
     "browserify-des": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/browserify-des/-/browserify-des-1.0.0.tgz",
-      "integrity": "sha1-2qJ3cXRwki7S/hhZQRihdUOXId0="
+      "integrity": "sha1-2qJ3cXRwki7S/hhZQRihdUOXId0=",
+      "requires": {
+        "cipher-base": "1.0.4",
+        "des.js": "1.0.0",
+        "inherits": "2.0.3"
+      }
     },
     "browserify-rsa": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz",
-      "integrity": "sha1-IeCr+vbyApzy+vsTNWenAdQTVSQ="
+      "integrity": "sha1-IeCr+vbyApzy+vsTNWenAdQTVSQ=",
+      "requires": {
+        "bn.js": "4.11.8",
+        "randombytes": "2.0.5"
+      }
     },
     "browserify-sign": {
       "version": "4.0.4",
       "resolved": "https://registry.npmjs.org/browserify-sign/-/browserify-sign-4.0.4.tgz",
-      "integrity": "sha1-qk62jl17ZYuqa/alfmMMvXqT0pg="
+      "integrity": "sha1-qk62jl17ZYuqa/alfmMMvXqT0pg=",
+      "requires": {
+        "bn.js": "4.11.8",
+        "browserify-rsa": "4.0.1",
+        "create-hash": "1.1.3",
+        "create-hmac": "1.1.6",
+        "elliptic": "6.4.0",
+        "inherits": "2.0.3",
+        "parse-asn1": "5.1.0"
+      }
     },
     "browserify-zlib": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/browserify-zlib/-/browserify-zlib-0.1.4.tgz",
-      "integrity": "sha1-uzX4pRn2AOD6a4SFJByXnQFB+y0="
+      "integrity": "sha1-uzX4pRn2AOD6a4SFJByXnQFB+y0=",
+      "requires": {
+        "pako": "0.2.9"
+      }
     },
     "browserslist": {
-      "version": "1.7.7",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
-      "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk="
+      "version": "2.8.0",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.8.0.tgz",
+      "integrity": "sha512-iiWHM1Et6Q4TQpB7Ar6pxuM3TNMXasVJY4Y/oh3q38EwR3Z+IdZ9MyVf7PI4MJFB4xpwMcZgs9bEUnPG2E3TCA==",
+      "requires": {
+        "caniuse-lite": "1.0.30000760",
+        "electron-to-chromium": "1.3.27"
+      }
     },
     "bser": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/bser/-/bser-2.0.0.tgz",
-      "integrity": "sha1-mseNPtXZFYBP2HrLFYvHlxR6Fxk="
+      "integrity": "sha1-mseNPtXZFYBP2HrLFYvHlxR6Fxk=",
+      "requires": {
+        "node-int64": "0.4.0"
+      }
     },
     "buffer": {
       "version": "4.9.1",
       "resolved": "https://registry.npmjs.org/buffer/-/buffer-4.9.1.tgz",
-      "integrity": "sha1-bRu2AbB6TvztlwlBMgkwJ8lbwpg="
+      "integrity": "sha1-bRu2AbB6TvztlwlBMgkwJ8lbwpg=",
+      "requires": {
+        "base64-js": "1.2.1",
+        "ieee754": "1.1.8",
+        "isarray": "1.0.0"
+      }
     },
     "buffer-indexof": {
       "version": "1.1.1",
@@ -3825,11 +2818,27 @@
       "version": "0.15.3",
       "resolved": "https://registry.npmjs.org/bundlesize/-/bundlesize-0.15.3.tgz",
       "integrity": "sha512-CqLtaDKQFZVh9l53Py67lJOLOT//aNrmF9xT1v5cS080bbqyhOdTX5+LuoVI8LOKa351fUikGcxsQDYWQXfizg==",
+      "requires": {
+        "axios": "0.16.2",
+        "bytes": "3.0.0",
+        "ci-env": "1.4.0",
+        "commander": "2.11.0",
+        "github-build": "1.2.0",
+        "glob": "7.1.2",
+        "gzip-size": "4.0.0",
+        "opencollective": "1.0.3",
+        "prettycli": "1.4.3",
+        "read-pkg-up": "2.0.0"
+      },
       "dependencies": {
         "gzip-size": {
           "version": "4.0.0",
           "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-4.0.0.tgz",
-          "integrity": "sha512-6SWfFRd8r8VTKTpJCR7h/T6IbCaK+jM/n2gB1+pV3IrKcrLO1WTb8ZWdaRy1T/nwOz80cp4gAJf8sujpZxfA1w=="
+          "integrity": "sha512-6SWfFRd8r8VTKTpJCR7h/T6IbCaK+jM/n2gB1+pV3IrKcrLO1WTb8ZWdaRy1T/nwOz80cp4gAJf8sujpZxfA1w==",
+          "requires": {
+            "duplexer": "0.1.1",
+            "pify": "3.0.0"
+          }
         }
       }
     },
@@ -3841,7 +2850,18 @@
     "cache-base": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/cache-base/-/cache-base-1.0.1.tgz",
-      "integrity": "sha512-AKcdTnFSWATd5/GCPRxr2ChwIJ85CeyrEyjRHlKxQ56d4XJMGym0uAiKn0xbLOGOl3+yRpOTi484dVCEc5AUzQ=="
+      "integrity": "sha512-AKcdTnFSWATd5/GCPRxr2ChwIJ85CeyrEyjRHlKxQ56d4XJMGym0uAiKn0xbLOGOl3+yRpOTi484dVCEc5AUzQ==",
+      "requires": {
+        "collection-visit": "1.0.0",
+        "component-emitter": "1.2.1",
+        "get-value": "2.0.6",
+        "has-value": "1.0.0",
+        "isobject": "3.0.1",
+        "set-value": "2.0.0",
+        "to-object-path": "0.3.0",
+        "union-value": "1.0.0",
+        "unset-value": "1.0.0"
+      }
     },
     "callsites": {
       "version": "2.0.0",
@@ -3849,14 +2869,18 @@
       "integrity": "sha1-BuuE8A7qQT2oav/vrL/7Ngk7PFA="
     },
     "camelcase": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
-      "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
+      "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
     },
     "camelcase-keys": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/camelcase-keys/-/camelcase-keys-2.1.0.tgz",
       "integrity": "sha1-MIvur/3ygRkFHvodkyITyRuPkuc=",
+      "requires": {
+        "camelcase": "2.1.1",
+        "map-obj": "1.0.1"
+      },
       "dependencies": {
         "camelcase": {
           "version": "2.1.1",
@@ -3868,22 +2892,43 @@
     "caniuse-api": {
       "version": "1.6.1",
       "resolved": "https://registry.npmjs.org/caniuse-api/-/caniuse-api-1.6.1.tgz",
-      "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw="
+      "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw=",
+      "requires": {
+        "browserslist": "1.7.7",
+        "caniuse-db": "1.0.30000760",
+        "lodash.memoize": "4.1.2",
+        "lodash.uniq": "4.5.0"
+      },
+      "dependencies": {
+        "browserslist": {
+          "version": "1.7.7",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
+          "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
+          "requires": {
+            "caniuse-db": "1.0.30000760",
+            "electron-to-chromium": "1.3.27"
+          }
+        }
+      }
     },
     "caniuse-db": {
-      "version": "1.0.30000747",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000747.tgz",
-      "integrity": "sha1-j1vWweXmBFpNTmxqOlktGeGotRQ="
+      "version": "1.0.30000760",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000760.tgz",
+      "integrity": "sha1-PqKUc+t4psywny63Osnh3r/sUo0="
     },
     "caniuse-lite": {
-      "version": "1.0.30000747",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000747.tgz",
-      "integrity": "sha1-2obnjhLQZBq+6u5uzVXYG9m9O10="
+      "version": "1.0.30000760",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000760.tgz",
+      "integrity": "sha1-7HIDlXQvHH7IlH/W3SYE53qPmP8="
     },
     "cardinal": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/cardinal/-/cardinal-1.0.0.tgz",
-      "integrity": "sha1-UOIcGwqjdyn5N33vGWtanOyTLuk="
+      "integrity": "sha1-UOIcGwqjdyn5N33vGWtanOyTLuk=",
+      "requires": {
+        "ansicolors": "0.2.1",
+        "redeyed": "1.0.1"
+      }
     },
     "case-sensitive-paths-webpack-plugin": {
       "version": "2.1.1",
@@ -3899,6 +2944,10 @@
       "version": "0.1.3",
       "resolved": "https://registry.npmjs.org/center-align/-/center-align-0.1.3.tgz",
       "integrity": "sha1-qg0yYptu6XIgBBHL1EYckHvCt60=",
+      "requires": {
+        "align-text": "0.1.4",
+        "lazy-cache": "1.0.4"
+      },
       "dependencies": {
         "lazy-cache": {
           "version": "1.0.4",
@@ -3915,22 +2964,58 @@
     "chainsaw": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/chainsaw/-/chainsaw-0.1.0.tgz",
-      "integrity": "sha1-XqtQsor+WAdNDVgpE4iCi15fvJg="
+      "integrity": "sha1-XqtQsor+WAdNDVgpE4iCi15fvJg=",
+      "requires": {
+        "traverse": "0.3.9"
+      }
     },
     "chalk": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.2.0.tgz",
-      "integrity": "sha512-0BMM/2hG3ZaoPfR6F+h/oWpZtsh3b/s62TjSM6MGCJWEbJDN1acqCXvyhhZsDSVFklpebUoQ5O1kKC7lOzrn9g=="
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.3.0.tgz",
+      "integrity": "sha512-Az5zJR2CBujap2rqXGaJKaPHyJ0IrUimvYNX+ncCy8PJP4ltOGTrHUIo097ZaL2zMeKYpiCdqDvS6zdrTFok3Q==",
+      "requires": {
+        "ansi-styles": "3.2.0",
+        "escape-string-regexp": "1.0.5",
+        "supports-color": "4.5.0"
+      }
     },
     "cheerio": {
       "version": "0.22.0",
       "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-0.22.0.tgz",
-      "integrity": "sha1-qbqoYKP5tZWmuBsahocxIe06Jp4="
+      "integrity": "sha1-qbqoYKP5tZWmuBsahocxIe06Jp4=",
+      "requires": {
+        "css-select": "1.2.0",
+        "dom-serializer": "0.1.0",
+        "entities": "1.1.1",
+        "htmlparser2": "3.9.2",
+        "lodash.assignin": "4.2.0",
+        "lodash.bind": "4.2.1",
+        "lodash.defaults": "4.2.0",
+        "lodash.filter": "4.6.0",
+        "lodash.flatten": "4.4.0",
+        "lodash.foreach": "4.5.0",
+        "lodash.map": "4.6.0",
+        "lodash.merge": "4.6.0",
+        "lodash.pick": "4.4.0",
+        "lodash.reduce": "4.6.0",
+        "lodash.reject": "4.6.0",
+        "lodash.some": "4.6.0"
+      }
     },
     "chokidar": {
       "version": "1.7.0",
       "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-1.7.0.tgz",
-      "integrity": "sha1-eY5ol3gVHIB2tLNg5e3SjNortGg="
+      "integrity": "sha1-eY5ol3gVHIB2tLNg5e3SjNortGg=",
+      "requires": {
+        "anymatch": "1.3.2",
+        "async-each": "1.0.1",
+        "glob-parent": "2.0.0",
+        "inherits": "2.0.3",
+        "is-binary-path": "1.0.1",
+        "is-glob": "2.0.1",
+        "path-is-absolute": "1.0.1",
+        "readdirp": "2.1.0"
+      }
     },
     "ci-env": {
       "version": "1.4.0",
@@ -3945,12 +3030,19 @@
     "cipher-base": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/cipher-base/-/cipher-base-1.0.4.tgz",
-      "integrity": "sha512-Kkht5ye6ZGmwv40uUDZztayT2ThLQGfnj/T71N/XzeZeo3nf8foyW7zGTsPYkEya3m5f3cAypH+qe7YOrM1U2Q=="
+      "integrity": "sha512-Kkht5ye6ZGmwv40uUDZztayT2ThLQGfnj/T71N/XzeZeo3nf8foyW7zGTsPYkEya3m5f3cAypH+qe7YOrM1U2Q==",
+      "requires": {
+        "inherits": "2.0.3",
+        "safe-buffer": "5.1.1"
+      }
     },
     "clap": {
       "version": "1.2.3",
       "resolved": "https://registry.npmjs.org/clap/-/clap-1.2.3.tgz",
       "integrity": "sha512-4CoL/A3hf90V3VIEjeuhSvlGFEHKzOz+Wfc2IVZc+FaUgU0ZQafJTP49fvnULipOPcAfqhyI2duwQyns6xqjYA==",
+      "requires": {
+        "chalk": "1.1.3"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -3960,7 +3052,14 @@
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          }
         },
         "supports-color": {
           "version": "2.0.0",
@@ -3973,16 +3072,36 @@
       "version": "0.3.5",
       "resolved": "https://registry.npmjs.org/class-utils/-/class-utils-0.3.5.tgz",
       "integrity": "sha1-F+eTEDdQ+WJ7IXbqNM/RtWWQPIA=",
+      "requires": {
+        "arr-union": "3.1.0",
+        "define-property": "0.2.5",
+        "isobject": "3.0.1",
+        "lazy-cache": "2.0.2",
+        "static-extend": "0.1.2"
+      },
       "dependencies": {
         "define-property": {
           "version": "0.2.5",
           "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
-          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY="
+          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY=",
+          "requires": {
+            "is-descriptor": "0.1.6"
+          }
         },
         "is-descriptor": {
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
-          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
+          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg==",
+          "requires": {
+            "is-accessor-descriptor": "0.1.6",
+            "is-data-descriptor": "0.1.4",
+            "kind-of": "5.1.0"
+          }
+        },
+        "kind-of": {
+          "version": "5.1.0",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
+          "integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw=="
         }
       }
     },
@@ -3994,12 +3113,18 @@
     "cli-cursor": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-2.1.0.tgz",
-      "integrity": "sha1-s12sN2R5+sw+lHR9QdDQ9SOP/LU="
+      "integrity": "sha1-s12sN2R5+sw+lHR9QdDQ9SOP/LU=",
+      "requires": {
+        "restore-cursor": "2.0.0"
+      }
     },
     "cli-table": {
       "version": "0.3.1",
       "resolved": "https://registry.npmjs.org/cli-table/-/cli-table-0.3.1.tgz",
       "integrity": "sha1-9TsFJmqLGguTSz0IIebi3FkUriM=",
+      "requires": {
+        "colors": "1.0.3"
+      },
       "dependencies": {
         "colors": {
           "version": "1.0.3",
@@ -4011,7 +3136,11 @@
     "cli-usage": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/cli-usage/-/cli-usage-0.1.4.tgz",
-      "integrity": "sha1-fAHg3HBsI0s5yTODjI4gshdXduI="
+      "integrity": "sha1-fAHg3HBsI0s5yTODjI4gshdXduI=",
+      "requires": {
+        "marked": "0.3.6",
+        "marked-terminal": "1.7.0"
+      }
     },
     "cli-width": {
       "version": "2.2.0",
@@ -4019,14 +3148,32 @@
       "integrity": "sha1-/xnt6Kml5XkyQUewwR8PvLq+1jk="
     },
     "cliui": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
-      "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE=",
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
+      "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0=",
+      "requires": {
+        "string-width": "1.0.2",
+        "strip-ansi": "3.0.1",
+        "wrap-ansi": "2.1.0"
+      },
       "dependencies": {
-        "wordwrap": {
-          "version": "0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
-          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
+        "is-fullwidth-code-point": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
+          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
+          "requires": {
+            "number-is-nan": "1.0.1"
+          }
+        },
+        "string-width": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
+          "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
+          "requires": {
+            "code-point-at": "1.1.0",
+            "is-fullwidth-code-point": "1.0.0",
+            "strip-ansi": "3.0.1"
+          }
         }
       }
     },
@@ -4039,16 +3186,28 @@
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-0.3.0.tgz",
       "integrity": "sha1-NIxhrpzb4O3+BT2R/0zFIdeQ7eg=",
+      "requires": {
+        "for-own": "1.0.0",
+        "is-plain-object": "2.0.4",
+        "kind-of": "3.2.2",
+        "shallow-clone": "0.1.2"
+      },
       "dependencies": {
         "for-own": {
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/for-own/-/for-own-1.0.0.tgz",
-          "integrity": "sha1-xjMy9BXO3EsE2/5wz4NklMU8tEs="
+          "integrity": "sha1-xjMy9BXO3EsE2/5wz4NklMU8tEs=",
+          "requires": {
+            "for-in": "1.0.2"
+          }
         },
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+          "requires": {
+            "is-buffer": "1.1.6"
+          }
         }
       }
     },
@@ -4060,7 +3219,10 @@
     "coa": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/coa/-/coa-1.0.4.tgz",
-      "integrity": "sha1-qe8VNmDWqGqL3sAomlxoTSF0Mv0="
+      "integrity": "sha1-qe8VNmDWqGqL3sAomlxoTSF0Mv0=",
+      "requires": {
+        "q": "1.5.1"
+      }
     },
     "code-point-at": {
       "version": "1.1.0",
@@ -4070,17 +3232,29 @@
     "collection-visit": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/collection-visit/-/collection-visit-1.0.0.tgz",
-      "integrity": "sha1-S8A3PBZLwykbTTaMgpzxqApZ3KA="
+      "integrity": "sha1-S8A3PBZLwykbTTaMgpzxqApZ3KA=",
+      "requires": {
+        "map-visit": "1.0.0",
+        "object-visit": "1.0.1"
+      }
     },
     "color": {
       "version": "0.11.4",
       "resolved": "https://registry.npmjs.org/color/-/color-0.11.4.tgz",
-      "integrity": "sha1-bXtcdPtl6EHNSHkq0e1eB7kE12Q="
+      "integrity": "sha1-bXtcdPtl6EHNSHkq0e1eB7kE12Q=",
+      "requires": {
+        "clone": "1.0.2",
+        "color-convert": "1.9.0",
+        "color-string": "0.3.0"
+      }
     },
     "color-convert": {
       "version": "1.9.0",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.0.tgz",
-      "integrity": "sha1-Gsz5fdc5uYO/mU1W/sj5WFNkG3o="
+      "integrity": "sha1-Gsz5fdc5uYO/mU1W/sj5WFNkG3o=",
+      "requires": {
+        "color-name": "1.1.3"
+      }
     },
     "color-functions": {
       "version": "1.1.0",
@@ -4095,12 +3269,20 @@
     "color-string": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/color-string/-/color-string-0.3.0.tgz",
-      "integrity": "sha1-J9RvtnAlxcL6JZk7+/V55HhBuZE="
+      "integrity": "sha1-J9RvtnAlxcL6JZk7+/V55HhBuZE=",
+      "requires": {
+        "color-name": "1.1.3"
+      }
     },
     "colormin": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/colormin/-/colormin-1.1.2.tgz",
-      "integrity": "sha1-6i90IKcrlogaOKrlnsEkpvcpgTM="
+      "integrity": "sha1-6i90IKcrlogaOKrlnsEkpvcpgTM=",
+      "requires": {
+        "color": "0.11.4",
+        "css-color-names": "0.0.4",
+        "has": "1.0.1"
+      }
     },
     "colors": {
       "version": "1.1.2",
@@ -4110,12 +3292,20 @@
     "combined-stream": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz",
-      "integrity": "sha1-k4NwpXtKUd6ix3wV1cX9+JUWQAk="
+      "integrity": "sha1-k4NwpXtKUd6ix3wV1cX9+JUWQAk=",
+      "requires": {
+        "delayed-stream": "1.0.0"
+      }
     },
     "command-line-args": {
       "version": "4.0.7",
       "resolved": "https://registry.npmjs.org/command-line-args/-/command-line-args-4.0.7.tgz",
-      "integrity": "sha512-aUdPvQRAyBvQd2n7jXcsMDz68ckBJELXNzBybCHOibUWEg0mWTnaYCSRU8h9R+aNRSvDihJtssSRCiDRpLaezA=="
+      "integrity": "sha512-aUdPvQRAyBvQd2n7jXcsMDz68ckBJELXNzBybCHOibUWEg0mWTnaYCSRU8h9R+aNRSvDihJtssSRCiDRpLaezA==",
+      "requires": {
+        "array-back": "2.0.0",
+        "find-replace": "1.0.3",
+        "typical": "2.6.1"
+      }
     },
     "commander": {
       "version": "2.11.0",
@@ -4125,7 +3315,10 @@
     "common-tags": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/common-tags/-/common-tags-1.4.0.tgz",
-      "integrity": "sha1-EYe+Tz1M8MBCfUP3Tu8fc1AWFMA="
+      "integrity": "sha1-EYe+Tz1M8MBCfUP3Tu8fc1AWFMA=",
+      "requires": {
+        "babel-runtime": "6.26.0"
+      }
     },
     "commondir": {
       "version": "1.0.1",
@@ -4138,14 +3331,26 @@
       "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY="
     },
     "compressible": {
-      "version": "2.0.11",
-      "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.11.tgz",
-      "integrity": "sha1-FnGKdd4oPtjmBAQWJaIGRYZ5fYo="
+      "version": "2.0.12",
+      "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.12.tgz",
+      "integrity": "sha1-xZpcmdt2dn6YdlAOJx72OzSTvWY=",
+      "requires": {
+        "mime-db": "1.30.0"
+      }
     },
     "compression": {
       "version": "1.7.1",
       "resolved": "https://registry.npmjs.org/compression/-/compression-1.7.1.tgz",
-      "integrity": "sha1-7/JgPvwuIs+G810uuTWJ+YdTc9s="
+      "integrity": "sha1-7/JgPvwuIs+G810uuTWJ+YdTc9s=",
+      "requires": {
+        "accepts": "1.3.4",
+        "bytes": "3.0.0",
+        "compressible": "2.0.12",
+        "debug": "2.6.9",
+        "on-headers": "1.0.1",
+        "safe-buffer": "5.1.1",
+        "vary": "1.1.2"
+      }
     },
     "concat-map": {
       "version": "0.0.1",
@@ -4155,22 +3360,46 @@
     "configstore": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.1.tgz",
-      "integrity": "sha512-5oNkD/L++l0O6xGXxb1EWS7SivtjfGQlRyxJsYgE0Z495/L81e2h4/d3r969hoPXuFItzNOKMtsXgYG4c7dYvw=="
+      "integrity": "sha512-5oNkD/L++l0O6xGXxb1EWS7SivtjfGQlRyxJsYgE0Z495/L81e2h4/d3r969hoPXuFItzNOKMtsXgYG4c7dYvw==",
+      "requires": {
+        "dot-prop": "4.2.0",
+        "graceful-fs": "4.1.11",
+        "make-dir": "1.1.0",
+        "unique-string": "1.0.0",
+        "write-file-atomic": "2.3.0",
+        "xdg-basedir": "3.0.0"
+      }
     },
     "connect": {
       "version": "3.5.1",
       "resolved": "https://registry.npmjs.org/connect/-/connect-3.5.1.tgz",
       "integrity": "sha1-bTDXpjx/FwhXprOqazY9lz3KWI4=",
+      "requires": {
+        "debug": "2.2.0",
+        "finalhandler": "0.5.1",
+        "parseurl": "1.3.2",
+        "utils-merge": "1.0.0"
+      },
       "dependencies": {
         "debug": {
           "version": "2.2.0",
           "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo=",
+          "requires": {
+            "ms": "0.7.1"
+          }
         },
         "finalhandler": {
           "version": "0.5.1",
           "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-0.5.1.tgz",
-          "integrity": "sha1-LEANjUUwk1vCMlScX6OF7Afeb80="
+          "integrity": "sha1-LEANjUUwk1vCMlScX6OF7Afeb80=",
+          "requires": {
+            "debug": "2.2.0",
+            "escape-html": "1.0.3",
+            "on-finished": "2.3.0",
+            "statuses": "1.3.1",
+            "unpipe": "1.0.0"
+          }
         },
         "ms": {
           "version": "0.7.1",
@@ -4192,7 +3421,10 @@
     "console-browserify": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.1.0.tgz",
-      "integrity": "sha1-8CQcRXMKn8YyOyBtvzjtx0HQuxA="
+      "integrity": "sha1-8CQcRXMKn8YyOyBtvzjtx0HQuxA=",
+      "requires": {
+        "date-now": "0.1.4"
+      }
     },
     "console-control-strings": {
       "version": "1.1.0",
@@ -4215,9 +3447,9 @@
       "integrity": "sha512-hIP3EEPs8tB9AT1L+NUqtwOAps4mk2Zob89MWXMHjHWg9milF/j4osnnQLXBCBFBk/tvIG/tUc9mOUJiPBhPXA=="
     },
     "content-type-parser": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/content-type-parser/-/content-type-parser-1.0.1.tgz",
-      "integrity": "sha1-w+VpiMU8ZRJ/tG1AMqOpACRv3JQ="
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/content-type-parser/-/content-type-parser-1.0.2.tgz",
+      "integrity": "sha512-lM4l4CnMEwOLHAHr/P6MEZwZFPJFtAAKgL6pogbXmVZggIqXhdB6RbBtPOTsw2FcXwYhehRGERJmRrjOiIB8pQ=="
     },
     "convert-source-map": {
       "version": "1.5.0",
@@ -4253,6 +3485,15 @@
       "version": "2.2.2",
       "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-2.2.2.tgz",
       "integrity": "sha512-GiNXLwAFPYHy25XmTPpafYvn3CLAkJ8FLsscq78MQd1Kh0OU6Yzhn4eV2MVF4G9WEQZoWEGltatdR+ntGPMl5A==",
+      "requires": {
+        "is-directory": "0.3.1",
+        "js-yaml": "3.7.0",
+        "minimist": "1.2.0",
+        "object-assign": "4.1.1",
+        "os-homedir": "1.0.2",
+        "parse-json": "2.2.0",
+        "require-from-string": "1.2.1"
+      },
       "dependencies": {
         "minimist": {
           "version": "1.2.0",
@@ -4264,49 +3505,109 @@
     "cpx": {
       "version": "1.5.0",
       "resolved": "https://registry.npmjs.org/cpx/-/cpx-1.5.0.tgz",
-      "integrity": "sha1-GFvgGFEdhycN7czCkxceN2VauI8="
+      "integrity": "sha1-GFvgGFEdhycN7czCkxceN2VauI8=",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "chokidar": "1.7.0",
+        "duplexer": "0.1.1",
+        "glob": "7.1.2",
+        "glob2base": "0.0.12",
+        "minimatch": "3.0.4",
+        "mkdirp": "0.5.1",
+        "resolve": "1.5.0",
+        "safe-buffer": "5.1.1",
+        "shell-quote": "1.6.1",
+        "subarg": "1.0.0"
+      }
     },
     "create-ecdh": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.0.tgz",
-      "integrity": "sha1-iIxyNZbN92EvZJgjPuvXo1MBc30="
+      "integrity": "sha1-iIxyNZbN92EvZJgjPuvXo1MBc30=",
+      "requires": {
+        "bn.js": "4.11.8",
+        "elliptic": "6.4.0"
+      }
     },
     "create-hash": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/create-hash/-/create-hash-1.1.3.tgz",
-      "integrity": "sha1-YGBCrIuSYnUPSDyt2rD1gZFy2P0="
+      "integrity": "sha1-YGBCrIuSYnUPSDyt2rD1gZFy2P0=",
+      "requires": {
+        "cipher-base": "1.0.4",
+        "inherits": "2.0.3",
+        "ripemd160": "2.0.1",
+        "sha.js": "2.4.9"
+      }
     },
     "create-hmac": {
       "version": "1.1.6",
       "resolved": "https://registry.npmjs.org/create-hmac/-/create-hmac-1.1.6.tgz",
-      "integrity": "sha1-rLniIaThe9sHbpBlfEK5PjcmzwY="
+      "integrity": "sha1-rLniIaThe9sHbpBlfEK5PjcmzwY=",
+      "requires": {
+        "cipher-base": "1.0.4",
+        "create-hash": "1.1.3",
+        "inherits": "2.0.3",
+        "ripemd160": "2.0.1",
+        "safe-buffer": "5.1.1",
+        "sha.js": "2.4.9"
+      }
     },
     "create-react-class": {
       "version": "15.6.2",
       "resolved": "https://registry.npmjs.org/create-react-class/-/create-react-class-15.6.2.tgz",
-      "integrity": "sha1-zx7RXxKq1/FO9fLf4F5sQvke8Co="
+      "integrity": "sha1-zx7RXxKq1/FO9fLf4F5sQvke8Co=",
+      "requires": {
+        "fbjs": "0.8.16",
+        "loose-envify": "1.3.1",
+        "object-assign": "4.1.1"
+      }
     },
     "cross-spawn": {
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-5.1.0.tgz",
-      "integrity": "sha1-6L0O/uWPz/b4+UUQoKVUu/ojVEk="
+      "integrity": "sha1-6L0O/uWPz/b4+UUQoKVUu/ojVEk=",
+      "requires": {
+        "lru-cache": "4.1.1",
+        "shebang-command": "1.2.0",
+        "which": "1.3.0"
+      }
     },
     "cryptiles": {
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-3.1.2.tgz",
       "integrity": "sha1-qJ+7Ig9c4l7FboxKqKT9e1sNKf4=",
+      "requires": {
+        "boom": "5.2.0"
+      },
       "dependencies": {
         "boom": {
           "version": "5.2.0",
           "resolved": "https://registry.npmjs.org/boom/-/boom-5.2.0.tgz",
-          "integrity": "sha512-Z5BTk6ZRe4tXXQlkqftmsAUANpXmuwlsF5Oov8ThoMbQRzdGTA1ngYRW160GexgOgjsFOKJz0LYhoNi+2AMBUw=="
+          "integrity": "sha512-Z5BTk6ZRe4tXXQlkqftmsAUANpXmuwlsF5Oov8ThoMbQRzdGTA1ngYRW160GexgOgjsFOKJz0LYhoNi+2AMBUw==",
+          "requires": {
+            "hoek": "4.2.0"
+          }
         }
       }
     },
     "crypto-browserify": {
-      "version": "3.11.1",
-      "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.11.1.tgz",
-      "integrity": "sha512-Na7ZlwCOqoaW5RwUK1WpXws2kv8mNhWdTlzob0UXulk6G9BDbyiJaGTYBIX61Ozn9l1EPPJpICZb4DaOpT9NlQ=="
+      "version": "3.12.0",
+      "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.12.0.tgz",
+      "integrity": "sha512-fz4spIh+znjO2VjL+IdhEpRJ3YN6sMzITSBijk6FK2UvTqruSQW+/cCZTSNsMiZNvUeq0CqurF+dAbyiGOY6Wg==",
+      "requires": {
+        "browserify-cipher": "1.0.0",
+        "browserify-sign": "4.0.4",
+        "create-ecdh": "4.0.0",
+        "create-hash": "1.1.3",
+        "create-hmac": "1.1.6",
+        "diffie-hellman": "5.0.2",
+        "inherits": "2.0.3",
+        "pbkdf2": "3.0.14",
+        "public-encrypt": "4.0.0",
+        "randombytes": "2.0.5",
+        "randomfill": "1.0.3"
+      }
     },
     "crypto-random-string": {
       "version": "1.0.0",
@@ -4321,12 +3622,31 @@
     "css-in-js-utils": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/css-in-js-utils/-/css-in-js-utils-2.0.0.tgz",
-      "integrity": "sha512-yuWmPMD9FLi50Xf3k8W8oO3WM1eVnxEGCldCLyfusQ+CgivFk0s23yst4ooW6tfxMuSa03S6uUEga9UhX6GRrA=="
+      "integrity": "sha512-yuWmPMD9FLi50Xf3k8W8oO3WM1eVnxEGCldCLyfusQ+CgivFk0s23yst4ooW6tfxMuSa03S6uUEga9UhX6GRrA==",
+      "requires": {
+        "hyphenate-style-name": "1.0.2"
+      }
     },
     "css-loader": {
       "version": "0.28.7",
       "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.7.tgz",
       "integrity": "sha512-GxMpax8a/VgcfRrVy0gXD6yLd5ePYbXX/5zGgTVYp4wXtJklS8Z2VaUArJgc//f6/Dzil7BaJObdSv8eKKCPgg==",
+      "requires": {
+        "babel-code-frame": "6.26.0",
+        "css-selector-tokenizer": "0.7.0",
+        "cssnano": "3.10.0",
+        "icss-utils": "2.1.0",
+        "loader-utils": "1.1.0",
+        "lodash.camelcase": "4.3.0",
+        "object-assign": "4.1.1",
+        "postcss": "5.2.18",
+        "postcss-modules-extract-imports": "1.1.0",
+        "postcss-modules-local-by-default": "1.2.0",
+        "postcss-modules-scope": "1.1.0",
+        "postcss-modules-values": "1.3.0",
+        "postcss-value-parser": "3.3.0",
+        "source-list-map": "2.0.0"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -4337,6 +3657,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -4353,7 +3680,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -4363,7 +3696,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -4371,6 +3707,14 @@
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/css-modules-loader-core/-/css-modules-loader-core-1.1.0.tgz",
       "integrity": "sha1-WQhmgpShvs0mGuCkziGwtVHyHRY=",
+      "requires": {
+        "icss-replace-symbols": "1.1.0",
+        "postcss": "6.0.1",
+        "postcss-modules-extract-imports": "1.1.0",
+        "postcss-modules-local-by-default": "1.2.0",
+        "postcss-modules-scope": "1.1.0",
+        "postcss-modules-values": "1.3.0"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -4381,6 +3725,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -4397,7 +3748,12 @@
         "postcss": {
           "version": "6.0.1",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.1.tgz",
-          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I="
+          "integrity": "sha1-AA29H47vIXqjaLmiEsX8QLKo8/I=",
+          "requires": {
+            "chalk": "1.1.3",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -4407,19 +3763,33 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
     "css-select": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz",
-      "integrity": "sha1-KzoRBTnFNV8c2NMUYj6HCxIeyFg="
+      "integrity": "sha1-KzoRBTnFNV8c2NMUYj6HCxIeyFg=",
+      "requires": {
+        "boolbase": "1.0.0",
+        "css-what": "2.1.0",
+        "domutils": "1.5.1",
+        "nth-check": "1.0.1"
+      }
     },
     "css-selector-tokenizer": {
       "version": "0.7.0",
       "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.7.0.tgz",
-      "integrity": "sha1-5piEdK6MlTR3v15+/s/OzNnPTIY="
+      "integrity": "sha1-5piEdK6MlTR3v15+/s/OzNnPTIY=",
+      "requires": {
+        "cssesc": "0.1.0",
+        "fastparse": "1.1.1",
+        "regexpu-core": "1.0.0"
+      }
     },
     "css-what": {
       "version": "2.1.0",
@@ -4435,6 +3805,40 @@
       "version": "3.10.0",
       "resolved": "https://registry.npmjs.org/cssnano/-/cssnano-3.10.0.tgz",
       "integrity": "sha1-Tzj2zqK5sX+gFJDyPx3GjqZcHDg=",
+      "requires": {
+        "autoprefixer": "6.7.7",
+        "decamelize": "1.2.0",
+        "defined": "1.0.0",
+        "has": "1.0.1",
+        "object-assign": "4.1.1",
+        "postcss": "5.2.18",
+        "postcss-calc": "5.3.1",
+        "postcss-colormin": "2.2.2",
+        "postcss-convert-values": "2.6.1",
+        "postcss-discard-comments": "2.0.4",
+        "postcss-discard-duplicates": "2.1.0",
+        "postcss-discard-empty": "2.1.0",
+        "postcss-discard-overridden": "0.1.1",
+        "postcss-discard-unused": "2.2.3",
+        "postcss-filter-plugins": "2.0.2",
+        "postcss-merge-idents": "2.1.7",
+        "postcss-merge-longhand": "2.0.2",
+        "postcss-merge-rules": "2.1.2",
+        "postcss-minify-font-values": "1.0.5",
+        "postcss-minify-gradients": "1.0.5",
+        "postcss-minify-params": "1.2.2",
+        "postcss-minify-selectors": "2.1.1",
+        "postcss-normalize-charset": "1.1.1",
+        "postcss-normalize-url": "3.0.8",
+        "postcss-ordered-values": "2.2.3",
+        "postcss-reduce-idents": "2.4.0",
+        "postcss-reduce-initial": "1.0.1",
+        "postcss-reduce-transforms": "1.0.4",
+        "postcss-svgo": "2.1.6",
+        "postcss-unique-selectors": "2.0.2",
+        "postcss-value-parser": "3.3.0",
+        "postcss-zindex": "2.2.0"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -4444,12 +3848,36 @@
         "autoprefixer": {
           "version": "6.7.7",
           "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-6.7.7.tgz",
-          "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ="
+          "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ=",
+          "requires": {
+            "browserslist": "1.7.7",
+            "caniuse-db": "1.0.30000760",
+            "normalize-range": "0.1.2",
+            "num2fraction": "1.2.2",
+            "postcss": "5.2.18",
+            "postcss-value-parser": "3.3.0"
+          }
+        },
+        "browserslist": {
+          "version": "1.7.7",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
+          "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
+          "requires": {
+            "caniuse-db": "1.0.30000760",
+            "electron-to-chromium": "1.3.27"
+          }
         },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -4466,7 +3894,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -4476,7 +3910,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -4484,6 +3921,10 @@
       "version": "2.3.2",
       "resolved": "https://registry.npmjs.org/csso/-/csso-2.3.2.tgz",
       "integrity": "sha1-3dUsWHAz9J6Utx/FVWnyUuj/X4U=",
+      "requires": {
+        "clap": "1.2.3",
+        "source-map": "0.5.7"
+      },
       "dependencies": {
         "source-map": {
           "version": "0.5.7",
@@ -4500,22 +3941,34 @@
     "cssstyle": {
       "version": "0.2.37",
       "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-0.2.37.tgz",
-      "integrity": "sha1-VBCXI0yyUTyDzu06zdwn/yeYfVQ="
+      "integrity": "sha1-VBCXI0yyUTyDzu06zdwn/yeYfVQ=",
+      "requires": {
+        "cssom": "0.3.2"
+      }
     },
     "currently-unhandled": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz",
-      "integrity": "sha1-mI3zP+qxke95mmE2nddsF635V+o="
+      "integrity": "sha1-mI3zP+qxke95mmE2nddsF635V+o=",
+      "requires": {
+        "array-find-index": "1.0.2"
+      }
     },
     "d": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/d/-/d-1.0.0.tgz",
-      "integrity": "sha1-dUu1v+VUUdpppYuU1F9MWwRi1Y8="
+      "integrity": "sha1-dUu1v+VUUdpppYuU1F9MWwRi1Y8=",
+      "requires": {
+        "es5-ext": "0.10.35"
+      }
     },
     "dashdash": {
       "version": "1.14.1",
       "resolved": "https://registry.npmjs.org/dashdash/-/dashdash-1.14.1.tgz",
-      "integrity": "sha1-hTz6D3y+L+1d4gMmuN1YEDX24vA="
+      "integrity": "sha1-hTz6D3y+L+1d4gMmuN1YEDX24vA=",
+      "requires": {
+        "assert-plus": "1.0.0"
+      }
     },
     "date-now": {
       "version": "0.1.4",
@@ -4525,17 +3978,34 @@
     "debug": {
       "version": "2.6.9",
       "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-      "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA=="
+      "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+      "requires": {
+        "ms": "2.0.0"
+      }
     },
     "decamelize": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
       "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA="
     },
+    "decode-uri-component": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/decode-uri-component/-/decode-uri-component-0.2.0.tgz",
+      "integrity": "sha1-6zkTMzRYd1y4TNGh+uBiEGu4dUU="
+    },
     "decompress-zip": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/decompress-zip/-/decompress-zip-0.3.0.tgz",
       "integrity": "sha1-rjvLfjTGWHmt/nfhnDD4ZgK0vbA=",
+      "requires": {
+        "binary": "0.3.0",
+        "graceful-fs": "4.1.11",
+        "mkpath": "0.1.0",
+        "nopt": "3.0.6",
+        "q": "1.5.1",
+        "readable-stream": "1.1.14",
+        "touch": "0.0.3"
+      },
       "dependencies": {
         "isarray": {
           "version": "0.0.1",
@@ -4545,7 +4015,13 @@
         "readable-stream": {
           "version": "1.1.14",
           "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
-          "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk="
+          "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk=",
+          "requires": {
+            "core-util-is": "1.0.2",
+            "inherits": "2.0.3",
+            "isarray": "0.0.1",
+            "string_decoder": "0.10.31"
+          }
         },
         "string_decoder": {
           "version": "0.10.31",
@@ -4568,23 +4044,36 @@
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/default-require-extensions/-/default-require-extensions-1.0.0.tgz",
       "integrity": "sha1-836hXT4T/9m0N9M+GnW1+5eHTLg=",
+      "requires": {
+        "strip-bom": "2.0.0"
+      },
       "dependencies": {
         "strip-bom": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
-          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4=",
+          "requires": {
+            "is-utf8": "0.2.1"
+          }
         }
       }
     },
     "define-properties": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.1.2.tgz",
-      "integrity": "sha1-g6c/L+pWmJj7c3GTyPhzyvbUXJQ="
+      "integrity": "sha1-g6c/L+pWmJj7c3GTyPhzyvbUXJQ=",
+      "requires": {
+        "foreach": "2.0.5",
+        "object-keys": "1.0.11"
+      }
     },
     "define-property": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/define-property/-/define-property-1.0.0.tgz",
-      "integrity": "sha1-dp66rz9KY6rTr56NMEybvnm/sOY="
+      "integrity": "sha1-dp66rz9KY6rTr56NMEybvnm/sOY=",
+      "requires": {
+        "is-descriptor": "1.0.1"
+      }
     },
     "defined": {
       "version": "1.0.0",
@@ -4594,7 +4083,15 @@
     "del": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/del/-/del-3.0.0.tgz",
-      "integrity": "sha1-U+z2mf/LyzljdpGrE7rxYIGXZuU="
+      "integrity": "sha1-U+z2mf/LyzljdpGrE7rxYIGXZuU=",
+      "requires": {
+        "globby": "6.1.0",
+        "is-path-cwd": "1.0.0",
+        "is-path-in-cwd": "1.0.0",
+        "p-map": "1.2.0",
+        "pify": "3.0.0",
+        "rimraf": "2.6.2"
+      }
     },
     "delayed-stream": {
       "version": "1.0.0",
@@ -4614,7 +4111,11 @@
     "des.js": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/des.js/-/des.js-1.0.0.tgz",
-      "integrity": "sha1-wHTS4qpqipoH29YfmhXCzYPsjsw="
+      "integrity": "sha1-wHTS4qpqipoH29YfmhXCzYPsjsw=",
+      "requires": {
+        "inherits": "2.0.3",
+        "minimalistic-assert": "1.0.0"
+      }
     },
     "destroy": {
       "version": "1.0.4",
@@ -4624,7 +4125,10 @@
     "detect-indent": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/detect-indent/-/detect-indent-4.0.0.tgz",
-      "integrity": "sha1-920GQ1LN9Docts5hnE7jqUdd4gg="
+      "integrity": "sha1-920GQ1LN9Docts5hnE7jqUdd4gg=",
+      "requires": {
+        "repeating": "2.0.1"
+      }
     },
     "detect-node": {
       "version": "2.0.3",
@@ -4639,7 +4143,12 @@
     "diffie-hellman": {
       "version": "5.0.2",
       "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.2.tgz",
-      "integrity": "sha1-tYNXOScM/ias9jIJn97SoH8gnl4="
+      "integrity": "sha1-tYNXOScM/ias9jIJn97SoH8gnl4=",
+      "requires": {
+        "bn.js": "4.11.8",
+        "miller-rabin": "4.0.1",
+        "randombytes": "2.0.5"
+      }
     },
     "dns-equal": {
       "version": "1.0.0",
@@ -4649,17 +4158,28 @@
     "dns-packet": {
       "version": "1.2.2",
       "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.2.2.tgz",
-      "integrity": "sha512-kN+DjfGF7dJGUL7nWRktL9Z18t1rWP3aQlyZdY8XlpvU3Nc6GeFTQApftcjtWKxAZfiggZSGrCEoszNgvnpwDg=="
+      "integrity": "sha512-kN+DjfGF7dJGUL7nWRktL9Z18t1rWP3aQlyZdY8XlpvU3Nc6GeFTQApftcjtWKxAZfiggZSGrCEoszNgvnpwDg==",
+      "requires": {
+        "ip": "1.1.5",
+        "safe-buffer": "5.1.1"
+      }
     },
     "dns-txt": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/dns-txt/-/dns-txt-2.0.2.tgz",
-      "integrity": "sha1-uR2Ab10nGI5Ks+fRB9iBocxGQrY="
+      "integrity": "sha1-uR2Ab10nGI5Ks+fRB9iBocxGQrY=",
+      "requires": {
+        "buffer-indexof": "1.1.1"
+      }
     },
     "doctrine": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-2.0.0.tgz",
-      "integrity": "sha1-xz2NKQnSIpHhoAejlYBNqLZl/mM="
+      "integrity": "sha1-xz2NKQnSIpHhoAejlYBNqLZl/mM=",
+      "requires": {
+        "esutils": "2.0.2",
+        "isarray": "1.0.0"
+      }
     },
     "dom-helpers": {
       "version": "3.2.1",
@@ -4670,6 +4190,10 @@
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.1.0.tgz",
       "integrity": "sha1-BzxpdUbOB4DOI75KKOKT5AvDDII=",
+      "requires": {
+        "domelementtype": "1.1.3",
+        "entities": "1.1.1"
+      },
       "dependencies": {
         "domelementtype": {
           "version": "1.1.3",
@@ -4696,29 +4220,33 @@
     "domhandler": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.4.1.tgz",
-      "integrity": "sha1-iS5HAAqZvlW783dP/qBWHYh5wlk="
+      "integrity": "sha1-iS5HAAqZvlW783dP/qBWHYh5wlk=",
+      "requires": {
+        "domelementtype": "1.3.0"
+      }
     },
     "domutils": {
       "version": "1.5.1",
       "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.5.1.tgz",
-      "integrity": "sha1-3NhIiib1Y9YQeeSMn3t+Mjc2gs8="
+      "integrity": "sha1-3NhIiib1Y9YQeeSMn3t+Mjc2gs8=",
+      "requires": {
+        "dom-serializer": "0.1.0",
+        "domelementtype": "1.3.0"
+      }
     },
     "dot-prop": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-4.2.0.tgz",
-      "integrity": "sha512-tUMXrxlExSW6U2EXiiKGSBVdYgtV8qlHL+C10TsW4PURY/ic+eaysnSkwB4kA/mBlCyy/IKDJ+Lc3wbWeaXtuQ=="
+      "integrity": "sha512-tUMXrxlExSW6U2EXiiKGSBVdYgtV8qlHL+C10TsW4PURY/ic+eaysnSkwB4kA/mBlCyy/IKDJ+Lc3wbWeaXtuQ==",
+      "requires": {
+        "is-obj": "1.0.1"
+      }
     },
     "duplexer": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz",
       "integrity": "sha1-rOb/gIwc5mtX0ev5eXessCM0z8E="
     },
-    "ecc-jsbn": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.1.tgz",
-      "integrity": "sha1-D8c6ntXw1Tw4GTOYUj735UN3dQU=",
-      "optional": true
-    },
     "ee-first": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
@@ -4730,14 +4258,23 @@
       "integrity": "sha1-zIcsFoiArjxxiXYv1f/ACJbJUYo="
     },
     "electron-to-chromium": {
-      "version": "1.3.26",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.26.tgz",
-      "integrity": "sha1-mWQnKUhhp02cfIK5Jg6jAejALWY="
+      "version": "1.3.27",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.27.tgz",
+      "integrity": "sha1-eOy4o5kGYYe7N07t412ccFZagD0="
     },
     "elliptic": {
       "version": "6.4.0",
       "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.4.0.tgz",
-      "integrity": "sha1-ysmvh2LIWDYYcAPI3+GT5eLq5d8="
+      "integrity": "sha1-ysmvh2LIWDYYcAPI3+GT5eLq5d8=",
+      "requires": {
+        "bn.js": "4.11.8",
+        "brorand": "1.1.0",
+        "hash.js": "1.1.3",
+        "hmac-drbg": "1.0.1",
+        "inherits": "2.0.3",
+        "minimalistic-assert": "1.0.0",
+        "minimalistic-crypto-utils": "1.0.1"
+      }
     },
     "emojis-list": {
       "version": "2.1.0",
@@ -4752,12 +4289,21 @@
     "encoding": {
       "version": "0.1.12",
       "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.12.tgz",
-      "integrity": "sha1-U4tm8+5izRq1HsMjgp0flIDHS+s="
+      "integrity": "sha1-U4tm8+5izRq1HsMjgp0flIDHS+s=",
+      "requires": {
+        "iconv-lite": "0.4.19"
+      }
     },
     "enhanced-resolve": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.3.0.tgz",
-      "integrity": "sha512-2qbxE7ek3YxPJ1ML6V+satHkzHpJQKWkRHmRx6mfAoW59yP8YH8BFplbegSP+u2hBd6B6KCOpvJQ3dZAP+hkpg=="
+      "integrity": "sha512-2qbxE7ek3YxPJ1ML6V+satHkzHpJQKWkRHmRx6mfAoW59yP8YH8BFplbegSP+u2hBd6B6KCOpvJQ3dZAP+hkpg==",
+      "requires": {
+        "graceful-fs": "4.1.11",
+        "memory-fs": "0.4.1",
+        "object-assign": "4.1.1",
+        "tapable": "0.2.8"
+      }
     },
     "entities": {
       "version": "1.1.1",
@@ -4767,32 +4313,66 @@
     "enzyme": {
       "version": "2.9.1",
       "resolved": "https://registry.npmjs.org/enzyme/-/enzyme-2.9.1.tgz",
-      "integrity": "sha1-B9XOaRJBJA+4F78sSxjW5TAkDfY="
+      "integrity": "sha1-B9XOaRJBJA+4F78sSxjW5TAkDfY=",
+      "requires": {
+        "cheerio": "0.22.0",
+        "function.prototype.name": "1.0.3",
+        "is-subset": "0.1.1",
+        "lodash": "4.17.4",
+        "object-is": "1.0.1",
+        "object.assign": "4.0.4",
+        "object.entries": "1.0.4",
+        "object.values": "1.0.4",
+        "prop-types": "15.6.0",
+        "uuid": "3.1.0"
+      }
     },
     "errno": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.4.tgz",
-      "integrity": "sha1-uJbiOp5ei6M4cfyZar02NfyaHH0="
+      "integrity": "sha1-uJbiOp5ei6M4cfyZar02NfyaHH0=",
+      "requires": {
+        "prr": "0.0.0"
+      }
     },
     "error-ex": {
       "version": "1.3.1",
       "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.1.tgz",
-      "integrity": "sha1-+FWobOYa3E6GIcPNoh56dhLDqNw="
+      "integrity": "sha1-+FWobOYa3E6GIcPNoh56dhLDqNw=",
+      "requires": {
+        "is-arrayish": "0.2.1"
+      }
     },
     "es-abstract": {
       "version": "1.9.0",
       "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.9.0.tgz",
-      "integrity": "sha512-kk3IJoKo7A3pWJc0OV8yZ/VEX2oSUytfekrJiqoxBlKJMFAJVJVpGdHClCCTdv+Fn2zHfpDHHIelMFhZVfef3Q=="
+      "integrity": "sha512-kk3IJoKo7A3pWJc0OV8yZ/VEX2oSUytfekrJiqoxBlKJMFAJVJVpGdHClCCTdv+Fn2zHfpDHHIelMFhZVfef3Q==",
+      "requires": {
+        "es-to-primitive": "1.1.1",
+        "function-bind": "1.1.1",
+        "has": "1.0.1",
+        "is-callable": "1.1.3",
+        "is-regex": "1.0.4"
+      }
     },
     "es-to-primitive": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.1.1.tgz",
-      "integrity": "sha1-RTVSSKiJeQNLZ5Lhm7gfK3l13Q0="
+      "integrity": "sha1-RTVSSKiJeQNLZ5Lhm7gfK3l13Q0=",
+      "requires": {
+        "is-callable": "1.1.3",
+        "is-date-object": "1.0.1",
+        "is-symbol": "1.0.1"
+      }
     },
     "es5-ext": {
       "version": "0.10.35",
       "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.35.tgz",
-      "integrity": "sha1-GO6FjOajxFx9eekcFfzKnsVoSU8="
+      "integrity": "sha1-GO6FjOajxFx9eekcFfzKnsVoSU8=",
+      "requires": {
+        "es6-iterator": "2.0.3",
+        "es6-symbol": "3.1.1"
+      }
     },
     "es5-shim": {
       "version": "4.5.9",
@@ -4802,12 +4382,25 @@
     "es6-iterator": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.3.tgz",
-      "integrity": "sha1-p96IkUGgWpSwhUQDstCg+/qY87c="
+      "integrity": "sha1-p96IkUGgWpSwhUQDstCg+/qY87c=",
+      "requires": {
+        "d": "1.0.0",
+        "es5-ext": "0.10.35",
+        "es6-symbol": "3.1.1"
+      }
     },
     "es6-map": {
       "version": "0.1.5",
       "resolved": "https://registry.npmjs.org/es6-map/-/es6-map-0.1.5.tgz",
-      "integrity": "sha1-kTbgUD3MBqMBaQ8LsU/042TpSfA="
+      "integrity": "sha1-kTbgUD3MBqMBaQ8LsU/042TpSfA=",
+      "requires": {
+        "d": "1.0.0",
+        "es5-ext": "0.10.35",
+        "es6-iterator": "2.0.3",
+        "es6-set": "0.1.5",
+        "es6-symbol": "3.1.1",
+        "event-emitter": "0.3.5"
+      }
     },
     "es6-promise": {
       "version": "4.1.1",
@@ -4817,7 +4410,14 @@
     "es6-set": {
       "version": "0.1.5",
       "resolved": "https://registry.npmjs.org/es6-set/-/es6-set-0.1.5.tgz",
-      "integrity": "sha1-0rPsXU2ADO2BjbU40ol02wpzzLE="
+      "integrity": "sha1-0rPsXU2ADO2BjbU40ol02wpzzLE=",
+      "requires": {
+        "d": "1.0.0",
+        "es5-ext": "0.10.35",
+        "es6-iterator": "2.0.3",
+        "es6-symbol": "3.1.1",
+        "event-emitter": "0.3.5"
+      }
     },
     "es6-shim": {
       "version": "0.35.3",
@@ -4827,12 +4427,22 @@
     "es6-symbol": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.1.tgz",
-      "integrity": "sha1-vwDvT9q2uhtG7Le2KbTH7VcVzHc="
+      "integrity": "sha1-vwDvT9q2uhtG7Le2KbTH7VcVzHc=",
+      "requires": {
+        "d": "1.0.0",
+        "es5-ext": "0.10.35"
+      }
     },
     "es6-weak-map": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/es6-weak-map/-/es6-weak-map-2.0.2.tgz",
-      "integrity": "sha1-XjqzIlH/0VOKH45f+hNXdy+S2W8="
+      "integrity": "sha1-XjqzIlH/0VOKH45f+hNXdy+S2W8=",
+      "requires": {
+        "d": "1.0.0",
+        "es5-ext": "0.10.35",
+        "es6-iterator": "2.0.3",
+        "es6-symbol": "3.1.1"
+      }
     },
     "escape-html": {
       "version": "1.0.3",
@@ -4848,24 +4458,30 @@
       "version": "1.9.0",
       "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-1.9.0.tgz",
       "integrity": "sha512-v0MYvNQ32bzwoG2OSFzWAkuahDQHK92JBN0pTAALJ4RIxEZe766QJPDR8Hqy7XNUy5K3fnVL76OqYAdc4TZEIw==",
+      "requires": {
+        "esprima": "3.1.3",
+        "estraverse": "4.2.0",
+        "esutils": "2.0.2",
+        "optionator": "0.8.2"
+      },
       "dependencies": {
         "esprima": {
           "version": "3.1.3",
           "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz",
           "integrity": "sha1-/cpRzuYTOJXjyI1TXOSdv/YqRjM="
-        },
-        "source-map": {
-          "version": "0.5.7",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
-          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=",
-          "optional": true
         }
       }
     },
     "escope": {
       "version": "3.6.0",
       "resolved": "https://registry.npmjs.org/escope/-/escope-3.6.0.tgz",
-      "integrity": "sha1-4Bl16BJ4GhY6ba392AOY3GTIicM="
+      "integrity": "sha1-4Bl16BJ4GhY6ba392AOY3GTIicM=",
+      "requires": {
+        "es6-map": "0.1.5",
+        "es6-weak-map": "2.0.2",
+        "esrecurse": "4.2.0",
+        "estraverse": "4.2.0"
+      }
     },
     "esprima": {
       "version": "2.7.3",
@@ -4875,7 +4491,11 @@
     "esrecurse": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.2.0.tgz",
-      "integrity": "sha1-+pVo2Y04I/mkHZHpAtyrnqblsWM="
+      "integrity": "sha1-+pVo2Y04I/mkHZHpAtyrnqblsWM=",
+      "requires": {
+        "estraverse": "4.2.0",
+        "object-assign": "4.1.1"
+      }
     },
     "estraverse": {
       "version": "4.2.0",
@@ -4887,873 +4507,520 @@
       "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.2.tgz",
       "integrity": "sha1-Cr9PHKpbyx96nYrMbepPqqBLrJs="
     },
-    "etag": {
-      "version": "1.8.1",
-      "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz",
-      "integrity": "sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc="
-    },
-    "event-emitter": {
-      "version": "0.3.5",
-      "resolved": "https://registry.npmjs.org/event-emitter/-/event-emitter-0.3.5.tgz",
-      "integrity": "sha1-34xp7vFkeSPHFXuc6DhAYQsCzDk="
-    },
-    "eventemitter3": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-1.2.0.tgz",
-      "integrity": "sha1-HIaZHYFq0eUEdQ5zh0Ik7PO+xQg="
-    },
-    "events": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/events/-/events-1.1.1.tgz",
-      "integrity": "sha1-nr23Y1rQmccNzEwqH1AEKI6L2SQ="
-    },
-    "eventsource": {
-      "version": "0.1.6",
-      "resolved": "https://registry.npmjs.org/eventsource/-/eventsource-0.1.6.tgz",
-      "integrity": "sha1-Cs7ehJ7X3RzMMsgRuxG5RNTykjI="
-    },
-    "evp_bytestokey": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/evp_bytestokey/-/evp_bytestokey-1.0.3.tgz",
-      "integrity": "sha512-/f2Go4TognH/KvCISP7OUsHn85hT9nUkxxA9BEWxFn+Oj9o8ZNLm/40hdlgSLyuOimsrTKLUMEorQexp/aPQeA=="
-    },
-    "exec-sh": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/exec-sh/-/exec-sh-0.2.1.tgz",
-      "integrity": "sha512-aLt95pexaugVtQerpmE51+4QfWrNc304uez7jvj6fWnN8GeEHpttB8F36n8N7uVhUMbH/1enbxQ9HImZ4w/9qg=="
-    },
-    "execa": {
-      "version": "0.7.0",
-      "resolved": "https://registry.npmjs.org/execa/-/execa-0.7.0.tgz",
-      "integrity": "sha1-lEvs00zEHuMqY6n68nrVpl/Fl3c="
-    },
-    "exenv": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/exenv/-/exenv-1.2.2.tgz",
-      "integrity": "sha1-KueOhdmJQVhnCwPUe+wfA72Ru50="
-    },
-    "expand-brackets": {
-      "version": "2.1.4",
-      "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-2.1.4.tgz",
-      "integrity": "sha1-t3c14xXOMPa27/D4OwQVGiJEliI=",
-      "dependencies": {
-        "define-property": {
-          "version": "0.2.5",
-          "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
-          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY="
-        },
-        "is-descriptor": {
-          "version": "0.1.6",
-          "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
-          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
-        }
-      }
-    },
-    "expand-range": {
-      "version": "1.8.2",
-      "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz",
-      "integrity": "sha1-opnv/TNf4nIeuujiV+x5ZE/IUzc=",
-      "dependencies": {
-        "fill-range": {
-          "version": "2.2.3",
-          "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz",
-          "integrity": "sha1-ULd9/X5Gm8dJJHCWNpn+eoSFpyM="
-        },
-        "is-number": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz",
-          "integrity": "sha1-Afy7s5NGOlSPL0ZszhbezknbkI8="
-        },
-        "isobject": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
-          "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk="
-        },
-        "kind-of": {
-          "version": "3.2.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
-        }
-      }
-    },
-    "expect": {
-      "version": "21.2.1",
-      "resolved": "https://registry.npmjs.org/expect/-/expect-21.2.1.tgz",
-      "integrity": "sha512-orfQQqFRTX0jH7znRIGi8ZMR8kTNpXklTTz8+HGTpmTKZo3Occ6JNB5FXMb8cRuiiC/GyDqsr30zUa66ACYlYw=="
-    },
-    "express": {
-      "version": "4.16.2",
-      "resolved": "https://registry.npmjs.org/express/-/express-4.16.2.tgz",
-      "integrity": "sha1-41xt/i1kt9ygpc1PIXgb4ymeB2w=",
-      "dependencies": {
-        "finalhandler": {
-          "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.0.tgz",
-          "integrity": "sha1-zgtoVbRYU+eRsvzGgARtiCU91/U="
-        },
-        "ipaddr.js": {
-          "version": "1.5.2",
-          "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.5.2.tgz",
-          "integrity": "sha1-1LUFvemUaYfM8PxY2QEP+WB+P6A="
-        },
-        "path-to-regexp": {
-          "version": "0.1.7",
-          "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
-          "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
-        },
-        "proxy-addr": {
-          "version": "2.0.2",
-          "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.2.tgz",
-          "integrity": "sha1-ZXFQT0e7mI7IGAJT+F3X4UlSvew="
-        },
-        "setprototypeof": {
-          "version": "1.1.0",
-          "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.0.tgz",
-          "integrity": "sha512-BvE/TwpZX4FXExxOxZyRGQQv651MSwmWKZGqvmPcRIjDqWub67kTKuIMx43cZZrS/cBBzwBcNDWoFxt2XEFIpQ=="
-        }
-      }
-    },
-    "extend": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz",
-      "integrity": "sha1-p1Xqe8Gt/MWjHOfnYtuq3F5jZEQ="
-    },
-    "extend-shallow": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
-      "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8="
-    },
-    "external-editor": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/external-editor/-/external-editor-2.0.5.tgz",
-      "integrity": "sha512-Msjo64WT5W+NhOpQXh0nOHm+n0RfU1QUwDnKYvJ8dEJ8zlwLrqXNTv5mSUTJpepf41PDJGyhueTw2vNZW+Fr/w=="
-    },
-    "extglob": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/extglob/-/extglob-2.0.2.tgz",
-      "integrity": "sha512-I0+eZBH+jFGL8F5BnIz2ON2nKCjTS3AS3H/5PeSmCp7UVC70Ym8IhdRiQly2juKYQ//f7z1aj1BRpQniFJoU1w=="
-    },
-    "extsprintf": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.3.0.tgz",
-      "integrity": "sha1-lpGEQOMEGnpBT4xS48V06zw+HgU="
-    },
-    "fast-deep-equal": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-1.0.0.tgz",
-      "integrity": "sha1-liVqO8l1WV6zbYLpkp0GDYk0Of8="
-    },
-    "fast-levenshtein": {
-      "version": "2.0.6",
-      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
-      "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc="
-    },
-    "fast-memoize": {
-      "version": "2.2.8",
-      "resolved": "https://registry.npmjs.org/fast-memoize/-/fast-memoize-2.2.8.tgz",
-      "integrity": "sha512-3ppTC3fZ9Vwtjslx8DkhSIbI9PH1nM4pobuTHQINOxTxchG8n3SDGZ8L6jbatGJCGLKR+gbkNWKFN4E1iUROSA=="
-    },
-    "fastparse": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.1.tgz",
-      "integrity": "sha1-0eJkOzipTXWDtHkGDmxK/8lAcfg="
-    },
-    "faye-websocket": {
-      "version": "0.10.0",
-      "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz",
-      "integrity": "sha1-TkkvjQTftviQA1B/btvy1QHnxvQ="
-    },
-    "fb-watchman": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/fb-watchman/-/fb-watchman-2.0.0.tgz",
-      "integrity": "sha1-VOmr99+i8mzZsWNsWIwa/AXeXVg="
-    },
-    "fbjs": {
-      "version": "0.8.16",
-      "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.16.tgz",
-      "integrity": "sha1-XmdDL1UNxBtXK/VYR7ispk5TN9s=",
-      "dependencies": {
-        "core-js": {
-          "version": "1.2.7",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
-          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
-        }
-      }
-    },
-    "figures": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/figures/-/figures-2.0.0.tgz",
-      "integrity": "sha1-OrGi0qYsi/tDGgyUy3l6L84nyWI="
-    },
-    "file-loader": {
-      "version": "0.11.1",
-      "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.11.1.tgz",
-      "integrity": "sha1-azKO4SNKcp5OR9Njdd1tNcDh24Q="
-    },
-    "filename-regex": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz",
-      "integrity": "sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY="
-    },
-    "fileset": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/fileset/-/fileset-2.0.3.tgz",
-      "integrity": "sha1-jnVIqW08wjJ+5eZ0FocjozO7oqA="
-    },
-    "filesize": {
-      "version": "3.5.11",
-      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.5.11.tgz",
-      "integrity": "sha512-ZH7loueKBoDb7yG9esn1U+fgq7BzlzW6NRi5/rMdxIZ05dj7GFD/Xc5rq2CDt5Yq86CyfSYVyx4242QQNZbx1g=="
-    },
-    "fill-range": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-4.0.0.tgz",
-      "integrity": "sha1-1USBHUKPmOsGpj3EAtJAPDKMOPc="
-    },
-    "finalhandler": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.0.6.tgz",
-      "integrity": "sha1-AHrqM9Gk0+QgF/YkhIrVjSEvgU8="
-    },
-    "find-cache-dir": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/find-cache-dir/-/find-cache-dir-1.0.0.tgz",
-      "integrity": "sha1-kojj6ePMN0hxfTnq3hfPcfww7m8="
-    },
-    "find-index": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
-      "integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ="
-    },
-    "find-replace": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/find-replace/-/find-replace-1.0.3.tgz",
-      "integrity": "sha1-uI5zZNLZyVlVnziMZmcNYTBEH6A=",
-      "dependencies": {
-        "array-back": {
-          "version": "1.0.4",
-          "resolved": "https://registry.npmjs.org/array-back/-/array-back-1.0.4.tgz",
-          "integrity": "sha1-ZEun8JX3/898Q7Xw3DnTwfA8Bjs="
-        }
-      }
-    },
-    "find-up": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz",
-      "integrity": "sha1-RdG35QbHF93UgndaK3eSCjwMV6c="
-    },
-    "flatten": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz",
-      "integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I="
-    },
-    "follow-redirects": {
-      "version": "1.2.5",
-      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.2.5.tgz",
-      "integrity": "sha512-lMhwQTryFbG+wYsAIEKC1Kf5IGDlVNnONRogIBllh7LLoV7pNIxW0z9fhjRar9NBql+hd2Y49KboVVNxf6GEfg=="
-    },
-    "for-in": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
-      "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA="
-    },
-    "for-own": {
-      "version": "0.1.5",
-      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz",
-      "integrity": "sha1-UmXGgaTylNq78XyVCbZ2OqhFEM4="
-    },
-    "foreach": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/foreach/-/foreach-2.0.5.tgz",
-      "integrity": "sha1-C+4AUBiusmDQo6865ljdATbsG5k="
-    },
-    "forever-agent": {
-      "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
-      "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE="
-    },
-    "form-data": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.3.1.tgz",
-      "integrity": "sha1-b7lPvXGIUwbXPRXMSX/kzE7NRL8="
+    "etag": {
+      "version": "1.8.1",
+      "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz",
+      "integrity": "sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc="
     },
-    "formatio": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.2.0.tgz",
-      "integrity": "sha1-87IWfZBoxGmKjVH092CjmlTYGOs="
+    "event-emitter": {
+      "version": "0.3.5",
+      "resolved": "https://registry.npmjs.org/event-emitter/-/event-emitter-0.3.5.tgz",
+      "integrity": "sha1-34xp7vFkeSPHFXuc6DhAYQsCzDk=",
+      "requires": {
+        "d": "1.0.0",
+        "es5-ext": "0.10.35"
+      }
     },
-    "forwarded": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.2.tgz",
-      "integrity": "sha1-mMI9qxF1ZXuMBXPozszZGw/xjIQ="
+    "eventemitter3": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-1.2.0.tgz",
+      "integrity": "sha1-HIaZHYFq0eUEdQ5zh0Ik7PO+xQg="
     },
-    "fragment-cache": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/fragment-cache/-/fragment-cache-0.2.1.tgz",
-      "integrity": "sha1-QpD60n8T6Jvn8zeZxrxaCr//DRk="
+    "events": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/events/-/events-1.1.1.tgz",
+      "integrity": "sha1-nr23Y1rQmccNzEwqH1AEKI6L2SQ="
     },
-    "fresh": {
-      "version": "0.5.2",
-      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz",
-      "integrity": "sha1-PYyt2Q2XZWn6g1qx+OSyOhBWBac="
+    "eventsource": {
+      "version": "0.1.6",
+      "resolved": "https://registry.npmjs.org/eventsource/-/eventsource-0.1.6.tgz",
+      "integrity": "sha1-Cs7ehJ7X3RzMMsgRuxG5RNTykjI=",
+      "requires": {
+        "original": "1.0.0"
+      }
     },
-    "fs-extra": {
-      "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-4.0.2.tgz",
-      "integrity": "sha1-+RcExT0bRh+JNFKwwwfZmXZHq2s="
+    "evp_bytestokey": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/evp_bytestokey/-/evp_bytestokey-1.0.3.tgz",
+      "integrity": "sha512-/f2Go4TognH/KvCISP7OUsHn85hT9nUkxxA9BEWxFn+Oj9o8ZNLm/40hdlgSLyuOimsrTKLUMEorQexp/aPQeA==",
+      "requires": {
+        "md5.js": "1.3.4",
+        "safe-buffer": "5.1.1"
+      }
     },
-    "fs.realpath": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
-      "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
+    "exec-sh": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/exec-sh/-/exec-sh-0.2.1.tgz",
+      "integrity": "sha512-aLt95pexaugVtQerpmE51+4QfWrNc304uez7jvj6fWnN8GeEHpttB8F36n8N7uVhUMbH/1enbxQ9HImZ4w/9qg==",
+      "requires": {
+        "merge": "1.2.0"
+      }
     },
-    "fsevents": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.2.tgz",
-      "integrity": "sha512-Sn44E5wQW4bTHXvQmvSHwqbuiXtduD6Rrjm2ZtUEGbyrig+nUH3t/QD4M4/ZXViY556TBpRgZkHLDx3JxPwxiw==",
-      "optional": true,
-      "dependencies": {
-        "abbrev": {
-          "version": "1.1.0",
-          "bundled": true,
-          "optional": true
-        },
-        "ajv": {
-          "version": "4.11.8",
-          "bundled": true,
-          "optional": true
-        },
-        "ansi-regex": {
-          "version": "2.1.1",
-          "bundled": true
-        },
-        "aproba": {
-          "version": "1.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "are-we-there-yet": {
-          "version": "1.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "asn1": {
-          "version": "0.2.3",
-          "bundled": true,
-          "optional": true
-        },
-        "assert-plus": {
-          "version": "0.2.0",
-          "bundled": true,
-          "optional": true
-        },
-        "asynckit": {
-          "version": "0.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "aws-sign2": {
-          "version": "0.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "aws4": {
-          "version": "1.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "balanced-match": {
-          "version": "0.4.2",
-          "bundled": true
-        },
-        "bcrypt-pbkdf": {
-          "version": "1.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "block-stream": {
-          "version": "0.0.9",
-          "bundled": true
-        },
-        "boom": {
-          "version": "2.10.1",
-          "bundled": true
-        },
-        "brace-expansion": {
-          "version": "1.1.7",
-          "bundled": true
-        },
-        "buffer-shims": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "caseless": {
-          "version": "0.12.0",
-          "bundled": true,
-          "optional": true
-        },
-        "co": {
-          "version": "4.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "code-point-at": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "combined-stream": {
-          "version": "1.0.5",
-          "bundled": true
-        },
-        "concat-map": {
-          "version": "0.0.1",
-          "bundled": true
-        },
-        "console-control-strings": {
-          "version": "1.1.0",
-          "bundled": true
-        },
-        "core-util-is": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "cryptiles": {
-          "version": "2.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "dashdash": {
-          "version": "1.14.1",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "debug": {
-          "version": "2.6.8",
-          "bundled": true,
-          "optional": true
-        },
-        "deep-extend": {
-          "version": "0.4.2",
-          "bundled": true,
-          "optional": true
-        },
-        "delayed-stream": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "delegates": {
-          "version": "1.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "ecc-jsbn": {
-          "version": "0.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "extend": {
-          "version": "3.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "extsprintf": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "forever-agent": {
-          "version": "0.6.1",
-          "bundled": true,
-          "optional": true
-        },
-        "form-data": {
-          "version": "2.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "fs.realpath": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "fstream": {
-          "version": "1.0.11",
-          "bundled": true
-        },
-        "fstream-ignore": {
-          "version": "1.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "gauge": {
-          "version": "2.7.4",
-          "bundled": true,
-          "optional": true
-        },
-        "getpass": {
-          "version": "0.1.7",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "glob": {
-          "version": "7.1.2",
-          "bundled": true
-        },
-        "graceful-fs": {
-          "version": "4.1.11",
-          "bundled": true
-        },
-        "har-schema": {
-          "version": "1.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "har-validator": {
-          "version": "4.2.1",
-          "bundled": true,
-          "optional": true
-        },
-        "has-unicode": {
-          "version": "2.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "hawk": {
-          "version": "3.1.3",
-          "bundled": true,
-          "optional": true
-        },
-        "hoek": {
-          "version": "2.16.3",
-          "bundled": true
-        },
-        "http-signature": {
-          "version": "1.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "inflight": {
-          "version": "1.0.6",
-          "bundled": true
-        },
-        "inherits": {
-          "version": "2.0.3",
-          "bundled": true
-        },
-        "ini": {
-          "version": "1.3.4",
-          "bundled": true,
-          "optional": true
-        },
-        "is-fullwidth-code-point": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "is-typedarray": {
-          "version": "1.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "isarray": {
-          "version": "1.0.0",
-          "bundled": true
-        },
-        "isstream": {
-          "version": "0.1.2",
-          "bundled": true,
-          "optional": true
-        },
-        "jodid25519": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "jsbn": {
-          "version": "0.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "json-schema": {
-          "version": "0.2.3",
-          "bundled": true,
-          "optional": true
-        },
-        "json-stable-stringify": {
-          "version": "1.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "json-stringify-safe": {
-          "version": "5.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "jsonify": {
-          "version": "0.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "jsprim": {
-          "version": "1.4.0",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "mime-db": {
-          "version": "1.27.0",
-          "bundled": true
-        },
-        "mime-types": {
-          "version": "2.1.15",
-          "bundled": true
-        },
-        "minimatch": {
-          "version": "3.0.4",
-          "bundled": true
-        },
-        "minimist": {
-          "version": "0.0.8",
-          "bundled": true
-        },
-        "mkdirp": {
-          "version": "0.5.1",
-          "bundled": true
-        },
-        "ms": {
-          "version": "2.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "node-pre-gyp": {
-          "version": "0.6.36",
-          "bundled": true,
-          "optional": true
-        },
-        "nopt": {
-          "version": "4.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "npmlog": {
-          "version": "4.1.0",
-          "bundled": true,
-          "optional": true
-        },
-        "number-is-nan": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "oauth-sign": {
-          "version": "0.8.2",
-          "bundled": true,
-          "optional": true
-        },
-        "object-assign": {
-          "version": "4.1.1",
-          "bundled": true,
-          "optional": true
-        },
-        "once": {
-          "version": "1.4.0",
-          "bundled": true
-        },
-        "os-homedir": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "os-tmpdir": {
-          "version": "1.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "osenv": {
-          "version": "0.1.4",
-          "bundled": true,
-          "optional": true
-        },
-        "path-is-absolute": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "performance-now": {
-          "version": "0.2.0",
-          "bundled": true,
-          "optional": true
-        },
-        "process-nextick-args": {
-          "version": "1.0.7",
-          "bundled": true
-        },
-        "punycode": {
-          "version": "1.4.1",
-          "bundled": true,
-          "optional": true
-        },
-        "qs": {
-          "version": "6.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "rc": {
-          "version": "1.2.1",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "minimist": {
-              "version": "1.2.0",
-              "bundled": true,
-              "optional": true
-            }
-          }
-        },
-        "readable-stream": {
-          "version": "2.2.9",
-          "bundled": true
-        },
-        "request": {
-          "version": "2.81.0",
-          "bundled": true,
-          "optional": true
-        },
-        "rimraf": {
-          "version": "2.6.1",
-          "bundled": true
-        },
-        "safe-buffer": {
-          "version": "5.0.1",
-          "bundled": true
-        },
-        "semver": {
-          "version": "5.3.0",
-          "bundled": true,
-          "optional": true
-        },
-        "set-blocking": {
-          "version": "2.0.0",
-          "bundled": true,
-          "optional": true
-        },
-        "signal-exit": {
-          "version": "3.0.2",
-          "bundled": true,
-          "optional": true
-        },
-        "sntp": {
-          "version": "1.0.9",
-          "bundled": true,
-          "optional": true
-        },
-        "sshpk": {
-          "version": "1.13.0",
-          "bundled": true,
-          "optional": true,
-          "dependencies": {
-            "assert-plus": {
-              "version": "1.0.0",
-              "bundled": true,
-              "optional": true
-            }
+    "execa": {
+      "version": "0.7.0",
+      "resolved": "https://registry.npmjs.org/execa/-/execa-0.7.0.tgz",
+      "integrity": "sha1-lEvs00zEHuMqY6n68nrVpl/Fl3c=",
+      "requires": {
+        "cross-spawn": "5.1.0",
+        "get-stream": "3.0.0",
+        "is-stream": "1.1.0",
+        "npm-run-path": "2.0.2",
+        "p-finally": "1.0.0",
+        "signal-exit": "3.0.2",
+        "strip-eof": "1.0.0"
+      }
+    },
+    "exenv": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/exenv/-/exenv-1.2.2.tgz",
+      "integrity": "sha1-KueOhdmJQVhnCwPUe+wfA72Ru50="
+    },
+    "expand-brackets": {
+      "version": "2.1.4",
+      "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-2.1.4.tgz",
+      "integrity": "sha1-t3c14xXOMPa27/D4OwQVGiJEliI=",
+      "requires": {
+        "debug": "2.6.9",
+        "define-property": "0.2.5",
+        "extend-shallow": "2.0.1",
+        "posix-character-classes": "0.1.1",
+        "regex-not": "1.0.0",
+        "snapdragon": "0.8.1",
+        "to-regex": "3.0.1"
+      },
+      "dependencies": {
+        "define-property": {
+          "version": "0.2.5",
+          "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
+          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY=",
+          "requires": {
+            "is-descriptor": "0.1.6"
           }
         },
-        "string_decoder": {
-          "version": "1.0.1",
-          "bundled": true
-        },
-        "string-width": {
-          "version": "1.0.2",
-          "bundled": true
-        },
-        "stringstream": {
-          "version": "0.0.5",
-          "bundled": true,
-          "optional": true
-        },
-        "strip-ansi": {
-          "version": "3.0.1",
-          "bundled": true
-        },
-        "strip-json-comments": {
-          "version": "2.0.1",
-          "bundled": true,
-          "optional": true
-        },
-        "tar": {
-          "version": "2.2.1",
-          "bundled": true
-        },
-        "tar-pack": {
-          "version": "3.4.0",
-          "bundled": true,
-          "optional": true
-        },
-        "tough-cookie": {
-          "version": "2.3.2",
-          "bundled": true,
-          "optional": true
-        },
-        "tunnel-agent": {
-          "version": "0.6.0",
-          "bundled": true,
-          "optional": true
-        },
-        "tweetnacl": {
-          "version": "0.14.5",
-          "bundled": true,
-          "optional": true
-        },
-        "uid-number": {
-          "version": "0.0.6",
-          "bundled": true,
-          "optional": true
-        },
-        "util-deprecate": {
-          "version": "1.0.2",
-          "bundled": true
+        "is-descriptor": {
+          "version": "0.1.6",
+          "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
+          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg==",
+          "requires": {
+            "is-accessor-descriptor": "0.1.6",
+            "is-data-descriptor": "0.1.4",
+            "kind-of": "5.1.0"
+          }
         },
-        "uuid": {
-          "version": "3.0.1",
-          "bundled": true,
-          "optional": true
+        "kind-of": {
+          "version": "5.1.0",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
+          "integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw=="
+        }
+      }
+    },
+    "expand-range": {
+      "version": "1.8.2",
+      "resolved": "https://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz",
+      "integrity": "sha1-opnv/TNf4nIeuujiV+x5ZE/IUzc=",
+      "requires": {
+        "fill-range": "2.2.3"
+      },
+      "dependencies": {
+        "fill-range": {
+          "version": "2.2.3",
+          "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-2.2.3.tgz",
+          "integrity": "sha1-ULd9/X5Gm8dJJHCWNpn+eoSFpyM=",
+          "requires": {
+            "is-number": "2.1.0",
+            "isobject": "2.1.0",
+            "randomatic": "1.1.7",
+            "repeat-element": "1.1.2",
+            "repeat-string": "1.6.1"
+          }
         },
-        "verror": {
-          "version": "1.3.6",
-          "bundled": true,
-          "optional": true
+        "is-number": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz",
+          "integrity": "sha1-Afy7s5NGOlSPL0ZszhbezknbkI8=",
+          "requires": {
+            "kind-of": "3.2.2"
+          }
         },
-        "wide-align": {
-          "version": "1.1.2",
-          "bundled": true,
-          "optional": true
+        "isobject": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
+          "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk=",
+          "requires": {
+            "isarray": "1.0.0"
+          }
         },
-        "wrappy": {
-          "version": "1.0.2",
-          "bundled": true
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+          "requires": {
+            "is-buffer": "1.1.6"
+          }
+        }
+      }
+    },
+    "expect": {
+      "version": "21.2.1",
+      "resolved": "https://registry.npmjs.org/expect/-/expect-21.2.1.tgz",
+      "integrity": "sha512-orfQQqFRTX0jH7znRIGi8ZMR8kTNpXklTTz8+HGTpmTKZo3Occ6JNB5FXMb8cRuiiC/GyDqsr30zUa66ACYlYw==",
+      "requires": {
+        "ansi-styles": "3.2.0",
+        "jest-diff": "21.2.1",
+        "jest-get-type": "21.2.0",
+        "jest-matcher-utils": "21.2.1",
+        "jest-message-util": "21.2.1",
+        "jest-regex-util": "21.2.0"
+      }
+    },
+    "express": {
+      "version": "4.16.2",
+      "resolved": "https://registry.npmjs.org/express/-/express-4.16.2.tgz",
+      "integrity": "sha1-41xt/i1kt9ygpc1PIXgb4ymeB2w=",
+      "requires": {
+        "accepts": "1.3.4",
+        "array-flatten": "1.1.1",
+        "body-parser": "1.18.2",
+        "content-disposition": "0.5.2",
+        "content-type": "1.0.4",
+        "cookie": "0.3.1",
+        "cookie-signature": "1.0.6",
+        "debug": "2.6.9",
+        "depd": "1.1.1",
+        "encodeurl": "1.0.1",
+        "escape-html": "1.0.3",
+        "etag": "1.8.1",
+        "finalhandler": "1.1.0",
+        "fresh": "0.5.2",
+        "merge-descriptors": "1.0.1",
+        "methods": "1.1.2",
+        "on-finished": "2.3.0",
+        "parseurl": "1.3.2",
+        "path-to-regexp": "0.1.7",
+        "proxy-addr": "2.0.2",
+        "qs": "6.5.1",
+        "range-parser": "1.2.0",
+        "safe-buffer": "5.1.1",
+        "send": "0.16.1",
+        "serve-static": "1.13.1",
+        "setprototypeof": "1.1.0",
+        "statuses": "1.3.1",
+        "type-is": "1.6.15",
+        "utils-merge": "1.0.1",
+        "vary": "1.1.2"
+      },
+      "dependencies": {
+        "path-to-regexp": {
+          "version": "0.1.7",
+          "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
+          "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
+        }
+      }
+    },
+    "extend": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.1.tgz",
+      "integrity": "sha1-p1Xqe8Gt/MWjHOfnYtuq3F5jZEQ="
+    },
+    "extend-shallow": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+      "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
+      "requires": {
+        "is-extendable": "0.1.1"
+      }
+    },
+    "external-editor": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/external-editor/-/external-editor-2.0.5.tgz",
+      "integrity": "sha512-Msjo64WT5W+NhOpQXh0nOHm+n0RfU1QUwDnKYvJ8dEJ8zlwLrqXNTv5mSUTJpepf41PDJGyhueTw2vNZW+Fr/w==",
+      "requires": {
+        "iconv-lite": "0.4.19",
+        "jschardet": "1.6.0",
+        "tmp": "0.0.33"
+      }
+    },
+    "extglob": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/extglob/-/extglob-2.0.2.tgz",
+      "integrity": "sha512-I0+eZBH+jFGL8F5BnIz2ON2nKCjTS3AS3H/5PeSmCp7UVC70Ym8IhdRiQly2juKYQ//f7z1aj1BRpQniFJoU1w==",
+      "requires": {
+        "array-unique": "0.3.2",
+        "define-property": "1.0.0",
+        "expand-brackets": "2.1.4",
+        "extend-shallow": "2.0.1",
+        "fragment-cache": "0.2.1",
+        "regex-not": "1.0.0",
+        "snapdragon": "0.8.1",
+        "to-regex": "3.0.1"
+      }
+    },
+    "extsprintf": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.3.0.tgz",
+      "integrity": "sha1-lpGEQOMEGnpBT4xS48V06zw+HgU="
+    },
+    "fast-deep-equal": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-1.0.0.tgz",
+      "integrity": "sha1-liVqO8l1WV6zbYLpkp0GDYk0Of8="
+    },
+    "fast-json-stable-stringify": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.0.0.tgz",
+      "integrity": "sha1-1RQsDK7msRifh9OnYREGT4bIu/I="
+    },
+    "fast-levenshtein": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
+      "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc="
+    },
+    "fast-memoize": {
+      "version": "2.2.8",
+      "resolved": "https://registry.npmjs.org/fast-memoize/-/fast-memoize-2.2.8.tgz",
+      "integrity": "sha512-3ppTC3fZ9Vwtjslx8DkhSIbI9PH1nM4pobuTHQINOxTxchG8n3SDGZ8L6jbatGJCGLKR+gbkNWKFN4E1iUROSA=="
+    },
+    "fastparse": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.1.tgz",
+      "integrity": "sha1-0eJkOzipTXWDtHkGDmxK/8lAcfg="
+    },
+    "faye-websocket": {
+      "version": "0.10.0",
+      "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz",
+      "integrity": "sha1-TkkvjQTftviQA1B/btvy1QHnxvQ=",
+      "requires": {
+        "websocket-driver": "0.7.0"
+      }
+    },
+    "fb-watchman": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/fb-watchman/-/fb-watchman-2.0.0.tgz",
+      "integrity": "sha1-VOmr99+i8mzZsWNsWIwa/AXeXVg=",
+      "requires": {
+        "bser": "2.0.0"
+      }
+    },
+    "fbjs": {
+      "version": "0.8.16",
+      "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.16.tgz",
+      "integrity": "sha1-XmdDL1UNxBtXK/VYR7ispk5TN9s=",
+      "requires": {
+        "core-js": "1.2.7",
+        "isomorphic-fetch": "2.2.1",
+        "loose-envify": "1.3.1",
+        "object-assign": "4.1.1",
+        "promise": "7.3.1",
+        "setimmediate": "1.0.5",
+        "ua-parser-js": "0.7.17"
+      },
+      "dependencies": {
+        "core-js": {
+          "version": "1.2.7",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz",
+          "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY="
+        }
+      }
+    },
+    "figures": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/figures/-/figures-2.0.0.tgz",
+      "integrity": "sha1-OrGi0qYsi/tDGgyUy3l6L84nyWI=",
+      "requires": {
+        "escape-string-regexp": "1.0.5"
+      }
+    },
+    "file-loader": {
+      "version": "0.11.1",
+      "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.11.1.tgz",
+      "integrity": "sha1-azKO4SNKcp5OR9Njdd1tNcDh24Q=",
+      "requires": {
+        "loader-utils": "1.1.0"
+      }
+    },
+    "filename-regex": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/filename-regex/-/filename-regex-2.0.1.tgz",
+      "integrity": "sha1-wcS5vuPglyXdsQa3XB4wH+LxiyY="
+    },
+    "fileset": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/fileset/-/fileset-2.0.3.tgz",
+      "integrity": "sha1-jnVIqW08wjJ+5eZ0FocjozO7oqA=",
+      "requires": {
+        "glob": "7.1.2",
+        "minimatch": "3.0.4"
+      }
+    },
+    "filesize": {
+      "version": "3.5.11",
+      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.5.11.tgz",
+      "integrity": "sha512-ZH7loueKBoDb7yG9esn1U+fgq7BzlzW6NRi5/rMdxIZ05dj7GFD/Xc5rq2CDt5Yq86CyfSYVyx4242QQNZbx1g=="
+    },
+    "fill-range": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-4.0.0.tgz",
+      "integrity": "sha1-1USBHUKPmOsGpj3EAtJAPDKMOPc=",
+      "requires": {
+        "extend-shallow": "2.0.1",
+        "is-number": "3.0.0",
+        "repeat-string": "1.6.1",
+        "to-regex-range": "2.1.1"
+      }
+    },
+    "finalhandler": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.0.tgz",
+      "integrity": "sha1-zgtoVbRYU+eRsvzGgARtiCU91/U=",
+      "requires": {
+        "debug": "2.6.9",
+        "encodeurl": "1.0.1",
+        "escape-html": "1.0.3",
+        "on-finished": "2.3.0",
+        "parseurl": "1.3.2",
+        "statuses": "1.3.1",
+        "unpipe": "1.0.0"
+      }
+    },
+    "find-cache-dir": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/find-cache-dir/-/find-cache-dir-1.0.0.tgz",
+      "integrity": "sha1-kojj6ePMN0hxfTnq3hfPcfww7m8=",
+      "requires": {
+        "commondir": "1.0.1",
+        "make-dir": "1.1.0",
+        "pkg-dir": "2.0.0"
+      }
+    },
+    "find-index": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/find-index/-/find-index-0.1.1.tgz",
+      "integrity": "sha1-Z101iyyjiS15Whq0cjL4tuLg3eQ="
+    },
+    "find-replace": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/find-replace/-/find-replace-1.0.3.tgz",
+      "integrity": "sha1-uI5zZNLZyVlVnziMZmcNYTBEH6A=",
+      "requires": {
+        "array-back": "1.0.4",
+        "test-value": "2.1.0"
+      },
+      "dependencies": {
+        "array-back": {
+          "version": "1.0.4",
+          "resolved": "https://registry.npmjs.org/array-back/-/array-back-1.0.4.tgz",
+          "integrity": "sha1-ZEun8JX3/898Q7Xw3DnTwfA8Bjs=",
+          "requires": {
+            "typical": "2.6.1"
+          }
         }
       }
     },
+    "find-up": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz",
+      "integrity": "sha1-RdG35QbHF93UgndaK3eSCjwMV6c=",
+      "requires": {
+        "locate-path": "2.0.0"
+      }
+    },
+    "flatten": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz",
+      "integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I="
+    },
+    "follow-redirects": {
+      "version": "1.2.5",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.2.5.tgz",
+      "integrity": "sha512-lMhwQTryFbG+wYsAIEKC1Kf5IGDlVNnONRogIBllh7LLoV7pNIxW0z9fhjRar9NBql+hd2Y49KboVVNxf6GEfg==",
+      "requires": {
+        "debug": "2.6.9"
+      }
+    },
+    "for-in": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
+      "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA="
+    },
+    "for-own": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/for-own/-/for-own-0.1.5.tgz",
+      "integrity": "sha1-UmXGgaTylNq78XyVCbZ2OqhFEM4=",
+      "requires": {
+        "for-in": "1.0.2"
+      }
+    },
+    "foreach": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/foreach/-/foreach-2.0.5.tgz",
+      "integrity": "sha1-C+4AUBiusmDQo6865ljdATbsG5k="
+    },
+    "forever-agent": {
+      "version": "0.6.1",
+      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
+      "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE="
+    },
+    "form-data": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.3.1.tgz",
+      "integrity": "sha1-b7lPvXGIUwbXPRXMSX/kzE7NRL8=",
+      "requires": {
+        "asynckit": "0.4.0",
+        "combined-stream": "1.0.5",
+        "mime-types": "2.1.17"
+      }
+    },
+    "formatio": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.2.0.tgz",
+      "integrity": "sha1-87IWfZBoxGmKjVH092CjmlTYGOs=",
+      "requires": {
+        "samsam": "1.3.0"
+      }
+    },
+    "forwarded": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.2.tgz",
+      "integrity": "sha1-mMI9qxF1ZXuMBXPozszZGw/xjIQ="
+    },
+    "fragment-cache": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/fragment-cache/-/fragment-cache-0.2.1.tgz",
+      "integrity": "sha1-QpD60n8T6Jvn8zeZxrxaCr//DRk=",
+      "requires": {
+        "map-cache": "0.2.2"
+      }
+    },
+    "fresh": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz",
+      "integrity": "sha1-PYyt2Q2XZWn6g1qx+OSyOhBWBac="
+    },
+    "fs-extra": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-4.0.2.tgz",
+      "integrity": "sha1-+RcExT0bRh+JNFKwwwfZmXZHq2s=",
+      "requires": {
+        "graceful-fs": "4.1.11",
+        "jsonfile": "4.0.0",
+        "universalify": "0.1.1"
+      }
+    },
+    "fs.realpath": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
+      "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
+    },
     "fstream": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
-      "integrity": "sha1-XB+x8RdHcRTwYyoOtLcbPLD9MXE="
+      "integrity": "sha1-XB+x8RdHcRTwYyoOtLcbPLD9MXE=",
+      "requires": {
+        "graceful-fs": "4.1.11",
+        "inherits": "2.0.3",
+        "mkdirp": "0.5.1",
+        "rimraf": "2.6.2"
+      }
     },
     "function-bind": {
       "version": "1.1.1",
@@ -5763,7 +5030,12 @@
     "function.prototype.name": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.0.3.tgz",
-      "integrity": "sha512-5EblxZUdioXi2JiMZ9FUbwYj40eQ9MFHyzFLBSPdlRl3SO8l7SLWuAnQ/at/1Wi4hjJwME/C5WpF2ZfAc8nGNw=="
+      "integrity": "sha512-5EblxZUdioXi2JiMZ9FUbwYj40eQ9MFHyzFLBSPdlRl3SO8l7SLWuAnQ/at/1Wi4hjJwME/C5WpF2ZfAc8nGNw==",
+      "requires": {
+        "define-properties": "1.1.2",
+        "function-bind": "1.1.1",
+        "is-callable": "1.1.3"
+      }
     },
     "fuse.js": {
       "version": "3.2.0",
@@ -5774,23 +5046,44 @@
       "version": "2.7.4",
       "resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz",
       "integrity": "sha1-LANAXHU4w51+s3sxcCLjJfsBi/c=",
+      "requires": {
+        "aproba": "1.2.0",
+        "console-control-strings": "1.1.0",
+        "has-unicode": "2.0.1",
+        "object-assign": "4.1.1",
+        "signal-exit": "3.0.2",
+        "string-width": "1.0.2",
+        "strip-ansi": "3.0.1",
+        "wide-align": "1.1.2"
+      },
       "dependencies": {
         "is-fullwidth-code-point": {
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
-          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
+          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
+          "requires": {
+            "number-is-nan": "1.0.1"
+          }
         },
         "string-width": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
-          "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
+          "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
+          "requires": {
+            "code-point-at": "1.1.0",
+            "is-fullwidth-code-point": "1.0.0",
+            "strip-ansi": "3.0.1"
+          }
         }
       }
     },
     "gaze": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/gaze/-/gaze-1.1.2.tgz",
-      "integrity": "sha1-hHIkZ3rbiHDWeSV+0ziP22HkAQU="
+      "integrity": "sha1-hHIkZ3rbiHDWeSV+0ziP22HkAQU=",
+      "requires": {
+        "globule": "1.2.0"
+      }
     },
     "generate-function": {
       "version": "2.0.0",
@@ -5800,17 +5093,29 @@
     "generate-object-property": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/generate-object-property/-/generate-object-property-1.2.0.tgz",
-      "integrity": "sha1-nA4cQDCM6AT0eDYYuTf6iPmdUNA="
+      "integrity": "sha1-nA4cQDCM6AT0eDYYuTf6iPmdUNA=",
+      "requires": {
+        "is-property": "1.0.2"
+      }
     },
     "generic-names": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/generic-names/-/generic-names-1.0.2.tgz",
-      "integrity": "sha1-4lt/7OtbWo8o9flyp8z+V+Virc0=",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/generic-names/-/generic-names-1.0.3.tgz",
+      "integrity": "sha1-LXhqEhruUIh2eWk56OO/+DbCCRc=",
+      "requires": {
+        "loader-utils": "0.2.17"
+      },
       "dependencies": {
         "loader-utils": {
           "version": "0.2.17",
           "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz",
-          "integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g="
+          "integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g=",
+          "requires": {
+            "big.js": "3.2.0",
+            "emojis-list": "2.1.0",
+            "json5": "0.5.1",
+            "object-assign": "4.1.1"
+          }
         }
       }
     },
@@ -5842,17 +5147,30 @@
     "getpass": {
       "version": "0.1.7",
       "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
-      "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo="
+      "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo=",
+      "requires": {
+        "assert-plus": "1.0.0"
+      }
     },
     "github": {
       "version": "7.3.2",
       "resolved": "https://registry.npmjs.org/github/-/github-7.3.2.tgz",
       "integrity": "sha1-/hDN5pZDUsXZHhGnYW0m1f+2+Hs=",
+      "requires": {
+        "follow-redirects": "0.0.7",
+        "https-proxy-agent": "1.0.0",
+        "mime": "1.4.1",
+        "netrc": "0.1.4"
+      },
       "dependencies": {
         "follow-redirects": {
           "version": "0.0.7",
           "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-0.0.7.tgz",
-          "integrity": "sha1-NLkLqyqRGqNHVx2pDyK9NuzYqRk="
+          "integrity": "sha1-NLkLqyqRGqNHVx2pDyK9NuzYqRk=",
+          "requires": {
+            "debug": "2.6.9",
+            "stream-consume": "0.1.0"
+          }
         }
       }
     },
@@ -5860,53 +5178,100 @@
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/github-build/-/github-build-1.2.0.tgz",
       "integrity": "sha512-Iq7NialLYz5yRZDkiX8zaOWd+N3BssJJfUvG7wd8r4MeLCN88SdxEYo2esseMLpLtP4vNXhgamg1eRm7hw59qw==",
+      "requires": {
+        "axios": "0.15.3"
+      },
       "dependencies": {
         "axios": {
           "version": "0.15.3",
           "resolved": "https://registry.npmjs.org/axios/-/axios-0.15.3.tgz",
-          "integrity": "sha1-LJ1jiy4ZGgjqHWzJiOrda6W9wFM="
+          "integrity": "sha1-LJ1jiy4ZGgjqHWzJiOrda6W9wFM=",
+          "requires": {
+            "follow-redirects": "1.0.0"
+          }
         },
         "follow-redirects": {
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.0.0.tgz",
-          "integrity": "sha1-jjQpjL0uF28lTv/sdaHHjMhJ/Tc="
+          "integrity": "sha1-jjQpjL0uF28lTv/sdaHHjMhJ/Tc=",
+          "requires": {
+            "debug": "2.6.9"
+          }
         }
       }
     },
     "glamor": {
       "version": "2.20.40",
       "resolved": "https://registry.npmjs.org/glamor/-/glamor-2.20.40.tgz",
-      "integrity": "sha512-DNXCd+c14N9QF8aAKrfl4xakPk5FdcFwmH7sD0qnC0Pr7xoZ5W9yovhUrY/dJc3psfGGXC58vqQyRtuskyUJxA=="
+      "integrity": "sha512-DNXCd+c14N9QF8aAKrfl4xakPk5FdcFwmH7sD0qnC0Pr7xoZ5W9yovhUrY/dJc3psfGGXC58vqQyRtuskyUJxA==",
+      "requires": {
+        "fbjs": "0.8.16",
+        "inline-style-prefixer": "3.0.8",
+        "object-assign": "4.1.1",
+        "prop-types": "15.6.0",
+        "through": "2.3.8"
+      }
     },
     "glamorous": {
-      "version": "4.9.7",
-      "resolved": "https://registry.npmjs.org/glamorous/-/glamorous-4.9.7.tgz",
-      "integrity": "sha512-4Ts/k1fCvRez1k6xYIuXQqFmVG1RjbpQZOHNCWSteY1Tza4YeyExkj4SypAhCspcAzkjvqaUboaLmSfMmx9uLQ=="
+      "version": "4.11.0",
+      "resolved": "https://registry.npmjs.org/glamorous/-/glamorous-4.11.0.tgz",
+      "integrity": "sha512-qWRmq5HZ6kGnp09/z3I0L5ZWZF8PX9W90ED8Ndm3ccfaamWRcEURYilk3zA1M1VW1xJlV28+aD2XlwbQF5YlSw==",
+      "requires": {
+        "brcast": "3.0.1",
+        "fast-memoize": "2.2.8",
+        "html-tag-names": "1.1.2",
+        "is-function": "1.0.1",
+        "is-plain-object": "2.0.4",
+        "react-html-attributes": "1.4.1",
+        "svg-tag-names": "1.1.1"
+      }
     },
     "glob": {
       "version": "7.1.2",
       "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
-      "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ=="
+      "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ==",
+      "requires": {
+        "fs.realpath": "1.0.0",
+        "inflight": "1.0.6",
+        "inherits": "2.0.3",
+        "minimatch": "3.0.4",
+        "once": "1.4.0",
+        "path-is-absolute": "1.0.1"
+      }
     },
     "glob-base": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz",
-      "integrity": "sha1-27Fk9iIbHAscz4Kuoyi0l98Oo8Q="
+      "integrity": "sha1-27Fk9iIbHAscz4Kuoyi0l98Oo8Q=",
+      "requires": {
+        "glob-parent": "2.0.0",
+        "is-glob": "2.0.1"
+      }
     },
     "glob-parent": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-2.0.0.tgz",
-      "integrity": "sha1-gTg9ctsFT8zPUzbaqQLxgvbtuyg="
+      "integrity": "sha1-gTg9ctsFT8zPUzbaqQLxgvbtuyg=",
+      "requires": {
+        "is-glob": "2.0.1"
+      }
     },
     "glob2base": {
       "version": "0.0.12",
       "resolved": "https://registry.npmjs.org/glob2base/-/glob2base-0.0.12.tgz",
-      "integrity": "sha1-nUGbPijxLoOjYhZKJ3BVkiycDVY="
+      "integrity": "sha1-nUGbPijxLoOjYhZKJ3BVkiycDVY=",
+      "requires": {
+        "find-index": "0.1.1"
+      }
     },
     "global": {
       "version": "4.3.2",
       "resolved": "https://registry.npmjs.org/global/-/global-4.3.2.tgz",
       "integrity": "sha1-52mJJopsdMOJCLEwWxD8DjlOnQ8=",
+      "requires": {
+        "min-document": "2.19.0",
+        "process": "0.5.2"
+      },
       "dependencies": {
         "process": {
           "version": "0.5.2",
@@ -5924,6 +5289,13 @@
       "version": "6.1.0",
       "resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
       "integrity": "sha1-9abXDoOV4hyFj7BInWTfAkJNUGw=",
+      "requires": {
+        "array-union": "1.0.2",
+        "glob": "7.1.2",
+        "object-assign": "4.1.1",
+        "pify": "2.3.0",
+        "pinkie-promise": "2.0.1"
+      },
       "dependencies": {
         "pify": {
           "version": "2.3.0",
@@ -5935,7 +5307,12 @@
     "globule": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/globule/-/globule-1.2.0.tgz",
-      "integrity": "sha1-HcScaCLdnoovoAuiopUAboZkvQk="
+      "integrity": "sha1-HcScaCLdnoovoAuiopUAboZkvQk=",
+      "requires": {
+        "glob": "7.1.2",
+        "lodash": "4.17.4",
+        "minimatch": "3.0.4"
+      }
     },
     "graceful-fs": {
       "version": "4.1.11",
@@ -5960,7 +5337,10 @@
     "gzip-size": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-3.0.0.tgz",
-      "integrity": "sha1-VGGI6b3DN/Zzdy+BZgRks4nc5SA="
+      "integrity": "sha1-VGGI6b3DN/Zzdy+BZgRks4nc5SA=",
+      "requires": {
+        "duplexer": "0.1.1"
+      }
     },
     "handle-thing": {
       "version": "1.2.5",
@@ -5971,6 +5351,12 @@
       "version": "4.0.11",
       "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.0.11.tgz",
       "integrity": "sha1-Ywo13+ApS8KB7a5v/F0yn8eYLcw=",
+      "requires": {
+        "async": "1.5.2",
+        "optimist": "0.6.1",
+        "source-map": "0.4.4",
+        "uglify-js": "2.8.29"
+      },
       "dependencies": {
         "async": {
           "version": "1.5.2",
@@ -5980,7 +5366,10 @@
         "source-map": {
           "version": "0.4.4",
           "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
-          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s="
+          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s=",
+          "requires": {
+            "amdefine": "1.0.1"
+          }
         }
       }
     },
@@ -5992,17 +5381,27 @@
     "har-validator": {
       "version": "5.0.3",
       "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-5.0.3.tgz",
-      "integrity": "sha1-ukAsJmGU8VlW7xXg/PJCmT9qff0="
+      "integrity": "sha1-ukAsJmGU8VlW7xXg/PJCmT9qff0=",
+      "requires": {
+        "ajv": "5.3.0",
+        "har-schema": "2.0.0"
+      }
     },
     "has": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/has/-/has-1.0.1.tgz",
-      "integrity": "sha1-hGFzP1OLCDfJNh45qauelwTcLyg="
+      "integrity": "sha1-hGFzP1OLCDfJNh45qauelwTcLyg=",
+      "requires": {
+        "function-bind": "1.1.1"
+      }
     },
     "has-ansi": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz",
-      "integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE="
+      "integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE=",
+      "requires": {
+        "ansi-regex": "2.1.1"
+      }
     },
     "has-flag": {
       "version": "2.0.0",
@@ -6017,34 +5416,59 @@
     "has-value": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/has-value/-/has-value-1.0.0.tgz",
-      "integrity": "sha1-GLKB2lhbHFxR3vJMkw7SmgvmsXc="
+      "integrity": "sha1-GLKB2lhbHFxR3vJMkw7SmgvmsXc=",
+      "requires": {
+        "get-value": "2.0.6",
+        "has-values": "1.0.0",
+        "isobject": "3.0.1"
+      }
     },
     "has-values": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/has-values/-/has-values-1.0.0.tgz",
       "integrity": "sha1-lbC2P+whRmGab+V/51Yo1aOe/k8=",
+      "requires": {
+        "is-number": "3.0.0",
+        "kind-of": "4.0.0"
+      },
       "dependencies": {
         "kind-of": {
           "version": "4.0.0",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-4.0.0.tgz",
-          "integrity": "sha1-IIE989cSkosgc3hpGkUGb65y3Vc="
+          "integrity": "sha1-IIE989cSkosgc3hpGkUGb65y3Vc=",
+          "requires": {
+            "is-buffer": "1.1.6"
+          }
         }
       }
     },
     "hash-base": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/hash-base/-/hash-base-2.0.2.tgz",
-      "integrity": "sha1-ZuodhW206KVHDK32/OI65SRO8uE="
+      "integrity": "sha1-ZuodhW206KVHDK32/OI65SRO8uE=",
+      "requires": {
+        "inherits": "2.0.3"
+      }
     },
     "hash.js": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/hash.js/-/hash.js-1.1.3.tgz",
-      "integrity": "sha512-/UETyP0W22QILqS+6HowevwhEFJ3MBJnwTf75Qob9Wz9t0DPuisL8kW8YZMK62dHAKE1c1p+gY1TtOLY+USEHA=="
+      "integrity": "sha512-/UETyP0W22QILqS+6HowevwhEFJ3MBJnwTf75Qob9Wz9t0DPuisL8kW8YZMK62dHAKE1c1p+gY1TtOLY+USEHA==",
+      "requires": {
+        "inherits": "2.0.3",
+        "minimalistic-assert": "1.0.0"
+      }
     },
     "hawk": {
       "version": "6.0.2",
       "resolved": "https://registry.npmjs.org/hawk/-/hawk-6.0.2.tgz",
-      "integrity": "sha512-miowhl2+U7Qle4vdLqDdPt9m09K6yZhkLDTWGoUiUzrQCn+mHHSmfJgAyGaLRZbPmTqfFFjRV1QWCW0VWUJBbQ=="
+      "integrity": "sha512-miowhl2+U7Qle4vdLqDdPt9m09K6yZhkLDTWGoUiUzrQCn+mHHSmfJgAyGaLRZbPmTqfFFjRV1QWCW0VWUJBbQ==",
+      "requires": {
+        "boom": "4.3.1",
+        "cryptiles": "3.1.2",
+        "hoek": "4.2.0",
+        "sntp": "2.1.0"
+      }
     },
     "highlight.js": {
       "version": "9.12.0",
@@ -6054,7 +5478,12 @@
     "hmac-drbg": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz",
-      "integrity": "sha1-0nRXAQJabHdabFRXk+1QL8DGSaE="
+      "integrity": "sha1-0nRXAQJabHdabFRXk+1QL8DGSaE=",
+      "requires": {
+        "hash.js": "1.1.3",
+        "minimalistic-assert": "1.0.0",
+        "minimalistic-crypto-utils": "1.0.1"
+      }
     },
     "hoek": {
       "version": "4.2.0",
@@ -6069,7 +5498,11 @@
     "home-or-tmp": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/home-or-tmp/-/home-or-tmp-2.0.0.tgz",
-      "integrity": "sha1-42w/LSyufXRqhX440Y1fMqeILbg="
+      "integrity": "sha1-42w/LSyufXRqhX440Y1fMqeILbg=",
+      "requires": {
+        "os-homedir": "1.0.2",
+        "os-tmpdir": "1.0.2"
+      }
     },
     "hosted-git-info": {
       "version": "2.5.0",
@@ -6079,7 +5512,13 @@
     "hpack.js": {
       "version": "2.1.6",
       "resolved": "https://registry.npmjs.org/hpack.js/-/hpack.js-2.1.6.tgz",
-      "integrity": "sha1-h3dMCUnlE/QuhFdbPEVoH63ioLI="
+      "integrity": "sha1-h3dMCUnlE/QuhFdbPEVoH63ioLI=",
+      "requires": {
+        "inherits": "2.0.3",
+        "obuf": "1.1.1",
+        "readable-stream": "2.3.3",
+        "wbuf": "1.7.2"
+      }
     },
     "html-comment-regex": {
       "version": "1.1.1",
@@ -6092,9 +5531,12 @@
       "integrity": "sha1-8G69/OIt6XnbggICZcrFQfsX1Pw="
     },
     "html-encoding-sniffer": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-1.0.1.tgz",
-      "integrity": "sha1-eb96eF6klf5mFl5zQVPzY/9UN9o="
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-1.0.2.tgz",
+      "integrity": "sha512-71lZziiDnsuabfdYiUeWdCVyKuqwWi23L8YeIgV9jSSZHCtb6wB1BKWooH7L3tn4/FuZJMVWyNaIDr4RGmaSYw==",
+      "requires": {
+        "whatwg-encoding": "1.0.3"
+      }
     },
     "html-entities": {
       "version": "1.2.1",
@@ -6109,7 +5551,15 @@
     "htmlparser2": {
       "version": "3.9.2",
       "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.9.2.tgz",
-      "integrity": "sha1-G9+HrMoPP55T+k/M6w9LTLsAszg="
+      "integrity": "sha1-G9+HrMoPP55T+k/M6w9LTLsAszg=",
+      "requires": {
+        "domelementtype": "1.3.0",
+        "domhandler": "2.4.1",
+        "domutils": "1.5.1",
+        "entities": "1.1.1",
+        "inherits": "2.0.3",
+        "readable-stream": "2.3.3"
+      }
     },
     "http-deceiver": {
       "version": "1.2.7",
@@ -6119,7 +5569,20 @@
     "http-errors": {
       "version": "1.6.2",
       "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.2.tgz",
-      "integrity": "sha1-CgAsyFcHGSp+eUbO7cERVfYOxzY="
+      "integrity": "sha1-CgAsyFcHGSp+eUbO7cERVfYOxzY=",
+      "requires": {
+        "depd": "1.1.1",
+        "inherits": "2.0.3",
+        "setprototypeof": "1.0.3",
+        "statuses": "1.3.1"
+      },
+      "dependencies": {
+        "setprototypeof": {
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.0.3.tgz",
+          "integrity": "sha1-ZlZ+NwQ+608E2RvWWMDL77VbjgQ="
+        }
+      }
     },
     "http-parser-js": {
       "version": "0.4.9",
@@ -6129,17 +5592,30 @@
     "http-proxy": {
       "version": "1.16.2",
       "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.16.2.tgz",
-      "integrity": "sha1-Bt/ykpUr9k2+hHH6nfcwZtTzd0I="
+      "integrity": "sha1-Bt/ykpUr9k2+hHH6nfcwZtTzd0I=",
+      "requires": {
+        "eventemitter3": "1.2.0",
+        "requires-port": "1.0.0"
+      }
     },
     "http-proxy-middleware": {
       "version": "0.17.4",
       "resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-0.17.4.tgz",
       "integrity": "sha1-ZC6ISIUdZvCdTxJJEoRtuutBuDM=",
+      "requires": {
+        "http-proxy": "1.16.2",
+        "is-glob": "3.1.0",
+        "lodash": "4.17.4",
+        "micromatch": "2.3.11"
+      },
       "dependencies": {
         "arr-diff": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
-          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8="
+          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8=",
+          "requires": {
+            "arr-flatten": "1.1.0"
+          }
         },
         "array-unique": {
           "version": "0.2.1",
@@ -6149,17 +5625,28 @@
         "braces": {
           "version": "1.8.5",
           "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
-          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
+          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc=",
+          "requires": {
+            "expand-range": "1.8.2",
+            "preserve": "0.2.0",
+            "repeat-element": "1.1.2"
+          }
         },
         "expand-brackets": {
           "version": "0.1.5",
           "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
-          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s="
+          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s=",
+          "requires": {
+            "is-posix-bracket": "0.1.1"
+          }
         },
         "extglob": {
           "version": "0.3.2",
           "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
           "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE=",
+          "requires": {
+            "is-extglob": "1.0.0"
+          },
           "dependencies": {
             "is-extglob": {
               "version": "1.0.0",
@@ -6176,17 +5663,38 @@
         "is-glob": {
           "version": "3.1.0",
           "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz",
-          "integrity": "sha1-e6WuJCF4BKxwcHuWkiVnSGzD6Eo="
+          "integrity": "sha1-e6WuJCF4BKxwcHuWkiVnSGzD6Eo=",
+          "requires": {
+            "is-extglob": "2.1.1"
+          }
         },
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+          "requires": {
+            "is-buffer": "1.1.6"
+          }
         },
         "micromatch": {
           "version": "2.3.11",
           "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
           "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU=",
+          "requires": {
+            "arr-diff": "2.0.0",
+            "array-unique": "0.2.1",
+            "braces": "1.8.5",
+            "expand-brackets": "0.1.5",
+            "extglob": "0.3.2",
+            "filename-regex": "2.0.1",
+            "is-extglob": "1.0.0",
+            "is-glob": "2.0.1",
+            "kind-of": "3.2.2",
+            "normalize-path": "2.1.1",
+            "object.omit": "2.0.1",
+            "parse-glob": "3.0.4",
+            "regex-cache": "0.4.4"
+          },
           "dependencies": {
             "is-extglob": {
               "version": "1.0.0",
@@ -6196,7 +5704,10 @@
             "is-glob": {
               "version": "2.0.1",
               "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz",
-              "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM="
+              "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM=",
+              "requires": {
+                "is-extglob": "1.0.0"
+              }
             }
           }
         }
@@ -6205,7 +5716,12 @@
     "http-signature": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.2.0.tgz",
-      "integrity": "sha1-muzZJRFHcvPZW2WmCruPfBj7rOE="
+      "integrity": "sha1-muzZJRFHcvPZW2WmCruPfBj7rOE=",
+      "requires": {
+        "assert-plus": "1.0.0",
+        "jsprim": "1.4.1",
+        "sshpk": "1.13.1"
+      }
     },
     "https-browserify": {
       "version": "0.0.1",
@@ -6215,7 +5731,12 @@
     "https-proxy-agent": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-1.0.0.tgz",
-      "integrity": "sha1-NffabEjOTdv6JkiRrFk+5f+GceY="
+      "integrity": "sha1-NffabEjOTdv6JkiRrFk+5f+GceY=",
+      "requires": {
+        "agent-base": "2.1.1",
+        "debug": "2.6.9",
+        "extend": "3.0.1"
+      }
     },
     "hyphenate-style-name": {
       "version": "1.0.2",
@@ -6235,7 +5756,10 @@
     "icss-utils": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-2.1.0.tgz",
-      "integrity": "sha1-g/Cg7DeL8yRheLbCrZE28TWxyWI="
+      "integrity": "sha1-g/Cg7DeL8yRheLbCrZE28TWxyWI=",
+      "requires": {
+        "postcss": "6.0.14"
+      }
     },
     "ieee754": {
       "version": "1.1.8",
@@ -6243,15 +5767,27 @@
       "integrity": "sha1-vjPUCsEO8ZJnAfbwii2G+/0a0+Q="
     },
     "immutability-helper": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.4.0.tgz",
-      "integrity": "sha512-rW/L/56ZMo9NStMK85kFrUFFGy4NeJbCdhfrDHIZrFfxYtuwuxD+dT3mWMcdmrNO61hllc60AeGglCRhfZ1dZw=="
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.5.0.tgz",
+      "integrity": "sha512-hbOOUruoaBQ04LH1QvUcycfM36y7xlmCKlIQXXyEiry/KeqBUNqq5BsV+KVzhYfgxk4RdFkDuhKaqhHKpjs7XA==",
+      "requires": {
+        "invariant": "2.2.2"
+      }
     },
     "immutable": {
       "version": "3.8.2",
       "resolved": "https://registry.npmjs.org/immutable/-/immutable-3.8.2.tgz",
       "integrity": "sha1-wkOZUUVbs5kT2vKBN28VMOEErfM="
     },
+    "import-local": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/import-local/-/import-local-0.1.1.tgz",
+      "integrity": "sha1-sReVcqrNwRxqkQCftDDbyrX2aKg=",
+      "requires": {
+        "pkg-dir": "2.0.0",
+        "resolve-cwd": "2.0.0"
+      }
+    },
     "imurmurhash": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz",
@@ -6265,7 +5801,10 @@
     "indent-string": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-2.1.0.tgz",
-      "integrity": "sha1-ji1INIdCEhtKghi3oTfppSBJ3IA="
+      "integrity": "sha1-ji1INIdCEhtKghi3oTfppSBJ3IA=",
+      "requires": {
+        "repeating": "2.0.1"
+      }
     },
     "indexes-of": {
       "version": "1.0.1",
@@ -6280,7 +5819,11 @@
     "inflight": {
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
-      "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk="
+      "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=",
+      "requires": {
+        "once": "1.4.0",
+        "wrappy": "1.0.2"
+      }
     },
     "inherits": {
       "version": "2.0.3",
@@ -6290,12 +5833,31 @@
     "inline-style-prefixer": {
       "version": "3.0.8",
       "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-3.0.8.tgz",
-      "integrity": "sha1-hVG45bTVcyROZqNLBPfTIHaitTQ="
+      "integrity": "sha1-hVG45bTVcyROZqNLBPfTIHaitTQ=",
+      "requires": {
+        "bowser": "1.8.1",
+        "css-in-js-utils": "2.0.0"
+      }
     },
     "inquirer": {
       "version": "3.0.6",
       "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-3.0.6.tgz",
       "integrity": "sha1-4EqqnQW3o8ubD0B9BDdfBEcZA0c=",
+      "requires": {
+        "ansi-escapes": "1.4.0",
+        "chalk": "1.1.3",
+        "cli-cursor": "2.1.0",
+        "cli-width": "2.2.0",
+        "external-editor": "2.0.5",
+        "figures": "2.0.0",
+        "lodash": "4.17.4",
+        "mute-stream": "0.0.7",
+        "run-async": "2.3.0",
+        "rx": "4.1.0",
+        "string-width": "2.1.1",
+        "strip-ansi": "3.0.1",
+        "through": "2.3.8"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -6305,7 +5867,14 @@
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          }
         },
         "supports-color": {
           "version": "2.0.0",
@@ -6317,7 +5886,10 @@
     "internal-ip": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/internal-ip/-/internal-ip-1.2.0.tgz",
-      "integrity": "sha1-rp+/k7mEh4eF1QqN4bNWlWBYz1w="
+      "integrity": "sha1-rp+/k7mEh4eF1QqN4bNWlWBYz1w=",
+      "requires": {
+        "meow": "3.7.0"
+      }
     },
     "interpret": {
       "version": "1.0.4",
@@ -6327,7 +5899,10 @@
     "invariant": {
       "version": "2.2.2",
       "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.2.tgz",
-      "integrity": "sha1-nh9WrArNtr8wMwbzOL47IErmA2A="
+      "integrity": "sha1-nh9WrArNtr8wMwbzOL47IErmA2A=",
+      "requires": {
+        "loose-envify": "1.3.1"
+      }
     },
     "invert-kv": {
       "version": "1.0.0",
@@ -6340,9 +5915,9 @@
       "integrity": "sha1-vd7XARQpCCjAoDnnLvJfWq7ENUo="
     },
     "ipaddr.js": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.4.0.tgz",
-      "integrity": "sha1-KWrKh4qCGBbluF0KKFqZvP9FgvA="
+      "version": "1.5.2",
+      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.5.2.tgz",
+      "integrity": "sha1-1LUFvemUaYfM8PxY2QEP+WB+P6A="
     },
     "is-absolute-url": {
       "version": "2.1.0",
@@ -6353,11 +5928,17 @@
       "version": "0.1.6",
       "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
       "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
+      "requires": {
+        "kind-of": "3.2.2"
+      },
       "dependencies": {
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+          "requires": {
+            "is-buffer": "1.1.6"
+          }
         }
       }
     },
@@ -6369,17 +5950,23 @@
     "is-binary-path": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-1.0.1.tgz",
-      "integrity": "sha1-dfFmQrSA8YenEcgUFh/TpKdlWJg="
+      "integrity": "sha1-dfFmQrSA8YenEcgUFh/TpKdlWJg=",
+      "requires": {
+        "binary-extensions": "1.10.0"
+      }
     },
     "is-buffer": {
-      "version": "1.1.5",
-      "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.5.tgz",
-      "integrity": "sha1-Hzsm72E7IUuIy8ojzGwB2Hlh7sw="
+      "version": "1.1.6",
+      "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
+      "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w=="
     },
     "is-builtin-module": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-1.0.0.tgz",
-      "integrity": "sha1-VAVy0096wxGfj3bDDLwbHgN6/74="
+      "integrity": "sha1-VAVy0096wxGfj3bDDLwbHgN6/74=",
+      "requires": {
+        "builtin-modules": "1.1.1"
+      }
     },
     "is-callable": {
       "version": "1.1.3",
@@ -6389,17 +5976,26 @@
     "is-ci": {
       "version": "1.0.10",
       "resolved": "https://registry.npmjs.org/is-ci/-/is-ci-1.0.10.tgz",
-      "integrity": "sha1-9zkzayYyNlBhqdSCcM1WrjNpMY4="
+      "integrity": "sha1-9zkzayYyNlBhqdSCcM1WrjNpMY4=",
+      "requires": {
+        "ci-info": "1.1.1"
+      }
     },
     "is-data-descriptor": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
       "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
+      "requires": {
+        "kind-of": "3.2.2"
+      },
       "dependencies": {
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+          "requires": {
+            "is-buffer": "1.1.6"
+          }
         }
       }
     },
@@ -6411,7 +6007,19 @@
     "is-descriptor": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-1.0.1.tgz",
-      "integrity": "sha512-G3fFVFTqfaqu7r4YuSBHKBAuOaLz8Sy7ekklUpFEliaLMP1Y2ZjoN9jS62YWCAPQrQpMUQSitRlrzibbuCZjdA=="
+      "integrity": "sha512-G3fFVFTqfaqu7r4YuSBHKBAuOaLz8Sy7ekklUpFEliaLMP1Y2ZjoN9jS62YWCAPQrQpMUQSitRlrzibbuCZjdA==",
+      "requires": {
+        "is-accessor-descriptor": "0.1.6",
+        "is-data-descriptor": "0.1.4",
+        "kind-of": "5.1.0"
+      },
+      "dependencies": {
+        "kind-of": {
+          "version": "5.1.0",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
+          "integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw=="
+        }
+      }
     },
     "is-directory": {
       "version": "0.3.1",
@@ -6431,7 +6039,10 @@
     "is-equal-shallow": {
       "version": "0.1.3",
       "resolved": "https://registry.npmjs.org/is-equal-shallow/-/is-equal-shallow-0.1.3.tgz",
-      "integrity": "sha1-IjgJj8Ih3gvPpdnqxMRdY4qhxTQ="
+      "integrity": "sha1-IjgJj8Ih3gvPpdnqxMRdY4qhxTQ=",
+      "requires": {
+        "is-primitive": "2.0.0"
+      }
     },
     "is-extendable": {
       "version": "0.1.1",
@@ -6446,7 +6057,10 @@
     "is-finite": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/is-finite/-/is-finite-1.0.2.tgz",
-      "integrity": "sha1-zGZ3aVYCvlUO8R6LSqYwU0K20Ko="
+      "integrity": "sha1-zGZ3aVYCvlUO8R6LSqYwU0K20Ko=",
+      "requires": {
+        "number-is-nan": "1.0.1"
+      }
     },
     "is-fullwidth-code-point": {
       "version": "2.0.0",
@@ -6461,22 +6075,37 @@
     "is-glob": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-2.0.1.tgz",
-      "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM="
+      "integrity": "sha1-0Jb5JqPe1WAPP9/ZEZjLCIjC2GM=",
+      "requires": {
+        "is-extglob": "1.0.0"
+      }
     },
     "is-my-json-valid": {
       "version": "2.16.1",
       "resolved": "https://registry.npmjs.org/is-my-json-valid/-/is-my-json-valid-2.16.1.tgz",
-      "integrity": "sha512-ochPsqWS1WXj8ZnMIV0vnNXooaMhp7cyL4FMSIPKTtnV0Ha/T19G2b9kkhcNsabV9bxYkze7/aLZJb/bYuFduQ=="
+      "integrity": "sha512-ochPsqWS1WXj8ZnMIV0vnNXooaMhp7cyL4FMSIPKTtnV0Ha/T19G2b9kkhcNsabV9bxYkze7/aLZJb/bYuFduQ==",
+      "requires": {
+        "generate-function": "2.0.0",
+        "generate-object-property": "1.2.0",
+        "jsonpointer": "4.0.1",
+        "xtend": "4.0.1"
+      }
     },
     "is-number": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/is-number/-/is-number-3.0.0.tgz",
       "integrity": "sha1-JP1iAaR4LPUFYcgQJ2r8fRLXEZU=",
+      "requires": {
+        "kind-of": "3.2.2"
+      },
       "dependencies": {
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+          "requires": {
+            "is-buffer": "1.1.6"
+          }
         }
       }
     },
@@ -6488,7 +6117,10 @@
     "is-odd": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/is-odd/-/is-odd-1.0.0.tgz",
-      "integrity": "sha1-O4qTLrAos3dcObsJ6RdnrM22kIg="
+      "integrity": "sha1-O4qTLrAos3dcObsJ6RdnrM22kIg=",
+      "requires": {
+        "is-number": "3.0.0"
+      }
     },
     "is-path-cwd": {
       "version": "1.0.0",
@@ -6498,12 +6130,18 @@
     "is-path-in-cwd": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-1.0.0.tgz",
-      "integrity": "sha1-ZHdYK4IU1gI0YJRWcAO+ip6sBNw="
+      "integrity": "sha1-ZHdYK4IU1gI0YJRWcAO+ip6sBNw=",
+      "requires": {
+        "is-path-inside": "1.0.0"
+      }
     },
     "is-path-inside": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-1.0.0.tgz",
-      "integrity": "sha1-/AbloWg/vaE95mev9xe7wQpI838="
+      "integrity": "sha1-/AbloWg/vaE95mev9xe7wQpI838=",
+      "requires": {
+        "path-is-inside": "1.0.2"
+      }
     },
     "is-plain-obj": {
       "version": "1.1.0",
@@ -6513,7 +6151,10 @@
     "is-plain-object": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.4.tgz",
-      "integrity": "sha512-h5PpgXkWitc38BBMYawTYMWJHFZJVnBquFE57xFpjB8pJFiF6gZ+bU+WyI/yqXiFR5mdLsgYNaPe8uao6Uv9Og=="
+      "integrity": "sha512-h5PpgXkWitc38BBMYawTYMWJHFZJVnBquFE57xFpjB8pJFiF6gZ+bU+WyI/yqXiFR5mdLsgYNaPe8uao6Uv9Og==",
+      "requires": {
+        "isobject": "3.0.1"
+      }
     },
     "is-posix-bracket": {
       "version": "0.1.1",
@@ -6538,7 +6179,10 @@
     "is-regex": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.0.4.tgz",
-      "integrity": "sha1-VRdIm1RwkbCTDglWVM7SXul+lJE="
+      "integrity": "sha1-VRdIm1RwkbCTDglWVM7SXul+lJE=",
+      "requires": {
+        "has": "1.0.1"
+      }
     },
     "is-stream": {
       "version": "1.1.0",
@@ -6553,7 +6197,10 @@
     "is-svg": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/is-svg/-/is-svg-2.1.0.tgz",
-      "integrity": "sha1-z2EJDaDZ77yrhyLeum8DIgjbsOk="
+      "integrity": "sha1-z2EJDaDZ77yrhyLeum8DIgjbsOk=",
+      "requires": {
+        "html-comment-regex": "1.1.1"
+      }
     },
     "is-symbol": {
       "version": "1.0.1",
@@ -6598,7 +6245,11 @@
     "isomorphic-fetch": {
       "version": "2.2.1",
       "resolved": "https://registry.npmjs.org/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz",
-      "integrity": "sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk="
+      "integrity": "sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk=",
+      "requires": {
+        "node-fetch": "1.6.3",
+        "whatwg-fetch": "2.0.3"
+      }
     },
     "isstream": {
       "version": "0.1.2",
@@ -6606,9 +6257,22 @@
       "integrity": "sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo="
     },
     "istanbul-api": {
-      "version": "1.1.14",
-      "resolved": "https://registry.npmjs.org/istanbul-api/-/istanbul-api-1.1.14.tgz",
-      "integrity": "sha1-JbxXAffGgMD//5E95G42GaOm5oA="
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/istanbul-api/-/istanbul-api-1.2.1.tgz",
+      "integrity": "sha512-oFCwXvd65amgaPCzqrR+a2XjanS1MvpXN6l/MlMUTv6uiA1NOgGX+I0uyq8Lg3GDxsxPsaP1049krz3hIJ5+KA==",
+      "requires": {
+        "async": "2.6.0",
+        "fileset": "2.0.3",
+        "istanbul-lib-coverage": "1.1.1",
+        "istanbul-lib-hook": "1.1.0",
+        "istanbul-lib-instrument": "1.9.1",
+        "istanbul-lib-report": "1.1.2",
+        "istanbul-lib-source-maps": "1.2.2",
+        "istanbul-reports": "1.1.3",
+        "js-yaml": "3.7.0",
+        "mkdirp": "0.5.1",
+        "once": "1.4.0"
+      }
     },
     "istanbul-lib-coverage": {
       "version": "1.1.1",
@@ -6616,19 +6280,37 @@
       "integrity": "sha512-0+1vDkmzxqJIn5rcoEqapSB4DmPxE31EtI2dF2aCkV5esN9EWHxZ0dwgDClivMXJqE7zaYQxq30hj5L0nlTN5Q=="
     },
     "istanbul-lib-hook": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/istanbul-lib-hook/-/istanbul-lib-hook-1.0.7.tgz",
-      "integrity": "sha512-3U2HB9y1ZV9UmFlE12Fx+nPtFqIymzrqCksrXujm3NVbAZIJg/RfYgO1XiIa0mbmxTjWpVEVlkIZJ25xVIAfkQ=="
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-hook/-/istanbul-lib-hook-1.1.0.tgz",
+      "integrity": "sha512-U3qEgwVDUerZ0bt8cfl3dSP3S6opBoOtk3ROO5f2EfBr/SRiD9FQqzwaZBqFORu8W7O0EXpai+k7kxHK13beRg==",
+      "requires": {
+        "append-transform": "0.4.0"
+      }
     },
     "istanbul-lib-instrument": {
-      "version": "1.8.0",
-      "resolved": "https://registry.npmjs.org/istanbul-lib-instrument/-/istanbul-lib-instrument-1.8.0.tgz",
-      "integrity": "sha1-ZvbJQhzJ7EcE928tsIS6kHiitTI="
+      "version": "1.9.1",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-instrument/-/istanbul-lib-instrument-1.9.1.tgz",
+      "integrity": "sha512-RQmXeQ7sphar7k7O1wTNzVczF9igKpaeGQAG9qR2L+BS4DCJNTI9nytRmIVYevwO0bbq+2CXvJmYDuz0gMrywA==",
+      "requires": {
+        "babel-generator": "6.26.0",
+        "babel-template": "6.26.0",
+        "babel-traverse": "6.26.0",
+        "babel-types": "6.26.0",
+        "babylon": "6.18.0",
+        "istanbul-lib-coverage": "1.1.1",
+        "semver": "5.4.1"
+      }
     },
     "istanbul-lib-report": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/istanbul-lib-report/-/istanbul-lib-report-1.1.1.tgz",
-      "integrity": "sha512-tvF+YmCmH4thnez6JFX06ujIA19WPa9YUiwjc1uALF2cv5dmE3It8b5I8Ob7FHJ70H9Y5yF+TDkVa/mcADuw1Q==",
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-report/-/istanbul-lib-report-1.1.2.tgz",
+      "integrity": "sha512-UTv4VGx+HZivJQwAo1wnRwe1KTvFpfi/NYwN7DcsrdzMXwpRT/Yb6r4SBPoHWj4VuQPakR32g4PUUeyKkdDkBA==",
+      "requires": {
+        "istanbul-lib-coverage": "1.1.1",
+        "mkdirp": "0.5.1",
+        "path-parse": "1.0.5",
+        "supports-color": "3.2.3"
+      },
       "dependencies": {
         "has-flag": {
           "version": "1.0.0",
@@ -6638,15 +6320,33 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
     "istanbul-lib-source-maps": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/istanbul-lib-source-maps/-/istanbul-lib-source-maps-1.2.1.tgz",
-      "integrity": "sha512-mukVvSXCn9JQvdJl8wP/iPhqig0MRtuWuD4ZNKo6vB2Ik//AmhAKe3QnPN02dmkRe3lTudFk3rzoHhwU4hb94w==",
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-source-maps/-/istanbul-lib-source-maps-1.2.2.tgz",
+      "integrity": "sha512-8BfdqSfEdtip7/wo1RnrvLpHVEd8zMZEDmOFEnpC6dg0vXflHt9nvoAyQUzig2uMSXfF2OBEYBV3CVjIL9JvaQ==",
+      "requires": {
+        "debug": "3.1.0",
+        "istanbul-lib-coverage": "1.1.1",
+        "mkdirp": "0.5.1",
+        "rimraf": "2.6.2",
+        "source-map": "0.5.7"
+      },
       "dependencies": {
+        "debug": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
+          "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
+          "requires": {
+            "ms": "2.0.0"
+          }
+        },
         "source-map": {
           "version": "0.5.7",
           "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
@@ -6655,9 +6355,12 @@
       }
     },
     "istanbul-reports": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/istanbul-reports/-/istanbul-reports-1.1.2.tgz",
-      "integrity": "sha1-D7Lj9qqZIr085F0F2KtNXo4HvU8="
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/istanbul-reports/-/istanbul-reports-1.1.3.tgz",
+      "integrity": "sha512-ZEelkHh8hrZNI5xDaKwPMFwDsUf5wIEI2bXAFGp1e6deR2mnEKBPhLJEgr4ZBt8Gi6Mj38E/C8kcy9XLggVO2Q==",
+      "requires": {
+        "handlebars": "4.0.11"
+      }
     },
     "items": {
       "version": "2.1.1",
@@ -6668,6 +6371,9 @@
       "version": "21.2.1",
       "resolved": "https://registry.npmjs.org/jest/-/jest-21.2.1.tgz",
       "integrity": "sha512-mXN0ppPvWYoIcC+R+ctKxAJ28xkt/Z5Js875padm4GbgUn6baeR5N4Ng6LjatIRpUQDZVJABT7Y4gucFjPryfw==",
+      "requires": {
+        "jest-cli": "21.2.1"
+      },
       "dependencies": {
         "ansi-escapes": {
           "version": "3.0.0",
@@ -6682,7 +6388,10 @@
         "arr-diff": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
-          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8="
+          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8=",
+          "requires": {
+            "arr-flatten": "1.1.0"
+          }
         },
         "array-unique": {
           "version": "0.2.1",
@@ -6692,91 +6401,159 @@
         "braces": {
           "version": "1.8.5",
           "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
-          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
-        },
-        "camelcase": {
-          "version": "4.1.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
-          "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
-        },
-        "cliui": {
-          "version": "3.2.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
-          "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0=",
-          "dependencies": {
-            "ansi-regex": {
-              "version": "2.1.1",
-              "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
-              "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
-            },
-            "string-width": {
-              "version": "1.0.2",
-              "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
-              "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
-            },
-            "strip-ansi": {
-              "version": "3.0.1",
-              "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
-              "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8="
-            }
+          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc=",
+          "requires": {
+            "expand-range": "1.8.2",
+            "preserve": "0.2.0",
+            "repeat-element": "1.1.2"
           }
         },
         "expand-brackets": {
           "version": "0.1.5",
           "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
-          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s="
+          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s=",
+          "requires": {
+            "is-posix-bracket": "0.1.1"
+          }
         },
         "extglob": {
           "version": "0.3.2",
           "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
-          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
-        },
-        "is-fullwidth-code-point": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
-          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
+          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE=",
+          "requires": {
+            "is-extglob": "1.0.0"
+          }
         },
         "jest-cli": {
           "version": "21.2.1",
           "resolved": "https://registry.npmjs.org/jest-cli/-/jest-cli-21.2.1.tgz",
-          "integrity": "sha512-T1BzrbFxDIW/LLYQqVfo94y/hhaj1NzVQkZgBumAC+sxbjMROI7VkihOdxNR758iYbQykL2ZOWUBurFgkQrzdg=="
+          "integrity": "sha512-T1BzrbFxDIW/LLYQqVfo94y/hhaj1NzVQkZgBumAC+sxbjMROI7VkihOdxNR758iYbQykL2ZOWUBurFgkQrzdg==",
+          "requires": {
+            "ansi-escapes": "3.0.0",
+            "chalk": "2.3.0",
+            "glob": "7.1.2",
+            "graceful-fs": "4.1.11",
+            "is-ci": "1.0.10",
+            "istanbul-api": "1.2.1",
+            "istanbul-lib-coverage": "1.1.1",
+            "istanbul-lib-instrument": "1.9.1",
+            "istanbul-lib-source-maps": "1.2.2",
+            "jest-changed-files": "21.2.0",
+            "jest-config": "21.2.1",
+            "jest-environment-jsdom": "21.2.1",
+            "jest-haste-map": "21.2.0",
+            "jest-message-util": "21.2.1",
+            "jest-regex-util": "21.2.0",
+            "jest-resolve-dependencies": "21.2.0",
+            "jest-runner": "21.2.1",
+            "jest-runtime": "21.2.1",
+            "jest-snapshot": "21.2.1",
+            "jest-util": "21.2.1",
+            "micromatch": "2.3.11",
+            "node-notifier": "5.1.2",
+            "pify": "3.0.0",
+            "slash": "1.0.0",
+            "string-length": "2.0.0",
+            "strip-ansi": "4.0.0",
+            "which": "1.3.0",
+            "worker-farm": "1.5.1",
+            "yargs": "9.0.1"
+          }
         },
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+          "requires": {
+            "is-buffer": "1.1.6"
+          }
         },
         "micromatch": {
           "version": "2.3.11",
           "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
-          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
+          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU=",
+          "requires": {
+            "arr-diff": "2.0.0",
+            "array-unique": "0.2.1",
+            "braces": "1.8.5",
+            "expand-brackets": "0.1.5",
+            "extglob": "0.3.2",
+            "filename-regex": "2.0.1",
+            "is-extglob": "1.0.0",
+            "is-glob": "2.0.1",
+            "kind-of": "3.2.2",
+            "normalize-path": "2.1.1",
+            "object.omit": "2.0.1",
+            "parse-glob": "3.0.4",
+            "regex-cache": "0.4.4"
+          }
         },
         "strip-ansi": {
           "version": "4.0.0",
           "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
-          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8="
+          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
+          "requires": {
+            "ansi-regex": "3.0.0"
+          }
         },
         "yargs": {
           "version": "9.0.1",
           "resolved": "https://registry.npmjs.org/yargs/-/yargs-9.0.1.tgz",
-          "integrity": "sha1-UqzCP+7Kw0BCB47njAwAf1CF20w="
+          "integrity": "sha1-UqzCP+7Kw0BCB47njAwAf1CF20w=",
+          "requires": {
+            "camelcase": "4.1.0",
+            "cliui": "3.2.0",
+            "decamelize": "1.2.0",
+            "get-caller-file": "1.0.2",
+            "os-locale": "2.1.0",
+            "read-pkg-up": "2.0.0",
+            "require-directory": "2.1.1",
+            "require-main-filename": "1.0.1",
+            "set-blocking": "2.0.0",
+            "string-width": "2.1.1",
+            "which-module": "2.0.0",
+            "y18n": "3.2.1",
+            "yargs-parser": "7.0.0"
+          }
         }
       }
     },
     "jest-changed-files": {
       "version": "21.2.0",
       "resolved": "https://registry.npmjs.org/jest-changed-files/-/jest-changed-files-21.2.0.tgz",
-      "integrity": "sha512-+lCNP1IZLwN1NOIvBcV5zEL6GENK6TXrDj4UxWIeLvIsIDa+gf6J7hkqsW2qVVt/wvH65rVvcPwqXdps5eclTQ=="
+      "integrity": "sha512-+lCNP1IZLwN1NOIvBcV5zEL6GENK6TXrDj4UxWIeLvIsIDa+gf6J7hkqsW2qVVt/wvH65rVvcPwqXdps5eclTQ==",
+      "requires": {
+        "throat": "4.1.0"
+      }
     },
     "jest-config": {
       "version": "21.2.1",
       "resolved": "https://registry.npmjs.org/jest-config/-/jest-config-21.2.1.tgz",
-      "integrity": "sha512-fJru5HtlD/5l2o25eY9xT0doK3t2dlglrqoGpbktduyoI0T5CwuB++2YfoNZCrgZipTwPuAGonYv0q7+8yDc/A=="
+      "integrity": "sha512-fJru5HtlD/5l2o25eY9xT0doK3t2dlglrqoGpbktduyoI0T5CwuB++2YfoNZCrgZipTwPuAGonYv0q7+8yDc/A==",
+      "requires": {
+        "chalk": "2.3.0",
+        "glob": "7.1.2",
+        "jest-environment-jsdom": "21.2.1",
+        "jest-environment-node": "21.2.1",
+        "jest-get-type": "21.2.0",
+        "jest-jasmine2": "21.2.1",
+        "jest-regex-util": "21.2.0",
+        "jest-resolve": "21.2.0",
+        "jest-util": "21.2.1",
+        "jest-validate": "21.2.1",
+        "pretty-format": "21.2.1"
+      }
     },
     "jest-diff": {
       "version": "21.2.1",
       "resolved": "https://registry.npmjs.org/jest-diff/-/jest-diff-21.2.1.tgz",
-      "integrity": "sha512-E5fu6r7PvvPr5qAWE1RaUwIh/k6Zx/3OOkZ4rk5dBJkEWRrUuSgbMt2EO8IUTPTd6DOqU3LW6uTIwX5FRvXoFA=="
+      "integrity": "sha512-E5fu6r7PvvPr5qAWE1RaUwIh/k6Zx/3OOkZ4rk5dBJkEWRrUuSgbMt2EO8IUTPTd6DOqU3LW6uTIwX5FRvXoFA==",
+      "requires": {
+        "chalk": "2.3.0",
+        "diff": "3.4.0",
+        "jest-get-type": "21.2.0",
+        "pretty-format": "21.2.1"
+      }
     },
     "jest-docblock": {
       "version": "21.2.0",
@@ -6786,12 +6563,21 @@
     "jest-environment-jsdom": {
       "version": "21.2.1",
       "resolved": "https://registry.npmjs.org/jest-environment-jsdom/-/jest-environment-jsdom-21.2.1.tgz",
-      "integrity": "sha512-mecaeNh0eWmzNrUNMWARysc0E9R96UPBamNiOCYL28k7mksb1d0q6DD38WKP7ABffjnXyUWJPVaWRgUOivwXwg=="
+      "integrity": "sha512-mecaeNh0eWmzNrUNMWARysc0E9R96UPBamNiOCYL28k7mksb1d0q6DD38WKP7ABffjnXyUWJPVaWRgUOivwXwg==",
+      "requires": {
+        "jest-mock": "21.2.0",
+        "jest-util": "21.2.1",
+        "jsdom": "9.12.0"
+      }
     },
     "jest-environment-node": {
       "version": "21.2.1",
       "resolved": "https://registry.npmjs.org/jest-environment-node/-/jest-environment-node-21.2.1.tgz",
-      "integrity": "sha512-R211867wx9mVBVHzrjGRGTy5cd05K7eqzQl/WyZixR/VkJ4FayS8qkKXZyYnwZi6Rxo6WEV81cDbiUx/GfuLNw=="
+      "integrity": "sha512-R211867wx9mVBVHzrjGRGTy5cd05K7eqzQl/WyZixR/VkJ4FayS8qkKXZyYnwZi6Rxo6WEV81cDbiUx/GfuLNw==",
+      "requires": {
+        "jest-mock": "21.2.0",
+        "jest-util": "21.2.1"
+      }
     },
     "jest-get-type": {
       "version": "21.2.0",
@@ -6802,11 +6588,22 @@
       "version": "21.2.0",
       "resolved": "https://registry.npmjs.org/jest-haste-map/-/jest-haste-map-21.2.0.tgz",
       "integrity": "sha512-5LhsY/loPH7wwOFRMs+PT4aIAORJ2qwgbpMFlbWbxfN0bk3ZCwxJ530vrbSiTstMkYLao6JwBkLhCJ5XbY7ZHw==",
+      "requires": {
+        "fb-watchman": "2.0.0",
+        "graceful-fs": "4.1.11",
+        "jest-docblock": "21.2.0",
+        "micromatch": "2.3.11",
+        "sane": "2.2.0",
+        "worker-farm": "1.5.1"
+      },
       "dependencies": {
         "arr-diff": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
-          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8="
+          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8=",
+          "requires": {
+            "arr-flatten": "1.1.0"
+          }
         },
         "array-unique": {
           "version": "0.2.1",
@@ -6816,49 +6613,101 @@
         "braces": {
           "version": "1.8.5",
           "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
-          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
+          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc=",
+          "requires": {
+            "expand-range": "1.8.2",
+            "preserve": "0.2.0",
+            "repeat-element": "1.1.2"
+          }
         },
         "expand-brackets": {
           "version": "0.1.5",
           "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
-          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s="
+          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s=",
+          "requires": {
+            "is-posix-bracket": "0.1.1"
+          }
         },
         "extglob": {
           "version": "0.3.2",
           "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
-          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
+          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE=",
+          "requires": {
+            "is-extglob": "1.0.0"
+          }
         },
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+          "requires": {
+            "is-buffer": "1.1.6"
+          }
         },
         "micromatch": {
           "version": "2.3.11",
           "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
-          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
+          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU=",
+          "requires": {
+            "arr-diff": "2.0.0",
+            "array-unique": "0.2.1",
+            "braces": "1.8.5",
+            "expand-brackets": "0.1.5",
+            "extglob": "0.3.2",
+            "filename-regex": "2.0.1",
+            "is-extglob": "1.0.0",
+            "is-glob": "2.0.1",
+            "kind-of": "3.2.2",
+            "normalize-path": "2.1.1",
+            "object.omit": "2.0.1",
+            "parse-glob": "3.0.4",
+            "regex-cache": "0.4.4"
+          }
         }
       }
     },
     "jest-jasmine2": {
       "version": "21.2.1",
       "resolved": "https://registry.npmjs.org/jest-jasmine2/-/jest-jasmine2-21.2.1.tgz",
-      "integrity": "sha512-lw8FXXIEekD+jYNlStfgNsUHpfMWhWWCgHV7n0B7mA/vendH7vBFs8xybjQsDzJSduptBZJHqQX9SMssya9+3A=="
+      "integrity": "sha512-lw8FXXIEekD+jYNlStfgNsUHpfMWhWWCgHV7n0B7mA/vendH7vBFs8xybjQsDzJSduptBZJHqQX9SMssya9+3A==",
+      "requires": {
+        "chalk": "2.3.0",
+        "expect": "21.2.1",
+        "graceful-fs": "4.1.11",
+        "jest-diff": "21.2.1",
+        "jest-matcher-utils": "21.2.1",
+        "jest-message-util": "21.2.1",
+        "jest-snapshot": "21.2.1",
+        "p-cancelable": "0.3.0"
+      }
     },
     "jest-matcher-utils": {
       "version": "21.2.1",
       "resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-21.2.1.tgz",
-      "integrity": "sha512-kn56My+sekD43dwQPrXBl9Zn9tAqwoy25xxe7/iY4u+mG8P3ALj5IK7MLHZ4Mi3xW7uWVCjGY8cm4PqgbsqMCg=="
+      "integrity": "sha512-kn56My+sekD43dwQPrXBl9Zn9tAqwoy25xxe7/iY4u+mG8P3ALj5IK7MLHZ4Mi3xW7uWVCjGY8cm4PqgbsqMCg==",
+      "requires": {
+        "chalk": "2.3.0",
+        "jest-get-type": "21.2.0",
+        "pretty-format": "21.2.1"
+      }
     },
     "jest-message-util": {
       "version": "21.2.1",
       "resolved": "https://registry.npmjs.org/jest-message-util/-/jest-message-util-21.2.1.tgz",
       "integrity": "sha512-EbC1X2n0t9IdeMECJn2BOg7buOGivCvVNjqKMXTzQOu7uIfLml+keUfCALDh8o4rbtndIeyGU8/BKfoTr/LVDQ==",
+      "requires": {
+        "chalk": "2.3.0",
+        "micromatch": "2.3.11",
+        "slash": "1.0.0"
+      },
       "dependencies": {
         "arr-diff": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
-          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8="
+          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8=",
+          "requires": {
+            "arr-flatten": "1.1.0"
+          }
         },
         "array-unique": {
           "version": "0.2.1",
@@ -6868,27 +6717,56 @@
         "braces": {
           "version": "1.8.5",
           "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
-          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
+          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc=",
+          "requires": {
+            "expand-range": "1.8.2",
+            "preserve": "0.2.0",
+            "repeat-element": "1.1.2"
+          }
         },
         "expand-brackets": {
           "version": "0.1.5",
           "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
-          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s="
+          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s=",
+          "requires": {
+            "is-posix-bracket": "0.1.1"
+          }
         },
         "extglob": {
           "version": "0.3.2",
           "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
-          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
+          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE=",
+          "requires": {
+            "is-extglob": "1.0.0"
+          }
         },
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+          "requires": {
+            "is-buffer": "1.1.6"
+          }
         },
         "micromatch": {
           "version": "2.3.11",
           "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
-          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
+          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU=",
+          "requires": {
+            "arr-diff": "2.0.0",
+            "array-unique": "0.2.1",
+            "braces": "1.8.5",
+            "expand-brackets": "0.1.5",
+            "extglob": "0.3.2",
+            "filename-regex": "2.0.1",
+            "is-extglob": "1.0.0",
+            "is-glob": "2.0.1",
+            "kind-of": "3.2.2",
+            "normalize-path": "2.1.1",
+            "object.omit": "2.0.1",
+            "parse-glob": "3.0.4",
+            "regex-cache": "0.4.4"
+          }
         }
       }
     },
@@ -6905,27 +6783,69 @@
     "jest-resolve": {
       "version": "21.2.0",
       "resolved": "https://registry.npmjs.org/jest-resolve/-/jest-resolve-21.2.0.tgz",
-      "integrity": "sha512-vefQ/Lr+VdNvHUZFQXWtOqHX3HEdOc2MtSahBO89qXywEbUxGPB9ZLP9+BHinkxb60UT2Q/tTDOS6rYc6Mwigw=="
+      "integrity": "sha512-vefQ/Lr+VdNvHUZFQXWtOqHX3HEdOc2MtSahBO89qXywEbUxGPB9ZLP9+BHinkxb60UT2Q/tTDOS6rYc6Mwigw==",
+      "requires": {
+        "browser-resolve": "1.11.2",
+        "chalk": "2.3.0",
+        "is-builtin-module": "1.0.0"
+      }
     },
     "jest-resolve-dependencies": {
       "version": "21.2.0",
       "resolved": "https://registry.npmjs.org/jest-resolve-dependencies/-/jest-resolve-dependencies-21.2.0.tgz",
-      "integrity": "sha512-ok8ybRFU5ScaAcfufIQrCbdNJSRZ85mkxJ1EhUp8Bhav1W1/jv/rl1Q6QoVQHObNxmKnbHVKrfLZbCbOsXQ+bQ=="
+      "integrity": "sha512-ok8ybRFU5ScaAcfufIQrCbdNJSRZ85mkxJ1EhUp8Bhav1W1/jv/rl1Q6QoVQHObNxmKnbHVKrfLZbCbOsXQ+bQ==",
+      "requires": {
+        "jest-regex-util": "21.2.0"
+      }
     },
     "jest-runner": {
       "version": "21.2.1",
       "resolved": "https://registry.npmjs.org/jest-runner/-/jest-runner-21.2.1.tgz",
-      "integrity": "sha512-Anb72BOQlHqF/zETqZ2K20dbYsnqW/nZO7jV8BYENl+3c44JhMrA8zd1lt52+N7ErnsQMd2HHKiVwN9GYSXmrg=="
+      "integrity": "sha512-Anb72BOQlHqF/zETqZ2K20dbYsnqW/nZO7jV8BYENl+3c44JhMrA8zd1lt52+N7ErnsQMd2HHKiVwN9GYSXmrg==",
+      "requires": {
+        "jest-config": "21.2.1",
+        "jest-docblock": "21.2.0",
+        "jest-haste-map": "21.2.0",
+        "jest-jasmine2": "21.2.1",
+        "jest-message-util": "21.2.1",
+        "jest-runtime": "21.2.1",
+        "jest-util": "21.2.1",
+        "pify": "3.0.0",
+        "throat": "4.1.0",
+        "worker-farm": "1.5.1"
+      }
     },
     "jest-runtime": {
       "version": "21.2.1",
       "resolved": "https://registry.npmjs.org/jest-runtime/-/jest-runtime-21.2.1.tgz",
       "integrity": "sha512-6omlpA3+NSE+rHwD0PQjNEjZeb2z+oRmuehMfM1tWQVum+E0WV3pFt26Am0DUfQkkPyTABvxITRjCUclYgSOsA==",
+      "requires": {
+        "babel-core": "6.26.0",
+        "babel-jest": "21.2.0",
+        "babel-plugin-istanbul": "4.1.5",
+        "chalk": "2.3.0",
+        "convert-source-map": "1.5.0",
+        "graceful-fs": "4.1.11",
+        "jest-config": "21.2.1",
+        "jest-haste-map": "21.2.0",
+        "jest-regex-util": "21.2.0",
+        "jest-resolve": "21.2.0",
+        "jest-util": "21.2.1",
+        "json-stable-stringify": "1.0.1",
+        "micromatch": "2.3.11",
+        "slash": "1.0.0",
+        "strip-bom": "3.0.0",
+        "write-file-atomic": "2.3.0",
+        "yargs": "9.0.1"
+      },
       "dependencies": {
         "arr-diff": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
-          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8="
+          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8=",
+          "requires": {
+            "arr-flatten": "1.1.0"
+          }
         },
         "array-unique": {
           "version": "0.2.1",
@@ -6935,76 +6855,128 @@
         "braces": {
           "version": "1.8.5",
           "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
-          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
-        },
-        "camelcase": {
-          "version": "4.1.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
-          "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
-        },
-        "cliui": {
-          "version": "3.2.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
-          "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0=",
-          "dependencies": {
-            "string-width": {
-              "version": "1.0.2",
-              "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
-              "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
-            }
+          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc=",
+          "requires": {
+            "expand-range": "1.8.2",
+            "preserve": "0.2.0",
+            "repeat-element": "1.1.2"
           }
         },
         "expand-brackets": {
           "version": "0.1.5",
           "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
-          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s="
+          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s=",
+          "requires": {
+            "is-posix-bracket": "0.1.1"
+          }
         },
         "extglob": {
           "version": "0.3.2",
           "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
-          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
-        },
-        "is-fullwidth-code-point": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
-          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
+          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE=",
+          "requires": {
+            "is-extglob": "1.0.0"
+          }
         },
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+          "requires": {
+            "is-buffer": "1.1.6"
+          }
         },
         "micromatch": {
           "version": "2.3.11",
           "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
-          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
+          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU=",
+          "requires": {
+            "arr-diff": "2.0.0",
+            "array-unique": "0.2.1",
+            "braces": "1.8.5",
+            "expand-brackets": "0.1.5",
+            "extglob": "0.3.2",
+            "filename-regex": "2.0.1",
+            "is-extglob": "1.0.0",
+            "is-glob": "2.0.1",
+            "kind-of": "3.2.2",
+            "normalize-path": "2.1.1",
+            "object.omit": "2.0.1",
+            "parse-glob": "3.0.4",
+            "regex-cache": "0.4.4"
+          }
         },
         "yargs": {
           "version": "9.0.1",
           "resolved": "https://registry.npmjs.org/yargs/-/yargs-9.0.1.tgz",
-          "integrity": "sha1-UqzCP+7Kw0BCB47njAwAf1CF20w="
+          "integrity": "sha1-UqzCP+7Kw0BCB47njAwAf1CF20w=",
+          "requires": {
+            "camelcase": "4.1.0",
+            "cliui": "3.2.0",
+            "decamelize": "1.2.0",
+            "get-caller-file": "1.0.2",
+            "os-locale": "2.1.0",
+            "read-pkg-up": "2.0.0",
+            "require-directory": "2.1.1",
+            "require-main-filename": "1.0.1",
+            "set-blocking": "2.0.0",
+            "string-width": "2.1.1",
+            "which-module": "2.0.0",
+            "y18n": "3.2.1",
+            "yargs-parser": "7.0.0"
+          }
         }
       }
     },
     "jest-snapshot": {
       "version": "21.2.1",
       "resolved": "https://registry.npmjs.org/jest-snapshot/-/jest-snapshot-21.2.1.tgz",
-      "integrity": "sha512-bpaeBnDpdqaRTzN8tWg0DqOTo2DvD3StOemxn67CUd1p1Po+BUpvePAp44jdJ7Pxcjfg+42o4NHw1SxdCA2rvg=="
+      "integrity": "sha512-bpaeBnDpdqaRTzN8tWg0DqOTo2DvD3StOemxn67CUd1p1Po+BUpvePAp44jdJ7Pxcjfg+42o4NHw1SxdCA2rvg==",
+      "requires": {
+        "chalk": "2.3.0",
+        "jest-diff": "21.2.1",
+        "jest-matcher-utils": "21.2.1",
+        "mkdirp": "0.5.1",
+        "natural-compare": "1.4.0",
+        "pretty-format": "21.2.1"
+      }
     },
     "jest-util": {
       "version": "21.2.1",
       "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-21.2.1.tgz",
-      "integrity": "sha512-r20W91rmHY3fnCoO7aOAlyfC51x2yeV3xF+prGsJAUsYhKeV670ZB8NO88Lwm7ASu8SdH0S+U+eFf498kjhA4g=="
+      "integrity": "sha512-r20W91rmHY3fnCoO7aOAlyfC51x2yeV3xF+prGsJAUsYhKeV670ZB8NO88Lwm7ASu8SdH0S+U+eFf498kjhA4g==",
+      "requires": {
+        "callsites": "2.0.0",
+        "chalk": "2.3.0",
+        "graceful-fs": "4.1.11",
+        "jest-message-util": "21.2.1",
+        "jest-mock": "21.2.0",
+        "jest-validate": "21.2.1",
+        "mkdirp": "0.5.1"
+      }
     },
     "jest-validate": {
       "version": "21.2.1",
       "resolved": "https://registry.npmjs.org/jest-validate/-/jest-validate-21.2.1.tgz",
-      "integrity": "sha512-k4HLI1rZQjlU+EC682RlQ6oZvLrE5SCh3brseQc24vbZTxzT/k/3urar5QMCVgjadmSO7lECeGdc6YxnM3yEGg=="
+      "integrity": "sha512-k4HLI1rZQjlU+EC682RlQ6oZvLrE5SCh3brseQc24vbZTxzT/k/3urar5QMCVgjadmSO7lECeGdc6YxnM3yEGg==",
+      "requires": {
+        "chalk": "2.3.0",
+        "jest-get-type": "21.2.0",
+        "leven": "2.1.0",
+        "pretty-format": "21.2.1"
+      }
     },
     "joi": {
       "version": "9.2.0",
       "resolved": "https://registry.npmjs.org/joi/-/joi-9.2.0.tgz",
-      "integrity": "sha1-M4WseQGSEwy+Iw6ALsAskhW7/to="
+      "integrity": "sha1-M4WseQGSEwy+Iw6ALsAskhW7/to=",
+      "requires": {
+        "hoek": "4.2.0",
+        "isemail": "2.2.1",
+        "items": "2.1.1",
+        "moment": "2.19.1",
+        "topo": "2.0.2"
+      }
     },
     "js-base64": {
       "version": "2.3.2",
@@ -7019,23 +6991,42 @@
     "js-yaml": {
       "version": "3.7.0",
       "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.7.0.tgz",
-      "integrity": "sha1-XJZ93YN6m/3KXy3oQlOr6KHAO4A="
-    },
-    "jsbn": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-0.1.1.tgz",
-      "integrity": "sha1-peZUwuWi3rXyAdls77yoDA7y9RM=",
-      "optional": true
+      "integrity": "sha1-XJZ93YN6m/3KXy3oQlOr6KHAO4A=",
+      "requires": {
+        "argparse": "1.0.9",
+        "esprima": "2.7.3"
+      }
     },
     "jschardet": {
-      "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/jschardet/-/jschardet-1.5.1.tgz",
-      "integrity": "sha512-vE2hT1D0HLZCLLclfBSfkfTTedhVj0fubHpJBHKwwUWX0nSbhPAfk+SG9rTX95BYNmau8rGFfCeaT6T5OW1C2A=="
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/jschardet/-/jschardet-1.6.0.tgz",
+      "integrity": "sha512-xYuhvQ7I9PDJIGBWev9xm0+SMSed3ZDBAmvVjbFR1ZRLAF+vlXcQu6cRI9uAlj81rzikElRVteehwV7DuX2ZmQ=="
     },
     "jsdom": {
       "version": "9.12.0",
       "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-9.12.0.tgz",
-      "integrity": "sha1-6MVG//ywbADUgzyoRBD+1/igl9Q="
+      "integrity": "sha1-6MVG//ywbADUgzyoRBD+1/igl9Q=",
+      "requires": {
+        "abab": "1.0.4",
+        "acorn": "4.0.13",
+        "acorn-globals": "3.1.0",
+        "array-equal": "1.0.0",
+        "content-type-parser": "1.0.2",
+        "cssom": "0.3.2",
+        "cssstyle": "0.2.37",
+        "escodegen": "1.9.0",
+        "html-encoding-sniffer": "1.0.2",
+        "nwmatcher": "1.4.3",
+        "parse5": "1.5.1",
+        "request": "2.83.0",
+        "sax": "1.2.4",
+        "symbol-tree": "3.2.2",
+        "tough-cookie": "2.3.3",
+        "webidl-conversions": "4.0.2",
+        "whatwg-encoding": "1.0.3",
+        "whatwg-url": "4.8.0",
+        "xml-name-validator": "2.0.1"
+      }
     },
     "jsesc": {
       "version": "0.5.0",
@@ -7060,7 +7051,10 @@
     "json-stable-stringify": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz",
-      "integrity": "sha1-mnWdOcXy/1A/1TAGRu1EX4jE+a8="
+      "integrity": "sha1-mnWdOcXy/1A/1TAGRu1EX4jE+a8=",
+      "requires": {
+        "jsonify": "0.0.0"
+      }
     },
     "json-stringify-safe": {
       "version": "5.0.1",
@@ -7080,7 +7074,10 @@
     "jsonfile": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-4.0.0.tgz",
-      "integrity": "sha1-h3Gq4HmbZAdrdmQPygWPnBDjPss="
+      "integrity": "sha1-h3Gq4HmbZAdrdmQPygWPnBDjPss=",
+      "requires": {
+        "graceful-fs": "4.1.11"
+      }
     },
     "jsonify": {
       "version": "0.0.0",
@@ -7095,32 +7092,49 @@
     "jsprim": {
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.1.tgz",
-      "integrity": "sha1-MT5mvB5cwG5Di8G3SZwuXFastqI="
+      "integrity": "sha1-MT5mvB5cwG5Di8G3SZwuXFastqI=",
+      "requires": {
+        "assert-plus": "1.0.0",
+        "extsprintf": "1.3.0",
+        "json-schema": "0.2.3",
+        "verror": "1.10.0"
+      }
     },
     "just-extend": {
-      "version": "1.1.22",
-      "resolved": "https://registry.npmjs.org/just-extend/-/just-extend-1.1.22.tgz",
-      "integrity": "sha1-MzCvdWyralQnAMZLLk5KoGLVL/8="
+      "version": "1.1.27",
+      "resolved": "https://registry.npmjs.org/just-extend/-/just-extend-1.1.27.tgz",
+      "integrity": "sha512-mJVp13Ix6gFo3SBAy9U/kL+oeZqzlYYYLQBwXVBlVzIsZwBqGREnOro24oC/8s8aox+rJhtZ2DiQof++IrkA+g=="
     },
     "keycode": {
       "version": "2.1.9",
       "resolved": "https://registry.npmjs.org/keycode/-/keycode-2.1.9.tgz",
       "integrity": "sha1-lkojxU5IiUBbSGGlyfBIDUUUHfo="
     },
+    "killable": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/killable/-/killable-1.0.0.tgz",
+      "integrity": "sha1-2ouEvUfeU5WHj5XWTQLyRJ/gXms="
+    },
     "kind-of": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
-      "integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw=="
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.0.tgz",
+      "integrity": "sha512-sUd5AnFyOPh+RW+ZIHd1FHuwM4OFvhKCPVxxhamLxWLpmv1xQ394lzRMmhLQOiMpXvnB64YRLezWaJi5xGk7Dg=="
     },
     "lazy-cache": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-2.0.2.tgz",
-      "integrity": "sha1-uRkKT5EzVGlIQIWfio9whNiCImQ="
+      "integrity": "sha1-uRkKT5EzVGlIQIWfio9whNiCImQ=",
+      "requires": {
+        "set-getter": "0.1.0"
+      }
     },
     "lcid": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/lcid/-/lcid-1.0.0.tgz",
-      "integrity": "sha1-MIrMr6C8SDo4Z7S28rlQYlHRuDU="
+      "integrity": "sha1-MIrMr6C8SDo4Z7S28rlQYlHRuDU=",
+      "requires": {
+        "invert-kv": "1.0.0"
+      }
     },
     "leven": {
       "version": "2.1.0",
@@ -7130,12 +7144,22 @@
     "levn": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/levn/-/levn-0.3.0.tgz",
-      "integrity": "sha1-OwmSTt+fCDwEkP3UwLxEIeBHZO4="
+      "integrity": "sha1-OwmSTt+fCDwEkP3UwLxEIeBHZO4=",
+      "requires": {
+        "prelude-ls": "1.1.2",
+        "type-check": "0.3.2"
+      }
     },
     "load-json-file": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
       "integrity": "sha1-eUfkIUmvgNaWy/eXvKq8/h/inKg=",
+      "requires": {
+        "graceful-fs": "4.1.11",
+        "parse-json": "2.2.0",
+        "pify": "2.3.0",
+        "strip-bom": "3.0.0"
+      },
       "dependencies": {
         "pify": {
           "version": "2.3.0",
@@ -7152,12 +7176,21 @@
     "loader-utils": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
-      "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0="
+      "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0=",
+      "requires": {
+        "big.js": "3.2.0",
+        "emojis-list": "2.1.0",
+        "json5": "0.5.1"
+      }
     },
     "locate-path": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-2.0.0.tgz",
-      "integrity": "sha1-K1aLJl7slExtnA3pw9u7ygNUzY4="
+      "integrity": "sha1-K1aLJl7slExtnA3pw9u7ygNUzY4=",
+      "requires": {
+        "p-locate": "2.0.0",
+        "path-exists": "3.0.0"
+      }
     },
     "lock": {
       "version": "0.1.4",
@@ -7187,12 +7220,24 @@
     "lodash._baseassign": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/lodash._baseassign/-/lodash._baseassign-3.2.0.tgz",
-      "integrity": "sha1-jDigmVAPIVrQnlnxci/QxSv+Ck4="
+      "integrity": "sha1-jDigmVAPIVrQnlnxci/QxSv+Ck4=",
+      "requires": {
+        "lodash._basecopy": "3.0.1",
+        "lodash.keys": "3.1.2"
+      }
     },
     "lodash._baseclone": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/lodash._baseclone/-/lodash._baseclone-3.3.0.tgz",
-      "integrity": "sha1-MDUZv2OT/n5C802LYw73eU41Qrc="
+      "integrity": "sha1-MDUZv2OT/n5C802LYw73eU41Qrc=",
+      "requires": {
+        "lodash._arraycopy": "3.0.0",
+        "lodash._arrayeach": "3.0.0",
+        "lodash._baseassign": "3.2.0",
+        "lodash._basefor": "3.0.3",
+        "lodash.isarray": "3.0.4",
+        "lodash.keys": "3.1.2"
+      }
     },
     "lodash._basecopy": {
       "version": "3.0.1",
@@ -7252,7 +7297,12 @@
     "lodash.create": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/lodash.create/-/lodash.create-3.1.1.tgz",
-      "integrity": "sha1-1/KEnw29p+BGgruM1yqwIkYd6+c="
+      "integrity": "sha1-1/KEnw29p+BGgruM1yqwIkYd6+c=",
+      "requires": {
+        "lodash._baseassign": "3.2.0",
+        "lodash._basecreate": "3.0.3",
+        "lodash._isiterateecall": "3.0.9"
+      }
     },
     "lodash.debounce": {
       "version": "4.0.8",
@@ -7307,7 +7357,12 @@
     "lodash.keys": {
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz",
-      "integrity": "sha1-TbwEcrFWvlCgsoaFXRvQsMZWCYo="
+      "integrity": "sha1-TbwEcrFWvlCgsoaFXRvQsMZWCYo=",
+      "requires": {
+        "lodash._getnative": "3.9.1",
+        "lodash.isarguments": "3.1.0",
+        "lodash.isarray": "3.0.4"
+      }
     },
     "lodash.map": {
       "version": "4.6.0",
@@ -7375,9 +7430,9 @@
       "integrity": "sha1-GJB4yUq5BT7iFaCs2/JCROoPZQI="
     },
     "lolex": {
-      "version": "2.1.3",
-      "resolved": "https://registry.npmjs.org/lolex/-/lolex-2.1.3.tgz",
-      "integrity": "sha512-BdHq78SeI+6PAUtl4atDuCt7L6E4fab3mSRtqxm4ywaXe4uP7jZ0TTcFNuU20syUjxZc2l7jFqKVMJ+AX0LnpQ=="
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/lolex/-/lolex-2.3.0.tgz",
+      "integrity": "sha512-rPO6R1t8PjYL6xbsFUg7aByKkWAql907na6powPBORVs4DCm8aMBUkL4+6CXO0gEIV8vtu3mWV0FB8ZaCYPBmA=="
     },
     "longest": {
       "version": "1.0.1",
@@ -7387,17 +7442,28 @@
     "loose-envify": {
       "version": "1.3.1",
       "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.3.1.tgz",
-      "integrity": "sha1-0aitM/qc4OcT1l/dCsi3SNR4yEg="
+      "integrity": "sha1-0aitM/qc4OcT1l/dCsi3SNR4yEg=",
+      "requires": {
+        "js-tokens": "3.0.2"
+      }
     },
     "loud-rejection": {
       "version": "1.6.0",
       "resolved": "https://registry.npmjs.org/loud-rejection/-/loud-rejection-1.6.0.tgz",
-      "integrity": "sha1-W0b4AUft7leIcPCG0Eghz5mOVR8="
+      "integrity": "sha1-W0b4AUft7leIcPCG0Eghz5mOVR8=",
+      "requires": {
+        "currently-unhandled": "0.4.1",
+        "signal-exit": "3.0.2"
+      }
     },
     "lru-cache": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.1.tgz",
-      "integrity": "sha512-q4spe4KTfsAS1SUHLO0wz8Qiyf1+vMIAgpRYioFYDMNqKfHQbg+AVDH3i4fvpl71/P1L0dBl+fQi+P37UYf0ew=="
+      "integrity": "sha512-q4spe4KTfsAS1SUHLO0wz8Qiyf1+vMIAgpRYioFYDMNqKfHQbg+AVDH3i4fvpl71/P1L0dBl+fQi+P37UYf0ew==",
+      "requires": {
+        "pseudomap": "1.0.2",
+        "yallist": "2.1.2"
+      }
     },
     "macaddress": {
       "version": "0.2.8",
@@ -7405,31 +7471,42 @@
       "integrity": "sha1-WQTcU3w57G2+/q6QIycTX6hRHxI="
     },
     "make-dir": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-1.0.0.tgz",
-      "integrity": "sha1-l6ARdR6R3YfPre9Ygy67BJNt6Xg=",
-      "dependencies": {
-        "pify": {
-          "version": "2.3.0",
-          "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
-          "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
-        }
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-1.1.0.tgz",
+      "integrity": "sha512-0Pkui4wLJ7rxvmfUvs87skoEaxmu0hCUApF8nonzpl7q//FWp9zu8W61Scz4sd/kUiqDxvUhtoam2efDyiBzcA==",
+      "requires": {
+        "pify": "3.0.0"
       }
     },
     "makeerror": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/makeerror/-/makeerror-1.0.11.tgz",
-      "integrity": "sha1-4BpckQnyr3lmDk6LlYd5AYT1qWw="
+      "integrity": "sha1-4BpckQnyr3lmDk6LlYd5AYT1qWw=",
+      "requires": {
+        "tmpl": "1.0.4"
+      }
     },
     "mantra-core": {
       "version": "1.7.0",
       "resolved": "https://registry.npmjs.org/mantra-core/-/mantra-core-1.7.0.tgz",
       "integrity": "sha1-qMg+jO6D72pzgxMVGf6AMa1UY4Y=",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "react-komposer": "1.13.1",
+        "react-simple-di": "1.2.0"
+      },
       "dependencies": {
         "react-komposer": {
           "version": "1.13.1",
           "resolved": "https://registry.npmjs.org/react-komposer/-/react-komposer-1.13.1.tgz",
-          "integrity": "sha1-S4rEvMcTI710E9yrlcgxGX9Q7tA="
+          "integrity": "sha1-S4rEvMcTI710E9yrlcgxGX9Q7tA=",
+          "requires": {
+            "babel-runtime": "6.26.0",
+            "hoist-non-react-statics": "1.2.0",
+            "invariant": "2.2.2",
+            "mobx": "2.7.0",
+            "shallowequal": "0.2.2"
+          }
         }
       }
     },
@@ -7446,7 +7523,10 @@
     "map-visit": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/map-visit/-/map-visit-1.0.0.tgz",
-      "integrity": "sha1-7Nyo8TFE5mDxtb1B8S80edmN+48="
+      "integrity": "sha1-7Nyo8TFE5mDxtb1B8S80edmN+48=",
+      "requires": {
+        "object-visit": "1.0.1"
+      }
     },
     "marked": {
       "version": "0.3.6",
@@ -7457,6 +7537,13 @@
       "version": "1.7.0",
       "resolved": "https://registry.npmjs.org/marked-terminal/-/marked-terminal-1.7.0.tgz",
       "integrity": "sha1-yMRgiBx3LHYEtkNnAH7l938SWQQ=",
+      "requires": {
+        "cardinal": "1.0.0",
+        "chalk": "1.1.3",
+        "cli-table": "0.3.1",
+        "lodash.assign": "4.2.0",
+        "node-emoji": "1.8.1"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -7466,7 +7553,14 @@
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          }
         },
         "supports-color": {
           "version": "2.0.0",
@@ -7484,11 +7578,19 @@
       "version": "1.3.4",
       "resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.4.tgz",
       "integrity": "sha1-6b296UogpawYsENA/Fdk1bCdkB0=",
+      "requires": {
+        "hash-base": "3.0.4",
+        "inherits": "2.0.3"
+      },
       "dependencies": {
         "hash-base": {
           "version": "3.0.4",
           "resolved": "https://registry.npmjs.org/hash-base/-/hash-base-3.0.4.tgz",
-          "integrity": "sha1-X8hoaEfs1zSZQDMZprCj8/auSRg="
+          "integrity": "sha1-X8hoaEfs1zSZQDMZprCj8/auSRg=",
+          "requires": {
+            "inherits": "2.0.3",
+            "safe-buffer": "5.1.1"
+          }
         }
       }
     },
@@ -7500,27 +7602,57 @@
     "mem": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/mem/-/mem-1.1.0.tgz",
-      "integrity": "sha1-Xt1StIXKHZAP5kiVUFOZoN+kX3Y="
+      "integrity": "sha1-Xt1StIXKHZAP5kiVUFOZoN+kX3Y=",
+      "requires": {
+        "mimic-fn": "1.1.0"
+      }
     },
     "memory-fs": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.4.1.tgz",
-      "integrity": "sha1-OpoguEYlI+RHz7x+i7gO1me/xVI="
+      "integrity": "sha1-OpoguEYlI+RHz7x+i7gO1me/xVI=",
+      "requires": {
+        "errno": "0.1.4",
+        "readable-stream": "2.3.3"
+      }
     },
     "meow": {
       "version": "3.7.0",
       "resolved": "https://registry.npmjs.org/meow/-/meow-3.7.0.tgz",
       "integrity": "sha1-cstmi0JSKCkKu/qFaJJYcwioAfs=",
+      "requires": {
+        "camelcase-keys": "2.1.0",
+        "decamelize": "1.2.0",
+        "loud-rejection": "1.6.0",
+        "map-obj": "1.0.1",
+        "minimist": "1.2.0",
+        "normalize-package-data": "2.4.0",
+        "object-assign": "4.1.1",
+        "read-pkg-up": "1.0.1",
+        "redent": "1.0.0",
+        "trim-newlines": "1.0.0"
+      },
       "dependencies": {
         "find-up": {
           "version": "1.1.2",
           "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
-          "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8="
+          "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8=",
+          "requires": {
+            "path-exists": "2.1.0",
+            "pinkie-promise": "2.0.1"
+          }
         },
         "load-json-file": {
           "version": "1.1.0",
           "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
-          "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA="
+          "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
+          "requires": {
+            "graceful-fs": "4.1.11",
+            "parse-json": "2.2.0",
+            "pify": "2.3.0",
+            "pinkie-promise": "2.0.1",
+            "strip-bom": "2.0.0"
+          }
         },
         "minimist": {
           "version": "1.2.0",
@@ -7530,12 +7662,20 @@
         "path-exists": {
           "version": "2.1.0",
           "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
-          "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s="
+          "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s=",
+          "requires": {
+            "pinkie-promise": "2.0.1"
+          }
         },
         "path-type": {
           "version": "1.1.0",
           "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
-          "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE="
+          "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE=",
+          "requires": {
+            "graceful-fs": "4.1.11",
+            "pify": "2.3.0",
+            "pinkie-promise": "2.0.1"
+          }
         },
         "pify": {
           "version": "2.3.0",
@@ -7545,17 +7685,29 @@
         "read-pkg": {
           "version": "1.1.0",
           "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
-          "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg="
+          "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg=",
+          "requires": {
+            "load-json-file": "1.1.0",
+            "normalize-package-data": "2.4.0",
+            "path-type": "1.1.0"
+          }
         },
         "read-pkg-up": {
           "version": "1.0.1",
           "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
-          "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI="
+          "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI=",
+          "requires": {
+            "find-up": "1.1.2",
+            "read-pkg": "1.1.0"
+          }
         },
         "strip-bom": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
-          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4=",
+          "requires": {
+            "is-utf8": "0.2.1"
+          }
         }
       }
     },
@@ -7575,14 +7727,33 @@
       "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4="
     },
     "micromatch": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-3.1.0.tgz",
-      "integrity": "sha512-3StSelAE+hnRvMs8IdVW7Uhk8CVed5tp+kLLGlBP6WiRAXS21GPGu/Nat4WNPXj2Eoc24B02SaeoyozPMfj0/g=="
+      "version": "3.1.4",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-3.1.4.tgz",
+      "integrity": "sha512-kFRtviKYoAJT+t7HggMl0tBFGNAKLw/S7N+CO9qfEQyisob1Oy4pao+geRbkyeEd+V9aOkvZ4mhuyPvI/q9Sfg==",
+      "requires": {
+        "arr-diff": "4.0.0",
+        "array-unique": "0.3.2",
+        "braces": "2.3.0",
+        "define-property": "1.0.0",
+        "extend-shallow": "2.0.1",
+        "extglob": "2.0.2",
+        "fragment-cache": "0.2.1",
+        "kind-of": "6.0.0",
+        "nanomatch": "1.2.5",
+        "object.pick": "1.3.0",
+        "regex-not": "1.0.0",
+        "snapdragon": "0.8.1",
+        "to-regex": "3.0.1"
+      }
     },
     "miller-rabin": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/miller-rabin/-/miller-rabin-4.0.1.tgz",
-      "integrity": "sha512-115fLhvZVqWwHPbClyntxEVfVDfl9DLLTuJvq3g2O/Oxi8AiNouAHvDSzHS0viUJc+V5vm3eq91Xwqn9dp4jRA=="
+      "integrity": "sha512-115fLhvZVqWwHPbClyntxEVfVDfl9DLLTuJvq3g2O/Oxi8AiNouAHvDSzHS0viUJc+V5vm3eq91Xwqn9dp4jRA==",
+      "requires": {
+        "bn.js": "4.11.8",
+        "brorand": "1.1.0"
+      }
     },
     "mime": {
       "version": "1.4.1",
@@ -7597,7 +7768,10 @@
     "mime-types": {
       "version": "2.1.17",
       "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.17.tgz",
-      "integrity": "sha1-Cdejk/A+mVp5+K+Fe3Cp4KsWVXo="
+      "integrity": "sha1-Cdejk/A+mVp5+K+Fe3Cp4KsWVXo=",
+      "requires": {
+        "mime-db": "1.30.0"
+      }
     },
     "mimic-fn": {
       "version": "1.1.0",
@@ -7607,7 +7781,10 @@
     "min-document": {
       "version": "2.19.0",
       "resolved": "https://registry.npmjs.org/min-document/-/min-document-2.19.0.tgz",
-      "integrity": "sha1-e9KC4/WELtKVu3SM3Z8f+iyCRoU="
+      "integrity": "sha1-e9KC4/WELtKVu3SM3Z8f+iyCRoU=",
+      "requires": {
+        "dom-walk": "0.1.1"
+      }
     },
     "minimalistic-assert": {
       "version": "1.0.0",
@@ -7622,7 +7799,10 @@
     "minimatch": {
       "version": "3.0.4",
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
-      "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA=="
+      "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==",
+      "requires": {
+        "brace-expansion": "1.1.8"
+      }
     },
     "minimist": {
       "version": "0.0.8",
@@ -7632,12 +7812,20 @@
     "mixin-deep": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/mixin-deep/-/mixin-deep-1.2.0.tgz",
-      "integrity": "sha1-0CuMb4ttS49ZgtP9AJxJGYUcP+I="
+      "integrity": "sha1-0CuMb4ttS49ZgtP9AJxJGYUcP+I=",
+      "requires": {
+        "for-in": "1.0.2",
+        "is-extendable": "0.1.1"
+      }
     },
     "mixin-object": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/mixin-object/-/mixin-object-2.0.1.tgz",
       "integrity": "sha1-T7lJRB2rGCVA8f4DW6YOGUel5X4=",
+      "requires": {
+        "for-in": "0.1.8",
+        "is-extendable": "0.1.1"
+      },
       "dependencies": {
         "for-in": {
           "version": "0.1.8",
@@ -7649,7 +7837,10 @@
     "mkdirp": {
       "version": "0.5.1",
       "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
-      "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM="
+      "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
+      "requires": {
+        "minimist": "0.0.8"
+      }
     },
     "mkpath": {
       "version": "0.1.0",
@@ -7661,25 +7852,39 @@
       "resolved": "https://registry.npmjs.org/mobx/-/mobx-2.7.0.tgz",
       "integrity": "sha1-zz2C0YwMp/RY2PKiQIF7PcflSgE="
     },
-    "mustache": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/mustache/-/mustache-2.3.0.tgz",
-      "integrity": "sha1-QCj3d4sXcIpImTCm5SrDvKDaQdA="
-    },
     "mocha": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz",
       "integrity": "sha1-0pt0KNP1LILi5l3x7LcGThqrv7U=",
+      "requires": {
+        "browser-stdout": "1.3.0",
+        "commander": "2.9.0",
+        "debug": "2.6.0",
+        "diff": "3.2.0",
+        "escape-string-regexp": "1.0.5",
+        "glob": "7.1.1",
+        "growl": "1.9.2",
+        "json3": "3.3.2",
+        "lodash.create": "3.1.1",
+        "mkdirp": "0.5.1",
+        "supports-color": "3.1.2"
+      },
       "dependencies": {
         "commander": {
           "version": "2.9.0",
           "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
-          "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q="
+          "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q=",
+          "requires": {
+            "graceful-readlink": "1.0.1"
+          }
         },
         "debug": {
           "version": "2.6.0",
           "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz",
-          "integrity": "sha1-vFlryr52F/Edn6FTYe3tVgi4SZs="
+          "integrity": "sha1-vFlryr52F/Edn6FTYe3tVgi4SZs=",
+          "requires": {
+            "ms": "0.7.2"
+          }
         },
         "diff": {
           "version": "3.2.0",
@@ -7689,7 +7894,15 @@
         "glob": {
           "version": "7.1.1",
           "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.1.tgz",
-          "integrity": "sha1-gFIR3wT6rxxjo2ADBs31reULLsg="
+          "integrity": "sha1-gFIR3wT6rxxjo2ADBs31reULLsg=",
+          "requires": {
+            "fs.realpath": "1.0.0",
+            "inflight": "1.0.6",
+            "inherits": "2.0.3",
+            "minimatch": "3.0.4",
+            "once": "1.4.0",
+            "path-is-absolute": "1.0.1"
+          }
         },
         "has-flag": {
           "version": "1.0.0",
@@ -7704,7 +7917,10 @@
         "supports-color": {
           "version": "3.1.2",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz",
-          "integrity": "sha1-cqJiiU2dQIuVbKBf83su2KbiotU="
+          "integrity": "sha1-cqJiiU2dQIuVbKBf83su2KbiotU=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -7721,13 +7937,22 @@
     "multicast-dns": {
       "version": "6.1.1",
       "resolved": "https://registry.npmjs.org/multicast-dns/-/multicast-dns-6.1.1.tgz",
-      "integrity": "sha1-bn3oalcIcqsXBYrepxYLvsqBTd4="
+      "integrity": "sha1-bn3oalcIcqsXBYrepxYLvsqBTd4=",
+      "requires": {
+        "dns-packet": "1.2.2",
+        "thunky": "0.1.0"
+      }
     },
     "multicast-dns-service-types": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/multicast-dns-service-types/-/multicast-dns-service-types-1.1.0.tgz",
       "integrity": "sha1-iZ8R2WhuXgXLkbNdXw5jt3PPyQE="
     },
+    "mustache": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/mustache/-/mustache-2.3.0.tgz",
+      "integrity": "sha1-QCj3d4sXcIpImTCm5SrDvKDaQdA="
+    },
     "mute-stream": {
       "version": "0.0.7",
       "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.7.tgz",
@@ -7739,9 +7964,29 @@
       "integrity": "sha1-2Vv3IeyHfgjbJ27T/G63j5CDrUY="
     },
     "nanomatch": {
-      "version": "1.2.3",
-      "resolved": "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.3.tgz",
-      "integrity": "sha512-HqDMQWJlwpXbfKDpAnkc6AJQh5PFqVlrjYbruDjYVAS+05TQUb1qhIde4G9jMzHbs/u6bgEok1jMAV4yJzoh+w=="
+      "version": "1.2.5",
+      "resolved": "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.5.tgz",
+      "integrity": "sha512-ZHJamn1utzcUvW8Bais+Kk7pobp6dKmUEKOSQ/HI2glGwOMA/GvjRRKlLyORBUrdRXnwTU/6LIBcW7jYSlutgg==",
+      "requires": {
+        "arr-diff": "4.0.0",
+        "array-unique": "0.3.2",
+        "define-property": "1.0.0",
+        "extend-shallow": "2.0.1",
+        "fragment-cache": "0.2.1",
+        "is-odd": "1.0.0",
+        "kind-of": "5.1.0",
+        "object.pick": "1.3.0",
+        "regex-not": "1.0.0",
+        "snapdragon": "0.8.1",
+        "to-regex": "3.0.1"
+      },
+      "dependencies": {
+        "kind-of": {
+          "version": "5.1.0",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
+          "integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw=="
+        }
+      }
     },
     "native-promise-only": {
       "version": "0.8.1",
@@ -7766,12 +8011,27 @@
     "ngrok": {
       "version": "2.2.23",
       "resolved": "https://registry.npmjs.org/ngrok/-/ngrok-2.2.23.tgz",
-      "integrity": "sha1-dSxID4BWMzUmT3bc6/Tq9DSa90c="
+      "integrity": "sha1-dSxID4BWMzUmT3bc6/Tq9DSa90c=",
+      "requires": {
+        "@types/node": "8.0.26",
+        "async": "2.6.0",
+        "decompress-zip": "0.3.0",
+        "lock": "0.1.4",
+        "request": "2.83.0",
+        "uuid": "3.1.0"
+      }
     },
     "nise": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/nise/-/nise-1.1.1.tgz",
-      "integrity": "sha512-f5DMJB0MqBaSuP2NAwPx7HyVKPdaozds0KsNe9XIP3npKWt/QUg73l5TTLRTSwfG/Y3AB0ktacuxX4QNcg6vVw==",
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/nise/-/nise-1.2.0.tgz",
+      "integrity": "sha512-q9jXh3UNsMV28KeqI43ILz5+c3l+RiNW8mhurEwCKckuHQbL+hTJIKKTiUlCPKlgQ/OukFvSnKB/Jk3+sFbkGA==",
+      "requires": {
+        "formatio": "1.2.0",
+        "just-extend": "1.1.27",
+        "lolex": "1.6.0",
+        "path-to-regexp": "1.7.0",
+        "text-encoding": "0.6.4"
+      },
       "dependencies": {
         "lolex": {
           "version": "1.6.0",
@@ -7783,17 +8043,27 @@
     "node-dir": {
       "version": "0.1.17",
       "resolved": "https://registry.npmjs.org/node-dir/-/node-dir-0.1.17.tgz",
-      "integrity": "sha1-X1Zl2TNRM1yqvvjxxVRRbPXx5OU="
+      "integrity": "sha1-X1Zl2TNRM1yqvvjxxVRRbPXx5OU=",
+      "requires": {
+        "minimatch": "3.0.4"
+      }
     },
     "node-emoji": {
       "version": "1.8.1",
       "resolved": "https://registry.npmjs.org/node-emoji/-/node-emoji-1.8.1.tgz",
-      "integrity": "sha512-+ktMAh1Jwas+TnGodfCfjUbJKoANqPaJFN0z0iqh41eqD8dvguNzcitVSBSVK1pidz0AqGbLKcoVuVLRVZ/aVg=="
+      "integrity": "sha512-+ktMAh1Jwas+TnGodfCfjUbJKoANqPaJFN0z0iqh41eqD8dvguNzcitVSBSVK1pidz0AqGbLKcoVuVLRVZ/aVg==",
+      "requires": {
+        "lodash.toarray": "4.4.0"
+      }
     },
     "node-fetch": {
       "version": "1.6.3",
       "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.6.3.tgz",
-      "integrity": "sha1-3CNO3WSJmC1Y6PDbT2lQKavNjAQ="
+      "integrity": "sha1-3CNO3WSJmC1Y6PDbT2lQKavNjAQ=",
+      "requires": {
+        "encoding": "0.1.12",
+        "is-stream": "1.1.0"
+      }
     },
     "node-forge": {
       "version": "0.6.33",
@@ -7804,6 +8074,21 @@
       "version": "3.6.2",
       "resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-3.6.2.tgz",
       "integrity": "sha1-m/vlRWIoYoSDjnUOrAUpWFP6HGA=",
+      "requires": {
+        "fstream": "1.0.11",
+        "glob": "7.1.2",
+        "graceful-fs": "4.1.11",
+        "minimatch": "3.0.4",
+        "mkdirp": "0.5.1",
+        "nopt": "3.0.6",
+        "npmlog": "4.1.2",
+        "osenv": "0.1.4",
+        "request": "2.83.0",
+        "rimraf": "2.6.2",
+        "semver": "5.3.0",
+        "tar": "2.2.1",
+        "which": "1.3.0"
+      },
       "dependencies": {
         "semver": {
           "version": "5.3.0",
@@ -7821,6 +8106,31 @@
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz",
       "integrity": "sha1-o6WeyXAkmFtG6Vg3lkb5bEthZkY=",
+      "requires": {
+        "assert": "1.4.1",
+        "browserify-zlib": "0.1.4",
+        "buffer": "4.9.1",
+        "console-browserify": "1.1.0",
+        "constants-browserify": "1.0.0",
+        "crypto-browserify": "3.12.0",
+        "domain-browser": "1.1.7",
+        "events": "1.1.1",
+        "https-browserify": "0.0.1",
+        "os-browserify": "0.2.1",
+        "path-browserify": "0.0.0",
+        "process": "0.11.10",
+        "punycode": "1.4.1",
+        "querystring-es3": "0.2.1",
+        "readable-stream": "2.3.3",
+        "stream-browserify": "2.0.1",
+        "stream-http": "2.7.2",
+        "string_decoder": "0.10.31",
+        "timers-browserify": "2.0.4",
+        "tty-browserify": "0.0.0",
+        "url": "0.11.0",
+        "util": "0.10.3",
+        "vm-browserify": "0.0.4"
+      },
       "dependencies": {
         "string_decoder": {
           "version": "0.10.31",
@@ -7832,12 +8142,38 @@
     "node-notifier": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-5.1.2.tgz",
-      "integrity": "sha1-L6nhJgX6EACdRFSdb82KY93g5P8="
+      "integrity": "sha1-L6nhJgX6EACdRFSdb82KY93g5P8=",
+      "requires": {
+        "growly": "1.3.0",
+        "semver": "5.4.1",
+        "shellwords": "0.1.1",
+        "which": "1.3.0"
+      }
     },
     "node-sass": {
-      "version": "4.5.3",
-      "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.5.3.tgz",
-      "integrity": "sha1-0JydEXlkEjnRuX/8YjH9zsU+FWg=",
+      "version": "4.6.0",
+      "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.6.0.tgz",
+      "integrity": "sha512-rh0CvkxpYdQdbWx4EQfunmG0+99BVyVwQHlFE+yUzc6lteF5K3WUcJ0bdmv9E9CqQA1RfuMyvmpDP99cmBObow==",
+      "requires": {
+        "async-foreach": "0.1.3",
+        "chalk": "1.1.3",
+        "cross-spawn": "3.0.1",
+        "gaze": "1.1.2",
+        "get-stdin": "4.0.1",
+        "glob": "7.1.2",
+        "in-publish": "2.0.0",
+        "lodash.assign": "4.2.0",
+        "lodash.clonedeep": "4.5.0",
+        "lodash.mergewith": "4.6.0",
+        "meow": "3.7.0",
+        "mkdirp": "0.5.1",
+        "nan": "2.7.0",
+        "node-gyp": "3.6.2",
+        "npmlog": "4.1.2",
+        "request": "2.83.0",
+        "sass-graph": "2.2.4",
+        "stdout-stream": "1.4.0"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -7847,12 +8183,23 @@
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          }
         },
         "cross-spawn": {
           "version": "3.0.1",
           "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-3.0.1.tgz",
-          "integrity": "sha1-ElYDfsufDF9549bvE14wdwGEuYI="
+          "integrity": "sha1-ElYDfsufDF9549bvE14wdwGEuYI=",
+          "requires": {
+            "lru-cache": "4.1.1",
+            "which": "1.3.0"
+          }
         },
         "supports-color": {
           "version": "2.0.0",
@@ -7864,17 +8211,29 @@
     "nopt": {
       "version": "3.0.6",
       "resolved": "https://registry.npmjs.org/nopt/-/nopt-3.0.6.tgz",
-      "integrity": "sha1-xkZdvwirzU2zWTF/eaxopkayj/k="
+      "integrity": "sha1-xkZdvwirzU2zWTF/eaxopkayj/k=",
+      "requires": {
+        "abbrev": "1.1.1"
+      }
     },
     "normalize-package-data": {
       "version": "2.4.0",
       "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.4.0.tgz",
-      "integrity": "sha512-9jjUFbTPfEy3R/ad/2oNbKtW9Hgovl5O1FvFWKkKblNXoN/Oou6+9+KKohPK13Yc3/TyunyWhJp6gvRNR/PPAw=="
+      "integrity": "sha512-9jjUFbTPfEy3R/ad/2oNbKtW9Hgovl5O1FvFWKkKblNXoN/Oou6+9+KKohPK13Yc3/TyunyWhJp6gvRNR/PPAw==",
+      "requires": {
+        "hosted-git-info": "2.5.0",
+        "is-builtin-module": "1.0.0",
+        "semver": "5.4.1",
+        "validate-npm-package-license": "3.0.1"
+      }
     },
     "normalize-path": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-2.1.1.tgz",
-      "integrity": "sha1-GrKLVW4Zg2Oowab35vogE3/mrtk="
+      "integrity": "sha1-GrKLVW4Zg2Oowab35vogE3/mrtk=",
+      "requires": {
+        "remove-trailing-separator": "1.1.0"
+      }
     },
     "normalize-range": {
       "version": "0.1.2",
@@ -7884,22 +8243,40 @@
     "normalize-url": {
       "version": "1.9.1",
       "resolved": "https://registry.npmjs.org/normalize-url/-/normalize-url-1.9.1.tgz",
-      "integrity": "sha1-LMDWazHqIwNkWENuNiDYWVTGbDw="
+      "integrity": "sha1-LMDWazHqIwNkWENuNiDYWVTGbDw=",
+      "requires": {
+        "object-assign": "4.1.1",
+        "prepend-http": "1.0.4",
+        "query-string": "4.3.4",
+        "sort-keys": "1.1.2"
+      }
     },
     "npm-run-path": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-2.0.2.tgz",
-      "integrity": "sha1-NakjLfo11wZ7TLLd8jV7GHFTbF8="
+      "integrity": "sha1-NakjLfo11wZ7TLLd8jV7GHFTbF8=",
+      "requires": {
+        "path-key": "2.0.1"
+      }
     },
     "npmlog": {
       "version": "4.1.2",
       "resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.2.tgz",
-      "integrity": "sha512-2uUqazuKlTaSI/dC8AzicUck7+IrEaOnN/e0jd3Xtt1KcGpwx30v50mL7oPyr/h9bL3E4aZccVwpwP+5W9Vjkg=="
+      "integrity": "sha512-2uUqazuKlTaSI/dC8AzicUck7+IrEaOnN/e0jd3Xtt1KcGpwx30v50mL7oPyr/h9bL3E4aZccVwpwP+5W9Vjkg==",
+      "requires": {
+        "are-we-there-yet": "1.1.4",
+        "console-control-strings": "1.1.0",
+        "gauge": "2.7.4",
+        "set-blocking": "2.0.0"
+      }
     },
     "nth-check": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-1.0.1.tgz",
-      "integrity": "sha1-mSms32KPwsQQmN6rgqxYDPFJquQ="
+      "integrity": "sha1-mSms32KPwsQQmN6rgqxYDPFJquQ=",
+      "requires": {
+        "boolbase": "1.0.0"
+      }
     },
     "num2fraction": {
       "version": "1.2.2",
@@ -7930,16 +8307,29 @@
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/object-copy/-/object-copy-0.1.0.tgz",
       "integrity": "sha1-fn2Fi3gb18mRpBupde04EnVOmYw=",
+      "requires": {
+        "copy-descriptor": "0.1.1",
+        "define-property": "0.2.5",
+        "kind-of": "3.2.2"
+      },
       "dependencies": {
         "define-property": {
           "version": "0.2.5",
           "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
-          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY="
+          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY=",
+          "requires": {
+            "is-descriptor": "0.1.6"
+          }
         },
         "is-descriptor": {
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
           "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg==",
+          "requires": {
+            "is-accessor-descriptor": "0.1.6",
+            "is-data-descriptor": "0.1.4",
+            "kind-of": "5.1.0"
+          },
           "dependencies": {
             "kind-of": {
               "version": "5.1.0",
@@ -7951,7 +8341,10 @@
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+          "requires": {
+            "is-buffer": "1.1.6"
+          }
         }
       }
     },
@@ -7968,37 +8361,68 @@
     "object-visit": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/object-visit/-/object-visit-1.0.1.tgz",
-      "integrity": "sha1-95xEk68MU3e1n+OdOV5BBC3QRbs="
+      "integrity": "sha1-95xEk68MU3e1n+OdOV5BBC3QRbs=",
+      "requires": {
+        "isobject": "3.0.1"
+      }
     },
     "object.assign": {
       "version": "4.0.4",
       "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.0.4.tgz",
-      "integrity": "sha1-scnMBE7xuf5jYG/BQau7MuFHMMw="
+      "integrity": "sha1-scnMBE7xuf5jYG/BQau7MuFHMMw=",
+      "requires": {
+        "define-properties": "1.1.2",
+        "function-bind": "1.1.1",
+        "object-keys": "1.0.11"
+      }
     },
     "object.entries": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/object.entries/-/object.entries-1.0.4.tgz",
-      "integrity": "sha1-G/mk3SKI9bM/Opk9JXZh8F0WGl8="
+      "integrity": "sha1-G/mk3SKI9bM/Opk9JXZh8F0WGl8=",
+      "requires": {
+        "define-properties": "1.1.2",
+        "es-abstract": "1.9.0",
+        "function-bind": "1.1.1",
+        "has": "1.0.1"
+      }
     },
     "object.getownpropertydescriptors": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/object.getownpropertydescriptors/-/object.getownpropertydescriptors-2.0.3.tgz",
-      "integrity": "sha1-h1jIRvW0B62rDyNuCYbxSwUcqhY="
+      "integrity": "sha1-h1jIRvW0B62rDyNuCYbxSwUcqhY=",
+      "requires": {
+        "define-properties": "1.1.2",
+        "es-abstract": "1.9.0"
+      }
     },
     "object.omit": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/object.omit/-/object.omit-2.0.1.tgz",
-      "integrity": "sha1-Gpx0SCnznbuFjHbKNXmuKlTr0fo="
+      "integrity": "sha1-Gpx0SCnznbuFjHbKNXmuKlTr0fo=",
+      "requires": {
+        "for-own": "0.1.5",
+        "is-extendable": "0.1.1"
+      }
     },
     "object.pick": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/object.pick/-/object.pick-1.3.0.tgz",
-      "integrity": "sha1-h6EKxMFpS9Lhy/U1kaZhQftd10c="
+      "integrity": "sha1-h6EKxMFpS9Lhy/U1kaZhQftd10c=",
+      "requires": {
+        "isobject": "3.0.1"
+      }
     },
     "object.values": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.0.4.tgz",
-      "integrity": "sha1-5STaCbT2b/Bd9FdUbscqyZ8TBpo="
+      "integrity": "sha1-5STaCbT2b/Bd9FdUbscqyZ8TBpo=",
+      "requires": {
+        "define-properties": "1.1.2",
+        "es-abstract": "1.9.0",
+        "function-bind": "1.1.1",
+        "has": "1.0.1"
+      }
     },
     "obuf": {
       "version": "1.1.1",
@@ -8006,19 +8430,31 @@
       "integrity": "sha1-EEEktsYCxnlogaBCVB0220OlJk4="
     },
     "office-ui-fabric-core": {
-      "version": "9.0.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-9.0.0.tgz",
-      "integrity": "sha512-ufX0JB8kePhv4DZNeOzJmkG4J5JMDUnEx22xlYc7yEpByaqTsVl9CWixrKvOlN27+LsnUoU0GqwgspFZd5OaJw=="
+      "version": "9.1.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-9.1.0.tgz",
+      "integrity": "sha512-VwGbHIT89e+9XdGcb2gdPgKgYQGjRG5peyPNO982znlCSB/UIM9g7gF6JmHpaMHb8xvEScY7UGJ8GRz6GQVBRg=="
     },
     "office-ui-fabric-react": {
-      "version": "5.10.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.10.0.tgz",
-      "integrity": "sha512-+GokE/FRl6tEC1fOm2SNdEaT3Wb9+Ve4VY5oVbn2DMEG+dpy0KZnOqxszvEml+GZUuoRip4ptIT3jIvtO21c5w=="
+      "version": "5.20.3",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.20.3.tgz",
+      "integrity": "sha512-yWS8lq9w8i/B5RfkCuz9idnAwmN1Ciy5CMGqqpfkJ1D+TTuyQ9m7WXfH2dva5ubWaYdHWHboIlWHPguAj5YU/w==",
+      "requires": {
+        "@microsoft/load-themed-styles": "1.7.8",
+        "@uifabric/icons": "5.2.0",
+        "@uifabric/merge-styles": "5.5.1",
+        "@uifabric/styling": "5.6.1",
+        "@uifabric/utilities": "5.3.2",
+        "prop-types": "15.6.0",
+        "tslib": "1.8.0"
+      }
     },
     "on-finished": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz",
-      "integrity": "sha1-IPEzZIGwg811M3mSoWlxqi2QaUc="
+      "integrity": "sha1-IPEzZIGwg811M3mSoWlxqi2QaUc=",
+      "requires": {
+        "ee-first": "1.1.1"
+      }
     },
     "on-headers": {
       "version": "1.0.1",
@@ -8028,12 +8464,18 @@
     "once": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
-      "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E="
+      "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
+      "requires": {
+        "wrappy": "1.0.2"
+      }
     },
     "onetime": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/onetime/-/onetime-2.0.1.tgz",
-      "integrity": "sha1-BnQoIw/WdEOyeUsiu6UotoZ5YtQ="
+      "integrity": "sha1-BnQoIw/WdEOyeUsiu6UotoZ5YtQ=",
+      "requires": {
+        "mimic-fn": "1.1.0"
+      }
     },
     "open": {
       "version": "0.0.5",
@@ -8044,6 +8486,14 @@
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/opencollective/-/opencollective-1.0.3.tgz",
       "integrity": "sha1-ruY3K8KBRFg2kMPKja7PwSDdDvE=",
+      "requires": {
+        "babel-polyfill": "6.23.0",
+        "chalk": "1.1.3",
+        "inquirer": "3.0.6",
+        "minimist": "1.2.0",
+        "node-fetch": "1.6.3",
+        "opn": "4.0.2"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -8053,7 +8503,14 @@
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          }
         },
         "minimist": {
           "version": "1.2.0",
@@ -8075,17 +8532,33 @@
     "opn": {
       "version": "4.0.2",
       "resolved": "https://registry.npmjs.org/opn/-/opn-4.0.2.tgz",
-      "integrity": "sha1-erwi5kTf9jsKltWrfyeQwPAavJU="
+      "integrity": "sha1-erwi5kTf9jsKltWrfyeQwPAavJU=",
+      "requires": {
+        "object-assign": "4.1.1",
+        "pinkie-promise": "2.0.1"
+      }
     },
     "optimist": {
       "version": "0.6.1",
       "resolved": "https://registry.npmjs.org/optimist/-/optimist-0.6.1.tgz",
-      "integrity": "sha1-2j6nRob6IaGaERwybpDrFaAZZoY="
+      "integrity": "sha1-2j6nRob6IaGaERwybpDrFaAZZoY=",
+      "requires": {
+        "minimist": "0.0.8",
+        "wordwrap": "0.0.3"
+      }
     },
     "optionator": {
       "version": "0.8.2",
       "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.8.2.tgz",
       "integrity": "sha1-NkxeQJ0/TWMB1sC0wFu6UBgK62Q=",
+      "requires": {
+        "deep-is": "0.1.3",
+        "fast-levenshtein": "2.0.6",
+        "levn": "0.3.0",
+        "prelude-ls": "1.1.2",
+        "type-check": "0.3.2",
+        "wordwrap": "1.0.0"
+      },
       "dependencies": {
         "wordwrap": {
           "version": "1.0.0",
@@ -8098,11 +8571,18 @@
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/original/-/original-1.0.0.tgz",
       "integrity": "sha1-kUf5P6FpbQS+YeAb1QuurKZWvTs=",
+      "requires": {
+        "url-parse": "1.0.5"
+      },
       "dependencies": {
         "url-parse": {
           "version": "1.0.5",
           "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.0.5.tgz",
-          "integrity": "sha1-CFSGBCKv3P7+tsllxmLUgAFpkns="
+          "integrity": "sha1-CFSGBCKv3P7+tsllxmLUgAFpkns=",
+          "requires": {
+            "querystringify": "0.0.4",
+            "requires-port": "1.0.0"
+          }
         }
       }
     },
@@ -8119,7 +8599,12 @@
     "os-locale": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-2.1.0.tgz",
-      "integrity": "sha512-3sslG3zJbEYcaC4YVAvDorjGxc7tv6KVATnLPZONiljsUncvihe9BQoVCEs0RZ1kmf4Hk9OBqlZfJZWI4GanKA=="
+      "integrity": "sha512-3sslG3zJbEYcaC4YVAvDorjGxc7tv6KVATnLPZONiljsUncvihe9BQoVCEs0RZ1kmf4Hk9OBqlZfJZWI4GanKA==",
+      "requires": {
+        "execa": "0.7.0",
+        "lcid": "1.0.0",
+        "mem": "1.1.0"
+      }
     },
     "os-tmpdir": {
       "version": "1.0.2",
@@ -8129,7 +8614,11 @@
     "osenv": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.4.tgz",
-      "integrity": "sha1-Qv5tWVPfBsgGS+bxdsPQWqqjRkQ="
+      "integrity": "sha1-Qv5tWVPfBsgGS+bxdsPQWqqjRkQ=",
+      "requires": {
+        "os-homedir": "1.0.2",
+        "os-tmpdir": "1.0.2"
+      }
     },
     "p-cancelable": {
       "version": "0.3.0",
@@ -8149,7 +8638,10 @@
     "p-locate": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-2.0.0.tgz",
-      "integrity": "sha1-IKAQOyIqcMj9OcwuWAaA893l7EM="
+      "integrity": "sha1-IKAQOyIqcMj9OcwuWAaA893l7EM=",
+      "requires": {
+        "p-limit": "1.1.0"
+      }
     },
     "p-map": {
       "version": "1.2.0",
@@ -8164,17 +8656,33 @@
     "parse-asn1": {
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.0.tgz",
-      "integrity": "sha1-N8T5t+06tlx0gXtfJICTf7+XxxI="
+      "integrity": "sha1-N8T5t+06tlx0gXtfJICTf7+XxxI=",
+      "requires": {
+        "asn1.js": "4.9.2",
+        "browserify-aes": "1.1.1",
+        "create-hash": "1.1.3",
+        "evp_bytestokey": "1.0.3",
+        "pbkdf2": "3.0.14"
+      }
     },
     "parse-glob": {
       "version": "3.0.4",
       "resolved": "https://registry.npmjs.org/parse-glob/-/parse-glob-3.0.4.tgz",
-      "integrity": "sha1-ssN2z7EfNVE7rdFz7wu246OIORw="
+      "integrity": "sha1-ssN2z7EfNVE7rdFz7wu246OIORw=",
+      "requires": {
+        "glob-base": "0.3.0",
+        "is-dotfile": "1.0.3",
+        "is-extglob": "1.0.0",
+        "is-glob": "2.0.1"
+      }
     },
     "parse-json": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz",
-      "integrity": "sha1-9ID0BDTvgHQfhGkJn43qGPVaTck="
+      "integrity": "sha1-9ID0BDTvgHQfhGkJn43qGPVaTck=",
+      "requires": {
+        "error-ex": "1.3.1"
+      }
     },
     "parse5": {
       "version": "1.5.1",
@@ -8225,6 +8733,9 @@
       "version": "1.7.0",
       "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.7.0.tgz",
       "integrity": "sha1-Wf3g9DW62suhA6hOnTvGTpa5k30=",
+      "requires": {
+        "isarray": "0.0.1"
+      },
       "dependencies": {
         "isarray": {
           "version": "0.0.1",
@@ -8237,6 +8748,9 @@
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/path-type/-/path-type-2.0.0.tgz",
       "integrity": "sha1-8BLMuEFbcJb8LaoQVMPXI4lZTHM=",
+      "requires": {
+        "pify": "2.3.0"
+      },
       "dependencies": {
         "pify": {
           "version": "2.3.0",
@@ -8248,7 +8762,14 @@
     "pbkdf2": {
       "version": "3.0.14",
       "resolved": "https://registry.npmjs.org/pbkdf2/-/pbkdf2-3.0.14.tgz",
-      "integrity": "sha512-gjsZW9O34fm0R7PaLHRJmLLVfSoesxztjPjE9o6R+qtVJij90ltg1joIovN9GKrRW3t1PzhDDG3UMEMFfZ+1wA=="
+      "integrity": "sha512-gjsZW9O34fm0R7PaLHRJmLLVfSoesxztjPjE9o6R+qtVJij90ltg1joIovN9GKrRW3t1PzhDDG3UMEMFfZ+1wA==",
+      "requires": {
+        "create-hash": "1.1.3",
+        "create-hmac": "1.1.6",
+        "ripemd160": "2.0.1",
+        "safe-buffer": "5.1.1",
+        "sha.js": "2.4.9"
+      }
     },
     "performance-now": {
       "version": "2.1.0",
@@ -8268,22 +8789,37 @@
     "pinkie-promise": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz",
-      "integrity": "sha1-ITXW36ejWMBprJsXh3YogihFD/o="
+      "integrity": "sha1-ITXW36ejWMBprJsXh3YogihFD/o=",
+      "requires": {
+        "pinkie": "2.0.4"
+      }
     },
     "pkg-dir": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-2.0.0.tgz",
-      "integrity": "sha1-9tXREJ4Z1j7fQo4L1X4Sd3YVM0s="
+      "integrity": "sha1-9tXREJ4Z1j7fQo4L1X4Sd3YVM0s=",
+      "requires": {
+        "find-up": "2.1.0"
+      }
     },
     "podda": {
       "version": "1.2.2",
       "resolved": "https://registry.npmjs.org/podda/-/podda-1.2.2.tgz",
-      "integrity": "sha1-FbDtvTNK3hRYEzQ/Xs+cEKcc9QA="
+      "integrity": "sha1-FbDtvTNK3hRYEzQ/Xs+cEKcc9QA=",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "immutable": "3.8.2"
+      }
     },
     "portfinder": {
       "version": "1.0.13",
       "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.13.tgz",
       "integrity": "sha1-uzLs2HwnEErm7kS1o8y/Drsa7ek=",
+      "requires": {
+        "async": "1.5.2",
+        "debug": "2.6.9",
+        "mkdirp": "0.5.1"
+      },
       "dependencies": {
         "async": {
           "version": "1.5.2",
@@ -8298,14 +8834,24 @@
       "integrity": "sha1-AerA/jta9xoqbAL+q7jB/vfgDqs="
     },
     "postcss": {
-      "version": "6.0.13",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.13.tgz",
-      "integrity": "sha512-nHsrD1PPTMSJDfU+osVsLtPkSP9YGeoOz4FDLN4r1DW4N5vqL1J+gACzTQHsfwIiWG/0/nV4yCzjTMo1zD8U1g=="
+      "version": "6.0.14",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.14.tgz",
+      "integrity": "sha512-NJ1z0f+1offCgadPhz+DvGm5Mkci+mmV5BqD13S992o0Xk9eElxUfPPF+t2ksH5R/17gz4xVK8KWocUQ5o3Rog==",
+      "requires": {
+        "chalk": "2.3.0",
+        "source-map": "0.6.1",
+        "supports-color": "4.5.0"
+      }
     },
     "postcss-calc": {
       "version": "5.3.1",
       "resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-5.3.1.tgz",
       "integrity": "sha1-d7rnypKK2FcW4v2kLyYb98HWW14=",
+      "requires": {
+        "postcss": "5.2.18",
+        "postcss-message-helpers": "2.0.0",
+        "reduce-css-calc": "1.3.0"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -8316,6 +8862,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -8332,7 +8885,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -8342,7 +8901,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -8350,6 +8912,11 @@
       "version": "2.2.2",
       "resolved": "https://registry.npmjs.org/postcss-colormin/-/postcss-colormin-2.2.2.tgz",
       "integrity": "sha1-ZjFBfV8OkJo9fsJrJMio0eT5bks=",
+      "requires": {
+        "colormin": "1.1.2",
+        "postcss": "5.2.18",
+        "postcss-value-parser": "3.3.0"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -8360,6 +8927,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -8376,7 +8950,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -8386,7 +8966,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -8394,6 +8977,10 @@
       "version": "2.6.1",
       "resolved": "https://registry.npmjs.org/postcss-convert-values/-/postcss-convert-values-2.6.1.tgz",
       "integrity": "sha1-u9hZPFwf0uPRwyK7kl3K6Nrk1i0=",
+      "requires": {
+        "postcss": "5.2.18",
+        "postcss-value-parser": "3.3.0"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -8404,6 +8991,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -8420,7 +9014,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -8430,7 +9030,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -8438,6 +9041,9 @@
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/postcss-discard-comments/-/postcss-discard-comments-2.0.4.tgz",
       "integrity": "sha1-vv6J+v1bPazlzM5Rt2uBUUvgDj0=",
+      "requires": {
+        "postcss": "5.2.18"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -8448,6 +9054,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -8464,7 +9077,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -8474,7 +9093,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -8482,6 +9104,9 @@
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/postcss-discard-duplicates/-/postcss-discard-duplicates-2.1.0.tgz",
       "integrity": "sha1-uavye4isGIFYpesSq8riAmO5GTI=",
+      "requires": {
+        "postcss": "5.2.18"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -8492,6 +9117,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -8508,7 +9140,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -8518,7 +9156,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -8526,6 +9167,9 @@
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/postcss-discard-empty/-/postcss-discard-empty-2.1.0.tgz",
       "integrity": "sha1-0rS9nVztXr2Nyt52QMfXzX9PkrU=",
+      "requires": {
+        "postcss": "5.2.18"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -8536,6 +9180,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -8552,7 +9203,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -8562,7 +9219,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -8570,6 +9230,9 @@
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/postcss-discard-overridden/-/postcss-discard-overridden-0.1.1.tgz",
       "integrity": "sha1-ix6vVU9ob7KIzYdMVWZ7CqNmjVg=",
+      "requires": {
+        "postcss": "5.2.18"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -8580,6 +9243,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -8596,7 +9266,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -8606,7 +9282,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -8614,6 +9293,10 @@
       "version": "2.2.3",
       "resolved": "https://registry.npmjs.org/postcss-discard-unused/-/postcss-discard-unused-2.2.3.tgz",
       "integrity": "sha1-vOMLLMWR/8Y0Mitfs0ZLbZNPRDM=",
+      "requires": {
+        "postcss": "5.2.18",
+        "uniqs": "2.0.0"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -8624,6 +9307,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -8640,7 +9330,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -8650,7 +9346,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -8658,6 +9357,10 @@
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/postcss-filter-plugins/-/postcss-filter-plugins-2.0.2.tgz",
       "integrity": "sha1-bYWGJTTXNaxCDkqFgG4fXUKG2Ew=",
+      "requires": {
+        "postcss": "5.2.18",
+        "uniqid": "4.1.1"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -8668,6 +9371,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -8684,7 +9394,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -8694,39 +9410,70 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
     "postcss-flexbugs-fixes": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/postcss-flexbugs-fixes/-/postcss-flexbugs-fixes-3.2.0.tgz",
-      "integrity": "sha512-0AuD9HG1Ey3/3nqPWu9yqf7rL0KCPu5VgjDsjf5mzEcuo9H/z8nco/fljKgjsOUrZypa95MI0kS4xBZeBzz2lw=="
+      "integrity": "sha512-0AuD9HG1Ey3/3nqPWu9yqf7rL0KCPu5VgjDsjf5mzEcuo9H/z8nco/fljKgjsOUrZypa95MI0kS4xBZeBzz2lw==",
+      "requires": {
+        "postcss": "6.0.14"
+      }
     },
     "postcss-load-config": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-1.2.0.tgz",
-      "integrity": "sha1-U56a/J3chiASHr+djDZz4M5Q0oo="
+      "integrity": "sha1-U56a/J3chiASHr+djDZz4M5Q0oo=",
+      "requires": {
+        "cosmiconfig": "2.2.2",
+        "object-assign": "4.1.1",
+        "postcss-load-options": "1.2.0",
+        "postcss-load-plugins": "2.3.0"
+      }
     },
     "postcss-load-options": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/postcss-load-options/-/postcss-load-options-1.2.0.tgz",
-      "integrity": "sha1-sJixVZ3awt8EvAuzdfmaXP4rbYw="
+      "integrity": "sha1-sJixVZ3awt8EvAuzdfmaXP4rbYw=",
+      "requires": {
+        "cosmiconfig": "2.2.2",
+        "object-assign": "4.1.1"
+      }
     },
     "postcss-load-plugins": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/postcss-load-plugins/-/postcss-load-plugins-2.3.0.tgz",
-      "integrity": "sha1-dFdoEWWZrKLwCfrUJrABdQSdjZI="
+      "integrity": "sha1-dFdoEWWZrKLwCfrUJrABdQSdjZI=",
+      "requires": {
+        "cosmiconfig": "2.2.2",
+        "object-assign": "4.1.1"
+      }
     },
     "postcss-loader": {
       "version": "2.0.8",
       "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-2.0.8.tgz",
-      "integrity": "sha512-KtXBiQ/r/WYW8LxTSJK7h8wLqvCMSub/BqmRnud/Mu8RzwflW9cmXxwsMwbn15TNv287Hcufdb3ZSs7xHKnG8Q=="
+      "integrity": "sha512-KtXBiQ/r/WYW8LxTSJK7h8wLqvCMSub/BqmRnud/Mu8RzwflW9cmXxwsMwbn15TNv287Hcufdb3ZSs7xHKnG8Q==",
+      "requires": {
+        "loader-utils": "1.1.0",
+        "postcss": "6.0.14",
+        "postcss-load-config": "1.2.0",
+        "schema-utils": "0.3.0"
+      }
     },
     "postcss-merge-idents": {
       "version": "2.1.7",
       "resolved": "https://registry.npmjs.org/postcss-merge-idents/-/postcss-merge-idents-2.1.7.tgz",
       "integrity": "sha1-TFUwMTwI4dWzu/PSu8dH4njuonA=",
+      "requires": {
+        "has": "1.0.1",
+        "postcss": "5.2.18",
+        "postcss-value-parser": "3.3.0"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -8737,6 +9484,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -8753,7 +9507,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -8763,7 +9523,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -8771,6 +9534,9 @@
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/postcss-merge-longhand/-/postcss-merge-longhand-2.0.2.tgz",
       "integrity": "sha1-I9kM0Sewp3mUkVMyc5A0oaTz1lg=",
+      "requires": {
+        "postcss": "5.2.18"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -8781,6 +9547,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -8797,7 +9570,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -8807,7 +9586,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -8815,16 +9597,39 @@
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/postcss-merge-rules/-/postcss-merge-rules-2.1.2.tgz",
       "integrity": "sha1-0d9d+qexrMO+VT8OnhDofGG19yE=",
+      "requires": {
+        "browserslist": "1.7.7",
+        "caniuse-api": "1.6.1",
+        "postcss": "5.2.18",
+        "postcss-selector-parser": "2.2.3",
+        "vendors": "1.0.1"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
           "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
           "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
         },
+        "browserslist": {
+          "version": "1.7.7",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
+          "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
+          "requires": {
+            "caniuse-db": "1.0.30000760",
+            "electron-to-chromium": "1.3.27"
+          }
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -8841,7 +9646,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -8851,7 +9662,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -8864,6 +9678,11 @@
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/postcss-minify-font-values/-/postcss-minify-font-values-1.0.5.tgz",
       "integrity": "sha1-S1jttWZB66fIR0qzUmyv17vey2k=",
+      "requires": {
+        "object-assign": "4.1.1",
+        "postcss": "5.2.18",
+        "postcss-value-parser": "3.3.0"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -8874,6 +9693,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -8890,7 +9716,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -8900,7 +9732,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -8908,6 +9743,10 @@
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/postcss-minify-gradients/-/postcss-minify-gradients-1.0.5.tgz",
       "integrity": "sha1-Xb2hE3NwP4PPtKPqOIHY11/15uE=",
+      "requires": {
+        "postcss": "5.2.18",
+        "postcss-value-parser": "3.3.0"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -8918,6 +9757,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -8934,7 +9780,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -8944,7 +9796,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -8952,6 +9807,12 @@
       "version": "1.2.2",
       "resolved": "https://registry.npmjs.org/postcss-minify-params/-/postcss-minify-params-1.2.2.tgz",
       "integrity": "sha1-rSzgcTc7lDs9kwo/pZo1jCjW8fM=",
+      "requires": {
+        "alphanum-sort": "1.0.2",
+        "postcss": "5.2.18",
+        "postcss-value-parser": "3.3.0",
+        "uniqs": "2.0.0"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -8962,6 +9823,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -8978,7 +9846,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -8988,7 +9862,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -8996,6 +9873,12 @@
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/postcss-minify-selectors/-/postcss-minify-selectors-2.1.1.tgz",
       "integrity": "sha1-ssapjAByz5G5MtGkllCBFDEXNb8=",
+      "requires": {
+        "alphanum-sort": "1.0.2",
+        "has": "1.0.1",
+        "postcss": "5.2.18",
+        "postcss-selector-parser": "2.2.3"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -9006,6 +9889,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -9022,7 +9912,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -9032,39 +9928,66 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
     "postcss-modules": {
       "version": "0.8.0",
       "resolved": "https://registry.npmjs.org/postcss-modules/-/postcss-modules-0.8.0.tgz",
-      "integrity": "sha1-qdAYBt/+GcJgfe6I6hy9gNwFmZI="
+      "integrity": "sha1-qdAYBt/+GcJgfe6I6hy9gNwFmZI=",
+      "requires": {
+        "css-modules-loader-core": "1.1.0",
+        "generic-names": "1.0.3",
+        "postcss": "6.0.14",
+        "string-hash": "1.1.3"
+      }
     },
     "postcss-modules-extract-imports": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-1.1.0.tgz",
-      "integrity": "sha1-thTJcgvmgW6u41+zpfqh26agXds="
+      "integrity": "sha1-thTJcgvmgW6u41+zpfqh26agXds=",
+      "requires": {
+        "postcss": "6.0.14"
+      }
     },
     "postcss-modules-local-by-default": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-1.2.0.tgz",
-      "integrity": "sha1-99gMOYxaOT+nlkRmvRlQCn1hwGk="
+      "integrity": "sha1-99gMOYxaOT+nlkRmvRlQCn1hwGk=",
+      "requires": {
+        "css-selector-tokenizer": "0.7.0",
+        "postcss": "6.0.14"
+      }
     },
     "postcss-modules-scope": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-1.1.0.tgz",
-      "integrity": "sha1-1upkmUx5+XtipytCb75gVqGUu5A="
+      "integrity": "sha1-1upkmUx5+XtipytCb75gVqGUu5A=",
+      "requires": {
+        "css-selector-tokenizer": "0.7.0",
+        "postcss": "6.0.14"
+      }
     },
     "postcss-modules-values": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/postcss-modules-values/-/postcss-modules-values-1.3.0.tgz",
-      "integrity": "sha1-7P+p1+GSUYOJ9CrQ6D9yrsRW6iA="
+      "integrity": "sha1-7P+p1+GSUYOJ9CrQ6D9yrsRW6iA=",
+      "requires": {
+        "icss-replace-symbols": "1.1.0",
+        "postcss": "6.0.14"
+      }
     },
     "postcss-normalize-charset": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/postcss-normalize-charset/-/postcss-normalize-charset-1.1.1.tgz",
       "integrity": "sha1-757nEhLX/nWceO0WL2HtYrXLk/E=",
+      "requires": {
+        "postcss": "5.2.18"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -9075,6 +9998,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -9091,7 +10021,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -9101,7 +10037,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -9109,6 +10048,12 @@
       "version": "3.0.8",
       "resolved": "https://registry.npmjs.org/postcss-normalize-url/-/postcss-normalize-url-3.0.8.tgz",
       "integrity": "sha1-EI90s/L82viRov+j6kWSJ5/HgiI=",
+      "requires": {
+        "is-absolute-url": "2.1.0",
+        "normalize-url": "1.9.1",
+        "postcss": "5.2.18",
+        "postcss-value-parser": "3.3.0"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -9119,6 +10064,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -9135,7 +10087,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -9145,7 +10103,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -9153,6 +10114,10 @@
       "version": "2.2.3",
       "resolved": "https://registry.npmjs.org/postcss-ordered-values/-/postcss-ordered-values-2.2.3.tgz",
       "integrity": "sha1-7sbCpntsQSqNsgQud/6NpD+VwR0=",
+      "requires": {
+        "postcss": "5.2.18",
+        "postcss-value-parser": "3.3.0"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -9163,6 +10128,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -9179,7 +10151,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -9189,7 +10167,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -9197,6 +10178,10 @@
       "version": "2.4.0",
       "resolved": "https://registry.npmjs.org/postcss-reduce-idents/-/postcss-reduce-idents-2.4.0.tgz",
       "integrity": "sha1-wsbSDMlYKE9qv75j92Cb9AkFmtM=",
+      "requires": {
+        "postcss": "5.2.18",
+        "postcss-value-parser": "3.3.0"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -9207,6 +10192,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -9223,7 +10215,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -9233,7 +10231,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -9241,6 +10242,9 @@
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/postcss-reduce-initial/-/postcss-reduce-initial-1.0.1.tgz",
       "integrity": "sha1-aPgGlfBF0IJjqHmtJA343WT2ROo=",
+      "requires": {
+        "postcss": "5.2.18"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -9251,6 +10255,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -9267,7 +10278,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -9277,7 +10294,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -9285,6 +10305,11 @@
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/postcss-reduce-transforms/-/postcss-reduce-transforms-1.0.4.tgz",
       "integrity": "sha1-/3b02CEkN7McKYpC0uFEQCV3GuE=",
+      "requires": {
+        "has": "1.0.1",
+        "postcss": "5.2.18",
+        "postcss-value-parser": "3.3.0"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -9295,6 +10320,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -9311,7 +10343,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -9321,19 +10359,33 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
     "postcss-selector-parser": {
       "version": "2.2.3",
       "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-2.2.3.tgz",
-      "integrity": "sha1-+UN3iGBsPJrO4W/+jYsWKX8nu5A="
+      "integrity": "sha1-+UN3iGBsPJrO4W/+jYsWKX8nu5A=",
+      "requires": {
+        "flatten": "1.0.2",
+        "indexes-of": "1.0.1",
+        "uniq": "1.0.1"
+      }
     },
     "postcss-svgo": {
       "version": "2.1.6",
       "resolved": "https://registry.npmjs.org/postcss-svgo/-/postcss-svgo-2.1.6.tgz",
       "integrity": "sha1-tt8YqmE7Zm4TPwittSGcJoSsEI0=",
+      "requires": {
+        "is-svg": "2.1.0",
+        "postcss": "5.2.18",
+        "postcss-value-parser": "3.3.0",
+        "svgo": "0.7.2"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -9344,6 +10396,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -9360,7 +10419,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -9370,7 +10435,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -9378,6 +10446,11 @@
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/postcss-unique-selectors/-/postcss-unique-selectors-2.0.2.tgz",
       "integrity": "sha1-mB1X0p3csz57Hf4f1DuGSfkzyh0=",
+      "requires": {
+        "alphanum-sort": "1.0.2",
+        "postcss": "5.2.18",
+        "uniqs": "2.0.0"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -9388,6 +10461,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -9404,7 +10484,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -9414,7 +10500,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -9427,6 +10516,11 @@
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/postcss-zindex/-/postcss-zindex-2.2.0.tgz",
       "integrity": "sha1-0hCd3AVbka9n/EyzsCWUZjnSryI=",
+      "requires": {
+        "has": "1.0.1",
+        "postcss": "5.2.18",
+        "uniqs": "2.0.0"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -9437,6 +10531,13 @@
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          },
           "dependencies": {
             "supports-color": {
               "version": "2.0.0",
@@ -9453,7 +10554,13 @@
         "postcss": {
           "version": "5.2.18",
           "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg=="
+          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
+          "requires": {
+            "chalk": "1.1.3",
+            "js-base64": "2.3.2",
+            "source-map": "0.5.7",
+            "supports-color": "3.2.3"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -9463,7 +10570,10 @@
         "supports-color": {
           "version": "3.2.3",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY="
+          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
+          "requires": {
+            "has-flag": "1.0.0"
+          }
         }
       }
     },
@@ -9486,6 +10596,10 @@
       "version": "21.2.1",
       "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-21.2.1.tgz",
       "integrity": "sha512-ZdWPGYAnYfcVP8yKA3zFjCn8s4/17TeYH28MXuC8vTp0o21eXjbFGcOAXZEaDaOFJjc3h2qa7HQNHNshhvoh2A==",
+      "requires": {
+        "ansi-regex": "3.0.0",
+        "ansi-styles": "3.2.0"
+      },
       "dependencies": {
         "ansi-regex": {
           "version": "3.0.0",
@@ -9498,11 +10612,19 @@
       "version": "1.4.3",
       "resolved": "https://registry.npmjs.org/prettycli/-/prettycli-1.4.3.tgz",
       "integrity": "sha512-KLiwAXXfSWXZqGmZlnKPuGMTFp+0QbcySplL1ft9gfteT/BNsG64Xo8u2Qr9r+qnsIZWBQ66Zs8tg+8s2fmzvw==",
+      "requires": {
+        "chalk": "2.1.0"
+      },
       "dependencies": {
         "chalk": {
           "version": "2.1.0",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
-          "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ=="
+          "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ==",
+          "requires": {
+            "ansi-styles": "3.2.0",
+            "escape-string-regexp": "1.0.5",
+            "supports-color": "4.5.0"
+          }
         }
       }
     },
@@ -9524,22 +10646,39 @@
     "promise": {
       "version": "7.3.1",
       "resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz",
-      "integrity": "sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg=="
+      "integrity": "sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==",
+      "requires": {
+        "asap": "2.0.6"
+      }
     },
     "promise.prototype.finally": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/promise.prototype.finally/-/promise.prototype.finally-3.0.1.tgz",
-      "integrity": "sha512-5o2ue0smn+Wn6tdkqN4wxB27lCu84UrladpMRQ3fm1tEkewOrhAGSOHwj15SRU+oE/ParFTou6XG3Jhgyb9sjw=="
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/promise.prototype.finally/-/promise.prototype.finally-3.1.0.tgz",
+      "integrity": "sha512-7p/K2f6dI+dM8yjRQEGrTQs5hTQixUAdOGpMEA3+pVxpX5oHKRSKAXyLw9Q9HUWDTdwtoo39dSHGQtN90HcEwQ==",
+      "requires": {
+        "define-properties": "1.1.2",
+        "es-abstract": "1.9.0",
+        "function-bind": "1.1.1"
+      }
     },
     "prop-types": {
       "version": "15.6.0",
       "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.6.0.tgz",
-      "integrity": "sha1-zq8IMCL8RrSjX2nhPvda7Q1jmFY="
+      "integrity": "sha1-zq8IMCL8RrSjX2nhPvda7Q1jmFY=",
+      "requires": {
+        "fbjs": "0.8.16",
+        "loose-envify": "1.3.1",
+        "object-assign": "4.1.1"
+      }
     },
     "proxy-addr": {
-      "version": "1.1.5",
-      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-1.1.5.tgz",
-      "integrity": "sha1-ccDuOxAt4/IC87ZPYI0XP8uhqRg="
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.2.tgz",
+      "integrity": "sha1-ZXFQT0e7mI7IGAJT+F3X4UlSvew=",
+      "requires": {
+        "forwarded": "0.1.2",
+        "ipaddr.js": "1.5.2"
+      }
     },
     "prr": {
       "version": "0.0.0",
@@ -9554,7 +10693,14 @@
     "public-encrypt": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/public-encrypt/-/public-encrypt-4.0.0.tgz",
-      "integrity": "sha1-OfaZ86RlYN1eusvKaTyvfGXBjMY="
+      "integrity": "sha1-OfaZ86RlYN1eusvKaTyvfGXBjMY=",
+      "requires": {
+        "bn.js": "4.11.8",
+        "browserify-rsa": "4.0.1",
+        "create-hash": "1.1.3",
+        "parse-asn1": "5.1.0",
+        "randombytes": "2.0.5"
+      }
     },
     "punycode": {
       "version": "1.4.1",
@@ -9562,9 +10708,9 @@
       "integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4="
     },
     "q": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/q/-/q-1.5.0.tgz",
-      "integrity": "sha1-3QG6ydBtMObyGa7LglPunr3DCPE="
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/q/-/q-1.5.1.tgz",
+      "integrity": "sha1-fjL3W0E4EpHQRhHxvxQQmsAGUdc="
     },
     "qs": {
       "version": "6.5.1",
@@ -9574,7 +10720,11 @@
     "query-string": {
       "version": "4.3.4",
       "resolved": "https://registry.npmjs.org/query-string/-/query-string-4.3.4.tgz",
-      "integrity": "sha1-u7aTucqRXCMlFbIosaArYJBD2+s="
+      "integrity": "sha1-u7aTucqRXCMlFbIosaArYJBD2+s=",
+      "requires": {
+        "object-assign": "4.1.1",
+        "strict-uri-encode": "1.1.0"
+      }
     },
     "querystring": {
       "version": "0.2.0",
@@ -9592,14 +10742,24 @@
       "integrity": "sha1-DPf4T5Rj/wrlHExLFC2VvjdyTZw="
     },
     "radium": {
-      "version": "0.19.5",
-      "resolved": "https://registry.npmjs.org/radium/-/radium-0.19.5.tgz",
-      "integrity": "sha512-W2vu68wvq6AcUb81PNaBkVqO7O0HksURQeY5KzoCR/k9hxLqglYvkiXMKeLqxNDr47mDj1W5Zbm3e8Xi9kBIFA==",
+      "version": "0.19.6",
+      "resolved": "https://registry.npmjs.org/radium/-/radium-0.19.6.tgz",
+      "integrity": "sha512-IABYntqCwYelUUIwA52maSCgJbqtJjHKIoD21wgpw3dGhIUbJ5chDShDGdaFiEzdF03hN9jfQqlmn0bF4YhfrQ==",
+      "requires": {
+        "array-find": "1.0.0",
+        "exenv": "1.2.2",
+        "inline-style-prefixer": "2.0.5",
+        "prop-types": "15.6.0"
+      },
       "dependencies": {
         "inline-style-prefixer": {
           "version": "2.0.5",
           "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-2.0.5.tgz",
-          "integrity": "sha1-wVPH6I/YT+9cYC6VqBaLJ3BnH+c="
+          "integrity": "sha1-wVPH6I/YT+9cYC6VqBaLJ3BnH+c=",
+          "requires": {
+            "bowser": "1.8.1",
+            "hyphenate-style-name": "1.0.2"
+          }
         }
       }
     },
@@ -9607,18 +10767,37 @@
       "version": "1.1.7",
       "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-1.1.7.tgz",
       "integrity": "sha512-D5JUjPyJbaJDkuAazpVnSfVkLlpeO3wDlPROTMLGKG1zMFNFRgrciKo1ltz/AzNTkqE0HzDx655QOL51N06how==",
+      "requires": {
+        "is-number": "3.0.0",
+        "kind-of": "4.0.0"
+      },
       "dependencies": {
         "kind-of": {
           "version": "4.0.0",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-4.0.0.tgz",
-          "integrity": "sha1-IIE989cSkosgc3hpGkUGb65y3Vc="
+          "integrity": "sha1-IIE989cSkosgc3hpGkUGb65y3Vc=",
+          "requires": {
+            "is-buffer": "1.1.6"
+          }
         }
       }
     },
     "randombytes": {
       "version": "2.0.5",
       "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.0.5.tgz",
-      "integrity": "sha512-8T7Zn1AhMsQ/HI1SjcCfT/t4ii3eAqco3yOcSzS4mozsOz69lHLsoMXmF9nZgnFanYscnSlUSgs8uZyKzpE6kg=="
+      "integrity": "sha512-8T7Zn1AhMsQ/HI1SjcCfT/t4ii3eAqco3yOcSzS4mozsOz69lHLsoMXmF9nZgnFanYscnSlUSgs8uZyKzpE6kg==",
+      "requires": {
+        "safe-buffer": "5.1.1"
+      }
+    },
+    "randomfill": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/randomfill/-/randomfill-1.0.3.tgz",
+      "integrity": "sha512-YL6GrhrWoic0Eq8rXVbMptH7dAxCs0J+mh5Y0euNekPPYaxEmdVGim6GdoxoRzKW2yJoU8tueifS7mYxvcFDEQ==",
+      "requires": {
+        "randombytes": "2.0.5",
+        "safe-buffer": "5.1.1"
+      }
     },
     "range-parser": {
       "version": "1.2.0",
@@ -9628,7 +10807,13 @@
     "raw-body": {
       "version": "2.3.2",
       "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.3.2.tgz",
-      "integrity": "sha1-vNYMd9Prk83gBQKVw/N5OJvIj4k="
+      "integrity": "sha1-vNYMd9Prk83gBQKVw/N5OJvIj4k=",
+      "requires": {
+        "bytes": "3.0.0",
+        "http-errors": "1.6.2",
+        "iconv-lite": "0.4.19",
+        "unpipe": "1.0.0"
+      }
     },
     "raw-loader": {
       "version": "0.5.1",
@@ -9638,7 +10823,14 @@
     "react": {
       "version": "15.6.2",
       "resolved": "https://registry.npmjs.org/react/-/react-15.6.2.tgz",
-      "integrity": "sha1-26BDSrQ5z+gvEI8PURZjkIF5qnI="
+      "integrity": "sha1-26BDSrQ5z+gvEI8PURZjkIF5qnI=",
+      "requires": {
+        "create-react-class": "15.6.2",
+        "fbjs": "0.8.16",
+        "loose-envify": "1.3.1",
+        "object-assign": "4.1.1",
+        "prop-types": "15.6.0"
+      }
     },
     "react-addons-test-utils": {
       "version": "15.6.2",
@@ -9649,6 +10841,15 @@
       "version": "2.19.0",
       "resolved": "https://registry.npmjs.org/react-docgen/-/react-docgen-2.19.0.tgz",
       "integrity": "sha1-qeNWJ3qjH0LfFj8LSRfTsHeYX50=",
+      "requires": {
+        "async": "2.6.0",
+        "babel-runtime": "6.26.0",
+        "babylon": "5.8.38",
+        "commander": "2.11.0",
+        "doctrine": "2.0.0",
+        "node-dir": "0.1.17",
+        "recast": "0.12.8"
+      },
       "dependencies": {
         "babylon": {
           "version": "5.8.38",
@@ -9660,17 +10861,31 @@
     "react-dom": {
       "version": "15.6.2",
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-15.6.2.tgz",
-      "integrity": "sha1-Qc+t9pO3V/rycIRDodH9WgK+9zA="
+      "integrity": "sha1-Qc+t9pO3V/rycIRDodH9WgK+9zA=",
+      "requires": {
+        "fbjs": "0.8.16",
+        "loose-envify": "1.3.1",
+        "object-assign": "4.1.1",
+        "prop-types": "15.6.0"
+      }
     },
     "react-highlight": {
       "version": "0.9.0",
       "resolved": "https://registry.npmjs.org/react-highlight/-/react-highlight-0.9.0.tgz",
-      "integrity": "sha1-1e3udEzLhon3k4eUtqG1VLsVDrc="
+      "integrity": "sha1-1e3udEzLhon3k4eUtqG1VLsVDrc=",
+      "requires": {
+        "highlight.js": "9.12.0",
+        "react": "15.6.2",
+        "react-dom": "15.6.2"
+      }
     },
     "react-html-attributes": {
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/react-html-attributes/-/react-html-attributes-1.4.1.tgz",
-      "integrity": "sha1-l7XscQ2miDNZjIvm+JrENiFoQKU="
+      "integrity": "sha1-l7XscQ2miDNZjIvm+JrENiFoQKU=",
+      "requires": {
+        "html-element-attributes": "1.3.0"
+      }
     },
     "react-icon-base": {
       "version": "2.1.0",
@@ -9680,87 +10895,182 @@
     "react-icons": {
       "version": "2.2.7",
       "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-2.2.7.tgz",
-      "integrity": "sha512-0n4lcGqzJFcIQLoQytLdJCE0DKSA9dkwEZRYoGrIDJZFvIT6Hbajx5mv9geqhqFiNjUgtxg8kPyDfjlhymbGFg=="
+      "integrity": "sha512-0n4lcGqzJFcIQLoQytLdJCE0DKSA9dkwEZRYoGrIDJZFvIT6Hbajx5mv9geqhqFiNjUgtxg8kPyDfjlhymbGFg==",
+      "requires": {
+        "react-icon-base": "2.1.0"
+      }
     },
     "react-inspector": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/react-inspector/-/react-inspector-2.2.0.tgz",
-      "integrity": "sha512-G5qXffxY5U1XhleV/YxHfJvjAiHHPDhYItygvz0FGdEuFVop0FTHNlHbUYRn7XOtARiMBekaBinq8PkA+ylrEg=="
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/react-inspector/-/react-inspector-2.2.1.tgz",
+      "integrity": "sha512-aXrxJTfriJtZtv/+A9cFIOpfbt711yCD1Ht3fSn3JyuDaAt1+eLtb01R5d/8gGpyquOVWn/d+eM1VPqFXS7UZA==",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "is-dom": "1.0.9"
+      }
     },
     "react-komposer": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/react-komposer/-/react-komposer-2.0.0.tgz",
-      "integrity": "sha1-uWRzgBSptK7klKg8C1uDPWYHKpA="
+      "integrity": "sha1-uWRzgBSptK7klKg8C1uDPWYHKpA=",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "hoist-non-react-statics": "1.2.0",
+        "lodash.pick": "4.4.0",
+        "react-stubber": "1.0.0",
+        "shallowequal": "0.2.2"
+      }
     },
     "react-modal": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-2.4.1.tgz",
-      "integrity": "sha512-3WQCn3xqkbEUvxRUO3nkeqxMNgt1F4CyEU3BiUIrg7C71tnqjQIuSE7+JXp85yFl8X1iRTJouySNpwNqv4kiWg=="
+      "integrity": "sha512-3WQCn3xqkbEUvxRUO3nkeqxMNgt1F4CyEU3BiUIrg7C71tnqjQIuSE7+JXp85yFl8X1iRTJouySNpwNqv4kiWg==",
+      "requires": {
+        "exenv": "1.2.2",
+        "prop-types": "15.6.0"
+      }
     },
     "react-remarkable": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/react-remarkable/-/react-remarkable-1.1.3.tgz",
-      "integrity": "sha512-H4kfiT0Q84OzNAcNfWKDMe1Xhm/7jJAIHV5n4mAff2N0nGpPtRN2M7zhLXaTalD5DNGCGKEq1b4XApZ/1QpKbg=="
+      "integrity": "sha512-H4kfiT0Q84OzNAcNfWKDMe1Xhm/7jJAIHV5n4mAff2N0nGpPtRN2M7zhLXaTalD5DNGCGKEq1b4XApZ/1QpKbg==",
+      "requires": {
+        "remarkable": "1.7.1"
+      }
     },
     "react-simple-di": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/react-simple-di/-/react-simple-di-1.2.0.tgz",
-      "integrity": "sha1-3eDlv2ifOR7yqwLJBDshP+I5xtA="
+      "integrity": "sha1-3eDlv2ifOR7yqwLJBDshP+I5xtA=",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "hoist-non-react-statics": "1.2.0"
+      }
     },
     "react-split-pane": {
-      "version": "0.1.66",
-      "resolved": "https://registry.npmjs.org/react-split-pane/-/react-split-pane-0.1.66.tgz",
-      "integrity": "sha512-k4F0+BaHkPn0WclipkxEDL18Td2Ocgu+XzhOZznGngWk2l3mB5ujX7jxd5DSa8spHIuCGKQXzgjrk7rc2Y5BUQ=="
+      "version": "0.1.68",
+      "resolved": "https://registry.npmjs.org/react-split-pane/-/react-split-pane-0.1.68.tgz",
+      "integrity": "sha512-63CdXX4YRlt2iXM3EbThNSyI1JkCUH3H/MC2TnZT8wwHN3J1mam0FqEa40dTdQl/oBGBuzcuJ7X1Z9+8FMSOMg==",
+      "requires": {
+        "@types/inline-style-prefixer": "3.0.1",
+        "@types/react": "16.0.21",
+        "inline-style-prefixer": "3.0.8",
+        "prop-types": "15.6.0",
+        "react-style-proptype": "3.1.0"
+      },
+      "dependencies": {
+        "@types/react": {
+          "version": "16.0.21",
+          "resolved": "https://registry.npmjs.org/@types/react/-/react-16.0.21.tgz",
+          "integrity": "sha512-al4eps87QOPUQ+Cgpk9n/mWd8BcM7Sa4D8sWWG+Pj186/n3cxleeN/AC+sTjVUY5Xlcbdz8UNO53lnQ8YFteBA=="
+        }
+      }
     },
     "react-stubber": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/react-stubber/-/react-stubber-1.0.0.tgz",
-      "integrity": "sha1-Qe4srHLU1P1wpjiW2pjhNzm4Rig="
+      "integrity": "sha1-Qe4srHLU1P1wpjiW2pjhNzm4Rig=",
+      "requires": {
+        "babel-runtime": "6.26.0"
+      }
     },
     "react-style-proptype": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/react-style-proptype/-/react-style-proptype-3.0.0.tgz",
-      "integrity": "sha1-ieC2RvJmxlarsPDdggLb1QNsMeY="
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/react-style-proptype/-/react-style-proptype-3.1.0.tgz",
+      "integrity": "sha512-e4lOMjF4f8Pp/jdO9myNzDvSAx1aG5r0olziD64Bgk40LN8LxidRCgnKeI2RiKrqYD6j2Z8ByXoUbwV+/mwpwg==",
+      "requires": {
+        "prop-types": "15.6.0"
+      }
     },
     "react-test-renderer": {
       "version": "15.6.2",
       "resolved": "https://registry.npmjs.org/react-test-renderer/-/react-test-renderer-15.6.2.tgz",
-      "integrity": "sha1-0DM0NPwsQ4CSaWyncNpe1IA376g="
+      "integrity": "sha1-0DM0NPwsQ4CSaWyncNpe1IA376g=",
+      "requires": {
+        "fbjs": "0.8.16",
+        "object-assign": "4.1.1"
+      }
     },
     "react-transition-group": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-1.2.1.tgz",
-      "integrity": "sha512-CWaL3laCmgAFdxdKbhhps+c0HRGF4c+hdM4H23+FI1QBNUyx/AMeIJGWorehPNSaKnQNOAxL7PQmqMu78CDj3Q=="
+      "integrity": "sha512-CWaL3laCmgAFdxdKbhhps+c0HRGF4c+hdM4H23+FI1QBNUyx/AMeIJGWorehPNSaKnQNOAxL7PQmqMu78CDj3Q==",
+      "requires": {
+        "chain-function": "1.0.0",
+        "dom-helpers": "3.2.1",
+        "loose-envify": "1.3.1",
+        "prop-types": "15.6.0",
+        "warning": "3.0.0"
+      }
     },
     "react-treebeard": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/react-treebeard/-/react-treebeard-2.0.3.tgz",
-      "integrity": "sha512-fqSmx0RPuUxvG5kQantyW89HnOCjz6e53o3AajuaXSVWL8O8tXNUCoSdxaO6xScXpujIV+iVaYUGBpOm5Pdhiw=="
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/react-treebeard/-/react-treebeard-2.1.0.tgz",
+      "integrity": "sha512-unoy8IJL1NR5jgTtK+CqOCZKZylh/Tlid0oYajW9bLZCbFelxzmCsF8Y2hyS6pvHqM4W501oOm5O/jvg3VZCrg==",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "deep-equal": "1.0.1",
+        "prop-types": "15.6.0",
+        "radium": "0.19.6",
+        "shallowequal": "0.2.2",
+        "velocity-react": "1.3.3"
+      }
     },
     "read-pkg": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-2.0.0.tgz",
-      "integrity": "sha1-jvHAYjxqbbDcZxPEv6xGMysjaPg="
+      "integrity": "sha1-jvHAYjxqbbDcZxPEv6xGMysjaPg=",
+      "requires": {
+        "load-json-file": "2.0.0",
+        "normalize-package-data": "2.4.0",
+        "path-type": "2.0.0"
+      }
     },
     "read-pkg-up": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-2.0.0.tgz",
-      "integrity": "sha1-a3KoBImE4MQeeVEP1en6mbO1Sb4="
+      "integrity": "sha1-a3KoBImE4MQeeVEP1en6mbO1Sb4=",
+      "requires": {
+        "find-up": "2.1.0",
+        "read-pkg": "2.0.0"
+      }
     },
     "readable-stream": {
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-      "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ=="
+      "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ==",
+      "requires": {
+        "core-util-is": "1.0.2",
+        "inherits": "2.0.3",
+        "isarray": "1.0.0",
+        "process-nextick-args": "1.0.7",
+        "safe-buffer": "5.1.1",
+        "string_decoder": "1.0.3",
+        "util-deprecate": "1.0.2"
+      }
     },
     "readdirp": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-2.1.0.tgz",
-      "integrity": "sha1-TtCtBg3zBzMAxIRANz9y0cxkLXg="
+      "integrity": "sha1-TtCtBg3zBzMAxIRANz9y0cxkLXg=",
+      "requires": {
+        "graceful-fs": "4.1.11",
+        "minimatch": "3.0.4",
+        "readable-stream": "2.3.3",
+        "set-immediate-shim": "1.0.1"
+      }
     },
     "recast": {
-      "version": "0.12.7",
-      "resolved": "https://registry.npmjs.org/recast/-/recast-0.12.7.tgz",
-      "integrity": "sha512-UgJBjELa0DaLUbblnIOPUj0UgdbetzYzrvWtHCXX8N5aCTHoMSx6ATkA2JH0hS7tP6dMJ5/CtVZEC4yW7V/8Dw==",
+      "version": "0.12.8",
+      "resolved": "https://registry.npmjs.org/recast/-/recast-0.12.8.tgz",
+      "integrity": "sha512-sqhh1Rn20bAqVMtXzURPM1Py6sAfwJtN9LMWd11pZBJsbD6SO7oxgwZiUVpfUnBDClwrjB88a/hkP/SWNkcaCA==",
+      "requires": {
+        "ast-types": "0.9.14",
+        "core-js": "2.5.1",
+        "esprima": "4.0.0",
+        "private": "0.1.8",
+        "source-map": "0.6.1"
+      },
       "dependencies": {
         "esprima": {
           "version": "4.0.0",
@@ -9772,17 +11082,27 @@
     "rechoir": {
       "version": "0.6.2",
       "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz",
-      "integrity": "sha1-hSBLVNuoLVdC4oyWdW70OvUOM4Q="
+      "integrity": "sha1-hSBLVNuoLVdC4oyWdW70OvUOM4Q=",
+      "requires": {
+        "resolve": "1.5.0"
+      }
     },
     "redent": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/redent/-/redent-1.0.0.tgz",
-      "integrity": "sha1-z5Fqsf1fHxbfsggi3W7H9zDCr94="
+      "integrity": "sha1-z5Fqsf1fHxbfsggi3W7H9zDCr94=",
+      "requires": {
+        "indent-string": "2.1.0",
+        "strip-indent": "1.0.1"
+      }
     },
     "redeyed": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/redeyed/-/redeyed-1.0.1.tgz",
       "integrity": "sha1-6WwZO0DAgWsArshCaY5hGF5VSYo=",
+      "requires": {
+        "esprima": "3.0.0"
+      },
       "dependencies": {
         "esprima": {
           "version": "3.0.0",
@@ -9795,6 +11115,11 @@
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/reduce-css-calc/-/reduce-css-calc-1.3.0.tgz",
       "integrity": "sha1-dHyRTgSWFKTJz7umKYca0dKSdxY=",
+      "requires": {
+        "balanced-match": "0.4.2",
+        "math-expression-evaluator": "1.2.17",
+        "reduce-function-call": "1.0.2"
+      },
       "dependencies": {
         "balanced-match": {
           "version": "0.4.2",
@@ -9807,6 +11132,9 @@
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/reduce-function-call/-/reduce-function-call-1.0.2.tgz",
       "integrity": "sha1-WiAL+S4ON3UXUv5FsKszD9S2vpk=",
+      "requires": {
+        "balanced-match": "0.4.2"
+      },
       "dependencies": {
         "balanced-match": {
           "version": "0.4.2",
@@ -9818,7 +11146,13 @@
     "redux": {
       "version": "3.7.2",
       "resolved": "https://registry.npmjs.org/redux/-/redux-3.7.2.tgz",
-      "integrity": "sha512-pNqnf9q1hI5HHZRBkj3bAngGZW/JMCmexDlOxw4XagXY2o1327nHH54LoTjiPJ0gizoqPDRqWyX/00g0hD6w+A=="
+      "integrity": "sha512-pNqnf9q1hI5HHZRBkj3bAngGZW/JMCmexDlOxw4XagXY2o1327nHH54LoTjiPJ0gizoqPDRqWyX/00g0hD6w+A==",
+      "requires": {
+        "lodash": "4.17.4",
+        "lodash-es": "4.17.4",
+        "loose-envify": "1.3.1",
+        "symbol-observable": "1.0.4"
+      }
     },
     "regenerate": {
       "version": "1.3.3",
@@ -9833,22 +11167,38 @@
     "regenerator-transform": {
       "version": "0.10.1",
       "resolved": "https://registry.npmjs.org/regenerator-transform/-/regenerator-transform-0.10.1.tgz",
-      "integrity": "sha512-PJepbvDbuK1xgIgnau7Y90cwaAmO/LCLMI2mPvaXq2heGMR3aWW5/BQvYrhJ8jgmQjXewXvBjzfqKcVOmhjZ6Q=="
+      "integrity": "sha512-PJepbvDbuK1xgIgnau7Y90cwaAmO/LCLMI2mPvaXq2heGMR3aWW5/BQvYrhJ8jgmQjXewXvBjzfqKcVOmhjZ6Q==",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "babel-types": "6.26.0",
+        "private": "0.1.8"
+      }
     },
     "regex-cache": {
       "version": "0.4.4",
       "resolved": "https://registry.npmjs.org/regex-cache/-/regex-cache-0.4.4.tgz",
-      "integrity": "sha512-nVIZwtCjkC9YgvWkpM55B5rBhBYRZhAaJbgcFYXXsHnbZ9UZI9nnVWYZpBlCqv9ho2eZryPnWrZGsOdPwVWXWQ=="
+      "integrity": "sha512-nVIZwtCjkC9YgvWkpM55B5rBhBYRZhAaJbgcFYXXsHnbZ9UZI9nnVWYZpBlCqv9ho2eZryPnWrZGsOdPwVWXWQ==",
+      "requires": {
+        "is-equal-shallow": "0.1.3"
+      }
     },
     "regex-not": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/regex-not/-/regex-not-1.0.0.tgz",
-      "integrity": "sha1-Qvg+OXcWIt+CawKvF2Ul1qXxV/k="
+      "integrity": "sha1-Qvg+OXcWIt+CawKvF2Ul1qXxV/k=",
+      "requires": {
+        "extend-shallow": "2.0.1"
+      }
     },
     "regexpu-core": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-1.0.0.tgz",
-      "integrity": "sha1-hqdj9Y7k18L2sQLkdkBQ3n7ZDGs="
+      "integrity": "sha1-hqdj9Y7k18L2sQLkdkBQ3n7ZDGs=",
+      "requires": {
+        "regenerate": "1.3.3",
+        "regjsgen": "0.2.0",
+        "regjsparser": "0.1.5"
+      }
     },
     "regjsgen": {
       "version": "0.2.0",
@@ -9858,17 +11208,28 @@
     "regjsparser": {
       "version": "0.1.5",
       "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz",
-      "integrity": "sha1-fuj4Tcb6eS0/0K4ijSS9lJ6tIFw="
+      "integrity": "sha1-fuj4Tcb6eS0/0K4ijSS9lJ6tIFw=",
+      "requires": {
+        "jsesc": "0.5.0"
+      }
     },
     "remarkable": {
       "version": "1.7.1",
       "resolved": "https://registry.npmjs.org/remarkable/-/remarkable-1.7.1.tgz",
       "integrity": "sha1-qspJchALZqZCpjoQIcpLrBvjv/Y=",
+      "requires": {
+        "argparse": "0.1.16",
+        "autolinker": "0.15.3"
+      },
       "dependencies": {
         "argparse": {
           "version": "0.1.16",
           "resolved": "https://registry.npmjs.org/argparse/-/argparse-0.1.16.tgz",
-          "integrity": "sha1-z9AeD7uj1srtBJ+9dY1A9lGW9Xw="
+          "integrity": "sha1-z9AeD7uj1srtBJ+9dY1A9lGW9Xw=",
+          "requires": {
+            "underscore": "1.7.0",
+            "underscore.string": "2.4.0"
+          }
         }
       }
     },
@@ -9890,22 +11251,57 @@
     "repeating": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/repeating/-/repeating-2.0.1.tgz",
-      "integrity": "sha1-UhTFOpJtNVJwdSf7q0FdvAjQbdo="
+      "integrity": "sha1-UhTFOpJtNVJwdSf7q0FdvAjQbdo=",
+      "requires": {
+        "is-finite": "1.0.2"
+      }
     },
     "request": {
       "version": "2.83.0",
       "resolved": "https://registry.npmjs.org/request/-/request-2.83.0.tgz",
-      "integrity": "sha512-lR3gD69osqm6EYLk9wB/G1W/laGWjzH90t1vEa2xuxHD5KUrSzp9pUSfTm+YC5Nxt2T8nMPEvKlhbQayU7bgFw=="
+      "integrity": "sha512-lR3gD69osqm6EYLk9wB/G1W/laGWjzH90t1vEa2xuxHD5KUrSzp9pUSfTm+YC5Nxt2T8nMPEvKlhbQayU7bgFw==",
+      "requires": {
+        "aws-sign2": "0.7.0",
+        "aws4": "1.6.0",
+        "caseless": "0.12.0",
+        "combined-stream": "1.0.5",
+        "extend": "3.0.1",
+        "forever-agent": "0.6.1",
+        "form-data": "2.3.1",
+        "har-validator": "5.0.3",
+        "hawk": "6.0.2",
+        "http-signature": "1.2.0",
+        "is-typedarray": "1.0.0",
+        "isstream": "0.1.2",
+        "json-stringify-safe": "5.0.1",
+        "mime-types": "2.1.17",
+        "oauth-sign": "0.8.2",
+        "performance-now": "2.1.0",
+        "qs": "6.5.1",
+        "safe-buffer": "5.1.1",
+        "stringstream": "0.0.5",
+        "tough-cookie": "2.3.3",
+        "tunnel-agent": "0.6.0",
+        "uuid": "3.1.0"
+      }
     },
     "request-promise": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/request-promise/-/request-promise-4.1.1.tgz",
-      "integrity": "sha1-JgIeT29W/Uwwn2vx69jJepWsH7U="
+      "integrity": "sha1-JgIeT29W/Uwwn2vx69jJepWsH7U=",
+      "requires": {
+        "bluebird": "3.4.7",
+        "request-promise-core": "1.1.1",
+        "stealthy-require": "1.1.1"
+      }
     },
     "request-promise-core": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/request-promise-core/-/request-promise-core-1.1.1.tgz",
-      "integrity": "sha1-Pu4AssWqgyOc+wTFcA2jb4HNCLY="
+      "integrity": "sha1-Pu4AssWqgyOc+wTFcA2jb4HNCLY=",
+      "requires": {
+        "lodash": "4.17.4"
+      }
     },
     "require-directory": {
       "version": "2.1.1",
@@ -9933,9 +11329,25 @@
       "integrity": "sha512-o4sxCTSwTxx5hBFXYn5rsgMuLQT8kufJ5vzKYcRwWhCWERKN4dqZwiMx7+nRrcXouWmiFGD9A486yS4Z1a2PQQ=="
     },
     "resolve": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.4.0.tgz",
-      "integrity": "sha512-aW7sVKPufyHqOmyyLzg/J+8606v5nevBgaliIlV7nUpVMsDnoBGV/cbSLNjZAg9q0Cfd/+easKVKQ8vOu8fn1Q=="
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.5.0.tgz",
+      "integrity": "sha512-hgoSGrc3pjzAPHNBg+KnFcK2HwlHTs/YrAGUr6qgTVUZmXv1UEXXl0bZNBKMA9fud6lRYFdPGz0xXxycPzmmiw==",
+      "requires": {
+        "path-parse": "1.0.5"
+      }
+    },
+    "resolve-cwd": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/resolve-cwd/-/resolve-cwd-2.0.0.tgz",
+      "integrity": "sha1-AKn3OHVW4nA46uIyyqNypqWbZlo=",
+      "requires": {
+        "resolve-from": "3.0.0"
+      }
+    },
+    "resolve-from": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-3.0.0.tgz",
+      "integrity": "sha1-six699nWiBvItuZTM17rywoYh0g="
     },
     "resolve-url": {
       "version": "0.2.1",
@@ -9945,27 +11357,44 @@
     "restore-cursor": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-2.0.0.tgz",
-      "integrity": "sha1-n37ih/gv0ybU/RYpI9YhKe7g368="
+      "integrity": "sha1-n37ih/gv0ybU/RYpI9YhKe7g368=",
+      "requires": {
+        "onetime": "2.0.1",
+        "signal-exit": "3.0.2"
+      }
     },
     "right-align": {
       "version": "0.1.3",
       "resolved": "https://registry.npmjs.org/right-align/-/right-align-0.1.3.tgz",
-      "integrity": "sha1-YTObci/mo1FWiSENJOFMlhSGE+8="
+      "integrity": "sha1-YTObci/mo1FWiSENJOFMlhSGE+8=",
+      "requires": {
+        "align-text": "0.1.4"
+      }
     },
     "rimraf": {
       "version": "2.6.2",
       "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.2.tgz",
-      "integrity": "sha512-lreewLK/BlghmxtfH36YYVg1i8IAce4TI7oao75I1g245+6BctqTVQiBP3YUJ9C6DQOXJmkYR9X9fCLtCOJc5w=="
+      "integrity": "sha512-lreewLK/BlghmxtfH36YYVg1i8IAce4TI7oao75I1g245+6BctqTVQiBP3YUJ9C6DQOXJmkYR9X9fCLtCOJc5w==",
+      "requires": {
+        "glob": "7.1.2"
+      }
     },
     "ripemd160": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.1.tgz",
-      "integrity": "sha1-D0WEKVxTo2KK9+bXmsohzlfRxuc="
+      "integrity": "sha1-D0WEKVxTo2KK9+bXmsohzlfRxuc=",
+      "requires": {
+        "hash-base": "2.0.2",
+        "inherits": "2.0.3"
+      }
     },
     "run-async": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/run-async/-/run-async-2.3.0.tgz",
-      "integrity": "sha1-A3GrSuC91yDUFm19/aZP96RFpsA="
+      "integrity": "sha1-A3GrSuC91yDUFm19/aZP96RFpsA=",
+      "requires": {
+        "is-promise": "2.1.0"
+      }
     },
     "rx": {
       "version": "4.1.0",
@@ -9986,6 +11415,15 @@
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/sane/-/sane-2.2.0.tgz",
       "integrity": "sha512-OSJxhHO0CgPUw3lUm3GhfREAfza45smvEI9ozuFrxKG10GHVo0ryW9FK5VYlLvxj0SV7HVKHW0voYJIRu27GWg==",
+      "requires": {
+        "anymatch": "1.3.2",
+        "exec-sh": "0.2.1",
+        "fb-watchman": "2.0.0",
+        "minimatch": "3.0.4",
+        "minimist": "1.2.0",
+        "walker": "1.0.7",
+        "watch": "0.18.0"
+      },
       "dependencies": {
         "minimist": {
           "version": "1.2.0",
@@ -9998,46 +11436,72 @@
       "version": "2.2.4",
       "resolved": "https://registry.npmjs.org/sass-graph/-/sass-graph-2.2.4.tgz",
       "integrity": "sha1-E/vWPNHK8JCLn9k0dq1DpR0eC0k=",
+      "requires": {
+        "glob": "7.1.2",
+        "lodash": "4.17.4",
+        "scss-tokenizer": "0.2.3",
+        "yargs": "7.1.0"
+      },
       "dependencies": {
         "camelcase": {
           "version": "3.0.0",
           "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
           "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
         },
-        "cliui": {
-          "version": "3.2.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
-          "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
-        },
         "find-up": {
           "version": "1.1.2",
           "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
-          "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8="
+          "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8=",
+          "requires": {
+            "path-exists": "2.1.0",
+            "pinkie-promise": "2.0.1"
+          }
         },
         "is-fullwidth-code-point": {
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
-          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
+          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
+          "requires": {
+            "number-is-nan": "1.0.1"
+          }
         },
         "load-json-file": {
           "version": "1.1.0",
           "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
-          "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA="
+          "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
+          "requires": {
+            "graceful-fs": "4.1.11",
+            "parse-json": "2.2.0",
+            "pify": "2.3.0",
+            "pinkie-promise": "2.0.1",
+            "strip-bom": "2.0.0"
+          }
         },
         "os-locale": {
           "version": "1.4.0",
           "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
-          "integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk="
+          "integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk=",
+          "requires": {
+            "lcid": "1.0.0"
+          }
         },
         "path-exists": {
           "version": "2.1.0",
           "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
-          "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s="
+          "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s=",
+          "requires": {
+            "pinkie-promise": "2.0.1"
+          }
         },
         "path-type": {
           "version": "1.1.0",
           "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
-          "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE="
+          "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE=",
+          "requires": {
+            "graceful-fs": "4.1.11",
+            "pify": "2.3.0",
+            "pinkie-promise": "2.0.1"
+          }
         },
         "pify": {
           "version": "2.3.0",
@@ -10047,22 +11511,39 @@
         "read-pkg": {
           "version": "1.1.0",
           "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
-          "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg="
+          "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg=",
+          "requires": {
+            "load-json-file": "1.1.0",
+            "normalize-package-data": "2.4.0",
+            "path-type": "1.1.0"
+          }
         },
         "read-pkg-up": {
           "version": "1.0.1",
           "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
-          "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI="
+          "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI=",
+          "requires": {
+            "find-up": "1.1.2",
+            "read-pkg": "1.1.0"
+          }
         },
         "string-width": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
-          "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
+          "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
+          "requires": {
+            "code-point-at": "1.1.0",
+            "is-fullwidth-code-point": "1.0.0",
+            "strip-ansi": "3.0.1"
+          }
         },
         "strip-bom": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
-          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4=",
+          "requires": {
+            "is-utf8": "0.2.1"
+          }
         },
         "which-module": {
           "version": "1.0.0",
@@ -10072,19 +11553,44 @@
         "yargs": {
           "version": "7.1.0",
           "resolved": "https://registry.npmjs.org/yargs/-/yargs-7.1.0.tgz",
-          "integrity": "sha1-a6MY6xaWFyf10oT46gA+jWFU0Mg="
+          "integrity": "sha1-a6MY6xaWFyf10oT46gA+jWFU0Mg=",
+          "requires": {
+            "camelcase": "3.0.0",
+            "cliui": "3.2.0",
+            "decamelize": "1.2.0",
+            "get-caller-file": "1.0.2",
+            "os-locale": "1.4.0",
+            "read-pkg-up": "1.0.1",
+            "require-directory": "2.1.1",
+            "require-main-filename": "1.0.1",
+            "set-blocking": "2.0.0",
+            "string-width": "1.0.2",
+            "which-module": "1.0.0",
+            "y18n": "3.2.1",
+            "yargs-parser": "5.0.0"
+          }
         },
         "yargs-parser": {
           "version": "5.0.0",
           "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-5.0.0.tgz",
-          "integrity": "sha1-J17PDX/+Bcd+ZOfIbkzZS/DhIoo="
+          "integrity": "sha1-J17PDX/+Bcd+ZOfIbkzZS/DhIoo=",
+          "requires": {
+            "camelcase": "3.0.0"
+          }
         }
       }
     },
     "sass-loader": {
       "version": "6.0.6",
       "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-6.0.6.tgz",
-      "integrity": "sha512-c3/Zc+iW+qqDip6kXPYLEgsAu2lf4xz0EZDplB7EmSUMda12U1sGJPetH55B/j9eu0bTtKzKlNPWWyYC7wFNyQ=="
+      "integrity": "sha512-c3/Zc+iW+qqDip6kXPYLEgsAu2lf4xz0EZDplB7EmSUMda12U1sGJPetH55B/j9eu0bTtKzKlNPWWyYC7wFNyQ==",
+      "requires": {
+        "async": "2.6.0",
+        "clone-deep": "0.3.0",
+        "loader-utils": "1.1.0",
+        "lodash.tail": "4.1.1",
+        "pify": "3.0.0"
+      }
     },
     "sax": {
       "version": "1.2.4",
@@ -10094,12 +11600,29 @@
     "schema-utils": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-0.3.0.tgz",
-      "integrity": "sha1-9YdyIs4+kx7a4DnxfrNxbnE3+M8="
+      "integrity": "sha1-9YdyIs4+kx7a4DnxfrNxbnE3+M8=",
+      "requires": {
+        "ajv": "5.3.0"
+      }
     },
     "screener-runner": {
       "version": "0.6.19",
       "resolved": "https://registry.npmjs.org/screener-runner/-/screener-runner-0.6.19.tgz",
       "integrity": "sha1-tW//NG0Xf0Bn0IVFgOHsDiICvdg=",
+      "requires": {
+        "bluebird": "3.4.7",
+        "colors": "1.1.2",
+        "commander": "2.9.0",
+        "compression": "1.6.2",
+        "connect": "3.5.1",
+        "http-proxy": "1.16.2",
+        "joi": "9.2.0",
+        "lodash": "4.16.6",
+        "ngrok": "2.2.23",
+        "portfinder": "1.0.13",
+        "request": "2.78.0",
+        "request-promise": "4.1.1"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -10119,7 +11642,10 @@
         "boom": {
           "version": "2.10.1",
           "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
-          "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8="
+          "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8=",
+          "requires": {
+            "hoek": "2.16.3"
+          }
         },
         "bytes": {
           "version": "2.3.0",
@@ -10134,42 +11660,83 @@
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          }
         },
         "commander": {
           "version": "2.9.0",
           "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
-          "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q="
+          "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q=",
+          "requires": {
+            "graceful-readlink": "1.0.1"
+          }
         },
         "compression": {
           "version": "1.6.2",
           "resolved": "https://registry.npmjs.org/compression/-/compression-1.6.2.tgz",
-          "integrity": "sha1-zOsSHsydCcUtetDDNQ6pPd1AK8M="
+          "integrity": "sha1-zOsSHsydCcUtetDDNQ6pPd1AK8M=",
+          "requires": {
+            "accepts": "1.3.4",
+            "bytes": "2.3.0",
+            "compressible": "2.0.12",
+            "debug": "2.2.0",
+            "on-headers": "1.0.1",
+            "vary": "1.1.2"
+          }
         },
         "cryptiles": {
           "version": "2.0.5",
           "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz",
-          "integrity": "sha1-O9/s3GCBR8HGcgL6KR59ylnqo7g="
+          "integrity": "sha1-O9/s3GCBR8HGcgL6KR59ylnqo7g=",
+          "requires": {
+            "boom": "2.10.1"
+          }
         },
         "debug": {
           "version": "2.2.0",
           "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo=",
+          "requires": {
+            "ms": "0.7.1"
+          }
         },
         "form-data": {
           "version": "2.1.4",
           "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
-          "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE="
+          "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE=",
+          "requires": {
+            "asynckit": "0.4.0",
+            "combined-stream": "1.0.5",
+            "mime-types": "2.1.17"
+          }
         },
         "har-validator": {
           "version": "2.0.6",
           "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz",
-          "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0="
+          "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0=",
+          "requires": {
+            "chalk": "1.1.3",
+            "commander": "2.9.0",
+            "is-my-json-valid": "2.16.1",
+            "pinkie-promise": "2.0.1"
+          }
         },
         "hawk": {
           "version": "3.1.3",
           "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz",
-          "integrity": "sha1-B4REvXwWQLD+VA0sm3PVlnjo4cQ="
+          "integrity": "sha1-B4REvXwWQLD+VA0sm3PVlnjo4cQ=",
+          "requires": {
+            "boom": "2.10.1",
+            "cryptiles": "2.0.5",
+            "hoek": "2.16.3",
+            "sntp": "1.0.9"
+          }
         },
         "hoek": {
           "version": "2.16.3",
@@ -10179,7 +11746,12 @@
         "http-signature": {
           "version": "1.1.1",
           "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz",
-          "integrity": "sha1-33LiZwZs0Kxn+3at+OE0qPvPkb8="
+          "integrity": "sha1-33LiZwZs0Kxn+3at+OE0qPvPkb8=",
+          "requires": {
+            "assert-plus": "0.2.0",
+            "jsprim": "1.4.1",
+            "sshpk": "1.13.1"
+          }
         },
         "lodash": {
           "version": "4.16.6",
@@ -10204,12 +11776,37 @@
         "request": {
           "version": "2.78.0",
           "resolved": "https://registry.npmjs.org/request/-/request-2.78.0.tgz",
-          "integrity": "sha1-4cjew0bhyBkjskrNszfxHeyr6cw="
+          "integrity": "sha1-4cjew0bhyBkjskrNszfxHeyr6cw=",
+          "requires": {
+            "aws-sign2": "0.6.0",
+            "aws4": "1.6.0",
+            "caseless": "0.11.0",
+            "combined-stream": "1.0.5",
+            "extend": "3.0.1",
+            "forever-agent": "0.6.1",
+            "form-data": "2.1.4",
+            "har-validator": "2.0.6",
+            "hawk": "3.1.3",
+            "http-signature": "1.1.1",
+            "is-typedarray": "1.0.0",
+            "isstream": "0.1.2",
+            "json-stringify-safe": "5.0.1",
+            "mime-types": "2.1.17",
+            "node-uuid": "1.4.8",
+            "oauth-sign": "0.8.2",
+            "qs": "6.3.2",
+            "stringstream": "0.0.5",
+            "tough-cookie": "2.3.3",
+            "tunnel-agent": "0.4.3"
+          }
         },
         "sntp": {
           "version": "1.0.9",
           "resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz",
-          "integrity": "sha1-ZUEYTMkK7qbG57NeJlkIJEPGYZg="
+          "integrity": "sha1-ZUEYTMkK7qbG57NeJlkIJEPGYZg=",
+          "requires": {
+            "hoek": "2.16.3"
+          }
         },
         "supports-color": {
           "version": "2.0.0",
@@ -10224,9 +11821,23 @@
       }
     },
     "screener-storybook": {
-      "version": "0.9.3",
-      "resolved": "https://registry.npmjs.org/screener-storybook/-/screener-storybook-0.9.3.tgz",
-      "integrity": "sha1-7Gg8x0+ene+eiJh/dz53iZTqa28=",
+      "version": "0.9.8",
+      "resolved": "https://registry.npmjs.org/screener-storybook/-/screener-storybook-0.9.8.tgz",
+      "integrity": "sha1-c5ebm8SYJ7PdbZvNO81rC+7SVBY=",
+      "requires": {
+        "bluebird": "3.4.7",
+        "colors": "1.1.2",
+        "commander": "2.9.0",
+        "get-port": "3.2.0",
+        "joi": "10.0.6",
+        "jsdom": "9.8.3",
+        "lodash": "4.17.4",
+        "prop-types": "15.6.0",
+        "react": "15.6.2",
+        "react-dom": "15.4.2",
+        "request": "2.81.0",
+        "screener-runner": "0.7.6"
+      },
       "dependencies": {
         "acorn": {
           "version": "2.7.0",
@@ -10236,12 +11847,19 @@
         "acorn-globals": {
           "version": "1.0.9",
           "resolved": "https://registry.npmjs.org/acorn-globals/-/acorn-globals-1.0.9.tgz",
-          "integrity": "sha1-VbtemGkVB7dFedBRNBMhfDgMVM8="
+          "integrity": "sha1-VbtemGkVB7dFedBRNBMhfDgMVM8=",
+          "requires": {
+            "acorn": "2.7.0"
+          }
         },
         "ajv": {
           "version": "4.11.8",
           "resolved": "https://registry.npmjs.org/ajv/-/ajv-4.11.8.tgz",
-          "integrity": "sha1-gv+wKynmYq5TvcIK8VlHcGc5xTY="
+          "integrity": "sha1-gv+wKynmYq5TvcIK8VlHcGc5xTY=",
+          "requires": {
+            "co": "4.6.0",
+            "json-stable-stringify": "1.0.1"
+          }
         },
         "ansi-styles": {
           "version": "2.2.1",
@@ -10262,6 +11880,9 @@
           "version": "2.10.1",
           "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
           "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8=",
+          "requires": {
+            "hoek": "2.16.3"
+          },
           "dependencies": {
             "hoek": {
               "version": "2.16.3",
@@ -10278,32 +11899,61 @@
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          }
         },
         "commander": {
           "version": "2.9.0",
           "resolved": "https://registry.npmjs.org/commander/-/commander-2.9.0.tgz",
-          "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q="
+          "integrity": "sha1-nJkJQXbhIkDLItbFFGCYQA/g99Q=",
+          "requires": {
+            "graceful-readlink": "1.0.1"
+          }
         },
         "compression": {
           "version": "1.6.2",
           "resolved": "https://registry.npmjs.org/compression/-/compression-1.6.2.tgz",
-          "integrity": "sha1-zOsSHsydCcUtetDDNQ6pPd1AK8M="
+          "integrity": "sha1-zOsSHsydCcUtetDDNQ6pPd1AK8M=",
+          "requires": {
+            "accepts": "1.3.4",
+            "bytes": "2.3.0",
+            "compressible": "2.0.12",
+            "debug": "2.2.0",
+            "on-headers": "1.0.1",
+            "vary": "1.1.2"
+          }
         },
         "cryptiles": {
           "version": "2.0.5",
           "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz",
-          "integrity": "sha1-O9/s3GCBR8HGcgL6KR59ylnqo7g="
+          "integrity": "sha1-O9/s3GCBR8HGcgL6KR59ylnqo7g=",
+          "requires": {
+            "boom": "2.10.1"
+          }
         },
         "debug": {
           "version": "2.2.0",
           "resolved": "https://registry.npmjs.org/debug/-/debug-2.2.0.tgz",
-          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo="
+          "integrity": "sha1-+HBX6ZWxofauaklgZkE3vFbwOdo=",
+          "requires": {
+            "ms": "0.7.1"
+          }
         },
         "form-data": {
           "version": "2.1.4",
           "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
-          "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE="
+          "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE=",
+          "requires": {
+            "asynckit": "0.4.0",
+            "combined-stream": "1.0.5",
+            "mime-types": "2.1.17"
+          }
         },
         "har-schema": {
           "version": "1.0.5",
@@ -10313,12 +11963,22 @@
         "har-validator": {
           "version": "4.2.1",
           "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-4.2.1.tgz",
-          "integrity": "sha1-M0gdDxu/9gDdID11gSpqX7oALio="
+          "integrity": "sha1-M0gdDxu/9gDdID11gSpqX7oALio=",
+          "requires": {
+            "ajv": "4.11.8",
+            "har-schema": "1.0.5"
+          }
         },
         "hawk": {
           "version": "3.1.3",
           "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz",
           "integrity": "sha1-B4REvXwWQLD+VA0sm3PVlnjo4cQ=",
+          "requires": {
+            "boom": "2.10.1",
+            "cryptiles": "2.0.5",
+            "hoek": "2.16.3",
+            "sntp": "1.0.9"
+          },
           "dependencies": {
             "hoek": {
               "version": "2.16.3",
@@ -10330,17 +11990,50 @@
         "http-signature": {
           "version": "1.1.1",
           "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz",
-          "integrity": "sha1-33LiZwZs0Kxn+3at+OE0qPvPkb8="
+          "integrity": "sha1-33LiZwZs0Kxn+3at+OE0qPvPkb8=",
+          "requires": {
+            "assert-plus": "0.2.0",
+            "jsprim": "1.4.1",
+            "sshpk": "1.13.1"
+          }
         },
         "joi": {
           "version": "10.0.6",
           "resolved": "https://registry.npmjs.org/joi/-/joi-10.0.6.tgz",
-          "integrity": "sha1-26y78wtNu50o72cW2CxFgLsEwJY="
+          "integrity": "sha1-26y78wtNu50o72cW2CxFgLsEwJY=",
+          "requires": {
+            "hoek": "4.2.0",
+            "isemail": "2.2.1",
+            "items": "2.1.1",
+            "topo": "2.0.2"
+          }
         },
         "jsdom": {
           "version": "9.8.3",
           "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-9.8.3.tgz",
-          "integrity": "sha1-/eKcEJwyoRMeC2xlkU5kGY+Xw3A="
+          "integrity": "sha1-/eKcEJwyoRMeC2xlkU5kGY+Xw3A=",
+          "requires": {
+            "abab": "1.0.4",
+            "acorn": "2.7.0",
+            "acorn-globals": "1.0.9",
+            "array-equal": "1.0.0",
+            "content-type-parser": "1.0.2",
+            "cssom": "0.3.2",
+            "cssstyle": "0.2.37",
+            "escodegen": "1.9.0",
+            "html-encoding-sniffer": "1.0.2",
+            "iconv-lite": "0.4.19",
+            "nwmatcher": "1.4.3",
+            "parse5": "1.5.1",
+            "request": "2.81.0",
+            "sax": "1.2.4",
+            "symbol-tree": "3.2.2",
+            "tough-cookie": "2.3.3",
+            "webidl-conversions": "3.0.1",
+            "whatwg-encoding": "1.0.3",
+            "whatwg-url": "3.1.0",
+            "xml-name-validator": "2.0.1"
+          }
         },
         "ms": {
           "version": "0.7.1",
@@ -10365,17 +12058,60 @@
         "react-dom": {
           "version": "15.4.2",
           "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-15.4.2.tgz",
-          "integrity": "sha1-AVNj8FsKH9Uq6e/dOgBg2QaVII8="
+          "integrity": "sha1-AVNj8FsKH9Uq6e/dOgBg2QaVII8=",
+          "requires": {
+            "fbjs": "0.8.16",
+            "loose-envify": "1.3.1",
+            "object-assign": "4.1.1"
+          }
         },
         "request": {
           "version": "2.81.0",
           "resolved": "https://registry.npmjs.org/request/-/request-2.81.0.tgz",
-          "integrity": "sha1-xpKJRqDgbF+Nb4qTM0af/aRimKA="
+          "integrity": "sha1-xpKJRqDgbF+Nb4qTM0af/aRimKA=",
+          "requires": {
+            "aws-sign2": "0.6.0",
+            "aws4": "1.6.0",
+            "caseless": "0.12.0",
+            "combined-stream": "1.0.5",
+            "extend": "3.0.1",
+            "forever-agent": "0.6.1",
+            "form-data": "2.1.4",
+            "har-validator": "4.2.1",
+            "hawk": "3.1.3",
+            "http-signature": "1.1.1",
+            "is-typedarray": "1.0.0",
+            "isstream": "0.1.2",
+            "json-stringify-safe": "5.0.1",
+            "mime-types": "2.1.17",
+            "oauth-sign": "0.8.2",
+            "performance-now": "0.2.0",
+            "qs": "6.4.0",
+            "safe-buffer": "5.1.1",
+            "stringstream": "0.0.5",
+            "tough-cookie": "2.3.3",
+            "tunnel-agent": "0.6.0",
+            "uuid": "3.1.0"
+          }
         },
         "screener-runner": {
-          "version": "0.7.3",
-          "resolved": "https://registry.npmjs.org/screener-runner/-/screener-runner-0.7.3.tgz",
-          "integrity": "sha1-+fePjLewRjmJFLE6SJsflg3KzVI=",
+          "version": "0.7.6",
+          "resolved": "https://registry.npmjs.org/screener-runner/-/screener-runner-0.7.6.tgz",
+          "integrity": "sha1-GgiijinbwmWALODiIF0Y1BWStWc=",
+          "requires": {
+            "bluebird": "3.4.7",
+            "colors": "1.1.2",
+            "commander": "2.9.0",
+            "compression": "1.6.2",
+            "connect": "3.5.1",
+            "http-proxy": "1.16.2",
+            "joi": "9.2.0",
+            "lodash": "4.16.6",
+            "ngrok": "2.2.23",
+            "portfinder": "1.0.13",
+            "request": "2.78.0",
+            "request-promise": "4.1.1"
+          },
           "dependencies": {
             "caseless": {
               "version": "0.11.0",
@@ -10385,12 +12121,25 @@
             "har-validator": {
               "version": "2.0.6",
               "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz",
-              "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0="
+              "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0=",
+              "requires": {
+                "chalk": "1.1.3",
+                "commander": "2.9.0",
+                "is-my-json-valid": "2.16.1",
+                "pinkie-promise": "2.0.1"
+              }
             },
             "joi": {
               "version": "9.2.0",
               "resolved": "https://registry.npmjs.org/joi/-/joi-9.2.0.tgz",
-              "integrity": "sha1-M4WseQGSEwy+Iw6ALsAskhW7/to="
+              "integrity": "sha1-M4WseQGSEwy+Iw6ALsAskhW7/to=",
+              "requires": {
+                "hoek": "4.2.0",
+                "isemail": "2.2.1",
+                "items": "2.1.1",
+                "moment": "2.19.1",
+                "topo": "2.0.2"
+              }
             },
             "lodash": {
               "version": "4.16.6",
@@ -10405,7 +12154,29 @@
             "request": {
               "version": "2.78.0",
               "resolved": "https://registry.npmjs.org/request/-/request-2.78.0.tgz",
-              "integrity": "sha1-4cjew0bhyBkjskrNszfxHeyr6cw="
+              "integrity": "sha1-4cjew0bhyBkjskrNszfxHeyr6cw=",
+              "requires": {
+                "aws-sign2": "0.6.0",
+                "aws4": "1.6.0",
+                "caseless": "0.11.0",
+                "combined-stream": "1.0.5",
+                "extend": "3.0.1",
+                "forever-agent": "0.6.1",
+                "form-data": "2.1.4",
+                "har-validator": "2.0.6",
+                "hawk": "3.1.3",
+                "http-signature": "1.1.1",
+                "is-typedarray": "1.0.0",
+                "isstream": "0.1.2",
+                "json-stringify-safe": "5.0.1",
+                "mime-types": "2.1.17",
+                "node-uuid": "1.4.8",
+                "oauth-sign": "0.8.2",
+                "qs": "6.3.2",
+                "stringstream": "0.0.5",
+                "tough-cookie": "2.3.3",
+                "tunnel-agent": "0.4.3"
+              }
             },
             "tunnel-agent": {
               "version": "0.4.3",
@@ -10414,15 +12185,13 @@
             }
           }
         },
-        "semver": {
-          "version": "5.3.0",
-          "resolved": "https://registry.npmjs.org/semver/-/semver-5.3.0.tgz",
-          "integrity": "sha1-myzl094C0XxgEq0yaqa00M9U+U8="
-        },
         "sntp": {
           "version": "1.0.9",
           "resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz",
           "integrity": "sha1-ZUEYTMkK7qbG57NeJlkIJEPGYZg=",
+          "requires": {
+            "hoek": "2.16.3"
+          },
           "dependencies": {
             "hoek": {
               "version": "2.16.3",
@@ -10444,7 +12213,11 @@
         "whatwg-url": {
           "version": "3.1.0",
           "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-3.1.0.tgz",
-          "integrity": "sha1-e9yuSQ+SGu9kUftnOexrvY6Qe/Y="
+          "integrity": "sha1-e9yuSQ+SGu9kUftnOexrvY6Qe/Y=",
+          "requires": {
+            "tr46": "0.0.3",
+            "webidl-conversions": "3.0.1"
+          }
         }
       }
     },
@@ -10452,11 +12225,18 @@
       "version": "0.2.3",
       "resolved": "https://registry.npmjs.org/scss-tokenizer/-/scss-tokenizer-0.2.3.tgz",
       "integrity": "sha1-jrBtualyMzOCTT9VMGQRSYR85dE=",
+      "requires": {
+        "js-base64": "2.3.2",
+        "source-map": "0.4.4"
+      },
       "dependencies": {
         "source-map": {
           "version": "0.4.4",
           "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
-          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s="
+          "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s=",
+          "requires": {
+            "amdefine": "1.0.1"
+          }
         }
       }
     },
@@ -10468,7 +12248,10 @@
     "selfsigned": {
       "version": "1.10.1",
       "resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-1.10.1.tgz",
-      "integrity": "sha1-v4y3uDJWxFUeMTR8YxF3jbme7FI="
+      "integrity": "sha1-v4y3uDJWxFUeMTR8YxF3jbme7FI=",
+      "requires": {
+        "node-forge": "0.6.33"
+      }
     },
     "semver": {
       "version": "5.4.1",
@@ -10478,22 +12261,59 @@
     "send": {
       "version": "0.16.1",
       "resolved": "https://registry.npmjs.org/send/-/send-0.16.1.tgz",
-      "integrity": "sha512-ElCLJdJIKPk6ux/Hocwhk7NFHpI3pVm/IZOYWqUmoxcgeyM+MpxHHKhb8QmlJDX1pU6WrgaHBkVNm73Sv7uc2A=="
+      "integrity": "sha512-ElCLJdJIKPk6ux/Hocwhk7NFHpI3pVm/IZOYWqUmoxcgeyM+MpxHHKhb8QmlJDX1pU6WrgaHBkVNm73Sv7uc2A==",
+      "requires": {
+        "debug": "2.6.9",
+        "depd": "1.1.1",
+        "destroy": "1.0.4",
+        "encodeurl": "1.0.1",
+        "escape-html": "1.0.3",
+        "etag": "1.8.1",
+        "fresh": "0.5.2",
+        "http-errors": "1.6.2",
+        "mime": "1.4.1",
+        "ms": "2.0.0",
+        "on-finished": "2.3.0",
+        "range-parser": "1.2.0",
+        "statuses": "1.3.1"
+      }
     },
     "serve-favicon": {
       "version": "2.4.5",
       "resolved": "https://registry.npmjs.org/serve-favicon/-/serve-favicon-2.4.5.tgz",
-      "integrity": "sha512-s7F8h2NrslMkG50KxvlGdj+ApSwaLex0vexuJ9iFf3GLTIp1ph/l1qZvRe9T9TJEYZgmq72ZwJ2VYiAEtChknw=="
+      "integrity": "sha512-s7F8h2NrslMkG50KxvlGdj+ApSwaLex0vexuJ9iFf3GLTIp1ph/l1qZvRe9T9TJEYZgmq72ZwJ2VYiAEtChknw==",
+      "requires": {
+        "etag": "1.8.1",
+        "fresh": "0.5.2",
+        "ms": "2.0.0",
+        "parseurl": "1.3.2",
+        "safe-buffer": "5.1.1"
+      }
     },
     "serve-index": {
       "version": "1.9.1",
       "resolved": "https://registry.npmjs.org/serve-index/-/serve-index-1.9.1.tgz",
-      "integrity": "sha1-03aNabHn2C5c4FD/9bRTvqEqkjk="
+      "integrity": "sha1-03aNabHn2C5c4FD/9bRTvqEqkjk=",
+      "requires": {
+        "accepts": "1.3.4",
+        "batch": "0.6.1",
+        "debug": "2.6.9",
+        "escape-html": "1.0.3",
+        "http-errors": "1.6.2",
+        "mime-types": "2.1.17",
+        "parseurl": "1.3.2"
+      }
     },
     "serve-static": {
       "version": "1.13.1",
       "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.13.1.tgz",
-      "integrity": "sha512-hSMUZrsPa/I09VYFJwa627JJkNs0NrfL1Uzuup+GqHfToR2KcsXFymXSV90hoyw3M+msjFuQly+YzIH/q0MGlQ=="
+      "integrity": "sha512-hSMUZrsPa/I09VYFJwa627JJkNs0NrfL1Uzuup+GqHfToR2KcsXFymXSV90hoyw3M+msjFuQly+YzIH/q0MGlQ==",
+      "requires": {
+        "encodeurl": "1.0.1",
+        "escape-html": "1.0.3",
+        "parseurl": "1.3.2",
+        "send": "0.16.1"
+      }
     },
     "set-blocking": {
       "version": "2.0.0",
@@ -10503,7 +12323,10 @@
     "set-getter": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/set-getter/-/set-getter-0.1.0.tgz",
-      "integrity": "sha1-12nBgsnVpR9AkUXy+6guXoboA3Y="
+      "integrity": "sha1-12nBgsnVpR9AkUXy+6guXoboA3Y=",
+      "requires": {
+        "to-object-path": "0.3.0"
+      }
     },
     "set-immediate-shim": {
       "version": "1.0.1",
@@ -10514,12 +12337,11 @@
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/set-value/-/set-value-2.0.0.tgz",
       "integrity": "sha512-hw0yxk9GT/Hr5yJEYnHNKYXkIA8mVJgd9ditYZCe16ZczcaELYYcfvaXesNACk2O8O0nTiPQcQhGUQj8JLzeeg==",
-      "dependencies": {
-        "split-string": {
-          "version": "3.0.2",
-          "resolved": "https://registry.npmjs.org/split-string/-/split-string-3.0.2.tgz",
-          "integrity": "sha512-d6myUSfwmBz1izkY4r7r7I0PL41rh21qUDYK1OgclmGHeoqQoujduGxMbzw6BlF3HKmJR4sMpbWVo7/Xzg4YBQ=="
-        }
+      "requires": {
+        "extend-shallow": "2.0.1",
+        "is-extendable": "0.1.1",
+        "is-plain-object": "2.0.4",
+        "split-string": "3.0.2"
       }
     },
     "setimmediate": {
@@ -10528,24 +12350,37 @@
       "integrity": "sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU="
     },
     "setprototypeof": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.0.3.tgz",
-      "integrity": "sha1-ZlZ+NwQ+608E2RvWWMDL77VbjgQ="
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.0.tgz",
+      "integrity": "sha512-BvE/TwpZX4FXExxOxZyRGQQv651MSwmWKZGqvmPcRIjDqWub67kTKuIMx43cZZrS/cBBzwBcNDWoFxt2XEFIpQ=="
     },
     "sha.js": {
       "version": "2.4.9",
       "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.9.tgz",
-      "integrity": "sha512-G8zektVqbiPHrylgew9Zg1VRB1L/DtXNUVAM6q4QLy8NE3qtHlFXTf8VLL4k1Yl6c7NMjtZUTdXV+X44nFaT6A=="
+      "integrity": "sha512-G8zektVqbiPHrylgew9Zg1VRB1L/DtXNUVAM6q4QLy8NE3qtHlFXTf8VLL4k1Yl6c7NMjtZUTdXV+X44nFaT6A==",
+      "requires": {
+        "inherits": "2.0.3",
+        "safe-buffer": "5.1.1"
+      }
     },
     "shallow-clone": {
       "version": "0.1.2",
       "resolved": "https://registry.npmjs.org/shallow-clone/-/shallow-clone-0.1.2.tgz",
       "integrity": "sha1-WQnodLp3EG1zrEFM/sH/yofZcGA=",
+      "requires": {
+        "is-extendable": "0.1.1",
+        "kind-of": "2.0.1",
+        "lazy-cache": "0.2.7",
+        "mixin-object": "2.0.1"
+      },
       "dependencies": {
         "kind-of": {
           "version": "2.0.1",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-2.0.1.tgz",
-          "integrity": "sha1-AY7HpM5+OobLkUG+UZ0kyPqpgbU="
+          "integrity": "sha1-AY7HpM5+OobLkUG+UZ0kyPqpgbU=",
+          "requires": {
+            "is-buffer": "1.1.6"
+          }
         },
         "lazy-cache": {
           "version": "0.2.7",
@@ -10557,12 +12392,18 @@
     "shallowequal": {
       "version": "0.2.2",
       "resolved": "https://registry.npmjs.org/shallowequal/-/shallowequal-0.2.2.tgz",
-      "integrity": "sha1-HjL9W8q2rWiKSBLLDMBO/HXHAU4="
+      "integrity": "sha1-HjL9W8q2rWiKSBLLDMBO/HXHAU4=",
+      "requires": {
+        "lodash.keys": "3.1.2"
+      }
     },
     "shebang-command": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-1.2.0.tgz",
-      "integrity": "sha1-RKrGW2lbAzmJaMOfNj/uXer98eo="
+      "integrity": "sha1-RKrGW2lbAzmJaMOfNj/uXer98eo=",
+      "requires": {
+        "shebang-regex": "1.0.0"
+      }
     },
     "shebang-regex": {
       "version": "1.0.0",
@@ -10572,12 +12413,23 @@
     "shell-quote": {
       "version": "1.6.1",
       "resolved": "https://registry.npmjs.org/shell-quote/-/shell-quote-1.6.1.tgz",
-      "integrity": "sha1-9HgZSczkAmlxJ0MOo7PFR29IF2c="
+      "integrity": "sha1-9HgZSczkAmlxJ0MOo7PFR29IF2c=",
+      "requires": {
+        "array-filter": "0.0.1",
+        "array-map": "0.0.0",
+        "array-reduce": "0.0.0",
+        "jsonify": "0.0.0"
+      }
     },
     "shelljs": {
       "version": "0.7.8",
       "resolved": "https://registry.npmjs.org/shelljs/-/shelljs-0.7.8.tgz",
-      "integrity": "sha1-3svPh0sNHl+3LhSxZKloMEjprLM="
+      "integrity": "sha1-3svPh0sNHl+3LhSxZKloMEjprLM=",
+      "requires": {
+        "glob": "7.1.2",
+        "interpret": "1.0.4",
+        "rechoir": "0.6.2"
+      }
     },
     "shellwords": {
       "version": "0.1.1",
@@ -10590,9 +12442,18 @@
       "integrity": "sha1-tf3AjxKH6hF4Yo5BXiUTK3NkbG0="
     },
     "sinon": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/sinon/-/sinon-4.0.1.tgz",
-      "integrity": "sha512-4qIY0pCWCvGCJpV/1JkFu9kbsNEZ9O34cG1oru/c7OCDtrEs50Gq/VjkA2ID5ZwLyoNx1i1ws118oh/p6fVeDg=="
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/sinon/-/sinon-4.1.2.tgz",
+      "integrity": "sha512-5uLBZPdCWl59Lpbf45ygKj7Z0LVol+ftBe7RDIXOQV/sF58pcFmbK8raA7bt6eljNuGnvBP+/ZxlicVn0emDjA==",
+      "requires": {
+        "diff": "3.4.0",
+        "formatio": "1.2.0",
+        "lodash.get": "4.4.2",
+        "lolex": "2.3.0",
+        "nise": "1.2.0",
+        "supports-color": "4.5.0",
+        "type-detect": "4.0.3"
+      }
     },
     "slash": {
       "version": "1.0.0",
@@ -10603,16 +12464,39 @@
       "version": "0.8.1",
       "resolved": "https://registry.npmjs.org/snapdragon/-/snapdragon-0.8.1.tgz",
       "integrity": "sha1-4StUh/re0+PeoKyR6UAL91tAE3A=",
+      "requires": {
+        "base": "0.11.2",
+        "debug": "2.6.9",
+        "define-property": "0.2.5",
+        "extend-shallow": "2.0.1",
+        "map-cache": "0.2.2",
+        "source-map": "0.5.7",
+        "source-map-resolve": "0.5.1",
+        "use": "2.0.2"
+      },
       "dependencies": {
         "define-property": {
           "version": "0.2.5",
           "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
-          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY="
+          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY=",
+          "requires": {
+            "is-descriptor": "0.1.6"
+          }
         },
         "is-descriptor": {
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
-          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
+          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg==",
+          "requires": {
+            "is-accessor-descriptor": "0.1.6",
+            "is-data-descriptor": "0.1.4",
+            "kind-of": "5.1.0"
+          }
+        },
+        "kind-of": {
+          "version": "5.1.0",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
+          "integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw=="
         },
         "source-map": {
           "version": "0.5.7",
@@ -10624,29 +12508,47 @@
     "snapdragon-node": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/snapdragon-node/-/snapdragon-node-2.1.1.tgz",
-      "integrity": "sha512-O27l4xaMYt/RSQ5TR3vpWCAB5Kb/czIcqUFOM/C4fYcLnbZUc1PkjTAMjof2pBWaSTwOUd6qUHcFGVGj7aIwnw=="
+      "integrity": "sha512-O27l4xaMYt/RSQ5TR3vpWCAB5Kb/czIcqUFOM/C4fYcLnbZUc1PkjTAMjof2pBWaSTwOUd6qUHcFGVGj7aIwnw==",
+      "requires": {
+        "define-property": "1.0.0",
+        "isobject": "3.0.1",
+        "snapdragon-util": "3.0.1"
+      }
     },
     "snapdragon-util": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/snapdragon-util/-/snapdragon-util-3.0.1.tgz",
       "integrity": "sha512-mbKkMdQKsjX4BAL4bRYTj21edOf8cN7XHdYUJEe+Zn99hVEYcMvKPct1IqNe7+AZPirn8BCDOQBHQZknqmKlZQ==",
+      "requires": {
+        "kind-of": "3.2.2"
+      },
       "dependencies": {
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+          "requires": {
+            "is-buffer": "1.1.6"
+          }
         }
       }
     },
     "sntp": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/sntp/-/sntp-2.0.2.tgz",
-      "integrity": "sha1-UGQRDwr4X3z9t9a2ekACjOUrSys="
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/sntp/-/sntp-2.1.0.tgz",
+      "integrity": "sha512-FL1b58BDrqS3A11lJ0zEdnJ3UOKqVxawAkF3k7F0CVN7VQ34aZrV+G8BZ1WC9ZL7NyrwsW0oviwsWDgRuVYtJg==",
+      "requires": {
+        "hoek": "4.2.0"
+      }
     },
     "sockjs": {
       "version": "0.3.18",
       "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.18.tgz",
       "integrity": "sha1-2bKJMWyn33dZXvKZ4HXw+TfrQgc=",
+      "requires": {
+        "faye-websocket": "0.10.0",
+        "uuid": "2.0.3"
+      },
       "dependencies": {
         "uuid": {
           "version": "2.0.3",
@@ -10659,18 +12561,32 @@
       "version": "1.1.4",
       "resolved": "https://registry.npmjs.org/sockjs-client/-/sockjs-client-1.1.4.tgz",
       "integrity": "sha1-W6vjhrd15M8U51IJEUUmVAFsixI=",
+      "requires": {
+        "debug": "2.6.9",
+        "eventsource": "0.1.6",
+        "faye-websocket": "0.11.1",
+        "inherits": "2.0.3",
+        "json3": "3.3.2",
+        "url-parse": "1.2.0"
+      },
       "dependencies": {
         "faye-websocket": {
           "version": "0.11.1",
           "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.1.tgz",
-          "integrity": "sha1-8O/hjE9W5PQK/H4Gxxn9XuYYjzg="
+          "integrity": "sha1-8O/hjE9W5PQK/H4Gxxn9XuYYjzg=",
+          "requires": {
+            "websocket-driver": "0.7.0"
+          }
         }
       }
     },
     "sort-keys": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/sort-keys/-/sort-keys-1.1.2.tgz",
-      "integrity": "sha1-RBttTTRnmPG05J6JIK37oOVD+a0="
+      "integrity": "sha1-RBttTTRnmPG05J6JIK37oOVD+a0=",
+      "requires": {
+        "is-plain-obj": "1.1.0"
+      }
     },
     "source-list-map": {
       "version": "2.0.0",
@@ -10683,36 +12599,47 @@
       "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g=="
     },
     "source-map-loader": {
-      "version": "0.2.2",
-      "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.2.tgz",
-      "integrity": "sha512-C3iYM6IqMT6jVzo6HTDmeZz9QP0ott9LtOeDJAPDQlHG5uJx+whP3c39TCMc1/FqP0feo546wCgt89JCn6DBMg==",
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-0.2.3.tgz",
+      "integrity": "sha512-MYbFX9DYxmTQFfy2v8FC1XZwpwHKYxg3SK8Wb7VPBKuhDjz8gi9re2819MsG4p49HDyiOSUKlmZ+nQBArW5CGw==",
+      "requires": {
+        "async": "2.6.0",
+        "loader-utils": "0.2.17",
+        "source-map": "0.6.1"
+      },
       "dependencies": {
-        "async": {
-          "version": "0.9.2",
-          "resolved": "https://registry.npmjs.org/async/-/async-0.9.2.tgz",
-          "integrity": "sha1-rqdNXmHB+JlhO/ZL2mbUx48v0X0="
-        },
         "loader-utils": {
           "version": "0.2.17",
           "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz",
-          "integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g="
-        },
-        "source-map": {
-          "version": "0.1.43",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz",
-          "integrity": "sha1-wkvBRspRfBRx9drL4lcbK3+eM0Y="
+          "integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g=",
+          "requires": {
+            "big.js": "3.2.0",
+            "emojis-list": "2.1.0",
+            "json5": "0.5.1",
+            "object-assign": "4.1.1"
+          }
         }
       }
     },
     "source-map-resolve": {
-      "version": "0.5.0",
-      "resolved": "https://registry.npmjs.org/source-map-resolve/-/source-map-resolve-0.5.0.tgz",
-      "integrity": "sha1-/K0LZLcK+ydpnkJZUMtevNQQvCA="
+      "version": "0.5.1",
+      "resolved": "https://registry.npmjs.org/source-map-resolve/-/source-map-resolve-0.5.1.tgz",
+      "integrity": "sha512-0KW2wvzfxm8NCTb30z0LMNyPqWCdDGE2viwzUaucqJdkTRXtZiSY3I+2A6nVAjmdOy0I4gU8DwnVVGsk9jvP2A==",
+      "requires": {
+        "atob": "2.0.3",
+        "decode-uri-component": "0.2.0",
+        "resolve-url": "0.2.1",
+        "source-map-url": "0.4.0",
+        "urix": "0.1.0"
+      }
     },
     "source-map-support": {
       "version": "0.4.18",
       "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.4.18.tgz",
       "integrity": "sha512-try0/JqxPLF9nOjvSta7tVondkP5dwgyLDjVoyMDlmjugT2lRZ1OfsrYTkCd2hkDnJTKRbO/Rl3orm8vlsUzbA==",
+      "requires": {
+        "source-map": "0.5.7"
+      },
       "dependencies": {
         "source-map": {
           "version": "0.5.7",
@@ -10729,7 +12656,10 @@
     "spdx-correct": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-1.0.2.tgz",
-      "integrity": "sha1-SzBz2TP/UfORLwOsVRlJikFQ20A="
+      "integrity": "sha1-SzBz2TP/UfORLwOsVRlJikFQ20A=",
+      "requires": {
+        "spdx-license-ids": "1.2.2"
+      }
     },
     "spdx-expression-parse": {
       "version": "1.0.4",
@@ -10744,17 +12674,37 @@
     "spdy": {
       "version": "3.4.7",
       "resolved": "https://registry.npmjs.org/spdy/-/spdy-3.4.7.tgz",
-      "integrity": "sha1-Qv9B7OXMD5mjpsKKq7c/XDsDrLw="
+      "integrity": "sha1-Qv9B7OXMD5mjpsKKq7c/XDsDrLw=",
+      "requires": {
+        "debug": "2.6.9",
+        "handle-thing": "1.2.5",
+        "http-deceiver": "1.2.7",
+        "safe-buffer": "5.1.1",
+        "select-hose": "2.0.0",
+        "spdy-transport": "2.0.20"
+      }
     },
     "spdy-transport": {
       "version": "2.0.20",
       "resolved": "https://registry.npmjs.org/spdy-transport/-/spdy-transport-2.0.20.tgz",
-      "integrity": "sha1-c15yBUxIayNU/onnAiVgBKOazk0="
+      "integrity": "sha1-c15yBUxIayNU/onnAiVgBKOazk0=",
+      "requires": {
+        "debug": "2.6.9",
+        "detect-node": "2.0.3",
+        "hpack.js": "2.1.6",
+        "obuf": "1.1.1",
+        "readable-stream": "2.3.3",
+        "safe-buffer": "5.1.1",
+        "wbuf": "1.7.2"
+      }
     },
     "split-string": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/split-string/-/split-string-2.1.1.tgz",
-      "integrity": "sha1-r0sG2CFWBCZEbDzZMc2mGJQNN9A="
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/split-string/-/split-string-3.0.2.tgz",
+      "integrity": "sha512-d6myUSfwmBz1izkY4r7r7I0PL41rh21qUDYK1OgclmGHeoqQoujduGxMbzw6BlF3HKmJR4sMpbWVo7/Xzg4YBQ==",
+      "requires": {
+        "extend-shallow": "2.0.1"
+      }
     },
     "sprintf-js": {
       "version": "1.0.3",
@@ -10764,22 +12714,45 @@
     "sshpk": {
       "version": "1.13.1",
       "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.13.1.tgz",
-      "integrity": "sha1-US322mKHFEMW3EwY/hzx2UBzm+M="
+      "integrity": "sha1-US322mKHFEMW3EwY/hzx2UBzm+M=",
+      "requires": {
+        "asn1": "0.2.3",
+        "assert-plus": "1.0.0",
+        "dashdash": "1.14.1",
+        "getpass": "0.1.7"
+      }
     },
     "static-extend": {
       "version": "0.1.2",
       "resolved": "https://registry.npmjs.org/static-extend/-/static-extend-0.1.2.tgz",
       "integrity": "sha1-YICcOcv/VTNyJv1eC1IPNB8ftcY=",
+      "requires": {
+        "define-property": "0.2.5",
+        "object-copy": "0.1.0"
+      },
       "dependencies": {
         "define-property": {
           "version": "0.2.5",
           "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
-          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY="
+          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY=",
+          "requires": {
+            "is-descriptor": "0.1.6"
+          }
         },
         "is-descriptor": {
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
-          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
+          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg==",
+          "requires": {
+            "is-accessor-descriptor": "0.1.6",
+            "is-data-descriptor": "0.1.4",
+            "kind-of": "5.1.0"
+          }
+        },
+        "kind-of": {
+          "version": "5.1.0",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
+          "integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw=="
         }
       }
     },
@@ -10791,7 +12764,10 @@
     "stdout-stream": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/stdout-stream/-/stdout-stream-1.4.0.tgz",
-      "integrity": "sha1-osfIWH5U2UJ+qe2zrD8s1SLfN4s="
+      "integrity": "sha1-osfIWH5U2UJ+qe2zrD8s1SLfN4s=",
+      "requires": {
+        "readable-stream": "2.3.3"
+      }
     },
     "stealthy-require": {
       "version": "1.1.1",
@@ -10801,12 +12777,21 @@
     "storybook-readme": {
       "version": "3.0.6",
       "resolved": "https://registry.npmjs.org/storybook-readme/-/storybook-readme-3.0.6.tgz",
-      "integrity": "sha1-R1oUpbOdx6hcQjQxJTor8fWxx4Y="
+      "integrity": "sha1-R1oUpbOdx6hcQjQxJTor8fWxx4Y=",
+      "requires": {
+        "prop-types": "15.6.0",
+        "react-remarkable": "1.1.3",
+        "string-raw": "1.0.1"
+      }
     },
     "stream-browserify": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-2.0.1.tgz",
-      "integrity": "sha1-ZiZu5fm9uZQKTkUUyvtDu3Hlyds="
+      "integrity": "sha1-ZiZu5fm9uZQKTkUUyvtDu3Hlyds=",
+      "requires": {
+        "inherits": "2.0.3",
+        "readable-stream": "2.3.3"
+      }
     },
     "stream-consume": {
       "version": "0.1.0",
@@ -10816,18 +12801,20 @@
     "stream-http": {
       "version": "2.7.2",
       "resolved": "https://registry.npmjs.org/stream-http/-/stream-http-2.7.2.tgz",
-      "integrity": "sha512-c0yTD2rbQzXtSsFSVhtpvY/vS6u066PcXOX9kBB3mSO76RiUQzL340uJkGBWnlBg4/HZzqiUXtaVA7wcRcJgEw=="
+      "integrity": "sha512-c0yTD2rbQzXtSsFSVhtpvY/vS6u066PcXOX9kBB3mSO76RiUQzL340uJkGBWnlBg4/HZzqiUXtaVA7wcRcJgEw==",
+      "requires": {
+        "builtin-status-codes": "3.0.0",
+        "inherits": "2.0.3",
+        "readable-stream": "2.3.3",
+        "to-arraybuffer": "1.0.1",
+        "xtend": "4.0.1"
+      }
     },
     "strict-uri-encode": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz",
       "integrity": "sha1-J5siXfHVgrH1TmWt3UNS4Y+qBxM="
     },
-    "string_decoder": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-      "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ=="
-    },
     "string-hash": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/string-hash/-/string-hash-1.1.3.tgz",
@@ -10837,6 +12824,10 @@
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/string-length/-/string-length-2.0.0.tgz",
       "integrity": "sha1-1A27aGo6zpYMHP/KVivyxF+DY+0=",
+      "requires": {
+        "astral-regex": "1.0.0",
+        "strip-ansi": "4.0.0"
+      },
       "dependencies": {
         "ansi-regex": {
           "version": "3.0.0",
@@ -10846,7 +12837,10 @@
         "strip-ansi": {
           "version": "4.0.0",
           "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
-          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8="
+          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
+          "requires": {
+            "ansi-regex": "3.0.0"
+          }
         }
       }
     },
@@ -10859,6 +12853,10 @@
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
       "integrity": "sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw==",
+      "requires": {
+        "is-fullwidth-code-point": "2.0.0",
+        "strip-ansi": "4.0.0"
+      },
       "dependencies": {
         "ansi-regex": {
           "version": "3.0.0",
@@ -10868,19 +12866,40 @@
         "strip-ansi": {
           "version": "4.0.0",
           "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
-          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8="
+          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
+          "requires": {
+            "ansi-regex": "3.0.0"
+          }
         }
       }
     },
     "string.prototype.padend": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/string.prototype.padend/-/string.prototype.padend-3.0.0.tgz",
-      "integrity": "sha1-86rvfBcZ8XDF6rHDK/eA2W4h8vA="
+      "integrity": "sha1-86rvfBcZ8XDF6rHDK/eA2W4h8vA=",
+      "requires": {
+        "define-properties": "1.1.2",
+        "es-abstract": "1.9.0",
+        "function-bind": "1.1.1"
+      }
     },
     "string.prototype.padstart": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/string.prototype.padstart/-/string.prototype.padstart-3.0.0.tgz",
-      "integrity": "sha1-W8+tOfRkm7LQMSkuGbzwtRDUskI="
+      "integrity": "sha1-W8+tOfRkm7LQMSkuGbzwtRDUskI=",
+      "requires": {
+        "define-properties": "1.1.2",
+        "es-abstract": "1.9.0",
+        "function-bind": "1.1.1"
+      }
+    },
+    "string_decoder": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+      "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ==",
+      "requires": {
+        "safe-buffer": "5.1.1"
+      }
     },
     "stringstream": {
       "version": "0.0.5",
@@ -10890,7 +12909,10 @@
     "strip-ansi": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
-      "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8="
+      "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
+      "requires": {
+        "ansi-regex": "2.1.1"
+      }
     },
     "strip-bom": {
       "version": "3.0.0",
@@ -10905,17 +12927,27 @@
     "strip-indent": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-1.0.1.tgz",
-      "integrity": "sha1-DHlipq3vp7vUrDZkYKY4VSrhoKI="
+      "integrity": "sha1-DHlipq3vp7vUrDZkYKY4VSrhoKI=",
+      "requires": {
+        "get-stdin": "4.0.1"
+      }
     },
     "style-loader": {
       "version": "0.18.2",
       "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.18.2.tgz",
-      "integrity": "sha512-WPpJPZGUxWYHWIUMNNOYqql7zh85zGmr84FdTVWq52WTIkqlW9xSxD3QYWi/T31cqn9UNSsietVEgGn2aaSCzw=="
+      "integrity": "sha512-WPpJPZGUxWYHWIUMNNOYqql7zh85zGmr84FdTVWq52WTIkqlW9xSxD3QYWi/T31cqn9UNSsietVEgGn2aaSCzw==",
+      "requires": {
+        "loader-utils": "1.1.0",
+        "schema-utils": "0.3.0"
+      }
     },
     "subarg": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/subarg/-/subarg-1.0.0.tgz",
       "integrity": "sha1-9izxdYHplrSPyWVpn1TAauJouNI=",
+      "requires": {
+        "minimist": "1.2.0"
+      },
       "dependencies": {
         "minimist": {
           "version": "1.2.0",
@@ -10927,7 +12959,10 @@
     "supports-color": {
       "version": "4.5.0",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.5.0.tgz",
-      "integrity": "sha1-vnoN5ITexcXN34s9WRJQRJEvY1s="
+      "integrity": "sha1-vnoN5ITexcXN34s9WRJQRJEvY1s=",
+      "requires": {
+        "has-flag": "2.0.0"
+      }
     },
     "svg-tag-names": {
       "version": "1.1.1",
@@ -10937,7 +12972,16 @@
     "svgo": {
       "version": "0.7.2",
       "resolved": "https://registry.npmjs.org/svgo/-/svgo-0.7.2.tgz",
-      "integrity": "sha1-n1dyQTlSE1xv779Ar+ak+qiLS7U="
+      "integrity": "sha1-n1dyQTlSE1xv779Ar+ak+qiLS7U=",
+      "requires": {
+        "coa": "1.0.4",
+        "colors": "1.1.2",
+        "csso": "2.3.2",
+        "js-yaml": "3.7.0",
+        "mkdirp": "0.5.1",
+        "sax": "1.2.4",
+        "whet.extend": "0.9.9"
+      }
     },
     "symbol-observable": {
       "version": "1.0.4",
@@ -10957,17 +13001,32 @@
     "tar": {
       "version": "2.2.1",
       "resolved": "https://registry.npmjs.org/tar/-/tar-2.2.1.tgz",
-      "integrity": "sha1-jk0qJWwOIYXGsYrWlK7JaLg8sdE="
+      "integrity": "sha1-jk0qJWwOIYXGsYrWlK7JaLg8sdE=",
+      "requires": {
+        "block-stream": "0.0.9",
+        "fstream": "1.0.11",
+        "inherits": "2.0.3"
+      }
     },
     "test-exclude": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/test-exclude/-/test-exclude-4.1.1.tgz",
       "integrity": "sha512-35+Asrsk3XHJDBgf/VRFexPgh3UyETv8IAn/LRTiZjVy6rjPVqdEk8dJcJYBzl1w0XCJM48lvTy8SfEsCWS4nA==",
+      "requires": {
+        "arrify": "1.0.1",
+        "micromatch": "2.3.11",
+        "object-assign": "4.1.1",
+        "read-pkg-up": "1.0.1",
+        "require-main-filename": "1.0.1"
+      },
       "dependencies": {
         "arr-diff": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
-          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8="
+          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8=",
+          "requires": {
+            "arr-flatten": "1.1.0"
+          }
         },
         "array-unique": {
           "version": "0.2.1",
@@ -10977,47 +13036,95 @@
         "braces": {
           "version": "1.8.5",
           "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
-          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc="
+          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc=",
+          "requires": {
+            "expand-range": "1.8.2",
+            "preserve": "0.2.0",
+            "repeat-element": "1.1.2"
+          }
         },
         "expand-brackets": {
           "version": "0.1.5",
           "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
-          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s="
+          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s=",
+          "requires": {
+            "is-posix-bracket": "0.1.1"
+          }
         },
         "extglob": {
           "version": "0.3.2",
           "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
-          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE="
+          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE=",
+          "requires": {
+            "is-extglob": "1.0.0"
+          }
         },
         "find-up": {
           "version": "1.1.2",
           "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
-          "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8="
+          "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8=",
+          "requires": {
+            "path-exists": "2.1.0",
+            "pinkie-promise": "2.0.1"
+          }
         },
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+          "requires": {
+            "is-buffer": "1.1.6"
+          }
         },
         "load-json-file": {
           "version": "1.1.0",
           "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
-          "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA="
+          "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
+          "requires": {
+            "graceful-fs": "4.1.11",
+            "parse-json": "2.2.0",
+            "pify": "2.3.0",
+            "pinkie-promise": "2.0.1",
+            "strip-bom": "2.0.0"
+          }
         },
         "micromatch": {
           "version": "2.3.11",
           "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
-          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU="
+          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU=",
+          "requires": {
+            "arr-diff": "2.0.0",
+            "array-unique": "0.2.1",
+            "braces": "1.8.5",
+            "expand-brackets": "0.1.5",
+            "extglob": "0.3.2",
+            "filename-regex": "2.0.1",
+            "is-extglob": "1.0.0",
+            "is-glob": "2.0.1",
+            "kind-of": "3.2.2",
+            "normalize-path": "2.1.1",
+            "object.omit": "2.0.1",
+            "parse-glob": "3.0.4",
+            "regex-cache": "0.4.4"
+          }
         },
         "path-exists": {
           "version": "2.1.0",
           "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
-          "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s="
+          "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s=",
+          "requires": {
+            "pinkie-promise": "2.0.1"
+          }
         },
         "path-type": {
           "version": "1.1.0",
           "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
-          "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE="
+          "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE=",
+          "requires": {
+            "graceful-fs": "4.1.11",
+            "pify": "2.3.0",
+            "pinkie-promise": "2.0.1"
+          }
         },
         "pify": {
           "version": "2.3.0",
@@ -11027,17 +13134,29 @@
         "read-pkg": {
           "version": "1.1.0",
           "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
-          "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg="
+          "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg=",
+          "requires": {
+            "load-json-file": "1.1.0",
+            "normalize-package-data": "2.4.0",
+            "path-type": "1.1.0"
+          }
         },
         "read-pkg-up": {
           "version": "1.0.1",
           "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
-          "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI="
+          "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI=",
+          "requires": {
+            "find-up": "1.1.2",
+            "read-pkg": "1.1.0"
+          }
         },
         "strip-bom": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
-          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4=",
+          "requires": {
+            "is-utf8": "0.2.1"
+          }
         }
       }
     },
@@ -11045,11 +13164,18 @@
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/test-value/-/test-value-2.1.0.tgz",
       "integrity": "sha1-Edpv9nDzRxpztiXKTz/c97t0gpE=",
+      "requires": {
+        "array-back": "1.0.4",
+        "typical": "2.6.1"
+      },
       "dependencies": {
         "array-back": {
           "version": "1.0.4",
           "resolved": "https://registry.npmjs.org/array-back/-/array-back-1.0.4.tgz",
-          "integrity": "sha1-ZEun8JX3/898Q7Xw3DnTwfA8Bjs="
+          "integrity": "sha1-ZEun8JX3/898Q7Xw3DnTwfA8Bjs=",
+          "requires": {
+            "typical": "2.6.1"
+          }
         }
       }
     },
@@ -11081,12 +13207,18 @@
     "timers-browserify": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.4.tgz",
-      "integrity": "sha512-uZYhyU3EX8O7HQP+J9fTVYwsq90Vr68xPEFo7yrVImIxYvHgukBEgOB/SgGoorWVTzGM/3Z+wUNnboA4M8jWrg=="
+      "integrity": "sha512-uZYhyU3EX8O7HQP+J9fTVYwsq90Vr68xPEFo7yrVImIxYvHgukBEgOB/SgGoorWVTzGM/3Z+wUNnboA4M8jWrg==",
+      "requires": {
+        "setimmediate": "1.0.5"
+      }
     },
     "tmp": {
       "version": "0.0.33",
       "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.33.tgz",
-      "integrity": "sha512-jRCJlojKnZ3addtTOjdIqoRuPEKBvNXcGYqzO6zWZX8KfKEpnGY5jfggJQ3EjKuu8D4bJRr0y+cYJFmYbImXGw=="
+      "integrity": "sha512-jRCJlojKnZ3addtTOjdIqoRuPEKBvNXcGYqzO6zWZX8KfKEpnGY5jfggJQ3EjKuu8D4bJRr0y+cYJFmYbImXGw==",
+      "requires": {
+        "os-tmpdir": "1.0.2"
+      }
     },
     "tmpl": {
       "version": "1.0.4",
@@ -11107,11 +13239,17 @@
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/to-object-path/-/to-object-path-0.3.0.tgz",
       "integrity": "sha1-KXWIt7Dn4KwI4E5nL4XB9JmeF68=",
+      "requires": {
+        "kind-of": "3.2.2"
+      },
       "dependencies": {
         "kind-of": {
           "version": "3.2.2",
           "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ="
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+          "requires": {
+            "is-buffer": "1.1.6"
+          }
         }
       }
     },
@@ -11119,45 +13257,79 @@
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/to-regex/-/to-regex-3.0.1.tgz",
       "integrity": "sha1-FTWL7kosg712N3uh3ASdDxiDeq4=",
+      "requires": {
+        "define-property": "0.2.5",
+        "extend-shallow": "2.0.1",
+        "regex-not": "1.0.0"
+      },
       "dependencies": {
         "define-property": {
           "version": "0.2.5",
           "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
-          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY="
+          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY=",
+          "requires": {
+            "is-descriptor": "0.1.6"
+          }
         },
         "is-descriptor": {
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
-          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
+          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg==",
+          "requires": {
+            "is-accessor-descriptor": "0.1.6",
+            "is-data-descriptor": "0.1.4",
+            "kind-of": "5.1.0"
+          }
+        },
+        "kind-of": {
+          "version": "5.1.0",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
+          "integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw=="
         }
       }
     },
     "to-regex-range": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-2.1.1.tgz",
-      "integrity": "sha1-fIDBe53+vlmeJzZ+DU3VWQFB2zg="
+      "integrity": "sha1-fIDBe53+vlmeJzZ+DU3VWQFB2zg=",
+      "requires": {
+        "is-number": "3.0.0",
+        "repeat-string": "1.6.1"
+      }
     },
     "topo": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/topo/-/topo-2.0.2.tgz",
-      "integrity": "sha1-zVYVdSU5BXwNwEkaYhw7xvvh0YI="
+      "integrity": "sha1-zVYVdSU5BXwNwEkaYhw7xvvh0YI=",
+      "requires": {
+        "hoek": "4.2.0"
+      }
     },
     "touch": {
       "version": "0.0.3",
       "resolved": "https://registry.npmjs.org/touch/-/touch-0.0.3.tgz",
       "integrity": "sha1-Ua7z1ElXHU8oel2Hyci0kYGg2x0=",
+      "requires": {
+        "nopt": "1.0.10"
+      },
       "dependencies": {
         "nopt": {
           "version": "1.0.10",
           "resolved": "https://registry.npmjs.org/nopt/-/nopt-1.0.10.tgz",
-          "integrity": "sha1-bd0hvSoxQXuScn3Vhfim83YI6+4="
+          "integrity": "sha1-bd0hvSoxQXuScn3Vhfim83YI6+4=",
+          "requires": {
+            "abbrev": "1.1.1"
+          }
         }
       }
     },
     "tough-cookie": {
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.3.tgz",
-      "integrity": "sha1-C2GKVWW23qkL80JdBNVe3EdadWE="
+      "integrity": "sha1-C2GKVWW23qkL80JdBNVe3EdadWE=",
+      "requires": {
+        "punycode": "1.4.1"
+      }
     },
     "tr46": {
       "version": "0.0.3",
@@ -11180,41 +13352,56 @@
       "integrity": "sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM="
     },
     "ts-jest": {
-      "version": "21.1.3",
-      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-21.1.3.tgz",
-      "integrity": "sha512-hTRIvxOjykHeuaNC9XkdNk+dbrt1NYzV3C6/CN4Ty9mCtBWrDLNCUtny9gKoIJS0UtwteuSmEdoLgr2biL+bDw==",
+      "version": "21.2.1",
+      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-21.2.1.tgz",
+      "integrity": "sha512-9Q5oalORdt9HpaQ67yl1cHTRoABm+P9/IOibTXqBGyfUZo6MxnsiGy82HVBhENpPXCcFpBW8Az8OT1ScF/HiWQ==",
+      "requires": {
+        "babel-core": "6.26.0",
+        "babel-plugin-istanbul": "4.1.5",
+        "babel-plugin-transform-es2015-modules-commonjs": "6.26.0",
+        "babel-preset-jest": "21.2.0",
+        "fs-extra": "4.0.2",
+        "jest-config": "21.2.1",
+        "jest-util": "21.2.1",
+        "pkg-dir": "2.0.0",
+        "source-map-support": "0.5.0",
+        "yargs": "10.0.3"
+      },
       "dependencies": {
-        "camelcase": {
-          "version": "4.1.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
-          "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
-        },
-        "cliui": {
-          "version": "3.2.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
-          "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0=",
-          "dependencies": {
-            "string-width": {
-              "version": "1.0.2",
-              "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
-              "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
-            }
-          }
-        },
-        "is-fullwidth-code-point": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
-          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
-        },
         "source-map-support": {
           "version": "0.5.0",
           "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.0.tgz",
-          "integrity": "sha512-vUoN3I7fHQe0R/SJLKRdKYuEdRGogsviXFkHHo17AWaTGv17VLnxw+CFXvqy+y4ORZ3doWLQcxRYfwKrsd/H7Q=="
+          "integrity": "sha512-vUoN3I7fHQe0R/SJLKRdKYuEdRGogsviXFkHHo17AWaTGv17VLnxw+CFXvqy+y4ORZ3doWLQcxRYfwKrsd/H7Q==",
+          "requires": {
+            "source-map": "0.6.1"
+          }
         },
         "yargs": {
-          "version": "9.0.1",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-9.0.1.tgz",
-          "integrity": "sha1-UqzCP+7Kw0BCB47njAwAf1CF20w="
+          "version": "10.0.3",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-10.0.3.tgz",
+          "integrity": "sha512-DqBpQ8NAUX4GyPP/ijDGHsJya4tYqLQrjPr95HNsr1YwL3+daCfvBwg7+gIC6IdJhR2kATh3hb61vjzMWEtjdw==",
+          "requires": {
+            "cliui": "3.2.0",
+            "decamelize": "1.2.0",
+            "find-up": "2.1.0",
+            "get-caller-file": "1.0.2",
+            "os-locale": "2.1.0",
+            "require-directory": "2.1.1",
+            "require-main-filename": "1.0.1",
+            "set-blocking": "2.0.0",
+            "string-width": "2.1.1",
+            "which-module": "2.0.0",
+            "y18n": "3.2.1",
+            "yargs-parser": "8.0.0"
+          }
+        },
+        "yargs-parser": {
+          "version": "8.0.0",
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-8.0.0.tgz",
+          "integrity": "sha1-IdR2Mw5agieaS4gTRb8GYQLiGcY=",
+          "requires": {
+            "camelcase": "4.1.0"
+          }
         }
       }
     },
@@ -11224,14 +13411,30 @@
       "integrity": "sha512-ymKWWZJST0/CkgduC2qkzjMOWr4bouhuURNXCn/inEX0L57BnRG6FhX76o7FOnsjHazCjfU2LKeSrlS2sIKQJg=="
     },
     "tslint": {
-      "version": "5.7.0",
-      "resolved": "https://registry.npmjs.org/tslint/-/tslint-5.7.0.tgz",
-      "integrity": "sha1-wl4NDJL6EgHCvDDoROCOaCtPNVI="
+      "version": "5.8.0",
+      "resolved": "https://registry.npmjs.org/tslint/-/tslint-5.8.0.tgz",
+      "integrity": "sha1-H0mtWy53x2w69N3K5VKuTjYS6xM=",
+      "requires": {
+        "babel-code-frame": "6.26.0",
+        "builtin-modules": "1.1.1",
+        "chalk": "2.3.0",
+        "commander": "2.11.0",
+        "diff": "3.4.0",
+        "glob": "7.1.2",
+        "minimatch": "3.0.4",
+        "resolve": "1.5.0",
+        "semver": "5.4.1",
+        "tslib": "1.8.0",
+        "tsutils": "2.12.2"
+      }
     },
     "tslint-microsoft-contrib": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/tslint-microsoft-contrib/-/tslint-microsoft-contrib-5.0.1.tgz",
       "integrity": "sha1-Mo7pwo0HzfeTKTIEyW4v+rkiGZQ=",
+      "requires": {
+        "tsutils": "1.9.1"
+      },
       "dependencies": {
         "tsutils": {
           "version": "1.9.1",
@@ -11243,12 +13446,18 @@
     "tslint-react": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/tslint-react/-/tslint-react-3.2.0.tgz",
-      "integrity": "sha1-hR+1BSAcY9A0PFFybmNk9+mtLpk="
+      "integrity": "sha1-hR+1BSAcY9A0PFFybmNk9+mtLpk=",
+      "requires": {
+        "tsutils": "2.12.2"
+      }
     },
     "tsutils": {
-      "version": "2.12.1",
-      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.12.1.tgz",
-      "integrity": "sha1-9Nlc4zkciXHkblTEzw7bCiHdWyQ="
+      "version": "2.12.2",
+      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.12.2.tgz",
+      "integrity": "sha1-rVikhl0X7D3bZjG2ylO+FKVlb/M=",
+      "requires": {
+        "tslib": "1.8.0"
+      }
     },
     "tty-browserify": {
       "version": "0.0.0",
@@ -11258,18 +13467,18 @@
     "tunnel-agent": {
       "version": "0.6.0",
       "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.6.0.tgz",
-      "integrity": "sha1-J6XeoGs2sEoKmWZ3SykIaPD8QP0="
-    },
-    "tweetnacl": {
-      "version": "0.14.5",
-      "resolved": "https://registry.npmjs.org/tweetnacl/-/tweetnacl-0.14.5.tgz",
-      "integrity": "sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q=",
-      "optional": true
+      "integrity": "sha1-J6XeoGs2sEoKmWZ3SykIaPD8QP0=",
+      "requires": {
+        "safe-buffer": "5.1.1"
+      }
     },
     "type-check": {
       "version": "0.3.2",
       "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.3.2.tgz",
-      "integrity": "sha1-WITKtRLPHTVeP7eE8wgEsrUg23I="
+      "integrity": "sha1-WITKtRLPHTVeP7eE8wgEsrUg23I=",
+      "requires": {
+        "prelude-ls": "1.1.2"
+      }
     },
     "type-detect": {
       "version": "4.0.3",
@@ -11279,7 +13488,11 @@
     "type-is": {
       "version": "1.6.15",
       "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.15.tgz",
-      "integrity": "sha1-yrEPtJCeRByChC6v4a1kbIGARBA="
+      "integrity": "sha1-yrEPtJCeRByChC6v4a1kbIGARBA=",
+      "requires": {
+        "media-typer": "0.3.0",
+        "mime-types": "2.1.17"
+      }
     },
     "typescript": {
       "version": "2.5.3",
@@ -11300,29 +13513,58 @@
       "version": "2.8.29",
       "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.8.29.tgz",
       "integrity": "sha1-KcVzMUgFe7Th913zW3qcty5qWd0=",
+      "requires": {
+        "source-map": "0.5.7",
+        "yargs": "3.10.0"
+      },
       "dependencies": {
+        "camelcase": {
+          "version": "1.2.1",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
+          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
+        },
+        "cliui": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
+          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE=",
+          "requires": {
+            "center-align": "0.1.3",
+            "right-align": "0.1.3",
+            "wordwrap": "0.0.2"
+          }
+        },
         "source-map": {
           "version": "0.5.7",
           "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
           "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
+        "wordwrap": {
+          "version": "0.0.2",
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
+          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
+        },
         "yargs": {
           "version": "3.10.0",
           "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
-          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E="
+          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E=",
+          "requires": {
+            "camelcase": "1.2.1",
+            "cliui": "2.1.0",
+            "decamelize": "1.2.0",
+            "window-size": "0.1.0"
+          }
         }
       }
     },
-    "uglify-to-browserify": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/uglify-to-browserify/-/uglify-to-browserify-1.0.2.tgz",
-      "integrity": "sha1-bgkk1r2mta/jSeOabWMoUKD4grc=",
-      "optional": true
-    },
     "uglifyjs-webpack-plugin": {
       "version": "0.4.6",
       "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-0.4.6.tgz",
       "integrity": "sha1-uVH0q7a9YX5m9j64kUmOORdj4wk=",
+      "requires": {
+        "source-map": "0.5.7",
+        "uglify-js": "2.8.29",
+        "webpack-sources": "1.0.2"
+      },
       "dependencies": {
         "source-map": {
           "version": "0.5.7",
@@ -11350,11 +13592,23 @@
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/union-value/-/union-value-1.0.0.tgz",
       "integrity": "sha1-XHHDTLW61dzr4+oM0IIHulqhrqQ=",
+      "requires": {
+        "arr-union": "3.1.0",
+        "get-value": "2.0.6",
+        "is-extendable": "0.1.1",
+        "set-value": "0.4.3"
+      },
       "dependencies": {
         "set-value": {
           "version": "0.4.3",
           "resolved": "https://registry.npmjs.org/set-value/-/set-value-0.4.3.tgz",
-          "integrity": "sha1-fbCPnT0i3H945Trzw79GZuzfzPE="
+          "integrity": "sha1-fbCPnT0i3H945Trzw79GZuzfzPE=",
+          "requires": {
+            "extend-shallow": "2.0.1",
+            "is-extendable": "0.1.1",
+            "is-plain-object": "2.0.4",
+            "to-object-path": "0.3.0"
+          }
         }
       }
     },
@@ -11366,7 +13620,10 @@
     "uniqid": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/uniqid/-/uniqid-4.1.1.tgz",
-      "integrity": "sha1-iSIN32t1GuUrX3JISGNShZa7hME="
+      "integrity": "sha1-iSIN32t1GuUrX3JISGNShZa7hME=",
+      "requires": {
+        "macaddress": "0.2.8"
+      }
     },
     "uniqs": {
       "version": "2.0.0",
@@ -11376,7 +13633,10 @@
     "unique-string": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/unique-string/-/unique-string-1.0.0.tgz",
-      "integrity": "sha1-nhBXzKhRq7kzmPizOuGHuZyuwRo="
+      "integrity": "sha1-nhBXzKhRq7kzmPizOuGHuZyuwRo=",
+      "requires": {
+        "crypto-random-string": "1.0.0"
+      }
     },
     "universalify": {
       "version": "0.1.1",
@@ -11392,16 +13652,28 @@
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/unset-value/-/unset-value-1.0.0.tgz",
       "integrity": "sha1-g3aHP30jNRef+x5vw6jtDfyKtVk=",
+      "requires": {
+        "has-value": "0.3.1",
+        "isobject": "3.0.1"
+      },
       "dependencies": {
         "has-value": {
           "version": "0.3.1",
           "resolved": "https://registry.npmjs.org/has-value/-/has-value-0.3.1.tgz",
           "integrity": "sha1-ex9YutpiyoJ+wKIHgCVlSEWZXh8=",
+          "requires": {
+            "get-value": "2.0.6",
+            "has-values": "0.1.4",
+            "isobject": "2.1.0"
+          },
           "dependencies": {
             "isobject": {
               "version": "2.1.0",
               "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz",
-              "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk="
+              "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk=",
+              "requires": {
+                "isarray": "1.0.0"
+              }
             }
           }
         },
@@ -11421,6 +13693,10 @@
       "version": "0.11.0",
       "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
       "integrity": "sha1-ODjpfPxgUh63PFJajlW/3Z4uKPE=",
+      "requires": {
+        "punycode": "1.3.2",
+        "querystring": "0.2.0"
+      },
       "dependencies": {
         "punycode": {
           "version": "1.3.2",
@@ -11430,21 +13706,23 @@
       }
     },
     "url-loader": {
-      "version": "0.5.9",
-      "resolved": "https://registry.npmjs.org/url-loader/-/url-loader-0.5.9.tgz",
-      "integrity": "sha512-B7QYFyvv+fOBqBVeefsxv6koWWtjmHaMFT6KZWti4KRw8YUD/hOU+3AECvXuzyVawIBx3z7zQRejXCDSO5kk1Q==",
-      "dependencies": {
-        "mime": {
-          "version": "1.3.6",
-          "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.6.tgz",
-          "integrity": "sha1-WR2E02U6awtKO5343lqoEI5y5eA="
-        }
+      "version": "0.6.2",
+      "resolved": "https://registry.npmjs.org/url-loader/-/url-loader-0.6.2.tgz",
+      "integrity": "sha512-h3qf9TNn53BpuXTTcpC+UehiRrl0Cv45Yr/xWayApjw6G8Bg2dGke7rIwDQ39piciWCWrC+WiqLjOh3SUp9n0Q==",
+      "requires": {
+        "loader-utils": "1.1.0",
+        "mime": "1.4.1",
+        "schema-utils": "0.3.0"
       }
     },
     "url-parse": {
-      "version": "1.1.9",
-      "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.1.9.tgz",
-      "integrity": "sha1-xn8dd11R8KGJEd17P/rSe7nlvRk=",
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.2.0.tgz",
+      "integrity": "sha512-DT1XbYAfmQP65M/mE6OALxmXzZ/z1+e5zk2TcSKe/KiYbNGZxgtttzC0mR/sjopbpOXcbniq7eIKmocJnUWlEw==",
+      "requires": {
+        "querystringify": "1.0.0",
+        "requires-port": "1.0.0"
+      },
       "dependencies": {
         "querystringify": {
           "version": "1.0.0",
@@ -11457,16 +13735,34 @@
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/use/-/use-2.0.2.tgz",
       "integrity": "sha1-riig1y+TvyJCKhii43mZMRLeyOg=",
+      "requires": {
+        "define-property": "0.2.5",
+        "isobject": "3.0.1",
+        "lazy-cache": "2.0.2"
+      },
       "dependencies": {
         "define-property": {
           "version": "0.2.5",
           "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
-          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY="
+          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY=",
+          "requires": {
+            "is-descriptor": "0.1.6"
+          }
         },
         "is-descriptor": {
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
-          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg=="
+          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg==",
+          "requires": {
+            "is-accessor-descriptor": "0.1.6",
+            "is-data-descriptor": "0.1.4",
+            "kind-of": "5.1.0"
+          }
+        },
+        "kind-of": {
+          "version": "5.1.0",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
+          "integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw=="
         }
       }
     },
@@ -11474,6 +13770,9 @@
       "version": "0.10.3",
       "resolved": "https://registry.npmjs.org/util/-/util-0.10.3.tgz",
       "integrity": "sha1-evsa/lCAUkZInj23/g7TeTNqwPk=",
+      "requires": {
+        "inherits": "2.0.1"
+      },
       "dependencies": {
         "inherits": {
           "version": "2.0.1",
@@ -11500,7 +13799,11 @@
     "validate-npm-package-license": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.1.tgz",
-      "integrity": "sha1-KAS6vnEq0zeUWaz74kdGqywwP7w="
+      "integrity": "sha1-KAS6vnEq0zeUWaz74kdGqywwP7w=",
+      "requires": {
+        "spdx-correct": "1.0.2",
+        "spdx-expression-parse": "1.0.4"
+      }
     },
     "vary": {
       "version": "1.1.2",
@@ -11516,6 +13819,12 @@
       "version": "1.3.3",
       "resolved": "https://registry.npmjs.org/velocity-react/-/velocity-react-1.3.3.tgz",
       "integrity": "sha1-1tRyds/Ivip1Yjh5sgFArFjBuCs=",
+      "requires": {
+        "lodash": "3.10.1",
+        "prop-types": "15.6.0",
+        "react-transition-group": "1.2.1",
+        "velocity-animate": "1.5.0"
+      },
       "dependencies": {
         "lodash": {
           "version": "3.10.1",
@@ -11532,27 +13841,45 @@
     "verror": {
       "version": "1.10.0",
       "resolved": "https://registry.npmjs.org/verror/-/verror-1.10.0.tgz",
-      "integrity": "sha1-OhBcoXBTr1XW4nDB+CiGguGNpAA="
+      "integrity": "sha1-OhBcoXBTr1XW4nDB+CiGguGNpAA=",
+      "requires": {
+        "assert-plus": "1.0.0",
+        "core-util-is": "1.0.2",
+        "extsprintf": "1.3.0"
+      }
     },
     "vm-browserify": {
       "version": "0.0.4",
       "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-0.0.4.tgz",
-      "integrity": "sha1-XX6kW7755Kb/ZflUOOCofDV9WnM="
+      "integrity": "sha1-XX6kW7755Kb/ZflUOOCofDV9WnM=",
+      "requires": {
+        "indexof": "0.0.1"
+      }
     },
     "walker": {
       "version": "1.0.7",
       "resolved": "https://registry.npmjs.org/walker/-/walker-1.0.7.tgz",
-      "integrity": "sha1-L3+bj9ENZ3JisYqITijRlhjgKPs="
+      "integrity": "sha1-L3+bj9ENZ3JisYqITijRlhjgKPs=",
+      "requires": {
+        "makeerror": "1.0.11"
+      }
     },
     "warning": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/warning/-/warning-3.0.0.tgz",
-      "integrity": "sha1-MuU3fLVy3kqwR1O9+IIcAe1gW3w="
+      "integrity": "sha1-MuU3fLVy3kqwR1O9+IIcAe1gW3w=",
+      "requires": {
+        "loose-envify": "1.3.1"
+      }
     },
     "watch": {
       "version": "0.18.0",
       "resolved": "https://registry.npmjs.org/watch/-/watch-0.18.0.tgz",
       "integrity": "sha1-KAlUdsbffJDJYxOJkMClQj60uYY=",
+      "requires": {
+        "exec-sh": "0.2.1",
+        "minimist": "1.2.0"
+      },
       "dependencies": {
         "minimist": {
           "version": "1.2.0",
@@ -11564,12 +13891,20 @@
     "watchpack": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.4.0.tgz",
-      "integrity": "sha1-ShRyvLuVK9Cpu0A2gB+VTfs5+qw="
+      "integrity": "sha1-ShRyvLuVK9Cpu0A2gB+VTfs5+qw=",
+      "requires": {
+        "async": "2.6.0",
+        "chokidar": "1.7.0",
+        "graceful-fs": "4.1.11"
+      }
     },
     "wbuf": {
       "version": "1.7.2",
       "resolved": "https://registry.npmjs.org/wbuf/-/wbuf-1.7.2.tgz",
-      "integrity": "sha1-1pe5nx9ZUS3ydRvkJ2nBWAtYAf4="
+      "integrity": "sha1-1pe5nx9ZUS3ydRvkJ2nBWAtYAf4=",
+      "requires": {
+        "minimalistic-assert": "1.0.0"
+      }
     },
     "webidl-conversions": {
       "version": "4.0.2",
@@ -11580,38 +13915,46 @@
       "version": "3.8.1",
       "resolved": "https://registry.npmjs.org/webpack/-/webpack-3.8.1.tgz",
       "integrity": "sha512-5ZXLWWsMqHKFr5y0N3Eo5IIisxeEeRAajNq4mELb/WELOR7srdbQk2N5XiyNy2A/AgvlR3AmeBCZJW8lHrolbw==",
+      "requires": {
+        "acorn": "5.2.1",
+        "acorn-dynamic-import": "2.0.2",
+        "ajv": "5.3.0",
+        "ajv-keywords": "2.1.1",
+        "async": "2.6.0",
+        "enhanced-resolve": "3.4.1",
+        "escope": "3.6.0",
+        "interpret": "1.0.4",
+        "json-loader": "0.5.7",
+        "json5": "0.5.1",
+        "loader-runner": "2.3.0",
+        "loader-utils": "1.1.0",
+        "memory-fs": "0.4.1",
+        "mkdirp": "0.5.1",
+        "node-libs-browser": "2.0.0",
+        "source-map": "0.5.7",
+        "supports-color": "4.5.0",
+        "tapable": "0.2.8",
+        "uglifyjs-webpack-plugin": "0.4.6",
+        "watchpack": "1.4.0",
+        "webpack-sources": "1.0.2",
+        "yargs": "8.0.2"
+      },
       "dependencies": {
         "acorn": {
-          "version": "5.1.2",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.1.2.tgz",
-          "integrity": "sha512-o96FZLJBPY1lvTuJylGA9Bk3t/GKPPJG8H0ydQQl01crzwJgspa4AEIq/pVTXigmK0PHVQhiAtn8WMBLL9D2WA=="
-        },
-        "camelcase": {
-          "version": "4.1.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
-          "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
-        },
-        "cliui": {
-          "version": "3.2.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
-          "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0=",
-          "dependencies": {
-            "string-width": {
-              "version": "1.0.2",
-              "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
-              "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
-            }
-          }
+          "version": "5.2.1",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.2.1.tgz",
+          "integrity": "sha512-jG0u7c4Ly+3QkkW18V+NRDN+4bWHdln30NL1ZL2AvFZZmQe/BfopYCtghCKKVBUSetZ4QKcyA0pY6/4Gw8Pv8w=="
         },
         "enhanced-resolve": {
           "version": "3.4.1",
           "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.4.1.tgz",
-          "integrity": "sha1-BCHjOf1xQZs9oT0Smzl5BAIwR24="
-        },
-        "is-fullwidth-code-point": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
-          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
+          "integrity": "sha1-BCHjOf1xQZs9oT0Smzl5BAIwR24=",
+          "requires": {
+            "graceful-fs": "4.1.11",
+            "memory-fs": "0.4.1",
+            "object-assign": "4.1.1",
+            "tapable": "0.2.8"
+          }
         },
         "source-map": {
           "version": "0.5.7",
@@ -11621,7 +13964,22 @@
         "yargs": {
           "version": "8.0.2",
           "resolved": "https://registry.npmjs.org/yargs/-/yargs-8.0.2.tgz",
-          "integrity": "sha1-YpmpBVsc78lp/355wdkY3Osiw2A="
+          "integrity": "sha1-YpmpBVsc78lp/355wdkY3Osiw2A=",
+          "requires": {
+            "camelcase": "4.1.0",
+            "cliui": "3.2.0",
+            "decamelize": "1.2.0",
+            "get-caller-file": "1.0.2",
+            "os-locale": "2.1.0",
+            "read-pkg-up": "2.0.0",
+            "require-directory": "2.1.1",
+            "require-main-filename": "1.0.1",
+            "set-blocking": "2.0.0",
+            "string-width": "2.1.1",
+            "which-module": "2.0.0",
+            "y18n": "3.2.1",
+            "yargs-parser": "7.0.0"
+          }
         }
       }
     },
@@ -11629,11 +13987,24 @@
       "version": "2.9.0",
       "resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.9.0.tgz",
       "integrity": "sha1-tYvDTMMLJ//brz0AvyerpvopxuM=",
+      "requires": {
+        "acorn": "5.2.1",
+        "chalk": "1.1.3",
+        "commander": "2.11.0",
+        "ejs": "2.5.7",
+        "express": "4.16.2",
+        "filesize": "3.5.11",
+        "gzip-size": "3.0.0",
+        "lodash": "4.17.4",
+        "mkdirp": "0.5.1",
+        "opener": "1.4.3",
+        "ws": "2.3.1"
+      },
       "dependencies": {
         "acorn": {
-          "version": "5.1.2",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.1.2.tgz",
-          "integrity": "sha512-o96FZLJBPY1lvTuJylGA9Bk3t/GKPPJG8H0ydQQl01crzwJgspa4AEIq/pVTXigmK0PHVQhiAtn8WMBLL9D2WA=="
+          "version": "5.2.1",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.2.1.tgz",
+          "integrity": "sha512-jG0u7c4Ly+3QkkW18V+NRDN+4bWHdln30NL1ZL2AvFZZmQe/BfopYCtghCKKVBUSetZ4QKcyA0pY6/4Gw8Pv8w=="
         },
         "ansi-styles": {
           "version": "2.2.1",
@@ -11643,7 +14014,14 @@
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          }
         },
         "supports-color": {
           "version": "2.0.0",
@@ -11655,34 +14033,96 @@
     "webpack-dev-middleware": {
       "version": "1.12.0",
       "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-1.12.0.tgz",
-      "integrity": "sha1-007++y7dp+HTtdvgcolRMhllFwk="
+      "integrity": "sha1-007++y7dp+HTtdvgcolRMhllFwk=",
+      "requires": {
+        "memory-fs": "0.4.1",
+        "mime": "1.4.1",
+        "path-is-absolute": "1.0.1",
+        "range-parser": "1.2.0",
+        "time-stamp": "2.0.0"
+      }
     },
     "webpack-dev-server": {
-      "version": "2.9.2",
-      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.9.2.tgz",
-      "integrity": "sha512-ppL53TttdTPfiZA4EphKRE4QgtXssjLdHBwNs/MOx/fWLHCrZ0JeyE+eFcHrAcv7qOJgvR5jFZ1quO7i1LNieA==",
+      "version": "2.9.4",
+      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.9.4.tgz",
+      "integrity": "sha512-thrqC0EQEoSjXeYgP6pUXcUCZ+LNrKsDPn+mItLnn5VyyNZOJKd06hUP5vqkYwL8nWWXsii0loSF9NHNccT6ow==",
+      "requires": {
+        "ansi-html": "0.0.7",
+        "array-includes": "3.0.3",
+        "bonjour": "3.5.0",
+        "chokidar": "1.7.0",
+        "compression": "1.7.1",
+        "connect-history-api-fallback": "1.4.0",
+        "debug": "3.1.0",
+        "del": "3.0.0",
+        "express": "4.16.2",
+        "html-entities": "1.2.1",
+        "http-proxy-middleware": "0.17.4",
+        "import-local": "0.1.1",
+        "internal-ip": "1.2.0",
+        "ip": "1.1.5",
+        "killable": "1.0.0",
+        "loglevel": "1.5.1",
+        "opn": "5.1.0",
+        "portfinder": "1.0.13",
+        "selfsigned": "1.10.1",
+        "serve-index": "1.9.1",
+        "sockjs": "0.3.18",
+        "sockjs-client": "1.1.4",
+        "spdy": "3.4.7",
+        "strip-ansi": "3.0.1",
+        "supports-color": "4.5.0",
+        "webpack-dev-middleware": "1.12.0",
+        "yargs": "6.6.0"
+      },
       "dependencies": {
+        "debug": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
+          "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
+          "requires": {
+            "ms": "2.0.0"
+          }
+        },
         "opn": {
           "version": "5.1.0",
           "resolved": "https://registry.npmjs.org/opn/-/opn-5.1.0.tgz",
-          "integrity": "sha512-iPNl7SyM8L30Rm1sjGdLLheyHVw5YXVfi3SKWJzBI7efxRwHojfRFjwE/OLM6qp9xJYMgab8WicTU1cPoY+Hpg=="
+          "integrity": "sha512-iPNl7SyM8L30Rm1sjGdLLheyHVw5YXVfi3SKWJzBI7efxRwHojfRFjwE/OLM6qp9xJYMgab8WicTU1cPoY+Hpg==",
+          "requires": {
+            "is-wsl": "1.1.0"
+          }
         }
       }
     },
     "webpack-hot-middleware": {
       "version": "2.20.0",
       "resolved": "https://registry.npmjs.org/webpack-hot-middleware/-/webpack-hot-middleware-2.20.0.tgz",
-      "integrity": "sha512-AYwVG9DCvMoXbwx8eK16CbJY3Ltwap44lW3T7hFsE0U3zRwtViHMw1DFpY5hMwXNqKsUk3HtNcf3PoV+gIxJeg=="
+      "integrity": "sha512-AYwVG9DCvMoXbwx8eK16CbJY3Ltwap44lW3T7hFsE0U3zRwtViHMw1DFpY5hMwXNqKsUk3HtNcf3PoV+gIxJeg==",
+      "requires": {
+        "ansi-html": "0.0.7",
+        "html-entities": "1.2.1",
+        "querystring": "0.2.0",
+        "strip-ansi": "3.0.1"
+      }
     },
     "webpack-notifier": {
       "version": "1.5.0",
       "resolved": "https://registry.npmjs.org/webpack-notifier/-/webpack-notifier-1.5.0.tgz",
       "integrity": "sha1-wBAAfUSM68NN78mezyiPpejGuvY=",
+      "requires": {
+        "node-notifier": "4.6.1",
+        "object-assign": "4.1.1",
+        "strip-ansi": "3.0.1"
+      },
       "dependencies": {
         "lodash.clonedeep": {
           "version": "3.0.2",
           "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-3.0.2.tgz",
-          "integrity": "sha1-oKHkDYKl6on/WxR7hETtY9koJ9s="
+          "integrity": "sha1-oKHkDYKl6on/WxR7hETtY9koJ9s=",
+          "requires": {
+            "lodash._baseclone": "3.3.0",
+            "lodash._bindcallback": "3.0.1"
+          }
         },
         "minimist": {
           "version": "1.2.0",
@@ -11692,26 +14132,36 @@
         "node-notifier": {
           "version": "4.6.1",
           "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-4.6.1.tgz",
-          "integrity": "sha1-BW0UJE89zBzq3+aK+c/wxUc6M/M="
+          "integrity": "sha1-BW0UJE89zBzq3+aK+c/wxUc6M/M=",
+          "requires": {
+            "cli-usage": "0.1.4",
+            "growly": "1.3.0",
+            "lodash.clonedeep": "3.0.2",
+            "minimist": "1.2.0",
+            "semver": "5.4.1",
+            "shellwords": "0.1.1",
+            "which": "1.3.0"
+          }
         }
       }
     },
     "webpack-sources": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-1.0.1.tgz",
-      "integrity": "sha512-05tMxipUCwHqYaVS8xc7sYPTly8PzXayRCB4dTxLhWTqlKUiwH6ezmEe0OSreL1c30LAuA3Zqmc+uEBUGFJDjw==",
-      "dependencies": {
-        "source-map": {
-          "version": "0.5.7",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
-          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
-        }
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-1.0.2.tgz",
+      "integrity": "sha512-Y7UddMCv6dGjy81nBv6nuQeFFIt5aalHm7uyDsAsW86nZwfOVPGRr3XMjEQLaT+WKo8rlzhC9qtbJvYKLtAwaw==",
+      "requires": {
+        "source-list-map": "2.0.0",
+        "source-map": "0.6.1"
       }
     },
     "websocket-driver": {
       "version": "0.7.0",
       "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.7.0.tgz",
-      "integrity": "sha1-DK+dLXVdk67gSdS90NP+LMoqJOs="
+      "integrity": "sha1-DK+dLXVdk67gSdS90NP+LMoqJOs=",
+      "requires": {
+        "http-parser-js": "0.4.9",
+        "websocket-extensions": "0.1.2"
+      }
     },
     "websocket-extensions": {
       "version": "0.1.2",
@@ -11719,15 +14169,11 @@
       "integrity": "sha1-Dhh4HeYpoYMIzhSBZQ9n/6JpOl0="
     },
     "whatwg-encoding": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-1.0.1.tgz",
-      "integrity": "sha1-PGxFGhmO567FWx7GHQkgxngBpfQ=",
-      "dependencies": {
-        "iconv-lite": {
-          "version": "0.4.13",
-          "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.13.tgz",
-          "integrity": "sha1-H4irpKsLFQjoMSrMOTRfNumS4vI="
-        }
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-1.0.3.tgz",
+      "integrity": "sha512-jLBwwKUhi8WtBfsMQlL4bUUcT8sMkAtQinscJAe/M4KHCkHuUJAF6vuB0tueNIw4c8ziO6AkRmgY+jL3a0iiPw==",
+      "requires": {
+        "iconv-lite": "0.4.19"
       }
     },
     "whatwg-fetch": {
@@ -11739,6 +14185,10 @@
       "version": "4.8.0",
       "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-4.8.0.tgz",
       "integrity": "sha1-0pgaqRSMHgCkHFphMRZqtGg7vMA=",
+      "requires": {
+        "tr46": "0.0.3",
+        "webidl-conversions": "3.0.1"
+      },
       "dependencies": {
         "webidl-conversions": {
           "version": "3.0.1",
@@ -11755,7 +14205,10 @@
     "which": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/which/-/which-1.3.0.tgz",
-      "integrity": "sha512-xcJpopdamTuY5duC/KnTTNBraPK54YwpenP4lzxU8H91GudWpFv38u0CKjclE1Wi2EH2EDz5LRcHcKbCIzqGyg=="
+      "integrity": "sha512-xcJpopdamTuY5duC/KnTTNBraPK54YwpenP4lzxU8H91GudWpFv38u0CKjclE1Wi2EH2EDz5LRcHcKbCIzqGyg==",
+      "requires": {
+        "isexe": "2.0.0"
+      }
     },
     "which-module": {
       "version": "2.0.0",
@@ -11766,16 +14219,27 @@
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/wide-align/-/wide-align-1.1.2.tgz",
       "integrity": "sha512-ijDLlyQ7s6x1JgCLur53osjm/UXUYD9+0PbYKrBsYisYXzCxN+HC3mYDNy/dWdmf3AwqwU3CXwDCvsNgGK1S0w==",
+      "requires": {
+        "string-width": "1.0.2"
+      },
       "dependencies": {
         "is-fullwidth-code-point": {
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
-          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
+          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
+          "requires": {
+            "number-is-nan": "1.0.1"
+          }
         },
         "string-width": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
-          "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
+          "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
+          "requires": {
+            "code-point-at": "1.1.0",
+            "is-fullwidth-code-point": "1.0.0",
+            "strip-ansi": "3.0.1"
+          }
         }
       }
     },
@@ -11790,24 +14254,40 @@
       "integrity": "sha1-o9XabNXAvAAI03I0u68b7WMFkQc="
     },
     "worker-farm": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/worker-farm/-/worker-farm-1.5.0.tgz",
-      "integrity": "sha512-DHRiUggxtbruaTwnLDm2/BRDKZIoOYvrgYUj5Bam4fU6Gtvc0FaEyoswFPBjMXAweGW2H4BDNIpy//1yXXuaqQ=="
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/worker-farm/-/worker-farm-1.5.1.tgz",
+      "integrity": "sha512-T5NH6Wqsd8MwGD4AK8BBllUy6LmHaqjEOyo/YIUEegZui6/v5Bqde//3jwyE3PGiGYMmWi06exFBi5LNhhPFNw==",
+      "requires": {
+        "errno": "0.1.4",
+        "xtend": "4.0.1"
+      }
     },
     "wrap-ansi": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
       "integrity": "sha1-2Pw9KE3QV5T+hJc8rs3Rz4JP3YU=",
+      "requires": {
+        "string-width": "1.0.2",
+        "strip-ansi": "3.0.1"
+      },
       "dependencies": {
         "is-fullwidth-code-point": {
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
-          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
+          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
+          "requires": {
+            "number-is-nan": "1.0.1"
+          }
         },
         "string-width": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
-          "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
+          "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
+          "requires": {
+            "code-point-at": "1.1.0",
+            "is-fullwidth-code-point": "1.0.0",
+            "strip-ansi": "3.0.1"
+          }
         }
       }
     },
@@ -11819,12 +14299,25 @@
     "write-file-atomic": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-2.3.0.tgz",
-      "integrity": "sha512-xuPeK4OdjWqtfi59ylvVL0Yn35SF3zgcAcv7rBPFHVaEapaDr4GdGgm3j7ckTwH9wHL7fGmgfAnb0+THrHb8tA=="
+      "integrity": "sha512-xuPeK4OdjWqtfi59ylvVL0Yn35SF3zgcAcv7rBPFHVaEapaDr4GdGgm3j7ckTwH9wHL7fGmgfAnb0+THrHb8tA==",
+      "requires": {
+        "graceful-fs": "4.1.11",
+        "imurmurhash": "0.1.4",
+        "signal-exit": "3.0.2"
+      }
     },
     "write-file-webpack-plugin": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/write-file-webpack-plugin/-/write-file-webpack-plugin-4.2.0.tgz",
       "integrity": "sha512-sIjfV+M1Ia8p/lVcLjvM2I0Lq/40tCMZe+k0Pxg2TG6TKjUgHGwQeM42QdYLiHAIAITGQK1HEQA3YknFubzfDQ==",
+      "requires": {
+        "chalk": "1.1.3",
+        "debug": "2.6.9",
+        "filesize": "3.5.11",
+        "lodash": "4.17.4",
+        "mkdirp": "0.5.1",
+        "moment": "2.19.1"
+      },
       "dependencies": {
         "ansi-styles": {
           "version": "2.2.1",
@@ -11834,7 +14327,14 @@
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg="
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          }
         },
         "supports-color": {
           "version": "2.0.0",
@@ -11847,6 +14347,10 @@
       "version": "2.3.1",
       "resolved": "https://registry.npmjs.org/ws/-/ws-2.3.1.tgz",
       "integrity": "sha1-a5Sz5EfLajY/eF6vlK9jWejoHIA=",
+      "requires": {
+        "safe-buffer": "5.0.1",
+        "ultron": "1.1.0"
+      },
       "dependencies": {
         "safe-buffer": {
           "version": "5.0.1",
@@ -11884,46 +14388,81 @@
       "version": "6.6.0",
       "resolved": "https://registry.npmjs.org/yargs/-/yargs-6.6.0.tgz",
       "integrity": "sha1-eC7CHvQDNF+DCoCMo9UTr1YGUgg=",
+      "requires": {
+        "camelcase": "3.0.0",
+        "cliui": "3.2.0",
+        "decamelize": "1.2.0",
+        "get-caller-file": "1.0.2",
+        "os-locale": "1.4.0",
+        "read-pkg-up": "1.0.1",
+        "require-directory": "2.1.1",
+        "require-main-filename": "1.0.1",
+        "set-blocking": "2.0.0",
+        "string-width": "1.0.2",
+        "which-module": "1.0.0",
+        "y18n": "3.2.1",
+        "yargs-parser": "4.2.1"
+      },
       "dependencies": {
         "camelcase": {
           "version": "3.0.0",
           "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-3.0.0.tgz",
           "integrity": "sha1-MvxLn82vhF/N9+c7uXysImHwqwo="
         },
-        "cliui": {
-          "version": "3.2.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
-          "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0="
-        },
         "find-up": {
           "version": "1.1.2",
           "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
-          "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8="
+          "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8=",
+          "requires": {
+            "path-exists": "2.1.0",
+            "pinkie-promise": "2.0.1"
+          }
         },
         "is-fullwidth-code-point": {
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
-          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs="
+          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
+          "requires": {
+            "number-is-nan": "1.0.1"
+          }
         },
         "load-json-file": {
           "version": "1.1.0",
           "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
-          "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA="
+          "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
+          "requires": {
+            "graceful-fs": "4.1.11",
+            "parse-json": "2.2.0",
+            "pify": "2.3.0",
+            "pinkie-promise": "2.0.1",
+            "strip-bom": "2.0.0"
+          }
         },
         "os-locale": {
           "version": "1.4.0",
           "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
-          "integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk="
+          "integrity": "sha1-IPnxeuKe00XoveWDsT0gCYA8FNk=",
+          "requires": {
+            "lcid": "1.0.0"
+          }
         },
         "path-exists": {
           "version": "2.1.0",
           "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
-          "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s="
+          "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s=",
+          "requires": {
+            "pinkie-promise": "2.0.1"
+          }
         },
         "path-type": {
           "version": "1.1.0",
           "resolved": "https://registry.npmjs.org/path-type/-/path-type-1.1.0.tgz",
-          "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE="
+          "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE=",
+          "requires": {
+            "graceful-fs": "4.1.11",
+            "pify": "2.3.0",
+            "pinkie-promise": "2.0.1"
+          }
         },
         "pify": {
           "version": "2.3.0",
@@ -11933,22 +14472,39 @@
         "read-pkg": {
           "version": "1.1.0",
           "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
-          "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg="
+          "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg=",
+          "requires": {
+            "load-json-file": "1.1.0",
+            "normalize-package-data": "2.4.0",
+            "path-type": "1.1.0"
+          }
         },
         "read-pkg-up": {
           "version": "1.0.1",
           "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-1.0.1.tgz",
-          "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI="
+          "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI=",
+          "requires": {
+            "find-up": "1.1.2",
+            "read-pkg": "1.1.0"
+          }
         },
         "string-width": {
           "version": "1.0.2",
           "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
-          "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M="
+          "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
+          "requires": {
+            "code-point-at": "1.1.0",
+            "is-fullwidth-code-point": "1.0.0",
+            "strip-ansi": "3.0.1"
+          }
         },
         "strip-bom": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
-          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4="
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4=",
+          "requires": {
+            "is-utf8": "0.2.1"
+          }
         },
         "which-module": {
           "version": "1.0.0",
@@ -11958,7 +14514,10 @@
         "yargs-parser": {
           "version": "4.2.1",
           "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-4.2.1.tgz",
-          "integrity": "sha1-KczqwNxPA8bIe0qfIX3RjJ90hxw="
+          "integrity": "sha1-KczqwNxPA8bIe0qfIX3RjJ90hxw=",
+          "requires": {
+            "camelcase": "3.0.0"
+          }
         }
       }
     },
@@ -11966,12 +14525,8 @@
       "version": "7.0.0",
       "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-7.0.0.tgz",
       "integrity": "sha1-jQrELxbqVd69MyyvTEA4s+P139k=",
-      "dependencies": {
-        "camelcase": {
-          "version": "4.1.0",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
-          "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
-        }
+      "requires": {
+        "camelcase": "4.1.0"
       }
     }
   }
diff --git a/package.json b/package.json
index fe303a238af5d..736756597a21d 100644
--- a/package.json
+++ b/package.json
@@ -26,9 +26,6 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@microsoft/rush": "3.0.12"
-  },
-  "dependencies": {
-    "gulp": "^3.9.1"
+    "@microsoft/rush": "4.0.0"
   }
-}
+}
\ No newline at end of file
diff --git a/packages/example-app-base/src/components/App/App.tsx b/packages/example-app-base/src/components/App/App.tsx
index 6a66ad4d66215..2f11e46d48f18 100644
--- a/packages/example-app-base/src/components/App/App.tsx
+++ b/packages/example-app-base/src/components/App/App.tsx
@@ -119,7 +119,8 @@ export class App extends React.Component<IAppProps, IAppState> {
   }
 
   @autobind
-  private _onRenderLink(link: INavLink): (JSX.Element | null)[] {
+  // tslint:disable-next-line:no-any
+  private _onRenderLink(link: INavLink): any {
     return (
       [
         <span key={ 1 } className='Nav-linkText'>{ link.name }</span>,
diff --git a/rush.json b/rush.json
index 8fb498263a546..1de5da717f9c2 100644
--- a/rush.json
+++ b/rush.json
@@ -1,9 +1,7 @@
 {
-  "npmVersion": "5.0.3",
-  "rushMinimumVersion": "3.0.12",
+  "npmVersion": "5.5.1",
+  "rushVersion": "4.0.0",
   "nodeSupportedVersionRange": ">=6.9.0 <9.0.0",
-  "projectFolderMinDepth": 1,
-  "projectFolderMaxDepth": 999,
   "projects": [
     {
       "packageName": "@uifabric/build",

From b5d1986541caeab259a71dac7e39ed7fb7af8281 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 8 Nov 2017 13:58:08 -0800
Subject: [PATCH 1000/1641] Updating remote settings.

---
 rush.json | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/rush.json b/rush.json
index 1de5da717f9c2..d8f3677eb2807 100644
--- a/rush.json
+++ b/rush.json
@@ -1,6 +1,9 @@
 {
   "npmVersion": "5.5.1",
   "rushVersion": "4.0.0",
+  "repository": {
+    "url": "https://github.com/OfficeDev/office-ui-fabric-react.git"
+  },
   "nodeSupportedVersionRange": ">=6.9.0 <9.0.0",
   "projects": [
     {

From c554bb2e9449b8bab09c484807777bfb5f7eb2fd Mon Sep 17 00:00:00 2001
From: Alex Bettadapur <alexbettadapur@gmail.com>
Date: Wed, 8 Nov 2017 15:49:43 -0800
Subject: [PATCH 1001/1641] Add ComboBox public functions to
 VirtualizedComboBox (#3328)

* Add public functions

* Change file
---
 ...ualizedComboBoxFocus_2017-11-08-21-51.json | 11 ++++++++
 .../ComboBox/VirtualizedComboBox.tsx          | 25 ++++++++++++++++---
 2 files changed, 32 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/virtualizedComboBoxFocus_2017-11-08-21-51.json

diff --git a/common/changes/office-ui-fabric-react/virtualizedComboBoxFocus_2017-11-08-21-51.json b/common/changes/office-ui-fabric-react/virtualizedComboBoxFocus_2017-11-08-21-51.json
new file mode 100644
index 0000000000000..637abbb64d5ba
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/virtualizedComboBoxFocus_2017-11-08-21-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Have VirtualizedCombobox implement IComboBox interface",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "alexbettadapur@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx
index d0693229ba702..99c1d23303492 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx
@@ -1,19 +1,36 @@
 import * as React from 'react';
 import { autobind, BaseComponent, customizable } from '../../Utilities';
 import { ComboBox } from './ComboBox';
-import { IComboBoxProps } from './ComboBox.Props';
+import { IComboBoxProps, IComboBox } from './ComboBox.Props';
 import { List } from '../../List';
 import { SelectableOptionMenuItemType, ISelectableOption } from '../../utilities/selectableOption/SelectableOption.Props';
 
-export class VirtualizedComboBox extends BaseComponent<IComboBoxProps, {}> {
-
-  // The virtualized list element
+export class VirtualizedComboBox extends BaseComponent<IComboBoxProps, {}> implements IComboBox {
+  /** The combo box element */
+  private _comboBox: ComboBox;
+  /** The virtualized list element */
   private _list: List;
 
+  public dismissMenu(): void {
+    if (this._comboBox) {
+      return this._comboBox.dismissMenu();
+    }
+  }
+
+  public focus() {
+    if (this._comboBox) {
+      this._comboBox.focus();
+      return true;
+    }
+
+    return false;
+  }
+
   public render(): JSX.Element {
     return (
       <ComboBox
         {...this.props}
+        componentRef={ this._resolveRef('_comboBox') }
         onRenderList={ this._onRenderList }
         onScrollToItem={ this._onScrollToItem }
       />

From a54a302ccca174804aa60d1d39e6dd48f7767020 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Thu, 9 Nov 2017 11:24:45 -0800
Subject: [PATCH 1002/1641] TextField: Set max-width for examples (#3324)

* Removed NumberTextField scss, no longer needed

* Updated TextField example scss

* Added change file

* Variable name change

* Variable name change round 2

* Changed ms- to docs- and added comment for wider width

* Update textfield-width_2017-11-06-22-05.json
---
 .../textfield-width_2017-11-06-22-05.json     | 11 ++++++++++
 .../src/common/_variables.scss                |  3 ++-
 .../TextField/examples/NumberTextField.scss   | 20 ------------------
 .../TextField/examples/NumberTextField.tsx    |  1 -
 .../examples/TextField.Addon.Example.tsx      |  2 +-
 .../TextField.AllErrorMessage.Example.tsx     |  2 +-
 .../examples/TextField.Basic.Example.tsx      |  2 +-
 .../examples/TextField.Borderless.Example.tsx |  2 +-
 .../TextField.CustomRender.Example.tsx        |  3 ++-
 .../TextField.ErrorMessage.Example.tsx        |  2 +-
 .../examples/TextField.Examples.scss          | 21 +++++++++++++++++--
 .../examples/TextField.Icon.Example.tsx       |  2 +-
 .../examples/TextField.Multiline.Example.tsx  |  2 +-
 .../TextField.Placeholder.Example.tsx         |  2 +-
 .../examples/TextField.Underlined.Example.tsx |  2 +-
 15 files changed, 43 insertions(+), 34 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/textfield-width_2017-11-06-22-05.json
 delete mode 100644 packages/office-ui-fabric-react/src/components/TextField/examples/NumberTextField.scss

diff --git a/common/changes/office-ui-fabric-react/textfield-width_2017-11-06-22-05.json b/common/changes/office-ui-fabric-react/textfield-width_2017-11-06-22-05.json
new file mode 100644
index 0000000000000..cf3806c1558e1
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/textfield-width_2017-11-06-22-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "TextField: Updated field width for all examples to be more legible. Replaced ms- with docs- prefix for example scss.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/common/_variables.scss b/packages/office-ui-fabric-react/src/common/_variables.scss
index 01c323c17e05c..0ddb76368bab8 100644
--- a/packages/office-ui-fabric-react/src/common/_variables.scss
+++ b/packages/office-ui-fabric-react/src/common/_variables.scss
@@ -1,2 +1,3 @@
 $exampleLabel-margin: 10px 0;
-$exampleCheckbox-margin: 10px 0;
\ No newline at end of file
+$exampleCheckbox-margin: 10px 0;
+$maxFieldWidth: 300px;
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/NumberTextField.scss b/packages/office-ui-fabric-react/src/components/TextField/examples/NumberTextField.scss
deleted file mode 100644
index a2e0c40e36cd7..0000000000000
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/NumberTextField.scss
+++ /dev/null
@@ -1,20 +0,0 @@
-:global {
-
-  .NumberTextField {
-    display: table;
-
-    > * {
-      display: table-cell;
-    }
-
-    > .NumberTextField-textField {
-      width: 100%;
-    }
-
-    > .NumberTextField-restoreButton {
-      vertical-align: top;
-      padding-top: 29px;
-    }
-  }
-
-}
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/NumberTextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/NumberTextField.tsx
index 83de40a3c28fb..899829d9ce115 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/NumberTextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/NumberTextField.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
-import './NumberTextField.scss';
 
 export interface INumberTextFieldProps {
   label: string;
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Addon.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Addon.Example.tsx
index b4699417d3961..3f7bc4cfc0b96 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Addon.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Addon.Example.tsx
@@ -5,7 +5,7 @@ import './TextField.Examples.scss';
 export class TextFieldAddonExample extends React.Component<any, any> {
   public render() {
     return (
-      <div className='ms-TextFieldExample'>
+      <div className='docs-TextFieldExample'>
         <TextField
           addonString='https://'
         />
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.AllErrorMessage.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.AllErrorMessage.Example.tsx
index 56bc6e9ee788f..f64d386df7aae 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.AllErrorMessage.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.AllErrorMessage.Example.tsx
@@ -5,7 +5,7 @@ import './TextField.Examples.scss';
 export class TextFieldAllErrorMessageExample extends React.Component<any, any> {
   public render() {
     return (
-      <div className='ms-TextFieldExample'>
+      <div className='docs-TextFieldExample'>
         <TextField
           errorMessage='Error message'
           label='Default with error message'
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
index 73601d581a373..0413006a10d4f 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
@@ -5,7 +5,7 @@ import './TextField.Examples.scss';
 export class TextFieldBasicExample extends React.Component<any, any> {
   public render() {
     return (
-      <div className='ms-TextFieldExample'>
+      <div className='docs-TextFieldExample'>
         <TextField
           label='Standard'
         />
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Borderless.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Borderless.Example.tsx
index 4fbf848632fc6..a75f9aa6d4484 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Borderless.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Borderless.Example.tsx
@@ -5,7 +5,7 @@ import './TextField.Examples.scss';
 export class TextFieldBorderlessExample extends React.Component<any, any> {
   public render() {
     return (
-      <div className='ms-TextFieldExample'>
+      <div className='docs-TextFieldExample'>
         <TextField
           label='Borderless Multiline TextField'
           multiline
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx
index a5a749e7d3a8d..20fc5097e6ac7 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx
@@ -3,6 +3,7 @@ import { TextField, ITextFieldProps } from 'office-ui-fabric-react/lib/TextField
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { IconButton } from 'office-ui-fabric-react/lib/Button';
 import { Callout } from 'office-ui-fabric-react/lib/Callout';
+import './TextField.Examples.scss';
 
 export class TextFieldCustomRenderExample extends React.Component<any, any> {
 
@@ -18,7 +19,7 @@ export class TextFieldCustomRenderExample extends React.Component<any, any> {
 
   public render() {
     return (
-      <div>
+      <div className='docs-TextFieldExample'>
         <TextField onRenderLabel={ this._onRenderLabel } />
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx
index f785f51ed82a6..a9b365f259e13 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx
@@ -14,7 +14,7 @@ export class TextFieldErrorMessageExample extends React.Component<{}, {}> {
 
   public render() {
     return (
-      <div className='ms-TextFieldExample'>
+      <div className='docs-TextFieldErrorExample'>
         <TextField
           label='TextField with a string-based validator. Hint: the length of the input string must be less than 3.'
           onGetErrorMessage={ this._getErrorMessage }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Examples.scss b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Examples.scss
index ad51a442ee46b..360a428fe016f 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Examples.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Examples.scss
@@ -1,5 +1,22 @@
+@import '../../../common/_variables';
+
 :global {
-  .ms-TextFieldExample .ms-TextField {
-    margin: 0 0 15px 0;
+  .docs-TextFieldExample {
+    .ms-TextField {
+      margin: 0 0 15px 0;
+      max-width: $maxFieldWidth;
+    }
+  }
+
+  .docs-TextFieldErrorExample {
+    .ms-TextField,
+    .NumberTextField {
+      margin: 0 0 15px 0;
+      max-width: $maxFieldWidth*2; // wider width due to long labels / values / placeholders in the error message example
+    }
+
+    .NumberTextField .ms-TextField {
+      margin: 0 0 5px 0;
+    }
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Icon.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Icon.Example.tsx
index 8238298dbd3d5..ec8da214e51e3 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Icon.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Icon.Example.tsx
@@ -6,7 +6,7 @@ import './TextField.Examples.scss';
 export class TextFieldIconExample extends React.Component<any, any> {
   public render() {
     return (
-      <div className='ms-TextFieldExample'>
+      <div className='docs-TextFieldExample'>
         <TextField
           label='TextField with an icon'
           iconProps={ { iconName: 'Calendar' } }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Multiline.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Multiline.Example.tsx
index 6a64faac28361..b15fe8d8929ee 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Multiline.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Multiline.Example.tsx
@@ -5,7 +5,7 @@ import './TextField.Examples.scss';
 export class TextFieldMultilineExample extends React.Component<any, any> {
   public render() {
     return (
-      <div className='ms-TextFieldExample'>
+      <div className='docs-TextFieldExample'>
         <TextField
           label='Standard'
           multiline
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Placeholder.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Placeholder.Example.tsx
index 7f80c94e458d6..e9f43a8cf58a8 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Placeholder.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Placeholder.Example.tsx
@@ -5,7 +5,7 @@ import './TextField.Examples.scss';
 export class TextFieldPlaceholderExample extends React.Component<any, any> {
   public render() {
     return (
-      <div className='ms-TextFieldExample'>
+      <div className='docs-TextFieldExample'>
         <TextField
           placeholder='I am a placeholder.'
           ariaLabel='Please enter text here'
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Underlined.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Underlined.Example.tsx
index 9dfefbf04f29f..9c47a9996c00c 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Underlined.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Underlined.Example.tsx
@@ -5,7 +5,7 @@ import './TextField.Examples.scss';
 export class TextFieldUnderlinedExample extends React.Component<any, any> {
   public render() {
     return (
-      <div className='ms-TextFieldExample'>
+      <div className='docs-TextFieldExample'>
         <TextField
           label='Standard:'
           underlined

From 58525f379f99bf5c7e5c48ffe52a9e9ce8c46960 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Thu, 9 Nov 2017 11:56:28 -0800
Subject: [PATCH 1003/1641] Changed inline-block stories to be inside fixed
 width container (#3353)

---
 apps/vr-tests/src/stories/ComboBox.stories.tsx   |  4 ++--
 apps/vr-tests/src/stories/DatePicker.stories.tsx |  4 ++--
 apps/vr-tests/src/stories/SearchBox.stories.tsx  |  2 +-
 apps/vr-tests/src/stories/SpinButton.stories.tsx |  4 ++--
 apps/vr-tests/src/stories/TextField.stories.tsx  |  4 ++--
 apps/vr-tests/src/utilities/FabricDecorator.tsx  | 16 ++++++++++++++++
 6 files changed, 25 insertions(+), 9 deletions(-)

diff --git a/apps/vr-tests/src/stories/ComboBox.stories.tsx b/apps/vr-tests/src/stories/ComboBox.stories.tsx
index 87648594f0f98..d8ebf345ba8ca 100644
--- a/apps/vr-tests/src/stories/ComboBox.stories.tsx
+++ b/apps/vr-tests/src/stories/ComboBox.stories.tsx
@@ -2,7 +2,7 @@
 import * as React from 'react';
 import Screener, { Steps } from 'screener-storybook/src/screener';
 import { storiesOf } from '@storybook/react';
-import { FabricDecoratorTall } from '../utilities';
+import { FabricDecoratorTallFixedWdith } from '../utilities';
 import { ComboBox, SelectableOptionMenuItemType } from 'office-ui-fabric-react';
 
 let testOptions = [
@@ -45,7 +45,7 @@ let onRenderFontOption = (item) => {
 };
 
 storiesOf('ComboBox', module)
-  .addDecorator(FabricDecoratorTall)
+  .addDecorator(FabricDecoratorTallFixedWdith)
   .addDecorator(story => (
     <Screener
       steps={ new Screener.Steps()
diff --git a/apps/vr-tests/src/stories/DatePicker.stories.tsx b/apps/vr-tests/src/stories/DatePicker.stories.tsx
index c4702d1b82c16..836a3c7463e83 100644
--- a/apps/vr-tests/src/stories/DatePicker.stories.tsx
+++ b/apps/vr-tests/src/stories/DatePicker.stories.tsx
@@ -2,12 +2,12 @@
 import * as React from 'react';
 import Screener, { Steps } from 'screener-storybook/src/screener';
 import { storiesOf } from '@storybook/react';
-import { FabricDecorator } from '../utilities';
+import { FabricDecoratorFixedWidth } from '../utilities';
 import { DatePicker } from 'office-ui-fabric-react';
 
 const date = new Date(2010, 1, 12);
 storiesOf('DatePicker', module)
-  .addDecorator(FabricDecorator)
+  .addDecorator(FabricDecoratorFixedWidth)
   .addDecorator(story => (
     <Screener
       steps={ new Screener.Steps()
diff --git a/apps/vr-tests/src/stories/SearchBox.stories.tsx b/apps/vr-tests/src/stories/SearchBox.stories.tsx
index a480c75cd33da..242d606fab3f6 100644
--- a/apps/vr-tests/src/stories/SearchBox.stories.tsx
+++ b/apps/vr-tests/src/stories/SearchBox.stories.tsx
@@ -25,7 +25,7 @@ storiesOf('SearchBox', module)
     </Screener>
   )).add('Root', () => (
     <Fabric style={ { display: 'flex' } }>
-      <div className='testWrapper' style={ { padding: '10px', overflow: 'hidden' } }>
+      <div className='testWrapper' style={ { padding: '10px', overflow: 'hidden', width: '300px' } }>
         <SearchBox />
       </div>
     </Fabric>
diff --git a/apps/vr-tests/src/stories/SpinButton.stories.tsx b/apps/vr-tests/src/stories/SpinButton.stories.tsx
index 6bbb1280d45c2..bd684d352a147 100644
--- a/apps/vr-tests/src/stories/SpinButton.stories.tsx
+++ b/apps/vr-tests/src/stories/SpinButton.stories.tsx
@@ -2,7 +2,7 @@
 import * as React from 'react';
 import Screener, { Steps } from 'screener-storybook/src/screener';
 import { storiesOf } from '@storybook/react';
-import { FabricDecorator } from '../utilities';
+import { FabricDecoratorFixedWidth } from '../utilities';
 import { SpinButton } from 'office-ui-fabric-react';
 import { Position } from 'office-ui-fabric-react/lib/utilities/positioning';
 
@@ -15,7 +15,7 @@ let props = {
 };
 
 storiesOf('SpinButton', module)
-  .addDecorator(FabricDecorator)
+  .addDecorator(FabricDecoratorFixedWidth)
   .addDecorator(story => (
     <Screener
       steps={ new Screener.Steps()
diff --git a/apps/vr-tests/src/stories/TextField.stories.tsx b/apps/vr-tests/src/stories/TextField.stories.tsx
index 271e763e25ffa..567da56d6ce68 100644
--- a/apps/vr-tests/src/stories/TextField.stories.tsx
+++ b/apps/vr-tests/src/stories/TextField.stories.tsx
@@ -2,11 +2,11 @@
 import * as React from 'react';
 import Screener, { Steps } from 'screener-storybook/src/screener';
 import { storiesOf } from '@storybook/react';
-import { FabricDecorator } from '../utilities';
+import { FabricDecoratorFixedWidth } from '../utilities';
 import { TextField } from 'office-ui-fabric-react';
 
 storiesOf('TextField', module)
-  .addDecorator(FabricDecorator)
+  .addDecorator(FabricDecoratorFixedWidth)
   .addDecorator(story => (
     <Screener
       steps={ new Screener.Steps()
diff --git a/apps/vr-tests/src/utilities/FabricDecorator.tsx b/apps/vr-tests/src/utilities/FabricDecorator.tsx
index 3e791bb82406b..331478299e834 100644
--- a/apps/vr-tests/src/utilities/FabricDecorator.tsx
+++ b/apps/vr-tests/src/utilities/FabricDecorator.tsx
@@ -20,3 +20,19 @@ export const FabricDecoratorTall = (story) => (
     </div>
   </Fabric>
 );
+
+export const FabricDecoratorTallFixedWdith = (story) => (
+  <Fabric style={ { display: 'flex' } }>
+    <div className='testWrapper' style={ { padding: '10px 10px 120px', width: '300px' } }>
+      { story() }
+    </div>
+  </Fabric>
+);
+
+export const FabricDecoratorFixedWidth = (story) => (
+  <Fabric style={ { display: 'flex' } }>
+    <div className='testWrapper' style={ { padding: '10px', width: '300px' } }>
+      { story() }
+    </div>
+  </Fabric>
+);

From be47fdf8a1388cb1164e242acfcb562cad56b259 Mon Sep 17 00:00:00 2001
From: Adrian Tran <adtran@microsoft.com>
Date: Thu, 9 Nov 2017 12:47:09 -0800
Subject: [PATCH 1004/1641] Added className to IDetailsRowProps (#3338)

* Added className to IDetailsRowProps for the root

Added className to IDetailsRowProps for the root element.

* added change file
---
 .../patch-1_2017-11-08-08-11.json                     | 11 +++++++++++
 .../src/components/DetailsList/DetailsRow.tsx         |  3 +++
 2 files changed, 14 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/patch-1_2017-11-08-08-11.json

diff --git a/common/changes/office-ui-fabric-react/patch-1_2017-11-08-08-11.json b/common/changes/office-ui-fabric-react/patch-1_2017-11-08-08-11.json
new file mode 100644
index 0000000000000..3a31888511c48
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/patch-1_2017-11-08-08-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added className to IDetailsRowProps for the root element.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "adtran@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index eee280f4ea94c..19d6769534f5b 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -51,6 +51,7 @@ export interface IDetailsRowProps extends React.Props<DetailsRow> {
   getRowAriaLabel?: (item: any) => string;
   checkButtonAriaLabel?: string;
   checkboxCellClassName?: string;
+  className?: string;
 }
 
 export interface IDetailsRowSelectionState {
@@ -175,6 +176,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
 
   public render() {
     const {
+      className,
       columns,
       dragDropEvents,
       item,
@@ -208,6 +210,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
         aria-label={ ariaLabel }
         className={ css(
           'ms-DetailsRow',
+          className,
           AnimationClassNames.fadeIn400,
           styles.root,
           checkStyles.owner,

From dc0a310f07398df8a158349958bfc463e1d773e4 Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Thu, 9 Nov 2017 16:05:24 -0800
Subject: [PATCH 1005/1641] Object/getId: Fix it so it correctly returns a
 string instead of a number. (#3347)

* updated getId so it uses a string instead of a number

* Adding change file

* ids should start with a letter

* Update Snapshots

* Fix command bar experiment snap
---
 .../utilities/fix-ids_2017-11-09-01-35.json          | 11 +++++++++++
 .../__snapshots__/CommandBar.test.tsx.snap           |  4 ++--
 .../Button/__snapshots__/Button.test.tsx.snap        | 12 ++++++------
 .../Facepile/__snapshots__/Facepile.test.tsx.snap    |  2 +-
 .../__snapshots__/SwatchColorPicker.test.tsx.snap    |  2 +-
 packages/utilities/src/object.ts                     |  3 ++-
 6 files changed, 23 insertions(+), 11 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/fix-ids_2017-11-09-01-35.json

diff --git a/common/changes/@uifabric/utilities/fix-ids_2017-11-09-01-35.json b/common/changes/@uifabric/utilities/fix-ids_2017-11-09-01-35.json
new file mode 100644
index 0000000000000..1305eaf055a1d
--- /dev/null
+++ b/common/changes/@uifabric/utilities/fix-ids_2017-11-09-01-35.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "Object: getId: updated so it will correctly return a string rather than an  int",
+      "packageName": "@uifabric/utilities",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap b/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
index d3da488fc87ee..da84cde9a36f8 100644
--- a/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
+++ b/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
@@ -113,7 +113,7 @@ exports[`CommandBar renders commands correctly 1`] = `
                         margin-right: 4px;
                         margin-top: 0;
                       }
-                  id="2"
+                  id="id__2"
                 >
                   asdf
                 </div>
@@ -214,7 +214,7 @@ exports[`CommandBar renders commands correctly 1`] = `
                         margin-right: 4px;
                         margin-top: 0;
                       }
-                  id="5"
+                  id="id__5"
                 >
                   asdf
                 </div>
diff --git a/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
index a247976f8c199..6995aa46232a5 100644
--- a/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
@@ -93,7 +93,7 @@ exports[`Button renders ActionButton correctly 1`] = `
               margin-right: 4px;
               margin-top: 0;
             }
-        id="3"
+        id="id__3"
       >
         Button
       </div>
@@ -221,7 +221,7 @@ exports[`Button renders CommandBarButton correctly 1`] = `
               margin-right: 4px;
               margin-top: 0;
             }
-        id="6"
+        id="id__6"
       >
         Create account
       </div>
@@ -257,7 +257,7 @@ exports[`Button renders CommandBarButton correctly 1`] = `
 
 exports[`Button renders CompoundButton correctly 1`] = `
 <button
-  aria-describedby="10"
+  aria-describedby="id__10"
   aria-label={undefined}
   aria-labelledby={null}
   aria-pressed={undefined}
@@ -359,7 +359,7 @@ exports[`Button renders CompoundButton correctly 1`] = `
               margin-right: 0;
               margin-top: 0;
             }
-        id="9"
+        id="id__9"
       >
         Create account
       </div>
@@ -375,7 +375,7 @@ exports[`Button renders CompoundButton correctly 1`] = `
               font-weight: 400;
               line-height: 100%;
             }
-        id="10"
+        id="id__10"
       >
         You can create a new account here.
       </div>
@@ -474,7 +474,7 @@ exports[`Button renders DefaultButton correctly 1`] = `
               margin-right: 4px;
               margin-top: 0;
             }
-        id="0"
+        id="id__0"
       >
         Button
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
index 11fd683b5c87b..195be592cf5a6 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
@@ -8,7 +8,7 @@ exports[`Facepile Render personas and buttons renders Facepile correctly 1`] = `
     className="ms-Facepile-itemContainer"
   >
     <div
-      aria-describedby="0"
+      aria-describedby="id__0"
       aria-labelledby={undefined}
       className="ms-FocusZone ms-Facepile-members"
       data-focuszone-id="FocusZone1"
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
index 03a6d50231e36..8545385d5752b 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
@@ -15,7 +15,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
   <table
     aria-posinset={undefined}
     aria-setsize={undefined}
-    id="2"
+    id="id__2"
     role="grid"
     style={
       Object {
diff --git a/packages/utilities/src/object.ts b/packages/utilities/src/object.ts
index b75c40bf27bb9..b560036ccf4e5 100644
--- a/packages/utilities/src/object.ts
+++ b/packages/utilities/src/object.ts
@@ -1,5 +1,6 @@
 // Initialize global window id.
 const CURRENT_ID_PROPERTY = '__currentId__';
+const DEFAULT_ID_STRING = 'id__';
 
 declare const process: {};
 
@@ -87,7 +88,7 @@ export function filteredAssign(isAllowed: (propName: string) => boolean, target:
 export function getId(prefix?: string): string {
   let index = _global[CURRENT_ID_PROPERTY]++;
 
-  return (prefix || '') + index;
+  return (prefix || DEFAULT_ID_STRING) + index;
 }
 
 /* Takes an enum and iterates over each value of the enum (as a string), running the callback on each, returning a mapped array.

From 360d694fc21bc5ea7fa8b44b45fa44426c0f5068 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Thu, 9 Nov 2017 18:05:47 -0800
Subject: [PATCH 1006/1641] TextField: Moved required asterisk to be outside of
 fieldGroup when there is no label (#3355)

* TextField required asterisk outside of fieldGroup with no label

* Added change file
---
 .../textfield-asterisk_2017-11-09-21-14.json    | 11 +++++++++++
 .../src/components/TextField/TextField.scss     | 17 +++--------------
 .../src/components/TextField/TextField.tsx      |  3 +--
 3 files changed, 15 insertions(+), 16 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/textfield-asterisk_2017-11-09-21-14.json

diff --git a/common/changes/office-ui-fabric-react/textfield-asterisk_2017-11-09-21-14.json b/common/changes/office-ui-fabric-react/textfield-asterisk_2017-11-09-21-14.json
new file mode 100644
index 0000000000000..b3ee7b3aa2dd0
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/textfield-asterisk_2017-11-09-21-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "TextField: Moved required asterisk to be outside of fieldGroup when no label is present. No longer a need for special styles when icons are present.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index d42ffd4a88997..8b2142c8c4133 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -138,22 +138,11 @@ $field-error-color: $errorTextColor;
 .root.rootIsRequiredPlaceholderOnly {
   :global(.ms-TextField-fieldGroup) {
     &::after {
-      content: ' *';
-      color: $ms-color-error;
-      @include ms-padding-right(12px);
-    }
-  }
-}
-
-.root.rootIsRequiredPlaceholderIcon {
-  :global(.ms-Icon) {
-    &::before {
-      content: ' *';
+      content: '*';
       color: $ms-color-error;
       position: absolute;
-      top: -4px;
-      @include ms-right(8px);
-      @include ms-padding-right(12px);
+      top: -5px;
+      @include ms-right(-10px);
     }
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index 4d4e58817c6f4..5163050a2688f 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -146,8 +146,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
 
     const textFieldClassName = css('ms-TextField', styles.root, className, {
       ['is-required ' + styles.rootIsRequiredLabel]: this.props.label && required,
-      ['is-required ' + styles.rootIsRequiredPlaceholderOnly]: !this.props.label && required && !iconProps,
-      ['is-required ' + styles.rootIsRequiredPlaceholderIcon]: !this.props.label && required && iconProps,
+      ['is-required ' + styles.rootIsRequiredPlaceholderOnly]: !this.props.label && required,
       ['is-disabled ' + styles.rootIsDisabled]: disabled,
       ['is-active ' + styles.rootIsActive]: isFocused,
       ['ms-TextField--multiline ' + styles.rootIsMultiline]: multiline,

From 2ba94dc123e076b22d0320f141ff1d68a9eccb90 Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Thu, 9 Nov 2017 18:25:34 -0800
Subject: [PATCH 1007/1641] SplitButton: Add optional prop to show active state
 in whole control (#3323)

* Expose prop to enable full active styling in the whole control for split buttons

* Add change file

* Remove testing changes

* Remove dependency on new prop and pass in to getClassNames isSplit

* Create a common isExpanded to be used in getClassnames
---
 ...alozano-SplitButtonActive_2017-11-06-20-38.json | 11 +++++++++++
 .../src/components/Button/BaseButton.classNames.ts | 14 ++++++++------
 .../src/components/Button/BaseButton.tsx           |  3 ++-
 3 files changed, 21 insertions(+), 7 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/malozano-SplitButtonActive_2017-11-06-20-38.json

diff --git a/common/changes/office-ui-fabric-react/malozano-SplitButtonActive_2017-11-06-20-38.json b/common/changes/office-ui-fabric-react/malozano-SplitButtonActive_2017-11-06-20-38.json
new file mode 100644
index 0000000000000..cd5ad6dbaa6f3
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-SplitButtonActive_2017-11-06-20-38.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Expose prop to apply rootExpanded on Primary Button if isSplit is true",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
index dd7d76cbdddf6..b5e54cfc25619 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
@@ -21,8 +21,10 @@ export const getClassNames = memoizeFunction((
   menuIconClassName: string | undefined,
   disabled: boolean,
   checked: boolean,
-  expanded: boolean
+  expanded: boolean,
+  isSplit: boolean | undefined
 ): IButtonClassNames => {
+  const isExpanded = expanded && !isSplit;
   return {
     root: mergeStyles(
       className,
@@ -33,7 +35,7 @@ export const getClassNames = memoizeFunction((
         'is-checked',
         styles.rootChecked
       ],
-      expanded && [
+      isExpanded && [
         'is-expanded',
         styles.rootExpanded,
         {
@@ -48,7 +50,7 @@ export const getClassNames = memoizeFunction((
         'is-disabled',
         styles.rootDisabled
       ],
-      !disabled && !expanded && !checked && {
+      !disabled && !isExpanded && !checked && {
         selectors: {
           ':hover': styles.rootHovered,
           ':hover .ms-Button-icon': styles.iconHovered,
@@ -86,7 +88,7 @@ export const getClassNames = memoizeFunction((
       'ms-Button-icon',
       iconClassName,
       styles.icon,
-      expanded && styles.iconExpanded,
+      isExpanded && styles.iconExpanded,
       checked && styles.iconChecked,
       disabled && styles.iconDisabled,
     ),
@@ -105,14 +107,14 @@ export const getClassNames = memoizeFunction((
       checked && styles.menuIconChecked,
       disabled && styles.menuIconDisabled,
       !disabled &&
-      !expanded &&
+      !isExpanded &&
       !checked && {
         selectors: {
           ':hover': styles.menuIconHovered,
           ':active': styles.menuIconPressed,
         },
       },
-      expanded && [
+      isExpanded && [
         'is-expanded',
         styles.menuIconExpanded,
         {
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 2f9afec02b297..2ddd6e4e68bbe 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -100,7 +100,8 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       menuIconProps && menuIconProps.className,
       isPrimaryButtonDisabled!,
       checked!,
-      !!this.state.menuProps && !this.props.split
+      !!this.state.menuProps,
+      this.props.split
     );
 
     const { _ariaDescriptionId, _labelId, _descriptionId } = this;

From 5293fea9116d3401829ba74018d0fe4a5f0f55f9 Mon Sep 17 00:00:00 2001
From: Evan Levy <evlevy@microsoft.com>
Date: Thu, 9 Nov 2017 21:38:27 -0500
Subject: [PATCH 1008/1641] DatePicker date boundaries (#3345)

---
 .../datepicker-minmax_2017-11-08-21-54.json   |  11 ++
 .../components/DatePicker/DatePicker.Props.ts |  17 ++-
 .../components/DatePicker/DatePicker.test.tsx | 128 ++++++++++++++++--
 .../src/components/DatePicker/DatePicker.tsx  |  39 ++++--
 .../components/DatePicker/DatePickerPage.tsx  |   8 +-
 .../examples/DatePicker.Bounded.Example.tsx   | 109 +++++++++++++++
 6 files changed, 289 insertions(+), 23 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/datepicker-minmax_2017-11-08-21-54.json
 create mode 100644 packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Bounded.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/datepicker-minmax_2017-11-08-21-54.json b/common/changes/office-ui-fabric-react/datepicker-minmax_2017-11-08-21-54.json
new file mode 100644
index 0000000000000..029d246c105f2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/datepicker-minmax_2017-11-08-21-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Allow optional minimum and maximum date boundaries on DatePicker component",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "evlevy@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
index 3eecfb28a82e4..731abeeac5a05 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
@@ -80,7 +80,7 @@ export interface IDatePickerProps extends React.Props<DatePicker> {
   /**
     * Value of today. If null, current time in client machine will be used.
     */
-    today?: Date;
+  today?: Date;
 
   /**
    * Default value of the DatePicker, if any
@@ -149,6 +149,16 @@ export interface IDatePickerProps extends React.Props<DatePicker> {
   * Apply additional formating to dates, for example localized date formatting.
   */
   dateTimeFormatter?: ICalendarFormatDateCallbacks;
+
+  /**
+   * The minimum allowable date.
+   */
+  minDate?: Date;
+
+  /**
+   * The maximum allowable date.
+   */
+  maxDate?: Date;
 }
 
 export interface IDatePickerStrings {
@@ -191,6 +201,11 @@ export interface IDatePickerStrings {
    */
   invalidInputErrorMessage?: string;
 
+  /**
+   * Error message to render for TextField if date boundary (minDate, maxDate) validation fails.
+   */
+  isOutOfBoundsErrorMessage?: string;
+
   /**
    * Aria-label for the "previous month" button.
    */
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx
index 83ed6db06ca81..c62106d81fdf2 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx
@@ -2,8 +2,9 @@ import * as React from 'react';
 import * as renderer from 'react-test-renderer';
 import { Calendar, ICalendarStrings } from '../Calendar';
 import { DatePicker } from './DatePicker';
+import { IDatePickerStrings } from './DatePicker.Props';
 import { FirstWeekOfYear } from '../../utilities/dateValues/DateValues';
-import { shallow } from 'enzyme';
+import { shallow, mount, ReactWrapper } from 'enzyme';
 
 describe('DatePicker', () => {
   it('renders default DatePicker correctly', () => {
@@ -55,16 +56,16 @@ describe('DatePicker', () => {
 
     const datePicker = shallow(
       <DatePicker
-        isMonthPickerVisible={false}
-        showMonthPickerAsOverlay={true}
-        value={value}
-        today={today}
-        firstDayOfWeek={2}
-        highlightCurrentMonth={true}
-        showWeekNumbers={true}
-        firstWeekOfYear={FirstWeekOfYear.FirstFullWeek}
-        showGoToToday={false}
-        dateTimeFormatter={dateTimeFormatter}
+        isMonthPickerVisible={ false }
+        showMonthPickerAsOverlay={ true }
+        value={ value }
+        today={ today }
+        firstDayOfWeek={ 2 }
+        highlightCurrentMonth={ true }
+        showWeekNumbers={ true }
+        firstWeekOfYear={ FirstWeekOfYear.FirstFullWeek }
+        showGoToToday={ false }
+        dateTimeFormatter={ dateTimeFormatter }
       />
     );
     datePicker.setState({ isDatePickerShown: true });
@@ -111,4 +112,109 @@ describe('DatePicker', () => {
       expect(calendarProps.dateTimeFormatter).toBe(dateTimeFormatter);
     });
   });
+
+  describe('when date boundaries are specified', () => {
+    const defaultDate = new Date('Dec 15 2017');
+    const minDate = new Date('Jan 1 2017');
+    const maxDate = new Date('Dec 31 2017');
+    const strings: IDatePickerStrings = {
+      months: [
+        'January',
+        'February',
+        'March',
+        'April',
+        'May',
+        'June',
+        'July',
+        'August',
+        'September',
+        'October',
+        'November',
+        'December'
+      ],
+      shortMonths: [
+        'Jan',
+        'Feb',
+        'Mar',
+        'Apr',
+        'May',
+        'Jun',
+        'Jul',
+        'Aug',
+        'Sep',
+        'Oct',
+        'Nov',
+        'Dec'
+      ],
+      days: [
+        'Sunday',
+        'Monday',
+        'Tuesday',
+        'Wednesday',
+        'Thursday',
+        'Friday',
+        'Saturday'
+      ],
+      shortDays: [
+        'S',
+        'M',
+        'T',
+        'W',
+        'T',
+        'F',
+        'S'
+      ],
+      goToToday: 'Go to today',
+      isOutOfBoundsErrorMessage: 'out of bounds'
+    };
+    let datePicker: ReactWrapper<any, any>;
+
+    beforeEach(() => {
+      datePicker = mount(
+        <DatePicker
+          allowTextInput={ true }
+          minDate={ minDate }
+          maxDate={ maxDate }
+          value={ defaultDate }
+          strings={ strings }
+        />);
+    });
+
+    afterEach(() => {
+      datePicker.unmount();
+    });
+
+    it('should throw validation error for date outside boundary', () => {
+      // before minDate
+      datePicker.find('input')
+        .simulate('change', { target: { value: 'Jan 1 2010' } })
+        .simulate('blur');
+      expect(datePicker.state('errorMessage')).toBe('out of bounds');
+
+      // after maxDate
+      datePicker.find('input')
+        .simulate('change', { target: { value: 'Jan 1 2020' } })
+        .simulate('blur');
+      expect(datePicker.state('errorMessage')).toBe('out of bounds');
+    });
+
+    it('should not throw validation error for date inside boundary', () => {
+      // in boundary
+      datePicker.find('input')
+        .simulate('change', { target: { value: 'Dec 16 2017' } })
+        .simulate('blur');
+      expect(datePicker.state('errorMessage')).toBeFalsy();
+
+      // on boundary
+      datePicker.find('input')
+        .simulate('change', { target: { value: 'Jan 1 2017' } })
+        .simulate('blur');
+      expect(datePicker.state('errorMessage')).toBeFalsy();
+    });
+
+    it('should throw validation error if boundaries are moved to intersect selected date', () => {
+      datePicker.setProps({ minDate: new Date('Dec 16 2017') });
+      expect(datePicker.state('errorMessage')).toBe('out of bounds');
+    });
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 573fcf381984f..36931038e9158 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -17,7 +17,7 @@ import {
   KeyCodes,
   css
 } from '../../Utilities';
-import { compareDates } from '../../utilities/dateMath/DateMath';
+import { compareDates, compareDatePart } from '../../utilities/dateMath/DateMath';
 import * as stylesImport from './DatePicker.scss';
 const styles: any = stylesImport;
 
@@ -143,8 +143,12 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
   }
 
   public componentWillReceiveProps(nextProps: IDatePickerProps) {
-    let { formatDate, isRequired, strings, value } = nextProps;
-    const errorMessage = (isRequired && !value) ? (strings!.isRequiredErrorMessage || '*') : undefined;
+    let { formatDate, isRequired, strings, value, minDate, maxDate } = nextProps;
+    let errorMessage = (isRequired && !value) ? (strings!.isRequiredErrorMessage || '*') : undefined;
+
+    if (!errorMessage && value) {
+      errorMessage = this._isDateOutOfBounds(value!, minDate, maxDate) ? strings!.isOutOfBoundsErrorMessage || '*' : undefined;
+    }
 
     // Set error message
     this.setState({
@@ -176,7 +180,9 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
       placeholder,
       allowTextInput,
       borderless,
-      className
+      className,
+      minDate,
+      maxDate
     } = this.props;
     const { isDatePickerShown, formattedDate, selectedDate, errorMessage } = this.state;
 
@@ -240,6 +246,8 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
               firstWeekOfYear={ this.props.firstWeekOfYear }
               showGoToToday={ this.props.showGoToToday }
               dateTimeFormatter={ this.props.dateTimeFormatter }
+              minDate={ minDate }
+              maxDate={ maxDate }
               ref={ this._resolveRef('_calendar') }
             />
           </Callout>
@@ -392,7 +400,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
 
   @autobind
   private _validateTextInput() {
-    let { isRequired, allowTextInput, strings, parseDateFromString, onSelectDate, formatDate } = this.props;
+    const { isRequired, allowTextInput, strings, parseDateFromString, onSelectDate, formatDate, minDate, maxDate } = this.props;
     const inputValue = this.state.formattedDate;
 
     // Do validation only if DatePicker's popup is dismissed
@@ -425,10 +433,17 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
               errorMessage: strings!.invalidInputErrorMessage || '*'
             });
           } else {
-            this.setState({
-              selectedDate: date,
-              errorMessage: ''
-            });
+            // Check against optional date boundaries
+            if (this._isDateOutOfBounds(date, minDate, maxDate)) {
+              this.setState({
+                errorMessage: strings!.isOutOfBoundsErrorMessage || '*'
+              });
+            } else {
+              this.setState({
+                selectedDate: date,
+                errorMessage: ''
+              });
+            }
           }
         }
       } else {
@@ -446,4 +461,8 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
       }
     }
   }
-}
+
+  private _isDateOutOfBounds(date: Date, minDate?: Date, maxDate?: Date): boolean {
+    return ((!!minDate && compareDatePart(minDate!, date) > 0) || (!!maxDate && compareDatePart(maxDate!, date) < 0));
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
index 1f0a36b122460..16550a9605471 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
@@ -10,6 +10,7 @@ import { DatePickerWeekNumbersExample } from './examples/DatePicker.WeekNumbers.
 import { DatePickerRequiredExample } from './examples/DatePicker.Required.Example';
 import { DatePickerInputExample } from './examples/DatePicker.Input.Example';
 import { DatePickerFormatExample } from './examples/DatePicker.Format.Example';
+import { DatePickerBoundedExample } from './examples/DatePicker.Bounded.Example';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { DatePickerStatus } from './DatePicker.checklist';
 
@@ -18,7 +19,9 @@ const DatePickerWeekNumbersExampleCode = require('!raw-loader!office-ui-fabric-r
 const DatePickerRequiredExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Required.Example.tsx') as string;
 const DatePickerInputExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx') as string;
 const DatePickerFormatExampleCode = require
-('!raw-loader!office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Format.Example.tsx') as string;
+  ('!raw-loader!office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Format.Example.tsx') as string;
+const DatePickerBoundedExampleCode = require
+  ('!raw-loader!office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Bounded.Example.tsx') as string;
 
 export class DatePickerPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
@@ -43,6 +46,9 @@ export class DatePickerPage extends React.Component<IComponentDemoPageProps, {}>
             <ExampleCard title='DatePicker allows dates to be formatted' code={ DatePickerFormatExampleCode }>
               <DatePickerFormatExample />
             </ExampleCard>
+            <ExampleCard title='DatePicker with date boundary (minDate, maxDate)' code={ DatePickerBoundedExampleCode }>
+              <DatePickerBoundedExample />
+            </ExampleCard>
           </div>
         }
         propertiesTables={
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Bounded.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Bounded.Example.tsx
new file mode 100644
index 0000000000000..46b3d47455cf6
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Bounded.Example.tsx
@@ -0,0 +1,109 @@
+import * as React from 'react';
+import {
+  DatePicker,
+  DayOfWeek,
+  IDatePickerStrings
+} from 'office-ui-fabric-react/lib/DatePicker';
+import { addMonths, addYears } from '../../../utilities/dateMath/DateMath';
+
+const today: Date = new Date(Date.now());
+const minDate: Date = addMonths(today, -1);
+const maxDate: Date = addYears(today, 1);
+const description = `When date boundaries are set (via minDate and maxDate props) the DatePicker will not allow out-of-bounds dates to be picked or entered. In this example, the allowed dates are ${minDate.toLocaleDateString()}-${maxDate.toLocaleDateString()}`;
+
+const DayPickerStrings: IDatePickerStrings = {
+  months: [
+    'January',
+    'February',
+    'March',
+    'April',
+    'May',
+    'June',
+    'July',
+    'August',
+    'September',
+    'October',
+    'November',
+    'December'
+  ],
+
+  shortMonths: [
+    'Jan',
+    'Feb',
+    'Mar',
+    'Apr',
+    'May',
+    'Jun',
+    'Jul',
+    'Aug',
+    'Sep',
+    'Oct',
+    'Nov',
+    'Dec'
+  ],
+
+  days: [
+    'Sunday',
+    'Monday',
+    'Tuesday',
+    'Wednesday',
+    'Thursday',
+    'Friday',
+    'Saturday'
+  ],
+
+  shortDays: [
+    'S',
+    'M',
+    'T',
+    'W',
+    'T',
+    'F',
+    'S'
+  ],
+
+  goToToday: 'Go to today',
+  prevMonthAriaLabel: 'Go to previous month',
+  nextMonthAriaLabel: 'Go to next month',
+  prevYearAriaLabel: 'Go to previous year',
+  nextYearAriaLabel: 'Go to next year',
+
+  isRequiredErrorMessage: 'Field is required.',
+
+  invalidInputErrorMessage: 'Invalid date format.',
+
+  isOutOfBoundsErrorMessage: `Date must be between ${minDate.toLocaleDateString()}-${maxDate.toLocaleDateString()}`
+};
+
+export interface IDatePickerRequiredExampleState {
+  firstDayOfWeek?: DayOfWeek;
+}
+
+export class DatePickerBoundedExample extends React.Component<any, IDatePickerRequiredExampleState> {
+  public constructor() {
+    super();
+
+    this.state = {
+      firstDayOfWeek: DayOfWeek.Sunday
+    };
+  }
+
+  public render() {
+    let { firstDayOfWeek } = this.state;
+
+    return (
+      <div>
+        <p>{ description }</p>
+        <DatePicker
+          isRequired={ false }
+          firstDayOfWeek={ firstDayOfWeek }
+          strings={ DayPickerStrings }
+          placeholder='Select a date...'
+          minDate={ minDate }
+          maxDate={ maxDate }
+          allowTextInput={ true }
+        />
+      </div>
+    );
+  }
+}
\ No newline at end of file

From 696cd19b230f855f071f766c27c0066eb15d8109 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 10 Nov 2017 08:56:14 -0800
Subject: [PATCH 1009/1641] mergeStyles: adding option to appendChild instead
 of insertRule (#3346)

* Adding alternative injection mode for rare conditions.

* updating interface.

* Adding a change checker to ci.

* Change files.
---
 .travis.yml                                      |  1 +
 .../append-child_2017-11-10-02-09.json           | 11 +++++++++++
 .../styling/append-child_2017-11-10-02-09.json   | 11 +++++++++++
 .../append-child_2017-11-10-02-09.json           | 11 +++++++++++
 package.json                                     |  5 +++--
 packages/merge-styles/src/Stylesheet.ts          | 16 ++++++++++++++--
 packages/office-ui-fabric-react/index.html       |  5 ++++-
 packages/styling/src/interfaces/IFabricConfig.ts | 14 +++++++++++++-
 8 files changed, 68 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/@uifabric/merge-styles/append-child_2017-11-10-02-09.json
 create mode 100644 common/changes/@uifabric/styling/append-child_2017-11-10-02-09.json
 create mode 100644 common/changes/office-ui-fabric-react/append-child_2017-11-10-02-09.json

diff --git a/.travis.yml b/.travis.yml
index 2bd87e1605382..216d2431c4e8a 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -2,6 +2,7 @@ language: node_js
 node_js:
   - '8'
 script:
+  - npm run checkchange
   - npm run buildfast
   - npm run bundlesize
   - npm run vrtest
diff --git a/common/changes/@uifabric/merge-styles/append-child_2017-11-10-02-09.json b/common/changes/@uifabric/merge-styles/append-child_2017-11-10-02-09.json
new file mode 100644
index 0000000000000..01a9fc874d36e
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/append-child_2017-11-10-02-09.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "Adding the ability to append style content rather than inject using insertRule, for special cases.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/append-child_2017-11-10-02-09.json b/common/changes/@uifabric/styling/append-child_2017-11-10-02-09.json
new file mode 100644
index 0000000000000..9169a1232fa19
--- /dev/null
+++ b/common/changes/@uifabric/styling/append-child_2017-11-10-02-09.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Adjusting the IFabricConfig interface to allow for mergeStyle settings to be included.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/append-child_2017-11-10-02-09.json b/common/changes/office-ui-fabric-react/append-child_2017-11-10-02-09.json
new file mode 100644
index 0000000000000..bdac204cd2e2e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/append-child_2017-11-10-02-09.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "office-ui-fabric-react",
+      "type": "none"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/package.json b/package.json
index 736756597a21d..345ca673491d3 100644
--- a/package.json
+++ b/package.json
@@ -20,9 +20,10 @@
     "build": "npm run _rushRebuild",
     "buildfast": "npm run _rushBuild",
     "change": "node node_modules/@microsoft/rush/bin/rush change",
-    "generate": "node node_modules/@microsoft/rush/bin/rush generate",
+    "generate": "node node_modules/@microsoft/rush/bin/rush generate --force",
     "bundlesize": "cd scripts && npm run bundlesize",
-    "create-component": "node scripts/create-component.js"
+    "create-component": "node scripts/create-component.js",
+    "checkchange": "node node_modules/@microsoft/rush/bin/rush change -v"
   },
   "license": "MIT",
   "devDependencies": {
diff --git a/packages/merge-styles/src/Stylesheet.ts b/packages/merge-styles/src/Stylesheet.ts
index 925548a3b84b0..157a3e28237ce 100644
--- a/packages/merge-styles/src/Stylesheet.ts
+++ b/packages/merge-styles/src/Stylesheet.ts
@@ -13,7 +13,12 @@ export const enum InjectionMode {
   /**
    * Inserts rules using the insertRule api.
    */
-  insertNode = 1
+  insertNode = 1,
+
+  /**
+   * Appends rules using appendChild.
+   */
+  appendChild = 2
 }
 
 /**
@@ -60,7 +65,10 @@ export class Stylesheet {
     _stylesheet = win[STYLESHEET_SETTING] as Stylesheet;
 
     if (!_stylesheet) {
-      _stylesheet = win[STYLESHEET_SETTING] = new Stylesheet();
+      // tslint:disable-next-line:no-string-literal
+      const fabricConfig = (win && win['FabricConfig']) || {};
+
+      _stylesheet = win[STYLESHEET_SETTING] = new Stylesheet(fabricConfig.mergeStyles);
     }
 
     return _stylesheet;
@@ -163,6 +171,10 @@ export class Stylesheet {
         }
         break;
 
+      case InjectionMode.appendChild:
+        element!.appendChild(document.createTextNode(rule));
+        break;
+
       default:
         this._rules.push(rule);
         break;
diff --git a/packages/office-ui-fabric-react/index.html b/packages/office-ui-fabric-react/index.html
index a5f406af92e68..65f1e562c5b1c 100644
--- a/packages/office-ui-fabric-react/index.html
+++ b/packages/office-ui-fabric-react/index.html
@@ -16,7 +16,10 @@
     window.FabricConfig = {
       // Uncommenting this prevents the fontfaces from being registered.
       // Alternatively you can specify a base url which contains the font/icon assets.
-      // fontBaseUrl: ''
+      // fontBaseUrl: '',
+      // mergeStyles: {
+      //   injectionMode: 2
+      // }
     };
 
     var isProduction = (
diff --git a/packages/styling/src/interfaces/IFabricConfig.ts b/packages/styling/src/interfaces/IFabricConfig.ts
index 3988edf4073c9..29cdaff6a6b25 100644
--- a/packages/styling/src/interfaces/IFabricConfig.ts
+++ b/packages/styling/src/interfaces/IFabricConfig.ts
@@ -1,6 +1,18 @@
+import {
+  IStyleSheetConfig
+} from '@uifabric/merge-styles/lib/index';
 /**
- * The interface of window.FabricConfig.
+ * The interface of window.FabricConfig, which can be burned on the page before script loading to preemptively
+ * define default configurations.
  */
 export interface IFabricConfig {
+  /**
+   * An override for where the fonts should be downloaded from.
+   */
   fontBaseUrl?: string;
+
+  /**
+   * The mergeStyles stylesheet config.
+   */
+  mergeStyles?: IStyleSheetConfig;
 }

From 4d34110358cf6ec5cc9ed32f9034550d11c651f7 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 10 Nov 2017 17:09:36 +0000
Subject: [PATCH 1010/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../append-child_2017-11-10-02-09.json        | 11 ---
 .../append-child_2017-11-10-02-09.json        | 11 ---
 .../fixGetIconCN_2017-11-08-19-42.json        | 11 ---
 .../utilities/fix-ids_2017-11-09-01-35.json   | 11 ---
 .../append-child_2017-11-10-02-09.json        | 11 ---
 .../datepicker-minmax_2017-11-08-21-54.json   | 11 ---
 ...no-SplitButtonActive_2017-11-06-20-38.json | 11 ---
 .../patch-1_2017-11-08-08-11.json             | 11 ---
 .../textfield-asterisk_2017-11-09-21-14.json  | 11 ---
 .../textfield-width_2017-11-06-22-05.json     | 11 ---
 ...ualizedComboBoxFocus_2017-11-08-21-51.json | 11 ---
 .../yimwu-pickerfocus_2017-11-08-17-51.json   | 11 ---
 packages/example-app-base/package.json        |  4 +-
 .../jest-serializer-merge-styles/package.json |  2 +-
 packages/merge-styles/CHANGELOG.json          | 14 ++++
 packages/merge-styles/CHANGELOG.md            |  9 +-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 57 +++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 20 ++++-
 packages/office-ui-fabric-react/package.json  |  8 +-
 packages/styling/CHANGELOG.json               | 27 ++++++
 packages/styling/CHANGELOG.md                 | 84 ++++++++++---------
 packages/styling/package.json                 |  6 +-
 packages/utilities/CHANGELOG.json             | 14 ++++
 packages/utilities/CHANGELOG.md               |  9 +-
 packages/utilities/package.json               |  2 +-
 scripts/package.json                          |  2 +-
 32 files changed, 210 insertions(+), 192 deletions(-)
 delete mode 100644 common/changes/@uifabric/merge-styles/append-child_2017-11-10-02-09.json
 delete mode 100644 common/changes/@uifabric/styling/append-child_2017-11-10-02-09.json
 delete mode 100644 common/changes/@uifabric/styling/fixGetIconCN_2017-11-08-19-42.json
 delete mode 100644 common/changes/@uifabric/utilities/fix-ids_2017-11-09-01-35.json
 delete mode 100644 common/changes/office-ui-fabric-react/append-child_2017-11-10-02-09.json
 delete mode 100644 common/changes/office-ui-fabric-react/datepicker-minmax_2017-11-08-21-54.json
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-SplitButtonActive_2017-11-06-20-38.json
 delete mode 100644 common/changes/office-ui-fabric-react/patch-1_2017-11-08-08-11.json
 delete mode 100644 common/changes/office-ui-fabric-react/textfield-asterisk_2017-11-09-21-14.json
 delete mode 100644 common/changes/office-ui-fabric-react/textfield-width_2017-11-06-22-05.json
 delete mode 100644 common/changes/office-ui-fabric-react/virtualizedComboBoxFocus_2017-11-08-21-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/yimwu-pickerfocus_2017-11-08-17-51.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 3ae89f561eaa4..9129a549f4658 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.20.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.21.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index c4e0d2dc99d8e..eecf3eeb0f19a 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.20.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.21.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index df19718f2fe37..8090604b3e95f 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.20.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.21.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index c0111233e33e6..678bed1db577f 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.20.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.21.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 24d696fd2df6f..ffe0403a318f7 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.20.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.21.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/merge-styles/append-child_2017-11-10-02-09.json b/common/changes/@uifabric/merge-styles/append-child_2017-11-10-02-09.json
deleted file mode 100644
index 01a9fc874d36e..0000000000000
--- a/common/changes/@uifabric/merge-styles/append-child_2017-11-10-02-09.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "Adding the ability to append style content rather than inject using insertRule, for special cases.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/append-child_2017-11-10-02-09.json b/common/changes/@uifabric/styling/append-child_2017-11-10-02-09.json
deleted file mode 100644
index 9169a1232fa19..0000000000000
--- a/common/changes/@uifabric/styling/append-child_2017-11-10-02-09.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Adjusting the IFabricConfig interface to allow for mergeStyle settings to be included.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/fixGetIconCN_2017-11-08-19-42.json b/common/changes/@uifabric/styling/fixGetIconCN_2017-11-08-19-42.json
deleted file mode 100644
index 7ea3fa4dca387..0000000000000
--- a/common/changes/@uifabric/styling/fixGetIconCN_2017-11-08-19-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Updating `getIconClassName` to return display: inline-block to be consistent with the styled used by `ms-Icon ms-Icon--*`.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/fix-ids_2017-11-09-01-35.json b/common/changes/@uifabric/utilities/fix-ids_2017-11-09-01-35.json
deleted file mode 100644
index 1305eaf055a1d..0000000000000
--- a/common/changes/@uifabric/utilities/fix-ids_2017-11-09-01-35.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "Object: getId: updated so it will correctly return a string rather than an  int",
-      "packageName": "@uifabric/utilities",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/append-child_2017-11-10-02-09.json b/common/changes/office-ui-fabric-react/append-child_2017-11-10-02-09.json
deleted file mode 100644
index bdac204cd2e2e..0000000000000
--- a/common/changes/office-ui-fabric-react/append-child_2017-11-10-02-09.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "office-ui-fabric-react",
-      "type": "none"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/datepicker-minmax_2017-11-08-21-54.json b/common/changes/office-ui-fabric-react/datepicker-minmax_2017-11-08-21-54.json
deleted file mode 100644
index 029d246c105f2..0000000000000
--- a/common/changes/office-ui-fabric-react/datepicker-minmax_2017-11-08-21-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Allow optional minimum and maximum date boundaries on DatePicker component",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "evlevy@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/malozano-SplitButtonActive_2017-11-06-20-38.json b/common/changes/office-ui-fabric-react/malozano-SplitButtonActive_2017-11-06-20-38.json
deleted file mode 100644
index cd5ad6dbaa6f3..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-SplitButtonActive_2017-11-06-20-38.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Expose prop to apply rootExpanded on Primary Button if isSplit is true",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/patch-1_2017-11-08-08-11.json b/common/changes/office-ui-fabric-react/patch-1_2017-11-08-08-11.json
deleted file mode 100644
index 3a31888511c48..0000000000000
--- a/common/changes/office-ui-fabric-react/patch-1_2017-11-08-08-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added className to IDetailsRowProps for the root element.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "adtran@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/textfield-asterisk_2017-11-09-21-14.json b/common/changes/office-ui-fabric-react/textfield-asterisk_2017-11-09-21-14.json
deleted file mode 100644
index b3ee7b3aa2dd0..0000000000000
--- a/common/changes/office-ui-fabric-react/textfield-asterisk_2017-11-09-21-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "TextField: Moved required asterisk to be outside of fieldGroup when no label is present. No longer a need for special styles when icons are present.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/textfield-width_2017-11-06-22-05.json b/common/changes/office-ui-fabric-react/textfield-width_2017-11-06-22-05.json
deleted file mode 100644
index cf3806c1558e1..0000000000000
--- a/common/changes/office-ui-fabric-react/textfield-width_2017-11-06-22-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "TextField: Updated field width for all examples to be more legible. Replaced ms- with docs- prefix for example scss.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/virtualizedComboBoxFocus_2017-11-08-21-51.json b/common/changes/office-ui-fabric-react/virtualizedComboBoxFocus_2017-11-08-21-51.json
deleted file mode 100644
index 637abbb64d5ba..0000000000000
--- a/common/changes/office-ui-fabric-react/virtualizedComboBoxFocus_2017-11-08-21-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Have VirtualizedCombobox implement IComboBox interface",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "alexbettadapur@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/yimwu-pickerfocus_2017-11-08-17-51.json b/common/changes/office-ui-fabric-react/yimwu-pickerfocus_2017-11-08-17-51.json
deleted file mode 100644
index 1d472eb13fa1e..0000000000000
--- a/common/changes/office-ui-fabric-react/yimwu-pickerfocus_2017-11-08-17-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add focusInput method in BasePicker to allow set focus to input element directly.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "yimwu@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index d2206784c8543..05ec4c6d91491 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -38,8 +38,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.6.1 <6.0.0",
-    "@uifabric/utilities": ">=5.3.2 <6.0.0",
+    "@uifabric/styling": ">=5.7.0 <6.0.0",
+    "@uifabric/utilities": ">=5.3.3 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/jest-serializer-merge-styles/package.json b/packages/jest-serializer-merge-styles/package.json
index 633120b4f6183..6a867b993ab72 100644
--- a/packages/jest-serializer-merge-styles/package.json
+++ b/packages/jest-serializer-merge-styles/package.json
@@ -24,6 +24,6 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/merge-styles": ">=5.5.1 <6.0.0"
+    "@uifabric/merge-styles": ">=5.6.0 <6.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index 12ff39a11fce2..645db78bed8c7 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.6.0",
+      "tag": "@uifabric/merge-styles_v5.6.0",
+      "date": "Fri, 10 Nov 2017 17:09:36 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "696cd19b230f855f071f766c27c0066eb15d8109",
+            "comment": "Adding the ability to append style content rather than inject using insertRule, for special cases."
+          }
+        ]
+      }
+    },
     {
       "version": "5.5.1",
       "tag": "@uifabric/merge-styles_v5.5.1",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index 151f2f48eec9e..b992fc33bbfe9 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Thu, 02 Nov 2017 18:20:18 GMT and should not be manually modified.
+This log was last generated on Fri, 10 Nov 2017 17:09:36 GMT and should not be manually modified.
+
+## 5.6.0
+Fri, 10 Nov 2017 17:09:36 GMT
+
+### Minor changes
+
+- Adding the ability to append style content rather than inject using insertRule, for special cases.
 
 ## 5.5.1
 Thu, 02 Nov 2017 18:20:18 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index ecd35bc682fef..4b6a5f6b87df8 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.5.1",
+  "version": "5.6.0",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 02e2a7aca8e56..b137289116433 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,63 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.21.0",
+      "tag": "office-ui-fabric-react_v5.21.0",
+      "date": "Fri, 10 Nov 2017 17:09:36 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Evan Levy <evlevy@microsoft.com>",
+            "commit": "5293fea9116d3401829ba74018d0fe4a5f0f55f9",
+            "comment": "Allow optional minimum and maximum date boundaries on DatePicker component"
+          },
+          {
+            "author": "Adrian Tran <adtran@microsoft.com>",
+            "commit": "be47fdf8a1388cb1164e242acfcb562cad56b259",
+            "comment": "Added className to IDetailsRowProps for the root element."
+          },
+          {
+            "author": "Alex Bettadapur <alexbettadapur@gmail.com>",
+            "commit": "c554bb2e9449b8bab09c484807777bfb5f7eb2fd",
+            "comment": "Have VirtualizedCombobox implement IComboBox interface"
+          },
+          {
+            "author": "Yimin Wu <yimwu@microsoft.com>",
+            "commit": "96f6e32d57bf08b76493fb090ff88c1ab0b23de8",
+            "comment": "Add focusInput method in BasePicker to allow set focus to input element directly."
+          }
+        ],
+        "patch": [
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "2ba94dc123e076b22d0320f141ff1d68a9eccb90",
+            "comment": "Expose prop to apply rootExpanded on Primary Button if isSplit is true"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "360d694fc21bc5ea7fa8b44b45fa44426c0f5068",
+            "comment": "TextField: Moved required asterisk to be outside of fieldGroup when no label is present. No longer a need for special styles when icons are present."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "a54a302ccca174804aa60d1d39e6dd48f7767020",
+            "comment": "TextField: Updated field width for all examples to be more legible. Replaced ms- with docs- prefix for example scss."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.5.1 <6.0.0` to `>=5.6.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.6.1 <6.0.0` to `>=5.7.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.3.2 <6.0.0` to `>=5.3.3 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.20.3",
       "tag": "office-ui-fabric-react_v5.20.3",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index cb299fccddc03..3feb2afd238a5 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,22 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 08 Nov 2017 06:05:34 GMT and should not be manually modified.
+This log was last generated on Fri, 10 Nov 2017 17:09:36 GMT and should not be manually modified.
+
+## 5.21.0
+Fri, 10 Nov 2017 17:09:36 GMT
+
+### Minor changes
+
+- Allow optional minimum and maximum date boundaries on DatePicker component
+- Added className to IDetailsRowProps for the root element.
+- Have VirtualizedCombobox implement IComboBox interface
+- Add focusInput method in BasePicker to allow set focus to input element directly.
+
+### Patches
+
+- Expose prop to apply rootExpanded on Primary Button if isSplit is true
+- TextField: Moved required asterisk to be outside of fieldGroup when no label is present. No longer a need for special styles when icons are present.
+- TextField: Updated field width for all examples to be more legible. Replaced ms- with docs- prefix for example scss.
 
 ## 5.20.3
 Wed, 08 Nov 2017 06:05:34 GMT
@@ -1779,7 +1795,7 @@ Fri, 21 Apr 2017 06:23:54 GMT
 ## 2.20.2
 Wed, 19 Apr 2017 16:54:26 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 2.20.1
 Wed, 19 Apr 2017 15:36:48 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 31d86514fca62..b32df5d6cb26a 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.20.3",
+  "version": "5.21.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -46,9 +46,9 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.5.1 <6.0.0",
-    "@uifabric/styling": ">=5.6.1 <6.0.0",
-    "@uifabric/utilities": ">=5.3.2 <6.0.0",
+    "@uifabric/merge-styles": ">=5.6.0 <6.0.0",
+    "@uifabric/styling": ">=5.7.0 <6.0.0",
+    "@uifabric/utilities": ">=5.3.3 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index a7301ca836f9e..9f73bbf153ec8 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,33 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.7.0",
+      "tag": "@uifabric/styling_v5.7.0",
+      "date": "Fri, 10 Nov 2017 17:09:36 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "696cd19b230f855f071f766c27c0066eb15d8109",
+            "comment": "Adjusting the IFabricConfig interface to allow for mergeStyle settings to be included."
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "360596259b7e047fd6987cc05aafdc4f88d878d3",
+            "comment": "Updating `getIconClassName` to return display: inline-block to be consistent with the styled used by `ms-Icon ms-Icon--*`."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.3.2 <6.0.0` to `>=5.3.3 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.5.1 <6.0.0` to `>=5.6.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.6.1",
       "tag": "@uifabric/styling_v5.6.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 9ddadaab99714..32f6ccfc36d74 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Mon, 30 Oct 2017 10:23:09 GMT and should not be manually modified.
+This log was last generated on Fri, 10 Nov 2017 17:09:36 GMT and should not be manually modified.
+
+## 5.7.0
+Fri, 10 Nov 2017 17:09:36 GMT
+
+### Minor changes
+
+- Adjusting the IFabricConfig interface to allow for mergeStyle settings to be included.
+- Updating `getIconClassName` to return display: inline-block to be consistent with the styled used by `ms-Icon ms-Icon--*`.
 
 ## 5.6.1
 Mon, 30 Oct 2017 10:23:09 GMT
@@ -61,7 +69,7 @@ Thu, 05 Oct 2017 17:03:43 GMT
 ## 5.1.1
 Wed, 04 Oct 2017 22:40:22 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 5.1.0
 Sat, 30 Sep 2017 01:26:37 GMT
@@ -215,22 +223,22 @@ Thu, 03 Aug 2017 10:13:03 GMT
 ## 0.15.4
 Wed, 02 Aug 2017 10:22:40 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.15.3
 Tue, 01 Aug 2017 10:13:55 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.15.2
 Mon, 31 Jul 2017 10:12:08 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.15.1
 Fri, 28 Jul 2017 18:36:00 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.15.0
 Fri, 28 Jul 2017 10:23:10 GMT
@@ -253,12 +261,12 @@ Thu, 27 Jul 2017 10:23:33 GMT
 ## 0.13.16
 Tue, 25 Jul 2017 10:22:35 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.13.15
 Mon, 24 Jul 2017 10:24:30 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.13.14
 Fri, 21 Jul 2017 10:21:45 GMT
@@ -271,7 +279,7 @@ Fri, 21 Jul 2017 10:21:45 GMT
 ## 0.13.13
 Thu, 20 Jul 2017 10:11:23 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.13.12
 Wed, 19 Jul 2017 21:40:34 GMT
@@ -283,17 +291,17 @@ Wed, 19 Jul 2017 21:40:34 GMT
 ## 0.13.11
 Mon, 17 Jul 2017 18:38:01 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.13.10
 Mon, 17 Jul 2017 10:22:38 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.13.9
 Fri, 14 Jul 2017 17:34:53 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.13.8
 Thu, 13 Jul 2017 10:21:52 GMT
@@ -305,7 +313,7 @@ Thu, 13 Jul 2017 10:21:52 GMT
 ## 0.13.7
 Thu, 13 Jul 2017 02:58:02 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.13.6
 Wed, 12 Jul 2017 01:49:50 GMT
@@ -317,22 +325,22 @@ Wed, 12 Jul 2017 01:49:50 GMT
 ## 0.13.5
 Tue, 11 Jul 2017 10:14:04 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.13.4
 Mon, 10 Jul 2017 19:18:55 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.13.3
 Mon, 10 Jul 2017 10:22:21 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.13.2
 Sat, 08 Jul 2017 05:59:28 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.13.1
 Sat, 08 Jul 2017 03:34:35 GMT
@@ -355,17 +363,17 @@ Fri, 07 Jul 2017 10:11:38 GMT
 ## 0.12.3
 Thu, 06 Jul 2017 10:11:47 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.12.2
 Tue, 04 Jul 2017 10:21:53 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.12.1
 Mon, 03 Jul 2017 10:11:52 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.12.0
 Fri, 30 Jun 2017 19:44:26 GMT
@@ -377,22 +385,22 @@ Fri, 30 Jun 2017 19:44:26 GMT
 ## 0.11.10
 Fri, 30 Jun 2017 10:23:15 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.11.9
 Thu, 29 Jun 2017 20:48:31 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.11.8
 Thu, 29 Jun 2017 10:13:16 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.11.7
 Wed, 28 Jun 2017 10:12:04 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.11.6
 Tue, 27 Jun 2017 01:26:31 GMT
@@ -404,22 +412,22 @@ Tue, 27 Jun 2017 01:26:31 GMT
 ## 0.11.5
 Fri, 23 Jun 2017 20:02:00 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.11.4
 Fri, 23 Jun 2017 04:12:23 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.11.3
 Thu, 22 Jun 2017 21:45:08 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.11.2
 Thu, 22 Jun 2017 10:13:03 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.11.1
 Wed, 21 Jun 2017 01:52:48 GMT
@@ -443,17 +451,17 @@ Wed, 21 Jun 2017 00:45:41 GMT
 ## 0.10.5
 Tue, 20 Jun 2017 10:22:47 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.10.4
 Sat, 17 Jun 2017 17:39:43 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.10.2
 Sat, 17 Jun 2017 06:27:45 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.10.1
 Sat, 17 Jun 2017 04:36:46 GMT
@@ -472,7 +480,7 @@ Fri, 16 Jun 2017 23:02:08 GMT
 ## 0.9.1
 Fri, 16 Jun 2017 19:39:47 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.9.0
 Thu, 15 Jun 2017 23:55:18 GMT
@@ -484,7 +492,7 @@ Thu, 15 Jun 2017 23:55:18 GMT
 ## 0.8.1
 Thu, 15 Jun 2017 10:09:15 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.8.0
 Wed, 14 Jun 2017 06:02:15 GMT
@@ -502,7 +510,7 @@ Wed, 14 Jun 2017 06:02:15 GMT
 ## 0.7.4
 Tue, 13 Jun 2017 10:13:21 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.7.3
 Mon, 12 Jun 2017 01:47:18 GMT
@@ -521,7 +529,7 @@ Fri, 09 Jun 2017 10:10:47 GMT
 ## 0.7.1
 Thu, 08 Jun 2017 10:20:07 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.7.0
 Thu, 08 Jun 2017 00:18:05 GMT
@@ -533,7 +541,7 @@ Thu, 08 Jun 2017 00:18:05 GMT
 ## 0.6.1
 Tue, 06 Jun 2017 07:41:47 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.6.0
 Tue, 06 Jun 2017 06:06:46 GMT
@@ -557,12 +565,12 @@ Tue, 06 Jun 2017 00:50:06 GMT
 ## 0.4.3
 Fri, 02 Jun 2017 01:19:36 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.4.2
 Thu, 01 Jun 2017 16:34:03 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.4.1
 Wed, 31 May 2017 01:58:23 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 022baa29b0b82..314e1b752ed32 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.6.1",
+  "version": "5.7.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -21,8 +21,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=5.3.2 <6.0.0",
-    "@uifabric/merge-styles": ">=5.5.1 <6.0.0",
+    "@uifabric/utilities": ">=5.3.3 <6.0.0",
+    "@uifabric/merge-styles": ">=5.6.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 1612069acc9ca..0f2c8287f470b 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.3.3",
+      "tag": "@uifabric/utilities_v5.3.3",
+      "date": "Fri, 10 Nov 2017 17:09:36 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "dc0a310f07398df8a158349958bfc463e1d773e4",
+            "comment": "Object: getId: updated so it will correctly return a string rather than an  int"
+          }
+        ]
+      }
+    },
     {
       "version": "5.3.2",
       "tag": "@uifabric/utilities_v5.3.2",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index bf0e0132e549b..a6ca0497a0a42 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Wed, 08 Nov 2017 11:11:27 GMT and should not be manually modified.
+This log was last generated on Fri, 10 Nov 2017 17:09:36 GMT and should not be manually modified.
+
+## 5.3.3
+Fri, 10 Nov 2017 17:09:36 GMT
+
+### Patches
+
+- Object: getId: updated so it will correctly return a string rather than an  int
 
 ## 5.3.2
 Wed, 08 Nov 2017 11:11:27 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index f819f0d5c5287..11ca6fafba002 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.3.2",
+  "version": "5.3.3",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/scripts/package.json b/scripts/package.json
index e781574d58ee9..a5de785b5ed92 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -10,7 +10,7 @@
   "devDependencies": {
     "@microsoft/load-themed-styles": "^1.7.5",
     "@microsoft/loader-load-themed-styles": "^1.6.0",
-    "@uifabric/merge-styles": ">=5.5.1 <6.0.0",
+    "@uifabric/merge-styles": ">=5.6.0 <6.0.0",
     "autoprefixer": "^7.1.5",
     "awesome-typescript-loader": "^3.2.3",
     "bundlesize": "^0.15.2",

From f1abaa3f1d84cf54447d2fa3ee3ce2d23ae62c4a Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 11 Nov 2017 13:31:23 -0800
Subject: [PATCH 1011/1641] Renaming all ".Props" files to ".types" for more
 consistent casing (#3357)

* Renaming all ".Props" files to ".types" for a more consistent convention for "sub files". We will use camelCase, like functional files, for describing subThings. (like Component.styles.ts, Component.test.ts, etc)

* More renames.

* One more

* Adding change files.

* fix import

* another one.
---
 CONTRIBUTING.md                                    |  6 +++---
 .../fabric-website/src/components/App/AppState.tsx |  2 +-
 apps/fabric-website/src/components/Nav/Nav.tsx     |  2 +-
 .../components/Nav/{Nav.Props.ts => Nav.types.ts}  |  0
 .../rename-props_2017-11-11-20-23.json             | 11 +++++++++++
 .../experiments/rename-props_2017-11-11-20-23.json | 11 +++++++++++
 .../rename-props_2017-11-11-20-23.json             | 11 +++++++++++
 .../icons/rename-props_2017-11-11-20-23.json       | 11 +++++++++++
 .../rename-props_2017-11-11-20-23.json             | 11 +++++++++++
 .../rename-props_2017-11-11-20-23.json             | 11 +++++++++++
 .../styling/rename-props_2017-11-11-20-23.json     | 11 +++++++++++
 .../utilities/rename-props_2017-11-11-20-23.json   | 11 +++++++++++
 .../rename-props_2017-11-11-20-23.json             | 11 +++++++++++
 ghdocs/BESTPRACTICES.md                            |  4 ++--
 .../PropertiesTable/PropertiesTableSet.tsx         |  4 ++--
 ...bleSet.Props.ts => PropertiesTableSet.types.ts} |  2 +-
 packages/example-app-base/src/index.ts             |  2 +-
 packages/experiments/.npmignore                    |  2 +-
 .../src/components/CommandBar/CommandBar.tsx       |  2 +-
 .../{CommandBar.Props.ts => CommandBar.types.ts}   |  0
 .../src/components/CommandBar/CommandBarPage.tsx   |  6 +++---
 .../examples/CommandBar.Basic.Example.tsx          |  2 +-
 .../experiments/src/components/CommandBar/index.ts |  2 +-
 .../ExtendedPicker/BaseExtendedPicker.tsx          |  2 +-
 ...Picker.Props.ts => BaseExtendedPicker.types.ts} |  0
 .../PeoplePicker/ExtendedPeoplePicker.tsx          |  2 +-
 .../PeoplePicker/ExtendedPeoplePickerPage.tsx      |  2 +-
 .../ExtendedPeoplePicker.Basic.Example.tsx         |  2 +-
 .../src/components/ExtendedPicker/index.ts         |  2 +-
 .../FloatingPicker/BaseFloatingPicker.tsx          |  2 +-
 ...Picker.Props.ts => BaseFloatingPicker.types.ts} |  0
 .../PeoplePicker/FloatingPeoplePicker.tsx          |  2 +-
 .../PeoplePicker/FloatingPeoplePickerPage.tsx      |  2 +-
 .../FloatingPeoplePicker.Basic.Example.tsx         |  4 ++--
 .../src/components/FloatingPicker/index.ts         |  2 +-
 .../src/components/FolderCover/FolderCover.tsx     |  2 +-
 .../{FolderCover.Props.ts => FolderCover.types.ts} |  0
 .../src/components/FolderCover/FolderCoverPage.tsx |  2 +-
 .../examples/FolderCover.Basic.Example.tsx         |  2 +-
 .../src/components/FolderCover/index.ts            |  2 +-
 .../experiments/src/components/Form/Form.test.tsx  |  4 ++--
 packages/experiments/src/components/Form/Form.tsx  |  2 +-
 .../Form/{Form.Props.ts => Form.types.ts}          |  0
 .../src/components/Form/FormBaseInput.ts           |  2 +-
 ...rmBaseInput.Props.ts => FormBaseInput.types.ts} |  0
 .../experiments/src/components/Form/FormPage.tsx   |  4 ++--
 packages/experiments/src/components/Form/index.ts  | 14 +++++++-------
 .../Form/inputs/checkbox/FormCheckBox.tsx          |  2 +-
 ...FormCheckBox.Props.ts => FormCheckBox.types.ts} |  0
 .../FormConditionalSubmitButton.tsx                |  2 +-
 ...ops.ts => FormConditionalSubmitButton.types.ts} |  0
 .../Form/inputs/datePicker/FormDatePicker.tsx      |  2 +-
 ...DatePicker.Props.ts => FormDatePicker.types.ts} |  0
 .../Form/inputs/dropdown/FormDropdown.tsx          |  2 +-
 ...FormDropdown.Props.ts => FormDropdown.types.ts} |  0
 .../Form/inputs/textInput/FormTextInput.test.tsx   |  4 ++--
 .../Form/inputs/textInput/FormTextInput.tsx        |  2 +-
 ...rmTextInput.Props.ts => FormTextInput.types.ts} |  0
 .../src/components/LayoutGroup/LayoutGroup.tsx     |  2 +-
 .../{LayoutGroup.props.ts => LayoutGroup.types.ts} |  0
 .../src/components/LayoutGroup/index.ts            |  2 +-
 .../SelectedItemsList/BaseSelectedItemsList.tsx    |  2 +-
 ...ist.Props.ts => BaseSelectedItemsList.types.ts} |  0
 .../SelectedPeopleList/SelectedPeopleList.tsx      |  2 +-
 .../examples/SelectedPeopleList.Basic.Example.tsx  |  2 +-
 .../src/components/SelectedItemsList/index.ts      |  2 +-
 packages/experiments/src/components/Tile/Tile.tsx  |  2 +-
 .../Tile/{Tile.Props.ts => Tile.types.ts}          |  0
 .../experiments/src/components/Tile/TilePage.tsx   |  2 +-
 .../Tile/examples/Tile.Folder.Example.tsx          |  2 +-
 packages/experiments/src/components/Tile/index.ts  |  2 +-
 .../src/components/TilesList/TilesList.tsx         |  2 +-
 .../{TilesList.Props.ts => TilesList.types.ts}     |  0
 .../src/components/TilesList/TilesListPage.tsx     |  2 +-
 .../TilesList/examples/ExampleHelpers.tsx          |  2 +-
 .../experiments/src/components/TilesList/index.ts  |  2 +-
 packages/office-ui-fabric-react/.npmignore         |  2 +-
 .../office-ui-fabric-react/src/MarqueeSelection.ts |  2 +-
 packages/office-ui-fabric-react/src/PersonaCoin.ts |  2 +-
 .../ActivityItem/ActivityItem.classNames.ts        |  2 +-
 .../components/ActivityItem/ActivityItem.styles.ts |  2 +-
 .../src/components/ActivityItem/ActivityItem.tsx   |  2 +-
 ...ActivityItem.Props.ts => ActivityItem.types.ts} |  0
 .../components/ActivityItem/ActivityItemPage.tsx   |  2 +-
 .../src/components/ActivityItem/index.ts           |  2 +-
 .../components/Breadcrumb/Breadcrumb.checklist.ts  |  2 +-
 .../src/components/Breadcrumb/Breadcrumb.test.tsx  |  2 +-
 .../src/components/Breadcrumb/Breadcrumb.tsx       |  2 +-
 .../{Breadcrumb.Props.ts => Breadcrumb.types.ts}   |  0
 .../src/components/Breadcrumb/BreadcrumbPage.tsx   |  2 +-
 .../src/components/Breadcrumb/index.ts             |  2 +-
 .../Button/ActionButton/ActionButton.styles.ts     |  2 +-
 .../Button/ActionButton/ActionButton.tsx           |  2 +-
 .../src/components/Button/BaseButton.classNames.ts |  2 +-
 .../src/components/Button/BaseButton.styles.ts     |  2 +-
 .../src/components/Button/BaseButton.tsx           |  2 +-
 .../src/components/Button/Button.checklist.ts      |  2 +-
 .../src/components/Button/Button.tsx               |  2 +-
 .../Button/{Button.Props.ts => Button.types.ts}    |  0
 .../src/components/Button/ButtonPage.tsx           |  2 +-
 .../src/components/Button/ButtonThemes.ts          |  2 +-
 .../CommandBarButton/CommandBarButton.styles.ts    |  2 +-
 .../Button/CommandBarButton/CommandBarButton.tsx   |  2 +-
 .../Button/CompoundButton/CompoundButton.styles.ts |  2 +-
 .../Button/CompoundButton/CompoundButton.tsx       |  2 +-
 .../Button/DefaultButton/DefaultButton.styles.ts   |  2 +-
 .../Button/DefaultButton/DefaultButton.tsx         |  2 +-
 .../Button/IconButton/IconButton.styles.ts         |  2 +-
 .../components/Button/IconButton/IconButton.tsx    |  2 +-
 .../MessageBarButton/MessageBarButton.styles.ts    |  2 +-
 .../Button/MessageBarButton/MessageBarButton.tsx   |  2 +-
 .../Button/PrimaryButton/PrimaryButton.tsx         |  2 +-
 .../Button/SplitButton/SplitButton.classNames.ts   |  2 +-
 .../Button/SplitButton/SplitButton.styles.ts       |  2 +-
 .../src/components/Button/index.ts                 |  2 +-
 .../src/components/Calendar/Calendar.checklist.ts  |  2 +-
 .../src/components/Calendar/Calendar.test.tsx      |  2 +-
 .../src/components/Calendar/Calendar.tsx           |  2 +-
 .../{Calendar.Props.ts => Calendar.types.ts}       |  0
 .../src/components/Calendar/CalendarDay.tsx        |  2 +-
 .../src/components/Calendar/CalendarMonth.tsx      |  2 +-
 .../src/components/Calendar/CalendarPage.tsx       |  2 +-
 .../src/components/Calendar/index.ts               |  2 +-
 .../src/components/Callout/Callout.checklist.ts    |  2 +-
 .../src/components/Callout/Callout.tsx             |  2 +-
 .../Callout/{Callout.Props.ts => Callout.types.ts} |  0
 .../src/components/Callout/CalloutContent.tsx      |  2 +-
 .../src/components/Callout/CalloutPage.tsx         |  2 +-
 .../src/components/Callout/index.ts                |  2 +-
 .../src/components/Checkbox/Checkbox.checklist.ts  |  2 +-
 .../src/components/Checkbox/Checkbox.classNames.ts |  2 +-
 .../src/components/Checkbox/Checkbox.styles.ts     |  2 +-
 .../src/components/Checkbox/Checkbox.tsx           |  2 +-
 .../{Checkbox.Props.ts => Checkbox.types.ts}       |  2 +-
 .../src/components/Checkbox/CheckboxPage.tsx       |  2 +-
 .../src/components/Checkbox/index.ts               |  2 +-
 .../ChoiceGroup/ChoiceGroup.checklist.ts           |  2 +-
 .../components/ChoiceGroup/ChoiceGroup.test.tsx    |  2 +-
 .../src/components/ChoiceGroup/ChoiceGroup.tsx     |  2 +-
 .../{ChoiceGroup.Props.ts => ChoiceGroup.types.ts} |  0
 .../src/components/ChoiceGroup/ChoiceGroupPage.tsx |  2 +-
 .../src/components/ChoiceGroup/index.ts            |  2 +-
 .../ColorPicker/ColorPicker.checklist.ts           |  2 +-
 .../src/components/ColorPicker/ColorPicker.tsx     |  2 +-
 .../{ColorPicker.Props.ts => ColorPicker.types.ts} |  0
 .../src/components/ColorPicker/ColorPickerPage.tsx |  2 +-
 .../src/components/ColorPicker/index.ts            |  2 +-
 .../src/components/ComboBox/ComboBox.checklist.ts  |  2 +-
 .../src/components/ComboBox/ComboBox.classNames.ts |  2 +-
 .../src/components/ComboBox/ComboBox.styles.ts     |  2 +-
 .../src/components/ComboBox/ComboBox.test.tsx      |  2 +-
 .../src/components/ComboBox/ComboBox.tsx           |  4 ++--
 .../{ComboBox.Props.ts => ComboBox.types.ts}       |  4 ++--
 .../src/components/ComboBox/ComboBoxPage.tsx       |  2 +-
 .../components/ComboBox/VirtualizedComboBox.tsx    |  4 ++--
 .../ComboBox/examples/ComboBox.Basic.Example.tsx   |  2 +-
 .../src/components/ComboBox/index.ts               |  4 ++--
 .../components/CommandBar/CommandBar.checklist.ts  |  2 +-
 .../src/components/CommandBar/CommandBar.test.tsx  |  2 +-
 .../src/components/CommandBar/CommandBar.tsx       |  2 +-
 .../{CommandBar.Props.ts => CommandBar.types.ts}   |  0
 .../src/components/CommandBar/CommandBarPage.tsx   |  4 ++--
 .../src/components/CommandBar/index.ts             |  2 +-
 .../ContextualMenu/ContextualMenu.checklist.ts     |  2 +-
 .../ContextualMenu/ContextualMenu.classNames.ts    |  4 ++--
 .../ContextualMenu/ContextualMenu.styles.ts        |  2 +-
 .../ContextualMenu/ContextualMenu.test.tsx         |  2 +-
 .../components/ContextualMenu/ContextualMenu.tsx   |  2 +-
 ...extualMenu.Props.ts => ContextualMenu.types.ts} |  4 ++--
 .../ContextualMenu/ContextualMenuPage.tsx          |  4 ++--
 .../src/components/ContextualMenu/index.ts         |  2 +-
 .../components/DatePicker/DatePicker.checklist.ts  |  2 +-
 .../src/components/DatePicker/DatePicker.test.tsx  |  2 +-
 .../src/components/DatePicker/DatePicker.tsx       |  2 +-
 .../{DatePicker.Props.ts => DatePicker.types.ts}   |  2 +-
 .../src/components/DatePicker/DatePickerPage.tsx   |  2 +-
 .../src/components/DatePicker/index.ts             |  4 ++--
 .../src/components/DetailsList/DetailsHeader.tsx   |  2 +-
 .../DetailsList/DetailsList.checklist.ts           |  2 +-
 .../src/components/DetailsList/DetailsList.tsx     |  2 +-
 .../{DetailsList.Props.ts => DetailsList.types.ts} |  0
 .../src/components/DetailsList/DetailsListPage.tsx |  2 +-
 .../src/components/DetailsList/DetailsRow.tsx      |  2 +-
 .../components/DetailsList/DetailsRowFields.tsx    |  2 +-
 .../src/components/DetailsList/index.ts            |  4 ++--
 .../src/components/Dialog/Dialog.checklist.ts      |  2 +-
 .../src/components/Dialog/Dialog.test.tsx          |  2 +-
 .../src/components/Dialog/Dialog.tsx               |  4 ++--
 .../Dialog/{Dialog.Props.ts => Dialog.types.ts}    |  4 ++--
 .../src/components/Dialog/DialogContent.tsx        |  2 +-
 ...alogContent.Props.ts => DialogContent.types.ts} |  2 +-
 .../src/components/Dialog/DialogPage.tsx           |  2 +-
 .../src/components/Dialog/index.ts                 |  4 ++--
 .../src/components/Divider/Divider.checklist.ts    |  2 +-
 .../src/components/Divider/DividerPage.tsx         |  2 +-
 .../Divider/VerticalDivider.classNames.ts          |  2 +-
 .../src/components/Divider/VerticalDivider.tsx     |  2 +-
 ...alDivider.Props.ts => VerticalDivider.types.ts} |  0
 .../src/components/Divider/index.ts                |  2 +-
 .../DocumentCard/DocumentCard.checklist.ts         |  2 +-
 .../src/components/DocumentCard/DocumentCard.tsx   |  2 +-
 ...DocumentCard.Props.ts => DocumentCard.types.ts} |  0
 .../DocumentCard/DocumentCardActions.tsx           |  2 +-
 .../DocumentCard/DocumentCardActivity.tsx          |  2 +-
 .../DocumentCard/DocumentCardLocation.tsx          |  2 +-
 .../components/DocumentCard/DocumentCardPage.tsx   |  2 +-
 .../DocumentCard/DocumentCardPreview.tsx           |  2 +-
 .../components/DocumentCard/DocumentCardTitle.tsx  |  2 +-
 .../src/components/DocumentCard/index.ts           |  2 +-
 .../src/components/Dropdown/Dropdown.checklist.ts  |  2 +-
 .../src/components/Dropdown/Dropdown.test.tsx      |  2 +-
 .../src/components/Dropdown/Dropdown.tsx           |  4 ++--
 .../{Dropdown.Props.ts => Dropdown.types.ts}       |  6 +++---
 .../src/components/Dropdown/DropdownPage.tsx       |  4 ++--
 .../Dropdown/examples/Dropdown.Custom.Example.tsx  |  2 +-
 .../src/components/Dropdown/index.ts               |  2 +-
 .../src/components/Facepile/Facepile.checklist.ts  |  2 +-
 .../src/components/Facepile/Facepile.test.tsx      |  2 +-
 .../src/components/Facepile/Facepile.tsx           |  2 +-
 .../{Facepile.Props.ts => Facepile.types.ts}       |  0
 .../src/components/Facepile/FacepilePage.tsx       |  2 +-
 .../src/components/Facepile/index.ts               |  2 +-
 .../src/components/FocusTrapZone/FocusTrapZone.tsx |  2 +-
 ...cusTrapZone.Props.ts => FocusTrapZone.types.ts} |  0
 .../components/FocusTrapZone/FocusTrapZonePage.tsx |  2 +-
 .../src/components/FocusTrapZone/index.ts          |  2 +-
 .../src/components/FocusZone/FocusZone.test.tsx    |  2 +-
 .../src/components/FocusZone/FocusZone.tsx         |  2 +-
 .../{FocusZone.Props.ts => FocusZone.types.ts}     |  0
 .../src/components/FocusZone/FocusZonePage.tsx     |  2 +-
 .../src/components/FocusZone/index.ts              |  2 +-
 .../src/components/GroupedList/GroupFooter.tsx     |  2 +-
 .../src/components/GroupedList/GroupHeader.tsx     |  2 +-
 .../src/components/GroupedList/GroupShowAll.tsx    |  2 +-
 .../GroupedList/GroupedList.checklist.ts           |  2 +-
 .../src/components/GroupedList/GroupedList.tsx     |  2 +-
 .../{GroupedList.Props.ts => GroupedList.types.ts} |  0
 .../src/components/GroupedList/GroupedListPage.tsx |  2 +-
 .../components/GroupedList/GroupedListSection.tsx  |  2 +-
 .../src/components/GroupedList/index.ts            |  2 +-
 .../components/HoverCard/ExpandingCard.styles.ts   |  2 +-
 .../src/components/HoverCard/ExpandingCard.tsx     |  2 +-
 ...pandingCard.Props.ts => ExpandingCard.types.ts} |  0
 .../components/HoverCard/HoverCard.checklist.ts    |  2 +-
 .../src/components/HoverCard/HoverCard.styles.ts   |  2 +-
 .../src/components/HoverCard/HoverCard.tsx         |  4 ++--
 .../{HoverCard.Props.ts => HoverCard.types.ts}     |  2 +-
 .../src/components/HoverCard/HoverCardPage.tsx     |  4 ++--
 .../src/components/HoverCard/index.ts              |  4 ++--
 .../src/components/Icon/Icon.checklist.ts          |  2 +-
 .../src/components/Icon/Icon.classNames.ts         |  2 +-
 .../src/components/Icon/Icon.tsx                   |  2 +-
 .../Icon/{Icon.Props.ts => Icon.types.ts}          |  2 +-
 .../src/components/Icon/IconPage.tsx               |  2 +-
 .../src/components/Icon/index.ts                   |  2 +-
 .../src/components/Image/Image.checklist.ts        |  2 +-
 .../src/components/Image/Image.test.tsx            |  2 +-
 .../src/components/Image/Image.tsx                 |  2 +-
 .../Image/{Image.Props.ts => Image.types.ts}       |  0
 .../src/components/Image/ImagePage.tsx             |  2 +-
 .../src/components/Image/index.ts                  |  2 +-
 .../src/components/Label/Label.checklist.ts        |  2 +-
 .../src/components/Label/Label.tsx                 |  2 +-
 .../Label/{Label.Props.ts => Label.types.ts}       |  0
 .../src/components/Label/LabelPage.tsx             |  2 +-
 .../src/components/Label/index.ts                  |  2 +-
 .../src/components/Layer/Layer.checklist.ts        |  2 +-
 .../src/components/Layer/Layer.tsx                 |  2 +-
 .../Layer/{Layer.Props.ts => Layer.types.ts}       |  0
 .../src/components/Layer/LayerHost.tsx             |  2 +-
 .../{LayerHost.Props.ts => LayerHost.types.ts}     |  0
 .../src/components/Layer/LayerPage.tsx             |  2 +-
 .../src/components/Layer/index.ts                  |  2 +-
 .../src/components/Link/Link.checklist.ts          |  2 +-
 .../src/components/Link/Link.tsx                   |  2 +-
 .../Link/{Link.Props.ts => Link.types.ts}          |  0
 .../src/components/Link/LinkPage.tsx               |  2 +-
 .../src/components/Link/index.ts                   |  2 +-
 .../src/components/List/List.checklist.ts          |  2 +-
 .../src/components/List/List.tsx                   |  2 +-
 .../List/{List.Props.ts => List.types.ts}          |  0
 .../src/components/List/ListPage.tsx               |  2 +-
 .../src/components/List/index.ts                   |  2 +-
 .../MarqueeSelection/MarqueeSelection.tsx          |  2 +-
 ...election.Props.ts => MarqueeSelection.types.ts} |  0
 .../components/MessageBar/MessageBar.checklist.ts  |  2 +-
 .../src/components/MessageBar/MessageBar.tsx       |  2 +-
 .../{MessageBar.Props.ts => MessageBar.types.ts}   |  0
 .../src/components/MessageBar/MessageBarPage.tsx   |  2 +-
 .../src/components/MessageBar/index.ts             |  2 +-
 .../src/components/Modal/Modal.checklist.ts        |  2 +-
 .../src/components/Modal/Modal.tsx                 |  2 +-
 .../Modal/{Modal.Props.ts => Modal.types.ts}       |  0
 .../src/components/Modal/ModalPage.tsx             |  2 +-
 .../src/components/Modal/index.ts                  |  2 +-
 .../src/components/Nav/Nav.checklist.ts            |  2 +-
 .../src/components/Nav/Nav.tsx                     |  2 +-
 .../components/Nav/{Nav.Props.ts => Nav.types.ts}  |  0
 .../src/components/Nav/NavPage.tsx                 |  2 +-
 .../src/components/Nav/index.ts                    |  2 +-
 .../OverflowSet/OverflowSet.checklist.ts           |  2 +-
 .../src/components/OverflowSet/OverflowSet.tsx     |  2 +-
 .../{OverflowSet.Props.ts => OverflowSet.types.ts} |  0
 .../src/components/OverflowSet/OverflowSetPage.tsx |  2 +-
 .../src/components/OverflowSet/index.ts            |  2 +-
 .../src/components/Overlay/Overlay.checklist.ts    |  2 +-
 .../src/components/Overlay/Overlay.tsx             |  2 +-
 .../Overlay/{Overlay.Props.ts => Overlay.types.ts} |  0
 .../src/components/Overlay/OverlayPage.tsx         |  2 +-
 .../src/components/Overlay/index.ts                |  2 +-
 .../src/components/Panel/Panel.checklist.ts        |  2 +-
 .../src/components/Panel/Panel.tsx                 |  2 +-
 .../Panel/{Panel.Props.ts => Panel.types.ts}       |  0
 .../src/components/Panel/PanelPage.tsx             |  2 +-
 .../src/components/Panel/index.ts                  |  2 +-
 .../src/components/Persona/Persona.checklist.ts    |  2 +-
 .../src/components/Persona/Persona.test.tsx        |  2 +-
 .../src/components/Persona/Persona.tsx             |  2 +-
 .../Persona/{Persona.Props.ts => Persona.types.ts} |  0
 .../src/components/Persona/PersonaCoin.tsx         |  2 +-
 .../src/components/Persona/PersonaConsts.ts        |  2 +-
 .../src/components/Persona/PersonaPage.tsx         |  2 +-
 .../src/components/Persona/PersonaPresence.tsx     |  2 +-
 .../src/components/Persona/index.ts                |  2 +-
 .../src/components/Pivot/Pivot.checklist.ts        |  2 +-
 .../src/components/Pivot/Pivot.tsx                 |  8 ++++----
 .../Pivot/{Pivot.Props.ts => Pivot.types.ts}       |  0
 .../src/components/Pivot/PivotItem.tsx             |  2 +-
 .../{PivotItem.Props.ts => PivotItem.types.ts}     |  0
 .../src/components/Pivot/PivotPage.tsx             |  2 +-
 .../src/components/Pivot/index.ts                  |  4 ++--
 .../src/components/Popup/Popup.tsx                 |  2 +-
 .../Popup/{Popup.Props.ts => Popup.types.ts}       |  0
 .../src/components/Popup/index.ts                  |  2 +-
 .../ProgressIndicator.checklist.ts                 |  2 +-
 .../ProgressIndicator/ProgressIndicator.tsx        |  2 +-
 ...dicator.Props.ts => ProgressIndicator.types.ts} |  0
 .../ProgressIndicator/ProgressIndicatorPage.tsx    |  2 +-
 .../src/components/ProgressIndicator/index.ts      |  2 +-
 .../src/components/Rating/Rating.checklist.ts      |  2 +-
 .../src/components/Rating/Rating.tsx               |  2 +-
 .../Rating/{Rating.Props.ts => Rating.types.ts}    |  0
 .../src/components/Rating/RatingPage.tsx           |  2 +-
 .../src/components/Rating/index.ts                 |  2 +-
 .../ResizeGroup/ResizeGroup.checklist.ts           |  2 +-
 .../components/ResizeGroup/ResizeGroup.test.tsx    |  2 +-
 .../src/components/ResizeGroup/ResizeGroup.tsx     |  2 +-
 .../{ResizeGroup.Props.ts => ResizeGroup.types.ts} |  0
 .../src/components/ResizeGroup/ResizeGroupPage.tsx |  2 +-
 .../src/components/ResizeGroup/index.ts            |  2 +-
 .../ScrollablePane/ScrollablePane.checklist.ts     |  2 +-
 .../components/ScrollablePane/ScrollablePane.tsx   |  2 +-
 ...llablePane.Props.ts => ScrollablePane.types.ts} |  0
 .../ScrollablePane/ScrollablePanePage.tsx          |  2 +-
 .../src/components/ScrollablePane/index.ts         |  2 +-
 .../components/SearchBox/SearchBox.checklist.ts    |  2 +-
 .../src/components/SearchBox/SearchBox.tsx         |  2 +-
 .../{SearchBox.Props.ts => SearchBox.types.ts}     |  0
 .../src/components/SearchBox/SearchBoxPage.tsx     |  2 +-
 .../src/components/SearchBox/index.ts              |  2 +-
 .../src/components/Slider/Slider.checklist.ts      |  2 +-
 .../src/components/Slider/Slider.test.tsx          |  2 +-
 .../src/components/Slider/Slider.tsx               |  2 +-
 .../Slider/{Slider.Props.ts => Slider.types.ts}    |  0
 .../src/components/Slider/SliderPage.tsx           |  2 +-
 .../src/components/Slider/index.ts                 |  2 +-
 .../components/SpinButton/SpinButton.checklist.ts  |  2 +-
 .../components/SpinButton/SpinButton.classNames.ts |  2 +-
 .../src/components/SpinButton/SpinButton.styles.ts |  2 +-
 .../src/components/SpinButton/SpinButton.tsx       |  2 +-
 .../{SpinButton.Props.ts => SpinButton.types.ts}   |  0
 .../src/components/SpinButton/SpinButtonPage.tsx   |  2 +-
 .../src/components/SpinButton/index.ts             |  2 +-
 .../src/components/Spinner/Spinner.checklist.ts    |  2 +-
 .../src/components/Spinner/Spinner.tsx             |  2 +-
 .../Spinner/{Spinner.Props.ts => Spinner.types.ts} |  0
 .../src/components/Spinner/SpinnerPage.tsx         |  2 +-
 .../src/components/Spinner/index.ts                |  2 +-
 .../src/components/Sticky/Sticky.tsx               |  2 +-
 .../Sticky/{Sticky.Props.ts => Sticky.types.ts}    |  0
 .../src/components/Sticky/index.ts                 |  2 +-
 .../SwatchColorPicker.checklist.ts                 |  2 +-
 .../SwatchColorPicker/SwatchColorPicker.test.tsx   |  2 +-
 .../SwatchColorPicker/SwatchColorPicker.tsx        |  4 ++--
 ...rPicker.Props.ts => SwatchColorPicker.types.ts} |  0
 .../SwatchColorPicker/SwatchColorPickerPage.tsx    |  2 +-
 .../src/components/SwatchColorPicker/index.ts      |  2 +-
 .../TeachingBubble/TeachingBubble.checklist.ts     |  2 +-
 .../components/TeachingBubble/TeachingBubble.tsx   |  2 +-
 ...hingBubble.Props.ts => TeachingBubble.types.ts} |  0
 .../TeachingBubble/TeachingBubbleContent.tsx       |  2 +-
 .../TeachingBubble/TeachingBubblePage.tsx          |  2 +-
 .../src/components/TeachingBubble/index.ts         |  2 +-
 .../components/TextField/TextField.checklist.ts    |  2 +-
 .../src/components/TextField/TextField.tsx         |  2 +-
 .../{TextField.Props.ts => TextField.types.ts}     |  0
 .../src/components/TextField/TextFieldPage.tsx     |  2 +-
 .../src/components/TextField/index.ts              |  2 +-
 .../src/components/Toggle/Toggle.checklist.ts      |  2 +-
 .../src/components/Toggle/Toggle.classNames.ts     |  2 +-
 .../src/components/Toggle/Toggle.tsx               |  2 +-
 .../Toggle/{Toggle.Props.ts => Toggle.types.ts}    |  0
 .../src/components/Toggle/TogglePage.tsx           |  2 +-
 .../src/components/Toggle/index.ts                 |  2 +-
 .../src/components/Tooltip/Tooltip.checklist.ts    |  2 +-
 .../src/components/Tooltip/Tooltip.tsx             |  2 +-
 .../Tooltip/{Tooltip.Props.ts => Tooltip.types.ts} |  0
 .../src/components/Tooltip/TooltipHost.tsx         |  4 ++--
 .../{TooltipHost.Props.ts => TooltipHost.types.ts} |  2 +-
 .../src/components/Tooltip/TooltipPage.tsx         |  2 +-
 .../src/components/Tooltip/index.ts                |  4 ++--
 .../components/pickers/AutoFill/BaseAutoFill.tsx   |  2 +-
 ...BaseAutoFill.Props.ts => BaseAutoFill.types.ts} |  0
 .../src/components/pickers/BasePicker.test.tsx     |  4 ++--
 .../src/components/pickers/BasePicker.tsx          |  8 ++++----
 .../{BasePicker.Props.ts => BasePicker.types.ts}   |  4 ++--
 .../pickers/PeoplePicker/PeoplePicker.checklist.ts |  2 +-
 .../pickers/PeoplePicker/PeoplePicker.tsx          |  4 ++--
 ...ckerItem.Props.ts => PeoplePickerItem.types.ts} |  4 ++--
 .../PeoplePickerItems/SelectedItemDefault.tsx      |  4 ++--
 .../PeoplePickerItems/SelectedItemWithMenu.tsx     |  2 +-
 .../pickers/PeoplePicker/PeoplePickerPage.tsx      |  2 +-
 .../examples/PeoplePicker.Types.Example.tsx        |  2 +-
 .../{PickerItem.Props.ts => PickerItem.types.ts}   |  0
 .../src/components/pickers/Pickers.checklist.ts    |  2 +-
 .../src/components/pickers/PickersPage.tsx         |  2 +-
 .../components/pickers/Suggestions/Suggestions.tsx |  2 +-
 .../{Suggestions.Props.ts => Suggestions.types.ts} |  2 +-
 .../src/components/pickers/TagPicker/TagItem.tsx   |  2 +-
 .../src/components/pickers/TagPicker/TagPicker.tsx |  4 ++--
 .../src/components/pickers/index.ts                |  8 ++++----
 .../ComponentStatus/AllComponents.checklist.ts     |  2 +-
 .../src/demo/ComponentStatus/ComponentStatus.tsx   |  2 +-
 ...entStatus.Props.ts => ComponentStatus.types.ts} |  0
 .../src/utilities/grid/Grid.tsx                    |  2 +-
 .../grid/{Grid.Props.ts => Grid.types.ts}          |  0
 .../src/utilities/grid/GridCell.tsx                |  2 +-
 .../grid/{GridCell.Props.ts => GridCell.types.ts}  |  0
 .../src/utilities/grid/index.ts                    |  4 ++--
 ...t.Props.ts => SelectableDroppableText.types.ts} |  2 +-
 ...leOption.Props.ts => SelectableOption.types.ts} |  0
 .../src/utilities/selectableOption/index.ts        |  4 ++--
 scripts/create-component.js                        |  2 +-
 scripts/templates/EmptyComponent.mustache          |  2 +-
 scripts/templates/EmptyComponentIndex.mustache     |  2 +-
 445 files changed, 523 insertions(+), 424 deletions(-)
 rename apps/fabric-website/src/components/Nav/{Nav.Props.ts => Nav.types.ts} (100%)
 create mode 100644 common/changes/@uifabric/example-app-base/rename-props_2017-11-11-20-23.json
 create mode 100644 common/changes/@uifabric/experiments/rename-props_2017-11-11-20-23.json
 create mode 100644 common/changes/@uifabric/fabric-website/rename-props_2017-11-11-20-23.json
 create mode 100644 common/changes/@uifabric/icons/rename-props_2017-11-11-20-23.json
 create mode 100644 common/changes/@uifabric/jest-serializer-merge-styles/rename-props_2017-11-11-20-23.json
 create mode 100644 common/changes/@uifabric/merge-styles/rename-props_2017-11-11-20-23.json
 create mode 100644 common/changes/@uifabric/styling/rename-props_2017-11-11-20-23.json
 create mode 100644 common/changes/@uifabric/utilities/rename-props_2017-11-11-20-23.json
 create mode 100644 common/changes/office-ui-fabric-react/rename-props_2017-11-11-20-23.json
 rename packages/example-app-base/src/components/PropertiesTable/{PropertiesTableSet.Props.ts => PropertiesTableSet.types.ts} (88%)
 rename packages/experiments/src/components/CommandBar/{CommandBar.Props.ts => CommandBar.types.ts} (100%)
 rename packages/experiments/src/components/ExtendedPicker/{BaseExtendedPicker.Props.ts => BaseExtendedPicker.types.ts} (100%)
 rename packages/experiments/src/components/FloatingPicker/{BaseFloatingPicker.Props.ts => BaseFloatingPicker.types.ts} (100%)
 rename packages/experiments/src/components/FolderCover/{FolderCover.Props.ts => FolderCover.types.ts} (100%)
 rename packages/experiments/src/components/Form/{Form.Props.ts => Form.types.ts} (100%)
 rename packages/experiments/src/components/Form/{FormBaseInput.Props.ts => FormBaseInput.types.ts} (100%)
 rename packages/experiments/src/components/Form/inputs/checkbox/{FormCheckBox.Props.ts => FormCheckBox.types.ts} (100%)
 rename packages/experiments/src/components/Form/inputs/conditionalSubmit/{FormConditionalSubmitButton.Props.ts => FormConditionalSubmitButton.types.ts} (100%)
 rename packages/experiments/src/components/Form/inputs/datePicker/{FormDatePicker.Props.ts => FormDatePicker.types.ts} (100%)
 rename packages/experiments/src/components/Form/inputs/dropdown/{FormDropdown.Props.ts => FormDropdown.types.ts} (100%)
 rename packages/experiments/src/components/Form/inputs/textInput/{FormTextInput.Props.ts => FormTextInput.types.ts} (100%)
 rename packages/experiments/src/components/LayoutGroup/{LayoutGroup.props.ts => LayoutGroup.types.ts} (100%)
 rename packages/experiments/src/components/SelectedItemsList/{BaseSelectedItemsList.Props.ts => BaseSelectedItemsList.types.ts} (100%)
 rename packages/experiments/src/components/Tile/{Tile.Props.ts => Tile.types.ts} (100%)
 rename packages/experiments/src/components/TilesList/{TilesList.Props.ts => TilesList.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/ActivityItem/{ActivityItem.Props.ts => ActivityItem.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Breadcrumb/{Breadcrumb.Props.ts => Breadcrumb.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Button/{Button.Props.ts => Button.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Calendar/{Calendar.Props.ts => Calendar.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Callout/{Callout.Props.ts => Callout.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Checkbox/{Checkbox.Props.ts => Checkbox.types.ts} (99%)
 rename packages/office-ui-fabric-react/src/components/ChoiceGroup/{ChoiceGroup.Props.ts => ChoiceGroup.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/ColorPicker/{ColorPicker.Props.ts => ColorPicker.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/ComboBox/{ComboBox.Props.ts => ComboBox.types.ts} (95%)
 rename packages/office-ui-fabric-react/src/components/CommandBar/{CommandBar.Props.ts => CommandBar.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/ContextualMenu/{ContextualMenu.Props.ts => ContextualMenu.types.ts} (99%)
 rename packages/office-ui-fabric-react/src/components/DatePicker/{DatePicker.Props.ts => DatePicker.types.ts} (99%)
 rename packages/office-ui-fabric-react/src/components/DetailsList/{DetailsList.Props.ts => DetailsList.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Dialog/{Dialog.Props.ts => Dialog.types.ts} (98%)
 rename packages/office-ui-fabric-react/src/components/Dialog/{DialogContent.Props.ts => DialogContent.types.ts} (97%)
 rename packages/office-ui-fabric-react/src/components/Divider/{VerticalDivider.Props.ts => VerticalDivider.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/DocumentCard/{DocumentCard.Props.ts => DocumentCard.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Dropdown/{Dropdown.Props.ts => Dropdown.types.ts} (90%)
 rename packages/office-ui-fabric-react/src/components/Facepile/{Facepile.Props.ts => Facepile.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/FocusTrapZone/{FocusTrapZone.Props.ts => FocusTrapZone.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/FocusZone/{FocusZone.Props.ts => FocusZone.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/GroupedList/{GroupedList.Props.ts => GroupedList.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/HoverCard/{ExpandingCard.Props.ts => ExpandingCard.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/HoverCard/{HoverCard.Props.ts => HoverCard.types.ts} (97%)
 rename packages/office-ui-fabric-react/src/components/Icon/{Icon.Props.ts => Icon.types.ts} (96%)
 rename packages/office-ui-fabric-react/src/components/Image/{Image.Props.ts => Image.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Label/{Label.Props.ts => Label.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Layer/{Layer.Props.ts => Layer.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Layer/{LayerHost.Props.ts => LayerHost.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Link/{Link.Props.ts => Link.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/List/{List.Props.ts => List.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/MarqueeSelection/{MarqueeSelection.Props.ts => MarqueeSelection.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/MessageBar/{MessageBar.Props.ts => MessageBar.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Modal/{Modal.Props.ts => Modal.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Nav/{Nav.Props.ts => Nav.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/OverflowSet/{OverflowSet.Props.ts => OverflowSet.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Overlay/{Overlay.Props.ts => Overlay.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Panel/{Panel.Props.ts => Panel.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Persona/{Persona.Props.ts => Persona.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Pivot/{Pivot.Props.ts => Pivot.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Pivot/{PivotItem.Props.ts => PivotItem.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Popup/{Popup.Props.ts => Popup.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/ProgressIndicator/{ProgressIndicator.Props.ts => ProgressIndicator.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Rating/{Rating.Props.ts => Rating.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/ResizeGroup/{ResizeGroup.Props.ts => ResizeGroup.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/ScrollablePane/{ScrollablePane.Props.ts => ScrollablePane.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/SearchBox/{SearchBox.Props.ts => SearchBox.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Slider/{Slider.Props.ts => Slider.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/SpinButton/{SpinButton.Props.ts => SpinButton.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Spinner/{Spinner.Props.ts => Spinner.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Sticky/{Sticky.Props.ts => Sticky.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/SwatchColorPicker/{SwatchColorPicker.Props.ts => SwatchColorPicker.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/TeachingBubble/{TeachingBubble.Props.ts => TeachingBubble.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/TextField/{TextField.Props.ts => TextField.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Toggle/{Toggle.Props.ts => Toggle.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Tooltip/{Tooltip.Props.ts => Tooltip.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/Tooltip/{TooltipHost.Props.ts => TooltipHost.types.ts} (97%)
 rename packages/office-ui-fabric-react/src/components/pickers/AutoFill/{BaseAutoFill.Props.ts => BaseAutoFill.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/pickers/{BasePicker.Props.ts => BasePicker.types.ts} (98%)
 rename packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/{PeoplePickerItem.Props.ts => PeoplePickerItem.types.ts} (79%)
 rename packages/office-ui-fabric-react/src/components/pickers/{PickerItem.Props.ts => PickerItem.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/components/pickers/Suggestions/{Suggestions.Props.ts => Suggestions.types.ts} (98%)
 rename packages/office-ui-fabric-react/src/demo/ComponentStatus/{ComponentStatus.Props.ts => ComponentStatus.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/utilities/grid/{Grid.Props.ts => Grid.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/utilities/grid/{GridCell.Props.ts => GridCell.types.ts} (100%)
 rename packages/office-ui-fabric-react/src/utilities/selectableOption/{SelectableDroppableText.Props.ts => SelectableDroppableText.types.ts} (95%)
 rename packages/office-ui-fabric-react/src/utilities/selectableOption/{SelectableOption.Props.ts => SelectableOption.types.ts} (100%)

diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index 2965ff3ddc627..92919bede73a1 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -12,7 +12,7 @@
 2. Create a new folder here with your component name
   * Our components use the Pascal Case naming convention.
   * In this example the component will be called `ExcitingNewComponent`.
-3. Create a `ExcitingNewComponent.Props.ts` file that will contain an interface for your props
+3. Create a `ExcitingNewComponent.types.ts` file that will contain an interface for your props
   * Import React
     * `import * as React from 'react'`;
   * Import ExcitingNewComponent
@@ -37,7 +37,7 @@
   * Import BaseComponent
     * `import { BaseComponent } from '../../Utilities';`
   * Import IExcitingNewComponentProps
-    * `import { IExcitingNewComponentProps } from './ExcitingNewComponent.Props';`
+    * `import { IExcitingNewComponentProps } from './ExcitingNewComponent.types';`
   * Add your class to this file.
     * Add the following example class
     * `export class ExcitingNewComponent extends BaseComponent<IExcitingNewComponentProps, {}> { };`
@@ -47,7 +47,7 @@
   * Import mergeStyles.
     * `import { mergeStyleSets } from '../../Styling';`
   * Import ExcitingNewComponent.
-    * `import { IExcitingNewComponentStyles } from './ExcitingNewComponent.Props';`
+    * `import { IExcitingNewComponentStyles } from './ExcitingNewComponent.types';`
   * Create and export an interface for your class names.
 ```
     export interface IExcitingNewComponentClassNames {
diff --git a/apps/fabric-website/src/components/App/AppState.tsx b/apps/fabric-website/src/components/App/AppState.tsx
index 53edfaf4daa8a..daae986e4ab63 100644
--- a/apps/fabric-website/src/components/App/AppState.tsx
+++ b/apps/fabric-website/src/components/App/AppState.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 
 // Props
-import { INavPage } from '../Nav/Nav.Props';
+import { INavPage } from '../Nav/Nav.types';
 import { ComponentPage } from '../ComponentPage/ComponentPage';
 import { PageHeader } from '../PageHeader/PageHeader';
 
diff --git a/apps/fabric-website/src/components/Nav/Nav.tsx b/apps/fabric-website/src/components/Nav/Nav.tsx
index c90ee4e817034..0844cd7b62a74 100644
--- a/apps/fabric-website/src/components/Nav/Nav.tsx
+++ b/apps/fabric-website/src/components/Nav/Nav.tsx
@@ -5,7 +5,7 @@ const styles: any = stylesImport;
 import {
   INavProps,
   INavPage
-} from './Nav.Props';
+} from './Nav.types';
 
 export interface INavState {
 }
diff --git a/apps/fabric-website/src/components/Nav/Nav.Props.ts b/apps/fabric-website/src/components/Nav/Nav.types.ts
similarity index 100%
rename from apps/fabric-website/src/components/Nav/Nav.Props.ts
rename to apps/fabric-website/src/components/Nav/Nav.types.ts
diff --git a/common/changes/@uifabric/example-app-base/rename-props_2017-11-11-20-23.json b/common/changes/@uifabric/example-app-base/rename-props_2017-11-11-20-23.json
new file mode 100644
index 0000000000000..cde5b3e29d95c
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/rename-props_2017-11-11-20-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/rename-props_2017-11-11-20-23.json b/common/changes/@uifabric/experiments/rename-props_2017-11-11-20-23.json
new file mode 100644
index 0000000000000..2098be827ee86
--- /dev/null
+++ b/common/changes/@uifabric/experiments/rename-props_2017-11-11-20-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/experiments",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/rename-props_2017-11-11-20-23.json b/common/changes/@uifabric/fabric-website/rename-props_2017-11-11-20-23.json
new file mode 100644
index 0000000000000..119379ee8c0a8
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/rename-props_2017-11-11-20-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/rename-props_2017-11-11-20-23.json b/common/changes/@uifabric/icons/rename-props_2017-11-11-20-23.json
new file mode 100644
index 0000000000000..978b6bba1e8ee
--- /dev/null
+++ b/common/changes/@uifabric/icons/rename-props_2017-11-11-20-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/icons",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/icons",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/jest-serializer-merge-styles/rename-props_2017-11-11-20-23.json b/common/changes/@uifabric/jest-serializer-merge-styles/rename-props_2017-11-11-20-23.json
new file mode 100644
index 0000000000000..8ca592e81d622
--- /dev/null
+++ b/common/changes/@uifabric/jest-serializer-merge-styles/rename-props_2017-11-11-20-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/jest-serializer-merge-styles",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/jest-serializer-merge-styles",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/rename-props_2017-11-11-20-23.json b/common/changes/@uifabric/merge-styles/rename-props_2017-11-11-20-23.json
new file mode 100644
index 0000000000000..571bd175f3813
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/rename-props_2017-11-11-20-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/merge-styles",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/rename-props_2017-11-11-20-23.json b/common/changes/@uifabric/styling/rename-props_2017-11-11-20-23.json
new file mode 100644
index 0000000000000..f6d55bf7f71ba
--- /dev/null
+++ b/common/changes/@uifabric/styling/rename-props_2017-11-11-20-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/rename-props_2017-11-11-20-23.json b/common/changes/@uifabric/utilities/rename-props_2017-11-11-20-23.json
new file mode 100644
index 0000000000000..dd57bd067a20d
--- /dev/null
+++ b/common/changes/@uifabric/utilities/rename-props_2017-11-11-20-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/rename-props_2017-11-11-20-23.json b/common/changes/office-ui-fabric-react/rename-props_2017-11-11-20-23.json
new file mode 100644
index 0000000000000..bdac204cd2e2e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/rename-props_2017-11-11-20-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "office-ui-fabric-react",
+      "type": "none"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/ghdocs/BESTPRACTICES.md b/ghdocs/BESTPRACTICES.md
index 351d8e0451747..bcf01c605c34f 100644
--- a/ghdocs/BESTPRACTICES.md
+++ b/ghdocs/BESTPRACTICES.md
@@ -22,7 +22,7 @@ want a single command bar item with a dropdown menu.
 This is an example where instead of building a single large component, we should build more atomic building blocks that are puzzled
 together. While it may be more effort to think in smaller blocks, it makes the code easier to reuse and often simpler to maintain.
 
-## Use a .Props.ts file to extract out the public contracts that should be supported and documented.
+## Use a .types.ts file to extract out the public contracts that should be supported and documented.
 
 A props file contains all of the interface contracts that the user should know about to use the component. It is the "contract" for the
 component. When we evaluate semversioning, we look through the changes at Props files to determine if the change is a major, minor, or
@@ -43,7 +43,7 @@ interface IButton {
 }
 ```
 
-### Provide explicit return types for methods declared in .Props.ts
+### Provide explicit return types for methods declared in .types.ts
 
 Bad:
 ```typescript
diff --git a/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.tsx b/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.tsx
index b17257086c236..0e13bf699bf9e 100644
--- a/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.tsx
+++ b/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { IProperty, PropertyType } from '../../utilities/parser/index';
 import { PropertiesTable } from './PropertiesTable';
-import { IPropertiesTableSetProps } from './PropertiesTableSet.Props';
+import { IPropertiesTableSetProps } from './PropertiesTableSet.types';
 import { parse } from '../../utilities/parser/index';
 
 export interface IPropertiesTableSetState {
@@ -19,7 +19,7 @@ export class PropertiesTableSet extends React.Component<IPropertiesTableSetProps
       src = '';
       sources.forEach((source: string) => src += source);
     } else if (componentPath && componentName) {
-      src = require(componentPath + componentName + '.Props.ts');
+      src = require(componentPath + componentName + '.types.ts');
     } else {
       throw new Error('PropertiesTableSet was used without source or a componentPath/name');
     }
diff --git a/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.Props.ts b/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.types.ts
similarity index 88%
rename from packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.Props.ts
rename to packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.types.ts
index 976515e28ae6a..0839d5ab9036e 100644
--- a/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.Props.ts
+++ b/packages/example-app-base/src/components/PropertiesTable/PropertiesTableSet.types.ts
@@ -2,7 +2,7 @@
 export interface IPropertiesTableSetProps {
   /**
    * Component name, assumes component resides in /components/[name]/ folder
-   * and properties are at /components/[name]/[name].Props.ts.
+   * and properties are at /components/[name]/[name].types.ts.
    */
   componentName?: string;
 
diff --git a/packages/example-app-base/src/index.ts b/packages/example-app-base/src/index.ts
index c2d2cf3a971f0..9b7a65fa20a8f 100644
--- a/packages/example-app-base/src/index.ts
+++ b/packages/example-app-base/src/index.ts
@@ -7,7 +7,7 @@ export * from './components/Header/Header';
 export * from './components/Highlight/Highlight';
 export * from './components/PropertiesTable/PropertiesTable';
 export * from './components/PropertiesTable/PropertiesTableSet';
-export * from './components/PropertiesTable/PropertiesTableSet.Props';
+export * from './components/PropertiesTable/PropertiesTableSet.types';
 export * from './utilities/beep';
 export * from './utilities/createApp';
 export * from './utilities/data';
diff --git a/packages/experiments/.npmignore b/packages/experiments/.npmignore
index 6c28b2fcf1c04..1ac203702d64d 100644
--- a/packages/experiments/.npmignore
+++ b/packages/experiments/.npmignore
@@ -19,7 +19,7 @@ jsconfig.json
 karma.config.js
 node_modules
 src/**/*
-!src/**/*.Props.ts
+!src/**/*.types.ts
 !src/**/*.Example.tsx
 tsconfig.json
 tsd.json
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.tsx b/packages/experiments/src/components/CommandBar/CommandBar.tsx
index 0d0d70f537b72..08d64e1873c8a 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBar.tsx
@@ -5,7 +5,7 @@ import {
   getId,
   autobind
 } from 'office-ui-fabric-react/lib/Utilities';
-import { ICommandBar, ICommandBarProps, ICommandBarItemProps } from './CommandBar.Props';
+import { ICommandBar, ICommandBarProps, ICommandBarItemProps } from './CommandBar.types';
 import { CommandBarButton } from 'office-ui-fabric-react/lib/Button';
 import { OverflowSet, IOverflowSet } from 'office-ui-fabric-react/lib/OverflowSet';
 import { ResizeGroup } from 'office-ui-fabric-react/lib/ResizeGroup';
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.Props.ts b/packages/experiments/src/components/CommandBar/CommandBar.types.ts
similarity index 100%
rename from packages/experiments/src/components/CommandBar/CommandBar.Props.ts
rename to packages/experiments/src/components/CommandBar/CommandBar.types.ts
diff --git a/packages/experiments/src/components/CommandBar/CommandBarPage.tsx b/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
index 129efa97e7bab..f89be116ffa69 100644
--- a/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
@@ -6,7 +6,7 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { items, overflowItems, farItems } from './examples/data';
-import { ICommandBarProps } from './CommandBar.Props';
+import { ICommandBarProps } from './CommandBar.types';
 import { CommandBarBasicExample } from './examples/CommandBar.Basic.Example';
 
 const CommandBarBasicExampleCode = require(
@@ -31,8 +31,8 @@ export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}>
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/CommandBar/CommandBar.Props.ts'),
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/CommandBar/CommandBar.types.ts'),
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts')
             ] }
           />
         }
diff --git a/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx b/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
index f0813bb0fdb86..c8de2cc7e917a 100644
--- a/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
+++ b/packages/experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { CommandBar } from '../CommandBar';
-import { ICommandBarProps } from './../CommandBar.Props';
+import { ICommandBarProps } from './../CommandBar.types';
 
 export class CommandBarBasicExample extends React.Component<ICommandBarProps, {}> {
 
diff --git a/packages/experiments/src/components/CommandBar/index.ts b/packages/experiments/src/components/CommandBar/index.ts
index 455b306d96bae..824e6fde00673 100644
--- a/packages/experiments/src/components/CommandBar/index.ts
+++ b/packages/experiments/src/components/CommandBar/index.ts
@@ -1,2 +1,2 @@
 export * from './CommandBar';
-export * from './CommandBar.Props';
+export * from './CommandBar.types';
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
index 89a561ddf491b..32fe69f054074 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
@@ -12,7 +12,7 @@ import {
 import { BaseAutoFill } from 'office-ui-fabric-react/lib/components/pickers/AutoFill/BaseAutoFill';
 import { IPickerItemProps, IInputProps } from 'office-ui-fabric-react/lib/Pickers';
 import * as stylesImport from './BaseExtendedPicker.scss';
-import { IBaseExtendedPickerProps, IBaseExtendedPicker } from './BaseExtendedPicker.Props';
+import { IBaseExtendedPickerProps, IBaseExtendedPicker } from './BaseExtendedPicker.types';
 import { IBaseFloatingPickerProps, BaseFloatingPicker } from 'experiments/lib/FloatingPicker';
 import { BaseSelectedItemsList, IBaseSelectedItemsListProps } from 'experiments/lib/SelectedItemsList';
 // tslint:disable-next-line:no-any
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.Props.ts b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts
similarity index 100%
rename from packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.Props.ts
rename to packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.tsx b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.tsx
index c5fb0d567c83d..5bd25febb69e7 100644
--- a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.tsx
@@ -5,7 +5,7 @@ import { IPickerItemProps, ValidationState } from 'office-ui-fabric-react/lib/Pi
 import { IExtendedPersonaProps } from 'experiments/lib/SelectedItemsList';
 import './ExtendedPeoplePicker.scss';
 import { BaseExtendedPicker } from '../BaseExtendedPicker';
-import { IBaseExtendedPickerProps } from '../BaseExtendedPicker.Props';
+import { IBaseExtendedPickerProps } from '../BaseExtendedPicker.types';
 
 export interface IPeoplePickerItemProps extends IPickerItemProps<IExtendedPersonaProps & { ValidationState: ValidationState }> {
 }
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePickerPage.tsx b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePickerPage.tsx
index 8a73607ba5602..7666899525f2f 100644
--- a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePickerPage.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePickerPage.tsx
@@ -27,7 +27,7 @@ export class ExtendedPeoplePickerPage extends React.Component<IComponentDemoPage
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!experiments/src/components/ExtendedPicker/BaseExtendedPicker.Props.ts')
+              require<string>('!raw-loader!experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts')
             ] }
           />
         }
diff --git a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
index 4d803ea769d41..7f83aa43c30a4 100644
--- a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
@@ -10,7 +10,7 @@ import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
 import { IBasePickerSuggestionsProps, ValidationState, SuggestionsController } from 'office-ui-fabric-react/lib/Pickers';
 import { ExtendedPeoplePicker } from '../PeoplePicker/ExtendedPeoplePicker';
 import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
-import { IPersonaWithMenu } from 'office-ui-fabric-react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.Props';
+import { IPersonaWithMenu } from 'office-ui-fabric-react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.types';
 import { people, mru, groupOne, groupTwo } from './PeopleExampleData';
 import './ExtendedPeoplePicker.Basic.Example.scss';
 import { FloatingPeoplePicker, IBaseFloatingPickerProps } from 'experiments/lib/FloatingPicker';
diff --git a/packages/experiments/src/components/ExtendedPicker/index.ts b/packages/experiments/src/components/ExtendedPicker/index.ts
index de5ef8894258b..d5ee7afce13d5 100644
--- a/packages/experiments/src/components/ExtendedPicker/index.ts
+++ b/packages/experiments/src/components/ExtendedPicker/index.ts
@@ -1,4 +1,4 @@
 export * from './BaseExtendedPicker';
-export * from './BaseExtendedPicker.Props';
+export * from './BaseExtendedPicker.types';
 export * from './PeoplePicker/ExtendedPeoplePicker';
 export * from './examples/PeopleExampleData';
\ No newline at end of file
diff --git a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
index 284ce1bba65fe..c2e2a98e6a733 100644
--- a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
+++ b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
@@ -9,7 +9,7 @@ import {
 import { Callout, DirectionalHint } from 'office-ui-fabric-react/lib/Callout';
 import { ValidationState, Suggestions, ISuggestionsProps, SuggestionsController, IBasePickerSuggestionsProps, ISuggestionModel }
   from 'office-ui-fabric-react/lib/Pickers';
-import { IBaseFloatingPicker, IBaseFloatingPickerProps } from './BaseFloatingPicker.Props';
+import { IBaseFloatingPicker, IBaseFloatingPickerProps } from './BaseFloatingPicker.types';
 
 export interface IBaseFloatingPickerState {
   queryString: string;
diff --git a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.Props.ts b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts
similarity index 100%
rename from packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.Props.ts
rename to packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts
diff --git a/packages/experiments/src/components/FloatingPicker/PeoplePicker/FloatingPeoplePicker.tsx b/packages/experiments/src/components/FloatingPicker/PeoplePicker/FloatingPeoplePicker.tsx
index cea56855ed4ee..39bb8945a12fa 100644
--- a/packages/experiments/src/components/FloatingPicker/PeoplePicker/FloatingPeoplePicker.tsx
+++ b/packages/experiments/src/components/FloatingPicker/PeoplePicker/FloatingPeoplePicker.tsx
@@ -1,6 +1,6 @@
 import { getRTL, getInitials } from '../../../Utilities';
 import { BaseFloatingPicker } from '../BaseFloatingPicker';
-import { IBaseFloatingPickerProps } from '../BaseFloatingPicker.Props';
+import { IBaseFloatingPickerProps } from '../BaseFloatingPicker.types';
 import { SuggestionItemNormal } from './PeoplePickerItems/SuggestionItemDefault';
 import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
 import './PeoplePicker.scss';
diff --git a/packages/experiments/src/components/FloatingPicker/PeoplePicker/FloatingPeoplePickerPage.tsx b/packages/experiments/src/components/FloatingPicker/PeoplePicker/FloatingPeoplePickerPage.tsx
index 490af5dd053a2..acd19ba0fa671 100644
--- a/packages/experiments/src/components/FloatingPicker/PeoplePicker/FloatingPeoplePickerPage.tsx
+++ b/packages/experiments/src/components/FloatingPicker/PeoplePicker/FloatingPeoplePickerPage.tsx
@@ -27,7 +27,7 @@ export class FloatingPeoplePickerPage extends React.Component<IComponentDemoPage
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!experiments/src/components/FloatingPicker/BaseFloatingPicker.Props.ts')
+              require<string>('!raw-loader!experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts')
             ] }
           />
         }
diff --git a/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
index 42cea806b2d95..6ffd7e6b0ab19 100644
--- a/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
+++ b/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
@@ -8,9 +8,9 @@ import {
 } from 'office-ui-fabric-react/lib/Utilities';
 import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
 import { IBasePickerSuggestionsProps, ValidationState, SuggestionsController } from 'office-ui-fabric-react/lib/Pickers';
-import { IBaseFloatingPicker } from '../../BaseFloatingPicker.Props';
+import { IBaseFloatingPicker } from '../../BaseFloatingPicker.types';
 import { FloatingPeoplePicker } from '../FloatingPeoplePicker';
-import { IPersonaWithMenu } from 'office-ui-fabric-react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.Props';
+import { IPersonaWithMenu } from 'office-ui-fabric-react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.types';
 import { people, mru } from 'experiments/lib/ExtendedPicker';
 import './FloatingPeoplePicker.Basic.Example.scss';
 import { SearchBox } from 'office-ui-fabric-react/lib/SearchBox';
diff --git a/packages/experiments/src/components/FloatingPicker/index.ts b/packages/experiments/src/components/FloatingPicker/index.ts
index 2cf647d414d70..ccce1d6c37a90 100644
--- a/packages/experiments/src/components/FloatingPicker/index.ts
+++ b/packages/experiments/src/components/FloatingPicker/index.ts
@@ -1,3 +1,3 @@
 export * from './BaseFloatingPicker';
-export * from './BaseFloatingPicker.Props';
+export * from './BaseFloatingPicker.types';
 export * from './PeoplePicker/FloatingPeoplePicker';
\ No newline at end of file
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.tsx b/packages/experiments/src/components/FolderCover/FolderCover.tsx
index 4e83260781684..a6932184cab4c 100644
--- a/packages/experiments/src/components/FolderCover/FolderCover.tsx
+++ b/packages/experiments/src/components/FolderCover/FolderCover.tsx
@@ -1,6 +1,6 @@
 
 import * as React from 'react';
-import { IFolderCoverProps, FolderCoverSize, FolderCoverType } from './FolderCover.Props';
+import { IFolderCoverProps, FolderCoverSize, FolderCoverType } from './FolderCover.types';
 import { ISize, css } from '../../Utilities';
 import * as FolderCoverStylesModule from './FolderCover.scss';
 import * as SignalStylesModule from '../signals/Signals.scss';
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.Props.ts b/packages/experiments/src/components/FolderCover/FolderCover.types.ts
similarity index 100%
rename from packages/experiments/src/components/FolderCover/FolderCover.Props.ts
rename to packages/experiments/src/components/FolderCover/FolderCover.types.ts
diff --git a/packages/experiments/src/components/FolderCover/FolderCoverPage.tsx b/packages/experiments/src/components/FolderCover/FolderCoverPage.tsx
index 383fb75c75b89..f119b8d64f1cd 100644
--- a/packages/experiments/src/components/FolderCover/FolderCoverPage.tsx
+++ b/packages/experiments/src/components/FolderCover/FolderCoverPage.tsx
@@ -26,7 +26,7 @@ export class FolderCoverPage extends React.Component<IComponentDemoPageProps, {}
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!experiments/src/components/FolderCover/FolderCover.Props.ts')
+              require<string>('!raw-loader!experiments/src/components/FolderCover/FolderCover.types.ts')
             ] }
           />
         }
diff --git a/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx b/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx
index 9b3dadb8ea18d..97838a31f1fb3 100644
--- a/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx
+++ b/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx
@@ -1,7 +1,7 @@
 
 import * as React from 'react';
 import { FolderCover, getFolderCoverLayout, renderFolderCoverWithLayout } from '../FolderCover';
-import { IFolderCoverProps } from '../FolderCover.Props';
+import { IFolderCoverProps } from '../FolderCover.types';
 import { ISize, fitContentToBounds } from '../../../Utilities';
 import { SharedSignal } from '../../signals/Signals';
 import { lorem } from '@uifabric/example-app-base';
diff --git a/packages/experiments/src/components/FolderCover/index.ts b/packages/experiments/src/components/FolderCover/index.ts
index 7fc454510d944..e13425e8212f9 100644
--- a/packages/experiments/src/components/FolderCover/index.ts
+++ b/packages/experiments/src/components/FolderCover/index.ts
@@ -1,3 +1,3 @@
 
-export * from './FolderCover.Props';
+export * from './FolderCover.types';
 export * from './FolderCover';
diff --git a/packages/experiments/src/components/Form/Form.test.tsx b/packages/experiments/src/components/Form/Form.test.tsx
index 98a1b00562260..f4dd6c39ae12f 100644
--- a/packages/experiments/src/components/Form/Form.test.tsx
+++ b/packages/experiments/src/components/Form/Form.test.tsx
@@ -6,10 +6,10 @@ import * as sinon from 'sinon';
 
 // Controls
 import { Form } from './Form';
-import { IFormProps } from './Form.Props';
+import { IFormProps } from './Form.types';
 import { DEFAULT_DEBOUNCE } from './FormBaseInput';
 import { FormTextInput } from './inputs/textInput/FormTextInput';
-import { IFormTextInputProps } from './inputs/textInput/FormTextInput.Props';
+import { IFormTextInputProps } from './inputs/textInput/FormTextInput.types';
 import { Validators } from './validators/Validators';
 
 describe('Form', () => {
diff --git a/packages/experiments/src/components/Form/Form.tsx b/packages/experiments/src/components/Form/Form.tsx
index 799b308620f57..ea9b3c8f7badc 100644
--- a/packages/experiments/src/components/Form/Form.tsx
+++ b/packages/experiments/src/components/Form/Form.tsx
@@ -4,7 +4,7 @@ import * as React from 'react';
 import * as PropTypes from 'prop-types';
 
 // Components
-import { IFormProps } from './Form.Props';
+import { IFormProps } from './Form.types';
 import { GenericFormInput } from './FormBaseInput';
 
 // Utilities
diff --git a/packages/experiments/src/components/Form/Form.Props.ts b/packages/experiments/src/components/Form/Form.types.ts
similarity index 100%
rename from packages/experiments/src/components/Form/Form.Props.ts
rename to packages/experiments/src/components/Form/Form.types.ts
diff --git a/packages/experiments/src/components/Form/FormBaseInput.ts b/packages/experiments/src/components/Form/FormBaseInput.ts
index a781b32ff0c34..2a451978c8cee 100644
--- a/packages/experiments/src/components/Form/FormBaseInput.ts
+++ b/packages/experiments/src/components/Form/FormBaseInput.ts
@@ -4,7 +4,7 @@ import * as React from 'react';
 import * as PropTypes from 'prop-types';
 
 import { IFormContext, IFormValidationResult } from './Form';
-import { IFormBaseInputProps } from './FormBaseInput.Props';
+import { IFormBaseInputProps } from './FormBaseInput.types';
 export { IFormBaseInputProps };
 
 // Components
diff --git a/packages/experiments/src/components/Form/FormBaseInput.Props.ts b/packages/experiments/src/components/Form/FormBaseInput.types.ts
similarity index 100%
rename from packages/experiments/src/components/Form/FormBaseInput.Props.ts
rename to packages/experiments/src/components/Form/FormBaseInput.types.ts
diff --git a/packages/experiments/src/components/Form/FormPage.tsx b/packages/experiments/src/components/Form/FormPage.tsx
index 4a7c0c8968225..84ee82c0d4927 100644
--- a/packages/experiments/src/components/Form/FormPage.tsx
+++ b/packages/experiments/src/components/Form/FormPage.tsx
@@ -38,8 +38,8 @@ export class FormPage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!experiments/src/components/Form/Form.Props.ts'),
-              require<string>('!raw-loader!experiments/src/components/Form/FormBaseInput.Props.ts')
+              require<string>('!raw-loader!experiments/src/components/Form/Form.types.ts'),
+              require<string>('!raw-loader!experiments/src/components/Form/FormBaseInput.types.ts')
             ] }
           />
         }
diff --git a/packages/experiments/src/components/Form/index.ts b/packages/experiments/src/components/Form/index.ts
index fa8e3ff7a2b77..4ea6b6f0d2663 100644
--- a/packages/experiments/src/components/Form/index.ts
+++ b/packages/experiments/src/components/Form/index.ts
@@ -1,15 +1,15 @@
 export * from './Form';
-export * from './Form.Props';
+export * from './Form.types';
 export * from './FormBaseInput';
-export * from './FormBaseInput.Props';
+export * from './FormBaseInput.types';
 export * from './inputs/checkbox/FormCheckBox';
-export * from './inputs/checkbox/FormCheckBox.Props';
+export * from './inputs/checkbox/FormCheckBox.types';
 export * from './inputs/conditionalSubmit/FormConditionalSubmitButton';
-export * from './inputs/conditionalSubmit/FormConditionalSubmitButton.Props';
+export * from './inputs/conditionalSubmit/FormConditionalSubmitButton.types';
 export * from './inputs/datePicker/FormDatePicker';
-export * from './inputs/datePicker/FormDatePicker.Props';
+export * from './inputs/datePicker/FormDatePicker.types';
 export * from './inputs/dropdown/FormDropdown';
-export * from './inputs/dropdown/FormDropdown.Props';
+export * from './inputs/dropdown/FormDropdown.types';
 export * from './inputs/textInput/FormTextInput';
-export * from './inputs/textInput/FormTextInput.Props';
+export * from './inputs/textInput/FormTextInput.types';
 export * from './validators/Validators';
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.tsx b/packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.tsx
index 44f2388568c44..8fda99d34b8ee 100644
--- a/packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.tsx
+++ b/packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 
 // Components
 import { Checkbox, ICheckboxProps } from 'office-ui-fabric-react/lib/Checkbox';
-import { IFormCheckBoxProps } from './FormCheckBox.Props';
+import { IFormCheckBoxProps } from './FormCheckBox.types';
 import { FormBaseInput, IFormBaseInputState } from '../../FormBaseInput';
 import { IFormContext } from '../../Form';
 
diff --git a/packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.Props.ts b/packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.types.ts
similarity index 100%
rename from packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.Props.ts
rename to packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.types.ts
diff --git a/packages/experiments/src/components/Form/inputs/conditionalSubmit/FormConditionalSubmitButton.tsx b/packages/experiments/src/components/Form/inputs/conditionalSubmit/FormConditionalSubmitButton.tsx
index c1931aa6178b5..98513b9791815 100644
--- a/packages/experiments/src/components/Form/inputs/conditionalSubmit/FormConditionalSubmitButton.tsx
+++ b/packages/experiments/src/components/Form/inputs/conditionalSubmit/FormConditionalSubmitButton.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import * as PropTypes from 'prop-types';
 
 // Components
-import { IFormConditionalSubmitButtonProps } from './FormConditionalSubmitButton.Props';
+import { IFormConditionalSubmitButtonProps } from './FormConditionalSubmitButton.types';
 import { BaseComponent } from 'office-ui-fabric-react/lib/Utilities';
 import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
 import { IFormContext } from '../../Form';
diff --git a/packages/experiments/src/components/Form/inputs/conditionalSubmit/FormConditionalSubmitButton.Props.ts b/packages/experiments/src/components/Form/inputs/conditionalSubmit/FormConditionalSubmitButton.types.ts
similarity index 100%
rename from packages/experiments/src/components/Form/inputs/conditionalSubmit/FormConditionalSubmitButton.Props.ts
rename to packages/experiments/src/components/Form/inputs/conditionalSubmit/FormConditionalSubmitButton.types.ts
diff --git a/packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.tsx b/packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.tsx
index 0f4a67186e2fa..a130f680a3e59 100644
--- a/packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.tsx
+++ b/packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.tsx
@@ -6,7 +6,7 @@ const DatePickerStyles = DatePickerStylesModule as any;
 import * as React from 'react';
 
 // Components
-import { IFormDatePickerProps } from './FormDatePicker.Props';
+import { IFormDatePickerProps } from './FormDatePicker.types';
 import { DatePicker, IDatePickerProps } from 'office-ui-fabric-react/lib/DatePicker';
 import { Icon } from 'office-ui-fabric-react/lib/Icon';
 import { FormBaseInput, IFormBaseInputState } from '../../FormBaseInput';
diff --git a/packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.Props.ts b/packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.types.ts
similarity index 100%
rename from packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.Props.ts
rename to packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.types.ts
diff --git a/packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.tsx b/packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.tsx
index 7bcf0f92c7d2e..9d18a9edc5943 100644
--- a/packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.tsx
+++ b/packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 
 // Components
-import { IFormDropdownProps } from './FormDropdown.Props';
+import { IFormDropdownProps } from './FormDropdown.types';
 import { Dropdown, IDropdownOption, IDropdownProps } from 'office-ui-fabric-react/lib/Dropdown';
 import { FormBaseInput, IFormBaseInputState } from '../../FormBaseInput';
 import { IFormContext } from '../../Form';
diff --git a/packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.Props.ts b/packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.types.ts
similarity index 100%
rename from packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.Props.ts
rename to packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.types.ts
diff --git a/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.test.tsx b/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.test.tsx
index 675d4abd96b44..8beeb84a76a58 100644
--- a/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.test.tsx
+++ b/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.test.tsx
@@ -6,10 +6,10 @@ import * as sinon from 'sinon';
 
 // Controls
 import { Form } from '../../Form';
-import { IFormProps } from '../../Form.Props';
+import { IFormProps } from '../../Form.types';
 import { DEFAULT_DEBOUNCE } from '../../FormBaseInput';
 import { FormTextInput } from './FormTextInput';
-import { IFormTextInputProps } from './FormTextInput.Props';
+import { IFormTextInputProps } from './FormTextInput.types';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
 
 // Utilities
diff --git a/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.tsx b/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.tsx
index e8c0328035ac5..f9230e3cab7bf 100644
--- a/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.tsx
+++ b/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 
 // Components
-import { IFormTextInputProps } from './FormTextInput.Props';
+import { IFormTextInputProps } from './FormTextInput.types';
 import { FormBaseInput, IFormBaseInputState } from '../../FormBaseInput';
 import { IFormContext } from '../../Form';
 import { TextField, ITextFieldProps } from 'office-ui-fabric-react/lib/TextField';
diff --git a/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.Props.ts b/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.types.ts
similarity index 100%
rename from packages/experiments/src/components/Form/inputs/textInput/FormTextInput.Props.ts
rename to packages/experiments/src/components/Form/inputs/textInput/FormTextInput.types.ts
diff --git a/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx b/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx
index b7f6c1e9b7e25..f2ffe14b5ee9a 100644
--- a/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx
+++ b/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx
@@ -1,6 +1,6 @@
 
 import * as React from 'react';
-import { ILayoutGroupProps } from './LayoutGroup.props';
+import { ILayoutGroupProps } from './LayoutGroup.types';
 import { IRawStyle, mergeStyles } from 'office-ui-fabric-react/lib/Styling';
 import {
   autobind,
diff --git a/packages/experiments/src/components/LayoutGroup/LayoutGroup.props.ts b/packages/experiments/src/components/LayoutGroup/LayoutGroup.types.ts
similarity index 100%
rename from packages/experiments/src/components/LayoutGroup/LayoutGroup.props.ts
rename to packages/experiments/src/components/LayoutGroup/LayoutGroup.types.ts
diff --git a/packages/experiments/src/components/LayoutGroup/index.ts b/packages/experiments/src/components/LayoutGroup/index.ts
index 0da62dab98d62..3fbf64323c47c 100644
--- a/packages/experiments/src/components/LayoutGroup/index.ts
+++ b/packages/experiments/src/components/LayoutGroup/index.ts
@@ -1,3 +1,3 @@
 
-export * from './LayoutGroup.props';
+export * from './LayoutGroup.types';
 export * from './LayoutGroup';
diff --git a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx
index 482a85503c6f1..4c00a2d23164a 100644
--- a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx
@@ -7,7 +7,7 @@ import {
 } from '../../Utilities';
 import { FocusZone, FocusZoneDirection } from 'office-ui-fabric-react/lib/FocusZone';
 import { Selection, SelectionZone, SelectionMode } from 'office-ui-fabric-react/lib/Selection';
-import { IBaseSelectedItemsList, IBaseSelectedItemsListProps, ISelectedItemProps } from './BaseSelectedItemsList.Props';
+import { IBaseSelectedItemsList, IBaseSelectedItemsListProps, ISelectedItemProps } from './BaseSelectedItemsList.types';
 
 export interface IBaseSelectedItemsListState {
   // tslint:disable-next-line:no-any
diff --git a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.Props.ts b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.types.ts
similarity index 100%
rename from packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.Props.ts
rename to packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.types.ts
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
index 201685b58200e..3fd25ed60c77a 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 import { ValidationState } from 'office-ui-fabric-react/lib/Pickers';
 /* tslint:enable */
 import { BaseSelectedItemsList } from '../BaseSelectedItemsList';
-import { IBaseSelectedItemsListProps, ISelectedItemProps } from '../BaseSelectedItemsList.Props';
+import { IBaseSelectedItemsListProps, ISelectedItemProps } from '../BaseSelectedItemsList.types';
 import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
 import { ExtendedSelectedItem } from './Items/ExtendedSelectedItem';
 import { autobind } from '../../../Utilities';
diff --git a/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx b/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
index b9685974786a4..d726d3fd93dda 100644
--- a/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
@@ -8,7 +8,7 @@ import {
 import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
 import { people, groupOne, groupTwo } from 'experiments/lib/ExtendedPicker';
 import 'office-ui-fabric-react/lib/components/Pickers/PeoplePicker/examples/PeoplePicker.Types.Example.scss';
-import { IBaseSelectedItemsListProps } from '../BaseSelectedItemsList.Props';
+import { IBaseSelectedItemsListProps } from '../BaseSelectedItemsList.types';
 import { IExtendedPersonaProps, SelectedPeopleList } from '../SelectedPeopleList/SelectedPeopleList';
 
 export class PeopleSelectedItemsListExample extends BaseComponent<IBaseSelectedItemsListProps<IExtendedPersonaProps>, {}> {
diff --git a/packages/experiments/src/components/SelectedItemsList/index.ts b/packages/experiments/src/components/SelectedItemsList/index.ts
index eafcf21f73735..d89176bdc78f0 100644
--- a/packages/experiments/src/components/SelectedItemsList/index.ts
+++ b/packages/experiments/src/components/SelectedItemsList/index.ts
@@ -1,3 +1,3 @@
-export * from './BaseSelectedItemsList.Props';
+export * from './BaseSelectedItemsList.types';
 export * from './BaseSelectedItemsList';
 export * from './SelectedPeopleList/SelectedPeopleList';
\ No newline at end of file
diff --git a/packages/experiments/src/components/Tile/Tile.tsx b/packages/experiments/src/components/Tile/Tile.tsx
index 0c00518d0b9f0..fbbf7efd68323 100644
--- a/packages/experiments/src/components/Tile/Tile.tsx
+++ b/packages/experiments/src/components/Tile/Tile.tsx
@@ -1,6 +1,6 @@
 
 import * as React from 'react';
-import { ITileProps, TileSize } from './Tile.Props';
+import { ITileProps, TileSize } from './Tile.types';
 import { Check } from 'office-ui-fabric-react/lib/Check';
 import { SELECTION_CHANGE } from 'office-ui-fabric-react/lib/Selection';
 import { ISize, css, BaseComponent, autobind, getId } from '../../Utilities';
diff --git a/packages/experiments/src/components/Tile/Tile.Props.ts b/packages/experiments/src/components/Tile/Tile.types.ts
similarity index 100%
rename from packages/experiments/src/components/Tile/Tile.Props.ts
rename to packages/experiments/src/components/Tile/Tile.types.ts
diff --git a/packages/experiments/src/components/Tile/TilePage.tsx b/packages/experiments/src/components/Tile/TilePage.tsx
index d939c1d3bfaf0..f4163fe5e44f5 100644
--- a/packages/experiments/src/components/Tile/TilePage.tsx
+++ b/packages/experiments/src/components/Tile/TilePage.tsx
@@ -37,7 +37,7 @@ export class TilePage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!experiments/src/components/Tile/Tile.Props.ts')
+              require<string>('!raw-loader!experiments/src/components/Tile/Tile.types.ts')
             ] }
           />
         }
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
index c42c036eb4f65..08057f37263eb 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
@@ -9,7 +9,7 @@ import {
   SharedSignal
 } from '../../signals/Signals';
 import { FolderCover, getFolderCoverLayout, renderFolderCoverWithLayout } from '../../FolderCover/FolderCover';
-import { FolderCoverType } from '../../FolderCover/FolderCover.Props';
+import { FolderCoverType } from '../../FolderCover/FolderCover.types';
 import { lorem } from '@uifabric/example-app-base';
 import { css, autobind, ISize, fitContentToBounds } from '../../../Utilities';
 import * as TileExampleStylesModule from './Tile.Example.scss';
diff --git a/packages/experiments/src/components/Tile/index.ts b/packages/experiments/src/components/Tile/index.ts
index 9149e165f7740..346b2d7f99098 100644
--- a/packages/experiments/src/components/Tile/index.ts
+++ b/packages/experiments/src/components/Tile/index.ts
@@ -1,3 +1,3 @@
 
-export * from './Tile.Props';
+export * from './Tile.types';
 export * from './Tile';
diff --git a/packages/experiments/src/components/TilesList/TilesList.tsx b/packages/experiments/src/components/TilesList/TilesList.tsx
index a8df43c6dc5ef..e54c4197490de 100644
--- a/packages/experiments/src/components/TilesList/TilesList.tsx
+++ b/packages/experiments/src/components/TilesList/TilesList.tsx
@@ -1,6 +1,6 @@
 
 import * as React from 'react';
-import { ITilesListProps, ITilesGridItem, ITilesGridSegment, TilesGridMode, ITileSize } from './TilesList.Props';
+import { ITilesListProps, ITilesGridItem, ITilesGridSegment, TilesGridMode, ITileSize } from './TilesList.types';
 import { List, IPageProps } from 'office-ui-fabric-react/lib/List';
 import { FocusZone, FocusZoneDirection } from 'office-ui-fabric-react/lib/FocusZone';
 import { autobind, css, IRenderFunction, IRectangle } from 'office-ui-fabric-react/lib/Utilities';
diff --git a/packages/experiments/src/components/TilesList/TilesList.Props.ts b/packages/experiments/src/components/TilesList/TilesList.types.ts
similarity index 100%
rename from packages/experiments/src/components/TilesList/TilesList.Props.ts
rename to packages/experiments/src/components/TilesList/TilesList.types.ts
diff --git a/packages/experiments/src/components/TilesList/TilesListPage.tsx b/packages/experiments/src/components/TilesList/TilesListPage.tsx
index 2da9d54614bcd..7669494b5e10b 100644
--- a/packages/experiments/src/components/TilesList/TilesListPage.tsx
+++ b/packages/experiments/src/components/TilesList/TilesListPage.tsx
@@ -46,7 +46,7 @@ export class TilesListPage extends React.Component<IComponentDemoPageProps, {}>
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!experiments/src/components/TilesList/TilesList.Props.ts')
+              require<string>('!raw-loader!experiments/src/components/TilesList/TilesList.types.ts')
             ] }
           />
         }
diff --git a/packages/experiments/src/components/TilesList/examples/ExampleHelpers.tsx b/packages/experiments/src/components/TilesList/examples/ExampleHelpers.tsx
index 277dbad7c3af1..ef41583327410 100644
--- a/packages/experiments/src/components/TilesList/examples/ExampleHelpers.tsx
+++ b/packages/experiments/src/components/TilesList/examples/ExampleHelpers.tsx
@@ -1,5 +1,5 @@
 
-import { TilesGridMode, ITilesGridItem, ITilesGridSegment, ITileSize } from '../TilesList.Props';
+import { TilesGridMode, ITilesGridItem, ITilesGridSegment, ITileSize } from '../TilesList.types';
 import { lorem } from '@uifabric/example-app-base';
 
 type IAspectRatioByProbability = { [probability: string]: number; };
diff --git a/packages/experiments/src/components/TilesList/index.ts b/packages/experiments/src/components/TilesList/index.ts
index 4b6fe18ed7b84..2dadd7d95065a 100644
--- a/packages/experiments/src/components/TilesList/index.ts
+++ b/packages/experiments/src/components/TilesList/index.ts
@@ -1,2 +1,2 @@
 export * from './TilesList';
-export * from './TilesList.Props';
+export * from './TilesList.types';
diff --git a/packages/office-ui-fabric-react/.npmignore b/packages/office-ui-fabric-react/.npmignore
index 4c286d0b2bc06..80ff782d53024 100644
--- a/packages/office-ui-fabric-react/.npmignore
+++ b/packages/office-ui-fabric-react/.npmignore
@@ -19,7 +19,7 @@ jsconfig.json
 karma.config.js
 node_modules
 src/**/*
-!src/**/*.Props.ts
+!src/**/*.types.ts
 !src/**/*.Example.tsx
 tsconfig.json
 tsd.json
diff --git a/packages/office-ui-fabric-react/src/MarqueeSelection.ts b/packages/office-ui-fabric-react/src/MarqueeSelection.ts
index 75b9d1b0a56e8..8f1eb7ae88929 100644
--- a/packages/office-ui-fabric-react/src/MarqueeSelection.ts
+++ b/packages/office-ui-fabric-react/src/MarqueeSelection.ts
@@ -1,3 +1,3 @@
 export * from './components/MarqueeSelection/MarqueeSelection';
-export * from './components/MarqueeSelection/MarqueeSelection.Props';
+export * from './components/MarqueeSelection/MarqueeSelection.types';
 export * from './utilities/selection/index';
diff --git a/packages/office-ui-fabric-react/src/PersonaCoin.ts b/packages/office-ui-fabric-react/src/PersonaCoin.ts
index 695908e3ab8c0..62003eef0c6e0 100644
--- a/packages/office-ui-fabric-react/src/PersonaCoin.ts
+++ b/packages/office-ui-fabric-react/src/PersonaCoin.ts
@@ -1,3 +1,3 @@
 export * from './components/Persona/PersonaCoin';
-export * from './components/Persona/Persona.Props';
+export * from './components/Persona/Persona.types';
 export * from './components/Persona/PersonaConsts';
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.classNames.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.classNames.ts
index 913625efa6dc2..1311037925a36 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.classNames.ts
@@ -6,7 +6,7 @@ import {
 import {
   memoizeFunction
 } from '../../Utilities';
-import { IActivityItemStyles } from './ActivityItem.Props';
+import { IActivityItemStyles } from './ActivityItem.types';
 import { IPersonaProps } from '../../Persona';
 
 export interface IActivityItemClassNames {
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
index 6b4f289e502d8..3eda41f13db56 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
@@ -6,7 +6,7 @@ import {
 import {
   memoizeFunction
 } from '../../Utilities';
-import { IActivityItemStyles } from './ActivityItem.Props';
+import { IActivityItemStyles } from './ActivityItem.types';
 
 const DEFAULT_PERSONA_SIZE = '32px';
 const COMPACT_PERSONA_SIZE = '16px';
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
index 8db02241f4404..62c6f5c7d6ba7 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 /* tslint:enable */
 
 import { autobind, BaseComponent } from '../../Utilities';
-import { IActivityItemProps, IActivityItemStyles } from './ActivityItem.Props';
+import { IActivityItemProps, IActivityItemStyles } from './ActivityItem.types';
 import { mergeStyles } from '../../Styling';
 import { IActivityItemClassNames, getClassNames } from './ActivityItem.classNames';
 import { getStyles } from './ActivityItem.styles';
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.Props.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.Props.ts
rename to packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItemPage.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItemPage.tsx
index 0c9aa496db5d5..44ba1db273afa 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItemPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItemPage.tsx
@@ -36,7 +36,7 @@ export class ActivityItemPage extends React.Component<IComponentDemoPageProps, {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/ActivityItem/ActivityItem.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/ActivityItem/ActivityItem.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/index.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/index.ts
index 717703d384051..8003249b54e85 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/index.ts
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/index.ts
@@ -1,2 +1,2 @@
 export * from './ActivityItem';
-export * from './ActivityItem.Props';
\ No newline at end of file
+export * from './ActivityItem.types';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.checklist.ts b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.checklist.ts
index 40d9644878cac..93d3a9f970773 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 export const BreadcrumbStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
   markupSupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx
index dc5d40c1e3426..d2ae7c88e4e24 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx
@@ -7,7 +7,7 @@ import * as ReactTestUtils from 'react-dom/test-utils';
 import * as renderer from 'react-test-renderer';
 
 import { Breadcrumb } from './Breadcrumb';
-import { IBreadcrumbItem } from './Breadcrumb.Props';
+import { IBreadcrumbItem } from './Breadcrumb.types';
 
 describe('Breadcrumb', () => {
   it('renders breadcumb correctly', () => {
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
index bcbf8ca42faa4..1b3b682702215 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
@@ -9,7 +9,7 @@ import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { Link } from '../../Link';
 import { Icon } from '../../Icon';
 import { IconButton } from '../../Button';
-import { IBreadcrumbProps, IBreadcrumbItem } from './Breadcrumb.Props';
+import { IBreadcrumbProps, IBreadcrumbItem } from './Breadcrumb.types';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { ResizeGroup } from '../../ResizeGroup';
 import { TooltipHost, TooltipOverflowMode } from '../../Tooltip';
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.Props.ts b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.Props.ts
rename to packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx
index f6fe2127f8c8d..ae672f5f559e4 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/BreadcrumbPage.tsx
@@ -43,7 +43,7 @@ export class BreadcrumbPage extends React.Component<IComponentDemoPageProps, any
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/index.ts b/packages/office-ui-fabric-react/src/components/Breadcrumb/index.ts
index e9cf5c494bbcc..73ee946f46d33 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/index.ts
@@ -1,2 +1,2 @@
 export * from './Breadcrumb';
-export * from './Breadcrumb.Props';
\ No newline at end of file
+export * from './Breadcrumb.types';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.styles.ts
index 2217334d43984..406b8c933d9c7 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.styles.ts
@@ -1,4 +1,4 @@
-import { IButtonStyles } from '../Button.Props';
+import { IButtonStyles } from '../Button.types';
 import {
   ITheme,
   concatStyleSets
diff --git a/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx b/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx
index 198c99cf1a32f..491b6ece22e84 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
-import { IButtonProps } from '../Button.Props';
+import { IButtonProps } from '../Button.types';
 import { getStyles } from './ActionButton.styles';
 
 @customizable('ActionButton', ['theme'])
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
index b5e54cfc25619..d8a8e99c6e075 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
@@ -1,6 +1,6 @@
 import { memoizeFunction } from '../../Utilities';
 import { mergeStyles } from '../../Styling';
-import { IButtonStyles } from './Button.Props';
+import { IButtonStyles } from './Button.types';
 
 export interface IButtonClassNames {
   root?: string;
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
index b4ada9c359b5a..c2116f22bd57f 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
@@ -1,4 +1,4 @@
-import { IButtonStyles } from './Button.Props';
+import { IButtonStyles } from './Button.types';
 import { memoizeFunction } from '../../Utilities';
 import {
   ITheme,
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 2ddd6e4e68bbe..e3734e455d1dd 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -13,7 +13,7 @@ import {
 import { Icon, IIconProps } from '../../Icon';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { ContextualMenu, IContextualMenuProps } from '../../ContextualMenu';
-import { IButtonProps, IButton } from './Button.Props';
+import { IButtonProps, IButton } from './Button.types';
 import { IButtonClassNames, getClassNames } from './BaseButton.classNames';
 import { getClassNames as getSplitButtonClassNames, ISplitButtonClassNames } from './SplitButton/SplitButton.classNames';
 
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.checklist.ts b/packages/office-ui-fabric-react/src/components/Button/Button.checklist.ts
index 120e45a726b17..e3b5a5fe8c72b 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 export const ButtonStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
   markupSupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.tsx b/packages/office-ui-fabric-react/src/components/Button/Button.tsx
index 7c559dbce36be..06772743f94da 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
 import { BaseComponent, warn } from '../../Utilities';
-import { ButtonType, IButtonProps } from './Button.Props';
+import { ButtonType, IButtonProps } from './Button.types';
 import { DefaultButton } from './DefaultButton/DefaultButton';
 import { ActionButton } from './ActionButton/ActionButton';
 import { CompoundButton } from './CompoundButton/CompoundButton';
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.Props.ts b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Button/Button.Props.ts
rename to packages/office-ui-fabric-react/src/components/Button/Button.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
index 1534631d4f28f..4a49d8168b44c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
@@ -131,7 +131,7 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
           <div>
             <PropertiesTableSet
               sources={ [
-                require<string>('!raw-loader!office-ui-fabric-react/src/components/Button/Button.Props.ts')
+                require<string>('!raw-loader!office-ui-fabric-react/src/components/Button/Button.types.ts')
               ] }
             />
             <p>Besides the above properties, the <code>Button</code> component accepts all properties that the React <code>button</code> and <code>a</code> components accept.</p>
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts b/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
index 884b8faf2c17c..0fa33356502b3 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
@@ -1,4 +1,4 @@
-import { IButtonStyles } from './Button.Props';
+import { IButtonStyles } from './Button.types';
 import { ITheme } from '../../Styling';
 
 export function standardStyles(theme: ITheme): IButtonStyles {
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts
index 1d744441cb720..6a8f5856c1d60 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts
@@ -1,4 +1,4 @@
-import { IButtonStyles } from '../Button.Props';
+import { IButtonStyles } from '../Button.types';
 import {
   ITheme,
   concatStyleSets
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx
index bf54a296e3a77..dbd000543dd3a 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
-import { IButtonProps } from '../Button.Props';
+import { IButtonProps } from '../Button.types';
 import { getStyles } from './CommandBarButton.styles';
 
 @customizable('CommandBarButton', ['theme'])
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
index b319f75a3721b..6cc64869e0fe7 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
@@ -1,4 +1,4 @@
-import { IButtonStyles } from '../Button.Props';
+import { IButtonStyles } from '../Button.types';
 import {
   ITheme,
   concatStyleSets,
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
index 92b4b2557846b..8b44d9f464dff 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
 import { BaseComponent, customizable } from '../../../Utilities';
-import { IButtonProps } from '../Button.Props';
+import { IButtonProps } from '../Button.types';
 import { getStyles } from './CompoundButton.styles';
 
 @customizable('CompoundButton', ['theme'])
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
index f593760d7e328..a7096313aa56d 100644
--- a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
@@ -1,4 +1,4 @@
-import { IButtonStyles } from '../Button.Props';
+import { IButtonStyles } from '../Button.types';
 import {
   ITheme,
   concatStyleSets,
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
index e58f8ae5d8b94..c11510b10f3c9 100644
--- a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
-import { IButtonProps } from '../Button.Props';
+import { IButtonProps } from '../Button.types';
 import { getStyles } from './DefaultButton.styles';
 
 @customizable('DefaultButton', ['theme'])
diff --git a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
index 1b70f4dacb931..dae28404cd08c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
@@ -1,4 +1,4 @@
-import { IButtonStyles } from '../Button.Props';
+import { IButtonStyles } from '../Button.types';
 import {
   ITheme,
   concatStyleSets
diff --git a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
index 01baa17402449..9d6367a36cfbe 100644
--- a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { BaseButton } from '../BaseButton';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
-import { IButtonProps } from '../Button.Props';
+import { IButtonProps } from '../Button.types';
 import { getStyles } from './IconButton.styles';
 
 @customizable('IconButton', ['theme'])
diff --git a/packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.styles.ts
index 11d3855f41ca6..7e797034447bb 100644
--- a/packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.styles.ts
@@ -1,4 +1,4 @@
-import { IButtonStyles } from '../Button.Props';
+import { IButtonStyles } from '../Button.types';
 import {
   ITheme,
   concatStyleSets
diff --git a/packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.tsx b/packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.tsx
index 6f4de67f7653a..e39a2789c8b6c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { DefaultButton } from '../DefaultButton/DefaultButton';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
-import { IButtonProps } from '../Button.Props';
+import { IButtonProps } from '../Button.types';
 import { getStyles } from './MessageBarButton.styles';
 
 @customizable('MessageBarButton', ['theme'])
diff --git a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
index 4afad010f9ff4..c633f9c4a7031 100644
--- a/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/PrimaryButton/PrimaryButton.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { BaseComponent, customizable, nullRender } from '../../../Utilities';
 import { DefaultButton } from '../DefaultButton/DefaultButton';
-import { IButtonProps } from '../Button.Props';
+import { IButtonProps } from '../Button.types';
 
 @customizable('PrimaryButton', ['theme'])
 export class PrimaryButton extends BaseComponent<IButtonProps, {}> {
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts
index ccb22835e23ee..09402013e4e4b 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts
@@ -1,6 +1,6 @@
 import { memoizeFunction } from '../../../Utilities';
 import { mergeStyles } from '../../../Styling';
-import { IButtonStyles } from '../Button.Props';
+import { IButtonStyles } from '../Button.types';
 
 export interface ISplitButtonClassNames {
   root?: string;
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
index 06f9deb3c6cbc..f0330fc7fe3be 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
@@ -1,4 +1,4 @@
-import { IButtonStyles } from '../Button.Props';
+import { IButtonStyles } from '../Button.types';
 import {
   ITheme,
   concatStyleSets,
diff --git a/packages/office-ui-fabric-react/src/components/Button/index.ts b/packages/office-ui-fabric-react/src/components/Button/index.ts
index bae3414502f70..1a08c6eb8c842 100644
--- a/packages/office-ui-fabric-react/src/components/Button/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/index.ts
@@ -1,5 +1,5 @@
 export * from './BaseButton';
-export * from './Button.Props';
+export * from './Button.types';
 export * from './Button';
 export * from './ActionButton/ActionButton';
 export * from './CommandBarButton/CommandBarButton';
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.checklist.ts b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.checklist.ts
index 9f2de7df1b7dd..e50de914b5a9f 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 export const CalendarStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
   markupSupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
index 42e1da0604e3b..770846ffc51e3 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
@@ -8,7 +8,7 @@ import * as renderer from 'react-test-renderer';
 import { mount } from 'enzyme';
 
 import { Calendar } from './Calendar';
-import { DateRangeType, DayOfWeek } from './Calendar.Props';
+import { DateRangeType, DayOfWeek } from './Calendar.types';
 import { addDays, compareDates } from '../../utilities/dateMath/DateMath';
 
 describe('Calendar', () => {
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index b225d8464b2a3..25dcb3b4c953f 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { ICalendar, ICalendarProps, ICalendarStrings, ICalendarIconStrings, ICalendarFormatDateCallbacks } from './Calendar.Props';
+import { ICalendar, ICalendarProps, ICalendarStrings, ICalendarIconStrings, ICalendarFormatDateCallbacks } from './Calendar.types';
 import { DayOfWeek, FirstWeekOfYear, DateRangeType } from '../../utilities/dateValues/DateValues';
 import { CalendarDay } from './CalendarDay';
 import { CalendarMonth } from './CalendarMonth';
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts
rename to packages/office-ui-fabric-react/src/components/Calendar/Calendar.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index 918e618762fed..d9f28fa9f4dc0 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -8,7 +8,7 @@ import {
   getRTL,
   getRTLSafeKeyCode
 } from '../../Utilities';
-import { ICalendarStrings, ICalendarIconStrings, ICalendarFormatDateCallbacks } from './Calendar.Props';
+import { ICalendarStrings, ICalendarIconStrings, ICalendarFormatDateCallbacks } from './Calendar.types';
 import { DayOfWeek, MonthOfYear, FirstWeekOfYear, DateRangeType } from '../../utilities/dateValues/DateValues';
 import { FocusZone } from '../../FocusZone';
 import { Icon } from '../../Icon';
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
index 5e2993b717583..23fb4e59609dd 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
@@ -6,7 +6,7 @@ import {
   getRTL,
   autobind
 } from '../../Utilities';
-import { ICalendarStrings, ICalendarIconStrings, ICalendarFormatDateCallbacks } from './Calendar.Props';
+import { ICalendarStrings, ICalendarIconStrings, ICalendarFormatDateCallbacks } from './Calendar.types';
 import { FocusZone } from '../../FocusZone';
 import { addYears, setMonth, getYearStart, getYearEnd, getMonthStart, getMonthEnd, compareDatePart } from '../../utilities/dateMath/DateMath';
 import { Icon } from '../../Icon';
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
index ed21dce1020d3..ec1146a19c80b 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
@@ -131,7 +131,7 @@ export class CalendarPage extends React.Component<IComponentDemoPageProps, any>
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Calendar/Calendar.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Calendar/Calendar.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/index.ts b/packages/office-ui-fabric-react/src/components/Calendar/index.ts
index 5006572a43032..09bd17ecb1d50 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Calendar/index.ts
@@ -1,2 +1,2 @@
 export * from './Calendar';
-export * from './Calendar.Props';
+export * from './Calendar.types';
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.checklist.ts b/packages/office-ui-fabric-react/src/components/Callout/Callout.checklist.ts
index 0e1cc7a786923..7c5101f729ea6 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const CalloutStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.tsx b/packages/office-ui-fabric-react/src/components/Callout/Callout.tsx
index f11582568dc99..8edf334dc2912 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
 import { BaseComponent } from '../../Utilities';
-import { ICalloutProps } from './Callout.Props';
+import { ICalloutProps } from './Callout.types';
 import { ICalloutState, CalloutContent } from './CalloutContent';
 import { Layer } from '../../Layer';
 
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts b/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Callout/Callout.Props.ts
rename to packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index d36fab507d877..b4e1c0fba8671 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -1,7 +1,7 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
-import { ICalloutProps } from './Callout.Props';
+import { ICalloutProps } from './Callout.types';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import {
   BaseComponent,
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
index df66337250736..876d4ef40a184 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
@@ -47,7 +47,7 @@ export class CalloutPage extends React.Component<IComponentDemoPageProps, any> {
           <div>
             <PropertiesTableSet
               sources={ [
-                require<string>('!raw-loader!office-ui-fabric-react/src/components/Callout/Callout.Props.ts')
+                require<string>('!raw-loader!office-ui-fabric-react/src/components/Callout/Callout.types.ts')
               ] }
             />
             <p>Besides the above properties, the <code>Callout</code> component accepts all properties that the React <code>button</code> and <code>a</code> components accept.</p>
diff --git a/packages/office-ui-fabric-react/src/components/Callout/index.ts b/packages/office-ui-fabric-react/src/components/Callout/index.ts
index 0f37e86477559..b7bb1837bfe1d 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/index.ts
@@ -1,3 +1,3 @@
 export * from './Callout';
-export * from './Callout.Props';
+export * from './Callout.types';
 export * from '../../common/DirectionalHint';
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.checklist.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.checklist.ts
index 4800464e32965..f170a352bd6e5 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const CheckboxStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.classNames.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.classNames.ts
index 11854463e0621..ff0bbaa506916 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.classNames.ts
@@ -1,6 +1,6 @@
 import { memoizeFunction } from '../../Utilities';
 import { mergeStyles } from '../../Styling';
-import { ICheckboxStyles } from './Checkbox.Props';
+import { ICheckboxStyles } from './Checkbox.types';
 
 export interface ICheckboxClassNames {
   root: string;
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
index 1e3115b0d0a63..060cf7b2119a8 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
@@ -1,4 +1,4 @@
-import { ICheckboxStyles } from './Checkbox.Props';
+import { ICheckboxStyles } from './Checkbox.types';
 import {
   ITheme,
   concatStyleSets,
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
index ac4821ee60af4..3d306c7705fd7 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
@@ -10,7 +10,7 @@ import {
   ICheckbox,
   ICheckboxProps,
   ICheckboxStyles
-} from './Checkbox.Props';
+} from './Checkbox.types';
 import {
   customizable
 } from '../../Utilities';
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.types.ts
similarity index 99%
rename from packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
rename to packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.types.ts
index 230791b048a40..24638d19ebe4d 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.types.ts
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { IStyle, ITheme } from '../../Styling';
 import { IRenderFunction } from '../../Utilities';
-import { IIconProps } from '../Icon/Icon.Props';
+import { IIconProps } from '../Icon/Icon.types';
 
 /**
  * Checkbox class interface.
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx
index 99523ceee6c1d..dad989bd8097f 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/CheckboxPage.tsx
@@ -39,7 +39,7 @@ export class CheckboxPage extends React.Component<IComponentDemoPageProps, any>
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Checkbox/Checkbox.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Checkbox/Checkbox.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/index.ts b/packages/office-ui-fabric-react/src/components/Checkbox/index.ts
index 7cd0acb84e945..d6d1a8b7a54bf 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/index.ts
@@ -1,2 +1,2 @@
 export * from './Checkbox';
-export * from './Checkbox.Props';
+export * from './Checkbox.types';
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.checklist.ts b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.checklist.ts
index 6c6fb7830f02e..e565cddebf284 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const ChoiceGroupStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
index 00ddb5298e7fb..e611afd43b23f 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
@@ -7,7 +7,7 @@ import * as ReactTestUtils from 'react-dom/test-utils';
 import * as renderer from 'react-test-renderer';
 
 import { ChoiceGroup } from './ChoiceGroup';
-import { IChoiceGroupOption } from './ChoiceGroup.Props';
+import { IChoiceGroupOption } from './ChoiceGroup.types';
 
 const TEST_OPTIONS: IChoiceGroupOption[] = [
   { key: '1', text: '1', 'data-automation-id': 'auto1' } as IChoiceGroupOption,
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
index 9c903356d3672..caa5960d48e53 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { Image } from '../../Image';
 import { Label } from '../../Label';
 import { Icon } from '../../Icon';
-import { IChoiceGroupOption, IChoiceGroupProps } from './ChoiceGroup.Props';
+import { IChoiceGroupOption, IChoiceGroupProps } from './ChoiceGroup.types';
 import {
   assign,
   BaseComponent,
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts
rename to packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx
index a1060baaf44ef..808512db08e76 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx
@@ -42,7 +42,7 @@ export class ChoiceGroupPage extends React.Component<IComponentDemoPageProps, {}
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/index.ts b/packages/office-ui-fabric-react/src/components/ChoiceGroup/index.ts
index d5c96cd9989a5..9c70cc01b7c8e 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/index.ts
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/index.ts
@@ -1,2 +1,2 @@
 export * from './ChoiceGroup';
-export * from './ChoiceGroup.Props';
+export * from './ChoiceGroup.types';
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.checklist.ts b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.checklist.ts
index b2ad3d4c74578..7cabfc3ab557d 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const ColorPickerStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
index 3ebcd3900b2b2..1eb8f5ca893a9 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
@@ -4,7 +4,7 @@ import {
   autobind,
   css
 } from '../../Utilities';
-import { IColorPickerProps } from './ColorPicker.Props';
+import { IColorPickerProps } from './ColorPicker.types';
 import { TextField } from '../../TextField';
 import { ColorRectangle } from './ColorRectangle';
 import { ColorSlider } from './ColorSlider';
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts
rename to packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPickerPage.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPickerPage.tsx
index 41d5d9946dada..f03942c79b580 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPickerPage.tsx
@@ -28,7 +28,7 @@ export class ColorPickerPage extends React.Component<IComponentDemoPageProps, {}
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/ColorPicker/ColorPicker.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/ColorPicker/ColorPicker.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/index.ts b/packages/office-ui-fabric-react/src/components/ColorPicker/index.ts
index 605408bbb2010..0a98914d6aaf9 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/index.ts
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/index.ts
@@ -1,2 +1,2 @@
 export * from './ColorPicker';
-export * from './ColorPicker.Props';
+export * from './ColorPicker.types';
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.checklist.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.checklist.ts
index bae3c2b17aa47..7cbfe86d4ce0b 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const ComboBoxStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
index 433236e7d8164..19208515a4d13 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
@@ -1,4 +1,4 @@
-import { IComboBoxStyles, IComboBoxOptionStyles } from './ComboBox.Props';
+import { IComboBoxStyles, IComboBoxOptionStyles } from './ComboBox.types';
 import { memoizeFunction } from '../../Utilities';
 import {
   mergeStyles,
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index 1702f09fc25db..c5aef5c22d528 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -9,7 +9,7 @@ import {
 import {
   IComboBoxOptionStyles,
   IComboBoxStyles,
-} from './ComboBox.Props';
+} from './ComboBox.types';
 
 import { IButtonStyles } from '../../Button';
 import { memoizeFunction } from '../../Utilities';
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
index 63652654d950a..f91c65131c2f9 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
@@ -8,7 +8,7 @@ import * as renderer from 'react-test-renderer';
 import { KeyCodes } from '../../Utilities';
 
 import { ComboBox } from './ComboBox';
-import { IComboBox, IComboBoxOption } from './ComboBox.Props';
+import { IComboBox, IComboBoxOption } from './ComboBox.types';
 
 const DEFAULT_OPTIONS: IComboBoxOption[] = [
   { key: '1', text: '1' },
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index c488ff6a3c260..98674d8764c01 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { IComboBoxOption, IComboBoxProps } from './ComboBox.Props';
+import { IComboBoxOption, IComboBoxProps } from './ComboBox.types';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { Callout } from '../../Callout';
 import { Label } from '../../Label';
@@ -18,7 +18,7 @@ import {
   KeyCodes,
   customizable
 } from '../../Utilities';
-import { SelectableOptionMenuItemType, ISelectableOption } from '../../utilities/selectableOption/SelectableOption.Props';
+import { SelectableOptionMenuItemType, ISelectableOption } from '../../utilities/selectableOption/SelectableOption.types';
 import {
   getStyles,
   getOptionStyles,
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
similarity index 95%
rename from packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
rename to packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
index c031180e28db2..a8c60b4d0fa63 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
@@ -1,6 +1,6 @@
 import { IIconProps } from '../../Icon';
-import { ISelectableOption } from '../../utilities/selectableOption/SelectableOption.Props';
-import { ISelectableDroppableTextProps } from '../../utilities/selectableOption/SelectableDroppableText.Props';
+import { ISelectableOption } from '../../utilities/selectableOption/SelectableOption.types';
+import { ISelectableDroppableTextProps } from '../../utilities/selectableOption/SelectableDroppableText.types';
 import { IStyle, ITheme } from '../../Styling';
 import { IButtonStyles } from '../../Button';
 import { IRenderFunction } from '../../Utilities';
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
index ee6a7a7a15252..6beae488d6529 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
@@ -32,7 +32,7 @@ export class ComboBoxPage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/ComboBox/ComboBox.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx
index 99c1d23303492..64929fc3ada78 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx
@@ -1,9 +1,9 @@
 import * as React from 'react';
 import { autobind, BaseComponent, customizable } from '../../Utilities';
 import { ComboBox } from './ComboBox';
-import { IComboBoxProps, IComboBox } from './ComboBox.Props';
+import { IComboBoxProps, IComboBox } from './ComboBox.types';
 import { List } from '../../List';
-import { SelectableOptionMenuItemType, ISelectableOption } from '../../utilities/selectableOption/SelectableOption.Props';
+import { SelectableOptionMenuItemType, ISelectableOption } from '../../utilities/selectableOption/SelectableOption.types';
 
 export class VirtualizedComboBox extends BaseComponent<IComboBoxProps, {}> implements IComboBox {
   /** The combo box element */
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
index 280714f9ead55..3ba0d64018f5c 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
@@ -10,7 +10,7 @@ import {
   assign,
   autobind
 } from 'office-ui-fabric-react/lib/Utilities';
-import { SelectableOptionMenuItemType } from 'office-ui-fabric-react/lib/utilities/selectableOption/SelectableOption.Props';
+import { SelectableOptionMenuItemType } from 'office-ui-fabric-react/lib/utilities/selectableOption/SelectableOption.types';
 
 export class ComboBoxBasicExample extends React.Component<any, any> {
   private _testOptions =
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/index.ts b/packages/office-ui-fabric-react/src/components/ComboBox/index.ts
index 96fdf4db04de7..0329a97dbe85f 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/index.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/index.ts
@@ -1,4 +1,4 @@
-export { SelectableOptionMenuItemType } from '../../utilities/selectableOption/SelectableOption.Props';
+export { SelectableOptionMenuItemType } from '../../utilities/selectableOption/SelectableOption.types';
 export * from './ComboBox';
-export * from './ComboBox.Props';
+export * from './ComboBox.types';
 export * from './VirtualizedComboBox';
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.checklist.ts b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.checklist.ts
index 85039e74d8c12..3e0187fdcfacd 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const CommandBarStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
index 27288ec66f833..2f03eda007a6b 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
@@ -7,7 +7,7 @@ import * as ReactTestUtils from 'react-dom/test-utils';
 import * as renderer from 'react-test-renderer';
 
 import { CommandBar } from './CommandBar';
-import { IContextualMenuItem } from '../ContextualMenu/ContextualMenu.Props';
+import { IContextualMenuItem } from '../ContextualMenu/ContextualMenu.types';
 
 describe('CommandBar', () => {
 
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index cd52d195bc686..fec7c8564e04e 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -9,7 +9,7 @@ import {
   getId,
   getNativeProps
 } from '../../Utilities';
-import { ICommandBar, ICommandBarProps, ICommandBarItemProps } from './CommandBar.Props';
+import { ICommandBar, ICommandBarProps, ICommandBarItemProps } from './CommandBar.types';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { ContextualMenu, IContextualMenuProps, IContextualMenuItem, hasSubmenuItems } from '../../ContextualMenu';
 import { DirectionalHint } from '../../common/DirectionalHint';
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.Props.ts b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.Props.ts
rename to packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx
index dca34547ee0f7..25ad0b83dbc07 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx
@@ -40,8 +40,8 @@ export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}>
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/CommandBar/CommandBar.Props.ts'),
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/CommandBar/CommandBar.types.ts'),
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/index.ts b/packages/office-ui-fabric-react/src/components/CommandBar/index.ts
index 455b306d96bae..824e6fde00673 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/index.ts
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/index.ts
@@ -1,2 +1,2 @@
 export * from './CommandBar';
-export * from './CommandBar.Props';
+export * from './CommandBar.types';
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.checklist.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.checklist.ts
index bdc15c79c539e..33ca1e1632f00 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const ContextualMenuStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
index 525da8eb9b60c..682de1f8fcde4 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
@@ -1,8 +1,8 @@
 import { memoizeFunction } from '../../Utilities';
 import { ITheme, mergeStyleSets } from '../../Styling';
-import { IContextualMenuStyles, IMenuItemStyles } from './ContextualMenu.Props';
+import { IContextualMenuStyles, IMenuItemStyles } from './ContextualMenu.types';
 import { getStyles as getContextualMenuStyles, getMenuItemStyles } from './ContextualMenu.styles';
-import { IVerticalDividerClassNames } from '../Divider/VerticalDivider.Props';
+import { IVerticalDividerClassNames } from '../Divider/VerticalDivider.types';
 import { getDividerClassNames } from '../Divider/VerticalDivider.classNames';
 
 export interface IContextualMenuClassNames {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
index ebd66d0ffcbb2..d4b861b93c6de 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
@@ -6,7 +6,7 @@ import {
   concatStyleSets,
   getFocusStyle
 } from '../../Styling';
-import { IContextualMenuStyles, IMenuItemStyles } from './ContextualMenu.Props';
+import { IContextualMenuStyles, IMenuItemStyles } from './ContextualMenu.types';
 
 import { memoizeFunction } from '../../Utilities';
 
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
index 4488ed12e7357..24176c6dc6f89 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
@@ -9,7 +9,7 @@ import {
 import { FocusZoneDirection } from '../../FocusZone';
 
 import { ContextualMenu, canAnyMenuItemsCheck } from './ContextualMenu';
-import { IContextualMenuItem, ContextualMenuItemType } from './ContextualMenu.Props';
+import { IContextualMenuItem, ContextualMenuItemType } from './ContextualMenu.types';
 import { Layer } from '../Layer/Layer';
 
 describe('ContextualMenu', () => {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 8e171dfe70fb9..c2a791faa82b3 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { IContextualMenuProps, IContextualMenuItem, ContextualMenuItemType } from './ContextualMenu.Props';
+import { IContextualMenuProps, IContextualMenuItem, ContextualMenuItemType } from './ContextualMenu.types';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
similarity index 99%
rename from packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
rename to packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
index bdd50bb1ad2ef..f25555ccaed7d 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { ContextualMenu } from './ContextualMenu';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { FocusZoneDirection } from '../../FocusZone';
-import { IIconProps } from '../Icon/Icon.Props';
+import { IIconProps } from '../Icon/Icon.types';
 import { ICalloutProps } from '../../Callout';
 import { ITheme, IStyle } from '../../Styling';
 import { IButtonStyles } from '../../Button';
@@ -14,7 +14,7 @@ import {
 import { IWithResponsiveModeState } from '../../utilities/decorators/withResponsiveMode';
 import { IContextualMenuClassNames, IMenuItemClassNames } from './ContextualMenu.classNames';
 export { DirectionalHint } from '../../common/DirectionalHint';
-import { IVerticalDividerClassNames } from '../Divider/VerticalDivider.Props';
+import { IVerticalDividerClassNames } from '../Divider/VerticalDivider.types';
 
 export enum ContextualMenuItemType {
   Normal = 0,
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
index 851e175e87a56..763140898a2ff 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
@@ -78,8 +78,8 @@ export class ContextualMenuPage extends React.Component<IComponentDemoPageProps,
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.Props.ts'),
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Callout/Callout.Props.ts'),
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts'),
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Callout/Callout.types.ts'),
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/index.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/index.ts
index a17850be21ab9..26cda857d3173 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/index.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/index.ts
@@ -1,2 +1,2 @@
 export * from './ContextualMenu';
-export * from './ContextualMenu.Props';
+export * from './ContextualMenu.types';
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.checklist.ts b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.checklist.ts
index e15b9914785c9..5c3b3c912088d 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const DatePickerStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx
index c62106d81fdf2..4529685fe885a 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import * as renderer from 'react-test-renderer';
 import { Calendar, ICalendarStrings } from '../Calendar';
 import { DatePicker } from './DatePicker';
-import { IDatePickerStrings } from './DatePicker.Props';
+import { IDatePickerStrings } from './DatePicker.types';
 import { FirstWeekOfYear } from '../../utilities/dateValues/DateValues';
 import { shallow, mount, ReactWrapper } from 'enzyme';
 
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 36931038e9158..10b5d603efefc 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import {
   IDatePickerProps,
   IDatePickerStrings
-} from './DatePicker.Props';
+} from './DatePicker.types';
 import {
   Calendar,
   DayOfWeek
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
similarity index 99%
rename from packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
rename to packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
index 731abeeac5a05..78e1e6b31e753 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { DatePicker } from './DatePicker';
 import { DayOfWeek } from '../../Calendar';
 import { FirstWeekOfYear } from '../../utilities/dateValues/DateValues';
-import { ICalendarFormatDateCallbacks } from '../Calendar/Calendar.Props';
+import { ICalendarFormatDateCallbacks } from '../Calendar/Calendar.types';
 
 export interface IDatePicker {
 
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
index 16550a9605471..a0fff0cacf66a 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePickerPage.tsx
@@ -54,7 +54,7 @@ export class DatePickerPage extends React.Component<IComponentDemoPageProps, {}>
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/DatePicker/DatePicker.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/index.ts b/packages/office-ui-fabric-react/src/components/DatePicker/index.ts
index a61620ed9a6ba..a45dcae64463b 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/index.ts
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/index.ts
@@ -1,3 +1,3 @@
 export * from './DatePicker';
-export * from './DatePicker.Props';
-export * from '../Calendar/Calendar.Props';
+export * from './DatePicker.types';
+export * from '../Calendar/Calendar.types';
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index 52ff8f51dca23..9f03050af0327 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -9,7 +9,7 @@ import {
   KeyCodes,
   IRenderFunction
 } from '../../Utilities';
-import { IColumn, DetailsListLayoutMode, ColumnActionsMode } from './DetailsList.Props';
+import { IColumn, DetailsListLayoutMode, ColumnActionsMode } from './DetailsList.types';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { Icon } from '../../Icon';
 import { Layer } from '../../Layer';
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.checklist.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.checklist.ts
index 3290b807fed1b..138c347f29960 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const DetailsListStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 302cefdf2cdb5..13a2036aec1e7 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -19,7 +19,7 @@ import {
   IColumn,
   IDetailsList,
   IDetailsListProps,
-} from '../DetailsList/DetailsList.Props';
+} from '../DetailsList/DetailsList.types';
 import { DetailsHeader, IDetailsHeader, SelectAllVisibility, IDetailsHeaderProps } from '../DetailsList/DetailsHeader';
 import { DetailsRow, IDetailsRowProps } from '../DetailsList/DetailsRow';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts
rename to packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
index 7631a1b658fff..3bf50a9956623 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
@@ -82,7 +82,7 @@ export class DetailsListPage extends React.Component<IComponentDemoPageProps, {}
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/DetailsList/DetailsList.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index 19d6769534f5b..6e53c0ddba93c 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -10,7 +10,7 @@ import {
   getNativeProps,
   divProperties
 } from '../../Utilities';
-import { IColumn, CheckboxVisibility } from './DetailsList.Props';
+import { IColumn, CheckboxVisibility } from './DetailsList.types';
 import { DetailsRowCheck, IDetailsRowCheckProps } from './DetailsRowCheck';
 import { GroupSpacer } from '../GroupedList/GroupSpacer';
 import { DetailsRowFields } from './DetailsRowFields';
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
index 0cbf9176df31d..51386f9dd728d 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { IColumn } from './DetailsList.Props';
+import { IColumn } from './DetailsList.types';
 import { BaseComponent, css } from '../../Utilities';
 import * as stylesImport from './DetailsRow.scss';
 const styles: any = stylesImport;
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/index.ts b/packages/office-ui-fabric-react/src/components/DetailsList/index.ts
index 444badc0b32a9..3d09f62f160ab 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/index.ts
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/index.ts
@@ -1,6 +1,6 @@
 export * from '../../utilities/selection/index';
-export * from '../GroupedList/GroupedList.Props';
+export * from '../GroupedList/GroupedList.types';
 export * from './DetailsList';
-export * from './DetailsList.Props';
+export * from './DetailsList.types';
 export * from './DetailsRow';
 export * from './DetailsRowCheck';
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.checklist.ts b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.checklist.ts
index 5b2d92bc69132..03a2db8487c1e 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const DialogStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
index 2bc24fb81ada3..03ba9f6bdd4c0 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
@@ -7,7 +7,7 @@ import { mount } from 'enzyme';
 
 import { Dialog } from './Dialog';
 import { DialogContent } from './DialogContent';
-import { DialogType } from './DialogContent.Props';
+import { DialogType } from './DialogContent.types';
 
 /* tslint:disable:no-unused-expression */// for express fluent assertions
 
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
index 648a346accd14..3e5f14f800c77 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
@@ -4,8 +4,8 @@ import {
   css,
   getId
 } from '../../Utilities';
-import { IDialogProps } from './Dialog.Props';
-import { DialogType } from './DialogContent.Props';
+import { IDialogProps } from './Dialog.types';
+import { DialogType } from './DialogContent.types';
 import { Modal } from '../../Modal';
 import { withResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
 import * as stylesImport from './Dialog.scss';
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.Props.ts b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.types.ts
similarity index 98%
rename from packages/office-ui-fabric-react/src/components/Dialog/Dialog.Props.ts
rename to packages/office-ui-fabric-react/src/components/Dialog/Dialog.types.ts
index b3969216ffc3a..951d35f5537ee 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.types.ts
@@ -1,8 +1,8 @@
 import * as React from 'react';
 import { IModalProps } from '../../Modal';
 import { Dialog } from './Dialog';
-import { DialogType, IDialogContentProps } from './DialogContent.Props';
-import { IButtonProps } from '../Button/Button.Props';
+import { DialogType, IDialogContentProps } from './DialogContent.types';
+import { IButtonProps } from '../Button/Button.types';
 import { IWithResponsiveModeState } from '../../utilities/decorators/withResponsiveMode';
 import { IAccessiblePopupProps } from '../../common/IAccessiblePopupProps';
 
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx
index b670f23f710d0..321c696b7f7f4 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx
@@ -3,7 +3,7 @@ import {
   BaseComponent,
   css,
 } from '../../Utilities';
-import { IDialogContentProps, DialogType } from './DialogContent.Props';
+import { IDialogContentProps, DialogType } from './DialogContent.types';
 import { IconButton } from '../../Button';
 import { DialogFooter } from './DialogFooter';
 import { withResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.Props.ts b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.types.ts
similarity index 97%
rename from packages/office-ui-fabric-react/src/components/Dialog/DialogContent.Props.ts
rename to packages/office-ui-fabric-react/src/components/Dialog/DialogContent.types.ts
index bf123e744613b..c0e4799f7ede9 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.types.ts
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { DialogContent } from './DialogContent';
-import { IButtonProps } from '../Button/Button.Props';
+import { IButtonProps } from '../Button/Button.types';
 import { ResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
 
 export interface IDialogContent {
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx
index f3a29a3e19487..a7fd2c7b80515 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogPage.tsx
@@ -43,7 +43,7 @@ export class DialogPage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Dialog/Dialog.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Dialog/Dialog.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/index.ts b/packages/office-ui-fabric-react/src/components/Dialog/index.ts
index 4ecd27afa03e7..0a40969d0aea4 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/index.ts
@@ -1,5 +1,5 @@
 export * from './Dialog';
 export * from './DialogContent';
 export * from './DialogFooter';
-export * from './Dialog.Props';
-export * from './DialogContent.Props';
\ No newline at end of file
+export * from './Dialog.types';
+export * from './DialogContent.types';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Divider/Divider.checklist.ts b/packages/office-ui-fabric-react/src/components/Divider/Divider.checklist.ts
index fa5abb6ebeba7..b2a0b771e6bf1 100644
--- a/packages/office-ui-fabric-react/src/components/Divider/Divider.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Divider/Divider.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const DividerStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Divider/DividerPage.tsx b/packages/office-ui-fabric-react/src/components/Divider/DividerPage.tsx
index b4c607a5e546d..01f777e885cc6 100644
--- a/packages/office-ui-fabric-react/src/components/Divider/DividerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Divider/DividerPage.tsx
@@ -33,7 +33,7 @@ export class DividerPage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Divider/VerticalDivider.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Divider/VerticalDivider.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.classNames.ts b/packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.classNames.ts
index 16b6fe3f0d551..a257bd7e768e1 100644
--- a/packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.classNames.ts
@@ -1,6 +1,6 @@
 import { memoizeFunction } from '../../Utilities';
 import { mergeStyleSets, ITheme } from '../../Styling';
-import { IVerticalDividerClassNames } from './VerticalDivider.Props';
+import { IVerticalDividerClassNames } from './VerticalDivider.types';
 
 export const getDividerClassNames = memoizeFunction((theme: ITheme): IVerticalDividerClassNames => {
   return mergeStyleSets({
diff --git a/packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.tsx b/packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.tsx
index 080d5fa021418..21c13b78ee3ee 100644
--- a/packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.tsx
+++ b/packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { getDividerClassNames } from './VerticalDivider.classNames';
-import { IVerticalDividerProps } from './VerticalDivider.Props';
+import { IVerticalDividerProps } from './VerticalDivider.types';
 import { getTheme } from '../../Styling';
 
 export const VerticalDivider = (props: IVerticalDividerProps) => {
diff --git a/packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.Props.ts b/packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.Props.ts
rename to packages/office-ui-fabric-react/src/components/Divider/VerticalDivider.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Divider/index.ts b/packages/office-ui-fabric-react/src/components/Divider/index.ts
index 240e0c86a3320..c5dd69d55dec7 100644
--- a/packages/office-ui-fabric-react/src/components/Divider/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Divider/index.ts
@@ -1,2 +1,2 @@
 export * from './VerticalDivider';
-export * from './VerticalDivider.Props';
+export * from './VerticalDivider.types';
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.checklist.ts b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.checklist.ts
index 162613a626a9e..422f59a665aaf 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const DocumentCardStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx
index 9f6f34f176c4f..dd381c1aa22ca 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { IDocumentCardProps, DocumentCardType } from './DocumentCard.Props';
+import { IDocumentCardProps, DocumentCardType } from './DocumentCard.types';
 import {
   BaseComponent,
   KeyCodes,
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.Props.ts b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.Props.ts
rename to packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActions.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActions.tsx
index 76f0363781f03..16358ba7505bb 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActions.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActions.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { BaseComponent, css } from '../../Utilities';
-import { IDocumentCardActionsProps } from './DocumentCard.Props';
+import { IDocumentCardActionsProps } from './DocumentCard.types';
 import { Icon } from '../../Icon';
 import { IconButton } from '../../Button';
 import * as stylesImport from './DocumentCard.scss';
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx
index 02c9bdf4d95a1..c2ac7856ff5fa 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { BaseComponent, css } from '../../Utilities';
-import { IDocumentCardActivityProps, IDocumentCardActivityPerson } from './DocumentCard.Props';
+import { IDocumentCardActivityProps, IDocumentCardActivityPerson } from './DocumentCard.types';
 import { PersonaSize } from '../../Persona';
 import { PersonaCoin } from '../../PersonaCoin';
 import * as stylesImport from './DocumentCard.scss';
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardLocation.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardLocation.tsx
index 4f62cca40b32e..edf27091ab815 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardLocation.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardLocation.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { BaseComponent, css } from '../../Utilities';
-import { IDocumentCardLocationProps } from './DocumentCard.Props';
+import { IDocumentCardLocationProps } from './DocumentCard.types';
 import * as stylesImport from './DocumentCard.scss';
 const styles: any = stylesImport;
 
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx
index 8fe82fd96cac4..0a875ffa7f05e 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx
@@ -46,7 +46,7 @@ export class DocumentCardPage extends React.Component<IComponentDemoPageProps, {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/DocumentCard/DocumentCard.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/DocumentCard/DocumentCard.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx
index 2b3ad1ac44a26..98d4bda776f02 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { IDocumentCardPreviewProps, IDocumentCardPreviewImage } from './DocumentCard.Props';
+import { IDocumentCardPreviewProps, IDocumentCardPreviewImage } from './DocumentCard.types';
 import { Image } from '../../Image';
 import { Icon } from '../../Icon';
 import {
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx
index a373470d16f9d..a541d4294dd06 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx
@@ -7,7 +7,7 @@ import {
   autobind,
   css
 } from '../../Utilities';
-import { IDocumentCardTitleProps } from './DocumentCard.Props';
+import { IDocumentCardTitleProps } from './DocumentCard.types';
 import * as stylesImport from './DocumentCard.scss';
 const styles: any = stylesImport;
 
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/index.ts b/packages/office-ui-fabric-react/src/components/DocumentCard/index.ts
index bd409464cc3c6..c8b71737fb487 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/index.ts
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/index.ts
@@ -1,5 +1,5 @@
 export * from './DocumentCard';
-export * from './DocumentCard.Props';
+export * from './DocumentCard.types';
 export * from './DocumentCardActions';
 export * from './DocumentCardActivity';
 export * from './DocumentCardLocation';
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.checklist.ts b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.checklist.ts
index 81b9ad868b078..67a0c4210d847 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const DropdownStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
index 66398e659b577..57b2001e3b1f8 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
@@ -10,7 +10,7 @@ import {
   KeyCodes,
 } from '../../Utilities';
 import { Dropdown } from './Dropdown';
-import { DropdownMenuItemType, IDropdownOption } from './Dropdown.Props';
+import { DropdownMenuItemType, IDropdownOption } from './Dropdown.types';
 
 const DEFAULT_OPTIONS: IDropdownOption[] = [
   { key: 'Header1', text: 'Header 1', itemType: DropdownMenuItemType.Header },
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 67b20eb592bc3..bad23f86d83b6 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { IDropdownProps, IDropdownOption, DropdownMenuItemType } from './Dropdown.Props';
+import { IDropdownProps, IDropdownOption, DropdownMenuItemType } from './Dropdown.types';
 import { Checkbox } from '../../Checkbox';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { Callout } from '../../Callout';
@@ -22,7 +22,7 @@ import {
   getFirstFocusable,
   getLastFocusable
 } from '../../Utilities';
-import { SelectableOptionMenuItemType } from '../../utilities/selectableOption/SelectableOption.Props';
+import { SelectableOptionMenuItemType } from '../../utilities/selectableOption/SelectableOption.types';
 import * as stylesImport from './Dropdown.scss';
 const styles: any = stylesImport;
 import { getStyles as getCheckboxStyles } from '../Checkbox/Checkbox.styles';
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.types.ts
similarity index 90%
rename from packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
rename to packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.types.ts
index 61d6b9badbab1..9763db46c53c3 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.types.ts
@@ -1,9 +1,9 @@
 import { IRenderFunction } from '../../Utilities';
-import { ISelectableOption } from '../../utilities/selectableOption/SelectableOption.Props';
-import { ISelectableDroppableTextProps } from '../../utilities/selectableOption/SelectableDroppableText.Props';
+import { ISelectableOption } from '../../utilities/selectableOption/SelectableOption.types';
+import { ISelectableDroppableTextProps } from '../../utilities/selectableOption/SelectableDroppableText.types';
 import { ResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
 
-export { SelectableOptionMenuItemType as DropdownMenuItemType } from '../../utilities/selectableOption/SelectableOption.Props';
+export { SelectableOptionMenuItemType as DropdownMenuItemType } from '../../utilities/selectableOption/SelectableOption.types';
 
 export interface IDropdown {
   focus: () => void;
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
index 1372240cdce20..2ede3082086e0 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
@@ -35,8 +35,8 @@ export class DropdownPage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Dropdown/Dropdown.Props.ts'),
-              require<string>('!raw-loader!office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Dropdown/Dropdown.types.ts'),
+              require<string>('!raw-loader!office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
index fbea2b97c9d6e..fcd22ae6a9940 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Dropdown } from 'office-ui-fabric-react/lib/Dropdown';
 import './Dropdown.Basic.Example.scss';
-import { DropdownMenuItemType, IDropdownOption, IDropdownProps } from './../Dropdown.Props';
+import { DropdownMenuItemType, IDropdownOption, IDropdownProps } from './../Dropdown.types';
 import { Icon } from '../../Icon';
 
 export class DropdownCustomExample extends React.Component<any, any> {
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/index.ts b/packages/office-ui-fabric-react/src/components/Dropdown/index.ts
index dc8695407b1b1..7b97b2e607fee 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/index.ts
@@ -1,2 +1,2 @@
 export * from './Dropdown';
-export * from './Dropdown.Props';
+export * from './Dropdown.types';
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.checklist.ts b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.checklist.ts
index fc1e45471d7c2..a2448ef236cca 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const FacepileStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
index 0cf824abb5f20..cd14fee7ee711 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
@@ -7,7 +7,7 @@ import * as renderer from 'react-test-renderer';
 import { mount, shallow } from 'enzyme';
 import { setRTL } from '../../Utilities';
 import { Facepile } from './Facepile';
-import { IFacepilePersona, OverflowButtonType } from './Facepile.Props';
+import { IFacepilePersona, OverflowButtonType } from './Facepile.types';
 import { PersonaSize } from '../Persona';
 import { PersonaCoin } from '../../PersonaCoin';
 import { TestImages } from '../../common/TestImages';
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
index 14519ad2a006c..e655465c1e8c2 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
@@ -11,7 +11,7 @@ import {
   IFacepileProps,
   IFacepilePersona,
   OverflowButtonType
-} from './Facepile.Props';
+} from './Facepile.types';
 import {
   FocusZone,
   FocusZoneDirection
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.Props.ts b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Facepile/Facepile.Props.ts
rename to packages/office-ui-fabric-react/src/components/Facepile/Facepile.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx b/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx
index 805be59f018e3..816ddf578e3f7 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/FacepilePage.tsx
@@ -38,7 +38,7 @@ export class FacepilePage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Facepile/Facepile.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Facepile/Facepile.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/index.ts b/packages/office-ui-fabric-react/src/components/Facepile/index.ts
index cdff20130b4e4..2f2c6fd8bf8ce 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Facepile/index.ts
@@ -1,2 +1,2 @@
-export * from './Facepile.Props';
+export * from './Facepile.types';
 export * from './Facepile';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
index 383fc2441a3dd..5e23cbb2631c2 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
@@ -10,7 +10,7 @@ import {
   getLastTabbable,
   getNextElement
 } from '../../Utilities';
-import { IFocusTrapZone, IFocusTrapZoneProps } from './FocusTrapZone.Props';
+import { IFocusTrapZone, IFocusTrapZoneProps } from './FocusTrapZone.types';
 
 export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implements IFocusTrapZone {
 
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.Props.ts b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.Props.ts
rename to packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZonePage.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZonePage.tsx
index b228b1cea1dbc..18150eaecd7d4 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZonePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZonePage.tsx
@@ -45,7 +45,7 @@ export class FocusTrapZonePage extends React.Component<IComponentDemoPageProps,
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/index.ts b/packages/office-ui-fabric-react/src/components/FocusTrapZone/index.ts
index 094b0f64d097b..196dbef261ec5 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/index.ts
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/index.ts
@@ -1,2 +1,2 @@
 export * from './FocusTrapZone';
-export * from './FocusTrapZone.Props';
+export * from './FocusTrapZone.types';
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
index 652537c01154a..cc2b4a32f9251 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
@@ -7,7 +7,7 @@ import * as ReactTestUtils from 'react-dom/test-utils';
 import { KeyCodes } from '../../Utilities';
 
 import { FocusZone } from './FocusZone';
-import { FocusZoneDirection } from './FocusZone.Props';
+import { FocusZoneDirection } from './FocusZone.types';
 
 describe('FocusZone', () => {
   let lastFocusedElement: HTMLElement | undefined;
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 73949cf3d2944..42fef6c7539bb 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -3,7 +3,7 @@ import {
   FocusZoneDirection,
   IFocusZone,
   IFocusZoneProps
-} from './FocusZone.Props';
+} from './FocusZone.types';
 import {
   BaseComponent,
   EventGroup,
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.Props.ts b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.Props.ts
rename to packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZonePage.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZonePage.tsx
index 75505c77e9088..2c7608aab2f50 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZonePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZonePage.tsx
@@ -35,7 +35,7 @@ export class FocusZonePage extends React.Component<IComponentDemoPageProps, {}>
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/FocusZone/FocusZone.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/index.ts b/packages/office-ui-fabric-react/src/components/FocusZone/index.ts
index d96d90f69501f..0de1350d5d3ba 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/index.ts
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/index.ts
@@ -1,2 +1,2 @@
 export * from './FocusZone';
-export * from './FocusZone.Props';
+export * from './FocusZone.types';
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.tsx
index a196f5fac76b0..dac0cb2d86161 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.tsx
@@ -3,7 +3,7 @@ import {
   BaseComponent,
   css
 } from '../../Utilities';
-import { IGroupDividerProps } from './GroupedList.Props';
+import { IGroupDividerProps } from './GroupedList.types';
 import { GroupSpacer } from './GroupSpacer';
 import * as stylesImport from './GroupFooter.scss';
 const styles: any = stylesImport;
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
index 9703ee83c2e2b..553a964dee25b 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
@@ -4,7 +4,7 @@ import {
   autobind,
   css
 } from '../../Utilities';
-import { IGroupDividerProps } from './GroupedList.Props';
+import { IGroupDividerProps } from './GroupedList.types';
 import { SelectionMode } from '../../utilities/selection/index';
 import { Check } from '../../Check';
 import { Icon } from '../../Icon';
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupShowAll.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupShowAll.tsx
index c2ad5346e540a..cf6a36be0f960 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupShowAll.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupShowAll.tsx
@@ -5,7 +5,7 @@ import {
   css
 } from '../../Utilities';
 import { Link } from '../../Link';
-import { IGroupDividerProps } from './GroupedList.Props';
+import { IGroupDividerProps } from './GroupedList.types';
 import { GroupSpacer } from './GroupSpacer';
 import * as stylesImport from './GroupShowAll.scss';
 const styles: any = stylesImport;
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.checklist.ts b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.checklist.ts
index 1b54a370b7227..137a703cbb5dc 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const GroupedListStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
index 1eab07874e635..8170e4b3f8d28 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
@@ -9,7 +9,7 @@ import {
   IGroupedList,
   IGroupedListProps,
   IGroup
-} from './GroupedList.Props';
+} from './GroupedList.types';
 import {
   GroupedListSection
 } from './GroupedListSection';
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts
rename to packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListPage.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListPage.tsx
index fcbfb8208b801..df8228539ddb0 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListPage.tsx
@@ -32,7 +32,7 @@ export class GroupedListPage extends React.Component<IComponentDemoPageProps, {}
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/GroupedList/GroupedList.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/GroupedList/GroupedList.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
index b173968a8698a..dbe28257e814e 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import {
   IGroup,
   IGroupDividerProps
-} from './GroupedList.Props';
+} from './GroupedList.types';
 
 import {
   IDragDropContext,
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/index.ts b/packages/office-ui-fabric-react/src/components/GroupedList/index.ts
index 020ac2d821e37..391f1d89a09eb 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/index.ts
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/index.ts
@@ -1,2 +1,2 @@
 export * from './GroupedList';
-export * from './GroupedList.Props';
+export * from './GroupedList.types';
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
index 06813d94a580e..910de2d9e8dc4 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
@@ -1,4 +1,4 @@
-import { IExpandingCardStyles } from './ExpandingCard.Props';
+import { IExpandingCardStyles } from './ExpandingCard.types';
 import { memoizeFunction } from '../../Utilities';
 import {
   concatStyleSets,
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
index d02730d870060..b3f3c943404be 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
@@ -8,7 +8,7 @@ import {
   customizable,
   autobind
 } from '../../Utilities';
-import { IExpandingCardProps, IExpandingCardStyles, ExpandingCardMode } from './ExpandingCard.Props';
+import { IExpandingCardProps, IExpandingCardStyles, ExpandingCardMode } from './ExpandingCard.types';
 import { Callout, ICallout } from '../../Callout';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { AnimationStyles, mergeStyles } from '../../Styling';
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts
rename to packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.checklist.ts b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.checklist.ts
index bbdf32955b900..a7952fc0f0b14 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const HoverCardStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.styles.ts b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.styles.ts
index 2887b298c51bd..40d3e46cbdd19 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.styles.ts
@@ -1,4 +1,4 @@
-import { IHoverCardStyles } from './HoverCard.Props';
+import { IHoverCardStyles } from './HoverCard.types';
 import { memoizeFunction } from '../../Utilities';
 import {
   mergeStyleSets
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
index dae1da029a6a0..2624882b644bd 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
@@ -14,9 +14,9 @@ import {
   mergeStyles
 } from '../../Styling';
 
-import { IHoverCardProps, IHoverCardStyles } from './HoverCard.Props';
+import { IHoverCardProps, IHoverCardStyles } from './HoverCard.types';
 import { ExpandingCard } from './ExpandingCard';
-import { ExpandingCardMode } from './ExpandingCard.Props';
+import { ExpandingCardMode } from './ExpandingCard.types';
 import { getStyles } from './HoverCard.styles';
 import { FocusTrapZone } from 'office-ui-fabric-react/lib/FocusTrapZone';
 
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.types.ts
similarity index 97%
rename from packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts
rename to packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.types.ts
index 87260956771d7..74bd1b29fdd85 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.types.ts
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { HoverCard } from './HoverCard';
-import { IExpandingCardProps } from './ExpandingCard.Props';
+import { IExpandingCardProps } from './ExpandingCard.types';
 import { IStyle } from '../../Styling';
 
 export interface IHoverCard {
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx
index 45f83b6e5a816..12e54e12d8db9 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx
@@ -35,8 +35,8 @@ export class HoverCardPage extends React.Component<any, any> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/HoverCard/HoverCard.Props.ts'),
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/HoverCard/ExpandingCard.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/HoverCard/HoverCard.types.ts'),
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/HoverCard/ExpandingCard.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/index.ts b/packages/office-ui-fabric-react/src/components/HoverCard/index.ts
index 6d84f0dc08289..db320c463b7f9 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/index.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/index.ts
@@ -1,5 +1,5 @@
 export * from './ExpandingCard';
-export * from './ExpandingCard.Props';
+export * from './ExpandingCard.types';
 export * from './HoverCard';
-export * from './HoverCard.Props';
+export * from './HoverCard.types';
 export * from '../../common/DirectionalHint';
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.checklist.ts b/packages/office-ui-fabric-react/src/components/Icon/Icon.checklist.ts
index 1153265f3dfcb..c3b4404f371f7 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const IconStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.classNames.ts b/packages/office-ui-fabric-react/src/components/Icon/Icon.classNames.ts
index 56f16bbee36f3..1ffeae4eff098 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.classNames.ts
@@ -4,7 +4,7 @@ import {
 import {
   memoizeFunction
 } from '../../Utilities';
-import { IIconStyles } from './Icon.Props';
+import { IIconStyles } from './Icon.types';
 
 export interface IIconClassNames {
   root?: string;
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
index cc3908cfd5566..c3083e8d0af0d 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
@@ -1,7 +1,7 @@
 /* tslint:disable */
 import * as React from 'react';
 /* tslint:enable */
-import { IIconProps, IconType } from './Icon.Props';
+import { IIconProps, IconType } from './Icon.types';
 import { Image } from '../Image/Image';
 import {
   css,
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts b/packages/office-ui-fabric-react/src/components/Icon/Icon.types.ts
similarity index 96%
rename from packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
rename to packages/office-ui-fabric-react/src/components/Icon/Icon.types.ts
index b09195c22abbe..c776f1cfcee22 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.types.ts
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { IImageProps } from '../Image/Image.Props';
+import { IImageProps } from '../Image/Image.types';
 import { IStyle } from '../../Styling';
 
 // Please keep alphabetized
diff --git a/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx b/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx
index aeac142401e5c..0dda3185b9725 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx
@@ -42,7 +42,7 @@ export class IconPage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Icon/Icon.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Icon/Icon.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Icon/index.ts b/packages/office-ui-fabric-react/src/components/Icon/index.ts
index cef858770bec8..028cac5b430ff 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/index.ts
@@ -1,2 +1,2 @@
 export * from './Icon';
-export * from './Icon.Props';
\ No newline at end of file
+export * from './Icon.types';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.checklist.ts b/packages/office-ui-fabric-react/src/components/Image/Image.checklist.ts
index c2c47765cc6e6..9c5347c2a6082 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const ImageStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
index b04b9cdb5c6c8..c587e9b95fb88 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
@@ -8,7 +8,7 @@ import * as renderer from 'react-test-renderer';
 import { shallow, mount, ReactWrapper } from 'enzyme';
 
 import { Image } from './Image';
-import { ImageFit, ImageLoadState } from './Image.Props';
+import { ImageFit, ImageLoadState } from './Image.types';
 
 /* tslint:disable:no-unused-variable */
 const testImage1x1 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQImWP4DwQACfsD/eNV8pwAAAAASUVORK5CYII=';
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.tsx
index 0845233e5c439..e36e4b59b44c3 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.tsx
@@ -8,7 +8,7 @@ import {
   getNativeProps,
   imageProperties
 } from '../../Utilities';
-import { IImageProps, ImageFit, ImageLoadState, ImageCoverStyle } from './Image.Props';
+import { IImageProps, ImageFit, ImageLoadState, ImageCoverStyle } from './Image.types';
 import { AnimationClassNames } from '../../Styling';
 import * as stylesImport from './Image.scss';
 const styles: any = stylesImport;
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.Props.ts b/packages/office-ui-fabric-react/src/components/Image/Image.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Image/Image.Props.ts
rename to packages/office-ui-fabric-react/src/components/Image/Image.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx b/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx
index 4cdca42b2b48e..ce9968bd82a4d 100644
--- a/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx
@@ -53,7 +53,7 @@ export class ImagePage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Image/Image.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Image/Image.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Image/index.ts b/packages/office-ui-fabric-react/src/components/Image/index.ts
index 9e8471e5509c9..7ce5fb2695f75 100644
--- a/packages/office-ui-fabric-react/src/components/Image/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Image/index.ts
@@ -1,2 +1,2 @@
 export * from './Image';
-export * from './Image.Props';
+export * from './Image.types';
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.checklist.ts b/packages/office-ui-fabric-react/src/components/Label/Label.checklist.ts
index ba4f78eda5b3a..3fc2bed732961 100644
--- a/packages/office-ui-fabric-react/src/components/Label/Label.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Label/Label.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const LabelStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.tsx b/packages/office-ui-fabric-react/src/components/Label/Label.tsx
index 3cdd497ceaf53..8a0b64343f9fd 100644
--- a/packages/office-ui-fabric-react/src/components/Label/Label.tsx
+++ b/packages/office-ui-fabric-react/src/components/Label/Label.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { BaseComponent, divProperties, getNativeProps, customizable } from '../../Utilities';
-import { ILabelProps } from './Label.Props';
+import { ILabelProps } from './Label.types';
 import { getLabelClassNames } from './Label.classNames';
 
 @customizable('Label', ['theme'])
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.Props.ts b/packages/office-ui-fabric-react/src/components/Label/Label.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Label/Label.Props.ts
rename to packages/office-ui-fabric-react/src/components/Label/Label.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx b/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx
index c32faf90f29fd..69a28a5b819d3 100644
--- a/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx
@@ -25,7 +25,7 @@ export class LabelPage extends React.Component<IComponentDemoPageProps, any> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Label/Label.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Label/Label.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Label/index.ts b/packages/office-ui-fabric-react/src/components/Label/index.ts
index 3dbdb3d091c2c..c4d4a2cb3f5a3 100644
--- a/packages/office-ui-fabric-react/src/components/Label/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Label/index.ts
@@ -1,2 +1,2 @@
 export * from './Label';
-export * from './Label.Props';
\ No newline at end of file
+export * from './Label.types';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.checklist.ts b/packages/office-ui-fabric-react/src/components/Layer/Layer.checklist.ts
index 24b86d63fb117..3d153cbea22b1 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/Layer.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const LayerStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx b/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx
index 546e444787e22..ad7b7b0845d11 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx
@@ -4,7 +4,7 @@ import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
 
 import { Fabric } from '../../Fabric';
-import { ILayerProps } from './Layer.Props';
+import { ILayerProps } from './Layer.types';
 import { css, BaseComponent, getDocument, setVirtualParent } from '../../Utilities';
 import * as stylesImport from './Layer.scss';
 const styles: any = stylesImport;
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.Props.ts b/packages/office-ui-fabric-react/src/components/Layer/Layer.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Layer/Layer.Props.ts
rename to packages/office-ui-fabric-react/src/components/Layer/Layer.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Layer/LayerHost.tsx b/packages/office-ui-fabric-react/src/components/Layer/LayerHost.tsx
index 4d037845aff5e..39e65356ab1c2 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/LayerHost.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/LayerHost.tsx
@@ -6,7 +6,7 @@ import {
 import {
   Layer
 } from './Layer';
-import { ILayerHostProps } from './LayerHost.Props';
+import { ILayerHostProps } from './LayerHost.types';
 
 export class LayerHost extends BaseComponent<ILayerHostProps, {}> {
 
diff --git a/packages/office-ui-fabric-react/src/components/Layer/LayerHost.Props.ts b/packages/office-ui-fabric-react/src/components/Layer/LayerHost.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Layer/LayerHost.Props.ts
rename to packages/office-ui-fabric-react/src/components/Layer/LayerHost.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Layer/LayerPage.tsx b/packages/office-ui-fabric-react/src/components/Layer/LayerPage.tsx
index 6230fc5a4fa53..23e6f79db7c0f 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/LayerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/LayerPage.tsx
@@ -33,7 +33,7 @@ export class LayerPage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Layer/Layer.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Layer/Layer.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Layer/index.ts b/packages/office-ui-fabric-react/src/components/Layer/index.ts
index e0c07555deb8a..f30c19d62bfd1 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Layer/index.ts
@@ -1,3 +1,3 @@
 export * from './Layer';
-export * from './Layer.Props';
+export * from './Layer.types';
 export * from './LayerHost';
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.checklist.ts b/packages/office-ui-fabric-react/src/components/Link/Link.checklist.ts
index c716970297cbd..061c777ed1929 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const LinkStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.tsx b/packages/office-ui-fabric-react/src/components/Link/Link.tsx
index 4dc25e04b5064..75fbb2d19dccd 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.tsx
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.tsx
@@ -7,7 +7,7 @@ import {
   css,
   getNativeProps
 } from '../../Utilities';
-import { ILink, ILinkProps } from './Link.Props';
+import { ILink, ILinkProps } from './Link.types';
 import * as stylesImport from './Link.scss';
 const styles: any = stylesImport;
 
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.Props.ts b/packages/office-ui-fabric-react/src/components/Link/Link.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Link/Link.Props.ts
rename to packages/office-ui-fabric-react/src/components/Link/Link.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx b/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx
index 4e28bf8181b91..ccd434fea1b2f 100644
--- a/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx
@@ -25,7 +25,7 @@ export class LinkPage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Link/Link.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Link/Link.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Link/index.ts b/packages/office-ui-fabric-react/src/components/Link/index.ts
index ac3d784d97918..cf4cc744d66af 100644
--- a/packages/office-ui-fabric-react/src/components/Link/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Link/index.ts
@@ -1,2 +1,2 @@
 export * from './Link';
-export * from './Link.Props';
+export * from './Link.types';
diff --git a/packages/office-ui-fabric-react/src/components/List/List.checklist.ts b/packages/office-ui-fabric-react/src/components/List/List.checklist.ts
index a132f46f10b20..ad996d0c00025 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/List/List.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const ListStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index dd8542d3b12bc..9c8c6022a322f 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -11,7 +11,7 @@ import {
   IRenderFunction,
   autobind
 } from '../../Utilities';
-import { IList, IListProps, IPage, IPageProps } from './List.Props';
+import { IList, IListProps, IPage, IPageProps } from './List.types';
 
 const RESIZE_DELAY = 16;
 const MIN_SCROLL_UPDATE_DELAY = 100;
diff --git a/packages/office-ui-fabric-react/src/components/List/List.Props.ts b/packages/office-ui-fabric-react/src/components/List/List.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/List/List.Props.ts
rename to packages/office-ui-fabric-react/src/components/List/List.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/List/ListPage.tsx b/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
index 1e2ec931fc568..91b22fe8d35fd 100644
--- a/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
@@ -46,7 +46,7 @@ export class ListPage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/List/List.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/List/List.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/List/index.ts b/packages/office-ui-fabric-react/src/components/List/index.ts
index 156da2d92ce11..1f589379b504e 100644
--- a/packages/office-ui-fabric-react/src/components/List/index.ts
+++ b/packages/office-ui-fabric-react/src/components/List/index.ts
@@ -1,2 +1,2 @@
 export * from './List';
-export * from './List.Props';
+export * from './List.types';
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
index a9fae0a1631f9..13450bab7b0ff 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
@@ -13,7 +13,7 @@ import {
   getRTL
 } from '../../Utilities';
 
-import { IMarqueeSelectionProps } from './MarqueeSelection.Props';
+import { IMarqueeSelectionProps } from './MarqueeSelection.types';
 const styles: any = stylesImport;
 
 export interface IMarqueeSelectionState {
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.Props.ts b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.Props.ts
rename to packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.checklist.ts b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.checklist.ts
index 0767ffb80ddee..4e2a563d6ca98 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const MessageBarStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
index fc1ae9b3afc7f..1a4fdd2459b1d 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
@@ -7,7 +7,7 @@ import {
 } from '../../Utilities';
 import { IconButton } from '../../Button';
 import { Icon } from '../../Icon';
-import { IMessageBarProps, MessageBarType } from './MessageBar.Props';
+import { IMessageBarProps, MessageBarType } from './MessageBar.types';
 import * as stylesImport from './MessageBar.scss';
 const styles: any = stylesImport;
 
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.Props.ts b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.Props.ts
rename to packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBarPage.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBarPage.tsx
index efabdbc645e86..c8ad8e9461a73 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBarPage.tsx
@@ -28,7 +28,7 @@ export class MessageBarPage extends React.Component<IComponentDemoPageProps, {}>
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/MessageBar/MessageBar.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/index.ts b/packages/office-ui-fabric-react/src/components/MessageBar/index.ts
index 65e4430cf4ac0..58de50093190a 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/index.ts
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/index.ts
@@ -1,2 +1,2 @@
 export * from './MessageBar';
-export * from './MessageBar.Props';
+export * from './MessageBar.types';
diff --git a/packages/office-ui-fabric-react/src/components/Modal/Modal.checklist.ts b/packages/office-ui-fabric-react/src/components/Modal/Modal.checklist.ts
index fa52bea0df42e..ef5f7b39dd1b6 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/Modal.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Modal/Modal.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const ModalStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx b/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
index 508f34e80bad9..50a068c074b93 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
+++ b/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
@@ -5,7 +5,7 @@ import {
   getId
 } from '../../Utilities';
 import { FocusTrapZone, IFocusTrapZone } from '../FocusTrapZone/index';
-import { IModalProps, IModal } from './Modal.Props';
+import { IModalProps, IModal } from './Modal.types';
 import { Overlay } from '../../Overlay';
 import { Layer } from '../../Layer';
 import { Popup } from '../Popup/index';
diff --git a/packages/office-ui-fabric-react/src/components/Modal/Modal.Props.ts b/packages/office-ui-fabric-react/src/components/Modal/Modal.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Modal/Modal.Props.ts
rename to packages/office-ui-fabric-react/src/components/Modal/Modal.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Modal/ModalPage.tsx b/packages/office-ui-fabric-react/src/components/Modal/ModalPage.tsx
index 0fef87a291877..2e9c33c7742fe 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/ModalPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Modal/ModalPage.tsx
@@ -28,7 +28,7 @@ export class ModalPage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Modal/Modal.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Modal/Modal.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Modal/index.ts b/packages/office-ui-fabric-react/src/components/Modal/index.ts
index 0f23b1a6a83f9..748eaa8a79514 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Modal/index.ts
@@ -1,2 +1,2 @@
 export * from './Modal';
-export * from './Modal.Props';
\ No newline at end of file
+export * from './Modal.types';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.checklist.ts b/packages/office-ui-fabric-react/src/components/Nav/Nav.checklist.ts
index e722ef184a9c1..71f14648d0c0b 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const NavStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
index 4c33352e9b3d0..5688b2ce90c41 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
@@ -18,7 +18,7 @@ import {
   INavProps,
   INavLinkGroup,
   INavLink
-} from './Nav.Props';
+} from './Nav.types';
 
 // The number pixels per indentation level for Nav links.
 const _indentationSize: number = 14;
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.Props.ts b/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Nav/Nav.Props.ts
rename to packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Nav/NavPage.tsx b/packages/office-ui-fabric-react/src/components/Nav/NavPage.tsx
index 2d5c069002932..92bd70d1a9d99 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/NavPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/NavPage.tsx
@@ -42,7 +42,7 @@ export class NavPage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Nav/Nav.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Nav/Nav.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Nav/index.ts b/packages/office-ui-fabric-react/src/components/Nav/index.ts
index f8caf98e3b632..b80f279c0d1f0 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Nav/index.ts
@@ -1,2 +1,2 @@
 export * from './Nav';
-export * from './Nav.Props';
+export * from './Nav.types';
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.checklist.ts b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.checklist.ts
index d0195578f4853..0ad496720397f 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const OverflowSetStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
index 609b1419c47cd..e151126bddb1a 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
@@ -5,7 +5,7 @@ import {
   BaseComponent
 } from '../../Utilities';
 import { mergeStyles } from '../../Styling';
-import { IOverflowSet, IOverflowSetProps } from './OverflowSet.Props';
+import { IOverflowSet, IOverflowSetProps } from './OverflowSet.types';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 
 import * as stylesImport from './OverflowSet.scss';
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.Props.ts b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.Props.ts
rename to packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSetPage.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSetPage.tsx
index af2ce310077f5..e860d74cc853f 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSetPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSetPage.tsx
@@ -45,7 +45,7 @@ export class OverflowSetPage extends React.Component<any, any> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/OverflowSet/OverflowSet.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/OverflowSet/OverflowSet.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/index.ts b/packages/office-ui-fabric-react/src/components/OverflowSet/index.ts
index 24d67e9dadc93..d9747b665c2bb 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/index.ts
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/index.ts
@@ -1,2 +1,2 @@
 export * from './OverflowSet';
-export * from './OverflowSet.Props';
+export * from './OverflowSet.types';
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.checklist.ts b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.checklist.ts
index 507b8190f8c5e..a9f72aa27bc1b 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const OverlayStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.tsx b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.tsx
index ae13e65e20bfe..a76d03bef5c66 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.tsx
@@ -7,7 +7,7 @@ import {
   enableBodyScroll,
   disableBodyScroll
 } from '../../Utilities';
-import { IOverlayProps } from './Overlay.Props';
+import { IOverlayProps } from './Overlay.types';
 
 import * as stylesImport from './Overlay.scss';
 const styles: any = stylesImport;
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.Props.ts b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Overlay/Overlay.Props.ts
rename to packages/office-ui-fabric-react/src/components/Overlay/Overlay.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx b/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx
index b831a74ba0d9e..56c21085b6fd0 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx
@@ -32,7 +32,7 @@ export class OverlayPage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Overlay/Overlay.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Overlay/Overlay.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/index.ts b/packages/office-ui-fabric-react/src/components/Overlay/index.ts
index 0a36e12bb21d5..34cc685fc4bb3 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Overlay/index.ts
@@ -1,2 +1,2 @@
 export * from './Overlay';
-export * from './Overlay.Props';
+export * from './Overlay.types';
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.checklist.ts b/packages/office-ui-fabric-react/src/components/Panel/Panel.checklist.ts
index 6cc5f104a06ca..769a475c524ff 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const PanelStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
index 6ea1c6edf1c64..58f01f9ed9635 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
@@ -10,7 +10,7 @@ import {
   getRTL
 } from '../../Utilities';
 import { FocusTrapZone } from '../FocusTrapZone/index';
-import { IPanel, IPanelProps, PanelType } from './Panel.Props';
+import { IPanel, IPanelProps, PanelType } from './Panel.types';
 import { Layer } from '../Layer/Layer';
 import { Overlay } from '../../Overlay';
 import { Popup } from '../../Popup';
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.Props.ts b/packages/office-ui-fabric-react/src/components/Panel/Panel.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Panel/Panel.Props.ts
rename to packages/office-ui-fabric-react/src/components/Panel/Panel.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx b/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
index 21f22c39a14c4..bf85e0d5bae54 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
@@ -83,7 +83,7 @@ export class PanelPage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Panel/Panel.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Panel/Panel.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/index.ts b/packages/office-ui-fabric-react/src/components/Panel/index.ts
index a054b2fab8686..f64ded529acd0 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Panel/index.ts
@@ -1,2 +1,2 @@
 export * from './Panel';
-export * from './Panel.Props';
+export * from './Panel.types';
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.checklist.ts b/packages/office-ui-fabric-react/src/components/Persona/Persona.checklist.ts
index 141afbbd2c317..75b89d86d8469 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const PersonaStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
index 4ffbe768123c8..12a37f0c16b93 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 import * as renderer from 'react-test-renderer';
 import { setRTL } from '../../Utilities';
 import { Persona } from './Persona';
-import { PersonaInitialsColor } from './Persona.Props';
+import { PersonaInitialsColor } from './Persona.types';
 import { mount, ReactWrapper } from 'enzyme';
 
 const testImage1x1 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQImWP4DwQACfsD/eNV8pwAAAAASUVORK5CYII=';
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index a646a331cf7cd..89c45907b301c 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -13,7 +13,7 @@ import {
   IPersonaProps,
   PersonaPresence as PersonaPresenceEnum,
   PersonaSize
-} from './Persona.Props';
+} from './Persona.types';
 import {
   PERSONA_PRESENCE,
   PERSONA_SIZE
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts b/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Persona/Persona.Props.ts
rename to packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
index c5d7eff243c02..953a2a3ebd97f 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
@@ -14,7 +14,7 @@ import {
   PersonaPresence as PersonaPresenceEnum,
   PersonaInitialsColor,
   PersonaSize
-} from './Persona.Props';
+} from './Persona.types';
 import {
   PERSONA_INITIALS_COLOR,
   PERSONA_SIZE
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts b/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
index 03873d13c388b..35f3f4342ac01 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
@@ -2,7 +2,7 @@ import {
   PersonaInitialsColor,
   PersonaPresence,
   PersonaSize
-} from './Persona.Props';
+} from './Persona.types';
 import * as stylesImport from './Persona.scss';
 const styles: any = stylesImport;
 
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
index 645ccf305ea3f..f75f43d92cd08 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
@@ -42,7 +42,7 @@ export class PersonaPage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Persona/Persona.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Persona/Persona.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaPresence.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaPresence.tsx
index e14c1fea81115..5e1f8c2114220 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaPresence.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaPresence.tsx
@@ -7,7 +7,7 @@ import { Icon } from '../../Icon';
 import {
   IPersonaProps,
   PersonaPresence as PersonaPresenceEnum
-} from './Persona.Props';
+} from './Persona.types';
 import * as stylesImport from './Persona.scss';
 const styles: any = stylesImport;
 
diff --git a/packages/office-ui-fabric-react/src/components/Persona/index.ts b/packages/office-ui-fabric-react/src/components/Persona/index.ts
index 59b5e2e9efa51..02000b4bd6c32 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/index.ts
@@ -1,4 +1,4 @@
 export * from './Persona';
-export * from './Persona.Props';
+export * from './Persona.types';
 export * from './PersonaConsts';
 export * from './PersonaCoin';
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.checklist.ts b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.checklist.ts
index b444443897df5..f1d8b4260cf69 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const PivotStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
index 72c531c7ac7a9..042b75a0625c2 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
@@ -7,12 +7,12 @@ import {
   autobind
 } from '../../Utilities';
 import { CommandButton } from '../../Button';
-import { IPivotProps } from './Pivot.Props';
-import { IPivotItemProps } from './PivotItem.Props';
+import { IPivotProps } from './Pivot.types';
+import { IPivotItemProps } from './PivotItem.types';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { PivotItem } from './PivotItem';
-import { PivotLinkFormat } from './Pivot.Props';
-import { PivotLinkSize } from './Pivot.Props';
+import { PivotLinkFormat } from './Pivot.types';
+import { PivotLinkSize } from './Pivot.types';
 import { Icon } from '../../Icon';
 import * as stylesImport from './Pivot.scss';
 const styles: any = stylesImport;
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.Props.ts b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Pivot/Pivot.Props.ts
rename to packages/office-ui-fabric-react/src/components/Pivot/Pivot.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/PivotItem.tsx b/packages/office-ui-fabric-react/src/components/Pivot/PivotItem.tsx
index 90db0e917daa2..ed5c5ea8a10f4 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/PivotItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/PivotItem.tsx
@@ -4,7 +4,7 @@ import {
   getNativeProps,
   divProperties
 } from '../../Utilities';
-import { IPivotItemProps } from './PivotItem.Props';
+import { IPivotItemProps } from './PivotItem.types';
 
 export class PivotItem extends BaseComponent<IPivotItemProps, {}> {
 
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/PivotItem.Props.ts b/packages/office-ui-fabric-react/src/components/Pivot/PivotItem.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Pivot/PivotItem.Props.ts
rename to packages/office-ui-fabric-react/src/components/Pivot/PivotItem.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx b/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx
index e93926b85c057..cd09643857ae1 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx
@@ -72,7 +72,7 @@ export class PivotPage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Pivot/Pivot.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Pivot/Pivot.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/index.ts b/packages/office-ui-fabric-react/src/components/Pivot/index.ts
index ca8327fbf5787..666c1856e32a4 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Pivot/index.ts
@@ -1,4 +1,4 @@
 export * from './Pivot';
 export { PivotItem as PivotItem } from './PivotItem';
-export * from './Pivot.Props';
-export * from './PivotItem.Props';
+export * from './Pivot.types';
+export * from './PivotItem.types';
diff --git a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
index d65de7ac4c895..31c6999b4db98 100644
--- a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
+++ b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
@@ -8,7 +8,7 @@ import {
   getNativeProps,
   autobind
 } from '../../Utilities';
-import { IPopupProps } from './Popup.Props';
+import { IPopupProps } from './Popup.types';
 
 /**
  * This adds accessibility to Dialog and Panel controls
diff --git a/packages/office-ui-fabric-react/src/components/Popup/Popup.Props.ts b/packages/office-ui-fabric-react/src/components/Popup/Popup.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Popup/Popup.Props.ts
rename to packages/office-ui-fabric-react/src/components/Popup/Popup.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Popup/index.ts b/packages/office-ui-fabric-react/src/components/Popup/index.ts
index 3aa99253b3160..17b5480324716 100644
--- a/packages/office-ui-fabric-react/src/components/Popup/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Popup/index.ts
@@ -1,2 +1,2 @@
 export * from './Popup';
-export * from './Popup.Props';
\ No newline at end of file
+export * from './Popup.types';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.checklist.ts b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.checklist.ts
index 8c72575be1e78..95f1c190590af 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const ProgressIndicatorStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx
index 2b432fa324896..7201a03476865 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx
@@ -6,7 +6,7 @@ import {
   BaseComponent,
   css
 } from '../../Utilities';
-import { IProgressIndicatorProps } from './ProgressIndicator.Props';
+import { IProgressIndicatorProps } from './ProgressIndicator.types';
 import * as stylesImport from './ProgressIndicator.scss';
 const styles: any = stylesImport;
 
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.Props.ts b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.Props.ts
rename to packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx
index f1d9d22a14008..9160c86d0de5c 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx
@@ -25,7 +25,7 @@ export class ProgressIndicatorPage extends React.Component<IComponentDemoPagePro
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/index.ts b/packages/office-ui-fabric-react/src/components/ProgressIndicator/index.ts
index da7bb1d72f162..c03c55d7411bb 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/index.ts
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/index.ts
@@ -1,2 +1,2 @@
 export * from './ProgressIndicator';
-export * from './ProgressIndicator.Props';
+export * from './ProgressIndicator.types';
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.checklist.ts b/packages/office-ui-fabric-react/src/components/Rating/Rating.checklist.ts
index 22de4fed8005c..423b8e53b9de1 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const RatingStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx b/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
index d47c366441514..2548f086097f4 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
@@ -5,7 +5,7 @@ import {
   getId
 } from '../../Utilities';
 import { Icon } from '../../Icon';
-import { IRatingProps, RatingSize } from './Rating.Props';
+import { IRatingProps, RatingSize } from './Rating.types';
 import * as stylesImport from './Rating.scss';
 const styles: any = stylesImport;
 
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.Props.ts b/packages/office-ui-fabric-react/src/components/Rating/Rating.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Rating/Rating.Props.ts
rename to packages/office-ui-fabric-react/src/components/Rating/Rating.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Rating/RatingPage.tsx b/packages/office-ui-fabric-react/src/components/Rating/RatingPage.tsx
index 4ea8d77409dbe..476537b62615c 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/RatingPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/RatingPage.tsx
@@ -25,7 +25,7 @@ export class RatingPage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Rating/Rating.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Rating/Rating.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Rating/index.ts b/packages/office-ui-fabric-react/src/components/Rating/index.ts
index 6b8b34e61a446..cb6acba281af4 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Rating/index.ts
@@ -1,2 +1,2 @@
 export * from './Rating';
-export * from './Rating.Props';
\ No newline at end of file
+export * from './Rating.types';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.checklist.ts b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.checklist.ts
index feed33c35d411..798fb22063458 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const ResizeGroupStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
index b91b924e399e8..8b05c2bca0454 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { shallow } from 'enzyme';
 
 import { ResizeGroup, IResizeGroupState, getNextResizeGroupStateProvider, getMeasurementCache } from './ResizeGroup';
-import { IResizeGroupProps } from './ResizeGroup.Props';
+import { IResizeGroupProps } from './ResizeGroup.types';
 import * as sinon from 'sinon';
 
 interface ITestScalingData {
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index e8119d512fad2..4ceaadf211353 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -3,7 +3,7 @@ import {
   css,
   BaseComponent
 } from '../../Utilities';
-import { IResizeGroupProps } from './ResizeGroup.Props';
+import { IResizeGroupProps } from './ResizeGroup.types';
 import * as styles from './ResizeGroup.scss';
 
 const RESIZE_DELAY = 16;
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts
rename to packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
index 9e7a81ba41798..f19254ae4b7c8 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
@@ -34,7 +34,7 @@ export class ResizeGroupPage extends React.Component<IComponentDemoPageProps, an
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/index.ts b/packages/office-ui-fabric-react/src/components/ResizeGroup/index.ts
index 16254cca3279d..40c9ea942c650 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/index.ts
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/index.ts
@@ -1,2 +1,2 @@
 export * from './ResizeGroup';
-export * from './ResizeGroup.Props';
\ No newline at end of file
+export * from './ResizeGroup.types';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.checklist.ts b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.checklist.ts
index 39f39ec073c75..d390a4adb6908 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const ScrollablePaneStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
index 00cefe71ef610..317484d1a3994 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
@@ -8,7 +8,7 @@ import {
   BaseComponent,
   css
 } from '../../Utilities';
-import { IScrollablePane, IScrollablePaneProps } from './ScrollablePane.Props';
+import { IScrollablePane, IScrollablePaneProps } from './ScrollablePane.types';
 import { Sticky } from '../../Sticky';
 import * as stylesImport from './ScrollablePane.scss';
 const styles: any = stylesImport;
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.Props.ts b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.Props.ts
rename to packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
index 97722372986fc..933f480450cf5 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
@@ -33,7 +33,7 @@ export class ScrollablePanePage extends React.Component<IComponentDemoPageProps,
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/index.ts b/packages/office-ui-fabric-react/src/components/ScrollablePane/index.ts
index 5d72420fb3e66..cbbef7d04f0e7 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/index.ts
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/index.ts
@@ -1,2 +1,2 @@
 export * from './ScrollablePane';
-export * from './ScrollablePane.Props';
+export * from './ScrollablePane.types';
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.checklist.ts b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.checklist.ts
index aa85969dd764f..e5ee223defe1e 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const SearchBoxStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
index c4b525a3a2b95..f8cc527257e95 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { ISearchBoxProps } from './SearchBox.Props';
+import { ISearchBoxProps } from './SearchBox.types';
 import {
   BaseComponent,
   autobind,
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts
rename to packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
index 4ed8e38691263..d8e4ff0d94ddc 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBoxPage.tsx
@@ -55,7 +55,7 @@ export class SearchBoxPage extends React.Component<IComponentDemoPageProps, {}>
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/SearchBox/SearchBox.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/index.ts b/packages/office-ui-fabric-react/src/components/SearchBox/index.ts
index 620d4f49fccdc..47af0244f9f49 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/index.ts
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/index.ts
@@ -1,2 +1,2 @@
 export * from './SearchBox';
-export * from './SearchBox.Props';
\ No newline at end of file
+export * from './SearchBox.types';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.checklist.ts b/packages/office-ui-fabric-react/src/components/Slider/Slider.checklist.ts
index 063d37eccc149..e607e7c82f0f1 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const SliderStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
index 4a0645f7aaffd..e5969c31c6c9e 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
@@ -7,7 +7,7 @@ import * as ReactTestUtils from 'react-dom/test-utils';
 import * as renderer from 'react-test-renderer';
 
 import { Slider } from './Slider';
-import { ISlider } from './Slider.Props';
+import { ISlider } from './Slider.types';
 
 describe('Slider', () => {
 
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
index 660be33e3fad9..afde5e2399d8c 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
@@ -8,7 +8,7 @@ import {
   getRTL,
   getRTLSafeKeyCode
 } from '../../Utilities';
-import { ISliderProps, ISlider } from './Slider.Props';
+import { ISliderProps, ISlider } from './Slider.types';
 import { Label } from '../../Label';
 import * as stylesImport from './Slider.scss';
 const styles: any = stylesImport;
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.Props.ts b/packages/office-ui-fabric-react/src/components/Slider/Slider.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Slider/Slider.Props.ts
rename to packages/office-ui-fabric-react/src/components/Slider/Slider.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Slider/SliderPage.tsx b/packages/office-ui-fabric-react/src/components/Slider/SliderPage.tsx
index 7b25458b041c7..b14469fdf530f 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/SliderPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/SliderPage.tsx
@@ -25,7 +25,7 @@ export class SliderPage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Slider/Slider.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Slider/Slider.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Slider/index.ts b/packages/office-ui-fabric-react/src/components/Slider/index.ts
index 8f57f89876491..1651b69e2cfb2 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Slider/index.ts
@@ -1,2 +1,2 @@
 export * from './Slider';
-export * from './Slider.Props';
\ No newline at end of file
+export * from './Slider.types';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.checklist.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.checklist.ts
index 43a63ba9e4834..132bfd01d87e6 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const SpinButtonStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts
index 1986ae5dda789..4da46493fa6fe 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.classNames.ts
@@ -1,6 +1,6 @@
 import { memoizeFunction } from '../../Utilities';
 import { mergeStyles, IStyle } from '../../Styling';
-import { ISpinButtonStyles } from './SpinButton.Props';
+import { ISpinButtonStyles } from './SpinButton.types';
 import { KeyboardSpinDirection } from './SpinButton';
 import { Position } from '../../utilities/positioning';
 
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
index e3238456fd98b..2e45b3f34bf84 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
@@ -6,7 +6,7 @@ import {
 } from '../../Styling';
 
 import { IButtonStyles } from '../../Button';
-import { ISpinButtonStyles } from './SpinButton.Props';
+import { ISpinButtonStyles } from './SpinButton.types';
 import { memoizeFunction } from '../../Utilities';
 
 const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index 1685860d7e06e..0e2e0a38e9e40 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -12,7 +12,7 @@ import {
 import {
   ISpinButton,
   ISpinButtonProps,
-} from './SpinButton.Props';
+} from './SpinButton.types';
 import { Position } from '../../utilities/positioning';
 import { getStyles, getArrowButtonStyles } from './SpinButton.styles';
 import { getClassNames } from './SpinButton.classNames';
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts
rename to packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
index 34ad61c4cd1a5..faa27929fd1e6 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButtonPage.tsx
@@ -80,7 +80,7 @@ export class SpinButtonPage extends React.Component<IComponentDemoPageProps, {}>
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/SpinButton/SpinButton.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/index.ts b/packages/office-ui-fabric-react/src/components/SpinButton/index.ts
index 08acda35da3bd..f4f0790e24d82 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/index.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/index.ts
@@ -1,2 +1,2 @@
 export * from './SpinButton';
-export * from './SpinButton.Props';
+export * from './SpinButton.types';
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.checklist.ts b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.checklist.ts
index c4d0d189c4349..3e4bc2ff6887d 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const SpinnerStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx
index cbaca34de6459..31f5477d95b08 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx
+++ b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { BaseComponent, css, DelayedRender } from '../../Utilities';
-import { ISpinnerProps, SpinnerType, SpinnerSize } from './Spinner.Props';
+import { ISpinnerProps, SpinnerType, SpinnerSize } from './Spinner.types';
 import * as stylesImport from './Spinner.scss';
 const styles: any = stylesImport;
 
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.Props.ts b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Spinner/Spinner.Props.ts
rename to packages/office-ui-fabric-react/src/components/Spinner/Spinner.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/SpinnerPage.tsx b/packages/office-ui-fabric-react/src/components/Spinner/SpinnerPage.tsx
index 29f51b52d0f42..4f5a537acafa7 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/SpinnerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Spinner/SpinnerPage.tsx
@@ -28,7 +28,7 @@ export class SpinnerPage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Spinner/Spinner.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Spinner/Spinner.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/index.ts b/packages/office-ui-fabric-react/src/components/Spinner/index.ts
index 5fb3a5064f18b..bc4ad38435263 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Spinner/index.ts
@@ -1,2 +1,2 @@
 export * from './Spinner';
-export * from './Spinner.Props';
+export * from './Spinner.types';
diff --git a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
index ad8b7611ba688..e19dc32a2ad98 100644
--- a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
+++ b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
@@ -8,7 +8,7 @@ import {
   BaseComponent,
   autobind
 } from '../../Utilities';
-import { IStickyProps, StickyPositionType } from './Sticky.Props';
+import { IStickyProps, StickyPositionType } from './Sticky.types';
 
 export interface IStickyState {
   isStickyTop: boolean;
diff --git a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.Props.ts b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Sticky/Sticky.Props.ts
rename to packages/office-ui-fabric-react/src/components/Sticky/Sticky.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Sticky/index.ts b/packages/office-ui-fabric-react/src/components/Sticky/index.ts
index 86691f866b911..76d90f7541897 100644
--- a/packages/office-ui-fabric-react/src/components/Sticky/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Sticky/index.ts
@@ -1,2 +1,2 @@
 export * from './Sticky';
-export * from './Sticky.Props';
+export * from './Sticky.types';
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.checklist.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.checklist.ts
index ada46470bee67..903e4a05019b0 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const SwatchColorPickerStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
index a8a31f50c9c95..9a5f13620cb14 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
@@ -6,7 +6,7 @@ import * as ReactTestUtils from 'react-dom/test-utils';
 import * as renderer from 'react-test-renderer';
 import { mount } from 'enzyme';
 import { SwatchColorPicker } from './SwatchColorPicker';
-import { IColorCellProps } from './SwatchColorPicker.Props';
+import { IColorCellProps } from './SwatchColorPicker.types';
 
 const DEFAULT_OPTIONS: IColorCellProps[] = [
   { id: 'a', label: 'green', color: '#00ff00' },
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
index a45dcf8215288..8a61518cf6177 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
@@ -10,11 +10,11 @@ import {
   ISwatchColorPicker,
   ISwatchColorPickerProps,
   IColorCellProps
-} from './SwatchColorPicker.Props';
+} from './SwatchColorPicker.types';
 import { getColorFromString } from '../../utilities/color/colors';
 import { Grid } from '../../utilities/grid/Grid';
 import { GridCell } from '../../utilities/grid/GridCell';
-import { IGridCellProps } from '../../utilities/grid/GridCell.Props';
+import { IGridCellProps } from '../../utilities/grid/GridCell.types';
 import * as stylesImport from './SwatchColorPicker.scss';
 const styles: any = stylesImport;
 
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts
rename to packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx
index ba1d005f60fda..0fae1ac85b1c2 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPickerPage.tsx
@@ -25,7 +25,7 @@ export class SwatchColorPickerPage extends React.Component<IComponentDemoPagePro
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/index.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/index.ts
index bd4c0cd6256cd..334f54176b3f2 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/index.ts
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/index.ts
@@ -1,2 +1,2 @@
 export * from './SwatchColorPicker';
-export * from './SwatchColorPicker.Props';
+export * from './SwatchColorPicker.types';
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.checklist.ts b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.checklist.ts
index b3fc3e15408a3..2d4105821f3b4 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const TeachingBubbleStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
index dac3e47553102..1a9acfd2249cc 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import { BaseComponent, css } from '../../Utilities';
 import { TeachingBubbleContent } from './TeachingBubbleContent';
-import { ITeachingBubbleProps } from './TeachingBubble.Props';
+import { ITeachingBubbleProps } from './TeachingBubble.types';
 import { Callout } from '../../Callout';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import * as stylesImport from './TeachingBubble.scss';
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.Props.ts b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.Props.ts
rename to packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubbleContent.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubbleContent.tsx
index c0f6a47e2e559..2759b6e6c1e59 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubbleContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubbleContent.tsx
@@ -6,7 +6,7 @@ import {
   css,
   getId
 } from '../../Utilities';
-import { ITeachingBubbleProps } from './TeachingBubble.Props';
+import { ITeachingBubbleProps } from './TeachingBubble.types';
 import { ITeachingBubbleState } from './TeachingBubble';
 import { PrimaryButton, DefaultButton, IconButton } from '../../Button';
 import { Image, ImageFit } from '../../Image';
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubblePage.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubblePage.tsx
index a81a265ce96db..88034a712d839 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubblePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubblePage.tsx
@@ -38,7 +38,7 @@ export class TeachingBubblePage extends React.Component<any, any> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/index.ts b/packages/office-ui-fabric-react/src/components/TeachingBubble/index.ts
index ff888384c711b..6cf8a6ae99257 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/index.ts
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/index.ts
@@ -1,3 +1,3 @@
 export * from './TeachingBubble';
 export * from './TeachingBubbleContent';
-export * from './TeachingBubble.Props';
+export * from './TeachingBubble.types';
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.checklist.ts b/packages/office-ui-fabric-react/src/components/TextField/TextField.checklist.ts
index 26915ee433851..5ed86bce95972 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const TextFieldStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index 5163050a2688f..52f9718faeab9 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { ITextField, ITextFieldProps } from './TextField.Props';
+import { ITextField, ITextFieldProps } from './TextField.types';
 import { Label } from '../../Label';
 import { Icon } from '../../Icon';
 import {
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts b/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/TextField/TextField.Props.ts
rename to packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
index f56f4e55fb6cb..3c9bff0d18e54 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
@@ -98,7 +98,7 @@ export class TextFieldPage extends React.Component<IComponentDemoPageProps, {}>
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/TextField/TextField.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/TextField/TextField.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/index.ts b/packages/office-ui-fabric-react/src/components/TextField/index.ts
index 616281906134e..4ec96447ffa23 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/index.ts
+++ b/packages/office-ui-fabric-react/src/components/TextField/index.ts
@@ -1,2 +1,2 @@
 export * from './TextField';
-export * from './TextField.Props';
+export * from './TextField.types';
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.checklist.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.checklist.ts
index ad4a838b534d5..77d5468791ac4 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const ToggleStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
index 78420b5ba9ca3..5d26e3a0fe548 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
@@ -4,7 +4,7 @@ import {
   mergeStyleSets,
   getFocusStyle
 } from '../../Styling';
-import { IToggleStyles } from './Toggle.Props';
+import { IToggleStyles } from './Toggle.types';
 
 export interface IToggleClassNames {
   root?: string;
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
index dfcb2a78a2546..0491d66fe85db 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
@@ -9,7 +9,7 @@ import {
 import {
   IToggleProps,
   IToggle
-} from './Toggle.Props';
+} from './Toggle.types';
 import { Label } from '../../Label';
 import {
   customizable
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.Props.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Toggle/Toggle.Props.ts
rename to packages/office-ui-fabric-react/src/components/Toggle/Toggle.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
index b8952ad24fd69..3d954ba424bf2 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
@@ -26,7 +26,7 @@ export class TogglePage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Toggle/Toggle.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Toggle/Toggle.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/index.ts b/packages/office-ui-fabric-react/src/components/Toggle/index.ts
index a410b9b65afb2..befd8b8c7c645 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Toggle/index.ts
@@ -1,2 +1,2 @@
 export * from './Toggle';
-export * from './Toggle.Props';
+export * from './Toggle.types';
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.checklist.ts b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.checklist.ts
index c3eb52ccdc630..9497c2ba9845c 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const TooltipStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
index 47f489892b9ce..0215bcbfd09b6 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.tsx
@@ -7,7 +7,7 @@ import {
   getNativeProps,
   divProperties
 } from '../../Utilities';
-import { ITooltipProps, TooltipDelay } from './Tooltip.Props';
+import { ITooltipProps, TooltipDelay } from './Tooltip.types';
 import { Callout } from '../../Callout';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import * as stylesImport from './Tooltip.scss';
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.Props.ts b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.Props.ts
rename to packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
index d777e23ad5623..7a2ef55eee8cf 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
@@ -11,9 +11,9 @@ import {
   assign,
   hasOverflow
 } from '../../Utilities';
-import { ITooltipHostProps, TooltipOverflowMode } from './TooltipHost.Props';
+import { ITooltipHostProps, TooltipOverflowMode } from './TooltipHost.types';
 import { Tooltip } from './Tooltip';
-import { TooltipDelay } from './Tooltip.Props';
+import { TooltipDelay } from './Tooltip.types';
 
 import * as stylesImport from './TooltipHost.scss';
 const styles: any = stylesImport;
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.Props.ts b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.types.ts
similarity index 97%
rename from packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.Props.ts
rename to packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.types.ts
index 9032a2118ee2c..27c7c51a1810b 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.types.ts
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { TooltipHost } from './TooltipHost';
-import { TooltipDelay, ITooltipProps } from './Tooltip.Props';
+import { TooltipDelay, ITooltipProps } from './Tooltip.types';
 import { ICalloutProps } from '../../Callout';
 import { DirectionalHint } from '../../common/DirectionalHint';
 
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.tsx
index 393800713b208..35937c34431b8 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.tsx
@@ -43,7 +43,7 @@ export class TooltipPage extends React.Component<IComponentDemoPageProps, any> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Tooltip/Tooltip.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Tooltip/Tooltip.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/index.ts b/packages/office-ui-fabric-react/src/components/Tooltip/index.ts
index b6bbdb0e2ec72..1d3e38e73a05f 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/index.ts
@@ -1,5 +1,5 @@
 export * from './Tooltip';
-export * from './Tooltip.Props';
+export * from './Tooltip.types';
 export * from './TooltipHost';
-export * from './TooltipHost.Props';
+export * from './TooltipHost.types';
 export * from '../../common/DirectionalHint';
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
index 5caac9d330d8a..0448b991c61f9 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { IBaseAutoFillProps, IBaseAutoFill } from './BaseAutoFill.Props';
+import { IBaseAutoFillProps, IBaseAutoFill } from './BaseAutoFill.types';
 import {
   BaseComponent,
   KeyCodes,
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.Props.ts
rename to packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
index f070596f8543a..21ec922691e74 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
@@ -6,9 +6,9 @@ import * as ReactTestUtils from 'react-dom/test-utils';
 import * as renderer from 'react-test-renderer';
 
 import { TagPicker, ITag } from './TagPicker/TagPicker';
-import { IBasePickerProps } from './BasePicker.Props';
+import { IBasePickerProps } from './BasePicker.types';
 import { BasePicker } from './BasePicker';
-import { IPickerItemProps } from './PickerItem.Props';
+import { IPickerItemProps } from './PickerItem.types';
 
 function onResolveSuggestions(text: string): ITag[] {
   return [
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 16bb878d4f589..ddb2b7b95c59e 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -10,12 +10,12 @@ import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { Callout, DirectionalHint } from '../../Callout';
 import { Selection, SelectionZone, SelectionMode } from '../../utilities/selection/index';
 import { Suggestions } from './Suggestions/Suggestions';
-import { ISuggestionsProps } from './Suggestions/Suggestions.Props';
+import { ISuggestionsProps } from './Suggestions/Suggestions.types';
 import { SuggestionsController } from './Suggestions/SuggestionsController';
-import { IBasePicker, IBasePickerProps, ValidationState } from './BasePicker.Props';
+import { IBasePicker, IBasePickerProps, ValidationState } from './BasePicker.types';
 import { BaseAutoFill } from './AutoFill/BaseAutoFill';
-import { IPickerItemProps } from './PickerItem.Props';
-import { IPersonaProps } from '../Persona/Persona.Props';
+import { IPickerItemProps } from './PickerItem.types';
+import { IPersonaProps } from '../Persona/Persona.types';
 import * as stylesImport from './BasePicker.scss';
 const styles: any = stylesImport;
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts
similarity index 98%
rename from packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
rename to packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts
index e8881471f036d..f569b79b5535f 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts
@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { IPickerItemProps } from './PickerItem.Props';
-import { IPersonaProps } from '../Persona/Persona.Props';
+import { IPickerItemProps } from './PickerItem.types';
+import { IPersonaProps } from '../Persona/Persona.types';
 import { IRenderFunction } from '../../Utilities';
 import { ISuggestionModel } from './Suggestions/SuggestionsController';
 import { BaseAutoFill } from './AutoFill/BaseAutoFill';
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.checklist.ts b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.checklist.ts
index c5eabdc8f0b09..ae045f96e2c54 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../../demo/ComponentStatus/ComponentStatus.types';
 
 export const PeoplePickerStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.tsx
index 2f97df1969f25..28a3ed191c1e3 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.tsx
@@ -3,12 +3,12 @@ import * as React from 'react';
 /* tslint:enable */
 import { getRTL, getInitials } from '../../../Utilities';
 import { BasePicker, BasePickerListBelow } from '../BasePicker';
-import { IBasePickerProps, IBasePickerSuggestionsProps, ValidationState } from '../BasePicker.Props';
+import { IBasePickerProps, IBasePickerSuggestionsProps, ValidationState } from '../BasePicker.types';
 import { SelectedItemDefault } from './PeoplePickerItems/SelectedItemDefault';
 import { IPersonaProps } from '../../../Persona';
 import { SuggestionItemSmall, SuggestionItemNormal } from './PeoplePickerItems/SuggestionItemDefault';
 import './PeoplePicker.scss';
-import { IPeoplePickerItemProps } from './PeoplePickerItems/PeoplePickerItem.Props';
+import { IPeoplePickerItemProps } from './PeoplePickerItems/PeoplePickerItem.types';
 
 export interface IPeoplePickerProps extends IBasePickerProps<IPersonaProps> {
 }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.types.ts
similarity index 79%
rename from packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.Props.ts
rename to packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.types.ts
index 525347b2db0a8..bcaa08d7bc72b 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.types.ts
@@ -1,7 +1,7 @@
 import { IPersonaProps } from '../../../../Persona';
-import { IPickerItemProps } from '../../PickerItem.Props';
+import { IPickerItemProps } from '../../PickerItem.types';
 import { IContextualMenuItem } from '../../../../ContextualMenu';
-import { ValidationState } from '../../BasePicker.Props';
+import { ValidationState } from '../../BasePicker.types';
 export interface IPeoplePickerItemProps extends IPickerItemProps<IPersonaProps & { ValidationState: ValidationState }> {
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
index 46812507523d2..b8deb62126cea 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
@@ -3,8 +3,8 @@ import * as React from 'react';
 /* tslint:enable */
 import { css, getId } from '../../../../Utilities';
 import { Persona, PersonaSize, PersonaPresence } from '../../../../Persona';
-import { IPeoplePickerItemProps } from './PeoplePickerItem.Props';
-import { ValidationState } from '../../BasePicker.Props';
+import { IPeoplePickerItemProps } from './PeoplePickerItem.types';
+import { ValidationState } from '../../BasePicker.types';
 import { IconButton } from '../../../../Button';
 import * as stylesImport from './PickerItemsDefault.scss';
 const styles: any = stylesImport;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
index 10575a9825e42..68ab0222c49a6 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
@@ -2,7 +2,7 @@
 import * as React from 'react';
 /* tslint:enable */
 import { BaseComponent, autobind, css } from '../../../../Utilities';
-import { IPeoplePickerItemWithMenuProps } from './PeoplePickerItem.Props';
+import { IPeoplePickerItemWithMenuProps } from './PeoplePickerItem.types';
 import { Persona, PersonaPresence } from '../../../../Persona';
 import { ContextualMenu, DirectionalHint } from '../../../../ContextualMenu';
 import { IconButton } from '../../../../Button';
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerPage.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerPage.tsx
index be8f5bb03c341..1a48eb28b8d41 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerPage.tsx
@@ -28,7 +28,7 @@ export class PeoplePickerPage extends React.Component<IComponentDemoPageProps, {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/pickers/BasePicker.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index 5843246c023bf..188c180e0253c 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -18,7 +18,7 @@ import {
   ValidationState
 } from 'office-ui-fabric-react/lib/Pickers';
 import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
-import { IPersonaWithMenu } from 'office-ui-fabric-react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.Props';
+import { IPersonaWithMenu } from 'office-ui-fabric-react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.types';
 import { people, mru } from './PeoplePickerExampleData';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Promise } from 'es6-promise';
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PickerItem.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/PickerItem.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/pickers/PickerItem.Props.ts
rename to packages/office-ui-fabric-react/src/components/pickers/PickerItem.types.ts
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Pickers.checklist.ts b/packages/office-ui-fabric-react/src/components/pickers/Pickers.checklist.ts
index 4797f052e46a1..3388928ac0eb7 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Pickers.checklist.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/Pickers.checklist.ts
@@ -1,4 +1,4 @@
-import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.Props';
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
 
 export const PickersStatus = {
   keyboardAccessibilitySupport: ChecklistStatus.unknown,
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PickersPage.tsx b/packages/office-ui-fabric-react/src/components/pickers/PickersPage.tsx
index 490eb22a68635..218833888421e 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PickersPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PickersPage.tsx
@@ -33,7 +33,7 @@ export class PickersPage extends React.Component<IComponentDemoPageProps, {}> {
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/pickers/BasePicker.Props.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/pickers/BasePicker.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index b259025637259..cf07bd537d4df 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -7,7 +7,7 @@ import {
 } from '../../../Utilities';
 import { CommandButton, IconButton, IButton } from '../../../Button';
 import { Spinner } from '../../../Spinner';
-import { ISuggestionItemProps, ISuggestionsProps } from './Suggestions.Props';
+import { ISuggestionItemProps, ISuggestionsProps } from './Suggestions.types';
 import * as stylesImport from './Suggestions.scss';
 const styles: any = stylesImport;
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.types.ts
similarity index 98%
rename from packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts
rename to packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.types.ts
index 011f80113c78c..7874e3626641d 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.Props.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.types.ts
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { ISuggestionModel } from './SuggestionsController';
 import { IRenderFunction, KeyCodes } from '../../../Utilities';
-import { IPersonaProps } from '../../Persona/Persona.Props';
+import { IPersonaProps } from '../../Persona/Persona.types';
 
 export interface ISuggestionsProps<T> extends React.Props<any> {
   /**
diff --git a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx
index f9bfe5facac87..ae15d1f680d21 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 /* tslint:enable */
 import { css, IDictionary } from '../../../Utilities';
 import { Icon } from '../../../Icon';
-import { IPickerItemProps } from '../PickerItem.Props';
+import { IPickerItemProps } from '../PickerItem.types';
 import { ITag } from './TagPicker';
 import * as stylesImport from './TagItem.scss';
 const styles: any = stylesImport;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagPicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagPicker.tsx
index a262acb467109..6dfa5429b4821 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagPicker.tsx
@@ -6,9 +6,9 @@ import {
 } from '../../../Utilities';
 /* tslint:enable */
 import { BasePicker } from '../BasePicker';
-import { IBasePickerProps } from '../BasePicker.Props';
+import { IBasePickerProps } from '../BasePicker.types';
 import { TagItem } from './TagItem';
-import { IPickerItemProps } from '../PickerItem.Props';
+import { IPickerItemProps } from '../PickerItem.types';
 import * as stylesImport from './TagItem.scss';
 const styles: any = stylesImport;
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/index.ts b/packages/office-ui-fabric-react/src/components/pickers/index.ts
index 5c3371b8fde4a..d15b48479920b 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/index.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/index.ts
@@ -1,11 +1,11 @@
 export * from './Suggestions/Suggestions';
-export * from './Suggestions/Suggestions.Props';
+export * from './Suggestions/Suggestions.types';
 export * from './Suggestions/SuggestionsController';
 export * from './AutoFill/BaseAutoFill';
-export * from './AutoFill/BaseAutoFill.Props';
+export * from './AutoFill/BaseAutoFill.types';
 export * from './BasePicker';
-export * from './BasePicker.Props';
-export * from './PickerItem.Props';
+export * from './BasePicker.types';
+export * from './PickerItem.types';
 export * from './PeoplePicker/PeoplePicker';
 export * from './TagPicker/TagPicker';
 export * from './TagPicker/TagItem';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/demo/ComponentStatus/AllComponents.checklist.ts b/packages/office-ui-fabric-react/src/demo/ComponentStatus/AllComponents.checklist.ts
index 5dbeb6601e4dd..44a02d898635f 100644
--- a/packages/office-ui-fabric-react/src/demo/ComponentStatus/AllComponents.checklist.ts
+++ b/packages/office-ui-fabric-react/src/demo/ComponentStatus/AllComponents.checklist.ts
@@ -1,5 +1,5 @@
 
-import { IComponentStatusProps } from './ComponentStatus.Props';
+import { IComponentStatusProps } from './ComponentStatus.types';
 export interface IComponentStatusState {
   [key: string]: IComponentStatusProps;
 }
diff --git a/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.tsx b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.tsx
index 93f9f5d390930..a54fa10602999 100644
--- a/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.tsx
+++ b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { IComponentStatusProps, ChecklistStatus } from './ComponentStatus.Props';
+import { IComponentStatusProps, ChecklistStatus } from './ComponentStatus.types';
 import './ComponentStatus.scss';
 
 export class ComponentStatus extends React.Component<IComponentStatusProps, {}> {
diff --git a/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.Props.ts b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.Props.ts
rename to packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.types.ts
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx b/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
index 1d7ba4d2ace56..017e559b1afd2 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
@@ -5,7 +5,7 @@ import {
   toMatrix
 } from '../../Utilities';
 import { FocusZone } from '../../FocusZone';
-import { IGridProps } from './Grid.Props';
+import { IGridProps } from './Grid.types';
 
 export class Grid extends BaseComponent<IGridProps, {}> {
 
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.Props.ts b/packages/office-ui-fabric-react/src/utilities/grid/Grid.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/utilities/grid/Grid.Props.ts
rename to packages/office-ui-fabric-react/src/utilities/grid/Grid.types.ts
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx b/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx
index e48173e15da34..088a0009013c3 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx
@@ -4,7 +4,7 @@ import {
   css,
   getId,
 } from '../../Utilities';
-import { IGridCellProps } from './GridCell.Props';
+import { IGridCellProps } from './GridCell.types';
 import { CommandButton } from '../../Button';
 
 export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P, {}> {
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/GridCell.Props.ts b/packages/office-ui-fabric-react/src/utilities/grid/GridCell.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/utilities/grid/GridCell.Props.ts
rename to packages/office-ui-fabric-react/src/utilities/grid/GridCell.types.ts
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/index.ts b/packages/office-ui-fabric-react/src/utilities/grid/index.ts
index 49eb9324e05d0..eaeb13a3eb569 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/index.ts
+++ b/packages/office-ui-fabric-react/src/utilities/grid/index.ts
@@ -1,4 +1,4 @@
 export * from './Grid';
-export * from './Grid.Props';
+export * from './Grid.types';
 export * from './GridCell';
-export * from './GridCell.Props';
\ No newline at end of file
+export * from './GridCell.types';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.Props.ts b/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.types.ts
similarity index 95%
rename from packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.Props.ts
rename to packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.types.ts
index bb2883337c923..0a8e359c88a9c 100644
--- a/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.Props.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.types.ts
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { IRenderFunction } from '../../Utilities';
 import { ICalloutProps } from '../../Callout';
-import { ISelectableOption } from '../../utilities/selectableOption/SelectableOption.Props';
+import { ISelectableOption } from '../../utilities/selectableOption/SelectableOption.types';
 
 export interface ISelectableDroppableTextProps<T> extends React.HTMLAttributes<T> {
   /**
diff --git a/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableOption.Props.ts b/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableOption.types.ts
similarity index 100%
rename from packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableOption.Props.ts
rename to packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableOption.types.ts
diff --git a/packages/office-ui-fabric-react/src/utilities/selectableOption/index.ts b/packages/office-ui-fabric-react/src/utilities/selectableOption/index.ts
index 4c2fe6688b993..fb20291d56c72 100644
--- a/packages/office-ui-fabric-react/src/utilities/selectableOption/index.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selectableOption/index.ts
@@ -1,2 +1,2 @@
-export * from './SelectableOption.Props';
-export * from './SelectableDroppableText.Props';
\ No newline at end of file
+export * from './SelectableOption.types';
+export * from './SelectableDroppableText.types';
\ No newline at end of file
diff --git a/scripts/create-component.js b/scripts/create-component.js
index eb8c598f6765c..e044a82b82d27 100644
--- a/scripts/create-component.js
+++ b/scripts/create-component.js
@@ -7,7 +7,7 @@ const fs = require('fs');
 // Paths/File Names
 const rootComponentFolderPath = './packages/experiments/src';
 const componentFolderPath = rootComponentFolderPath + '/components/' + newComponentName;
-const componentPropsFileName = newComponentName + '.Props.ts';
+const componentPropsFileName = newComponentName + '.types.ts';
 const componentFileName = newComponentName + '.tsx';
 const componentFileClassNamesName = newComponentName + '.classNames.ts';
 const globalIndexFileName = newComponentName + '.ts';
diff --git a/scripts/templates/EmptyComponent.mustache b/scripts/templates/EmptyComponent.mustache
index 0f7fdca00ef6a..207d68eac887f 100644
--- a/scripts/templates/EmptyComponent.mustache
+++ b/scripts/templates/EmptyComponent.mustache
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { BaseComponent } from '../../Utilities';
-import { I{{componentName}}Props } from './{{componentName}}.Props';
+import { I{{componentName}}Props } from './{{componentName}}.types';
 
 export class {{componentName}} extends BaseComponent < I{{componentName}}Props, {} > {
   public render() {
diff --git a/scripts/templates/EmptyComponentIndex.mustache b/scripts/templates/EmptyComponentIndex.mustache
index 9e835d221135e..bcb93e78c5132 100644
--- a/scripts/templates/EmptyComponentIndex.mustache
+++ b/scripts/templates/EmptyComponentIndex.mustache
@@ -1,2 +1,2 @@
 export * from './{{componentName}}';
-export * from './{{componentName}}.Props';
\ No newline at end of file
+export * from './{{componentName}}.types';
\ No newline at end of file

From 8d460f38a03684f44ead13a08d84a990ca07d24b Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 11 Nov 2017 17:45:54 -0800
Subject: [PATCH 1012/1641] BaseComponent: methods now have correct typings
 (#3367)

* Fixing basecomponent props.

* Adding change file.
---
 .../utilities/fix-props_2017-11-12-01-30.json         | 11 +++++++++++
 packages/utilities/src/BaseComponent.ts               |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/utilities/fix-props_2017-11-12-01-30.json

diff --git a/common/changes/@uifabric/utilities/fix-props_2017-11-12-01-30.json b/common/changes/@uifabric/utilities/fix-props_2017-11-12-01-30.json
new file mode 100644
index 0000000000000..5f754bb4a2ba0
--- /dev/null
+++ b/common/changes/@uifabric/utilities/fix-props_2017-11-12-01-30.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "BaseComponent: fixing some typings to be compatible with current React typings.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/src/BaseComponent.ts b/packages/utilities/src/BaseComponent.ts
index 0ea16f1069756..baac0662e8671 100644
--- a/packages/utilities/src/BaseComponent.ts
+++ b/packages/utilities/src/BaseComponent.ts
@@ -68,7 +68,7 @@ export class BaseComponent<P extends IBaseProps, S = {}> extends React.Component
    * When the component will receive props, make sure the componentRef is updated.
    */
   // tslint:disable-next-line:no-any
-  public componentWillReceiveProps(newProps?: P, newContext?: any): void {
+  public componentWillReceiveProps(newProps: Readonly<P>, newContext: any): void {
     this._updateComponentRef(this.props, newProps);
   }
 

From 064770d5e81036fcfddd2c3dbde0777cccbf5ac1 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sun, 12 Nov 2017 15:39:39 -0800
Subject: [PATCH 1013/1641] Updating checkchange step to only run for master.

---
 .travis.yml | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/.travis.yml b/.travis.yml
index 216d2431c4e8a..03a88d5329b50 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -2,7 +2,9 @@ language: node_js
 node_js:
   - '8'
 script:
-  - npm run checkchange
+  - if [ $TRAVIS_BRANCH == "master" ] && [ $TRAVIS_PULL_REQUEST == "true" ]; then
+      npm run checkchange;
+    fi
   - npm run buildfast
   - npm run bundlesize
   - npm run vrtest

From 64a091e1a353e3587c8f67b4bdf5f7f49c74dbbe Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 13 Nov 2017 11:20:56 +0000
Subject: [PATCH 1014/1641] Applying package updates.

---
 .../utilities/fix-props_2017-11-12-01-30.json      | 11 -----------
 .../utilities/rename-props_2017-11-11-20-23.json   | 11 -----------
 packages/example-app-base/package.json             |  2 +-
 packages/office-ui-fabric-react/package.json       |  2 +-
 packages/styling/package.json                      |  2 +-
 packages/utilities/CHANGELOG.json                  | 14 ++++++++++++++
 packages/utilities/CHANGELOG.md                    |  9 ++++++++-
 packages/utilities/package.json                    |  2 +-
 8 files changed, 26 insertions(+), 27 deletions(-)
 delete mode 100644 common/changes/@uifabric/utilities/fix-props_2017-11-12-01-30.json
 delete mode 100644 common/changes/@uifabric/utilities/rename-props_2017-11-11-20-23.json

diff --git a/common/changes/@uifabric/utilities/fix-props_2017-11-12-01-30.json b/common/changes/@uifabric/utilities/fix-props_2017-11-12-01-30.json
deleted file mode 100644
index 5f754bb4a2ba0..0000000000000
--- a/common/changes/@uifabric/utilities/fix-props_2017-11-12-01-30.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "BaseComponent: fixing some typings to be compatible with current React typings.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/rename-props_2017-11-11-20-23.json b/common/changes/@uifabric/utilities/rename-props_2017-11-11-20-23.json
deleted file mode 100644
index dd57bd067a20d..0000000000000
--- a/common/changes/@uifabric/utilities/rename-props_2017-11-11-20-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 05ec4c6d91491..14f45c630fc7d 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -39,7 +39,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.7.0 <6.0.0",
-    "@uifabric/utilities": ">=5.3.3 <6.0.0",
+    "@uifabric/utilities": ">=5.4.0 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index b32df5d6cb26a..520772f580c25 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -48,7 +48,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.6.0 <6.0.0",
     "@uifabric/styling": ">=5.7.0 <6.0.0",
-    "@uifabric/utilities": ">=5.3.3 <6.0.0",
+    "@uifabric/utilities": ">=5.4.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 314e1b752ed32..ab6acecc3968e 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -21,7 +21,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=5.3.3 <6.0.0",
+    "@uifabric/utilities": ">=5.4.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.6.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 0f2c8287f470b..e6733fe294302 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.4.0",
+      "tag": "@uifabric/utilities_v5.4.0",
+      "date": "Mon, 13 Nov 2017 11:20:56 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "8d460f38a03684f44ead13a08d84a990ca07d24b",
+            "comment": "BaseComponent: fixing some typings to be compatible with current React typings."
+          }
+        ]
+      }
+    },
     {
       "version": "5.3.3",
       "tag": "@uifabric/utilities_v5.3.3",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index a6ca0497a0a42..f1c9b9f138162 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Fri, 10 Nov 2017 17:09:36 GMT and should not be manually modified.
+This log was last generated on Mon, 13 Nov 2017 11:20:56 GMT and should not be manually modified.
+
+## 5.4.0
+Mon, 13 Nov 2017 11:20:56 GMT
+
+### Minor changes
+
+- BaseComponent: fixing some typings to be compatible with current React typings.
 
 ## 5.3.3
 Fri, 10 Nov 2017 17:09:36 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 11ca6fafba002..5dfce725e71b9 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.3.3",
+  "version": "5.4.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From f5a45202a040f797c722afa34ac3a13396a8a3fc Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Mon, 13 Nov 2017 15:21:52 -0800
Subject: [PATCH 1015/1641] Choicegroup rtl (#3379)

* Fixed RTL support for choicegroup

* change file

* Update choicegroupRTL_2017-11-13-20-08.json
---
 .../choicegroupRTL_2017-11-13-20-08.json              | 11 +++++++++++
 .../src/components/ChoiceGroup/ChoiceGroup.scss       |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/choicegroupRTL_2017-11-13-20-08.json

diff --git a/common/changes/office-ui-fabric-react/choicegroupRTL_2017-11-13-20-08.json b/common/changes/office-ui-fabric-react/choicegroupRTL_2017-11-13-20-08.json
new file mode 100644
index 0000000000000..81549c698ff13
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/choicegroupRTL_2017-11-13-20-08.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ChoiceGroup: Fixed RTL support.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
index 793ecc89b90d0..9c339a49c4e97 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
@@ -78,7 +78,7 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
   font-weight: normal;
   position: absolute;
   top: 0;
-  left: 0;
+  @include ms-left(0);
   box-sizing: border-box;
   transition-property: border-color;
   transition-duration: $ms-choiceField-transition-duration;

From 227159e1551465b032db4bdddbcf65bc7d54248f Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 14 Nov 2017 03:21:27 -0800
Subject: [PATCH 1016/1641] Applying package updates.

---
 apps/fabric-website/package.json                   |  2 +-
 .../choicegroupRTL_2017-11-13-20-08.json           | 11 -----------
 .../rename-props_2017-11-11-20-23.json             | 11 -----------
 packages/experiments/package.json                  |  2 +-
 packages/office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md       |  9 ++++++++-
 packages/office-ui-fabric-react/package.json       |  2 +-
 7 files changed, 25 insertions(+), 26 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/choicegroupRTL_2017-11-13-20-08.json
 delete mode 100644 common/changes/office-ui-fabric-react/rename-props_2017-11-11-20-23.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 9129a549f4658..4ac68ad92cfc7 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.21.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.21.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/choicegroupRTL_2017-11-13-20-08.json b/common/changes/office-ui-fabric-react/choicegroupRTL_2017-11-13-20-08.json
deleted file mode 100644
index 81549c698ff13..0000000000000
--- a/common/changes/office-ui-fabric-react/choicegroupRTL_2017-11-13-20-08.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ChoiceGroup: Fixed RTL support.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/rename-props_2017-11-11-20-23.json b/common/changes/office-ui-fabric-react/rename-props_2017-11-11-20-23.json
deleted file mode 100644
index bdac204cd2e2e..0000000000000
--- a/common/changes/office-ui-fabric-react/rename-props_2017-11-11-20-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "office-ui-fabric-react",
-      "type": "none"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index e7519e51c5031..6a6837f150e9e 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.20.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.21.1 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index b137289116433..3fe9f1c417775 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.21.1",
+      "tag": "office-ui-fabric-react_v5.21.1",
+      "date": "Tue, 14 Nov 2017 11:21:27 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "f5a45202a040f797c722afa34ac3a13396a8a3fc",
+            "comment": "ChoiceGroup: Fixed RTL support."
+          }
+        ]
+      }
+    },
     {
       "version": "5.21.0",
       "tag": "office-ui-fabric-react_v5.21.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 3feb2afd238a5..abb98f3858c9a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 10 Nov 2017 17:09:36 GMT and should not be manually modified.
+This log was last generated on Tue, 14 Nov 2017 11:21:27 GMT and should not be manually modified.
+
+## 5.21.1
+Tue, 14 Nov 2017 11:21:27 GMT
+
+### Patches
+
+- ChoiceGroup: Fixed RTL support.
 
 ## 5.21.0
 Fri, 10 Nov 2017 17:09:36 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 520772f580c25..d37db85f16bd7 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.21.0",
+  "version": "5.21.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From c91ab96dc9908c8df57b8ea36acab186b77f03f2 Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Tue, 14 Nov 2017 14:27:24 -0800
Subject: [PATCH 1017/1641] SplitButton: Don't apply visual changes when 
 (#3384)

* Separte selectors css rules to their own prop and only apply them when disabled is false

* Add change file

* Add containerChecked and containerCheckedHover styles
---
 ...plitButtonHoverState_2017-11-14-01-48.json | 11 +++++++++
 .../src/components/Button/Button.types.ts     | 24 +++++++++++++++++--
 .../SplitButton/SplitButton.classNames.ts     | 13 ++++++++++
 .../Button/SplitButton/SplitButton.styles.ts  | 14 ++++-------
 4 files changed, 51 insertions(+), 11 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/malozano-SplitButtonHoverState_2017-11-14-01-48.json

diff --git a/common/changes/office-ui-fabric-react/malozano-SplitButtonHoverState_2017-11-14-01-48.json b/common/changes/office-ui-fabric-react/malozano-SplitButtonHoverState_2017-11-14-01-48.json
new file mode 100644
index 0000000000000..c8437dafaa970
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-SplitButtonHoverState_2017-11-14-01-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SplitButton: Disable visual changes in splitButtonContainer when control is disabled",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.types.ts b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
index c26fcf07fdb7b..900234bea2dcc 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
@@ -386,10 +386,30 @@ export interface IButtonStyles {
   screenReaderText?: IStyle;
 
   /**
-     * Style override for the container div around a SplitButton element
-     */
+   * Style override for the container div around a SplitButton element
+   */
   splitButtonContainer?: IStyle;
 
+  /**
+   * Style for container div around a SplitButton element when the button is hovered.
+   */
+  splitButtonContainerHovered?: IStyle;
+
+  /**
+   * Style for container div around a SplitButton element when the button is focused.
+   */
+  splitButtonContainerFocused?: IStyle;
+
+  /**
+  * Style for container div around a SplitButton element when the button is checked.
+  */
+  splitButtonContainerChecked?: IStyle;
+
+  /**
+   * Style for container div around a SplitButton element when the button is checked and hovered.
+   */
+  splitButtonContainerCheckedHovered?: IStyle;
+
   /**
    * Style override for the container div around a SplitButton element in a disabled state
    */
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts
index 09402013e4e4b..8dd37f9da69aa 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts
@@ -33,6 +33,19 @@ export const getClassNames = memoizeFunction((
 
     splitButtonContainer: mergeStyles(
       styles.splitButtonContainer,
+      checked && !disabled && [
+        styles.splitButtonContainerChecked,
+        {
+          selectors: {
+            ':hover': styles.splitButtonContainerHovered
+          }
+        }],
+      !disabled && [{
+        selectors: {
+          ':hover': styles.splitButtonContainerHovered,
+          ':focus': styles.splitButtonContainerFocused
+        }
+      }],
       disabled && styles.splitButtonContainerDisabled
     ),
 
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
index f0330fc7fe3be..913c8b0ab1680 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
@@ -14,16 +14,12 @@ export const getStyles = memoizeFunction((
     splitButtonContainer: {
       position: 'relative',
       display: 'inline-block',
-      border: '1px solid transparent',
-
-      selectors: {
-        ':focus': {
-          outline: 'none!important',
-          border: '1px solid'
-        }
-      }
+      border: '1px solid transparent'
+    },
+    splitButtonContainerFocused: {
+      outline: 'none!important',
+      border: '1px solid'
     },
-
     splitButtonMenuButton: [
       getFocusStyle(theme, -1),
       {

From 11d9fdc521f585b0dbbd1a07b54fa417b4d59327 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 15 Nov 2017 11:11:59 +0000
Subject: [PATCH 1018/1641] Applying package updates.

---
 apps/fabric-website/package.json                   |  2 +-
 apps/ssr-tests/package.json                        |  2 +-
 apps/test-bundle-button/package.json               |  2 +-
 apps/todo-app/package.json                         |  2 +-
 apps/vr-tests/package.json                         |  2 +-
 ...ano-SplitButtonHoverState_2017-11-14-01-48.json | 11 -----------
 packages/experiments/package.json                  |  2 +-
 packages/office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md       |  9 ++++++++-
 packages/office-ui-fabric-react/package.json       |  2 +-
 10 files changed, 29 insertions(+), 19 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-SplitButtonHoverState_2017-11-14-01-48.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 4ac68ad92cfc7..7fd3854d59beb 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.21.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.21.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index eecf3eeb0f19a..4d3e8c7d2f288 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.21.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.21.2 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 8090604b3e95f..c49633dc4feb6 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.21.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.21.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 678bed1db577f..b125cfb9a7b3f 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.21.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.21.2 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index ffe0403a318f7..ed6f1d298cc62 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.21.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.21.2 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/malozano-SplitButtonHoverState_2017-11-14-01-48.json b/common/changes/office-ui-fabric-react/malozano-SplitButtonHoverState_2017-11-14-01-48.json
deleted file mode 100644
index c8437dafaa970..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-SplitButtonHoverState_2017-11-14-01-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SplitButton: Disable visual changes in splitButtonContainer when control is disabled",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 6a6837f150e9e..e7cb3eae5b05c 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.21.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.21.2 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 3fe9f1c417775..ddc6cdd6f8b69 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.21.2",
+      "tag": "office-ui-fabric-react_v5.21.2",
+      "date": "Wed, 15 Nov 2017 11:11:59 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "c91ab96dc9908c8df57b8ea36acab186b77f03f2",
+            "comment": "SplitButton: Disable visual changes in splitButtonContainer when control is disabled"
+          }
+        ]
+      }
+    },
     {
       "version": "5.21.1",
       "tag": "office-ui-fabric-react_v5.21.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index abb98f3858c9a..0659cae4e8781 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 14 Nov 2017 11:21:27 GMT and should not be manually modified.
+This log was last generated on Wed, 15 Nov 2017 11:11:59 GMT and should not be manually modified.
+
+## 5.21.2
+Wed, 15 Nov 2017 11:11:59 GMT
+
+### Patches
+
+- SplitButton: Disable visual changes in splitButtonContainer when control is disabled
 
 ## 5.21.1
 Tue, 14 Nov 2017 11:21:27 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index d37db85f16bd7..5637f732536c8 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.21.1",
+  "version": "5.21.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 7c6d7b6aa050c3fa02bda1fbf596111b60bd20fc Mon Sep 17 00:00:00 2001
From: amyngu <31973030+amyngu@users.noreply.github.com>
Date: Wed, 15 Nov 2017 15:02:36 -0800
Subject: [PATCH 1019/1641] Fix experiment imports for FloatingPicker and
 ExtendedPicker (#3399)

* relative imports instead of experiments/lib

* add change file
---
 .../fixExperimentImports_2017-11-15-17-42.json        | 11 +++++++++++
 .../components/ExtendedPicker/BaseExtendedPicker.tsx  |  4 ++--
 .../ExtendedPicker/BaseExtendedPicker.types.ts        |  4 ++--
 .../PeoplePicker/ExtendedPeoplePicker.tsx             |  2 +-
 .../examples/ExtendedPeoplePicker.Basic.Example.tsx   |  4 ++--
 .../ExtendedPicker/examples/PeopleExampleData.ts      |  2 +-
 .../PeoplePickerItems/SelectedItemDefault.tsx         |  2 +-
 .../examples/FloatingPeoplePicker.Basic.Example.tsx   |  2 +-
 .../examples/SelectedPeopleList.Basic.Example.tsx     |  2 +-
 9 files changed, 22 insertions(+), 11 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/fixExperimentImports_2017-11-15-17-42.json

diff --git a/common/changes/@uifabric/experiments/fixExperimentImports_2017-11-15-17-42.json b/common/changes/@uifabric/experiments/fixExperimentImports_2017-11-15-17-42.json
new file mode 100644
index 0000000000000..357193a2b92ed
--- /dev/null
+++ b/common/changes/@uifabric/experiments/fixExperimentImports_2017-11-15-17-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Fix experiment imports for FloatingPicker and ExtendedPicker components",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "amyngu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
index 32fe69f054074..50e8a2bed5337 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
@@ -13,8 +13,8 @@ import { BaseAutoFill } from 'office-ui-fabric-react/lib/components/pickers/Auto
 import { IPickerItemProps, IInputProps } from 'office-ui-fabric-react/lib/Pickers';
 import * as stylesImport from './BaseExtendedPicker.scss';
 import { IBaseExtendedPickerProps, IBaseExtendedPicker } from './BaseExtendedPicker.types';
-import { IBaseFloatingPickerProps, BaseFloatingPicker } from 'experiments/lib/FloatingPicker';
-import { BaseSelectedItemsList, IBaseSelectedItemsListProps } from 'experiments/lib/SelectedItemsList';
+import { IBaseFloatingPickerProps, BaseFloatingPicker } from '../../FloatingPicker';
+import { BaseSelectedItemsList, IBaseSelectedItemsListProps } from '../../SelectedItemsList';
 // tslint:disable-next-line:no-any
 const styles: any = stylesImport;
 
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts
index 0f4821e1943c1..de96937dd06b6 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { BaseAutoFill, IInputProps } from 'office-ui-fabric-react/lib/Pickers';
-import { IBaseFloatingPickerProps } from 'experiments/lib/FloatingPicker';
-import { IBaseSelectedItemsListProps } from 'experiments/lib/SelectedItemsList';
+import { IBaseFloatingPickerProps } from '../../FloatingPicker';
+import { IBaseSelectedItemsListProps } from '../../SelectedItemsList';
 
 export interface IBaseExtendedPicker<T> {
   /** Forces the picker to resolve */
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.tsx b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.tsx
index 5bd25febb69e7..e09881c71fca5 100644
--- a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.tsx
@@ -2,7 +2,7 @@
 import { IPickerItemProps, ValidationState } from 'office-ui-fabric-react/lib/Pickers';
 /* tslint:enable */
 
-import { IExtendedPersonaProps } from 'experiments/lib/SelectedItemsList';
+import { IExtendedPersonaProps } from '../../../SelectedItemsList';
 import './ExtendedPeoplePicker.scss';
 import { BaseExtendedPicker } from '../BaseExtendedPicker';
 import { IBaseExtendedPickerProps } from '../BaseExtendedPicker.types';
diff --git a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
index 7f83aa43c30a4..ffbad35d2e413 100644
--- a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
@@ -13,9 +13,9 @@ import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
 import { IPersonaWithMenu } from 'office-ui-fabric-react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.types';
 import { people, mru, groupOne, groupTwo } from './PeopleExampleData';
 import './ExtendedPeoplePicker.Basic.Example.scss';
-import { FloatingPeoplePicker, IBaseFloatingPickerProps } from 'experiments/lib/FloatingPicker';
+import { FloatingPeoplePicker, IBaseFloatingPickerProps } from '../../FloatingPicker';
 import { IBaseSelectedItemsListProps, IExtendedPersonaProps, ISelectedPeopleProps, SelectedPeopleList }
-  from 'experiments/lib/SelectedItemsList';
+  from '../../SelectedItemsList';
 
 export interface IPeoplePickerExampleState {
   peopleList: IPersonaProps[];
diff --git a/packages/experiments/src/components/ExtendedPicker/examples/PeopleExampleData.ts b/packages/experiments/src/components/ExtendedPicker/examples/PeopleExampleData.ts
index 39dc4df24b56e..10564ef8270c9 100644
--- a/packages/experiments/src/components/ExtendedPicker/examples/PeopleExampleData.ts
+++ b/packages/experiments/src/components/ExtendedPicker/examples/PeopleExampleData.ts
@@ -1,5 +1,5 @@
 import { PersonaPresence } from 'office-ui-fabric-react/lib/Persona';
-import { IExtendedPersonaProps } from 'experiments/lib/SelectedItemsList';
+import { IExtendedPersonaProps } from '../../SelectedItemsList';
 import { TestImages } from 'office-ui-fabric-react/lib/common/TestImages';
 
 export const people: (IExtendedPersonaProps & { key: string | number })[] = [
diff --git a/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx b/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
index 916420bb6c5ac..9ef6684af2a67 100644
--- a/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
+++ b/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 /* tslint:enable */
 import { css, getId } from '../../../../Utilities';
 import { Persona, PersonaSize, PersonaPresence } from 'office-ui-fabric-react/lib/Persona';
-import { IPeoplePickerItemProps } from 'experiments/lib/ExtendedPicker';
+import { IPeoplePickerItemProps } from '../../../ExtendedPicker';
 import { ValidationState } from 'office-ui-fabric-react/lib/Pickers';
 import { IconButton } from 'office-ui-fabric-react/lib/Button';
 import * as stylesImport from './PickerItemsDefault.scss';
diff --git a/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
index 6ffd7e6b0ab19..ee21f298f8e78 100644
--- a/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
+++ b/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
@@ -11,7 +11,7 @@ import { IBasePickerSuggestionsProps, ValidationState, SuggestionsController } f
 import { IBaseFloatingPicker } from '../../BaseFloatingPicker.types';
 import { FloatingPeoplePicker } from '../FloatingPeoplePicker';
 import { IPersonaWithMenu } from 'office-ui-fabric-react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.types';
-import { people, mru } from 'experiments/lib/ExtendedPicker';
+import { people, mru } from '../../../ExtendedPicker';
 import './FloatingPeoplePicker.Basic.Example.scss';
 import { SearchBox } from 'office-ui-fabric-react/lib/SearchBox';
 
diff --git a/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx b/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
index d726d3fd93dda..b77f6a7a7d775 100644
--- a/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
@@ -6,7 +6,7 @@ import {
   autobind
 } from 'office-ui-fabric-react/lib/Utilities';
 import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
-import { people, groupOne, groupTwo } from 'experiments/lib/ExtendedPicker';
+import { people, groupOne, groupTwo } from '../../ExtendedPicker';
 import 'office-ui-fabric-react/lib/components/Pickers/PeoplePicker/examples/PeoplePicker.Types.Example.scss';
 import { IBaseSelectedItemsListProps } from '../BaseSelectedItemsList.types';
 import { IExtendedPersonaProps, SelectedPeopleList } from '../SelectedPeopleList/SelectedPeopleList';

From 8550f69d236e9ed3e52c64207d4a9d847f14b057 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Wed, 15 Nov 2017 19:55:24 -0800
Subject: [PATCH 1020/1641] Toggle: Add label as fall back ariaLabel for screen
 reader (#3398)

* Add label as backup ariaLabel

* Add change file

* Updated snapshot
---
 .../toggle-arialabel_2017-11-15-17-32.json            | 11 +++++++++++
 .../src/components/Toggle/Toggle.tsx                  |  2 +-
 .../Toggle/__snapshots__/Toggle.test.tsx.snap         |  2 +-
 3 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/toggle-arialabel_2017-11-15-17-32.json

diff --git a/common/changes/office-ui-fabric-react/toggle-arialabel_2017-11-15-17-32.json b/common/changes/office-ui-fabric-react/toggle-arialabel_2017-11-15-17-32.json
new file mode 100644
index 0000000000000..f8d9d8240ef8d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/toggle-arialabel_2017-11-15-17-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Toggle: Add label as fall back ariaLabel.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
index 0491d66fe85db..9393ef1c74957 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
@@ -101,7 +101,7 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
             ref={ this._resolveRef('_toggleButton') }
             aria-disabled={ disabled }
             aria-pressed={ isChecked }
-            aria-label={ ariaLabel }
+            aria-label={ ariaLabel ? ariaLabel : label }
             data-is-focusable={ true }
             onChange={ this._noop }
             onClick={ this._onClick }
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap
index a420fb64ed86d..0d8889b17559b 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap
@@ -43,7 +43,7 @@ exports[`Toggle renders toggle correctly 1`] = `
   >
     <button
       aria-disabled={undefined}
-      aria-label={undefined}
+      aria-label="Label"
       aria-pressed={false}
       className=
           ms-Toggle-background

From f143a0d268256361a334e8ed33231e507d902e85 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 15 Nov 2017 21:26:21 -0800
Subject: [PATCH 1021/1641] Styling: adding styled, classNameFunction, and
 guidance for styling components. (#3396)

* Styling updates.

* Adding change file.

* Adding docs.

* Updating deps.
---
 .../styling-updates_2017-11-15-01-05.json     |  11 +
 common/config/rush/npm-shrinkwrap.json        | 575 +++++++++---------
 ghdocs/STYLING.md                             | 311 ++++++++++
 packages/styling/package.json                 |  10 +-
 packages/styling/src/MergeStyles.ts           |  15 +
 packages/styling/src/index.ts                 |   3 +-
 .../styling/src/interfaces/IClassNames.ts     |   1 +
 .../styling/src/interfaces/IStyleFunction.ts  |   1 +
 packages/styling/src/interfaces/index.ts      |   2 +
 .../src/office-ui-styling.manifest.json       |   8 -
 .../styling/src/styles/AnimationStyles.ts     |   2 +-
 packages/styling/src/styles/CommonStyles.ts   |  13 +
 packages/styling/src/styles/index.ts          |   1 +
 .../styling/src/utilities/buildClassMap.ts    |   2 +-
 .../src/utilities/classNamesFunction.ts       |  22 +
 packages/styling/src/utilities/index.ts       |   8 +
 packages/styling/src/utilities/styled.tsx     |  49 ++
 17 files changed, 720 insertions(+), 314 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/styling-updates_2017-11-15-01-05.json
 create mode 100644 ghdocs/STYLING.md
 create mode 100644 packages/styling/src/MergeStyles.ts
 create mode 100644 packages/styling/src/interfaces/IClassNames.ts
 create mode 100644 packages/styling/src/interfaces/IStyleFunction.ts
 delete mode 100644 packages/styling/src/office-ui-styling.manifest.json
 create mode 100644 packages/styling/src/styles/CommonStyles.ts
 create mode 100644 packages/styling/src/utilities/classNamesFunction.ts
 create mode 100644 packages/styling/src/utilities/styled.tsx

diff --git a/common/changes/@uifabric/styling/styling-updates_2017-11-15-01-05.json b/common/changes/@uifabric/styling/styling-updates_2017-11-15-01-05.json
new file mode 100644
index 0000000000000..e5acd9bde11d5
--- /dev/null
+++ b/common/changes/@uifabric/styling/styling-updates_2017-11-15-01-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Adding `styled` and `classNameFunction` helpers, in addition to a variety of interface.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 57b1d2993b41d..e4ac7fdb7793f 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -10,25 +10,25 @@
       "integrity": "sha1-6pn2EhtKjwZbTHH4VZXbJxRJiAc="
     },
     "@microsoft/load-themed-styles": {
-      "version": "1.7.8",
-      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.8.tgz",
-      "integrity": "sha1-W42m+k7d2pkYgU5+qYkyRYo6Xtw="
+      "version": "1.7.9",
+      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.9.tgz",
+      "integrity": "sha1-ge9rX6BqbyAb+turkx/VKUO2QBM="
     },
     "@microsoft/loader-load-themed-styles": {
-      "version": "1.6.3",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.6.3.tgz",
-      "integrity": "sha1-U9zUwqMA1jms14PxFr9wR3fpVjs=",
+      "version": "1.6.4",
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.6.4.tgz",
+      "integrity": "sha1-9FItWFxDhxESO3uYY1YVPjkdmy8=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.8",
+        "@microsoft/load-themed-styles": "1.7.9",
         "loader-utils": "1.1.0"
       }
     },
     "@rush-temp/build": {
       "version": "file:projects/build.tgz",
-      "integrity": "sha1-QyuX3XK61fNyPzj8Grpmem4luxU=",
+      "integrity": "sha1-qAgxZJy8shT0D7xzf+TPeo5Z0g4=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.8",
-        "@microsoft/loader-load-themed-styles": "1.6.3",
+        "@microsoft/load-themed-styles": "1.7.9",
+        "@microsoft/loader-load-themed-styles": "1.6.4",
         "autoprefixer": "7.1.6",
         "awesome-typescript-loader": "3.3.0",
         "bundlesize": "0.15.3",
@@ -42,7 +42,7 @@
         "jest": "21.2.1",
         "json-loader": "0.5.7",
         "mustache": "2.3.0",
-        "node-sass": "4.6.0",
+        "node-sass": "4.6.1",
         "open": "0.0.5",
         "postcss": "6.0.14",
         "postcss-loader": "2.0.8",
@@ -52,13 +52,13 @@
         "sinon": "4.1.2",
         "source-map-loader": "0.2.3",
         "style-loader": "0.18.2",
-        "ts-jest": "21.2.1",
+        "ts-jest": "21.2.2",
         "tslint": "5.8.0",
         "tslint-microsoft-contrib": "5.0.1",
         "typescript": "2.5.3",
         "uglifyjs-webpack-plugin": "0.4.6",
         "webpack": "3.8.1",
-        "webpack-bundle-analyzer": "2.9.0",
+        "webpack-bundle-analyzer": "2.9.1",
         "webpack-dev-server": "2.9.4",
         "webpack-notifier": "1.5.0",
         "yargs": "6.6.0"
@@ -66,7 +66,7 @@
     },
     "@rush-temp/example-app-base": {
       "version": "file:projects/example-app-base.tgz",
-      "integrity": "sha1-Ysmm2rkWSlOFLrvOsHbGufWf3bQ=",
+      "integrity": "sha1-j3ZQBDfqb+5tz7E4dLOSj9Hevxo=",
       "requires": {
         "@types/chai": "3.4.35",
         "@types/enzyme": "2.8.8",
@@ -82,7 +82,7 @@
         "es6-promise": "4.1.1",
         "es6-weak-map": "2.0.2",
         "highlight.js": "9.12.0",
-        "office-ui-fabric-react": "5.20.3",
+        "office-ui-fabric-react": "5.21.2",
         "react": "15.6.2",
         "react-addons-test-utils": "15.6.2",
         "react-dom": "15.6.2",
@@ -91,12 +91,12 @@
     },
     "@rush-temp/experiments": {
       "version": "file:projects/experiments.tgz",
-      "integrity": "sha1-/9KdZYtmK1AmQAHPGxVIyGktxHo=",
+      "integrity": "sha1-9QTO6I8BclPjMrmY5zBvgPVsb74=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.8",
+        "@microsoft/load-themed-styles": "1.7.9",
         "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
-        "@types/jest": "21.1.5",
+        "@types/jest": "21.1.6",
         "@types/prop-types": "15.5.1",
         "@types/react": "15.0.38",
         "@types/react-addons-test-utils": "0.14.18",
@@ -133,16 +133,16 @@
             "path-to-regexp": "1.7.0",
             "samsam": "1.3.0",
             "text-encoding": "0.6.4",
-            "type-detect": "4.0.3"
+            "type-detect": "4.0.5"
           }
         }
       }
     },
     "@rush-temp/fabric-website": {
       "version": "file:projects/fabric-website.tgz",
-      "integrity": "sha1-Qpha6ldq/d9xCDsIyu6ScWdN1PQ=",
+      "integrity": "sha1-k2Ow8JVItV/QdyszUQxdEoPt558=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.8",
+        "@microsoft/load-themed-styles": "1.7.9",
         "@types/chai": "3.4.35",
         "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
@@ -160,7 +160,7 @@
         "es6-weak-map": "2.0.2",
         "highlight.js": "9.12.0",
         "json-loader": "0.5.7",
-        "office-ui-fabric-core": "9.1.0",
+        "office-ui-fabric-core": "9.2.0",
         "react": "15.6.2",
         "react-dom": "15.6.2",
         "react-highlight": "0.9.0",
@@ -170,14 +170,14 @@
     },
     "@rush-temp/icons": {
       "version": "file:projects/icons.tgz",
-      "integrity": "sha1-GYYT4jX6C+/jrLc/0NNHpzIjACE=",
+      "integrity": "sha1-AkZq7Bs3y6h2vgyK5z23omht6e8=",
       "requires": {
         "tslib": "1.8.0"
       }
     },
     "@rush-temp/jest-serializer-merge-styles": {
       "version": "file:projects/jest-serializer-merge-styles.tgz",
-      "integrity": "sha1-ME7RL1ELOBB8bgof5tOy7DFYenw=",
+      "integrity": "sha1-6szfoVY9zcXcBXlBMB7PBKcSl08=",
       "requires": {
         "@types/jest": "21.1.0"
       },
@@ -191,7 +191,7 @@
     },
     "@rush-temp/merge-styles": {
       "version": "file:projects/merge-styles.tgz",
-      "integrity": "sha1-tqtj0H2w4fRqAk55j7TqrtaWlYw=",
+      "integrity": "sha1-t50iXpMqJMy8Z2p0cKGIIE7uOvQ=",
       "requires": {
         "@types/jest": "21.1.0",
         "tslib": "1.8.0"
@@ -206,9 +206,9 @@
     },
     "@rush-temp/office-ui-fabric-react": {
       "version": "file:projects/office-ui-fabric-react.tgz",
-      "integrity": "sha1-MBCHesJH5L5/BOh7T0BNd4RQ9Y8=",
+      "integrity": "sha1-nlu+RekYUG5BUJls+WEPqMlUGJo=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.8",
+        "@microsoft/load-themed-styles": "1.7.9",
         "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
         "@types/jest": "21.1.0",
@@ -224,7 +224,7 @@
         "es6-promise": "4.1.1",
         "es6-weak-map": "2.0.2",
         "highlight.js": "9.12.0",
-        "office-ui-fabric-core": "9.1.0",
+        "office-ui-fabric-core": "9.2.0",
         "prop-types": "15.6.0",
         "react": "15.6.2",
         "react-dom": "15.6.2",
@@ -265,23 +265,23 @@
             "path-to-regexp": "1.7.0",
             "samsam": "1.3.0",
             "text-encoding": "0.6.4",
-            "type-detect": "4.0.3"
+            "type-detect": "4.0.5"
           }
         }
       }
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
       "version": "file:projects/office-ui-fabric-react-tslint.tgz",
-      "integrity": "sha1-1nzo8k0PDm/NtJv0G5B/LgTBDa4=",
+      "integrity": "sha1-GzUFiZZpna3icJcVWcTe5rAV8XU=",
       "requires": {
         "tslint-react": "3.2.0"
       }
     },
     "@rush-temp/ssr-tests": {
       "version": "file:projects/ssr-tests.tgz",
-      "integrity": "sha1-Pg1YyaBXIiKSX55opn+eZXAf61U=",
+      "integrity": "sha1-ZE4/U/YeSLDHlqXOSTp6VpZY4ho=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.8",
+        "@microsoft/load-themed-styles": "1.7.9",
         "@types/chai": "3.4.35",
         "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
@@ -298,9 +298,9 @@
     },
     "@rush-temp/styling": {
       "version": "file:projects/styling.tgz",
-      "integrity": "sha1-5Rlp4htpyjfFdIqnSAZShM+qdXU=",
+      "integrity": "sha1-23kYksM8t8ZVnx375XO/GI9N4i8=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.8",
+        "@microsoft/load-themed-styles": "1.7.9",
         "@types/chai": "3.4.35",
         "@types/enzyme": "2.8.8",
         "@types/mocha": "2.2.39",
@@ -308,12 +308,14 @@
         "@types/webpack-env": "1.13.0",
         "es6-map": "0.1.5",
         "es6-weak-map": "2.0.2",
+        "react": "15.6.2",
+        "react-dom": "15.6.2",
         "tslib": "1.8.0"
       }
     },
     "@rush-temp/test-bundle-button": {
       "version": "file:projects/test-bundle-button.tgz",
-      "integrity": "sha1-sK7hEW3440de25uAsFvnZCbi7ts=",
+      "integrity": "sha1-HSXlu7lKD78clB/eJ5Grw5fhhGs=",
       "requires": {
         "@types/prop-types": "15.5.1",
         "@types/react": "15.0.38",
@@ -326,9 +328,9 @@
     },
     "@rush-temp/todo-app": {
       "version": "file:projects/todo-app.tgz",
-      "integrity": "sha1-1aYD4UIapo/Ltg8NJ+Zs9U9ipNs=",
+      "integrity": "sha1-cgVLRhrg0Pf6/MQDwoH8p1nsuLM=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.8",
+        "@microsoft/load-themed-styles": "1.7.9",
         "@types/chai": "3.4.35",
         "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
@@ -353,9 +355,9 @@
     },
     "@rush-temp/utilities": {
       "version": "file:projects/utilities.tgz",
-      "integrity": "sha1-YnAExvB6fTvRq/irpcEH2pBL1ko=",
+      "integrity": "sha1-eifOqcSqgCPno7Tz/TKlJsGWi7U=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.8",
+        "@microsoft/load-themed-styles": "1.7.9",
         "@types/enzyme": "2.8.8",
         "@types/jest": "21.1.0",
         "@types/prop-types": "15.5.1",
@@ -392,17 +394,17 @@
             "path-to-regexp": "1.7.0",
             "samsam": "1.3.0",
             "text-encoding": "0.6.4",
-            "type-detect": "4.0.3"
+            "type-detect": "4.0.5"
           }
         }
       }
     },
     "@rush-temp/vr-tests": {
       "version": "file:projects/vr-tests.tgz",
-      "integrity": "sha1-zwfmYV6/SrsaXW26UIFdUo51U+U=",
+      "integrity": "sha1-EPzI9nOhBbi5RlMEbMS7C0Fcgw8=",
       "requires": {
         "@storybook/addon-options": "3.2.3",
-        "@storybook/react": "3.2.14",
+        "@storybook/react": "3.2.16",
         "@types/react": "15.0.38",
         "@types/react-dom": "15.5.1",
         "@types/storybook__react": "3.0.5",
@@ -525,11 +527,11 @@
       }
     },
     "@storybook/addon-actions": {
-      "version": "3.2.14",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-actions/-/addon-actions-3.2.14.tgz",
-      "integrity": "sha512-tVsgiVxEkygGBs9l8fVqxNAm5cs0ab05DrLcBx3rgMLYzqaadmee7hkQb/Cy0PPoiW9dLSzcZbY/ym8bU24Z3Q==",
+      "version": "3.2.16",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-actions/-/addon-actions-3.2.16.tgz",
+      "integrity": "sha512-TXR/H5lDCtPCmc+/nidvVBiTlGsPHxeJ/LMPuGxq/yF7EvzrfXw+CuEuaPNp5qknSioOLm9GngbozNg8HfBgKg==",
       "requires": {
-        "@storybook/addons": "3.2.14",
+        "@storybook/addons": "3.2.16",
         "deep-equal": "1.0.1",
         "json-stringify-safe": "5.0.1",
         "prop-types": "15.6.0",
@@ -538,11 +540,11 @@
       }
     },
     "@storybook/addon-links": {
-      "version": "3.2.14",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-links/-/addon-links-3.2.14.tgz",
-      "integrity": "sha512-IKCNCs245Bt+ngRypJ0TFcnh/9X9yjvDNGQwc52ioY0287taY71hM1r9tFSKTFzyEISfLFzosfH3D6xEiD5/jg==",
+      "version": "3.2.16",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-links/-/addon-links-3.2.16.tgz",
+      "integrity": "sha512-JFs2p7EGRFpwUkg7xV7Vi3h/zBr4UjmprF9YYHR2L5TQFbztlKJPBhiATRSQtgFyNNAo7zNkSf439Rkrb9k7yQ==",
       "requires": {
-        "@storybook/addons": "3.2.14"
+        "@storybook/addons": "3.2.16"
       }
     },
     "@storybook/addon-options": {
@@ -550,49 +552,59 @@
       "resolved": "https://registry.npmjs.org/@storybook/addon-options/-/addon-options-3.2.3.tgz",
       "integrity": "sha1-6jdA0onUKc52fpaZvzpkfddBWS0=",
       "requires": {
-        "@storybook/addons": "3.2.14"
+        "@storybook/addons": "3.2.16"
       }
     },
     "@storybook/addons": {
-      "version": "3.2.14",
-      "resolved": "https://registry.npmjs.org/@storybook/addons/-/addons-3.2.14.tgz",
-      "integrity": "sha512-DTOuK8/vuK3gPUA8HLYrfF3s+YxWmepHdm0JrbvqL0LUO/xzPZTQrpNhPm9dS96c5hTI41Bwc89/8WyQojiuAQ=="
+      "version": "3.2.16",
+      "resolved": "https://registry.npmjs.org/@storybook/addons/-/addons-3.2.16.tgz",
+      "integrity": "sha512-Dxs0XceqqUSG+vao5uCZdphmCAGlpnwDLV0abjYpPH0eKb2QN5Rs/Vrl0MzuOYGghPv8Y1QfhdB6DFh7AuIoTQ=="
     },
     "@storybook/channel-postmessage": {
-      "version": "3.2.14",
-      "resolved": "https://registry.npmjs.org/@storybook/channel-postmessage/-/channel-postmessage-3.2.14.tgz",
-      "integrity": "sha512-ehrJniC2pjiAMyzY3ABFskHZ7W93UqbZ8XWN3q7jkNNzpo1LXk24jJ6Lv047bat+7pcqmeuEq8OL2T5mdi0avQ==",
+      "version": "3.2.16",
+      "resolved": "https://registry.npmjs.org/@storybook/channel-postmessage/-/channel-postmessage-3.2.16.tgz",
+      "integrity": "sha512-8D3UeZfb4TarkEp0xMCUxX5rW/m2YghYmlnFDcMCgPhN9R2pRySjxxbCjK+ry0q2hUII4R9Bbck63AUqwcQDow==",
       "requires": {
-        "@storybook/channels": "3.2.14",
+        "@storybook/channels": "3.2.16",
         "global": "4.3.2",
         "json-stringify-safe": "5.0.1"
       }
     },
     "@storybook/channels": {
-      "version": "3.2.14",
-      "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-3.2.14.tgz",
-      "integrity": "sha512-n/LhZ9sfXL0TbKbr1ZqAW0m73qoQD3IplcLrmQXmY6zZ613jtbPt0UAoM8cJCFM5TDxQAj5H+6Fb6gHzCwESWA=="
+      "version": "3.2.16",
+      "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-3.2.16.tgz",
+      "integrity": "sha512-zjaDE/0yvlLfOcpzeTIWi1K7d873UykUmGLwFSO2hUIM7hlc+QxCeE0MH+OrQYUWC8gcU8pg+IWAk/6qzWAZsA=="
     },
     "@storybook/components": {
-      "version": "3.2.14",
-      "resolved": "https://registry.npmjs.org/@storybook/components/-/components-3.2.14.tgz",
-      "integrity": "sha512-Qyi5JxLg7l2QPxgz0ZnFFDlwsbPW37Xx7aqtWcwbhNoMGuKIhkbmVl8O2u5b0QJjYkkKJoYSqqTY8RcrhG3j0Q==",
+      "version": "3.2.16",
+      "resolved": "https://registry.npmjs.org/@storybook/components/-/components-3.2.16.tgz",
+      "integrity": "sha512-+bxwsvwa7TPqwxG6ap2hjjrwSg1g8e2ZGijPQDEGpvNfEnLfbZRyQKXRhfCyeAN3DL8F8Bx95AJuWaYKr0pqpA==",
       "requires": {
         "glamor": "2.20.40",
         "glamorous": "4.11.0",
         "prop-types": "15.6.0"
       }
     },
+    "@storybook/mantra-core": {
+      "version": "1.7.2",
+      "resolved": "https://registry.npmjs.org/@storybook/mantra-core/-/mantra-core-1.7.2.tgz",
+      "integrity": "sha512-GD4OYJ8GsayVhIg306sfgcKDk9j8YfuSKIAWvdB/g7IDlw0pDgueONALVEEE2XWJtCwcsUyDtCYzXFgCBWLEjA==",
+      "requires": {
+        "@storybook/react-komposer": "2.0.3",
+        "@storybook/react-simple-di": "1.2.1",
+        "babel-runtime": "6.26.0"
+      }
+    },
     "@storybook/react": {
-      "version": "3.2.14",
-      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-3.2.14.tgz",
-      "integrity": "sha512-Cysxmp5V49AS27CCBQAzLuCa5lLN+wRQ6e3EbYsJJ+9mVMh3fdPDxa508alFn2fMdMW9b6MLYYjoqCWus/Pniw==",
-      "requires": {
-        "@storybook/addon-actions": "3.2.14",
-        "@storybook/addon-links": "3.2.14",
-        "@storybook/addons": "3.2.14",
-        "@storybook/channel-postmessage": "3.2.14",
-        "@storybook/ui": "3.2.14",
+      "version": "3.2.16",
+      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-3.2.16.tgz",
+      "integrity": "sha512-gMS+KrI5u0OTnHYhyLkMLknCQRCyDL3QULXKCYtkUcZ6l2MKvOVSMwwG1VUPWssWtLBvN4Fdx9A+9BxDWLZhpw==",
+      "requires": {
+        "@storybook/addon-actions": "3.2.16",
+        "@storybook/addon-links": "3.2.16",
+        "@storybook/addons": "3.2.16",
+        "@storybook/channel-postmessage": "3.2.16",
+        "@storybook/ui": "3.2.16",
         "airbnb-js-shims": "1.3.0",
         "autoprefixer": "7.1.6",
         "babel-core": "6.26.0",
@@ -614,7 +626,7 @@
         "core-js": "2.5.1",
         "css-loader": "0.28.7",
         "express": "4.16.2",
-        "file-loader": "0.11.2",
+        "file-loader": "1.1.5",
         "find-cache-dir": "1.0.0",
         "glamor": "2.20.40",
         "glamorous": "4.11.0",
@@ -628,7 +640,6 @@
         "postcss-loader": "2.0.8",
         "prop-types": "15.6.0",
         "qs": "6.5.1",
-        "react-modal": "2.4.1",
         "redux": "3.7.2",
         "request": "2.83.0",
         "serve-favicon": "2.4.5",
@@ -643,11 +654,12 @@
       },
       "dependencies": {
         "file-loader": {
-          "version": "0.11.2",
-          "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.11.2.tgz",
-          "integrity": "sha512-N+uhF3mswIFeziHQjGScJ/yHXYt3DiLBeC+9vWW+WjUBiClMSOlV1YrXQi+7KM2aA3Rn4Bybgv+uXFQbfkzpvg==",
+          "version": "1.1.5",
+          "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-1.1.5.tgz",
+          "integrity": "sha512-RzGHDatcVNpGISTvCpfUfOGpYuSR7HSsSg87ki+wF6rw1Hm0RALPTiAdsxAq1UwLf0RRhbe22/eHK6nhXspiOQ==",
           "requires": {
-            "loader-utils": "1.1.0"
+            "loader-utils": "1.1.0",
+            "schema-utils": "0.3.0"
           }
         }
       }
@@ -663,14 +675,45 @@
         "prop-types": "15.6.0"
       }
     },
+    "@storybook/react-komposer": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/@storybook/react-komposer/-/react-komposer-2.0.3.tgz",
+      "integrity": "sha512-DjL/XwZLNx79Rc1y0dyjxme64eUSJeJvajCN587sVDsVZIgsPlDWwmaohOCkPhR8HNGrY89qoeFZZxFslT203w==",
+      "requires": {
+        "@storybook/react-stubber": "1.0.1",
+        "babel-runtime": "6.26.0",
+        "hoist-non-react-statics": "1.2.0",
+        "lodash.pick": "4.4.0",
+        "shallowequal": "0.2.2"
+      }
+    },
+    "@storybook/react-simple-di": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/@storybook/react-simple-di/-/react-simple-di-1.2.1.tgz",
+      "integrity": "sha512-Sj3JU1KpnTIyBWBp+uAZT3PlZ2IVYrxvOOXgpT92Injcmg2KV2ry1GkZen6XuVZqUfU0vz/sK08aP45boErFnw==",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "hoist-non-react-statics": "1.2.0"
+      }
+    },
+    "@storybook/react-stubber": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@storybook/react-stubber/-/react-stubber-1.0.1.tgz",
+      "integrity": "sha512-k+CHH+vA8bQfCmzBTtJsPkITFgD+C/w19KuByZ9WeEvNUFtnDaCqfP+Vp3/OR+3IAfAXYYOWolqPLxNPcEqEjw==",
+      "requires": {
+        "babel-runtime": "6.26.0"
+      }
+    },
     "@storybook/ui": {
-      "version": "3.2.14",
-      "resolved": "https://registry.npmjs.org/@storybook/ui/-/ui-3.2.14.tgz",
-      "integrity": "sha512-0OErMwjq7EtDlTeBRisNcgzmUYHPi7JLW90s2M/i+cYUHRZMvz4JmYH9HwxG8U32QrekJ7l0Ki8eWWzJu6deug==",
+      "version": "3.2.16",
+      "resolved": "https://registry.npmjs.org/@storybook/ui/-/ui-3.2.16.tgz",
+      "integrity": "sha512-K6DwvT2Oo4GrJkT0ij8EW1GsjX7Sw9U6hDp2II5tnKsV7egnIKgJ6y5xGOZLHNvDDkeo5KS+Ii3GjrUbnZ1QzQ==",
       "requires": {
         "@hypnosphi/fuse.js": "3.0.9",
-        "@storybook/components": "3.2.14",
+        "@storybook/components": "3.2.16",
+        "@storybook/mantra-core": "1.7.2",
         "@storybook/react-fuzzy": "0.4.3",
+        "@storybook/react-komposer": "2.0.3",
         "babel-runtime": "6.26.0",
         "deep-equal": "1.0.1",
         "events": "1.1.1",
@@ -680,15 +723,13 @@
         "lodash.debounce": "4.0.8",
         "lodash.pick": "4.4.0",
         "lodash.sortby": "4.7.0",
-        "mantra-core": "1.7.0",
         "podda": "1.2.2",
         "prop-types": "15.6.0",
         "qs": "6.5.1",
         "react-icons": "2.2.7",
         "react-inspector": "2.2.1",
-        "react-komposer": "2.0.0",
-        "react-modal": "2.4.1",
-        "react-split-pane": "0.1.68",
+        "react-modal": "3.1.2",
+        "react-split-pane": "0.1.71",
         "react-treebeard": "2.1.0",
         "redux": "3.7.2"
       }
@@ -728,9 +769,9 @@
       "integrity": "sha512-+kbOcYW1/noncDwRryRoB9tH87IYcMfdBGvw98iocK39LtTA2DFL7agmk4UHW/GxjzVfwrxfjlLrqrgA7MCtmg=="
     },
     "@types/jest": {
-      "version": "21.1.5",
-      "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.5.tgz",
-      "integrity": "sha512-HwBIPK96DROvcB4EX5mA7L2nzhZ3sh8AcDSFODB4eG43S3q3d0+oo356J51qCxw9Bbn7G1DOmBmrw6vf+WiGTg=="
+      "version": "21.1.6",
+      "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.6.tgz",
+      "integrity": "sha512-/qrwhjCeZ8vZy/TPXm56A3baMMUDPfUMkhOGZP3M7dgPCGPZSX/zSieM7jYPuhX3kMcMfsYuvsFIt23u7Ypu2g=="
     },
     "@types/mocha": {
       "version": "2.2.39",
@@ -805,35 +846,35 @@
       "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.2.0.tgz",
       "integrity": "sha512-P5kfPej/wxgR8jZt/GqnU0FqYcz+JH1iCcaaYd6p9L3opmZtu4w5duKeqs+Bc1u7K16r800EQfLgKe76rt6AuA==",
       "requires": {
-        "@uifabric/styling": "5.6.1",
+        "@uifabric/styling": "5.7.0",
         "tslib": "1.8.0"
       }
     },
     "@uifabric/merge-styles": {
-      "version": "5.5.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.5.1.tgz",
-      "integrity": "sha512-T16obR1JtHZWsOn5B8KvXaduJ07WwARAxMRZ7WiygckpKB55ZO987UhY3N930fLlTanslmiY68dN8hgBHJra+A==",
+      "version": "5.6.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.6.0.tgz",
+      "integrity": "sha512-SeHU62hfhNIynSubh08JHi3nNSZjCDxMbJCD6V2hA6HDmxhdGM9r3xaMAikJWnO+bixgBripsNwmAN6bneRMeg==",
       "requires": {
         "tslib": "1.8.0"
       }
     },
     "@uifabric/styling": {
-      "version": "5.6.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.6.1.tgz",
-      "integrity": "sha512-bOt9GH+jjxtivCOIRr8kBlk45/nCOS0jiiSyCPjWFinlP0/x4GZW87pLzl55AHX87VtMu1aSgx9DPHsf9fNxlQ==",
+      "version": "5.7.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.7.0.tgz",
+      "integrity": "sha512-qEq16h2sii7dmxZY2JxG5lbl2n5wftYyaEk09C5Zsu/PVH8Ld60czflXdrgbDdLMhocQomlHJeTTM+cQQ0wtFQ==",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.8",
-        "@uifabric/merge-styles": "5.5.1",
-        "@uifabric/utilities": "5.3.2",
+        "@microsoft/load-themed-styles": "1.7.9",
+        "@uifabric/merge-styles": "5.6.0",
+        "@uifabric/utilities": "5.4.0",
         "tslib": "1.8.0"
       }
     },
     "@uifabric/utilities": {
-      "version": "5.3.2",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.3.2.tgz",
-      "integrity": "sha512-Q4Pl2jn3yoH+NRhSdm+u5YqLhxAT3EcXRRUbHeGbo5YKDH6Vhq0/TJ6SD0EhRUvbHFtdLmcOe7XIc4XknEzGdw==",
+      "version": "5.4.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.4.0.tgz",
+      "integrity": "sha512-g5ZBMkMeUP7y2CId0NnGB2B/wLphePODiTlMlovyS8Xs2KGJ7MkSsrKHd+CXqRIKhRLV6kY8dOm+Sw3Flv2lGA==",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.8",
+        "@microsoft/load-themed-styles": "1.7.9",
         "prop-types": "15.6.0",
         "tslib": "1.8.0"
       }
@@ -977,7 +1018,7 @@
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
       "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug==",
       "requires": {
-        "color-convert": "1.9.0"
+        "color-convert": "1.9.1"
       }
     },
     "ansicolors": {
@@ -1217,9 +1258,9 @@
       "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
     },
     "ast-types": {
-      "version": "0.9.14",
-      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.9.14.tgz",
-      "integrity": "sha512-Ebvx7/0lLboCdyEmAw/4GqwBeKIijPveXNiVGhCGCNxc7z26T5he7DC6ARxu8ByKuzUZZcLog+VP8GMyZrBzJw=="
+      "version": "0.10.1",
+      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.10.1.tgz",
+      "integrity": "sha512-UY7+9DPzlJ9VM8eY0b2TUZcZvF+1pO0hzMtAyjBYKhOmnvRlqYNYnWdtsMj0V16CGaMlpL0G1jnLbLo4AyotuQ=="
     },
     "astral-regex": {
       "version": "1.0.0",
@@ -1244,6 +1285,11 @@
       "resolved": "https://registry.npmjs.org/async-foreach/-/async-foreach-0.1.3.tgz",
       "integrity": "sha1-NhIfhFwFeBct5Bmpfb6x0W7DRUI="
     },
+    "async-limiter": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/async-limiter/-/async-limiter-1.0.0.tgz",
+      "integrity": "sha512-jp/uFnooOiO+L211eZOoSyzpOITMXx1rBITauYykG3BRYPu8h0UcxsPNB04RR5vo4Tyz3+ay17tR6JVf9qzYWg=="
+    },
     "asynckit": {
       "version": "0.4.0",
       "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
@@ -1264,8 +1310,8 @@
       "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-7.1.6.tgz",
       "integrity": "sha512-C9yv/UF3X+eJTi/zvfxuyfxmLibYrntpF3qoJYrMeQwgUJOZrZvpJiMG2FMQ3qnhWtF/be4pYONBBw95ZGe3vA==",
       "requires": {
-        "browserslist": "2.8.0",
-        "caniuse-lite": "1.0.30000760",
+        "browserslist": "2.9.0",
+        "caniuse-lite": "1.0.30000765",
         "normalize-range": "0.1.2",
         "num2fraction": "1.2.2",
         "postcss": "6.0.14",
@@ -1742,7 +1788,7 @@
       "requires": {
         "babel-types": "6.26.0",
         "lodash": "4.17.4",
-        "react-docgen": "2.19.0"
+        "react-docgen": "2.20.0"
       }
     },
     "babel-plugin-syntax-async-functions": {
@@ -2319,7 +2365,7 @@
         "babel-plugin-transform-es2015-unicode-regex": "6.24.1",
         "babel-plugin-transform-exponentiation-operator": "6.24.1",
         "babel-plugin-transform-regenerator": "6.26.0",
-        "browserslist": "2.8.0",
+        "browserslist": "2.9.0",
         "invariant": "2.2.2",
         "semver": "5.4.1"
       }
@@ -2755,19 +2801,19 @@
       }
     },
     "browserify-zlib": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/browserify-zlib/-/browserify-zlib-0.1.4.tgz",
-      "integrity": "sha1-uzX4pRn2AOD6a4SFJByXnQFB+y0=",
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/browserify-zlib/-/browserify-zlib-0.2.0.tgz",
+      "integrity": "sha512-Z942RysHXmJrhqk88FmKBVq/v5tqmSkDz7p54G/MGyjMnCFFnC79XWNbg+Vta8W6Wb2qtSZTSxIGkJrRpCFEiA==",
       "requires": {
-        "pako": "0.2.9"
+        "pako": "1.0.6"
       }
     },
     "browserslist": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.8.0.tgz",
-      "integrity": "sha512-iiWHM1Et6Q4TQpB7Ar6pxuM3TNMXasVJY4Y/oh3q38EwR3Z+IdZ9MyVf7PI4MJFB4xpwMcZgs9bEUnPG2E3TCA==",
+      "version": "2.9.0",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.9.0.tgz",
+      "integrity": "sha512-vJEBcDTANoDhSHL46NeOEW5hvQw7It9uCqzeFPQhpawXfnOwnpvW5C97vn1eGJ7iCkSg8wWU0nYObE7d/N95Iw==",
       "requires": {
-        "caniuse-lite": "1.0.30000760",
+        "caniuse-lite": "1.0.30000765",
         "electron-to-chromium": "1.3.27"
       }
     },
@@ -2821,7 +2867,7 @@
       "requires": {
         "axios": "0.16.2",
         "bytes": "3.0.0",
-        "ci-env": "1.4.0",
+        "ci-env": "1.5.2",
         "commander": "2.11.0",
         "github-build": "1.2.0",
         "glob": "7.1.2",
@@ -2895,7 +2941,7 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw=",
       "requires": {
         "browserslist": "1.7.7",
-        "caniuse-db": "1.0.30000760",
+        "caniuse-db": "1.0.30000765",
         "lodash.memoize": "4.1.2",
         "lodash.uniq": "4.5.0"
       },
@@ -2905,21 +2951,21 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000760",
+            "caniuse-db": "1.0.30000765",
             "electron-to-chromium": "1.3.27"
           }
         }
       }
     },
     "caniuse-db": {
-      "version": "1.0.30000760",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000760.tgz",
-      "integrity": "sha1-PqKUc+t4psywny63Osnh3r/sUo0="
+      "version": "1.0.30000765",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000765.tgz",
+      "integrity": "sha1-FVVUMkILqsuxabxR5bbegEyZlLQ="
     },
     "caniuse-lite": {
-      "version": "1.0.30000760",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000760.tgz",
-      "integrity": "sha1-7HIDlXQvHH7IlH/W3SYE53qPmP8="
+      "version": "1.0.30000765",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000765.tgz",
+      "integrity": "sha1-qhp1AZJ2tIRjwPyipSV/ufJqfJ0="
     },
     "cardinal": {
       "version": "1.0.0",
@@ -3018,9 +3064,9 @@
       }
     },
     "ci-env": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/ci-env/-/ci-env-1.4.0.tgz",
-      "integrity": "sha512-IRvBrZSkdlsHgGZtaM41WBHJKEHpheqMO6B8lHN452zHiKN0imDcDjI9rIqIA4Y5/2uOAxnA8yYqWBzoYqxMMQ=="
+      "version": "1.5.2",
+      "resolved": "https://registry.npmjs.org/ci-env/-/ci-env-1.5.2.tgz",
+      "integrity": "sha512-6NSB3PSw6L7w9vqmlTveD1JpaOhngFYRqhFKNPtSLpx8kpu/3BZwf84Sz8+hsmDzaD+ITuuiNdN6ya5c2DhHWg=="
     },
     "ci-info": {
       "version": "1.1.1",
@@ -3178,9 +3224,9 @@
       }
     },
     "clone": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.2.tgz",
-      "integrity": "sha1-Jgt6meux7f4kdTgXX3gyQ8sZ0Uk="
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.3.tgz",
+      "integrity": "sha1-KY1+IjFmD0DAA8LtMUDezz9TCF8="
     },
     "clone-deep": {
       "version": "0.3.0",
@@ -3243,15 +3289,15 @@
       "resolved": "https://registry.npmjs.org/color/-/color-0.11.4.tgz",
       "integrity": "sha1-bXtcdPtl6EHNSHkq0e1eB7kE12Q=",
       "requires": {
-        "clone": "1.0.2",
-        "color-convert": "1.9.0",
+        "clone": "1.0.3",
+        "color-convert": "1.9.1",
         "color-string": "0.3.0"
       }
     },
     "color-convert": {
-      "version": "1.9.0",
-      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.0.tgz",
-      "integrity": "sha1-Gsz5fdc5uYO/mU1W/sj5WFNkG3o=",
+      "version": "1.9.1",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.1.tgz",
+      "integrity": "sha512-mjGanIiwQJskCC18rPR6OmrZ6fm2Lc7PeGFYwCmy5J34wC6F1PzdGL6xeMfmgicfYcNLGuVFA3WzXtIDCQSZxQ==",
       "requires": {
         "color-name": "1.1.3"
       }
@@ -3414,9 +3460,9 @@
       }
     },
     "connect-history-api-fallback": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.4.0.tgz",
-      "integrity": "sha1-PbJPlz9LkjsOgvYZzg3wJBHKYj0="
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.5.0.tgz",
+      "integrity": "sha1-sGhzk0vF40T+9hGhlqb6rgruAVo="
     },
     "console-browserify": {
       "version": "1.1.0",
@@ -3851,7 +3897,7 @@
           "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ=",
           "requires": {
             "browserslist": "1.7.7",
-            "caniuse-db": "1.0.30000760",
+            "caniuse-db": "1.0.30000765",
             "normalize-range": "0.1.2",
             "num2fraction": "1.2.2",
             "postcss": "5.2.18",
@@ -3863,7 +3909,7 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000760",
+            "caniuse-db": "1.0.30000765",
             "electron-to-chromium": "1.3.27"
           }
         },
@@ -5724,9 +5770,9 @@
       }
     },
     "https-browserify": {
-      "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz",
-      "integrity": "sha1-P5E2XKvmC3ftDruiS0VOPgnZWoI="
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-1.0.0.tgz",
+      "integrity": "sha1-7AbBDgo0wPL68Zn3/X/Hj//QPHM="
     },
     "https-proxy-agent": {
       "version": "1.0.0",
@@ -6974,7 +7020,7 @@
         "hoek": "4.2.0",
         "isemail": "2.2.1",
         "items": "2.1.1",
-        "moment": "2.19.1",
+        "moment": "2.19.2",
         "topo": "2.0.2"
       }
     },
@@ -7425,9 +7471,9 @@
       "integrity": "sha1-0CJTc662Uq3BvILklFM5qEJ1R3M="
     },
     "loglevel": {
-      "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/loglevel/-/loglevel-1.5.1.tgz",
-      "integrity": "sha1-GJB4yUq5BT7iFaCs2/JCROoPZQI="
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/loglevel/-/loglevel-1.6.0.tgz",
+      "integrity": "sha1-rgyqVhERSYxboTcj1vtjHSQAOTQ="
     },
     "lolex": {
       "version": "2.3.0",
@@ -7486,30 +7532,6 @@
         "tmpl": "1.0.4"
       }
     },
-    "mantra-core": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/mantra-core/-/mantra-core-1.7.0.tgz",
-      "integrity": "sha1-qMg+jO6D72pzgxMVGf6AMa1UY4Y=",
-      "requires": {
-        "babel-runtime": "6.26.0",
-        "react-komposer": "1.13.1",
-        "react-simple-di": "1.2.0"
-      },
-      "dependencies": {
-        "react-komposer": {
-          "version": "1.13.1",
-          "resolved": "https://registry.npmjs.org/react-komposer/-/react-komposer-1.13.1.tgz",
-          "integrity": "sha1-S4rEvMcTI710E9yrlcgxGX9Q7tA=",
-          "requires": {
-            "babel-runtime": "6.26.0",
-            "hoist-non-react-statics": "1.2.0",
-            "invariant": "2.2.2",
-            "mobx": "2.7.0",
-            "shallowequal": "0.2.2"
-          }
-        }
-      }
-    },
     "map-cache": {
       "version": "0.2.2",
       "resolved": "https://registry.npmjs.org/map-cache/-/map-cache-0.2.2.tgz",
@@ -7847,11 +7869,6 @@
       "resolved": "https://registry.npmjs.org/mkpath/-/mkpath-0.1.0.tgz",
       "integrity": "sha1-dVSm+Nhxg0zJe1RisSLEwSTW3pE="
     },
-    "mobx": {
-      "version": "2.7.0",
-      "resolved": "https://registry.npmjs.org/mobx/-/mobx-2.7.0.tgz",
-      "integrity": "sha1-zz2C0YwMp/RY2PKiQIF7PcflSgE="
-    },
     "mocha": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz",
@@ -7925,9 +7942,9 @@
       }
     },
     "moment": {
-      "version": "2.19.1",
-      "resolved": "https://registry.npmjs.org/moment/-/moment-2.19.1.tgz",
-      "integrity": "sha1-VtoaLRy/AdOLfhr8McELz6GSkWc="
+      "version": "2.19.2",
+      "resolved": "https://registry.npmjs.org/moment/-/moment-2.19.2.tgz",
+      "integrity": "sha512-Rf6jiHPEfxp9+dlzxPTmRHbvoFXsh2L/U8hOupUMpnuecHQmI6cF6lUbJl3QqKPko1u6ujO+FxtcajLVfLpAtA=="
     },
     "ms": {
       "version": "2.0.0",
@@ -7959,9 +7976,9 @@
       "integrity": "sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s="
     },
     "nan": {
-      "version": "2.7.0",
-      "resolved": "https://registry.npmjs.org/nan/-/nan-2.7.0.tgz",
-      "integrity": "sha1-2Vv3IeyHfgjbJ27T/G63j5CDrUY="
+      "version": "2.8.0",
+      "resolved": "https://registry.npmjs.org/nan/-/nan-2.8.0.tgz",
+      "integrity": "sha1-7XFfP+neArV6XmJS2QqWZ14fCFo="
     },
     "nanomatch": {
       "version": "1.2.5",
@@ -8103,20 +8120,20 @@
       "integrity": "sha1-h6kGXNs1XTGC2PlM4RGIuCXGijs="
     },
     "node-libs-browser": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.0.0.tgz",
-      "integrity": "sha1-o6WeyXAkmFtG6Vg3lkb5bEthZkY=",
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/node-libs-browser/-/node-libs-browser-2.1.0.tgz",
+      "integrity": "sha512-5AzFzdoIMb89hBGMZglEegffzgRg+ZFoUmisQ8HI4j1KDdpx13J0taNp2y9xPbur6W61gepGDDotGBVQ7mfUCg==",
       "requires": {
         "assert": "1.4.1",
-        "browserify-zlib": "0.1.4",
+        "browserify-zlib": "0.2.0",
         "buffer": "4.9.1",
         "console-browserify": "1.1.0",
         "constants-browserify": "1.0.0",
         "crypto-browserify": "3.12.0",
         "domain-browser": "1.1.7",
         "events": "1.1.1",
-        "https-browserify": "0.0.1",
-        "os-browserify": "0.2.1",
+        "https-browserify": "1.0.0",
+        "os-browserify": "0.3.0",
         "path-browserify": "0.0.0",
         "process": "0.11.10",
         "punycode": "1.4.1",
@@ -8124,19 +8141,12 @@
         "readable-stream": "2.3.3",
         "stream-browserify": "2.0.1",
         "stream-http": "2.7.2",
-        "string_decoder": "0.10.31",
+        "string_decoder": "1.0.3",
         "timers-browserify": "2.0.4",
         "tty-browserify": "0.0.0",
         "url": "0.11.0",
         "util": "0.10.3",
         "vm-browserify": "0.0.4"
-      },
-      "dependencies": {
-        "string_decoder": {
-          "version": "0.10.31",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
-          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
-        }
       }
     },
     "node-notifier": {
@@ -8151,9 +8161,9 @@
       }
     },
     "node-sass": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.6.0.tgz",
-      "integrity": "sha512-rh0CvkxpYdQdbWx4EQfunmG0+99BVyVwQHlFE+yUzc6lteF5K3WUcJ0bdmv9E9CqQA1RfuMyvmpDP99cmBObow==",
+      "version": "4.6.1",
+      "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.6.1.tgz",
+      "integrity": "sha512-0zQQ7tjEK5W8RfW9LiQrkzfo7uLZ0QtZGV69rdKn5cFzdweHLJ14lR6xLPvI6UimkXMO8m0qDsXwUCNdnqV3sA==",
       "requires": {
         "async-foreach": "0.1.3",
         "chalk": "1.1.3",
@@ -8167,7 +8177,7 @@
         "lodash.mergewith": "4.6.0",
         "meow": "3.7.0",
         "mkdirp": "0.5.1",
-        "nan": "2.7.0",
+        "nan": "2.8.0",
         "node-gyp": "3.6.2",
         "npmlog": "4.1.2",
         "request": "2.83.0",
@@ -8430,20 +8440,20 @@
       "integrity": "sha1-EEEktsYCxnlogaBCVB0220OlJk4="
     },
     "office-ui-fabric-core": {
-      "version": "9.1.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-9.1.0.tgz",
-      "integrity": "sha512-VwGbHIT89e+9XdGcb2gdPgKgYQGjRG5peyPNO982znlCSB/UIM9g7gF6JmHpaMHb8xvEScY7UGJ8GRz6GQVBRg=="
+      "version": "9.2.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-9.2.0.tgz",
+      "integrity": "sha1-XaNUX43wnxcsbDzXcoj02U1eB88="
     },
     "office-ui-fabric-react": {
-      "version": "5.20.3",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.20.3.tgz",
-      "integrity": "sha512-yWS8lq9w8i/B5RfkCuz9idnAwmN1Ciy5CMGqqpfkJ1D+TTuyQ9m7WXfH2dva5ubWaYdHWHboIlWHPguAj5YU/w==",
+      "version": "5.21.2",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.21.2.tgz",
+      "integrity": "sha512-ERFEVUHVYCKdqmsLTujYkBTRyQNBnWVlAy/UV1qmtvaQVoBOyrMTf9czernWXGeFuVfbB7fSLvyr4IhsVgtDNw==",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.8",
+        "@microsoft/load-themed-styles": "1.7.9",
         "@uifabric/icons": "5.2.0",
-        "@uifabric/merge-styles": "5.5.1",
-        "@uifabric/styling": "5.6.1",
-        "@uifabric/utilities": "5.3.2",
+        "@uifabric/merge-styles": "5.6.0",
+        "@uifabric/styling": "5.7.0",
+        "@uifabric/utilities": "5.4.0",
         "prop-types": "15.6.0",
         "tslib": "1.8.0"
       }
@@ -8587,9 +8597,9 @@
       }
     },
     "os-browserify": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.2.1.tgz",
-      "integrity": "sha1-Y/xMzuXS13Y9Jrv4YBB45sLgBE8="
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.3.0.tgz",
+      "integrity": "sha1-hUNzx/XCMVkU/Jv8a9gjj92h7Cc="
     },
     "os-homedir": {
       "version": "1.0.2",
@@ -8649,9 +8659,9 @@
       "integrity": "sha512-r6zKACMNhjPJMTl8KcFH4li//gkrXWfbD6feV8l6doRHlzljFWGJ2AP6iKaCJXyZmAUMOPtvbW7EXkbWO/pLEA=="
     },
     "pako": {
-      "version": "0.2.9",
-      "resolved": "https://registry.npmjs.org/pako/-/pako-0.2.9.tgz",
-      "integrity": "sha1-8/dSL073gjSNqBYbrZ7P1Rv4OnU="
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/pako/-/pako-1.0.6.tgz",
+      "integrity": "sha512-lQe48YPsMJAig+yngZ87Lus+NF+3mtu7DVOBu6b/gHO1YpKwIj5AWjZ/TOS7i46HD/UixzWb1zeWDZfGZ3iYcg=="
     },
     "parse-asn1": {
       "version": "5.1.0",
@@ -9615,7 +9625,7 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000760",
+            "caniuse-db": "1.0.30000765",
             "electron-to-chromium": "1.3.27"
           }
         },
@@ -10838,9 +10848,9 @@
       "integrity": "sha1-wStu/cIkfBDae4dw0YUICnsEcVY="
     },
     "react-docgen": {
-      "version": "2.19.0",
-      "resolved": "https://registry.npmjs.org/react-docgen/-/react-docgen-2.19.0.tgz",
-      "integrity": "sha1-qeNWJ3qjH0LfFj8LSRfTsHeYX50=",
+      "version": "2.20.0",
+      "resolved": "https://registry.npmjs.org/react-docgen/-/react-docgen-2.20.0.tgz",
+      "integrity": "sha512-+fW1dthCr/cqrAreHTMk2Luzdb3I7xJishC/g4k+vIWiPj4/jM6Ij67WvUjXqio0/TRh7AQtRDYRwqNyinN0LA==",
       "requires": {
         "async": "2.6.0",
         "babel-runtime": "6.26.0",
@@ -10848,7 +10858,7 @@
         "commander": "2.11.0",
         "doctrine": "2.0.0",
         "node-dir": "0.1.17",
-        "recast": "0.12.8"
+        "recast": "0.12.9"
       },
       "dependencies": {
         "babylon": {
@@ -10909,22 +10919,10 @@
         "is-dom": "1.0.9"
       }
     },
-    "react-komposer": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/react-komposer/-/react-komposer-2.0.0.tgz",
-      "integrity": "sha1-uWRzgBSptK7klKg8C1uDPWYHKpA=",
-      "requires": {
-        "babel-runtime": "6.26.0",
-        "hoist-non-react-statics": "1.2.0",
-        "lodash.pick": "4.4.0",
-        "react-stubber": "1.0.0",
-        "shallowequal": "0.2.2"
-      }
-    },
     "react-modal": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-2.4.1.tgz",
-      "integrity": "sha512-3WQCn3xqkbEUvxRUO3nkeqxMNgt1F4CyEU3BiUIrg7C71tnqjQIuSE7+JXp85yFl8X1iRTJouySNpwNqv4kiWg==",
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.1.2.tgz",
+      "integrity": "sha512-a3L2qP0kaqMBy4C1aojs2caUIz3kHRFlnuWJ8zsnuUmh/fKHEDASujVBiQcatn+yUosdE9hViB6JvLfkB0tN2A==",
       "requires": {
         "exenv": "1.2.2",
         "prop-types": "15.6.0"
@@ -10938,42 +10936,25 @@
         "remarkable": "1.7.1"
       }
     },
-    "react-simple-di": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/react-simple-di/-/react-simple-di-1.2.0.tgz",
-      "integrity": "sha1-3eDlv2ifOR7yqwLJBDshP+I5xtA=",
-      "requires": {
-        "babel-runtime": "6.26.0",
-        "hoist-non-react-statics": "1.2.0"
-      }
-    },
     "react-split-pane": {
-      "version": "0.1.68",
-      "resolved": "https://registry.npmjs.org/react-split-pane/-/react-split-pane-0.1.68.tgz",
-      "integrity": "sha512-63CdXX4YRlt2iXM3EbThNSyI1JkCUH3H/MC2TnZT8wwHN3J1mam0FqEa40dTdQl/oBGBuzcuJ7X1Z9+8FMSOMg==",
+      "version": "0.1.71",
+      "resolved": "https://registry.npmjs.org/react-split-pane/-/react-split-pane-0.1.71.tgz",
+      "integrity": "sha512-c7aK5ffRyeOySSWVeoSEsQHBUrNtzXTB9TFNUnZv/2EM7HEnN1Rfsgxag/bpDcl5GuaY5IuMvq7XySc6nyokog==",
       "requires": {
         "@types/inline-style-prefixer": "3.0.1",
-        "@types/react": "16.0.21",
+        "@types/react": "16.0.23",
         "inline-style-prefixer": "3.0.8",
         "prop-types": "15.6.0",
         "react-style-proptype": "3.1.0"
       },
       "dependencies": {
         "@types/react": {
-          "version": "16.0.21",
-          "resolved": "https://registry.npmjs.org/@types/react/-/react-16.0.21.tgz",
-          "integrity": "sha512-al4eps87QOPUQ+Cgpk9n/mWd8BcM7Sa4D8sWWG+Pj186/n3cxleeN/AC+sTjVUY5Xlcbdz8UNO53lnQ8YFteBA=="
+          "version": "16.0.23",
+          "resolved": "https://registry.npmjs.org/@types/react/-/react-16.0.23.tgz",
+          "integrity": "sha512-iWplruxO5ENh7XMEBV6XtL54nrMgM8CrfIJ7+THvnUaddICEssH+EPo1MJoQU209Tz5/rVWTOCvQS8/kRR7zcA=="
         }
       }
     },
-    "react-stubber": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/react-stubber/-/react-stubber-1.0.0.tgz",
-      "integrity": "sha1-Qe4srHLU1P1wpjiW2pjhNzm4Rig=",
-      "requires": {
-        "babel-runtime": "6.26.0"
-      }
-    },
     "react-style-proptype": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/react-style-proptype/-/react-style-proptype-3.1.0.tgz",
@@ -11061,11 +11042,11 @@
       }
     },
     "recast": {
-      "version": "0.12.8",
-      "resolved": "https://registry.npmjs.org/recast/-/recast-0.12.8.tgz",
-      "integrity": "sha512-sqhh1Rn20bAqVMtXzURPM1Py6sAfwJtN9LMWd11pZBJsbD6SO7oxgwZiUVpfUnBDClwrjB88a/hkP/SWNkcaCA==",
+      "version": "0.12.9",
+      "resolved": "https://registry.npmjs.org/recast/-/recast-0.12.9.tgz",
+      "integrity": "sha512-y7ANxCWmMW8xLOaiopiRDlyjQ9ajKRENBH+2wjntIbk3A6ZR1+BLQttkmSHMY7Arl+AAZFwJ10grg2T6f1WI8A==",
       "requires": {
-        "ast-types": "0.9.14",
+        "ast-types": "0.10.1",
         "core-js": "2.5.1",
         "esprima": "4.0.0",
         "private": "0.1.8",
@@ -12137,7 +12118,7 @@
                 "hoek": "4.2.0",
                 "isemail": "2.2.1",
                 "items": "2.1.1",
-                "moment": "2.19.1",
+                "moment": "2.19.2",
                 "topo": "2.0.2"
               }
             },
@@ -12452,7 +12433,7 @@
         "lolex": "2.3.0",
         "nise": "1.2.0",
         "supports-color": "4.5.0",
-        "type-detect": "4.0.3"
+        "type-detect": "4.0.5"
       }
     },
     "slash": {
@@ -13352,9 +13333,9 @@
       "integrity": "sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM="
     },
     "ts-jest": {
-      "version": "21.2.1",
-      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-21.2.1.tgz",
-      "integrity": "sha512-9Q5oalORdt9HpaQ67yl1cHTRoABm+P9/IOibTXqBGyfUZo6MxnsiGy82HVBhENpPXCcFpBW8Az8OT1ScF/HiWQ==",
+      "version": "21.2.2",
+      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-21.2.2.tgz",
+      "integrity": "sha512-jBkZaC995zeUI+t6N7hvnHMnmkHUk2B+Bf7y8ZIgOe6YBNrUIMwRB3CYJmrJtWOefNUXVCr41W2Hab1ut9dy9w==",
       "requires": {
         "babel-core": "6.26.0",
         "babel-plugin-istanbul": "4.1.5",
@@ -13481,9 +13462,9 @@
       }
     },
     "type-detect": {
-      "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.0.3.tgz",
-      "integrity": "sha1-Dj8mcLRAmbC0bChNE2p+9Jx0wuo="
+      "version": "4.0.5",
+      "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.0.5.tgz",
+      "integrity": "sha512-N9IvkQslUGYGC24RkJk1ba99foK6TkwC2FHAEBlQFBP0RxQZS8ZpJuAZcwiY/w9ZJHFQb1aOXBI60OdxhTrwEQ=="
     },
     "type-is": {
       "version": "1.6.15",
@@ -13930,7 +13911,7 @@
         "loader-utils": "1.1.0",
         "memory-fs": "0.4.1",
         "mkdirp": "0.5.1",
-        "node-libs-browser": "2.0.0",
+        "node-libs-browser": "2.1.0",
         "source-map": "0.5.7",
         "supports-color": "4.5.0",
         "tapable": "0.2.8",
@@ -13984,9 +13965,9 @@
       }
     },
     "webpack-bundle-analyzer": {
-      "version": "2.9.0",
-      "resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.9.0.tgz",
-      "integrity": "sha1-tYvDTMMLJ//brz0AvyerpvopxuM=",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.9.1.tgz",
+      "integrity": "sha512-a+UcvlsXvCmclNgfThT8PVyuJKd029By7CxkYEbNNCfs0Lqj9gagjkdv3S3MBvCIKBaUGYs8l4UpiVI0bFoh2Q==",
       "requires": {
         "acorn": "5.2.1",
         "chalk": "1.1.3",
@@ -13998,7 +13979,7 @@
         "lodash": "4.17.4",
         "mkdirp": "0.5.1",
         "opener": "1.4.3",
-        "ws": "2.3.1"
+        "ws": "3.3.1"
       },
       "dependencies": {
         "acorn": {
@@ -14052,7 +14033,7 @@
         "bonjour": "3.5.0",
         "chokidar": "1.7.0",
         "compression": "1.7.1",
-        "connect-history-api-fallback": "1.4.0",
+        "connect-history-api-fallback": "1.5.0",
         "debug": "3.1.0",
         "del": "3.0.0",
         "express": "4.16.2",
@@ -14062,7 +14043,7 @@
         "internal-ip": "1.2.0",
         "ip": "1.1.5",
         "killable": "1.0.0",
-        "loglevel": "1.5.1",
+        "loglevel": "1.6.0",
         "opn": "5.1.0",
         "portfinder": "1.0.13",
         "selfsigned": "1.10.1",
@@ -14160,13 +14141,13 @@
       "integrity": "sha1-DK+dLXVdk67gSdS90NP+LMoqJOs=",
       "requires": {
         "http-parser-js": "0.4.9",
-        "websocket-extensions": "0.1.2"
+        "websocket-extensions": "0.1.3"
       }
     },
     "websocket-extensions": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.2.tgz",
-      "integrity": "sha1-Dhh4HeYpoYMIzhSBZQ9n/6JpOl0="
+      "version": "0.1.3",
+      "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.3.tgz",
+      "integrity": "sha512-nqHUnMXmBzT0w570r2JpJxfiSD1IzoI+HGVdd3aZ0yNi3ngvQ4jv1dtHt5VGxfI2yj5yqImPhOK4vmIh2xMbGg=="
     },
     "whatwg-encoding": {
       "version": "1.0.3",
@@ -14316,7 +14297,7 @@
         "filesize": "3.5.11",
         "lodash": "4.17.4",
         "mkdirp": "0.5.1",
-        "moment": "2.19.1"
+        "moment": "2.19.2"
       },
       "dependencies": {
         "ansi-styles": {
@@ -14344,19 +14325,13 @@
       }
     },
     "ws": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-2.3.1.tgz",
-      "integrity": "sha1-a5Sz5EfLajY/eF6vlK9jWejoHIA=",
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-3.3.1.tgz",
+      "integrity": "sha512-8A/uRMnQy8KCQsmep1m7Bk+z/+LIkeF7w+TDMLtX1iZm5Hq9HsUDmgFGaW1ACW5Cj0b2Qo7wCvRhYN2ErUVp/A==",
       "requires": {
-        "safe-buffer": "5.0.1",
+        "async-limiter": "1.0.0",
+        "safe-buffer": "5.1.1",
         "ultron": "1.1.0"
-      },
-      "dependencies": {
-        "safe-buffer": {
-          "version": "5.0.1",
-          "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
-          "integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
-        }
       }
     },
     "xdg-basedir": {
diff --git a/ghdocs/STYLING.md b/ghdocs/STYLING.md
new file mode 100644
index 0000000000000..ae05ec3fca792
--- /dev/null
+++ b/ghdocs/STYLING.md
@@ -0,0 +1,311 @@
+# Component styling guide
+
+When a consumer uses a component, providing style overrides for the component should not be a fragile guessing game. We should be able to easily tweak component styling and also create variants for subcomponents without a lot of complex effort that's bound to break later on.
+
+A component consists of dom elements, or "areas". Each of the areas should be targetable for styling. The styling applied to each area may depend on the state of the component as well as the contextual theme settings. So, styling should be defined as a function of these inputs:
+
+```tsx
+// Take in styling input, spit out styles for each area.
+function getStyles(props: IComponentStyleProps): IComponentStyles {
+  return {
+    root: { /* styles */ },
+    child1: { /* styles */ },
+    child2: { /* styles */ }
+  };
+}
+```
+
+With this in mind, let's make `getStyles` an optional prop to the component. Now style overrides can be applied in a functional way and even be conditionalized depending on the component state:
+
+```tsx
+const getStyles = props => ({
+  root: [
+    {
+      background: props.theme.palette.themePrimary,
+      selectors: {
+        ':hover': {
+          background: props.theme.palette.themeSecondary,
+        }
+      }
+    },
+    props.isExpanded
+    ? { display: 'block' }
+    : { display: 'none' }
+  ]
+});
+
+<MyComponent getStyles={ myStyleOverrides } />
+```
+
+Quite often, variants of a component which use the style must be created to abstract some customizations. A `styled` HOC is provided which can make creating variants simple:
+
+```tsx
+import { styled } from 'office-ui-fabric-react/lib/Styling';
+import { getStyles } from './MyComponentVariant.styles';
+
+const MyComponentVariant = styled(
+  MyComponent,
+  getStyles
+  })
+);
+```
+
+Within the component implementation, when we need to convert these styles into class names, we will use a helper called `classNameFunction` to create a memoized function which can translate the style objects into strings:
+
+```tsx
+const getClassNames = classNameFunction<ICompStyleProps, ICompStyles>();
+
+class Comp extends React.Component {
+  public render() {
+    const { getStyles, theme } = this.props;
+    const classNames = getClassNames(getStyles, { /* style props */ });
+
+    return (
+      <div className={ classNames.root }>...</div>
+    );
+  }
+}
+```
+
+# Component anatomy
+
+A component should consist of these files:
+
+* `ComponentName.props.ts` - The interfaces for the component. We separate these out for documentation reasons.
+* `ComponentName.base.tsx` - The unstyled component. This renders DOM structure and conrtains logic, MINUS styling opinions.
+* `ComponentName.styles.ts` - Exports a `getStyles` function for the component which takes in `IComponentNameStyleProps` and returns `IComponentNameStyles`.
+
+Once these are defined, you can export the component which ties it all together:
+
+* `ComponentName.tsx` - Using the `styled` helper, exports a new component tying the base component to 1 or more style helpers.
+
+Additionally, each component should have these:
+
+* `ComponentName.checklist.ts` - A checklist status export which allows the documentation to render notes on what validation has been done on the component.
+* `ComponentName.test.tsx` - Unit tests for the component.
+
+The idea is that components, especially reusable atomic components, should by default be exported unstyled. This gives us the flexibility to create variants.
+
+## ComponentName.props.ts changes
+
+The props file should contain these 4 interfaces, in addition to any enums or consts externally required:
+
+1. **IComponentName** - The public method accessible through `componentRef`. This should include the `focus` method, as well as getters for important values like `checked` in the case the component will be referenced and the value may be read manually. Example:
+
+```tsx
+export IComponentName {
+  focus: () => void;
+}
+```
+
+2. **IComponentNameProps** - The props for the component. This should include the `componentRef` prop for accessing the public interface, the `theme` prop (which will be injected by the `@customizable` decorator), as well as the `getStyles` function.
+
+Example:
+
+```tsx
+export IComponentNameProps extends React.Props<ComponentNameBase> {
+
+  componentRef?: (componentRef: IComponentName) => void;
+
+  theme?: ITheme;
+
+  getStyles?: IStyleFunction<IComponentNameStyleProps, IComponentNameStyles>;
+
+}
+```
+
+3. **IComponentNameStyleProps** - The props needed to construct styles. This represents the simplified set of immutable things which control the class names. Note that things which were optional may be set to be required here, to simplify the style definitions:
+
+```tsx
+export interface IComponentNameStyleProps {
+  theme: ITheme;
+  disabled: boolean;
+  checked: boolean;
+}
+```
+
+4. **IComponentNameStyles** The styles which apply to each area of the component. Each area should be listed here required, as an `IStyle`, with `root` always representing the root element of the component:
+
+```tsx
+export interface IComponentNameStyles {
+  root: IStyle;
+  child1: IStyle;
+  // etc.
+}
+```
+
+In the style interface, always refer to the root element using the name `root`, for predictability in styling.
+
+## ComponentName.base.tsx contents
+
+1. The component shoud be named `{ComponentName}Base`.
+2. It should be decorated with the `customizable` decorator using `{ComponentName}Base` as the target name.
+3. It should use the `classNameFunction` helper to create a className generation function.
+
+Example:
+
+```tsx
+import { IComponentNameProps } from ='./ComponentName.props';
+
+const getClassNames = classNameFunction<IComponentNameStyleProps, IComponentNameStyles>();
+
+export class ComponentName extends React.Component<...> {
+  public render() {
+    const { getStyles, theme } = this.props;
+    const classNames = getClassNames(getStyles, { theme: theme! });
+
+    return (
+      <div className={ classNames.root }>Hello</div>;
+    );
+  }
+}
+```
+
+### ComponentName.styles.ts
+
+The styles file should export the `getStyles` function which takes in `IComponentNameStyleProps` and returns `IComponentNameStyles` (the default styling for the component.)
+
+Note that the root element for styles should al
+
+```tsx
+export function getStyles(props: IComponentNameStyleProps): IComponentNameStyles {
+  return {
+    root: {},
+    child: {},
+    etc.
+  };
+}
+```
+
+### Component.tsx
+
+Tying the component to the style is made easy using the `styled` HOC wrapper, whch as input takes the base component and an object of 1 or more style function props.
+
+```tsx
+import { styled } from 'office-ui-fabric-react/lb/Styling';
+import { CompoenentNameBase } from './ComponentName.base';
+import { getStyles } from './ComponentName.styles';
+
+// Create a Breadcrumb variant which uses these default styles.
+export const ComponentName = styled(
+  ComponentNameBase,
+  {
+    getStyles
+  }
+);
+```
+
+#### Support for customized sub component styling
+
+Note that the component may also intend to provide customized styling for nested components. For example, a `Breadcrumb` component may want to expose the `getStyles` function for nested `Crumb` components.
+
+The extra getStyles function would be added to the outer compoent's props:
+
+```
+getCrumbStyles?: IStyleFunction<ICrumbStyleProps, ICrumbStyles>;
+```
+
+The base component would pipe the function into the child:
+
+```tsx
+let { getCrumbStyles } = this.props;
+
+// ...and in the render function:
+
+<Crumb getStyles={ getCrumbStyles }>
+```
+
+And finally, the composite component created by the `styles` wrapper would link default styling for the property:
+
+```tsx
+export const Breadcrumb = styled(
+  BreadcrumbBase,
+  {
+    getStyles,
+    getCrumbStyles
+  }
+)
+```
+
+### ComponentName.test.tsx
+
+The test file should include:
+
+1. A snapshot test locking the component DOM structure down for the important states.
+2. Tests which simulate clicking on things, changing the state of the compoent, and validating things still work.
+
+## Moving styles from scss to ts
+
+Basic conversion just means copying styles from scss into ts, making prop names camelCased instead of kebab-cased, and stringifying everything except for pixel values.
+
+In addition, all static classnames embedded within the tsx file inside of the `css` helper function calls can now move into the styles file.
+
+Styles in scss:
+```css
+.list {
+  white-space: nowrap;
+  padding: 0;
+  margin: 0;
+  display: flex;
+  align-items: stretch;
+}
+```
+
+Converted to ts:
+```ts
+list: [
+  'ms-Breadcrumb-list',
+  {
+    whiteSpace: 'nowrap',
+    padding: 0,
+    margin: 0,
+    display: 'flex',
+    alignItems: 'stretch'
+  }
+],
+```
+
+Some scss special cases:
+
+### mixins and includes
+
+Sass mixins are simply an informal way of using functions. Translating them into actual javascript, where you can reuse and import/export them, is really easy.
+
+If you find some fabric-core mixins are missing, consider adding them to the `@uifabric/styling` package if they are highly reusable. However keep in mind that the PLT1 bundle size WILL be affected, so do this sparingly only for very common things.
+
+## font-size-x variables
+
+Use typesafe enums instead of the sass variables:
+
+```ts
+import { FontSizes } from 'office-ui-fabric-react/lib/Styling';
+
+fontSize: FontSizes.small
+```
+
+### Focus rectangles
+
+The `styling` package has a helper to provide consistent focus rectangles.
+
+
+# Footnotes: Motivations for moving away from SCSS
+
+SCSS a build time process of expanding a high level css-like language into raw css. Our pipeline to load the raw css goes through a javascript conversion process and gets loaded on the page via a javascript library called `load-themed-styles`. Effectively, we have a complex build process which takes rules, converts them into JavaScript, and loads them dynamically.
+
+This process is complicated and adds a number of limitations.
+
+## We can't register classes dynamically
+
+Scenarios like "make this area of the screen use a different theme" become really complicated if build time is the only time for evaluations.
+
+## Bundle size and css loading heft with scss
+
+If a button has 20 different possible states, using scss you must load the css for all 20 of the states pre-emptively, so you end up loading way more rules than you will ever actually use. There is no "plt1 styles vs delay loaded styles". The best you can do is to partition your css to specific modules, and delay load the modules. But in this model, you will still preempt loading a lot of rules that aren't used.
+
+Sass also encourages "mixins" as a way to have one definition of styles that can be used in multiple places. This completely fights against bundle size, since mixins simply stamp duplicates copies of the same rules whereever they're used, resulting in bloated (but highly compressable) style definitions. The compression helps but all of this could be avoided by using a different approach to defining our styling.
+
+## Constant battle with specificity
+
+Perhaps the most difficult thing to resolve is css specificity. Countless hacks have been implemented to "slightly tweak" styling of a thing in a particular context. If your rule is equally specific as an existing rule, you have a race condition; last one to register wins, resulting in hacks that only work sometimes. And even if your rule is more specific than an existing rule, there are no gates that can catch an existing rule being changed to be more specific later, resulting in breaking the workarounds.
+
+We want a system which allows users to pass in their overrides, which can create new permutations of classes which are only 1 level of specificity deep, providing a consistent safe way to override the defaults.
diff --git a/packages/styling/package.json b/packages/styling/package.json
index ab6acecc3968e..95286cb0ffafc 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -17,12 +17,18 @@
     "@types/react": "15.0.38",
     "es6-map": "^0.1.5",
     "es6-weak-map": "^2.0.2",
-    "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
+    "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
+    "react": "^15.6.1",
+    "react-dom": "^15.6.1"
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=5.4.0 <6.0.0",
+    "@uifabric/utilities": ">=5.3.3 <6.0.0",
     "@uifabric/merge-styles": ">=5.6.0 <6.0.0",
     "tslib": "^1.7.1"
+  },
+  "peerDependencies": {
+    "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
+    "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   }
 }
\ No newline at end of file
diff --git a/packages/styling/src/MergeStyles.ts b/packages/styling/src/MergeStyles.ts
new file mode 100644
index 0000000000000..bc733bdcc87bd
--- /dev/null
+++ b/packages/styling/src/MergeStyles.ts
@@ -0,0 +1,15 @@
+export {
+  IFontFace,
+  IFontWeight,
+  IRawStyle,
+  IStyle,
+  IStyleSet,
+  IStyleSheetConfig,
+  InjectionMode,
+  Stylesheet,
+  concatStyleSets,
+  fontFace,
+  keyframes,
+  mergeStyleSets,
+  mergeStyles
+} from '@uifabric/merge-styles/lib/index';
diff --git a/packages/styling/src/index.ts b/packages/styling/src/index.ts
index 12e59990fad16..ae36ccded0302 100644
--- a/packages/styling/src/index.ts
+++ b/packages/styling/src/index.ts
@@ -2,5 +2,4 @@ export * from './classNames/index';
 export * from './styles/index';
 export * from './utilities/index';
 export * from './interfaces/index';
-
-export * from '@uifabric/merge-styles/lib/index';
+export * from './MergeStyles';
diff --git a/packages/styling/src/interfaces/IClassNames.ts b/packages/styling/src/interfaces/IClassNames.ts
new file mode 100644
index 0000000000000..fb5a5822e3610
--- /dev/null
+++ b/packages/styling/src/interfaces/IClassNames.ts
@@ -0,0 +1 @@
+export type IClassNames<T> = {[key in keyof T]: string };
diff --git a/packages/styling/src/interfaces/IStyleFunction.ts b/packages/styling/src/interfaces/IStyleFunction.ts
new file mode 100644
index 0000000000000..291ca7c6c03d9
--- /dev/null
+++ b/packages/styling/src/interfaces/IStyleFunction.ts
@@ -0,0 +1 @@
+export type IStyleFunction<TStylesProps, TStyles> = (props: TStylesProps) => Partial<TStyles>;
diff --git a/packages/styling/src/interfaces/index.ts b/packages/styling/src/interfaces/index.ts
index daf0be7b9ff4d..9fe8fda3fcfc7 100644
--- a/packages/styling/src/interfaces/index.ts
+++ b/packages/styling/src/interfaces/index.ts
@@ -3,3 +3,5 @@ export { IFontStyles } from './IFontStyles';
 export { IPalette } from './IPalette';
 export { ISemanticColors } from './ISemanticColors';
 export { ITheme, IPartialTheme } from './ITheme';
+export { IClassNames } from './IClassNames';
+export { IStyleFunction } from './IStyleFunction';
diff --git a/packages/styling/src/office-ui-styling.manifest.json b/packages/styling/src/office-ui-styling.manifest.json
deleted file mode 100644
index 492d48e60542c..0000000000000
--- a/packages/styling/src/office-ui-styling.manifest.json
+++ /dev/null
@@ -1,8 +0,0 @@
-{
-  "$schema": "../node_modules/@microsoft/sp-module-interfaces/lib/manifestSchemas/jsonSchemas/clientSideComponentManifestSchema.json",
-  "id": "999a39fc-2e41-878c-eeb6-f8d33c5e46cf",
-  "alias": "OfficeUIStyling",
-  "componentType": "Library",
-  "version": "*",
-  "manifestVersion": 2
-}
\ No newline at end of file
diff --git a/packages/styling/src/styles/AnimationStyles.ts b/packages/styling/src/styles/AnimationStyles.ts
index 74edd2d8412f5..d0cc02e1f4610 100644
--- a/packages/styling/src/styles/AnimationStyles.ts
+++ b/packages/styling/src/styles/AnimationStyles.ts
@@ -53,7 +53,7 @@ const SCALE_UP100: string = keyframes({
 
 const SCALE_DOWN98: string = keyframes({
   from: { transform: 'scale3d(1,1,1)' },
-  'top': { transform: 'scale3d(.98,.98,1)' },
+  to: { transform: 'scale3d(.98,.98,1)' },
 });
 
 const SCALE_DOWN100: string = keyframes({
diff --git a/packages/styling/src/styles/CommonStyles.ts b/packages/styling/src/styles/CommonStyles.ts
new file mode 100644
index 0000000000000..6e338dc9a6a36
--- /dev/null
+++ b/packages/styling/src/styles/CommonStyles.ts
@@ -0,0 +1,13 @@
+export const HighContrastSelector = '@media screen and (-ms-high-contrast: active)';
+
+export const ScreenWidthMinSmall = 320;
+export const ScreenWidthMinMedium = 480;
+export const ScreenWidthMinLarge = 640;
+export const ScreenWidthMinXLarge = 1024;
+export const ScreenWidthMinXXLarge = 1366;
+export const ScreenWidthMinXXXLarge = 1920;
+export const ScreenWidthMaxSmall = ScreenWidthMinMedium - 1;
+export const ScreenWidthMaxMedium = ScreenWidthMinLarge - 1;
+export const ScreenWidthMaxLarge = ScreenWidthMinXLarge - 1;
+export const ScreenWidthMaxXLarge = ScreenWidthMinXXLarge - 1;
+export const ScreenWidthMaxXXLarge = ScreenWidthMinXXXLarge - 1;
diff --git a/packages/styling/src/styles/index.ts b/packages/styling/src/styles/index.ts
index 8277a89d758ea..1c6273ddbfe89 100644
--- a/packages/styling/src/styles/index.ts
+++ b/packages/styling/src/styles/index.ts
@@ -9,3 +9,4 @@ export {
   loadTheme,
   createTheme
 } from './theme';
+export * from './CommonStyles';
diff --git a/packages/styling/src/utilities/buildClassMap.ts b/packages/styling/src/utilities/buildClassMap.ts
index f1e1a88517d97..1f443a765bf4d 100644
--- a/packages/styling/src/utilities/buildClassMap.ts
+++ b/packages/styling/src/utilities/buildClassMap.ts
@@ -1,4 +1,4 @@
-import { mergeStyles } from '@uifabric/merge-styles/lib/index';
+import { mergeStyles } from '../MergeStyles';
 
 /**
  * Builds a class names object from a given map.
diff --git a/packages/styling/src/utilities/classNamesFunction.ts b/packages/styling/src/utilities/classNamesFunction.ts
new file mode 100644
index 0000000000000..15b60f1aba2d5
--- /dev/null
+++ b/packages/styling/src/utilities/classNamesFunction.ts
@@ -0,0 +1,22 @@
+import { mergeStyleSets } from '../MergeStyles';
+import {
+  IClassNames,
+  IStyleFunction
+} from '../interfaces/index';
+
+/**
+ * Creates a getClassNames function which calls getStyles given the props, and injects them
+ * into mergeStyleSets.
+ */
+export function classNamesFunction<TStyleProps extends {}, TStyles extends {}>(): (
+  getStyles?: IStyleFunction<TStyleProps, TStyles>,
+  styleProps?: TStyleProps
+) => IClassNames<TStyles> {
+
+  // TODO: memoize.
+  return (
+    getStyles?: IStyleFunction<TStyleProps, TStyles>,
+    styleProps?: TStyleProps
+  ): IClassNames<TStyles> => mergeStyleSets(getStyles && getStyles(styleProps!)
+  );
+}
diff --git a/packages/styling/src/utilities/index.ts b/packages/styling/src/utilities/index.ts
index df9963b41c9f6..eea3f3cc7bfce 100644
--- a/packages/styling/src/utilities/index.ts
+++ b/packages/styling/src/utilities/index.ts
@@ -15,3 +15,11 @@ export {
 export {
   getIconClassName
 } from './getIconClassName';
+
+export {
+  IPropsWithStyles,
+  styled
+} from './styled';
+export {
+  classNamesFunction
+} from './classNamesFunction';
\ No newline at end of file
diff --git a/packages/styling/src/utilities/styled.tsx b/packages/styling/src/utilities/styled.tsx
new file mode 100644
index 0000000000000..c96c2cc513b04
--- /dev/null
+++ b/packages/styling/src/utilities/styled.tsx
@@ -0,0 +1,49 @@
+import * as React from 'react';
+import { concatStyleSets } from '../MergeStyles';
+import { IStyleFunction } from '../interfaces/index';
+
+export interface IPropsWithStyles<TStyleProps, TStyles> {
+  getStyles?: IStyleFunction<TStyleProps, TStyles>;
+  subComponents?: {
+    [key: string]: IStyleFunction<{}, {}>;
+  };
+}
+
+/**
+ * The styled HOC wrapper allows you to create a functional wrapper around a given component which will resolve
+ * getStyles functional props, and mix customized props passed in using concatStyleSets. Example:
+ *
+ * ```tsx
+ * export const Toggle = styled(
+ *   ToggleBase,
+ *   {
+ *     getStyles: props => ({ root: { background: 'red' }})
+ *   }
+ * );
+ * ```
+ *
+ */
+export function styled<TComponentProps extends IPropsWithStyles<TStyleProps, TStyles>, TStyleProps, TStyles>(
+  Component: React.ComponentClass<TComponentProps> | React.StatelessComponent<TComponentProps>,
+  getBaseStyles: (props: TStyleProps) => TStyles,
+  getProps?: (props: TComponentProps) => Partial<TComponentProps>
+): (props: TComponentProps) => JSX.Element {
+
+  return (componentProps: TComponentProps) => {
+    const getStyles = (
+      styleProps: TStyleProps
+    ) => concatStyleSets(
+      getBaseStyles && getBaseStyles(styleProps),
+      componentProps && componentProps.getStyles && componentProps.getStyles(styleProps)
+    );
+    const additionalProps = getProps ? getProps(componentProps) : {};
+
+    return (
+      <Component
+        { ...additionalProps }
+        { ...componentProps }
+        getStyles={ getStyles }
+      />
+    );
+  };
+}

From ba70b786c4fbafd21693d6ce5e24e0a9cb085b0d Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Wed, 15 Nov 2017 21:35:07 -0800
Subject: [PATCH 1022/1641] SplitButton: Avoid applying selector rest changes
 when in toggle state (#3395)

* Add validation to not apply hovered/focus selectors when in toggle state

* Add change file
---
 ...ozano-SplitButtonToggleState_2017-11-14-23-30.json | 11 +++++++++++
 .../Button/SplitButton/SplitButton.classNames.ts      |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/malozano-SplitButtonToggleState_2017-11-14-23-30.json

diff --git a/common/changes/office-ui-fabric-react/malozano-SplitButtonToggleState_2017-11-14-23-30.json b/common/changes/office-ui-fabric-react/malozano-SplitButtonToggleState_2017-11-14-23-30.json
new file mode 100644
index 0000000000000..981eceb4984fa
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-SplitButtonToggleState_2017-11-14-23-30.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SplitButton: Avoid applying selector rest changes when in toggle state",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts
index 8dd37f9da69aa..bc20f3fdc8714 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.classNames.ts
@@ -37,10 +37,10 @@ export const getClassNames = memoizeFunction((
         styles.splitButtonContainerChecked,
         {
           selectors: {
-            ':hover': styles.splitButtonContainerHovered
+            ':hover': styles.splitButtonContainerCheckedHovered
           }
         }],
-      !disabled && [{
+      !disabled && !checked && [{
         selectors: {
           ':hover': styles.splitButtonContainerHovered,
           ':focus': styles.splitButtonContainerFocused

From 27b3e985fe437ad6b1dfcda1924eb6f13191f509 Mon Sep 17 00:00:00 2001
From: Yimin Wu <yimwu@microsoft.com>
Date: Wed, 15 Nov 2017 21:40:03 -0800
Subject: [PATCH 1023/1641] Dropdown: Add parameter to focus interface to allow
 open dropdown after set focus. (#3404)

* Remove extra focus border for dropdown option.

* Add parameter to DropDown focus interface to allow open dropdown after set focus.

* rename param

* change log

* fix tslint error
---
 .../yimwu-dropdownfocus_2017-11-16-04-48.json | 11 ++++++++++
 .../src/components/Dropdown/Dropdown.scss     |  4 ----
 .../src/components/Dropdown/Dropdown.tsx      |  7 ++++++-
 .../src/components/Dropdown/Dropdown.types.ts |  2 +-
 .../examples/Dropdown.Basic.Example.tsx       | 21 +++++++++++++++----
 5 files changed, 35 insertions(+), 10 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/yimwu-dropdownfocus_2017-11-16-04-48.json

diff --git a/common/changes/office-ui-fabric-react/yimwu-dropdownfocus_2017-11-16-04-48.json b/common/changes/office-ui-fabric-react/yimwu-dropdownfocus_2017-11-16-04-48.json
new file mode 100644
index 0000000000000..f018469ef977d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/yimwu-dropdownfocus_2017-11-16-04-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: Update dropdown interface to allow open dropdown after focus and remove extra focus border for dropdown option.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "yimwu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
index bd7f9d72f78bd..116f481c8d411 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
@@ -195,8 +195,6 @@ $DropDown-item-height: 32px;
     color: inherit;
   }
 
-  @include focus-border();
-
   &:focus {
     background-color: $ms-color-neutralLighter;
     @include highContrastListItemState;
@@ -222,8 +220,6 @@ $DropDown-item-height: 32px;
   background-color: $Dropdown-selectedItem-bg;
   color: $ms-color-black;
 
-  @include focus-border();
-
   @include highContrastListItemState;
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index bad23f86d83b6..9e48f734b6bff 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -212,9 +212,14 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     );
   }
 
-  public focus() {
+  public focus(shouldOpenOnFocus?: boolean) {
     if (this._dropDown && this._dropDown.tabIndex !== -1) {
       this._dropDown.focus();
+      if (shouldOpenOnFocus) {
+        this.setState({
+          isOpen: true
+        });
+      }
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.types.ts b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.types.ts
index 9763db46c53c3..c9bed000288cd 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.types.ts
@@ -6,7 +6,7 @@ import { ResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
 export { SelectableOptionMenuItemType as DropdownMenuItemType } from '../../utilities/selectableOption/SelectableOption.types';
 
 export interface IDropdown {
-  focus: () => void;
+  focus: (shouldOpenOnFocus?: boolean) => void;
 }
 
 export interface IDropdownProps extends ISelectableDroppableTextProps<HTMLDivElement> {
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
index 28f30e726f6a8..ba866c24539b5 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
@@ -1,9 +1,11 @@
 import * as React from 'react';
-import { Dropdown, DropdownMenuItemType, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
-import { autobind } from '../../../Utilities';
+import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
+import { Dropdown, IDropdown, DropdownMenuItemType, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
+import { autobind, BaseComponent } from '../../../Utilities';
 import './Dropdown.Basic.Example.scss';
 
-export class DropdownBasicExample extends React.Component<any, any> {
+export class DropdownBasicExample extends BaseComponent<any, any> {
+  private _basicDropdown: IDropdown;
   constructor() {
     super();
     this.state = {
@@ -42,8 +44,12 @@ export class DropdownBasicExample extends React.Component<any, any> {
           }
           onFocus={ this._log('onFocus called') }
           onBlur={ this._log('onBlur called') }
+          componentRef={ this._resolveRef('_basicDropdown') }
+        />
+        <PrimaryButton
+          text='Set focus'
+          onClick={ this._onSetFocusButtonClicked }
         />
-
         <Dropdown
           className='Dropdown-example'
           label='Disabled uncontrolled example with defaultSelectedKey:'
@@ -188,6 +194,13 @@ export class DropdownBasicExample extends React.Component<any, any> {
     return newArray;
   }
 
+  @autobind
+  private _onSetFocusButtonClicked() {
+    if (this._basicDropdown) {
+      this._basicDropdown.focus(true);
+    }
+  }
+
   private _log(str: string): () => void {
     return (): void => {
       console.log(str);

From d973229862379082ddf4415d6286864150bf25ee Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 16 Nov 2017 08:14:13 +0200
Subject: [PATCH 1024/1641] Checkbox: Add getClassNames prop (#3392)

* Allow overriding getClassNames

* Rush change

* Make classNames optional

* Provide the theme!

* Fix dumb import
---
 .../chrisgo-getClassNames_2017-11-14-23-58.json  | 11 +++++++++++
 .../components/Checkbox/Checkbox.classNames.ts   |  4 ++--
 .../src/components/Checkbox/Checkbox.tsx         | 16 +++++++++-------
 .../src/components/Checkbox/Checkbox.types.ts    | 11 +++++++++++
 4 files changed, 33 insertions(+), 9 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/chrisgo-getClassNames_2017-11-14-23-58.json

diff --git a/common/changes/office-ui-fabric-react/chrisgo-getClassNames_2017-11-14-23-58.json b/common/changes/office-ui-fabric-react/chrisgo-getClassNames_2017-11-14-23-58.json
new file mode 100644
index 0000000000000..c346423cbc6c9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/chrisgo-getClassNames_2017-11-14-23-58.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Checkbox: Add getClassNames prop to allow complete customization of the component",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.classNames.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.classNames.ts
index ff0bbaa506916..2d9e325e2e9ac 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.classNames.ts
@@ -12,10 +12,10 @@ export interface ICheckboxClassNames {
 
 export const getClassNames = memoizeFunction((
   styles: ICheckboxStyles,
-  className: string,
   disabled: boolean,
   isChecked: boolean,
-  isReversed: boolean
+  isReversed: boolean,
+  className?: string
 ): ICheckboxClassNames => {
   return {
     root: mergeStyles(
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
index 3d306c7705fd7..1062305e0dccb 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
@@ -88,13 +88,15 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
     const isChecked = checked === undefined ? this.state.isChecked : checked;
     const isReversed = boxSide !== 'start' ? true : false;
 
-    this._classNames = getClassNames(
-      getStyles(theme!, customStyles),
-      className!,
-      disabled!,
-      isChecked!,
-      isReversed!
-    );
+    this._classNames = this.props.getClassNames ?
+      this.props.getClassNames(theme!, !!disabled, !!isChecked, !!isReversed, className)
+      : getClassNames(
+        getStyles(theme!, customStyles),
+        !!disabled,
+        !!isChecked,
+        !!isReversed,
+        className
+      );
 
     return (
       <button
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.types.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.types.ts
index 24638d19ebe4d..67127151d734e 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.types.ts
@@ -2,6 +2,7 @@ import * as React from 'react';
 import { IStyle, ITheme } from '../../Styling';
 import { IRenderFunction } from '../../Utilities';
 import { IIconProps } from '../Icon/Icon.types';
+import { ICheckboxClassNames } from './Checkbox.classNames';
 
 /**
  * Checkbox class interface.
@@ -95,6 +96,16 @@ export interface ICheckboxProps extends React.ButtonHTMLAttributes<HTMLElement |
    */
   styles?: ICheckboxStyles;
 
+  /**
+   * Custom function for providing the classNames for the checkbox. Can be used to provide
+   * all styles for the component instead of applying them on top of the default styles.
+   */
+  getClassNames?: (theme: ITheme,
+    disabled: boolean,
+    isChecked: boolean,
+    isReversed: boolean,
+    className?: string) => ICheckboxClassNames;
+
   /**
    * Custom render function for the label.
    */

From b00e3b1707710be1261c7b8a43c805339b0ec2bc Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 16 Nov 2017 11:20:34 +0000
Subject: [PATCH 1025/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 ...fixExperimentImports_2017-11-15-17-42.json | 11 ------
 .../rename-props_2017-11-11-20-23.json        | 11 ------
 .../rename-props_2017-11-11-20-23.json        | 11 ------
 .../styling-updates_2017-11-15-01-05.json     | 11 ------
 ...hrisgo-getClassNames_2017-11-14-23-58.json | 11 ------
 ...litButtonToggleState_2017-11-14-23-30.json | 11 ------
 .../toggle-arialabel_2017-11-15-17-32.json    | 11 ------
 .../yimwu-dropdownfocus_2017-11-16-04-48.json | 11 ------
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/CHANGELOG.json           | 19 ++++++++++
 packages/experiments/CHANGELOG.md             | 19 ++++++----
 packages/experiments/package.json             |  4 +--
 packages/icons/package.json                   |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 36 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 +++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/CHANGELOG.json               | 14 ++++++++
 packages/styling/CHANGELOG.md                 |  9 ++++-
 packages/styling/package.json                 |  2 +-
 20 files changed, 112 insertions(+), 104 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/fixExperimentImports_2017-11-15-17-42.json
 delete mode 100644 common/changes/@uifabric/experiments/rename-props_2017-11-11-20-23.json
 delete mode 100644 common/changes/@uifabric/styling/rename-props_2017-11-11-20-23.json
 delete mode 100644 common/changes/@uifabric/styling/styling-updates_2017-11-15-01-05.json
 delete mode 100644 common/changes/office-ui-fabric-react/chrisgo-getClassNames_2017-11-14-23-58.json
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-SplitButtonToggleState_2017-11-14-23-30.json
 delete mode 100644 common/changes/office-ui-fabric-react/toggle-arialabel_2017-11-15-17-32.json
 delete mode 100644 common/changes/office-ui-fabric-react/yimwu-dropdownfocus_2017-11-16-04-48.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 7fd3854d59beb..950723992697d 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.21.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.22.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/fixExperimentImports_2017-11-15-17-42.json b/common/changes/@uifabric/experiments/fixExperimentImports_2017-11-15-17-42.json
deleted file mode 100644
index 357193a2b92ed..0000000000000
--- a/common/changes/@uifabric/experiments/fixExperimentImports_2017-11-15-17-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Fix experiment imports for FloatingPicker and ExtendedPicker components",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "amyngu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/rename-props_2017-11-11-20-23.json b/common/changes/@uifabric/experiments/rename-props_2017-11-11-20-23.json
deleted file mode 100644
index 2098be827ee86..0000000000000
--- a/common/changes/@uifabric/experiments/rename-props_2017-11-11-20-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/experiments",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/rename-props_2017-11-11-20-23.json b/common/changes/@uifabric/styling/rename-props_2017-11-11-20-23.json
deleted file mode 100644
index f6d55bf7f71ba..0000000000000
--- a/common/changes/@uifabric/styling/rename-props_2017-11-11-20-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/styling-updates_2017-11-15-01-05.json b/common/changes/@uifabric/styling/styling-updates_2017-11-15-01-05.json
deleted file mode 100644
index e5acd9bde11d5..0000000000000
--- a/common/changes/@uifabric/styling/styling-updates_2017-11-15-01-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Adding `styled` and `classNameFunction` helpers, in addition to a variety of interface.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/chrisgo-getClassNames_2017-11-14-23-58.json b/common/changes/office-ui-fabric-react/chrisgo-getClassNames_2017-11-14-23-58.json
deleted file mode 100644
index c346423cbc6c9..0000000000000
--- a/common/changes/office-ui-fabric-react/chrisgo-getClassNames_2017-11-14-23-58.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Checkbox: Add getClassNames prop to allow complete customization of the component",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/malozano-SplitButtonToggleState_2017-11-14-23-30.json b/common/changes/office-ui-fabric-react/malozano-SplitButtonToggleState_2017-11-14-23-30.json
deleted file mode 100644
index 981eceb4984fa..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-SplitButtonToggleState_2017-11-14-23-30.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SplitButton: Avoid applying selector rest changes when in toggle state",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/toggle-arialabel_2017-11-15-17-32.json b/common/changes/office-ui-fabric-react/toggle-arialabel_2017-11-15-17-32.json
deleted file mode 100644
index f8d9d8240ef8d..0000000000000
--- a/common/changes/office-ui-fabric-react/toggle-arialabel_2017-11-15-17-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Toggle: Add label as fall back ariaLabel.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/yimwu-dropdownfocus_2017-11-16-04-48.json b/common/changes/office-ui-fabric-react/yimwu-dropdownfocus_2017-11-16-04-48.json
deleted file mode 100644
index f018469ef977d..0000000000000
--- a/common/changes/office-ui-fabric-react/yimwu-dropdownfocus_2017-11-16-04-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: Update dropdown interface to allow open dropdown after focus and remove extra focus border for dropdown option.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "yimwu@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 14f45c630fc7d..ab242cc33ad8b 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -38,7 +38,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.7.0 <6.0.0",
+    "@uifabric/styling": ">=5.8.0 <6.0.0",
     "@uifabric/utilities": ">=5.4.0 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 41e974a584dc0..647598721707d 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.5.2",
+      "tag": "@uifabric/experiments_v5.5.2",
+      "date": "Thu, 16 Nov 2017 11:20:34 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "amyngu <31973030+amyngu@users.noreply.github.com>",
+            "commit": "7c6d7b6aa050c3fa02bda1fbf596111b60bd20fc",
+            "comment": "Fix experiment imports for FloatingPicker and ExtendedPicker components"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.21.2 <6.0.0` to `>=5.22.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.5.1",
       "tag": "@uifabric/experiments_v5.5.1",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index ead55b788878a..67c7535b850ec 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Wed, 08 Nov 2017 11:11:27 GMT and should not be manually modified.
+This log was last generated on Thu, 16 Nov 2017 11:20:34 GMT and should not be manually modified.
+
+## 5.5.2
+Thu, 16 Nov 2017 11:20:34 GMT
+
+### Patches
+
+- Fix experiment imports for FloatingPicker and ExtendedPicker components
 
 ## 5.5.1
 Wed, 08 Nov 2017 11:11:27 GMT
@@ -72,7 +79,7 @@ Fri, 06 Oct 2017 10:18:41 GMT
 ## 5.0.3
 Wed, 04 Oct 2017 22:40:22 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 5.0.2
 Sat, 30 Sep 2017 01:26:37 GMT
@@ -197,12 +204,12 @@ Fri, 25 Aug 2017 20:31:51 GMT
 ## 0.1.6
 Fri, 25 Aug 2017 19:27:18 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.1.5
 Thu, 24 Aug 2017 10:20:20 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.1.4
 Thu, 24 Aug 2017 05:38:14 GMT
@@ -224,7 +231,7 @@ Wed, 23 Aug 2017 19:04:55 GMT
 ## 0.1.2
 Tue, 22 Aug 2017 10:09:55 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.1.1
 Mon, 21 Aug 2017 10:19:29 GMT
@@ -247,7 +254,7 @@ Fri, 18 Aug 2017 16:32:33 GMT
 ## 0.0.2
 Wed, 16 Aug 2017 10:11:43 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 0.0.1
 Tue, 15 Aug 2017 10:19:22 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index e7cb3eae5b05c..206aef4f977c6 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.5.1",
+  "version": "5.5.2",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.21.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.22.0 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 0690c899281d0..1ed4dcd126cf5 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -23,7 +23,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.6.1 <6.0.0",
+    "@uifabric/styling": ">=5.8.0 <6.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index ddc6cdd6f8b69..4c0651e3e9583 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,42 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.22.0",
+      "tag": "office-ui-fabric-react_v5.22.0",
+      "date": "Thu, 16 Nov 2017 11:20:34 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "d973229862379082ddf4415d6286864150bf25ee",
+            "comment": "Checkbox: Add getClassNames prop to allow complete customization of the component"
+          },
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "ba70b786c4fbafd21693d6ce5e24e0a9cb085b0d",
+            "comment": "SplitButton: Avoid applying selector rest changes when in toggle state"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "8550f69d236e9ed3e52c64207d4a9d847f14b057",
+            "comment": "Toggle: Add label as fall back ariaLabel."
+          }
+        ],
+        "minor": [
+          {
+            "author": "Yimin Wu <yimwu@microsoft.com>",
+            "commit": "27b3e985fe437ad6b1dfcda1924eb6f13191f509",
+            "comment": "Dropdown: Update dropdown interface to allow open dropdown after focus and remove extra focus border for dropdown option."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.7.0 <6.0.0` to `>=5.8.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.21.2",
       "tag": "office-ui-fabric-react_v5.21.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 0659cae4e8781..37ffd3db72280 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 15 Nov 2017 11:11:59 GMT and should not be manually modified.
+This log was last generated on Thu, 16 Nov 2017 11:20:34 GMT and should not be manually modified.
+
+## 5.22.0
+Thu, 16 Nov 2017 11:20:34 GMT
+
+### Minor changes
+
+- Dropdown: Update dropdown interface to allow open dropdown after focus and remove extra focus border for dropdown option.
+
+### Patches
+
+- Checkbox: Add getClassNames prop to allow complete customization of the component
+- SplitButton: Avoid applying selector rest changes when in toggle state
+- Toggle: Add label as fall back ariaLabel.
 
 ## 5.21.2
 Wed, 15 Nov 2017 11:11:59 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 5637f732536c8..022de423bd308 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.21.2",
+  "version": "5.22.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,7 +47,7 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.6.0 <6.0.0",
-    "@uifabric/styling": ">=5.7.0 <6.0.0",
+    "@uifabric/styling": ">=5.8.0 <6.0.0",
     "@uifabric/utilities": ">=5.4.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 9f73bbf153ec8..d4edd80efec42 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.8.0",
+      "tag": "@uifabric/styling_v5.8.0",
+      "date": "Thu, 16 Nov 2017 11:20:34 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "f143a0d268256361a334e8ed33231e507d902e85",
+            "comment": "Adding `styled` and `classNameFunction` helpers, in addition to a variety of interface."
+          }
+        ]
+      }
+    },
     {
       "version": "5.7.0",
       "tag": "@uifabric/styling_v5.7.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 32f6ccfc36d74..f1d3aca6d28b7 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 10 Nov 2017 17:09:36 GMT and should not be manually modified.
+This log was last generated on Thu, 16 Nov 2017 11:20:34 GMT and should not be manually modified.
+
+## 5.8.0
+Thu, 16 Nov 2017 11:20:34 GMT
+
+### Minor changes
+
+- Adding `styled` and `classNameFunction` helpers, in addition to a variety of interface.
 
 ## 5.7.0
 Fri, 10 Nov 2017 17:09:36 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 95286cb0ffafc..d8cb7ac1f2147 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.7.0",
+  "version": "5.8.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 113c8cab8195d8325e6806aa02999075202f2955 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pablo=20N=C3=BA=C3=B1ez?= <pablonete@gmail.com>
Date: Thu, 16 Nov 2017 16:02:00 +0100
Subject: [PATCH 1026/1641] DetailsList: Don't set focus to row on mouse click
 (#3375)

* Don't set focus with mouse.

It's already default behavior, and it prevented row links to work like described in #3283
After this change, clicked rows won't be scrolled full into view like it happens with keyboard navigation, but this is fine for mouse clicks.

* Change details.

* Fixed test to match new behavior.
---
 ...mouseDownNoFocusSoAnchorWins_2017-11-13-11-41.json | 11 +++++++++++
 .../src/components/FocusZone/FocusZone.test.tsx       |  3 ++-
 .../src/components/FocusZone/FocusZone.tsx            |  4 +++-
 3 files changed, 16 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/detailsList-mouseDownNoFocusSoAnchorWins_2017-11-13-11-41.json

diff --git a/common/changes/office-ui-fabric-react/detailsList-mouseDownNoFocusSoAnchorWins_2017-11-13-11-41.json b/common/changes/office-ui-fabric-react/detailsList-mouseDownNoFocusSoAnchorWins_2017-11-13-11-41.json
new file mode 100644
index 0000000000000..4e574c8eff8b4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/detailsList-mouseDownNoFocusSoAnchorWins_2017-11-13-11-41.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: mouse click gives preference to inner links.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-panu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
index cc2b4a32f9251..5786817efb152 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
@@ -701,8 +701,9 @@ describe('FocusZone', () => {
     expect(buttonB.tabIndex).toBe(0);
 
     // Clicking on A should enable its tab-index and disable others.
+    // But it doesn't set focus (browser will do it in the default event handler)
     ReactTestUtils.Simulate.mouseDown(buttonAElement);
-    expect(lastFocusedElement).toBe(buttonA);
+    expect(lastFocusedElement).toBe(buttonB);
 
     expect(buttonA.tabIndex).toBe(0);
     expect(buttonB.tabIndex).toBe(-1);
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 42fef6c7539bb..e4bcc4632346a 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -179,6 +179,9 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
     if (element) {
       this._setActiveElement(element);
+      if (this._activeElement) {
+        this._activeElement.focus();
+      }
 
       return true;
     }
@@ -267,7 +270,6 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       }
 
       this._activeElement.tabIndex = 0;
-      this._activeElement.focus();
     }
   }
 

From 17ca90bc46e13b47defa076a10f9c856b0165bc7 Mon Sep 17 00:00:00 2001
From: Scott Balentine <sbalentine88@gmail.com>
Date: Thu, 16 Nov 2017 11:14:14 -0800
Subject: [PATCH 1027/1641] rename addonString to prefix and add suffix to
 TextField (#3348)

---
 .../src/stories/TextField.stories.tsx         | 13 ++++--
 .../append_on_input_2017-11-09-05-23.json     | 11 +++++
 .../src/components/TextField/TextField.scss   |  2 +-
 .../components/TextField/TextField.test.tsx   | 46 +++++++++++++++++++
 .../src/components/TextField/TextField.tsx    | 41 +++++++++++++++--
 .../components/TextField/TextField.types.ts   | 28 +++++++++--
 .../components/TextField/TextFieldPage.tsx    | 44 ++++++++++++------
 ...ample.tsx => TextField.Prefix.Example.tsx} |  6 +--
 .../TextField.PrefixAndSuffix.Example.tsx     | 16 +++++++
 .../examples/TextField.Suffix.Example.tsx     | 15 ++++++
 10 files changed, 192 insertions(+), 30 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/append_on_input_2017-11-09-05-23.json
 rename packages/office-ui-fabric-react/src/components/TextField/examples/{TextField.Addon.Example.tsx => TextField.Prefix.Example.tsx} (71%)
 create mode 100644 packages/office-ui-fabric-react/src/components/TextField/examples/TextField.PrefixAndSuffix.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Suffix.Example.tsx

diff --git a/apps/vr-tests/src/stories/TextField.stories.tsx b/apps/vr-tests/src/stories/TextField.stories.tsx
index 567da56d6ce68..e01cad05a5615 100644
--- a/apps/vr-tests/src/stories/TextField.stories.tsx
+++ b/apps/vr-tests/src/stories/TextField.stories.tsx
@@ -74,9 +74,14 @@ storiesOf('TextField', module)
       label='Icon'
       iconProps={ { iconName: 'Calendar' } }
     />
-  )).add('Addon', () => (
+  )).add('Prefix', () => (
     <TextField
-      label='Addon'
-      addonString='https://'
+      label='Prefix'
+      prefix='https://'
     />
-  ));
\ No newline at end of file
+  )).add('Suffix', () => (
+    <TextField
+      label='Suffix'
+      suffix='.com'
+    />
+  ));
diff --git a/common/changes/office-ui-fabric-react/append_on_input_2017-11-09-05-23.json b/common/changes/office-ui-fabric-react/append_on_input_2017-11-09-05-23.json
new file mode 100644
index 0000000000000..1f4a5c588fa22
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/append_on_input_2017-11-09-05-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "add suffix to TextField",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "scott.balentine@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index 8b2142c8c4133..e781d5b95cf6c 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -85,7 +85,7 @@ $field-error-color: $errorTextColor;
   }
 }
 
-.fieldAddon {
+.fieldPrefixSuffix {
   background: $ms-color-neutralLighter;
   color: $ms-color-neutralSecondary;
   display: flex;
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
index c43d730a83c59..cca8acb446834 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
@@ -50,6 +50,52 @@ describe('TextField', () => {
     expect(labelDOM.textContent).toEqual(exampleLabel);
   });
 
+  it('should render prefix in input element', () => {
+    const examplePrefix: string = 'this is a prefix';
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <TextField
+        prefix={ examplePrefix }
+      />
+    );
+
+    // Assert on the prefix
+    const prefixDOM: Element = renderedDOM.getElementsByClassName('ms-TextField-prefix')[0];
+    expect(prefixDOM.textContent).toEqual(examplePrefix);
+  });
+
+  it('should render suffix in input element', () => {
+    const exampleSuffix: string = 'this is a suffix';
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <TextField
+        suffix={ exampleSuffix }
+      />
+    );
+
+    // Assert on the suffix
+    const suffixDOM: Element = renderedDOM.getElementsByClassName('ms-TextField-suffix')[0];
+    expect(suffixDOM.textContent).toEqual(exampleSuffix);
+  });
+
+  it('should render both prefix and suffix in input element', () => {
+    const examplePrefix: string = 'this is a prefix';
+    const exampleSuffix: string = 'this is a suffix';
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <TextField
+        prefix={ examplePrefix}
+        suffix={ exampleSuffix }
+      />
+    );
+
+    // Assert on the prefix and suffix
+    const prefixDOM: Element = renderedDOM.getElementsByClassName('ms-TextField-prefix')[0];
+    const suffixDOM: Element = renderedDOM.getElementsByClassName('ms-TextField-suffix')[0];
+    expect(prefixDOM.textContent).toEqual(examplePrefix);
+    expect(suffixDOM.textContent).toEqual(exampleSuffix);
+  });
+
   it('should render multiline as text area element', () => {
     const renderedDOM: HTMLElement = renderIntoDocument(
       <TextField value='This\nIs\nMultiline\nText\n' multiline />
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index 52f9718faeab9..bb711fbd70f7e 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -61,7 +61,9 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
     super(props);
 
     this._warnDeprecations({
-      'iconClass': 'iconProps'
+      'iconClass': 'iconProps',
+      'addonString': 'prefix',
+      'onRenderAddon': 'onRenderPrefix'
     });
 
     this._warnMutuallyExclusive({
@@ -135,8 +137,12 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
       required,
       underlined,
       borderless,
-      addonString,
-      onRenderAddon = this._onRenderAddon,
+      addonString, // @deprecated
+      prefix,
+      suffix,
+      onRenderAddon = this._onRenderAddon, // @deprecated
+      onRenderPrefix = this._onRenderPrefix,
+      onRenderSuffix = this._onRenderSuffix,
       onRenderLabel = this._onRenderLabel
     } = this.props;
     let { isFocused } = this.state;
@@ -160,12 +166,22 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
           { onRenderLabel(renderProps, this._onRenderLabel) }
           <div className={ css('ms-TextField-fieldGroup', styles.fieldGroup, isFocused && styles.fieldGroupIsFocused, errorMessage && styles.invalid) }>
             { (addonString !== undefined || this.props.onRenderAddon) && (
-              <div className={ css(styles.fieldAddon) }>
+              <div className={ css('ms-TextField-prefix', styles.fieldPrefixSuffix) }>
                 { onRenderAddon(this.props, this._onRenderAddon) }
               </div>
             ) }
+            { (prefix !== undefined || this.props.onRenderPrefix) && (
+              <div className={ css('ms-TextField-prefix', styles.fieldPrefixSuffix) }>
+                { onRenderPrefix(this.props, this._onRenderPrefix) }
+              </div>
+            ) }
             { multiline ? this._renderTextArea() : this._renderInput() }
             { (iconClass || iconProps) && <Icon className={ css(iconClass, styles.icon) } { ...iconProps } /> }
+            { (suffix !== undefined || this.props.onRenderSuffix) && (
+              <div className={ css('ms-TextField-suffix', styles.fieldPrefixSuffix) }>
+                { onRenderSuffix(this.props, this._onRenderSuffix) }
+              </div>
+            ) }
           </div>
         </div>
         { this._isDescriptionAvailable &&
@@ -282,6 +298,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
     return null;
   }
 
+  // @deprecated
   private _onRenderAddon(props: ITextFieldProps): JSX.Element {
     let { addonString } = props;
     return (
@@ -289,6 +306,20 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
     );
   }
 
+  private _onRenderPrefix(props: ITextFieldProps): JSX.Element {
+    let { prefix } = props;
+    return (
+      <span style={ { paddingBottom: '1px' } }>{ prefix }</span>
+    );
+  }
+
+  private _onRenderSuffix(props: ITextFieldProps): JSX.Element {
+    let { suffix } = props;
+    return (
+      <span style={ { paddingBottom: '1px' } }>{ suffix }</span>
+    );
+  }
+
   private _getTextElementClassName(): string {
     let textFieldClassName: string;
 
@@ -433,4 +464,4 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
       textField.style.height = scrollHeight + 'px';
     }
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts b/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts
index 3e1d46b5d57be..f53d55fffa298 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts
@@ -88,15 +88,37 @@ export interface ITextFieldProps extends React.AllHTMLAttributes<HTMLInputElemen
   description?: string;
 
   /**
-  * String for addon.
-  */
+   * @deprecated
+   * Deprecated; use prefix instead.
+   */
   addonString?: string;
 
   /**
-  * Custom render function for addon
+  * String for prefix
+  */
+  prefix?: string;
+
+  /**
+  * String for suffix
   */
+  suffix?: string;
+
+  /**
+   * @deprecated
+   * Deprecated; use onRenderPrefix instead.
+   */
   onRenderAddon?: IRenderFunction<ITextFieldProps>;
 
+  /**
+  * Custom render function for prefix
+  */
+  onRenderPrefix?: IRenderFunction<ITextFieldProps>;
+
+  /**
+  * Custom render function for suffix
+  */
+  onRenderSuffix?: IRenderFunction<ITextFieldProps>;
+
   /**
    * Optional icon props for an icon.
    */
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
index 3c9bff0d18e54..3543f8cee37f7 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
@@ -5,27 +5,31 @@ import {
   IComponentDemoPageProps,
   PropertiesTableSet
 } from '@uifabric/example-app-base';
-import { TextFieldAddonExample } from './examples/TextField.Addon.Example';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { TextFieldBasicExample } from './examples/TextField.Basic.Example';
-import { TextFieldCustomRenderExample } from './examples/TextField.CustomRender.Example';
-import { TextFieldPlaceholderExample } from './examples/TextField.Placeholder.Example';
-import { TextFieldMultilineExample } from './examples/TextField.Multiline.Example';
-import { TextFieldUnderlinedExample } from './examples/TextField.Underlined.Example';
 import { TextFieldBorderlessExample } from './examples/TextField.Borderless.Example';
+import { TextFieldCustomRenderExample } from './examples/TextField.CustomRender.Example';
 import { TextFieldErrorMessageExample } from './examples/TextField.ErrorMessage.Example';
 import { TextFieldIconExample } from './examples/TextField.Icon.Example';
-import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { TextFieldMultilineExample } from './examples/TextField.Multiline.Example';
+import { TextFieldPlaceholderExample } from './examples/TextField.Placeholder.Example';
+import { TextFieldPrefixExample } from './examples/TextField.Prefix.Example';
+import { TextFieldPrefixAndSuffixExample } from './examples/TextField.PrefixAndSuffix.Example';
 import { TextFieldStatus } from './TextField.checklist';
+import { TextFieldSuffixExample } from './examples/TextField.Suffix.Example';
+import { TextFieldUnderlinedExample } from './examples/TextField.Underlined.Example';
 
-const TextFieldAddonExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Addon.Example.tsx') as string;
 const TextFieldBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx') as string;
-const TextFieldCustomRenderExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx') as string;
-const TextFieldPlaceholderExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Placeholder.Example.tsx') as string;
-const TextFieldMultilineExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Multiline.Example.tsx') as string;
-const TextFieldUnderlinedExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Underlined.Example.tsx') as string;
 const TextFieldBorderlessExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Borderless.Example.tsx') as string;
+const TextFieldCustomRenderExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx') as string;
 const TextFieldErrorMessageExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx') as string;
 const TextFieldIconExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Icon.Example.tsx') as string;
+const TextFieldMultilineExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Multiline.Example.tsx') as string;
+const TextFieldPlaceholderExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Placeholder.Example.tsx') as string;
+const TextFieldPrefixExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Prefix.Example.tsx') as string;
+const TextFieldPrefixAndSuffixExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.PrefixAndSuffix.Example.tsx') as string;
+const TextFieldSuffixExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Suffix.Example.tsx') as string;
+const TextFieldUnderlinedExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Underlined.Example.tsx') as string;
 
 export class TextFieldPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
@@ -70,10 +74,22 @@ export class TextFieldPage extends React.Component<IComponentDemoPageProps, {}>
         implementationExampleCards={
           <div>
             <ExampleCard
-              title='Textfield with an addon'
-              code={ TextFieldAddonExampleCode }
+              title='Textfield with a prefix'
+              code={ TextFieldPrefixExampleCode }
+            >
+              <TextFieldPrefixExample />
+            </ExampleCard>
+            <ExampleCard
+              title='Textfield with a suffix'
+              code={ TextFieldSuffixExampleCode }
+            >
+              <TextFieldSuffixExample />
+            </ExampleCard>
+            <ExampleCard
+              title='Textfield with a prefix and a suffix'
+              code={ TextFieldPrefixAndSuffixExampleCode }
             >
-              <TextFieldAddonExample />
+              <TextFieldPrefixAndSuffixExample />
             </ExampleCard>
             <ExampleCard
               title='TextField with an icon'
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Addon.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Prefix.Example.tsx
similarity index 71%
rename from packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Addon.Example.tsx
rename to packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Prefix.Example.tsx
index 3f7bc4cfc0b96..eb2ce1a293cb2 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Addon.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Prefix.Example.tsx
@@ -2,14 +2,14 @@ import * as React from 'react';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
 import './TextField.Examples.scss';
 
-export class TextFieldAddonExample extends React.Component<any, any> {
+export class TextFieldPrefixExample extends React.Component<any, any> {
   public render() {
     return (
       <div className='docs-TextFieldExample'>
         <TextField
-          addonString='https://'
+          prefix='https://'
         />
       </div>
     );
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.PrefixAndSuffix.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.PrefixAndSuffix.Example.tsx
new file mode 100644
index 0000000000000..a711d9063e3d1
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.PrefixAndSuffix.Example.tsx
@@ -0,0 +1,16 @@
+import * as React from 'react';
+import { TextField } from 'office-ui-fabric-react/lib/TextField';
+import './TextField.Examples.scss';
+
+export class TextFieldPrefixAndSuffixExample extends React.Component<any, any> {
+  public render() {
+    return (
+      <div className='ms-TextFieldExample'>
+        <TextField
+          prefix='https://'
+          suffix='.com'
+        />
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Suffix.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Suffix.Example.tsx
new file mode 100644
index 0000000000000..da1397541bc36
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Suffix.Example.tsx
@@ -0,0 +1,15 @@
+import * as React from 'react';
+import { TextField } from 'office-ui-fabric-react/lib/TextField';
+import './TextField.Examples.scss';
+
+export class TextFieldSuffixExample extends React.Component<any, any> {
+  public render() {
+    return (
+      <div className='ms-TextFieldExample'>
+        <TextField
+          suffix='.com'
+        />
+      </div>
+    );
+  }
+}

From 97afd9793fddd3c5216d44cb3a54e36984c405d7 Mon Sep 17 00:00:00 2001
From: Bryan Watts <brwatt@microsoft.com>
Date: Thu, 16 Nov 2017 12:57:11 -0800
Subject: [PATCH 1028/1641] Brwatt/external signal (#3409)

* Add external signal

* Add change file
---
 ...watt-external-signal_2017-11-16-19-53.json | 11 ++++++++++
 .../src/components/signals/Signals.scss       |  4 ++++
 .../src/components/signals/Signals.tsx        | 20 +++++++++++++++++++
 3 files changed, 35 insertions(+)
 create mode 100644 common/changes/@uifabric/experiments/brwatt-external-signal_2017-11-16-19-53.json

diff --git a/common/changes/@uifabric/experiments/brwatt-external-signal_2017-11-16-19-53.json b/common/changes/@uifabric/experiments/brwatt-external-signal_2017-11-16-19-53.json
new file mode 100644
index 0000000000000..e32ac2463a2ef
--- /dev/null
+++ b/common/changes/@uifabric/experiments/brwatt-external-signal_2017-11-16-19-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Add external signal",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "brwatt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/signals/Signals.scss b/packages/experiments/src/components/signals/Signals.scss
index 6bff76a8a77b3..c7f9d7304f136 100644
--- a/packages/experiments/src/components/signals/Signals.scss
+++ b/packages/experiments/src/components/signals/Signals.scss
@@ -99,6 +99,10 @@
   top: 3px;
 }
 
+.external {
+  color: $ms-color-neutralSecondary;
+}
+
 .signal {
   transition: color 0.2s linear;
 
diff --git a/packages/experiments/src/components/signals/Signals.tsx b/packages/experiments/src/components/signals/Signals.tsx
index cb4c4e5d7aa7e..3f3747f20c266 100644
--- a/packages/experiments/src/components/signals/Signals.tsx
+++ b/packages/experiments/src/components/signals/Signals.tsx
@@ -254,4 +254,24 @@ export const ATPSignal: Signal = (props: ISignalProps): JSX.Element => {
       iconName='ATPLogo'
     />
   );
+};
+
+/**
+ * Renders a signal for an external item.
+ */
+export const ExternalSignal: Signal = (props: ISignalProps): JSX.Element => {
+  const {
+    ariaLabel,
+    ...spanProps
+  } = props;
+
+  return (
+    <span
+      aria-label={ ariaLabel }
+      { ...spanProps }
+      className={ css(SignalStyles.signal, SignalStyles.external) }
+    >
+      { props.children }
+    </span>
+  );
 };
\ No newline at end of file

From 54dab7cabfc39ffe6e6ab68181e561467fa009fe Mon Sep 17 00:00:00 2001
From: Michael Loughry <miclo@microsoft.com>
Date: Thu, 16 Nov 2017 13:36:57 -0800
Subject: [PATCH 1029/1641] Export functions to create localized font set
 (#3393)

* Export functions used to create localized font stacks

* Add change file
---
 ...fault-font-functions_2017-11-15-00-15.json |  11 ++
 .../styling/src/styles/DefaultFontStyles.ts   | 161 ++----------------
 packages/styling/src/styles/fonts.ts          | 142 +++++++++++++++
 packages/styling/src/styles/index.ts          |   3 +-
 4 files changed, 170 insertions(+), 147 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/export-default-font-functions_2017-11-15-00-15.json
 create mode 100644 packages/styling/src/styles/fonts.ts

diff --git a/common/changes/@uifabric/styling/export-default-font-functions_2017-11-15-00-15.json b/common/changes/@uifabric/styling/export-default-font-functions_2017-11-15-00-15.json
new file mode 100644
index 0000000000000..e7faf1efdef88
--- /dev/null
+++ b/common/changes/@uifabric/styling/export-default-font-functions_2017-11-15-00-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Export functions used to create font sets based upon a given locale code",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/styling/src/styles/DefaultFontStyles.ts b/packages/styling/src/styles/DefaultFontStyles.ts
index cfe07e681fd69..6e086a503ac93 100644
--- a/packages/styling/src/styles/DefaultFontStyles.ts
+++ b/packages/styling/src/styles/DefaultFontStyles.ts
@@ -1,148 +1,19 @@
 import {
   fontFace,
-  IRawStyle,
   IFontWeight
 } from '@uifabric/merge-styles/lib/index';
 import {
   IFontStyles
 } from '../interfaces/index';
-
+import { createFontStyles, FontWeights, LocalizedFontFamilies, LocalizedFontNames } from './fonts';
 import { getLanguage } from '@uifabric/utilities/lib/language';
 import { IFabricConfig } from '../interfaces/IFabricConfig';
 
 // Default urls.
 const DefaultBaseUrl = 'https://static2.sharepointonline.com/files/fabric/assets';
 
-// Fallback fonts, if specified system or web fonts are unavailable.
-const FontFamilyFallbacks = `'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif`;
-
-// Font face names to be registered.
-const FontNameArabic = 'Segoe UI Web (Arabic)';
-const FontNameCyrillic = 'Segoe UI Web (Cyrillic)';
-const FontNameEastEuropean = 'Segoe UI Web (East European)';
-const FontNameGreek = 'Segoe UI Web (Greek)';
-const FontNameHebrew = 'Segoe UI Web (Hebrew)';
-const FontNameThai = 'Leelawadee UI Web';
-const FontNameVietnamese = 'Segoe UI Web (Vietnamese)';
-const FontNameWestEuropean = 'Segoe UI Web (West European)';
-const FontNameSelawik = 'Selawik Web';
-
-// Font families with fallbacks, for the general regions.
-const FontFamilyArabic = `'${FontNameArabic}'`;
-const FontFamilyChineseSimplified = `'Microsoft Yahei', Verdana, Simsun`;
-const FontFamilyChineseTraditional = `'Microsoft Jhenghei', Pmingliu`;
-const FontFamilyCyrillic = `'${FontNameCyrillic}'`;
-const FontFamilyEastEuropean = `'${FontNameEastEuropean}'`;
-const FontFamilyGreek = `'${FontNameGreek}'`;
-const FontFamilyHebrew = `'${FontNameHebrew}'`;
-const FontFamilyHindi = `'Nirmala UI'`;
-const FontFamilyJapanese = `'Yu Gothic', 'Meiryo UI', Meiryo, 'MS Pgothic', Osaka`;
-const FontFamilyKorean = `'Malgun Gothic', Gulim`;
-const FontFamilySelawik = `'${FontNameSelawik}'`;
-const FontFamilyThai = `'Leelawadee UI Web', 'Kmer UI'`;
-const FontFamilyVietnamese = `'${FontNameVietnamese}'`;
-const FontFamilyWestEuropean = `'${FontNameWestEuropean}'`;
-
-// Mapping of language prefix to to font family.
-const LanguageToFontMap = {
-  'ar': FontFamilyArabic,
-  'bg': FontFamilyCyrillic,
-  'cs': FontFamilyEastEuropean,
-  'el': FontFamilyGreek,
-  'et': FontFamilyEastEuropean,
-  'he': FontFamilyHebrew,
-  'hi': FontFamilyHindi,
-  'hr': FontFamilyEastEuropean,
-  'hu': FontFamilyEastEuropean,
-  'ja': FontFamilyJapanese,
-  'kk': FontFamilyEastEuropean,
-  'ko': FontFamilyKorean,
-  'lt': FontFamilyEastEuropean,
-  'lv': FontFamilyEastEuropean,
-  'pl': FontFamilyEastEuropean,
-  'ru': FontFamilyCyrillic,
-  'sk': FontFamilyEastEuropean,
-  'sr-latn': FontFamilyEastEuropean,
-  'th': FontFamilyThai,
-  'tr': FontFamilyEastEuropean,
-  'uk': FontFamilyCyrillic,
-  'vi': FontFamilyVietnamese,
-  'zh-hans': FontFamilyChineseSimplified,
-  'zh-hant': FontFamilyChineseTraditional,
-};
-
-// Standard font sizes.
-export namespace FontSizes {
-  export const mini = '10px';
-  export const xSmall = '11px';
-  export const small = '12px';
-  export const smallPlus = '13px';
-  export const medium = '14px';
-  export const mediumPlus = '15px';
-  export const icon = '16px';
-  export const large = '17px';
-  export const xLarge = '21px';
-  export const xxLarge = '28px';
-  export const superLarge = '42px';
-  export const mega = '72px';
-}
-
-// Standard font weights.
-export namespace FontWeights {
-  export const light = 100;
-  export const semilight = 300;
-  export const regular = 400;
-  export const semibold = 600;
-  export const bold = 700;
-}
-
-// Standard Icon Sizes.
-export namespace IconFontSizes {
-  export const xSmall = '10px';
-  export const small = '12px';
-  export const medium = '16px';
-  export const large = '20px';
-}
-
 // Standard font styling.
-export const DefaultFontStyles: IFontStyles = {
-  tiny: _createFont(FontSizes.mini, FontWeights.semibold),
-  xSmall: _createFont(FontSizes.xSmall, FontWeights.regular),
-  small: _createFont(FontSizes.small, FontWeights.regular),
-  smallPlus: _createFont(FontSizes.smallPlus, FontWeights.regular),
-  medium: _createFont(FontSizes.medium, FontWeights.regular),
-  mediumPlus: _createFont(FontSizes.mediumPlus, FontWeights.regular),
-  large: _createFont(FontSizes.large, FontWeights.semilight),
-  xLarge: _createFont(FontSizes.xLarge, FontWeights.light),
-  xxLarge: _createFont(FontSizes.xxLarge, FontWeights.light),
-  superLarge: _createFont(FontSizes.superLarge, FontWeights.light),
-  mega: _createFont(FontSizes.mega, FontWeights.light)
-};
-
-function _getFontFamily(): string {
-  let language = getLanguage();
-  let fontFamily = FontFamilyWestEuropean;
-
-  for (let lang in LanguageToFontMap) {
-    if (LanguageToFontMap.hasOwnProperty(lang) && language && lang.indexOf(language) === 0) {
-      // tslint:disable-next-line:no-any
-      fontFamily = (LanguageToFontMap as any)[lang];
-      break;
-    }
-  }
-
-  return `${fontFamily}, ${FontFamilyFallbacks}`;
-}
-
-function _createFont(size: string, weight: IFontWeight): IRawStyle {
-  return {
-    fontFamily: _getFontFamily(),
-    MozOsxFontSmoothing: 'grayscale',
-    WebkitFontSmoothing: 'antialiased',
-    fontSize: size,
-    fontWeight: weight
-  };
-}
+export const DefaultFontStyles: IFontStyles = createFontStyles(getLanguage());
 
 function _registerFontFace(
   fontFamily: string,
@@ -154,8 +25,8 @@ function _registerFontFace(
   fontFace({
     fontFamily,
     src:
-    `url('${url}.woff2') format('woff2'),` +
-    `url('${url}.woff') format('woff')`,
+      `url('${url}.woff2') format('woff2'),` +
+      `url('${url}.woff') format('woff')`,
     fontWeight,
     fontStyle: 'normal'
   });
@@ -175,22 +46,20 @@ function _registerFontFaceSet(
   _registerFontFace(fontFamily, urlBase + '-semibold', FontWeights.semibold);
 }
 
-function _registerDefaultFontFaces(): void {
-  const baseUrl = _getFontBaseUrl();
-
+export function registerDefaultFontFaces(baseUrl: string): void {
   if (baseUrl) {
     const fontUrl = `${baseUrl}/fonts`;
 
     // Produce @font-face definitions for all supported web fonts.
-    _registerFontFaceSet(fontUrl, FontNameThai, 'leelawadeeui-thai', 'leelawadeeui');
-    _registerFontFaceSet(fontUrl, FontNameArabic, 'segoeui-arabic');
-    _registerFontFaceSet(fontUrl, FontNameCyrillic, 'segoeui-cyrillic');
-    _registerFontFaceSet(fontUrl, FontNameEastEuropean, 'segoeui-easteuropean');
-    _registerFontFaceSet(fontUrl, FontNameGreek, 'segoeui-greek');
-    _registerFontFaceSet(fontUrl, FontNameHebrew, 'segoeui-hebrew');
-    _registerFontFaceSet(fontUrl, FontNameVietnamese, 'segoeui-vietnamese');
-    _registerFontFaceSet(fontUrl, FontNameWestEuropean, 'segoeui-westeuropean');
-    _registerFontFaceSet(fontUrl, FontFamilySelawik, 'selawik', 'selawik');
+    _registerFontFaceSet(fontUrl, LocalizedFontNames.Thai, 'leelawadeeui-thai', 'leelawadeeui');
+    _registerFontFaceSet(fontUrl, LocalizedFontNames.Arabic, 'segoeui-arabic');
+    _registerFontFaceSet(fontUrl, LocalizedFontNames.Cyrillic, 'segoeui-cyrillic');
+    _registerFontFaceSet(fontUrl, LocalizedFontNames.EastEuropean, 'segoeui-easteuropean');
+    _registerFontFaceSet(fontUrl, LocalizedFontNames.Greek, 'segoeui-greek');
+    _registerFontFaceSet(fontUrl, LocalizedFontNames.Hebrew, 'segoeui-hebrew');
+    _registerFontFaceSet(fontUrl, LocalizedFontNames.Vietnamese, 'segoeui-vietnamese');
+    _registerFontFaceSet(fontUrl, LocalizedFontNames.WestEuropean, 'segoeui-westeuropean');
+    _registerFontFaceSet(fontUrl, LocalizedFontFamilies.Selawik, 'selawik', 'selawik');
 
     // Leelawadee UI (Thai) does not have a 'light' weight, so we override
     // the font-face generated above to use the 'semilight' weight instead.
@@ -217,4 +86,4 @@ function _getFontBaseUrl(): string {
 /**
  * Register the font faces.
  */
-_registerDefaultFontFaces();
+registerDefaultFontFaces(_getFontBaseUrl());
diff --git a/packages/styling/src/styles/fonts.ts b/packages/styling/src/styles/fonts.ts
new file mode 100644
index 0000000000000..fe53290221c7b
--- /dev/null
+++ b/packages/styling/src/styles/fonts.ts
@@ -0,0 +1,142 @@
+import {
+  IRawStyle,
+  IFontWeight
+} from '@uifabric/merge-styles/lib/index';
+import {
+  IFontStyles
+} from '../interfaces/index';
+
+// Fallback fonts, if specified system or web fonts are unavailable.
+const FontFamilyFallbacks = `'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif`;
+
+// Font face names to be registered.
+export namespace LocalizedFontNames {
+  export const Arabic = 'Segoe UI Web (Arabic)';
+  export const Cyrillic = 'Segoe UI Web (Cyrillic)';
+  export const EastEuropean = 'Segoe UI Web (East European)';
+  export const Greek = 'Segoe UI Web (Greek)';
+  export const Hebrew = 'Segoe UI Web (Hebrew)';
+  export const Thai = 'Leelawadee UI Web';
+  export const Vietnamese = 'Segoe UI Web (Vietnamese)';
+  export const WestEuropean = 'Segoe UI Web (West European)';
+  export const Selawik = 'Selawik Web';
+}
+
+// Font families with fallbacks, for the general regions.
+export namespace LocalizedFontFamilies {
+  export const Arabic = `'${LocalizedFontNames.Arabic}'`;
+  export const ChineseSimplified = `'Microsoft Yahei', Verdana, Simsun`;
+  export const ChineseTraditional = `'Microsoft Jhenghei', Pmingliu`;
+  export const Cyrillic = `'${LocalizedFontNames.Cyrillic}'`;
+  export const EastEuropean = `'${LocalizedFontNames.EastEuropean}'`;
+  export const Greek = `'${LocalizedFontNames.Greek}'`;
+  export const Hebrew = `'${LocalizedFontNames.Hebrew}'`;
+  export const Hindi = `'Nirmala UI'`;
+  export const Japanese = `'Yu Gothic', 'Meiryo UI', Meiryo, 'MS Pgothic', Osaka`;
+  export const Korean = `'Malgun Gothic', Gulim`;
+  export const Selawik = `'${LocalizedFontNames.Selawik}'`;
+  export const Thai = `'Leelawadee UI Web', 'Kmer UI'`;
+  export const Vietnamese = `'${LocalizedFontNames.Vietnamese}'`;
+  export const WestEuropean = `'${LocalizedFontNames.WestEuropean}'`;
+}
+
+// Mapping of language prefix to to font family.
+const LanguageToFontMap = {
+  'ar': LocalizedFontFamilies.Arabic,
+  'bg': LocalizedFontFamilies.Cyrillic,
+  'cs': LocalizedFontFamilies.EastEuropean,
+  'el': LocalizedFontFamilies.Greek,
+  'et': LocalizedFontFamilies.EastEuropean,
+  'he': LocalizedFontFamilies.Hebrew,
+  'hi': LocalizedFontFamilies.Hindi,
+  'hr': LocalizedFontFamilies.EastEuropean,
+  'hu': LocalizedFontFamilies.EastEuropean,
+  'ja': LocalizedFontFamilies.Japanese,
+  'kk': LocalizedFontFamilies.EastEuropean,
+  'ko': LocalizedFontFamilies.Korean,
+  'lt': LocalizedFontFamilies.EastEuropean,
+  'lv': LocalizedFontFamilies.EastEuropean,
+  'pl': LocalizedFontFamilies.EastEuropean,
+  'ru': LocalizedFontFamilies.Cyrillic,
+  'sk': LocalizedFontFamilies.EastEuropean,
+  'sr-latn': LocalizedFontFamilies.EastEuropean,
+  'th': LocalizedFontFamilies.Thai,
+  'tr': LocalizedFontFamilies.EastEuropean,
+  'uk': LocalizedFontFamilies.Cyrillic,
+  'vi': LocalizedFontFamilies.Vietnamese,
+  'zh-hans': LocalizedFontFamilies.ChineseSimplified,
+  'zh-hant': LocalizedFontFamilies.ChineseTraditional,
+};
+
+// Standard font sizes.
+export namespace FontSizes {
+  export const mini = '10px';
+  export const xSmall = '11px';
+  export const small = '12px';
+  export const smallPlus = '13px';
+  export const medium = '14px';
+  export const mediumPlus = '15px';
+  export const icon = '16px';
+  export const large = '17px';
+  export const xLarge = '21px';
+  export const xxLarge = '28px';
+  export const superLarge = '42px';
+  export const mega = '72px';
+}
+
+// Standard font weights.
+export namespace FontWeights {
+  export const light = 100;
+  export const semilight = 300;
+  export const regular = 400;
+  export const semibold = 600;
+  export const bold = 700;
+}
+
+// Standard Icon Sizes.
+export namespace IconFontSizes {
+  export const xSmall = '10px';
+  export const small = '12px';
+  export const medium = '16px';
+  export const large = '20px';
+}
+
+export function createFontStyles(localeCode: string | null): IFontStyles {
+  return {
+    tiny: _createFont(FontSizes.mini, FontWeights.semibold, localeCode),
+    xSmall: _createFont(FontSizes.xSmall, FontWeights.regular, localeCode),
+    small: _createFont(FontSizes.small, FontWeights.regular, localeCode),
+    smallPlus: _createFont(FontSizes.smallPlus, FontWeights.regular, localeCode),
+    medium: _createFont(FontSizes.medium, FontWeights.regular, localeCode),
+    mediumPlus: _createFont(FontSizes.mediumPlus, FontWeights.regular, localeCode),
+    large: _createFont(FontSizes.large, FontWeights.semilight, localeCode),
+    xLarge: _createFont(FontSizes.xLarge, FontWeights.light, localeCode),
+    xxLarge: _createFont(FontSizes.xxLarge, FontWeights.light, localeCode),
+    superLarge: _createFont(FontSizes.superLarge, FontWeights.light, localeCode),
+    mega: _createFont(FontSizes.mega, FontWeights.light, localeCode)
+  };
+}
+
+function _getFontFamily(language: string | null): string {
+  let fontFamily = LocalizedFontFamilies.WestEuropean;
+
+  for (let lang in LanguageToFontMap) {
+    if (LanguageToFontMap.hasOwnProperty(lang) && language && lang.indexOf(language) === 0) {
+      // tslint:disable-next-line:no-any
+      fontFamily = (LanguageToFontMap as any)[lang];
+      break;
+    }
+  }
+
+  return `${fontFamily}, ${FontFamilyFallbacks}`;
+}
+
+function _createFont(size: string, weight: IFontWeight, localeCode: string | null): IRawStyle {
+  return {
+    fontFamily: _getFontFamily(localeCode),
+    MozOsxFontSmoothing: 'grayscale',
+    WebkitFontSmoothing: 'antialiased',
+    fontSize: size,
+    fontWeight: weight
+  };
+}
\ No newline at end of file
diff --git a/packages/styling/src/styles/index.ts b/packages/styling/src/styles/index.ts
index 1c6273ddbfe89..ea4525b2c9c2f 100644
--- a/packages/styling/src/styles/index.ts
+++ b/packages/styling/src/styles/index.ts
@@ -1,6 +1,7 @@
 export { AnimationStyles } from './AnimationStyles';
 export { DefaultPalette } from './DefaultPalette';
-export { DefaultFontStyles, FontSizes, FontWeights, IconFontSizes } from './DefaultFontStyles';
+export { DefaultFontStyles, registerDefaultFontFaces } from './DefaultFontStyles';
+export { FontSizes, FontWeights, IconFontSizes, createFontStyles } from './fonts';
 export { getFocusStyle } from './getFocusStyle';
 export { hiddenContentStyle } from './hiddenContentStyle';
 export {

From 71c7b7614e4cc0d6ec4289322af6dec04495536f Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 16 Nov 2017 14:13:36 -0800
Subject: [PATCH 1030/1641] Update package.json

---
 scripts/package.json | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/scripts/package.json b/scripts/package.json
index a5de785b5ed92..0a51ca881eece 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -48,7 +48,7 @@
   "bundlesize": [
     {
       "path": "../apps/test-bundle-button/dist/main.min.js",
-      "maxSize": "41 kB"
+      "maxSize": "42 kB"
     }
   ]
-}
\ No newline at end of file
+}

From 0081be7384220ff7ee655c7b490f9128efdcd146 Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Thu, 16 Nov 2017 15:44:57 -0800
Subject: [PATCH 1031/1641] DetailsHeader: Fix aria-haspopup (#3414)

* put the aria popup on the correct element

* adding change file
---
 .../fix-header-ariapopup_2017-11-16-22-54.json        | 11 +++++++++++
 .../src/components/DetailsList/DetailsHeader.tsx      |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-header-ariapopup_2017-11-16-22-54.json

diff --git a/common/changes/office-ui-fabric-react/fix-header-ariapopup_2017-11-16-22-54.json b/common/changes/office-ui-fabric-react/fix-header-ariapopup_2017-11-16-22-54.json
new file mode 100644
index 0000000000000..994f3163d07bf
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-header-ariapopup_2017-11-16-22-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsHeader: Accessibility fix, move aria-haspopup to correct element",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index 9f03050af0327..8b0c1caf44c5f 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -239,7 +239,6 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
                     column.isPadded && styles.cellWrapperPadded
                   ) }
                   style={ { width: column.calculatedWidth! + INNER_PADDING + (column.isPadded ? ISPADDED_WIDTH : 0) } }
-                  aria-haspopup={ column.columnActionsMode === ColumnActionsMode.hasDropdown }
                   data-automationid='ColumnsHeaderColumn'
                   data-item-key={ column.key }
                 >
@@ -260,6 +259,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
                           aria-describedby={ `${this._id}-${column.key}-tooltip` }
                           onContextMenu={ this._onColumnContextMenu.bind(this, column) }
                           onClick={ this._onColumnClick.bind(this, column) }
+                          aria-haspopup={ column.columnActionsMode === ColumnActionsMode.hasDropdown }
                         >
                           <span
                             id={ `${this._id}-${column.key}-name` }

From ad02795232194a76a6fc1468366d6ff1b030639b Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Thu, 16 Nov 2017 15:46:45 -0800
Subject: [PATCH 1032/1641] Website: Updated asset license to latest version
 (#3415)

* Updated license links to newest version

* Added change file
---
 apps/fabric-website/README.md                         |  2 +-
 .../src/pages/GetStarted/GetStartedPage.tsx           |  2 +-
 apps/fabric-website/src/pages/HomePage/HomePage.tsx   |  2 +-
 .../pages/Styles/BrandIconsPage/BrandIconsPage.tsx    |  2 +-
 .../asset-license_2017-11-16-22-54.json               | 11 +++++++++++
 5 files changed, 15 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/asset-license_2017-11-16-22-54.json

diff --git a/apps/fabric-website/README.md b/apps/fabric-website/README.md
index e78385fb9b543..07dc1eb7fadc0 100644
--- a/apps/fabric-website/README.md
+++ b/apps/fabric-website/README.md
@@ -19,7 +19,7 @@ Before you get started, make sure you have [node.js](https://nodejs.org/), [gulp
 
 All files on the Office UI Fabric React GitHub repository are subject to the MIT license. Please read the License file at the root of the project.
 
-Usage of the fonts referenced in Office UI Fabric files is subject to the [license](https://spoprod-a.akamaihd.net/files/fabric/assets/microsoft_fabric_assets_license_agreement_v2_09262017.pdf).
+Usage of the fonts referenced in Office UI Fabric files is subject to the [license](https://spoprod-a.akamaihd.net/files/fabric/assets/microsoft_fabric_assets_license_agreement_10262017.pdf).
 
 - - -
 
diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
index dd76e1aa02a68..86d02e28211eb 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
@@ -206,7 +206,7 @@ initializeIcons('https://my.cdn.com/path/to/icons/');`
           <h3>Need an icon or feature Fabric Core doesn&rsquo;t have?</h3>
           <p>First, check the <a className={ styles.getStartedLink } href='https://github.com/OfficeDev/office-ui-fabric-react/issues'>Fabric React issue queue</a> or <a className={ styles.getStartedLink } href='https://github.com/OfficeDev/office-ui-fabric-react/projects'>projects</a> to see if your component has already been requested or is being worked on. If you don't see an existing issue or project for the component you're looking for, please <a className={ styles.getStartedLink } href='https://github.com/OfficeDev/office-ui-fabric-react/issues'>file an issue in the repo</a>, and we'll respond if it's being built or on our radar.</p>
 
-          <p className={ styles.trademark }>Usage of Fabric assets, such as fonts and icons, is subject to the <a className={ styles.getStartedLink } href='https://static2.sharepointonline.com/files/fabric/assets/microsoft_fabric_assets_license_agreement_v2_09262017.pdf'>assets license agreement</a>.</p>
+          <p className={ styles.trademark }>Usage of Fabric assets, such as fonts and icons, is subject to the <a className={ styles.getStartedLink } href='https://static2.sharepointonline.com/files/fabric/assets/microsoft_fabric_assets_license_agreement_10262017.pdf'>assets license agreement</a>.</p>
         </div>
 
       </div>
diff --git a/apps/fabric-website/src/pages/HomePage/HomePage.tsx b/apps/fabric-website/src/pages/HomePage/HomePage.tsx
index d7be28efd0838..83cf6348f9074 100644
--- a/apps/fabric-website/src/pages/HomePage/HomePage.tsx
+++ b/apps/fabric-website/src/pages/HomePage/HomePage.tsx
@@ -81,7 +81,7 @@ export class HomePage extends React.Component<any, any> {
               </a>
             </li>
           </ul>
-          <span className={ styles.trademark }>All trademarks are the property of their respective owners. Usage of Fabric assets, such as fonts and icons, is subject to the <a className={ styles.homePageLink } href='https://static2.sharepointonline.com/files/fabric/assets/microsoft_fabric_assets_license_agreement_v2_09262017.pdf'>assets license agreement</a>.</span>
+          <span className={ styles.trademark }>All trademarks are the property of their respective owners. Usage of Fabric assets, such as fonts and icons, is subject to the <a className={ styles.homePageLink } href='https://static2.sharepointonline.com/files/fabric/assets/microsoft_fabric_assets_license_agreement_10262017.pdf'>assets license agreement</a>.</span>
           <span className={ styles.featuredTitle }>Design Toolkit</span>
           <span className={ styles.featuredDescription } id={ styles.toolkitDescription }>The Fabric design toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Office experiences. <a className={ styles.homePageLink } href='#/resources'>Learn more</a></span>
         </div>
diff --git a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
index b367773a96ff0..3e6e62ce10b04 100644
--- a/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/BrandIconsPage/BrandIconsPage.tsx
@@ -53,7 +53,7 @@ export class BrandIconsPage extends React.Component<any, any> {
         <div className={ pageStyles.u_maxTextWidth }>
           <h2 id='overview'>Overview</h2>
           <p>Fabric includes product and document icons that you can use to connect your experience with other Office and Office 365 endpoints. The icons come in three formats &mdash; SVG and PNG for multicolor and the icon font for monochrome &mdash; in a variety of sizes and resolutions.</p>
-          <p>Usage of these icons is subject to the <a className={ styles.brandIconsPageLink } href='https://static2.sharepointonline.com/files/fabric/assets/microsoft_fabric_assets_license_agreement_v2_09262017.pdf'>assets license agreement (PDF)</a>. Please read this document and the resolution/size guidance carefully to ensure that you use our branded icons correctly to create the best experience.</p>
+          <p>Usage of these icons is subject to the <a className={ styles.brandIconsPageLink } href='https://static2.sharepointonline.com/files/fabric/assets/microsoft_fabric_assets_license_agreement_10262017.pdf'>assets license agreement (PDF)</a>. Please read this document and the resolution/size guidance carefully to ensure that you use our branded icons correctly to create the best experience.</p>
         </div>
         <h3>Product icons</h3>
         <div className='ms-Grid ms-Grid--wide'>
diff --git a/common/changes/@uifabric/fabric-website/asset-license_2017-11-16-22-54.json b/common/changes/@uifabric/fabric-website/asset-license_2017-11-16-22-54.json
new file mode 100644
index 0000000000000..8d03cfdf824f1
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/asset-license_2017-11-16-22-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Updated asset license to newest version.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From d2a2dcac90c4f9720b5f205665aa7e099cf97af9 Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Thu, 16 Nov 2017 16:02:00 -0800
Subject: [PATCH 1033/1641] SplitButton: Add prop to make it possible to apply
 rootExposed to the full button even it it is split (#3381)

* Add splitButtonActive prop

* Add change file

* Separte selectors css rules to their own prop and only apply them when disabled is false

* Remove unintended commit

* Add getClassNames as a prop to ButtonProps

* Remove unneeded prop and unncessary comma

* Remove splitFullActiveProp

* Fix description in prop

* Remove unncessary comma

* Remove styles dependency

* Make getBaseButtonClassNames still use styles to keep default styles
---
 ...litButtonRootExposed_2017-11-13-20-59.json | 11 ++++++++++
 package.json                                  |  2 +-
 .../Button/BaseButton.classNames.ts           |  5 +++--
 .../src/components/Button/BaseButton.tsx      | 22 +++++++++++++------
 .../src/components/Button/Button.types.ts     | 17 ++++++++++++++
 5 files changed, 47 insertions(+), 10 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/malozano-SplitButtonRootExposed_2017-11-13-20-59.json

diff --git a/common/changes/office-ui-fabric-react/malozano-SplitButtonRootExposed_2017-11-13-20-59.json b/common/changes/office-ui-fabric-react/malozano-SplitButtonRootExposed_2017-11-13-20-59.json
new file mode 100644
index 0000000000000..86ff84976da0f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-SplitButtonRootExposed_2017-11-13-20-59.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SplitButton: Add splitFullActiveState to make the whole splitButton look active if true",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/package.json b/package.json
index 345ca673491d3..65049d1a740e9 100644
--- a/package.json
+++ b/package.json
@@ -29,4 +29,4 @@
   "devDependencies": {
     "@microsoft/rush": "4.0.0"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
index d8a8e99c6e075..6c00c75b35f88 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
@@ -1,6 +1,7 @@
 import { memoizeFunction } from '../../Utilities';
-import { mergeStyles } from '../../Styling';
+import { mergeStyles, ITheme } from '../../Styling';
 import { IButtonStyles } from './Button.types';
+import { getStyles } from './BaseButton.styles';
 
 export interface IButtonClassNames {
   root?: string;
@@ -13,7 +14,7 @@ export interface IButtonClassNames {
   screenReaderText?: string;
 }
 
-export const getClassNames = memoizeFunction((
+export const getBaseButtonClassNames = memoizeFunction((
   styles: IButtonStyles,
   className: string,
   variantClassName: string,
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index e3734e455d1dd..fdc1af648207c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -14,7 +14,7 @@ import { Icon, IIconProps } from '../../Icon';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { ContextualMenu, IContextualMenuProps } from '../../ContextualMenu';
 import { IButtonProps, IButton } from './Button.types';
-import { IButtonClassNames, getClassNames } from './BaseButton.classNames';
+import { IButtonClassNames, getBaseButtonClassNames } from './BaseButton.classNames';
 import { getClassNames as getSplitButtonClassNames, ISplitButtonClassNames } from './SplitButton/SplitButton.classNames';
 
 export interface IBaseButtonProps extends IButtonProps {
@@ -40,7 +40,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     baseClassName: 'ms-Button',
     classNames: {},
     styles: {},
-    split: false
+    split: false,
   };
 
   private _buttonElement: HTMLElement;
@@ -85,15 +85,17 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       styles,
       text,
       checked,
-      variantClassName
+      variantClassName,
+      theme,
+      getClassNames
          } = this.props;
 
     let { menuProps } = this.state;
     // Button is disabled if the whole button (in case of splitbutton is disabled) or if the primary action is disabled
     let isPrimaryButtonDisabled = (disabled || primaryDisabled);
 
-    this._classNames = getClassNames(
-      styles!,
+    this._classNames = getClassNames ? getClassNames(
+      theme!,
       className!,
       variantClassName!,
       iconProps && iconProps.className,
@@ -101,8 +103,14 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       isPrimaryButtonDisabled!,
       checked!,
       !!this.state.menuProps,
-      this.props.split
-    );
+      this.props.split) : getBaseButtonClassNames(styles!, className!,
+        variantClassName!,
+        iconProps && iconProps.className,
+        menuIconProps && menuIconProps.className,
+        isPrimaryButtonDisabled!,
+        checked!,
+        !!this.state.menuProps,
+        this.props.split);
 
     const { _ariaDescriptionId, _labelId, _descriptionId } = this;
     // Anchor tag cannot be disabled hence in disabled state rendering
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.types.ts b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
index 900234bea2dcc..68c7396391cae 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { BaseButton } from './BaseButton';
 import { Button } from './Button';
+import { IButtonClassNames } from './BaseButton.classNames';
 import { IRenderFunction } from '../../Utilities';
 import { IContextualMenuProps } from '../../ContextualMenu';
 import { IIconProps } from '../../Icon';
@@ -185,6 +186,22 @@ export interface IButtonProps extends React.AllHTMLAttributes<HTMLAnchorElement
  * Any custom data the developer wishes to associate with the menu item.
  */
   data?: any;
+
+  /**
+  * Method to provide the classnames to style a button.
+  * The default value for this prop is the getClassnames func
+  * defined in BaseButton.classnames.
+  * @default getBaseButtonClassNames
+  */
+  getClassNames?: (theme: ITheme,
+    className: string,
+    variantClassName: string,
+    iconClassName: string | undefined,
+    menuIconClassName: string | undefined,
+    disabled: boolean,
+    checked: boolean,
+    expanded: boolean,
+    isSplit: boolean | undefined) => IButtonClassNames;
 }
 
 export enum ElementType {

From 8ad0e5ca9fb39a3d719de88792e2893c2aa92f20 Mon Sep 17 00:00:00 2001
From: Bryan Watts <brwatt@microsoft.com>
Date: Thu, 16 Nov 2017 16:19:18 -0800
Subject: [PATCH 1034/1641]  Fixes #3352 - Make sure commands get added/removed
 in the correct order (#3413)

* Fixes #3352 - Make sure commands get added/removed in the correct order

* Add change file
---
 ...brwatt-fix-commandbar-growth_2017-11-16-21-50.json | 11 +++++++++++
 .../src/components/CommandBar/CommandBar.tsx          |  6 +++---
 2 files changed, 14 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/brwatt-fix-commandbar-growth_2017-11-16-21-50.json

diff --git a/common/changes/@uifabric/experiments/brwatt-fix-commandbar-growth_2017-11-16-21-50.json b/common/changes/@uifabric/experiments/brwatt-fix-commandbar-growth_2017-11-16-21-50.json
new file mode 100644
index 0000000000000..49ebf1295fdfc
--- /dev/null
+++ b/common/changes/@uifabric/experiments/brwatt-fix-commandbar-growth_2017-11-16-21-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Make sure commands get added/removed in the correct order",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "brwatt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.tsx b/packages/experiments/src/components/CommandBar/CommandBar.tsx
index 08d64e1873c8a..5fcb46a4097d5 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBar.tsx
@@ -150,7 +150,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, {}> implements I
     if (movedItem !== undefined) {
       movedItem.renderedInOverflow = true;
 
-      overflowItems = [...overflowItems, movedItem];
+      overflowItems = [movedItem, ...overflowItems];
       primaryItems = primaryItems.slice(0, -1);
       cacheKey = this._computeCacheKey(primaryItems, farItems!, !!overflowItems.length);
 
@@ -163,13 +163,13 @@ export class CommandBar extends BaseComponent<ICommandBarProps, {}> implements I
   @autobind
   private _onGrowData(data: ICommandBarData): ICommandBarData | undefined {
     let { primaryItems, overflowItems, cacheKey, minimumOverflowItems, farItems } = data;
-    let movedItem = overflowItems[overflowItems.length - 1];
+    let movedItem = overflowItems[0];
 
     // Make sure that moved item exists and is not one of the original overflow items
     if (movedItem !== undefined && overflowItems.length > minimumOverflowItems) {
       movedItem.renderedInOverflow = false;
 
-      overflowItems = overflowItems.slice(0, -1);
+      overflowItems = overflowItems.slice(1);
       primaryItems = [...primaryItems, movedItem];
       cacheKey = this._computeCacheKey(primaryItems, farItems!, !!overflowItems.length);
 

From 067363fb9722d9e460d2642acaf1886274aec99b Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Thu, 16 Nov 2017 16:58:18 -0800
Subject: [PATCH 1035/1641] Fixing high contrast bugs from issue #3102 (#3301)

* High contrast fixes: choiceGroup, persona, suggestions, commandbar example

* Increasing visibilty of focus border on choice group elements.

* picker selected item high contrast improvements

* Removing swatchColorPicker high contrast borders

* Primary button, dropdown, and colorPicker contrast adjustments

* Details check, message bar x button, progress, spinner, and toggle HC updates

* rush change

* Build fixes

* Fixing persona/activityItem border issues

* Changing achor button example to a non-primary button

* Using non-deprecated defaultButton

* changing compact border to palette color

* Removing high-contrast const definitions from all style ts files
---
 ...ow-oct-contrast-bugs_2017-11-02-21-34.json | 11 +++++
 .../ActivityItem/ActivityItem.styles.ts       | 18 +++++++-
 .../components/ActivityItem/ActivityItem.tsx  |  4 +-
 .../src/components/Button/ButtonThemes.ts     | 42 ++++++++++++++++---
 .../CompoundButton/CompoundButton.styles.ts   | 20 ++++++++-
 .../Button/examples/Button.Anchor.Example.tsx |  7 ++--
 .../src/components/Check/Check.scss           | 11 +++--
 .../components/ChoiceGroup/ChoiceGroup.scss   |  7 +++-
 .../components/ColorPicker/ColorPicker.scss   |  4 ++
 .../components/ComboBox/ComboBox.styles.ts    | 17 ++++----
 .../examples/CommandBar.Example.scss          |  3 ++
 .../ContextualMenu/ContextualMenu.styles.ts   | 11 +++--
 .../src/components/Dropdown/Dropdown.scss     |  2 +-
 .../HoverCard/ExpandingCard.styles.ts         |  7 ++--
 .../src/components/Label/Label.classNames.ts  |  6 +--
 .../src/components/MessageBar/MessageBar.scss |  4 ++
 .../src/components/Persona/Persona.scss       | 15 ++++---
 .../ProgressIndicator/ProgressIndicator.scss  |  4 +-
 .../SpinButton/SpinButton.styles.ts           | 21 +++++-----
 .../src/components/Spinner/Spinner.scss       |  2 +-
 .../SwatchColorPicker/SwatchColorPicker.scss  |  4 ++
 .../components/Toggle/Toggle.classNames.ts    | 30 ++++++++-----
 .../Toggle/__snapshots__/Toggle.test.tsx.snap |  4 +-
 .../pickers/Suggestions/Suggestions.scss      | 23 +++++++++-
 24 files changed, 198 insertions(+), 79 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-oct-contrast-bugs_2017-11-02-21-34.json

diff --git a/common/changes/office-ui-fabric-react/v-krbrow-oct-contrast-bugs_2017-11-02-21-34.json b/common/changes/office-ui-fabric-react/v-krbrow-oct-contrast-bugs_2017-11-02-21-34.json
new file mode 100644
index 0000000000000..26f5940588839
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-oct-contrast-bugs_2017-11-02-21-34.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixing high contrast bugs",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
index 3eda41f13db56..c07eed7a0bab1 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
@@ -1,7 +1,8 @@
 import {
   concatStyleSets,
   ITheme,
-  getTheme
+  getTheme,
+  HighContrastSelector
 } from '../../Styling';
 import {
   memoizeFunction
@@ -65,7 +66,20 @@ export const getStyles = memoizeFunction((
       fontSize: COMPACT_ICON_SIZE,
       lineHeight: COMPACT_ICON_SIZE,
       color: theme.palette.themePrimary,
-      marginTop: '1px'
+      marginTop: '1px',
+      selectors: {
+        '.ms-Persona-imageArea': {
+          marginTop: '-2px',
+          border: '2px solid' + theme.palette.white,
+          borderRadius: '50%',
+          selectors: {
+            [HighContrastSelector]: {
+              border: 'none',
+              marginTop: '0'
+            }
+          }
+        }
+      }
     },
 
     activityPersona: {
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
index 62c6f5c7d6ba7..4b865a9a50b6f 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
@@ -108,8 +108,8 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
       if (props.isCompact) {
         style = {
           display: 'inline-block',
-          width: '8px',
-          minWidth: '8px',
+          width: '10px',
+          minWidth: '10px',
           overflow: 'visible'
         };
       }
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts b/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
index 0fa33356502b3..60b0d74310e23 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
@@ -1,5 +1,5 @@
 import { IButtonStyles } from './Button.types';
-import { ITheme } from '../../Styling';
+import { ITheme, HighContrastSelector } from '../../Styling';
 
 export function standardStyles(theme: ITheme): IButtonStyles {
   let s = theme.semanticColors;
@@ -93,17 +93,38 @@ export function primaryStyles(theme: ITheme): IButtonStyles {
   return {
     root: {
       backgroundColor: theme.palette.themePrimary,
-      color: theme.palette.white
+      color: theme.palette.white,
+      selectors: {
+        [HighContrastSelector]: {
+          color: 'Window',
+          backgroundColor: 'WindowText',
+          MsHighContrastAdjust: 'none'
+        }
+      }
     },
 
     rootHovered: {
       backgroundColor: theme.palette.themeDark,
-      color: theme.palette.white
+      color: theme.palette.white,
+      selectors: {
+        [HighContrastSelector]: {
+          color: 'Window',
+          backgroundColor: 'WindowText',
+          MsHighContrastAdjust: 'none'
+        }
+      }
     },
 
     rootPressed: {
       backgroundColor: theme.palette.themePrimary,
-      color: theme.palette.white
+      color: theme.palette.white,
+      selectors: {
+        [HighContrastSelector]: {
+          color: 'Window',
+          backgroundColor: 'WindowText',
+          MsHighContrastAdjust: 'none'
+        }
+      }
     },
 
     rootExpanded: {
@@ -121,6 +142,16 @@ export function primaryStyles(theme: ITheme): IButtonStyles {
       color: theme.palette.white
     },
 
+    rootDisabled: {
+      selectors: {
+        [HighContrastSelector]: {
+          color: 'GrayText',
+          borderColor: 'GrayText',
+          backgroundColor: 'Window'
+        }
+      },
+    },
+
     // Split button styles
     splitButtonContainer: {},
 
@@ -161,7 +192,6 @@ export function primaryStyles(theme: ITheme): IButtonStyles {
 
     splitButtonMenuIconDisabled: {
       color: theme.palette.neutralTertiary
-    },
-
+    }
   };
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
index 6cc64869e0fe7..7db84da2cdd90 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
@@ -2,7 +2,8 @@ import { IButtonStyles } from '../Button.types';
 import {
   ITheme,
   concatStyleSets,
-  FontWeights
+  FontWeights,
+  HighContrastSelector
 } from '../../../Styling';
 import { memoizeFunction } from '../../../Utilities';
 import {
@@ -92,10 +93,25 @@ export const getStyles = memoizeFunction((
 
     description: {
       color: theme.palette.white,
+      selectors: {
+        [HighContrastSelector]: {
+          color: 'Window',
+          backgroundColor: 'WindowText',
+          MsHighContrastAdjust: 'none'
+        }
+      }
+
     },
 
     descriptionHovered: {
-      color: theme.palette.white
+      color: theme.palette.white,
+      selectors: {
+        [HighContrastSelector]: {
+          color: 'Window',
+          backgroundColor: 'WindowText',
+          MsHighContrastAdjust: 'none'
+        }
+      }
     },
 
     descriptionPressed: {
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
index 61366cb3f7e69..e9804c13f6497 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import {
   IButtonProps,
-  PrimaryButton
+  DefaultButton
 } from 'office-ui-fabric-react/lib/Button';
 import {
   Label
@@ -17,17 +17,16 @@ export class ButtonAnchorExample extends React.Component<IButtonProps, {}> {
 
     return (
       <div className='ms-BasicButtonsExample'>
-        <PrimaryButton
+        <DefaultButton
           data-automation-id='test'
           disabled={ disabled }
           checked={ checked }
           href='http://bing.com'
           target='_blank'
           title='Let us bing!'
-          style={ { color: '#ffffff' } }
         >
           Bing
-        </PrimaryButton>
+        </DefaultButton>
       </div >
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.scss b/packages/office-ui-fabric-react/src/components/Check/Check.scss
index bcc1db967f2c0..f9c79db42036c 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.scss
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.scss
@@ -33,6 +33,9 @@ $checkBoxHeight: 18px;
   &.rootIsChecked:before {
     background: $ms-color-themePrimary;
     opacity: 1;
+    @include high-contrast {
+      background: Window;
+    }
   }
 
   .check {
@@ -66,7 +69,7 @@ $checkBoxHeight: 18px;
   color: $ms-color-neutralTertiaryAlt;
 
   @include high-contrast {
-    display: none;
+    color: WindowText;
   }
 }
 
@@ -78,6 +81,10 @@ $checkBoxHeight: 18px;
   color: $ms-color-neutralTertiaryAlt;
   font-size: 16px;
   left: .5px;
+
+  @include high-contrast {
+    -ms-high-contrast-adjust: none;
+  }
 }
 
 .rootIsChecked .check {
@@ -85,9 +92,7 @@ $checkBoxHeight: 18px;
   font-weight: 900;
 
   @include high-contrast {
-    border-radius: 10px;
     border: none;
-    background: Window;
     color: WindowText;
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
index 9c339a49c4e97..359e8cf271a5f 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
@@ -213,6 +213,11 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
 
       .innerField {
         opacity: 0.25;
+
+        @include high-contrast {
+          color: GrayText;
+          opacity: 1;
+        }
       }
     }
 
@@ -333,7 +338,7 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
 :global(.ms-Fabric.is-focusVisible) .choiceFieldIsInFocus {
   &.choiceFieldIsImage .choiceFieldWrapper,
   &.choiceFieldIsIcon .choiceFieldWrapper {
-    @include focus-border(1px, $ms-color-neutralPrimary, 1px, false);
+    @include focus-border(1px, $ms-color-neutralPrimary, 2px, false);
 
     @include high-contrast {
       @include focus-border(1px, WindowText, 2px, false);
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.scss b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.scss
index d9395a3b07398..5d18a80972126 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.scss
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.scss
@@ -12,6 +12,10 @@
 .colorRect {
   position: relative;
   margin-bottom: 10px;
+
+  @include high-contrast {
+    -ms-high-contrast-adjust: none;
+  }
 }
 
 .rectContainer {
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index c5aef5c22d528..d360d832c3eb5 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -4,7 +4,8 @@ import {
   IRawStyle,
   ITheme,
   concatStyleSets,
-  getFocusStyle
+  getFocusStyle,
+  HighContrastSelector
 } from '../../Styling';
 import {
   IComboBoxOptionStyles,
@@ -14,8 +15,6 @@ import {
 import { IButtonStyles } from '../../Button';
 import { memoizeFunction } from '../../Utilities';
 
-const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
-
 const ComboBoxHeight = '32px';
 const ComboBoxLineHeight = '30px';
 const ComboxBoxCaretDownWidth = '32px';
@@ -30,7 +29,7 @@ const getDisabledStyles = memoizeFunction((theme: ITheme): IRawStyle => {
     color: semanticColors.disabledText,
     cursor: 'default',
     selectors: {
-      [MS_HIGHCONTRAST_ACTIVE]: {
+      [HighContrastSelector]: {
         borderColor: 'GrayText',
         color: 'GrayText'
       }
@@ -41,7 +40,7 @@ const getDisabledStyles = memoizeFunction((theme: ITheme): IRawStyle => {
 const getListOptionHighContrastStyles = memoizeFunction((theme: ITheme): IRawStyle => {
   return {
     selectors: {
-      [MS_HIGHCONTRAST_ACTIVE]: {
+      [HighContrastSelector]: {
         backgroundColor: 'Highlight',
         borderColor: 'Highlight',
         color: 'HighlightText',
@@ -86,7 +85,7 @@ export const getOptionStyles = memoizeFunction((
         overflowWrap: 'break-word',
         textAlign: 'left',
         selectors: {
-          [MS_HIGHCONTRAST_ACTIVE]: {
+          [HighContrastSelector]: {
             borderColor: 'Background'
           }
         }
@@ -157,7 +156,7 @@ export const getCaretDownButtonStyles = memoizeFunction((
       textAlign: 'center',
       cursor: 'default',
       selectors: {
-        [MS_HIGHCONTRAST_ACTIVE]: {
+        [HighContrastSelector]: {
           backgroundColor: 'ButtonFace',
           borderColor: 'ButtonText',
           color: 'ButtonText',
@@ -235,7 +234,7 @@ export const getStyles = memoizeFunction((
     rootHovered: {
       borderColor: ComboBoxRootBorderColorHovered,
       selectors: {
-        [MS_HIGHCONTRAST_ACTIVE]: {
+        [HighContrastSelector]: {
           color: 'HighlightText',
           borderColor: 'Highlight',
           MsHighContrastAdjust: 'none'
@@ -246,7 +245,7 @@ export const getStyles = memoizeFunction((
     rootFocused: {
       borderColor: ComboBoxRootBorderColorHovered,
       selectors: {
-        [MS_HIGHCONTRAST_ACTIVE]: {
+        [HighContrastSelector]: {
           color: 'HighlightText',
           borderColor: 'Highlight',
           MsHighContrastAdjust: 'none'
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Example.scss b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Example.scss
index cf68c2fadc013..4afbd507b2c53 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Example.scss
@@ -28,6 +28,9 @@
     position: relative;
     top: -2px;
     height: 40px;
+    @include high-contrast {
+      display: none;
+    }
 }
 
 /* Require update when office-ui-fabric-react changes to CSS modules */
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
index d4b861b93c6de..a3c5fb8257ae0 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
@@ -4,20 +4,19 @@ import {
   IRawStyle,
   ITheme,
   concatStyleSets,
-  getFocusStyle
+  getFocusStyle,
+  HighContrastSelector
 } from '../../Styling';
 import { IContextualMenuStyles, IMenuItemStyles } from './ContextualMenu.types';
 
 import { memoizeFunction } from '../../Utilities';
 
-const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
-
 const ContextualMenuItemHeight = '32px';
 
 const getItemHighContrastStyles = memoizeFunction((): IRawStyle => {
   return {
     selectors: {
-      [MS_HIGHCONTRAST_ACTIVE]: {
+      [HighContrastSelector]: {
         backgroundColor: 'Highlight',
         borderColor: 'Highlight',
         color: 'HighlightText',
@@ -130,7 +129,7 @@ export const getMenuItemStyles = memoizeFunction((
     iconColor: {
       color: semanticColors.menuIcon,
       selectors: {
-        [MS_HIGHCONTRAST_ACTIVE]: {
+        [HighContrastSelector]: {
           color: 'HighlightText',
         }
       }
@@ -138,7 +137,7 @@ export const getMenuItemStyles = memoizeFunction((
     checkmarkIcon: {
       color: semanticColors.bodySubtext,
       selectors: {
-        [MS_HIGHCONTRAST_ACTIVE]: {
+        [HighContrastSelector]: {
           color: 'HighlightText',
         }
       }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
index 116f481c8d411..5fd1193a3d6b8 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
@@ -83,7 +83,7 @@ $DropDown-item-height: 32px;
     cursor: default;
 
     @include high-contrast {
-      border-color: GrayText;
+      border: 1px solid GrayText;
       color: GrayText;
     }
 
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
index 910de2d9e8dc4..4f5f8ab858f6d 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.styles.ts
@@ -2,11 +2,10 @@ import { IExpandingCardStyles } from './ExpandingCard.types';
 import { memoizeFunction } from '../../Utilities';
 import {
   concatStyleSets,
-  ITheme
+  ITheme,
+  HighContrastSelector
 } from '../../Styling';
 
-const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
-
 export const getStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: IExpandingCardStyles
@@ -21,7 +20,7 @@ export const getStyles = memoizeFunction((
           boxShadow: '0 0 20px rgba(0, 0, 0, .2)',
           border: 'none',
           selectors: {
-            [MS_HIGHCONTRAST_ACTIVE]: {
+            [HighContrastSelector]: {
               border: '1px solid WindowText',
             }
           }
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.classNames.ts b/packages/office-ui-fabric-react/src/components/Label/Label.classNames.ts
index 2ccc60c7066be..f7d06737a6d7e 100644
--- a/packages/office-ui-fabric-react/src/components/Label/Label.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Label/Label.classNames.ts
@@ -1,12 +1,10 @@
 import { memoizeFunction } from '../../Utilities';
-import { ITheme, FontSizes, mergeStyleSets } from '../../Styling';
+import { ITheme, FontSizes, mergeStyleSets, HighContrastSelector } from '../../Styling';
 
 export interface ILabelClassNames {
   root: string;
 }
 
-const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
-
 export const getLabelClassNames = memoizeFunction((theme: ITheme, className: string | undefined, disabled: boolean, required: boolean): ILabelClassNames => {
   return mergeStyleSets({
     root:
@@ -24,7 +22,7 @@ export const getLabelClassNames = memoizeFunction((theme: ITheme, className: str
       disabled && {
         color: theme.semanticColors.disabledBodyText,
         selectors: {
-          [MS_HIGHCONTRAST_ACTIVE]: {
+          [HighContrastSelector]: {
             color: 'GrayText'
           }
         }
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
index d8da2d1699524..82f428d359777 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
@@ -178,6 +178,10 @@
   @include right(0);
   max-height: 16px;
   flex-shrink: 0;
+
+  @include high-contrast {
+    -ms-high-contrast-adjust: none;
+  }
 }
 
 .dismissOneline {
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
index bc54e1b456a76..155da7c816c35 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
@@ -90,10 +90,6 @@ $ms-Persona-presenceBorder: 2px;
   height: $ms-Persona-size48;
   width: $ms-Persona-size48;
 
-  @include high-contrast {
-    border: 1px solid WindowText;
-  }
-
   .image {
     border: 0px;
   }
@@ -120,6 +116,13 @@ $ms-Persona-presenceBorder: 2px;
   line-height: 46px;
   height: $ms-Persona-size48;
 
+  @include high-contrast {
+    border: 1px solid WindowText;
+    -ms-high-contrast-adjust: none;
+    // Using important to override all of the more specific initialsIsColor rules
+    background-color: Window !important;
+  }
+
   &.initialsIsLightBlue {
     background-color: $ms-color-initials-lightBlue;
   }
@@ -335,10 +338,6 @@ $ms-Persona-presenceBorder: 2px;
 }
 
 .rootIsSize16 {
-  .imageArea {
-    box-shadow: 0 0 0 2px $ms-color-white;
-  }
-
   .imageArea,
   .image {
     height: $ms-Persona-size16;
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
index 7614bef6898b7..19884a9b6a69c 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
@@ -43,7 +43,9 @@ $ProgressIndicatorTextHeight: 18px;
   width: 100%;
   height: 2px;
   background-color: $ms-color-neutralLight;
-  outline: 1px solid transparent;
+  @include high-contrast {
+    border-bottom: 1px solid WindowText;
+  }
 }
 
 .progressBar {
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
index 2e45b3f34bf84..3bcf63e9f2a39 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
@@ -2,15 +2,14 @@ import {
   FontSizes,
   IRawStyle,
   ITheme,
-  concatStyleSets
+  concatStyleSets,
+  HighContrastSelector
 } from '../../Styling';
 
 import { IButtonStyles } from '../../Button';
 import { ISpinButtonStyles } from './SpinButton.types';
 import { memoizeFunction } from '../../Utilities';
 
-const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
-
 const _getDisabledStyles = memoizeFunction((theme: ITheme): IRawStyle => {
   const { semanticColors } = theme;
 
@@ -24,7 +23,7 @@ const _getDisabledStyles = memoizeFunction((theme: ITheme): IRawStyle => {
     cursor: 'default',
     color: SpinButtonTextColorDisabled,
     selectors: {
-      [MS_HIGHCONTRAST_ACTIVE]: {
+      [HighContrastSelector]: {
         color: 'GrayText'
       }
     }
@@ -66,7 +65,7 @@ export const getArrowButtonStyles = memoizeFunction((
       backgroundColor: ArrowButtonBackgroundPressed,
       color: ArrowButtonTextColorPressed,
       selectors: {
-        [MS_HIGHCONTRAST_ACTIVE]: {
+        [HighContrastSelector]: {
           backgroundColor: 'Highlight',
           color: 'HighlightText'
         }
@@ -76,7 +75,7 @@ export const getArrowButtonStyles = memoizeFunction((
       backgroundColor: ArrowButtonBackgroundPressed,
       color: ArrowButtonTextColorPressed,
       selectors: {
-        [MS_HIGHCONTRAST_ACTIVE]: {
+        [HighContrastSelector]: {
           backgroundColor: 'Highlight',
           color: 'HighlightText'
         }
@@ -85,7 +84,7 @@ export const getArrowButtonStyles = memoizeFunction((
     rootDisabled: {
       opacity: 0.5,
       selectors: {
-        [MS_HIGHCONTRAST_ACTIVE]: {
+        [HighContrastSelector]: {
           color: 'GrayText',
           opacity: 1,
         }
@@ -183,7 +182,7 @@ export const getStyles = memoizeFunction((
       cursor: 'default',
       color: SpinButtonTextColorDisabled,
       selectors: {
-        [MS_HIGHCONTRAST_ACTIVE]: {
+        [HighContrastSelector]: {
           color: 'GrayText'
         }
       }
@@ -203,7 +202,7 @@ export const getStyles = memoizeFunction((
       borderColor: SpinButtonRootBorderColorHovered,
       outline: '2px dashed transparent',
       selectors: {
-        [MS_HIGHCONTRAST_ACTIVE]: {
+        [HighContrastSelector]: {
           borderColor: 'Highlight'
         }
       }
@@ -212,7 +211,7 @@ export const getStyles = memoizeFunction((
       borderColor: SpinButtonRootBorderColorFocused,
       outline: '2px dashed transparent',
       selectors: {
-        [MS_HIGHCONTRAST_ACTIVE]: {
+        [HighContrastSelector]: {
           borderColor: 'Highlight'
         }
       }
@@ -247,7 +246,7 @@ export const getStyles = memoizeFunction((
       backgroundColor: SpinButtonInputBackgroundColorSelected,
       color: SpinButtonInputTextColorSelected,
       selectors: {
-        [MS_HIGHCONTRAST_ACTIVE]: {
+        [HighContrastSelector]: {
           backgroundColor: 'Highlight',
           borderColor: 'Highlight',
           color: 'HighlightText',
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss
index de35c90a91761..124073248b58b 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss
+++ b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss
@@ -62,7 +62,7 @@ $borderSize: 1.5px;
 @include high-contrast {
   .root {
     > .circle {
-        border-top-style: none;
+        border-top-color: Highlight;
     }
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
index 9f7fc07da0e87..21a7c9b595821 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
@@ -117,6 +117,10 @@
     pointer-events: none;
     opacity: .3;
   }
+
+  @include high-contrast {
+    border: none;
+  }
 }
 
 .swatchColorPickerContainer {
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
index 5d26e3a0fe548..7aff21b8cf354 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
@@ -2,7 +2,8 @@ import { memoizeFunction } from '../../Utilities';
 import {
   ITheme,
   mergeStyleSets,
-  getFocusStyle
+  getFocusStyle,
+  HighContrastSelector
 } from '../../Styling';
 import { IToggleStyles } from './Toggle.types';
 
@@ -15,8 +16,6 @@ export interface IToggleClassNames {
   text?: string;
 }
 
-const MS_HIGHCONTRAST_ACTIVE = '@media screen and (-ms-high-contrast: active)';
-
 export const getClassNames = memoizeFunction((
   theme: ITheme,
   styles: IToggleStyles,
@@ -59,7 +58,7 @@ export const getClassNames = memoizeFunction((
       disabled && {
         color: textDisabledColor,
         selectors: {
-          [MS_HIGHCONTRAST_ACTIVE]: {
+          [HighContrastSelector]: {
             color: 'GrayText'
           },
         }
@@ -109,7 +108,7 @@ export const getClassNames = memoizeFunction((
         checked && [
           {
             background: pillCheckedBackground,
-            borderColor: 'transparent',
+            borderColor: 'transparent'
           },
           styles.pillChecked,
           {
@@ -123,7 +122,10 @@ export const getClassNames = memoizeFunction((
               ],
               ':hover .ms-Toggle-thumb': [
                 styles.thumbCheckedHovered
-              ]
+              ],
+              [HighContrastSelector]: {
+                backgroundColor: 'WindowText'
+              }
             }
           }
         ]
@@ -155,12 +157,12 @@ export const getClassNames = memoizeFunction((
         height: '.5em',
         borderRadius: '.5em',
         position: 'absolute',
-        top: '.2em',
+        top: '.18em',
         transition: 'all 0.1s ease',
         backgroundColor: thumbBackground,
         /* Border is added to handle high contrast mode for Firefox */
         borderColor: 'transparent',
-        borderWidth: '.27em',
+        borderWidth: '.28em',
         borderStyle: 'solid',
         boxSizing: 'border-box',
         left: '.2em'
@@ -169,9 +171,15 @@ export const getClassNames = memoizeFunction((
       !disabled && checked && [
         {
           backgroundColor: thumbCheckedBackground,
-          left: '1.4em'
+          left: '1.4em',
+          selectors: {
+            [HighContrastSelector]: {
+              backgroundColor: 'Window',
+              borderColor: 'Window'
+            }
+          }
         },
-        styles.thumbChecked
+        styles.thumbChecked,
       ],
       disabled && [
         !checked && [
@@ -208,7 +216,7 @@ export const getClassNames = memoizeFunction((
           '&&': {
             color: textDisabledColor,
             selectors: {
-              [MS_HIGHCONTRAST_ACTIVE]: {
+              [HighContrastSelector]: {
                 color: 'GrayText'
               },
             }
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap
index 0d8889b17559b..701e104b8f785 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap
@@ -95,12 +95,12 @@ exports[`Toggle renders toggle correctly 1`] = `
               border-color: transparent;
               border-radius: .5em;
               border-style: solid;
-              border-width: .27em;
+              border-width: .28em;
               box-sizing: border-box;
               height: .5em;
               left: .2em;
               position: absolute;
-              top: .2em;
+              top: .18em;
               transition: all 0.1s ease;
               width: .5em;
             }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
index 82d9e4fda8cd0..350d4ca0aa812 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
@@ -24,10 +24,17 @@
 
     &:hover {
       background: $ms-color-neutralTertiaryAlt;
+
+      @include high-contrast {
+        background: Highlight;
+        color: HighlightText;
+      }
     }
 
     @include high-contrast {
-      border: 1px solid WindowText;
+      background: Highlight;
+      color: HighlightText;
+      -ms-high-contrast-adjust: none;
     }
 
     .closeButton {
@@ -36,6 +43,12 @@
         color: $ms-color-neutralPrimary;
       }
     }
+
+    .itemButton {
+      @include high-contrast {
+        color: HighlightText;
+      }
+    }
   }
 
   .closeButton {
@@ -125,6 +138,10 @@
   height: 100%;
   width: 100%;
   padding: 7px 12px;
+
+  @include high-contrast {
+    color: WindowText;
+  }
 }
 
 .closeButton {
@@ -132,6 +149,10 @@
   height: auto;
   width: 32px;
 
+  @include high-contrast {
+    color: WindowText;
+  }
+
   &:hover {
     background: $ms-color-neutralTertiaryAlt;
     color: $ms-color-neutralDark;

From a94240dd097b611997300ea1837f34d496b2d162 Mon Sep 17 00:00:00 2001
From: v-jaebey <v-jaebey@microsoft.com>
Date: Thu, 16 Nov 2017 20:36:37 -0800
Subject: [PATCH 1036/1641] Nav: Added onLinkExpandClick callback to Nav
 (#3380)

* Nav: Add onLinkClick to _onLinkExpandClicked

When rendering as a tree, it is useful to have access to an item when it has been expanded.

* - Added onLinkExpandClick callback to Nav

* - Updated to allow preventing default behavior

* Update patch-1_2017-11-15-23-16.json
---
 .../patch-1_2017-11-15-23-16.json                    | 11 +++++++++++
 .../src/components/Nav/Nav.tsx                       | 12 ++++++++++--
 .../src/components/Nav/Nav.types.ts                  |  5 +++++
 3 files changed, 26 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/patch-1_2017-11-15-23-16.json

diff --git a/common/changes/office-ui-fabric-react/patch-1_2017-11-15-23-16.json b/common/changes/office-ui-fabric-react/patch-1_2017-11-15-23-16.json
new file mode 100644
index 0000000000000..291753382fab2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/patch-1_2017-11-15-23-16.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Nav: Added `onLinkExpandClick` callback for getting a callback when an item expanded state is toggled",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-jaebey@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
index 5688b2ce90c41..7f55d49ec036c 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
@@ -303,8 +303,16 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
   }
 
   private _onLinkExpandClicked(link: INavLink, ev: React.MouseEvent<HTMLElement>): void {
-    link.isExpanded = !link.isExpanded;
-    this.setState({ isLinkExpandStateChanged: true });
+    const { onLinkExpandClick } = this.props;
+
+    if (onLinkExpandClick) {
+      onLinkExpandClick(ev, link);
+    }
+
+    if (!ev.defaultPrevented) {
+      link.isExpanded = !link.isExpanded;
+      this.setState({ isLinkExpandStateChanged: true });
+    }
 
     ev.preventDefault();
     ev.stopPropagation();
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts b/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
index d2c9ee4a9e637..200b55a318f21 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
@@ -39,6 +39,11 @@ export interface INavProps {
    */
   onLinkClick?: (ev?: React.MouseEvent<HTMLElement>, item?: INavLink) => void;
 
+  /**
+   * Function callback invoked when the chevron on a link is clicked
+   */
+  onLinkExpandClick?: (ev?: React.MouseEvent<HTMLElement>, item?: INavLink) => void;
+
   /**
    * Indicates whether the navigation component renders on top of other content in the UI
    */

From 5a5c4bc9fa2528b3e9ed3521ec2e43d70aa3b48f Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Thu, 16 Nov 2017 21:11:14 -0800
Subject: [PATCH 1037/1641] PersonaCoin: For non-latin initials, show a Contact
 icon instead of empty string (#3314)

* Render contact icon for non-latin initials

* Jsx build error fix

* Updated jest snapshot for DocumentCard

* Added change file

* Update persona-coin-initials_2017-11-06-16-14.json

* Update persona-coin-initials_2017-11-06-16-14.json

* Update persona-coin-initials_2017-11-06-16-14.json
---
 .../persona-coin-initials_2017-11-06-16-14.json    | 11 +++++++++++
 .../__snapshots__/DocumentCard.test.tsx.snap       | 14 +++++++++++---
 .../src/components/Persona/PersonaCoin.tsx         |  4 +++-
 3 files changed, 25 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/persona-coin-initials_2017-11-06-16-14.json

diff --git a/common/changes/office-ui-fabric-react/persona-coin-initials_2017-11-06-16-14.json b/common/changes/office-ui-fabric-react/persona-coin-initials_2017-11-06-16-14.json
new file mode 100644
index 0000000000000..baf07d83af241
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/persona-coin-initials_2017-11-06-16-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "PersonaCoin: For non-latin characters, if initials return an empty string, use the Contact icon instead of the empty string.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap b/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap
index 502a1a34841f8..85151f0fbfd9f 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap
@@ -42,9 +42,17 @@ exports[`DocumentCard renders DocumentCard correctly 1`] = `
               className="ms-Persona-initials ms-Persona-initials--blue undefined"
               style={undefined}
             >
-              <span>
-                
-              </span>
+              <i
+                aria-hidden={true}
+                aria-label={undefined}
+                className=
+                    ms-Icon
+                    {
+                      display: inline-block;
+                    }
+                data-icon-name="Contact"
+                role="presentation"
+              />
             </div>
             <div
               className="ms-Image ms-Persona-image"
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
index 953a2a3ebd97f..f526506133350 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
@@ -198,7 +198,9 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
     imageInitials = imageInitials || getInitials(primaryText, isRTL);
 
     return (
-      <span>{ imageInitials }</span>
+      imageInitials !== '' ?
+        <span>{ imageInitials }</span> :
+        <Icon iconName='Contact' />
     );
   }
 

From a879a83f4ba55a12eb5d9fe247dfa7208637433a Mon Sep 17 00:00:00 2001
From: Eddie Liu <leddie24@gmail.com>
Date: Thu, 16 Nov 2017 21:29:40 -0800
Subject: [PATCH 1038/1641] ScrollablePane: Fix sortStickies to sort stickies
 by their correct parentElement (#2970)

* Fix sortStickies.  Change to find correct offset parent of scrollablePane root

* Add change file

* Change to calculateOffsetParent
---
 ...iu-fix-offsetparent-sort_2017-09-27-18-10.json | 11 +++++++++++
 .../components/ScrollablePane/ScrollablePane.tsx  | 15 ++++++++++++++-
 2 files changed, 25 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-edwliu-fix-offsetparent-sort_2017-09-27-18-10.json

diff --git a/common/changes/office-ui-fabric-react/v-edwliu-fix-offsetparent-sort_2017-09-27-18-10.json b/common/changes/office-ui-fabric-react/v-edwliu-fix-offsetparent-sort_2017-09-27-18-10.json
new file mode 100644
index 0000000000000..86257bf3425dc
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-edwliu-fix-offsetparent-sort_2017-09-27-18-10.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ScrollablePane: Fix sortStickies function to sort elements by their true offsetTop in respect to scrollablePane's root",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-edwliu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
index 317484d1a3994..5641de3d0b3a0 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
@@ -209,7 +209,9 @@ export class ScrollablePane extends BaseComponent<IScrollablePaneProps, {}> impl
   private _sortStickies(stickyList: Set<Sticky>, container: HTMLElement): void {
     let stickyArr = Array.from(stickyList);
     stickyArr = stickyArr.sort((a, b) => {
-      return a.refs.root.offsetTop - b.refs.root.offsetTop;
+      const aOffset = this._calculateOffsetParent(a.refs.root);
+      const bOffset = this._calculateOffsetParent(b.refs.root);
+      return aOffset - bOffset;
     });
     while (container.lastChild) {
       container.removeChild(container.lastChild);
@@ -218,4 +220,15 @@ export class ScrollablePane extends BaseComponent<IScrollablePaneProps, {}> impl
       container.appendChild(sticky.content);
     });
   }
+
+  private _calculateOffsetParent(ele: HTMLElement): number {
+    let offset = 0;
+    while (ele.offsetParent !== this.refs.root.offsetParent) {
+      offset += ele.offsetTop;
+      if (ele.parentElement) {
+        ele = ele.parentElement;
+      }
+    }
+    return offset;
+  }
 }
\ No newline at end of file

From 366f0dad1094a55527e1da69242dfe788cfe3a1c Mon Sep 17 00:00:00 2001
From: Nirmala <nirmalar@microsoft.com>
Date: Thu, 16 Nov 2017 21:41:54 -0800
Subject: [PATCH 1039/1641] Rating control with Button and added halfstar,
 readonly support (#2937)

* Rating control with Button and added halfstar, readonly support

* Addressing PR comments

* Adding rating examples

* Updating Rating component Aria-label to be passed by parent

* Resolve PR comments

* Update Test file expect.to.be to expect.Equals

* Remove EnableHalfStar Prop

* Update Rating star jest snapshot

* Changing cursor for hover. Cleaning the display of focus zone

* Fixing screener test

* Update Rating.tsx

* Update Rating.tsx

* Removing string hardcoding

* Updating snap file for string

* Fixing test
---
 apps/vr-tests/src/stories/Rating.stories.tsx  |   4 +-
 ...lar-ratingWithButton_2017-09-25-07-23.json |  11 +
 .../src/components/Rating/Rating.scss         | 138 +++-----
 .../src/components/Rating/Rating.test.tsx     | 133 ++++++--
 .../src/components/Rating/Rating.tsx          | 158 ++++-----
 .../src/components/Rating/Rating.types.ts     |  21 +-
 .../Rating/__snapshots__/Rating.test.tsx.snap | 320 ++++++++++--------
 .../Rating/examples/Rating.Basic.Example.tsx  |  68 +++-
 8 files changed, 502 insertions(+), 351 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-nirmalar-ratingWithButton_2017-09-25-07-23.json

diff --git a/apps/vr-tests/src/stories/Rating.stories.tsx b/apps/vr-tests/src/stories/Rating.stories.tsx
index fec7f5943db0a..280bfdbddbb5a 100644
--- a/apps/vr-tests/src/stories/Rating.stories.tsx
+++ b/apps/vr-tests/src/stories/Rating.stories.tsx
@@ -11,8 +11,8 @@ storiesOf('Rating', module)
     <Screener
       steps={ new Screener.Steps()
         .snapshot('default', { cropTo: '.testWrapper' })
-        .hover('div.ms-Rating-star:nth-of-type(2)')
-        .snapshot('hover', { cropTo: '.testWrapper' })
+        .click('button.ms-Rating-button:nth-of-type(2)')
+        .snapshot('click', { cropTo: '.testWrapper' })
         .end()
       }
     >
diff --git a/common/changes/office-ui-fabric-react/users-nirmalar-ratingWithButton_2017-09-25-07-23.json b/common/changes/office-ui-fabric-react/users-nirmalar-ratingWithButton_2017-09-25-07-23.json
new file mode 100644
index 0000000000000..45d728a79d9f1
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-nirmalar-ratingWithButton_2017-09-25-07-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Rating control implementation using button, Half star support and ReadOnly rating control support",
+      "type": "major"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "nirmalar@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.scss b/packages/office-ui-fabric-react/src/components/Rating/Rating.scss
index f9a11d03d16ee..b1feebd3460c5 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.scss
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.scss
@@ -2,117 +2,69 @@
 
 $Rating-defaultColor: $ms-color-neutralTertiary;
 $Rating-selectedColor: $ms-color-black;
-$Rating-hoverColor: $ms-color-themeDarkAlt;
 $Rating-disabledColor: $ms-color-neutralTertiaryAlt;
 
 $Rating-smallIconSize: 16px;
 $Rating-largeIconSize: 20px;
 
-// Hide input field
-.input {
-  position: absolute;
-  opacity: 0;
-  top: 0px;
-}
-
-.container {
-  position: relative;
+.ratingStar {
   display: inline-block;
+  position: relative;
+}
 
-  &:hover {
-    .star:not(.starIsDisabled) {
-      color: $Rating-selectedColor;
-
-      @include high-contrast {
-        color: HighlightText;
-        background-color: Highlight;
-        -ms-high-contrast-adjust: none;
-      }
-
-      &.star:hover {
-        color: $Rating-hoverColor;
-
-        @include high-contrast {
-          color: HighlightText;
-        }
-
-        & ~ .star {
-          // Set default color for any star after hovered one
-          color: $Rating-defaultColor;
-
-          @include high-contrast {
-            color: GrayText;
-            background-color: Window;
-          }
-        }
-      }
-    }
-  }
-
-  .star {
-    display: inline-block;
-
-    text-align: center;
-
-    color: $Rating-defaultColor;
+.ratingStarBack {
+  color: $Rating-defaultColor;
+  width: 100%;
 
+  &.ratingStarDisabled {
+    color: $Rating-disabledColor;
     @include high-contrast {
-      color: WindowText;
-      -ms-high-contrast-adjust: none;
-    }
-
-    &.starIsSelected {
-      color: $Rating-selectedColor;
-
-      @include high-contrast {
-        color: HighlightText;
-        background-color: Highlight;
-        -ms-high-contrast-adjust: none;
-      }
-    }
-
-    &.starIsDisabled {
-      color: $Rating-disabledColor;
-
-      @include high-contrast {
-        color: GrayText;
-        background-color: Window;
-      }
-
-      .label {
-        cursor: default;
-      }
+      color: GrayText;
     }
+  }
+}
 
-    .label {
-      display: inline-block;
-      cursor: pointer;
-
-      font-size: $Rating-smallIconSize;
-      padding: 12px 0px;
-
-      // Reserve space for focus styling
-      border: 1px solid transparent;
+.ratingStarFront {
+  position: absolute;
+  height: 100%;
+  left: 0;
+  top: 0;
+  text-align: center;
+  vertical-align: middle;
+  overflow: hidden;
+  color: $Rating-selectedColor;
+  @include high-contrast {
+    color: Highlight;
+  }
+}
 
-      @include high-contrast {
-        border-color: Window;
-      }
-    }
+.ratingButton {
+  background: none;
+  margin: 3px 3px 0px 0px;
+  padding: 0px;
+  border: none;
+  cursor: pointer;
+  
+  &:disabled, &[disabled] {
+	cursor: default;
   }
+}
 
-  .rootIsLarge & {
-    .label {
-      font-size: $Rating-largeIconSize;
-      padding: 6px 2px 9px 2px;
-    }
+.rootIsSmall  {
+    font-size: $Rating-smallIconSize;
+    line-height: $Rating-smallIconSize;
   }
+
+.rootIsLarge  {
+    font-size: $Rating-largeIconSize;
+    line-height: $Rating-largeIconSize;
 }
 
 .labelText {
   @include ms-screenReaderOnly();
 }
 
-// Highlight focused star
-:global(.ms-Fabric.is-focusVisible) .starIsInFocus .label {
-  border: 1px solid $focusBorderColor;
-}
+.ratingFocusZone {
+  display: inline-block;
+  padding-bottom: 1px;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx b/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
index 010edd5344dd3..667ae995ee733 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
@@ -30,28 +30,30 @@ describe('Rating', () => {
       threwException = true;
     }
     expect(threwException).toEqual(false);
-
     let renderedDOM = ReactDOM.findDOMNode(rating as React.ReactInstance);
 
-    let ratingInputs = renderedDOM.querySelectorAll('.ms-Rating-input');
+    let ratingButtons = renderedDOM.querySelectorAll('.ms-Rating-button');
+    let ratingFrontStars = renderedDOM.querySelectorAll('.ms-RatingStar-front');
 
-    const checkState = (ratingToCheck: number, state: boolean) => {
-      expect((ratingInputs[ratingToCheck - 1] as HTMLInputElement).checked).toEqual(state);
+    const checkState = (ratingToCheck: number, state: string) => {
+      let iconElement = ratingFrontStars[ratingToCheck - 1] as HTMLElement;
+      let width = iconElement.style.width;
+      expect(width).toEqual(state);
     };
 
-    checkState(1, false);
-    checkState(2, true);
-    checkState(3, false);
-    checkState(4, false);
-    checkState(5, false);
+    checkState(1, '100%');
+    checkState(2, '100%');
+    checkState(3, '0%');
+    checkState(4, '0%');
+    checkState(5, '0%');
 
-    ReactTestUtils.Simulate.change(ratingInputs[0]);
+    ReactTestUtils.Simulate.focus(ratingButtons[0]);
 
-    checkState(1, true);
-    checkState(2, false);
-    checkState(3, false);
-    checkState(4, false);
-    checkState(5, false);
+    checkState(1, '100%');
+    checkState(2, '0%');
+    checkState(3, '0%');
+    checkState(4, '0%');
+    checkState(5, '0%');
   });
 
   it('Clamps input rating to allowed range.', () => {
@@ -72,13 +74,54 @@ describe('Rating', () => {
 
     let renderedDOM = ReactDOM.findDOMNode(rating as React.ReactInstance);
 
-    let ratingInputs = renderedDOM.querySelectorAll('.ms-Rating-input');
+    let ratingFrontStars = renderedDOM.querySelectorAll('.ms-RatingStar-front');
+
+    const checkState = (ratingToCheck: number, state: string) => {
+      let iconElement = ratingFrontStars[ratingToCheck - 1] as HTMLElement;
+      let width = iconElement.style.width;
+      expect(width).toEqual(state);
+    };
+
+    expect(ratingFrontStars.length).toEqual(5);
+    checkState(1, '100%');
+    checkState(2, '100%');
+    checkState(3, '100%');
+    checkState(4, '100%');
+    checkState(5, '100%');
+
+  });
+
+  it('Half star is displayed when 2.5 value is passed.', () => {
+    let exception;
+    let threwException = false;
+    let rating;
+    try {
+      rating = ReactTestUtils.renderIntoDocument<Rating>(
+        <Rating
+          rating={ 2.5 }
+        />
+      );
+    } catch (e) {
+      exception = e;
+      threwException = true;
+    }
+    expect(threwException).toEqual(false);
+
+    let renderedDOM = ReactDOM.findDOMNode(rating as React.ReactInstance);
+    let ratingFrontStars = renderedDOM.querySelectorAll('.ms-RatingStar-front');
+
+    const checkState = (ratingToCheck: number, state: string) => {
+      let iconElement = ratingFrontStars[ratingToCheck - 1] as HTMLElement;
+      let width = iconElement.style.width;
+      expect(width).toEqual(state);
+    };
+
+    checkState(1, '100%');
+    checkState(2, '100%');
+    checkState(3, '50%');
+    checkState(4, '0%');
+    checkState(5, '0%');
 
-    expect((ratingInputs[0] as HTMLInputElement).checked).toEqual(false);
-    expect((ratingInputs[1] as HTMLInputElement).checked).toEqual(false);
-    expect((ratingInputs[2] as HTMLInputElement).checked).toEqual(false);
-    expect((ratingInputs[3] as HTMLInputElement).checked).toEqual(false);
-    expect((ratingInputs[4] as HTMLInputElement).checked).toEqual(true);
   });
 
   it('When rating is disabled cannot change rating', () => {
@@ -98,11 +141,53 @@ describe('Rating', () => {
     expect(threwException).toEqual(false);
 
     let renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
-    let choiceOptions = renderedDOM.querySelectorAll('.ms-Rating-input');
+    let ratingButtons = renderedDOM.querySelectorAll('.ms-Rating-button');
+    expect((ratingButtons[0] as HTMLButtonElement).disabled).toEqual(true);
+    expect((ratingButtons[1] as HTMLButtonElement).disabled).toEqual(true);
+    expect((ratingButtons[2] as HTMLButtonElement).disabled).toEqual(true);
+    expect((ratingButtons[3] as HTMLButtonElement).disabled).toEqual(true);
+    expect((ratingButtons[4] as HTMLButtonElement).disabled).toEqual(true);
+
+  });
+
+  it('When rating is readonly cannot change rating', () => {
+    let exception;
+    let threwException = false;
+    let choiceGroup;
+    try {
+      choiceGroup = ReactTestUtils.renderIntoDocument<Rating>(
+        <Rating
+          readOnly={ true }
+          rating={ 2 }
+        />
+      );
+    } catch (e) {
+      exception = e;
+      threwException = true;
 
-    for (let i = 0; i < 5; ++i) {
-      expect((choiceOptions[i] as HTMLInputElement).disabled).toEqual(true);
     }
+    expect(threwException).toEqual(false);
+
+    let renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
+    let ratingButtons = renderedDOM.querySelectorAll('.ms-Rating-button');
+    expect((ratingButtons[0] as HTMLButtonElement).disabled).toEqual(true);
+    expect((ratingButtons[1] as HTMLButtonElement).disabled).toEqual(true);
+    expect((ratingButtons[2] as HTMLButtonElement).disabled).toEqual(true);
+    expect((ratingButtons[3] as HTMLButtonElement).disabled).toEqual(true);
+    expect((ratingButtons[4] as HTMLButtonElement).disabled).toEqual(true);
+
+    let ratingFrontStars = renderedDOM.querySelectorAll('.ms-RatingStar-front');
+    const checkState = (ratingToCheck: number, state: string) => {
+      let iconElement = ratingFrontStars[ratingToCheck - 1] as HTMLElement;
+      let width = iconElement.style.width;
+      expect(width).toEqual(state);
+    };
+
+    checkState(1, '100%');
+    checkState(2, '100%');
+    checkState(3, '0%');
+    checkState(4, '0%');
+    checkState(5, '0%');
   });
 
 });
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx b/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
index 2548f086097f4..dc4c1960f7a6e 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
@@ -5,21 +5,48 @@ import {
   getId
 } from '../../Utilities';
 import { Icon } from '../../Icon';
+import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { IRatingProps, RatingSize } from './Rating.types';
 import * as stylesImport from './Rating.scss';
+import { format } from '../../Utilities';
+
 const styles: any = stylesImport;
 
+interface IRatingStarProps extends React.AllHTMLAttributes<HTMLElement> {
+  fillPercentage: number;
+  disabled: boolean;
+}
+
 export interface IRatingState {
   rating: number | null | undefined;
-  focusedRating: number | null;
 }
 
+const RatingStar = (props: IRatingStarProps) => (
+  <div
+    className={ css('ms-RatingStar-container', styles.ratingStar) }
+    key={ props.id }
+  >
+    <Icon
+      className={ css('ms-RatingStar-back', styles.ratingStarBack, {
+        ['is-disabled ' + styles.ratingStarDisabled]: props.disabled
+      }) }
+      iconName='FavoriteStarFill'
+    />
+    { !props.disabled &&
+      <Icon
+        className={ css('ms-RatingStar-front', styles.ratingStarFront) }
+        iconName='FavoriteStarFill'
+        style={ { width: props.fillPercentage + '%' } }
+      />
+    }
+  </div>
+);
+
 export class Rating extends BaseComponent<IRatingProps, IRatingState> {
   public static defaultProps: IRatingProps = {
     min: 1,
     max: 5
   };
-
   private _id: string;
   private _labelId: string;
 
@@ -27,8 +54,7 @@ export class Rating extends BaseComponent<IRatingProps, IRatingState> {
     super(props);
 
     this.state = {
-      rating: this._getInitialValue(props),
-      focusedRating: null
+      rating: this._getInitialValue(props)
     };
 
     this._id = getId('Rating');
@@ -44,106 +70,72 @@ export class Rating extends BaseComponent<IRatingProps, IRatingState> {
   }
 
   public render() {
-    let stars: JSX.Element[] = [];
-    for (let i = this.props.min as number; i <= (this.props.max as number); ++i) {
-      stars.push(this._renderStar(i));
+    let stars = [];
+
+    for (let i = this.props.min as number; i <= (this.props.max as number); i++) {
+      let ratingStarProps: IRatingStarProps = {
+        fillPercentage: this._getFillingPercentage(i),
+        disabled: this.props.disabled ? true : false
+      };
+
+      stars.push(
+        <button
+          className={ css('ms-Rating-button', styles.ratingButton, {
+            ['ms-Rating--large ' + styles.rootIsLarge]: this.props.size === RatingSize.Large,
+            ['ms-Rating--small ' + styles.rootIsSmall]: this.props.size !== RatingSize.Large
+          }) }
+          key={ i }
+          { ...((i === Math.ceil(this.state.rating as number)) ? { 'data-is-current': true } : {}) }
+          onFocus={ this._onFocus.bind(this, i) }
+          disabled={ this.props.disabled || this.props.readOnly ? true : false }
+          role='presentation'
+        >
+          { this._getLabel(i) }
+          <RatingStar key={ i + 'rating' }  {...ratingStarProps} />
+        </button>
+      );
     }
 
     return (
       <div
-        className={ css('ms-Rating', this.props.className, {
-          ['ms-Rating--large ' + styles.rootIsLarge]: this.props.size === RatingSize.Large
-        }) }
-        role='application'
+        className={ css('ms-Rating-star') }
+        aria-label={ this.props.getAriaLabel ? this.props.getAriaLabel(this.state.rating ? this.state.rating : 0, this.props.max as number) : '' }
       >
-        <div className={ css('ms-Rating-container', styles.container) } role='radiogroup' aria-labelledby={ this.props.ariaLabelId }>
+        <FocusZone
+          direction={ FocusZoneDirection.horizontal }
+          tabIndex={ this.props.readOnly ? 0 : -1 }
+          className={ css('ms-Rating-focuszone', styles.ratingFocusZone) }
+        >
           { stars }
-        </div>
-      </div>
-    );
-  }
-
-  private _renderStar(rating: number): JSX.Element {
-    const inputId = `${this._id}-${rating}`;
-
-    return (
-      <div
-        className={ css('ms-Rating-star', styles.star, {
-          ['is-selected ' + styles.starIsSelected]: rating <= (this.state.rating as number),
-          ['is-inFocus ' + styles.starIsInFocus]: rating === this.state.focusedRating,
-          ['is-disabled ' + styles.starIsDisabled]: this.props.disabled
-        }) }
-        key={ rating }
-      >
-        <input
-          className={ css('ms-Rating-input', styles.input) }
-          type='radio'
-          name={ this._id }
-          id={ inputId }
-          value={ rating }
-          aria-labelledby={ `${this._labelId}-${rating}` }
-          disabled={ this.props.disabled }
-          checked={ rating === this.state.rating }
-          onChange={ this._onChange.bind(this, rating) }
-          onFocus={ this._onFocus.bind(this, rating) }
-          onBlur={ this._onBlur.bind(this, rating) }
-        />
-        <label className={ css('ms-Rating-label', styles.label) } htmlFor={ inputId }>
-          { this._getLabel(rating) }
-          { this._getIcon() }
-        </label>
+        </FocusZone>
       </div>
     );
   }
 
   private _onFocus(value: number, ev: React.FocusEvent<HTMLElement>): void {
     this.setState({
-      focusedRating: value
-    } as IRatingState);
-
-    if (this.props.onFocus) {
-      this.props.onFocus(ev);
-    }
-  }
-
-  private _onBlur(option: number, ev: React.FocusEvent<HTMLElement>): void {
-    this.setState({
-      focusedRating: null
-    } as IRatingState);
-
-    if (this.props.onBlur) {
-      this.props.onBlur(ev);
-    }
-  }
-
-  private _onChange(rating: number, evt: React.FormEvent<HTMLInputElement>) {
-    this.setState({
-      rating: rating
+      rating: value
     } as IRatingState);
 
     const { onChanged } = this.props;
     if (onChanged) {
-      onChanged(rating);
+      onChanged(value);
     }
   }
 
   private _getLabel(rating: number): JSX.Element {
-    const text = this.props.ariaLabelIcon || 'Star';
+    const text = this.props.ariaLabelFormat || '';
 
     return (
       <span
         id={ `${this._labelId}-${rating}` }
         className={ css('ms-Rating-labelText', styles.labelText) }
       >
-        { `${rating} ${text}` }
+        { format(text, rating, this.props.max) }
       </span>
     );
   }
 
-  private _getIcon(): JSX.Element {
-    return <Icon iconName={ this.props.icon || 'favoriteStarFill' } />;
-  }
-
   private _getInitialValue(props: IRatingProps) {
     if (typeof props.rating === 'undefined') {
       return props.min;
@@ -157,8 +149,20 @@ export class Rating extends BaseComponent<IRatingProps, IRatingState> {
   }
 
   private _getClampedRating(rating: number): number {
-    rating = Math.floor(rating);
-
     return Math.min(Math.max(rating, this.props.min as number), this.props.max as number);
   }
-}
\ No newline at end of file
+
+  private _getFillingPercentage(starPosition: number): number {
+    let ceilValue = Math.ceil((this.state.rating as number));
+    let fillPercentage = 100;
+
+    if (starPosition === this.state.rating) {
+      fillPercentage = 100;
+    } else if (starPosition === ceilValue) {
+      fillPercentage = 100 * (this.state.rating as number % 1);
+    } else if (starPosition > ceilValue) {
+      fillPercentage = 0;
+    }
+    return fillPercentage;
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.types.ts b/packages/office-ui-fabric-react/src/components/Rating/Rating.types.ts
index 3fdf909294fc3..e12af1a32bb40 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.types.ts
@@ -45,17 +45,30 @@ export interface IRatingProps extends React.AllHTMLAttributes<HTMLElement> {
   onChanged?: (rating: number) => void;
 
   /**
-   * Optional label for star ratings, will be read by screen readers, defaults to 'Star'.
+   * Optional label format for star ratings, will be read by screen readers, defaults to ''.
+   * Can be used like "{0} of {1} stars selected".
+   * Where {0} will be subsituted by the current rating and {1} will be subsituted by the max rating.
    */
-  ariaLabelIcon?: string;
+  ariaLabelFormat?: string;
 
   /**
-   * Optional id of label describing this instance of Rating
+   * Deprecated: Optional id of label describing this instance of Rating. Instead of this use getArialabel
+   * @deprecated
    */
   ariaLabelId?: string;
+
+  /**
+   * Optional flag to mark rating control as readOnly
+   */
+  readOnly?: boolean;
+
+  /*
+  * Optional callback to set the arialabel for rating control.
+  */
+  getAriaLabel?: (rating: number, max: number) => string;
 }
 
 export enum RatingSize {
   Small = 0,
   Large = 1
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap
index c0081089036b9..51c2d080a6bdb 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap
@@ -2,209 +2,251 @@
 
 exports[`Rating Renders Rating correctly 1`] = `
 <div
-  className="ms-Rating"
-  role="application"
+  aria-label=""
+  className="ms-Rating-star"
 >
   <div
+    aria-describedby={undefined}
     aria-labelledby={undefined}
-    className="ms-Rating-container"
-    role="radiogroup"
+    className="ms-FocusZone ms-Rating-focuszone"
+    data-focuszone-id="FocusZone2"
+    onFocus={[Function]}
+    onKeyDown={[Function]}
+    onMouseDownCapture={[Function]}
+    role="presentation"
+    tabIndex={-1}
   >
-    <div
-      className="ms-Rating-star is-selected undefined"
+    <button
+      className="ms-Rating-button ms-Rating--small undefined"
+      data-is-current={true}
+      disabled={false}
+      onFocus={[Function]}
+      role="presentation"
     >
-      <input
-        aria-labelledby="RatingLabel1-1"
-        checked={true}
-        className="ms-Rating-input"
-        disabled={undefined}
-        id="Rating0-1"
-        name="Rating0"
-        onBlur={[Function]}
-        onChange={[Function]}
-        onFocus={[Function]}
-        type="radio"
-        value={1}
-      />
-      <label
-        className="ms-Rating-label"
-        htmlFor="Rating0-1"
+      <span
+        className="ms-Rating-labelText"
+        id="RatingLabel1-1"
       >
-        <span
-          className="ms-Rating-labelText"
-          id="RatingLabel1-1"
-        >
-          1 Star
-        </span>
+        
+      </span>
+      <div
+        className="ms-RatingStar-container"
+      >
+        <i
+          aria-hidden={true}
+          aria-label={undefined}
+          className=
+              ms-Icon
+              ms-RatingStar-back
+              {
+                display: inline-block;
+              }
+          data-icon-name="FavoriteStarFill"
+          role="presentation"
+        />
         <i
           aria-hidden={true}
           aria-label={undefined}
           className=
               ms-Icon
+              ms-RatingStar-front
               {
                 display: inline-block;
               }
-          data-icon-name="favoriteStarFill"
+          data-icon-name="FavoriteStarFill"
           role="presentation"
+          style={
+            Object {
+              "width": "100%",
+            }
+          }
         />
-      </label>
-    </div>
-    <div
-      className="ms-Rating-star"
+      </div>
+    </button>
+    <button
+      className="ms-Rating-button ms-Rating--small undefined"
+      disabled={false}
+      onFocus={[Function]}
+      role="presentation"
     >
-      <input
-        aria-labelledby="RatingLabel1-2"
-        checked={false}
-        className="ms-Rating-input"
-        disabled={undefined}
-        id="Rating0-2"
-        name="Rating0"
-        onBlur={[Function]}
-        onChange={[Function]}
-        onFocus={[Function]}
-        type="radio"
-        value={2}
-      />
-      <label
-        className="ms-Rating-label"
-        htmlFor="Rating0-2"
+      <span
+        className="ms-Rating-labelText"
+        id="RatingLabel1-2"
       >
-        <span
-          className="ms-Rating-labelText"
-          id="RatingLabel1-2"
-        >
-          2 Star
-        </span>
+        
+      </span>
+      <div
+        className="ms-RatingStar-container"
+      >
+        <i
+          aria-hidden={true}
+          aria-label={undefined}
+          className=
+              ms-Icon
+              ms-RatingStar-back
+              {
+                display: inline-block;
+              }
+          data-icon-name="FavoriteStarFill"
+          role="presentation"
+        />
         <i
           aria-hidden={true}
           aria-label={undefined}
           className=
               ms-Icon
+              ms-RatingStar-front
               {
                 display: inline-block;
               }
-          data-icon-name="favoriteStarFill"
+          data-icon-name="FavoriteStarFill"
           role="presentation"
+          style={
+            Object {
+              "width": "0%",
+            }
+          }
         />
-      </label>
-    </div>
-    <div
-      className="ms-Rating-star"
+      </div>
+    </button>
+    <button
+      className="ms-Rating-button ms-Rating--small undefined"
+      disabled={false}
+      onFocus={[Function]}
+      role="presentation"
     >
-      <input
-        aria-labelledby="RatingLabel1-3"
-        checked={false}
-        className="ms-Rating-input"
-        disabled={undefined}
-        id="Rating0-3"
-        name="Rating0"
-        onBlur={[Function]}
-        onChange={[Function]}
-        onFocus={[Function]}
-        type="radio"
-        value={3}
-      />
-      <label
-        className="ms-Rating-label"
-        htmlFor="Rating0-3"
+      <span
+        className="ms-Rating-labelText"
+        id="RatingLabel1-3"
+      >
+        
+      </span>
+      <div
+        className="ms-RatingStar-container"
       >
-        <span
-          className="ms-Rating-labelText"
-          id="RatingLabel1-3"
-        >
-          3 Star
-        </span>
         <i
           aria-hidden={true}
           aria-label={undefined}
           className=
               ms-Icon
+              ms-RatingStar-back
               {
                 display: inline-block;
               }
-          data-icon-name="favoriteStarFill"
+          data-icon-name="FavoriteStarFill"
           role="presentation"
         />
-      </label>
-    </div>
-    <div
-      className="ms-Rating-star"
+        <i
+          aria-hidden={true}
+          aria-label={undefined}
+          className=
+              ms-Icon
+              ms-RatingStar-front
+              {
+                display: inline-block;
+              }
+          data-icon-name="FavoriteStarFill"
+          role="presentation"
+          style={
+            Object {
+              "width": "0%",
+            }
+          }
+        />
+      </div>
+    </button>
+    <button
+      className="ms-Rating-button ms-Rating--small undefined"
+      disabled={false}
+      onFocus={[Function]}
+      role="presentation"
     >
-      <input
-        aria-labelledby="RatingLabel1-4"
-        checked={false}
-        className="ms-Rating-input"
-        disabled={undefined}
-        id="Rating0-4"
-        name="Rating0"
-        onBlur={[Function]}
-        onChange={[Function]}
-        onFocus={[Function]}
-        type="radio"
-        value={4}
-      />
-      <label
-        className="ms-Rating-label"
-        htmlFor="Rating0-4"
+      <span
+        className="ms-Rating-labelText"
+        id="RatingLabel1-4"
+      >
+        
+      </span>
+      <div
+        className="ms-RatingStar-container"
       >
-        <span
-          className="ms-Rating-labelText"
-          id="RatingLabel1-4"
-        >
-          4 Star
-        </span>
         <i
           aria-hidden={true}
           aria-label={undefined}
           className=
               ms-Icon
+              ms-RatingStar-back
               {
                 display: inline-block;
               }
-          data-icon-name="favoriteStarFill"
+          data-icon-name="FavoriteStarFill"
           role="presentation"
         />
-      </label>
-    </div>
-    <div
-      className="ms-Rating-star"
+        <i
+          aria-hidden={true}
+          aria-label={undefined}
+          className=
+              ms-Icon
+              ms-RatingStar-front
+              {
+                display: inline-block;
+              }
+          data-icon-name="FavoriteStarFill"
+          role="presentation"
+          style={
+            Object {
+              "width": "0%",
+            }
+          }
+        />
+      </div>
+    </button>
+    <button
+      className="ms-Rating-button ms-Rating--small undefined"
+      disabled={false}
+      onFocus={[Function]}
+      role="presentation"
     >
-      <input
-        aria-labelledby="RatingLabel1-5"
-        checked={false}
-        className="ms-Rating-input"
-        disabled={undefined}
-        id="Rating0-5"
-        name="Rating0"
-        onBlur={[Function]}
-        onChange={[Function]}
-        onFocus={[Function]}
-        type="radio"
-        value={5}
-      />
-      <label
-        className="ms-Rating-label"
-        htmlFor="Rating0-5"
+      <span
+        className="ms-Rating-labelText"
+        id="RatingLabel1-5"
       >
-        <span
-          className="ms-Rating-labelText"
-          id="RatingLabel1-5"
-        >
-          5 Star
-        </span>
+        
+      </span>
+      <div
+        className="ms-RatingStar-container"
+      >
+        <i
+          aria-hidden={true}
+          aria-label={undefined}
+          className=
+              ms-Icon
+              ms-RatingStar-back
+              {
+                display: inline-block;
+              }
+          data-icon-name="FavoriteStarFill"
+          role="presentation"
+        />
         <i
           aria-hidden={true}
           aria-label={undefined}
           className=
               ms-Icon
+              ms-RatingStar-front
               {
                 display: inline-block;
               }
-          data-icon-name="favoriteStarFill"
+          data-icon-name="FavoriteStarFill"
           role="presentation"
+          style={
+            Object {
+              "width": "0%",
+            }
+          }
         />
-      </label>
-    </div>
+      </div>
+    </button>
   </div>
 </div>
 `;
diff --git a/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx
index 50be4bca60c55..471112c390177 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx
@@ -12,7 +12,9 @@ export class RatingBasicExample extends React.Component<any, any> {
     super();
 
     this.state = {
-      rating: null
+      largeStarRating: null,
+      smallStarRating: null,
+      tenStarRating: null
     };
   }
 
@@ -20,33 +22,44 @@ export class RatingBasicExample extends React.Component<any, any> {
   public render() {
     return (
       <div className='ms-RatingBasicExample'>
+        Large Stars:
         <Rating
+          id={ 'largeRatingStar' }
           min={ 1 }
           max={ 5 }
-          rating={ this.state.rating }
-          onChanged={ this._onChanged }
+          size={ RatingSize.Large }
+          rating={ this.state.largeStarRating }
+          getAriaLabel={ this._getRatingComponentAriaLabel }
+          onChanged={ this._onLargeStarChanged }
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
+          ariaLabelFormat={ '{0} of {1} stars selected' }
         />
 
+        Small Stars
         <Rating
+          id={ 'smallRatingStar' }
           min={ 1 }
           max={ 5 }
-          size={ RatingSize.Large }
-          rating={ this.state.rating }
-          onChanged={ this._onChanged }
+          rating={ this.state.smallStarRating }
+          onChanged={ this._onSmallStarChanged }
+          getAriaLabel={ this._getRatingComponentAriaLabel }
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
+          ariaLabelFormat={ '{0} of {1} stars selected' }
         />
 
+        10 Small Stars
         <Rating
+          id={ 'tenRatingStar' }
           min={ 1 }
           max={ 10 }
-          size={ RatingSize.Large }
-          rating={ this.state.rating }
-          onChanged={ this._onChanged }
+          rating={ this.state.tenStarRating }
+          onChanged={ this._onTenStarChanged }
+          getAriaLabel={ this._getRatingComponentAriaLabel }
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
+          ariaLabelFormat={ '{0} of {1} stars selected' }
         />
 
         Disabled:
@@ -54,19 +67,50 @@ export class RatingBasicExample extends React.Component<any, any> {
           min={ 1 }
           max={ 5 }
           rating={ this.state.rating }
-          onChanged={ this._onChanged }
           disabled={ true }
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
+          ariaLabelFormat={ '{0} of {1} stars selected' }
+        />
+
+        Half star in readOnly mode:
+        <Rating
+          id={ 'readOnlyRatingStar' }
+          min={ 1 }
+          max={ 5 }
+          rating={ 2.5 }
+          getAriaLabel={ this._getRatingComponentAriaLabel }
+          readOnly={ true }
+          ariaLabelFormat={ '{0} of {1} stars selected' }
         />
       </div>
     );
   }
 
   @autobind
-  private _onChanged(rating: number) {
+  private _onLargeStarChanged(rating: number) {
     this.setState({
-      rating: rating
+      largeStarRating: rating
     });
   }
+
+  @autobind
+  private _onSmallStarChanged(rating: number) {
+    this.setState({
+      smallStarRating: rating
+    });
+  }
+
+  @autobind
+  private _onTenStarChanged(rating: number) {
+    this.setState({
+      tenStarRating: rating
+    });
+  }
+
+  private _getRatingComponentAriaLabel(rating: number, maxRating: number) {
+
+    return 'Rating value is ' + rating + ' of ' + maxRating;
+
+  }
 }

From 48766c08ef17a1ec9a1d020836820bbb47a7b4dd Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 17 Nov 2017 09:26:09 -0800
Subject: [PATCH 1040/1641] Fixing change file.

---
 .../users-nirmalar-ratingWithButton_2017-09-25-07-23.json       | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/common/changes/office-ui-fabric-react/users-nirmalar-ratingWithButton_2017-09-25-07-23.json b/common/changes/office-ui-fabric-react/users-nirmalar-ratingWithButton_2017-09-25-07-23.json
index 45d728a79d9f1..9bae63ec298ab 100644
--- a/common/changes/office-ui-fabric-react/users-nirmalar-ratingWithButton_2017-09-25-07-23.json
+++ b/common/changes/office-ui-fabric-react/users-nirmalar-ratingWithButton_2017-09-25-07-23.json
@@ -3,7 +3,7 @@
     {
       "packageName": "office-ui-fabric-react",
       "comment": "Rating control implementation using button, Half star support and ReadOnly rating control support",
-      "type": "major"
+      "type": "minor"
     }
   ],
   "packageName": "office-ui-fabric-react",

From c820a134ec010ed7e87fc986acc6afdccfc48854 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 17 Nov 2017 09:27:16 -0800
Subject: [PATCH 1041/1641] Bumping styling to unblock publishing.

---
 packages/styling/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/styling/package.json b/packages/styling/package.json
index d8cb7ac1f2147..d28f056ff3c81 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.8.0",
+  "version": "5.9.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From f7b338870510956304e90e6214764e414011fb7e Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 17 Nov 2017 17:36:36 +0000
Subject: [PATCH 1042/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 19 ++++++
 apps/fabric-website/CHANGELOG.md              | 35 ++++++-----
 apps/fabric-website/package.json              |  4 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...watt-external-signal_2017-11-16-19-53.json | 11 ----
 ...ix-commandbar-growth_2017-11-16-21-50.json | 11 ----
 .../asset-license_2017-11-16-22-54.json       | 11 ----
 .../rename-props_2017-11-11-20-23.json        | 11 ----
 ...fault-font-functions_2017-11-15-00-15.json | 11 ----
 .../append_on_input_2017-11-09-05-23.json     | 11 ----
 ...nNoFocusSoAnchorWins_2017-11-13-11-41.json | 11 ----
 ...fix-header-ariapopup_2017-11-16-22-54.json | 11 ----
 ...litButtonRootExposed_2017-11-13-20-59.json | 11 ----
 .../patch-1_2017-11-15-23-16.json             | 11 ----
 ...ersona-coin-initials_2017-11-06-16-14.json | 11 ----
 ...lar-ratingWithButton_2017-09-25-07-23.json | 11 ----
 ...ix-offsetparent-sort_2017-09-27-18-10.json | 11 ----
 ...ow-oct-contrast-bugs_2017-11-02-21-34.json | 11 ----
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/CHANGELOG.json           | 26 ++++++++
 packages/experiments/CHANGELOG.md             | 13 +++-
 packages/experiments/package.json             |  4 +-
 packages/icons/package.json                   |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 61 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 20 +++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/CHANGELOG.json               | 14 +++++
 packages/styling/CHANGELOG.md                 |  9 ++-
 packages/styling/package.json                 |  2 +-
 32 files changed, 193 insertions(+), 184 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/brwatt-external-signal_2017-11-16-19-53.json
 delete mode 100644 common/changes/@uifabric/experiments/brwatt-fix-commandbar-growth_2017-11-16-21-50.json
 delete mode 100644 common/changes/@uifabric/fabric-website/asset-license_2017-11-16-22-54.json
 delete mode 100644 common/changes/@uifabric/fabric-website/rename-props_2017-11-11-20-23.json
 delete mode 100644 common/changes/@uifabric/styling/export-default-font-functions_2017-11-15-00-15.json
 delete mode 100644 common/changes/office-ui-fabric-react/append_on_input_2017-11-09-05-23.json
 delete mode 100644 common/changes/office-ui-fabric-react/detailsList-mouseDownNoFocusSoAnchorWins_2017-11-13-11-41.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-header-ariapopup_2017-11-16-22-54.json
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-SplitButtonRootExposed_2017-11-13-20-59.json
 delete mode 100644 common/changes/office-ui-fabric-react/patch-1_2017-11-15-23-16.json
 delete mode 100644 common/changes/office-ui-fabric-react/persona-coin-initials_2017-11-06-16-14.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-nirmalar-ratingWithButton_2017-09-25-07-23.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-edwliu-fix-offsetparent-sort_2017-09-27-18-10.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-oct-contrast-bugs_2017-11-02-21-34.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 6aab8fe21bab0..f1088fe0327ae 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.0.16",
+      "tag": "@uifabric/fabric-website_v5.0.16",
+      "date": "Fri, 17 Nov 2017 17:36:36 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "ad02795232194a76a6fc1468366d6ff1b030639b",
+            "comment": "Updated asset license to newest version."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.22.0 <6.0.0` to `>=5.23.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.15",
       "tag": "@uifabric/fabric-website_v5.0.15",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index f4357700bebf7..0a93203240d34 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Tue, 31 Oct 2017 10:22:25 GMT and should not be manually modified.
+This log was last generated on Fri, 17 Nov 2017 17:36:36 GMT and should not be manually modified.
+
+## 5.0.16
+Fri, 17 Nov 2017 17:36:36 GMT
+
+### Patches
+
+- Updated asset license to newest version.
 
 ## 5.0.15
 Tue, 31 Oct 2017 10:22:25 GMT
@@ -223,7 +230,7 @@ Tue, 27 Jun 2017 01:26:31 GMT
 ## 4.5.39
 Wed, 21 Jun 2017 00:45:41 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 4.5.38
 Wed, 14 Jun 2017 06:02:15 GMT
@@ -249,62 +256,62 @@ Mon, 12 Jun 2017 01:47:18 GMT
 ## 4.5.35
 Thu, 08 Jun 2017 00:18:05 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 4.5.34
 Tue, 06 Jun 2017 07:41:47 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 4.5.33
 Tue, 06 Jun 2017 06:06:46 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 4.5.32
 Tue, 06 Jun 2017 00:50:06 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 4.5.31
 Fri, 02 Jun 2017 01:19:36 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 4.5.30
 Thu, 01 Jun 2017 16:34:03 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 4.5.29
 Wed, 31 May 2017 01:58:23 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 4.5.28
 Tue, 30 May 2017 20:23:45 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 4.5.27
 Tue, 30 May 2017 03:27:20 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 4.5.26
 Fri, 26 May 2017 10:21:03 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 4.5.25
 Tue, 23 May 2017 10:16:04 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 4.5.24
 Thu, 18 May 2017 10:09:58 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 4.5.23
 Tue, 16 May 2017 21:47:38 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 950723992697d..660c746d523a2 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.0.15",
+  "version": "5.0.16",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.22.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.23.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 4d3e8c7d2f288..c37fb00040245 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.21.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.23.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index c49633dc4feb6..6facb9a1bab4e 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.21.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.23.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index b125cfb9a7b3f..ab39bf1087a9d 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.21.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.23.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index ed6f1d298cc62..196c2ebff1069 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.21.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.23.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/experiments/brwatt-external-signal_2017-11-16-19-53.json b/common/changes/@uifabric/experiments/brwatt-external-signal_2017-11-16-19-53.json
deleted file mode 100644
index e32ac2463a2ef..0000000000000
--- a/common/changes/@uifabric/experiments/brwatt-external-signal_2017-11-16-19-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Add external signal",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "brwatt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/brwatt-fix-commandbar-growth_2017-11-16-21-50.json b/common/changes/@uifabric/experiments/brwatt-fix-commandbar-growth_2017-11-16-21-50.json
deleted file mode 100644
index 49ebf1295fdfc..0000000000000
--- a/common/changes/@uifabric/experiments/brwatt-fix-commandbar-growth_2017-11-16-21-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Make sure commands get added/removed in the correct order",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "brwatt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/asset-license_2017-11-16-22-54.json b/common/changes/@uifabric/fabric-website/asset-license_2017-11-16-22-54.json
deleted file mode 100644
index 8d03cfdf824f1..0000000000000
--- a/common/changes/@uifabric/fabric-website/asset-license_2017-11-16-22-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Updated asset license to newest version.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/rename-props_2017-11-11-20-23.json b/common/changes/@uifabric/fabric-website/rename-props_2017-11-11-20-23.json
deleted file mode 100644
index 119379ee8c0a8..0000000000000
--- a/common/changes/@uifabric/fabric-website/rename-props_2017-11-11-20-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/export-default-font-functions_2017-11-15-00-15.json b/common/changes/@uifabric/styling/export-default-font-functions_2017-11-15-00-15.json
deleted file mode 100644
index e7faf1efdef88..0000000000000
--- a/common/changes/@uifabric/styling/export-default-font-functions_2017-11-15-00-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Export functions used to create font sets based upon a given locale code",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/append_on_input_2017-11-09-05-23.json b/common/changes/office-ui-fabric-react/append_on_input_2017-11-09-05-23.json
deleted file mode 100644
index 1f4a5c588fa22..0000000000000
--- a/common/changes/office-ui-fabric-react/append_on_input_2017-11-09-05-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "add suffix to TextField",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "scott.balentine@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/detailsList-mouseDownNoFocusSoAnchorWins_2017-11-13-11-41.json b/common/changes/office-ui-fabric-react/detailsList-mouseDownNoFocusSoAnchorWins_2017-11-13-11-41.json
deleted file mode 100644
index 4e574c8eff8b4..0000000000000
--- a/common/changes/office-ui-fabric-react/detailsList-mouseDownNoFocusSoAnchorWins_2017-11-13-11-41.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: mouse click gives preference to inner links.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-panu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-header-ariapopup_2017-11-16-22-54.json b/common/changes/office-ui-fabric-react/fix-header-ariapopup_2017-11-16-22-54.json
deleted file mode 100644
index 994f3163d07bf..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-header-ariapopup_2017-11-16-22-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsHeader: Accessibility fix, move aria-haspopup to correct element",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/malozano-SplitButtonRootExposed_2017-11-13-20-59.json b/common/changes/office-ui-fabric-react/malozano-SplitButtonRootExposed_2017-11-13-20-59.json
deleted file mode 100644
index 86ff84976da0f..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-SplitButtonRootExposed_2017-11-13-20-59.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SplitButton: Add splitFullActiveState to make the whole splitButton look active if true",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/patch-1_2017-11-15-23-16.json b/common/changes/office-ui-fabric-react/patch-1_2017-11-15-23-16.json
deleted file mode 100644
index 291753382fab2..0000000000000
--- a/common/changes/office-ui-fabric-react/patch-1_2017-11-15-23-16.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Nav: Added `onLinkExpandClick` callback for getting a callback when an item expanded state is toggled",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-jaebey@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/persona-coin-initials_2017-11-06-16-14.json b/common/changes/office-ui-fabric-react/persona-coin-initials_2017-11-06-16-14.json
deleted file mode 100644
index baf07d83af241..0000000000000
--- a/common/changes/office-ui-fabric-react/persona-coin-initials_2017-11-06-16-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "PersonaCoin: For non-latin characters, if initials return an empty string, use the Contact icon instead of the empty string.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/users-nirmalar-ratingWithButton_2017-09-25-07-23.json b/common/changes/office-ui-fabric-react/users-nirmalar-ratingWithButton_2017-09-25-07-23.json
deleted file mode 100644
index 9bae63ec298ab..0000000000000
--- a/common/changes/office-ui-fabric-react/users-nirmalar-ratingWithButton_2017-09-25-07-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Rating control implementation using button, Half star support and ReadOnly rating control support",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "nirmalar@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-edwliu-fix-offsetparent-sort_2017-09-27-18-10.json b/common/changes/office-ui-fabric-react/v-edwliu-fix-offsetparent-sort_2017-09-27-18-10.json
deleted file mode 100644
index 86257bf3425dc..0000000000000
--- a/common/changes/office-ui-fabric-react/v-edwliu-fix-offsetparent-sort_2017-09-27-18-10.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ScrollablePane: Fix sortStickies function to sort elements by their true offsetTop in respect to scrollablePane's root",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-edwliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-oct-contrast-bugs_2017-11-02-21-34.json b/common/changes/office-ui-fabric-react/v-krbrow-oct-contrast-bugs_2017-11-02-21-34.json
deleted file mode 100644
index 26f5940588839..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-oct-contrast-bugs_2017-11-02-21-34.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixing high contrast bugs",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index ab242cc33ad8b..1302467e4262b 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -38,7 +38,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.8.0 <6.0.0",
+    "@uifabric/styling": ">=5.10.0 <6.0.0",
     "@uifabric/utilities": ">=5.4.0 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 647598721707d..caca6b86be92e 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.6.0",
+      "tag": "@uifabric/experiments_v5.6.0",
+      "date": "Fri, 17 Nov 2017 17:36:36 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Bryan Watts <brwatt@microsoft.com>",
+            "commit": "97afd9793fddd3c5216d44cb3a54e36984c405d7",
+            "comment": "Add external signal"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Bryan Watts <brwatt@microsoft.com>",
+            "commit": "8ad0e5ca9fb39a3d719de88792e2893c2aa92f20",
+            "comment": "Make sure commands get added/removed in the correct order"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.22.0 <6.0.0` to `>=5.23.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.5.2",
       "tag": "@uifabric/experiments_v5.5.2",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 67c7535b850ec..197601ce5e94d 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Thu, 16 Nov 2017 11:20:34 GMT and should not be manually modified.
+This log was last generated on Fri, 17 Nov 2017 17:36:36 GMT and should not be manually modified.
+
+## 5.6.0
+Fri, 17 Nov 2017 17:36:36 GMT
+
+### Minor changes
+
+- Add external signal
+
+### Patches
+
+- Make sure commands get added/removed in the correct order
 
 ## 5.5.2
 Thu, 16 Nov 2017 11:20:34 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 206aef4f977c6..3668efdfb330e 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.5.2",
+  "version": "5.6.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.22.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.23.0 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 1ed4dcd126cf5..1db2a25ffca15 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -23,7 +23,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.8.0 <6.0.0",
+    "@uifabric/styling": ">=5.10.0 <6.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 4c0651e3e9583..814a8efdce068 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,67 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.23.0",
+      "tag": "office-ui-fabric-react_v5.23.0",
+      "date": "Fri, 17 Nov 2017 17:36:36 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Scott Balentine <sbalentine88@gmail.com>",
+            "commit": "17ca90bc46e13b47defa076a10f9c856b0165bc7",
+            "comment": "add suffix to TextField"
+          },
+          {
+            "author": "v-jaebey <v-jaebey@microsoft.com>",
+            "commit": "a94240dd097b611997300ea1837f34d496b2d162",
+            "comment": "Nav: Added `onLinkExpandClick` callback for getting a callback when an item expanded state is toggled"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "5a5c4bc9fa2528b3e9ed3521ec2e43d70aa3b48f",
+            "comment": "PersonaCoin: For non-latin characters, if initials return an empty string, use the Contact icon instead of the empty string."
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "48766c08ef17a1ec9a1d020836820bbb47a7b4dd",
+            "comment": "Rating control implementation using button, Half star support and ReadOnly rating control support"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Pablo Núñez <pablonete@gmail.com>",
+            "commit": "113c8cab8195d8325e6806aa02999075202f2955",
+            "comment": "DetailsList: mouse click gives preference to inner links."
+          },
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "0081be7384220ff7ee655c7b490f9128efdcd146",
+            "comment": "DetailsHeader: Accessibility fix, move aria-haspopup to correct element"
+          },
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "d2a2dcac90c4f9720b5f205665aa7e099cf97af9",
+            "comment": "SplitButton: Add splitFullActiveState to make the whole splitButton look active if true"
+          },
+          {
+            "author": "Eddie Liu <leddie24@gmail.com>",
+            "commit": "a879a83f4ba55a12eb5d9fe247dfa7208637433a",
+            "comment": "ScrollablePane: Fix sortStickies function to sort elements by their true offsetTop in respect to scrollablePane's root"
+          },
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "067363fb9722d9e460d2642acaf1886274aec99b",
+            "comment": "Fixing high contrast bugs"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.8.0 <6.0.0` to `>=5.10.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.22.0",
       "tag": "office-ui-fabric-react_v5.22.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 37ffd3db72280..894e5ec35ad82 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,24 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 16 Nov 2017 11:20:34 GMT and should not be manually modified.
+This log was last generated on Fri, 17 Nov 2017 17:36:36 GMT and should not be manually modified.
+
+## 5.23.0
+Fri, 17 Nov 2017 17:36:36 GMT
+
+### Minor changes
+
+- add suffix to TextField
+- Nav: Added `onLinkExpandClick` callback for getting a callback when an item expanded state is toggled
+- PersonaCoin: For non-latin characters, if initials return an empty string, use the Contact icon instead of the empty string.
+- Rating control implementation using button, Half star support and ReadOnly rating control support
+
+### Patches
+
+- DetailsList: mouse click gives preference to inner links.
+- DetailsHeader: Accessibility fix, move aria-haspopup to correct element
+- SplitButton: Add splitFullActiveState to make the whole splitButton look active if true
+- ScrollablePane: Fix sortStickies function to sort elements by their true offsetTop in respect to scrollablePane's root
+- Fixing high contrast bugs
 
 ## 5.22.0
 Thu, 16 Nov 2017 11:20:34 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 022de423bd308..2919e696b14f5 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.22.0",
+  "version": "5.23.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,7 +47,7 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.6.0 <6.0.0",
-    "@uifabric/styling": ">=5.8.0 <6.0.0",
+    "@uifabric/styling": ">=5.10.0 <6.0.0",
     "@uifabric/utilities": ">=5.4.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index d4edd80efec42..70946c0ded423 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.10.0",
+      "tag": "@uifabric/styling_v5.10.0",
+      "date": "Fri, 17 Nov 2017 17:36:36 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Michael Loughry <miclo@microsoft.com>",
+            "commit": "54dab7cabfc39ffe6e6ab68181e561467fa009fe",
+            "comment": "Export functions used to create font sets based upon a given locale code"
+          }
+        ]
+      }
+    },
     {
       "version": "5.8.0",
       "tag": "@uifabric/styling_v5.8.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index f1d3aca6d28b7..0418fbbd914af 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 16 Nov 2017 11:20:34 GMT and should not be manually modified.
+This log was last generated on Fri, 17 Nov 2017 17:36:36 GMT and should not be manually modified.
+
+## 5.10.0
+Fri, 17 Nov 2017 17:36:36 GMT
+
+### Minor changes
+
+- Export functions used to create font sets based upon a given locale code
 
 ## 5.8.0
 Thu, 16 Nov 2017 11:20:34 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index d28f056ff3c81..61083ff42a330 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.9.0",
+  "version": "5.10.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 75946625ad7eb76a724e61d8037301ff67a3a079 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 17 Nov 2017 10:34:56 -0800
Subject: [PATCH 1043/1641] Fixing icons in demo pages. (#3420)

* Fixing icons in demo pages.

* Change files.

* Locking out major changes!
---
 .../experiments/fixes_2017-11-17-17-55.json   | 11 ++++++++++
 .../fixes_2017-11-17-17-55.json               | 11 ++++++++++
 common/config/rush/version-policies.json      |  7 +++++++
 packages/experiments/config/pre-copy.json     |  7 -------
 .../LayoutGroup/LayoutGroupPage.tsx           |  2 +-
 .../SelectedPeopleListPage.tsx                |  2 +-
 packages/experiments/src/demo/index.tsx       |  2 +-
 .../config/pre-copy.json                      |  1 -
 .../office-ui-fabric-react/src/demo/index.tsx |  2 +-
 rush.json                                     | 20 +++++++++----------
 10 files changed, 43 insertions(+), 22 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/fixes_2017-11-17-17-55.json
 create mode 100644 common/changes/office-ui-fabric-react/fixes_2017-11-17-17-55.json
 create mode 100644 common/config/rush/version-policies.json
 delete mode 100644 packages/experiments/config/pre-copy.json

diff --git a/common/changes/@uifabric/experiments/fixes_2017-11-17-17-55.json b/common/changes/@uifabric/experiments/fixes_2017-11-17-17-55.json
new file mode 100644
index 0000000000000..2098be827ee86
--- /dev/null
+++ b/common/changes/@uifabric/experiments/fixes_2017-11-17-17-55.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/experiments",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fixes_2017-11-17-17-55.json b/common/changes/office-ui-fabric-react/fixes_2017-11-17-17-55.json
new file mode 100644
index 0000000000000..bdac204cd2e2e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fixes_2017-11-17-17-55.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "office-ui-fabric-react",
+      "type": "none"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/version-policies.json b/common/config/rush/version-policies.json
new file mode 100644
index 0000000000000..c32c1bd1b6f3a
--- /dev/null
+++ b/common/config/rush/version-policies.json
@@ -0,0 +1,7 @@
+[
+  {
+    "policyName": "lockedMajor",
+    "definitionName": "individualVersion",
+    "lockedMajor": 5
+  }
+]
\ No newline at end of file
diff --git a/packages/experiments/config/pre-copy.json b/packages/experiments/config/pre-copy.json
deleted file mode 100644
index 7eddd20114419..0000000000000
--- a/packages/experiments/config/pre-copy.json
+++ /dev/null
@@ -1,7 +0,0 @@
-{
-  "copyTo": {
-    "dist": [
-      "../icons/fonts/*"
-    ]
-  }
-}
\ No newline at end of file
diff --git a/packages/experiments/src/components/LayoutGroup/LayoutGroupPage.tsx b/packages/experiments/src/components/LayoutGroup/LayoutGroupPage.tsx
index 96edc7e0d916d..cc76db6fd76e2 100644
--- a/packages/experiments/src/components/LayoutGroup/LayoutGroupPage.tsx
+++ b/packages/experiments/src/components/LayoutGroup/LayoutGroupPage.tsx
@@ -26,7 +26,7 @@ export class LayoutGroupPage extends React.Component<IComponentDemoPageProps, {}
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!experiments/src/components/LayoutGroup/LayoutGroup.props.ts')
+              require<string>('!raw-loader!experiments/src/components/LayoutGroup/LayoutGroup.types.ts')
             ] }
           />
         }
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleListPage.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleListPage.tsx
index 28b0f46bf4dd1..eb750081f9e61 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleListPage.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleListPage.tsx
@@ -26,7 +26,7 @@ export class SelectedPeopleListPage extends React.Component<IComponentDemoPagePr
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!experiments/src/components/SelectedItemsList/BaseSelectedItemsList.props.ts')
+              require<string>('!raw-loader!experiments/src/components/SelectedItemsList/BaseSelectedItemsList.types.ts')
             ] }
           />
         }
diff --git a/packages/experiments/src/demo/index.tsx b/packages/experiments/src/demo/index.tsx
index b23b4d49ec94e..c37e41201312a 100644
--- a/packages/experiments/src/demo/index.tsx
+++ b/packages/experiments/src/demo/index.tsx
@@ -16,7 +16,7 @@ import './ColorStyles.scss';
 setBaseUrl('./dist/');
 
 // Initialize all icons.
-initializeIcons('dist/');
+initializeIcons();
 
 let rootElement: HTMLElement | null;
 
diff --git a/packages/office-ui-fabric-react/config/pre-copy.json b/packages/office-ui-fabric-react/config/pre-copy.json
index ac951e3654eea..5a7270ad2fa15 100644
--- a/packages/office-ui-fabric-react/config/pre-copy.json
+++ b/packages/office-ui-fabric-react/config/pre-copy.json
@@ -1,7 +1,6 @@
 {
   "copyTo": {
     "dist": [
-      "../icons/fonts/*",
       "index.html"
     ],
     "dist/sass": [
diff --git a/packages/office-ui-fabric-react/src/demo/index.tsx b/packages/office-ui-fabric-react/src/demo/index.tsx
index 118fc00bcbfdc..54d15e9e76fd3 100644
--- a/packages/office-ui-fabric-react/src/demo/index.tsx
+++ b/packages/office-ui-fabric-react/src/demo/index.tsx
@@ -14,7 +14,7 @@ import './ColorStyles.scss';
 
 import { initializeIcons } from '@uifabric/icons/lib/index';
 
-initializeIcons('dist/');
+initializeIcons();
 
 setBaseUrl('./dist/');
 ComponentPage.defaultProps.areBadgesVisible = true;
diff --git a/rush.json b/rush.json
index d8f3677eb2807..7a773e6acc379 100644
--- a/rush.json
+++ b/rush.json
@@ -9,37 +9,37 @@
     {
       "packageName": "@uifabric/build",
       "projectFolder": "scripts",
-      "shouldPublish": false
+      "versionPolicyName": "lockedMajor"
     },
     {
       "packageName": "office-ui-fabric-react",
       "projectFolder": "packages/office-ui-fabric-react",
-      "shouldPublish": true
+      "versionPolicyName": "lockedMajor"
     },
     {
       "packageName": "@uifabric/experiments",
       "projectFolder": "packages/experiments",
-      "shouldPublish": true
+      "versionPolicyName": "lockedMajor"
     },
     {
       "packageName": "@uifabric/merge-styles",
       "projectFolder": "packages/merge-styles",
-      "shouldPublish": true
+      "versionPolicyName": "lockedMajor"
     },
     {
       "packageName": "@uifabric/jest-serializer-merge-styles",
       "projectFolder": "packages/jest-serializer-merge-styles",
-      "shouldPublish": true
+      "versionPolicyName": "lockedMajor"
     },
     {
       "packageName": "@uifabric/utilities",
       "projectFolder": "packages/utilities",
-      "shouldPublish": true
+      "versionPolicyName": "lockedMajor"
     },
     {
       "packageName": "@uifabric/example-app-base",
       "projectFolder": "packages/example-app-base",
-      "shouldPublish": true,
+      "versionPolicyName": "lockedMajor",
       "cyclicDependencyProjects": [
         "office-ui-fabric-react"
       ]
@@ -47,7 +47,7 @@
     {
       "packageName": "@uifabric/styling",
       "projectFolder": "packages/styling",
-      "shouldPublish": true,
+      "versionPolicyName": "lockedMajor",
       "cyclicDependencyProjects": [
         "office-ui-fabric-react",
         "@uifabric/example-app-base"
@@ -56,7 +56,7 @@
     {
       "packageName": "@uifabric/icons",
       "projectFolder": "packages/icons",
-      "shouldPublish": true
+      "versionPolicyName": "lockedMajor"
     },
     {
       "packageName": "ssr-tests",
@@ -76,7 +76,7 @@
     {
       "packageName": "@uifabric/fabric-website",
       "projectFolder": "apps/fabric-website",
-      "shouldPublish": true
+      "versionPolicyName": "lockedMajor"
     },
     {
       "packageName": "test-bundle-button",

From 35a466a994844f6baa32b56ba5e4190f7f4e1055 Mon Sep 17 00:00:00 2001
From: sathi23 <sathi23@gmail.com>
Date: Fri, 17 Nov 2017 13:02:09 -0800
Subject: [PATCH 1044/1641] Calendar component ux changes plus exposing a
 sixweeksbydefault prop  (#3394)

* initial iteration of calendar component changes

* finalizing ux polish of calendar component + adding sixweeksbydefault prop to Calendar

* adding it to the example page

* fixing the snapshot issue

* renaming symbol appropriately

* reverting the ux changes back

* updating snapshots
---
 .../srangam-lookupcalendar_2017-11-15-00-23.json      | 11 +++++++++++
 .../src/components/Calendar/Calendar.tsx              |  4 +++-
 .../src/components/Calendar/Calendar.types.ts         |  6 ++++++
 .../src/components/Calendar/CalendarDay.tsx           | 11 ++++++++---
 .../src/components/Calendar/CalendarPage.tsx          |  9 +++++++++
 .../Calendar/examples/Calendar.Inline.Example.tsx     |  2 ++
 6 files changed, 39 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/srangam-lookupcalendar_2017-11-15-00-23.json

diff --git a/common/changes/office-ui-fabric-react/srangam-lookupcalendar_2017-11-15-00-23.json b/common/changes/office-ui-fabric-react/srangam-lookupcalendar_2017-11-15-00-23.json
new file mode 100644
index 0000000000000..5701a5efa0bb7
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/srangam-lookupcalendar_2017-11-15-00-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "calendar component ux changes plus exposing sixweeksbydefault",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "srangam@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index 25dcb3b4c953f..1810f58171d28 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -59,7 +59,8 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     navigationIcons: iconStrings,
     showWeekNumbers: false,
     firstWeekOfYear: FirstWeekOfYear.FirstDay,
-    dateTimeFormatter: dateTimeFormatterCallbacks
+    dateTimeFormatter: dateTimeFormatterCallbacks,
+    showSixWeeksByDefault: false,
   };
 
   public refs: {
@@ -156,6 +157,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   showWeekNumbers={ this.props.showWeekNumbers }
                   firstWeekOfYear={ this.props.firstWeekOfYear! }
                   dateTimeFormatter={ this.props.dateTimeFormatter! }
+                  showSixWeeksByDefault={ this.props.showSixWeeksByDefault }
                   minDate={ minDate }
                   maxDate={ maxDate }
                   ref='dayPicker'
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.types.ts b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.types.ts
index e74dcb1b1c90d..39546d9ed67e9 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.types.ts
@@ -132,6 +132,12 @@ export interface ICalendarProps extends React.Props<Calendar> {
   * If set the Calendar will not allow navigation to or selection of a date later than this value.
   */
   maxDate?: Date;
+
+  /**
+  * Whether the calendar should show 6 weeks by default.
+  * @defaultvalue false
+  */
+  showSixWeeksByDefault?: boolean;
 }
 
 export interface ICalendarStrings {
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index d9f28fa9f4dc0..20202e81a073a 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -60,6 +60,7 @@ export interface ICalendarDayProps extends React.Props<CalendarDay> {
   showWeekNumbers?: boolean;
   firstWeekOfYear: FirstWeekOfYear;
   dateTimeFormatter: ICalendarFormatDateCallbacks;
+  showSixWeeksByDefault?: boolean;
   minDate?: Date;
   maxDate?: Date;
 }
@@ -474,7 +475,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
   }
 
   private _getWeeks(propsToUse: ICalendarDayProps): IDayInfo[][] {
-    let { navigatedDate, selectedDate, dateRangeType, firstDayOfWeek, today, minDate, maxDate } = propsToUse;
+    let { navigatedDate, selectedDate, dateRangeType, firstDayOfWeek, today, minDate, maxDate, showSixWeeksByDefault } = propsToUse;
     let date = new Date(navigatedDate.getFullYear(), navigatedDate.getMonth(), 1);
     let todaysDate = today || new Date();
     let weeks: IDayInfo[][] = [];
@@ -492,7 +493,9 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
       selectedDates = this._getBoundedDateRange(selectedDates, minDate, maxDate);
     }
 
-    for (let weekIndex = 0; !isAllDaysOfWeekOutOfMonth; weekIndex++) {
+    let shouldGetWeeks = true;
+
+    for (let weekIndex = 0; shouldGetWeeks; weekIndex++) {
       let week: IDayInfo[] = [];
 
       isAllDaysOfWeekOutOfMonth = true;
@@ -519,7 +522,9 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
         date.setDate(date.getDate() + 1);
       }
 
-      if (!isAllDaysOfWeekOutOfMonth) {
+      // We append the condition of the loop depending upon the showSixWeeksByDefault prop.
+      shouldGetWeeks = showSixWeeksByDefault ? (!isAllDaysOfWeekOutOfMonth || weekIndex <= 5) : !isAllDaysOfWeekOutOfMonth;
+      if (shouldGetWeeks) {
         weeks.push(week);
       }
     }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
index ec1146a19c80b..333b23b35b22a 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
@@ -86,6 +86,15 @@ export class CalendarPage extends React.Component<IComponentDemoPageProps, any>
                 showWeekNumbers={ true }
               />
             </ExampleCard>
+            <ExampleCard title='Inline Calendar with 6 weeks display by default' code={ CalendarInlineExampleCode }>
+              <CalendarInlineExample
+                isMonthPickerVisible={ false }
+                dateRangeType={ DateRangeType.Day }
+                autoNavigateOnSelection={ false }
+                showGoToToday={ false }
+                showSixWeeksByDefault={ true }
+              />
+            </ExampleCard>
             <ExampleCard title='Inline Calendar with month picker and no day picker' code={ CalendarInlineExampleCode }>
               <CalendarInlineExample
                 dateRangeType={ DateRangeType.Month }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
index 2ca2d0e7bba87..ec9b615e54398 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
@@ -78,6 +78,7 @@ export interface ICalendarInlineExampleProps {
   showWeekNumbers?: boolean;
   minDate?: Date;
   maxDate?: Date;
+  showSixWeeksByDefault?: boolean;
 }
 
 export class CalendarInlineExample extends React.Component<ICalendarInlineExampleProps, ICalendarInlineExampleState> {
@@ -142,6 +143,7 @@ export class CalendarInlineExample extends React.Component<ICalendarInlineExampl
           showWeekNumbers={ this.props.showWeekNumbers }
           minDate={ this.props.minDate }
           maxDate={ this.props.maxDate }
+          showSixWeeksByDefault={ this.props.showSixWeeksByDefault }
         />
         { this.props.showNavigateButtons &&
           <div>

From 1ea8504482adb1570bc6e6e96d1a33d90fbb8509 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 17 Nov 2017 13:10:50 -0800
Subject: [PATCH 1045/1641] Update rush.json

---
 rush.json | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/rush.json b/rush.json
index 7a773e6acc379..308d189f059c9 100644
--- a/rush.json
+++ b/rush.json
@@ -6,11 +6,6 @@
   },
   "nodeSupportedVersionRange": ">=6.9.0 <9.0.0",
   "projects": [
-    {
-      "packageName": "@uifabric/build",
-      "projectFolder": "scripts",
-      "versionPolicyName": "lockedMajor"
-    },
     {
       "packageName": "office-ui-fabric-react",
       "projectFolder": "packages/office-ui-fabric-react",
@@ -58,6 +53,11 @@
       "projectFolder": "packages/icons",
       "versionPolicyName": "lockedMajor"
     },
+    {
+      "packageName": "@uifabric/build",
+      "projectFolder": "scripts",
+      "shouldPublish": false
+    },
     {
       "packageName": "ssr-tests",
       "projectFolder": "apps/ssr-tests",
@@ -89,4 +89,4 @@
       "shouldPublish": false
     }
   ]
-}
\ No newline at end of file
+}

From f6726899890fd97c15c57ddd7337c383cd5f661d Mon Sep 17 00:00:00 2001
From: Spencer Elliott <me@elliottsj.com>
Date: Fri, 17 Nov 2017 16:00:09 -0800
Subject: [PATCH 1046/1641] DetailsList: restore focus only if active element
 leaves the list (#3425)

Fix #3406
---
 ...elliot-detailslist-focus-fix_2017-11-17-22-18.json | 11 +++++++++++
 .../src/components/DetailsList/DetailsList.tsx        |  7 ++-----
 2 files changed, 13 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/spelliot-detailslist-focus-fix_2017-11-17-22-18.json

diff --git a/common/changes/office-ui-fabric-react/spelliot-detailslist-focus-fix_2017-11-17-22-18.json b/common/changes/office-ui-fabric-react/spelliot-detailslist-focus-fix_2017-11-17-22-18.json
new file mode 100644
index 0000000000000..6014f441e1cb1
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/spelliot-detailslist-focus-fix_2017-11-17-22-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: preserve focus only if active element leaves the list",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "spelliot@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 13a2036aec1e7..e213f613ad4f1 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -8,6 +8,7 @@ import {
   assign,
   autobind,
   css,
+  elementContains,
   getRTLSafeKeyCode,
   IRenderFunction
 } from '../../Utilities';
@@ -39,7 +40,6 @@ import { withViewport } from '../../utilities/decorators/withViewport';
 const styles: any = stylesImport;
 
 export interface IDetailsListState {
-  focusedItem?: DetailsRow;
   focusedItemIndex: number;
   lastWidth?: number;
   lastSelectionMode?: SelectionMode;
@@ -106,7 +106,6 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     this._onGroupExpandStateChanged = this._onGroupExpandStateChanged.bind(this);
 
     this.state = {
-      focusedItem: undefined,
       focusedItemIndex: -1,
       lastWidth: 0,
       adjustedColumns: this._getAdjustedColumns(props),
@@ -152,7 +151,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       this.props.items !== prevProps.items &&
       this.props.items.length > 0 &&
       this.state.focusedItemIndex !== -1 &&
-      this.props.items.indexOf(this.state.focusedItem) === -1
+      !elementContains(this._root, document.activeElement as HTMLElement, false)
     ) {
       // Item set has changed and previously-focused item is gone.
       // Set focus to item at index of previously-focused item if it is in range,
@@ -760,7 +759,6 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
         onActiveItemChanged(items[index], index, ev);
       }
       this.setState({
-        focusedItem: items[index],
         focusedItemIndex: index
       });
     }
@@ -768,7 +766,6 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
 
   private _onBlur(event: React.FocusEvent<HTMLElement>) {
     this.setState({
-      focusedItem: undefined,
       focusedItemIndex: -1
     });
   }

From 67466325ed0ff6b89f82fa152860f968d8d740a0 Mon Sep 17 00:00:00 2001
From: Eddie Liu <leddie24@gmail.com>
Date: Fri, 17 Nov 2017 16:29:06 -0800
Subject: [PATCH 1047/1641] Add missing components to fabric-website (#3427)

* Add ActivityItem, Calendar, HoverCard, OverflowSet, ScrollablePane, and TeachingBubble to fabric-website.

* Add change files
---
 .../src/components/App/AppState.tsx           | 46 +++++++++++++++----
 .../Components/ActivityItemComponentPage.tsx  | 38 +++++++++++++++
 .../Components/CalendarComponentPage.tsx      | 38 +++++++++++++++
 .../Components/HoverCardComponentPage.tsx     | 38 +++++++++++++++
 .../Components/OverflowSetComponentPage.tsx   | 38 +++++++++++++++
 .../ScrollablePaneComponentPage.tsx           | 38 +++++++++++++++
 .../TeachingBubbleComponentPage.tsx           | 38 +++++++++++++++
 ...nentsToFabricWebsite_2017-11-17-23-07.json | 11 +++++
 ...nentsToFabricWebsite_2017-11-17-23-07.json | 11 +++++
 .../components/HoverCard/HoverCardPage.tsx    |  8 ++--
 .../OverflowSet/OverflowSetPage.tsx           |  4 +-
 .../ScrollablePane/ScrollablePanePage.tsx     |  2 +-
 .../TeachingBubble/TeachingBubblePage.tsx     |  8 ++--
 13 files changed, 299 insertions(+), 19 deletions(-)
 create mode 100644 apps/fabric-website/src/pages/Components/ActivityItemComponentPage.tsx
 create mode 100644 apps/fabric-website/src/pages/Components/CalendarComponentPage.tsx
 create mode 100644 apps/fabric-website/src/pages/Components/HoverCardComponentPage.tsx
 create mode 100644 apps/fabric-website/src/pages/Components/OverflowSetComponentPage.tsx
 create mode 100644 apps/fabric-website/src/pages/Components/ScrollablePaneComponentPage.tsx
 create mode 100644 apps/fabric-website/src/pages/Components/TeachingBubbleComponentPage.tsx
 create mode 100644 common/changes/@uifabric/fabric-website/v-edwliu-addComponentsToFabricWebsite_2017-11-17-23-07.json
 create mode 100644 common/changes/office-ui-fabric-react/v-edwliu-addComponentsToFabricWebsite_2017-11-17-23-07.json

diff --git a/apps/fabric-website/src/components/App/AppState.tsx b/apps/fabric-website/src/components/App/AppState.tsx
index daae986e4ab63..4037e4e10691f 100644
--- a/apps/fabric-website/src/components/App/AppState.tsx
+++ b/apps/fabric-website/src/components/App/AppState.tsx
@@ -98,6 +98,12 @@ export const AppState: IAppState = {
       isUhfLink: true,
       component: require<any>('../../pages/Overviews/ComponentsPage').ComponentsPage,
       pages: [
+        {
+          title: 'ActivityItem',
+          url: '#/components/activityitem',
+          component: () => <LoadingComponent title='ActivityItem' />,
+          getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/ActivityItemComponentPage').ActivityItemComponentPage))
+        },
         {
           title: 'Breadcrumb',
           url: '#/components/breadcrumb',
@@ -109,14 +115,18 @@ export const AppState: IAppState = {
           url: '#/components/button',
           component: () => <LoadingComponent title='Button' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/ButtonComponentPage').ButtonComponentPage)),
-
+        },
+        {
+          title: 'Calendar',
+          url: '#/components/Calendar',
+          component: () => <LoadingComponent title='Calendar' />,
+          getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/CalendarComponentPage').CalendarComponentPage))
         },
         {
           title: 'Callout',
           url: '#/components/callout',
           component: () => <LoadingComponent title='Callout' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/CalloutComponentPage').CalloutComponentPage))
-
         },
         {
           title: 'Checkbox',
@@ -129,7 +139,6 @@ export const AppState: IAppState = {
           url: '#/components/choicegroup',
           component: () => <LoadingComponent title='ChoiceGroup' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/ChoiceGroupComponentPage').ChoiceGroupComponentPage))
-
         },
         {
           title: 'ColorPicker',
@@ -142,7 +151,6 @@ export const AppState: IAppState = {
           url: '#/components/ComboBox',
           component: () => <LoadingComponent title='ComboBox' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/ComboBoxComponentPage').ComboBoxComponentPage))
-
         },
         {
           title: 'CommandBar',
@@ -155,7 +163,6 @@ export const AppState: IAppState = {
           url: '#/components/contextualmenu',
           component: () => <LoadingComponent title='ContextualMenu' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/ContextualMenuComponentPage').ContextualMenuComponentPage))
-
         },
         {
           title: 'DatePicker',
@@ -186,7 +193,6 @@ export const AppState: IAppState = {
           url: '#/components/dropdown',
           component: () => <LoadingComponent title='Dropdown' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/DropdownComponentPage').DropdownComponentPage))
-
         },
         {
           title: 'Facepile',
@@ -200,11 +206,16 @@ export const AppState: IAppState = {
           url: '#/components/groupedlist',
           component: () => <LoadingComponent title='GroupedList' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/GroupedListComponentPage').GroupedListComponentPage))
-
+        },
+        {
+          title: 'HoverCard',
+          url: '#/components/hovercard',
+          component: () => <LoadingComponent title='HoverCard' />,
+          getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/HoverCardComponentPage').HoverCardComponentPage))
         },
         {
           title: 'Icon',
-          url: '#/components/Icon',
+          url: '#/components/icon',
           component: () => <LoadingComponent title='Icon' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/IconComponentPage').IconComponentPage))
         },
@@ -225,7 +236,6 @@ export const AppState: IAppState = {
           url: '#/components/layer',
           component: () => <LoadingComponent title='Layer' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/LayerComponentPage').LayerComponentPage))
-
         },
         {
           title: 'Link',
@@ -257,6 +267,12 @@ export const AppState: IAppState = {
           component: () => <LoadingComponent title='Nav' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/NavComponentPage').NavComponentPage))
         },
+        {
+          title: 'OverflowSet',
+          url: '#/components/overflowset',
+          component: () => <LoadingComponent title='OverflowSet' />,
+          getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/OverflowSetComponentPage').OverflowSetComponentPage))
+        },
         {
           title: 'Overlay',
           url: '#/components/overlay',
@@ -311,6 +327,12 @@ export const AppState: IAppState = {
           component: () => <LoadingComponent title='ResizeGroup' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/ResizeGroupComponentPage').ResizeGroupComponentPage))
         },
+        {
+          title: 'ScrollablePane',
+          url: '#/components/scrollablepane',
+          component: () => <LoadingComponent title='ScrollablePane' />,
+          getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/ScrollablePaneComponentPage').ScrollablePaneComponentPage))
+        },
         {
           title: 'SearchBox',
           url: '#/components/searchbox',
@@ -341,6 +363,12 @@ export const AppState: IAppState = {
           component: () => <LoadingComponent title='SwatchColorPicker' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/SwatchColorPickerComponentPage').SwatchColorPickerComponentPage))
         },
+        {
+          title: 'TeachingBubble',
+          url: '#/components/teachingbubble',
+          component: () => <LoadingComponent title='TeachingBubble' />,
+          getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/TeachingBubbleComponentPage').TeachingBubbleComponentPage))
+        },
         {
           title: 'TextField',
           url: '#/components/textfield',
diff --git a/apps/fabric-website/src/pages/Components/ActivityItemComponentPage.tsx b/apps/fabric-website/src/pages/Components/ActivityItemComponentPage.tsx
new file mode 100644
index 0000000000000..9f998585a05c8
--- /dev/null
+++ b/apps/fabric-website/src/pages/Components/ActivityItemComponentPage.tsx
@@ -0,0 +1,38 @@
+import * as React from 'react';
+import { ActivityItemPage } from 'office-ui-fabric-react/lib/components/ActivityItem/ActivityItemPage';
+import { PageHeader } from '../../components/PageHeader/PageHeader';
+import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
+
+export class ActivityItemComponentPage extends React.Component<any, any> {
+  public render() {
+    return (
+      <div ref='pageElement' className={ pageStyles.basePage }>
+        <ComponentPage>
+          <PageHeader pageTitle='ActivityItem' backgroundColor='#038387'
+            links={
+              [
+                {
+                  'text': 'Overview',
+                  'location': 'Overview'
+                },
+                {
+                  'text': 'Best Practices',
+                  'location': 'BestPractices'
+                },
+                {
+                  'text': 'Variants',
+                  'location': 'Variants'
+                },
+                {
+                  'text': 'Implementation',
+                  'location': 'Implementation'
+                }
+              ]
+            } />
+          <ActivityItemPage isHeaderVisible={ false } />
+        </ComponentPage>
+      </div>
+    );
+  }
+}
diff --git a/apps/fabric-website/src/pages/Components/CalendarComponentPage.tsx b/apps/fabric-website/src/pages/Components/CalendarComponentPage.tsx
new file mode 100644
index 0000000000000..50bf399d2ee0f
--- /dev/null
+++ b/apps/fabric-website/src/pages/Components/CalendarComponentPage.tsx
@@ -0,0 +1,38 @@
+import * as React from 'react';
+import { CalendarPage } from 'office-ui-fabric-react/lib/components/Calendar/CalendarPage';
+import { PageHeader } from '../../components/PageHeader/PageHeader';
+import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
+
+export class CalendarComponentPage extends React.Component<any, any> {
+  public render() {
+    return (
+      <div ref='pageElement' className={ pageStyles.basePage }>
+        <ComponentPage>
+          <PageHeader pageTitle='Calendar' backgroundColor='#038387'
+            links={
+              [
+                {
+                  'text': 'Overview',
+                  'location': 'Overview'
+                },
+                {
+                  'text': 'Best Practices',
+                  'location': 'BestPractices'
+                },
+                {
+                  'text': 'Variants',
+                  'location': 'Variants'
+                },
+                {
+                  'text': 'Implementation',
+                  'location': 'Implementation'
+                }
+              ]
+            } />
+          <CalendarPage isHeaderVisible={ false } />
+        </ComponentPage>
+      </div>
+    );
+  }
+}
diff --git a/apps/fabric-website/src/pages/Components/HoverCardComponentPage.tsx b/apps/fabric-website/src/pages/Components/HoverCardComponentPage.tsx
new file mode 100644
index 0000000000000..78139437bee79
--- /dev/null
+++ b/apps/fabric-website/src/pages/Components/HoverCardComponentPage.tsx
@@ -0,0 +1,38 @@
+import * as React from 'react';
+import { HoverCardPage } from 'office-ui-fabric-react/lib/components/HoverCard/HoverCardPage';
+import { PageHeader } from '../../components/PageHeader/PageHeader';
+import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
+
+export class HoverCardComponentPage extends React.Component<any, any> {
+  public render() {
+    return (
+      <div ref='pageElement' className={ pageStyles.basePage }>
+        <ComponentPage>
+          <PageHeader pageTitle='HoverCard' backgroundColor='#038387'
+            links={
+              [
+                {
+                  'text': 'Overview',
+                  'location': 'Overview'
+                },
+                {
+                  'text': 'Best Practices',
+                  'location': 'BestPractices'
+                },
+                {
+                  'text': 'Variants',
+                  'location': 'Variants'
+                },
+                {
+                  'text': 'Implementation',
+                  'location': 'Implementation'
+                }
+              ]
+            } />
+          <HoverCardPage isHeaderVisible={ false } />
+        </ComponentPage>
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/pages/Components/OverflowSetComponentPage.tsx b/apps/fabric-website/src/pages/Components/OverflowSetComponentPage.tsx
new file mode 100644
index 0000000000000..7c21183bd950a
--- /dev/null
+++ b/apps/fabric-website/src/pages/Components/OverflowSetComponentPage.tsx
@@ -0,0 +1,38 @@
+import * as React from 'react';
+import { OverflowSetPage } from 'office-ui-fabric-react/lib/components/OverflowSet/OverflowSetPage';
+import { PageHeader } from '../../components/PageHeader/PageHeader';
+import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
+
+export class OverflowSetComponentPage extends React.Component<any, any> {
+  public render() {
+    return (
+      <div ref='pageElement' className={ pageStyles.basePage }>
+        <ComponentPage>
+          <PageHeader pageTitle='OverflowSet' backgroundColor='#038387'
+            links={
+              [
+                {
+                  'text': 'Overview',
+                  'location': 'Overview'
+                },
+                {
+                  'text': 'Best Practices',
+                  'location': 'BestPractices'
+                },
+                {
+                  'text': 'Variants',
+                  'location': 'Variants'
+                },
+                {
+                  'text': 'Implementation',
+                  'location': 'Implementation'
+                }
+              ]
+            } />
+          <OverflowSetPage isHeaderVisible={ false } />
+        </ComponentPage>
+      </div>
+    );
+  }
+}
diff --git a/apps/fabric-website/src/pages/Components/ScrollablePaneComponentPage.tsx b/apps/fabric-website/src/pages/Components/ScrollablePaneComponentPage.tsx
new file mode 100644
index 0000000000000..36fc2d61e378c
--- /dev/null
+++ b/apps/fabric-website/src/pages/Components/ScrollablePaneComponentPage.tsx
@@ -0,0 +1,38 @@
+import * as React from 'react';
+import { ScrollablePanePage } from 'office-ui-fabric-react/lib/components/ScrollablePane/ScrollablePanePage';
+import { PageHeader } from '../../components/PageHeader/PageHeader';
+import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
+
+export class ScrollablePaneComponentPage extends React.Component<any, any> {
+  public render() {
+    return (
+      <div ref='pageElement' className={ pageStyles.basePage }>
+        <ComponentPage>
+          <PageHeader pageTitle='SearchBox' backgroundColor='#038387'
+            links={
+              [
+                {
+                  'text': 'Overview',
+                  'location': 'Overview'
+                },
+                {
+                  'text': 'Best Practices',
+                  'location': 'BestPractices'
+                },
+                {
+                  'text': 'Variants',
+                  'location': 'Variants'
+                },
+                {
+                  'text': 'Implementation',
+                  'location': 'Implementation'
+                }
+              ]
+            } />
+          <ScrollablePanePage isHeaderVisible={ false } />
+        </ComponentPage>
+      </div>
+    );
+  }
+}
diff --git a/apps/fabric-website/src/pages/Components/TeachingBubbleComponentPage.tsx b/apps/fabric-website/src/pages/Components/TeachingBubbleComponentPage.tsx
new file mode 100644
index 0000000000000..750ccff7c794f
--- /dev/null
+++ b/apps/fabric-website/src/pages/Components/TeachingBubbleComponentPage.tsx
@@ -0,0 +1,38 @@
+import * as React from 'react';
+import { TeachingBubblePage } from 'office-ui-fabric-react/lib/components/TeachingBubble/TeachingBubblePage';
+import { PageHeader } from '../../components/PageHeader/PageHeader';
+import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
+
+export class TeachingBubbleComponentPage extends React.Component<any, any> {
+  public render() {
+    return (
+      <div ref='pageElement' className={ pageStyles.basePage }>
+        <ComponentPage>
+          <PageHeader pageTitle='TeachingBubble' backgroundColor='#038387'
+            links={
+              [
+                {
+                  'text': 'Overview',
+                  'location': 'Overview'
+                },
+                {
+                  'text': 'Best Practices',
+                  'location': 'BestPractices'
+                },
+                {
+                  'text': 'Variants',
+                  'location': 'Variants'
+                },
+                {
+                  'text': 'Implementation',
+                  'location': 'Implementation'
+                }
+              ]
+            } />
+          <TeachingBubblePage isHeaderVisible={ false } />
+        </ComponentPage>
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/v-edwliu-addComponentsToFabricWebsite_2017-11-17-23-07.json b/common/changes/@uifabric/fabric-website/v-edwliu-addComponentsToFabricWebsite_2017-11-17-23-07.json
new file mode 100644
index 0000000000000..12360826839e7
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/v-edwliu-addComponentsToFabricWebsite_2017-11-17-23-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Add ActivityItem, Calendar, HoverCard, OverflowSet, ScrollablePane, TeachingBubble to fabric-website",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "v-edwliu@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-edwliu-addComponentsToFabricWebsite_2017-11-17-23-07.json b/common/changes/office-ui-fabric-react/v-edwliu-addComponentsToFabricWebsite_2017-11-17-23-07.json
new file mode 100644
index 0000000000000..9e768d70f94c2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-edwliu-addComponentsToFabricWebsite_2017-11-17-23-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Edit HoverCardPage, OverflowSetPage, ScrollablePanePage, TeachingBubblePage to use IComponentDemoPageProps",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-edwliu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx
index 12e54e12d8db9..16bc5b48902a5 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx
@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { Link } from 'office-ui-fabric-react/lib/Link';
 import { LayerHost } from 'office-ui-fabric-react/lib/Layer';
 import {
   ExampleCard,
   ComponentPage,
+  IComponentDemoPageProps,
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { HoverCardBasicExample } from './examples/HoverCard.Basic.Example';
@@ -16,7 +16,7 @@ import './HoverCardPage.scss';
 const HoverCardBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx') as string;
 const HoverCardTargetExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx') as string;
 
-export class HoverCardPage extends React.Component<any, any> {
+export class HoverCardPage extends React.Component<IComponentDemoPageProps, any> {
   public render() {
     return (
       <ComponentPage
@@ -42,8 +42,7 @@ export class HoverCardPage extends React.Component<any, any> {
         }
         overview={
           <div>
-            <Link target='_blank' href='http://dev.office.com/fabric/components/HoverCard'>HoverCards</Link>
-            <span> supplement content associated with a specific data element.</span>
+            <p>HoverCards supplement content associated with a specific data element.</p>
           </div>
         }
         componentStatus={
@@ -51,6 +50,7 @@ export class HoverCardPage extends React.Component<any, any> {
             {...HoverCardStatus}
           />
         }
+        isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSetPage.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSetPage.tsx
index e860d74cc853f..c003673055fb1 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSetPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSetPage.tsx
@@ -3,6 +3,7 @@ import { LayerHost } from 'office-ui-fabric-react/lib/Layer';
 import {
   ExampleCard,
   ComponentPage,
+  IComponentDemoPageProps,
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { OverflowSetCustomExample } from './examples/OverflowSet.Custom.Example';
@@ -15,7 +16,7 @@ const OverflowSetCustomExampleCode = require('!raw-loader!office-ui-fabric-react
 const OverflowSetBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Basic.Example.tsx') as string;
 const OverflowSetVerticalExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Vertical.Example.tsx') as string;
 
-export class OverflowSetPage extends React.Component<any, any> {
+export class OverflowSetPage extends React.Component<IComponentDemoPageProps, any> {
   public render() {
     return (
       <ComponentPage
@@ -54,6 +55,7 @@ export class OverflowSetPage extends React.Component<any, any> {
             {...OverflowSetStatus}
           />
         }
+        isHeaderVisible={ this.props.isHeaderVisible }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
index 933f480450cf5..8c95b615cba51 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
@@ -14,7 +14,7 @@ const ScrollablePaneDefaultExampleCode = require('!raw-loader!office-ui-fabric-r
 
 const ScrollablePaneDetailsListExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.DetailsList.Example.tsx') as string;
 
-export class ScrollablePanePage extends React.Component<IComponentDemoPageProps, {}> {
+export class ScrollablePanePage extends React.Component<IComponentDemoPageProps, any> {
   public render() {
     return (
       <ComponentPage
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubblePage.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubblePage.tsx
index 88034a712d839..72c443f9df2eb 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubblePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubblePage.tsx
@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { Link } from 'office-ui-fabric-react/lib/Link';
 import { LayerHost } from 'office-ui-fabric-react/lib/Layer';
 import {
   ExampleCard,
   ComponentPage,
+  IComponentDemoPageProps,
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { TeachingBubbleBasicExample } from './examples/TeachingBubble.Basic.Example';
@@ -16,7 +16,7 @@ const TeachingBubbleBasicExampleCode = require('!raw-loader!office-ui-fabric-rea
 const TeachingBubbleCondensedExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Condensed.Example.tsx') as string;
 const TeachingBubbleIllustrationExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx') as string;
 
-export class TeachingBubblePage extends React.Component<any, any> {
+export class TeachingBubblePage extends React.Component<IComponentDemoPageProps, any> {
   public render() {
     return (
       <ComponentPage
@@ -44,10 +44,10 @@ export class TeachingBubblePage extends React.Component<any, any> {
         }
         overview={
           <div>
-            <Link target='_blank' href='http://dev.office.com/fabric/components/TeachingBubble'>TeachingBubbles</Link>
-            <span> allow the user to display important hints on their web pages with a callout box.</span>
+            <p>TeachingBubbles allow the user to display important hints on their web pages with a callout box.</p>
           </div>
         }
+        isHeaderVisible={ this.props.isHeaderVisible }
         componentStatus={
           <ComponentStatus
             {...TeachingBubbleStatus}

From 90d78667bf6450b9e88deb16eaa4a525fee201b1 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Fri, 17 Nov 2017 17:46:44 -0800
Subject: [PATCH 1048/1641] Persona: Changed size40's font back to 14px (#3428)

* Change font size back to m

* Added change file
---
 .../persona-fontsize_2017-11-18-00-59.json            | 11 +++++++++++
 .../src/components/Persona/Persona.scss               |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/persona-fontsize_2017-11-18-00-59.json

diff --git a/common/changes/office-ui-fabric-react/persona-fontsize_2017-11-18-00-59.json b/common/changes/office-ui-fabric-react/persona-fontsize_2017-11-18-00-59.json
new file mode 100644
index 0000000000000..4c61ab7ffbf96
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/persona-fontsize_2017-11-18-00-59.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Persona: Changed size40 primaryText font size back 14px.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
index 155da7c816c35..e87a1c8b3c6c5 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
@@ -584,7 +584,7 @@ $ms-Persona-presenceBorder: 2px;
   }
 
   .primaryText {
-    font-size: $ms-font-size-l;
+    font-size: $ms-font-size-m;
   }
 }
 

From 2c9d2f80f73d5b0b8bd6974ff813b887918348ce Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 20 Nov 2017 11:12:47 +0000
Subject: [PATCH 1049/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 19 ++++++++++++
 apps/fabric-website/CHANGELOG.md              |  9 +++++-
 apps/fabric-website/package.json              |  4 +--
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...nentsToFabricWebsite_2017-11-17-23-07.json | 11 -------
 .../fixes_2017-11-17-17-55.json               | 11 -------
 .../persona-fontsize_2017-11-18-00-59.json    | 11 -------
 ...etailslist-focus-fix_2017-11-17-22-18.json | 11 -------
 ...angam-lookupcalendar_2017-11-15-00-23.json | 11 -------
 ...nentsToFabricWebsite_2017-11-17-23-07.json | 11 -------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 31 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 ++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 17 files changed, 80 insertions(+), 76 deletions(-)
 delete mode 100644 common/changes/@uifabric/fabric-website/v-edwliu-addComponentsToFabricWebsite_2017-11-17-23-07.json
 delete mode 100644 common/changes/office-ui-fabric-react/fixes_2017-11-17-17-55.json
 delete mode 100644 common/changes/office-ui-fabric-react/persona-fontsize_2017-11-18-00-59.json
 delete mode 100644 common/changes/office-ui-fabric-react/spelliot-detailslist-focus-fix_2017-11-17-22-18.json
 delete mode 100644 common/changes/office-ui-fabric-react/srangam-lookupcalendar_2017-11-15-00-23.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-edwliu-addComponentsToFabricWebsite_2017-11-17-23-07.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index f1088fe0327ae..167dbfb5eb7ee 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.0.17",
+      "tag": "@uifabric/fabric-website_v5.0.17",
+      "date": "Mon, 20 Nov 2017 11:12:47 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Eddie Liu <leddie24@gmail.com>",
+            "commit": "67466325ed0ff6b89f82fa152860f968d8d740a0",
+            "comment": "Add ActivityItem, Calendar, HoverCard, OverflowSet, ScrollablePane, TeachingBubble to fabric-website"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.23.0 <6.0.0` to `>=5.24.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.16",
       "tag": "@uifabric/fabric-website_v5.0.16",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 0a93203240d34..eeb7d6e359bdb 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Fri, 17 Nov 2017 17:36:36 GMT and should not be manually modified.
+This log was last generated on Mon, 20 Nov 2017 11:12:47 GMT and should not be manually modified.
+
+## 5.0.17
+Mon, 20 Nov 2017 11:12:47 GMT
+
+### Patches
+
+- Add ActivityItem, Calendar, HoverCard, OverflowSet, ScrollablePane, TeachingBubble to fabric-website
 
 ## 5.0.16
 Fri, 17 Nov 2017 17:36:36 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 660c746d523a2..986f67cd63c9a 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.0.16",
+  "version": "5.0.17",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.23.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.24.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index c37fb00040245..4eb49404a7123 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.23.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.24.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 6facb9a1bab4e..20e0193dc94af 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.23.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.24.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index ab39bf1087a9d..90df1a87e0283 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.23.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.24.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 196c2ebff1069..2e4c5d6ef672e 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.23.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.24.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/fabric-website/v-edwliu-addComponentsToFabricWebsite_2017-11-17-23-07.json b/common/changes/@uifabric/fabric-website/v-edwliu-addComponentsToFabricWebsite_2017-11-17-23-07.json
deleted file mode 100644
index 12360826839e7..0000000000000
--- a/common/changes/@uifabric/fabric-website/v-edwliu-addComponentsToFabricWebsite_2017-11-17-23-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Add ActivityItem, Calendar, HoverCard, OverflowSet, ScrollablePane, TeachingBubble to fabric-website",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "v-edwliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fixes_2017-11-17-17-55.json b/common/changes/office-ui-fabric-react/fixes_2017-11-17-17-55.json
deleted file mode 100644
index bdac204cd2e2e..0000000000000
--- a/common/changes/office-ui-fabric-react/fixes_2017-11-17-17-55.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "office-ui-fabric-react",
-      "type": "none"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/persona-fontsize_2017-11-18-00-59.json b/common/changes/office-ui-fabric-react/persona-fontsize_2017-11-18-00-59.json
deleted file mode 100644
index 4c61ab7ffbf96..0000000000000
--- a/common/changes/office-ui-fabric-react/persona-fontsize_2017-11-18-00-59.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Persona: Changed size40 primaryText font size back 14px.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/spelliot-detailslist-focus-fix_2017-11-17-22-18.json b/common/changes/office-ui-fabric-react/spelliot-detailslist-focus-fix_2017-11-17-22-18.json
deleted file mode 100644
index 6014f441e1cb1..0000000000000
--- a/common/changes/office-ui-fabric-react/spelliot-detailslist-focus-fix_2017-11-17-22-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: preserve focus only if active element leaves the list",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "spelliot@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/srangam-lookupcalendar_2017-11-15-00-23.json b/common/changes/office-ui-fabric-react/srangam-lookupcalendar_2017-11-15-00-23.json
deleted file mode 100644
index 5701a5efa0bb7..0000000000000
--- a/common/changes/office-ui-fabric-react/srangam-lookupcalendar_2017-11-15-00-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "calendar component ux changes plus exposing sixweeksbydefault",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "srangam@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-edwliu-addComponentsToFabricWebsite_2017-11-17-23-07.json b/common/changes/office-ui-fabric-react/v-edwliu-addComponentsToFabricWebsite_2017-11-17-23-07.json
deleted file mode 100644
index 9e768d70f94c2..0000000000000
--- a/common/changes/office-ui-fabric-react/v-edwliu-addComponentsToFabricWebsite_2017-11-17-23-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Edit HoverCardPage, OverflowSetPage, ScrollablePanePage, TeachingBubblePage to use IComponentDemoPageProps",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-edwliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 3668efdfb330e..2faeb4e5cf3d2 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.23.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.24.0 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 814a8efdce068..883b10e8a1675 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,37 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.24.0",
+      "tag": "office-ui-fabric-react_v5.24.0",
+      "date": "Mon, 20 Nov 2017 11:12:47 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "90d78667bf6450b9e88deb16eaa4a525fee201b1",
+            "comment": "Persona: Changed size40 primaryText font size back 14px."
+          },
+          {
+            "author": "Spencer Elliott <me@elliottsj.com>",
+            "commit": "f6726899890fd97c15c57ddd7337c383cd5f661d",
+            "comment": "DetailsList: preserve focus only if active element leaves the list"
+          },
+          {
+            "author": "Eddie Liu <leddie24@gmail.com>",
+            "commit": "67466325ed0ff6b89f82fa152860f968d8d740a0",
+            "comment": "Edit HoverCardPage, OverflowSetPage, ScrollablePanePage, TeachingBubblePage to use IComponentDemoPageProps"
+          }
+        ],
+        "minor": [
+          {
+            "author": "sathi23 <sathi23@gmail.com>",
+            "commit": "35a466a994844f6baa32b56ba5e4190f7f4e1055",
+            "comment": "calendar component ux changes plus exposing sixweeksbydefault"
+          }
+        ]
+      }
+    },
     {
       "version": "5.23.0",
       "tag": "office-ui-fabric-react_v5.23.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 894e5ec35ad82..524dbc38272f8 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 17 Nov 2017 17:36:36 GMT and should not be manually modified.
+This log was last generated on Mon, 20 Nov 2017 11:12:47 GMT and should not be manually modified.
+
+## 5.24.0
+Mon, 20 Nov 2017 11:12:47 GMT
+
+### Minor changes
+
+- calendar component ux changes plus exposing sixweeksbydefault
+
+### Patches
+
+- Persona: Changed size40 primaryText font size back 14px.
+- DetailsList: preserve focus only if active element leaves the list
+- Edit HoverCardPage, OverflowSetPage, ScrollablePanePage, TeachingBubblePage to use IComponentDemoPageProps
 
 ## 5.23.0
 Fri, 17 Nov 2017 17:36:36 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 2919e696b14f5..b27ba513a7829 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.23.0",
+  "version": "5.24.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 5650796c11f5baaf9868083805350b738fb17ab1 Mon Sep 17 00:00:00 2001
From: Kushal Yarlagadda <whykushal93@gmail.com>
Date: Mon, 20 Nov 2017 13:13:02 -0800
Subject: [PATCH 1050/1641] Contextual menu up/down arrow key behavior -
 preventing defaults (#3426)

* Preventing up/down arrow key presses from bubbling and triggering the browser default handler.

* Change file
---
 ...xtualMenuKeyBoarding_2017-11-17-22-47.json | 11 ++++
 .../ContextualMenu/ContextualMenu.tsx         |  2 +
 .../ContextualMenu/ContextualMenuPage.tsx     | 12 +++-
 .../ContextualMenu.ScrollBar.Example.tsx      | 56 +++++++++++++++++++
 4 files changed, 80 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/contextualMenuKeyBoarding_2017-11-17-22-47.json
 create mode 100644 packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.ScrollBar.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/contextualMenuKeyBoarding_2017-11-17-22-47.json b/common/changes/office-ui-fabric-react/contextualMenuKeyBoarding_2017-11-17-22-47.json
new file mode 100644
index 0000000000000..400c1eff587b0
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/contextualMenuKeyBoarding_2017-11-17-22-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Prevent default while handling up/down arrow keys on a contextual menu",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kushaly@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index c2a791faa82b3..111aad59e0a1e 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -672,6 +672,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
     if (elementToFocus) {
       elementToFocus.focus();
+      ev.preventDefault();
+      ev.stopPropagation();
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
index 763140898a2ff..793ba865b7991 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
@@ -12,6 +12,7 @@ import { ContextualMenuSubmenuExample } from './examples/ContextualMenu.Submenu.
 import { ContextualMenuCheckmarksExample } from './examples/ContextualMenu.Checkmarks.Example';
 import { ContextualMenuDirectionalExample } from './examples/ContextualMenu.Directional.Example';
 import { ContextualMenuCustomizationExample } from './examples/ContextualMenu.Customization.Example';
+import { ContextualMenuWithScrollBarExample } from './examples/ContextualMenu.ScrollBar.Example';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { ContextualMenuStatus } from './ContextualMenu.checklist';
 
@@ -22,6 +23,8 @@ const ContextualMenuSubmenuExampleCode = require('!raw-loader!office-ui-fabric-r
 const ContextualMenuCheckmarksExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx') as string;
 const ContextualMenuDirectionalExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx') as string;
 const ContextualMenuCustomizationExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx') as string;
+const ContextualMenuWithScrollBarExampleCode = require
+  ('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.ScrollBar.Example.tsx') as string;
 
 export class ContextualMenuPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
@@ -71,8 +74,15 @@ export class ContextualMenuPage extends React.Component<IComponentDemoPageProps,
               title='ContextualMenu with customized submenus'
               code={ ContextualMenuCustomizationExampleCode }
             >
-              <ContextualMenuCustomizationExample />
+              <ContextualMenuWithScrollBarExample />
             </ExampleCard>
+            <ExampleCard
+              title='ContextualMenu with a scroll bar and fixed direction'
+              code={ ContextualMenuWithScrollBarExampleCode }
+            >
+              <ContextualMenuWithScrollBarExample />
+            </ExampleCard>
+
           </div>
         }
         propertiesTables={
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.ScrollBar.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.ScrollBar.Example.tsx
new file mode 100644
index 0000000000000..69843784f3c28
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.ScrollBar.Example.tsx
@@ -0,0 +1,56 @@
+import * as React from 'react';
+import { DirectionalHint, ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
+import './ContextualMenuExample.scss';
+
+export class ContextualMenuWithScrollBarExample extends React.Component<any, any> {
+
+  constructor() {
+    super();
+    this.state = {
+      showCallout: false
+    };
+  }
+
+  public render() {
+    return (
+      <div>
+        <DefaultButton
+          id='ContextualMenuButton1'
+          text='Click for ContextualMenu'
+          menuProps={ {
+            shouldFocusOnMount: true,
+            directionalHint: DirectionalHint.bottomRightEdge,
+            directionalHintFixed: true,
+            items: [
+              {
+                key: 'newItem',
+                name: 'New'
+              },
+              {
+                key: 'rename',
+                name: 'Rename'
+              },
+              {
+                key: 'edit',
+                name: 'Edit'
+              },
+              {
+                key: 'properties',
+                name: 'Properties'
+              },
+              {
+                key: 'disabled',
+                name: 'Disabled item',
+                disabled: true
+              }
+            ],
+            calloutProps: {
+              calloutMaxHeight: 65
+            }
+          } }
+        />
+      </div>
+    );
+  }
+}

From fb253516b8bed6ddcd86c2fb37856de62256baf6 Mon Sep 17 00:00:00 2001
From: Scott Balentine <sbalentine88@gmail.com>
Date: Mon, 20 Nov 2017 17:41:05 -0800
Subject: [PATCH 1051/1641] give new textfield examples the right max width
 (#3435)

* give new textfield examples the right max width

* added a change file

* Update max-width-fix_2017-11-20-23-53.json
---
 .../max-width-fix_2017-11-20-23-53.json               | 11 +++++++++++
 .../examples/TextField.PrefixAndSuffix.Example.tsx    |  2 +-
 .../TextField/examples/TextField.Suffix.Example.tsx   |  2 +-
 3 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/max-width-fix_2017-11-20-23-53.json

diff --git a/common/changes/office-ui-fabric-react/max-width-fix_2017-11-20-23-53.json b/common/changes/office-ui-fabric-react/max-width-fix_2017-11-20-23-53.json
new file mode 100644
index 0000000000000..66a1a9dc6dc08
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/max-width-fix_2017-11-20-23-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "TextField example: match the max width for TextFields.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "sbalentine88@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.PrefixAndSuffix.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.PrefixAndSuffix.Example.tsx
index a711d9063e3d1..d2a5b9a69f8e6 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.PrefixAndSuffix.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.PrefixAndSuffix.Example.tsx
@@ -5,7 +5,7 @@ import './TextField.Examples.scss';
 export class TextFieldPrefixAndSuffixExample extends React.Component<any, any> {
   public render() {
     return (
-      <div className='ms-TextFieldExample'>
+      <div className='docs-TextFieldExample'>
         <TextField
           prefix='https://'
           suffix='.com'
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Suffix.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Suffix.Example.tsx
index da1397541bc36..498026d679824 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Suffix.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Suffix.Example.tsx
@@ -5,7 +5,7 @@ import './TextField.Examples.scss';
 export class TextFieldSuffixExample extends React.Component<any, any> {
   public render() {
     return (
-      <div className='ms-TextFieldExample'>
+      <div className='docs-TextFieldExample'>
         <TextField
           suffix='.com'
         />

From c567ffebeaef2f186480c2106bd7894bb80196bb Mon Sep 17 00:00:00 2001
From: chang47 <coralbue@gmail.com>
Date: Mon, 20 Nov 2017 19:10:17 -0800
Subject: [PATCH 1052/1641] SwatchColorPicker Color Cells: Adding Gray Border
 Around White Color Cells (#3429)

* added white cell border

* added white border to white color cell

* cleanup

* add change list

* added null check; style fix

* moved white cell style behind if check

* cleaned up style

* fixed lint problems

* got rid of type casting
---
 ...chan-whiteCellBorder_2017-11-18-02-13.json | 11 ++++++++++
 .../SwatchColorPicker/SwatchColorPicker.scss  | 20 +++++++++++++++++++
 .../SwatchColorPicker/SwatchColorPicker.tsx   | 15 +++++++++++++-
 .../SwatchColorPicker.Basic.Example.tsx       | 15 ++++++++------
 4 files changed, 54 insertions(+), 7 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/chiechan-whiteCellBorder_2017-11-18-02-13.json

diff --git a/common/changes/office-ui-fabric-react/chiechan-whiteCellBorder_2017-11-18-02-13.json b/common/changes/office-ui-fabric-react/chiechan-whiteCellBorder_2017-11-18-02-13.json
new file mode 100644
index 0000000000000..4af3d94dc7d04
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/chiechan-whiteCellBorder_2017-11-18-02-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ColorCells: Adding gray border to white color cells",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chiechan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
index 21a7c9b595821..9aa7c432fc533 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
@@ -71,6 +71,11 @@
       width: 12px;
       height: 12px;
       border: 4px solid $ms-color-neutralTertiaryAlt;
+
+      &.whiteColorCell {
+        padding: 4px;
+        margin: 0;
+      }
     }
   }
 
@@ -83,6 +88,11 @@
   &:active .svg {
     width: 12px;
     height: 12px;
+
+    &.whiteColorCell {
+      padding: 4px;
+      margin: 0;
+    }
   }
 
   &:hover .svg,
@@ -123,6 +133,16 @@
   }
 }
 
+.whiteColorCell {
+  padding: 0;
+  border: 1px solid #D2D2D2;
+  margin: 4px;
+
+  &.circle {
+    border-radius: 100%;
+  }
+}
+
 .swatchColorPickerContainer {
   clear: both;
   display: block;
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
index 8a61518cf6177..40c01cac8d43b 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
@@ -180,7 +180,7 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
   private _onRenderColorOption(colorOption: IColorCellProps): JSX.Element {
     // Build an SVG for the cell with the given shape and color properties
     return (
-      <svg className={ css(styles.svg, this.props.cellShape, this.props.cellShape === 'circle' ? styles.circle : '') } viewBox='0 0 20 20' fill={ getColorFromString(colorOption.color as string)!.str } >
+      <svg className={ css(styles.svg, this.props.cellShape, this.props.cellShape === 'circle' ? styles.circle : '', this._getWhiteCellStyle(colorOption.color)) } viewBox='0 0 20 20' fill={ getColorFromString(colorOption.color as string)!.str } >
         {
           this.props.cellShape === 'circle' ?
             <circle cx='50%' cy='50%' r='50%' /> :
@@ -214,4 +214,17 @@ export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, IS
       });
     }
   }
+
+  /**
+   * Get the white color cell style
+   * @param inputColor - The color of the current cell
+   * @returns - The White color cell style if the current style is white, empty otherwise
+   */
+  private _getWhiteCellStyle(inputColor: string | undefined): string {
+    if (inputColor || inputColor!.toLocaleLowerCase() !== '#ffffff') {
+      return '';
+    } else {
+      return styles.whiteColorCell;
+    }
+  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
index 5dd52c0f53338..9dedb95c4f399 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
@@ -21,27 +21,29 @@ export class SwatchColorPickerBasicExample extends React.Component<any, IBasicSw
       <div>
         <div>Simple circle swatch color picker:</div>
         <SwatchColorPicker
-          columnCount={ 4 }
+          columnCount={ 5 }
           cellShape={ 'circle' }
           colorCells={
             [
               { id: 'a', label: 'green', color: '#00ff00' },
               { id: 'b', label: 'orange', color: '#ffa500' },
               { id: 'c', label: 'blue', color: '#0000ff' },
-              { id: 'd', label: 'red', color: '#ff0000' }
+              { id: 'd', label: 'red', color: '#ff0000' },
+              { id: 'e', label: 'white', color: '#ffffff' }
             ]
           }
         />
         <div>Simple square swatch color picker:</div>
         <SwatchColorPicker
-          columnCount={ 4 }
+          columnCount={ 5 }
           cellShape={ 'square' }
           colorCells={
             [
               { id: 'a', label: 'green', color: '#00ff00' },
               { id: 'b', label: 'orange', color: '#ffa500' },
               { id: 'c', label: 'blue', color: '#0000ff' },
-              { id: 'd', label: 'red', color: '#ff0000' }
+              { id: 'd', label: 'red', color: '#ff0000' },
+              { id: 'e', label: 'white', color: '#ffffff' }
             ]
           }
         />
@@ -76,14 +78,15 @@ export class SwatchColorPickerBasicExample extends React.Component<any, IBasicSw
         <div>Simple disabled circle swatch color picker:</div>
         <SwatchColorPicker
           disabled={ true }
-          columnCount={ 4 }
+          columnCount={ 5 }
           cellShape={ 'circle' }
           colorCells={
             [
               { id: 'a', label: 'green', color: '#00ff00' },
               { id: 'b', label: 'orange', color: '#ffa500' },
               { id: 'c', label: 'blue', color: '#0000ff' },
-              { id: 'd', label: 'red', color: '#ff0000' }
+              { id: 'd', label: 'red', color: '#ff0000' },
+              { id: 'e', label: 'white', color: '#ffffff' }
             ]
           }
         />

From f6c9a582a4cecbf7fadd536379d72ac2c0073577 Mon Sep 17 00:00:00 2001
From: Peter Jahn <pejahn@microsoft.com>
Date: Mon, 20 Nov 2017 21:11:55 -0800
Subject: [PATCH 1053/1641] Fix typos & grammar for experiments README (#3437)

---
 packages/experiments/README.md | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/experiments/README.md b/packages/experiments/README.md
index 72299e9471c98..ab4dc1ccbd886 100644
--- a/packages/experiments/README.md
+++ b/packages/experiments/README.md
@@ -1,16 +1,16 @@
-# [Office UI Fabric React Experiments](http://dev.office.com/fabric)
+# [Office UI Fabric React Experiments](http://dev.microsoft.com/fabric)
 
 ##### Experimental components for Office UI Fabric React
 
-These are not production ready components and __should never be used in product__. This experimental space is useful for testing new components whos API might change before final release.
+These are not production ready components and __should never be used in product__. This experimental space is useful for testing new components whose APIs might change before final release.
 
-To import experimantal components:
+To import experimental components:
 
 ```js
 import { ComponentName } from '@uifabric/experiments/lib/ComponentName';
 ```
 
-Once the experimental component graduates to a production release the component will be available at:
+Once the experimental component graduates to a production release, the component will be available at:
 
 ```js
 import { ComponentName } from 'office-ui-fabric-react/lib/ComponentName';

From c696515377ad42112cb3f5dace168e9dd686a6d9 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 21 Nov 2017 03:21:39 -0800
Subject: [PATCH 1054/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...chan-whiteCellBorder_2017-11-18-02-13.json | 11 ---------
 ...xtualMenuKeyBoarding_2017-11-17-22-47.json | 11 ---------
 .../max-width-fix_2017-11-20-23-53.json       | 11 ---------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 24 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 11 ++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 12 files changed, 41 insertions(+), 41 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/chiechan-whiteCellBorder_2017-11-18-02-13.json
 delete mode 100644 common/changes/office-ui-fabric-react/contextualMenuKeyBoarding_2017-11-17-22-47.json
 delete mode 100644 common/changes/office-ui-fabric-react/max-width-fix_2017-11-20-23-53.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 986f67cd63c9a..94fdf5d6a9d44 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.24.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.24.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 4eb49404a7123..04d3ffd8fcc15 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.24.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.24.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 20e0193dc94af..74b0ddfba0cb8 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.24.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.24.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 90df1a87e0283..fc294e313057d 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.24.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.24.1 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 2e4c5d6ef672e..afe415439791f 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.24.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.24.1 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/chiechan-whiteCellBorder_2017-11-18-02-13.json b/common/changes/office-ui-fabric-react/chiechan-whiteCellBorder_2017-11-18-02-13.json
deleted file mode 100644
index 4af3d94dc7d04..0000000000000
--- a/common/changes/office-ui-fabric-react/chiechan-whiteCellBorder_2017-11-18-02-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ColorCells: Adding gray border to white color cells",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chiechan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/contextualMenuKeyBoarding_2017-11-17-22-47.json b/common/changes/office-ui-fabric-react/contextualMenuKeyBoarding_2017-11-17-22-47.json
deleted file mode 100644
index 400c1eff587b0..0000000000000
--- a/common/changes/office-ui-fabric-react/contextualMenuKeyBoarding_2017-11-17-22-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Prevent default while handling up/down arrow keys on a contextual menu",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kushaly@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/max-width-fix_2017-11-20-23-53.json b/common/changes/office-ui-fabric-react/max-width-fix_2017-11-20-23-53.json
deleted file mode 100644
index 66a1a9dc6dc08..0000000000000
--- a/common/changes/office-ui-fabric-react/max-width-fix_2017-11-20-23-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "TextField example: match the max width for TextFields.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "sbalentine88@gmail.com"
-}
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 2faeb4e5cf3d2..0f1a137b35afa 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.24.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.24.1 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 883b10e8a1675..a46352a9a1c84 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.24.1",
+      "tag": "office-ui-fabric-react_v5.24.1",
+      "date": "Tue, 21 Nov 2017 11:21:39 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "chang47 <coralbue@gmail.com>",
+            "commit": "c567ffebeaef2f186480c2106bd7894bb80196bb",
+            "comment": "ColorCells: Adding gray border to white color cells"
+          },
+          {
+            "author": "Kushal Yarlagadda <whykushal93@gmail.com>",
+            "commit": "5650796c11f5baaf9868083805350b738fb17ab1",
+            "comment": "Prevent default while handling up/down arrow keys on a contextual menu"
+          },
+          {
+            "author": "Scott Balentine <sbalentine88@gmail.com>",
+            "commit": "fb253516b8bed6ddcd86c2fb37856de62256baf6",
+            "comment": "TextField example: match the max width for TextFields."
+          }
+        ]
+      }
+    },
     {
       "version": "5.24.0",
       "tag": "office-ui-fabric-react_v5.24.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 524dbc38272f8..8b11f5d1eba86 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,15 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 20 Nov 2017 11:12:47 GMT and should not be manually modified.
+This log was last generated on Tue, 21 Nov 2017 11:21:39 GMT and should not be manually modified.
+
+## 5.24.1
+Tue, 21 Nov 2017 11:21:39 GMT
+
+### Patches
+
+- ColorCells: Adding gray border to white color cells
+- Prevent default while handling up/down arrow keys on a contextual menu
+- TextField example: match the max width for TextFields.
 
 ## 5.24.0
 Mon, 20 Nov 2017 11:12:47 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index b27ba513a7829..289d2b2a63cc4 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.24.0",
+  "version": "5.24.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From f42c1f5dfcdfae5967837c3635dd02584235c771 Mon Sep 17 00:00:00 2001
From: pipi1007 <pipi1007@hotmail.com>
Date: Tue, 21 Nov 2017 17:23:23 -0800
Subject: [PATCH 1055/1641] Add small headline with margin and wide mode
 (#3441)

* Add small header with margin and wide callout

* Add change file

* Remove unneeded change

* unneeded change 2

* Add story test and update comment

* Update TeachingBubble.stories.tsx
---
 .../src/stories/TeachingBubble.stories.tsx    | 54 ++++++++++++++
 .../master_2017-11-21-18-17.json              | 11 +++
 .../TeachingBubble/TeachingBubble.scss        | 33 ++++++++-
 .../TeachingBubble/TeachingBubble.tsx         |  2 +-
 .../TeachingBubble/TeachingBubble.types.ts    | 10 +++
 .../TeachingBubble/TeachingBubbleContent.tsx  | 10 ++-
 .../TeachingBubble/TeachingBubblePage.tsx     | 10 +++
 .../TeachingBubble.SmallHeadline.Example.tsx  | 61 ++++++++++++++++
 ...eachingBubble.WideIllustration.Example.tsx | 73 +++++++++++++++++++
 9 files changed, 258 insertions(+), 6 deletions(-)
 create mode 100644 apps/vr-tests/src/stories/TeachingBubble.stories.tsx
 create mode 100644 common/changes/office-ui-fabric-react/master_2017-11-21-18-17.json
 create mode 100644 packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.SmallHeadline.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.WideIllustration.Example.tsx

diff --git a/apps/vr-tests/src/stories/TeachingBubble.stories.tsx b/apps/vr-tests/src/stories/TeachingBubble.stories.tsx
new file mode 100644
index 0000000000000..be38395f49f29
--- /dev/null
+++ b/apps/vr-tests/src/stories/TeachingBubble.stories.tsx
@@ -0,0 +1,54 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecoratorTall } from '../utilities';
+import { TeachingBubble } from 'office-ui-fabric-react/lib/TeachingBubble';
+import { IImageProps } from 'office-ui-fabric-react/lib/Image';
+import { IButtonProps } from 'office-ui-fabric-react/lib/Button';
+import { DirectionalHint } from 'office-ui-fabric-react/lib/common/DirectionalHint';
+
+// tslint:disable:max-line-length
+storiesOf('TeachingBubble', module)
+  .addDecorator(FabricDecoratorTall)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.ms-TeachingBubble' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('WideIllustration', () => {
+    let exampleImageProps: IImageProps = { src: 'http://placehold.it/364x140' };
+    let examplePrimaryButton: IButtonProps = {
+      children: 'Got it',
+    };
+    return <TeachingBubble
+      illustrationImage={ exampleImageProps }
+      calloutProps={ { directionalHint: DirectionalHint.bottomCenter } }
+      isWide={ true }
+      hasSmallHeadline={ true }
+      hasCloseIcon={ true }
+      primaryButtonProps={ examplePrimaryButton }
+      headline='Discover what’s trending around you'
+    >
+      Lorem ipsum dolor sit amet, consectetur adipisicing elit. Facere, nulla, ipsum? Molestiae quis aliquam magni harum non?
+      Modal content
+    </TeachingBubble >
+  })
+  .add('SmallHeadline', () => {
+    let examplePrimaryButton: IButtonProps = {
+      children: 'Got it',
+    };
+    return <TeachingBubble
+      hasSmallHeadline={ true }
+      hasCloseIcon={ true }
+      primaryButtonProps={ examplePrimaryButton }
+      headline='Discover what’s trending around you'
+    >
+      Lorem ipsum dolor sit amet, consectetur adipisicing elit. Facere, nulla, ipsum? Molestiae quis aliquam magni harum non?
+    </TeachingBubble>
+  });
diff --git a/common/changes/office-ui-fabric-react/master_2017-11-21-18-17.json b/common/changes/office-ui-fabric-react/master_2017-11-21-18-17.json
new file mode 100644
index 0000000000000..1b79982d75ba3
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2017-11-21-18-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add small headline with margin and wide callout with image on the left side",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "johnyan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.scss b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.scss
index 02aaea2427a95..54c4ce0011edf 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.scss
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.scss
@@ -10,6 +10,8 @@
 .root {
   display: block;
   max-width: 364px;
+  border: 0;
+  box-shadow: none !important;
 }
 
 .bodyContent {
@@ -20,6 +22,10 @@
   margin-bottom: 14px;
 }
 
+.headerIsSmall:not(:last-child) {
+  margin-bottom: 14px;
+}
+
 .headline {
   margin: 0;
   color: $ms-color-white;
@@ -29,6 +35,12 @@
     font-weight: $ms-font-weight-light;
   }
 
+  .headerIsCondensed & {
+    @include ms-font-m;
+    @include ms-margin-right(10px);
+    font-weight: $ms-font-weight-semibold;
+  }
+
   .headerIsSmall & {
     @include ms-font-m;
     @include ms-margin-right(10px);
@@ -70,6 +82,25 @@
   }
 }
 
+.wideCallout {
+  max-width: 456px;
+
+  :global(.ms-TeachingBubble-content) {
+    display: flex;
+  }
+
+  :global(.ms-TeachingBubble-image) {
+    display: flex;
+    align-items: center;
+    padding-left: 20px;
+    max-width: 154px;
+  }
+}
+
+.wideCallout .bodyContent {
+  max-width: 302px;
+}
+
 //Primary button style override
 .root .primaryButton {
   background-color: $ms-color-white;
@@ -86,7 +117,7 @@
   }
 
   &:focus {
-    background-color:  $ms-color-themeLighter;
+    background-color: $ms-color-themeLighter;
     border-color: $ms-color-white;
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
index 1a9acfd2249cc..cc7c4cf1eeb6c 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
@@ -39,7 +39,7 @@ export class TeachingBubble extends BaseComponent<ITeachingBubbleProps, ITeachin
 
     return (
       <Callout
-        className={ css('ms-TeachingBubble', styles.root) }
+        className={ css('ms-TeachingBubble', styles.root, this.props.isWide ? styles.wideCallout : null) }
         ref={ this._resolveRef('_callout') }
         target={ targetElement }
         {...calloutProps}
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.types.ts b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.types.ts
index 4b89b02c031a3..927dbbd597b0f 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.types.ts
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.types.ts
@@ -65,4 +65,14 @@ export interface ITeachingBubbleProps extends React.Props<TeachingBubble | Teach
    * Callback when the TeachingBubble tries to close.
    */
   onDismiss?: (ev?: any) => void;
+
+  /**
+   * Whether or not the Teaching Bubble is wide, with image on the left side.
+   */
+  isWide?: boolean;
+
+  /**
+   * A variation with smaller bold headline and margins to the body (hasCondensedHeadline takes precedence if it is also set to true).
+   */
+  hasSmallHeadline?: boolean;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubbleContent.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubbleContent.tsx
index 2759b6e6c1e59..ccbe99d2bbdcb 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubbleContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubbleContent.tsx
@@ -38,7 +38,7 @@ export class TeachingBubbleContent extends BaseComponent<ITeachingBubbleProps, I
   }
 
   public render() {
-    let { illustrationImage, primaryButtonProps, secondaryButtonProps, headline, hasCondensedHeadline, hasCloseIcon, onDismiss, closeButtonAriaLabel } = this.props;
+    let { illustrationImage, primaryButtonProps, secondaryButtonProps, headline, hasCondensedHeadline, hasCloseIcon, onDismiss, closeButtonAriaLabel, hasSmallHeadline } = this.props;
 
     let imageContent;
     let headerContent;
@@ -48,7 +48,7 @@ export class TeachingBubbleContent extends BaseComponent<ITeachingBubbleProps, I
 
     if (illustrationImage && illustrationImage.src) {
       imageContent = (
-        <div className={ 'ms-TeachingBubble-header' }>
+        <div className={ 'ms-TeachingBubble-header ms-TeachingBubble-image' }>
           <Image { ...illustrationImage as any } />
         </div>
       );
@@ -60,8 +60,10 @@ export class TeachingBubbleContent extends BaseComponent<ITeachingBubbleProps, I
           className={ css(
             'ms-TeachingBubble-header',
             hasCondensedHeadline ?
-              'ms-TeachingBubble-header--small ' + styles.headerIsSmall :
-              'ms-TeachingBubble-header--large ' + styles.headerIsLarge
+              'ms-TeachingBubble-header--condensed ' + styles.headerIsCondensed
+              : hasSmallHeadline
+                ? 'ms-TeachingBubble-header--small ' + styles.headerIsSmall
+                : 'ms-TeachingBubble-header--large ' + styles.headerIsLarge
           ) }
         >
           <p className={ css('ms-TeachingBubble-headline', styles.headline) } >
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubblePage.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubblePage.tsx
index 72c443f9df2eb..10b1490033ca6 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubblePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubblePage.tsx
@@ -9,12 +9,16 @@ import {
 import { TeachingBubbleBasicExample } from './examples/TeachingBubble.Basic.Example';
 import { TeachingBubbleCondensedExample } from './examples/TeachingBubble.Condensed.Example';
 import { TeachingBubbleIllustrationExample } from './examples/TeachingBubble.Illustration.Example';
+import { TeachingBubbleWideIllustrationExample } from './examples/TeachingBubble.WideIllustration.Example';
+import { TeachingBubbleSmallHeadlineExample } from './examples/TeachingBubble.SmallHeadline.Example';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { TeachingBubbleStatus } from './TeachingBubble.checklist';
 
 const TeachingBubbleBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx') as string;
 const TeachingBubbleCondensedExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Condensed.Example.tsx') as string;
 const TeachingBubbleIllustrationExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx') as string;
+const TeachingBubbleWideIllustrationExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.WideIllustration.Example.tsx') as string;
+const TeachingBubbleSmallHeadlineExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.SmallHeadline.Example.tsx') as string;
 
 export class TeachingBubblePage extends React.Component<IComponentDemoPageProps, any> {
   public render() {
@@ -33,6 +37,12 @@ export class TeachingBubblePage extends React.Component<IComponentDemoPageProps,
             <ExampleCard title='TeachingBubble with Illustration' code={ TeachingBubbleIllustrationExampleCode }>
               <TeachingBubbleIllustrationExample />
             </ExampleCard>
+            <ExampleCard title='TeachingBubble wide with Illustration' code={ TeachingBubbleWideIllustrationExampleCode }>
+              <TeachingBubbleWideIllustrationExample />
+            </ExampleCard>
+            <ExampleCard title='TeachingBubble with small headline' code={ TeachingBubbleSmallHeadlineExampleCode }>
+              <TeachingBubbleSmallHeadlineExample />
+            </ExampleCard>
           </LayerHost>
         }
         propertiesTables={
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.SmallHeadline.Example.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.SmallHeadline.Example.tsx
new file mode 100644
index 0000000000000..4d64ce4048d50
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.SmallHeadline.Example.tsx
@@ -0,0 +1,61 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+import { DefaultButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
+import { TeachingBubble } from 'office-ui-fabric-react/lib/TeachingBubble';
+
+export interface ITeachingBubbleSmallHeadlineExampleState {
+  isTeachingBubbleVisible?: boolean;
+}
+
+export class TeachingBubbleSmallHeadlineExample extends React.Component<any, ITeachingBubbleSmallHeadlineExampleState> {
+  private _menuButtonElement: HTMLElement;
+
+  public constructor() {
+    super();
+
+    this._onDismiss = this._onDismiss.bind(this);
+
+    this.state = {
+      isTeachingBubbleVisible: false,
+    };
+  }
+
+  public render() {
+    let { isTeachingBubbleVisible } = this.state;
+    let examplePrimaryButton: IButtonProps = {
+      children: 'Try it out',
+    };
+
+    return (
+      <div className='ms-TeachingBubbleExample'>
+        <span className='ms-TeachingBubbleBasicExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton! }>
+          <DefaultButton
+            onClick={ this._onDismiss }
+            text={ isTeachingBubbleVisible ? 'Hide TeachingBubble' : 'Show TeachingBubble' }
+          />
+        </span>
+        { isTeachingBubbleVisible ? (
+          <div>
+            <TeachingBubble
+              targetElement={ this._menuButtonElement }
+              hasSmallHeadline={ true }
+              onDismiss={ this._onDismiss }
+              hasCloseIcon={ true }
+              primaryButtonProps={ examplePrimaryButton }
+              headline='Discover what’s trending around you'
+            >
+              Lorem ipsum dolor sit amet, consectetur adipisicing elit. Facere, nulla, ipsum? Molestiae quis aliquam magni harum non?
+            </TeachingBubble>
+          </div>
+        ) : (null) }
+      </div>
+    );
+  }
+
+  private _onDismiss(ev: any) {
+    this.setState({
+      isTeachingBubbleVisible: !this.state.isTeachingBubbleVisible
+    });
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.WideIllustration.Example.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.WideIllustration.Example.tsx
new file mode 100644
index 0000000000000..029eff69d4ba8
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.WideIllustration.Example.tsx
@@ -0,0 +1,73 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+
+import { IImageProps } from 'office-ui-fabric-react/lib/Image';
+import { DefaultButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
+import { TeachingBubble } from 'office-ui-fabric-react/lib/TeachingBubble';
+import { DirectionalHint } from 'office-ui-fabric-react/lib/common/DirectionalHint';
+
+export interface ITeachingBubbleWideIllustrationExampleState {
+  isTeachingBubbleVisible?: boolean;
+}
+
+export class TeachingBubbleWideIllustrationExample extends React.Component<any, ITeachingBubbleWideIllustrationExampleState> {
+  private _menuButtonElement: HTMLElement;
+
+  public constructor() {
+    super();
+
+    this._onDismiss = this._onDismiss.bind(this);
+
+    this.state = {
+      isTeachingBubbleVisible: false,
+    };
+  }
+
+  public render() {
+    let { isTeachingBubbleVisible } = this.state;
+    let exampleImageProps: IImageProps = { src: 'http://placehold.it/364x140' };
+    let examplePrimaryButton: IButtonProps = {
+      children: 'Try it out',
+    };
+    let exampleSecondaryButtonProps: IButtonProps = {
+      children: 'May be later',
+      onClick: this._onDismiss
+    };
+
+    return (
+      <div className='ms-TeachingBubbleExample'>
+        <span className='ms-TeachingBubbleBasicExample-buttonArea' ref={ (menuButton) => this._menuButtonElement = menuButton! }>
+          <DefaultButton
+            onClick={ this._onDismiss }
+            text={ isTeachingBubbleVisible ? 'Hide TeachingBubble' : 'Show TeachingBubble' }
+          />
+        </span>
+        { isTeachingBubbleVisible ? (
+          <div>
+            <TeachingBubble
+              illustrationImage={ exampleImageProps }
+              calloutProps={ { directionalHint: DirectionalHint.bottomCenter } }
+              isWide={ true }
+              hasSmallHeadline={ true }
+              hasCloseIcon={ true }
+              targetElement={ this._menuButtonElement }
+              primaryButtonProps={ examplePrimaryButton }
+              secondaryButtonProps={ exampleSecondaryButtonProps }
+              onDismiss={ this._onDismiss }
+              headline='Discover what’s trending around you'
+            >
+              Lorem ipsum dolor sit amet, consectetur adipisicing elit. Facere, nulla, ipsum? Molestiae quis aliquam magni harum non?
+            </TeachingBubble>
+          </div>
+        ) : (null) }
+      </div>
+    );
+  }
+
+  private _onDismiss(ev: any) {
+    this.setState({
+      isTeachingBubbleVisible: !this.state.isTeachingBubbleVisible
+    });
+  }
+}

From 5fa2b72659eb3890be2541ddf9bf77b6a7129350 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 22 Nov 2017 11:12:40 +0000
Subject: [PATCH 1056/1641] Applying package updates.

---
 apps/fabric-website/package.json                   |  2 +-
 apps/ssr-tests/package.json                        |  2 +-
 apps/test-bundle-button/package.json               |  2 +-
 apps/todo-app/package.json                         |  2 +-
 apps/vr-tests/package.json                         |  2 +-
 .../master_2017-11-21-18-17.json                   | 11 -----------
 packages/experiments/package.json                  |  2 +-
 packages/office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md       |  9 ++++++++-
 packages/office-ui-fabric-react/package.json       |  2 +-
 10 files changed, 29 insertions(+), 19 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/master_2017-11-21-18-17.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 94fdf5d6a9d44..9737d3901ef8b 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.24.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.24.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 04d3ffd8fcc15..0f20f3b251519 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.24.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.24.2 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 74b0ddfba0cb8..79b6ea6e19ff4 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.24.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.24.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index fc294e313057d..e0e89cee4e384 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.24.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.24.2 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index afe415439791f..080895d6dd970 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.24.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.24.2 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/master_2017-11-21-18-17.json b/common/changes/office-ui-fabric-react/master_2017-11-21-18-17.json
deleted file mode 100644
index 1b79982d75ba3..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2017-11-21-18-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add small headline with margin and wide callout with image on the left side",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "johnyan@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 0f1a137b35afa..b878cc21e9a42 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.24.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.24.2 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index a46352a9a1c84..dda9fed883cb8 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.24.2",
+      "tag": "office-ui-fabric-react_v5.24.2",
+      "date": "Wed, 22 Nov 2017 11:12:40 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "pipi1007 <pipi1007@hotmail.com>",
+            "commit": "f42c1f5dfcdfae5967837c3635dd02584235c771",
+            "comment": "Add small headline with margin and wide callout with image on the left side"
+          }
+        ]
+      }
+    },
     {
       "version": "5.24.1",
       "tag": "office-ui-fabric-react_v5.24.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 8b11f5d1eba86..60f5dc7540c36 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 21 Nov 2017 11:21:39 GMT and should not be manually modified.
+This log was last generated on Wed, 22 Nov 2017 11:12:40 GMT and should not be manually modified.
+
+## 5.24.2
+Wed, 22 Nov 2017 11:12:40 GMT
+
+### Patches
+
+- Add small headline with margin and wide callout with image on the left side
 
 ## 5.24.1
 Tue, 21 Nov 2017 11:21:39 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 289d2b2a63cc4..e2006b88e6572 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.24.1",
+  "version": "5.24.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From e43cac6884892e8615246d22e74c1adc4f5922e3 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Wed, 22 Nov 2017 18:46:20 +0200
Subject: [PATCH 1057/1641] ContextualMenu: Add a prop for setting the min
 width to be equal to the width of the target (#3431)

* Add useTargetAsMinWidth prop

* Rush change
---
 .../MenuMinWidth_2017-11-20-15-20.json          | 11 +++++++++++
 .../ContextualMenu/ContextualMenu.tsx           | 17 ++++++++++++-----
 .../ContextualMenu/ContextualMenu.types.ts      |  6 ++++++
 3 files changed, 29 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/MenuMinWidth_2017-11-20-15-20.json

diff --git a/common/changes/office-ui-fabric-react/MenuMinWidth_2017-11-20-15-20.json b/common/changes/office-ui-fabric-react/MenuMinWidth_2017-11-20-15-20.json
new file mode 100644
index 0000000000000..30e47dbf9a1a6
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/MenuMinWidth_2017-11-20-15-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: Add a prop for setting the min width to be equal to the width of the target",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 111aad59e0a1e..0eeac491ed6bf 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -203,6 +203,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       target,
       bounds,
       useTargetWidth,
+      useTargetAsMinWidth,
       directionalHintFixed,
       shouldFocusOnMount,
       title,
@@ -240,11 +241,17 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
      */
     let contextMenuStyle;
     let targetAsHtmlElement = this._target as HTMLElement;
-    if (useTargetWidth && targetAsHtmlElement && targetAsHtmlElement.offsetWidth) {
-      let contextMenuWidth = targetAsHtmlElement.offsetWidth;
-      contextMenuStyle = {
-        width: contextMenuWidth
-      };
+    if ((useTargetWidth || useTargetAsMinWidth) && targetAsHtmlElement && targetAsHtmlElement.offsetWidth) {
+      let targetWidth = targetAsHtmlElement.offsetWidth;
+      if (useTargetWidth) {
+        contextMenuStyle = {
+          width: targetWidth
+        };
+      } else if (useTargetAsMinWidth) {
+        contextMenuStyle = {
+          minWidth: targetWidth
+        };
+      }
     }
 
     // The menu should only return if items were provided, if no items were provided then it should not appear.
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
index f25555ccaed7d..63c5954152312 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
@@ -71,6 +71,12 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
    */
   useTargetWidth?: boolean;
 
+  /**
+   * If true the context menu will have a minimum width equal to the width of the target element
+   * @default false
+   */
+  useTargetAsMinWidth?: boolean;
+
   /**
    * The bounding rectangle for which the contextual menu can appear in.
    */

From d6b160b67456101362c1b241b4c4ee6d11850fdb Mon Sep 17 00:00:00 2001
From: staylo8 <33881401+staylo8@users.noreply.github.com>
Date: Wed, 22 Nov 2017 10:54:22 -0800
Subject: [PATCH 1058/1641] ResizeGroup should apply className from props
 (#3450)

* Apply props.className in ResizeGroup. Add snapshot for ResizeGroup. Pass className from experiments CommandBarTests. Update experiments CommandBar snapshot

* Committing change files

* Fix change file
---
 ...izeGroupPropClassName_2017-11-22-18-30.json | 11 +++++++++++
 ...izeGroupPropClassName_2017-11-22-18-30.json | 11 +++++++++++
 .../components/CommandBar/CommandBar.test.tsx  |  1 +
 .../__snapshots__/CommandBar.test.tsx.snap     |  2 +-
 .../ResizeGroup/ResizeGroup.test.tsx           | 15 +++++++++++++++
 .../src/components/ResizeGroup/ResizeGroup.tsx |  4 ++--
 .../__snapshots__/ResizeGroup.test.tsx.snap    | 18 ++++++++++++++++++
 7 files changed, 59 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/staylo8-3447ResizeGroupPropClassName_2017-11-22-18-30.json
 create mode 100644 common/changes/office-ui-fabric-react/staylo8-3447ResizeGroupPropClassName_2017-11-22-18-30.json
 create mode 100644 packages/office-ui-fabric-react/src/components/ResizeGroup/__snapshots__/ResizeGroup.test.tsx.snap

diff --git a/common/changes/@uifabric/experiments/staylo8-3447ResizeGroupPropClassName_2017-11-22-18-30.json b/common/changes/@uifabric/experiments/staylo8-3447ResizeGroupPropClassName_2017-11-22-18-30.json
new file mode 100644
index 0000000000000..ecd654ddc2529
--- /dev/null
+++ b/common/changes/@uifabric/experiments/staylo8-3447ResizeGroupPropClassName_2017-11-22-18-30.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Apply props.className in ResizeGroup. Add snapshot for ResizeGroup. Pass className from experiments CommandBarTests. Update experiments CommandBar snapshot",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "staylo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/staylo8-3447ResizeGroupPropClassName_2017-11-22-18-30.json b/common/changes/office-ui-fabric-react/staylo8-3447ResizeGroupPropClassName_2017-11-22-18-30.json
new file mode 100644
index 0000000000000..15751222586a4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/staylo8-3447ResizeGroupPropClassName_2017-11-22-18-30.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Apply props.className in ResizeGroup. Add snapshot for ResizeGroup. Pass className from experiments CommandBarTests. Update experiments CommandBar snapshot",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "staylo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.test.tsx b/packages/experiments/src/components/CommandBar/CommandBar.test.tsx
index deaa3f856111d..6a5b3c6b4983e 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.test.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBar.test.tsx
@@ -24,6 +24,7 @@ describe('CommandBar', () => {
           { key: '1', name: 'asdf' },
           { key: '2', name: 'asdf' }
         ] }
+        className={ 'TestClassName' }
       />
     ).toJSON()).toMatchSnapshot();
   });
diff --git a/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap b/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
index da84cde9a36f8..59bea0ec685c4 100644
--- a/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
+++ b/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
@@ -2,7 +2,7 @@
 
 exports[`CommandBar renders commands correctly 1`] = `
 <div
-  className="ms-ResizeGroup"
+  className="ms-ResizeGroup TestClassName"
 >
   <div
     className=""
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
index 8b05c2bca0454..d5d8e2e6305b6 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
@@ -4,6 +4,7 @@ import { shallow } from 'enzyme';
 import { ResizeGroup, IResizeGroupState, getNextResizeGroupStateProvider, getMeasurementCache } from './ResizeGroup';
 import { IResizeGroupProps } from './ResizeGroup.types';
 import * as sinon from 'sinon';
+import * as renderer from 'react-test-renderer';
 
 interface ITestScalingData {
   scalingIndex: number;
@@ -24,6 +25,20 @@ function getRequiredResizeGroupProps() {
 }
 
 describe('ResizeGroup', () => {
+  it('renders the ResizeGroup correctly', () => {
+    const initialData = { content: 5 };
+    const renderedDataId = 'onRenderDataId';
+    const onRenderData = (data: any) => <div id={ renderedDataId }> Rendered data: { data.content }</div >;
+    expect(renderer.create(
+      <ResizeGroup
+        data={ initialData }
+        onReduceData={ onReduceScalingData }
+        onRenderData={ onRenderData }
+        className={ 'TestClassName' }
+      />
+    ).toJSON()).toMatchSnapshot();
+  });
+
   it('renders the result of onRenderData', () => {
     const initialData = { content: 5 };
     const renderedDataId = 'onRenderDataId';
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index 4ceaadf211353..a4c1f031d5819 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -287,11 +287,11 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
   }
 
   public render() {
-    const { onRenderData } = this.props;
+    const { onRenderData, className } = this.props;
     const { dataToMeasure, renderedData } = this.state;
 
     return (
-      <div className={ css('ms-ResizeGroup') } ref={ this._resolveRef('_root') }>
+      <div className={ css('ms-ResizeGroup', className) } ref={ this._resolveRef('_root') }>
         { this._nextResizeGroupStateProvider.shouldRenderDataToMeasureInHiddenDiv(dataToMeasure) && (
           <div className={ css(styles.measured) } ref={ this._resolveRef('_measured') }>
             { onRenderData(dataToMeasure) }
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/__snapshots__/ResizeGroup.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ResizeGroup/__snapshots__/ResizeGroup.test.tsx.snap
new file mode 100644
index 0000000000000..4cfbc5ed5880d
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/__snapshots__/ResizeGroup.test.tsx.snap
@@ -0,0 +1,18 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ResizeGroup renders the ResizeGroup correctly 1`] = `
+<div
+  className="ms-ResizeGroup TestClassName"
+>
+  <div
+    className=""
+  >
+    <div
+      id="onRenderDataId"
+    >
+       Rendered data: 
+      5
+    </div>
+  </div>
+</div>
+`;

From bdd402cc01fad59de4d7c79241ec2a1a164aa92c Mon Sep 17 00:00:00 2001
From: Casey Yu <caseyyu2@gmail.com>
Date: Wed, 22 Nov 2017 14:27:41 -0800
Subject: [PATCH 1059/1641] Modifying the combobox dropdown alignment to have
 the scrollbar align with the target element (#3402)

* changing combobox dropdown calculation

* deleting unused variable

* creating change file

* changing the width to match dropdown style

* moving dropdown prop into combobox prop
---
 ...u2-comboboxDropdownAlignment_2017-11-16-19-43.json | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.tsx              |  9 ++++++---
 .../src/components/ComboBox/ComboBox.types.ts         |  6 ++++++
 3 files changed, 23 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-caseyyu2-comboboxDropdownAlignment_2017-11-16-19-43.json

diff --git a/common/changes/office-ui-fabric-react/users-caseyyu2-comboboxDropdownAlignment_2017-11-16-19-43.json b/common/changes/office-ui-fabric-react/users-caseyyu2-comboboxDropdownAlignment_2017-11-16-19-43.json
new file mode 100644
index 0000000000000..9a2f30273c0fe
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-caseyyu2-comboboxDropdownAlignment_2017-11-16-19-43.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Change the combobox alignment to be the same as the design of dropdown",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "xiyu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 98674d8764c01..2a0972277e7ff 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -24,6 +24,9 @@ import {
   getOptionStyles,
   getCaretDownButtonStyles
 } from './ComboBox.styles';
+import {
+  IComboBoxStyles,
+} from './ComboBox.types';
 import {
   IComboBoxClassNames,
   getClassNames,
@@ -252,10 +255,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
     let hasErrorMessage = (errorMessage && errorMessage.length > 0) ? true : false;
 
-    let setWidth = isOpen ? (this._comboBoxWrapper.clientWidth - 2) + 'px' : undefined;
-
     this._classNames = getClassNames(
-      getStyles(theme!, customStyles, setWidth),
+      getStyles(theme!, customStyles),
       className!,
       !!isOpen,
       !!disabled,
@@ -797,6 +798,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     let {
       onRenderList,
       calloutProps,
+      dropdownWidth,
       onRenderLowerContent = this._onRenderLowerContent
     } = props;
 
@@ -812,6 +814,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         target={ this._comboBoxWrapper }
         onDismiss={ this._onDismiss }
         setInitialFocus={ false }
+        calloutWidth={ dropdownWidth || this._comboBoxWrapper.clientWidth + 2 }
       >
         <div className={ this._classNames.optionsContainerWrapper } ref={ this._resolveRef('_comboBoxMenu') }>
           { (onRenderList as any)({ ...props }, this._onRenderList) }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
index a8c60b4d0fa63..b57632970844d 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
@@ -117,6 +117,12 @@ export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox>
    * Add additional content below the callout list.
    */
   onRenderLowerContent?: IRenderFunction<IComboBoxProps>;
+
+  /**
+  * Custom width for dropdown. If value is 0, width of the input field is used.
+  * @default 0
+  */
+  dropdownWidth?: number;
 }
 
 export interface IComboBoxStyles {

From eb978924c0bdce2d9bc9b82719a4b31f55ee3f52 Mon Sep 17 00:00:00 2001
From: Kushal Yarlagadda <whykushal93@gmail.com>
Date: Wed, 22 Nov 2017 14:49:18 -0800
Subject: [PATCH 1060/1641] ComboBox behavior with up/down arrow keys when menu
 is closed (#3451)

* ComboBox on up/down arrow keys should just update the pending index and values.
It should not update the selected value.
The selected value always should only be updated on blur, enter, space, tab key presses only

* Change file

* Spelling correction
---
 .../comboBoxKeyboarding_2017-11-22-18-56.json | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.tsx      | 19 +++++++------------
 2 files changed, 18 insertions(+), 12 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/comboBoxKeyboarding_2017-11-22-18-56.json

diff --git a/common/changes/office-ui-fabric-react/comboBoxKeyboarding_2017-11-22-18-56.json b/common/changes/office-ui-fabric-react/comboBoxKeyboarding_2017-11-22-18-56.json
new file mode 100644
index 0000000000000..4d8208337daaf
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/comboBoxKeyboarding_2017-11-22-18-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Combo box only updates the pending values in arrow keypresses, whether  its menu is open or  closed",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kushaly@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 2a0972277e7ff..89c5132bc86ed 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -1122,23 +1122,18 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   }
 
   /**
-   * Sets either the pending info or the
-   * selected index depending of if the comboBox is open
+   * Sets the pending info for the comboBox
    * @param index - the index to search from
    * @param searchDirection - the direction to search
    */
-  private _setInfoForIndexAndDirection(index: number, searchDirection: SearchDirection) {
+  private _setPendingInfoFromIndexAndDirection(index: number, searchDirection: SearchDirection) {
     let {
       isOpen,
       selectedIndex
     } = this.state;
 
-    if (isOpen) {
-      index = this._getNextSelectableIndex(index, searchDirection);
-      this._setPendingInfoFromIndex(index);
-    } else {
-      this._setSelectedIndex(selectedIndex, searchDirection);
-    }
+    index = this._getNextSelectableIndex(index, searchDirection);
+    this._setPendingInfoFromIndex(index);
   }
 
   /**
@@ -1229,7 +1224,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         }
 
         // Go to the previous option
-        this._setInfoForIndexAndDirection(index, SearchDirection.backward);
+        this._setPendingInfoFromIndexAndDirection(index, SearchDirection.backward);
         break;
 
       case KeyCodes.down:
@@ -1245,7 +1240,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
           }
 
           // Got to the next option
-          this._setInfoForIndexAndDirection(index, SearchDirection.forward);
+          this._setPendingInfoFromIndexAndDirection(index, SearchDirection.forward);
         }
         break;
 
@@ -1267,7 +1262,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
           directionToSearch = SearchDirection.backward;
         }
 
-        this._setInfoForIndexAndDirection(index, directionToSearch);
+        this._setPendingInfoFromIndexAndDirection(index, directionToSearch);
         break;
 
       case KeyCodes.space:

From 4e590b0b914e7be64fe85809a2bf5c4bda0f49ea Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Wed, 22 Nov 2017 15:03:34 -0800
Subject: [PATCH 1061/1641] ContextualMenu: Updated styles for expanded menu
 item to match toolkit (#3444)

* Fixed replaced example

* updated styles to match toolkit

* Added change files

* updated deprecated sematic slots

* Update contextualmenu-bug_2017-11-21-19-43.json

* Update contextualmenu-bug_2017-11-21-19-43.json
---
 .../styling/contextualmenu-bug_2017-11-21-19-43.json  | 11 +++++++++++
 .../contextualmenu-bug_2017-11-21-19-43.json          | 11 +++++++++++
 .../src/common/_semanticSlots.scss                    |  2 +-
 .../ContextualMenu/ContextualMenu.styles.ts           |  1 -
 .../components/ContextualMenu/ContextualMenuPage.tsx  |  2 +-
 packages/styling/src/styles/theme.ts                  |  2 +-
 6 files changed, 25 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/contextualmenu-bug_2017-11-21-19-43.json
 create mode 100644 common/changes/office-ui-fabric-react/contextualmenu-bug_2017-11-21-19-43.json

diff --git a/common/changes/@uifabric/styling/contextualmenu-bug_2017-11-21-19-43.json b/common/changes/@uifabric/styling/contextualmenu-bug_2017-11-21-19-43.json
new file mode 100644
index 0000000000000..30bee56840c82
--- /dev/null
+++ b/common/changes/@uifabric/styling/contextualmenu-bug_2017-11-21-19-43.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Theme: Updated menuItemBackgroundChecked for ContextualMenu.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "lynam.emily@gmail.com"
+}
diff --git a/common/changes/office-ui-fabric-react/contextualmenu-bug_2017-11-21-19-43.json b/common/changes/office-ui-fabric-react/contextualmenu-bug_2017-11-21-19-43.json
new file mode 100644
index 0000000000000..5127796192eb7
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/contextualmenu-bug_2017-11-21-19-43.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: Updated expanded menu item style to match toolkit.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/common/_semanticSlots.scss b/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
index 2ea780d36c6cd..969f63c0bff4f 100644
--- a/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
+++ b/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
@@ -40,7 +40,7 @@ $buttonTextCheckedHoveredColor: "[theme:buttonTextCheckedHovered, default: #0000
 
 /* Menus */
 $menuItemBackgroundHoveredColor: "[theme:menuItemBackgroundHovered, default: #f8f8f8]";
-$menuItemBackgroundCheckedColor: "[theme:menuItemBackgroundChecked, default: #d0d0d0]";
+$menuItemBackgroundCheckedColor: "[theme:menuItemBackgroundChecked, default: #eaeaea]";
 $menuIconColor: "[theme:menuIcon, default: #0078d7]";
 $menuHeaderColor: "[theme:menuHeader, default: #0078d7]";
 
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
index a3c5fb8257ae0..ff82757e696e1 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
@@ -86,7 +86,6 @@ export const getMenuItemStyles = memoizeFunction((
     rootExpanded: {
       backgroundColor: ContextualMenuItemBackgroundSelectedColor,
       color: semanticColors.bodyTextChecked,
-      fontWeight: FontWeights.semibold,
       ...getItemHighContrastStyles()
     },
     linkContent: {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
index 793ba865b7991..1281e932a2d14 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
@@ -74,7 +74,7 @@ export class ContextualMenuPage extends React.Component<IComponentDemoPageProps,
               title='ContextualMenu with customized submenus'
               code={ ContextualMenuCustomizationExampleCode }
             >
-              <ContextualMenuWithScrollBarExample />
+              <ContextualMenuCustomizationExample />
             </ExampleCard>
             <ExampleCard
               title='ContextualMenu with a scroll bar and fixed direction'
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index ad11e2f170135..73ba7d0734fdc 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -120,7 +120,7 @@ function _makeSemanticColorsFromPalette(p: IPalette, isInverted: boolean): ISema
     buttonTextCheckedHovered: p.black,
 
     menuItemBackgroundHovered: p.neutralLighter,
-    menuItemBackgroundChecked: p.neutralQuaternaryAlt,
+    menuItemBackgroundChecked: p.neutralLight,
     menuIcon: p.themePrimary,
     menuHeader: p.themePrimary,
 

From 56215e22f5beb78ffef9e95d0483a7906f13bfac Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pablo=20N=C3=BA=C3=B1ez?= <pablonete@gmail.com>
Date: Thu, 23 Nov 2017 01:02:41 +0100
Subject: [PATCH 1062/1641] Button: new prop splitButtonAriaLabel (#3430)

* Button: new prop splitButtonAriaLabel.

* Change details.

* Update new prop jsdoc.
---
 .../button-splitButtonAriaLabel_2017-11-20-14-33.json | 11 +++++++++++
 .../src/components/Button/BaseButton.tsx              |  6 ++++--
 .../src/components/Button/Button.types.ts             |  5 +++++
 .../Button/examples/Button.Split.Example.tsx          |  1 +
 4 files changed, 21 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/button-splitButtonAriaLabel_2017-11-20-14-33.json

diff --git a/common/changes/office-ui-fabric-react/button-splitButtonAriaLabel_2017-11-20-14-33.json b/common/changes/office-ui-fabric-react/button-splitButtonAriaLabel_2017-11-20-14-33.json
new file mode 100644
index 0000000000000..9aaea139bf801
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/button-splitButtonAriaLabel_2017-11-20-14-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Button: new prop splitButtonAriaLabel.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-panu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index fdc1af648207c..c00cea9178214 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -430,7 +430,8 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
 
   private _onRenderSplitButtonMenuButton(classNames: ISplitButtonClassNames | undefined): JSX.Element {
     let {
-      menuIconProps
+      menuIconProps,
+      splitButtonAriaLabel
     } = this.props;
 
     if (menuIconProps === undefined) {
@@ -445,7 +446,8 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       'disabled': this.props.disabled,
       'onClick': this._onMenuClick,
       'menuProps': undefined,
-      'iconProps': menuIconProps
+      'iconProps': menuIconProps,
+      'ariaLabel': splitButtonAriaLabel
     };
 
     return <BaseButton {...splitButtonProps} />;
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.types.ts b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
index 68c7396391cae..aaf337e22fffb 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
@@ -116,6 +116,11 @@ export interface IButtonProps extends React.AllHTMLAttributes<HTMLAnchorElement
    */
   menuIconProps?: IIconProps;
 
+  /**
+   * Accessible label for the dropdown chevron button if this button is split.
+   */
+  splitButtonAriaLabel?: string;
+
   /**
    * Optional callback when menu is clicked.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
index fa25bfbfe6204..0e601defcf38c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
@@ -26,6 +26,7 @@ export class ButtonSplitExample extends React.Component<IButtonProps, {}> {
             text='Create account'
             onClick={ alertClicked }
             split={ true }
+            splitButtonAriaLabel={ 'See 2 sample options' }
             style={ { height: '35px' } }
             menuProps={ {
               items: [

From 729b7ddf0835fd6ba858125dd9d638bde3088b45 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Wed, 22 Nov 2017 16:19:38 -0800
Subject: [PATCH 1063/1641] Toggle: Split out a separate example for on and
 offAriaLabel (#3421)

* New aria label example, split out

* Split out aria label example

* Added change file
---
 .../toggle-examples_2017-11-17-18-11.json     | 11 ++++++++++
 .../src/components/Toggle/TogglePage.tsx      | 19 +++++++++++++++---
 .../examples/Toggle.AriaLabel.Example.tsx     | 20 +++++++++++++++++++
 .../Toggle/examples/Toggle.Basic.Example.tsx  |  2 --
 4 files changed, 47 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/toggle-examples_2017-11-17-18-11.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Toggle/examples/Toggle.AriaLabel.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/toggle-examples_2017-11-17-18-11.json b/common/changes/office-ui-fabric-react/toggle-examples_2017-11-17-18-11.json
new file mode 100644
index 0000000000000..7eca95a878e83
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/toggle-examples_2017-11-17-18-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Toggle: Split out a new example for on and offAriaLabels to clarify the experince.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
index 3d954ba424bf2..7172e73c5c6ea 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
@@ -6,11 +6,13 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { ToggleBasicExample } from './examples/Toggle.Basic.Example';
+import { ToggleAriaLabelExample } from './examples/Toggle.AriaLabel.Example';
 import { FontClassNames } from '../../Styling';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { ToggleStatus } from './Toggle.checklist';
 
 const ToggleBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Toggle/examples/Toggle.Basic.Example.tsx') as string;
+const ToggleAriaLabelExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Toggle/examples/Toggle.AriaLabel.Example.tsx') as string;
 
 export class TogglePage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
@@ -19,9 +21,20 @@ export class TogglePage extends React.Component<IComponentDemoPageProps, {}> {
         title='Toggle'
         componentName='ToggleExample'
         exampleCards={
-          <ExampleCard title='Default Toggles' code={ ToggleBasicExampleCode }>
-            <ToggleBasicExample />
-          </ExampleCard>
+          <div>
+            <ExampleCard
+              title='Default Toggles'
+              code={ ToggleBasicExampleCode }
+            >
+              <ToggleBasicExample />
+            </ExampleCard>
+            <ExampleCard
+              title='Toggle with specialized aria labels for the screen-reader to announce when the toggle is on and off'
+              code={ ToggleAriaLabelExampleCode }
+            >
+              <ToggleAriaLabelExample />
+            </ExampleCard>
+          </div>
         }
         propertiesTables={
           <PropertiesTableSet
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/examples/Toggle.AriaLabel.Example.tsx b/packages/office-ui-fabric-react/src/components/Toggle/examples/Toggle.AriaLabel.Example.tsx
new file mode 100644
index 0000000000000..0076984be1c80
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Toggle/examples/Toggle.AriaLabel.Example.tsx
@@ -0,0 +1,20 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+import { Toggle } from 'office-ui-fabric-react/lib/Toggle';
+
+// tslint:disable:jsx-no-lambda
+export const ToggleAriaLabelExample = () => (
+  <div style={ { padding: '2px' } }>
+    <Toggle
+      defaultChecked={ true }
+      label='Enabled and checked'
+      onAriaLabel='This toggle is checked. Press to uncheck.'
+      offAriaLabel='This toggle is unchecked. Press to check.'
+      onText='On'
+      offText='Off'
+      onFocus={ () => console.log('onFocus called') }
+      onBlur={ () => console.log('onBlur called') }
+    />
+  </div>
+);
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/examples/Toggle.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Toggle/examples/Toggle.Basic.Example.tsx
index 15dbdd69dad6e..9df6ebe041da3 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/examples/Toggle.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/examples/Toggle.Basic.Example.tsx
@@ -9,8 +9,6 @@ export const ToggleBasicExample = () => (
     <Toggle
       defaultChecked={ true }
       label='Enabled and checked'
-      onAriaLabel='This toggle is checked. Press to uncheck.'
-      offAriaLabel='This toggle is unchecked. Press to check.'
       onText='On'
       offText='Off'
       onFocus={ () => console.log('onFocus called') }

From 450e8821f72cd4fc58864820fb96b22c4bbf4f80 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 23 Nov 2017 11:10:13 +0000
Subject: [PATCH 1064/1641] Applying package updates.

---
 .../experiments/fixes_2017-11-17-17-55.json   | 11 ----
 ...zeGroupPropClassName_2017-11-22-18-30.json | 11 ----
 .../contextualmenu-bug_2017-11-21-19-43.json  | 11 ----
 .../MenuMinWidth_2017-11-20-15-20.json        | 11 ----
 ...splitButtonAriaLabel_2017-11-20-14-33.json | 11 ----
 .../comboBoxKeyboarding_2017-11-22-18-56.json | 11 ----
 .../contextualmenu-bug_2017-11-21-19-43.json  | 11 ----
 ...zeGroupPropClassName_2017-11-22-18-30.json | 11 ----
 .../toggle-examples_2017-11-17-18-11.json     | 11 ----
 ...boxDropdownAlignment_2017-11-16-19-43.json | 11 ----
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/CHANGELOG.json           | 19 +++++++
 packages/experiments/CHANGELOG.md             |  9 +++-
 packages/experiments/package.json             |  4 +-
 packages/icons/package.json                   |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 51 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 18 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/CHANGELOG.json               | 14 +++++
 packages/styling/CHANGELOG.md                 |  9 +++-
 packages/styling/package.json                 |  2 +-
 21 files changed, 124 insertions(+), 120 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/fixes_2017-11-17-17-55.json
 delete mode 100644 common/changes/@uifabric/experiments/staylo8-3447ResizeGroupPropClassName_2017-11-22-18-30.json
 delete mode 100644 common/changes/@uifabric/styling/contextualmenu-bug_2017-11-21-19-43.json
 delete mode 100644 common/changes/office-ui-fabric-react/MenuMinWidth_2017-11-20-15-20.json
 delete mode 100644 common/changes/office-ui-fabric-react/button-splitButtonAriaLabel_2017-11-20-14-33.json
 delete mode 100644 common/changes/office-ui-fabric-react/comboBoxKeyboarding_2017-11-22-18-56.json
 delete mode 100644 common/changes/office-ui-fabric-react/contextualmenu-bug_2017-11-21-19-43.json
 delete mode 100644 common/changes/office-ui-fabric-react/staylo8-3447ResizeGroupPropClassName_2017-11-22-18-30.json
 delete mode 100644 common/changes/office-ui-fabric-react/toggle-examples_2017-11-17-18-11.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-caseyyu2-comboboxDropdownAlignment_2017-11-16-19-43.json

diff --git a/common/changes/@uifabric/experiments/fixes_2017-11-17-17-55.json b/common/changes/@uifabric/experiments/fixes_2017-11-17-17-55.json
deleted file mode 100644
index 2098be827ee86..0000000000000
--- a/common/changes/@uifabric/experiments/fixes_2017-11-17-17-55.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/experiments",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/staylo8-3447ResizeGroupPropClassName_2017-11-22-18-30.json b/common/changes/@uifabric/experiments/staylo8-3447ResizeGroupPropClassName_2017-11-22-18-30.json
deleted file mode 100644
index ecd654ddc2529..0000000000000
--- a/common/changes/@uifabric/experiments/staylo8-3447ResizeGroupPropClassName_2017-11-22-18-30.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Apply props.className in ResizeGroup. Add snapshot for ResizeGroup. Pass className from experiments CommandBarTests. Update experiments CommandBar snapshot",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "staylo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/contextualmenu-bug_2017-11-21-19-43.json b/common/changes/@uifabric/styling/contextualmenu-bug_2017-11-21-19-43.json
deleted file mode 100644
index 30bee56840c82..0000000000000
--- a/common/changes/@uifabric/styling/contextualmenu-bug_2017-11-21-19-43.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Theme: Updated menuItemBackgroundChecked for ContextualMenu.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "lynam.emily@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/MenuMinWidth_2017-11-20-15-20.json b/common/changes/office-ui-fabric-react/MenuMinWidth_2017-11-20-15-20.json
deleted file mode 100644
index 30e47dbf9a1a6..0000000000000
--- a/common/changes/office-ui-fabric-react/MenuMinWidth_2017-11-20-15-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: Add a prop for setting the min width to be equal to the width of the target",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/button-splitButtonAriaLabel_2017-11-20-14-33.json b/common/changes/office-ui-fabric-react/button-splitButtonAriaLabel_2017-11-20-14-33.json
deleted file mode 100644
index 9aaea139bf801..0000000000000
--- a/common/changes/office-ui-fabric-react/button-splitButtonAriaLabel_2017-11-20-14-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Button: new prop splitButtonAriaLabel.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-panu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/comboBoxKeyboarding_2017-11-22-18-56.json b/common/changes/office-ui-fabric-react/comboBoxKeyboarding_2017-11-22-18-56.json
deleted file mode 100644
index 4d8208337daaf..0000000000000
--- a/common/changes/office-ui-fabric-react/comboBoxKeyboarding_2017-11-22-18-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Combo box only updates the pending values in arrow keypresses, whether  its menu is open or  closed",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kushaly@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/contextualmenu-bug_2017-11-21-19-43.json b/common/changes/office-ui-fabric-react/contextualmenu-bug_2017-11-21-19-43.json
deleted file mode 100644
index 5127796192eb7..0000000000000
--- a/common/changes/office-ui-fabric-react/contextualmenu-bug_2017-11-21-19-43.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: Updated expanded menu item style to match toolkit.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/staylo8-3447ResizeGroupPropClassName_2017-11-22-18-30.json b/common/changes/office-ui-fabric-react/staylo8-3447ResizeGroupPropClassName_2017-11-22-18-30.json
deleted file mode 100644
index 15751222586a4..0000000000000
--- a/common/changes/office-ui-fabric-react/staylo8-3447ResizeGroupPropClassName_2017-11-22-18-30.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Apply props.className in ResizeGroup. Add snapshot for ResizeGroup. Pass className from experiments CommandBarTests. Update experiments CommandBar snapshot",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "staylo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/toggle-examples_2017-11-17-18-11.json b/common/changes/office-ui-fabric-react/toggle-examples_2017-11-17-18-11.json
deleted file mode 100644
index 7eca95a878e83..0000000000000
--- a/common/changes/office-ui-fabric-react/toggle-examples_2017-11-17-18-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Toggle: Split out a new example for on and offAriaLabels to clarify the experince.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-caseyyu2-comboboxDropdownAlignment_2017-11-16-19-43.json b/common/changes/office-ui-fabric-react/users-caseyyu2-comboboxDropdownAlignment_2017-11-16-19-43.json
deleted file mode 100644
index 9a2f30273c0fe..0000000000000
--- a/common/changes/office-ui-fabric-react/users-caseyyu2-comboboxDropdownAlignment_2017-11-16-19-43.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Change the combobox alignment to be the same as the design of dropdown",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "xiyu@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 1302467e4262b..7a2dca59ceae5 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -38,7 +38,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.10.0 <6.0.0",
+    "@uifabric/styling": ">=5.10.1 <6.0.0",
     "@uifabric/utilities": ">=5.4.0 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index caca6b86be92e..8974582e48c39 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.6.1",
+      "tag": "@uifabric/experiments_v5.6.1",
+      "date": "Thu, 23 Nov 2017 11:10:13 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "staylo8 <33881401+staylo8@users.noreply.github.com>",
+            "commit": "d6b160b67456101362c1b241b4c4ee6d11850fdb",
+            "comment": "Apply props.className in ResizeGroup. Add snapshot for ResizeGroup. Pass className from experiments CommandBarTests. Update experiments CommandBar snapshot"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.24.2 <6.0.0` to `>=5.25.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.6.0",
       "tag": "@uifabric/experiments_v5.6.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 197601ce5e94d..ae0c3806cba58 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Fri, 17 Nov 2017 17:36:36 GMT and should not be manually modified.
+This log was last generated on Thu, 23 Nov 2017 11:10:13 GMT and should not be manually modified.
+
+## 5.6.1
+Thu, 23 Nov 2017 11:10:13 GMT
+
+### Patches
+
+- Apply props.className in ResizeGroup. Add snapshot for ResizeGroup. Pass className from experiments CommandBarTests. Update experiments CommandBar snapshot
 
 ## 5.6.0
 Fri, 17 Nov 2017 17:36:36 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index b878cc21e9a42..f5a0aeee0ca1f 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.6.0",
+  "version": "5.6.1",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.24.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.25.0 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 1db2a25ffca15..be702ac5d9b8b 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -23,7 +23,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.10.0 <6.0.0",
+    "@uifabric/styling": ">=5.10.1 <6.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index dda9fed883cb8..346c40a628830 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,57 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.25.0",
+      "tag": "office-ui-fabric-react_v5.25.0",
+      "date": "Thu, 23 Nov 2017 11:10:13 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Pablo Núñez <pablonete@gmail.com>",
+            "commit": "56215e22f5beb78ffef9e95d0483a7906f13bfac",
+            "comment": "Button: new prop splitButtonAriaLabel."
+          }
+        ],
+        "patch": [
+          {
+            "author": "Kushal Yarlagadda <whykushal93@gmail.com>",
+            "commit": "eb978924c0bdce2d9bc9b82719a4b31f55ee3f52",
+            "comment": "Combo box only updates the pending values in arrow keypresses, whether  its menu is open or  closed"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "4e590b0b914e7be64fe85809a2bf5c4bda0f49ea",
+            "comment": "ContextualMenu: Updated expanded menu item style to match toolkit."
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "e43cac6884892e8615246d22e74c1adc4f5922e3",
+            "comment": "ContextualMenu: Add a prop for setting the min width to be equal to the width of the target"
+          },
+          {
+            "author": "staylo8 <33881401+staylo8@users.noreply.github.com>",
+            "commit": "d6b160b67456101362c1b241b4c4ee6d11850fdb",
+            "comment": "Apply props.className in ResizeGroup. Add snapshot for ResizeGroup. Pass className from experiments CommandBarTests. Update experiments CommandBar snapshot"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "729b7ddf0835fd6ba858125dd9d638bde3088b45",
+            "comment": "Toggle: Split out a new example for on and offAriaLabels to clarify the experince."
+          },
+          {
+            "author": "Casey Yu <caseyyu2@gmail.com>",
+            "commit": "bdd402cc01fad59de4d7c79241ec2a1a164aa92c",
+            "comment": "Change the combobox alignment to be the same as the design of dropdown"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.10.0 <6.0.0` to `>=5.10.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.24.2",
       "tag": "office-ui-fabric-react_v5.24.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 60f5dc7540c36..1464c91ab0d9d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,22 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 22 Nov 2017 11:12:40 GMT and should not be manually modified.
+This log was last generated on Thu, 23 Nov 2017 11:10:13 GMT and should not be manually modified.
+
+## 5.25.0
+Thu, 23 Nov 2017 11:10:13 GMT
+
+### Minor changes
+
+- Button: new prop splitButtonAriaLabel.
+
+### Patches
+
+- Combo box only updates the pending values in arrow keypresses, whether  its menu is open or  closed
+- ContextualMenu: Updated expanded menu item style to match toolkit.
+- ContextualMenu: Add a prop for setting the min width to be equal to the width of the target
+- Apply props.className in ResizeGroup. Add snapshot for ResizeGroup. Pass className from experiments CommandBarTests. Update experiments CommandBar snapshot
+- Toggle: Split out a new example for on and offAriaLabels to clarify the experince.
+- Change the combobox alignment to be the same as the design of dropdown
 
 ## 5.24.2
 Wed, 22 Nov 2017 11:12:40 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index e2006b88e6572..59733804b00fa 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.24.2",
+  "version": "5.25.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,7 +47,7 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.6.0 <6.0.0",
-    "@uifabric/styling": ">=5.10.0 <6.0.0",
+    "@uifabric/styling": ">=5.10.1 <6.0.0",
     "@uifabric/utilities": ">=5.4.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 70946c0ded423..b0a881c6261df 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.10.1",
+      "tag": "@uifabric/styling_v5.10.1",
+      "date": "Thu, 23 Nov 2017 11:10:13 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "4e590b0b914e7be64fe85809a2bf5c4bda0f49ea",
+            "comment": "Theme: Updated menuItemBackgroundChecked for ContextualMenu."
+          }
+        ]
+      }
+    },
     {
       "version": "5.10.0",
       "tag": "@uifabric/styling_v5.10.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 0418fbbd914af..479d2d5866ef2 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 17 Nov 2017 17:36:36 GMT and should not be manually modified.
+This log was last generated on Thu, 23 Nov 2017 11:10:13 GMT and should not be manually modified.
+
+## 5.10.1
+Thu, 23 Nov 2017 11:10:13 GMT
+
+### Patches
+
+- Theme: Updated menuItemBackgroundChecked for ContextualMenu.
 
 ## 5.10.0
 Fri, 17 Nov 2017 17:36:36 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 61083ff42a330..0c24d76f00fa4 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.10.0",
+  "version": "5.10.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 504a3c8edac252373a589acbe0c6234f7d92f6cf Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Mon, 27 Nov 2017 09:58:12 -0800
Subject: [PATCH 1065/1641] ContextualMenu: Make it possible for split buttons
 in menus to open when hovered (#3459)

* Add ability to open menu when hovering for split buttons

* Add change file
---
 .../malozano-SBMenuHover_2017-11-25-04-02.json        | 11 +++++++++++
 .../src/components/ContextualMenu/ContextualMenu.tsx  |  6 +++++-
 2 files changed, 16 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/malozano-SBMenuHover_2017-11-25-04-02.json

diff --git a/common/changes/office-ui-fabric-react/malozano-SBMenuHover_2017-11-25-04-02.json b/common/changes/office-ui-fabric-react/malozano-SBMenuHover_2017-11-25-04-02.json
new file mode 100644
index 0000000000000..bc0ce3ed15a04
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-SBMenuHover_2017-11-25-04-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: Add ability to open splitButton chevron menu, when they are inside menus",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 0eeac491ed6bf..2262c10be071e 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -589,7 +589,11 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
     return React.createElement('button',
       assign({}, getNativeProps(itemProps, buttonProperties), {
-        onKeyDown: this._onItemKeyDown.bind(this, item)
+        onKeyDown: this._onItemKeyDown.bind(this, item),
+        onMouseEnter: this._onItemMouseEnter.bind(this, item),
+        onMouseLeave: this._onMouseItemLeave.bind(this, item),
+        onMouseDown: (ev: any) => this._onItemMouseDown(item, ev),
+        onMouseMove: this._onItemMouseMove.bind(this, item)
       }),
       this._renderMenuItemChildren(itemProps, classNames, index, false, false));
   }

From 6934700b8092f6a24e82c3af4b97b40a404f75af Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pablo=20N=C3=BA=C3=B1ez?= <pablonete@gmail.com>
Date: Mon, 27 Nov 2017 20:42:09 +0100
Subject: [PATCH 1066/1641] DetailsList: resize columns in justified mode
 doesn't affect columns on the left (#2995)

* Adjust only right-bound columns in justified mode.

Previously, columns on the left could change their sizes proportionally, which resulted on a weird experience for the final user.

* Fix fixedWidth formula so right-most column drops gracefully.

* Last column takes it all.

* Try to shrink last column before dropping it.

* Last column should be resizable if there is a dropped column.

* Non-collapsible columns should stay min when overflow happens (because we cannot drop them).
Also resizing last column should never drop it (we were doing > instead of >=).

* Missing semicolon (thanks TSLint).

* Extract method for readability, added summary description.

* Add change request.

* Allow last column to be resizable in justified layout.

This lets the last column to be extended further the right edge, and aligns with the idea that we should never prevent users to make any column wider if they need so. Note this will require a horizontal scrollbar when column overflows.

* Prevent non-collapsible columns to get smaller than its minWidth.

This happened when a previous column was resized till the right edge, the other columns became 0 (only visible because of padding).
---
 ...JustifiedNoLeftwards_2017-10-02-10-22.json | 11 +++
 .../components/DetailsList/DetailsHeader.tsx  |  7 +-
 .../components/DetailsList/DetailsList.tsx    | 90 +++++++++++++------
 .../DetailsList/DetailsList.types.ts          |  9 +-
 .../DetailsList.Documents.Example.tsx         |  2 +
 5 files changed, 88 insertions(+), 31 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/detailsList-resizeJustifiedNoLeftwards_2017-10-02-10-22.json

diff --git a/common/changes/office-ui-fabric-react/detailsList-resizeJustifiedNoLeftwards_2017-10-02-10-22.json b/common/changes/office-ui-fabric-react/detailsList-resizeJustifiedNoLeftwards_2017-10-02-10-22.json
new file mode 100644
index 0000000000000..5301334405598
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/detailsList-resizeJustifiedNoLeftwards_2017-10-02-10-22.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: Resizing columns in justified mode doesn't affect columns on the left.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-panu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index 8b0c1caf44c5f..766244900c53c 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -39,7 +39,7 @@ export interface IDetailsHeaderProps extends React.Props<DetailsHeader> {
   selectionMode: SelectionMode;
   layoutMode: DetailsListLayoutMode;
   onColumnIsSizingChanged?: (column: IColumn, isSizing: boolean) => void;
-  onColumnResized?: (column: IColumn, newWidth: number) => void;
+  onColumnResized?: (column: IColumn, newWidth: number, columnIndex: number) => void;
   onColumnAutoResized?: (column: IColumn, columnIndex: number) => void;
   onColumnClick?: (ev: React.MouseEvent<HTMLElement>, column: IColumn) => void;
   onColumnContextMenu?: (column: IColumn, ev: React.MouseEvent<HTMLElement>) => void;
@@ -479,7 +479,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
         });
 
         if (onColumnResized) {
-          onColumnResized(columns[columnIndex], columnResizeDetails.columnMinWidth + increment);
+          onColumnResized(columns[columnIndex], columnResizeDetails.columnMinWidth + increment, columnIndex);
         }
 
         ev.preventDefault();
@@ -526,7 +526,8 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
 
       onColumnResized(
         columns[columnResizeDetails!.columnIndex],
-        columnResizeDetails!.columnMinWidth + movement
+        columnResizeDetails!.columnMinWidth + movement,
+        columnResizeDetails!.columnIndex
       );
     }
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index e213f613ad4f1..4c49e2f234f51 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -561,8 +561,8 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     }
   }
 
-  private _adjustColumns(newProps: IDetailsListProps, forceUpdate?: boolean) {
-    let adjustedColumns = this._getAdjustedColumns(newProps, forceUpdate);
+  private _adjustColumns(newProps: IDetailsListProps, forceUpdate?: boolean, resizingColumnIndex?: number) {
+    let adjustedColumns = this._getAdjustedColumns(newProps, forceUpdate, resizingColumnIndex);
     let { width: viewportWidth } = this.props.viewport!;
 
     if (adjustedColumns) {
@@ -574,7 +574,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   }
 
   /** Returns adjusted columns, given the viewport size and layout mode. */
-  private _getAdjustedColumns(newProps: IDetailsListProps, forceUpdate?: boolean): IColumn[] | undefined {
+  private _getAdjustedColumns(newProps: IDetailsListProps, forceUpdate?: boolean, resizingColumnIndex?: number): IColumn[] | undefined {
     let { columns: newColumns, items: newItems, layoutMode, selectionMode } = newProps;
     let { width: viewportWidth } = newProps.viewport!;
 
@@ -605,7 +605,15 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
         this._rememberCalculatedWidth(column, column.calculatedWidth!);
       });
     } else {
-      adjustedColumns = this._getJustifiedColumns(newColumns, viewportWidth, newProps);
+      if (resizingColumnIndex !== undefined) {
+        adjustedColumns = this._getJustifiedColumnsAfterResize(newColumns, viewportWidth, newProps, resizingColumnIndex);
+      } else {
+        adjustedColumns = this._getJustifiedColumns(newColumns, viewportWidth, newProps, 0);
+      }
+
+      adjustedColumns.forEach(column => {
+        this._getColumnOverride(column.key).currentWidth = column.calculatedWidth;
+      });
     }
 
     return adjustedColumns;
@@ -624,8 +632,24 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     });
   }
 
+  private _getJustifiedColumnsAfterResize(newColumns: IColumn[], viewportWidth: number, props: IDetailsListProps, resizingColumnIndex: number): IColumn[] {
+    const fixedColumns = newColumns.slice(0, resizingColumnIndex);
+    fixedColumns.forEach(column =>
+      column.calculatedWidth = this._getColumnOverride(column.key).currentWidth);
+
+    const fixedWidth = fixedColumns.reduce((total, column, i) => total + getPaddedWidth(column, i === 0), 0);
+
+    const remainingColumns = newColumns.slice(resizingColumnIndex);
+    const remainingWidth = viewportWidth - fixedWidth;
+
+    return [
+      ...fixedColumns,
+      ...this._getJustifiedColumns(remainingColumns, remainingWidth, props, resizingColumnIndex),
+    ];
+  }
+
   /** Builds a set of columns to fix within the viewport width. */
-  private _getJustifiedColumns(newColumns: IColumn[], viewportWidth: number, props: IDetailsListProps) {
+  private _getJustifiedColumns(newColumns: IColumn[], viewportWidth: number, props: IDetailsListProps, firstIndex: number) {
     let {
       selectionMode,
       checkboxVisibility,
@@ -645,19 +669,26 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
         },
         this._columnOverrides[column.key]);
 
-      totalWidth += newColumn.calculatedWidth + (i > 0 ? DEFAULT_INNER_PADDING : 0) + (column.isPadded ? ISPADDED_WIDTH : 0);
+      const isFirst = i + firstIndex === 0;
+      totalWidth += getPaddedWidth(newColumn, isFirst);
 
       return newColumn;
     });
 
     let lastIndex = adjustedColumns.length - 1;
 
-    // Remove collapsable columns.
-    while (lastIndex > -1 && totalWidth > availableWidth) {
+    // Shrink or remove collapsable columns.
+    while (lastIndex > 0 && totalWidth > availableWidth) {
       let column = adjustedColumns[lastIndex];
 
-      if (column.isCollapsable) {
-        totalWidth -= column.calculatedWidth! + DEFAULT_INNER_PADDING;
+      const minWidth = column.minWidth || MIN_COLUMN_WIDTH;
+      const overflowWidth = totalWidth - availableWidth;
+
+      if (column.calculatedWidth! - minWidth >= overflowWidth || !column.isCollapsable) {
+        column.calculatedWidth = Math.max(column.calculatedWidth! - overflowWidth, minWidth);
+        totalWidth = availableWidth;
+      } else {
+        totalWidth -= getPaddedWidth(column, false);
         adjustedColumns.splice(lastIndex, 1);
       }
       lastIndex--;
@@ -666,48 +697,49 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     // Then expand columns starting at the beginning, until we've filled the width.
     for (let i = 0; i < adjustedColumns.length && totalWidth < availableWidth; i++) {
       let column = adjustedColumns[i];
+      const isLast = i === (adjustedColumns.length - 1);
       const overrides = this._columnOverrides[column.key];
-      if (overrides && overrides.calculatedWidth) {
+      if (overrides && overrides.calculatedWidth && !isLast) {
         continue;
       }
 
-      let maxWidth = column.maxWidth;
-      let minWidth = column.minWidth || maxWidth || MIN_COLUMN_WIDTH;
       let spaceLeft = availableWidth - totalWidth;
-      let increment = maxWidth ? Math.min(spaceLeft, maxWidth - minWidth) : spaceLeft;
-
-      // Add remaining space to the last column.
-      if (i === (adjustedColumns.length - 1)) {
+      let increment: number;
+      if (isLast) {
         increment = spaceLeft;
+      } else {
+        let maxWidth = column.maxWidth;
+        let minWidth = column.minWidth || maxWidth || MIN_COLUMN_WIDTH;
+        increment = maxWidth ? Math.min(spaceLeft, maxWidth - minWidth) : spaceLeft;
       }
 
       column.calculatedWidth = (column.calculatedWidth as number) + increment;
       totalWidth += increment;
     }
 
-    // Mark the last column as not resizable to avoid extra scrolling issues.
-    if (adjustedColumns.length) {
-      adjustedColumns[adjustedColumns.length - 1].isResizable = false;
-    }
-
     return adjustedColumns;
   }
 
-  private _onColumnResized(resizingColumn: IColumn, newWidth: number) {
+  private _onColumnResized(resizingColumn: IColumn, newWidth: number, resizingColumnIndex: number) {
     let newCalculatedWidth = Math.max(resizingColumn.minWidth || MIN_COLUMN_WIDTH, newWidth);
     if (this.props.onColumnResize) {
-      this.props.onColumnResize(resizingColumn, newCalculatedWidth);
+      this.props.onColumnResize(resizingColumn, newCalculatedWidth, resizingColumnIndex);
     }
 
     this._rememberCalculatedWidth(resizingColumn, newCalculatedWidth);
 
-    this._adjustColumns(this.props, true);
+    this._adjustColumns(this.props, true, resizingColumnIndex);
     this._forceListUpdates();
   }
 
   private _rememberCalculatedWidth(column: IColumn, newCalculatedWidth: number) {
-    let overrides = this._columnOverrides[column.key] = this._columnOverrides[column.key] || {} as IColumn;
+    let overrides = this._getColumnOverride(column.key);
     overrides.calculatedWidth = newCalculatedWidth;
+    overrides.currentWidth = newCalculatedWidth;
+  }
+
+  private _getColumnOverride(key: string): IColumn {
+    return this._columnOverrides[key] = this._columnOverrides[key] || {} as IColumn;
   }
 
   /**
@@ -732,7 +764,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
           max = Math.max(max, width);
           count++;
           if (count === totalCount) {
-            this._onColumnResized(column, max);
+            this._onColumnResized(column, max, columnIndex);
           }
         });
       }
@@ -834,3 +866,7 @@ export function buildColumns(
 function isRightArrow(event: React.KeyboardEvent<HTMLElement>) {
   return event.which === getRTLSafeKeyCode(KeyCodes.right);
 }
+
+function getPaddedWidth(column: IColumn, isFirst: boolean): number {
+  return column.calculatedWidth! + (isFirst ? 0 : DEFAULT_INNER_PADDING) + (column.isPadded ? ISPADDED_WIDTH : 0);
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
index 8b3be55e7204d..cfe73230c1a16 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
@@ -112,7 +112,7 @@ export interface IDetailsListProps extends React.Props<DetailsList>, IWithViewpo
   onColumnHeaderContextMenu?: (column?: IColumn, ev?: React.MouseEvent<HTMLElement>) => void;
 
   /** Callback fired on column resize */
-  onColumnResize?: (column?: IColumn, newWidth?: number) => void;
+  onColumnResize?: (column?: IColumn, newWidth?: number, columnIndex?: number) => void;
 
   /** Callback for when a given row has been invoked (by pressing enter while it is selected.) */
   onItemInvoked?: (item?: any, index?: number, ev?: Event) => void;
@@ -338,6 +338,13 @@ export interface IColumn {
    */
   calculatedWidth?: number;
 
+  /**
+   * Internal only value.
+   * Remembers the actual witdh of the column on any case.
+   * On the other hand, calculatedWidth is only saved when it's defined by user, not for justified calculations.
+   */
+  currentWidth?: number;
+
   /**
    * An optional class name to stick on the column cell within each header.
    */
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
index 01151d06021f9..174fcfb1abaf9 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
@@ -152,6 +152,7 @@ export class DetailsListDocumentsExample extends React.Component<any, IDetailsLi
         minWidth: 70,
         maxWidth: 90,
         isResizable: true,
+        isCollapsable: true,
         data: 'string',
         onColumnClick: this._onColumnClick,
         onRender: (item: IDocument) => {
@@ -170,6 +171,7 @@ export class DetailsListDocumentsExample extends React.Component<any, IDetailsLi
         minWidth: 70,
         maxWidth: 90,
         isResizable: true,
+        isCollapsable: true,
         data: 'number',
         onColumnClick: this._onColumnClick,
         onRender: (item: IDocument) => {

From 4b1468da53a1c3f5e0ddf5750b31c8500237ce6b Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 27 Nov 2017 13:51:20 -0800
Subject: [PATCH 1067/1641] Remove react dependency from styling. (#3461)

---
 apps/fabric-website/gulpfile.js               |  73 --
 common/config/rush/npm-shrinkwrap.json        | 927 +++++++++++++-----
 packages/example-app-base/LICENSE             |   2 +-
 packages/example-app-base/gulpfile.js         |  23 -
 packages/experiments/gulpfile.js              |  25 -
 packages/icons/gulpfile.js                    |  46 -
 .../src/components/Persona/PersonaCoin.tsx    |   2 +-
 .../src/components/Persona/PersonaConsts.ts   |   6 +-
 packages/styling/gulpfile.js                  |  21 -
 packages/styling/package.json                 |   9 +-
 packages/styling/src/interfaces/index.ts      |   2 -
 packages/styling/src/utilities/index.ts       |  10 +-
 packages/utilities/gulpfile.js                |  20 -
 packages/utilities/package.json               |   1 +
 .../src}/IClassNames.ts                       |   0
 .../src}/IStyleFunction.ts                    |   0
 .../src}/classNamesFunction.ts                |   8 +-
 packages/utilities/src/index.ts               |   7 +-
 .../utilities => utilities/src}/styled.tsx    |   4 +-
 scripts/package.json                          |   3 +-
 20 files changed, 691 insertions(+), 498 deletions(-)
 delete mode 100644 apps/fabric-website/gulpfile.js
 delete mode 100644 packages/example-app-base/gulpfile.js
 delete mode 100644 packages/experiments/gulpfile.js
 delete mode 100644 packages/icons/gulpfile.js
 delete mode 100644 packages/styling/gulpfile.js
 delete mode 100644 packages/utilities/gulpfile.js
 rename packages/{styling/src/interfaces => utilities/src}/IClassNames.ts (100%)
 rename packages/{styling/src/interfaces => utilities/src}/IStyleFunction.ts (100%)
 rename packages/{styling/src/utilities => utilities/src}/classNamesFunction.ts (76%)
 rename packages/{styling/src/utilities => utilities/src}/styled.tsx (92%)

diff --git a/apps/fabric-website/gulpfile.js b/apps/fabric-website/gulpfile.js
deleted file mode 100644
index f192c8e1a73eb..0000000000000
--- a/apps/fabric-website/gulpfile.js
+++ /dev/null
@@ -1,73 +0,0 @@
-'use strict';
-
-let build = require('@microsoft/web-library-build');
-let gulp = require('gulp');
-let buildConfig = build.getConfig();
-let distFolder = buildConfig.distFolder;
-let path = require('path');
-let packageFolder = buildConfig.packageFolder || '';
-let isProduction = process.argv.indexOf('--production') >= 0;
-let isNuke = process.argv.indexOf('nuke') >= 0;
-
-// Use css modules and use export =
-build.sass.setConfig({
-  useCSSModules: true,
-  moduleExportName: ''
-});
-
-// Configure custom lint overrides.
-let rules = Object.assign(
-  {},
-  require('./node_modules/@microsoft/gulp-core-build-typescript/lib/defaultTslint.json').rules,
-  require('./node_modules/office-ui-fabric-react-tslint/tslint.json').rules,
-  require('./tslint.json').rules
-);
-
-// Configure TypeScript.
-build.TypeScriptConfiguration.setTypescriptCompiler(require('typescript'));
-// Use css modules.
-build.sass.setConfig({
-  useCSSModules: true,
-  moduleExportName: ''
-});
-
-// Use Karma Tests - Disable during develoment if prefered
-build.karma.isEnabled = () => false;
-
-// Disable unnecessary subtasks.
-build.preCopy.isEnabled = () => false;
-
-// Disable tslint
-build.tslint.isEnabled = () => false;
-
-// Only run bundling in production builds; this speeds up normal ci builds.
-build.webpack.isEnabled = () => isProduction;
-
-// Copy fabric-core to dist to be published with fabric-react.
-build.postCopy.setConfig({
-  shouldFlatten: false,
-  copyTo: {
-    [path.join(distFolder, 'sass')]: [
-      'node_modules/office-ui-fabric-core/dist/sass/**/*.*'
-    ],
-    [path.join(distFolder, 'css')]: [
-      'node_modules/office-ui-fabric-core/dist/css/**/*.*'
-    ]
-  }
-});
-
-// Produce AMD bits in lib-amd on production builds.
-if (isProduction || isNuke) {
-  build.setConfig({
-    libAMDFolder: path.join(packageFolder, 'lib-amd')
-  });
-}
-
-// Short aliases for subtasks.
-build.task('webpack', build.webpack);
-build.task('tslint', build.tslint);
-build.task('ts', build.typescript);
-build.task('sass', build.sass);
-
-// initialize tasks.
-build.initialize(gulp);
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index e4ac7fdb7793f..8ab48118d69c8 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -9,6 +9,31 @@
       "resolved": "https://registry.npmjs.org/@hypnosphi/fuse.js/-/fuse.js-3.0.9.tgz",
       "integrity": "sha1-6pn2EhtKjwZbTHH4VZXbJxRJiAc="
     },
+    "@microsoft/api-extractor": {
+      "version": "4.2.6",
+      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-4.2.6.tgz",
+      "integrity": "sha1-LEQcgMR1AO/lG49ICH+gNkAGC5U=",
+      "requires": {
+        "@microsoft/node-core-library": "0.3.16",
+        "@microsoft/ts-command-line": "2.2.4",
+        "@types/fs-extra": "0.0.37",
+        "@types/node": "6.0.88",
+        "@types/z-schema": "3.16.31",
+        "colors": "1.1.2",
+        "fs-extra": "0.26.7",
+        "jju": "1.3.0",
+        "lodash": "4.15.0",
+        "typescript": "2.4.2",
+        "z-schema": "3.18.4"
+      },
+      "dependencies": {
+        "@types/node": {
+          "version": "6.0.88",
+          "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.88.tgz",
+          "integrity": "sha512-bYDPZTX0/s1aihdjLuAgogUAT5M+TpoWChEMea2p0yOcfn5bu3k6cJb9cp6nw268XeSNIGGr+4+/8V5K6BGzLQ=="
+        }
+      }
+    },
     "@microsoft/load-themed-styles": {
       "version": "1.7.9",
       "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.9.tgz",
@@ -23,14 +48,53 @@
         "loader-utils": "1.1.0"
       }
     },
+    "@microsoft/node-core-library": {
+      "version": "0.3.16",
+      "resolved": "https://registry.npmjs.org/@microsoft/node-core-library/-/node-core-library-0.3.16.tgz",
+      "integrity": "sha1-zvPzDA/N2fGvIItc6hXCLzd+d0U=",
+      "requires": {
+        "@types/fs-extra": "0.0.37",
+        "@types/node": "6.0.88",
+        "@types/z-schema": "3.16.31",
+        "fs-extra": "0.26.7",
+        "jju": "1.3.0",
+        "z-schema": "3.18.4"
+      },
+      "dependencies": {
+        "@types/node": {
+          "version": "6.0.88",
+          "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.88.tgz",
+          "integrity": "sha512-bYDPZTX0/s1aihdjLuAgogUAT5M+TpoWChEMea2p0yOcfn5bu3k6cJb9cp6nw268XeSNIGGr+4+/8V5K6BGzLQ=="
+        }
+      }
+    },
+    "@microsoft/ts-command-line": {
+      "version": "2.2.4",
+      "resolved": "https://registry.npmjs.org/@microsoft/ts-command-line/-/ts-command-line-2.2.4.tgz",
+      "integrity": "sha1-yMbdb/zeE0yt0MnVb7sRnB48KUI=",
+      "requires": {
+        "@types/argparse": "1.0.33",
+        "@types/node": "6.0.88",
+        "argparse": "1.0.9",
+        "colors": "1.1.2"
+      },
+      "dependencies": {
+        "@types/node": {
+          "version": "6.0.88",
+          "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.88.tgz",
+          "integrity": "sha512-bYDPZTX0/s1aihdjLuAgogUAT5M+TpoWChEMea2p0yOcfn5bu3k6cJb9cp6nw268XeSNIGGr+4+/8V5K6BGzLQ=="
+        }
+      }
+    },
     "@rush-temp/build": {
       "version": "file:projects/build.tgz",
-      "integrity": "sha1-qAgxZJy8shT0D7xzf+TPeo5Z0g4=",
+      "integrity": "sha1-3y96yIEnJn4Lm9NoO0VFU1ek22M=",
       "requires": {
+        "@microsoft/api-extractor": "4.2.6",
         "@microsoft/load-themed-styles": "1.7.9",
         "@microsoft/loader-load-themed-styles": "1.6.4",
         "autoprefixer": "7.1.6",
-        "awesome-typescript-loader": "3.3.0",
+        "awesome-typescript-loader": "3.4.0",
         "bundlesize": "0.15.3",
         "chalk": "2.3.0",
         "command-line-args": "4.0.7",
@@ -42,31 +106,38 @@
         "jest": "21.2.1",
         "json-loader": "0.5.7",
         "mustache": "2.3.0",
-        "node-sass": "4.6.1",
+        "node-sass": "4.7.2",
         "open": "0.0.5",
         "postcss": "6.0.14",
-        "postcss-loader": "2.0.8",
+        "postcss-loader": "2.0.9",
         "postcss-modules": "0.8.0",
         "raw-loader": "0.5.1",
         "sass-loader": "6.0.6",
         "sinon": "4.1.2",
         "source-map-loader": "0.2.3",
         "style-loader": "0.18.2",
-        "ts-jest": "21.2.2",
+        "ts-jest": "21.2.3",
         "tslint": "5.8.0",
         "tslint-microsoft-contrib": "5.0.1",
         "typescript": "2.5.3",
         "uglifyjs-webpack-plugin": "0.4.6",
         "webpack": "3.8.1",
         "webpack-bundle-analyzer": "2.9.1",
-        "webpack-dev-server": "2.9.4",
+        "webpack-dev-server": "2.9.5",
         "webpack-notifier": "1.5.0",
         "yargs": "6.6.0"
+      },
+      "dependencies": {
+        "typescript": {
+          "version": "2.5.3",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.5.3.tgz",
+          "integrity": "sha512-ptLSQs2S4QuS6/OD1eAKG+S5G8QQtrU5RT32JULdZQtM1L3WTi34Wsu48Yndzi8xsObRAB9RPt/KhA9wlpEF6w=="
+        }
       }
     },
     "@rush-temp/example-app-base": {
       "version": "file:projects/example-app-base.tgz",
-      "integrity": "sha1-j3ZQBDfqb+5tz7E4dLOSj9Hevxo=",
+      "integrity": "sha1-SzwiSZ1phwVUuI27RbEzdtUZLjY=",
       "requires": {
         "@types/chai": "3.4.35",
         "@types/enzyme": "2.8.8",
@@ -82,7 +153,7 @@
         "es6-promise": "4.1.1",
         "es6-weak-map": "2.0.2",
         "highlight.js": "9.12.0",
-        "office-ui-fabric-react": "5.21.2",
+        "office-ui-fabric-react": "5.25.0",
         "react": "15.6.2",
         "react-addons-test-utils": "15.6.2",
         "react-dom": "15.6.2",
@@ -91,12 +162,12 @@
     },
     "@rush-temp/experiments": {
       "version": "file:projects/experiments.tgz",
-      "integrity": "sha1-9QTO6I8BclPjMrmY5zBvgPVsb74=",
+      "integrity": "sha1-E2ZHgxTjX/UeaSKtObSUKi6ED1w=",
       "requires": {
         "@microsoft/load-themed-styles": "1.7.9",
         "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
-        "@types/jest": "21.1.6",
+        "@types/jest": "21.1.8",
         "@types/prop-types": "15.5.1",
         "@types/react": "15.0.38",
         "@types/react-addons-test-utils": "0.14.18",
@@ -140,7 +211,7 @@
     },
     "@rush-temp/fabric-website": {
       "version": "file:projects/fabric-website.tgz",
-      "integrity": "sha1-k2Ow8JVItV/QdyszUQxdEoPt558=",
+      "integrity": "sha1-GHmtjI9ZGbJwo9pjpDrMMytNOK4=",
       "requires": {
         "@microsoft/load-themed-styles": "1.7.9",
         "@types/chai": "3.4.35",
@@ -170,14 +241,14 @@
     },
     "@rush-temp/icons": {
       "version": "file:projects/icons.tgz",
-      "integrity": "sha1-AkZq7Bs3y6h2vgyK5z23omht6e8=",
+      "integrity": "sha1-YFLoYMckpwxlTTXvUhn28sLvaTc=",
       "requires": {
         "tslib": "1.8.0"
       }
     },
     "@rush-temp/jest-serializer-merge-styles": {
       "version": "file:projects/jest-serializer-merge-styles.tgz",
-      "integrity": "sha1-6szfoVY9zcXcBXlBMB7PBKcSl08=",
+      "integrity": "sha1-XHAnIksjI8Csaz/mByWKpKCnAfQ=",
       "requires": {
         "@types/jest": "21.1.0"
       },
@@ -191,7 +262,7 @@
     },
     "@rush-temp/merge-styles": {
       "version": "file:projects/merge-styles.tgz",
-      "integrity": "sha1-t50iXpMqJMy8Z2p0cKGIIE7uOvQ=",
+      "integrity": "sha1-tqtj0H2w4fRqAk55j7TqrtaWlYw=",
       "requires": {
         "@types/jest": "21.1.0",
         "tslib": "1.8.0"
@@ -206,7 +277,7 @@
     },
     "@rush-temp/office-ui-fabric-react": {
       "version": "file:projects/office-ui-fabric-react.tgz",
-      "integrity": "sha1-nlu+RekYUG5BUJls+WEPqMlUGJo=",
+      "integrity": "sha1-jPJusciwMkAnoYSpNZtlAyJV5SE=",
       "requires": {
         "@microsoft/load-themed-styles": "1.7.9",
         "@types/enzyme": "2.8.8",
@@ -272,14 +343,14 @@
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
       "version": "file:projects/office-ui-fabric-react-tslint.tgz",
-      "integrity": "sha1-GzUFiZZpna3icJcVWcTe5rAV8XU=",
+      "integrity": "sha1-1nzo8k0PDm/NtJv0G5B/LgTBDa4=",
       "requires": {
         "tslint-react": "3.2.0"
       }
     },
     "@rush-temp/ssr-tests": {
       "version": "file:projects/ssr-tests.tgz",
-      "integrity": "sha1-ZE4/U/YeSLDHlqXOSTp6VpZY4ho=",
+      "integrity": "sha1-bCSP4QNcNAcqOJSg7PWTKG5morE=",
       "requires": {
         "@microsoft/load-themed-styles": "1.7.9",
         "@types/chai": "3.4.35",
@@ -298,7 +369,7 @@
     },
     "@rush-temp/styling": {
       "version": "file:projects/styling.tgz",
-      "integrity": "sha1-23kYksM8t8ZVnx375XO/GI9N4i8=",
+      "integrity": "sha1-66IbcFY1rUoYqiGu/3zpvbiJraY=",
       "requires": {
         "@microsoft/load-themed-styles": "1.7.9",
         "@types/chai": "3.4.35",
@@ -315,7 +386,7 @@
     },
     "@rush-temp/test-bundle-button": {
       "version": "file:projects/test-bundle-button.tgz",
-      "integrity": "sha1-HSXlu7lKD78clB/eJ5Grw5fhhGs=",
+      "integrity": "sha1-LUH1FnhgbdjBXqhz7EBNb+ks4Gk=",
       "requires": {
         "@types/prop-types": "15.5.1",
         "@types/react": "15.0.38",
@@ -328,7 +399,7 @@
     },
     "@rush-temp/todo-app": {
       "version": "file:projects/todo-app.tgz",
-      "integrity": "sha1-cgVLRhrg0Pf6/MQDwoH8p1nsuLM=",
+      "integrity": "sha1-gTwqYJZKXWJ6kSlivz+Vj0y5mi4=",
       "requires": {
         "@microsoft/load-themed-styles": "1.7.9",
         "@types/chai": "3.4.35",
@@ -339,23 +410,16 @@
         "@types/react-dom": "15.5.1",
         "@types/webpack-env": "1.13.0",
         "es6-promise": "4.1.1",
-        "immutability-helper": "2.5.0",
+        "immutability-helper": "2.5.1",
         "react": "15.6.2",
         "react-dom": "15.6.2",
         "tslib": "1.8.0",
         "typescript": "2.4.2"
-      },
-      "dependencies": {
-        "typescript": {
-          "version": "2.4.2",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.4.2.tgz",
-          "integrity": "sha1-+DlfhdRZJ2BnyYiqQYN6j4KHCEQ="
-        }
       }
     },
     "@rush-temp/utilities": {
       "version": "file:projects/utilities.tgz",
-      "integrity": "sha1-eifOqcSqgCPno7Tz/TKlJsGWi7U=",
+      "integrity": "sha1-ahWxuvm6UokIpgPUXsrt3g8n9tM=",
       "requires": {
         "@microsoft/load-themed-styles": "1.7.9",
         "@types/enzyme": "2.8.8",
@@ -401,14 +465,14 @@
     },
     "@rush-temp/vr-tests": {
       "version": "file:projects/vr-tests.tgz",
-      "integrity": "sha1-EPzI9nOhBbi5RlMEbMS7C0Fcgw8=",
+      "integrity": "sha1-r8KaHdf8UJ4y1Ur6Rp8mfV6oz7U=",
       "requires": {
         "@storybook/addon-options": "3.2.3",
         "@storybook/react": "3.2.16",
         "@types/react": "15.0.38",
         "@types/react-dom": "15.5.1",
         "@types/storybook__react": "3.0.5",
-        "awesome-typescript-loader": "3.3.0",
+        "awesome-typescript-loader": "3.4.0",
         "css-loader": "0.27.3",
         "file-loader": "0.11.1",
         "postcss-loader": "1.3.3",
@@ -416,7 +480,7 @@
         "react": "15.6.2",
         "react-dom": "15.6.2",
         "screener-runner": "0.6.19",
-        "screener-storybook": "0.9.8",
+        "screener-storybook": "0.9.9",
         "storybook-readme": "3.0.6",
         "style-loader": "0.16.1",
         "tslib": "1.8.0",
@@ -518,11 +582,6 @@
           "requires": {
             "has-flag": "1.0.0"
           }
-        },
-        "typescript": {
-          "version": "2.4.2",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.4.2.tgz",
-          "integrity": "sha1-+DlfhdRZJ2BnyYiqQYN6j4KHCEQ="
         }
       }
     },
@@ -620,8 +679,8 @@
         "babel-runtime": "6.26.0",
         "case-sensitive-paths-webpack-plugin": "2.1.1",
         "chalk": "2.3.0",
-        "commander": "2.11.0",
-        "common-tags": "1.4.0",
+        "commander": "2.12.1",
+        "common-tags": "1.5.1",
         "configstore": "3.1.1",
         "core-js": "2.5.1",
         "css-loader": "0.28.7",
@@ -637,7 +696,7 @@
         "lodash.flattendeep": "4.4.0",
         "lodash.pick": "4.4.0",
         "postcss-flexbugs-fixes": "3.2.0",
-        "postcss-loader": "2.0.8",
+        "postcss-loader": "2.0.9",
         "prop-types": "15.6.0",
         "qs": "6.5.1",
         "redux": "3.7.2",
@@ -649,8 +708,8 @@
         "util-deprecate": "1.0.2",
         "uuid": "3.1.0",
         "webpack": "3.8.1",
-        "webpack-dev-middleware": "1.12.0",
-        "webpack-hot-middleware": "2.20.0"
+        "webpack-dev-middleware": "1.12.2",
+        "webpack-hot-middleware": "2.21.0"
       },
       "dependencies": {
         "file-loader": {
@@ -728,28 +787,33 @@
         "qs": "6.5.1",
         "react-icons": "2.2.7",
         "react-inspector": "2.2.1",
-        "react-modal": "3.1.2",
+        "react-modal": "3.1.4",
         "react-split-pane": "0.1.71",
         "react-treebeard": "2.1.0",
         "redux": "3.7.2"
       }
     },
+    "@types/argparse": {
+      "version": "1.0.33",
+      "resolved": "https://registry.npmjs.org/@types/argparse/-/argparse-1.0.33.tgz",
+      "integrity": "sha512-VQgHxyPMTj3hIlq9SY1mctqx+Jj8kpQfoLvDlVSDNOyuYs8JYfkuY3OW/4+dO657yPmNhHpePRx0/Tje5ImNVQ=="
+    },
     "@types/chai": {
       "version": "3.4.35",
       "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.35.tgz",
       "integrity": "sha1-6NZfg0ktKUT4FvxiB0GCHCioyQA="
     },
     "@types/cheerio": {
-      "version": "0.22.5",
-      "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.5.tgz",
-      "integrity": "sha512-Moft0SFkFG4RbRykJSsRFnPOS306hMF/lH+Ru/ugej/vzcGBpjzoJrf8P7gupouQYbbiXxhtN/5JMJWlsHYqIw=="
+      "version": "0.22.6",
+      "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.6.tgz",
+      "integrity": "sha512-Nyk3Gut4CMFZOebvutYAk/Nis7d6u9b7VX4OcG4zUX5gnKnXMiq+8EPdcX7FVakeL4+t770iy8E46W8ZSSXeFA=="
     },
     "@types/enzyme": {
       "version": "2.8.8",
       "resolved": "https://registry.npmjs.org/@types/enzyme/-/enzyme-2.8.8.tgz",
       "integrity": "sha512-KBw0ZzOQNtwVGO4egRjEpQbXMFCSevy+gRFzaLXrU64LrVVuJF0FqVIdzed0NCSP+nMALj001//dwYKV/VDlCA==",
       "requires": {
-        "@types/cheerio": "0.22.5",
+        "@types/cheerio": "0.22.6",
         "@types/react": "15.0.38"
       }
     },
@@ -758,6 +822,14 @@
       "resolved": "https://registry.npmjs.org/@types/es6-promise/-/es6-promise-0.0.32.tgz",
       "integrity": "sha1-O89E+x5Cnz33YYjIxth0Rjujcf0="
     },
+    "@types/fs-extra": {
+      "version": "0.0.37",
+      "resolved": "https://registry.npmjs.org/@types/fs-extra/-/fs-extra-0.0.37.tgz",
+      "integrity": "sha1-GV8RvNmhuX2eQSxrZombVFRxofc=",
+      "requires": {
+        "@types/node": "8.0.26"
+      }
+    },
     "@types/highlight.js": {
       "version": "9.1.9",
       "resolved": "https://registry.npmjs.org/@types/highlight.js/-/highlight.js-9.1.9.tgz",
@@ -769,9 +841,9 @@
       "integrity": "sha512-+kbOcYW1/noncDwRryRoB9tH87IYcMfdBGvw98iocK39LtTA2DFL7agmk4UHW/GxjzVfwrxfjlLrqrgA7MCtmg=="
     },
     "@types/jest": {
-      "version": "21.1.6",
-      "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.6.tgz",
-      "integrity": "sha512-/qrwhjCeZ8vZy/TPXm56A3baMMUDPfUMkhOGZP3M7dgPCGPZSX/zSieM7jYPuhX3kMcMfsYuvsFIt23u7Ypu2g=="
+      "version": "21.1.8",
+      "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.8.tgz",
+      "integrity": "sha512-hQbL8aBM/g5S++sM1gb4yC73Dg+FK3uYE+Ioht1RPy629+LV/RmH6q+e+jbQEwKJdWAP/YE4s67CPO+ElkMivg=="
     },
     "@types/mocha": {
       "version": "2.2.39",
@@ -841,12 +913,17 @@
       "resolved": "https://registry.npmjs.org/@types/webpack-env/-/webpack-env-1.13.0.tgz",
       "integrity": "sha1-MEQ4FkfhHulzxa8uklMjkw9pHYA="
     },
+    "@types/z-schema": {
+      "version": "3.16.31",
+      "resolved": "https://registry.npmjs.org/@types/z-schema/-/z-schema-3.16.31.tgz",
+      "integrity": "sha1-LrHQCl5Ow/pYx2r94S4YK2bcXBw="
+    },
     "@uifabric/icons": {
       "version": "5.2.0",
       "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.2.0.tgz",
       "integrity": "sha512-P5kfPej/wxgR8jZt/GqnU0FqYcz+JH1iCcaaYd6p9L3opmZtu4w5duKeqs+Bc1u7K16r800EQfLgKe76rt6AuA==",
       "requires": {
-        "@uifabric/styling": "5.7.0",
+        "@uifabric/styling": "5.10.1",
         "tslib": "1.8.0"
       }
     },
@@ -859,9 +936,9 @@
       }
     },
     "@uifabric/styling": {
-      "version": "5.7.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.7.0.tgz",
-      "integrity": "sha512-qEq16h2sii7dmxZY2JxG5lbl2n5wftYyaEk09C5Zsu/PVH8Ld60czflXdrgbDdLMhocQomlHJeTTM+cQQ0wtFQ==",
+      "version": "5.10.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.10.1.tgz",
+      "integrity": "sha512-zvRLjwDLhUxjxU+ymfIHZitII3Udg7uNppD4UlP5R0b2hKZeTXM4jeDZs4mC6yNdmz3EIFMPoSUJVPYK9ALsSA==",
       "requires": {
         "@microsoft/load-themed-styles": "1.7.9",
         "@uifabric/merge-styles": "5.6.0",
@@ -953,9 +1030,9 @@
       }
     },
     "ajv": {
-      "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/ajv/-/ajv-5.3.0.tgz",
-      "integrity": "sha1-RBT/dKUIecII7l/cgm4ywwNUnto=",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-5.5.0.tgz",
+      "integrity": "sha1-6yhAdG6dxIvV4GOjbj/UAMXqtak=",
       "requires": {
         "co": "4.6.0",
         "fast-deep-equal": "1.0.0",
@@ -1188,7 +1265,7 @@
       "integrity": "sha1-GEtI9i2S10UrsxsyMWXH+L0CJm0=",
       "requires": {
         "define-properties": "1.1.2",
-        "es-abstract": "1.9.0"
+        "es-abstract": "1.10.0"
       }
     },
     "array-map": {
@@ -1272,7 +1349,7 @@
       "resolved": "https://registry.npmjs.org/async/-/async-2.6.0.tgz",
       "integrity": "sha512-xAfGg1/NTLBBKlHFmnd7PlmUW9KhVQIUuSrYem9xzFUZy13ScvtyGGejaae9iAVRiRq9+Cx7DPFaAAhCpyxyPw==",
       "requires": {
-        "lodash": "4.17.4"
+        "lodash": "4.15.0"
       }
     },
     "async-each": {
@@ -1310,8 +1387,8 @@
       "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-7.1.6.tgz",
       "integrity": "sha512-C9yv/UF3X+eJTi/zvfxuyfxmLibYrntpF3qoJYrMeQwgUJOZrZvpJiMG2FMQ3qnhWtF/be4pYONBBw95ZGe3vA==",
       "requires": {
-        "browserslist": "2.9.0",
-        "caniuse-lite": "1.0.30000765",
+        "browserslist": "2.9.1",
+        "caniuse-lite": "1.0.30000772",
         "normalize-range": "0.1.2",
         "num2fraction": "1.2.2",
         "postcss": "6.0.14",
@@ -1319,9 +1396,9 @@
       }
     },
     "awesome-typescript-loader": {
-      "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/awesome-typescript-loader/-/awesome-typescript-loader-3.3.0.tgz",
-      "integrity": "sha512-BZklPjSHwOF15sQ28Bo25HMzH4WrF1i2CLr105lXe2p/o++F5n4Mi4My3WHJhG8bEpXweqlVN6b03ZFKvANXiA==",
+      "version": "3.4.0",
+      "resolved": "https://registry.npmjs.org/awesome-typescript-loader/-/awesome-typescript-loader-3.4.0.tgz",
+      "integrity": "sha512-sXPUe8HexKO4/NGTOtFP7ue+LbaALphiP22A8FaJCZT2avTtMQj3uVtrPRIvNf/6484i8rgx9d//jewiaqFH0w==",
       "requires": {
         "colors": "1.1.2",
         "enhanced-resolve": "3.3.0",
@@ -1331,6 +1408,13 @@
         "mkdirp": "0.5.1",
         "object-assign": "4.1.1",
         "source-map-support": "0.4.18"
+      },
+      "dependencies": {
+        "lodash": {
+          "version": "4.17.4",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+        }
       }
     },
     "aws-sign2": {
@@ -1348,7 +1432,7 @@
       "resolved": "https://registry.npmjs.org/axios/-/axios-0.16.2.tgz",
       "integrity": "sha1-uk+S8XFn37q0CYN4VFS5rBScPG0=",
       "requires": {
-        "follow-redirects": "1.2.5",
+        "follow-redirects": "1.2.6",
         "is-buffer": "1.1.6"
       }
     },
@@ -1401,7 +1485,7 @@
         "babel-traverse": "6.26.0",
         "babel-types": "6.26.0",
         "babylon": "6.18.0",
-        "convert-source-map": "1.5.0",
+        "convert-source-map": "1.5.1",
         "debug": "2.6.9",
         "json5": "0.5.1",
         "lodash": "4.17.4",
@@ -1412,6 +1496,11 @@
         "source-map": "0.5.7"
       },
       "dependencies": {
+        "lodash": {
+          "version": "4.17.4",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+        },
         "source-map": {
           "version": "0.5.7",
           "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
@@ -1439,6 +1528,11 @@
           "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-1.3.0.tgz",
           "integrity": "sha1-RsP+yMGJKxKwgz25vHYiF226s0s="
         },
+        "lodash": {
+          "version": "4.17.4",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+        },
         "source-map": {
           "version": "0.5.7",
           "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
@@ -1496,6 +1590,13 @@
         "babel-runtime": "6.26.0",
         "babel-types": "6.26.0",
         "lodash": "4.17.4"
+      },
+      "dependencies": {
+        "lodash": {
+          "version": "4.17.4",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+        }
       }
     },
     "babel-helper-evaluate-path": {
@@ -1591,6 +1692,13 @@
         "babel-runtime": "6.26.0",
         "babel-types": "6.26.0",
         "lodash": "4.17.4"
+      },
+      "dependencies": {
+        "lodash": {
+          "version": "4.17.4",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+        }
       }
     },
     "babel-helper-remap-async-to-generator": {
@@ -1787,7 +1895,7 @@
       "integrity": "sha512-11Yxwk8/iEULr+n5DG0BxXD6j/9htpiiR0/hLfi/gtEAK/d6NCNkyKFrC8loQcyMvF3hehPo30SKXG/itSX+hw==",
       "requires": {
         "babel-types": "6.26.0",
-        "lodash": "4.17.4",
+        "lodash": "4.15.0",
         "react-docgen": "2.20.0"
       }
     },
@@ -1949,6 +2057,13 @@
         "babel-traverse": "6.26.0",
         "babel-types": "6.26.0",
         "lodash": "4.17.4"
+      },
+      "dependencies": {
+        "lodash": {
+          "version": "4.17.4",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+        }
       }
     },
     "babel-plugin-transform-es2015-classes": {
@@ -2365,7 +2480,7 @@
         "babel-plugin-transform-es2015-unicode-regex": "6.24.1",
         "babel-plugin-transform-exponentiation-operator": "6.24.1",
         "babel-plugin-transform-regenerator": "6.26.0",
-        "browserslist": "2.9.0",
+        "browserslist": "2.9.1",
         "invariant": "2.2.2",
         "semver": "5.4.1"
       }
@@ -2504,6 +2619,13 @@
         "lodash": "4.17.4",
         "mkdirp": "0.5.1",
         "source-map-support": "0.4.18"
+      },
+      "dependencies": {
+        "lodash": {
+          "version": "4.17.4",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+        }
       }
     },
     "babel-runtime": {
@@ -2532,6 +2654,13 @@
         "babel-types": "6.26.0",
         "babylon": "6.18.0",
         "lodash": "4.17.4"
+      },
+      "dependencies": {
+        "lodash": {
+          "version": "4.17.4",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+        }
       }
     },
     "babel-traverse": {
@@ -2548,6 +2677,13 @@
         "globals": "9.18.0",
         "invariant": "2.2.2",
         "lodash": "4.17.4"
+      },
+      "dependencies": {
+        "lodash": {
+          "version": "4.17.4",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+        }
       }
     },
     "babel-types": {
@@ -2559,6 +2695,13 @@
         "esutils": "2.0.2",
         "lodash": "4.17.4",
         "to-fast-properties": "1.0.3"
+      },
+      "dependencies": {
+        "lodash": {
+          "version": "4.17.4",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+        }
       }
     },
     "babylon": {
@@ -2610,9 +2753,9 @@
       }
     },
     "binary-extensions": {
-      "version": "1.10.0",
-      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.10.0.tgz",
-      "integrity": "sha1-muuabF6IY4qtFx4Wf1kAq+JINdA="
+      "version": "1.11.0",
+      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.11.0.tgz",
+      "integrity": "sha1-RqoXUftqL5PuXmibsQh9SxTGwgU="
     },
     "block-stream": {
       "version": "0.0.9",
@@ -2658,7 +2801,7 @@
         "deep-equal": "1.0.1",
         "dns-equal": "1.0.0",
         "dns-txt": "2.0.2",
-        "multicast-dns": "6.1.1",
+        "multicast-dns": "6.2.1",
         "multicast-dns-service-types": "1.1.0"
       },
       "dependencies": {
@@ -2710,7 +2853,7 @@
         "repeat-element": "1.1.2",
         "snapdragon": "0.8.1",
         "snapdragon-node": "2.1.1",
-        "split-string": "3.0.2",
+        "split-string": "3.1.0",
         "to-regex": "3.0.1"
       }
     },
@@ -2809,11 +2952,11 @@
       }
     },
     "browserslist": {
-      "version": "2.9.0",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.9.0.tgz",
-      "integrity": "sha512-vJEBcDTANoDhSHL46NeOEW5hvQw7It9uCqzeFPQhpawXfnOwnpvW5C97vn1eGJ7iCkSg8wWU0nYObE7d/N95Iw==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.9.1.tgz",
+      "integrity": "sha512-3n3nPdbUqn3nWmsy4PeSQthz2ja1ndpoXta+dwFFNhveGjMg6FXpWYe12vsTpNoXJbzx3j7GZXdtoVIdvh3JbA==",
       "requires": {
-        "caniuse-lite": "1.0.30000765",
+        "caniuse-lite": "1.0.30000772",
         "electron-to-chromium": "1.3.27"
       }
     },
@@ -2868,19 +3011,19 @@
         "axios": "0.16.2",
         "bytes": "3.0.0",
         "ci-env": "1.5.2",
-        "commander": "2.11.0",
+        "commander": "2.12.1",
         "github-build": "1.2.0",
         "glob": "7.1.2",
-        "gzip-size": "4.0.0",
+        "gzip-size": "4.1.0",
         "opencollective": "1.0.3",
         "prettycli": "1.4.3",
         "read-pkg-up": "2.0.0"
       },
       "dependencies": {
         "gzip-size": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-4.0.0.tgz",
-          "integrity": "sha512-6SWfFRd8r8VTKTpJCR7h/T6IbCaK+jM/n2gB1+pV3IrKcrLO1WTb8ZWdaRy1T/nwOz80cp4gAJf8sujpZxfA1w==",
+          "version": "4.1.0",
+          "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-4.1.0.tgz",
+          "integrity": "sha1-iuCWJX6r59acRb4rZ8RIEk/7UXw=",
           "requires": {
             "duplexer": "0.1.1",
             "pify": "3.0.0"
@@ -2941,7 +3084,7 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw=",
       "requires": {
         "browserslist": "1.7.7",
-        "caniuse-db": "1.0.30000765",
+        "caniuse-db": "1.0.30000772",
         "lodash.memoize": "4.1.2",
         "lodash.uniq": "4.5.0"
       },
@@ -2951,21 +3094,21 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000765",
+            "caniuse-db": "1.0.30000772",
             "electron-to-chromium": "1.3.27"
           }
         }
       }
     },
     "caniuse-db": {
-      "version": "1.0.30000765",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000765.tgz",
-      "integrity": "sha1-FVVUMkILqsuxabxR5bbegEyZlLQ="
+      "version": "1.0.30000772",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000772.tgz",
+      "integrity": "sha1-UarokXaChureSj2DGep21qAbUSs="
     },
     "caniuse-lite": {
-      "version": "1.0.30000765",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000765.tgz",
-      "integrity": "sha1-qhp1AZJ2tIRjwPyipSV/ufJqfJ0="
+      "version": "1.0.30000772",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000772.tgz",
+      "integrity": "sha1-eBKWIsq/7Xrx/zi2SraApqCGVCA="
     },
     "cardinal": {
       "version": "1.0.0",
@@ -3025,6 +3168,11 @@
         "supports-color": "4.5.0"
       }
     },
+    "chardet": {
+      "version": "0.4.2",
+      "resolved": "https://registry.npmjs.org/chardet/-/chardet-0.4.2.tgz",
+      "integrity": "sha1-tUc7M9yXxCTl2Y3IfVXU2KKci/I="
+    },
     "cheerio": {
       "version": "0.22.0",
       "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-0.22.0.tgz",
@@ -3069,9 +3217,9 @@
       "integrity": "sha512-6NSB3PSw6L7w9vqmlTveD1JpaOhngFYRqhFKNPtSLpx8kpu/3BZwf84Sz8+hsmDzaD+ITuuiNdN6ya5c2DhHWg=="
     },
     "ci-info": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-1.1.1.tgz",
-      "integrity": "sha512-vHDDF/bP9RYpTWtUhpJRhCFdvvp3iDWvEbuDbWgvjUrNGV1MXJrE0MPcwGtEled04m61iwdBLUIHZtDgzWS4ZQ=="
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-1.1.2.tgz",
+      "integrity": "sha512-uTGIPNx/nSpBdsF6xnseRXLLtfr9VLqkz8ZqHXr3Y7b6SftyRxBGjwMtJj1OhNbmlc1wZzLNAlAcvyIiE8a6ZA=="
     },
     "cipher-base": {
       "version": "1.0.4",
@@ -3354,14 +3502,14 @@
       }
     },
     "commander": {
-      "version": "2.11.0",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-2.11.0.tgz",
-      "integrity": "sha512-b0553uYA5YAEGgyYIGYROzKQ7X5RAqedkfjiZxwi0kL1g3bOaBNNZfYkzt/CL0umgD5wc9Jec2FbB98CjkMRvQ=="
+      "version": "2.12.1",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-2.12.1.tgz",
+      "integrity": "sha512-PCNLExLlI5HiPdaJs4pMXwOTHkSCpNQ1QJH9ykZLKtKEyKu3p9HgmH5l97vM8c0IUz6d54l+xEu2GG9yuYrFzA=="
     },
     "common-tags": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/common-tags/-/common-tags-1.4.0.tgz",
-      "integrity": "sha1-EYe+Tz1M8MBCfUP3Tu8fc1AWFMA=",
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/common-tags/-/common-tags-1.5.1.tgz",
+      "integrity": "sha512-NrUYGY5TApAk9KB+IZXkR3GR4tA3g26HDsoiGt4kCMHZ727gOGkC+UNfq0Z22jE15bLkc/6RV5Jw1RBW6Usg6A==",
       "requires": {
         "babel-runtime": "6.26.0"
       }
@@ -3498,9 +3646,9 @@
       "integrity": "sha512-lM4l4CnMEwOLHAHr/P6MEZwZFPJFtAAKgL6pogbXmVZggIqXhdB6RbBtPOTsw2FcXwYhehRGERJmRrjOiIB8pQ=="
     },
     "convert-source-map": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.5.0.tgz",
-      "integrity": "sha1-ms1whRxtXf3ZPZKC5e35SgP/RrU="
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.5.1.tgz",
+      "integrity": "sha1-uCeAl7m8IpNl3lxiz1/K7YtVmeU="
     },
     "cookie": {
       "version": "0.3.1",
@@ -3897,7 +4045,7 @@
           "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ=",
           "requires": {
             "browserslist": "1.7.7",
-            "caniuse-db": "1.0.30000765",
+            "caniuse-db": "1.0.30000772",
             "normalize-range": "0.1.2",
             "num2fraction": "1.2.2",
             "postcss": "5.2.18",
@@ -3909,7 +4057,7 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000765",
+            "caniuse-db": "1.0.30000772",
             "electron-to-chromium": "1.3.27"
           }
         },
@@ -4005,7 +4153,7 @@
       "resolved": "https://registry.npmjs.org/d/-/d-1.0.0.tgz",
       "integrity": "sha1-dUu1v+VUUdpppYuU1F9MWwRi1Y8=",
       "requires": {
-        "es5-ext": "0.10.35"
+        "es5-ext": "0.10.37"
       }
     },
     "dashdash": {
@@ -4219,12 +4367,11 @@
       }
     },
     "doctrine": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-2.0.0.tgz",
-      "integrity": "sha1-xz2NKQnSIpHhoAejlYBNqLZl/mM=",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-2.0.2.tgz",
+      "integrity": "sha512-y0tm5Pq6ywp3qSTZ1vPgVdAnbDEoeoc5wlOHXoY1c4Wug/a7JvqHIl7BTvwodaHmejWkK/9dSb3sCYfyo/om8A==",
       "requires": {
-        "esutils": "2.0.2",
-        "isarray": "1.0.0"
+        "esutils": "2.0.2"
       }
     },
     "dom-helpers": {
@@ -4371,6 +4518,13 @@
         "object.values": "1.0.4",
         "prop-types": "15.6.0",
         "uuid": "3.1.0"
+      },
+      "dependencies": {
+        "lodash": {
+          "version": "4.17.4",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+        }
       }
     },
     "errno": {
@@ -4390,9 +4544,9 @@
       }
     },
     "es-abstract": {
-      "version": "1.9.0",
-      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.9.0.tgz",
-      "integrity": "sha512-kk3IJoKo7A3pWJc0OV8yZ/VEX2oSUytfekrJiqoxBlKJMFAJVJVpGdHClCCTdv+Fn2zHfpDHHIelMFhZVfef3Q==",
+      "version": "1.10.0",
+      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.10.0.tgz",
+      "integrity": "sha512-/uh/DhdqIOSkAWifU+8nG78vlQxdLckUdI/sPgy0VhuXi2qJ7T8czBmqIYtLQVpCIFYafChnsRsB5pyb1JdmCQ==",
       "requires": {
         "es-to-primitive": "1.1.1",
         "function-bind": "1.1.1",
@@ -4412,9 +4566,9 @@
       }
     },
     "es5-ext": {
-      "version": "0.10.35",
-      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.35.tgz",
-      "integrity": "sha1-GO6FjOajxFx9eekcFfzKnsVoSU8=",
+      "version": "0.10.37",
+      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.37.tgz",
+      "integrity": "sha1-DudB0Ui4AGm6J9AgOTdWryV978M=",
       "requires": {
         "es6-iterator": "2.0.3",
         "es6-symbol": "3.1.1"
@@ -4431,7 +4585,7 @@
       "integrity": "sha1-p96IkUGgWpSwhUQDstCg+/qY87c=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.35",
+        "es5-ext": "0.10.37",
         "es6-symbol": "3.1.1"
       }
     },
@@ -4441,7 +4595,7 @@
       "integrity": "sha1-kTbgUD3MBqMBaQ8LsU/042TpSfA=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.35",
+        "es5-ext": "0.10.37",
         "es6-iterator": "2.0.3",
         "es6-set": "0.1.5",
         "es6-symbol": "3.1.1",
@@ -4459,7 +4613,7 @@
       "integrity": "sha1-0rPsXU2ADO2BjbU40ol02wpzzLE=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.35",
+        "es5-ext": "0.10.37",
         "es6-iterator": "2.0.3",
         "es6-symbol": "3.1.1",
         "event-emitter": "0.3.5"
@@ -4476,7 +4630,7 @@
       "integrity": "sha1-vwDvT9q2uhtG7Le2KbTH7VcVzHc=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.35"
+        "es5-ext": "0.10.37"
       }
     },
     "es6-weak-map": {
@@ -4485,7 +4639,7 @@
       "integrity": "sha1-XjqzIlH/0VOKH45f+hNXdy+S2W8=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.35",
+        "es5-ext": "0.10.37",
         "es6-iterator": "2.0.3",
         "es6-symbol": "3.1.1"
       }
@@ -4564,7 +4718,7 @@
       "integrity": "sha1-34xp7vFkeSPHFXuc6DhAYQsCzDk=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.35"
+        "es5-ext": "0.10.37"
       }
     },
     "eventemitter3": {
@@ -4777,12 +4931,12 @@
       }
     },
     "external-editor": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/external-editor/-/external-editor-2.0.5.tgz",
-      "integrity": "sha512-Msjo64WT5W+NhOpQXh0nOHm+n0RfU1QUwDnKYvJ8dEJ8zlwLrqXNTv5mSUTJpepf41PDJGyhueTw2vNZW+Fr/w==",
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/external-editor/-/external-editor-2.1.0.tgz",
+      "integrity": "sha512-E44iT5QVOUJBKij4IIV3uvxuNlbKS38Tw1HiupxEIHPv9qtC2PrDYohbXV5U+1jnfIXttny8gUhj+oZvflFlzA==",
       "requires": {
+        "chardet": "0.4.2",
         "iconv-lite": "0.4.19",
-        "jschardet": "1.6.0",
         "tmp": "0.0.33"
       }
     },
@@ -4976,11 +5130,21 @@
       "integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I="
     },
     "follow-redirects": {
-      "version": "1.2.5",
-      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.2.5.tgz",
-      "integrity": "sha512-lMhwQTryFbG+wYsAIEKC1Kf5IGDlVNnONRogIBllh7LLoV7pNIxW0z9fhjRar9NBql+hd2Y49KboVVNxf6GEfg==",
+      "version": "1.2.6",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.2.6.tgz",
+      "integrity": "sha512-FrMqZ/FONtHnbqO651UPpfRUVukIEwJhXMfdr/JWAmrDbeYBu773b1J6gdWDyRIj4hvvzQEHoEOTrdR8o6KLYA==",
       "requires": {
-        "debug": "2.6.9"
+        "debug": "3.1.0"
+      },
+      "dependencies": {
+        "debug": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
+          "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
+          "requires": {
+            "ms": "2.0.0"
+          }
+        }
       }
     },
     "for-in": {
@@ -5043,13 +5207,15 @@
       "integrity": "sha1-PYyt2Q2XZWn6g1qx+OSyOhBWBac="
     },
     "fs-extra": {
-      "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-4.0.2.tgz",
-      "integrity": "sha1-+RcExT0bRh+JNFKwwwfZmXZHq2s=",
+      "version": "0.26.7",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz",
+      "integrity": "sha1-muH92UiXeY7at20JGM9C0MMYT6k=",
       "requires": {
         "graceful-fs": "4.1.11",
-        "jsonfile": "4.0.0",
-        "universalify": "0.1.1"
+        "jsonfile": "2.4.0",
+        "klaw": "1.3.1",
+        "path-is-absolute": "1.0.1",
+        "rimraf": "2.6.2"
       }
     },
     "fs.realpath": {
@@ -5205,7 +5371,7 @@
       "requires": {
         "follow-redirects": "0.0.7",
         "https-proxy-agent": "1.0.0",
-        "mime": "1.4.1",
+        "mime": "1.6.0",
         "netrc": "0.1.4"
       },
       "dependencies": {
@@ -5358,6 +5524,13 @@
         "glob": "7.1.2",
         "lodash": "4.17.4",
         "minimatch": "3.0.4"
+      },
+      "dependencies": {
+        "lodash": {
+          "version": "4.17.4",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+        }
       }
     },
     "graceful-fs": {
@@ -5429,7 +5602,7 @@
       "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-5.0.3.tgz",
       "integrity": "sha1-ukAsJmGU8VlW7xXg/PJCmT9qff0=",
       "requires": {
-        "ajv": "5.3.0",
+        "ajv": "5.5.0",
         "har-schema": "2.0.0"
       }
     },
@@ -5722,6 +5895,11 @@
             "is-buffer": "1.1.6"
           }
         },
+        "lodash": {
+          "version": "4.17.4",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+        },
         "micromatch": {
           "version": "2.3.11",
           "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
@@ -5813,9 +5991,9 @@
       "integrity": "sha1-vjPUCsEO8ZJnAfbwii2G+/0a0+Q="
     },
     "immutability-helper": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.5.0.tgz",
-      "integrity": "sha512-hbOOUruoaBQ04LH1QvUcycfM36y7xlmCKlIQXXyEiry/KeqBUNqq5BsV+KVzhYfgxk4RdFkDuhKaqhHKpjs7XA==",
+      "version": "2.5.1",
+      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.5.1.tgz",
+      "integrity": "sha512-5bf/qTcnP1LbViXgj845PGW6a6ekQh2kkTf5kBo5zQopHROGHZS7vHGYwfS2y6wjKnmQtCbky0/rNXG6Yk+CrA==",
       "requires": {
         "invariant": "2.2.2"
       }
@@ -5894,9 +6072,9 @@
         "chalk": "1.1.3",
         "cli-cursor": "2.1.0",
         "cli-width": "2.2.0",
-        "external-editor": "2.0.5",
+        "external-editor": "2.1.0",
         "figures": "2.0.0",
-        "lodash": "4.17.4",
+        "lodash": "4.15.0",
         "mute-stream": "0.0.7",
         "run-async": "2.3.0",
         "rx": "4.1.0",
@@ -5998,7 +6176,7 @@
       "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-1.0.1.tgz",
       "integrity": "sha1-dfFmQrSA8YenEcgUFh/TpKdlWJg=",
       "requires": {
-        "binary-extensions": "1.10.0"
+        "binary-extensions": "1.11.0"
       }
     },
     "is-buffer": {
@@ -6024,7 +6202,7 @@
       "resolved": "https://registry.npmjs.org/is-ci/-/is-ci-1.0.10.tgz",
       "integrity": "sha1-9zkzayYyNlBhqdSCcM1WrjNpMY4=",
       "requires": {
-        "ci-info": "1.1.1"
+        "ci-info": "1.1.2"
       }
     },
     "is-data-descriptor": {
@@ -6502,7 +6680,7 @@
             "string-length": "2.0.0",
             "strip-ansi": "4.0.0",
             "which": "1.3.0",
-            "worker-farm": "1.5.1",
+            "worker-farm": "1.5.2",
             "yargs": "9.0.1"
           }
         },
@@ -6640,7 +6818,7 @@
         "jest-docblock": "21.2.0",
         "micromatch": "2.3.11",
         "sane": "2.2.0",
-        "worker-farm": "1.5.1"
+        "worker-farm": "1.5.2"
       },
       "dependencies": {
         "arr-diff": {
@@ -6858,7 +7036,7 @@
         "jest-util": "21.2.1",
         "pify": "3.0.0",
         "throat": "4.1.0",
-        "worker-farm": "1.5.1"
+        "worker-farm": "1.5.2"
       }
     },
     "jest-runtime": {
@@ -6870,7 +7048,7 @@
         "babel-jest": "21.2.0",
         "babel-plugin-istanbul": "4.1.5",
         "chalk": "2.3.0",
-        "convert-source-map": "1.5.0",
+        "convert-source-map": "1.5.1",
         "graceful-fs": "4.1.11",
         "jest-config": "21.2.1",
         "jest-haste-map": "21.2.0",
@@ -7012,6 +7190,11 @@
         "pretty-format": "21.2.1"
       }
     },
+    "jju": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/jju/-/jju-1.3.0.tgz",
+      "integrity": "sha1-2t2e8BkkvHKLA/L3l5vb1i96Kqo="
+    },
     "joi": {
       "version": "9.2.0",
       "resolved": "https://registry.npmjs.org/joi/-/joi-9.2.0.tgz",
@@ -7043,11 +7226,6 @@
         "esprima": "2.7.3"
       }
     },
-    "jschardet": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/jschardet/-/jschardet-1.6.0.tgz",
-      "integrity": "sha512-xYuhvQ7I9PDJIGBWev9xm0+SMSed3ZDBAmvVjbFR1ZRLAF+vlXcQu6cRI9uAlj81rzikElRVteehwV7DuX2ZmQ=="
-    },
     "jsdom": {
       "version": "9.12.0",
       "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-9.12.0.tgz",
@@ -7118,9 +7296,9 @@
       "integrity": "sha1-Hq3nrMASA0rYTiOWdn6tn6VJWCE="
     },
     "jsonfile": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-4.0.0.tgz",
-      "integrity": "sha1-h3Gq4HmbZAdrdmQPygWPnBDjPss=",
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz",
+      "integrity": "sha1-NzaitCi4e72gzIO1P6PWM6NcKug=",
       "requires": {
         "graceful-fs": "4.1.11"
       }
@@ -7162,9 +7340,17 @@
       "integrity": "sha1-2ouEvUfeU5WHj5XWTQLyRJ/gXms="
     },
     "kind-of": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.0.tgz",
-      "integrity": "sha512-sUd5AnFyOPh+RW+ZIHd1FHuwM4OFvhKCPVxxhamLxWLpmv1xQ394lzRMmhLQOiMpXvnB64YRLezWaJi5xGk7Dg=="
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.1.tgz",
+      "integrity": "sha512-y/15y6w31q9eVnXhVLPQkI7MD6JyuPNqEnetl8bZEc+mngLuonHQJ0x/6BD1WX6ml0Ig/psUlyKZJxz8uUo1xQ=="
+    },
+    "klaw": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/klaw/-/klaw-1.3.1.tgz",
+      "integrity": "sha1-QIhDO0azsbolnXh4XY6W9zugJDk=",
+      "requires": {
+        "graceful-fs": "4.1.11"
+      }
     },
     "lazy-cache": {
       "version": "2.0.2",
@@ -7244,9 +7430,9 @@
       "integrity": "sha1-/sfervF+fDoKVeHaBCgD4l2RdF0="
     },
     "lodash": {
-      "version": "4.17.4",
-      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-      "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+      "version": "4.15.0",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.15.0.tgz",
+      "integrity": "sha1-MWI5HY8BQKoiz49rPDTWt/Y9Oqk="
     },
     "lodash-es": {
       "version": "4.17.4",
@@ -7395,6 +7581,11 @@
       "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz",
       "integrity": "sha1-eeTriMNqgSKvhvhEqpvNhRtfu1U="
     },
+    "lodash.isequal": {
+      "version": "4.5.0",
+      "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
+      "integrity": "sha1-QVxEePK8wwEgwizhDtMib30+GOA="
+    },
     "lodash.isplainobject": {
       "version": "4.0.6",
       "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
@@ -7476,9 +7667,9 @@
       "integrity": "sha1-rgyqVhERSYxboTcj1vtjHSQAOTQ="
     },
     "lolex": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/lolex/-/lolex-2.3.0.tgz",
-      "integrity": "sha512-rPO6R1t8PjYL6xbsFUg7aByKkWAql907na6powPBORVs4DCm8aMBUkL4+6CXO0gEIV8vtu3mWV0FB8ZaCYPBmA=="
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/lolex/-/lolex-2.3.1.tgz",
+      "integrity": "sha512-mQuW55GhduF3ppo+ZRUTz1PRjEh1hS5BbqU7d8D0ez2OKxHDod7StPPeAVKisZR5aLkHZjdGWSL42LSONUJsZw=="
     },
     "longest": {
       "version": "1.0.1",
@@ -7760,7 +7951,7 @@
         "extend-shallow": "2.0.1",
         "extglob": "2.0.2",
         "fragment-cache": "0.2.1",
-        "kind-of": "6.0.0",
+        "kind-of": "6.0.1",
         "nanomatch": "1.2.5",
         "object.pick": "1.3.0",
         "regex-not": "1.0.0",
@@ -7778,9 +7969,9 @@
       }
     },
     "mime": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/mime/-/mime-1.4.1.tgz",
-      "integrity": "sha512-KI1+qOZu5DcW6wayYHSzR/tXKCDC5Om4s1z2QJjDULzLcmf3DvzS7oluY4HCTrc+9FiKmWUgeNLg7W3uIQvxtQ=="
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
+      "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg=="
     },
     "mime-db": {
       "version": "1.30.0",
@@ -7952,9 +8143,9 @@
       "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
     },
     "multicast-dns": {
-      "version": "6.1.1",
-      "resolved": "https://registry.npmjs.org/multicast-dns/-/multicast-dns-6.1.1.tgz",
-      "integrity": "sha1-bn3oalcIcqsXBYrepxYLvsqBTd4=",
+      "version": "6.2.1",
+      "resolved": "https://registry.npmjs.org/multicast-dns/-/multicast-dns-6.2.1.tgz",
+      "integrity": "sha512-uV3/ckdsffHx9IrGQrx613mturMdMqQ06WTq+C09NsStJ9iNG6RcUWgPKs1Rfjy+idZT6tfQoXEusGNnEZhT3w==",
       "requires": {
         "dns-packet": "1.2.2",
         "thunky": "0.1.0"
@@ -8026,9 +8217,9 @@
       "integrity": "sha1-a+lPysqNd63gqWcNxGCRTJRHJEQ="
     },
     "ngrok": {
-      "version": "2.2.23",
-      "resolved": "https://registry.npmjs.org/ngrok/-/ngrok-2.2.23.tgz",
-      "integrity": "sha1-dSxID4BWMzUmT3bc6/Tq9DSa90c=",
+      "version": "2.2.24",
+      "resolved": "https://registry.npmjs.org/ngrok/-/ngrok-2.2.24.tgz",
+      "integrity": "sha512-tz1X/yS3PD5N+Cwijn+bwSrDGNRNPpQPM0TEHtaT8K4sMpFUHFBhRJLlFyoGQyfmSML7Tdq9Fq17AKoEtGaJzw==",
       "requires": {
         "@types/node": "8.0.26",
         "async": "2.6.0",
@@ -8161,9 +8352,9 @@
       }
     },
     "node-sass": {
-      "version": "4.6.1",
-      "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.6.1.tgz",
-      "integrity": "sha512-0zQQ7tjEK5W8RfW9LiQrkzfo7uLZ0QtZGV69rdKn5cFzdweHLJ14lR6xLPvI6UimkXMO8m0qDsXwUCNdnqV3sA==",
+      "version": "4.7.2",
+      "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.7.2.tgz",
+      "integrity": "sha512-CaV+wLqZ7//Jdom5aUFCpGNoECd7BbNhjuwdsX/LkXBrHl8eb1Wjw4HvWqcFvhr5KuNgAk8i/myf/MQ1YYeroA==",
       "requires": {
         "async-foreach": "0.1.3",
         "chalk": "1.1.3",
@@ -8180,9 +8371,10 @@
         "nan": "2.8.0",
         "node-gyp": "3.6.2",
         "npmlog": "4.1.2",
-        "request": "2.83.0",
+        "request": "2.79.0",
         "sass-graph": "2.2.4",
-        "stdout-stream": "1.4.0"
+        "stdout-stream": "1.4.0",
+        "true-case-path": "1.0.2"
       },
       "dependencies": {
         "ansi-styles": {
@@ -8190,6 +8382,29 @@
           "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
           "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
         },
+        "assert-plus": {
+          "version": "0.2.0",
+          "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-0.2.0.tgz",
+          "integrity": "sha1-104bh+ev/A24qttwIfP+SBAasjQ="
+        },
+        "aws-sign2": {
+          "version": "0.6.0",
+          "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz",
+          "integrity": "sha1-FDQt0428yU0OW4fXY81jYSwOeU8="
+        },
+        "boom": {
+          "version": "2.10.1",
+          "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
+          "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8=",
+          "requires": {
+            "hoek": "2.16.3"
+          }
+        },
+        "caseless": {
+          "version": "0.11.0",
+          "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.11.0.tgz",
+          "integrity": "sha1-cVuW6phBWTzDMGeSP17GDr2k99c="
+        },
         "chalk": {
           "version": "1.1.3",
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -8211,10 +8426,110 @@
             "which": "1.3.0"
           }
         },
+        "cryptiles": {
+          "version": "2.0.5",
+          "resolved": "https://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz",
+          "integrity": "sha1-O9/s3GCBR8HGcgL6KR59ylnqo7g=",
+          "requires": {
+            "boom": "2.10.1"
+          }
+        },
+        "form-data": {
+          "version": "2.1.4",
+          "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.1.4.tgz",
+          "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE=",
+          "requires": {
+            "asynckit": "0.4.0",
+            "combined-stream": "1.0.5",
+            "mime-types": "2.1.17"
+          }
+        },
+        "har-validator": {
+          "version": "2.0.6",
+          "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz",
+          "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0=",
+          "requires": {
+            "chalk": "1.1.3",
+            "commander": "2.12.1",
+            "is-my-json-valid": "2.16.1",
+            "pinkie-promise": "2.0.1"
+          }
+        },
+        "hawk": {
+          "version": "3.1.3",
+          "resolved": "https://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz",
+          "integrity": "sha1-B4REvXwWQLD+VA0sm3PVlnjo4cQ=",
+          "requires": {
+            "boom": "2.10.1",
+            "cryptiles": "2.0.5",
+            "hoek": "2.16.3",
+            "sntp": "1.0.9"
+          }
+        },
+        "hoek": {
+          "version": "2.16.3",
+          "resolved": "https://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz",
+          "integrity": "sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0="
+        },
+        "http-signature": {
+          "version": "1.1.1",
+          "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz",
+          "integrity": "sha1-33LiZwZs0Kxn+3at+OE0qPvPkb8=",
+          "requires": {
+            "assert-plus": "0.2.0",
+            "jsprim": "1.4.1",
+            "sshpk": "1.13.1"
+          }
+        },
+        "qs": {
+          "version": "6.3.2",
+          "resolved": "https://registry.npmjs.org/qs/-/qs-6.3.2.tgz",
+          "integrity": "sha1-51vV9uJoEioqDgvaYwslUMFmUCw="
+        },
+        "request": {
+          "version": "2.79.0",
+          "resolved": "https://registry.npmjs.org/request/-/request-2.79.0.tgz",
+          "integrity": "sha1-Tf5b9r6LjNw3/Pk+BLZVd3InEN4=",
+          "requires": {
+            "aws-sign2": "0.6.0",
+            "aws4": "1.6.0",
+            "caseless": "0.11.0",
+            "combined-stream": "1.0.5",
+            "extend": "3.0.1",
+            "forever-agent": "0.6.1",
+            "form-data": "2.1.4",
+            "har-validator": "2.0.6",
+            "hawk": "3.1.3",
+            "http-signature": "1.1.1",
+            "is-typedarray": "1.0.0",
+            "isstream": "0.1.2",
+            "json-stringify-safe": "5.0.1",
+            "mime-types": "2.1.17",
+            "oauth-sign": "0.8.2",
+            "qs": "6.3.2",
+            "stringstream": "0.0.5",
+            "tough-cookie": "2.3.3",
+            "tunnel-agent": "0.4.3",
+            "uuid": "3.1.0"
+          }
+        },
+        "sntp": {
+          "version": "1.0.9",
+          "resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz",
+          "integrity": "sha1-ZUEYTMkK7qbG57NeJlkIJEPGYZg=",
+          "requires": {
+            "hoek": "2.16.3"
+          }
+        },
         "supports-color": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
           "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+        },
+        "tunnel-agent": {
+          "version": "0.4.3",
+          "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz",
+          "integrity": "sha1-Y3PbdpCf5XDgjXNYM2Xtgop07us="
         }
       }
     },
@@ -8392,7 +8707,7 @@
       "integrity": "sha1-G/mk3SKI9bM/Opk9JXZh8F0WGl8=",
       "requires": {
         "define-properties": "1.1.2",
-        "es-abstract": "1.9.0",
+        "es-abstract": "1.10.0",
         "function-bind": "1.1.1",
         "has": "1.0.1"
       }
@@ -8403,7 +8718,7 @@
       "integrity": "sha1-h1jIRvW0B62rDyNuCYbxSwUcqhY=",
       "requires": {
         "define-properties": "1.1.2",
-        "es-abstract": "1.9.0"
+        "es-abstract": "1.10.0"
       }
     },
     "object.omit": {
@@ -8429,7 +8744,7 @@
       "integrity": "sha1-5STaCbT2b/Bd9FdUbscqyZ8TBpo=",
       "requires": {
         "define-properties": "1.1.2",
-        "es-abstract": "1.9.0",
+        "es-abstract": "1.10.0",
         "function-bind": "1.1.1",
         "has": "1.0.1"
       }
@@ -8445,14 +8760,14 @@
       "integrity": "sha1-XaNUX43wnxcsbDzXcoj02U1eB88="
     },
     "office-ui-fabric-react": {
-      "version": "5.21.2",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.21.2.tgz",
-      "integrity": "sha512-ERFEVUHVYCKdqmsLTujYkBTRyQNBnWVlAy/UV1qmtvaQVoBOyrMTf9czernWXGeFuVfbB7fSLvyr4IhsVgtDNw==",
+      "version": "5.25.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.25.0.tgz",
+      "integrity": "sha512-BPgFclNgEyqIN43FTB9U59ntZ+iyZrOfe7Hs6EMfJ2Iy8j34Znuj86EM0lsy0Zbll2McTeYnm8zawkPEuj9IpQ==",
       "requires": {
         "@microsoft/load-themed-styles": "1.7.9",
         "@uifabric/icons": "5.2.0",
         "@uifabric/merge-styles": "5.6.0",
-        "@uifabric/styling": "5.7.0",
+        "@uifabric/styling": "5.10.1",
         "@uifabric/utilities": "5.4.0",
         "prop-types": "15.6.0",
         "tslib": "1.8.0"
@@ -9465,9 +9780,9 @@
       }
     },
     "postcss-loader": {
-      "version": "2.0.8",
-      "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-2.0.8.tgz",
-      "integrity": "sha512-KtXBiQ/r/WYW8LxTSJK7h8wLqvCMSub/BqmRnud/Mu8RzwflW9cmXxwsMwbn15TNv287Hcufdb3ZSs7xHKnG8Q==",
+      "version": "2.0.9",
+      "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-2.0.9.tgz",
+      "integrity": "sha512-sgoXPtmgVT3aBAhU47Kig8oPF+mbXl8Unjvtz1Qj1q2D2EvSVJW2mKJNzxv5y/LvA9xWwuvdysvhc7Zn80UWWw==",
       "requires": {
         "loader-utils": "1.1.0",
         "postcss": "6.0.14",
@@ -9625,7 +9940,7 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000765",
+            "caniuse-db": "1.0.30000772",
             "electron-to-chromium": "1.3.27"
           }
         },
@@ -10667,7 +10982,7 @@
       "integrity": "sha512-7p/K2f6dI+dM8yjRQEGrTQs5hTQixUAdOGpMEA3+pVxpX5oHKRSKAXyLw9Q9HUWDTdwtoo39dSHGQtN90HcEwQ==",
       "requires": {
         "define-properties": "1.1.2",
-        "es-abstract": "1.9.0",
+        "es-abstract": "1.10.0",
         "function-bind": "1.1.1"
       }
     },
@@ -10855,8 +11170,8 @@
         "async": "2.6.0",
         "babel-runtime": "6.26.0",
         "babylon": "5.8.38",
-        "commander": "2.11.0",
-        "doctrine": "2.0.0",
+        "commander": "2.12.1",
+        "doctrine": "2.0.2",
         "node-dir": "0.1.17",
         "recast": "0.12.9"
       },
@@ -10920,9 +11235,9 @@
       }
     },
     "react-modal": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.1.2.tgz",
-      "integrity": "sha512-a3L2qP0kaqMBy4C1aojs2caUIz3kHRFlnuWJ8zsnuUmh/fKHEDASujVBiQcatn+yUosdE9hViB6JvLfkB0tN2A==",
+      "version": "3.1.4",
+      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.1.4.tgz",
+      "integrity": "sha512-9i1hLwKvSPQirfAabu8Ptv9i9ohaqk6Hs0KhoJkJ001VHLQtsQCS+6p7bZrEKnE3Wa4AXyXrF5gieGndsL6IsA==",
       "requires": {
         "exenv": "1.2.2",
         "prop-types": "15.6.0"
@@ -10942,16 +11257,16 @@
       "integrity": "sha512-c7aK5ffRyeOySSWVeoSEsQHBUrNtzXTB9TFNUnZv/2EM7HEnN1Rfsgxag/bpDcl5GuaY5IuMvq7XySc6nyokog==",
       "requires": {
         "@types/inline-style-prefixer": "3.0.1",
-        "@types/react": "16.0.23",
+        "@types/react": "16.0.25",
         "inline-style-prefixer": "3.0.8",
         "prop-types": "15.6.0",
         "react-style-proptype": "3.1.0"
       },
       "dependencies": {
         "@types/react": {
-          "version": "16.0.23",
-          "resolved": "https://registry.npmjs.org/@types/react/-/react-16.0.23.tgz",
-          "integrity": "sha512-iWplruxO5ENh7XMEBV6XtL54nrMgM8CrfIJ7+THvnUaddICEssH+EPo1MJoQU209Tz5/rVWTOCvQS8/kRR7zcA=="
+          "version": "16.0.25",
+          "resolved": "https://registry.npmjs.org/@types/react/-/react-16.0.25.tgz",
+          "integrity": "sha512-K79zMwWRzQ2db+nPoKpi3gA/KmLo6ZQgT4iO2QPEUdBO7as0PcgrmU9KHYzIO3V6lbD7gRjOM0/nUch6xBfOvQ=="
         }
       }
     },
@@ -11129,7 +11444,7 @@
       "resolved": "https://registry.npmjs.org/redux/-/redux-3.7.2.tgz",
       "integrity": "sha512-pNqnf9q1hI5HHZRBkj3bAngGZW/JMCmexDlOxw4XagXY2o1327nHH54LoTjiPJ0gizoqPDRqWyX/00g0hD6w+A==",
       "requires": {
-        "lodash": "4.17.4",
+        "lodash": "4.15.0",
         "lodash-es": "4.17.4",
         "loose-envify": "1.3.1",
         "symbol-observable": "1.0.4"
@@ -11281,7 +11596,7 @@
       "resolved": "https://registry.npmjs.org/request-promise-core/-/request-promise-core-1.1.1.tgz",
       "integrity": "sha1-Pu4AssWqgyOc+wTFcA2jb4HNCLY=",
       "requires": {
-        "lodash": "4.17.4"
+        "lodash": "4.15.0"
       }
     },
     "require-directory": {
@@ -11419,7 +11734,7 @@
       "integrity": "sha1-E/vWPNHK8JCLn9k0dq1DpR0eC0k=",
       "requires": {
         "glob": "7.1.2",
-        "lodash": "4.17.4",
+        "lodash": "4.15.0",
         "scss-tokenizer": "0.2.3",
         "yargs": "7.1.0"
       },
@@ -11583,7 +11898,7 @@
       "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-0.3.0.tgz",
       "integrity": "sha1-9YdyIs4+kx7a4DnxfrNxbnE3+M8=",
       "requires": {
-        "ajv": "5.3.0"
+        "ajv": "5.5.0"
       }
     },
     "screener-runner": {
@@ -11599,7 +11914,7 @@
         "http-proxy": "1.16.2",
         "joi": "9.2.0",
         "lodash": "4.16.6",
-        "ngrok": "2.2.23",
+        "ngrok": "2.2.24",
         "portfinder": "1.0.13",
         "request": "2.78.0",
         "request-promise": "4.1.1"
@@ -11802,9 +12117,9 @@
       }
     },
     "screener-storybook": {
-      "version": "0.9.8",
-      "resolved": "https://registry.npmjs.org/screener-storybook/-/screener-storybook-0.9.8.tgz",
-      "integrity": "sha1-c5ebm8SYJ7PdbZvNO81rC+7SVBY=",
+      "version": "0.9.9",
+      "resolved": "https://registry.npmjs.org/screener-storybook/-/screener-storybook-0.9.9.tgz",
+      "integrity": "sha1-T0RGtxQAnHPFzXyu8llQbhNZ8So=",
       "requires": {
         "bluebird": "3.4.7",
         "colors": "1.1.2",
@@ -11817,7 +12132,7 @@
         "react": "15.6.2",
         "react-dom": "15.4.2",
         "request": "2.81.0",
-        "screener-runner": "0.7.6"
+        "screener-runner": "0.7.7"
       },
       "dependencies": {
         "acorn": {
@@ -12016,6 +12331,11 @@
             "xml-name-validator": "2.0.1"
           }
         },
+        "lodash": {
+          "version": "4.17.4",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+        },
         "ms": {
           "version": "0.7.1",
           "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
@@ -12076,9 +12396,9 @@
           }
         },
         "screener-runner": {
-          "version": "0.7.6",
-          "resolved": "https://registry.npmjs.org/screener-runner/-/screener-runner-0.7.6.tgz",
-          "integrity": "sha1-GgiijinbwmWALODiIF0Y1BWStWc=",
+          "version": "0.7.7",
+          "resolved": "https://registry.npmjs.org/screener-runner/-/screener-runner-0.7.7.tgz",
+          "integrity": "sha1-RPnGR7sD13g/E7kWi+NfXsK/30U=",
           "requires": {
             "bluebird": "3.4.7",
             "colors": "1.1.2",
@@ -12088,7 +12408,7 @@
             "http-proxy": "1.16.2",
             "joi": "9.2.0",
             "lodash": "4.16.6",
-            "ngrok": "2.2.23",
+            "ngrok": "2.2.24",
             "portfinder": "1.0.13",
             "request": "2.78.0",
             "request-promise": "4.1.1"
@@ -12257,6 +12577,13 @@
         "on-finished": "2.3.0",
         "range-parser": "1.2.0",
         "statuses": "1.3.1"
+      },
+      "dependencies": {
+        "mime": {
+          "version": "1.4.1",
+          "resolved": "https://registry.npmjs.org/mime/-/mime-1.4.1.tgz",
+          "integrity": "sha512-KI1+qOZu5DcW6wayYHSzR/tXKCDC5Om4s1z2QJjDULzLcmf3DvzS7oluY4HCTrc+9FiKmWUgeNLg7W3uIQvxtQ=="
+        }
       }
     },
     "serve-favicon": {
@@ -12322,7 +12649,7 @@
         "extend-shallow": "2.0.1",
         "is-extendable": "0.1.1",
         "is-plain-object": "2.0.4",
-        "split-string": "3.0.2"
+        "split-string": "3.1.0"
       }
     },
     "setimmediate": {
@@ -12430,7 +12757,7 @@
         "diff": "3.4.0",
         "formatio": "1.2.0",
         "lodash.get": "4.4.2",
-        "lolex": "2.3.0",
+        "lolex": "2.3.1",
         "nise": "1.2.0",
         "supports-color": "4.5.0",
         "type-detect": "4.0.5"
@@ -12680,11 +13007,29 @@
       }
     },
     "split-string": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/split-string/-/split-string-3.0.2.tgz",
-      "integrity": "sha512-d6myUSfwmBz1izkY4r7r7I0PL41rh21qUDYK1OgclmGHeoqQoujduGxMbzw6BlF3HKmJR4sMpbWVo7/Xzg4YBQ==",
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/split-string/-/split-string-3.1.0.tgz",
+      "integrity": "sha512-NzNVhJDYpwceVVii8/Hu6DKfD2G+NrQHlS/V/qgv763EYudVwEcMQNxd2lh+0VrUByXN/oJkl5grOhYWvQUYiw==",
       "requires": {
-        "extend-shallow": "2.0.1"
+        "extend-shallow": "3.0.1"
+      },
+      "dependencies": {
+        "extend-shallow": {
+          "version": "3.0.1",
+          "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-3.0.1.tgz",
+          "integrity": "sha512-Fg1xXAv+qXKdwHiJFMcZSqsMcbPlkzsZtf8KkLJ2fqnP+lqg2RjEKgDcSfO9CO1+p4LZKgApDBUUUqKaaRhwZQ==",
+          "requires": {
+            "is-extendable": "1.0.1"
+          }
+        },
+        "is-extendable": {
+          "version": "1.0.1",
+          "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-1.0.1.tgz",
+          "integrity": "sha512-arnXMxT1hhoKo9k1LZdmlNyJdDDfy2v0fXjFlmok4+i8ul/6WlbVge9bhM74OpNPQPMGUToDtz+KXa1PneJxOA==",
+          "requires": {
+            "is-plain-object": "2.0.4"
+          }
+        }
       }
     },
     "sprintf-js": {
@@ -12860,7 +13205,7 @@
       "integrity": "sha1-86rvfBcZ8XDF6rHDK/eA2W4h8vA=",
       "requires": {
         "define-properties": "1.1.2",
-        "es-abstract": "1.9.0",
+        "es-abstract": "1.10.0",
         "function-bind": "1.1.1"
       }
     },
@@ -12870,7 +13215,7 @@
       "integrity": "sha1-W8+tOfRkm7LQMSkuGbzwtRDUskI=",
       "requires": {
         "define-properties": "1.1.2",
-        "es-abstract": "1.9.0",
+        "es-abstract": "1.10.0",
         "function-bind": "1.1.1"
       }
     },
@@ -13332,15 +13677,38 @@
       "resolved": "https://registry.npmjs.org/trim-right/-/trim-right-1.0.1.tgz",
       "integrity": "sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM="
     },
+    "true-case-path": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/true-case-path/-/true-case-path-1.0.2.tgz",
+      "integrity": "sha1-fskRMJJHZsf1c74wIMNPj9/QDWI=",
+      "requires": {
+        "glob": "6.0.4"
+      },
+      "dependencies": {
+        "glob": {
+          "version": "6.0.4",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-6.0.4.tgz",
+          "integrity": "sha1-DwiGD2oVUSey+t1PnOJLGqtuTSI=",
+          "requires": {
+            "inflight": "1.0.6",
+            "inherits": "2.0.3",
+            "minimatch": "3.0.4",
+            "once": "1.4.0",
+            "path-is-absolute": "1.0.1"
+          }
+        }
+      }
+    },
     "ts-jest": {
-      "version": "21.2.2",
-      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-21.2.2.tgz",
-      "integrity": "sha512-jBkZaC995zeUI+t6N7hvnHMnmkHUk2B+Bf7y8ZIgOe6YBNrUIMwRB3CYJmrJtWOefNUXVCr41W2Hab1ut9dy9w==",
+      "version": "21.2.3",
+      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-21.2.3.tgz",
+      "integrity": "sha512-/gpl/RUPJMVZmERi360sKu5wzSriAg20HMRZsNgXY7sUWtmSn3iPxQcCBDUi2bmcRPtPOLTSijzWK3ZrlYkUhA==",
       "requires": {
         "babel-core": "6.26.0",
         "babel-plugin-istanbul": "4.1.5",
         "babel-plugin-transform-es2015-modules-commonjs": "6.26.0",
         "babel-preset-jest": "21.2.0",
+        "cpx": "1.5.0",
         "fs-extra": "4.0.2",
         "jest-config": "21.2.1",
         "jest-util": "21.2.1",
@@ -13349,6 +13717,24 @@
         "yargs": "10.0.3"
       },
       "dependencies": {
+        "fs-extra": {
+          "version": "4.0.2",
+          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-4.0.2.tgz",
+          "integrity": "sha1-+RcExT0bRh+JNFKwwwfZmXZHq2s=",
+          "requires": {
+            "graceful-fs": "4.1.11",
+            "jsonfile": "4.0.0",
+            "universalify": "0.1.1"
+          }
+        },
+        "jsonfile": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-4.0.0.tgz",
+          "integrity": "sha1-h3Gq4HmbZAdrdmQPygWPnBDjPss=",
+          "requires": {
+            "graceful-fs": "4.1.11"
+          }
+        },
         "source-map-support": {
           "version": "0.5.0",
           "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.0.tgz",
@@ -13399,7 +13785,7 @@
         "babel-code-frame": "6.26.0",
         "builtin-modules": "1.1.1",
         "chalk": "2.3.0",
-        "commander": "2.11.0",
+        "commander": "2.12.1",
         "diff": "3.4.0",
         "glob": "7.1.2",
         "minimatch": "3.0.4",
@@ -13476,9 +13862,9 @@
       }
     },
     "typescript": {
-      "version": "2.5.3",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.5.3.tgz",
-      "integrity": "sha512-ptLSQs2S4QuS6/OD1eAKG+S5G8QQtrU5RT32JULdZQtM1L3WTi34Wsu48Yndzi8xsObRAB9RPt/KhA9wlpEF6w=="
+      "version": "2.4.2",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.4.2.tgz",
+      "integrity": "sha1-+DlfhdRZJ2BnyYiqQYN6j4KHCEQ="
     },
     "typical": {
       "version": "2.6.1",
@@ -13544,7 +13930,7 @@
       "requires": {
         "source-map": "0.5.7",
         "uglify-js": "2.8.29",
-        "webpack-sources": "1.0.2"
+        "webpack-sources": "1.1.0"
       },
       "dependencies": {
         "source-map": {
@@ -13555,9 +13941,9 @@
       }
     },
     "ultron": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.1.0.tgz",
-      "integrity": "sha1-sHoualQagV/Go0zNRTO67DB8qGQ="
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.1.1.tgz",
+      "integrity": "sha512-UIEXBNeYmKptWH6z8ZnqTeS8fV74zG0/eRU9VGkpzz+LIJNs8W/zM/L+7ctCkRrgbNnnR0xxw4bKOr0cW0N0Og=="
     },
     "underscore": {
       "version": "1.7.0",
@@ -13692,7 +14078,7 @@
       "integrity": "sha512-h3qf9TNn53BpuXTTcpC+UehiRrl0Cv45Yr/xWayApjw6G8Bg2dGke7rIwDQ39piciWCWrC+WiqLjOh3SUp9n0Q==",
       "requires": {
         "loader-utils": "1.1.0",
-        "mime": "1.4.1",
+        "mime": "1.6.0",
         "schema-utils": "0.3.0"
       }
     },
@@ -13786,6 +14172,11 @@
         "spdx-expression-parse": "1.0.4"
       }
     },
+    "validator": {
+      "version": "8.2.0",
+      "resolved": "https://registry.npmjs.org/validator/-/validator-8.2.0.tgz",
+      "integrity": "sha512-Yw5wW34fSv5spzTXNkokD6S6/Oq92d8q/t14TqsS3fAiA1RYnxSFSIZ+CY3n6PGGRCq5HhJTSepQvFUS2QUDxA=="
+    },
     "vary": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
@@ -13899,7 +14290,7 @@
       "requires": {
         "acorn": "5.2.1",
         "acorn-dynamic-import": "2.0.2",
-        "ajv": "5.3.0",
+        "ajv": "5.5.0",
         "ajv-keywords": "2.1.1",
         "async": "2.6.0",
         "enhanced-resolve": "3.4.1",
@@ -13917,7 +14308,7 @@
         "tapable": "0.2.8",
         "uglifyjs-webpack-plugin": "0.4.6",
         "watchpack": "1.4.0",
-        "webpack-sources": "1.0.2",
+        "webpack-sources": "1.1.0",
         "yargs": "8.0.2"
       },
       "dependencies": {
@@ -13971,7 +14362,7 @@
       "requires": {
         "acorn": "5.2.1",
         "chalk": "1.1.3",
-        "commander": "2.11.0",
+        "commander": "2.12.1",
         "ejs": "2.5.7",
         "express": "4.16.2",
         "filesize": "3.5.11",
@@ -13979,7 +14370,7 @@
         "lodash": "4.17.4",
         "mkdirp": "0.5.1",
         "opener": "1.4.3",
-        "ws": "3.3.1"
+        "ws": "3.3.2"
       },
       "dependencies": {
         "acorn": {
@@ -14004,6 +14395,11 @@
             "supports-color": "2.0.0"
           }
         },
+        "lodash": {
+          "version": "4.17.4",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+        },
         "supports-color": {
           "version": "2.0.0",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
@@ -14012,21 +14408,21 @@
       }
     },
     "webpack-dev-middleware": {
-      "version": "1.12.0",
-      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-1.12.0.tgz",
-      "integrity": "sha1-007++y7dp+HTtdvgcolRMhllFwk=",
+      "version": "1.12.2",
+      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-1.12.2.tgz",
+      "integrity": "sha512-FCrqPy1yy/sN6U/SaEZcHKRXGlqU0DUaEBL45jkUYoB8foVb6wCnbIJ1HKIx+qUFTW+3JpVcCJCxZ8VATL4e+A==",
       "requires": {
         "memory-fs": "0.4.1",
-        "mime": "1.4.1",
+        "mime": "1.6.0",
         "path-is-absolute": "1.0.1",
         "range-parser": "1.2.0",
         "time-stamp": "2.0.0"
       }
     },
     "webpack-dev-server": {
-      "version": "2.9.4",
-      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.9.4.tgz",
-      "integrity": "sha512-thrqC0EQEoSjXeYgP6pUXcUCZ+LNrKsDPn+mItLnn5VyyNZOJKd06hUP5vqkYwL8nWWXsii0loSF9NHNccT6ow==",
+      "version": "2.9.5",
+      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.9.5.tgz",
+      "integrity": "sha512-o0lS6enIxyOPiRJTh8vcgK5TsGNTn7lH1q/pNniAgs46mCE8sQYeqv7Y/oAIh/+u4kiBsFizLJo5EWC+ezz6FQ==",
       "requires": {
         "ansi-html": "0.0.7",
         "array-includes": "3.0.3",
@@ -14053,7 +14449,7 @@
         "spdy": "3.4.7",
         "strip-ansi": "3.0.1",
         "supports-color": "4.5.0",
-        "webpack-dev-middleware": "1.12.0",
+        "webpack-dev-middleware": "1.12.2",
         "yargs": "6.6.0"
       },
       "dependencies": {
@@ -14076,9 +14472,9 @@
       }
     },
     "webpack-hot-middleware": {
-      "version": "2.20.0",
-      "resolved": "https://registry.npmjs.org/webpack-hot-middleware/-/webpack-hot-middleware-2.20.0.tgz",
-      "integrity": "sha512-AYwVG9DCvMoXbwx8eK16CbJY3Ltwap44lW3T7hFsE0U3zRwtViHMw1DFpY5hMwXNqKsUk3HtNcf3PoV+gIxJeg==",
+      "version": "2.21.0",
+      "resolved": "https://registry.npmjs.org/webpack-hot-middleware/-/webpack-hot-middleware-2.21.0.tgz",
+      "integrity": "sha512-P6xiOLy10QlSVSO7GanU9PLxN6zLLQ7RG16MPTvmFwf2KUG7jMp6m+fmdgsR7xoaVVLA7OlX3YO6JjoZEKjCuA==",
       "requires": {
         "ansi-html": "0.0.7",
         "html-entities": "1.2.1",
@@ -14127,9 +14523,9 @@
       }
     },
     "webpack-sources": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-1.0.2.tgz",
-      "integrity": "sha512-Y7UddMCv6dGjy81nBv6nuQeFFIt5aalHm7uyDsAsW86nZwfOVPGRr3XMjEQLaT+WKo8rlzhC9qtbJvYKLtAwaw==",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-1.1.0.tgz",
+      "integrity": "sha512-aqYp18kPphgoO5c/+NaUvEeACtZjMESmDChuD3NBciVpah3XpMEU9VAAtIaB1BsfJWWTSdv8Vv1m3T0aRk2dUw==",
       "requires": {
         "source-list-map": "2.0.0",
         "source-map": "0.6.1"
@@ -14235,9 +14631,9 @@
       "integrity": "sha1-o9XabNXAvAAI03I0u68b7WMFkQc="
     },
     "worker-farm": {
-      "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/worker-farm/-/worker-farm-1.5.1.tgz",
-      "integrity": "sha512-T5NH6Wqsd8MwGD4AK8BBllUy6LmHaqjEOyo/YIUEegZui6/v5Bqde//3jwyE3PGiGYMmWi06exFBi5LNhhPFNw==",
+      "version": "1.5.2",
+      "resolved": "https://registry.npmjs.org/worker-farm/-/worker-farm-1.5.2.tgz",
+      "integrity": "sha512-XxiQ9kZN5n6mmnW+mFJ+wXjNNI/Nx4DIdaAKLX1Bn6LYBWlN/zaBhu34DQYPZ1AJobQuu67S2OfDdNSVULvXkQ==",
       "requires": {
         "errno": "0.1.4",
         "xtend": "4.0.1"
@@ -14295,7 +14691,7 @@
         "chalk": "1.1.3",
         "debug": "2.6.9",
         "filesize": "3.5.11",
-        "lodash": "4.17.4",
+        "lodash": "4.15.0",
         "mkdirp": "0.5.1",
         "moment": "2.19.2"
       },
@@ -14325,13 +14721,13 @@
       }
     },
     "ws": {
-      "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-3.3.1.tgz",
-      "integrity": "sha512-8A/uRMnQy8KCQsmep1m7Bk+z/+LIkeF7w+TDMLtX1iZm5Hq9HsUDmgFGaW1ACW5Cj0b2Qo7wCvRhYN2ErUVp/A==",
+      "version": "3.3.2",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-3.3.2.tgz",
+      "integrity": "sha512-t+WGpsNxhMR4v6EClXS8r8km5ZljKJzyGhJf7goJz9k5Ye3+b5Bvno5rjqPuIBn5mnn5GBb7o8IrIWHxX1qOLQ==",
       "requires": {
         "async-limiter": "1.0.0",
         "safe-buffer": "5.1.1",
-        "ultron": "1.1.0"
+        "ultron": "1.1.1"
       }
     },
     "xdg-basedir": {
@@ -14503,6 +14899,17 @@
       "requires": {
         "camelcase": "4.1.0"
       }
+    },
+    "z-schema": {
+      "version": "3.18.4",
+      "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-3.18.4.tgz",
+      "integrity": "sha512-DUOKC/IhbkdLKKiV89gw9DUauTV8U/8yJl1sjf6MtDmzevLKOF2duNJ495S3MFVjqZarr+qNGCPbkg4mu4PpLw==",
+      "requires": {
+        "commander": "2.12.1",
+        "lodash.get": "4.4.2",
+        "lodash.isequal": "4.5.0",
+        "validator": "8.2.0"
+      }
     }
   }
 }
diff --git a/packages/example-app-base/LICENSE b/packages/example-app-base/LICENSE
index 66fbae8c51dae..4998efdf06427 100644
--- a/packages/example-app-base/LICENSE
+++ b/packages/example-app-base/LICENSE
@@ -1,4 +1,4 @@
-Office UI Fabric React - example-app-utilities
+Office UI Fabric React - example-app-base
 
 Copyright (c) Microsoft Corporation
 
diff --git a/packages/example-app-base/gulpfile.js b/packages/example-app-base/gulpfile.js
deleted file mode 100644
index 196c2a4dd3da6..0000000000000
--- a/packages/example-app-base/gulpfile.js
+++ /dev/null
@@ -1,23 +0,0 @@
-'use strict';
-
-let build = require('@microsoft/web-library-build');
-let gulp = require('gulp');
-
-// Short aliases for subtasks.
-build.task('webpack', build.webpack);
-build.task('sass', build.sass);
-build.task('karma', build.karma);
-
-// initialize tasks.
-build.initialize(gulp);
-
-// Always fail on test failures.
-build.karma.setConfig({
-  failBuildOnErrors: true
-});
-
-// Use css modules.
-build.sass.setConfig({
-  useCSSModules: true,
-  moduleExportName: ''
-});
diff --git a/packages/experiments/gulpfile.js b/packages/experiments/gulpfile.js
deleted file mode 100644
index 5c782647005cc..0000000000000
--- a/packages/experiments/gulpfile.js
+++ /dev/null
@@ -1,25 +0,0 @@
-'use strict';
-
-let build = require('@microsoft/web-library-build');
-let gulp = require('gulp');
-
-// Short aliases for subtasks.
-build.task('webpack', build.webpack);
-build.task('sass', build.sass);
-build.task('karma', build.karma);
-build.task('ts', build.typescript);
-build.task('tslist', build.tslint);
-
-// initialize tasks.
-build.initialize(gulp);
-
-// Always fail on test failures.
-build.karma.setConfig({
-  failBuildOnErrors: true
-});
-
-// Use css modules.
-build.sass.setConfig({
-  useCSSModules: true,
-  moduleExportName: ''
-});
diff --git a/packages/icons/gulpfile.js b/packages/icons/gulpfile.js
deleted file mode 100644
index 253c72000bc14..0000000000000
--- a/packages/icons/gulpfile.js
+++ /dev/null
@@ -1,46 +0,0 @@
-'use strict';
-
-let gulp = require('gulp');
-let path = require('path');
-let build = require('@microsoft/web-library-build');
-let buildConfig = build.getConfig();
-let isProduction = process.argv.indexOf('--production') >= 0;
-let isClean = process.argv.indexOf('clean') >= 0;
-
-// initialize tasks.
-build.initialize(gulp);
-
-/* Configure lint rules */
-let rules = Object.assign(
-  {},
-  require('./node_modules/@microsoft/gulp-core-build-typescript/lib/defaultTslint.json').rules,
-  require('./node_modules/office-ui-fabric-react-tslint/tslint.json').rules,
-  require('./tslint.json').rules
-);
-build.tslint.setConfig({
-  lintConfig: { rules },
-  displayAsWarning: false
-});
-
-// Configure TypeScript.
-build.TypeScriptConfiguration.setTypescriptCompiler(require('typescript'));
-
-// Disable unnecessaries.
-build.sass.isEnabled =
-  build.webpack.isEnabled =
-  build.text.isEnabled =
-  build.preCopy.isEnabled =
-  build.postCopy.isEnabled =
-  build.karma.isEnabled = () => false;
-
-let packageFolder = buildConfig.packageFolder || '';
-let distFolder = buildConfig.distFolder;
-
-if (isProduction || isClean) {
-  build.setConfig({
-    libAMDFolder: path.join(packageFolder, 'lib-amd')
-  });
-}
-
-build.task('tslint', build.tslint);
-
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
index f526506133350..93b5262c3f6b4 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
@@ -25,7 +25,7 @@ import {
 import * as stylesImport from './Persona.scss';
 const styles: any = stylesImport;
 
-const SIZE_TO_PIXELS = {
+const SIZE_TO_PIXELS: { [key: number]: number } = {
   [PersonaSize.tiny]: 20,
   [PersonaSize.extraExtraSmall]: 24,
   [PersonaSize.extraSmall]: 28,
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts b/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
index 35f3f4342ac01..1ad6c706e40c5 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
@@ -6,7 +6,7 @@ import {
 import * as stylesImport from './Persona.scss';
 const styles: any = stylesImport;
 
-export const PERSONA_SIZE = {
+export const PERSONA_SIZE: { [key: number]: string } = {
   // All non-numerically named sizes are deprecated, use the numerically named classes below
   [PersonaSize.tiny]: 'ms-Persona--tiny ' + styles.rootIsSize10,
   [PersonaSize.extraExtraSmall]: 'ms-Persona--xxs ' + styles.rootIsSize24,
@@ -27,7 +27,7 @@ export const PERSONA_SIZE = {
   [PersonaSize.size100]: 'ms-Persona--size100 ' + styles.rootIsSize100
 };
 
-export const PERSONA_PRESENCE = {
+export const PERSONA_PRESENCE: { [key: number]: string } = {
   [PersonaPresence.offline]: 'ms-Persona--offline ' + styles.rootIsOffline,
   [PersonaPresence.online]: 'ms-Persona--online ',
   [PersonaPresence.away]: 'ms-Persona--away ' + styles.rootIsAway,
@@ -36,7 +36,7 @@ export const PERSONA_PRESENCE = {
   [PersonaPresence.busy]: 'ms-Persona--busy ' + styles.rootIsBusy
 };
 
-export const PERSONA_INITIALS_COLOR = {
+export const PERSONA_INITIALS_COLOR: { [key: number]: string } = {
   [PersonaInitialsColor.lightBlue]: 'ms-Persona-initials--lightBlue ' + styles.initialsIsLightBlue,
   [PersonaInitialsColor.blue]: 'ms-Persona-initials--blue ' + styles.initialsIsBlue,
   [PersonaInitialsColor.darkBlue]: 'ms-Persona-initials--darkBlue ' + styles.initialsIsDarkBlue,
diff --git a/packages/styling/gulpfile.js b/packages/styling/gulpfile.js
deleted file mode 100644
index d5c333c7cdb4c..0000000000000
--- a/packages/styling/gulpfile.js
+++ /dev/null
@@ -1,21 +0,0 @@
-'use strict';
-
-let gulp = require('gulp');
-let build = require('@microsoft/web-library-build');
-
-build.task('sass', build.sass);
-build.task('karma', build.karma);
-
-// initialize tasks.
-build.initialize(gulp);
-
-// Always fail on test failures.
-build.karma.setConfig({
-  failBuildOnErrors: true
-});
-
-// Use css modules.
-build.sass.setConfig({
-  useCSSModules: true,
-  moduleExportName: ''
-});
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 0c24d76f00fa4..6cf294da7bb2a 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -2,6 +2,11 @@
   "name": "@uifabric/styling",
   "version": "5.10.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/OfficeDev/office-ui-fabric-react"
+  },
+  "license": "MIT",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
   "scripts": {
@@ -26,9 +31,5 @@
     "@uifabric/utilities": ">=5.3.3 <6.0.0",
     "@uifabric/merge-styles": ">=5.6.0 <6.0.0",
     "tslib": "^1.7.1"
-  },
-  "peerDependencies": {
-    "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
-    "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   }
 }
\ No newline at end of file
diff --git a/packages/styling/src/interfaces/index.ts b/packages/styling/src/interfaces/index.ts
index 9fe8fda3fcfc7..daf0be7b9ff4d 100644
--- a/packages/styling/src/interfaces/index.ts
+++ b/packages/styling/src/interfaces/index.ts
@@ -3,5 +3,3 @@ export { IFontStyles } from './IFontStyles';
 export { IPalette } from './IPalette';
 export { ISemanticColors } from './ISemanticColors';
 export { ITheme, IPartialTheme } from './ITheme';
-export { IClassNames } from './IClassNames';
-export { IStyleFunction } from './IStyleFunction';
diff --git a/packages/styling/src/utilities/index.ts b/packages/styling/src/utilities/index.ts
index eea3f3cc7bfce..93011096a83b9 100644
--- a/packages/styling/src/utilities/index.ts
+++ b/packages/styling/src/utilities/index.ts
@@ -14,12 +14,4 @@ export {
 
 export {
   getIconClassName
-} from './getIconClassName';
-
-export {
-  IPropsWithStyles,
-  styled
-} from './styled';
-export {
-  classNamesFunction
-} from './classNamesFunction';
\ No newline at end of file
+} from './getIconClassName';
\ No newline at end of file
diff --git a/packages/utilities/gulpfile.js b/packages/utilities/gulpfile.js
deleted file mode 100644
index 2057829cb8bac..0000000000000
--- a/packages/utilities/gulpfile.js
+++ /dev/null
@@ -1,20 +0,0 @@
-'use strict';
-
-let gulp = require('gulp');
-let build = require('@microsoft/web-library-build');
-
-build.task('sass', build.sass);
-build.task('karma', build.karma);
-
-// initialize tasks.
-build.initialize(gulp);
-
-// Always fail on test failures.
-build.karma.setConfig({
-  failBuildOnErrors: true
-});
-
-// Use css modules.
-build.sass.setConfig({
-  useCSSModules: true
-});
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 5dfce725e71b9..7137fa17d3a64 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -34,6 +34,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
+    "@uifabric/merge-styles": ">=5.6.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/src/interfaces/IClassNames.ts b/packages/utilities/src/IClassNames.ts
similarity index 100%
rename from packages/styling/src/interfaces/IClassNames.ts
rename to packages/utilities/src/IClassNames.ts
diff --git a/packages/styling/src/interfaces/IStyleFunction.ts b/packages/utilities/src/IStyleFunction.ts
similarity index 100%
rename from packages/styling/src/interfaces/IStyleFunction.ts
rename to packages/utilities/src/IStyleFunction.ts
diff --git a/packages/styling/src/utilities/classNamesFunction.ts b/packages/utilities/src/classNamesFunction.ts
similarity index 76%
rename from packages/styling/src/utilities/classNamesFunction.ts
rename to packages/utilities/src/classNamesFunction.ts
index 15b60f1aba2d5..e77a42777208e 100644
--- a/packages/styling/src/utilities/classNamesFunction.ts
+++ b/packages/utilities/src/classNamesFunction.ts
@@ -1,8 +1,6 @@
-import { mergeStyleSets } from '../MergeStyles';
-import {
-  IClassNames,
-  IStyleFunction
-} from '../interfaces/index';
+import { mergeStyleSets } from '@uifabric/merge-styles/lib/index';
+import { IClassNames } from './IClassNames';
+import { IStyleFunction } from './IStyleFunction';
 
 /**
  * Creates a getClassNames function which calls getStyles given the props, and injects them
diff --git a/packages/utilities/src/index.ts b/packages/utilities/src/index.ts
index 08af844e16553..0a81bde68bc5d 100644
--- a/packages/utilities/src/index.ts
+++ b/packages/utilities/src/index.ts
@@ -1,8 +1,8 @@
 export * from './Async';
 export * from './AutoScroll';
 export * from './BaseComponent';
-export * from './Customizer';
 export * from './Customizations';
+export * from './Customizer';
 export * from './DelayedRender';
 export * from './EventGroup';
 export * from './FabricPerformance';
@@ -12,11 +12,13 @@ export * from './IPoint';
 export * from './IRectangle';
 export * from './IRenderFunction';
 export * from './ISize';
+export * from './IStyleFunction';
 export * from './KeyCodes';
 export * from './Rectangle';
 export * from './array';
 export * from './assertNever';
 export * from './autobind';
+export * from './classNamesFunction';
 export * from './css';
 export * from './customizable';
 export * from './dom';
@@ -25,6 +27,7 @@ export * from './hoist';
 export * from './initials';
 export * from './language';
 export * from './math';
+export * from './memoize';
 export * from './object';
 export * from './overflow';
 export * from './properties';
@@ -32,5 +35,5 @@ export * from './resources';
 export * from './rtl';
 export * from './scroll';
 export * from './string';
+export * from './styled';
 export * from './warn';
-export * from './memoize';
diff --git a/packages/styling/src/utilities/styled.tsx b/packages/utilities/src/styled.tsx
similarity index 92%
rename from packages/styling/src/utilities/styled.tsx
rename to packages/utilities/src/styled.tsx
index c96c2cc513b04..ea65583e4cedc 100644
--- a/packages/styling/src/utilities/styled.tsx
+++ b/packages/utilities/src/styled.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { concatStyleSets } from '../MergeStyles';
-import { IStyleFunction } from '../interfaces/index';
+import { concatStyleSets } from '@uifabric/merge-styles/lib/index';
+import { IStyleFunction } from './IStyleFunction';
 
 export interface IPropsWithStyles<TStyleProps, TStyles> {
   getStyles?: IStyleFunction<TStyleProps, TStyles>;
diff --git a/scripts/package.json b/scripts/package.json
index 0a51ca881eece..1912f7639bd39 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -8,6 +8,7 @@
     "bundlesize": "bundlesize --debug"
   },
   "devDependencies": {
+    "@microsoft/api-extractor": "^4.2.6",
     "@microsoft/load-themed-styles": "^1.7.5",
     "@microsoft/loader-load-themed-styles": "^1.6.0",
     "@uifabric/merge-styles": ">=5.6.0 <6.0.0",
@@ -51,4 +52,4 @@
       "maxSize": "42 kB"
     }
   ]
-}
+}
\ No newline at end of file

From 410de0fad823ef6ea909b5eab673267a658ce6af Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 27 Nov 2017 22:13:20 +0000
Subject: [PATCH 1068/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...JustifiedNoLeftwards_2017-10-02-10-22.json | 11 ----------
 ...malozano-SBMenuHover_2017-11-25-04-02.json | 11 ----------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 21 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 13 +++++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 11 files changed, 40 insertions(+), 30 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/detailsList-resizeJustifiedNoLeftwards_2017-10-02-10-22.json
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-SBMenuHover_2017-11-25-04-02.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 9737d3901ef8b..1d1f225afe993 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.24.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.26.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 0f20f3b251519..7482151cd6a48 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.24.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.26.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 79b6ea6e19ff4..19eb8f513cd32 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.24.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.26.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index e0e89cee4e384..7a3b360957cd9 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.24.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.26.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 080895d6dd970..6a79933f44fd4 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.24.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.26.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/detailsList-resizeJustifiedNoLeftwards_2017-10-02-10-22.json b/common/changes/office-ui-fabric-react/detailsList-resizeJustifiedNoLeftwards_2017-10-02-10-22.json
deleted file mode 100644
index 5301334405598..0000000000000
--- a/common/changes/office-ui-fabric-react/detailsList-resizeJustifiedNoLeftwards_2017-10-02-10-22.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: Resizing columns in justified mode doesn't affect columns on the left.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-panu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/malozano-SBMenuHover_2017-11-25-04-02.json b/common/changes/office-ui-fabric-react/malozano-SBMenuHover_2017-11-25-04-02.json
deleted file mode 100644
index bc0ce3ed15a04..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-SBMenuHover_2017-11-25-04-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: Add ability to open splitButton chevron menu, when they are inside menus",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index f5a0aeee0ca1f..3e317ea120235 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.25.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.26.0 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 346c40a628830..12ca5b1250e6e 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,27 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.26.0",
+      "tag": "office-ui-fabric-react_v5.26.0",
+      "date": "Mon, 27 Nov 2017 22:13:20 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Pablo Núñez <pablonete@gmail.com>",
+            "commit": "6934700b8092f6a24e82c3af4b97b40a404f75af",
+            "comment": "DetailsList: Resizing columns in justified mode doesn't affect columns on the left."
+          }
+        ],
+        "patch": [
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "504a3c8edac252373a589acbe0c6234f7d92f6cf",
+            "comment": "ContextualMenu: Add ability to open splitButton chevron menu, when they are inside menus"
+          }
+        ]
+      }
+    },
     {
       "version": "5.25.0",
       "tag": "office-ui-fabric-react_v5.25.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 1464c91ab0d9d..64b95aeff06bd 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 23 Nov 2017 11:10:13 GMT and should not be manually modified.
+This log was last generated on Mon, 27 Nov 2017 22:13:20 GMT and should not be manually modified.
+
+## 5.26.0
+Mon, 27 Nov 2017 22:13:20 GMT
+
+### Minor changes
+
+- DetailsList: Resizing columns in justified mode doesn't affect columns on the left.
+
+### Patches
+
+- ContextualMenu: Add ability to open splitButton chevron menu, when they are inside menus
 
 ## 5.25.0
 Thu, 23 Nov 2017 11:10:13 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 59733804b00fa..9d0811f9cdd00 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.25.0",
+  "version": "5.26.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 473c5d710a0540963be5746add75325158c567e8 Mon Sep 17 00:00:00 2001
From: chang47 <coralbue@gmail.com>
Date: Mon, 27 Nov 2017 16:39:54 -0800
Subject: [PATCH 1069/1641] ContextualMenu: Menus Dismiss on Tab (#3417)

* added initial fix

* removed extra spacing

* removed comment

* added change file

* added tabbing flag for focus zone

* added comment regarding focus zone

* added bidirectional

* fixed styling of bidirectional tabbing
---
 ...an-contextualMenuTab_2017-11-17-03-11.json | 11 ++++++++++
 .../ContextualMenu/ContextualMenu.tsx         |  2 +-
 .../src/components/FocusZone/FocusZone.tsx    | 20 +++++++++++++++++++
 .../components/FocusZone/FocusZone.types.ts   |  3 +++
 4 files changed, 35 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/chiechan-contextualMenuTab_2017-11-17-03-11.json

diff --git a/common/changes/office-ui-fabric-react/chiechan-contextualMenuTab_2017-11-17-03-11.json b/common/changes/office-ui-fabric-react/chiechan-contextualMenuTab_2017-11-17-03-11.json
new file mode 100644
index 0000000000000..5ced79e955d6f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/chiechan-contextualMenuTab_2017-11-17-03-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Contextual Menu: made it so we can tab through items",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chiechan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 2262c10be071e..4bcd3fc016673 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -296,6 +296,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
                 className={ this._classNames.root }
                 direction={ arrowDirection }
                 isCircularNavigation={ true }
+                allowTabKey={ true }
               >
                 <ul
                   aria-label={ ariaLabel }
@@ -651,7 +652,6 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     let submenuCloseKey = getRTL() ? KeyCodes.right : KeyCodes.left;
 
     if (ev.which === KeyCodes.escape
-      || ev.which === KeyCodes.tab
       || (ev.which === submenuCloseKey && this.props.isSubMenu && this.props.arrowDirection === FocusZoneDirection.vertical)) {
       // When a user presses escape, we will try to refocus the previous focused element.
       this._isFocusingPreviousElement = true;
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index e4bcc4632346a..2bf01adae0f3c 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -351,6 +351,26 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
           }
           return;
 
+        case KeyCodes.tab:
+          if (this.props.allowTabKey) {
+            if (direction === FocusZoneDirection.vertical) {
+              if (ev.shiftKey) {
+                this._moveFocusUp();
+              } else {
+                this._moveFocusDown();
+              }
+              break;
+            } else if (direction === FocusZoneDirection.horizontal || direction === FocusZoneDirection.bidirectional) {
+              if (ev.shiftKey) {
+                this._moveFocusLeft();
+              } else {
+                this._moveFocusRight();
+              }
+              break;
+            }
+            return;
+          }
+
         case KeyCodes.home:
           if (
             this._isElementInput(ev.target as HTMLElement) &&
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
index e4f8cadcbd2c1..c591e49c9194e 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
@@ -102,6 +102,9 @@ export interface IFocusZoneProps extends React.HTMLAttributes<HTMLElement | Focu
 
   /** Allow focus to move to root */
   allowFocusRoot?: boolean;
+
+  /** Allows tab key to be handled, a side effect is that users will not be able to tab out of the focus zone */
+  allowTabKey?: boolean;
 }
 
 export enum FocusZoneDirection {

From 94954657769c46824f84e8aba06b326721b4a161 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 27 Nov 2017 18:14:10 -0800
Subject: [PATCH 1070/1641] Adding change files.

---
 common/changes/@uifabric/styling/change.json   | 11 +++++++++++
 common/changes/@uifabric/utilities/change.json | 11 +++++++++++
 2 files changed, 22 insertions(+)
 create mode 100644 common/changes/@uifabric/styling/change.json
 create mode 100644 common/changes/@uifabric/utilities/change.json

diff --git a/common/changes/@uifabric/styling/change.json b/common/changes/@uifabric/styling/change.json
new file mode 100644
index 0000000000000..7ae16c0fc4f2c
--- /dev/null
+++ b/common/changes/@uifabric/styling/change.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "Moving `styled` and `getClassNameFunction` out of styling to utilities.",
+      "packageName": "@uifabric/styling",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/change.json b/common/changes/@uifabric/utilities/change.json
new file mode 100644
index 0000000000000..3e398734ef771
--- /dev/null
+++ b/common/changes/@uifabric/utilities/change.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "Moving `styled` and `getClassNameFunction` out of styling to utilities.",
+      "packageName": "@uifabric/utilities",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file

From 7cca2433e864e81d3e1bdfffa9160b24a6439677 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 28 Nov 2017 02:24:21 +0000
Subject: [PATCH 1071/1641] Applying package updates.

---
 common/changes/@uifabric/styling/change.json  | 11 ----------
 .../changes/@uifabric/utilities/change.json   | 11 ----------
 ...an-contextualMenuTab_2017-11-17-03-11.json | 11 ----------
 packages/example-app-base/package.json        |  4 ++--
 packages/icons/package.json                   |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 22 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 +++++++-
 packages/office-ui-fabric-react/package.json  |  6 ++---
 packages/styling/CHANGELOG.json               | 19 ++++++++++++++++
 packages/styling/CHANGELOG.md                 |  9 +++++++-
 packages/styling/package.json                 |  4 ++--
 packages/utilities/CHANGELOG.json             | 14 ++++++++++++
 packages/utilities/CHANGELOG.md               |  9 +++++++-
 packages/utilities/package.json               |  2 +-
 14 files changed, 88 insertions(+), 45 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/change.json
 delete mode 100644 common/changes/@uifabric/utilities/change.json
 delete mode 100644 common/changes/office-ui-fabric-react/chiechan-contextualMenuTab_2017-11-17-03-11.json

diff --git a/common/changes/@uifabric/styling/change.json b/common/changes/@uifabric/styling/change.json
deleted file mode 100644
index 7ae16c0fc4f2c..0000000000000
--- a/common/changes/@uifabric/styling/change.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "Moving `styled` and `getClassNameFunction` out of styling to utilities.",
-      "packageName": "@uifabric/styling",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/change.json b/common/changes/@uifabric/utilities/change.json
deleted file mode 100644
index 3e398734ef771..0000000000000
--- a/common/changes/@uifabric/utilities/change.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "Moving `styled` and `getClassNameFunction` out of styling to utilities.",
-      "packageName": "@uifabric/utilities",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/chiechan-contextualMenuTab_2017-11-17-03-11.json b/common/changes/office-ui-fabric-react/chiechan-contextualMenuTab_2017-11-17-03-11.json
deleted file mode 100644
index 5ced79e955d6f..0000000000000
--- a/common/changes/office-ui-fabric-react/chiechan-contextualMenuTab_2017-11-17-03-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Contextual Menu: made it so we can tab through items",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chiechan@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 7a2dca59ceae5..29eac7ec3a01c 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -38,8 +38,8 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.10.1 <6.0.0",
-    "@uifabric/utilities": ">=5.4.0 <6.0.0",
+    "@uifabric/styling": ">=5.11.0 <6.0.0",
+    "@uifabric/utilities": ">=5.5.0 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/icons/package.json b/packages/icons/package.json
index be702ac5d9b8b..30fc464b2abd7 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -23,7 +23,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.10.1 <6.0.0",
+    "@uifabric/styling": ">=5.11.0 <6.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 12ca5b1250e6e..7c021ac00871a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.26.1",
+      "tag": "office-ui-fabric-react_v5.26.1",
+      "date": "Tue, 28 Nov 2017 02:24:21 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "chang47 <coralbue@gmail.com>",
+            "commit": "473c5d710a0540963be5746add75325158c567e8",
+            "comment": "Contextual Menu: made it so we can tab through items"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.10.1 <6.0.0` to `>=5.11.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.4.0 <6.0.0` to `>=5.5.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.26.0",
       "tag": "office-ui-fabric-react_v5.26.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 64b95aeff06bd..b460614118850 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 27 Nov 2017 22:13:20 GMT and should not be manually modified.
+This log was last generated on Tue, 28 Nov 2017 02:24:21 GMT and should not be manually modified.
+
+## 5.26.1
+Tue, 28 Nov 2017 02:24:21 GMT
+
+### Patches
+
+- Contextual Menu: made it so we can tab through items
 
 ## 5.26.0
 Mon, 27 Nov 2017 22:13:20 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 9d0811f9cdd00..ced9878569a17 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.26.0",
+  "version": "5.26.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,8 +47,8 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.6.0 <6.0.0",
-    "@uifabric/styling": ">=5.10.1 <6.0.0",
-    "@uifabric/utilities": ">=5.4.0 <6.0.0",
+    "@uifabric/styling": ">=5.11.0 <6.0.0",
+    "@uifabric/utilities": ">=5.5.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index b0a881c6261df..a8e375438c694 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.11.0",
+      "tag": "@uifabric/styling_v5.11.0",
+      "date": "Tue, 28 Nov 2017 02:24:21 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "94954657769c46824f84e8aba06b326721b4a161",
+            "comment": "Moving `styled` and `getClassNameFunction` out of styling to utilities."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.3.3 <6.0.0` to `>=5.5.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.10.1",
       "tag": "@uifabric/styling_v5.10.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 479d2d5866ef2..d13724b5897b4 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 23 Nov 2017 11:10:13 GMT and should not be manually modified.
+This log was last generated on Tue, 28 Nov 2017 02:24:21 GMT and should not be manually modified.
+
+## 5.11.0
+Tue, 28 Nov 2017 02:24:21 GMT
+
+### Minor changes
+
+- Moving `styled` and `getClassNameFunction` out of styling to utilities.
 
 ## 5.10.1
 Thu, 23 Nov 2017 11:10:13 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 6cf294da7bb2a..917bbaa3e8612 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.10.1",
+  "version": "5.11.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "repository": {
     "type": "git",
@@ -28,7 +28,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/utilities": ">=5.3.3 <6.0.0",
+    "@uifabric/utilities": ">=5.5.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.6.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index e6733fe294302..4b04656790db6 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.5.0",
+      "tag": "@uifabric/utilities_v5.5.0",
+      "date": "Tue, 28 Nov 2017 02:24:21 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "94954657769c46824f84e8aba06b326721b4a161",
+            "comment": "Moving `styled` and `getClassNameFunction` out of styling to utilities."
+          }
+        ]
+      }
+    },
     {
       "version": "5.4.0",
       "tag": "@uifabric/utilities_v5.4.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index f1c9b9f138162..4b0c5f987b655 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Mon, 13 Nov 2017 11:20:56 GMT and should not be manually modified.
+This log was last generated on Tue, 28 Nov 2017 02:24:21 GMT and should not be manually modified.
+
+## 5.5.0
+Tue, 28 Nov 2017 02:24:21 GMT
+
+### Minor changes
+
+- Moving `styled` and `getClassNameFunction` out of styling to utilities.
 
 ## 5.4.0
 Mon, 13 Nov 2017 11:20:56 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 7137fa17d3a64..189ff3e2a86cd 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.4.0",
+  "version": "5.5.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 3908c357f9a360dbf9c0a461eb74a193cdc5cfdc Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 28 Nov 2017 10:03:30 -0800
Subject: [PATCH 1072/1641] Experiments command bar getStyles (#3463)

* Updated tsconfig/tslint to support unused vars, and added commandbar styles

* Remove constant dictating commandbar height, move to root styles for easier override

* Updated snapshots

* Add endAligned prop

* Fixed styling errors

* clean up undefined styles
---
 .../components/CommandBar/CommandBar.base.tsx | 234 ++++++++++++++++++
 .../src/components/CommandBar/CommandBar.scss |  19 --
 .../CommandBar/CommandBar.styles.ts           |  39 +++
 .../components/CommandBar/CommandBar.test.tsx |   3 +-
 .../src/components/CommandBar/CommandBar.tsx  | 224 +----------------
 .../components/CommandBar/CommandBar.types.ts |  38 ++-
 .../__snapshots__/CommandBar.test.tsx.snap    |  34 ++-
 packages/experiments/tsconfig.json            |   1 -
 packages/experiments/tslint.json              |  24 +-
 9 files changed, 371 insertions(+), 245 deletions(-)
 create mode 100644 packages/experiments/src/components/CommandBar/CommandBar.base.tsx
 delete mode 100644 packages/experiments/src/components/CommandBar/CommandBar.scss
 create mode 100644 packages/experiments/src/components/CommandBar/CommandBar.styles.ts

diff --git a/packages/experiments/src/components/CommandBar/CommandBar.base.tsx b/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
new file mode 100644
index 0000000000000..5563a40ae69aa
--- /dev/null
+++ b/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
@@ -0,0 +1,234 @@
+import * as React from 'react';
+import {
+  BaseComponent,
+  css,
+  getId,
+  autobind,
+  customizable
+} from 'office-ui-fabric-react/lib/Utilities';
+import {
+  ICommandBar,
+  ICommandBarProps,
+  ICommandBarItemProps,
+  ICommandBarStyleProps,
+  ICommandBarStyles
+} from './CommandBar.types';
+import { CommandBarButton } from 'office-ui-fabric-react/lib/Button';
+import { OverflowSet, IOverflowSet } from 'office-ui-fabric-react/lib/OverflowSet';
+import { ResizeGroup } from 'office-ui-fabric-react/lib/ResizeGroup';
+import { TooltipHost } from 'office-ui-fabric-react/lib/Tooltip';
+import {
+  classNamesFunction
+} from '../../Utilities';
+
+const getClassNames = classNamesFunction<ICommandBarStyleProps, ICommandBarStyles>();
+
+export interface ICommandBarData {
+  /**
+   * Items being rendered in the primary region
+   */
+  primaryItems: ICommandBarItemProps[];
+  /**
+   * Items being rendered in the overflow
+   */
+  overflowItems: ICommandBarItemProps[];
+  /**
+   * Items being rendered on the far side
+   */
+  farItems: ICommandBarItemProps[] | undefined;
+  /**
+   * Length of original overflowItems to ensure that they are not moved into primary region on resize
+   */
+  minimumOverflowItems: number;
+  /**
+   * Unique string used to cache the width of the command bar
+   */
+  cacheKey: string;
+}
+
+const COMMANDBAR_HEIGHT = '40px';
+
+@customizable('CommandBar', ['theme'])
+export class CommandBarBase extends BaseComponent<ICommandBarProps, {}> implements ICommandBar {
+  public static defaultProps: ICommandBarProps = {
+    items: [],
+    overflowItems: [],
+    farItems: [],
+    elipisisIconProps: { iconName: 'More' }
+  };
+
+  private _overflowSet: IOverflowSet;
+  private _classNames: {[key in keyof ICommandBarStyles]: string };
+  private _id: string;
+
+  constructor(props: ICommandBarProps) {
+    super(props);
+    this._id = getId('CommandBar');
+  }
+
+  public render(): JSX.Element {
+    const {
+      className,
+      endAligned,
+      items,
+      overflowItems,
+      farItems,
+      elipisisAriaLabel,
+      elipisisIconProps,
+      buttonStyles,
+      getStyles,
+      theme,
+      onRenderButton = this._onRenderButton,
+      onReduceData = this._onReduceData,
+      onGrowData = this._onGrowData,
+    } = this.props;
+
+    let commandBardata: ICommandBarData = {
+      primaryItems: [...items],
+      overflowItems: [...overflowItems!],
+      minimumOverflowItems: [...overflowItems!].length, // for tracking
+      farItems,
+      cacheKey: '',
+    };
+
+    this._classNames = getClassNames(getStyles!, { theme: theme!, className, endAligned });
+
+    return (
+      <ResizeGroup
+        className={ className }
+        data={ commandBardata }
+        onReduceData={ onReduceData }
+        onGrowData={ onGrowData }
+        // tslint:disable-next-line:jsx-no-lambda
+        onRenderData={ (data: ICommandBarData) => {
+          return (
+            <div className={ css(this._classNames.root) }>
+
+              {/*Primary Items*/ }
+              <OverflowSet
+                componentRef={ this._resolveRef('_overflowSet') }
+                className={ css(this._classNames.primarySet) }
+                items={ data.primaryItems }
+                overflowItems={ data.overflowItems.length ? data.overflowItems : undefined }
+                onRenderItem={ this._onRenderItems }
+                onRenderOverflowButton={ (renderedOverflowItems: ICommandBarItemProps[]) => {
+                  return (
+                    onRenderButton({
+                      key: 'oveflowButton',
+                      styles: { ...buttonStyles, menuIcon: { fontSize: '17px' } },
+                      ariaLabel: elipisisAriaLabel,
+                      className: css('ms-CommandBar-overflowButton'),
+                      menuProps: { items: renderedOverflowItems },
+                      menuIconProps: elipisisIconProps,
+                    })
+                  );
+                } }
+              />
+
+              {/*Secondary Items*/ }
+              <OverflowSet
+                className={ css(this._classNames.secondarySet) }
+                items={ data.farItems }
+                onRenderItem={ this._onRenderItems }
+                onRenderOverflowButton={ () => null }
+              />
+            </div>
+          );
+        } }
+      />
+    );
+  }
+
+  public focus(): void {
+    this._overflowSet.focus();
+  }
+
+  private _computeCacheKey(primaryItems: ICommandBarItemProps[], farItems: ICommandBarItemProps[], overflow: boolean): string {
+    const returnKey = (acc: string, current: ICommandBarItemProps): string => {
+      const { cacheKey = current.key } = current;
+      return acc + cacheKey;
+    };
+
+    const primaryKey = primaryItems.reduce(returnKey, '');
+    const farKey = farItems.reduce(returnKey, '');
+    const overflowKey = overflow ? 'overflow' : '';
+
+    return [primaryKey, farKey, overflowKey].join(' ');
+  }
+
+  @autobind
+  private _onReduceData(data: ICommandBarData): ICommandBarData | undefined {
+    const { endAligned } = this.props;
+    let { primaryItems, overflowItems, cacheKey, farItems } = data;
+
+    // Use first item if endAligned, otherwise use last item
+    let movedItem = primaryItems[endAligned ? 0 : primaryItems.length - 1];
+
+    if (movedItem !== undefined) {
+      movedItem.renderedInOverflow = true;
+
+      overflowItems = [movedItem, ...overflowItems];
+      primaryItems = endAligned ? primaryItems.slice(1) : primaryItems.slice(0, -1);
+      cacheKey = this._computeCacheKey(primaryItems, farItems!, !!overflowItems.length);
+
+      return { ...data, primaryItems, overflowItems, cacheKey };
+    }
+
+    return undefined;
+  }
+
+  @autobind
+  private _onGrowData(data: ICommandBarData): ICommandBarData | undefined {
+    const { endAligned } = this.props;
+    let { primaryItems, overflowItems, cacheKey, minimumOverflowItems, farItems } = data;
+    const movedItem = overflowItems[0];
+
+    // Make sure that moved item exists and is not one of the original overflow items
+    if (movedItem !== undefined && overflowItems.length > minimumOverflowItems) {
+      movedItem.renderedInOverflow = false;
+
+      overflowItems = overflowItems.slice(1);
+      // if endAligned, movedItem goes first, otherwise, last.
+      primaryItems = endAligned ? [movedItem, ...primaryItems] : [...primaryItems, movedItem];
+      cacheKey = this._computeCacheKey(primaryItems, farItems!, !!overflowItems.length);
+
+      return { ...data, primaryItems, overflowItems, cacheKey };
+    }
+
+    return undefined;
+  }
+
+  @autobind
+  private _onRenderItems(item: ICommandBarItemProps): JSX.Element | React.ReactNode {
+    let { buttonStyles } = this.props;
+
+    if (item.onRender) {
+      // These are the top level items, there is no relevant menu dismissing function to
+      // provide for the IContextualMenuItem onRender function. Pass in a no op function instead.
+      return item.onRender(item, () => undefined);
+    }
+    const commandButtonProps: ICommandBarItemProps = {
+      ...item,
+      styles: { root: { height: '100%' }, ...item.buttonStyles, ...buttonStyles },
+      className: css(item.className),
+      text: !item.iconOnly ? item.name : '',
+      menuProps: item.subMenuProps,
+    };
+
+    if (item.iconOnly && item.name !== undefined) {
+      return (
+        <TooltipHost content={ item.name } >
+          { this._onRenderButton(commandButtonProps) }
+        </TooltipHost>
+      );
+    }
+
+    return this._onRenderButton(commandButtonProps);
+  }
+
+  @autobind
+  private _onRenderButton(props: ICommandBarItemProps): JSX.Element {
+    // tslint:disable-next-line:no-any
+    return <CommandBarButton {...props as any} />;
+  }
+}
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.scss b/packages/experiments/src/components/CommandBar/CommandBar.scss
deleted file mode 100644
index 788b808fc0435..0000000000000
--- a/packages/experiments/src/components/CommandBar/CommandBar.scss
+++ /dev/null
@@ -1,19 +0,0 @@
-@import '~office-ui-fabric-react/src/common/common';
-
-.root {
-  display: flex;
-  background-color: $ms-color-neutralLighter;
-  padding: 0 16px;
-}
-
-.primarySet {
-  flex-grow: 1;
-  display: flex;
-  align-items: stretch;
-}
-
-.secondarySet {
-  flex-shrink: 0;
-  display: flex;
-  align-items: stretch;
-}
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.styles.ts b/packages/experiments/src/components/CommandBar/CommandBar.styles.ts
new file mode 100644
index 0000000000000..005857ec8c933
--- /dev/null
+++ b/packages/experiments/src/components/CommandBar/CommandBar.styles.ts
@@ -0,0 +1,39 @@
+import { ICommandBarStyleProps, ICommandBarStyles } from './CommandBar.types';
+import {
+  ITheme,
+  getFocusStyle,
+  FontSizes
+} from 'office-ui-fabric-react';
+
+export const getStyles = (props: ICommandBarStyleProps): ICommandBarStyles => {
+
+  const { className, theme, endAligned } = props;
+  const { semanticColors, palette } = theme;
+
+  return ({
+    root: [
+      'ms-CommandBar',
+      {
+        display: 'flex',
+        backgroundColor: palette.neutralLighter,
+        padding: '0 16px',
+        height: '40px'
+      }
+    ],
+    primarySet: [
+      {
+        flexGrow: '1',
+        display: 'flex',
+        alignItems: 'stretch',
+      },
+      endAligned && { justifyContent: 'flex-end' }
+    ],
+    secondarySet: [
+      {
+        flexShrink: '0',
+        display: 'flex',
+        alignItems: 'stretch',
+      }
+    ]
+  });
+};
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.test.tsx b/packages/experiments/src/components/CommandBar/CommandBar.test.tsx
index 6a5b3c6b4983e..44cde59f77708 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.test.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBar.test.tsx
@@ -3,6 +3,7 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
 import { CommandBar } from './CommandBar';
+import { CommandBarBase } from './CommandBar.base';
 import * as renderer from 'react-test-renderer';
 import { mount } from 'enzyme';
 
@@ -30,7 +31,7 @@ describe('CommandBar', () => {
   });
 
   it('opens a menu with IContextualMenuItem.subMenuProps.items property', () => {
-    const commandBar = mount<CommandBar>(
+    const commandBar = mount<CommandBarBase>(
       <CommandBar
         items={ [
           {
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.tsx b/packages/experiments/src/components/CommandBar/CommandBar.tsx
index 5fcb46a4097d5..6e4e84f43107b 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBar.tsx
@@ -1,215 +1,13 @@
 import * as React from 'react';
+import { styled } from '../../Utilities';
 import {
-  BaseComponent,
-  css,
-  getId,
-  autobind
-} from 'office-ui-fabric-react/lib/Utilities';
-import { ICommandBar, ICommandBarProps, ICommandBarItemProps } from './CommandBar.types';
-import { CommandBarButton } from 'office-ui-fabric-react/lib/Button';
-import { OverflowSet, IOverflowSet } from 'office-ui-fabric-react/lib/OverflowSet';
-import { ResizeGroup } from 'office-ui-fabric-react/lib/ResizeGroup';
-import { TooltipHost } from 'office-ui-fabric-react/lib/Tooltip';
-import * as stylesImport from './CommandBar.scss';
-
-// tslint:disable-next-line:no-any
-const styles: any = stylesImport;
-
-export interface ICommandBarData {
-  /**
-   * Items being rendered in the primary region
-   */
-  primaryItems: ICommandBarItemProps[];
-  /**
-   * Items being rendered in the overflow
-   */
-  overflowItems: ICommandBarItemProps[];
-  /**
-   * Items being rendered on the far side
-   */
-  farItems: ICommandBarItemProps[] | undefined;
-  /**
-   * Length of original overflowItems to ensure that they are not moved into primary region on resize
-   */
-  minimumOverflowItems: number;
-  /**
-   * Unique string used to cache the width of the command bar
-   */
-  cacheKey: string;
-}
-
-const COMMANDBAR_HEIGHT = '40px';
-
-export class CommandBar extends BaseComponent<ICommandBarProps, {}> implements ICommandBar {
-  public static defaultProps: ICommandBarProps = {
-    items: [],
-    overflowItems: [],
-    farItems: [],
-    elipisisIconProps: { iconName: 'More' }
-  };
-
-  private _overflowSet: IOverflowSet;
-
-  private _id: string;
-
-  constructor(props: ICommandBarProps) {
-    super(props);
-    this._id = getId('CommandBar');
-  }
-
-  public render(): JSX.Element {
-    const {
-      className,
-      items,
-      overflowItems,
-      farItems,
-      elipisisAriaLabel,
-      elipisisIconProps,
-      buttonStyles,
-      onRenderButton = this._onRenderButton,
-      onReduceData = this._onReduceData,
-      onGrowData = this._onGrowData,
-    } = this.props;
-
-    let commandBardata: ICommandBarData = {
-      primaryItems: [...items],
-      overflowItems: [...overflowItems!],
-      minimumOverflowItems: [...overflowItems!].length, // for tracking
-      farItems,
-      cacheKey: '',
-    };
-
-    return (
-      <ResizeGroup
-        className={ className }
-        data={ commandBardata }
-        onReduceData={ onReduceData }
-        onGrowData={ onGrowData }
-        // tslint:disable-next-line:jsx-no-lambda
-        onRenderData={ (data: ICommandBarData) => {
-          return (
-            <div className={ css('ms-CommandBar', styles.root) }>
-
-              {/*Primary Items*/ }
-              <OverflowSet
-                componentRef={ this._resolveRef('_overflowSet') }
-                className={ css(styles.primarySet) }
-                items={ data.primaryItems }
-                overflowItems={ data.overflowItems.length ? data.overflowItems : undefined }
-                onRenderItem={ this._onRenderItems }
-                onRenderOverflowButton={ (renderedOverflowItems: ICommandBarItemProps[]) => {
-                  return (
-                    onRenderButton({
-                      key: 'oveflowButton',
-                      styles: { ...buttonStyles, menuIcon: { fontSize: '17px' } },
-                      ariaLabel: elipisisAriaLabel,
-                      className: css(styles.overflowButton),
-                      menuProps: { items: renderedOverflowItems },
-                      menuIconProps: elipisisIconProps,
-                    })
-                  );
-                } }
-              />
-
-              {/*Secondary Items*/ }
-              <OverflowSet
-                className={ css(styles.secondarySet) }
-                items={ data.farItems }
-                onRenderItem={ this._onRenderItems }
-                onRenderOverflowButton={ () => null }
-              />
-            </div>
-          );
-        } }
-      />
-    );
-  }
-
-  public focus(): void {
-    this._overflowSet.focus();
-  }
-
-  private _computeCacheKey(primaryItems: ICommandBarItemProps[], farItems: ICommandBarItemProps[], overflow: boolean): string {
-    const returnKey = (acc: string, current: ICommandBarItemProps): string => {
-      const { cacheKey = current.key } = current;
-      return acc + cacheKey;
-    };
-
-    const primaryKey = primaryItems.reduce(returnKey, '');
-    const farKey = farItems.reduce(returnKey, '');
-    const overflowKey = overflow ? 'overflow' : '';
-
-    return [primaryKey, farKey, overflowKey].join(' ');
-  }
-
-  @autobind
-  private _onReduceData(data: ICommandBarData): ICommandBarData | undefined {
-    let { primaryItems, overflowItems, cacheKey, farItems } = data;
-    let movedItem = primaryItems[primaryItems.length - 1];
-
-    if (movedItem !== undefined) {
-      movedItem.renderedInOverflow = true;
-
-      overflowItems = [movedItem, ...overflowItems];
-      primaryItems = primaryItems.slice(0, -1);
-      cacheKey = this._computeCacheKey(primaryItems, farItems!, !!overflowItems.length);
-
-      return { ...data, primaryItems, overflowItems, cacheKey };
-    }
-
-    return undefined;
-  }
-
-  @autobind
-  private _onGrowData(data: ICommandBarData): ICommandBarData | undefined {
-    let { primaryItems, overflowItems, cacheKey, minimumOverflowItems, farItems } = data;
-    let movedItem = overflowItems[0];
-
-    // Make sure that moved item exists and is not one of the original overflow items
-    if (movedItem !== undefined && overflowItems.length > minimumOverflowItems) {
-      movedItem.renderedInOverflow = false;
-
-      overflowItems = overflowItems.slice(1);
-      primaryItems = [...primaryItems, movedItem];
-      cacheKey = this._computeCacheKey(primaryItems, farItems!, !!overflowItems.length);
-
-      return { ...data, primaryItems, overflowItems, cacheKey };
-    }
-
-    return undefined;
-  }
-
-  @autobind
-  private _onRenderItems(item: ICommandBarItemProps): JSX.Element | React.ReactNode {
-    let { buttonStyles } = this.props;
-
-    if (item.onRender) {
-      // These are the top level items, there is no relevant menu dismissing function to
-      // provide for the IContextualMenuItem onRender function. Pass in a no op function instead.
-      return item.onRender(item, () => undefined);
-    }
-    const commandButtonProps: ICommandBarItemProps = {
-      ...item,
-      styles: { root: { height: COMMANDBAR_HEIGHT }, ...item.styles, ...buttonStyles },
-      className: css(styles.commandButton, item.className),
-      text: !item.iconOnly ? item.name : '',
-      menuProps: item.subMenuProps,
-    };
-
-    if (item.iconOnly && item.name !== undefined) {
-      return (
-        <TooltipHost content={ item.name } >
-          { this._onRenderButton(commandButtonProps) }
-        </TooltipHost>
-      );
-    }
-
-    return this._onRenderButton(commandButtonProps);
-  }
-
-  @autobind
-  private _onRenderButton(props: ICommandBarItemProps): JSX.Element {
-    // tslint:disable-next-line:no-any
-    return <CommandBarButton {...props as any} />;
-  }
-}
+  ICommandBarProps
+} from './CommandBar.types';
+import { CommandBarBase } from './CommandBar.base';
+import { getStyles } from './CommandBar.styles';
+
+// Create a CommandBar variant which uses these default styles and this styled subcomponent.
+export const CommandBar = styled(
+  CommandBarBase,
+  getStyles
+);
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.types.ts b/packages/experiments/src/components/CommandBar/CommandBar.types.ts
index d7a9bda28518e..786fa4b8b82ae 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.types.ts
+++ b/packages/experiments/src/components/CommandBar/CommandBar.types.ts
@@ -1,9 +1,11 @@
 
 import * as React from 'react';
-import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { IContextualMenuItem, IMenuItemStyles } from 'office-ui-fabric-react/lib/ContextualMenu';
 import { IButtonStyles } from 'office-ui-fabric-react/lib/Button';
 import { IIconProps } from 'office-ui-fabric-react/lib/Icon';
-import { ICommandBarData } from './CommandBar';
+import { ICommandBarData } from './CommandBar.base';
+import { IStyle, ITheme } from '../../Styling';
+import { IStyleFunction } from '../../Utilities';
 
 export interface ICommandBar {
   /**
@@ -40,15 +42,31 @@ export interface ICommandBarProps extends React.HTMLAttributes<HTMLDivElement> {
   elipisisAriaLabel?: string;
 
   /**
-  * Text to be read by screen readers if there are overflow items and focus is on elipsis button
+  * Icon props to be passed to overflow elipsis
   */
   elipisisIconProps?: IIconProps;
 
+  /**
+  * If endAligned, all icons will be aligned to the far side of the commandbar, and overflow items
+  * will be taking from the starting side
+  */
+  endAligned?: boolean;
+
+  /**
+  * Call to provide customized styling that will layer on top of the variant rules
+  */
+  getStyles?: IStyleFunction<ICommandBarStyleProps, ICommandBarStyles>;
+
   /**
    * Custom styles to be mixed into individual button styles
    */
   buttonStyles?: IButtonStyles;
 
+  /**
+   * Theme provided by HOC.
+   */
+  theme?: ITheme;
+
   /**
    * Custom render function for all non contextual menu buttons.
    */
@@ -84,7 +102,7 @@ export interface ICommandBarItemProps extends IContextualMenuItem {
   /**
    * Custom styles for individual button
    */
-  styles?: IButtonStyles;
+  buttonStyles?: IButtonStyles;
 
   /**
    * A custom cache key to be used for this item. If cacheKey is changed, the cache will invalidate. Defaults to key value;
@@ -98,3 +116,15 @@ export interface ICommandBarItemProps extends IContextualMenuItem {
   renderedInOverflow?: boolean;
 
 }
+
+export interface ICommandBarStyleProps {
+  theme: ITheme;
+  className?: string;
+  endAligned?: boolean;
+}
+
+export interface ICommandBarStyles {
+  root?: IStyle;
+  primarySet?: IStyle;
+  secondarySet?: IStyle;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap b/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
index 59bea0ec685c4..8223cdbe787be 100644
--- a/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
+++ b/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
@@ -8,12 +8,29 @@ exports[`CommandBar renders commands correctly 1`] = `
     className=""
   >
     <div
-      className="ms-CommandBar"
+      className=
+          ms-CommandBar
+          {
+            background-color: #f4f4f4;
+            display: flex;
+            height: 40px;
+            padding-bottom: 0;
+            padding-left: 16px;
+            padding-right: 16px;
+            padding-top: 0;
+          }
     >
       <div
         aria-describedby={undefined}
         aria-labelledby={undefined}
-        className="ms-FocusZone ms-OverflowSet"
+        className=
+            ms-FocusZone
+            ms-OverflowSet
+            {
+              align-items: stretch;
+              display: flex;
+              flex-grow: 1;
+            }
         data-focuszone-id="FocusZone1"
         onFocus={[Function]}
         onKeyDown={[Function]}
@@ -44,7 +61,7 @@ exports[`CommandBar renders commands correctly 1`] = `
                   font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
                   font-size: 14px;
                   font-weight: 400;
-                  height: 40px;
+                  height: 100%;
                   min-width: 40px;
                   outline: transparent;
                   padding-bottom: 0;
@@ -145,7 +162,7 @@ exports[`CommandBar renders commands correctly 1`] = `
                   font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
                   font-size: 14px;
                   font-weight: 400;
-                  height: 40px;
+                  height: 100%;
                   min-width: 40px;
                   outline: transparent;
                   padding-bottom: 0;
@@ -226,7 +243,14 @@ exports[`CommandBar renders commands correctly 1`] = `
       <div
         aria-describedby={undefined}
         aria-labelledby={undefined}
-        className="ms-FocusZone ms-OverflowSet"
+        className=
+            ms-FocusZone
+            ms-OverflowSet
+            {
+              align-items: stretch;
+              display: flex;
+              flex-shrink: 0;
+            }
         data-focuszone-id="FocusZone8"
         onFocus={[Function]}
         onKeyDown={[Function]}
diff --git a/packages/experiments/tsconfig.json b/packages/experiments/tsconfig.json
index f48edfbaad5c2..f36532dd11199 100644
--- a/packages/experiments/tsconfig.json
+++ b/packages/experiments/tsconfig.json
@@ -9,7 +9,6 @@
     "sourceMap": true,
     "experimentalDecorators": true,
     "importHelpers": true,
-    "noUnusedLocals": true,
     "forceConsistentCasingInFileNames": true,
     "strictNullChecks": true,
     "noImplicitAny": true,
diff --git a/packages/experiments/tslint.json b/packages/experiments/tslint.json
index 8d79cc0019df1..cbaba79e30a85 100644
--- a/packages/experiments/tslint.json
+++ b/packages/experiments/tslint.json
@@ -2,5 +2,25 @@
   "extends": [
     "office-ui-fabric-react-tslint"
   ],
-  "rules": {}
-}
+  "rules": {
+    "jsx-no-string-ref": false,
+    "jsx-key": false,
+    "jsx-boolean-value": false,
+    "jsx-ban-props": false,
+    "max-line-length": [
+      false,
+      140
+    ],
+    "no-any": false,
+    "variable-name": false,
+    "no-internal-module": false,
+    "prefer-const": false,
+    "typedef": [
+      false
+    ],
+    "no-inferrable-types": [
+      false
+    ],
+    "no-unused-variable": false
+  }
+}
\ No newline at end of file

From c27765dc1a76d252d97e7daf23c441319d467606 Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Tue, 28 Nov 2017 10:42:29 -0800
Subject: [PATCH 1073/1641] SwatchColorPicker: Move component to JS styling
 (#3432)

* Add colorpicker style props

* Add styles file and basic structure for custom styling

* Add getStyles prop

* Fix tslint issues

* Add SwatchColorPicker base

* Style changes to SwatchColorPicker

* Fixed hover... still missing the padding issue in button

* Fix padding issue with buttons

* Update snapshots

* Change name of class to colorCell

* Change name of prop style to colorCell

* Create common methods for styling and selection

* Add HighContrast selector

* Add gridCell base file

* Separate colorGridCell logic from colorpicker

* Fix styling rendering

* Fix square rendering

* Remove unncesary extending of basecomponent

* Populate click events

* Fix border color cell selected issue

* Update colorpicker snapshot

* Remove comments from tests

* Remove unnecessary css import

* Remove testing methods

* Remove testind deps

* Update border color when active

* Update snapshots

* Add change file

* Add colorpicker style props

* Add styles file and basic structure for custom styling

* Add getStyles prop

* Fix tslint issues

* Add SwatchColorPicker base

* Style changes to SwatchColorPicker

* Fixed hover... still missing the padding issue in button

* Fix padding issue with buttons

* Update snapshots

* Change name of class to colorCell

* Change name of prop style to colorCell

* Create common methods for styling and selection

* Add HighContrast selector

* Add gridCell base file

* Separate colorGridCell logic from colorpicker

* Fix styling rendering

* Fix square rendering

* Remove unncesary extending of basecomponent

* Populate click events

* Fix border color cell selected issue

* Update colorpicker snapshot

* Remove comments from tests

* Remove unnecessary css import

* Remove testing methods

* Remove testind deps

* Update border color when active

* Update snapshots

* Add change file

* Add whiteCell changes

* Fix whiteCell active style

* Update Snapshot

* Remove unused imports

* Add removed method

* Add missing comments

* Remove empty line

* Add exports of colorpickergridcell to index

* Update props comment

* Override getCLassNames to avoid having a classNames prop

* Update snapshot

* Update whiteColor cell border to meet highContrast ratio

* Change new styling imports to utilities

* Add missing boxShadow

* Update snapshot

* Remove boxShadow when we hover and cell is not selected
---
 ...o-ColorPickerStyling_2017-11-20-10-36.json |   11 +
 packages/office-ui-fabric-react/package.json  |    2 +-
 .../__snapshots__/Breadcrumb.test.tsx.snap    |    2 +-
 .../Button/BaseButton.classNames.ts           |   49 +-
 .../__snapshots__/ComboBox.test.tsx.snap      |    2 +-
 .../__snapshots__/Facepile.test.tsx.snap      |    2 +-
 .../Nav/__snapshots__/Nav.test.tsx.snap       |    2 +-
 .../Pivot/__snapshots__/Pivot.test.tsx.snap   |    8 +-
 .../__snapshots__/SpinButton.test.tsx.snap    |    4 +-
 .../ColorPickerGridCell.base.tsx              |  157 +++
 .../ColorPickerGridCell.styles.ts             |  116 ++
 .../SwatchColorPicker/ColorPickerGridCell.tsx |   13 +
 .../ColorPickerGridCell.types.ts              |  141 ++
 .../SwatchColorPicker.base.tsx                |  208 +++
 .../SwatchColorPicker/SwatchColorPicker.scss  |  152 ---
 .../SwatchColorPicker.styles.ts               |   22 +
 .../SwatchColorPicker.test.tsx                |   23 +-
 .../SwatchColorPicker/SwatchColorPicker.tsx   |  237 +---
 .../SwatchColorPicker.types.ts                |   38 +-
 .../SwatchColorPicker.test.tsx.snap           | 1173 +++++++++++++++--
 .../SwatchColorPicker.Basic.Example.tsx       |    2 +-
 .../src/components/SwatchColorPicker/index.ts |    5 +
 .../src/utilities/grid/GridCell.tsx           |    6 +-
 .../src/utilities/grid/GridCell.types.ts      |   18 +
 24 files changed, 1818 insertions(+), 575 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/malozano-ColorPickerStyling_2017-11-20-10-36.json
 create mode 100644 packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.base.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.styles.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.types.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.styles.ts

diff --git a/common/changes/office-ui-fabric-react/malozano-ColorPickerStyling_2017-11-20-10-36.json b/common/changes/office-ui-fabric-react/malozano-ColorPickerStyling_2017-11-20-10-36.json
new file mode 100644
index 0000000000000..c163271314fe7
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-ColorPickerStyling_2017-11-20-10-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SwatchColorPicker: Change scss to js styling",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index ced9878569a17..6bb4d00aff8d0 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -56,4 +56,4 @@
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
index 9e5dd8b40e399..731d9b33a9335 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
@@ -189,9 +189,9 @@ exports[`Breadcrumb renders breadcumb correctly 2`] = `
               aria-owns={null}
               aria-pressed={undefined}
               className=
-                  ms-Breadcrumb-overflowButton
                   ms-Button
                   ms-Button--icon
+                  ms-Breadcrumb-overflowButton
                   {
                     -moz-osx-font-smoothing: grayscale;
                     -webkit-font-smoothing: antialiased;
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
index 6c00c75b35f88..7d1ad3759b2be 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
@@ -1,5 +1,5 @@
 import { memoizeFunction } from '../../Utilities';
-import { mergeStyles, ITheme } from '../../Styling';
+import { mergeStyleSets } from '../../Styling';
 import { IButtonStyles } from './Button.types';
 import { getStyles } from './BaseButton.styles';
 
@@ -26,12 +26,12 @@ export const getBaseButtonClassNames = memoizeFunction((
   isSplit: boolean | undefined
 ): IButtonClassNames => {
   const isExpanded = expanded && !isSplit;
-  return {
-    root: mergeStyles(
-      className,
+  return mergeStyleSets({
+    root: [
       'ms-Button',
-      variantClassName,
       styles.root,
+      variantClassName,
+      className,
       checked && [
         'is-checked',
         styles.rootChecked
@@ -73,35 +73,30 @@ export const getBaseButtonClassNames = memoizeFunction((
           ':active': styles.rootCheckedPressed
         }
       }
-    ),
-
-    flexContainer: mergeStyles(
+    ],
+    flexContainer: [
       'ms-Button-flexContainer',
       styles.flexContainer
-    ),
-
-    textContainer: mergeStyles(
+    ],
+    textContainer: [
       'ms-Button-textContainer',
       styles.textContainer
-    ),
-
-    icon: mergeStyles(
+    ],
+    icon: [
       'ms-Button-icon',
       iconClassName,
       styles.icon,
       isExpanded && styles.iconExpanded,
       checked && styles.iconChecked,
       disabled && styles.iconDisabled,
-    ),
-
-    label: mergeStyles(
+    ],
+    label: [
       'ms-Button-label',
       styles.label,
       checked && styles.labelChecked,
       disabled && styles.labelDisabled,
-    ),
-
-    menuIcon: mergeStyles(
+    ],
+    menuIcon: [
       'ms-Button-menuIcon',
       menuIconClassName,
       styles.menuIcon,
@@ -124,18 +119,16 @@ export const getBaseButtonClassNames = memoizeFunction((
           },
         },
       ]
-    ),
-
-    description: mergeStyles(
+    ],
+    description: [
       'ms-Button-description',
       styles.description,
       checked && styles.descriptionChecked,
       disabled && styles.descriptionDisabled
-    ),
-
-    screenReaderText: mergeStyles(
+    ],
+    screenReaderText: [
       'ms-Button-screenReaderText',
       styles.screenReaderText
-    )
-  };
+    ]
+  });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
index 32273334ff77c..afa5139821a7a 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
@@ -105,9 +105,9 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
       aria-labelledby={null}
       aria-pressed={undefined}
       className=
-          ms-ComboBox-CaretDown-button
           ms-Button
           ms-Button--icon
+          ms-ComboBox-CaretDown-button
           {
             -moz-osx-font-smoothing: grayscale;
             -webkit-font-smoothing: antialiased;
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
index 195be592cf5a6..a9ea99628b2e0 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
@@ -99,9 +99,9 @@ exports[`Facepile Render personas and buttons renders Facepile correctly 1`] = `
         aria-labelledby={null}
         aria-pressed={undefined}
         className=
+            ms-Button
             ms-Facepile-itemButton
             ms-Facepile-person
-            ms-Button
             {
               -moz-osx-font-smoothing: grayscale;
               -webkit-font-smoothing: antialiased;
diff --git a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
index 6f52028131098..9a9e92ba649af 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
@@ -47,10 +47,10 @@ exports[`Nav renders Nav correctly 1`] = `
                 aria-labelledby={null}
                 aria-pressed={undefined}
                 className=
-                    ms-Nav-linkButton
                     ms-Button
                     ms-Button--action
                     ms-Button--command
+                    ms-Nav-linkButton
                     {
                       -moz-osx-font-smoothing: grayscale;
                       -webkit-font-smoothing: antialiased;
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap
index 9683adf9a2922..8058f2c9d08bd 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap
@@ -23,12 +23,12 @@ exports[`Pivot renders Pivot correctly 1`] = `
         aria-pressed={undefined}
         aria-selected={true}
         className=
-            ms-Pivot-link
-            is-selected
-            undefined
             ms-Button
             ms-Button--action
             ms-Button--command
+            ms-Pivot-link
+            is-selected
+            undefined
             {
               -moz-osx-font-smoothing: grayscale;
               -webkit-font-smoothing: antialiased;
@@ -118,10 +118,10 @@ exports[`Pivot renders Pivot correctly 1`] = `
         aria-pressed={undefined}
         aria-selected={false}
         className=
-            ms-Pivot-link
             ms-Button
             ms-Button--action
             ms-Button--command
+            ms-Pivot-link
             {
               -moz-osx-font-smoothing: grayscale;
               -webkit-font-smoothing: antialiased;
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
index 3f6c43aa9eff7..931835bcb4a6d 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
@@ -152,9 +152,9 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
         aria-pressed={false}
         checked={false}
         className=
-            ms-UpButton
             ms-Button
             ms-Button--icon
+            ms-UpButton
             {
               -moz-osx-font-smoothing: grayscale;
               -webkit-font-smoothing: antialiased;
@@ -260,9 +260,9 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
         aria-pressed={false}
         checked={false}
         className=
-            ms-DownButton
             ms-Button
             ms-Button--icon
+            ms-DownButton
             {
               -moz-osx-font-smoothing: grayscale;
               -webkit-font-smoothing: antialiased;
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.base.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.base.tsx
new file mode 100644
index 0000000000000..f15f4b52a1333
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.base.tsx
@@ -0,0 +1,157 @@
+import * as React from 'react';
+import {
+  autobind,
+  customizable
+} from '../../Utilities';
+import {
+  IColorCellProps,
+  IColorPickerGridCellProps,
+  IColorPickerGridCellStyleProps,
+  IColorPickerGridCellStyles
+} from './ColorPickerGridCell.types';
+import { getColorFromString } from '../../utilities/color/colors';
+import { GridCell } from '../../utilities/grid/GridCell';
+import { IGridCellProps } from '../../utilities/grid/GridCell.types';
+import { IButtonClassNames } from '../Button/BaseButton.classNames';
+import { getStyles as getActionButtonStyles } from '../Button/ActionButton/ActionButton.styles';
+import { mergeStyleSets, ITheme } from '../../Styling';
+import { classNamesFunction } from '../../Utilities';
+
+const getClassNames = classNamesFunction<IColorPickerGridCellStyleProps, IColorPickerGridCellStyles>();
+
+class ColorCell extends GridCell<IColorCellProps, IGridCellProps<IColorCellProps>> {
+}
+
+@customizable('ColorPickerGridCell', ['theme'])
+export class ColorPickerGridCellBase extends React.Component<IColorPickerGridCellProps, {}> {
+
+  public static defaultProps = {
+    circle: true,
+    disabled: false,
+    selected: false,
+  } as IColorPickerGridCellProps;
+
+  private _classNames: {[key in keyof IColorPickerGridCellStyles]: string };
+
+  public render() {
+    let {
+      item,
+      id,
+      selected,
+      disabled,
+      getStyles,
+      theme,
+      circle
+    } = this.props;
+
+    this._classNames = getClassNames(
+      getStyles!,
+      {
+        theme: theme!,
+        disabled,
+        selected,
+        circle,
+        isWhite: this._isWhiteCell(this.props.color)
+      }
+    );
+
+    return (
+      <ColorCell
+        item={ item }
+        id={ id }
+        key={ item.id }
+        disabled={ disabled }
+        role={ 'gridcell' }
+        onRenderItem={ this._onRenderColorOption }
+        selected={ selected }
+        onClick={ this.props.onClick }
+        onHover={ this.props.onHover }
+        onFocus={ this.props.onFocus }
+        label={ item.label }
+        className={ this._classNames.colorCell }
+        getClassNames={ this._getClassNames }
+      />
+    );
+  }
+
+  /**
+ * Render the core of a color cell
+ * @returns {JSX.Element} - Element representing the core of the item
+ */
+  @autobind
+  private _onRenderColorOption(colorOption: IColorCellProps): JSX.Element {
+    // Build an SVG for the cell with the given shape and color properties
+    return (
+      <svg className={ this._classNames.svg } viewBox='0 0 20 20' fill={ getColorFromString(colorOption.color as string)!.str } >
+        {
+          this.props.circle ?
+            <circle cx='50%' cy='50%' r='50%' /> :
+            <rect width='100%' height='100%' />
+        }
+      </svg>
+    );
+  }
+
+  /**
+* Validate if the cell's color is white or not to apply whiteCell style
+* @param inputColor - The color of the current cell
+* @returns - Whether the cell's color is white or not.
+*/
+  private _isWhiteCell(inputColor: string | undefined): boolean {
+    return inputColor!.toLocaleLowerCase() === '#ffffff';
+  }
+
+  /**
+   * Method to override the getClassNames func in a button.
+   */
+  @autobind
+  private _getClassNames(
+    theme: ITheme,
+    className: string,
+    variantClassName: string,
+    iconClassName: string | undefined,
+    menuIconClassName: string | undefined,
+    disabled: boolean,
+    checked: boolean,
+    expanded: boolean,
+    isSplit: boolean | undefined): IButtonClassNames {
+    let styles = getActionButtonStyles(theme);
+    return mergeStyleSets(this._classNames as {}, {
+      root: [
+        'ms-Button',
+        styles.root,
+        variantClassName,
+        className,
+        checked && [
+          'is-checked',
+          styles.rootChecked
+        ],
+        disabled && [
+          'is-disabled',
+          styles.rootDisabled
+        ],
+        !disabled && !checked && {
+          selectors: {
+            ':hover': styles.rootHovered,
+            ':focus': styles.rootFocused,
+            ':active': styles.rootPressed,
+          }
+        },
+        disabled && checked && [
+          styles.rootCheckedDisabled
+        ],
+        !disabled && checked && {
+          selectors: {
+            ':hover': styles.rootCheckedHovered,
+            ':active': styles.rootCheckedPressed
+          }
+        }
+      ],
+      flexContainer: [
+        'ms-Button-flexContainer',
+        styles.flexContainer
+      ]
+    });
+  }
+
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.styles.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.styles.ts
new file mode 100644
index 0000000000000..643fa8b18d70a
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.styles.ts
@@ -0,0 +1,116 @@
+import {
+  IRawStyle,
+  getFocusStyle,
+  HighContrastSelector,
+} from '../../Styling';
+import { IColorPickerGridCellStyleProps, IColorPickerGridCellStyles } from './ColorPickerGridCell.types';
+
+const ACTIVE_BORDER_COLOR = '#969696';
+
+function getSvgSelectorStyles(borderColor: string, isHover: boolean): IRawStyle {
+  return {
+    width: 12,
+    height: 12,
+    border: '4px solid',
+    borderColor: borderColor,
+    boxShadow: isHover ? 'none' : '0 0 0 1px #969696',
+    padding: 4,
+    margin: 0
+  };
+}
+
+export const getStyles = (props: IColorPickerGridCellStyleProps): IColorPickerGridCellStyles => {
+  const {
+    theme,
+    disabled,
+    selected,
+    circle,
+    isWhite
+  } = props;
+
+  const { semanticColors, fonts } = theme;
+  return {
+    colorCell: [
+      {
+        backgroundColor: 'transparent',
+        padding: 0,
+        overflow: 'visible',
+        position: 'relative',
+        boxSizing: 'border-box',
+        display: 'inline-block',
+        border: '1px solid transparent',
+        background: 'transparent',
+        cursor: 'pointer',
+        textAlign: 'center',
+        verticalAlign: 'top',
+        userSelect: 'none',
+        height: 40,
+        selectors: {
+          [HighContrastSelector]: { border: 'none' },
+          '.ms-Fabric.is-focusVisible &:focus, .ms-Fabric.is-focusVisible &:focus::after': { border: 'none' },
+          '.ms-Fabric.is-focusVisible &:focus $svg': getSvgSelectorStyles(theme.palette.neutralQuaternaryAlt, false),
+          ':hover $svg': getSvgSelectorStyles(theme.palette.neutralQuaternaryAlt, true),
+          ':focus $svg': getSvgSelectorStyles(theme.palette.neutralQuaternaryAlt, false),
+          ':active $svg': getSvgSelectorStyles(ACTIVE_BORDER_COLOR, false),
+        }
+      },
+      isWhite && {
+        selectors: {
+          '$svg': {
+            padding: 0,
+            border: '1px solid',
+            borderColor: theme.palette.neutralTertiary,
+            margin: 4,
+          },
+        }
+      },
+      circle && 'is-circle' && {
+        selectors: {
+          '$svg': { borderRadius: '100%' },
+        }
+      },
+      selected && 'isSelected' && {
+        selectors: {
+          '$svg': {
+            boxShadow: '0 0 0 1px #969696',
+            border: '4px solid',
+            borderColor: theme.palette.neutralTertiaryAlt,
+            width: 12,
+            height: 12,
+          },
+          ':hover $svg': { boxShadow: '0 0 0 1px #969696' },
+          ':focus $svg': {
+            boxShadow: '0 0 0 1px #969696',
+          },
+          ':active $svg':
+            {
+              boxShadow: '0 0 0 1px #969696',
+              borderColor: ACTIVE_BORDER_COLOR,
+            },
+        },
+      },
+      selected && isWhite && {
+        selectors: {
+          '$svg': {
+            padding: 4,
+            margin: 0
+          }
+        }
+      },
+      disabled && 'is-disabled' && {
+        color: semanticColors.disabledBodyText,
+        cursor: 'default',
+        pointerEvents: 'none',
+        opacity: .3
+      }
+    ],
+    svg: [
+      {
+        width: 20,
+        height: 20,
+        padding: 4,
+        boxSizing: 'content-box',
+      }
+    ]
+  };
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.tsx
new file mode 100644
index 0000000000000..b9c0d47e8598e
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.tsx
@@ -0,0 +1,13 @@
+import * as React from 'react';
+import {
+  IStyleFunction,
+  styled
+} from '../../Utilities';
+import { ColorPickerGridCellBase } from './ColorPickerGridCell.base';
+import { IColorPickerGridCellProps } from './ColorPickerGridCell.types';
+import { getStyles } from './ColorPickerGridCell.styles';
+
+export const ColorPickerGridCell = styled(
+  ColorPickerGridCellBase,
+  getStyles
+);
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.types.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.types.ts
new file mode 100644
index 0000000000000..1ead8620b299f
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.types.ts
@@ -0,0 +1,141 @@
+import { IStyle, ITheme } from '../../Styling';
+import { IStyleFunction } from '../../Utilities';
+
+export interface IColorPickerGridCellProps {
+  /**
+   * Item to render
+   */
+  item: IColorCellProps;
+
+  /**
+ * Arbitrary unique string associated with this option
+ */
+  id: string;
+
+  /**
+   * The label for this item.
+   * Visible text if this item is a header,
+   * tooltip if is this item is normal
+   */
+  label?: string;
+
+  /**
+   * The CSS-compatible string to describe the color
+   */
+  color?: string;
+
+  /**
+   * Index for this option
+   */
+  index?: number;
+
+  /**
+   * The theme object to use for styling.
+   */
+  theme?: ITheme;
+
+  /**
+   * Wheter or not colorOption should be rendered as a circle or square.
+   */
+  circle?: boolean;
+
+  /**
+   * Optional, if the this option should be disabled
+   */
+  disabled?: boolean;
+
+  /**
+   * Optional, if the cell is currently selected
+   */
+  selected: boolean;
+
+  /**
+   * The on click handler
+   */
+  onClick?: (item: IColorCellProps) => void;
+
+  /**
+ * Optional, the onHover handler
+ */
+  onHover?: (item?: IColorCellProps) => void;
+
+  /**
+   * Optional, the onFocus handler
+   */
+  onFocus?: (item: IColorCellProps) => void;
+
+  /**
+  * Optional styles for the component.
+  */
+  getStyles?: IStyleFunction<IColorPickerGridCellStyleProps, IColorPickerGridCellStyles>;
+}
+
+export interface IColorCellProps {
+
+  /**
+  * Arbitrary unique string associated with this option
+  */
+  id: string;
+
+  /**
+   * The label for this item.
+   * Visible text if this item is a header,
+   * tooltip if is this item is normal
+   */
+  label?: string;
+
+  /**
+   * The CSS-compatible string to describe the color
+   */
+  color?: string;
+
+  /**
+   * Index for this option
+   */
+  index?: number;
+}
+
+/**
+ * Properties required to build the styles for the color picker component.
+ */
+export interface IColorPickerGridCellStyleProps {
+  /**
+   * Theme to apply to the cell.
+   */
+  theme: ITheme;
+
+  /**
+   * Whether the component is disabled or not.
+   */
+  disabled?: boolean;
+
+  /**
+   * Whether the cell is currently selected or not.
+   */
+  selected?: boolean;
+
+  /**
+   * Whether the svg color element should be rendered as a circle or not.
+   */
+  circle?: boolean;
+
+  /**
+   * Whether the color being rendered is white or not. If it is white we show a border around it.
+   */
+  isWhite?: boolean;
+}
+
+/**
+ * Styles for the Color Picker Component.
+ */
+export interface IColorPickerGridCellStyles {
+  /**
+   * Style to apply to a colorCell in the color picker.
+   */
+  colorCell: IStyle;
+
+  /**
+   * Style to apply to the svg element that renders the color.
+   */
+  svg: IStyle;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
new file mode 100644
index 0000000000000..9107189545f7d
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
@@ -0,0 +1,208 @@
+import * as React from 'react';
+import {
+  autobind,
+  BaseComponent,
+  findIndex,
+  getId,
+  customizable
+} from '../../Utilities';
+import {
+  ISwatchColorPicker,
+  ISwatchColorPickerProps,
+  ISwatchColorPickerStyleProps,
+  ISwatchColorPickerStyles
+} from './SwatchColorPicker.types';
+import { Grid } from '../../utilities/grid/Grid';
+import { IColorCellProps } from './ColorPickerGridCell.types';
+import { ColorPickerGridCell } from './ColorPickerGridCell';
+import { mergeStyleSets } from '../../Styling';
+import { classNamesFunction } from '../../Utilities';
+
+export interface ISwatchColorPickerState {
+  selectedIndex?: number;
+}
+
+const getClassNames = classNamesFunction<ISwatchColorPickerStyleProps, ISwatchColorPickerStyles>();
+
+@customizable('SwatchColorPicker', ['theme'])
+export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps, ISwatchColorPickerState> implements ISwatchColorPicker {
+
+  public static defaultProps = {
+    cellShape: 'circle',
+    disabled: false,
+    shouldFocusCircularNavigate: true
+  } as ISwatchColorPickerProps;
+
+  private _id: string;
+
+  constructor(props: ISwatchColorPickerProps) {
+    super(props);
+
+    this._id = props.id || getId('swatchColorPicker');
+
+    let selectedIndex: number | undefined;
+    if (props.selectedId) {
+      selectedIndex = this._getSelectedIndex(props.colorCells, props.selectedId);
+    }
+
+    this.state = {
+      selectedIndex
+    };
+  }
+
+  public componentWillReceiveProps(newProps: ISwatchColorPickerProps) {
+    let newSelectedIndex;
+
+    if (newProps.selectedId) {
+      newSelectedIndex = this._getSelectedIndex(newProps.colorCells, newProps.selectedId);
+    }
+
+    if (newSelectedIndex !== this.state.selectedIndex) {
+      this.setState({
+        selectedIndex: newSelectedIndex
+      });
+    }
+  }
+
+  public render() {
+    let {
+      colorCells,
+      columnCount,
+      positionInSet,
+      setSize,
+      shouldFocusCircularNavigate,
+      className,
+      doNotContainWithinFocusZone,
+      disabled,
+      getStyles,
+    } = this.props;
+
+    const classNames = getClassNames(
+      getStyles!,
+      {
+        theme: this.props.theme!,
+        className,
+      }
+    );
+
+    if (colorCells.length < 1 || columnCount < 1) {
+      return null;
+    }
+    return (
+      <Grid
+        items={ colorCells.map((item, index) => { return { ...item, index }; }) }
+        columnCount={ columnCount }
+        onRenderItem={ this._renderOption }
+        positionInSet={ positionInSet && positionInSet }
+        setSize={ setSize && setSize }
+        shouldFocusCircularNavigate={ shouldFocusCircularNavigate }
+        doNotContainWithinFocusZone={ doNotContainWithinFocusZone }
+        onBlur={ this._onSwatchColorPickerBlur }
+        containerClassName={ classNames.root }
+      />);
+  }
+
+  /**
+   * When the whole swatchColorPicker is blurred,
+   * make sure to clear the pending focused stated
+   */
+  @autobind
+  private _onSwatchColorPickerBlur() {
+    if (this.props.onCellFocused) {
+      this.props.onCellFocused();
+    }
+  }
+
+  /**
+   * Get the selected item's index
+   * @param items - The items to search
+   * @param selectedId - The selected item's id to find
+   * @returns {number} - The index of the selected item's id, -1 if there was no match
+   */
+  private _getSelectedIndex(items: IColorCellProps[], selectedId: string): number | undefined {
+    let selectedIndex = findIndex(items, (item => (item.id === selectedId)));
+    return selectedIndex >= 0 ? selectedIndex : undefined;
+  }
+
+  private _isSelected(index: number): boolean {
+    return this.state.selectedIndex !== undefined && (this.state.selectedIndex === index);
+  }
+
+  /**
+   * Render a color cell
+   * @param item - The item to render
+   * @returns {JSX.Element} - Element representing the item
+   */
+  @autobind
+  private _renderOption(item: IColorCellProps): JSX.Element {
+    let id = this._id;
+
+    return (
+      <ColorPickerGridCell
+        item={ item }
+        id={ id }
+        color={ item.color }
+        disabled={ this.props.disabled }
+        onClick={ this._onCellClick }
+        onHover={ this._onGridCellHovered }
+        onFocus={ this._onGridCellFocused }
+        selected={ this.state.selectedIndex !== undefined && (this.state.selectedIndex === item.index) }
+        circle={ this.props.cellShape === 'circle' }
+        label={ item.label }
+      />
+    );
+  }
+
+  /**
+   * Callback passed to the GridCell class that will trigger the onCellHovered callback of the SwatchColorPicker
+   */
+  @autobind
+  private _onGridCellHovered(item?: IColorCellProps): void {
+    if (this.props && this.props.onCellHovered) {
+      if (item) {
+        this.props.onCellHovered(item.id, item.color);
+      } else {
+        this.props.onCellHovered();
+      }
+    }
+  }
+
+  /**
+   * Callback passed to the GridCell class that will trigger the onCellFocus callback of the SwatchColorPicker
+   */
+  @autobind
+  private _onGridCellFocused(item?: IColorCellProps): void {
+    if (this.props && this.props.onCellFocused) {
+      if (item) {
+        this.props.onCellFocused(item.id, item.color);
+      } else {
+        this.props.onCellFocused();
+      }
+    }
+  }
+
+  /**
+   * Handle the click on a cell
+   * @param item - The cell that the click was fired against
+   */
+  @autobind
+  private _onCellClick(item: IColorCellProps) {
+    if (this.props.disabled) {
+      return;
+    }
+
+    let index = item.index as number;
+
+    // If we have a valid index and it is not already
+    // selected, select it
+    if (index >= 0 && index !== this.state.selectedIndex) {
+      if (this.props.onColorChanged) {
+        this.props.onColorChanged(item.id, item.color);
+      }
+
+      this.setState({
+        selectedIndex: index
+      });
+    }
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
deleted file mode 100644
index 9aa7c432fc533..0000000000000
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.scss
+++ /dev/null
@@ -1,152 +0,0 @@
-@import '../../common/common';
-
-.root {
-  position: relative;
-}
-
-.svg {
-  width: 20px;
-  height: 20px;
-  padding: 4px;
-  box-sizing: content-box;
-}
-
-:global(.ms-Fabric.is-focusVisible) .cell {
-  &:focus,
-  &:focus::after {
-    border: none;
-  }
-}
-
-.item {
-  @include ms-font-m;
-  @include focus-border();
-  @include text-align(left);
-  color: $bodyTextColor;
-  position: relative;
-  box-sizing: border-box;
-  border: none;
-  width: 100%;
-  height: 36px;
-  line-height: 36px;
-  display: block;
-  cursor: pointer;
-  padding: 0px 6px;
-  flex-grow: 1;
-  text-overflow: ellipsis;
-  overflow: hidden;
-  white-space: nowrap;
-
-  &:hover:not([disabled]) {
-    background: $menuItemBackgroundHoveredColor;
-  }
-  &.disabled,
-  &[disabled] {
-    color: $disabledBodyTextColor;
-    cursor: default;
-    pointer-events: none;
-  }
-
-  :global(.is-focusVisible) &:focus {
-    background: $menuItemBackgroundHoveredColor;
-  }
-}
-
-.cell {
-  padding: 0px;
-  overflow: visible;
-
-  &.cellIsSelected {
-    &:hover .svg,
-    &:active .svg {
-      box-shadow: 0 0 0 1px #969696;
-    }
-
-    &:focus .svg,
-    & .svg {
-      &.circle {
-        border-radius: 100%;
-      }
-
-      width: 12px;
-      height: 12px;
-      border: 4px solid $ms-color-neutralTertiaryAlt;
-
-      &.whiteColorCell {
-        padding: 4px;
-        margin: 0;
-      }
-    }
-  }
-
-   &:focus .svg {
-      box-shadow: 0 0 0 1px #969696;
-   }
-
-  &:hover .svg,
-  &:focus .svg,
-  &:active .svg {
-    width: 12px;
-    height: 12px;
-
-    &.whiteColorCell {
-      padding: 4px;
-      margin: 0;
-    }
-  }
-
-  &:hover .svg,
-  &:focus .svg {
-      border: 4px solid $ms-color-neutralQuaternaryAlt;
-   }
-
-  &:active .svg {
-  border: 4px solid $ms-color-neutralTertiaryAlt;
-  }
-
-  &:hover .svg.circle,
-  &:focus .svg.circle,
-  &:active .svg.circle {
-    border-radius: 100%;
-  }
-
-  &:active .svg {
-    border: 4px solid #969696;
-
-    // This is for a transform issue in IE
-    // where the edge of the SVG becomes hidden
-    // (e.g. the browser is not correctly listening to overflow: visible).
-    // Edge does the right thing and is not altered by this
-    -ms-transform: translate(-1px, -1px);
-  }
-
-    &.disabled,
-  &[disabled] {
-    color: $disabledBodyTextColor;
-    cursor: default;
-    pointer-events: none;
-    opacity: .3;
-  }
-
-  @include high-contrast {
-    border: none;
-  }
-}
-
-.whiteColorCell {
-  padding: 0;
-  border: 1px solid #D2D2D2;
-  margin: 4px;
-
-  &.circle {
-    border-radius: 100%;
-  }
-}
-
-.swatchColorPickerContainer {
-  clear: both;
-  display: block;
-  min-width: 180px;
-}
-
-
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.styles.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.styles.ts
new file mode 100644
index 0000000000000..fd1f6d773cc80
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.styles.ts
@@ -0,0 +1,22 @@
+
+import { ISwatchColorPickerStyleProps, ISwatchColorPickerStyles } from './SwatchColorPicker.types';
+
+export const getStyles = (props: ISwatchColorPickerStyleProps): ISwatchColorPickerStyles => {
+  const {
+    theme,
+    className,
+  } = props;
+
+  const { semanticColors, fonts } = theme;
+  return {
+    root: [
+      'ms-swatchColorPickerBodyContainer',
+      {
+        clear: 'both',
+        display: 'block',
+        minWidth: '180px',
+      },
+      className
+    ]
+  };
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
index 9a5f13620cb14..d74c1fbf7448c 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
@@ -5,8 +5,9 @@ import * as ReactDOM from 'react-dom';
 import * as ReactTestUtils from 'react-dom/test-utils';
 import * as renderer from 'react-test-renderer';
 import { mount } from 'enzyme';
-import { SwatchColorPicker } from './SwatchColorPicker';
-import { IColorCellProps } from './SwatchColorPicker.types';
+import { SwatchColorPickerBase } from './SwatchColorPicker.base';
+import { getStyles } from './SwatchColorPicker.styles';
+import { IColorCellProps } from './ColorPickerGridCell.types';
 
 const DEFAULT_OPTIONS: IColorCellProps[] = [
   { id: 'a', label: 'green', color: '#00ff00' },
@@ -27,9 +28,10 @@ describe('SwatchColorPicker', () => {
 
   it('renders SwatchColorPicker correctly', () => {
     const component = renderer.create(
-      <SwatchColorPicker
+      <SwatchColorPickerBase
         colorCells={ DEFAULT_OPTIONS }
         columnCount={ 4 }
+        getStyles={ getStyles }
       />);
     let tree = component.toJSON();
     expect(tree).toMatchSnapshot();
@@ -37,18 +39,20 @@ describe('SwatchColorPicker', () => {
 
   it('Can render in full without being parented to a button', () => {
     const wrapper = mount(
-      <SwatchColorPicker
+      <SwatchColorPickerBase
         colorCells={ DEFAULT_OPTIONS }
         columnCount={ 4 }
+        getStyles={ getStyles }
       />);
     expect(wrapper.find('.ms-swatchColorPickerBodyContainer').length).toEqual(1);
   });
 
   it('Can render the correct options when not in a menu', () => {
     const wrapper = mount(
-      <SwatchColorPicker
+      <SwatchColorPickerBase
         colorCells={ DEFAULT_OPTIONS }
         columnCount={ 4 }
+        getStyles={ getStyles }
       />);
     let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
     let container = reactContainer.getDOMNode();
@@ -73,11 +77,12 @@ describe('SwatchColorPicker', () => {
   it('Can execute a cell in non-collapsable swatch color picker ', () => {
     let eventFireCounter = 0;
     const wrapper = mount(
-      <SwatchColorPicker
+      <SwatchColorPickerBase
         colorCells={ [{ id: 'a', label: 'green', color: '#00ff00' }] }
         // tslint:disable-next-line:jsx-no-lambda
         onColorChanged={ (color) => eventFireCounter++ }
         columnCount={ 4 }
+        getStyles={ getStyles }
       />);
     let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
     let container = reactContainer.getDOMNode();
@@ -93,11 +98,12 @@ describe('SwatchColorPicker', () => {
   it('Can fire the hover event on a cell in non-collapsable swatch color picker ', () => {
     let eventFireCounter = 0;
     const wrapper = mount(
-      <SwatchColorPicker
+      <SwatchColorPickerBase
         colorCells={ [{ id: 'a', label: 'green', color: '#00ff00' }] }
         // tslint:disable-next-line:jsx-no-lambda
         onCellHovered={ (color) => eventFireCounter++ }
         columnCount={ 4 }
+        getStyles={ getStyles }
       />);
     let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
     let container = reactContainer.getDOMNode();
@@ -113,11 +119,12 @@ describe('SwatchColorPicker', () => {
   it('Can fire the focus event on a cell in non-collapsable swatch color picker ', () => {
     let eventFireCounter = 0;
     const wrapper = mount(
-      <SwatchColorPicker
+      <SwatchColorPickerBase
         colorCells={ [{ id: 'a', label: 'green', color: '#00ff00' }] }
         // tslint:disable-next-line:jsx-no-lambda
         onCellFocused={ (color) => eventFireCounter++ }
         columnCount={ 4 }
+        getStyles={ getStyles }
       />);
     let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
     let container = reactContainer.getDOMNode();
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
index 40c01cac8d43b..26b58d029ebe3 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
@@ -1,230 +1,13 @@
 import * as React from 'react';
 import {
-  autobind,
-  BaseComponent,
-  css,
-  findIndex,
-  getId
+  IStyleFunction,
+  styled
 } from '../../Utilities';
-import {
-  ISwatchColorPicker,
-  ISwatchColorPickerProps,
-  IColorCellProps
-} from './SwatchColorPicker.types';
-import { getColorFromString } from '../../utilities/color/colors';
-import { Grid } from '../../utilities/grid/Grid';
-import { GridCell } from '../../utilities/grid/GridCell';
-import { IGridCellProps } from '../../utilities/grid/GridCell.types';
-import * as stylesImport from './SwatchColorPicker.scss';
-const styles: any = stylesImport;
-
-export interface ISwatchColorPickerState {
-  selectedIndex?: number;
-}
-
-class ColorPickerGridCell extends GridCell<IColorCellProps, IGridCellProps<IColorCellProps>> {
-}
-
-export class SwatchColorPicker extends BaseComponent<ISwatchColorPickerProps, ISwatchColorPickerState> implements ISwatchColorPicker {
-
-  public static defaultProps = {
-    cellShape: 'circle',
-    disabled: false,
-    shouldFocusCircularNavigate: true
-  };
-
-  private _id: string;
-
-  constructor(props: ISwatchColorPickerProps) {
-    super(props);
-
-    this._id = props.id || getId('swatchColorPicker');
-
-    let selectedIndex: number | undefined;
-    if (props.selectedId) {
-      selectedIndex = this._getSelectedIndex(props.colorCells, props.selectedId);
-    }
-
-    this.state = {
-      selectedIndex
-    };
-  }
-
-  public componentWillReceiveProps(newProps: ISwatchColorPickerProps) {
-    let newSelectedIndex;
-
-    if (newProps.selectedId) {
-      newSelectedIndex = this._getSelectedIndex(newProps.colorCells, newProps.selectedId);
-    }
-
-    if (newSelectedIndex !== this.state.selectedIndex) {
-      this.setState({
-        selectedIndex: newSelectedIndex
-      });
-    }
-  }
-
-  public render() {
-    let {
-      colorCells,
-      columnCount,
-      positionInSet,
-      setSize,
-      shouldFocusCircularNavigate,
-      className,
-      doNotContainWithinFocusZone
-    } = this.props;
-
-    if (colorCells.length < 1 || columnCount < 1) {
-      return null;
-    }
-
-    return (
-      <Grid
-        items={ colorCells.map((item, index) => { return { ...item, index }; }) }
-        columnCount={ columnCount }
-        onRenderItem={ this._renderOption }
-        positionInSet={ positionInSet && positionInSet }
-        setSize={ setSize && setSize }
-        shouldFocusCircularNavigate={ shouldFocusCircularNavigate }
-        doNotContainWithinFocusZone={ doNotContainWithinFocusZone }
-        onBlur={ this._onSwatchColorPickerBlur }
-        containerClassName={ css('ms-swatchColorPickerBodyContainer', styles.swatchColorPickerContainer, className) }
-      />);
-  }
-
-  /**
-   * When the whole swatchColorPicker is blurred,
-   * make sure to clear the pending focused stated
-   */
-  @autobind
-  private _onSwatchColorPickerBlur() {
-    if (this.props.onCellFocused) {
-      this.props.onCellFocused();
-    }
-  }
-
-  /**
-   * Get the selected item's index
-   * @param items - The items to search
-   * @param selectedId - The selected item's id to find
-   * @returns {number} - The index of the selected item's id, -1 if there was no match
-   */
-  private _getSelectedIndex(items: IColorCellProps[], selectedId: string): number | undefined {
-    let selectedIndex = findIndex(items, (item => (item.id === selectedId)));
-    return selectedIndex >= 0 ? selectedIndex : undefined;
-  }
-
-  /**
-   * Render a color cell
-   * @param item - The item to render
-   * @returns {JSX.Element} - Element representing the item
-   */
-  @autobind
-  private _renderOption(item: IColorCellProps): JSX.Element {
-    let id = this._id;
-
-    return (
-      <ColorPickerGridCell
-        item={ item }
-        id={ id }
-        key={ id + item.id }
-        disabled={ this.props.disabled }
-        className={ styles.cell }
-        onClick={ this._onCellClick }
-        onHover={ this._onGridCellHovered }
-        onFocus={ this._onGridCellFocused }
-        onRenderItem={ this._onRenderColorOption }
-        role={ 'gridcell' }
-        selected={ this.state.selectedIndex !== undefined && (this.state.selectedIndex === item.index) }
-        cellIsSelectedStyle={ ['is-selected ' + styles.cellIsSelected] }
-        cellDisabledStyle={ ['is-disabled ' + styles.disabled] }
-        label={ item.label }
-      />
-    );
-  }
-
-  /**
-   * Callback passed to the GridCell class that will trigger the onCellHovered callback of the SwatchColorPicker
-   */
-  @autobind
-  private _onGridCellHovered(item?: IColorCellProps): void {
-    if (this.props && this.props.onCellHovered) {
-      if (item) {
-        this.props.onCellHovered(item.id, item.color);
-      } else {
-        this.props.onCellHovered();
-      }
-    }
-  }
-
-  /**
-   * Callback passed to the GridCell class that will trigger the onCellFocus callback of the SwatchColorPicker
-   */
-  @autobind
-  private _onGridCellFocused(item?: IColorCellProps): void {
-    if (this.props && this.props.onCellFocused) {
-      if (item) {
-        this.props.onCellFocused(item.id, item.color);
-      } else {
-        this.props.onCellFocused();
-      }
-    }
-  }
-
-  /**
-   * Render the core of a color cell
-   * @returns {JSX.Element} - Element representing the core of the item
-   */
-  @autobind
-  private _onRenderColorOption(colorOption: IColorCellProps): JSX.Element {
-    // Build an SVG for the cell with the given shape and color properties
-    return (
-      <svg className={ css(styles.svg, this.props.cellShape, this.props.cellShape === 'circle' ? styles.circle : '', this._getWhiteCellStyle(colorOption.color)) } viewBox='0 0 20 20' fill={ getColorFromString(colorOption.color as string)!.str } >
-        {
-          this.props.cellShape === 'circle' ?
-            <circle cx='50%' cy='50%' r='50%' /> :
-            <rect width='100%' height='100%' />
-        }
-      </svg>
-    );
-  }
-
-  /**
-   * Handle the click on a cell
-   * @param item - The cell that the click was fired against
-   */
-  @autobind
-  private _onCellClick(item: IColorCellProps) {
-    if (this.props.disabled) {
-      return;
-    }
-
-    let index = item.index as number;
-
-    // If we have a valid index and it is not already
-    // selected, select it
-    if (index >= 0 && index !== this.state.selectedIndex) {
-      if (this.props.onColorChanged) {
-        this.props.onColorChanged(item.id, item.color);
-      }
-
-      this.setState({
-        selectedIndex: index
-      });
-    }
-  }
-
-  /**
-   * Get the white color cell style
-   * @param inputColor - The color of the current cell
-   * @returns - The White color cell style if the current style is white, empty otherwise
-   */
-  private _getWhiteCellStyle(inputColor: string | undefined): string {
-    if (inputColor || inputColor!.toLocaleLowerCase() !== '#ffffff') {
-      return '';
-    } else {
-      return styles.whiteColorCell;
-    }
-  }
-}
\ No newline at end of file
+import { SwatchColorPickerBase } from './SwatchColorPicker.base';
+import { ISwatchColorPickerProps } from './SwatchColorPicker.types';
+import { getStyles } from './SwatchColorPicker.styles';
+
+export const SwatchColorPicker = styled(
+  SwatchColorPickerBase,
+  getStyles
+);
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts
index b9991f049205c..72539ea73f9ac 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts
@@ -1,3 +1,6 @@
+import { IStyle, ITheme } from '../../Styling';
+import { IStyleFunction } from '../../Utilities';
+import { IColorCellProps } from './ColorPickerGridCell.types';
 export interface ISwatchColorPicker { }
 
 export interface ISwatchColorPickerProps {
@@ -82,30 +85,39 @@ export interface ISwatchColorPickerProps {
    * If false contain the grid inside of a FocusZone.
    */
   doNotContainWithinFocusZone?: boolean;
-}
-
-export interface IColorCellProps {
 
   /**
-   * Arbitrary unique string associated with this option
+   * Theme to apply to the component.
    */
-  id: string;
+  theme?: ITheme;
 
   /**
-   * The label for this item.
-   * Visible text if this item is a header,
-   * tooltip if is this item is normal
+   * Optional styles for the component.
    */
-  label?: string;
+  getStyles?: IStyleFunction<ISwatchColorPickerStyleProps, ISwatchColorPickerStyles>;
+}
 
+/**
+ * Properties required to build the styles for the color picker component.
+ */
+export interface ISwatchColorPickerStyleProps {
   /**
-   * The CSS-compatible string to describe the color
+   * Theme to apply to the container
    */
-  color?: string;
+  theme: ITheme;
 
   /**
-   * Index for this option
+   * Custom className to apply to the container.
    */
-  index?: number;
+  className?: string;
+}
 
+/**
+ * Styles for the Color Picker Component.
+ */
+export interface ISwatchColorPickerStyles {
+  /**
+   * Style applied to the container of the swatchColorPicker
+   */
+  root: IStyle;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
index 8545385d5752b..301df02c3f14d 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
@@ -4,7 +4,14 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
 <div
   aria-describedby={undefined}
   aria-labelledby={undefined}
-  className="ms-FocusZone ms-swatchColorPickerBodyContainer"
+  className=
+      ms-FocusZone
+      ms-swatchColorPickerBodyContainer
+      {
+        clear: both;
+        display: block;
+        min-width: 180px;
+      }
   data-focuszone-id="FocusZone3"
   onBlur={[Function]}
   onFocus={[Function]}
@@ -50,6 +57,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   -moz-osx-font-smoothing: grayscale;
                   -webkit-font-smoothing: antialiased;
                   background-color: transparent;
+                  background: transparent;
                   border-radius: 0px;
                   border: 1px solid transparent;
                   box-sizing: border-box;
@@ -61,10 +69,11 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   font-weight: 400;
                   height: 40px;
                   outline: transparent;
-                  padding-bottom: 0;
-                  padding-left: 4px;
-                  padding-right: 4px;
-                  padding-top: 0;
+                  overflow: visible;
+                  padding-bottom: 0px;
+                  padding-left: 0px;
+                  padding-right: 0px;
+                  padding-top: 0px;
                   position: relative;
                   text-align: center;
                   text-decoration: none;
@@ -85,18 +94,81 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
-                &:hover {
-                  color: #0078d7;
+                @media screen and (-ms-high-contrast: active){& {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus, .ms-Fabric.is-focusVisible &:focus::after {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:hover $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: none;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:active $svg {
+                  border-color: #969696;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
                 }
-                &:hover .ms-Button-icon {
+                & $svg {
+                  border-radius: 100%;
+                }
+                &:hover {
                   color: #0078d7;
                 }
                 &:active {
                   color: #000000;
                 }
-                &:active .ms-Button-icon {
-                  color: #004578;
-                }
             data-index={undefined}
             data-is-focusable={true}
             disabled={undefined}
@@ -121,7 +193,17 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   }
             >
               <svg
-                className="circle"
+                className=
+
+                    {
+                      box-sizing: content-box;
+                      height: 20px;
+                      padding-bottom: 4px;
+                      padding-left: 4px;
+                      padding-right: 4px;
+                      padding-top: 4px;
+                      width: 20px;
+                    }
                 fill="#00ff00"
                 viewBox="0 0 20 20"
               >
@@ -156,6 +238,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   -moz-osx-font-smoothing: grayscale;
                   -webkit-font-smoothing: antialiased;
                   background-color: transparent;
+                  background: transparent;
                   border-radius: 0px;
                   border: 1px solid transparent;
                   box-sizing: border-box;
@@ -167,10 +250,11 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   font-weight: 400;
                   height: 40px;
                   outline: transparent;
-                  padding-bottom: 0;
-                  padding-left: 4px;
-                  padding-right: 4px;
-                  padding-top: 0;
+                  overflow: visible;
+                  padding-bottom: 0px;
+                  padding-left: 0px;
+                  padding-right: 0px;
+                  padding-top: 0px;
                   position: relative;
                   text-align: center;
                   text-decoration: none;
@@ -191,18 +275,81 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
-                &:hover {
-                  color: #0078d7;
+                @media screen and (-ms-high-contrast: active){& {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus, .ms-Fabric.is-focusVisible &:focus::after {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:hover $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: none;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:active $svg {
+                  border-color: #969696;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                & $svg {
+                  border-radius: 100%;
                 }
-                &:hover .ms-Button-icon {
+                &:hover {
                   color: #0078d7;
                 }
                 &:active {
                   color: #000000;
                 }
-                &:active .ms-Button-icon {
-                  color: #004578;
-                }
             data-index={undefined}
             data-is-focusable={true}
             disabled={undefined}
@@ -227,7 +374,17 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   }
             >
               <svg
-                className="circle"
+                className=
+
+                    {
+                      box-sizing: content-box;
+                      height: 20px;
+                      padding-bottom: 4px;
+                      padding-left: 4px;
+                      padding-right: 4px;
+                      padding-top: 4px;
+                      width: 20px;
+                    }
                 fill="#ffa500"
                 viewBox="0 0 20 20"
               >
@@ -262,6 +419,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   -moz-osx-font-smoothing: grayscale;
                   -webkit-font-smoothing: antialiased;
                   background-color: transparent;
+                  background: transparent;
                   border-radius: 0px;
                   border: 1px solid transparent;
                   box-sizing: border-box;
@@ -273,10 +431,11 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   font-weight: 400;
                   height: 40px;
                   outline: transparent;
-                  padding-bottom: 0;
-                  padding-left: 4px;
-                  padding-right: 4px;
-                  padding-top: 0;
+                  overflow: visible;
+                  padding-bottom: 0px;
+                  padding-left: 0px;
+                  padding-right: 0px;
+                  padding-top: 0px;
                   position: relative;
                   text-align: center;
                   text-decoration: none;
@@ -297,18 +456,81 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
-                &:hover {
-                  color: #0078d7;
+                @media screen and (-ms-high-contrast: active){& {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus, .ms-Fabric.is-focusVisible &:focus::after {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:hover $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: none;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:active $svg {
+                  border-color: #969696;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                & $svg {
+                  border-radius: 100%;
                 }
-                &:hover .ms-Button-icon {
+                &:hover {
                   color: #0078d7;
                 }
                 &:active {
                   color: #000000;
                 }
-                &:active .ms-Button-icon {
-                  color: #004578;
-                }
             data-index={undefined}
             data-is-focusable={true}
             disabled={undefined}
@@ -333,7 +555,17 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   }
             >
               <svg
-                className="circle"
+                className=
+
+                    {
+                      box-sizing: content-box;
+                      height: 20px;
+                      padding-bottom: 4px;
+                      padding-left: 4px;
+                      padding-right: 4px;
+                      padding-top: 4px;
+                      width: 20px;
+                    }
                 fill="#0000ff"
                 viewBox="0 0 20 20"
               >
@@ -368,6 +600,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   -moz-osx-font-smoothing: grayscale;
                   -webkit-font-smoothing: antialiased;
                   background-color: transparent;
+                  background: transparent;
                   border-radius: 0px;
                   border: 1px solid transparent;
                   box-sizing: border-box;
@@ -379,10 +612,11 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   font-weight: 400;
                   height: 40px;
                   outline: transparent;
-                  padding-bottom: 0;
-                  padding-left: 4px;
-                  padding-right: 4px;
-                  padding-top: 0;
+                  overflow: visible;
+                  padding-bottom: 0px;
+                  padding-left: 0px;
+                  padding-right: 0px;
+                  padding-top: 0px;
                   position: relative;
                   text-align: center;
                   text-decoration: none;
@@ -403,18 +637,81 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
-                &:hover {
-                  color: #0078d7;
+                @media screen and (-ms-high-contrast: active){& {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus, .ms-Fabric.is-focusVisible &:focus::after {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:hover $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: none;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:active $svg {
+                  border-color: #969696;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
                 }
-                &:hover .ms-Button-icon {
+                & $svg {
+                  border-radius: 100%;
+                }
+                &:hover {
                   color: #0078d7;
                 }
                 &:active {
                   color: #000000;
                 }
-                &:active .ms-Button-icon {
-                  color: #004578;
-                }
             data-index={undefined}
             data-is-focusable={true}
             disabled={undefined}
@@ -439,7 +736,17 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   }
             >
               <svg
-                className="circle"
+                className=
+
+                    {
+                      box-sizing: content-box;
+                      height: 20px;
+                      padding-bottom: 4px;
+                      padding-left: 4px;
+                      padding-right: 4px;
+                      padding-top: 4px;
+                      width: 20px;
+                    }
                 fill="#ff0000"
                 viewBox="0 0 20 20"
               >
@@ -478,6 +785,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   -moz-osx-font-smoothing: grayscale;
                   -webkit-font-smoothing: antialiased;
                   background-color: transparent;
+                  background: transparent;
                   border-radius: 0px;
                   border: 1px solid transparent;
                   box-sizing: border-box;
@@ -489,10 +797,11 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   font-weight: 400;
                   height: 40px;
                   outline: transparent;
-                  padding-bottom: 0;
-                  padding-left: 4px;
-                  padding-right: 4px;
-                  padding-top: 0;
+                  overflow: visible;
+                  padding-bottom: 0px;
+                  padding-left: 0px;
+                  padding-right: 0px;
+                  padding-top: 0px;
                   position: relative;
                   text-align: center;
                   text-decoration: none;
@@ -513,18 +822,81 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
-                &:hover {
-                  color: #0078d7;
+                @media screen and (-ms-high-contrast: active){& {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus, .ms-Fabric.is-focusVisible &:focus::after {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:hover $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: none;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:active $svg {
+                  border-color: #969696;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                & $svg {
+                  border-radius: 100%;
                 }
-                &:hover .ms-Button-icon {
+                &:hover {
                   color: #0078d7;
                 }
                 &:active {
                   color: #000000;
                 }
-                &:active .ms-Button-icon {
-                  color: #004578;
-                }
             data-index={undefined}
             data-is-focusable={true}
             disabled={undefined}
@@ -549,7 +921,17 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   }
             >
               <svg
-                className="circle"
+                className=
+
+                    {
+                      box-sizing: content-box;
+                      height: 20px;
+                      padding-bottom: 4px;
+                      padding-left: 4px;
+                      padding-right: 4px;
+                      padding-top: 4px;
+                      width: 20px;
+                    }
                 fill="green"
                 viewBox="0 0 20 20"
               >
@@ -584,6 +966,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   -moz-osx-font-smoothing: grayscale;
                   -webkit-font-smoothing: antialiased;
                   background-color: transparent;
+                  background: transparent;
                   border-radius: 0px;
                   border: 1px solid transparent;
                   box-sizing: border-box;
@@ -595,10 +978,11 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   font-weight: 400;
                   height: 40px;
                   outline: transparent;
-                  padding-bottom: 0;
-                  padding-left: 4px;
-                  padding-right: 4px;
-                  padding-top: 0;
+                  overflow: visible;
+                  padding-bottom: 0px;
+                  padding-left: 0px;
+                  padding-right: 0px;
+                  padding-top: 0px;
                   position: relative;
                   text-align: center;
                   text-decoration: none;
@@ -619,18 +1003,81 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
-                &:hover {
-                  color: #0078d7;
+                @media screen and (-ms-high-contrast: active){& {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus, .ms-Fabric.is-focusVisible &:focus::after {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:hover $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: none;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:active $svg {
+                  border-color: #969696;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                & $svg {
+                  border-radius: 100%;
                 }
-                &:hover .ms-Button-icon {
+                &:hover {
                   color: #0078d7;
                 }
                 &:active {
                   color: #000000;
                 }
-                &:active .ms-Button-icon {
-                  color: #004578;
-                }
             data-index={undefined}
             data-is-focusable={true}
             disabled={undefined}
@@ -655,7 +1102,17 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   }
             >
               <svg
-                className="circle"
+                className=
+
+                    {
+                      box-sizing: content-box;
+                      height: 20px;
+                      padding-bottom: 4px;
+                      padding-left: 4px;
+                      padding-right: 4px;
+                      padding-top: 4px;
+                      width: 20px;
+                    }
                 fill="orange"
                 viewBox="0 0 20 20"
               >
@@ -690,6 +1147,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   -moz-osx-font-smoothing: grayscale;
                   -webkit-font-smoothing: antialiased;
                   background-color: transparent;
+                  background: transparent;
                   border-radius: 0px;
                   border: 1px solid transparent;
                   box-sizing: border-box;
@@ -701,10 +1159,11 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   font-weight: 400;
                   height: 40px;
                   outline: transparent;
-                  padding-bottom: 0;
-                  padding-left: 4px;
-                  padding-right: 4px;
-                  padding-top: 0;
+                  overflow: visible;
+                  padding-bottom: 0px;
+                  padding-left: 0px;
+                  padding-right: 0px;
+                  padding-top: 0px;
                   position: relative;
                   text-align: center;
                   text-decoration: none;
@@ -725,18 +1184,81 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
-                &:hover {
-                  color: #0078d7;
+                @media screen and (-ms-high-contrast: active){& {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus, .ms-Fabric.is-focusVisible &:focus::after {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:hover $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: none;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:active $svg {
+                  border-color: #969696;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
                 }
-                &:hover .ms-Button-icon {
+                & $svg {
+                  border-radius: 100%;
+                }
+                &:hover {
                   color: #0078d7;
                 }
                 &:active {
                   color: #000000;
                 }
-                &:active .ms-Button-icon {
-                  color: #004578;
-                }
             data-index={undefined}
             data-is-focusable={true}
             disabled={undefined}
@@ -761,7 +1283,17 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   }
             >
               <svg
-                className="circle"
+                className=
+
+                    {
+                      box-sizing: content-box;
+                      height: 20px;
+                      padding-bottom: 4px;
+                      padding-left: 4px;
+                      padding-right: 4px;
+                      padding-top: 4px;
+                      width: 20px;
+                    }
                 fill="blue"
                 viewBox="0 0 20 20"
               >
@@ -796,6 +1328,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   -moz-osx-font-smoothing: grayscale;
                   -webkit-font-smoothing: antialiased;
                   background-color: transparent;
+                  background: transparent;
                   border-radius: 0px;
                   border: 1px solid transparent;
                   box-sizing: border-box;
@@ -807,10 +1340,11 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   font-weight: 400;
                   height: 40px;
                   outline: transparent;
-                  padding-bottom: 0;
-                  padding-left: 4px;
-                  padding-right: 4px;
-                  padding-top: 0;
+                  overflow: visible;
+                  padding-bottom: 0px;
+                  padding-left: 0px;
+                  padding-right: 0px;
+                  padding-top: 0px;
                   position: relative;
                   text-align: center;
                   text-decoration: none;
@@ -831,18 +1365,81 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
-                &:hover {
-                  color: #0078d7;
+                @media screen and (-ms-high-contrast: active){& {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus, .ms-Fabric.is-focusVisible &:focus::after {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:hover $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: none;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:active $svg {
+                  border-color: #969696;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                & $svg {
+                  border-radius: 100%;
                 }
-                &:hover .ms-Button-icon {
+                &:hover {
                   color: #0078d7;
                 }
                 &:active {
                   color: #000000;
                 }
-                &:active .ms-Button-icon {
-                  color: #004578;
-                }
             data-index={undefined}
             data-is-focusable={true}
             disabled={undefined}
@@ -867,7 +1464,17 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   }
             >
               <svg
-                className="circle"
+                className=
+
+                    {
+                      box-sizing: content-box;
+                      height: 20px;
+                      padding-bottom: 4px;
+                      padding-left: 4px;
+                      padding-right: 4px;
+                      padding-top: 4px;
+                      width: 20px;
+                    }
                 fill="red"
                 viewBox="0 0 20 20"
               >
@@ -906,6 +1513,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   -moz-osx-font-smoothing: grayscale;
                   -webkit-font-smoothing: antialiased;
                   background-color: transparent;
+                  background: transparent;
                   border-radius: 0px;
                   border: 1px solid transparent;
                   box-sizing: border-box;
@@ -917,10 +1525,11 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   font-weight: 400;
                   height: 40px;
                   outline: transparent;
-                  padding-bottom: 0;
-                  padding-left: 4px;
-                  padding-right: 4px;
-                  padding-top: 0;
+                  overflow: visible;
+                  padding-bottom: 0px;
+                  padding-left: 0px;
+                  padding-right: 0px;
+                  padding-top: 0px;
                   position: relative;
                   text-align: center;
                   text-decoration: none;
@@ -941,18 +1550,81 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
-                &:hover {
-                  color: #0078d7;
+                @media screen and (-ms-high-contrast: active){& {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus, .ms-Fabric.is-focusVisible &:focus::after {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:hover $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: none;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:active $svg {
+                  border-color: #969696;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                & $svg {
+                  border-radius: 100%;
                 }
-                &:hover .ms-Button-icon {
+                &:hover {
                   color: #0078d7;
                 }
                 &:active {
                   color: #000000;
                 }
-                &:active .ms-Button-icon {
-                  color: #004578;
-                }
             data-index={undefined}
             data-is-focusable={true}
             disabled={undefined}
@@ -977,7 +1649,17 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   }
             >
               <svg
-                className="circle"
+                className=
+
+                    {
+                      box-sizing: content-box;
+                      height: 20px;
+                      padding-bottom: 4px;
+                      padding-left: 4px;
+                      padding-right: 4px;
+                      padding-top: 4px;
+                      width: 20px;
+                    }
                 fill="black"
                 viewBox="0 0 20 20"
               >
@@ -1012,6 +1694,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   -moz-osx-font-smoothing: grayscale;
                   -webkit-font-smoothing: antialiased;
                   background-color: transparent;
+                  background: transparent;
                   border-radius: 0px;
                   border: 1px solid transparent;
                   box-sizing: border-box;
@@ -1023,10 +1706,11 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   font-weight: 400;
                   height: 40px;
                   outline: transparent;
-                  padding-bottom: 0;
-                  padding-left: 4px;
-                  padding-right: 4px;
-                  padding-top: 0;
+                  overflow: visible;
+                  padding-bottom: 0px;
+                  padding-left: 0px;
+                  padding-right: 0px;
+                  padding-top: 0px;
                   position: relative;
                   text-align: center;
                   text-decoration: none;
@@ -1047,18 +1731,81 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
-                &:hover {
-                  color: #0078d7;
+                @media screen and (-ms-high-contrast: active){& {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus, .ms-Fabric.is-focusVisible &:focus::after {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:hover $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: none;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:active $svg {
+                  border-color: #969696;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
                 }
-                &:hover .ms-Button-icon {
+                & $svg {
+                  border-radius: 100%;
+                }
+                &:hover {
                   color: #0078d7;
                 }
                 &:active {
                   color: #000000;
                 }
-                &:active .ms-Button-icon {
-                  color: #004578;
-                }
             data-index={undefined}
             data-is-focusable={true}
             disabled={undefined}
@@ -1083,7 +1830,17 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   }
             >
               <svg
-                className="circle"
+                className=
+
+                    {
+                      box-sizing: content-box;
+                      height: 20px;
+                      padding-bottom: 4px;
+                      padding-left: 4px;
+                      padding-right: 4px;
+                      padding-top: 4px;
+                      width: 20px;
+                    }
                 fill="grey"
                 viewBox="0 0 20 20"
               >
@@ -1118,6 +1875,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   -moz-osx-font-smoothing: grayscale;
                   -webkit-font-smoothing: antialiased;
                   background-color: transparent;
+                  background: transparent;
                   border-radius: 0px;
                   border: 1px solid transparent;
                   box-sizing: border-box;
@@ -1129,10 +1887,11 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   font-weight: 400;
                   height: 40px;
                   outline: transparent;
-                  padding-bottom: 0;
-                  padding-left: 4px;
-                  padding-right: 4px;
-                  padding-top: 0;
+                  overflow: visible;
+                  padding-bottom: 0px;
+                  padding-left: 0px;
+                  padding-right: 0px;
+                  padding-top: 0px;
                   position: relative;
                   text-align: center;
                   text-decoration: none;
@@ -1153,18 +1912,81 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
-                &:hover {
-                  color: #0078d7;
+                @media screen and (-ms-high-contrast: active){& {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus, .ms-Fabric.is-focusVisible &:focus::after {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:hover $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: none;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:active $svg {
+                  border-color: #969696;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                & $svg {
+                  border-radius: 100%;
                 }
-                &:hover .ms-Button-icon {
+                &:hover {
                   color: #0078d7;
                 }
                 &:active {
                   color: #000000;
                 }
-                &:active .ms-Button-icon {
-                  color: #004578;
-                }
             data-index={undefined}
             data-is-focusable={true}
             disabled={undefined}
@@ -1189,7 +2011,17 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   }
             >
               <svg
-                className="circle"
+                className=
+
+                    {
+                      box-sizing: content-box;
+                      height: 20px;
+                      padding-bottom: 4px;
+                      padding-left: 4px;
+                      padding-right: 4px;
+                      padding-top: 4px;
+                      width: 20px;
+                    }
                 fill="purple"
                 viewBox="0 0 20 20"
               >
@@ -1224,6 +2056,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   -moz-osx-font-smoothing: grayscale;
                   -webkit-font-smoothing: antialiased;
                   background-color: transparent;
+                  background: transparent;
                   border-radius: 0px;
                   border: 1px solid transparent;
                   box-sizing: border-box;
@@ -1235,10 +2068,11 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   font-weight: 400;
                   height: 40px;
                   outline: transparent;
-                  padding-bottom: 0;
-                  padding-left: 4px;
-                  padding-right: 4px;
-                  padding-top: 0;
+                  overflow: visible;
+                  padding-bottom: 0px;
+                  padding-left: 0px;
+                  padding-right: 0px;
+                  padding-top: 0px;
                   position: relative;
                   text-align: center;
                   text-decoration: none;
@@ -1259,18 +2093,81 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
-                &:hover {
-                  color: #0078d7;
+                @media screen and (-ms-high-contrast: active){& {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus, .ms-Fabric.is-focusVisible &:focus::after {
+                  border: none;
+                }
+                .ms-Fabric.is-focusVisible &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:hover $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: none;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:focus $svg {
+                  border-color: #dadada;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                &:active $svg {
+                  border-color: #969696;
+                  border: 4px solid;
+                  box-shadow: 0 0 0 1px #969696;
+                  height: 12px;
+                  margin-bottom: 0px;
+                  margin-left: 0px;
+                  margin-right: 0px;
+                  margin-top: 0px;
+                  padding-bottom: 4px;
+                  padding-left: 4px;
+                  padding-right: 4px;
+                  padding-top: 4px;
+                  width: 12px;
+                }
+                & $svg {
+                  border-radius: 100%;
                 }
-                &:hover .ms-Button-icon {
+                &:hover {
                   color: #0078d7;
                 }
                 &:active {
                   color: #000000;
                 }
-                &:active .ms-Button-icon {
-                  color: #004578;
-                }
             data-index={undefined}
             data-is-focusable={true}
             disabled={undefined}
@@ -1295,7 +2192,17 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   }
             >
               <svg
-                className="circle"
+                className=
+
+                    {
+                      box-sizing: content-box;
+                      height: 20px;
+                      padding-bottom: 4px;
+                      padding-left: 4px;
+                      padding-right: 4px;
+                      padding-top: 4px;
+                      width: 20px;
+                    }
                 fill="yellow"
                 viewBox="0 0 20 20"
               >
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
index 9dedb95c4f399..98fb9ceafa264 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
@@ -93,4 +93,4 @@ export class SwatchColorPickerBasicExample extends React.Component<any, IBasicSw
       </div>
     );
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/index.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/index.ts
index 334f54176b3f2..765136aecbd85 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/index.ts
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/index.ts
@@ -1,2 +1,7 @@
 export * from './SwatchColorPicker';
+export * from './SwatchColorPicker.base';
 export * from './SwatchColorPicker.types';
+
+export * from './ColorPickerGridCell';
+export * from './ColorPickerGridCell.base';
+export * from './ColorPickerGridCell.types';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx b/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx
index 088a0009013c3..dbc8cb0df7472 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx
@@ -10,7 +10,6 @@ import { CommandButton } from '../../Button';
 export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P, {}> {
 
   public static defaultProps = {
-    cellShape: 'circle',
     disabled: false,
     id: getId('gridCell')
   };
@@ -27,8 +26,10 @@ export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P,
       cellDisabledStyle,
       cellIsSelectedStyle,
       index,
-      label
+      label,
+      getClassNames
     } = this.props;
+
     return (
       <CommandButton
         id={ id + '-item' + index }
@@ -49,6 +50,7 @@ export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P,
         aria-selected={ selected }
         ariaLabel={ label }
         title={ label }
+        getClassNames={ getClassNames }
       >
         { onRenderItem(item) }
       </CommandButton >
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/GridCell.types.ts b/packages/office-ui-fabric-react/src/utilities/grid/GridCell.types.ts
index 36db27462d782..1cf5b9e3c38b3 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/GridCell.types.ts
+++ b/packages/office-ui-fabric-react/src/utilities/grid/GridCell.types.ts
@@ -1,3 +1,6 @@
+import { IButtonClassNames } from '../../components/Button/BaseButton.classNames';
+import { ITheme } from '../../Styling';
+
 export interface IGridCellProps<T> {
 
   /**
@@ -71,4 +74,19 @@ export interface IGridCellProps<T> {
  * tooltip if is this item is normal
  */
   label?: string;
+
+  /**
+  * Method to provide the classnames to style a button.
+  * The default value for this prop is the getClassnames func
+  * defined in BaseButton.classnames.
+  */
+  getClassNames?: (theme: ITheme,
+    className: string,
+    variantClassName: string,
+    iconClassName: string | undefined,
+    menuIconClassName: string | undefined,
+    disabled: boolean,
+    checked: boolean,
+    expanded: boolean,
+    isSplit: boolean | undefined) => IButtonClassNames;
 }

From 7d322b1de493bd49f1a93a26bc09cdf67e574b25 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 28 Nov 2017 11:11:30 -0800
Subject: [PATCH 1074/1641] ComboBox: Updates to styling to align better with
 Dropdown (#3377)

* New rootPressed style for ComboBox

* New disabled prop for ISelectableOption

* Added disabled prop to combobox basic example

* Updated combobox styles like dropdown and contextualmenu

* Remove weird spaces

* Removed rootPressed

* Fixed weird spacing

* Revert "Removed rootPressed"

This reverts commit 256f12c82563a269b6583bd4908dcf10d083f497.

* Update semantic slot for inputBorderHovered

* Added change files

* Plural classNames

* Selector is ms-Icon instead of i tag

* updated snapshot
---
 .../combobox-polish_2017-11-13-17-42.json     | 11 +++++
 .../combobox-polish_2017-11-13-17-42.json     | 11 +++++
 .../src/common/_semanticSlots.scss            |  2 +-
 .../__snapshots__/Checkbox.test.tsx.snap      |  6 +--
 .../ComboBox/ComboBox.classNames.ts           | 16 ++++++-
 .../components/ComboBox/ComboBox.styles.ts    | 43 +++++++++++++------
 .../src/components/ComboBox/ComboBox.tsx      |  7 ++-
 .../src/components/ComboBox/ComboBox.types.ts |  6 +++
 .../__snapshots__/ComboBox.test.tsx.snap      | 28 +++++++++---
 .../examples/ComboBox.Basic.Example.tsx       |  2 +-
 .../Toggle/__snapshots__/Toggle.test.tsx.snap |  4 +-
 .../SelectableOption.types.ts                 |  6 +++
 packages/styling/src/styles/theme.ts          |  2 +-
 13 files changed, 115 insertions(+), 29 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/combobox-polish_2017-11-13-17-42.json
 create mode 100644 common/changes/office-ui-fabric-react/combobox-polish_2017-11-13-17-42.json

diff --git a/common/changes/@uifabric/styling/combobox-polish_2017-11-13-17-42.json b/common/changes/@uifabric/styling/combobox-polish_2017-11-13-17-42.json
new file mode 100644
index 0000000000000..98e8670537dab
--- /dev/null
+++ b/common/changes/@uifabric/styling/combobox-polish_2017-11-13-17-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "SemanticSlots: Updated inputBorderHovered color.",
+      "packageName": "@uifabric/styling",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/combobox-polish_2017-11-13-17-42.json b/common/changes/office-ui-fabric-react/combobox-polish_2017-11-13-17-42.json
new file mode 100644
index 0000000000000..0070b167126ad
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/combobox-polish_2017-11-13-17-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SelectableOption: New disabled prop for options. ComboBox: Updated styling per design spec, including new rootPressed prop, color updates, and className updates.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/common/_semanticSlots.scss b/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
index 969f63c0bff4f..011380b5251ef 100644
--- a/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
+++ b/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
@@ -21,7 +21,7 @@ $successBackgroundColor: "[theme:successBackground, default: rgba(186,216,10,.2)
 
 /* Input controls */
 $inputBorderColor: "[theme:inputBorder, default: #a6a6a6]";
-$inputBorderHoveredColor: "[theme:inputBorderHovered, default: #333333]";
+$inputBorderHoveredColor: "[theme:inputBorderHovered, default: #212121]";
 $inputBackgroundCheckedColor: "[theme:inputBackgroundChecked, default: #0078d7]";
 $inputBackgroundCheckedHoveredColor: "[theme:inputBackgroundCheckedHovered, default: #106ebe]";
 $inputForegroundCheckedColor: "[theme:inputForegroundChecked, default: #ffffff]";
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
index c92d8ec0aa2b9..de6ef83d6c17a 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
@@ -41,10 +41,10 @@ exports[`Checkbox renders Checkbox correctly 1`] = `
         z-index: 1;
       }
       &:hover .ms-Checkbox-checkbox {
-        border-color: #333333;
+        border-color: #212121;
       }
       &:focus .ms-Checkbox-checkbox {
-        border-color: #333333;
+        border-color: #212121;
       }
       &:hover .ms-Checkbox-text {
         color: #000000;
@@ -83,7 +83,7 @@ exports[`Checkbox renders Checkbox correctly 1`] = `
           ms-Checkbox-checkbox
           {
             align-items: center;
-            border-color: #333333;
+            border-color: #212121;
             border-style: solid;
             border-width: 1px;
             box-sizing: border-box;
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
index 19208515a4d13..e787a9b2ebf19 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
@@ -19,6 +19,7 @@ export interface IComboBoxClassNames {
 
 export interface IComboBoxOptionClassNames {
   optionText: string;
+  root: string;
 }
 
 export const getClassNames = memoizeFunction((
@@ -51,7 +52,9 @@ export const getClassNames = memoizeFunction((
       !disabled && focused && styles.rootFocused,
       !disabled && {
         selectors: {
-          ':hover': styles.rootHovered
+          ':hover': styles.rootHovered,
+          ':active': styles.rootPressed,
+          ':focus': styles.rootFocused
         }
       },
       disabled && [
@@ -97,5 +100,16 @@ export const getComboBoxOptionClassNames = memoizeFunction((
       'ms-ComboBox-optionText',
       styles.optionText
     ),
+    root: mergeStyles(
+      'ms-ComboBox-option',
+      styles.root,
+      {
+        selectors: {
+          ':hover': styles.rootHovered,
+          ':active': styles.rootPressed,
+          ':focus': styles.rootFocused
+        }
+      }
+    )
   };
 });
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index d360d832c3eb5..6f5b55b1ddd2b 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -58,12 +58,12 @@ export const getOptionStyles = memoizeFunction((
 
   const { semanticColors, palette } = theme;
 
-  const ComboBoxOptionBackgroundSelected = semanticColors.menuItemBackgroundChecked;
   const ComboBoxOptionBackgroundHovered = semanticColors.menuItemBackgroundHovered;
   const ComboBoxOptionTextColorHovered = semanticColors.bodyText;
   const ComboBoxOptionTextColorSelected = palette.black;
   const ComboBoxOptionTextColorDisabled = semanticColors.disabledText;
-  const ComboBoxOptionBackgroundDisabled = semanticColors.disabledBackground;
+  const ComboBoxOptionBackgroundDisabled = semanticColors.bodyBackground;
+  const ComboBoxOptionBorderColorFocused = palette.neutralSecondary;
 
   const optionStyles: IComboBoxOptionStyles = {
     root: [
@@ -93,18 +93,15 @@ export const getOptionStyles = memoizeFunction((
       getFocusStyle(theme),
     ],
     rootHovered: {
+      backgroundColor: ComboBoxOptionBackgroundHovered,
       color: ComboBoxOptionTextColorHovered
     },
     rootFocused: {
       backgroundColor: ComboBoxOptionBackgroundHovered
     },
-    rootPressed: {
-      backgroundColor: ComboBoxOptionBackgroundHovered,
-      color: ComboBoxOptionTextColorSelected
-    },
     rootChecked: [
       {
-        backgroundColor: ComboBoxOptionBackgroundSelected,
+        backgroundColor: ComboBoxOptionBackgroundHovered,
         color: ComboBoxOptionTextColorSelected
       },
       getFocusStyle(theme),
@@ -141,7 +138,8 @@ export const getCaretDownButtonStyles = memoizeFunction((
 ): IButtonStyles => {
   const { palette } = theme;
 
-  const caretButtonTextColor = palette.neutralDark;
+  const caretButtonTextColor = palette.neutralSecondary;
+  const caretButtonTextColorHoveredActive = palette.neutralDark;
   const caretButtonBackgroundHovered = palette.neutralQuaternaryAlt;
   const caretButtonBackgroundActive = palette.neutralTertiaryAlt;
 
@@ -161,14 +159,20 @@ export const getCaretDownButtonStyles = memoizeFunction((
           borderColor: 'ButtonText',
           color: 'ButtonText',
           MsHighContrastAdjust: 'none'
+        },
+        '.ms-Icon': {
+          fontSize: FontSizes.small
         }
       }
     },
     rootHovered: {
-      backgroundColor: caretButtonBackgroundHovered
+      backgroundColor: caretButtonBackgroundHovered,
+      color: caretButtonTextColorHoveredActive,
+      cursor: 'pointer'
     },
     rootPressed: {
-      backgroundColor: caretButtonBackgroundActive
+      backgroundColor: caretButtonBackgroundActive,
+      color: caretButtonTextColorHoveredActive
     },
     rootDisabled: getDisabledStyles(theme),
   };
@@ -185,8 +189,10 @@ export const getStyles = memoizeFunction((
 
   const ComboBoxRootBackground = semanticColors.bodyBackground;
   const ComboBoxRootTextColor = semanticColors.bodyText;
-  const ComboBoxRootBorderColor = palette.neutralTertiaryAlt;
-  const ComboBoxRootBorderColorHovered = semanticColors.inputFocusBorderAlt;
+  const ComboBoxRootBorderColor = semanticColors.inputBorder;
+  const ComboBoxRootBorderColorHovered = semanticColors.inputBorderHovered;
+  const ComboBoxRootBorderColorActive = palette.themeDark;
+  const ComboBoxRootBorderColorFocused = semanticColors.inputFocusBorderAlt;
   const ComboBoxRootColorErrored = semanticColors.errorText;
   const ComboBoxCalloutBorderColor = palette.neutralLight;
   const ComboBoxOptionHeaderTextColor = semanticColors.menuHeader;
@@ -226,6 +232,13 @@ export const getStyles = memoizeFunction((
           '.ms-Label': {
             display: 'inline-block',
             marginBottom: '8px',
+          },
+          'input': {
+            selectors: {
+              '::-ms-clear': {
+                display: 'none'
+              }
+            }
           }
         }
       }
@@ -242,8 +255,12 @@ export const getStyles = memoizeFunction((
       },
     },
 
+    rootPressed: {
+      borderColor: ComboBoxRootBorderColorActive
+    },
+
     rootFocused: {
-      borderColor: ComboBoxRootBorderColorHovered,
+      borderColor: ComboBoxRootBorderColorFocused,
       selectors: {
         [HighContrastSelector]: {
           color: 'HighlightText',
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 89c5132bc86ed..c960a74c06159 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -895,12 +895,14 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     let { onRenderOption = this._onRenderOption } = this.props;
     let id = this._id;
     let isSelected: boolean = this._isOptionSelected(item.index);
+    const rootClassNames = getComboBoxOptionClassNames(this._getCurrentOptionStyles(item)).root;
+
     return (
       <CommandButton
         id={ id + '-list' + item.index }
         key={ item.key }
         data-index={ item.index }
-        className={ 'ms-ComboBox-option' }
+        className={ rootClassNames }
         styles={ this._getCurrentOptionStyles(item) }
         checked={ isSelected }
         onClick={ this._onItemClick(item.index) }
@@ -910,6 +912,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         role='option'
         aria-selected={ isSelected ? 'true' : 'false' }
         ariaLabel={ item.text }
+        disabled={ item.disabled }
       > { <span ref={ this._resolveRef(isSelected ? '_selectedElement' : '') }>
         { onRenderOption(item, this._onRenderOption) }
       </span>
@@ -1045,7 +1048,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * Get the index of the option that is marked as selected
    * @param options - the comboBox options
    * @param selectedKey - the known selected key to find
-   * @returns {number} - the index of the selected option, -1 if not found
+   * @returns { number } - the index of the selected option, -1 if not found
    */
   private _getSelectedIndex(options: IComboBoxOption[] | undefined, selectedKey: string | number | undefined): number {
     if (options === undefined || selectedKey === undefined) {
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
index b57632970844d..10e4e80560e23 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
@@ -162,6 +162,12 @@ export interface IComboBoxStyles {
    */
   rootHovered: IStyle;
 
+  /**
+   * Styles for when the ComboBox is active. These styles are applied for all comboBoxes except when
+   * the comboBox is disabled.
+   */
+  rootPressed: IStyle;
+
   /**
    * Styles for when the ComboBox is focused. These styles are applied for all comboBoxes except when
    * the comboBox is disabled.
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
index afa5139821a7a..f525262f5e04c 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
@@ -12,7 +12,7 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
           -moz-osx-font-smoothing: grayscale;
           -webkit-font-smoothing: antialiased;
           background-color: #ffffff;
-          border-color: #c8c8c8;
+          border-color: #a6a6a6;
           border-style: solid;
           border-width: 1px;
           box-shadow: none;
@@ -42,14 +42,28 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
           display: inline-block;
           margin-bottom: 8px;
         }
+        & input::-ms-clear {
+          display: none;
+        }
         &:hover {
-          border-color: #0078d7;
+          border-color: #212121;
         }
         @media screen and (-ms-high-contrast: active){&:hover {
           -ms-high-contrast-adjust: none;
           border-color: Highlight;
           color: HighlightText;
         }
+        &:active {
+          border-color: #005a9e;
+        }
+        &:focus {
+          border-color: #0078d7;
+        }
+        @media screen and (-ms-high-contrast: active){&:focus {
+          -ms-high-contrast-adjust: none;
+          border-color: Highlight;
+          color: HighlightText;
+        }
     id="ComboBox0wrapper"
   >
     <input
@@ -115,7 +129,7 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
             border-radius: 0px;
             border: 1px solid transparent;
             box-sizing: border-box;
-            color: #212121;
+            color: #666666;
             cursor: default;
             display: inline-block;
             font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
@@ -155,13 +169,17 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
             border-color: ButtonText;
             color: ButtonText;
           }
+          & .ms-Icon {
+            font-size: 12px;
+          }
           &:hover {
             background-color: #dadada;
-            color: #004578;
+            color: #212121;
+            cursor: pointer;
           }
           &:active {
             background-color: #c8c8c8;
-            color: #0078d7;
+            color: #212121;
           }
       data-is-focusable={true}
       disabled={undefined}
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
index 3ba0d64018f5c..2712809284b8b 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
@@ -26,7 +26,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
   { key: 'G', text: 'Option g' },
   { key: 'H', text: 'Option h' },
   { key: 'I', text: 'Option i' },
-  { key: 'J', text: 'Option j' },
+  { key: 'J', text: 'Option j', disabled: true },
   ];
 
   private _fontMapping: { [key: string]: string } = {
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap
index 701e104b8f785..a2f6fc843afa9 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap
@@ -78,7 +78,7 @@ exports[`Toggle renders toggle correctly 1`] = `
             z-index: 1;
           }
           &:hover {
-            border-color: #333333;
+            border-color: #212121;
           }
       data-is-focusable={true}
       disabled={undefined}
@@ -91,7 +91,7 @@ exports[`Toggle renders toggle correctly 1`] = `
         className=
             ms-Toggle-thumb
             {
-              background-color: #333333;
+              background-color: #212121;
               border-color: transparent;
               border-radius: .5em;
               border-style: solid;
diff --git a/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableOption.types.ts b/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableOption.types.ts
index c58caa9c512ce..e7794e4c2d152 100644
--- a/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableOption.types.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableOption.types.ts
@@ -26,6 +26,12 @@ export interface ISelectableOption {
 
   /** If option is selected. */
   selected?: boolean;
+
+  /**
+   * Whether the option is disabled
+   * @defaultvalue false
+   */
+  disabled?: boolean;
 }
 
 export enum SelectableOptionMenuItemType {
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index 73ba7d0734fdc..6407a8955e380 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -103,7 +103,7 @@ function _makeSemanticColorsFromPalette(p: IPalette, isInverted: boolean): ISema
     successBackground: !isInverted ? 'rgba(186, 216, 10, .2)' : 'rgba(186, 216, 10, .4)',
 
     inputBorder: p.neutralTertiary,
-    inputBorderHovered: p.neutralPrimary,
+    inputBorderHovered: p.neutralDark,
     inputBackgroundChecked: p.themePrimary,
     inputBackgroundCheckedHovered: p.themeDarkAlt,
     inputForegroundChecked: p.white,

From a6ef94b3edb7679d7659ec0d51e199139102d28c Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 28 Nov 2017 23:04:38 -0800
Subject: [PATCH 1075/1641] Update: TypeScript 2.6.2, react typings (#3475)

* update ts.

* Updating merge-styles issue.

* updates.

* Adding change files, updating packages with latest 15.x typings for react.
---
 apps/fabric-website/package.json              |   4 +-
 apps/test-bundle-button/package.json          |   4 +-
 apps/todo-app/package.json                    |   4 +-
 apps/vr-tests/package.json                    |   4 +-
 .../experiments/ts_2017-11-29-03-51.json      |  11 +
 .../merge-styles/ts_2017-11-29-03-51.json     |  11 +
 .../ts_2017-11-29-03-51.json                  |  11 +
 common/config/rush/npm-shrinkwrap.json        | 258 ++++++++++--------
 packages/example-app-base/package.json        |   4 +-
 packages/experiments/package.json             |   4 +-
 .../components/CommandBar/CommandBar.base.tsx |   9 -
 .../CommandBar/CommandBar.styles.ts           |  10 +-
 .../src/components/CommandBar/CommandBar.tsx  |   7 +-
 .../components/CommandBar/CommandBar.types.ts |   2 +-
 .../__snapshots__/CommandBar.test.tsx.snap    |   9 +-
 .../src/components/Form/Form.test.tsx         |   5 +-
 .../BaseSelectedItemsList.tsx                 |   8 -
 .../src/components/TilesList/TilesList.tsx    |   4 -
 packages/experiments/tsconfig.json            |   1 +
 packages/experiments/tslint.json              |  22 +-
 packages/merge-styles/src/Stylesheet.ts       |   1 -
 packages/office-ui-fabric-react/package.json  |   4 +-
 .../src/components/Image/Image.tsx            |   4 +-
 packages/office-ui-fabric-react/tsconfig.json |   1 +
 packages/styling/package.json                 |   2 +-
 packages/utilities/package.json               |   4 +-
 scripts/package.json                          |   2 +-
 27 files changed, 208 insertions(+), 202 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/ts_2017-11-29-03-51.json
 create mode 100644 common/changes/@uifabric/merge-styles/ts_2017-11-29-03-51.json
 create mode 100644 common/changes/office-ui-fabric-react/ts_2017-11-29-03-51.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 1d1f225afe993..4a1f6b30bf4e0 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -26,8 +26,8 @@
     "@types/prop-types": "15.5.1",
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
-    "@types/react": "15.0.38",
-    "@types/react-dom": "15.5.1",
+    "@types/react": "15.6.7",
+    "@types/react-dom": "15.5.6",
     "@types/webpack-env": "1.13.0",
     "enzyme": "^2.9.1",
     "es6-promise": "^4.1.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 19eb8f513cd32..745a8f98da859 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -16,8 +16,8 @@
     "start": "node ../../scripts/start.js"
   },
   "devDependencies": {
-    "@types/react": "15.0.38",
-    "@types/react-dom": "15.5.1",
+    "@types/react": "15.6.7",
+    "@types/react-dom": "15.5.6",
     "@types/webpack-env": "1.13.0",
     "@types/prop-types": "15.5.1",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 7a3b360957cd9..ca9faabd0b6e1 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -13,8 +13,8 @@
     "@types/enzyme": "2.8.8",
     "@types/es6-promise": "^0.0.32",
     "@types/mocha": "2.2.39",
-    "@types/react": "15.0.38",
-    "@types/react-dom": "15.5.1",
+    "@types/react": "15.6.7",
+    "@types/react-dom": "15.5.6",
     "@types/webpack-env": "1.13.0",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 6a79933f44fd4..6df0287776539 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -13,8 +13,8 @@
   "devDependencies": {
     "@storybook/addon-options": "=3.2.3",
     "@storybook/react": "^3.2.3",
-    "@types/react": "15.0.38",
-    "@types/react-dom": "15.5.1",
+    "@types/react": "15.6.7",
+    "@types/react-dom": "15.5.6",
     "@types/storybook__react": "=3.0.5",
     "css-loader": "=0.27.3",
     "file-loader": "=0.11.1",
diff --git a/common/changes/@uifabric/experiments/ts_2017-11-29-03-51.json b/common/changes/@uifabric/experiments/ts_2017-11-29-03-51.json
new file mode 100644
index 0000000000000..c25162fa04393
--- /dev/null
+++ b/common/changes/@uifabric/experiments/ts_2017-11-29-03-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Updating TypeScript to 2.6.2.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/ts_2017-11-29-03-51.json b/common/changes/@uifabric/merge-styles/ts_2017-11-29-03-51.json
new file mode 100644
index 0000000000000..f124702da1a46
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/ts_2017-11-29-03-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "Updating TypeScript to 2.6.2.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/ts_2017-11-29-03-51.json b/common/changes/office-ui-fabric-react/ts_2017-11-29-03-51.json
new file mode 100644
index 0000000000000..c2ebb2487a31a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/ts_2017-11-29-03-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Updating TypeScript to 2.6.2.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 8ab48118d69c8..f1b11d0fbd974 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -10,12 +10,12 @@
       "integrity": "sha1-6pn2EhtKjwZbTHH4VZXbJxRJiAc="
     },
     "@microsoft/api-extractor": {
-      "version": "4.2.6",
-      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-4.2.6.tgz",
-      "integrity": "sha1-LEQcgMR1AO/lG49ICH+gNkAGC5U=",
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-4.3.0.tgz",
+      "integrity": "sha1-TmZZsh5f4dCg7DrSjiGWNYkewxY=",
       "requires": {
-        "@microsoft/node-core-library": "0.3.16",
-        "@microsoft/ts-command-line": "2.2.4",
+        "@microsoft/node-core-library": "0.3.17",
+        "@microsoft/ts-command-line": "2.2.5",
         "@types/fs-extra": "0.0.37",
         "@types/node": "6.0.88",
         "@types/z-schema": "3.16.31",
@@ -35,23 +35,23 @@
       }
     },
     "@microsoft/load-themed-styles": {
-      "version": "1.7.9",
-      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.9.tgz",
-      "integrity": "sha1-ge9rX6BqbyAb+turkx/VKUO2QBM="
+      "version": "1.7.10",
+      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.10.tgz",
+      "integrity": "sha1-h1oxaBixrl+b7bi87h3r924XBRE="
     },
     "@microsoft/loader-load-themed-styles": {
-      "version": "1.6.4",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.6.4.tgz",
-      "integrity": "sha1-9FItWFxDhxESO3uYY1YVPjkdmy8=",
+      "version": "1.6.5",
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.6.5.tgz",
+      "integrity": "sha1-KYYh5HDPFHkE/J5WLwBznjEYpLM=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.9",
+        "@microsoft/load-themed-styles": "1.7.10",
         "loader-utils": "1.1.0"
       }
     },
     "@microsoft/node-core-library": {
-      "version": "0.3.16",
-      "resolved": "https://registry.npmjs.org/@microsoft/node-core-library/-/node-core-library-0.3.16.tgz",
-      "integrity": "sha1-zvPzDA/N2fGvIItc6hXCLzd+d0U=",
+      "version": "0.3.17",
+      "resolved": "https://registry.npmjs.org/@microsoft/node-core-library/-/node-core-library-0.3.17.tgz",
+      "integrity": "sha1-WDnFUSWN6ENHhSMbM7ddLou+704=",
       "requires": {
         "@types/fs-extra": "0.0.37",
         "@types/node": "6.0.88",
@@ -69,9 +69,9 @@
       }
     },
     "@microsoft/ts-command-line": {
-      "version": "2.2.4",
-      "resolved": "https://registry.npmjs.org/@microsoft/ts-command-line/-/ts-command-line-2.2.4.tgz",
-      "integrity": "sha1-yMbdb/zeE0yt0MnVb7sRnB48KUI=",
+      "version": "2.2.5",
+      "resolved": "https://registry.npmjs.org/@microsoft/ts-command-line/-/ts-command-line-2.2.5.tgz",
+      "integrity": "sha1-e68dV3sK+PTg8tmHYOx2gOiRoxk=",
       "requires": {
         "@types/argparse": "1.0.33",
         "@types/node": "6.0.88",
@@ -88,11 +88,11 @@
     },
     "@rush-temp/build": {
       "version": "file:projects/build.tgz",
-      "integrity": "sha1-3y96yIEnJn4Lm9NoO0VFU1ek22M=",
+      "integrity": "sha1-9SzXG2f+SXp40NMFm9tc3jmL1tU=",
       "requires": {
-        "@microsoft/api-extractor": "4.2.6",
-        "@microsoft/load-themed-styles": "1.7.9",
-        "@microsoft/loader-load-themed-styles": "1.6.4",
+        "@microsoft/api-extractor": "4.3.0",
+        "@microsoft/load-themed-styles": "1.7.10",
+        "@microsoft/loader-load-themed-styles": "1.6.5",
         "autoprefixer": "7.1.6",
         "awesome-typescript-loader": "3.4.0",
         "bundlesize": "0.15.3",
@@ -119,7 +119,7 @@
         "ts-jest": "21.2.3",
         "tslint": "5.8.0",
         "tslint-microsoft-contrib": "5.0.1",
-        "typescript": "2.5.3",
+        "typescript": "2.6.2",
         "uglifyjs-webpack-plugin": "0.4.6",
         "webpack": "3.8.1",
         "webpack-bundle-analyzer": "2.9.1",
@@ -129,31 +129,31 @@
       },
       "dependencies": {
         "typescript": {
-          "version": "2.5.3",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.5.3.tgz",
-          "integrity": "sha512-ptLSQs2S4QuS6/OD1eAKG+S5G8QQtrU5RT32JULdZQtM1L3WTi34Wsu48Yndzi8xsObRAB9RPt/KhA9wlpEF6w=="
+          "version": "2.6.2",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.6.2.tgz",
+          "integrity": "sha1-PFtv1/beCRQmkCfwPAlGdY92c6Q="
         }
       }
     },
     "@rush-temp/example-app-base": {
       "version": "file:projects/example-app-base.tgz",
-      "integrity": "sha1-SzwiSZ1phwVUuI27RbEzdtUZLjY=",
+      "integrity": "sha1-8kpB3vZrOc04cnTTZ0XUgs4GYqs=",
       "requires": {
         "@types/chai": "3.4.35",
         "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
         "@types/highlight.js": "9.1.9",
         "@types/mocha": "2.2.39",
-        "@types/react": "15.0.38",
+        "@types/react": "15.6.7",
         "@types/react-addons-test-utils": "0.14.18",
-        "@types/react-dom": "15.5.1",
+        "@types/react-dom": "15.5.6",
         "@types/webpack-env": "1.13.0",
         "enzyme": "2.9.1",
         "es6-map": "0.1.5",
         "es6-promise": "4.1.1",
         "es6-weak-map": "2.0.2",
         "highlight.js": "9.12.0",
-        "office-ui-fabric-react": "5.25.0",
+        "office-ui-fabric-react": "5.26.1",
         "react": "15.6.2",
         "react-addons-test-utils": "15.6.2",
         "react-dom": "15.6.2",
@@ -162,16 +162,16 @@
     },
     "@rush-temp/experiments": {
       "version": "file:projects/experiments.tgz",
-      "integrity": "sha1-E2ZHgxTjX/UeaSKtObSUKi6ED1w=",
+      "integrity": "sha1-2voKsS/niCi4jN2uKPG0guAWaJo=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.9",
+        "@microsoft/load-themed-styles": "1.7.10",
         "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
         "@types/jest": "21.1.8",
         "@types/prop-types": "15.5.1",
-        "@types/react": "15.0.38",
+        "@types/react": "15.6.7",
         "@types/react-addons-test-utils": "0.14.18",
-        "@types/react-dom": "15.5.1",
+        "@types/react-dom": "15.5.6",
         "@types/react-test-renderer": "15.5.5",
         "@types/resemblejs": "1.3.28",
         "@types/sinon": "2.2.2",
@@ -211,17 +211,17 @@
     },
     "@rush-temp/fabric-website": {
       "version": "file:projects/fabric-website.tgz",
-      "integrity": "sha1-GHmtjI9ZGbJwo9pjpDrMMytNOK4=",
+      "integrity": "sha1-k5f0C6upMfla6RNrk5RR0RDP2IQ=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.9",
+        "@microsoft/load-themed-styles": "1.7.10",
         "@types/chai": "3.4.35",
         "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
         "@types/mocha": "2.2.39",
         "@types/node": "8.0.26",
         "@types/prop-types": "15.5.1",
-        "@types/react": "15.0.38",
-        "@types/react-dom": "15.5.1",
+        "@types/react": "15.6.7",
+        "@types/react-dom": "15.5.6",
         "@types/resemblejs": "1.3.28",
         "@types/sinon": "2.2.2",
         "@types/webpack-env": "1.13.0",
@@ -241,7 +241,7 @@
     },
     "@rush-temp/icons": {
       "version": "file:projects/icons.tgz",
-      "integrity": "sha1-YFLoYMckpwxlTTXvUhn28sLvaTc=",
+      "integrity": "sha1-VwoVsFUcskDoTbG+atTwv/OqW9E=",
       "requires": {
         "tslib": "1.8.0"
       }
@@ -277,14 +277,14 @@
     },
     "@rush-temp/office-ui-fabric-react": {
       "version": "file:projects/office-ui-fabric-react.tgz",
-      "integrity": "sha1-jPJusciwMkAnoYSpNZtlAyJV5SE=",
+      "integrity": "sha1-wfRl3XTH5Zw6NQva/Wu6Auo027U=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.9",
+        "@microsoft/load-themed-styles": "1.7.10",
         "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
         "@types/jest": "21.1.0",
         "@types/prop-types": "15.5.1",
-        "@types/react": "15.0.38",
+        "@types/react": "15.6.7",
         "@types/react-dom": "15.5.5",
         "@types/react-test-renderer": "15.5.5",
         "@types/resemblejs": "1.3.28",
@@ -316,7 +316,7 @@
           "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-15.5.5.tgz",
           "integrity": "sha512-o9mYuvKgPdyzk20DSIqEBUSGVsSb1QnWtOQoPK/ExcF70Qnhr80no4MgbrEw/2pHiZbLKOjV7mWgKYTLq6f04g==",
           "requires": {
-            "@types/react": "15.0.38"
+            "@types/react": "15.6.7"
           }
         },
         "lolex": {
@@ -350,9 +350,9 @@
     },
     "@rush-temp/ssr-tests": {
       "version": "file:projects/ssr-tests.tgz",
-      "integrity": "sha1-bCSP4QNcNAcqOJSg7PWTKG5morE=",
+      "integrity": "sha1-VW1oUDx8yuzo5zGQFmCAxXqI+CA=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.9",
+        "@microsoft/load-themed-styles": "1.7.10",
         "@types/chai": "3.4.35",
         "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
@@ -369,13 +369,13 @@
     },
     "@rush-temp/styling": {
       "version": "file:projects/styling.tgz",
-      "integrity": "sha1-66IbcFY1rUoYqiGu/3zpvbiJraY=",
+      "integrity": "sha1-Umkecm/LBaSSw+IAgCB94hsLvNo=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.9",
+        "@microsoft/load-themed-styles": "1.7.10",
         "@types/chai": "3.4.35",
         "@types/enzyme": "2.8.8",
         "@types/mocha": "2.2.39",
-        "@types/react": "15.0.38",
+        "@types/react": "15.6.7",
         "@types/webpack-env": "1.13.0",
         "es6-map": "0.1.5",
         "es6-weak-map": "2.0.2",
@@ -386,11 +386,11 @@
     },
     "@rush-temp/test-bundle-button": {
       "version": "file:projects/test-bundle-button.tgz",
-      "integrity": "sha1-LUH1FnhgbdjBXqhz7EBNb+ks4Gk=",
+      "integrity": "sha1-lS5iffFXNlrOUj31gZj76a1DkMQ=",
       "requires": {
         "@types/prop-types": "15.5.1",
-        "@types/react": "15.0.38",
-        "@types/react-dom": "15.5.1",
+        "@types/react": "15.6.7",
+        "@types/react-dom": "15.5.6",
         "@types/webpack-env": "1.13.0",
         "react": "15.6.2",
         "react-dom": "15.6.2",
@@ -399,15 +399,15 @@
     },
     "@rush-temp/todo-app": {
       "version": "file:projects/todo-app.tgz",
-      "integrity": "sha1-gTwqYJZKXWJ6kSlivz+Vj0y5mi4=",
+      "integrity": "sha1-z8dK5lcUmPp+gGZ2OAcs1t3L73w=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.9",
+        "@microsoft/load-themed-styles": "1.7.10",
         "@types/chai": "3.4.35",
         "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
         "@types/mocha": "2.2.39",
-        "@types/react": "15.0.38",
-        "@types/react-dom": "15.5.1",
+        "@types/react": "15.6.7",
+        "@types/react-dom": "15.5.6",
         "@types/webpack-env": "1.13.0",
         "es6-promise": "4.1.1",
         "immutability-helper": "2.5.1",
@@ -419,14 +419,14 @@
     },
     "@rush-temp/utilities": {
       "version": "file:projects/utilities.tgz",
-      "integrity": "sha1-ahWxuvm6UokIpgPUXsrt3g8n9tM=",
+      "integrity": "sha1-E0KaA1KnEMDyS6rOuPRmOscoiuo=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.9",
+        "@microsoft/load-themed-styles": "1.7.10",
         "@types/enzyme": "2.8.8",
         "@types/jest": "21.1.0",
         "@types/prop-types": "15.5.1",
-        "@types/react": "15.0.38",
-        "@types/react-dom": "15.5.1",
+        "@types/react": "15.6.7",
+        "@types/react-dom": "15.5.6",
         "@types/sinon": "2.2.2",
         "enzyme": "2.9.1",
         "prop-types": "15.6.0",
@@ -465,12 +465,12 @@
     },
     "@rush-temp/vr-tests": {
       "version": "file:projects/vr-tests.tgz",
-      "integrity": "sha1-r8KaHdf8UJ4y1Ur6Rp8mfV6oz7U=",
+      "integrity": "sha1-B+zUdvbzO78nDwoeV2SCInhrRSQ=",
       "requires": {
         "@storybook/addon-options": "3.2.3",
         "@storybook/react": "3.2.16",
-        "@types/react": "15.0.38",
-        "@types/react-dom": "15.5.1",
+        "@types/react": "15.6.7",
+        "@types/react-dom": "15.5.6",
         "@types/storybook__react": "3.0.5",
         "awesome-typescript-loader": "3.4.0",
         "css-loader": "0.27.3",
@@ -480,7 +480,7 @@
         "react": "15.6.2",
         "react-dom": "15.6.2",
         "screener-runner": "0.6.19",
-        "screener-storybook": "0.9.9",
+        "screener-storybook": "0.9.10",
         "storybook-readme": "3.0.6",
         "style-loader": "0.16.1",
         "tslib": "1.8.0",
@@ -679,7 +679,7 @@
         "babel-runtime": "6.26.0",
         "case-sensitive-paths-webpack-plugin": "2.1.1",
         "chalk": "2.3.0",
-        "commander": "2.12.1",
+        "commander": "2.12.2",
         "common-tags": "1.5.1",
         "configstore": "3.1.1",
         "core-js": "2.5.1",
@@ -787,7 +787,7 @@
         "qs": "6.5.1",
         "react-icons": "2.2.7",
         "react-inspector": "2.2.1",
-        "react-modal": "3.1.4",
+        "react-modal": "3.1.5",
         "react-split-pane": "0.1.71",
         "react-treebeard": "2.1.0",
         "redux": "3.7.2"
@@ -814,7 +814,7 @@
       "integrity": "sha512-KBw0ZzOQNtwVGO4egRjEpQbXMFCSevy+gRFzaLXrU64LrVVuJF0FqVIdzed0NCSP+nMALj001//dwYKV/VDlCA==",
       "requires": {
         "@types/cheerio": "0.22.6",
-        "@types/react": "15.0.38"
+        "@types/react": "15.6.7"
       }
     },
     "@types/es6-promise": {
@@ -861,24 +861,24 @@
       "integrity": "sha1-Hs9SYhKZ5luFU3Qzf7Ef0tEGb8E="
     },
     "@types/react": {
-      "version": "15.0.38",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.0.38.tgz",
-      "integrity": "sha512-CkRB27L/kMDu7K20U0V7BwYK9/kPd9Im6Jlxv2vAEolYBvQy6JrSpPJsbZXtOk4MoDUomkct8Q7PNBUSLd0fmg=="
+      "version": "15.6.7",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.6.7.tgz",
+      "integrity": "sha512-HMfRuwiTp7/MfjPOsVlvlduouJH3haDzjc0oXqZy3ZMn3OTl3i4gGgbxsqzA/u9gNyl/oKkwOrU2oVR6vG5SAw=="
     },
     "@types/react-addons-test-utils": {
       "version": "0.14.18",
       "resolved": "https://registry.npmjs.org/@types/react-addons-test-utils/-/react-addons-test-utils-0.14.18.tgz",
       "integrity": "sha1-g+EK8dvl7CU1vC3FNz17w7gv3uE=",
       "requires": {
-        "@types/react": "15.0.38"
+        "@types/react": "15.6.7"
       }
     },
     "@types/react-dom": {
-      "version": "15.5.1",
-      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-15.5.1.tgz",
-      "integrity": "sha512-4c+e/QPfvSa48YhgGOcQWoHishTo6BuJqka0Bh8qeLdnK1jS+1Nz8W/w1G17AIjtLxONYFUqmi8qyt+8p/yMFA==",
+      "version": "15.5.6",
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-15.5.6.tgz",
+      "integrity": "sha512-dP4vEDEH4rL+uUl6f//c6mjepTVdJ6Ldx3z0dZbw047T5Z+o2PZDW/Qd+I4PkTmIgk7YNAZC/TFnm3IHT5UAhw==",
       "requires": {
-        "@types/react": "15.0.38"
+        "@types/react": "15.6.7"
       }
     },
     "@types/react-test-renderer": {
@@ -886,7 +886,7 @@
       "resolved": "https://registry.npmjs.org/@types/react-test-renderer/-/react-test-renderer-15.5.5.tgz",
       "integrity": "sha512-SEt2f9Hf+Y/OGstIDrINnls6wpeZGt9xiROBFjfMxXKbqg7zYkPVB7D58Rg9TZbi2kuxatchVTdiliYLs8WK0g==",
       "requires": {
-        "@types/react": "15.0.38"
+        "@types/react": "15.6.7"
       }
     },
     "@types/resemblejs": {
@@ -904,7 +904,7 @@
       "resolved": "https://registry.npmjs.org/@types/storybook__react/-/storybook__react-3.0.5.tgz",
       "integrity": "sha512-febLx40iQWoQKVaEMpxdzkJnqncPHoRivlilc3JhHJiRuBY1Mqa1yTKcvQ5RiFAYFIuv4x+bRuSIXErk5v41Bg==",
       "requires": {
-        "@types/react": "15.0.38",
+        "@types/react": "15.6.7",
         "@types/webpack-env": "1.13.0"
       }
     },
@@ -923,7 +923,7 @@
       "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.2.0.tgz",
       "integrity": "sha512-P5kfPej/wxgR8jZt/GqnU0FqYcz+JH1iCcaaYd6p9L3opmZtu4w5duKeqs+Bc1u7K16r800EQfLgKe76rt6AuA==",
       "requires": {
-        "@uifabric/styling": "5.10.1",
+        "@uifabric/styling": "5.11.0",
         "tslib": "1.8.0"
       }
     },
@@ -936,22 +936,23 @@
       }
     },
     "@uifabric/styling": {
-      "version": "5.10.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.10.1.tgz",
-      "integrity": "sha512-zvRLjwDLhUxjxU+ymfIHZitII3Udg7uNppD4UlP5R0b2hKZeTXM4jeDZs4mC6yNdmz3EIFMPoSUJVPYK9ALsSA==",
+      "version": "5.11.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.11.0.tgz",
+      "integrity": "sha512-Yy8ZusXnMHnscu8uF8Rz/zd85/8a+q1YmyHhPx2IGqB1NgddtenxnhdLe2n0nNZUQ/GxY7sxZvGMoGxRVlLQvw==",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.9",
+        "@microsoft/load-themed-styles": "1.7.10",
         "@uifabric/merge-styles": "5.6.0",
-        "@uifabric/utilities": "5.4.0",
+        "@uifabric/utilities": "5.5.0",
         "tslib": "1.8.0"
       }
     },
     "@uifabric/utilities": {
-      "version": "5.4.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.4.0.tgz",
-      "integrity": "sha512-g5ZBMkMeUP7y2CId0NnGB2B/wLphePODiTlMlovyS8Xs2KGJ7MkSsrKHd+CXqRIKhRLV6kY8dOm+Sw3Flv2lGA==",
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.5.0.tgz",
+      "integrity": "sha512-+U5gM9s9ue1zKYXlguzOHMl/NSYNvPZre7/LLH5RLfrBYJwkddUZ5AOFDD3xRT6nwpRhb5fPSJaJldAakFVY8Q==",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.9",
+        "@microsoft/load-themed-styles": "1.7.10",
+        "@uifabric/merge-styles": "5.6.0",
         "prop-types": "15.6.0",
         "tslib": "1.8.0"
       }
@@ -3011,7 +3012,7 @@
         "axios": "0.16.2",
         "bytes": "3.0.0",
         "ci-env": "1.5.2",
-        "commander": "2.12.1",
+        "commander": "2.12.2",
         "github-build": "1.2.0",
         "glob": "7.1.2",
         "gzip-size": "4.1.0",
@@ -3502,9 +3503,9 @@
       }
     },
     "commander": {
-      "version": "2.12.1",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-2.12.1.tgz",
-      "integrity": "sha512-PCNLExLlI5HiPdaJs4pMXwOTHkSCpNQ1QJH9ykZLKtKEyKu3p9HgmH5l97vM8c0IUz6d54l+xEu2GG9yuYrFzA=="
+      "version": "2.12.2",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-2.12.2.tgz",
+      "integrity": "sha512-BFnaq5ZOGcDN7FlrtBT4xxkgIToalIIxwjxLWVJ8bGTpe1LroqMiqQXdA7ygc7CRvaYS+9zfPGFnJqFSayx+AA=="
     },
     "common-tags": {
       "version": "1.5.1",
@@ -6116,9 +6117,9 @@
       }
     },
     "interpret": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.0.4.tgz",
-      "integrity": "sha1-ggzdWIuGj/sZGoCVBtbJyPISsbA="
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.1.0.tgz",
+      "integrity": "sha1-ftGxQQxqDg94z5XTuEQMY/eLhhQ="
     },
     "invariant": {
       "version": "2.2.2",
@@ -7952,7 +7953,7 @@
         "extglob": "2.0.2",
         "fragment-cache": "0.2.1",
         "kind-of": "6.0.1",
-        "nanomatch": "1.2.5",
+        "nanomatch": "1.2.6",
         "object.pick": "1.3.0",
         "regex-not": "1.0.0",
         "snapdragon": "0.8.1",
@@ -8172,9 +8173,9 @@
       "integrity": "sha1-7XFfP+neArV6XmJS2QqWZ14fCFo="
     },
     "nanomatch": {
-      "version": "1.2.5",
-      "resolved": "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.5.tgz",
-      "integrity": "sha512-ZHJamn1utzcUvW8Bais+Kk7pobp6dKmUEKOSQ/HI2glGwOMA/GvjRRKlLyORBUrdRXnwTU/6LIBcW7jYSlutgg==",
+      "version": "1.2.6",
+      "resolved": "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.6.tgz",
+      "integrity": "sha512-WJ6XTCbvWXUFPbi/bDwKcYkCeOGUHzaJj72KbuPqGn78Ba/F5Vu26Zlo6SuMQbCIst1RGKL1zfWBCOGAlbRLAg==",
       "requires": {
         "arr-diff": "4.0.0",
         "array-unique": "0.3.2",
@@ -8450,7 +8451,7 @@
           "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0=",
           "requires": {
             "chalk": "1.1.3",
-            "commander": "2.12.1",
+            "commander": "2.12.2",
             "is-my-json-valid": "2.16.1",
             "pinkie-promise": "2.0.1"
           }
@@ -8760,15 +8761,15 @@
       "integrity": "sha1-XaNUX43wnxcsbDzXcoj02U1eB88="
     },
     "office-ui-fabric-react": {
-      "version": "5.25.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.25.0.tgz",
-      "integrity": "sha512-BPgFclNgEyqIN43FTB9U59ntZ+iyZrOfe7Hs6EMfJ2Iy8j34Znuj86EM0lsy0Zbll2McTeYnm8zawkPEuj9IpQ==",
+      "version": "5.26.1",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.26.1.tgz",
+      "integrity": "sha512-lT92VfXO8WKVvXnA8LvD2nQ2U0RAtk81+Hu9wWeac10EEEN4lXqOI+ezMtw+fdPQOHP9Xqgy/4rhstfD2WarHQ==",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.9",
+        "@microsoft/load-themed-styles": "1.7.10",
         "@uifabric/icons": "5.2.0",
         "@uifabric/merge-styles": "5.6.0",
-        "@uifabric/styling": "5.10.1",
-        "@uifabric/utilities": "5.4.0",
+        "@uifabric/styling": "5.11.0",
+        "@uifabric/utilities": "5.5.0",
         "prop-types": "15.6.0",
         "tslib": "1.8.0"
       }
@@ -11170,7 +11171,7 @@
         "async": "2.6.0",
         "babel-runtime": "6.26.0",
         "babylon": "5.8.38",
-        "commander": "2.12.1",
+        "commander": "2.12.2",
         "doctrine": "2.0.2",
         "node-dir": "0.1.17",
         "recast": "0.12.9"
@@ -11235,9 +11236,9 @@
       }
     },
     "react-modal": {
-      "version": "3.1.4",
-      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.1.4.tgz",
-      "integrity": "sha512-9i1hLwKvSPQirfAabu8Ptv9i9ohaqk6Hs0KhoJkJ001VHLQtsQCS+6p7bZrEKnE3Wa4AXyXrF5gieGndsL6IsA==",
+      "version": "3.1.5",
+      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.1.5.tgz",
+      "integrity": "sha512-EjM32L9JPVibJJgu22QySo9d+tl0POaRTmuM7LmsVkx0U+G9tl4LGLrs2DLNOQp0Oko/5nEF/Rwp/h2noucMAw==",
       "requires": {
         "exenv": "1.2.2",
         "prop-types": "15.6.0"
@@ -11447,7 +11448,7 @@
         "lodash": "4.15.0",
         "lodash-es": "4.17.4",
         "loose-envify": "1.3.1",
-        "symbol-observable": "1.0.4"
+        "symbol-observable": "1.1.0"
       }
     },
     "regenerate": {
@@ -11599,6 +11600,17 @@
         "lodash": "4.15.0"
       }
     },
+    "requestretry": {
+      "version": "1.12.2",
+      "resolved": "https://registry.npmjs.org/requestretry/-/requestretry-1.12.2.tgz",
+      "integrity": "sha512-wDYnH4imurLs5upu31WoPaOFfEu31qhFlF7KgpYbBsmBagFmreZZo8E/XpoQ3erCP5za+72t8k8QI4wlrtwVXw==",
+      "requires": {
+        "extend": "3.0.1",
+        "lodash": "4.15.0",
+        "request": "2.83.0",
+        "when": "3.7.8"
+      }
+    },
     "require-directory": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
@@ -12117,9 +12129,9 @@
       }
     },
     "screener-storybook": {
-      "version": "0.9.9",
-      "resolved": "https://registry.npmjs.org/screener-storybook/-/screener-storybook-0.9.9.tgz",
-      "integrity": "sha1-T0RGtxQAnHPFzXyu8llQbhNZ8So=",
+      "version": "0.9.10",
+      "resolved": "https://registry.npmjs.org/screener-storybook/-/screener-storybook-0.9.10.tgz",
+      "integrity": "sha1-FFYWymnkLpi87NTpArXn/xxDVog=",
       "requires": {
         "bluebird": "3.4.7",
         "colors": "1.1.2",
@@ -12132,6 +12144,7 @@
         "react": "15.6.2",
         "react-dom": "15.4.2",
         "request": "2.81.0",
+        "requestretry": "1.12.2",
         "screener-runner": "0.7.7"
       },
       "dependencies": {
@@ -12735,7 +12748,7 @@
       "integrity": "sha1-3svPh0sNHl+3LhSxZKloMEjprLM=",
       "requires": {
         "glob": "7.1.2",
-        "interpret": "1.0.4",
+        "interpret": "1.1.0",
         "rechoir": "0.6.2"
       }
     },
@@ -13310,9 +13323,9 @@
       }
     },
     "symbol-observable": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/symbol-observable/-/symbol-observable-1.0.4.tgz",
-      "integrity": "sha1-Kb9hXUqnEhvdiYsi1LP5vE4qoD0="
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/symbol-observable/-/symbol-observable-1.1.0.tgz",
+      "integrity": "sha512-dQoid9tqQ+uotGhuTKEY11X4xhyYePVnqGSoSm3OGKh2E8LZ6RPULp1uXTctk33IeERlrRJYoVSBglsL05F5Uw=="
     },
     "symbol-tree": {
       "version": "3.2.2",
@@ -13785,7 +13798,7 @@
         "babel-code-frame": "6.26.0",
         "builtin-modules": "1.1.1",
         "chalk": "2.3.0",
-        "commander": "2.12.1",
+        "commander": "2.12.2",
         "diff": "3.4.0",
         "glob": "7.1.2",
         "minimatch": "3.0.4",
@@ -14295,7 +14308,7 @@
         "async": "2.6.0",
         "enhanced-resolve": "3.4.1",
         "escope": "3.6.0",
-        "interpret": "1.0.4",
+        "interpret": "1.1.0",
         "json-loader": "0.5.7",
         "json5": "0.5.1",
         "loader-runner": "2.3.0",
@@ -14362,7 +14375,7 @@
       "requires": {
         "acorn": "5.2.1",
         "chalk": "1.1.3",
-        "commander": "2.12.1",
+        "commander": "2.12.2",
         "ejs": "2.5.7",
         "express": "4.16.2",
         "filesize": "3.5.11",
@@ -14574,6 +14587,11 @@
         }
       }
     },
+    "when": {
+      "version": "3.7.8",
+      "resolved": "https://registry.npmjs.org/when/-/when-3.7.8.tgz",
+      "integrity": "sha1-xxMLan6gRpPoQs3J56Hyqjmjn4I="
+    },
     "whet.extend": {
       "version": "0.9.9",
       "resolved": "https://registry.npmjs.org/whet.extend/-/whet.extend-0.9.9.tgz",
@@ -14905,7 +14923,7 @@
       "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-3.18.4.tgz",
       "integrity": "sha512-DUOKC/IhbkdLKKiV89gw9DUauTV8U/8yJl1sjf6MtDmzevLKOF2duNJ495S3MFVjqZarr+qNGCPbkg4mu4PpLw==",
       "requires": {
-        "commander": "2.12.1",
+        "commander": "2.12.2",
         "lodash.get": "4.4.2",
         "lodash.isequal": "4.5.0",
         "validator": "8.2.0"
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 29eac7ec3a01c..098ebb99e10fb 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -20,9 +20,9 @@
     "@types/es6-promise": "0.0.32",
     "@types/highlight.js": "9.1.9",
     "@types/mocha": "2.2.39",
-    "@types/react": "15.0.38",
+    "@types/react": "15.6.7",
     "@types/react-addons-test-utils": "0.14.18",
-    "@types/react-dom": "15.5.1",
+    "@types/react-dom": "15.5.6",
     "@types/webpack-env": "1.13.0",
     "enzyme": "^2.9.1",
     "es6-weak-map": "^2.0.2",
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 3e317ea120235..d25d3264172a4 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -19,10 +19,10 @@
   "devDependencies": {
     "@types/es6-promise": "^0.0.32",
     "@types/prop-types": "15.5.1",
-    "@types/react": "15.0.38",
+    "@types/react": "15.6.7",
     "@types/react-addons-test-utils": "0.14.18",
     "@types/react-test-renderer": "^15.5.4",
-    "@types/react-dom": "15.5.1",
+    "@types/react-dom": "15.5.6",
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/jest": "^21.1.0",
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.base.tsx b/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
index 5563a40ae69aa..c790024775960 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import {
   BaseComponent,
   css,
-  getId,
   autobind,
   customizable
 } from 'office-ui-fabric-react/lib/Utilities';
@@ -46,8 +45,6 @@ export interface ICommandBarData {
   cacheKey: string;
 }
 
-const COMMANDBAR_HEIGHT = '40px';
-
 @customizable('CommandBar', ['theme'])
 export class CommandBarBase extends BaseComponent<ICommandBarProps, {}> implements ICommandBar {
   public static defaultProps: ICommandBarProps = {
@@ -59,12 +56,6 @@ export class CommandBarBase extends BaseComponent<ICommandBarProps, {}> implemen
 
   private _overflowSet: IOverflowSet;
   private _classNames: {[key in keyof ICommandBarStyles]: string };
-  private _id: string;
-
-  constructor(props: ICommandBarProps) {
-    super(props);
-    this._id = getId('CommandBar');
-  }
 
   public render(): JSX.Element {
     const {
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.styles.ts b/packages/experiments/src/components/CommandBar/CommandBar.styles.ts
index 005857ec8c933..8ff8a63341112 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.styles.ts
+++ b/packages/experiments/src/components/CommandBar/CommandBar.styles.ts
@@ -1,14 +1,9 @@
 import { ICommandBarStyleProps, ICommandBarStyles } from './CommandBar.types';
-import {
-  ITheme,
-  getFocusStyle,
-  FontSizes
-} from 'office-ui-fabric-react';
 
 export const getStyles = (props: ICommandBarStyleProps): ICommandBarStyles => {
 
   const { className, theme, endAligned } = props;
-  const { semanticColors, palette } = theme;
+  const { palette } = theme;
 
   return ({
     root: [
@@ -18,7 +13,8 @@ export const getStyles = (props: ICommandBarStyleProps): ICommandBarStyles => {
         backgroundColor: palette.neutralLighter,
         padding: '0 16px',
         height: '40px'
-      }
+      },
+      className
     ],
     primarySet: [
       {
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.tsx b/packages/experiments/src/components/CommandBar/CommandBar.tsx
index 6e4e84f43107b..f20d6d8cba109 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBar.tsx
@@ -1,13 +1,14 @@
-import * as React from 'react';
 import { styled } from '../../Utilities';
 import {
-  ICommandBarProps
+  ICommandBarProps,
+  ICommandBarStyleProps,
+  ICommandBarStyles
 } from './CommandBar.types';
 import { CommandBarBase } from './CommandBar.base';
 import { getStyles } from './CommandBar.styles';
 
 // Create a CommandBar variant which uses these default styles and this styled subcomponent.
-export const CommandBar = styled(
+export const CommandBar = styled<ICommandBarProps, ICommandBarStyleProps, ICommandBarStyles>(
   CommandBarBase,
   getStyles
 );
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.types.ts b/packages/experiments/src/components/CommandBar/CommandBar.types.ts
index 786fa4b8b82ae..054c2e06ae945 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.types.ts
+++ b/packages/experiments/src/components/CommandBar/CommandBar.types.ts
@@ -1,6 +1,6 @@
 
 import * as React from 'react';
-import { IContextualMenuItem, IMenuItemStyles } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
 import { IButtonStyles } from 'office-ui-fabric-react/lib/Button';
 import { IIconProps } from 'office-ui-fabric-react/lib/Icon';
 import { ICommandBarData } from './CommandBar.base';
diff --git a/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap b/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
index 8223cdbe787be..75d5b04109162 100644
--- a/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
+++ b/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
@@ -10,6 +10,7 @@ exports[`CommandBar renders commands correctly 1`] = `
     <div
       className=
           ms-CommandBar
+          TestClassName
           {
             background-color: #f4f4f4;
             display: flex;
@@ -31,7 +32,7 @@ exports[`CommandBar renders commands correctly 1`] = `
               display: flex;
               flex-grow: 1;
             }
-        data-focuszone-id="FocusZone1"
+        data-focuszone-id="FocusZone0"
         onFocus={[Function]}
         onKeyDown={[Function]}
         onMouseDownCapture={[Function]}
@@ -130,7 +131,7 @@ exports[`CommandBar renders commands correctly 1`] = `
                         margin-right: 4px;
                         margin-top: 0;
                       }
-                  id="id__2"
+                  id="id__1"
                 >
                   asdf
                 </div>
@@ -231,7 +232,7 @@ exports[`CommandBar renders commands correctly 1`] = `
                         margin-right: 4px;
                         margin-top: 0;
                       }
-                  id="id__5"
+                  id="id__4"
                 >
                   asdf
                 </div>
@@ -251,7 +252,7 @@ exports[`CommandBar renders commands correctly 1`] = `
               display: flex;
               flex-shrink: 0;
             }
-        data-focuszone-id="FocusZone8"
+        data-focuszone-id="FocusZone7"
         onFocus={[Function]}
         onKeyDown={[Function]}
         onMouseDownCapture={[Function]}
diff --git a/packages/experiments/src/components/Form/Form.test.tsx b/packages/experiments/src/components/Form/Form.test.tsx
index f4dd6c39ae12f..a15fb2310658a 100644
--- a/packages/experiments/src/components/Form/Form.test.tsx
+++ b/packages/experiments/src/components/Form/Form.test.tsx
@@ -144,11 +144,8 @@ describe('Form', () => {
     });
 
     it('Invalid values are not returned', () => {
-      let result: any;
       let renderedForm: Form = ReactTestUtils.renderIntoDocument(
-        <Form
-          onSubmit={ (value: any) => { result = value; } }
-        >
+        <Form onSubmit={ (value: any) => { /*stub*/ } }>
           <FormTextInput
             inputKey='field'
             validators={ [Validators.required(formRequiredTestMessage)] }
diff --git a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx
index 4c00a2d23164a..fe5e8c56e06ce 100644
--- a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx
@@ -101,14 +101,6 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
     let newItems = newProps.selectedItems;
 
     if (newItems) {
-      let focusIndex: number;
-
-      // If there are less new items than old items then something was removed and we
-      // should try to keep focus consistent
-      if (newItems.length < this.state.items.length) {
-        focusIndex = this.state.items.indexOf(this.selection.getSelection()[0]);
-      }
-
       this.setState({ items: newProps.selectedItems });
     }
   }
diff --git a/packages/experiments/src/components/TilesList/TilesList.tsx b/packages/experiments/src/components/TilesList/TilesList.tsx
index e54c4197490de..e68fd816ed4a1 100644
--- a/packages/experiments/src/components/TilesList/TilesList.tsx
+++ b/packages/experiments/src/components/TilesList/TilesList.tsx
@@ -311,7 +311,6 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
 
     let rowWidth = 0;
     let rowStart = 0;
-    let fillPercent = 0;
     let i = startIndex;
 
     let isAtGridEnd = true;
@@ -340,7 +339,6 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
         // The current "grid" just takes up the full width.
         // No flex calculations necessary.
         isAtGridEnd = true;
-        fillPercent = 1;
         cellSizes[i] = {
           width: bounds.width,
           height: 0
@@ -363,7 +361,6 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
         }
 
         rowWidth += width;
-        fillPercent = rowWidth / boundsWidth;
 
         cellSizes[i] = {
           // Assign the expected base size of the cell.
@@ -374,7 +371,6 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
 
         if (rowWidth > boundsWidth) {
           rowWidth = width;
-          fillPercent = rowWidth / boundsWidth;
           rowStart = i;
           currentRow = startCells[i] = {
             scaleFactor: 1
diff --git a/packages/experiments/tsconfig.json b/packages/experiments/tsconfig.json
index f36532dd11199..f48edfbaad5c2 100644
--- a/packages/experiments/tsconfig.json
+++ b/packages/experiments/tsconfig.json
@@ -9,6 +9,7 @@
     "sourceMap": true,
     "experimentalDecorators": true,
     "importHelpers": true,
+    "noUnusedLocals": true,
     "forceConsistentCasingInFileNames": true,
     "strictNullChecks": true,
     "noImplicitAny": true,
diff --git a/packages/experiments/tslint.json b/packages/experiments/tslint.json
index cbaba79e30a85..621ee6ba04605 100644
--- a/packages/experiments/tslint.json
+++ b/packages/experiments/tslint.json
@@ -2,25 +2,5 @@
   "extends": [
     "office-ui-fabric-react-tslint"
   ],
-  "rules": {
-    "jsx-no-string-ref": false,
-    "jsx-key": false,
-    "jsx-boolean-value": false,
-    "jsx-ban-props": false,
-    "max-line-length": [
-      false,
-      140
-    ],
-    "no-any": false,
-    "variable-name": false,
-    "no-internal-module": false,
-    "prefer-const": false,
-    "typedef": [
-      false
-    ],
-    "no-inferrable-types": [
-      false
-    ],
-    "no-unused-variable": false
-  }
+  "rules": {}
 }
\ No newline at end of file
diff --git a/packages/merge-styles/src/Stylesheet.ts b/packages/merge-styles/src/Stylesheet.ts
index 157a3e28237ce..6e6db05af6567 100644
--- a/packages/merge-styles/src/Stylesheet.ts
+++ b/packages/merge-styles/src/Stylesheet.ts
@@ -76,7 +76,6 @@ export class Stylesheet {
 
   constructor(config?: IStyleSheetConfig) {
     this._config = {
-      async: false,
       injectionMode: InjectionMode.insertNode,
       ...config
     };
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 6bb4d00aff8d0..080a24c2511a5 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -21,7 +21,7 @@
     "@types/es6-promise": "^0.0.32",
     "@types/jest": "21.1.0",
     "@types/prop-types": "15.5.1",
-    "@types/react": "15.0.38",
+    "@types/react": "15.6.7",
     "@types/react-dom": "15.5.5",
     "@types/react-test-renderer": "^15.5.4",
     "@types/resemblejs": "~1.3.28",
@@ -56,4 +56,4 @@
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   }
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.tsx
index e36e4b59b44c3..97e636db701dd 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.tsx
@@ -17,12 +17,12 @@ export interface IImageState {
   loadState?: ImageLoadState;
 }
 
-export const CoverStyleMap = {
+export const CoverStyleMap: { [key: number]: string } = {
   [ImageCoverStyle.landscape]: 'ms-Image-image--landscape ' + styles.imageIsLandscape,
   [ImageCoverStyle.portrait]: 'ms-Image-image--portrait ' + styles.imageIsPortrait
 };
 
-export const ImageFitMap = {
+export const ImageFitMap: { [key: number]: string } = {
   [ImageFit.center]: 'ms-Image-image--center ' + styles.imageIsCenter,
   [ImageFit.contain]: 'ms-Image-image--contain ' + styles.imageIsContain,
   [ImageFit.cover]: 'ms-Image-image--cover ' + styles.imageIsCover,
diff --git a/packages/office-ui-fabric-react/tsconfig.json b/packages/office-ui-fabric-react/tsconfig.json
index 319ec47d60302..4c61f9a2ea41d 100644
--- a/packages/office-ui-fabric-react/tsconfig.json
+++ b/packages/office-ui-fabric-react/tsconfig.json
@@ -9,6 +9,7 @@
     "sourceMap": true,
     "experimentalDecorators": true,
     "importHelpers": true,
+    "noUnusedLocals": false,
     "forceConsistentCasingInFileNames": true,
     "strictNullChecks": true,
     "noImplicitAny": true,
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 917bbaa3e8612..739a65fa4b6d8 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -19,7 +19,7 @@
     "@types/enzyme": "2.8.8",
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
-    "@types/react": "15.0.38",
+    "@types/react": "15.6.7",
     "es6-map": "^0.1.5",
     "es6-weak-map": "^2.0.2",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 189ff3e2a86cd..7e61c30680fec 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -23,8 +23,8 @@
     "@types/jest": "21.1.0",
     "@types/enzyme": "2.8.8",
     "@types/prop-types": "15.5.1",
-    "@types/react": "15.0.38",
-    "@types/react-dom": "15.5.1",
+    "@types/react": "15.6.7",
+    "@types/react-dom": "15.5.6",
     "@types/sinon": "2.2.2",
     "enzyme": "^2.9.1",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
diff --git a/scripts/package.json b/scripts/package.json
index 1912f7639bd39..22981a50b0788 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -38,7 +38,7 @@
     "style-loader": "^0.18.2",
     "tslint": "^5.7.0",
     "tslint-microsoft-contrib": "^5.0.1",
-    "typescript": "2.5.3",
+    "typescript": "2.6.2",
     "uglifyjs-webpack-plugin": "^0.4.6",
     "webpack": "^3.7.1",
     "webpack-bundle-analyzer": "^2.9.0",

From d264b74b93b48f57a3e207a3f70385b4e7a7150d Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 29 Nov 2017 03:24:06 -0800
Subject: [PATCH 1076/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../experiments/ts_2017-11-29-03-51.json      | 11 -------
 .../rename-props_2017-11-11-20-23.json        | 11 -------
 .../merge-styles/ts_2017-11-29-03-51.json     | 11 -------
 .../combobox-polish_2017-11-13-17-42.json     | 11 -------
 .../combobox-polish_2017-11-13-17-42.json     | 11 -------
 ...o-ColorPickerStyling_2017-11-20-10-36.json | 11 -------
 .../ts_2017-11-29-03-51.json                  | 11 -------
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/CHANGELOG.json           | 19 +++++++++++
 packages/experiments/CHANGELOG.md             |  9 +++++-
 packages/experiments/package.json             |  4 +--
 packages/icons/package.json                   |  2 +-
 .../jest-serializer-merge-styles/package.json |  2 +-
 packages/merge-styles/CHANGELOG.json          | 14 ++++++++
 packages/merge-styles/CHANGELOG.md            |  9 +++++-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 32 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 11 ++++++-
 packages/office-ui-fabric-react/package.json  |  6 ++--
 packages/styling/CHANGELOG.json               | 19 +++++++++++
 packages/styling/CHANGELOG.md                 |  9 +++++-
 packages/styling/package.json                 |  4 +--
 packages/utilities/package.json               |  2 +-
 scripts/package.json                          |  2 +-
 29 files changed, 136 insertions(+), 99 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/ts_2017-11-29-03-51.json
 delete mode 100644 common/changes/@uifabric/merge-styles/rename-props_2017-11-11-20-23.json
 delete mode 100644 common/changes/@uifabric/merge-styles/ts_2017-11-29-03-51.json
 delete mode 100644 common/changes/@uifabric/styling/combobox-polish_2017-11-13-17-42.json
 delete mode 100644 common/changes/office-ui-fabric-react/combobox-polish_2017-11-13-17-42.json
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-ColorPickerStyling_2017-11-20-10-36.json
 delete mode 100644 common/changes/office-ui-fabric-react/ts_2017-11-29-03-51.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 4a1f6b30bf4e0..bf8f0ddb1fa32 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.26.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.27.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 7482151cd6a48..3ee8dcb246dd6 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.26.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.27.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 745a8f98da859..bda556917ab8a 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.26.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.27.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index ca9faabd0b6e1..62a7823a93e67 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.26.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.27.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 6df0287776539..d7fc8a5003bb0 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.26.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.27.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/experiments/ts_2017-11-29-03-51.json b/common/changes/@uifabric/experiments/ts_2017-11-29-03-51.json
deleted file mode 100644
index c25162fa04393..0000000000000
--- a/common/changes/@uifabric/experiments/ts_2017-11-29-03-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Updating TypeScript to 2.6.2.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/rename-props_2017-11-11-20-23.json b/common/changes/@uifabric/merge-styles/rename-props_2017-11-11-20-23.json
deleted file mode 100644
index 571bd175f3813..0000000000000
--- a/common/changes/@uifabric/merge-styles/rename-props_2017-11-11-20-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/merge-styles",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/ts_2017-11-29-03-51.json b/common/changes/@uifabric/merge-styles/ts_2017-11-29-03-51.json
deleted file mode 100644
index f124702da1a46..0000000000000
--- a/common/changes/@uifabric/merge-styles/ts_2017-11-29-03-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "Updating TypeScript to 2.6.2.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/combobox-polish_2017-11-13-17-42.json b/common/changes/@uifabric/styling/combobox-polish_2017-11-13-17-42.json
deleted file mode 100644
index 98e8670537dab..0000000000000
--- a/common/changes/@uifabric/styling/combobox-polish_2017-11-13-17-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "SemanticSlots: Updated inputBorderHovered color.",
-      "packageName": "@uifabric/styling",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/combobox-polish_2017-11-13-17-42.json b/common/changes/office-ui-fabric-react/combobox-polish_2017-11-13-17-42.json
deleted file mode 100644
index 0070b167126ad..0000000000000
--- a/common/changes/office-ui-fabric-react/combobox-polish_2017-11-13-17-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SelectableOption: New disabled prop for options. ComboBox: Updated styling per design spec, including new rootPressed prop, color updates, and className updates.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/malozano-ColorPickerStyling_2017-11-20-10-36.json b/common/changes/office-ui-fabric-react/malozano-ColorPickerStyling_2017-11-20-10-36.json
deleted file mode 100644
index c163271314fe7..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-ColorPickerStyling_2017-11-20-10-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SwatchColorPicker: Change scss to js styling",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/ts_2017-11-29-03-51.json b/common/changes/office-ui-fabric-react/ts_2017-11-29-03-51.json
deleted file mode 100644
index c2ebb2487a31a..0000000000000
--- a/common/changes/office-ui-fabric-react/ts_2017-11-29-03-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Updating TypeScript to 2.6.2.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 098ebb99e10fb..96dc8d395fa5f 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -38,7 +38,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.11.0 <6.0.0",
+    "@uifabric/styling": ">=5.11.1 <6.0.0",
     "@uifabric/utilities": ">=5.5.0 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 8974582e48c39..8b5f3be59557d 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.7.0",
+      "tag": "@uifabric/experiments_v5.7.0",
+      "date": "Wed, 29 Nov 2017 11:24:05 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "a6ef94b3edb7679d7659ec0d51e199139102d28c",
+            "comment": "Updating TypeScript to 2.6.2."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.26.0 <6.0.0` to `>=5.27.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.6.1",
       "tag": "@uifabric/experiments_v5.6.1",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index ae0c3806cba58..7f877e6b4f4e0 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Thu, 23 Nov 2017 11:10:13 GMT and should not be manually modified.
+This log was last generated on Wed, 29 Nov 2017 11:24:05 GMT and should not be manually modified.
+
+## 5.7.0
+Wed, 29 Nov 2017 11:24:05 GMT
+
+### Minor changes
+
+- Updating TypeScript to 2.6.2.
 
 ## 5.6.1
 Thu, 23 Nov 2017 11:10:13 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index d25d3264172a4..f334a1c00525c 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.6.1",
+  "version": "5.7.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.26.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.27.0 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 30fc464b2abd7..412f2e446d265 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -23,7 +23,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.11.0 <6.0.0",
+    "@uifabric/styling": ">=5.11.1 <6.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/jest-serializer-merge-styles/package.json b/packages/jest-serializer-merge-styles/package.json
index 6a867b993ab72..c72af59d13961 100644
--- a/packages/jest-serializer-merge-styles/package.json
+++ b/packages/jest-serializer-merge-styles/package.json
@@ -24,6 +24,6 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/merge-styles": ">=5.6.0 <6.0.0"
+    "@uifabric/merge-styles": ">=5.7.0 <6.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index 645db78bed8c7..c1fe76f413ff5 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.7.0",
+      "tag": "@uifabric/merge-styles_v5.7.0",
+      "date": "Wed, 29 Nov 2017 11:24:05 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "a6ef94b3edb7679d7659ec0d51e199139102d28c",
+            "comment": "Updating TypeScript to 2.6.2."
+          }
+        ]
+      }
+    },
     {
       "version": "5.6.0",
       "tag": "@uifabric/merge-styles_v5.6.0",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index b992fc33bbfe9..465bcae14702b 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Fri, 10 Nov 2017 17:09:36 GMT and should not be manually modified.
+This log was last generated on Wed, 29 Nov 2017 11:24:05 GMT and should not be manually modified.
+
+## 5.7.0
+Wed, 29 Nov 2017 11:24:05 GMT
+
+### Minor changes
+
+- Updating TypeScript to 2.6.2.
 
 ## 5.6.0
 Fri, 10 Nov 2017 17:09:36 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index 4b6a5f6b87df8..7f1f5f212cca7 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.6.0",
+  "version": "5.7.0",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 7c021ac00871a..27b7f5d49e874 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,38 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.27.0",
+      "tag": "office-ui-fabric-react_v5.27.0",
+      "date": "Wed, 29 Nov 2017 11:24:06 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "7d322b1de493bd49f1a93a26bc09cdf67e574b25",
+            "comment": "SelectableOption: New disabled prop for options. ComboBox: Updated styling per design spec, including new rootPressed prop, color updates, and className updates."
+          },
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "c27765dc1a76d252d97e7daf23c441319d467606",
+            "comment": "SwatchColorPicker: Change scss to js styling"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "a6ef94b3edb7679d7659ec0d51e199139102d28c",
+            "comment": "Updating TypeScript to 2.6.2."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.6.0 <6.0.0` to `>=5.7.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.11.0 <6.0.0` to `>=5.11.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.26.1",
       "tag": "office-ui-fabric-react_v5.26.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index b460614118850..248473d1d5060 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,15 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 28 Nov 2017 02:24:21 GMT and should not be manually modified.
+This log was last generated on Wed, 29 Nov 2017 11:24:06 GMT and should not be manually modified.
+
+## 5.27.0
+Wed, 29 Nov 2017 11:24:06 GMT
+
+### Minor changes
+
+- SelectableOption: New disabled prop for options. ComboBox: Updated styling per design spec, including new rootPressed prop, color updates, and className updates.
+- SwatchColorPicker: Change scss to js styling
+- Updating TypeScript to 2.6.2.
 
 ## 5.26.1
 Tue, 28 Nov 2017 02:24:21 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 080a24c2511a5..d474ebcf312ca 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.26.1",
+  "version": "5.27.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -46,8 +46,8 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.6.0 <6.0.0",
-    "@uifabric/styling": ">=5.11.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.7.0 <6.0.0",
+    "@uifabric/styling": ">=5.11.1 <6.0.0",
     "@uifabric/utilities": ">=5.5.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index a8e375438c694..fc0ac0631a017 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.11.1",
+      "tag": "@uifabric/styling_v5.11.1",
+      "date": "Wed, 29 Nov 2017 11:24:05 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "7d322b1de493bd49f1a93a26bc09cdf67e574b25",
+            "comment": "SemanticSlots: Updated inputBorderHovered color."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.6.0 <6.0.0` to `>=5.7.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.11.0",
       "tag": "@uifabric/styling_v5.11.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index d13724b5897b4..857bcd46edb48 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Tue, 28 Nov 2017 02:24:21 GMT and should not be manually modified.
+This log was last generated on Wed, 29 Nov 2017 11:24:06 GMT and should not be manually modified.
+
+## 5.11.1
+Wed, 29 Nov 2017 11:24:05 GMT
+
+### Patches
+
+- SemanticSlots: Updated inputBorderHovered color.
 
 ## 5.11.0
 Tue, 28 Nov 2017 02:24:21 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 739a65fa4b6d8..8189126668f31 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.11.0",
+  "version": "5.11.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "repository": {
     "type": "git",
@@ -29,7 +29,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/utilities": ">=5.5.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.6.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.7.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 7e61c30680fec..e4a6d16a09f55 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -34,7 +34,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/merge-styles": ">=5.6.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.7.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/scripts/package.json b/scripts/package.json
index 22981a50b0788..fc8d97efc0ce3 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -11,7 +11,7 @@
     "@microsoft/api-extractor": "^4.2.6",
     "@microsoft/load-themed-styles": "^1.7.5",
     "@microsoft/loader-load-themed-styles": "^1.6.0",
-    "@uifabric/merge-styles": ">=5.6.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.7.0 <6.0.0",
     "autoprefixer": "^7.1.5",
     "awesome-typescript-loader": "^3.2.3",
     "bundlesize": "^0.15.2",

From 70276089a58cdf49a4136097788d74ef3d089674 Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Wed, 29 Nov 2017 11:14:03 -0800
Subject: [PATCH 1077/1641] Callout/Positioning: Prepare positioning for
 separating calloutpositioning. (#3436)

* added fixes to positioning and functionality

* more updates to positioning to help prepare for eventual splitting

* adding files

* removed more references to callout in positioning

*  did more cleanup, removed unnecessary options

* Update callout-positioninginfo_2017-11-20-22-04.json

* more refactoring, fixed beak placement bug

* adding missing files

* renamed file for clarity

* adding missing file

* more renames, small nit fixes
---
 ...lout-positioninginfo_2017-11-20-22-04.json |  11 +
 .../src/components/Callout/Callout.types.ts   |   8 +-
 .../src/components/Callout/CalloutContent.tsx |  87 +-
 .../src/utilities/positioning.test.ts         |  10 +-
 .../src/utilities/positioning.ts              | 750 +----------------
 .../src/utilities/positioning/index.ts        |   2 +
 .../src/utilities/positioning/positioning.ts  | 779 ++++++++++++++++++
 .../positioning/positioning.types.ts          | 127 +++
 8 files changed, 989 insertions(+), 785 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/callout-positioninginfo_2017-11-20-22-04.json
 create mode 100644 packages/office-ui-fabric-react/src/utilities/positioning/index.ts
 create mode 100644 packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts
 create mode 100644 packages/office-ui-fabric-react/src/utilities/positioning/positioning.types.ts

diff --git a/common/changes/office-ui-fabric-react/callout-positioninginfo_2017-11-20-22-04.json b/common/changes/office-ui-fabric-react/callout-positioninginfo_2017-11-20-22-04.json
new file mode 100644
index 0000000000000..9b4ebc5612b31
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/callout-positioninginfo_2017-11-20-22-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Positioning/Callout: made significant changes to help prepare for when positioning and calloutpositioning separate.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts b/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
index 4234e34676e14..30bf82b8f24a2 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
@@ -4,8 +4,9 @@ import { CalloutContent } from './CalloutContent';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import {
   IPoint,
-  IRectangle,
+  IRectangle
 } from '../../Utilities';
+import { ICalloutPositionedInfo } from '../../utilities/positioning';
 
 export interface ICallout {
 
@@ -137,8 +138,11 @@ export interface ICalloutProps extends React.Props<Callout | CalloutContent> {
 
   /**
    * Optional callback that is called once the callout has been correctly positioned.
+   * @param {ICalloutPositionedInfo} positions gives the user information about how the callout is positioned such as the
+   * final edge of the target that it positioned against, the beak position, and the beaks relationship to the
+   * edges of the callout.
    */
-  onPositioned?: () => void;
+  onPositioned?: (positions?: ICalloutPositionedInfo) => void;
 
   /**
    * Callback when the Callout tries to close.
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index b4e1c0fba8671..afade71b6621e 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -15,7 +15,14 @@ import {
   getWindow,
   getDocument
 } from '../../Utilities';
-import { getRelativePositions, IPositionInfo, IPositionProps, getMaxHeight, ICalloutPositon } from '../../utilities/positioning';
+import {
+  positionCallout,
+  ICalloutPositionedInfo,
+  IPositionProps,
+  getMaxHeight,
+  IPosition,
+  RectangleEdge
+} from '../../utilities/positioning';
 import { Popup } from '../../Popup';
 import * as stylesImport from './Callout.scss';
 import { AnimationClassNames, mergeStyles } from '../../Styling';
@@ -25,9 +32,15 @@ const styles: any = stylesImport;
 const BEAK_ORIGIN_POSITION = { top: 0, left: 0 };
 const OFF_SCREEN_STYLE = { opacity: 0 };
 const BORDER_WIDTH: number = 1;
+const SLIDE_ANIMATIONS: { [key: number]: string; } = {
+  [RectangleEdge.top]: 'slideUpIn20',
+  [RectangleEdge.bottom]: 'slideDownIn20',
+  [RectangleEdge.left]: 'slideLeftIn20',
+  [RectangleEdge.right]: 'slideRightIn20'
+};
 
 export interface ICalloutState {
-  positions?: IPositionInfo;
+  positions?: ICalloutPositionedInfo;
   slideDirectionalClassName?: string;
   calloutElementRect?: ClientRect;
   heightOffset?: number;
@@ -121,31 +134,16 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       calloutMaxHeight } = this.props;
     target = this._getTarget();
     let { positions } = this.state;
-    let beakStyleWidth = beakWidth;
-
-    // This is here to support the old way of setting the beak size until version 1.0.0.
-    // beakStyle is now deprecated and will be be removed at version 1.0.0
-    if (beakStyle === 'ms-Callout-smallbeak') {
-      beakStyleWidth = 16;
-    }
 
-    let beakReactStyle: React.CSSProperties = {
-      ...(positions && positions.beakPosition ? positions.beakPosition.position : null),
-    };
-    beakReactStyle.height = beakStyleWidth;
-    beakReactStyle.width = beakStyleWidth;
-    beakReactStyle.backgroundColor = backgroundColor;
-    if (!beakReactStyle.top && !beakReactStyle.bottom && !beakReactStyle.left && !beakReactStyle.right) {
-      beakReactStyle.left = BEAK_ORIGIN_POSITION.left;
-      beakReactStyle.top = BEAK_ORIGIN_POSITION.top;
-    }
-    let directionalClassName = (positions && positions.directionalClassName)
-      ? (AnimationClassNames as any)[positions.directionalClassName]
+    let directionalClassName = (positions && positions.targetEdge)
+      ? (AnimationClassNames as any)[SLIDE_ANIMATIONS[positions.targetEdge]]
       : '';
 
     let getContentMaxHeight: number = this._getMaxHeight() + this.state.heightOffset!;
     let contentMaxHeight: number = calloutMaxHeight! && (calloutMaxHeight! < getContentMaxHeight) ? calloutMaxHeight! : getContentMaxHeight!;
 
+    const beakReactStyle = this._getBeakPosition(positions, beakWidth, backgroundColor, beakStyle);
+
     let beakVisible = isBeakVisible && (!!target);
 
     let content = (
@@ -162,7 +160,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
               directionalClassName,
               !!calloutWidth && { width: calloutWidth }
             ) }
-          style={ positions ? positions.calloutPosition : OFF_SCREEN_STYLE }
+          style={ positions ? positions.elementPosition : OFF_SCREEN_STYLE }
           tabIndex={ -1 } // Safari and Firefox on Mac OS requires this to back-stop click events so focus remains in the Callout.
           // See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus
           ref={ this._resolveRef('_calloutElement') }
@@ -255,9 +253,11 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
     this._updateAsyncPosition();
     this._setHeightOffsetEveryFrame();
   }
+
   private _updateAsyncPosition() {
     this._async.requestAnimationFrame(() => this._updatePosition());
   }
+
   private _updatePosition() {
     let { positions } = this.state;
     let hostElement: HTMLElement = this._hostElement;
@@ -268,7 +268,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       currentProps = assign(currentProps, this.props);
       currentProps!.bounds = this._getBounds();
       currentProps!.target = this._target!;
-      let newPositions: IPositionInfo = getRelativePositions(currentProps!, hostElement, calloutElement);
+      let newPositions: ICalloutPositionedInfo = positionCallout(currentProps!, hostElement, calloutElement);
 
       // Set the new position only when the positions are not exists or one of the new callout positions are different.
       // The position should not change if the position is within 2 decimal places.
@@ -284,12 +284,38 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       } else {
         this._positionAttempts = 0;
         if (this.props.onPositioned) {
-          this.props.onPositioned();
+          this.props.onPositioned(this.state.positions);
         }
       }
     }
   }
 
+  private _getBeakPosition(positions?: ICalloutPositionedInfo,
+    beakWidth?: number,
+    backgroundColor?: string,
+    beakStyle?: string) {
+    let beakStyleWidth = beakWidth;
+
+    // This is here to support the old way of setting the beak size until version 1.0.0.
+    // beakStyle is now deprecated and will be be removed at version 1.0.0
+    if (beakStyle === 'ms-Callout-smallbeak') {
+      beakStyleWidth = 16;
+    }
+
+    let beakReactStyle: React.CSSProperties = {
+      ...(positions && positions.beakPosition ? positions.beakPosition.elementPosition : null),
+    };
+    beakReactStyle.height = beakStyleWidth;
+    beakReactStyle.width = beakStyleWidth;
+    beakReactStyle.backgroundColor = backgroundColor;
+    if (!beakReactStyle.top && !beakReactStyle.bottom && !beakReactStyle.left && !beakReactStyle.right) {
+      beakReactStyle.left = BEAK_ORIGIN_POSITION.left;
+      beakReactStyle.top = BEAK_ORIGIN_POSITION.top;
+    }
+
+    return beakReactStyle;
+  }
+
   private _getBounds(): IRectangle {
     if (!this._bounds) {
       let currentBounds = this.props.bounds;
@@ -314,7 +340,10 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       if (this.props.directionalHintFixed && this._target) {
         let beakWidth = this.props.isBeakVisible ? this.props.beakWidth : 0;
         let gapSpace = this.props.gapSpace ? this.props.gapSpace : 0;
-        this._maxHeight = getMaxHeight(this._target, this.props.directionalHint!, beakWidth! + gapSpace, this._getBounds());
+        // Since the callout cannot measure it's border size it must be taken into account here. Otherwise it will
+        // overlap with the target.
+        const totalGap = gapSpace + beakWidth! + BORDER_WIDTH * 2;
+        this._maxHeight = getMaxHeight(this._target, this.props.directionalHint!, totalGap, this._getBounds());
       } else {
         this._maxHeight = this._getBounds().height! - BORDER_WIDTH * 2;
       }
@@ -322,12 +351,12 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
     return this._maxHeight!;
   }
 
-  private _arePositionsEqual(positions: IPositionInfo, newPosition: IPositionInfo) {
-    return this._comparePositions(positions.calloutPosition, newPosition.calloutPosition) &&
-      this._comparePositions(positions.beakPosition.position, newPosition.beakPosition.position);
+  private _arePositionsEqual(positions: ICalloutPositionedInfo, newPosition: ICalloutPositionedInfo) {
+    return this._comparePositions(positions.elementPosition, newPosition.elementPosition) &&
+      this._comparePositions(positions.beakPosition.elementPosition, newPosition.beakPosition.elementPosition);
   }
 
-  private _comparePositions(oldPositions: ICalloutPositon, newPositions: ICalloutPositon) {
+  private _comparePositions(oldPositions: IPosition, newPositions: IPosition) {
     for (const key in newPositions) {
       // This needs to be checked here and below because there is a linting error if for in does not immediately have an if statement
       if (newPositions.hasOwnProperty(key)) {
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning.test.ts b/packages/office-ui-fabric-react/src/utilities/positioning.test.ts
index 26cfc1b629ca7..ab77bcc2b842f 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning.test.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning.test.ts
@@ -20,11 +20,11 @@ function stringifyResults(expected: any, actual: any) {
 function positionCalloutTest(testValues: ITestValues, alignment: DirectionalHint, validate: ITestValidation) {
   let { callout, target, bounds, beakWidth } = testValues;
   let gap: number = positioningFunctions._calculateActualBeakWidthInPixels(beakWidth) / 2;
-  let result: positioningFunctions.ICallout = positioningFunctions._positionCalloutWithinBounds(callout, target, bounds, positioningFunctions._getPositionData(alignment), gap);
+  let result: positioningFunctions.IElementPosition = positioningFunctions._positionElementWithinBounds(callout, target, bounds, positioningFunctions._getPositionData(alignment), gap);
 
-  let beak = positioningFunctions._positionBeak(beakWidth, result, target, 0);
+  let beak = positioningFunctions._positionBeak(beakWidth, { ...result, targetRectangle: target });
 
-  expect(result.calloutRectangle).toEqual(validate.callout);
+  expect(result.elementRectangle).toEqual(validate.callout);
 
   for (const key in beak) {
     if (beak[key]) {
@@ -38,9 +38,9 @@ function positionCalloutTest(testValues: ITestValues, alignment: DirectionalHint
 
 function validateNoBeakTest(testValues: ITestValues, alignment: DirectionalHint, validate: ITestValidation) {
   let { callout, target, bounds, beakWidth } = testValues;
-  let result: positioningFunctions.ICallout = positioningFunctions._positionCalloutWithinBounds(callout, target, bounds, positioningFunctions._getPositionData(alignment), beakWidth);
+  let result: positioningFunctions.IElementPosition = positioningFunctions._positionElementWithinBounds(callout, target, bounds, positioningFunctions._getPositionData(alignment), beakWidth);
 
-  expect(result.calloutRectangle).toEqual(validate.callout);
+  expect(result.elementRectangle).toEqual(validate.callout);
 }
 
 describe('Callout Positioning', () => {
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning.ts b/packages/office-ui-fabric-react/src/utilities/positioning.ts
index d8d725190edaf..e7cbc09322377 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning.ts
@@ -1,749 +1 @@
-import { DirectionalHint } from '../common/DirectionalHint';
-import {
-  getScrollbarWidth,
-  getRTL,
-  Rectangle as FullRectangle,
-  IRectangle
-} from '../Utilities';
-
-export enum RectangleEdge {
-  top = 1,
-  bottom = -1,
-  left = 2,
-  right = -2
-}
-
-export enum Position {
-  top = 0,
-  bottom = 1,
-  start = 2,
-  end = 3
-}
-
-const SLIDE_ANIMATIONS: { [key: number]: string; } = {
-  [RectangleEdge.top]: 'slideUpIn20',
-  [RectangleEdge.bottom]: 'slideDownIn20',
-  [RectangleEdge.left]: 'slideLeftIn20',
-  [RectangleEdge.right]: 'slideRightIn20'
-};
-
-export class Rectangle extends FullRectangle {
-  [key: string]: number | boolean | any;
-}
-
-export interface IPositionProps {
-  target?: HTMLElement | MouseEvent | IPoint;
-  /** how the element should be positioned */
-  directionalHint?: DirectionalHint;
-
-  /**
-   * How the element should be positioned in RTL layouts.
-   * If not specified, a mirror of `directionalHint` will be used instead
-   */
-  directionalHintForRTL?: DirectionalHint;
-
-  /** The gap between the callout and the target */
-  gapSpace?: number;
-
-  /** The width of the beak. */
-  beakWidth?: number;
-
-  /**
-   * The bounding rectangle for which  the contextual menu can appear in.
-   */
-  bounds?: IRectangle;
-
-  /** If true then the beak is visible. If false it will not be shown. */
-  isBeakVisible?: boolean;
-
-  /**
-   * If true the position returned will have the menu element cover the target.
-   * If false then it will position next to the target;
-   */
-  coverTarget?: boolean;
-
-  /**
-   * If true the position will not change edges in an attempt to fit the rectangle within bounds.
-   * It will still attempt to align it to whatever bounds are given.
-   * @default false
-   */
-  directionalHintFixed?: boolean;
-}
-
-export interface IPositionInfo {
-  calloutPosition: ICalloutPositon;
-  beakPosition: { position: ICalloutPositon, display: string };
-  directionalClassName: string;
-  submenuDirection: DirectionalHint;
-}
-
-export interface ICalloutPositon {
-  top?: number;
-  left?: number;
-  bottom?: number;
-  right?: number;
-  [key: string]: number | undefined;
-}
-
-export interface IPoint {
-  x: number;
-  y: number;
-}
-
-export interface IPositionData {
-  targetEdge: RectangleEdge;
-  alignmentEdge?: RectangleEdge;
-  isAuto?: boolean;
-}
-
-function _createPositionData(
-  targetEdge: RectangleEdge,
-  alignmentEdge?: RectangleEdge,
-  isAuto?: boolean): IPositionData {
-  return {
-    targetEdge: targetEdge,
-    alignmentEdge: alignmentEdge,
-    isAuto: isAuto
-  };
-}
-
-// Currently the beakPercent is set to 50 for all positions meaning that it should tend to the center of the target
-let DirectionalDictionary: { [key: number]: IPositionData } = {
-  [DirectionalHint.topLeftEdge]: _createPositionData(RectangleEdge.top, RectangleEdge.left),
-  [DirectionalHint.topCenter]: _createPositionData(RectangleEdge.top),
-  [DirectionalHint.topRightEdge]: _createPositionData(RectangleEdge.top, RectangleEdge.right),
-  [DirectionalHint.topAutoEdge]: _createPositionData(RectangleEdge.top, undefined, true),
-  [DirectionalHint.bottomLeftEdge]: _createPositionData(RectangleEdge.bottom, RectangleEdge.left),
-  [DirectionalHint.bottomCenter]: _createPositionData(RectangleEdge.bottom),
-  [DirectionalHint.bottomRightEdge]: _createPositionData(RectangleEdge.bottom, RectangleEdge.right),
-  [DirectionalHint.bottomAutoEdge]: _createPositionData(RectangleEdge.bottom, undefined, true),
-  [DirectionalHint.leftTopEdge]: _createPositionData(RectangleEdge.left, RectangleEdge.top),
-  [DirectionalHint.leftCenter]: _createPositionData(RectangleEdge.left),
-  [DirectionalHint.leftBottomEdge]: _createPositionData(RectangleEdge.left, RectangleEdge.bottom),
-  [DirectionalHint.rightTopEdge]: _createPositionData(RectangleEdge.right, RectangleEdge.top),
-  [DirectionalHint.rightCenter]: _createPositionData(RectangleEdge.right),
-  [DirectionalHint.rightBottomEdge]: _createPositionData(RectangleEdge.right, RectangleEdge.bottom)
-};
-
-export module positioningFunctions {
-
-  export interface ICallout {
-    calloutRectangle: Rectangle;
-    targetEdge: RectangleEdge;
-    alignmentEdge: RectangleEdge | undefined;
-  }
-
-  export type PartialIRectangle = Partial<IRectangle>;
-
-  export interface IPartialIRectangle extends PartialIRectangle {
-    [key: string]: number | undefined;
-  }
-
-  function _isRectangleWithinBounds(rect: Rectangle, boundingRect: Rectangle): boolean {
-    if (rect.top < boundingRect.top) {
-      return false;
-    }
-    if (rect.bottom > boundingRect.bottom) {
-      return false;
-    }
-    if (rect.left < boundingRect.left) {
-      return false;
-    }
-    if (rect.right > boundingRect.right) {
-      return false;
-    }
-
-    return true;
-  }
-
-  /**
-   * Gets all of the edges of a rectangle that are outside of the given bounds.
-   * If there are no out of bounds edges it returns an empty array.
-   */
-  function _getOutOfBoundsEdges(rect: Rectangle, boundingRect: Rectangle): RectangleEdge[] {
-    let outOfBounds: RectangleEdge[] = new Array<RectangleEdge>();
-
-    if (rect.top < boundingRect.top) {
-      outOfBounds.push(RectangleEdge.top);
-    }
-    if (rect.bottom > boundingRect.bottom) {
-      outOfBounds.push(RectangleEdge.bottom);
-    }
-    if (rect.left < boundingRect.left) {
-      outOfBounds.push(RectangleEdge.left);
-    }
-    if (rect.right > boundingRect.right) {
-      outOfBounds.push(RectangleEdge.right);
-    }
-
-    return outOfBounds;
-  }
-
-  function _getEdgeValue(rect: Rectangle, edge: RectangleEdge): number {
-    return rect[RectangleEdge[edge]];
-  }
-
-  function _setEdgeValue(rect: Rectangle, edge: RectangleEdge, value: number) {
-    rect[RectangleEdge[edge]] = value;
-    return rect;
-  }
-
-  /**
-   * Returns the middle value of an edge. Only returns 1 value rather than xy coordinates as
-   * the itself already contains the other coordinate.
-   * For instance, a bottom edge's current value is it's y coordinate, so the number returned is the x.
-   *
-   * @param {Rectangle} rect
-   * @param {RectangleEdge} edge
-   * @returns {number}
-   */
-  function _getCenterValue(rect: Rectangle, edge: RectangleEdge): number {
-    const edges = _getFlankingEdges(edge);
-    return (_getEdgeValue(rect, edges.firstEdge) + _getEdgeValue(rect, edges.secondEdge)) / 2;
-  }
-
-  /**
-   * Flips the value depending on the edge.
-   * If the edge is a "positive" edge, Top or Left, then the value should stay as it is.
-   * If the edge is a "negative" edge, Bottom or Right, then the value should be flipped.
-   * This is to account for the fact that the coordinates are effectively reveserved in certain cases for the "negative" edges.
-   * For example, when testing to see if a bottom edge 1 is within the bounds of another bottom edge 2.
-   * If edge 1 is greater than edge 2 then it is out of bounds. This is reversed for top edge 1 and top edge 2.
-   * If top edge 1 is less than edge 2 then it is out of bounds.
-   *
-   *
-   * @param {RectangleEdge} edge
-   * @param {number} value
-   * @returns {number}
-   */
-  function _getRelativeEdgeValue(edge: RectangleEdge, value: number): number {
-    if (edge > 0) {
-      return value;
-    } else {
-      return value * -1;
-    }
-  }
-
-  function _getRelativeRectEdgeValue(edge: RectangleEdge, rect: Rectangle): number {
-    return _getRelativeEdgeValue(edge, _getEdgeValue(rect, edge));
-  }
-
-  function _getRelativeEdgeDifference(rect: Rectangle, hostRect: Rectangle, edge: RectangleEdge): number {
-    const edgeDifference = _getEdgeValue(rect, edge) - _getEdgeValue(hostRect, edge);
-    return _getRelativeEdgeValue(edge, edgeDifference);
-  }
-
-  /**
-   * Moves the edge of a rectangle to the value given. It only moves the edge in a linear direction based on that edge.
-   * For example, if it's a bottom edge it will only change y coordinates.
-   *
-   * @param {Rectangle} rect
-   * @param {RectangleEdge} edge
-   * @param {number} newValue
-   * @returns {Rectangle}
-   */
-  function _moveEdge(rect: Rectangle, edge: RectangleEdge, newValue: number): Rectangle {
-    const difference = _getEdgeValue(rect, edge) - newValue;
-    rect = _setEdgeValue(rect, edge, newValue);
-    rect = _setEdgeValue(rect, edge * -1, _getEdgeValue(rect, edge * -1) - difference);
-    return rect;
-  }
-
-  /**
-   * Aligns the edge on the passed in rect to the target. If there is a gap then it will have that space between the two.
-   *
-   * @param {Rectangle} rect
-   * @param {Rectangle} target
-   * @param {RectangleEdge} edge
-   * @param {number} [gap=0]
-   * @returns {Rectangle}
-   */
-  function _alignEdges(rect: Rectangle, target: Rectangle, edge: RectangleEdge, gap: number = 0): Rectangle {
-    return _moveEdge(rect, edge, _getEdgeValue(target, edge) + _getRelativeEdgeValue(edge, gap));
-  }
-
-  /**
-   * Aligns the targetEdge on the passed in target to the rects corresponding opposite edge.
-   * For instance if targetEdge is bottom, then the rects top will be moved to match it.
-   *
-   * @param {Rectangle} rect
-   * @param {Rectangle} target
-   * @param {RectangleEdge} targetEdge
-   * @param {number} [gap=0]
-   * @returns {Rectangle}
-   */
-  function _alignOppositeEdges(rect: Rectangle, target: Rectangle, targetEdge: RectangleEdge, gap: number = 0): Rectangle {
-    const oppositeEdge = targetEdge * -1;
-    const adjustedGap = _getRelativeEdgeValue(oppositeEdge, gap);
-    return _moveEdge(rect, targetEdge * -1, _getEdgeValue(target, targetEdge) + adjustedGap);
-  }
-
-  /**
-   * Tests to see if the given edge is within the bounds of the given rectangle.
-   *
-   * @param {Rectangle} rect
-   * @param {Rectangle} bounds
-   * @param {RectangleEdge} edge
-   * @returns {boolean}
-   */
-  function _isEdgeInBounds(rect: Rectangle, bounds: Rectangle, edge: RectangleEdge): boolean {
-    const adjustedRectValue = _getRelativeRectEdgeValue(edge, rect);
-    // The adjusted value must be reversed to determine if it is within the bounds.
-    // Take these two examples:
-    // Top is out of bounds with -4 as value. Top is not reversed in _getRelativeRectEdgeValue. -4 * -1 = 4
-    // 4 is not less than the bounds of 0, so it must be out of bounds.
-    // Bottom is out of bounds with 5 as value, bounds bottom is 4. Bottom is reversed in _getRelaitveRectEdgeValue.
-    // Bottom is now -5. Bottom * -1 is now 5. 5 is greater than bounds bottom of 4, so it must be out of bounds.
-    return adjustedRectValue * -1 < _getEdgeValue(bounds, edge);
-  }
-
-  /**
-   * Attempts to move the rectangle through various sides of the target to find a place to fit.
-   * If no fit is found, the original position should be returned.
-   *
-   * @param {Rectangle} rect
-   * @param {Rectangle} target
-   * @param {Rectangle} bounding
-   * @param {IPositionData} positionData
-   * @param {number} [gap=0]
-   * @returns {ICallout}
-   */
-  function _flipToFit(rect: Rectangle, target: Rectangle, bounding: Rectangle, positionData: IPositionData, gap: number = 0, ): ICallout {
-    let directions: RectangleEdge[] = [RectangleEdge.left, RectangleEdge.right, RectangleEdge.bottom, RectangleEdge.top];
-    let currentEstimate = rect;
-    let currentEdge = positionData.targetEdge;
-    let currentAlignment = positionData.alignmentEdge;
-    // Keep switching sides until one is found with enough space. If all sides don't fit then return the unmodified callout.
-    for (let i = 0; i < 4; i++) {
-      if (!_isEdgeInBounds(currentEstimate, bounding, currentEdge)) {
-        directions.splice(directions.indexOf(currentEdge), 1);
-        if (directions.indexOf(currentEdge * -1) > -1) {
-          currentEdge = currentEdge * -1;
-        } else {
-          currentAlignment = currentEdge;
-          currentEdge = directions.slice(-1)[0];
-        }
-        currentEstimate = _estimatePosition(rect, target, { targetEdge: currentEdge, alignmentEdge: currentAlignment }, gap);
-      } else {
-        return {
-          calloutRectangle: currentEstimate,
-          targetEdge: currentEdge,
-          alignmentEdge: currentAlignment
-        };
-      }
-    }
-    return {
-      calloutRectangle: rect,
-      targetEdge: positionData.targetEdge,
-      alignmentEdge: currentAlignment
-    };
-  }
-
-  /**
-   * Adjusts a callout rectangle to fit within the bounds given. If directionalHintFixed or covertarget is passed in
-   * then the callout will not flip sides on the target. They will, however, be nudged to fit within the bounds given.
-   *
-   * @param {Rectangle} callout
-   * @param {Rectangle} target
-   * @param {Rectangle} bounding
-   * @param {IPositionData} positionData
-   * @param {number} [gap=0]
-   * @param {boolean} [directionalHintFixed]
-   * @param {boolean} [coverTarget]
-   * @returns {ICallout}
-   */
-  function _adjustFitWithinBounds(
-    callout: Rectangle,
-    target: Rectangle,
-    bounding: Rectangle,
-    positionData: IPositionData,
-    gap: number = 0,
-    directionalHintFixed?: boolean,
-    coverTarget?: boolean): ICallout {
-
-    let {
-      alignmentEdge
-    } = positionData;
-    let calloutEstimate: ICallout = {
-      calloutRectangle: callout,
-      targetEdge: positionData.targetEdge,
-      alignmentEdge: alignmentEdge
-    };
-
-    if (!directionalHintFixed && !coverTarget) {
-      calloutEstimate = _flipToFit(callout, target, bounding, positionData, gap);
-    }
-
-    let outOfBounds = _getOutOfBoundsEdges(callout, bounding);
-
-    for (const direction of outOfBounds) {
-      calloutEstimate.calloutRectangle = _alignEdges(calloutEstimate.calloutRectangle, bounding, direction);
-    }
-
-    return calloutEstimate;
-  }
-
-  /**
-   * Moves the middle point on an edge to the point given.
-   * Only moves in one direction. For instance if a bottom edge is passed in, then
-   * the bottom edge will be moved in the x axis to match the point.
-   *
-   * @param {Rectangle} rect
-   * @param {RectangleEdge} edge
-   * @param {number} point
-   * @returns
-   */
-  function centerEdgeToPoint(rect: Rectangle, edge: RectangleEdge, point: number) {
-    const { firstEdge } = _getFlankingEdges(edge);
-    const calloutMiddle = _getCenterValue(rect, edge);
-    const distanceToMiddle = calloutMiddle - _getEdgeValue(rect, firstEdge);
-    return _moveEdge(rect, firstEdge, point - distanceToMiddle);
-  }
-
-  /**
-   * Moves the callout rectangle to be appropriately positioned relative to a given target.
-   * Does not flip or adjust the callout.
-   *
-   * @param {Rectangle} callout
-   * @param {Rectangle} target
-   * @param {IPositionData} positionData
-   * @param {number} [gap=0]
-   * @param {boolean} [coverTarget]
-   * @returns {Rectangle}
-   */
-  function _estimatePosition(
-    callout: Rectangle,
-    target: Rectangle,
-    positionData: IPositionData,
-    gap: number = 0,
-    coverTarget?: boolean
-  ): Rectangle {
-    let estimatedCalloutPosition: Rectangle;
-    let {
-      alignmentEdge,
-      targetEdge
-    } = positionData;
-    const calloutEdge = coverTarget ? targetEdge : targetEdge * -1;
-    estimatedCalloutPosition = coverTarget ? _alignEdges(callout, target, targetEdge, gap) :
-      _alignOppositeEdges(callout, target, targetEdge, gap);
-    // if no alignment edge is provided it's supposed to be centered.
-    if (!alignmentEdge) {
-      const targetMiddlePoint = _getCenterValue(target, targetEdge);
-      estimatedCalloutPosition = centerEdgeToPoint(estimatedCalloutPosition, calloutEdge, targetMiddlePoint);
-
-    } else {
-      estimatedCalloutPosition = _alignEdges(estimatedCalloutPosition, target, alignmentEdge);
-    }
-
-    return estimatedCalloutPosition;
-  }
-
-  /**
-   * Returns the non-opposite edges of the target edge.
-   * For instance if bottom is passed in then left and right will be returned.
-   *
-   * @param {RectangleEdge} edge
-   * @returns {{ firstEdge: RectangleEdge, secondEdge: RectangleEdge }}
-   */
-  function _getFlankingEdges(edge: RectangleEdge): { firstEdge: RectangleEdge, secondEdge: RectangleEdge } {
-    if (edge === RectangleEdge.top || edge === RectangleEdge.bottom) {
-      return {
-        firstEdge: RectangleEdge.left,
-        secondEdge: RectangleEdge.right
-      };
-    } else {
-      return {
-        firstEdge: RectangleEdge.top,
-        secondEdge: RectangleEdge.bottom
-      };
-    }
-  }
-
-  /**
-   * Finalizes the callout positon based on the hostElement. Only returns the
-   * rectangle values to position such that they are anchored to the target.
-   * This helps prevent resizing from looking very strange.
-   * For instance, if the target edge is top and aligned with the left side then
-   * the bottom and left values are returned so as the callou shrinks it shrinks towards that corner.
-   *
-   * @param {Rectangle} calloutRectangle
-   * @param {HTMLElement} hostElement
-   * @param {RectangleEdge} targetEdge
-   * @param {RectangleEdge} [alignmentEdge]
-   * @returns {IPartialIRectangle}
-   */
-  function _finalizeCalloutPosition(
-    calloutRectangle: Rectangle,
-    hostElement: HTMLElement,
-    targetEdge: RectangleEdge,
-    alignmentEdge?: RectangleEdge
-  ): IPartialIRectangle {
-    let returnValue: IPartialIRectangle = {};
-
-    const hostRect: Rectangle = _getRectangleFromHTMLElement(hostElement);
-    const calloutEdge = targetEdge * -1;
-    const calloutEdgeString = RectangleEdge[calloutEdge];
-    const returnEdge = alignmentEdge ? alignmentEdge : _getFlankingEdges(targetEdge).firstEdge;
-
-    returnValue[calloutEdgeString] = _getRelativeEdgeDifference(calloutRectangle, hostRect, calloutEdge);
-    returnValue[RectangleEdge[returnEdge]] = _getRelativeEdgeDifference(calloutRectangle, hostRect, returnEdge);
-
-    return returnValue;
-  }
-
-  // Since the beak is rotated 45 degrees the actual height/width is the length of the diagonal.
-  // We still want to position the beak based on it's midpoint which does not change. It will
-  // be at (beakwidth / 2, beakwidth / 2)
-  export function _calculateActualBeakWidthInPixels(beakWidth: number): number {
-    return Math.sqrt(beakWidth * beakWidth * 2);
-  }
-
-  /**
-   * Returns the appropriate IPositionData based on the props altered for RTL.
-   * If directionalHintForRTL is passed in that is used if the page is RTL.
-   * If a directionalHint is specified and no directionalHintForRTL is available and the page is RTL the hint will be flipped.
-   * For instance bottomLeftEdge would become bottomRightEdge.
-   * If there is no directionalHint passed in bottomAutoEdge is chosen automatically.
-   *
-   * @param {IPositionProps} props
-   * @returns {IPositionData}
-   */
-  export function _getPositionData(
-    directionalHint: DirectionalHint = DirectionalHint.bottomAutoEdge,
-    directionalHintForRTL?: DirectionalHint
-  ): IPositionData {
-    let positionInformation: IPositionData = { ...DirectionalDictionary[directionalHint] };
-    if (getRTL()) {
-      // If alignment edge exists and that alignment edge is -2 or 2, right or left, then flip it.
-      positionInformation.alignmentEdge = positionInformation.alignmentEdge && positionInformation.alignmentEdge % 2 === 0
-        ? positionInformation.alignmentEdge * -1 : undefined;
-      return directionalHintForRTL !== undefined ?
-        DirectionalDictionary[directionalHintForRTL] :
-        positionInformation;
-    }
-    return positionInformation;
-  }
-
-  /**
-   * Get's the alignment data for the given information. This only really matters if the positioning is Auto.
-   * If it is auto then the alignmentEdge should be chosen based on the target edge's position relative to
-   * the center of the page.
-   *
-   * @param {IPositionData} positionData
-   * @param {Rectangle} target
-   * @param {Rectangle} boundingRect
-   * @param {boolean} [coverTarget]
-   * @returns {IPositionData}
-   */
-  function _getAlignmentData(positionData: IPositionData, target: Rectangle, boundingRect: Rectangle, coverTarget?: boolean): IPositionData {
-    if (positionData.isAuto) {
-      let center: number = _getCenterValue(target, positionData.targetEdge);
-
-      if (center <= boundingRect.width / 2) {
-        positionData.alignmentEdge = RectangleEdge.left;
-      } else {
-        positionData.alignmentEdge = RectangleEdge.right;
-      }
-    }
-
-    return positionData;
-  }
-
-  export function _positionCalloutWithinBounds(
-    callout: Rectangle,
-    target: Rectangle,
-    bounding: Rectangle,
-    positionData: IPositionData,
-    gap: number,
-    directionalHintFixed?: boolean,
-    coverTarget?: boolean): ICallout {
-    let estimatedCalloutPosition: Rectangle = _estimatePosition(callout, target, positionData, gap, coverTarget);
-    if (_isRectangleWithinBounds(estimatedCalloutPosition, bounding)) {
-      return {
-        calloutRectangle: estimatedCalloutPosition,
-        targetEdge: positionData.targetEdge,
-        alignmentEdge: positionData.alignmentEdge
-      };
-    } else {
-      return _adjustFitWithinBounds(callout, target, bounding, positionData, gap, directionalHintFixed, coverTarget);
-    }
-  }
-
-  export function _positionBeak(beakWidth: number,
-    callout: ICallout,
-    target: Rectangle,
-    alignmentEdge?: RectangleEdge) {
-    /** Note about beak positioning: The actual beak width only matters for getting the gap between the callout and target, it does not impact the beak placement within the callout. For example example, if the beakWidth is 8, then the actual beakWidth is sqrroot(8^2 + 8^2) = 11.31x11.31. So the callout will need to be an extra 3 pixels away from its target. While the beak is being positioned in the callout it still acts as though it were 8x8.*/
-    const { firstEdge, secondEdge } = _getFlankingEdges(callout.targetEdge);
-    const beakTargetPoint = _getCenterValue(target, callout.targetEdge);
-    // The "host" callout that we will use to help position the beak.
-    const actualCallout = new Rectangle(0, callout.calloutRectangle.width, 0, callout.calloutRectangle.height);
-
-    const calloutBounds = new Rectangle(
-      beakWidth / 2,
-      callout.calloutRectangle.width - beakWidth / 2,
-      beakWidth / 2,
-      callout.calloutRectangle.height - beakWidth / 2
-    );
-
-    let beakPositon: Rectangle = new Rectangle(0, beakWidth, 0, beakWidth);
-
-    beakPositon = _moveEdge(beakPositon, (callout.targetEdge * -1), -beakWidth / 2);
-
-    beakPositon = centerEdgeToPoint(beakPositon, callout.targetEdge * -1,
-      beakTargetPoint - _getRelativeRectEdgeValue(firstEdge, callout.calloutRectangle));
-
-    if (!_isEdgeInBounds(beakPositon, calloutBounds, firstEdge)) {
-      beakPositon = _alignEdges(beakPositon, calloutBounds, firstEdge);
-    } else if (!_isEdgeInBounds(beakPositon, calloutBounds, secondEdge)) {
-      beakPositon = _alignEdges(beakPositon, calloutBounds, secondEdge);
-    }
-
-    const targetEdge = callout.targetEdge * -1;
-
-    const returnEdge = alignmentEdge ? alignmentEdge : _getFlankingEdges(targetEdge).firstEdge;
-    let returnValue: IPartialIRectangle = {};
-
-    returnValue[RectangleEdge[targetEdge]] = _getEdgeValue(beakPositon, targetEdge);
-    returnValue[RectangleEdge[returnEdge]] = _getRelativeEdgeDifference(beakPositon, actualCallout, returnEdge);
-
-    return returnValue;
-  }
-
-  export function _getRectangleFromHTMLElement(element: HTMLElement): Rectangle {
-    let clientRect: ClientRect = element.getBoundingClientRect();
-
-    return new Rectangle(clientRect.left, clientRect.right, clientRect.top, clientRect.bottom);
-  }
-
-  export function _getRectangleFromIRect(rect: IRectangle): Rectangle {
-    return new Rectangle(rect.left, rect.right, rect.top, rect.bottom);
-  }
-
-  export function _getTargetRect(bounds: Rectangle, target: HTMLElement | MouseEvent | IPoint | undefined) {
-    let targetRectangle: Rectangle;
-    if (target) {
-      if ((target as MouseEvent).preventDefault) {
-        let ev: MouseEvent = target as MouseEvent;
-        targetRectangle = new Rectangle(ev.clientX, ev.clientX, ev.clientY, ev.clientY);
-      } else if ((target as IPoint).x !== undefined) {
-        let point: IPoint = target as IPoint;
-        targetRectangle = new Rectangle(point.x, point.x, point.y, point.y);
-      } else {
-        targetRectangle = _getRectangleFromHTMLElement(target as HTMLElement);
-      }
-
-      if (!_isRectangleWithinBounds(targetRectangle, bounds)) {
-        let outOfBounds: RectangleEdge[] = _getOutOfBoundsEdges(targetRectangle, bounds);
-
-        for (let direction of outOfBounds) {
-          (targetRectangle as any)[RectangleEdge[direction]] = (bounds as any)[RectangleEdge[direction]];
-        }
-      }
-    } else {
-      targetRectangle = new Rectangle(0, 0, 0, 0);
-    }
-
-    return targetRectangle;
-  }
-
-  /**
-   * If max height is less than zero it returns the bounds height instead.
-   */
-  export function _getMaxHeightFromTargetRectangle(targetRectangle: Rectangle, targetEdge: DirectionalHint, gapSpace: number, bounds: Rectangle) {
-    let maxHeight = 0;
-
-    switch (targetEdge) {
-      case DirectionalHint.bottomAutoEdge:
-      case DirectionalHint.bottomCenter:
-      case DirectionalHint.bottomLeftEdge:
-      case DirectionalHint.bottomRightEdge:
-        maxHeight = bounds.bottom - targetRectangle.bottom - gapSpace;
-        break;
-      case DirectionalHint.topAutoEdge:
-      case DirectionalHint.topCenter:
-      case DirectionalHint.topLeftEdge:
-      case DirectionalHint.topRightEdge:
-        maxHeight = targetRectangle.top - bounds.top - gapSpace;
-        break;
-      default:
-        maxHeight = bounds.bottom - targetRectangle.top - gapSpace;
-        break;
-    }
-
-    return maxHeight > 0 ? maxHeight : bounds.height;
-  }
-
-  export function _getRelativePositions(
-    props: IPositionProps,
-    hostElement: HTMLElement,
-    calloutElement: HTMLElement): IPositionInfo {
-    const beakWidth: number = !props.isBeakVisible ? 0 : (props.beakWidth || 0);
-    const gap: number = _calculateActualBeakWidthInPixels(beakWidth) / 2 + (props.gapSpace ? props.gapSpace : 0);
-    const boundingRect: Rectangle = props.bounds ?
-      _getRectangleFromIRect(props.bounds) :
-      new Rectangle(0, window.innerWidth - getScrollbarWidth(), 0, window.innerHeight);
-    const targetRect: Rectangle = _getTargetRect(boundingRect, props.target);
-    const positionData: IPositionData = _getAlignmentData(
-      _getPositionData(props.directionalHint, props.directionalHintForRTL)!,
-      targetRect,
-      boundingRect,
-      props.coverTarget);
-    const positionedCallout: ICallout = _positionCalloutWithinBounds(
-      _getRectangleFromHTMLElement(calloutElement),
-      targetRect,
-      boundingRect,
-      positionData,
-      gap,
-      props.directionalHintFixed,
-      props.coverTarget);
-    const beakPositioned: IPartialIRectangle = _positionBeak(
-      beakWidth,
-      positionedCallout,
-      targetRect,
-      positionedCallout.alignmentEdge);
-    const finalizedCallout: IPartialIRectangle = _finalizeCalloutPosition(
-      positionedCallout.calloutRectangle,
-      hostElement,
-      positionedCallout.targetEdge,
-      positionedCallout.alignmentEdge);
-    return {
-      calloutPosition: finalizedCallout,
-      beakPosition: { position: { ...beakPositioned }, display: 'block' },
-      directionalClassName: SLIDE_ANIMATIONS[positionedCallout.targetEdge],
-      submenuDirection: (positionedCallout.targetEdge * -1) === RectangleEdge.right ? DirectionalHint.leftBottomEdge : DirectionalHint.rightBottomEdge
-    };
-  }
-}
-
-export function getRelativePositions(props: IPositionProps,
-  hostElement: HTMLElement,
-  calloutElement: HTMLElement) {
-  return positioningFunctions._getRelativePositions(props, hostElement, calloutElement);
-}
-
-/**
- * Get's the maximum height that a rectangle can have in order to fit below or above a target.
- * If the directional hint specifies a left or right edge (i.e. leftCenter) it will limit the height to the topBorder
- * of the target given.
- * If no bounds are provided then the window is treated as the bounds.
- */
-export function getMaxHeight(target: HTMLElement | MouseEvent | IPoint, targetEdge: DirectionalHint, gapSpace: number = 0, bounds?: IRectangle) {
-  let mouseTarget: MouseEvent = target as MouseEvent;
-  let elementTarget: HTMLElement = target as HTMLElement;
-  let pointTarget: IPoint = target as IPoint;
-  let targetRect: Rectangle;
-  let boundingRectangle = bounds ?
-    positioningFunctions._getRectangleFromIRect(bounds) :
-    new Rectangle(0, window.innerWidth - getScrollbarWidth(), 0, window.innerHeight);
-
-  if (mouseTarget.stopPropagation) {
-    targetRect = new Rectangle(mouseTarget.clientX, mouseTarget.clientX, mouseTarget.clientY, mouseTarget.clientY);
-  } else if (pointTarget.x !== undefined && pointTarget.y !== undefined) {
-    targetRect = new Rectangle(pointTarget.x, pointTarget.x, pointTarget.y, pointTarget.y);
-  } else {
-    targetRect = positioningFunctions._getRectangleFromHTMLElement(elementTarget);
-  }
-
-  return positioningFunctions._getMaxHeightFromTargetRectangle(targetRect, targetEdge, gapSpace, boundingRectangle);
-}
\ No newline at end of file
+export * from './positioning/index';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning/index.ts b/packages/office-ui-fabric-react/src/utilities/positioning/index.ts
new file mode 100644
index 0000000000000..cc241c8ec179d
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/utilities/positioning/index.ts
@@ -0,0 +1,2 @@
+export * from './positioning';
+export * from './positioning.types';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts b/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts
new file mode 100644
index 0000000000000..a2730bddff5b1
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts
@@ -0,0 +1,779 @@
+
+import { DirectionalHint } from '../../common/DirectionalHint';
+import {
+  getScrollbarWidth,
+  getRTL,
+  Rectangle as FullRectangle,
+  IRectangle
+} from '../../Utilities';
+import {
+  IPositionDirectionalHintData,
+  IPositionedData,
+  IPoint,
+  ICalloutPositionedInfo,
+  ICalloutBeakPositionedInfo,
+  IPositionProps,
+  ICalloutPositon,
+  ICalloutPositionProps,
+  RectangleEdge
+} from './positioning.types';
+
+export class Rectangle extends FullRectangle {
+  [key: string]: number | boolean | any;
+}
+
+function _createPositionData(
+  targetEdge: RectangleEdge,
+  alignmentEdge?: RectangleEdge,
+  isAuto?: boolean): IPositionDirectionalHintData {
+  return {
+    targetEdge: targetEdge,
+    alignmentEdge: alignmentEdge,
+    isAuto: isAuto
+  };
+}
+
+// Currently the beakPercent is set to 50 for all positions meaning that it should tend to the center of the target
+let DirectionalDictionary: { [key: number]: IPositionDirectionalHintData } = {
+  [DirectionalHint.topLeftEdge]: _createPositionData(RectangleEdge.top, RectangleEdge.left),
+  [DirectionalHint.topCenter]: _createPositionData(RectangleEdge.top),
+  [DirectionalHint.topRightEdge]: _createPositionData(RectangleEdge.top, RectangleEdge.right),
+  [DirectionalHint.topAutoEdge]: _createPositionData(RectangleEdge.top, undefined, true),
+  [DirectionalHint.bottomLeftEdge]: _createPositionData(RectangleEdge.bottom, RectangleEdge.left),
+  [DirectionalHint.bottomCenter]: _createPositionData(RectangleEdge.bottom),
+  [DirectionalHint.bottomRightEdge]: _createPositionData(RectangleEdge.bottom, RectangleEdge.right),
+  [DirectionalHint.bottomAutoEdge]: _createPositionData(RectangleEdge.bottom, undefined, true),
+  [DirectionalHint.leftTopEdge]: _createPositionData(RectangleEdge.left, RectangleEdge.top),
+  [DirectionalHint.leftCenter]: _createPositionData(RectangleEdge.left),
+  [DirectionalHint.leftBottomEdge]: _createPositionData(RectangleEdge.left, RectangleEdge.bottom),
+  [DirectionalHint.rightTopEdge]: _createPositionData(RectangleEdge.right, RectangleEdge.top),
+  [DirectionalHint.rightCenter]: _createPositionData(RectangleEdge.right),
+  [DirectionalHint.rightBottomEdge]: _createPositionData(RectangleEdge.right, RectangleEdge.bottom)
+};
+
+/**
+ * @deprecated will be removed in 6.0.
+ */
+const SLIDE_ANIMATIONS: { [key: number]: string; } = {
+  [RectangleEdge.top]: 'slideUpIn20',
+  [RectangleEdge.bottom]: 'slideDownIn20',
+  [RectangleEdge.left]: 'slideLeftIn20',
+  [RectangleEdge.right]: 'slideRightIn20'
+};
+/**
+ * Do not call methods from this directly, use either positionCallout or positionElement or make another function that
+ * utilizes them.
+ */
+export module positioningFunctions {
+
+  export interface IElementPosition {
+    elementRectangle: Rectangle;
+    targetEdge: RectangleEdge;
+    alignmentEdge: RectangleEdge | undefined;
+  }
+
+  export interface IElementPositionInfo extends IElementPosition {
+    targetRectangle: Rectangle;
+  }
+
+  export type PartialIRectangle = Partial<IRectangle>;
+
+  export interface IPartialIRectangle extends PartialIRectangle {
+    [key: string]: number | undefined;
+  }
+
+  function _isRectangleWithinBounds(rect: Rectangle, boundingRect: Rectangle): boolean {
+    if (rect.top < boundingRect.top) {
+      return false;
+    }
+    if (rect.bottom > boundingRect.bottom) {
+      return false;
+    }
+    if (rect.left < boundingRect.left) {
+      return false;
+    }
+    if (rect.right > boundingRect.right) {
+      return false;
+    }
+
+    return true;
+  }
+
+  /**
+   * Gets all of the edges of a rectangle that are outside of the given bounds.
+   * If there are no out of bounds edges it returns an empty array.
+   */
+  function _getOutOfBoundsEdges(rect: Rectangle, boundingRect: Rectangle): RectangleEdge[] {
+    let outOfBounds: RectangleEdge[] = new Array<RectangleEdge>();
+
+    if (rect.top < boundingRect.top) {
+      outOfBounds.push(RectangleEdge.top);
+    }
+    if (rect.bottom > boundingRect.bottom) {
+      outOfBounds.push(RectangleEdge.bottom);
+    }
+    if (rect.left < boundingRect.left) {
+      outOfBounds.push(RectangleEdge.left);
+    }
+    if (rect.right > boundingRect.right) {
+      outOfBounds.push(RectangleEdge.right);
+    }
+
+    return outOfBounds;
+  }
+
+  function _getEdgeValue(rect: Rectangle, edge: RectangleEdge): number {
+    return rect[RectangleEdge[edge]];
+  }
+
+  function _setEdgeValue(rect: Rectangle, edge: RectangleEdge, value: number) {
+    rect[RectangleEdge[edge]] = value;
+    return rect;
+  }
+
+  /**
+   * Returns the middle value of an edge. Only returns 1 value rather than xy coordinates as
+   * the itself already contains the other coordinate.
+   * For instance, a bottom edge's current value is it's y coordinate, so the number returned is the x.
+   *
+   * @param {Rectangle} rect
+   * @param {RectangleEdge} edge
+   * @returns {number}
+   */
+  function _getCenterValue(rect: Rectangle, edge: RectangleEdge): number {
+    const edges = _getFlankingEdges(edge);
+    return (_getEdgeValue(rect, edges.positiveEdge) + _getEdgeValue(rect, edges.negativeEdge)) / 2;
+  }
+
+  /**
+   * Flips the value depending on the edge.
+   * If the edge is a "positive" edge, Top or Left, then the value should stay as it is.
+   * If the edge is a "negative" edge, Bottom or Right, then the value should be flipped.
+   * This is to account for the fact that the coordinates are effectively reveserved in certain cases for the "negative" edges.
+   * For example, when testing to see if a bottom edge 1 is within the bounds of another bottom edge 2.
+   * If edge 1 is greater than edge 2 then it is out of bounds. This is reversed for top edge 1 and top edge 2.
+   * If top edge 1 is less than edge 2 then it is out of bounds.
+   *
+   *
+   * @param {RectangleEdge} edge
+   * @param {number} value
+   * @returns {number}
+   */
+  function _getRelativeEdgeValue(edge: RectangleEdge, value: number): number {
+    if (edge > 0) {
+      return value;
+    } else {
+      return value * -1;
+    }
+  }
+
+  function _getRelativeRectEdgeValue(edge: RectangleEdge, rect: Rectangle): number {
+    return _getRelativeEdgeValue(edge, _getEdgeValue(rect, edge));
+  }
+
+  function _getRelativeEdgeDifference(rect: Rectangle, hostRect: Rectangle, edge: RectangleEdge): number {
+    const edgeDifference = _getEdgeValue(rect, edge) - _getEdgeValue(hostRect, edge);
+    return _getRelativeEdgeValue(edge, edgeDifference);
+  }
+
+  /**
+   * Moves the edge of a rectangle to the value given. It only moves the edge in a linear direction based on that edge.
+   * For example, if it's a bottom edge it will only change y coordinates.
+   *
+   * @param {Rectangle} rect
+   * @param {RectangleEdge} edge
+   * @param {number} newValue
+   * @returns {Rectangle}
+   */
+  function _moveEdge(rect: Rectangle, edge: RectangleEdge, newValue: number): Rectangle {
+    const difference = _getEdgeValue(rect, edge) - newValue;
+    rect = _setEdgeValue(rect, edge, newValue);
+    rect = _setEdgeValue(rect, edge * -1, _getEdgeValue(rect, edge * -1) - difference);
+    return rect;
+  }
+
+  /**
+   * Aligns the edge on the passed in rect to the target. If there is a gap then it will have that space between the two.
+   *
+   * @param {Rectangle} rect
+   * @param {Rectangle} target
+   * @param {RectangleEdge} edge
+   * @param {number} [gap=0]
+   * @returns {Rectangle}
+   */
+  function _alignEdges(rect: Rectangle, target: Rectangle, edge: RectangleEdge, gap: number = 0): Rectangle {
+    return _moveEdge(rect, edge, _getEdgeValue(target, edge) + _getRelativeEdgeValue(edge, gap));
+  }
+
+  /**
+   * Aligns the targetEdge on the passed in target to the rects corresponding opposite edge.
+   * For instance if targetEdge is bottom, then the rects top will be moved to match it.
+   *
+   * @param {Rectangle} rect
+   * @param {Rectangle} target
+   * @param {RectangleEdge} targetEdge
+   * @param {number} [gap=0]
+   * @returns {Rectangle}
+   */
+  function _alignOppositeEdges(rect: Rectangle, target: Rectangle, targetEdge: RectangleEdge, gap: number = 0): Rectangle {
+    const oppositeEdge = targetEdge * -1;
+    const adjustedGap = _getRelativeEdgeValue(oppositeEdge, gap);
+    return _moveEdge(rect, targetEdge * -1, _getEdgeValue(target, targetEdge) + adjustedGap);
+  }
+
+  /**
+   * Tests to see if the given edge is within the bounds of the given rectangle.
+   *
+   * @param {Rectangle} rect
+   * @param {Rectangle} bounds
+   * @param {RectangleEdge} edge
+   * @returns {boolean}
+   */
+  function _isEdgeInBounds(rect: Rectangle, bounds: Rectangle, edge: RectangleEdge): boolean {
+    const adjustedRectValue = _getRelativeRectEdgeValue(edge, rect);
+    return adjustedRectValue > _getRelativeRectEdgeValue(edge, bounds);
+  }
+
+  /**
+   * Attempts to move the rectangle through various sides of the target to find a place to fit.
+   * If no fit is found, the original position should be returned.
+   *
+   * @param {Rectangle} rect
+   * @param {Rectangle} target
+   * @param {Rectangle} bounding
+   * @param {IPositionDirectionalHintData} positionData
+   * @param {number} [gap=0]
+   * @returns {IElementPosition}
+   */
+  function _flipToFit(rect: Rectangle,
+    target: Rectangle,
+    bounding: Rectangle,
+    positionData: IPositionDirectionalHintData,
+    gap: number = 0, ): IElementPosition {
+    let directions: RectangleEdge[] = [RectangleEdge.left, RectangleEdge.right, RectangleEdge.bottom, RectangleEdge.top];
+    let currentEstimate = rect;
+    let currentEdge = positionData.targetEdge;
+    let currentAlignment = positionData.alignmentEdge;
+    // Keep switching sides until one is found with enough space. If all sides don't fit then return the unmodified element.
+    for (let i = 0; i < 4; i++) {
+      if (!_isEdgeInBounds(currentEstimate, bounding, currentEdge)) {
+        directions.splice(directions.indexOf(currentEdge), 1);
+        if (directions.indexOf(currentEdge * -1) > -1) {
+          currentEdge = currentEdge * -1;
+        } else {
+          currentAlignment = currentEdge;
+          currentEdge = directions.slice(-1)[0];
+        }
+        currentEstimate = _estimatePosition(rect, target, { targetEdge: currentEdge, alignmentEdge: currentAlignment }, gap);
+      } else {
+        return {
+          elementRectangle: currentEstimate,
+          targetEdge: currentEdge,
+          alignmentEdge: currentAlignment
+        };
+      }
+    }
+    return {
+      elementRectangle: rect,
+      targetEdge: positionData.targetEdge,
+      alignmentEdge: currentAlignment
+    };
+  }
+
+  /**
+   * Adjusts a element rectangle to fit within the bounds given. If directionalHintFixed or covertarget is passed in
+   * then the element will not flip sides on the target. They will, however, be nudged to fit within the bounds given.
+   *
+   * @param {Rectangle} element
+   * @param {Rectangle} target
+   * @param {Rectangle} bounding
+   * @param {IPositionDirectionalHintData} positionData
+   * @param {number} [gap=0]
+   * @param {boolean} [directionalHintFixed]
+   * @param {boolean} [coverTarget]
+   * @returns {IElementPosition}
+   */
+  function _adjustFitWithinBounds(
+    element: Rectangle,
+    target: Rectangle,
+    bounding: Rectangle,
+    positionData: IPositionDirectionalHintData,
+    gap: number = 0,
+    directionalHintFixed?: boolean,
+    coverTarget?: boolean): IElementPosition {
+
+    let {
+      alignmentEdge
+    } = positionData;
+    let elementEstimate: IElementPosition = {
+      elementRectangle: element,
+      targetEdge: positionData.targetEdge,
+      alignmentEdge: alignmentEdge
+    };
+
+    if (!directionalHintFixed && !coverTarget) {
+      elementEstimate = _flipToFit(element, target, bounding, positionData, gap);
+    }
+
+    let outOfBounds = _getOutOfBoundsEdges(element, bounding);
+
+    for (const direction of outOfBounds) {
+      elementEstimate.elementRectangle = _alignEdges(elementEstimate.elementRectangle, bounding, direction);
+    }
+
+    return elementEstimate;
+  }
+
+  /**
+   * Moves the middle point on an edge to the point given.
+   * Only moves in one direction. For instance if a bottom edge is passed in, then
+   * the bottom edge will be moved in the x axis to match the point.
+   *
+   * @param {Rectangle} rect
+   * @param {RectangleEdge} edge
+   * @param {number} point
+   * @returns {Rectangle}
+   */
+  function _centerEdgeToPoint(rect: Rectangle, edge: RectangleEdge, point: number): Rectangle {
+    const { positiveEdge } = _getFlankingEdges(edge);
+    const elementMiddle = _getCenterValue(rect, edge);
+    const distanceToMiddle = elementMiddle - _getEdgeValue(rect, positiveEdge);
+    return _moveEdge(rect, positiveEdge, point - distanceToMiddle);
+  }
+
+  /**
+   * Moves the element rectangle to be appropriately positioned relative to a given target.
+   * Does not flip or adjust the element.
+   *
+   * @param {Rectangle} elementToPosition
+   * @param {Rectangle} target
+   * @param {IPositionDirectionalHintData} positionData
+   * @param {number} [gap=0]
+   * @param {boolean} [coverTarget]
+   * @returns {Rectangle}
+   */
+  function _estimatePosition(
+    elementToPosition: Rectangle,
+    target: Rectangle,
+    positionData: IPositionDirectionalHintData,
+    gap: number = 0,
+    coverTarget?: boolean
+  ): Rectangle {
+    let estimatedElementPosition: Rectangle;
+    let {
+      alignmentEdge,
+      targetEdge
+    } = positionData;
+    const elementEdge = coverTarget ? targetEdge : targetEdge * -1;
+    estimatedElementPosition = coverTarget ? _alignEdges(elementToPosition, target, targetEdge, gap) :
+      _alignOppositeEdges(elementToPosition, target, targetEdge, gap);
+    // if no alignment edge is provided it's supposed to be centered.
+    if (!alignmentEdge) {
+      const targetMiddlePoint = _getCenterValue(target, targetEdge);
+      estimatedElementPosition = _centerEdgeToPoint(estimatedElementPosition, elementEdge, targetMiddlePoint);
+
+    } else {
+      estimatedElementPosition = _alignEdges(estimatedElementPosition, target, alignmentEdge);
+    }
+
+    return estimatedElementPosition;
+  }
+
+  /**
+   * Returns the non-opposite edges of the target edge.
+   * For instance if bottom is passed in then left and right will be returned.
+   *
+   * @param {RectangleEdge} edge
+   * @returns {{ firstEdge: RectangleEdge, secondEdge: RectangleEdge }}
+   */
+  function _getFlankingEdges(edge: RectangleEdge): { positiveEdge: RectangleEdge, negativeEdge: RectangleEdge } {
+    if (edge === RectangleEdge.top || edge === RectangleEdge.bottom) {
+      return {
+        positiveEdge: RectangleEdge.left,
+        negativeEdge: RectangleEdge.right
+      };
+    } else {
+      return {
+        positiveEdge: RectangleEdge.top,
+        negativeEdge: RectangleEdge.bottom
+      };
+    }
+  }
+
+  /**
+   * Finalizes the element positon based on the hostElement. Only returns the
+   * rectangle values to position such that they are anchored to the target.
+   * This helps prevent resizing from looking very strange.
+   * For instance, if the target edge is top and aligned with the left side then
+   * the bottom and left values are returned so as the callou shrinks it shrinks towards that corner.
+   *
+   * @param {Rectangle} elementRectangle
+   * @param {HTMLElement} hostElement
+   * @param {RectangleEdge} targetEdge
+   * @param {RectangleEdge} [alignmentEdge]
+   * @returns {IPartialIRectangle}
+   */
+  function _finalizeElementPosition(
+    elementRectangle: Rectangle,
+    hostElement: HTMLElement,
+    targetEdge: RectangleEdge,
+    alignmentEdge?: RectangleEdge
+  ): IPartialIRectangle {
+    let returnValue: IPartialIRectangle = {};
+
+    const hostRect: Rectangle = _getRectangleFromHTMLElement(hostElement);
+    const elementEdge = targetEdge * -1;
+    const elementEdgeString = RectangleEdge[elementEdge];
+    const returnEdge = alignmentEdge ? alignmentEdge : _getFlankingEdges(targetEdge).positiveEdge;
+
+    returnValue[elementEdgeString] = _getRelativeEdgeDifference(elementRectangle, hostRect, elementEdge);
+    returnValue[RectangleEdge[returnEdge]] = _getRelativeEdgeDifference(elementRectangle, hostRect, returnEdge);
+
+    return returnValue;
+  }
+
+  // Since the beak is rotated 45 degrees the actual height/width is the length of the diagonal.
+  // We still want to position the beak based on it's midpoint which does not change. It will
+  // be at (beakwidth / 2, beakwidth / 2)
+  export function _calculateActualBeakWidthInPixels(beakWidth: number): number {
+    return Math.sqrt(beakWidth * beakWidth * 2);
+  }
+
+  /**
+   * Returns the appropriate IPositionData based on the props altered for RTL.
+   * If directionalHintForRTL is passed in that is used if the page is RTL.
+   * If a directionalHint is specified and no directionalHintForRTL is available and the page is RTL the hint will be flipped.
+   * For instance bottomLeftEdge would become bottomRightEdge.
+   * If there is no directionalHint passed in bottomAutoEdge is chosen automatically.
+   *
+   * @param {IPositionProps} props
+   * @returns {IPositionDirectionalHintData}
+   */
+  export function _getPositionData(
+    directionalHint: DirectionalHint = DirectionalHint.bottomAutoEdge,
+    directionalHintForRTL?: DirectionalHint
+  ): IPositionDirectionalHintData {
+    let positionInformation: IPositionDirectionalHintData = { ...DirectionalDictionary[directionalHint] };
+    if (getRTL()) {
+      // If alignment edge exists and that alignment edge is -2 or 2, right or left, then flip it.
+      positionInformation.alignmentEdge = positionInformation.alignmentEdge && positionInformation.alignmentEdge % 2 === 0
+        ? positionInformation.alignmentEdge * -1 : undefined;
+      return directionalHintForRTL !== undefined ?
+        DirectionalDictionary[directionalHintForRTL] :
+        positionInformation;
+    }
+    return positionInformation;
+  }
+
+  /**
+   * Get's the alignment data for the given information. This only really matters if the positioning is Auto.
+   * If it is auto then the alignmentEdge should be chosen based on the target edge's position relative to
+   * the center of the page.
+   *
+   * @param {IPositionDirectionalHintData} positionData
+   * @param {Rectangle} target
+   * @param {Rectangle} boundingRect
+   * @param {boolean} [coverTarget]
+   * @returns {IPositionDirectionalHintData}
+   */
+  function _getAlignmentData(positionData: IPositionDirectionalHintData, target: Rectangle, boundingRect: Rectangle, coverTarget?: boolean): IPositionDirectionalHintData {
+    if (positionData.isAuto) {
+      positionData.alignmentEdge = getClosestEdge(positionData.targetEdge, target, boundingRect);
+    }
+
+    return positionData;
+  }
+
+  function getClosestEdge(targetEdge: RectangleEdge, target: Rectangle, boundingRect: Rectangle): RectangleEdge {
+    const targetCenter: number = _getCenterValue(target, targetEdge);
+    const boundingCenter: number = _getCenterValue(boundingRect, targetEdge);
+    const { positiveEdge, negativeEdge } = _getFlankingEdges(targetEdge);
+    if (targetCenter <= boundingCenter) {
+      return positiveEdge;
+    } else {
+      return negativeEdge;
+    }
+  }
+
+  export function _positionElementWithinBounds(
+    elementToPosition: Rectangle,
+    target: Rectangle,
+    bounding: Rectangle,
+    positionData: IPositionDirectionalHintData,
+    gap: number,
+    directionalHintFixed?: boolean,
+    coverTarget?: boolean): IElementPosition {
+    let estimatedElementPosition: Rectangle = _estimatePosition(elementToPosition, target, positionData, gap, coverTarget);
+    if (_isRectangleWithinBounds(estimatedElementPosition, bounding)) {
+      return {
+        elementRectangle: estimatedElementPosition,
+        targetEdge: positionData.targetEdge,
+        alignmentEdge: positionData.alignmentEdge
+      };
+    } else {
+      return _adjustFitWithinBounds(elementToPosition, target, bounding, positionData, gap, directionalHintFixed, coverTarget);
+    }
+  }
+
+  export function _finalizeBeakPosition(elementPosition: IElementPosition,
+    positionedBeak: Rectangle): ICalloutBeakPositionedInfo {
+    const targetEdge = elementPosition.targetEdge * -1;
+    // The "host" element that we will use to help position the beak.
+    const actualElement = new Rectangle(0, elementPosition.elementRectangle.width, 0, elementPosition.elementRectangle.height);
+    const returnEdge = elementPosition.alignmentEdge ? elementPosition.alignmentEdge : _getFlankingEdges(targetEdge).positiveEdge;
+    let returnValue: IPartialIRectangle = {};
+
+    returnValue[RectangleEdge[targetEdge]] = _getEdgeValue(positionedBeak, targetEdge);
+    returnValue[RectangleEdge[returnEdge]] = _getRelativeEdgeDifference(positionedBeak, actualElement, returnEdge);
+
+    return {
+      elementPosition: { ...returnValue },
+      closestEdge: getClosestEdge(elementPosition.targetEdge, positionedBeak, actualElement),
+      targetEdge: targetEdge
+    };
+  }
+
+  export function _positionBeak(beakWidth: number,
+    elementPosition: IElementPositionInfo
+  ): Rectangle {
+    const target = elementPosition.targetRectangle;
+    /** Note about beak positioning: The actual beak width only matters for getting the gap between the callout and target, it does not impact the beak placement within the callout. For example example, if the beakWidth is 8, then the actual beakWidth is sqrroot(8^2 + 8^2) = 11.31x11.31. So the callout will need to be an extra 3 pixels away from its target. While the beak is being positioned in the callout it still acts as though it were 8x8.*/
+    const { positiveEdge, negativeEdge } = _getFlankingEdges(elementPosition.targetEdge);
+    const beakTargetPoint = _getCenterValue(target, elementPosition.targetEdge);
+    const elementBounds = new Rectangle(
+      beakWidth / 2,
+      elementPosition.elementRectangle.width - beakWidth / 2,
+      beakWidth / 2,
+      elementPosition.elementRectangle.height - beakWidth / 2
+    );
+
+    let beakPositon: Rectangle = new Rectangle(0, beakWidth, 0, beakWidth);
+
+    beakPositon = _moveEdge(beakPositon, (elementPosition.targetEdge * -1), -beakWidth / 2);
+
+    beakPositon = _centerEdgeToPoint(beakPositon, elementPosition.targetEdge * -1,
+      beakTargetPoint - _getRelativeRectEdgeValue(positiveEdge, elementPosition.elementRectangle));
+
+    if (!_isEdgeInBounds(beakPositon, elementBounds, positiveEdge)) {
+      beakPositon = _alignEdges(beakPositon, elementBounds, positiveEdge);
+    } else if (!_isEdgeInBounds(beakPositon, elementBounds, negativeEdge)) {
+      beakPositon = _alignEdges(beakPositon, elementBounds, negativeEdge);
+    }
+
+    return beakPositon;
+  }
+
+  export function _getRectangleFromHTMLElement(element: HTMLElement): Rectangle {
+    let clientRect: ClientRect = element.getBoundingClientRect();
+
+    return new Rectangle(clientRect.left, clientRect.right, clientRect.top, clientRect.bottom);
+  }
+
+  export function _getRectangleFromIRect(rect: IRectangle): Rectangle {
+    return new Rectangle(rect.left, rect.right, rect.top, rect.bottom);
+  }
+
+  export function _getTargetRect(bounds: Rectangle, target: HTMLElement | MouseEvent | IPoint | undefined) {
+    let targetRectangle: Rectangle;
+    if (target) {
+      if ((target as MouseEvent).preventDefault) {
+        let ev: MouseEvent = target as MouseEvent;
+        targetRectangle = new Rectangle(ev.clientX, ev.clientX, ev.clientY, ev.clientY);
+      } else if ((target as IPoint).x !== undefined) {
+        let point: IPoint = target as IPoint;
+        targetRectangle = new Rectangle(point.x, point.x, point.y, point.y);
+      } else {
+        targetRectangle = _getRectangleFromHTMLElement(target as HTMLElement);
+      }
+
+      if (!_isRectangleWithinBounds(targetRectangle, bounds)) {
+        let outOfBounds: RectangleEdge[] = _getOutOfBoundsEdges(targetRectangle, bounds);
+
+        for (let direction of outOfBounds) {
+          (targetRectangle as any)[RectangleEdge[direction]] = (bounds as any)[RectangleEdge[direction]];
+        }
+      }
+    } else {
+      targetRectangle = new Rectangle(0, 0, 0, 0);
+    }
+
+    return targetRectangle;
+  }
+
+  /**
+   * If max height is less than zero it returns the bounds height instead.
+   */
+  export function _getMaxHeightFromTargetRectangle(targetRectangle: Rectangle, targetEdge: DirectionalHint, gapSpace: number, bounds: Rectangle) {
+    let maxHeight = 0;
+
+    switch (targetEdge) {
+      case DirectionalHint.bottomAutoEdge:
+      case DirectionalHint.bottomCenter:
+      case DirectionalHint.bottomLeftEdge:
+      case DirectionalHint.bottomRightEdge:
+        maxHeight = bounds.bottom - targetRectangle.bottom - gapSpace;
+        break;
+      case DirectionalHint.topAutoEdge:
+      case DirectionalHint.topCenter:
+      case DirectionalHint.topLeftEdge:
+      case DirectionalHint.topRightEdge:
+        maxHeight = targetRectangle.top - bounds.top - gapSpace;
+        break;
+      default:
+        maxHeight = bounds.bottom - targetRectangle.top - gapSpace;
+        break;
+    }
+
+    return maxHeight > 0 ? maxHeight : bounds.height;
+  }
+
+  export function _positionElementRelative(
+    props: IPositionProps,
+    hostElement: HTMLElement,
+    elementToPosition: HTMLElement): IElementPositionInfo {
+    const gap: number = props.gapSpace ? props.gapSpace : 0;
+    const boundingRect: Rectangle = props.bounds ?
+      _getRectangleFromIRect(props.bounds) :
+      new Rectangle(0, window.innerWidth - getScrollbarWidth(), 0, window.innerHeight);
+    const targetRect: Rectangle = _getTargetRect(boundingRect, props.target);
+    const positionData: IPositionDirectionalHintData = _getAlignmentData(
+      _getPositionData(props.directionalHint, props.directionalHintForRTL)!,
+      targetRect,
+      boundingRect,
+      props.coverTarget);
+    const positionedElement: IElementPosition = _positionElementWithinBounds(
+      _getRectangleFromHTMLElement(elementToPosition),
+      targetRect,
+      boundingRect,
+      positionData,
+      gap,
+      props.directionalHintFixed,
+      props.coverTarget);
+    return { ...positionedElement, targetRectangle: targetRect };
+  }
+
+  export function _finalizePositionData(positionedElement: IElementPosition, hostElement: HTMLElement) {
+    const finalizedElement: IPartialIRectangle = _finalizeElementPosition(
+      positionedElement.elementRectangle,
+      hostElement,
+      positionedElement.targetEdge,
+      positionedElement.alignmentEdge);
+    return {
+      elementPosition: finalizedElement,
+      targetEdge: positionedElement.targetEdge
+    };
+  }
+  export function _positionElement(
+    props: IPositionProps,
+    hostElement: HTMLElement,
+    elementToPosition: HTMLElement): IPositionedData {
+    const positionedElement: IElementPosition = _positionElementRelative(props, hostElement, elementToPosition);
+    return _finalizePositionData(positionedElement, hostElement);
+  }
+
+  export function _positionCallout(props: ICalloutPositionProps,
+    hostElement: HTMLElement,
+    callout: HTMLElement): ICalloutPositionedInfo {
+    const beakWidth: number = !props.isBeakVisible ? 0 : (props.beakWidth || 0);
+    const gap: number = _calculateActualBeakWidthInPixels(beakWidth) / 2 + (props.gapSpace ? props.gapSpace : 0);
+    let positionProps: IPositionProps = props;
+    positionProps.gapSpace = gap;
+    const positionedElement: IElementPositionInfo = _positionElementRelative(positionProps, hostElement, callout);
+    const beakPositioned: Rectangle = _positionBeak(
+      beakWidth,
+      positionedElement);
+    const finalizedBeakPosition: ICalloutBeakPositionedInfo = _finalizeBeakPosition(
+      positionedElement,
+      beakPositioned
+    );
+    return {
+      ..._finalizePositionData(positionedElement, hostElement),
+      beakPosition: finalizedBeakPosition
+    };
+  }
+
+  /**
+   * @deprecated Do not use, this will be removed in 6.0
+   * use either _positionCallout or _positionElement.
+   * @export
+   * @param {IPositionProps} props
+   * @param {HTMLElement} hostElement
+   * @param {HTMLElement} elementToPosition
+   * @returns
+   */
+  export function _getRelativePositions(
+    props: IPositionProps,
+    hostElement: HTMLElement,
+    elementToPosition: HTMLElement) {
+    const positions = _positionCallout(props, hostElement, elementToPosition);
+    const beakPosition = positions && positions.beakPosition ? positions.beakPosition.elementPosition : undefined;
+    return {
+      calloutPosition: positions.elementPosition as ICalloutPositon,
+      beakPosition: { position: { ...beakPosition }, display: 'block' },
+      directionalClassName: SLIDE_ANIMATIONS[positions.targetEdge],
+      submenuDirection: (positions.targetEdge * -1) === RectangleEdge.right ? DirectionalHint.leftBottomEdge : DirectionalHint.rightBottomEdge
+    };
+  }
+}
+/**
+ * @deprecated Do not use, this will be removed in 6.0.
+ * Use either positionElement, or positionCallout
+ *
+ * @export
+ * @param {IPositionProps} props
+ * @param {HTMLElement} hostElement
+ * @param {HTMLElement} calloutElement
+ * @returns
+ */
+export function getRelativePositions(props: IPositionProps,
+  hostElement: HTMLElement,
+  calloutElement: HTMLElement) {
+  return positioningFunctions._getRelativePositions(props, hostElement, calloutElement);
+}
+
+/**
+ * Used to position an element relative to the given positioning props.
+ *
+ * @export
+ * @param {IPositionProps} props
+ * @param {HTMLElement} hostElement
+ * @param {HTMLElement} elementToPosition
+ * @returns
+ */
+export function positionElement(props: IPositionProps,
+  hostElement: HTMLElement,
+  elementToPosition: HTMLElement): IPositionedData {
+  return positioningFunctions._positionElement(props, hostElement, elementToPosition);
+}
+
+export function positionCallout(props: IPositionProps,
+  hostElement: HTMLElement,
+  elementToPosition: HTMLElement): ICalloutPositionedInfo {
+  return positioningFunctions._positionCallout(props, hostElement, elementToPosition);
+}
+
+/**
+ * Get's the maximum height that a rectangle can have in order to fit below or above a target.
+ * If the directional hint specifies a left or right edge (i.e. leftCenter) it will limit the height to the topBorder
+ * of the target given.
+ * If no bounds are provided then the window is treated as the bounds.
+ */
+export function getMaxHeight(target: HTMLElement | MouseEvent | IPoint, targetEdge: DirectionalHint, gapSpace: number = 0, bounds?: IRectangle) {
+  let mouseTarget: MouseEvent = target as MouseEvent;
+  let elementTarget: HTMLElement = target as HTMLElement;
+  let pointTarget: IPoint = target as IPoint;
+  let targetRect: Rectangle;
+  let boundingRectangle = bounds ?
+    positioningFunctions._getRectangleFromIRect(bounds) :
+    new Rectangle(0, window.innerWidth - getScrollbarWidth(), 0, window.innerHeight);
+
+  if (mouseTarget.stopPropagation) {
+    targetRect = new Rectangle(mouseTarget.clientX, mouseTarget.clientX, mouseTarget.clientY, mouseTarget.clientY);
+  } else if (pointTarget.x !== undefined && pointTarget.y !== undefined) {
+    targetRect = new Rectangle(pointTarget.x, pointTarget.x, pointTarget.y, pointTarget.y);
+  } else {
+    targetRect = positioningFunctions._getRectangleFromHTMLElement(elementTarget);
+  }
+
+  return positioningFunctions._getMaxHeightFromTargetRectangle(targetRect, targetEdge, gapSpace, boundingRectangle);
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning/positioning.types.ts b/packages/office-ui-fabric-react/src/utilities/positioning/positioning.types.ts
new file mode 100644
index 0000000000000..7211a295b193d
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/utilities/positioning/positioning.types.ts
@@ -0,0 +1,127 @@
+
+import { DirectionalHint } from '../../common/DirectionalHint';
+import { IPoint } from './positioning.types';
+import { IRectangle } from '../../Utilities';
+
+export enum RectangleEdge {
+  top = 1,
+  bottom = -1,
+  left = 2,
+  right = -2
+}
+
+export enum Position {
+  top = 0,
+  bottom = 1,
+  start = 2,
+  end = 3
+}
+export interface IPositionProps {
+  target?: HTMLElement | MouseEvent | IPoint;
+  /** how the element should be positioned */
+  directionalHint?: DirectionalHint;
+  /**
+   * How the element should be positioned in RTL layouts.
+   * If not specified, a mirror of `directionalHint` will be used instead
+   */
+  directionalHintForRTL?: DirectionalHint;
+  /** The gap between the callout and the target */
+  gapSpace?: number;
+  /**
+  * @deprecated this will be removed in 6.0 and will only be available in ICalloutPositionProps.
+  * The width of the beak.
+  */
+  beakWidth?: number;
+  /**
+   * The bounding rectangle for which  the contextual menu can appear in.
+   */
+  bounds?: IRectangle;
+  /**
+   * @deprecated this will be removed in 6.0 and will only be available in ICalloutPositionProps.
+   * If true then the beak is visible. If false it will not be shown.
+   */
+  isBeakVisible?: boolean;
+  /**
+   * If true the position returned will have the menu element cover the target.
+   * If false then it will position next to the target;
+   */
+  coverTarget?: boolean;
+  /**
+   * If true the position will not change edges in an attempt to fit the rectangle within bounds.
+   * It will still attempt to align it to whatever bounds are given.
+   * @default false
+   */
+  directionalHintFixed?: boolean;
+}
+
+export interface ICalloutPositionProps extends IPositionProps {
+  /**
+  * The width of the beak.
+  */
+  beakWidth?: number;
+  /**
+   * @deprecated this will be removed in 6.0 and will only be available in ICalloutPositionProps.
+   * If true then the beak is visible. If false it will not be shown.
+   */
+  isBeakVisible?: boolean;
+}
+
+export interface IPositionedData {
+  /**
+   * The new position of the element.
+   */
+  elementPosition: IPosition;
+  /**
+   * The finalized target edge that element is aligning to. For isntance RectangleEdge.bottom would mean
+   * that the bottom edge of the target is being aligned to.
+   */
+  targetEdge: RectangleEdge;
+}
+
+export interface ICalloutPositionedInfo extends IPositionedData {
+  beakPosition: ICalloutBeakPositionedInfo;
+}
+
+export interface ICalloutBeakPositionedInfo extends IPositionedData {
+  closestEdge: RectangleEdge;
+}
+
+/**
+ * Gives the position of some element on the page. Only a pair of vertical and horizontal edges need to be
+ * given. So top/left or bottom/left is sufficient.
+ * The number given is the distance in pixels from whatever host was given..
+ * So bottom: 100 would be 100px up from the bottom of the host while top: 100px from the top.
+ */
+export interface IPosition {
+  top?: number;
+  left?: number;
+  bottom?: number;
+  right?: number;
+  [key: string]: number | undefined;
+}
+
+/**
+ * @deprecated use IPosition instead.
+ * This will be removed in 6.0
+ */
+export interface ICalloutPositon extends IPosition {
+}
+
+export interface IPoint {
+  x: number;
+  y: number;
+}
+
+export interface IPositionDirectionalHintData {
+  targetEdge: RectangleEdge;
+  alignmentEdge?: RectangleEdge;
+  isAuto?: boolean;
+}
+
+/**
+ * @deprecated Do not use this will be removed in 6.0.
+ * Use IPositionDirectionalHintData instead
+ */
+export interface IPositionedData extends IPositionDirectionalHintData {
+
+}

From 41d25c9a4baee27a246ea0a74bdff4e5861204c8 Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Wed, 29 Nov 2017 13:43:44 -0800
Subject: [PATCH 1078/1641] SwatchColorPicker: Enable subcomponent styling by
 exposting ColorCell getStyles (#3479)

* Expose getStyles to parent element to enable customizing subcomponent

* Add change file
---
 ...o-ExposeGetStylesColorPicker_2017-11-29-21-00.json | 11 +++++++++++
 .../SwatchColorPicker/SwatchColorPicker.base.tsx      |  1 +
 .../SwatchColorPicker/SwatchColorPicker.types.ts      |  8 +++++++-
 3 files changed, 19 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/malozano-ExposeGetStylesColorPicker_2017-11-29-21-00.json

diff --git a/common/changes/office-ui-fabric-react/malozano-ExposeGetStylesColorPicker_2017-11-29-21-00.json b/common/changes/office-ui-fabric-react/malozano-ExposeGetStylesColorPicker_2017-11-29-21-00.json
new file mode 100644
index 0000000000000..fd330c781ac98
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-ExposeGetStylesColorPicker_2017-11-29-21-00.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SwatchColorPicker: Expose getStyles of colorCell subcomponent",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
index 9107189545f7d..43199c4b35ab5 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
@@ -142,6 +142,7 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
         item={ item }
         id={ id }
         color={ item.color }
+        getStyles={ this.props.getColorGridCellStyles }
         disabled={ this.props.disabled }
         onClick={ this._onCellClick }
         onHover={ this._onGridCellHovered }
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts
index 72539ea73f9ac..70b80799f8891 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts
@@ -1,6 +1,7 @@
 import { IStyle, ITheme } from '../../Styling';
 import { IStyleFunction } from '../../Utilities';
-import { IColorCellProps } from './ColorPickerGridCell.types';
+import { IColorCellProps, IColorPickerGridCellStyleProps, IColorPickerGridCellStyles } from './ColorPickerGridCell.types';
+
 export interface ISwatchColorPicker { }
 
 export interface ISwatchColorPickerProps {
@@ -95,6 +96,11 @@ export interface ISwatchColorPickerProps {
    * Optional styles for the component.
    */
   getStyles?: IStyleFunction<ISwatchColorPickerStyleProps, ISwatchColorPickerStyles>;
+
+  /**
+  * Optional styles for the component.
+  */
+  getColorGridCellStyles?: IStyleFunction<IColorPickerGridCellStyleProps, IColorPickerGridCellStyles>;
 }
 
 /**

From 52bce08e9e3c61aa1f40d6b56ca8d32e25ac44e9 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Wed, 29 Nov 2017 14:04:37 -0800
Subject: [PATCH 1079/1641] ComboBox/Dropdown/ContextualMenu unified focus
 improvements (#3474)

* Update how the focus is updated so that we don't overly respond to mouseMove, and MouseEnter/MouseMove/MouseLeave will not update focus when scrolling

* update snapshot

* rush change

* PR comment updates (make the timeout ids be undefineable, update setting the value, and add comments to the onscroll function)
---
 ...enuFocusImprovements_2017-11-28-22-20.json | 11 +++++
 .../src/components/Callout/Callout.types.ts   |  5 +++
 .../src/components/Callout/CalloutContent.tsx |  4 +-
 .../__snapshots__/Callout.test.tsx.snap       |  1 +
 .../src/components/ComboBox/ComboBox.tsx      | 45 ++++++++++++++++---
 .../ContextualMenu/ContextualMenu.tsx         | 40 +++++++++++++++--
 .../src/components/Dropdown/Dropdown.tsx      | 35 +++++++++++++++
 7 files changed, 131 insertions(+), 10 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxDropdownContextualMenuFocusImprovements_2017-11-28-22-20.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxDropdownContextualMenuFocusImprovements_2017-11-28-22-20.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxDropdownContextualMenuFocusImprovements_2017-11-28-22-20.json
new file mode 100644
index 0000000000000..bd76fd35b7945
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxDropdownContextualMenuFocusImprovements_2017-11-28-22-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox/Dropdown/ContextualMenu: Update how the focus gets updated for hover so that 1) we aren't blasting mouseMoves and 2) so we get rid of weirdness around  hover and scroll",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts b/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
index 30bf82b8f24a2..d8e4fb805be7b 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
@@ -187,4 +187,9 @@ export interface ICalloutProps extends React.Props<Callout | CalloutContent> {
    * When not set the callout will expand with contents up to the bottom of the screen
    */
   calloutMaxHeight?: number;
+
+  /**
+   * Callback when the Callout body is scrolled.
+   */
+  onScroll?: () => void;
 }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index afade71b6621e..17cb050816732 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -131,7 +131,8 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       calloutWidth,
       finalHeight,
       backgroundColor,
-      calloutMaxHeight } = this.props;
+      calloutMaxHeight,
+      onScroll } = this.props;
     target = this._getTarget();
     let { positions } = this.state;
 
@@ -183,6 +184,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
               [styles.overFlowYHidden]: !!finalHeight
             }) }
             onDismiss={ this.dismiss }
+            onScroll={ onScroll }
             shouldRestoreFocus={ true }
             style={ { maxHeight: contentMaxHeight, backgroundColor: backgroundColor } }
           >
diff --git a/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
index 4007c6e023ce6..4f649424e81dc 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
@@ -19,6 +19,7 @@ exports[`Callout renders Callout correctly 1`] = `
       aria-labelledby={undefined}
       className="ms-Callout-main"
       onKeyDown={[Function]}
+      onScroll={undefined}
       role={undefined}
       style={
         Object {
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index c960a74c06159..05c566b44ec58 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -115,7 +115,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   // After a character is inserted when autocomplete is true and
   // allowFreeform is false, remember the task that will clear
   // the pending string of characters
-  private _lastReadOnlyAutoCompleteChangeTimeoutId: number;
+  private _lastReadOnlyAutoCompleteChangeTimeoutId: number | undefined;
 
   // Promise used when resolving the comboBox options
   private _currentPromise: PromiseLike<IComboBoxOption[]>;
@@ -125,6 +125,12 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
   private _classNames: IComboBoxClassNames;
 
+  private _isScrollIdle: boolean;
+
+  private readonly _scrollIdleDelay: number = 250 /* ms */;
+
+  private _scrollIdleTimeoutId: number | undefined;
+
   constructor(props: IComboBoxProps) {
     super(props);
 
@@ -137,7 +143,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     this._id = props.id || getId('ComboBox');
 
     let selectedKey = props.defaultSelectedKey !== undefined ? props.defaultSelectedKey : props.selectedKey;
-    this._lastReadOnlyAutoCompleteChangeTimeoutId = -1;
+    this._isScrollIdle = true;
 
     let index: number = this._getSelectedIndex(props.options, selectedKey);
 
@@ -562,9 +568,9 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         // we know that the user is typing with keypresses happening
         // within the timeout of each other so remove the clearing task
         // and continue building the pending value with the udpated value
-        if (this._lastReadOnlyAutoCompleteChangeTimeoutId > 0) {
+        if (this._lastReadOnlyAutoCompleteChangeTimeoutId !== undefined) {
           this._async.clearTimeout(this._lastReadOnlyAutoCompleteChangeTimeoutId);
-          this._lastReadOnlyAutoCompleteChangeTimeoutId = -1;
+          this._lastReadOnlyAutoCompleteChangeTimeoutId = undefined;
           updatedValue = currentPendingValue + updatedValue;
         }
 
@@ -582,7 +588,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         // Schedule a timeout to clear the pending value after the timeout span
         this._lastReadOnlyAutoCompleteChangeTimeoutId =
           this._async.setTimeout(
-            () => { this._lastReadOnlyAutoCompleteChangeTimeoutId = -1; },
+            () => { this._lastReadOnlyAutoCompleteChangeTimeoutId = undefined; },
             this._readOnlyPendingAutoCompleteTimeout
           );
         return;
@@ -813,6 +819,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         className={ this._classNames.callout }
         target={ this._comboBoxWrapper }
         onDismiss={ this._onDismiss }
+        onScroll={ this._onScroll }
         setInitialFocus={ false }
         calloutWidth={ dropdownWidth || this._comboBoxWrapper.clientWidth + 2 }
       >
@@ -969,6 +976,22 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     );
   }
 
+  /**
+   * Scroll handler for the callout to make sure the mouse events
+   * for updating focus are not interacting during scroll
+   */
+  @autobind
+  private _onScroll() {
+    if (!this._isScrollIdle && this._scrollIdleTimeoutId !== undefined) {
+      this._async.clearTimeout(this._scrollIdleTimeoutId);
+      this._scrollIdleTimeoutId = undefined;
+    } else {
+      this._isScrollIdle = false;
+    }
+
+    this._scrollIdleTimeoutId = this._async.setTimeout(() => { this._isScrollIdle = true; }, this._scrollIdleDelay);
+  }
+
   /**
    * Scroll the selected element into view
    */
@@ -1342,18 +1365,30 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   }
 
   private _onOptionMouseEnter(index: number) {
+    if (!this._isScrollIdle) {
+      return;
+    }
+
     this.setState({
       currentPendingValueValidIndexOnHover: index
     });
   }
 
   private _onOptionMouseMove(index: number) {
+    if (!this._isScrollIdle || this.state.currentPendingValueValidIndexOnHover === index) {
+      return;
+    }
+
     this.setState({
       currentPendingValueValidIndexOnHover: index
     });
   }
 
   private _onOptionMouseLeave = () => {
+    if (!this._isScrollIdle) {
+      return;
+    }
+
     this.setState({
       currentPendingValueValidIndexOnHover: HoverStatus.clearAll
     });
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 4bcd3fc016673..a8fbce754188e 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -117,10 +117,13 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   private _host: HTMLElement;
   private _previousActiveElement: HTMLElement | null;
   private _isFocusingPreviousElement: boolean;
-  private _enterTimerId: number;
+  private _enterTimerId: number | undefined;
   private _targetWindow: Window;
   private _target: HTMLElement | MouseEvent | IPoint | null;
   private _classNames: IContextualMenuClassNames;
+  private _isScrollIdle: boolean;
+  private readonly _scrollIdleDelay: number = 250 /* ms */;
+  private _scrollIdleTimeoutId: number | undefined;
 
   constructor(props: IContextualMenuProps) {
     super(props);
@@ -136,7 +139,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     });
 
     this._isFocusingPreviousElement = false;
-    this._enterTimerId = 0;
+    this._isScrollIdle = true;
   }
 
   @autobind
@@ -278,6 +281,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
           className='ms-ContextualMenu-Callout'
           setInitialFocus={ shouldFocusOnMount }
           onDismiss={ this.props.onDismiss }
+          onScroll={ this._onScroll }
           bounds={ bounds }
           directionalHintFixed={ directionalHintFixed }
         >
@@ -688,7 +692,27 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     }
   }
 
+  /**
+   * Scroll handler for the callout to make sure the mouse events
+   * for updating focus are not interacting during scroll
+   */
+  @autobind
+  private _onScroll() {
+    if (!this._isScrollIdle && this._scrollIdleTimeoutId !== undefined) {
+      this._async.clearTimeout(this._scrollIdleTimeoutId);
+      this._scrollIdleTimeoutId = undefined;
+    } else {
+      this._isScrollIdle = false;
+    }
+
+    this._scrollIdleTimeoutId = this._async.setTimeout(() => { this._isScrollIdle = true; }, this._scrollIdleDelay);
+  }
+
   private _onItemMouseEnter(item: any, ev: React.MouseEvent<HTMLElement>) {
+    if (!this._isScrollIdle) {
+      return;
+    }
+
     let targetElement = ev.currentTarget as HTMLElement;
 
     if (item.key !== this.state.expandedMenuItemKey) {
@@ -703,9 +727,10 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   }
 
   private _onItemMouseMove(item: any, ev: React.MouseEvent<HTMLElement>) {
+
     let targetElement = ev.currentTarget as HTMLElement;
 
-    if (targetElement === this._targetWindow.document.activeElement as HTMLElement) {
+    if (!this._isScrollIdle || targetElement === this._targetWindow.document.activeElement as HTMLElement) {
       return;
     }
 
@@ -722,7 +747,14 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
   @autobind
   private _onMouseItemLeave(item: any, ev: React.MouseEvent<HTMLElement>) {
-    this._async.clearTimeout(this._enterTimerId);
+    if (!this._isScrollIdle) {
+      return;
+    }
+
+    if (this._enterTimerId !== undefined) {
+      this._async.clearTimeout(this._enterTimerId);
+      this._enterTimerId = undefined;
+    }
 
     if (item.key === this.state.expandedMenuItemKey && hasSubmenuItems(item)) {
       return;
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 9e48f734b6bff..6d0693dd9cce1 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -54,8 +54,12 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   // tslint:disable-next-line:no-unused-variable
   private _dropdownLabel: HTMLElement;
   private _id: string;
+  private _isScrollIdle: boolean;
+  private readonly _scrollIdleDelay: number = 250 /* ms */;
+  private _scrollIdleTimeoutId: number | undefined;
 
   constructor(props: IDropdownProps) {
+    super(props);
     props.options.forEach((option: any) => {
       if (!option.itemType) {
         option.itemType = DropdownMenuItemType.Normal;
@@ -76,6 +80,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     });
 
     this._id = props.id || getId('Dropdown');
+    this._isScrollIdle = true;
 
     this.state = {
       isOpen: false
@@ -369,6 +374,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
             className={ css('ms-Dropdown-callout', styles.callout, calloutProps ? calloutProps.className : undefined) }
             target={ this._dropDown }
             onDismiss={ this._onDismiss }
+            onScroll={ this._onScroll }
             onPositioned={ this._onPositioned }
             calloutWidth={ dropdownWidth || this._dropDown.clientWidth }
           >
@@ -554,18 +560,47 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     };
   }
 
+  /**
+   * Scroll handler for the callout to make sure the mouse events
+   * for updating focus are not interacting during scroll
+   */
+  @autobind
+  private _onScroll() {
+    if (!this._isScrollIdle && this._scrollIdleTimeoutId !== undefined) {
+      this._async.clearTimeout(this._scrollIdleTimeoutId);
+      this._scrollIdleTimeoutId = undefined;
+    } else {
+      this._isScrollIdle = false;
+    }
+
+    this._scrollIdleTimeoutId = this._async.setTimeout(() => { this._isScrollIdle = true; }, this._scrollIdleDelay);
+  }
+
   private _onItemMouseEnter(item: any, ev: React.MouseEvent<HTMLElement>) {
+    if (!this._isScrollIdle) {
+      return;
+    }
+
     let targetElement = ev.currentTarget as HTMLElement;
     targetElement.focus();
   }
 
   private _onItemMouseMove(item: any, ev: React.MouseEvent<HTMLElement>) {
     let targetElement = ev.currentTarget as HTMLElement;
+
+    if (!this._isScrollIdle || document.activeElement === targetElement) {
+      return;
+    }
+
     targetElement.focus();
   }
 
   @autobind
   private _onMouseItemLeave(item: any, ev: React.MouseEvent<HTMLElement>) {
+    if (!this._isScrollIdle) {
+      return;
+    }
+
     this._host.focus();
   }
 

From ccfed04b1a58bf79e72f940ceea79b16e1ad34db Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 29 Nov 2017 17:16:12 -0800
Subject: [PATCH 1080/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...lout-positioninginfo_2017-11-20-22-04.json | 11 --------
 ...enuFocusImprovements_2017-11-28-22-20.json | 11 --------
 ...GetStylesColorPicker_2017-11-29-21-00.json | 11 --------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 26 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 14 +++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 12 files changed, 46 insertions(+), 41 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/callout-positioninginfo_2017-11-20-22-04.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxDropdownContextualMenuFocusImprovements_2017-11-28-22-20.json
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-ExposeGetStylesColorPicker_2017-11-29-21-00.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index bf8f0ddb1fa32..820aaa21cf783 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.27.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.28.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 3ee8dcb246dd6..6b48494b783c3 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.27.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.28.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index bda556917ab8a..b0fea805c8da7 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.27.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.28.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 62a7823a93e67..1e86d68c38b93 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.27.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.28.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index d7fc8a5003bb0..5b0dce49bf86c 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,7 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.27.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.28.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/callout-positioninginfo_2017-11-20-22-04.json b/common/changes/office-ui-fabric-react/callout-positioninginfo_2017-11-20-22-04.json
deleted file mode 100644
index 9b4ebc5612b31..0000000000000
--- a/common/changes/office-ui-fabric-react/callout-positioninginfo_2017-11-20-22-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Positioning/Callout: made significant changes to help prepare for when positioning and calloutpositioning separate.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxDropdownContextualMenuFocusImprovements_2017-11-28-22-20.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxDropdownContextualMenuFocusImprovements_2017-11-28-22-20.json
deleted file mode 100644
index bd76fd35b7945..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxDropdownContextualMenuFocusImprovements_2017-11-28-22-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox/Dropdown/ContextualMenu: Update how the focus gets updated for hover so that 1) we aren't blasting mouseMoves and 2) so we get rid of weirdness around  hover and scroll",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/malozano-ExposeGetStylesColorPicker_2017-11-29-21-00.json b/common/changes/office-ui-fabric-react/malozano-ExposeGetStylesColorPicker_2017-11-29-21-00.json
deleted file mode 100644
index fd330c781ac98..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-ExposeGetStylesColorPicker_2017-11-29-21-00.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SwatchColorPicker: Expose getStyles of colorCell subcomponent",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index f334a1c00525c..f67f28865d060 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.27.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.28.0 <6.0.0",
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 27b7f5d49e874..ae49dbad04f32 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.28.0",
+      "tag": "office-ui-fabric-react_v5.28.0",
+      "date": "Thu, 30 Nov 2017 01:16:12 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "70276089a58cdf49a4136097788d74ef3d089674",
+            "comment": "Positioning/Callout: made significant changes to help prepare for when positioning and calloutpositioning separate."
+          },
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "52bce08e9e3c61aa1f40d6b56ca8d32e25ac44e9",
+            "comment": "ComboBox/Dropdown/ContextualMenu: Update how the focus gets updated for hover so that 1) we aren't blasting mouseMoves and 2) so we get rid of weirdness around  hover and scroll"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "41d25c9a4baee27a246ea0a74bdff4e5861204c8",
+            "comment": "SwatchColorPicker: Expose getStyles of colorCell subcomponent"
+          }
+        ]
+      }
+    },
     {
       "version": "5.27.0",
       "tag": "office-ui-fabric-react_v5.27.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 248473d1d5060..6b26f67677cf1 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,18 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 29 Nov 2017 11:24:06 GMT and should not be manually modified.
+This log was last generated on Thu, 30 Nov 2017 01:16:12 GMT and should not be manually modified.
+
+## 5.28.0
+Thu, 30 Nov 2017 01:16:12 GMT
+
+### Minor changes
+
+- Positioning/Callout: made significant changes to help prepare for when positioning and calloutpositioning separate.
+- ComboBox/Dropdown/ContextualMenu: Update how the focus gets updated for hover so that 1) we aren't blasting mouseMoves and 2) so we get rid of weirdness around  hover and scroll
+
+### Patches
+
+- SwatchColorPicker: Expose getStyles of colorCell subcomponent
 
 ## 5.27.0
 Wed, 29 Nov 2017 11:24:06 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index d474ebcf312ca..dba582ddabf80 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.27.0",
+  "version": "5.28.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 7bd70ca910f147560e0c0e8a536a2659730b5f13 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 29 Nov 2017 23:54:35 -0800
Subject: [PATCH 1081/1641] @uifabric/icons initializeIcons can take options to
 suppress warnings. (#3477)

* remove unneeded inline files.

* Adding options.

* Adding change files.

* Adding back prop and deprecating value.

* Updating.

* Ignore the subsequent registration.
---
 .../icon-options_2017-11-29-19-32.json        |  11 +
 .../icons/icon-options_2017-11-29-19-32.json  |  11 +
 .../icon-options_2017-11-29-19-32.json        |  11 +
 .../icon-options_2017-11-29-19-32.json        |  11 +
 packages/experiments/src/common/tests.ts      |   2 +-
 packages/icons/src/fabric-icons-0-inline.ts   | 121 ---------
 packages/icons/src/fabric-icons-0.ts          | 251 +++++++++---------
 packages/icons/src/fabric-icons-1-inline.ts   | 121 ---------
 packages/icons/src/fabric-icons-1.ts          | 251 +++++++++---------
 packages/icons/src/fabric-icons-10-inline.ts  | 117 --------
 packages/icons/src/fabric-icons-10.ts         | 243 +++++++++--------
 packages/icons/src/fabric-icons-11-inline.ts  | 105 --------
 packages/icons/src/fabric-icons-11.ts         | 219 +++++++--------
 packages/icons/src/fabric-icons-2-inline.ts   | 121 ---------
 packages/icons/src/fabric-icons-2.ts          | 251 +++++++++---------
 packages/icons/src/fabric-icons-3-inline.ts   | 121 ---------
 packages/icons/src/fabric-icons-3.ts          | 251 +++++++++---------
 packages/icons/src/fabric-icons-4-inline.ts   | 117 --------
 packages/icons/src/fabric-icons-4.ts          | 243 +++++++++--------
 packages/icons/src/fabric-icons-5-inline.ts   | 120 ---------
 packages/icons/src/fabric-icons-5.ts          | 249 ++++++++---------
 packages/icons/src/fabric-icons-6-inline.ts   | 119 ---------
 packages/icons/src/fabric-icons-6.ts          | 247 ++++++++---------
 packages/icons/src/fabric-icons-7-inline.ts   | 121 ---------
 packages/icons/src/fabric-icons-7.ts          | 251 +++++++++---------
 packages/icons/src/fabric-icons-8-inline.ts   | 121 ---------
 packages/icons/src/fabric-icons-8.ts          | 251 +++++++++---------
 packages/icons/src/fabric-icons-9-inline.ts   | 121 ---------
 packages/icons/src/fabric-icons-9.ts          | 251 +++++++++---------
 packages/icons/src/fabric-icons-inline.ts     |  75 ------
 packages/icons/src/fabric-icons.ts            | 159 +++++------
 packages/icons/src/index.ts                   |  52 ++--
 .../src/common/tests.ts                       |   2 +-
 packages/styling/src/utilities/icons.ts       |  58 ++--
 34 files changed, 1733 insertions(+), 3042 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/icon-options_2017-11-29-19-32.json
 create mode 100644 common/changes/@uifabric/icons/icon-options_2017-11-29-19-32.json
 create mode 100644 common/changes/@uifabric/styling/icon-options_2017-11-29-19-32.json
 create mode 100644 common/changes/office-ui-fabric-react/icon-options_2017-11-29-19-32.json
 delete mode 100644 packages/icons/src/fabric-icons-0-inline.ts
 delete mode 100644 packages/icons/src/fabric-icons-1-inline.ts
 delete mode 100644 packages/icons/src/fabric-icons-10-inline.ts
 delete mode 100644 packages/icons/src/fabric-icons-11-inline.ts
 delete mode 100644 packages/icons/src/fabric-icons-2-inline.ts
 delete mode 100644 packages/icons/src/fabric-icons-3-inline.ts
 delete mode 100644 packages/icons/src/fabric-icons-4-inline.ts
 delete mode 100644 packages/icons/src/fabric-icons-5-inline.ts
 delete mode 100644 packages/icons/src/fabric-icons-6-inline.ts
 delete mode 100644 packages/icons/src/fabric-icons-7-inline.ts
 delete mode 100644 packages/icons/src/fabric-icons-8-inline.ts
 delete mode 100644 packages/icons/src/fabric-icons-9-inline.ts
 delete mode 100644 packages/icons/src/fabric-icons-inline.ts

diff --git a/common/changes/@uifabric/experiments/icon-options_2017-11-29-19-32.json b/common/changes/@uifabric/experiments/icon-options_2017-11-29-19-32.json
new file mode 100644
index 0000000000000..2098be827ee86
--- /dev/null
+++ b/common/changes/@uifabric/experiments/icon-options_2017-11-29-19-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/experiments",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/icon-options_2017-11-29-19-32.json b/common/changes/@uifabric/icons/icon-options_2017-11-29-19-32.json
new file mode 100644
index 0000000000000..c125349d8e6cd
--- /dev/null
+++ b/common/changes/@uifabric/icons/icon-options_2017-11-29-19-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/icons",
+      "comment": "Updating the icons package to pass through optional `options` argument in `initializeIcons`.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/icons",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/icon-options_2017-11-29-19-32.json b/common/changes/@uifabric/styling/icon-options_2017-11-29-19-32.json
new file mode 100644
index 0000000000000..9ce9226bd84ce
--- /dev/null
+++ b/common/changes/@uifabric/styling/icon-options_2017-11-29-19-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Updating the `registerIcons` helper to take in options.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/icon-options_2017-11-29-19-32.json b/common/changes/office-ui-fabric-react/icon-options_2017-11-29-19-32.json
new file mode 100644
index 0000000000000..bdac204cd2e2e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/icon-options_2017-11-29-19-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "office-ui-fabric-react",
+      "type": "none"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/common/tests.ts b/packages/experiments/src/common/tests.ts
index 787104afb3ea5..842c69e60ef3c 100644
--- a/packages/experiments/src/common/tests.ts
+++ b/packages/experiments/src/common/tests.ts
@@ -4,5 +4,5 @@ import { setIconOptions } from 'office-ui-fabric-react/lib/Styling';
 
 // Suppress icon warnings.
 setIconOptions({
-  warnOnMissingIcons: false
+  disableWarnings: true
 });
\ No newline at end of file
diff --git a/packages/icons/src/fabric-icons-0-inline.ts b/packages/icons/src/fabric-icons-0-inline.ts
deleted file mode 100644
index 340f4b7356068..0000000000000
--- a/packages/icons/src/fabric-icons-0-inline.ts
+++ /dev/null
@@ -1,121 +0,0 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-0"`,
-      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
-    },
-    icons: {
-      'DecreaseIndentLegacy': '\uE290',
-      'IncreaseIndentLegacy': '\uE291',
-      'InternetSharing': '\uE704',
-      'Brightness': '\uE706',
-      'MapPin': '\uE707',
-      'Airplane': '\uE709',
-      'Tablet': '\uE70A',
-      'QuickNote': '\uE70B',
-      'Video': '\uE714',
-      'People': '\uE716',
-      'Phone': '\uE717',
-      'Pin': '\uE718',
-      'Shop': '\uE719',
-      'Stop': '\uE71A',
-      'Link': '\uE71B',
-      'Zoom': '\uE71E',
-      'ZoomOut': '\uE71F',
-      'Microphone': '\uE720',
-      'Camera': '\uE722',
-      'Attach': '\uE723',
-      'Send': '\uE724',
-      'FavoriteList': '\uE728',
-      'PageSolid': '\uE729',
-      'Forward': '\uE72A',
-      'Back': '\uE72B',
-      'Refresh': '\uE72C',
-      'Lock': '\uE72E',
-      'EMI': '\uE731',
-      'MiniLink': '\uE732',
-      'Blocked': '\uE733',
-      'ReadingMode': '\uE736',
-      'Favicon': '\uE737',
-      'Remove': '\uE738',
-      'Checkbox': '\uE739',
-      'CheckboxComposite': '\uE73A',
-      'CheckboxIndeterminate': '\uE73C',
-      'CheckboxCompositeReversed': '\uE73D',
-      'BackToWindow': '\uE73F',
-      'FullScreen': '\uE740',
-      'Print': '\uE749',
-      'Up': '\uE74A',
-      'Down': '\uE74B',
-      'Save': '\uE74E',
-      'Cloud': '\uE753',
-      'CommandPrompt': '\uE756',
-      'Sad': '\uE757',
-      'SIPMove': '\uE759',
-      'EraseTool': '\uE75C',
-      'GripperTool': '\uE75E',
-      'Dialpad': '\uE75F',
-      'PageLeft': '\uE760',
-      'PageRight': '\uE761',
-      'MultiSelect': '\uE762',
-      'Play': '\uE768',
-      'Pause': '\uE769',
-      'Emoji2': '\uE76E',
-      'GripperBarHorizontal': '\uE76F',
-      'System': '\uE770',
-      'Personalize': '\uE771',
-      'SearchAndApps': '\uE773',
-      'Globe': '\uE774',
-      'ContactInfo': '\uE779',
-      'Unpin': '\uE77A',
-      'Contact': '\uE77B',
-      'Memo': '\uE77C',
-      'Paste': '\uE77F',
-      'WindowsLogo': '\uE782',
-      'Error': '\uE783',
-      'GripperBarVertical': '\uE784',
-      'Unlock': '\uE785',
-      'Megaphone': '\uE789',
-      'AutoEnhanceOn': '\uE78D',
-      'AutoEnhanceOff': '\uE78E',
-      'Color': '\uE790',
-      'SaveAs': '\uE792',
-      'Light': '\uE793',
-      'Filters': '\uE795',
-      'AspectRatio': '\uE799',
-      'Contrast': '\uE7A1',
-      'Redo': '\uE7A6',
-      'PhotoCollection': '\uE7AA',
-      'Album': '\uE7AB',
-      'Rotate': '\uE7AD',
-      'PanoIndicator': '\uE7B0',
-      'RedEye': '\uE7B3',
-      'ThumbnailView': '\uE7B6',
-      'Package': '\uE7B8',
-      'Warning': '\uE7BA',
-      'Financial': '\uE7BB',
-      'Education': '\uE7BE',
-      'ShoppingCart': '\uE7BF',
-      'Train': '\uE7C0',
-      'Move': '\uE7C2',
-      'TouchPointer': '\uE7C9',
-      'Merge': '\uE7D5',
-      'TurnRight': '\uE7DB',
-      'Ferry': '\uE7E3',
-      'Highlight': '\uE7E6',
-      'Tab': '\uE7E9',
-      'Admin': '\uE7EF'
-    }
-  });
-}
diff --git a/packages/icons/src/fabric-icons-0.ts b/packages/icons/src/fabric-icons-0.ts
index 1f4c02ba444c4..43a3a0c98a42e 100644
--- a/packages/icons/src/fabric-icons-0.ts
+++ b/packages/icons/src/fabric-icons-0.ts
@@ -1,121 +1,130 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-0"`,
-      src: `url('${baseUrl}fabric-icons-0-8a1666a2.woff') format('woff')`, 
-    },
-    icons: {
-      'DecreaseIndentLegacy': '\uE290',
-      'IncreaseIndentLegacy': '\uE291',
-      'InternetSharing': '\uE704',
-      'Brightness': '\uE706',
-      'MapPin': '\uE707',
-      'Airplane': '\uE709',
-      'Tablet': '\uE70A',
-      'QuickNote': '\uE70B',
-      'Video': '\uE714',
-      'People': '\uE716',
-      'Phone': '\uE717',
-      'Pin': '\uE718',
-      'Shop': '\uE719',
-      'Stop': '\uE71A',
-      'Link': '\uE71B',
-      'Zoom': '\uE71E',
-      'ZoomOut': '\uE71F',
-      'Microphone': '\uE720',
-      'Camera': '\uE722',
-      'Attach': '\uE723',
-      'Send': '\uE724',
-      'FavoriteList': '\uE728',
-      'PageSolid': '\uE729',
-      'Forward': '\uE72A',
-      'Back': '\uE72B',
-      'Refresh': '\uE72C',
-      'Lock': '\uE72E',
-      'EMI': '\uE731',
-      'MiniLink': '\uE732',
-      'Blocked': '\uE733',
-      'ReadingMode': '\uE736',
-      'Favicon': '\uE737',
-      'Remove': '\uE738',
-      'Checkbox': '\uE739',
-      'CheckboxComposite': '\uE73A',
-      'CheckboxIndeterminate': '\uE73C',
-      'CheckboxCompositeReversed': '\uE73D',
-      'BackToWindow': '\uE73F',
-      'FullScreen': '\uE740',
-      'Print': '\uE749',
-      'Up': '\uE74A',
-      'Down': '\uE74B',
-      'Save': '\uE74E',
-      'Cloud': '\uE753',
-      'CommandPrompt': '\uE756',
-      'Sad': '\uE757',
-      'SIPMove': '\uE759',
-      'EraseTool': '\uE75C',
-      'GripperTool': '\uE75E',
-      'Dialpad': '\uE75F',
-      'PageLeft': '\uE760',
-      'PageRight': '\uE761',
-      'MultiSelect': '\uE762',
-      'Play': '\uE768',
-      'Pause': '\uE769',
-      'Emoji2': '\uE76E',
-      'GripperBarHorizontal': '\uE76F',
-      'System': '\uE770',
-      'Personalize': '\uE771',
-      'SearchAndApps': '\uE773',
-      'Globe': '\uE774',
-      'ContactInfo': '\uE779',
-      'Unpin': '\uE77A',
-      'Contact': '\uE77B',
-      'Memo': '\uE77C',
-      'Paste': '\uE77F',
-      'WindowsLogo': '\uE782',
-      'Error': '\uE783',
-      'GripperBarVertical': '\uE784',
-      'Unlock': '\uE785',
-      'Megaphone': '\uE789',
-      'AutoEnhanceOn': '\uE78D',
-      'AutoEnhanceOff': '\uE78E',
-      'Color': '\uE790',
-      'SaveAs': '\uE792',
-      'Light': '\uE793',
-      'Filters': '\uE795',
-      'AspectRatio': '\uE799',
-      'Contrast': '\uE7A1',
-      'Redo': '\uE7A6',
-      'PhotoCollection': '\uE7AA',
-      'Album': '\uE7AB',
-      'Rotate': '\uE7AD',
-      'PanoIndicator': '\uE7B0',
-      'RedEye': '\uE7B3',
-      'ThumbnailView': '\uE7B6',
-      'Package': '\uE7B8',
-      'Warning': '\uE7BA',
-      'Financial': '\uE7BB',
-      'Education': '\uE7BE',
-      'ShoppingCart': '\uE7BF',
-      'Train': '\uE7C0',
-      'Move': '\uE7C2',
-      'TouchPointer': '\uE7C9',
-      'Merge': '\uE7D5',
-      'TurnRight': '\uE7DB',
-      'Ferry': '\uE7E3',
-      'Highlight': '\uE7E6',
-      'Tab': '\uE7E9',
-      'Admin': '\uE7EF'
-    }
-  });
-}
+// tslint:disable:max-line-length
+
+import {
+  IIconOptions,
+  IIconSubset,
+  registerIcons
+} from '@uifabric/styling/lib/index';
+
+export function initializeIcons(
+  baseUrl: string = '',
+  options?: IIconOptions
+): void {
+  const subset: IIconSubset = {
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-0"`,
+      src: `url('${baseUrl}fabric-icons-0-8a1666a2.woff') format('woff')`, 
+    },
+    icons: {
+      'DecreaseIndentLegacy': '\uE290',
+      'IncreaseIndentLegacy': '\uE291',
+      'InternetSharing': '\uE704',
+      'Brightness': '\uE706',
+      'MapPin': '\uE707',
+      'Airplane': '\uE709',
+      'Tablet': '\uE70A',
+      'QuickNote': '\uE70B',
+      'Video': '\uE714',
+      'People': '\uE716',
+      'Phone': '\uE717',
+      'Pin': '\uE718',
+      'Shop': '\uE719',
+      'Stop': '\uE71A',
+      'Link': '\uE71B',
+      'Zoom': '\uE71E',
+      'ZoomOut': '\uE71F',
+      'Microphone': '\uE720',
+      'Camera': '\uE722',
+      'Attach': '\uE723',
+      'Send': '\uE724',
+      'FavoriteList': '\uE728',
+      'PageSolid': '\uE729',
+      'Forward': '\uE72A',
+      'Back': '\uE72B',
+      'Refresh': '\uE72C',
+      'Lock': '\uE72E',
+      'EMI': '\uE731',
+      'MiniLink': '\uE732',
+      'Blocked': '\uE733',
+      'ReadingMode': '\uE736',
+      'Favicon': '\uE737',
+      'Remove': '\uE738',
+      'Checkbox': '\uE739',
+      'CheckboxComposite': '\uE73A',
+      'CheckboxIndeterminate': '\uE73C',
+      'CheckboxCompositeReversed': '\uE73D',
+      'BackToWindow': '\uE73F',
+      'FullScreen': '\uE740',
+      'Print': '\uE749',
+      'Up': '\uE74A',
+      'Down': '\uE74B',
+      'Save': '\uE74E',
+      'Cloud': '\uE753',
+      'CommandPrompt': '\uE756',
+      'Sad': '\uE757',
+      'SIPMove': '\uE759',
+      'EraseTool': '\uE75C',
+      'GripperTool': '\uE75E',
+      'Dialpad': '\uE75F',
+      'PageLeft': '\uE760',
+      'PageRight': '\uE761',
+      'MultiSelect': '\uE762',
+      'Play': '\uE768',
+      'Pause': '\uE769',
+      'Emoji2': '\uE76E',
+      'GripperBarHorizontal': '\uE76F',
+      'System': '\uE770',
+      'Personalize': '\uE771',
+      'SearchAndApps': '\uE773',
+      'Globe': '\uE774',
+      'ContactInfo': '\uE779',
+      'Unpin': '\uE77A',
+      'Contact': '\uE77B',
+      'Memo': '\uE77C',
+      'Paste': '\uE77F',
+      'WindowsLogo': '\uE782',
+      'Error': '\uE783',
+      'GripperBarVertical': '\uE784',
+      'Unlock': '\uE785',
+      'Megaphone': '\uE789',
+      'AutoEnhanceOn': '\uE78D',
+      'AutoEnhanceOff': '\uE78E',
+      'Color': '\uE790',
+      'SaveAs': '\uE792',
+      'Light': '\uE793',
+      'Filters': '\uE795',
+      'AspectRatio': '\uE799',
+      'Contrast': '\uE7A1',
+      'Redo': '\uE7A6',
+      'PhotoCollection': '\uE7AA',
+      'Album': '\uE7AB',
+      'Rotate': '\uE7AD',
+      'PanoIndicator': '\uE7B0',
+      'RedEye': '\uE7B3',
+      'ThumbnailView': '\uE7B6',
+      'Package': '\uE7B8',
+      'Warning': '\uE7BA',
+      'Financial': '\uE7BB',
+      'Education': '\uE7BE',
+      'ShoppingCart': '\uE7BF',
+      'Train': '\uE7C0',
+      'Move': '\uE7C2',
+      'TouchPointer': '\uE7C9',
+      'Merge': '\uE7D5',
+      'TurnRight': '\uE7DB',
+      'Ferry': '\uE7E3',
+      'Highlight': '\uE7E6',
+      'Tab': '\uE7E9',
+      'Admin': '\uE7EF'
+    }
+  };
+
+  registerIcons(subset, options);
+}
diff --git a/packages/icons/src/fabric-icons-1-inline.ts b/packages/icons/src/fabric-icons-1-inline.ts
deleted file mode 100644
index 9bb6048c3a35e..0000000000000
--- a/packages/icons/src/fabric-icons-1-inline.ts
+++ /dev/null
@@ -1,121 +0,0 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-1"`,
-      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
-    },
-    icons: {
-      'TVMonitor': '\uE7F4',
-      'Speakers': '\uE7F5',
-      'Nav2DMapView': '\uE800',
-      'Car': '\uE804',
-      'Bus': '\uE806',
-      'EatDrink': '\uE807',
-      'LocationCircle': '\uE80E',
-      'Home': '\uE80F',
-      'SwitcherStartEnd': '\uE810',
-      'ParkingLocation': '\uE811',
-      'IncidentTriangle': '\uE814',
-      'Touch': '\uE815',
-      'MapDirections': '\uE816',
-      'History': '\uE81C',
-      'Location': '\uE81D',
-      'Work': '\uE821',
-      'Recent': '\uE823',
-      'Hotel': '\uE824',
-      'LocationDot': '\uE827',
-      'News': '\uE900',
-      'Chat': '\uE901',
-      'Group': '\uE902',
-      'Previous': '\uE892',
-      'Next': '\uE893',
-      'Sync': '\uE895',
-      'Help': '\uE897',
-      'Emoji': '\uE899',
-      'MailForward': '\uE89C',
-      'ClosePane': '\uE89F',
-      'OpenPane': '\uE8A0',
-      'PreviewLink': '\uE8A1',
-      'ZoomIn': '\uE8A3',
-      'Bookmarks': '\uE8A4',
-      'Document': '\uE8A5',
-      'ProtectedDocument': '\uE8A6',
-      'OpenInNewWindow': '\uE8A7',
-      'MailFill': '\uE8A8',
-      'ViewAll': '\uE8A9',
-      'Switch': '\uE8AB',
-      'Rename': '\uE8AC',
-      'Import': '\uE8B5',
-      'Picture': '\uE8B9',
-      'ShowResults': '\uE8BC',
-      'Message': '\uE8BD',
-      'CalendarDay': '\uE8BF',
-      'CalendarWeek': '\uE8C0',
-      'MailReplyAll': '\uE8C2',
-      'Read': '\uE8C3',
-      'Cut': '\uE8C6',
-      'PaymentCard': '\uE8C7',
-      'Copy': '\uE8C8',
-      'Important': '\uE8C9',
-      'MailReply': '\uE8CA',
-      'GotoToday': '\uE8D1',
-      'Font': '\uE8D2',
-      'FontColor': '\uE8D3',
-      'FolderFill': '\uE8D5',
-      'Permissions': '\uE8D7',
-      'DisableUpdates': '\uE8D8',
-      'Unfavorite': '\uE8D9',
-      'Italic': '\uE8DB',
-      'Underline': '\uE8DC',
-      'Bold': '\uE8DD',
-      'MoveToFolder': '\uE8DE',
-      'Dislike': '\uE8E0',
-      'Like': '\uE8E1',
-      'AlignCenter': '\uE8E3',
-      'OpenFile': '\uE8E5',
-      'FontDecrease': '\uE8E7',
-      'FontIncrease': '\uE8E8',
-      'FontSize': '\uE8E9',
-      'CellPhone': '\uE8EA',
-      'Library': '\uE8F1',
-      'PostUpdate': '\uE8F3',
-      'NewFolder': '\uE8F4',
-      'CalendarReply': '\uE8F5',
-      'UnsyncFolder': '\uE8F6',
-      'SyncFolder': '\uE8F7',
-      'BlockContact': '\uE8F8',
-      'BulletedList': '\uE8FD',
-      'Preview': '\uE8FF',
-      'World': '\uE909',
-      'Comment': '\uE90A',
-      'DockLeft': '\uE90C',
-      'DockRight': '\uE90D',
-      'Repair': '\uE90F',
-      'Accounts': '\uE910',
-      'RadioBullet': '\uE915',
-      'Stopwatch': '\uE916',
-      'Clock': '\uE917',
-      'WorldClock': '\uE918',
-      'AlarmClock': '\uE919',
-      'Hospital': '\uE91D',
-      'Timer': '\uE91E',
-      'FullCircleMask': '\uE91F',
-      'LocationFill': '\uE920',
-      'ChromeMinimize': '\uE921',
-      'Annotation': '\uE924',
-      'ChromeClose': '\uE8BB',
-      'Accept': '\uE8FB'
-    }
-  });
-}
diff --git a/packages/icons/src/fabric-icons-1.ts b/packages/icons/src/fabric-icons-1.ts
index e32abc1ba3bfa..1fd73509f6c4c 100644
--- a/packages/icons/src/fabric-icons-1.ts
+++ b/packages/icons/src/fabric-icons-1.ts
@@ -1,121 +1,130 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-1"`,
-      src: `url('${baseUrl}fabric-icons-1-a961c249.woff') format('woff')`, 
-    },
-    icons: {
-      'TVMonitor': '\uE7F4',
-      'Speakers': '\uE7F5',
-      'Nav2DMapView': '\uE800',
-      'Car': '\uE804',
-      'Bus': '\uE806',
-      'EatDrink': '\uE807',
-      'LocationCircle': '\uE80E',
-      'Home': '\uE80F',
-      'SwitcherStartEnd': '\uE810',
-      'ParkingLocation': '\uE811',
-      'IncidentTriangle': '\uE814',
-      'Touch': '\uE815',
-      'MapDirections': '\uE816',
-      'History': '\uE81C',
-      'Location': '\uE81D',
-      'Work': '\uE821',
-      'Recent': '\uE823',
-      'Hotel': '\uE824',
-      'LocationDot': '\uE827',
-      'News': '\uE900',
-      'Chat': '\uE901',
-      'Group': '\uE902',
-      'Previous': '\uE892',
-      'Next': '\uE893',
-      'Sync': '\uE895',
-      'Help': '\uE897',
-      'Emoji': '\uE899',
-      'MailForward': '\uE89C',
-      'ClosePane': '\uE89F',
-      'OpenPane': '\uE8A0',
-      'PreviewLink': '\uE8A1',
-      'ZoomIn': '\uE8A3',
-      'Bookmarks': '\uE8A4',
-      'Document': '\uE8A5',
-      'ProtectedDocument': '\uE8A6',
-      'OpenInNewWindow': '\uE8A7',
-      'MailFill': '\uE8A8',
-      'ViewAll': '\uE8A9',
-      'Switch': '\uE8AB',
-      'Rename': '\uE8AC',
-      'Import': '\uE8B5',
-      'Picture': '\uE8B9',
-      'ShowResults': '\uE8BC',
-      'Message': '\uE8BD',
-      'CalendarDay': '\uE8BF',
-      'CalendarWeek': '\uE8C0',
-      'MailReplyAll': '\uE8C2',
-      'Read': '\uE8C3',
-      'Cut': '\uE8C6',
-      'PaymentCard': '\uE8C7',
-      'Copy': '\uE8C8',
-      'Important': '\uE8C9',
-      'MailReply': '\uE8CA',
-      'GotoToday': '\uE8D1',
-      'Font': '\uE8D2',
-      'FontColor': '\uE8D3',
-      'FolderFill': '\uE8D5',
-      'Permissions': '\uE8D7',
-      'DisableUpdates': '\uE8D8',
-      'Unfavorite': '\uE8D9',
-      'Italic': '\uE8DB',
-      'Underline': '\uE8DC',
-      'Bold': '\uE8DD',
-      'MoveToFolder': '\uE8DE',
-      'Dislike': '\uE8E0',
-      'Like': '\uE8E1',
-      'AlignCenter': '\uE8E3',
-      'OpenFile': '\uE8E5',
-      'FontDecrease': '\uE8E7',
-      'FontIncrease': '\uE8E8',
-      'FontSize': '\uE8E9',
-      'CellPhone': '\uE8EA',
-      'Library': '\uE8F1',
-      'PostUpdate': '\uE8F3',
-      'NewFolder': '\uE8F4',
-      'CalendarReply': '\uE8F5',
-      'UnsyncFolder': '\uE8F6',
-      'SyncFolder': '\uE8F7',
-      'BlockContact': '\uE8F8',
-      'BulletedList': '\uE8FD',
-      'Preview': '\uE8FF',
-      'World': '\uE909',
-      'Comment': '\uE90A',
-      'DockLeft': '\uE90C',
-      'DockRight': '\uE90D',
-      'Repair': '\uE90F',
-      'Accounts': '\uE910',
-      'RadioBullet': '\uE915',
-      'Stopwatch': '\uE916',
-      'Clock': '\uE917',
-      'WorldClock': '\uE918',
-      'AlarmClock': '\uE919',
-      'Hospital': '\uE91D',
-      'Timer': '\uE91E',
-      'FullCircleMask': '\uE91F',
-      'LocationFill': '\uE920',
-      'ChromeMinimize': '\uE921',
-      'Annotation': '\uE924',
-      'ChromeClose': '\uE8BB',
-      'Accept': '\uE8FB'
-    }
-  });
-}
+// tslint:disable:max-line-length
+
+import {
+  IIconOptions,
+  IIconSubset,
+  registerIcons
+} from '@uifabric/styling/lib/index';
+
+export function initializeIcons(
+  baseUrl: string = '',
+  options?: IIconOptions
+): void {
+  const subset: IIconSubset = {
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-1"`,
+      src: `url('${baseUrl}fabric-icons-1-a961c249.woff') format('woff')`, 
+    },
+    icons: {
+      'TVMonitor': '\uE7F4',
+      'Speakers': '\uE7F5',
+      'Nav2DMapView': '\uE800',
+      'Car': '\uE804',
+      'Bus': '\uE806',
+      'EatDrink': '\uE807',
+      'LocationCircle': '\uE80E',
+      'Home': '\uE80F',
+      'SwitcherStartEnd': '\uE810',
+      'ParkingLocation': '\uE811',
+      'IncidentTriangle': '\uE814',
+      'Touch': '\uE815',
+      'MapDirections': '\uE816',
+      'History': '\uE81C',
+      'Location': '\uE81D',
+      'Work': '\uE821',
+      'Recent': '\uE823',
+      'Hotel': '\uE824',
+      'LocationDot': '\uE827',
+      'News': '\uE900',
+      'Chat': '\uE901',
+      'Group': '\uE902',
+      'Previous': '\uE892',
+      'Next': '\uE893',
+      'Sync': '\uE895',
+      'Help': '\uE897',
+      'Emoji': '\uE899',
+      'MailForward': '\uE89C',
+      'ClosePane': '\uE89F',
+      'OpenPane': '\uE8A0',
+      'PreviewLink': '\uE8A1',
+      'ZoomIn': '\uE8A3',
+      'Bookmarks': '\uE8A4',
+      'Document': '\uE8A5',
+      'ProtectedDocument': '\uE8A6',
+      'OpenInNewWindow': '\uE8A7',
+      'MailFill': '\uE8A8',
+      'ViewAll': '\uE8A9',
+      'Switch': '\uE8AB',
+      'Rename': '\uE8AC',
+      'Import': '\uE8B5',
+      'Picture': '\uE8B9',
+      'ShowResults': '\uE8BC',
+      'Message': '\uE8BD',
+      'CalendarDay': '\uE8BF',
+      'CalendarWeek': '\uE8C0',
+      'MailReplyAll': '\uE8C2',
+      'Read': '\uE8C3',
+      'Cut': '\uE8C6',
+      'PaymentCard': '\uE8C7',
+      'Copy': '\uE8C8',
+      'Important': '\uE8C9',
+      'MailReply': '\uE8CA',
+      'GotoToday': '\uE8D1',
+      'Font': '\uE8D2',
+      'FontColor': '\uE8D3',
+      'FolderFill': '\uE8D5',
+      'Permissions': '\uE8D7',
+      'DisableUpdates': '\uE8D8',
+      'Unfavorite': '\uE8D9',
+      'Italic': '\uE8DB',
+      'Underline': '\uE8DC',
+      'Bold': '\uE8DD',
+      'MoveToFolder': '\uE8DE',
+      'Dislike': '\uE8E0',
+      'Like': '\uE8E1',
+      'AlignCenter': '\uE8E3',
+      'OpenFile': '\uE8E5',
+      'FontDecrease': '\uE8E7',
+      'FontIncrease': '\uE8E8',
+      'FontSize': '\uE8E9',
+      'CellPhone': '\uE8EA',
+      'Library': '\uE8F1',
+      'PostUpdate': '\uE8F3',
+      'NewFolder': '\uE8F4',
+      'CalendarReply': '\uE8F5',
+      'UnsyncFolder': '\uE8F6',
+      'SyncFolder': '\uE8F7',
+      'BlockContact': '\uE8F8',
+      'BulletedList': '\uE8FD',
+      'Preview': '\uE8FF',
+      'World': '\uE909',
+      'Comment': '\uE90A',
+      'DockLeft': '\uE90C',
+      'DockRight': '\uE90D',
+      'Repair': '\uE90F',
+      'Accounts': '\uE910',
+      'RadioBullet': '\uE915',
+      'Stopwatch': '\uE916',
+      'Clock': '\uE917',
+      'WorldClock': '\uE918',
+      'AlarmClock': '\uE919',
+      'Hospital': '\uE91D',
+      'Timer': '\uE91E',
+      'FullCircleMask': '\uE91F',
+      'LocationFill': '\uE920',
+      'ChromeMinimize': '\uE921',
+      'Annotation': '\uE924',
+      'ChromeClose': '\uE8BB',
+      'Accept': '\uE8FB'
+    }
+  };
+
+  registerIcons(subset, options);
+}
diff --git a/packages/icons/src/fabric-icons-10-inline.ts b/packages/icons/src/fabric-icons-10-inline.ts
deleted file mode 100644
index 9be3bd2af8260..0000000000000
--- a/packages/icons/src/fabric-icons-10-inline.ts
+++ /dev/null
@@ -1,117 +0,0 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-10"`,
-      src: `url('data:application/octet-stream;base64,d09GRgABAAAAAC/AAA4AAAAAVrQAAnhTAAAAAAAAAAAAAAAAAAAAAAAAAABPUy8yAAABRAAAAEgAAABgPZV7T2NtYXAAAAGMAAABOAAAA5ovkjKkY3Z0IAAAAsQAAAAgAAAAKgnZCa9mcGdtAAAC5AAAAPAAAAFZ/J7mjmdhc3AAAAPUAAAADAAAAAwACAAbZ2x5ZgAAA+AAACWrAABDQPSw1l9oZWFkAAApjAAAADUAAAA2/NBHzWhoZWEAACnEAAAAGgAAACQP/wgDaG10eAAAKeAAAABkAAAAxh+BEClsb2NhAAAqRAAAAMQAAADE2iTqqG1heHAAACsIAAAAHgAAACAA+wIJbmFtZQAAKygAAAP2AAAJ+o2Z8E5wb3N0AAAvIAAAABQAAAAg/1EA2HByZXAAAC80AAAAiQAAANN4vfIOeJxjYGH/wTiBgZWBgXUWqzEDA6M0hGa+yJDGJMTBysrFyMQIBgxAIMCAAL7BCgoMDp/9v8hygPkQkgGsjgXCU2BgAAD+UgiXeJzN0cdKA1AQheEb28YjiOBG9GlEt/beey+4EgQLCoIgxN5NLDHRaOy96yP9WQpx0EdQ0IFbZu63OHCdc/Hue2U6j+0ubt46z1efEDdo56obdUkug3wKKKSIYkoopYxyKqikimpqqKWOehpopIlmWmiljXY66KSLbnropY8BxplkhjnmWWCRJZZZYZU11tlgEx9+tthmh10C7BEkxD4HhDnkiAjHnHDKGedc8MxLNDGaGk2LZsVizpH3w2z9jFg2L7O/li3FsqXHYnrXi970qFfd2e1az7rQk05tEtGDwrpXyF4CutW2buQzsa4rrehSiybndK6gdm0WMXtk9tBs2OyB2X2bh8wGze6ZDchrdlo7mjIxqS1NyK8xk8Pa1JCJ3uQP5SpH2d9//V/Lk/TXCf6+PgGgLhXceJxj0GIIZShgaGBYxcjA2MDswHiAwQGLCBAAAKocB5V4nF2Pv07DQAzGcyS0hCdAOiGddSpDlYid6YZLJNQlJQznpYDUSqTvgJSFxQPP4m4Z82IIzBH+Lra/z/p8v3On+cl8dpylRyopVpw34aDUCw7q7Zn9+SFP7zZlYUzVeVb3ZcFqCaJrThf1TbBoyND1lkxtHh+2nC1il8WO8NJw0oZO6m0Adqi/xx3iVTySxSOEEt9P8X2MS/q1LFaG04smrAP3XrPzqAFMxWMTePQaEH/IpD91ZxPjbDll28BOc4JEn8oC90SahPtLj3/1oJL/hvttyL+rQfVN3PQW9IdhwYKwoZdn21AJGmD5DoT8ZMYAAQACAAgACv//AA94nLV7CWAb1bX2vTOaGXmTPZZlxbKlWJIl2bEtO5ZlZbEdObEdx8F29sWJSUJMyN6EbM0GQwiBZoEsEJYmeSGEtBBoS9vQhvyPikcp8Erbx/4gBQI0UKBpS94rjW3N9X/unRlbdszS/v0ljWbm3jt3Offcc75zzh3EoVMImXYKGxGPJIQislv2uWX3Kf7d+JPck2ozEjZ2777b1Irgw8FPMSMRoUp0PUK4wmWyu7ATZ1k4r9sT5GpwpR8uxAEpVZFaAVcGuUCQ93osnGThITs75K6ogsxaDi5cnJESNqHJjzx2+sjtoeJKV2VjYS8qbKx0+R2q4vD331cWh24/cvqx7/MvVbTML2o8evJUW9upk0cbi+a3VPgdGGllOUV7lt6LKMMbnryoOrS5nqXSfKjS7+i/q98cql40OezNUGOVHS012b4qryx7q3zZNS0dlYPK0judHgiZkdSFBJSEUBKOJGG7FShoQnHpMi/x0mXpCuLT+SuX41d48+XuVnIaz6TPTcai1C12w3Mp9DkJnnOzk3CGazijilz3mThSz+nXJrg8w3VDonpOv0IcFtFksVvqq4O2zdvhjKG4CNXAw2fgcXZtmswehqT4Ga169Rz0Ax9D1eJ10i+1OnBA6wmtgys7wF3HXXeAlOGXD6jH1GMH8MumlyGNXcX3QRrLhToQniyekeioBNoPOQm7xTPdkzHiJquQ3j1ZgEa5yZReUBaJZ8QzWlnslrEb95fFSDjTMxlKQh4CPjMj5ELFqBFNRwsYt3E2oK1b1rnGxFjHJmObu6KWiwB74YQs2e2xmLzQAqS7WQlBT3FLSm7Qm9WFelGWN5iLL5TWVRQVlQ3nLrBkBV8YVuByyrLTVTCMHDeKhAqhCL6g5g8vKyoM1ZWSfH6pViRfe4B/JCFPRIJCn+xR6EhpvdY8T56VJhFIUpJke3q6XU6CfKUvFyvsFFe4KM2jhUbqKcigiaSgHOREbuRDRQgBr9ncxmHzhvUD7rBMicvI5abXiqQQBeuHorKfGfUgVRHgkmNHNxwSgmztxz4SgmTjOb6vDjaXCInwNHB+JsxOSNY7YpW9Mg5gd1hErEaCTFCP+ng7N43Mow0JitKjCNAyflj9QTs3XUGYUxCkwNh4qAkqormS0oUkbY1F2bhFlMpy2dAoq2Iz6o6RaC8S592hriKX7sDflaBJEsUxQSHTIQ1b7yAgqPiEOpLRyP5avLaQlQooPgwCikonW4hyEGWrLIvJiUNGCyYE5LI4A9fU+Crnbqqv3zS3cr+zYoLfP6HC6R89frR/f3/LPYqCi3zjnYGJrfPH0pL0CVqQPlAUHVvdNK8myvqEGI97UQDB6vBl27JEryeALdjrCZrClbUm6IgJEiUf9BMbPcyCtFAlK6D1VLpk9Tsc1vhfFny8bdFPjyrzKyrmK0d/uki7nj6FeKFD5jHXbhhbvaFjjNZb9l9QVefMjY7yrbI6HH4rnzFleuKD2vW2jxfsgEkcv3i8OzBpaV24tXZkWblLP3lCnsxUZ9BtyEKNxqkoS5tFur4ZB2r/btkMS45E1ShRemF9qKBMehQQCCiOKOWwDzjrvAkYUD3P+TBSETlP+QyYTaJ0cqAyKjNsTLfI9B8UTFimaiaMmRJh9NEFBAaGosuNqoyOcLiDKg+60kwxKsY9sjtX7mFZMLU0nSBahiZw7DmTQkV91JSWk63GOIVmsjUII4S+FKJWNAPNQddCj7KoUgNulGH63B5/GEQOBmVnTCAGqQOTxtldQqii1qQxm4mHMjgk0NUJz8ohSbF5Suwp1mTiGVVIooWjiCfZmmIv8dhabv/5659s3PDp6z+/vSUeXfzi2eOb6pPT04Xg1r33HLg1XLnzwD17twaF9PTk+k3Hz7740MY/rccjH8aILlM8a/2fNj5sijlHjvCkSQJUTsYWjhpViJ/D7yYLUppnxEjnze+ePdAZDnceOPsuV1cyY/PRf19ltliSeWdJflaaIKRl5Zc4+WSLxbzq349unlESx5zdTn5HpcFIu50jvUCSJCqbJEVaCOvEDPOfARwwDOWhfFQA9LG5w6AVQCgNcWCvHJKtbqukXFH4mBqFPg/+KZBFZYZChS8BPvuyQ9UlE6IABebpYZinbFSCytEYVIvGQ088/gD2a+sm245dmLJSYqKRlmQy1mIE+M1thQN/mlOWSe7xUdZwlGXi5ZlUmHNnaephP00N+/AKlqi+Qw7jarycP66ty0nz4gUACJDCA0tzz2Rl4hW+cG7Qk2WFRzPLHI4ybxb3GiQv94cpJ/rIPXoq2YyX42pyuOcmbYU+OS+OKUno8Pg+XhwBI6yi+jHb7uKpuLDwA5iRDwQxHV+kFlsZ12ksx8cWPNW+9Y3j86sDgjVL5voZj5OzrEKgev7xN7a2PzV802cbcMXD2IcrNny2yYzy80sO/+rz2yuuyeVTkpO5RI7ikpNT+NxrKm7//FeHS/Lze25hnIL72ESbFybzwmgS6kBr0W3oftpzk4vLtGVxFs7E1jQVyRh+mlQW6epiQhFyMmu5AqyJQZiwWo4WwfpZF4//8L0J7cPih+d2TZq069yHpHsfXeu5eWKylJND5UF5XSA5NaX0eiZEaBEscmnuMSU5OSVj3Po5vmBQAn7waxPcgxLMSG9/H+mmvWFy6/rSlNTkQF05bTsnR0oW83Jput5hkp/wPDuT6OAUjAanxK9KwcrglH9YP1nhfkgt+o30k5kppDEdG6rHbrh2zH7fqGius66qgKV+rXrCyFVeNrK2NVy3dFLATVVV0JmaCcpJTzZwOhtL0VeOhA/ggIS/rseLbyctR+7ABV/TM27D7aT1yB3k98Z67ccg5QMwSKJuB9ARTtTuiQgEmw3wkaDFDRgyAIDwyAAeNfOaqsdGi6JR/cIAIkxnJ+AuSUdeoJEo+uKY/tAwmNINZTEPZU19GM0LNo4B0VBuHzZNQmlIRrYEjFoKeCuMRqMaVIcaYNW3oKloJpoLq38R2JDL0CqQAjqOZbg1ZPP6vuT4V+YpVONAn7soWb/k6P4X5jFc3UPhtKoM+JCBt/hLcw09y+icBjQfSFmEqwqoWrMFMRWZmEpPfyBEFRrcufhQRVXEpknRgDHR1ECIwEENfoneP7caFz6cH82H39JnpvN/ESVJ3CGIotBjKb3x1v2Ttawb/uOx/SHxPorfNL1LFRvlGLhUgT1Yqoi23iYKO0RpfK2qaM9pv15UvWC8l9Ub7rxzLmM2OlCVUgaGz24o7gOrUEJ9tqIM9rGbWpOmMypYk9Rq5MFmZOUmS8iwP5n5ifvLafZnL4KSiK4hhlMUoF4AjdWtShOVUoYgsIIKdVNvRcKaZIqGKo2I28JraggWp6zhOpMJbb34/MkN0eiGk89f3Np//Yf4jH1LRmO08PRnuzGqXra3bcqeZdXVy/ZMadu7rJooe8l/fmcY6cq+9tbjs5c/tWfq1D1PLV/+y9N7OyORzr2nfykpV1W4Tbsmq9kz7Hk1hVaWULk6hbZHW2b1Qb0Ysfr0upnNvwJs/nsSfA8BzXtgQsykJ2WGmQ+mP38tu4I0/pThDmC+B1Hsls4k1mFlJhnUoXspzhgeC/4Mc0FAEj8Z0tgNnS0Ri9IZwwdipb3gaUfO6UXUc9IPjQfFbt2PQe8M54Zmc0hMruv+F9oPzPwvfNfleFe867LUdQWZPo+bL/Pm+JXLksQcMEwfSF0DnrPTRWD6nDdfjpv5K5evSHgmOQ2wresy3wWVQTW0PUnXI+w51mfsg/a6+Ct6E1IXOS11xSXd/wOPmbV+xti6nY9u0j0ZADOLcdiAMMXY0J3pOIgNvhuLa3ldjTJjJ9DHfBV2LQf35foDERcO9SEbUQrUYnH7lH3Laih3KIph3SgTNz/UMW7D9TNcOf6WIoMll6WMGF3vC06r8XprpgV99aNHpCwzmDJYFlixfc+k1c890Bn/3fJze6ZM2XNu+Q1PTZpXtbelbe/Smpqle9ta9lbNm/SUoFTfsHcqrVMxjK5ox0ObJ3rGza0KpskGmxaMHWGnzZRNrfHaR4wtMDg1qea6Bl/r7nPkVdoCball0rzIGFo/bWdMZN6kFqAl6DhJEWKA7Ucx6yJhTQI17DwIOrsBFzWoL/WTVFJ67mVjpY17a6aWsbG+qfX/hqFHB2JD6/LUMkoh2mUSZb0Zsp8oAW9IKF2TSTIWwAz2yVafjM1I7Y6/T5qFgu7fk/MvcKe48+KeHgeZBxbweW7S9abryV/VjO1cCxaehaRJCVhMAslvozX6ZMFng2oFWm9AjvjCWOAv4HzyEWklL4G2Qd0ggnuQsgHvxQvUfH4ht6ZSHfPHAwfxCn5F16Ovc8IfxPd6Yj7ceN93v02699Mmige0k4GsQOMcsOOGIw/o8kLID4LOqUQRsKhqUBRNQI2g0a9BbWga6PQ5aB5I1OtAqy9FK9Bq0Ovr0Sa0BW0HqXsr2oXuHNzvNDAqbIC3SrEtIkUkGx2KINuSOMGJk7At8YcFKCVFfNovUsYNxxHJ3v8T7JGAZIfFGE7iwdoMw8WX/AximRCYyB+RBvK6QSy8gVzCK8k0vP7k03gYeeN73ztxAg8n7+Ot5Da8nuzFd5G1+AD5Fl5CHsB3k5X4JrIDHyWLsaKuugtL5ML68yS+6Fny6eij5OMZVYVfPHtr9Xdem/eDt24489q+998+TdTfvtl88X/wd9VebhMZjt8nEfyieje3ktyMbyHb8E5yI76TOdj2QFeO4sXkTnwj2Y03kpvwjq58ZSvehW8G/TqTU8q0mdzCzzdm8ukvXiaXOnDo/udPbHt4wQuPdryHuVPkHjz27XhTB67A3bjh4h2duJkcXITLyKPzcT3ZPxdXkmPz8ERiqsTpV9qbipvHBEaPGOG328xm0Te+pNAyMeyYND7QNLe6ubOx4b6UXdNwA3n3nibyVxj/Ycy9R5rxgj+SZ995h/zm3YvkF394j/zm95fIc2+8T86/9D559bU/khff/JQ8855alo0bT629m/TeTVlM0P3mGl60IwegRWRl3kPZG3bnAC6xykISnaokLiAncQpFGWakoVESI0nkiS1bcBv+u6r8jI+QGI4CcBAVNQbnXphYdVec/w7+O1Gv4W5uISorRw7iF8mfyZ8N25nxOQ9cHoS2fbIvF9vhZ5VSMPw0Z7PmaXKHBx7IBEDusV3/NmfO6e8/3jr36Lx6sZpa61neMgcDzgP8ElL+hSvogmm7Gk7B58iYFD4/heTht5JJNT7LOegz3Yg+DSAx4ZfYRxm5UIXh/2ZdskF3bbzWU8lKu401D3DC13BzU9eEqvQAzT+Dzh5rr7/vtuOz5542WdU+t65xcICMaPFu5ihTLojRCwqR+7ubZIzBdFcv6gOo1DbQ5xMBqoJ+2kERUf874E5DDjODnnnqKiMATUNuPvbj7zUdaMUxsqBuXVA9mFNRQM3OAm9WnkDqA41hVzJGWZ21VOU2OF1xpTyoHsrJo+bp1ENNxXPLqXcu38mjsU2UVtRHGGU+wiDzyTH3m2GCchI1LcJu62C/AXWX9EE/LpINaoMiOuqmo+C5ilcaN84sG7/23lmz7l07vmzmxsYY5a6Fhp7Uz/jTli0zSmvXHo29s2nTO7Fja2pLZ2xpyazqXFk+Z8vh0x0dpw9vmVO+srPK9Gu5ZcXOJloZrbRp54oWOX4Go5gJJVTHzuS52vsff3oxVHd0bW3tmmNQ9eKnH7+/dumchT27tQq1ynf3LJyj2ZeAUKRLus6xUVTjZl9BO4WSuIgdS/N6EHkXJnscrKnfwbRfq74Kd20E4WeI4hReUF8l/9P+E/yqALqDB6ZRqdsqDif8qvoKtrT/GL+i8aZV6pYuwfqlnhxoKxBxV0VCgQhPCQq0ZiQMmigQ8dopvJKqKpg31M+0MmhonjlFpW7yavshcsv0ho8PtbdoSDWu8Mqck3dumB4MTt9w58k5ksUs7m8nr+LS9ruTrckakO1+bsGS0llbWzsaVrcUFUxYWIOjtKZRTYfa8SGtiKI9rlWF8YF2XEqrwKwV9fByLN117ZmH9lR1lGzc891p1xy4dV0ptREM2eQFK70JtWo2gh5r4uW+IJLuZtZDT2C5ZtuMqCdl8jCLxNisPPAezy3UA0g8izEp8YQoUlE0fq8WZEoIO+VLxRYmTyxUNlhwMTWLRp9VzkpKXyCp+3GMTNPZLVj8Ilu0vciILCndo/Ochlhy5nGzPleUz0GBrcXp5HNyl75mzkpUvhQxz7qkh4uYa5a57b9iRPwn0fibHEg4Zu7Rr3h66B5zYBpSVzQUo0KGfc9+Zdegzgd136YfrLQ1CPnoqnXrkgRXhWUtzEW5C/qZJWE3b8E+zXnrdQMAZAZvxFoBI5B4EdAxfTDQJ44iOEBRI0u1gjii5ZjNzLvyq5oC6s2FIIAsFm50MnC/kuKOOHtRHnkSf/R8msXks1hc4caAWj9yXg72iP6qOveYisV5AfNrmQXOkvTkn5A7zcMzLMOsKWa8+ofm1LSsdGeQN71ldsl5JRlJ+K303F8FmiL5VILljrTz72bK3HyQpDenZeET6snKcjVGTtpL6+xluTRUUVGM/+YZVZSdz00vzrVYyJ3DA87MYZYb1Fss6alZjjRLGnfTktSs9CSfS8oU8Y2WjBF5sj2N/DXbrckFSssvgJZlgNdWwTxTmtilgMj+vJ6AFIj42R/QJRCxV7E/sDAidikb/gZ7S+lc2K+eiyy7VZT4IA7rEyJKW0Rx28ht3lDlppBr+HBXaFNlyAsJQ6aSZiO4rp/VPzojbaH43gETkXR83OjDaRY2F5zkxurX1tufSv4roXZ2jtXddOOSokGzoJ60ppNPM11YsFc4uPnadHQw2+8E0HEB0NHJtJzBbEMQwkfHj/1ACWkC8Ao00P0sbTDNGEcy2ZhLzvAvkTO5oE889vJco1+55Xb+giVL70mGNxxUf8HVBcPcfC3GdhjFpJhEo4fJhr8OIK3bKsVURGrxCvIkOUP+A6/cLkW7ABD19CxLNR1S/5eauwmYx4KGgZ6sQFWojkb9I3YrE25J2Cszt4dbDtllOu1gsugYiN7RM5i7PqsDW+3Yy/u5gBi79957i1isIkbeuh8rdEn3ovs/psIIFDiDRJgBHAbMuhl4erRpb9On2H/xieDMUtMjUAMXpSXJDbiO/DeHehQGiJSPyQ1MMOZg1POxhpFoMZB6DFMJ5aRL/YJ0mU05auDneNXPDVwJY0wGiyWCJoJVQuMisLiLsVyL6aXMrml0BGwRnxySK6tAiGdT9xiNzPm9I7AkyHZsBNX1LwY4Y7PT56FkmBvfXF8/uTp9uLCP7gWJ+R0kSiGW4nfEG2SPnF1sb/zWNYXHTiVlJpHnf2/aCpoW0fHrB9yRHbkpf3D4ow6/UB2d3DwZOzHH1fsdMHg/iTn8vYjiL5CZUKLnt5jjk6PXbW148Amc2dObxh9QdAQmKBmON/wONUp3pGD0I/yEFBOnUDxNuaPPNDYx09iF7bIUiysZTd+6d8G3f7Ru1LBQ64o7ZrTdtrzFJkgmMdqj4BOzj25qvP7k71Y0H9q1bubIqo6bm6w+K74nAbcDfe0oF+gbRdNpVC3Qh7ZMLKIGdNVDNBRKcRHNFRnkAc9TLQoSJWLwFfQoG7rFBX35nhHDzBkjJo32RQLD0oX0wknqfZRXuKlrjl0fzCqua79xYuPGjglWOS1VtkbnruXHvsx9Ny3PkS2pL+XncMgybHiGOrN6fHomb5a5l23ZdS1TfCUr5te6QtGGCXmly+aONbVpfLPwgWcW1W67sbN5xMgZa6ORG0dHvhWuWT2tXL30GJ6NpfQ0tSMb/1bNs9lTOPxKKJKWzpmTBoy/mEUUG8HaRRg0BwgD2ThRv04/SmewgeFQQZKzsm00ACfJdrkaznYW/aQHACbbEF+qhc0oJSkphR50LSjaDhLKa5jBe/YXT/8Am0SePHr+RYxXf8KvpZzRiwYxXQLzCUh2WyxuuVc/E1ZNP+qnrdDjW2nqfWKKKKSK3IzU+KgUbmqSnKR+Ow1nEJBjvVT59396GXbi0DYcZTIqhcYFwCQPSD74t0dK9eWnxSVh2fHNeByZuWY12L5u0oVv71iBj3C9dEGpbIuVSVBP5vT8OZtzcg77B38e9onf0c0yBPgfGE/kgeMjgBXGgY5j1hwgzloBEL0VzEgBwIEEhOelRLNOo7x2GDtl6JdJKPww6f2b4Mj3urI4jjuMreRjLJP4XpPAmQR+c7f4q36LT/twA4wpzerj88lwS0pV/eTx5WaziTyRwWVxqenk12ar2ZxhxoXp+FiiAZj47WHU1Y4EvpMBEVXDGFsH2INMkg0pxEDoAXfpDkKNpdhzbl+/VBxsJ6rC1RJM2KoqzjoPZjsmPHVOZt3CSLV9FXFDHEps60SPDkUpK0Fm6yDhZTpA3pEze9l+i0z5Ico3zF3YJwaBhx7U9RzdS4Cwj6dMxAMP+exUrPEjceVz5FKBl/z9CM61ObF5uOm0ioRns+KzMn/2Y5mfkHnngczvc0VUBw5Yt8OBfjRqcs1A+sH6C+veU7dMQSVTg7KgUwjwIdN7oBT7aAz5lMiSMtD0d9W52/avjpJ17joXty+6en9b/DAjTXpzvbqcstZffg/ktQN5V7cUFk7dMs0MBP6VxDRbj+EJ2J+WUbfqwFS8O4MuNaTV2KZRJ8oVUN7CeWl4AaVs3aJt9VNuml2KM4Fun9C1J8aAbew6Puh3EHspm1RVUAVAGhceuG5k7dpjC8VUkZzEG5KzxFg3KJM1kaX3XLvg39bVYXIsy7QlG1Oi9a0xCdZ0OnKjMWgamkX34gz0jFgHcqSNh6VnrDwrW48u6qmwhcCKGHy4eahAukpcDWLNi7AMM0mPv9XLSbAK/0R6/1dfpJ7pftOmxNAapzDAISIaQ4uzyBLPuLNb6edOpXsNW5KzHp2jLUji6l+xs340U0iUb9rGCyGBHhkgb1rQPE3iAHdU+sNUw8pY0vYjMV2QwGKDvkwb2qwJRROvmRx6ggr0P75Pjr4t/iXDm5uZmevNOM6w0pfIdspAx42S+fl9V5pAwtUpXFuSlYpwkztNvYVbkYrzkrPyrB9ZndZkA3f1j5hxJUF9JagRl3CDmO/nR/palRnH2dxhH3Xz+qyyD7SaFOulG3NipIv8DKQ9ns4plNOUS5n4ZVJjNUUzSQP+T+uflMH4ogg1gJSb1RehAw7WccbVgi8BYxhh9CQMpk2ZtvFsOAUc3OY+YDHGl+8eMSwJwIYQHST6bk2AGHNubOiDHkI9WS5brfIJuoHxGcHE4Z8K5RqwCC6dO1YHG8s7avEUWlucSUDClClo6zUUZoxaMwZgRu2qaQnwg08ma9PTj6t/MyHy0dMchx8fgGEtyAdrrY1hjK8RRGk6nyVyV1inFH2WFvOBzuW+iTQSZZ3FEp2DtzlK3Va/Q0PqAHRNT3ydPNoe14C/vniwYvOW5cQBz/IsPcaUuC6zgH+sMFqEr5JXPg1S0Zn0UZTJ7bpKdgn1DBuBBL6B/E2wFRaIUwbLsb8aU2JSuvNGFtgS7CEZ5YFWGAEW0TgWRx/sZ2WGjpfZPAzIyQGvEAlIPACHJI3qWjCP4bVQ0lX69DNm53xEbR5OZnkvVeIoWD2PUCmlbUJm/ae8VYlTgRxXu2G/Q02c1U/pFg/ezwyjypdmQzXxGEbcBPI5eakPECoiA3/kBSqlEu3Wqm9quWKwcmBB8W5etGVlh76JIcsPd/gE4WTP8YeTfLnf0KrtQn5HcrqZhlnSMxk/mKi/gs2LFYXAwliRyBNaSM9ay0e84VCQD9i8YQsvgf5w8fZwiIfR+HjNx/NlXgrq45X6vBQhCxZim145Mm/ekVc26eefTd27cmLqkSOpE1funaoMuIkVeXB4T3rUT2msxgrqO8epswd4KDKS8muc6RnMQ/EZx5uUhIrZuecPQ9Sr3eCoP5q+h/zaUwSTmzLt6F03h65yTshOS1K2Jas6x3BNZBUaPh5GMx8ajTrpHPM2r+Gz8VJ/q7YFUHOIi4FBLh3Q0rYhPTpAq0SXji1LGhVsrszri+4qeZXNQY/fuPW/bXC+fiY/mzw1/sFAH84lVyTnkuHEiWfjtpym2YsrjfB05eLZTTne+RXGfcV8S0J97JzRFFvaR5gMa5/XpjM134aPJLhtotFrqI2g+TnpviVtb1Ip8BXDLphteqHuTnpF96l+lcfTxPbIxxXukahqZ3vYYdkti6pvUtgnfInzk5WjkSkAh3G6RwawyFf7ZZn/mfV3ClqCbkI7YSGwmEXf9p2EiZS8NurcDAzMsEdCPItkcKGEicYVCRv06C7Irxjr9gmbH1vWfHBC05GWm165b8aco2/dsu6l++eazWuaF1wzix+2sCXSFhrmaVzZbCvxO6WU9XbObLI4c4JjPWnjNz64cOmjm8fjQ56Qb5hFTHEU54+sK5RTc0uF//MlVKpc/uimaE7+Spetdf9vlVvePjq3YcfTm911+U+Nm9jW1FoyqWNk3Y5l41OHebKnEtU51plZXuyqmb3Au/iBpVUtO58gLzvLqqPjHM4Kny3cNj+QN6bMFW/7JnQ2011VbpCMpex9FN35/VW00V6Q4T+J24G1ehD/CL9j6FGpm7l17WqI/KSd7oZiu90R+crJ5x5gT+CWdqoX6V6lu1g8J4Pte2f+qCT2aoUbRzDilTiMIq6Id5GcKXhuz+9MI8n3pmC6w0mJx8iwKXiOgudM0feNafIhG3RdAei6sYAqFqP16Da6gyIrGYsS4G9RwlUR0Lq1uASHcC2OCDb6T3cLUxxvgzQ+AvKWbnavxYEBrGjh+Kt25epSmwVKrAmcCPYaqtv5wq5fkFd27yPXTp76IVe9uRc7cPWT3audY/PJ2/iW0JIQ2esc7eRbS9qD03DO4kOdYWHv39/7befik034xMY3dhsSwjgPEj09F40M7Q2AxGwzij5Jfkk+6t2s/vLDqZPxiX27cfDp21/YWRdXgu0l101Tl0DTeH1oSWV7/ljnD7hVi3/z3t/3CuHOQ9ctenMjubbp4U2JTdMzVgbLqXifmMTM1iUDSuhxU6zNS6Gh5SRs4YHvAkHMvK5VLFqqL3aguxRlodFelFxQPno4QT851XSglUTxg3XrgtzqxCCqoGgRUhU5R3qsDU4Xr5QHuVWJIVS6BjBi++HM+q5NhCN2OSRH7JiXJbqhK0BfrwpTzuMOtR9SDrWTV6OHtEDaIV65wrZR8tb2g3TrykHI5B7AvoOQT15tP0jO89puSM13bfBgGdsDpaMQQ3iZqO4xlFS2nQ2a7sjVow+i4WDUuctkSDHq02RhXIoOaLgR0AokSFujDVTldp5rtRXZtH1zPDdEWnxX88H1TaGZK9aumBlyBkflVTaWe/I9DqsvTy6smzZzqmvintUNnto5kXE3j7MW5GXQl2ZGN1d43AFX4WhrumvuklX8463nOqlyb4hyvLZTDxoYlHZxq62I1LqbN82a1Dk+4MjKLfa6S3JTbW6f25Zic9sC0QrfsNThjWunjZ0TLbbILlnIAHHnrfBk5BaWgbIb4ajILhnjTR+wN6AVaPkDah+4xL5NYpSKVQm0oimDXLQarUAn/EOz4A+wLfksqGvsqOqPmVeBdc/X65RsWn+wuWLVkrmudOvoQlfA7aloHk03dGfkFViBkJE5tZ6G1XsmuqbOnAaqIc9nzfHme8obK/NGBZ2mSOI8bbv4/EMbKA2vTiPj6eaySXW8pMWN82vyG44uGiLNdNFbnJvlCIzvnDRrU7M73TumJLvCMWIkI2yGp8Kb7RmWIQDJLcXROWOnrW0cnjrMVxGlDrMUNkGpuSXke30TCoy04aHnLw6Y5P60+NN0h92iow3QtBaHlvi6SUOlweKLImr7xFj89RvOhTQ6OpHumFtyqsURcqx77ex9K6t50xBp/P0tp5bQfXUToya+euV9Z19bB5lDpLH9G9q+YroLXHt3MGymL2DBISnnVRQ/z/t4dF7nPc6MRAXs0zQmMUApJjHDX9t6a5doMDEQsUfMCOBSHCyuHpA0/Noul7T6gw/aP/xQ+4kUS32b1OFfxO+grwM+j8/GPR982P7Bh/NYPuqLxettyShyVWsA/a19b+t5w4nvIFDYq/dAACGk9UAAhRulwjivuKI4T2H/hlSm4poiNTywU92KwjNJHmwcVVoSdJaXlzWwC0OSs1fDhuqrFSRpQl+9thD/JZv8Q9BpBM3wSrdCX4eL3yV+0J3+/6urho9B72sxqmRxwIGUZZ6okM1tiJUagB0hZn15qUEI5mEkUZ8zOmuIhNH5ifHrZ4fAuDWCrb1IqZi9YYfidzj8ipE4xBBUJTR7/fiYEjVsx6gSo1WpSpRF2mJGekzz/2OF7TvKhRUUYhGAiUPs6R78/g+N54FWY+91JfArF7v6ZQ/tepCJaIroXhHEXCPq9gS2ltDVj2vXPWiwMQhAkVoEdPP8iUTOl4YY1zjjjftvOjLf16yNf3a0YMZ8JV/+cwS4inP1iwGcOzRdlvyTdPEOeOvGq/kPw/8KyvQBPY1EyVmuMcG8/2fSGKRwBktKRzUGyz05JVmuSHVjkNGG74VeSDtAhluBOl5dn4hZos1d6a9kO12w2+rm4Su7eboljL12ieFzhf3jm007esn3FbVcId8XFZGcjleR0/iEwpUrvIlvr59wbN/StLSl+45NqG/nTdt6mM+Zvs1OX26k1wm4hL6Xwny3+lbsAS9ZBap0BMfen2BzY9gKYWPi3NqmMT5249rr207O3PnF6z/c3tCw/Yev/+027drvWxzUFJim7tg1CVGfpqAMtgnI+RPt5Flc034Co/zrna7Eiuj1FzsXnpvTedvuhKr0ankFZrfP3WHM60PtuAZqewih/ws55bAIAHicY2BkYGBgqgiW+HzlSTy/zVcGbg4GENj/92ADiL665cCf//8YGDgYwOKcDEwgCgCgFQ2eAAAAeJxjYGRg4GAAAQ6G///AbEYGVMAEADGEAhoAAHicY9ViWMbBAAbejGyM8xgZGMEcRgamBgYoYISzYICpgRksxujN6M3QANTFxsAGlmAHYgc0xQ0MP6D0QiBcxDANzNsAJmvA5EIgfokkCmIvAqtugOpEAHTTGf7/Y2AAALeHE8cAAAAWAJ4AugDcAP4BIAE2AUoB1AIcAkICUAJyArwDJANQA5YEIgRqBNwFNgYMBnIGtAb+BxQHIgfWCEwIYAh2CPgJGgk8CV4JegmWCbIKWAqqCtILBgw6DHoMzA0iDWIN5A4aDogO/A9KD/AQlBDWEPQRZhHmEhYSlhMoE14T0hRKFHIU5hUQFZgWIBZGFsgXQBd8F/AYSBjiGXAZyBp8Gswa8hu+G/4cNBzaHb4eAh4YHk4epB76H14fyiBWIOQhJiGgeJxjYGRgYEhkWM+gzQACjGCSC4hTGCNBTAAkbAIGAAB4nLVUT4sbNxR/XjvZLWmWEijkqEMpm8WME3chNDktSXPKXjZhIZeCPCPPiIxHQtJkmNJDjzn0Y/QS6KcoLfTYcz9Bzz312PeeNPZu7IZtoR5G89PT+/t7TwaAu6PPYQTx9wW+EY/gDu4i3oN9+CrhMcqfJzxB/HXCN+BjsAnfhE/g24T34Uv4PuED+BR+SfgWHMPvCd8e/TyaJHwIx3u/YpTR5CPcFXt/JjyCz8YXCe/B4fibhMcof5vwBPGPCd+Au+PfEr4JYvxHwvvgJgcJH8DxZPBzC15Ofkj49vjt5K+ED+HlwXc/vRPz+w9OxJnOnfFmGcQT46xxMmjTZOK0rsW5Lqvgxbnyyr1RRfZMLpzOxdnT53Nx6r0K/lyVbS3d9sG25EI5j57FPDt5GE/pMJ69UKVRQnshRXCyUCvpXguzFKFSl/IrnWktiXOzsrLRymc7k69CsI9ms67rstVwnqHNLPTWlE7aqp8tTRP8bGPuW2trrQpBB5l4ZVqxkr1ovcIkMDESi2BE7pQMaioK7W0t+6mQTSGs03iao4rCr/TCKrfSIaC7Rc9F1DpXDfnCAy+MG8CSIky3S7XOFG0epoKYR9sp2QwBdCO6SufVpcw6DKqbvG4LbNM6e9PUvTjS94RaLTCXjTp6+FC2rF7ophRO+YCdIlY3Ach87esxM3CkMUpQK2qB0xi1MF1TG1lcZU9GqpSjcgyGwrUNtg2iUFQm6VSqtlcZxWFs+qRODUGHyE+lFxpzzq7fbXgHAuZwHx7ACaIz0JCDAwMe3yUElD1B5PDO0ypRohE1kOHJKdT4CDhHWQkVnnneKfwq1H6Da4Gaz9BugXvyTTGe4j/LnO09a5IdWZXQoj+JmtexuI7OBefhU85UaYZ1PrxiO1hetnvB2RhcBepQVRLfwAwUKF1xlq9RRizRScW6u/gred8ig4N2jt8V7iXmpJmt7F8wTzwHlD6CGT4dPxn6e98+S3FmiHv2UrIfix56lC7ZG1U72xndc84WO6K5j2JtQb1/xTUJZqLHb8vcRSYiY4M2yQxX7VCD6lAwxX3BepY73rOE+KA4ljsTbfPkRaW9ZN+W+0o1Bz4jqwXnMXSi5orIasgrWnjugtuSLNc1TK/VVcv7Am1y3E+ZrzjzMe50Hef9CjRPYsc85bju5qxLlZJ2jtW0PHfFTu7JpmZ0hPr38EsTuki87PIec/iv3G68F+ypRJnjOQ7pTg2zuquCIfp2Xo8vzQBVEmsJHG+4BeQ/1lqgpOPKDd/KD82evDJVivti0hqrirjlm9WyJWU7dHPwQ5o13+R/ntH4z9ikzmy8DzdEJ5ZpfijfBTMde/s/3O2/ATLuOI4AAHicY2BmAIP/fgzlDJggEQApiwIpeJzbwKDNsImRk0mbcRMXiNzO1ZobaqvKwKG9nTs12EFPBsTiifCw0JAEsXidzbXlhUEsPh0VGREeEItfTkKYjwPEEuDj4WRnAbEEwQDEEtowoSDAAMhi2M4IN5oJbjQz3GgWuNGscKPZ5CShRrPDjeaAG80JN3qTMCO79gYGBdfaTAkXAMQBKBoAAAA=') format('woff')`, 
-    },
-    icons: {
-      'BankSolid': '\uF34F',
-      'DecisionSolid': '\uF350',
-      'Parachute': '\uF351',
-      'ParachuteSolid': '\uF352',
-      'FiltersSolid': '\uF353',
-      'ColorSolid': '\uF354',
-      'ReviewSolid': '\uF355',
-      'ReviewRequestSolid': '\uF356',
-      'ReviewRequestMirroredSolid': '\uF357',
-      'ReviewResponseSolid': '\uF358',
-      'FeedbackRequestSolid': '\uF359',
-      'FeedbackRequestMirroredSolid': '\uF35A',
-      'FeedbackResponseSolid': '\uF35B',
-      'WorkItemBar': '\uF35C',
-      'WorkItemBarSolid': '\uF35D',
-      'Separator': '\uF35E',
-      'NavigateExternalInline': '\uF35F',
-      'PlanView': '\uF360',
-      'TimelineMatrixView': '\uF361',
-      'EngineeringGroup': '\uF362',
-      'ProjectCollection': '\uF363',
-      'CaretBottomRightCenter8': '\uF364',
-      'CaretBottomLeftCenter8': '\uF365',
-      'CaretTopRightCenter8': '\uF366',
-      'CaretTopLeftCenter8': '\uF367',
-      'DonutChart': '\uF368',
-      'ChevronUnfold10': '\uF369',
-      'ChevronFold10': '\uF36A',
-      'DoubleChevronDown8': '\uF36B',
-      'DoubleChevronUp8': '\uF36C',
-      'DoubleChevronLeft8': '\uF36D',
-      'DoubleChevronRight8': '\uF36E',
-      'ChevronDownEnd6': '\uF36F',
-      'ChevronUpEnd6': '\uF370',
-      'ChevronLeftEnd6': '\uF371',
-      'ChevronRightEnd6': '\uF372',
-      'AzureAPIManagement': '\uF37F',
-      'AzureServiceEndpoint': '\uF380',
-      'VSTSLogo': '\uF381',
-      'VSTSAltLogo1': '\uF382',
-      'VSTSAltLogo2': '\uF383',
-      'FileTypeSolution': '\uF387',
-      'WordLogoInverse16': '\uF390',
-      'WordLogo16': '\uF391',
-      'WordLogoFill16': '\uF392',
-      'PowerPointLogoInverse16': '\uF393',
-      'PowerPointLogo16': '\uF394',
-      'PowerPointLogoFill16': '\uF395',
-      'ExcelLogoInverse16': '\uF396',
-      'ExcelLogo16': '\uF397',
-      'ExcelLogoFill16': '\uF398',
-      'OneNoteLogoInverse16': '\uF399',
-      'OneNoteLogo16': '\uF39A',
-      'OneNoteLogoFill16': '\uF39B',
-      'OutlookLogoInverse16': '\uF39C',
-      'OutlookLogo16': '\uF39D',
-      'OutlookLogoFill16': '\uF39E',
-      'PublisherLogoInverse16': '\uF39F',
-      'PublisherLogo16': '\uF3A0',
-      'PublisherLogoFill16': '\uF3A1',
-      'VisioLogoInverse16': '\uF3A2',
-      'VisioLogo16': '\uF3A3',
-      'VisioLogoFill16': '\uF3A4',
-      'TestBeaker': '\uF3A5',
-      'TestBeakerSolid': '\uF3A6',
-      'TestExploreSolid': '\uF3A7',
-      'TestAutoSolid': '\uF3A8',
-      'TestUserSolid': '\uF3A9',
-      'TestImpactSolid': '\uF3AA',
-      'TestPlan': '\uF3AB',
-      'TestStep': '\uF3AC',
-      'TestParameter': '\uF3AD',
-      'TestSuite': '\uF3AE',
-      'TestCase': '\uF3AF',
-      'Sprint': '\uF3B0',
-      'SignOut': '\uF3B1',
-      'TriggerApproval': '\uF3B2',
-      'Rocket': '\uF3B3',
-      'AzureKeyVault': '\uF3B4',
-      'LikeSolid': '\uF3BF',
-      'DislikeSolid': '\uF3C0',
-      'DeclineCall': '\uF405',
-      'Spacer': '\uF40D',
-      'SkypeLogo16': '\uF40E',
-      'SkypeForBusinessLogo16': '\uF40F',
-      'SkypeForBusinessLogoFill16': '\uF410',
-      'FilterSolid': '\uF412',
-      'MailUndelivered': '\uF415',
-      'MailTentative': '\uF416',
-      'MailTentativeMirrored': '\uF417',
-      'MailReminder': '\uF418',
-      'ReceiptUndelivered': '\uF419',
-      'ReceiptTentative': '\uF41A',
-      'ReceiptTentativeMirrored': '\uF41B',
-      'Inbox': '\uF41C',
-      'IRMReply': '\uF41D'
-    }
-  });
-}
diff --git a/packages/icons/src/fabric-icons-10.ts b/packages/icons/src/fabric-icons-10.ts
index eef344ce8998a..8c93d97a59894 100644
--- a/packages/icons/src/fabric-icons-10.ts
+++ b/packages/icons/src/fabric-icons-10.ts
@@ -1,117 +1,126 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-10"`,
-      src: `url('${baseUrl}fabric-icons-10-a9486bb8.woff') format('woff')`, 
-    },
-    icons: {
-      'BankSolid': '\uF34F',
-      'DecisionSolid': '\uF350',
-      'Parachute': '\uF351',
-      'ParachuteSolid': '\uF352',
-      'FiltersSolid': '\uF353',
-      'ColorSolid': '\uF354',
-      'ReviewSolid': '\uF355',
-      'ReviewRequestSolid': '\uF356',
-      'ReviewRequestMirroredSolid': '\uF357',
-      'ReviewResponseSolid': '\uF358',
-      'FeedbackRequestSolid': '\uF359',
-      'FeedbackRequestMirroredSolid': '\uF35A',
-      'FeedbackResponseSolid': '\uF35B',
-      'WorkItemBar': '\uF35C',
-      'WorkItemBarSolid': '\uF35D',
-      'Separator': '\uF35E',
-      'NavigateExternalInline': '\uF35F',
-      'PlanView': '\uF360',
-      'TimelineMatrixView': '\uF361',
-      'EngineeringGroup': '\uF362',
-      'ProjectCollection': '\uF363',
-      'CaretBottomRightCenter8': '\uF364',
-      'CaretBottomLeftCenter8': '\uF365',
-      'CaretTopRightCenter8': '\uF366',
-      'CaretTopLeftCenter8': '\uF367',
-      'DonutChart': '\uF368',
-      'ChevronUnfold10': '\uF369',
-      'ChevronFold10': '\uF36A',
-      'DoubleChevronDown8': '\uF36B',
-      'DoubleChevronUp8': '\uF36C',
-      'DoubleChevronLeft8': '\uF36D',
-      'DoubleChevronRight8': '\uF36E',
-      'ChevronDownEnd6': '\uF36F',
-      'ChevronUpEnd6': '\uF370',
-      'ChevronLeftEnd6': '\uF371',
-      'ChevronRightEnd6': '\uF372',
-      'AzureAPIManagement': '\uF37F',
-      'AzureServiceEndpoint': '\uF380',
-      'VSTSLogo': '\uF381',
-      'VSTSAltLogo1': '\uF382',
-      'VSTSAltLogo2': '\uF383',
-      'FileTypeSolution': '\uF387',
-      'WordLogoInverse16': '\uF390',
-      'WordLogo16': '\uF391',
-      'WordLogoFill16': '\uF392',
-      'PowerPointLogoInverse16': '\uF393',
-      'PowerPointLogo16': '\uF394',
-      'PowerPointLogoFill16': '\uF395',
-      'ExcelLogoInverse16': '\uF396',
-      'ExcelLogo16': '\uF397',
-      'ExcelLogoFill16': '\uF398',
-      'OneNoteLogoInverse16': '\uF399',
-      'OneNoteLogo16': '\uF39A',
-      'OneNoteLogoFill16': '\uF39B',
-      'OutlookLogoInverse16': '\uF39C',
-      'OutlookLogo16': '\uF39D',
-      'OutlookLogoFill16': '\uF39E',
-      'PublisherLogoInverse16': '\uF39F',
-      'PublisherLogo16': '\uF3A0',
-      'PublisherLogoFill16': '\uF3A1',
-      'VisioLogoInverse16': '\uF3A2',
-      'VisioLogo16': '\uF3A3',
-      'VisioLogoFill16': '\uF3A4',
-      'TestBeaker': '\uF3A5',
-      'TestBeakerSolid': '\uF3A6',
-      'TestExploreSolid': '\uF3A7',
-      'TestAutoSolid': '\uF3A8',
-      'TestUserSolid': '\uF3A9',
-      'TestImpactSolid': '\uF3AA',
-      'TestPlan': '\uF3AB',
-      'TestStep': '\uF3AC',
-      'TestParameter': '\uF3AD',
-      'TestSuite': '\uF3AE',
-      'TestCase': '\uF3AF',
-      'Sprint': '\uF3B0',
-      'SignOut': '\uF3B1',
-      'TriggerApproval': '\uF3B2',
-      'Rocket': '\uF3B3',
-      'AzureKeyVault': '\uF3B4',
-      'LikeSolid': '\uF3BF',
-      'DislikeSolid': '\uF3C0',
-      'DeclineCall': '\uF405',
-      'Spacer': '\uF40D',
-      'SkypeLogo16': '\uF40E',
-      'SkypeForBusinessLogo16': '\uF40F',
-      'SkypeForBusinessLogoFill16': '\uF410',
-      'FilterSolid': '\uF412',
-      'MailUndelivered': '\uF415',
-      'MailTentative': '\uF416',
-      'MailTentativeMirrored': '\uF417',
-      'MailReminder': '\uF418',
-      'ReceiptUndelivered': '\uF419',
-      'ReceiptTentative': '\uF41A',
-      'ReceiptTentativeMirrored': '\uF41B',
-      'Inbox': '\uF41C',
-      'IRMReply': '\uF41D'
-    }
-  });
-}
+// tslint:disable:max-line-length
+
+import {
+  IIconOptions,
+  IIconSubset,
+  registerIcons
+} from '@uifabric/styling/lib/index';
+
+export function initializeIcons(
+  baseUrl: string = '',
+  options?: IIconOptions
+): void {
+  const iconSubset: IIconSubset = {
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-10"`,
+      src: `url('${baseUrl}fabric-icons-10-a9486bb8.woff') format('woff')`,
+    },
+    icons: {
+      'BankSolid': '\uF34F',
+      'DecisionSolid': '\uF350',
+      'Parachute': '\uF351',
+      'ParachuteSolid': '\uF352',
+      'FiltersSolid': '\uF353',
+      'ColorSolid': '\uF354',
+      'ReviewSolid': '\uF355',
+      'ReviewRequestSolid': '\uF356',
+      'ReviewRequestMirroredSolid': '\uF357',
+      'ReviewResponseSolid': '\uF358',
+      'FeedbackRequestSolid': '\uF359',
+      'FeedbackRequestMirroredSolid': '\uF35A',
+      'FeedbackResponseSolid': '\uF35B',
+      'WorkItemBar': '\uF35C',
+      'WorkItemBarSolid': '\uF35D',
+      'Separator': '\uF35E',
+      'NavigateExternalInline': '\uF35F',
+      'PlanView': '\uF360',
+      'TimelineMatrixView': '\uF361',
+      'EngineeringGroup': '\uF362',
+      'ProjectCollection': '\uF363',
+      'CaretBottomRightCenter8': '\uF364',
+      'CaretBottomLeftCenter8': '\uF365',
+      'CaretTopRightCenter8': '\uF366',
+      'CaretTopLeftCenter8': '\uF367',
+      'DonutChart': '\uF368',
+      'ChevronUnfold10': '\uF369',
+      'ChevronFold10': '\uF36A',
+      'DoubleChevronDown8': '\uF36B',
+      'DoubleChevronUp8': '\uF36C',
+      'DoubleChevronLeft8': '\uF36D',
+      'DoubleChevronRight8': '\uF36E',
+      'ChevronDownEnd6': '\uF36F',
+      'ChevronUpEnd6': '\uF370',
+      'ChevronLeftEnd6': '\uF371',
+      'ChevronRightEnd6': '\uF372',
+      'AzureAPIManagement': '\uF37F',
+      'AzureServiceEndpoint': '\uF380',
+      'VSTSLogo': '\uF381',
+      'VSTSAltLogo1': '\uF382',
+      'VSTSAltLogo2': '\uF383',
+      'FileTypeSolution': '\uF387',
+      'WordLogoInverse16': '\uF390',
+      'WordLogo16': '\uF391',
+      'WordLogoFill16': '\uF392',
+      'PowerPointLogoInverse16': '\uF393',
+      'PowerPointLogo16': '\uF394',
+      'PowerPointLogoFill16': '\uF395',
+      'ExcelLogoInverse16': '\uF396',
+      'ExcelLogo16': '\uF397',
+      'ExcelLogoFill16': '\uF398',
+      'OneNoteLogoInverse16': '\uF399',
+      'OneNoteLogo16': '\uF39A',
+      'OneNoteLogoFill16': '\uF39B',
+      'OutlookLogoInverse16': '\uF39C',
+      'OutlookLogo16': '\uF39D',
+      'OutlookLogoFill16': '\uF39E',
+      'PublisherLogoInverse16': '\uF39F',
+      'PublisherLogo16': '\uF3A0',
+      'PublisherLogoFill16': '\uF3A1',
+      'VisioLogoInverse16': '\uF3A2',
+      'VisioLogo16': '\uF3A3',
+      'VisioLogoFill16': '\uF3A4',
+      'TestBeaker': '\uF3A5',
+      'TestBeakerSolid': '\uF3A6',
+      'TestExploreSolid': '\uF3A7',
+      'TestAutoSolid': '\uF3A8',
+      'TestUserSolid': '\uF3A9',
+      'TestImpactSolid': '\uF3AA',
+      'TestPlan': '\uF3AB',
+      'TestStep': '\uF3AC',
+      'TestParameter': '\uF3AD',
+      'TestSuite': '\uF3AE',
+      'TestCase': '\uF3AF',
+      'Sprint': '\uF3B0',
+      'SignOut': '\uF3B1',
+      'TriggerApproval': '\uF3B2',
+      'Rocket': '\uF3B3',
+      'AzureKeyVault': '\uF3B4',
+      'LikeSolid': '\uF3BF',
+      'DislikeSolid': '\uF3C0',
+      'DeclineCall': '\uF405',
+      'Spacer': '\uF40D',
+      'SkypeLogo16': '\uF40E',
+      'SkypeForBusinessLogo16': '\uF40F',
+      'SkypeForBusinessLogoFill16': '\uF410',
+      'FilterSolid': '\uF412',
+      'MailUndelivered': '\uF415',
+      'MailTentative': '\uF416',
+      'MailTentativeMirrored': '\uF417',
+      'MailReminder': '\uF418',
+      'ReceiptUndelivered': '\uF419',
+      'ReceiptTentative': '\uF41A',
+      'ReceiptTentativeMirrored': '\uF41B',
+      'Inbox': '\uF41C',
+      'IRMReply': '\uF41D'
+    }
+  };
+
+  registerIcons(iconSubset, options);
+}
diff --git a/packages/icons/src/fabric-icons-11-inline.ts b/packages/icons/src/fabric-icons-11-inline.ts
deleted file mode 100644
index d5540df819140..0000000000000
--- a/packages/icons/src/fabric-icons-11-inline.ts
+++ /dev/null
@@ -1,105 +0,0 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-11"`,
-      src: `url('data:application/octet-stream;base64,d09GRgABAAAAADtYAA4AAAAAYogAAnhTAAAAAAAAAAAAAAAAAAAAAAAAAABPUy8yAAABRAAAAEgAAABgPmR8ZmNtYXAAAAGMAAAAjgAAAcqbC5yUY3Z0IAAAAhwAAAAgAAAAKgnZCa9mcGdtAAACPAAAAPAAAAFZ/J7mjmdhc3AAAAMsAAAADAAAAAwACAAbZ2x5ZgAAAzgAADH6AABQpB3R+uhoZWFkAAA1NAAAADIAAAA2JH9qwmhoZWEAADVoAAAAGgAAACQ3zjA8aG10eAAANYQAAABwAAABIACYHPxsb2NhAAA19AAAAKwAAACsHxEwcG1heHAAADagAAAAHgAAACAA4wNgbmFtZQAANsAAAAP2AAAJ+o2Z8E5wb3N0AAA6uAAAABQAAAAg/1EAzHByZXAAADrMAAAAiQAAANN4vfIOeJxjYOHIZ5zAwMrAwDqL1ZiBgVEaQjNfZEhjEuJgZeViZGIEAwYgEGBAAN9gBQUGhy9yX/ZygPkQkgGsjgXCU2BgAADZPAh/eJzdjjsKwlAURO9DSTNbELFRF2AhSMAVuCWXESVGY0xEbdyBnTsQsdctnP75/LRCag9cZgZOcc2sYZ9rmbMX57DcezdtH7JnndAiuvQZEjMhIWVBxpIVOWsKNpRUnLw3ox28ASPGTH94R+/10F03XXVRqYN22oYslKtSplRzJZp9/6mBi+qa/8sT7RJHogAAeJxj0GIIZShgaGBYxcjA2MDswHiAwQGLCBAAAKocB5V4nF2Pv07DQAzGcyS0hCdAOiGddSpDlYid6YZLJNQlJQznpYDUSqTvgJSFxQPP4m4Z82IIzBH+Lra/z/p8v3On+cl8dpylRyopVpw34aDUCw7q7Zn9+SFP7zZlYUzVeVb3ZcFqCaJrThf1TbBoyND1lkxtHh+2nC1il8WO8NJw0oZO6m0Adqi/xx3iVTySxSOEEt9P8X2MS/q1LFaG04smrAP3XrPzqAFMxWMTePQaEH/IpD91ZxPjbDll28BOc4JEn8oC90SahPtLj3/1oJL/hvttyL+rQfVN3PQW9IdhwYKwoZdn21AJGmD5DoT8ZMYAAQACAAgACv//AA94nLV8B2Ab1d34ezd0smVLPp2GNW1ZluQ9JEuy43Vx4kzbcRKc4ezlDEjJIEAmFwijJEDYhBkIBJpAgTDKRpRCC4UCDYGW0VJW6aa08CW27/L/vXeS7Th8Ld/37yf77r073b3x27/f+z0hBh1EiNvFn4tYJCCUFANiKCAGDrK/GXyceVydgvhz+y+/jutC8GHJSVCMCCXQGDQbIRz1c3abmQsWRZJ+HIu2cPG6Krgyw12HU6jC8boWDgfigSwcSQaKzIzd5mdi9qIqBr5gYoFIkk3t+ubYg9vb27c/eOybXedsWOtv9m98+8mbzmpqOuumJ9/eqNfLSxc3NJJHvmZeGlA4RXVrL/bepb3vqQrabMEqT3zBhJKSCQviOHRXrxHpbent+tby/MiW9PrCH/UsXvPF+fojg0hRZWjvAGmJtKiQpkiTB3rJnFmkCP0w5xhKIhkhyebnYgG7GQeLqjgyvxgFghBJZObOB+z6hOMwQUXvEctd+2dc/M9jP9w+fvz2Hx7758V638EzzSNHhxGnDCiGLWQ0aj9jONDLyfo3Ez1+mNY7X+/a9fU7Q+C6cMeZHZNHzCumqCnyqgID18dNcFWH6tHYU3AV/xeYwk4hC46A/VTMLFqSOh0tkm15oIBOR0dLf/+BXu1F3Nx7gDGcigbbWacjQb6geXnPQ/P0CREkoAO9uJm8rQCZGQitGUlhR6WoEy1Bm9BmmIVBCGTIJ+oHeoLraAtcVzHBNH2FzFifz9AT4UgLHn7CSe+a4UpvRxr1Pgvo4+5rqVTHde9e3dS0enf3tD2rm+pqtE8zZJYuuTMKGr02e+aJkuJok6cg831qwYEtEyZsObAgU7adMzsWm31OW9um2dHo7E07sKIprNIwMfN60+o90yZdFB/RPi0vy3JaImdUZJ5o2Rgt8RV1V2QeaX1hZB+kVBG03jayN6woOu+GjABRJCIfCgIkxSDwOsxVDMRjdnJguArG6SFiZxZOOo1IOYFYZRBBExxSMDqJ4EI5iQSpVz2q/aP3EQGuGTSgKAJS4KPBM6Q8iQYf6FV/ic29R6BfTsdluu8Amvhve4/Zg5KOJs6Hg4Q2hzAUBJTRcfFK/2njMkDvMoGNtzxa7lXoeSRbw3AVrHzLcPsVQAYBaNWE+sqKKl9NTXU7rYwUMejb5yKJsaG5BO3kIHOJxekh4qA9xuqkBXOJEbYbos0YTAq4FHo3IE3RpwAjolPq/7+dCqEHZmgepf8WI4JTiAiRZCTpTFLog6A6nSq2f/xx7yef6P8CjI35tvENFn38Se/Hn8yjTyEOA3EaiJxyojDqQIuJpHLYRZshGCgKx8W6RCzAxiT4Y/mA0wHsHCwKV2MYJR7B4X4W6GIEgSSrcGgES4O8YwyFJfX1JQMpcsb1qb2ph+DA+eoX04Ww21pgPFu7j0MqyvBdKFA1OeYdUgWKNza5KhDCSgYFmdKg1Jf0y6RRHpomTE0O5UBerjss5X3Yr7Aow6u184OuSXOW1WWu65bNmeQKzq8d2RyUCPFDNMaiXFSL4qgBqCwkhjAQWpz+8QYQZFlYJHIMYAFg8OFIFegkg4AjYVKwcNsJ6KQqBe97i6AJOzQXe0g0Yzc+aAtWu1XAkLs6aGtgxFyTQ9B+dXmeg7ExFgZpOl6Fwo+Oo49wCF9w7OjR+yySPU97lvEM5JOXBESaeKAUc3yWduHNVg4PfAoUAejMAj0ZE1LC68hFeSQE9BUDHTQVTSPYLcBSgiCOYJOMNl6XbGEJRkHrBDA1QEAP0WuYblLKkAMQJLbD/ZgYiwfjMfIE/6jAb/uKM/JWycoZWO35l3iey5NEfLWaYmRZk3FKQ4ysIShlBqkp/PNa7SBOybI7HHarMtFa2nJt776XXnqXm6/KTIo/yF+GZUOOmMfyAs9pfb/l4cOK1lzVjZFM6fgklFhv/+gMfEvY3a+4w6/jbP4SnP26dtHgcRy55X78bj/RYwy+FRcK+w0fAVRcMHtgJztINzE4msrhuf3vvvTSK/ynZqvVPKiQM3/761t/rv2a22Y19+s34DySPkTkQdXUMiH6nbHr9GAHUtEBRWmFAErMwjqcYwB+TGhDgHEISob2VGBnHmSQ5koTCvACEIf2hnbcYOAd7nyDINyLayl5w0egfNCPqDD6yCB/pGgXDBoIleC3+xFv0DbjMoPRyHOOfKvwGL6uf79OGQQec1AKaEPOwEMXOcDOo+Exh1mt/YEMRvuhoYSiC5GzYax2aIZ2WLuQ3wKA12/BmbSdNYJvBIBNGapCUdQE1DiF9BQn5BQYIieRr6vGVWywSGAJxxBJAaBJSHQ08CeI9HkRbDnKeZTo4gGhR5uFD5FjVjAaDao9zCGO5cwWMyewx9bCSZIs3P3YyWD1EDOLHLPg4R6th5l1vIc7PNCDNx9+772/aKtwz2GMDrOHosF+FIwaDv1eYBkuJyeL177YwuWKVo41vIj7mIG/aIdZBEdvL+DlEGnxEMbH0Sf4TDz+wSceOGXeLtDsEVQO8mIcaCad3zJYP5XpMoCPE4ufct4wn4VO47NQmiv5Q8BeVpE38Jv/BCerJHI8q72S4vFh9TDugQEe7lEPMz0wXXz4MIUPGoBZa33aKjJr7mYVcAMw6wGWPKz18FcQ3srL5S/CST4nz8JCo5y2/le8dj5t5OK16nKMZvVwPTqUDn9i8GJ4cfrgfWTyjNCPegiJzOrRaWsZOiYcE8r/La8twy/+5b333jFMsubnWwcPkTP/3PtX/Fp7hvvKLfYj0e0WDXAmvKakYWsGiiqi3IZwRlNiEWRuPERIBOCV0es+XDpsbxLwcaCriRnFzWNCBXIAmCikvQ9wQEP6hYiVjA4ABQI2Fa8w6AQCxai+rz2YnfMRvDMwj/CkktEfyhD3Ao8Q5uIYSgeCAmMtAtofA6SBwRoGuamrhiw8yvZlqXJMJOEpPmMjGwRGwbssIqP5Oa1qUS3MbPAidrQ9+wmxMqt7I1q728NMdXuIsQmX+Fxsqeit0h4U0OAFFivPMOsHvxltomoyMUs9bvx0pPe3kd5qYqx6ANYcltKwjoPFPxetAEjDcCIYdD5VEzgkEL8rQsz7JG4Bj9Ppx3abBePkiIsqjEnFQJ8N04cT9HsH/tbpGuS+xzqeVc+yFVlFbzZzvfakTWooDBd4/Xa8RKovDAWgZmf+TO5C3WffUbkA57SOH98q3zVv3l2tcqamvkiAUjs3rLW7vMxUl5cABS65Qrl+26DTZ5KKpDz2j+8WQBukrULGqdfCBQWa5IdeaA/Pm63ah6OaJjVtFwGb14WfDs/9XXhuLQGb1zVsk4L7bkJe0LWVhEKrcCRNpZiSZCxDoWzgFNo0IltbGdhzYMQbKGkpOllOHU2QgNE7omcUMo1g0/GKbikpQwSpjaJGfmhMuWABEAumecSo/Nipj+tfOWJSTKT8a0ReufgEYpazJqNq4FPn/fLWefNu/eV5mXLBgc0TJ24mpEVLH1VQSM0Kyh58YkAplAthuMrIN0g5iEa8Q0uW2OCEj0Q4FMpHRI+YkAVJYJ16UEFauuoatxG1onZdgxFXn02XmevQd70GDAVFjIZsLmWoxqBvq6rferd/+DVuuIqV4wqgVaMGODkz9DzixugqrygnAHqAOiUtS9gREAiBVEHEO6PyTtS9mxAc5F6AKguqzcGVyGKSTngkySnEHxkgJxgU9QJOkhJu98PwVeIfgMnwF+2odrT3WuVahjxDtAS1pInPAC4SGZpALBKkStpRXNl7Db5Hm3cNjUllxplFYwRoeAQYmF8gHoOgq75hWkskWSobggIRFMMUGEtWsRkh7qRqU3+LH0WZGJGh0YEb5KaljmuF8rKTZRUlE+r8/joinOv8eeJAdFOr0WpMlFZn7gWSU8uiDQvHhYjPn1zVOzn/PkNRVC5Ov6fmj2wASkx8Q1CUoD3G19cGS9q2xbQPbSMeKPHVO3FhKIL3u2fVZu5VTIx6brBNXrS+mQQNChq6o/XBxor8zGupke+TksgPgKHwEcBQAG6V0nYZcQeDJhxgpQBmgxIbw1KQlWIC8Uxh6t//QJvywQf4cab9/es++OC6gaoPrnv//esERKhnEEZN0IcpZY0sQcaTGKKuT3V+0rVpxpkjZloG1D4cIPQFI6G9MkPOmQpe1ckh8UTIXOf5E9ByRjsSIstIJJ38VN0eR2l/swjVQN/gOVJNIQSqcEQPg4GicGYx4F2xAUocNODE3XfmD7eNO3v5xDNM6gbTzInL10XnK7c+utRkN2m7wLs4sR6fr8lvMQoB60lEACu8E7rogTfX7/2vvsl39/XdPWnlN1cveexWZX6UxdouTdZObMCbcWoApTLYoOFVXIjqDR8JDwB0YmDDTUPL0Hno2qH4HSNEdLUmUFLl8GihOZpUQd2ZQB9KaTc4893o98BMBN+eakln0qmzjW40VGEO9T1z4NJF8bHn/WBlRfK8lpbzkhWr7jtvbHzRpQee0T4f5b/eMuoae+qWVr74YuXSR0f7zhiNelSd59/du6OSRAgrd/Tu9rPM1DumT79jKsPyKdpZ37o3j+wp2+UrKPDtKttz5M11+sAG5dOaPs1RVxWfm5ms/sjtY0/r9rPRD3PypNY9vTsiZWWRHb17WiflunIKi4oKc1xAhAgnhVsMr4DkmQj2FSsRCgK0mHE5FTg4XsVnqMjMEtA6wfkShaH4OBNhn1e/ZkyM/bGSRTPrJ605vya2MpZbOb/yK/Xl4p7Z01vCxY0dM7qLcnJZT1tDpKhubCEzhml8MtwVsTWOa0sEXOEKifPhWXiWdki73Td9yZmJ1u4qCTMMm3UnXvmqq33GvCVLayrbKr0W3pzjb++YWVnRPaHZhX3aPrxEPbmLz2Ozrf4yvztaETaPiGk5Qbu1opmneJOE+kXCnuxppDXqeqQkhff5pzcfvX3evNuPblZ3b377tnnzbnt789bKaY1FRY3TKtMl83HX9/saG/u+35UuB7tGyycBzbv97c3qns1vk8be3sycQ2qqd0QrtBw8MqIZWho2jBKohP+H5jofrSP2JeCD181FalCeqiYwNTdZHcVDc5NGaInQsJYYDQ/DR2Xd45NW7QDDjG3GLxV1lTat7qqs7CKR3K5Kh0Nr6nxiWYG/N1gfsWfu1sz4Xsuc2XtX1hMzZd4Prlrrx0txddfKxvSrA8Wj4sh8Kr+iNbwcZOSyJzq1Jocj0xIpS7uK8EvNY1ntZinRNjWSuS2v6SjDi/xn7T08n1hCyeVXzFoxZmVHReZVLTU6hEx0RCamk4v8YMtNInKbutHgXYgBsK3raNhJdIotmMRziOlJ3C7gA2KUE/s90UhEPUiXiIhthnIcp+JGSGUiMUzKHR54dtPWcZeOuz7QHojPHFPAsaqMFV9wpuTOfeRIrts2XUspqZSi5bXIzWKxtaneoAyA+6/9Qw+/aP8IqyfPuzibG/wanFgG80Lt5Pmqh0epoE9LeSQraUWyucHEoO2cRKylte0rxtBKdcNivFjYb9iP8pAN5qeztSBGRDpQEhlgb8uvmVhddkbFsSnXTd39/XFsalDm9tX0dowRLRyrfeZi23nTdfiC/tSoWHERakGTKcyGIjQkajcMtaiDiGcKNh1mAg3ZAMziI2GmD8WIhoM2DFVzA6/ecc+cB+Z84KxwzrhkUR37uAra9l2z1ai9pb1ltJrfPYme6+9/Tn1z/NQmS4FlyniiUYfDN0QKHrjzYTM/cDIXL8LJJZcNXmsgMV0pNydbexxPyc7JlZTBk6QNbTP78JSp2IcZmfDTH9LxHBY5dGuYpbwSDoohUecoTgbnV0m0rrttgWAWtLtXvrFy8dVLawX5hMJqi+44R8ba7TZui0FMrrqe6sARtNaKpqKlqA9tQOdmKI7GASnFkVB6IhlNEFkb17UVFbmcHiaO2P3AnAkajddDASSmLRKOdThxDOsVyR6Ig+SGlijYDeR6FE1eHqpvqw8VunkjVz0u6GsutJfZSuVyR3G8JV5cVVg73ecsLavyrtzEJVQ5BR8mpcqG8ppS3mQ04DmK9o7B5nQahVz+BTCD8v1lFV5fWdlUTTGkRoYOw4PbGrvrI6GygkJ3NuPxP5Zr4jhjecvUkvrOZEmozBfyNhQ/ZbHlGs7TpoNVLMMfs5/5SP05Hy4NWAza9bhQcLttBl79QJaZj8v80IvPVz64UJb1+MiN6VikBaB6Wpw9jTdiBYkUcPE6uOB1UecA59pHw2UGqtP8rKAMBypvCLYtGNNwVgVmpLLqZJHoZBguUtdYGyiduqqlsq0Uc85ISVWB6DU7XKaScdVuw0cjQ5qD545Z2FZcEOKyOWxxxsp9ZonLYfK8RWVNM+rl5e1Bi8jYmONSkctss+Y5rWZDfl1r1yn81Y7moUXfxl/Dyy1OEqxJr8RQAgHRTycKbAcspts+xH3I/LH2YPxbOG1vXdf8rjqpsNRRWFdV4aqcU9u5c2FddMqcKdGGkpKx9VFXfmv7hIJJ50yvYL9UlfXmMqezzIzXq9Qvowe1Vkfx34A6bW1XfV19iStozzLZ/RLmrZayGVumd63pTEbrIxURe3GtV/uH3ScZy7o3crXqK1db7XarFqbWL6/7rgyWhvixdSQ/wmTTiG3FI5FqFylSLdhg82GAjM6s6xLLdvdEp0+eWMJwBW1TZ8fNAo5OnTW1tuXsffPa1jYzgqepbVI425FlxBQchJmZObMuX1qX44p4s6Qs/EhwxsQazmIvqWmZc/6Mhdcsr/Pkm1wm7TxHXWUBy2fzWQwvBqta523N8Hw9jPtnYPeSCEYtGgsYPZtiVCB0Sk8gANMRyhDVLiSmIwoiJgI0i6xgSfoRp5EP/U+M2J2C3QKeRESIB6txPJKMt+JY0hlzCqM0tpAywifsloH7U5T7ZXcY/gde2Kt9fM1GHOP2yfBR1FRmoYeR+8LhqC9nyQKzL1pcHPWNiUbH+L4vFbvz8tzFkq3Yk5fnKSYeuNVstmbO7rA7/LNX+ONv/AwqA39nNKOq4a94tcXAGNQ/an+mracyZ3kQupRTbOpn0HiDL/qHnp4/RH0NpCPS5Weip1iSgm6LxR2UpGKPCDQQGFpzEAkEk2IEgxZLYhJRAdAwb771+kn0yE/4RoVGcNjj+N6cwedy8LPadCNz0ojN/SmZT+l4yfBYOWBoPOj9OYCVjbosJu7zUGFmyvGpzGcnXAf4sVnt4FwRJDWxQIOYH0JUYBhRJMI8bFdRkxoesceAA01ZWSZyUFeOnDTKjpiyIz0NWj7GZP3n0PuvYoy/x/XqS436Yo0eCDmJfNUBKWMMSoEarx4ZEQNmc0A8ifRSo82dwpcewps9XCD3Tu3FO/kcA3NGzmC96aqfXTqtUhLU87dTMkh3Ao7ooN41h3Kyi6sb/BkL1N9QXZyt/ZPEMuDZh9I8KmZWQOIhDOoyJImheMCQomEeRQOvUvsRbtXwTIZqCuUvVvyW1ixxslVrx69Kfz6Fb1iQ6iT+n+YbaAoMM6eInYCAPCfmow6fbkFIwzV6pkiLp/+IKecjktDOJiPxahyMCEELtgtOewGO2ZPOOIiPyKjAncwpgzuBO26+Gmsf80dz4RMO07NsMJ/FZ+Ua1U+GGMZns5xlNvw+EqmlvOKNhkJRr3nBkhxf7VNDbBP05uV5gxgDixxfx9elGSMLGGXnSbQTf/Wwy3Tc5MKypqQr+FiucXCjYLWYUsArbKpI7BTM2skMj/hGcs5bFhfx9GgXULosaDjfhK4d2QGKZNV1HcmHolCsY+IEjmIVH+FpNJVSuyiNqGNQFiG7Xk+vyqYhSl3AGJgdQ6JGHOIOBKCrfQVI9ovfYd5R3nX+LIM9L+ixWj3BvMLCoZpGInektp+suQ6TtRSo9inemmG6xnQ9dz95kdDvccR/CsR6O66/XT0/F2hY3clkhToue/PGL7NtXulzySdlk1DWiAsWKPQRWh+gbdHYCiOn6RefStU4RcYDbwP8MnQYTMdHe9CyUdKbSohTxbcuH4A8v0WCJ3lBt+OaMVi/w/KcdyaHqE+X2KInIBaNlNlFYsAjDrxA6PEUsZ3CskxEcGqEACcxRn9ZeW5ueZmfCIQ8+GTODlcuNyyquVzXwNdDNPjfimttY6fifpnYNg90dmoxXXYfiMUWSPkWg8GSL+m22H9ORvOnyegz/4PyOZmLQYMOg9w+LLD/v0SzHuwehv2wqP6/EMsayAVFvkqW12ewkErLafQflceG0+TxNLTgfy+NCdzBMUw042RIGJbNOC5EMokt/xPpm0oR6pc18FB0OayNRMD/Vtzi1zs7HyD0/rJb6cRXUNmrHlswTPHo1JwWXb6u/J9IV+nbJGs8DQEiH+LOSiz8j+Xqt8nUDDgAMrhQ+0j5D4jU0+RpKkOE62X5AnnvXhk/lBGklB5r0utPCRqF4GiqqVgXrqYRgRiZpTMLZ7wZMOKdJLqYSGI/NqLWc+56+bOt2z59+cBG2Zp3izdRwv5q3iP37RurjtE+NUds9rA3z9/70IK8oMMWMTNaexuHt37207vPleVNd//0s634r85y8TZvpCQZHL9cVuuxzyzm+cL2Mn/vo3PMomhm0Zo/gBujIEXoE7yAzQIySj1c0YrBi4axJUjGgYMV09kFotBnHNylXpNlujbbYjHh65gfmcQc0+3mz5UTCl+7fOARw/ac7IFdzB1ZljzTZdkmrZPdbjZuzenfyEbvHjhkUJR+BXg1hW4UZIBLDsoDGJGsVmDVtMlIXHtCIJwA7o0IZJH26PwsqJXhJYWgyKU0JaMviS/GoLZNdzz5876Vrz55x6a2qZfs2DZ28nWz51w3Rd6242Jtt1LavrAuvqC9FFysVGporYZkFLGfae27vnjt0dt3t7Tsvv3R177YhZ/O9sZKq8orqkqj3uyB9xk5VbewvZQ0kVJT1F5T0BOCArLGggrpHObArH5GIGgh69wZGDoiI67Ti9enPsAOV0FNwnc0XpWVfiaZjmYShVsUwWHqtzuxnkA3+jpMk5eZYCKzJD68OK4XFpwxzcFDNmN7eh09CztwUm+CvS3/hfxgsEY/v55/VX4RXFxpAl6rwXNdR+h3j7gCRdGzoHKpC741my7JZ/dXda2sV49o7/pLSht8+P4pz6w685nd07Uva4JF+drrQo4pz4i7XbXk6iG4ssBVfk3QXShm24M1HhKxd/NZPMsR/rFHRFtRtcdVY72gac20qplXPLN6yZFJ2jKb0xmJ+3xxG85ixuarT55trAlaWVQEg60OBuFc0x7Mv5LWrzLl1mivBWDA5OqIq1ZrqYHKJa5oMM9vujSf2znn4vUrxzDTtV97G0pLffjQ5M4ZVz6rjoFZ4TrBnJNt1B4is8vH3YLFRK7I1J1Wu9dTHZQKwh4iA7DJbiLCwJxDLiWr0rx642Xz1zy1e3r7WK3PFvf56yJOhw0b1Wfy1R+fbbUGa4B2CtAleFf164YvgYo8dO1Mt7TmoiXoXPR9dAt6ED0D6CnFlbgWJ3Enno6vxM/gd/B7+A/4a3wCqwxmQBLjdFpncijBM55J+gyAHUsW/uJ6Ep5+QTQiWZiTAmYMtJEEayEJQkeAEm7Af6SFTUIrOH1TordwEpqJiSCaAmR1DY9cayVUK4zIzozXhYWoowDcDSDGIIwoFiUh+WRdOA6kSoJ30UTIzzqh4ZhAMrwDQsjPk8sIaA0zS3qFMQSSPHQbSDqrWNI/DAe+CtDveBZuAOnCKyQ7MkjGGE9KwWRA4JNBwRkUYjAHmB2G0RoY6ADAkwzQRmHy+sEGzLwP+9lGrMuXJBkSSyYCTEJjLDBgmp0iEWAUYAMn0G6FIo4OESeD4AdAo+nRwXSgxxAbkIIs9AjDcUpOku9KjwAvxJI4UZwet4G0QfMF4hQxcbBVShmRphSwgKfqe+cOXtPJ2cLaD3q1rzu0+/CcDmzqxbMHf9nLPDRXY7GqscwsdcFctmeuuoA5MHBCvYjZ3qFNq5yXWPaTZUVxT+vYdXUdZlfOuX8611ZsCxc1xasdX7H2wcLKOZWdFdPKLihrK4yVTA3v+axy8wTmqrC6a+alWneOx1WeBLEYsnfIwWiPoyrkzA9X2t1gr00u4HneleMWcnm3KxZziO5co8ngdpts6uXOsvJKd8mc8Gtu7dbsIgnfGNZu8bht+bFZkypmlEhVbdHiAq9Yedb2Kzrzy5yLd581q0y7L4xX5ITM2g9cv8q25NkstQtrrNX5vpC/MB+35JXavFUlJWripsI2n5HPM5l8DV75tY51vzl77pG5buZvbu3H4efD+46En2t1HYnFVgz+dvB4L7Nuwf4u/G7sxLMxdkunOr3hzNVn1mvzY/zFA9fiu+dq5w6MUR+PsEX71A84yeV1WsSyigppQ2JcdZGNYZm8ippau7W8JuF1lFdUOIIdZXVnrloUwWw2PsIUq2X5ifzYZdrxS1e/tSa/3HGb9sotRsE087qpJ7OyeWytrKm2TdzeWLkotvCZ5Qfrzxq0ab/YoC7Y+PwebnGs/+nnv4r9vffvK57v+KrvV3O/6sOtg7+RX2tli17E2561OMXcrP3aT/Znu77eAwNVuTn4AH5YewxPVTk8FcqHyblPe4yL7Nnzq74O+Mhz4aM+7sL52hcueYP6loxnaz/A+fvYSXO1i6bf1WESjGW9VeGpd5whOyqcgmhmsnFn8Iy58yvm4BWJtYnW+NrE4DWF3aV9/rGFeMdczZdonmtq4o7k1/r8yXKXuyLhkzskwVpQ5rRXhvKJfG5o2M1lxWJGXr4nZnMYo1nGLJ6PSZvNTmueIb44sS+3cX3DwdxEb0fbmJiruLPEUhSvjso9TRM2LJhSEOoMm8f1XTztYG7j2Y37cgvisZgfXIK6TTWCYJIks8R7m5pb9qvjjSbJUiDm17nzsrU3sEksdt6Ty9r3Hdx38OAFe7Q37nneaGW2XXCP9uADR17bM+3uAwe6j6hrjuCpR9TD2eN6V85rz+EISmwlzWWcwIkuyWoKNcVjHiFLwOD6gdTGpgITzzAHcC3QY87qo6utTlPpzLIyR6QjXHpWgtKFWFBQILbsmuKJmHrunVYzT3s8V5uPH1b/8Bxz7EguXpELbElwA8c9J79Sv7FNrraEnVK1Mzy1pHoWe9VrgxfLMrv1Ne197Qucr55HMEUOmusyEx0VKoUHkAM1UOuHZMfpet6pZ/tWsSARDZwe26Zym0byyUImlciRJBVCIHjYn825a9LCBW9tOOu1R25IgsGKq8qVO55kmV51rfanW/W7DNLeKt95x5PLLvx83mBtYpJlhzRv3Mle/teLbQXGHaYqAZVHFiab6/uu7sVZ4EjPvmJFsr+yd3DJ98gt7b8Y/VbvdPYXbbf32r/3wvSTvQN4cdncGnv7BcSGxKDKwJ5zozjJK9JnQOw0GCxTTOdFJa3TzJw6JzAI6Yh33vnEkh2fPbbNvsN1zbvYcsOaVx+7KanWD93S/q7f0mdy4Z1PkIQaOqbZN7+9zX7twI9WJlde3Tvw/dk3H90+dDk08Myet0uEW9FENAPNInaagWbcO+wZw5xY5OCzp0MV1Poiq3ZmVq8mMyaawNNVKzIfmAEbiwuCEnYPpFjZHW5ce+OTxzZuPPbkjWsbw25Ghi/c4RRJbk5ZoonaXHfY7zRs5QRSDjzIkZh06rJ/Pnt+Tv8lOec/+88nFIVvdIe1i8NuvQ29PXcYb32aNPI0ae5WNjvbGHY7izlcjGn54m/DA+VL7//jZZf98f6l3MArzqF4L+BEAvtiLVqPtqKdaF86I2BE0C8w6hoHBT9fq4cZyK3AUE2saeGSEVDpNKWKWOUBourh/QKcjIEqj+AA2bsQIJsX4pGAYC/FYk0VFwFlWwskIQUkrIxK2eA9o7NMbgm1MXlOt8NMQxF0oQYNVc0OtzOPaQvNa5gitsxcmjjbWCgyilhoPDuxdGaLOKVhXv8XMvOQPPAnvr/Htqx10Nu6zMaVrFLfXMWCA5gjOWA2J44wZptDysHKTcybN7GnZZicnt4ylo+O7xpbrp47+mvm8vKxXeOj/FhlzG/rptf7P8yTpLwP/fXT6347hoSIVUVtnDSpceCi2jfeqMXfhOrHNZbxfFnjuPqQlj0N12pv6GjScXUS5YI9OAstBnxtRrvRDfraXnppj+Q7n3oFVp6ZsQkBQpyAloQVDLpqPYWWc/rBwCEegW7YBfT0BkxiSMSoAmOHGi8h3eGka66SoYi8AARvjxFCSLOwITWctM8o5Kzp9b/+st+VncVjTckx3Xh/9NXrr/nnisrqVcevuhVzazv3buubXCLv+v3Mjs9vLh/nxAHHwov2z569/6KF6nMGW+zeFdnRzqVP9D12xQJzz007lhaapcErun+8asljnfT8d2OeMa8wLz65UlLEUBP+nHnTNmnRuubmdYsmYcpV5DiJMjW6jHqBMvaF6bd3K1/jn7zCr19ZVbFkxaa1TEXHqh17u+T1fZcfKV726uozruhraOi7gn1o7Lg55+Q1r53fbjb2XHpkudC4eOe0wPgH2yY0jYFj8HkG4+pzP/3ib8rmjz94T/tbw6JxodC4RZkYCN2TWYkWobPRfejxEZk25Xg420xMb2DMMJlgx9RYBrYRaTxIz8jRXx2+DqT9NjFuJuwUjpDgUSCaiJAHgL30jB49oYd6gPo1eE2ORizqC+BgR6YrcKeKxFzo7ik5kw4iE9d5kCa4NbaXtM+PcxeSlDuyoNJ/0g0mUXW4nAA242Fn6nhjoIKQvqVQHERioSXs5hBdXNNSpz8cKADBRy50lOlZdbJMHjEgMgoNkbSUocw5flnRue3E0SaZf8HxzVFrPskAq3aXtJkt6k8JqrGSefgkJUNMp5A3qYTw5Am5gxcEvgO+eA8GJofdegofHTh9XKOvm7Q4jCnlCYU8mszIpFRTWGbow4OKnmKUWUsQHkaNqAu8s2VoDbocMA3MQ1iKItQJ3gQgohkH0m61nqYOPogUG7EGRncOxoD30iuVlAwCUJGIYg9QRnSCQmfrwiAusb40T7OZAjoJgcg17OAcwUp3lonFvtC4+QmHOiNP/THdGYpIJmp0Ybmn0OW8qm/72mebVu2hu1GbV+/pii9sL3nT5mATCyeSjMqBnxM80yTMPwz+Jbu4psHPTONMzFjGxFVNzNskZKt3ZRnzfCUun8Npwpfk+Lhsi8lfVZjHKZMu23VRm7PBKdf3zWzMuUwh+UUy6cftWvLSiq4rp+DrCrTOaVesbiabXLv3rGpilNIJC+Py1nGZnM9BNLxXwlddZC2UCwsa/TmtleyMilllZTPLxly+5+JE60XtM+6aPvX6Tk9za5NrwuW7r6aoMNN42l7kBI95PupD68Bf3oWuJBYUEYmtODGU/mHBBjgH/pv7/DC3AirTDAugPwWVYKLoeAJXEAfAJgBc8TaHvS5M9tEQjzdAU33qwpS7EjxIx0jxNCqPaKn1jbrBhjPU2AAeB2UApWtXhZajY7F51Z5p/gYPhwauJADCG9wN2p34SUHdR1Zr8F8xZpepiBIzJWMM4o9sgeMfCrtjC4u7w3FC4v+q9hB5WecBIccQId1OGDOERZMRX6todDPLp7kWDfmCsre6SBqHyWcXKw9mGBXDAIDjUXjEelsjWk3tDH1/t02guz1IwMunJxQaTsm9I1kp6TgUjXKRcCN2gBqq1sOPmaCo+ZTNn5lXIziSBUawABawwMJhRJL2keT2SVr2BF3yuMNklwpJiyOlO0zm1LY2hO9ySLhQcrsljKRBZb9b2i9Jy8xjI0R6kPcIRMhGAiIm9Xb2M4kJ6qus4eWDLw+s7v2otxAO0ImkQ4eWHXYrusAjG2L0XQxbJoTdBH1NCXyX5HOT/qST0FsY+oKOlxVT+UneIgRAdiwQBOitvEc7Y9ykswPQEd4PJwJiE83tXi28iRKoBXWgXrASVoLuOQ/tQJegu3R7lljWhJxpCChObVorTYWnYVzqYJCMGcHpwDYnif4YpHQaEK5is3A6WaiK4XE4gh0RYiskw04BFBM8THiI3GLhPcHhZEHxkAfYaHEykvkVhUQyYqB5OcLqsNtS6Hdnr1H3PK2hly755t2Htrdv2Zgliaaw2yP9ZtFnW5c8epsyPzqj6xup/0bnztAYW+ifsRqrL2jFZu+4CZOYTdpX3raJkwJ15KZ2Lq5cdI52dNFTN4XPbNu36cMLu6evWt66iWFD9F16c9FT+s1kwfXYsWH2ks8v0Pvo6V6wZCU1pfEH7rDN489euMF2laJcMn7bg8e+ueRhPPYSo9XmJFt9P+yaEZ2v3Pbokq2fLfoviXlleveFyU2ty/HE2lhg0sQ2LzZbi71WzaZ9ZQ36rDV15Oa9uPKcRdrRc9z72s4M37To/p3OkG0MxstX0ZfxA/TuJnwXuR0a8K9cMru7R+/kgs+XLNig/fGGjW8TYx+htJ+S3gM4FWxARPyMmL1I91GCcZKPa8tm0nui2FOKcPZQzi5hFlIK6Xg5IY1MzpSTZChyelQ9pifd+XlAcQvPoQnbt2ybWNHd2XXGwmRy4RmdXd0V7Tu27ODa61bcsDR/SkVyjngkOKm4eFLwiDgnWTElf+kNK+rGX/jclonbt2yfSE9bnrtwvBJdccPyMWees2vGzIvOWT92yTVLapyVY3tWNVmcOeHyqtJCo7HSVzGrAv59lUZjYWlVeTjHaWla1TO20mlAJTUliuQt8kr0pMDluIe1q7V92gPXF5e11jE2jmU59c91rWXF1+OZeCU+++F1b925BJ6D/yV3vrVhwT1bJ+lXHTsOzFn6yZf/+PS1bmnyhst3rsl3R7KyIu78NTsv3zBZ6n7t03/87dNT4J6FvKgE4M5LIfgPeHB6R71T+PYt9cLftG/6tK+1b1Zo3+BpSxbhxWRb/XyudGDy6I31+ORL2k9f+DEe8xJOaK/yOwcKmN8NKOz20VvrT8k5daAiJKMzyEowGOcwBhIK/fbN/UOuXDgytHygmw+jtxMY0ZgJJxDzoui2WwXVcfrvL0wD3Q1GxLSm9bXaVBBbYQk/FqQbXkb9eoagqKghfOeAInq8AKNRM9EUagjsXt0UCkI7YSJ4H6td30S0jaqM/pGM4XkbQKKjAroOfprH+u2bHQl0RJ6EVwmyiH0GkDHI3227I7OuYaKmBOSCAcQqJjM76DVA5bvtd2Sb1Rmt5XjTC/NZswkDNArkAIeOp2kqRffORdACtOSUbPw4/bkTYpkH6Q/qAI0R1sU09MDSmEPQPvLHE+iSsURTXWP64qGe9UmCxoaPMinh6mJmf2BMhctVMSbQL5OaQm6zXZJn4++yi8pqXbawtb5E038+QS6p3/hxdqCsBu5KHgnfLXk80sD3yPqpgGhziDSskNZYlGmX9EFuDyoe6Rr1Om+R1cAszrRXX7KYOYveuoY0ps2XPFrqJN2bhBWB7EgjeSVkX/O37k0AP7UR03x8EjwiHijW/R3wf3DGzoobhhyG/iFvALcZwKFMKsmlnVGDttRbV+Yz4KcMvrI6L148QH1YTiZuSArqBmpEqUO+AUtriYXtkUj7woQiFVV7ieFD3Evi+JLIziC8Std0C5kaNo8vJNjNYtk8bb+2Di9m92r78V68GGFMYmHrDF/q3wvrBtZp+7m9/N4BeIrbS/ct6L/XYaG56RnHELewWZzhveYzu6tsxXWF2pyChpbJ2m58cNCuWvB8IyrvXN1cPWVsYwG+t6Cu2Kb9RusddGqPMP+FTmszzeNUqXM4nGkT30faxJu0XvZPzN+1u/9lm8Pr/GR9sw5sjknpTHqcDiUUcUTVO5xCFlm1EUaHkShbCjgRotyaxMDRwxOrJmPS0A3a8Zc2GPh2MkP2PXxwrTfpXfP07u7u3U+vSZf4+cT87RMWTsNHq9VZifnbJi6cplVWGz4eMWyYhfr4hpe04zd4E57xZPjsZ1rv93jDsRHt0FID/TY/Ua1VTls4cRtU8NFpp+bdjJjryM0hWZj+8hATLiaSJpLF/NvJ7imEgVV1n9lcPbmloYB/TbW08wZ9jEnvWnyQfW9g/neaKf+LgkZ5anXz6s5yAF/B8Stw53hPwnsDNhLIfQ/ow4OF7zjPYVtdl60T0Wy08DvL1xCOA+qTWUwQZ36WCYx3J9ajRDrBgeASmO8ocw3r1Eu1E9iW19AxPz7wsvY+Vh7Xmmui8Xlb2sdtreHzc/tfdFXUjgmXT60P2IurXIbuGdXTx1Zkf1fBrMZvx8Lj2p/qFnTUi1yD9j6opRdrtrZN2DIvHq3p/30Od6mrqtgeqO8oDzfUVrj6j+HJ2ZXyjCqdJmQUA9n9OgrQXzy5EF1BPH8sOHlq7UbofhmwoZI8NZMlgSwTsjSellG1BsE+YsNqhA8zEYF1JmNOsrjpTEbqaGY+uDH6qQhIqMhQju0j9y+FI3ZHFEjKmSRJ3c5gMmH40OzNm6r17/IkPV4PyZTLkrJm4pDXFhJTNx3iOfxsp5prdpszOgGqrqEfDfK5tCeS6+J3//Sa8HNl7GX+qO3l2odxtvH2JY82tLue6uJzeHMu+Jn58NZkZXEyuViZDNXc/NyJ7VvuHbjXmGMxm5htYxjmUalY/PG++3kDq+1Ib9rZgfHTnW+bveIUrf8iZ5XzDO39TobNbEdimXtzMsHTnIFn8aZns9XWrGvvLvC0Bt1PToOeg+OLNx9sb6j4Se2DmMU/ZBjSOxkFwzzIWPcvYQaZQG1jvFT4LFvPvTPiRuFTw8eokq47kC2V5PeNaCaEeComKKrAlSGbIv3YjqVqHBQikvBp6y/EiHPSOxe0NI/b2VR5aUd6P1Zbx6WVzRe2d3/pSVY+te2AQRi45Ms/le2JHH2XPfylxx11PLP9oLmgANc2t9NNVvBWezOuLfQ/1vpasHLiO9sLWwvxPYOvW+69OZdRiYwuxIXCm0Ke/vt8WWwoi2E+AuWxHy82dOtKgpPJFV6cl9YVRC7p+UM83XvfSnce0Y1F4tCvwOk/XnfadlFiHUrEMOShQtb07eTnIEi63py7r9w0s6pq5qYr754zsk6yFqbvfmpNumQb/6bJ/b/D9+Afa6lH7sSVh1hEE/FOf1OvDygj3qYlt2lTG568qWve7Nrjsxv/+v8AVtFETgAAeJxjYGRgYGCqCGb2FeWL57f5ysDNwQAC+/8ebADRV6c8/gii9c+CxTkZmEAUACNlCj0AAHicY2BkYOBgAAEDMKl/loGRARVYAwAZVgFyAAB4nGPVYljGwcDAAMTMUMyAiRkboGwHIHsOVCwCST4ZSAPVMIHYwmj6GxCYkQGKFdDUgMxNgLJfQvnToWYLQ/mKUPkNED5cHzZxA6idB0C0AQNDG5AOZmhgQAA+IEbmNzAoMCLzHRg5GBQYGAAhTxGjAAAAFgCQAOwBTAH0AjICmAL8A0ADygQqBLAE2gU4BWYF4gZmBpAG5gdGB+IILAiKCQwJYAoCCjgKeArIC5gMAgx4DRQNhg2uDiAOSg72D14P6BBEEOoREBG6EeAShBMkE7wT4hSCFKgVNBXKFhwWVha4F9Ya1hs+G5AcCBzeHbYeqh9yIDwg8CHkIqAi6CNkI8okUCS0JMQk1CT+JSglniYSJqgneifQJ+ooUnicY2BkYGAIZWJjkGcAAUYwyQXEKYyRICYAEccBRwAAeJy1VE+LGzcUf1472S1plhIo5KhDKZvFjBN3ITQ5LUlzyl42YSGXgjwjz4iMR0LSZJjSQ4859GP0EuinKC302HM/Qc899dj3njT2buyGbaEeRvPT0/v7e08GgLujz2EE8fcFvhGP4A7uIt6Dffgq4THKnyc8Qfx1wjfgY7AJ34RP4NuE9+FL+D7hA/gUfkn4FhzD7wnfHv08miR8CMd7v2KU0eQj3BV7fyY8gs/GFwnvweH4m4THKH+b8ATxjwnfgLvj3xK+CWL8R8L74CYHCR/A8WTwcwteTn5I+Pb47eSvhA/h5cF3P70T8/sPTsSZzp3xZhnEE+OscTJo02TitK7FuS6r4MW58sq9UUX2TC6czsXZ0+dzceq9Cv5clW0t3fbBtuRCOY+exTw7eRhP6TCevVClUUJ7IUVwslAr6V4LsxShUpfyK51pLYlzs7Ky0cpnO5OvQrCPZrOu67LVcJ6hzSz01pRO2qqfLU0T/Gxj7ltra60KQQeZeGVasZK9aL3CJDAxEotgRO6UDGoqCu1tLfupkE0hrNN4mqOKwq/0wiq30iGgu0XPRdQ6Vw35wgMvjBvAkiJMt0u1zhRtHqaCmEfbKdkMAXQjukrn1aXMOgyqm7xuC2zTOnvT1L040veEWi0wl406evhQtqxe6KYUTvmAnSJWNwHIfO3rMTNwpDFKUCtqgdMYtTBdUxtZXGVPRqqUo3IMhsK1DbYNolBUJulUqrZXGcVhbPqkTg1Bh8hPpRcac86u3214BwLmcB8ewAmiM9CQgwMDHt8lBJQ9QeTwztMqUaIRNZDhySnU+Ag4R1kJFZ553in8KtR+g2uBms/QboF78k0xnuI/y5ztPWuSHVmV0KI/iZrXsbiOzgXn4VPOVGmGdT68YjtYXrZ7wdkYXAXqUFUS38AMFChdcZavUUYs0UnFurv4K3nfIoODdo7fFe4l5qSZrexfME88B5Q+ghk+HT8Z+nvfPktxZoh79lKyH4seepQu2RtVO9sZ3XPOFjuiuY9ibUG9f8U1CWaix2/L3EUmImODNskMV+1Qg+pQMMV9wXqWO96zhPigOJY7E23z5EWlvWTflvtKNQc+I6sF5zF0ouaKyGrIK1p47oLbkizXNUyv1VXL+wJtctxPma848zHudB3n/Qo0T2LHPOW47uasS5WSdo7VtDx3xU7uyaZmdIT69/BLE7pIvOzyHnP4r9xuvBfsqUSZ4zkO6U4Ns7qrgiH6dl6PL80AVRJrCRxvuAXkP9ZaoKTjyg3fyg/NnrwyVYr7YtIaq4q45ZvVsiVlO3Rz8EOaNd/kf57R+M/YpM5svA83RCeWaX4o3wUzHXv7P9ztvwEy7jiOAAB4nGNgZgCD/34M5QyYIBQAKX8CHXic28CgzbCJkZNJm3ETF4jcztWaG2qrysChvZ07NdhBTwbE4onwsNCQBLF4nc215YVBLD4dFRkRHhCLX05CmI8DxBLg4+FkZwGxBMEAxBLaMKEgwADIYtjOCDeaCW40M9xoFrjRrHCj2eQkoUazw43mgBvNCTd6kzAju/YGBgXX2kwJFwDEASgaAAAA') format('woff')`, 
-    },
-    icons: {
-      'IRMReplyMirrored': '\uF41E',
-      'IRMForward': '\uF41F',
-      'IRMForwardMirrored': '\uF420',
-      'VoicemailIRM': '\uF421',
-      'EventAccepted': '\uF422',
-      'EventTentative': '\uF423',
-      'EventTentativeMirrored': '\uF424',
-      'EventDeclined': '\uF425',
-      'IDBadge': '\uF427',
-      'OfficeFormsLogoInverse16': '\uF433',
-      'OfficeFormsLogo': '\uF434',
-      'OfficeFormsLogoFill': '\uF435',
-      'OfficeFormsLogo16': '\uF436',
-      'OfficeFormsLogoFill16': '\uF437',
-      'OfficeFormsLogoInverse24': '\uF43A',
-      'OfficeFormsLogo24': '\uF43B',
-      'OfficeFormsLogoFill24': '\uF43C',
-      'PageLock': '\uF43F',
-      'NotExecuted': '\uF440',
-      'NotImpactedSolid': '\uF441',
-      'FieldReadOnly': '\uF442',
-      'FieldRequired': '\uF443',
-      'BacklogBoard': '\uF444',
-      'ExternalBuild': '\uF445',
-      'ExternalTFVC': '\uF446',
-      'ExternalXAML': '\uF447',
-      'IssueSolid': '\uF448',
-      'DefectSolid': '\uF449',
-      'LadybugSolid': '\uF44A',
-      'MTMLogo': '\uF44B',
-      'NugetLogo': '\uF44C',
-      'TFVCLogo': '\uF44D',
-      'ProjectLogo32': '\uF47E',
-      'ProjectLogoFill32': '\uF47F',
-      'ProjectLogo16': '\uF480',
-      'ProjectLogoFill16': '\uF481',
-      'SwayLogo32': '\uF482',
-      'SwayLogoFill32': '\uF483',
-      'SwayLogo16': '\uF484',
-      'SwayLogoFill16': '\uF485',
-      'ClassNotebookLogo32': '\uF486',
-      'ClassNotebookLogoFill32': '\uF487',
-      'ClassNotebookLogo16': '\uF488',
-      'ClassNotebookLogoFill16': '\uF489',
-      'ClassNotebookLogoInverse32': '\uF48A',
-      'ClassNotebookLogoInverse16': '\uF48B',
-      'StaffNotebookLogo32': '\uF48C',
-      'StaffNotebookLogoFill32': '\uF48D',
-      'StaffNotebookLogo16': '\uF48E',
-      'StaffNotebookLogoFill16': '\uF48F',
-      'StaffNotebookLogoInverted32': '\uF490',
-      'StaffNotebookLogoInverted16': '\uF491',
-      'KaizalaLogo': '\uF492',
-      'TaskLogo': '\uF493',
-      'ProtectionCenterLogo32': '\uF494',
-      'NonprofitLogo32': '\uF495',
-      'GallatinLogo': '\uF496',
-      'Globe2': '\uF49A',
-      'Guitar': '\uF49B',
-      'Breakfast': '\uF49C',
-      'Brunch': '\uF49D',
-      'BeerMug': '\uF49E',
-      'Vacation': '\uF49F',
-      'Teeth': '\uF4A0',
-      'Taxi': '\uF4A1',
-      'Chopsticks': '\uF4A2',
-      'SyncOccurence': '\uF4A3',
-      'UnsyncOccurence': '\uF4A4',
-      'PrimaryCalendar': '\uF4AE',
-      'SearchCalendar': '\uF4AF',
-      'VideoOff': '\uF4B0',
-      'MicrosoftFlowLogo': '\uF4B1',
-      'BusinessCenterLogo': '\uF4B2',
-      'ToDoLogoBottom': '\uF4B3',
-      'ToDoLogoTop': '\uF4B4',
-      'EditSolid12': '\uF4B5',
-      'EditSolidMirrored12': '\uF4B6',
-      'UneditableSolid12': '\uF4B7',
-      'UneditableSolidMirrored12': '\uF4B8',
-      'UneditableMirrored': '\uF4B9',
-      'AdminALogo32': '\uF4BA',
-      'AdminALogoFill32': '\uF4BB',
-      'ToDoLogoInverse': '\uF4BC',
-      'Snooze': '\uF4BD'
-    }
-  });
-}
diff --git a/packages/icons/src/fabric-icons-11.ts b/packages/icons/src/fabric-icons-11.ts
index 37ca88f3b9ec7..49c7567e2b146 100644
--- a/packages/icons/src/fabric-icons-11.ts
+++ b/packages/icons/src/fabric-icons-11.ts
@@ -1,105 +1,114 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-11"`,
-      src: `url('${baseUrl}fabric-icons-11-c0dbf638.woff') format('woff')`, 
-    },
-    icons: {
-      'IRMReplyMirrored': '\uF41E',
-      'IRMForward': '\uF41F',
-      'IRMForwardMirrored': '\uF420',
-      'VoicemailIRM': '\uF421',
-      'EventAccepted': '\uF422',
-      'EventTentative': '\uF423',
-      'EventTentativeMirrored': '\uF424',
-      'EventDeclined': '\uF425',
-      'IDBadge': '\uF427',
-      'OfficeFormsLogoInverse16': '\uF433',
-      'OfficeFormsLogo': '\uF434',
-      'OfficeFormsLogoFill': '\uF435',
-      'OfficeFormsLogo16': '\uF436',
-      'OfficeFormsLogoFill16': '\uF437',
-      'OfficeFormsLogoInverse24': '\uF43A',
-      'OfficeFormsLogo24': '\uF43B',
-      'OfficeFormsLogoFill24': '\uF43C',
-      'PageLock': '\uF43F',
-      'NotExecuted': '\uF440',
-      'NotImpactedSolid': '\uF441',
-      'FieldReadOnly': '\uF442',
-      'FieldRequired': '\uF443',
-      'BacklogBoard': '\uF444',
-      'ExternalBuild': '\uF445',
-      'ExternalTFVC': '\uF446',
-      'ExternalXAML': '\uF447',
-      'IssueSolid': '\uF448',
-      'DefectSolid': '\uF449',
-      'LadybugSolid': '\uF44A',
-      'MTMLogo': '\uF44B',
-      'NugetLogo': '\uF44C',
-      'TFVCLogo': '\uF44D',
-      'ProjectLogo32': '\uF47E',
-      'ProjectLogoFill32': '\uF47F',
-      'ProjectLogo16': '\uF480',
-      'ProjectLogoFill16': '\uF481',
-      'SwayLogo32': '\uF482',
-      'SwayLogoFill32': '\uF483',
-      'SwayLogo16': '\uF484',
-      'SwayLogoFill16': '\uF485',
-      'ClassNotebookLogo32': '\uF486',
-      'ClassNotebookLogoFill32': '\uF487',
-      'ClassNotebookLogo16': '\uF488',
-      'ClassNotebookLogoFill16': '\uF489',
-      'ClassNotebookLogoInverse32': '\uF48A',
-      'ClassNotebookLogoInverse16': '\uF48B',
-      'StaffNotebookLogo32': '\uF48C',
-      'StaffNotebookLogoFill32': '\uF48D',
-      'StaffNotebookLogo16': '\uF48E',
-      'StaffNotebookLogoFill16': '\uF48F',
-      'StaffNotebookLogoInverted32': '\uF490',
-      'StaffNotebookLogoInverted16': '\uF491',
-      'KaizalaLogo': '\uF492',
-      'TaskLogo': '\uF493',
-      'ProtectionCenterLogo32': '\uF494',
-      'NonprofitLogo32': '\uF495',
-      'GallatinLogo': '\uF496',
-      'Globe2': '\uF49A',
-      'Guitar': '\uF49B',
-      'Breakfast': '\uF49C',
-      'Brunch': '\uF49D',
-      'BeerMug': '\uF49E',
-      'Vacation': '\uF49F',
-      'Teeth': '\uF4A0',
-      'Taxi': '\uF4A1',
-      'Chopsticks': '\uF4A2',
-      'SyncOccurence': '\uF4A3',
-      'UnsyncOccurence': '\uF4A4',
-      'PrimaryCalendar': '\uF4AE',
-      'SearchCalendar': '\uF4AF',
-      'VideoOff': '\uF4B0',
-      'MicrosoftFlowLogo': '\uF4B1',
-      'BusinessCenterLogo': '\uF4B2',
-      'ToDoLogoBottom': '\uF4B3',
-      'ToDoLogoTop': '\uF4B4',
-      'EditSolid12': '\uF4B5',
-      'EditSolidMirrored12': '\uF4B6',
-      'UneditableSolid12': '\uF4B7',
-      'UneditableSolidMirrored12': '\uF4B8',
-      'UneditableMirrored': '\uF4B9',
-      'AdminALogo32': '\uF4BA',
-      'AdminALogoFill32': '\uF4BB',
-      'ToDoLogoInverse': '\uF4BC',
-      'Snooze': '\uF4BD'
-    }
-  });
-}
+// tslint:disable:max-line-length
+
+import {
+  IIconOptions,
+  IIconSubset,
+  registerIcons
+} from '@uifabric/styling/lib/index';
+
+export function initializeIcons(
+  baseUrl: string = '',
+  options?: IIconOptions
+): void {
+  const subset: IIconSubset = {
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-11"`,
+      src: `url('${baseUrl}fabric-icons-11-c0dbf638.woff') format('woff')`, 
+    },
+    icons: {
+      'IRMReplyMirrored': '\uF41E',
+      'IRMForward': '\uF41F',
+      'IRMForwardMirrored': '\uF420',
+      'VoicemailIRM': '\uF421',
+      'EventAccepted': '\uF422',
+      'EventTentative': '\uF423',
+      'EventTentativeMirrored': '\uF424',
+      'EventDeclined': '\uF425',
+      'IDBadge': '\uF427',
+      'OfficeFormsLogoInverse16': '\uF433',
+      'OfficeFormsLogo': '\uF434',
+      'OfficeFormsLogoFill': '\uF435',
+      'OfficeFormsLogo16': '\uF436',
+      'OfficeFormsLogoFill16': '\uF437',
+      'OfficeFormsLogoInverse24': '\uF43A',
+      'OfficeFormsLogo24': '\uF43B',
+      'OfficeFormsLogoFill24': '\uF43C',
+      'PageLock': '\uF43F',
+      'NotExecuted': '\uF440',
+      'NotImpactedSolid': '\uF441',
+      'FieldReadOnly': '\uF442',
+      'FieldRequired': '\uF443',
+      'BacklogBoard': '\uF444',
+      'ExternalBuild': '\uF445',
+      'ExternalTFVC': '\uF446',
+      'ExternalXAML': '\uF447',
+      'IssueSolid': '\uF448',
+      'DefectSolid': '\uF449',
+      'LadybugSolid': '\uF44A',
+      'MTMLogo': '\uF44B',
+      'NugetLogo': '\uF44C',
+      'TFVCLogo': '\uF44D',
+      'ProjectLogo32': '\uF47E',
+      'ProjectLogoFill32': '\uF47F',
+      'ProjectLogo16': '\uF480',
+      'ProjectLogoFill16': '\uF481',
+      'SwayLogo32': '\uF482',
+      'SwayLogoFill32': '\uF483',
+      'SwayLogo16': '\uF484',
+      'SwayLogoFill16': '\uF485',
+      'ClassNotebookLogo32': '\uF486',
+      'ClassNotebookLogoFill32': '\uF487',
+      'ClassNotebookLogo16': '\uF488',
+      'ClassNotebookLogoFill16': '\uF489',
+      'ClassNotebookLogoInverse32': '\uF48A',
+      'ClassNotebookLogoInverse16': '\uF48B',
+      'StaffNotebookLogo32': '\uF48C',
+      'StaffNotebookLogoFill32': '\uF48D',
+      'StaffNotebookLogo16': '\uF48E',
+      'StaffNotebookLogoFill16': '\uF48F',
+      'StaffNotebookLogoInverted32': '\uF490',
+      'StaffNotebookLogoInverted16': '\uF491',
+      'KaizalaLogo': '\uF492',
+      'TaskLogo': '\uF493',
+      'ProtectionCenterLogo32': '\uF494',
+      'NonprofitLogo32': '\uF495',
+      'GallatinLogo': '\uF496',
+      'Globe2': '\uF49A',
+      'Guitar': '\uF49B',
+      'Breakfast': '\uF49C',
+      'Brunch': '\uF49D',
+      'BeerMug': '\uF49E',
+      'Vacation': '\uF49F',
+      'Teeth': '\uF4A0',
+      'Taxi': '\uF4A1',
+      'Chopsticks': '\uF4A2',
+      'SyncOccurence': '\uF4A3',
+      'UnsyncOccurence': '\uF4A4',
+      'PrimaryCalendar': '\uF4AE',
+      'SearchCalendar': '\uF4AF',
+      'VideoOff': '\uF4B0',
+      'MicrosoftFlowLogo': '\uF4B1',
+      'BusinessCenterLogo': '\uF4B2',
+      'ToDoLogoBottom': '\uF4B3',
+      'ToDoLogoTop': '\uF4B4',
+      'EditSolid12': '\uF4B5',
+      'EditSolidMirrored12': '\uF4B6',
+      'UneditableSolid12': '\uF4B7',
+      'UneditableSolidMirrored12': '\uF4B8',
+      'UneditableMirrored': '\uF4B9',
+      'AdminALogo32': '\uF4BA',
+      'AdminALogoFill32': '\uF4BB',
+      'ToDoLogoInverse': '\uF4BC',
+      'Snooze': '\uF4BD'
+    }
+  };
+
+  registerIcons(subset, options);
+}
diff --git a/packages/icons/src/fabric-icons-2-inline.ts b/packages/icons/src/fabric-icons-2-inline.ts
deleted file mode 100644
index 7f7c67a7014e3..0000000000000
--- a/packages/icons/src/fabric-icons-2-inline.ts
+++ /dev/null
@@ -1,121 +0,0 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-2"`,
-      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
-    },
-    icons: {
-      'Fingerprint': '\uE928',
-      'Handwriting': '\uE929',
-      'StackIndicator': '\uE7FF',
-      'Completed': '\uE930',
-      'Label': '\uE932',
-      'FlickDown': '\uE935',
-      'FlickUp': '\uE936',
-      'FlickLeft': '\uE937',
-      'FlickRight': '\uE938',
-      'Streaming': '\uE93E',
-      'MusicInCollection': '\uE940',
-      'OneDrive': '\uE941',
-      'CompassNW': '\uE942',
-      'Code': '\uE943',
-      'LightningBolt': '\uE945',
-      'CalculatorMultiply': '\uE947',
-      'CalculatorAddition': '\uE948',
-      'CalculatorSubtract': '\uE949',
-      'CalculatorEqualTo': '\uE94E',
-      'PrintfaxPrinterFile': '\uE956',
-      'Communications': '\uE95A',
-      'Headset': '\uE95B',
-      'Health': '\uE95E',
-      'ChevronUpSmall': '\uE96D',
-      'ChevronDownSmall': '\uE96E',
-      'ChevronLeftSmall': '\uE96F',
-      'ChevronRightSmall': '\uE970',
-      'ChevronUpMed': '\uE971',
-      'ChevronDownMed': '\uE972',
-      'ChevronLeftMed': '\uE973',
-      'ChevronRightMed': '\uE974',
-      'Dictionary': '\uE82D',
-      'ChromeBack': '\uE830',
-      'PC1': '\uE977',
-      'PresenceChickletVideo': '\uE979',
-      'Reply': '\uE97A',
-      'HalfAlpha': '\uE97E',
-      'LockSolid': '\uE9A2',
-      'ConstructionCone': '\uE98F',
-      'DoubleChevronLeftMed': '\uE991',
-      'Volume0': '\uE992',
-      'Volume1': '\uE993',
-      'Volume2': '\uE994',
-      'Volume3': '\uE995',
-      'CaretHollow': '\uE817',
-      'CaretSolid': '\uE818',
-      'FolderOpen': '\uE838',
-      'PinnedFill': '\uE842',
-      'Chart': '\uE999',
-      'Robot': '\uE99A',
-      'BidiLtr': '\uE9AA',
-      'BidiRtl': '\uE9AB',
-      'RevToggleKey': '\uE845',
-      'RightDoubleQuote': '\uE9B1',
-      'Sunny': '\uE9BD',
-      'CloudWeather': '\uE9BE',
-      'Cloudy': '\uE9BF',
-      'PartlyCloudyDay': '\uE9C0',
-      'PartlyCloudyNight': '\uE9C1',
-      'ClearNight': '\uE9C2',
-      'RainShowersDay': '\uE9C3',
-      'Rain': '\uE9C4',
-      'Thunderstorms': '\uE9C6',
-      'RainSnow': '\uE9C7',
-      'Snow': '\uE9C8',
-      'BlowingSnow': '\uE9C9',
-      'Frigid': '\uE9CA',
-      'Fog': '\uE9CB',
-      'Squalls': '\uE9CC',
-      'Duststorm': '\uE9CD',
-      'Unknown': '\uE9CE',
-      'Precipitation': '\uE9CF',
-      'Ringer': '\uEA8F',
-      'PDF': '\uEA90',
-      'Ribbon': '\uE9D1',
-      'AreaChart': '\uE9D2',
-      'Assign': '\uE9D3',
-      'CheckList': '\uE9D5',
-      'Diagnostic': '\uE9D9',
-      'Generate': '\uE9DA',
-      'LineChart': '\uE9E6',
-      'Equalizer': '\uE9E9',
-      'BarChartHorizontal': '\uE9EB',
-      'BarChartVertical': '\uE9EC',
-      'Freezing': '\uE9EF',
-      'Processing': '\uE9F5',
-      'SnowShowerDay': '\uE9FD',
-      'HailDay': '\uEA00',
-      'WorkFlow': '\uEA01',
-      'StoreLogoMed': '\uEA04',
-      'TriangleSolid': '\uEA08',
-      'RainShowersNight': '\uEA0F',
-      'SnowShowerNight': '\uEA11',
-      'HailNight': '\uEA13',
-      'Info2': '\uEA1F',
-      'StoreLogo': '\uEA96',
-      'MultiSelectMirrored': '\uEA98',
-      'Broom': '\uEA99',
-      'MusicInCollectionFill': '\uEA36',
-      'Asterisk': '\uEA38'
-    }
-  });
-}
diff --git a/packages/icons/src/fabric-icons-2.ts b/packages/icons/src/fabric-icons-2.ts
index 1d1f8886d7a74..82e07752d6062 100644
--- a/packages/icons/src/fabric-icons-2.ts
+++ b/packages/icons/src/fabric-icons-2.ts
@@ -1,121 +1,130 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-2"`,
-      src: `url('${baseUrl}fabric-icons-2-2be8dca9.woff') format('woff')`, 
-    },
-    icons: {
-      'Fingerprint': '\uE928',
-      'Handwriting': '\uE929',
-      'StackIndicator': '\uE7FF',
-      'Completed': '\uE930',
-      'Label': '\uE932',
-      'FlickDown': '\uE935',
-      'FlickUp': '\uE936',
-      'FlickLeft': '\uE937',
-      'FlickRight': '\uE938',
-      'Streaming': '\uE93E',
-      'MusicInCollection': '\uE940',
-      'OneDrive': '\uE941',
-      'CompassNW': '\uE942',
-      'Code': '\uE943',
-      'LightningBolt': '\uE945',
-      'CalculatorMultiply': '\uE947',
-      'CalculatorAddition': '\uE948',
-      'CalculatorSubtract': '\uE949',
-      'CalculatorEqualTo': '\uE94E',
-      'PrintfaxPrinterFile': '\uE956',
-      'Communications': '\uE95A',
-      'Headset': '\uE95B',
-      'Health': '\uE95E',
-      'ChevronUpSmall': '\uE96D',
-      'ChevronDownSmall': '\uE96E',
-      'ChevronLeftSmall': '\uE96F',
-      'ChevronRightSmall': '\uE970',
-      'ChevronUpMed': '\uE971',
-      'ChevronDownMed': '\uE972',
-      'ChevronLeftMed': '\uE973',
-      'ChevronRightMed': '\uE974',
-      'Dictionary': '\uE82D',
-      'ChromeBack': '\uE830',
-      'PC1': '\uE977',
-      'PresenceChickletVideo': '\uE979',
-      'Reply': '\uE97A',
-      'HalfAlpha': '\uE97E',
-      'LockSolid': '\uE9A2',
-      'ConstructionCone': '\uE98F',
-      'DoubleChevronLeftMed': '\uE991',
-      'Volume0': '\uE992',
-      'Volume1': '\uE993',
-      'Volume2': '\uE994',
-      'Volume3': '\uE995',
-      'CaretHollow': '\uE817',
-      'CaretSolid': '\uE818',
-      'FolderOpen': '\uE838',
-      'PinnedFill': '\uE842',
-      'Chart': '\uE999',
-      'Robot': '\uE99A',
-      'BidiLtr': '\uE9AA',
-      'BidiRtl': '\uE9AB',
-      'RevToggleKey': '\uE845',
-      'RightDoubleQuote': '\uE9B1',
-      'Sunny': '\uE9BD',
-      'CloudWeather': '\uE9BE',
-      'Cloudy': '\uE9BF',
-      'PartlyCloudyDay': '\uE9C0',
-      'PartlyCloudyNight': '\uE9C1',
-      'ClearNight': '\uE9C2',
-      'RainShowersDay': '\uE9C3',
-      'Rain': '\uE9C4',
-      'Thunderstorms': '\uE9C6',
-      'RainSnow': '\uE9C7',
-      'Snow': '\uE9C8',
-      'BlowingSnow': '\uE9C9',
-      'Frigid': '\uE9CA',
-      'Fog': '\uE9CB',
-      'Squalls': '\uE9CC',
-      'Duststorm': '\uE9CD',
-      'Unknown': '\uE9CE',
-      'Precipitation': '\uE9CF',
-      'Ringer': '\uEA8F',
-      'PDF': '\uEA90',
-      'Ribbon': '\uE9D1',
-      'AreaChart': '\uE9D2',
-      'Assign': '\uE9D3',
-      'CheckList': '\uE9D5',
-      'Diagnostic': '\uE9D9',
-      'Generate': '\uE9DA',
-      'LineChart': '\uE9E6',
-      'Equalizer': '\uE9E9',
-      'BarChartHorizontal': '\uE9EB',
-      'BarChartVertical': '\uE9EC',
-      'Freezing': '\uE9EF',
-      'Processing': '\uE9F5',
-      'SnowShowerDay': '\uE9FD',
-      'HailDay': '\uEA00',
-      'WorkFlow': '\uEA01',
-      'StoreLogoMed': '\uEA04',
-      'TriangleSolid': '\uEA08',
-      'RainShowersNight': '\uEA0F',
-      'SnowShowerNight': '\uEA11',
-      'HailNight': '\uEA13',
-      'Info2': '\uEA1F',
-      'StoreLogo': '\uEA96',
-      'MultiSelectMirrored': '\uEA98',
-      'Broom': '\uEA99',
-      'MusicInCollectionFill': '\uEA36',
-      'Asterisk': '\uEA38'
-    }
-  });
-}
+// tslint:disable:max-line-length
+
+import {
+  IIconOptions,
+  IIconSubset,
+  registerIcons
+} from '@uifabric/styling/lib/index';
+
+export function initializeIcons(
+  baseUrl: string = '',
+  options?: IIconOptions
+): void {
+  const subset: IIconSubset = {
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-2"`,
+      src: `url('${baseUrl}fabric-icons-2-2be8dca9.woff') format('woff')`, 
+    },
+    icons: {
+      'Fingerprint': '\uE928',
+      'Handwriting': '\uE929',
+      'StackIndicator': '\uE7FF',
+      'Completed': '\uE930',
+      'Label': '\uE932',
+      'FlickDown': '\uE935',
+      'FlickUp': '\uE936',
+      'FlickLeft': '\uE937',
+      'FlickRight': '\uE938',
+      'Streaming': '\uE93E',
+      'MusicInCollection': '\uE940',
+      'OneDrive': '\uE941',
+      'CompassNW': '\uE942',
+      'Code': '\uE943',
+      'LightningBolt': '\uE945',
+      'CalculatorMultiply': '\uE947',
+      'CalculatorAddition': '\uE948',
+      'CalculatorSubtract': '\uE949',
+      'CalculatorEqualTo': '\uE94E',
+      'PrintfaxPrinterFile': '\uE956',
+      'Communications': '\uE95A',
+      'Headset': '\uE95B',
+      'Health': '\uE95E',
+      'ChevronUpSmall': '\uE96D',
+      'ChevronDownSmall': '\uE96E',
+      'ChevronLeftSmall': '\uE96F',
+      'ChevronRightSmall': '\uE970',
+      'ChevronUpMed': '\uE971',
+      'ChevronDownMed': '\uE972',
+      'ChevronLeftMed': '\uE973',
+      'ChevronRightMed': '\uE974',
+      'Dictionary': '\uE82D',
+      'ChromeBack': '\uE830',
+      'PC1': '\uE977',
+      'PresenceChickletVideo': '\uE979',
+      'Reply': '\uE97A',
+      'HalfAlpha': '\uE97E',
+      'LockSolid': '\uE9A2',
+      'ConstructionCone': '\uE98F',
+      'DoubleChevronLeftMed': '\uE991',
+      'Volume0': '\uE992',
+      'Volume1': '\uE993',
+      'Volume2': '\uE994',
+      'Volume3': '\uE995',
+      'CaretHollow': '\uE817',
+      'CaretSolid': '\uE818',
+      'FolderOpen': '\uE838',
+      'PinnedFill': '\uE842',
+      'Chart': '\uE999',
+      'Robot': '\uE99A',
+      'BidiLtr': '\uE9AA',
+      'BidiRtl': '\uE9AB',
+      'RevToggleKey': '\uE845',
+      'RightDoubleQuote': '\uE9B1',
+      'Sunny': '\uE9BD',
+      'CloudWeather': '\uE9BE',
+      'Cloudy': '\uE9BF',
+      'PartlyCloudyDay': '\uE9C0',
+      'PartlyCloudyNight': '\uE9C1',
+      'ClearNight': '\uE9C2',
+      'RainShowersDay': '\uE9C3',
+      'Rain': '\uE9C4',
+      'Thunderstorms': '\uE9C6',
+      'RainSnow': '\uE9C7',
+      'Snow': '\uE9C8',
+      'BlowingSnow': '\uE9C9',
+      'Frigid': '\uE9CA',
+      'Fog': '\uE9CB',
+      'Squalls': '\uE9CC',
+      'Duststorm': '\uE9CD',
+      'Unknown': '\uE9CE',
+      'Precipitation': '\uE9CF',
+      'Ringer': '\uEA8F',
+      'PDF': '\uEA90',
+      'Ribbon': '\uE9D1',
+      'AreaChart': '\uE9D2',
+      'Assign': '\uE9D3',
+      'CheckList': '\uE9D5',
+      'Diagnostic': '\uE9D9',
+      'Generate': '\uE9DA',
+      'LineChart': '\uE9E6',
+      'Equalizer': '\uE9E9',
+      'BarChartHorizontal': '\uE9EB',
+      'BarChartVertical': '\uE9EC',
+      'Freezing': '\uE9EF',
+      'Processing': '\uE9F5',
+      'SnowShowerDay': '\uE9FD',
+      'HailDay': '\uEA00',
+      'WorkFlow': '\uEA01',
+      'StoreLogoMed': '\uEA04',
+      'TriangleSolid': '\uEA08',
+      'RainShowersNight': '\uEA0F',
+      'SnowShowerNight': '\uEA11',
+      'HailNight': '\uEA13',
+      'Info2': '\uEA1F',
+      'StoreLogo': '\uEA96',
+      'MultiSelectMirrored': '\uEA98',
+      'Broom': '\uEA99',
+      'MusicInCollectionFill': '\uEA36',
+      'Asterisk': '\uEA38'
+    }
+  };
+
+  registerIcons(subset, options);
+}
diff --git a/packages/icons/src/fabric-icons-3-inline.ts b/packages/icons/src/fabric-icons-3-inline.ts
deleted file mode 100644
index 69e8c21153a7b..0000000000000
--- a/packages/icons/src/fabric-icons-3-inline.ts
+++ /dev/null
@@ -1,121 +0,0 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-3"`,
-      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
-    },
-    icons: {
-      'ErrorBadge': '\uEA39',
-      'CircleFill': '\uEA3B',
-      'Record2': '\uEA3F',
-      'BookmarksMirrored': '\uEA41',
-      'BulletedListMirrored': '\uEA42',
-      'CaretHollowMirrored': '\uEA45',
-      'CaretSolidMirrored': '\uEA46',
-      'ChromeBackMirrored': '\uEA47',
-      'ClosePaneMirrored': '\uEA49',
-      'DockLeftMirrored': '\uEA4C',
-      'DoubleChevronLeftMedMirrored': '\uEA4D',
-      'HelpMirrored': '\uEA51',
-      'ImportMirrored': '\uEA52',
-      'ListMirrored': '\uEA55',
-      'MailForwardMirrored': '\uEA56',
-      'MailReplyMirrored': '\uEA57',
-      'MailReplyAllMirrored': '\uEA58',
-      'OpenPaneMirrored': '\uEA5B',
-      'ParkingLocationMirrored': '\uEA5E',
-      'SendMirrored': '\uEA63',
-      'ShowResultsMirrored': '\uEA65',
-      'ThumbnailViewMirrored': '\uEA67',
-      'Devices3': '\uEA6C',
-      'Lightbulb': '\uEA80',
-      'StatusTriangle': '\uEA82',
-      'VolumeDisabled': '\uEA85',
-      'Puzzle': '\uEA86',
-      'EmojiNeutral': '\uEA87',
-      'EmojiDisappointed': '\uEA88',
-      'HomeSolid': '\uEA8A',
-      'Cocktails': '\uEA9D',
-      'Wines': '\uEABF',
-      'Articles': '\uEAC1',
-      'Cycling': '\uEAC7',
-      'DietPlanNotebook': '\uEAC8',
-      'Pill': '\uEACB',
-      'ExerciseTracker': '\uEACC',
-      'Medical': '\uEAD4',
-      'Running': '\uEADA',
-      'Weights': '\uEADB',
-      'BarChart4': '\uEAE7',
-      'CirclePlus': '\uEAEE',
-      'Coffee': '\uEAEF',
-      'Cotton': '\uEAF3',
-      'Market': '\uEAFC',
-      'Money': '\uEAFD',
-      'PieDouble': '\uEB04',
-      'PieSingle': '\uEB05',
-      'RemoveFilter': '\uEB08',
-      'Savings': '\uEB0B',
-      'StockDown': '\uEB0F',
-      'StockUp': '\uEB11',
-      'MSNVideos': '\uEB1C',
-      'Cricket': '\uEB1E',
-      'Golf': '\uEB1F',
-      'Baseball': '\uEB20',
-      'Soccer': '\uEB21',
-      'MoreSports': '\uEB22',
-      'AutoRacing': '\uEB24',
-      'CollegeHoops': '\uEB25',
-      'CollegeFootball': '\uEB26',
-      'ProFootball': '\uEB27',
-      'ProHockey': '\uEB28',
-      'Rugby': '\uEB2D',
-      'Tennis': '\uEB33',
-      'Arrivals': '\uEB34',
-      'Design': '\uEB3C',
-      'Website': '\uEB41',
-      'Drop': '\uEB42',
-      'SkiResorts': '\uEB45',
-      'Snowflake': '\uEB46',
-      'BusSolid': '\uEB47',
-      'FerrySolid': '\uEB48',
-      'AirplaneSolid': '\uEB4C',
-      'TrainSolid': '\uEB4D',
-      'Ticket': '\uEB54',
-      'Devices4': '\uEB66',
-      'AzureLogo': '\uEB6A',
-      'BingLogo': '\uEB6B',
-      'MSNLogo': '\uEB6C',
-      'OutlookLogoInverse': '\uEB6D',
-      'OfficeLogo': '\uEB6E',
-      'SkypeLogo': '\uEB6F',
-      'Door': '\uEB75',
-      'EditMirrored': '\uEB7E',
-      'GiftCard': '\uEB8E',
-      'DoubleBookmark': '\uEB8F',
-      'StatusErrorFull': '\uEB90',
-      'Certificate': '\uEB95',
-      'FastForward': '\uEB9D',
-      'Rewind': '\uEB9E',
-      'Photo2': '\uEB9F',
-      'OpenSource': '\uEBC2',
-      'CloudDownload': '\uEBD3',
-      'WindDirection': '\uEBE6',
-      'Family': '\uEBDA',
-      'CSS': '\uEBEF',
-      'JS': '\uEBF0',
-      'DeliveryTruck': '\uEBF4',
-      'ReminderPerson': '\uEBF7'
-    }
-  });
-}
diff --git a/packages/icons/src/fabric-icons-3.ts b/packages/icons/src/fabric-icons-3.ts
index 6ba5d3d7ca294..f96d1a1b188f8 100644
--- a/packages/icons/src/fabric-icons-3.ts
+++ b/packages/icons/src/fabric-icons-3.ts
@@ -1,121 +1,130 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-3"`,
-      src: `url('${baseUrl}fabric-icons-3-80b6008d.woff') format('woff')`, 
-    },
-    icons: {
-      'ErrorBadge': '\uEA39',
-      'CircleFill': '\uEA3B',
-      'Record2': '\uEA3F',
-      'BookmarksMirrored': '\uEA41',
-      'BulletedListMirrored': '\uEA42',
-      'CaretHollowMirrored': '\uEA45',
-      'CaretSolidMirrored': '\uEA46',
-      'ChromeBackMirrored': '\uEA47',
-      'ClosePaneMirrored': '\uEA49',
-      'DockLeftMirrored': '\uEA4C',
-      'DoubleChevronLeftMedMirrored': '\uEA4D',
-      'HelpMirrored': '\uEA51',
-      'ImportMirrored': '\uEA52',
-      'ListMirrored': '\uEA55',
-      'MailForwardMirrored': '\uEA56',
-      'MailReplyMirrored': '\uEA57',
-      'MailReplyAllMirrored': '\uEA58',
-      'OpenPaneMirrored': '\uEA5B',
-      'ParkingLocationMirrored': '\uEA5E',
-      'SendMirrored': '\uEA63',
-      'ShowResultsMirrored': '\uEA65',
-      'ThumbnailViewMirrored': '\uEA67',
-      'Devices3': '\uEA6C',
-      'Lightbulb': '\uEA80',
-      'StatusTriangle': '\uEA82',
-      'VolumeDisabled': '\uEA85',
-      'Puzzle': '\uEA86',
-      'EmojiNeutral': '\uEA87',
-      'EmojiDisappointed': '\uEA88',
-      'HomeSolid': '\uEA8A',
-      'Cocktails': '\uEA9D',
-      'Wines': '\uEABF',
-      'Articles': '\uEAC1',
-      'Cycling': '\uEAC7',
-      'DietPlanNotebook': '\uEAC8',
-      'Pill': '\uEACB',
-      'ExerciseTracker': '\uEACC',
-      'Medical': '\uEAD4',
-      'Running': '\uEADA',
-      'Weights': '\uEADB',
-      'BarChart4': '\uEAE7',
-      'CirclePlus': '\uEAEE',
-      'Coffee': '\uEAEF',
-      'Cotton': '\uEAF3',
-      'Market': '\uEAFC',
-      'Money': '\uEAFD',
-      'PieDouble': '\uEB04',
-      'PieSingle': '\uEB05',
-      'RemoveFilter': '\uEB08',
-      'Savings': '\uEB0B',
-      'StockDown': '\uEB0F',
-      'StockUp': '\uEB11',
-      'MSNVideos': '\uEB1C',
-      'Cricket': '\uEB1E',
-      'Golf': '\uEB1F',
-      'Baseball': '\uEB20',
-      'Soccer': '\uEB21',
-      'MoreSports': '\uEB22',
-      'AutoRacing': '\uEB24',
-      'CollegeHoops': '\uEB25',
-      'CollegeFootball': '\uEB26',
-      'ProFootball': '\uEB27',
-      'ProHockey': '\uEB28',
-      'Rugby': '\uEB2D',
-      'Tennis': '\uEB33',
-      'Arrivals': '\uEB34',
-      'Design': '\uEB3C',
-      'Website': '\uEB41',
-      'Drop': '\uEB42',
-      'SkiResorts': '\uEB45',
-      'Snowflake': '\uEB46',
-      'BusSolid': '\uEB47',
-      'FerrySolid': '\uEB48',
-      'AirplaneSolid': '\uEB4C',
-      'TrainSolid': '\uEB4D',
-      'Ticket': '\uEB54',
-      'Devices4': '\uEB66',
-      'AzureLogo': '\uEB6A',
-      'BingLogo': '\uEB6B',
-      'MSNLogo': '\uEB6C',
-      'OutlookLogoInverse': '\uEB6D',
-      'OfficeLogo': '\uEB6E',
-      'SkypeLogo': '\uEB6F',
-      'Door': '\uEB75',
-      'EditMirrored': '\uEB7E',
-      'GiftCard': '\uEB8E',
-      'DoubleBookmark': '\uEB8F',
-      'StatusErrorFull': '\uEB90',
-      'Certificate': '\uEB95',
-      'FastForward': '\uEB9D',
-      'Rewind': '\uEB9E',
-      'Photo2': '\uEB9F',
-      'OpenSource': '\uEBC2',
-      'CloudDownload': '\uEBD3',
-      'WindDirection': '\uEBE6',
-      'Family': '\uEBDA',
-      'CSS': '\uEBEF',
-      'JS': '\uEBF0',
-      'DeliveryTruck': '\uEBF4',
-      'ReminderPerson': '\uEBF7'
-    }
-  });
-}
+// tslint:disable:max-line-length
+
+import {
+  IIconOptions,
+  IIconSubset,
+  registerIcons
+} from '@uifabric/styling/lib/index';
+
+export function initializeIcons(
+  baseUrl: string = '',
+  options?: IIconOptions
+): void {
+  const subset: IIconSubset = {
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-3"`,
+      src: `url('${baseUrl}fabric-icons-3-80b6008d.woff') format('woff')`, 
+    },
+    icons: {
+      'ErrorBadge': '\uEA39',
+      'CircleFill': '\uEA3B',
+      'Record2': '\uEA3F',
+      'BookmarksMirrored': '\uEA41',
+      'BulletedListMirrored': '\uEA42',
+      'CaretHollowMirrored': '\uEA45',
+      'CaretSolidMirrored': '\uEA46',
+      'ChromeBackMirrored': '\uEA47',
+      'ClosePaneMirrored': '\uEA49',
+      'DockLeftMirrored': '\uEA4C',
+      'DoubleChevronLeftMedMirrored': '\uEA4D',
+      'HelpMirrored': '\uEA51',
+      'ImportMirrored': '\uEA52',
+      'ListMirrored': '\uEA55',
+      'MailForwardMirrored': '\uEA56',
+      'MailReplyMirrored': '\uEA57',
+      'MailReplyAllMirrored': '\uEA58',
+      'OpenPaneMirrored': '\uEA5B',
+      'ParkingLocationMirrored': '\uEA5E',
+      'SendMirrored': '\uEA63',
+      'ShowResultsMirrored': '\uEA65',
+      'ThumbnailViewMirrored': '\uEA67',
+      'Devices3': '\uEA6C',
+      'Lightbulb': '\uEA80',
+      'StatusTriangle': '\uEA82',
+      'VolumeDisabled': '\uEA85',
+      'Puzzle': '\uEA86',
+      'EmojiNeutral': '\uEA87',
+      'EmojiDisappointed': '\uEA88',
+      'HomeSolid': '\uEA8A',
+      'Cocktails': '\uEA9D',
+      'Wines': '\uEABF',
+      'Articles': '\uEAC1',
+      'Cycling': '\uEAC7',
+      'DietPlanNotebook': '\uEAC8',
+      'Pill': '\uEACB',
+      'ExerciseTracker': '\uEACC',
+      'Medical': '\uEAD4',
+      'Running': '\uEADA',
+      'Weights': '\uEADB',
+      'BarChart4': '\uEAE7',
+      'CirclePlus': '\uEAEE',
+      'Coffee': '\uEAEF',
+      'Cotton': '\uEAF3',
+      'Market': '\uEAFC',
+      'Money': '\uEAFD',
+      'PieDouble': '\uEB04',
+      'PieSingle': '\uEB05',
+      'RemoveFilter': '\uEB08',
+      'Savings': '\uEB0B',
+      'StockDown': '\uEB0F',
+      'StockUp': '\uEB11',
+      'MSNVideos': '\uEB1C',
+      'Cricket': '\uEB1E',
+      'Golf': '\uEB1F',
+      'Baseball': '\uEB20',
+      'Soccer': '\uEB21',
+      'MoreSports': '\uEB22',
+      'AutoRacing': '\uEB24',
+      'CollegeHoops': '\uEB25',
+      'CollegeFootball': '\uEB26',
+      'ProFootball': '\uEB27',
+      'ProHockey': '\uEB28',
+      'Rugby': '\uEB2D',
+      'Tennis': '\uEB33',
+      'Arrivals': '\uEB34',
+      'Design': '\uEB3C',
+      'Website': '\uEB41',
+      'Drop': '\uEB42',
+      'SkiResorts': '\uEB45',
+      'Snowflake': '\uEB46',
+      'BusSolid': '\uEB47',
+      'FerrySolid': '\uEB48',
+      'AirplaneSolid': '\uEB4C',
+      'TrainSolid': '\uEB4D',
+      'Ticket': '\uEB54',
+      'Devices4': '\uEB66',
+      'AzureLogo': '\uEB6A',
+      'BingLogo': '\uEB6B',
+      'MSNLogo': '\uEB6C',
+      'OutlookLogoInverse': '\uEB6D',
+      'OfficeLogo': '\uEB6E',
+      'SkypeLogo': '\uEB6F',
+      'Door': '\uEB75',
+      'EditMirrored': '\uEB7E',
+      'GiftCard': '\uEB8E',
+      'DoubleBookmark': '\uEB8F',
+      'StatusErrorFull': '\uEB90',
+      'Certificate': '\uEB95',
+      'FastForward': '\uEB9D',
+      'Rewind': '\uEB9E',
+      'Photo2': '\uEB9F',
+      'OpenSource': '\uEBC2',
+      'CloudDownload': '\uEBD3',
+      'WindDirection': '\uEBE6',
+      'Family': '\uEBDA',
+      'CSS': '\uEBEF',
+      'JS': '\uEBF0',
+      'DeliveryTruck': '\uEBF4',
+      'ReminderPerson': '\uEBF7'
+    }
+  };
+
+  registerIcons(subset, options);
+}
diff --git a/packages/icons/src/fabric-icons-4-inline.ts b/packages/icons/src/fabric-icons-4-inline.ts
deleted file mode 100644
index 0ab8553d50318..0000000000000
--- a/packages/icons/src/fabric-icons-4-inline.ts
+++ /dev/null
@@ -1,117 +0,0 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-4"`,
-      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
-    },
-    icons: {
-      'ReminderGroup': '\uEBF8',
-      'Umbrella': '\uEC04',
-      'NetworkTower': '\uEC05',
-      'CityNext': '\uEC06',
-      'Section': '\uEC0C',
-      'OneNoteLogoInverse': '\uEC0D',
-      'ToggleFilled': '\uEC11',
-      'ToggleBorder': '\uEC12',
-      'SliderThumb': '\uEC13',
-      'ToggleThumb': '\uEC14',
-      'Documentation': '\uEC17',
-      'Badge': '\uEC1B',
-      'Giftbox': '\uEC1F',
-      'VisualStudioLogo': '\uEC22',
-      'ExcelLogoInverse': '\uEC28',
-      'WordLogoInverse': '\uEC29',
-      'PowerPointLogoInverse': '\uEC2A',
-      'Cafe': '\uEC32',
-      'SpeedHigh': '\uEC4A',
-      'ThisPC': '\uEC4E',
-      'MusicNote': '\uEC4F',
-      'MicOff': '\uEC54',
-      'EdgeLogo': '\uEC60',
-      'CompletedSolid': '\uEC61',
-      'AlbumRemove': '\uEC62',
-      'MessageFill': '\uEC70',
-      'TabletSelected': '\uEC74',
-      'MobileSelected': '\uEC75',
-      'LaptopSelected': '\uEC76',
-      'TVMonitorSelected': '\uEC77',
-      'DeveloperTools': '\uEC7A',
-      'InsertTextBox': '\uEC7D',
-      'LowerBrightness': '\uEC8A',
-      'CloudUpload': '\uEC8E',
-      'ScrollUpDown': '\uEC8F',
-      'DateTime': '\uEC92',
-      'Event': '\uECA3',
-      'Cake': '\uECA4',
-      'Org': '\uECA6',
-      'PartyLeader': '\uECA7',
-      'DRM': '\uECA8',
-      'CloudAdd': '\uECA9',
-      'AppIconDefault': '\uECAA',
-      'Photo2Add': '\uECAB',
-      'Photo2Remove': '\uECAC',
-      'POI': '\uECAF',
-      'AddTo': '\uECC8',
-      'RadioBtnOff': '\uECCA',
-      'RadioBtnOn': '\uECCB',
-      'ExploreContent': '\uECCD',
-      'VideoSolid': '\uEA0C',
-      'Teamwork': '\uEA12',
-      'PeopleAdd': '\uEA15',
-      'Glasses': '\uEA16',
-      'DateTime2': '\uEA17',
-      'Shield': '\uEA18',
-      'Header1': '\uEA19',
-      'PageAdd': '\uEA1A',
-      'NumberedList': '\uEA1C',
-      'PowerBILogo': '\uEA1E',
-      'Product': '\uECDC',
-      'ProgressLoopInner': '\uECDE',
-      'ProgressLoopOuter': '\uECDF',
-      'Blocked2': '\uECE4',
-      'FangBody': '\uECEB',
-      'Glimmer': '\uECF4',
-      'ChatInviteFriend': '\uECFE',
-      'Crown': '\uED01',
-      'Feedback': '\uED15',
-      'SharepointLogoInverse': '\uED18',
-      'YammerLogo': '\uED19',
-      'Hide': '\uED1A',
-      'Uneditable': '\uED1D',
-      'ReturnToSession': '\uED24',
-      'OpenFolderHorizontal': '\uED25',
-      'CalendarMirrored': '\uED28',
-      'SwayLogoInverse': '\uED29',
-      'OutOfOffice': '\uED34',
-      'Trophy': '\uED3F',
-      'ReopenPages': '\uED50',
-      'AADLogo': '\uED68',
-      'AccessLogo': '\uED69',
-      'AdminALogoInverse32': '\uED6A',
-      'AdminCLogoInverse32': '\uED6B',
-      'AdminDLogoInverse32': '\uED6C',
-      'AdminELogoInverse32': '\uED6D',
-      'AdminLLogoInverse32': '\uED6E',
-      'AdminMLogoInverse32': '\uED6F',
-      'AdminOLogoInverse32': '\uED70',
-      'AdminPLogoInverse32': '\uED71',
-      'AdminSLogoInverse32': '\uED72',
-      'AdminYLogoInverse32': '\uED73',
-      'DelveLogoInverse': '\uED76',
-      'ExchangeLogoInverse': '\uED78',
-      'LyncLogo': '\uED79',
-      'OfficeVideoLogoInverse': '\uED7A'
-    }
-  });
-}
diff --git a/packages/icons/src/fabric-icons-4.ts b/packages/icons/src/fabric-icons-4.ts
index 16ee779fcc03a..576d1fa57fd0a 100644
--- a/packages/icons/src/fabric-icons-4.ts
+++ b/packages/icons/src/fabric-icons-4.ts
@@ -1,117 +1,126 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-4"`,
-      src: `url('${baseUrl}fabric-icons-4-46fbc7bc.woff') format('woff')`, 
-    },
-    icons: {
-      'ReminderGroup': '\uEBF8',
-      'Umbrella': '\uEC04',
-      'NetworkTower': '\uEC05',
-      'CityNext': '\uEC06',
-      'Section': '\uEC0C',
-      'OneNoteLogoInverse': '\uEC0D',
-      'ToggleFilled': '\uEC11',
-      'ToggleBorder': '\uEC12',
-      'SliderThumb': '\uEC13',
-      'ToggleThumb': '\uEC14',
-      'Documentation': '\uEC17',
-      'Badge': '\uEC1B',
-      'Giftbox': '\uEC1F',
-      'VisualStudioLogo': '\uEC22',
-      'ExcelLogoInverse': '\uEC28',
-      'WordLogoInverse': '\uEC29',
-      'PowerPointLogoInverse': '\uEC2A',
-      'Cafe': '\uEC32',
-      'SpeedHigh': '\uEC4A',
-      'ThisPC': '\uEC4E',
-      'MusicNote': '\uEC4F',
-      'MicOff': '\uEC54',
-      'EdgeLogo': '\uEC60',
-      'CompletedSolid': '\uEC61',
-      'AlbumRemove': '\uEC62',
-      'MessageFill': '\uEC70',
-      'TabletSelected': '\uEC74',
-      'MobileSelected': '\uEC75',
-      'LaptopSelected': '\uEC76',
-      'TVMonitorSelected': '\uEC77',
-      'DeveloperTools': '\uEC7A',
-      'InsertTextBox': '\uEC7D',
-      'LowerBrightness': '\uEC8A',
-      'CloudUpload': '\uEC8E',
-      'ScrollUpDown': '\uEC8F',
-      'DateTime': '\uEC92',
-      'Event': '\uECA3',
-      'Cake': '\uECA4',
-      'Org': '\uECA6',
-      'PartyLeader': '\uECA7',
-      'DRM': '\uECA8',
-      'CloudAdd': '\uECA9',
-      'AppIconDefault': '\uECAA',
-      'Photo2Add': '\uECAB',
-      'Photo2Remove': '\uECAC',
-      'POI': '\uECAF',
-      'AddTo': '\uECC8',
-      'RadioBtnOff': '\uECCA',
-      'RadioBtnOn': '\uECCB',
-      'ExploreContent': '\uECCD',
-      'VideoSolid': '\uEA0C',
-      'Teamwork': '\uEA12',
-      'PeopleAdd': '\uEA15',
-      'Glasses': '\uEA16',
-      'DateTime2': '\uEA17',
-      'Shield': '\uEA18',
-      'Header1': '\uEA19',
-      'PageAdd': '\uEA1A',
-      'NumberedList': '\uEA1C',
-      'PowerBILogo': '\uEA1E',
-      'Product': '\uECDC',
-      'ProgressLoopInner': '\uECDE',
-      'ProgressLoopOuter': '\uECDF',
-      'Blocked2': '\uECE4',
-      'FangBody': '\uECEB',
-      'Glimmer': '\uECF4',
-      'ChatInviteFriend': '\uECFE',
-      'Crown': '\uED01',
-      'Feedback': '\uED15',
-      'SharepointLogoInverse': '\uED18',
-      'YammerLogo': '\uED19',
-      'Hide': '\uED1A',
-      'Uneditable': '\uED1D',
-      'ReturnToSession': '\uED24',
-      'OpenFolderHorizontal': '\uED25',
-      'CalendarMirrored': '\uED28',
-      'SwayLogoInverse': '\uED29',
-      'OutOfOffice': '\uED34',
-      'Trophy': '\uED3F',
-      'ReopenPages': '\uED50',
-      'AADLogo': '\uED68',
-      'AccessLogo': '\uED69',
-      'AdminALogoInverse32': '\uED6A',
-      'AdminCLogoInverse32': '\uED6B',
-      'AdminDLogoInverse32': '\uED6C',
-      'AdminELogoInverse32': '\uED6D',
-      'AdminLLogoInverse32': '\uED6E',
-      'AdminMLogoInverse32': '\uED6F',
-      'AdminOLogoInverse32': '\uED70',
-      'AdminPLogoInverse32': '\uED71',
-      'AdminSLogoInverse32': '\uED72',
-      'AdminYLogoInverse32': '\uED73',
-      'DelveLogoInverse': '\uED76',
-      'ExchangeLogoInverse': '\uED78',
-      'LyncLogo': '\uED79',
-      'OfficeVideoLogoInverse': '\uED7A'
-    }
-  });
-}
+// tslint:disable:max-line-length
+
+import {
+  IIconOptions,
+  IIconSubset,
+  registerIcons
+} from '@uifabric/styling/lib/index';
+
+export function initializeIcons(
+  baseUrl: string = '',
+  options?: IIconOptions
+): void {
+  const subset: IIconSubset = {
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-4"`,
+      src: `url('${baseUrl}fabric-icons-4-46fbc7bc.woff') format('woff')`, 
+    },
+    icons: {
+      'ReminderGroup': '\uEBF8',
+      'Umbrella': '\uEC04',
+      'NetworkTower': '\uEC05',
+      'CityNext': '\uEC06',
+      'Section': '\uEC0C',
+      'OneNoteLogoInverse': '\uEC0D',
+      'ToggleFilled': '\uEC11',
+      'ToggleBorder': '\uEC12',
+      'SliderThumb': '\uEC13',
+      'ToggleThumb': '\uEC14',
+      'Documentation': '\uEC17',
+      'Badge': '\uEC1B',
+      'Giftbox': '\uEC1F',
+      'VisualStudioLogo': '\uEC22',
+      'ExcelLogoInverse': '\uEC28',
+      'WordLogoInverse': '\uEC29',
+      'PowerPointLogoInverse': '\uEC2A',
+      'Cafe': '\uEC32',
+      'SpeedHigh': '\uEC4A',
+      'ThisPC': '\uEC4E',
+      'MusicNote': '\uEC4F',
+      'MicOff': '\uEC54',
+      'EdgeLogo': '\uEC60',
+      'CompletedSolid': '\uEC61',
+      'AlbumRemove': '\uEC62',
+      'MessageFill': '\uEC70',
+      'TabletSelected': '\uEC74',
+      'MobileSelected': '\uEC75',
+      'LaptopSelected': '\uEC76',
+      'TVMonitorSelected': '\uEC77',
+      'DeveloperTools': '\uEC7A',
+      'InsertTextBox': '\uEC7D',
+      'LowerBrightness': '\uEC8A',
+      'CloudUpload': '\uEC8E',
+      'ScrollUpDown': '\uEC8F',
+      'DateTime': '\uEC92',
+      'Event': '\uECA3',
+      'Cake': '\uECA4',
+      'Org': '\uECA6',
+      'PartyLeader': '\uECA7',
+      'DRM': '\uECA8',
+      'CloudAdd': '\uECA9',
+      'AppIconDefault': '\uECAA',
+      'Photo2Add': '\uECAB',
+      'Photo2Remove': '\uECAC',
+      'POI': '\uECAF',
+      'AddTo': '\uECC8',
+      'RadioBtnOff': '\uECCA',
+      'RadioBtnOn': '\uECCB',
+      'ExploreContent': '\uECCD',
+      'VideoSolid': '\uEA0C',
+      'Teamwork': '\uEA12',
+      'PeopleAdd': '\uEA15',
+      'Glasses': '\uEA16',
+      'DateTime2': '\uEA17',
+      'Shield': '\uEA18',
+      'Header1': '\uEA19',
+      'PageAdd': '\uEA1A',
+      'NumberedList': '\uEA1C',
+      'PowerBILogo': '\uEA1E',
+      'Product': '\uECDC',
+      'ProgressLoopInner': '\uECDE',
+      'ProgressLoopOuter': '\uECDF',
+      'Blocked2': '\uECE4',
+      'FangBody': '\uECEB',
+      'Glimmer': '\uECF4',
+      'ChatInviteFriend': '\uECFE',
+      'Crown': '\uED01',
+      'Feedback': '\uED15',
+      'SharepointLogoInverse': '\uED18',
+      'YammerLogo': '\uED19',
+      'Hide': '\uED1A',
+      'Uneditable': '\uED1D',
+      'ReturnToSession': '\uED24',
+      'OpenFolderHorizontal': '\uED25',
+      'CalendarMirrored': '\uED28',
+      'SwayLogoInverse': '\uED29',
+      'OutOfOffice': '\uED34',
+      'Trophy': '\uED3F',
+      'ReopenPages': '\uED50',
+      'AADLogo': '\uED68',
+      'AccessLogo': '\uED69',
+      'AdminALogoInverse32': '\uED6A',
+      'AdminCLogoInverse32': '\uED6B',
+      'AdminDLogoInverse32': '\uED6C',
+      'AdminELogoInverse32': '\uED6D',
+      'AdminLLogoInverse32': '\uED6E',
+      'AdminMLogoInverse32': '\uED6F',
+      'AdminOLogoInverse32': '\uED70',
+      'AdminPLogoInverse32': '\uED71',
+      'AdminSLogoInverse32': '\uED72',
+      'AdminYLogoInverse32': '\uED73',
+      'DelveLogoInverse': '\uED76',
+      'ExchangeLogoInverse': '\uED78',
+      'LyncLogo': '\uED79',
+      'OfficeVideoLogoInverse': '\uED7A'
+    }
+  };
+
+  registerIcons(subset, options);
+}
diff --git a/packages/icons/src/fabric-icons-5-inline.ts b/packages/icons/src/fabric-icons-5-inline.ts
deleted file mode 100644
index 399706134e442..0000000000000
--- a/packages/icons/src/fabric-icons-5-inline.ts
+++ /dev/null
@@ -1,120 +0,0 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-5"`,
-      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
-    },
-    icons: {
-      'SocialListeningLogo': '\uED7C',
-      'VisioLogoInverse': '\uED7D',
-      'Balloons': '\uED7E',
-      'Cat': '\uED7F',
-      'MailAlert': '\uED80',
-      'MailCheck': '\uED81',
-      'MailLowImportance': '\uED82',
-      'MailPause': '\uED83',
-      'MailRepeat': '\uED84',
-      'SecurityGroup': '\uED85',
-      'Table': '\uED86',
-      'VoicemailForward': '\uED87',
-      'VoicemailReply': '\uED88',
-      'Waffle': '\uED89',
-      'RemoveEvent': '\uED8A',
-      'EventInfo': '\uED8B',
-      'ForwardEvent': '\uED8C',
-      'WipePhone': '\uED8D',
-      'AddOnlineMeeting': '\uED8E',
-      'JoinOnlineMeeting': '\uED8F',
-      'RemoveLink': '\uED90',
-      'PeopleBlock': '\uED91',
-      'PeopleRepeat': '\uED92',
-      'PeopleAlert': '\uED93',
-      'PeoplePause': '\uED94',
-      'TransferCall': '\uED95',
-      'AddPhone': '\uED96',
-      'UnknownCall': '\uED97',
-      'NoteReply': '\uED98',
-      'NoteForward': '\uED99',
-      'NotePinned': '\uED9A',
-      'RemoveOccurrence': '\uED9B',
-      'Timeline': '\uED9C',
-      'EditNote': '\uED9D',
-      'CircleHalfFull': '\uED9E',
-      'Room': '\uED9F',
-      'Unsubscribe': '\uEDA0',
-      'Subscribe': '\uEDA1',
-      'RecurringTask': '\uEDB2',
-      'TaskManager': '\uEDB7',
-      'TaskManagerMirrored': '\uEDB8',
-      'Combine': '\uEDBB',
-      'Split': '\uEDBC',
-      'DoubleChevronUp': '\uEDBD',
-      'DoubleChevronLeft': '\uEDBE',
-      'DoubleChevronRight': '\uEDBF',
-      'TextBox': '\uEDC2',
-      'TextField': '\uEDC3',
-      'NumberField': '\uEDC4',
-      'Dropdown': '\uEDC5',
-      'BookingsLogo': '\uEDC7',
-      'ClassNotebookLogoInverse': '\uEDC8',
-      'DelveAnalyticsLogo': '\uEDCA',
-      'DocsLogoInverse': '\uEDCB',
-      'Dynamics365Logo': '\uEDCC',
-      'DynamicSMBLogo': '\uEDCD',
-      'OfficeAssistantLogo': '\uEDCE',
-      'OfficeStoreLogo': '\uEDCF',
-      'OneNoteEduLogoInverse': '\uEDD0',
-      'PlannerLogo': '\uEDD1',
-      'PowerApps': '\uEDD2',
-      'Suitcase': '\uEDD3',
-      'ProjectLogoInverse': '\uEDD4',
-      'CaretLeft8': '\uEDD5',
-      'CaretRight8': '\uEDD6',
-      'CaretUp8': '\uEDD7',
-      'CaretDown8': '\uEDD8',
-      'CaretLeftSolid8': '\uEDD9',
-      'CaretRightSolid8': '\uEDDA',
-      'CaretUpSolid8': '\uEDDB',
-      'CaretDownSolid8': '\uEDDC',
-      'ClearFormatting': '\uEDDD',
-      'Superscript': '\uEDDE',
-      'Subscript': '\uEDDF',
-      'Strikethrough': '\uEDE0',
-      'Export': '\uEDE1',
-      'ExportMirrored': '\uEDE2',
-      'SingleBookmark': '\uEDFF',
-      'DoubleChevronDown': '\uEE04',
-      'ReplyAll': '\uEE0A',
-      'Questionnaire': '\uEE19',
-      'ReplyMirrored': '\uEE35',
-      'ReplyAllMirrored': '\uEE36',
-      'AddGroup': '\uEE3D',
-      'QuestionnaireMirrored': '\uEE4B',
-      'TemporaryUser': '\uEE58',
-      'CaretSolid16': '\uEE62',
-      'GroupedDescending': '\uEE66',
-      'GroupedAscending': '\uEE67',
-      'AwayStatus': '\uEE6A',
-      'MyMoviesTV': '\uEE6C',
-      'AustralianRules': '\uEE70',
-      'WifiEthernet': '\uEE77',
-      'DateTimeMirrored': '\uEE93',
-      'StopSolid': '\uEE95',
-      'DoubleChevronUp12': '\uEE96',
-      'DoubleChevronDown12': '\uEE97',
-      'DoubleChevronLeft12': '\uEE98',
-      'DoubleChevronRight12': '\uEE99'
-    }
-  });
-}
diff --git a/packages/icons/src/fabric-icons-5.ts b/packages/icons/src/fabric-icons-5.ts
index e41ce2e610332..5e70202830ba0 100644
--- a/packages/icons/src/fabric-icons-5.ts
+++ b/packages/icons/src/fabric-icons-5.ts
@@ -1,120 +1,129 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-5"`,
-      src: `url('${baseUrl}fabric-icons-5-5bc71068.woff') format('woff')`, 
-    },
-    icons: {
-      'SocialListeningLogo': '\uED7C',
-      'VisioLogoInverse': '\uED7D',
-      'Balloons': '\uED7E',
-      'Cat': '\uED7F',
-      'MailAlert': '\uED80',
-      'MailCheck': '\uED81',
-      'MailLowImportance': '\uED82',
-      'MailPause': '\uED83',
-      'MailRepeat': '\uED84',
-      'SecurityGroup': '\uED85',
-      'Table': '\uED86',
-      'VoicemailForward': '\uED87',
-      'VoicemailReply': '\uED88',
-      'Waffle': '\uED89',
-      'RemoveEvent': '\uED8A',
-      'EventInfo': '\uED8B',
-      'ForwardEvent': '\uED8C',
-      'WipePhone': '\uED8D',
-      'AddOnlineMeeting': '\uED8E',
-      'JoinOnlineMeeting': '\uED8F',
-      'RemoveLink': '\uED90',
-      'PeopleBlock': '\uED91',
-      'PeopleRepeat': '\uED92',
-      'PeopleAlert': '\uED93',
-      'PeoplePause': '\uED94',
-      'TransferCall': '\uED95',
-      'AddPhone': '\uED96',
-      'UnknownCall': '\uED97',
-      'NoteReply': '\uED98',
-      'NoteForward': '\uED99',
-      'NotePinned': '\uED9A',
-      'RemoveOccurrence': '\uED9B',
-      'Timeline': '\uED9C',
-      'EditNote': '\uED9D',
-      'CircleHalfFull': '\uED9E',
-      'Room': '\uED9F',
-      'Unsubscribe': '\uEDA0',
-      'Subscribe': '\uEDA1',
-      'RecurringTask': '\uEDB2',
-      'TaskManager': '\uEDB7',
-      'TaskManagerMirrored': '\uEDB8',
-      'Combine': '\uEDBB',
-      'Split': '\uEDBC',
-      'DoubleChevronUp': '\uEDBD',
-      'DoubleChevronLeft': '\uEDBE',
-      'DoubleChevronRight': '\uEDBF',
-      'TextBox': '\uEDC2',
-      'TextField': '\uEDC3',
-      'NumberField': '\uEDC4',
-      'Dropdown': '\uEDC5',
-      'BookingsLogo': '\uEDC7',
-      'ClassNotebookLogoInverse': '\uEDC8',
-      'DelveAnalyticsLogo': '\uEDCA',
-      'DocsLogoInverse': '\uEDCB',
-      'Dynamics365Logo': '\uEDCC',
-      'DynamicSMBLogo': '\uEDCD',
-      'OfficeAssistantLogo': '\uEDCE',
-      'OfficeStoreLogo': '\uEDCF',
-      'OneNoteEduLogoInverse': '\uEDD0',
-      'PlannerLogo': '\uEDD1',
-      'PowerApps': '\uEDD2',
-      'Suitcase': '\uEDD3',
-      'ProjectLogoInverse': '\uEDD4',
-      'CaretLeft8': '\uEDD5',
-      'CaretRight8': '\uEDD6',
-      'CaretUp8': '\uEDD7',
-      'CaretDown8': '\uEDD8',
-      'CaretLeftSolid8': '\uEDD9',
-      'CaretRightSolid8': '\uEDDA',
-      'CaretUpSolid8': '\uEDDB',
-      'CaretDownSolid8': '\uEDDC',
-      'ClearFormatting': '\uEDDD',
-      'Superscript': '\uEDDE',
-      'Subscript': '\uEDDF',
-      'Strikethrough': '\uEDE0',
-      'Export': '\uEDE1',
-      'ExportMirrored': '\uEDE2',
-      'SingleBookmark': '\uEDFF',
-      'DoubleChevronDown': '\uEE04',
-      'ReplyAll': '\uEE0A',
-      'Questionnaire': '\uEE19',
-      'ReplyMirrored': '\uEE35',
-      'ReplyAllMirrored': '\uEE36',
-      'AddGroup': '\uEE3D',
-      'QuestionnaireMirrored': '\uEE4B',
-      'TemporaryUser': '\uEE58',
-      'CaretSolid16': '\uEE62',
-      'GroupedDescending': '\uEE66',
-      'GroupedAscending': '\uEE67',
-      'AwayStatus': '\uEE6A',
-      'MyMoviesTV': '\uEE6C',
-      'AustralianRules': '\uEE70',
-      'WifiEthernet': '\uEE77',
-      'DateTimeMirrored': '\uEE93',
-      'StopSolid': '\uEE95',
-      'DoubleChevronUp12': '\uEE96',
-      'DoubleChevronDown12': '\uEE97',
-      'DoubleChevronLeft12': '\uEE98',
-      'DoubleChevronRight12': '\uEE99'
-    }
-  });
-}
+// tslint:disable:max-line-length
+
+import {
+  IIconOptions,
+  IIconSubset,
+  registerIcons
+} from '@uifabric/styling/lib/index';
+
+export function initializeIcons(
+  baseUrl: string = '',
+  options?: IIconOptions
+): void {
+  const subset: IIconSubset = {
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-5"`,
+      src: `url('${baseUrl}fabric-icons-5-5bc71068.woff') format('woff')`, 
+    },
+    icons: {
+      'SocialListeningLogo': '\uED7C',
+      'VisioLogoInverse': '\uED7D',
+      'Balloons': '\uED7E',
+      'Cat': '\uED7F',
+      'MailAlert': '\uED80',
+      'MailCheck': '\uED81',
+      'MailLowImportance': '\uED82',
+      'MailPause': '\uED83',
+      'MailRepeat': '\uED84',
+      'SecurityGroup': '\uED85',
+      'Table': '\uED86',
+      'VoicemailForward': '\uED87',
+      'VoicemailReply': '\uED88',
+      'Waffle': '\uED89',
+      'RemoveEvent': '\uED8A',
+      'EventInfo': '\uED8B',
+      'ForwardEvent': '\uED8C',
+      'WipePhone': '\uED8D',
+      'AddOnlineMeeting': '\uED8E',
+      'JoinOnlineMeeting': '\uED8F',
+      'RemoveLink': '\uED90',
+      'PeopleBlock': '\uED91',
+      'PeopleRepeat': '\uED92',
+      'PeopleAlert': '\uED93',
+      'PeoplePause': '\uED94',
+      'TransferCall': '\uED95',
+      'AddPhone': '\uED96',
+      'UnknownCall': '\uED97',
+      'NoteReply': '\uED98',
+      'NoteForward': '\uED99',
+      'NotePinned': '\uED9A',
+      'RemoveOccurrence': '\uED9B',
+      'Timeline': '\uED9C',
+      'EditNote': '\uED9D',
+      'CircleHalfFull': '\uED9E',
+      'Room': '\uED9F',
+      'Unsubscribe': '\uEDA0',
+      'Subscribe': '\uEDA1',
+      'RecurringTask': '\uEDB2',
+      'TaskManager': '\uEDB7',
+      'TaskManagerMirrored': '\uEDB8',
+      'Combine': '\uEDBB',
+      'Split': '\uEDBC',
+      'DoubleChevronUp': '\uEDBD',
+      'DoubleChevronLeft': '\uEDBE',
+      'DoubleChevronRight': '\uEDBF',
+      'TextBox': '\uEDC2',
+      'TextField': '\uEDC3',
+      'NumberField': '\uEDC4',
+      'Dropdown': '\uEDC5',
+      'BookingsLogo': '\uEDC7',
+      'ClassNotebookLogoInverse': '\uEDC8',
+      'DelveAnalyticsLogo': '\uEDCA',
+      'DocsLogoInverse': '\uEDCB',
+      'Dynamics365Logo': '\uEDCC',
+      'DynamicSMBLogo': '\uEDCD',
+      'OfficeAssistantLogo': '\uEDCE',
+      'OfficeStoreLogo': '\uEDCF',
+      'OneNoteEduLogoInverse': '\uEDD0',
+      'PlannerLogo': '\uEDD1',
+      'PowerApps': '\uEDD2',
+      'Suitcase': '\uEDD3',
+      'ProjectLogoInverse': '\uEDD4',
+      'CaretLeft8': '\uEDD5',
+      'CaretRight8': '\uEDD6',
+      'CaretUp8': '\uEDD7',
+      'CaretDown8': '\uEDD8',
+      'CaretLeftSolid8': '\uEDD9',
+      'CaretRightSolid8': '\uEDDA',
+      'CaretUpSolid8': '\uEDDB',
+      'CaretDownSolid8': '\uEDDC',
+      'ClearFormatting': '\uEDDD',
+      'Superscript': '\uEDDE',
+      'Subscript': '\uEDDF',
+      'Strikethrough': '\uEDE0',
+      'Export': '\uEDE1',
+      'ExportMirrored': '\uEDE2',
+      'SingleBookmark': '\uEDFF',
+      'DoubleChevronDown': '\uEE04',
+      'ReplyAll': '\uEE0A',
+      'Questionnaire': '\uEE19',
+      'ReplyMirrored': '\uEE35',
+      'ReplyAllMirrored': '\uEE36',
+      'AddGroup': '\uEE3D',
+      'QuestionnaireMirrored': '\uEE4B',
+      'TemporaryUser': '\uEE58',
+      'CaretSolid16': '\uEE62',
+      'GroupedDescending': '\uEE66',
+      'GroupedAscending': '\uEE67',
+      'AwayStatus': '\uEE6A',
+      'MyMoviesTV': '\uEE6C',
+      'AustralianRules': '\uEE70',
+      'WifiEthernet': '\uEE77',
+      'DateTimeMirrored': '\uEE93',
+      'StopSolid': '\uEE95',
+      'DoubleChevronUp12': '\uEE96',
+      'DoubleChevronDown12': '\uEE97',
+      'DoubleChevronLeft12': '\uEE98',
+      'DoubleChevronRight12': '\uEE99'
+    }
+  };
+
+  registerIcons(subset, options);
+}
diff --git a/packages/icons/src/fabric-icons-6-inline.ts b/packages/icons/src/fabric-icons-6-inline.ts
deleted file mode 100644
index 065ca23d3a5ff..0000000000000
--- a/packages/icons/src/fabric-icons-6-inline.ts
+++ /dev/null
@@ -1,119 +0,0 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-6"`,
-      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
-    },
-    icons: {
-      'CalendarAgenda': '\uEE9A',
-      'AddEvent': '\uEEB5',
-      'AssetLibrary': '\uEEB6',
-      'DataConnectionLibrary': '\uEEB7',
-      'DocLibrary': '\uEEB8',
-      'FormLibrary': '\uEEB9',
-      'FormLibraryMirrored': '\uEEBA',
-      'ReportLibrary': '\uEEBB',
-      'ReportLibraryMirrored': '\uEEBC',
-      'ContactCard': '\uEEBD',
-      'CustomList': '\uEEBE',
-      'CustomListMirrored': '\uEEBF',
-      'IssueTracking': '\uEEC0',
-      'IssueTrackingMirrored': '\uEEC1',
-      'PictureLibrary': '\uEEC2',
-      'OfficeAddinsLogo': '\uEEC7',
-      'OfflineOneDriveParachute': '\uEEC8',
-      'OfflineOneDriveParachuteDisabled': '\uEEC9',
-      'TriangleSolidUp12': '\uEECC',
-      'TriangleSolidDown12': '\uEECD',
-      'TriangleSolidLeft12': '\uEECE',
-      'TriangleSolidRight12': '\uEECF',
-      'TriangleUp12': '\uEED0',
-      'TriangleDown12': '\uEED1',
-      'TriangleLeft12': '\uEED2',
-      'TriangleRight12': '\uEED3',
-      'ArrowUpRight8': '\uEED4',
-      'ArrowDownRight8': '\uEED5',
-      'DocumentSet': '\uEED6',
-      'DelveAnalytics': '\uEEEE',
-      'ArrowUpRightMirrored8': '\uEEEF',
-      'ArrowDownRightMirrored8': '\uEEF0',
-      'OneDriveAdd': '\uEF32',
-      'Header2': '\uEF36',
-      'Header3': '\uEF37',
-      'Header4': '\uEF38',
-      'MarketDown': '\uEF42',
-      'CalendarWorkWeek': '\uEF51',
-      'SidePanel': '\uEF52',
-      'GlobeFavorite': '\uEF53',
-      'CaretTopLeftSolid8': '\uEF54',
-      'CaretTopRightSolid8': '\uEF55',
-      'ViewAll2': '\uEF56',
-      'DocumentReply': '\uEF57',
-      'PlayerSettings': '\uEF58',
-      'ReceiptForward': '\uEF59',
-      'ReceiptReply': '\uEF5A',
-      'ReceiptCheck': '\uEF5B',
-      'Fax': '\uEF5C',
-      'RecurringEvent': '\uEF5D',
-      'ReplyAlt': '\uEF5E',
-      'ReplyAllAlt': '\uEF5F',
-      'EditStyle': '\uEF60',
-      'EditMail': '\uEF61',
-      'Lifesaver': '\uEF62',
-      'LifesaverLock': '\uEF63',
-      'InboxCheck': '\uEF64',
-      'FolderSearch': '\uEF65',
-      'CollapseMenu': '\uEF66',
-      'ExpandMenu': '\uEF67',
-      'Boards': '\uEF68',
-      'SunAdd': '\uEF69',
-      'SunQuestionMark': '\uEF6A',
-      'LandscapeOrientation': '\uEF6B',
-      'DocumentSearch': '\uEF6C',
-      'PublicCalendar': '\uEF6D',
-      'PublicContactCard': '\uEF6E',
-      'PublicEmail': '\uEF6F',
-      'PublicFolder': '\uEF70',
-      'WordDocument': '\uEF71',
-      'PowerPointDocument': '\uEF72',
-      'ExcelDocument': '\uEF73',
-      'GroupedList': '\uEF74',
-      'ClassroomLogo': '\uEF75',
-      'Sections': '\uEF76',
-      'EditPhoto': '\uEF77',
-      'Starburst': '\uEF78',
-      'ShareiOS': '\uEF79',
-      'AirTickets': '\uEF7A',
-      'PencilReply': '\uEF7B',
-      'Tiles2': '\uEF7C',
-      'SkypeCircleCheck': '\uEF7D',
-      'SkypeCircleClock': '\uEF7E',
-      'SkypeCircleMinus': '\uEF7F',
-      'SkypeMessage': '\uEF83',
-      'ClosedCaption': '\uEF84',
-      'ATPLogo': '\uEF85',
-      'OfficeFormsLogoInverse': '\uEF86',
-      'RecycleBin': '\uEF87',
-      'EmptyRecycleBin': '\uEF88',
-      'Hide2': '\uEF89',
-      'Breadcrumb': '\uEF8C',
-      'PageEdit': '\uEFB6',
-      'Database': '\uEFC7',
-      'DocumentManagement': '\uEFFC',
-      'CRMReport': '\uEFFE',
-      'ZipFolder': '\uF012',
-      'TextDocument': '\uF029'
-    }
-  });
-}
diff --git a/packages/icons/src/fabric-icons-6.ts b/packages/icons/src/fabric-icons-6.ts
index 3b7c283f98d16..2fb007fa8bc5d 100644
--- a/packages/icons/src/fabric-icons-6.ts
+++ b/packages/icons/src/fabric-icons-6.ts
@@ -1,119 +1,128 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-6"`,
-      src: `url('${baseUrl}fabric-icons-6-328cd253.woff') format('woff')`, 
-    },
-    icons: {
-      'CalendarAgenda': '\uEE9A',
-      'AddEvent': '\uEEB5',
-      'AssetLibrary': '\uEEB6',
-      'DataConnectionLibrary': '\uEEB7',
-      'DocLibrary': '\uEEB8',
-      'FormLibrary': '\uEEB9',
-      'FormLibraryMirrored': '\uEEBA',
-      'ReportLibrary': '\uEEBB',
-      'ReportLibraryMirrored': '\uEEBC',
-      'ContactCard': '\uEEBD',
-      'CustomList': '\uEEBE',
-      'CustomListMirrored': '\uEEBF',
-      'IssueTracking': '\uEEC0',
-      'IssueTrackingMirrored': '\uEEC1',
-      'PictureLibrary': '\uEEC2',
-      'OfficeAddinsLogo': '\uEEC7',
-      'OfflineOneDriveParachute': '\uEEC8',
-      'OfflineOneDriveParachuteDisabled': '\uEEC9',
-      'TriangleSolidUp12': '\uEECC',
-      'TriangleSolidDown12': '\uEECD',
-      'TriangleSolidLeft12': '\uEECE',
-      'TriangleSolidRight12': '\uEECF',
-      'TriangleUp12': '\uEED0',
-      'TriangleDown12': '\uEED1',
-      'TriangleLeft12': '\uEED2',
-      'TriangleRight12': '\uEED3',
-      'ArrowUpRight8': '\uEED4',
-      'ArrowDownRight8': '\uEED5',
-      'DocumentSet': '\uEED6',
-      'DelveAnalytics': '\uEEEE',
-      'ArrowUpRightMirrored8': '\uEEEF',
-      'ArrowDownRightMirrored8': '\uEEF0',
-      'OneDriveAdd': '\uEF32',
-      'Header2': '\uEF36',
-      'Header3': '\uEF37',
-      'Header4': '\uEF38',
-      'MarketDown': '\uEF42',
-      'CalendarWorkWeek': '\uEF51',
-      'SidePanel': '\uEF52',
-      'GlobeFavorite': '\uEF53',
-      'CaretTopLeftSolid8': '\uEF54',
-      'CaretTopRightSolid8': '\uEF55',
-      'ViewAll2': '\uEF56',
-      'DocumentReply': '\uEF57',
-      'PlayerSettings': '\uEF58',
-      'ReceiptForward': '\uEF59',
-      'ReceiptReply': '\uEF5A',
-      'ReceiptCheck': '\uEF5B',
-      'Fax': '\uEF5C',
-      'RecurringEvent': '\uEF5D',
-      'ReplyAlt': '\uEF5E',
-      'ReplyAllAlt': '\uEF5F',
-      'EditStyle': '\uEF60',
-      'EditMail': '\uEF61',
-      'Lifesaver': '\uEF62',
-      'LifesaverLock': '\uEF63',
-      'InboxCheck': '\uEF64',
-      'FolderSearch': '\uEF65',
-      'CollapseMenu': '\uEF66',
-      'ExpandMenu': '\uEF67',
-      'Boards': '\uEF68',
-      'SunAdd': '\uEF69',
-      'SunQuestionMark': '\uEF6A',
-      'LandscapeOrientation': '\uEF6B',
-      'DocumentSearch': '\uEF6C',
-      'PublicCalendar': '\uEF6D',
-      'PublicContactCard': '\uEF6E',
-      'PublicEmail': '\uEF6F',
-      'PublicFolder': '\uEF70',
-      'WordDocument': '\uEF71',
-      'PowerPointDocument': '\uEF72',
-      'ExcelDocument': '\uEF73',
-      'GroupedList': '\uEF74',
-      'ClassroomLogo': '\uEF75',
-      'Sections': '\uEF76',
-      'EditPhoto': '\uEF77',
-      'Starburst': '\uEF78',
-      'ShareiOS': '\uEF79',
-      'AirTickets': '\uEF7A',
-      'PencilReply': '\uEF7B',
-      'Tiles2': '\uEF7C',
-      'SkypeCircleCheck': '\uEF7D',
-      'SkypeCircleClock': '\uEF7E',
-      'SkypeCircleMinus': '\uEF7F',
-      'SkypeMessage': '\uEF83',
-      'ClosedCaption': '\uEF84',
-      'ATPLogo': '\uEF85',
-      'OfficeFormsLogoInverse': '\uEF86',
-      'RecycleBin': '\uEF87',
-      'EmptyRecycleBin': '\uEF88',
-      'Hide2': '\uEF89',
-      'Breadcrumb': '\uEF8C',
-      'PageEdit': '\uEFB6',
-      'Database': '\uEFC7',
-      'DocumentManagement': '\uEFFC',
-      'CRMReport': '\uEFFE',
-      'ZipFolder': '\uF012',
-      'TextDocument': '\uF029'
-    }
-  });
-}
+// tslint:disable:max-line-length
+
+import {
+  IIconOptions,
+  IIconSubset,
+  registerIcons
+} from '@uifabric/styling/lib/index';
+
+export function initializeIcons(
+  baseUrl: string = '',
+  options?: IIconOptions
+): void {
+  const subset: IIconSubset = {
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-6"`,
+      src: `url('${baseUrl}fabric-icons-6-328cd253.woff') format('woff')`, 
+    },
+    icons: {
+      'CalendarAgenda': '\uEE9A',
+      'AddEvent': '\uEEB5',
+      'AssetLibrary': '\uEEB6',
+      'DataConnectionLibrary': '\uEEB7',
+      'DocLibrary': '\uEEB8',
+      'FormLibrary': '\uEEB9',
+      'FormLibraryMirrored': '\uEEBA',
+      'ReportLibrary': '\uEEBB',
+      'ReportLibraryMirrored': '\uEEBC',
+      'ContactCard': '\uEEBD',
+      'CustomList': '\uEEBE',
+      'CustomListMirrored': '\uEEBF',
+      'IssueTracking': '\uEEC0',
+      'IssueTrackingMirrored': '\uEEC1',
+      'PictureLibrary': '\uEEC2',
+      'OfficeAddinsLogo': '\uEEC7',
+      'OfflineOneDriveParachute': '\uEEC8',
+      'OfflineOneDriveParachuteDisabled': '\uEEC9',
+      'TriangleSolidUp12': '\uEECC',
+      'TriangleSolidDown12': '\uEECD',
+      'TriangleSolidLeft12': '\uEECE',
+      'TriangleSolidRight12': '\uEECF',
+      'TriangleUp12': '\uEED0',
+      'TriangleDown12': '\uEED1',
+      'TriangleLeft12': '\uEED2',
+      'TriangleRight12': '\uEED3',
+      'ArrowUpRight8': '\uEED4',
+      'ArrowDownRight8': '\uEED5',
+      'DocumentSet': '\uEED6',
+      'DelveAnalytics': '\uEEEE',
+      'ArrowUpRightMirrored8': '\uEEEF',
+      'ArrowDownRightMirrored8': '\uEEF0',
+      'OneDriveAdd': '\uEF32',
+      'Header2': '\uEF36',
+      'Header3': '\uEF37',
+      'Header4': '\uEF38',
+      'MarketDown': '\uEF42',
+      'CalendarWorkWeek': '\uEF51',
+      'SidePanel': '\uEF52',
+      'GlobeFavorite': '\uEF53',
+      'CaretTopLeftSolid8': '\uEF54',
+      'CaretTopRightSolid8': '\uEF55',
+      'ViewAll2': '\uEF56',
+      'DocumentReply': '\uEF57',
+      'PlayerSettings': '\uEF58',
+      'ReceiptForward': '\uEF59',
+      'ReceiptReply': '\uEF5A',
+      'ReceiptCheck': '\uEF5B',
+      'Fax': '\uEF5C',
+      'RecurringEvent': '\uEF5D',
+      'ReplyAlt': '\uEF5E',
+      'ReplyAllAlt': '\uEF5F',
+      'EditStyle': '\uEF60',
+      'EditMail': '\uEF61',
+      'Lifesaver': '\uEF62',
+      'LifesaverLock': '\uEF63',
+      'InboxCheck': '\uEF64',
+      'FolderSearch': '\uEF65',
+      'CollapseMenu': '\uEF66',
+      'ExpandMenu': '\uEF67',
+      'Boards': '\uEF68',
+      'SunAdd': '\uEF69',
+      'SunQuestionMark': '\uEF6A',
+      'LandscapeOrientation': '\uEF6B',
+      'DocumentSearch': '\uEF6C',
+      'PublicCalendar': '\uEF6D',
+      'PublicContactCard': '\uEF6E',
+      'PublicEmail': '\uEF6F',
+      'PublicFolder': '\uEF70',
+      'WordDocument': '\uEF71',
+      'PowerPointDocument': '\uEF72',
+      'ExcelDocument': '\uEF73',
+      'GroupedList': '\uEF74',
+      'ClassroomLogo': '\uEF75',
+      'Sections': '\uEF76',
+      'EditPhoto': '\uEF77',
+      'Starburst': '\uEF78',
+      'ShareiOS': '\uEF79',
+      'AirTickets': '\uEF7A',
+      'PencilReply': '\uEF7B',
+      'Tiles2': '\uEF7C',
+      'SkypeCircleCheck': '\uEF7D',
+      'SkypeCircleClock': '\uEF7E',
+      'SkypeCircleMinus': '\uEF7F',
+      'SkypeMessage': '\uEF83',
+      'ClosedCaption': '\uEF84',
+      'ATPLogo': '\uEF85',
+      'OfficeFormsLogoInverse': '\uEF86',
+      'RecycleBin': '\uEF87',
+      'EmptyRecycleBin': '\uEF88',
+      'Hide2': '\uEF89',
+      'Breadcrumb': '\uEF8C',
+      'PageEdit': '\uEFB6',
+      'Database': '\uEFC7',
+      'DocumentManagement': '\uEFFC',
+      'CRMReport': '\uEFFE',
+      'ZipFolder': '\uF012',
+      'TextDocument': '\uF029'
+    }
+  };
+
+  registerIcons(subset, options);
+}
diff --git a/packages/icons/src/fabric-icons-7-inline.ts b/packages/icons/src/fabric-icons-7-inline.ts
deleted file mode 100644
index fd2079f9fb075..0000000000000
--- a/packages/icons/src/fabric-icons-7-inline.ts
+++ /dev/null
@@ -1,121 +0,0 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-7"`,
-      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
-    },
-    icons: {
-      'PageCheckedOut': '\uF02C',
-      'SaveAndClose': '\uF038',
-      'Script': '\uF03A',
-      'Archive': '\uF03F',
-      'ActivityFeed': '\uF056',
-      'EventDate': '\uF059',
-      'CaretRight': '\uF06B',
-      'SetAction': '\uF071',
-      'CaretSolidLeft': '\uF08D',
-      'CaretSolidDown': '\uF08E',
-      'CaretSolidRight': '\uF08F',
-      'CaretSolidUp': '\uF090',
-      'PowerAppsLogo': '\uF091',
-      'PowerApps2Logo': '\uF092',
-      'SearchIssue': '\uF09A',
-      'SearchIssueMirrored': '\uF09B',
-      'FabricAssetLibrary': '\uF09C',
-      'FabricDataConnectionLibrary': '\uF09D',
-      'FabricDocLibrary': '\uF09E',
-      'FabricFormLibrary': '\uF09F',
-      'FabricFormLibraryMirrored': '\uF0A0',
-      'FabricReportLibrary': '\uF0A1',
-      'FabricReportLibraryMirrored': '\uF0A2',
-      'FabricPublicFolder': '\uF0A3',
-      'FabricFolderSearch': '\uF0A4',
-      'FabricMovetoFolder': '\uF0A5',
-      'FabricUnsyncFolder': '\uF0A6',
-      'FabricSyncFolder': '\uF0A7',
-      'FabricOpenFolderHorizontal': '\uF0A8',
-      'FabricFolder': '\uF0A9',
-      'FabricFolderFill': '\uF0AA',
-      'FabricNewFolder': '\uF0AB',
-      'FabricPictureLibrary': '\uF0AC',
-      'AddFavorite': '\uF0C8',
-      'AddFavoriteFill': '\uF0C9',
-      'BufferTimeBefore': '\uF0CF',
-      'BufferTimeAfter': '\uF0D0',
-      'BufferTimeBoth': '\uF0D1',
-      'CannedChat': '\uF0F2',
-      'SkypeForBusinessLogo': '\uF0FC',
-      'PageCheckedin': '\uF104',
-      'CaretBottomLeftSolid8': '\uF121',
-      'CaretBottomRightSolid8': '\uF122',
-      'FolderHorizontal': '\uF12B',
-      'MicrosoftStaffhubLogo': '\uF130',
-      'GiftboxOpen': '\uF133',
-      'StatusCircleOuter': '\uF136',
-      'StatusCircleInner': '\uF137',
-      'ExploreContentSingle': '\uF164',
-      'CollapseContent': '\uF165',
-      'CollapseContentSingle': '\uF166',
-      'InfoSolid': '\uF167',
-      'ProgressRingDots': '\uF16A',
-      'CaloriesAdd': '\uF172',
-      'BranchFork': '\uF173',
-      'HardDriveGroup': '\uF18F',
-      'BucketColor': '\uF1B6',
-      'BucketColorFill': '\uF1B7',
-      'Taskboard': '\uF1C2',
-      'SingleColumn': '\uF1D3',
-      'DoubleColumn': '\uF1D4',
-      'TripleColumn': '\uF1D5',
-      'ColumnLeftTwoThirds': '\uF1D6',
-      'ColumnRightTwoThirds': '\uF1D7',
-      'AccessLogoFill': '\uF1DB',
-      'AnalyticsLogo': '\uF1DE',
-      'AnalyticsQuery': '\uF1DF',
-      'NewAnalyticsQuery': '\uF1E0',
-      'AnalyticsReport': '\uF1E1',
-      'WordLogo': '\uF1E3',
-      'WordLogoFill': '\uF1E4',
-      'ExcelLogo': '\uF1E5',
-      'ExcelLogoFill': '\uF1E6',
-      'OneNoteLogo': '\uF1E7',
-      'OneNoteLogoFill': '\uF1E8',
-      'OutlookLogo': '\uF1E9',
-      'OutlookLogoFill': '\uF1EA',
-      'PowerPointLogo': '\uF1EB',
-      'PowerPointLogoFill': '\uF1EC',
-      'PublisherLogo': '\uF1ED',
-      'PublisherLogoFill': '\uF1EE',
-      'ScheduleEventAction': '\uF1EF',
-      'FlameSolid': '\uF1F3',
-      'ServerProcesses': '\uF1FE',
-      'Server': '\uF201',
-      'SaveAll': '\uF203',
-      'LinkedInLogo': '\uF20A',
-      'SidePanelMirrored': '\uF221',
-      'ProtectRestrict': '\uF22A',
-      'GridViewSmall': '\uF232',
-      'GridViewMedium': '\uF233',
-      'GridViewLarge': '\uF234',
-      'Step': '\uF241',
-      'StepInsert': '\uF242',
-      'StepShared': '\uF243',
-      'StepSharedAdd': '\uF244',
-      'StepSharedInsert': '\uF245',
-      'ViewDashboard': '\uF246',
-      'ViewList': '\uF247',
-      'ViewListGroup': '\uF248'
-    }
-  });
-}
diff --git a/packages/icons/src/fabric-icons-7.ts b/packages/icons/src/fabric-icons-7.ts
index 299076dfbf585..0ceb925c52777 100644
--- a/packages/icons/src/fabric-icons-7.ts
+++ b/packages/icons/src/fabric-icons-7.ts
@@ -1,121 +1,130 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-7"`,
-      src: `url('${baseUrl}fabric-icons-7-1bae3315.woff') format('woff')`, 
-    },
-    icons: {
-      'PageCheckedOut': '\uF02C',
-      'SaveAndClose': '\uF038',
-      'Script': '\uF03A',
-      'Archive': '\uF03F',
-      'ActivityFeed': '\uF056',
-      'EventDate': '\uF059',
-      'CaretRight': '\uF06B',
-      'SetAction': '\uF071',
-      'CaretSolidLeft': '\uF08D',
-      'CaretSolidDown': '\uF08E',
-      'CaretSolidRight': '\uF08F',
-      'CaretSolidUp': '\uF090',
-      'PowerAppsLogo': '\uF091',
-      'PowerApps2Logo': '\uF092',
-      'SearchIssue': '\uF09A',
-      'SearchIssueMirrored': '\uF09B',
-      'FabricAssetLibrary': '\uF09C',
-      'FabricDataConnectionLibrary': '\uF09D',
-      'FabricDocLibrary': '\uF09E',
-      'FabricFormLibrary': '\uF09F',
-      'FabricFormLibraryMirrored': '\uF0A0',
-      'FabricReportLibrary': '\uF0A1',
-      'FabricReportLibraryMirrored': '\uF0A2',
-      'FabricPublicFolder': '\uF0A3',
-      'FabricFolderSearch': '\uF0A4',
-      'FabricMovetoFolder': '\uF0A5',
-      'FabricUnsyncFolder': '\uF0A6',
-      'FabricSyncFolder': '\uF0A7',
-      'FabricOpenFolderHorizontal': '\uF0A8',
-      'FabricFolder': '\uF0A9',
-      'FabricFolderFill': '\uF0AA',
-      'FabricNewFolder': '\uF0AB',
-      'FabricPictureLibrary': '\uF0AC',
-      'AddFavorite': '\uF0C8',
-      'AddFavoriteFill': '\uF0C9',
-      'BufferTimeBefore': '\uF0CF',
-      'BufferTimeAfter': '\uF0D0',
-      'BufferTimeBoth': '\uF0D1',
-      'CannedChat': '\uF0F2',
-      'SkypeForBusinessLogo': '\uF0FC',
-      'PageCheckedin': '\uF104',
-      'CaretBottomLeftSolid8': '\uF121',
-      'CaretBottomRightSolid8': '\uF122',
-      'FolderHorizontal': '\uF12B',
-      'MicrosoftStaffhubLogo': '\uF130',
-      'GiftboxOpen': '\uF133',
-      'StatusCircleOuter': '\uF136',
-      'StatusCircleInner': '\uF137',
-      'ExploreContentSingle': '\uF164',
-      'CollapseContent': '\uF165',
-      'CollapseContentSingle': '\uF166',
-      'InfoSolid': '\uF167',
-      'ProgressRingDots': '\uF16A',
-      'CaloriesAdd': '\uF172',
-      'BranchFork': '\uF173',
-      'HardDriveGroup': '\uF18F',
-      'BucketColor': '\uF1B6',
-      'BucketColorFill': '\uF1B7',
-      'Taskboard': '\uF1C2',
-      'SingleColumn': '\uF1D3',
-      'DoubleColumn': '\uF1D4',
-      'TripleColumn': '\uF1D5',
-      'ColumnLeftTwoThirds': '\uF1D6',
-      'ColumnRightTwoThirds': '\uF1D7',
-      'AccessLogoFill': '\uF1DB',
-      'AnalyticsLogo': '\uF1DE',
-      'AnalyticsQuery': '\uF1DF',
-      'NewAnalyticsQuery': '\uF1E0',
-      'AnalyticsReport': '\uF1E1',
-      'WordLogo': '\uF1E3',
-      'WordLogoFill': '\uF1E4',
-      'ExcelLogo': '\uF1E5',
-      'ExcelLogoFill': '\uF1E6',
-      'OneNoteLogo': '\uF1E7',
-      'OneNoteLogoFill': '\uF1E8',
-      'OutlookLogo': '\uF1E9',
-      'OutlookLogoFill': '\uF1EA',
-      'PowerPointLogo': '\uF1EB',
-      'PowerPointLogoFill': '\uF1EC',
-      'PublisherLogo': '\uF1ED',
-      'PublisherLogoFill': '\uF1EE',
-      'ScheduleEventAction': '\uF1EF',
-      'FlameSolid': '\uF1F3',
-      'ServerProcesses': '\uF1FE',
-      'Server': '\uF201',
-      'SaveAll': '\uF203',
-      'LinkedInLogo': '\uF20A',
-      'SidePanelMirrored': '\uF221',
-      'ProtectRestrict': '\uF22A',
-      'GridViewSmall': '\uF232',
-      'GridViewMedium': '\uF233',
-      'GridViewLarge': '\uF234',
-      'Step': '\uF241',
-      'StepInsert': '\uF242',
-      'StepShared': '\uF243',
-      'StepSharedAdd': '\uF244',
-      'StepSharedInsert': '\uF245',
-      'ViewDashboard': '\uF246',
-      'ViewList': '\uF247',
-      'ViewListGroup': '\uF248'
-    }
-  });
-}
+// tslint:disable:max-line-length
+
+import {
+  IIconOptions,
+  IIconSubset,
+  registerIcons
+} from '@uifabric/styling/lib/index';
+
+export function initializeIcons(
+  baseUrl: string = '',
+  options?: IIconOptions
+): void {
+  const subset: IIconSubset = {
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-7"`,
+      src: `url('${baseUrl}fabric-icons-7-1bae3315.woff') format('woff')`, 
+    },
+    icons: {
+      'PageCheckedOut': '\uF02C',
+      'SaveAndClose': '\uF038',
+      'Script': '\uF03A',
+      'Archive': '\uF03F',
+      'ActivityFeed': '\uF056',
+      'EventDate': '\uF059',
+      'CaretRight': '\uF06B',
+      'SetAction': '\uF071',
+      'CaretSolidLeft': '\uF08D',
+      'CaretSolidDown': '\uF08E',
+      'CaretSolidRight': '\uF08F',
+      'CaretSolidUp': '\uF090',
+      'PowerAppsLogo': '\uF091',
+      'PowerApps2Logo': '\uF092',
+      'SearchIssue': '\uF09A',
+      'SearchIssueMirrored': '\uF09B',
+      'FabricAssetLibrary': '\uF09C',
+      'FabricDataConnectionLibrary': '\uF09D',
+      'FabricDocLibrary': '\uF09E',
+      'FabricFormLibrary': '\uF09F',
+      'FabricFormLibraryMirrored': '\uF0A0',
+      'FabricReportLibrary': '\uF0A1',
+      'FabricReportLibraryMirrored': '\uF0A2',
+      'FabricPublicFolder': '\uF0A3',
+      'FabricFolderSearch': '\uF0A4',
+      'FabricMovetoFolder': '\uF0A5',
+      'FabricUnsyncFolder': '\uF0A6',
+      'FabricSyncFolder': '\uF0A7',
+      'FabricOpenFolderHorizontal': '\uF0A8',
+      'FabricFolder': '\uF0A9',
+      'FabricFolderFill': '\uF0AA',
+      'FabricNewFolder': '\uF0AB',
+      'FabricPictureLibrary': '\uF0AC',
+      'AddFavorite': '\uF0C8',
+      'AddFavoriteFill': '\uF0C9',
+      'BufferTimeBefore': '\uF0CF',
+      'BufferTimeAfter': '\uF0D0',
+      'BufferTimeBoth': '\uF0D1',
+      'CannedChat': '\uF0F2',
+      'SkypeForBusinessLogo': '\uF0FC',
+      'PageCheckedin': '\uF104',
+      'CaretBottomLeftSolid8': '\uF121',
+      'CaretBottomRightSolid8': '\uF122',
+      'FolderHorizontal': '\uF12B',
+      'MicrosoftStaffhubLogo': '\uF130',
+      'GiftboxOpen': '\uF133',
+      'StatusCircleOuter': '\uF136',
+      'StatusCircleInner': '\uF137',
+      'ExploreContentSingle': '\uF164',
+      'CollapseContent': '\uF165',
+      'CollapseContentSingle': '\uF166',
+      'InfoSolid': '\uF167',
+      'ProgressRingDots': '\uF16A',
+      'CaloriesAdd': '\uF172',
+      'BranchFork': '\uF173',
+      'HardDriveGroup': '\uF18F',
+      'BucketColor': '\uF1B6',
+      'BucketColorFill': '\uF1B7',
+      'Taskboard': '\uF1C2',
+      'SingleColumn': '\uF1D3',
+      'DoubleColumn': '\uF1D4',
+      'TripleColumn': '\uF1D5',
+      'ColumnLeftTwoThirds': '\uF1D6',
+      'ColumnRightTwoThirds': '\uF1D7',
+      'AccessLogoFill': '\uF1DB',
+      'AnalyticsLogo': '\uF1DE',
+      'AnalyticsQuery': '\uF1DF',
+      'NewAnalyticsQuery': '\uF1E0',
+      'AnalyticsReport': '\uF1E1',
+      'WordLogo': '\uF1E3',
+      'WordLogoFill': '\uF1E4',
+      'ExcelLogo': '\uF1E5',
+      'ExcelLogoFill': '\uF1E6',
+      'OneNoteLogo': '\uF1E7',
+      'OneNoteLogoFill': '\uF1E8',
+      'OutlookLogo': '\uF1E9',
+      'OutlookLogoFill': '\uF1EA',
+      'PowerPointLogo': '\uF1EB',
+      'PowerPointLogoFill': '\uF1EC',
+      'PublisherLogo': '\uF1ED',
+      'PublisherLogoFill': '\uF1EE',
+      'ScheduleEventAction': '\uF1EF',
+      'FlameSolid': '\uF1F3',
+      'ServerProcesses': '\uF1FE',
+      'Server': '\uF201',
+      'SaveAll': '\uF203',
+      'LinkedInLogo': '\uF20A',
+      'SidePanelMirrored': '\uF221',
+      'ProtectRestrict': '\uF22A',
+      'GridViewSmall': '\uF232',
+      'GridViewMedium': '\uF233',
+      'GridViewLarge': '\uF234',
+      'Step': '\uF241',
+      'StepInsert': '\uF242',
+      'StepShared': '\uF243',
+      'StepSharedAdd': '\uF244',
+      'StepSharedInsert': '\uF245',
+      'ViewDashboard': '\uF246',
+      'ViewList': '\uF247',
+      'ViewListGroup': '\uF248'
+    }
+  };
+
+  registerIcons(subset, options);
+}
diff --git a/packages/icons/src/fabric-icons-8-inline.ts b/packages/icons/src/fabric-icons-8-inline.ts
deleted file mode 100644
index 7323c3cfabf2a..0000000000000
--- a/packages/icons/src/fabric-icons-8-inline.ts
+++ /dev/null
@@ -1,121 +0,0 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-8"`,
-      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
-    },
-    icons: {
-      'ViewListTree': '\uF249',
-      'TriggerAuto': '\uF24A',
-      'TriggerUser': '\uF24B',
-      'PivotChart': '\uF24C',
-      'StackedBarChart': '\uF24D',
-      'StackedLineChart': '\uF24E',
-      'BuildQueue': '\uF24F',
-      'BuildQueueNew': '\uF250',
-      'UserFollowed': '\uF25C',
-      'VennDiagram': '\uF273',
-      'FiveTileGrid': '\uF274',
-      'FocalPoint': '\uF277',
-      'TeamsLogoInverse': '\uF27A',
-      'TeamsLogo': '\uF27B',
-      'TeamsLogoFill': '\uF27C',
-      'SkypeForBusinessLogoFill': '\uF27D',
-      'SharepointLogo': '\uF27E',
-      'SharepointLogoFill': '\uF27F',
-      'DelveLogo': '\uF280',
-      'DelveLogoFill': '\uF281',
-      'OfficeVideoLogo': '\uF282',
-      'OfficeVideoLogoFill': '\uF283',
-      'ExchangeLogo': '\uF284',
-      'ExchangeLogoFill': '\uF285',
-      'DocumentApproval': '\uF28B',
-      'CloneToDesktop': '\uF28C',
-      'InstallToDrive': '\uF28D',
-      'Blur': '\uF28E',
-      'Build': '\uF28F',
-      'ProcessMetaTask': '\uF290',
-      'BranchFork2': '\uF291',
-      'BranchLocked': '\uF292',
-      'BranchCommit': '\uF293',
-      'BranchCompare': '\uF294',
-      'BranchMerge': '\uF295',
-      'BranchPullRequest': '\uF296',
-      'BranchSearch': '\uF297',
-      'BranchShelveset': '\uF298',
-      'RawSource': '\uF299',
-      'MergeDuplicate': '\uF29A',
-      'RowsGroup': '\uF29B',
-      'RowsChild': '\uF29C',
-      'Deploy': '\uF29D',
-      'Redeploy': '\uF29E',
-      'ServerEnviroment': '\uF29F',
-      'Plug': '\uF300',
-      'PlugSolid': '\uF301',
-      'PlugConnected': '\uF302',
-      'PlugDisconnected': '\uF303',
-      'UnlockSolid': '\uF304',
-      'Variable': '\uF305',
-      'Parameter': '\uF306',
-      'CommentUrgent': '\uF307',
-      'Storyboard': '\uF308',
-      'DiffInline': '\uF309',
-      'DiffSideBySide': '\uF30A',
-      'ImageDiff': '\uF30B',
-      'ImagePixel': '\uF30C',
-      'FileBug': '\uF30D',
-      'FileCode': '\uF30E',
-      'FileComment': '\uF30F',
-      'FileImage': '\uF311',
-      'FileSymlink': '\uF312',
-      'AutoFillTemplate': '\uF313',
-      'WorkItem': '\uF314',
-      'WorkItemBug': '\uF315',
-      'LogRemove': '\uF316',
-      'ColumnOptions': '\uF317',
-      'Packages': '\uF318',
-      'BuildIssue': '\uF319',
-      'AssessmentGroup': '\uF31A',
-      'VariableGroup': '\uF31B',
-      'FullHistory': '\uF31C',
-      'BusinessHoursSign': '\uF310',
-      'VisioDiagram': '\uF2A0',
-      'HighlightMappedShapes': '\uF2A1',
-      'TextCallout': '\uF2A2',
-      'IconSetsFlag': '\uF2A4',
-      'VisioLogo': '\uF2A7',
-      'VisioLogoFill': '\uF2A8',
-      'VisioDocument': '\uF2A9',
-      'TimelineProgress': '\uF2AA',
-      'TimelineDelivery': '\uF2AB',
-      'Backlog': '\uF2AC',
-      'TeamFavorite': '\uF2AD',
-      'TaskGroup': '\uF2AE',
-      'TaskGroupMirrored': '\uF2AF',
-      'ScopeTemplate': '\uF2B0',
-      'AssessmentGroupTemplate': '\uF2B1',
-      'NewTeamProject': '\uF2B2',
-      'CommentAdd': '\uF2B3',
-      'CommentNext': '\uF2B4',
-      'CommentPrevious': '\uF2B5',
-      'ShopServer': '\uF2B6',
-      'LocaleLanguage': '\uF2B7',
-      'QueryList': '\uF2B8',
-      'UserSync': '\uF2B9',
-      'UserPause': '\uF2BA',
-      'StreamingOff': '\uF2BB',
-      'ArrowTallUpLeft': '\uF2BD'
-    }
-  });
-}
diff --git a/packages/icons/src/fabric-icons-8.ts b/packages/icons/src/fabric-icons-8.ts
index 9ce3c86581651..a9cf815c15991 100644
--- a/packages/icons/src/fabric-icons-8.ts
+++ b/packages/icons/src/fabric-icons-8.ts
@@ -1,121 +1,130 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-8"`,
-      src: `url('${baseUrl}fabric-icons-8-bf5c8e0c.woff') format('woff')`, 
-    },
-    icons: {
-      'ViewListTree': '\uF249',
-      'TriggerAuto': '\uF24A',
-      'TriggerUser': '\uF24B',
-      'PivotChart': '\uF24C',
-      'StackedBarChart': '\uF24D',
-      'StackedLineChart': '\uF24E',
-      'BuildQueue': '\uF24F',
-      'BuildQueueNew': '\uF250',
-      'UserFollowed': '\uF25C',
-      'VennDiagram': '\uF273',
-      'FiveTileGrid': '\uF274',
-      'FocalPoint': '\uF277',
-      'TeamsLogoInverse': '\uF27A',
-      'TeamsLogo': '\uF27B',
-      'TeamsLogoFill': '\uF27C',
-      'SkypeForBusinessLogoFill': '\uF27D',
-      'SharepointLogo': '\uF27E',
-      'SharepointLogoFill': '\uF27F',
-      'DelveLogo': '\uF280',
-      'DelveLogoFill': '\uF281',
-      'OfficeVideoLogo': '\uF282',
-      'OfficeVideoLogoFill': '\uF283',
-      'ExchangeLogo': '\uF284',
-      'ExchangeLogoFill': '\uF285',
-      'DocumentApproval': '\uF28B',
-      'CloneToDesktop': '\uF28C',
-      'InstallToDrive': '\uF28D',
-      'Blur': '\uF28E',
-      'Build': '\uF28F',
-      'ProcessMetaTask': '\uF290',
-      'BranchFork2': '\uF291',
-      'BranchLocked': '\uF292',
-      'BranchCommit': '\uF293',
-      'BranchCompare': '\uF294',
-      'BranchMerge': '\uF295',
-      'BranchPullRequest': '\uF296',
-      'BranchSearch': '\uF297',
-      'BranchShelveset': '\uF298',
-      'RawSource': '\uF299',
-      'MergeDuplicate': '\uF29A',
-      'RowsGroup': '\uF29B',
-      'RowsChild': '\uF29C',
-      'Deploy': '\uF29D',
-      'Redeploy': '\uF29E',
-      'ServerEnviroment': '\uF29F',
-      'Plug': '\uF300',
-      'PlugSolid': '\uF301',
-      'PlugConnected': '\uF302',
-      'PlugDisconnected': '\uF303',
-      'UnlockSolid': '\uF304',
-      'Variable': '\uF305',
-      'Parameter': '\uF306',
-      'CommentUrgent': '\uF307',
-      'Storyboard': '\uF308',
-      'DiffInline': '\uF309',
-      'DiffSideBySide': '\uF30A',
-      'ImageDiff': '\uF30B',
-      'ImagePixel': '\uF30C',
-      'FileBug': '\uF30D',
-      'FileCode': '\uF30E',
-      'FileComment': '\uF30F',
-      'FileImage': '\uF311',
-      'FileSymlink': '\uF312',
-      'AutoFillTemplate': '\uF313',
-      'WorkItem': '\uF314',
-      'WorkItemBug': '\uF315',
-      'LogRemove': '\uF316',
-      'ColumnOptions': '\uF317',
-      'Packages': '\uF318',
-      'BuildIssue': '\uF319',
-      'AssessmentGroup': '\uF31A',
-      'VariableGroup': '\uF31B',
-      'FullHistory': '\uF31C',
-      'BusinessHoursSign': '\uF310',
-      'VisioDiagram': '\uF2A0',
-      'HighlightMappedShapes': '\uF2A1',
-      'TextCallout': '\uF2A2',
-      'IconSetsFlag': '\uF2A4',
-      'VisioLogo': '\uF2A7',
-      'VisioLogoFill': '\uF2A8',
-      'VisioDocument': '\uF2A9',
-      'TimelineProgress': '\uF2AA',
-      'TimelineDelivery': '\uF2AB',
-      'Backlog': '\uF2AC',
-      'TeamFavorite': '\uF2AD',
-      'TaskGroup': '\uF2AE',
-      'TaskGroupMirrored': '\uF2AF',
-      'ScopeTemplate': '\uF2B0',
-      'AssessmentGroupTemplate': '\uF2B1',
-      'NewTeamProject': '\uF2B2',
-      'CommentAdd': '\uF2B3',
-      'CommentNext': '\uF2B4',
-      'CommentPrevious': '\uF2B5',
-      'ShopServer': '\uF2B6',
-      'LocaleLanguage': '\uF2B7',
-      'QueryList': '\uF2B8',
-      'UserSync': '\uF2B9',
-      'UserPause': '\uF2BA',
-      'StreamingOff': '\uF2BB',
-      'ArrowTallUpLeft': '\uF2BD'
-    }
-  });
-}
+// tslint:disable:max-line-length
+
+import {
+  IIconOptions,
+  IIconSubset,
+  registerIcons
+} from '@uifabric/styling/lib/index';
+
+export function initializeIcons(
+  baseUrl: string = '',
+  options?: IIconOptions
+): void {
+  const subset: IIconSubset = {
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-8"`,
+      src: `url('${baseUrl}fabric-icons-8-bf5c8e0c.woff') format('woff')`, 
+    },
+    icons: {
+      'ViewListTree': '\uF249',
+      'TriggerAuto': '\uF24A',
+      'TriggerUser': '\uF24B',
+      'PivotChart': '\uF24C',
+      'StackedBarChart': '\uF24D',
+      'StackedLineChart': '\uF24E',
+      'BuildQueue': '\uF24F',
+      'BuildQueueNew': '\uF250',
+      'UserFollowed': '\uF25C',
+      'VennDiagram': '\uF273',
+      'FiveTileGrid': '\uF274',
+      'FocalPoint': '\uF277',
+      'TeamsLogoInverse': '\uF27A',
+      'TeamsLogo': '\uF27B',
+      'TeamsLogoFill': '\uF27C',
+      'SkypeForBusinessLogoFill': '\uF27D',
+      'SharepointLogo': '\uF27E',
+      'SharepointLogoFill': '\uF27F',
+      'DelveLogo': '\uF280',
+      'DelveLogoFill': '\uF281',
+      'OfficeVideoLogo': '\uF282',
+      'OfficeVideoLogoFill': '\uF283',
+      'ExchangeLogo': '\uF284',
+      'ExchangeLogoFill': '\uF285',
+      'DocumentApproval': '\uF28B',
+      'CloneToDesktop': '\uF28C',
+      'InstallToDrive': '\uF28D',
+      'Blur': '\uF28E',
+      'Build': '\uF28F',
+      'ProcessMetaTask': '\uF290',
+      'BranchFork2': '\uF291',
+      'BranchLocked': '\uF292',
+      'BranchCommit': '\uF293',
+      'BranchCompare': '\uF294',
+      'BranchMerge': '\uF295',
+      'BranchPullRequest': '\uF296',
+      'BranchSearch': '\uF297',
+      'BranchShelveset': '\uF298',
+      'RawSource': '\uF299',
+      'MergeDuplicate': '\uF29A',
+      'RowsGroup': '\uF29B',
+      'RowsChild': '\uF29C',
+      'Deploy': '\uF29D',
+      'Redeploy': '\uF29E',
+      'ServerEnviroment': '\uF29F',
+      'Plug': '\uF300',
+      'PlugSolid': '\uF301',
+      'PlugConnected': '\uF302',
+      'PlugDisconnected': '\uF303',
+      'UnlockSolid': '\uF304',
+      'Variable': '\uF305',
+      'Parameter': '\uF306',
+      'CommentUrgent': '\uF307',
+      'Storyboard': '\uF308',
+      'DiffInline': '\uF309',
+      'DiffSideBySide': '\uF30A',
+      'ImageDiff': '\uF30B',
+      'ImagePixel': '\uF30C',
+      'FileBug': '\uF30D',
+      'FileCode': '\uF30E',
+      'FileComment': '\uF30F',
+      'FileImage': '\uF311',
+      'FileSymlink': '\uF312',
+      'AutoFillTemplate': '\uF313',
+      'WorkItem': '\uF314',
+      'WorkItemBug': '\uF315',
+      'LogRemove': '\uF316',
+      'ColumnOptions': '\uF317',
+      'Packages': '\uF318',
+      'BuildIssue': '\uF319',
+      'AssessmentGroup': '\uF31A',
+      'VariableGroup': '\uF31B',
+      'FullHistory': '\uF31C',
+      'BusinessHoursSign': '\uF310',
+      'VisioDiagram': '\uF2A0',
+      'HighlightMappedShapes': '\uF2A1',
+      'TextCallout': '\uF2A2',
+      'IconSetsFlag': '\uF2A4',
+      'VisioLogo': '\uF2A7',
+      'VisioLogoFill': '\uF2A8',
+      'VisioDocument': '\uF2A9',
+      'TimelineProgress': '\uF2AA',
+      'TimelineDelivery': '\uF2AB',
+      'Backlog': '\uF2AC',
+      'TeamFavorite': '\uF2AD',
+      'TaskGroup': '\uF2AE',
+      'TaskGroupMirrored': '\uF2AF',
+      'ScopeTemplate': '\uF2B0',
+      'AssessmentGroupTemplate': '\uF2B1',
+      'NewTeamProject': '\uF2B2',
+      'CommentAdd': '\uF2B3',
+      'CommentNext': '\uF2B4',
+      'CommentPrevious': '\uF2B5',
+      'ShopServer': '\uF2B6',
+      'LocaleLanguage': '\uF2B7',
+      'QueryList': '\uF2B8',
+      'UserSync': '\uF2B9',
+      'UserPause': '\uF2BA',
+      'StreamingOff': '\uF2BB',
+      'ArrowTallUpLeft': '\uF2BD'
+    }
+  };
+
+  registerIcons(subset, options);
+}
diff --git a/packages/icons/src/fabric-icons-9-inline.ts b/packages/icons/src/fabric-icons-9-inline.ts
deleted file mode 100644
index 22ca3ca662046..0000000000000
--- a/packages/icons/src/fabric-icons-9-inline.ts
+++ /dev/null
@@ -1,121 +0,0 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-9"`,
-      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
-    },
-    icons: {
-      'ArrowTallUpRight': '\uF2BE',
-      'ArrowTallDownLeft': '\uF2BF',
-      'ArrowTallDownRight': '\uF2C0',
-      'FieldEmpty': '\uF2C1',
-      'FieldFilled': '\uF2C2',
-      'FieldChanged': '\uF2C3',
-      'FieldNotChanged': '\uF2C4',
-      'RingerOff': '\uF2C5',
-      'PlayResume': '\uF2C6',
-      'BulletedList2': '\uF2C7',
-      'BulletedList2Mirrored': '\uF2C8',
-      'ImageCrosshair': '\uF2C9',
-      'GitGraph': '\uF2CA',
-      'Repo': '\uF2CB',
-      'RepoSolid': '\uF2CC',
-      'FolderQuery': '\uF2CD',
-      'FolderList': '\uF2CE',
-      'FolderListMirrored': '\uF2CF',
-      'LocationOutline': '\uF2D0',
-      'POISolid': '\uF2D1',
-      'CalculatorNotEqualTo': '\uF2D2',
-      'BoxSubtractSolid': '\uF2D3',
-      'BoxAdditionSolid': '\uF2D4',
-      'BoxMultiplySolid': '\uF2D5',
-      'BoxPlaySolid': '\uF2D6',
-      'BoxCheckmarkSolid': '\uF2D7',
-      'CirclePauseSolid': '\uF2D8',
-      'CirclePause': '\uF2D9',
-      'MSNVideosSolid': '\uF2DA',
-      'CircleStopSolid': '\uF2DB',
-      'CircleStop': '\uF2DC',
-      'NavigateBack': '\uF2DD',
-      'NavigateBackMirrored': '\uF2DE',
-      'NavigateForward': '\uF2DF',
-      'NavigateForwardMirrored': '\uF2E0',
-      'UnknownSolid': '\uF2E1',
-      'UnknownMirroredSolid': '\uF2E2',
-      'CircleAddition': '\uF2E3',
-      'CircleAdditionSolid': '\uF2E4',
-      'FilePDB': '\uF2E5',
-      'FileTemplate': '\uF2E6',
-      'FileSQL': '\uF2E7',
-      'FileJAVA': '\uF2E8',
-      'FileASPX': '\uF2E9',
-      'FileCSS': '\uF2EA',
-      'FileSass': '\uF2EB',
-      'FileLess': '\uF2EC',
-      'FileHTML': '\uF2ED',
-      'JavaScriptLanguage': '\uF2EE',
-      'CSharpLanguage': '\uF2EF',
-      'CSharp': '\uF2F0',
-      'VisualBasicLanguage': '\uF2F1',
-      'VB': '\uF2F2',
-      'CPlusPlusLanguage': '\uF2F3',
-      'CPlusPlus': '\uF2F4',
-      'FSharpLanguage': '\uF2F5',
-      'FSharp': '\uF2F6',
-      'TypeScriptLanguage': '\uF2F7',
-      'PythonLanguage': '\uF2F8',
-      'PY': '\uF2F9',
-      'CoffeeScript': '\uF2FA',
-      'MarkDownLanguage': '\uF2FB',
-      'FullWidth': '\uF2FE',
-      'FullWidthEdit': '\uF2FF',
-      'SingleColumnEdit': '\uF321',
-      'DoubleColumnEdit': '\uF322',
-      'TripleColumnEdit': '\uF323',
-      'ColumnLeftTwoThirdsEdit': '\uF324',
-      'ColumnRightTwoThirdsEdit': '\uF325',
-      'StreamLogo': '\uF329',
-      'AlertSolid': '\uF331',
-      'MegaphoneSolid': '\uF332',
-      'TaskSolid': '\uF333',
-      'ConfigurationSolid': '\uF334',
-      'BugSolid': '\uF335',
-      'CrownSolid': '\uF336',
-      'Trophy2Solid': '\uF337',
-      'QuickNoteSolid': '\uF338',
-      'ConstructionConeSolid': '\uF339',
-      'PageListSolid': '\uF33A',
-      'PageListMirroredSolid': '\uF33B',
-      'StarburstSolid': '\uF33C',
-      'ReadingModeSolid': '\uF33D',
-      'SadSolid': '\uF33E',
-      'HealthSolid': '\uF33F',
-      'ShieldSolid': '\uF340',
-      'GiftBoxSolid': '\uF341',
-      'ShoppingCartSolid': '\uF342',
-      'MailSolid': '\uF343',
-      'ChatSolid': '\uF344',
-      'RibbonSolid': '\uF345',
-      'FinancialSolid': '\uF346',
-      'FinancialMirroredSolid': '\uF347',
-      'HeadsetSolid': '\uF348',
-      'PermissionsSolid': '\uF349',
-      'ParkingSolid': '\uF34A',
-      'ParkingMirroredSolid': '\uF34B',
-      'DiamondSolid': '\uF34C',
-      'AsteriskSolid': '\uF34D',
-      'OfflineStorageSolid': '\uF34E'
-    }
-  });
-}
diff --git a/packages/icons/src/fabric-icons-9.ts b/packages/icons/src/fabric-icons-9.ts
index 4f98e7f757c11..291ace2dabd11 100644
--- a/packages/icons/src/fabric-icons-9.ts
+++ b/packages/icons/src/fabric-icons-9.ts
@@ -1,121 +1,130 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons-9"`,
-      src: `url('${baseUrl}fabric-icons-9-a362212c.woff') format('woff')`, 
-    },
-    icons: {
-      'ArrowTallUpRight': '\uF2BE',
-      'ArrowTallDownLeft': '\uF2BF',
-      'ArrowTallDownRight': '\uF2C0',
-      'FieldEmpty': '\uF2C1',
-      'FieldFilled': '\uF2C2',
-      'FieldChanged': '\uF2C3',
-      'FieldNotChanged': '\uF2C4',
-      'RingerOff': '\uF2C5',
-      'PlayResume': '\uF2C6',
-      'BulletedList2': '\uF2C7',
-      'BulletedList2Mirrored': '\uF2C8',
-      'ImageCrosshair': '\uF2C9',
-      'GitGraph': '\uF2CA',
-      'Repo': '\uF2CB',
-      'RepoSolid': '\uF2CC',
-      'FolderQuery': '\uF2CD',
-      'FolderList': '\uF2CE',
-      'FolderListMirrored': '\uF2CF',
-      'LocationOutline': '\uF2D0',
-      'POISolid': '\uF2D1',
-      'CalculatorNotEqualTo': '\uF2D2',
-      'BoxSubtractSolid': '\uF2D3',
-      'BoxAdditionSolid': '\uF2D4',
-      'BoxMultiplySolid': '\uF2D5',
-      'BoxPlaySolid': '\uF2D6',
-      'BoxCheckmarkSolid': '\uF2D7',
-      'CirclePauseSolid': '\uF2D8',
-      'CirclePause': '\uF2D9',
-      'MSNVideosSolid': '\uF2DA',
-      'CircleStopSolid': '\uF2DB',
-      'CircleStop': '\uF2DC',
-      'NavigateBack': '\uF2DD',
-      'NavigateBackMirrored': '\uF2DE',
-      'NavigateForward': '\uF2DF',
-      'NavigateForwardMirrored': '\uF2E0',
-      'UnknownSolid': '\uF2E1',
-      'UnknownMirroredSolid': '\uF2E2',
-      'CircleAddition': '\uF2E3',
-      'CircleAdditionSolid': '\uF2E4',
-      'FilePDB': '\uF2E5',
-      'FileTemplate': '\uF2E6',
-      'FileSQL': '\uF2E7',
-      'FileJAVA': '\uF2E8',
-      'FileASPX': '\uF2E9',
-      'FileCSS': '\uF2EA',
-      'FileSass': '\uF2EB',
-      'FileLess': '\uF2EC',
-      'FileHTML': '\uF2ED',
-      'JavaScriptLanguage': '\uF2EE',
-      'CSharpLanguage': '\uF2EF',
-      'CSharp': '\uF2F0',
-      'VisualBasicLanguage': '\uF2F1',
-      'VB': '\uF2F2',
-      'CPlusPlusLanguage': '\uF2F3',
-      'CPlusPlus': '\uF2F4',
-      'FSharpLanguage': '\uF2F5',
-      'FSharp': '\uF2F6',
-      'TypeScriptLanguage': '\uF2F7',
-      'PythonLanguage': '\uF2F8',
-      'PY': '\uF2F9',
-      'CoffeeScript': '\uF2FA',
-      'MarkDownLanguage': '\uF2FB',
-      'FullWidth': '\uF2FE',
-      'FullWidthEdit': '\uF2FF',
-      'SingleColumnEdit': '\uF321',
-      'DoubleColumnEdit': '\uF322',
-      'TripleColumnEdit': '\uF323',
-      'ColumnLeftTwoThirdsEdit': '\uF324',
-      'ColumnRightTwoThirdsEdit': '\uF325',
-      'StreamLogo': '\uF329',
-      'AlertSolid': '\uF331',
-      'MegaphoneSolid': '\uF332',
-      'TaskSolid': '\uF333',
-      'ConfigurationSolid': '\uF334',
-      'BugSolid': '\uF335',
-      'CrownSolid': '\uF336',
-      'Trophy2Solid': '\uF337',
-      'QuickNoteSolid': '\uF338',
-      'ConstructionConeSolid': '\uF339',
-      'PageListSolid': '\uF33A',
-      'PageListMirroredSolid': '\uF33B',
-      'StarburstSolid': '\uF33C',
-      'ReadingModeSolid': '\uF33D',
-      'SadSolid': '\uF33E',
-      'HealthSolid': '\uF33F',
-      'ShieldSolid': '\uF340',
-      'GiftBoxSolid': '\uF341',
-      'ShoppingCartSolid': '\uF342',
-      'MailSolid': '\uF343',
-      'ChatSolid': '\uF344',
-      'RibbonSolid': '\uF345',
-      'FinancialSolid': '\uF346',
-      'FinancialMirroredSolid': '\uF347',
-      'HeadsetSolid': '\uF348',
-      'PermissionsSolid': '\uF349',
-      'ParkingSolid': '\uF34A',
-      'ParkingMirroredSolid': '\uF34B',
-      'DiamondSolid': '\uF34C',
-      'AsteriskSolid': '\uF34D',
-      'OfflineStorageSolid': '\uF34E'
-    }
-  });
-}
+// tslint:disable:max-line-length
+
+import {
+  IIconOptions,
+  IIconSubset,
+  registerIcons
+} from '@uifabric/styling/lib/index';
+
+export function initializeIcons(
+  baseUrl: string = '',
+  options?: IIconOptions
+): void {
+  const subset: IIconSubset = {
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-9"`,
+      src: `url('${baseUrl}fabric-icons-9-a362212c.woff') format('woff')`, 
+    },
+    icons: {
+      'ArrowTallUpRight': '\uF2BE',
+      'ArrowTallDownLeft': '\uF2BF',
+      'ArrowTallDownRight': '\uF2C0',
+      'FieldEmpty': '\uF2C1',
+      'FieldFilled': '\uF2C2',
+      'FieldChanged': '\uF2C3',
+      'FieldNotChanged': '\uF2C4',
+      'RingerOff': '\uF2C5',
+      'PlayResume': '\uF2C6',
+      'BulletedList2': '\uF2C7',
+      'BulletedList2Mirrored': '\uF2C8',
+      'ImageCrosshair': '\uF2C9',
+      'GitGraph': '\uF2CA',
+      'Repo': '\uF2CB',
+      'RepoSolid': '\uF2CC',
+      'FolderQuery': '\uF2CD',
+      'FolderList': '\uF2CE',
+      'FolderListMirrored': '\uF2CF',
+      'LocationOutline': '\uF2D0',
+      'POISolid': '\uF2D1',
+      'CalculatorNotEqualTo': '\uF2D2',
+      'BoxSubtractSolid': '\uF2D3',
+      'BoxAdditionSolid': '\uF2D4',
+      'BoxMultiplySolid': '\uF2D5',
+      'BoxPlaySolid': '\uF2D6',
+      'BoxCheckmarkSolid': '\uF2D7',
+      'CirclePauseSolid': '\uF2D8',
+      'CirclePause': '\uF2D9',
+      'MSNVideosSolid': '\uF2DA',
+      'CircleStopSolid': '\uF2DB',
+      'CircleStop': '\uF2DC',
+      'NavigateBack': '\uF2DD',
+      'NavigateBackMirrored': '\uF2DE',
+      'NavigateForward': '\uF2DF',
+      'NavigateForwardMirrored': '\uF2E0',
+      'UnknownSolid': '\uF2E1',
+      'UnknownMirroredSolid': '\uF2E2',
+      'CircleAddition': '\uF2E3',
+      'CircleAdditionSolid': '\uF2E4',
+      'FilePDB': '\uF2E5',
+      'FileTemplate': '\uF2E6',
+      'FileSQL': '\uF2E7',
+      'FileJAVA': '\uF2E8',
+      'FileASPX': '\uF2E9',
+      'FileCSS': '\uF2EA',
+      'FileSass': '\uF2EB',
+      'FileLess': '\uF2EC',
+      'FileHTML': '\uF2ED',
+      'JavaScriptLanguage': '\uF2EE',
+      'CSharpLanguage': '\uF2EF',
+      'CSharp': '\uF2F0',
+      'VisualBasicLanguage': '\uF2F1',
+      'VB': '\uF2F2',
+      'CPlusPlusLanguage': '\uF2F3',
+      'CPlusPlus': '\uF2F4',
+      'FSharpLanguage': '\uF2F5',
+      'FSharp': '\uF2F6',
+      'TypeScriptLanguage': '\uF2F7',
+      'PythonLanguage': '\uF2F8',
+      'PY': '\uF2F9',
+      'CoffeeScript': '\uF2FA',
+      'MarkDownLanguage': '\uF2FB',
+      'FullWidth': '\uF2FE',
+      'FullWidthEdit': '\uF2FF',
+      'SingleColumnEdit': '\uF321',
+      'DoubleColumnEdit': '\uF322',
+      'TripleColumnEdit': '\uF323',
+      'ColumnLeftTwoThirdsEdit': '\uF324',
+      'ColumnRightTwoThirdsEdit': '\uF325',
+      'StreamLogo': '\uF329',
+      'AlertSolid': '\uF331',
+      'MegaphoneSolid': '\uF332',
+      'TaskSolid': '\uF333',
+      'ConfigurationSolid': '\uF334',
+      'BugSolid': '\uF335',
+      'CrownSolid': '\uF336',
+      'Trophy2Solid': '\uF337',
+      'QuickNoteSolid': '\uF338',
+      'ConstructionConeSolid': '\uF339',
+      'PageListSolid': '\uF33A',
+      'PageListMirroredSolid': '\uF33B',
+      'StarburstSolid': '\uF33C',
+      'ReadingModeSolid': '\uF33D',
+      'SadSolid': '\uF33E',
+      'HealthSolid': '\uF33F',
+      'ShieldSolid': '\uF340',
+      'GiftBoxSolid': '\uF341',
+      'ShoppingCartSolid': '\uF342',
+      'MailSolid': '\uF343',
+      'ChatSolid': '\uF344',
+      'RibbonSolid': '\uF345',
+      'FinancialSolid': '\uF346',
+      'FinancialMirroredSolid': '\uF347',
+      'HeadsetSolid': '\uF348',
+      'PermissionsSolid': '\uF349',
+      'ParkingSolid': '\uF34A',
+      'ParkingMirroredSolid': '\uF34B',
+      'DiamondSolid': '\uF34C',
+      'AsteriskSolid': '\uF34D',
+      'OfflineStorageSolid': '\uF34E'
+    }
+  };
+
+  registerIcons(subset, options);
+}
diff --git a/packages/icons/src/fabric-icons-inline.ts b/packages/icons/src/fabric-icons-inline.ts
deleted file mode 100644
index 7a81c1215bcb8..0000000000000
--- a/packages/icons/src/fabric-icons-inline.ts
+++ /dev/null
@@ -1,75 +0,0 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons"`,
-      src: `url('data:application/octet-stream;base64,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') format('woff')`, 
-    },
-    icons: {
-      'GlobalNavButton': '\uE700',
-      'ChevronDown': '\uE70D',
-      'ChevronUp': '\uE70E',
-      'Edit': '\uE70F',
-      'Add': '\uE710',
-      'Cancel': '\uE711',
-      'More': '\uE712',
-      'Settings': '\uE713',
-      'Mail': '\uE715',
-      'Filter': '\uE71C',
-      'Search': '\uE721',
-      'Share': '\uE72D',
-      'FavoriteStar': '\uE734',
-      'FavoriteStarFill': '\uE735',
-      'CheckMark': '\uE73E',
-      'Delete': '\uE74D',
-      'ChevronLeft': '\uE76B',
-      'ChevronRight': '\uE76C',
-      'Calendar': '\uE787',
-      'Undo': '\uE7A7',
-      'Flag': '\uE7C1',
-      'Page': '\uE7C3',
-      'View': '\uE890',
-      'Clear': '\uE894',
-      'Download': '\uE896',
-      'Upload': '\uE898',
-      'Folder': '\uE8B7',
-      'Sort': '\uE8CB',
-      'AlignRight': '\uE8E2',
-      'AlignLeft': '\uE8E4',
-      'Tag': '\uE8EC',
-      'AddFriend': '\uE8FA',
-      'Info': '\uE946',
-      'Pinned': '\uE840',
-      'SortLines': '\uE9D0',
-      'List': '\uEA37',
-      'CircleRing': '\uEA3A',
-      'Heart': '\uEB51',
-      'HeartFill': '\uEB52',
-      'Tiles': '\uECA5',
-      'Embed': '\uECCE',
-      'Ascending': '\uEDC0',
-      'Descending': '\uEDC1',
-      'SortUp': '\uEE68',
-      'SortDown': '\uEE69',
-      'SyncToPC': '\uEE6E',
-      'LargeGrid': '\uEECB',
-      'SkypeCheck': '\uEF80',
-      'SkypeClock': '\uEF81',
-      'SkypeMinus': '\uEF82',
-      'ClearFilter': '\uEF8F',
-      'Flow': '\uEF90',
-      'StatusCircleCheckmark': '\uF13E',
-      'MoreVertical': '\uF2BC'
-    }
-  });
-}
diff --git a/packages/icons/src/fabric-icons.ts b/packages/icons/src/fabric-icons.ts
index edf7c0a85bdbc..ea787ad8c1986 100644
--- a/packages/icons/src/fabric-icons.ts
+++ b/packages/icons/src/fabric-icons.ts
@@ -1,75 +1,84 @@
-// tslint:disable:max-line-length
-
-import { registerIcons } from '@uifabric/styling/lib/index';
-
-export function initializeIcons(baseUrl: string = ''): void {
-  registerIcons({
-    style: {
-      MozOsxFontSmoothing: 'grayscale',
-      WebkitFontSmoothing: 'antialiased',
-      fontStyle: 'normal',
-      fontWeight: 'normal',
-      speak: 'none'
-    },
-    fontFace: {
-      fontFamily: `"FabricMDL2Icons"`,
-      src: `url('${baseUrl}fabric-icons-4ac62dd2.woff') format('woff')`, 
-    },
-    icons: {
-      'GlobalNavButton': '\uE700',
-      'ChevronDown': '\uE70D',
-      'ChevronUp': '\uE70E',
-      'Edit': '\uE70F',
-      'Add': '\uE710',
-      'Cancel': '\uE711',
-      'More': '\uE712',
-      'Settings': '\uE713',
-      'Mail': '\uE715',
-      'Filter': '\uE71C',
-      'Search': '\uE721',
-      'Share': '\uE72D',
-      'FavoriteStar': '\uE734',
-      'FavoriteStarFill': '\uE735',
-      'CheckMark': '\uE73E',
-      'Delete': '\uE74D',
-      'ChevronLeft': '\uE76B',
-      'ChevronRight': '\uE76C',
-      'Calendar': '\uE787',
-      'Undo': '\uE7A7',
-      'Flag': '\uE7C1',
-      'Page': '\uE7C3',
-      'View': '\uE890',
-      'Clear': '\uE894',
-      'Download': '\uE896',
-      'Upload': '\uE898',
-      'Folder': '\uE8B7',
-      'Sort': '\uE8CB',
-      'AlignRight': '\uE8E2',
-      'AlignLeft': '\uE8E4',
-      'Tag': '\uE8EC',
-      'AddFriend': '\uE8FA',
-      'Info': '\uE946',
-      'Pinned': '\uE840',
-      'SortLines': '\uE9D0',
-      'List': '\uEA37',
-      'CircleRing': '\uEA3A',
-      'Heart': '\uEB51',
-      'HeartFill': '\uEB52',
-      'Tiles': '\uECA5',
-      'Embed': '\uECCE',
-      'Ascending': '\uEDC0',
-      'Descending': '\uEDC1',
-      'SortUp': '\uEE68',
-      'SortDown': '\uEE69',
-      'SyncToPC': '\uEE6E',
-      'LargeGrid': '\uEECB',
-      'SkypeCheck': '\uEF80',
-      'SkypeClock': '\uEF81',
-      'SkypeMinus': '\uEF82',
-      'ClearFilter': '\uEF8F',
-      'Flow': '\uEF90',
-      'StatusCircleCheckmark': '\uF13E',
-      'MoreVertical': '\uF2BC'
-    }
-  });
-}
+// tslint:disable:max-line-length
+
+import {
+  IIconOptions,
+  IIconSubset,
+  registerIcons
+} from '@uifabric/styling/lib/index';
+
+export function initializeIcons(
+  baseUrl: string = '',
+  options?: IIconOptions
+): void {
+  const subset: IIconSubset = {
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons"`,
+      src: `url('${baseUrl}fabric-icons-4ac62dd2.woff') format('woff')`,
+    },
+    icons: {
+      'GlobalNavButton': '\uE700',
+      'ChevronDown': '\uE70D',
+      'ChevronUp': '\uE70E',
+      'Edit': '\uE70F',
+      'Add': '\uE710',
+      'Cancel': '\uE711',
+      'More': '\uE712',
+      'Settings': '\uE713',
+      'Mail': '\uE715',
+      'Filter': '\uE71C',
+      'Search': '\uE721',
+      'Share': '\uE72D',
+      'FavoriteStar': '\uE734',
+      'FavoriteStarFill': '\uE735',
+      'CheckMark': '\uE73E',
+      'Delete': '\uE74D',
+      'ChevronLeft': '\uE76B',
+      'ChevronRight': '\uE76C',
+      'Calendar': '\uE787',
+      'Undo': '\uE7A7',
+      'Flag': '\uE7C1',
+      'Page': '\uE7C3',
+      'View': '\uE890',
+      'Clear': '\uE894',
+      'Download': '\uE896',
+      'Upload': '\uE898',
+      'Folder': '\uE8B7',
+      'Sort': '\uE8CB',
+      'AlignRight': '\uE8E2',
+      'AlignLeft': '\uE8E4',
+      'Tag': '\uE8EC',
+      'AddFriend': '\uE8FA',
+      'Info': '\uE946',
+      'Pinned': '\uE840',
+      'SortLines': '\uE9D0',
+      'List': '\uEA37',
+      'CircleRing': '\uEA3A',
+      'Heart': '\uEB51',
+      'HeartFill': '\uEB52',
+      'Tiles': '\uECA5',
+      'Embed': '\uECCE',
+      'Ascending': '\uEDC0',
+      'Descending': '\uEDC1',
+      'SortUp': '\uEE68',
+      'SortDown': '\uEE69',
+      'SyncToPC': '\uEE6E',
+      'LargeGrid': '\uEECB',
+      'SkypeCheck': '\uEF80',
+      'SkypeClock': '\uEF81',
+      'SkypeMinus': '\uEF82',
+      'ClearFilter': '\uEF8F',
+      'Flow': '\uEF90',
+      'StatusCircleCheckmark': '\uF13E',
+      'MoreVertical': '\uF2BC'
+    }
+  };
+
+  registerIcons(subset, options);
+}
diff --git a/packages/icons/src/index.ts b/packages/icons/src/index.ts
index 3e2f082763f72..56016b60ce5bf 100644
--- a/packages/icons/src/index.ts
+++ b/packages/icons/src/index.ts
@@ -1,24 +1,28 @@
-import { initializeIcons as i } from './fabric-icons';
-import { initializeIcons as i0 } from './fabric-icons-0';
-import { initializeIcons as i1 } from './fabric-icons-1';
-import { initializeIcons as i2 } from './fabric-icons-2';
-import { initializeIcons as i3 } from './fabric-icons-3';
-import { initializeIcons as i4 } from './fabric-icons-4';
-import { initializeIcons as i5 } from './fabric-icons-5';
-import { initializeIcons as i6 } from './fabric-icons-6';
-import { initializeIcons as i7 } from './fabric-icons-7';
-import { initializeIcons as i8 } from './fabric-icons-8';
-import { initializeIcons as i9 } from './fabric-icons-9';
-import { initializeIcons as i10 } from './fabric-icons-10';
-import { initializeIcons as i11 } from './fabric-icons-11';
-import './icon-aliases';
-
-const DEFAULT_BASE_URL = 'https://static2.sharepointonline.com/files/fabric/assets/icons/';
-
-export function initializeIcons(baseUrl: string = DEFAULT_BASE_URL): void {
-  [i, i0, i1, i2, i3, i4, i5, i6, i7, i8, i9, i10, i11].forEach(
-    (initialize: (url: string) => void) => initialize(baseUrl)
-  );
-}
-
-export { IconNames } from './IconNames';
+import { initializeIcons as i } from './fabric-icons';
+import { initializeIcons as i0 } from './fabric-icons-0';
+import { initializeIcons as i1 } from './fabric-icons-1';
+import { initializeIcons as i2 } from './fabric-icons-2';
+import { initializeIcons as i3 } from './fabric-icons-3';
+import { initializeIcons as i4 } from './fabric-icons-4';
+import { initializeIcons as i5 } from './fabric-icons-5';
+import { initializeIcons as i6 } from './fabric-icons-6';
+import { initializeIcons as i7 } from './fabric-icons-7';
+import { initializeIcons as i8 } from './fabric-icons-8';
+import { initializeIcons as i9 } from './fabric-icons-9';
+import { initializeIcons as i10 } from './fabric-icons-10';
+import { initializeIcons as i11 } from './fabric-icons-11';
+import { IIconOptions } from '@uifabric/styling/lib/index';
+import './icon-aliases';
+
+const DEFAULT_BASE_URL = 'https://spoprod-a.akamaihd.net/files/fabric/assets/icons/';
+
+export function initializeIcons(
+  baseUrl: string = DEFAULT_BASE_URL,
+  options?: IIconOptions
+): void {
+  [i, i0, i1, i2, i3, i4, i5, i6, i7, i8, i9, i10, i11].forEach(
+    (initialize: (url: string, options?: IIconOptions) => void) => initialize(baseUrl, options)
+  );
+}
+
+export { IconNames } from './IconNames';
diff --git a/packages/office-ui-fabric-react/src/common/tests.ts b/packages/office-ui-fabric-react/src/common/tests.ts
index c3545a6dde164..0ec23e3003f08 100644
--- a/packages/office-ui-fabric-react/src/common/tests.ts
+++ b/packages/office-ui-fabric-react/src/common/tests.ts
@@ -4,5 +4,5 @@ import { setIconOptions } from '@uifabric/styling';
 
 // Suppress icon warnings.
 setIconOptions({
-  warnOnMissingIcons: false
+  disableWarnings: true
 });
diff --git a/packages/styling/src/utilities/icons.ts b/packages/styling/src/utilities/icons.ts
index 6085f75d19299..297175e326c4d 100644
--- a/packages/styling/src/utilities/icons.ts
+++ b/packages/styling/src/utilities/icons.ts
@@ -31,8 +31,27 @@ export interface IIconRecord {
 }
 
 export interface IIconOptions {
+  /**
+   * By default, registering the same set of icons will generate a console warning per duplicate icon
+   * registered, because this scenario can create unexpected consequences.
+   *
+   * Some scenarios include:
+   *
+   * Icon set was previously registered using a different base url.
+   * Icon set was previously registered but a different version was provided.
+   * Icons in a previous registered set overlap with a new set.
+   *
+   * To simply ignore previously registered icons, you can specify to disable warnings. This means
+   * that if an icon which was previous registered is registered again, it will be silently ignored.
+   * However, consider whether the problems listed above will cause issues.
+   **/
   disableWarnings: boolean;
-  warnOnMissingIcons: boolean;
+
+  /**
+   * @deprecated
+   * Use 'disableWarnings' instead.
+   */
+  warnOnMissingIcons?: boolean;
 }
 
 export interface IIconRecords {
@@ -42,7 +61,8 @@ export interface IIconRecords {
 }
 
 const ICON_SETTING_NAME = 'icons';
-const _icons = GlobalSettings.getValue<IIconRecords>(ICON_SETTING_NAME, {
+
+const _iconSettings = GlobalSettings.getValue<IIconRecords>(ICON_SETTING_NAME, {
   __options: {
     disableWarnings: false,
     warnOnMissingIcons: true
@@ -55,7 +75,7 @@ const _icons = GlobalSettings.getValue<IIconRecords>(ICON_SETTING_NAME, {
  *
  * @param iconSubset - the icon subset definition.
  */
-export function registerIcons(iconSubset: IIconSubset): void {
+export function registerIcons(iconSubset: IIconSubset, options?: Partial<IIconOptions>): void {
   let subset = {
     ...iconSubset,
     isRegistered: false,
@@ -63,19 +83,24 @@ export function registerIcons(iconSubset: IIconSubset): void {
   };
   let { icons } = iconSubset;
 
+  // Grab options, optionally mix user provided ones on top.
+  options = options ? { ..._iconSettings.__options, ...options } : _iconSettings.__options;
+
   for (const iconName in icons) {
     if (icons.hasOwnProperty(iconName)) {
       const code = icons[iconName];
       const normalizedIconName = iconName.toLowerCase();
 
-      if (_icons[normalizedIconName] && !_icons.__options.disableWarnings) {
-        warn(`Icon '${iconName} being re-registered`);
+      if (_iconSettings[normalizedIconName]) {
+        if (!options.disableWarnings) {
+          warn(`Icon '${iconName} being re-registered. Ignoring duplicate registration.`);
+        }
+      } else {
+        _iconSettings[normalizedIconName] = {
+          code,
+          subset
+        };
       }
-
-      _icons[normalizedIconName] = {
-        code,
-        subset
-      };
     }
   }
 }
@@ -84,7 +109,7 @@ export function registerIcons(iconSubset: IIconSubset): void {
  * Remaps one icon name to another.
  */
 export function registerIconAlias(iconName: string, mappedToName: string): void {
-  _icons.__remapped[iconName.toLowerCase()] = mappedToName.toLowerCase();
+  _iconSettings.__remapped[iconName.toLowerCase()] = mappedToName.toLowerCase();
 }
 
 /**
@@ -96,12 +121,13 @@ export function registerIconAlias(iconName: string, mappedToName: string): void
  */
 export function getIcon(name?: string): IIconRecord | undefined {
   let icon: IIconRecord | undefined = undefined;
+  const options = _iconSettings.__options;
 
   name = name ? name.toLowerCase() : '';
-  name = _icons.__remapped[name] || name;
+  name = _iconSettings.__remapped[name] || name;
 
   if (name) {
-    icon = _icons[name!] as IIconRecord;
+    icon = _iconSettings[name!] as IIconRecord;
 
     if (icon) {
       let { subset } = icon;
@@ -122,7 +148,7 @@ export function getIcon(name?: string): IIconRecord | undefined {
         subset.isRegistered = true;
       }
     } else {
-      if (_icons.__options.warnOnMissingIcons && !_icons.__options.disableWarnings) {
+      if (!options.disableWarnings && options.warnOnMissingIcons) {
         warn(`The icon "${name}" was used but not registered. See http://aka.ms/fabric-icon-usage for more information.`);
       }
     }
@@ -137,8 +163,8 @@ export function getIcon(name?: string): IIconRecord | undefined {
  * @public
  */
 export function setIconOptions(options: Partial<IIconOptions>): void {
-  _icons.__options = {
-    ..._icons.__options,
+  _iconSettings.__options = {
+    ..._iconSettings.__options,
     ...options
   };
 }

From 189bbc43243d35e12676689f42c7d0edb574d417 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 30 Nov 2017 03:23:35 -0800
Subject: [PATCH 1082/1641] Applying package updates.

---
 .../icons/icon-options_2017-11-29-19-32.json  | 11 -----------
 .../icons/rename-props_2017-11-11-20-23.json  | 11 -----------
 .../icon-options_2017-11-29-19-32.json        | 11 -----------
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/package.json             |  4 ++--
 packages/icons/CHANGELOG.json                 | 19 +++++++++++++++++++
 packages/icons/CHANGELOG.md                   |  9 ++++++++-
 packages/icons/package.json                   |  4 ++--
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/CHANGELOG.json               | 14 ++++++++++++++
 packages/styling/CHANGELOG.md                 |  9 ++++++++-
 packages/styling/package.json                 |  2 +-
 12 files changed, 57 insertions(+), 43 deletions(-)
 delete mode 100644 common/changes/@uifabric/icons/icon-options_2017-11-29-19-32.json
 delete mode 100644 common/changes/@uifabric/icons/rename-props_2017-11-11-20-23.json
 delete mode 100644 common/changes/@uifabric/styling/icon-options_2017-11-29-19-32.json

diff --git a/common/changes/@uifabric/icons/icon-options_2017-11-29-19-32.json b/common/changes/@uifabric/icons/icon-options_2017-11-29-19-32.json
deleted file mode 100644
index c125349d8e6cd..0000000000000
--- a/common/changes/@uifabric/icons/icon-options_2017-11-29-19-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/icons",
-      "comment": "Updating the icons package to pass through optional `options` argument in `initializeIcons`.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/icons",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/rename-props_2017-11-11-20-23.json b/common/changes/@uifabric/icons/rename-props_2017-11-11-20-23.json
deleted file mode 100644
index 978b6bba1e8ee..0000000000000
--- a/common/changes/@uifabric/icons/rename-props_2017-11-11-20-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/icons",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/icons",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/icon-options_2017-11-29-19-32.json b/common/changes/@uifabric/styling/icon-options_2017-11-29-19-32.json
deleted file mode 100644
index 9ce9226bd84ce..0000000000000
--- a/common/changes/@uifabric/styling/icon-options_2017-11-29-19-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Updating the `registerIcons` helper to take in options.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 96dc8d395fa5f..027f36bc5dc06 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -38,7 +38,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.11.1 <6.0.0",
+    "@uifabric/styling": ">=5.12.0 <6.0.0",
     "@uifabric/utilities": ">=5.5.0 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index f67f28865d060..09779b8e186e3 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -29,7 +29,7 @@
     "@types/enzyme": "^2.8.8",
     "@types/webpack-env": "1.13.0",
     "@uifabric/example-app-base": ">=5.1.2 <6.0.0",
-    "@uifabric/icons": ">=5.2.0 <6.0.0",
+    "@uifabric/icons": ">=5.3.0 <6.0.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.0.1 <6.0.0",
     "es6-weak-map": "^2.0.2",
     "enzyme": "^2.9.1",
@@ -44,7 +44,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "office-ui-fabric-react": ">=5.28.0 <6.0.0",
-    "@uifabric/icons": ">=5.2.0 <6.0.0",
+    "@uifabric/icons": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/icons/CHANGELOG.json b/packages/icons/CHANGELOG.json
index 89a1bb16cceff..0f562f53e9215 100644
--- a/packages/icons/CHANGELOG.json
+++ b/packages/icons/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/icons",
   "entries": [
+    {
+      "version": "5.3.0",
+      "tag": "@uifabric/icons_v5.3.0",
+      "date": "Thu, 30 Nov 2017 11:23:35 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "7bd70ca910f147560e0c0e8a536a2659730b5f13",
+            "comment": "Updating the icons package to pass through optional `options` argument in `initializeIcons`."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.11.1 <6.0.0` to `>=5.12.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.2.0",
       "tag": "@uifabric/icons_v5.2.0",
diff --git a/packages/icons/CHANGELOG.md b/packages/icons/CHANGELOG.md
index 6009ce5e7b08b..4cff5b6f37385 100644
--- a/packages/icons/CHANGELOG.md
+++ b/packages/icons/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/icons
 
-This log was last generated on Fri, 13 Oct 2017 21:59:12 GMT and should not be manually modified.
+This log was last generated on Thu, 30 Nov 2017 11:23:35 GMT and should not be manually modified.
+
+## 5.3.0
+Thu, 30 Nov 2017 11:23:35 GMT
+
+### Minor changes
+
+- Updating the icons package to pass through optional `options` argument in `initializeIcons`.
 
 ## 5.2.0
 Fri, 13 Oct 2017 21:59:12 GMT
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 412f2e446d265..d47856c8a3012 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/icons",
-  "version": "5.2.0",
+  "version": "5.3.0",
   "description": "Office UI Fabric icon set.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -23,7 +23,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.11.1 <6.0.0",
+    "@uifabric/styling": ">=5.12.0 <6.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index dba582ddabf80..2a09864dfe4e9 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -45,9 +45,9 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/icons": ">=5.2.0 <6.0.0",
+    "@uifabric/icons": ">=5.3.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.7.0 <6.0.0",
-    "@uifabric/styling": ">=5.11.1 <6.0.0",
+    "@uifabric/styling": ">=5.12.0 <6.0.0",
     "@uifabric/utilities": ">=5.5.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index fc0ac0631a017..200c8fbe426c3 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.12.0",
+      "tag": "@uifabric/styling_v5.12.0",
+      "date": "Thu, 30 Nov 2017 11:23:35 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "7bd70ca910f147560e0c0e8a536a2659730b5f13",
+            "comment": "Updating the `registerIcons` helper to take in options."
+          }
+        ]
+      }
+    },
     {
       "version": "5.11.1",
       "tag": "@uifabric/styling_v5.11.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 857bcd46edb48..3839d74d0e418 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Wed, 29 Nov 2017 11:24:06 GMT and should not be manually modified.
+This log was last generated on Thu, 30 Nov 2017 11:23:35 GMT and should not be manually modified.
+
+## 5.12.0
+Thu, 30 Nov 2017 11:23:35 GMT
+
+### Minor changes
+
+- Updating the `registerIcons` helper to take in options.
 
 ## 5.11.1
 Wed, 29 Nov 2017 11:24:05 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 8189126668f31..075753fb2858a 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.11.1",
+  "version": "5.12.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "repository": {
     "type": "git",

From 95fa0ed17e7adc25e1c18977387a0ca840d3025a Mon Sep 17 00:00:00 2001
From: Bryan Watts <brwatt@microsoft.com>
Date: Thu, 30 Nov 2017 10:28:31 -0800
Subject: [PATCH 1083/1641] Correctly styles the external signal component
 (#3466)

* Fixes the external signal component
---
 .../brwatt-fix-external-signal_2017-11-27-22-57.json  | 11 +++++++++++
 .../experiments/src/components/signals/Signals.tsx    |  9 ++++++---
 2 files changed, 17 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/brwatt-fix-external-signal_2017-11-27-22-57.json

diff --git a/common/changes/@uifabric/experiments/brwatt-fix-external-signal_2017-11-27-22-57.json b/common/changes/@uifabric/experiments/brwatt-fix-external-signal_2017-11-27-22-57.json
new file mode 100644
index 0000000000000..340d9d562fa4c
--- /dev/null
+++ b/common/changes/@uifabric/experiments/brwatt-fix-external-signal_2017-11-27-22-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Fixes the external signal component",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "brwatt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/signals/Signals.tsx b/packages/experiments/src/components/signals/Signals.tsx
index 3f3747f20c266..ab5c6b6bd1da3 100644
--- a/packages/experiments/src/components/signals/Signals.tsx
+++ b/packages/experiments/src/components/signals/Signals.tsx
@@ -267,11 +267,14 @@ export const ExternalSignal: Signal = (props: ISignalProps): JSX.Element => {
 
   return (
     <span
-      aria-label={ ariaLabel }
       { ...spanProps }
-      className={ css(SignalStyles.signal, SignalStyles.external) }
+      className={ css(SignalStyles.signal, SignalStyles.centeredSignal) }
     >
-      { props.children }
+      <Icon
+        ariaLabel={ props.ariaLabel }
+        className={ css(SignalStyles.signal, SignalStyles.external) }
+        iconName='Globe'
+      />
     </span>
   );
 };
\ No newline at end of file

From 1797c419ddf414b87f064928cc34ba925ce048b4 Mon Sep 17 00:00:00 2001
From: Aditi Mandal <aditima@microsoft.com>
Date: Thu, 30 Nov 2017 16:19:10 -0800
Subject: [PATCH 1084/1641] Aditima/groupheader css (#3494)

* GroupHeader: Style fix to add nowrap on group header

* adding change file
---
 .../aditima-groupheader-css_2017-12-01-00-00.json     | 11 +++++++++++
 .../src/components/GroupedList/GroupHeader.scss       |  2 ++
 2 files changed, 13 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/aditima-groupheader-css_2017-12-01-00-00.json

diff --git a/common/changes/office-ui-fabric-react/aditima-groupheader-css_2017-12-01-00-00.json b/common/changes/office-ui-fabric-react/aditima-groupheader-css_2017-12-01-00-00.json
new file mode 100644
index 0000000000000..5bf4e5d8dc463
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/aditima-groupheader-css_2017-12-01-00-00.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "GroupHeader: Style fix to add nowrap on group header",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "aditima@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss
index d72267b6d0b46..95d538e49e2fc 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss
@@ -59,6 +59,8 @@ $groupHeader-ease-in-back: cubic-bezier(0.600, -0.280, 0.735, 0.045);
   @include ms-font-xl;
   cursor: pointer;
   outline: 0;
+  white-space: nowrap;
+  text-overflow: ellipsis;
 }
 
 .headerCount {

From 742066348a7213c26fbadce6b97e2083b72275a9 Mon Sep 17 00:00:00 2001
From: Terri-Anne Cambridge <tacambridge@gmail.com>
Date: Thu, 30 Nov 2017 16:30:13 -0800
Subject: [PATCH 1085/1641] Panel: When dismissed, allow the capability to hide
 the visibility of the panel (#3480)

* Panel: Add isHiddenOnDismiss to hide panel instead of destroying it

* Add change file

* Update comment on isHiddenOnDismiss property
---
 ...panelhiddenondismiss_2017-11-29-21-30.json | 11 +++++
 .../src/components/Panel/Panel.scss           |  4 ++
 .../src/components/Panel/Panel.tsx            |  8 +++-
 .../src/components/Panel/Panel.types.ts       |  6 +++
 .../src/components/Panel/PanelPage.tsx        |  5 +++
 .../Panel.HiddenOnDismiss.Example.tsx         | 42 +++++++++++++++++++
 6 files changed, 74 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/tecambri-panelhiddenondismiss_2017-11-29-21-30.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Panel/examples/Panel.HiddenOnDismiss.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/tecambri-panelhiddenondismiss_2017-11-29-21-30.json b/common/changes/office-ui-fabric-react/tecambri-panelhiddenondismiss_2017-11-29-21-30.json
new file mode 100644
index 0000000000000..5b4ff672efbfb
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/tecambri-panelhiddenondismiss_2017-11-29-21-30.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Panel: When panel is dismissed, hide the panel instead of destroying it",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "tecambri@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.scss b/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
index 9eed93a8a09bb..b3ff48c2c1519 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.scss
@@ -25,6 +25,10 @@ $Panel-margin-lg: 428px;
 $Panel-margin-xl: 176px;
 $CommandBarHeight: 44px;
 
+.hiddenPanel {
+  visibility: hidden;
+}
+
 .root {
   pointer-events: none;
 
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
index 58f01f9ed9635..9241dc536dacc 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
@@ -30,6 +30,7 @@ export interface IPanelState {
 export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IPanel {
 
   public static defaultProps: IPanelProps = {
+    isHiddenOnDismiss: false,
     isOpen: false,
     isBlocking: true,
     hasCloseButton: true,
@@ -78,6 +79,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
       ignoreExternalFocusing,
       isBlocking,
       isLightDismiss,
+      isHiddenOnDismiss,
       layerProps,
       type,
       customWidth,
@@ -94,8 +96,9 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
     const headerTextId = id + '-headerText';
     const customWidthStyles = (type === PanelType.custom) ? { width: customWidth } : {};
     const renderProps: IPanelProps = { ...this.props, componentId: id };
+    isLightDismiss = isHiddenOnDismiss || isLightDismiss;
 
-    if (!isOpen && !isAnimating) {
+    if (!isOpen && !isAnimating && !isHiddenOnDismiss) {
       return null;
     }
 
@@ -137,7 +140,8 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
                 type === PanelType.largeFixed && ('ms-Panel--fixed ' + styles.rootIsFixed),
                 type === PanelType.extraLarge && ('ms-Panel--xl ' + styles.rootIsXLarge),
                 type === PanelType.custom && ('ms-Panel--custom ' + styles.rootIsCustom),
-                hasCloseButton && ('ms-Panel--hasCloseButton ' + styles.rootHasCloseButton)
+                hasCloseButton && ('ms-Panel--hasCloseButton ' + styles.rootHasCloseButton),
+                !isOpen && !isAnimating && isHiddenOnDismiss && styles.hiddenPanel
               )
             }
           >
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.types.ts b/packages/office-ui-fabric-react/src/components/Panel/Panel.types.ts
index 3d13851473641..be91b63a352e5 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.types.ts
@@ -39,6 +39,12 @@ export interface IPanelProps extends React.Props<Panel> {
   */
   isLightDismiss?: boolean;
 
+  /**
+  * Whether the panel is hidden on dismiss, instead of destroyed in the DOM. This will override isLightDismiss to true.
+  * @default false
+  */
+  isHiddenOnDismiss?: boolean;
+
   /**
   * Whether the panel uses a modal overlay or not
   * @default true
diff --git a/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx b/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
index bf85e0d5bae54..11921546e8e4d 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/PanelPage.tsx
@@ -13,6 +13,7 @@ import { PanelLargeExample } from './examples/Panel.Large.Example';
 import { PanelLargeFixedExample } from './examples/Panel.LargeFixed.Example';
 import { PanelExtraLargeExample } from './examples/Panel.ExtraLarge.Example';
 import { PanelCustomExample } from './examples/Panel.Custom.Example';
+import { PanelHiddenOnDismissExample } from './examples/Panel.HiddenOnDismiss.Example';
 import { PanelLightDismissExample } from './examples/Panel.LightDismiss.Example';
 import { PanelLightDismissCustomExample } from './examples/Panel.LightDismissCustom.Example';
 import { PanelNonModalExample } from './examples/Panel.NonModal.Example';
@@ -29,6 +30,7 @@ const PanelLargeExampleCode = require('!raw-loader!office-ui-fabric-react/src/co
 const PanelLargeFixedExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Panel/examples/Panel.LargeFixed.Example.tsx') as string;
 const PanelExtraLargeExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Panel/examples/Panel.ExtraLarge.Example.tsx') as string;
 const PanelCustomExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Panel/examples/Panel.Custom.Example.tsx') as string;
+const PanelHiddenOnDismissExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Panel/examples/Panel.HiddenOnDismiss.Example.tsx') as string;
 const PanelLightDismissExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismiss.Example.tsx') as string;
 const PanelLightDismissCustomExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismissCustom.Example.tsx') as string;
 const PanelNonModalExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Panel/examples/Panel.NonModal.Example.tsx') as string;
@@ -66,6 +68,9 @@ export class PanelPage extends React.Component<IComponentDemoPageProps, {}> {
             <ExampleCard title='Panel - Custom' code={ PanelCustomExampleCode }>
               <PanelCustomExample />
             </ExampleCard>
+            <ExampleCard title='Panel - Hidden on Dismiss' code={ PanelHiddenOnDismissExampleCode }>
+              <PanelHiddenOnDismissExample />
+            </ExampleCard>
             <ExampleCard title='Panel - Light Dismiss' code={ PanelLightDismissExampleCode }>
               <PanelLightDismissExample />
             </ExampleCard>
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.HiddenOnDismiss.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.HiddenOnDismiss.Example.tsx
new file mode 100644
index 0000000000000..01e89835bf14c
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.HiddenOnDismiss.Example.tsx
@@ -0,0 +1,42 @@
+import * as React from 'react';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
+import { Panel } from 'office-ui-fabric-react/lib/Panel';
+
+export class PanelHiddenOnDismissExample extends React.Component<any, any> {
+
+  constructor() {
+    super();
+
+    this.state = { showPanel: false };
+  }
+
+  public render() {
+    return (
+      <div>
+        <DefaultButton
+          text='Open panel'
+          onClick={ this._showPanel }
+        />
+        <Panel
+          isOpen={ this.state.showPanel }
+          isHiddenOnDismiss={ true }
+          headerText='Hidden on Dismiss Panel'
+          onDismiss={ this._hidePanel }
+        >
+          <span>When dismissed, this panel will be hidden instead of destroyed. LightDismiss is overridden and enabled.</span>
+        </Panel>
+      </div>
+    );
+  }
+
+  @autobind
+  private _showPanel(): void {
+    this.setState({ showPanel: true });
+  }
+
+  @autobind
+  private _hidePanel(): void {
+    this.setState({ showPanel: false });
+  }
+}

From d99de57c86d8cd2110ad603b746ffe33c3fae7d4 Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Thu, 30 Nov 2017 16:52:45 -0800
Subject: [PATCH 1086/1641] ContextualMenu: Expose onMenuDismiss function to
 invoke when menu is being removed from DOM (#3496)

* Expose callback when menu is being unmounted from the dom

* Add change file
---
 .../malozano-ExposeOnDimiss_2017-12-01-00-36.json     | 11 +++++++++++
 .../src/components/ContextualMenu/ContextualMenu.tsx  |  4 ++++
 .../components/ContextualMenu/ContextualMenu.types.ts |  5 +++++
 3 files changed, 20 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/malozano-ExposeOnDimiss_2017-12-01-00-36.json

diff --git a/common/changes/office-ui-fabric-react/malozano-ExposeOnDimiss_2017-12-01-00-36.json b/common/changes/office-ui-fabric-react/malozano-ExposeOnDimiss_2017-12-01-00-36.json
new file mode 100644
index 0000000000000..257c0205684f7
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-ExposeOnDimiss_2017-12-01-00-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: Expose callback hook when menu is being removed from DOM",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index a8fbce754188e..6a742bba8b698 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -183,6 +183,10 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       setTimeout(() => this._previousActiveElement!.focus(), 0);
     }
 
+    if (this.props.onMenuDismissed) {
+      this.props.onMenuDismissed(this.props);
+    }
+
     this._events.dispose();
     this._async.dispose();
   }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
index 63c5954152312..5f1eb27174d5e 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
@@ -185,6 +185,11 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
    */
   onMenuOpened?: (contextualMenu?: IContextualMenuProps) => void;
 
+  /**
+   * Callback for when the contextualmenu is being closed (removing from the DOM)
+   */
+  onMenuDismissed?: (contextualMenu?: IContextualMenuProps) => void;
+
   /**
    * Pass in custom callout props
    */

From 2e8e4893e78c7ffbfbd1a50e8205a81aff6b4f53 Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Thu, 30 Nov 2017 16:54:30 -0800
Subject: [PATCH 1087/1641] DatePicker: Calendar Props (#3465)

* no message

* no message

* Calendar Props

* Adding change file
---
 ...orr-DatePicker-CalendarProps_2017-11-27-22-49.json | 11 +++++++++++
 .../src/components/DatePicker/DatePicker.tsx          |  4 +++-
 .../src/components/DatePicker/DatePicker.types.ts     |  7 ++++++-
 3 files changed, 20 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-DatePicker-CalendarProps_2017-11-27-22-49.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-DatePicker-CalendarProps_2017-11-27-22-49.json b/common/changes/office-ui-fabric-react/kegorr-DatePicker-CalendarProps_2017-11-27-22-49.json
new file mode 100644
index 0000000000000..331a8cd430626
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-DatePicker-CalendarProps_2017-11-27-22-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DatePicker: Calendar Props.  Adding access to ICalendarProps",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 10b5d603efefc..60f7212e63735 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -182,7 +182,8 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
       borderless,
       className,
       minDate,
-      maxDate
+      maxDate,
+      calendarProps
     } = this.props;
     const { isDatePickerShown, formattedDate, selectedDate, errorMessage } = this.state;
 
@@ -233,6 +234,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
             onPositioned={ this._onCalloutPositioned }
           >
             <Calendar
+              { ...calendarProps }
               onSelectDate={ this._onSelectDate }
               onDismiss={ this._calendarDismissed }
               isMonthPickerVisible={ this.props.isMonthPickerVisible }
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
index 78e1e6b31e753..6708d605918c3 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { DatePicker } from './DatePicker';
-import { DayOfWeek } from '../../Calendar';
+import { DayOfWeek, ICalendarProps } from '../../Calendar';
 import { FirstWeekOfYear } from '../../utilities/dateValues/DateValues';
 import { ICalendarFormatDateCallbacks } from '../Calendar/Calendar.types';
 
@@ -15,6 +15,11 @@ export interface IDatePickerProps extends React.Props<DatePicker> {
    */
   componentRef?: (component: IDatePicker) => void;
 
+  /**
+   * Pass calendar props to calendar component
+   */
+  calendarProps?: ICalendarProps;
+
   /**
    * Callback issued when a date is selected
    */

From 491764a41bf4fe95e0bc7bfc20fe150f0edd9d11 Mon Sep 17 00:00:00 2001
From: philipzloh <philip.loh@students.olin.edu>
Date: Thu, 30 Nov 2017 16:55:13 -0800
Subject: [PATCH 1088/1641]  Use UI fonts instead of non-UI fonts (CJK) (#3481)

* Use UI fonts instead of non-UI fonts (CJK)

* changefile update
---
 .../phloh-localized-ui-fonts_2017-11-29-21-50.json    | 11 +++++++++++
 packages/styling/src/styles/fonts.ts                  |  6 +++---
 2 files changed, 14 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/phloh-localized-ui-fonts_2017-11-29-21-50.json

diff --git a/common/changes/@uifabric/styling/phloh-localized-ui-fonts_2017-11-29-21-50.json b/common/changes/@uifabric/styling/phloh-localized-ui-fonts_2017-11-29-21-50.json
new file mode 100644
index 0000000000000..4088afaec698b
--- /dev/null
+++ b/common/changes/@uifabric/styling/phloh-localized-ui-fonts_2017-11-29-21-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Use Yu Gothic UI, Microsoft Yahei UI, Microsoft Jhenghei UI",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "phloh@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/styling/src/styles/fonts.ts b/packages/styling/src/styles/fonts.ts
index fe53290221c7b..8f796040dc7ec 100644
--- a/packages/styling/src/styles/fonts.ts
+++ b/packages/styling/src/styles/fonts.ts
@@ -25,14 +25,14 @@ export namespace LocalizedFontNames {
 // Font families with fallbacks, for the general regions.
 export namespace LocalizedFontFamilies {
   export const Arabic = `'${LocalizedFontNames.Arabic}'`;
-  export const ChineseSimplified = `'Microsoft Yahei', Verdana, Simsun`;
-  export const ChineseTraditional = `'Microsoft Jhenghei', Pmingliu`;
+  export const ChineseSimplified = `'Microsoft Yahei UI', Verdana, Simsun`;
+  export const ChineseTraditional = `'Microsoft Jhenghei UI', Pmingliu`;
   export const Cyrillic = `'${LocalizedFontNames.Cyrillic}'`;
   export const EastEuropean = `'${LocalizedFontNames.EastEuropean}'`;
   export const Greek = `'${LocalizedFontNames.Greek}'`;
   export const Hebrew = `'${LocalizedFontNames.Hebrew}'`;
   export const Hindi = `'Nirmala UI'`;
-  export const Japanese = `'Yu Gothic', 'Meiryo UI', Meiryo, 'MS Pgothic', Osaka`;
+  export const Japanese = `'Yu Gothic UI', 'Meiryo UI', Meiryo, 'MS Pgothic', Osaka`;
   export const Korean = `'Malgun Gothic', Gulim`;
   export const Selawik = `'${LocalizedFontNames.Selawik}'`;
   export const Thai = `'Leelawadee UI Web', 'Kmer UI'`;

From 2207c10859801f04a37b682f14f83d67267022ed Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Thu, 30 Nov 2017 16:59:24 -0800
Subject: [PATCH 1089/1641] Persona: Scale presence to a max size when coinSize
 is specified (#3331)

* Changed exaple to include presence with icon

* Scaled sizing for presence and presence icon with coinSize

* Added change file

* Refactored variables

* Variable refactor, moved up

* New max size for presence with custom coin size

* Removing custom coinSize example from documentation

* Max variables

* Update persona-coinsize_2017-11-07-18-53.json
---
 .../persona-coinsize_2017-11-07-18-53.json    | 11 ++++++++++
 .../src/components/Persona/PersonaPage.tsx    |  2 +-
 .../components/Persona/PersonaPresence.tsx    | 21 ++++++++++++++++---
 .../examples/Persona.CustomRender.Example.tsx |  7 -------
 4 files changed, 30 insertions(+), 11 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/persona-coinsize_2017-11-07-18-53.json

diff --git a/common/changes/office-ui-fabric-react/persona-coinsize_2017-11-07-18-53.json b/common/changes/office-ui-fabric-react/persona-coinsize_2017-11-07-18-53.json
new file mode 100644
index 0000000000000..9e16ca9b35882
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/persona-coinsize_2017-11-07-18-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "PersonaPresence: Scale the presence and presence icon proportionally to the specified coinSize up to a max size.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
index f75f43d92cd08..ac98fabba9ed2 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
@@ -34,7 +34,7 @@ export class PersonaPage extends React.Component<IComponentDemoPageProps, {}> {
             <ExampleCard title='Persona with initials' code={ PersonaInitialsExampleCode }>
               <PersonaInitialsExample />
             </ExampleCard>
-            <ExampleCard title='Rendering custom persona text and custom coin size' code={ PersonaCustomRenderExampleCode }>
+            <ExampleCard title='Rendering custom persona text' code={ PersonaCustomRenderExampleCode }>
               <PersonaCustomRenderExample />
             </ExampleCard>
           </div>
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaPresence.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaPresence.tsx
index 5e1f8c2114220..354ddf29ebef8 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaPresence.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaPresence.tsx
@@ -10,6 +10,10 @@ import {
 } from './Persona.types';
 import * as stylesImport from './Persona.scss';
 const styles: any = stylesImport;
+const coinSizeFontScaleFactor = 6;
+const coinSizePresenceScaleFactor = 3;
+const presenceMaxSize = 40;
+const presenceFontMaxSize = 20;
 
 export class PersonaPresence extends React.Component<IPersonaProps, {}> {
   constructor(props: IPersonaProps) {
@@ -17,15 +21,26 @@ export class PersonaPresence extends React.Component<IPersonaProps, {}> {
   }
 
   public render(): JSX.Element | null {
-    let { presence } = this.props;
+    const { presence, coinSize } = this.props;
+    const presenceHeightWidth = coinSize && (coinSize / coinSizePresenceScaleFactor < presenceMaxSize ? coinSize / coinSizePresenceScaleFactor : presenceMaxSize);
+    const presenceFontSize = coinSize && (coinSize / coinSizeFontScaleFactor < presenceFontMaxSize ? coinSize / coinSizeFontScaleFactor : presenceFontMaxSize);
+    const coinSizeWithPresenceIconStyle = coinSize ? { fontSize: presenceFontSize, lineHeight: presenceHeightWidth + 'px' } : undefined;
+    const coinSizeWithPresenceStyle = coinSize ? { width: presenceHeightWidth, height: presenceHeightWidth } : undefined;
 
     if (presence === PersonaPresenceEnum.none) {
       return null;
     }
 
     return (
-      <div className={ css('ms-Persona-presence', styles.presence) }>
-        <Icon className={ css('ms-Persona-presenceIcon', styles.presenceIcon) } iconName={ this._determineIcon() } />
+      <div
+        className={ css('ms-Persona-presence', styles.presence) }
+        style={ coinSizeWithPresenceStyle }
+      >
+        <Icon
+          className={ css('ms-Persona-presenceIcon', styles.presenceIcon) }
+          iconName={ this._determineIcon() }
+          style={ coinSizeWithPresenceIconStyle }
+        />
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx
index 2049e558024c5..1580ca8fd393c 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx
@@ -36,13 +36,6 @@ export class PersonaCustomRenderExample extends React.Component<React.Props<Pers
           presence={ PersonaPresence.offline }
           onRenderSecondaryText={ this._onRenderSecondaryText }
         />
-        <div className={ exampleStyles.exampleLabel }>Custom coin size = 150</div>
-        <Persona
-          { ...examplePersona }
-          coinSize={ 150 }
-          presence={ PersonaPresence.online }
-          onRenderSecondaryText={ this._onRenderSecondaryText }
-        />
       </div>
     );
   }

From 8a0b81aa9ac2ecc1443ced92ab2dd91ec9ea219c Mon Sep 17 00:00:00 2001
From: Terri-Anne Cambridge <tacambridge@gmail.com>
Date: Thu, 30 Nov 2017 17:10:45 -0800
Subject: [PATCH 1090/1641] Panel: apply hidden css to popup instead of the
 panel itself (#3499)

---
 .../office-ui-fabric-react/src/components/Panel/Panel.tsx | 8 ++++++--
 .../src/components/Panel/Panel.types.ts                   | 2 +-
 .../Panel/examples/Panel.HiddenOnDismiss.Example.tsx      | 2 +-
 3 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
index 9241dc536dacc..757116fe11aa8 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
@@ -96,7 +96,6 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
     const headerTextId = id + '-headerText';
     const customWidthStyles = (type === PanelType.custom) ? { width: customWidth } : {};
     const renderProps: IPanelProps = { ...this.props, componentId: id };
-    isLightDismiss = isHiddenOnDismiss || isLightDismiss;
 
     if (!isOpen && !isAnimating && !isHiddenOnDismiss) {
       return null;
@@ -123,6 +122,11 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
           role='dialog'
           ariaLabelledBy={ headerText && headerTextId }
           onDismiss={ this.dismiss }
+          className={
+            css(
+              !isOpen && !isAnimating && isHiddenOnDismiss && styles.hiddenPanel
+            )
+          }
         >
           <div
             className={
@@ -158,7 +162,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
                 ) }
               style={ customWidthStyles }
               elementToFocusOnDismiss={ elementToFocusOnDismiss }
-              isClickableOutsideFocusTrap={ isLightDismiss }
+              isClickableOutsideFocusTrap={ isLightDismiss || isHiddenOnDismiss }
               ignoreExternalFocusing={ ignoreExternalFocusing }
               forceFocusInsideTrap={ forceFocusInsideTrap }
               firstFocusableSelector={ firstFocusableSelector }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.types.ts b/packages/office-ui-fabric-react/src/components/Panel/Panel.types.ts
index be91b63a352e5..3feb0fbd5ad72 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.types.ts
@@ -40,7 +40,7 @@ export interface IPanelProps extends React.Props<Panel> {
   isLightDismiss?: boolean;
 
   /**
-  * Whether the panel is hidden on dismiss, instead of destroyed in the DOM. This will override isLightDismiss to true.
+  * Whether the panel is hidden on dismiss, instead of destroyed in the DOM.
   * @default false
   */
   isHiddenOnDismiss?: boolean;
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.HiddenOnDismiss.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.HiddenOnDismiss.Example.tsx
index 01e89835bf14c..d8d005d55041b 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.HiddenOnDismiss.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.HiddenOnDismiss.Example.tsx
@@ -24,7 +24,7 @@ export class PanelHiddenOnDismissExample extends React.Component<any, any> {
           headerText='Hidden on Dismiss Panel'
           onDismiss={ this._hidePanel }
         >
-          <span>When dismissed, this panel will be hidden instead of destroyed. LightDismiss is overridden and enabled.</span>
+          <span>When dismissed, this panel will be hidden instead of destroyed.</span>
         </Panel>
       </div>
     );

From b1c7686173a7f56d894e1b90625df0132375b1ee Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Thu, 30 Nov 2017 17:16:58 -0800
Subject: [PATCH 1091/1641] Revise Signals architecture and add example page
 (#3491)

* Reorganize Signals modules and add doc page

* Fix native props handling in FolderCover

* Add Signal examples page, reorganize slghtly, and fix alignments

* Fix CSS class name

* Update change output
---
 .../experiments/signals_2017-11-30-20-09.json |  11 +
 .../components/FolderCover/FolderCover.tsx    |  17 +-
 .../experiments/src/components/Tile/Tile.tsx  |   2 +-
 .../src/components/signals/Signal.scss        |  27 +++
 .../src/components/signals/Signal.tsx         |  31 +++
 .../src/components/signals/SignalField.scss   |  15 ++
 .../src/components/signals/SignalField.tsx    |  38 ++++
 .../src/components/signals/Signals.Props.ts   |   4 +
 .../src/components/signals/Signals.scss       |  61 +-----
 .../src/components/signals/Signals.tsx        | 132 ++++--------
 .../src/components/signals/SignalsPage.tsx    |  63 ++++++
 .../examples/Signals.Basic.Example.tsx        | 195 ++++++++++++++++++
 .../signals/examples/Signals.Example.scss     |  25 +++
 .../experiments/src/demo/AppDefinition.tsx    |   6 +
 14 files changed, 479 insertions(+), 148 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/signals_2017-11-30-20-09.json
 create mode 100644 packages/experiments/src/components/signals/Signal.scss
 create mode 100644 packages/experiments/src/components/signals/Signal.tsx
 create mode 100644 packages/experiments/src/components/signals/SignalField.scss
 create mode 100644 packages/experiments/src/components/signals/SignalField.tsx
 create mode 100644 packages/experiments/src/components/signals/Signals.Props.ts
 create mode 100644 packages/experiments/src/components/signals/SignalsPage.tsx
 create mode 100644 packages/experiments/src/components/signals/examples/Signals.Basic.Example.tsx
 create mode 100644 packages/experiments/src/components/signals/examples/Signals.Example.scss

diff --git a/common/changes/@uifabric/experiments/signals_2017-11-30-20-09.json b/common/changes/@uifabric/experiments/signals_2017-11-30-20-09.json
new file mode 100644
index 0000000000000..26a710eb19eec
--- /dev/null
+++ b/common/changes/@uifabric/experiments/signals_2017-11-30-20-09.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Revise Signals and provide example page",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.tsx b/packages/experiments/src/components/FolderCover/FolderCover.tsx
index a6932184cab4c..51cf23074d725 100644
--- a/packages/experiments/src/components/FolderCover/FolderCover.tsx
+++ b/packages/experiments/src/components/FolderCover/FolderCover.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 import { IFolderCoverProps, FolderCoverSize, FolderCoverType } from './FolderCover.types';
 import { ISize, css } from '../../Utilities';
 import * as FolderCoverStylesModule from './FolderCover.scss';
-import * as SignalStylesModule from '../signals/Signals.scss';
+import * as SignalStylesModule from '../signals/Signal.scss';
 
 // tslint:disable-next-line:no-any
 const FolderCoverStyles = FolderCoverStylesModule as any;
@@ -74,6 +74,9 @@ export class FolderCover extends React.Component<IFolderCoverProps, IFolderCover
       folderCoverType: type = 'default',
       hideContent = false,
       ref,
+      metadata,
+      signal,
+      children,
       ...divProps
     } = this.props;
 
@@ -96,10 +99,10 @@ export class FolderCover extends React.Component<IFolderCoverProps, IFolderCover
           src={ assets.back }
         />
         {
-          this.props.children ? (
+          children ? (
             <span className={ css('ms-FolderCover-content', FolderCoverStyles.content) }>
               <span className={ css('ms-FolderCover-frame', FolderCoverStyles.frame) }>
-                { this.props.children }
+                { children }
               </span>
             </span>
           ) : null
@@ -110,19 +113,19 @@ export class FolderCover extends React.Component<IFolderCoverProps, IFolderCover
           src={ assets.front }
         />
         {
-          this.props.signal ?
+          signal ?
             (
               <span className={ css('ms-FolderCover-signal', FolderCoverStyles.signal, SignalStyles.dark) }>
-                { this.props.signal }
+                { signal }
               </span>
             ) :
             null
         }
         {
-          this.props.metadata ?
+          metadata ?
             (
               <span className={ css('ms-FolderCover-metadata', FolderCoverStyles.metadata) }>
-                { this.props.metadata }
+                { metadata }
               </span>
             ) :
             null
diff --git a/packages/experiments/src/components/Tile/Tile.tsx b/packages/experiments/src/components/Tile/Tile.tsx
index fbbf7efd68323..1bad1f990ad71 100644
--- a/packages/experiments/src/components/Tile/Tile.tsx
+++ b/packages/experiments/src/components/Tile/Tile.tsx
@@ -5,7 +5,7 @@ import { Check } from 'office-ui-fabric-react/lib/Check';
 import { SELECTION_CHANGE } from 'office-ui-fabric-react/lib/Selection';
 import { ISize, css, BaseComponent, autobind, getId } from '../../Utilities';
 import * as TileStylesModule from './Tile.scss';
-import * as SignalStylesModule from '../signals/Signals.scss';
+import * as SignalStylesModule from '../signals/Signal.scss';
 import * as CheckStylesModule from 'office-ui-fabric-react/lib/components/Check/Check.scss';
 
 // tslint:disable:no-any
diff --git a/packages/experiments/src/components/signals/Signal.scss b/packages/experiments/src/components/signals/Signal.scss
new file mode 100644
index 0000000000000..c8bc544708cf9
--- /dev/null
+++ b/packages/experiments/src/components/signals/Signal.scss
@@ -0,0 +1,27 @@
+
+@import '~office-ui-fabric-react/src/common/common';
+
+.signal {
+  display: inline-block;
+  margin: 0 4px;
+  position: relative;
+
+  transition: color 0.2s linear;
+
+  .dark &,
+  .dark.selected {
+    color: $ms-color-white;
+  }
+
+  &:first-child {
+    @include margin-left(0);
+  }
+
+  &:last-child {
+    @include margin-right(0);
+  }
+}
+
+i.signal {
+  top: 0.2em;
+}
diff --git a/packages/experiments/src/components/signals/Signal.tsx b/packages/experiments/src/components/signals/Signal.tsx
new file mode 100644
index 0000000000000..c3dc8e9f98a56
--- /dev/null
+++ b/packages/experiments/src/components/signals/Signal.tsx
@@ -0,0 +1,31 @@
+
+import * as React from 'react';
+import { css } from 'office-ui-fabric-react/lib/Utilities';
+import * as SignalStylesModule from './Signal.scss';
+
+// tslint:disable-next-line:no-any
+const SignalStyles: any = SignalStylesModule;
+
+export interface ISignalProps extends React.HTMLAttributes<HTMLSpanElement> {
+  ariaLabel?: string;
+}
+
+export type Signal = React.StatelessComponent<ISignalProps>;
+
+export const Signal: Signal = (props: ISignalProps): JSX.Element => {
+  const {
+    ariaLabel,
+    className,
+    ...spanProps
+  } = props;
+
+  return (
+    <span
+      aria-label={ props.ariaLabel }
+      { ...spanProps }
+      className={ css(SignalStyles.signal, className) }
+    >
+      { props.children }
+    </span>
+  );
+};
diff --git a/packages/experiments/src/components/signals/SignalField.scss b/packages/experiments/src/components/signals/SignalField.scss
new file mode 100644
index 0000000000000..717124fa13d1a
--- /dev/null
+++ b/packages/experiments/src/components/signals/SignalField.scss
@@ -0,0 +1,15 @@
+
+@import '~office-ui-fabric-react/src/common/common';
+
+.signalField {
+  display: inline-flex;
+  max-width: 100%;
+  flex-direction: row nowrap;
+}
+
+.signalFieldValue {
+  text-overflow: ellipsis;
+  overflow: hidden;
+  white-space: nowrap;
+  text-align: left;
+}
diff --git a/packages/experiments/src/components/signals/SignalField.tsx b/packages/experiments/src/components/signals/SignalField.tsx
new file mode 100644
index 0000000000000..fb76709b289ae
--- /dev/null
+++ b/packages/experiments/src/components/signals/SignalField.tsx
@@ -0,0 +1,38 @@
+
+import * as React from 'react';
+import { css } from 'office-ui-fabric-react/lib/Utilities';
+import * as SignalFieldStylesModule from './SignalField.scss';
+
+// tslint:disable-next-line:no-any
+const SignalFieldStyles: any = SignalFieldStylesModule;
+
+export interface ISignalFieldProps extends React.HTMLAttributes<HTMLSpanElement> {
+  before?: React.ReactNode | React.ReactNode[];
+  after?: React.ReactNode | React.ReactNode[];
+}
+
+/**
+ * Renders a field flanked by signals.
+ * Pass `<Signal />` or related components in for the `before` and `after` fields.
+ * Pass the main value as the children.
+ */
+export const SignalField: React.StatelessComponent<ISignalFieldProps> = (props: ISignalFieldProps): JSX.Element => {
+  const {
+    before,
+    after,
+    className,
+    ...spanProps
+  } = props;
+  return (
+    <span
+      { ...spanProps }
+      className={ css(SignalFieldStyles.signalField, className) }
+    >
+      { props.before }
+      <span className={ SignalFieldStyles.signalFieldValue }>
+        { props.children }
+      </span>
+      { props.after }
+    </span>
+  );
+};
diff --git a/packages/experiments/src/components/signals/Signals.Props.ts b/packages/experiments/src/components/signals/Signals.Props.ts
new file mode 100644
index 0000000000000..e7f6a24b13f76
--- /dev/null
+++ b/packages/experiments/src/components/signals/Signals.Props.ts
@@ -0,0 +1,4 @@
+
+export { ISignalProps } from './Signal';
+
+export { ISignalFieldProps } from './SignalField';
diff --git a/packages/experiments/src/components/signals/Signals.scss b/packages/experiments/src/components/signals/Signals.scss
index c7f9d7304f136..20d2b12bbe6ac 100644
--- a/packages/experiments/src/components/signals/Signals.scss
+++ b/packages/experiments/src/components/signals/Signals.scss
@@ -1,27 +1,14 @@
 
 @import '~office-ui-fabric-react/src/common/common';
 
-.signal {
-  display: inline-block;
-  margin: 0 4px;
-  position: relative;
-
-  &:first-child {
-    @include margin-left(0);
-  }
-
-  &:last-child {
-    @include margin-right(0);
-  }
-}
-
-.centeredSignal {
-    display: inline-flex;
-    flex-direction: column;
-    justify-content: center;
-}
-
-.newItem {
+/*
+Note: For icon alignment, please only use relative positioning in em units.
+Do not change the flex alignment or justification, or use vertical-alignment.
+It is important that Signals scale based on font-size and do not interfere with alternate alignment
+settings used by the parent control.
+*/
+
+.newSignal {
   width: 0;
   height: 1em;
   position: relative;
@@ -37,9 +24,9 @@
 .newIcon {
   position: absolute;
   bottom: 100%;
-  @include right(-1px);
+  @include right(-0.15em);
   font-size: 0.66em;
-  margin-bottom: -0.75em;
+  margin-bottom: -0.8em;
 }
 
 .comments {
@@ -75,7 +62,6 @@
 
 .shared {
   color: $ms-color-neutralSecondary;
-  top: 0.1em;
 }
 
 .missingMetadata {
@@ -85,8 +71,6 @@
 .mention {
   position: relative;
 
-  top: 0.2em;
-
   color: $ms-color-themePrimary;
 
   .selected & {
@@ -94,33 +78,10 @@
   }
 }
 
-.atp {
+.malwareDetected {
   color: $ms-color-redDark;
-  top: 3px;
 }
 
 .external {
   color: $ms-color-neutralSecondary;
 }
-
-.signal {
-  transition: color 0.2s linear;
-
-  .dark &,
-  .dark.selected {
-    color: $ms-color-white;
-  }
-}
-
-.signalField {
-  display: inline-flex;
-  max-width: 100%;
-  flex-direction: row nowrap;
-}
-
-.signalFieldValue {
-  text-overflow: ellipsis;
-  overflow: hidden;
-  white-space: nowrap;
-  text-align: left;
-}
diff --git a/packages/experiments/src/components/signals/Signals.tsx b/packages/experiments/src/components/signals/Signals.tsx
index ab5c6b6bd1da3..34e6037bfe556 100644
--- a/packages/experiments/src/components/signals/Signals.tsx
+++ b/packages/experiments/src/components/signals/Signals.tsx
@@ -2,70 +2,23 @@
 import * as React from 'react';
 import { Icon } from 'office-ui-fabric-react/lib/Icon';
 import { css } from 'office-ui-fabric-react/lib/Utilities';
-import * as SignalStylesModule from './Signals.scss';
+import { Signal, ISignalProps } from './Signal';
+import * as SignalsStylesModule from './Signals.scss';
+import * as SignalStylesModule from './Signal.scss';
 
+// tslint:disable-next-line:no-any
+const SignalsStyles = SignalsStylesModule as any;
 // tslint:disable-next-line:no-any
 const SignalStyles = SignalStylesModule as any;
 
-export interface ISignalFieldProps extends React.HTMLAttributes<HTMLSpanElement> {
-  before?: React.ReactNode | React.ReactNode[];
-  after?: React.ReactNode | React.ReactNode[];
-}
-
-/**
- * Renders a field flanked by signals.
- * Pass `<Signal />` or related components in for the `before` and `after` fields.
- * Pass the main value as the children.
- */
-export const SignalField: React.StatelessComponent<ISignalFieldProps> = (props: ISignalFieldProps): JSX.Element => {
-  const {
-    before,
-    after,
-    className,
-    ...spanProps
-  } = props;
-  return (
-    <span
-      { ...spanProps }
-      className={ css(SignalStyles.signalField, className) }
-    >
-      { props.before }
-      <span className={ SignalStyles.signalFieldValue }>
-        { props.children }
-      </span>
-      { props.after }
-    </span>
-  );
-};
-
-export interface ISignalProps extends React.HTMLAttributes<HTMLSpanElement> {
-  ariaLabel?: string;
-}
-
-export type Signal = React.StatelessComponent<ISignalProps>;
-
-export const Signal: Signal = (props: ISignalProps): JSX.Element => {
-  const {
-    ariaLabel,
-    ...spanProps
-  } = props;
-
-  return (
-    <span
-      aria-label={ props.ariaLabel }
-      { ...spanProps }
-      className={ css(SignalStyles.signal) }
-    >
-      { props.children }
-    </span>
-  );
-};
+export * from './Signal';
+export * from './SignalField';
 
 export const YouCheckedOutSignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
     <Icon
       ariaLabel={ props.ariaLabel }
-      className={ css(SignalStyles.signal, SignalStyles.youCheckedOutl) }
+      className={ css(SignalStyles.signal, SignalsStyles.youCheckedOutl) }
       iconName=''
     /> // TODO get correct icon
   );
@@ -75,7 +28,7 @@ export const BlockedSignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
     <Icon
       ariaLabel={ props.ariaLabel }
-      className={ css(SignalStyles.signal, SignalStyles.blocked) }
+      className={ css(SignalStyles.signal, SignalsStyles.blocked) }
       iconName='blocked2'
     />
   );
@@ -85,7 +38,7 @@ export const MissingMetadataSignal: Signal = (props: ISignalProps): JSX.Element
   return (
     <Icon
       ariaLabel={ props.ariaLabel }
-      className={ css(SignalStyles.signal, SignalStyles.missingMetadata) }
+      className={ css(SignalStyles.signal, SignalsStyles.missingMetadata) }
       iconName='info'
     />
   );
@@ -95,7 +48,7 @@ export const WarningSignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
     <Icon
       ariaLabel={ props.ariaLabel }
-      className={ css(SignalStyles.signal, SignalStyles.warning) }
+      className={ css(SignalStyles.signal, SignalsStyles.warning) }
       iconName='warning'
     />
   );
@@ -105,7 +58,7 @@ export const AwaitingApprovalSignal: Signal = (props: ISignalProps): JSX.Element
   return (
     <Icon
       ariaLabel={ props.ariaLabel }
-      className={ css(SignalStyles.signal, SignalStyles.awaitingApproval) }
+      className={ css(SignalStyles.signal, SignalsStyles.awaitingApproval) }
       iconName='documentmanagement'
     /> // TODO get correct icon
   );
@@ -113,13 +66,11 @@ export const AwaitingApprovalSignal: Signal = (props: ISignalProps): JSX.Element
 
 export const TrendingSignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
-    <span className={ css(SignalStyles.signal, SignalStyles.centeredSignal) }>
-      <Icon
-        ariaLabel={ props.ariaLabel }
-        className={ css(SignalStyles.signal, SignalStyles.trending) }
-        iconName='market'
-      />
-    </span>
+    <Icon
+      ariaLabel={ props.ariaLabel }
+      className={ css(SignalStyles.signal, SignalsStyles.trending) }
+      iconName='market'
+    />
   );
 };
 
@@ -127,7 +78,7 @@ export const SomeoneCheckedOutSignal: Signal = (props: ISignalProps): JSX.Elemen
   return (
     <Icon
       ariaLabel={ props.ariaLabel }
-      className={ css(SignalStyles.signal, SignalStyles.someoneCheckedOut) }
+      className={ css(SignalStyles.signal, SignalsStyles.someoneCheckedOut) }
       iconName='navigateforward'
     /> // TODO get correct icon
   );
@@ -145,11 +96,11 @@ export const NewSignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
     <span
       { ...spanProps }
-      className={ css(SignalStyles.signal, SignalStyles.newItem) }
+      className={ css(SignalStyles.signal, SignalsStyles.newSignal) }
     >
       <Icon
         ariaLabel={ props.ariaLabel }
-        className={ css(SignalStyles.newIcon) }
+        className={ css(SignalsStyles.newIcon) }
         iconName='glimmer'
       />
     </span>
@@ -161,18 +112,15 @@ export const NewSignal: Signal = (props: ISignalProps): JSX.Element => {
  */
 export const LiveEditSignal: Signal = (props: ISignalProps): JSX.Element => {
   const {
-    ariaLabel,
+    className,
     ...spanProps
   } = props;
 
   return (
-    <span
-      aria-label={ ariaLabel }
+    <Signal
+      className={ css(className, SignalsStyles.liveEdit) }
       { ...spanProps }
-      className={ css(SignalStyles.signal, SignalStyles.liveEdit) }
-    >
-      { props.children }
-    </span>
+    />
   );
 };
 
@@ -180,7 +128,7 @@ export const MentionSignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
     <Icon
       ariaLabel={ props.ariaLabel }
-      className={ css(SignalStyles.signal, SignalStyles.mention) }
+      className={ css(SignalStyles.signal, SignalsStyles.mention) }
       iconName='accounts'
     />
   );
@@ -192,27 +140,29 @@ export const MentionSignal: Signal = (props: ISignalProps): JSX.Element => {
 export const CommentsSignal: Signal = (props: ISignalProps): JSX.Element => {
   const {
     ariaLabel,
+    className,
+    children,
     ...spanProps
   } = props;
 
   return (
-    <span
+    <Signal
+      className={ css(SignalsStyles.comments, className) }
       { ...spanProps }
-      className={ css(SignalStyles.signal, SignalStyles.comments) }
     >
       <Icon
         ariaLabel={ props.ariaLabel }
-        className={ css(SignalStyles.commentsIcon) }
+        className={ css(SignalsStyles.commentsIcon) }
         iconName='MessageFill'
       />
       {
-        props.children ? (
-          <span className={ css(SignalStyles.commentsCount) }>
-            { props.children }
+        children ? (
+          <span className={ css(SignalsStyles.commentsCount) }>
+            { children }
           </span>
         ) : null
       }
-    </span>
+    </Signal>
   );
 };
 
@@ -220,7 +170,7 @@ export const UnseenEditSignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
     <Icon
       ariaLabel={ props.ariaLabel }
-      className={ css(SignalStyles.signal, SignalStyles.unseenEdit) }
+      className={ css(SignalStyles.signal, SignalsStyles.unseenEdit) }
       iconName='edit'
     /> // TODO get correct icon
   );
@@ -230,7 +180,7 @@ export const ReadOnlySignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
     <Icon
       ariaLabel={ props.ariaLabel }
-      className={ css(SignalStyles.signal, SignalStyles.readOnly) }
+      className={ css(SignalStyles.signal, SignalsStyles.readOnly) }
       iconName=''
     /> // TODO get correct icon
   );
@@ -240,22 +190,24 @@ export const SharedSignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
     <Icon
       ariaLabel={ props.ariaLabel }
-      className={ css(SignalStyles.signal, SignalStyles.shared) }
+      className={ css(SignalStyles.signal, SignalsStyles.shared) }
       iconName='people'
     />
   );
 };
 
-export const ATPSignal: Signal = (props: ISignalProps): JSX.Element => {
+export const MalwareDetectedSignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
     <Icon
       ariaLabel={ props.ariaLabel }
-      className={ css(SignalStyles.signal, SignalStyles.atp) }
+      className={ css(SignalStyles.signal, SignalsStyles.malwareDetected) }
       iconName='ATPLogo'
     />
   );
 };
 
+export const ATPSignal: Signal = MalwareDetectedSignal; // TODO Delete on next major version.
+
 /**
  * Renders a signal for an external item.
  */
@@ -277,4 +229,4 @@ export const ExternalSignal: Signal = (props: ISignalProps): JSX.Element => {
       />
     </span>
   );
-};
\ No newline at end of file
+};
diff --git a/packages/experiments/src/components/signals/SignalsPage.tsx b/packages/experiments/src/components/signals/SignalsPage.tsx
new file mode 100644
index 0000000000000..4576ae6cd4933
--- /dev/null
+++ b/packages/experiments/src/components/signals/SignalsPage.tsx
@@ -0,0 +1,63 @@
+import * as React from 'react';
+import {
+  ExampleCard,
+  IComponentDemoPageProps,
+  ComponentPage,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+
+/* tslint:disable:max-line-length */
+import { SignalsBasicExample } from './examples/Signals.Basic.Example';
+const SignalsBasicExampleCode = require(
+  '!raw-loader!experiments/src/components/signals/examples/Signals.Basic.Example.tsx'
+) as string;
+
+export class SignalsPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render(): JSX.Element {
+    return (
+      <ComponentPage
+        title='Signals'
+        componentName='SignalsBasicExample'
+        exampleCards={
+          <div>
+            <ExampleCard title='Basic signals usage' isOptIn={ true } code={ SignalsBasicExampleCode }>
+              <SignalsBasicExample />
+            </ExampleCard>
+          </div>
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!experiments/src/components/signals/Signals.Props.ts')
+            ] }
+          />
+        }
+        overview={
+          <div>
+            <p>A <code>Signal</code> is a combination of an <code>Icon</code> with a color and optional metadata which carries a standardized, semantic meaning.</p>
+            <p>A <code>SignalField</code> is a layout component which nicely arranges <code>Signal</code> and text elements for presentation.</p>
+          </div>
+        }
+        bestPractices={
+          <div />
+        }
+        dos={
+          <div>
+            <ul>
+              <li>Use them to associate a document with a specific state.</li>
+              <li>Assign localized <code>aria-label</code> attributes to the <code>Signal</code> elements which align with their meaning.</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul>
+              <li>Use them just for their icon, or re-assign their colors.</li>
+            </ul>
+          </div>
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }
+      />
+    );
+  }
+}
diff --git a/packages/experiments/src/components/signals/examples/Signals.Basic.Example.tsx b/packages/experiments/src/components/signals/examples/Signals.Basic.Example.tsx
new file mode 100644
index 0000000000000..c14d3b869d680
--- /dev/null
+++ b/packages/experiments/src/components/signals/examples/Signals.Basic.Example.tsx
@@ -0,0 +1,195 @@
+
+import * as React from 'react';
+import {
+  SignalField,
+  YouCheckedOutSignal,
+  MalwareDetectedSignal,
+  BlockedSignal,
+  MissingMetadataSignal,
+  WarningSignal,
+  AwaitingApprovalSignal,
+  TrendingSignal,
+  SomeoneCheckedOutSignal,
+  NewSignal,
+  LiveEditSignal,
+  MentionSignal,
+  CommentsSignal,
+  UnseenEditSignal,
+  ReadOnlySignal,
+  SharedSignal
+} from '../Signals';
+import { ChoiceGroup, IChoiceGroupOption, Checkbox } from 'office-ui-fabric-react';
+import { css, autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { lorem } from '@uifabric/example-app-base';
+import * as SignalStylesModule from '../Signal.scss';
+import * as SignalsExampleStylesModule from './Signals.Example.scss';
+
+// tslint:disable-next-line:no-any
+const SignalStyles: any = SignalStylesModule;
+// tslint:disable-next-line:no-any
+const SignalsExampleStyles: any = SignalsExampleStylesModule;
+
+interface ISignalExampleProps {
+  name: string;
+  signal: React.ReactNode;
+  text?: string;
+}
+
+const SignalExample: React.StatelessComponent<ISignalExampleProps> = (props: ISignalExampleProps): JSX.Element => {
+  const {
+    text = lorem(4)
+  } = props;
+
+  return (
+    <div>
+      <h3>{ props.name }</h3>
+      <SignalField before={ props.signal }>{ text }</SignalField>
+    </div>
+  );
+};
+
+export interface ISignalsBasicExampleState {
+  fontSize: 'small' | 'medium' | 'large';
+  isDark: boolean;
+}
+
+export class SignalsBasicExample extends React.Component<{}, ISignalsBasicExampleState> {
+  constructor() {
+    super();
+
+    this.state = {
+      fontSize: 'small',
+      isDark: false
+    };
+  }
+
+  public render(): JSX.Element | null {
+    const {
+      fontSize,
+      isDark
+    } = this.state;
+
+    return (
+      <div>
+        <p>
+          <ChoiceGroup
+            label='Font size'
+            defaultSelectedKey={ fontSize }
+            onChanged={ this._onFontSizeChoiceChanged }
+            options={
+              [{
+                key: 'small',
+                text: 'Small'
+              }, {
+                key: 'medium',
+                text: 'Medium'
+              }, {
+                key: 'large',
+                text: 'Large'
+              }]
+            }
+          />
+        </p>
+        <p>
+          <Checkbox
+            label='Dark?'
+            defaultChecked={ isDark }
+            onChange={ this._onIsDarkChanged }
+          />
+        </p>
+        <div
+          className={ css(SignalsExampleStyles.example, {
+            [SignalsExampleStyles.small]: fontSize === 'small',
+            [SignalsExampleStyles.medium]: fontSize === 'medium',
+            [SignalsExampleStyles.large]: fontSize === 'large',
+            [`${SignalsExampleStyles.dark} ${SignalStyles.dark}`]: isDark,
+          }) }
+        >
+          <SignalExample
+            name='You checked out'
+            signal={ <YouCheckedOutSignal /> }
+          />
+          <SignalExample
+            name='Malware detected'
+            signal={ <MalwareDetectedSignal /> }
+          />
+          <SignalExample
+            name='Blocked'
+            signal={ <BlockedSignal /> }
+          />
+          <SignalExample
+            name='Missing metadata'
+            signal={ <MissingMetadataSignal /> }
+          />
+          <SignalExample
+            name='Warning'
+            signal={ <WarningSignal /> }
+          />
+          <SignalExample
+            name='Awaiting approval'
+            signal={ <AwaitingApprovalSignal /> }
+          />
+          <SignalExample
+            name='Trending'
+            signal={ <TrendingSignal /> }
+          />
+          <SignalExample
+            name='Someone checked out'
+            signal={ <SomeoneCheckedOutSignal /> }
+          />
+          <SignalExample
+            name='New'
+            signal={ <NewSignal /> }
+          />
+          <SignalExample
+            name='New (positioning)'
+            signal={ <NewSignal /> }
+            text='O'
+          />
+          <SignalExample
+            name='Live edit'
+            signal={ <LiveEditSignal /> }
+          />
+          <SignalExample
+            name='Mention'
+            signal={ <MentionSignal /> }
+          />
+          <SignalExample
+            name='Comments'
+            signal={ <CommentsSignal /> }
+          />
+          <SignalExample
+            name='Comments (count)'
+            signal={ <CommentsSignal>2</CommentsSignal> }
+          />
+          <SignalExample
+            name='Unseen edit'
+            signal={ <UnseenEditSignal /> }
+          />
+          <SignalExample
+            name='Read-only'
+            signal={ <ReadOnlySignal /> }
+          />
+          <SignalExample
+            name='Shared'
+            signal={ <SharedSignal /> }
+          />
+        </div>
+      </div>
+    );
+  }
+
+  @autobind
+  private _onFontSizeChoiceChanged(option: IChoiceGroupOption): void {
+    this.setState({
+      fontSize: option.key as ISignalsBasicExampleState['fontSize']
+    });
+  }
+
+  @autobind
+  private _onIsDarkChanged(ev: React.FormEvent<HTMLElement>, checked: boolean): void {
+    this.setState({
+      isDark: checked
+    });
+  }
+}
diff --git a/packages/experiments/src/components/signals/examples/Signals.Example.scss b/packages/experiments/src/components/signals/examples/Signals.Example.scss
new file mode 100644
index 0000000000000..78b4d9f833c00
--- /dev/null
+++ b/packages/experiments/src/components/signals/examples/Signals.Example.scss
@@ -0,0 +1,25 @@
+
+@import '~office-ui-fabric-react/src/common/common';
+
+.example {
+  padding: 8px;
+
+  transition: color 0.2s linear, background-color 0.2s linear;
+}
+
+.small {
+  font-size: $ms-font-size-s;
+}
+
+.medium {
+  font-size: $ms-font-size-m;
+}
+
+.large {
+  font-size: $ms-font-size-l;
+}
+
+.dark {
+  background-color: $ms-color-neutralDark;
+  color: $ms-color-white;
+}
diff --git a/packages/experiments/src/demo/AppDefinition.tsx b/packages/experiments/src/demo/AppDefinition.tsx
index 34c59d5027382..958c7d51e0780 100644
--- a/packages/experiments/src/demo/AppDefinition.tsx
+++ b/packages/experiments/src/demo/AppDefinition.tsx
@@ -34,6 +34,12 @@ export const AppDefinition: IAppDefinition = {
           name: 'LayoutGroup',
           url: '#/examples/layoutgroup'
         },
+        {
+          component: require<any>('../components/signals/SignalsPage').SignalsPage,
+          key: 'Signals',
+          name: 'Signals',
+          url: '#/examples/signals'
+        },
         {
           component: require<any>('../components/Tile/TilePage').TilePage,
           key: 'Tile',

From 47489be3b126985493d1532368f7ea309f706f3e Mon Sep 17 00:00:00 2001
From: Michael Loughry <miclo@microsoft.com>
Date: Thu, 30 Nov 2017 17:44:23 -0800
Subject: [PATCH 1092/1641] Create visual regression tests for the font stacks
 (#3490)

---
 apps/vr-tests/package.json                  |  1 +
 apps/vr-tests/src/stories/Fonts.stories.tsx | 76 +++++++++++++++++++++
 2 files changed, 77 insertions(+)
 create mode 100644 apps/vr-tests/src/stories/Fonts.stories.tsx

diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 5b0dce49bf86c..c1888dc7c58fd 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,6 +29,7 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
+    "@uifabric/styling": ">=5.12.0 <6.0.0",
     "office-ui-fabric-react": ">=5.28.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/vr-tests/src/stories/Fonts.stories.tsx b/apps/vr-tests/src/stories/Fonts.stories.tsx
new file mode 100644
index 0000000000000..8c518eaaa914f
--- /dev/null
+++ b/apps/vr-tests/src/stories/Fonts.stories.tsx
@@ -0,0 +1,76 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { createFontStyles } from '@uifabric/styling';
+
+const RepresentativeText = (props: { style: React.CSSProperties }) => (
+  <div style={ props.style }>
+    <p id='ar'>استكشف بعض الميزات الجديدة.</p>
+    <p id='bg'>Да разгледаме някои нови функции.</p>
+    <p id='cs'>Podívejme se na některé nové funkce.</p>
+    <p id='el'>Ας εξετάσουμε ορισμένες νέες δυνατότητες.</p>
+    <p id='en'>Let's explore some new features.</p>
+    <p id='he'>בוא נבחן כמה תכונות חדשות.</p>
+    <p id='hi'>आइए कुछ नई सुविधाओं का अन्वेषण करें.</p>
+    <p id='ja'>新しい機能をご紹介します。</p>
+    <p id='ko'>몇 가지 새로운 기능을 살펴보겠습니다.</p>
+    <p id='th'>มาดูฟีเจอร์ใหม่บางอย่างกัน</p>
+    <p id='vi'>Hãy khám phá một số tính năng mới.</p>
+    <p id='zh-Hans'>让我们来探索一些新功能。</p>
+    <p id='zh-Hant'>讓我們探索一些新的功能。</p>
+  </div>
+);
+
+storiesOf('Fonts', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Screener.Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Arabic', () => (
+    <RepresentativeText style={ createFontStyles('ar').medium as React.CSSProperties } />
+  ))
+  .add('Chinese (Simplified)', () => (
+    <RepresentativeText style={ createFontStyles('zh-Hans').medium as React.CSSProperties } />
+  ))
+  .add('Chinese (Traditional)', () => (
+    <RepresentativeText style={ createFontStyles('zh-Hant').medium as React.CSSProperties } />
+  ))
+  .add('Cyrillic', () => (
+    <RepresentativeText style={ createFontStyles('bg').medium as React.CSSProperties } />
+  ))
+  .add('East European', () => (
+    <RepresentativeText style={ createFontStyles('cs').medium as React.CSSProperties } />
+  ))
+  .add('Greek', () => (
+    <RepresentativeText style={ createFontStyles('el').medium as React.CSSProperties } />
+  ))
+  .add('Hebrew', () => (
+    <RepresentativeText style={ createFontStyles('he').medium as React.CSSProperties } />
+  ))
+  .add('Hindi', () => (
+    <RepresentativeText style={ createFontStyles('hi').medium as React.CSSProperties } />
+  ))
+  .add('Japanese', () => (
+    <RepresentativeText style={ createFontStyles('ja').medium as React.CSSProperties } />
+  ))
+  .add('Korean', () => (
+    <RepresentativeText style={ createFontStyles('ko').medium as React.CSSProperties } />
+  ))
+  .add('Thai', () => (
+    <RepresentativeText style={ createFontStyles('th').medium as React.CSSProperties } />
+  ))
+  .add('Vietnamese', () => (
+    <RepresentativeText style={ createFontStyles('vi').medium as React.CSSProperties } />
+  ))
+  .add('West European', () => (
+    <RepresentativeText style={ createFontStyles('en').medium as React.CSSProperties } />
+  ))
\ No newline at end of file

From df00b312271aff8c1b662b593caf1724271210d4 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 30 Nov 2017 18:10:17 -0800
Subject: [PATCH 1093/1641] Merge-styles now has onInsertRule optional callback
 (#3498)

* Updating appendChild mode in merge-styles to create new style elements each time, to avoid flashes in the ui.

* Adding callback.

* oops.

* adding change file.

* Small refactor to reduce bytes.

* rename.

* .5 size bump.
---
 .../merge-styles-fix_2017-12-01-00-44.json    | 11 ++++++++
 packages/merge-styles/src/Stylesheet.ts       | 25 +++++++++++++++----
 scripts/package.json                          |  2 +-
 3 files changed, 32 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/@uifabric/merge-styles/merge-styles-fix_2017-12-01-00-44.json

diff --git a/common/changes/@uifabric/merge-styles/merge-styles-fix_2017-12-01-00-44.json b/common/changes/@uifabric/merge-styles/merge-styles-fix_2017-12-01-00-44.json
new file mode 100644
index 0000000000000..64f1dd64eb415
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/merge-styles-fix_2017-12-01-00-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "Adding `onInsertNode` callback and adjusting appendChild method for injecting styles to not cause flashes.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/merge-styles/src/Stylesheet.ts b/packages/merge-styles/src/Stylesheet.ts
index 6e6db05af6567..bc92184fc47d0 100644
--- a/packages/merge-styles/src/Stylesheet.ts
+++ b/packages/merge-styles/src/Stylesheet.ts
@@ -31,6 +31,7 @@ export interface IStyleSheetConfig {
    * Injection mode for how rules are inserted.
    */
   injectionMode?: InjectionMode;
+  onInsertRule?: (rule: string) => void;
 }
 
 const STYLESHEET_SETTING = '__stylesheet__';
@@ -171,13 +172,17 @@ export class Stylesheet {
         break;
 
       case InjectionMode.appendChild:
-        element!.appendChild(document.createTextNode(rule));
+        _createStyleElement(rule);
         break;
 
       default:
         this._rules.push(rule);
         break;
     }
+
+    if (this._config.onInsertRule) {
+      this._config.onInsertRule(rule);
+    }
   }
 
   /**
@@ -207,11 +212,21 @@ export class Stylesheet {
 
   private _getElement(): HTMLStyleElement | undefined {
     if (!this._styleElement && typeof document !== 'undefined') {
-      this._styleElement = document.createElement('style');
-      this._styleElement.setAttribute('data-merge-styles', 'true');
-      document.head.appendChild(this._styleElement);
+      this._styleElement = _createStyleElement();
     }
-
     return this._styleElement;
   }
 }
+
+function _createStyleElement(content?: string): HTMLStyleElement {
+  const styleElement = document.createElement('style');
+
+  styleElement.setAttribute('data-merge-styles', 'true');
+  styleElement.type = 'text/css';
+  if (content) {
+    styleElement.appendChild(document.createTextNode(content));
+  }
+  document.head.appendChild(styleElement);
+
+  return styleElement;
+}
\ No newline at end of file
diff --git a/scripts/package.json b/scripts/package.json
index fc8d97efc0ce3..df2a4fe047e71 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -49,7 +49,7 @@
   "bundlesize": [
     {
       "path": "../apps/test-bundle-button/dist/main.min.js",
-      "maxSize": "42 kB"
+      "maxSize": "42.5 kB"
     }
   ]
 }
\ No newline at end of file

From 09f07e02dacb39516242b91bf7ce1b221313a5d7 Mon Sep 17 00:00:00 2001
From: "David Wilson (VSNC)" <dawilson@microsoft.com>
Date: Thu, 30 Nov 2017 21:14:46 -0500
Subject: [PATCH 1094/1641] FocusZone: Fix focus-in behavior when children are
 added asynchronously. (#3442) (#3443)

---
 .../focuszone_2017-11-21-19-15.json                  | 11 +++++++++++
 .../src/components/FocusZone/FocusZone.tsx           | 12 ++++++++----
 2 files changed, 19 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/focuszone_2017-11-21-19-15.json

diff --git a/common/changes/office-ui-fabric-react/focuszone_2017-11-21-19-15.json b/common/changes/office-ui-fabric-react/focuszone_2017-11-21-19-15.json
new file mode 100644
index 0000000000000..84d54272843a6
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/focuszone_2017-11-21-19-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "FocusZone: Fix focus-in behavior when children are added asynchronously.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dawilson@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 2bf01adae0f3c..f7bce65c291d3 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -51,7 +51,10 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
   private _root: HTMLElement;
   private _id: string;
+  /** The most recently focused child element. */
   private _activeElement: HTMLElement | null;
+  /** The child element with tabindex=0. */
+  private _defaultFocusElement: HTMLElement | null;
   private _focusAlignment: IPoint;
   private _isInnerZone: boolean;
 
@@ -695,6 +698,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
   private _updateTabIndexes(element?: HTMLElement) {
     if (!element) {
+      this._defaultFocusElement = null;
       element = this._root;
       if (this._activeElement && !elementContains(element, this._activeElement)) {
         this._activeElement = null;
@@ -721,8 +725,8 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
         if (isElementTabbable(child)) {
           if (this.props.disabled) {
             child.setAttribute(TABINDEX, '-1');
-          } else if (!this._isInnerZone && (!this._activeElement || this._activeElement === child)) {
-            this._activeElement = child;
+          } else if (!this._isInnerZone && ((!this._activeElement && !this._defaultFocusElement) || this._activeElement === child)) {
+            this._defaultFocusElement = child;
             if (child.getAttribute(TABINDEX) !== '0') {
               child.setAttribute(TABINDEX, '0');
             }
@@ -734,8 +738,8 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
           child.setAttribute('focusable', 'false');
         }
       } else if (child.getAttribute(IS_FOCUSABLE_ATTRIBUTE) === 'true') {
-        if (!this._isInnerZone && (!this._activeElement || this._activeElement === child)) {
-          this._activeElement = child;
+        if (!this._isInnerZone && ((!this._activeElement && !this._defaultFocusElement) || this._activeElement === child)) {
+          this._defaultFocusElement = child;
           if (child.getAttribute(TABINDEX) !== '0') {
             child.setAttribute(TABINDEX, '0');
           }

From 3e885ee579cac2cf8a5596f7936362628495e2f6 Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Thu, 30 Nov 2017 18:17:09 -0800
Subject: [PATCH 1095/1641] DatePicker-reset invalid input (when formatting is
 available) (#3390)

* no message

* no message

* Reset invalid input field when date is invalid and formatting is available.

* Fixed missing space at start of comment.  Added change file

* If formatted date is valid, but is different than input, update with formatted date

* Adding space for comment error

* Adding more comments

* Update kegorr-DatePicker-resetInvalidInput_2017-11-14-21-07.json
---
 ...er-resetInvalidInput_2017-11-14-21-07.json | 11 ++++++++++
 .../src/components/DatePicker/DatePicker.tsx  | 22 ++++++++++++++++++-
 2 files changed, 32 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-DatePicker-resetInvalidInput_2017-11-14-21-07.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-DatePicker-resetInvalidInput_2017-11-14-21-07.json b/common/changes/office-ui-fabric-react/kegorr-DatePicker-resetInvalidInput_2017-11-14-21-07.json
new file mode 100644
index 0000000000000..d09adfbc6ccbf
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-DatePicker-resetInvalidInput_2017-11-14-21-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DatePicker: Reset invalid input (typed by used).",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 60f7212e63735..5c33a9e4bb797 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -430,10 +430,22 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
           date = this.state.selectedDate;
         } else {
           date = parseDateFromString!(inputValue);
-          if (!date) {
+
+          // Check if date is null, or date is Invalid Date
+          if (!date || isNaN(date.getTime())) {
+
+            // Reset invalid input field, if formatting is available
+            if (formatDate) {
+              date = this.state.selectedDate;
+              this.setState({
+                formattedDate: formatDate(date!).toString()
+              });
+            }
+
             this.setState({
               errorMessage: strings!.invalidInputErrorMessage || '*'
             });
+
           } else {
             // Check against optional date boundaries
             if (this._isDateOutOfBounds(date, minDate, maxDate)) {
@@ -445,6 +457,14 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
                 selectedDate: date,
                 errorMessage: ''
               });
+
+              // When formatting is available. If formatted date is valid, but is different from input, update with formatted date
+              // This occurs when an invalid date is entered twice
+              if (formatDate && formatDate(date) !== inputValue) {
+                this.setState({
+                  formattedDate: formatDate(date).toString()
+                });
+              }
             }
           }
         }

From d2d2548b5e4f03d1df2ec2e0fcafb20358ab1ad7 Mon Sep 17 00:00:00 2001
From: Ben Truelove <betrue@microsoft.com>
Date: Thu, 30 Nov 2017 18:27:54 -0800
Subject: [PATCH 1096/1641] Aligned option height with rest of menus. (#3289)

* Aligned option height with rest of menus.

* added change file
---
 .../betrue-fixMenuHeights_2017-11-02-23-19.json       | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.styles.ts        |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/betrue-fixMenuHeights_2017-11-02-23-19.json

diff --git a/common/changes/office-ui-fabric-react/betrue-fixMenuHeights_2017-11-02-23-19.json b/common/changes/office-ui-fabric-react/betrue-fixMenuHeights_2017-11-02-23-19.json
new file mode 100644
index 0000000000000..4cc0cf7790c8c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/betrue-fixMenuHeights_2017-11-02-23-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Changed combobox option height to match other menu option heights",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "betrue@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index 6f5b55b1ddd2b..4ca9995e885f3 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -18,7 +18,7 @@ import { memoizeFunction } from '../../Utilities';
 const ComboBoxHeight = '32px';
 const ComboBoxLineHeight = '30px';
 const ComboxBoxCaretDownWidth = '32px';
-const ComboBoxOptionHeight = '36px';
+const ComboBoxOptionHeight = '32px';
 
 const getDisabledStyles = memoizeFunction((theme: ITheme): IRawStyle => {
   const { semanticColors } = theme;

From aaeed1ac710b6031c3c2e4c35f663d78775bda73 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Fri, 1 Dec 2017 00:09:51 -0800
Subject: [PATCH 1097/1641] ComboBox: Allow for dropdown to automatically fit
 its content (#3495)

* Allow ComboBox dropdown to be autosized (e.g. not defined a width)

* slightly update a comment and rush change

* add new parameter to allow for not using the comboBox width

* update comment and add a mutuallyExclusive warning for dropdownWidth and useComboBoxAsMenuWidth
---
 ...oBoxAllowForAutoSizeDropdown_2017-12-01-00-04.json | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.tsx              | 11 ++++++++---
 .../src/components/ComboBox/ComboBox.types.ts         |  8 ++++++--
 3 files changed, 25 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxAllowForAutoSizeDropdown_2017-12-01-00-04.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxAllowForAutoSizeDropdown_2017-12-01-00-04.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxAllowForAutoSizeDropdown_2017-12-01-00-04.json
new file mode 100644
index 0000000000000..39bb87929ab61
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxAllowForAutoSizeDropdown_2017-12-01-00-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Update to allow the dropdown to fit its content",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 05c566b44ec58..b5fdba603162e 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -137,7 +137,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     this._warnMutuallyExclusive({
       'defaultSelectedKey': 'selectedKey',
       'value': 'defaultSelectedKey',
-      'selectedKey': 'value'
+      'selectedKey': 'value',
+      'dropdownWidth': 'useComboBoxAsMenuWidth'
     });
 
     this._id = props.id || getId('ComboBox');
@@ -805,7 +806,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       onRenderList,
       calloutProps,
       dropdownWidth,
-      onRenderLowerContent = this._onRenderLowerContent
+      onRenderLowerContent = this._onRenderLowerContent,
+      useComboBoxAsMenuWidth
     } = props;
 
     return (
@@ -821,7 +823,10 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         onDismiss={ this._onDismiss }
         onScroll={ this._onScroll }
         setInitialFocus={ false }
-        calloutWidth={ dropdownWidth || this._comboBoxWrapper.clientWidth + 2 }
+        calloutWidth={
+          useComboBoxAsMenuWidth ?
+            this._comboBoxWrapper.clientWidth + 2
+            : dropdownWidth }
       >
         <div className={ this._classNames.optionsContainerWrapper } ref={ this._resolveRef('_comboBoxMenu') }>
           { (onRenderList as any)({ ...props }, this._onRenderList) }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
index 10e4e80560e23..ac84a49e3ab11 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
@@ -119,10 +119,14 @@ export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox>
   onRenderLowerContent?: IRenderFunction<IComboBoxProps>;
 
   /**
-  * Custom width for dropdown. If value is 0, width of the input field is used.
-  * @default 0
+  * Custom width for dropdown (unless useComboBoxAsMenuWidth is undefined or false)
   */
   dropdownWidth?: number;
+
+  /**
+   * Whether to use the ComboBoxes width as the menu's width
+   */
+  useComboBoxAsMenuWidth?: boolean;
 }
 
 export interface IComboBoxStyles {

From a0800c5f1efac392af4deaee9475efb316583076 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 1 Dec 2017 11:11:16 +0000
Subject: [PATCH 1098/1641] Applying package updates.

---
 ...-fix-external-signal_2017-11-27-22-57.json | 11 ----
 .../icon-options_2017-11-29-19-32.json        | 11 ----
 .../experiments/signals_2017-11-30-20-09.json | 11 ----
 .../merge-styles-fix_2017-12-01-00-44.json    | 11 ----
 ...h-localized-ui-fonts_2017-11-29-21-50.json | 11 ----
 ...tima-groupheader-css_2017-12-01-00-00.json | 11 ----
 ...etrue-fixMenuHeights_2017-11-02-23-19.json | 11 ----
 .../focuszone_2017-11-21-19-15.json           | 11 ----
 .../icon-options_2017-11-29-19-32.json        | 11 ----
 ...wForAutoSizeDropdown_2017-12-01-00-04.json | 11 ----
 ...Picker-CalendarProps_2017-11-27-22-49.json | 11 ----
 ...er-resetInvalidInput_2017-11-14-21-07.json | 11 ----
 ...ozano-ExposeOnDimiss_2017-12-01-00-36.json | 11 ----
 .../persona-coinsize_2017-11-07-18-53.json    | 11 ----
 ...panelhiddenondismiss_2017-11-29-21-30.json | 11 ----
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/CHANGELOG.json           | 26 ++++++++
 packages/experiments/CHANGELOG.md             | 13 +++-
 packages/experiments/package.json             |  4 +-
 .../jest-serializer-merge-styles/package.json |  2 +-
 packages/merge-styles/CHANGELOG.json          | 14 ++++
 packages/merge-styles/CHANGELOG.md            |  9 ++-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 64 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 20 +++++-
 packages/office-ui-fabric-react/package.json  |  6 +-
 packages/styling/CHANGELOG.json               | 19 ++++++
 packages/styling/CHANGELOG.md                 |  9 ++-
 packages/styling/package.json                 |  4 +-
 packages/utilities/package.json               |  2 +-
 scripts/package.json                          |  2 +-
 31 files changed, 182 insertions(+), 181 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/brwatt-fix-external-signal_2017-11-27-22-57.json
 delete mode 100644 common/changes/@uifabric/experiments/icon-options_2017-11-29-19-32.json
 delete mode 100644 common/changes/@uifabric/experiments/signals_2017-11-30-20-09.json
 delete mode 100644 common/changes/@uifabric/merge-styles/merge-styles-fix_2017-12-01-00-44.json
 delete mode 100644 common/changes/@uifabric/styling/phloh-localized-ui-fonts_2017-11-29-21-50.json
 delete mode 100644 common/changes/office-ui-fabric-react/aditima-groupheader-css_2017-12-01-00-00.json
 delete mode 100644 common/changes/office-ui-fabric-react/betrue-fixMenuHeights_2017-11-02-23-19.json
 delete mode 100644 common/changes/office-ui-fabric-react/focuszone_2017-11-21-19-15.json
 delete mode 100644 common/changes/office-ui-fabric-react/icon-options_2017-11-29-19-32.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxAllowForAutoSizeDropdown_2017-12-01-00-04.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-DatePicker-CalendarProps_2017-11-27-22-49.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-DatePicker-resetInvalidInput_2017-11-14-21-07.json
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-ExposeOnDimiss_2017-12-01-00-36.json
 delete mode 100644 common/changes/office-ui-fabric-react/persona-coinsize_2017-11-07-18-53.json
 delete mode 100644 common/changes/office-ui-fabric-react/tecambri-panelhiddenondismiss_2017-11-29-21-30.json

diff --git a/common/changes/@uifabric/experiments/brwatt-fix-external-signal_2017-11-27-22-57.json b/common/changes/@uifabric/experiments/brwatt-fix-external-signal_2017-11-27-22-57.json
deleted file mode 100644
index 340d9d562fa4c..0000000000000
--- a/common/changes/@uifabric/experiments/brwatt-fix-external-signal_2017-11-27-22-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Fixes the external signal component",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "brwatt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/icon-options_2017-11-29-19-32.json b/common/changes/@uifabric/experiments/icon-options_2017-11-29-19-32.json
deleted file mode 100644
index 2098be827ee86..0000000000000
--- a/common/changes/@uifabric/experiments/icon-options_2017-11-29-19-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/experiments",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/signals_2017-11-30-20-09.json b/common/changes/@uifabric/experiments/signals_2017-11-30-20-09.json
deleted file mode 100644
index 26a710eb19eec..0000000000000
--- a/common/changes/@uifabric/experiments/signals_2017-11-30-20-09.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Revise Signals and provide example page",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/merge-styles-fix_2017-12-01-00-44.json b/common/changes/@uifabric/merge-styles/merge-styles-fix_2017-12-01-00-44.json
deleted file mode 100644
index 64f1dd64eb415..0000000000000
--- a/common/changes/@uifabric/merge-styles/merge-styles-fix_2017-12-01-00-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "Adding `onInsertNode` callback and adjusting appendChild method for injecting styles to not cause flashes.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/phloh-localized-ui-fonts_2017-11-29-21-50.json b/common/changes/@uifabric/styling/phloh-localized-ui-fonts_2017-11-29-21-50.json
deleted file mode 100644
index 4088afaec698b..0000000000000
--- a/common/changes/@uifabric/styling/phloh-localized-ui-fonts_2017-11-29-21-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Use Yu Gothic UI, Microsoft Yahei UI, Microsoft Jhenghei UI",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "phloh@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/aditima-groupheader-css_2017-12-01-00-00.json b/common/changes/office-ui-fabric-react/aditima-groupheader-css_2017-12-01-00-00.json
deleted file mode 100644
index 5bf4e5d8dc463..0000000000000
--- a/common/changes/office-ui-fabric-react/aditima-groupheader-css_2017-12-01-00-00.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "GroupHeader: Style fix to add nowrap on group header",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "aditima@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/betrue-fixMenuHeights_2017-11-02-23-19.json b/common/changes/office-ui-fabric-react/betrue-fixMenuHeights_2017-11-02-23-19.json
deleted file mode 100644
index 4cc0cf7790c8c..0000000000000
--- a/common/changes/office-ui-fabric-react/betrue-fixMenuHeights_2017-11-02-23-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Changed combobox option height to match other menu option heights",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "betrue@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/focuszone_2017-11-21-19-15.json b/common/changes/office-ui-fabric-react/focuszone_2017-11-21-19-15.json
deleted file mode 100644
index 84d54272843a6..0000000000000
--- a/common/changes/office-ui-fabric-react/focuszone_2017-11-21-19-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "FocusZone: Fix focus-in behavior when children are added asynchronously.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dawilson@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/icon-options_2017-11-29-19-32.json b/common/changes/office-ui-fabric-react/icon-options_2017-11-29-19-32.json
deleted file mode 100644
index bdac204cd2e2e..0000000000000
--- a/common/changes/office-ui-fabric-react/icon-options_2017-11-29-19-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "office-ui-fabric-react",
-      "type": "none"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxAllowForAutoSizeDropdown_2017-12-01-00-04.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxAllowForAutoSizeDropdown_2017-12-01-00-04.json
deleted file mode 100644
index 39bb87929ab61..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxAllowForAutoSizeDropdown_2017-12-01-00-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Update to allow the dropdown to fit its content",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kegorr-DatePicker-CalendarProps_2017-11-27-22-49.json b/common/changes/office-ui-fabric-react/kegorr-DatePicker-CalendarProps_2017-11-27-22-49.json
deleted file mode 100644
index 331a8cd430626..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-DatePicker-CalendarProps_2017-11-27-22-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DatePicker: Calendar Props.  Adding access to ICalendarProps",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kegorr-DatePicker-resetInvalidInput_2017-11-14-21-07.json b/common/changes/office-ui-fabric-react/kegorr-DatePicker-resetInvalidInput_2017-11-14-21-07.json
deleted file mode 100644
index d09adfbc6ccbf..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-DatePicker-resetInvalidInput_2017-11-14-21-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DatePicker: Reset invalid input (typed by used).",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/malozano-ExposeOnDimiss_2017-12-01-00-36.json b/common/changes/office-ui-fabric-react/malozano-ExposeOnDimiss_2017-12-01-00-36.json
deleted file mode 100644
index 257c0205684f7..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-ExposeOnDimiss_2017-12-01-00-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: Expose callback hook when menu is being removed from DOM",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/persona-coinsize_2017-11-07-18-53.json b/common/changes/office-ui-fabric-react/persona-coinsize_2017-11-07-18-53.json
deleted file mode 100644
index 9e16ca9b35882..0000000000000
--- a/common/changes/office-ui-fabric-react/persona-coinsize_2017-11-07-18-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "PersonaPresence: Scale the presence and presence icon proportionally to the specified coinSize up to a max size.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/tecambri-panelhiddenondismiss_2017-11-29-21-30.json b/common/changes/office-ui-fabric-react/tecambri-panelhiddenondismiss_2017-11-29-21-30.json
deleted file mode 100644
index 5b4ff672efbfb..0000000000000
--- a/common/changes/office-ui-fabric-react/tecambri-panelhiddenondismiss_2017-11-29-21-30.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Panel: When panel is dismissed, hide the panel instead of destroying it",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "tecambri@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 027f36bc5dc06..4b2e7ee1a39b5 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -38,7 +38,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.12.0 <6.0.0",
+    "@uifabric/styling": ">=5.12.1 <6.0.0",
     "@uifabric/utilities": ">=5.5.0 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 8b5f3be59557d..c863359847bdd 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.8.0",
+      "tag": "@uifabric/experiments_v5.8.0",
+      "date": "Fri, 01 Dec 2017 11:11:16 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Bryan Watts <brwatt@microsoft.com>",
+            "commit": "95fa0ed17e7adc25e1c18977387a0ca840d3025a",
+            "comment": "Fixes the external signal component"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "b1c7686173a7f56d894e1b90625df0132375b1ee",
+            "comment": "Revise Signals and provide example page"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.28.0 <6.0.0` to `>=5.29.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.7.0",
       "tag": "@uifabric/experiments_v5.7.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 7f877e6b4f4e0..2043811b9e63f 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Wed, 29 Nov 2017 11:24:05 GMT and should not be manually modified.
+This log was last generated on Fri, 01 Dec 2017 11:11:16 GMT and should not be manually modified.
+
+## 5.8.0
+Fri, 01 Dec 2017 11:11:16 GMT
+
+### Minor changes
+
+- Revise Signals and provide example page
+
+### Patches
+
+- Fixes the external signal component
 
 ## 5.7.0
 Wed, 29 Nov 2017 11:24:05 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 09779b8e186e3..2fb486068675f 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.7.0",
+  "version": "5.8.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,7 +43,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.28.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.0 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/jest-serializer-merge-styles/package.json b/packages/jest-serializer-merge-styles/package.json
index c72af59d13961..1f659c280e008 100644
--- a/packages/jest-serializer-merge-styles/package.json
+++ b/packages/jest-serializer-merge-styles/package.json
@@ -24,6 +24,6 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/merge-styles": ">=5.7.0 <6.0.0"
+    "@uifabric/merge-styles": ">=5.8.0 <6.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index c1fe76f413ff5..14ae3ad617d2b 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.8.0",
+      "tag": "@uifabric/merge-styles_v5.8.0",
+      "date": "Fri, 01 Dec 2017 11:11:16 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "df00b312271aff8c1b662b593caf1724271210d4",
+            "comment": "Adding `onInsertNode` callback and adjusting appendChild method for injecting styles to not cause flashes."
+          }
+        ]
+      }
+    },
     {
       "version": "5.7.0",
       "tag": "@uifabric/merge-styles_v5.7.0",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index 465bcae14702b..458d6c666bcd4 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Wed, 29 Nov 2017 11:24:05 GMT and should not be manually modified.
+This log was last generated on Fri, 01 Dec 2017 11:11:16 GMT and should not be manually modified.
+
+## 5.8.0
+Fri, 01 Dec 2017 11:11:16 GMT
+
+### Minor changes
+
+- Adding `onInsertNode` callback and adjusting appendChild method for injecting styles to not cause flashes.
 
 ## 5.7.0
 Wed, 29 Nov 2017 11:24:05 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index 7f1f5f212cca7..bcc8f00a6e41d 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.7.0",
+  "version": "5.8.0",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index ae49dbad04f32..4c2fbb8024c68 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,70 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.29.0",
+      "tag": "office-ui-fabric-react_v5.29.0",
+      "date": "Fri, 01 Dec 2017 11:11:16 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Aditi Mandal <aditima@microsoft.com>",
+            "commit": "1797c419ddf414b87f064928cc34ba925ce048b4",
+            "comment": "GroupHeader: Style fix to add nowrap on group header"
+          },
+          {
+            "author": "Ben Truelove <betrue@microsoft.com>",
+            "commit": "d2d2548b5e4f03d1df2ec2e0fcafb20358ab1ad7",
+            "comment": "Changed combobox option height to match other menu option heights"
+          },
+          {
+            "author": "David Wilson (VSNC) <dawilson@microsoft.com>",
+            "commit": "09f07e02dacb39516242b91bf7ce1b221313a5d7",
+            "comment": "FocusZone: Fix focus-in behavior when children are added asynchronously."
+          },
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "aaeed1ac710b6031c3c2e4c35f663d78775bda73",
+            "comment": "ComboBox: Update to allow the dropdown to fit its content"
+          },
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "3e885ee579cac2cf8a5596f7936362628495e2f6",
+            "comment": "DatePicker: Reset invalid input (typed by used)."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "2207c10859801f04a37b682f14f83d67267022ed",
+            "comment": "PersonaPresence: Scale the presence and presence icon proportionally to the specified coinSize up to a max size."
+          }
+        ],
+        "minor": [
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "2e8e4893e78c7ffbfbd1a50e8205a81aff6b4f53",
+            "comment": "DatePicker: Calendar Props.  Adding access to ICalendarProps"
+          },
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "d99de57c86d8cd2110ad603b746ffe33c3fae7d4",
+            "comment": "ContextualMenu: Expose callback hook when menu is being removed from DOM"
+          },
+          {
+            "author": "Terri-Anne Cambridge <tacambridge@gmail.com>",
+            "commit": "742066348a7213c26fbadce6b97e2083b72275a9",
+            "comment": "Panel: When panel is dismissed, hide the panel instead of destroying it"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.7.0 <6.0.0` to `>=5.8.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.12.0 <6.0.0` to `>=5.12.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.28.0",
       "tag": "office-ui-fabric-react_v5.28.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 6b26f67677cf1..acc64206f13df 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,24 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 30 Nov 2017 01:16:12 GMT and should not be manually modified.
+This log was last generated on Fri, 01 Dec 2017 11:11:16 GMT and should not be manually modified.
+
+## 5.29.0
+Fri, 01 Dec 2017 11:11:16 GMT
+
+### Minor changes
+
+- DatePicker: Calendar Props.  Adding access to ICalendarProps
+- ContextualMenu: Expose callback hook when menu is being removed from DOM
+- Panel: When panel is dismissed, hide the panel instead of destroying it
+
+### Patches
+
+- GroupHeader: Style fix to add nowrap on group header
+- Changed combobox option height to match other menu option heights
+- FocusZone: Fix focus-in behavior when children are added asynchronously.
+- ComboBox: Update to allow the dropdown to fit its content
+- DatePicker: Reset invalid input (typed by used).
+- PersonaPresence: Scale the presence and presence icon proportionally to the specified coinSize up to a max size.
 
 ## 5.28.0
 Thu, 30 Nov 2017 01:16:12 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 2a09864dfe4e9..fc55817ab070e 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.28.0",
+  "version": "5.29.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -46,8 +46,8 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.7.0 <6.0.0",
-    "@uifabric/styling": ">=5.12.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.8.0 <6.0.0",
+    "@uifabric/styling": ">=5.12.1 <6.0.0",
     "@uifabric/utilities": ">=5.5.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 200c8fbe426c3..321cb2c29bd11 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.12.1",
+      "tag": "@uifabric/styling_v5.12.1",
+      "date": "Fri, 01 Dec 2017 11:11:16 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "philipzloh <philip.loh@students.olin.edu>",
+            "commit": "491764a41bf4fe95e0bc7bfc20fe150f0edd9d11",
+            "comment": "Use Yu Gothic UI, Microsoft Yahei UI, Microsoft Jhenghei UI"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.7.0 <6.0.0` to `>=5.8.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.12.0",
       "tag": "@uifabric/styling_v5.12.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 3839d74d0e418..1f50ba835ab64 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 30 Nov 2017 11:23:35 GMT and should not be manually modified.
+This log was last generated on Fri, 01 Dec 2017 11:11:16 GMT and should not be manually modified.
+
+## 5.12.1
+Fri, 01 Dec 2017 11:11:16 GMT
+
+### Patches
+
+- Use Yu Gothic UI, Microsoft Yahei UI, Microsoft Jhenghei UI
 
 ## 5.12.0
 Thu, 30 Nov 2017 11:23:35 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 075753fb2858a..ebccf66901124 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.12.0",
+  "version": "5.12.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "repository": {
     "type": "git",
@@ -29,7 +29,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/utilities": ">=5.5.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.7.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.8.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index e4a6d16a09f55..35102b6ed2a1a 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -34,7 +34,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/merge-styles": ">=5.7.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.8.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/scripts/package.json b/scripts/package.json
index df2a4fe047e71..cc33497ad2e89 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -11,7 +11,7 @@
     "@microsoft/api-extractor": "^4.2.6",
     "@microsoft/load-themed-styles": "^1.7.5",
     "@microsoft/loader-load-themed-styles": "^1.6.0",
-    "@uifabric/merge-styles": ">=5.7.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.8.0 <6.0.0",
     "autoprefixer": "^7.1.5",
     "awesome-typescript-loader": "^3.2.3",
     "bundlesize": "^0.15.2",

From 188a689a4a786216f0a7c4505dd952e06687b58f Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Fri, 1 Dec 2017 08:45:52 -0800
Subject: [PATCH 1099/1641] ComboBox: Polish round 2, more refined state
 styling (#3492)

* For hover and active, use rootPressed style

* Added change file

* Updates to ComboBox isopen style and alignment to DetailsList

* Refined pressed, checked, and hover states

* Update combobox-pressed-state_2017-11-28-20-42.json

* Updated snapshots
---
 ...mbobox-pressed-state_2017-11-28-20-42.json | 11 +++++++
 .../ComboBox/ComboBox.classNames.ts           |  2 +-
 .../components/ComboBox/ComboBox.styles.ts    | 31 +++++++++++++------
 .../src/components/ComboBox/ComboBox.tsx      |  1 +
 .../__snapshots__/ComboBox.test.tsx.snap      | 12 ++++---
 5 files changed, 42 insertions(+), 15 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/combobox-pressed-state_2017-11-28-20-42.json

diff --git a/common/changes/office-ui-fabric-react/combobox-pressed-state_2017-11-28-20-42.json b/common/changes/office-ui-fabric-react/combobox-pressed-state_2017-11-28-20-42.json
new file mode 100644
index 0000000000000..b04c586ad1796
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/combobox-pressed-state_2017-11-28-20-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "ComboBox: More refined handling of pressed, checked, focused and hover states for styling.",
+      "packageName": "office-ui-fabric-react",
+      "type": "none"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
index e787a9b2ebf19..2c7bb75634cf5 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
@@ -52,7 +52,7 @@ export const getClassNames = memoizeFunction((
       !disabled && focused && styles.rootFocused,
       !disabled && {
         selectors: {
-          ':hover': styles.rootHovered,
+          ':hover': !isOpen && !focused && styles.rootHovered,
           ':active': styles.rootPressed,
           ':focus': styles.rootFocused
         }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index 4ca9995e885f3..2817bc67cc090 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -136,12 +136,13 @@ export const getCaretDownButtonStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: Partial<IButtonStyles>,
 ): IButtonStyles => {
-  const { palette } = theme;
+  const { semanticColors } = theme;
 
-  const caretButtonTextColor = palette.neutralSecondary;
-  const caretButtonTextColorHoveredActive = palette.neutralDark;
-  const caretButtonBackgroundHovered = palette.neutralQuaternaryAlt;
-  const caretButtonBackgroundActive = palette.neutralTertiaryAlt;
+  const caretButtonTextColor = semanticColors.bodySubtext;
+  const caretButtonTextColorHoveredChecked = semanticColors.buttonTextChecked;
+  const caretButtonBackgroundHovered = semanticColors.listItemBackgroundHovered;
+  const caretButtonBackgroundChecked = semanticColors.listItemBackgroundChecked;
+  const caretButtonBackgroundCheckedHovered = semanticColors.listItemBackgroundCheckedHovered;
 
   const styles: IButtonStyles = {
     root: {
@@ -167,12 +168,20 @@ export const getCaretDownButtonStyles = memoizeFunction((
     },
     rootHovered: {
       backgroundColor: caretButtonBackgroundHovered,
-      color: caretButtonTextColorHoveredActive,
+      color: caretButtonTextColorHoveredChecked,
       cursor: 'pointer'
     },
     rootPressed: {
-      backgroundColor: caretButtonBackgroundActive,
-      color: caretButtonTextColorHoveredActive
+      backgroundColor: caretButtonBackgroundChecked,
+      color: caretButtonTextColorHoveredChecked
+    },
+    rootChecked: {
+      backgroundColor: caretButtonBackgroundChecked,
+      color: caretButtonTextColorHoveredChecked
+    },
+    rootCheckedHovered: {
+      backgroundColor: caretButtonBackgroundCheckedHovered,
+      color: caretButtonTextColorHoveredChecked
     },
     rootDisabled: getDisabledStyles(theme),
   };
@@ -191,7 +200,6 @@ export const getStyles = memoizeFunction((
   const ComboBoxRootTextColor = semanticColors.bodyText;
   const ComboBoxRootBorderColor = semanticColors.inputBorder;
   const ComboBoxRootBorderColorHovered = semanticColors.inputBorderHovered;
-  const ComboBoxRootBorderColorActive = palette.themeDark;
   const ComboBoxRootBorderColorFocused = semanticColors.inputFocusBorderAlt;
   const ComboBoxRootColorErrored = semanticColors.errorText;
   const ComboBoxCalloutBorderColor = palette.neutralLight;
@@ -239,6 +247,9 @@ export const getStyles = memoizeFunction((
                 display: 'none'
               }
             }
+          },
+          '&.is-open': {
+            borderColor: ComboBoxRootBorderColorFocused
           }
         }
       }
@@ -256,7 +267,7 @@ export const getStyles = memoizeFunction((
     },
 
     rootPressed: {
-      borderColor: ComboBoxRootBorderColorActive
+      borderColor: ComboBoxRootBorderColorFocused
     },
 
     rootFocused: {
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index b5fdba603162e..079e376d4c2a1 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -321,6 +321,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
             onClick={ this._onComboBoxClick }
             iconProps={ buttonIconProps }
             disabled={ disabled }
+            checked={ isOpen }
           />
         </div>
 
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
index f525262f5e04c..ce96a7f090f96 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
@@ -45,6 +45,9 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
         & input::-ms-clear {
           display: none;
         }
+        &.is-open {
+          border-color: #0078d7;
+        }
         &:hover {
           border-color: #212121;
         }
@@ -54,7 +57,7 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
           color: HighlightText;
         }
         &:active {
-          border-color: #005a9e;
+          border-color: #0078d7;
         }
         &:focus {
           border-color: #0078d7;
@@ -117,7 +120,8 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
       aria-hidden="true"
       aria-label={undefined}
       aria-labelledby={null}
-      aria-pressed={undefined}
+      aria-pressed={false}
+      checked={false}
       className=
           ms-Button
           ms-Button--icon
@@ -173,12 +177,12 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
             font-size: 12px;
           }
           &:hover {
-            background-color: #dadada;
+            background-color: #f4f4f4;
             color: #212121;
             cursor: pointer;
           }
           &:active {
-            background-color: #c8c8c8;
+            background-color: #eaeaea;
             color: #212121;
           }
       data-is-focusable={true}

From 98a7e2444662ab34b4f3c84daef6afd2b04cbbdd Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Fri, 1 Dec 2017 15:17:19 -0800
Subject: [PATCH 1100/1641] ContextualMenu: Make sure vertical scrollbar does
 not take space away from contents (#3449)

* Initial fix

* Add comments

* Rush change

* Fix tslint

* Update snapshot

* Revert "Update snapshot"

This reverts commit d2558add917bb17b42329f1835505332ac8cfaed.

* Revert "Fix tslint"

This reverts commit d1bf87ce4517badbd77d0c2489413752240328a6.

* Revert "Add comments"

This reverts commit 93245181ba1f420050793ac512c912ce656923dd.

* Revert "Initial fix"

This reverts commit 7bbd9e3094c21e186ca851ffe139b97df1967d15.

* Attempt at a fix

* better fix

* Update snapshots

* Remove unused prop
---
 .../scroll-bar-contextual-menu_2017-11-22-17-25.json  | 11 +++++++++++
 .../src/components/Callout/Callout.scss               |  1 -
 .../Callout/__snapshots__/Callout.test.tsx.snap       |  1 +
 .../src/components/Popup/Popup.tsx                    |  8 +++++++-
 4 files changed, 19 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/scroll-bar-contextual-menu_2017-11-22-17-25.json

diff --git a/common/changes/office-ui-fabric-react/scroll-bar-contextual-menu_2017-11-22-17-25.json b/common/changes/office-ui-fabric-react/scroll-bar-contextual-menu_2017-11-22-17-25.json
new file mode 100644
index 0000000000000..7d5104bba00e8
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/scroll-bar-contextual-menu_2017-11-22-17-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: Make sure vertical scrollbar does not take space away from contents",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
index f9e16980d02b0..0567f787fa7a1 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
@@ -42,7 +42,6 @@ $Callout-smallbeak-slant-width: 16px;
 .main {
   background-color: $ms-color-white;
   overflow-x: hidden;
-  overflow-y: auto;
   position: relative;
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
index 4f649424e81dc..0f00f4dbcce2b 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
@@ -25,6 +25,7 @@ exports[`Callout renders Callout correctly 1`] = `
         Object {
           "backgroundColor": undefined,
           "maxHeight": 750,
+          "overflowY": "auto",
         }
       }
     >
diff --git a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
index 31c6999b4db98..1d7292ec4553f 100644
--- a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
+++ b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
@@ -55,7 +55,12 @@ export class Popup extends BaseComponent<IPopupProps, {}> {
   }
 
   public render() {
-    let { role, className, ariaLabel, ariaLabelledBy, ariaDescribedBy } = this.props;
+    let { role, className, ariaLabel, ariaLabelledBy, ariaDescribedBy, style } = this.props;
+
+    let needsVerticalScrollBar = false;
+    if (this.refs.root) {
+      needsVerticalScrollBar = this.refs.root.scrollHeight > this.refs.root.clientHeight;
+    }
 
     return (
       <div
@@ -67,6 +72,7 @@ export class Popup extends BaseComponent<IPopupProps, {}> {
         aria-labelledby={ ariaLabelledBy }
         aria-describedby={ ariaDescribedBy }
         onKeyDown={ this._onKeyDown }
+        style={ { ...style, overflowY: needsVerticalScrollBar ? 'scroll' : 'auto' } }
       >
         { this.props.children }
       </div>

From a4df7ef34766b89249ac276b6531609414dbc458 Mon Sep 17 00:00:00 2001
From: KatherineThayerMicrosoft <kathayer@microsoft.com>
Date: Fri, 1 Dec 2017 16:10:26 -0800
Subject: [PATCH 1101/1641] Add file type icons (#3500)

* Begin experimenting with file-type-icons package

* Register and use simple file type icons

* Add File Type Icon example page to experiments

* Support more device pixel ratios, png or svg

* Fix bug in IconHelper logic, add examples

* Return icon props instead of string, default to size 16

* Minor fixes, rename IconHelper to FileTypeIconHelper

* Fix imports

* Update README

* Add change files

* Remove accidental changes

* Address code review comments

* Update npm-shrinkwrap
---
 ...thayer-filetypeicons_2017-12-01-01-19.json |  11 +
 ...thayer-filetypeicons_2017-12-01-01-19.json |  11 +
 common/config/rush/npm-shrinkwrap.json        | 348 ++++++++++--------
 packages/experiments/package.json             |   1 +
 .../FileTypeIcon/FileTypeIconPage.tsx         |  51 +++
 .../examples/FileTypeIcon.Basic.Example.tsx   |  47 +++
 .../experiments/src/demo/AppDefinition.tsx    |   6 +
 packages/experiments/src/demo/index.tsx       |   2 +
 packages/file-type-icons/LICENSE              |  15 +
 packages/file-type-icons/README.md            |  35 ++
 packages/file-type-icons/package.json         |  30 ++
 packages/file-type-icons/src/FileIconType.ts  |  14 +
 .../file-type-icons/src/FileTypeIconHelper.ts | 129 +++++++
 .../file-type-icons/src/FileTypeIconMap.ts    |  53 +++
 .../file-type-icons/src/filetypeicons.tsx     |  46 +++
 packages/file-type-icons/src/index.ts         |  14 +
 packages/file-type-icons/tsconfig.json        |  23 ++
 packages/file-type-icons/tslint.json          |   6 +
 rush.json                                     |   8 +-
 19 files changed, 690 insertions(+), 160 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/kathayer-filetypeicons_2017-12-01-01-19.json
 create mode 100644 common/changes/@uifabric/file-type-icons/kathayer-filetypeicons_2017-12-01-01-19.json
 create mode 100644 packages/experiments/src/components/FileTypeIcon/FileTypeIconPage.tsx
 create mode 100644 packages/experiments/src/components/FileTypeIcon/examples/FileTypeIcon.Basic.Example.tsx
 create mode 100644 packages/file-type-icons/LICENSE
 create mode 100644 packages/file-type-icons/README.md
 create mode 100644 packages/file-type-icons/package.json
 create mode 100644 packages/file-type-icons/src/FileIconType.ts
 create mode 100644 packages/file-type-icons/src/FileTypeIconHelper.ts
 create mode 100644 packages/file-type-icons/src/FileTypeIconMap.ts
 create mode 100644 packages/file-type-icons/src/filetypeicons.tsx
 create mode 100644 packages/file-type-icons/src/index.ts
 create mode 100644 packages/file-type-icons/tsconfig.json
 create mode 100644 packages/file-type-icons/tslint.json

diff --git a/common/changes/@uifabric/experiments/kathayer-filetypeicons_2017-12-01-01-19.json b/common/changes/@uifabric/experiments/kathayer-filetypeicons_2017-12-01-01-19.json
new file mode 100644
index 0000000000000..98394e31bddac
--- /dev/null
+++ b/common/changes/@uifabric/experiments/kathayer-filetypeicons_2017-12-01-01-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Add experiments page for file type icons",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "kathayer@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/file-type-icons/kathayer-filetypeicons_2017-12-01-01-19.json b/common/changes/@uifabric/file-type-icons/kathayer-filetypeicons_2017-12-01-01-19.json
new file mode 100644
index 0000000000000..9c6b0225659c3
--- /dev/null
+++ b/common/changes/@uifabric/file-type-icons/kathayer-filetypeicons_2017-12-01-01-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/file-type-icons",
+      "comment": "Add package for file type icons",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/file-type-icons",
+  "email": "kathayer@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index f1b11d0fbd974..22a5617598fa1 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -10,12 +10,12 @@
       "integrity": "sha1-6pn2EhtKjwZbTHH4VZXbJxRJiAc="
     },
     "@microsoft/api-extractor": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-4.3.0.tgz",
-      "integrity": "sha1-TmZZsh5f4dCg7DrSjiGWNYkewxY=",
+      "version": "4.3.3",
+      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-4.3.3.tgz",
+      "integrity": "sha1-gCOWb8fkEWRQAO37nbTxUi7mohA=",
       "requires": {
-        "@microsoft/node-core-library": "0.3.17",
-        "@microsoft/ts-command-line": "2.2.5",
+        "@microsoft/node-core-library": "0.3.20",
+        "@microsoft/ts-command-line": "2.2.8",
         "@types/fs-extra": "0.0.37",
         "@types/node": "6.0.88",
         "@types/z-schema": "3.16.31",
@@ -35,23 +35,23 @@
       }
     },
     "@microsoft/load-themed-styles": {
-      "version": "1.7.10",
-      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.10.tgz",
-      "integrity": "sha1-h1oxaBixrl+b7bi87h3r924XBRE="
+      "version": "1.7.13",
+      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.13.tgz",
+      "integrity": "sha1-MDXG1hEg6uc2HSzJ1gXijQ0r+/s="
     },
     "@microsoft/loader-load-themed-styles": {
-      "version": "1.6.5",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.6.5.tgz",
-      "integrity": "sha1-KYYh5HDPFHkE/J5WLwBznjEYpLM=",
+      "version": "1.6.8",
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.6.8.tgz",
+      "integrity": "sha1-1Sfmgh5IhvijJdB//zQMweU7oQE=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.10",
+        "@microsoft/load-themed-styles": "1.7.13",
         "loader-utils": "1.1.0"
       }
     },
     "@microsoft/node-core-library": {
-      "version": "0.3.17",
-      "resolved": "https://registry.npmjs.org/@microsoft/node-core-library/-/node-core-library-0.3.17.tgz",
-      "integrity": "sha1-WDnFUSWN6ENHhSMbM7ddLou+704=",
+      "version": "0.3.20",
+      "resolved": "https://registry.npmjs.org/@microsoft/node-core-library/-/node-core-library-0.3.20.tgz",
+      "integrity": "sha1-bslI50IHwTwLeC7AqiraLjtIJ3g=",
       "requires": {
         "@types/fs-extra": "0.0.37",
         "@types/node": "6.0.88",
@@ -69,9 +69,9 @@
       }
     },
     "@microsoft/ts-command-line": {
-      "version": "2.2.5",
-      "resolved": "https://registry.npmjs.org/@microsoft/ts-command-line/-/ts-command-line-2.2.5.tgz",
-      "integrity": "sha1-e68dV3sK+PTg8tmHYOx2gOiRoxk=",
+      "version": "2.2.8",
+      "resolved": "https://registry.npmjs.org/@microsoft/ts-command-line/-/ts-command-line-2.2.8.tgz",
+      "integrity": "sha1-I1JBwoCu+9N6poLO6Gklwty4jMo=",
       "requires": {
         "@types/argparse": "1.0.33",
         "@types/node": "6.0.88",
@@ -88,13 +88,13 @@
     },
     "@rush-temp/build": {
       "version": "file:projects/build.tgz",
-      "integrity": "sha1-9SzXG2f+SXp40NMFm9tc3jmL1tU=",
+      "integrity": "sha1-nMSDbjGC8Cye83wys//hsEEqEno=",
       "requires": {
-        "@microsoft/api-extractor": "4.3.0",
-        "@microsoft/load-themed-styles": "1.7.10",
-        "@microsoft/loader-load-themed-styles": "1.6.5",
+        "@microsoft/api-extractor": "4.3.3",
+        "@microsoft/load-themed-styles": "1.7.13",
+        "@microsoft/loader-load-themed-styles": "1.6.8",
         "autoprefixer": "7.1.6",
-        "awesome-typescript-loader": "3.4.0",
+        "awesome-typescript-loader": "3.4.1",
         "bundlesize": "0.15.3",
         "chalk": "2.3.0",
         "command-line-args": "4.0.7",
@@ -116,12 +116,12 @@
         "sinon": "4.1.2",
         "source-map-loader": "0.2.3",
         "style-loader": "0.18.2",
-        "ts-jest": "21.2.3",
+        "ts-jest": "21.2.4",
         "tslint": "5.8.0",
         "tslint-microsoft-contrib": "5.0.1",
         "typescript": "2.6.2",
         "uglifyjs-webpack-plugin": "0.4.6",
-        "webpack": "3.8.1",
+        "webpack": "3.9.1",
         "webpack-bundle-analyzer": "2.9.1",
         "webpack-dev-server": "2.9.5",
         "webpack-notifier": "1.5.0",
@@ -137,7 +137,7 @@
     },
     "@rush-temp/example-app-base": {
       "version": "file:projects/example-app-base.tgz",
-      "integrity": "sha1-8kpB3vZrOc04cnTTZ0XUgs4GYqs=",
+      "integrity": "sha1-9o89m7muZZgHErkd80k+9DiS/8s=",
       "requires": {
         "@types/chai": "3.4.35",
         "@types/enzyme": "2.8.8",
@@ -153,7 +153,7 @@
         "es6-promise": "4.1.1",
         "es6-weak-map": "2.0.2",
         "highlight.js": "9.12.0",
-        "office-ui-fabric-react": "5.26.1",
+        "office-ui-fabric-react": "5.29.0",
         "react": "15.6.2",
         "react-addons-test-utils": "15.6.2",
         "react-dom": "15.6.2",
@@ -162,9 +162,9 @@
     },
     "@rush-temp/experiments": {
       "version": "file:projects/experiments.tgz",
-      "integrity": "sha1-2voKsS/niCi4jN2uKPG0guAWaJo=",
+      "integrity": "sha1-QXSCDFLj/b6LPVZaRfW5H18lnRg=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.10",
+        "@microsoft/load-themed-styles": "1.7.13",
         "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
         "@types/jest": "21.1.8",
@@ -211,9 +211,9 @@
     },
     "@rush-temp/fabric-website": {
       "version": "file:projects/fabric-website.tgz",
-      "integrity": "sha1-k5f0C6upMfla6RNrk5RR0RDP2IQ=",
+      "integrity": "sha1-Uw4Hegz896ixYgbVafsoVNizB2o=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.10",
+        "@microsoft/load-themed-styles": "1.7.13",
         "@types/chai": "3.4.35",
         "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
@@ -239,16 +239,24 @@
         "write-file-webpack-plugin": "4.2.0"
       }
     },
+    "@rush-temp/file-type-icons": {
+      "version": "file:projects/file-type-icons.tgz",
+      "integrity": "sha1-B8pHXaU/+oD4rBA2qKH7yAILZMo=",
+      "requires": {
+        "@types/react": "15.6.7",
+        "tslib": "1.8.0"
+      }
+    },
     "@rush-temp/icons": {
       "version": "file:projects/icons.tgz",
-      "integrity": "sha1-VwoVsFUcskDoTbG+atTwv/OqW9E=",
+      "integrity": "sha1-SGY6v3K+Ct55YMnernNFRuDmZvg=",
       "requires": {
         "tslib": "1.8.0"
       }
     },
     "@rush-temp/jest-serializer-merge-styles": {
       "version": "file:projects/jest-serializer-merge-styles.tgz",
-      "integrity": "sha1-XHAnIksjI8Csaz/mByWKpKCnAfQ=",
+      "integrity": "sha1-bBBOwfa2xrx38a3x0lU5QsJbWIc=",
       "requires": {
         "@types/jest": "21.1.0"
       },
@@ -262,7 +270,7 @@
     },
     "@rush-temp/merge-styles": {
       "version": "file:projects/merge-styles.tgz",
-      "integrity": "sha1-tqtj0H2w4fRqAk55j7TqrtaWlYw=",
+      "integrity": "sha1-t8hRjzlJTGA4LL2qqSdRAw4j/+I=",
       "requires": {
         "@types/jest": "21.1.0",
         "tslib": "1.8.0"
@@ -277,9 +285,9 @@
     },
     "@rush-temp/office-ui-fabric-react": {
       "version": "file:projects/office-ui-fabric-react.tgz",
-      "integrity": "sha1-wfRl3XTH5Zw6NQva/Wu6Auo027U=",
+      "integrity": "sha1-PYhloR78iKYbYc9d+TPp+n4Y8TY=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.10",
+        "@microsoft/load-themed-styles": "1.7.13",
         "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
         "@types/jest": "21.1.0",
@@ -343,16 +351,16 @@
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
       "version": "file:projects/office-ui-fabric-react-tslint.tgz",
-      "integrity": "sha1-1nzo8k0PDm/NtJv0G5B/LgTBDa4=",
+      "integrity": "sha1-TrgcWpuFzjveWzdOEK/wBI74SnU=",
       "requires": {
         "tslint-react": "3.2.0"
       }
     },
     "@rush-temp/ssr-tests": {
       "version": "file:projects/ssr-tests.tgz",
-      "integrity": "sha1-VW1oUDx8yuzo5zGQFmCAxXqI+CA=",
+      "integrity": "sha1-C9z9G/IhqjVrdH/Dm9Bpc2tLSxk=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.10",
+        "@microsoft/load-themed-styles": "1.7.13",
         "@types/chai": "3.4.35",
         "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
@@ -364,14 +372,14 @@
         "react": "15.6.2",
         "react-dom": "15.6.2",
         "tslib": "1.8.0",
-        "webpack": "3.8.1"
+        "webpack": "3.9.1"
       }
     },
     "@rush-temp/styling": {
       "version": "file:projects/styling.tgz",
-      "integrity": "sha1-Umkecm/LBaSSw+IAgCB94hsLvNo=",
+      "integrity": "sha1-HwNbNWjdl3zolsK+vQmTFI7a+xE=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.10",
+        "@microsoft/load-themed-styles": "1.7.13",
         "@types/chai": "3.4.35",
         "@types/enzyme": "2.8.8",
         "@types/mocha": "2.2.39",
@@ -386,7 +394,7 @@
     },
     "@rush-temp/test-bundle-button": {
       "version": "file:projects/test-bundle-button.tgz",
-      "integrity": "sha1-lS5iffFXNlrOUj31gZj76a1DkMQ=",
+      "integrity": "sha1-l9VOGQr12cSwkMFc68x3OG7tMpk=",
       "requires": {
         "@types/prop-types": "15.5.1",
         "@types/react": "15.6.7",
@@ -399,9 +407,9 @@
     },
     "@rush-temp/todo-app": {
       "version": "file:projects/todo-app.tgz",
-      "integrity": "sha1-z8dK5lcUmPp+gGZ2OAcs1t3L73w=",
+      "integrity": "sha1-ZzZy0oxgjohXwO+ADZJKRSFJvmY=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.10",
+        "@microsoft/load-themed-styles": "1.7.13",
         "@types/chai": "3.4.35",
         "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
@@ -419,9 +427,9 @@
     },
     "@rush-temp/utilities": {
       "version": "file:projects/utilities.tgz",
-      "integrity": "sha1-E0KaA1KnEMDyS6rOuPRmOscoiuo=",
+      "integrity": "sha1-0jI2G4YutJEdycmmeSuFbRBazeE=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.10",
+        "@microsoft/load-themed-styles": "1.7.13",
         "@types/enzyme": "2.8.8",
         "@types/jest": "21.1.0",
         "@types/prop-types": "15.5.1",
@@ -465,14 +473,14 @@
     },
     "@rush-temp/vr-tests": {
       "version": "file:projects/vr-tests.tgz",
-      "integrity": "sha1-B+zUdvbzO78nDwoeV2SCInhrRSQ=",
+      "integrity": "sha1-5BzgZTYKPTyqFgcUpxhILc7fjKQ=",
       "requires": {
         "@storybook/addon-options": "3.2.3",
         "@storybook/react": "3.2.16",
         "@types/react": "15.6.7",
         "@types/react-dom": "15.5.6",
         "@types/storybook__react": "3.0.5",
-        "awesome-typescript-loader": "3.4.0",
+        "awesome-typescript-loader": "3.4.1",
         "css-loader": "0.27.3",
         "file-loader": "0.11.1",
         "postcss-loader": "1.3.3",
@@ -541,7 +549,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -664,7 +672,7 @@
         "@storybook/addons": "3.2.16",
         "@storybook/channel-postmessage": "3.2.16",
         "@storybook/ui": "3.2.16",
-        "airbnb-js-shims": "1.3.0",
+        "airbnb-js-shims": "1.4.0",
         "autoprefixer": "7.1.6",
         "babel-core": "6.26.0",
         "babel-loader": "7.1.2",
@@ -707,7 +715,7 @@
         "url-loader": "0.6.2",
         "util-deprecate": "1.0.2",
         "uuid": "3.1.0",
-        "webpack": "3.8.1",
+        "webpack": "3.9.1",
         "webpack-dev-middleware": "1.12.2",
         "webpack-hot-middleware": "2.21.0"
       },
@@ -787,7 +795,7 @@
         "qs": "6.5.1",
         "react-icons": "2.2.7",
         "react-inspector": "2.2.1",
-        "react-modal": "3.1.5",
+        "react-modal": "3.1.6",
         "react-split-pane": "0.1.71",
         "react-treebeard": "2.1.0",
         "redux": "3.7.2"
@@ -919,29 +927,29 @@
       "integrity": "sha1-LrHQCl5Ow/pYx2r94S4YK2bcXBw="
     },
     "@uifabric/icons": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.2.0.tgz",
-      "integrity": "sha512-P5kfPej/wxgR8jZt/GqnU0FqYcz+JH1iCcaaYd6p9L3opmZtu4w5duKeqs+Bc1u7K16r800EQfLgKe76rt6AuA==",
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.3.0.tgz",
+      "integrity": "sha512-3jh++ktFidYimHCnnJLMAFHbVvCLABTrU1ikii5FmfdqYpwYL5mOBdRgyCBCAUcQn+w3fXfn+TREM5PXa2Ihzg==",
       "requires": {
-        "@uifabric/styling": "5.11.0",
+        "@uifabric/styling": "5.12.1",
         "tslib": "1.8.0"
       }
     },
     "@uifabric/merge-styles": {
-      "version": "5.6.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.6.0.tgz",
-      "integrity": "sha512-SeHU62hfhNIynSubh08JHi3nNSZjCDxMbJCD6V2hA6HDmxhdGM9r3xaMAikJWnO+bixgBripsNwmAN6bneRMeg==",
+      "version": "5.8.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.8.0.tgz",
+      "integrity": "sha512-stjicZel1v/+8KUaxeN8RhGsCvOVcrjr0cVNDlp52IMnTYQqMmAlFUwQfdiDrqiz3T7HEoKxnSSfLFaX3Df9Aw==",
       "requires": {
         "tslib": "1.8.0"
       }
     },
     "@uifabric/styling": {
-      "version": "5.11.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.11.0.tgz",
-      "integrity": "sha512-Yy8ZusXnMHnscu8uF8Rz/zd85/8a+q1YmyHhPx2IGqB1NgddtenxnhdLe2n0nNZUQ/GxY7sxZvGMoGxRVlLQvw==",
+      "version": "5.12.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.12.1.tgz",
+      "integrity": "sha512-TyORTKaRxj99JfNx/lrZCGZiBa1zIb5jNAVeWILPl2igOOvJKKcP9Wbz864ZhIrf2QQgTf+ZRkwQ6OjkKI/6Vg==",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.10",
-        "@uifabric/merge-styles": "5.6.0",
+        "@microsoft/load-themed-styles": "1.7.13",
+        "@uifabric/merge-styles": "5.8.0",
         "@uifabric/utilities": "5.5.0",
         "tslib": "1.8.0"
       }
@@ -951,8 +959,8 @@
       "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.5.0.tgz",
       "integrity": "sha512-+U5gM9s9ue1zKYXlguzOHMl/NSYNvPZre7/LLH5RLfrBYJwkddUZ5AOFDD3xRT6nwpRhb5fPSJaJldAakFVY8Q==",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.10",
-        "@uifabric/merge-styles": "5.6.0",
+        "@microsoft/load-themed-styles": "1.7.13",
+        "@uifabric/merge-styles": "5.8.0",
         "prop-types": "15.6.0",
         "tslib": "1.8.0"
       }
@@ -1014,11 +1022,13 @@
       }
     },
     "airbnb-js-shims": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/airbnb-js-shims/-/airbnb-js-shims-1.3.0.tgz",
-      "integrity": "sha512-Y/9jgf3uEdNyeWPUV1N49FowM/qMIiKSTkRUpYT4jpHkSADfTiRVwI8Mm6o4CIxhnBK1uMf4RIYNYKwwILMCAQ==",
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/airbnb-js-shims/-/airbnb-js-shims-1.4.0.tgz",
+      "integrity": "sha512-KIlW3epMtB1x3PtJr2L7ltkoYvuKzjqrgZPq6mzJUL6Gz+3Y2Oc9FS9ZRzRWym2/jk1r+JsDOOyS2Vavc0E3Pw==",
       "requires": {
         "array-includes": "3.0.3",
+        "array.prototype.flatmap": "1.1.1",
+        "array.prototype.flatten": "1.1.1",
         "es5-shim": "4.5.9",
         "es6-shim": "0.35.3",
         "function.prototype.name": "1.0.3",
@@ -1297,6 +1307,26 @@
       "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.3.2.tgz",
       "integrity": "sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg="
     },
+    "array.prototype.flatmap": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/array.prototype.flatmap/-/array.prototype.flatmap-1.1.1.tgz",
+      "integrity": "sha512-LYxij5OIk/e1wxCPu0Ng1Rtqpe3c1FmfQ/uS/2HGk9GfySnzEpJ4N8eKJgnTCI3PSBBsNNwbUORetjs7B+3oLA==",
+      "requires": {
+        "define-properties": "1.1.2",
+        "es-abstract": "1.10.0",
+        "function-bind": "1.1.1"
+      }
+    },
+    "array.prototype.flatten": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/array.prototype.flatten/-/array.prototype.flatten-1.1.1.tgz",
+      "integrity": "sha512-9DM+ZgShl2O01ERvRiEqljn+UAOn5yUwvfdrhM/NBLxuh98+MN/6SyBpvIpJBA0UcUuayRl/5BhmZ4TyjlHqyg==",
+      "requires": {
+        "define-properties": "1.1.2",
+        "es-abstract": "1.10.0",
+        "function-bind": "1.1.1"
+      }
+    },
     "arrify": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz",
@@ -1389,7 +1419,7 @@
       "integrity": "sha512-C9yv/UF3X+eJTi/zvfxuyfxmLibYrntpF3qoJYrMeQwgUJOZrZvpJiMG2FMQ3qnhWtF/be4pYONBBw95ZGe3vA==",
       "requires": {
         "browserslist": "2.9.1",
-        "caniuse-lite": "1.0.30000772",
+        "caniuse-lite": "1.0.30000777",
         "normalize-range": "0.1.2",
         "num2fraction": "1.2.2",
         "postcss": "6.0.14",
@@ -1397,9 +1427,9 @@
       }
     },
     "awesome-typescript-loader": {
-      "version": "3.4.0",
-      "resolved": "https://registry.npmjs.org/awesome-typescript-loader/-/awesome-typescript-loader-3.4.0.tgz",
-      "integrity": "sha512-sXPUe8HexKO4/NGTOtFP7ue+LbaALphiP22A8FaJCZT2avTtMQj3uVtrPRIvNf/6484i8rgx9d//jewiaqFH0w==",
+      "version": "3.4.1",
+      "resolved": "https://registry.npmjs.org/awesome-typescript-loader/-/awesome-typescript-loader-3.4.1.tgz",
+      "integrity": "sha512-fYxBtN6s4Dm6vtsROWi8IQ4I+KcmwRWePAVvhI06mFcHbtHfZopOs4qGNu9LyCPEw403LDROKFA+NVV6ig5yNw==",
       "requires": {
         "colors": "1.1.2",
         "enhanced-resolve": "3.3.0",
@@ -2957,7 +2987,7 @@
       "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.9.1.tgz",
       "integrity": "sha512-3n3nPdbUqn3nWmsy4PeSQthz2ja1ndpoXta+dwFFNhveGjMg6FXpWYe12vsTpNoXJbzx3j7GZXdtoVIdvh3JbA==",
       "requires": {
-        "caniuse-lite": "1.0.30000772",
+        "caniuse-lite": "1.0.30000777",
         "electron-to-chromium": "1.3.27"
       }
     },
@@ -3085,7 +3115,7 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw=",
       "requires": {
         "browserslist": "1.7.7",
-        "caniuse-db": "1.0.30000772",
+        "caniuse-db": "1.0.30000777",
         "lodash.memoize": "4.1.2",
         "lodash.uniq": "4.5.0"
       },
@@ -3095,21 +3125,21 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000772",
+            "caniuse-db": "1.0.30000777",
             "electron-to-chromium": "1.3.27"
           }
         }
       }
     },
     "caniuse-db": {
-      "version": "1.0.30000772",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000772.tgz",
-      "integrity": "sha1-UarokXaChureSj2DGep21qAbUSs="
+      "version": "1.0.30000777",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000777.tgz",
+      "integrity": "sha1-LhmtumO918UB32N6hirerX9LwFQ="
     },
     "caniuse-lite": {
-      "version": "1.0.30000772",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000772.tgz",
-      "integrity": "sha1-eBKWIsq/7Xrx/zi2SraApqCGVCA="
+      "version": "1.0.30000777",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000777.tgz",
+      "integrity": "sha1-McGKSozUl4LrswXI6Kk+azs+TxM="
     },
     "cardinal": {
       "version": "1.0.0",
@@ -3333,7 +3363,7 @@
       "resolved": "https://registry.npmjs.org/cli-usage/-/cli-usage-0.1.4.tgz",
       "integrity": "sha1-fAHg3HBsI0s5yTODjI4gshdXduI=",
       "requires": {
-        "marked": "0.3.6",
+        "marked": "0.3.7",
         "marked-terminal": "1.7.0"
       }
     },
@@ -3878,7 +3908,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -4046,7 +4076,7 @@
           "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ=",
           "requires": {
             "browserslist": "1.7.7",
-            "caniuse-db": "1.0.30000772",
+            "caniuse-db": "1.0.30000777",
             "normalize-range": "0.1.2",
             "num2fraction": "1.2.2",
             "postcss": "5.2.18",
@@ -4058,7 +4088,7 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000772",
+            "caniuse-db": "1.0.30000777",
             "electron-to-chromium": "1.3.27"
           }
         },
@@ -4092,7 +4122,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -6357,13 +6387,13 @@
       "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-1.0.0.tgz",
       "integrity": "sha1-ZHdYK4IU1gI0YJRWcAO+ip6sBNw=",
       "requires": {
-        "is-path-inside": "1.0.0"
+        "is-path-inside": "1.0.1"
       }
     },
     "is-path-inside": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-1.0.0.tgz",
-      "integrity": "sha1-/AbloWg/vaE95mev9xe7wQpI838=",
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-1.0.1.tgz",
+      "integrity": "sha1-jvW33lBDej/cprToZe96pVy0gDY=",
       "requires": {
         "path-is-inside": "1.0.2"
       }
@@ -7204,14 +7234,14 @@
         "hoek": "4.2.0",
         "isemail": "2.2.1",
         "items": "2.1.1",
-        "moment": "2.19.2",
+        "moment": "2.19.3",
         "topo": "2.0.2"
       }
     },
     "js-base64": {
-      "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.3.2.tgz",
-      "integrity": "sha512-Y2/+DnfJJXT1/FCwUebUhLWb3QihxiSC42+ctHLGogmW2jPY6LCapMdFZXRvVP2z6qyKW7s6qncE/9gSqZiArw=="
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.4.0.tgz",
+      "integrity": "sha512-Wehd+7Pf9tFvGb+ydPm9TjYjV8X1YHOVyG8QyELZxEMqOhemVwGRmoG8iQ/soqI3n8v4xn59zaLxiCJiaaRzKA=="
     },
     "js-tokens": {
       "version": "3.0.2",
@@ -7341,9 +7371,9 @@
       "integrity": "sha1-2ouEvUfeU5WHj5XWTQLyRJ/gXms="
     },
     "kind-of": {
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.1.tgz",
-      "integrity": "sha512-y/15y6w31q9eVnXhVLPQkI7MD6JyuPNqEnetl8bZEc+mngLuonHQJ0x/6BD1WX6ml0Ig/psUlyKZJxz8uUo1xQ=="
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.2.tgz",
+      "integrity": "sha512-s5kLOcnH0XqDO+FvuaLX8DDjZ18CGFk7VygH40QoKPUQhW4e2rvM0rwUq0t8IQDOwYSeLK01U90OjzBTme2QqA=="
     },
     "klaw": {
       "version": "1.3.1",
@@ -7743,9 +7773,9 @@
       }
     },
     "marked": {
-      "version": "0.3.6",
-      "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.6.tgz",
-      "integrity": "sha1-ssbGGPzOzk74bE/Gy4p8v1rtqNc="
+      "version": "0.3.7",
+      "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.7.tgz",
+      "integrity": "sha512-zBEP4qO1YQp5aXHt8S5wTiOv9i2X74V/LQL0zhUNvVaklt6Ywa6lChxIvS+ibYlCGgADwKwZFhjC3+XfpsvQvQ=="
     },
     "marked-terminal": {
       "version": "1.7.0",
@@ -7952,7 +7982,7 @@
         "extend-shallow": "2.0.1",
         "extglob": "2.0.2",
         "fragment-cache": "0.2.1",
-        "kind-of": "6.0.1",
+        "kind-of": "6.0.2",
         "nanomatch": "1.2.6",
         "object.pick": "1.3.0",
         "regex-not": "1.0.0",
@@ -8134,9 +8164,9 @@
       }
     },
     "moment": {
-      "version": "2.19.2",
-      "resolved": "https://registry.npmjs.org/moment/-/moment-2.19.2.tgz",
-      "integrity": "sha512-Rf6jiHPEfxp9+dlzxPTmRHbvoFXsh2L/U8hOupUMpnuecHQmI6cF6lUbJl3QqKPko1u6ujO+FxtcajLVfLpAtA=="
+      "version": "2.19.3",
+      "resolved": "https://registry.npmjs.org/moment/-/moment-2.19.3.tgz",
+      "integrity": "sha1-vbmdJw1tf9p4zA+6zoVeJ/59pp8="
     },
     "ms": {
       "version": "2.0.0",
@@ -8761,14 +8791,14 @@
       "integrity": "sha1-XaNUX43wnxcsbDzXcoj02U1eB88="
     },
     "office-ui-fabric-react": {
-      "version": "5.26.1",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.26.1.tgz",
-      "integrity": "sha512-lT92VfXO8WKVvXnA8LvD2nQ2U0RAtk81+Hu9wWeac10EEEN4lXqOI+ezMtw+fdPQOHP9Xqgy/4rhstfD2WarHQ==",
-      "requires": {
-        "@microsoft/load-themed-styles": "1.7.10",
-        "@uifabric/icons": "5.2.0",
-        "@uifabric/merge-styles": "5.6.0",
-        "@uifabric/styling": "5.11.0",
+      "version": "5.29.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.29.0.tgz",
+      "integrity": "sha512-yh9J9FtCivK8VLZuLgPN7A44F9lisJG2/wHbbpDjlgaAUBBifqaB8zi4eSA0/fdWHe8KUiWjiSGweGwLulS8Yw==",
+      "requires": {
+        "@microsoft/load-themed-styles": "1.7.13",
+        "@uifabric/icons": "5.3.0",
+        "@uifabric/merge-styles": "5.8.0",
+        "@uifabric/styling": "5.12.1",
         "@uifabric/utilities": "5.5.0",
         "prop-types": "15.6.0",
         "tslib": "1.8.0"
@@ -9214,7 +9244,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9279,7 +9309,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9343,7 +9373,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9406,7 +9436,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9469,7 +9499,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9532,7 +9562,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9595,7 +9625,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9659,7 +9689,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9723,7 +9753,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9836,7 +9866,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9899,7 +9929,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9941,7 +9971,7 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000772",
+            "caniuse-db": "1.0.30000777",
             "electron-to-chromium": "1.3.27"
           }
         },
@@ -9975,7 +10005,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10045,7 +10075,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10109,7 +10139,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10175,7 +10205,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10241,7 +10271,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10350,7 +10380,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10416,7 +10446,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10480,7 +10510,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10544,7 +10574,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10607,7 +10637,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10672,7 +10702,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10748,7 +10778,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10813,7 +10843,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10883,7 +10913,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -11236,12 +11266,13 @@
       }
     },
     "react-modal": {
-      "version": "3.1.5",
-      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.1.5.tgz",
-      "integrity": "sha512-EjM32L9JPVibJJgu22QySo9d+tl0POaRTmuM7LmsVkx0U+G9tl4LGLrs2DLNOQp0Oko/5nEF/Rwp/h2noucMAw==",
+      "version": "3.1.6",
+      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.1.6.tgz",
+      "integrity": "sha512-4YKuBE4RMp9P+wqNeK68kQ4Q8Y8x6v3U9xrsRk2DOgWMOyf0GH5gZX841BcTlRxrZFgIKbW5n6hhOL5n4Du4tA==",
       "requires": {
         "exenv": "1.2.2",
-        "prop-types": "15.6.0"
+        "prop-types": "15.6.0",
+        "warning": "3.0.0"
       }
     },
     "react-remarkable": {
@@ -12451,7 +12482,7 @@
                 "hoek": "4.2.0",
                 "isemail": "2.2.1",
                 "items": "2.1.1",
-                "moment": "2.19.2",
+                "moment": "2.19.3",
                 "topo": "2.0.2"
               }
             },
@@ -12540,7 +12571,7 @@
       "resolved": "https://registry.npmjs.org/scss-tokenizer/-/scss-tokenizer-0.2.3.tgz",
       "integrity": "sha1-jrBtualyMzOCTT9VMGQRSYR85dE=",
       "requires": {
-        "js-base64": "2.3.2",
+        "js-base64": "2.4.0",
         "source-map": "0.4.4"
       },
       "dependencies": {
@@ -13713,9 +13744,9 @@
       }
     },
     "ts-jest": {
-      "version": "21.2.3",
-      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-21.2.3.tgz",
-      "integrity": "sha512-/gpl/RUPJMVZmERi360sKu5wzSriAg20HMRZsNgXY7sUWtmSn3iPxQcCBDUi2bmcRPtPOLTSijzWK3ZrlYkUhA==",
+      "version": "21.2.4",
+      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-21.2.4.tgz",
+      "integrity": "sha512-Plk49Us+DcncpQcC8fhYwDUdhW96QB0Dv02etOLhzq+2HAvXfrEUys3teZ/BeyQ+r1rHxfGdNj4dB0Q5msZR3g==",
       "requires": {
         "babel-core": "6.26.0",
         "babel-plugin-istanbul": "4.1.5",
@@ -13724,7 +13755,6 @@
         "cpx": "1.5.0",
         "fs-extra": "4.0.2",
         "jest-config": "21.2.1",
-        "jest-util": "21.2.1",
         "pkg-dir": "2.0.0",
         "source-map-support": "0.5.0",
         "yargs": "10.0.3"
@@ -13805,7 +13835,7 @@
         "resolve": "1.5.0",
         "semver": "5.4.1",
         "tslib": "1.8.0",
-        "tsutils": "2.12.2"
+        "tsutils": "2.13.0"
       }
     },
     "tslint-microsoft-contrib": {
@@ -13828,13 +13858,13 @@
       "resolved": "https://registry.npmjs.org/tslint-react/-/tslint-react-3.2.0.tgz",
       "integrity": "sha1-hR+1BSAcY9A0PFFybmNk9+mtLpk=",
       "requires": {
-        "tsutils": "2.12.2"
+        "tsutils": "2.13.0"
       }
     },
     "tsutils": {
-      "version": "2.12.2",
-      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.12.2.tgz",
-      "integrity": "sha1-rVikhl0X7D3bZjG2ylO+FKVlb/M=",
+      "version": "2.13.0",
+      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.13.0.tgz",
+      "integrity": "sha512-FuWzNJbMsp3gcZMbI3b5DomhW4Ia41vMxjN63nKWI0t7f+I3UmHfRl0TrXJTwI2LUduDG+eR1Mksp3pvtlyCFQ==",
       "requires": {
         "tslib": "1.8.0"
       }
@@ -14297,9 +14327,9 @@
       "integrity": "sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg=="
     },
     "webpack": {
-      "version": "3.8.1",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-3.8.1.tgz",
-      "integrity": "sha512-5ZXLWWsMqHKFr5y0N3Eo5IIisxeEeRAajNq4mELb/WELOR7srdbQk2N5XiyNy2A/AgvlR3AmeBCZJW8lHrolbw==",
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-3.9.1.tgz",
+      "integrity": "sha512-jONJ0l8nqgiQVkqs15O9TFWLozbFkCgVodVrBXBK/PIBFeGkaOGo30Ov57iQqYRwAWNDM5vyLPZYmAIpPa5QSw==",
       "requires": {
         "acorn": "5.2.1",
         "acorn-dynamic-import": "2.0.2",
@@ -14711,7 +14741,7 @@
         "filesize": "3.5.11",
         "lodash": "4.15.0",
         "mkdirp": "0.5.1",
-        "moment": "2.19.2"
+        "moment": "2.19.3"
       },
       "dependencies": {
         "ansi-styles": {
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 2fb486068675f..eae65a1bab7b7 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -29,6 +29,7 @@
     "@types/enzyme": "^2.8.8",
     "@types/webpack-env": "1.13.0",
     "@uifabric/example-app-base": ">=5.1.2 <6.0.0",
+    "@uifabric/file-type-icons": ">=5.0.0 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.0.1 <6.0.0",
     "es6-weak-map": "^2.0.2",
diff --git a/packages/experiments/src/components/FileTypeIcon/FileTypeIconPage.tsx b/packages/experiments/src/components/FileTypeIcon/FileTypeIconPage.tsx
new file mode 100644
index 0000000000000..5b0ae7cc6f0b5
--- /dev/null
+++ b/packages/experiments/src/components/FileTypeIcon/FileTypeIconPage.tsx
@@ -0,0 +1,51 @@
+
+import * as React from 'react';
+import {
+  ExampleCard,
+  IComponentDemoPageProps,
+  ComponentPage
+} from '@uifabric/example-app-base';
+
+import { FileTypeIconBasicExample } from './examples/FileTypeIcon.Basic.Example';
+const FileTypeIconBasicExampleCode =
+  require('!raw-loader!experiments/src/components/FileTypeIcon/examples/FileTypeIcon.Basic.Example.tsx') as string;
+
+export class FileTypeIconPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render(): JSX.Element {
+    return (
+      <ComponentPage
+        title='FileTypeIcon'
+        componentName='FileTypeIcon'
+        exampleCards={
+          <div>
+            <ExampleCard title='File Type Icon' isOptIn={ true } code={ FileTypeIconBasicExampleCode }>
+              <FileTypeIconBasicExample />
+            </ExampleCard>
+          </div>
+        }
+        overview={
+          <div />
+        }
+        bestPractices={
+          <div />
+        }
+        dos={
+          <div>
+            <ul>
+              <li>Use document icons to indicate to users that they are creating a new document of that type.</li>
+              <li>Make sure that a document of the type that the icon represents loads when the user selects the icon.</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul>
+              <li>Use document icons to represent non-Microsoft Office documents, such as a Word .docx icon to open a .txt file.</li>
+            </ul>
+          </div>
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }
+      />
+    );
+  }
+}
diff --git a/packages/experiments/src/components/FileTypeIcon/examples/FileTypeIcon.Basic.Example.tsx b/packages/experiments/src/components/FileTypeIcon/examples/FileTypeIcon.Basic.Example.tsx
new file mode 100644
index 0000000000000..689cde8574dc7
--- /dev/null
+++ b/packages/experiments/src/components/FileTypeIcon/examples/FileTypeIcon.Basic.Example.tsx
@@ -0,0 +1,47 @@
+
+import * as React from 'react';
+import { Icon } from 'office-ui-fabric-react/lib/Icon';
+import { getFileTypeIconProps, FileIconType } from '@uifabric/file-type-icons';
+
+export class FileTypeIconBasicExample extends React.Component<{}, {}> {
+  public render(): JSX.Element {
+    return (
+      <div>
+        <h3>Size 16 accdb icon as .png</h3>
+        <Icon {...getFileTypeIconProps({extension:'mdb', size: 16, imageFileType: 'png'}) } />
+        <h3>Size 20 archive icon as .png</h3>
+        <Icon {...getFileTypeIconProps({extension:'7z', size: 20, imageFileType: 'png'}) } />
+        <h3>Size 32 audio icon as .png</h3>
+        <Icon {...getFileTypeIconProps({extension:'oga', size: 32, imageFileType: 'png'}) } />
+        <h3>Size 40 code icon as .png</h3>
+        <Icon {...getFileTypeIconProps({extension:'.cpp', size: 40, imageFileType: 'png'}) } />
+        <h3>Size 48 csv icon as .png</h3>
+        <Icon {...getFileTypeIconProps({extension:'csv', size: 48, imageFileType: 'png'}) } />
+        <h3>Size 96 docx icon as .png</h3>
+        <Icon {...getFileTypeIconProps({extension: 'docx', size: 96, imageFileType: 'png'}) } />
+        <h3>Size 16 dotx icon as .svg</h3>
+        <Icon {...getFileTypeIconProps({extension:'dot', size: 16, imageFileType: 'svg'}) } />
+        <h3>Size 20 email icon as .svg</h3>
+        <Icon {...getFileTypeIconProps({extension:'.msg', size: 20, imageFileType: 'svg'}) } />
+        <h3>Size 32 exe icon as .svg</h3>
+        <Icon {...getFileTypeIconProps({extension:'msi', size: 32}) } />
+        <h3>Size 40 font icon as .svg</h3>
+        <Icon {...getFileTypeIconProps({extension:'.woff', size: 40}) } />
+        <h3>Size 48 html icon as .svg</h3>
+        <Icon {...getFileTypeIconProps({extension:'html', size: 48}) } />
+        <h3>Size 96 link icon as .svg</h3>
+        <Icon {...getFileTypeIconProps({extension: 'url', size: 96}) } />
+        <h3>Size 16 docset icon as .png</h3>
+        <Icon {...getFileTypeIconProps({type: FileIconType.Docset, size: 16, imageFileType: 'png'}) } />
+        <h3>Size 20 folder icon as .svg</h3>
+        <Icon {...getFileTypeIconProps({type: FileIconType.Folder, size: 20, imageFileType: 'svg'}) } />
+        <h3>Size 40 genericfile icon as .png</h3>
+        <Icon {...getFileTypeIconProps({size: 40, imageFileType: 'png'}) } />
+        <h3>Size 48 listitem icon as .svg</h3>
+        <Icon {...getFileTypeIconProps({type: FileIconType.ListItem, size: 48, imageFileType: 'svg'}) } />
+        <h3>Size 96 sharedfolder icon as .png</h3>
+        <Icon {...getFileTypeIconProps({type: FileIconType.SharedFolder, size: 96, imageFileType: 'png'}) } />
+      </div>
+    );
+  }
+}
diff --git a/packages/experiments/src/demo/AppDefinition.tsx b/packages/experiments/src/demo/AppDefinition.tsx
index 958c7d51e0780..8960c2125b19a 100644
--- a/packages/experiments/src/demo/AppDefinition.tsx
+++ b/packages/experiments/src/demo/AppDefinition.tsx
@@ -28,6 +28,12 @@ export const AppDefinition: IAppDefinition = {
           name: 'Form',
           url: '#/examples/form'
         },
+        {
+          component: require<any>('../components/FileTypeIcon/FileTypeIconPage').FileTypeIconPage,
+          key: 'FileTypeIcon',
+          name: 'FileTypeIcon',
+          url: '#/examples/filetypeicon'
+        },
         {
           component: require<any>('../components/LayoutGroup/LayoutGroupPage').LayoutGroupPage,
           key: 'LayoutGroup',
diff --git a/packages/experiments/src/demo/index.tsx b/packages/experiments/src/demo/index.tsx
index c37e41201312a..0f570b5cf1ab9 100644
--- a/packages/experiments/src/demo/index.tsx
+++ b/packages/experiments/src/demo/index.tsx
@@ -9,6 +9,7 @@ import { GettingStartedPage } from './GettingStartedPage';
 import { setBaseUrl } from 'office-ui-fabric-react/lib/Utilities';
 import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
 import { initializeIcons } from '@uifabric/icons/lib/index';
+import { initializeFileTypeIcons } from '@uifabric/file-type-icons/lib/index';
 
 import './index.scss';
 import './ColorStyles.scss';
@@ -17,6 +18,7 @@ setBaseUrl('./dist/');
 
 // Initialize all icons.
 initializeIcons();
+initializeFileTypeIcons();
 
 let rootElement: HTMLElement | null;
 
diff --git a/packages/file-type-icons/LICENSE b/packages/file-type-icons/LICENSE
new file mode 100644
index 0000000000000..70399bbccab26
--- /dev/null
+++ b/packages/file-type-icons/LICENSE
@@ -0,0 +1,15 @@
+Office UI Fabric React - file-type-icons
+
+Copyright (c) Microsoft Corporation
+
+All rights reserved.
+
+MIT License
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the ""Software""), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED *AS IS*, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
+Note: Usage of the fonts and icons referenced in Office UI Fabric is subject to the terms listed at http://aka.ms/fabric-assets-license
\ No newline at end of file
diff --git a/packages/file-type-icons/README.md b/packages/file-type-icons/README.md
new file mode 100644
index 0000000000000..709836f6261bd
--- /dev/null
+++ b/packages/file-type-icons/README.md
@@ -0,0 +1,35 @@
+# [Office UI Fabric - File Type Icons](http://dev.office.com/fabric)
+
+##### The React-based front-end framework for building experiences for Office and Office 365.
+
+Fabric File Type Icons includes a collection of icons to represent file types.
+
+
+# Getting started
+
+If you are using Fabric React components, you can make all file type icons available by calling the `initializeFileTypeIcons` function from the `@uifabric/file-type-icons` package:
+
+```tsx
+import { initializeFileTypeIcons } from '@uifabric/file-type-icons';
+
+// Register icons and pull the fonts from the default SharePoint cdn.
+initializeFileTypeIcons();
+
+// ...or, register icons and pull the fonts from your own cdn:
+initializeFileTypeIcons('https://my.cdn.com/path/to/icons/');
+```
+
+# Usage in code
+
+If you are using Fabric React, you can use the `Icon` component and pass in the corresponding icon properties to render a given icon.
+
+```tsx
+import { Icon } from 'office-ui-fabric-react/lib/Icon';
+import { getFileTypeIconProps } from '@uifabric/file-type-icons';
+
+<Icon {...getFileTypeIconProps({extension: 'docx', size: 16}) />
+```
+
+# Notes
+
+See [Office UI Fabric React](http://github.com/OfficeDev/office-ui-fabric-react) for more details on the UI Fabric project and packages within.
diff --git a/packages/file-type-icons/package.json b/packages/file-type-icons/package.json
new file mode 100644
index 0000000000000..670d7e29c3715
--- /dev/null
+++ b/packages/file-type-icons/package.json
@@ -0,0 +1,30 @@
+{
+  "name": "@uifabric/file-type-icons",
+  "version": "5.0.0",
+  "description": "Office UI Fabric file type icon set.",
+  "main": "lib/index.js",
+  "typings": "lib/index.d.ts",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/OfficeDev/office-ui-fabric-react"
+  },
+  "license": "MIT",
+  "scripts": {
+    "build": "node ../../scripts/build.js",
+    "clean": "node ../../scripts/clean.js"
+  },
+  "disabledTasks": [
+    "sass",
+    "karma",
+    "tslint",
+    "jest"
+  ],
+  "devDependencies": {
+    "@types/react": "15.6.7",
+    "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
+  },
+  "dependencies": {
+    "@uifabric/styling": ">=5.12.0 <6.0.0",
+    "tslib": "^1.6.0"
+  }
+}
\ No newline at end of file
diff --git a/packages/file-type-icons/src/FileIconType.ts b/packages/file-type-icons/src/FileIconType.ts
new file mode 100644
index 0000000000000..a4bf95c87b0a7
--- /dev/null
+++ b/packages/file-type-icons/src/FileIconType.ts
@@ -0,0 +1,14 @@
+/**
+ * Enumerates special file type icons that do not map to any file extensions.
+ * For example, the 'pptx' icon maps to the extensions 'ppt', 'pptm', 'pptx',
+ * but the 'folder' icon does not map to any extensions and should be obtained
+ * via this enum.
+ */
+
+export const enum FileIconType {
+    Docset = 1, // Start at 1 so it will evaluate as "truthy"
+    Folder,
+    GenericFile,
+    ListItem,
+    SharedFolder
+}
diff --git a/packages/file-type-icons/src/FileTypeIconHelper.ts b/packages/file-type-icons/src/FileTypeIconHelper.ts
new file mode 100644
index 0000000000000..1576211704b69
--- /dev/null
+++ b/packages/file-type-icons/src/FileTypeIconHelper.ts
@@ -0,0 +1,129 @@
+import { FileTypeIconMap } from './FileTypeIconMap';
+import { FileIconType } from './FileIconType';
+
+let _extensionToIconName: { [key: string]: string };
+
+const GENERIC_FILE: string = 'genericfile';
+const FOLDER: string = 'folder';
+const SHARED_FOLDER: string = 'sharedfolder';
+const DOCSET_FOLDER: string = 'docset';
+const LIST_ITEM: string = 'listitem';
+
+const DEFAULT_ICON_SIZE: FileTypeIconSize = 16;
+
+export type FileTypeIconSize = 16 | 20 | 32 | 40 | 48 | 96;
+export type ImageFileType = 'svg' | 'png';
+
+export interface IFileTypeIconOptions {
+    /**
+     * The file extension, such as .pptx, for which you need an icon.
+     * For file type icons that are not associated with a file
+     * extension, such as folder, use the type property.
+     */
+    extension?: string;
+    /**
+     * The type of file type icon you need. Use this property for
+     * file type icons that are not associated with a file extension,
+     * such as folder.
+     */
+    type?: FileIconType;
+    /**
+     * The size of the icon in pixels. Defaults to 16.
+     */
+    size?: FileTypeIconSize;
+    /**
+     * The type of image file to use. Can be svg or png.
+     * Defaults to svg.
+     */
+    imageFileType?: ImageFileType;
+}
+
+/**
+ * This function returns properties for a file type icon given the IFileTypeIconOptions.
+ * It accounts for different device pixel ratios. For example,
+ * getFileTypeIconName({extension: 'doc', size: 16, imageFileType: 'png'})
+ * will return { iconName: 'docx16_2x_png' } if the devicePixelRatio is 2.
+ * 
+ * @param options
+ */
+export function getFileTypeIconProps(options: IFileTypeIconOptions): { iconName: string } {
+
+    // First, obtain the base name of the icon using the extension or type.
+    let iconBaseName: string = GENERIC_FILE;
+
+    if (options.extension) {
+        iconBaseName = getFileTypeIconNameFromExtension(options.extension);
+    } else if (options.type) {
+        switch (options.type) {
+            case FileIconType.Docset:
+                iconBaseName = DOCSET_FOLDER;
+                break;
+            case FileIconType.Folder:
+                iconBaseName = FOLDER;
+                break;
+            case FileIconType.ListItem:
+                iconBaseName = LIST_ITEM;
+                break;
+            case FileIconType.SharedFolder:
+                iconBaseName = SHARED_FOLDER;
+        }
+    }
+
+    // Next, obtain the suffix using the icon size, user's device pixel ratio, and
+    // preference for svg or png
+    let size: FileTypeIconSize = options.size || DEFAULT_ICON_SIZE;
+    let suffix: string = getFileTypeIconSuffix(size, options.imageFileType);
+    
+    return { iconName: iconBaseName + suffix };
+
+}
+
+function getFileTypeIconNameFromExtension(extension: string): string {
+    if (!_extensionToIconName) {
+        _extensionToIconName = { };
+
+        for (var iconName in FileTypeIconMap) {
+            var extensions = FileTypeIconMap[iconName].extensions;
+
+            if (extensions) {
+                for (var i = 0; i < extensions.length; i++) {
+                    _extensionToIconName[extensions[i]] = iconName;
+                }
+            }
+        }
+    }
+
+    // Strip periods, force lowercase.
+    extension = extension.replace('.', '').toLowerCase();
+
+    return _extensionToIconName[extension] || GENERIC_FILE;
+}
+
+function getFileTypeIconSuffix(size: FileTypeIconSize, imageFileType: ImageFileType = 'svg'): string {
+
+    let devicePixelRatio: number = window.devicePixelRatio;
+    let devicePixelRatioSuffix: string = ''; // Default is 1x
+
+    // SVGs scale well, so you can generally use the default image.
+    // 1.5x is a special case where SVGs need a different image.
+    if (imageFileType === 'svg' && 1 < devicePixelRatio && devicePixelRatio <= 1.5) {
+        // Currently missing 1.5x SVGs at sizes 20 and 40, snap to 1x for now
+        if (size !== 20 && size !== 40) {
+            devicePixelRatioSuffix = '_1.5x';
+        }
+    } else if (imageFileType === 'png') {
+        // To look good, PNGs should use a different image for higher device pixel ratios
+        if (1 < devicePixelRatio && devicePixelRatio <= 1.5) {
+            // Currently missing 1.5x icons for size 20, snap to 2x for now
+            devicePixelRatioSuffix = (size === 20) ? '_2x' : '_1.5x';
+        } else if (1.5 < devicePixelRatio && devicePixelRatio <=2) {
+            devicePixelRatioSuffix = '_2x';
+        } else if (2 < devicePixelRatio && devicePixelRatio <= 3) {
+            devicePixelRatioSuffix = '_3x';
+        } else if (3 < devicePixelRatio) {
+            devicePixelRatioSuffix = '_4x';
+        }
+    }
+
+    return size + devicePixelRatioSuffix + '_' + imageFileType;
+}
diff --git a/packages/file-type-icons/src/FileTypeIconMap.ts b/packages/file-type-icons/src/FileTypeIconMap.ts
new file mode 100644
index 0000000000000..a01feb52bb20a
--- /dev/null
+++ b/packages/file-type-icons/src/FileTypeIconMap.ts
@@ -0,0 +1,53 @@
+/**
+ * Enumeration of icon file names, and what extensions they map to.
+ * Please keep items alphabetical. Items without extensions may require specific logic in the code to map.
+ * Track icon accuracy status here: https://msft-my.spoppe.com/personal/caperez_microsoft_com/Documents/Missing%20List.xlsx?web=1
+ */
+export const FileTypeIconMap: {[key: string]: { extensions?: string[]}} = {
+    'accdb': { extensions: ['accdb', 'mdb'] },
+    'archive': { extensions: ['7z', 'ace', 'arc', 'arj', 'dmg', 'gz', 'iso', 'lzh', 'pkg', 'rar', 'sit', 'tgz', 'tar', 'z'] },
+    'audio': { extensions: ['aif', 'aiff', 'aac', 'amr', 'au', 'awb', 'dct', 'dss', 'dvf', 'flac', 'gsm', 'm4a', 'm4p', 'mid', 'mmf', 'mp3', 'ogg', 'oga', 'ra', 'rm', 'wav', 'wma', 'wv'] },
+    'code': { extensions: ['abap', 'ada', 'adp', 'ahk', 'as', 'as3', 'asc', 'ascx', 'asm', 'asp', 'awk', 'bash', 'bash_login', 'bash_logout', 'bash_profile', 'bashrc', 'bat', 'bib', 'bsh', 'build', 'builder', 'c', 'c++', 'capfile', 'cc', 'cfc', 'cfm', 'cfml', 'cl', 'clj', 'cls', 'cmake', 'cmd', 'coffee', 'config', 'cpp', 'cpt', 'cpy', 'cs', 'cshtml', 'cson', 'csproj', 'css', 'ctp', 'cxx', 'd', 'ddl', 'di', 'disco', 'dml', 'dtd', 'dtml', 'el', 'emakefile', 'erb', 'erl', 'f', 'f90', 'f95', 'fs', 'fsi', 'fsscript', 'fsx', 'gemfile', 'gemspec', 'gitconfig', 'go', 'groovy', 'gvy', 'Hcp', 'h', 'h++', 'haml', 'handlebars', 'hbs', 'hh', 'hpp', 'hrl', 'hs', 'htc', 'hxx', 'idl', 'iim', 'inc', 'inf', 'ini', 'inl', 'ipp', 'irbrc', 'jade', 'jav', 'java', 'js', 'json', 'jsp', 'jsx', 'l', 'less', 'lhs', 'lisp', 'log', 'lst', 'ltx', 'lua', 'm', 'make', 'manifest', 'master', 'md', 'markdn', 'markdown', 'mdown', 'mkdn', 'ml', 'mli', 'mll', 'mly', 'mm', 'mud', 'nfo', 'opml', 'osascript', 'p', 'pas', 'patch', 'php', 'php2', 'php3', 'php4', 'php5', 'phtml', 'pl', 'pm', 'pod', 'pp', 'profile', 'ps1', 'pss', 'pt', 'py', 'pyw', 'r', 'rake', 'rb', 'rbx', 'rc', 'rdf', 're', 'reg', 'rest', 'resw', 'resx', 'rhtml', 'rjs', 'rprofile', 'rpy', 'rss', 'rst', 'ruby', 'rxml', 's', 'sass', 'scala', 'scm', 'sconscript', 'sconstruct', 'script', 'scss', 'sgml', 'sh', 'sh', 'shtml', 'sml', 'svn-base', 'sql', 'sql', 'sty', 'tcl', 'tex', 'textile', 'tld', 'tli', 'tmpl', 'tpl', 'vb', 'vi', 'vim', 'vmg', 'webpart', 'wsp', 'wsdl', 'xhtml', 'xoml', 'xsd', 'xslt', 'yaml', 'yaws', 'yml', 'zsh'] },
+    'css': {}, // we dont have the icon yet, but i believe we want it, snapping to 'code' for now
+    'csv': { extensions: ['csv'] },
+    'docset': {},
+    'docx': { extensions: ['doc', 'docm', 'docx'] },
+    'dotx': { extensions: ['dot', 'dotm', 'dotx'] },
+    'email': { extensions: ['eml', 'msg', 'ost', 'pst'] },
+    'exe': { extensions: ['application', 'appref-ms', 'apk', 'app', 'appx', 'exe', 'ipa', 'msi', 'xap'] },
+    'folder': {},
+    'font': { extensions: ['ttf', 'otf', 'woff'] },
+    'genericfile': {},
+    'html': { extensions: ['htm', 'html', 'mht'] },
+    'link': { extensions: ['lnk', 'link', 'url', 'website', 'webloc'] },
+    'listitem': { extensions: ['listitem'] },
+    'model': { extensions: ['3ds', '3mf', 'blend', 'cool', 'dae', 'df', 'dwfx', 'dwg', 'dxf', 'fbx', 'glb', 'gltf', 'holo', 'layout', 'max', 'off', 'ply', 'skp', 'stp', 'stl', 't', 'thl', 'x'] },
+    'mpp': { extensions: ['mpp'] },
+    'mpt': { extensions: ['mpt'] },
+    'odp': { extensions: ['odp'] },
+    'ods': { extensions: ['ods'] },
+    'odt': { extensions: ['odt'] },
+    'one': { extensions: ['one', 'onepkg'] }, // this is a format for exported single-file notebook pages
+    'onetoc': { extensions: ['ms-one-stub', 'onetoc', 'onetoc2'] }, // this icon represents a complete, logical notebook.
+    'pdf': { extensions: ['pdf'] },
+    'photo': { extensions: ['arw', 'bmp', 'cr2', 'crw', 'dcr', 'dds', 'dib', 'dng', 'erf', 'gif', 'ico', 'jfi', 'jfif', 'jif', 'jpe', 'jpeg', 'jpg', 'kdc', 'mrw', 'nef', 'orf', 'pct', 'pict', 'png', 'pns', 'psd', 'raw', 'tga', 'tif', 'tiff', 'wdp'] },
+    'potx': { extensions: ['pot', 'potm', 'potx'] },
+    'ppsx': { extensions: ['pps', 'ppsm', 'ppsx'] },
+    'pptx': { extensions: ['ppt', 'pptm', 'pptx'] },
+    'pub': { extensions: ['pub'] },
+    'spo': { extensions: ['aspx'] },
+    'rtf': { extensions: ['epub', 'rtf', 'wri'] },
+    'sharedfolder': {},
+    'sysfile': { extensions: ['bak', 'bin', 'cab', 'cache', 'cat', 'cer', 'class', 'dat', 'db', 'dbg', 'dl_', 'dll', 'ithmb', 'jar', 'kb', 'kdc', 'ldt', 'lrprev', 'ppa', 'ppam', 'pdb', 'rom', 'thm', 'thmx', 'vsl', 'xla', 'xlam', 'xll'] },
+    'txt': { extensions: ['dif', 'diff', 'readme', 'out', 'plist', 'properties', 'text', 'txt'] },
+    'vector': { extensions: ['ai', 'dgn', 'pd', 'emf', 'eps', 'indd', 'indt', 'ps', 'svg', 'svgz', 'wmf', 'oxps', 'xps', 'xd', 'sketch'] },
+    'video': { extensions: ['3gp', 'asf', 'avi', 'dvr-ms', 'flv', 'm1v', 'm4v', 'mkv', 'mod', 'mov', 'mm4p', 'mp2', 'mp2v', 'mp4', ' mpa', 'mpe', 'mpeg', 'mpg', 'mpv', 'mpv2', 'mts', 'ogg', 'qt', 'swf', 'ts', 'vob', 'webm', 'wlmp', 'wm', 'wmv', 'wmx'] },
+    'vsdx': { extensions: ['vsd', 'vsdm', 'vsdx', 'vdw'] },
+    'vssx': { extensions: ['vss', 'vssm', 'vssx'] },
+    'vstx': { extensions: ['vst', 'vstm', 'vstx'] },
+    'xlsx': { extensions: ['xls', 'xlsb', 'xlsm', 'xlsx'] },
+    'xltx': { extensions: ['xlt', 'xltm', 'xltx'] },
+    'xml': { extensions: ['xaml', 'xml', 'xsl'] },
+    'xsn': { extensions: ['xsn'] },
+    'zip': { extensions: ['zip'] }
+};
diff --git a/packages/file-type-icons/src/filetypeicons.tsx b/packages/file-type-icons/src/filetypeicons.tsx
new file mode 100644
index 0000000000000..1f5483561ac68
--- /dev/null
+++ b/packages/file-type-icons/src/filetypeicons.tsx
@@ -0,0 +1,46 @@
+// tslint:disable:max-line-length
+
+import * as React from 'react';
+import { registerIcons } from '@uifabric/styling/lib/index';
+import { FileTypeIconMap } from './FileTypeIconMap';
+
+const PNG_SUFFIX: string = '_png';
+const SVG_SUFFIX: string = '_svg';
+
+export function initializeIcons(baseUrl: string = '', size: number): void {
+  const iconTypes: string[] = Object.keys(FileTypeIconMap);
+
+  const fileTypeIcons: {[key: string]: JSX.Element} = {};
+
+  iconTypes.forEach(type => {
+    fileTypeIcons[type + size + PNG_SUFFIX] = <img src={ baseUrl + size + '/' + type + '.png' }/>
+    fileTypeIcons[type + size + SVG_SUFFIX] = <img src={ baseUrl + size + '/' + type + '.svg' }/>
+
+    // For high resolution screens, register additional versions
+    // Apply height=100% and width=100% to force image to fit into containing element
+
+    // SVGs scale well, so you can generally use the default image.
+    // 1.5x is a special case where both SVGs and PNGs need a different image.
+    // Remove if statements when missing image files for sizes 20 and 40 are provided.
+    if (size !== 20) {
+      fileTypeIcons[type + size + '_1.5x' + PNG_SUFFIX] = <img src={ baseUrl + size + '_1.5x/' + type + '.png' } height='100%' width='100%'/>
+      if (size !== 40) {
+        fileTypeIcons[type + size + '_1.5x' + SVG_SUFFIX] = <img src={ baseUrl + size + '_1.5x/' + type + '.svg' } height='100%' width='100%'/>
+      }
+    }
+
+    fileTypeIcons[type + size + '_2x' + PNG_SUFFIX] = <img src={ baseUrl + size + '_2x/' + type + '.png' } height='100%' width='100%'/>
+    fileTypeIcons[type + size + '_3x' + PNG_SUFFIX] = <img src={ baseUrl + size + '_3x/' + type + '.png' } height='100%' width='100%'/>
+    fileTypeIcons[type + size + '_4x' + PNG_SUFFIX] = <img src={ baseUrl + size + '_4x/' + type + '.png' } height='100%' width='100%'/>
+  });
+
+  registerIcons({
+    fontFace: {},
+    ​style: {
+      width: size,
+      height: size,
+      overflow:'hidden'
+    },
+    icons: fileTypeIcons
+  });
+}
diff --git a/packages/file-type-icons/src/index.ts b/packages/file-type-icons/src/index.ts
new file mode 100644
index 0000000000000..92aa37c19b827
--- /dev/null
+++ b/packages/file-type-icons/src/index.ts
@@ -0,0 +1,14 @@
+import { initializeIcons } from './filetypeicons';
+
+const DEFAULT_BASE_URL = 'https://spoprod-a.akamaihd.net/files/fabric/assets/item-types/';
+const ICON_SIZES: number[] = [16, 20, 32, 40, 48, 96];
+
+export function initializeFileTypeIcons(baseUrl: string = DEFAULT_BASE_URL): void {
+  ICON_SIZES.forEach((size: number) => {
+      initializeIcons(baseUrl, size);
+    }
+  );
+}
+
+export { FileTypeIconSize, ImageFileType, IFileTypeIconOptions, getFileTypeIconProps} from './FileTypeIconHelper';
+export { FileIconType } from './FileIconType';
diff --git a/packages/file-type-icons/tsconfig.json b/packages/file-type-icons/tsconfig.json
new file mode 100644
index 0000000000000..557f7a5e7df28
--- /dev/null
+++ b/packages/file-type-icons/tsconfig.json
@@ -0,0 +1,23 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "module": "commonjs",
+    "lib": [
+      "es2017",
+      "dom"
+    ],
+    "jsx": "react",
+    "declaration": true,
+    "sourceMap": true,
+    "experimentalDecorators": true,
+    "importHelpers": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "moduleResolution": "node",
+    "preserveConstEnums": false,
+    "types": []
+  },
+  "include": [
+    "src"
+  ]
+}
\ No newline at end of file
diff --git a/packages/file-type-icons/tslint.json b/packages/file-type-icons/tslint.json
new file mode 100644
index 0000000000000..621ee6ba04605
--- /dev/null
+++ b/packages/file-type-icons/tslint.json
@@ -0,0 +1,6 @@
+{
+  "extends": [
+    "office-ui-fabric-react-tslint"
+  ],
+  "rules": {}
+}
\ No newline at end of file
diff --git a/rush.json b/rush.json
index 308d189f059c9..76e7fdea0ff8c 100644
--- a/rush.json
+++ b/rush.json
@@ -48,6 +48,12 @@
         "@uifabric/example-app-base"
       ]
     },
+    {
+      "packageName": "@uifabric/file-type-icons",
+      "projectFolder": "packages/file-type-icons",
+      "versionPolicyName": "lockedMajor",
+      "shouldPublish": false
+    },
     {
       "packageName": "@uifabric/icons",
       "projectFolder": "packages/icons",
@@ -89,4 +95,4 @@
       "shouldPublish": false
     }
   ]
-}
+}
\ No newline at end of file

From 46a8dab26bc4ffc754c505b9e71aa3ed68a8471c Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 1 Dec 2017 17:47:39 -0800
Subject: [PATCH 1102/1641] File type icon package minor polish fixes (#3505)

* Fixes for file type icons.

* Fixing whitesapce.

* more whitespace fixes

* more cleanups.

* Fixing lint.

* version updates.
---
 packages/experiments/package.json             |   2 +-
 .../examples/FileTypeIcon.Basic.Example.tsx   |  34 +-
 packages/file-type-icons/package.json         |   3 +-
 packages/file-type-icons/src/FileIconType.ts  |  10 +-
 .../file-type-icons/src/FileTypeIconHelper.ts | 129 ---
 .../file-type-icons/src/FileTypeIconMap.ts    | 141 ++-
 .../file-type-icons/src/filetypeicons.tsx     |  46 -
 .../src/getFileTypeIconProps.ts               | 130 +++
 packages/file-type-icons/src/index.ts         |  18 +-
 .../src/initializeFileTypeIcons.tsx           |  62 ++
 packages/icons/config/fabric-icons-0.json     | 820 +++++++++---------
 packages/icons/config/fabric-icons-1.json     | 820 +++++++++---------
 packages/icons/config/fabric-icons-10.json    | 788 ++++++++---------
 packages/icons/config/fabric-icons-11.json    | 692 +++++++--------
 packages/icons/config/fabric-icons-2.json     | 820 +++++++++---------
 packages/icons/config/fabric-icons-3.json     | 820 +++++++++---------
 packages/icons/config/fabric-icons-4.json     | 788 ++++++++---------
 packages/icons/config/fabric-icons-5.json     | 812 ++++++++---------
 packages/icons/config/fabric-icons-6.json     | 804 ++++++++---------
 packages/icons/config/fabric-icons-7.json     | 820 +++++++++---------
 packages/icons/config/fabric-icons-8.json     | 820 +++++++++---------
 packages/icons/config/fabric-icons-9.json     | 820 +++++++++---------
 packages/icons/config/fabric-icons.json       | 452 +++++-----
 packages/icons/package.json                   |   1 -
 packages/icons/src/fabric-icons-0.ts          |   2 +-
 packages/icons/src/fabric-icons-1.ts          |   2 +-
 packages/icons/src/fabric-icons-11.ts         |   2 +-
 packages/icons/src/fabric-icons-2.ts          |   2 +-
 packages/icons/src/fabric-icons-3.ts          |   2 +-
 packages/icons/src/fabric-icons-4.ts          |   2 +-
 packages/icons/src/fabric-icons-5.ts          |   2 +-
 packages/icons/src/fabric-icons-6.ts          |   2 +-
 packages/icons/src/fabric-icons-7.ts          |   2 +-
 packages/icons/src/fabric-icons-8.ts          |   2 +-
 packages/icons/src/fabric-icons-9.ts          |   2 +-
 rush.json                                     |   3 +-
 36 files changed, 5367 insertions(+), 5310 deletions(-)
 delete mode 100644 packages/file-type-icons/src/FileTypeIconHelper.ts
 delete mode 100644 packages/file-type-icons/src/filetypeicons.tsx
 create mode 100644 packages/file-type-icons/src/getFileTypeIconProps.ts
 create mode 100644 packages/file-type-icons/src/initializeFileTypeIcons.tsx

diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index eae65a1bab7b7..e47358cde5790 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -29,7 +29,7 @@
     "@types/enzyme": "^2.8.8",
     "@types/webpack-env": "1.13.0",
     "@uifabric/example-app-base": ">=5.1.2 <6.0.0",
-    "@uifabric/file-type-icons": ">=5.0.0 <6.0.0",
+    "@uifabric/file-type-icons": ">=0.0.1 <1.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.0.1 <6.0.0",
     "es6-weak-map": "^2.0.2",
diff --git a/packages/experiments/src/components/FileTypeIcon/examples/FileTypeIcon.Basic.Example.tsx b/packages/experiments/src/components/FileTypeIcon/examples/FileTypeIcon.Basic.Example.tsx
index 689cde8574dc7..a2ab6dc59c1a0 100644
--- a/packages/experiments/src/components/FileTypeIcon/examples/FileTypeIcon.Basic.Example.tsx
+++ b/packages/experiments/src/components/FileTypeIcon/examples/FileTypeIcon.Basic.Example.tsx
@@ -8,39 +8,39 @@ export class FileTypeIconBasicExample extends React.Component<{}, {}> {
     return (
       <div>
         <h3>Size 16 accdb icon as .png</h3>
-        <Icon {...getFileTypeIconProps({extension:'mdb', size: 16, imageFileType: 'png'}) } />
+        <Icon {...getFileTypeIconProps({ extension: 'mdb', size: 16, imageFileType: 'png' }) } />
         <h3>Size 20 archive icon as .png</h3>
-        <Icon {...getFileTypeIconProps({extension:'7z', size: 20, imageFileType: 'png'}) } />
+        <Icon {...getFileTypeIconProps({ extension: '7z', size: 20, imageFileType: 'png' }) } />
         <h3>Size 32 audio icon as .png</h3>
-        <Icon {...getFileTypeIconProps({extension:'oga', size: 32, imageFileType: 'png'}) } />
+        <Icon {...getFileTypeIconProps({ extension: 'oga', size: 32, imageFileType: 'png' }) } />
         <h3>Size 40 code icon as .png</h3>
-        <Icon {...getFileTypeIconProps({extension:'.cpp', size: 40, imageFileType: 'png'}) } />
+        <Icon {...getFileTypeIconProps({ extension: '.cpp', size: 40, imageFileType: 'png' }) } />
         <h3>Size 48 csv icon as .png</h3>
-        <Icon {...getFileTypeIconProps({extension:'csv', size: 48, imageFileType: 'png'}) } />
+        <Icon {...getFileTypeIconProps({ extension: 'csv', size: 48, imageFileType: 'png' }) } />
         <h3>Size 96 docx icon as .png</h3>
-        <Icon {...getFileTypeIconProps({extension: 'docx', size: 96, imageFileType: 'png'}) } />
+        <Icon {...getFileTypeIconProps({ extension: 'docx', size: 96, imageFileType: 'png' }) } />
         <h3>Size 16 dotx icon as .svg</h3>
-        <Icon {...getFileTypeIconProps({extension:'dot', size: 16, imageFileType: 'svg'}) } />
+        <Icon {...getFileTypeIconProps({ extension: 'dot', size: 16, imageFileType: 'svg' }) } />
         <h3>Size 20 email icon as .svg</h3>
-        <Icon {...getFileTypeIconProps({extension:'.msg', size: 20, imageFileType: 'svg'}) } />
+        <Icon {...getFileTypeIconProps({ extension: '.msg', size: 20, imageFileType: 'svg' }) } />
         <h3>Size 32 exe icon as .svg</h3>
-        <Icon {...getFileTypeIconProps({extension:'msi', size: 32}) } />
+        <Icon {...getFileTypeIconProps({ extension: 'msi', size: 32 }) } />
         <h3>Size 40 font icon as .svg</h3>
-        <Icon {...getFileTypeIconProps({extension:'.woff', size: 40}) } />
+        <Icon {...getFileTypeIconProps({ extension: '.woff', size: 40 }) } />
         <h3>Size 48 html icon as .svg</h3>
-        <Icon {...getFileTypeIconProps({extension:'html', size: 48}) } />
+        <Icon {...getFileTypeIconProps({ extension: 'html', size: 48 }) } />
         <h3>Size 96 link icon as .svg</h3>
-        <Icon {...getFileTypeIconProps({extension: 'url', size: 96}) } />
+        <Icon {...getFileTypeIconProps({ extension: 'url', size: 96 }) } />
         <h3>Size 16 docset icon as .png</h3>
-        <Icon {...getFileTypeIconProps({type: FileIconType.Docset, size: 16, imageFileType: 'png'}) } />
+        <Icon {...getFileTypeIconProps({ type: FileIconType.docset, size: 16, imageFileType: 'png' }) } />
         <h3>Size 20 folder icon as .svg</h3>
-        <Icon {...getFileTypeIconProps({type: FileIconType.Folder, size: 20, imageFileType: 'svg'}) } />
+        <Icon {...getFileTypeIconProps({ type: FileIconType.folder, size: 20, imageFileType: 'svg' }) } />
         <h3>Size 40 genericfile icon as .png</h3>
-        <Icon {...getFileTypeIconProps({size: 40, imageFileType: 'png'}) } />
+        <Icon {...getFileTypeIconProps({ size: 40, imageFileType: 'png' }) } />
         <h3>Size 48 listitem icon as .svg</h3>
-        <Icon {...getFileTypeIconProps({type: FileIconType.ListItem, size: 48, imageFileType: 'svg'}) } />
+        <Icon {...getFileTypeIconProps({ type: FileIconType.listItem, size: 48, imageFileType: 'svg' }) } />
         <h3>Size 96 sharedfolder icon as .png</h3>
-        <Icon {...getFileTypeIconProps({type: FileIconType.SharedFolder, size: 96, imageFileType: 'png'}) } />
+        <Icon {...getFileTypeIconProps({ type: FileIconType.sharedFolder, size: 96, imageFileType: 'png' }) } />
       </div>
     );
   }
diff --git a/packages/file-type-icons/package.json b/packages/file-type-icons/package.json
index 670d7e29c3715..e9a91ec99cc3e 100644
--- a/packages/file-type-icons/package.json
+++ b/packages/file-type-icons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/file-type-icons",
-  "version": "5.0.0",
+  "version": "0.0.1",
   "description": "Office UI Fabric file type icon set.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -16,7 +16,6 @@
   "disabledTasks": [
     "sass",
     "karma",
-    "tslint",
     "jest"
   ],
   "devDependencies": {
diff --git a/packages/file-type-icons/src/FileIconType.ts b/packages/file-type-icons/src/FileIconType.ts
index a4bf95c87b0a7..14729aa77aff2 100644
--- a/packages/file-type-icons/src/FileIconType.ts
+++ b/packages/file-type-icons/src/FileIconType.ts
@@ -6,9 +6,9 @@
  */
 
 export const enum FileIconType {
-    Docset = 1, // Start at 1 so it will evaluate as "truthy"
-    Folder,
-    GenericFile,
-    ListItem,
-    SharedFolder
+  docset = 1, // Start at 1 so it will evaluate as "truthy"
+  folder = 2,
+  genericFile = 3,
+  listItem = 4,
+  sharedFolder = 5
 }
diff --git a/packages/file-type-icons/src/FileTypeIconHelper.ts b/packages/file-type-icons/src/FileTypeIconHelper.ts
deleted file mode 100644
index 1576211704b69..0000000000000
--- a/packages/file-type-icons/src/FileTypeIconHelper.ts
+++ /dev/null
@@ -1,129 +0,0 @@
-import { FileTypeIconMap } from './FileTypeIconMap';
-import { FileIconType } from './FileIconType';
-
-let _extensionToIconName: { [key: string]: string };
-
-const GENERIC_FILE: string = 'genericfile';
-const FOLDER: string = 'folder';
-const SHARED_FOLDER: string = 'sharedfolder';
-const DOCSET_FOLDER: string = 'docset';
-const LIST_ITEM: string = 'listitem';
-
-const DEFAULT_ICON_SIZE: FileTypeIconSize = 16;
-
-export type FileTypeIconSize = 16 | 20 | 32 | 40 | 48 | 96;
-export type ImageFileType = 'svg' | 'png';
-
-export interface IFileTypeIconOptions {
-    /**
-     * The file extension, such as .pptx, for which you need an icon.
-     * For file type icons that are not associated with a file
-     * extension, such as folder, use the type property.
-     */
-    extension?: string;
-    /**
-     * The type of file type icon you need. Use this property for
-     * file type icons that are not associated with a file extension,
-     * such as folder.
-     */
-    type?: FileIconType;
-    /**
-     * The size of the icon in pixels. Defaults to 16.
-     */
-    size?: FileTypeIconSize;
-    /**
-     * The type of image file to use. Can be svg or png.
-     * Defaults to svg.
-     */
-    imageFileType?: ImageFileType;
-}
-
-/**
- * This function returns properties for a file type icon given the IFileTypeIconOptions.
- * It accounts for different device pixel ratios. For example,
- * getFileTypeIconName({extension: 'doc', size: 16, imageFileType: 'png'})
- * will return { iconName: 'docx16_2x_png' } if the devicePixelRatio is 2.
- * 
- * @param options
- */
-export function getFileTypeIconProps(options: IFileTypeIconOptions): { iconName: string } {
-
-    // First, obtain the base name of the icon using the extension or type.
-    let iconBaseName: string = GENERIC_FILE;
-
-    if (options.extension) {
-        iconBaseName = getFileTypeIconNameFromExtension(options.extension);
-    } else if (options.type) {
-        switch (options.type) {
-            case FileIconType.Docset:
-                iconBaseName = DOCSET_FOLDER;
-                break;
-            case FileIconType.Folder:
-                iconBaseName = FOLDER;
-                break;
-            case FileIconType.ListItem:
-                iconBaseName = LIST_ITEM;
-                break;
-            case FileIconType.SharedFolder:
-                iconBaseName = SHARED_FOLDER;
-        }
-    }
-
-    // Next, obtain the suffix using the icon size, user's device pixel ratio, and
-    // preference for svg or png
-    let size: FileTypeIconSize = options.size || DEFAULT_ICON_SIZE;
-    let suffix: string = getFileTypeIconSuffix(size, options.imageFileType);
-    
-    return { iconName: iconBaseName + suffix };
-
-}
-
-function getFileTypeIconNameFromExtension(extension: string): string {
-    if (!_extensionToIconName) {
-        _extensionToIconName = { };
-
-        for (var iconName in FileTypeIconMap) {
-            var extensions = FileTypeIconMap[iconName].extensions;
-
-            if (extensions) {
-                for (var i = 0; i < extensions.length; i++) {
-                    _extensionToIconName[extensions[i]] = iconName;
-                }
-            }
-        }
-    }
-
-    // Strip periods, force lowercase.
-    extension = extension.replace('.', '').toLowerCase();
-
-    return _extensionToIconName[extension] || GENERIC_FILE;
-}
-
-function getFileTypeIconSuffix(size: FileTypeIconSize, imageFileType: ImageFileType = 'svg'): string {
-
-    let devicePixelRatio: number = window.devicePixelRatio;
-    let devicePixelRatioSuffix: string = ''; // Default is 1x
-
-    // SVGs scale well, so you can generally use the default image.
-    // 1.5x is a special case where SVGs need a different image.
-    if (imageFileType === 'svg' && 1 < devicePixelRatio && devicePixelRatio <= 1.5) {
-        // Currently missing 1.5x SVGs at sizes 20 and 40, snap to 1x for now
-        if (size !== 20 && size !== 40) {
-            devicePixelRatioSuffix = '_1.5x';
-        }
-    } else if (imageFileType === 'png') {
-        // To look good, PNGs should use a different image for higher device pixel ratios
-        if (1 < devicePixelRatio && devicePixelRatio <= 1.5) {
-            // Currently missing 1.5x icons for size 20, snap to 2x for now
-            devicePixelRatioSuffix = (size === 20) ? '_2x' : '_1.5x';
-        } else if (1.5 < devicePixelRatio && devicePixelRatio <=2) {
-            devicePixelRatioSuffix = '_2x';
-        } else if (2 < devicePixelRatio && devicePixelRatio <= 3) {
-            devicePixelRatioSuffix = '_3x';
-        } else if (3 < devicePixelRatio) {
-            devicePixelRatioSuffix = '_4x';
-        }
-    }
-
-    return size + devicePixelRatioSuffix + '_' + imageFileType;
-}
diff --git a/packages/file-type-icons/src/FileTypeIconMap.ts b/packages/file-type-icons/src/FileTypeIconMap.ts
index a01feb52bb20a..f6afa3259c8b1 100644
--- a/packages/file-type-icons/src/FileTypeIconMap.ts
+++ b/packages/file-type-icons/src/FileTypeIconMap.ts
@@ -3,51 +3,98 @@
  * Please keep items alphabetical. Items without extensions may require specific logic in the code to map.
  * Track icon accuracy status here: https://msft-my.spoppe.com/personal/caperez_microsoft_com/Documents/Missing%20List.xlsx?web=1
  */
-export const FileTypeIconMap: {[key: string]: { extensions?: string[]}} = {
-    'accdb': { extensions: ['accdb', 'mdb'] },
-    'archive': { extensions: ['7z', 'ace', 'arc', 'arj', 'dmg', 'gz', 'iso', 'lzh', 'pkg', 'rar', 'sit', 'tgz', 'tar', 'z'] },
-    'audio': { extensions: ['aif', 'aiff', 'aac', 'amr', 'au', 'awb', 'dct', 'dss', 'dvf', 'flac', 'gsm', 'm4a', 'm4p', 'mid', 'mmf', 'mp3', 'ogg', 'oga', 'ra', 'rm', 'wav', 'wma', 'wv'] },
-    'code': { extensions: ['abap', 'ada', 'adp', 'ahk', 'as', 'as3', 'asc', 'ascx', 'asm', 'asp', 'awk', 'bash', 'bash_login', 'bash_logout', 'bash_profile', 'bashrc', 'bat', 'bib', 'bsh', 'build', 'builder', 'c', 'c++', 'capfile', 'cc', 'cfc', 'cfm', 'cfml', 'cl', 'clj', 'cls', 'cmake', 'cmd', 'coffee', 'config', 'cpp', 'cpt', 'cpy', 'cs', 'cshtml', 'cson', 'csproj', 'css', 'ctp', 'cxx', 'd', 'ddl', 'di', 'disco', 'dml', 'dtd', 'dtml', 'el', 'emakefile', 'erb', 'erl', 'f', 'f90', 'f95', 'fs', 'fsi', 'fsscript', 'fsx', 'gemfile', 'gemspec', 'gitconfig', 'go', 'groovy', 'gvy', 'Hcp', 'h', 'h++', 'haml', 'handlebars', 'hbs', 'hh', 'hpp', 'hrl', 'hs', 'htc', 'hxx', 'idl', 'iim', 'inc', 'inf', 'ini', 'inl', 'ipp', 'irbrc', 'jade', 'jav', 'java', 'js', 'json', 'jsp', 'jsx', 'l', 'less', 'lhs', 'lisp', 'log', 'lst', 'ltx', 'lua', 'm', 'make', 'manifest', 'master', 'md', 'markdn', 'markdown', 'mdown', 'mkdn', 'ml', 'mli', 'mll', 'mly', 'mm', 'mud', 'nfo', 'opml', 'osascript', 'p', 'pas', 'patch', 'php', 'php2', 'php3', 'php4', 'php5', 'phtml', 'pl', 'pm', 'pod', 'pp', 'profile', 'ps1', 'pss', 'pt', 'py', 'pyw', 'r', 'rake', 'rb', 'rbx', 'rc', 'rdf', 're', 'reg', 'rest', 'resw', 'resx', 'rhtml', 'rjs', 'rprofile', 'rpy', 'rss', 'rst', 'ruby', 'rxml', 's', 'sass', 'scala', 'scm', 'sconscript', 'sconstruct', 'script', 'scss', 'sgml', 'sh', 'sh', 'shtml', 'sml', 'svn-base', 'sql', 'sql', 'sty', 'tcl', 'tex', 'textile', 'tld', 'tli', 'tmpl', 'tpl', 'vb', 'vi', 'vim', 'vmg', 'webpart', 'wsp', 'wsdl', 'xhtml', 'xoml', 'xsd', 'xslt', 'yaml', 'yaws', 'yml', 'zsh'] },
-    'css': {}, // we dont have the icon yet, but i believe we want it, snapping to 'code' for now
-    'csv': { extensions: ['csv'] },
-    'docset': {},
-    'docx': { extensions: ['doc', 'docm', 'docx'] },
-    'dotx': { extensions: ['dot', 'dotm', 'dotx'] },
-    'email': { extensions: ['eml', 'msg', 'ost', 'pst'] },
-    'exe': { extensions: ['application', 'appref-ms', 'apk', 'app', 'appx', 'exe', 'ipa', 'msi', 'xap'] },
-    'folder': {},
-    'font': { extensions: ['ttf', 'otf', 'woff'] },
-    'genericfile': {},
-    'html': { extensions: ['htm', 'html', 'mht'] },
-    'link': { extensions: ['lnk', 'link', 'url', 'website', 'webloc'] },
-    'listitem': { extensions: ['listitem'] },
-    'model': { extensions: ['3ds', '3mf', 'blend', 'cool', 'dae', 'df', 'dwfx', 'dwg', 'dxf', 'fbx', 'glb', 'gltf', 'holo', 'layout', 'max', 'off', 'ply', 'skp', 'stp', 'stl', 't', 'thl', 'x'] },
-    'mpp': { extensions: ['mpp'] },
-    'mpt': { extensions: ['mpt'] },
-    'odp': { extensions: ['odp'] },
-    'ods': { extensions: ['ods'] },
-    'odt': { extensions: ['odt'] },
-    'one': { extensions: ['one', 'onepkg'] }, // this is a format for exported single-file notebook pages
-    'onetoc': { extensions: ['ms-one-stub', 'onetoc', 'onetoc2'] }, // this icon represents a complete, logical notebook.
-    'pdf': { extensions: ['pdf'] },
-    'photo': { extensions: ['arw', 'bmp', 'cr2', 'crw', 'dcr', 'dds', 'dib', 'dng', 'erf', 'gif', 'ico', 'jfi', 'jfif', 'jif', 'jpe', 'jpeg', 'jpg', 'kdc', 'mrw', 'nef', 'orf', 'pct', 'pict', 'png', 'pns', 'psd', 'raw', 'tga', 'tif', 'tiff', 'wdp'] },
-    'potx': { extensions: ['pot', 'potm', 'potx'] },
-    'ppsx': { extensions: ['pps', 'ppsm', 'ppsx'] },
-    'pptx': { extensions: ['ppt', 'pptm', 'pptx'] },
-    'pub': { extensions: ['pub'] },
-    'spo': { extensions: ['aspx'] },
-    'rtf': { extensions: ['epub', 'rtf', 'wri'] },
-    'sharedfolder': {},
-    'sysfile': { extensions: ['bak', 'bin', 'cab', 'cache', 'cat', 'cer', 'class', 'dat', 'db', 'dbg', 'dl_', 'dll', 'ithmb', 'jar', 'kb', 'kdc', 'ldt', 'lrprev', 'ppa', 'ppam', 'pdb', 'rom', 'thm', 'thmx', 'vsl', 'xla', 'xlam', 'xll'] },
-    'txt': { extensions: ['dif', 'diff', 'readme', 'out', 'plist', 'properties', 'text', 'txt'] },
-    'vector': { extensions: ['ai', 'dgn', 'pd', 'emf', 'eps', 'indd', 'indt', 'ps', 'svg', 'svgz', 'wmf', 'oxps', 'xps', 'xd', 'sketch'] },
-    'video': { extensions: ['3gp', 'asf', 'avi', 'dvr-ms', 'flv', 'm1v', 'm4v', 'mkv', 'mod', 'mov', 'mm4p', 'mp2', 'mp2v', 'mp4', ' mpa', 'mpe', 'mpeg', 'mpg', 'mpv', 'mpv2', 'mts', 'ogg', 'qt', 'swf', 'ts', 'vob', 'webm', 'wlmp', 'wm', 'wmv', 'wmx'] },
-    'vsdx': { extensions: ['vsd', 'vsdm', 'vsdx', 'vdw'] },
-    'vssx': { extensions: ['vss', 'vssm', 'vssx'] },
-    'vstx': { extensions: ['vst', 'vstm', 'vstx'] },
-    'xlsx': { extensions: ['xls', 'xlsb', 'xlsm', 'xlsx'] },
-    'xltx': { extensions: ['xlt', 'xltm', 'xltx'] },
-    'xml': { extensions: ['xaml', 'xml', 'xsl'] },
-    'xsn': { extensions: ['xsn'] },
-    'zip': { extensions: ['zip'] }
+export const FileTypeIconMap: { [key: string]: { extensions?: string[] } } = {
+  'accdb': { extensions: ['accdb', 'mdb'] },
+  'archive': { extensions: ['7z', 'ace', 'arc', 'arj', 'dmg', 'gz', 'iso', 'lzh', 'pkg', 'rar', 'sit', 'tgz', 'tar', 'z'] },
+  'audio': {
+    extensions: [
+      'aif', 'aiff', 'aac', 'amr', 'au', 'awb', 'dct', 'dss', 'dvf', 'flac', 'gsm', 'm4a', 'm4p',
+      'mid', 'mmf', 'mp3', 'ogg', 'oga', 'ra', 'rm', 'wav', 'wma', 'wv'
+    ]
+  },
+  'code': {
+    extensions: [
+      'abap', 'ada', 'adp', 'ahk', 'as', 'as3', 'asc', 'ascx', 'asm', 'asp', 'awk', 'bash', 'bash_login',
+      'bash_logout', 'bash_profile', 'bashrc', 'bat', 'bib', 'bsh', 'build', 'builder', 'c', 'c++',
+      'capfile', 'cc', 'cfc', 'cfm', 'cfml', 'cl', 'clj', 'cls', 'cmake', 'cmd', 'coffee', 'config',
+      'cpp', 'cpt', 'cpy', 'cs', 'cshtml', 'cson', 'csproj', 'css', 'ctp', 'cxx', 'd', 'ddl', 'di',
+      'disco', 'dml', 'dtd', 'dtml', 'el', 'emakefile', 'erb', 'erl', 'f', 'f90', 'f95', 'fs', 'fsi',
+      'fsscript', 'fsx', 'gemfile', 'gemspec', 'gitconfig', 'go', 'groovy', 'gvy', 'Hcp', 'h', 'h++',
+      'haml', 'handlebars', 'hbs', 'hh', 'hpp', 'hrl', 'hs', 'htc', 'hxx', 'idl', 'iim', 'inc', 'inf',
+      'ini', 'inl', 'ipp', 'irbrc', 'jade', 'jav', 'java', 'js', 'json', 'jsp', 'jsx', 'l', 'less',
+      'lhs', 'lisp', 'log', 'lst', 'ltx', 'lua', 'm', 'make', 'manifest', 'master', 'md', 'markdn',
+      'markdown', 'mdown', 'mkdn', 'ml', 'mli', 'mll', 'mly', 'mm', 'mud', 'nfo', 'opml', 'osascript',
+      'p', 'pas', 'patch', 'php', 'php2', 'php3', 'php4', 'php5', 'phtml', 'pl', 'pm', 'pod', 'pp',
+      'profile', 'ps1', 'pss', 'pt', 'py', 'pyw', 'r', 'rake', 'rb', 'rbx', 'rc', 'rdf', 're', 'reg',
+      'rest', 'resw', 'resx', 'rhtml', 'rjs', 'rprofile', 'rpy', 'rss', 'rst', 'ruby', 'rxml', 's',
+      'sass', 'scala', 'scm', 'sconscript', 'sconstruct', 'script', 'scss', 'sgml', 'sh', 'sh',
+      'shtml', 'sml', 'svn-base', 'sql', 'sql', 'sty', 'tcl', 'tex', 'textile', 'tld', 'tli',
+      'tmpl', 'tpl', 'vb', 'vi', 'vim', 'vmg', 'webpart', 'wsp', 'wsdl', 'xhtml', 'xoml', 'xsd',
+      'xslt', 'yaml', 'yaws', 'yml', 'zsh'
+    ]
+  },
+  'css': {}, // we dont have the icon yet, but i believe we want it, snapping to 'code' for now
+  'csv': { extensions: ['csv'] },
+  'docset': {},
+  'docx': { extensions: ['doc', 'docm', 'docx'] },
+  'dotx': { extensions: ['dot', 'dotm', 'dotx'] },
+  'email': { extensions: ['eml', 'msg', 'ost', 'pst'] },
+  'exe': { extensions: ['application', 'appref-ms', 'apk', 'app', 'appx', 'exe', 'ipa', 'msi', 'xap'] },
+  'folder': {},
+  'font': { extensions: ['ttf', 'otf', 'woff'] },
+  'genericfile': {},
+  'html': { extensions: ['htm', 'html', 'mht'] },
+  'link': { extensions: ['lnk', 'link', 'url', 'website', 'webloc'] },
+  'listitem': { extensions: ['listitem'] },
+  'model': {
+    extensions: [
+      '3ds', '3mf', 'blend', 'cool', 'dae', 'df', 'dwfx', 'dwg', 'dxf', 'fbx', 'glb', 'gltf', 'holo',
+      'layout', 'max', 'off', 'ply', 'skp', 'stp', 'stl', 't', 'thl', 'x'
+    ]
+  },
+  'mpp': { extensions: ['mpp'] },
+  'mpt': { extensions: ['mpt'] },
+  'odp': { extensions: ['odp'] },
+  'ods': { extensions: ['ods'] },
+  'odt': { extensions: ['odt'] },
+  'one': { extensions: ['one', 'onepkg'] }, // this is a format for exported single-file notebook pages
+  'onetoc': { extensions: ['ms-one-stub', 'onetoc', 'onetoc2'] }, // this icon represents a complete, logical notebook.
+  'pdf': { extensions: ['pdf'] },
+  'photo': {
+    extensions: [
+      'arw', 'bmp', 'cr2', 'crw', 'dcr', 'dds', 'dib', 'dng', 'erf', 'gif', 'ico', 'jfi', 'jfif', 'jif',
+      'jpe', 'jpeg', 'jpg', 'kdc', 'mrw', 'nef', 'orf', 'pct', 'pict', 'png', 'pns', 'psd', 'raw', 'tga',
+      'tif', 'tiff', 'wdp'
+    ]
+  },
+  'potx': { extensions: ['pot', 'potm', 'potx'] },
+  'ppsx': { extensions: ['pps', 'ppsm', 'ppsx'] },
+  'pptx': { extensions: ['ppt', 'pptm', 'pptx'] },
+  'pub': { extensions: ['pub'] },
+  'spo': { extensions: ['aspx'] },
+  'rtf': { extensions: ['epub', 'rtf', 'wri'] },
+  'sharedfolder': {},
+  'sysfile': {
+    extensions: [
+      'bak', 'bin', 'cab', 'cache', 'cat', 'cer', 'class', 'dat', 'db', 'dbg', 'dl_', 'dll', 'ithmb',
+      'jar', 'kb', 'kdc', 'ldt', 'lrprev', 'ppa', 'ppam', 'pdb', 'rom', 'thm', 'thmx', 'vsl', 'xla',
+      'xlam', 'xll'
+    ]
+  },
+  'txt': { extensions: ['dif', 'diff', 'readme', 'out', 'plist', 'properties', 'text', 'txt'] },
+  'vector': { extensions: ['ai', 'dgn', 'pd', 'emf', 'eps', 'indd', 'indt', 'ps', 'svg', 'svgz', 'wmf', 'oxps', 'xps', 'xd', 'sketch'] },
+  'video': {
+    extensions: ['3gp', 'asf', 'avi', 'dvr-ms', 'flv', 'm1v', 'm4v', 'mkv', 'mod', 'mov',
+      'mm4p', 'mp2', 'mp2v', 'mp4', ' mpa', 'mpe', 'mpeg', 'mpg', 'mpv', 'mpv2', 'mts', 'ogg', 'qt',
+      'swf', 'ts', 'vob', 'webm', 'wlmp', 'wm', 'wmv', 'wmx'
+    ]
+  },
+  'vsdx': { extensions: ['vsd', 'vsdm', 'vsdx', 'vdw'] },
+  'vssx': { extensions: ['vss', 'vssm', 'vssx'] },
+  'vstx': { extensions: ['vst', 'vstm', 'vstx'] },
+  'xlsx': { extensions: ['xls', 'xlsb', 'xlsm', 'xlsx'] },
+  'xltx': { extensions: ['xlt', 'xltm', 'xltx'] },
+  'xml': { extensions: ['xaml', 'xml', 'xsl'] },
+  'xsn': { extensions: ['xsn'] },
+  'zip': { extensions: ['zip'] }
 };
diff --git a/packages/file-type-icons/src/filetypeicons.tsx b/packages/file-type-icons/src/filetypeicons.tsx
deleted file mode 100644
index 1f5483561ac68..0000000000000
--- a/packages/file-type-icons/src/filetypeicons.tsx
+++ /dev/null
@@ -1,46 +0,0 @@
-// tslint:disable:max-line-length
-
-import * as React from 'react';
-import { registerIcons } from '@uifabric/styling/lib/index';
-import { FileTypeIconMap } from './FileTypeIconMap';
-
-const PNG_SUFFIX: string = '_png';
-const SVG_SUFFIX: string = '_svg';
-
-export function initializeIcons(baseUrl: string = '', size: number): void {
-  const iconTypes: string[] = Object.keys(FileTypeIconMap);
-
-  const fileTypeIcons: {[key: string]: JSX.Element} = {};
-
-  iconTypes.forEach(type => {
-    fileTypeIcons[type + size + PNG_SUFFIX] = <img src={ baseUrl + size + '/' + type + '.png' }/>
-    fileTypeIcons[type + size + SVG_SUFFIX] = <img src={ baseUrl + size + '/' + type + '.svg' }/>
-
-    // For high resolution screens, register additional versions
-    // Apply height=100% and width=100% to force image to fit into containing element
-
-    // SVGs scale well, so you can generally use the default image.
-    // 1.5x is a special case where both SVGs and PNGs need a different image.
-    // Remove if statements when missing image files for sizes 20 and 40 are provided.
-    if (size !== 20) {
-      fileTypeIcons[type + size + '_1.5x' + PNG_SUFFIX] = <img src={ baseUrl + size + '_1.5x/' + type + '.png' } height='100%' width='100%'/>
-      if (size !== 40) {
-        fileTypeIcons[type + size + '_1.5x' + SVG_SUFFIX] = <img src={ baseUrl + size + '_1.5x/' + type + '.svg' } height='100%' width='100%'/>
-      }
-    }
-
-    fileTypeIcons[type + size + '_2x' + PNG_SUFFIX] = <img src={ baseUrl + size + '_2x/' + type + '.png' } height='100%' width='100%'/>
-    fileTypeIcons[type + size + '_3x' + PNG_SUFFIX] = <img src={ baseUrl + size + '_3x/' + type + '.png' } height='100%' width='100%'/>
-    fileTypeIcons[type + size + '_4x' + PNG_SUFFIX] = <img src={ baseUrl + size + '_4x/' + type + '.png' } height='100%' width='100%'/>
-  });
-
-  registerIcons({
-    fontFace: {},
-    ​style: {
-      width: size,
-      height: size,
-      overflow:'hidden'
-    },
-    icons: fileTypeIcons
-  });
-}
diff --git a/packages/file-type-icons/src/getFileTypeIconProps.ts b/packages/file-type-icons/src/getFileTypeIconProps.ts
new file mode 100644
index 0000000000000..9d25e907e1ad5
--- /dev/null
+++ b/packages/file-type-icons/src/getFileTypeIconProps.ts
@@ -0,0 +1,130 @@
+import { FileTypeIconMap } from './FileTypeIconMap';
+import { FileIconType } from './FileIconType';
+
+let _extensionToIconName: { [key: string]: string };
+
+const GENERIC_FILE = 'genericfile';
+const FOLDER = 'folder';
+const SHARED_FOLDER = 'sharedfolder';
+const DOCSET_FOLDER = 'docset';
+const LIST_ITEM = 'listitem';
+const DEFAULT_ICON_SIZE: FileTypeIconSize = 16;
+
+export type FileTypeIconSize = 16 | 20 | 32 | 40 | 48 | 96;
+export type ImageFileType = 'svg' | 'png';
+
+export interface IFileTypeIconOptions {
+  /**
+   * The file extension, such as .pptx, for which you need an icon.
+   * For file type icons that are not associated with a file
+   * extension, such as folder, use the type property.
+   */
+  extension?: string;
+  /**
+   * The type of file type icon you need. Use this property for
+   * file type icons that are not associated with a file extension,
+   * such as folder.
+   */
+  type?: FileIconType;
+  /**
+   * The size of the icon in pixels. Defaults to 16.
+   */
+  size?: FileTypeIconSize;
+  /**
+   * The type of image file to use. Can be svg or png.
+   * Defaults to svg.
+   */
+  imageFileType?: ImageFileType;
+}
+
+/**
+ * This function returns properties for a file type icon given the IFileTypeIconOptions.
+ * It accounts for different device pixel ratios. For example,
+ * getFileTypeIconName({extension: 'doc', size: 16, imageFileType: 'png'})
+ * will return { iconName: 'docx16_2x_png' } if the devicePixelRatio is 2.
+ *
+ * @param options
+ */
+export function getFileTypeIconProps(options: IFileTypeIconOptions): { iconName: string } {
+
+  // First, obtain the base name of the icon using the extension or type.
+  let iconBaseName: string = GENERIC_FILE;
+
+  if (options.extension) {
+    iconBaseName = _getFileTypeIconNameFromExtension(options.extension);
+  } else if (options.type) {
+    switch (options.type) {
+      case FileIconType.docset:
+        iconBaseName = DOCSET_FOLDER;
+        break;
+      case FileIconType.folder:
+        iconBaseName = FOLDER;
+        break;
+      case FileIconType.listItem:
+        iconBaseName = LIST_ITEM;
+        break;
+      case FileIconType.sharedFolder:
+        iconBaseName = SHARED_FOLDER;
+    }
+  }
+
+  // Next, obtain the suffix using the icon size, user's device pixel ratio, and
+  // preference for svg or png
+  let size: FileTypeIconSize = options.size || DEFAULT_ICON_SIZE;
+  let suffix: string = _getFileTypeIconSuffix(size, options.imageFileType);
+
+  return { iconName: iconBaseName + suffix };
+
+}
+
+function _getFileTypeIconNameFromExtension(extension: string): string {
+  if (!_extensionToIconName) {
+    _extensionToIconName = {};
+
+    for (const iconName in FileTypeIconMap) {
+      if (FileTypeIconMap.hasOwnProperty(iconName)) {
+        const extensions = FileTypeIconMap[iconName].extensions;
+
+        if (extensions) {
+          for (let i = 0; i < extensions.length; i++) {
+            _extensionToIconName[extensions[i]] = iconName;
+          }
+        }
+      }
+    }
+  }
+
+  // Strip periods, force lowercase.
+  extension = extension.replace('.', '').toLowerCase();
+
+  return _extensionToIconName[extension] || GENERIC_FILE;
+}
+
+function _getFileTypeIconSuffix(size: FileTypeIconSize, imageFileType: ImageFileType = 'svg'): string {
+
+  let devicePixelRatio: number = window.devicePixelRatio;
+  let devicePixelRatioSuffix = ''; // Default is 1x
+
+  // SVGs scale well, so you can generally use the default image.
+  // 1.5x is a special case where SVGs need a different image.
+  if (imageFileType === 'svg' && 1 < devicePixelRatio && devicePixelRatio <= 1.5) {
+    // Currently missing 1.5x SVGs at sizes 20 and 40, snap to 1x for now
+    if (size !== 20 && size !== 40) {
+      devicePixelRatioSuffix = '_1.5x';
+    }
+  } else if (imageFileType === 'png') {
+    // To look good, PNGs should use a different image for higher device pixel ratios
+    if (1 < devicePixelRatio && devicePixelRatio <= 1.5) {
+      // Currently missing 1.5x icons for size 20, snap to 2x for now
+      devicePixelRatioSuffix = (size === 20) ? '_2x' : '_1.5x';
+    } else if (1.5 < devicePixelRatio && devicePixelRatio <= 2) {
+      devicePixelRatioSuffix = '_2x';
+    } else if (2 < devicePixelRatio && devicePixelRatio <= 3) {
+      devicePixelRatioSuffix = '_3x';
+    } else if (3 < devicePixelRatio) {
+      devicePixelRatioSuffix = '_4x';
+    }
+  }
+
+  return size + devicePixelRatioSuffix + '_' + imageFileType;
+}
diff --git a/packages/file-type-icons/src/index.ts b/packages/file-type-icons/src/index.ts
index 92aa37c19b827..506568a7d7df7 100644
--- a/packages/file-type-icons/src/index.ts
+++ b/packages/file-type-icons/src/index.ts
@@ -1,14 +1,10 @@
-import { initializeIcons } from './filetypeicons';
+export { initializeFileTypeIcons } from './initializeFileTypeIcons';
 
-const DEFAULT_BASE_URL = 'https://spoprod-a.akamaihd.net/files/fabric/assets/item-types/';
-const ICON_SIZES: number[] = [16, 20, 32, 40, 48, 96];
+export {
+  FileTypeIconSize,
+  IFileTypeIconOptions,
+  ImageFileType,
+  getFileTypeIconProps
+} from './getFileTypeIconProps';
 
-export function initializeFileTypeIcons(baseUrl: string = DEFAULT_BASE_URL): void {
-  ICON_SIZES.forEach((size: number) => {
-      initializeIcons(baseUrl, size);
-    }
-  );
-}
-
-export { FileTypeIconSize, ImageFileType, IFileTypeIconOptions, getFileTypeIconProps} from './FileTypeIconHelper';
 export { FileIconType } from './FileIconType';
diff --git a/packages/file-type-icons/src/initializeFileTypeIcons.tsx b/packages/file-type-icons/src/initializeFileTypeIcons.tsx
new file mode 100644
index 0000000000000..f8b557e88296b
--- /dev/null
+++ b/packages/file-type-icons/src/initializeFileTypeIcons.tsx
@@ -0,0 +1,62 @@
+import * as React from 'react';
+import { registerIcons } from '@uifabric/styling/lib/index';
+import { FileTypeIconMap } from './FileTypeIconMap';
+
+const PNG_SUFFIX = '_png';
+const SVG_SUFFIX = '_svg';
+
+const DEFAULT_BASE_URL = 'https://spoprod-a.akamaihd.net/files/fabric/assets/item-types/';
+const ICON_SIZES: number[] = [16, 20, 32, 40, 48, 96];
+
+export function initializeFileTypeIcons(baseUrl: string = DEFAULT_BASE_URL): void {
+  ICON_SIZES.forEach((size: number) => {
+    _initializeIcons(baseUrl, size);
+  });
+}
+
+function _initializeIcons(baseUrl: string, size: number): void {
+  const iconTypes: string[] = Object.keys(FileTypeIconMap);
+  const fileTypeIcons: { [key: string]: JSX.Element } = {};
+
+  iconTypes.forEach((type: string) => {
+    fileTypeIcons[type + size + PNG_SUFFIX] = <img src={ baseUrl + size + '/' + type + '.png' } />;
+    fileTypeIcons[type + size + SVG_SUFFIX] = <img src={ baseUrl + size + '/' + type + '.svg' } />;
+
+    // For high resolution screens, register additional versions
+    // Apply height=100% and width=100% to force image to fit into containing element
+
+    // SVGs scale well, so you can generally use the default image.
+    // 1.5x is a special case where both SVGs and PNGs need a different image.
+    // Remove if statements when missing image files for sizes 20 and 40 are provided.
+    if (size !== 20) {
+      fileTypeIcons[type + size + '_1.5x' + PNG_SUFFIX] = (
+        <img src={ baseUrl + size + '_1.5x/' + type + '.png' } height='100%' width='100%' />
+      );
+      if (size !== 40) {
+        fileTypeIcons[type + size + '_1.5x' + SVG_SUFFIX] = (
+          <img src={ baseUrl + size + '_1.5x/' + type + '.svg' } height='100%' width='100%' />
+        );
+      }
+    }
+
+    fileTypeIcons[type + size + '_2x' + PNG_SUFFIX] = (
+      <img src={ baseUrl + size + '_2x/' + type + '.png' } height='100%' width='100%' />
+    );
+    fileTypeIcons[type + size + '_3x' + PNG_SUFFIX] = (
+      <img src={ baseUrl + size + '_3x/' + type + '.png' } height='100%' width='100%' />
+    );
+    fileTypeIcons[type + size + '_4x' + PNG_SUFFIX] = (
+      <img src={ baseUrl + size + '_4x/' + type + '.png' } height='100%' width='100%' />
+    );
+  });
+
+  registerIcons({
+    fontFace: {},
+    style: {
+      width: size,
+      height: size,
+      overflow: 'hidden'
+    },
+    icons: fileTypeIcons
+  });
+}
diff --git a/packages/icons/config/fabric-icons-0.json b/packages/icons/config/fabric-icons-0.json
index 3f39df8e2dc0a..1a70365cbdf51 100644
--- a/packages/icons/config/fabric-icons-0.json
+++ b/packages/icons/config/fabric-icons-0.json
@@ -1,412 +1,412 @@
 {
-	"fontName": "fabric-icons-0",
-	"fontFamilyName": "FabricMDL2Icons-0",
-	"excludeGlyphs": false,
-	"chunkSubsets": true,
-	"hashFontFileName": true,
-	"subsetChunkSettings": {
-		"maxSubsetSize": 100
-	},
-	"glyphs": [
-		{
-			"name": "DecreaseIndentLegacy",
-			"unicode": "E290"
-		},
-		{
-			"name": "IncreaseIndentLegacy",
-			"unicode": "E291"
-		},
-		{
-			"name": "InternetSharing",
-			"unicode": "E704"
-		},
-		{
-			"name": "Brightness",
-			"unicode": "E706"
-		},
-		{
-			"name": "MapPin",
-			"unicode": "E707"
-		},
-		{
-			"name": "Airplane",
-			"unicode": "E709"
-		},
-		{
-			"name": "Tablet",
-			"unicode": "E70A"
-		},
-		{
-			"name": "QuickNote",
-			"unicode": "E70B"
-		},
-		{
-			"name": "Video",
-			"unicode": "E714"
-		},
-		{
-			"name": "People",
-			"unicode": "E716"
-		},
-		{
-			"name": "Phone",
-			"unicode": "E717"
-		},
-		{
-			"name": "Pin",
-			"unicode": "E718"
-		},
-		{
-			"name": "Shop",
-			"unicode": "E719"
-		},
-		{
-			"name": "Stop",
-			"unicode": "E71A"
-		},
-		{
-			"name": "Link",
-			"unicode": "E71B"
-		},
-		{
-			"name": "Zoom",
-			"unicode": "E71E"
-		},
-		{
-			"name": "ZoomOut",
-			"unicode": "E71F"
-		},
-		{
-			"name": "Microphone",
-			"unicode": "E720"
-		},
-		{
-			"name": "Camera",
-			"unicode": "E722"
-		},
-		{
-			"name": "Attach",
-			"unicode": "E723"
-		},
-		{
-			"name": "Send",
-			"unicode": "E724"
-		},
-		{
-			"name": "FavoriteList",
-			"unicode": "E728"
-		},
-		{
-			"name": "PageSolid",
-			"unicode": "E729"
-		},
-		{
-			"name": "Forward",
-			"unicode": "E72A"
-		},
-		{
-			"name": "Back",
-			"unicode": "E72B"
-		},
-		{
-			"name": "Refresh",
-			"unicode": "E72C"
-		},
-		{
-			"name": "Lock",
-			"unicode": "E72E"
-		},
-		{
-			"name": "EMI",
-			"unicode": "E731"
-		},
-		{
-			"name": "MiniLink",
-			"unicode": "E732"
-		},
-		{
-			"name": "Blocked",
-			"unicode": "E733"
-		},
-		{
-			"name": "ReadingMode",
-			"unicode": "E736"
-		},
-		{
-			"name": "Favicon",
-			"unicode": "E737"
-		},
-		{
-			"name": "Remove",
-			"unicode": "E738"
-		},
-		{
-			"name": "Checkbox",
-			"unicode": "E739"
-		},
-		{
-			"name": "CheckboxComposite",
-			"unicode": "E73A"
-		},
-		{
-			"name": "CheckboxIndeterminate",
-			"unicode": "E73C"
-		},
-		{
-			"name": "CheckboxCompositeReversed",
-			"unicode": "E73D"
-		},
-		{
-			"name": "BackToWindow",
-			"unicode": "E73F"
-		},
-		{
-			"name": "FullScreen",
-			"unicode": "E740"
-		},
-		{
-			"name": "Print",
-			"unicode": "E749"
-		},
-		{
-			"name": "Up",
-			"unicode": "E74A"
-		},
-		{
-			"name": "Down",
-			"unicode": "E74B"
-		},
-		{
-			"name": "Save",
-			"unicode": "E74E"
-		},
-		{
-			"name": "Cloud",
-			"unicode": "E753"
-		},
-		{
-			"name": "CommandPrompt",
-			"unicode": "E756"
-		},
-		{
-			"name": "Sad",
-			"unicode": "E757"
-		},
-		{
-			"name": "SIPMove",
-			"unicode": "E759"
-		},
-		{
-			"name": "EraseTool",
-			"unicode": "E75C"
-		},
-		{
-			"name": "GripperTool",
-			"unicode": "E75E"
-		},
-		{
-			"name": "Dialpad",
-			"unicode": "E75F"
-		},
-		{
-			"name": "PageLeft",
-			"unicode": "E760"
-		},
-		{
-			"name": "PageRight",
-			"unicode": "E761"
-		},
-		{
-			"name": "MultiSelect",
-			"unicode": "E762"
-		},
-		{
-			"name": "Play",
-			"unicode": "E768"
-		},
-		{
-			"name": "Pause",
-			"unicode": "E769"
-		},
-		{
-			"name": "Emoji2",
-			"unicode": "E76E"
-		},
-		{
-			"name": "GripperBarHorizontal",
-			"unicode": "E76F"
-		},
-		{
-			"name": "System",
-			"unicode": "E770"
-		},
-		{
-			"name": "Personalize",
-			"unicode": "E771"
-		},
-		{
-			"name": "SearchAndApps",
-			"unicode": "E773"
-		},
-		{
-			"name": "Globe",
-			"unicode": "E774"
-		},
-		{
-			"name": "ContactInfo",
-			"unicode": "E779"
-		},
-		{
-			"name": "Unpin",
-			"unicode": "E77A"
-		},
-		{
-			"name": "Contact",
-			"unicode": "E77B"
-		},
-		{
-			"name": "Memo",
-			"unicode": "E77C"
-		},
-		{
-			"name": "Paste",
-			"unicode": "E77F"
-		},
-		{
-			"name": "WindowsLogo",
-			"unicode": "E782"
-		},
-		{
-			"name": "Error",
-			"unicode": "E783"
-		},
-		{
-			"name": "GripperBarVertical",
-			"unicode": "E784"
-		},
-		{
-			"name": "Unlock",
-			"unicode": "E785"
-		},
-		{
-			"name": "Megaphone",
-			"unicode": "E789"
-		},
-		{
-			"name": "AutoEnhanceOn",
-			"unicode": "E78D"
-		},
-		{
-			"name": "AutoEnhanceOff",
-			"unicode": "E78E"
-		},
-		{
-			"name": "Color",
-			"unicode": "E790"
-		},
-		{
-			"name": "SaveAs",
-			"unicode": "E792"
-		},
-		{
-			"name": "Light",
-			"unicode": "E793"
-		},
-		{
-			"name": "Filters",
-			"unicode": "E795"
-		},
-		{
-			"name": "AspectRatio",
-			"unicode": "E799"
-		},
-		{
-			"name": "Contrast",
-			"unicode": "E7A1"
-		},
-		{
-			"name": "Redo",
-			"unicode": "E7A6"
-		},
-		{
-			"name": "PhotoCollection",
-			"unicode": "E7AA"
-		},
-		{
-			"name": "Album",
-			"unicode": "E7AB"
-		},
-		{
-			"name": "Rotate",
-			"unicode": "E7AD"
-		},
-		{
-			"name": "PanoIndicator",
-			"unicode": "E7B0"
-		},
-		{
-			"name": "RedEye",
-			"unicode": "E7B3"
-		},
-		{
-			"name": "ThumbnailView",
-			"unicode": "E7B6"
-		},
-		{
-			"name": "Package",
-			"unicode": "E7B8"
-		},
-		{
-			"name": "Warning",
-			"unicode": "E7BA"
-		},
-		{
-			"name": "Financial",
-			"unicode": "E7BB"
-		},
-		{
-			"name": "Education",
-			"unicode": "E7BE"
-		},
-		{
-			"name": "ShoppingCart",
-			"unicode": "E7BF"
-		},
-		{
-			"name": "Train",
-			"unicode": "E7C0"
-		},
-		{
-			"name": "Move",
-			"unicode": "E7C2"
-		},
-		{
-			"name": "TouchPointer",
-			"unicode": "E7C9"
-		},
-		{
-			"name": "Merge",
-			"unicode": "E7D5"
-		},
-		{
-			"name": "TurnRight",
-			"unicode": "E7DB"
-		},
-		{
-			"name": "Ferry",
-			"unicode": "E7E3"
-		},
-		{
-			"name": "Highlight",
-			"unicode": "E7E6"
-		},
-		{
-			"name": "Tab",
-			"unicode": "E7E9"
-		},
-		{
-			"name": "Admin",
-			"unicode": "E7EF"
-		}
-	]
+  "fontName": "fabric-icons-0",
+  "fontFamilyName": "FabricMDL2Icons-0",
+  "excludeGlyphs": false,
+  "chunkSubsets": true,
+  "hashFontFileName": true,
+  "subsetChunkSettings": {
+    "maxSubsetSize": 100
+  },
+  "glyphs": [
+    {
+      "name": "DecreaseIndentLegacy",
+      "unicode": "E290"
+    },
+    {
+      "name": "IncreaseIndentLegacy",
+      "unicode": "E291"
+    },
+    {
+      "name": "InternetSharing",
+      "unicode": "E704"
+    },
+    {
+      "name": "Brightness",
+      "unicode": "E706"
+    },
+    {
+      "name": "MapPin",
+      "unicode": "E707"
+    },
+    {
+      "name": "Airplane",
+      "unicode": "E709"
+    },
+    {
+      "name": "Tablet",
+      "unicode": "E70A"
+    },
+    {
+      "name": "QuickNote",
+      "unicode": "E70B"
+    },
+    {
+      "name": "Video",
+      "unicode": "E714"
+    },
+    {
+      "name": "People",
+      "unicode": "E716"
+    },
+    {
+      "name": "Phone",
+      "unicode": "E717"
+    },
+    {
+      "name": "Pin",
+      "unicode": "E718"
+    },
+    {
+      "name": "Shop",
+      "unicode": "E719"
+    },
+    {
+      "name": "Stop",
+      "unicode": "E71A"
+    },
+    {
+      "name": "Link",
+      "unicode": "E71B"
+    },
+    {
+      "name": "Zoom",
+      "unicode": "E71E"
+    },
+    {
+      "name": "ZoomOut",
+      "unicode": "E71F"
+    },
+    {
+      "name": "Microphone",
+      "unicode": "E720"
+    },
+    {
+      "name": "Camera",
+      "unicode": "E722"
+    },
+    {
+      "name": "Attach",
+      "unicode": "E723"
+    },
+    {
+      "name": "Send",
+      "unicode": "E724"
+    },
+    {
+      "name": "FavoriteList",
+      "unicode": "E728"
+    },
+    {
+      "name": "PageSolid",
+      "unicode": "E729"
+    },
+    {
+      "name": "Forward",
+      "unicode": "E72A"
+    },
+    {
+      "name": "Back",
+      "unicode": "E72B"
+    },
+    {
+      "name": "Refresh",
+      "unicode": "E72C"
+    },
+    {
+      "name": "Lock",
+      "unicode": "E72E"
+    },
+    {
+      "name": "EMI",
+      "unicode": "E731"
+    },
+    {
+      "name": "MiniLink",
+      "unicode": "E732"
+    },
+    {
+      "name": "Blocked",
+      "unicode": "E733"
+    },
+    {
+      "name": "ReadingMode",
+      "unicode": "E736"
+    },
+    {
+      "name": "Favicon",
+      "unicode": "E737"
+    },
+    {
+      "name": "Remove",
+      "unicode": "E738"
+    },
+    {
+      "name": "Checkbox",
+      "unicode": "E739"
+    },
+    {
+      "name": "CheckboxComposite",
+      "unicode": "E73A"
+    },
+    {
+      "name": "CheckboxIndeterminate",
+      "unicode": "E73C"
+    },
+    {
+      "name": "CheckboxCompositeReversed",
+      "unicode": "E73D"
+    },
+    {
+      "name": "BackToWindow",
+      "unicode": "E73F"
+    },
+    {
+      "name": "FullScreen",
+      "unicode": "E740"
+    },
+    {
+      "name": "Print",
+      "unicode": "E749"
+    },
+    {
+      "name": "Up",
+      "unicode": "E74A"
+    },
+    {
+      "name": "Down",
+      "unicode": "E74B"
+    },
+    {
+      "name": "Save",
+      "unicode": "E74E"
+    },
+    {
+      "name": "Cloud",
+      "unicode": "E753"
+    },
+    {
+      "name": "CommandPrompt",
+      "unicode": "E756"
+    },
+    {
+      "name": "Sad",
+      "unicode": "E757"
+    },
+    {
+      "name": "SIPMove",
+      "unicode": "E759"
+    },
+    {
+      "name": "EraseTool",
+      "unicode": "E75C"
+    },
+    {
+      "name": "GripperTool",
+      "unicode": "E75E"
+    },
+    {
+      "name": "Dialpad",
+      "unicode": "E75F"
+    },
+    {
+      "name": "PageLeft",
+      "unicode": "E760"
+    },
+    {
+      "name": "PageRight",
+      "unicode": "E761"
+    },
+    {
+      "name": "MultiSelect",
+      "unicode": "E762"
+    },
+    {
+      "name": "Play",
+      "unicode": "E768"
+    },
+    {
+      "name": "Pause",
+      "unicode": "E769"
+    },
+    {
+      "name": "Emoji2",
+      "unicode": "E76E"
+    },
+    {
+      "name": "GripperBarHorizontal",
+      "unicode": "E76F"
+    },
+    {
+      "name": "System",
+      "unicode": "E770"
+    },
+    {
+      "name": "Personalize",
+      "unicode": "E771"
+    },
+    {
+      "name": "SearchAndApps",
+      "unicode": "E773"
+    },
+    {
+      "name": "Globe",
+      "unicode": "E774"
+    },
+    {
+      "name": "ContactInfo",
+      "unicode": "E779"
+    },
+    {
+      "name": "Unpin",
+      "unicode": "E77A"
+    },
+    {
+      "name": "Contact",
+      "unicode": "E77B"
+    },
+    {
+      "name": "Memo",
+      "unicode": "E77C"
+    },
+    {
+      "name": "Paste",
+      "unicode": "E77F"
+    },
+    {
+      "name": "WindowsLogo",
+      "unicode": "E782"
+    },
+    {
+      "name": "Error",
+      "unicode": "E783"
+    },
+    {
+      "name": "GripperBarVertical",
+      "unicode": "E784"
+    },
+    {
+      "name": "Unlock",
+      "unicode": "E785"
+    },
+    {
+      "name": "Megaphone",
+      "unicode": "E789"
+    },
+    {
+      "name": "AutoEnhanceOn",
+      "unicode": "E78D"
+    },
+    {
+      "name": "AutoEnhanceOff",
+      "unicode": "E78E"
+    },
+    {
+      "name": "Color",
+      "unicode": "E790"
+    },
+    {
+      "name": "SaveAs",
+      "unicode": "E792"
+    },
+    {
+      "name": "Light",
+      "unicode": "E793"
+    },
+    {
+      "name": "Filters",
+      "unicode": "E795"
+    },
+    {
+      "name": "AspectRatio",
+      "unicode": "E799"
+    },
+    {
+      "name": "Contrast",
+      "unicode": "E7A1"
+    },
+    {
+      "name": "Redo",
+      "unicode": "E7A6"
+    },
+    {
+      "name": "PhotoCollection",
+      "unicode": "E7AA"
+    },
+    {
+      "name": "Album",
+      "unicode": "E7AB"
+    },
+    {
+      "name": "Rotate",
+      "unicode": "E7AD"
+    },
+    {
+      "name": "PanoIndicator",
+      "unicode": "E7B0"
+    },
+    {
+      "name": "RedEye",
+      "unicode": "E7B3"
+    },
+    {
+      "name": "ThumbnailView",
+      "unicode": "E7B6"
+    },
+    {
+      "name": "Package",
+      "unicode": "E7B8"
+    },
+    {
+      "name": "Warning",
+      "unicode": "E7BA"
+    },
+    {
+      "name": "Financial",
+      "unicode": "E7BB"
+    },
+    {
+      "name": "Education",
+      "unicode": "E7BE"
+    },
+    {
+      "name": "ShoppingCart",
+      "unicode": "E7BF"
+    },
+    {
+      "name": "Train",
+      "unicode": "E7C0"
+    },
+    {
+      "name": "Move",
+      "unicode": "E7C2"
+    },
+    {
+      "name": "TouchPointer",
+      "unicode": "E7C9"
+    },
+    {
+      "name": "Merge",
+      "unicode": "E7D5"
+    },
+    {
+      "name": "TurnRight",
+      "unicode": "E7DB"
+    },
+    {
+      "name": "Ferry",
+      "unicode": "E7E3"
+    },
+    {
+      "name": "Highlight",
+      "unicode": "E7E6"
+    },
+    {
+      "name": "Tab",
+      "unicode": "E7E9"
+    },
+    {
+      "name": "Admin",
+      "unicode": "E7EF"
+    }
+  ]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-1.json b/packages/icons/config/fabric-icons-1.json
index ad0e709d5f1c4..93b0274ca2d4f 100644
--- a/packages/icons/config/fabric-icons-1.json
+++ b/packages/icons/config/fabric-icons-1.json
@@ -1,412 +1,412 @@
 {
-	"fontName": "fabric-icons-1",
-	"fontFamilyName": "FabricMDL2Icons-1",
-	"excludeGlyphs": false,
-	"chunkSubsets": true,
-	"hashFontFileName": true,
-	"subsetChunkSettings": {
-		"maxSubsetSize": 100
-	},
-	"glyphs": [
-		{
-			"name": "TVMonitor",
-			"unicode": "E7F4"
-		},
-		{
-			"name": "Speakers",
-			"unicode": "E7F5"
-		},
-		{
-			"name": "Nav2DMapView",
-			"unicode": "E800"
-		},
-		{
-			"name": "Car",
-			"unicode": "E804"
-		},
-		{
-			"name": "Bus",
-			"unicode": "E806"
-		},
-		{
-			"name": "EatDrink",
-			"unicode": "E807"
-		},
-		{
-			"name": "LocationCircle",
-			"unicode": "E80E"
-		},
-		{
-			"name": "Home",
-			"unicode": "E80F"
-		},
-		{
-			"name": "SwitcherStartEnd",
-			"unicode": "E810"
-		},
-		{
-			"name": "ParkingLocation",
-			"unicode": "E811"
-		},
-		{
-			"name": "IncidentTriangle",
-			"unicode": "E814"
-		},
-		{
-			"name": "Touch",
-			"unicode": "E815"
-		},
-		{
-			"name": "MapDirections",
-			"unicode": "E816"
-		},
-		{
-			"name": "History",
-			"unicode": "E81C"
-		},
-		{
-			"name": "Location",
-			"unicode": "E81D"
-		},
-		{
-			"name": "Work",
-			"unicode": "E821"
-		},
-		{
-			"name": "Recent",
-			"unicode": "E823"
-		},
-		{
-			"name": "Hotel",
-			"unicode": "E824"
-		},
-		{
-			"name": "LocationDot",
-			"unicode": "E827"
-		},
-		{
-			"name": "News",
-			"unicode": "E900"
-		},
-		{
-			"name": "Chat",
-			"unicode": "E901"
-		},
-		{
-			"name": "Group",
-			"unicode": "E902"
-		},
-		{
-			"name": "Previous",
-			"unicode": "E892"
-		},
-		{
-			"name": "Next",
-			"unicode": "E893"
-		},
-		{
-			"name": "Sync",
-			"unicode": "E895"
-		},
-		{
-			"name": "Help",
-			"unicode": "E897"
-		},
-		{
-			"name": "Emoji",
-			"unicode": "E899"
-		},
-		{
-			"name": "MailForward",
-			"unicode": "E89C"
-		},
-		{
-			"name": "ClosePane",
-			"unicode": "E89F"
-		},
-		{
-			"name": "OpenPane",
-			"unicode": "E8A0"
-		},
-		{
-			"name": "PreviewLink",
-			"unicode": "E8A1"
-		},
-		{
-			"name": "ZoomIn",
-			"unicode": "E8A3"
-		},
-		{
-			"name": "Bookmarks",
-			"unicode": "E8A4"
-		},
-		{
-			"name": "Document",
-			"unicode": "E8A5"
-		},
-		{
-			"name": "ProtectedDocument",
-			"unicode": "E8A6"
-		},
-		{
-			"name": "OpenInNewWindow",
-			"unicode": "E8A7"
-		},
-		{
-			"name": "MailFill",
-			"unicode": "E8A8"
-		},
-		{
-			"name": "ViewAll",
-			"unicode": "E8A9"
-		},
-		{
-			"name": "Switch",
-			"unicode": "E8AB"
-		},
-		{
-			"name": "Rename",
-			"unicode": "E8AC"
-		},
-		{
-			"name": "Import",
-			"unicode": "E8B5"
-		},
-		{
-			"name": "Picture",
-			"unicode": "E8B9"
-		},
-		{
-			"name": "ShowResults",
-			"unicode": "E8BC"
-		},
-		{
-			"name": "Message",
-			"unicode": "E8BD"
-		},
-		{
-			"name": "CalendarDay",
-			"unicode": "E8BF"
-		},
-		{
-			"name": "CalendarWeek",
-			"unicode": "E8C0"
-		},
-		{
-			"name": "MailReplyAll",
-			"unicode": "E8C2"
-		},
-		{
-			"name": "Read",
-			"unicode": "E8C3"
-		},
-		{
-			"name": "Cut",
-			"unicode": "E8C6"
-		},
-		{
-			"name": "PaymentCard",
-			"unicode": "E8C7"
-		},
-		{
-			"name": "Copy",
-			"unicode": "E8C8"
-		},
-		{
-			"name": "Important",
-			"unicode": "E8C9"
-		},
-		{
-			"name": "MailReply",
-			"unicode": "E8CA"
-		},
-		{
-			"name": "GotoToday",
-			"unicode": "E8D1"
-		},
-		{
-			"name": "Font",
-			"unicode": "E8D2"
-		},
-		{
-			"name": "FontColor",
-			"unicode": "E8D3"
-		},
-		{
-			"name": "FolderFill",
-			"unicode": "E8D5"
-		},
-		{
-			"name": "Permissions",
-			"unicode": "E8D7"
-		},
-		{
-			"name": "DisableUpdates",
-			"unicode": "E8D8"
-		},
-		{
-			"name": "Unfavorite",
-			"unicode": "E8D9"
-		},
-		{
-			"name": "Italic",
-			"unicode": "E8DB"
-		},
-		{
-			"name": "Underline",
-			"unicode": "E8DC"
-		},
-		{
-			"name": "Bold",
-			"unicode": "E8DD"
-		},
-		{
-			"name": "MoveToFolder",
-			"unicode": "E8DE"
-		},
-		{
-			"name": "Dislike",
-			"unicode": "E8E0"
-		},
-		{
-			"name": "Like",
-			"unicode": "E8E1"
-		},
-		{
-			"name": "AlignCenter",
-			"unicode": "E8E3"
-		},
-		{
-			"name": "OpenFile",
-			"unicode": "E8E5"
-		},
-		{
-			"name": "FontDecrease",
-			"unicode": "E8E7"
-		},
-		{
-			"name": "FontIncrease",
-			"unicode": "E8E8"
-		},
-		{
-			"name": "FontSize",
-			"unicode": "E8E9"
-		},
-		{
-			"name": "CellPhone",
-			"unicode": "E8EA"
-		},
-		{
-			"name": "Library",
-			"unicode": "E8F1"
-		},
-		{
-			"name": "PostUpdate",
-			"unicode": "E8F3"
-		},
-		{
-			"name": "NewFolder",
-			"unicode": "E8F4"
-		},
-		{
-			"name": "CalendarReply",
-			"unicode": "E8F5"
-		},
-		{
-			"name": "UnsyncFolder",
-			"unicode": "E8F6"
-		},
-		{
-			"name": "SyncFolder",
-			"unicode": "E8F7"
-		},
-		{
-			"name": "BlockContact",
-			"unicode": "E8F8"
-		},
-		{
-			"name": "BulletedList",
-			"unicode": "E8FD"
-		},
-		{
-			"name": "Preview",
-			"unicode": "E8FF"
-		},
-		{
-			"name": "World",
-			"unicode": "E909"
-		},
-		{
-			"name": "Comment",
-			"unicode": "E90A"
-		},
-		{
-			"name": "DockLeft",
-			"unicode": "E90C"
-		},
-		{
-			"name": "DockRight",
-			"unicode": "E90D"
-		},
-		{
-			"name": "Repair",
-			"unicode": "E90F"
-		},
-		{
-			"name": "Accounts",
-			"unicode": "E910"
-		},
-		{
-			"name": "RadioBullet",
-			"unicode": "E915"
-		},
-		{
-			"name": "Stopwatch",
-			"unicode": "E916"
-		},
-		{
-			"name": "Clock",
-			"unicode": "E917"
-		},
-		{
-			"name": "WorldClock",
-			"unicode": "E918"
-		},
-		{
-			"name": "AlarmClock",
-			"unicode": "E919"
-		},
-		{
-			"name": "Hospital",
-			"unicode": "E91D"
-		},
-		{
-			"name": "Timer",
-			"unicode": "E91E"
-		},
-		{
-			"name": "FullCircleMask",
-			"unicode": "E91F"
-		},
-		{
-			"name": "LocationFill",
-			"unicode": "E920"
-		},
-		{
-			"name": "ChromeMinimize",
-			"unicode": "E921"
-		},
-		{
-			"name": "Annotation",
-			"unicode": "E924"
-		},
-		{
-			"name": "ChromeClose",
-			"unicode": "E8BB"
-		},
-		{
-			"name": "Accept",
-			"unicode": "E8FB"
-		}
-	]
+  "fontName": "fabric-icons-1",
+  "fontFamilyName": "FabricMDL2Icons-1",
+  "excludeGlyphs": false,
+  "chunkSubsets": true,
+  "hashFontFileName": true,
+  "subsetChunkSettings": {
+    "maxSubsetSize": 100
+  },
+  "glyphs": [
+    {
+      "name": "TVMonitor",
+      "unicode": "E7F4"
+    },
+    {
+      "name": "Speakers",
+      "unicode": "E7F5"
+    },
+    {
+      "name": "Nav2DMapView",
+      "unicode": "E800"
+    },
+    {
+      "name": "Car",
+      "unicode": "E804"
+    },
+    {
+      "name": "Bus",
+      "unicode": "E806"
+    },
+    {
+      "name": "EatDrink",
+      "unicode": "E807"
+    },
+    {
+      "name": "LocationCircle",
+      "unicode": "E80E"
+    },
+    {
+      "name": "Home",
+      "unicode": "E80F"
+    },
+    {
+      "name": "SwitcherStartEnd",
+      "unicode": "E810"
+    },
+    {
+      "name": "ParkingLocation",
+      "unicode": "E811"
+    },
+    {
+      "name": "IncidentTriangle",
+      "unicode": "E814"
+    },
+    {
+      "name": "Touch",
+      "unicode": "E815"
+    },
+    {
+      "name": "MapDirections",
+      "unicode": "E816"
+    },
+    {
+      "name": "History",
+      "unicode": "E81C"
+    },
+    {
+      "name": "Location",
+      "unicode": "E81D"
+    },
+    {
+      "name": "Work",
+      "unicode": "E821"
+    },
+    {
+      "name": "Recent",
+      "unicode": "E823"
+    },
+    {
+      "name": "Hotel",
+      "unicode": "E824"
+    },
+    {
+      "name": "LocationDot",
+      "unicode": "E827"
+    },
+    {
+      "name": "News",
+      "unicode": "E900"
+    },
+    {
+      "name": "Chat",
+      "unicode": "E901"
+    },
+    {
+      "name": "Group",
+      "unicode": "E902"
+    },
+    {
+      "name": "Previous",
+      "unicode": "E892"
+    },
+    {
+      "name": "Next",
+      "unicode": "E893"
+    },
+    {
+      "name": "Sync",
+      "unicode": "E895"
+    },
+    {
+      "name": "Help",
+      "unicode": "E897"
+    },
+    {
+      "name": "Emoji",
+      "unicode": "E899"
+    },
+    {
+      "name": "MailForward",
+      "unicode": "E89C"
+    },
+    {
+      "name": "ClosePane",
+      "unicode": "E89F"
+    },
+    {
+      "name": "OpenPane",
+      "unicode": "E8A0"
+    },
+    {
+      "name": "PreviewLink",
+      "unicode": "E8A1"
+    },
+    {
+      "name": "ZoomIn",
+      "unicode": "E8A3"
+    },
+    {
+      "name": "Bookmarks",
+      "unicode": "E8A4"
+    },
+    {
+      "name": "Document",
+      "unicode": "E8A5"
+    },
+    {
+      "name": "ProtectedDocument",
+      "unicode": "E8A6"
+    },
+    {
+      "name": "OpenInNewWindow",
+      "unicode": "E8A7"
+    },
+    {
+      "name": "MailFill",
+      "unicode": "E8A8"
+    },
+    {
+      "name": "ViewAll",
+      "unicode": "E8A9"
+    },
+    {
+      "name": "Switch",
+      "unicode": "E8AB"
+    },
+    {
+      "name": "Rename",
+      "unicode": "E8AC"
+    },
+    {
+      "name": "Import",
+      "unicode": "E8B5"
+    },
+    {
+      "name": "Picture",
+      "unicode": "E8B9"
+    },
+    {
+      "name": "ShowResults",
+      "unicode": "E8BC"
+    },
+    {
+      "name": "Message",
+      "unicode": "E8BD"
+    },
+    {
+      "name": "CalendarDay",
+      "unicode": "E8BF"
+    },
+    {
+      "name": "CalendarWeek",
+      "unicode": "E8C0"
+    },
+    {
+      "name": "MailReplyAll",
+      "unicode": "E8C2"
+    },
+    {
+      "name": "Read",
+      "unicode": "E8C3"
+    },
+    {
+      "name": "Cut",
+      "unicode": "E8C6"
+    },
+    {
+      "name": "PaymentCard",
+      "unicode": "E8C7"
+    },
+    {
+      "name": "Copy",
+      "unicode": "E8C8"
+    },
+    {
+      "name": "Important",
+      "unicode": "E8C9"
+    },
+    {
+      "name": "MailReply",
+      "unicode": "E8CA"
+    },
+    {
+      "name": "GotoToday",
+      "unicode": "E8D1"
+    },
+    {
+      "name": "Font",
+      "unicode": "E8D2"
+    },
+    {
+      "name": "FontColor",
+      "unicode": "E8D3"
+    },
+    {
+      "name": "FolderFill",
+      "unicode": "E8D5"
+    },
+    {
+      "name": "Permissions",
+      "unicode": "E8D7"
+    },
+    {
+      "name": "DisableUpdates",
+      "unicode": "E8D8"
+    },
+    {
+      "name": "Unfavorite",
+      "unicode": "E8D9"
+    },
+    {
+      "name": "Italic",
+      "unicode": "E8DB"
+    },
+    {
+      "name": "Underline",
+      "unicode": "E8DC"
+    },
+    {
+      "name": "Bold",
+      "unicode": "E8DD"
+    },
+    {
+      "name": "MoveToFolder",
+      "unicode": "E8DE"
+    },
+    {
+      "name": "Dislike",
+      "unicode": "E8E0"
+    },
+    {
+      "name": "Like",
+      "unicode": "E8E1"
+    },
+    {
+      "name": "AlignCenter",
+      "unicode": "E8E3"
+    },
+    {
+      "name": "OpenFile",
+      "unicode": "E8E5"
+    },
+    {
+      "name": "FontDecrease",
+      "unicode": "E8E7"
+    },
+    {
+      "name": "FontIncrease",
+      "unicode": "E8E8"
+    },
+    {
+      "name": "FontSize",
+      "unicode": "E8E9"
+    },
+    {
+      "name": "CellPhone",
+      "unicode": "E8EA"
+    },
+    {
+      "name": "Library",
+      "unicode": "E8F1"
+    },
+    {
+      "name": "PostUpdate",
+      "unicode": "E8F3"
+    },
+    {
+      "name": "NewFolder",
+      "unicode": "E8F4"
+    },
+    {
+      "name": "CalendarReply",
+      "unicode": "E8F5"
+    },
+    {
+      "name": "UnsyncFolder",
+      "unicode": "E8F6"
+    },
+    {
+      "name": "SyncFolder",
+      "unicode": "E8F7"
+    },
+    {
+      "name": "BlockContact",
+      "unicode": "E8F8"
+    },
+    {
+      "name": "BulletedList",
+      "unicode": "E8FD"
+    },
+    {
+      "name": "Preview",
+      "unicode": "E8FF"
+    },
+    {
+      "name": "World",
+      "unicode": "E909"
+    },
+    {
+      "name": "Comment",
+      "unicode": "E90A"
+    },
+    {
+      "name": "DockLeft",
+      "unicode": "E90C"
+    },
+    {
+      "name": "DockRight",
+      "unicode": "E90D"
+    },
+    {
+      "name": "Repair",
+      "unicode": "E90F"
+    },
+    {
+      "name": "Accounts",
+      "unicode": "E910"
+    },
+    {
+      "name": "RadioBullet",
+      "unicode": "E915"
+    },
+    {
+      "name": "Stopwatch",
+      "unicode": "E916"
+    },
+    {
+      "name": "Clock",
+      "unicode": "E917"
+    },
+    {
+      "name": "WorldClock",
+      "unicode": "E918"
+    },
+    {
+      "name": "AlarmClock",
+      "unicode": "E919"
+    },
+    {
+      "name": "Hospital",
+      "unicode": "E91D"
+    },
+    {
+      "name": "Timer",
+      "unicode": "E91E"
+    },
+    {
+      "name": "FullCircleMask",
+      "unicode": "E91F"
+    },
+    {
+      "name": "LocationFill",
+      "unicode": "E920"
+    },
+    {
+      "name": "ChromeMinimize",
+      "unicode": "E921"
+    },
+    {
+      "name": "Annotation",
+      "unicode": "E924"
+    },
+    {
+      "name": "ChromeClose",
+      "unicode": "E8BB"
+    },
+    {
+      "name": "Accept",
+      "unicode": "E8FB"
+    }
+  ]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-10.json b/packages/icons/config/fabric-icons-10.json
index f4e4b4a7689d0..64720f2ec6aef 100644
--- a/packages/icons/config/fabric-icons-10.json
+++ b/packages/icons/config/fabric-icons-10.json
@@ -1,396 +1,396 @@
 {
-	"fontName": "fabric-icons-10",
-	"fontFamilyName": "FabricMDL2Icons-10",
-	"excludeGlyphs": false,
-	"chunkSubsets": false,
-	"hashFontFileName": true,
-	"subsetChunkSettings": {
-		"maxSubsetSize": 100
-	},
-	"glyphs": [
-		{
-			"name": "BankSolid",
-			"unicode": "F34F"
-		},
-		{
-			"name": "DecisionSolid",
-			"unicode": "F350"
-		},
-		{
-			"name": "Parachute",
-			"unicode": "F351"
-		},
-		{
-			"name": "ParachuteSolid",
-			"unicode": "F352"
-		},
-		{
-			"name": "FiltersSolid",
-			"unicode": "F353"
-		},
-		{
-			"name": "ColorSolid",
-			"unicode": "F354"
-		},
-		{
-			"name": "ReviewSolid",
-			"unicode": "F355"
-		},
-		{
-			"name": "ReviewRequestSolid",
-			"unicode": "F356"
-		},
-		{
-			"name": "ReviewRequestMirroredSolid",
-			"unicode": "F357"
-		},
-		{
-			"name": "ReviewResponseSolid",
-			"unicode": "F358"
-		},
-		{
-			"name": "FeedbackRequestSolid",
-			"unicode": "F359"
-		},
-		{
-			"name": "FeedbackRequestMirroredSolid",
-			"unicode": "F35A"
-		},
-		{
-			"name": "FeedbackResponseSolid",
-			"unicode": "F35B"
-		},
-		{
-			"name": "WorkItemBar",
-			"unicode": "F35C"
-		},
-		{
-			"name": "WorkItemBarSolid",
-			"unicode": "F35D"
-		},
-		{
-			"name": "Separator",
-			"unicode": "F35E"
-		},
-		{
-			"name": "NavigateExternalInline",
-			"unicode": "F35F"
-		},
-		{
-			"name": "PlanView",
-			"unicode": "F360"
-		},
-		{
-			"name": "TimelineMatrixView",
-			"unicode": "F361"
-		},
-		{
-			"name": "EngineeringGroup",
-			"unicode": "F362"
-		},
-		{
-			"name": "ProjectCollection",
-			"unicode": "F363"
-		},
-		{
-			"name": "CaretBottomRightCenter8",
-			"unicode": "F364"
-		},
-		{
-			"name": "CaretBottomLeftCenter8",
-			"unicode": "F365"
-		},
-		{
-			"name": "CaretTopRightCenter8",
-			"unicode": "F366"
-		},
-		{
-			"name": "CaretTopLeftCenter8",
-			"unicode": "F367"
-		},
-		{
-			"name": "DonutChart",
-			"unicode": "F368"
-		},
-		{
-			"name": "ChevronUnfold10",
-			"unicode": "F369"
-		},
-		{
-			"name": "ChevronFold10",
-			"unicode": "F36A"
-		},
-		{
-			"name": "DoubleChevronDown8",
-			"unicode": "F36B"
-		},
-		{
-			"name": "DoubleChevronUp8",
-			"unicode": "F36C"
-		},
-		{
-			"name": "DoubleChevronLeft8",
-			"unicode": "F36D"
-		},
-		{
-			"name": "DoubleChevronRight8",
-			"unicode": "F36E"
-		},
-		{
-			"name": "ChevronDownEnd6",
-			"unicode": "F36F"
-		},
-		{
-			"name": "ChevronUpEnd6",
-			"unicode": "F370"
-		},
-		{
-			"name": "ChevronLeftEnd6",
-			"unicode": "F371"
-		},
-		{
-			"name": "ChevronRightEnd6",
-			"unicode": "F372"
-		},
-		{
-			"name": "AzureAPIManagement",
-			"unicode": "F37F"
-		},
-		{
-			"name": "AzureServiceEndpoint",
-			"unicode": "F380"
-		},
-		{
-			"name": "VSTSLogo",
-			"unicode": "F381"
-		},
-		{
-			"name": "VSTSAltLogo1",
-			"unicode": "F382"
-		},
-		{
-			"name": "VSTSAltLogo2",
-			"unicode": "F383"
-		},
-		{
-			"name": "FileTypeSolution",
-			"unicode": "F387"
-		},
-		{
-			"name": "WordLogoInverse16",
-			"unicode": "F390"
-		},
-		{
-			"name": "WordLogo16",
-			"unicode": "F391"
-		},
-		{
-			"name": "WordLogoFill16",
-			"unicode": "F392"
-		},
-		{
-			"name": "PowerPointLogoInverse16",
-			"unicode": "F393"
-		},
-		{
-			"name": "PowerPointLogo16",
-			"unicode": "F394"
-		},
-		{
-			"name": "PowerPointLogoFill16",
-			"unicode": "F395"
-		},
-		{
-			"name": "ExcelLogoInverse16",
-			"unicode": "F396"
-		},
-		{
-			"name": "ExcelLogo16",
-			"unicode": "F397"
-		},
-		{
-			"name": "ExcelLogoFill16",
-			"unicode": "F398"
-		},
-		{
-			"name": "OneNoteLogoInverse16",
-			"unicode": "F399"
-		},
-		{
-			"name": "OneNoteLogo16",
-			"unicode": "F39A"
-		},
-		{
-			"name": "OneNoteLogoFill16",
-			"unicode": "F39B"
-		},
-		{
-			"name": "OutlookLogoInverse16",
-			"unicode": "F39C"
-		},
-		{
-			"name": "OutlookLogo16",
-			"unicode": "F39D"
-		},
-		{
-			"name": "OutlookLogoFill16",
-			"unicode": "F39E"
-		},
-		{
-			"name": "PublisherLogoInverse16",
-			"unicode": "F39F"
-		},
-		{
-			"name": "PublisherLogo16",
-			"unicode": "F3A0"
-		},
-		{
-			"name": "PublisherLogoFill16",
-			"unicode": "F3A1"
-		},
-		{
-			"name": "VisioLogoInverse16",
-			"unicode": "F3A2"
-		},
-		{
-			"name": "VisioLogo16",
-			"unicode": "F3A3"
-		},
-		{
-			"name": "VisioLogoFill16",
-			"unicode": "F3A4"
-		},
-		{
-			"name": "TestBeaker",
-			"unicode": "F3A5"
-		},
-		{
-			"name": "TestBeakerSolid",
-			"unicode": "F3A6"
-		},
-		{
-			"name": "TestExploreSolid",
-			"unicode": "F3A7"
-		},
-		{
-			"name": "TestAutoSolid",
-			"unicode": "F3A8"
-		},
-		{
-			"name": "TestUserSolid",
-			"unicode": "F3A9"
-		},
-		{
-			"name": "TestImpactSolid",
-			"unicode": "F3AA"
-		},
-		{
-			"name": "TestPlan",
-			"unicode": "F3AB"
-		},
-		{
-			"name": "TestStep",
-			"unicode": "F3AC"
-		},
-		{
-			"name": "TestParameter",
-			"unicode": "F3AD"
-		},
-		{
-			"name": "TestSuite",
-			"unicode": "F3AE"
-		},
-		{
-			"name": "TestCase",
-			"unicode": "F3AF"
-		},
-		{
-			"name": "Sprint",
-			"unicode": "F3B0"
-		},
-		{
-			"name": "SignOut",
-			"unicode": "F3B1"
-		},
-		{
-			"name": "TriggerApproval",
-			"unicode": "F3B2"
-		},
-		{
-			"name": "Rocket",
-			"unicode": "F3B3"
-		},
-		{
-			"name": "AzureKeyVault",
-			"unicode": "F3B4"
-		},
-		{
-			"name": "LikeSolid",
-			"unicode": "F3BF"
-		},
-		{
-			"name": "DislikeSolid",
-			"unicode": "F3C0"
-		},
-		{
-			"name": "DeclineCall",
-			"unicode": "F405"
-		},
-		{
-			"name": "Spacer",
-			"unicode": "F40D"
-		},
-		{
-			"name": "SkypeLogo16",
-			"unicode": "F40E"
-		},
-		{
-			"name": "SkypeForBusinessLogo16",
-			"unicode": "F40F"
-		},
-		{
-			"name": "SkypeForBusinessLogoFill16",
-			"unicode": "F410"
-		},
-		{
-			"name": "FilterSolid",
-			"unicode": "F412"
-		},
-		{
-			"name": "MailUndelivered",
-			"unicode": "F415"
-		},
-		{
-			"name": "MailTentative",
-			"unicode": "F416"
-		},
-		{
-			"name": "MailTentativeMirrored",
-			"unicode": "F417"
-		},
-		{
-			"name": "MailReminder",
-			"unicode": "F418"
-		},
-		{
-			"name": "ReceiptUndelivered",
-			"unicode": "F419"
-		},
-		{
-			"name": "ReceiptTentative",
-			"unicode": "F41A"
-		},
-		{
-			"name": "ReceiptTentativeMirrored",
-			"unicode": "F41B"
-		},
-		{
-			"name": "Inbox",
-			"unicode": "F41C"
-		},
-		{
-			"name": "IRMReply",
-			"unicode": "F41D"
-		}
-	]
+  "fontName": "fabric-icons-10",
+  "fontFamilyName": "FabricMDL2Icons-10",
+  "excludeGlyphs": false,
+  "chunkSubsets": false,
+  "hashFontFileName": true,
+  "subsetChunkSettings": {
+    "maxSubsetSize": 100
+  },
+  "glyphs": [
+    {
+      "name": "BankSolid",
+      "unicode": "F34F"
+    },
+    {
+      "name": "DecisionSolid",
+      "unicode": "F350"
+    },
+    {
+      "name": "Parachute",
+      "unicode": "F351"
+    },
+    {
+      "name": "ParachuteSolid",
+      "unicode": "F352"
+    },
+    {
+      "name": "FiltersSolid",
+      "unicode": "F353"
+    },
+    {
+      "name": "ColorSolid",
+      "unicode": "F354"
+    },
+    {
+      "name": "ReviewSolid",
+      "unicode": "F355"
+    },
+    {
+      "name": "ReviewRequestSolid",
+      "unicode": "F356"
+    },
+    {
+      "name": "ReviewRequestMirroredSolid",
+      "unicode": "F357"
+    },
+    {
+      "name": "ReviewResponseSolid",
+      "unicode": "F358"
+    },
+    {
+      "name": "FeedbackRequestSolid",
+      "unicode": "F359"
+    },
+    {
+      "name": "FeedbackRequestMirroredSolid",
+      "unicode": "F35A"
+    },
+    {
+      "name": "FeedbackResponseSolid",
+      "unicode": "F35B"
+    },
+    {
+      "name": "WorkItemBar",
+      "unicode": "F35C"
+    },
+    {
+      "name": "WorkItemBarSolid",
+      "unicode": "F35D"
+    },
+    {
+      "name": "Separator",
+      "unicode": "F35E"
+    },
+    {
+      "name": "NavigateExternalInline",
+      "unicode": "F35F"
+    },
+    {
+      "name": "PlanView",
+      "unicode": "F360"
+    },
+    {
+      "name": "TimelineMatrixView",
+      "unicode": "F361"
+    },
+    {
+      "name": "EngineeringGroup",
+      "unicode": "F362"
+    },
+    {
+      "name": "ProjectCollection",
+      "unicode": "F363"
+    },
+    {
+      "name": "CaretBottomRightCenter8",
+      "unicode": "F364"
+    },
+    {
+      "name": "CaretBottomLeftCenter8",
+      "unicode": "F365"
+    },
+    {
+      "name": "CaretTopRightCenter8",
+      "unicode": "F366"
+    },
+    {
+      "name": "CaretTopLeftCenter8",
+      "unicode": "F367"
+    },
+    {
+      "name": "DonutChart",
+      "unicode": "F368"
+    },
+    {
+      "name": "ChevronUnfold10",
+      "unicode": "F369"
+    },
+    {
+      "name": "ChevronFold10",
+      "unicode": "F36A"
+    },
+    {
+      "name": "DoubleChevronDown8",
+      "unicode": "F36B"
+    },
+    {
+      "name": "DoubleChevronUp8",
+      "unicode": "F36C"
+    },
+    {
+      "name": "DoubleChevronLeft8",
+      "unicode": "F36D"
+    },
+    {
+      "name": "DoubleChevronRight8",
+      "unicode": "F36E"
+    },
+    {
+      "name": "ChevronDownEnd6",
+      "unicode": "F36F"
+    },
+    {
+      "name": "ChevronUpEnd6",
+      "unicode": "F370"
+    },
+    {
+      "name": "ChevronLeftEnd6",
+      "unicode": "F371"
+    },
+    {
+      "name": "ChevronRightEnd6",
+      "unicode": "F372"
+    },
+    {
+      "name": "AzureAPIManagement",
+      "unicode": "F37F"
+    },
+    {
+      "name": "AzureServiceEndpoint",
+      "unicode": "F380"
+    },
+    {
+      "name": "VSTSLogo",
+      "unicode": "F381"
+    },
+    {
+      "name": "VSTSAltLogo1",
+      "unicode": "F382"
+    },
+    {
+      "name": "VSTSAltLogo2",
+      "unicode": "F383"
+    },
+    {
+      "name": "FileTypeSolution",
+      "unicode": "F387"
+    },
+    {
+      "name": "WordLogoInverse16",
+      "unicode": "F390"
+    },
+    {
+      "name": "WordLogo16",
+      "unicode": "F391"
+    },
+    {
+      "name": "WordLogoFill16",
+      "unicode": "F392"
+    },
+    {
+      "name": "PowerPointLogoInverse16",
+      "unicode": "F393"
+    },
+    {
+      "name": "PowerPointLogo16",
+      "unicode": "F394"
+    },
+    {
+      "name": "PowerPointLogoFill16",
+      "unicode": "F395"
+    },
+    {
+      "name": "ExcelLogoInverse16",
+      "unicode": "F396"
+    },
+    {
+      "name": "ExcelLogo16",
+      "unicode": "F397"
+    },
+    {
+      "name": "ExcelLogoFill16",
+      "unicode": "F398"
+    },
+    {
+      "name": "OneNoteLogoInverse16",
+      "unicode": "F399"
+    },
+    {
+      "name": "OneNoteLogo16",
+      "unicode": "F39A"
+    },
+    {
+      "name": "OneNoteLogoFill16",
+      "unicode": "F39B"
+    },
+    {
+      "name": "OutlookLogoInverse16",
+      "unicode": "F39C"
+    },
+    {
+      "name": "OutlookLogo16",
+      "unicode": "F39D"
+    },
+    {
+      "name": "OutlookLogoFill16",
+      "unicode": "F39E"
+    },
+    {
+      "name": "PublisherLogoInverse16",
+      "unicode": "F39F"
+    },
+    {
+      "name": "PublisherLogo16",
+      "unicode": "F3A0"
+    },
+    {
+      "name": "PublisherLogoFill16",
+      "unicode": "F3A1"
+    },
+    {
+      "name": "VisioLogoInverse16",
+      "unicode": "F3A2"
+    },
+    {
+      "name": "VisioLogo16",
+      "unicode": "F3A3"
+    },
+    {
+      "name": "VisioLogoFill16",
+      "unicode": "F3A4"
+    },
+    {
+      "name": "TestBeaker",
+      "unicode": "F3A5"
+    },
+    {
+      "name": "TestBeakerSolid",
+      "unicode": "F3A6"
+    },
+    {
+      "name": "TestExploreSolid",
+      "unicode": "F3A7"
+    },
+    {
+      "name": "TestAutoSolid",
+      "unicode": "F3A8"
+    },
+    {
+      "name": "TestUserSolid",
+      "unicode": "F3A9"
+    },
+    {
+      "name": "TestImpactSolid",
+      "unicode": "F3AA"
+    },
+    {
+      "name": "TestPlan",
+      "unicode": "F3AB"
+    },
+    {
+      "name": "TestStep",
+      "unicode": "F3AC"
+    },
+    {
+      "name": "TestParameter",
+      "unicode": "F3AD"
+    },
+    {
+      "name": "TestSuite",
+      "unicode": "F3AE"
+    },
+    {
+      "name": "TestCase",
+      "unicode": "F3AF"
+    },
+    {
+      "name": "Sprint",
+      "unicode": "F3B0"
+    },
+    {
+      "name": "SignOut",
+      "unicode": "F3B1"
+    },
+    {
+      "name": "TriggerApproval",
+      "unicode": "F3B2"
+    },
+    {
+      "name": "Rocket",
+      "unicode": "F3B3"
+    },
+    {
+      "name": "AzureKeyVault",
+      "unicode": "F3B4"
+    },
+    {
+      "name": "LikeSolid",
+      "unicode": "F3BF"
+    },
+    {
+      "name": "DislikeSolid",
+      "unicode": "F3C0"
+    },
+    {
+      "name": "DeclineCall",
+      "unicode": "F405"
+    },
+    {
+      "name": "Spacer",
+      "unicode": "F40D"
+    },
+    {
+      "name": "SkypeLogo16",
+      "unicode": "F40E"
+    },
+    {
+      "name": "SkypeForBusinessLogo16",
+      "unicode": "F40F"
+    },
+    {
+      "name": "SkypeForBusinessLogoFill16",
+      "unicode": "F410"
+    },
+    {
+      "name": "FilterSolid",
+      "unicode": "F412"
+    },
+    {
+      "name": "MailUndelivered",
+      "unicode": "F415"
+    },
+    {
+      "name": "MailTentative",
+      "unicode": "F416"
+    },
+    {
+      "name": "MailTentativeMirrored",
+      "unicode": "F417"
+    },
+    {
+      "name": "MailReminder",
+      "unicode": "F418"
+    },
+    {
+      "name": "ReceiptUndelivered",
+      "unicode": "F419"
+    },
+    {
+      "name": "ReceiptTentative",
+      "unicode": "F41A"
+    },
+    {
+      "name": "ReceiptTentativeMirrored",
+      "unicode": "F41B"
+    },
+    {
+      "name": "Inbox",
+      "unicode": "F41C"
+    },
+    {
+      "name": "IRMReply",
+      "unicode": "F41D"
+    }
+  ]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-11.json b/packages/icons/config/fabric-icons-11.json
index 066d1fdcee213..89181f7e50c81 100644
--- a/packages/icons/config/fabric-icons-11.json
+++ b/packages/icons/config/fabric-icons-11.json
@@ -1,348 +1,348 @@
 {
-	"fontName": "fabric-icons-11",
-	"fontFamilyName": "FabricMDL2Icons-11",
-	"excludeGlyphs": false,
-	"chunkSubsets": true,
-	"hashFontFileName": true,
-	"subsetChunkSettings": {
-		"maxSubsetSize": 100
-	},
-	"glyphs": [
-		{
-			"name": "IRMReplyMirrored",
-			"unicode": "F41E"
-		},
-		{
-			"name": "IRMForward",
-			"unicode": "F41F"
-		},
-		{
-			"name": "IRMForwardMirrored",
-			"unicode": "F420"
-		},
-		{
-			"name": "VoicemailIRM",
-			"unicode": "F421"
-		},
-		{
-			"name": "EventAccepted",
-			"unicode": "F422"
-		},
-		{
-			"name": "EventTentative",
-			"unicode": "F423"
-		},
-		{
-			"name": "EventTentativeMirrored",
-			"unicode": "F424"
-		},
-		{
-			"name": "EventDeclined",
-			"unicode": "F425"
-		},
-		{
-			"name": "IDBadge",
-			"unicode": "F427"
-		},
-		{
-			"name": "OfficeFormsLogoInverse16",
-			"unicode": "F433"
-		},
-		{
-			"name": "OfficeFormsLogo",
-			"unicode": "F434"
-		},
-		{
-			"name": "OfficeFormsLogoFill",
-			"unicode": "F435"
-		},
-		{
-			"name": "OfficeFormsLogo16",
-			"unicode": "F436"
-		},
-		{
-			"name": "OfficeFormsLogoFill16",
-			"unicode": "F437"
-		},
-		{
-			"name": "OfficeFormsLogoInverse24",
-			"unicode": "F43A"
-		},
-		{
-			"name": "OfficeFormsLogo24",
-			"unicode": "F43B"
-		},
-		{
-			"name": "OfficeFormsLogoFill24",
-			"unicode": "F43C"
-		},
-		{
-			"name": "PageLock",
-			"unicode": "F43F"
-		},
-		{
-			"name": "NotExecuted",
-			"unicode": "F440"
-		},
-		{
-			"name": "NotImpactedSolid",
-			"unicode": "F441"
-		},
-		{
-			"name": "FieldReadOnly",
-			"unicode": "F442"
-		},
-		{
-			"name": "FieldRequired",
-			"unicode": "F443"
-		},
-		{
-			"name": "BacklogBoard",
-			"unicode": "F444"
-		},
-		{
-			"name": "ExternalBuild",
-			"unicode": "F445"
-		},
-		{
-			"name": "ExternalTFVC",
-			"unicode": "F446"
-		},
-		{
-			"name": "ExternalXAML",
-			"unicode": "F447"
-		},
-		{
-			"name": "IssueSolid",
-			"unicode": "F448"
-		},
-		{
-			"name": "DefectSolid",
-			"unicode": "F449"
-		},
-		{
-			"name": "LadybugSolid",
-			"unicode": "F44A"
-		},
-		{
-			"name": "MTMLogo",
-			"unicode": "F44B"
-		},
-		{
-			"name": "NugetLogo",
-			"unicode": "F44C"
-		},
-		{
-			"name": "TFVCLogo",
-			"unicode": "F44D"
-		},
-		{
-			"name": "ProjectLogo32",
-			"unicode": "F47E"
-		},
-		{
-			"name": "ProjectLogoFill32",
-			"unicode": "F47F"
-		},
-		{
-			"name": "ProjectLogo16",
-			"unicode": "F480"
-		},
-		{
-			"name": "ProjectLogoFill16",
-			"unicode": "F481"
-		},
-		{
-			"name": "SwayLogo32",
-			"unicode": "F482"
-		},
-		{
-			"name": "SwayLogoFill32",
-			"unicode": "F483"
-		},
-		{
-			"name": "SwayLogo16",
-			"unicode": "F484"
-		},
-		{
-			"name": "SwayLogoFill16",
-			"unicode": "F485"
-		},
-		{
-			"name": "ClassNotebookLogo32",
-			"unicode": "F486"
-		},
-		{
-			"name": "ClassNotebookLogoFill32",
-			"unicode": "F487"
-		},
-		{
-			"name": "ClassNotebookLogo16",
-			"unicode": "F488"
-		},
-		{
-			"name": "ClassNotebookLogoFill16",
-			"unicode": "F489"
-		},
-		{
-			"name": "ClassNotebookLogoInverse32",
-			"unicode": "F48A"
-		},
-		{
-			"name": "ClassNotebookLogoInverse16",
-			"unicode": "F48B"
-		},
-		{
-			"name": "StaffNotebookLogo32",
-			"unicode": "F48C"
-		},
-		{
-			"name": "StaffNotebookLogoFill32",
-			"unicode": "F48D"
-		},
-		{
-			"name": "StaffNotebookLogo16",
-			"unicode": "F48E"
-		},
-		{
-			"name": "StaffNotebookLogoFill16",
-			"unicode": "F48F"
-		},
-		{
-			"name": "StaffNotebookLogoInverted32",
-			"unicode": "F490"
-		},
-		{
-			"name": "StaffNotebookLogoInverted16",
-			"unicode": "F491"
-		},
-		{
-			"name": "KaizalaLogo",
-			"unicode": "F492"
-		},
-		{
-			"name": "TaskLogo",
-			"unicode": "F493"
-		},
-		{
-			"name": "ProtectionCenterLogo32",
-			"unicode": "F494"
-		},
-		{
-			"name": "NonprofitLogo32",
-			"unicode": "F495"
-		},
-		{
-			"name": "GallatinLogo",
-			"unicode": "F496"
-		},
-		{
-			"name": "Globe2",
-			"unicode": "F49A"
-		},
-		{
-			"name": "Guitar",
-			"unicode": "F49B"
-		},
-		{
-			"name": "Breakfast",
-			"unicode": "F49C"
-		},
-		{
-			"name": "Brunch",
-			"unicode": "F49D"
-		},
-		{
-			"name": "BeerMug",
-			"unicode": "F49E"
-		},
-		{
-			"name": "Vacation",
-			"unicode": "F49F"
-		},
-		{
-			"name": "Teeth",
-			"unicode": "F4A0"
-		},
-		{
-			"name": "Taxi",
-			"unicode": "F4A1"
-		},
-		{
-			"name": "Chopsticks",
-			"unicode": "F4A2"
-		},
-		{
-			"name": "SyncOccurence",
-			"unicode": "F4A3"
-		},
-		{
-			"name": "UnsyncOccurence",
-			"unicode": "F4A4"
-		},
-		{
-			"name": "PrimaryCalendar",
-			"unicode": "F4AE"
-		},
-		{
-			"name": "SearchCalendar",
-			"unicode": "F4AF"
-		},
-		{
-			"name": "VideoOff",
-			"unicode": "F4B0"
-		},
-		{
-			"name": "MicrosoftFlowLogo",
-			"unicode": "F4B1"
-		},
-		{
-			"name": "BusinessCenterLogo",
-			"unicode": "F4B2"
-		},
-		{
-			"name": "ToDoLogoBottom",
-			"unicode": "F4B3"
-		},
-		{
-			"name": "ToDoLogoTop",
-			"unicode": "F4B4"
-		},
-		{
-			"name": "EditSolid12",
-			"unicode": "F4B5"
-		},
-		{
-			"name": "EditSolidMirrored12",
-			"unicode": "F4B6"
-		},
-		{
-			"name": "UneditableSolid12",
-			"unicode": "F4B7"
-		},
-		{
-			"name": "UneditableSolidMirrored12",
-			"unicode": "F4B8"
-		},
-		{
-			"name": "UneditableMirrored",
-			"unicode": "F4B9"
-		},
-		{
-			"name": "AdminALogo32",
-			"unicode": "F4BA"
-		},
-		{
-			"name": "AdminALogoFill32",
-			"unicode": "F4BB"
-		},
-		{
-			"name": "ToDoLogoInverse",
-			"unicode": "F4BC"
-		},
-		{
-			"name": "Snooze",
-			"unicode": "F4BD"
-		}
-	]
+  "fontName": "fabric-icons-11",
+  "fontFamilyName": "FabricMDL2Icons-11",
+  "excludeGlyphs": false,
+  "chunkSubsets": true,
+  "hashFontFileName": true,
+  "subsetChunkSettings": {
+    "maxSubsetSize": 100
+  },
+  "glyphs": [
+    {
+      "name": "IRMReplyMirrored",
+      "unicode": "F41E"
+    },
+    {
+      "name": "IRMForward",
+      "unicode": "F41F"
+    },
+    {
+      "name": "IRMForwardMirrored",
+      "unicode": "F420"
+    },
+    {
+      "name": "VoicemailIRM",
+      "unicode": "F421"
+    },
+    {
+      "name": "EventAccepted",
+      "unicode": "F422"
+    },
+    {
+      "name": "EventTentative",
+      "unicode": "F423"
+    },
+    {
+      "name": "EventTentativeMirrored",
+      "unicode": "F424"
+    },
+    {
+      "name": "EventDeclined",
+      "unicode": "F425"
+    },
+    {
+      "name": "IDBadge",
+      "unicode": "F427"
+    },
+    {
+      "name": "OfficeFormsLogoInverse16",
+      "unicode": "F433"
+    },
+    {
+      "name": "OfficeFormsLogo",
+      "unicode": "F434"
+    },
+    {
+      "name": "OfficeFormsLogoFill",
+      "unicode": "F435"
+    },
+    {
+      "name": "OfficeFormsLogo16",
+      "unicode": "F436"
+    },
+    {
+      "name": "OfficeFormsLogoFill16",
+      "unicode": "F437"
+    },
+    {
+      "name": "OfficeFormsLogoInverse24",
+      "unicode": "F43A"
+    },
+    {
+      "name": "OfficeFormsLogo24",
+      "unicode": "F43B"
+    },
+    {
+      "name": "OfficeFormsLogoFill24",
+      "unicode": "F43C"
+    },
+    {
+      "name": "PageLock",
+      "unicode": "F43F"
+    },
+    {
+      "name": "NotExecuted",
+      "unicode": "F440"
+    },
+    {
+      "name": "NotImpactedSolid",
+      "unicode": "F441"
+    },
+    {
+      "name": "FieldReadOnly",
+      "unicode": "F442"
+    },
+    {
+      "name": "FieldRequired",
+      "unicode": "F443"
+    },
+    {
+      "name": "BacklogBoard",
+      "unicode": "F444"
+    },
+    {
+      "name": "ExternalBuild",
+      "unicode": "F445"
+    },
+    {
+      "name": "ExternalTFVC",
+      "unicode": "F446"
+    },
+    {
+      "name": "ExternalXAML",
+      "unicode": "F447"
+    },
+    {
+      "name": "IssueSolid",
+      "unicode": "F448"
+    },
+    {
+      "name": "DefectSolid",
+      "unicode": "F449"
+    },
+    {
+      "name": "LadybugSolid",
+      "unicode": "F44A"
+    },
+    {
+      "name": "MTMLogo",
+      "unicode": "F44B"
+    },
+    {
+      "name": "NugetLogo",
+      "unicode": "F44C"
+    },
+    {
+      "name": "TFVCLogo",
+      "unicode": "F44D"
+    },
+    {
+      "name": "ProjectLogo32",
+      "unicode": "F47E"
+    },
+    {
+      "name": "ProjectLogoFill32",
+      "unicode": "F47F"
+    },
+    {
+      "name": "ProjectLogo16",
+      "unicode": "F480"
+    },
+    {
+      "name": "ProjectLogoFill16",
+      "unicode": "F481"
+    },
+    {
+      "name": "SwayLogo32",
+      "unicode": "F482"
+    },
+    {
+      "name": "SwayLogoFill32",
+      "unicode": "F483"
+    },
+    {
+      "name": "SwayLogo16",
+      "unicode": "F484"
+    },
+    {
+      "name": "SwayLogoFill16",
+      "unicode": "F485"
+    },
+    {
+      "name": "ClassNotebookLogo32",
+      "unicode": "F486"
+    },
+    {
+      "name": "ClassNotebookLogoFill32",
+      "unicode": "F487"
+    },
+    {
+      "name": "ClassNotebookLogo16",
+      "unicode": "F488"
+    },
+    {
+      "name": "ClassNotebookLogoFill16",
+      "unicode": "F489"
+    },
+    {
+      "name": "ClassNotebookLogoInverse32",
+      "unicode": "F48A"
+    },
+    {
+      "name": "ClassNotebookLogoInverse16",
+      "unicode": "F48B"
+    },
+    {
+      "name": "StaffNotebookLogo32",
+      "unicode": "F48C"
+    },
+    {
+      "name": "StaffNotebookLogoFill32",
+      "unicode": "F48D"
+    },
+    {
+      "name": "StaffNotebookLogo16",
+      "unicode": "F48E"
+    },
+    {
+      "name": "StaffNotebookLogoFill16",
+      "unicode": "F48F"
+    },
+    {
+      "name": "StaffNotebookLogoInverted32",
+      "unicode": "F490"
+    },
+    {
+      "name": "StaffNotebookLogoInverted16",
+      "unicode": "F491"
+    },
+    {
+      "name": "KaizalaLogo",
+      "unicode": "F492"
+    },
+    {
+      "name": "TaskLogo",
+      "unicode": "F493"
+    },
+    {
+      "name": "ProtectionCenterLogo32",
+      "unicode": "F494"
+    },
+    {
+      "name": "NonprofitLogo32",
+      "unicode": "F495"
+    },
+    {
+      "name": "GallatinLogo",
+      "unicode": "F496"
+    },
+    {
+      "name": "Globe2",
+      "unicode": "F49A"
+    },
+    {
+      "name": "Guitar",
+      "unicode": "F49B"
+    },
+    {
+      "name": "Breakfast",
+      "unicode": "F49C"
+    },
+    {
+      "name": "Brunch",
+      "unicode": "F49D"
+    },
+    {
+      "name": "BeerMug",
+      "unicode": "F49E"
+    },
+    {
+      "name": "Vacation",
+      "unicode": "F49F"
+    },
+    {
+      "name": "Teeth",
+      "unicode": "F4A0"
+    },
+    {
+      "name": "Taxi",
+      "unicode": "F4A1"
+    },
+    {
+      "name": "Chopsticks",
+      "unicode": "F4A2"
+    },
+    {
+      "name": "SyncOccurence",
+      "unicode": "F4A3"
+    },
+    {
+      "name": "UnsyncOccurence",
+      "unicode": "F4A4"
+    },
+    {
+      "name": "PrimaryCalendar",
+      "unicode": "F4AE"
+    },
+    {
+      "name": "SearchCalendar",
+      "unicode": "F4AF"
+    },
+    {
+      "name": "VideoOff",
+      "unicode": "F4B0"
+    },
+    {
+      "name": "MicrosoftFlowLogo",
+      "unicode": "F4B1"
+    },
+    {
+      "name": "BusinessCenterLogo",
+      "unicode": "F4B2"
+    },
+    {
+      "name": "ToDoLogoBottom",
+      "unicode": "F4B3"
+    },
+    {
+      "name": "ToDoLogoTop",
+      "unicode": "F4B4"
+    },
+    {
+      "name": "EditSolid12",
+      "unicode": "F4B5"
+    },
+    {
+      "name": "EditSolidMirrored12",
+      "unicode": "F4B6"
+    },
+    {
+      "name": "UneditableSolid12",
+      "unicode": "F4B7"
+    },
+    {
+      "name": "UneditableSolidMirrored12",
+      "unicode": "F4B8"
+    },
+    {
+      "name": "UneditableMirrored",
+      "unicode": "F4B9"
+    },
+    {
+      "name": "AdminALogo32",
+      "unicode": "F4BA"
+    },
+    {
+      "name": "AdminALogoFill32",
+      "unicode": "F4BB"
+    },
+    {
+      "name": "ToDoLogoInverse",
+      "unicode": "F4BC"
+    },
+    {
+      "name": "Snooze",
+      "unicode": "F4BD"
+    }
+  ]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-2.json b/packages/icons/config/fabric-icons-2.json
index 14778741c089a..4740337c3f9b6 100644
--- a/packages/icons/config/fabric-icons-2.json
+++ b/packages/icons/config/fabric-icons-2.json
@@ -1,412 +1,412 @@
 {
-	"fontName": "fabric-icons-2",
-	"fontFamilyName": "FabricMDL2Icons-2",
-	"excludeGlyphs": false,
-	"chunkSubsets": true,
-	"hashFontFileName": true,
-	"subsetChunkSettings": {
-		"maxSubsetSize": 100
-	},
-	"glyphs": [
-		{
-			"name": "Fingerprint",
-			"unicode": "E928"
-		},
-		{
-			"name": "Handwriting",
-			"unicode": "E929"
-		},
-		{
-			"name": "StackIndicator",
-			"unicode": "E7FF"
-		},
-		{
-			"name": "Completed",
-			"unicode": "E930"
-		},
-		{
-			"name": "Label",
-			"unicode": "E932"
-		},
-		{
-			"name": "FlickDown",
-			"unicode": "E935"
-		},
-		{
-			"name": "FlickUp",
-			"unicode": "E936"
-		},
-		{
-			"name": "FlickLeft",
-			"unicode": "E937"
-		},
-		{
-			"name": "FlickRight",
-			"unicode": "E938"
-		},
-		{
-			"name": "Streaming",
-			"unicode": "E93E"
-		},
-		{
-			"name": "MusicInCollection",
-			"unicode": "E940"
-		},
-		{
-			"name": "OneDrive",
-			"unicode": "E941"
-		},
-		{
-			"name": "CompassNW",
-			"unicode": "E942"
-		},
-		{
-			"name": "Code",
-			"unicode": "E943"
-		},
-		{
-			"name": "LightningBolt",
-			"unicode": "E945"
-		},
-		{
-			"name": "CalculatorMultiply",
-			"unicode": "E947"
-		},
-		{
-			"name": "CalculatorAddition",
-			"unicode": "E948"
-		},
-		{
-			"name": "CalculatorSubtract",
-			"unicode": "E949"
-		},
-		{
-			"name": "CalculatorEqualTo",
-			"unicode": "E94E"
-		},
-		{
-			"name": "PrintfaxPrinterFile",
-			"unicode": "E956"
-		},
-		{
-			"name": "Communications",
-			"unicode": "E95A"
-		},
-		{
-			"name": "Headset",
-			"unicode": "E95B"
-		},
-		{
-			"name": "Health",
-			"unicode": "E95E"
-		},
-		{
-			"name": "ChevronUpSmall",
-			"unicode": "E96D"
-		},
-		{
-			"name": "ChevronDownSmall",
-			"unicode": "E96E"
-		},
-		{
-			"name": "ChevronLeftSmall",
-			"unicode": "E96F"
-		},
-		{
-			"name": "ChevronRightSmall",
-			"unicode": "E970"
-		},
-		{
-			"name": "ChevronUpMed",
-			"unicode": "E971"
-		},
-		{
-			"name": "ChevronDownMed",
-			"unicode": "E972"
-		},
-		{
-			"name": "ChevronLeftMed",
-			"unicode": "E973"
-		},
-		{
-			"name": "ChevronRightMed",
-			"unicode": "E974"
-		},
-		{
-			"name": "Dictionary",
-			"unicode": "E82D"
-		},
-		{
-			"name": "ChromeBack",
-			"unicode": "E830"
-		},
-		{
-			"name": "PC1",
-			"unicode": "E977"
-		},
-		{
-			"name": "PresenceChickletVideo",
-			"unicode": "E979"
-		},
-		{
-			"name": "Reply",
-			"unicode": "E97A"
-		},
-		{
-			"name": "HalfAlpha",
-			"unicode": "E97E"
-		},
-		{
-			"name": "LockSolid",
-			"unicode": "E9A2"
-		},
-		{
-			"name": "ConstructionCone",
-			"unicode": "E98F"
-		},
-		{
-			"name": "DoubleChevronLeftMed",
-			"unicode": "E991"
-		},
-		{
-			"name": "Volume0",
-			"unicode": "E992"
-		},
-		{
-			"name": "Volume1",
-			"unicode": "E993"
-		},
-		{
-			"name": "Volume2",
-			"unicode": "E994"
-		},
-		{
-			"name": "Volume3",
-			"unicode": "E995"
-		},
-		{
-			"name": "CaretHollow",
-			"unicode": "E817"
-		},
-		{
-			"name": "CaretSolid",
-			"unicode": "E818"
-		},
-		{
-			"name": "FolderOpen",
-			"unicode": "E838"
-		},
-		{
-			"name": "PinnedFill",
-			"unicode": "E842"
-		},
-		{
-			"name": "Chart",
-			"unicode": "E999"
-		},
-		{
-			"name": "Robot",
-			"unicode": "E99A"
-		},
-		{
-			"name": "BidiLtr",
-			"unicode": "E9AA"
-		},
-		{
-			"name": "BidiRtl",
-			"unicode": "E9AB"
-		},
-		{
-			"name": "RevToggleKey",
-			"unicode": "E845"
-		},
-		{
-			"name": "RightDoubleQuote",
-			"unicode": "E9B1"
-		},
-		{
-			"name": "Sunny",
-			"unicode": "E9BD"
-		},
-		{
-			"name": "CloudWeather",
-			"unicode": "E9BE"
-		},
-		{
-			"name": "Cloudy",
-			"unicode": "E9BF"
-		},
-		{
-			"name": "PartlyCloudyDay",
-			"unicode": "E9C0"
-		},
-		{
-			"name": "PartlyCloudyNight",
-			"unicode": "E9C1"
-		},
-		{
-			"name": "ClearNight",
-			"unicode": "E9C2"
-		},
-		{
-			"name": "RainShowersDay",
-			"unicode": "E9C3"
-		},
-		{
-			"name": "Rain",
-			"unicode": "E9C4"
-		},
-		{
-			"name": "Thunderstorms",
-			"unicode": "E9C6"
-		},
-		{
-			"name": "RainSnow",
-			"unicode": "E9C7"
-		},
-		{
-			"name": "Snow",
-			"unicode": "E9C8"
-		},
-		{
-			"name": "BlowingSnow",
-			"unicode": "E9C9"
-		},
-		{
-			"name": "Frigid",
-			"unicode": "E9CA"
-		},
-		{
-			"name": "Fog",
-			"unicode": "E9CB"
-		},
-		{
-			"name": "Squalls",
-			"unicode": "E9CC"
-		},
-		{
-			"name": "Duststorm",
-			"unicode": "E9CD"
-		},
-		{
-			"name": "Unknown",
-			"unicode": "E9CE"
-		},
-		{
-			"name": "Precipitation",
-			"unicode": "E9CF"
-		},
-		{
-			"name": "Ringer",
-			"unicode": "EA8F"
-		},
-		{
-			"name": "PDF",
-			"unicode": "EA90"
-		},
-		{
-			"name": "Ribbon",
-			"unicode": "E9D1"
-		},
-		{
-			"name": "AreaChart",
-			"unicode": "E9D2"
-		},
-		{
-			"name": "Assign",
-			"unicode": "E9D3"
-		},
-		{
-			"name": "CheckList",
-			"unicode": "E9D5"
-		},
-		{
-			"name": "Diagnostic",
-			"unicode": "E9D9"
-		},
-		{
-			"name": "Generate",
-			"unicode": "E9DA"
-		},
-		{
-			"name": "LineChart",
-			"unicode": "E9E6"
-		},
-		{
-			"name": "Equalizer",
-			"unicode": "E9E9"
-		},
-		{
-			"name": "BarChartHorizontal",
-			"unicode": "E9EB"
-		},
-		{
-			"name": "BarChartVertical",
-			"unicode": "E9EC"
-		},
-		{
-			"name": "Freezing",
-			"unicode": "E9EF"
-		},
-		{
-			"name": "Processing",
-			"unicode": "E9F5"
-		},
-		{
-			"name": "SnowShowerDay",
-			"unicode": "E9FD"
-		},
-		{
-			"name": "HailDay",
-			"unicode": "EA00"
-		},
-		{
-			"name": "WorkFlow",
-			"unicode": "EA01"
-		},
-		{
-			"name": "StoreLogoMed",
-			"unicode": "EA04"
-		},
-		{
-			"name": "TriangleSolid",
-			"unicode": "EA08"
-		},
-		{
-			"name": "RainShowersNight",
-			"unicode": "EA0F"
-		},
-		{
-			"name": "SnowShowerNight",
-			"unicode": "EA11"
-		},
-		{
-			"name": "HailNight",
-			"unicode": "EA13"
-		},
-		{
-			"name": "Info2",
-			"unicode": "EA1F"
-		},
-		{
-			"name": "StoreLogo",
-			"unicode": "EA96"
-		},
-		{
-			"name": "MultiSelectMirrored",
-			"unicode": "EA98"
-		},
-		{
-			"name": "Broom",
-			"unicode": "EA99"
-		},
-		{
-			"name": "MusicInCollectionFill",
-			"unicode": "EA36"
-		},
-		{
-			"name": "Asterisk",
-			"unicode": "EA38"
-		}
-	]
+  "fontName": "fabric-icons-2",
+  "fontFamilyName": "FabricMDL2Icons-2",
+  "excludeGlyphs": false,
+  "chunkSubsets": true,
+  "hashFontFileName": true,
+  "subsetChunkSettings": {
+    "maxSubsetSize": 100
+  },
+  "glyphs": [
+    {
+      "name": "Fingerprint",
+      "unicode": "E928"
+    },
+    {
+      "name": "Handwriting",
+      "unicode": "E929"
+    },
+    {
+      "name": "StackIndicator",
+      "unicode": "E7FF"
+    },
+    {
+      "name": "Completed",
+      "unicode": "E930"
+    },
+    {
+      "name": "Label",
+      "unicode": "E932"
+    },
+    {
+      "name": "FlickDown",
+      "unicode": "E935"
+    },
+    {
+      "name": "FlickUp",
+      "unicode": "E936"
+    },
+    {
+      "name": "FlickLeft",
+      "unicode": "E937"
+    },
+    {
+      "name": "FlickRight",
+      "unicode": "E938"
+    },
+    {
+      "name": "Streaming",
+      "unicode": "E93E"
+    },
+    {
+      "name": "MusicInCollection",
+      "unicode": "E940"
+    },
+    {
+      "name": "OneDrive",
+      "unicode": "E941"
+    },
+    {
+      "name": "CompassNW",
+      "unicode": "E942"
+    },
+    {
+      "name": "Code",
+      "unicode": "E943"
+    },
+    {
+      "name": "LightningBolt",
+      "unicode": "E945"
+    },
+    {
+      "name": "CalculatorMultiply",
+      "unicode": "E947"
+    },
+    {
+      "name": "CalculatorAddition",
+      "unicode": "E948"
+    },
+    {
+      "name": "CalculatorSubtract",
+      "unicode": "E949"
+    },
+    {
+      "name": "CalculatorEqualTo",
+      "unicode": "E94E"
+    },
+    {
+      "name": "PrintfaxPrinterFile",
+      "unicode": "E956"
+    },
+    {
+      "name": "Communications",
+      "unicode": "E95A"
+    },
+    {
+      "name": "Headset",
+      "unicode": "E95B"
+    },
+    {
+      "name": "Health",
+      "unicode": "E95E"
+    },
+    {
+      "name": "ChevronUpSmall",
+      "unicode": "E96D"
+    },
+    {
+      "name": "ChevronDownSmall",
+      "unicode": "E96E"
+    },
+    {
+      "name": "ChevronLeftSmall",
+      "unicode": "E96F"
+    },
+    {
+      "name": "ChevronRightSmall",
+      "unicode": "E970"
+    },
+    {
+      "name": "ChevronUpMed",
+      "unicode": "E971"
+    },
+    {
+      "name": "ChevronDownMed",
+      "unicode": "E972"
+    },
+    {
+      "name": "ChevronLeftMed",
+      "unicode": "E973"
+    },
+    {
+      "name": "ChevronRightMed",
+      "unicode": "E974"
+    },
+    {
+      "name": "Dictionary",
+      "unicode": "E82D"
+    },
+    {
+      "name": "ChromeBack",
+      "unicode": "E830"
+    },
+    {
+      "name": "PC1",
+      "unicode": "E977"
+    },
+    {
+      "name": "PresenceChickletVideo",
+      "unicode": "E979"
+    },
+    {
+      "name": "Reply",
+      "unicode": "E97A"
+    },
+    {
+      "name": "HalfAlpha",
+      "unicode": "E97E"
+    },
+    {
+      "name": "LockSolid",
+      "unicode": "E9A2"
+    },
+    {
+      "name": "ConstructionCone",
+      "unicode": "E98F"
+    },
+    {
+      "name": "DoubleChevronLeftMed",
+      "unicode": "E991"
+    },
+    {
+      "name": "Volume0",
+      "unicode": "E992"
+    },
+    {
+      "name": "Volume1",
+      "unicode": "E993"
+    },
+    {
+      "name": "Volume2",
+      "unicode": "E994"
+    },
+    {
+      "name": "Volume3",
+      "unicode": "E995"
+    },
+    {
+      "name": "CaretHollow",
+      "unicode": "E817"
+    },
+    {
+      "name": "CaretSolid",
+      "unicode": "E818"
+    },
+    {
+      "name": "FolderOpen",
+      "unicode": "E838"
+    },
+    {
+      "name": "PinnedFill",
+      "unicode": "E842"
+    },
+    {
+      "name": "Chart",
+      "unicode": "E999"
+    },
+    {
+      "name": "Robot",
+      "unicode": "E99A"
+    },
+    {
+      "name": "BidiLtr",
+      "unicode": "E9AA"
+    },
+    {
+      "name": "BidiRtl",
+      "unicode": "E9AB"
+    },
+    {
+      "name": "RevToggleKey",
+      "unicode": "E845"
+    },
+    {
+      "name": "RightDoubleQuote",
+      "unicode": "E9B1"
+    },
+    {
+      "name": "Sunny",
+      "unicode": "E9BD"
+    },
+    {
+      "name": "CloudWeather",
+      "unicode": "E9BE"
+    },
+    {
+      "name": "Cloudy",
+      "unicode": "E9BF"
+    },
+    {
+      "name": "PartlyCloudyDay",
+      "unicode": "E9C0"
+    },
+    {
+      "name": "PartlyCloudyNight",
+      "unicode": "E9C1"
+    },
+    {
+      "name": "ClearNight",
+      "unicode": "E9C2"
+    },
+    {
+      "name": "RainShowersDay",
+      "unicode": "E9C3"
+    },
+    {
+      "name": "Rain",
+      "unicode": "E9C4"
+    },
+    {
+      "name": "Thunderstorms",
+      "unicode": "E9C6"
+    },
+    {
+      "name": "RainSnow",
+      "unicode": "E9C7"
+    },
+    {
+      "name": "Snow",
+      "unicode": "E9C8"
+    },
+    {
+      "name": "BlowingSnow",
+      "unicode": "E9C9"
+    },
+    {
+      "name": "Frigid",
+      "unicode": "E9CA"
+    },
+    {
+      "name": "Fog",
+      "unicode": "E9CB"
+    },
+    {
+      "name": "Squalls",
+      "unicode": "E9CC"
+    },
+    {
+      "name": "Duststorm",
+      "unicode": "E9CD"
+    },
+    {
+      "name": "Unknown",
+      "unicode": "E9CE"
+    },
+    {
+      "name": "Precipitation",
+      "unicode": "E9CF"
+    },
+    {
+      "name": "Ringer",
+      "unicode": "EA8F"
+    },
+    {
+      "name": "PDF",
+      "unicode": "EA90"
+    },
+    {
+      "name": "Ribbon",
+      "unicode": "E9D1"
+    },
+    {
+      "name": "AreaChart",
+      "unicode": "E9D2"
+    },
+    {
+      "name": "Assign",
+      "unicode": "E9D3"
+    },
+    {
+      "name": "CheckList",
+      "unicode": "E9D5"
+    },
+    {
+      "name": "Diagnostic",
+      "unicode": "E9D9"
+    },
+    {
+      "name": "Generate",
+      "unicode": "E9DA"
+    },
+    {
+      "name": "LineChart",
+      "unicode": "E9E6"
+    },
+    {
+      "name": "Equalizer",
+      "unicode": "E9E9"
+    },
+    {
+      "name": "BarChartHorizontal",
+      "unicode": "E9EB"
+    },
+    {
+      "name": "BarChartVertical",
+      "unicode": "E9EC"
+    },
+    {
+      "name": "Freezing",
+      "unicode": "E9EF"
+    },
+    {
+      "name": "Processing",
+      "unicode": "E9F5"
+    },
+    {
+      "name": "SnowShowerDay",
+      "unicode": "E9FD"
+    },
+    {
+      "name": "HailDay",
+      "unicode": "EA00"
+    },
+    {
+      "name": "WorkFlow",
+      "unicode": "EA01"
+    },
+    {
+      "name": "StoreLogoMed",
+      "unicode": "EA04"
+    },
+    {
+      "name": "TriangleSolid",
+      "unicode": "EA08"
+    },
+    {
+      "name": "RainShowersNight",
+      "unicode": "EA0F"
+    },
+    {
+      "name": "SnowShowerNight",
+      "unicode": "EA11"
+    },
+    {
+      "name": "HailNight",
+      "unicode": "EA13"
+    },
+    {
+      "name": "Info2",
+      "unicode": "EA1F"
+    },
+    {
+      "name": "StoreLogo",
+      "unicode": "EA96"
+    },
+    {
+      "name": "MultiSelectMirrored",
+      "unicode": "EA98"
+    },
+    {
+      "name": "Broom",
+      "unicode": "EA99"
+    },
+    {
+      "name": "MusicInCollectionFill",
+      "unicode": "EA36"
+    },
+    {
+      "name": "Asterisk",
+      "unicode": "EA38"
+    }
+  ]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-3.json b/packages/icons/config/fabric-icons-3.json
index 41765e0c23989..dc4c3665aadaa 100644
--- a/packages/icons/config/fabric-icons-3.json
+++ b/packages/icons/config/fabric-icons-3.json
@@ -1,412 +1,412 @@
 {
-	"fontName": "fabric-icons-3",
-	"fontFamilyName": "FabricMDL2Icons-3",
-	"excludeGlyphs": false,
-	"chunkSubsets": true,
-	"hashFontFileName": true,
-	"subsetChunkSettings": {
-		"maxSubsetSize": 100
-	},
-	"glyphs": [
-		{
-			"name": "ErrorBadge",
-			"unicode": "EA39"
-		},
-		{
-			"name": "CircleFill",
-			"unicode": "EA3B"
-		},
-		{
-			"name": "Record2",
-			"unicode": "EA3F"
-		},
-		{
-			"name": "BookmarksMirrored",
-			"unicode": "EA41"
-		},
-		{
-			"name": "BulletedListMirrored",
-			"unicode": "EA42"
-		},
-		{
-			"name": "CaretHollowMirrored",
-			"unicode": "EA45"
-		},
-		{
-			"name": "CaretSolidMirrored",
-			"unicode": "EA46"
-		},
-		{
-			"name": "ChromeBackMirrored",
-			"unicode": "EA47"
-		},
-		{
-			"name": "ClosePaneMirrored",
-			"unicode": "EA49"
-		},
-		{
-			"name": "DockLeftMirrored",
-			"unicode": "EA4C"
-		},
-		{
-			"name": "DoubleChevronLeftMedMirrored",
-			"unicode": "EA4D"
-		},
-		{
-			"name": "HelpMirrored",
-			"unicode": "EA51"
-		},
-		{
-			"name": "ImportMirrored",
-			"unicode": "EA52"
-		},
-		{
-			"name": "ListMirrored",
-			"unicode": "EA55"
-		},
-		{
-			"name": "MailForwardMirrored",
-			"unicode": "EA56"
-		},
-		{
-			"name": "MailReplyMirrored",
-			"unicode": "EA57"
-		},
-		{
-			"name": "MailReplyAllMirrored",
-			"unicode": "EA58"
-		},
-		{
-			"name": "OpenPaneMirrored",
-			"unicode": "EA5B"
-		},
-		{
-			"name": "ParkingLocationMirrored",
-			"unicode": "EA5E"
-		},
-		{
-			"name": "SendMirrored",
-			"unicode": "EA63"
-		},
-		{
-			"name": "ShowResultsMirrored",
-			"unicode": "EA65"
-		},
-		{
-			"name": "ThumbnailViewMirrored",
-			"unicode": "EA67"
-		},
-		{
-			"name": "Devices3",
-			"unicode": "EA6C"
-		},
-		{
-			"name": "Lightbulb",
-			"unicode": "EA80"
-		},
-		{
-			"name": "StatusTriangle",
-			"unicode": "EA82"
-		},
-		{
-			"name": "VolumeDisabled",
-			"unicode": "EA85"
-		},
-		{
-			"name": "Puzzle",
-			"unicode": "EA86"
-		},
-		{
-			"name": "EmojiNeutral",
-			"unicode": "EA87"
-		},
-		{
-			"name": "EmojiDisappointed",
-			"unicode": "EA88"
-		},
-		{
-			"name": "HomeSolid",
-			"unicode": "EA8A"
-		},
-		{
-			"name": "Cocktails",
-			"unicode": "EA9D"
-		},
-		{
-			"name": "Wines",
-			"unicode": "EABF"
-		},
-		{
-			"name": "Articles",
-			"unicode": "EAC1"
-		},
-		{
-			"name": "Cycling",
-			"unicode": "EAC7"
-		},
-		{
-			"name": "DietPlanNotebook",
-			"unicode": "EAC8"
-		},
-		{
-			"name": "Pill",
-			"unicode": "EACB"
-		},
-		{
-			"name": "ExerciseTracker",
-			"unicode": "EACC"
-		},
-		{
-			"name": "Medical",
-			"unicode": "EAD4"
-		},
-		{
-			"name": "Running",
-			"unicode": "EADA"
-		},
-		{
-			"name": "Weights",
-			"unicode": "EADB"
-		},
-		{
-			"name": "BarChart4",
-			"unicode": "EAE7"
-		},
-		{
-			"name": "CirclePlus",
-			"unicode": "EAEE"
-		},
-		{
-			"name": "Coffee",
-			"unicode": "EAEF"
-		},
-		{
-			"name": "Cotton",
-			"unicode": "EAF3"
-		},
-		{
-			"name": "Market",
-			"unicode": "EAFC"
-		},
-		{
-			"name": "Money",
-			"unicode": "EAFD"
-		},
-		{
-			"name": "PieDouble",
-			"unicode": "EB04"
-		},
-		{
-			"name": "PieSingle",
-			"unicode": "EB05"
-		},
-		{
-			"name": "RemoveFilter",
-			"unicode": "EB08"
-		},
-		{
-			"name": "Savings",
-			"unicode": "EB0B"
-		},
-		{
-			"name": "StockDown",
-			"unicode": "EB0F"
-		},
-		{
-			"name": "StockUp",
-			"unicode": "EB11"
-		},
-		{
-			"name": "MSNVideos",
-			"unicode": "EB1C"
-		},
-		{
-			"name": "Cricket",
-			"unicode": "EB1E"
-		},
-		{
-			"name": "Golf",
-			"unicode": "EB1F"
-		},
-		{
-			"name": "Baseball",
-			"unicode": "EB20"
-		},
-		{
-			"name": "Soccer",
-			"unicode": "EB21"
-		},
-		{
-			"name": "MoreSports",
-			"unicode": "EB22"
-		},
-		{
-			"name": "AutoRacing",
-			"unicode": "EB24"
-		},
-		{
-			"name": "CollegeHoops",
-			"unicode": "EB25"
-		},
-		{
-			"name": "CollegeFootball",
-			"unicode": "EB26"
-		},
-		{
-			"name": "ProFootball",
-			"unicode": "EB27"
-		},
-		{
-			"name": "ProHockey",
-			"unicode": "EB28"
-		},
-		{
-			"name": "Rugby",
-			"unicode": "EB2D"
-		},
-		{
-			"name": "Tennis",
-			"unicode": "EB33"
-		},
-		{
-			"name": "Arrivals",
-			"unicode": "EB34"
-		},
-		{
-			"name": "Design",
-			"unicode": "EB3C"
-		},
-		{
-			"name": "Website",
-			"unicode": "EB41"
-		},
-		{
-			"name": "Drop",
-			"unicode": "EB42"
-		},
-		{
-			"name": "SkiResorts",
-			"unicode": "EB45"
-		},
-		{
-			"name": "Snowflake",
-			"unicode": "EB46"
-		},
-		{
-			"name": "BusSolid",
-			"unicode": "EB47"
-		},
-		{
-			"name": "FerrySolid",
-			"unicode": "EB48"
-		},
-		{
-			"name": "AirplaneSolid",
-			"unicode": "EB4C"
-		},
-		{
-			"name": "TrainSolid",
-			"unicode": "EB4D"
-		},
-		{
-			"name": "Ticket",
-			"unicode": "EB54"
-		},
-		{
-			"name": "Devices4",
-			"unicode": "EB66"
-		},
-		{
-			"name": "AzureLogo",
-			"unicode": "EB6A"
-		},
-		{
-			"name": "BingLogo",
-			"unicode": "EB6B"
-		},
-		{
-			"name": "MSNLogo",
-			"unicode": "EB6C"
-		},
-		{
-			"name": "OutlookLogoInverse",
-			"unicode": "EB6D"
-		},
-		{
-			"name": "OfficeLogo",
-			"unicode": "EB6E"
-		},
-		{
-			"name": "SkypeLogo",
-			"unicode": "EB6F"
-		},
-		{
-			"name": "Door",
-			"unicode": "EB75"
-		},
-		{
-			"name": "EditMirrored",
-			"unicode": "EB7E"
-		},
-		{
-			"name": "GiftCard",
-			"unicode": "EB8E"
-		},
-		{
-			"name": "DoubleBookmark",
-			"unicode": "EB8F"
-		},
-		{
-			"name": "StatusErrorFull",
-			"unicode": "EB90"
-		},
-		{
-			"name": "Certificate",
-			"unicode": "EB95"
-		},
-		{
-			"name": "FastForward",
-			"unicode": "EB9D"
-		},
-		{
-			"name": "Rewind",
-			"unicode": "EB9E"
-		},
-		{
-			"name": "Photo2",
-			"unicode": "EB9F"
-		},
-		{
-			"name": "OpenSource",
-			"unicode": "EBC2"
-		},
-		{
-			"name": "CloudDownload",
-			"unicode": "EBD3"
-		},
-		{
-			"name": "WindDirection",
-			"unicode": "EBE6"
-		},
-		{
-			"name": "Family",
-			"unicode": "EBDA"
-		},
-		{
-			"name": "CSS",
-			"unicode": "EBEF"
-		},
-		{
-			"name": "JS",
-			"unicode": "EBF0"
-		},
-		{
-			"name": "DeliveryTruck",
-			"unicode": "EBF4"
-		},
-		{
-			"name": "ReminderPerson",
-			"unicode": "EBF7"
-		}
-	]
+  "fontName": "fabric-icons-3",
+  "fontFamilyName": "FabricMDL2Icons-3",
+  "excludeGlyphs": false,
+  "chunkSubsets": true,
+  "hashFontFileName": true,
+  "subsetChunkSettings": {
+    "maxSubsetSize": 100
+  },
+  "glyphs": [
+    {
+      "name": "ErrorBadge",
+      "unicode": "EA39"
+    },
+    {
+      "name": "CircleFill",
+      "unicode": "EA3B"
+    },
+    {
+      "name": "Record2",
+      "unicode": "EA3F"
+    },
+    {
+      "name": "BookmarksMirrored",
+      "unicode": "EA41"
+    },
+    {
+      "name": "BulletedListMirrored",
+      "unicode": "EA42"
+    },
+    {
+      "name": "CaretHollowMirrored",
+      "unicode": "EA45"
+    },
+    {
+      "name": "CaretSolidMirrored",
+      "unicode": "EA46"
+    },
+    {
+      "name": "ChromeBackMirrored",
+      "unicode": "EA47"
+    },
+    {
+      "name": "ClosePaneMirrored",
+      "unicode": "EA49"
+    },
+    {
+      "name": "DockLeftMirrored",
+      "unicode": "EA4C"
+    },
+    {
+      "name": "DoubleChevronLeftMedMirrored",
+      "unicode": "EA4D"
+    },
+    {
+      "name": "HelpMirrored",
+      "unicode": "EA51"
+    },
+    {
+      "name": "ImportMirrored",
+      "unicode": "EA52"
+    },
+    {
+      "name": "ListMirrored",
+      "unicode": "EA55"
+    },
+    {
+      "name": "MailForwardMirrored",
+      "unicode": "EA56"
+    },
+    {
+      "name": "MailReplyMirrored",
+      "unicode": "EA57"
+    },
+    {
+      "name": "MailReplyAllMirrored",
+      "unicode": "EA58"
+    },
+    {
+      "name": "OpenPaneMirrored",
+      "unicode": "EA5B"
+    },
+    {
+      "name": "ParkingLocationMirrored",
+      "unicode": "EA5E"
+    },
+    {
+      "name": "SendMirrored",
+      "unicode": "EA63"
+    },
+    {
+      "name": "ShowResultsMirrored",
+      "unicode": "EA65"
+    },
+    {
+      "name": "ThumbnailViewMirrored",
+      "unicode": "EA67"
+    },
+    {
+      "name": "Devices3",
+      "unicode": "EA6C"
+    },
+    {
+      "name": "Lightbulb",
+      "unicode": "EA80"
+    },
+    {
+      "name": "StatusTriangle",
+      "unicode": "EA82"
+    },
+    {
+      "name": "VolumeDisabled",
+      "unicode": "EA85"
+    },
+    {
+      "name": "Puzzle",
+      "unicode": "EA86"
+    },
+    {
+      "name": "EmojiNeutral",
+      "unicode": "EA87"
+    },
+    {
+      "name": "EmojiDisappointed",
+      "unicode": "EA88"
+    },
+    {
+      "name": "HomeSolid",
+      "unicode": "EA8A"
+    },
+    {
+      "name": "Cocktails",
+      "unicode": "EA9D"
+    },
+    {
+      "name": "Wines",
+      "unicode": "EABF"
+    },
+    {
+      "name": "Articles",
+      "unicode": "EAC1"
+    },
+    {
+      "name": "Cycling",
+      "unicode": "EAC7"
+    },
+    {
+      "name": "DietPlanNotebook",
+      "unicode": "EAC8"
+    },
+    {
+      "name": "Pill",
+      "unicode": "EACB"
+    },
+    {
+      "name": "ExerciseTracker",
+      "unicode": "EACC"
+    },
+    {
+      "name": "Medical",
+      "unicode": "EAD4"
+    },
+    {
+      "name": "Running",
+      "unicode": "EADA"
+    },
+    {
+      "name": "Weights",
+      "unicode": "EADB"
+    },
+    {
+      "name": "BarChart4",
+      "unicode": "EAE7"
+    },
+    {
+      "name": "CirclePlus",
+      "unicode": "EAEE"
+    },
+    {
+      "name": "Coffee",
+      "unicode": "EAEF"
+    },
+    {
+      "name": "Cotton",
+      "unicode": "EAF3"
+    },
+    {
+      "name": "Market",
+      "unicode": "EAFC"
+    },
+    {
+      "name": "Money",
+      "unicode": "EAFD"
+    },
+    {
+      "name": "PieDouble",
+      "unicode": "EB04"
+    },
+    {
+      "name": "PieSingle",
+      "unicode": "EB05"
+    },
+    {
+      "name": "RemoveFilter",
+      "unicode": "EB08"
+    },
+    {
+      "name": "Savings",
+      "unicode": "EB0B"
+    },
+    {
+      "name": "StockDown",
+      "unicode": "EB0F"
+    },
+    {
+      "name": "StockUp",
+      "unicode": "EB11"
+    },
+    {
+      "name": "MSNVideos",
+      "unicode": "EB1C"
+    },
+    {
+      "name": "Cricket",
+      "unicode": "EB1E"
+    },
+    {
+      "name": "Golf",
+      "unicode": "EB1F"
+    },
+    {
+      "name": "Baseball",
+      "unicode": "EB20"
+    },
+    {
+      "name": "Soccer",
+      "unicode": "EB21"
+    },
+    {
+      "name": "MoreSports",
+      "unicode": "EB22"
+    },
+    {
+      "name": "AutoRacing",
+      "unicode": "EB24"
+    },
+    {
+      "name": "CollegeHoops",
+      "unicode": "EB25"
+    },
+    {
+      "name": "CollegeFootball",
+      "unicode": "EB26"
+    },
+    {
+      "name": "ProFootball",
+      "unicode": "EB27"
+    },
+    {
+      "name": "ProHockey",
+      "unicode": "EB28"
+    },
+    {
+      "name": "Rugby",
+      "unicode": "EB2D"
+    },
+    {
+      "name": "Tennis",
+      "unicode": "EB33"
+    },
+    {
+      "name": "Arrivals",
+      "unicode": "EB34"
+    },
+    {
+      "name": "Design",
+      "unicode": "EB3C"
+    },
+    {
+      "name": "Website",
+      "unicode": "EB41"
+    },
+    {
+      "name": "Drop",
+      "unicode": "EB42"
+    },
+    {
+      "name": "SkiResorts",
+      "unicode": "EB45"
+    },
+    {
+      "name": "Snowflake",
+      "unicode": "EB46"
+    },
+    {
+      "name": "BusSolid",
+      "unicode": "EB47"
+    },
+    {
+      "name": "FerrySolid",
+      "unicode": "EB48"
+    },
+    {
+      "name": "AirplaneSolid",
+      "unicode": "EB4C"
+    },
+    {
+      "name": "TrainSolid",
+      "unicode": "EB4D"
+    },
+    {
+      "name": "Ticket",
+      "unicode": "EB54"
+    },
+    {
+      "name": "Devices4",
+      "unicode": "EB66"
+    },
+    {
+      "name": "AzureLogo",
+      "unicode": "EB6A"
+    },
+    {
+      "name": "BingLogo",
+      "unicode": "EB6B"
+    },
+    {
+      "name": "MSNLogo",
+      "unicode": "EB6C"
+    },
+    {
+      "name": "OutlookLogoInverse",
+      "unicode": "EB6D"
+    },
+    {
+      "name": "OfficeLogo",
+      "unicode": "EB6E"
+    },
+    {
+      "name": "SkypeLogo",
+      "unicode": "EB6F"
+    },
+    {
+      "name": "Door",
+      "unicode": "EB75"
+    },
+    {
+      "name": "EditMirrored",
+      "unicode": "EB7E"
+    },
+    {
+      "name": "GiftCard",
+      "unicode": "EB8E"
+    },
+    {
+      "name": "DoubleBookmark",
+      "unicode": "EB8F"
+    },
+    {
+      "name": "StatusErrorFull",
+      "unicode": "EB90"
+    },
+    {
+      "name": "Certificate",
+      "unicode": "EB95"
+    },
+    {
+      "name": "FastForward",
+      "unicode": "EB9D"
+    },
+    {
+      "name": "Rewind",
+      "unicode": "EB9E"
+    },
+    {
+      "name": "Photo2",
+      "unicode": "EB9F"
+    },
+    {
+      "name": "OpenSource",
+      "unicode": "EBC2"
+    },
+    {
+      "name": "CloudDownload",
+      "unicode": "EBD3"
+    },
+    {
+      "name": "WindDirection",
+      "unicode": "EBE6"
+    },
+    {
+      "name": "Family",
+      "unicode": "EBDA"
+    },
+    {
+      "name": "CSS",
+      "unicode": "EBEF"
+    },
+    {
+      "name": "JS",
+      "unicode": "EBF0"
+    },
+    {
+      "name": "DeliveryTruck",
+      "unicode": "EBF4"
+    },
+    {
+      "name": "ReminderPerson",
+      "unicode": "EBF7"
+    }
+  ]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-4.json b/packages/icons/config/fabric-icons-4.json
index 8f4d52e86d2e7..fa558c24e62ce 100644
--- a/packages/icons/config/fabric-icons-4.json
+++ b/packages/icons/config/fabric-icons-4.json
@@ -1,396 +1,396 @@
 {
-	"fontName": "fabric-icons-4",
-	"fontFamilyName": "FabricMDL2Icons-4",
-	"excludeGlyphs": false,
-	"chunkSubsets": false,
-	"hashFontFileName": true,
-	"subsetChunkSettings": {
-		"maxSubsetSize": 100
-	},
-	"glyphs": [
-		{
-			"name": "ReminderGroup",
-			"unicode": "EBF8"
-		},
-		{
-			"name": "Umbrella",
-			"unicode": "EC04"
-		},
-		{
-			"name": "NetworkTower",
-			"unicode": "EC05"
-		},
-		{
-			"name": "CityNext",
-			"unicode": "EC06"
-		},
-		{
-			"name": "Section",
-			"unicode": "EC0C"
-		},
-		{
-			"name": "OneNoteLogoInverse",
-			"unicode": "EC0D"
-		},
-		{
-			"name": "ToggleFilled",
-			"unicode": "EC11"
-		},
-		{
-			"name": "ToggleBorder",
-			"unicode": "EC12"
-		},
-		{
-			"name": "SliderThumb",
-			"unicode": "EC13"
-		},
-		{
-			"name": "ToggleThumb",
-			"unicode": "EC14"
-		},
-		{
-			"name": "Documentation",
-			"unicode": "EC17"
-		},
-		{
-			"name": "Badge",
-			"unicode": "EC1B"
-		},
-		{
-			"name": "Giftbox",
-			"unicode": "EC1F"
-		},
-		{
-			"name": "VisualStudioLogo",
-			"unicode": "EC22"
-		},
-		{
-			"name": "ExcelLogoInverse",
-			"unicode": "EC28"
-		},
-		{
-			"name": "WordLogoInverse",
-			"unicode": "EC29"
-		},
-		{
-			"name": "PowerPointLogoInverse",
-			"unicode": "EC2A"
-		},
-		{
-			"name": "Cafe",
-			"unicode": "EC32"
-		},
-		{
-			"name": "SpeedHigh",
-			"unicode": "EC4A"
-		},
-		{
-			"name": "ThisPC",
-			"unicode": "EC4E"
-		},
-		{
-			"name": "MusicNote",
-			"unicode": "EC4F"
-		},
-		{
-			"name": "MicOff",
-			"unicode": "EC54"
-		},
-		{
-			"name": "EdgeLogo",
-			"unicode": "EC60"
-		},
-		{
-			"name": "CompletedSolid",
-			"unicode": "EC61"
-		},
-		{
-			"name": "AlbumRemove",
-			"unicode": "EC62"
-		},
-		{
-			"name": "MessageFill",
-			"unicode": "EC70"
-		},
-		{
-			"name": "TabletSelected",
-			"unicode": "EC74"
-		},
-		{
-			"name": "MobileSelected",
-			"unicode": "EC75"
-		},
-		{
-			"name": "LaptopSelected",
-			"unicode": "EC76"
-		},
-		{
-			"name": "TVMonitorSelected",
-			"unicode": "EC77"
-		},
-		{
-			"name": "DeveloperTools",
-			"unicode": "EC7A"
-		},
-		{
-			"name": "InsertTextBox",
-			"unicode": "EC7D"
-		},
-		{
-			"name": "LowerBrightness",
-			"unicode": "EC8A"
-		},
-		{
-			"name": "CloudUpload",
-			"unicode": "EC8E"
-		},
-		{
-			"name": "ScrollUpDown",
-			"unicode": "EC8F"
-		},
-		{
-			"name": "DateTime",
-			"unicode": "EC92"
-		},
-		{
-			"name": "Event",
-			"unicode": "ECA3"
-		},
-		{
-			"name": "Cake",
-			"unicode": "ECA4"
-		},
-		{
-			"name": "Org",
-			"unicode": "ECA6"
-		},
-		{
-			"name": "PartyLeader",
-			"unicode": "ECA7"
-		},
-		{
-			"name": "DRM",
-			"unicode": "ECA8"
-		},
-		{
-			"name": "CloudAdd",
-			"unicode": "ECA9"
-		},
-		{
-			"name": "AppIconDefault",
-			"unicode": "ECAA"
-		},
-		{
-			"name": "Photo2Add",
-			"unicode": "ECAB"
-		},
-		{
-			"name": "Photo2Remove",
-			"unicode": "ECAC"
-		},
-		{
-			"name": "POI",
-			"unicode": "ECAF"
-		},
-		{
-			"name": "AddTo",
-			"unicode": "ECC8"
-		},
-		{
-			"name": "RadioBtnOff",
-			"unicode": "ECCA"
-		},
-		{
-			"name": "RadioBtnOn",
-			"unicode": "ECCB"
-		},
-		{
-			"name": "ExploreContent",
-			"unicode": "ECCD"
-		},
-		{
-			"name": "VideoSolid",
-			"unicode": "EA0C"
-		},
-		{
-			"name": "Teamwork",
-			"unicode": "EA12"
-		},
-		{
-			"name": "PeopleAdd",
-			"unicode": "EA15"
-		},
-		{
-			"name": "Glasses",
-			"unicode": "EA16"
-		},
-		{
-			"name": "DateTime2",
-			"unicode": "EA17"
-		},
-		{
-			"name": "Shield",
-			"unicode": "EA18"
-		},
-		{
-			"name": "Header1",
-			"unicode": "EA19"
-		},
-		{
-			"name": "PageAdd",
-			"unicode": "EA1A"
-		},
-		{
-			"name": "NumberedList",
-			"unicode": "EA1C"
-		},
-		{
-			"name": "PowerBILogo",
-			"unicode": "EA1E"
-		},
-		{
-			"name": "Product",
-			"unicode": "ECDC"
-		},
-		{
-			"name": "ProgressLoopInner",
-			"unicode": "ECDE"
-		},
-		{
-			"name": "ProgressLoopOuter",
-			"unicode": "ECDF"
-		},
-		{
-			"name": "Blocked2",
-			"unicode": "ECE4"
-		},
-		{
-			"name": "FangBody",
-			"unicode": "ECEB"
-		},
-		{
-			"name": "Glimmer",
-			"unicode": "ECF4"
-		},
-		{
-			"name": "ChatInviteFriend",
-			"unicode": "ECFE"
-		},
-		{
-			"name": "Crown",
-			"unicode": "ED01"
-		},
-		{
-			"name": "Feedback",
-			"unicode": "ED15"
-		},
-		{
-			"name": "SharepointLogoInverse",
-			"unicode": "ED18"
-		},
-		{
-			"name": "YammerLogo",
-			"unicode": "ED19"
-		},
-		{
-			"name": "Hide",
-			"unicode": "ED1A"
-		},
-		{
-			"name": "Uneditable",
-			"unicode": "ED1D"
-		},
-		{
-			"name": "ReturnToSession",
-			"unicode": "ED24"
-		},
-		{
-			"name": "OpenFolderHorizontal",
-			"unicode": "ED25"
-		},
-		{
-			"name": "CalendarMirrored",
-			"unicode": "ED28"
-		},
-		{
-			"name": "SwayLogoInverse",
-			"unicode": "ED29"
-		},
-		{
-			"name": "OutOfOffice",
-			"unicode": "ED34"
-		},
-		{
-			"name": "Trophy",
-			"unicode": "ED3F"
-		},
-		{
-			"name": "ReopenPages",
-			"unicode": "ED50"
-		},
-		{
-			"name": "AADLogo",
-			"unicode": "ED68"
-		},
-		{
-			"name": "AccessLogo",
-			"unicode": "ED69"
-		},
-		{
-			"name": "AdminALogoInverse32",
-			"unicode": "ED6A"
-		},
-		{
-			"name": "AdminCLogoInverse32",
-			"unicode": "ED6B"
-		},
-		{
-			"name": "AdminDLogoInverse32",
-			"unicode": "ED6C"
-		},
-		{
-			"name": "AdminELogoInverse32",
-			"unicode": "ED6D"
-		},
-		{
-			"name": "AdminLLogoInverse32",
-			"unicode": "ED6E"
-		},
-		{
-			"name": "AdminMLogoInverse32",
-			"unicode": "ED6F"
-		},
-		{
-			"name": "AdminOLogoInverse32",
-			"unicode": "ED70"
-		},
-		{
-			"name": "AdminPLogoInverse32",
-			"unicode": "ED71"
-		},
-		{
-			"name": "AdminSLogoInverse32",
-			"unicode": "ED72"
-		},
-		{
-			"name": "AdminYLogoInverse32",
-			"unicode": "ED73"
-		},
-		{
-			"name": "DelveLogoInverse",
-			"unicode": "ED76"
-		},
-		{
-			"name": "ExchangeLogoInverse",
-			"unicode": "ED78"
-		},
-		{
-			"name": "LyncLogo",
-			"unicode": "ED79"
-		},
-		{
-			"name": "OfficeVideoLogoInverse",
-			"unicode": "ED7A"
-		}
-	]
+  "fontName": "fabric-icons-4",
+  "fontFamilyName": "FabricMDL2Icons-4",
+  "excludeGlyphs": false,
+  "chunkSubsets": false,
+  "hashFontFileName": true,
+  "subsetChunkSettings": {
+    "maxSubsetSize": 100
+  },
+  "glyphs": [
+    {
+      "name": "ReminderGroup",
+      "unicode": "EBF8"
+    },
+    {
+      "name": "Umbrella",
+      "unicode": "EC04"
+    },
+    {
+      "name": "NetworkTower",
+      "unicode": "EC05"
+    },
+    {
+      "name": "CityNext",
+      "unicode": "EC06"
+    },
+    {
+      "name": "Section",
+      "unicode": "EC0C"
+    },
+    {
+      "name": "OneNoteLogoInverse",
+      "unicode": "EC0D"
+    },
+    {
+      "name": "ToggleFilled",
+      "unicode": "EC11"
+    },
+    {
+      "name": "ToggleBorder",
+      "unicode": "EC12"
+    },
+    {
+      "name": "SliderThumb",
+      "unicode": "EC13"
+    },
+    {
+      "name": "ToggleThumb",
+      "unicode": "EC14"
+    },
+    {
+      "name": "Documentation",
+      "unicode": "EC17"
+    },
+    {
+      "name": "Badge",
+      "unicode": "EC1B"
+    },
+    {
+      "name": "Giftbox",
+      "unicode": "EC1F"
+    },
+    {
+      "name": "VisualStudioLogo",
+      "unicode": "EC22"
+    },
+    {
+      "name": "ExcelLogoInverse",
+      "unicode": "EC28"
+    },
+    {
+      "name": "WordLogoInverse",
+      "unicode": "EC29"
+    },
+    {
+      "name": "PowerPointLogoInverse",
+      "unicode": "EC2A"
+    },
+    {
+      "name": "Cafe",
+      "unicode": "EC32"
+    },
+    {
+      "name": "SpeedHigh",
+      "unicode": "EC4A"
+    },
+    {
+      "name": "ThisPC",
+      "unicode": "EC4E"
+    },
+    {
+      "name": "MusicNote",
+      "unicode": "EC4F"
+    },
+    {
+      "name": "MicOff",
+      "unicode": "EC54"
+    },
+    {
+      "name": "EdgeLogo",
+      "unicode": "EC60"
+    },
+    {
+      "name": "CompletedSolid",
+      "unicode": "EC61"
+    },
+    {
+      "name": "AlbumRemove",
+      "unicode": "EC62"
+    },
+    {
+      "name": "MessageFill",
+      "unicode": "EC70"
+    },
+    {
+      "name": "TabletSelected",
+      "unicode": "EC74"
+    },
+    {
+      "name": "MobileSelected",
+      "unicode": "EC75"
+    },
+    {
+      "name": "LaptopSelected",
+      "unicode": "EC76"
+    },
+    {
+      "name": "TVMonitorSelected",
+      "unicode": "EC77"
+    },
+    {
+      "name": "DeveloperTools",
+      "unicode": "EC7A"
+    },
+    {
+      "name": "InsertTextBox",
+      "unicode": "EC7D"
+    },
+    {
+      "name": "LowerBrightness",
+      "unicode": "EC8A"
+    },
+    {
+      "name": "CloudUpload",
+      "unicode": "EC8E"
+    },
+    {
+      "name": "ScrollUpDown",
+      "unicode": "EC8F"
+    },
+    {
+      "name": "DateTime",
+      "unicode": "EC92"
+    },
+    {
+      "name": "Event",
+      "unicode": "ECA3"
+    },
+    {
+      "name": "Cake",
+      "unicode": "ECA4"
+    },
+    {
+      "name": "Org",
+      "unicode": "ECA6"
+    },
+    {
+      "name": "PartyLeader",
+      "unicode": "ECA7"
+    },
+    {
+      "name": "DRM",
+      "unicode": "ECA8"
+    },
+    {
+      "name": "CloudAdd",
+      "unicode": "ECA9"
+    },
+    {
+      "name": "AppIconDefault",
+      "unicode": "ECAA"
+    },
+    {
+      "name": "Photo2Add",
+      "unicode": "ECAB"
+    },
+    {
+      "name": "Photo2Remove",
+      "unicode": "ECAC"
+    },
+    {
+      "name": "POI",
+      "unicode": "ECAF"
+    },
+    {
+      "name": "AddTo",
+      "unicode": "ECC8"
+    },
+    {
+      "name": "RadioBtnOff",
+      "unicode": "ECCA"
+    },
+    {
+      "name": "RadioBtnOn",
+      "unicode": "ECCB"
+    },
+    {
+      "name": "ExploreContent",
+      "unicode": "ECCD"
+    },
+    {
+      "name": "VideoSolid",
+      "unicode": "EA0C"
+    },
+    {
+      "name": "Teamwork",
+      "unicode": "EA12"
+    },
+    {
+      "name": "PeopleAdd",
+      "unicode": "EA15"
+    },
+    {
+      "name": "Glasses",
+      "unicode": "EA16"
+    },
+    {
+      "name": "DateTime2",
+      "unicode": "EA17"
+    },
+    {
+      "name": "Shield",
+      "unicode": "EA18"
+    },
+    {
+      "name": "Header1",
+      "unicode": "EA19"
+    },
+    {
+      "name": "PageAdd",
+      "unicode": "EA1A"
+    },
+    {
+      "name": "NumberedList",
+      "unicode": "EA1C"
+    },
+    {
+      "name": "PowerBILogo",
+      "unicode": "EA1E"
+    },
+    {
+      "name": "Product",
+      "unicode": "ECDC"
+    },
+    {
+      "name": "ProgressLoopInner",
+      "unicode": "ECDE"
+    },
+    {
+      "name": "ProgressLoopOuter",
+      "unicode": "ECDF"
+    },
+    {
+      "name": "Blocked2",
+      "unicode": "ECE4"
+    },
+    {
+      "name": "FangBody",
+      "unicode": "ECEB"
+    },
+    {
+      "name": "Glimmer",
+      "unicode": "ECF4"
+    },
+    {
+      "name": "ChatInviteFriend",
+      "unicode": "ECFE"
+    },
+    {
+      "name": "Crown",
+      "unicode": "ED01"
+    },
+    {
+      "name": "Feedback",
+      "unicode": "ED15"
+    },
+    {
+      "name": "SharepointLogoInverse",
+      "unicode": "ED18"
+    },
+    {
+      "name": "YammerLogo",
+      "unicode": "ED19"
+    },
+    {
+      "name": "Hide",
+      "unicode": "ED1A"
+    },
+    {
+      "name": "Uneditable",
+      "unicode": "ED1D"
+    },
+    {
+      "name": "ReturnToSession",
+      "unicode": "ED24"
+    },
+    {
+      "name": "OpenFolderHorizontal",
+      "unicode": "ED25"
+    },
+    {
+      "name": "CalendarMirrored",
+      "unicode": "ED28"
+    },
+    {
+      "name": "SwayLogoInverse",
+      "unicode": "ED29"
+    },
+    {
+      "name": "OutOfOffice",
+      "unicode": "ED34"
+    },
+    {
+      "name": "Trophy",
+      "unicode": "ED3F"
+    },
+    {
+      "name": "ReopenPages",
+      "unicode": "ED50"
+    },
+    {
+      "name": "AADLogo",
+      "unicode": "ED68"
+    },
+    {
+      "name": "AccessLogo",
+      "unicode": "ED69"
+    },
+    {
+      "name": "AdminALogoInverse32",
+      "unicode": "ED6A"
+    },
+    {
+      "name": "AdminCLogoInverse32",
+      "unicode": "ED6B"
+    },
+    {
+      "name": "AdminDLogoInverse32",
+      "unicode": "ED6C"
+    },
+    {
+      "name": "AdminELogoInverse32",
+      "unicode": "ED6D"
+    },
+    {
+      "name": "AdminLLogoInverse32",
+      "unicode": "ED6E"
+    },
+    {
+      "name": "AdminMLogoInverse32",
+      "unicode": "ED6F"
+    },
+    {
+      "name": "AdminOLogoInverse32",
+      "unicode": "ED70"
+    },
+    {
+      "name": "AdminPLogoInverse32",
+      "unicode": "ED71"
+    },
+    {
+      "name": "AdminSLogoInverse32",
+      "unicode": "ED72"
+    },
+    {
+      "name": "AdminYLogoInverse32",
+      "unicode": "ED73"
+    },
+    {
+      "name": "DelveLogoInverse",
+      "unicode": "ED76"
+    },
+    {
+      "name": "ExchangeLogoInverse",
+      "unicode": "ED78"
+    },
+    {
+      "name": "LyncLogo",
+      "unicode": "ED79"
+    },
+    {
+      "name": "OfficeVideoLogoInverse",
+      "unicode": "ED7A"
+    }
+  ]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-5.json b/packages/icons/config/fabric-icons-5.json
index 57ae89ef62557..6cd86e2b81acb 100644
--- a/packages/icons/config/fabric-icons-5.json
+++ b/packages/icons/config/fabric-icons-5.json
@@ -1,408 +1,408 @@
 {
-	"fontName": "fabric-icons-5",
-	"fontFamilyName": "FabricMDL2Icons-5",
-	"excludeGlyphs": false,
-	"chunkSubsets": false,
-	"hashFontFileName": true,
-	"subsetChunkSettings": {
-		"maxSubsetSize": 100
-	},
-	"glyphs": [
-		{
-			"name": "SocialListeningLogo",
-			"unicode": "ED7C"
-		},
-		{
-			"name": "VisioLogoInverse",
-			"unicode": "ED7D"
-		},
-		{
-			"name": "Balloons",
-			"unicode": "ED7E"
-		},
-		{
-			"name": "Cat",
-			"unicode": "ED7F"
-		},
-		{
-			"name": "MailAlert",
-			"unicode": "ED80"
-		},
-		{
-			"name": "MailCheck",
-			"unicode": "ED81"
-		},
-		{
-			"name": "MailLowImportance",
-			"unicode": "ED82"
-		},
-		{
-			"name": "MailPause",
-			"unicode": "ED83"
-		},
-		{
-			"name": "MailRepeat",
-			"unicode": "ED84"
-		},
-		{
-			"name": "SecurityGroup",
-			"unicode": "ED85"
-		},
-		{
-			"name": "Table",
-			"unicode": "ED86"
-		},
-		{
-			"name": "VoicemailForward",
-			"unicode": "ED87"
-		},
-		{
-			"name": "VoicemailReply",
-			"unicode": "ED88"
-		},
-		{
-			"name": "Waffle",
-			"unicode": "ED89"
-		},
-		{
-			"name": "RemoveEvent",
-			"unicode": "ED8A"
-		},
-		{
-			"name": "EventInfo",
-			"unicode": "ED8B"
-		},
-		{
-			"name": "ForwardEvent",
-			"unicode": "ED8C"
-		},
-		{
-			"name": "WipePhone",
-			"unicode": "ED8D"
-		},
-		{
-			"name": "AddOnlineMeeting",
-			"unicode": "ED8E"
-		},
-		{
-			"name": "JoinOnlineMeeting",
-			"unicode": "ED8F"
-		},
-		{
-			"name": "RemoveLink",
-			"unicode": "ED90"
-		},
-		{
-			"name": "PeopleBlock",
-			"unicode": "ED91"
-		},
-		{
-			"name": "PeopleRepeat",
-			"unicode": "ED92"
-		},
-		{
-			"name": "PeopleAlert",
-			"unicode": "ED93"
-		},
-		{
-			"name": "PeoplePause",
-			"unicode": "ED94"
-		},
-		{
-			"name": "TransferCall",
-			"unicode": "ED95"
-		},
-		{
-			"name": "AddPhone",
-			"unicode": "ED96"
-		},
-		{
-			"name": "UnknownCall",
-			"unicode": "ED97"
-		},
-		{
-			"name": "NoteReply",
-			"unicode": "ED98"
-		},
-		{
-			"name": "NoteForward",
-			"unicode": "ED99"
-		},
-		{
-			"name": "NotePinned",
-			"unicode": "ED9A"
-		},
-		{
-			"name": "RemoveOccurrence",
-			"unicode": "ED9B"
-		},
-		{
-			"name": "Timeline",
-			"unicode": "ED9C"
-		},
-		{
-			"name": "EditNote",
-			"unicode": "ED9D"
-		},
-		{
-			"name": "CircleHalfFull",
-			"unicode": "ED9E"
-		},
-		{
-			"name": "Room",
-			"unicode": "ED9F"
-		},
-		{
-			"name": "Unsubscribe",
-			"unicode": "EDA0"
-		},
-		{
-			"name": "Subscribe",
-			"unicode": "EDA1"
-		},
-		{
-			"name": "RecurringTask",
-			"unicode": "EDB2"
-		},
-		{
-			"name": "TaskManager",
-			"unicode": "EDB7"
-		},
-		{
-			"name": "TaskManagerMirrored",
-			"unicode": "EDB8"
-		},
-		{
-			"name": "Combine",
-			"unicode": "EDBB"
-		},
-		{
-			"name": "Split",
-			"unicode": "EDBC"
-		},
-		{
-			"name": "DoubleChevronUp",
-			"unicode": "EDBD"
-		},
-		{
-			"name": "DoubleChevronLeft",
-			"unicode": "EDBE"
-		},
-		{
-			"name": "DoubleChevronRight",
-			"unicode": "EDBF"
-		},
-		{
-			"name": "TextBox",
-			"unicode": "EDC2"
-		},
-		{
-			"name": "TextField",
-			"unicode": "EDC3"
-		},
-		{
-			"name": "NumberField",
-			"unicode": "EDC4"
-		},
-		{
-			"name": "Dropdown",
-			"unicode": "EDC5"
-		},
-		{
-			"name": "BookingsLogo",
-			"unicode": "EDC7"
-		},
-		{
-			"name": "ClassNotebookLogoInverse",
-			"unicode": "EDC8"
-		},
-		{
-			"name": "DelveAnalyticsLogo",
-			"unicode": "EDCA"
-		},
-		{
-			"name": "DocsLogoInverse",
-			"unicode": "EDCB"
-		},
-		{
-			"name": "Dynamics365Logo",
-			"unicode": "EDCC"
-		},
-		{
-			"name": "DynamicSMBLogo",
-			"unicode": "EDCD"
-		},
-		{
-			"name": "OfficeAssistantLogo",
-			"unicode": "EDCE"
-		},
-		{
-			"name": "OfficeStoreLogo",
-			"unicode": "EDCF"
-		},
-		{
-			"name": "OneNoteEduLogoInverse",
-			"unicode": "EDD0"
-		},
-		{
-			"name": "PlannerLogo",
-			"unicode": "EDD1"
-		},
-		{
-			"name": "PowerApps",
-			"unicode": "EDD2"
-		},
-		{
-			"name": "Suitcase",
-			"unicode": "EDD3"
-		},
-		{
-			"name": "ProjectLogoInverse",
-			"unicode": "EDD4"
-		},
-		{
-			"name": "CaretLeft8",
-			"unicode": "EDD5"
-		},
-		{
-			"name": "CaretRight8",
-			"unicode": "EDD6"
-		},
-		{
-			"name": "CaretUp8",
-			"unicode": "EDD7"
-		},
-		{
-			"name": "CaretDown8",
-			"unicode": "EDD8"
-		},
-		{
-			"name": "CaretLeftSolid8",
-			"unicode": "EDD9"
-		},
-		{
-			"name": "CaretRightSolid8",
-			"unicode": "EDDA"
-		},
-		{
-			"name": "CaretUpSolid8",
-			"unicode": "EDDB"
-		},
-		{
-			"name": "CaretDownSolid8",
-			"unicode": "EDDC"
-		},
-		{
-			"name": "ClearFormatting",
-			"unicode": "EDDD"
-		},
-		{
-			"name": "Superscript",
-			"unicode": "EDDE"
-		},
-		{
-			"name": "Subscript",
-			"unicode": "EDDF"
-		},
-		{
-			"name": "Strikethrough",
-			"unicode": "EDE0"
-		},
-		{
-			"name": "Export",
-			"unicode": "EDE1"
-		},
-		{
-			"name": "ExportMirrored",
-			"unicode": "EDE2"
-		},
-		{
-			"name": "SingleBookmark",
-			"unicode": "EDFF"
-		},
-		{
-			"name": "DoubleChevronDown",
-			"unicode": "EE04"
-		},
-		{
-			"name": "ReplyAll",
-			"unicode": "EE0A"
-		},
-		{
-			"name": "Questionnaire",
-			"unicode": "EE19"
-		},
-		{
-			"name": "ReplyMirrored",
-			"unicode": "EE35"
-		},
-		{
-			"name": "ReplyAllMirrored",
-			"unicode": "EE36"
-		},
-		{
-			"name": "AddGroup",
-			"unicode": "EE3D"
-		},
-		{
-			"name": "QuestionnaireMirrored",
-			"unicode": "EE4B"
-		},
-		{
-			"name": "TemporaryUser",
-			"unicode": "EE58"
-		},
-		{
-			"name": "CaretSolid16",
-			"unicode": "EE62"
-		},
-		{
-			"name": "GroupedDescending",
-			"unicode": "EE66"
-		},
-		{
-			"name": "GroupedAscending",
-			"unicode": "EE67"
-		},
-		{
-			"name": "AwayStatus",
-			"unicode": "EE6A"
-		},
-		{
-			"name": "MyMoviesTV",
-			"unicode": "EE6C"
-		},
-		{
-			"name": "AustralianRules",
-			"unicode": "EE70"
-		},
-		{
-			"name": "WifiEthernet",
-			"unicode": "EE77"
-		},
-		{
-			"name": "DateTimeMirrored",
-			"unicode": "EE93"
-		},
-		{
-			"name": "StopSolid",
-			"unicode": "EE95"
-		},
-		{
-			"name": "DoubleChevronUp12",
-			"unicode": "EE96"
-		},
-		{
-			"name": "DoubleChevronDown12",
-			"unicode": "EE97"
-		},
-		{
-			"name": "DoubleChevronLeft12",
-			"unicode": "EE98"
-		},
-		{
-			"name": "DoubleChevronRight12",
-			"unicode": "EE99"
-		}
-	]
+  "fontName": "fabric-icons-5",
+  "fontFamilyName": "FabricMDL2Icons-5",
+  "excludeGlyphs": false,
+  "chunkSubsets": false,
+  "hashFontFileName": true,
+  "subsetChunkSettings": {
+    "maxSubsetSize": 100
+  },
+  "glyphs": [
+    {
+      "name": "SocialListeningLogo",
+      "unicode": "ED7C"
+    },
+    {
+      "name": "VisioLogoInverse",
+      "unicode": "ED7D"
+    },
+    {
+      "name": "Balloons",
+      "unicode": "ED7E"
+    },
+    {
+      "name": "Cat",
+      "unicode": "ED7F"
+    },
+    {
+      "name": "MailAlert",
+      "unicode": "ED80"
+    },
+    {
+      "name": "MailCheck",
+      "unicode": "ED81"
+    },
+    {
+      "name": "MailLowImportance",
+      "unicode": "ED82"
+    },
+    {
+      "name": "MailPause",
+      "unicode": "ED83"
+    },
+    {
+      "name": "MailRepeat",
+      "unicode": "ED84"
+    },
+    {
+      "name": "SecurityGroup",
+      "unicode": "ED85"
+    },
+    {
+      "name": "Table",
+      "unicode": "ED86"
+    },
+    {
+      "name": "VoicemailForward",
+      "unicode": "ED87"
+    },
+    {
+      "name": "VoicemailReply",
+      "unicode": "ED88"
+    },
+    {
+      "name": "Waffle",
+      "unicode": "ED89"
+    },
+    {
+      "name": "RemoveEvent",
+      "unicode": "ED8A"
+    },
+    {
+      "name": "EventInfo",
+      "unicode": "ED8B"
+    },
+    {
+      "name": "ForwardEvent",
+      "unicode": "ED8C"
+    },
+    {
+      "name": "WipePhone",
+      "unicode": "ED8D"
+    },
+    {
+      "name": "AddOnlineMeeting",
+      "unicode": "ED8E"
+    },
+    {
+      "name": "JoinOnlineMeeting",
+      "unicode": "ED8F"
+    },
+    {
+      "name": "RemoveLink",
+      "unicode": "ED90"
+    },
+    {
+      "name": "PeopleBlock",
+      "unicode": "ED91"
+    },
+    {
+      "name": "PeopleRepeat",
+      "unicode": "ED92"
+    },
+    {
+      "name": "PeopleAlert",
+      "unicode": "ED93"
+    },
+    {
+      "name": "PeoplePause",
+      "unicode": "ED94"
+    },
+    {
+      "name": "TransferCall",
+      "unicode": "ED95"
+    },
+    {
+      "name": "AddPhone",
+      "unicode": "ED96"
+    },
+    {
+      "name": "UnknownCall",
+      "unicode": "ED97"
+    },
+    {
+      "name": "NoteReply",
+      "unicode": "ED98"
+    },
+    {
+      "name": "NoteForward",
+      "unicode": "ED99"
+    },
+    {
+      "name": "NotePinned",
+      "unicode": "ED9A"
+    },
+    {
+      "name": "RemoveOccurrence",
+      "unicode": "ED9B"
+    },
+    {
+      "name": "Timeline",
+      "unicode": "ED9C"
+    },
+    {
+      "name": "EditNote",
+      "unicode": "ED9D"
+    },
+    {
+      "name": "CircleHalfFull",
+      "unicode": "ED9E"
+    },
+    {
+      "name": "Room",
+      "unicode": "ED9F"
+    },
+    {
+      "name": "Unsubscribe",
+      "unicode": "EDA0"
+    },
+    {
+      "name": "Subscribe",
+      "unicode": "EDA1"
+    },
+    {
+      "name": "RecurringTask",
+      "unicode": "EDB2"
+    },
+    {
+      "name": "TaskManager",
+      "unicode": "EDB7"
+    },
+    {
+      "name": "TaskManagerMirrored",
+      "unicode": "EDB8"
+    },
+    {
+      "name": "Combine",
+      "unicode": "EDBB"
+    },
+    {
+      "name": "Split",
+      "unicode": "EDBC"
+    },
+    {
+      "name": "DoubleChevronUp",
+      "unicode": "EDBD"
+    },
+    {
+      "name": "DoubleChevronLeft",
+      "unicode": "EDBE"
+    },
+    {
+      "name": "DoubleChevronRight",
+      "unicode": "EDBF"
+    },
+    {
+      "name": "TextBox",
+      "unicode": "EDC2"
+    },
+    {
+      "name": "TextField",
+      "unicode": "EDC3"
+    },
+    {
+      "name": "NumberField",
+      "unicode": "EDC4"
+    },
+    {
+      "name": "Dropdown",
+      "unicode": "EDC5"
+    },
+    {
+      "name": "BookingsLogo",
+      "unicode": "EDC7"
+    },
+    {
+      "name": "ClassNotebookLogoInverse",
+      "unicode": "EDC8"
+    },
+    {
+      "name": "DelveAnalyticsLogo",
+      "unicode": "EDCA"
+    },
+    {
+      "name": "DocsLogoInverse",
+      "unicode": "EDCB"
+    },
+    {
+      "name": "Dynamics365Logo",
+      "unicode": "EDCC"
+    },
+    {
+      "name": "DynamicSMBLogo",
+      "unicode": "EDCD"
+    },
+    {
+      "name": "OfficeAssistantLogo",
+      "unicode": "EDCE"
+    },
+    {
+      "name": "OfficeStoreLogo",
+      "unicode": "EDCF"
+    },
+    {
+      "name": "OneNoteEduLogoInverse",
+      "unicode": "EDD0"
+    },
+    {
+      "name": "PlannerLogo",
+      "unicode": "EDD1"
+    },
+    {
+      "name": "PowerApps",
+      "unicode": "EDD2"
+    },
+    {
+      "name": "Suitcase",
+      "unicode": "EDD3"
+    },
+    {
+      "name": "ProjectLogoInverse",
+      "unicode": "EDD4"
+    },
+    {
+      "name": "CaretLeft8",
+      "unicode": "EDD5"
+    },
+    {
+      "name": "CaretRight8",
+      "unicode": "EDD6"
+    },
+    {
+      "name": "CaretUp8",
+      "unicode": "EDD7"
+    },
+    {
+      "name": "CaretDown8",
+      "unicode": "EDD8"
+    },
+    {
+      "name": "CaretLeftSolid8",
+      "unicode": "EDD9"
+    },
+    {
+      "name": "CaretRightSolid8",
+      "unicode": "EDDA"
+    },
+    {
+      "name": "CaretUpSolid8",
+      "unicode": "EDDB"
+    },
+    {
+      "name": "CaretDownSolid8",
+      "unicode": "EDDC"
+    },
+    {
+      "name": "ClearFormatting",
+      "unicode": "EDDD"
+    },
+    {
+      "name": "Superscript",
+      "unicode": "EDDE"
+    },
+    {
+      "name": "Subscript",
+      "unicode": "EDDF"
+    },
+    {
+      "name": "Strikethrough",
+      "unicode": "EDE0"
+    },
+    {
+      "name": "Export",
+      "unicode": "EDE1"
+    },
+    {
+      "name": "ExportMirrored",
+      "unicode": "EDE2"
+    },
+    {
+      "name": "SingleBookmark",
+      "unicode": "EDFF"
+    },
+    {
+      "name": "DoubleChevronDown",
+      "unicode": "EE04"
+    },
+    {
+      "name": "ReplyAll",
+      "unicode": "EE0A"
+    },
+    {
+      "name": "Questionnaire",
+      "unicode": "EE19"
+    },
+    {
+      "name": "ReplyMirrored",
+      "unicode": "EE35"
+    },
+    {
+      "name": "ReplyAllMirrored",
+      "unicode": "EE36"
+    },
+    {
+      "name": "AddGroup",
+      "unicode": "EE3D"
+    },
+    {
+      "name": "QuestionnaireMirrored",
+      "unicode": "EE4B"
+    },
+    {
+      "name": "TemporaryUser",
+      "unicode": "EE58"
+    },
+    {
+      "name": "CaretSolid16",
+      "unicode": "EE62"
+    },
+    {
+      "name": "GroupedDescending",
+      "unicode": "EE66"
+    },
+    {
+      "name": "GroupedAscending",
+      "unicode": "EE67"
+    },
+    {
+      "name": "AwayStatus",
+      "unicode": "EE6A"
+    },
+    {
+      "name": "MyMoviesTV",
+      "unicode": "EE6C"
+    },
+    {
+      "name": "AustralianRules",
+      "unicode": "EE70"
+    },
+    {
+      "name": "WifiEthernet",
+      "unicode": "EE77"
+    },
+    {
+      "name": "DateTimeMirrored",
+      "unicode": "EE93"
+    },
+    {
+      "name": "StopSolid",
+      "unicode": "EE95"
+    },
+    {
+      "name": "DoubleChevronUp12",
+      "unicode": "EE96"
+    },
+    {
+      "name": "DoubleChevronDown12",
+      "unicode": "EE97"
+    },
+    {
+      "name": "DoubleChevronLeft12",
+      "unicode": "EE98"
+    },
+    {
+      "name": "DoubleChevronRight12",
+      "unicode": "EE99"
+    }
+  ]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-6.json b/packages/icons/config/fabric-icons-6.json
index 99a1066e731f4..f864b0ec89370 100644
--- a/packages/icons/config/fabric-icons-6.json
+++ b/packages/icons/config/fabric-icons-6.json
@@ -1,404 +1,404 @@
 {
-	"fontName": "fabric-icons-6",
-	"fontFamilyName": "FabricMDL2Icons-6",
-	"excludeGlyphs": false,
-	"chunkSubsets": false,
-	"hashFontFileName": true,
-	"subsetChunkSettings": {
-		"maxSubsetSize": 100
-	},
-	"glyphs": [
-		{
-			"name": "CalendarAgenda",
-			"unicode": "EE9A"
-		},
-		{
-			"name": "AddEvent",
-			"unicode": "EEB5"
-		},
-		{
-			"name": "AssetLibrary",
-			"unicode": "EEB6"
-		},
-		{
-			"name": "DataConnectionLibrary",
-			"unicode": "EEB7"
-		},
-		{
-			"name": "DocLibrary",
-			"unicode": "EEB8"
-		},
-		{
-			"name": "FormLibrary",
-			"unicode": "EEB9"
-		},
-		{
-			"name": "FormLibraryMirrored",
-			"unicode": "EEBA"
-		},
-		{
-			"name": "ReportLibrary",
-			"unicode": "EEBB"
-		},
-		{
-			"name": "ReportLibraryMirrored",
-			"unicode": "EEBC"
-		},
-		{
-			"name": "ContactCard",
-			"unicode": "EEBD"
-		},
-		{
-			"name": "CustomList",
-			"unicode": "EEBE"
-		},
-		{
-			"name": "CustomListMirrored",
-			"unicode": "EEBF"
-		},
-		{
-			"name": "IssueTracking",
-			"unicode": "EEC0"
-		},
-		{
-			"name": "IssueTrackingMirrored",
-			"unicode": "EEC1"
-		},
-		{
-			"name": "PictureLibrary",
-			"unicode": "EEC2"
-		},
-		{
-			"name": "OfficeAddinsLogo",
-			"unicode": "EEC7"
-		},
-		{
-			"name": "OfflineOneDriveParachute",
-			"unicode": "EEC8"
-		},
-		{
-			"name": "OfflineOneDriveParachuteDisabled",
-			"unicode": "EEC9"
-		},
-		{
-			"name": "TriangleSolidUp12",
-			"unicode": "EECC"
-		},
-		{
-			"name": "TriangleSolidDown12",
-			"unicode": "EECD"
-		},
-		{
-			"name": "TriangleSolidLeft12",
-			"unicode": "EECE"
-		},
-		{
-			"name": "TriangleSolidRight12",
-			"unicode": "EECF"
-		},
-		{
-			"name": "TriangleUp12",
-			"unicode": "EED0"
-		},
-		{
-			"name": "TriangleDown12",
-			"unicode": "EED1"
-		},
-		{
-			"name": "TriangleLeft12",
-			"unicode": "EED2"
-		},
-		{
-			"name": "TriangleRight12",
-			"unicode": "EED3"
-		},
-		{
-			"name": "ArrowUpRight8",
-			"unicode": "EED4"
-		},
-		{
-			"name": "ArrowDownRight8",
-			"unicode": "EED5"
-		},
-		{
-			"name": "DocumentSet",
-			"unicode": "EED6"
-		},
-		{
-			"name": "DelveAnalytics",
-			"unicode": "EEEE"
-		},
-		{
-			"name": "ArrowUpRightMirrored8",
-			"unicode": "EEEF"
-		},
-		{
-			"name": "ArrowDownRightMirrored8",
-			"unicode": "EEF0"
-		},
-		{
-			"name": "OneDriveAdd",
-			"unicode": "EF32"
-		},
-		{
-			"name": "Header2",
-			"unicode": "EF36"
-		},
-		{
-			"name": "Header3",
-			"unicode": "EF37"
-		},
-		{
-			"name": "Header4",
-			"unicode": "EF38"
-		},
-		{
-			"name": "MarketDown",
-			"unicode": "EF42"
-		},
-		{
-			"name": "CalendarWorkWeek",
-			"unicode": "EF51"
-		},
-		{
-			"name": "SidePanel",
-			"unicode": "EF52"
-		},
-		{
-			"name": "GlobeFavorite",
-			"unicode": "EF53"
-		},
-		{
-			"name": "CaretTopLeftSolid8",
-			"unicode": "EF54"
-		},
-		{
-			"name": "CaretTopRightSolid8",
-			"unicode": "EF55"
-		},
-		{
-			"name": "ViewAll2",
-			"unicode": "EF56"
-		},
-		{
-			"name": "DocumentReply",
-			"unicode": "EF57"
-		},
-		{
-			"name": "PlayerSettings",
-			"unicode": "EF58"
-		},
-		{
-			"name": "ReceiptForward",
-			"unicode": "EF59"
-		},
-		{
-			"name": "ReceiptReply",
-			"unicode": "EF5A"
-		},
-		{
-			"name": "ReceiptCheck",
-			"unicode": "EF5B"
-		},
-		{
-			"name": "Fax",
-			"unicode": "EF5C"
-		},
-		{
-			"name": "RecurringEvent",
-			"unicode": "EF5D"
-		},
-		{
-			"name": "ReplyAlt",
-			"unicode": "EF5E"
-		},
-		{
-			"name": "ReplyAllAlt",
-			"unicode": "EF5F"
-		},
-		{
-			"name": "EditStyle",
-			"unicode": "EF60"
-		},
-		{
-			"name": "EditMail",
-			"unicode": "EF61"
-		},
-		{
-			"name": "Lifesaver",
-			"unicode": "EF62"
-		},
-		{
-			"name": "LifesaverLock",
-			"unicode": "EF63"
-		},
-		{
-			"name": "InboxCheck",
-			"unicode": "EF64"
-		},
-		{
-			"name": "FolderSearch",
-			"unicode": "EF65"
-		},
-		{
-			"name": "CollapseMenu",
-			"unicode": "EF66"
-		},
-		{
-			"name": "ExpandMenu",
-			"unicode": "EF67"
-		},
-		{
-			"name": "Boards",
-			"unicode": "EF68"
-		},
-		{
-			"name": "SunAdd",
-			"unicode": "EF69"
-		},
-		{
-			"name": "SunQuestionMark",
-			"unicode": "EF6A"
-		},
-		{
-			"name": "LandscapeOrientation",
-			"unicode": "EF6B"
-		},
-		{
-			"name": "DocumentSearch",
-			"unicode": "EF6C"
-		},
-		{
-			"name": "PublicCalendar",
-			"unicode": "EF6D"
-		},
-		{
-			"name": "PublicContactCard",
-			"unicode": "EF6E"
-		},
-		{
-			"name": "PublicEmail",
-			"unicode": "EF6F"
-		},
-		{
-			"name": "PublicFolder",
-			"unicode": "EF70"
-		},
-		{
-			"name": "WordDocument",
-			"unicode": "EF71"
-		},
-		{
-			"name": "PowerPointDocument",
-			"unicode": "EF72"
-		},
-		{
-			"name": "ExcelDocument",
-			"unicode": "EF73"
-		},
-		{
-			"name": "GroupedList",
-			"unicode": "EF74"
-		},
-		{
-			"name": "ClassroomLogo",
-			"unicode": "EF75"
-		},
-		{
-			"name": "Sections",
-			"unicode": "EF76"
-		},
-		{
-			"name": "EditPhoto",
-			"unicode": "EF77"
-		},
-		{
-			"name": "Starburst",
-			"unicode": "EF78"
-		},
-		{
-			"name": "ShareiOS",
-			"unicode": "EF79"
-		},
-		{
-			"name": "AirTickets",
-			"unicode": "EF7A"
-		},
-		{
-			"name": "PencilReply",
-			"unicode": "EF7B"
-		},
-		{
-			"name": "Tiles2",
-			"unicode": "EF7C"
-		},
-		{
-			"name": "SkypeCircleCheck",
-			"unicode": "EF7D"
-		},
-		{
-			"name": "SkypeCircleClock",
-			"unicode": "EF7E"
-		},
-		{
-			"name": "SkypeCircleMinus",
-			"unicode": "EF7F"
-		},
-		{
-			"name": "SkypeMessage",
-			"unicode": "EF83"
-		},
-		{
-			"name": "ClosedCaption",
-			"unicode": "EF84"
-		},
-		{
-			"name": "ATPLogo",
-			"unicode": "EF85"
-		},
-		{
-			"name": "OfficeFormsLogoInverse",
-			"unicode": "EF86"
-		},
-		{
-			"name": "RecycleBin",
-			"unicode": "EF87"
-		},
-		{
-			"name": "EmptyRecycleBin",
-			"unicode": "EF88"
-		},
-		{
-			"name": "Hide2",
-			"unicode": "EF89"
-		},
-		{
-			"name": "Breadcrumb",
-			"unicode": "EF8C"
-		},
-		{
-			"name": "PageEdit",
-			"unicode": "EFB6"
-		},
-		{
-			"name": "Database",
-			"unicode": "EFC7"
-		},
-		{
-			"name": "DocumentManagement",
-			"unicode": "EFFC"
-		},
-		{
-			"name": "CRMReport",
-			"unicode": "EFFE"
-		},
-		{
-			"name": "ZipFolder",
-			"unicode": "F012"
-		},
-		{
-			"name": "TextDocument",
-			"unicode": "F029"
-		}
-	]
+  "fontName": "fabric-icons-6",
+  "fontFamilyName": "FabricMDL2Icons-6",
+  "excludeGlyphs": false,
+  "chunkSubsets": false,
+  "hashFontFileName": true,
+  "subsetChunkSettings": {
+    "maxSubsetSize": 100
+  },
+  "glyphs": [
+    {
+      "name": "CalendarAgenda",
+      "unicode": "EE9A"
+    },
+    {
+      "name": "AddEvent",
+      "unicode": "EEB5"
+    },
+    {
+      "name": "AssetLibrary",
+      "unicode": "EEB6"
+    },
+    {
+      "name": "DataConnectionLibrary",
+      "unicode": "EEB7"
+    },
+    {
+      "name": "DocLibrary",
+      "unicode": "EEB8"
+    },
+    {
+      "name": "FormLibrary",
+      "unicode": "EEB9"
+    },
+    {
+      "name": "FormLibraryMirrored",
+      "unicode": "EEBA"
+    },
+    {
+      "name": "ReportLibrary",
+      "unicode": "EEBB"
+    },
+    {
+      "name": "ReportLibraryMirrored",
+      "unicode": "EEBC"
+    },
+    {
+      "name": "ContactCard",
+      "unicode": "EEBD"
+    },
+    {
+      "name": "CustomList",
+      "unicode": "EEBE"
+    },
+    {
+      "name": "CustomListMirrored",
+      "unicode": "EEBF"
+    },
+    {
+      "name": "IssueTracking",
+      "unicode": "EEC0"
+    },
+    {
+      "name": "IssueTrackingMirrored",
+      "unicode": "EEC1"
+    },
+    {
+      "name": "PictureLibrary",
+      "unicode": "EEC2"
+    },
+    {
+      "name": "OfficeAddinsLogo",
+      "unicode": "EEC7"
+    },
+    {
+      "name": "OfflineOneDriveParachute",
+      "unicode": "EEC8"
+    },
+    {
+      "name": "OfflineOneDriveParachuteDisabled",
+      "unicode": "EEC9"
+    },
+    {
+      "name": "TriangleSolidUp12",
+      "unicode": "EECC"
+    },
+    {
+      "name": "TriangleSolidDown12",
+      "unicode": "EECD"
+    },
+    {
+      "name": "TriangleSolidLeft12",
+      "unicode": "EECE"
+    },
+    {
+      "name": "TriangleSolidRight12",
+      "unicode": "EECF"
+    },
+    {
+      "name": "TriangleUp12",
+      "unicode": "EED0"
+    },
+    {
+      "name": "TriangleDown12",
+      "unicode": "EED1"
+    },
+    {
+      "name": "TriangleLeft12",
+      "unicode": "EED2"
+    },
+    {
+      "name": "TriangleRight12",
+      "unicode": "EED3"
+    },
+    {
+      "name": "ArrowUpRight8",
+      "unicode": "EED4"
+    },
+    {
+      "name": "ArrowDownRight8",
+      "unicode": "EED5"
+    },
+    {
+      "name": "DocumentSet",
+      "unicode": "EED6"
+    },
+    {
+      "name": "DelveAnalytics",
+      "unicode": "EEEE"
+    },
+    {
+      "name": "ArrowUpRightMirrored8",
+      "unicode": "EEEF"
+    },
+    {
+      "name": "ArrowDownRightMirrored8",
+      "unicode": "EEF0"
+    },
+    {
+      "name": "OneDriveAdd",
+      "unicode": "EF32"
+    },
+    {
+      "name": "Header2",
+      "unicode": "EF36"
+    },
+    {
+      "name": "Header3",
+      "unicode": "EF37"
+    },
+    {
+      "name": "Header4",
+      "unicode": "EF38"
+    },
+    {
+      "name": "MarketDown",
+      "unicode": "EF42"
+    },
+    {
+      "name": "CalendarWorkWeek",
+      "unicode": "EF51"
+    },
+    {
+      "name": "SidePanel",
+      "unicode": "EF52"
+    },
+    {
+      "name": "GlobeFavorite",
+      "unicode": "EF53"
+    },
+    {
+      "name": "CaretTopLeftSolid8",
+      "unicode": "EF54"
+    },
+    {
+      "name": "CaretTopRightSolid8",
+      "unicode": "EF55"
+    },
+    {
+      "name": "ViewAll2",
+      "unicode": "EF56"
+    },
+    {
+      "name": "DocumentReply",
+      "unicode": "EF57"
+    },
+    {
+      "name": "PlayerSettings",
+      "unicode": "EF58"
+    },
+    {
+      "name": "ReceiptForward",
+      "unicode": "EF59"
+    },
+    {
+      "name": "ReceiptReply",
+      "unicode": "EF5A"
+    },
+    {
+      "name": "ReceiptCheck",
+      "unicode": "EF5B"
+    },
+    {
+      "name": "Fax",
+      "unicode": "EF5C"
+    },
+    {
+      "name": "RecurringEvent",
+      "unicode": "EF5D"
+    },
+    {
+      "name": "ReplyAlt",
+      "unicode": "EF5E"
+    },
+    {
+      "name": "ReplyAllAlt",
+      "unicode": "EF5F"
+    },
+    {
+      "name": "EditStyle",
+      "unicode": "EF60"
+    },
+    {
+      "name": "EditMail",
+      "unicode": "EF61"
+    },
+    {
+      "name": "Lifesaver",
+      "unicode": "EF62"
+    },
+    {
+      "name": "LifesaverLock",
+      "unicode": "EF63"
+    },
+    {
+      "name": "InboxCheck",
+      "unicode": "EF64"
+    },
+    {
+      "name": "FolderSearch",
+      "unicode": "EF65"
+    },
+    {
+      "name": "CollapseMenu",
+      "unicode": "EF66"
+    },
+    {
+      "name": "ExpandMenu",
+      "unicode": "EF67"
+    },
+    {
+      "name": "Boards",
+      "unicode": "EF68"
+    },
+    {
+      "name": "SunAdd",
+      "unicode": "EF69"
+    },
+    {
+      "name": "SunQuestionMark",
+      "unicode": "EF6A"
+    },
+    {
+      "name": "LandscapeOrientation",
+      "unicode": "EF6B"
+    },
+    {
+      "name": "DocumentSearch",
+      "unicode": "EF6C"
+    },
+    {
+      "name": "PublicCalendar",
+      "unicode": "EF6D"
+    },
+    {
+      "name": "PublicContactCard",
+      "unicode": "EF6E"
+    },
+    {
+      "name": "PublicEmail",
+      "unicode": "EF6F"
+    },
+    {
+      "name": "PublicFolder",
+      "unicode": "EF70"
+    },
+    {
+      "name": "WordDocument",
+      "unicode": "EF71"
+    },
+    {
+      "name": "PowerPointDocument",
+      "unicode": "EF72"
+    },
+    {
+      "name": "ExcelDocument",
+      "unicode": "EF73"
+    },
+    {
+      "name": "GroupedList",
+      "unicode": "EF74"
+    },
+    {
+      "name": "ClassroomLogo",
+      "unicode": "EF75"
+    },
+    {
+      "name": "Sections",
+      "unicode": "EF76"
+    },
+    {
+      "name": "EditPhoto",
+      "unicode": "EF77"
+    },
+    {
+      "name": "Starburst",
+      "unicode": "EF78"
+    },
+    {
+      "name": "ShareiOS",
+      "unicode": "EF79"
+    },
+    {
+      "name": "AirTickets",
+      "unicode": "EF7A"
+    },
+    {
+      "name": "PencilReply",
+      "unicode": "EF7B"
+    },
+    {
+      "name": "Tiles2",
+      "unicode": "EF7C"
+    },
+    {
+      "name": "SkypeCircleCheck",
+      "unicode": "EF7D"
+    },
+    {
+      "name": "SkypeCircleClock",
+      "unicode": "EF7E"
+    },
+    {
+      "name": "SkypeCircleMinus",
+      "unicode": "EF7F"
+    },
+    {
+      "name": "SkypeMessage",
+      "unicode": "EF83"
+    },
+    {
+      "name": "ClosedCaption",
+      "unicode": "EF84"
+    },
+    {
+      "name": "ATPLogo",
+      "unicode": "EF85"
+    },
+    {
+      "name": "OfficeFormsLogoInverse",
+      "unicode": "EF86"
+    },
+    {
+      "name": "RecycleBin",
+      "unicode": "EF87"
+    },
+    {
+      "name": "EmptyRecycleBin",
+      "unicode": "EF88"
+    },
+    {
+      "name": "Hide2",
+      "unicode": "EF89"
+    },
+    {
+      "name": "Breadcrumb",
+      "unicode": "EF8C"
+    },
+    {
+      "name": "PageEdit",
+      "unicode": "EFB6"
+    },
+    {
+      "name": "Database",
+      "unicode": "EFC7"
+    },
+    {
+      "name": "DocumentManagement",
+      "unicode": "EFFC"
+    },
+    {
+      "name": "CRMReport",
+      "unicode": "EFFE"
+    },
+    {
+      "name": "ZipFolder",
+      "unicode": "F012"
+    },
+    {
+      "name": "TextDocument",
+      "unicode": "F029"
+    }
+  ]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-7.json b/packages/icons/config/fabric-icons-7.json
index 39cefe64671c6..addfa7ea3ba4c 100644
--- a/packages/icons/config/fabric-icons-7.json
+++ b/packages/icons/config/fabric-icons-7.json
@@ -1,412 +1,412 @@
 {
-	"fontName": "fabric-icons-7",
-	"fontFamilyName": "FabricMDL2Icons-7",
-	"excludeGlyphs": false,
-	"chunkSubsets": true,
-	"hashFontFileName": true,
-	"subsetChunkSettings": {
-		"maxSubsetSize": 100
-	},
-	"glyphs": [
-		{
-			"name": "PageCheckedOut",
-			"unicode": "F02C"
-		},
-		{
-			"name": "SaveAndClose",
-			"unicode": "F038"
-		},
-		{
-			"name": "Script",
-			"unicode": "F03A"
-		},
-		{
-			"name": "Archive",
-			"unicode": "F03F"
-		},
-		{
-			"name": "ActivityFeed",
-			"unicode": "F056"
-		},
-		{
-			"name": "EventDate",
-			"unicode": "F059"
-		},
-		{
-			"name": "CaretRight",
-			"unicode": "F06B"
-		},
-		{
-			"name": "SetAction",
-			"unicode": "F071"
-		},
-		{
-			"name": "CaretSolidLeft",
-			"unicode": "F08D"
-		},
-		{
-			"name": "CaretSolidDown",
-			"unicode": "F08E"
-		},
-		{
-			"name": "CaretSolidRight",
-			"unicode": "F08F"
-		},
-		{
-			"name": "CaretSolidUp",
-			"unicode": "F090"
-		},
-		{
-			"name": "PowerAppsLogo",
-			"unicode": "F091"
-		},
-		{
-			"name": "PowerApps2Logo",
-			"unicode": "F092"
-		},
-		{
-			"name": "SearchIssue",
-			"unicode": "F09A"
-		},
-		{
-			"name": "SearchIssueMirrored",
-			"unicode": "F09B"
-		},
-		{
-			"name": "FabricAssetLibrary",
-			"unicode": "F09C"
-		},
-		{
-			"name": "FabricDataConnectionLibrary",
-			"unicode": "F09D"
-		},
-		{
-			"name": "FabricDocLibrary",
-			"unicode": "F09E"
-		},
-		{
-			"name": "FabricFormLibrary",
-			"unicode": "F09F"
-		},
-		{
-			"name": "FabricFormLibraryMirrored",
-			"unicode": "F0A0"
-		},
-		{
-			"name": "FabricReportLibrary",
-			"unicode": "F0A1"
-		},
-		{
-			"name": "FabricReportLibraryMirrored",
-			"unicode": "F0A2"
-		},
-		{
-			"name": "FabricPublicFolder",
-			"unicode": "F0A3"
-		},
-		{
-			"name": "FabricFolderSearch",
-			"unicode": "F0A4"
-		},
-		{
-			"name": "FabricMovetoFolder",
-			"unicode": "F0A5"
-		},
-		{
-			"name": "FabricUnsyncFolder",
-			"unicode": "F0A6"
-		},
-		{
-			"name": "FabricSyncFolder",
-			"unicode": "F0A7"
-		},
-		{
-			"name": "FabricOpenFolderHorizontal",
-			"unicode": "F0A8"
-		},
-		{
-			"name": "FabricFolder",
-			"unicode": "F0A9"
-		},
-		{
-			"name": "FabricFolderFill",
-			"unicode": "F0AA"
-		},
-		{
-			"name": "FabricNewFolder",
-			"unicode": "F0AB"
-		},
-		{
-			"name": "FabricPictureLibrary",
-			"unicode": "F0AC"
-		},
-		{
-			"name": "AddFavorite",
-			"unicode": "F0C8"
-		},
-		{
-			"name": "AddFavoriteFill",
-			"unicode": "F0C9"
-		},
-		{
-			"name": "BufferTimeBefore",
-			"unicode": "F0CF"
-		},
-		{
-			"name": "BufferTimeAfter",
-			"unicode": "F0D0"
-		},
-		{
-			"name": "BufferTimeBoth",
-			"unicode": "F0D1"
-		},
-		{
-			"name": "CannedChat",
-			"unicode": "F0F2"
-		},
-		{
-			"name": "SkypeForBusinessLogo",
-			"unicode": "F0FC"
-		},
-		{
-			"name": "PageCheckedin",
-			"unicode": "F104"
-		},
-		{
-			"name": "CaretBottomLeftSolid8",
-			"unicode": "F121"
-		},
-		{
-			"name": "CaretBottomRightSolid8",
-			"unicode": "F122"
-		},
-		{
-			"name": "FolderHorizontal",
-			"unicode": "F12B"
-		},
-		{
-			"name": "MicrosoftStaffhubLogo",
-			"unicode": "F130"
-		},
-		{
-			"name": "GiftboxOpen",
-			"unicode": "F133"
-		},
-		{
-			"name": "StatusCircleOuter",
-			"unicode": "F136"
-		},
-		{
-			"name": "StatusCircleInner",
-			"unicode": "F137"
-		},
-		{
-			"name": "ExploreContentSingle",
-			"unicode": "F164"
-		},
-		{
-			"name": "CollapseContent",
-			"unicode": "F165"
-		},
-		{
-			"name": "CollapseContentSingle",
-			"unicode": "F166"
-		},
-		{
-			"name": "InfoSolid",
-			"unicode": "F167"
-		},
-		{
-			"name": "ProgressRingDots",
-			"unicode": "F16A"
-		},
-		{
-			"name": "CaloriesAdd",
-			"unicode": "F172"
-		},
-		{
-			"name": "BranchFork",
-			"unicode": "F173"
-		},
-		{
-			"name": "HardDriveGroup",
-			"unicode": "F18F"
-		},
-		{
-			"name": "BucketColor",
-			"unicode": "F1B6"
-		},
-		{
-			"name": "BucketColorFill",
-			"unicode": "F1B7"
-		},
-		{
-			"name": "Taskboard",
-			"unicode": "F1C2"
-		},
-		{
-			"name": "SingleColumn",
-			"unicode": "F1D3"
-		},
-		{
-			"name": "DoubleColumn",
-			"unicode": "F1D4"
-		},
-		{
-			"name": "TripleColumn",
-			"unicode": "F1D5"
-		},
-		{
-			"name": "ColumnLeftTwoThirds",
-			"unicode": "F1D6"
-		},
-		{
-			"name": "ColumnRightTwoThirds",
-			"unicode": "F1D7"
-		},
-		{
-			"name": "AccessLogoFill",
-			"unicode": "F1DB"
-		},
-		{
-			"name": "AnalyticsLogo",
-			"unicode": "F1DE"
-		},
-		{
-			"name": "AnalyticsQuery",
-			"unicode": "F1DF"
-		},
-		{
-			"name": "NewAnalyticsQuery",
-			"unicode": "F1E0"
-		},
-		{
-			"name": "AnalyticsReport",
-			"unicode": "F1E1"
-		},
-		{
-			"name": "WordLogo",
-			"unicode": "F1E3"
-		},
-		{
-			"name": "WordLogoFill",
-			"unicode": "F1E4"
-		},
-		{
-			"name": "ExcelLogo",
-			"unicode": "F1E5"
-		},
-		{
-			"name": "ExcelLogoFill",
-			"unicode": "F1E6"
-		},
-		{
-			"name": "OneNoteLogo",
-			"unicode": "F1E7"
-		},
-		{
-			"name": "OneNoteLogoFill",
-			"unicode": "F1E8"
-		},
-		{
-			"name": "OutlookLogo",
-			"unicode": "F1E9"
-		},
-		{
-			"name": "OutlookLogoFill",
-			"unicode": "F1EA"
-		},
-		{
-			"name": "PowerPointLogo",
-			"unicode": "F1EB"
-		},
-		{
-			"name": "PowerPointLogoFill",
-			"unicode": "F1EC"
-		},
-		{
-			"name": "PublisherLogo",
-			"unicode": "F1ED"
-		},
-		{
-			"name": "PublisherLogoFill",
-			"unicode": "F1EE"
-		},
-		{
-			"name": "ScheduleEventAction",
-			"unicode": "F1EF"
-		},
-		{
-			"name": "FlameSolid",
-			"unicode": "F1F3"
-		},
-		{
-			"name": "ServerProcesses",
-			"unicode": "F1FE"
-		},
-		{
-			"name": "Server",
-			"unicode": "F201"
-		},
-		{
-			"name": "SaveAll",
-			"unicode": "F203"
-		},
-		{
-			"name": "LinkedInLogo",
-			"unicode": "F20A"
-		},
-		{
-			"name": "SidePanelMirrored",
-			"unicode": "F221"
-		},
-		{
-			"name": "ProtectRestrict",
-			"unicode": "F22A"
-		},
-		{
-			"name": "GridViewSmall",
-			"unicode": "F232"
-		},
-		{
-			"name": "GridViewMedium",
-			"unicode": "F233"
-		},
-		{
-			"name": "GridViewLarge",
-			"unicode": "F234"
-		},
-		{
-			"name": "Step",
-			"unicode": "F241"
-		},
-		{
-			"name": "StepInsert",
-			"unicode": "F242"
-		},
-		{
-			"name": "StepShared",
-			"unicode": "F243"
-		},
-		{
-			"name": "StepSharedAdd",
-			"unicode": "F244"
-		},
-		{
-			"name": "StepSharedInsert",
-			"unicode": "F245"
-		},
-		{
-			"name": "ViewDashboard",
-			"unicode": "F246"
-		},
-		{
-			"name": "ViewList",
-			"unicode": "F247"
-		},
-		{
-			"name": "ViewListGroup",
-			"unicode": "F248"
-		}
-	]
+  "fontName": "fabric-icons-7",
+  "fontFamilyName": "FabricMDL2Icons-7",
+  "excludeGlyphs": false,
+  "chunkSubsets": true,
+  "hashFontFileName": true,
+  "subsetChunkSettings": {
+    "maxSubsetSize": 100
+  },
+  "glyphs": [
+    {
+      "name": "PageCheckedOut",
+      "unicode": "F02C"
+    },
+    {
+      "name": "SaveAndClose",
+      "unicode": "F038"
+    },
+    {
+      "name": "Script",
+      "unicode": "F03A"
+    },
+    {
+      "name": "Archive",
+      "unicode": "F03F"
+    },
+    {
+      "name": "ActivityFeed",
+      "unicode": "F056"
+    },
+    {
+      "name": "EventDate",
+      "unicode": "F059"
+    },
+    {
+      "name": "CaretRight",
+      "unicode": "F06B"
+    },
+    {
+      "name": "SetAction",
+      "unicode": "F071"
+    },
+    {
+      "name": "CaretSolidLeft",
+      "unicode": "F08D"
+    },
+    {
+      "name": "CaretSolidDown",
+      "unicode": "F08E"
+    },
+    {
+      "name": "CaretSolidRight",
+      "unicode": "F08F"
+    },
+    {
+      "name": "CaretSolidUp",
+      "unicode": "F090"
+    },
+    {
+      "name": "PowerAppsLogo",
+      "unicode": "F091"
+    },
+    {
+      "name": "PowerApps2Logo",
+      "unicode": "F092"
+    },
+    {
+      "name": "SearchIssue",
+      "unicode": "F09A"
+    },
+    {
+      "name": "SearchIssueMirrored",
+      "unicode": "F09B"
+    },
+    {
+      "name": "FabricAssetLibrary",
+      "unicode": "F09C"
+    },
+    {
+      "name": "FabricDataConnectionLibrary",
+      "unicode": "F09D"
+    },
+    {
+      "name": "FabricDocLibrary",
+      "unicode": "F09E"
+    },
+    {
+      "name": "FabricFormLibrary",
+      "unicode": "F09F"
+    },
+    {
+      "name": "FabricFormLibraryMirrored",
+      "unicode": "F0A0"
+    },
+    {
+      "name": "FabricReportLibrary",
+      "unicode": "F0A1"
+    },
+    {
+      "name": "FabricReportLibraryMirrored",
+      "unicode": "F0A2"
+    },
+    {
+      "name": "FabricPublicFolder",
+      "unicode": "F0A3"
+    },
+    {
+      "name": "FabricFolderSearch",
+      "unicode": "F0A4"
+    },
+    {
+      "name": "FabricMovetoFolder",
+      "unicode": "F0A5"
+    },
+    {
+      "name": "FabricUnsyncFolder",
+      "unicode": "F0A6"
+    },
+    {
+      "name": "FabricSyncFolder",
+      "unicode": "F0A7"
+    },
+    {
+      "name": "FabricOpenFolderHorizontal",
+      "unicode": "F0A8"
+    },
+    {
+      "name": "FabricFolder",
+      "unicode": "F0A9"
+    },
+    {
+      "name": "FabricFolderFill",
+      "unicode": "F0AA"
+    },
+    {
+      "name": "FabricNewFolder",
+      "unicode": "F0AB"
+    },
+    {
+      "name": "FabricPictureLibrary",
+      "unicode": "F0AC"
+    },
+    {
+      "name": "AddFavorite",
+      "unicode": "F0C8"
+    },
+    {
+      "name": "AddFavoriteFill",
+      "unicode": "F0C9"
+    },
+    {
+      "name": "BufferTimeBefore",
+      "unicode": "F0CF"
+    },
+    {
+      "name": "BufferTimeAfter",
+      "unicode": "F0D0"
+    },
+    {
+      "name": "BufferTimeBoth",
+      "unicode": "F0D1"
+    },
+    {
+      "name": "CannedChat",
+      "unicode": "F0F2"
+    },
+    {
+      "name": "SkypeForBusinessLogo",
+      "unicode": "F0FC"
+    },
+    {
+      "name": "PageCheckedin",
+      "unicode": "F104"
+    },
+    {
+      "name": "CaretBottomLeftSolid8",
+      "unicode": "F121"
+    },
+    {
+      "name": "CaretBottomRightSolid8",
+      "unicode": "F122"
+    },
+    {
+      "name": "FolderHorizontal",
+      "unicode": "F12B"
+    },
+    {
+      "name": "MicrosoftStaffhubLogo",
+      "unicode": "F130"
+    },
+    {
+      "name": "GiftboxOpen",
+      "unicode": "F133"
+    },
+    {
+      "name": "StatusCircleOuter",
+      "unicode": "F136"
+    },
+    {
+      "name": "StatusCircleInner",
+      "unicode": "F137"
+    },
+    {
+      "name": "ExploreContentSingle",
+      "unicode": "F164"
+    },
+    {
+      "name": "CollapseContent",
+      "unicode": "F165"
+    },
+    {
+      "name": "CollapseContentSingle",
+      "unicode": "F166"
+    },
+    {
+      "name": "InfoSolid",
+      "unicode": "F167"
+    },
+    {
+      "name": "ProgressRingDots",
+      "unicode": "F16A"
+    },
+    {
+      "name": "CaloriesAdd",
+      "unicode": "F172"
+    },
+    {
+      "name": "BranchFork",
+      "unicode": "F173"
+    },
+    {
+      "name": "HardDriveGroup",
+      "unicode": "F18F"
+    },
+    {
+      "name": "BucketColor",
+      "unicode": "F1B6"
+    },
+    {
+      "name": "BucketColorFill",
+      "unicode": "F1B7"
+    },
+    {
+      "name": "Taskboard",
+      "unicode": "F1C2"
+    },
+    {
+      "name": "SingleColumn",
+      "unicode": "F1D3"
+    },
+    {
+      "name": "DoubleColumn",
+      "unicode": "F1D4"
+    },
+    {
+      "name": "TripleColumn",
+      "unicode": "F1D5"
+    },
+    {
+      "name": "ColumnLeftTwoThirds",
+      "unicode": "F1D6"
+    },
+    {
+      "name": "ColumnRightTwoThirds",
+      "unicode": "F1D7"
+    },
+    {
+      "name": "AccessLogoFill",
+      "unicode": "F1DB"
+    },
+    {
+      "name": "AnalyticsLogo",
+      "unicode": "F1DE"
+    },
+    {
+      "name": "AnalyticsQuery",
+      "unicode": "F1DF"
+    },
+    {
+      "name": "NewAnalyticsQuery",
+      "unicode": "F1E0"
+    },
+    {
+      "name": "AnalyticsReport",
+      "unicode": "F1E1"
+    },
+    {
+      "name": "WordLogo",
+      "unicode": "F1E3"
+    },
+    {
+      "name": "WordLogoFill",
+      "unicode": "F1E4"
+    },
+    {
+      "name": "ExcelLogo",
+      "unicode": "F1E5"
+    },
+    {
+      "name": "ExcelLogoFill",
+      "unicode": "F1E6"
+    },
+    {
+      "name": "OneNoteLogo",
+      "unicode": "F1E7"
+    },
+    {
+      "name": "OneNoteLogoFill",
+      "unicode": "F1E8"
+    },
+    {
+      "name": "OutlookLogo",
+      "unicode": "F1E9"
+    },
+    {
+      "name": "OutlookLogoFill",
+      "unicode": "F1EA"
+    },
+    {
+      "name": "PowerPointLogo",
+      "unicode": "F1EB"
+    },
+    {
+      "name": "PowerPointLogoFill",
+      "unicode": "F1EC"
+    },
+    {
+      "name": "PublisherLogo",
+      "unicode": "F1ED"
+    },
+    {
+      "name": "PublisherLogoFill",
+      "unicode": "F1EE"
+    },
+    {
+      "name": "ScheduleEventAction",
+      "unicode": "F1EF"
+    },
+    {
+      "name": "FlameSolid",
+      "unicode": "F1F3"
+    },
+    {
+      "name": "ServerProcesses",
+      "unicode": "F1FE"
+    },
+    {
+      "name": "Server",
+      "unicode": "F201"
+    },
+    {
+      "name": "SaveAll",
+      "unicode": "F203"
+    },
+    {
+      "name": "LinkedInLogo",
+      "unicode": "F20A"
+    },
+    {
+      "name": "SidePanelMirrored",
+      "unicode": "F221"
+    },
+    {
+      "name": "ProtectRestrict",
+      "unicode": "F22A"
+    },
+    {
+      "name": "GridViewSmall",
+      "unicode": "F232"
+    },
+    {
+      "name": "GridViewMedium",
+      "unicode": "F233"
+    },
+    {
+      "name": "GridViewLarge",
+      "unicode": "F234"
+    },
+    {
+      "name": "Step",
+      "unicode": "F241"
+    },
+    {
+      "name": "StepInsert",
+      "unicode": "F242"
+    },
+    {
+      "name": "StepShared",
+      "unicode": "F243"
+    },
+    {
+      "name": "StepSharedAdd",
+      "unicode": "F244"
+    },
+    {
+      "name": "StepSharedInsert",
+      "unicode": "F245"
+    },
+    {
+      "name": "ViewDashboard",
+      "unicode": "F246"
+    },
+    {
+      "name": "ViewList",
+      "unicode": "F247"
+    },
+    {
+      "name": "ViewListGroup",
+      "unicode": "F248"
+    }
+  ]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-8.json b/packages/icons/config/fabric-icons-8.json
index c17353bb50e3b..9db80a930819f 100644
--- a/packages/icons/config/fabric-icons-8.json
+++ b/packages/icons/config/fabric-icons-8.json
@@ -1,412 +1,412 @@
 {
-	"fontName": "fabric-icons-8",
-	"fontFamilyName": "FabricMDL2Icons-8",
-	"excludeGlyphs": false,
-	"chunkSubsets": true,
-	"hashFontFileName": true,
-	"subsetChunkSettings": {
-		"maxSubsetSize": 100
-	},
-	"glyphs": [
-		{
-			"name": "ViewListTree",
-			"unicode": "F249"
-		},
-		{
-			"name": "TriggerAuto",
-			"unicode": "F24A"
-		},
-		{
-			"name": "TriggerUser",
-			"unicode": "F24B"
-		},
-		{
-			"name": "PivotChart",
-			"unicode": "F24C"
-		},
-		{
-			"name": "StackedBarChart",
-			"unicode": "F24D"
-		},
-		{
-			"name": "StackedLineChart",
-			"unicode": "F24E"
-		},
-		{
-			"name": "BuildQueue",
-			"unicode": "F24F"
-		},
-		{
-			"name": "BuildQueueNew",
-			"unicode": "F250"
-		},
-		{
-			"name": "UserFollowed",
-			"unicode": "F25C"
-		},
-		{
-			"name": "VennDiagram",
-			"unicode": "F273"
-		},
-		{
-			"name": "FiveTileGrid",
-			"unicode": "F274"
-		},
-		{
-			"name": "FocalPoint",
-			"unicode": "F277"
-		},
-		{
-			"name": "TeamsLogoInverse",
-			"unicode": "F27A"
-		},
-		{
-			"name": "TeamsLogo",
-			"unicode": "F27B"
-		},
-		{
-			"name": "TeamsLogoFill",
-			"unicode": "F27C"
-		},
-		{
-			"name": "SkypeForBusinessLogoFill",
-			"unicode": "F27D"
-		},
-		{
-			"name": "SharepointLogo",
-			"unicode": "F27E"
-		},
-		{
-			"name": "SharepointLogoFill",
-			"unicode": "F27F"
-		},
-		{
-			"name": "DelveLogo",
-			"unicode": "F280"
-		},
-		{
-			"name": "DelveLogoFill",
-			"unicode": "F281"
-		},
-		{
-			"name": "OfficeVideoLogo",
-			"unicode": "F282"
-		},
-		{
-			"name": "OfficeVideoLogoFill",
-			"unicode": "F283"
-		},
-		{
-			"name": "ExchangeLogo",
-			"unicode": "F284"
-		},
-		{
-			"name": "ExchangeLogoFill",
-			"unicode": "F285"
-		},
-		{
-			"name": "DocumentApproval",
-			"unicode": "F28B"
-		},
-		{
-			"name": "CloneToDesktop",
-			"unicode": "F28C"
-		},
-		{
-			"name": "InstallToDrive",
-			"unicode": "F28D"
-		},
-		{
-			"name": "Blur",
-			"unicode": "F28E"
-		},
-		{
-			"name": "Build",
-			"unicode": "F28F"
-		},
-		{
-			"name": "ProcessMetaTask",
-			"unicode": "F290"
-		},
-		{
-			"name": "BranchFork2",
-			"unicode": "F291"
-		},
-		{
-			"name": "BranchLocked",
-			"unicode": "F292"
-		},
-		{
-			"name": "BranchCommit",
-			"unicode": "F293"
-		},
-		{
-			"name": "BranchCompare",
-			"unicode": "F294"
-		},
-		{
-			"name": "BranchMerge",
-			"unicode": "F295"
-		},
-		{
-			"name": "BranchPullRequest",
-			"unicode": "F296"
-		},
-		{
-			"name": "BranchSearch",
-			"unicode": "F297"
-		},
-		{
-			"name": "BranchShelveset",
-			"unicode": "F298"
-		},
-		{
-			"name": "RawSource",
-			"unicode": "F299"
-		},
-		{
-			"name": "MergeDuplicate",
-			"unicode": "F29A"
-		},
-		{
-			"name": "RowsGroup",
-			"unicode": "F29B"
-		},
-		{
-			"name": "RowsChild",
-			"unicode": "F29C"
-		},
-		{
-			"name": "Deploy",
-			"unicode": "F29D"
-		},
-		{
-			"name": "Redeploy",
-			"unicode": "F29E"
-		},
-		{
-			"name": "ServerEnviroment",
-			"unicode": "F29F"
-		},
-		{
-			"name": "Plug",
-			"unicode": "F300"
-		},
-		{
-			"name": "PlugSolid",
-			"unicode": "F301"
-		},
-		{
-			"name": "PlugConnected",
-			"unicode": "F302"
-		},
-		{
-			"name": "PlugDisconnected",
-			"unicode": "F303"
-		},
-		{
-			"name": "UnlockSolid",
-			"unicode": "F304"
-		},
-		{
-			"name": "Variable",
-			"unicode": "F305"
-		},
-		{
-			"name": "Parameter",
-			"unicode": "F306"
-		},
-		{
-			"name": "CommentUrgent",
-			"unicode": "F307"
-		},
-		{
-			"name": "Storyboard",
-			"unicode": "F308"
-		},
-		{
-			"name": "DiffInline",
-			"unicode": "F309"
-		},
-		{
-			"name": "DiffSideBySide",
-			"unicode": "F30A"
-		},
-		{
-			"name": "ImageDiff",
-			"unicode": "F30B"
-		},
-		{
-			"name": "ImagePixel",
-			"unicode": "F30C"
-		},
-		{
-			"name": "FileBug",
-			"unicode": "F30D"
-		},
-		{
-			"name": "FileCode",
-			"unicode": "F30E"
-		},
-		{
-			"name": "FileComment",
-			"unicode": "F30F"
-		},
-		{
-			"name": "FileImage",
-			"unicode": "F311"
-		},
-		{
-			"name": "FileSymlink",
-			"unicode": "F312"
-		},
-		{
-			"name": "AutoFillTemplate",
-			"unicode": "F313"
-		},
-		{
-			"name": "WorkItem",
-			"unicode": "F314"
-		},
-		{
-			"name": "WorkItemBug",
-			"unicode": "F315"
-		},
-		{
-			"name": "LogRemove",
-			"unicode": "F316"
-		},
-		{
-			"name": "ColumnOptions",
-			"unicode": "F317"
-		},
-		{
-			"name": "Packages",
-			"unicode": "F318"
-		},
-		{
-			"name": "BuildIssue",
-			"unicode": "F319"
-		},
-		{
-			"name": "AssessmentGroup",
-			"unicode": "F31A"
-		},
-		{
-			"name": "VariableGroup",
-			"unicode": "F31B"
-		},
-		{
-			"name": "FullHistory",
-			"unicode": "F31C"
-		},
-		{
-			"name": "BusinessHoursSign",
-			"unicode": "F310"
-		},
-		{
-			"name": "VisioDiagram",
-			"unicode": "F2A0"
-		},
-		{
-			"name": "HighlightMappedShapes",
-			"unicode": "F2A1"
-		},
-		{
-			"name": "TextCallout",
-			"unicode": "F2A2"
-		},
-		{
-			"name": "IconSetsFlag",
-			"unicode": "F2A4"
-		},
-		{
-			"name": "VisioLogo",
-			"unicode": "F2A7"
-		},
-		{
-			"name": "VisioLogoFill",
-			"unicode": "F2A8"
-		},
-		{
-			"name": "VisioDocument",
-			"unicode": "F2A9"
-		},
-		{
-			"name": "TimelineProgress",
-			"unicode": "F2AA"
-		},
-		{
-			"name": "TimelineDelivery",
-			"unicode": "F2AB"
-		},
-		{
-			"name": "Backlog",
-			"unicode": "F2AC"
-		},
-		{
-			"name": "TeamFavorite",
-			"unicode": "F2AD"
-		},
-		{
-			"name": "TaskGroup",
-			"unicode": "F2AE"
-		},
-		{
-			"name": "TaskGroupMirrored",
-			"unicode": "F2AF"
-		},
-		{
-			"name": "ScopeTemplate",
-			"unicode": "F2B0"
-		},
-		{
-			"name": "AssessmentGroupTemplate",
-			"unicode": "F2B1"
-		},
-		{
-			"name": "NewTeamProject",
-			"unicode": "F2B2"
-		},
-		{
-			"name": "CommentAdd",
-			"unicode": "F2B3"
-		},
-		{
-			"name": "CommentNext",
-			"unicode": "F2B4"
-		},
-		{
-			"name": "CommentPrevious",
-			"unicode": "F2B5"
-		},
-		{
-			"name": "ShopServer",
-			"unicode": "F2B6"
-		},
-		{
-			"name": "LocaleLanguage",
-			"unicode": "F2B7"
-		},
-		{
-			"name": "QueryList",
-			"unicode": "F2B8"
-		},
-		{
-			"name": "UserSync",
-			"unicode": "F2B9"
-		},
-		{
-			"name": "UserPause",
-			"unicode": "F2BA"
-		},
-		{
-			"name": "StreamingOff",
-			"unicode": "F2BB"
-		},
-		{
-			"name": "ArrowTallUpLeft",
-			"unicode": "F2BD"
-		}
-	]
+  "fontName": "fabric-icons-8",
+  "fontFamilyName": "FabricMDL2Icons-8",
+  "excludeGlyphs": false,
+  "chunkSubsets": true,
+  "hashFontFileName": true,
+  "subsetChunkSettings": {
+    "maxSubsetSize": 100
+  },
+  "glyphs": [
+    {
+      "name": "ViewListTree",
+      "unicode": "F249"
+    },
+    {
+      "name": "TriggerAuto",
+      "unicode": "F24A"
+    },
+    {
+      "name": "TriggerUser",
+      "unicode": "F24B"
+    },
+    {
+      "name": "PivotChart",
+      "unicode": "F24C"
+    },
+    {
+      "name": "StackedBarChart",
+      "unicode": "F24D"
+    },
+    {
+      "name": "StackedLineChart",
+      "unicode": "F24E"
+    },
+    {
+      "name": "BuildQueue",
+      "unicode": "F24F"
+    },
+    {
+      "name": "BuildQueueNew",
+      "unicode": "F250"
+    },
+    {
+      "name": "UserFollowed",
+      "unicode": "F25C"
+    },
+    {
+      "name": "VennDiagram",
+      "unicode": "F273"
+    },
+    {
+      "name": "FiveTileGrid",
+      "unicode": "F274"
+    },
+    {
+      "name": "FocalPoint",
+      "unicode": "F277"
+    },
+    {
+      "name": "TeamsLogoInverse",
+      "unicode": "F27A"
+    },
+    {
+      "name": "TeamsLogo",
+      "unicode": "F27B"
+    },
+    {
+      "name": "TeamsLogoFill",
+      "unicode": "F27C"
+    },
+    {
+      "name": "SkypeForBusinessLogoFill",
+      "unicode": "F27D"
+    },
+    {
+      "name": "SharepointLogo",
+      "unicode": "F27E"
+    },
+    {
+      "name": "SharepointLogoFill",
+      "unicode": "F27F"
+    },
+    {
+      "name": "DelveLogo",
+      "unicode": "F280"
+    },
+    {
+      "name": "DelveLogoFill",
+      "unicode": "F281"
+    },
+    {
+      "name": "OfficeVideoLogo",
+      "unicode": "F282"
+    },
+    {
+      "name": "OfficeVideoLogoFill",
+      "unicode": "F283"
+    },
+    {
+      "name": "ExchangeLogo",
+      "unicode": "F284"
+    },
+    {
+      "name": "ExchangeLogoFill",
+      "unicode": "F285"
+    },
+    {
+      "name": "DocumentApproval",
+      "unicode": "F28B"
+    },
+    {
+      "name": "CloneToDesktop",
+      "unicode": "F28C"
+    },
+    {
+      "name": "InstallToDrive",
+      "unicode": "F28D"
+    },
+    {
+      "name": "Blur",
+      "unicode": "F28E"
+    },
+    {
+      "name": "Build",
+      "unicode": "F28F"
+    },
+    {
+      "name": "ProcessMetaTask",
+      "unicode": "F290"
+    },
+    {
+      "name": "BranchFork2",
+      "unicode": "F291"
+    },
+    {
+      "name": "BranchLocked",
+      "unicode": "F292"
+    },
+    {
+      "name": "BranchCommit",
+      "unicode": "F293"
+    },
+    {
+      "name": "BranchCompare",
+      "unicode": "F294"
+    },
+    {
+      "name": "BranchMerge",
+      "unicode": "F295"
+    },
+    {
+      "name": "BranchPullRequest",
+      "unicode": "F296"
+    },
+    {
+      "name": "BranchSearch",
+      "unicode": "F297"
+    },
+    {
+      "name": "BranchShelveset",
+      "unicode": "F298"
+    },
+    {
+      "name": "RawSource",
+      "unicode": "F299"
+    },
+    {
+      "name": "MergeDuplicate",
+      "unicode": "F29A"
+    },
+    {
+      "name": "RowsGroup",
+      "unicode": "F29B"
+    },
+    {
+      "name": "RowsChild",
+      "unicode": "F29C"
+    },
+    {
+      "name": "Deploy",
+      "unicode": "F29D"
+    },
+    {
+      "name": "Redeploy",
+      "unicode": "F29E"
+    },
+    {
+      "name": "ServerEnviroment",
+      "unicode": "F29F"
+    },
+    {
+      "name": "Plug",
+      "unicode": "F300"
+    },
+    {
+      "name": "PlugSolid",
+      "unicode": "F301"
+    },
+    {
+      "name": "PlugConnected",
+      "unicode": "F302"
+    },
+    {
+      "name": "PlugDisconnected",
+      "unicode": "F303"
+    },
+    {
+      "name": "UnlockSolid",
+      "unicode": "F304"
+    },
+    {
+      "name": "Variable",
+      "unicode": "F305"
+    },
+    {
+      "name": "Parameter",
+      "unicode": "F306"
+    },
+    {
+      "name": "CommentUrgent",
+      "unicode": "F307"
+    },
+    {
+      "name": "Storyboard",
+      "unicode": "F308"
+    },
+    {
+      "name": "DiffInline",
+      "unicode": "F309"
+    },
+    {
+      "name": "DiffSideBySide",
+      "unicode": "F30A"
+    },
+    {
+      "name": "ImageDiff",
+      "unicode": "F30B"
+    },
+    {
+      "name": "ImagePixel",
+      "unicode": "F30C"
+    },
+    {
+      "name": "FileBug",
+      "unicode": "F30D"
+    },
+    {
+      "name": "FileCode",
+      "unicode": "F30E"
+    },
+    {
+      "name": "FileComment",
+      "unicode": "F30F"
+    },
+    {
+      "name": "FileImage",
+      "unicode": "F311"
+    },
+    {
+      "name": "FileSymlink",
+      "unicode": "F312"
+    },
+    {
+      "name": "AutoFillTemplate",
+      "unicode": "F313"
+    },
+    {
+      "name": "WorkItem",
+      "unicode": "F314"
+    },
+    {
+      "name": "WorkItemBug",
+      "unicode": "F315"
+    },
+    {
+      "name": "LogRemove",
+      "unicode": "F316"
+    },
+    {
+      "name": "ColumnOptions",
+      "unicode": "F317"
+    },
+    {
+      "name": "Packages",
+      "unicode": "F318"
+    },
+    {
+      "name": "BuildIssue",
+      "unicode": "F319"
+    },
+    {
+      "name": "AssessmentGroup",
+      "unicode": "F31A"
+    },
+    {
+      "name": "VariableGroup",
+      "unicode": "F31B"
+    },
+    {
+      "name": "FullHistory",
+      "unicode": "F31C"
+    },
+    {
+      "name": "BusinessHoursSign",
+      "unicode": "F310"
+    },
+    {
+      "name": "VisioDiagram",
+      "unicode": "F2A0"
+    },
+    {
+      "name": "HighlightMappedShapes",
+      "unicode": "F2A1"
+    },
+    {
+      "name": "TextCallout",
+      "unicode": "F2A2"
+    },
+    {
+      "name": "IconSetsFlag",
+      "unicode": "F2A4"
+    },
+    {
+      "name": "VisioLogo",
+      "unicode": "F2A7"
+    },
+    {
+      "name": "VisioLogoFill",
+      "unicode": "F2A8"
+    },
+    {
+      "name": "VisioDocument",
+      "unicode": "F2A9"
+    },
+    {
+      "name": "TimelineProgress",
+      "unicode": "F2AA"
+    },
+    {
+      "name": "TimelineDelivery",
+      "unicode": "F2AB"
+    },
+    {
+      "name": "Backlog",
+      "unicode": "F2AC"
+    },
+    {
+      "name": "TeamFavorite",
+      "unicode": "F2AD"
+    },
+    {
+      "name": "TaskGroup",
+      "unicode": "F2AE"
+    },
+    {
+      "name": "TaskGroupMirrored",
+      "unicode": "F2AF"
+    },
+    {
+      "name": "ScopeTemplate",
+      "unicode": "F2B0"
+    },
+    {
+      "name": "AssessmentGroupTemplate",
+      "unicode": "F2B1"
+    },
+    {
+      "name": "NewTeamProject",
+      "unicode": "F2B2"
+    },
+    {
+      "name": "CommentAdd",
+      "unicode": "F2B3"
+    },
+    {
+      "name": "CommentNext",
+      "unicode": "F2B4"
+    },
+    {
+      "name": "CommentPrevious",
+      "unicode": "F2B5"
+    },
+    {
+      "name": "ShopServer",
+      "unicode": "F2B6"
+    },
+    {
+      "name": "LocaleLanguage",
+      "unicode": "F2B7"
+    },
+    {
+      "name": "QueryList",
+      "unicode": "F2B8"
+    },
+    {
+      "name": "UserSync",
+      "unicode": "F2B9"
+    },
+    {
+      "name": "UserPause",
+      "unicode": "F2BA"
+    },
+    {
+      "name": "StreamingOff",
+      "unicode": "F2BB"
+    },
+    {
+      "name": "ArrowTallUpLeft",
+      "unicode": "F2BD"
+    }
+  ]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-9.json b/packages/icons/config/fabric-icons-9.json
index 05a1ed8ee8e13..c286705e82783 100644
--- a/packages/icons/config/fabric-icons-9.json
+++ b/packages/icons/config/fabric-icons-9.json
@@ -1,412 +1,412 @@
 {
-	"fontName": "fabric-icons-9",
-	"fontFamilyName": "FabricMDL2Icons-9",
-	"excludeGlyphs": false,
-	"chunkSubsets": true,
-	"hashFontFileName": true,
-	"subsetChunkSettings": {
-		"maxSubsetSize": 100
-	},
-	"glyphs": [
-		{
-			"name": "ArrowTallUpRight",
-			"unicode": "F2BE"
-		},
-		{
-			"name": "ArrowTallDownLeft",
-			"unicode": "F2BF"
-		},
-		{
-			"name": "ArrowTallDownRight",
-			"unicode": "F2C0"
-		},
-		{
-			"name": "FieldEmpty",
-			"unicode": "F2C1"
-		},
-		{
-			"name": "FieldFilled",
-			"unicode": "F2C2"
-		},
-		{
-			"name": "FieldChanged",
-			"unicode": "F2C3"
-		},
-		{
-			"name": "FieldNotChanged",
-			"unicode": "F2C4"
-		},
-		{
-			"name": "RingerOff",
-			"unicode": "F2C5"
-		},
-		{
-			"name": "PlayResume",
-			"unicode": "F2C6"
-		},
-		{
-			"name": "BulletedList2",
-			"unicode": "F2C7"
-		},
-		{
-			"name": "BulletedList2Mirrored",
-			"unicode": "F2C8"
-		},
-		{
-			"name": "ImageCrosshair",
-			"unicode": "F2C9"
-		},
-		{
-			"name": "GitGraph",
-			"unicode": "F2CA"
-		},
-		{
-			"name": "Repo",
-			"unicode": "F2CB"
-		},
-		{
-			"name": "RepoSolid",
-			"unicode": "F2CC"
-		},
-		{
-			"name": "FolderQuery",
-			"unicode": "F2CD"
-		},
-		{
-			"name": "FolderList",
-			"unicode": "F2CE"
-		},
-		{
-			"name": "FolderListMirrored",
-			"unicode": "F2CF"
-		},
-		{
-			"name": "LocationOutline",
-			"unicode": "F2D0"
-		},
-		{
-			"name": "POISolid",
-			"unicode": "F2D1"
-		},
-		{
-			"name": "CalculatorNotEqualTo",
-			"unicode": "F2D2"
-		},
-		{
-			"name": "BoxSubtractSolid",
-			"unicode": "F2D3"
-		},
-		{
-			"name": "BoxAdditionSolid",
-			"unicode": "F2D4"
-		},
-		{
-			"name": "BoxMultiplySolid",
-			"unicode": "F2D5"
-		},
-		{
-			"name": "BoxPlaySolid",
-			"unicode": "F2D6"
-		},
-		{
-			"name": "BoxCheckmarkSolid",
-			"unicode": "F2D7"
-		},
-		{
-			"name": "CirclePauseSolid",
-			"unicode": "F2D8"
-		},
-		{
-			"name": "CirclePause",
-			"unicode": "F2D9"
-		},
-		{
-			"name": "MSNVideosSolid",
-			"unicode": "F2DA"
-		},
-		{
-			"name": "CircleStopSolid",
-			"unicode": "F2DB"
-		},
-		{
-			"name": "CircleStop",
-			"unicode": "F2DC"
-		},
-		{
-			"name": "NavigateBack",
-			"unicode": "F2DD"
-		},
-		{
-			"name": "NavigateBackMirrored",
-			"unicode": "F2DE"
-		},
-		{
-			"name": "NavigateForward",
-			"unicode": "F2DF"
-		},
-		{
-			"name": "NavigateForwardMirrored",
-			"unicode": "F2E0"
-		},
-		{
-			"name": "UnknownSolid",
-			"unicode": "F2E1"
-		},
-		{
-			"name": "UnknownMirroredSolid",
-			"unicode": "F2E2"
-		},
-		{
-			"name": "CircleAddition",
-			"unicode": "F2E3"
-		},
-		{
-			"name": "CircleAdditionSolid",
-			"unicode": "F2E4"
-		},
-		{
-			"name": "FilePDB",
-			"unicode": "F2E5"
-		},
-		{
-			"name": "FileTemplate",
-			"unicode": "F2E6"
-		},
-		{
-			"name": "FileSQL",
-			"unicode": "F2E7"
-		},
-		{
-			"name": "FileJAVA",
-			"unicode": "F2E8"
-		},
-		{
-			"name": "FileASPX",
-			"unicode": "F2E9"
-		},
-		{
-			"name": "FileCSS",
-			"unicode": "F2EA"
-		},
-		{
-			"name": "FileSass",
-			"unicode": "F2EB"
-		},
-		{
-			"name": "FileLess",
-			"unicode": "F2EC"
-		},
-		{
-			"name": "FileHTML",
-			"unicode": "F2ED"
-		},
-		{
-			"name": "JavaScriptLanguage",
-			"unicode": "F2EE"
-		},
-		{
-			"name": "CSharpLanguage",
-			"unicode": "F2EF"
-		},
-		{
-			"name": "CSharp",
-			"unicode": "F2F0"
-		},
-		{
-			"name": "VisualBasicLanguage",
-			"unicode": "F2F1"
-		},
-		{
-			"name": "VB",
-			"unicode": "F2F2"
-		},
-		{
-			"name": "CPlusPlusLanguage",
-			"unicode": "F2F3"
-		},
-		{
-			"name": "CPlusPlus",
-			"unicode": "F2F4"
-		},
-		{
-			"name": "FSharpLanguage",
-			"unicode": "F2F5"
-		},
-		{
-			"name": "FSharp",
-			"unicode": "F2F6"
-		},
-		{
-			"name": "TypeScriptLanguage",
-			"unicode": "F2F7"
-		},
-		{
-			"name": "PythonLanguage",
-			"unicode": "F2F8"
-		},
-		{
-			"name": "PY",
-			"unicode": "F2F9"
-		},
-		{
-			"name": "CoffeeScript",
-			"unicode": "F2FA"
-		},
-		{
-			"name": "MarkDownLanguage",
-			"unicode": "F2FB"
-		},
-		{
-			"name": "FullWidth",
-			"unicode": "F2FE"
-		},
-		{
-			"name": "FullWidthEdit",
-			"unicode": "F2FF"
-		},
-		{
-			"name": "SingleColumnEdit",
-			"unicode": "F321"
-		},
-		{
-			"name": "DoubleColumnEdit",
-			"unicode": "F322"
-		},
-		{
-			"name": "TripleColumnEdit",
-			"unicode": "F323"
-		},
-		{
-			"name": "ColumnLeftTwoThirdsEdit",
-			"unicode": "F324"
-		},
-		{
-			"name": "ColumnRightTwoThirdsEdit",
-			"unicode": "F325"
-		},
-		{
-			"name": "StreamLogo",
-			"unicode": "F329"
-		},
-		{
-			"name": "AlertSolid",
-			"unicode": "F331"
-		},
-		{
-			"name": "MegaphoneSolid",
-			"unicode": "F332"
-		},
-		{
-			"name": "TaskSolid",
-			"unicode": "F333"
-		},
-		{
-			"name": "ConfigurationSolid",
-			"unicode": "F334"
-		},
-		{
-			"name": "BugSolid",
-			"unicode": "F335"
-		},
-		{
-			"name": "CrownSolid",
-			"unicode": "F336"
-		},
-		{
-			"name": "Trophy2Solid",
-			"unicode": "F337"
-		},
-		{
-			"name": "QuickNoteSolid",
-			"unicode": "F338"
-		},
-		{
-			"name": "ConstructionConeSolid",
-			"unicode": "F339"
-		},
-		{
-			"name": "PageListSolid",
-			"unicode": "F33A"
-		},
-		{
-			"name": "PageListMirroredSolid",
-			"unicode": "F33B"
-		},
-		{
-			"name": "StarburstSolid",
-			"unicode": "F33C"
-		},
-		{
-			"name": "ReadingModeSolid",
-			"unicode": "F33D"
-		},
-		{
-			"name": "SadSolid",
-			"unicode": "F33E"
-		},
-		{
-			"name": "HealthSolid",
-			"unicode": "F33F"
-		},
-		{
-			"name": "ShieldSolid",
-			"unicode": "F340"
-		},
-		{
-			"name": "GiftBoxSolid",
-			"unicode": "F341"
-		},
-		{
-			"name": "ShoppingCartSolid",
-			"unicode": "F342"
-		},
-		{
-			"name": "MailSolid",
-			"unicode": "F343"
-		},
-		{
-			"name": "ChatSolid",
-			"unicode": "F344"
-		},
-		{
-			"name": "RibbonSolid",
-			"unicode": "F345"
-		},
-		{
-			"name": "FinancialSolid",
-			"unicode": "F346"
-		},
-		{
-			"name": "FinancialMirroredSolid",
-			"unicode": "F347"
-		},
-		{
-			"name": "HeadsetSolid",
-			"unicode": "F348"
-		},
-		{
-			"name": "PermissionsSolid",
-			"unicode": "F349"
-		},
-		{
-			"name": "ParkingSolid",
-			"unicode": "F34A"
-		},
-		{
-			"name": "ParkingMirroredSolid",
-			"unicode": "F34B"
-		},
-		{
-			"name": "DiamondSolid",
-			"unicode": "F34C"
-		},
-		{
-			"name": "AsteriskSolid",
-			"unicode": "F34D"
-		},
-		{
-			"name": "OfflineStorageSolid",
-			"unicode": "F34E"
-		}
-	]
+  "fontName": "fabric-icons-9",
+  "fontFamilyName": "FabricMDL2Icons-9",
+  "excludeGlyphs": false,
+  "chunkSubsets": true,
+  "hashFontFileName": true,
+  "subsetChunkSettings": {
+    "maxSubsetSize": 100
+  },
+  "glyphs": [
+    {
+      "name": "ArrowTallUpRight",
+      "unicode": "F2BE"
+    },
+    {
+      "name": "ArrowTallDownLeft",
+      "unicode": "F2BF"
+    },
+    {
+      "name": "ArrowTallDownRight",
+      "unicode": "F2C0"
+    },
+    {
+      "name": "FieldEmpty",
+      "unicode": "F2C1"
+    },
+    {
+      "name": "FieldFilled",
+      "unicode": "F2C2"
+    },
+    {
+      "name": "FieldChanged",
+      "unicode": "F2C3"
+    },
+    {
+      "name": "FieldNotChanged",
+      "unicode": "F2C4"
+    },
+    {
+      "name": "RingerOff",
+      "unicode": "F2C5"
+    },
+    {
+      "name": "PlayResume",
+      "unicode": "F2C6"
+    },
+    {
+      "name": "BulletedList2",
+      "unicode": "F2C7"
+    },
+    {
+      "name": "BulletedList2Mirrored",
+      "unicode": "F2C8"
+    },
+    {
+      "name": "ImageCrosshair",
+      "unicode": "F2C9"
+    },
+    {
+      "name": "GitGraph",
+      "unicode": "F2CA"
+    },
+    {
+      "name": "Repo",
+      "unicode": "F2CB"
+    },
+    {
+      "name": "RepoSolid",
+      "unicode": "F2CC"
+    },
+    {
+      "name": "FolderQuery",
+      "unicode": "F2CD"
+    },
+    {
+      "name": "FolderList",
+      "unicode": "F2CE"
+    },
+    {
+      "name": "FolderListMirrored",
+      "unicode": "F2CF"
+    },
+    {
+      "name": "LocationOutline",
+      "unicode": "F2D0"
+    },
+    {
+      "name": "POISolid",
+      "unicode": "F2D1"
+    },
+    {
+      "name": "CalculatorNotEqualTo",
+      "unicode": "F2D2"
+    },
+    {
+      "name": "BoxSubtractSolid",
+      "unicode": "F2D3"
+    },
+    {
+      "name": "BoxAdditionSolid",
+      "unicode": "F2D4"
+    },
+    {
+      "name": "BoxMultiplySolid",
+      "unicode": "F2D5"
+    },
+    {
+      "name": "BoxPlaySolid",
+      "unicode": "F2D6"
+    },
+    {
+      "name": "BoxCheckmarkSolid",
+      "unicode": "F2D7"
+    },
+    {
+      "name": "CirclePauseSolid",
+      "unicode": "F2D8"
+    },
+    {
+      "name": "CirclePause",
+      "unicode": "F2D9"
+    },
+    {
+      "name": "MSNVideosSolid",
+      "unicode": "F2DA"
+    },
+    {
+      "name": "CircleStopSolid",
+      "unicode": "F2DB"
+    },
+    {
+      "name": "CircleStop",
+      "unicode": "F2DC"
+    },
+    {
+      "name": "NavigateBack",
+      "unicode": "F2DD"
+    },
+    {
+      "name": "NavigateBackMirrored",
+      "unicode": "F2DE"
+    },
+    {
+      "name": "NavigateForward",
+      "unicode": "F2DF"
+    },
+    {
+      "name": "NavigateForwardMirrored",
+      "unicode": "F2E0"
+    },
+    {
+      "name": "UnknownSolid",
+      "unicode": "F2E1"
+    },
+    {
+      "name": "UnknownMirroredSolid",
+      "unicode": "F2E2"
+    },
+    {
+      "name": "CircleAddition",
+      "unicode": "F2E3"
+    },
+    {
+      "name": "CircleAdditionSolid",
+      "unicode": "F2E4"
+    },
+    {
+      "name": "FilePDB",
+      "unicode": "F2E5"
+    },
+    {
+      "name": "FileTemplate",
+      "unicode": "F2E6"
+    },
+    {
+      "name": "FileSQL",
+      "unicode": "F2E7"
+    },
+    {
+      "name": "FileJAVA",
+      "unicode": "F2E8"
+    },
+    {
+      "name": "FileASPX",
+      "unicode": "F2E9"
+    },
+    {
+      "name": "FileCSS",
+      "unicode": "F2EA"
+    },
+    {
+      "name": "FileSass",
+      "unicode": "F2EB"
+    },
+    {
+      "name": "FileLess",
+      "unicode": "F2EC"
+    },
+    {
+      "name": "FileHTML",
+      "unicode": "F2ED"
+    },
+    {
+      "name": "JavaScriptLanguage",
+      "unicode": "F2EE"
+    },
+    {
+      "name": "CSharpLanguage",
+      "unicode": "F2EF"
+    },
+    {
+      "name": "CSharp",
+      "unicode": "F2F0"
+    },
+    {
+      "name": "VisualBasicLanguage",
+      "unicode": "F2F1"
+    },
+    {
+      "name": "VB",
+      "unicode": "F2F2"
+    },
+    {
+      "name": "CPlusPlusLanguage",
+      "unicode": "F2F3"
+    },
+    {
+      "name": "CPlusPlus",
+      "unicode": "F2F4"
+    },
+    {
+      "name": "FSharpLanguage",
+      "unicode": "F2F5"
+    },
+    {
+      "name": "FSharp",
+      "unicode": "F2F6"
+    },
+    {
+      "name": "TypeScriptLanguage",
+      "unicode": "F2F7"
+    },
+    {
+      "name": "PythonLanguage",
+      "unicode": "F2F8"
+    },
+    {
+      "name": "PY",
+      "unicode": "F2F9"
+    },
+    {
+      "name": "CoffeeScript",
+      "unicode": "F2FA"
+    },
+    {
+      "name": "MarkDownLanguage",
+      "unicode": "F2FB"
+    },
+    {
+      "name": "FullWidth",
+      "unicode": "F2FE"
+    },
+    {
+      "name": "FullWidthEdit",
+      "unicode": "F2FF"
+    },
+    {
+      "name": "SingleColumnEdit",
+      "unicode": "F321"
+    },
+    {
+      "name": "DoubleColumnEdit",
+      "unicode": "F322"
+    },
+    {
+      "name": "TripleColumnEdit",
+      "unicode": "F323"
+    },
+    {
+      "name": "ColumnLeftTwoThirdsEdit",
+      "unicode": "F324"
+    },
+    {
+      "name": "ColumnRightTwoThirdsEdit",
+      "unicode": "F325"
+    },
+    {
+      "name": "StreamLogo",
+      "unicode": "F329"
+    },
+    {
+      "name": "AlertSolid",
+      "unicode": "F331"
+    },
+    {
+      "name": "MegaphoneSolid",
+      "unicode": "F332"
+    },
+    {
+      "name": "TaskSolid",
+      "unicode": "F333"
+    },
+    {
+      "name": "ConfigurationSolid",
+      "unicode": "F334"
+    },
+    {
+      "name": "BugSolid",
+      "unicode": "F335"
+    },
+    {
+      "name": "CrownSolid",
+      "unicode": "F336"
+    },
+    {
+      "name": "Trophy2Solid",
+      "unicode": "F337"
+    },
+    {
+      "name": "QuickNoteSolid",
+      "unicode": "F338"
+    },
+    {
+      "name": "ConstructionConeSolid",
+      "unicode": "F339"
+    },
+    {
+      "name": "PageListSolid",
+      "unicode": "F33A"
+    },
+    {
+      "name": "PageListMirroredSolid",
+      "unicode": "F33B"
+    },
+    {
+      "name": "StarburstSolid",
+      "unicode": "F33C"
+    },
+    {
+      "name": "ReadingModeSolid",
+      "unicode": "F33D"
+    },
+    {
+      "name": "SadSolid",
+      "unicode": "F33E"
+    },
+    {
+      "name": "HealthSolid",
+      "unicode": "F33F"
+    },
+    {
+      "name": "ShieldSolid",
+      "unicode": "F340"
+    },
+    {
+      "name": "GiftBoxSolid",
+      "unicode": "F341"
+    },
+    {
+      "name": "ShoppingCartSolid",
+      "unicode": "F342"
+    },
+    {
+      "name": "MailSolid",
+      "unicode": "F343"
+    },
+    {
+      "name": "ChatSolid",
+      "unicode": "F344"
+    },
+    {
+      "name": "RibbonSolid",
+      "unicode": "F345"
+    },
+    {
+      "name": "FinancialSolid",
+      "unicode": "F346"
+    },
+    {
+      "name": "FinancialMirroredSolid",
+      "unicode": "F347"
+    },
+    {
+      "name": "HeadsetSolid",
+      "unicode": "F348"
+    },
+    {
+      "name": "PermissionsSolid",
+      "unicode": "F349"
+    },
+    {
+      "name": "ParkingSolid",
+      "unicode": "F34A"
+    },
+    {
+      "name": "ParkingMirroredSolid",
+      "unicode": "F34B"
+    },
+    {
+      "name": "DiamondSolid",
+      "unicode": "F34C"
+    },
+    {
+      "name": "AsteriskSolid",
+      "unicode": "F34D"
+    },
+    {
+      "name": "OfflineStorageSolid",
+      "unicode": "F34E"
+    }
+  ]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons.json b/packages/icons/config/fabric-icons.json
index ba4a5fa05291c..3135638f0bd45 100644
--- a/packages/icons/config/fabric-icons.json
+++ b/packages/icons/config/fabric-icons.json
@@ -1,228 +1,228 @@
 {
-	"fontName": "fabric-icons",
-	"fontFamilyName": "FabricMDL2Icons",
-	"excludeGlyphs": false,
-	"chunkSubsets": true,
-	"hashFontFileName": true,
-	"subsetChunkSettings": {
-		"maxSubsetSize": 100
-	},
-	"glyphs": [
-		{
-			"name": "GlobalNavButton",
-			"unicode": "E700"
-		},
-		{
-			"name": "ChevronDown",
-			"unicode": "E70D"
-		},
-		{
-			"name": "ChevronUp",
-			"unicode": "E70E"
-		},
-		{
-			"name": "Edit",
-			"unicode": "E70F"
-		},
-		{
-			"name": "Add",
-			"unicode": "E710"
-		},
-		{
-			"name": "Cancel",
-			"unicode": "E711"
-		},
-		{
-			"name": "More",
-			"unicode": "E712"
-		},
-		{
-			"name": "Settings",
-			"unicode": "E713"
-		},
-		{
-			"name": "Mail",
-			"unicode": "E715"
-		},
-		{
-			"name": "Filter",
-			"unicode": "E71C"
-		},
-		{
-			"name": "Search",
-			"unicode": "E721"
-		},
-		{
-			"name": "Share",
-			"unicode": "E72D"
-		},
-		{
-			"name": "FavoriteStar",
-			"unicode": "E734"
-		},
-		{
-			"name": "FavoriteStarFill",
-			"unicode": "E735"
-		},
-		{
-			"name": "CheckMark",
-			"unicode": "E73E"
-		},
-		{
-			"name": "Delete",
-			"unicode": "E74D"
-		},
-		{
-			"name": "ChevronLeft",
-			"unicode": "E76B"
-		},
-		{
-			"name": "ChevronRight",
-			"unicode": "E76C"
-		},
-		{
-			"name": "Calendar",
-			"unicode": "E787"
-		},
-		{
-			"name": "Undo",
-			"unicode": "E7A7"
-		},
-		{
-			"name": "Flag",
-			"unicode": "E7C1"
-		},
-		{
-			"name": "Page",
-			"unicode": "E7C3"
-		},
-		{
-			"name": "View",
-			"unicode": "E890"
-		},
-		{
-			"name": "Clear",
-			"unicode": "E894"
-		},
-		{
-			"name": "Download",
-			"unicode": "E896"
-		},
-		{
-			"name": "Upload",
-			"unicode": "E898"
-		},
-		{
-			"name": "Folder",
-			"unicode": "E8B7"
-		},
-		{
-			"name": "Sort",
-			"unicode": "E8CB"
-		},
-		{
-			"name": "AlignRight",
-			"unicode": "E8E2"
-		},
-		{
-			"name": "AlignLeft",
-			"unicode": "E8E4"
-		},
-		{
-			"name": "Tag",
-			"unicode": "E8EC"
-		},
-		{
-			"name": "AddFriend",
-			"unicode": "E8FA"
-		},
-		{
-			"name": "Info",
-			"unicode": "E946"
-		},
-		{
-			"name": "Pinned",
-			"unicode": "E840"
-		},
-		{
-			"name": "SortLines",
-			"unicode": "E9D0"
-		},
-		{
-			"name": "List",
-			"unicode": "EA37"
-		},
-		{
-			"name": "CircleRing",
-			"unicode": "EA3A"
-		},
-		{
-			"name": "Heart",
-			"unicode": "EB51"
-		},
-		{
-			"name": "HeartFill",
-			"unicode": "EB52"
-		},
-		{
-			"name": "Tiles",
-			"unicode": "ECA5"
-		},
-		{
-			"name": "Embed",
-			"unicode": "ECCE"
-		},
-		{
-			"name": "Ascending",
-			"unicode": "EDC0"
-		},
-		{
-			"name": "Descending",
-			"unicode": "EDC1"
-		},
-		{
-			"name": "SortUp",
-			"unicode": "EE68"
-		},
-		{
-			"name": "SortDown",
-			"unicode": "EE69"
-		},
-		{
-			"name": "SyncToPC",
-			"unicode": "EE6E"
-		},
-		{
-			"name": "LargeGrid",
-			"unicode": "EECB"
-		},
-		{
-			"name": "SkypeCheck",
-			"unicode": "EF80"
-		},
-		{
-			"name": "SkypeClock",
-			"unicode": "EF81"
-		},
-		{
-			"name": "SkypeMinus",
-			"unicode": "EF82"
-		},
-		{
-			"name": "ClearFilter",
-			"unicode": "EF8F"
-		},
-		{
-			"name": "Flow",
-			"unicode": "EF90"
-		},
-		{
-			"name": "StatusCircleCheckmark",
-			"unicode": "F13E"
-		},
-		{
-			"name": "MoreVertical",
-			"unicode": "F2BC"
-		}
-	]
+  "fontName": "fabric-icons",
+  "fontFamilyName": "FabricMDL2Icons",
+  "excludeGlyphs": false,
+  "chunkSubsets": true,
+  "hashFontFileName": true,
+  "subsetChunkSettings": {
+    "maxSubsetSize": 100
+  },
+  "glyphs": [
+    {
+      "name": "GlobalNavButton",
+      "unicode": "E700"
+    },
+    {
+      "name": "ChevronDown",
+      "unicode": "E70D"
+    },
+    {
+      "name": "ChevronUp",
+      "unicode": "E70E"
+    },
+    {
+      "name": "Edit",
+      "unicode": "E70F"
+    },
+    {
+      "name": "Add",
+      "unicode": "E710"
+    },
+    {
+      "name": "Cancel",
+      "unicode": "E711"
+    },
+    {
+      "name": "More",
+      "unicode": "E712"
+    },
+    {
+      "name": "Settings",
+      "unicode": "E713"
+    },
+    {
+      "name": "Mail",
+      "unicode": "E715"
+    },
+    {
+      "name": "Filter",
+      "unicode": "E71C"
+    },
+    {
+      "name": "Search",
+      "unicode": "E721"
+    },
+    {
+      "name": "Share",
+      "unicode": "E72D"
+    },
+    {
+      "name": "FavoriteStar",
+      "unicode": "E734"
+    },
+    {
+      "name": "FavoriteStarFill",
+      "unicode": "E735"
+    },
+    {
+      "name": "CheckMark",
+      "unicode": "E73E"
+    },
+    {
+      "name": "Delete",
+      "unicode": "E74D"
+    },
+    {
+      "name": "ChevronLeft",
+      "unicode": "E76B"
+    },
+    {
+      "name": "ChevronRight",
+      "unicode": "E76C"
+    },
+    {
+      "name": "Calendar",
+      "unicode": "E787"
+    },
+    {
+      "name": "Undo",
+      "unicode": "E7A7"
+    },
+    {
+      "name": "Flag",
+      "unicode": "E7C1"
+    },
+    {
+      "name": "Page",
+      "unicode": "E7C3"
+    },
+    {
+      "name": "View",
+      "unicode": "E890"
+    },
+    {
+      "name": "Clear",
+      "unicode": "E894"
+    },
+    {
+      "name": "Download",
+      "unicode": "E896"
+    },
+    {
+      "name": "Upload",
+      "unicode": "E898"
+    },
+    {
+      "name": "Folder",
+      "unicode": "E8B7"
+    },
+    {
+      "name": "Sort",
+      "unicode": "E8CB"
+    },
+    {
+      "name": "AlignRight",
+      "unicode": "E8E2"
+    },
+    {
+      "name": "AlignLeft",
+      "unicode": "E8E4"
+    },
+    {
+      "name": "Tag",
+      "unicode": "E8EC"
+    },
+    {
+      "name": "AddFriend",
+      "unicode": "E8FA"
+    },
+    {
+      "name": "Info",
+      "unicode": "E946"
+    },
+    {
+      "name": "Pinned",
+      "unicode": "E840"
+    },
+    {
+      "name": "SortLines",
+      "unicode": "E9D0"
+    },
+    {
+      "name": "List",
+      "unicode": "EA37"
+    },
+    {
+      "name": "CircleRing",
+      "unicode": "EA3A"
+    },
+    {
+      "name": "Heart",
+      "unicode": "EB51"
+    },
+    {
+      "name": "HeartFill",
+      "unicode": "EB52"
+    },
+    {
+      "name": "Tiles",
+      "unicode": "ECA5"
+    },
+    {
+      "name": "Embed",
+      "unicode": "ECCE"
+    },
+    {
+      "name": "Ascending",
+      "unicode": "EDC0"
+    },
+    {
+      "name": "Descending",
+      "unicode": "EDC1"
+    },
+    {
+      "name": "SortUp",
+      "unicode": "EE68"
+    },
+    {
+      "name": "SortDown",
+      "unicode": "EE69"
+    },
+    {
+      "name": "SyncToPC",
+      "unicode": "EE6E"
+    },
+    {
+      "name": "LargeGrid",
+      "unicode": "EECB"
+    },
+    {
+      "name": "SkypeCheck",
+      "unicode": "EF80"
+    },
+    {
+      "name": "SkypeClock",
+      "unicode": "EF81"
+    },
+    {
+      "name": "SkypeMinus",
+      "unicode": "EF82"
+    },
+    {
+      "name": "ClearFilter",
+      "unicode": "EF8F"
+    },
+    {
+      "name": "Flow",
+      "unicode": "EF90"
+    },
+    {
+      "name": "StatusCircleCheckmark",
+      "unicode": "F13E"
+    },
+    {
+      "name": "MoreVertical",
+      "unicode": "F2BC"
+    }
+  ]
 }
\ No newline at end of file
diff --git a/packages/icons/package.json b/packages/icons/package.json
index d47856c8a3012..79e2cdcbb0b7d 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -16,7 +16,6 @@
   "disabledTasks": [
     "sass",
     "karma",
-    "tslint",
     "jest"
   ],
   "devDependencies": {
diff --git a/packages/icons/src/fabric-icons-0.ts b/packages/icons/src/fabric-icons-0.ts
index 43a3a0c98a42e..2cc3634fbd374 100644
--- a/packages/icons/src/fabric-icons-0.ts
+++ b/packages/icons/src/fabric-icons-0.ts
@@ -20,7 +20,7 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-0"`,
-      src: `url('${baseUrl}fabric-icons-0-8a1666a2.woff') format('woff')`, 
+      src: `url('${baseUrl}fabric-icons-0-8a1666a2.woff') format('woff')`,
     },
     icons: {
       'DecreaseIndentLegacy': '\uE290',
diff --git a/packages/icons/src/fabric-icons-1.ts b/packages/icons/src/fabric-icons-1.ts
index 1fd73509f6c4c..165003f2f22b7 100644
--- a/packages/icons/src/fabric-icons-1.ts
+++ b/packages/icons/src/fabric-icons-1.ts
@@ -20,7 +20,7 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-1"`,
-      src: `url('${baseUrl}fabric-icons-1-a961c249.woff') format('woff')`, 
+      src: `url('${baseUrl}fabric-icons-1-a961c249.woff') format('woff')`,
     },
     icons: {
       'TVMonitor': '\uE7F4',
diff --git a/packages/icons/src/fabric-icons-11.ts b/packages/icons/src/fabric-icons-11.ts
index 49c7567e2b146..fe66a01899911 100644
--- a/packages/icons/src/fabric-icons-11.ts
+++ b/packages/icons/src/fabric-icons-11.ts
@@ -20,7 +20,7 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-11"`,
-      src: `url('${baseUrl}fabric-icons-11-c0dbf638.woff') format('woff')`, 
+      src: `url('${baseUrl}fabric-icons-11-c0dbf638.woff') format('woff')`,
     },
     icons: {
       'IRMReplyMirrored': '\uF41E',
diff --git a/packages/icons/src/fabric-icons-2.ts b/packages/icons/src/fabric-icons-2.ts
index 82e07752d6062..f04be16bff35a 100644
--- a/packages/icons/src/fabric-icons-2.ts
+++ b/packages/icons/src/fabric-icons-2.ts
@@ -20,7 +20,7 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-2"`,
-      src: `url('${baseUrl}fabric-icons-2-2be8dca9.woff') format('woff')`, 
+      src: `url('${baseUrl}fabric-icons-2-2be8dca9.woff') format('woff')`,
     },
     icons: {
       'Fingerprint': '\uE928',
diff --git a/packages/icons/src/fabric-icons-3.ts b/packages/icons/src/fabric-icons-3.ts
index f96d1a1b188f8..0758fa8440e7c 100644
--- a/packages/icons/src/fabric-icons-3.ts
+++ b/packages/icons/src/fabric-icons-3.ts
@@ -20,7 +20,7 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-3"`,
-      src: `url('${baseUrl}fabric-icons-3-80b6008d.woff') format('woff')`, 
+      src: `url('${baseUrl}fabric-icons-3-80b6008d.woff') format('woff')`,
     },
     icons: {
       'ErrorBadge': '\uEA39',
diff --git a/packages/icons/src/fabric-icons-4.ts b/packages/icons/src/fabric-icons-4.ts
index 576d1fa57fd0a..a27a0773ca31b 100644
--- a/packages/icons/src/fabric-icons-4.ts
+++ b/packages/icons/src/fabric-icons-4.ts
@@ -20,7 +20,7 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-4"`,
-      src: `url('${baseUrl}fabric-icons-4-46fbc7bc.woff') format('woff')`, 
+      src: `url('${baseUrl}fabric-icons-4-46fbc7bc.woff') format('woff')`,
     },
     icons: {
       'ReminderGroup': '\uEBF8',
diff --git a/packages/icons/src/fabric-icons-5.ts b/packages/icons/src/fabric-icons-5.ts
index 5e70202830ba0..b44a232cad394 100644
--- a/packages/icons/src/fabric-icons-5.ts
+++ b/packages/icons/src/fabric-icons-5.ts
@@ -20,7 +20,7 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-5"`,
-      src: `url('${baseUrl}fabric-icons-5-5bc71068.woff') format('woff')`, 
+      src: `url('${baseUrl}fabric-icons-5-5bc71068.woff') format('woff')`,
     },
     icons: {
       'SocialListeningLogo': '\uED7C',
diff --git a/packages/icons/src/fabric-icons-6.ts b/packages/icons/src/fabric-icons-6.ts
index 2fb007fa8bc5d..ce037afb76fa9 100644
--- a/packages/icons/src/fabric-icons-6.ts
+++ b/packages/icons/src/fabric-icons-6.ts
@@ -20,7 +20,7 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-6"`,
-      src: `url('${baseUrl}fabric-icons-6-328cd253.woff') format('woff')`, 
+      src: `url('${baseUrl}fabric-icons-6-328cd253.woff') format('woff')`,
     },
     icons: {
       'CalendarAgenda': '\uEE9A',
diff --git a/packages/icons/src/fabric-icons-7.ts b/packages/icons/src/fabric-icons-7.ts
index 0ceb925c52777..b94f854b4edfb 100644
--- a/packages/icons/src/fabric-icons-7.ts
+++ b/packages/icons/src/fabric-icons-7.ts
@@ -20,7 +20,7 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-7"`,
-      src: `url('${baseUrl}fabric-icons-7-1bae3315.woff') format('woff')`, 
+      src: `url('${baseUrl}fabric-icons-7-1bae3315.woff') format('woff')`,
     },
     icons: {
       'PageCheckedOut': '\uF02C',
diff --git a/packages/icons/src/fabric-icons-8.ts b/packages/icons/src/fabric-icons-8.ts
index a9cf815c15991..3f6eccbce7e3c 100644
--- a/packages/icons/src/fabric-icons-8.ts
+++ b/packages/icons/src/fabric-icons-8.ts
@@ -20,7 +20,7 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-8"`,
-      src: `url('${baseUrl}fabric-icons-8-bf5c8e0c.woff') format('woff')`, 
+      src: `url('${baseUrl}fabric-icons-8-bf5c8e0c.woff') format('woff')`,
     },
     icons: {
       'ViewListTree': '\uF249',
diff --git a/packages/icons/src/fabric-icons-9.ts b/packages/icons/src/fabric-icons-9.ts
index 291ace2dabd11..1304bf3541261 100644
--- a/packages/icons/src/fabric-icons-9.ts
+++ b/packages/icons/src/fabric-icons-9.ts
@@ -20,7 +20,7 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-9"`,
-      src: `url('${baseUrl}fabric-icons-9-a362212c.woff') format('woff')`, 
+      src: `url('${baseUrl}fabric-icons-9-a362212c.woff') format('woff')`,
     },
     icons: {
       'ArrowTallUpRight': '\uF2BE',
diff --git a/rush.json b/rush.json
index 76e7fdea0ff8c..93a2ebd4fa648 100644
--- a/rush.json
+++ b/rush.json
@@ -51,8 +51,7 @@
     {
       "packageName": "@uifabric/file-type-icons",
       "projectFolder": "packages/file-type-icons",
-      "versionPolicyName": "lockedMajor",
-      "shouldPublish": false
+      "shouldPublish": true
     },
     {
       "packageName": "@uifabric/icons",

From f87d8889321e89fc697985c43b88b2bfc3288994 Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Fri, 1 Dec 2017 18:24:08 -0800
Subject: [PATCH 1103/1641] Styling: Add API for callbacks when the theme
 changes (#3244)

* add event registration for theme changes

* change file

* add comments

* export the functions

* let to const, better comment

* add test

* code review feedback

* remove unnecessary return statement

* rush generate

* fix

* rush generate
---
 .../phkuo-getTheme_2017-10-27-00-39.json      |  11 +
 common/config/rush/npm-shrinkwrap.json        | 334 ++++++++----------
 packages/styling/jest.config.js               |   3 +
 packages/styling/package.json                 |   4 +-
 packages/styling/src/styles/index.ts          |   4 +-
 packages/styling/src/styles/theme.test.ts     |  42 +++
 packages/styling/src/styles/theme.ts          |  33 ++
 packages/styling/tsconfig.json                |   1 +
 8 files changed, 252 insertions(+), 180 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/phkuo-getTheme_2017-10-27-00-39.json
 create mode 100644 packages/styling/jest.config.js
 create mode 100644 packages/styling/src/styles/theme.test.ts

diff --git a/common/changes/@uifabric/styling/phkuo-getTheme_2017-10-27-00-39.json b/common/changes/@uifabric/styling/phkuo-getTheme_2017-10-27-00-39.json
new file mode 100644
index 0000000000000..3d5f9e432607d
--- /dev/null
+++ b/common/changes/@uifabric/styling/phkuo-getTheme_2017-10-27-00-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Add an event callback for when the theme changes.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 22a5617598fa1..0afdcd099a9d7 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -10,12 +10,12 @@
       "integrity": "sha1-6pn2EhtKjwZbTHH4VZXbJxRJiAc="
     },
     "@microsoft/api-extractor": {
-      "version": "4.3.3",
-      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-4.3.3.tgz",
-      "integrity": "sha1-gCOWb8fkEWRQAO37nbTxUi7mohA=",
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-4.3.1.tgz",
+      "integrity": "sha1-HbrVWbuiutL2df2cPofoVs8b+gI=",
       "requires": {
-        "@microsoft/node-core-library": "0.3.20",
-        "@microsoft/ts-command-line": "2.2.8",
+        "@microsoft/node-core-library": "0.3.18",
+        "@microsoft/ts-command-line": "2.2.6",
         "@types/fs-extra": "0.0.37",
         "@types/node": "6.0.88",
         "@types/z-schema": "3.16.31",
@@ -35,23 +35,23 @@
       }
     },
     "@microsoft/load-themed-styles": {
-      "version": "1.7.13",
-      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.13.tgz",
-      "integrity": "sha1-MDXG1hEg6uc2HSzJ1gXijQ0r+/s="
+      "version": "1.7.11",
+      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.11.tgz",
+      "integrity": "sha1-YXKmzjlXpMXG5mGNxhT5GOWc7D8="
     },
     "@microsoft/loader-load-themed-styles": {
-      "version": "1.6.8",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.6.8.tgz",
-      "integrity": "sha1-1Sfmgh5IhvijJdB//zQMweU7oQE=",
+      "version": "1.6.6",
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.6.6.tgz",
+      "integrity": "sha1-zZm/Ol89RvGMe/eMr6uRmMMOL90=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.13",
+        "@microsoft/load-themed-styles": "1.7.11",
         "loader-utils": "1.1.0"
       }
     },
     "@microsoft/node-core-library": {
-      "version": "0.3.20",
-      "resolved": "https://registry.npmjs.org/@microsoft/node-core-library/-/node-core-library-0.3.20.tgz",
-      "integrity": "sha1-bslI50IHwTwLeC7AqiraLjtIJ3g=",
+      "version": "0.3.18",
+      "resolved": "https://registry.npmjs.org/@microsoft/node-core-library/-/node-core-library-0.3.18.tgz",
+      "integrity": "sha1-7PxLJIqBT4ty7u4ondUuidMblMc=",
       "requires": {
         "@types/fs-extra": "0.0.37",
         "@types/node": "6.0.88",
@@ -69,9 +69,9 @@
       }
     },
     "@microsoft/ts-command-line": {
-      "version": "2.2.8",
-      "resolved": "https://registry.npmjs.org/@microsoft/ts-command-line/-/ts-command-line-2.2.8.tgz",
-      "integrity": "sha1-I1JBwoCu+9N6poLO6Gklwty4jMo=",
+      "version": "2.2.6",
+      "resolved": "https://registry.npmjs.org/@microsoft/ts-command-line/-/ts-command-line-2.2.6.tgz",
+      "integrity": "sha1-LgCJ56xnFz/PKQJplAwwao+gBGA=",
       "requires": {
         "@types/argparse": "1.0.33",
         "@types/node": "6.0.88",
@@ -88,13 +88,13 @@
     },
     "@rush-temp/build": {
       "version": "file:projects/build.tgz",
-      "integrity": "sha1-nMSDbjGC8Cye83wys//hsEEqEno=",
+      "integrity": "sha1-XpiTxVfrJ8tQX62qbk43XY/vpUY=",
       "requires": {
-        "@microsoft/api-extractor": "4.3.3",
-        "@microsoft/load-themed-styles": "1.7.13",
-        "@microsoft/loader-load-themed-styles": "1.6.8",
+        "@microsoft/api-extractor": "4.3.1",
+        "@microsoft/load-themed-styles": "1.7.11",
+        "@microsoft/loader-load-themed-styles": "1.6.6",
         "autoprefixer": "7.1.6",
-        "awesome-typescript-loader": "3.4.1",
+        "awesome-typescript-loader": "3.4.0",
         "bundlesize": "0.15.3",
         "chalk": "2.3.0",
         "command-line-args": "4.0.7",
@@ -116,12 +116,12 @@
         "sinon": "4.1.2",
         "source-map-loader": "0.2.3",
         "style-loader": "0.18.2",
-        "ts-jest": "21.2.4",
+        "ts-jest": "21.2.3",
         "tslint": "5.8.0",
         "tslint-microsoft-contrib": "5.0.1",
         "typescript": "2.6.2",
         "uglifyjs-webpack-plugin": "0.4.6",
-        "webpack": "3.9.1",
+        "webpack": "3.8.1",
         "webpack-bundle-analyzer": "2.9.1",
         "webpack-dev-server": "2.9.5",
         "webpack-notifier": "1.5.0",
@@ -137,7 +137,7 @@
     },
     "@rush-temp/example-app-base": {
       "version": "file:projects/example-app-base.tgz",
-      "integrity": "sha1-9o89m7muZZgHErkd80k+9DiS/8s=",
+      "integrity": "sha1-9PS/QcIwhN7giKPF5D43WMy4IQM=",
       "requires": {
         "@types/chai": "3.4.35",
         "@types/enzyme": "2.8.8",
@@ -153,7 +153,7 @@
         "es6-promise": "4.1.1",
         "es6-weak-map": "2.0.2",
         "highlight.js": "9.12.0",
-        "office-ui-fabric-react": "5.29.0",
+        "office-ui-fabric-react": "5.27.0",
         "react": "15.6.2",
         "react-addons-test-utils": "15.6.2",
         "react-dom": "15.6.2",
@@ -162,9 +162,9 @@
     },
     "@rush-temp/experiments": {
       "version": "file:projects/experiments.tgz",
-      "integrity": "sha1-QXSCDFLj/b6LPVZaRfW5H18lnRg=",
+      "integrity": "sha1-I2dqZ7zbQsTon4Tsgu0yOgx4oWw=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.13",
+        "@microsoft/load-themed-styles": "1.7.11",
         "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
         "@types/jest": "21.1.8",
@@ -211,9 +211,9 @@
     },
     "@rush-temp/fabric-website": {
       "version": "file:projects/fabric-website.tgz",
-      "integrity": "sha1-Uw4Hegz896ixYgbVafsoVNizB2o=",
+      "integrity": "sha1-rY4EuxJTdhsO+of/Zmqzl8S2/NU=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.13",
+        "@microsoft/load-themed-styles": "1.7.11",
         "@types/chai": "3.4.35",
         "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
@@ -239,24 +239,16 @@
         "write-file-webpack-plugin": "4.2.0"
       }
     },
-    "@rush-temp/file-type-icons": {
-      "version": "file:projects/file-type-icons.tgz",
-      "integrity": "sha1-B8pHXaU/+oD4rBA2qKH7yAILZMo=",
-      "requires": {
-        "@types/react": "15.6.7",
-        "tslib": "1.8.0"
-      }
-    },
     "@rush-temp/icons": {
       "version": "file:projects/icons.tgz",
-      "integrity": "sha1-SGY6v3K+Ct55YMnernNFRuDmZvg=",
+      "integrity": "sha1-2nEDGbwwqJG3pVIU9lbchpuhLnI=",
       "requires": {
         "tslib": "1.8.0"
       }
     },
     "@rush-temp/jest-serializer-merge-styles": {
       "version": "file:projects/jest-serializer-merge-styles.tgz",
-      "integrity": "sha1-bBBOwfa2xrx38a3x0lU5QsJbWIc=",
+      "integrity": "sha1-JTLTHGH61B5mdJjTPT/vSYP6JPQ=",
       "requires": {
         "@types/jest": "21.1.0"
       },
@@ -270,7 +262,7 @@
     },
     "@rush-temp/merge-styles": {
       "version": "file:projects/merge-styles.tgz",
-      "integrity": "sha1-t8hRjzlJTGA4LL2qqSdRAw4j/+I=",
+      "integrity": "sha1-N/0gN2hPPIL5uMWNlRy4kquxu9c=",
       "requires": {
         "@types/jest": "21.1.0",
         "tslib": "1.8.0"
@@ -285,9 +277,9 @@
     },
     "@rush-temp/office-ui-fabric-react": {
       "version": "file:projects/office-ui-fabric-react.tgz",
-      "integrity": "sha1-PYhloR78iKYbYc9d+TPp+n4Y8TY=",
+      "integrity": "sha1-tT9G96ICPXiOe4wV/j7nkIx2v/E=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.13",
+        "@microsoft/load-themed-styles": "1.7.11",
         "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
         "@types/jest": "21.1.0",
@@ -351,16 +343,16 @@
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
       "version": "file:projects/office-ui-fabric-react-tslint.tgz",
-      "integrity": "sha1-TrgcWpuFzjveWzdOEK/wBI74SnU=",
+      "integrity": "sha1-Q+2D1Bv2MtLvBvFsMYPILkwkUeY=",
       "requires": {
         "tslint-react": "3.2.0"
       }
     },
     "@rush-temp/ssr-tests": {
       "version": "file:projects/ssr-tests.tgz",
-      "integrity": "sha1-C9z9G/IhqjVrdH/Dm9Bpc2tLSxk=",
+      "integrity": "sha1-cgcOS/4MV3++w6huOUxEIHuhl8M=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.13",
+        "@microsoft/load-themed-styles": "1.7.11",
         "@types/chai": "3.4.35",
         "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
@@ -372,16 +364,17 @@
         "react": "15.6.2",
         "react-dom": "15.6.2",
         "tslib": "1.8.0",
-        "webpack": "3.9.1"
+        "webpack": "3.8.1"
       }
     },
     "@rush-temp/styling": {
       "version": "file:projects/styling.tgz",
-      "integrity": "sha1-HwNbNWjdl3zolsK+vQmTFI7a+xE=",
+      "integrity": "sha1-KqHoAUHACIxxQEUTyefVlGw1VWg=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.13",
+        "@microsoft/load-themed-styles": "1.7.11",
         "@types/chai": "3.4.35",
         "@types/enzyme": "2.8.8",
+        "@types/jest": "21.1.0",
         "@types/mocha": "2.2.39",
         "@types/react": "15.6.7",
         "@types/webpack-env": "1.13.0",
@@ -390,11 +383,18 @@
         "react": "15.6.2",
         "react-dom": "15.6.2",
         "tslib": "1.8.0"
+      },
+      "dependencies": {
+        "@types/jest": {
+          "version": "21.1.0",
+          "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.0.tgz",
+          "integrity": "sha512-7W+tgzauU0s467L7SG1GuHKr4jOmMTXOvR78LP6/YfuaM8JNRF+ayV2+vmNmlaBhbNPvckeJfak2aP+7VJ3g5A=="
+        }
       }
     },
     "@rush-temp/test-bundle-button": {
       "version": "file:projects/test-bundle-button.tgz",
-      "integrity": "sha1-l9VOGQr12cSwkMFc68x3OG7tMpk=",
+      "integrity": "sha1-QBxJIh6t5W3SnHvBcv9DAKY8y14=",
       "requires": {
         "@types/prop-types": "15.5.1",
         "@types/react": "15.6.7",
@@ -407,9 +407,9 @@
     },
     "@rush-temp/todo-app": {
       "version": "file:projects/todo-app.tgz",
-      "integrity": "sha1-ZzZy0oxgjohXwO+ADZJKRSFJvmY=",
+      "integrity": "sha1-d4y/mihiJri3d59Qo3VC8UmckHo=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.13",
+        "@microsoft/load-themed-styles": "1.7.11",
         "@types/chai": "3.4.35",
         "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
@@ -427,9 +427,9 @@
     },
     "@rush-temp/utilities": {
       "version": "file:projects/utilities.tgz",
-      "integrity": "sha1-0jI2G4YutJEdycmmeSuFbRBazeE=",
+      "integrity": "sha1-4Y87ZI3UBiw+0oRX2l70mfRlFLs=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.13",
+        "@microsoft/load-themed-styles": "1.7.11",
         "@types/enzyme": "2.8.8",
         "@types/jest": "21.1.0",
         "@types/prop-types": "15.5.1",
@@ -473,14 +473,14 @@
     },
     "@rush-temp/vr-tests": {
       "version": "file:projects/vr-tests.tgz",
-      "integrity": "sha1-5BzgZTYKPTyqFgcUpxhILc7fjKQ=",
+      "integrity": "sha1-RkxpzzslcFoclOx6PmJHgxyegDI=",
       "requires": {
         "@storybook/addon-options": "3.2.3",
         "@storybook/react": "3.2.16",
         "@types/react": "15.6.7",
         "@types/react-dom": "15.5.6",
         "@types/storybook__react": "3.0.5",
-        "awesome-typescript-loader": "3.4.1",
+        "awesome-typescript-loader": "3.4.0",
         "css-loader": "0.27.3",
         "file-loader": "0.11.1",
         "postcss-loader": "1.3.3",
@@ -549,7 +549,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -672,7 +672,7 @@
         "@storybook/addons": "3.2.16",
         "@storybook/channel-postmessage": "3.2.16",
         "@storybook/ui": "3.2.16",
-        "airbnb-js-shims": "1.4.0",
+        "airbnb-js-shims": "1.3.0",
         "autoprefixer": "7.1.6",
         "babel-core": "6.26.0",
         "babel-loader": "7.1.2",
@@ -715,7 +715,7 @@
         "url-loader": "0.6.2",
         "util-deprecate": "1.0.2",
         "uuid": "3.1.0",
-        "webpack": "3.9.1",
+        "webpack": "3.8.1",
         "webpack-dev-middleware": "1.12.2",
         "webpack-hot-middleware": "2.21.0"
       },
@@ -795,7 +795,7 @@
         "qs": "6.5.1",
         "react-icons": "2.2.7",
         "react-inspector": "2.2.1",
-        "react-modal": "3.1.6",
+        "react-modal": "3.1.5",
         "react-split-pane": "0.1.71",
         "react-treebeard": "2.1.0",
         "redux": "3.7.2"
@@ -927,29 +927,29 @@
       "integrity": "sha1-LrHQCl5Ow/pYx2r94S4YK2bcXBw="
     },
     "@uifabric/icons": {
-      "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.3.0.tgz",
-      "integrity": "sha512-3jh++ktFidYimHCnnJLMAFHbVvCLABTrU1ikii5FmfdqYpwYL5mOBdRgyCBCAUcQn+w3fXfn+TREM5PXa2Ihzg==",
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.2.0.tgz",
+      "integrity": "sha512-P5kfPej/wxgR8jZt/GqnU0FqYcz+JH1iCcaaYd6p9L3opmZtu4w5duKeqs+Bc1u7K16r800EQfLgKe76rt6AuA==",
       "requires": {
-        "@uifabric/styling": "5.12.1",
+        "@uifabric/styling": "5.11.1",
         "tslib": "1.8.0"
       }
     },
     "@uifabric/merge-styles": {
-      "version": "5.8.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.8.0.tgz",
-      "integrity": "sha512-stjicZel1v/+8KUaxeN8RhGsCvOVcrjr0cVNDlp52IMnTYQqMmAlFUwQfdiDrqiz3T7HEoKxnSSfLFaX3Df9Aw==",
+      "version": "5.7.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.7.0.tgz",
+      "integrity": "sha512-hS8tvkYk48JTkpKfoIF+kUP/ZefDteBjo7UKd2CLTO1eB+hLEUyKQtUEuiNlfi28cuZ/nracoK/lg7PN+Yv0YA==",
       "requires": {
         "tslib": "1.8.0"
       }
     },
     "@uifabric/styling": {
-      "version": "5.12.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.12.1.tgz",
-      "integrity": "sha512-TyORTKaRxj99JfNx/lrZCGZiBa1zIb5jNAVeWILPl2igOOvJKKcP9Wbz864ZhIrf2QQgTf+ZRkwQ6OjkKI/6Vg==",
+      "version": "5.11.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.11.1.tgz",
+      "integrity": "sha512-oTXOjL0l8Ozuk/qeqMM/T+73nRvcXrhuOFoNuoTpNLIiv1PvuEapAd/kJaKA4p5HW70KeZa/CJVNonWBqU2qww==",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.13",
-        "@uifabric/merge-styles": "5.8.0",
+        "@microsoft/load-themed-styles": "1.7.11",
+        "@uifabric/merge-styles": "5.7.0",
         "@uifabric/utilities": "5.5.0",
         "tslib": "1.8.0"
       }
@@ -959,8 +959,8 @@
       "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.5.0.tgz",
       "integrity": "sha512-+U5gM9s9ue1zKYXlguzOHMl/NSYNvPZre7/LLH5RLfrBYJwkddUZ5AOFDD3xRT6nwpRhb5fPSJaJldAakFVY8Q==",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.13",
-        "@uifabric/merge-styles": "5.8.0",
+        "@microsoft/load-themed-styles": "1.7.11",
+        "@uifabric/merge-styles": "5.7.0",
         "prop-types": "15.6.0",
         "tslib": "1.8.0"
       }
@@ -1022,13 +1022,11 @@
       }
     },
     "airbnb-js-shims": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/airbnb-js-shims/-/airbnb-js-shims-1.4.0.tgz",
-      "integrity": "sha512-KIlW3epMtB1x3PtJr2L7ltkoYvuKzjqrgZPq6mzJUL6Gz+3Y2Oc9FS9ZRzRWym2/jk1r+JsDOOyS2Vavc0E3Pw==",
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/airbnb-js-shims/-/airbnb-js-shims-1.3.0.tgz",
+      "integrity": "sha512-Y/9jgf3uEdNyeWPUV1N49FowM/qMIiKSTkRUpYT4jpHkSADfTiRVwI8Mm6o4CIxhnBK1uMf4RIYNYKwwILMCAQ==",
       "requires": {
         "array-includes": "3.0.3",
-        "array.prototype.flatmap": "1.1.1",
-        "array.prototype.flatten": "1.1.1",
         "es5-shim": "4.5.9",
         "es6-shim": "0.35.3",
         "function.prototype.name": "1.0.3",
@@ -1307,26 +1305,6 @@
       "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.3.2.tgz",
       "integrity": "sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg="
     },
-    "array.prototype.flatmap": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/array.prototype.flatmap/-/array.prototype.flatmap-1.1.1.tgz",
-      "integrity": "sha512-LYxij5OIk/e1wxCPu0Ng1Rtqpe3c1FmfQ/uS/2HGk9GfySnzEpJ4N8eKJgnTCI3PSBBsNNwbUORetjs7B+3oLA==",
-      "requires": {
-        "define-properties": "1.1.2",
-        "es-abstract": "1.10.0",
-        "function-bind": "1.1.1"
-      }
-    },
-    "array.prototype.flatten": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/array.prototype.flatten/-/array.prototype.flatten-1.1.1.tgz",
-      "integrity": "sha512-9DM+ZgShl2O01ERvRiEqljn+UAOn5yUwvfdrhM/NBLxuh98+MN/6SyBpvIpJBA0UcUuayRl/5BhmZ4TyjlHqyg==",
-      "requires": {
-        "define-properties": "1.1.2",
-        "es-abstract": "1.10.0",
-        "function-bind": "1.1.1"
-      }
-    },
     "arrify": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz",
@@ -1419,7 +1397,7 @@
       "integrity": "sha512-C9yv/UF3X+eJTi/zvfxuyfxmLibYrntpF3qoJYrMeQwgUJOZrZvpJiMG2FMQ3qnhWtF/be4pYONBBw95ZGe3vA==",
       "requires": {
         "browserslist": "2.9.1",
-        "caniuse-lite": "1.0.30000777",
+        "caniuse-lite": "1.0.30000775",
         "normalize-range": "0.1.2",
         "num2fraction": "1.2.2",
         "postcss": "6.0.14",
@@ -1427,9 +1405,9 @@
       }
     },
     "awesome-typescript-loader": {
-      "version": "3.4.1",
-      "resolved": "https://registry.npmjs.org/awesome-typescript-loader/-/awesome-typescript-loader-3.4.1.tgz",
-      "integrity": "sha512-fYxBtN6s4Dm6vtsROWi8IQ4I+KcmwRWePAVvhI06mFcHbtHfZopOs4qGNu9LyCPEw403LDROKFA+NVV6ig5yNw==",
+      "version": "3.4.0",
+      "resolved": "https://registry.npmjs.org/awesome-typescript-loader/-/awesome-typescript-loader-3.4.0.tgz",
+      "integrity": "sha512-sXPUe8HexKO4/NGTOtFP7ue+LbaALphiP22A8FaJCZT2avTtMQj3uVtrPRIvNf/6484i8rgx9d//jewiaqFH0w==",
       "requires": {
         "colors": "1.1.2",
         "enhanced-resolve": "3.3.0",
@@ -2987,7 +2965,7 @@
       "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.9.1.tgz",
       "integrity": "sha512-3n3nPdbUqn3nWmsy4PeSQthz2ja1ndpoXta+dwFFNhveGjMg6FXpWYe12vsTpNoXJbzx3j7GZXdtoVIdvh3JbA==",
       "requires": {
-        "caniuse-lite": "1.0.30000777",
+        "caniuse-lite": "1.0.30000775",
         "electron-to-chromium": "1.3.27"
       }
     },
@@ -3115,7 +3093,7 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw=",
       "requires": {
         "browserslist": "1.7.7",
-        "caniuse-db": "1.0.30000777",
+        "caniuse-db": "1.0.30000775",
         "lodash.memoize": "4.1.2",
         "lodash.uniq": "4.5.0"
       },
@@ -3125,21 +3103,21 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000777",
+            "caniuse-db": "1.0.30000775",
             "electron-to-chromium": "1.3.27"
           }
         }
       }
     },
     "caniuse-db": {
-      "version": "1.0.30000777",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000777.tgz",
-      "integrity": "sha1-LhmtumO918UB32N6hirerX9LwFQ="
+      "version": "1.0.30000775",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000775.tgz",
+      "integrity": "sha1-BLzN0CFO3yW5f2GglmCfetaQQzM="
     },
     "caniuse-lite": {
-      "version": "1.0.30000777",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000777.tgz",
-      "integrity": "sha1-McGKSozUl4LrswXI6Kk+azs+TxM="
+      "version": "1.0.30000775",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000775.tgz",
+      "integrity": "sha1-dNJ/7dxH88hM+8sTDDCSo168LeI="
     },
     "cardinal": {
       "version": "1.0.0",
@@ -3363,7 +3341,7 @@
       "resolved": "https://registry.npmjs.org/cli-usage/-/cli-usage-0.1.4.tgz",
       "integrity": "sha1-fAHg3HBsI0s5yTODjI4gshdXduI=",
       "requires": {
-        "marked": "0.3.7",
+        "marked": "0.3.6",
         "marked-terminal": "1.7.0"
       }
     },
@@ -3908,7 +3886,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -4076,7 +4054,7 @@
           "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ=",
           "requires": {
             "browserslist": "1.7.7",
-            "caniuse-db": "1.0.30000777",
+            "caniuse-db": "1.0.30000775",
             "normalize-range": "0.1.2",
             "num2fraction": "1.2.2",
             "postcss": "5.2.18",
@@ -4088,7 +4066,7 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000777",
+            "caniuse-db": "1.0.30000775",
             "electron-to-chromium": "1.3.27"
           }
         },
@@ -4122,7 +4100,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -6387,13 +6365,13 @@
       "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-1.0.0.tgz",
       "integrity": "sha1-ZHdYK4IU1gI0YJRWcAO+ip6sBNw=",
       "requires": {
-        "is-path-inside": "1.0.1"
+        "is-path-inside": "1.0.0"
       }
     },
     "is-path-inside": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-1.0.1.tgz",
-      "integrity": "sha1-jvW33lBDej/cprToZe96pVy0gDY=",
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-1.0.0.tgz",
+      "integrity": "sha1-/AbloWg/vaE95mev9xe7wQpI838=",
       "requires": {
         "path-is-inside": "1.0.2"
       }
@@ -7239,9 +7217,9 @@
       }
     },
     "js-base64": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.4.0.tgz",
-      "integrity": "sha512-Wehd+7Pf9tFvGb+ydPm9TjYjV8X1YHOVyG8QyELZxEMqOhemVwGRmoG8iQ/soqI3n8v4xn59zaLxiCJiaaRzKA=="
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.3.2.tgz",
+      "integrity": "sha512-Y2/+DnfJJXT1/FCwUebUhLWb3QihxiSC42+ctHLGogmW2jPY6LCapMdFZXRvVP2z6qyKW7s6qncE/9gSqZiArw=="
     },
     "js-tokens": {
       "version": "3.0.2",
@@ -7371,9 +7349,9 @@
       "integrity": "sha1-2ouEvUfeU5WHj5XWTQLyRJ/gXms="
     },
     "kind-of": {
-      "version": "6.0.2",
-      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.2.tgz",
-      "integrity": "sha512-s5kLOcnH0XqDO+FvuaLX8DDjZ18CGFk7VygH40QoKPUQhW4e2rvM0rwUq0t8IQDOwYSeLK01U90OjzBTme2QqA=="
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.1.tgz",
+      "integrity": "sha512-y/15y6w31q9eVnXhVLPQkI7MD6JyuPNqEnetl8bZEc+mngLuonHQJ0x/6BD1WX6ml0Ig/psUlyKZJxz8uUo1xQ=="
     },
     "klaw": {
       "version": "1.3.1",
@@ -7773,9 +7751,9 @@
       }
     },
     "marked": {
-      "version": "0.3.7",
-      "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.7.tgz",
-      "integrity": "sha512-zBEP4qO1YQp5aXHt8S5wTiOv9i2X74V/LQL0zhUNvVaklt6Ywa6lChxIvS+ibYlCGgADwKwZFhjC3+XfpsvQvQ=="
+      "version": "0.3.6",
+      "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.6.tgz",
+      "integrity": "sha1-ssbGGPzOzk74bE/Gy4p8v1rtqNc="
     },
     "marked-terminal": {
       "version": "1.7.0",
@@ -7982,7 +7960,7 @@
         "extend-shallow": "2.0.1",
         "extglob": "2.0.2",
         "fragment-cache": "0.2.1",
-        "kind-of": "6.0.2",
+        "kind-of": "6.0.1",
         "nanomatch": "1.2.6",
         "object.pick": "1.3.0",
         "regex-not": "1.0.0",
@@ -8791,14 +8769,14 @@
       "integrity": "sha1-XaNUX43wnxcsbDzXcoj02U1eB88="
     },
     "office-ui-fabric-react": {
-      "version": "5.29.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.29.0.tgz",
-      "integrity": "sha512-yh9J9FtCivK8VLZuLgPN7A44F9lisJG2/wHbbpDjlgaAUBBifqaB8zi4eSA0/fdWHe8KUiWjiSGweGwLulS8Yw==",
-      "requires": {
-        "@microsoft/load-themed-styles": "1.7.13",
-        "@uifabric/icons": "5.3.0",
-        "@uifabric/merge-styles": "5.8.0",
-        "@uifabric/styling": "5.12.1",
+      "version": "5.27.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.27.0.tgz",
+      "integrity": "sha512-qrh/rZncfvYO38HGR27ctVx2Y315ScAnMyQwzJI7LNg/F5Zx/LjEM14/02iYtPzCGKd9VGsho0kqMIxIBuu3hQ==",
+      "requires": {
+        "@microsoft/load-themed-styles": "1.7.11",
+        "@uifabric/icons": "5.2.0",
+        "@uifabric/merge-styles": "5.7.0",
+        "@uifabric/styling": "5.11.1",
         "@uifabric/utilities": "5.5.0",
         "prop-types": "15.6.0",
         "tslib": "1.8.0"
@@ -9244,7 +9222,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9309,7 +9287,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9373,7 +9351,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9436,7 +9414,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9499,7 +9477,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9562,7 +9540,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9625,7 +9603,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9689,7 +9667,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9753,7 +9731,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9866,7 +9844,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9929,7 +9907,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9971,7 +9949,7 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000777",
+            "caniuse-db": "1.0.30000775",
             "electron-to-chromium": "1.3.27"
           }
         },
@@ -10005,7 +9983,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10075,7 +10053,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10139,7 +10117,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10205,7 +10183,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10271,7 +10249,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10380,7 +10358,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10446,7 +10424,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10510,7 +10488,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10574,7 +10552,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10637,7 +10615,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10702,7 +10680,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10778,7 +10756,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10843,7 +10821,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10913,7 +10891,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.3.2",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -11266,13 +11244,12 @@
       }
     },
     "react-modal": {
-      "version": "3.1.6",
-      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.1.6.tgz",
-      "integrity": "sha512-4YKuBE4RMp9P+wqNeK68kQ4Q8Y8x6v3U9xrsRk2DOgWMOyf0GH5gZX841BcTlRxrZFgIKbW5n6hhOL5n4Du4tA==",
+      "version": "3.1.5",
+      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.1.5.tgz",
+      "integrity": "sha512-EjM32L9JPVibJJgu22QySo9d+tl0POaRTmuM7LmsVkx0U+G9tl4LGLrs2DLNOQp0Oko/5nEF/Rwp/h2noucMAw==",
       "requires": {
         "exenv": "1.2.2",
-        "prop-types": "15.6.0",
-        "warning": "3.0.0"
+        "prop-types": "15.6.0"
       }
     },
     "react-remarkable": {
@@ -12571,7 +12548,7 @@
       "resolved": "https://registry.npmjs.org/scss-tokenizer/-/scss-tokenizer-0.2.3.tgz",
       "integrity": "sha1-jrBtualyMzOCTT9VMGQRSYR85dE=",
       "requires": {
-        "js-base64": "2.4.0",
+        "js-base64": "2.3.2",
         "source-map": "0.4.4"
       },
       "dependencies": {
@@ -13744,9 +13721,9 @@
       }
     },
     "ts-jest": {
-      "version": "21.2.4",
-      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-21.2.4.tgz",
-      "integrity": "sha512-Plk49Us+DcncpQcC8fhYwDUdhW96QB0Dv02etOLhzq+2HAvXfrEUys3teZ/BeyQ+r1rHxfGdNj4dB0Q5msZR3g==",
+      "version": "21.2.3",
+      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-21.2.3.tgz",
+      "integrity": "sha512-/gpl/RUPJMVZmERi360sKu5wzSriAg20HMRZsNgXY7sUWtmSn3iPxQcCBDUi2bmcRPtPOLTSijzWK3ZrlYkUhA==",
       "requires": {
         "babel-core": "6.26.0",
         "babel-plugin-istanbul": "4.1.5",
@@ -13755,6 +13732,7 @@
         "cpx": "1.5.0",
         "fs-extra": "4.0.2",
         "jest-config": "21.2.1",
+        "jest-util": "21.2.1",
         "pkg-dir": "2.0.0",
         "source-map-support": "0.5.0",
         "yargs": "10.0.3"
@@ -14327,9 +14305,9 @@
       "integrity": "sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg=="
     },
     "webpack": {
-      "version": "3.9.1",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-3.9.1.tgz",
-      "integrity": "sha512-jONJ0l8nqgiQVkqs15O9TFWLozbFkCgVodVrBXBK/PIBFeGkaOGo30Ov57iQqYRwAWNDM5vyLPZYmAIpPa5QSw==",
+      "version": "3.8.1",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-3.8.1.tgz",
+      "integrity": "sha512-5ZXLWWsMqHKFr5y0N3Eo5IIisxeEeRAajNq4mELb/WELOR7srdbQk2N5XiyNy2A/AgvlR3AmeBCZJW8lHrolbw==",
       "requires": {
         "acorn": "5.2.1",
         "acorn-dynamic-import": "2.0.2",
diff --git a/packages/styling/jest.config.js b/packages/styling/jest.config.js
new file mode 100644
index 0000000000000..a92c71220a900
--- /dev/null
+++ b/packages/styling/jest.config.js
@@ -0,0 +1,3 @@
+let { createConfig } = require('../../scripts/tasks/jest-resources');
+
+module.exports = createConfig();
diff --git a/packages/styling/package.json b/packages/styling/package.json
index ebccf66901124..ad4f7988907ab 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -12,11 +12,13 @@
   "scripts": {
     "build": "node ../../scripts/build.js",
     "clean": "node ../../scripts/clean.js",
-    "start": "node ../../scripts/start.js"
+    "start": "node ../../scripts/start.js",
+    "start-test": "node ../../scripts/start-test.js"
   },
   "devDependencies": {
     "@types/chai": "3.4.35",
     "@types/enzyme": "2.8.8",
+    "@types/jest": "21.1.0",
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "@types/react": "15.6.7",
diff --git a/packages/styling/src/styles/index.ts b/packages/styling/src/styles/index.ts
index ea4525b2c9c2f..7b5a7895ffd80 100644
--- a/packages/styling/src/styles/index.ts
+++ b/packages/styling/src/styles/index.ts
@@ -8,6 +8,8 @@ export {
   ThemeSettingName,
   getTheme,
   loadTheme,
-  createTheme
+  createTheme,
+  registerOnThemeChangeCallback,
+  removeOnThemeChangeCallback
 } from './theme';
 export * from './CommonStyles';
diff --git a/packages/styling/src/styles/theme.test.ts b/packages/styling/src/styles/theme.test.ts
new file mode 100644
index 0000000000000..0542862668d34
--- /dev/null
+++ b/packages/styling/src/styles/theme.test.ts
@@ -0,0 +1,42 @@
+import * as theme from './theme';
+
+describe('registerOnThemeChangeCallback', () => {
+  /*let counter = 0;
+  let callback = (t: ITheme) => {
+    expect(t).toBeTruthy();
+    counter++;
+  };*/
+  let callback = jest.fn();
+
+  it('doesnt do anything yet', () => {
+    theme.loadTheme({});
+    expect(callback.mock.calls.length).toBe(0);
+  });
+
+  it('registers a callback successfully', () => {
+    theme.registerOnThemeChangeCallback(callback);
+    expect(callback.mock.calls.length).toBe(0);
+  });
+
+  it('calls the previously registered callback', () => {
+    theme.loadTheme({});
+    expect(callback.mock.calls.length).toBe(1);
+  });
+
+  it('calls the previously registered callback (again)', () => {
+    theme.loadTheme({});
+    expect(callback.mock.calls.length).toBe(2);
+  });
+
+  it('unregisters the callback, and doesnt call it again', () => {
+    theme.removeOnThemeChangeCallback(callback);
+    expect(callback.mock.calls.length).toBe(2);
+    theme.loadTheme({});
+    expect(callback.mock.calls.length).toBe(2);
+  });
+
+  it('didnt pass null to the callback', () => {
+    expect(callback.mock.calls[0][0]).toBeTruthy();
+    expect(callback.mock.calls[1][0]).toBeTruthy();
+  });
+});
\ No newline at end of file
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index 6407a8955e380..2c5eb0b437a46 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -19,6 +19,7 @@ let _theme: ITheme = {
   fonts: DefaultFontStyles,
   isInverted: false
 };
+let _onThemeChangeCallbacks: Array<(theme: ITheme) => void> = [];
 
 export const ThemeSettingName = 'theme';
 
@@ -42,6 +43,30 @@ export function getTheme(): ITheme {
   return _theme;
 }
 
+/**
+ * Registers a callback that gets called whenever the theme changes.
+ * This should only be used when the component cannot automatically get theme changes through its state.
+ * This will not register duplicate callbacks.
+ */
+export function registerOnThemeChangeCallback(callback: (theme: ITheme) => void): void {
+  if (_onThemeChangeCallbacks.indexOf(callback) === -1) {
+    _onThemeChangeCallbacks.push(callback);
+  }
+}
+
+/**
+ * See registerOnThemeChangeCallback().
+ * Removes previously registered callbacks.
+ */
+export function removeOnThemeChangeCallback(callback: (theme: ITheme) => void): void {
+  const i = _onThemeChangeCallbacks.indexOf(callback);
+  if (i === -1) {
+    return;
+  }
+
+  _onThemeChangeCallbacks.splice(i, 1);
+}
+
 /**
  * Applies the theme, while filling in missing slots.
  */
@@ -53,6 +78,14 @@ export function loadTheme(theme: IPartialTheme): ITheme {
 
   Customizations.applySettings({ [ThemeSettingName]: _theme });
 
+  _onThemeChangeCallbacks.forEach((callback: (theme: ITheme) => void) => {
+    try {
+      callback(_theme);
+    } catch (e) {
+      // don't let a bad callback break everything else
+    }
+  });
+
   return _theme;
 }
 
diff --git a/packages/styling/tsconfig.json b/packages/styling/tsconfig.json
index 02fac4792a7a8..42fba9b465d14 100644
--- a/packages/styling/tsconfig.json
+++ b/packages/styling/tsconfig.json
@@ -19,6 +19,7 @@
       "dom"
     ],
     "types": [
+      "jest",
       "webpack-env",
       "react"
     ],

From 893fd0959b429ec0ae5d130ece9e28b1e6406437 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Mon, 4 Dec 2017 09:05:12 -0800
Subject: [PATCH 1104/1641] make the styling package match the last published
 version (#3510)

---
 packages/styling/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/styling/package.json b/packages/styling/package.json
index ad4f7988907ab..ea7711def8497 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.12.1",
+  "version": "5.13.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "repository": {
     "type": "git",

From a9ee6783ac1a99d45872047c3de2fa8f46e13534 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 4 Dec 2017 17:27:54 +0000
Subject: [PATCH 1105/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  4 +--
 ...thayer-filetypeicons_2017-12-01-01-19.json | 11 --------
 ...thayer-filetypeicons_2017-12-01-01-19.json | 11 --------
 .../phkuo-getTheme_2017-10-27-00-39.json      | 11 --------
 ...mbobox-pressed-state_2017-11-28-20-42.json | 11 --------
 ...-bar-contextual-menu_2017-11-22-17-25.json | 11 --------
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/CHANGELOG.json           | 22 ++++++++++++++++
 packages/experiments/CHANGELOG.md             |  9 ++++++-
 packages/experiments/package.json             |  6 ++---
 packages/file-type-icons/CHANGELOG.json       | 24 +++++++++++++++++
 packages/file-type-icons/CHANGELOG.md         | 11 ++++++++
 packages/file-type-icons/package.json         |  4 +--
 packages/icons/package.json                   |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 26 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/CHANGELOG.json               | 14 ++++++++++
 packages/styling/CHANGELOG.md                 |  9 ++++++-
 packages/styling/package.json                 |  2 +-
 24 files changed, 137 insertions(+), 74 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/kathayer-filetypeicons_2017-12-01-01-19.json
 delete mode 100644 common/changes/@uifabric/file-type-icons/kathayer-filetypeicons_2017-12-01-01-19.json
 delete mode 100644 common/changes/@uifabric/styling/phkuo-getTheme_2017-10-27-00-39.json
 delete mode 100644 common/changes/office-ui-fabric-react/combobox-pressed-state_2017-11-28-20-42.json
 delete mode 100644 common/changes/office-ui-fabric-react/scroll-bar-contextual-menu_2017-11-22-17-25.json
 create mode 100644 packages/file-type-icons/CHANGELOG.json
 create mode 100644 packages/file-type-icons/CHANGELOG.md

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 820aaa21cf783..b234a3fe67e91 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.28.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 6b48494b783c3..17f12c68d8d46 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.28.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index b0fea805c8da7..5640a3658ebba 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.28.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 1e86d68c38b93..982aad253465c 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.28.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.1 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index c1888dc7c58fd..5089625667e04 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -29,8 +29,8 @@
   },
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "@uifabric/styling": ">=5.12.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.28.0 <6.0.0",
+    "@uifabric/styling": ">=5.14.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.1 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/experiments/kathayer-filetypeicons_2017-12-01-01-19.json b/common/changes/@uifabric/experiments/kathayer-filetypeicons_2017-12-01-01-19.json
deleted file mode 100644
index 98394e31bddac..0000000000000
--- a/common/changes/@uifabric/experiments/kathayer-filetypeicons_2017-12-01-01-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Add experiments page for file type icons",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "kathayer@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/file-type-icons/kathayer-filetypeicons_2017-12-01-01-19.json b/common/changes/@uifabric/file-type-icons/kathayer-filetypeicons_2017-12-01-01-19.json
deleted file mode 100644
index 9c6b0225659c3..0000000000000
--- a/common/changes/@uifabric/file-type-icons/kathayer-filetypeicons_2017-12-01-01-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/file-type-icons",
-      "comment": "Add package for file type icons",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/file-type-icons",
-  "email": "kathayer@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/phkuo-getTheme_2017-10-27-00-39.json b/common/changes/@uifabric/styling/phkuo-getTheme_2017-10-27-00-39.json
deleted file mode 100644
index 3d5f9e432607d..0000000000000
--- a/common/changes/@uifabric/styling/phkuo-getTheme_2017-10-27-00-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Add an event callback for when the theme changes.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/combobox-pressed-state_2017-11-28-20-42.json b/common/changes/office-ui-fabric-react/combobox-pressed-state_2017-11-28-20-42.json
deleted file mode 100644
index b04c586ad1796..0000000000000
--- a/common/changes/office-ui-fabric-react/combobox-pressed-state_2017-11-28-20-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "ComboBox: More refined handling of pressed, checked, focused and hover states for styling.",
-      "packageName": "office-ui-fabric-react",
-      "type": "none"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/scroll-bar-contextual-menu_2017-11-22-17-25.json b/common/changes/office-ui-fabric-react/scroll-bar-contextual-menu_2017-11-22-17-25.json
deleted file mode 100644
index 7d5104bba00e8..0000000000000
--- a/common/changes/office-ui-fabric-react/scroll-bar-contextual-menu_2017-11-22-17-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: Make sure vertical scrollbar does not take space away from contents",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 4b2e7ee1a39b5..3a13dab80e2fa 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -38,7 +38,7 @@
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.12.1 <6.0.0",
+    "@uifabric/styling": ">=5.14.0 <6.0.0",
     "@uifabric/utilities": ">=5.5.0 <6.0.0",
     "highlight.js": "^9.9.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index c863359847bdd..0fde8eb2432be 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.9.0",
+      "tag": "@uifabric/experiments_v5.9.0",
+      "date": "Mon, 04 Dec 2017 17:27:54 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "KatherineThayerMicrosoft <kathayer@microsoft.com>",
+            "commit": "a4df7ef34766b89249ac276b6531609414dbc458",
+            "comment": "Add experiments page for file type icons"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.29.0 <6.0.0` to `>=5.29.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/file-type-icons\" from `>=0.0.1 <1.0.0` to `>=0.1.0 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.8.0",
       "tag": "@uifabric/experiments_v5.8.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 2043811b9e63f..467b38b5c67d5 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Fri, 01 Dec 2017 11:11:16 GMT and should not be manually modified.
+This log was last generated on Mon, 04 Dec 2017 17:27:54 GMT and should not be manually modified.
+
+## 5.9.0
+Mon, 04 Dec 2017 17:27:54 GMT
+
+### Minor changes
+
+- Add experiments page for file type icons
 
 ## 5.8.0
 Fri, 01 Dec 2017 11:11:16 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index e47358cde5790..922288096d043 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.8.0",
+  "version": "5.9.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/enzyme": "^2.8.8",
     "@types/webpack-env": "1.13.0",
     "@uifabric/example-app-base": ">=5.1.2 <6.0.0",
-    "@uifabric/file-type-icons": ">=0.0.1 <1.0.0",
+    "@uifabric/file-type-icons": ">=0.1.0 <1.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.0.1 <6.0.0",
     "es6-weak-map": "^2.0.2",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.29.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.1 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/file-type-icons/CHANGELOG.json b/packages/file-type-icons/CHANGELOG.json
new file mode 100644
index 0000000000000..b9ce4d25ca27e
--- /dev/null
+++ b/packages/file-type-icons/CHANGELOG.json
@@ -0,0 +1,24 @@
+{
+  "name": "@uifabric/file-type-icons",
+  "entries": [
+    {
+      "version": "0.1.0",
+      "tag": "@uifabric/file-type-icons_v0.1.0",
+      "date": "Mon, 04 Dec 2017 17:27:54 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "KatherineThayerMicrosoft <kathayer@microsoft.com>",
+            "commit": "a4df7ef34766b89249ac276b6531609414dbc458",
+            "comment": "Add package for file type icons"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.12.0 <6.0.0` to `>=5.14.0 <6.0.0`"
+          }
+        ]
+      }
+    }
+  ]
+}
\ No newline at end of file
diff --git a/packages/file-type-icons/CHANGELOG.md b/packages/file-type-icons/CHANGELOG.md
new file mode 100644
index 0000000000000..0a670e8729342
--- /dev/null
+++ b/packages/file-type-icons/CHANGELOG.md
@@ -0,0 +1,11 @@
+# Change Log - @uifabric/file-type-icons
+
+This log was last generated on Mon, 04 Dec 2017 17:27:54 GMT and should not be manually modified.
+
+## 0.1.0
+Mon, 04 Dec 2017 17:27:54 GMT
+
+### Minor changes
+
+- Add package for file type icons
+
diff --git a/packages/file-type-icons/package.json b/packages/file-type-icons/package.json
index e9a91ec99cc3e..35d0b824538eb 100644
--- a/packages/file-type-icons/package.json
+++ b/packages/file-type-icons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/file-type-icons",
-  "version": "0.0.1",
+  "version": "0.1.0",
   "description": "Office UI Fabric file type icon set.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -23,7 +23,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.12.0 <6.0.0",
+    "@uifabric/styling": ">=5.14.0 <6.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 79e2cdcbb0b7d..d9cb0745db4ff 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -22,7 +22,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.12.0 <6.0.0",
+    "@uifabric/styling": ">=5.14.0 <6.0.0",
     "tslib": "^1.6.0"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 4c2fbb8024c68..1d78ebe083cb1 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.29.1",
+      "tag": "office-ui-fabric-react_v5.29.1",
+      "date": "Mon, 04 Dec 2017 17:27:54 GMT",
+      "comments": {
+        "none": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "188a689a4a786216f0a7c4505dd952e06687b58f",
+            "comment": "ComboBox: More refined handling of pressed, checked, focused and hover states for styling."
+          }
+        ],
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "98a7e2444662ab34b4f3c84daef6afd2b04cbbdd",
+            "comment": "ContextualMenu: Make sure vertical scrollbar does not take space away from contents"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.12.1 <6.0.0` to `>=5.14.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.29.0",
       "tag": "office-ui-fabric-react_v5.29.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index acc64206f13df..11f3c5b5a9e9d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 01 Dec 2017 11:11:16 GMT and should not be manually modified.
+This log was last generated on Mon, 04 Dec 2017 17:27:54 GMT and should not be manually modified.
+
+## 5.29.1
+Mon, 04 Dec 2017 17:27:54 GMT
+
+### Patches
+
+- ContextualMenu: Make sure vertical scrollbar does not take space away from contents
 
 ## 5.29.0
 Fri, 01 Dec 2017 11:11:16 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index fc55817ab070e..dd00560079d04 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.29.0",
+  "version": "5.29.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,7 +47,7 @@
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.8.0 <6.0.0",
-    "@uifabric/styling": ">=5.12.1 <6.0.0",
+    "@uifabric/styling": ">=5.14.0 <6.0.0",
     "@uifabric/utilities": ">=5.5.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 321cb2c29bd11..b1abb03094857 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.14.0",
+      "tag": "@uifabric/styling_v5.14.0",
+      "date": "Mon, 04 Dec 2017 17:27:54 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "f87d8889321e89fc697985c43b88b2bfc3288994",
+            "comment": "Add an event callback for when the theme changes."
+          }
+        ]
+      }
+    },
     {
       "version": "5.12.1",
       "tag": "@uifabric/styling_v5.12.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 1f50ba835ab64..2a4add2b43ecc 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 01 Dec 2017 11:11:16 GMT and should not be manually modified.
+This log was last generated on Mon, 04 Dec 2017 17:27:54 GMT and should not be manually modified.
+
+## 5.14.0
+Mon, 04 Dec 2017 17:27:54 GMT
+
+### Minor changes
+
+- Add an event callback for when the theme changes.
 
 ## 5.12.1
 Fri, 01 Dec 2017 11:11:16 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index ea7711def8497..b37acb9f07556 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.13.0",
+  "version": "5.14.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "repository": {
     "type": "git",

From 6ee3e5a557ac4a97ff37e0a7e8b1fd02fcd77fb4 Mon Sep 17 00:00:00 2001
From: Michael Loughry <miclo@microsoft.com>
Date: Mon, 4 Dec 2017 12:03:09 -0800
Subject: [PATCH 1106/1641] Update a couple button colors to match design
 (#3513)

* Update a couple button colors to match design.

Fixes #3497

* Add change file
---
 .../office-ui-fabric-react/3497_2017-12-04-19-02.json | 11 +++++++++++
 .../src/components/Button/ButtonThemes.ts             |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/3497_2017-12-04-19-02.json

diff --git a/common/changes/office-ui-fabric-react/3497_2017-12-04-19-02.json b/common/changes/office-ui-fabric-react/3497_2017-12-04-19-02.json
new file mode 100644
index 0000000000000..b69182fb3b2de
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/3497_2017-12-04-19-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Update Default Button colors to match design spec",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts b/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
index 60b0d74310e23..808bcfd3a1966 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
@@ -104,7 +104,7 @@ export function primaryStyles(theme: ITheme): IButtonStyles {
     },
 
     rootHovered: {
-      backgroundColor: theme.palette.themeDark,
+      backgroundColor: theme.palette.themeDarkAlt,
       color: theme.palette.white,
       selectors: {
         [HighContrastSelector]: {
@@ -116,7 +116,7 @@ export function primaryStyles(theme: ITheme): IButtonStyles {
     },
 
     rootPressed: {
-      backgroundColor: theme.palette.themePrimary,
+      backgroundColor: theme.palette.themeDark,
       color: theme.palette.white,
       selectors: {
         [HighContrastSelector]: {

From 8339b294ded17634f8ec4c53601c0b8ed77d9a20 Mon Sep 17 00:00:00 2001
From: chang47 <coralbue@gmail.com>
Date: Mon, 4 Dec 2017 13:24:11 -0800
Subject: [PATCH 1107/1641] Reverting: ContextualMenu Tabbing through menu
 items (#3515)

* revert contextual tab changes that steal focus

* added change list
---
 ...-revertContextualTab_2017-12-04-21-01.json | 11 ++++++++++
 .../ContextualMenu/ContextualMenu.tsx         |  4 ++--
 .../src/components/FocusZone/FocusZone.tsx    | 20 -------------------
 .../components/FocusZone/FocusZone.types.ts   |  3 ---
 4 files changed, 13 insertions(+), 25 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/chiechan-revertContextualTab_2017-12-04-21-01.json

diff --git a/common/changes/office-ui-fabric-react/chiechan-revertContextualTab_2017-12-04-21-01.json b/common/changes/office-ui-fabric-react/chiechan-revertContextualTab_2017-12-04-21-01.json
new file mode 100644
index 0000000000000..95547668e5b10
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/chiechan-revertContextualTab_2017-12-04-21-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Contextual Tab and Focus Zone - reverted tabbing functionality to avoid tab being captured",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chiechan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 6a742bba8b698..086474b75cfc4 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -304,7 +304,6 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
                 className={ this._classNames.root }
                 direction={ arrowDirection }
                 isCircularNavigation={ true }
-                allowTabKey={ true }
               >
                 <ul
                   aria-label={ ariaLabel }
@@ -660,6 +659,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     let submenuCloseKey = getRTL() ? KeyCodes.right : KeyCodes.left;
 
     if (ev.which === KeyCodes.escape
+      || ev.which === KeyCodes.tab
       || (ev.which === submenuCloseKey && this.props.isSubMenu && this.props.arrowDirection === FocusZoneDirection.vertical)) {
       // When a user presses escape, we will try to refocus the previous focused element.
       this._isFocusingPreviousElement = true;
@@ -910,4 +910,4 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       this._targetWindow = getWindow()!;
     }
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index f7bce65c291d3..fbe8f215aa20c 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -354,26 +354,6 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
           }
           return;
 
-        case KeyCodes.tab:
-          if (this.props.allowTabKey) {
-            if (direction === FocusZoneDirection.vertical) {
-              if (ev.shiftKey) {
-                this._moveFocusUp();
-              } else {
-                this._moveFocusDown();
-              }
-              break;
-            } else if (direction === FocusZoneDirection.horizontal || direction === FocusZoneDirection.bidirectional) {
-              if (ev.shiftKey) {
-                this._moveFocusLeft();
-              } else {
-                this._moveFocusRight();
-              }
-              break;
-            }
-            return;
-          }
-
         case KeyCodes.home:
           if (
             this._isElementInput(ev.target as HTMLElement) &&
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
index c591e49c9194e..e4f8cadcbd2c1 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
@@ -102,9 +102,6 @@ export interface IFocusZoneProps extends React.HTMLAttributes<HTMLElement | Focu
 
   /** Allow focus to move to root */
   allowFocusRoot?: boolean;
-
-  /** Allows tab key to be handled, a side effect is that users will not be able to tab out of the focus zone */
-  allowTabKey?: boolean;
 }
 
 export enum FocusZoneDirection {

From 1e7bfd33d32ee6f5367a1152377c203e2ab68888 Mon Sep 17 00:00:00 2001
From: Eddie Liu <leddie24@gmail.com>
Date: Mon, 4 Dec 2017 14:15:27 -0800
Subject: [PATCH 1108/1641] Rename ScrollBox to ScrollablePane on
 fabric-website (#3511)

* Rename ScrollBox to ScrollablePane on fabric-website

* Add change file
---
 .../pages/Components/ScrollablePaneComponentPage.tsx  |  2 +-
 ...edwliu-fixScrollablePanePage_2017-12-04-18-18.json | 11 +++++++++++
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/fabric-website/v-edwliu-fixScrollablePanePage_2017-12-04-18-18.json

diff --git a/apps/fabric-website/src/pages/Components/ScrollablePaneComponentPage.tsx b/apps/fabric-website/src/pages/Components/ScrollablePaneComponentPage.tsx
index 36fc2d61e378c..9c3f68da7568d 100644
--- a/apps/fabric-website/src/pages/Components/ScrollablePaneComponentPage.tsx
+++ b/apps/fabric-website/src/pages/Components/ScrollablePaneComponentPage.tsx
@@ -9,7 +9,7 @@ export class ScrollablePaneComponentPage extends React.Component<any, any> {
     return (
       <div ref='pageElement' className={ pageStyles.basePage }>
         <ComponentPage>
-          <PageHeader pageTitle='SearchBox' backgroundColor='#038387'
+          <PageHeader pageTitle='ScrollablePane' backgroundColor='#038387'
             links={
               [
                 {
diff --git a/common/changes/@uifabric/fabric-website/v-edwliu-fixScrollablePanePage_2017-12-04-18-18.json b/common/changes/@uifabric/fabric-website/v-edwliu-fixScrollablePanePage_2017-12-04-18-18.json
new file mode 100644
index 0000000000000..a8db19cb17a73
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/v-edwliu-fixScrollablePanePage_2017-12-04-18-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Fix ScrollablePane page title",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "v-edwliu@microsoft.com"
+}
\ No newline at end of file

From da9bf2413dd11b89d6b9fb50cad02130f91e371f Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 5 Dec 2017 02:04:27 +0000
Subject: [PATCH 1109/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 19 +++++++++++++++++++
 apps/fabric-website/CHANGELOG.md              |  9 ++++++++-
 apps/fabric-website/package.json              |  4 ++--
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...ixScrollablePanePage_2017-12-04-18-18.json | 11 -----------
 .../3497_2017-12-04-19-02.json                | 11 -----------
 ...-revertContextualTab_2017-12-04-21-01.json | 11 -----------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 14 files changed, 63 insertions(+), 43 deletions(-)
 delete mode 100644 common/changes/@uifabric/fabric-website/v-edwliu-fixScrollablePanePage_2017-12-04-18-18.json
 delete mode 100644 common/changes/office-ui-fabric-react/3497_2017-12-04-19-02.json
 delete mode 100644 common/changes/office-ui-fabric-react/chiechan-revertContextualTab_2017-12-04-21-01.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 167dbfb5eb7ee..9477626baf4be 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.0.18",
+      "tag": "@uifabric/fabric-website_v5.0.18",
+      "date": "Tue, 05 Dec 2017 02:04:27 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Eddie Liu <leddie24@gmail.com>",
+            "commit": "1e7bfd33d32ee6f5367a1152377c203e2ab68888",
+            "comment": "Fix ScrollablePane page title"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.29.1 <6.0.0` to `>=5.29.2 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.17",
       "tag": "@uifabric/fabric-website_v5.0.17",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index eeb7d6e359bdb..9278306474c0b 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Mon, 20 Nov 2017 11:12:47 GMT and should not be manually modified.
+This log was last generated on Tue, 05 Dec 2017 02:04:27 GMT and should not be manually modified.
+
+## 5.0.18
+Tue, 05 Dec 2017 02:04:27 GMT
+
+### Patches
+
+- Fix ScrollablePane page title
 
 ## 5.0.17
 Mon, 20 Nov 2017 11:12:47 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index b234a3fe67e91..a858ed173b11b 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.0.17",
+  "version": "5.0.18",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.29.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 17f12c68d8d46..dfcb62b8ac44d 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.29.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.2 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 5640a3658ebba..a203920c58038 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.29.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 982aad253465c..5bbcd26ece9d8 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.29.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.2 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 5089625667e04..36bfa2d1e9b27 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -30,7 +30,7 @@
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/styling": ">=5.14.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.29.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.2 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/fabric-website/v-edwliu-fixScrollablePanePage_2017-12-04-18-18.json b/common/changes/@uifabric/fabric-website/v-edwliu-fixScrollablePanePage_2017-12-04-18-18.json
deleted file mode 100644
index a8db19cb17a73..0000000000000
--- a/common/changes/@uifabric/fabric-website/v-edwliu-fixScrollablePanePage_2017-12-04-18-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Fix ScrollablePane page title",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "v-edwliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/3497_2017-12-04-19-02.json b/common/changes/office-ui-fabric-react/3497_2017-12-04-19-02.json
deleted file mode 100644
index b69182fb3b2de..0000000000000
--- a/common/changes/office-ui-fabric-react/3497_2017-12-04-19-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Update Default Button colors to match design spec",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/chiechan-revertContextualTab_2017-12-04-21-01.json b/common/changes/office-ui-fabric-react/chiechan-revertContextualTab_2017-12-04-21-01.json
deleted file mode 100644
index 95547668e5b10..0000000000000
--- a/common/changes/office-ui-fabric-react/chiechan-revertContextualTab_2017-12-04-21-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Contextual Tab and Focus Zone - reverted tabbing functionality to avoid tab being captured",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chiechan@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 922288096d043..e043b92a3a4d3 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.29.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.2 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 1d78ebe083cb1..967f6cf89067f 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.29.2",
+      "tag": "office-ui-fabric-react_v5.29.2",
+      "date": "Tue, 05 Dec 2017 02:04:27 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Michael Loughry <miclo@microsoft.com>",
+            "commit": "6ee3e5a557ac4a97ff37e0a7e8b1fd02fcd77fb4",
+            "comment": "Update Default Button colors to match design spec"
+          },
+          {
+            "author": "chang47 <coralbue@gmail.com>",
+            "commit": "8339b294ded17634f8ec4c53601c0b8ed77d9a20",
+            "comment": "Contextual Tab and Focus Zone - reverted tabbing functionality to avoid tab being captured"
+          }
+        ]
+      }
+    },
     {
       "version": "5.29.1",
       "tag": "office-ui-fabric-react_v5.29.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 11f3c5b5a9e9d..4650184f989dd 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 04 Dec 2017 17:27:54 GMT and should not be manually modified.
+This log was last generated on Tue, 05 Dec 2017 02:04:27 GMT and should not be manually modified.
+
+## 5.29.2
+Tue, 05 Dec 2017 02:04:27 GMT
+
+### Patches
+
+- Update Default Button colors to match design spec
+- Contextual Tab and Focus Zone - reverted tabbing functionality to avoid tab being captured
 
 ## 5.29.1
 Mon, 04 Dec 2017 17:27:54 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index dd00560079d04..727a47ac052a4 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.29.1",
+  "version": "5.29.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 871a5a441f6c38c7c82abbe8f7b6081ce0c551f7 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 5 Dec 2017 08:35:30 -0800
Subject: [PATCH 1110/1641] Website: FabricCore version documentation update
 (#3446)

* Testing variable for core versioning for website

* Fixed path

* Hardcoded FabricCore reference update

* Added change file

* Moved const

* Added const to get started page

* Added safe checks to version const
---
 .../src/pages/GetStarted/GetStartedPage.tsx           |  4 +++-
 apps/fabric-website/src/root.tsx                      |  5 +++--
 .../core-versioning_2017-11-21-20-33.json             | 11 +++++++++++
 ghdocs/README.md                                      |  2 +-
 4 files changed, 18 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/core-versioning_2017-11-21-20-33.json

diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
index 86d02e28211eb..8979096ea2efd 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
@@ -7,6 +7,8 @@ const diagramStyles: any = require('./GetStartedPage.diagram.module.scss');
 import * as stylesImport from './GetStartedPage.module.scss';
 const styles: any = stylesImport;
 const pageStyles: any = require('../PageStyles.module.scss');
+const corePackageData = require('../../../node_modules/office-ui-fabric-core/package.json');
+const corePackageVersion: string = corePackageData && corePackageData.version || '9.2.0';
 
 export class GetStartedPage extends React.Component<any, any> {
   public render() {
@@ -185,7 +187,7 @@ initializeIcons('https://my.cdn.com/path/to/icons/');`
               <p>Add the following line to the &lt;head&gt; of your webpage:</p>
               <CodeBlock language='html' isLightTheme={ true }>
                 {
-                  `<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/9.0.0/css/fabric.min.css">`
+                  `<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/${corePackageVersion}/css/fabric.min.css">`
                 }
               </CodeBlock>
             </li>
diff --git a/apps/fabric-website/src/root.tsx b/apps/fabric-website/src/root.tsx
index ef960af0b6116..d19f207b78c55 100644
--- a/apps/fabric-website/src/root.tsx
+++ b/apps/fabric-website/src/root.tsx
@@ -11,8 +11,9 @@ import { setBaseUrl } from 'office-ui-fabric-react/lib/Utilities';
 import { HomePage } from './pages/HomePage/HomePage';
 import WindowWidthUtility from './utilities/WindowWidthUtility';
 import './styles/styles.scss';
-
 import { initializeIcons } from '@uifabric/icons/lib/index';
+const corePackageData = require('../node_modules/office-ui-fabric-core/package.json');
+const corePackageVersion: string = corePackageData && corePackageData.version || '9.2.0';
 
 initializeIcons();
 
@@ -145,4 +146,4 @@ function addCSSToHeader(fileName: string) {
   headEl.appendChild(linkEl);
 }
 
-addCSSToHeader('https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/9.0.0/css/fabric.min.css');
+addCSSToHeader('https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/' + corePackageVersion + '/css/fabric.min.css');
diff --git a/common/changes/@uifabric/fabric-website/core-versioning_2017-11-21-20-33.json b/common/changes/@uifabric/fabric-website/core-versioning_2017-11-21-20-33.json
new file mode 100644
index 0000000000000..0d44ff1f7b5f9
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/core-versioning_2017-11-21-20-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Updated referenced FabricCore versions.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/ghdocs/README.md b/ghdocs/README.md
index a72bbbfbda658..947263d99f0df 100644
--- a/ghdocs/README.md
+++ b/ghdocs/README.md
@@ -124,7 +124,7 @@ You can specify the default direction in your `index.html`. Add the `dir` attrib
 Load Office UI Fabric styles by linking to the Office UI Fabric CDN. Add the following to the `<head`> element:
 
 ```html
-<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/9.0.0/css/fabric.min.css">
+<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/9.2.0/css/fabric.min.css">
 ```
 
 Save the file.

From 16d31b15a2d23def22f75bd688e2f15e62b6f7f6 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 5 Dec 2017 11:22:33 -0800
Subject: [PATCH 1111/1641] Button: Wrap in span if doNotLayer (#3524)

* Wrap button in span if menuProps do not layer

* Change file

* Update BaseButton.tsx

* Fixed linting errors
---
 .../2017-12-05-17-40.json                     | 11 ++++++
 .../src/components/Button/BaseButton.tsx      | 39 ++++++++++++-------
 2 files changed, 36 insertions(+), 14 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/2017-12-05-17-40.json

diff --git a/common/changes/office-ui-fabric-react/2017-12-05-17-40.json b/common/changes/office-ui-fabric-react/2017-12-05-17-40.json
new file mode 100644
index 0000000000000..7687c11f754bc
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/2017-12-05-17-40.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Button: Move contextual menu outside of button tag if doNotLayer",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index c00cea9178214..16c7497b872a8 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -204,6 +204,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
 
   private _onRenderContent(tag: any, buttonProps: IButtonProps): JSX.Element {
     let props = this.props;
+    let Tag = tag;
     let {
       menuIconProps,
       menuProps,
@@ -214,19 +215,29 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       onRenderMenuIcon = this._onRenderMenuIcon
     } = props;
 
-    return React.createElement(
-      tag,
-      buttonProps,
-      React.createElement(
-        'div' as any,
-        { className: this._classNames.flexContainer },
-        onRenderIcon(props, this._onRenderIcon),
-        this._onRenderTextContents(),
-        onRenderAriaDescription(props, this._onRenderAriaDescription),
-        onRenderChildren(props, this._onRenderChildren),
-        !this._isSplitButton && (menuProps || menuIconProps || this.props.onRenderMenuIcon) && onRenderMenuIcon(this.props, this._onRenderMenuIcon),
-        this.state.menuProps && onRenderMenu(menuProps, this._onRenderMenu)
-      ));
+    const Content = (
+      <Tag {...buttonProps }>
+        <div className={ this._classNames.flexContainer } >
+          { onRenderIcon(props, this._onRenderIcon) }
+          { this._onRenderTextContents() }
+          { onRenderAriaDescription(props, this._onRenderAriaDescription) }
+          { onRenderChildren(props, this._onRenderChildren) }
+          { !this._isSplitButton && (menuProps || menuIconProps || this.props.onRenderMenuIcon) && onRenderMenuIcon(this.props, this._onRenderMenuIcon) }
+          { this.state.menuProps && !this.state.menuProps.doNotLayer && onRenderMenu(menuProps, this._onRenderMenu) }
+        </div>
+      </Tag>
+    );
+
+    if (menuProps && menuProps.doNotLayer) {
+      return (
+        <div style={ { display: 'inline-block' } }>
+          { Content }
+          { this.state.menuProps && onRenderMenu(menuProps, this._onRenderMenu) }
+        </div>
+      );
+    }
+
+    return Content;
   }
 
   @autobind
@@ -472,4 +483,4 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     ev.preventDefault();
     ev.stopPropagation();
   }
-}
\ No newline at end of file
+}

From a09669cfeb652654ba6f2be1af7633be73689473 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 6 Dec 2017 11:24:52 +0000
Subject: [PATCH 1112/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 19 +++++++++++++++++++
 apps/fabric-website/CHANGELOG.md              |  9 ++++++++-
 apps/fabric-website/package.json              |  4 ++--
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../core-versioning_2017-11-21-20-33.json     | 11 -----------
 .../2017-12-05-17-40.json                     | 11 -----------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 13 files changed, 57 insertions(+), 32 deletions(-)
 delete mode 100644 common/changes/@uifabric/fabric-website/core-versioning_2017-11-21-20-33.json
 delete mode 100644 common/changes/office-ui-fabric-react/2017-12-05-17-40.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 9477626baf4be..0b9583d617527 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.0.19",
+      "tag": "@uifabric/fabric-website_v5.0.19",
+      "date": "Wed, 06 Dec 2017 11:24:52 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "871a5a441f6c38c7c82abbe8f7b6081ce0c551f7",
+            "comment": "Updated referenced FabricCore versions."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.29.2 <6.0.0` to `>=5.29.3 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.18",
       "tag": "@uifabric/fabric-website_v5.0.18",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 9278306474c0b..a793f98f6b6c4 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Tue, 05 Dec 2017 02:04:27 GMT and should not be manually modified.
+This log was last generated on Wed, 06 Dec 2017 11:24:52 GMT and should not be manually modified.
+
+## 5.0.19
+Wed, 06 Dec 2017 11:24:52 GMT
+
+### Patches
+
+- Updated referenced FabricCore versions.
 
 ## 5.0.18
 Tue, 05 Dec 2017 02:04:27 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index a858ed173b11b..31c8f8db4425e 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.0.18",
+  "version": "5.0.19",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.29.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.3 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index dfcb62b8ac44d..c6625431baf8a 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.29.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.3 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index a203920c58038..2ff6c10abef8e 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.29.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.3 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 5bbcd26ece9d8..0b39e66eb09ca 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.29.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.3 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 36bfa2d1e9b27..f1be8b29f7c7a 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -30,7 +30,7 @@
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/styling": ">=5.14.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.29.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.3 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/fabric-website/core-versioning_2017-11-21-20-33.json b/common/changes/@uifabric/fabric-website/core-versioning_2017-11-21-20-33.json
deleted file mode 100644
index 0d44ff1f7b5f9..0000000000000
--- a/common/changes/@uifabric/fabric-website/core-versioning_2017-11-21-20-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Updated referenced FabricCore versions.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/2017-12-05-17-40.json b/common/changes/office-ui-fabric-react/2017-12-05-17-40.json
deleted file mode 100644
index 7687c11f754bc..0000000000000
--- a/common/changes/office-ui-fabric-react/2017-12-05-17-40.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Button: Move contextual menu outside of button tag if doNotLayer",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index e043b92a3a4d3..e2f9eb54544ee 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.29.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.3 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 967f6cf89067f..e4943199a3830 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.29.3",
+      "tag": "office-ui-fabric-react_v5.29.3",
+      "date": "Wed, 06 Dec 2017 11:24:52 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "16d31b15a2d23def22f75bd688e2f15e62b6f7f6",
+            "comment": "Button: Move contextual menu outside of button tag if doNotLayer"
+          }
+        ]
+      }
+    },
     {
       "version": "5.29.2",
       "tag": "office-ui-fabric-react_v5.29.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 4650184f989dd..7d1dcbc9c6765 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 05 Dec 2017 02:04:27 GMT and should not be manually modified.
+This log was last generated on Wed, 06 Dec 2017 11:24:52 GMT and should not be manually modified.
+
+## 5.29.3
+Wed, 06 Dec 2017 11:24:52 GMT
+
+### Patches
+
+- Button: Move contextual menu outside of button tag if doNotLayer
 
 ## 5.29.2
 Tue, 05 Dec 2017 02:04:27 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 727a47ac052a4..6e629503bead4 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.29.2",
+  "version": "5.29.3",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 30aad8429619efb979f32ee99a3a91bb9b575ef4 Mon Sep 17 00:00:00 2001
From: chang47 <coralbue@gmail.com>
Date: Wed, 6 Dec 2017 08:50:26 -0800
Subject: [PATCH 1113/1641] Tabbing through Contextual Menu Items Without
 Taking Control of All Tab Elements (#3527)

* added initial fix

* removed extra spacing

* removed comment

* added change file

* added tabbing flag for focus zone

* added comment regarding focus zone

* added bidirectional

* fixed styling of bidirectional tabbing

* fixed tabbing taking context away from focus zone

* added unit tests

* added tab event listener test

* changed tab key hit name

* added comments, reverted test back to prev; turned on tab

* reverted testing changes made in an example

* restored formatting of example

* fixed contextual menu example to be tabbable

* added change files

* removed extra change list

* updated focuszone test to use jest

* better tab keycode check with jest
---
 ...an-contextualMenuTab_2017-11-17-03-11.json |  11 ++
 .../ContextualMenu/ContextualMenu.tsx         |   2 +-
 .../ContextualMenu.Customization.Example.tsx  |   2 +-
 .../components/FocusZone/FocusZone.test.tsx   | 120 +++++++++++++++++-
 .../src/components/FocusZone/FocusZone.tsx    |  20 +++
 .../components/FocusZone/FocusZone.types.ts   |   7 +
 6 files changed, 159 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/chiechan-contextualMenuTab_2017-11-17-03-11.json

diff --git a/common/changes/office-ui-fabric-react/chiechan-contextualMenuTab_2017-11-17-03-11.json b/common/changes/office-ui-fabric-react/chiechan-contextualMenuTab_2017-11-17-03-11.json
new file mode 100644
index 0000000000000..5ced79e955d6f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/chiechan-contextualMenuTab_2017-11-17-03-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Contextual Menu: made it so we can tab through items",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chiechan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 086474b75cfc4..f90d541c2317c 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -304,6 +304,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
                 className={ this._classNames.root }
                 direction={ arrowDirection }
                 isCircularNavigation={ true }
+                allowTabKey={ true }
               >
                 <ul
                   aria-label={ ariaLabel }
@@ -659,7 +660,6 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     let submenuCloseKey = getRTL() ? KeyCodes.right : KeyCodes.left;
 
     if (ev.which === KeyCodes.escape
-      || ev.which === KeyCodes.tab
       || (ev.which === submenuCloseKey && this.props.isSubMenu && this.props.arrowDirection === FocusZoneDirection.vertical)) {
       // When a user presses escape, we will try to refocus the previous focused element.
       this._isFocusingPreviousElement = true;
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
index c5b6e1612c566..39bcefdc86f68 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
@@ -13,7 +13,7 @@ export class ContextualMenuCustomizationExample extends React.Component<{}, {}>
         text='Click for ContextualMenu'
         menuProps={
           {
-            shouldFocusOnMount: false,
+            shouldFocusOnMount: true,
             directionalHint: DirectionalHint.bottomLeftEdge,
             className: 'ms-ContextualMenu-customizationExample',
             items:
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
index 5786817efb152..ce4ef11a8c89e 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
@@ -11,7 +11,7 @@ import { FocusZoneDirection } from './FocusZone.types';
 
 describe('FocusZone', () => {
   let lastFocusedElement: HTMLElement | undefined;
-
+  let tabKeyHit: number;
   function _onFocus(ev: any) {
     lastFocusedElement = ev.target;
   }
@@ -44,6 +44,7 @@ describe('FocusZone', () => {
 
   beforeEach(() => {
     lastFocusedElement = undefined;
+    tabKeyHit = 0;
   });
 
   it('can use arrows vertically', () => {
@@ -708,4 +709,121 @@ describe('FocusZone', () => {
     expect(buttonA.tabIndex).toBe(0);
     expect(buttonB.tabIndex).toBe(-1);
   });
+
+  it('Changes our focus to the next button when we hit tab when focus zone allow tabbing', () => {
+    const tabDownListener = jest.fn();
+    const component = ReactTestUtils.renderIntoDocument(
+      <div { ...{ onFocusCapture: _onFocus, onKeyDown: tabDownListener } }>
+        <FocusZone {...{ allowTabKey: true, isCircularNavigation: true }}>
+          <button className='a'>a</button>
+          <button className='b'>b</button>
+          <button className='c'>c</button>
+        </FocusZone>
+      </div >
+    );
+
+    const focusZone = ReactDOM.findDOMNode(component as React.ReactInstance).firstChild as Element;
+
+    const buttonA = focusZone.querySelector('.a') as HTMLElement;
+    const buttonB = focusZone.querySelector('.b') as HTMLElement;
+    const buttonC = focusZone.querySelector('.c') as HTMLElement;
+
+    setupElement(buttonA, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 0,
+        right: 20
+      }
+    });
+
+    setupElement(buttonB, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 20,
+        right: 40
+      }
+    });
+
+    setupElement(buttonC, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 40,
+        right: 60
+      }
+    });
+
+    // ButtonA should be focussed.
+    ReactTestUtils.Simulate.focus(buttonA);
+    expect(lastFocusedElement).toBe(buttonA);
+
+    expect(buttonA.tabIndex).toBe(0);
+    expect(buttonB.tabIndex).toBe(-1);
+    expect(buttonC.tabIndex).toBe(-1);
+
+    // Pressing tab will shift focus to button B
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.tab });
+    expect(lastFocusedElement).toBe(buttonB);
+
+    expect(buttonA.tabIndex).toBe(-1);
+    expect(buttonB.tabIndex).toBe(0);
+    expect(buttonC.tabIndex).toBe(-1);
+
+    // Pressing tab will shift focus to button C
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.tab });
+    expect(lastFocusedElement).toBe(buttonC);
+
+    expect(buttonA.tabIndex).toBe(-1);
+    expect(buttonB.tabIndex).toBe(-1);
+    expect(buttonC.tabIndex).toBe(0);
+
+    // Pressing tab on our final element will shift focus back to our first element A
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.tab });
+    expect(lastFocusedElement).toBe(buttonA);
+
+    expect(buttonA.tabIndex).toBe(0);
+    expect(buttonB.tabIndex).toBe(-1);
+    expect(buttonC.tabIndex).toBe(-1);
+
+    // FocusZone stops propagation of our tab when we enable tab handling
+    expect(tabDownListener.mock.calls.length).toBe(0);
+  });
+
+  it('detects tab when our focus zone does not allow tabbing', () => {
+    const tabDownListener = jest.fn();
+
+    const component = ReactTestUtils.renderIntoDocument(
+      <div { ...{ onFocusCapture: _onFocus, onKeyDown: tabDownListener } }>
+        <FocusZone>
+          <button className='a'>a</button>
+        </FocusZone>
+      </div >
+    );
+
+    const focusZone = ReactDOM.findDOMNode(component as React.ReactInstance).firstChild as Element;
+
+    const buttonA = focusZone.querySelector('.a') as HTMLElement;
+
+    setupElement(buttonA, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 0,
+        right: 20
+      }
+    });
+
+    // ButtonA should be focussed.
+    ReactTestUtils.Simulate.focus(buttonA);
+    expect(lastFocusedElement).toBe(buttonA);
+    expect(buttonA.tabIndex).toBe(0);
+
+    // Pressing tab when our focus zone doesn't allow tabbing will allow us to propagate our tab to our key down event handler
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.tab });
+    expect(tabDownListener.mock.calls.length).toBe(1);
+    const onKeyDownEvent = tabDownListener.mock.calls[0][0];
+    expect(onKeyDownEvent.which).toBe(KeyCodes.tab);
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index fbe8f215aa20c..5686b4edb7f3f 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -354,6 +354,26 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
           }
           return;
 
+        case KeyCodes.tab:
+          if (this.props.allowTabKey) {
+            if (direction === FocusZoneDirection.vertical) {
+              if (ev.shiftKey) {
+                this._moveFocusUp();
+              } else {
+                this._moveFocusDown();
+              }
+              break;
+            } else if (direction === FocusZoneDirection.horizontal || direction === FocusZoneDirection.bidirectional) {
+              if (ev.shiftKey) {
+                this._moveFocusLeft();
+              } else {
+                this._moveFocusRight();
+              }
+              break;
+            }
+          }
+          return;
+
         case KeyCodes.home:
           if (
             this._isElementInput(ev.target as HTMLElement) &&
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
index e4f8cadcbd2c1..d8417e1699c65 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
@@ -102,6 +102,13 @@ export interface IFocusZoneProps extends React.HTMLAttributes<HTMLElement | Focu
 
   /** Allow focus to move to root */
   allowFocusRoot?: boolean;
+
+  /**
+   * Allows tab key to be handled to tab through a list of items in the focus zone,
+   * an unfortunate side effect is that users will not be able to tab out of the focus zone
+   * and have to hit escape or some other key.
+   */
+  allowTabKey?: boolean;
 }
 
 export enum FocusZoneDirection {

From 79028e26aba0209300b4683377ef3cfd0fbe1800 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 6 Dec 2017 09:38:45 -0800
Subject: [PATCH 1114/1641] Applying package updates.

---
 apps/fabric-website/package.json                   |  2 +-
 apps/ssr-tests/package.json                        |  2 +-
 apps/test-bundle-button/package.json               |  2 +-
 apps/todo-app/package.json                         |  2 +-
 apps/vr-tests/package.json                         |  2 +-
 ...hiechan-contextualMenuTab_2017-11-17-03-11.json | 11 -----------
 packages/experiments/package.json                  |  2 +-
 packages/office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md       |  9 ++++++++-
 packages/office-ui-fabric-react/package.json       |  2 +-
 10 files changed, 29 insertions(+), 19 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/chiechan-contextualMenuTab_2017-11-17-03-11.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 31c8f8db4425e..64e21815eaad4 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.29.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.4 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index c6625431baf8a..5c9324b153865 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.29.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.4 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 2ff6c10abef8e..5d0b048cee135 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.29.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.4 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 0b39e66eb09ca..2bcc2b845a155 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.29.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.4 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index f1be8b29f7c7a..909fdaebb4fbf 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -30,7 +30,7 @@
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/styling": ">=5.14.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.29.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.4 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/chiechan-contextualMenuTab_2017-11-17-03-11.json b/common/changes/office-ui-fabric-react/chiechan-contextualMenuTab_2017-11-17-03-11.json
deleted file mode 100644
index 5ced79e955d6f..0000000000000
--- a/common/changes/office-ui-fabric-react/chiechan-contextualMenuTab_2017-11-17-03-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Contextual Menu: made it so we can tab through items",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chiechan@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index e2f9eb54544ee..f76fa7bd68c6b 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.29.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.4 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index e4943199a3830..d724b2eeb884f 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.29.4",
+      "tag": "office-ui-fabric-react_v5.29.4",
+      "date": "Wed, 06 Dec 2017 17:38:45 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "chang47 <coralbue@gmail.com>",
+            "commit": "30aad8429619efb979f32ee99a3a91bb9b575ef4",
+            "comment": "Contextual Menu: made it so we can tab through items"
+          }
+        ]
+      }
+    },
     {
       "version": "5.29.3",
       "tag": "office-ui-fabric-react_v5.29.3",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 7d1dcbc9c6765..42ada9a1b23e7 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 06 Dec 2017 11:24:52 GMT and should not be manually modified.
+This log was last generated on Wed, 06 Dec 2017 17:38:45 GMT and should not be manually modified.
+
+## 5.29.4
+Wed, 06 Dec 2017 17:38:45 GMT
+
+### Patches
+
+- Contextual Menu: made it so we can tab through items
 
 ## 5.29.3
 Wed, 06 Dec 2017 11:24:52 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 6e629503bead4..b77c3c779bb60 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.29.3",
+  "version": "5.29.4",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 7f5ba6a8ed47a195bf4ae6d533a62670bbcd1161 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Wed, 6 Dec 2017 11:17:56 -0800
Subject: [PATCH 1115/1641] Persona: Allow for consumers to provide custom
 colors for initials (#3507)

* Refactor the persona component

* More refactoring

* More refactoring

* Allow for string color codes to be plumbed through

* Make UT's pass

* Rush change

* Update comment on test to reflect that the input is a string

* Remove unused sass
---
 ...sgo-persona-refactor_2017-12-02-01-13.json | 11 +++
 .../__snapshots__/DocumentCard.test.tsx.snap  |  6 +-
 .../__snapshots__/Facepile.test.tsx.snap      |  6 +-
 .../src/components/Persona/Persona.scss       | 68 -------------
 .../src/components/Persona/Persona.test.tsx   | 16 ----
 .../src/components/Persona/Persona.types.ts   |  4 +-
 .../src/components/Persona/PersonaCoin.tsx    | 53 +----------
 .../src/components/Persona/PersonaConsts.ts   | 19 ----
 .../Persona/PersonaInitialsColor.test.ts      | 22 +++++
 .../Persona/PersonaInitialsColor.ts           | 95 +++++++++++++++++++
 .../__snapshots__/Persona.test.tsx.snap       |  6 +-
 11 files changed, 150 insertions(+), 156 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/chrisgo-persona-refactor_2017-12-02-01-13.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Persona/PersonaInitialsColor.test.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Persona/PersonaInitialsColor.ts

diff --git a/common/changes/office-ui-fabric-react/chrisgo-persona-refactor_2017-12-02-01-13.json b/common/changes/office-ui-fabric-react/chrisgo-persona-refactor_2017-12-02-01-13.json
new file mode 100644
index 0000000000000..6a12c11702dc0
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/chrisgo-persona-refactor_2017-12-02-01-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Persona: Allow for consumers to provide custom colors",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap b/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap
index 85151f0fbfd9f..aa9b51f2f7a81 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap
@@ -39,7 +39,11 @@ exports[`DocumentCard renders DocumentCard correctly 1`] = `
           >
             <div
               aria-hidden="true"
-              className="ms-Persona-initials ms-Persona-initials--blue undefined"
+              className=
+                  ms-Persona-initials
+                  {
+                    background-color: #2D89EF;
+                  }
               style={undefined}
             >
               <i
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
index a9ea99628b2e0..dbfd26c7a836e 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
@@ -169,7 +169,11 @@ exports[`Facepile Render personas and buttons renders Facepile correctly 1`] = `
             >
               <div
                 aria-hidden="true"
-                className="ms-Persona-initials ms-Persona-initials--darkGreen undefined"
+                className=
+                    ms-Persona-initials
+                    {
+                      background-color: #1E7145;
+                    }
                 style={undefined}
               >
                 <span>
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
index e87a1c8b3c6c5..4be75d5a3f7f6 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
@@ -7,25 +7,6 @@
 // --------------------------------------------------
 // Persona styles
 
-
-//= Colors used in the initials color block
-$ms-color-initials-transparent:      transparent;
-$ms-color-initials-lightBlue:        #6BA5E7;
-$ms-color-initials-blue:             #2D89EF;
-$ms-color-initials-darkBlue:         #2B5797;
-$ms-color-initials-teal:             #00ABA9;
-$ms-color-initials-lightGreen:       #99B433;
-$ms-color-initials-green:            #00A300;
-$ms-color-initials-darkGreen:        #1E7145;
-$ms-color-initials-lightPink:        #E773BD;
-$ms-color-initials-pink:             #FF0097;
-$ms-color-initials-magenta:          #7E3878;
-$ms-color-initials-purple:           #603CBA;
-$ms-color-initials-black:            #1D1D1D;
-$ms-color-initials-orange:           #DA532C;
-$ms-color-initials-red:              #EE1111;
-$ms-color-initials-darkRed:          #B91D47;
-
 // Skype presence colors
 $ms-color-presence-available:          #7FBA00;
 $ms-color-presence-away:               #FCD116;
@@ -122,55 +103,6 @@ $ms-Persona-presenceBorder: 2px;
     // Using important to override all of the more specific initialsIsColor rules
     background-color: Window !important;
   }
-
-  &.initialsIsLightBlue {
-    background-color: $ms-color-initials-lightBlue;
-  }
-  &.initialsIsBlue {
-    background-color: $ms-color-initials-blue;
-  }
-  &.initialsIsDarkBlue {
-    background-color: $ms-color-initials-darkBlue;
-  }
-  &.initialsIsTeal {
-    background-color: $ms-color-initials-teal;
-  }
-  &.initialsIsLightGreen {
-    background-color: $ms-color-initials-lightGreen;
-  }
-  &.initialsIsGreen {
-    background-color: $ms-color-initials-green;
-  }
-  &.initialsIsDarkGreen {
-    background-color: $ms-color-initials-darkGreen;
-  }
-  &.initialsIsLightPink {
-    background-color: $ms-color-initials-lightPink;
-  }
-  &.initialsIsPink {
-    background-color: $ms-color-initials-pink;
-  }
-  &.initialsIsMagenta {
-    background-color: $ms-color-initials-magenta;
-  }
-  &.initialsIsPurple {
-    background-color: $ms-color-initials-purple;
-  }
-  &.initialsIsBlack {
-    background-color: $ms-color-initials-black;
-  }
-  &.initialsIsOrange {
-    background-color: $ms-color-initials-orange;
-  }
-  &.initialsIsRed {
-    background-color: $ms-color-initials-red;
-  }
-  &.initialsIsDarkRed {
-    background-color: $ms-color-initials-darkRed;
-  }
-  &.initialsIsTransparent {
-    background-color: $ms-color-initials-transparent;
-  }
 }
 
 .image {
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
index 12a37f0c16b93..180e8e2df2111 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
@@ -33,22 +33,6 @@ describe('Persona', () => {
   });
 
   describe('initials and colors', () => {
-    it('renders with expected initialsColor if none was provided', () => {
-      const wrapper = mount(<Persona primaryText='Kat Larrson' />);
-      let result = wrapper.find(STYLES.black);
-      expect(result).toHaveLength(1);
-
-      const wrapper2 = mount(<Persona primaryText='Annie Lindqvist' />);
-      result = wrapper2.find(STYLES.green);
-      expect(result).toHaveLength(1);
-    });
-
-    it('uses provided initialsColor if one was specified', () => {
-      const wrapper = mount(<Persona primaryText='Kat Larrson' initialsColor={ PersonaInitialsColor.red } />);
-      let result = wrapper.find(STYLES.red);
-      expect(result).toHaveLength(1);
-    });
-
     it('calculates an expected initials in LTR if one was not specified', () => {
       let wrapper = mount(<Persona primaryText='Kat Larrson' />);
       let result = wrapper.find(STYLES.initials);
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts b/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts
index 40825044261f4..0b6d45420933b 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts
@@ -66,7 +66,7 @@ export interface IPersonaProps extends React.HTMLAttributes<Persona> {
    * The background color when the user's initials are displayed.
    * @defaultvalue [Derived from primaryText]
    */
-  initialsColor?: PersonaInitialsColor;
+  initialsColor?: PersonaInitialsColor | string;
 
   /**
    * Presence of the person to display - will not display presence if undefined.
@@ -208,7 +208,7 @@ export enum PersonaInitialsColor {
   red = 13,
   darkRed = 14,
   /**
-   * Tranparent is not intended to be used with typical initials due to accessibility issues.
+   * Transparent is not intended to be used with typical initials due to accessibility issues.
    * Its primary use is for overflow buttons, so it is considered a reserved color and can only be set with overrides.
    */
   transparent = 15,
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
index 93b5262c3f6b4..badfcc7fd1f2d 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
@@ -16,7 +16,6 @@ import {
   PersonaSize
 } from './Persona.types';
 import {
-  PERSONA_INITIALS_COLOR,
   PERSONA_SIZE
 } from './PersonaConsts';
 import {
@@ -43,31 +42,8 @@ const SIZE_TO_PIXELS: { [key: number]: number } = {
   [PersonaSize.size72]: 72,
   [PersonaSize.size100]: 100
 };
-
-/**
- * These colors are considered reserved colors and can only be set with overrides:
- * - Red is a color that often has a special meaning.
- * - Transparent is not intended to be used with typical initials due to accessibility issues,
- *   its primary use is for Facepile overflow buttons.
- */
-const COLOR_SWATCHES_LOOKUP: PersonaInitialsColor[] = [
-  PersonaInitialsColor.lightGreen,
-  PersonaInitialsColor.lightBlue,
-  PersonaInitialsColor.lightPink,
-  PersonaInitialsColor.green,
-  PersonaInitialsColor.darkGreen,
-  PersonaInitialsColor.pink,
-  PersonaInitialsColor.magenta,
-  PersonaInitialsColor.purple,
-  PersonaInitialsColor.black,
-  PersonaInitialsColor.teal,
-  PersonaInitialsColor.blue,
-  PersonaInitialsColor.darkBlue,
-  PersonaInitialsColor.orange,
-  PersonaInitialsColor.darkRed
-];
-
-const COLOR_SWATCHES_NUM_ENTRIES = COLOR_SWATCHES_LOOKUP.length;
+import { mergeStyles } from '../../Styling';
+import { initialsColorPropToColorCode } from './PersonaInitialsColor';
 
 export interface IPersonaState {
   isImageLoaded?: boolean;
@@ -108,8 +84,6 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
     let divProps = getNativeProps(this.props, divProperties);
     let coinSizeStyle = coinSize ? { width: coinSize, height: coinSize } : undefined;
 
-    initialsColor = initialsColor !== undefined && initialsColor !== null ? initialsColor : this._getColorFromName(primaryText);
-
     return (
       <div
         { ...divProps }
@@ -129,7 +103,9 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
                   className={ css(
                     'ms-Persona-initials',
                     styles.initials,
-                    PERSONA_INITIALS_COLOR[initialsColor]
+                    mergeStyles({
+                      backgroundColor: initialsColorPropToColorCode(this.props)
+                    })
                   ) }
                   style={ coinSizeStyle }
                   aria-hidden='true'
@@ -167,25 +143,6 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
     );
   }
 
-  private _getColorFromName(displayName: string | undefined): PersonaInitialsColor {
-    let color = PersonaInitialsColor.blue;
-    if (!displayName) {
-      return color;
-    }
-
-    let hashCode = 0;
-    for (let iLen: number = displayName.length - 1; iLen >= 0; iLen--) {
-      const ch: number = displayName.charCodeAt(iLen);
-      const shift: number = iLen % 8;
-      // tslint:disable-next-line:no-bitwise
-      hashCode ^= (ch << shift) + (ch >> (8 - shift));
-    }
-
-    color = COLOR_SWATCHES_LOOKUP[hashCode % COLOR_SWATCHES_NUM_ENTRIES];
-
-    return color;
-  }
-
   @autobind
   private _onRenderInitials(props: IPersonaProps): JSX.Element {
     let {
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts b/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
index 1ad6c706e40c5..d7aa2355f4ed6 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
@@ -34,23 +34,4 @@ export const PERSONA_PRESENCE: { [key: number]: string } = {
   [PersonaPresence.dnd]: 'ms-Persona--dnd ' + styles.rootIsDoNotDisturb,
   [PersonaPresence.blocked]: 'ms-Persona--blocked ' + styles.rootIsBlocked,
   [PersonaPresence.busy]: 'ms-Persona--busy ' + styles.rootIsBusy
-};
-
-export const PERSONA_INITIALS_COLOR: { [key: number]: string } = {
-  [PersonaInitialsColor.lightBlue]: 'ms-Persona-initials--lightBlue ' + styles.initialsIsLightBlue,
-  [PersonaInitialsColor.blue]: 'ms-Persona-initials--blue ' + styles.initialsIsBlue,
-  [PersonaInitialsColor.darkBlue]: 'ms-Persona-initials--darkBlue ' + styles.initialsIsDarkBlue,
-  [PersonaInitialsColor.teal]: 'ms-Persona-initials--teal ' + styles.initialsIsTeal,
-  [PersonaInitialsColor.lightGreen]: 'ms-Persona-initials--lightGreen ' + styles.initialsIsLightGreen,
-  [PersonaInitialsColor.green]: 'ms-Persona-initials--green ' + styles.initialsIsGreen,
-  [PersonaInitialsColor.darkGreen]: 'ms-Persona-initials--darkGreen ' + styles.initialsIsDarkGreen,
-  [PersonaInitialsColor.lightPink]: 'ms-Persona-initials--lightPink ' + styles.initialsIsLightPink,
-  [PersonaInitialsColor.pink]: 'ms-Persona-initials--pink ' + styles.initialsIsPink,
-  [PersonaInitialsColor.magenta]: 'ms-Persona-initials--magenta ' + styles.initialsIsMagenta,
-  [PersonaInitialsColor.purple]: 'ms-Persona-initials--purple ' + styles.initialsIsPurple,
-  [PersonaInitialsColor.black]: 'ms-Persona-initials--black ' + styles.initialsIsBlack,
-  [PersonaInitialsColor.orange]: 'ms-Persona-initials--orange ' + styles.initialsIsOrange,
-  [PersonaInitialsColor.red]: 'ms-Persona-initials--red ' + styles.initialsIsRed,
-  [PersonaInitialsColor.darkRed]: 'ms-Persona-initials--darkRed ' + styles.initialsIsDarkRed,
-  [PersonaInitialsColor.transparent]: 'ms-Persona-initials--transparent ' + styles.initialsIsTransparent
 };
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaInitialsColor.test.ts b/packages/office-ui-fabric-react/src/components/Persona/PersonaInitialsColor.test.ts
new file mode 100644
index 0000000000000..e025e390afa4a
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaInitialsColor.test.ts
@@ -0,0 +1,22 @@
+import { initialsColorPropToColorCode } from './PersonaInitialsColor';
+import { PersonaInitialsColor } from './Persona.types';
+
+describe('PersonaInitialsColor tests', () => {
+  it('renders gets the correct colors if none was provided', () => {
+    const colorCode = initialsColorPropToColorCode({ primaryText: 'Kat Larrson' });
+    expect(colorCode).toEqual('#1D1D1D');
+
+    const colorCode2 = initialsColorPropToColorCode({ primaryText: 'Annie Lindqvist' });
+    expect(colorCode2).toEqual('#00A300');
+  });
+
+  it('uses provided enum initialsColor if one was specified', () => {
+    const colorCode = initialsColorPropToColorCode({ primaryText: 'Kat Larrson', initialsColor: PersonaInitialsColor.red });
+    expect(colorCode).toEqual('#EE1111');
+  });
+
+  it('uses provided string initialsColor if one was specified', () => {
+    const colorCode = initialsColorPropToColorCode({ primaryText: 'Christian Gonzalez', initialsColor: 'blue' });
+    expect(colorCode).toEqual('blue');
+  });
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaInitialsColor.ts b/packages/office-ui-fabric-react/src/components/Persona/PersonaInitialsColor.ts
new file mode 100644
index 0000000000000..0bbc1ed99de78
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaInitialsColor.ts
@@ -0,0 +1,95 @@
+import { PersonaInitialsColor, IPersonaProps } from './Persona.types';
+
+/**
+ * These colors are considered reserved colors and can only be set with overrides:
+ * - Red is a color that often has a special meaning.
+ * - Transparent is not intended to be used with typical initials due to accessibility issues,
+ *   its primary use is for Facepile overflow buttons.
+ */
+const COLOR_SWATCHES_LOOKUP: PersonaInitialsColor[] = [
+  PersonaInitialsColor.lightGreen,
+  PersonaInitialsColor.lightBlue,
+  PersonaInitialsColor.lightPink,
+  PersonaInitialsColor.green,
+  PersonaInitialsColor.darkGreen,
+  PersonaInitialsColor.pink,
+  PersonaInitialsColor.magenta,
+  PersonaInitialsColor.purple,
+  PersonaInitialsColor.black,
+  PersonaInitialsColor.teal,
+  PersonaInitialsColor.blue,
+  PersonaInitialsColor.darkBlue,
+  PersonaInitialsColor.orange,
+  PersonaInitialsColor.darkRed
+];
+
+const COLOR_SWATCHES_NUM_ENTRIES = COLOR_SWATCHES_LOOKUP.length;
+
+function getInitialsColorFromName(displayName: string | undefined): PersonaInitialsColor {
+  let color = PersonaInitialsColor.blue;
+  if (!displayName) {
+    return color;
+  }
+
+  let hashCode = 0;
+  for (let iLen: number = displayName.length - 1; iLen >= 0; iLen--) {
+    const ch: number = displayName.charCodeAt(iLen);
+    const shift: number = iLen % 8;
+    // tslint:disable-next-line:no-bitwise
+    hashCode ^= (ch << shift) + (ch >> (8 - shift));
+  }
+
+  color = COLOR_SWATCHES_LOOKUP[hashCode % COLOR_SWATCHES_NUM_ENTRIES];
+
+  return color;
+}
+
+function personaInitialsColorToHexCode(personaInitialsColor: PersonaInitialsColor): string {
+  switch (personaInitialsColor) {
+    case PersonaInitialsColor.lightBlue:
+      return '#6BA5E7';
+    case PersonaInitialsColor.blue:
+      return '#2D89EF';
+    case PersonaInitialsColor.darkBlue:
+      return '#2B5797';
+    case PersonaInitialsColor.teal:
+      return '#00ABA9';
+    case PersonaInitialsColor.lightGreen:
+      return '#99B433';
+    case PersonaInitialsColor.green:
+      return '#00A300';
+    case PersonaInitialsColor.darkGreen:
+      return '#1E7145';
+    case PersonaInitialsColor.lightPink:
+      return '#E773BD';
+    case PersonaInitialsColor.pink:
+      return '#FF0097';
+    case PersonaInitialsColor.magenta:
+      return ' #7E3878';
+    case PersonaInitialsColor.purple:
+      return '#603CBA';
+    case PersonaInitialsColor.black:
+      return '#1D1D1D';
+    case PersonaInitialsColor.orange:
+      return '#DA532C';
+    case PersonaInitialsColor.red:
+      return '#EE1111';
+    case PersonaInitialsColor.darkRed:
+      return '#B91D47';
+    case PersonaInitialsColor.transparent:
+      return 'transparent';
+  }
+}
+
+export function initialsColorPropToColorCode(props: IPersonaProps): string {
+  let { initialsColor, primaryText } = props;
+  let initialsColorCode: string;
+  if (typeof initialsColor === 'string') {
+    initialsColorCode = initialsColor;
+  } else {
+    initialsColor = initialsColor !== undefined ? initialsColor : getInitialsColorFromName(primaryText);
+    initialsColorCode = personaInitialsColorToHexCode(initialsColor);
+  }
+
+  return initialsColorCode;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap
index 72cac84392c73..62730d70580aa 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap
@@ -107,7 +107,11 @@ exports[`Persona renders Persona correctly with initials 1`] = `
     >
       <div
         aria-hidden="true"
-        className="ms-Persona-initials ms-Persona-initials--black undefined"
+        className=
+            ms-Persona-initials
+            {
+              background-color: #1D1D1D;
+            }
         style={undefined}
       >
         <span>

From e879e70d7d31f248574129709c49e08528a99630 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Wed, 6 Dec 2017 14:40:02 -0800
Subject: [PATCH 1116/1641] ComboBox: Polish Scrolling (#3533)

* polish comboBox scrolling

* rush change
---
 ...lin-ComboBoxScrollingPolish_2017-12-06-21-33.json | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.tsx             | 12 ++++++++++--
 2 files changed, 21 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxScrollingPolish_2017-12-06-21-33.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxScrollingPolish_2017-12-06-21-33.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxScrollingPolish_2017-12-06-21-33.json
new file mode 100644
index 0000000000000..f2f38e332d86e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxScrollingPolish_2017-12-06-21-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Update scrolling behavior to behave as expected",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 079e376d4c2a1..3dfed90421424 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -199,7 +199,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     if (isOpen &&
       (!prevState.isOpen ||
         prevState.currentPendingValueValidIndex !== currentPendingValueValidIndex)) {
-      this._scrollIntoView();
+      // Need this timeout so that the selectedElement ref is correctly updated
+      this._async.setTimeout(() => this._scrollIntoView(), 0);
     }
 
     // If we are open or we are focused but are not the activeElement,
@@ -1027,7 +1028,14 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
           let scrollableParentRect = this._comboBoxMenu.offsetParent.getBoundingClientRect();
           let selectedElementRect = this._selectedElement.offsetParent.getBoundingClientRect();
 
-          if (scrollableParentRect.top + scrollableParentRect.height <= selectedElementRect.top) {
+          // If we are completely in view then we do not need to scroll
+          if (scrollableParentRect.top <= selectedElementRect.top &&
+            scrollableParentRect.top + scrollableParentRect.height >= selectedElementRect.top + selectedElementRect.height) {
+            return;
+          }
+
+          // If we are lower than the scrollable parent viewport then we should align to the bottom
+          if (scrollableParentRect.top + scrollableParentRect.height <= selectedElementRect.top + selectedElementRect.height) {
             alignToTop = false;
           }
         }

From bd54e66ee163aa7fa3255a7011566b4a5073be02 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 6 Dec 2017 23:00:38 +0000
Subject: [PATCH 1117/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...sgo-persona-refactor_2017-12-02-01-13.json | 11 -----------
 ...boBoxScrollingPolish_2017-12-06-21-33.json | 11 -----------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 11 files changed, 35 insertions(+), 30 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/chrisgo-persona-refactor_2017-12-02-01-13.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxScrollingPolish_2017-12-06-21-33.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 64e21815eaad4..bf74dfbb54a9f 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.29.4 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.5 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 5c9324b153865..c7c3a0362fea3 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.29.4 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.5 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 5d0b048cee135..b29e05f025508 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.29.4 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.5 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 2bcc2b845a155..fe25d9031d29c 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.29.4 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.5 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 909fdaebb4fbf..dc6650b15cdcf 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -30,7 +30,7 @@
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/styling": ">=5.14.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.29.4 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.5 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/chrisgo-persona-refactor_2017-12-02-01-13.json b/common/changes/office-ui-fabric-react/chrisgo-persona-refactor_2017-12-02-01-13.json
deleted file mode 100644
index 6a12c11702dc0..0000000000000
--- a/common/changes/office-ui-fabric-react/chrisgo-persona-refactor_2017-12-02-01-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Persona: Allow for consumers to provide custom colors",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxScrollingPolish_2017-12-06-21-33.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxScrollingPolish_2017-12-06-21-33.json
deleted file mode 100644
index f2f38e332d86e..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxScrollingPolish_2017-12-06-21-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Update scrolling behavior to behave as expected",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index f76fa7bd68c6b..a8449b0eb7bea 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.29.4 <6.0.0",
+    "office-ui-fabric-react": ">=5.29.5 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index d724b2eeb884f..1634a6f4c8148 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.29.5",
+      "tag": "office-ui-fabric-react_v5.29.5",
+      "date": "Wed, 06 Dec 2017 23:00:38 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "7f5ba6a8ed47a195bf4ae6d533a62670bbcd1161",
+            "comment": "Persona: Allow for consumers to provide custom colors"
+          },
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "e879e70d7d31f248574129709c49e08528a99630",
+            "comment": "ComboBox: Update scrolling behavior to behave as expected"
+          }
+        ]
+      }
+    },
     {
       "version": "5.29.4",
       "tag": "office-ui-fabric-react_v5.29.4",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 42ada9a1b23e7..5c5a7335e4bf9 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 06 Dec 2017 17:38:45 GMT and should not be manually modified.
+This log was last generated on Wed, 06 Dec 2017 23:00:38 GMT and should not be manually modified.
+
+## 5.29.5
+Wed, 06 Dec 2017 23:00:38 GMT
+
+### Patches
+
+- Persona: Allow for consumers to provide custom colors
+- ComboBox: Update scrolling behavior to behave as expected
 
 ## 5.29.4
 Wed, 06 Dec 2017 17:38:45 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index b77c3c779bb60..683a228d9783b 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.29.4",
+  "version": "5.29.5",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 832679132dc5e20301028b57f4a5b23ee1b86a7e Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Wed, 6 Dec 2017 18:25:32 -0800
Subject: [PATCH 1118/1641] BaseButton: Add prop to expose
 getSplitButtonClassnames func. (#3534)

* Expose getSplitButtonClassnames as a prop

* Add change file
---
 ...eGetSplitButtonClassNames_2017-12-06-22-52.json | 11 +++++++++++
 .../src/components/Button/BaseButton.tsx           | 14 +++++++++++---
 .../src/components/Button/Button.types.ts          | 11 +++++++++++
 3 files changed, 33 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/malozano-ExposeGetSplitButtonClassNames_2017-12-06-22-52.json

diff --git a/common/changes/office-ui-fabric-react/malozano-ExposeGetSplitButtonClassNames_2017-12-06-22-52.json b/common/changes/office-ui-fabric-react/malozano-ExposeGetSplitButtonClassNames_2017-12-06-22-52.json
new file mode 100644
index 0000000000000..02090628a3639
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-ExposeGetSplitButtonClassNames_2017-12-06-22-52.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "BaseButton: Expose getSplitButtonClassNames func as a prop to be able to override it.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 16c7497b872a8..2a9efd35a589a 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -15,7 +15,7 @@ import { DirectionalHint } from '../../common/DirectionalHint';
 import { ContextualMenu, IContextualMenuProps } from '../../ContextualMenu';
 import { IButtonProps, IButton } from './Button.types';
 import { IButtonClassNames, getBaseButtonClassNames } from './BaseButton.classNames';
-import { getClassNames as getSplitButtonClassNames, ISplitButtonClassNames } from './SplitButton/SplitButton.classNames';
+import { getClassNames as getBaseSplitButtonClassNames, ISplitButtonClassNames } from './SplitButton/SplitButton.classNames';
 
 export interface IBaseButtonProps extends IButtonProps {
   baseClassName?: string;
@@ -402,10 +402,18 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     const {
       styles = {},
       disabled,
-      checked
+      checked,
+      getSplitButtonClassNames
     } = this.props;
 
-    const classNames = styles && getSplitButtonClassNames(styles!, !!disabled, !!this.state.menuProps, !!checked);
+    const classNames = getSplitButtonClassNames ? getSplitButtonClassNames(
+      !!disabled,
+      !!this.state.menuProps,
+      !!checked) : styles && getBaseSplitButtonClassNames(
+        styles!,
+        !!disabled,
+        !!this.state.menuProps,
+        !!checked);
 
     return (
       <div
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.types.ts b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
index aaf337e22fffb..2413813232800 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
@@ -2,6 +2,7 @@ import * as React from 'react';
 import { BaseButton } from './BaseButton';
 import { Button } from './Button';
 import { IButtonClassNames } from './BaseButton.classNames';
+import { ISplitButtonClassNames } from './SplitButton/SplitButton.classNames';
 import { IRenderFunction } from '../../Utilities';
 import { IContextualMenuProps } from '../../ContextualMenu';
 import { IIconProps } from '../../Icon';
@@ -207,6 +208,16 @@ export interface IButtonProps extends React.AllHTMLAttributes<HTMLAnchorElement
     checked: boolean,
     expanded: boolean,
     isSplit: boolean | undefined) => IButtonClassNames;
+
+  /**
+  * Method to provide the classnames to style a button.
+  * The default value for this prop is the getClassnames func
+  * defined in BaseButton.classnames.
+  * @default getBaseSplitButtonClassNames
+  */
+  getSplitButtonClassNames?: (disabled: boolean,
+    expanded: boolean,
+    checked: boolean) => ISplitButtonClassNames;
 }
 
 export enum ElementType {

From 102bec79291519ee0709632f0846936945611042 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Wed, 6 Dec 2017 19:32:28 -0800
Subject: [PATCH 1119/1641] ComboBox: Fix blur from processing when clicking on
 elements inside of the comboBox (#3538)

* fix comboBoxes so they don't fire onBlur when it comes due to an element inside of the comboBox

* rush change
---
 ...FixComboBoxBlurClickIssue_2017-12-07-03-10.json | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.tsx           | 14 +++++++++++++-
 2 files changed, 24 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-FixComboBoxBlurClickIssue_2017-12-07-03-10.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-FixComboBoxBlurClickIssue_2017-12-07-03-10.json b/common/changes/office-ui-fabric-react/jspurlin-FixComboBoxBlurClickIssue_2017-12-07-03-10.json
new file mode 100644
index 0000000000000..93bf0f99c92b3
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-FixComboBoxBlurClickIssue_2017-12-07-03-10.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Update onBlur to do nothing if the event came from an element inside of the  comboBox",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 3dfed90421424..4a6628da28c25 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -733,7 +733,19 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * and submit any pending value
    */
   @autobind
-  private _onBlur() {
+  private _onBlur(event: React.FocusEvent<HTMLInputElement>) {
+
+    // Do nothing if the blur is coming from something
+    // inside the comboBox root or the comboBox menu since
+    // it we are not really bluring from the whole comboBox
+    if (event.relatedTarget &&
+      (this.refs.root && this.refs.root.contains(event.relatedTarget as HTMLElement) ||
+        this._comboBoxMenu && this._comboBoxMenu.contains(event.relatedTarget as HTMLElement))) {
+      event.preventDefault();
+      event.stopPropagation();
+      return;
+    }
+
     if (this.state.focused) {
       this.setState({ focused: false });
       this._submitPendingValue();

From 4d2b36ac88e8f17f2bfae11a65fb1dd44513f841 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 7 Dec 2017 03:44:42 +0000
Subject: [PATCH 1120/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...mboBoxBlurClickIssue_2017-12-07-03-10.json | 11 ----------
 ...plitButtonClassNames_2017-12-06-22-52.json | 11 ----------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 21 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 13 +++++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 11 files changed, 40 insertions(+), 30 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-FixComboBoxBlurClickIssue_2017-12-07-03-10.json
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-ExposeGetSplitButtonClassNames_2017-12-06-22-52.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index bf74dfbb54a9f..7f8e5825a4f0b 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.29.5 <6.0.0",
+    "office-ui-fabric-react": ">=5.30.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index c7c3a0362fea3..d408bc9b6650c 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.29.5 <6.0.0",
+    "office-ui-fabric-react": ">=5.30.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index b29e05f025508..8a9bc46bb3d12 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.29.5 <6.0.0",
+    "office-ui-fabric-react": ">=5.30.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index fe25d9031d29c..909c361b44c73 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.29.5 <6.0.0",
+    "office-ui-fabric-react": ">=5.30.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index dc6650b15cdcf..d2e91896dbd0b 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -30,7 +30,7 @@
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/styling": ">=5.14.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.29.5 <6.0.0",
+    "office-ui-fabric-react": ">=5.30.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/jspurlin-FixComboBoxBlurClickIssue_2017-12-07-03-10.json b/common/changes/office-ui-fabric-react/jspurlin-FixComboBoxBlurClickIssue_2017-12-07-03-10.json
deleted file mode 100644
index 93bf0f99c92b3..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-FixComboBoxBlurClickIssue_2017-12-07-03-10.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Update onBlur to do nothing if the event came from an element inside of the  comboBox",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/malozano-ExposeGetSplitButtonClassNames_2017-12-06-22-52.json b/common/changes/office-ui-fabric-react/malozano-ExposeGetSplitButtonClassNames_2017-12-06-22-52.json
deleted file mode 100644
index 02090628a3639..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-ExposeGetSplitButtonClassNames_2017-12-06-22-52.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "BaseButton: Expose getSplitButtonClassNames func as a prop to be able to override it.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index a8449b0eb7bea..dfc0c0a8f9d02 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.29.5 <6.0.0",
+    "office-ui-fabric-react": ">=5.30.0 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 1634a6f4c8148..94f11570e7fa9 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,27 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.30.0",
+      "tag": "office-ui-fabric-react_v5.30.0",
+      "date": "Thu, 07 Dec 2017 03:44:42 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "102bec79291519ee0709632f0846936945611042",
+            "comment": "ComboBox: Update onBlur to do nothing if the event came from an element inside of the  comboBox"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "832679132dc5e20301028b57f4a5b23ee1b86a7e",
+            "comment": "BaseButton: Expose getSplitButtonClassNames func as a prop to be able to override it."
+          }
+        ]
+      }
+    },
     {
       "version": "5.29.5",
       "tag": "office-ui-fabric-react_v5.29.5",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 5c5a7335e4bf9..ef5909c683f9e 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 06 Dec 2017 23:00:38 GMT and should not be manually modified.
+This log was last generated on Thu, 07 Dec 2017 03:44:42 GMT and should not be manually modified.
+
+## 5.30.0
+Thu, 07 Dec 2017 03:44:42 GMT
+
+### Minor changes
+
+- BaseButton: Expose getSplitButtonClassNames func as a prop to be able to override it.
+
+### Patches
+
+- ComboBox: Update onBlur to do nothing if the event came from an element inside of the  comboBox
 
 ## 5.29.5
 Wed, 06 Dec 2017 23:00:38 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 683a228d9783b..78e0e3e794caa 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.29.5",
+  "version": "5.30.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 4e7e80e3205a9ca25dd00993c006faf7b9e50be6 Mon Sep 17 00:00:00 2001
From: Michael Loughry <miclo@microsoft.com>
Date: Thu, 7 Dec 2017 12:42:44 -0800
Subject: [PATCH 1121/1641] Observe deprecated isDisabled property (#3539)

* Properly observe deprecated `isDisabled` property

* Add change file
---
 .../src/stories/ContextualMenu.stories.tsx    |  5 +++
 ...-isdisabled-property_2017-12-07-19-50.json | 11 +++++
 .../ContextualMenu/ContextualMenu.test.tsx    | 40 +++++++++++++++++++
 .../ContextualMenu/ContextualMenu.tsx         | 18 +++++----
 4 files changed, 67 insertions(+), 7 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/observe-deprecated-isdisabled-property_2017-12-07-19-50.json

diff --git a/apps/vr-tests/src/stories/ContextualMenu.stories.tsx b/apps/vr-tests/src/stories/ContextualMenu.stories.tsx
index f391e0d9b90c7..4f8dda89f37f2 100644
--- a/apps/vr-tests/src/stories/ContextualMenu.stories.tsx
+++ b/apps/vr-tests/src/stories/ContextualMenu.stories.tsx
@@ -30,6 +30,11 @@ const items = [
     key: 'disabled',
     name: 'Disabled item',
     disabled: true
+  },
+  {
+    key: 'isDisabled',
+    name: 'isDisabled item',
+    isDisabled: true
   }
 ];
 
diff --git a/common/changes/office-ui-fabric-react/observe-deprecated-isdisabled-property_2017-12-07-19-50.json b/common/changes/office-ui-fabric-react/observe-deprecated-isdisabled-property_2017-12-07-19-50.json
new file mode 100644
index 0000000000000..88ec5bf93fb5b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/observe-deprecated-isdisabled-property_2017-12-07-19-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: properly observe deprecated `isDisabled` property (until we remove the property)",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "miclo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
index 24176c6dc6f89..2c6e256f94518 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
@@ -205,6 +205,46 @@ describe('ContextualMenu', () => {
     expect(document.querySelector('.SubMenuClass')).toBeDefined();
   });
 
+  it('applies disabled property when `disabled` is true', () => {
+    const items: IContextualMenuItem[] = [
+      {
+        name: 'TestText 1',
+        key: 'TestKey1',
+        disabled: true,
+      },
+    ];
+
+    ReactTestUtils.renderIntoDocument<ContextualMenu>(
+      <ContextualMenu
+        items={ items }
+      />
+    );
+
+    let menuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
+
+    expect(menuItem.disabled).toBeTruthy();
+  });
+
+  it('applies disabled property when deprecated property `isDisabled` is true', () => {
+    const items: IContextualMenuItem[] = [
+      {
+        name: 'TestText 1',
+        key: 'TestKey1',
+        isDisabled: true,
+      },
+    ];
+
+    ReactTestUtils.renderIntoDocument<ContextualMenu>(
+      <ContextualMenu
+        items={ items }
+      />
+    );
+
+    let menuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
+
+    expect(menuItem.disabled).toBeTruthy();
+  });
+
   it('renders headers properly', () => {
     const items: IContextualMenuItem[] = [
       {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index f90d541c2317c..1448f365dceec 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -344,7 +344,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     let getClassNames = item.getItemClassNames || getItemClassNames;
     let itemClassNames = getClassNames(
       this.props.theme!,
-      !!item.disabled,
+      this._isItemDisabled(item),
       (this.state.expandedMenuItemKey === item.key),
       !!getIsChecked(item),
       !!item.href,
@@ -475,7 +475,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
           role='menuitem'
           aria-posinset={ focusableElementIndex + 1 }
           aria-setsize={ totalItemCount }
-          aria-disabled={ item.isDisabled }
+          aria-disabled={ this._isItemDisabled(item) }
           style={ item.style }
           onClick={ this._onAnchorClick.bind(this, item) }
         >
@@ -513,7 +513,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       onMouseLeave: this._onMouseItemLeave.bind(this, item),
       onMouseDown: (ev: any) => this._onItemMouseDown(item, ev),
       onMouseMove: this._onItemMouseMove.bind(this, item),
-      disabled: item.isDisabled || item.disabled,
+      disabled: this._isItemDisabled(item),
       href: item.href,
       title: item.title,
       'aria-label': ariaLabel,
@@ -523,7 +523,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       'aria-checked': isChecked,
       'aria-posinset': focusableElementIndex + 1,
       'aria-setsize': totalItemCount,
-      'aria-disabled': item.isDisabled,
+      'aria-disabled': this._isItemDisabled(item),
       role: item.role || defaultRole,
       style: item.style
     };
@@ -546,7 +546,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     return (
       <div
         aria-labelledby={ item.ariaLabel }
-        aria-disabled={ item.isDisabled || item.disabled }
+        aria-disabled={ this._isItemDisabled(item) }
         aria-haspopup={ true }
         aria-describedby={ item.ariaDescription }
         aria-checked={ item.isChecked || item.checked }
@@ -571,7 +571,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
     const itemProps = {
       onClick: this._executeItemClick.bind(this, item),
-      disabled: item.disabled || item.primaryDisabled,
+      disabled: this._isItemDisabled(item) || item.primaryDisabled,
       name: item.name,
       className: classNames.splitPrimary,
       role: item.role || defaultRole,
@@ -589,7 +589,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   private _renderSplitIconButton(item: IContextualMenuItem, classNames: IMenuItemClassNames, index: number) {
     const itemProps = {
       onClick: this._onItemClick.bind(this, item),
-      disabled: item.disabled,
+      disabled: this._isItemDisabled(item),
       className: classNames.splitMenu,
       subMenuProps: item.subMenuProps,
       submenuIconProps: item.submenuIconProps,
@@ -910,4 +910,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       this._targetWindow = getWindow()!;
     }
   }
+
+  private _isItemDisabled(item: IContextualMenuItem): boolean {
+    return !!(item.isDisabled || item.disabled);
+  }
 }

From 2c399b1a3ddf10b8707e66ec53f3f1bbaf3d0a65 Mon Sep 17 00:00:00 2001
From: John Miller <rubixws@gmail.com>
Date: Thu, 7 Dec 2017 14:16:26 -0800
Subject: [PATCH 1122/1641] Adding experimental components Coachmark and
 Positioning Container (#3445)

* Adding Coachmark Files

* Adding IStyle to coachmark

* Removed i Style from props

* Added nav entry to AppDefinition

* Added Coachmark page and example

* Adding layer to Coachmark

* Adding Callout container bits

* Removing sass file calloutContainer

* Updating CalloutContainer with all the original positioning bits.

* Added classNames to classNames file

* Fixed import in CalloutContainer

* Adding CalloutContainer (ContextualSurface) to the experiments demo site.

* Removing beak styling

* Adding the callout basic example

* Updating target to be a css query selector.

* Renaming CalloutContainer to ContextualSurface

* Renaming folder to ContextualSurface

* Renaming main export file

* Adding main containers for Coachmark

* Renaming ContextualSurface to DynamicallyPositionedContainer

* Renaming classNames file

* Updates to coachmark props.

* Adding DynamicallyPostionedContainer files.

* Updating name in appdefinition to DynamicallyPositionedContainer

* Added @todo for calloutElementRect.

* Adding states and setting

* temporarily adding IStyleFunction

* Adding style functions to Coachmark.Styles

* Updating comment about maxHeight

* Updated classes with mergeStyle classes.

* Fixed the interface for mergeStyles.

* Updated coachmark example with bits

* Updating public css classnames for DynamicallyPositionedContainer

* Adding target

* Adding positioningTarget and positioningContainer props.

* Updating example data

* Added button to example

* Updating example selection method.

* Chaning class to entity host

* Added entity inner host

* Updated coachmark selection method.

* Converted the element proximity binding from knockout.

* More updates to Coachmark

* Adding proximity functionality

* Adding new mouseProximityOffset

* Few more bug fixes

* Making Proximity Offset optional

* Cleaned up coachmark, removed dead properties, added several comments.

* Making mouse proximity offset optional

* Adding debugging in chrome for visual studio code.

* Fixing a few rendering order issues with coachmark.

* Fixing some styles for specific states.

* Removing element proxmity

* Adding new properties

* Adding new references to HTML elements.

* Fixed a couple items in Coachmark

* Removing unused property

* Rename Dynamically Positioned Container to PositioningContainer.

* Adding new Beak component bare files.

* Removing beak for now, adding to a different pull request.

* Removing callout artifacts and general cleanup.

* Updating the name of the props

* Removing useless callback

* Adding dos and don'ts for coachmark.

* Adding beak control

* Updating coachmark description

* Renaming files

* Renaming coachmark styles to styles

* Fixing reference names

* state and property name changes, more renaming of references.

* Renaming beak styles file.

* Adding styles to index export

* Addressing a few PR nits

* Remvoing references to callout

* Removing useTargetPoint

* Removing extra comma.

* Removing beak

* Adding the beak component back with the correct casing

* Updating create component script to create the correct name for the mergeStyles file.

* Adding the beak bits

* Removing the beak for this pull request.

* Removing beak top level import.

* Updating styles to new method.

* Fixing references to file-type-icons

* Nits and fixing some build errors from other projects.
---
 packages/experiments/.vscode/launch.json      |  15 +
 packages/experiments/package.json             |   1 +
 packages/experiments/src/Coachmark.ts         |   1 +
 .../experiments/src/PositioningContainer.ts   |   1 +
 .../components/Coachmark/Coachmark.styles.ts  | 373 ++++++++++++++++
 .../src/components/Coachmark/Coachmark.tsx    | 230 ++++++++++
 .../components/Coachmark/Coachmark.types.ts   |  52 +++
 .../components/Coachmark/CoachmarkPage.tsx    |  65 +++
 .../examples/Coachmark.Basic.Example.tsx      |  69 +++
 .../src/components/Coachmark/index.ts         |   2 +
 .../examples/FileTypeIcon.Basic.Example.tsx   |   2 +-
 .../PositioningContainer.styles.ts            |  68 +++
 .../PositioningContainer.tsx                  | 401 ++++++++++++++++++
 .../PositioningContainer.types.ts             | 164 +++++++
 .../PositioningContainerPage.tsx              |  56 +++
 .../PositioningContainer.Basic.Example.tsx    |  56 +++
 .../components/PositioningContainer/index.ts  |   2 +
 .../experiments/src/demo/AppDefinition.tsx    |  12 +
 packages/experiments/src/demo/index.tsx       |   2 +-
 .../src/components/Callout/CalloutContent.tsx |   1 +
 scripts/create-component.js                   |   2 +-
 21 files changed, 1572 insertions(+), 3 deletions(-)
 create mode 100644 packages/experiments/.vscode/launch.json
 create mode 100644 packages/experiments/src/Coachmark.ts
 create mode 100644 packages/experiments/src/PositioningContainer.ts
 create mode 100644 packages/experiments/src/components/Coachmark/Coachmark.styles.ts
 create mode 100644 packages/experiments/src/components/Coachmark/Coachmark.tsx
 create mode 100644 packages/experiments/src/components/Coachmark/Coachmark.types.ts
 create mode 100644 packages/experiments/src/components/Coachmark/CoachmarkPage.tsx
 create mode 100644 packages/experiments/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx
 create mode 100644 packages/experiments/src/components/Coachmark/index.ts
 create mode 100644 packages/experiments/src/components/PositioningContainer/PositioningContainer.styles.ts
 create mode 100644 packages/experiments/src/components/PositioningContainer/PositioningContainer.tsx
 create mode 100644 packages/experiments/src/components/PositioningContainer/PositioningContainer.types.ts
 create mode 100644 packages/experiments/src/components/PositioningContainer/PositioningContainerPage.tsx
 create mode 100644 packages/experiments/src/components/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx
 create mode 100644 packages/experiments/src/components/PositioningContainer/index.ts

diff --git a/packages/experiments/.vscode/launch.json b/packages/experiments/.vscode/launch.json
new file mode 100644
index 0000000000000..664bc6f217a2c
--- /dev/null
+++ b/packages/experiments/.vscode/launch.json
@@ -0,0 +1,15 @@
+{
+  // Use IntelliSense to learn about possible attributes.
+  // Hover to view descriptions of existing attributes.
+  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "type": "chrome",
+      "request": "launch",
+      "name": "Launch Chrome against localhost",
+      "url": "http://localhost:4322",
+      "webRoot": "${workspaceRoot}"
+    }
+  ]
+}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index dfc0c0a8f9d02..8967aad154f4b 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -30,6 +30,7 @@
     "@types/webpack-env": "1.13.0",
     "@uifabric/example-app-base": ">=5.1.2 <6.0.0",
     "@uifabric/file-type-icons": ">=0.1.0 <1.0.0",
+    "@uifabric/merge-styles": ">=5.0.0 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.0.1 <6.0.0",
     "es6-weak-map": "^2.0.2",
diff --git a/packages/experiments/src/Coachmark.ts b/packages/experiments/src/Coachmark.ts
new file mode 100644
index 0000000000000..39a5084b266ce
--- /dev/null
+++ b/packages/experiments/src/Coachmark.ts
@@ -0,0 +1 @@
+export * from './components/Coachmark/index';
\ No newline at end of file
diff --git a/packages/experiments/src/PositioningContainer.ts b/packages/experiments/src/PositioningContainer.ts
new file mode 100644
index 0000000000000..ddecfbb4488e6
--- /dev/null
+++ b/packages/experiments/src/PositioningContainer.ts
@@ -0,0 +1 @@
+export * from './components/PositioningContainer/index';
\ No newline at end of file
diff --git a/packages/experiments/src/components/Coachmark/Coachmark.styles.ts b/packages/experiments/src/components/Coachmark/Coachmark.styles.ts
new file mode 100644
index 0000000000000..985a580853ce0
--- /dev/null
+++ b/packages/experiments/src/components/Coachmark/Coachmark.styles.ts
@@ -0,0 +1,373 @@
+import { IStyle, keyframes } from '../../Styling';
+import { IRawStyleBase } from '@uifabric/merge-styles/lib/IRawStyleBase';
+
+export const themePrimary = '#0078d7';
+
+export interface ICoachmarkStyleProps {
+  /**
+   * Is the Coachmark collapsed
+   */
+  collapsed: boolean;
+
+  /**
+   * Is the beacon currently animating.
+   */
+  isBeaconAnimating: boolean;
+
+  /**
+   * Is the component taking measurements
+   */
+  isMeasuring: boolean;
+
+  /**
+   * The height measured before the component has been mounted
+   * in pixels
+   */
+  entityHostHeight?: string;
+
+  /**
+   * The width measured in pixels
+   */
+  entityHostWidth?: string;
+}
+
+export interface ICoachmarkStyles {
+  /**
+  * Style for the root element in the default enabled/unchecked state.
+  */
+  root?: IStyle;
+
+  /**
+   * The pulsing beacon that animates when the coachmark
+   * is collapsed.
+   */
+  pulsingBeacon?: IStyle;
+
+  /**
+   * The layer, or div, that the translate animation will be applied to.
+   */
+  translateAnimationContainer?: IStyle;
+
+  /**
+   * The layer the Scale animation will be applied to.
+   */
+  scaleAnimationLayer?: IStyle;
+
+  /**
+   * The layer the Rotate animation will be applied to.
+   */
+  rotateAnimationLayer?: IStyle;
+
+  /**
+   * The layer that content/components/elments will be hosted in.
+   */
+  entityHost?: IStyle;
+
+  /**
+   * The inner layer that components will be hosted in
+   * and primary purpose is scaling the layer down while the
+   * Coachmark collapsed.
+   */
+  entityInnerHost: IStyle;
+
+  /**
+   * The styles applied when the coachmark has collapsed.
+   */
+  collapsed?: IStyle;
+}
+
+export const coachmarkCollapsedSize = '36px';
+export const beaconColorOne = '#00FFEC';
+export const beaconColorTwo = '#005EDD';
+
+function continuousPulseStepOne(): IRawStyleBase {
+  return {
+    borderColor: beaconColorOne,
+    borderWidth: '0px',
+    width: '35px',
+    height: '35px'
+  };
+}
+
+function continuousPulseStepTwo(): IRawStyleBase {
+  return {
+    opacity: '1',
+    borderWidth: '10px'
+  };
+}
+
+function continuousPulseStepThree(): IRawStyleBase {
+  return {
+    opacity: 1
+  };
+}
+
+function continuousPulseStepFour(): IRawStyleBase {
+  return {
+    borderWidth: '0',
+    width: '150px',
+    height: '150px',
+    opacity: '0',
+    borderColor: beaconColorTwo
+  };
+}
+
+function continuousPulseStepFive(): IRawStyleBase {
+  return Object.assign(continuousPulseStepOne(), {
+    opacity: '0'
+  });
+}
+
+export const ContinuousPulse: string = keyframes({
+  '0%': continuousPulseStepOne(),
+  '1.42%': continuousPulseStepTwo(),
+  '3.57%': continuousPulseStepThree(),
+  '7.14%': continuousPulseStepFour(),
+  '8%': continuousPulseStepFive(),
+  '29.99%': continuousPulseStepFive(),
+  '30%': continuousPulseStepOne(),
+  '31.42%': continuousPulseStepTwo(),
+  '33.57%': continuousPulseStepThree(),
+  '37.14%': continuousPulseStepFour(),
+  '38%': continuousPulseStepFive(),
+  '79.42%': continuousPulseStepFive(),
+  '79.43': continuousPulseStepOne(),
+  '81.85': continuousPulseStepTwo(),
+  '83.42': continuousPulseStepThree(),
+  '87%': continuousPulseStepFour(),
+  '100%': {}
+});
+
+export const translateOne: string = keyframes({
+  '0%': {
+    transform: 'translate(0, 0)', // orig 25
+    animationTimingFunction: 'linear'
+  },
+  '78.57%': {
+    transform: 'translate(0, 0)', // orig 25
+    animationTimingFunction: 'cubic-bezier(0.62, 0, 0.56, 1)'
+  },
+  '82.14%': {
+    transform: 'translate(0, -5px)', // orig 20
+    animationTimingFunction: 'cubic-bezier(0.58, 0, 0, 1)'
+  },
+  '84.88%': {
+    transform: 'translate(0, 9px)', // 34
+    animationTimingFunction: 'cubic-bezier(1, 0, 0.56, 1)'
+  },
+  '88.1%': {
+    transform: 'translate(0, -2px)', // orig 23
+    animationTimingFunction: 'cubic-bezier(0.58, 0, 0.67, 1)'
+  },
+  '90.12%': {
+    transform: 'translate(0, 0)',
+    animationTimingFunction: 'linear'
+  },
+  '100%': {
+    transform: 'translate(0, 0)'
+  }
+});
+
+export const scaleOne: string = keyframes({
+  '0%': {
+    transform: ' scale(0)',
+    animationTimingFunction: 'linear'
+  },
+  '14.29%': {
+    transform: 'scale(0)',
+    animationTimingFunction: 'cubic-bezier(0.84, 0, 0.52, 0.99)'
+  },
+  '16.67%': {
+    transform: 'scale(1.15)',
+    animationTimingFunction: 'cubic-bezier(0.48, -0.01, 0.52, 1.01)'
+  },
+  '19.05%': {
+    transform: 'scale(0.95)',
+    animationTimingFunction: 'cubic-bezier(0.48, 0.02, 0.52, 0.98)'
+  },
+  '21.43%': {
+    transform: 'scale(1)',
+    animationTimingFunction: 'linear'
+  },
+  '42.86%': {
+    transform: 'scale(1)',
+    animationTimingFunction: 'cubic-bezier(0.48, -0.02, 0.52, 1.02)'
+  },
+  '45.71%': {
+    transform: 'scale(0.8)',
+    animationTimingFunction: 'cubic-bezier(0.48, 0.01, 0.52, 0.99)'
+  },
+  '50%': {
+    transform: 'scale(1)',
+    animationTimingFunction: 'linear'
+  },
+  '90.12%': {
+    transform: 'scale(1)',
+    animationTimingFunction: 'cubic-bezier(0.48, -0.02, 0.52, 1.02)'
+  },
+  '92.98%': {
+    transform: 'scale(0.8)',
+    animationTimingFunction: 'cubic-bezier(0.48, 0.01, 0.52, 0.99)'
+  },
+  '97.26%': {
+    transform: 'scale(1)',
+    animationTimingFunction: 'linear'
+  },
+  '100%': {
+    transform: 'scale(1)'
+  }
+});
+
+export const rotateOne: string = keyframes({
+  '0%': {
+    transform: 'rotate(0deg)',
+    animationTimingFunction: 'linear'
+  },
+  '83.33%': {
+    transform: ' rotate(0deg)',
+    animationTimingFunction: 'cubic-bezier(0.33, 0, 0.67, 1)'
+  },
+  '83.93%': {
+    transform: 'rotate(15deg)',
+    animationTimingFunction: 'cubic-bezier(0.33, 0, 0.67, 1)'
+  },
+  '84.52%': {
+    transform: 'rotate(-15deg)',
+    animationTimingFunction: 'cubic-bezier(0.33, 0, 0.67, 1)'
+  },
+  '85.12%': {
+    transform: 'rotate(15deg)',
+    animationTimingFunction: 'cubic-bezier(0.33, 0, 0.67, 1)'
+  },
+  '85.71%': {
+    transform: 'rotate(-15deg)',
+    animationTimingFunction: 'cubic-bezier(0.33, 0, 0.67, 1)'
+  },
+  '86.31%': {
+    transform: 'rotate(0deg)',
+    animationTimingFunction: 'linear'
+  },
+  '100%': {
+    transform: 'rotate(0deg)'
+  }
+});
+
+export function getStyles(props: ICoachmarkStyleProps): ICoachmarkStyles {
+  return {
+    root: [
+      {
+        position: 'relative'
+      }
+    ],
+    // The pulsing beacon
+    pulsingBeacon: [
+      {
+        position: 'absolute',
+        top: '50%',
+        left: '50%',
+        transform: 'translate(-50%, -50%)',
+        width: '0px',
+        height: '0px',
+        borderRadius: '225px',
+        borderStyle: 'solid',
+        opacity: '0'
+      },
+      (props.collapsed && props.isBeaconAnimating) && {
+        animationName: ContinuousPulse,
+        animationIterationCount: '1',
+        animationDuration: '14s',
+        zIndex: 1000,
+        animationDelay: '2s'
+      }
+    ],
+    // Translate Animation Layer
+    translateAnimationContainer: [
+      {
+        width: '100%',
+        height: '100%'
+      },
+      props.collapsed && {
+        animationDuration: '14s',
+        animationTimingFunction: 'linear',
+        animationDirection: 'normal',
+        animationIterationCount: '1',
+        animationDelay: '0s',
+        animationFillMode: 'forwards',
+        animationName: translateOne,
+        transition: 'opacity 0.5s ease-in-out'
+      },
+      (!props.collapsed) && {
+        opacity: '1'
+      }
+    ],
+    // Scale Animation Layer
+    scaleAnimationLayer: [
+      {
+        width: '100%',
+        height: '100%'
+      },
+      props.collapsed && {
+        animationDuration: '14s',
+        animationTimingFunction: 'linear',
+        animationDirection: 'normal',
+        animationIterationCount: '1',
+        animationDelay: '0s',
+        animationFillMode: 'forwards',
+        animationName: scaleOne
+      }
+    ],
+    // Rotate Animation Layer
+    rotateAnimationLayer: [
+      {
+        width: '100%',
+        height: '100%'
+      },
+      props.collapsed && {
+        animationDuration: '14s',
+        animationTimingFunction: 'linear',
+        animationDirection: 'normal',
+        animationIterationCount: '1',
+        animationDelay: '0s',
+        animationFillMode: 'forwards',
+        animationName: rotateOne
+      }
+    ],
+    // Layer Host, defaults to collapsed
+    entityHost: [
+      {
+        position: 'relative',
+        outline: 'none',
+        overflow: 'hidden',
+        backgroundColor: themePrimary,
+        borderRadius: coachmarkCollapsedSize,
+        opacity: '0.8',
+        transition: 'border-radius 250ms, width 500ms, height 500ms cubic-bezier(0.5, 0, 0, 1)',
+        visibility: 'hidden'
+      },
+      (!props.isMeasuring) && {
+        width: coachmarkCollapsedSize,
+        height: coachmarkCollapsedSize,
+        visibility: 'visible'
+      },
+      !props.collapsed && {
+        borderRadius: '1px',
+        opacity: '1',
+        width: props.entityHostWidth,
+        height: props.entityHostHeight
+      }
+    ],
+    entityInnerHost: [
+      {
+        transition: 'transform 500ms cubic-bezier(0.5, 0, 0, 1)',
+        transformOrigin: 'top left',
+        transform: 'scale(0)'
+      },
+      (!props.collapsed) && {
+        transform: 'scale(1)'
+      },
+      (!props.isMeasuring) && {
+        visibility: 'visible'
+      }
+    ]
+  };
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Coachmark/Coachmark.tsx b/packages/experiments/src/components/Coachmark/Coachmark.tsx
new file mode 100644
index 0000000000000..cd47d2336a6c4
--- /dev/null
+++ b/packages/experiments/src/components/Coachmark/Coachmark.tsx
@@ -0,0 +1,230 @@
+// Utilities
+import * as React from 'react';
+import { BaseComponent, classNamesFunction } from '../../Utilities';
+
+// Component Dependencies
+import { PositioningContainer } from '../PositioningContainer/PositioningContainer';
+
+// Coachmark
+import { ICoachmarkTypes } from './Coachmark.types';
+import { getStyles, ICoachmarkStyles, ICoachmarkStyleProps } from './Coachmark.styles';
+
+const getClassNames = classNamesFunction<ICoachmarkStyleProps, ICoachmarkStyles>();
+
+/**
+ * An interface for the cached dimensions of entity inner host.
+ */
+export interface IEntityRect {
+  width: number;
+  height: number;
+}
+
+export interface ICoachmarkState {
+  /**
+   * Is the Coachmark currently collapsed into
+   * a tear drop shape
+   */
+  collapsed: boolean;
+
+  /**
+   * Enables/Disables the beacon that radiates
+   * from the center of the coachmark.
+   */
+  isBeaconAnimating: boolean;
+
+  /**
+   * Is the teaching bubble currently retreiving the
+   * original dimensions of the hosted entity.
+   */
+  isMeasuring: boolean;
+
+  /**
+   * Cached width and height of _entityInnerHostElement
+   */
+  entityInnerHostRect: IEntityRect;
+
+  /**
+   * Is the mouse in proximity of the default target element
+   */
+  isMouseInProximity: boolean;
+}
+
+export class Coachmark extends BaseComponent<ICoachmarkTypes, ICoachmarkState> {
+  public static defaultProps: Partial<ICoachmarkTypes> = {
+    collapsed: true,
+    mouseProximityOffset: 100
+  };
+
+  /**
+   * The cached HTMLElement reference to the Entity Inner Host
+   * element.
+   */
+  private _entityInnerHostElement: HTMLElement;
+  private _translateAnimationContainer: HTMLElement;
+
+  constructor(props: ICoachmarkTypes) {
+    super();
+
+    // Set defaults for state
+    this.state = {
+      collapsed: props.collapsed!,
+      isBeaconAnimating: true,
+      isMeasuring: true,
+      entityInnerHostRect: {
+        width: 0,
+        height: 0
+      },
+      isMouseInProximity: true
+    };
+  }
+
+  public render(): JSX.Element {
+    let {
+      children
+    } = this.props;
+
+    const classNames = getClassNames(getStyles, {
+      collapsed: this.state.collapsed,
+      isBeaconAnimating: this.state.isBeaconAnimating,
+      isMeasuring: this.state.isMeasuring,
+      entityHostHeight: this.state.entityInnerHostRect.height + 'px',
+      entityHostWidth: this.state.entityInnerHostRect.width + 'px'
+    });
+
+    return (
+      <PositioningContainer
+        target={ this.props.target }
+      >
+        <div
+          className={ classNames.root }
+        >
+          <div className={ classNames.pulsingBeacon } />
+          <div
+            className={ classNames.translateAnimationContainer }
+            ref={ this._resolveRef('_translateAnimationContainer') }
+          >
+            <div
+              className={ classNames.scaleAnimationLayer }
+              ref={ this._resolveRef('_scaleAnimationContainer') }
+            >
+              <div
+                className={ classNames.rotateAnimationLayer }
+                ref={ this._resolveRef('_rotateAnimationContainer') }
+              >
+                <div
+                  className={ classNames.entityHost }
+                  ref={ this._resolveRef('_entityHost') }
+                >
+                  <div
+                    className={ classNames.entityInnerHost }
+                    ref={ this._resolveRef('_entityInnerHostElement') }
+                  >
+                    { children }
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </PositioningContainer>
+    );
+  }
+
+  public componentWillReceiveProps(newProps: ICoachmarkTypes): void {
+    if (this.props.collapsed && !newProps.collapsed) {
+      // The coachmark is about to open
+      this._openCoachmark();
+    }
+  }
+
+  public componentDidMount(): void {
+    // If we have already accessed the width and height
+    // We do not wan't to do it again.
+    if (this.state.isMeasuring) {
+      this._async.setTimeout((): void => {
+        if ((this.state.entityInnerHostRect.width + this.state.entityInnerHostRect.width) === 0) {
+          this.setState({
+            isMeasuring: false,
+            entityInnerHostRect: {
+              width: this._entityInnerHostElement.offsetWidth,
+              height: this._entityInnerHostElement.offsetHeight
+            }
+          });
+
+          this.forceUpdate();
+        }
+
+        // Initialize element in proximity now that initial
+        // measurements have been taken
+        this._isElementInProximity(this._entityInnerHostElement);
+      }, 10);
+    }
+  }
+
+  private _openCoachmark(): void {
+    this.setState({
+      collapsed: false
+    });
+
+    this._translateAnimationContainer.addEventListener('animationstart', (): void => {
+      if (this.props.onAnimationOpenStart) {
+        this.props.onAnimationOpenStart();
+      }
+    });
+
+    this._translateAnimationContainer.addEventListener('animationend', (): void => {
+      if (this.props.onAnimationOpenEnd) {
+        this.props.onAnimationOpenEnd();
+      }
+    });
+  }
+
+  private _isElementInProximity(targetElement: HTMLElement, mouseProximityOffset: number = 0): void {
+    /**
+     * An array of cached ids returned when setTimeout runs during
+     * the window resize event trigger.
+     */
+    let timeoutIds: number[] = [];
+
+    /**
+     * The target element the mouse would be in
+     * proximity to
+     */
+    let targetElementRect: ClientRect = targetElement.getBoundingClientRect();
+
+    // When the window resizes we want to async
+    // get the bounding client rectangle.
+    // Every time the event is triggered we wan't to
+    // setTimeout and then clear any previous instances
+    // of setTimeout.
+    this._events.on(window, 'resize', (): void => {
+      timeoutIds.forEach((value: number): void => {
+        clearInterval(value);
+      });
+
+      timeoutIds.push(this._async.setTimeout((): void => {
+        targetElementRect = targetElement.getBoundingClientRect();
+      }, 100));
+    });
+
+    // Everytime the document's mouse move is triggered
+    // we want to check if inside of an element and
+    // set the state with the result.
+    this._events.on(document, 'mousemove', (e: MouseEvent) => {
+      let mouseY = e.pageY;
+      let mouseX = e.pageX;
+      let isMouseInProximity = this._isInsideElement(targetElementRect, mouseX, mouseY);
+
+      if (isMouseInProximity !== this.state.isMouseInProximity) {
+        this.setState({
+          isMouseInProximity: isMouseInProximity
+        });
+      }
+    });
+  }
+
+  private _isInsideElement(elementRect: ClientRect, mouseX: number, mouseY: number, mouseProximityOffset: number = 0): boolean {
+    return mouseX > (elementRect.left - mouseProximityOffset) && mouseX < ((elementRect.left + elementRect.width) + mouseProximityOffset) &&
+      mouseY > (elementRect.top - mouseProximityOffset) && mouseY < ((elementRect.top + elementRect.height) + mouseProximityOffset);
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Coachmark/Coachmark.types.ts b/packages/experiments/src/components/Coachmark/Coachmark.types.ts
new file mode 100644
index 0000000000000..5c6d9f837c170
--- /dev/null
+++ b/packages/experiments/src/components/Coachmark/Coachmark.types.ts
@@ -0,0 +1,52 @@
+import * as React from 'react';
+import { Coachmark } from './Coachmark';
+import { ICoachmarkStyles, ICoachmarkStyleProps } from './Coachmark.styles';
+import { IPositioningContainerTypes } from '../PositioningContainer/PositioningContainer.types';
+import { IPoint, IStyleFunction } from '../../Utilities';
+
+export interface ICoachmark {
+}
+
+export interface ICoachmarkTypes extends React.Props<Coachmark> {
+  /**
+  * All props for your component are to be defined here.
+  */
+  componentRef?: (component: ICoachmark) => void;
+
+  /**
+   * Get styles method
+   */
+  getStyles?: IStyleFunction<ICoachmarkStyleProps, ICoachmarkStyles>;
+
+  /**
+   * The target that the TeachingBubble should try to position itself based on.
+   * It can be either an HTMLElement a querySelector string of a valid HTMLElement
+   * or a MouseEvent. If MouseEvent is given then the origin point of the event will be used.
+   */
+  target?: HTMLElement | string | MouseEvent | IPoint | null;
+
+  positioningContainerProps?: IPositioningContainerTypes;
+
+  /**
+   * Is the Coachmark expanded
+   * @default true
+   */
+  collapsed?: boolean;
+
+  /**
+   * The distance in pixels the mouse is located
+   * before opening up the coachmark.
+   * @default 100
+   */
+  mouseProximityOffset?: number;
+
+  /**
+   * Callback when the opening animation begins
+   */
+  onAnimationOpenStart?: () => void;
+
+  /**
+   * Callback when the opening animation completes
+   */
+  onAnimationOpenEnd?: () => void;
+}
diff --git a/packages/experiments/src/components/Coachmark/CoachmarkPage.tsx b/packages/experiments/src/components/Coachmark/CoachmarkPage.tsx
new file mode 100644
index 0000000000000..832aaf26af90f
--- /dev/null
+++ b/packages/experiments/src/components/Coachmark/CoachmarkPage.tsx
@@ -0,0 +1,65 @@
+import * as React from 'react';
+import {
+  ExampleCard,
+  IComponentDemoPageProps,
+  ComponentPage,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+
+import { CoachmarkBasicExample } from './examples/Coachmark.Basic.Example';
+const CoachmarkBasicExampleCode = require('!raw-loader!experiments/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx') as string;
+
+export class CoachmarkPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render(): JSX.Element {
+    return (
+      <ComponentPage
+        title='Coachmark'
+        componentName='Coachmark'
+        exampleCards={
+          <div>
+            <ExampleCard title='Coachmark Basic' isOptIn={ true } code={ CoachmarkBasicExampleCode }>
+              <CoachmarkBasicExample />
+            </ExampleCard>
+          </div>
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!experiments/src/components/coachmark/Coachmark.types.ts')
+            ] }
+          />
+        }
+        overview={
+          <div>
+            <p>Coachmarks are used to draw a persons attention to a part of the UI, and increase engagement with that element in the product.</p>
+
+            <p>
+              They should be contextual whenever possible, or related to something that will make existing user flows more efficient
+            </p>
+          </div>
+        }
+        bestPractices={
+          <div />
+        }
+        dos={
+          <div>
+            <ul>
+              <li>Only one coachmark + callout combo will be displayed at a time</li>
+              <li>Coachmarks can be stand alone or sequential. Sequential coachmarks should be used sparingly, to walk through complex multi-step interactions. It is recommended that a sequence of coachmakrs does not exceed 3 steps.</li>
+              <li>Coachmarks are designed to only hold Callouts.</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul>
+              <li>Coachmark size, color, and animation should not be altered.</li>
+              <li>Don't show the coachmark more than once even if the user has not completed the action.</li>
+            </ul>
+          </div>
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }
+      />
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx b/packages/experiments/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx
new file mode 100644
index 0000000000000..c5cbba8358257
--- /dev/null
+++ b/packages/experiments/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx
@@ -0,0 +1,69 @@
+import * as React from 'react';
+import { Coachmark } from '../Coachmark';
+import { TeachingBubbleContent } from 'office-ui-fabric-react/lib/TeachingBubble';
+import { ICalloutProps } from 'office-ui-fabric-react/lib/Callout';
+import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
+
+export interface ICoachmarkBasicExampleState {
+  isVisible?: boolean;
+  isCoachmarkCollapsed?: boolean;
+}
+
+export class CoachmarkBasicExample extends React.Component<{}, ICoachmarkBasicExampleState> {
+
+  public constructor() {
+    super();
+
+    this._onShowMenuClicked = this._onShowMenuClicked.bind(this);
+    this._onCalloutDismiss = this._onCalloutDismiss.bind(this);
+
+    this.state = {
+      isVisible: false,
+      isCoachmarkCollapsed: true
+    };
+  }
+
+  public render(): JSX.Element {
+    let { isVisible } = this.state;
+
+    const calloutProps: ICalloutProps = {
+      doNotLayer: true
+    };
+
+    return (
+      <div className='ms-CoachmarkBasicExample'>
+        <div className='ms-CoachmarkBasicExample-buttonArea'>
+          <DefaultButton
+            onClick={ this._onShowMenuClicked }
+            text={ isVisible ? 'Hide coachmark' : 'Show coachmark' }
+            className={ 'ms-Coachmark-basicExampleButton' }
+          />
+        </div>
+        { isVisible && (
+          <Coachmark
+            target={ '.ms-Coachmark-basicExampleButton' }
+          >
+            <TeachingBubbleContent
+              headline='Example Title'
+              calloutProps={ calloutProps }
+            >
+              Welcome to the land of coachmarks
+            </TeachingBubbleContent>
+          </Coachmark>
+        ) }
+      </div>
+    );
+  }
+
+  private _onShowMenuClicked(): void {
+    this.setState({
+      isVisible: !this.state.isVisible
+    });
+  }
+
+  private _onCalloutDismiss(): void {
+    this.setState({
+      isVisible: false
+    });
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Coachmark/index.ts b/packages/experiments/src/components/Coachmark/index.ts
new file mode 100644
index 0000000000000..23177803600b1
--- /dev/null
+++ b/packages/experiments/src/components/Coachmark/index.ts
@@ -0,0 +1,2 @@
+export * from './Coachmark';
+export * from './Coachmark.types';
\ No newline at end of file
diff --git a/packages/experiments/src/components/FileTypeIcon/examples/FileTypeIcon.Basic.Example.tsx b/packages/experiments/src/components/FileTypeIcon/examples/FileTypeIcon.Basic.Example.tsx
index a2ab6dc59c1a0..60be05661a12f 100644
--- a/packages/experiments/src/components/FileTypeIcon/examples/FileTypeIcon.Basic.Example.tsx
+++ b/packages/experiments/src/components/FileTypeIcon/examples/FileTypeIcon.Basic.Example.tsx
@@ -1,7 +1,7 @@
 
 import * as React from 'react';
 import { Icon } from 'office-ui-fabric-react/lib/Icon';
-import { getFileTypeIconProps, FileIconType } from '@uifabric/file-type-icons';
+import { getFileTypeIconProps, FileIconType } from '@uifabric/file-type-icons/src/index';
 
 export class FileTypeIconBasicExample extends React.Component<{}, {}> {
   public render(): JSX.Element {
diff --git a/packages/experiments/src/components/PositioningContainer/PositioningContainer.styles.ts b/packages/experiments/src/components/PositioningContainer/PositioningContainer.styles.ts
new file mode 100644
index 0000000000000..5d0a4e80c5ef6
--- /dev/null
+++ b/packages/experiments/src/components/PositioningContainer/PositioningContainer.styles.ts
@@ -0,0 +1,68 @@
+import { memoizeFunction } from '../../Utilities';
+import { mergeStyleSets } from '../../Styling';
+import { IStyle } from '../../Styling';
+
+export interface IPositioningContainerStyles {
+  /**
+  * Style for the root element in the default enabled/unchecked state.
+  */
+  root?: IStyle;
+}
+
+export interface IPositioningContainerNames {
+  /**
+   * Root html container for this component.
+   */
+  root: string;
+  container: string;
+  main: string;
+  overFlowYHidden: string;
+  beak: string;
+  beakCurtain: string;
+}
+
+// @TODO Remove this tslint disable statement after the styles are converted
+// to the updated mergeStyles method.
+/* tslint:disable */
+export function highContrastActive(styles: IStyle): any {
+  return {
+    '@media screen and (-ms-high-contrast: active)': styles
+  };
+}
+
+export function focusClear(): any {
+  return {
+    '&::-moz-focus-inner': {
+      border: 0
+    },
+    '&': {
+      outline: 'transparent'
+    }
+  }
+}
+/* tslint:enable */
+
+export const getClassNames = memoizeFunction((): IPositioningContainerNames => {
+  return mergeStyleSets({
+    root: {
+      position: 'absolute',
+      boxSizing: 'border-box',
+      border: '1px solid ${}',
+      selectors: Object.assign(highContrastActive({
+        border: '1px solid WindowText',
+      }), focusClear()),
+    },
+    container: {
+      position: 'relative'
+    },
+    main: {
+      backgroundColor: '#ffffff',
+      overflowX: 'hidden',
+      overflowY: 'hidden',
+      position: 'relative'
+    },
+    overFlowYHidden: {
+      overflowY: 'hidden'
+    }
+  });
+});
diff --git a/packages/experiments/src/components/PositioningContainer/PositioningContainer.tsx b/packages/experiments/src/components/PositioningContainer/PositioningContainer.tsx
new file mode 100644
index 0000000000000..64dfd6aabf162
--- /dev/null
+++ b/packages/experiments/src/components/PositioningContainer/PositioningContainer.tsx
@@ -0,0 +1,401 @@
+import * as React from 'react';
+import {
+  IPositioningContainerTypes
+} from './PositioningContainer.types';
+import { getClassNames } from './PositioningContainer.styles';
+import { Layer } from 'office-ui-fabric-react/lib/Layer';
+
+// Utilites/Helpers
+import { DirectionalHint } from 'office-ui-fabric-react/lib/common/DirectionalHint';
+import {
+  BaseComponent,
+  IPoint,
+  IRectangle,
+  assign,
+  autobind,
+  css,
+  elementContains,
+  focusFirstChild,
+  getWindow,
+  getDocument
+} from '../../Utilities';
+
+import {
+  getRelativePositions,
+  IPositionProps,
+  getMaxHeight,
+  ICalloutPositon
+} from 'office-ui-fabric-react/lib/utilities/positioning';
+
+import { AnimationClassNames, mergeStyles } from '../../Styling';
+
+export interface IPositionInfo {
+  calloutPosition: ICalloutPositon;
+  beakPosition: { position: ICalloutPositon, display: string };
+  directionalClassName: string;
+  submenuDirection: DirectionalHint;
+}
+
+const OFF_SCREEN_STYLE = { opacity: 0 };
+
+// In order for some of the max height logic to work
+// properly we need to set the border needs to be set.
+// The value is abitrary.
+const BORDER_WIDTH = 1;
+
+export interface IPositioningContainerState {
+  /**
+   * Current set of calcualted positions for the outermost parent container.
+   */
+  positions?: IPositionInfo;
+
+  /**
+   * Tracks the current height offset and updates during
+   * the height animation when props.finalHeight is specified.
+   */
+  heightOffset?: number;
+}
+
+export class PositioningContainer extends BaseComponent<IPositioningContainerTypes, IPositioningContainerState> {
+
+  public static defaultProps: IPositioningContainerTypes = {
+    preventDismissOnScroll: false,
+    offsetFromTarget: 0,
+    minPagePadding: 8,
+    directionalHint: DirectionalHint.bottomAutoEdge
+  };
+
+  private _didSetInitialFocus: boolean;
+
+  /**
+   * The primary positioned div.
+   */
+  private _positionedHost: HTMLDivElement;
+
+  // @TODO rename to reflect the name of this class
+  private _contentHost: HTMLDivElement;
+
+  /**
+   * Stores an instance of Window, used to check
+   * for server side rendering and if focus was lost.
+   */
+  private _targetWindow: Window;
+
+  /**
+   * The bounds used when determing if and where the
+   * PositioningContainer should be placed.
+   */
+  private _positioningBounds: IRectangle;
+
+  /**
+   * The maximum height the PositioningContainer can grow to
+   * without going being the window or target bounds
+   */
+  private _maxHeight: number | undefined;
+  private _positionAttempts: number;
+  private _target: HTMLElement | MouseEvent | IPoint | null;
+  private _setHeightOffsetTimer: number;
+
+  constructor(props: IPositioningContainerTypes) {
+    super(props);
+    this._didSetInitialFocus = false;
+    this.state = {
+      positions: undefined,
+      heightOffset: 0
+    };
+    this._positionAttempts = 0;
+  }
+
+  public componentWillMount(): void {
+    this._setTargetWindowAndElement(this._getTarget());
+  }
+
+  public componentDidMount(): void {
+    this._onComponentDidMount();
+  }
+
+  public componentDidUpdate(): void {
+    this._setInitialFocus();
+    this._updateAsyncPosition();
+  }
+
+  public componentWillUpdate(newProps: IPositioningContainerTypes): void {
+    // If the target element changed, find the new one. If we are tracking
+    // target with class name, always find element because we do not know if
+    // fabric has rendered a new element and disposed the old element.
+    let newTarget = this._getTarget(newProps);
+    let oldTarget = this._getTarget();
+    if (newTarget !== oldTarget || typeof (newTarget) === 'string' || newTarget instanceof String) {
+      this._maxHeight = undefined;
+      this._setTargetWindowAndElement(newTarget!);
+    }
+
+    if (newProps.offsetFromTarget !== this.props.offsetFromTarget) {
+      this._maxHeight = undefined;
+    }
+
+    if (newProps.finalHeight !== this.props.finalHeight) {
+      this._setHeightOffsetEveryFrame();
+    }
+  }
+
+  public render(): JSX.Element | null {
+    // If there is no target window then we are likely in server side rendering and we should not render anything.
+    if (!this._targetWindow) {
+      return null;
+    }
+
+    let {
+      className,
+      positioningContainerWidth,
+      positioningContainerMaxHeight,
+      children } = this.props;
+    let { positions } = this.state;
+
+    const styles = getClassNames();
+    let directionalClassName = '';
+
+    if (positions && positions.directionalClassName) {
+      directionalClassName = (AnimationClassNames as any)[positions.directionalClassName];
+    }
+
+    let getContentMaxHeight: number = this._getMaxHeight() + this.state.heightOffset!;
+    let contentMaxHeight: number = positioningContainerMaxHeight!
+      && (positioningContainerMaxHeight! > getContentMaxHeight) ? getContentMaxHeight : positioningContainerMaxHeight!;
+    let content = (
+      <div
+        ref={ this._resolveRef('_positionedHost') }
+        className={ css('ms-PositioningContainer', styles.container) }
+      >
+        <div
+          className={
+            mergeStyles(
+              'ms-PositioningContainer-layerHost',
+              styles.root,
+              className,
+              directionalClassName,
+              !!positioningContainerWidth && { width: positioningContainerWidth }
+            ) }
+          style={ positions ? positions.calloutPosition : OFF_SCREEN_STYLE }
+          tabIndex={ -1 } // Safari and Firefox on Mac OS requires this to back-stop click events so focus remains in the Callout.
+          // See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus
+          ref={ this._resolveRef('_contentHost') }
+        >
+          { children }
+          { // @TODO apply  to the content container
+            contentMaxHeight
+          }
+        </div>
+      </div>
+    );
+
+    return this.props.doNotLayer ? content : (
+      <Layer>
+        { content }
+      </Layer>
+    );
+  }
+
+  @autobind
+  public dismiss(ev?: Event | React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>): void {
+    let { onDismiss } = this.props;
+
+    if (onDismiss) {
+      onDismiss(ev);
+    }
+  }
+
+  protected _dismissOnScroll(ev: Event): void {
+    const { preventDismissOnScroll } = this.props;
+    if (this.state.positions && !preventDismissOnScroll) {
+      this._dismissOnLostFocus(ev);
+    }
+  }
+
+  protected _dismissOnLostFocus(ev: Event): void {
+    let target = ev.target as HTMLElement;
+    let clickedOutsideCallout = this._positionedHost && !elementContains(this._positionedHost, target);
+
+    if (
+      (!this._target && clickedOutsideCallout) ||
+      ev.target !== this._targetWindow &&
+      clickedOutsideCallout &&
+      ((this._target as MouseEvent).stopPropagation ||
+        (!this._target || (target !== this._target && !elementContains(this._target as HTMLElement, target))))) {
+      this.dismiss(ev);
+    }
+  }
+
+  @autobind
+  protected _setInitialFocus(): void {
+    if (this.props.setInitialFocus && !this._didSetInitialFocus && this.state.positions) {
+      this._didSetInitialFocus = true;
+      focusFirstChild(this._contentHost);
+    }
+  }
+
+  @autobind
+  protected _onComponentDidMount(): void {
+    // This is added so the positioningContainer will dismiss when the window is scrolled
+    // but not when something inside the positioningContainer is scrolled. The delay seems
+    // to be required to avoid React firing an async focus event in IE from
+    // the target changing focus quickly prior to rendering the positioningContainer.
+    this._async.setTimeout(() => {
+      this._events.on(this._targetWindow, 'scroll', this._dismissOnScroll, true);
+      this._events.on(this._targetWindow, 'resize', this.dismiss, true);
+      this._events.on(this._targetWindow.document.body, 'focus', this._dismissOnLostFocus, true);
+      this._events.on(this._targetWindow.document.body, 'click', this._dismissOnLostFocus, true);
+    }, 0);
+
+    if (this.props.onLayerMounted) {
+      this.props.onLayerMounted();
+    }
+
+    this._updateAsyncPosition();
+    this._setHeightOffsetEveryFrame();
+  }
+
+  private _updateAsyncPosition(): void {
+    this._async.requestAnimationFrame(() => this._updatePosition());
+  }
+
+  private _updatePosition(): void {
+    let { positions } = this.state;
+    let hostElement: HTMLElement = this._positionedHost;
+    let positioningContainerElement: HTMLElement = this._contentHost;
+
+    if (hostElement && positioningContainerElement) {
+      let currentProps: IPositionProps | undefined;
+      currentProps = assign(currentProps, this.props);
+      currentProps!.bounds = this._getBounds();
+      currentProps!.target = this._target!;
+      let newPositions: IPositionInfo = getRelativePositions(currentProps!, hostElement, positioningContainerElement);
+
+      // Set the new position only when the positions are not exists or one of the new positioningContainer positions are different.
+      // The position should not change if the position is within 2 decimal places.
+      if ((!positions && newPositions) ||
+        (positions && newPositions && !this._arePositionsEqual(positions, newPositions)
+          && this._positionAttempts < 5)) {
+        // We should not reposition the positioningContainer more than a few times, if it is then the content is likely resizing
+        // and we should stop trying to reposition to prevent a stack overflow.
+        this._positionAttempts++;
+        this.setState({
+          positions: newPositions
+        });
+      } else {
+        this._positionAttempts = 0;
+        if (this.props.onPositioned) {
+          this.props.onPositioned();
+        }
+      }
+    }
+  }
+
+  private _getBounds(): IRectangle {
+    if (!this._positioningBounds) {
+      let currentBounds = this.props.bounds;
+
+      if (!currentBounds) {
+        currentBounds = {
+          top: 0 + this.props.minPagePadding!,
+          left: 0 + this.props.minPagePadding!,
+          right: this._targetWindow.innerWidth - this.props.minPagePadding!,
+          bottom: this._targetWindow.innerHeight - this.props.minPagePadding!,
+          width: this._targetWindow.innerWidth - this.props.minPagePadding! * 2,
+          height: this._targetWindow.innerHeight - this.props.minPagePadding! * 2
+        };
+      }
+      this._positioningBounds = currentBounds;
+    }
+    return this._positioningBounds;
+  }
+
+  /**
+   * Return the maximum height the container can grow to
+   * without going out of the specified bounds
+   */
+  private _getMaxHeight(): number {
+    //If the max height is undefined.
+    if (!this._maxHeight) {
+      // if the directional hint is fixed and our target Exists
+      if (this.props.directionalHintFixed && this._target) {
+        this._maxHeight = getMaxHeight(this._target, this.props.directionalHint!, this.props.offsetFromTarget, this._getBounds());
+      } else {
+        this._maxHeight = this._getBounds().height! - BORDER_WIDTH * 2;
+      }
+    }
+    return this._maxHeight!;
+  }
+
+  private _arePositionsEqual(positions: IPositionInfo, newPosition: IPositionInfo): boolean {
+    return this._comparePositions(positions.calloutPosition, newPosition.calloutPosition);
+  }
+
+  private _comparePositions(oldPositions: ICalloutPositon, newPositions: ICalloutPositon): boolean {
+    for (const key in newPositions) {
+      // This needs to be checked here and below because there is a linting error if for in does not immediately have an if statement
+      if (newPositions.hasOwnProperty(key)) {
+        const oldPositionEdge = oldPositions[key];
+        const newPositionEdge = newPositions[key];
+
+        if (oldPositionEdge && newPositionEdge) {
+          if (oldPositionEdge.toFixed(2) !== newPositionEdge.toFixed(2)) {
+            return false;
+          }
+        }
+      }
+    }
+    return true;
+  }
+
+  private _setTargetWindowAndElement(target: HTMLElement | string | MouseEvent | IPoint | null): void {
+    if (target) {
+      if (typeof target === 'string') {
+        let currentDoc: Document = getDocument()!;
+        this._target = currentDoc ? currentDoc.querySelector(target) as HTMLElement : null;
+        this._targetWindow = getWindow()!;
+      } else if ((target as MouseEvent).stopPropagation) {
+        this._targetWindow = getWindow((target as MouseEvent).toElement as HTMLElement)!;
+        this._target = target;
+      } else if ((target as IPoint).x !== undefined && (target as IPoint).y !== undefined) {
+        this._targetWindow = getWindow()!;
+        this._target = target;
+      } else {
+        let targetElement: HTMLElement = target as HTMLElement;
+        this._targetWindow = getWindow(targetElement)!;
+        this._target = target;
+      }
+    } else {
+      this._targetWindow = getWindow()!;
+    }
+  }
+
+  /**
+   * Animates the height if finalHeight was given.
+   */
+  private _setHeightOffsetEveryFrame(): void {
+    if (this._contentHost && this.props.finalHeight) {
+      this._setHeightOffsetTimer = this._async.requestAnimationFrame(() => {
+        const positioningContainerMainElem = this._contentHost.lastChild as HTMLElement;
+        const cardScrollHeight: number = positioningContainerMainElem.scrollHeight;
+        const cardCurrHeight: number = positioningContainerMainElem.offsetHeight;
+        const scrollDiff: number = cardScrollHeight - cardCurrHeight;
+
+        this.setState({
+          heightOffset: this.state.heightOffset! + scrollDiff
+        });
+
+        if (positioningContainerMainElem.offsetHeight < this.props.finalHeight!) {
+          this._setHeightOffsetEveryFrame();
+        } else {
+          this._async.cancelAnimationFrame(this._setHeightOffsetTimer);
+        }
+      });
+    }
+  }
+
+  private _getTarget(props: IPositioningContainerTypes = this.props): HTMLElement | string | MouseEvent | IPoint | null {
+    let { target } = props;
+    return target!;
+  }
+};
\ No newline at end of file
diff --git a/packages/experiments/src/components/PositioningContainer/PositioningContainer.types.ts b/packages/experiments/src/components/PositioningContainer/PositioningContainer.types.ts
new file mode 100644
index 0000000000000..c2694d962ab59
--- /dev/null
+++ b/packages/experiments/src/components/PositioningContainer/PositioningContainer.types.ts
@@ -0,0 +1,164 @@
+import * as React from 'react';
+import { PositioningContainer } from './PositioningContainer';
+import { DirectionalHint } from 'office-ui-fabric-react/lib/common/DirectionalHint';
+import {
+  IPoint,
+  IRectangle
+} from '../../Utilities';
+
+export interface IPositioningContainer {
+}
+
+export interface IPositioningContainerTypes extends React.Props<PositioningContainer> {
+  /**
+  * All props for your component are to be defined here.
+  */
+  componentRef?: (component: IPositioningContainer) => void;
+  /**
+   * The target that the positioningContainer should try to position itself based on.
+   * It can be either an HTMLElement a querySelector string of a valid HTMLElement
+   * or a MouseEvent. If MouseEvent is given then the origin point of the event will be used.
+   */
+  target?: HTMLElement | string | MouseEvent | IPoint | null;
+
+  /**
+   * How the element should be positioned
+   * @default DirectionalHint.BottomAutoEdge
+   */
+  directionalHint?: DirectionalHint;
+
+  /**
+   * How the element should be positioned in RTL layouts.
+   * If not specified, a mirror of `directionalHint` will be used instead
+   */
+  directionalHintForRTL?: DirectionalHint;
+
+  /**
+   * The gap between the positioningContainer and the target
+   * @default 0
+   */
+  offsetFromTarget?: number;
+
+  /**
+   * Custom width for positioningContainer including borders. If value is 0, no width is applied.
+   * @default 0
+   */
+  positioningContainerWidth?: number;
+
+  /**
+   * The background color of the positioningContainer in hex format ie. #ffffff.
+   * @default $ms-color-white
+   */
+  backgroundColor?: string;
+
+  /**
+   * The bounding rectangle for which  the contextual menu can appear in.
+   */
+  bounds?: IRectangle;
+
+  /**
+   * The minimum distance the positioningContainer will be away from the edge of the screen.
+   *  @default 8
+   */
+  minPagePadding?: number;
+
+  /**
+   * If true use a point rather than rectangle to position the positioningContainer.
+   * For example it can be used to position based on a click.
+   * @deprecated Use 'target' instead
+   */
+  useTargetPoint?: boolean;
+
+  /**
+   * Point used to position the positioningContainer
+   * @deprecated Use 'target' instead
+   */
+  targetPoint?: IPoint;
+
+  /**
+   * If true then the onClose will not not dismiss on scroll
+   * @default false
+   */
+  preventDismissOnScroll?: boolean;
+
+  /**
+   * If true the position returned will have the menu element cover the target.
+   * If false then it will position next to the target;
+   * @default false
+   */
+  coverTarget?: boolean;
+
+  /**
+   * Aria role assigned to the positioningContainer (Eg. dialog, alertdialog).
+   */
+  role?: string;
+
+  /**
+   * Accessible label text for positioningContainer.
+   */
+  ariaLabel?: string;
+
+  /**
+   *  Defines the element id referencing the element containing label text for positioningContainer.
+   */
+  ariaLabelledBy?: string;
+
+  /**
+   * Defines the element id referencing the element containing the description for the positioningContainer.
+   */
+  ariaDescribedBy?: string;
+
+  /**
+   * CSS class to apply to the positioningContainer.
+   * @default null
+   */
+  className?: string;
+
+  /**
+   * Optional callback when the layer content has mounted.
+   */
+  onLayerMounted?: () => void;
+
+  /**
+   * Optional callback that is called once the positioningContainer has been correctly positioned.
+   */
+  onPositioned?: () => void;
+
+  /**
+   * Callback when the positioningContainer tries to close.
+   */
+  onDismiss?: (ev?: any) => void;
+
+  /**
+   * If true do not render on a new layer. If false render on a new layer.
+   */
+  doNotLayer?: boolean;
+
+  /**
+   * If true the position will not change sides in an attempt to fit the positioningContainer within bounds.
+   * It will still attempt to align it to whatever bounds are given.
+   * @default false
+   */
+  directionalHintFixed?: boolean;
+
+  /**
+   * Specify the final height of the content.
+   * To be used when expanding the content dynamically so that positioningContainer can adjust its position.
+   */
+  finalHeight?: number;
+
+  /**
+   * If true then the positioningContainer will attempt to focus the first focusable element that it contains.
+   * If it doesn't find an element, no focus will be set and the method will return false.
+   * This means that it's the contents responsibility to either set focus or have
+   * focusable items.
+   * @returns True if focus was set, false if it was not.
+   */
+  setInitialFocus?: boolean;
+
+  /**
+   * Set max height of positioningContainer
+   * When not set the positioningContainer will expand with contents up to the bottom of the screen
+   */
+  positioningContainerMaxHeight?: number;
+}
diff --git a/packages/experiments/src/components/PositioningContainer/PositioningContainerPage.tsx b/packages/experiments/src/components/PositioningContainer/PositioningContainerPage.tsx
new file mode 100644
index 0000000000000..586f9c58bca14
--- /dev/null
+++ b/packages/experiments/src/components/PositioningContainer/PositioningContainerPage.tsx
@@ -0,0 +1,56 @@
+import * as React from 'react';
+import {
+  ExampleCard,
+  IComponentDemoPageProps,
+  ComponentPage,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+
+import { PositioningContainerBasicExample } from './examples/PositioningContainer.Basic.Example';
+const CoachmarkBasicExampleCode = require('!raw-loader!experiments/src/components/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx') as string;
+
+export class PositioningContainerPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render(): JSX.Element {
+    return (
+      <ComponentPage
+        title='Positioning Container'
+        componentName='PositioningContainer'
+        exampleCards={
+          <div>
+            <ExampleCard title='Positioning Container Basic' isOptIn={ true } code={ CoachmarkBasicExampleCode }>
+              <PositioningContainerBasicExample />
+            </ExampleCard>
+          </div>
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!experiments/src/components/PositioningContainer/PositioningContainer.types.ts')
+            ] }
+          />
+        }
+        overview={
+          <div />
+        }
+        bestPractices={
+          <div />
+        }
+        dos={
+          <div>
+            <ul>
+              <li>@TODO Add dos</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul>
+              <li>@TODO Add dos</li>
+            </ul>
+          </div>
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }
+      />
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx b/packages/experiments/src/components/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx
new file mode 100644
index 0000000000000..ac3504a1696aa
--- /dev/null
+++ b/packages/experiments/src/components/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx
@@ -0,0 +1,56 @@
+import * as React from 'react';
+import { PositioningContainer } from '../PositioningContainer';
+import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
+
+export interface IPositioningContainerBasicExampleState {
+  isPositioningContainerVisible?: boolean;
+}
+
+export class PositioningContainerBasicExample extends React.Component<{}, IPositioningContainerBasicExampleState> {
+  public constructor() {
+    super();
+
+    this._onShowMenuClicked = this._onShowMenuClicked.bind(this);
+    this._onDismiss = this._onDismiss.bind(this);
+
+    this.state = {
+      isPositioningContainerVisible: false
+    }
+  }
+  public render(): JSX.Element {
+    let { isPositioningContainerVisible } = this.state;
+    return (
+      <div>
+        <div className='ms-PositioningContainerBasicExample-buttonArea'>
+          <DefaultButton
+            onClick={ this._onShowMenuClicked }
+            text={ isPositioningContainerVisible ? 'Hide Positioning Container' : 'Show Positioning Container' }
+            className={ 'ms-PositioningContainer-basicExampleButton' }
+          />
+        </div>
+        { isPositioningContainerVisible && (
+          <PositioningContainer
+            className='ms-PositioningContainer'
+            role={ 'alertdialog' }
+            target={ '.ms-PositioningContainer-basicExampleButton' }
+            onDismiss={ this._onDismiss }
+            setInitialFocus={ true }
+          >
+            <h1>An H1 element</h1>
+          </PositioningContainer>
+        ) }
+      </div>
+    );
+  }
+  private _onShowMenuClicked() {
+    this.setState({
+      isPositioningContainerVisible: !this.state.isPositioningContainerVisible
+    });
+  }
+
+  private _onDismiss() {
+    this.setState({
+      isPositioningContainerVisible: false
+    });
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/PositioningContainer/index.ts b/packages/experiments/src/components/PositioningContainer/index.ts
new file mode 100644
index 0000000000000..dd9818ce308a2
--- /dev/null
+++ b/packages/experiments/src/components/PositioningContainer/index.ts
@@ -0,0 +1,2 @@
+export * from './PositioningContainer';
+export * from './PositioningContainer.types';
\ No newline at end of file
diff --git a/packages/experiments/src/demo/AppDefinition.tsx b/packages/experiments/src/demo/AppDefinition.tsx
index 8960c2125b19a..e5c65af573dff 100644
--- a/packages/experiments/src/demo/AppDefinition.tsx
+++ b/packages/experiments/src/demo/AppDefinition.tsx
@@ -10,6 +10,18 @@ export const AppDefinition: IAppDefinition = {
   examplePages: [
     {
       links: [
+        {
+          component: require<any>('../components/PositioningContainer/PositioningContainerPage').PositioningContainerPage,
+          key: 'PositioningContainer',
+          name: 'PositioningContainer',
+          url: '#/examples/PositioningContainer'
+        },
+        {
+          component: require<any>('../components/Coachmark/CoachmarkPage').CoachmarkPage,
+          key: 'Coachmark',
+          name: 'Coachmark',
+          url: '#/examples/coachmark'
+        },
         {
           component: require<any>('../components/CommandBar/CommandBarPage').CommandBarPage,
           key: 'CommandBar',
diff --git a/packages/experiments/src/demo/index.tsx b/packages/experiments/src/demo/index.tsx
index 0f570b5cf1ab9..493c0b8cb5613 100644
--- a/packages/experiments/src/demo/index.tsx
+++ b/packages/experiments/src/demo/index.tsx
@@ -9,7 +9,7 @@ import { GettingStartedPage } from './GettingStartedPage';
 import { setBaseUrl } from 'office-ui-fabric-react/lib/Utilities';
 import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
 import { initializeIcons } from '@uifabric/icons/lib/index';
-import { initializeFileTypeIcons } from '@uifabric/file-type-icons/lib/index';
+import { initializeFileTypeIcons } from '@uifabric/file-type-icons/src/index';
 
 import './index.scss';
 import './ColorStyles.scss';
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index 17cb050816732..800678eacf443 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -76,6 +76,7 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
     this.state = {
       positions: undefined,
       slideDirectionalClassName: undefined,
+      // @TODO it looks like this is not even being used anymore.
       calloutElementRect: undefined,
       heightOffset: 0
     };
diff --git a/scripts/create-component.js b/scripts/create-component.js
index e044a82b82d27..538c2a6cbf656 100644
--- a/scripts/create-component.js
+++ b/scripts/create-component.js
@@ -9,7 +9,7 @@ const rootComponentFolderPath = './packages/experiments/src';
 const componentFolderPath = rootComponentFolderPath + '/components/' + newComponentName;
 const componentPropsFileName = newComponentName + '.types.ts';
 const componentFileName = newComponentName + '.tsx';
-const componentFileClassNamesName = newComponentName + '.classNames.ts';
+const componentFileClassNamesName = newComponentName + '.styles.ts';
 const globalIndexFileName = newComponentName + '.ts';
 const templateFolderPath = './scripts/templates';
 const indexFileName = 'index.ts';

From e7bcc13f8fb2efd588e41053b7ebe432b346902e Mon Sep 17 00:00:00 2001
From: Ridlsan <riddlesan@yandex.ru>
Date: Fri, 8 Dec 2017 19:00:14 +0300
Subject: [PATCH 1123/1641] bug fix: check for input is exist (#3501)

* bug fix: check for input is not null

* bug fix: check for input is not null

* bug fix: check for input is not null

* bug fix: check for input is not null
---
 .../master_2017-12-07-08-45.json                      | 11 +++++++++++
 .../src/components/pickers/BasePicker.tsx             | 10 +++++-----
 2 files changed, 16 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/master_2017-12-07-08-45.json

diff --git a/common/changes/office-ui-fabric-react/master_2017-12-07-08-45.json b/common/changes/office-ui-fabric-react/master_2017-12-07-08-45.json
new file mode 100644
index 0000000000000..2a490fbd6ff82
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2017-12-07-08-45.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added checks to BasePicker if input is null.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "riddlesan@yandex.ru"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index ddb2b7b95c59e..eed4ecff6fe74 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -316,11 +316,11 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
       if (updatedValue !== undefined) {
         this.setState({
-          suggestionsVisible: this.input.value !== '' && this.input.inputElement === document.activeElement
+          suggestionsVisible: this.input && this.input.value !== '' && this.input.inputElement === document.activeElement
         });
       } else {
         this.setState({
-          suggestionsVisible: this.input.inputElement === document.activeElement
+          suggestionsVisible: this.input && this.input.inputElement === document.activeElement
         });
       }
 
@@ -356,7 +356,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     this.setState({
       suggestionsLoading: false,
       suggestedDisplayValue: itemValue,
-      suggestionsVisible: this.input.value !== '' && this.input.inputElement === document.activeElement
+      suggestionsVisible: this.input && this.input.value !== '' && this.input.inputElement === document.activeElement
     });
   }
 
@@ -392,14 +392,14 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   @autobind
   protected onInputFocus(ev: React.FocusEvent<HTMLInputElement | BaseAutoFill>) {
     this.selection.setAllSelected(false);
-    if (this.input.value === '' && this.props.onEmptyInputFocus) {
+    if (this.input && this.input.value === '' && this.props.onEmptyInputFocus) {
       this.onEmptyInputFocus();
       this.setState({
         isMostRecentlyUsedVisible: true,
         moreSuggestionsAvailable: false,
         suggestionsVisible: true
       });
-    } else if (this.input.value) {
+    } else if (this.input && this.input.value) {
       this.setState({
         isMostRecentlyUsedVisible: false,
         suggestionsVisible: true

From b5a02b69fcc8a16f112c5f57cb7fb28240ee8d0f Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Fri, 8 Dec 2017 09:40:23 -0800
Subject: [PATCH 1124/1641] ComboBox: fix input focus stealing issues (#3542)

* Update comboBox behavior so that we are not always forcing focus on the input when the menu closes

* rush change

* updating some formatting

* update per PR feedback
---
 ...omboBoxFixInputFocus_2017-12-08-08-58.json | 11 +++
 .../src/components/ComboBox/ComboBox.tsx      | 69 ++++++++++++-------
 2 files changed, 56 insertions(+), 24 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxFixInputFocus_2017-12-08-08-58.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxFixInputFocus_2017-12-08-08-58.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxFixInputFocus_2017-12-08-08-58.json
new file mode 100644
index 0000000000000..c7175a99f920a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxFixInputFocus_2017-12-08-08-58.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: change when focus is set back to the input to make sure it doesn't  steal focus from somewhere else",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 4a6628da28c25..4315951e9f682 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -131,6 +131,14 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
   private _scrollIdleTimeoutId: number | undefined;
 
+  // Determines if we should be setting
+  // focus back to the input when the menu closes.
+  // The general rule of thumb is if the menu was launched
+  // vai the keyboard focus should go back to the input,
+  // if it was dropped via the mouse focus should not be
+  // forced back to the input
+  private _focusInputAfterClose: boolean;
+
   constructor(props: IComboBoxProps) {
     super(props);
 
@@ -203,24 +211,29 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       this._async.setTimeout(() => this._scrollIntoView(), 0);
     }
 
-    // If we are open or we are focused but are not the activeElement,
-    // set focus on the input
-    if (isOpen || (focused && document.activeElement !== this._comboBox.inputElement)) {
+    // If we are open or we are just closed, shouldFocusAfterClose is set,
+    // are focused but we are not the activeElement set focus on the input
+    if (isOpen ||
+      (prevState.isOpen &&
+        !isOpen &&
+        this._focusInputAfterClose &&
+        focused &&
+        document.activeElement !== this._comboBox.inputElement)) {
       this.focus();
     }
 
-    // If we just opened/closed the menu OR
-    // are focused AND
-    //   updated the selectedIndex with the menu closed OR
-    //   are not allowing freeform OR
-    //   the value changed
+    // If we should focusAfterClose AND
+    //   just opened/closed the menu OR
+    //   are focused AND
+    //     updated the selectedIndex with the menu closed OR
+    //     are not allowing freeform OR
+    //     the value changed
     // we need to set selection
-    if (prevState.isOpen !== isOpen ||
+    if (this._focusInputAfterClose && (prevState.isOpen && !isOpen ||
       (focused &&
         ((!isOpen && prevState.selectedIndex !== selectedIndex) ||
-          !allowFreeform ||
-          value !== prevProps.value)
-      )) {
+          !allowFreeform || value !== prevProps.value)
+      ))) {
       this._select();
     }
 
@@ -1090,7 +1103,10 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
     // close the menu and focus the input
     this.setState({ isOpen: false });
-    this._comboBox.focus();
+
+    if (this._focusInputAfterClose) {
+      this._comboBox.focus();
+    }
   }
 
   /**
@@ -1188,6 +1204,16 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     this._setPendingInfoFromIndex(index);
   }
 
+  /**
+   * Sets the isOpen state and updates focusInputAfterClose
+   */
+  private _setOpenStateAndFocusOnClose(isOpen: boolean, focusInputAfterClose: boolean) {
+    this._focusInputAfterClose = focusInputAfterClose;
+    this.setState({
+      isOpen: isOpen
+    });
+  }
+
   /**
    * Handle keydown on the input
    * @param ev - The keyboard event that was fired
@@ -1247,9 +1273,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         // If we are not allowing freeform
         // or the comboBox is open, flip the open state
         if (isOpen) {
-          this.setState({
-            isOpen: !isOpen
-          });
+          this._setOpenStateAndFocusOnClose(!isOpen, false /* focusInputAfterClose */);
         }
 
         // Allow TAB to propigate
@@ -1282,7 +1306,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       case KeyCodes.down:
         // Expand the comboBox on ALT + DownArrow
         if (ev.altKey || ev.metaKey) {
-          this.setState({ isOpen: true });
+          this._setOpenStateAndFocusOnClose(true /* isOpen */, true /* focusInputAfterClose */);
         } else {
           // if we are in clearAll state (e.g. the user as hovering
           // and has since mousedOut of the menu items),
@@ -1333,7 +1357,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         // If we get here and we got either and ALT key
         // or meta key and we are current open, let's close the menu
         if ((ev.altKey || ev.metaKey) && isOpen) {
-          this.setState({ isOpen: !isOpen });
+          this._setOpenStateAndFocusOnClose(!isOpen, true /* focusInputAfterClose */);
         }
 
         // If we are not allowing freeform and
@@ -1375,9 +1399,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         // make space expand/collapse the comboBox
         // and allow the event to propagate
         if (!allowFreeform && autoComplete === 'off') {
-          this.setState({
-            isOpen: !this.state.isOpen
-          });
+          let isOpen = this.state.isOpen;
+          this._setOpenStateAndFocusOnClose(!isOpen, !!isOpen);
           return;
         }
         break;
@@ -1456,9 +1479,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     let { isOpen } = this.state;
 
     if (!disabled) {
-      this.setState({
-        isOpen: !isOpen
-      });
+      this._setOpenStateAndFocusOnClose(!isOpen, false /* focusInputAfterClose */);
     }
   }
 

From 4be48b6680992886e4b05a220e3e22c84228d9e1 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Fri, 8 Dec 2017 09:55:21 -0800
Subject: [PATCH 1125/1641] Experiments: Fix build breaks (#3544)

* Fix experiments build break

* Rush change
---
 .../chrisgo-fix-experiments_2017-12-08-17-37.json     | 11 +++++++++++
 .../src/components/Coachmark/CoachmarkPage.tsx        |  9 ++++++---
 .../PositioningContainer/PositioningContainer.tsx     |  6 ++++--
 .../PositioningContainer.types.ts                     |  1 +
 .../PositioningContainer/PositioningContainerPage.tsx |  3 ++-
 .../examples/PositioningContainer.Basic.Example.tsx   |  6 +++---
 6 files changed, 27 insertions(+), 9 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/chrisgo-fix-experiments_2017-12-08-17-37.json

diff --git a/common/changes/@uifabric/experiments/chrisgo-fix-experiments_2017-12-08-17-37.json b/common/changes/@uifabric/experiments/chrisgo-fix-experiments_2017-12-08-17-37.json
new file mode 100644
index 0000000000000..bbf0a99b4dbf2
--- /dev/null
+++ b/common/changes/@uifabric/experiments/chrisgo-fix-experiments_2017-12-08-17-37.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Experiments: Fix build breaks in master",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Coachmark/CoachmarkPage.tsx b/packages/experiments/src/components/Coachmark/CoachmarkPage.tsx
index 832aaf26af90f..b82bd9ac3b46b 100644
--- a/packages/experiments/src/components/Coachmark/CoachmarkPage.tsx
+++ b/packages/experiments/src/components/Coachmark/CoachmarkPage.tsx
@@ -7,7 +7,8 @@ import {
 } from '@uifabric/example-app-base';
 
 import { CoachmarkBasicExample } from './examples/Coachmark.Basic.Example';
-const CoachmarkBasicExampleCode = require('!raw-loader!experiments/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx') as string;
+const CoachmarkBasicExampleCode =
+  require('!raw-loader!experiments/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx') as string;
 
 export class CoachmarkPage extends React.Component<IComponentDemoPageProps, {}> {
   public render(): JSX.Element {
@@ -31,7 +32,8 @@ export class CoachmarkPage extends React.Component<IComponentDemoPageProps, {}>
         }
         overview={
           <div>
-            <p>Coachmarks are used to draw a persons attention to a part of the UI, and increase engagement with that element in the product.</p>
+            <p>Coachmarks are used to draw a persons attention to a part of the UI, and increase engagement with that element
+               in the product.</p>
 
             <p>
               They should be contextual whenever possible, or related to something that will make existing user flows more efficient
@@ -45,7 +47,8 @@ export class CoachmarkPage extends React.Component<IComponentDemoPageProps, {}>
           <div>
             <ul>
               <li>Only one coachmark + callout combo will be displayed at a time</li>
-              <li>Coachmarks can be stand alone or sequential. Sequential coachmarks should be used sparingly, to walk through complex multi-step interactions. It is recommended that a sequence of coachmakrs does not exceed 3 steps.</li>
+              <li>Coachmarks can be stand alone or sequential. Sequential coachmarks should be used sparingly, to walk through complex
+                multi-step interactions. It is recommended that a sequence of coachmakrs does not exceed 3 steps.</li>
               <li>Coachmarks are designed to only hold Callouts.</li>
             </ul>
           </div>
diff --git a/packages/experiments/src/components/PositioningContainer/PositioningContainer.tsx b/packages/experiments/src/components/PositioningContainer/PositioningContainer.tsx
index 64dfd6aabf162..97e97898ce4f0 100644
--- a/packages/experiments/src/components/PositioningContainer/PositioningContainer.tsx
+++ b/packages/experiments/src/components/PositioningContainer/PositioningContainer.tsx
@@ -156,6 +156,7 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
     let directionalClassName = '';
 
     if (positions && positions.directionalClassName) {
+      // tslint:disable-next-line:no-any
       directionalClassName = (AnimationClassNames as any)[positions.directionalClassName];
     }
 
@@ -176,6 +177,7 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
               directionalClassName,
               !!positioningContainerWidth && { width: positioningContainerWidth }
             ) }
+          // tslint:disable-next-line:jsx-ban-props
           style={ positions ? positions.calloutPosition : OFF_SCREEN_STYLE }
           tabIndex={ -1 } // Safari and Firefox on Mac OS requires this to back-stop click events so focus remains in the Callout.
           // See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus
@@ -315,7 +317,7 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
    * without going out of the specified bounds
    */
   private _getMaxHeight(): number {
-    //If the max height is undefined.
+    // If the max height is undefined.
     if (!this._maxHeight) {
       // if the directional hint is fixed and our target Exists
       if (this.props.directionalHintFixed && this._target) {
@@ -398,4 +400,4 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
     let { target } = props;
     return target!;
   }
-};
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/PositioningContainer/PositioningContainer.types.ts b/packages/experiments/src/components/PositioningContainer/PositioningContainer.types.ts
index c2694d962ab59..ff6e4c1a1ce41 100644
--- a/packages/experiments/src/components/PositioningContainer/PositioningContainer.types.ts
+++ b/packages/experiments/src/components/PositioningContainer/PositioningContainer.types.ts
@@ -127,6 +127,7 @@ export interface IPositioningContainerTypes extends React.Props<PositioningConta
   /**
    * Callback when the positioningContainer tries to close.
    */
+  // tslint:disable-next-line:no-any
   onDismiss?: (ev?: any) => void;
 
   /**
diff --git a/packages/experiments/src/components/PositioningContainer/PositioningContainerPage.tsx b/packages/experiments/src/components/PositioningContainer/PositioningContainerPage.tsx
index 586f9c58bca14..712d3b11636a1 100644
--- a/packages/experiments/src/components/PositioningContainer/PositioningContainerPage.tsx
+++ b/packages/experiments/src/components/PositioningContainer/PositioningContainerPage.tsx
@@ -7,7 +7,8 @@ import {
 } from '@uifabric/example-app-base';
 
 import { PositioningContainerBasicExample } from './examples/PositioningContainer.Basic.Example';
-const CoachmarkBasicExampleCode = require('!raw-loader!experiments/src/components/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx') as string;
+const CoachmarkBasicExampleCode = require
+  ('!raw-loader!experiments/src/components/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx') as string;
 
 export class PositioningContainerPage extends React.Component<IComponentDemoPageProps, {}> {
   public render(): JSX.Element {
diff --git a/packages/experiments/src/components/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx b/packages/experiments/src/components/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx
index ac3504a1696aa..fa4bea6ec7975 100644
--- a/packages/experiments/src/components/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx
+++ b/packages/experiments/src/components/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx
@@ -15,7 +15,7 @@ export class PositioningContainerBasicExample extends React.Component<{}, IPosit
 
     this.state = {
       isPositioningContainerVisible: false
-    }
+    };
   }
   public render(): JSX.Element {
     let { isPositioningContainerVisible } = this.state;
@@ -42,13 +42,13 @@ export class PositioningContainerBasicExample extends React.Component<{}, IPosit
       </div>
     );
   }
-  private _onShowMenuClicked() {
+  private _onShowMenuClicked(): void {
     this.setState({
       isPositioningContainerVisible: !this.state.isPositioningContainerVisible
     });
   }
 
-  private _onDismiss() {
+  private _onDismiss(): void {
     this.setState({
       isPositioningContainerVisible: false
     });

From 81a513bb94e19801ac3c0a58d17cc49796bc5349 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 8 Dec 2017 18:09:44 +0000
Subject: [PATCH 1126/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...isgo-fix-experiments_2017-12-08-17-37.json | 11 ---------
 ...omboBoxFixInputFocus_2017-12-08-08-58.json | 11 ---------
 .../master_2017-12-07-08-45.json              | 11 ---------
 ...-isdisabled-property_2017-12-07-19-50.json | 11 ---------
 packages/experiments/CHANGELOG.json           | 19 +++++++++++++++
 packages/experiments/CHANGELOG.md             |  9 ++++++-
 packages/experiments/package.json             |  4 ++--
 .../office-ui-fabric-react/CHANGELOG.json     | 24 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 11 ++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 15 files changed, 69 insertions(+), 54 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/chrisgo-fix-experiments_2017-12-08-17-37.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxFixInputFocus_2017-12-08-08-58.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2017-12-07-08-45.json
 delete mode 100644 common/changes/office-ui-fabric-react/observe-deprecated-isdisabled-property_2017-12-07-19-50.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 7f8e5825a4f0b..802d8b15deed4 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.30.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.30.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index d408bc9b6650c..e735a05e79f0d 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.30.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.30.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 8a9bc46bb3d12..2605e04902378 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.30.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.30.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 909c361b44c73..3d2bb869b75ed 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.30.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.30.1 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index d2e91896dbd0b..6a1b6a83927f1 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -30,7 +30,7 @@
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/styling": ">=5.14.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.30.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.30.1 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/experiments/chrisgo-fix-experiments_2017-12-08-17-37.json b/common/changes/@uifabric/experiments/chrisgo-fix-experiments_2017-12-08-17-37.json
deleted file mode 100644
index bbf0a99b4dbf2..0000000000000
--- a/common/changes/@uifabric/experiments/chrisgo-fix-experiments_2017-12-08-17-37.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Experiments: Fix build breaks in master",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxFixInputFocus_2017-12-08-08-58.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxFixInputFocus_2017-12-08-08-58.json
deleted file mode 100644
index c7175a99f920a..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxFixInputFocus_2017-12-08-08-58.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: change when focus is set back to the input to make sure it doesn't  steal focus from somewhere else",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2017-12-07-08-45.json b/common/changes/office-ui-fabric-react/master_2017-12-07-08-45.json
deleted file mode 100644
index 2a490fbd6ff82..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2017-12-07-08-45.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added checks to BasePicker if input is null.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "riddlesan@yandex.ru"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/observe-deprecated-isdisabled-property_2017-12-07-19-50.json b/common/changes/office-ui-fabric-react/observe-deprecated-isdisabled-property_2017-12-07-19-50.json
deleted file mode 100644
index 88ec5bf93fb5b..0000000000000
--- a/common/changes/office-ui-fabric-react/observe-deprecated-isdisabled-property_2017-12-07-19-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: properly observe deprecated `isDisabled` property (until we remove the property)",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "miclo@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 0fde8eb2432be..a3adaf2f271a7 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.9.1",
+      "tag": "@uifabric/experiments_v5.9.1",
+      "date": "Fri, 08 Dec 2017 18:09:44 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "4be48b6680992886e4b05a220e3e22c84228d9e1",
+            "comment": "Experiments: Fix build breaks in master"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.30.0 <6.0.0` to `>=5.30.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.9.0",
       "tag": "@uifabric/experiments_v5.9.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 467b38b5c67d5..d59383b56ec14 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Mon, 04 Dec 2017 17:27:54 GMT and should not be manually modified.
+This log was last generated on Fri, 08 Dec 2017 18:09:44 GMT and should not be manually modified.
+
+## 5.9.1
+Fri, 08 Dec 2017 18:09:44 GMT
+
+### Patches
+
+- Experiments: Fix build breaks in master
 
 ## 5.9.0
 Mon, 04 Dec 2017 17:27:54 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 8967aad154f4b..f955651bbc774 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.9.0",
+  "version": "5.9.1",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.30.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.30.1 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 94f11570e7fa9..fa7a883c49dff 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.30.1",
+      "tag": "office-ui-fabric-react_v5.30.1",
+      "date": "Fri, 08 Dec 2017 18:09:44 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "b5a02b69fcc8a16f112c5f57cb7fb28240ee8d0f",
+            "comment": "ComboBox: change when focus is set back to the input to make sure it doesn't  steal focus from somewhere else"
+          },
+          {
+            "author": "Ridlsan <riddlesan@yandex.ru>",
+            "commit": "e7bcc13f8fb2efd588e41053b7ebe432b346902e",
+            "comment": "Added checks to BasePicker if input is null."
+          },
+          {
+            "author": "Michael Loughry <miclo@microsoft.com>",
+            "commit": "4e7e80e3205a9ca25dd00993c006faf7b9e50be6",
+            "comment": "ContextualMenu: properly observe deprecated `isDisabled` property (until we remove the property)"
+          }
+        ]
+      }
+    },
     {
       "version": "5.30.0",
       "tag": "office-ui-fabric-react_v5.30.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index ef5909c683f9e..0de7447480d08 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,15 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 07 Dec 2017 03:44:42 GMT and should not be manually modified.
+This log was last generated on Fri, 08 Dec 2017 18:09:44 GMT and should not be manually modified.
+
+## 5.30.1
+Fri, 08 Dec 2017 18:09:44 GMT
+
+### Patches
+
+- ComboBox: change when focus is set back to the input to make sure it doesn't  steal focus from somewhere else
+- Added checks to BasePicker if input is null.
+- ContextualMenu: properly observe deprecated `isDisabled` property (until we remove the property)
 
 ## 5.30.0
 Thu, 07 Dec 2017 03:44:42 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 78e0e3e794caa..488d60da3eee0 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.30.0",
+  "version": "5.30.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From b2d6dccd5c3f442f97cac8ee49e9e5c26dc6ace0 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Fri, 8 Dec 2017 13:15:03 -0800
Subject: [PATCH 1127/1641] ComboBox:Make sure currentOtions has values before
 attempt to get values out of it (#3546)

* Make sure currentOptions has element when attempting to get values from it

* rush change
---
 ...FixEmptyOptionsCrash_2017-12-08-20-44.json | 11 ++++++++++
 .../src/components/ComboBox/ComboBox.tsx      | 21 ++++++++++++++-----
 2 files changed, 27 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxFixEmptyOptionsCrash_2017-12-08-20-44.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxFixEmptyOptionsCrash_2017-12-08-20-44.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxFixEmptyOptionsCrash_2017-12-08-20-44.json
new file mode 100644
index 0000000000000..4883c3245170b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxFixEmptyOptionsCrash_2017-12-08-20-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox:Make sure currentOtions has values before attempt to get values out of it",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 4315951e9f682..79a5104a11c10 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -638,6 +638,10 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
     newIndex = Math.max(0, Math.min(currentOptions.length - 1, newIndex));
 
+    if (!this._indexWithinBounds(currentOptions, newIndex)) {
+      return -1;
+    }
+
     let option: IComboBoxOption = currentOptions[newIndex];
 
     // attempt to skip headers and dividers
@@ -646,8 +650,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
       // Should we continue looking for an index to select?
       if (searchDirection !== SearchDirection.none &&
-        ((newIndex !== 0 && searchDirection < SearchDirection.none) ||
-          (newIndex !== currentOptions.length - 1 && searchDirection > SearchDirection.none))) {
+        ((newIndex > 0 && searchDirection < SearchDirection.none) ||
+          (newIndex >= 0 && newIndex < currentOptions.length && searchDirection > SearchDirection.none))) {
         newIndex = this._getNextSelectableIndex(newIndex, searchDirection);
       } else {
         // If we cannot perform a useful search just return the index we were given
@@ -673,6 +677,10 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     // we will get our starting index back
     index = this._getNextSelectableIndex(index, searchDirection);
 
+    if (!this._indexWithinBounds(currentOptions, index)) {
+      return;
+    }
+
     // Are we at a new index? If so, update the state, otherwise
     // there is nothing to do
     if (index !== selectedIndex) {
@@ -785,7 +793,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     if (allowFreeform && currentPendingValue !== '') {
 
       // Check to see if the user typed an exact match
-      if (currentPendingValueValidIndex >= 0) {
+      if (this._indexWithinBounds(currentOptions, currentPendingValueValidIndex)) {
         let pendingOptionText: string = currentOptions[currentPendingValueValidIndex].text.toLocaleLowerCase();
 
         // By exact match, that means: our pending value is the same as the the pending option text OR
@@ -1197,11 +1205,14 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   private _setPendingInfoFromIndexAndDirection(index: number, searchDirection: SearchDirection) {
     let {
       isOpen,
-      selectedIndex
+      selectedIndex,
+      currentOptions
     } = this.state;
 
     index = this._getNextSelectableIndex(index, searchDirection);
-    this._setPendingInfoFromIndex(index);
+    if (this._indexWithinBounds(currentOptions, index)) {
+      this._setPendingInfoFromIndex(index);
+    }
   }
 
   /**

From b038d37a4dace3a4d2e1c38cf565c4cfeece3ade Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 8 Dec 2017 21:30:54 +0000
Subject: [PATCH 1128/1641] Applying package updates.

---
 apps/fabric-website/package.json                   |  2 +-
 apps/ssr-tests/package.json                        |  2 +-
 apps/test-bundle-button/package.json               |  2 +-
 apps/todo-app/package.json                         |  2 +-
 apps/vr-tests/package.json                         |  2 +-
 ...boBoxFixEmptyOptionsCrash_2017-12-08-20-44.json | 11 -----------
 packages/experiments/package.json                  |  2 +-
 packages/office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md       |  9 ++++++++-
 packages/office-ui-fabric-react/package.json       |  2 +-
 10 files changed, 29 insertions(+), 19 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxFixEmptyOptionsCrash_2017-12-08-20-44.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 802d8b15deed4..a7eb941657367 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.30.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.30.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index e735a05e79f0d..0262eaa03ed75 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.30.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.30.2 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 2605e04902378..f71c282e7cd9c 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.30.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.30.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 3d2bb869b75ed..8196f0a07b12c 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.30.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.30.2 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 6a1b6a83927f1..e63ff2b9f796c 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -30,7 +30,7 @@
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/styling": ">=5.14.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.30.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.30.2 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxFixEmptyOptionsCrash_2017-12-08-20-44.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxFixEmptyOptionsCrash_2017-12-08-20-44.json
deleted file mode 100644
index 4883c3245170b..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxFixEmptyOptionsCrash_2017-12-08-20-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox:Make sure currentOtions has values before attempt to get values out of it",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index f955651bbc774..4349411783b41 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.30.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.30.2 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index fa7a883c49dff..50296ea11fd2a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.30.2",
+      "tag": "office-ui-fabric-react_v5.30.2",
+      "date": "Fri, 08 Dec 2017 21:30:54 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "b2d6dccd5c3f442f97cac8ee49e9e5c26dc6ace0",
+            "comment": "ComboBox:Make sure currentOtions has values before attempt to get values out of it"
+          }
+        ]
+      }
+    },
     {
       "version": "5.30.1",
       "tag": "office-ui-fabric-react_v5.30.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 0de7447480d08..778b5f8fc67b4 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 08 Dec 2017 18:09:44 GMT and should not be manually modified.
+This log was last generated on Fri, 08 Dec 2017 21:30:54 GMT and should not be manually modified.
+
+## 5.30.2
+Fri, 08 Dec 2017 21:30:54 GMT
+
+### Patches
+
+- ComboBox:Make sure currentOtions has values before attempt to get values out of it
 
 ## 5.30.1
 Fri, 08 Dec 2017 18:09:44 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 488d60da3eee0..5d9d0232090e2 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.30.1",
+  "version": "5.30.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From a1c3530c60b1b1b90de33fb917d0f668f1055525 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sun, 10 Dec 2017 07:07:02 -0800
Subject: [PATCH 1129/1641] mergeStyles/mergeStyleSets fixes (#3549)

* Merge styles fixes.

* Adding change file.
---
 .../merge-styles-fixes_2017-12-10-00-50.json  | 11 +++++
 .../merge-styles/src/extractStyleParts.ts     |  5 +-
 .../merge-styles/src/mergeStyleSets.test.ts   | 47 +++++++++++++++++++
 packages/merge-styles/src/mergeStyleSets.ts   |  5 +-
 packages/merge-styles/src/mergeStyles.test.ts |  4 ++
 5 files changed, 70 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/merge-styles/merge-styles-fixes_2017-12-10-00-50.json

diff --git a/common/changes/@uifabric/merge-styles/merge-styles-fixes_2017-12-10-00-50.json b/common/changes/@uifabric/merge-styles/merge-styles-fixes_2017-12-10-00-50.json
new file mode 100644
index 0000000000000..7a67facbf982c
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/merge-styles-fixes_2017-12-10-00-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "Fixing issues where child variables in selectors would not expand correctly. Also fixing a case where the same static class registered in two different sets will not show up multiple times in the result from `mergeStyleSets`.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/merge-styles/src/extractStyleParts.ts b/packages/merge-styles/src/extractStyleParts.ts
index 2bba52e449b4b..e05e9dd11dfb8 100644
--- a/packages/merge-styles/src/extractStyleParts.ts
+++ b/packages/merge-styles/src/extractStyleParts.ts
@@ -24,7 +24,10 @@ export function extractStyleParts(
             if (translatedArgs) {
               _processArgs(translatedArgs);
             } else {
-              classes.push(arg);
+              // Avoid adding the same class twice.
+              if (classes.indexOf(arg) === -1) {
+                classes.push(arg);
+              }
             }
           }
         } else if (Array.isArray(arg)) {
diff --git a/packages/merge-styles/src/mergeStyleSets.test.ts b/packages/merge-styles/src/mergeStyleSets.test.ts
index f7554cf5385b4..de2a4368c86f6 100644
--- a/packages/merge-styles/src/mergeStyleSets.test.ts
+++ b/packages/merge-styles/src/mergeStyleSets.test.ts
@@ -86,6 +86,34 @@ describe('mergeStyleSets', () => {
     );
   });
 
+  it('can expand child selectors with static class names', () => {
+    const styles = mergeStyleSets({
+      root: [
+        'a',
+        {
+          selectors: {
+            '&:hover $child': { background: 'red' }
+          }
+        }
+      ],
+      child: [
+        'd',
+        {
+          background: 'green'
+        }
+      ]
+    });
+
+    expect(styles).toEqual({
+      root: 'a root-0',
+      child: 'd child-1'
+    });
+    expect(_stylesheet.getRules()).toEqual(
+      '.root-0:hover .child-1{background:red;}' +
+      '.child-1{background:green;}'
+    );
+  });
+
   it('can merge class names', () => {
     expect(mergeStyleSets({ root: ['a', 'b', { background: 'red' }] })).toEqual({
       root: 'a b root-0'
@@ -103,6 +131,25 @@ describe('mergeStyleSets', () => {
     );
   });
 
+  it('can normalize duplicate static class names', () => {
+    const styles: ITestClasses = mergeStyleSets({ root: ['a', { background: 'red' }] });
+    const styles1: ITestClasses = mergeStyleSets(styles, styles);
+
+    expect(styles1).toEqual({ root: 'a root-0' });
+  });
+
+  it('can auto expand a previously registered style embedded in static classname', () => {
+    const styles: ITestClasses = mergeStyleSets({ root: ['a', { background: 'red' }] });
+    const styles2: ITestClasses = mergeStyleSets({ root: ['b', { background: 'purple' }] }, styles);
+    const styles3: ITestClasses = mergeStyleSets(styles, { root: ['b', { background: 'purple' }] });
+    const styles4: ITestClasses = mergeStyleSets(styles, styles2, styles3, { root: 'c' });
+
+    expect(styles).toEqual({ root: 'a root-0' });
+    expect(styles2).toEqual({ root: 'b a root-0' });
+    expect(styles3).toEqual({ root: 'a b root-1' });
+    expect(styles4).toEqual({ root: 'a b c root-1' });
+  });
+
   it('can merge two sets with class names', () => {
     const styleSet1: ITestClasses = mergeStyleSets({
       root: [
diff --git a/packages/merge-styles/src/mergeStyleSets.ts b/packages/merge-styles/src/mergeStyleSets.ts
index 38096d516b1be..ad617684f4442 100644
--- a/packages/merge-styles/src/mergeStyleSets.ts
+++ b/packages/merge-styles/src/mergeStyleSets.ts
@@ -14,6 +14,8 @@ export function mergeStyleSets<T>(
 ): T {
   // tslint:disable-next-line:no-any
   const classNameSet: any = {};
+  const classMap: { [key: string]: string } = {};
+
   let cssSet = cssSets[0];
 
   if (cssSet) {
@@ -34,6 +36,7 @@ export function mergeStyleSets<T>(
         registrations.push(registration);
 
         if (registration) {
+          classMap[prop] = registration.className;
           classNameSet[prop] = classes.concat([registration.className]).join(' ');
         }
       }
@@ -41,7 +44,7 @@ export function mergeStyleSets<T>(
 
     for (const registration of registrations) {
       if (registration) {
-        applyRegistration(registration, classNameSet);
+        applyRegistration(registration, classMap);
       }
     }
   }
diff --git a/packages/merge-styles/src/mergeStyles.test.ts b/packages/merge-styles/src/mergeStyles.test.ts
index 12f7cbdf4fd1a..7aba032d6df4e 100644
--- a/packages/merge-styles/src/mergeStyles.test.ts
+++ b/packages/merge-styles/src/mergeStyles.test.ts
@@ -18,6 +18,10 @@ describe('mergeStyles', () => {
     setRTL(false);
   });
 
+  it('can register the same static class twice', () => {
+    expect(mergeStyles('a', 'a')).toEqual('a');
+  });
+
   it('can register left', () => {
     mergeStyles({ left: 10 });
     expect(_stylesheet.getRules()).toEqual('.css-0{left:10px;}');

From 391456951206a4375a41273139d90dbfe6a6118d Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 11 Dec 2017 03:24:05 -0800
Subject: [PATCH 1130/1641] Applying package updates.

---
 .../merge-styles-fixes_2017-12-10-00-50.json       | 11 -----------
 packages/experiments/package.json                  |  2 +-
 packages/jest-serializer-merge-styles/package.json |  2 +-
 packages/merge-styles/CHANGELOG.json               | 14 ++++++++++++++
 packages/merge-styles/CHANGELOG.md                 |  9 ++++++++-
 packages/merge-styles/package.json                 |  2 +-
 packages/office-ui-fabric-react/package.json       |  2 +-
 packages/styling/package.json                      |  2 +-
 packages/utilities/package.json                    |  2 +-
 scripts/package.json                               |  2 +-
 10 files changed, 29 insertions(+), 19 deletions(-)
 delete mode 100644 common/changes/@uifabric/merge-styles/merge-styles-fixes_2017-12-10-00-50.json

diff --git a/common/changes/@uifabric/merge-styles/merge-styles-fixes_2017-12-10-00-50.json b/common/changes/@uifabric/merge-styles/merge-styles-fixes_2017-12-10-00-50.json
deleted file mode 100644
index 7a67facbf982c..0000000000000
--- a/common/changes/@uifabric/merge-styles/merge-styles-fixes_2017-12-10-00-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "Fixing issues where child variables in selectors would not expand correctly. Also fixing a case where the same static class registered in two different sets will not show up multiple times in the result from `mergeStyleSets`.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 4349411783b41..8ee85e1a5bdbe 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -30,7 +30,7 @@
     "@types/webpack-env": "1.13.0",
     "@uifabric/example-app-base": ">=5.1.2 <6.0.0",
     "@uifabric/file-type-icons": ">=0.1.0 <1.0.0",
-    "@uifabric/merge-styles": ">=5.0.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.8.1 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.0.1 <6.0.0",
     "es6-weak-map": "^2.0.2",
diff --git a/packages/jest-serializer-merge-styles/package.json b/packages/jest-serializer-merge-styles/package.json
index 1f659c280e008..afc074408bb8a 100644
--- a/packages/jest-serializer-merge-styles/package.json
+++ b/packages/jest-serializer-merge-styles/package.json
@@ -24,6 +24,6 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/merge-styles": ">=5.8.0 <6.0.0"
+    "@uifabric/merge-styles": ">=5.8.1 <6.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index 14ae3ad617d2b..0b754a56d298d 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.8.1",
+      "tag": "@uifabric/merge-styles_v5.8.1",
+      "date": "Mon, 11 Dec 2017 11:24:05 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "a1c3530c60b1b1b90de33fb917d0f668f1055525",
+            "comment": "Fixing issues where child variables in selectors would not expand correctly. Also fixing a case where the same static class registered in two different sets will not show up multiple times in the result from `mergeStyleSets`."
+          }
+        ]
+      }
+    },
     {
       "version": "5.8.0",
       "tag": "@uifabric/merge-styles_v5.8.0",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index 458d6c666bcd4..0ea0a14369ea5 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Fri, 01 Dec 2017 11:11:16 GMT and should not be manually modified.
+This log was last generated on Mon, 11 Dec 2017 11:24:05 GMT and should not be manually modified.
+
+## 5.8.1
+Mon, 11 Dec 2017 11:24:05 GMT
+
+### Patches
+
+- Fixing issues where child variables in selectors would not expand correctly. Also fixing a case where the same static class registered in two different sets will not show up multiple times in the result from `mergeStyleSets`.
 
 ## 5.8.0
 Fri, 01 Dec 2017 11:11:16 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index bcc8f00a6e41d..adfbfb90bd6d0 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.8.0",
+  "version": "5.8.1",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 5d9d0232090e2..2dafad92cc9b3 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -46,7 +46,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.8.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.8.1 <6.0.0",
     "@uifabric/styling": ">=5.14.0 <6.0.0",
     "@uifabric/utilities": ">=5.5.0 <6.0.0",
     "prop-types": "^15.5.10",
diff --git a/packages/styling/package.json b/packages/styling/package.json
index b37acb9f07556..c9cb11e7d61e4 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -31,7 +31,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
     "@uifabric/utilities": ">=5.5.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.8.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.8.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 35102b6ed2a1a..80bb299169ce3 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -34,7 +34,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/merge-styles": ">=5.8.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.8.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/scripts/package.json b/scripts/package.json
index cc33497ad2e89..e27c92f0cb2dd 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -11,7 +11,7 @@
     "@microsoft/api-extractor": "^4.2.6",
     "@microsoft/load-themed-styles": "^1.7.5",
     "@microsoft/loader-load-themed-styles": "^1.6.0",
-    "@uifabric/merge-styles": ">=5.8.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.8.1 <6.0.0",
     "autoprefixer": "^7.1.5",
     "awesome-typescript-loader": "^3.2.3",
     "bundlesize": "^0.15.2",

From 63fcf342aae0b90ba96eab00cbedb00bb9f3829f Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Mon, 11 Dec 2017 10:07:05 -0800
Subject: [PATCH 1131/1641] Adding tests to ActivityItem (#3440)

* Initial activity item test commit

* Removing previous typo named test

* Finished snapshot tests

* changing test coverage status to fair

* adding activity item to exports

* adding screener tests

* rush change

* test status good

* changing componentStatus.props to componentStatus.types to fix build

* updating snapshot

* Adding activity item to export bundle

* Fixing persona imports

* Fixing persona imports and story syntax

* Updated snapshot to reflect persona changes
---
 .../src/stories/ActivityItem.stories.tsx      |  62 ++
 ...rbrow-activity-tests_2017-11-21-17-48.json |  11 +
 .../src/ActivityItem.ts                       |   1 +
 .../ActivityItem/ActivitiyItem.test.tsx       |  19 -
 .../ActivityItem/ActivityItem.checklist.ts    |   8 +
 .../ActivityItem/ActivityItem.test.tsx        | 103 ++
 .../components/ActivityItem/ActivityItem.tsx  |   4 +-
 .../ActivityItem/ActivityItem.types.ts        |   2 +-
 .../ActivityItem/ActivityItemPage.tsx         |   7 +
 .../__snapshots__/ActivitiyItem.test.tsx.snap |  70 --
 .../__snapshots__/ActivityItem.test.tsx.snap  | 889 ++++++++++++++++++
 .../AllComponents.checklist.ts                |   1 +
 packages/office-ui-fabric-react/src/index.ts  |   1 +
 13 files changed, 1085 insertions(+), 93 deletions(-)
 create mode 100644 apps/vr-tests/src/stories/ActivityItem.stories.tsx
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-activity-tests_2017-11-21-17-48.json
 create mode 100644 packages/office-ui-fabric-react/src/ActivityItem.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/ActivityItem/ActivitiyItem.test.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.checklist.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.test.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivitiyItem.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap

diff --git a/apps/vr-tests/src/stories/ActivityItem.stories.tsx b/apps/vr-tests/src/stories/ActivityItem.stories.tsx
new file mode 100644
index 0000000000000..f7c01024664b4
--- /dev/null
+++ b/apps/vr-tests/src/stories/ActivityItem.stories.tsx
@@ -0,0 +1,62 @@
+/*! Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license. */
+import * as React from 'react';
+import Screener, { Steps } from 'screener-storybook/src/screener';
+import { storiesOf } from '@storybook/react';
+import { FabricDecorator } from '../utilities';
+import { ActivityItem, IActivityItemProps, Icon } from 'office-ui-fabric-react';
+
+storiesOf('ActivityItem', module)
+  .addDecorator(FabricDecorator)
+  .addDecorator(story => (
+    <Screener
+      steps={ new Steps()
+        .snapshot('default', { cropTo: '.testWrapper' })
+        .end()
+      }
+    >
+      { story() }
+    </Screener>
+  ))
+  .add('Root', () => (
+    <ActivityItem
+      activityIcon={ <Icon iconName={ 'Message' } /> }
+      activityDescription={ <span>description text</span> }
+      comments={ <span>comment text</span> }
+      timeStamp={ 'timeStamp text' }
+    />
+  ))
+  .add('Personas', () => (
+    <ActivityItem
+      activityPersonas={ [
+        { imageInitials: 'AB' },
+        { imageInitials: 'CD' },
+        { imageInitials: 'EF' },
+        { imageInitials: 'GH' }
+      ] }
+      activityDescription={ <span>description text</span> }
+      comments={ <span>comment text</span> }
+      timeStamp={ 'timeStamp text' }
+    />
+  ))
+  .add('Compact', () => (
+    <ActivityItem
+      activityIcon={ <Icon iconName={ 'Message' } /> }
+      isCompact={ true }
+      activityDescription={ <span>description text</span> }
+      comments={ <span>comment text</span> }
+      timeStamp={ 'timeStamp text' }
+    />
+  ))
+  .add('CompactPersonas', () => (
+    <ActivityItem
+      activityPersonas={ [
+        { imageInitials: 'AB' },
+        { imageInitials: 'CD' },
+        { imageInitials: 'EF' }
+      ] }
+      isCompact={ true }
+      activityDescription={ <span>description text</span> }
+      comments={ <span>comment text</span> }
+      timeStamp={ 'timeStamp text' }
+    />
+  ));
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-activity-tests_2017-11-21-17-48.json b/common/changes/office-ui-fabric-react/v-krbrow-activity-tests_2017-11-21-17-48.json
new file mode 100644
index 0000000000000..aff7445a13bd3
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-activity-tests_2017-11-21-17-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ActivityItem: Snapshot and Screener tests added",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/ActivityItem.ts b/packages/office-ui-fabric-react/src/ActivityItem.ts
new file mode 100644
index 0000000000000..f0dc67381e8b7
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/ActivityItem.ts
@@ -0,0 +1 @@
+export * from './components/ActivityItem/index';
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivitiyItem.test.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivitiyItem.test.tsx
deleted file mode 100644
index c91fd19c2baec..0000000000000
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivitiyItem.test.tsx
+++ /dev/null
@@ -1,19 +0,0 @@
-import * as React from 'react';
-import * as renderer from 'react-test-renderer';
-
-import { ActivityItem } from './ActivityItem';
-
-const defaultProps = {
-  key: 1,
-  activityDescription: <span>Activity description content</span>,
-  comments: <span>Comment content</span>,
-  timeStamp: 'Timestamp content'
-};
-
-describe('ActivityItem', () => {
-  it('renders ActivitiyItem correctly', () => {
-    const component = renderer.create(<ActivityItem {...defaultProps} />);
-    let tree = component.toJSON();
-    expect(tree).toMatchSnapshot();
-  });
-});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.checklist.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.checklist.ts
new file mode 100644
index 0000000000000..fbdb39030c14e
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.checklist.ts
@@ -0,0 +1,8 @@
+import { ChecklistStatus } from '../../demo/ComponentStatus/ComponentStatus.types';
+export const ActivityItemStatus = {
+  keyboardAccessibilitySupport: ChecklistStatus.unknown,
+  markupSupport: ChecklistStatus.unknown,
+  highContrastSupport: ChecklistStatus.pass,
+  rtlSupport: ChecklistStatus.pass,
+  testCoverage: ChecklistStatus.good
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.test.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.test.tsx
new file mode 100644
index 0000000000000..f993d7b6ae030
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.test.tsx
@@ -0,0 +1,103 @@
+/* tslint:disable-next-line:no-unused-variable */
+import * as React from 'react';
+import * as renderer from 'react-test-renderer';
+import { ActivityItem } from './ActivityItem';
+import { Icon } from '../Icon';
+import { TestImages } from '../../common/TestImages';
+
+const defaultProps = {
+  key: 1,
+  activityDescription: <span>description text</span>,
+  comments: <span>comment text</span>,
+  timeStamp: 'timestamp text'
+};
+
+const defaultPersonaProps = [
+  {
+    imageInitials: 'TN',
+    primaryText: 'Test Name'
+  },
+  {
+    imageUrl: TestImages.personaFemale
+  },
+  {
+    imageInitials: 'AN',
+    primaryText: 'Another Name'
+  },
+  {
+    imageUrl: TestImages.personaMale
+  }
+];
+
+describe('ActivityItem', () => {
+
+  it('renders with an icon correctly', () => {
+    let component = renderer.create(
+      <ActivityItem
+        {...defaultProps}
+        activityIcon={ <Icon iconName={ 'Message' } /> }
+      />
+    );
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
+  it('renders with a single persona correctly', () => {
+    let component = renderer.create(
+      <ActivityItem
+        {...defaultProps}
+        activityPersonas={ [defaultPersonaProps[0]] }
+      />
+    );
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
+  it('renders with multiple personas correctly', () => {
+    let component = renderer.create(
+      <ActivityItem
+        {...defaultProps}
+        activityPersonas={ defaultPersonaProps }
+      />
+    );
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
+  it('renders compact with an icon correctly', () => {
+    let component = renderer.create(
+      <ActivityItem
+        {...defaultProps}
+        activityIcon={ <Icon iconName={ 'Message' } /> }
+        isCompact={ true }
+      />
+    );
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
+  it('renders compact with a single persona correctly', () => {
+    let component = renderer.create(
+      <ActivityItem
+        {...defaultProps}
+        activityPersonas={ [defaultPersonaProps[0]] }
+        isCompact={ true }
+      />
+    );
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
+  it('renders compact with multiple personas correctly', () => {
+    let component = renderer.create(
+      <ActivityItem
+        {...defaultProps}
+        activityPersonas={ defaultPersonaProps }
+        isCompact={ true }
+      />
+    );
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
+});
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
index 4b865a9a50b6f..d0f1f0a6057dd 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
@@ -7,9 +7,7 @@ import { IActivityItemProps, IActivityItemStyles } from './ActivityItem.types';
 import { mergeStyles } from '../../Styling';
 import { IActivityItemClassNames, getClassNames } from './ActivityItem.classNames';
 import { getStyles } from './ActivityItem.styles';
-import { PersonaSize } from 'office-ui-fabric-react/lib/Persona';
-import { PersonaCoin } from 'office-ui-fabric-react/lib/PersonaCoin';
-import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
+import { PersonaSize, PersonaCoin, IPersonaProps} from '../Persona';
 
 export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
   private _classNames: IActivityItemClassNames;
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.types.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.types.ts
index d8d714d69de10..a24865a115d79 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.types.ts
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { IStyle } from '../../Styling';
 import { IRenderFunction } from '../../Utilities';
-import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
+import { IPersonaProps } from '../Persona';
 
 // Please keep alphabetized
 export interface IActivityItemProps extends React.AllHTMLAttributes<HTMLElement> {
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItemPage.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItemPage.tsx
index 44ba1db273afa..156563f8dbb9b 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItemPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItemPage.tsx
@@ -6,6 +6,8 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import './examples/ActivityItem.Example.scss';
+import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
+import { ActivityItemStatus } from './ActivityItem.checklist';
 import { ActivityItemBasicExample } from './examples/ActivityItem.Basic.Example';
 import { ActivityItemPersonaExample } from './examples/ActivityItem.Persona.Example';
 import { ActivityItemCompactExample } from './examples/ActivityItem.Compact.Example';
@@ -66,6 +68,11 @@ export class ActivityItemPage extends React.Component<IComponentDemoPageProps, {
           </div>
         }
         isHeaderVisible={ this.props.isHeaderVisible }
+        componentStatus={
+          <ComponentStatus
+            {...ActivityItemStatus}
+          />
+        }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivitiyItem.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivitiyItem.test.tsx.snap
deleted file mode 100644
index f3773b3806034..0000000000000
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivitiyItem.test.tsx.snap
+++ /dev/null
@@ -1,70 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`ActivityItem renders ActivitiyItem correctly 1`] = `
-<div
-  className=
-      ms-ActivityItem
-      {
-        -moz-osx-font-smoothing: grayscale;
-        -webkit-font-smoothing: antialiased;
-        align-items: flex-start;
-        box-sizing: border-box;
-        color: #666666;
-        display: flex;
-        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
-        font-size: 12px;
-        font-weight: 400;
-        justify-content: flex-start;
-        line-height: 17px;
-      }
-  style={undefined}
->
-  <div
-    className=
-        ms-ActivityItem-activityContent
-        {
-          padding-bottom: 0;
-          padding-left: 8px;
-          padding-right: 8px;
-          padding-top: 0;
-        }
-  >
-    <span
-      className=
-          ms-ActivityItem-activityText
-          {
-            display: inline;
-          }
-    >
-      <span>
-        Activity description content
-      </span>
-    </span>
-    <div
-      className=
-          ms-ActivityItem-commentText
-          {
-            color: #333333;
-          }
-    >
-      <span>
-        Comment content
-      </span>
-    </div>
-    <div
-      className=
-          ms-ActivityItem-timeStamp
-          {
-            -moz-osx-font-smoothing: grayscale;
-            -webkit-font-smoothing: antialiased;
-            color: #666666;
-            font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
-            font-size: 10px;
-            font-weight: 400;
-          }
-    >
-      Timestamp content
-    </div>
-  </div>
-</div>
-`;
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap
new file mode 100644
index 0000000000000..9fa533ba04b9a
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap
@@ -0,0 +1,889 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ActivityItem renders compact with a single persona correctly 1`] = `
+<div
+  className=
+      ms-ActivityItem
+      {
+        -moz-osx-font-smoothing: grayscale;
+        -webkit-font-smoothing: antialiased;
+        align-items: center;
+        box-sizing: border-box;
+        color: #666666;
+        display: flex;
+        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-size: 12px;
+        font-weight: 400;
+        justify-content: flex-start;
+        line-height: 17px;
+      }
+  style={undefined}
+>
+  <div
+    className=
+        ms-ActivityItem-activityTypeIcon
+        {
+          color: #0078d7;
+          font-size: 13px;
+          height: 16px;
+          line-height: 13px;
+          margin-top: 1px;
+        }
+        & .ms-Persona-imageArea {
+          border-radius: 50%;
+          border: 2px solid#ffffff;
+          margin-top: -2px;
+        }
+        @media screen and (-ms-high-contrast: active){& .ms-Persona-imageArea {
+          border: none;
+          margin-top: 0;
+        }
+  >
+    <div
+      className=
+          ms-ActivityItem-personaContainer
+          {
+            display: inline-flex;
+            flex-basis: auto;
+            flex-wrap: nowrap;
+            height: 16px;
+            min-width: 0;
+            padding-right: 6px;
+            width: auto;
+          }
+    >
+      <div
+        className="ms-Persona-coin ms-Persona--size16 undefined"
+        size={8}
+        style={
+          Object {
+            "display": "inline-block",
+            "minWidth": "10px",
+            "overflow": "visible",
+            "width": "10px",
+          }
+        }
+      >
+        <div
+          className="ms-Persona-imageArea"
+          style={undefined}
+        >
+          <div
+            aria-hidden="true"
+            className=
+                ms-Persona-initials
+                {
+                  background-color: #2D89EF;
+                }
+            style={undefined}
+          >
+            <span>
+              TN
+            </span>
+          </div>
+          <div
+            className="ms-Image ms-Persona-image"
+            style={
+              Object {
+                "height": undefined,
+                "width": undefined,
+              }
+            }
+          >
+            <img
+              alt=""
+              className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+              onError={[Function]}
+              onLoad={[Function]}
+              role={undefined}
+              src={undefined}
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div
+    className=
+        ms-ActivityItem-activityContent
+        {
+          flex: 1;
+          overflow-x: hidden;
+          padding-bottom: 0;
+          padding-left: 4px;
+          padding-right: 4px;
+          padding-top: 0;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+        }
+  >
+    <span
+      className=
+          ms-ActivityItem-activityText
+          {
+            display: inline;
+          }
+    >
+      <span>
+        description text
+      </span>
+    </span>
+  </div>
+</div>
+`;
+
+exports[`ActivityItem renders compact with an icon correctly 1`] = `
+<div
+  className=
+      ms-ActivityItem
+      {
+        -moz-osx-font-smoothing: grayscale;
+        -webkit-font-smoothing: antialiased;
+        align-items: center;
+        box-sizing: border-box;
+        color: #666666;
+        display: flex;
+        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-size: 12px;
+        font-weight: 400;
+        justify-content: flex-start;
+        line-height: 17px;
+      }
+  style={undefined}
+>
+  <div
+    className=
+        ms-ActivityItem-activityTypeIcon
+        {
+          color: #0078d7;
+          font-size: 13px;
+          height: 16px;
+          line-height: 13px;
+          margin-top: 1px;
+        }
+        & .ms-Persona-imageArea {
+          border-radius: 50%;
+          border: 2px solid#ffffff;
+          margin-top: -2px;
+        }
+        @media screen and (-ms-high-contrast: active){& .ms-Persona-imageArea {
+          border: none;
+          margin-top: 0;
+        }
+  >
+    <i
+      aria-hidden={true}
+      aria-label={undefined}
+      className=
+          ms-Icon
+          {
+            display: inline-block;
+          }
+      data-icon-name="Message"
+      role="presentation"
+    />
+  </div>
+  <div
+    className=
+        ms-ActivityItem-activityContent
+        {
+          flex: 1;
+          overflow-x: hidden;
+          padding-bottom: 0;
+          padding-left: 4px;
+          padding-right: 4px;
+          padding-top: 0;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+        }
+  >
+    <span
+      className=
+          ms-ActivityItem-activityText
+          {
+            display: inline;
+          }
+    >
+      <span>
+        description text
+      </span>
+    </span>
+  </div>
+</div>
+`;
+
+exports[`ActivityItem renders compact with multiple personas correctly 1`] = `
+<div
+  className=
+      ms-ActivityItem
+      {
+        -moz-osx-font-smoothing: grayscale;
+        -webkit-font-smoothing: antialiased;
+        align-items: center;
+        box-sizing: border-box;
+        color: #666666;
+        display: flex;
+        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-size: 12px;
+        font-weight: 400;
+        justify-content: flex-start;
+        line-height: 17px;
+      }
+  style={undefined}
+>
+  <div
+    className=
+        ms-ActivityItem-activityTypeIcon
+        {
+          color: #0078d7;
+          font-size: 13px;
+          height: 16px;
+          line-height: 13px;
+          margin-top: 1px;
+        }
+        & .ms-Persona-imageArea {
+          border-radius: 50%;
+          border: 2px solid#ffffff;
+          margin-top: -2px;
+        }
+        @media screen and (-ms-high-contrast: active){& .ms-Persona-imageArea {
+          border: none;
+          margin-top: 0;
+        }
+  >
+    <div
+      className=
+          ms-ActivityItem-personaContainer
+          {
+            display: inline-flex;
+            flex-basis: auto;
+            flex-wrap: nowrap;
+            height: 16px;
+            min-width: 0;
+            padding-right: 6px;
+            width: auto;
+          }
+    >
+      <div
+        className="ms-Persona-coin ms-Persona--size16 undefined"
+        size={8}
+        style={
+          Object {
+            "display": "inline-block",
+            "minWidth": "10px",
+            "overflow": "visible",
+            "width": "10px",
+          }
+        }
+      >
+        <div
+          className="ms-Persona-imageArea"
+          style={undefined}
+        >
+          <div
+            aria-hidden="true"
+            className=
+                ms-Persona-initials
+                {
+                  background-color: #2D89EF;
+                }
+            style={undefined}
+          >
+            <span>
+              TN
+            </span>
+          </div>
+          <div
+            className="ms-Image ms-Persona-image"
+            style={
+              Object {
+                "height": undefined,
+                "width": undefined,
+              }
+            }
+          >
+            <img
+              alt=""
+              className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+              onError={[Function]}
+              onLoad={[Function]}
+              role={undefined}
+              src={undefined}
+            />
+          </div>
+        </div>
+      </div>
+      <div
+        className="ms-Persona-coin ms-Persona--size16 undefined"
+        size={8}
+        style={
+          Object {
+            "display": "inline-block",
+            "minWidth": "10px",
+            "overflow": "visible",
+            "width": "10px",
+          }
+        }
+      >
+        <div
+          className="ms-Persona-imageArea"
+          style={undefined}
+        >
+          <div
+            className="ms-Image ms-Persona-image"
+            style={
+              Object {
+                "height": undefined,
+                "width": undefined,
+              }
+            }
+          >
+            <img
+              alt=""
+              className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+              onError={[Function]}
+              onLoad={[Function]}
+              role={undefined}
+              src="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets/persona-female.png"
+            />
+          </div>
+        </div>
+      </div>
+      <div
+        className="ms-Persona-coin ms-Persona--size16 undefined"
+        size={8}
+        style={
+          Object {
+            "display": "inline-block",
+            "minWidth": "10px",
+            "overflow": "visible",
+            "width": "10px",
+          }
+        }
+      >
+        <div
+          className="ms-Persona-imageArea"
+          style={undefined}
+        >
+          <div
+            aria-hidden="true"
+            className=
+                ms-Persona-initials
+                {
+                  background-color: #00ABA9;
+                }
+            style={undefined}
+          >
+            <span>
+              AN
+            </span>
+          </div>
+          <div
+            className="ms-Image ms-Persona-image"
+            style={
+              Object {
+                "height": undefined,
+                "width": undefined,
+              }
+            }
+          >
+            <img
+              alt=""
+              className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+              onError={[Function]}
+              onLoad={[Function]}
+              role={undefined}
+              src={undefined}
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div
+    className=
+        ms-ActivityItem-activityContent
+        {
+          flex: 1;
+          overflow-x: hidden;
+          padding-bottom: 0;
+          padding-left: 4px;
+          padding-right: 4px;
+          padding-top: 0;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+        }
+  >
+    <span
+      className=
+          ms-ActivityItem-activityText
+          {
+            display: inline;
+          }
+    >
+      <span>
+        description text
+      </span>
+    </span>
+  </div>
+</div>
+`;
+
+exports[`ActivityItem renders with a single persona correctly 1`] = `
+<div
+  className=
+      ms-ActivityItem
+      {
+        -moz-osx-font-smoothing: grayscale;
+        -webkit-font-smoothing: antialiased;
+        align-items: flex-start;
+        box-sizing: border-box;
+        color: #666666;
+        display: flex;
+        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-size: 12px;
+        font-weight: 400;
+        justify-content: flex-start;
+        line-height: 17px;
+      }
+  style={undefined}
+>
+  <div
+    className=
+        ms-ActivityItem-activityTypeIcon
+        {
+          font-size: 16px;
+          height: 32px;
+          line-height: 16px;
+          margin-top: 3px;
+        }
+  >
+    <div
+      className=
+          ms-ActivityItem-personaContainer
+          {
+            display: flex;
+            flex-wrap: wrap;
+            height: 32px;
+            min-width: 32px;
+            width: 32px;
+          }
+    >
+      <div
+        className="ms-Persona-coin ms-Persona--size32 undefined"
+        size={11}
+        style={undefined}
+      >
+        <div
+          className="ms-Persona-imageArea"
+          style={undefined}
+        >
+          <div
+            aria-hidden="true"
+            className=
+                ms-Persona-initials
+                {
+                  background-color: #2D89EF;
+                }
+            style={undefined}
+          >
+            <span>
+              TN
+            </span>
+          </div>
+          <div
+            className="ms-Image ms-Persona-image"
+            style={
+              Object {
+                "height": 32,
+                "width": 32,
+              }
+            }
+          >
+            <img
+              alt=""
+              className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+              onError={[Function]}
+              onLoad={[Function]}
+              role={undefined}
+              src={undefined}
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div
+    className=
+        ms-ActivityItem-activityContent
+        {
+          padding-bottom: 0;
+          padding-left: 8px;
+          padding-right: 8px;
+          padding-top: 0;
+        }
+  >
+    <span
+      className=
+          ms-ActivityItem-activityText
+          {
+            display: inline;
+          }
+    >
+      <span>
+        description text
+      </span>
+    </span>
+    <div
+      className=
+          ms-ActivityItem-commentText
+          {
+            color: #333333;
+          }
+    >
+      <span>
+        comment text
+      </span>
+    </div>
+    <div
+      className=
+          ms-ActivityItem-timeStamp
+          {
+            -moz-osx-font-smoothing: grayscale;
+            -webkit-font-smoothing: antialiased;
+            color: #666666;
+            font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+            font-size: 10px;
+            font-weight: 400;
+          }
+    >
+      timestamp text
+    </div>
+  </div>
+</div>
+`;
+
+exports[`ActivityItem renders with an icon correctly 1`] = `
+<div
+  className=
+      ms-ActivityItem
+      {
+        -moz-osx-font-smoothing: grayscale;
+        -webkit-font-smoothing: antialiased;
+        align-items: flex-start;
+        box-sizing: border-box;
+        color: #666666;
+        display: flex;
+        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-size: 12px;
+        font-weight: 400;
+        justify-content: flex-start;
+        line-height: 17px;
+      }
+  style={undefined}
+>
+  <div
+    className=
+        ms-ActivityItem-activityTypeIcon
+        {
+          font-size: 16px;
+          height: 32px;
+          line-height: 16px;
+          margin-top: 3px;
+        }
+  >
+    <i
+      aria-hidden={true}
+      aria-label={undefined}
+      className=
+          ms-Icon
+          {
+            display: inline-block;
+          }
+      data-icon-name="Message"
+      role="presentation"
+    />
+  </div>
+  <div
+    className=
+        ms-ActivityItem-activityContent
+        {
+          padding-bottom: 0;
+          padding-left: 8px;
+          padding-right: 8px;
+          padding-top: 0;
+        }
+  >
+    <span
+      className=
+          ms-ActivityItem-activityText
+          {
+            display: inline;
+          }
+    >
+      <span>
+        description text
+      </span>
+    </span>
+    <div
+      className=
+          ms-ActivityItem-commentText
+          {
+            color: #333333;
+          }
+    >
+      <span>
+        comment text
+      </span>
+    </div>
+    <div
+      className=
+          ms-ActivityItem-timeStamp
+          {
+            -moz-osx-font-smoothing: grayscale;
+            -webkit-font-smoothing: antialiased;
+            color: #666666;
+            font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+            font-size: 10px;
+            font-weight: 400;
+          }
+    >
+      timestamp text
+    </div>
+  </div>
+</div>
+`;
+
+exports[`ActivityItem renders with multiple personas correctly 1`] = `
+<div
+  className=
+      ms-ActivityItem
+      {
+        -moz-osx-font-smoothing: grayscale;
+        -webkit-font-smoothing: antialiased;
+        align-items: flex-start;
+        box-sizing: border-box;
+        color: #666666;
+        display: flex;
+        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-size: 12px;
+        font-weight: 400;
+        justify-content: flex-start;
+        line-height: 17px;
+      }
+  style={undefined}
+>
+  <div
+    className=
+        ms-ActivityItem-activityTypeIcon
+        {
+          font-size: 16px;
+          height: 32px;
+          line-height: 16px;
+          margin-top: 3px;
+        }
+  >
+    <div
+      className=
+          ms-ActivityItem-personaContainer
+          {
+            display: flex;
+            flex-wrap: wrap;
+            height: 32px;
+            min-width: 32px;
+            width: 32px;
+          }
+    >
+      <div
+        className="ms-Persona-coin ms-Persona--size16 undefined"
+        size={8}
+        style={undefined}
+      >
+        <div
+          className="ms-Persona-imageArea"
+          style={undefined}
+        >
+          <div
+            aria-hidden="true"
+            className=
+                ms-Persona-initials
+                {
+                  background-color: #2D89EF;
+                }
+            style={undefined}
+          >
+            <span>
+              TN
+            </span>
+          </div>
+          <div
+            className="ms-Image ms-Persona-image"
+            style={
+              Object {
+                "height": undefined,
+                "width": undefined,
+              }
+            }
+          >
+            <img
+              alt=""
+              className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+              onError={[Function]}
+              onLoad={[Function]}
+              role={undefined}
+              src={undefined}
+            />
+          </div>
+        </div>
+      </div>
+      <div
+        className="ms-Persona-coin ms-Persona--size16 undefined"
+        size={8}
+        style={undefined}
+      >
+        <div
+          className="ms-Persona-imageArea"
+          style={undefined}
+        >
+          <div
+            className="ms-Image ms-Persona-image"
+            style={
+              Object {
+                "height": undefined,
+                "width": undefined,
+              }
+            }
+          >
+            <img
+              alt=""
+              className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+              onError={[Function]}
+              onLoad={[Function]}
+              role={undefined}
+              src="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets/persona-female.png"
+            />
+          </div>
+        </div>
+      </div>
+      <div
+        className="ms-Persona-coin ms-Persona--size16 undefined"
+        size={8}
+        style={undefined}
+      >
+        <div
+          className="ms-Persona-imageArea"
+          style={undefined}
+        >
+          <div
+            aria-hidden="true"
+            className=
+                ms-Persona-initials
+                {
+                  background-color: #00ABA9;
+                }
+            style={undefined}
+          >
+            <span>
+              AN
+            </span>
+          </div>
+          <div
+            className="ms-Image ms-Persona-image"
+            style={
+              Object {
+                "height": undefined,
+                "width": undefined,
+              }
+            }
+          >
+            <img
+              alt=""
+              className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+              onError={[Function]}
+              onLoad={[Function]}
+              role={undefined}
+              src={undefined}
+            />
+          </div>
+        </div>
+      </div>
+      <div
+        className="ms-Persona-coin ms-Persona--size16 undefined"
+        size={8}
+        style={undefined}
+      >
+        <div
+          className="ms-Persona-imageArea"
+          style={undefined}
+        >
+          <div
+            className="ms-Image ms-Persona-image"
+            style={
+              Object {
+                "height": undefined,
+                "width": undefined,
+              }
+            }
+          >
+            <img
+              alt=""
+              className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+              onError={[Function]}
+              onLoad={[Function]}
+              role={undefined}
+              src="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets/persona-male.png"
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div
+    className=
+        ms-ActivityItem-activityContent
+        {
+          padding-bottom: 0;
+          padding-left: 8px;
+          padding-right: 8px;
+          padding-top: 0;
+        }
+  >
+    <span
+      className=
+          ms-ActivityItem-activityText
+          {
+            display: inline;
+          }
+    >
+      <span>
+        description text
+      </span>
+    </span>
+    <div
+      className=
+          ms-ActivityItem-commentText
+          {
+            color: #333333;
+          }
+    >
+      <span>
+        comment text
+      </span>
+    </div>
+    <div
+      className=
+          ms-ActivityItem-timeStamp
+          {
+            -moz-osx-font-smoothing: grayscale;
+            -webkit-font-smoothing: antialiased;
+            color: #666666;
+            font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+            font-size: 10px;
+            font-weight: 400;
+          }
+    >
+      timestamp text
+    </div>
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/demo/ComponentStatus/AllComponents.checklist.ts b/packages/office-ui-fabric-react/src/demo/ComponentStatus/AllComponents.checklist.ts
index 44a02d898635f..055d491471f91 100644
--- a/packages/office-ui-fabric-react/src/demo/ComponentStatus/AllComponents.checklist.ts
+++ b/packages/office-ui-fabric-react/src/demo/ComponentStatus/AllComponents.checklist.ts
@@ -4,6 +4,7 @@ export interface IComponentStatusState {
   [key: string]: IComponentStatusProps;
 }
 export const AllComponentsStatus: IComponentStatusState = {
+  ActivityItem: require<any>('../../components/ActivityItem/ActivityItem.checklist').ActivityItemStatus,
   Breadcrumb: require<any>('../../components/Breadcrumb/Breadcrumb.checklist').BreadcrumbStatus,
   Button: require<any>('../../components/Button/Button.checklist').ButtonStatus,
   Calendar: require<any>('../../components/Calendar/Calendar.checklist').CalendarStatus,
diff --git a/packages/office-ui-fabric-react/src/index.ts b/packages/office-ui-fabric-react/src/index.ts
index 45c4ee48ea8c5..5968b80aea6bf 100644
--- a/packages/office-ui-fabric-react/src/index.ts
+++ b/packages/office-ui-fabric-react/src/index.ts
@@ -3,6 +3,7 @@
  * parsed and available at load time, which is not necessary for most cases.
  */
 
+export * from './ActivityItem';
 export * from './Breadcrumb';
 export * from './Button';
 export * from './Calendar';

From 1fe2b91ec993ea6a3ca500c62c755303431636ba Mon Sep 17 00:00:00 2001
From: Lambert W <lambert.ww@gmail.com>
Date: Mon, 11 Dec 2017 10:38:16 -0800
Subject: [PATCH 1132/1641] List: Support Ghosting while scrolling (#3547)

* Added list ghosting

* Change file

* Missing semicolon

* @Param syntax for onRenderCell
---
 ...lantoo-list_ghosting_2017-12-08-23-54.json | 11 ++++
 .../src/components/List/List.tsx              | 32 ++++++++++-
 .../src/components/List/List.types.ts         |  9 +++-
 .../src/components/List/ListPage.tsx          |  5 ++
 .../List/examples/List.Ghosting.Example.scss  | 54 +++++++++++++++++++
 .../List/examples/List.Ghosting.Example.tsx   | 51 ++++++++++++++++++
 6 files changed, 158 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/magellantoo-list_ghosting_2017-12-08-23-54.json
 create mode 100644 packages/office-ui-fabric-react/src/components/List/examples/List.Ghosting.Example.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/List/examples/List.Ghosting.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/magellantoo-list_ghosting_2017-12-08-23-54.json b/common/changes/office-ui-fabric-react/magellantoo-list_ghosting_2017-12-08-23-54.json
new file mode 100644
index 0000000000000..70d28f0b10b3b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/magellantoo-list_ghosting_2017-12-08-23-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "List: Support ghosting",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index 9c8c6022a322f..a6b391d45052f 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -17,6 +17,8 @@ const RESIZE_DELAY = 16;
 const MIN_SCROLL_UPDATE_DELAY = 100;
 const MAX_SCROLL_UPDATE_DELAY = 500;
 const IDLE_DEBOUNCE_DELAY = 200;
+// The amount of time to wait before declaring that the list isn't scrolling
+const DONE_SCROLLING_WAIT = 500;
 const DEFAULT_ITEMS_PER_PAGE = 10;
 const DEFAULT_PAGE_HEIGHT = 30;
 const DEFAULT_RENDERED_WINDOWS_BEHIND = 2;
@@ -27,6 +29,7 @@ export interface IListState {
 
   /** The last versionstamp for  */
   measureVersion?: number;
+  isScrolling?: boolean;
 }
 
 interface IPageCacheItem {
@@ -126,7 +129,8 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     super(props);
 
     this.state = {
-      pages: []
+      pages: [],
+      isScrolling: false
     };
 
     this._estimatedPageHeight = 0;
@@ -159,6 +163,13 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
         leading: false
       });
 
+    this._onScrollingDone = this._async.debounce(
+      this._onScrollingDone,
+      DONE_SCROLLING_WAIT, {
+        leading: false
+      }
+    );
+
     this._cachedPageHeights = {};
     this._estimatedPageHeight = 0;
     this._focusedIndex = -1;
@@ -282,6 +293,11 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     let { pages: newPages } = newState;
     let shouldComponentUpdate = false;
 
+    // Update if the page stops scrolling
+    if (!newState.isScrolling && this.state.isScrolling) {
+      return true;
+    }
+
     if (newProps.items === this.props.items &&
       oldPages!.length === newPages!.length) {
       for (let i = 0; i < oldPages!.length; i++) {
@@ -446,7 +462,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
           data-list-index={ index }
           data-automationid='ListCell'
         >
-          { onRenderCell && onRenderCell(item, index) }
+          { onRenderCell && onRenderCell(item, index, this.state.isScrolling) }
         </div>
       );
     });
@@ -479,7 +495,11 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
    * we will call onAsyncIdle which will reset it back to it's correct value.
    */
   private _onScroll() {
+    if (!this.state.isScrolling) {
+      this.setState({ isScrolling: true });
+    }
     this._resetRequiredWindows();
+    this._onScrollingDone();
   }
 
   private _resetRequiredWindows() {
@@ -530,6 +550,14 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     }
   }
 
+  /**
+   * Function to call when the list is done scrolling.
+   * This function is debounced.
+   */
+  private _onScrollingDone() {
+    this.setState({ isScrolling: false });
+  }
+
   private _onAsyncResize() {
     this.forceUpdate();
   }
diff --git a/packages/office-ui-fabric-react/src/components/List/List.types.ts b/packages/office-ui-fabric-react/src/components/List/List.types.ts
index 26b035ed8ec08..e3e85ff17ca0c 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.types.ts
+++ b/packages/office-ui-fabric-react/src/components/List/List.types.ts
@@ -29,8 +29,13 @@ export interface IListProps extends React.HTMLAttributes<List | HTMLDivElement>
   /** Items to render. */
   items?: any[];
 
-  /** Method to call when trying to render an item. */
-  onRenderCell?: (item?: any, index?: number) => React.ReactNode;
+  /**
+   * Method to call when trying to render an item.
+   * @param {any} item - The the data associated with the cell that is being rendered.
+   * @param {number} index - The index of the cell being rendered.
+   * @param {boolean} isScrolling - True if the list is being scrolled. May be useful for rendering a placeholder if your cells are complex.
+   */
+  onRenderCell?: (item?: any, index?: number, isScrolling?: boolean) => React.ReactNode;
 
   /** Optional callback for monitoring when a page is added. */
   onPageAdded?: (page: IPage) => void;
diff --git a/packages/office-ui-fabric-react/src/components/List/ListPage.tsx b/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
index 91b22fe8d35fd..a34bebbfdb821 100644
--- a/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
@@ -8,6 +8,7 @@ import {
 import { ListBasicExample } from './examples/List.Basic.Example';
 import { ListGridExample } from './examples/List.Grid.Example';
 import { ListScrollingExample } from './examples/List.Scrolling.Example';
+import { ListGhostingExample } from './examples/List.Ghosting.Example';
 import { createListItems } from '@uifabric/example-app-base';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { ListStatus } from './List.checklist';
@@ -15,6 +16,7 @@ import { ListStatus } from './List.checklist';
 const ListBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx') as string;
 const ListGridExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx') as string;
 const ListScrollingExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx') as string;
+const ListGhostingExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/List/examples/List.Ghosting.Example.tsx') as string;
 
 let _cachedItems: any;
 
@@ -41,6 +43,9 @@ export class ListPage extends React.Component<IComponentDemoPageProps, {}> {
             <ExampleCard title='Scrolling items into view' isOptIn={ true } code={ ListScrollingExampleCode }>
               <ListScrollingExample items={ _cachedItems } />
             </ExampleCard>
+            <ExampleCard title='Rendering ghost items while the list is scrolling' isOptIn={ true } code={ ListGhostingExampleCode }>
+              <ListGhostingExample items={ _cachedItems } />
+            </ExampleCard>
           </div>
         }
         propertiesTables={
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Ghosting.Example.scss b/packages/office-ui-fabric-react/src/components/List/examples/List.Ghosting.Example.scss
new file mode 100644
index 0000000000000..bcf7847deeace
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Ghosting.Example.scss
@@ -0,0 +1,54 @@
+@import '../../../common/common';
+
+:global {
+  .ms-ListGhostingExample {
+    &-container {
+      overflow: auto;
+      max-height: 500px;
+    }
+
+    &-itemCell {
+      @include focus-border();
+
+      min-height: 54px;
+      padding: 10px;
+      box-sizing: border-box;
+      border-bottom: 1px solid $bodyDividerColor;
+      display: flex;
+      &:hover {
+        background: #EEE;
+      }
+    }
+
+    &-itemImage {
+      flex-shrink: 0;
+    }
+
+    &-itemContent {
+      @include margin-left(10px);
+      overflow: hidden;
+      flex-grow: 1;
+    }
+
+    &-itemName {
+      @include ms-font-xl;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+
+    &-itemIndex {
+      font-size: $ms-font-size-s;
+      color: $ms-color-neutralTertiary;
+      margin-bottom: 10px;
+    }
+
+    &-chevron {
+      align-self: center;
+      @include margin-left(10px);
+      color: $ms-color-neutralTertiary;
+      font-size: $ms-font-size-l;
+      flex-shrink: 0;
+    }
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Ghosting.Example.tsx b/packages/office-ui-fabric-react/src/components/List/examples/List.Ghosting.Example.tsx
new file mode 100644
index 0000000000000..df36023f1ddb3
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Ghosting.Example.tsx
@@ -0,0 +1,51 @@
+import * as React from 'react';
+import {
+  FocusZone,
+  FocusZoneDirection
+} from 'office-ui-fabric-react/lib/FocusZone';
+import { List } from 'office-ui-fabric-react/lib/List';
+import { Image, ImageFit } from 'office-ui-fabric-react/lib/Image';
+import './List.Ghosting.Example.scss';
+
+export interface IListGhostingExampleProps {
+  items: any[];
+}
+
+export class ListGhostingExample extends React.Component<IListGhostingExampleProps, {}> {
+  constructor(props: IListGhostingExampleProps) {
+    super(props);
+  }
+
+  public render() {
+    let { items } = this.props;
+
+    return (
+      <FocusZone direction={ FocusZoneDirection.vertical }>
+        <div className='ms-ListGhostingExample-container' data-is-scrollable={ true }>
+          <List
+            items={ items }
+            onRenderCell={ this._onRenderCell }
+          />
+        </div>
+      </FocusZone>
+    );
+  }
+
+  private _onRenderCell(item: any, index: number, isScrolling: boolean): JSX.Element {
+    return (
+      <div className='ms-ListGhostingExample-itemCell' data-is-focusable={ true }>
+        <Image
+          className='ms-ListGhostingExample-itemImage'
+          src={ isScrolling ? undefined : item.thumbnail }
+          width={ 50 }
+          height={ 50 }
+          imageFit={ ImageFit.cover }
+        />
+        <div className='ms-ListGhostingExample-itemContent'>
+          <div className='ms-ListGhostingExample-itemName'>{ item.name }</div>
+          <div className='ms-ListGhostingExample-itemIndex'>{ `Item ${index}` }</div>
+        </div>
+      </div>
+    );
+  }
+}

From 253922868e6305b04c194ca8906e333d5abe6ebf Mon Sep 17 00:00:00 2001
From: Chao <fengchao199011@hotmail.com>
Date: Mon, 11 Dec 2017 13:37:58 -0800
Subject: [PATCH 1133/1641] remove customized dismiss function in hover card
 (#3489)

* remove customized dismiss function in hover card

* rush change

* add ref in tile component

* rush change in experiments

* change comments

* change hot key for hover card to "c"
---
 ...rCard_EventHandleFix_2017-12-01-00-46.json | 11 ++++++
 ...rCard_EventHandleFix_2017-11-30-19-26.json | 11 ++++++
 .../experiments/src/components/Tile/Tile.tsx  |  1 +
 .../src/components/Tile/Tile.types.ts         |  7 ++++
 .../FocusTrapZone/FocusTrapZone.tsx           | 13 ++++++-
 .../FocusTrapZone/FocusTrapZone.types.ts      |  6 +++
 .../components/HoverCard/ExpandingCard.tsx    | 12 +++---
 .../HoverCard/ExpandingCard.types.ts          | 17 ++++++++
 .../src/components/HoverCard/HoverCard.tsx    | 39 +++++++++++++------
 packages/utilities/src/KeyCodes.ts            |  1 +
 10 files changed, 99 insertions(+), 19 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/chf-2017-11-hoverCard_EventHandleFix_2017-12-01-00-46.json
 create mode 100644 common/changes/office-ui-fabric-react/chf-2017-11-hoverCard_EventHandleFix_2017-11-30-19-26.json

diff --git a/common/changes/@uifabric/experiments/chf-2017-11-hoverCard_EventHandleFix_2017-12-01-00-46.json b/common/changes/@uifabric/experiments/chf-2017-11-hoverCard_EventHandleFix_2017-12-01-00-46.json
new file mode 100644
index 0000000000000..a65de0f6bcfe4
--- /dev/null
+++ b/common/changes/@uifabric/experiments/chf-2017-11-hoverCard_EventHandleFix_2017-12-01-00-46.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "add link ref in tile",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "chf@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/chf-2017-11-hoverCard_EventHandleFix_2017-11-30-19-26.json b/common/changes/office-ui-fabric-react/chf-2017-11-hoverCard_EventHandleFix_2017-11-30-19-26.json
new file mode 100644
index 0000000000000..ca2cc66a7e42c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/chf-2017-11-hoverCard_EventHandleFix_2017-11-30-19-26.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "remove customized dismiss function in HoverCard",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chf@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Tile/Tile.tsx b/packages/experiments/src/components/Tile/Tile.tsx
index 1bad1f990ad71..7ec440385048b 100644
--- a/packages/experiments/src/components/Tile/Tile.tsx
+++ b/packages/experiments/src/components/Tile/Tile.tsx
@@ -204,6 +204,7 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
         <a
           href={ href }
           onClick={ onClick }
+          ref={ this.props.linkRef }
           data-selection-invoke={ (isInvokable && selectionIndex > -1) ? true : undefined }
           className={ css('ms-Tile-link', TileStyles.link) }
         >
diff --git a/packages/experiments/src/components/Tile/Tile.types.ts b/packages/experiments/src/components/Tile/Tile.types.ts
index f129480b2e78b..aceaf8f7829e8 100644
--- a/packages/experiments/src/components/Tile/Tile.types.ts
+++ b/packages/experiments/src/components/Tile/Tile.types.ts
@@ -124,4 +124,11 @@ export interface ITileProps extends IBaseProps, React.AllHTMLAttributes<HTMLSpan
    * @memberof ITileProps
    */
   toggleSelectionAriaLabel?: boolean;
+
+  /**
+   * Link ref
+   * @type {() => void}
+   * @memberof ITileProps
+   */
+  linkRef?: (element: HTMLAnchorElement) => void;
 }
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
index 5e23cbb2631c2..a757b7be7b30c 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
@@ -39,10 +39,10 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
   }
 
   public componentDidMount() {
-    let { isClickableOutsideFocusTrap = false, forceFocusInsideTrap = true, elementToFocusOnDismiss } = this.props;
+    let { isClickableOutsideFocusTrap = false, forceFocusInsideTrap = true, elementToFocusOnDismiss, disableFirstFocus = false } = this.props;
 
     this._previouslyFocusedElement = elementToFocusOnDismiss ? elementToFocusOnDismiss : document.activeElement as HTMLElement;
-    if (!elementContains(this.refs.root, this._previouslyFocusedElement)) {
+    if (!elementContains(this.refs.root, this._previouslyFocusedElement) && !disableFirstFocus) {
       this.focus();
     }
 
@@ -94,6 +94,8 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
         ref='root'
         aria-labelledby={ ariaLabelledBy }
         onKeyDown={ this._onKeyboardHandler }
+        tabIndex={ -1 }
+        onFocus={ this._onRootFocus }
       >
         { this.props.children }
       </div>
@@ -122,6 +124,13 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
     }
   }
 
+  @autobind
+  private _onRootFocus(ev: React.FocusEvent<HTMLElement>) {
+    if (ev.target === this.refs.root) {
+      this.focus();
+    }
+  }
+
   @autobind
   private _onKeyboardHandler(ev: React.KeyboardEvent<HTMLElement>) {
     if (ev.which !== KeyCodes.tab) {
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.types.ts b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.types.ts
index be411060cd9db..59c0a35a08d89 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.types.ts
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.types.ts
@@ -47,4 +47,10 @@ export interface IFocusTrapZoneProps extends React.HTMLAttributes<HTMLDivElement
   * Indicates the selector for first focusable item
   */
   firstFocusableSelector?: string | (() => string);
+
+  /**
+   * Do not put focus onto first element when render focus trap zone
+   * @default false
+   */
+  disableFirstFocus?: boolean;
 }
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
index b3f3c943404be..7db069f775b54 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
@@ -6,6 +6,7 @@ import {
   getNativeProps,
   divProperties,
   customizable,
+  KeyCodes,
   autobind
 } from '../../Utilities';
 import { IExpandingCardProps, IExpandingCardStyles, ExpandingCardMode } from './ExpandingCard.types';
@@ -54,7 +55,6 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
     }
 
     if (this.props.trapFocus) {
-      this._expandingCard.focus();
       this._events.on(this._expandingCard, 'keydown', this._onDismiss);
     }
   }
@@ -70,6 +70,7 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
       styles: customStyles,
       compactCardHeight,
       directionalHintFixed,
+      firstFocus,
       expandedCardHeight
     } = this.props;
     this._styles = getStyles(theme!, customStyles);
@@ -77,8 +78,6 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
     const content = (
       <div
         ref={ this._resolveRef('_expandingCard') }
-        onFocusCapture={ this.props.onEnter }
-        onBlurCapture={ this.props.onLeave }
         onMouseEnter={ this.props.onEnter }
         onMouseLeave={ this.props.onLeave }
       >
@@ -101,10 +100,11 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
         directionalHintFixed={ directionalHintFixed }
         finalHeight={ compactCardHeight! + expandedCardHeight! }
         minPagePadding={ 24 }
+        onDismiss={ this.props.onLeave }
         gapSpace={ this.props.gapSpace }
       >
         { this.props.trapFocus ?
-          <FocusTrapZone>
+          <FocusTrapZone forceFocusInsideTrap={ false } isClickableOutsideFocusTrap={ true } disableFirstFocus={ !firstFocus }>
             { content }
           </FocusTrapZone> :
           content
@@ -115,7 +115,9 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
 
   @autobind
   private _onDismiss(ev: MouseEvent): void {
-    if (ev.type === 'keydown') {
+    if (ev.type === 'keydown' && (ev.which !== KeyCodes.escape)) {
+      return;
+    } else {
       this.props.onLeave && this.props.onLeave(ev);
     }
   }
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.types.ts b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.types.ts
index 6c80350458e7e..70961503288e3 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.types.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.types.ts
@@ -98,6 +98,11 @@ export interface IExpandingCardProps extends React.HTMLAttributes<HTMLDivElement
    * Trap focus or not
    */
   trapFocus?: boolean;
+
+  /**
+   * Focus on first element by default on card or not
+   */
+  firstFocus?: boolean;
 }
 
 export enum ExpandingCardMode {
@@ -112,6 +117,18 @@ export enum ExpandingCardMode {
   expanded = 1
 }
 
+export enum OpenCardMode {
+  /**
+   * Open card by hover
+   */
+  hover = 0,
+
+  /**
+   * Open card by hot key
+   */
+  hotKey = 1
+}
+
 export interface IExpandingCardStyles {
   /**
    * Style for the root element in the default enabled, non-toggled state.
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
index 2624882b644bd..73e1c40e5b316 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
@@ -16,13 +16,14 @@ import {
 
 import { IHoverCardProps, IHoverCardStyles } from './HoverCard.types';
 import { ExpandingCard } from './ExpandingCard';
-import { ExpandingCardMode } from './ExpandingCard.types';
+import { ExpandingCardMode, OpenCardMode } from './ExpandingCard.types';
 import { getStyles } from './HoverCard.styles';
 import { FocusTrapZone } from 'office-ui-fabric-react/lib/FocusTrapZone';
 
 export interface IHoverCardState {
   isHoverCardVisible: boolean;
   mode: ExpandingCardMode;
+  openMode: OpenCardMode;
 }
 
 export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
@@ -49,7 +50,8 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
 
     this.state = {
       isHoverCardVisible: false,
-      mode: ExpandingCardMode.compact
+      mode: ExpandingCardMode.compact,
+      openMode: OpenCardMode.hover
     };
   }
 
@@ -99,7 +101,7 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
       setAriaDescribedBy = true,
       styles: customStyles
     } = this.props;
-    const { isHoverCardVisible, mode } = this.state;
+    const { isHoverCardVisible, mode, openMode } = this.state;
     const hoverCardId = id || getId('hoverCard');
 
     this._styles = getStyles(customStyles);
@@ -117,9 +119,10 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
             { ...getNativeProps(this.props, divProperties) }
             id={ hoverCardId }
             trapFocus={ !!this.props.trapFocus }
+            firstFocus={ openMode === OpenCardMode.hotKey }
             targetElement={ this._getTargetElement() }
             onEnter={ this._cardOpen }
-            onLeave={ this._cardDismiss }
+            onLeave={ this._executeCardDimiss }
             mode={ mode }
             { ...expandingCardProps }
           />
@@ -146,7 +149,7 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
   // Show HoverCard
   @autobind
   private _cardOpen(ev: MouseEvent) {
-    if (ev.type === 'keydown' && !(ev.shiftKey && ev.which === KeyCodes.space)) {
+    if (ev.type === 'keydown' && !(ev.which === KeyCodes.c)) {
       return;
     }
     this._async.clearTimeout(this._dismissTimerId);
@@ -154,11 +157,17 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
       this._currentMouseTarget = ev.currentTarget;
     }
 
+    this._executeCardOpen(ev);
+  }
+
+  @autobind
+  private _executeCardOpen(ev: MouseEvent) {
     this._openTimerId = this._async.setTimeout(() => {
       if (!this.state.isHoverCardVisible) {
         this.setState({
           isHoverCardVisible: true,
-          mode: ExpandingCardMode.compact
+          mode: ExpandingCardMode.compact,
+          openMode: ev.type === 'keydown' ? OpenCardMode.hotKey : OpenCardMode.hover
         });
       }
     }, this.props.cardOpenDelay!);
@@ -174,15 +183,21 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
 
     // Dismiss if not sticky and currentTarget is the same element that mouse last entered
     if (!this.props.sticky && (this._currentMouseTarget === ev.currentTarget || (ev.which === KeyCodes.escape))) {
-      this._dismissTimerId = this._async.setTimeout(() => {
-        this.setState({
-          isHoverCardVisible: false,
-          mode: ExpandingCardMode.compact
-        });
-      }, this.props.cardDismissDelay!);
+      this._executeCardDimiss();
     }
   }
 
+  @autobind
+  private _executeCardDimiss() {
+    this._dismissTimerId = this._async.setTimeout(() => {
+      this.setState({
+        isHoverCardVisible: false,
+        mode: ExpandingCardMode.compact,
+        openMode: OpenCardMode.hover
+      });
+    }, this.props.cardDismissDelay!);
+  }
+
   // Instant Open the card in Expanded mode
   @autobind
   private _instantOpenExpanded(ev: React.MouseEvent<HTMLDivElement>) {
diff --git a/packages/utilities/src/KeyCodes.ts b/packages/utilities/src/KeyCodes.ts
index 486a7e4ddd287..1c84163588a27 100644
--- a/packages/utilities/src/KeyCodes.ts
+++ b/packages/utilities/src/KeyCodes.ts
@@ -5,6 +5,7 @@
  */
 export const enum KeyCodes {
   a = 65,
+  c = 67,
   backspace = 8,
   comma = 188,
   del = 46,

From 413b160f9284b647facd0b39bb24cade87e5b94f Mon Sep 17 00:00:00 2001
From: manueldosal <manuel_dosal32@hotmail.com>
Date: Mon, 11 Dec 2017 17:54:22 -0800
Subject: [PATCH 1134/1641] Combobox: Add onMenuDismiss prop (#3558)

* Adding onDismissMenu prop in Button props

* Adding onMenuClose

* Changing to onMenuDismiss

* Reverting change for button menu dismiss

* Moving the place where we call on menu dismiss

* Adding rush change file

* Update Implement_OnDismissMenu_2017-12-12-00-47.json
---
 .../Implement_OnDismissMenu_2017-12-12-00-47.json     | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.tsx              |  7 ++++++-
 .../src/components/ComboBox/ComboBox.types.ts         |  5 +++++
 3 files changed, 22 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/Implement_OnDismissMenu_2017-12-12-00-47.json

diff --git a/common/changes/office-ui-fabric-react/Implement_OnDismissMenu_2017-12-12-00-47.json b/common/changes/office-ui-fabric-react/Implement_OnDismissMenu_2017-12-12-00-47.json
new file mode 100644
index 0000000000000..48a8ed315fab3
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/Implement_OnDismissMenu_2017-12-12-00-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Add onMenuDismiss prop",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "madosal@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 79a5104a11c10..e41ded37a63fa 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -193,7 +193,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     let {
       allowFreeform,
       value,
-      onMenuOpen
+      onMenuOpen,
+      onMenuDismissed
     } = this.props;
     let {
       isOpen,
@@ -240,6 +241,10 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     if (isOpen && !prevState.isOpen && onMenuOpen) {
       onMenuOpen();
     }
+
+    if (!isOpen && prevState.isOpen && onMenuDismissed) {
+      onMenuDismissed();
+    }
   }
 
   public componentWillUnmount() {
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
index ac84a49e3ab11..b803d5612e05b 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
@@ -52,6 +52,11 @@ export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox>
    */
   onMenuOpen?: () => void;
 
+  /**
+   * Function that gets invoked when the ComboBox menu is dismissed
+   */
+  onMenuDismissed?: () => void;
+
   /**
    * Callback issued when the options should be resolved, if they have been updated or
    * if they need to be passed in the first time

From 6d2ca21378ae9147e38bde2b67d39e17d19f5a01 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 12 Dec 2017 02:08:36 +0000
Subject: [PATCH 1135/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...rCard_EventHandleFix_2017-12-01-00-46.json | 11 -------
 ...lement_OnDismissMenu_2017-12-12-00-47.json | 11 -------
 ...rCard_EventHandleFix_2017-11-30-19-26.json | 11 -------
 ...lantoo-list_ghosting_2017-12-08-23-54.json | 11 -------
 ...rbrow-activity-tests_2017-11-21-17-48.json | 11 -------
 packages/experiments/CHANGELOG.json           | 19 ++++++++++++
 packages/experiments/CHANGELOG.md             |  9 +++++-
 packages/experiments/package.json             |  4 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 31 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 ++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 16 files changed, 80 insertions(+), 65 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/chf-2017-11-hoverCard_EventHandleFix_2017-12-01-00-46.json
 delete mode 100644 common/changes/office-ui-fabric-react/Implement_OnDismissMenu_2017-12-12-00-47.json
 delete mode 100644 common/changes/office-ui-fabric-react/chf-2017-11-hoverCard_EventHandleFix_2017-11-30-19-26.json
 delete mode 100644 common/changes/office-ui-fabric-react/magellantoo-list_ghosting_2017-12-08-23-54.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-activity-tests_2017-11-21-17-48.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index a7eb941657367..bb2fc742a723b 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.30.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.31.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 0262eaa03ed75..080ca231876e8 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.30.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.31.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index f71c282e7cd9c..104e53190a150 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.30.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.31.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 8196f0a07b12c..cc3f2aa41d257 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.30.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.31.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index e63ff2b9f796c..966eaca4be4dc 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -30,7 +30,7 @@
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/styling": ">=5.14.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.30.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.31.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/experiments/chf-2017-11-hoverCard_EventHandleFix_2017-12-01-00-46.json b/common/changes/@uifabric/experiments/chf-2017-11-hoverCard_EventHandleFix_2017-12-01-00-46.json
deleted file mode 100644
index a65de0f6bcfe4..0000000000000
--- a/common/changes/@uifabric/experiments/chf-2017-11-hoverCard_EventHandleFix_2017-12-01-00-46.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "add link ref in tile",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "chf@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/Implement_OnDismissMenu_2017-12-12-00-47.json b/common/changes/office-ui-fabric-react/Implement_OnDismissMenu_2017-12-12-00-47.json
deleted file mode 100644
index 48a8ed315fab3..0000000000000
--- a/common/changes/office-ui-fabric-react/Implement_OnDismissMenu_2017-12-12-00-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Add onMenuDismiss prop",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "madosal@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/chf-2017-11-hoverCard_EventHandleFix_2017-11-30-19-26.json b/common/changes/office-ui-fabric-react/chf-2017-11-hoverCard_EventHandleFix_2017-11-30-19-26.json
deleted file mode 100644
index ca2cc66a7e42c..0000000000000
--- a/common/changes/office-ui-fabric-react/chf-2017-11-hoverCard_EventHandleFix_2017-11-30-19-26.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "remove customized dismiss function in HoverCard",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chf@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/magellantoo-list_ghosting_2017-12-08-23-54.json b/common/changes/office-ui-fabric-react/magellantoo-list_ghosting_2017-12-08-23-54.json
deleted file mode 100644
index 70d28f0b10b3b..0000000000000
--- a/common/changes/office-ui-fabric-react/magellantoo-list_ghosting_2017-12-08-23-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "List: Support ghosting",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-activity-tests_2017-11-21-17-48.json b/common/changes/office-ui-fabric-react/v-krbrow-activity-tests_2017-11-21-17-48.json
deleted file mode 100644
index aff7445a13bd3..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-activity-tests_2017-11-21-17-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ActivityItem: Snapshot and Screener tests added",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index a3adaf2f271a7..4f98bd1767e06 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.9.2",
+      "tag": "@uifabric/experiments_v5.9.2",
+      "date": "Tue, 12 Dec 2017 02:08:36 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Chao <fengchao199011@hotmail.com>",
+            "commit": "253922868e6305b04c194ca8906e333d5abe6ebf",
+            "comment": "add link ref in tile"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.30.2 <6.0.0` to `>=5.31.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.9.1",
       "tag": "@uifabric/experiments_v5.9.1",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index d59383b56ec14..cab1718a236bc 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Fri, 08 Dec 2017 18:09:44 GMT and should not be manually modified.
+This log was last generated on Tue, 12 Dec 2017 02:08:36 GMT and should not be manually modified.
+
+## 5.9.2
+Tue, 12 Dec 2017 02:08:36 GMT
+
+### Patches
+
+- add link ref in tile
 
 ## 5.9.1
 Fri, 08 Dec 2017 18:09:44 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 8ee85e1a5bdbe..70162dd1525f7 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.9.1",
+  "version": "5.9.2",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.30.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.31.0 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 50296ea11fd2a..a9ad499aa6d9f 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,37 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.31.0",
+      "tag": "office-ui-fabric-react_v5.31.0",
+      "date": "Tue, 12 Dec 2017 02:08:36 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Chao <fengchao199011@hotmail.com>",
+            "commit": "253922868e6305b04c194ca8906e333d5abe6ebf",
+            "comment": "remove customized dismiss function in HoverCard"
+          },
+          {
+            "author": "manueldosal <manuel_dosal32@hotmail.com>",
+            "commit": "413b160f9284b647facd0b39bb24cade87e5b94f",
+            "comment": "ComboBox: Add onMenuDismiss prop"
+          },
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "63fcf342aae0b90ba96eab00cbedb00bb9f3829f",
+            "comment": "ActivityItem: Snapshot and Screener tests added"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Lambert W <lambert.ww@gmail.com>",
+            "commit": "1fe2b91ec993ea6a3ca500c62c755303431636ba",
+            "comment": "List: Support ghosting"
+          }
+        ]
+      }
+    },
     {
       "version": "5.30.2",
       "tag": "office-ui-fabric-react_v5.30.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 778b5f8fc67b4..6805fd605d5a4 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 08 Dec 2017 21:30:54 GMT and should not be manually modified.
+This log was last generated on Tue, 12 Dec 2017 02:08:36 GMT and should not be manually modified.
+
+## 5.31.0
+Tue, 12 Dec 2017 02:08:36 GMT
+
+### Minor changes
+
+- List: Support ghosting
+
+### Patches
+
+- remove customized dismiss function in HoverCard
+- ComboBox: Add onMenuDismiss prop
+- ActivityItem: Snapshot and Screener tests added
 
 ## 5.30.2
 Fri, 08 Dec 2017 21:30:54 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 2dafad92cc9b3..b8b58d55b6e22 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.30.2",
+  "version": "5.31.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 05fe90c2295e04ed07c61cefefc5892e89926e71 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Mon, 11 Dec 2017 19:44:20 -0800
Subject: [PATCH 1136/1641] BaseButton: Explicitly dismiss the menu when the
 contextual menu is dismissed rather than calling toggleMenu (#3559)

* Add _dismissMenu call

* Rush change
---
 .../chrisgo-dismiss-combo-box_2017-12-12-03-26.json   | 11 +++++++++++
 .../src/components/Button/BaseButton.tsx              |  7 ++++++-
 2 files changed, 17 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/chrisgo-dismiss-combo-box_2017-12-12-03-26.json

diff --git a/common/changes/office-ui-fabric-react/chrisgo-dismiss-combo-box_2017-12-12-03-26.json b/common/changes/office-ui-fabric-react/chrisgo-dismiss-combo-box_2017-12-12-03-26.json
new file mode 100644
index 0000000000000..31af5ed950ad9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/chrisgo-dismiss-combo-box_2017-12-12-03-26.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "BaseButton: Explicitly dismiss the menu when the contextual menu is dismissed rather than calling toggleMEnu",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 2a9efd35a589a..58122b092d02b 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -376,7 +376,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
 
   @autobind
   private _onRenderMenu(menuProps: IContextualMenuProps): JSX.Element {
-    const { onDismiss = this._onToggleMenu } = menuProps;
+    const { onDismiss = this._dismissMenu } = menuProps;
 
     return (
       <ContextualMenu
@@ -391,6 +391,11 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     );
   }
 
+  @autobind
+  private _dismissMenu(): void {
+    this.setState({ menuProps: null });
+  }
+
   @autobind
   private _onToggleMenu(): void {
     const { menuProps } = this.props;

From c561e4c8a2c7d9a5f789b7492724936a0384905c Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 12 Dec 2017 03:55:03 +0000
Subject: [PATCH 1137/1641] Applying package updates.

---
 apps/fabric-website/package.json                   |  2 +-
 apps/ssr-tests/package.json                        |  2 +-
 apps/test-bundle-button/package.json               |  2 +-
 apps/todo-app/package.json                         |  2 +-
 apps/vr-tests/package.json                         |  2 +-
 ...chrisgo-dismiss-combo-box_2017-12-12-03-26.json | 11 -----------
 packages/experiments/package.json                  |  2 +-
 packages/office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md       |  9 ++++++++-
 packages/office-ui-fabric-react/package.json       |  2 +-
 10 files changed, 29 insertions(+), 19 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/chrisgo-dismiss-combo-box_2017-12-12-03-26.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index bb2fc742a723b..ba4e017fd66a0 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.31.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.31.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 080ca231876e8..a028badd5c4c7 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.31.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.31.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 104e53190a150..a8df5de980627 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.31.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.31.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index cc3f2aa41d257..da19cfcd3ee74 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.31.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.31.1 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 966eaca4be4dc..839becc359a35 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -30,7 +30,7 @@
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/styling": ">=5.14.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.31.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.31.1 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/chrisgo-dismiss-combo-box_2017-12-12-03-26.json b/common/changes/office-ui-fabric-react/chrisgo-dismiss-combo-box_2017-12-12-03-26.json
deleted file mode 100644
index 31af5ed950ad9..0000000000000
--- a/common/changes/office-ui-fabric-react/chrisgo-dismiss-combo-box_2017-12-12-03-26.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "BaseButton: Explicitly dismiss the menu when the contextual menu is dismissed rather than calling toggleMEnu",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 70162dd1525f7..193fd8cf12a66 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.31.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.31.1 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index a9ad499aa6d9f..c217f4215329c 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.31.1",
+      "tag": "office-ui-fabric-react_v5.31.1",
+      "date": "Tue, 12 Dec 2017 03:55:03 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "05fe90c2295e04ed07c61cefefc5892e89926e71",
+            "comment": "BaseButton: Explicitly dismiss the menu when the contextual menu is dismissed rather than calling toggleMEnu"
+          }
+        ]
+      }
+    },
     {
       "version": "5.31.0",
       "tag": "office-ui-fabric-react_v5.31.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 6805fd605d5a4..1a7f5540134cc 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 12 Dec 2017 02:08:36 GMT and should not be manually modified.
+This log was last generated on Tue, 12 Dec 2017 03:55:03 GMT and should not be manually modified.
+
+## 5.31.1
+Tue, 12 Dec 2017 03:55:03 GMT
+
+### Patches
+
+- BaseButton: Explicitly dismiss the menu when the contextual menu is dismissed rather than calling toggleMEnu
 
 ## 5.31.0
 Tue, 12 Dec 2017 02:08:36 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index b8b58d55b6e22..0e3ec5d35a02d 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.31.0",
+  "version": "5.31.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 21cefb73e8d682196777fd38579c307fe67beff0 Mon Sep 17 00:00:00 2001
From: stephenzsy <stephen.zsy@gmail.com>
Date: Tue, 12 Dec 2017 00:29:13 -0800
Subject: [PATCH 1138/1641] Fix DetailsList.onRenderMissingItem doesn't render
 missing item (#3555)

* Fix DetailsList.onRenderMissingItem doesn't render

* Add change file
---
 .../stzh-detailslist_2017-12-11-21-06.json            | 11 +++++++++++
 .../src/components/DetailsList/DetailsList.tsx        |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/stzh-detailslist_2017-12-11-21-06.json

diff --git a/common/changes/office-ui-fabric-react/stzh-detailslist_2017-12-11-21-06.json b/common/changes/office-ui-fabric-react/stzh-detailslist_2017-12-11-21-06.json
new file mode 100644
index 0000000000000..f263fbbaf1ca5
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/stzh-detailslist_2017-12-11-21-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix DetailsList onRenderMissingItem not rendering the missing item",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "stzh@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 4c49e2f234f51..cf1e372a0c5ba 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -433,7 +433,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
 
     if (!item) {
       if (onRenderMissingItem) {
-        onRenderMissingItem(index);
+        return onRenderMissingItem(index);
       }
 
       return null;

From d7f9a224e600bd9d5a92b412c462fa74a48199e3 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 12 Dec 2017 11:25:08 +0000
Subject: [PATCH 1139/1641] Applying package updates.

---
 apps/fabric-website/package.json                   |  2 +-
 apps/ssr-tests/package.json                        |  2 +-
 apps/test-bundle-button/package.json               |  2 +-
 apps/todo-app/package.json                         |  2 +-
 apps/vr-tests/package.json                         |  2 +-
 .../stzh-detailslist_2017-12-11-21-06.json         | 11 -----------
 packages/experiments/package.json                  |  2 +-
 packages/office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md       |  9 ++++++++-
 packages/office-ui-fabric-react/package.json       |  2 +-
 10 files changed, 29 insertions(+), 19 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/stzh-detailslist_2017-12-11-21-06.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index ba4e017fd66a0..4fc8a9be12d38 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.31.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.31.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index a028badd5c4c7..8f0a360b617ef 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.31.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.31.2 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index a8df5de980627..632c258013a94 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.31.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.31.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index da19cfcd3ee74..2924afa75dbee 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.31.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.31.2 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 839becc359a35..bc603a10c1b9c 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -30,7 +30,7 @@
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/styling": ">=5.14.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.31.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.31.2 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/stzh-detailslist_2017-12-11-21-06.json b/common/changes/office-ui-fabric-react/stzh-detailslist_2017-12-11-21-06.json
deleted file mode 100644
index f263fbbaf1ca5..0000000000000
--- a/common/changes/office-ui-fabric-react/stzh-detailslist_2017-12-11-21-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix DetailsList onRenderMissingItem not rendering the missing item",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "stzh@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 193fd8cf12a66..df7e56f6cec8f 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.31.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.31.2 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index c217f4215329c..c533570754705 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.31.2",
+      "tag": "office-ui-fabric-react_v5.31.2",
+      "date": "Tue, 12 Dec 2017 11:25:08 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "stephenzsy <stephen.zsy@gmail.com>",
+            "commit": "21cefb73e8d682196777fd38579c307fe67beff0",
+            "comment": "Fix DetailsList onRenderMissingItem not rendering the missing item"
+          }
+        ]
+      }
+    },
     {
       "version": "5.31.1",
       "tag": "office-ui-fabric-react_v5.31.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 1a7f5540134cc..67e84ec2ca57c 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 12 Dec 2017 03:55:03 GMT and should not be manually modified.
+This log was last generated on Tue, 12 Dec 2017 11:25:08 GMT and should not be manually modified.
+
+## 5.31.2
+Tue, 12 Dec 2017 11:25:08 GMT
+
+### Patches
+
+- Fix DetailsList onRenderMissingItem not rendering the missing item
 
 ## 5.31.1
 Tue, 12 Dec 2017 03:55:03 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 0e3ec5d35a02d..3656b9b0f6c9b 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.31.1",
+  "version": "5.31.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 8146c713b40cfbba03fd1f9e4197ef1502a0bc21 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 12 Dec 2017 11:02:42 -0800
Subject: [PATCH 1140/1641] Link: Fixed state bugs (#3471)

* Added isEnabled class for button also

* Added aria-disabled

* Link state bug fixes

* Added change file

* Updated snapshot

* New stories / tests for link

* New story for disbled Link with no href

* Disabled no href story
---
 apps/vr-tests/src/stories/Link.stories.tsx    |  3 +-
 .../link-states_2017-11-28-17-47.json         | 11 ++++++
 .../src/components/Link/Link.scss             | 30 +++++++++++-----
 .../src/components/Link/Link.test.tsx         | 15 ++++++++
 .../src/components/Link/Link.tsx              |  5 ++-
 .../Link/__snapshots__/Link.test.tsx.snap     | 34 +++++++++++++++++++
 .../Link/examples/Link.Basic.Example.tsx      |  6 ++--
 .../Link/examples/Link.Example.scss           | 23 +++++++++++++
 8 files changed, 113 insertions(+), 14 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/link-states_2017-11-28-17-47.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Link/examples/Link.Example.scss

diff --git a/apps/vr-tests/src/stories/Link.stories.tsx b/apps/vr-tests/src/stories/Link.stories.tsx
index eb927d3046a6a..0637cc757c5ff 100644
--- a/apps/vr-tests/src/stories/Link.stories.tsx
+++ b/apps/vr-tests/src/stories/Link.stories.tsx
@@ -24,4 +24,5 @@ storiesOf('Link', module)
   ))
   .add('Root', () => (<Link href='#'>I'm a link</Link>))
   .add('Disabled', () => (<Link href='#' disabled>I'm a disabled link</Link>))
-  .add('No Href', () => (<Link>I'm rendered as a button because I have no href</Link>));
\ No newline at end of file
+  .add('No Href', () => (<Link>I'm rendered as a button because I have no href</Link>))
+  .add('No Href Disabled', () => (<Link disabled>I'm rendered as a button because I have no href and am disabled</Link>));
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/link-states_2017-11-28-17-47.json b/common/changes/office-ui-fabric-react/link-states_2017-11-28-17-47.json
new file mode 100644
index 0000000000000..bd088959b9206
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/link-states_2017-11-28-17-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Link: Fixed state styling for the component and its documented examples.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.scss b/packages/office-ui-fabric-react/src/components/Link/Link.scss
index 48c950f938686..b5e3fbb81b205 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.scss
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.scss
@@ -1,7 +1,7 @@
 @import '../../common/common';
 
-// Element: ms-Link root component
-.root {
+// Mixins: to be shared with Link.Example.scss
+@mixin root {
   color: $ms-color-themePrimary;
   margin: 0;
   overflow: inherit;
@@ -9,25 +9,37 @@
   text-overflow: inherit;
 }
 
-// State: The button is not disabled.
-.isEnabled {
-  &:hover,
-  &:focus {
+@mixin isEnabled {
+  &:active,
+  &:hover {
     color: $ms-color-themeDarker;
   }
 
-  &:active {
+  &:focus {
     color: $ms-color-themePrimary;
   }
 }
 
-// State: The button is disabled.
-.isDisabled {
+@mixin isDisabled {
   color: $ms-color-neutralTertiary;
   pointer-events: none;
   cursor: default;
 }
 
+// Element: ms-Link root component
+.root {
+  @include root;
+}
+
+// State: The button is not disabled.
+.isEnabled {
+  @include isEnabled;
+}
+
+// State: The button is disabled.
+.isDisabled {
+  @include isDisabled;
+}
 
 // Link implemented as a button.
 button.root {
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.test.tsx b/packages/office-ui-fabric-react/src/components/Link/Link.test.tsx
index b04c4980938ff..21c38f5ff3e17 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.test.tsx
@@ -9,4 +9,19 @@ describe('Link', () => {
     let tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
+  it('renders disabled Link correctly', () => {
+    const component = renderer.create(<Link href='#' disabled={ true }>I'm a disabled link</Link>);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+  it('renders Link with no href as a button', () => {
+    const component = renderer.create(<Link>I'm a link as a button</Link>);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+  it('renders disabled Link with no href as a button correctly', () => {
+    const component = renderer.create(<Link disabled={ true }>I'm a link as a button</Link>);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.tsx b/packages/office-ui-fabric-react/src/components/Link/Link.tsx
index 75fbb2d19dccd..7e1a2b3028173 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.tsx
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.tsx
@@ -31,6 +31,7 @@ export class Link extends BaseComponent<ILinkProps, any> implements ILink {
           onClick={ this._onClick }
           ref={ this._resolveRef('_link') }
           target={ this.props.target }
+          aria-disabled={ disabled }
         >
           { children }
         </a>
@@ -41,10 +42,12 @@ export class Link extends BaseComponent<ILinkProps, any> implements ILink {
               'ms-Link',
               styles.root,
               className,
-              disabled && ('is-disabled ' + styles.isDisabled)
+              disabled && ('is-disabled ' + styles.isDisabled),
+              !disabled && styles.isEnabled
             ) }
             onClick={ this._onClick }
             ref={ this._resolveRef('_link') }
+            aria-disabled={ disabled }
           >
             { children }
           </button>
diff --git a/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap
index 45c9d5b0ed617..5b5ab34cac8de 100644
--- a/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap
@@ -2,6 +2,7 @@
 
 exports[`Link renders Link correctly 1`] = `
 <a
+  aria-disabled={undefined}
   className="ms-Link"
   href="#"
   onClick={[Function]}
@@ -10,3 +11,36 @@ exports[`Link renders Link correctly 1`] = `
   I'm a link
 </a>
 `;
+
+exports[`Link renders Link with no href as a button 1`] = `
+<button
+  aria-disabled={undefined}
+  className="ms-Link"
+  onClick={[Function]}
+>
+  I'm a link as a button
+</button>
+`;
+
+exports[`Link renders disabled Link correctly 1`] = `
+<a
+  aria-disabled={true}
+  className="ms-Link is-disabled undefined"
+  href="#"
+  onClick={[Function]}
+  target={undefined}
+>
+  I'm a disabled link
+</a>
+`;
+
+exports[`Link renders disabled Link with no href as a button correctly 1`] = `
+<button
+  aria-disabled={true}
+  className="ms-Link is-disabled undefined"
+  disabled={true}
+  onClick={[Function]}
+>
+  I'm a link as a button
+</button>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/Link/examples/Link.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Link/examples/Link.Basic.Example.tsx
index eb42503fcd2eb..50df2c37b25ed 100644
--- a/packages/office-ui-fabric-react/src/components/Link/examples/Link.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Link/examples/Link.Basic.Example.tsx
@@ -1,10 +1,11 @@
 import * as React from 'react';
 import { Link } from 'office-ui-fabric-react/lib/Link';
+import './Link.Example.scss';
 
 export class LinkBasicExample extends React.Component<any, any> {
   public render() {
     return (
-      <div>
+      <div className='docs-LinkExample'>
         <span>When a link has an href, </span>
         <Link href='http://dev.office.com/fabric/components/link'>it renders as an anchor tag.</Link>
         <span> Without an href, </span>
@@ -14,5 +15,4 @@ export class LinkBasicExample extends React.Component<any, any> {
       </div>
     );
   }
-
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Link/examples/Link.Example.scss b/packages/office-ui-fabric-react/src/components/Link/examples/Link.Example.scss
new file mode 100644
index 0000000000000..52caecbff6f5a
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Link/examples/Link.Example.scss
@@ -0,0 +1,23 @@
+@import '../Link.scss';
+
+// UHF overrides link color and state so we need to re-assign them for the website documentation
+:global {
+  .docs-LinkExample {
+    .ms-Link {
+      // Element: ms-Link root component
+      .root {
+        @include root;
+      }
+
+      // State: The button is not disabled.
+      .isEnabled {
+        @include isEnabled;
+      }
+
+      // State: The button is disabled.
+      .isDisabled {
+        @include isDisabled;
+      }
+    }
+  }
+}
\ No newline at end of file

From 52ffc478baaa3bf900f686ff6a67ba9965f1e523 Mon Sep 17 00:00:00 2001
From: Lambert W <lambert.ww@gmail.com>
Date: Tue, 12 Dec 2017 15:31:31 -0800
Subject: [PATCH 1141/1641] Magellantoo/dropdown focus fix (#3563)

* Use setActive element for dropdown host

* Change file

* Fix contextualMenu too
---
 ...gellantoo-dropdown_focus_fix_2017-12-12-22-09.json | 11 +++++++++++
 .../src/components/ContextualMenu/ContextualMenu.tsx  | 11 ++++++++++-
 .../src/components/Dropdown/Dropdown.tsx              | 11 ++++++++++-
 3 files changed, 31 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/magellantoo-dropdown_focus_fix_2017-12-12-22-09.json

diff --git a/common/changes/office-ui-fabric-react/magellantoo-dropdown_focus_fix_2017-12-12-22-09.json b/common/changes/office-ui-fabric-react/magellantoo-dropdown_focus_fix_2017-12-12-22-09.json
new file mode 100644
index 0000000000000..3796619f1938a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/magellantoo-dropdown_focus_fix_2017-12-12-22-09.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix dropdown focus issue for IE",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 1448f365dceec..b8efa962902bf 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -764,7 +764,16 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       return;
     }
 
-    this._host.focus();
+    /**
+     * IE11 focus() method forces parents to scroll to top of element.
+     * Edge and IE expose a setActive() function for focusable divs that
+     * sets the page focus but does not scroll the parent element.
+     */
+    if ((this._host as any).setActive) {
+      (this._host as any).setActive();
+    } else {
+      this._host.focus();
+    }
   }
 
   private _onItemMouseDown(item: IContextualMenuItem, ev: React.MouseEvent<HTMLElement>) {
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 6d0693dd9cce1..9bb64d412f02a 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -601,7 +601,16 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
       return;
     }
 
-    this._host.focus();
+    /**
+     * IE11 focus() method forces parents to scroll to top of element.
+     * Edge and IE expose a setActive() function for focusable divs that
+     * sets the page focus but does not scroll the parent element.
+     */
+    if ((this._host as any).setActive) {
+      (this._host as any).setActive();
+    } else {
+      this._host.focus();
+    }
   }
 
   @autobind

From 41a53ed37771c27f3a47a333f06282d98f169cf6 Mon Sep 17 00:00:00 2001
From: Christopher Schleiden <cschleiden@live.de>
Date: Tue, 12 Dec 2017 17:26:26 -0800
Subject: [PATCH 1142/1641] VirtualizedList experiment (#3064)

* VirtualizedList experiment

* Fix scroll debounce

* Migrating VirtualLIst and StaticList to experiments along with new utilities.

* Removing unused variables in VirtualizedList

* Fix tslint issues

* Fix issues

* Rename props to types, update docs
---
 packages/experiments/src/StaticList.ts        |   1 +
 packages/experiments/src/VirtualizedList.ts   |   1 +
 .../src/components/StaticList/List.types.ts   |  15 ++
 .../src/components/StaticList/StaticList.scss |   5 +
 .../src/components/StaticList/StaticList.tsx  |  23 ++
 .../components/StaticList/StaticList.types.ts |   7 +
 .../components/StaticList/StaticListPage.tsx  |  46 ++++
 .../src/components/StaticList/index.ts        |   3 +
 .../VirtualizedList/VirtualizedList.scss      |  10 +
 .../VirtualizedList/VirtualizedList.tsx       | 227 ++++++++++++++++++
 .../VirtualizedList/VirtualizedList.types.ts  |  17 ++
 .../VirtualizedList/VirtualizedListPage.tsx   |  59 +++++
 .../VirtualizedList.Basic.Example.tsx         |  56 +++++
 .../VirtualizedList.Basic.Example2.tsx        |  65 +++++
 .../examples/VirtualizedList.Example.scss     |   3 +
 .../src/components/VirtualizedList/index.ts   |   2 +
 .../experiments/src/demo/AppDefinition.tsx    |  12 +
 .../utilities/scrolling/ScrollContainer.scss  |   3 +
 .../utilities/scrolling/ScrollContainer.tsx   | 152 ++++++++++++
 .../scrolling/ScrollContainer.types.ts        |  14 ++
 .../src/utilities/scrolling/index.ts          |   2 +
 packages/office-ui-fabric-react/package.json  |   2 +-
 22 files changed, 724 insertions(+), 1 deletion(-)
 create mode 100644 packages/experiments/src/StaticList.ts
 create mode 100644 packages/experiments/src/VirtualizedList.ts
 create mode 100644 packages/experiments/src/components/StaticList/List.types.ts
 create mode 100644 packages/experiments/src/components/StaticList/StaticList.scss
 create mode 100644 packages/experiments/src/components/StaticList/StaticList.tsx
 create mode 100644 packages/experiments/src/components/StaticList/StaticList.types.ts
 create mode 100644 packages/experiments/src/components/StaticList/StaticListPage.tsx
 create mode 100644 packages/experiments/src/components/StaticList/index.ts
 create mode 100644 packages/experiments/src/components/VirtualizedList/VirtualizedList.scss
 create mode 100644 packages/experiments/src/components/VirtualizedList/VirtualizedList.tsx
 create mode 100644 packages/experiments/src/components/VirtualizedList/VirtualizedList.types.ts
 create mode 100644 packages/experiments/src/components/VirtualizedList/VirtualizedListPage.tsx
 create mode 100644 packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example.tsx
 create mode 100644 packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example2.tsx
 create mode 100644 packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Example.scss
 create mode 100644 packages/experiments/src/components/VirtualizedList/index.ts
 create mode 100644 packages/experiments/src/utilities/scrolling/ScrollContainer.scss
 create mode 100644 packages/experiments/src/utilities/scrolling/ScrollContainer.tsx
 create mode 100644 packages/experiments/src/utilities/scrolling/ScrollContainer.types.ts
 create mode 100644 packages/experiments/src/utilities/scrolling/index.ts

diff --git a/packages/experiments/src/StaticList.ts b/packages/experiments/src/StaticList.ts
new file mode 100644
index 0000000000000..a07964bc6d69f
--- /dev/null
+++ b/packages/experiments/src/StaticList.ts
@@ -0,0 +1 @@
+export * from './components/StaticList/index';
diff --git a/packages/experiments/src/VirtualizedList.ts b/packages/experiments/src/VirtualizedList.ts
new file mode 100644
index 0000000000000..8e613e5edb2c4
--- /dev/null
+++ b/packages/experiments/src/VirtualizedList.ts
@@ -0,0 +1 @@
+export * from './components/VirtualizedList/index';
\ No newline at end of file
diff --git a/packages/experiments/src/components/StaticList/List.types.ts b/packages/experiments/src/components/StaticList/List.types.ts
new file mode 100644
index 0000000000000..810d8e8e385e1
--- /dev/null
+++ b/packages/experiments/src/components/StaticList/List.types.ts
@@ -0,0 +1,15 @@
+import { IObjectWithKey } from 'office-ui-fabric-react/lib/Selection';
+
+export interface IGenericListProps<TItem extends IObjectWithKey> {
+  /** Optional custom class name */
+  className?: string;
+
+  /** List of items to render */
+  items: TItem[];
+
+  /** Height of one item in the list */
+  itemHeight: number;
+
+  /** Callback to render one item in the list */
+  onRenderItem: (item: TItem, index: number) => JSX.Element | null;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/StaticList/StaticList.scss b/packages/experiments/src/components/StaticList/StaticList.scss
new file mode 100644
index 0000000000000..e44ae61ee5eea
--- /dev/null
+++ b/packages/experiments/src/components/StaticList/StaticList.scss
@@ -0,0 +1,5 @@
+.root {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/StaticList/StaticList.tsx b/packages/experiments/src/components/StaticList/StaticList.tsx
new file mode 100644
index 0000000000000..3c6ca4f5938e9
--- /dev/null
+++ b/packages/experiments/src/components/StaticList/StaticList.tsx
@@ -0,0 +1,23 @@
+import * as React from 'react';
+import { css } from '../../Utilities';
+import { IObjectWithKey } from 'office-ui-fabric-react/lib/Selection';
+import { IStaticListProps } from './StaticList.types';
+
+import * as stylesImport from './StaticList.scss';
+
+export class StaticList<TItem extends IObjectWithKey> extends React.PureComponent<IStaticListProps<TItem>> {
+  public render(): JSX.Element {
+    const {
+      className,
+      items,
+      onRenderItem,
+      listTagName: ListTag = 'ul'
+     } = this.props;
+
+    return (
+      <ListTag className={ css(stylesImport.root, className) }>
+        { items.map((item: TItem, index: number) => onRenderItem(item, index)) }
+      </ListTag>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/StaticList/StaticList.types.ts b/packages/experiments/src/components/StaticList/StaticList.types.ts
new file mode 100644
index 0000000000000..03f5634df4940
--- /dev/null
+++ b/packages/experiments/src/components/StaticList/StaticList.types.ts
@@ -0,0 +1,7 @@
+import { IObjectWithKey } from 'office-ui-fabric-react/lib/Selection';
+import { IGenericListProps } from './List.types';
+
+export interface IStaticListProps<TItem extends IObjectWithKey> extends IGenericListProps<TItem> {
+  /** Html tag to use for rendering the list, defaults to 'ul' */
+  listTagName?: string;
+}
diff --git a/packages/experiments/src/components/StaticList/StaticListPage.tsx b/packages/experiments/src/components/StaticList/StaticListPage.tsx
new file mode 100644
index 0000000000000..8759342a4063a
--- /dev/null
+++ b/packages/experiments/src/components/StaticList/StaticListPage.tsx
@@ -0,0 +1,46 @@
+import * as React from 'react';
+import {
+  IComponentDemoPageProps,
+  ComponentPage,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+
+export class StaticListPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render(): JSX.Element {
+    return (
+      <ComponentPage
+        title='StaticList'
+        componentName='StaticList'
+        exampleCards={
+          <div />
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!experiments/src/components/StaticList/StaticList.types.ts')
+            ] }
+          />
+        }
+        overview={
+          <div />
+        }
+        bestPractices={
+          <div />
+        }
+        dos={
+          <div>
+            <ul>
+              <li>Use to render a list of items.</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul />
+          </div>
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }
+      />
+    );
+  }
+}
diff --git a/packages/experiments/src/components/StaticList/index.ts b/packages/experiments/src/components/StaticList/index.ts
new file mode 100644
index 0000000000000..a130fdecc0ba4
--- /dev/null
+++ b/packages/experiments/src/components/StaticList/index.ts
@@ -0,0 +1,3 @@
+export * from './List.types';
+export * from './StaticList.types';
+export * from './StaticList';
\ No newline at end of file
diff --git a/packages/experiments/src/components/VirtualizedList/VirtualizedList.scss b/packages/experiments/src/components/VirtualizedList/VirtualizedList.scss
new file mode 100644
index 0000000000000..756ee884fe0d1
--- /dev/null
+++ b/packages/experiments/src/components/VirtualizedList/VirtualizedList.scss
@@ -0,0 +1,10 @@
+.root {
+}
+
+.rootOverflow {
+  overflow: auto;
+}
+
+.item {
+  height: 30px;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/VirtualizedList/VirtualizedList.tsx b/packages/experiments/src/components/VirtualizedList/VirtualizedList.tsx
new file mode 100644
index 0000000000000..79184324579f9
--- /dev/null
+++ b/packages/experiments/src/components/VirtualizedList/VirtualizedList.tsx
@@ -0,0 +1,227 @@
+import * as React from 'react';
+import { IVirtualizedListProps } from './VirtualizedList.types';
+import { IScrollContainerContext, ScrollContainerContextTypes } from '../../utilities/scrolling/ScrollContainer';
+import { IObjectWithKey } from 'office-ui-fabric-react/lib/Selection';
+import { BaseComponent, getParent, css, autobind } from 'office-ui-fabric-react/lib/Utilities';
+
+interface IRange {
+  /** Start of range */
+  start: number;
+
+  /** Exclusive end of range */
+  end: number;
+}
+
+function isInRange(range: IRange, index: number): boolean {
+  return range.start <= index && index < range.end;
+}
+
+export interface IVirtualizedListState {
+  viewportHeight: number;
+
+  items: React.ReactNode[];
+}
+
+export class VirtualizedList<TItem extends IObjectWithKey> extends BaseComponent<IVirtualizedListProps<TItem>, IVirtualizedListState> {
+  public static contextTypes: typeof ScrollContainerContextTypes = ScrollContainerContextTypes;
+  public context: IScrollContainerContext;
+
+  private _root: HTMLElement;
+
+  private _spacerElements: { [key: string]: HTMLElement } = {};
+
+  private _focusedIndex: number;
+
+  constructor(props: IVirtualizedListProps<TItem>, context: IScrollContainerContext) {
+    super(props, context);
+
+    this._focusedIndex = -1;
+
+    const {
+      initialViewportHeight = window.innerHeight  // Start with the window height if not passed in props, this does not cause layout
+    } = this.props;
+
+    this.state = {
+      viewportHeight: initialViewportHeight,
+      items: this._renderItems(0, initialViewportHeight)
+    };
+  }
+
+  public componentDidMount(): void {
+    this._events.on(this._root, 'focus', this._onFocus, true);
+
+    this.context.scrollContainer.registerVisibleCallback((scrollTop: number) => {
+      this._render(scrollTop);
+    });
+
+    this.componentDidUpdate();
+  }
+
+  public componentDidUpdate(): void {
+    // (Re-)register with the observer after every update, this way we'll get an intersection event immediately if one of the spacer
+    // elements is visible right now.
+    for (const key of Object.keys(this._spacerElements)) {
+      const ref = this._spacerElements[key];
+      this.context.scrollContainer.observe(ref);
+    }
+  }
+
+  public componentWillUpdate(): void {
+    for (const key of Object.keys(this._spacerElements)) {
+      const ref = this._spacerElements[key];
+      this.context.scrollContainer.unobserve(ref);
+    }
+  }
+
+  public render(): JSX.Element {
+    const { className } = this.props;
+    const { items } = this.state;
+
+    return (
+      <div
+        className={ css('ms-VirtualizedList', className) }
+        ref={ this._resolveRef('_root') }
+      >
+        { items }
+      </div>
+    );
+  }
+
+  private _renderItems(scrollTop: number, viewportHeight: number): (JSX.Element | null)[] {
+    const {
+      itemHeight,
+      items,
+      itemOverdraw = 2
+    } = this.props;
+
+    let ranges: IRange[] = [];
+
+    // Calculate visible range
+    const startIndex = Math.floor(
+      Math.max(
+        scrollTop / itemHeight - itemOverdraw,
+        0)
+    );
+    const endIndex = Math.floor(
+      Math.min(
+        startIndex + (itemOverdraw * 2) + (viewportHeight / itemHeight),
+        items.length)
+    );
+
+    const visibleRange = {
+      start: startIndex,
+      end: endIndex
+    };
+
+    ranges.push(visibleRange);
+
+    // Focused item
+    if (this._focusedIndex !== -1 && !isInRange(visibleRange, this._focusedIndex)) {
+      const focusRange: IRange = {
+        start: this._focusedIndex,
+        end: this._focusedIndex + 1
+      };
+
+      if (this._focusedIndex < visibleRange.start) {
+        ranges.unshift(focusRange);
+      } else {
+        ranges.push(focusRange);
+      }
+    }
+
+    return this._renderRanges(ranges);
+  }
+
+  private _renderRanges(ranges: IRange[]): (JSX.Element | null)[] {
+    const { items, onRenderItem } = this.props;
+    const result: (JSX.Element | null)[] = [];
+
+    // Assume ranges are sorted.
+
+    let lastRenderedIndex = -1;
+
+    for (const range of ranges) {
+      // Spacer item before range or between the last range and this one
+      const isFirstRange = lastRenderedIndex === -1;
+      if ((isFirstRange && range.start !== 0)
+        || (!isFirstRange && lastRenderedIndex !== range.start)) {
+        // Last range is not continuous with this one,
+        // or the first range does not start from the beginning: insert spacer item
+        const spacerStartIndex = (isFirstRange ? 0 : lastRenderedIndex);
+        const gapBetweenRanges = range.start - spacerStartIndex;
+        if (gapBetweenRanges > 0) {
+          result.push(this._renderSpacerItem(gapBetweenRanges, spacerStartIndex));
+        }
+      }
+
+      for (let i = range.start; i < range.end; ++i) {
+        result.push(onRenderItem(items[i], i));
+      }
+
+      lastRenderedIndex = range.end - 1;
+    }
+
+    // Insert final spacer item
+    const itemCount = (items || []).length;
+    if (lastRenderedIndex < itemCount - 1) {
+      result.push(this._renderSpacerItem(itemCount - lastRenderedIndex, lastRenderedIndex));
+    }
+
+    return result;
+  }
+
+  private _renderSpacerItem(numberOfItems: number, index: number): JSX.Element {
+    const {
+      itemHeight,
+      items = [],
+      spacerItemTagName: ItemTag = 'div'
+    } = this.props;
+
+    const spacerHeight = numberOfItems * itemHeight;
+    const itemCount = items.length;
+
+    let key: string;
+    if (index === 0) {
+      key = `spacer-start`;
+    } else if (index + numberOfItems === itemCount) {
+      key = `spacer-end`;
+    } else {
+      key = `spacer-item-${index + numberOfItems}`;
+    }
+
+    // tslint:disable-next-line:jsx-ban-props
+    return <ItemTag ref={ this._spacerRef.bind(this, key) } key={ key } style={ { height: spacerHeight } } />;
+  }
+
+  @autobind
+  private _spacerRef(key: string, ref: HTMLElement): void {
+    if (ref) {
+      this._spacerElements[key] = ref;
+    } else {
+      delete this._spacerElements[key];
+    }
+  }
+
+  private _render(scrollTop: number): void {
+    scrollTop = Math.floor(scrollTop);
+
+    this.setState({
+      items: this._renderItems(scrollTop, this.state.viewportHeight)
+    });
+  }
+
+  private _onFocus(ev: React.FocusEvent<HTMLDivElement>): void {
+    let target = ev.target as HTMLElement;
+
+    while (target !== this._root) {
+      let indexString = target.getAttribute('data-selection-index');
+
+      if (indexString) {
+        this._focusedIndex = Number(indexString);
+        break;
+      }
+
+      target = getParent(target) as HTMLElement;
+    }
+  }
+}
diff --git a/packages/experiments/src/components/VirtualizedList/VirtualizedList.types.ts b/packages/experiments/src/components/VirtualizedList/VirtualizedList.types.ts
new file mode 100644
index 0000000000000..80b0743c4987c
--- /dev/null
+++ b/packages/experiments/src/components/VirtualizedList/VirtualizedList.types.ts
@@ -0,0 +1,17 @@
+import { IBaseProps } from '../../Utilities';
+import { IGenericListProps } from '../StaticList/List.types';
+import { IObjectWithKey } from 'office-ui-fabric-react/lib/Selection';
+
+export interface IVirtualizedListProps<TItem extends IObjectWithKey> extends IGenericListProps<TItem>, IBaseProps {
+  /** Initial height of the viewport in pixels */
+  initialViewportHeight?: number;
+
+  /** Height of individual item in pixels */
+  itemHeight: number;
+
+  /** Number of items to draw before/after viewport height */
+  itemOverdraw?: number;
+
+  /** Html tag to use for spacer elements in the list, defaults to 'div' */
+  spacerItemTagName?: string;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/VirtualizedList/VirtualizedListPage.tsx b/packages/experiments/src/components/VirtualizedList/VirtualizedListPage.tsx
new file mode 100644
index 0000000000000..15668d30bae77
--- /dev/null
+++ b/packages/experiments/src/components/VirtualizedList/VirtualizedListPage.tsx
@@ -0,0 +1,59 @@
+import * as React from 'react';
+import {
+  ExampleCard,
+  ComponentPage,
+  IComponentDemoPageProps,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+import { VirtualizedListBasicExample } from './examples/VirtualizedList.Basic.Example';
+import { VirtualizedListBasicExample2 } from './examples/VirtualizedList.Basic.Example2';
+
+const VirtualizedListBasicExampleCode =
+  require('!raw-loader!experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example.tsx') as string;
+const VirtualizedListBasicExample2Code =
+  require('!raw-loader!experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example2.tsx') as string;
+
+export class VirtualizedListPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render(): JSX.Element {
+    return (
+      <ComponentPage
+        title='VirtualizedList'
+        componentName='VirtualizedListExample'
+        exampleCards={
+          <div>
+            <ExampleCard title='VirtualizedList' code={ VirtualizedListBasicExampleCode }>
+              <VirtualizedListBasicExample />
+            </ExampleCard>
+
+            <ExampleCard title='VirtualizedList 2' code={ VirtualizedListBasicExample2Code }>
+              <VirtualizedListBasicExample2 />
+            </ExampleCard>
+          </div>
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!experiments/src/components/VirtualizedList/VirtualizedList.types.ts')
+            ] }
+          />
+        }
+        overview={
+          <div />
+        }
+        bestPractices={
+          <div />
+        }
+        dos={
+          <div />
+        }
+        donts={
+          <div />
+        }
+        related={
+          <a href='https://dev.office.com/fabric-js/Components/VirtualizedList/VirtualizedList.html'>Fabric JS</a>
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }
+      />
+    );
+  }
+}
diff --git a/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example.tsx b/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example.tsx
new file mode 100644
index 0000000000000..7a56385bfd748
--- /dev/null
+++ b/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example.tsx
@@ -0,0 +1,56 @@
+import * as React from 'react';
+import { VirtualizedList } from '../VirtualizedList';
+import { ScrollContainer } from '../../../utilities/scrolling/ScrollContainer';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+
+import * as VirtualizedListExampleStylesModule from './VirtualizedList.Example.scss';
+
+interface IItem {
+  key: string;
+}
+
+const items: IItem[] = [];
+
+type ExampleList = new () => VirtualizedList<IItem>;
+// tslint:disable-next-line:no-any
+const ExampleList: ExampleList = VirtualizedList as any;
+
+export class VirtualizedListBasicExample extends React.Component {
+
+  constructor() {
+    super();
+
+    // Populate with items for demos.
+    if (items.length === 0) {
+      for (let i = 0; i < 2000; i++) {
+        items.push({
+          key: `Item ${i}`
+        });
+      }
+    }
+  }
+
+  public render(): JSX.Element {
+    return (
+      <div>
+        <ScrollContainer className={ VirtualizedListExampleStylesModule.fixedHeight }>
+          <ExampleList
+            items={ items }
+            itemHeight={ 30 }
+            onRenderItem={ this._renderItem }
+          />
+        </ScrollContainer>
+      </div>
+    );
+  }
+
+  @autobind
+  private _renderItem(item: IItem, itemIndex: number): JSX.Element {
+    return (
+      // tslint:disable-next-line:jsx-ban-props
+      <div key={ item.key } style={ { height: 30 } }>
+        { item.key }
+      </div>
+    );
+  }
+}
diff --git a/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example2.tsx b/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example2.tsx
new file mode 100644
index 0000000000000..455dbac61a0b6
--- /dev/null
+++ b/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example2.tsx
@@ -0,0 +1,65 @@
+import * as React from 'react';
+import { VirtualizedList } from '../VirtualizedList';
+import { ScrollContainer } from '../../../utilities/scrolling/ScrollContainer';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+
+import * as VirtualizedListExampleStylesModule from './VirtualizedList.Example.scss';
+
+interface IItem {
+  key: string;
+}
+
+const items: IItem[] = [];
+
+const Item = (props: { item: IItem }) => {
+  const { item } = props;
+
+  return (
+    <div>
+      { item.key }
+    </div>
+  );
+};
+
+type ExampleList = new () => VirtualizedList<IItem>;
+// tslint:disable-next-line:no-any
+const ExampleList: ExampleList = VirtualizedList as any;
+
+export class VirtualizedListBasicExample2 extends React.Component {
+  constructor() {
+    super();
+
+    // Populate with items for demos.
+    if (items.length === 0) {
+      for (let i = 0; i < 2000; i++) {
+        items.push({
+          key: `Item ${i}`
+        });
+      }
+    }
+  }
+
+  public render(): JSX.Element {
+    return (
+      <div>
+        <ScrollContainer scrollDebounceDelay={ 200 } className={ VirtualizedListExampleStylesModule.fixedHeight }>
+          <ExampleList
+            items={ items }
+            itemHeight={ 30 }
+            onRenderItem={ this._renderItem }
+          />
+        </ScrollContainer>
+      </div>
+    );
+  }
+
+  @autobind
+  private _renderItem(item: IItem, itemIndex: number): JSX.Element {
+    return (
+      // tslint:disable-next-line:jsx-ban-props
+      <div key={ item.key } style={ { height: 30, border: '1px solid blue' } }>
+        <Item item={ item } />
+      </div>
+    );
+  }
+}
diff --git a/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Example.scss b/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Example.scss
new file mode 100644
index 0000000000000..fbd8cb9cb496a
--- /dev/null
+++ b/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Example.scss
@@ -0,0 +1,3 @@
+.fixedHeight {
+  height: 300px;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/VirtualizedList/index.ts b/packages/experiments/src/components/VirtualizedList/index.ts
new file mode 100644
index 0000000000000..c23384787230f
--- /dev/null
+++ b/packages/experiments/src/components/VirtualizedList/index.ts
@@ -0,0 +1,2 @@
+export * from './VirtualizedList.types';
+export * from './VirtualizedList';
\ No newline at end of file
diff --git a/packages/experiments/src/demo/AppDefinition.tsx b/packages/experiments/src/demo/AppDefinition.tsx
index e5c65af573dff..705d2e5420d29 100644
--- a/packages/experiments/src/demo/AppDefinition.tsx
+++ b/packages/experiments/src/demo/AppDefinition.tsx
@@ -88,6 +88,18 @@ export const AppDefinition: IAppDefinition = {
           name: 'ExtendedPeoplePicker',
           url: '#/examples/extendedpeoplepicker'
         },
+        {
+          component: require<any>('../components/VirtualizedList/VirtualizedListPage').VirtualizedListPage,
+          key: 'VirtualizedList',
+          name: 'VirtualizedList',
+          url: '#/examples/virtualizedlist'
+        },
+        {
+          component: require<any>('../components/StaticList/StaticListPage').StaticListPage,
+          key: 'StaticList',
+          name: 'StaticList',
+          url: '#/examples/staticlist'
+        }
       ]
     }
   ],
diff --git a/packages/experiments/src/utilities/scrolling/ScrollContainer.scss b/packages/experiments/src/utilities/scrolling/ScrollContainer.scss
new file mode 100644
index 0000000000000..73c841ec67b72
--- /dev/null
+++ b/packages/experiments/src/utilities/scrolling/ScrollContainer.scss
@@ -0,0 +1,3 @@
+.root {
+  overflow: auto;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/utilities/scrolling/ScrollContainer.tsx b/packages/experiments/src/utilities/scrolling/ScrollContainer.tsx
new file mode 100644
index 0000000000000..7de016ad6a1b1
--- /dev/null
+++ b/packages/experiments/src/utilities/scrolling/ScrollContainer.tsx
@@ -0,0 +1,152 @@
+import * as React from 'react';
+import { IScrollContainerProps } from './ScrollContainer.types';
+import { BaseComponent, autobind, css } from 'office-ui-fabric-react/lib/Utilities';
+
+import * as ScrollContainerStyles from './ScrollContainer.scss';
+
+export interface IVisibleCallback {
+  (scrollTop: number): void;
+}
+
+export interface IScrollContainer {
+  observe(element: Element): void;
+
+  unobserve(element: Element): void;
+
+  registerVisibleCallback(callback: IVisibleCallback): void;
+}
+
+export interface IScrollContainerContext {
+  scrollContainer: IScrollContainer;
+}
+
+export const ScrollContainerContextTypes = {
+  scrollContainer: React.PropTypes.object.isRequired
+};
+
+export class ScrollContainer extends BaseComponent<IScrollContainerProps> implements IScrollContainer {
+  public static childContextTypes: typeof ScrollContainerContextTypes = ScrollContainerContextTypes;
+
+  private _observer: IntersectionObserver;
+
+  private _root: HTMLDivElement;
+
+  private _callbacks: IVisibleCallback[] = [];
+  private _pendingElements: Element[] = [];
+
+  public getChildContext(): IScrollContainerContext {
+    return {
+      scrollContainer: this
+    };
+  }
+
+  public observe(element: Element): void {
+    if (this._observer) {
+      this._observer.observe(element);
+    } else {
+      this._pendingElements.push(element);
+    }
+  }
+
+  public unobserve(element: Element): void {
+    if (this._observer) {
+      this._observer.unobserve(element);
+    }
+  }
+
+  public registerVisibleCallback(callback: IVisibleCallback): void {
+    this._callbacks.push(callback);
+  }
+
+  public render(): JSX.Element {
+    const { children, className } = this.props;
+
+    return (
+      <div
+        className={ css('ms-ScrollContainer', ScrollContainerStyles.root, className) }
+        data-is-scrollable={ true }
+        ref={ this._resolveRoot }
+      >
+        { children as JSX.Element }
+      </div >
+    );
+  }
+
+  public componentWillUnmount(): void {
+    if (this._observer) {
+      this._observer.disconnect();
+    }
+  }
+
+  @autobind
+  private _resolveRoot(element: HTMLDivElement): void {
+    if (element) {
+      this._root = element;
+      this._init();
+    }
+  }
+
+  @autobind
+  private _onIntersection(entries: IntersectionObserverEntry[], observer: IntersectionObserver): void {
+    for (const entry of entries) {
+      // tslint:disable-next-line:no-any
+      if ((entry as any).isIntersecting || entry.intersectionRatio > 0) {
+        // Schedule callbacks on next frame
+        this._async.requestAnimationFrame(() => {
+          const scrollTop = this._root.scrollTop;
+          for (const callback of this._callbacks) {
+            callback(scrollTop);
+          }
+        });
+
+        // Only need to call callbacks for on entry
+        return;
+      }
+    }
+  }
+
+  private _init(): void {
+    if (typeof IntersectionObserver !== 'undefined') {
+      const threshold: number[] = [];
+      for (let i = 0; i < 100; ++i) {
+        threshold.push(i / 100.0);
+      }
+
+      this._observer = new IntersectionObserver(
+        this._onIntersection as IntersectionObserverCallback,
+        {
+          root: this._root,
+          threshold
+        } as IntersectionObserverInit
+      );
+
+      // If there were attempts to observe elements before the observer was ready, add them now
+      if (this._pendingElements.length > 0) {
+        for (const pendingElement of this._pendingElements) {
+          this._observer.observe(pendingElement);
+        }
+
+        this._pendingElements = [];
+      }
+    } else {
+      const { scrollDebounceDelay } = this.props;
+      this._onScroll = this._async.debounce(this._onScroll, scrollDebounceDelay);
+
+      // No intersection observer, rely on scroll event. Note: not all browsers support options, but since
+      // we don't need capture, we can pass it and have it ignored if not supported
+      this._root.addEventListener('scroll', this._onScroll, {
+        passive: true
+        // tslint:disable-next-line:no-any
+      } as any);
+    }
+  }
+
+  @autobind
+  private _onScroll(): void {
+    const scrollTop = this._root.scrollTop;
+
+    for (const callback of this._callbacks) {
+      callback(scrollTop);
+    }
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/utilities/scrolling/ScrollContainer.types.ts b/packages/experiments/src/utilities/scrolling/ScrollContainer.types.ts
new file mode 100644
index 0000000000000..0480d8b01eae0
--- /dev/null
+++ b/packages/experiments/src/utilities/scrolling/ScrollContainer.types.ts
@@ -0,0 +1,14 @@
+import { IBaseProps } from 'office-ui-fabric-react/lib/Utilities';
+
+export interface IScrollContainerProps extends IBaseProps {
+  /**
+   * Optional class name to add to element
+   */
+  className?: string;
+
+  /**
+   * Milliseconds to wait before re-rendering after a scroll event occured, set to 0 to disable debounce.
+   * Only used when falling back to scroll events
+   * */
+  scrollDebounceDelay?: number;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/utilities/scrolling/index.ts b/packages/experiments/src/utilities/scrolling/index.ts
new file mode 100644
index 0000000000000..7e5130df9fcac
--- /dev/null
+++ b/packages/experiments/src/utilities/scrolling/index.ts
@@ -0,0 +1,2 @@
+export * from './ScrollContainer.types';
+export * from './ScrollContainer';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 3656b9b0f6c9b..5dd92b099915b 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -56,4 +56,4 @@
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   }
-}
\ No newline at end of file
+}

From 0e28217a5d3aff9d3e4dcf9319f6e5a117c97fec Mon Sep 17 00:00:00 2001
From: manueldosal <manuel_dosal32@hotmail.com>
Date: Tue, 12 Dec 2017 18:06:47 -0800
Subject: [PATCH 1143/1641] BaseButton: Add onAfterMenuDismiss (#3565)

* Adding on menu dismissed to BasButton

* Adding rush change file

* changing prop name and keeping the one in ContextualMenu

* changing rush change file

* Update BaseButton_onMenuDismissed_2017-12-12-23-44.json

* Adding UT for onAfterMenuDismiss callback
---
 ...tton_onMenuDismissed_2017-12-12-23-44.json | 11 ++++++
 .../src/components/Button/BaseButton.tsx      |  7 ++++
 .../src/components/Button/Button.test.tsx     | 38 +++++++++++++++++++
 .../src/components/Button/Button.types.ts     |  5 +++
 4 files changed, 61 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/BaseButton_onMenuDismissed_2017-12-12-23-44.json

diff --git a/common/changes/office-ui-fabric-react/BaseButton_onMenuDismissed_2017-12-12-23-44.json b/common/changes/office-ui-fabric-react/BaseButton_onMenuDismissed_2017-12-12-23-44.json
new file mode 100644
index 0000000000000..e51956469d4e1
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/BaseButton_onMenuDismissed_2017-12-12-23-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "BaseButton:onAfterMenuDismiss",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "madosal@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 58122b092d02b..3a972ea2b90a7 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -192,6 +192,13 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     return this._onRenderContent(tag, buttonProps);
   }
 
+  public componentDidUpdate(prevProps: IBaseButtonProps, prevState: IBaseButtonState) {
+    // If Button's menu was closed, run onAfterMenuDismiss
+    if (this.props.onAfterMenuDismiss && prevState.menuProps && !this.state.menuProps) {
+      this.props.onAfterMenuDismiss();
+    }
+  }
+
   public focus(): void {
     if (this._buttonElement) {
       this._buttonElement.focus();
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
index 94643d254290a..f865e1a6c8364 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
@@ -391,6 +391,44 @@ describe('Button', () => {
         expect(renderedDOM.getAttribute('aria-expanded')).toEqual('true');
       });
 
+      it('Click on button opens the menu, a second click closes the menu and calls onAfterMenuDismiss', () => {
+
+        const callbackMock = jest.fn();
+
+        const renderedDOM: HTMLElement = renderIntoDocument(
+          <DefaultButton
+            data-automation-id='test'
+            text='Create account'
+            split={ true }
+            onClick={ setTrue }
+            onAfterMenuDismiss={ callbackMock }
+            menuProps={ {
+              items: [
+                {
+                  key: 'emailMessage',
+                  name: 'Email message',
+                  icon: 'Mail'
+                },
+                {
+                  key: 'calendarEvent',
+                  name: 'Calendar event',
+                  icon: 'Calendar'
+                }
+              ]
+            } }
+          />
+        );
+
+        const menuButtonElement = renderedDOM.querySelectorAll('button')[1];
+
+        ReactTestUtils.Simulate.click(menuButtonElement);
+        expect(renderedDOM.getAttribute('aria-expanded')).toEqual('true');
+
+        ReactTestUtils.Simulate.click(menuButtonElement);
+        expect(renderedDOM.getAttribute('aria-expanded')).toEqual('false');
+        expect(callbackMock.mock.calls.length).toBe(1);
+      });
+
       it('A disabled SplitButton does not respond to clicks', () => {
         const renderedDOM: HTMLElement = renderIntoDocument(
           <DefaultButton
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.types.ts b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
index 2413813232800..f8fa11f8af393 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
@@ -107,6 +107,11 @@ export interface IButtonProps extends React.AllHTMLAttributes<HTMLAnchorElement
    */
   menuProps?: IContextualMenuProps;
 
+  /**
+   * Callback that runs after Button's contextualmenu was closed (removed from the DOM)
+   */
+  onAfterMenuDismiss?: () => void;
+
   /**
    * If set to true, and if menuProps and onClick are provided, the button will render as a SplitButton. Defaults to false.
    */

From 4f0fa0ea2450fd402eaf5d51b3cc46d282d79db9 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Tue, 12 Dec 2017 19:29:28 -0800
Subject: [PATCH 1144/1641] ContextualMenu: Undo change to manually set the
 scrollbar (#3567)

* Revert "ContextualMenu: Make sure vertical scrollbar does not take space away from contents (#3449)"

This reverts commit 98a7e2444662ab34b4f3c84daef6afd2b04cbbdd.

* Add a longer label in the example

* Rush change
---
 .../chrisgo-scroll-bar-fix_2017-12-13-02-09.json      | 11 +++++++++++
 .../src/components/Callout/Callout.scss               |  1 +
 .../Callout/__snapshots__/Callout.test.tsx.snap       |  1 -
 .../examples/ContextualMenu.ScrollBar.Example.tsx     |  4 ++--
 .../src/components/Popup/Popup.tsx                    |  8 +-------
 5 files changed, 15 insertions(+), 10 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/chrisgo-scroll-bar-fix_2017-12-13-02-09.json

diff --git a/common/changes/office-ui-fabric-react/chrisgo-scroll-bar-fix_2017-12-13-02-09.json b/common/changes/office-ui-fabric-react/chrisgo-scroll-bar-fix_2017-12-13-02-09.json
new file mode 100644
index 0000000000000..a598d93e94d27
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/chrisgo-scroll-bar-fix_2017-12-13-02-09.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: Undo change to manually set the scrollbar",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
index 0567f787fa7a1..f9e16980d02b0 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
@@ -42,6 +42,7 @@ $Callout-smallbeak-slant-width: 16px;
 .main {
   background-color: $ms-color-white;
   overflow-x: hidden;
+  overflow-y: auto;
   position: relative;
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
index 0f00f4dbcce2b..4f649424e81dc 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
@@ -25,7 +25,6 @@ exports[`Callout renders Callout correctly 1`] = `
         Object {
           "backgroundColor": undefined,
           "maxHeight": 750,
-          "overflowY": "auto",
         }
       }
     >
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.ScrollBar.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.ScrollBar.Example.tsx
index 69843784f3c28..1873ccac03efb 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.ScrollBar.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.ScrollBar.Example.tsx
@@ -28,8 +28,8 @@ export class ContextualMenuWithScrollBarExample extends React.Component<any, any
                 name: 'New'
               },
               {
-                key: 'rename',
-                name: 'Rename'
+                key: 'item 2',
+                name: 'Item with a very long label text'
               },
               {
                 key: 'edit',
diff --git a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
index 1d7292ec4553f..31c6999b4db98 100644
--- a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
+++ b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
@@ -55,12 +55,7 @@ export class Popup extends BaseComponent<IPopupProps, {}> {
   }
 
   public render() {
-    let { role, className, ariaLabel, ariaLabelledBy, ariaDescribedBy, style } = this.props;
-
-    let needsVerticalScrollBar = false;
-    if (this.refs.root) {
-      needsVerticalScrollBar = this.refs.root.scrollHeight > this.refs.root.clientHeight;
-    }
+    let { role, className, ariaLabel, ariaLabelledBy, ariaDescribedBy } = this.props;
 
     return (
       <div
@@ -72,7 +67,6 @@ export class Popup extends BaseComponent<IPopupProps, {}> {
         aria-labelledby={ ariaLabelledBy }
         aria-describedby={ ariaDescribedBy }
         onKeyDown={ this._onKeyDown }
-        style={ { ...style, overflowY: needsVerticalScrollBar ? 'scroll' : 'auto' } }
       >
         { this.props.children }
       </div>

From 2e39f1b6b64e33554848ec327a4ea50d2ce3889c Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 13 Dec 2017 04:06:51 +0000
Subject: [PATCH 1145/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...tton_onMenuDismissed_2017-12-12-23-44.json | 11 -------
 ...risgo-scroll-bar-fix_2017-12-13-02-09.json | 11 -------
 .../link-states_2017-11-28-17-47.json         | 11 -------
 ...o-dropdown_focus_fix_2017-12-12-22-09.json | 11 -------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 31 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 ++++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 13 files changed, 53 insertions(+), 53 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/BaseButton_onMenuDismissed_2017-12-12-23-44.json
 delete mode 100644 common/changes/office-ui-fabric-react/chrisgo-scroll-bar-fix_2017-12-13-02-09.json
 delete mode 100644 common/changes/office-ui-fabric-react/link-states_2017-11-28-17-47.json
 delete mode 100644 common/changes/office-ui-fabric-react/magellantoo-dropdown_focus_fix_2017-12-12-22-09.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 4fc8a9be12d38..90815204c7c8a 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.31.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.32.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 8f0a360b617ef..c1f4a494e493d 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.31.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.32.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 632c258013a94..350369fef03d9 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.31.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.32.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 2924afa75dbee..7bc512c363322 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.31.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.32.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index bc603a10c1b9c..6c82bef8d7b90 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -30,7 +30,7 @@
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/styling": ">=5.14.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.31.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.32.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/office-ui-fabric-react/BaseButton_onMenuDismissed_2017-12-12-23-44.json b/common/changes/office-ui-fabric-react/BaseButton_onMenuDismissed_2017-12-12-23-44.json
deleted file mode 100644
index e51956469d4e1..0000000000000
--- a/common/changes/office-ui-fabric-react/BaseButton_onMenuDismissed_2017-12-12-23-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "BaseButton:onAfterMenuDismiss",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "madosal@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/chrisgo-scroll-bar-fix_2017-12-13-02-09.json b/common/changes/office-ui-fabric-react/chrisgo-scroll-bar-fix_2017-12-13-02-09.json
deleted file mode 100644
index a598d93e94d27..0000000000000
--- a/common/changes/office-ui-fabric-react/chrisgo-scroll-bar-fix_2017-12-13-02-09.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: Undo change to manually set the scrollbar",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/link-states_2017-11-28-17-47.json b/common/changes/office-ui-fabric-react/link-states_2017-11-28-17-47.json
deleted file mode 100644
index bd088959b9206..0000000000000
--- a/common/changes/office-ui-fabric-react/link-states_2017-11-28-17-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Link: Fixed state styling for the component and its documented examples.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/magellantoo-dropdown_focus_fix_2017-12-12-22-09.json b/common/changes/office-ui-fabric-react/magellantoo-dropdown_focus_fix_2017-12-12-22-09.json
deleted file mode 100644
index 3796619f1938a..0000000000000
--- a/common/changes/office-ui-fabric-react/magellantoo-dropdown_focus_fix_2017-12-12-22-09.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix dropdown focus issue for IE",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index df7e56f6cec8f..d5d073829c3f5 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.31.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.32.0 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index c533570754705..412afefa506f5 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,37 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.32.0",
+      "tag": "office-ui-fabric-react_v5.32.0",
+      "date": "Wed, 13 Dec 2017 04:06:51 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "manueldosal <manuel_dosal32@hotmail.com>",
+            "commit": "0e28217a5d3aff9d3e4dcf9319f6e5a117c97fec",
+            "comment": "BaseButton:onAfterMenuDismiss"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "4f0fa0ea2450fd402eaf5d51b3cc46d282d79db9",
+            "comment": "ContextualMenu: Undo change to manually set the scrollbar"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "8146c713b40cfbba03fd1f9e4197ef1502a0bc21",
+            "comment": "Link: Fixed state styling for the component and its documented examples."
+          },
+          {
+            "author": "Lambert W <lambert.ww@gmail.com>",
+            "commit": "52ffc478baaa3bf900f686ff6a67ba9965f1e523",
+            "comment": "Fix dropdown focus issue for IE"
+          }
+        ]
+      }
+    },
     {
       "version": "5.31.2",
       "tag": "office-ui-fabric-react_v5.31.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 67e84ec2ca57c..a16b4dc8a43bf 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 12 Dec 2017 11:25:08 GMT and should not be manually modified.
+This log was last generated on Wed, 13 Dec 2017 04:06:51 GMT and should not be manually modified.
+
+## 5.32.0
+Wed, 13 Dec 2017 04:06:51 GMT
+
+### Minor changes
+
+- BaseButton:onAfterMenuDismiss
+
+### Patches
+
+- ContextualMenu: Undo change to manually set the scrollbar
+- Link: Fixed state styling for the component and its documented examples.
+- Fix dropdown focus issue for IE
 
 ## 5.31.2
 Tue, 12 Dec 2017 11:25:08 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 5dd92b099915b..ff16ffbddbb34 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.31.2",
+  "version": "5.32.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -56,4 +56,4 @@
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   }
-}
+}
\ No newline at end of file

From 76aead93eeb29bac6f7a9d9e73893cfcfa0685fd Mon Sep 17 00:00:00 2001
From: staylo8 <33881401+staylo8@users.noreply.github.com>
Date: Wed, 13 Dec 2017 09:51:06 -0800
Subject: [PATCH 1146/1641] Public remeasure method for ResizeGroup and
 Experiments CommandBar (#3551)

* Add remeasure public method to Experiments CommandBar and ResizeGroup

* Change files
---
 ...esizeGroupPublicRemeasureAPI_2017-12-11-17-30.json | 11 +++++++++++
 ...esizeGroupPublicRemeasureAPI_2017-12-11-17-30.json | 11 +++++++++++
 .../src/components/CommandBar/CommandBar.base.tsx     |  8 +++++++-
 .../src/components/CommandBar/CommandBar.types.ts     |  5 +++++
 .../src/components/CommandBar/CommandBarPage.tsx      |  4 ++--
 .../src/components/ResizeGroup/ResizeGroup.tsx        |  6 ++++++
 .../src/components/ResizeGroup/ResizeGroup.types.ts   |  5 ++++-
 7 files changed, 46 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/staylo-ResizeGroupPublicRemeasureAPI_2017-12-11-17-30.json
 create mode 100644 common/changes/office-ui-fabric-react/staylo-ResizeGroupPublicRemeasureAPI_2017-12-11-17-30.json

diff --git a/common/changes/@uifabric/experiments/staylo-ResizeGroupPublicRemeasureAPI_2017-12-11-17-30.json b/common/changes/@uifabric/experiments/staylo-ResizeGroupPublicRemeasureAPI_2017-12-11-17-30.json
new file mode 100644
index 0000000000000..3fa049df1cb74
--- /dev/null
+++ b/common/changes/@uifabric/experiments/staylo-ResizeGroupPublicRemeasureAPI_2017-12-11-17-30.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Add remeasure public method to CommandBar",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "staylo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/staylo-ResizeGroupPublicRemeasureAPI_2017-12-11-17-30.json b/common/changes/office-ui-fabric-react/staylo-ResizeGroupPublicRemeasureAPI_2017-12-11-17-30.json
new file mode 100644
index 0000000000000..677eb1a5fdf20
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/staylo-ResizeGroupPublicRemeasureAPI_2017-12-11-17-30.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add remeasure public method to ResizeGroup",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "staylo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.base.tsx b/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
index c790024775960..efb96a9b73c7a 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
@@ -14,7 +14,7 @@ import {
 } from './CommandBar.types';
 import { CommandBarButton } from 'office-ui-fabric-react/lib/Button';
 import { OverflowSet, IOverflowSet } from 'office-ui-fabric-react/lib/OverflowSet';
-import { ResizeGroup } from 'office-ui-fabric-react/lib/ResizeGroup';
+import { ResizeGroup, IResizeGroup } from 'office-ui-fabric-react/lib/ResizeGroup';
 import { TooltipHost } from 'office-ui-fabric-react/lib/Tooltip';
 import {
   classNamesFunction
@@ -55,6 +55,7 @@ export class CommandBarBase extends BaseComponent<ICommandBarProps, {}> implemen
   };
 
   private _overflowSet: IOverflowSet;
+  private _resizeGroup: IResizeGroup;
   private _classNames: {[key in keyof ICommandBarStyles]: string };
 
   public render(): JSX.Element {
@@ -86,6 +87,7 @@ export class CommandBarBase extends BaseComponent<ICommandBarProps, {}> implemen
 
     return (
       <ResizeGroup
+        componentRef={ this._resolveRef('_resizeGroup') }
         className={ className }
         data={ commandBardata }
         onReduceData={ onReduceData }
@@ -134,6 +136,10 @@ export class CommandBarBase extends BaseComponent<ICommandBarProps, {}> implemen
     this._overflowSet.focus();
   }
 
+  public remeasure(): void {
+    this._resizeGroup.remeasure();
+  }
+
   private _computeCacheKey(primaryItems: ICommandBarItemProps[], farItems: ICommandBarItemProps[], overflow: boolean): string {
     const returnKey = (acc: string, current: ICommandBarItemProps): string => {
       const { cacheKey = current.key } = current;
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.types.ts b/packages/experiments/src/components/CommandBar/CommandBar.types.ts
index 054c2e06ae945..494f85ed0f4a9 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.types.ts
+++ b/packages/experiments/src/components/CommandBar/CommandBar.types.ts
@@ -12,6 +12,11 @@ export interface ICommandBar {
    * Sets focus to the active command in the list.
    */
   focus(): void;
+
+  /**
+   * Remeasures the available space.
+   */
+  remeasure(): void;
 }
 
 export interface ICommandBarProps extends React.HTMLAttributes<HTMLDivElement> {
diff --git a/packages/experiments/src/components/CommandBar/CommandBarPage.tsx b/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
index f89be116ffa69..58d5cf6d29718 100644
--- a/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBarPage.tsx
@@ -10,7 +10,7 @@ import { ICommandBarProps } from './CommandBar.types';
 import { CommandBarBasicExample } from './examples/CommandBar.Basic.Example';
 
 const CommandBarBasicExampleCode = require(
-  '!raw-loader!office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx'
+  '!raw-loader!experiments/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx'
 ) as string;
 
 export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}> {
@@ -31,7 +31,7 @@ export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}>
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/CommandBar/CommandBar.types.ts'),
+              require<string>('!raw-loader!experiments/src/components/CommandBar/CommandBar.types.ts'),
               require<string>('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts')
             ] }
           />
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index a4c1f031d5819..fb281de27982f 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -325,6 +325,12 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
     this._afterComponentRendered();
   }
 
+  public remeasure(): void {
+    if (this._root) {
+      this.setState({ measureContainer: true });
+    }
+  }
+
   private _afterComponentRendered() {
     this._async.requestAnimationFrame(() => {
       let containerWidth = undefined;
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.types.ts b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.types.ts
index dd3c8d0bce440..dec502a0d4dfc 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.types.ts
@@ -2,7 +2,10 @@ import * as React from 'react';
 import { ResizeGroup } from './ResizeGroup';
 
 export interface IResizeGroup {
-
+  /**
+   * Remeasures the available space.
+   */
+  remeasure(): void;
 }
 
 export interface IResizeGroupProps extends React.HTMLAttributes<ResizeGroup | HTMLElement> {

From 6ed5a98773bb43468eb402b074e7a37847d22a0e Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Wed, 13 Dec 2017 10:42:01 -0800
Subject: [PATCH 1147/1641] Website: Updated GetStarted page to better reflect
 the state of Fabric (#3562)

* Improve documentation on GetStarted page

* Added ms-Fabric reference

* Added change file

* ms-Fabric lingo change
---
 .../GetStarted/GetStartedPage.module.scss     | 10 +++-
 .../src/pages/GetStarted/GetStartedPage.tsx   | 49 +++++++++++--------
 .../website-docs_2017-12-12-20-10.json        | 11 +++++
 3 files changed, 49 insertions(+), 21 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/website-docs_2017-12-12-20-10.json

diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
index ae041d2aad1db..b83ef65a8254e 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
@@ -132,7 +132,6 @@
     font-size: $ms-font-size-l;
   }
 
-  a,
   .getStartedLink {
     color: $color-getStarted-medium;
   }
@@ -140,6 +139,15 @@
   .trademark {
     margin-top: 80px;
   }
+
+  :global(.ms-Button) {
+    margin: 12px 0;
+  }
+
+  code {
+    background-color: $ms-color-white;
+    padding: 0 2px;
+  }
 }
 
 .steps {
diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
index 8979096ea2efd..7841a5f4ecd70 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.tsx
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { CodeBlock } from '../../components/CodeBlock/CodeBlock';
 import { css } from 'office-ui-fabric-react/lib/Utilities';
+import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { PageHeader } from '../../components/PageHeader/PageHeader';
 
 const diagramStyles: any = require('./GetStartedPage.diagram.module.scss');
@@ -124,7 +125,7 @@ export class GetStartedPage extends React.Component<any, any> {
               </CodeBlock>
             </li>
             <li>
-              <p>The library includes commonjs entry points under the lib folder. To use a control, you should be able to import it and use it in your render method. Note that wrapping your application in the Fabric component is required to support RTL, keyboard focus and other features.</p>
+              <p>The library includes commonjs entry points under the lib folder. To use a control (like DefaultButton), import it along with React and use it in your render method. Note that wrapping your application in the Fabric component is required to support RTL, keyboard focus, and other features.</p>
               <CodeBlock language='javascript' isLightTheme={ true }>
                 {
                   `import * as React from 'react';
@@ -132,32 +133,38 @@ import * as ReactDOM from 'react-dom';
 import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 
-const MyPage = () => (<Fabric><DefaultButton>I am a button.</DefaultButton></Fabric>);
+const MyPage = () => (
+  <Fabric>
+    <DefaultButton>
+      I am a button.
+    </DefaultButton>
+  </Fabric>
+);
 
 ReactDOM.render(<MyPage />, document.body.firstChild);`
                 }
               </CodeBlock>
-              <p>For more information about using components, check out the <a className={ styles.getStartedLink } href='#/components'>components page</a>.</p>
             </li>
             <li>
-              <p>You can also reference type styles for any text element:</p>
-              <CodeBlock language='html' isLightTheme={ true }>
-                {
-                  `<span class="ms-font-su ms-fontColor-themePrimary">Big blue text</span>`
-                }
-              </CodeBlock>
-            </li>
-            <li>
-              <p>Reference icons by using the appropriate icon classes:</p>
-              <CodeBlock language='html' isLightTheme={ true }>
+              <p>Add props to your component to tack advantage of Fabric React's rich functionality.</p>
+              <CodeBlock language='javascript' isLightTheme={ true }>
                 {
-                  `<i class="ms-Icon ms-Icon--Mail" aria-hidden="true"></i>`
+                  `<DefaultButton
+  text='See Button'
+  primary={ true }
+  href='#/components/button'
+/>`
                 }
               </CodeBlock>
-              <p>Components, type, and icons are just a small part of what Fabric has to offer. To reference other assets, including colors, product symbols, and more, see the <a className={ styles.getStartedLink } href='#/styles'>styles page</a>.</p>
+              <DefaultButton
+                text='See Button'
+                primary={ true }
+                href='#/components/button'
+              />
+              <p>For more information about using components, check out the <a className={ styles.getStartedLink } href='#/components'>components page</a>.</p>
             </li>
             <li>
-              <p>If you are using Fabric React components that have icons, you can make all icons available by calling the `initializeIcons` function from the `@uifabric/icons` package:</p>
+              <p>If you are using Fabric React components that have icons, you can make all icons available by calling the <code>initializeIcons</code> function from the <code>@uifabric/icons</code> package.</p>
               <CodeBlock language='javascript' isLightTheme={ true }>
                 {
                   `import { initializeIcons } from '@uifabric/icons';
@@ -169,7 +176,7 @@ initializeIcons();
 initializeIcons('https://my.cdn.com/path/to/icons/');`
                 }
               </CodeBlock>
-              <p>This will make ALL icons in the collection available, but will download them on demand when referenced using the <a href='#/components/Icon'>Icon component</a>.</p>
+              <p>This will make ALL icons in the collection available, but will download them on demand when referenced using the <a className={ styles.getStartedLink } href='#/components/Icon'>Icon component</a>.</p>
             </li>
           </ol>
 
@@ -184,7 +191,7 @@ initializeIcons('https://my.cdn.com/path/to/icons/');`
 
           <ol className={ styles.steps }>
             <li>
-              <p>Add the following line to the &lt;head&gt; of your webpage:</p>
+              <p>Add the following line to the <code>&lt;head&gt;</code> of your webpage:</p>
               <CodeBlock language='html' isLightTheme={ true }>
                 {
                   `<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/${corePackageVersion}/css/fabric.min.css">`
@@ -192,10 +199,12 @@ initializeIcons('https://my.cdn.com/path/to/icons/');`
               </CodeBlock>
             </li>
             <li>
-              <p>Reference core Fabric styles:</p>
+              <p>Reference core Fabric styles. Add the <code>ms-Fabric</code> class to a containing element, such as <code>&lt;body&gt;</code>, to set the font-family for all Fabric typography classes used within that element.</p>
               <CodeBlock language='html' isLightTheme={ true }>
                 {
-                  `<span class="ms-font-su ms-fontColor-themePrimary">Big blue text</span>`
+                  `<body class="ms-Fabric">
+  <span class="ms-font-su ms-fontColor-themePrimary">Big blue text</span>
+</body>`
                 }
               </CodeBlock>
               <p>To reference all the assets available in Fabric Core, see the <a className={ styles.getStartedLink } href='#/styles'>styles page</a>. To use components, see <a className={ styles.getStartedLink } href='#/get-started#react'>Fabric React</a> or <a className={ styles.getStartedLink } href='#/angular-js'>ngOfficeUIFabric</a>.</p>
diff --git a/common/changes/@uifabric/fabric-website/website-docs_2017-12-12-20-10.json b/common/changes/@uifabric/fabric-website/website-docs_2017-12-12-20-10.json
new file mode 100644
index 0000000000000..2f39eb444ac0e
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/website-docs_2017-12-12-20-10.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "GetStarted page: updated to better reflect the current Fabric workflows.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From 5f03aaf93860c5c5a1d582e8eacdbdd31c37028c Mon Sep 17 00:00:00 2001
From: Kushal Yarlagadda <whykushal93@gmail.com>
Date: Wed, 13 Dec 2017 14:17:31 -0800
Subject: [PATCH 1148/1641] Reversing the order of :focus and :active selectors
 in a comboBox. (#3566)

* Reversing the order of :focus and :active selectors in a comboBox.
The current order causes an option button to take the styles of the focused state when it is pressed.

* Change file
---
 .../testMaster1_2017-12-13-00-09.json                 | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.classNames.ts    |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/testMaster1_2017-12-13-00-09.json

diff --git a/common/changes/office-ui-fabric-react/testMaster1_2017-12-13-00-09.json b/common/changes/office-ui-fabric-react/testMaster1_2017-12-13-00-09.json
new file mode 100644
index 0000000000000..64e350506e5fe
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/testMaster1_2017-12-13-00-09.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Reversing the order of :focus and :active selectors for comboBox options.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kushaly@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
index 2c7bb75634cf5..85d47f0690e73 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
@@ -106,8 +106,8 @@ export const getComboBoxOptionClassNames = memoizeFunction((
       {
         selectors: {
           ':hover': styles.rootHovered,
-          ':active': styles.rootPressed,
-          ':focus': styles.rootFocused
+          ':focus': styles.rootFocused,
+          ':active': styles.rootPressed
         }
       }
     )

From 983096831e3b29bbecf557439006fb1d14bf3979 Mon Sep 17 00:00:00 2001
From: Eddie Liu <leddie24@gmail.com>
Date: Wed, 13 Dec 2017 16:40:53 -0800
Subject: [PATCH 1149/1641] Panel: Don't render Overlay component unless Panel
 isOpen (#3576)

* Don't render Overlay in Panel unless isOpen

* Add change file
---
 ...wliu-fixHiddenOnDismissPanel_2017-12-13-23-35.json | 11 +++++++++++
 .../src/components/Panel/Panel.tsx                    |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-edwliu-fixHiddenOnDismissPanel_2017-12-13-23-35.json

diff --git a/common/changes/office-ui-fabric-react/v-edwliu-fixHiddenOnDismissPanel_2017-12-13-23-35.json b/common/changes/office-ui-fabric-react/v-edwliu-fixHiddenOnDismissPanel_2017-12-13-23-35.json
new file mode 100644
index 0000000000000..c566a1218d797
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-edwliu-fixHiddenOnDismissPanel_2017-12-13-23-35.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Panel: Don't render Overlay unless Panel prop isOpen is true",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-edwliu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
index 757116fe11aa8..c6299be4c7b24 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
@@ -102,7 +102,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
     }
 
     let overlay;
-    if (isBlocking) {
+    if (isBlocking && isOpen) {
       overlay = (
         <Overlay
           className={ css(

From 341f9c1ef7e84ad379c3b6bf7819cad1be3d2f9d Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Wed, 13 Dec 2017 16:47:30 -0800
Subject: [PATCH 1150/1641] ComboBox: Fix value submission issues (#3577)

* Update comboBox to check the value of the input if we are allowing freeform and have autocomplete turned on. THere are cases where we don't get an onChange event (and don't update the component state)

* rush change

* remove some commented temp code that was missed
---
 ...oxValueSubmissionFix_2017-12-14-00-17.json | 11 ++++++
 .../src/components/ComboBox/ComboBox.test.tsx | 34 +++++++++++++++++++
 .../src/components/ComboBox/ComboBox.tsx      | 17 ++++++----
 3 files changed, 55 insertions(+), 7 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxValueSubmissionFix_2017-12-14-00-17.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxValueSubmissionFix_2017-12-14-00-17.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxValueSubmissionFix_2017-12-14-00-17.json
new file mode 100644
index 0000000000000..308dedc63c047
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxValueSubmissionFix_2017-12-14-00-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Fix some issues with submitting values when freeform and autocomplete",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
index f91c65131c2f9..9a351352c143a 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
@@ -373,4 +373,38 @@ describe('ComboBox', () => {
     buttonElement.simulate('click');
     expect(returnUndefined.mock.calls.length).toBe(1);
   });
+
+  it('Can type a complete option with autocomplete and allowFreeform on and submit it', () => {
+    let updatedOption;
+    let updatedIndex;
+    let executionCount = 0;
+    let initialOption = { key: '1', text: 'Text' };
+
+    let comboBoxRoot;
+    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any>;
+    let wrapper = mount(
+      <ComboBox
+        label='testgroup'
+        options={ [initialOption] }
+        autoComplete='on'
+        allowFreeform={ true }
+        // tslint:disable-next-line:jsx-no-lambda
+        onChanged={ (option?: IComboBoxOption, index?: number) => {
+          updatedOption = option;
+          updatedIndex = index;
+          executionCount++;
+        } }
+      />);
+    comboBoxRoot = wrapper.find('.ms-ComboBox');
+    inputElement = comboBoxRoot.find('input');
+    inputElement.simulate('change', { target: { value: 't' } });
+    inputElement.simulate('change', { target: { value: 'e' } });
+    inputElement.simulate('change', { target: { value: 'x' } });
+    inputElement.simulate('change', { target: { value: 't' } });
+    inputElement.simulate('keydown', { which: KeyCodes.enter });
+    expect(executionCount).toEqual(1);
+    expect(updatedOption).toEqual(initialOption);
+    expect(updatedIndex).toEqual(0);
+    expect(inputElement.props().value).toEqual('Text');
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index e41ded37a63fa..17a89a347b9c4 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -784,7 +784,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   private _submitPendingValue() {
     let {
       onChanged,
-      allowFreeform
+      allowFreeform,
+      autoComplete
     } = this.props;
     let {
       currentPendingValue,
@@ -802,12 +803,15 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         let pendingOptionText: string = currentOptions[currentPendingValueValidIndex].text.toLocaleLowerCase();
 
         // By exact match, that means: our pending value is the same as the the pending option text OR
-        // the peding option starts with the pending value and we have an "autoComplete" selection
-        // where the total lenght is equal to pending option length; update the state
+        // the pending option starts with the pending value and we have an "autoComplete" selection
+        // where the total length is equal to pending option length OR
+        // the live value in the underlying input matches the pending option; update the state
         if (currentPendingValue.toLocaleLowerCase() === pendingOptionText ||
-          (pendingOptionText.indexOf(currentPendingValue.toLocaleLowerCase()) === 0 &&
-            this._comboBox.isValueSelected &&
-            currentPendingValue.length + (this._comboBox.selectionEnd - this._comboBox.selectionStart) === pendingOptionText.length)) {
+          (autoComplete && pendingOptionText.indexOf(currentPendingValue.toLocaleLowerCase()) === 0 &&
+            (this._comboBox.isValueSelected &&
+              currentPendingValue.length + (this._comboBox.selectionEnd - this._comboBox.selectionStart) === pendingOptionText.length) ||
+            (this._comboBox.inputElement.value.toLocaleLowerCase() === pendingOptionText)
+          )) {
           this._setSelectedIndex(currentPendingValueValidIndex);
           this._clearPendingInfo();
           return;
@@ -1364,7 +1368,6 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         }
 
       default:
-
         // are we processing a function key? if so bail out
         if (ev.which >= 112 /* F1 */ && ev.which <= 123 /* F12 */) {
           return;

From 9de972ee85202597a3ed9b5800ed53294d8a5dc7 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 14 Dec 2017 03:23:17 -0800
Subject: [PATCH 1151/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 19 ++++++++++++
 apps/fabric-website/CHANGELOG.md              |  9 +++++-
 apps/fabric-website/package.json              |  4 +--
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...upPublicRemeasureAPI_2017-12-11-17-30.json | 11 -------
 .../website-docs_2017-12-12-20-10.json        | 11 -------
 ...oxValueSubmissionFix_2017-12-14-00-17.json | 11 -------
 ...upPublicRemeasureAPI_2017-12-11-17-30.json | 11 -------
 .../testMaster1_2017-12-13-00-09.json         | 11 -------
 ...HiddenOnDismissPanel_2017-12-13-23-35.json | 11 -------
 packages/experiments/CHANGELOG.json           | 19 ++++++++++++
 packages/experiments/CHANGELOG.md             |  9 +++++-
 packages/experiments/package.json             |  4 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 31 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 ++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 19 files changed, 108 insertions(+), 78 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/staylo-ResizeGroupPublicRemeasureAPI_2017-12-11-17-30.json
 delete mode 100644 common/changes/@uifabric/fabric-website/website-docs_2017-12-12-20-10.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxValueSubmissionFix_2017-12-14-00-17.json
 delete mode 100644 common/changes/office-ui-fabric-react/staylo-ResizeGroupPublicRemeasureAPI_2017-12-11-17-30.json
 delete mode 100644 common/changes/office-ui-fabric-react/testMaster1_2017-12-13-00-09.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-edwliu-fixHiddenOnDismissPanel_2017-12-13-23-35.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 0b9583d617527..430cddb9e5573 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.1.0",
+      "tag": "@uifabric/fabric-website_v5.1.0",
+      "date": "Thu, 14 Dec 2017 11:23:17 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "6ed5a98773bb43468eb402b074e7a37847d22a0e",
+            "comment": "GetStarted page: updated to better reflect the current Fabric workflows."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.32.0 <6.0.0` to `>=5.33.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.19",
       "tag": "@uifabric/fabric-website_v5.0.19",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index a793f98f6b6c4..5aed9ec84bfad 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Wed, 06 Dec 2017 11:24:52 GMT and should not be manually modified.
+This log was last generated on Thu, 14 Dec 2017 11:23:17 GMT and should not be manually modified.
+
+## 5.1.0
+Thu, 14 Dec 2017 11:23:17 GMT
+
+### Minor changes
+
+- GetStarted page: updated to better reflect the current Fabric workflows.
 
 ## 5.0.19
 Wed, 06 Dec 2017 11:24:52 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 90815204c7c8a..e5e1d3c11d736 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.0.19",
+  "version": "5.1.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.32.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.33.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index c1f4a494e493d..227c46f1d60fa 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.32.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.33.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 350369fef03d9..1c1d62355318d 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.32.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.33.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 7bc512c363322..9c5cb89e806ec 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.32.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.33.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 6c82bef8d7b90..28930792e9086 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -30,7 +30,7 @@
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/styling": ">=5.14.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.32.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.33.0 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/experiments/staylo-ResizeGroupPublicRemeasureAPI_2017-12-11-17-30.json b/common/changes/@uifabric/experiments/staylo-ResizeGroupPublicRemeasureAPI_2017-12-11-17-30.json
deleted file mode 100644
index 3fa049df1cb74..0000000000000
--- a/common/changes/@uifabric/experiments/staylo-ResizeGroupPublicRemeasureAPI_2017-12-11-17-30.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Add remeasure public method to CommandBar",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "staylo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/website-docs_2017-12-12-20-10.json b/common/changes/@uifabric/fabric-website/website-docs_2017-12-12-20-10.json
deleted file mode 100644
index 2f39eb444ac0e..0000000000000
--- a/common/changes/@uifabric/fabric-website/website-docs_2017-12-12-20-10.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "GetStarted page: updated to better reflect the current Fabric workflows.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxValueSubmissionFix_2017-12-14-00-17.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxValueSubmissionFix_2017-12-14-00-17.json
deleted file mode 100644
index 308dedc63c047..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxValueSubmissionFix_2017-12-14-00-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Fix some issues with submitting values when freeform and autocomplete",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/staylo-ResizeGroupPublicRemeasureAPI_2017-12-11-17-30.json b/common/changes/office-ui-fabric-react/staylo-ResizeGroupPublicRemeasureAPI_2017-12-11-17-30.json
deleted file mode 100644
index 677eb1a5fdf20..0000000000000
--- a/common/changes/office-ui-fabric-react/staylo-ResizeGroupPublicRemeasureAPI_2017-12-11-17-30.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add remeasure public method to ResizeGroup",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "staylo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/testMaster1_2017-12-13-00-09.json b/common/changes/office-ui-fabric-react/testMaster1_2017-12-13-00-09.json
deleted file mode 100644
index 64e350506e5fe..0000000000000
--- a/common/changes/office-ui-fabric-react/testMaster1_2017-12-13-00-09.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Reversing the order of :focus and :active selectors for comboBox options.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kushaly@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-edwliu-fixHiddenOnDismissPanel_2017-12-13-23-35.json b/common/changes/office-ui-fabric-react/v-edwliu-fixHiddenOnDismissPanel_2017-12-13-23-35.json
deleted file mode 100644
index c566a1218d797..0000000000000
--- a/common/changes/office-ui-fabric-react/v-edwliu-fixHiddenOnDismissPanel_2017-12-13-23-35.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Panel: Don't render Overlay unless Panel prop isOpen is true",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-edwliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 4f98bd1767e06..3feb1f99f55e7 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.10.0",
+      "tag": "@uifabric/experiments_v5.10.0",
+      "date": "Thu, 14 Dec 2017 11:23:17 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "staylo8 <33881401+staylo8@users.noreply.github.com>",
+            "commit": "76aead93eeb29bac6f7a9d9e73893cfcfa0685fd",
+            "comment": "Add remeasure public method to CommandBar"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.32.0 <6.0.0` to `>=5.33.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.9.2",
       "tag": "@uifabric/experiments_v5.9.2",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index cab1718a236bc..9fd966a2f33a6 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Tue, 12 Dec 2017 02:08:36 GMT and should not be manually modified.
+This log was last generated on Thu, 14 Dec 2017 11:23:17 GMT and should not be manually modified.
+
+## 5.10.0
+Thu, 14 Dec 2017 11:23:17 GMT
+
+### Minor changes
+
+- Add remeasure public method to CommandBar
 
 ## 5.9.2
 Tue, 12 Dec 2017 02:08:36 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index d5d073829c3f5..d4fa7f022f524 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.9.2",
+  "version": "5.10.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.32.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.33.0 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 412afefa506f5..1cdf5b4f18ce5 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,37 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.33.0",
+      "tag": "office-ui-fabric-react_v5.33.0",
+      "date": "Thu, 14 Dec 2017 11:23:17 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "341f9c1ef7e84ad379c3b6bf7819cad1be3d2f9d",
+            "comment": "ComboBox: Fix some issues with submitting values when freeform and autocomplete"
+          },
+          {
+            "author": "Kushal Yarlagadda <whykushal93@gmail.com>",
+            "commit": "5f03aaf93860c5c5a1d582e8eacdbdd31c37028c",
+            "comment": "Reversing the order of :focus and :active selectors for comboBox options."
+          },
+          {
+            "author": "Eddie Liu <leddie24@gmail.com>",
+            "commit": "983096831e3b29bbecf557439006fb1d14bf3979",
+            "comment": "Panel: Don't render Overlay unless Panel prop isOpen is true"
+          }
+        ],
+        "minor": [
+          {
+            "author": "staylo8 <33881401+staylo8@users.noreply.github.com>",
+            "commit": "76aead93eeb29bac6f7a9d9e73893cfcfa0685fd",
+            "comment": "Add remeasure public method to ResizeGroup"
+          }
+        ]
+      }
+    },
     {
       "version": "5.32.0",
       "tag": "office-ui-fabric-react_v5.32.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index a16b4dc8a43bf..7807371884b66 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 13 Dec 2017 04:06:51 GMT and should not be manually modified.
+This log was last generated on Thu, 14 Dec 2017 11:23:17 GMT and should not be manually modified.
+
+## 5.33.0
+Thu, 14 Dec 2017 11:23:17 GMT
+
+### Minor changes
+
+- Add remeasure public method to ResizeGroup
+
+### Patches
+
+- ComboBox: Fix some issues with submitting values when freeform and autocomplete
+- Reversing the order of :focus and :active selectors for comboBox options.
+- Panel: Don't render Overlay unless Panel prop isOpen is true
 
 ## 5.32.0
 Wed, 13 Dec 2017 04:06:51 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index ff16ffbddbb34..53425c9ede295 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.32.0",
+  "version": "5.33.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 3eef7db9d269c562e45abae8a097a0c9b97cf9a2 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Thu, 14 Dec 2017 11:07:08 -0800
Subject: [PATCH 1152/1641] Link: Fix for pressed state (#3579)

* Fix for pressed state

* Added change file

* Refactor
---
 .../link-pressed_2017-12-14-18-24.json                | 11 +++++++++++
 .../src/components/Link/Link.scss                     |  3 ++-
 2 files changed, 13 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/link-pressed_2017-12-14-18-24.json

diff --git a/common/changes/office-ui-fabric-react/link-pressed_2017-12-14-18-24.json b/common/changes/office-ui-fabric-react/link-pressed_2017-12-14-18-24.json
new file mode 100644
index 0000000000000..0bad4de653fed
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/link-pressed_2017-12-14-18-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Link: Improved selectors to fix pressed state.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.scss b/packages/office-ui-fabric-react/src/components/Link/Link.scss
index b5e3fbb81b205..7f66f199ff4ac 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.scss
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.scss
@@ -11,7 +11,8 @@
 
 @mixin isEnabled {
   &:active,
-  &:hover {
+  &:hover,
+  &:active:hover {
     color: $ms-color-themeDarker;
   }
 

From 4be08698e006899f130ff0b7cfa5af512de335b1 Mon Sep 17 00:00:00 2001
From: Alex Bettadapur <alexbettadapur@gmail.com>
Date: Thu, 14 Dec 2017 11:49:32 -0800
Subject: [PATCH 1153/1641] [List] Only measure pages if getPageHeight was not
 provided (#3561)

* Only measure pages if getPageHeight was not provided

* Add back idle bump

* Add change file
---
 ...bet-dontMeasurePages_2017-12-12-21-55.json | 11 ++++++++
 .../src/components/List/List.tsx              | 28 +++++++++++--------
 2 files changed, 28 insertions(+), 11 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/alebet-dontMeasurePages_2017-12-12-21-55.json

diff --git a/common/changes/office-ui-fabric-react/alebet-dontMeasurePages_2017-12-12-21-55.json b/common/changes/office-ui-fabric-react/alebet-dontMeasurePages_2017-12-12-21-55.json
new file mode 100644
index 0000000000000..3cf24c6079266
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/alebet-dontMeasurePages_2017-12-12-21-55.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Only perform list measurements if we absolutely need to",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "alexbettadapur@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index a6b391d45052f..5766acc8c2360 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -573,20 +573,26 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     let oldListPages = this.state.pages;
 
     this.setState(newListState, () => {
-      // If measured version is invalid since we've updated the DOM
-      const heightsChanged = this._updatePageMeasurements(oldListPages as IPage[], newListState.pages as IPage[]);
-
-      // On first render, we should re-measure so that we don't get a visual glitch.
-      if (heightsChanged) {
-        this._materializedRect = null;
-        if (!this._hasCompletedFirstRender) {
-          this._hasCompletedFirstRender = true;
-          this._updatePages(props);
+      // If we weren't provided with the page height, measure the pages
+      if (!props.getPageHeight) {
+        // If measured version is invalid since we've updated the DOM
+        const heightsChanged = this._updatePageMeasurements(oldListPages as IPage[], newListState.pages as IPage[]);
+
+        // On first render, we should re-measure so that we don't get a visual glitch.
+        if (heightsChanged) {
+          this._materializedRect = null;
+          if (!this._hasCompletedFirstRender) {
+            this._hasCompletedFirstRender = true;
+            this._updatePages(props);
+          } else {
+            this._onAsyncScroll();
+          }
         } else {
-          this._onAsyncScroll();
+          // Enqueue an idle bump.
+          this._onAsyncIdle();
         }
       } else {
-        // Enqueue an idle bump.
+        // Enqueue an idle bump
         this._onAsyncIdle();
       }
     });

From 81423e190fb9c8fffde2321104acbff4b561fdeb Mon Sep 17 00:00:00 2001
From: amyngu <31973030+amyngu@users.noreply.github.com>
Date: Thu, 14 Dec 2017 13:41:35 -0800
Subject: [PATCH 1154/1641] Remove suggestion item button padding (#3557)

* changes for suggestion items

* run npm run change

* add callout width prop, actually add change file
---
 .../removeItemButtonPadding_2017-12-12-00-02.json     | 11 +++++++++++
 .../components/FloatingPicker/BaseFloatingPicker.scss | 10 ++++++++++
 .../components/FloatingPicker/BaseFloatingPicker.tsx  |  5 +++++
 .../FloatingPicker/BaseFloatingPicker.types.ts        |  5 +++++
 .../FloatingPicker/PeoplePicker/PeoplePicker.scss     |  1 +
 5 files changed, 32 insertions(+)
 create mode 100644 common/changes/@uifabric/experiments/removeItemButtonPadding_2017-12-12-00-02.json
 create mode 100644 packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.scss

diff --git a/common/changes/@uifabric/experiments/removeItemButtonPadding_2017-12-12-00-02.json b/common/changes/@uifabric/experiments/removeItemButtonPadding_2017-12-12-00-02.json
new file mode 100644
index 0000000000000..76a8fc533969a
--- /dev/null
+++ b/common/changes/@uifabric/experiments/removeItemButtonPadding_2017-12-12-00-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Remove padding and border for suggestions and add callout width prop in floating picker",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "amyngu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.scss b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.scss
new file mode 100644
index 0000000000000..6c3db2305ce86
--- /dev/null
+++ b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.scss
@@ -0,0 +1,10 @@
+.callout {
+  :global(.ms-Suggestions-itemButton) {
+    padding: 0px;
+    border: none;
+  }
+
+  :global(.ms-Suggestions) {
+    width: 300px;
+    }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
index c2e2a98e6a733..b44024a84fcb8 100644
--- a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
+++ b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
@@ -10,6 +10,9 @@ import { Callout, DirectionalHint } from 'office-ui-fabric-react/lib/Callout';
 import { ValidationState, Suggestions, ISuggestionsProps, SuggestionsController, IBasePickerSuggestionsProps, ISuggestionModel }
   from 'office-ui-fabric-react/lib/Pickers';
 import { IBaseFloatingPicker, IBaseFloatingPickerProps } from './BaseFloatingPicker.types';
+import * as stylesImport from './BaseFloatingPicker.scss';
+// tslint:disable-next-line:no-any
+const styles: any = stylesImport;
 
 export interface IBaseFloatingPickerState {
   queryString: string;
@@ -141,6 +144,7 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
     let TypedSuggestion = this.SuggestionOfProperType;
     return this.state.suggestionsVisible ? (
       <Callout
+        className={ styles.callout }
         isBeakVisible={ false }
         gapSpace={ 5 }
         target={ this.props.inputElement }
@@ -152,6 +156,7 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
               DirectionalHint.bottomLeftEdge
             )
         }
+        calloutWidth={ this.props.calloutWidth ? this.props.calloutWidth : 0 }
       >
         <TypedSuggestion
           onRenderSuggestion={ this.props.onRenderSuggestionsItem }
diff --git a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts
index 56078d5b86c4b..cd8b32707702c 100644
--- a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts
+++ b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts
@@ -95,4 +95,9 @@ export interface IBaseFloatingPickerProps<T> extends React.Props<any> {
    * A callback to get text from an item. Used to autofill text in the pickers.
    */
   getTextFromItem?: (item: T, currentValue?: string) => string;
+
+  /**
+   * Width for the suggestions callout
+   */
+  calloutWidth?: number;
 }
diff --git a/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePicker.scss b/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePicker.scss
index 635afea0d6e67..fa35d1dcf59d1 100644
--- a/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePicker.scss
+++ b/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePicker.scss
@@ -27,4 +27,5 @@
   width: 100%;
   justify-content: space-between;
   align-items: center;
+  padding: 7px 12px;
 }

From d2edbbc6c069f8cb8d2936a8d982aa50be0613e1 Mon Sep 17 00:00:00 2001
From: MaxLustig <maxslustig@gmail.com>
Date: Thu, 14 Dec 2017 14:47:42 -0800
Subject: [PATCH 1155/1641] Fixes bug with GroupedList losing focus sometimes
 when item gets removed from list (#3545)

* Fixes bug with GroupedList losing focus sometimes when item gets removed from list

* Rush change

* Don't return itemCount for _getPageSpecification

* Add comment

* Revert "Add comment"

This reverts commit 445d52c40ce620661cfe33ddd871da47be9f30fa.
---
 .../maxlus-arrowKeysPinning_2017-12-08-18-50.json   | 11 +++++++++++
 .../src/components/DetailsList/DetailsList.tsx      |  9 ++++++---
 .../src/components/GroupedList/GroupedList.tsx      | 13 +++++++++++++
 .../src/components/List/List.tsx                    |  7 +++++--
 .../src/components/List/List.types.ts               |  4 ++++
 5 files changed, 39 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/maxlus-arrowKeysPinning_2017-12-08-18-50.json

diff --git a/common/changes/office-ui-fabric-react/maxlus-arrowKeysPinning_2017-12-08-18-50.json b/common/changes/office-ui-fabric-react/maxlus-arrowKeysPinning_2017-12-08-18-50.json
new file mode 100644
index 0000000000000..876f851e0522f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/maxlus-arrowKeysPinning_2017-12-08-18-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixes bug with GroupedList losing focus sometimes when item gets removed from list",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "maxlus@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index cf1e372a0c5ba..ca6b5bf92a578 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -156,13 +156,16 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       // Item set has changed and previously-focused item is gone.
       // Set focus to item at index of previously-focused item if it is in range,
       // else set focus to the last item.
-      const item = this.state.focusedItemIndex < this.props.items.length
-        ? this.props.items[this.state.focusedItemIndex]
-        : this.props.items[this.props.items.length - 1];
+      const index = this.state.focusedItemIndex < this.props.items.length ?
+        this.state.focusedItemIndex :
+        this.props.items.length - 1;
+      const item = this.props.items[index];
       const itemKey = this._getItemKey(item, this.state.focusedItemIndex);
       const row = this._activeRows[itemKey];
       if (row) {
         this._setFocusToRow(row);
+      } else {
+        this._initialFocusedIndex = index;
       }
     }
 
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
index 8170e4b3f8d28..5d3718724f1ea 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import {
   BaseComponent,
+  IRectangle,
   autobind,
   assign,
   css
@@ -104,6 +105,7 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
               items={ groups }
               onRenderCell={ this._renderGroup }
               getItemCountForPage={ this._returnOne }
+              getPageSpecification= { this._getPageSpecification }
               usePageCache={ usePageCache }
               onShouldVirtualize={ onShouldVirtualize }
             />
@@ -278,6 +280,17 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
     }
   }
 
+  @autobind
+  private _getPageSpecification(itemIndex: number, visibleRect: IRectangle): {
+      key?: string;
+  } {
+    const groups = this.state.groups;
+    const pageGroup = groups && groups[itemIndex];
+    return {
+        key: pageGroup && pageGroup.name
+    };
+  }
+
   private _computeIsSomeGroupExpanded(groups: IGroup[] | undefined): boolean {
     return !!(groups && groups.some(group => group.children ? this._computeIsSomeGroupExpanded(group.children) : !group.isCollapsed));
   }
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index 5766acc8c2360..d695db1c71eea 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -730,6 +730,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       const pageSpecification = this._getPageSpecification(itemIndex, allowedRect);
       const pageHeight = pageSpecification.height;
       const pageData = pageSpecification.data;
+      const key = pageSpecification.key;
 
       itemsPerPage = pageSpecification.itemCount;
 
@@ -753,7 +754,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
         }
 
         let itemsInPage = Math.min(itemsPerPage, endIndex - itemIndex);
-        let newPage = this._createPage(undefined, items!.slice(itemIndex, itemIndex + itemsInPage), itemIndex, undefined, undefined, pageData);
+        let newPage = this._createPage(key, items!.slice(itemIndex, itemIndex + itemsInPage), itemIndex, undefined, undefined, pageData);
 
         newPage.top = pageTop;
         newPage.height = pageHeight;
@@ -806,6 +807,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     itemCount: number;
     height: number;
     data?: any;
+    key?: string;
   } {
     const {
       getPageSpecification
@@ -824,7 +826,8 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       return {
         itemCount: itemCount,
         height: height,
-        data: pageData.data
+        data: pageData.data,
+        key: pageData.key
       };
     } else {
       const itemCount = this._getItemCountForPage(itemIndex, visibleRect);
diff --git a/packages/office-ui-fabric-react/src/components/List/List.types.ts b/packages/office-ui-fabric-react/src/components/List/List.types.ts
index e3e85ff17ca0c..2bc6e4cdd3053 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.types.ts
+++ b/packages/office-ui-fabric-react/src/components/List/List.types.ts
@@ -156,4 +156,8 @@ export interface IPageSpecification {
    * Data to pass through to the page when rendering.
    */
   data?: any;
+  /**
+   * The key to use when creating the page.
+   */
+  key?: string;
 }

From ec5c2ebbc7cd864f895d9f4832ea88d9dae61869 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 15 Dec 2017 03:22:38 -0800
Subject: [PATCH 1156/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...oveItemButtonPadding_2017-12-12-00-02.json | 11 ---------
 ...bet-dontMeasurePages_2017-12-12-21-55.json | 11 ---------
 .../link-pressed_2017-12-14-18-24.json        | 11 ---------
 ...lus-arrowKeysPinning_2017-12-08-18-50.json | 11 ---------
 packages/experiments/CHANGELOG.json           | 19 +++++++++++++++
 packages/experiments/CHANGELOG.md             |  9 ++++++-
 packages/experiments/package.json             |  4 ++--
 .../office-ui-fabric-react/CHANGELOG.json     | 24 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 11 ++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 15 files changed, 69 insertions(+), 54 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/removeItemButtonPadding_2017-12-12-00-02.json
 delete mode 100644 common/changes/office-ui-fabric-react/alebet-dontMeasurePages_2017-12-12-21-55.json
 delete mode 100644 common/changes/office-ui-fabric-react/link-pressed_2017-12-14-18-24.json
 delete mode 100644 common/changes/office-ui-fabric-react/maxlus-arrowKeysPinning_2017-12-08-18-50.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index e5e1d3c11d736..bd107d4b070a8 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -45,7 +45,7 @@
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.4",
-    "office-ui-fabric-react": ">=5.33.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.33.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 227c46f1d60fa..b7598002156e5 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -24,7 +24,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "~3.3.0",
-    "office-ui-fabric-react": ">=5.33.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.33.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 1c1d62355318d..2ecf2242a49e7 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.33.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.33.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 9c5cb89e806ec..0a281735d6f54 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "@microsoft/load-themed-styles": "^1.5.1",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.33.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.33.1 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 28930792e9086..eb61b469bc011 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -30,7 +30,7 @@
   "dependencies": {
     "@uifabric/icons": ">=5.2.0 <6.0.0",
     "@uifabric/styling": ">=5.14.0 <6.0.0",
-    "office-ui-fabric-react": ">=5.33.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.33.1 <6.0.0",
     "react": "^15.6.1",
     "react-dom": "^15.6.1",
     "typescript": "2.4.2",
diff --git a/common/changes/@uifabric/experiments/removeItemButtonPadding_2017-12-12-00-02.json b/common/changes/@uifabric/experiments/removeItemButtonPadding_2017-12-12-00-02.json
deleted file mode 100644
index 76a8fc533969a..0000000000000
--- a/common/changes/@uifabric/experiments/removeItemButtonPadding_2017-12-12-00-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Remove padding and border for suggestions and add callout width prop in floating picker",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "amyngu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/alebet-dontMeasurePages_2017-12-12-21-55.json b/common/changes/office-ui-fabric-react/alebet-dontMeasurePages_2017-12-12-21-55.json
deleted file mode 100644
index 3cf24c6079266..0000000000000
--- a/common/changes/office-ui-fabric-react/alebet-dontMeasurePages_2017-12-12-21-55.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Only perform list measurements if we absolutely need to",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "alexbettadapur@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/link-pressed_2017-12-14-18-24.json b/common/changes/office-ui-fabric-react/link-pressed_2017-12-14-18-24.json
deleted file mode 100644
index 0bad4de653fed..0000000000000
--- a/common/changes/office-ui-fabric-react/link-pressed_2017-12-14-18-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Link: Improved selectors to fix pressed state.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/maxlus-arrowKeysPinning_2017-12-08-18-50.json b/common/changes/office-ui-fabric-react/maxlus-arrowKeysPinning_2017-12-08-18-50.json
deleted file mode 100644
index 876f851e0522f..0000000000000
--- a/common/changes/office-ui-fabric-react/maxlus-arrowKeysPinning_2017-12-08-18-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixes bug with GroupedList losing focus sometimes when item gets removed from list",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "maxlus@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 3feb1f99f55e7..72f43c8067fc6 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.10.1",
+      "tag": "@uifabric/experiments_v5.10.1",
+      "date": "Fri, 15 Dec 2017 11:22:38 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "amyngu <31973030+amyngu@users.noreply.github.com>",
+            "commit": "81423e190fb9c8fffde2321104acbff4b561fdeb",
+            "comment": "Remove padding and border for suggestions and add callout width prop in floating picker"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.33.0 <6.0.0` to `>=5.33.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.10.0",
       "tag": "@uifabric/experiments_v5.10.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 9fd966a2f33a6..cdaae4e001dc5 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Thu, 14 Dec 2017 11:23:17 GMT and should not be manually modified.
+This log was last generated on Fri, 15 Dec 2017 11:22:38 GMT and should not be manually modified.
+
+## 5.10.1
+Fri, 15 Dec 2017 11:22:38 GMT
+
+### Patches
+
+- Remove padding and border for suggestions and add callout width prop in floating picker
 
 ## 5.10.0
 Thu, 14 Dec 2017 11:23:17 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index d4fa7f022f524..6542225e3970b 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.10.0",
+  "version": "5.10.1",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -45,7 +45,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.2",
-    "office-ui-fabric-react": ">=5.33.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.33.1 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 1cdf5b4f18ce5..b226b176883f7 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.33.1",
+      "tag": "office-ui-fabric-react_v5.33.1",
+      "date": "Fri, 15 Dec 2017 11:22:38 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Alex Bettadapur <alexbettadapur@gmail.com>",
+            "commit": "4be08698e006899f130ff0b7cfa5af512de335b1",
+            "comment": "Only perform list measurements if we absolutely need to"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "3eef7db9d269c562e45abae8a097a0c9b97cf9a2",
+            "comment": "Link: Improved selectors to fix pressed state."
+          },
+          {
+            "author": "MaxLustig <maxslustig@gmail.com>",
+            "commit": "d2edbbc6c069f8cb8d2936a8d982aa50be0613e1",
+            "comment": "Fixes bug with GroupedList losing focus sometimes when item gets removed from list"
+          }
+        ]
+      }
+    },
     {
       "version": "5.33.0",
       "tag": "office-ui-fabric-react_v5.33.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 7807371884b66..1a5f13f96f678 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,15 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 14 Dec 2017 11:23:17 GMT and should not be manually modified.
+This log was last generated on Fri, 15 Dec 2017 11:22:38 GMT and should not be manually modified.
+
+## 5.33.1
+Fri, 15 Dec 2017 11:22:38 GMT
+
+### Patches
+
+- Only perform list measurements if we absolutely need to
+- Link: Improved selectors to fix pressed state.
+- Fixes bug with GroupedList losing focus sometimes when item gets removed from list
 
 ## 5.33.0
 Thu, 14 Dec 2017 11:23:17 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 53425c9ede295..92e6ff1abdebe 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.33.0",
+  "version": "5.33.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From d1a5ca76af4cef38433479e1c436ff0ce46338cc Mon Sep 17 00:00:00 2001
From: sugandhi-ms <34320350+sugandhi-ms@users.noreply.github.com>
Date: Fri, 15 Dec 2017 08:55:56 -0800
Subject: [PATCH 1157/1641] Bug Fix: Change dropdown role to combobox from menu
 to fix narrator reading the title twice (#3536)

* Change dropdown role to combobox from menu to fix narrator reading the title twice

* Use ara-autocomplete instead of aria-readonly for dropdown

* fix quotes, dropdown test
---
 .../src/components/Dropdown/Dropdown.tsx                    | 3 ++-
 .../Dropdown/__snapshots__/Dropdown.test.tsx.snap           | 6 ++++--
 2 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 9bb64d412f02a..f5af20a612059 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -158,7 +158,8 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
           id={ id }
           tabIndex={ disabled ? -1 : 0 }
           aria-expanded={ isOpen ? 'true' : 'false' }
-          role='menu'
+          role='combobox'
+          aria-autocomplete='none'
           aria-live={ disabled || isOpen ? 'off' : 'assertive' }
           aria-label={ ariaLabel }
           aria-describedby={ id + '-option' }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap
index 20ec6f93ee827..66b625309f7a9 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap
@@ -6,6 +6,7 @@ exports[`Dropdown multi-select Renders multiselect Dropdown correctly 1`] = `
 >
   <div
     aria-activedescendant={null}
+    aria-autocomplete="none"
     aria-describedby="Dropdown94-option"
     aria-disabled={undefined}
     aria-expanded="false"
@@ -19,7 +20,7 @@ exports[`Dropdown multi-select Renders multiselect Dropdown correctly 1`] = `
     onClick={[Function]}
     onKeyDown={[Function]}
     onKeyUp={[Function]}
-    role="menu"
+    role="combobox"
     tabIndex={0}
   >
     <span
@@ -55,6 +56,7 @@ exports[`Dropdown single-select Renders single-select Dropdown correctly 1`] = `
 >
   <div
     aria-activedescendant={null}
+    aria-autocomplete="none"
     aria-describedby="Dropdown0-option"
     aria-disabled={undefined}
     aria-expanded="false"
@@ -68,7 +70,7 @@ exports[`Dropdown single-select Renders single-select Dropdown correctly 1`] = `
     onClick={[Function]}
     onKeyDown={[Function]}
     onKeyUp={[Function]}
-    role="menu"
+    role="combobox"
     tabIndex={0}
   >
     <span

From e329c53575a45272da4d28dbc725804f7fac4062 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Fri, 15 Dec 2017 14:35:38 -0800
Subject: [PATCH 1158/1641] Website: UHF link color override for new button on
 GetStarted page (#3585)

* UHF link color override

* change file
---
 .../src/pages/GetStarted/GetStartedPage.module.scss   |  6 ++++++
 .../getstarted-link_2017-12-15-18-13.json             | 11 +++++++++++
 2 files changed, 17 insertions(+)
 create mode 100644 common/changes/@uifabric/fabric-website/getstarted-link_2017-12-15-18-13.json

diff --git a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
index b83ef65a8254e..ec7fb9aa58d2b 100644
--- a/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
+++ b/apps/fabric-website/src/pages/GetStarted/GetStartedPage.module.scss
@@ -142,6 +142,12 @@
 
   :global(.ms-Button) {
     margin: 12px 0;
+    // The color override is need because of the UHF
+    color: $ms-color-white;
+
+    @include high-contrast {
+      color: Window;
+    }
   }
 
   code {
diff --git a/common/changes/@uifabric/fabric-website/getstarted-link_2017-12-15-18-13.json b/common/changes/@uifabric/fabric-website/getstarted-link_2017-12-15-18-13.json
new file mode 100644
index 0000000000000..0f5630e4e00aa
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/getstarted-link_2017-12-15-18-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "GetStarted Page: More specific selectors for button with link to deal with UHF styles.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From 08e59c871894c8ff443d48dbe5b0dd3316eb4331 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 15 Dec 2017 17:01:04 -0800
Subject: [PATCH 1159/1641] React 16.2.0 update, Enzyme 3 update (#3550)

* React 16 initial commit. It builds but tests fail.

* More updates.

* Tests now pass in oufr (enzyme 3 required changes.)

* Experiments now passing.

* website now builds.

* Updates to index files to load react 16.

* Fixing all super() calls to pass through the correct props.

* more updates.

* Adding change files.

* Fixing styling.

* Fixing another constructor.

* updating rush.

* Updating shrinkwrap.

* More updates required after merging master.

* fixing todo app example.

* Fixes for the website, normalizing a number of dependencies in package.json files.

* hmm integrity mismatch?

* Ok... npm 5.6.0 has some "integrity" issues. reverting.

* vr-test fixes.

* Fixing website.

* test fix.

* Fixing props.

* fix

* Fixing missing prop-types dep.
---
 .vscode/launch.json                           |    6 +-
 apps/fabric-website/index.html                |    4 +-
 apps/fabric-website/package.json              |   26 +-
 .../fabric-website/src/components/App/App.tsx |    7 -
 .../components/DONavigation/DONavigation.tsx  |   11 +-
 .../src/pages/BlogPage/BlogPost.tsx           |    4 +-
 apps/fabric-website/src/root.tsx              |    2 +-
 apps/fabric-website/tsconfig.json             |    2 -
 apps/ssr-tests/package.json                   |   15 +-
 apps/ssr-tests/test/test.js                   |    2 +-
 apps/test-bundle-button/index.html            |    4 +-
 apps/test-bundle-button/package.json          |    6 +-
 apps/todo-app/index.html                      |    4 +-
 apps/todo-app/package.json                    |   17 +-
 apps/todo-app/src/index.tsx                   |    3 +
 apps/todo-app/tsconfig.json                   |    2 -
 apps/vr-tests/index.html                      |    4 +-
 apps/vr-tests/package.json                    |   24 +-
 apps/vr-tests/src/stories/Fonts.stories.tsx   |    4 +-
 apps/vr-tests/src/stories/Nav.stories.tsx     |   56 +-
 apps/vr-tests/src/utilities/index.ts          |    2 +-
 .../react-update_2017-12-10-21-48.json        |   11 +
 .../react-update_2017-12-10-21-48.json        |   11 +
 .../react-update_2017-12-10-21-48.json        |   11 +
 .../react-update_2017-12-10-21-48.json        |   11 +
 .../react-update_2017-12-10-21-48.json        |   11 +
 .../react-update_2017-12-10-21-48.json        |   11 +
 .../react-update_2017-12-10-21-48.json        |   11 +
 .../react-update_2017-12-10-21-48.json        |   11 +
 common/config/rush/npm-shrinkwrap.json        | 1506 ++++++++---------
 package.json                                  |    4 +-
 packages/example-app-base/package.json        |   22 +-
 packages/example-app-base/tsconfig.json       |    2 -
 packages/experiments/index.html               |    8 +-
 packages/experiments/package.json             |   34 +-
 packages/experiments/src/common/tests.ts      |   14 +-
 .../components/Coachmark/Coachmark.styles.ts  |   13 +-
 .../src/components/Coachmark/Coachmark.tsx    |   12 +-
 .../components/Coachmark/Coachmark.types.ts   |    2 +-
 .../examples/Coachmark.Basic.Example.tsx      |    4 +-
 .../ExtendedPeoplePicker.Basic.Example.tsx    |    6 +-
 .../FloatingPeoplePicker.Basic.Example.tsx    |    7 +-
 .../PositioningContainer.Basic.Example.tsx    |    7 +-
 .../Tile/examples/Tile.Document.Example.tsx   |    4 +-
 .../Tile/examples/Tile.Folder.Example.tsx     |    4 +-
 .../Tile/examples/Tile.Media.Example.tsx      |    4 +-
 .../examples/TilesList.Basic.Example.tsx      |    4 +-
 .../examples/TilesList.Document.Example.tsx   |   26 +-
 .../examples/TilesList.Media.Example.tsx      |    4 +-
 .../VirtualizedList.Basic.Example.tsx         |    4 +-
 .../VirtualizedList.Basic.Example2.tsx        |    4 +-
 .../examples/Signals.Basic.Example.tsx        |    4 +-
 packages/experiments/src/demo/index.tsx       |    2 +-
 .../utilities/scrolling/ScrollContainer.tsx   |    3 +-
 packages/file-type-icons/package.json         |   13 +-
 packages/icons/package.json                   |    2 +-
 .../jest-serializer-merge-styles/package.json |    2 +-
 packages/merge-styles/package.json            |    2 +-
 packages/office-ui-fabric-react/index.html    |   10 +-
 packages/office-ui-fabric-react/package.json  |   34 +-
 .../src/common/testUtilities.ts               |   19 +
 .../src/common/tests.ts                       |   14 +-
 .../examples/Breadcrumb.Basic.Example.tsx     |    4 +-
 .../examples/Breadcrumb.Static.Example.tsx    |    5 +-
 .../src/components/Button/ButtonPage.tsx      |    4 +-
 .../Button/examples/Button.Action.Example.tsx |    6 +-
 .../Button/examples/Button.Anchor.Example.tsx |    6 +-
 .../examples/Button.Compound.Example.tsx      |    6 +-
 .../Button/examples/Button.Icon.Example.tsx   |    6 +-
 .../examples/Button.Primary.Example.tsx       |    6 +-
 .../examples/Button.ScreenReader.Example.tsx  |    4 -
 .../Button/examples/Button.Split.Example.tsx  |   10 +-
 .../Button/examples/Button.Swap.Example.tsx   |    4 +-
 .../examples/Calendar.Button.Example.tsx      |    4 +-
 .../examples/Calendar.Inline.Example.tsx      |    4 +-
 .../examples/Callout.Basic.Example.tsx        |    6 +-
 .../examples/Callout.Cover.Example.tsx        |    6 +-
 .../examples/Callout.Directional.Example.tsx  |    7 +-
 .../examples/Callout.Nested.Example.tsx       |   14 +-
 .../examples/Checkbox.Basic.Example.tsx       |    4 +-
 .../Checkbox.ImplementationExamples.tsx       |    5 +-
 .../examples/ChoiceGroup.Basic.Example.tsx    |    6 +-
 .../examples/ChoiceGroup.Custom.Example.tsx   |    5 +-
 .../examples/ChoiceGroup.Image.Example.tsx    |    6 +-
 .../src/components/ComboBox/ComboBox.test.tsx |  106 +-
 .../examples/ComboBox.Basic.Example.tsx       |   48 +-
 .../ComboBox.CustomStyled.Example.tsx         |   70 +-
 .../ContextualMenu/ContextualMenu.test.tsx    |   11 +-
 .../ContextualMenu/ContextualMenu.tsx         |   12 +-
 .../examples/ContextualMenu.Basic.Example.tsx |    6 +-
 .../ContextualMenu.Checkmarks.Example.tsx     |  142 +-
 .../ContextualMenu.Directional.Example.tsx    |    4 +-
 .../examples/ContextualMenu.Icon.Example.tsx  |    6 +-
 .../ContextualMenu.ScrollBar.Example.tsx      |    8 +-
 .../src/components/DatePicker/DatePicker.tsx  |    2 +-
 .../examples/DatePicker.Basic.Example.tsx     |    6 +-
 .../examples/DatePicker.Bounded.Example.tsx   |    7 +-
 .../examples/DatePicker.Format.Example.tsx    |   30 +-
 .../examples/DatePicker.Input.Example.tsx     |    7 +-
 .../examples/DatePicker.Required.Example.tsx  |    6 +-
 .../DatePicker.WeekNumbers.Example.tsx        |    6 +-
 .../DetailsList/DetailsRowFields.tsx          |    2 +-
 .../examples/DetailsList.Advanced.Example.tsx |    6 +-
 .../examples/DetailsList.Basic.Example.tsx    |    9 +-
 .../examples/DetailsList.Compact.Example.tsx  |    9 +-
 ...DetailsList.CustomGroupHeaders.Example.tsx |    7 +-
 .../DetailsList.CustomRows.Example.tsx        |    7 +-
 .../examples/DetailsList.DragDrop.Example.tsx |    9 +-
 .../examples/DetailsList.Grouped.Example.tsx  |    8 +-
 .../DetailsList.NavigatingFocus.Example.tsx   |    2 +
 .../Dialog/examples/Dialog.Basic.Example.tsx  |    9 +-
 .../examples/Dialog.Blocking.Example.tsx      |    8 +-
 .../examples/Dialog.LargeHeader.Example.tsx   |    8 +-
 .../examples/Dropdown.Basic.Example.tsx       |   14 +-
 .../examples/Dropdown.Custom.Example.tsx      |    7 +-
 .../src/components/Fabric/Fabric.tsx          |    4 +-
 .../src/components/Facepile/Facepile.test.tsx |  330 ++--
 .../__snapshots__/Facepile.test.tsx.snap      |    2 +-
 .../examples/Facepile.AddFace.Example.tsx     |    7 +-
 .../examples/Facepile.Basic.Example.tsx       |    7 +-
 .../examples/Facepile.Overflow.Example.tsx    |    7 +-
 .../examples/FocusTrapZone.Nested.Example.tsx |    6 +-
 .../examples/FocusZone.List.Example.tsx       |    6 +-
 .../examples/GroupedList.Basic.Example.tsx    |    6 +-
 .../examples/GroupedList.Custom.Example.tsx   |    6 +-
 .../Layer/examples/Layer.Basic.Example.tsx    |   16 +-
 .../Layer/examples/Layer.Hosted.Example.tsx   |   10 +-
 .../src/components/List/ListPage.tsx          |    4 +-
 .../List/examples/List.Grid.Example.tsx       |    6 +-
 .../MarqueeSelection.Basic.Example.tsx        |    4 +-
 .../Modal/examples/Modal.Basic.Example.tsx    |    8 +-
 .../Overlay/examples/Overlay.Dark.Example.tsx |    8 +-
 .../examples/Overlay.Light.Example.tsx        |    8 +-
 .../Panel/examples/Panel.Custom.Example.tsx   |    8 +-
 .../examples/Panel.ExtraLarge.Example.tsx     |    8 +-
 .../Panel/examples/Panel.Footer.Example.tsx   |    8 +-
 .../Panel.HiddenOnDismiss.Example.tsx         |    8 +-
 .../Panel/examples/Panel.Large.Example.tsx    |   10 +-
 .../examples/Panel.LargeFixed.Example.tsx     |    8 +-
 .../examples/Panel.LightDismiss.Example.tsx   |    8 +-
 .../Panel.LightDismissCustom.Example.tsx      |    9 +-
 .../Panel/examples/Panel.Medium.Example.tsx   |    8 +-
 .../Panel/examples/Panel.NonModal.Example.tsx |    8 +-
 .../examples/Panel.SmallFluid.Example.tsx     |    8 +-
 .../examples/Panel.SmallLeft.Example.tsx      |    8 +-
 .../examples/Panel.SmallRight.Example.tsx     |    8 +-
 .../examples/Persona.Alternate.Example.tsx    |    8 +-
 .../examples/Persona.Basic.Example.tsx        |    8 +-
 .../examples/Persona.CustomRender.Example.tsx |    5 +-
 .../ProgressIndicator.Basic.Example.tsx       |    6 +-
 .../Rating/examples/Rating.Basic.Example.tsx  |   17 +-
 .../ScrollablePane.Default.Example.tsx        |    5 +-
 .../ScrollablePane.DetailsList.Example.tsx    |    9 +-
 .../Slider/examples/Slider.Basic.Example.tsx  |    8 +-
 .../SwatchColorPicker.test.tsx                |   66 +-
 .../examples/TeachingBubble.Basic.Example.tsx |    6 +-
 .../TeachingBubble.Condensed.Example.tsx      |    6 +-
 .../TeachingBubble.Illustration.Example.tsx   |    6 +-
 .../TeachingBubble.SmallHeadline.Example.tsx  |    6 +-
 ...eachingBubble.WideIllustration.Example.tsx |    6 +-
 .../TextField.CustomRender.Example.tsx        |    8 +-
 .../src/components/Theme/ThemePage.tsx        |   28 +-
 .../ThemeGenerator/ThemeGeneratorPage.tsx     |    6 +-
 .../src/components/Toggle/Toggle.test.tsx     |    2 -
 .../src/components/Toggle/Toggle.tsx          |    2 +-
 .../examples/PeoplePicker.Types.Example.tsx   |    4 +-
 .../examples/Picker.CustomResult.Example.tsx  |  254 +--
 .../examples/TagPicker.Basic.Example.tsx      |    4 +-
 .../src/utilities/decorators/BaseDecorator.ts |   10 +-
 .../decorators/withContainsFocus.tsx          |    8 +-
 .../decorators/withResponsiveMode.test.tsx    |    9 -
 .../decorators/withResponsiveMode.tsx         |    8 +-
 .../src/utilities/decorators/withViewport.tsx |    8 +-
 .../examples/Selection.Basic.Example.tsx      |    6 +-
 packages/styling/package.json                 |   13 +-
 packages/utilities/jest.config.js             |    8 +-
 packages/utilities/package.json               |   24 +-
 packages/utilities/src/BaseComponent.test.tsx |    2 +-
 packages/utilities/src/BaseComponent.ts       |    4 +-
 packages/utilities/src/FabricPerformance.ts   |    2 +
 packages/utilities/src/common/tests.ts        |   13 +
 rush.json                                     |    2 +-
 scripts/package.json                          |    8 +-
 scripts/tasks/jest-disable-warnings.js        |    4 -
 scripts/tasks/jest-mock.js                    |    2 +-
 scripts/tasks/jest-resources.js               |    2 +-
 scripts/tasks/jest-setup.js                   |   15 +
 187 files changed, 2042 insertions(+), 1931 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/react-update_2017-12-10-21-48.json
 create mode 100644 common/changes/@uifabric/experiments/react-update_2017-12-10-21-48.json
 create mode 100644 common/changes/@uifabric/fabric-website/react-update_2017-12-10-21-48.json
 create mode 100644 common/changes/@uifabric/jest-serializer-merge-styles/react-update_2017-12-10-21-48.json
 create mode 100644 common/changes/@uifabric/merge-styles/react-update_2017-12-10-21-48.json
 create mode 100644 common/changes/@uifabric/styling/react-update_2017-12-10-21-48.json
 create mode 100644 common/changes/@uifabric/utilities/react-update_2017-12-10-21-48.json
 create mode 100644 common/changes/office-ui-fabric-react/react-update_2017-12-10-21-48.json
 create mode 100644 packages/office-ui-fabric-react/src/common/testUtilities.ts
 create mode 100644 packages/utilities/src/common/tests.ts
 delete mode 100644 scripts/tasks/jest-disable-warnings.js
 create mode 100644 scripts/tasks/jest-setup.js

diff --git a/.vscode/launch.json b/.vscode/launch.json
index 921d117d2edef..d11601527a252 100644
--- a/.vscode/launch.json
+++ b/.vscode/launch.json
@@ -22,14 +22,14 @@
       "sourceMaps": true
     },
     {
-      "name": "Debug test in experiments",
+      "name": "Build fabric",
       "type": "node",
       "request": "launch",
       "program": "${workspaceRoot}/scripts/build.js",
-      "cwd": "${workspaceRoot}/packages/experiments",
+      "cwd": "${workspaceRoot}/packages/office-ui-fabric-react",
       "stopOnEntry": false,
       "args": [
-        "jest"
+        "ts"
       ],
       "runtimeExecutable": null,
       "runtimeArgs": [
diff --git a/apps/fabric-website/index.html b/apps/fabric-website/index.html
index 952a273f2da31..4a0ec3a93ccfa 100644
--- a/apps/fabric-website/index.html
+++ b/apps/fabric-website/index.html
@@ -45,8 +45,8 @@
     }
 
     var scripts = [
-      '//cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react.js',
-      '//cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react-dom.js',
+      '//cdnjs.cloudflare.com/ajax/libs/react/16.2.0/umd/react.production.min.js',
+      '//cdnjs.cloudflare.com/ajax/libs/react-dom/16.2.0/umd/react-dom.production.min.js',
       '/fabric-sitev5.js'
     ];
 
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index bd107d4b070a8..0690fe9fc7e3f 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -18,33 +18,27 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@types/chai": "3.4.35",
-    "@types/enzyme": "2.8.8",
-    "@types/es6-promise": "^0.0.32",
-    "@types/mocha": "2.2.39",
+    "@types/es6-promise": "0.0.32",
     "@types/node": "8.0.26",
-    "@types/prop-types": "15.5.1",
+    "@types/prop-types": "15.5.2",
     "@types/resemblejs": "~1.3.28",
-    "@types/sinon": "2.2.2",
-    "@types/react": "15.6.7",
-    "@types/react-dom": "15.5.6",
+    "@types/react": "16.0.25",
+    "@types/react-dom": "16.0.3",
     "@types/webpack-env": "1.13.0",
-    "enzyme": "^2.9.1",
     "es6-promise": "^4.1.0",
     "es6-weak-map": "^2.0.2",
-    "highlight.js": "^9.6.0",
+    "highlight.js": "^9.12.0",
     "office-ui-fabric-core": ">=9.0.0 <10.0.0",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
-    "react": "^15.6.1",
-    "react-dom": "^15.6.1",
-    "react-highlight": "0.9.0",
+    "react": "^16.2.0",
+    "react-dom": "^16.2.0",
+    "react-highlight": "^0.10.0",
     "write-file-webpack-plugin": "^4.1.0"
   },
   "dependencies": {
-    "@microsoft/load-themed-styles": "^1.7.2",
-    "@uifabric/icons": ">=5.2.0 <6.0.0",
+    "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
-    "json-loader": "^0.5.4",
+    "json-loader": "^0.5.7",
     "office-ui-fabric-react": ">=5.33.1 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/apps/fabric-website/src/components/App/App.tsx b/apps/fabric-website/src/components/App/App.tsx
index 3ac9e058f9880..cdf7eb1b571d7 100644
--- a/apps/fabric-website/src/components/App/App.tsx
+++ b/apps/fabric-website/src/components/App/App.tsx
@@ -25,13 +25,6 @@ export class App extends React.Component<IAppProps, any> {
   public render() {
     let { isNavOpen } = this.state;
 
-    let toggleIcon;
-    if (isNavOpen) {
-      toggleIcon = <i className='ms-Icon ms-Icon--ChromeClose' />;
-    } else {
-      toggleIcon = <i className='ms-Icon ms-Icon--GlobalNavButton' />;
-    }
-
     return (
       <Fabric
         className={ css(
diff --git a/apps/fabric-website/src/components/DONavigation/DONavigation.tsx b/apps/fabric-website/src/components/DONavigation/DONavigation.tsx
index 6a06c7c8cb769..509c060ff1885 100644
--- a/apps/fabric-website/src/components/DONavigation/DONavigation.tsx
+++ b/apps/fabric-website/src/components/DONavigation/DONavigation.tsx
@@ -11,7 +11,6 @@ export interface IDONavigationState {
 }
 
 export class DONavigation extends React.Component<IDONavigationProps, IDONavigationState> {
-  private _links = [];
   private _containers = [];
   private HEADER_CLASS = '.od-Header';
   private LINKS_CLASS = '.od-Navigation-link';
@@ -39,7 +38,6 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
 
     this.headerel = document.querySelector(this.HEADER_CLASS);
     // Find navigation buttons
-    this._links = this.headerel.querySelectorAll(this.LINKS_CLASS);
     this._containers = this.headerel.querySelectorAll(this.CONTAINER_CLASS);
 
     // Settup Hamburger button
@@ -349,11 +347,12 @@ export class DONavigation extends React.Component<IDONavigationProps, IDONavigat
 
   private _findAncestor(el, cls) {
     let newCLS = cls.replace('.', '');
-    let that;
     let newEL = el;
-    while ((newEL = newEL.parentElement) && !newEL.classList.contains(newCLS)) {
-      that = this;
-    }
+
+    do {
+      newEL = newEL.parentElement;
+    } while (!newEL.classList.contains(newCLS));
+
     return newEL;
   }
 }
\ No newline at end of file
diff --git a/apps/fabric-website/src/pages/BlogPage/BlogPost.tsx b/apps/fabric-website/src/pages/BlogPage/BlogPost.tsx
index f8b0496c0a895..9e93ead4f9383 100644
--- a/apps/fabric-website/src/pages/BlogPage/BlogPost.tsx
+++ b/apps/fabric-website/src/pages/BlogPage/BlogPost.tsx
@@ -6,8 +6,8 @@ const blogData = require('../../data/blog-posts.json');
 export class BlogPost extends React.Component<{}, {}> {
   private _postId: string;
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     this._postId = this._getParameterByName('id');
   }
 
diff --git a/apps/fabric-website/src/root.tsx b/apps/fabric-website/src/root.tsx
index d19f207b78c55..ed574ac555f43 100644
--- a/apps/fabric-website/src/root.tsx
+++ b/apps/fabric-website/src/root.tsx
@@ -11,7 +11,7 @@ import { setBaseUrl } from 'office-ui-fabric-react/lib/Utilities';
 import { HomePage } from './pages/HomePage/HomePage';
 import WindowWidthUtility from './utilities/WindowWidthUtility';
 import './styles/styles.scss';
-import { initializeIcons } from '@uifabric/icons/lib/index';
+import { initializeIcons } from 'office-ui-fabric-react/lib/Icons';
 const corePackageData = require('../node_modules/office-ui-fabric-core/package.json');
 const corePackageVersion: string = corePackageData && corePackageData.version || '9.2.0';
 
diff --git a/apps/fabric-website/tsconfig.json b/apps/fabric-website/tsconfig.json
index 8fd21a0b2c8a7..c0eebb0fd7e24 100644
--- a/apps/fabric-website/tsconfig.json
+++ b/apps/fabric-website/tsconfig.json
@@ -13,8 +13,6 @@
     "moduleResolution": "node",
     "preserveConstEnums": true,
     "types": [
-      "chai",
-      "mocha",
       "node",
       "webpack-env"
     ],
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index b7598002156e5..ca5af65f9c667 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -16,19 +16,16 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@microsoft/load-themed-styles": "^1.5.1",
-    "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "@types/chai": "3.4.35",
-    "@types/enzyme": "2.8.8",
-    "@types/es6-promise": "^0.0.32",
+    "@microsoft/load-themed-styles": "^1.7.13",
+    "@types/es6-promise": "0.0.32",
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
-    "mocha": "~3.3.0",
+    "mocha": "^3.3.0",
     "office-ui-fabric-react": ">=5.33.1 <6.0.0",
     "raw-loader": "^0.5.1",
-    "react": "^15.6.1",
-    "react-dom": "^15.6.1",
-    "webpack": "^3.5.5"
+    "react": "^16.2.0",
+    "react-dom": "^16.2.0",
+    "webpack": "^3.7.1"
   },
   "dependencies": {
     "es6-promise": "^4.1.0",
diff --git a/apps/ssr-tests/test/test.js b/apps/ssr-tests/test/test.js
index 5d62dbe0caf45..5a876a4a0931a 100644
--- a/apps/ssr-tests/test/test.js
+++ b/apps/ssr-tests/test/test.js
@@ -1,6 +1,6 @@
 'use strict';
 
-import { initializeIcons } from '@uifabric/icons/lib/index';
+import { initializeIcons } from 'office-ui-fabric-react/lib/Icons';
 
 initializeIcons('dist/');
 
diff --git a/apps/test-bundle-button/index.html b/apps/test-bundle-button/index.html
index ac8967e5aea4e..1c5cb1fc4a2a5 100644
--- a/apps/test-bundle-button/index.html
+++ b/apps/test-bundle-button/index.html
@@ -7,8 +7,8 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" user-scalable="no" />
 
   <title>Button example</title>
-  <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/react/15.4.0/react.min.js"></script>
-  <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/react/15.4.0/react-dom.min.js"></script>
+  <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/react/16.2.0/umd/react.development.js"></script>
+  <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/react-dom/16.2.0/umd/react-dom.development.js"></script>
 
 </head>
 
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 2ecf2242a49e7..1a1c8bab97027 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -16,10 +16,10 @@
     "start": "node ../../scripts/start.js"
   },
   "devDependencies": {
-    "@types/react": "15.6.7",
-    "@types/react-dom": "15.5.6",
+    "@types/react": "16.0.25",
+    "@types/react-dom": "16.0.3",
     "@types/webpack-env": "1.13.0",
-    "@types/prop-types": "15.5.1",
+    "@types/prop-types": "15.5.2",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
diff --git a/apps/todo-app/index.html b/apps/todo-app/index.html
index 5fd2c3c069444..3932e81f74413 100644
--- a/apps/todo-app/index.html
+++ b/apps/todo-app/index.html
@@ -7,8 +7,8 @@
   <meta name="viewport" content="width=device-width, initial-scale=1" />
 
   <title>Todo App</title>
-  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react.min.js"></script>
-  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react-dom.min.js"></script>
+  <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/react/16.2.0/umd/react.production.min.js"></script>
+  <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/react-dom/16.2.0/umd/react-dom.production.min.js"></script>
 </head>
 
 <body>
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 0a281735d6f54..d3b1d5cb81c89 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -9,23 +9,20 @@
     "start": "node ../../scripts/start.js"
   },
   "devDependencies": {
-    "@types/chai": "3.4.35",
-    "@types/enzyme": "2.8.8",
-    "@types/es6-promise": "^0.0.32",
-    "@types/mocha": "2.2.39",
-    "@types/react": "15.6.7",
-    "@types/react-dom": "15.5.6",
+    "@types/es6-promise": "0.0.32",
+    "@types/react": "16.0.25",
+    "@types/react-dom": "16.0.3",
     "@types/webpack-env": "1.13.0",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@microsoft/load-themed-styles": "^1.5.1",
+    "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
     "office-ui-fabric-react": ">=5.33.1 <6.0.0",
-    "react": "^15.6.1",
-    "react-dom": "^15.6.1",
-    "typescript": "2.4.2",
+    "react": "^16.2.0",
+    "react-dom": "^16.2.0",
+    "typescript": "2.6.2",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/src/index.tsx b/apps/todo-app/src/index.tsx
index 370e3884de410..a78b7b7319c98 100644
--- a/apps/todo-app/src/index.tsx
+++ b/apps/todo-app/src/index.tsx
@@ -2,6 +2,7 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 
 import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
+import { initializeIcons } from 'office-ui-fabric-react/lib/Icons';
 import Todo from './components/Todo';
 import DataProvider from './DataProvider';
 
@@ -9,6 +10,8 @@ let _rootDiv: HTMLElement;
 let _dataProvider = new DataProvider();
 
 function start(): void {
+  initializeIcons();
+
   if (!_rootDiv) {
     _rootDiv = document.createElement('div');
     document.body.appendChild(_rootDiv);
diff --git a/apps/todo-app/tsconfig.json b/apps/todo-app/tsconfig.json
index 8d55f607593ba..e0cc58a3f09e3 100644
--- a/apps/todo-app/tsconfig.json
+++ b/apps/todo-app/tsconfig.json
@@ -11,8 +11,6 @@
     "moduleResolution": "node",
     "preserveConstEnums": true,
     "types": [
-      "chai",
-      "mocha",
       "webpack-env"
     ]
   },
diff --git a/apps/vr-tests/index.html b/apps/vr-tests/index.html
index 5fd2c3c069444..3932e81f74413 100644
--- a/apps/vr-tests/index.html
+++ b/apps/vr-tests/index.html
@@ -7,8 +7,8 @@
   <meta name="viewport" content="width=device-width, initial-scale=1" />
 
   <title>Todo App</title>
-  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react.min.js"></script>
-  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react-dom.min.js"></script>
+  <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/react/16.2.0/umd/react.production.min.js"></script>
+  <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/react-dom/16.2.0/umd/react-dom.production.min.js"></script>
 </head>
 
 <body>
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index eb61b469bc011..27d84dfd1a634 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -13,14 +13,14 @@
   "devDependencies": {
     "@storybook/addon-options": "=3.2.3",
     "@storybook/react": "^3.2.3",
-    "@types/react": "15.6.7",
-    "@types/react-dom": "15.5.6",
-    "@types/storybook__react": "=3.0.5",
-    "css-loader": "=0.27.3",
-    "file-loader": "=0.11.1",
-    "postcss-loader": "=1.3.3",
-    "raw-loader": "=0.5.1",
-    "style-loader": "=0.16.1",
+    "@types/react": "16.0.25",
+    "@types/react-dom": "16.0.3",
+    "@types/storybook__react": "3.0.5",
+    "css-loader": "^0.28.7",
+    "file-loader": "^0.11.1",
+    "postcss-loader": "^2.0.9",
+    "raw-loader": "^0.5.1",
+    "style-loader": "^0.19.0",
     "awesome-typescript-loader": "^3.2.3",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
     "screener-storybook": "^0.9.2",
@@ -28,12 +28,10 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "@uifabric/icons": ">=5.2.0 <6.0.0",
-    "@uifabric/styling": ">=5.14.0 <6.0.0",
     "office-ui-fabric-react": ">=5.33.1 <6.0.0",
-    "react": "^15.6.1",
-    "react-dom": "^15.6.1",
-    "typescript": "2.4.2",
+    "react": "^16.2.0",
+    "react-dom": "^16.2.0",
+    "typescript": "2.6.2",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Fonts.stories.tsx b/apps/vr-tests/src/stories/Fonts.stories.tsx
index 8c518eaaa914f..0a5b754f7bce8 100644
--- a/apps/vr-tests/src/stories/Fonts.stories.tsx
+++ b/apps/vr-tests/src/stories/Fonts.stories.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 import Screener, { Steps } from 'screener-storybook/src/screener';
 import { storiesOf } from '@storybook/react';
 import { FabricDecorator } from '../utilities';
-import { createFontStyles } from '@uifabric/styling';
+import { createFontStyles } from 'office-ui-fabric-react/lib/Styling';
 
 const RepresentativeText = (props: { style: React.CSSProperties }) => (
   <div style={ props.style }>
@@ -73,4 +73,4 @@ storiesOf('Fonts', module)
   ))
   .add('West European', () => (
     <RepresentativeText style={ createFontStyles('en').medium as React.CSSProperties } />
-  ))
\ No newline at end of file
+  ));
diff --git a/apps/vr-tests/src/stories/Nav.stories.tsx b/apps/vr-tests/src/stories/Nav.stories.tsx
index 6345c82624a7f..6511f701be8ed 100644
--- a/apps/vr-tests/src/stories/Nav.stories.tsx
+++ b/apps/vr-tests/src/stories/Nav.stories.tsx
@@ -3,8 +3,8 @@ import * as React from 'react';
 import Screener, { Steps } from 'screener-storybook/src/screener';
 import { storiesOf } from '@storybook/react';
 import { FabricDecorator } from '../utilities';
-import { Nav } from 'office-ui-fabric-react';
-import { IconNames } from '@uifabric/icons';
+import { Nav } from 'office-ui-fabric-react/lib/Nav';
+import { IconNames } from 'office-ui-fabric-react/lib/Icons';
 
 // tslint:disable:max-line-length
 storiesOf('Nav', module)
@@ -32,34 +32,34 @@ storiesOf('Nav', module)
           [
             {
               links:
-              [
-                {
-                  name: 'Home',
-                  url: 'http://example.com',
-                  links: [{
-                    name: 'Activity',
-                    icon: IconNames.Upload,
-                    url: 'http://msn.com',
-                    key: 'key1'
+                [
+                  {
+                    name: 'Home',
+                    url: 'http://example.com',
+                    links: [{
+                      name: 'Activity',
+                      icon: IconNames.Upload,
+                      url: 'http://msn.com',
+                      key: 'key1'
+                    },
+                    {
+                      name: 'News',
+                      url: 'http://msn.com',
+                      key: 'key2'
+                    }],
+                    isExpanded: true
                   },
+                  { name: 'Documents', icon: IconNames.Accept, url: 'http://example.com', key: 'key3' },
+                  { name: 'Pages', url: 'http://msn.com', key: 'key4' },
+                  { name: 'Notebook', url: 'http://msn.com', key: 'key5' },
+                  { name: 'Long Name Test for elipse', url: 'http://msn.com', key: 'key6' },
                   {
-                    name: 'News',
-                    url: 'http://msn.com',
-                    key: 'key2'
-                  }],
-                  isExpanded: true
-                },
-                { name: 'Documents', icon: IconNames.Accept, url: 'http://example.com', key: 'key3' },
-                { name: 'Pages', url: 'http://msn.com', key: 'key4' },
-                { name: 'Notebook', url: 'http://msn.com', key: 'key5' },
-                { name: 'Long Name Test for elipse', url: 'http://msn.com', key: 'key6' },
-                {
-                  name: 'Edit',
-                  url: 'http://cnn.com',
-                  icon: IconNames.Edit,
-                  key: 'key8'
-                }
-              ]
+                    name: 'Edit',
+                    url: 'http://cnn.com',
+                    icon: IconNames.Edit,
+                    key: 'key8'
+                  }
+                ]
             }
           ]
         }
diff --git a/apps/vr-tests/src/utilities/index.ts b/apps/vr-tests/src/utilities/index.ts
index 53e88b39b549d..134d785ba92ed 100644
--- a/apps/vr-tests/src/utilities/index.ts
+++ b/apps/vr-tests/src/utilities/index.ts
@@ -1,4 +1,4 @@
-import { initializeIcons } from '@uifabric/icons';
+import { initializeIcons } from 'office-ui-fabric-react/lib/Icons';
 
 initializeIcons();
 
diff --git a/common/changes/@uifabric/example-app-base/react-update_2017-12-10-21-48.json b/common/changes/@uifabric/example-app-base/react-update_2017-12-10-21-48.json
new file mode 100644
index 0000000000000..21590ae4144cf
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/react-update_2017-12-10-21-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/react-update_2017-12-10-21-48.json b/common/changes/@uifabric/experiments/react-update_2017-12-10-21-48.json
new file mode 100644
index 0000000000000..22f222e997fdb
--- /dev/null
+++ b/common/changes/@uifabric/experiments/react-update_2017-12-10-21-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/react-update_2017-12-10-21-48.json b/common/changes/@uifabric/fabric-website/react-update_2017-12-10-21-48.json
new file mode 100644
index 0000000000000..ae46c8e96a14e
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/react-update_2017-12-10-21-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/jest-serializer-merge-styles/react-update_2017-12-10-21-48.json b/common/changes/@uifabric/jest-serializer-merge-styles/react-update_2017-12-10-21-48.json
new file mode 100644
index 0000000000000..ed131fe62cb9b
--- /dev/null
+++ b/common/changes/@uifabric/jest-serializer-merge-styles/react-update_2017-12-10-21-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/jest-serializer-merge-styles",
+      "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/jest-serializer-merge-styles",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/react-update_2017-12-10-21-48.json b/common/changes/@uifabric/merge-styles/react-update_2017-12-10-21-48.json
new file mode 100644
index 0000000000000..77a98d97644cf
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/react-update_2017-12-10-21-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/react-update_2017-12-10-21-48.json b/common/changes/@uifabric/styling/react-update_2017-12-10-21-48.json
new file mode 100644
index 0000000000000..cbdd65bdfca6e
--- /dev/null
+++ b/common/changes/@uifabric/styling/react-update_2017-12-10-21-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/react-update_2017-12-10-21-48.json b/common/changes/@uifabric/utilities/react-update_2017-12-10-21-48.json
new file mode 100644
index 0000000000000..4508ef62e3411
--- /dev/null
+++ b/common/changes/@uifabric/utilities/react-update_2017-12-10-21-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/react-update_2017-12-10-21-48.json b/common/changes/office-ui-fabric-react/react-update_2017-12-10-21-48.json
new file mode 100644
index 0000000000000..c1f3f4ee53fa2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/react-update_2017-12-10-21-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme happy.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 0afdcd099a9d7..64b0b8e179d3b 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -10,12 +10,12 @@
       "integrity": "sha1-6pn2EhtKjwZbTHH4VZXbJxRJiAc="
     },
     "@microsoft/api-extractor": {
-      "version": "4.3.1",
-      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-4.3.1.tgz",
-      "integrity": "sha1-HbrVWbuiutL2df2cPofoVs8b+gI=",
+      "version": "4.3.4",
+      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-4.3.4.tgz",
+      "integrity": "sha1-YLgRx/KPIVPpM2qS26p06RWiA/Q=",
       "requires": {
-        "@microsoft/node-core-library": "0.3.18",
-        "@microsoft/ts-command-line": "2.2.6",
+        "@microsoft/node-core-library": "0.3.21",
+        "@microsoft/ts-command-line": "2.2.9",
         "@types/fs-extra": "0.0.37",
         "@types/node": "6.0.88",
         "@types/z-schema": "3.16.31",
@@ -31,27 +31,32 @@
           "version": "6.0.88",
           "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.88.tgz",
           "integrity": "sha512-bYDPZTX0/s1aihdjLuAgogUAT5M+TpoWChEMea2p0yOcfn5bu3k6cJb9cp6nw268XeSNIGGr+4+/8V5K6BGzLQ=="
+        },
+        "typescript": {
+          "version": "2.4.2",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.4.2.tgz",
+          "integrity": "sha1-+DlfhdRZJ2BnyYiqQYN6j4KHCEQ="
         }
       }
     },
     "@microsoft/load-themed-styles": {
-      "version": "1.7.11",
-      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.11.tgz",
-      "integrity": "sha1-YXKmzjlXpMXG5mGNxhT5GOWc7D8="
+      "version": "1.7.14",
+      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.14.tgz",
+      "integrity": "sha1-94a/GDCgjx4973fPHgd7WbX1K0A="
     },
     "@microsoft/loader-load-themed-styles": {
-      "version": "1.6.6",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.6.6.tgz",
-      "integrity": "sha1-zZm/Ol89RvGMe/eMr6uRmMMOL90=",
+      "version": "1.6.9",
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.6.9.tgz",
+      "integrity": "sha1-y/ydLav1P8tnNcGogtMLURPtiWg=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.11",
+        "@microsoft/load-themed-styles": "1.7.14",
         "loader-utils": "1.1.0"
       }
     },
     "@microsoft/node-core-library": {
-      "version": "0.3.18",
-      "resolved": "https://registry.npmjs.org/@microsoft/node-core-library/-/node-core-library-0.3.18.tgz",
-      "integrity": "sha1-7PxLJIqBT4ty7u4ondUuidMblMc=",
+      "version": "0.3.21",
+      "resolved": "https://registry.npmjs.org/@microsoft/node-core-library/-/node-core-library-0.3.21.tgz",
+      "integrity": "sha1-jBt2IAW65+7DK3jw0LksdCAgTXI=",
       "requires": {
         "@types/fs-extra": "0.0.37",
         "@types/node": "6.0.88",
@@ -69,9 +74,9 @@
       }
     },
     "@microsoft/ts-command-line": {
-      "version": "2.2.6",
-      "resolved": "https://registry.npmjs.org/@microsoft/ts-command-line/-/ts-command-line-2.2.6.tgz",
-      "integrity": "sha1-LgCJ56xnFz/PKQJplAwwao+gBGA=",
+      "version": "2.2.9",
+      "resolved": "https://registry.npmjs.org/@microsoft/ts-command-line/-/ts-command-line-2.2.9.tgz",
+      "integrity": "sha1-lKiqVYrXQFqBp10oARbspgw9Tuo=",
       "requires": {
         "@types/argparse": "1.0.33",
         "@types/node": "6.0.88",
@@ -88,13 +93,13 @@
     },
     "@rush-temp/build": {
       "version": "file:projects/build.tgz",
-      "integrity": "sha1-XpiTxVfrJ8tQX62qbk43XY/vpUY=",
+      "integrity": "sha1-w/7BKfX9iJm7TQC9hTv5Dzugs7o=",
       "requires": {
-        "@microsoft/api-extractor": "4.3.1",
-        "@microsoft/load-themed-styles": "1.7.11",
-        "@microsoft/loader-load-themed-styles": "1.6.6",
-        "autoprefixer": "7.1.6",
-        "awesome-typescript-loader": "3.4.0",
+        "@microsoft/api-extractor": "4.3.4",
+        "@microsoft/load-themed-styles": "1.7.14",
+        "@microsoft/loader-load-themed-styles": "1.6.9",
+        "autoprefixer": "7.2.3",
+        "awesome-typescript-loader": "3.4.1",
         "bundlesize": "0.15.3",
         "chalk": "2.3.0",
         "command-line-args": "4.0.7",
@@ -111,507 +116,295 @@
         "postcss": "6.0.14",
         "postcss-loader": "2.0.9",
         "postcss-modules": "0.8.0",
+        "raf": "3.4.0",
         "raw-loader": "0.5.1",
         "sass-loader": "6.0.6",
-        "sinon": "4.1.2",
         "source-map-loader": "0.2.3",
-        "style-loader": "0.18.2",
-        "ts-jest": "21.2.3",
+        "style-loader": "0.19.1",
+        "ts-jest": "21.2.4",
         "tslint": "5.8.0",
         "tslint-microsoft-contrib": "5.0.1",
         "typescript": "2.6.2",
         "uglifyjs-webpack-plugin": "0.4.6",
-        "webpack": "3.8.1",
+        "webpack": "3.10.0",
         "webpack-bundle-analyzer": "2.9.1",
-        "webpack-dev-server": "2.9.5",
+        "webpack-dev-server": "2.9.7",
         "webpack-notifier": "1.5.0",
         "yargs": "6.6.0"
-      },
-      "dependencies": {
-        "typescript": {
-          "version": "2.6.2",
-          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.6.2.tgz",
-          "integrity": "sha1-PFtv1/beCRQmkCfwPAlGdY92c6Q="
-        }
       }
     },
     "@rush-temp/example-app-base": {
       "version": "file:projects/example-app-base.tgz",
-      "integrity": "sha1-9PS/QcIwhN7giKPF5D43WMy4IQM=",
+      "integrity": "sha1-yv/gcJU5bSKdZDTXrlZiwqyhgOc=",
       "requires": {
-        "@types/chai": "3.4.35",
-        "@types/enzyme": "2.8.8",
         "@types/es6-promise": "0.0.32",
-        "@types/highlight.js": "9.1.9",
-        "@types/mocha": "2.2.39",
-        "@types/react": "15.6.7",
-        "@types/react-addons-test-utils": "0.14.18",
-        "@types/react-dom": "15.5.6",
+        "@types/highlight.js": "9.12.2",
+        "@types/react": "16.0.25",
+        "@types/react-dom": "16.0.3",
         "@types/webpack-env": "1.13.0",
-        "enzyme": "2.9.1",
         "es6-map": "0.1.5",
         "es6-promise": "4.1.1",
         "es6-weak-map": "2.0.2",
         "highlight.js": "9.12.0",
-        "office-ui-fabric-react": "5.27.0",
-        "react": "15.6.2",
-        "react-addons-test-utils": "15.6.2",
-        "react-dom": "15.6.2",
-        "tslib": "1.8.0"
+        "office-ui-fabric-react": "5.33.1",
+        "react": "16.2.0",
+        "react-dom": "16.2.0",
+        "tslib": "1.8.1"
       }
     },
     "@rush-temp/experiments": {
       "version": "file:projects/experiments.tgz",
-      "integrity": "sha1-I2dqZ7zbQsTon4Tsgu0yOgx4oWw=",
+      "integrity": "sha1-YEUlDKp26ZYNmnnZ98ZjxkfyfcU=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.11",
-        "@types/enzyme": "2.8.8",
+        "@microsoft/load-themed-styles": "1.7.14",
+        "@types/enzyme": "3.1.5",
+        "@types/enzyme-adapter-react-16": "1.0.1",
         "@types/es6-promise": "0.0.32",
         "@types/jest": "21.1.8",
-        "@types/prop-types": "15.5.1",
-        "@types/react": "15.6.7",
+        "@types/prop-types": "15.5.2",
+        "@types/react": "16.0.25",
         "@types/react-addons-test-utils": "0.14.18",
-        "@types/react-dom": "15.5.6",
-        "@types/react-test-renderer": "15.5.5",
+        "@types/react-dom": "16.0.3",
+        "@types/react-test-renderer": "16.0.0",
         "@types/resemblejs": "1.3.28",
         "@types/sinon": "2.2.2",
         "@types/webpack-env": "1.13.0",
-        "enzyme": "2.9.1",
+        "enzyme": "3.2.0",
+        "enzyme-adapter-react-16": "1.1.0",
         "es6-weak-map": "2.0.2",
-        "react": "15.6.2",
-        "react-addons-test-utils": "15.6.2",
-        "react-dom": "15.6.2",
-        "react-highlight": "0.9.0",
-        "react-test-renderer": "15.6.2",
-        "sinon": "2.4.1",
-        "tslib": "1.8.0"
-      },
-      "dependencies": {
-        "lolex": {
-          "version": "1.6.0",
-          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
-          "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
-        },
-        "sinon": {
-          "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/sinon/-/sinon-2.4.1.tgz",
-          "integrity": "sha512-vFTrO9Wt0ECffDYIPSP/E5bBugt0UjcBQOfQUMh66xzkyPEnhl/vM2LRZi2ajuTdkH07sA6DzrM6KvdvGIH8xw==",
-          "requires": {
-            "diff": "3.4.0",
-            "formatio": "1.2.0",
-            "lolex": "1.6.0",
-            "native-promise-only": "0.8.1",
-            "path-to-regexp": "1.7.0",
-            "samsam": "1.3.0",
-            "text-encoding": "0.6.4",
-            "type-detect": "4.0.5"
-          }
-        }
+        "prop-types": "15.6.0",
+        "react": "16.2.0",
+        "react-dom": "16.2.0",
+        "react-highlight": "0.10.0",
+        "react-test-renderer": "16.2.0",
+        "sinon": "4.1.3",
+        "tslib": "1.8.1"
       }
     },
     "@rush-temp/fabric-website": {
       "version": "file:projects/fabric-website.tgz",
-      "integrity": "sha1-rY4EuxJTdhsO+of/Zmqzl8S2/NU=",
+      "integrity": "sha1-gYsXsKWTmM+W9uqrQeIiMpcSjIY=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.11",
-        "@types/chai": "3.4.35",
-        "@types/enzyme": "2.8.8",
+        "@microsoft/load-themed-styles": "1.7.14",
         "@types/es6-promise": "0.0.32",
-        "@types/mocha": "2.2.39",
         "@types/node": "8.0.26",
-        "@types/prop-types": "15.5.1",
-        "@types/react": "15.6.7",
-        "@types/react-dom": "15.5.6",
+        "@types/prop-types": "15.5.2",
+        "@types/react": "16.0.25",
+        "@types/react-dom": "16.0.3",
         "@types/resemblejs": "1.3.28",
-        "@types/sinon": "2.2.2",
         "@types/webpack-env": "1.13.0",
         "color-functions": "1.1.0",
-        "enzyme": "2.9.1",
         "es6-promise": "4.1.1",
         "es6-weak-map": "2.0.2",
         "highlight.js": "9.12.0",
         "json-loader": "0.5.7",
-        "office-ui-fabric-core": "9.2.0",
-        "react": "15.6.2",
-        "react-dom": "15.6.2",
-        "react-highlight": "0.9.0",
-        "tslib": "1.8.0",
+        "office-ui-fabric-core": "9.3.0",
+        "react": "16.2.0",
+        "react-dom": "16.2.0",
+        "react-highlight": "0.10.0",
+        "tslib": "1.8.1",
         "write-file-webpack-plugin": "4.2.0"
       }
     },
+    "@rush-temp/file-type-icons": {
+      "version": "file:projects/file-type-icons.tgz",
+      "integrity": "sha1-iodhc0X0kWDVfFEa1EXIbJlBAkg=",
+      "requires": {
+        "@types/react": "16.0.25",
+        "@types/react-dom": "16.0.3",
+        "react": "16.2.0",
+        "react-dom": "16.2.0",
+        "tslib": "1.8.1"
+      }
+    },
     "@rush-temp/icons": {
       "version": "file:projects/icons.tgz",
-      "integrity": "sha1-2nEDGbwwqJG3pVIU9lbchpuhLnI=",
+      "integrity": "sha1-h1sg1jJD+9BQBWnTZGky86SthHU=",
       "requires": {
-        "tslib": "1.8.0"
+        "tslib": "1.8.1"
       }
     },
     "@rush-temp/jest-serializer-merge-styles": {
       "version": "file:projects/jest-serializer-merge-styles.tgz",
-      "integrity": "sha1-JTLTHGH61B5mdJjTPT/vSYP6JPQ=",
+      "integrity": "sha1-7yqvQu+aqWCLHvTvFA9SKYaTAIM=",
       "requires": {
-        "@types/jest": "21.1.0"
-      },
-      "dependencies": {
-        "@types/jest": {
-          "version": "21.1.0",
-          "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.0.tgz",
-          "integrity": "sha512-7W+tgzauU0s467L7SG1GuHKr4jOmMTXOvR78LP6/YfuaM8JNRF+ayV2+vmNmlaBhbNPvckeJfak2aP+7VJ3g5A=="
-        }
+        "@types/jest": "21.1.8"
       }
     },
     "@rush-temp/merge-styles": {
       "version": "file:projects/merge-styles.tgz",
-      "integrity": "sha1-N/0gN2hPPIL5uMWNlRy4kquxu9c=",
+      "integrity": "sha1-wrp/z/fR48MjQ7UM2pHEM4fZJpg=",
       "requires": {
-        "@types/jest": "21.1.0",
-        "tslib": "1.8.0"
-      },
-      "dependencies": {
-        "@types/jest": {
-          "version": "21.1.0",
-          "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.0.tgz",
-          "integrity": "sha512-7W+tgzauU0s467L7SG1GuHKr4jOmMTXOvR78LP6/YfuaM8JNRF+ayV2+vmNmlaBhbNPvckeJfak2aP+7VJ3g5A=="
-        }
+        "@types/jest": "21.1.8",
+        "tslib": "1.8.1"
       }
     },
     "@rush-temp/office-ui-fabric-react": {
       "version": "file:projects/office-ui-fabric-react.tgz",
-      "integrity": "sha1-tT9G96ICPXiOe4wV/j7nkIx2v/E=",
+      "integrity": "sha1-OQC5rWWFkJt2uAakLsUkrdaoUAk=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.11",
-        "@types/enzyme": "2.8.8",
+        "@microsoft/load-themed-styles": "1.7.14",
+        "@types/enzyme": "3.1.5",
+        "@types/enzyme-adapter-react-16": "1.0.1",
         "@types/es6-promise": "0.0.32",
-        "@types/jest": "21.1.0",
-        "@types/prop-types": "15.5.1",
-        "@types/react": "15.6.7",
-        "@types/react-dom": "15.5.5",
-        "@types/react-test-renderer": "15.5.5",
+        "@types/jest": "21.1.8",
+        "@types/prop-types": "15.5.2",
+        "@types/react": "16.0.25",
+        "@types/react-dom": "16.0.3",
+        "@types/react-test-renderer": "16.0.0",
         "@types/resemblejs": "1.3.28",
         "@types/sinon": "2.2.2",
         "@types/webpack-env": "1.13.0",
-        "enzyme": "2.9.1",
+        "enzyme": "3.2.0",
+        "enzyme-adapter-react-16": "1.1.0",
         "es6-map": "0.1.5",
         "es6-promise": "4.1.1",
         "es6-weak-map": "2.0.2",
         "highlight.js": "9.12.0",
-        "office-ui-fabric-core": "9.2.0",
+        "office-ui-fabric-core": "9.3.0",
         "prop-types": "15.6.0",
-        "react": "15.6.2",
-        "react-dom": "15.6.2",
-        "react-highlight": "0.9.0",
-        "react-test-renderer": "15.6.2",
+        "react": "16.2.0",
+        "react-dom": "16.2.0",
+        "react-highlight": "0.10.0",
+        "react-test-renderer": "16.2.0",
         "resemblejs": "2.2.6",
-        "sinon": "2.4.1",
-        "tslib": "1.8.0"
-      },
-      "dependencies": {
-        "@types/jest": {
-          "version": "21.1.0",
-          "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.0.tgz",
-          "integrity": "sha512-7W+tgzauU0s467L7SG1GuHKr4jOmMTXOvR78LP6/YfuaM8JNRF+ayV2+vmNmlaBhbNPvckeJfak2aP+7VJ3g5A=="
-        },
-        "@types/react-dom": {
-          "version": "15.5.5",
-          "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-15.5.5.tgz",
-          "integrity": "sha512-o9mYuvKgPdyzk20DSIqEBUSGVsSb1QnWtOQoPK/ExcF70Qnhr80no4MgbrEw/2pHiZbLKOjV7mWgKYTLq6f04g==",
-          "requires": {
-            "@types/react": "15.6.7"
-          }
-        },
-        "lolex": {
-          "version": "1.6.0",
-          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
-          "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
-        },
-        "sinon": {
-          "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/sinon/-/sinon-2.4.1.tgz",
-          "integrity": "sha512-vFTrO9Wt0ECffDYIPSP/E5bBugt0UjcBQOfQUMh66xzkyPEnhl/vM2LRZi2ajuTdkH07sA6DzrM6KvdvGIH8xw==",
-          "requires": {
-            "diff": "3.4.0",
-            "formatio": "1.2.0",
-            "lolex": "1.6.0",
-            "native-promise-only": "0.8.1",
-            "path-to-regexp": "1.7.0",
-            "samsam": "1.3.0",
-            "text-encoding": "0.6.4",
-            "type-detect": "4.0.5"
-          }
-        }
+        "sinon": "4.1.3",
+        "tslib": "1.8.1"
       }
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
       "version": "file:projects/office-ui-fabric-react-tslint.tgz",
-      "integrity": "sha1-Q+2D1Bv2MtLvBvFsMYPILkwkUeY=",
+      "integrity": "sha1-WhVDndm+8A91sOhaSJP4DoVcWUs=",
       "requires": {
         "tslint-react": "3.2.0"
       }
     },
     "@rush-temp/ssr-tests": {
       "version": "file:projects/ssr-tests.tgz",
-      "integrity": "sha1-cgcOS/4MV3++w6huOUxEIHuhl8M=",
+      "integrity": "sha1-lTlFe2tuN/0ZkkB9qZcy+hcoMP0=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.11",
-        "@types/chai": "3.4.35",
-        "@types/enzyme": "2.8.8",
+        "@microsoft/load-themed-styles": "1.7.14",
         "@types/es6-promise": "0.0.32",
         "@types/mocha": "2.2.39",
         "@types/webpack-env": "1.13.0",
         "es6-promise": "4.1.1",
-        "mocha": "3.3.0",
+        "mocha": "3.5.3",
         "raw-loader": "0.5.1",
-        "react": "15.6.2",
-        "react-dom": "15.6.2",
-        "tslib": "1.8.0",
-        "webpack": "3.8.1"
+        "react": "16.2.0",
+        "react-dom": "16.2.0",
+        "tslib": "1.8.1",
+        "webpack": "3.10.0"
       }
     },
     "@rush-temp/styling": {
       "version": "file:projects/styling.tgz",
-      "integrity": "sha1-KqHoAUHACIxxQEUTyefVlGw1VWg=",
+      "integrity": "sha1-5ZFIqOTdmEnfFV4YvdtxwfzZgoo=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.11",
-        "@types/chai": "3.4.35",
-        "@types/enzyme": "2.8.8",
-        "@types/jest": "21.1.0",
-        "@types/mocha": "2.2.39",
-        "@types/react": "15.6.7",
+        "@microsoft/load-themed-styles": "1.7.14",
+        "@types/jest": "21.1.8",
+        "@types/react": "16.0.25",
         "@types/webpack-env": "1.13.0",
         "es6-map": "0.1.5",
         "es6-weak-map": "2.0.2",
-        "react": "15.6.2",
-        "react-dom": "15.6.2",
-        "tslib": "1.8.0"
-      },
-      "dependencies": {
-        "@types/jest": {
-          "version": "21.1.0",
-          "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.0.tgz",
-          "integrity": "sha512-7W+tgzauU0s467L7SG1GuHKr4jOmMTXOvR78LP6/YfuaM8JNRF+ayV2+vmNmlaBhbNPvckeJfak2aP+7VJ3g5A=="
-        }
+        "react": "16.2.0",
+        "react-dom": "16.2.0",
+        "tslib": "1.8.1"
       }
     },
     "@rush-temp/test-bundle-button": {
       "version": "file:projects/test-bundle-button.tgz",
-      "integrity": "sha1-QBxJIh6t5W3SnHvBcv9DAKY8y14=",
+      "integrity": "sha1-Y2JNJ5HZUs1pH2q6Xui4Sz4IMy0=",
       "requires": {
-        "@types/prop-types": "15.5.1",
-        "@types/react": "15.6.7",
-        "@types/react-dom": "15.5.6",
+        "@types/prop-types": "15.5.2",
+        "@types/react": "16.0.25",
+        "@types/react-dom": "16.0.3",
         "@types/webpack-env": "1.13.0",
-        "react": "15.6.2",
-        "react-dom": "15.6.2",
-        "tslib": "1.8.0"
+        "react": "16.2.0",
+        "react-dom": "16.2.0",
+        "tslib": "1.8.1"
       }
     },
     "@rush-temp/todo-app": {
       "version": "file:projects/todo-app.tgz",
-      "integrity": "sha1-d4y/mihiJri3d59Qo3VC8UmckHo=",
+      "integrity": "sha1-Iqd75WQ6efvycKDtaFlYUU465eA=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.11",
-        "@types/chai": "3.4.35",
-        "@types/enzyme": "2.8.8",
+        "@microsoft/load-themed-styles": "1.7.14",
         "@types/es6-promise": "0.0.32",
-        "@types/mocha": "2.2.39",
-        "@types/react": "15.6.7",
-        "@types/react-dom": "15.5.6",
+        "@types/react": "16.0.25",
+        "@types/react-dom": "16.0.3",
         "@types/webpack-env": "1.13.0",
         "es6-promise": "4.1.1",
-        "immutability-helper": "2.5.1",
-        "react": "15.6.2",
-        "react-dom": "15.6.2",
-        "tslib": "1.8.0",
-        "typescript": "2.4.2"
+        "immutability-helper": "2.6.2",
+        "react": "16.2.0",
+        "react-dom": "16.2.0",
+        "tslib": "1.8.1",
+        "typescript": "2.6.2"
       }
     },
     "@rush-temp/utilities": {
       "version": "file:projects/utilities.tgz",
-      "integrity": "sha1-4Y87ZI3UBiw+0oRX2l70mfRlFLs=",
-      "requires": {
-        "@microsoft/load-themed-styles": "1.7.11",
-        "@types/enzyme": "2.8.8",
-        "@types/jest": "21.1.0",
-        "@types/prop-types": "15.5.1",
-        "@types/react": "15.6.7",
-        "@types/react-dom": "15.5.6",
+      "integrity": "sha1-luCc+RU7XhQ8TdzZ/AIuHYh9Or4=",
+      "requires": {
+        "@microsoft/load-themed-styles": "1.7.14",
+        "@types/enzyme": "3.1.5",
+        "@types/enzyme-adapter-react-16": "1.0.1",
+        "@types/jest": "21.1.8",
+        "@types/prop-types": "15.5.2",
+        "@types/react": "16.0.25",
+        "@types/react-dom": "16.0.3",
         "@types/sinon": "2.2.2",
-        "enzyme": "2.9.1",
+        "enzyme": "3.2.0",
+        "enzyme-adapter-react-16": "1.1.0",
         "prop-types": "15.6.0",
-        "react": "15.6.2",
-        "react-dom": "15.6.2",
-        "sinon": "2.4.1",
-        "tslib": "1.8.0"
-      },
-      "dependencies": {
-        "@types/jest": {
-          "version": "21.1.0",
-          "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.0.tgz",
-          "integrity": "sha512-7W+tgzauU0s467L7SG1GuHKr4jOmMTXOvR78LP6/YfuaM8JNRF+ayV2+vmNmlaBhbNPvckeJfak2aP+7VJ3g5A=="
-        },
-        "lolex": {
-          "version": "1.6.0",
-          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
-          "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
-        },
-        "sinon": {
-          "version": "2.4.1",
-          "resolved": "https://registry.npmjs.org/sinon/-/sinon-2.4.1.tgz",
-          "integrity": "sha512-vFTrO9Wt0ECffDYIPSP/E5bBugt0UjcBQOfQUMh66xzkyPEnhl/vM2LRZi2ajuTdkH07sA6DzrM6KvdvGIH8xw==",
-          "requires": {
-            "diff": "3.4.0",
-            "formatio": "1.2.0",
-            "lolex": "1.6.0",
-            "native-promise-only": "0.8.1",
-            "path-to-regexp": "1.7.0",
-            "samsam": "1.3.0",
-            "text-encoding": "0.6.4",
-            "type-detect": "4.0.5"
-          }
-        }
+        "react": "16.2.0",
+        "react-dom": "16.2.0",
+        "sinon": "4.1.3",
+        "tslib": "1.8.1"
       }
     },
     "@rush-temp/vr-tests": {
       "version": "file:projects/vr-tests.tgz",
-      "integrity": "sha1-RkxpzzslcFoclOx6PmJHgxyegDI=",
+      "integrity": "sha1-ZBRZ+Dnb2VRC5EVyPHdbe7DcQ4E=",
       "requires": {
         "@storybook/addon-options": "3.2.3",
-        "@storybook/react": "3.2.16",
-        "@types/react": "15.6.7",
-        "@types/react-dom": "15.5.6",
+        "@storybook/react": "3.2.17",
+        "@types/react": "16.0.25",
+        "@types/react-dom": "16.0.3",
         "@types/storybook__react": "3.0.5",
-        "awesome-typescript-loader": "3.4.0",
-        "css-loader": "0.27.3",
-        "file-loader": "0.11.1",
-        "postcss-loader": "1.3.3",
+        "awesome-typescript-loader": "3.4.1",
+        "css-loader": "0.28.7",
+        "file-loader": "0.11.2",
+        "postcss-loader": "2.0.9",
         "raw-loader": "0.5.1",
-        "react": "15.6.2",
-        "react-dom": "15.6.2",
+        "react": "16.2.0",
+        "react-dom": "16.2.0",
         "screener-runner": "0.6.19",
-        "screener-storybook": "0.9.10",
+        "screener-storybook": "0.9.15",
         "storybook-readme": "3.0.6",
-        "style-loader": "0.16.1",
-        "tslib": "1.8.0",
-        "typescript": "2.4.2"
-      },
-      "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
-          "requires": {
-            "ansi-styles": "2.2.1",
-            "escape-string-regexp": "1.0.5",
-            "has-ansi": "2.0.0",
-            "strip-ansi": "3.0.1",
-            "supports-color": "2.0.0"
-          },
-          "dependencies": {
-            "supports-color": {
-              "version": "2.0.0",
-              "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-              "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-            }
-          }
-        },
-        "css-loader": {
-          "version": "0.27.3",
-          "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.27.3.tgz",
-          "integrity": "sha1-aatvR7ab+xtazuYbrCqrFDAv8Nw=",
-          "requires": {
-            "babel-code-frame": "6.26.0",
-            "css-selector-tokenizer": "0.7.0",
-            "cssnano": "3.10.0",
-            "loader-utils": "1.1.0",
-            "lodash.camelcase": "4.3.0",
-            "object-assign": "4.1.1",
-            "postcss": "5.2.18",
-            "postcss-modules-extract-imports": "1.1.0",
-            "postcss-modules-local-by-default": "1.2.0",
-            "postcss-modules-scope": "1.1.0",
-            "postcss-modules-values": "1.3.0",
-            "source-list-map": "0.1.8"
-          }
-        },
-        "has-flag": {
-          "version": "1.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
-          "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
-        },
-        "postcss": {
-          "version": "5.2.18",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-5.2.18.tgz",
-          "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
-          "requires": {
-            "chalk": "1.1.3",
-            "js-base64": "2.3.2",
-            "source-map": "0.5.7",
-            "supports-color": "3.2.3"
-          }
-        },
-        "postcss-loader": {
-          "version": "1.3.3",
-          "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-1.3.3.tgz",
-          "integrity": "sha1-piHqH6KQYqg5cqRvVEhncTAZFus=",
-          "requires": {
-            "loader-utils": "1.1.0",
-            "object-assign": "4.1.1",
-            "postcss": "5.2.18",
-            "postcss-load-config": "1.2.0"
-          }
-        },
-        "source-list-map": {
-          "version": "0.1.8",
-          "resolved": "https://registry.npmjs.org/source-list-map/-/source-list-map-0.1.8.tgz",
-          "integrity": "sha1-xVCyq1Qn9rPyH1r+rYjE9Vh7IQY="
-        },
-        "source-map": {
-          "version": "0.5.7",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
-          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
-        },
-        "style-loader": {
-          "version": "0.16.1",
-          "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.16.1.tgz",
-          "integrity": "sha1-UOMlJY1OeEId2WgGNrQehmFZXRA=",
-          "requires": {
-            "loader-utils": "1.1.0"
-          }
-        },
-        "supports-color": {
-          "version": "3.2.3",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.2.3.tgz",
-          "integrity": "sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=",
-          "requires": {
-            "has-flag": "1.0.0"
-          }
-        }
+        "style-loader": "0.19.1",
+        "tslib": "1.8.1",
+        "typescript": "2.6.2"
       }
     },
     "@storybook/addon-actions": {
-      "version": "3.2.16",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-actions/-/addon-actions-3.2.16.tgz",
-      "integrity": "sha512-TXR/H5lDCtPCmc+/nidvVBiTlGsPHxeJ/LMPuGxq/yF7EvzrfXw+CuEuaPNp5qknSioOLm9GngbozNg8HfBgKg==",
+      "version": "3.2.17",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-actions/-/addon-actions-3.2.17.tgz",
+      "integrity": "sha512-B4++4+p6zWTeTBzqe9lgzT8J0onaMfSZsBRJpa5URoDo3d4kTq+DTDs2qHhhTKJb2Drtu24/JlEgJG7lv0Fb0w==",
       "requires": {
-        "@storybook/addons": "3.2.16",
+        "@storybook/addons": "3.2.17",
         "deep-equal": "1.0.1",
         "json-stringify-safe": "5.0.1",
         "prop-types": "15.6.0",
-        "react-inspector": "2.2.1",
+        "react-inspector": "2.2.2",
         "uuid": "3.1.0"
       }
     },
     "@storybook/addon-links": {
-      "version": "3.2.16",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-links/-/addon-links-3.2.16.tgz",
-      "integrity": "sha512-JFs2p7EGRFpwUkg7xV7Vi3h/zBr4UjmprF9YYHR2L5TQFbztlKJPBhiATRSQtgFyNNAo7zNkSf439Rkrb9k7yQ==",
+      "version": "3.2.17",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-links/-/addon-links-3.2.17.tgz",
+      "integrity": "sha512-AdCH9DsbOfiMDv42/l0Zfk2yhiBrlWuzHk7ubhSwqF3/61sXr+BWFv+SlOx2oFfSWAT7zfg2sC7Wr+us8gs7GQ==",
       "requires": {
-        "@storybook/addons": "3.2.16"
+        "@storybook/addons": "3.2.17"
       }
     },
     "@storybook/addon-options": {
@@ -619,33 +412,33 @@
       "resolved": "https://registry.npmjs.org/@storybook/addon-options/-/addon-options-3.2.3.tgz",
       "integrity": "sha1-6jdA0onUKc52fpaZvzpkfddBWS0=",
       "requires": {
-        "@storybook/addons": "3.2.16"
+        "@storybook/addons": "3.2.17"
       }
     },
     "@storybook/addons": {
-      "version": "3.2.16",
-      "resolved": "https://registry.npmjs.org/@storybook/addons/-/addons-3.2.16.tgz",
-      "integrity": "sha512-Dxs0XceqqUSG+vao5uCZdphmCAGlpnwDLV0abjYpPH0eKb2QN5Rs/Vrl0MzuOYGghPv8Y1QfhdB6DFh7AuIoTQ=="
+      "version": "3.2.17",
+      "resolved": "https://registry.npmjs.org/@storybook/addons/-/addons-3.2.17.tgz",
+      "integrity": "sha512-1/Ux++3hMfYqAgBwgWbGtGAM0CfSdAchf//wDLBUmX09+E5CjiQvW3YwVplNYzfRuAsSrE1GOYJRAsz639oTYQ=="
     },
     "@storybook/channel-postmessage": {
-      "version": "3.2.16",
-      "resolved": "https://registry.npmjs.org/@storybook/channel-postmessage/-/channel-postmessage-3.2.16.tgz",
-      "integrity": "sha512-8D3UeZfb4TarkEp0xMCUxX5rW/m2YghYmlnFDcMCgPhN9R2pRySjxxbCjK+ry0q2hUII4R9Bbck63AUqwcQDow==",
+      "version": "3.2.17",
+      "resolved": "https://registry.npmjs.org/@storybook/channel-postmessage/-/channel-postmessage-3.2.17.tgz",
+      "integrity": "sha512-sNlXcHTKM6aIxRsQMaMbowsAToYRlbeP/THqulVxoRRKNDPndNnZe/Lu3eSjBjAfNWBLRFfgX903adt82QAPCA==",
       "requires": {
-        "@storybook/channels": "3.2.16",
+        "@storybook/channels": "3.2.17",
         "global": "4.3.2",
         "json-stringify-safe": "5.0.1"
       }
     },
     "@storybook/channels": {
-      "version": "3.2.16",
-      "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-3.2.16.tgz",
-      "integrity": "sha512-zjaDE/0yvlLfOcpzeTIWi1K7d873UykUmGLwFSO2hUIM7hlc+QxCeE0MH+OrQYUWC8gcU8pg+IWAk/6qzWAZsA=="
+      "version": "3.2.17",
+      "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-3.2.17.tgz",
+      "integrity": "sha512-HIdRmFTFVLcbrwYFf6+LyAlgcd57ki+6DDTmcvXQTHCWrOOCJKwfKjHgn6tbnHlGHiWByA8lAdO1bFcYhHxl4Q=="
     },
     "@storybook/components": {
-      "version": "3.2.16",
-      "resolved": "https://registry.npmjs.org/@storybook/components/-/components-3.2.16.tgz",
-      "integrity": "sha512-+bxwsvwa7TPqwxG6ap2hjjrwSg1g8e2ZGijPQDEGpvNfEnLfbZRyQKXRhfCyeAN3DL8F8Bx95AJuWaYKr0pqpA==",
+      "version": "3.2.17",
+      "resolved": "https://registry.npmjs.org/@storybook/components/-/components-3.2.17.tgz",
+      "integrity": "sha512-pXwNKLavYCu18B2EynFu9EKXlKi0LDo0B/KctbJvidxR5ubzqkZu9h2ti3hPPVomR2DQiRx61Vzqd7cbcyy14w==",
       "requires": {
         "glamor": "2.20.40",
         "glamorous": "4.11.0",
@@ -658,22 +451,22 @@
       "integrity": "sha512-GD4OYJ8GsayVhIg306sfgcKDk9j8YfuSKIAWvdB/g7IDlw0pDgueONALVEEE2XWJtCwcsUyDtCYzXFgCBWLEjA==",
       "requires": {
         "@storybook/react-komposer": "2.0.3",
-        "@storybook/react-simple-di": "1.2.1",
+        "@storybook/react-simple-di": "1.3.0",
         "babel-runtime": "6.26.0"
       }
     },
     "@storybook/react": {
-      "version": "3.2.16",
-      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-3.2.16.tgz",
-      "integrity": "sha512-gMS+KrI5u0OTnHYhyLkMLknCQRCyDL3QULXKCYtkUcZ6l2MKvOVSMwwG1VUPWssWtLBvN4Fdx9A+9BxDWLZhpw==",
-      "requires": {
-        "@storybook/addon-actions": "3.2.16",
-        "@storybook/addon-links": "3.2.16",
-        "@storybook/addons": "3.2.16",
-        "@storybook/channel-postmessage": "3.2.16",
-        "@storybook/ui": "3.2.16",
-        "airbnb-js-shims": "1.3.0",
-        "autoprefixer": "7.1.6",
+      "version": "3.2.17",
+      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-3.2.17.tgz",
+      "integrity": "sha512-1bZXP0wGdlTgRiGsTLQ90G0Swx+Re7o3IAblOdobS/E5fREzEC1zEHdSQYC5ROUoWDLourqcF/zo4I9HpKvnZg==",
+      "requires": {
+        "@storybook/addon-actions": "3.2.17",
+        "@storybook/addon-links": "3.2.17",
+        "@storybook/addons": "3.2.17",
+        "@storybook/channel-postmessage": "3.2.17",
+        "@storybook/ui": "3.2.17",
+        "airbnb-js-shims": "1.4.0",
+        "autoprefixer": "7.2.3",
         "babel-core": "6.26.0",
         "babel-loader": "7.1.2",
         "babel-plugin-react-docgen": "1.8.1",
@@ -690,8 +483,9 @@
         "commander": "2.12.2",
         "common-tags": "1.5.1",
         "configstore": "3.1.1",
-        "core-js": "2.5.1",
+        "core-js": "2.5.3",
         "css-loader": "0.28.7",
+        "dotenv-webpack": "1.5.4",
         "express": "4.16.2",
         "file-loader": "1.1.5",
         "find-cache-dir": "1.0.0",
@@ -715,7 +509,7 @@
         "url-loader": "0.6.2",
         "util-deprecate": "1.0.2",
         "uuid": "3.1.0",
-        "webpack": "3.8.1",
+        "webpack": "3.10.0",
         "webpack-dev-middleware": "1.12.2",
         "webpack-hot-middleware": "2.21.0"
       },
@@ -728,6 +522,15 @@
             "loader-utils": "1.1.0",
             "schema-utils": "0.3.0"
           }
+        },
+        "style-loader": {
+          "version": "0.18.2",
+          "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.18.2.tgz",
+          "integrity": "sha512-WPpJPZGUxWYHWIUMNNOYqql7zh85zGmr84FdTVWq52WTIkqlW9xSxD3QYWi/T31cqn9UNSsietVEgGn2aaSCzw==",
+          "requires": {
+            "loader-utils": "1.1.0",
+            "schema-utils": "0.3.0"
+          }
         }
       }
     },
@@ -755,12 +558,14 @@
       }
     },
     "@storybook/react-simple-di": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/@storybook/react-simple-di/-/react-simple-di-1.2.1.tgz",
-      "integrity": "sha512-Sj3JU1KpnTIyBWBp+uAZT3PlZ2IVYrxvOOXgpT92Injcmg2KV2ry1GkZen6XuVZqUfU0vz/sK08aP45boErFnw==",
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/@storybook/react-simple-di/-/react-simple-di-1.3.0.tgz",
+      "integrity": "sha512-RH6gPQaYMs/VzQX2dgbZU8DQMKFXVOv1ruohHjjNPys4q+YdqMFMDe5jOP1AUE3j9g01x0eW7bVjRawSpl++Ew==",
       "requires": {
         "babel-runtime": "6.26.0",
-        "hoist-non-react-statics": "1.2.0"
+        "create-react-class": "15.6.2",
+        "hoist-non-react-statics": "1.2.0",
+        "prop-types": "15.6.0"
       }
     },
     "@storybook/react-stubber": {
@@ -772,12 +577,12 @@
       }
     },
     "@storybook/ui": {
-      "version": "3.2.16",
-      "resolved": "https://registry.npmjs.org/@storybook/ui/-/ui-3.2.16.tgz",
-      "integrity": "sha512-K6DwvT2Oo4GrJkT0ij8EW1GsjX7Sw9U6hDp2II5tnKsV7egnIKgJ6y5xGOZLHNvDDkeo5KS+Ii3GjrUbnZ1QzQ==",
+      "version": "3.2.17",
+      "resolved": "https://registry.npmjs.org/@storybook/ui/-/ui-3.2.17.tgz",
+      "integrity": "sha512-At0oWWTALJrJhtdnP+0AMANBC5omIBnEg3Pin3M0+yzUy6Poelcvt8+81dQEKLBP6LiyFOVpiDjfqpiHR5l0ow==",
       "requires": {
         "@hypnosphi/fuse.js": "3.0.9",
-        "@storybook/components": "3.2.16",
+        "@storybook/components": "3.2.17",
         "@storybook/mantra-core": "1.7.2",
         "@storybook/react-fuzzy": "0.4.3",
         "@storybook/react-komposer": "2.0.3",
@@ -794,8 +599,8 @@
         "prop-types": "15.6.0",
         "qs": "6.5.1",
         "react-icons": "2.2.7",
-        "react-inspector": "2.2.1",
-        "react-modal": "3.1.5",
+        "react-inspector": "2.2.2",
+        "react-modal": "3.1.8",
         "react-split-pane": "0.1.71",
         "react-treebeard": "2.1.0",
         "redux": "3.7.2"
@@ -806,23 +611,26 @@
       "resolved": "https://registry.npmjs.org/@types/argparse/-/argparse-1.0.33.tgz",
       "integrity": "sha512-VQgHxyPMTj3hIlq9SY1mctqx+Jj8kpQfoLvDlVSDNOyuYs8JYfkuY3OW/4+dO657yPmNhHpePRx0/Tje5ImNVQ=="
     },
-    "@types/chai": {
-      "version": "3.4.35",
-      "resolved": "https://registry.npmjs.org/@types/chai/-/chai-3.4.35.tgz",
-      "integrity": "sha1-6NZfg0ktKUT4FvxiB0GCHCioyQA="
-    },
     "@types/cheerio": {
       "version": "0.22.6",
       "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.6.tgz",
       "integrity": "sha512-Nyk3Gut4CMFZOebvutYAk/Nis7d6u9b7VX4OcG4zUX5gnKnXMiq+8EPdcX7FVakeL4+t770iy8E46W8ZSSXeFA=="
     },
     "@types/enzyme": {
-      "version": "2.8.8",
-      "resolved": "https://registry.npmjs.org/@types/enzyme/-/enzyme-2.8.8.tgz",
-      "integrity": "sha512-KBw0ZzOQNtwVGO4egRjEpQbXMFCSevy+gRFzaLXrU64LrVVuJF0FqVIdzed0NCSP+nMALj001//dwYKV/VDlCA==",
+      "version": "3.1.5",
+      "resolved": "https://registry.npmjs.org/@types/enzyme/-/enzyme-3.1.5.tgz",
+      "integrity": "sha512-f1HnxoBnHsK+mcjF6xAofaewv+vPrMtBdxAQuRyO4MltIJV20nf9EVILPBJqfl6/9Gbf9ygbxv4bmwCY9CFsnQ==",
       "requires": {
         "@types/cheerio": "0.22.6",
-        "@types/react": "15.6.7"
+        "@types/react": "16.0.25"
+      }
+    },
+    "@types/enzyme-adapter-react-16": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@types/enzyme-adapter-react-16/-/enzyme-adapter-react-16-1.0.1.tgz",
+      "integrity": "sha512-XqKrLYUnZnhJMIPfMyxDSBjvpvnMTM/mtqJdZdNbOzuY2S2gHnqFD0JHiPDuy5Mxq4xU06sQPwR5e8Hm+VAXEA==",
+      "requires": {
+        "@types/enzyme": "3.1.5"
       }
     },
     "@types/es6-promise": {
@@ -839,9 +647,9 @@
       }
     },
     "@types/highlight.js": {
-      "version": "9.1.9",
-      "resolved": "https://registry.npmjs.org/@types/highlight.js/-/highlight.js-9.1.9.tgz",
-      "integrity": "sha1-7WM2lV6vIzt163kjubHzc9BF7wE="
+      "version": "9.12.2",
+      "resolved": "https://registry.npmjs.org/@types/highlight.js/-/highlight.js-9.12.2.tgz",
+      "integrity": "sha512-y5x0XD/WXDaGSyiTaTcKS4FurULJtSiYbGTeQd0m2LYZGBcZZ/7fM6t5H/DzeUF+kv8y6UfmF6yJABQsHcp9VQ=="
     },
     "@types/inline-style-prefixer": {
       "version": "3.0.1",
@@ -864,37 +672,38 @@
       "integrity": "sha512-wbKN0MB4XsjdnSE04HiCzLoBDirGCM6zXrqavSj44nZnPFYpnrTF64E9O6Xmf0ca/IuKK/BHUcXwMiwk92gW6Q=="
     },
     "@types/prop-types": {
-      "version": "15.5.1",
-      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.5.1.tgz",
-      "integrity": "sha1-Hs9SYhKZ5luFU3Qzf7Ef0tEGb8E="
+      "version": "15.5.2",
+      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.5.2.tgz",
+      "integrity": "sha512-pQRkAVoxiuUrLq8+CDwiQX4pTCep/PmmNgBbjIwnnsd/HoYjGpR81+FFPE030lvNXgR0haaAU6eoRtztWDE4Xw=="
     },
     "@types/react": {
-      "version": "15.6.7",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-15.6.7.tgz",
-      "integrity": "sha512-HMfRuwiTp7/MfjPOsVlvlduouJH3haDzjc0oXqZy3ZMn3OTl3i4gGgbxsqzA/u9gNyl/oKkwOrU2oVR6vG5SAw=="
+      "version": "16.0.25",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-16.0.25.tgz",
+      "integrity": "sha512-K79zMwWRzQ2db+nPoKpi3gA/KmLo6ZQgT4iO2QPEUdBO7as0PcgrmU9KHYzIO3V6lbD7gRjOM0/nUch6xBfOvQ=="
     },
     "@types/react-addons-test-utils": {
       "version": "0.14.18",
       "resolved": "https://registry.npmjs.org/@types/react-addons-test-utils/-/react-addons-test-utils-0.14.18.tgz",
       "integrity": "sha1-g+EK8dvl7CU1vC3FNz17w7gv3uE=",
       "requires": {
-        "@types/react": "15.6.7"
+        "@types/react": "16.0.25"
       }
     },
     "@types/react-dom": {
-      "version": "15.5.6",
-      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-15.5.6.tgz",
-      "integrity": "sha512-dP4vEDEH4rL+uUl6f//c6mjepTVdJ6Ldx3z0dZbw047T5Z+o2PZDW/Qd+I4PkTmIgk7YNAZC/TFnm3IHT5UAhw==",
+      "version": "16.0.3",
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-16.0.3.tgz",
+      "integrity": "sha512-xAvZiGhQlEhjStoKktoai8CelXVFBaSN6JX4vy1UQioRba3c2vum1TGzR0thHoEauZtIwzWg8mos0AHu2ne4jw==",
       "requires": {
-        "@types/react": "15.6.7"
+        "@types/node": "8.0.26",
+        "@types/react": "16.0.25"
       }
     },
     "@types/react-test-renderer": {
-      "version": "15.5.5",
-      "resolved": "https://registry.npmjs.org/@types/react-test-renderer/-/react-test-renderer-15.5.5.tgz",
-      "integrity": "sha512-SEt2f9Hf+Y/OGstIDrINnls6wpeZGt9xiROBFjfMxXKbqg7zYkPVB7D58Rg9TZbi2kuxatchVTdiliYLs8WK0g==",
+      "version": "16.0.0",
+      "resolved": "https://registry.npmjs.org/@types/react-test-renderer/-/react-test-renderer-16.0.0.tgz",
+      "integrity": "sha512-tbuDajGYu8tEBAGVXZqh0Hmfm+pZA9P+4UfMIWTvzO4PA8yBbL2TCsZNSky+S74oAKy96Z/PBdDTj22iPMYqcQ==",
       "requires": {
-        "@types/react": "15.6.7"
+        "@types/react": "16.0.25"
       }
     },
     "@types/resemblejs": {
@@ -912,7 +721,7 @@
       "resolved": "https://registry.npmjs.org/@types/storybook__react/-/storybook__react-3.0.5.tgz",
       "integrity": "sha512-febLx40iQWoQKVaEMpxdzkJnqncPHoRivlilc3JhHJiRuBY1Mqa1yTKcvQ5RiFAYFIuv4x+bRuSIXErk5v41Bg==",
       "requires": {
-        "@types/react": "15.6.7",
+        "@types/react": "16.0.25",
         "@types/webpack-env": "1.13.0"
       }
     },
@@ -927,31 +736,31 @@
       "integrity": "sha1-LrHQCl5Ow/pYx2r94S4YK2bcXBw="
     },
     "@uifabric/icons": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.2.0.tgz",
-      "integrity": "sha512-P5kfPej/wxgR8jZt/GqnU0FqYcz+JH1iCcaaYd6p9L3opmZtu4w5duKeqs+Bc1u7K16r800EQfLgKe76rt6AuA==",
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.3.0.tgz",
+      "integrity": "sha512-3jh++ktFidYimHCnnJLMAFHbVvCLABTrU1ikii5FmfdqYpwYL5mOBdRgyCBCAUcQn+w3fXfn+TREM5PXa2Ihzg==",
       "requires": {
-        "@uifabric/styling": "5.11.1",
-        "tslib": "1.8.0"
+        "@uifabric/styling": "5.14.0",
+        "tslib": "1.8.1"
       }
     },
     "@uifabric/merge-styles": {
-      "version": "5.7.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.7.0.tgz",
-      "integrity": "sha512-hS8tvkYk48JTkpKfoIF+kUP/ZefDteBjo7UKd2CLTO1eB+hLEUyKQtUEuiNlfi28cuZ/nracoK/lg7PN+Yv0YA==",
+      "version": "5.8.1",
+      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.8.1.tgz",
+      "integrity": "sha512-mgxb0rMwxJ7LfrPjF4dSUAPJkamlGCjKxzd5nR0wSxde9/k0Sw3zcf4BoefrbR03jnVkdtDXfj1rpq2yYbXXoA==",
       "requires": {
-        "tslib": "1.8.0"
+        "tslib": "1.8.1"
       }
     },
     "@uifabric/styling": {
-      "version": "5.11.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.11.1.tgz",
-      "integrity": "sha512-oTXOjL0l8Ozuk/qeqMM/T+73nRvcXrhuOFoNuoTpNLIiv1PvuEapAd/kJaKA4p5HW70KeZa/CJVNonWBqU2qww==",
+      "version": "5.14.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.14.0.tgz",
+      "integrity": "sha512-xHW/KuMMFbvr5z3+YRzUlz/yizDdUEh9MW2kzF0D1Omg1Jdfjg6qrDTVPifuyNQTbW9nCiAnb2lX4f0DEl/tuQ==",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.11",
-        "@uifabric/merge-styles": "5.7.0",
+        "@microsoft/load-themed-styles": "1.7.14",
+        "@uifabric/merge-styles": "5.8.1",
         "@uifabric/utilities": "5.5.0",
-        "tslib": "1.8.0"
+        "tslib": "1.8.1"
       }
     },
     "@uifabric/utilities": {
@@ -959,10 +768,10 @@
       "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.5.0.tgz",
       "integrity": "sha512-+U5gM9s9ue1zKYXlguzOHMl/NSYNvPZre7/LLH5RLfrBYJwkddUZ5AOFDD3xRT6nwpRhb5fPSJaJldAakFVY8Q==",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.11",
-        "@uifabric/merge-styles": "5.7.0",
+        "@microsoft/load-themed-styles": "1.7.14",
+        "@uifabric/merge-styles": "5.8.1",
         "prop-types": "15.6.0",
-        "tslib": "1.8.0"
+        "tslib": "1.8.1"
       }
     },
     "abab": {
@@ -1022,11 +831,13 @@
       }
     },
     "airbnb-js-shims": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/airbnb-js-shims/-/airbnb-js-shims-1.3.0.tgz",
-      "integrity": "sha512-Y/9jgf3uEdNyeWPUV1N49FowM/qMIiKSTkRUpYT4jpHkSADfTiRVwI8Mm6o4CIxhnBK1uMf4RIYNYKwwILMCAQ==",
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/airbnb-js-shims/-/airbnb-js-shims-1.4.0.tgz",
+      "integrity": "sha512-KIlW3epMtB1x3PtJr2L7ltkoYvuKzjqrgZPq6mzJUL6Gz+3Y2Oc9FS9ZRzRWym2/jk1r+JsDOOyS2Vavc0E3Pw==",
       "requires": {
         "array-includes": "3.0.3",
+        "array.prototype.flatmap": "1.1.1",
+        "array.prototype.flatten": "1.1.1",
         "es5-shim": "4.5.9",
         "es6-shim": "0.35.3",
         "function.prototype.name": "1.0.3",
@@ -1039,9 +850,9 @@
       }
     },
     "ajv": {
-      "version": "5.5.0",
-      "resolved": "https://registry.npmjs.org/ajv/-/ajv-5.5.0.tgz",
-      "integrity": "sha1-6yhAdG6dxIvV4GOjbj/UAMXqtak=",
+      "version": "5.5.1",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-5.5.1.tgz",
+      "integrity": "sha1-s4u4h22ehr7plJVqBOch6IskjrI=",
       "requires": {
         "co": "4.6.0",
         "fast-deep-equal": "1.0.0",
@@ -1305,6 +1116,26 @@
       "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.3.2.tgz",
       "integrity": "sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg="
     },
+    "array.prototype.flatmap": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/array.prototype.flatmap/-/array.prototype.flatmap-1.1.1.tgz",
+      "integrity": "sha512-LYxij5OIk/e1wxCPu0Ng1Rtqpe3c1FmfQ/uS/2HGk9GfySnzEpJ4N8eKJgnTCI3PSBBsNNwbUORetjs7B+3oLA==",
+      "requires": {
+        "define-properties": "1.1.2",
+        "es-abstract": "1.10.0",
+        "function-bind": "1.1.1"
+      }
+    },
+    "array.prototype.flatten": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/array.prototype.flatten/-/array.prototype.flatten-1.1.1.tgz",
+      "integrity": "sha512-9DM+ZgShl2O01ERvRiEqljn+UAOn5yUwvfdrhM/NBLxuh98+MN/6SyBpvIpJBA0UcUuayRl/5BhmZ4TyjlHqyg==",
+      "requires": {
+        "define-properties": "1.1.2",
+        "es-abstract": "1.10.0",
+        "function-bind": "1.1.1"
+      }
+    },
     "arrify": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/arrify/-/arrify-1.0.1.tgz",
@@ -1392,12 +1223,12 @@
       "integrity": "sha1-NCQX2PLzRhsUzwkIjV7fh5HcmDI="
     },
     "autoprefixer": {
-      "version": "7.1.6",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-7.1.6.tgz",
-      "integrity": "sha512-C9yv/UF3X+eJTi/zvfxuyfxmLibYrntpF3qoJYrMeQwgUJOZrZvpJiMG2FMQ3qnhWtF/be4pYONBBw95ZGe3vA==",
+      "version": "7.2.3",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-7.2.3.tgz",
+      "integrity": "sha512-dqzVGiz3v934+s3YZA6nk7tAs9xuTz5wMJbX1M+L4cY/MTNkOUqP61c1GWkEVlUL/PEy1pKRSCFuoRZrXYx9qA==",
       "requires": {
-        "browserslist": "2.9.1",
-        "caniuse-lite": "1.0.30000775",
+        "browserslist": "2.10.0",
+        "caniuse-lite": "1.0.30000783",
         "normalize-range": "0.1.2",
         "num2fraction": "1.2.2",
         "postcss": "6.0.14",
@@ -1405,9 +1236,9 @@
       }
     },
     "awesome-typescript-loader": {
-      "version": "3.4.0",
-      "resolved": "https://registry.npmjs.org/awesome-typescript-loader/-/awesome-typescript-loader-3.4.0.tgz",
-      "integrity": "sha512-sXPUe8HexKO4/NGTOtFP7ue+LbaALphiP22A8FaJCZT2avTtMQj3uVtrPRIvNf/6484i8rgx9d//jewiaqFH0w==",
+      "version": "3.4.1",
+      "resolved": "https://registry.npmjs.org/awesome-typescript-loader/-/awesome-typescript-loader-3.4.1.tgz",
+      "integrity": "sha512-fYxBtN6s4Dm6vtsROWi8IQ4I+KcmwRWePAVvhI06mFcHbtHfZopOs4qGNu9LyCPEw403LDROKFA+NVV6ig5yNw==",
       "requires": {
         "colors": "1.1.2",
         "enhanced-resolve": "3.3.0",
@@ -2453,7 +2284,7 @@
       "integrity": "sha1-g2TKYt+Or7gwSZ9pkXdGbDsDSZ0=",
       "requires": {
         "babel-runtime": "6.26.0",
-        "core-js": "2.5.1",
+        "core-js": "2.5.3",
         "regenerator-runtime": "0.10.5"
       }
     },
@@ -2489,7 +2320,7 @@
         "babel-plugin-transform-es2015-unicode-regex": "6.24.1",
         "babel-plugin-transform-exponentiation-operator": "6.24.1",
         "babel-plugin-transform-regenerator": "6.26.0",
-        "browserslist": "2.9.1",
+        "browserslist": "2.10.0",
         "invariant": "2.2.2",
         "semver": "5.4.1"
       }
@@ -2623,7 +2454,7 @@
       "requires": {
         "babel-core": "6.26.0",
         "babel-runtime": "6.26.0",
-        "core-js": "2.5.1",
+        "core-js": "2.5.3",
         "home-or-tmp": "2.0.0",
         "lodash": "4.17.4",
         "mkdirp": "0.5.1",
@@ -2642,14 +2473,14 @@
       "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz",
       "integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4=",
       "requires": {
-        "core-js": "2.5.1",
-        "regenerator-runtime": "0.11.0"
+        "core-js": "2.5.3",
+        "regenerator-runtime": "0.11.1"
       },
       "dependencies": {
         "regenerator-runtime": {
-          "version": "0.11.0",
-          "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.0.tgz",
-          "integrity": "sha512-/aA0kLeRb5N9K0d4fw7ooEbI+xDe+DKD499EQqygGqeS8N3xto15p09uY2xj7ixP81sNPXvRLnAQIqdVStgb1A=="
+          "version": "0.11.1",
+          "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz",
+          "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg=="
         }
       }
     },
@@ -2733,7 +2564,7 @@
         "component-emitter": "1.2.1",
         "define-property": "1.0.0",
         "isobject": "3.0.1",
-        "mixin-deep": "1.2.0",
+        "mixin-deep": "1.3.0",
         "pascalcase": "0.1.1"
       }
     },
@@ -2961,12 +2792,12 @@
       }
     },
     "browserslist": {
-      "version": "2.9.1",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.9.1.tgz",
-      "integrity": "sha512-3n3nPdbUqn3nWmsy4PeSQthz2ja1ndpoXta+dwFFNhveGjMg6FXpWYe12vsTpNoXJbzx3j7GZXdtoVIdvh3JbA==",
+      "version": "2.10.0",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.10.0.tgz",
+      "integrity": "sha512-WyvzSLsuAVPOjbljXnyeWl14Ae+ukAT8MUuagKVzIDvwBxl4UAwD1xqtyQs2eWYPGUKMeC3Ol62goqYuKqTTcw==",
       "requires": {
-        "caniuse-lite": "1.0.30000775",
-        "electron-to-chromium": "1.3.27"
+        "caniuse-lite": "1.0.30000783",
+        "electron-to-chromium": "1.3.28"
       }
     },
     "bser": {
@@ -3093,7 +2924,7 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw=",
       "requires": {
         "browserslist": "1.7.7",
-        "caniuse-db": "1.0.30000775",
+        "caniuse-db": "1.0.30000783",
         "lodash.memoize": "4.1.2",
         "lodash.uniq": "4.5.0"
       },
@@ -3103,21 +2934,21 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000775",
-            "electron-to-chromium": "1.3.27"
+            "caniuse-db": "1.0.30000783",
+            "electron-to-chromium": "1.3.28"
           }
         }
       }
     },
     "caniuse-db": {
-      "version": "1.0.30000775",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000775.tgz",
-      "integrity": "sha1-BLzN0CFO3yW5f2GglmCfetaQQzM="
+      "version": "1.0.30000783",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000783.tgz",
+      "integrity": "sha1-FrMNRyZqT1FcxprgMWtnDJYDzb4="
     },
     "caniuse-lite": {
-      "version": "1.0.30000775",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000775.tgz",
-      "integrity": "sha1-dNJ/7dxH88hM+8sTDDCSo168LeI="
+      "version": "1.0.30000783",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000783.tgz",
+      "integrity": "sha1-m1SZ+xtQPSNF0SqmuGEoUvQnb/0="
     },
     "cardinal": {
       "version": "1.0.0",
@@ -3183,26 +3014,26 @@
       "integrity": "sha1-tUc7M9yXxCTl2Y3IfVXU2KKci/I="
     },
     "cheerio": {
-      "version": "0.22.0",
-      "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-0.22.0.tgz",
-      "integrity": "sha1-qbqoYKP5tZWmuBsahocxIe06Jp4=",
+      "version": "1.0.0-rc.2",
+      "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-1.0.0-rc.2.tgz",
+      "integrity": "sha1-S59TqBsn5NXawxwP/Qz6A8xoMNs=",
       "requires": {
         "css-select": "1.2.0",
         "dom-serializer": "0.1.0",
         "entities": "1.1.1",
         "htmlparser2": "3.9.2",
-        "lodash.assignin": "4.2.0",
-        "lodash.bind": "4.2.1",
-        "lodash.defaults": "4.2.0",
-        "lodash.filter": "4.6.0",
-        "lodash.flatten": "4.4.0",
-        "lodash.foreach": "4.5.0",
-        "lodash.map": "4.6.0",
-        "lodash.merge": "4.6.0",
-        "lodash.pick": "4.4.0",
-        "lodash.reduce": "4.6.0",
-        "lodash.reject": "4.6.0",
-        "lodash.some": "4.6.0"
+        "lodash": "4.15.0",
+        "parse5": "3.0.3"
+      },
+      "dependencies": {
+        "parse5": {
+          "version": "3.0.3",
+          "resolved": "https://registry.npmjs.org/parse5/-/parse5-3.0.3.tgz",
+          "integrity": "sha512-rgO9Zg5LLLkfJF9E6CCmXlSE4UVceloys8JrFqCcHloC3usd/kJCyPDwH2SOlzix2j3xaP9sUX3e8+kvkuleAA==",
+          "requires": {
+            "@types/node": "8.0.26"
+          }
+        }
       }
     },
     "chokidar": {
@@ -3341,7 +3172,7 @@
       "resolved": "https://registry.npmjs.org/cli-usage/-/cli-usage-0.1.4.tgz",
       "integrity": "sha1-fAHg3HBsI0s5yTODjI4gshdXduI=",
       "requires": {
-        "marked": "0.3.6",
+        "marked": "0.3.7",
         "marked-terminal": "1.7.0"
       }
     },
@@ -3675,9 +3506,9 @@
       "integrity": "sha1-Z29us8OZl8LuGsOpJP1hJHSPV40="
     },
     "core-js": {
-      "version": "2.5.1",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.5.1.tgz",
-      "integrity": "sha1-rmh03GaTd4m4B1T/VCjfZoGcpQs="
+      "version": "2.5.3",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.5.3.tgz",
+      "integrity": "sha1-isw4NFgk8W2DZbfJtCWRaOjtYD4="
     },
     "core-util-is": {
       "version": "1.0.2",
@@ -3886,7 +3717,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -4054,7 +3885,7 @@
           "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ=",
           "requires": {
             "browserslist": "1.7.7",
-            "caniuse-db": "1.0.30000775",
+            "caniuse-db": "1.0.30000783",
             "normalize-range": "0.1.2",
             "num2fraction": "1.2.2",
             "postcss": "5.2.18",
@@ -4066,8 +3897,8 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000775",
-            "electron-to-chromium": "1.3.27"
+            "caniuse-db": "1.0.30000783",
+            "electron-to-chromium": "1.3.28"
           }
         },
         "chalk": {
@@ -4100,7 +3931,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -4353,6 +4184,11 @@
         "randombytes": "2.0.5"
       }
     },
+    "discontinuous-range": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/discontinuous-range/-/discontinuous-range-1.0.0.tgz",
+      "integrity": "sha1-44Mx8IRLukm5qctxx3FYWqsbxlo="
+    },
     "dns-equal": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/dns-equal/-/dns-equal-1.0.0.tgz",
@@ -4444,6 +4280,19 @@
         "is-obj": "1.0.1"
       }
     },
+    "dotenv": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-4.0.0.tgz",
+      "integrity": "sha1-hk7xN5rO1Vzm+V3r7NzhefegzR0="
+    },
+    "dotenv-webpack": {
+      "version": "1.5.4",
+      "resolved": "https://registry.npmjs.org/dotenv-webpack/-/dotenv-webpack-1.5.4.tgz",
+      "integrity": "sha1-nJLkbkEqHPvGAhftM9adK7/dv58=",
+      "requires": {
+        "dotenv": "4.0.0"
+      }
+    },
     "duplexer": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz",
@@ -4460,9 +4309,9 @@
       "integrity": "sha1-zIcsFoiArjxxiXYv1f/ACJbJUYo="
     },
     "electron-to-chromium": {
-      "version": "1.3.27",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.27.tgz",
-      "integrity": "sha1-eOy4o5kGYYe7N07t412ccFZagD0="
+      "version": "1.3.28",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.28.tgz",
+      "integrity": "sha1-jdTmRYCGZE6fnwoc8y4qH53/2e4="
     },
     "elliptic": {
       "version": "6.4.0",
@@ -4513,20 +4362,58 @@
       "integrity": "sha1-blwtClYhtdra7O+AuQ7ftc13cvA="
     },
     "enzyme": {
-      "version": "2.9.1",
-      "resolved": "https://registry.npmjs.org/enzyme/-/enzyme-2.9.1.tgz",
-      "integrity": "sha1-B9XOaRJBJA+4F78sSxjW5TAkDfY=",
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/enzyme/-/enzyme-3.2.0.tgz",
+      "integrity": "sha512-l0HcjycivXjB4IXkwuRc1K5z8hzWIVZB2b/Y/H2bao9eFTpBz4ACOwAQf44SgG5Nu3d1jF41LasxDgFWZeeysA==",
       "requires": {
-        "cheerio": "0.22.0",
+        "cheerio": "1.0.0-rc.2",
         "function.prototype.name": "1.0.3",
+        "has": "1.0.1",
         "is-subset": "0.1.1",
         "lodash": "4.17.4",
         "object-is": "1.0.1",
         "object.assign": "4.0.4",
         "object.entries": "1.0.4",
         "object.values": "1.0.4",
+        "raf": "3.4.0",
+        "rst-selector-parser": "2.2.3"
+      },
+      "dependencies": {
+        "lodash": {
+          "version": "4.17.4",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+        }
+      }
+    },
+    "enzyme-adapter-react-16": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/enzyme-adapter-react-16/-/enzyme-adapter-react-16-1.1.0.tgz",
+      "integrity": "sha512-OlZJn5PJUJ91EOQQRuISZpXgPlqT9fYR2yBZQPu9UYok+wS19Rn4teXywF34LMcyw2AzE1s0ZRDtcI952/vQHg==",
+      "requires": {
+        "enzyme-adapter-utils": "1.2.0",
+        "lodash": "4.17.4",
+        "object.assign": "4.0.4",
+        "object.values": "1.0.4",
         "prop-types": "15.6.0",
-        "uuid": "3.1.0"
+        "react-test-renderer": "16.2.0"
+      },
+      "dependencies": {
+        "lodash": {
+          "version": "4.17.4",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
+          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+        }
+      }
+    },
+    "enzyme-adapter-utils": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/enzyme-adapter-utils/-/enzyme-adapter-utils-1.2.0.tgz",
+      "integrity": "sha512-6CeIrmymLWoQgvH5m/ixJLaCsa6pSoWU2nlMeO0nHCZR8LQ+tKzP/jPh4qceTPlB4oFfyMRFeqr0+IryY4gAxg==",
+      "requires": {
+        "lodash": "4.17.4",
+        "object.assign": "4.0.4",
+        "prop-types": "15.6.0"
       },
       "dependencies": {
         "lodash": {
@@ -4537,11 +4424,11 @@
       }
     },
     "errno": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.4.tgz",
-      "integrity": "sha1-uJbiOp5ei6M4cfyZar02NfyaHH0=",
+      "version": "0.1.6",
+      "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.6.tgz",
+      "integrity": "sha512-IsORQDpaaSwcDP4ZZnHxgE85werpo34VYn1Ud3mq+eUsF593faR8oCZNXrROVkpFu2TsbrNhHin0aUrTsQ9vNw==",
       "requires": {
-        "prr": "0.0.0"
+        "prr": "1.0.1"
       }
     },
     "error-ex": {
@@ -4917,13 +4804,6 @@
         "type-is": "1.6.15",
         "utils-merge": "1.0.1",
         "vary": "1.1.2"
-      },
-      "dependencies": {
-        "path-to-regexp": {
-          "version": "0.1.7",
-          "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
-          "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
-        }
       }
     },
     "extend": {
@@ -5040,9 +4920,9 @@
       }
     },
     "file-loader": {
-      "version": "0.11.1",
-      "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.11.1.tgz",
-      "integrity": "sha1-azKO4SNKcp5OR9Njdd1tNcDh24Q=",
+      "version": "0.11.2",
+      "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-0.11.2.tgz",
+      "integrity": "sha512-N+uhF3mswIFeziHQjGScJ/yHXYt3DiLBeC+9vWW+WjUBiClMSOlV1YrXQi+7KM2aA3Rn4Bybgv+uXFQbfkzpvg==",
       "requires": {
         "loader-utils": "1.1.0"
       }
@@ -5611,7 +5491,7 @@
       "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-5.0.3.tgz",
       "integrity": "sha1-ukAsJmGU8VlW7xXg/PJCmT9qff0=",
       "requires": {
-        "ajv": "5.5.0",
+        "ajv": "5.5.1",
         "har-schema": "2.0.0"
       }
     },
@@ -5698,6 +5578,11 @@
         "sntp": "2.1.0"
       }
     },
+    "he": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/he/-/he-1.1.1.tgz",
+      "integrity": "sha1-k0EP0hsAlzUVH4howvJx80J+I/0="
+    },
     "highlight.js": {
       "version": "9.12.0",
       "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-9.12.0.tgz",
@@ -6000,9 +5885,9 @@
       "integrity": "sha1-vjPUCsEO8ZJnAfbwii2G+/0a0+Q="
     },
     "immutability-helper": {
-      "version": "2.5.1",
-      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.5.1.tgz",
-      "integrity": "sha512-5bf/qTcnP1LbViXgj845PGW6a6ekQh2kkTf5kBo5zQopHROGHZS7vHGYwfS2y6wjKnmQtCbky0/rNXG6Yk+CrA==",
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.6.2.tgz",
+      "integrity": "sha512-2boGYtiA++szFIXl9tlTJ7f2emec+3UCaRjv8Ixnw62G43rz2n+vZ5kfs6fUmCORKuhJHFR2oSuAxBgrMxt95g==",
       "requires": {
         "invariant": "2.2.2"
       }
@@ -6365,13 +6250,13 @@
       "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-1.0.0.tgz",
       "integrity": "sha1-ZHdYK4IU1gI0YJRWcAO+ip6sBNw=",
       "requires": {
-        "is-path-inside": "1.0.0"
+        "is-path-inside": "1.0.1"
       }
     },
     "is-path-inside": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-1.0.0.tgz",
-      "integrity": "sha1-/AbloWg/vaE95mev9xe7wQpI838=",
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-1.0.1.tgz",
+      "integrity": "sha1-jvW33lBDej/cprToZe96pVy0gDY=",
       "requires": {
         "path-is-inside": "1.0.2"
       }
@@ -7212,14 +7097,14 @@
         "hoek": "4.2.0",
         "isemail": "2.2.1",
         "items": "2.1.1",
-        "moment": "2.19.3",
+        "moment": "2.19.4",
         "topo": "2.0.2"
       }
     },
     "js-base64": {
-      "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.3.2.tgz",
-      "integrity": "sha512-Y2/+DnfJJXT1/FCwUebUhLWb3QihxiSC42+ctHLGogmW2jPY6LCapMdFZXRvVP2z6qyKW7s6qncE/9gSqZiArw=="
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.4.0.tgz",
+      "integrity": "sha512-Wehd+7Pf9tFvGb+ydPm9TjYjV8X1YHOVyG8QyELZxEMqOhemVwGRmoG8iQ/soqI3n8v4xn59zaLxiCJiaaRzKA=="
     },
     "js-tokens": {
       "version": "3.0.2",
@@ -7349,9 +7234,9 @@
       "integrity": "sha1-2ouEvUfeU5WHj5XWTQLyRJ/gXms="
     },
     "kind-of": {
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.1.tgz",
-      "integrity": "sha512-y/15y6w31q9eVnXhVLPQkI7MD6JyuPNqEnetl8bZEc+mngLuonHQJ0x/6BD1WX6ml0Ig/psUlyKZJxz8uUo1xQ=="
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.2.tgz",
+      "integrity": "sha512-s5kLOcnH0XqDO+FvuaLX8DDjZ18CGFk7VygH40QoKPUQhW4e2rvM0rwUq0t8IQDOwYSeLK01U90OjzBTme2QqA=="
     },
     "klaw": {
       "version": "1.3.1",
@@ -7515,16 +7400,6 @@
       "resolved": "https://registry.npmjs.org/lodash.assign/-/lodash.assign-4.2.0.tgz",
       "integrity": "sha1-DZnzzNem0mHRm9rrkkUAXShYCOc="
     },
-    "lodash.assignin": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/lodash.assignin/-/lodash.assignin-4.2.0.tgz",
-      "integrity": "sha1-uo31+4QesKPoBEIysOJjqNxqKKI="
-    },
-    "lodash.bind": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/lodash.bind/-/lodash.bind-4.2.1.tgz",
-      "integrity": "sha1-euMBfpOWIqwxt9fX3LGzTbFpDTU="
-    },
     "lodash.camelcase": {
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz",
@@ -7550,31 +7425,11 @@
       "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
       "integrity": "sha1-gteb/zCmfEAF/9XiUVMArZyk168="
     },
-    "lodash.defaults": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-4.2.0.tgz",
-      "integrity": "sha1-0JF4cW/+pN3p5ft7N/bwgCJ0WAw="
-    },
-    "lodash.filter": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/lodash.filter/-/lodash.filter-4.6.0.tgz",
-      "integrity": "sha1-ZosdSYFgOuHMWm+nYBQ+SAtMSs4="
-    },
-    "lodash.flatten": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/lodash.flatten/-/lodash.flatten-4.4.0.tgz",
-      "integrity": "sha1-8xwiIlqWMtK7+OSt2+8kCqdlph8="
-    },
     "lodash.flattendeep": {
       "version": "4.4.0",
       "resolved": "https://registry.npmjs.org/lodash.flattendeep/-/lodash.flattendeep-4.4.0.tgz",
       "integrity": "sha1-+wMJF/hqMTTlvJvsDWngAT3f7bI="
     },
-    "lodash.foreach": {
-      "version": "4.5.0",
-      "resolved": "https://registry.npmjs.org/lodash.foreach/-/lodash.foreach-4.5.0.tgz",
-      "integrity": "sha1-Gmo16s5AEoDH8G3d7DUWWrJ+PlM="
-    },
     "lodash.get": {
       "version": "4.4.2",
       "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
@@ -7610,21 +7465,11 @@
         "lodash.isarray": "3.0.4"
       }
     },
-    "lodash.map": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/lodash.map/-/lodash.map-4.6.0.tgz",
-      "integrity": "sha1-dx7Hg540c9nEzeKLGTlMNWL09tM="
-    },
     "lodash.memoize": {
       "version": "4.1.2",
       "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz",
       "integrity": "sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4="
     },
-    "lodash.merge": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.0.tgz",
-      "integrity": "sha1-aYhLoUSsM/5plzemCG3v+t0PicU="
-    },
     "lodash.mergewith": {
       "version": "4.6.0",
       "resolved": "https://registry.npmjs.org/lodash.mergewith/-/lodash.mergewith-4.6.0.tgz",
@@ -7635,16 +7480,6 @@
       "resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz",
       "integrity": "sha1-UvBWEP/53tQiYRRB7R/BI6AwAbM="
     },
-    "lodash.reduce": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/lodash.reduce/-/lodash.reduce-4.6.0.tgz",
-      "integrity": "sha1-8atrg5KZrUj3hKu/R2WW8DuRTTs="
-    },
-    "lodash.reject": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/lodash.reject/-/lodash.reject-4.6.0.tgz",
-      "integrity": "sha1-gNZJLcFHCGS79YNTO2UfQqn1JBU="
-    },
     "lodash.some": {
       "version": "4.6.0",
       "resolved": "https://registry.npmjs.org/lodash.some/-/lodash.some-4.6.0.tgz",
@@ -7751,9 +7586,9 @@
       }
     },
     "marked": {
-      "version": "0.3.6",
-      "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.6.tgz",
-      "integrity": "sha1-ssbGGPzOzk74bE/Gy4p8v1rtqNc="
+      "version": "0.3.7",
+      "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.7.tgz",
+      "integrity": "sha512-zBEP4qO1YQp5aXHt8S5wTiOv9i2X74V/LQL0zhUNvVaklt6Ywa6lChxIvS+ibYlCGgADwKwZFhjC3+XfpsvQvQ=="
     },
     "marked-terminal": {
       "version": "1.7.0",
@@ -7834,7 +7669,7 @@
       "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.4.1.tgz",
       "integrity": "sha1-OpoguEYlI+RHz7x+i7gO1me/xVI=",
       "requires": {
-        "errno": "0.1.4",
+        "errno": "0.1.6",
         "readable-stream": "2.3.3"
       }
     },
@@ -7960,7 +7795,7 @@
         "extend-shallow": "2.0.1",
         "extglob": "2.0.2",
         "fragment-cache": "0.2.1",
-        "kind-of": "6.0.1",
+        "kind-of": "6.0.2",
         "nanomatch": "1.2.6",
         "object.pick": "1.3.0",
         "regex-not": "1.0.0",
@@ -8032,12 +7867,22 @@
       "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0="
     },
     "mixin-deep": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/mixin-deep/-/mixin-deep-1.2.0.tgz",
-      "integrity": "sha1-0CuMb4ttS49ZgtP9AJxJGYUcP+I=",
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/mixin-deep/-/mixin-deep-1.3.0.tgz",
+      "integrity": "sha512-dgaCvoh6i1nosAUBKb0l0pfJ78K8+S9fluyIR2YvAeUD/QuMahnFnF3xYty5eYXMjhGSsB0DsW6A0uAZyetoAg==",
       "requires": {
         "for-in": "1.0.2",
-        "is-extendable": "0.1.1"
+        "is-extendable": "1.0.1"
+      },
+      "dependencies": {
+        "is-extendable": {
+          "version": "1.0.1",
+          "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-1.0.1.tgz",
+          "integrity": "sha512-arnXMxT1hhoKo9k1LZdmlNyJdDDfy2v0fXjFlmok4+i8ul/6WlbVge9bhM74OpNPQPMGUToDtz+KXa1PneJxOA==",
+          "requires": {
+            "is-plain-object": "2.0.4"
+          }
+        }
       }
     },
     "mixin-object": {
@@ -8070,17 +7915,18 @@
       "integrity": "sha1-dVSm+Nhxg0zJe1RisSLEwSTW3pE="
     },
     "mocha": {
-      "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.3.0.tgz",
-      "integrity": "sha1-0pt0KNP1LILi5l3x7LcGThqrv7U=",
+      "version": "3.5.3",
+      "resolved": "https://registry.npmjs.org/mocha/-/mocha-3.5.3.tgz",
+      "integrity": "sha512-/6na001MJWEtYxHOV1WLfsmR4YIynkUEhBwzsb+fk2qmQ3iqsi258l/Q2MWHJMImAcNpZ8DEdYAK72NHoIQ9Eg==",
       "requires": {
         "browser-stdout": "1.3.0",
         "commander": "2.9.0",
-        "debug": "2.6.0",
+        "debug": "2.6.8",
         "diff": "3.2.0",
         "escape-string-regexp": "1.0.5",
         "glob": "7.1.1",
         "growl": "1.9.2",
+        "he": "1.1.1",
         "json3": "3.3.2",
         "lodash.create": "3.1.1",
         "mkdirp": "0.5.1",
@@ -8096,11 +7942,11 @@
           }
         },
         "debug": {
-          "version": "2.6.0",
-          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.0.tgz",
-          "integrity": "sha1-vFlryr52F/Edn6FTYe3tVgi4SZs=",
+          "version": "2.6.8",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.8.tgz",
+          "integrity": "sha1-5zFTHKLt4n0YgiJCfaF4IdaP9Pw=",
           "requires": {
-            "ms": "0.7.2"
+            "ms": "2.0.0"
           }
         },
         "diff": {
@@ -8126,11 +7972,6 @@
           "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-1.0.0.tgz",
           "integrity": "sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo="
         },
-        "ms": {
-          "version": "0.7.2",
-          "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.2.tgz",
-          "integrity": "sha1-riXPJRKziFodldfwN4aNhDESR2U="
-        },
         "supports-color": {
           "version": "3.1.2",
           "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-3.1.2.tgz",
@@ -8142,9 +7983,9 @@
       }
     },
     "moment": {
-      "version": "2.19.3",
-      "resolved": "https://registry.npmjs.org/moment/-/moment-2.19.3.tgz",
-      "integrity": "sha1-vbmdJw1tf9p4zA+6zoVeJ/59pp8="
+      "version": "2.19.4",
+      "resolved": "https://registry.npmjs.org/moment/-/moment-2.19.4.tgz",
+      "integrity": "sha512-1xFTAknSLfc47DIxHDUbnJWC+UwgWxATmymaxIPQpmMh7LBm7ZbwVEsuushqwL2GYZU0jie4xO+TK44hJPjNSQ=="
     },
     "ms": {
       "version": "2.0.0",
@@ -8205,16 +8046,21 @@
         }
       }
     },
-    "native-promise-only": {
-      "version": "0.8.1",
-      "resolved": "https://registry.npmjs.org/native-promise-only/-/native-promise-only-0.8.1.tgz",
-      "integrity": "sha1-IKMYwwy0X3H+et+/eyHJnBRy7xE="
-    },
     "natural-compare": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz",
       "integrity": "sha1-Sr6/7tdUHywnrPspvbvRXI1bpPc="
     },
+    "nearley": {
+      "version": "2.11.0",
+      "resolved": "https://registry.npmjs.org/nearley/-/nearley-2.11.0.tgz",
+      "integrity": "sha512-clqqhEuP0ZCJQ85Xv2I/4o2Gs/fvSR6fCg5ZHVE2c8evWyNk2G++ih4JOO3lMb/k/09x6ihQ2nzKUlB/APCWjg==",
+      "requires": {
+        "nomnom": "1.6.2",
+        "railroad-diagrams": "1.0.0",
+        "randexp": "0.4.6"
+      }
+    },
     "negotiator": {
       "version": "0.6.1",
       "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.1.tgz",
@@ -8250,10 +8096,23 @@
         "text-encoding": "0.6.4"
       },
       "dependencies": {
+        "isarray": {
+          "version": "0.0.1",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
+        },
         "lolex": {
           "version": "1.6.0",
           "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
           "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
+        },
+        "path-to-regexp": {
+          "version": "1.7.0",
+          "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.7.0.tgz",
+          "integrity": "sha1-Wf3g9DW62suhA6hOnTvGTpa5k30=",
+          "requires": {
+            "isarray": "0.0.1"
+          }
         }
       }
     },
@@ -8542,6 +8401,22 @@
         }
       }
     },
+    "nomnom": {
+      "version": "1.6.2",
+      "resolved": "https://registry.npmjs.org/nomnom/-/nomnom-1.6.2.tgz",
+      "integrity": "sha1-hKZqJgF0QI/Ft3oY+IjszET7aXE=",
+      "requires": {
+        "colors": "0.5.1",
+        "underscore": "1.4.4"
+      },
+      "dependencies": {
+        "colors": {
+          "version": "0.5.1",
+          "resolved": "https://registry.npmjs.org/colors/-/colors-0.5.1.tgz",
+          "integrity": "sha1-fQAj6usVTo7p/Oddy5I9DtFmd3Q="
+        }
+      }
+    },
     "nopt": {
       "version": "3.0.6",
       "resolved": "https://registry.npmjs.org/nopt/-/nopt-3.0.6.tgz",
@@ -8764,22 +8639,22 @@
       "integrity": "sha1-EEEktsYCxnlogaBCVB0220OlJk4="
     },
     "office-ui-fabric-core": {
-      "version": "9.2.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-9.2.0.tgz",
-      "integrity": "sha1-XaNUX43wnxcsbDzXcoj02U1eB88="
+      "version": "9.3.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-9.3.0.tgz",
+      "integrity": "sha1-FE19kSUBS9+lf41fXmptgl2EJ0I="
     },
     "office-ui-fabric-react": {
-      "version": "5.27.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.27.0.tgz",
-      "integrity": "sha512-qrh/rZncfvYO38HGR27ctVx2Y315ScAnMyQwzJI7LNg/F5Zx/LjEM14/02iYtPzCGKd9VGsho0kqMIxIBuu3hQ==",
-      "requires": {
-        "@microsoft/load-themed-styles": "1.7.11",
-        "@uifabric/icons": "5.2.0",
-        "@uifabric/merge-styles": "5.7.0",
-        "@uifabric/styling": "5.11.1",
+      "version": "5.33.1",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.33.1.tgz",
+      "integrity": "sha512-LrE9EYmXQ9tTZG/gtsKhWnrym2WB0TrmQ7WfyYclQXeJmt1PB6F80sUdzddNrgmsPz7Q0KJboeV4m6nASBCQDQ==",
+      "requires": {
+        "@microsoft/load-themed-styles": "1.7.14",
+        "@uifabric/icons": "5.3.0",
+        "@uifabric/merge-styles": "5.8.1",
+        "@uifabric/styling": "5.14.0",
         "@uifabric/utilities": "5.5.0",
         "prop-types": "15.6.0",
-        "tslib": "1.8.0"
+        "tslib": "1.8.1"
       }
     },
     "on-finished": {
@@ -9064,19 +8939,9 @@
       "integrity": "sha1-PBrfhx6pzWyUMbbqK9dKD/BVxME="
     },
     "path-to-regexp": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.7.0.tgz",
-      "integrity": "sha1-Wf3g9DW62suhA6hOnTvGTpa5k30=",
-      "requires": {
-        "isarray": "0.0.1"
-      },
-      "dependencies": {
-        "isarray": {
-          "version": "0.0.1",
-          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
-          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
-        }
-      }
+      "version": "0.1.7",
+      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.7.tgz",
+      "integrity": "sha1-32BBeABfUi8V60SQ5yR6G/qmf4w="
     },
     "path-type": {
       "version": "2.0.0",
@@ -9222,7 +9087,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9287,7 +9152,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9351,7 +9216,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9414,7 +9279,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9477,7 +9342,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9540,7 +9405,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9603,7 +9468,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9667,7 +9532,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9731,7 +9596,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9844,7 +9709,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9907,7 +9772,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9949,8 +9814,8 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000775",
-            "electron-to-chromium": "1.3.27"
+            "caniuse-db": "1.0.30000783",
+            "electron-to-chromium": "1.3.28"
           }
         },
         "chalk": {
@@ -9983,7 +9848,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10053,7 +9918,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10117,7 +9982,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10183,7 +10048,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10249,7 +10114,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10358,7 +10223,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10424,7 +10289,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10488,7 +10353,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10552,7 +10417,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10615,7 +10480,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10680,7 +10545,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10756,7 +10621,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10821,7 +10686,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10891,7 +10756,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.3.2",
+            "js-base64": "2.4.0",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -11015,9 +10880,9 @@
       }
     },
     "prr": {
-      "version": "0.0.0",
-      "resolved": "https://registry.npmjs.org/prr/-/prr-0.0.0.tgz",
-      "integrity": "sha1-GoS4WQgyVQFBGFPQCB7j+obikmo="
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/prr/-/prr-1.0.1.tgz",
+      "integrity": "sha1-0/wRS6BplaRexok/SEzrHXj19HY="
     },
     "pseudomap": {
       "version": "1.0.2",
@@ -11097,6 +10962,28 @@
         }
       }
     },
+    "raf": {
+      "version": "3.4.0",
+      "resolved": "https://registry.npmjs.org/raf/-/raf-3.4.0.tgz",
+      "integrity": "sha512-pDP/NMRAXoTfrhCfyfSEwJAKLaxBU9eApMeBPB1TkDouZmvPerIClV8lTAd+uF8ZiTaVl69e1FCxQrAd/VTjGw==",
+      "requires": {
+        "performance-now": "2.1.0"
+      }
+    },
+    "railroad-diagrams": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/railroad-diagrams/-/railroad-diagrams-1.0.0.tgz",
+      "integrity": "sha1-635iZ1SN3t+4mcG5Dlc3RVnN234="
+    },
+    "randexp": {
+      "version": "0.4.6",
+      "resolved": "https://registry.npmjs.org/randexp/-/randexp-0.4.6.tgz",
+      "integrity": "sha512-80WNmd9DA0tmZrw9qQa62GPPWfuXJknrmVmLcxvq4uZBdYqb1wYoKTmnlGUchvVWe0XiLupYkBoXVOxz3C8DYQ==",
+      "requires": {
+        "discontinuous-range": "1.0.0",
+        "ret": "0.1.15"
+      }
+    },
     "randomatic": {
       "version": "1.1.7",
       "resolved": "https://registry.npmjs.org/randomatic/-/randomatic-1.1.7.tgz",
@@ -11155,22 +11042,16 @@
       "integrity": "sha1-DD0L6u2KAclm2Xh793goElKpeao="
     },
     "react": {
-      "version": "15.6.2",
-      "resolved": "https://registry.npmjs.org/react/-/react-15.6.2.tgz",
-      "integrity": "sha1-26BDSrQ5z+gvEI8PURZjkIF5qnI=",
+      "version": "16.2.0",
+      "resolved": "https://registry.npmjs.org/react/-/react-16.2.0.tgz",
+      "integrity": "sha512-ZmIomM7EE1DvPEnSFAHZn9Vs9zJl5A9H7el0EGTE6ZbW9FKe/14IYAlPbC8iH25YarEQxZL+E8VW7Mi7kfQrDQ==",
       "requires": {
-        "create-react-class": "15.6.2",
         "fbjs": "0.8.16",
         "loose-envify": "1.3.1",
         "object-assign": "4.1.1",
         "prop-types": "15.6.0"
       }
     },
-    "react-addons-test-utils": {
-      "version": "15.6.2",
-      "resolved": "https://registry.npmjs.org/react-addons-test-utils/-/react-addons-test-utils-15.6.2.tgz",
-      "integrity": "sha1-wStu/cIkfBDae4dw0YUICnsEcVY="
-    },
     "react-docgen": {
       "version": "2.20.0",
       "resolved": "https://registry.npmjs.org/react-docgen/-/react-docgen-2.20.0.tgz",
@@ -11193,9 +11074,9 @@
       }
     },
     "react-dom": {
-      "version": "15.6.2",
-      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-15.6.2.tgz",
-      "integrity": "sha1-Qc+t9pO3V/rycIRDodH9WgK+9zA=",
+      "version": "16.2.0",
+      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.2.0.tgz",
+      "integrity": "sha512-zpGAdwHVn9K0091d+hr+R0qrjoJ84cIBFL2uU60KvWBPfZ7LPSrfqviTxGHWN0sjPZb2hxWzMexwrvJdKePvjg==",
       "requires": {
         "fbjs": "0.8.16",
         "loose-envify": "1.3.1",
@@ -11204,13 +11085,38 @@
       }
     },
     "react-highlight": {
-      "version": "0.9.0",
-      "resolved": "https://registry.npmjs.org/react-highlight/-/react-highlight-0.9.0.tgz",
-      "integrity": "sha1-1e3udEzLhon3k4eUtqG1VLsVDrc=",
+      "version": "0.10.0",
+      "resolved": "https://registry.npmjs.org/react-highlight/-/react-highlight-0.10.0.tgz",
+      "integrity": "sha1-04b53Oq4Z9wNzCNkFT+xzHZF0EY=",
       "requires": {
         "highlight.js": "9.12.0",
         "react": "15.6.2",
         "react-dom": "15.6.2"
+      },
+      "dependencies": {
+        "react": {
+          "version": "15.6.2",
+          "resolved": "https://registry.npmjs.org/react/-/react-15.6.2.tgz",
+          "integrity": "sha1-26BDSrQ5z+gvEI8PURZjkIF5qnI=",
+          "requires": {
+            "create-react-class": "15.6.2",
+            "fbjs": "0.8.16",
+            "loose-envify": "1.3.1",
+            "object-assign": "4.1.1",
+            "prop-types": "15.6.0"
+          }
+        },
+        "react-dom": {
+          "version": "15.6.2",
+          "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-15.6.2.tgz",
+          "integrity": "sha1-Qc+t9pO3V/rycIRDodH9WgK+9zA=",
+          "requires": {
+            "fbjs": "0.8.16",
+            "loose-envify": "1.3.1",
+            "object-assign": "4.1.1",
+            "prop-types": "15.6.0"
+          }
+        }
       }
     },
     "react-html-attributes": {
@@ -11235,21 +11141,22 @@
       }
     },
     "react-inspector": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/react-inspector/-/react-inspector-2.2.1.tgz",
-      "integrity": "sha512-aXrxJTfriJtZtv/+A9cFIOpfbt711yCD1Ht3fSn3JyuDaAt1+eLtb01R5d/8gGpyquOVWn/d+eM1VPqFXS7UZA==",
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/react-inspector/-/react-inspector-2.2.2.tgz",
+      "integrity": "sha512-SzkmYvVUJEmUBuFwGgaGOTGucUBnKXH2wWFdzatkCrawm4P85eqgYvqevHE3DGWpfXqE1pJO4d98TYUANQGCrg==",
       "requires": {
         "babel-runtime": "6.26.0",
         "is-dom": "1.0.9"
       }
     },
     "react-modal": {
-      "version": "3.1.5",
-      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.1.5.tgz",
-      "integrity": "sha512-EjM32L9JPVibJJgu22QySo9d+tl0POaRTmuM7LmsVkx0U+G9tl4LGLrs2DLNOQp0Oko/5nEF/Rwp/h2noucMAw==",
+      "version": "3.1.8",
+      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.1.8.tgz",
+      "integrity": "sha512-cp5fSUBuwkyojclrxZuWXudK2kTBycbDG9Eg1t/bEPdUVBW6vDiGE+4eZg7bVwMyFtiwvyVJ2ugdCOFllNPReg==",
       "requires": {
         "exenv": "1.2.2",
-        "prop-types": "15.6.0"
+        "prop-types": "15.6.0",
+        "warning": "3.0.0"
       }
     },
     "react-remarkable": {
@@ -11270,13 +11177,6 @@
         "inline-style-prefixer": "3.0.8",
         "prop-types": "15.6.0",
         "react-style-proptype": "3.1.0"
-      },
-      "dependencies": {
-        "@types/react": {
-          "version": "16.0.25",
-          "resolved": "https://registry.npmjs.org/@types/react/-/react-16.0.25.tgz",
-          "integrity": "sha512-K79zMwWRzQ2db+nPoKpi3gA/KmLo6ZQgT4iO2QPEUdBO7as0PcgrmU9KHYzIO3V6lbD7gRjOM0/nUch6xBfOvQ=="
-        }
       }
     },
     "react-style-proptype": {
@@ -11288,12 +11188,13 @@
       }
     },
     "react-test-renderer": {
-      "version": "15.6.2",
-      "resolved": "https://registry.npmjs.org/react-test-renderer/-/react-test-renderer-15.6.2.tgz",
-      "integrity": "sha1-0DM0NPwsQ4CSaWyncNpe1IA376g=",
+      "version": "16.2.0",
+      "resolved": "https://registry.npmjs.org/react-test-renderer/-/react-test-renderer-16.2.0.tgz",
+      "integrity": "sha512-Kd4gJFtpNziR9ElOE/C23LeflKLZPRpNQYWP3nQBY43SJ5a+xyEGSeMrm2zxNKXcnCbBS/q1UpD9gqd5Dv+rew==",
       "requires": {
         "fbjs": "0.8.16",
-        "object-assign": "4.1.1"
+        "object-assign": "4.1.1",
+        "prop-types": "15.6.0"
       }
     },
     "react-transition-group": {
@@ -11371,7 +11272,7 @@
       "integrity": "sha512-y7ANxCWmMW8xLOaiopiRDlyjQ9ajKRENBH+2wjntIbk3A6ZR1+BLQttkmSHMY7Arl+AAZFwJ10grg2T6f1WI8A==",
       "requires": {
         "ast-types": "0.10.1",
-        "core-js": "2.5.1",
+        "core-js": "2.5.3",
         "esprima": "4.0.0",
         "private": "0.1.8",
         "source-map": "0.6.1"
@@ -11535,6 +11436,11 @@
             "underscore": "1.7.0",
             "underscore.string": "2.4.0"
           }
+        },
+        "underscore": {
+          "version": "1.7.0",
+          "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.7.0.tgz",
+          "integrity": "sha1-a7rwh3UA02vjTsqlhODbn+8DUgk="
         }
       }
     },
@@ -11679,6 +11585,11 @@
         "signal-exit": "3.0.2"
       }
     },
+    "ret": {
+      "version": "0.1.15",
+      "resolved": "https://registry.npmjs.org/ret/-/ret-0.1.15.tgz",
+      "integrity": "sha512-TTlYpa+OL+vMMNG24xSlQGEJ3B/RzEfUlLct7b5G/ytav+wPrplCpVMFuwzXbkecJrb6IYo1iFb0S9v37754mg=="
+    },
     "right-align": {
       "version": "0.1.3",
       "resolved": "https://registry.npmjs.org/right-align/-/right-align-0.1.3.tgz",
@@ -11704,6 +11615,15 @@
         "inherits": "2.0.3"
       }
     },
+    "rst-selector-parser": {
+      "version": "2.2.3",
+      "resolved": "https://registry.npmjs.org/rst-selector-parser/-/rst-selector-parser-2.2.3.tgz",
+      "integrity": "sha1-gbIw6i/MYGbInjRy3nlChdmwPZE=",
+      "requires": {
+        "lodash.flattendeep": "4.4.0",
+        "nearley": "2.11.0"
+      }
+    },
     "run-async": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/run-async/-/run-async-2.3.0.tgz",
@@ -11918,7 +11838,7 @@
       "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-0.3.0.tgz",
       "integrity": "sha1-9YdyIs4+kx7a4DnxfrNxbnE3+M8=",
       "requires": {
-        "ajv": "5.5.0"
+        "ajv": "5.5.1"
       }
     },
     "screener-runner": {
@@ -12137,9 +12057,9 @@
       }
     },
     "screener-storybook": {
-      "version": "0.9.10",
-      "resolved": "https://registry.npmjs.org/screener-storybook/-/screener-storybook-0.9.10.tgz",
-      "integrity": "sha1-FFYWymnkLpi87NTpArXn/xxDVog=",
+      "version": "0.9.15",
+      "resolved": "https://registry.npmjs.org/screener-storybook/-/screener-storybook-0.9.15.tgz",
+      "integrity": "sha1-EtU1lXPUBH5G1LwCgHC2TMbqKmU=",
       "requires": {
         "bluebird": "3.4.7",
         "colors": "1.1.2",
@@ -12153,7 +12073,7 @@
         "react-dom": "15.4.2",
         "request": "2.81.0",
         "requestretry": "1.12.2",
-        "screener-runner": "0.7.7"
+        "screener-runner": "0.7.12"
       },
       "dependencies": {
         "acorn": {
@@ -12362,6 +12282,17 @@
           "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
           "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         },
+        "ngrok": {
+          "version": "github:screener-io/ngrok#ca2e459b401722ae8c033491aaacaf87125cd238",
+          "requires": {
+            "@types/node": "8.0.26",
+            "async": "2.6.0",
+            "decompress-zip": "0.3.0",
+            "lock": "0.1.4",
+            "request": "2.81.0",
+            "uuid": "3.1.0"
+          }
+        },
         "node-uuid": {
           "version": "1.4.8",
           "resolved": "https://registry.npmjs.org/node-uuid/-/node-uuid-1.4.8.tgz",
@@ -12377,6 +12308,18 @@
           "resolved": "https://registry.npmjs.org/qs/-/qs-6.4.0.tgz",
           "integrity": "sha1-E+JtKK1rD/qpExLNO/cI7TUecjM="
         },
+        "react": {
+          "version": "15.6.2",
+          "resolved": "https://registry.npmjs.org/react/-/react-15.6.2.tgz",
+          "integrity": "sha1-26BDSrQ5z+gvEI8PURZjkIF5qnI=",
+          "requires": {
+            "create-react-class": "15.6.2",
+            "fbjs": "0.8.16",
+            "loose-envify": "1.3.1",
+            "object-assign": "4.1.1",
+            "prop-types": "15.6.0"
+          }
+        },
         "react-dom": {
           "version": "15.4.2",
           "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-15.4.2.tgz",
@@ -12417,9 +12360,9 @@
           }
         },
         "screener-runner": {
-          "version": "0.7.7",
-          "resolved": "https://registry.npmjs.org/screener-runner/-/screener-runner-0.7.7.tgz",
-          "integrity": "sha1-RPnGR7sD13g/E7kWi+NfXsK/30U=",
+          "version": "0.7.12",
+          "resolved": "https://registry.npmjs.org/screener-runner/-/screener-runner-0.7.12.tgz",
+          "integrity": "sha1-2+wn4gRAVEueDBFFQK5fEGm6sm4=",
           "requires": {
             "bluebird": "3.4.7",
             "colors": "1.1.2",
@@ -12429,7 +12372,7 @@
             "http-proxy": "1.16.2",
             "joi": "9.2.0",
             "lodash": "4.16.6",
-            "ngrok": "2.2.24",
+            "ngrok": "github:screener-io/ngrok#ca2e459b401722ae8c033491aaacaf87125cd238",
             "portfinder": "1.0.13",
             "request": "2.78.0",
             "request-promise": "4.1.1"
@@ -12459,7 +12402,7 @@
                 "hoek": "4.2.0",
                 "isemail": "2.2.1",
                 "items": "2.1.1",
-                "moment": "2.19.3",
+                "moment": "2.19.4",
                 "topo": "2.0.2"
               }
             },
@@ -12548,7 +12491,7 @@
       "resolved": "https://registry.npmjs.org/scss-tokenizer/-/scss-tokenizer-0.2.3.tgz",
       "integrity": "sha1-jrBtualyMzOCTT9VMGQRSYR85dE=",
       "requires": {
-        "js-base64": "2.3.2",
+        "js-base64": "2.4.0",
         "source-map": "0.4.4"
       },
       "dependencies": {
@@ -12771,9 +12714,9 @@
       "integrity": "sha1-tf3AjxKH6hF4Yo5BXiUTK3NkbG0="
     },
     "sinon": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/sinon/-/sinon-4.1.2.tgz",
-      "integrity": "sha512-5uLBZPdCWl59Lpbf45ygKj7Z0LVol+ftBe7RDIXOQV/sF58pcFmbK8raA7bt6eljNuGnvBP+/ZxlicVn0emDjA==",
+      "version": "4.1.3",
+      "resolved": "https://registry.npmjs.org/sinon/-/sinon-4.1.3.tgz",
+      "integrity": "sha512-c7u0ZuvBRX1eXuB4jN3BRCAOGiUTlM8SE3TxbJHrNiHUKL7wonujMOB6Fi1gQc00U91IscFORQHDga/eccqpbw==",
       "requires": {
         "diff": "3.4.0",
         "formatio": "1.2.0",
@@ -13280,9 +13223,9 @@
       }
     },
     "style-loader": {
-      "version": "0.18.2",
-      "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.18.2.tgz",
-      "integrity": "sha512-WPpJPZGUxWYHWIUMNNOYqql7zh85zGmr84FdTVWq52WTIkqlW9xSxD3QYWi/T31cqn9UNSsietVEgGn2aaSCzw==",
+      "version": "0.19.1",
+      "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.19.1.tgz",
+      "integrity": "sha512-IRE+ijgojrygQi3rsqT0U4dd+UcPCqcVvauZpCnQrGAlEe+FUIyrK93bUDScamesjP08JlQNsFJU+KmPedP5Og==",
       "requires": {
         "loader-utils": "1.1.0",
         "schema-utils": "0.3.0"
@@ -13721,27 +13664,26 @@
       }
     },
     "ts-jest": {
-      "version": "21.2.3",
-      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-21.2.3.tgz",
-      "integrity": "sha512-/gpl/RUPJMVZmERi360sKu5wzSriAg20HMRZsNgXY7sUWtmSn3iPxQcCBDUi2bmcRPtPOLTSijzWK3ZrlYkUhA==",
+      "version": "21.2.4",
+      "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-21.2.4.tgz",
+      "integrity": "sha512-Plk49Us+DcncpQcC8fhYwDUdhW96QB0Dv02etOLhzq+2HAvXfrEUys3teZ/BeyQ+r1rHxfGdNj4dB0Q5msZR3g==",
       "requires": {
         "babel-core": "6.26.0",
         "babel-plugin-istanbul": "4.1.5",
         "babel-plugin-transform-es2015-modules-commonjs": "6.26.0",
         "babel-preset-jest": "21.2.0",
         "cpx": "1.5.0",
-        "fs-extra": "4.0.2",
+        "fs-extra": "4.0.3",
         "jest-config": "21.2.1",
-        "jest-util": "21.2.1",
         "pkg-dir": "2.0.0",
         "source-map-support": "0.5.0",
         "yargs": "10.0.3"
       },
       "dependencies": {
         "fs-extra": {
-          "version": "4.0.2",
-          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-4.0.2.tgz",
-          "integrity": "sha1-+RcExT0bRh+JNFKwwwfZmXZHq2s=",
+          "version": "4.0.3",
+          "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-4.0.3.tgz",
+          "integrity": "sha512-q6rbdDd1o2mAnQreO7YADIxf/Whx4AHBiRf6d+/cVT8h44ss+lHgxf1FemcqDnQt9X3ct4McHr+JMGlYSsK7Cg==",
           "requires": {
             "graceful-fs": "4.1.11",
             "jsonfile": "4.0.0",
@@ -13794,9 +13736,9 @@
       }
     },
     "tslib": {
-      "version": "1.8.0",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.8.0.tgz",
-      "integrity": "sha512-ymKWWZJST0/CkgduC2qkzjMOWr4bouhuURNXCn/inEX0L57BnRG6FhX76o7FOnsjHazCjfU2LKeSrlS2sIKQJg=="
+      "version": "1.8.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.8.1.tgz",
+      "integrity": "sha1-aUavLR1lGnsYY7Ux1uWvpBqkTqw="
     },
     "tslint": {
       "version": "5.8.0",
@@ -13812,8 +13754,8 @@
         "minimatch": "3.0.4",
         "resolve": "1.5.0",
         "semver": "5.4.1",
-        "tslib": "1.8.0",
-        "tsutils": "2.13.0"
+        "tslib": "1.8.1",
+        "tsutils": "2.13.1"
       }
     },
     "tslint-microsoft-contrib": {
@@ -13836,15 +13778,15 @@
       "resolved": "https://registry.npmjs.org/tslint-react/-/tslint-react-3.2.0.tgz",
       "integrity": "sha1-hR+1BSAcY9A0PFFybmNk9+mtLpk=",
       "requires": {
-        "tsutils": "2.13.0"
+        "tsutils": "2.13.1"
       }
     },
     "tsutils": {
-      "version": "2.13.0",
-      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.13.0.tgz",
-      "integrity": "sha512-FuWzNJbMsp3gcZMbI3b5DomhW4Ia41vMxjN63nKWI0t7f+I3UmHfRl0TrXJTwI2LUduDG+eR1Mksp3pvtlyCFQ==",
+      "version": "2.13.1",
+      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.13.1.tgz",
+      "integrity": "sha512-XMOEvc2TiYesVSOJMI7OYPnBMSgcvERuGW5Li/J+2A0TuH607BPQnOLQ82oSPZCssB8c9+QGi6qhTBa/f1xQRA==",
       "requires": {
-        "tslib": "1.8.0"
+        "tslib": "1.8.1"
       }
     },
     "tty-browserify": {
@@ -13883,9 +13825,9 @@
       }
     },
     "typescript": {
-      "version": "2.4.2",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.4.2.tgz",
-      "integrity": "sha1-+DlfhdRZJ2BnyYiqQYN6j4KHCEQ="
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.6.2.tgz",
+      "integrity": "sha1-PFtv1/beCRQmkCfwPAlGdY92c6Q="
     },
     "typical": {
       "version": "2.6.1",
@@ -13967,9 +13909,9 @@
       "integrity": "sha512-UIEXBNeYmKptWH6z8ZnqTeS8fV74zG0/eRU9VGkpzz+LIJNs8W/zM/L+7ctCkRrgbNnnR0xxw4bKOr0cW0N0Og=="
     },
     "underscore": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.7.0.tgz",
-      "integrity": "sha1-a7rwh3UA02vjTsqlhODbn+8DUgk="
+      "version": "1.4.4",
+      "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.4.4.tgz",
+      "integrity": "sha1-YaajIBBiKvoHljvzJSA88SI51gQ="
     },
     "underscore.string": {
       "version": "2.4.0",
@@ -14305,13 +14247,13 @@
       "integrity": "sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg=="
     },
     "webpack": {
-      "version": "3.8.1",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-3.8.1.tgz",
-      "integrity": "sha512-5ZXLWWsMqHKFr5y0N3Eo5IIisxeEeRAajNq4mELb/WELOR7srdbQk2N5XiyNy2A/AgvlR3AmeBCZJW8lHrolbw==",
+      "version": "3.10.0",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-3.10.0.tgz",
+      "integrity": "sha512-fxxKXoicjdXNUMY7LIdY89tkJJJ0m1Oo8PQutZ5rLgWbV5QVKI15Cn7+/IHnRTd3vfKfiwBx6SBqlorAuNA8LA==",
       "requires": {
         "acorn": "5.2.1",
         "acorn-dynamic-import": "2.0.2",
-        "ajv": "5.5.0",
+        "ajv": "5.5.1",
         "ajv-keywords": "2.1.1",
         "async": "2.6.0",
         "enhanced-resolve": "3.4.1",
@@ -14441,9 +14383,9 @@
       }
     },
     "webpack-dev-server": {
-      "version": "2.9.5",
-      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.9.5.tgz",
-      "integrity": "sha512-o0lS6enIxyOPiRJTh8vcgK5TsGNTn7lH1q/pNniAgs46mCE8sQYeqv7Y/oAIh/+u4kiBsFizLJo5EWC+ezz6FQ==",
+      "version": "2.9.7",
+      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.9.7.tgz",
+      "integrity": "sha512-Pu7uoQFgQj5RE5wmlfkpYSzihMKxulwEuO2xCsaMnAnyRSApwoVi3B8WCm9XbigyWTHaIMzYGkB90Vr6leAeTQ==",
       "requires": {
         "ansi-html": "0.0.7",
         "array-includes": "3.0.3",
@@ -14661,7 +14603,7 @@
       "resolved": "https://registry.npmjs.org/worker-farm/-/worker-farm-1.5.2.tgz",
       "integrity": "sha512-XxiQ9kZN5n6mmnW+mFJ+wXjNNI/Nx4DIdaAKLX1Bn6LYBWlN/zaBhu34DQYPZ1AJobQuu67S2OfDdNSVULvXkQ==",
       "requires": {
-        "errno": "0.1.4",
+        "errno": "0.1.6",
         "xtend": "4.0.1"
       }
     },
@@ -14719,7 +14661,7 @@
         "filesize": "3.5.11",
         "lodash": "4.15.0",
         "mkdirp": "0.5.1",
-        "moment": "2.19.3"
+        "moment": "2.19.4"
       },
       "dependencies": {
         "ansi-styles": {
diff --git a/package.json b/package.json
index 65049d1a740e9..bdcdc5f08fce9 100644
--- a/package.json
+++ b/package.json
@@ -27,6 +27,6 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@microsoft/rush": "4.0.0"
+    "@microsoft/rush": "4.1.0"
   }
-}
+}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 3a13dab80e2fa..2448b14640f32 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -15,32 +15,26 @@
     "start": "node ../../scripts/start.js"
   },
   "devDependencies": {
-    "@types/chai": "3.4.35",
-    "@types/enzyme": "2.8.8",
     "@types/es6-promise": "0.0.32",
-    "@types/highlight.js": "9.1.9",
-    "@types/mocha": "2.2.39",
-    "@types/react": "15.6.7",
-    "@types/react-addons-test-utils": "0.14.18",
-    "@types/react-dom": "15.5.6",
+    "@types/highlight.js": "9.12.2",
+    "@types/react": "16.0.25",
+    "@types/react-dom": "16.0.3",
     "@types/webpack-env": "1.13.0",
-    "enzyme": "^2.9.1",
     "es6-weak-map": "^2.0.2",
     "es6-map": "^0.1.5",
     "es6-promise": "^4.1.0",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
-    "react": "^15.6.1",
-    "react-addons-test-utils": "^15.4.2",
-    "react-dom": "^15.6.1"
+    "react": "^16.2.0",
+    "react-dom": "^16.2.0"
   },
   "peerDependencies": {
-    "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0"
+    "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
+    "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
     "@uifabric/styling": ">=5.14.0 <6.0.0",
     "@uifabric/utilities": ">=5.5.0 <6.0.0",
-    "highlight.js": "^9.9.0",
+    "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/example-app-base/tsconfig.json b/packages/example-app-base/tsconfig.json
index fab4710f79a9b..c11f1177c7355 100644
--- a/packages/example-app-base/tsconfig.json
+++ b/packages/example-app-base/tsconfig.json
@@ -18,8 +18,6 @@
       "dom"
     ],
     "types": [
-      "chai",
-      "mocha",
       "webpack-env"
     ]
   },
diff --git a/packages/experiments/index.html b/packages/experiments/index.html
index 91f6558f337b1..8f5cb70e7cb08 100644
--- a/packages/experiments/index.html
+++ b/packages/experiments/index.html
@@ -34,12 +34,12 @@
       }
     }
     loadScript(isProduction ? [
-      '//cdnjs.cloudflare.com/ajax/libs/react/15.4.0/react.min.js',
-      '//cdnjs.cloudflare.com/ajax/libs/react/15.4.0/react-dom.min.js',
+      '//cdnjs.cloudflare.com/ajax/libs/react/16.2.0/umd/react.production.min.js',
+      '//cdnjs.cloudflare.com/ajax/libs/react-dom/16.2.0/umd/react-dom.production.min.js',
       'demo-app.min.js'
     ] : [
-        '//cdnjs.cloudflare.com/ajax/libs/react/15.4.0/react.js',
-        '//cdnjs.cloudflare.com/ajax/libs/react/15.4.0/react-dom.js',
+        '//cdnjs.cloudflare.com/ajax/libs/react/16.2.0/umd/react.development.js',
+        '//cdnjs.cloudflare.com/ajax/libs/react-dom/16.2.0/umd/react-dom.development.js',
         'demo-app.js'
       ]);
   </script>
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 6542225e3970b..a2ebbaf1d274a 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -17,36 +17,36 @@
     "update-snapshots": "node ../../scripts/build.js jest -u"
   },
   "devDependencies": {
-    "@types/es6-promise": "^0.0.32",
-    "@types/prop-types": "15.5.1",
-    "@types/react": "15.6.7",
+    "@types/es6-promise": "0.0.32",
+    "@types/prop-types": "15.5.2",
+    "@types/react": "16.0.25",
     "@types/react-addons-test-utils": "0.14.18",
-    "@types/react-test-renderer": "^15.5.4",
-    "@types/react-dom": "15.5.6",
+    "@types/react-test-renderer": "^16.0.0",
+    "@types/react-dom": "16.0.3",
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
-    "@types/jest": "^21.1.0",
-    "@types/enzyme": "^2.8.8",
+    "@types/jest": "21.1.8",
+    "@types/enzyme": "3.1.5",
+    "@types/enzyme-adapter-react-16": "1.0.1",
     "@types/webpack-env": "1.13.0",
     "@uifabric/example-app-base": ">=5.1.2 <6.0.0",
     "@uifabric/file-type-icons": ">=0.1.0 <1.0.0",
-    "@uifabric/merge-styles": ">=5.8.1 <6.0.0",
-    "@uifabric/icons": ">=5.3.0 <6.0.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.0.1 <6.0.0",
     "es6-weak-map": "^2.0.2",
-    "enzyme": "^2.9.1",
+    "enzyme": "^3.2.0",
+    "enzyme-adapter-react-16": "^1.1.0",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
-    "react": "^15.6.1",
-    "react-addons-test-utils": "^15.4.2",
-    "react-test-renderer": "^15.6.1",
-    "react-dom": "^15.6.1",
-    "react-highlight": "0.9.0",
-    "sinon": "^2.3.2"
+    "react": "^16.2.0",
+    "react-test-renderer": "^16.2.0",
+    "react-dom": "^16.2.0",
+    "react-highlight": "0.10.0",
+    "sinon": "^4.1.3"
   },
   "dependencies": {
-    "@microsoft/load-themed-styles": "^1.7.2",
+    "@microsoft/load-themed-styles": "^1.7.13",
     "office-ui-fabric-react": ">=5.33.1 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
+    "prop-types": "^15.6.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/experiments/src/common/tests.ts b/packages/experiments/src/common/tests.ts
index 842c69e60ef3c..12b909633fbf0 100644
--- a/packages/experiments/src/common/tests.ts
+++ b/packages/experiments/src/common/tests.ts
@@ -1,8 +1,20 @@
 /** Jest test setup file. */
 
 import { setIconOptions } from 'office-ui-fabric-react/lib/Styling';
+import { configure } from 'enzyme';
+import * as Adapter from 'enzyme-adapter-react-16';
 
 // Suppress icon warnings.
 setIconOptions({
   disableWarnings: true
-});
\ No newline at end of file
+});
+
+// Mock requestAnimationFrame for React 16+.
+declare const global: { requestAnimationFrame: (cb: () => void) => void };
+
+global.requestAnimationFrame = (callback: () => void) => {
+  setTimeout(callback, 0);
+};
+
+// Configure enzyme.
+configure({ adapter: new Adapter() });
\ No newline at end of file
diff --git a/packages/experiments/src/components/Coachmark/Coachmark.styles.ts b/packages/experiments/src/components/Coachmark/Coachmark.styles.ts
index 985a580853ce0..e0c72a5dbf369 100644
--- a/packages/experiments/src/components/Coachmark/Coachmark.styles.ts
+++ b/packages/experiments/src/components/Coachmark/Coachmark.styles.ts
@@ -1,5 +1,4 @@
-import { IStyle, keyframes } from '../../Styling';
-import { IRawStyleBase } from '@uifabric/merge-styles/lib/IRawStyleBase';
+import { IStyle, IRawStyle, keyframes } from '../../Styling';
 
 export const themePrimary = '#0078d7';
 
@@ -80,7 +79,7 @@ export const coachmarkCollapsedSize = '36px';
 export const beaconColorOne = '#00FFEC';
 export const beaconColorTwo = '#005EDD';
 
-function continuousPulseStepOne(): IRawStyleBase {
+function continuousPulseStepOne(): IRawStyle {
   return {
     borderColor: beaconColorOne,
     borderWidth: '0px',
@@ -89,20 +88,20 @@ function continuousPulseStepOne(): IRawStyleBase {
   };
 }
 
-function continuousPulseStepTwo(): IRawStyleBase {
+function continuousPulseStepTwo(): IRawStyle {
   return {
     opacity: '1',
     borderWidth: '10px'
   };
 }
 
-function continuousPulseStepThree(): IRawStyleBase {
+function continuousPulseStepThree(): IRawStyle {
   return {
     opacity: 1
   };
 }
 
-function continuousPulseStepFour(): IRawStyleBase {
+function continuousPulseStepFour(): IRawStyle {
   return {
     borderWidth: '0',
     width: '150px',
@@ -112,7 +111,7 @@ function continuousPulseStepFour(): IRawStyleBase {
   };
 }
 
-function continuousPulseStepFive(): IRawStyleBase {
+function continuousPulseStepFive(): IRawStyle {
   return Object.assign(continuousPulseStepOne(), {
     opacity: '0'
   });
diff --git a/packages/experiments/src/components/Coachmark/Coachmark.tsx b/packages/experiments/src/components/Coachmark/Coachmark.tsx
index cd47d2336a6c4..8e41d4eeb3374 100644
--- a/packages/experiments/src/components/Coachmark/Coachmark.tsx
+++ b/packages/experiments/src/components/Coachmark/Coachmark.tsx
@@ -6,7 +6,7 @@ import { BaseComponent, classNamesFunction } from '../../Utilities';
 import { PositioningContainer } from '../PositioningContainer/PositioningContainer';
 
 // Coachmark
-import { ICoachmarkTypes } from './Coachmark.types';
+import { ICoachmarkProps } from './Coachmark.types';
 import { getStyles, ICoachmarkStyles, ICoachmarkStyleProps } from './Coachmark.styles';
 
 const getClassNames = classNamesFunction<ICoachmarkStyleProps, ICoachmarkStyles>();
@@ -49,8 +49,8 @@ export interface ICoachmarkState {
   isMouseInProximity: boolean;
 }
 
-export class Coachmark extends BaseComponent<ICoachmarkTypes, ICoachmarkState> {
-  public static defaultProps: Partial<ICoachmarkTypes> = {
+export class Coachmark extends BaseComponent<ICoachmarkProps, ICoachmarkState> {
+  public static defaultProps: Partial<ICoachmarkProps> = {
     collapsed: true,
     mouseProximityOffset: 100
   };
@@ -62,8 +62,8 @@ export class Coachmark extends BaseComponent<ICoachmarkTypes, ICoachmarkState> {
   private _entityInnerHostElement: HTMLElement;
   private _translateAnimationContainer: HTMLElement;
 
-  constructor(props: ICoachmarkTypes) {
-    super();
+  constructor(props: ICoachmarkProps) {
+    super(props);
 
     // Set defaults for state
     this.state = {
@@ -130,7 +130,7 @@ export class Coachmark extends BaseComponent<ICoachmarkTypes, ICoachmarkState> {
     );
   }
 
-  public componentWillReceiveProps(newProps: ICoachmarkTypes): void {
+  public componentWillReceiveProps(newProps: ICoachmarkProps): void {
     if (this.props.collapsed && !newProps.collapsed) {
       // The coachmark is about to open
       this._openCoachmark();
diff --git a/packages/experiments/src/components/Coachmark/Coachmark.types.ts b/packages/experiments/src/components/Coachmark/Coachmark.types.ts
index 5c6d9f837c170..943e5e4ea562b 100644
--- a/packages/experiments/src/components/Coachmark/Coachmark.types.ts
+++ b/packages/experiments/src/components/Coachmark/Coachmark.types.ts
@@ -7,7 +7,7 @@ import { IPoint, IStyleFunction } from '../../Utilities';
 export interface ICoachmark {
 }
 
-export interface ICoachmarkTypes extends React.Props<Coachmark> {
+export interface ICoachmarkProps extends React.Props<Coachmark> {
   /**
   * All props for your component are to be defined here.
   */
diff --git a/packages/experiments/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx b/packages/experiments/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx
index c5cbba8358257..cd445deb2cffa 100644
--- a/packages/experiments/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx
+++ b/packages/experiments/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx
@@ -11,8 +11,8 @@ export interface ICoachmarkBasicExampleState {
 
 export class CoachmarkBasicExample extends React.Component<{}, ICoachmarkBasicExampleState> {
 
-  public constructor() {
-    super();
+  public constructor(props: {}) {
+    super(props);
 
     this._onShowMenuClicked = this._onShowMenuClicked.bind(this);
     this._onCalloutDismiss = this._onCalloutDismiss.bind(this);
diff --git a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
index ffbad35d2e413..8e842275e33ee 100644
--- a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
@@ -33,13 +33,13 @@ const suggestionProps: IBasePickerSuggestionsProps = {
 };
 
 // tslint:disable-next-line:no-any
-export class ExtendedPeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerExampleState> {
+export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeoplePickerExampleState> {
   private _picker: ExtendedPeoplePicker;
   private floatingPickerProps: IBaseFloatingPickerProps<IExtendedPersonaProps>;
   private selectedItemsListProps: ISelectedPeopleProps;
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     let peopleList: IPersonaWithMenu[] = [];
     people.forEach((persona: IPersonaProps) => {
       let target: IPersonaWithMenu = {};
diff --git a/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
index ee21f298f8e78..37651028dcc35 100644
--- a/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
+++ b/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
@@ -33,13 +33,12 @@ const suggestionProps: IBasePickerSuggestionsProps = {
   suggestionsContainerAriaLabel: 'Suggested contacts'
 };
 
-// tslint:disable-next-line:no-any
-export class FloatingPeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerExampleState> {
+export class FloatingPeoplePickerTypesExample extends BaseComponent<{}, IPeoplePickerExampleState> {
   private _picker: IBaseFloatingPicker;
   private _inputElement: HTMLDivElement;
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     let peopleList: IPersonaWithMenu[] = [];
     people.forEach((persona: IPersonaProps) => {
       let target: IPersonaWithMenu = {};
diff --git a/packages/experiments/src/components/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx b/packages/experiments/src/components/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx
index fa4bea6ec7975..41977ae170de5 100644
--- a/packages/experiments/src/components/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx
+++ b/packages/experiments/src/components/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx
@@ -7,8 +7,9 @@ export interface IPositioningContainerBasicExampleState {
 }
 
 export class PositioningContainerBasicExample extends React.Component<{}, IPositioningContainerBasicExampleState> {
-  public constructor() {
-    super();
+
+  constructor(props: {}) {
+    super(props);
 
     this._onShowMenuClicked = this._onShowMenuClicked.bind(this);
     this._onDismiss = this._onDismiss.bind(this);
@@ -17,6 +18,7 @@ export class PositioningContainerBasicExample extends React.Component<{}, IPosit
       isPositioningContainerVisible: false
     };
   }
+
   public render(): JSX.Element {
     let { isPositioningContainerVisible } = this.state;
     return (
@@ -42,6 +44,7 @@ export class PositioningContainerBasicExample extends React.Component<{}, IPosit
       </div>
     );
   }
+
   private _onShowMenuClicked(): void {
     this.setState({
       isPositioningContainerVisible: !this.state.isPositioningContainerVisible
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
index f86c31cbddca7..f9a142959dafa 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
@@ -112,8 +112,8 @@ export interface ITileDocumentExampleState {
 }
 
 export class TileDocumentExample extends React.Component<{}, ITileDocumentExampleState> {
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this.state = {
       imagesLoaded: true
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
index 08057f37263eb..88c90306f4a25 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
@@ -124,8 +124,8 @@ export interface ITileFolderExampleState {
 }
 
 export class TileFolderExample extends React.Component<{}, ITileFolderExampleState> {
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this.state = {
       size: 'large'
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
index 0a15cdf8d0fb3..0f39cb993ee3c 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
@@ -113,8 +113,8 @@ export interface ITileMediaExampleState {
 }
 
 export class TileMediaExample extends React.Component<{}, ITileMediaExampleState> {
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this.state = {
       imagesLoaded: true
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx
index c789fc9a9c513..3cb16c018334b 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Basic.Example.tsx
@@ -26,8 +26,8 @@ export interface ITilesListBasicExampleState {
 }
 
 export class TilesListBasicExample extends React.Component<{}, ITilesListBasicExampleState> {
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this.state = {
       items: ITEMS.map((item: IBasicItem): ITilesGridItem<IBasicItem> => {
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
index 88314a614f37d..4c33dbdf5952b 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
@@ -45,8 +45,8 @@ export interface ITilesListDocumentExampleState {
 export class TilesListDocumentExample extends React.Component<{}, ITilesListDocumentExampleState> {
   private _selection: Selection;
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this._selection = new Selection({
       getKey: (item: IExampleItem) => item.key,
@@ -91,17 +91,17 @@ export class TilesListDocumentExample extends React.Component<{}, ITilesListDocu
     );
   }
 
-    @autobind
-    private _onToggleIsModalSelection(checked: boolean): void {
-      this._selection.setModal(checked);
-    }
-
-    @autobind
-    private _onSelectionChange(): void {
-      this.setState({
-        isModalSelection: this._selection.isModal()
-      });
-    }
+  @autobind
+  private _onToggleIsModalSelection(checked: boolean): void {
+    this._selection.setModal(checked);
+  }
+
+  @autobind
+  private _onSelectionChange(): void {
+    this.setState({
+      isModalSelection: this._selection.isModal()
+    });
+  }
 
   @autobind
   private _onItemInvoked(item: IExampleItem, index: number, event: Event): void {
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
index ed21c13734527..ed4e5fa348a98 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
@@ -50,8 +50,8 @@ export interface ITilesListMediaExampleState {
 export class TilesListMediaExample extends React.Component<{}, ITilesListMediaExampleState> {
   private _selection: Selection;
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this._selection = new Selection({
       getKey: (item: IExampleItem) => item.key,
diff --git a/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example.tsx b/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example.tsx
index 7a56385bfd748..70deb9a7f971d 100644
--- a/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example.tsx
+++ b/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example.tsx
@@ -17,8 +17,8 @@ const ExampleList: ExampleList = VirtualizedList as any;
 
 export class VirtualizedListBasicExample extends React.Component {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     // Populate with items for demos.
     if (items.length === 0) {
diff --git a/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example2.tsx b/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example2.tsx
index 455dbac61a0b6..5fb15cec4bb13 100644
--- a/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example2.tsx
+++ b/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example2.tsx
@@ -26,8 +26,8 @@ type ExampleList = new () => VirtualizedList<IItem>;
 const ExampleList: ExampleList = VirtualizedList as any;
 
 export class VirtualizedListBasicExample2 extends React.Component {
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     // Populate with items for demos.
     if (items.length === 0) {
diff --git a/packages/experiments/src/components/signals/examples/Signals.Basic.Example.tsx b/packages/experiments/src/components/signals/examples/Signals.Basic.Example.tsx
index c14d3b869d680..341cdf34eb2e0 100644
--- a/packages/experiments/src/components/signals/examples/Signals.Basic.Example.tsx
+++ b/packages/experiments/src/components/signals/examples/Signals.Basic.Example.tsx
@@ -54,8 +54,8 @@ export interface ISignalsBasicExampleState {
 }
 
 export class SignalsBasicExample extends React.Component<{}, ISignalsBasicExampleState> {
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this.state = {
       fontSize: 'small',
diff --git a/packages/experiments/src/demo/index.tsx b/packages/experiments/src/demo/index.tsx
index 493c0b8cb5613..1d699c1f688ce 100644
--- a/packages/experiments/src/demo/index.tsx
+++ b/packages/experiments/src/demo/index.tsx
@@ -8,7 +8,7 @@ import { Router, Route } from 'office-ui-fabric-react/lib/utilities/router/index
 import { GettingStartedPage } from './GettingStartedPage';
 import { setBaseUrl } from 'office-ui-fabric-react/lib/Utilities';
 import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
-import { initializeIcons } from '@uifabric/icons/lib/index';
+import { initializeIcons } from 'office-ui-fabric-react/lib/Icons';
 import { initializeFileTypeIcons } from '@uifabric/file-type-icons/src/index';
 
 import './index.scss';
diff --git a/packages/experiments/src/utilities/scrolling/ScrollContainer.tsx b/packages/experiments/src/utilities/scrolling/ScrollContainer.tsx
index 7de016ad6a1b1..7f780b625f21f 100644
--- a/packages/experiments/src/utilities/scrolling/ScrollContainer.tsx
+++ b/packages/experiments/src/utilities/scrolling/ScrollContainer.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import * as PropTypes from 'prop-types';
 import { IScrollContainerProps } from './ScrollContainer.types';
 import { BaseComponent, autobind, css } from 'office-ui-fabric-react/lib/Utilities';
 
@@ -21,7 +22,7 @@ export interface IScrollContainerContext {
 }
 
 export const ScrollContainerContextTypes = {
-  scrollContainer: React.PropTypes.object.isRequired
+  scrollContainer: PropTypes.object.isRequired
 };
 
 export class ScrollContainer extends BaseComponent<IScrollContainerProps> implements IScrollContainer {
diff --git a/packages/file-type-icons/package.json b/packages/file-type-icons/package.json
index 35d0b824538eb..a2b750b7c76e6 100644
--- a/packages/file-type-icons/package.json
+++ b/packages/file-type-icons/package.json
@@ -19,11 +19,18 @@
     "jest"
   ],
   "devDependencies": {
-    "@types/react": "15.6.7",
-    "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
+    "@types/react": "16.0.25",
+    "@types/react-dom": "16.0.3",
+    "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
+    "react": "^16.2.0",
+    "react-dom": "^16.2.0"
   },
   "dependencies": {
     "@uifabric/styling": ">=5.14.0 <6.0.0",
-    "tslib": "^1.6.0"
+    "tslib": "^1.7.1"
+  },
+  "peerDependencies": {
+    "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
+    "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   }
 }
\ No newline at end of file
diff --git a/packages/icons/package.json b/packages/icons/package.json
index d9cb0745db4ff..51c9ff49fc922 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -23,6 +23,6 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.14.0 <6.0.0",
-    "tslib": "^1.6.0"
+    "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/jest-serializer-merge-styles/package.json b/packages/jest-serializer-merge-styles/package.json
index afc074408bb8a..a36369accd932 100644
--- a/packages/jest-serializer-merge-styles/package.json
+++ b/packages/jest-serializer-merge-styles/package.json
@@ -20,7 +20,7 @@
     "karma"
   ],
   "devDependencies": {
-    "@types/jest": "21.1.0",
+    "@types/jest": "21.1.8",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index adfbfb90bd6d0..fee3b17b70dbe 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -20,7 +20,7 @@
     "karma"
   ],
   "devDependencies": {
-    "@types/jest": "21.1.0",
+    "@types/jest": "21.1.8",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
diff --git a/packages/office-ui-fabric-react/index.html b/packages/office-ui-fabric-react/index.html
index 65f1e562c5b1c..813079539bef0 100644
--- a/packages/office-ui-fabric-react/index.html
+++ b/packages/office-ui-fabric-react/index.html
@@ -37,12 +37,12 @@
       }
     }
     loadScript(isProduction ? [
-      '//cdnjs.cloudflare.com/ajax/libs/react/15.4.0/react.min.js',
-      '//cdnjs.cloudflare.com/ajax/libs/react/15.4.0/react-dom.min.js',
-      'demo-app.min.js'
+      '//cdnjs.cloudflare.com/ajax/libs/react/16.2.0/umd/react.production.min.js',
+      '//cdnjs.cloudflare.com/ajax/libs/react-dom/16.2.0/umd/react-dom.production.min.js',
+      'demo-app.js'
     ] : [
-        '//cdnjs.cloudflare.com/ajax/libs/react/15.4.0/react.js',
-        '//cdnjs.cloudflare.com/ajax/libs/react/15.4.0/react-dom.js',
+        '//cdnjs.cloudflare.com/ajax/libs/react/16.2.0/umd/react.development.js',
+        '//cdnjs.cloudflare.com/ajax/libs/react-dom/16.2.0/umd/react-dom.development.js',
         'demo-app.js'
       ]);
   </script>
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 92e6ff1abdebe..10ef283841003 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -17,39 +17,41 @@
     "update-snapshots": "node ../../scripts/build.js jest -u"
   },
   "devDependencies": {
-    "@types/enzyme": "2.8.8",
-    "@types/es6-promise": "^0.0.32",
-    "@types/jest": "21.1.0",
-    "@types/prop-types": "15.5.1",
-    "@types/react": "15.6.7",
-    "@types/react-dom": "15.5.5",
-    "@types/react-test-renderer": "^15.5.4",
+    "@types/enzyme": "3.1.5",
+    "@types/enzyme-adapter-react-16": "1.0.1",
+    "@types/es6-promise": "0.0.32",
+    "@types/jest": "21.1.8",
+    "@types/prop-types": "15.5.2",
+    "@types/react": "16.0.25",
+    "@types/react-dom": "16.0.3",
+    "@types/react-test-renderer": "^16.0.0",
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.0.1 <6.0.0",
     "@uifabric/example-app-base": ">=5.1.2 <6.0.0",
-    "enzyme": "^2.9.1",
+    "enzyme": "^3.2.0",
+    "enzyme-adapter-react-16": "^1.1.0",
     "es6-promise": "^4.1.0",
     "es6-map": "^0.1.5",
     "es6-weak-map": "^2.0.2",
-    "highlight.js": "^9.6.0",
+    "highlight.js": "^9.12.0",
     "office-ui-fabric-core": ">=9.0.0 <10.0.0",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
-    "react": "^15.6.1",
-    "react-dom": "^15.6.1",
-    "react-highlight": "0.9.0",
-    "react-test-renderer": "^15.6.1",
+    "react": "^16.2.0",
+    "react-dom": "^16.2.0",
+    "react-highlight": "0.10.0",
+    "react-test-renderer": "^16.2.0",
     "resemblejs": "~2.2.3",
-    "sinon": "^2.3.2"
+    "sinon": "^4.1.3"
   },
   "dependencies": {
-    "@microsoft/load-themed-styles": "^1.7.2",
+    "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.8.1 <6.0.0",
     "@uifabric/styling": ">=5.14.0 <6.0.0",
     "@uifabric/utilities": ">=5.5.0 <6.0.0",
-    "prop-types": "^15.5.10",
+    "prop-types": "^15.6.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/src/common/testUtilities.ts b/packages/office-ui-fabric-react/src/common/testUtilities.ts
new file mode 100644
index 0000000000000..c736e61c938cc
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/common/testUtilities.ts
@@ -0,0 +1,19 @@
+import { ReactWrapper } from 'enzyme';
+
+export const findNodes = (wrapper: ReactWrapper<any, any>, className: string): ReactWrapper<any, any> => (
+  wrapper
+    .find(className)
+    .filterWhere((node => typeof node.type() === 'string'))
+);
+
+export const expectNodes = (wrapper: ReactWrapper<any, any>, className: string, n: number): void => (
+  expect(findNodes(wrapper, className).length).toEqual(n)
+);
+
+export const expectOne = (wrapper: ReactWrapper<any, any>, className: string): void => (
+  expectNodes(wrapper, className, 1)
+);
+
+export const expectMissing = (wrapper: ReactWrapper<any, any>, className: string): void => (
+  expectNodes(wrapper, className, 0)
+);
diff --git a/packages/office-ui-fabric-react/src/common/tests.ts b/packages/office-ui-fabric-react/src/common/tests.ts
index 0ec23e3003f08..e47f11fc76bfb 100644
--- a/packages/office-ui-fabric-react/src/common/tests.ts
+++ b/packages/office-ui-fabric-react/src/common/tests.ts
@@ -1,8 +1,20 @@
 /** Jest test setup file. */
 
-import { setIconOptions } from '@uifabric/styling';
+import { setIconOptions } from 'office-ui-fabric-react/lib/Styling';
+import { configure } from 'enzyme';
+import * as Adapter from 'enzyme-adapter-react-16';
 
 // Suppress icon warnings.
 setIconOptions({
   disableWarnings: true
 });
+
+// Mock requestAnimationFrame for React 16+.
+declare const global: { requestAnimationFrame: (cb: () => void) => void };
+
+global.requestAnimationFrame = (callback: () => void) => {
+  setTimeout(callback, 0);
+};
+
+// Configure enzyme.
+configure({ adapter: new Adapter() });
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
index cc7efebfe991f..0d576a60d4965 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
@@ -12,8 +12,8 @@ import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
 const exampleStyles: any = exampleStylesImport;
 
 export class BreadcrumbBasicExample extends React.Component<any, any> {
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
   }
 
   public render() {
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx
index 3a7078a23b1ad..75b9fedd67e34 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx
@@ -9,10 +9,7 @@ import {
   autobind
 } from '../../../Utilities';
 
-export class BreadcrumbStaticExample extends React.Component<any, any> {
-  constructor() {
-    super();
-  }
+export class BreadcrumbStaticExample extends React.Component {
 
   public render() {
     return (
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
index 4a49d8168b44c..e833b0b18ba91 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
@@ -61,8 +61,8 @@ export interface IButtonDemoPageState {
 }
 
 export class ButtonPage extends React.Component<IComponentDemoPageProps, IButtonDemoPageState> {
-  constructor() {
-    super();
+  constructor(props: IComponentDemoPageProps) {
+    super(props);
     this.state = {
       areButtonsDisabled: false,
       areButtonsChecked: false
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx
index c0b570b0fbe54..e6365cb5769c9 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx
@@ -4,9 +4,9 @@ import {
   IButtonProps
 } from 'office-ui-fabric-react/lib/Button';
 
-export class ButtonActionExample extends React.Component<IButtonProps, any> {
-  public constructor() {
-    super();
+export class ButtonActionExample extends React.Component<IButtonProps> {
+  public constructor(props: {}) {
+    super(props);
   }
 
   public render() {
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
index e9804c13f6497..c2e6e11cbd06a 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
@@ -7,11 +7,7 @@ import {
   Label
 } from 'office-ui-fabric-react/lib/Label';
 
-export class ButtonAnchorExample extends React.Component<IButtonProps, {}> {
-  public constructor() {
-    super();
-  }
-
+export class ButtonAnchorExample extends React.Component<IButtonProps> {
   public render() {
     let { disabled, checked } = this.props;
 
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx
index a59636dad93a9..1c11cbc0a92d4 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx
@@ -5,9 +5,9 @@ import {
 } from 'office-ui-fabric-react/lib/Button';
 import { Label } from 'office-ui-fabric-react/lib/Label';
 
-export class ButtonCompoundExample extends React.Component<IButtonProps, {}> {
-  public constructor() {
-    super();
+export class ButtonCompoundExample extends React.Component<IButtonProps> {
+  public constructor(props: {}) {
+    super(props);
   }
 
   public render() {
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx
index 81f5d267788c3..22149f6c4fe4e 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx
@@ -2,11 +2,7 @@ import * as React from 'react';
 import { IconButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
 import { Label } from 'office-ui-fabric-react/lib/Label';
 
-export class ButtonIconExample extends React.Component<IButtonProps, {}> {
-  public constructor() {
-    super();
-  }
-
+export class ButtonIconExample extends React.Component<IButtonProps> {
   public render() {
     let { disabled, checked } = this.props;
 
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
index 47146f1cfa9be..235e55dcf04d6 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
@@ -2,11 +2,7 @@ import * as React from 'react';
 import { PrimaryButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
 import { Label } from 'office-ui-fabric-react/lib/Label';
 
-export class ButtonPrimaryExample extends React.Component<IButtonProps, {}> {
-  public constructor() {
-    super();
-  }
-
+export class ButtonPrimaryExample extends React.Component<IButtonProps> {
   public render() {
     let { disabled, checked } = this.props;
 
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx
index b674b219b7ba5..03fc8143da301 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx
@@ -3,10 +3,6 @@ import { PrimaryButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
 import { Label } from 'office-ui-fabric-react/lib/Label';
 
 export class ButtonScreenReaderExample extends React.Component<IButtonProps, {}> {
-  public constructor() {
-    super();
-  }
-
   public render() {
     let { disabled, checked } = this.props;
 
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
index 0e601defcf38c..8e72b37c6bbb6 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
@@ -7,10 +7,7 @@ const alertClicked = (): void => {
   alert('Clicked');
 };
 
-export class ButtonSplitExample extends React.Component<IButtonProps, {}> {
-  public constructor() {
-    super();
-  }
+export class ButtonSplitExample extends React.Component<IButtonProps> {
 
   public render() {
     let { disabled, checked } = this.props;
@@ -104,10 +101,7 @@ export class ButtonSplitExample extends React.Component<IButtonProps, {}> {
   }
 }
 
-export class ButtonSplitCustomExample extends React.Component<IButtonProps, {}> {
-  public constructor() {
-    super();
-  }
+export class ButtonSplitCustomExample extends React.Component<IButtonProps> {
 
   public render() {
     let { disabled, checked } = this.props;
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
index 8ec2442a31908..8533e8da7e6ef 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
@@ -15,8 +15,8 @@ export class ButtonSwapExample extends React.Component<IButtonProps, IButtonSwap
   private buttonRef: HTMLElement | null;
   private hasFocus: boolean;
 
-  public constructor() {
-    super();
+  public constructor(props: IButtonProps) {
+    super(props);
 
     this.hasFocus = false;
     this.buttonRef = null;
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
index 872194ed98103..ff579f86070af 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
@@ -79,8 +79,8 @@ export class CalendarButtonExample extends React.Component<ICalendarButtonExampl
 
   private _calendarButtonElement: HTMLElement;
 
-  public constructor() {
-    super();
+  public constructor(props: ICalendarButtonExampleProps) {
+    super(props);
 
     this.state = {
       showCalendar: false,
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
index ec9b615e54398..94223d222cdcd 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
@@ -82,8 +82,8 @@ export interface ICalendarInlineExampleProps {
 }
 
 export class CalendarInlineExample extends React.Component<ICalendarInlineExampleProps, ICalendarInlineExampleState> {
-  public constructor() {
-    super();
+  public constructor(props: ICalendarInlineExampleProps) {
+    super(props);
 
     this.state = {
       selectedDate: null,
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Basic.Example.tsx
index d00fe5e7e66c7..adc178391dff5 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Basic.Example.tsx
@@ -8,11 +8,11 @@ export interface ICalloutBaiscExampleState {
   isCalloutVisible?: boolean;
 }
 
-export class CalloutBasicExample extends React.Component<any, ICalloutBaiscExampleState> {
+export class CalloutBasicExample extends React.Component<{}, ICalloutBaiscExampleState> {
   private _menuButtonElement: HTMLElement | null;
 
-  public constructor() {
-    super();
+  public constructor(props: {}) {
+    super(props);
 
     this._onShowMenuClicked = this._onShowMenuClicked.bind(this);
     this._onCalloutDismiss = this._onCalloutDismiss.bind(this);
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
index ed74babc0ea19..a8e1dad35fcf8 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
@@ -26,11 +26,11 @@ const DIRECTION_OPTIONS = [
   { key: DirectionalHint.rightBottomEdge, text: 'Right Bottom Edge' },
 ];
 
-export class CalloutCoverExample extends React.Component<any, ICalloutCoverExampleState> {
+export class CalloutCoverExample extends React.Component<{}, ICalloutCoverExampleState> {
   private _menuButtonElement: HTMLElement | null;
 
-  public constructor() {
-    super();
+  public constructor(props: {}) {
+    super(props);
 
     this._onDismiss = this._onDismiss.bind(this);
     this._onShowMenuClicked = this._onShowMenuClicked.bind(this);
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
index c58c1c2e08340..37d72e82d1413 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
@@ -35,10 +35,11 @@ const DIRECTION_OPTIONS = [
   { key: DirectionalHint.rightBottomEdge, text: 'Right Bottom Edge' },
 ];
 
-export class CalloutDirectionalExample extends React.Component<any, ICalloutDirectionalExampleState> {
+export class CalloutDirectionalExample extends React.Component<{}, ICalloutDirectionalExampleState> {
   private _menuButtonElement: HTMLElement | null;
-  public constructor() {
-    super();
+
+  public constructor(props: {}) {
+    super(props);
 
     this.state = {
       isCalloutVisible: false,
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx
index 23c12838f419b..9ad3df311e054 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx
@@ -1,18 +1,20 @@
 import * as React from 'react';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Callout } from 'office-ui-fabric-react/lib/Callout';
-import { CommandBar } from 'office-ui-fabric-react/lib/CommandBar';
+import { CommandBar, ICommandBarItemProps } from 'office-ui-fabric-react/lib/CommandBar';
 import './CalloutExample.scss';
 
-export interface ICalloutBaiscExampleState {
-  isCalloutVisible?: boolean;
+export interface ICalloutNestedExampleProps {
+  items: ICommandBarItemProps[];
 }
 
-export class CalloutNestedExample extends React.Component<any, ICalloutBaiscExampleState> {
+export class CalloutNestedExample extends React.Component<ICalloutNestedExampleProps, {
+  isCalloutVisible: boolean;
+}> {
   private _menuButtonElement: HTMLElement | null;
 
-  public constructor() {
-    super();
+  public constructor(props: ICalloutNestedExampleProps) {
+    super(props);
 
     this._onDismiss = this._onDismiss.bind(this);
 
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
index c31b6588dc2d9..bcf73414b112c 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
@@ -10,8 +10,8 @@ export interface ICheckboxBasicExampleState {
 }
 
 export class CheckboxBasicExample extends React.Component<{}, ICheckboxBasicExampleState> {
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this.state = {
       isChecked: false
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.ImplementationExamples.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.ImplementationExamples.tsx
index eaf8748011b4f..7b853909a62c2 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.ImplementationExamples.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.ImplementationExamples.tsx
@@ -15,8 +15,9 @@ export interface ICheckboxBasicExampleState {
 }
 
 export class CheckboxImplementationExamples extends React.Component<{}, ICheckboxBasicExampleState> {
-  constructor() {
-    super();
+
+  constructor(props: {}) {
+    super(props);
 
     this.state = {
       isChecked: false
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Basic.Example.tsx
index ff3dbb5521e60..352a99dbc65fd 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Basic.Example.tsx
@@ -9,9 +9,9 @@ export interface IChoiceGroupBasicExampleState {
   imageKey: string;
 }
 
-export class ChoiceGroupBasicExample extends React.Component<any, IChoiceGroupBasicExampleState> {
-  constructor() {
-    super();
+export class ChoiceGroupBasicExample extends React.Component<{}, IChoiceGroupBasicExampleState> {
+  constructor(props: {}) {
+    super(props);
 
     this.state = {
       imageKey: ''
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Custom.Example.tsx
index 8a73251c158c2..a4a5d2d22092d 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Custom.Example.tsx
@@ -6,10 +6,7 @@ import { Dropdown } from 'office-ui-fabric-react/lib/Dropdown';
 import * as stylesImport from './ChoiceGroup.Custom.Example.scss';
 const styles: any = stylesImport;
 
-export class ChoiceGroupCustomExample extends React.Component<any, any> {
-  constructor() {
-    super();
-  }
+export class ChoiceGroupCustomExample extends React.Component {
 
   public render() {
     return (
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Image.Example.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Image.Example.tsx
index b73fbadc9592a..ca09c0ca99042 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Image.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Image.Example.tsx
@@ -9,9 +9,9 @@ export interface IChoiceGroupImageExampleState {
   selectedKey: string;
 }
 
-export class ChoiceGroupImageExample extends React.Component<any, IChoiceGroupImageExampleState> {
-  constructor() {
-    super();
+export class ChoiceGroupImageExample extends React.Component<{}, IChoiceGroupImageExampleState> {
+  constructor(props: {}) {
+    super(props);
 
     this.state = {
       selectedKey: 'bar'
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
index 9a351352c143a..5d7513d8d3c09 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
@@ -9,6 +9,7 @@ import { KeyCodes } from '../../Utilities';
 
 import { ComboBox } from './ComboBox';
 import { IComboBox, IComboBoxOption } from './ComboBox.types';
+import { expectOne, expectMissing } from '../../common/testUtilities';
 
 const DEFAULT_OPTIONS: IComboBoxOption[] = [
   { key: '1', text: '1' },
@@ -46,8 +47,8 @@ describe('ComboBox', () => {
       />);
     let comboBoxRoot = wrapper.find('.ms-ComboBox');
 
-    expect(comboBoxRoot.find('.ms-ComboBox.is-disabled').length).toEqual(0);
-    expect(comboBoxRoot.find('[data-is-interactable=true]').length).toEqual(1);
+    expectMissing(wrapper, '.ms-ComboBox.is-disabled');
+    expectOne(wrapper, '[data-is-interactable=true]');
 
     wrapper = mount(
       <ComboBox
@@ -55,10 +56,9 @@ describe('ComboBox', () => {
         label='testgroup'
         options={ DEFAULT_OPTIONS }
       />);
-    comboBoxRoot = wrapper.find('.ms-ComboBox');
 
-    expect(comboBoxRoot.find('.ms-ComboBox.is-disabled').length).toEqual(1);
-    expect(comboBoxRoot.find('[data-is-interactable=false]').length).toEqual(1);
+    expectOne(wrapper, '.ms-ComboBox.is-disabled');
+    expectOne(wrapper, '[data-is-interactable=false]');
   });
 
   it('Renders no selected item in default case', () => {
@@ -68,10 +68,8 @@ describe('ComboBox', () => {
         label='testgroup'
         options={ DEFAULT_OPTIONS }
       />);
-    let comboBoxRoot = wrapper.find('.ms-ComboBox');
-    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = comboBoxRoot.find('[role="combobox"]');
 
-    expect(inputElement.text()).toEqual('');
+    expect(wrapper.find('input[role="combobox"]').text()).toEqual('');
   });
 
   it('Renders a selected item in uncontrolled case', () => {
@@ -190,21 +188,19 @@ describe('ComboBox', () => {
     el.scrollIntoView = () => null;
     Object.defineProperty(HTMLElement.prototype, 'offsetParent', { get: () => el });
 
-    comboBoxRoot = wrapper.find('.ms-ComboBox');
-    let buttonElement = comboBoxRoot.find('button');
+    let buttonElement = wrapper.find('button');
     buttonElement.simulate('click');
     let secondItemElement: Element = wrapper.getDOMNode().ownerDocument.querySelector('.ms-ComboBox-option[data-index="1"]')!;
 
     ReactTestUtils.Simulate.click(secondItemElement);
-    ReactTestUtils.Simulate.click(secondItemElement!);
 
-    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = comboBoxRoot.find('input');
+    wrapper.update();
+
+    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = wrapper.find('input');
     expect(inputElement.props().value).toEqual('2');
   });
 
   it('Can insert text in uncontrolled case with autoComplete and allowFreeform on', () => {
-    let comboBoxRoot;
-    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any>;
     let wrapper = mount(
       <ComboBox
         label='testgroup'
@@ -213,16 +209,13 @@ describe('ComboBox', () => {
         autoComplete='on'
         allowFreeform={ true }
       />);
-    comboBoxRoot = wrapper.find('.ms-ComboBox');
-    inputElement = comboBoxRoot.find('input');
-    inputElement.simulate('change', { target: { value: 'f' } });
-    inputElement = comboBoxRoot.find('input');
-    expect(inputElement.props().value).toEqual('Foo');
+
+    wrapper.find('input').simulate('change', { target: { value: 'f' } });
+    wrapper.update();
+    expect(wrapper.find('input').props().value).toEqual('Foo');
   });
 
   it('Can insert text in uncontrolled case with autoComplete on and allowFreeform off', () => {
-    let comboBoxRoot;
-    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any>;
     let wrapper = mount(
       <ComboBox
         label='testgroup'
@@ -231,16 +224,13 @@ describe('ComboBox', () => {
         autoComplete='on'
         allowFreeform={ false }
       />);
-    comboBoxRoot = wrapper.find('.ms-ComboBox');
-    inputElement = comboBoxRoot.find('input');
-    inputElement.simulate('change', { target: { value: 'f' } });
-    inputElement = comboBoxRoot.find('input');
-    expect(inputElement.props().value).toEqual('Foo');
+
+    wrapper.find('input').simulate('change', { target: { value: 'f' } });
+    wrapper.update();
+    expect(wrapper.find('input').props().value).toEqual('Foo');
   });
 
   it('Can insert text in uncontrolled case with autoComplete off and allowFreeform on', () => {
-    let comboBoxRoot;
-    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any>;
     let wrapper = mount(
       <ComboBox
         label='testgroup'
@@ -249,16 +239,12 @@ describe('ComboBox', () => {
         autoComplete='off'
         allowFreeform={ true }
       />);
-    comboBoxRoot = wrapper.find('.ms-ComboBox');
-    inputElement = comboBoxRoot.find('input');
-    inputElement.simulate('change', { target: { value: 'f' } });
-    inputElement = comboBoxRoot.find('input');
-    expect(inputElement.props().value).toEqual('f');
+    wrapper.find('input').simulate('change', { target: { value: 'f' } });
+    wrapper.update();
+    expect(wrapper.find('input').props().value).toEqual('f');
   });
 
   it('Can insert text in uncontrolled case with autoComplete and allowFreeform off', () => {
-    let comboBoxRoot;
-    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any>;
     let wrapper = mount(
       <ComboBox
         label='testgroup'
@@ -267,32 +253,24 @@ describe('ComboBox', () => {
         autoComplete='off'
         allowFreeform={ false }
       />);
-    comboBoxRoot = wrapper.find('.ms-ComboBox');
-    inputElement = comboBoxRoot.find('input');
-    inputElement.simulate('keydown', { which: 'f' });
-    inputElement = comboBoxRoot.find('input');
-    expect(inputElement.props().value).toEqual('One');
+    wrapper.find('input').simulate('keydown', { which: 'f' });
+    wrapper.update();
+    expect(wrapper.find('input').props().value).toEqual('One');
   });
 
   it('Can change selected option with keyboard', () => {
-    let comboBoxRoot;
-    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any>;
     let wrapper = mount(
       <ComboBox
         label='testgroup'
         defaultSelectedKey='1'
         options={ DEFAULT_OPTIONS2 }
       />);
-    comboBoxRoot = wrapper.find('.ms-ComboBox');
-    inputElement = comboBoxRoot.find('input');
-    inputElement.simulate('keydown', { which: KeyCodes.down });
-    inputElement = comboBoxRoot.find('input');
-    expect(inputElement.props().value).toEqual('Foo');
+    wrapper.find('input').simulate('keydown', { which: KeyCodes.down });
+    wrapper.update();
+    expect(wrapper.find('input').props().value).toEqual('Foo');
   });
 
   it('Cannot insert text while disabled', () => {
-    let comboBoxRoot;
-    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any>;
     let wrapper = mount(
       <ComboBox
         label='testgroup'
@@ -300,16 +278,12 @@ describe('ComboBox', () => {
         options={ DEFAULT_OPTIONS2 }
         disabled={ true }
       />);
-    comboBoxRoot = wrapper.find('.ms-ComboBox');
-    inputElement = comboBoxRoot.find('input');
-    inputElement.simulate('keydown', { which: KeyCodes.a });
-    inputElement = comboBoxRoot.find('input');
-    expect(inputElement.props().value).toEqual('One');
+    wrapper.find('input').simulate('keydown', { which: KeyCodes.a });
+    wrapper.update();
+    expect(wrapper.find('input').props().value).toEqual('One');
   });
 
   it('Cannot change selected option with keyboard while disabled', () => {
-    let comboBoxRoot;
-    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any>;
     let wrapper = mount(
       <ComboBox
         label='testgroup'
@@ -317,16 +291,12 @@ describe('ComboBox', () => {
         options={ DEFAULT_OPTIONS2 }
         disabled={ true }
       />);
-    comboBoxRoot = wrapper.find('.ms-ComboBox');
-    inputElement = comboBoxRoot.find('input');
-    inputElement.simulate('keydown', { which: KeyCodes.down });
-    inputElement = comboBoxRoot.find('input');
-    expect(inputElement.props().value).toEqual('One');
+    wrapper.find('input').simulate('keydown', { which: KeyCodes.down });
+    wrapper.update();
+    expect(wrapper.find('input').props().value).toEqual('One');
   });
 
   it('Cannot expand the menu when clicking on the input while disabled', () => {
-    let comboBoxRoot;
-    let inputElement;
     let wrapper = mount(
       <ComboBox
         label='testgroup'
@@ -334,10 +304,8 @@ describe('ComboBox', () => {
         options={ DEFAULT_OPTIONS2 }
         disabled={ true }
       />);
-    comboBoxRoot = wrapper.find('.ms-ComboBox');
-    inputElement = comboBoxRoot.find('input');
-    inputElement.simulate('click');
-    expect(comboBoxRoot.find('.is-opened').length).toEqual(0);
+    wrapper.find('input').simulate('click');
+    expect(wrapper.find('.is-opened').length).toEqual(0);
   });
 
   it('Cannot expand the menu when clicking on the button while disabled', () => {
@@ -405,6 +373,8 @@ describe('ComboBox', () => {
     expect(executionCount).toEqual(1);
     expect(updatedOption).toEqual(initialOption);
     expect(updatedIndex).toEqual(0);
-    expect(inputElement.props().value).toEqual('Text');
+
+    wrapper.update();
+    expect(wrapper.find('.ms-ComboBox input').props().value).toEqual('Text');
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
index 2712809284b8b..2eb2e593da54a 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
@@ -12,22 +12,26 @@ import {
 } from 'office-ui-fabric-react/lib/Utilities';
 import { SelectableOptionMenuItemType } from 'office-ui-fabric-react/lib/utilities/selectableOption/SelectableOption.types';
 
-export class ComboBoxBasicExample extends React.Component<any, any> {
+export class ComboBoxBasicExample extends React.Component<{}, {
+  options: IComboBoxOption[];
+  selectedOptionKey?: string | number;
+  value?: string;
+}> {
   private _testOptions =
-  [{ key: 'Header', text: 'Theme Fonts', itemType: SelectableOptionMenuItemType.Header },
-  { key: 'A', text: 'Arial Black' },
-  { key: 'B', text: 'Times New Roman' },
-  { key: 'C', text: 'Comic Sans MS' },
-  { key: 'divider_2', text: '-', itemType: SelectableOptionMenuItemType.Divider },
-  { key: 'Header1', text: 'Other Options', itemType: SelectableOptionMenuItemType.Header },
-  { key: 'D', text: 'Option d' },
-  { key: 'E', text: 'Option e' },
-  { key: 'F', text: 'Option f' },
-  { key: 'G', text: 'Option g' },
-  { key: 'H', text: 'Option h' },
-  { key: 'I', text: 'Option i' },
-  { key: 'J', text: 'Option j', disabled: true },
-  ];
+    [{ key: 'Header', text: 'Theme Fonts', itemType: SelectableOptionMenuItemType.Header },
+    { key: 'A', text: 'Arial Black' },
+    { key: 'B', text: 'Times New Roman' },
+    { key: 'C', text: 'Comic Sans MS' },
+    { key: 'divider_2', text: '-', itemType: SelectableOptionMenuItemType.Divider },
+    { key: 'Header1', text: 'Other Options', itemType: SelectableOptionMenuItemType.Header },
+    { key: 'D', text: 'Option d' },
+    { key: 'E', text: 'Option e' },
+    { key: 'F', text: 'Option f' },
+    { key: 'G', text: 'Option g' },
+    { key: 'H', text: 'Option h' },
+    { key: 'I', text: 'Option i' },
+    { key: 'J', text: 'Option j', disabled: true },
+    ];
 
   private _fontMapping: { [key: string]: string } = {
     ['Arial Black']: '"Arial Black", "Arial Black_MSFontService", sans-serif',
@@ -38,11 +42,11 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
 
   private scaleOptions: IComboBoxOption[] = [];
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     this.state = {
       options: [],
-      selectedOptionKey: null,
+      selectedOptionKey: undefined,
       value: 'Calibri'
     };
 
@@ -271,7 +275,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
     this.setState({
       options: newOptions,
       selectedOptionKey: 'C1',
-      value: null
+      value: undefined
     });
 
     return newOptions;
@@ -282,12 +286,12 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
     if (option !== undefined) {
       this.setState({
         selectedOptionKey: option.key,
-        value: null
+        value: undefined
       });
     } else if (index !== undefined && index >= 0 && index < this.state.options.length) {
       this.setState({
         selectedOptionKey: this.state.options[index].key,
-        value: null
+        value: undefined
       });
     } else if (value !== undefined) {
       let newOption: IComboBoxOption = { key: value, text: value };
@@ -295,7 +299,7 @@ export class ComboBoxBasicExample extends React.Component<any, any> {
       this.setState({
         options: [...this.state.options, newOption],
         selectedOptionKey: newOption.key,
-        value: null
+        value: undefined
       });
     }
   }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.CustomStyled.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.CustomStyled.Example.tsx
index 72f8c9353b689..6f1ae3b456899 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.CustomStyled.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.CustomStyled.Example.tsx
@@ -7,47 +7,43 @@ import './ComboBox.Basic.Example.scss';
 export class ComboBoxCustomStyledExample extends React.Component<any, any> {
 
   private _testOptionsWithCustomStyling =
-  [{
-    key: 'A',
-    text: 'Arial Black',
-    styles: {
-      optionText: {
-        fontFamily: '"Arial Black", "Arial Black_MSFontService", sans-serif',
+    [{
+      key: 'A',
+      text: 'Arial Black',
+      styles: {
+        optionText: {
+          fontFamily: '"Arial Black", "Arial Black_MSFontService", sans-serif',
+        }
       }
-    }
-  },
-  {
-    key: 'B',
-    text: 'Times New Roman',
-    styles: {
-      optionText: {
-        fontFamily: '"Times New Roman", "Times New Roman_MSFontService", serif',
+    },
+    {
+      key: 'B',
+      text: 'Times New Roman',
+      styles: {
+        optionText: {
+          fontFamily: '"Times New Roman", "Times New Roman_MSFontService", serif',
+        }
       }
-    }
-  },
-  {
-    key: 'C',
-    text: 'Comic Sans MS',
-    styles: {
-      optionText: {
-        fontFamily: '"Comic Sans MS", "Comic Sans MS_MSFontService", fantasy',
+    },
+    {
+      key: 'C',
+      text: 'Comic Sans MS',
+      styles: {
+        optionText: {
+          fontFamily: '"Comic Sans MS", "Comic Sans MS_MSFontService", fantasy',
+        }
       }
-    }
-  },
-  {
-    key: 'D',
-    text: 'Calibri',
-    styles: {
-      optionText: {
-        fontFamily: 'Calibri, Calibri_MSFontService, sans-serif',
+    },
+    {
+      key: 'D',
+      text: 'Calibri',
+      styles: {
+        optionText: {
+          fontFamily: 'Calibri, Calibri_MSFontService, sans-serif',
+        }
       }
-    }
-  },
-  ];
-
-  constructor() {
-    super();
-  }
+    },
+    ];
 
   public render() {
     return (
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
index 2c6e256f94518..8d0c5672b7ee3 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
@@ -4,13 +4,14 @@ import * as React from 'react';
 import { Promise } from 'es6-promise';
 import * as ReactTestUtils from 'react-dom/test-utils';
 import {
-  KeyCodes,
+  KeyCodes
 } from '../../Utilities';
 import { FocusZoneDirection } from '../../FocusZone';
 
 import { ContextualMenu, canAnyMenuItemsCheck } from './ContextualMenu';
 import { IContextualMenuItem, ContextualMenuItemType } from './ContextualMenu.types';
 import { Layer } from '../Layer/Layer';
+import { mount } from 'enzyme';
 
 describe('ContextualMenu', () => {
 
@@ -289,12 +290,13 @@ describe('ContextualMenu', () => {
         key: 'TestKey1',
         itemType: ContextualMenuItemType.Section,
         sectionProps: {
+          key: 'Section1',
           topDivider: true,
           bottomDivider: true,
           items: [
             {
               name: 'TestText 2',
-              key: 'TestKey3'
+              key: 'TestKey2'
             },
             {
               name: 'TestText 3',
@@ -307,6 +309,7 @@ describe('ContextualMenu', () => {
         key: 'TestKey4',
         itemType: ContextualMenuItemType.Section,
         sectionProps: {
+          key: 'Section1',
           items: [
             {
               name: 'TestText 5',
@@ -321,7 +324,7 @@ describe('ContextualMenu', () => {
       }
     ];
 
-    ReactTestUtils.renderIntoDocument<ContextualMenu>(
+    const foo = ReactTestUtils.renderIntoDocument<ContextualMenu>(
       <ContextualMenu
         items={ items }
       />
@@ -329,6 +332,7 @@ describe('ContextualMenu', () => {
 
     let menuItems = document.querySelectorAll('li');
     expect(menuItems.length).toEqual(8);
+
   });
 
   it('does not return a value if no items are given', () => {
@@ -539,6 +543,7 @@ describe('ContextualMenu', () => {
           name: 'Item 3',
           key: 'Item 3',
           sectionProps: {
+            key: 'Section1',
             items: [
               { name: 'Item 1', key: 'Item 1' },
               { name: 'Item 2', key: 'Item 2', canCheck: true },
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index b8efa962902bf..686b89ab34b93 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -528,10 +528,13 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       style: item.style
     };
 
-    return React.createElement(
-      'button',
-      assign({}, getNativeProps(item, buttonProperties), itemButtonProperties),
-      this._renderMenuItemChildren(item, classNames, index, hasCheckmarks!, hasIcons!));
+    return (
+      <button
+        { ...getNativeProps(item, buttonProperties) }
+        { ...itemButtonProperties }
+        children={ this._renderMenuItemChildren(item, classNames, index, hasCheckmarks!, hasIcons!) }
+      />
+    );
   }
 
   private _renderSplitButton(
@@ -570,6 +573,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     const defaultRole = canCheck ? 'menuitemcheckbox' : 'menuitem';
 
     const itemProps = {
+      key: item.key,
       onClick: this._executeItemClick.bind(this, item),
       disabled: this._isItemDisabled(item) || item.primaryDisabled,
       name: item.name,
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx
index 5132572e3f856..4fa1b5f774ef5 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx
@@ -3,10 +3,10 @@ import { ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMen
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import './ContextualMenuExample.scss';
 
-export class ContextualMenuBasicExample extends React.Component<any, any> {
+export class ContextualMenuBasicExample extends React.Component {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     this.state = {
       showCallout: false
     };
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
index 985bd210e0237..e94043cc69f7f 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
@@ -9,10 +9,10 @@ export interface IContextualMenuMultiselectExampleState {
 
 let keys: string[] = ['newItem', 'share', 'mobile', 'enablePrint', 'enableMusic', 'newSub', 'emailMessage', 'calendarEvent'];
 
-export class ContextualMenuCheckmarksExample extends React.Component<any, IContextualMenuMultiselectExampleState> {
+export class ContextualMenuCheckmarksExample extends React.Component<{}, IContextualMenuMultiselectExampleState> {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this._onToggleSelect = this._onToggleSelect.bind(this);
 
@@ -32,77 +32,77 @@ export class ContextualMenuCheckmarksExample extends React.Component<any, IConte
           {
             shouldFocusOnMount: true,
             items:
-            [
-              {
-                key: keys[0],
-                name: 'New',
-                canCheck: true,
-                isChecked: selection![keys[0]],
-                onClick: this._onToggleSelect
-              },
-              {
-                key: keys[1],
-                name: 'Share',
-                canCheck: true,
-                isChecked: selection![keys[1]],
-                onClick: this._onToggleSelect
-              },
-              {
-                key: keys[2],
-                name: 'Mobile',
-                canCheck: true,
-                isChecked: selection![keys[2]],
-                onClick: this._onToggleSelect
-              },
-              {
-                key: 'divider_1',
-                itemType: ContextualMenuItemType.Divider
-              },
+              [
+                {
+                  key: keys[0],
+                  name: 'New',
+                  canCheck: true,
+                  isChecked: selection![keys[0]],
+                  onClick: this._onToggleSelect
+                },
+                {
+                  key: keys[1],
+                  name: 'Share',
+                  canCheck: true,
+                  isChecked: selection![keys[1]],
+                  onClick: this._onToggleSelect
+                },
+                {
+                  key: keys[2],
+                  name: 'Mobile',
+                  canCheck: true,
+                  isChecked: selection![keys[2]],
+                  onClick: this._onToggleSelect
+                },
+                {
+                  key: 'divider_1',
+                  itemType: ContextualMenuItemType.Divider
+                },
 
-              {
-                key: keys[3],
-                name: 'Print',
-                canCheck: true,
-                isChecked: selection![keys[3]],
-                onClick: this._onToggleSelect
-              },
-              {
-                key: keys[4],
-                name: 'Music',
-                canCheck: true,
-                isChecked: selection![keys[4]],
-                onClick: this._onToggleSelect
-              },
-              {
-                key: keys[5],
-                iconProps: {
-                  iconName: 'MusicInCollectionFill'
+                {
+                  key: keys[3],
+                  name: 'Print',
+                  canCheck: true,
+                  isChecked: selection![keys[3]],
+                  onClick: this._onToggleSelect
+                },
+                {
+                  key: keys[4],
+                  name: 'Music',
+                  canCheck: true,
+                  isChecked: selection![keys[4]],
+                  onClick: this._onToggleSelect
                 },
-                subMenuProps: {
-                  items: [
-                    {
-                      key: keys[6],
-                      name: 'Email message',
-                      canCheck: true,
-                      isChecked: selection![keys[6]],
-                      onClick: this._onToggleSelect
-                    },
-                    {
-                      key: keys[7],
-                      name: 'Calendar event',
-                      canCheck: true,
-                      isChecked: selection![keys[7]],
-                      onClick: this._onToggleSelect
-                    }
-                  ],
+                {
+                  key: keys[5],
+                  iconProps: {
+                    iconName: 'MusicInCollectionFill'
+                  },
+                  subMenuProps: {
+                    items: [
+                      {
+                        key: keys[6],
+                        name: 'Email message',
+                        canCheck: true,
+                        isChecked: selection![keys[6]],
+                        onClick: this._onToggleSelect
+                      },
+                      {
+                        key: keys[7],
+                        name: 'Calendar event',
+                        canCheck: true,
+                        isChecked: selection![keys[7]],
+                        onClick: this._onToggleSelect
+                      }
+                    ],
+                  },
+                  name: 'Split Button',
+                  canCheck: true,
+                  isChecked: selection![keys[5]],
+                  split: true,
+                  onClick: this._onToggleSelect,
                 },
-                name: 'Split Button',
-                canCheck: true,
-                isChecked: selection![keys[5]],
-                split: true,
-                onClick: this._onToggleSelect,
-              },
-            ]
+              ]
           }
         }
       />
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
index 711b643c346f2..a591d48fd70b4 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
@@ -42,8 +42,8 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
     gapSize: TextField;
   };
 
-  public constructor() {
-    super();
+  public constructor(props: {}) {
+    super(props);
 
     this.state = {
       isBeakVisible: false,
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.Example.tsx
index 0f32eaf68296f..3096efe21ab88 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.Example.tsx
@@ -4,10 +4,10 @@ import { Callout } from 'office-ui-fabric-react/lib/Callout';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import './ContextualMenuExample.scss';
 
-export class ContextualMenuIconExample extends React.Component<any, any> {
+export class ContextualMenuIconExample extends React.Component<{}, { showCallout: boolean }> {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     this.state = {
       showCallout: false
     };
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.ScrollBar.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.ScrollBar.Example.tsx
index 1873ccac03efb..177d82852559b 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.ScrollBar.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.ScrollBar.Example.tsx
@@ -3,10 +3,12 @@ import { DirectionalHint, ContextualMenuItemType } from 'office-ui-fabric-react/
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import './ContextualMenuExample.scss';
 
-export class ContextualMenuWithScrollBarExample extends React.Component<any, any> {
+export class ContextualMenuWithScrollBarExample extends React.Component<{}, {
+  showCallout: boolean;
+}> {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     this.state = {
       showCallout: false
     };
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 5c33a9e4bb797..5b1658ec8343d 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -128,7 +128,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
   private _focusOnSelectedDateOnUpdate: boolean;
 
   constructor(props: IDatePickerProps) {
-    super();
+    super(props);
 
     let { formatDate, value } = props;
 
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx
index 4a6846aabdfd8..ddb8f1f0ea460 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx
@@ -65,9 +65,9 @@ export interface IDatePickerBasicExampleState {
   firstDayOfWeek?: DayOfWeek;
 }
 
-export class DatePickerBasicExample extends React.Component<any, IDatePickerBasicExampleState> {
-  public constructor() {
-    super();
+export class DatePickerBasicExample extends React.Component<{}, IDatePickerBasicExampleState> {
+  public constructor(props: {}) {
+    super(props);
 
     this.state = {
       firstDayOfWeek: DayOfWeek.Sunday
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Bounded.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Bounded.Example.tsx
index 46b3d47455cf6..7b923ec79ef37 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Bounded.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Bounded.Example.tsx
@@ -79,9 +79,10 @@ export interface IDatePickerRequiredExampleState {
   firstDayOfWeek?: DayOfWeek;
 }
 
-export class DatePickerBoundedExample extends React.Component<any, IDatePickerRequiredExampleState> {
-  public constructor() {
-    super();
+export class DatePickerBoundedExample extends React.Component<{}, IDatePickerRequiredExampleState> {
+
+  constructor(props: {}) {
+    super(props);
 
     this.state = {
       firstDayOfWeek: DayOfWeek.Sunday
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Format.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Format.Example.tsx
index ead84a63a0a4d..ee5c5e88e6680 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Format.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Format.Example.tsx
@@ -67,11 +67,11 @@ export interface IDatePickerFormatExampleState {
 }
 
 export class DatePickerFormatExample extends React.Component<
-  any,
+  {},
   IDatePickerFormatExampleState
-> {
-  public constructor() {
-    super();
+  > {
+  public constructor(props: {}) {
+    super(props);
 
     this.state = {
       firstDayOfWeek: DayOfWeek.Sunday,
@@ -94,18 +94,18 @@ export class DatePickerFormatExample extends React.Component<
         </p>
         <DatePicker
           label='Start date'
-          isRequired={false}
-          allowTextInput={true}
-          ariaLabel={desc}
-          firstDayOfWeek={firstDayOfWeek}
-          strings={DayPickerStrings}
-          value={value!}
-          onSelectDate={this._onSelectDate}
-          formatDate={this._onFormatDate}
-          parseDateFromString={this._onParseDateFromString}
+          isRequired={ false }
+          allowTextInput={ true }
+          ariaLabel={ desc }
+          firstDayOfWeek={ firstDayOfWeek }
+          strings={ DayPickerStrings }
+          value={ value! }
+          onSelectDate={ this._onSelectDate }
+          formatDate={ this._onFormatDate }
+          parseDateFromString={ this._onParseDateFromString }
         />
-        <DefaultButton onClick={this._onClick} text='Clear' />
-        <div>{(this.state.value || '').toString()}</div>
+        <DefaultButton onClick={ this._onClick } text='Clear' />
+        <div>{ (this.state.value || '').toString() }</div>
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx
index 3e89cf82947ba..eb6f25595e0dc 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx
@@ -70,9 +70,10 @@ export interface IDatePickerInputExampleState {
   value?: Date | null;
 }
 
-export class DatePickerInputExample extends React.Component<any, IDatePickerInputExampleState> {
-  public constructor() {
-    super();
+export class DatePickerInputExample extends React.Component<{}, IDatePickerInputExampleState> {
+
+  constructor(props: {}) {
+    super(props);
 
     this.state = {
       firstDayOfWeek: DayOfWeek.Sunday,
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Required.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Required.Example.tsx
index d416ddbed0992..f3ce21c075815 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Required.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Required.Example.tsx
@@ -71,9 +71,9 @@ export interface IDatePickerRequiredExampleState {
   firstDayOfWeek?: DayOfWeek;
 }
 
-export class DatePickerRequiredExample extends React.Component<any, IDatePickerRequiredExampleState> {
-  public constructor() {
-    super();
+export class DatePickerRequiredExample extends React.Component<{}, IDatePickerRequiredExampleState> {
+  constructor(props: {}) {
+    super(props);
 
     this.state = {
       firstDayOfWeek: DayOfWeek.Sunday
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.WeekNumbers.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.WeekNumbers.Example.tsx
index 8afa7a88e106d..4ffda00841333 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.WeekNumbers.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.WeekNumbers.Example.tsx
@@ -65,9 +65,9 @@ export interface IDatePickerBasicExampleState {
   firstDayOfWeek?: DayOfWeek;
 }
 
-export class DatePickerWeekNumbersExample extends React.Component<any, IDatePickerBasicExampleState> {
-  public constructor() {
-    super();
+export class DatePickerWeekNumbersExample extends React.Component<{}, IDatePickerBasicExampleState> {
+  constructor(props: {}) {
+    super(props);
 
     this.state = {
       firstDayOfWeek: DayOfWeek.Monday
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
index 51386f9dd728d..a14d06067951c 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
@@ -23,7 +23,7 @@ export interface IDetailsRowFieldsState {
 
 export class DetailsRowFields extends BaseComponent<IDetailsRowFieldsProps, IDetailsRowFieldsState> {
   constructor(props: IDetailsRowFieldsProps) {
-    super();
+    super(props);
 
     this.state = this._getState(props);
   }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
index a7844c152b761..b350a86bfbac6 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
@@ -48,7 +48,7 @@ export interface IDetailsListAdvancedExampleState {
   sortedColumnKey?: string;
 }
 
-export class DetailsListAdvancedExample extends React.Component<any, IDetailsListAdvancedExampleState> {
+export class DetailsListAdvancedExample extends React.Component<{}, IDetailsListAdvancedExampleState> {
   public refs: {
     [key: string]: React.ReactInstance;
     list: DetailsList
@@ -57,8 +57,8 @@ export class DetailsListAdvancedExample extends React.Component<any, IDetailsLis
   private _isFetchingItems: boolean;
   private _selection: Selection;
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     if (!_items) {
       _items = createListItems(ITEMS_COUNT);
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
index 4e8cce004deac..f121a24db1908 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
@@ -34,11 +34,14 @@ let _columns: IColumn[] = [
   },
 ];
 
-export class DetailsListBasicExample extends React.Component<any, any> {
+export class DetailsListBasicExample extends React.Component<{}, {
+  items: {}[];
+  selectionDetails: {};
+}> {
   private _selection: Selection;
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     // Populate with items for demos.
     if (_items.length === 0) {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Compact.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Compact.Example.tsx
index 321ac9d4fc1ee..26c9b2f1fe04e 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Compact.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Compact.Example.tsx
@@ -35,11 +35,14 @@ let _columns = [
   },
 ];
 
-export class DetailsListCompactExample extends React.Component<any, any> {
+export class DetailsListCompactExample extends React.Component<{}, {
+  items: {}[];
+  selectionDetails: string;
+}> {
   private _selection: Selection;
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     // Populate with items for demos.
     if (_items.length === 0) {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomGroupHeaders.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomGroupHeaders.Example.tsx
index e748cf51e859f..e7552c5374c47 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomGroupHeaders.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomGroupHeaders.Example.tsx
@@ -12,9 +12,10 @@ const GROUP_COUNT = 20;
 let _items: any[];
 let _groups: IGroup[];
 
-export class DetailsListCustomGroupHeadersExample extends React.Component<any, any> {
-  constructor() {
-    super();
+export class DetailsListCustomGroupHeadersExample extends React.Component {
+
+  constructor(props: {}) {
+    super(props);
 
     _items = _items || createListItems(500);
     _groups = _groups || createGroups(GROUP_COUNT, 1, 0, ITEMS_PER_GROUP);
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomRows.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomRows.Example.tsx
index 0564d22d6b510..bd5e31de70b88 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomRows.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomRows.Example.tsx
@@ -8,9 +8,10 @@ import './DetailsListExample.scss';
 
 let _items: any[];
 
-export class DetailsListCustomRowsExample extends React.Component<any, any> {
-  constructor() {
-    super();
+export class DetailsListCustomRowsExample extends React.Component {
+
+  constructor(props: {}) {
+    super(props);
 
     _items = _items || createListItems(500);
   }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx
index 631a52536ca56..71ae50aadd449 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx
@@ -15,11 +15,14 @@ import './DetailsList.DragDrop.Example.scss';
 let _draggedItem: any = null;
 let _draggedIndex: number = -1;
 
-export class DetailsListDragDropExample extends React.Component<any, any> {
+export class DetailsListDragDropExample extends React.Component<{}, {
+  items: {}[];
+  selectionDetails?: string;
+}> {
   private _selection: Selection;
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this._onRenderItemColumn = this._onRenderItemColumn.bind(this);
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
index 6fd1aae1a41b7..c68af796cf07e 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
@@ -50,9 +50,11 @@ let _items = [
   }
 ];
 
-export class DetailsListGroupedExample extends React.Component<any, any> {
-  constructor() {
-    super();
+export class DetailsListGroupedExample extends React.Component<{}, {
+  items: {}[];
+}> {
+  constructor(props: {}) {
+    super(props);
 
     this.state = {
       items: _items
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
index 2791fa3b30cb0..31c2d894bf518 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
@@ -17,6 +17,7 @@ export class DetailsListNavigatingFocusExample extends React.Component<{}, IDeta
 
   private _columns = [
     {
+      key: 'filepath',
       name: 'File path',
       onRender: item =>
         (
@@ -29,6 +30,7 @@ export class DetailsListNavigatingFocusExample extends React.Component<{}, IDeta
         ),
     } as IColumn,
     {
+      key: 'size',
       name: 'Size',
       onRender: item => '4 KB',
     } as IColumn
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
index 34c3299fc7d0c..4dad0e5867f87 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
@@ -4,10 +4,13 @@ import { Dialog, DialogType, DialogFooter } from 'office-ui-fabric-react/lib/Dia
 import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import './Dialog.Basic.Example.scss';
 
-export class DialogBasicExample extends React.Component<any, any> {
+export class DialogBasicExample extends React.Component<{}, {
+  hideDialog: boolean
+}> {
+
+  constructor(props: {}) {
+    super(props);
 
-  constructor() {
-    super();
     this.state = {
       hideDialog: true
     };
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx
index 164897924538c..1fbcb41fd0552 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx
@@ -3,10 +3,12 @@ import { autobind } from '../../../Utilities';
 import { Dialog, DialogType, DialogFooter } from 'office-ui-fabric-react/lib/Dialog';
 import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
 
-export class DialogBlockingExample extends React.Component<any, any> {
+export class DialogBlockingExample extends React.Component<{}, {
+  hideDialog: boolean;
+}> {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     this.state = {
       hideDialog: true
     };
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.LargeHeader.Example.tsx b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.LargeHeader.Example.tsx
index ef0cae588597a..f9981e84b0bf9 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.LargeHeader.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.LargeHeader.Example.tsx
@@ -4,10 +4,12 @@ import { Dialog, DialogType, DialogFooter } from 'office-ui-fabric-react/lib/Dia
 import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { ChoiceGroup } from 'office-ui-fabric-react/lib/ChoiceGroup';
 
-export class DialogLargeHeaderExample extends React.Component<any, any> {
+export class DialogLargeHeaderExample extends React.Component<{}, {
+  hideDialog: boolean;
+}> {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     this.state = {
       hideDialog: true
     };
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
index ba866c24539b5..f1bd9871962b7 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
@@ -4,12 +4,16 @@ import { Dropdown, IDropdown, DropdownMenuItemType, IDropdownOption } from 'offi
 import { autobind, BaseComponent } from '../../../Utilities';
 import './Dropdown.Basic.Example.scss';
 
-export class DropdownBasicExample extends BaseComponent<any, any> {
+export class DropdownBasicExample extends BaseComponent<{}, {
+  selectedItem?: { key: string | number | undefined },
+  selectedItems: string[]
+}> {
   private _basicDropdown: IDropdown;
-  constructor() {
-    super();
+
+  constructor(props: {}) {
+    super(props);
     this.state = {
-      selectedItem: null,
+      selectedItem: undefined,
       selectedItems: [],
     };
   }
@@ -73,7 +77,7 @@ export class DropdownBasicExample extends BaseComponent<any, any> {
         <Dropdown
           className='Dropdown-example'
           label='Controlled example:'
-          selectedKey={ selectedItem && selectedItem.key }
+          selectedKey={ (selectedItem ? selectedItem.key : undefined) }
           onChanged={ this.changeState }
           onFocus={ this._log('onFocus called') }
           onBlur={ this._log('onBlur called') }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
index fcd22ae6a9940..0f1f3f3a3f19d 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
@@ -4,9 +4,10 @@ import './Dropdown.Basic.Example.scss';
 import { DropdownMenuItemType, IDropdownOption, IDropdownProps } from './../Dropdown.types';
 import { Icon } from '../../Icon';
 
-export class DropdownCustomExample extends React.Component<any, any> {
-  constructor() {
-    super();
+export class DropdownCustomExample extends React.Component {
+
+  constructor(props: {}) {
+    super(props);
     this.state = {
       selectedItem: null
     };
diff --git a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
index 56f5021bb8646..e41b57371f6ac 100644
--- a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
+++ b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
@@ -45,8 +45,8 @@ export class Fabric extends BaseComponent<IFabricProps, IFabricState> {
   // tslint:disable-next-line:no-unused-variable
   private _root: HTMLElement;
 
-  constructor() {
-    super();
+  constructor(props: IFabricProps) {
+    super(props);
 
     this.state = {
       isFocusVisible: _lastIsFocusVisible
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
index cd14fee7ee711..5af69c0b3e3d8 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
@@ -1,194 +1,194 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
-import * as ReactTestUtils from 'react-dom/test-utils';
 /* tslint:enable:no-unused-variable */
 import * as renderer from 'react-test-renderer';
-import { mount, shallow } from 'enzyme';
+import { mount, shallow, ReactWrapper } from 'enzyme';
 import { setRTL } from '../../Utilities';
 import { Facepile } from './Facepile';
 import { IFacepilePersona, OverflowButtonType } from './Facepile.types';
 import { PersonaSize } from '../Persona';
 import { PersonaCoin } from '../../PersonaCoin';
 import { TestImages } from '../../common/TestImages';
+import { findNodes, expectOne, expectMissing } from '../../common/testUtilities';
+
+const facepilePersonas: IFacepilePersona[] = [
+  {
+    imageUrl: TestImages.personaFemale,
+    personaName: 'Annie Lindqvist',
+    data: '50%'
+  },
+  {
+    imageUrl: TestImages.personaFemale,
+    personaName: 'Aaron Reid',
+    data: '$1,000'
+  },
+  {
+    personaName: 'Alex Lundberg',
+    data: '75%',
+    onClick: (ev: React.MouseEvent<HTMLElement>, persona: IFacepilePersona) =>
+      alert('You clicked on ' + persona.personaName + '. Extra data: ' + persona.data)
+  }
+];
 
 describe('Facepile', () => {
-  const facepilePersonas: IFacepilePersona[] = [
-    {
-      imageUrl: TestImages.personaFemale,
-      personaName: 'Annie Lindqvist',
-      data: '50%'
-    },
-    {
-      imageUrl: TestImages.personaFemale,
-      personaName: 'Aaron Reid',
-      data: '$1,000'
-    },
-    {
-      personaName: 'Alex Lundberg',
-      data: '75%',
-      onClick: (ev: React.MouseEvent<HTMLElement>, persona: IFacepilePersona) =>
-        alert('You clicked on ' + persona.personaName + '. Extra data: ' + persona.data)
-    }
-  ];
 
-  describe('Render personas and buttons', () => {
-    beforeEach(() => {
-      setRTL(false);
-    });
+  beforeEach(() => {
+    setRTL(false);
+  });
 
-    it('renders Facepile correctly', () => {
-      const component = renderer.create(<Facepile personas={ facepilePersonas } />);
-      let tree = component.toJSON();
-      expect(tree).toMatchSnapshot();
-    });
+  it('renders Facepile correctly', () => {
+    const component = renderer.create(<Facepile personas={ facepilePersonas } />);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
 
-    it('renders with only add button if no personas found and addButtonProps are not null', () => {
-      const wrapper = ReactTestUtils.renderIntoDocument(
-        <Facepile
-          personas={ [] }
-          addButtonProps={ {} }
-          showAddButton={ true }
-        />);
-      let facepile = ReactDOM.findDOMNode(wrapper as React.ReactInstance);
-
-      let addButton = facepile.querySelectorAll('.ms-Facepile-addButton');
-      expect(addButton).toHaveLength(1);
-      let buttons = facepile.querySelectorAll('.ms-Facepile-itemButton');
-      expect(buttons).toHaveLength(1);
-    });
+  it('renders with only add button if no personas found and addButtonProps are not null', () => {
+    const wrapper = mount(
+      <Facepile
+        personas={ [] }
+        addButtonProps={ {} }
+        showAddButton={ true }
+      />
+    );
 
-    it('renders chevron overflow button if overflowButtonProps are not null and OverflowButtonType equals downArrow', () => {
-      const wrapper = ReactTestUtils.renderIntoDocument(
-        <Facepile
-          personas={ [] }
-          overflowButtonProps={ {} }
-          overflowButtonType={ OverflowButtonType.downArrow }
-        />);
-      let facepile = ReactDOM.findDOMNode(wrapper as React.ReactInstance);
-      let overflowButton = facepile.querySelectorAll('.ms-Facepile-overflowButton');
-      expect(overflowButton).toHaveLength(1);
-      let buttons = facepile.querySelectorAll('.ms-Facepile-itemButton');
-      expect(buttons).toHaveLength(1);
-    });
+    expectOne(wrapper, '.ms-Facepile-addButton');
+    expectOne(wrapper, '.ms-Facepile-itemButton');
+  });
 
-    it('renders more overflow button if overflowButtonProps are not null as OverflowButtonType equals more', () => {
-      const wrapper = ReactTestUtils.renderIntoDocument(
-        <Facepile
-          personas={ [] }
-          overflowButtonProps={ {} }
-          overflowButtonType={ OverflowButtonType.more }
-        />);
-      let facepile = ReactDOM.findDOMNode(wrapper as React.ReactInstance);
-      let overflowButton = facepile.querySelectorAll('.ms-Facepile-overflowButton');
-      expect(overflowButton).toHaveLength(1);
-      let buttons = facepile.querySelectorAll('.ms-Facepile-itemButton');
-      expect(buttons).toHaveLength(1);
-    });
+  it('renders chevron overflow button if overflowButtonProps are not null and OverflowButtonType equals downArrow', () => {
+    const wrapper = mount(
+      <Facepile
+        personas={ [] }
+        overflowButtonProps={ {} }
+        overflowButtonType={ OverflowButtonType.downArrow }
+      />
+    );
 
-    it('renders without descriptive overflow button if overflowButtonProps are not null and maximum personas are not exceeded', () => {
-      const wrapper = ReactTestUtils.renderIntoDocument(
-        <Facepile
-          personas={ [] }
-          overflowButtonProps={ {} }
-          overflowButtonType={ OverflowButtonType.descriptive }
-        />);
-      let facepile = ReactDOM.findDOMNode(wrapper as React.ReactInstance);
-      let overflowButton = facepile.querySelectorAll('.ms-Facepile-descriptiveOverflowButton');
-      expect(overflowButton).toHaveLength(0);
-      let buttons = facepile.querySelectorAll('.ms-Facepile-itemButton');
-      expect(buttons).toHaveLength(0);
-    });
+    expectOne(wrapper, '.ms-Facepile-overflowButton');
+    expectOne(wrapper, '.ms-Facepile-itemButton');
+  });
 
-    it('renders with descriptive overflow button if overflowButtonProps are not null and maximum personas are exceeded', () => {
-      let personas: IFacepilePersona[] = facepilePersonas.concat(...facepilePersonas, ...facepilePersonas);
-      const wrapper = shallow(
-        <Facepile
-          personas={ personas }
-          maxDisplayablePersonas={ 5 }
-          overflowButtonProps={ {} }
-          overflowButtonType={ OverflowButtonType.descriptive }
-        />);
-      let overflowButton = wrapper.find('.ms-Facepile-descriptiveOverflowButton');
-      expect(overflowButton).toHaveLength(1);
-      let buttons = wrapper.find('.ms-Facepile-itemButton');
-      expect(buttons).toHaveLength(6);
-    });
+  it('renders more overflow button if overflowButtonProps are not null as OverflowButtonType equals more', () => {
+    const wrapper = mount(
+      <Facepile
+        personas={ [] }
+        overflowButtonProps={ {} }
+        overflowButtonType={ OverflowButtonType.more }
+      />
+    );
 
-    it('renders no more than maximum allowed personas', () => {
-      const wrapper = shallow(
-        <Facepile
-          personas={ facepilePersonas.concat(facepilePersonas, facepilePersonas, facepilePersonas) }
-          maxDisplayablePersonas={ 2 }
-        />);
-      let buttons = wrapper.find('.ms-Facepile-itemButton');
-      expect(buttons).toHaveLength(2);
-    });
+    expectOne(wrapper, '.ms-Facepile-overflowButton');
+    expectOne(wrapper, '.ms-Facepile-itemButton');
+  });
 
-    it('persona is clickable if onClick property is set', () => {
-      let clicked = 0;
-      let personas: IFacepilePersona[] = [{
-        personaName: 'Alex Lundberg',
-        onClick: (ev: React.MouseEvent<HTMLElement>, persona: IFacepilePersona) => {
-          clicked++;
-          ev.preventDefault();
-        }
-      }];
-      const wrapper = mount(
-        <Facepile
-          personas={ personas }
-        />);
-      let buttons = wrapper.find('.ms-Facepile-itemButton');
-      expect(buttons).toHaveLength(1);
-      buttons.simulate('click');
-      expect(clicked).toEqual(1);
-    });
+  it('renders without descriptive overflow button if overflowButtonProps are not null and maximum personas are not exceeded', () => {
+    const wrapper = mount(
+      <Facepile
+        personas={ [] }
+        overflowButtonProps={ {} }
+        overflowButtonType={ OverflowButtonType.descriptive }
+      />
+    );
 
-    it('personas and buttons render default size if not specified', () => {
-      const wrapper = ReactTestUtils.renderIntoDocument(
-        <Facepile
-          personas={ facepilePersonas }
-          addButtonProps={ {} }
-          showAddButton={ true }
-          overflowButtonProps={ {} }
-          overflowButtonType={ OverflowButtonType.downArrow }
-        />);
-      let facepile = ReactDOM.findDOMNode(wrapper as React.ReactInstance);
-      let addButton = facepile.querySelectorAll('.ms-Facepile-addButton .ms-Persona-coin.ms-Persona--size32');
-      expect(addButton).toHaveLength(1);
-      let faces = facepile.querySelectorAll('.ms-Facepile-person');
-      expect(faces).toHaveLength(facepilePersonas.length);
-      for (let i = 0; i < faces.length; ++i) {
-        expect(faces[i].innerHTML).toEqual(expect.stringMatching('ms-Persona--size32'));
+    expectMissing(wrapper, '.ms-Facepile-descriptiveOverflowButton');
+    expectMissing(wrapper, '.ms-Facepile-itemButton');
+  });
+
+  it('renders with descriptive overflow button if overflowButtonProps are not null and maximum personas are exceeded', () => {
+    const personas: IFacepilePersona[] = facepilePersonas.concat(...facepilePersonas, ...facepilePersonas);
+    const wrapper = mount(
+      <Facepile
+        personas={ personas }
+        maxDisplayablePersonas={ 5 }
+        overflowButtonProps={ {} }
+        overflowButtonType={ OverflowButtonType.descriptive }
+      />
+    );
+    expectOne(wrapper, '.ms-Facepile-descriptiveOverflowButton');
+    expect(findNodes(wrapper, '.ms-Facepile-itemButton').length).toEqual(6);
+  });
+
+  it('renders no more than maximum allowed personas', () => {
+    const wrapper = mount(
+      <Facepile
+        personas={ facepilePersonas.concat(facepilePersonas, facepilePersonas, facepilePersonas) }
+        maxDisplayablePersonas={ 2 }
+      />
+    );
+    expect(findNodes(wrapper, '.ms-Facepile-itemButton').length).toEqual(2);
+  });
+
+  it('persona is clickable if onClick property is set', () => {
+    let clicked = 0;
+    const personas: IFacepilePersona[] = [{
+      personaName: 'Alex Lundberg',
+      onClick: (ev: React.MouseEvent<HTMLElement>, persona: IFacepilePersona) => {
+        clicked++;
+        ev.preventDefault();
       }
-      let overflowButton = facepile.querySelectorAll('.ms-Facepile-overflowButton .ms-Persona--size32');
-      expect(overflowButton).toHaveLength(1);
+    }];
+
+    const wrapper = mount(
+      <Facepile
+        personas={ personas }
+      />
+    );
+
+    const buttons = findNodes(wrapper, '.ms-Facepile-itemButton');
+
+    expect(buttons.length).toEqual(1);
+    buttons.simulate('click');
+    expect(clicked).toEqual(1);
+  });
+
+  it('personas and buttons render default size if not specified', () => {
+    const wrapper = mount(
+      <Facepile
+        personas={ facepilePersonas }
+        addButtonProps={ {} }
+        showAddButton={ true }
+        overflowButtonProps={ {} }
+        overflowButtonType={ OverflowButtonType.downArrow }
+      />
+    );
+
+    expectOne(wrapper, '.ms-Facepile-addButton .ms-Persona-coin.ms-Persona--size32');
+    expectOne(wrapper, '.ms-Facepile-overflowButton .ms-Persona--size32');
+
+    const faces = findNodes(wrapper, '.ms-Facepile-person .ms-Persona-coin');
+
+    expect(faces.length).toEqual(facepilePersonas.length);
+
+    for (let i = 0; i < faces.length; ++i) {
+      expect(faces.at(i).hasClass('ms-Persona--size32')).toBeTruthy();
+    }
+  });
+
+  it('personas and buttons render specified size', () => {
+    // Test XXS size renders
+    let wrapper = shallow(
+      <Facepile
+        personas={ facepilePersonas }
+        personaSize={ PersonaSize.size24 }
+      />);
+
+    expect(wrapper.find(PersonaCoin).length).toEqual(facepilePersonas.length);
+    wrapper.find(PersonaCoin).forEach((node) => {
+      expect(node.dive().hasClass('ms-Persona--size24')).toBeTruthy();
     });
 
-    it('personas and buttons render specified size', () => {
-      // Test XXS size renders
-      let wrapper = shallow(
-        <Facepile
-          personas={ facepilePersonas }
-          personaSize={ PersonaSize.size24 }
-        />);
-      let faces = wrapper.find(PersonaCoin);
-      expect(faces).toHaveLength(facepilePersonas.length);
-      wrapper.find(PersonaCoin).forEach((node) => {
-        expect(node.html()).toEqual(expect.stringMatching('ms-Persona--size24'));
-      });
-
-      // Test small size renders
-      wrapper = shallow(
-        <Facepile
-          personas={ facepilePersonas }
-          personaSize={ PersonaSize.size40 }
-        />);
-      faces = wrapper.find(PersonaCoin);
-      expect(faces).toHaveLength(facepilePersonas.length);
-      wrapper.find(PersonaCoin).forEach((node) => {
-        expect(node.html()).toEqual(expect.stringMatching('ms-Persona--size40'));
-      });
+    // Test small size renders
+    wrapper = shallow(
+      <Facepile
+        personas={ facepilePersonas }
+        personaSize={ PersonaSize.size40 }
+      />);
+
+    expect(wrapper.find(PersonaCoin).length).toEqual(facepilePersonas.length);
+    wrapper.find(PersonaCoin).forEach((node) => {
+      expect(node.dive().hasClass('ms-Persona--size40')).toBeTruthy();
     });
   });
+
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
index dbfd26c7a836e..8169b99dca04c 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Facepile Render personas and buttons renders Facepile correctly 1`] = `
+exports[`Facepile renders Facepile correctly 1`] = `
 <div
   className="ms-Facepile"
 >
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.AddFace.Example.tsx b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.AddFace.Example.tsx
index 887ad96357803..9f30f3daa948b 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.AddFace.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.AddFace.Example.tsx
@@ -10,9 +10,10 @@ export interface IFacepileAddFaceExampleState {
   numberOfFaces: number;
 }
 
-export class FacepileAddFaceExample extends React.Component<any, IFacepileAddFaceExampleState> {
-  public constructor() {
-    super();
+export class FacepileAddFaceExample extends React.Component<{}, IFacepileAddFaceExampleState> {
+
+  constructor(props: {}) {
+    super(props);
 
     this.state = {
       numberOfFaces: 0
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
index 0edc2e188ea03..af3a6ab896090 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
@@ -16,9 +16,10 @@ export interface IFacepileBasicExampleState {
   personaSize: PersonaSize;
 }
 
-export class FacepileBasicExample extends React.Component<any, IFacepileBasicExampleState> {
-  public constructor() {
-    super();
+export class FacepileBasicExample extends React.Component<{}, IFacepileBasicExampleState> {
+
+  constructor(props: {}) {
+    super(props);
 
     this.state = {
       numberOfFaces: 3,
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx
index 4237347b7913a..2ae467beec801 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx
@@ -27,9 +27,10 @@ export interface IFacepileOverflowExampleState {
   overflowButtonType: OverflowButtonType;
 }
 
-export class FacepileOverflowExample extends React.Component<any, IFacepileOverflowExampleState> {
-  public constructor() {
-    super();
+export class FacepileOverflowExample extends React.Component<{}, IFacepileOverflowExampleState> {
+
+  constructor(props: {}) {
+    super(props);
 
     this.state = {
       displayedPersonas: 5,
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx
index 08150bee5ab2d..ec592c6ed1072 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx
@@ -73,10 +73,10 @@ export interface IFocusTrapZoneNestedExampleState {
 
 const NAMES: string[] = ['One', 'Two', 'Three', 'Four', 'Five'];
 
-export default class FocusTrapZoneNestedExample extends React.Component<React.HTMLAttributes<HTMLDivElement>, IFocusTrapZoneNestedExampleState> {
+export default class FocusTrapZoneNestedExample extends React.Component<{}, IFocusTrapZoneNestedExampleState> {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this.state = {
       stateMap: {}
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.List.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.List.Example.tsx
index ee694a45bbbb0..c26277b33bc58 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.List.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.List.Example.tsx
@@ -39,11 +39,11 @@ const COLUMNS: IColumn[] = [
   }
 ];
 
-export class FocusZoneListExample extends React.Component<any, any> {
+export class FocusZoneListExample extends React.Component {
   private _selection: Selection;
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this._selection = new Selection();
     this._selection.setItems(ITEMS);
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Basic.Example.tsx
index 60c767c1df897..0eeb1a7205873 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Basic.Example.tsx
@@ -25,11 +25,11 @@ const groupDepth = 3;
 let _items: any[];
 let _groups: IGroup[];
 
-export class GroupedListBasicExample extends React.Component<any, any> {
+export class GroupedListBasicExample extends React.Component {
   private _selection: Selection;
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     _items = _items || createListItems(Math.pow(groupCount, groupDepth + 1));
     _groups = _groups || createGroups(groupCount, groupDepth, 0, groupCount);
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx
index 8d642cd1a4536..2b24ac48f8968 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx
@@ -13,10 +13,10 @@ import './GroupedList.Custom.Example.scss';
 let _items: any[];
 let _groups: IGroup[];
 
-export class GroupedListCustomExample extends React.Component<any, any> {
+export class GroupedListCustomExample extends React.Component {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     _items = _items || createListItems(20);
     _groups = createGroups(4, 0, 0, 5);
diff --git a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
index 107bd313aa08f..369e6829b2bc4 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
@@ -10,7 +10,9 @@ import { AnimationClassNames } from '../../../Styling';
 import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
 const exampleStyles: any = exampleStylesImport;
 
-export class LayerContentExample extends BaseComponent<any, any> {
+export class LayerContentExample extends BaseComponent<{}, {
+  time: string
+}> {
   public static contextTypes = {
     message: PropTypes.string
   };
@@ -19,8 +21,8 @@ export class LayerContentExample extends BaseComponent<any, any> {
     message: string;
   };
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     this.state = {
       time: new Date().toLocaleTimeString()
     };
@@ -40,14 +42,16 @@ export class LayerContentExample extends BaseComponent<any, any> {
     );
   }
 }
-export class LayerBasicExample extends BaseComponent<any, any> {
+export class LayerBasicExample extends BaseComponent<{}, {
+  showLayer: boolean;
+}> {
 
   public static childContextTypes = {
     message: PropTypes.string
   };
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     this.state = {
       showLayer: false
     };
diff --git a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
index 0cd120823d2dc..0dc249b832cfe 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
@@ -8,9 +8,13 @@ import './Layer.Example.scss';
 import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
 const exampleStyles: any = exampleStylesImport;
 
-export class LayerHostedExample extends React.Component<any, any> {
-  constructor() {
-    super();
+export class LayerHostedExample extends React.Component<{}, {
+  showLayer: boolean;
+  showHost: boolean;
+}> {
+
+  constructor(props: {}) {
+    super(props);
     this.state = {
       showLayer: false,
       showHost: true
diff --git a/packages/office-ui-fabric-react/src/components/List/ListPage.tsx b/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
index a34bebbfdb821..6f8a186ce1951 100644
--- a/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
@@ -21,8 +21,8 @@ const ListGhostingExampleCode = require('!raw-loader!office-ui-fabric-react/src/
 let _cachedItems: any;
 
 export class ListPage extends React.Component<IComponentDemoPageProps, {}> {
-  constructor() {
-    super();
+  constructor(props: IComponentDemoPageProps) {
+    super(props);
 
     _cachedItems = _cachedItems || createListItems(5000);
   }
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx b/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx
index 999b857d54a38..46a1b2e75cc17 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx
@@ -12,14 +12,14 @@ export interface IListGridExampleProps {
 const ROWS_PER_PAGE = 3;
 const MAX_ROW_HEIGHT = 250;
 
-export class ListGridExample extends React.Component<IListGridExampleProps, any> {
+export class ListGridExample extends React.Component<IListGridExampleProps> {
   private _positions: any;
   private _columnCount: number;
   private _columnWidth: number;
   private _rowHeight: number;
 
-  constructor() {
-    super();
+  constructor(props: IListGridExampleProps) {
+    super(props);
 
     this._positions = {};
     this._getItemCountForPage = this._getItemCountForPage.bind(this);
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
index 4524217a18b6a..562246634a092 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
@@ -38,8 +38,8 @@ export class MarqueeSelectionBasicExample extends React.Component<{}, IMarqueeSe
   private _selection: Selection;
   private _isMounted: boolean;
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this.state = {
       isMarqueeEnabled: true
diff --git a/packages/office-ui-fabric-react/src/components/Modal/examples/Modal.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Modal/examples/Modal.Basic.Example.tsx
index d6c35096a3c8c..518747a0028d7 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/examples/Modal.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Modal/examples/Modal.Basic.Example.tsx
@@ -4,10 +4,12 @@ import { Modal } from 'office-ui-fabric-react/lib/Modal';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import './Modal.Basic.Example.scss';
 
-export class ModalBasicExample extends React.Component<any, any> {
+export class ModalBasicExample extends React.Component<{}, {
+  showModal: boolean;
+}> {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     this.state = {
       showModal: false
     };
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Dark.Example.tsx b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Dark.Example.tsx
index 63475f9cbf173..7c0f82f43bbe2 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Dark.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Dark.Example.tsx
@@ -5,9 +5,11 @@ import { Overlay } from 'office-ui-fabric-react/lib/Overlay';
 
 import './Overlay.Example.scss';
 
-export class OverlayDarkExample extends React.Component<any, any> {
-  constructor() {
-    super();
+export class OverlayDarkExample extends React.Component<{}, {
+  isOverlayVisible: boolean;
+}> {
+  constructor(props: {}) {
+    super(props);
 
     this.state = { isOverlayVisible: false };
   }
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Light.Example.tsx b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Light.Example.tsx
index 442fd64cfa586..bbfd3f6889c87 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Light.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Light.Example.tsx
@@ -4,9 +4,11 @@ import { Overlay } from 'office-ui-fabric-react/lib/Overlay';
 
 import './Overlay.Example.scss';
 
-export class OverlayLightExample extends React.Component<any, any> {
-  constructor() {
-    super();
+export class OverlayLightExample extends React.Component<{}, {
+  isOverlayVisible: boolean;
+}> {
+  constructor(props: {}) {
+    super(props);
 
     this._onClick = this._onClick.bind(this);
 
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Custom.Example.tsx
index b8dd74375c76d..11134b820cde5 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Custom.Example.tsx
@@ -3,10 +3,12 @@ import { autobind } from '../../../Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
-export class PanelCustomExample extends React.Component<any, any> {
+export class PanelCustomExample extends React.Component<{}, {
+  showPanel: boolean;
+}> {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     this.state = {
       showPanel: false
     };
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.ExtraLarge.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.ExtraLarge.Example.tsx
index 40ac125ecc0c8..2ee4be0df9c0e 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.ExtraLarge.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.ExtraLarge.Example.tsx
@@ -3,10 +3,12 @@ import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
-export class PanelExtraLargeExample extends React.Component<any, any> {
+export class PanelExtraLargeExample extends React.Component<{}, {
+  showPanel: boolean;
+}> {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     this.state = { showPanel: false };
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Footer.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Footer.Example.tsx
index b115b32214ae9..bd23e00a20d59 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Footer.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Footer.Example.tsx
@@ -3,10 +3,12 @@ import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
-export class PanelFooterExample extends React.Component<any, any> {
+export class PanelFooterExample extends React.Component<{}, {
+  showPanel: boolean;
+}> {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     this.state = { showPanel: false };
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.HiddenOnDismiss.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.HiddenOnDismiss.Example.tsx
index d8d005d55041b..6302196dd1889 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.HiddenOnDismiss.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.HiddenOnDismiss.Example.tsx
@@ -3,10 +3,12 @@ import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel } from 'office-ui-fabric-react/lib/Panel';
 
-export class PanelHiddenOnDismissExample extends React.Component<any, any> {
+export class PanelHiddenOnDismissExample extends React.Component<{}, {
+  showPanel: boolean;
+}> {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this.state = { showPanel: false };
   }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Large.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Large.Example.tsx
index 64dc0ba201ffc..ca15fbdc56500 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Large.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Large.Example.tsx
@@ -3,10 +3,12 @@ import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
-export class PanelLargeExample extends React.Component<any, any> {
+export class PanelLargeExample extends React.Component<{}, {
+  showPanel: boolean;
+}> {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     this.state = { showPanel: false };
   }
 
@@ -22,7 +24,7 @@ export class PanelLargeExample extends React.Component<any, any> {
         <Panel
           isOpen={ this.state.showPanel }
           // tslint:disable-next-line:jsx-no-lambda
-          onDismiss={ () => this.setState({ showPanel: false })  }
+          onDismiss={ () => this.setState({ showPanel: false }) }
           type={ PanelType.large }
           headerText='Large Panel'
         >
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LargeFixed.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LargeFixed.Example.tsx
index 63a7e5912165d..a4029f3ace070 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LargeFixed.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LargeFixed.Example.tsx
@@ -3,10 +3,12 @@ import { autobind } from '../../../Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
-export class PanelLargeFixedExample extends React.Component<any, any> {
+export class PanelLargeFixedExample extends React.Component<{}, {
+  showPanel: boolean;
+}> {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     this.state = {
       showPanel: false
     };
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismiss.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismiss.Example.tsx
index 514b5f9e31342..cb7279fa95dee 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismiss.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismiss.Example.tsx
@@ -3,10 +3,12 @@ import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel } from 'office-ui-fabric-react/lib/Panel';
 
-export class PanelLightDismissExample extends React.Component<any, any> {
+export class PanelLightDismissExample extends React.Component<{}, {
+  showPanel: boolean;
+}> {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this.state = { showPanel: false };
   }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismissCustom.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismissCustom.Example.tsx
index c3eea1a3e69e9..c0782acbc4ce1 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismissCustom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismissCustom.Example.tsx
@@ -4,10 +4,13 @@ import { Dialog, DialogType, DialogFooter } from 'office-ui-fabric-react/lib/Dia
 import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel } from 'office-ui-fabric-react/lib/Panel';
 
-export class PanelLightDismissCustomExample extends React.Component<any, any> {
+export class PanelLightDismissCustomExample extends React.Component<{}, {
+  showPanel: boolean;
+  hideDialog: boolean;
+}> {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this.state = { showPanel: false, hideDialog: true };
   }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Medium.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Medium.Example.tsx
index 2624459e6a454..0e3eb9b6e64e9 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Medium.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Medium.Example.tsx
@@ -3,10 +3,12 @@ import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
-export class PanelMediumExample extends React.Component<any, any> {
+export class PanelMediumExample extends React.Component<{}, {
+  showPanel: boolean;
+}> {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     this.state = { showPanel: false };
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.NonModal.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.NonModal.Example.tsx
index 5e908e51594bd..b9ed464d5b1c6 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.NonModal.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.NonModal.Example.tsx
@@ -3,10 +3,12 @@ import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
-export class PanelNonModalExample extends React.Component<any, any> {
+export class PanelNonModalExample extends React.Component<{}, {
+  showPanel: boolean;
+}> {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     this.state = { showPanel: false };
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallFluid.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallFluid.Example.tsx
index 0cf78f51c08e8..34559332f4394 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallFluid.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallFluid.Example.tsx
@@ -2,10 +2,12 @@ import * as React from 'react';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
-export class PanelSmallFluidExample extends React.Component<any, any> {
+export class PanelSmallFluidExample extends React.Component<{}, {
+  showPanel: boolean;
+}> {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     this.state = { showPanel: false };
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallLeft.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallLeft.Example.tsx
index e01539d90533d..078c52927564b 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallLeft.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallLeft.Example.tsx
@@ -2,10 +2,12 @@ import * as React from 'react';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
-export class PanelSmallLeftExample extends React.Component<any, any> {
+export class PanelSmallLeftExample extends React.Component<{}, {
+  showPanel: boolean;
+}> {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     this.state = { showPanel: false };
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallRight.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallRight.Example.tsx
index 829679007b93f..0f0edec132091 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallRight.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallRight.Example.tsx
@@ -4,10 +4,12 @@ import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button'
 import { ChoiceGroup } from 'office-ui-fabric-react/lib/ChoiceGroup';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
-export class PanelSmallRightExample extends React.Component<any, any> {
+export class PanelSmallRightExample extends React.Component<{}, {
+  showPanel: boolean;
+}> {
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     this.state = {
       showPanel: false
     };
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Alternate.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Alternate.Example.tsx
index c79a5890f12d0..19c278e5734ce 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Alternate.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Alternate.Example.tsx
@@ -17,9 +17,11 @@ const examplePersona = {
   showSecondaryText: true
 };
 
-export class PersonaAlternateExample extends React.Component<React.Props<PersonaAlternateExample>, { renderPersonaDetails?: boolean; }> {
-  constructor() {
-    super();
+export class PersonaAlternateExample extends React.Component<{}, {
+  renderPersonaDetails: boolean;
+}> {
+  constructor(props: {}) {
+    super(props);
     this.state = {
       renderPersonaDetails: true
     };
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
index 890a4313a1b82..32aa9479c263d 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
@@ -21,9 +21,11 @@ const examplePersona = {
   optionalText: 'Available at 4:00pm'
 };
 
-export class PersonaBasicExample extends React.Component<React.Props<PersonaBasicExample>, { renderPersonaDetails?: boolean; }> {
-  constructor() {
-    super();
+export class PersonaBasicExample extends React.Component<{}, {
+  renderPersonaDetails?: boolean;
+}> {
+  constructor(props: {}) {
+    super(props);
     this.state = {
       renderPersonaDetails: true
     };
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx
index 1580ca8fd393c..b99926597cf89 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx
@@ -21,10 +21,7 @@ const examplePersona = {
   optionalText: 'Available at 4:00pm'
 };
 
-export class PersonaCustomRenderExample extends React.Component<React.Props<PersonaCustomRenderExample>, any> {
-  constructor() {
-    super();
-  }
+export class PersonaCustomRenderExample extends React.Component {
 
   public render() {
     return (
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Basic.Example.tsx
index 2a06d6bd0ee61..a8a5c9fc121b1 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Basic.Example.tsx
@@ -12,13 +12,13 @@ const INTERVAL_DELAY: number = 100;
 const INTERVAL_INCREMENT: number = .01;
 const RESTART_WAIT_TIME: number = 2000;
 
-export class ProgressIndicatorBasicExample extends React.Component<any, IProgressIndicatorBasicExampleState> {
+export class ProgressIndicatorBasicExample extends React.Component<{}, IProgressIndicatorBasicExampleState> {
 
   private _interval: number;
   private _async: Async;
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this._async = new Async(this);
 
diff --git a/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx
index 471112c390177..7cb279e06f51c 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx
@@ -7,14 +7,19 @@ import {
 
 import './Rating.Basic.Example.scss';
 
-export class RatingBasicExample extends React.Component<any, any> {
-  constructor() {
-    super();
+export class RatingBasicExample extends React.Component<{}, {
+  rating?: number;
+  largeStarRating?: number;
+  smallStarRating?: number;
+  tenStarRating?: number;
+}> {
+  constructor(props: {}) {
+    super(props);
 
     this.state = {
-      largeStarRating: null,
-      smallStarRating: null,
-      tenStarRating: null
+      largeStarRating: undefined,
+      smallStarRating: undefined,
+      tenStarRating: undefined
     };
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx
index 29174059cae19..6611219f4f865 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx
@@ -4,10 +4,7 @@ import { Sticky, StickyPositionType } from 'office-ui-fabric-react/lib/Sticky';
 import { lorem } from '@uifabric/example-app-base';
 import './ScrollablePane.Example.scss';
 
-export class ScrollablePaneDefaultExample extends React.Component<any, any> {
-  constructor() {
-    super();
-  }
+export class ScrollablePaneDefaultExample extends React.Component {
 
   public render() {
     let contentAreas: JSX.Element[] = [];
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.DetailsList.Example.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.DetailsList.Example.tsx
index bb0d1b68df9f5..cf360d711d8ae 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.DetailsList.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.DetailsList.Example.tsx
@@ -51,11 +51,14 @@ let _columns: IColumn[] = [
   },
 ];
 
-export class ScrollablePaneDetailsListExample extends React.Component<any, any> {
+export class ScrollablePaneDetailsListExample extends React.Component<{}, {
+  items: {}[];
+  selectionDetails: string;
+}> {
   private _selection: Selection;
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     // Populate with items for demos.
     if (_items.length === 0) {
diff --git a/packages/office-ui-fabric-react/src/components/Slider/examples/Slider.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Slider/examples/Slider.Basic.Example.tsx
index b85b7b8989170..06768a87f98a7 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/examples/Slider.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/examples/Slider.Basic.Example.tsx
@@ -2,9 +2,11 @@ import * as React from 'react';
 import { Slider } from 'office-ui-fabric-react/lib/Slider';
 import './Slider.Basic.Example.scss';
 
-export class SliderBasicExample extends React.Component<any, any> {
-  constructor() {
-    super();
+export class SliderBasicExample extends React.Component<{}, {
+  value: number
+}> {
+  constructor(props: {}) {
+    super(props);
 
     this.state = {
       value: 0
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
index d74c1fbf7448c..6e74d6d8406ff 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
@@ -8,6 +8,7 @@ import { mount } from 'enzyme';
 import { SwatchColorPickerBase } from './SwatchColorPicker.base';
 import { getStyles } from './SwatchColorPicker.styles';
 import { IColorCellProps } from './ColorPickerGridCell.types';
+import { expectNodes, findNodes } from '../../common/testUtilities';
 
 const DEFAULT_OPTIONS: IColorCellProps[] = [
   { id: 'a', label: 'green', color: '#00ff00' },
@@ -44,7 +45,8 @@ describe('SwatchColorPicker', () => {
         columnCount={ 4 }
         getStyles={ getStyles }
       />);
-    expect(wrapper.find('.ms-swatchColorPickerBodyContainer').length).toEqual(1);
+
+    expectNodes(wrapper, '.ms-swatchColorPickerBodyContainer', 1);
   });
 
   it('Can render the correct options when not in a menu', () => {
@@ -53,25 +55,21 @@ describe('SwatchColorPicker', () => {
         colorCells={ DEFAULT_OPTIONS }
         columnCount={ 4 }
         getStyles={ getStyles }
-      />);
-    let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
-    let container = reactContainer.getDOMNode();
-    expect(container).not.toEqual(null);
+      />
+    );
 
-    let tableElements = container.querySelectorAll('table[role="grid"]');
-    let tableRowElements = container.querySelectorAll('tr[role="row"]');
-    let tableCellElements = container.querySelectorAll('button[role="gridcell"]');
-    let setSizeElements = container.querySelectorAll('[aria-setsize]');
-    let posInSetElements = container.querySelectorAll('[aria-posinset]');
+    expectNodes(wrapper, '.ms-swatchColorPickerBodyContainer', 1);
+    expectNodes(wrapper, 'table[role="grid"]', 1);
+
+    const tableRowElements = findNodes(wrapper, 'tr[role="row"]');
 
-    expect(tableElements.length).toEqual(1);
     expect(tableRowElements.length).toEqual(3);
-    expect(tableRowElements[0].getElementsByTagName('td').length).toEqual(4);
-    expect(tableRowElements[1].getElementsByTagName('td').length).toEqual(4);
-    expect(tableRowElements[2].getElementsByTagName('td').length).toEqual(4);
-    expect(tableCellElements.length).toEqual(12);
-    expect(setSizeElements.length).toEqual(0);
-    expect(posInSetElements.length).toEqual(0);
+    expect(tableRowElements.at(0).find('td').length).toEqual(4);
+    expect(tableRowElements.at(1).find('td').length).toEqual(4);
+    expect(tableRowElements.at(2).find('td').length).toEqual(4);
+    expectNodes(wrapper, 'button[role="gridcell"]', 12);
+    expectNodes(wrapper, '[aria-setsize]', 0);
+    expectNodes(wrapper, '[aria-posinset]', 0);
   });
 
   it('Can execute a cell in non-collapsable swatch color picker ', () => {
@@ -83,15 +81,13 @@ describe('SwatchColorPicker', () => {
         onColorChanged={ (color) => eventFireCounter++ }
         columnCount={ 4 }
         getStyles={ getStyles }
-      />);
-    let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
-    let container = reactContainer.getDOMNode();
-    expect(container).not.toEqual(null);
+      />
+    );
 
-    let item = container.querySelector('[role="gridcell"]') as Element;
-    expect(item).not.toEqual(null);
+    expectNodes(wrapper, '.ms-swatchColorPickerBodyContainer', 1);
+    expectNodes(wrapper, '.ms-swatchColorPickerBodyContainer [role="gridcell"]', 1);
 
-    ReactTestUtils.Simulate.click(item);
+    wrapper.find('.ms-swatchColorPickerBodyContainer [role="gridcell"]').at(1).simulate('click');
     expect(eventFireCounter).toEqual(1);
   });
 
@@ -104,15 +100,10 @@ describe('SwatchColorPicker', () => {
         onCellHovered={ (color) => eventFireCounter++ }
         columnCount={ 4 }
         getStyles={ getStyles }
-      />);
-    let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
-    let container = reactContainer.getDOMNode();
-    expect(container).not.toEqual(null);
-
-    let cell = container.querySelector('[role="gridcell"]') as Element;
-    expect(cell).not.toEqual(null);
+      />
+    );
 
-    ReactTestUtils.Simulate.mouseEnter(cell);
+    wrapper.find('.ms-swatchColorPickerBodyContainer [role="gridcell"]').at(0).simulate('mouseenter');
     expect(eventFireCounter).toEqual(1);
   });
 
@@ -125,15 +116,10 @@ describe('SwatchColorPicker', () => {
         onCellFocused={ (color) => eventFireCounter++ }
         columnCount={ 4 }
         getStyles={ getStyles }
-      />);
-    let reactContainer = wrapper.find('.ms-swatchColorPickerBodyContainer');
-    let container = reactContainer.getDOMNode();
-    expect(container).not.toEqual(null);
-
-    let cell = container.querySelector('[role="gridcell"]') as Element;
-    expect(cell).not.toEqual(null);
+      />
+    );
 
-    ReactTestUtils.Simulate.focus(cell);
+    wrapper.find('.ms-swatchColorPickerBodyContainer [role="gridcell"]').at(0).simulate('focus');
     expect(eventFireCounter).toEqual(1);
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx
index c608bebb997b6..c2ef38380e8a2 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx
@@ -9,11 +9,11 @@ export interface ITeachingBubbleBasicExampleState {
   isTeachingBubbleVisible?: boolean;
 }
 
-export class TeachingBubbleBasicExample extends React.Component<any, ITeachingBubbleBasicExampleState> {
+export class TeachingBubbleBasicExample extends React.Component<{}, ITeachingBubbleBasicExampleState> {
   private _menuButtonElement: HTMLElement;
 
-  public constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this._onDismiss = this._onDismiss.bind(this);
 
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Condensed.Example.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Condensed.Example.tsx
index 78de6a44743b0..90034fe746df6 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Condensed.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Condensed.Example.tsx
@@ -8,11 +8,11 @@ export interface ITeachingBubbleCondensedExampleState {
   isTeachingBubbleVisible?: boolean;
 }
 
-export class TeachingBubbleCondensedExample extends React.Component<any, ITeachingBubbleCondensedExampleState> {
+export class TeachingBubbleCondensedExample extends React.Component<{}, ITeachingBubbleCondensedExampleState> {
   private _menuButtonElement: HTMLElement;
 
-  public constructor() {
-    super();
+  public constructor(props: {}) {
+    super(props);
 
     this._onDismiss = this._onDismiss.bind(this);
 
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Illustration.Example.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Illustration.Example.tsx
index 2579de506edfa..a59f5d022b077 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Illustration.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Illustration.Example.tsx
@@ -10,11 +10,11 @@ export interface ITeachingBubbleIllustrationExampleState {
   isTeachingBubbleVisible?: boolean;
 }
 
-export class TeachingBubbleIllustrationExample extends React.Component<any, ITeachingBubbleIllustrationExampleState> {
+export class TeachingBubbleIllustrationExample extends React.Component<{}, ITeachingBubbleIllustrationExampleState> {
   private _menuButtonElement: HTMLElement;
 
-  public constructor() {
-    super();
+  public constructor(props: {}) {
+    super(props);
 
     this._onDismiss = this._onDismiss.bind(this);
 
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.SmallHeadline.Example.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.SmallHeadline.Example.tsx
index 4d64ce4048d50..fbd6617a7c02a 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.SmallHeadline.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.SmallHeadline.Example.tsx
@@ -8,11 +8,11 @@ export interface ITeachingBubbleSmallHeadlineExampleState {
   isTeachingBubbleVisible?: boolean;
 }
 
-export class TeachingBubbleSmallHeadlineExample extends React.Component<any, ITeachingBubbleSmallHeadlineExampleState> {
+export class TeachingBubbleSmallHeadlineExample extends React.Component<{}, ITeachingBubbleSmallHeadlineExampleState> {
   private _menuButtonElement: HTMLElement;
 
-  public constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this._onDismiss = this._onDismiss.bind(this);
 
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.WideIllustration.Example.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.WideIllustration.Example.tsx
index 029eff69d4ba8..6713a5439bfb5 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.WideIllustration.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.WideIllustration.Example.tsx
@@ -11,11 +11,11 @@ export interface ITeachingBubbleWideIllustrationExampleState {
   isTeachingBubbleVisible?: boolean;
 }
 
-export class TeachingBubbleWideIllustrationExample extends React.Component<any, ITeachingBubbleWideIllustrationExampleState> {
+export class TeachingBubbleWideIllustrationExample extends React.Component<{}, ITeachingBubbleWideIllustrationExampleState> {
   private _menuButtonElement: HTMLElement;
 
-  public constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this._onDismiss = this._onDismiss.bind(this);
 
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx
index 20fc5097e6ac7..4ff3434b21c6c 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx
@@ -5,12 +5,14 @@ import { IconButton } from 'office-ui-fabric-react/lib/Button';
 import { Callout } from 'office-ui-fabric-react/lib/Callout';
 import './TextField.Examples.scss';
 
-export class TextFieldCustomRenderExample extends React.Component<any, any> {
+export class TextFieldCustomRenderExample extends React.Component<{}, {
+  isCalloutVisible: boolean;
+}> {
 
   private _iconButtonElement: HTMLElement;
 
-  public constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this.state = {
       isCalloutVisible: false
diff --git a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
index eb45cdda63745..05e8b1e9654b9 100644
--- a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
@@ -1,23 +1,35 @@
 import * as React from 'react';
 import { loadTheme, FontClassNames, IPalette } from 'office-ui-fabric-react/lib/Styling';
-import { Highlight } from '@uifabric/example-app-base';
+import { IComponentDemoPageProps, Highlight } from '@uifabric/example-app-base';
 import { defaultTheme } from './defaultTheme';
 import { Callout } from 'office-ui-fabric-react/lib/Callout';
 import { DetailsList, DetailsListLayoutMode as LayoutMode } from 'office-ui-fabric-react/lib/DetailsList';
 import { SelectionMode } from 'office-ui-fabric-react/lib/Selection';
-import { ColorPicker } from 'office-ui-fabric-react/lib/ColorPicker';
+import { ColorPicker, IColorPickerProps } from 'office-ui-fabric-react/lib/ColorPicker';
 import './ThemePage.scss';
 const ThemeCodeExample = require('!raw-loader!office-ui-fabric-react/src/components/Theme/examples/ThemeCode.Example.tsx');
 
-export class ThemePage extends React.Component<any, any> {
+export class ThemePage extends React.Component<IComponentDemoPageProps, {
+  colors: {
+    key: string;
+    name: string;
+    value: string;
+    description: string;
+  }[];
+  colorPickerProps?: {
+    targetElement: HTMLElement;
+    value: any;
+    index: number;
+  };
+}> {
 
   public refs: {
     [key: string]: React.ReactInstance;
     list: DetailsList;
   };
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this._onPickerDismiss = this._onPickerDismiss.bind(this);
 
@@ -27,7 +39,7 @@ export class ThemePage extends React.Component<any, any> {
         name: variableName,
         value: (defaultTheme as any)[variableName],
         description: '',
-        colorPickerProps: null
+        colorPickerProps: undefined
       }))
     };
   }
@@ -106,7 +118,7 @@ export class ThemePage extends React.Component<any, any> {
   private _onSwatchClicked(item: any, index: number, ev: React.MouseEvent<HTMLElement>) {
     this.setState({
       colorPickerProps: {
-        targetElement: (ev.currentTarget as HTMLElement).children[0],
+        targetElement: (ev.currentTarget as HTMLElement).children[0] as HTMLElement,
         value: item.value,
         index: index
       }
@@ -134,7 +146,7 @@ export class ThemePage extends React.Component<any, any> {
 
   private _onPickerDismiss() {
     this.setState({
-      colorPickerProps: null
+      colorPickerProps: undefined
     });
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
index d53881665f863..bef7d188b5588 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
@@ -42,12 +42,12 @@ export interface IThemeGeneratorPageState {
 const BackgroundImageUriKey = 'backgroundImageUri';
 const BackgroundOverlayKey = 'backgroundOverlay';
 
-export class ThemeGeneratorPage extends BaseComponent<any, IThemeGeneratorPageState> {
+export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageState> {
   private _semanticSlotColorChangeTimeout: number;
   private _imgUrl: string;
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     let themeRules = themeRulesStandardCreator();
     ThemeGenerator.insureSlots(themeRules, isDark(themeRules[BaseSlots[BaseSlots.backgroundColor]].color!));
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
index a99bed449e66b..6ffbae2bcb77d 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
@@ -124,8 +124,6 @@ describe('Toggle', () => {
     let button: any = wrapper.find('button');
     // simulate to change toggle state
     button.simulate('click');
-    // click to force propegation to form wrapper https://github.com/airbnb/enzyme/issues/308#issuecomment-255630011
-    button.get(0).click();
     expect((component as React.Component<any, any>).state.isChecked).toEqual(true);
     expect(onSubmit.called).toEqual(false);
   });
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
index 9393ef1c74957..6d6472a830337 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
@@ -27,7 +27,7 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
   private _toggleButton: HTMLButtonElement;
 
   constructor(props: IToggleProps) {
-    super();
+    super(props);
 
     this._warnMutuallyExclusive({
       checked: 'defaultChecked'
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index 188c180e0253c..d2fe5f67ef39e 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -53,8 +53,8 @@ const limitedSearchSuggestionProps: IBasePickerSuggestionsProps = assign(limited
 export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerExampleState> {
   private _picker: IBasePicker<IPersonaProps>;
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     let peopleList: IPersonaWithMenu[] = [];
     people.forEach((persona: IPersonaProps) => {
       let target: IPersonaWithMenu = {};
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
index 713655a00f4c1..27992cf64646a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
@@ -63,41 +63,41 @@ const data: IFullDocumentCardProps[] = [
     documentCardProps: {},
     documentActionsProps: {
       actions:
-      [
-        {
-          iconProps: { iconName: 'Share' },
-          onClick: (ev: any) => {
-            console.log('You clicked the share action.');
-            ev.preventDefault();
-            ev.stopPropagation();
-          }
-        },
-        {
-          iconProps: { iconName: 'Pin' },
-          onClick: (ev: any) => {
-            console.log('You clicked the pin action.');
-            ev.preventDefault();
-            ev.stopPropagation();
-          }
-        },
-        {
-          iconProps: { iconName: 'Ringer' },
-          onClick: (ev: any) => {
-            console.log('You clicked the Ringer action.');
-            ev.preventDefault();
-            ev.stopPropagation();
-          }
-        },
-      ] as IButtonProps[]
+        [
+          {
+            iconProps: { iconName: 'Share' },
+            onClick: (ev: any) => {
+              console.log('You clicked the share action.');
+              ev.preventDefault();
+              ev.stopPropagation();
+            }
+          },
+          {
+            iconProps: { iconName: 'Pin' },
+            onClick: (ev: any) => {
+              console.log('You clicked the pin action.');
+              ev.preventDefault();
+              ev.stopPropagation();
+            }
+          },
+          {
+            iconProps: { iconName: 'Ringer' },
+            onClick: (ev: any) => {
+              console.log('You clicked the Ringer action.');
+              ev.preventDefault();
+              ev.stopPropagation();
+            }
+          },
+        ] as IButtonProps[]
     },
     documentActivityProps: {
       activity: 'Created Feb 23, 2016',
       people:
-      [
-        { name: 'Kat Larrson', profileImageSrc: TestImages.personaFemale },
-        { name: 'Josh Hancock', profileImageSrc: '', initials: 'JH' },
-        { name: 'Tina Dasani', profileImageSrc: TestImages.personaFemale }
-      ]
+        [
+          { name: 'Kat Larrson', profileImageSrc: TestImages.personaFemale },
+          { name: 'Josh Hancock', profileImageSrc: '', initials: 'JH' },
+          { name: 'Tina Dasani', profileImageSrc: TestImages.personaFemale }
+        ]
     },
     documentTitleProps: {
       title: 'Document1',
@@ -120,41 +120,41 @@ const data: IFullDocumentCardProps[] = [
     documentCardProps: {},
     documentActionsProps: {
       actions:
-      [
-        {
-          iconProps: { iconName: 'Share' },
-          onClick: (ev: any) => {
-            console.log('You clicked the share action.');
-            ev.preventDefault();
-            ev.stopPropagation();
-          }
-        },
-        {
-          iconProps: { iconName: 'Pin' },
-          onClick: (ev: any) => {
-            console.log('You clicked the pin action.');
-            ev.preventDefault();
-            ev.stopPropagation();
-          }
-        },
-        {
-          iconProps: { iconName: 'Ringer' },
-          onClick: (ev: any) => {
-            console.log('You clicked the Ringer action.');
-            ev.preventDefault();
-            ev.stopPropagation();
-          }
-        },
-      ]
+        [
+          {
+            iconProps: { iconName: 'Share' },
+            onClick: (ev: any) => {
+              console.log('You clicked the share action.');
+              ev.preventDefault();
+              ev.stopPropagation();
+            }
+          },
+          {
+            iconProps: { iconName: 'Pin' },
+            onClick: (ev: any) => {
+              console.log('You clicked the pin action.');
+              ev.preventDefault();
+              ev.stopPropagation();
+            }
+          },
+          {
+            iconProps: { iconName: 'Ringer' },
+            onClick: (ev: any) => {
+              console.log('You clicked the Ringer action.');
+              ev.preventDefault();
+              ev.stopPropagation();
+            }
+          },
+        ]
     },
     documentActivityProps: {
       activity: 'Created Feb 23, 2016',
       people:
-      [
-        { name: 'Kat Larrson', profileImageSrc: TestImages.personaFemale },
-        { name: 'Josh Hancock', profileImageSrc: '', initials: 'JH' },
-        { name: 'Tina Dasani', profileImageSrc: TestImages.personaFemale }
-      ]
+        [
+          { name: 'Kat Larrson', profileImageSrc: TestImages.personaFemale },
+          { name: 'Josh Hancock', profileImageSrc: '', initials: 'JH' },
+          { name: 'Tina Dasani', profileImageSrc: TestImages.personaFemale }
+        ]
     },
     documentTitleProps: {
       title: 'Document2',
@@ -177,41 +177,41 @@ const data: IFullDocumentCardProps[] = [
     documentCardProps: {},
     documentActionsProps: {
       actions:
-      [
-        {
-          iconProps: { iconName: 'Share' },
-          onClick: (ev: any) => {
-            console.log('You clicked the share action.');
-            ev.preventDefault();
-            ev.stopPropagation();
-          }
-        },
-        {
-          iconProps: { iconName: 'Pin' },
-          onClick: (ev: any) => {
-            console.log('You clicked the pin action.');
-            ev.preventDefault();
-            ev.stopPropagation();
-          }
-        },
-        {
-          iconProps: { iconName: 'Ringer' },
-          onClick: (ev: any) => {
-            console.log('You clicked the Ringer action.');
-            ev.preventDefault();
-            ev.stopPropagation();
-          }
-        },
-      ]
+        [
+          {
+            iconProps: { iconName: 'Share' },
+            onClick: (ev: any) => {
+              console.log('You clicked the share action.');
+              ev.preventDefault();
+              ev.stopPropagation();
+            }
+          },
+          {
+            iconProps: { iconName: 'Pin' },
+            onClick: (ev: any) => {
+              console.log('You clicked the pin action.');
+              ev.preventDefault();
+              ev.stopPropagation();
+            }
+          },
+          {
+            iconProps: { iconName: 'Ringer' },
+            onClick: (ev: any) => {
+              console.log('You clicked the Ringer action.');
+              ev.preventDefault();
+              ev.stopPropagation();
+            }
+          },
+        ]
     },
     documentActivityProps: {
       activity: 'Created Feb 23, 2016',
       people:
-      [
-        { name: 'Kat Larrson', profileImageSrc: TestImages.personaFemale },
-        { name: 'Josh Hancock', profileImageSrc: '', initials: 'JH' },
-        { name: 'Tina Dasani', profileImageSrc: TestImages.personaFemale }
-      ]
+        [
+          { name: 'Kat Larrson', profileImageSrc: TestImages.personaFemale },
+          { name: 'Josh Hancock', profileImageSrc: '', initials: 'JH' },
+          { name: 'Tina Dasani', profileImageSrc: TestImages.personaFemale }
+        ]
     },
     documentTitleProps: {
       title: 'Document3',
@@ -234,41 +234,41 @@ const data: IFullDocumentCardProps[] = [
     documentCardProps: {},
     documentActionsProps: {
       actions:
-      [
-        {
-          iconProps: { iconName: 'Share' },
-          onClick: (ev: any) => {
-            console.log('You clicked the share action.');
-            ev.preventDefault();
-            ev.stopPropagation();
-          }
-        },
-        {
-          iconProps: { iconName: 'Pin' },
-          onClick: (ev: any) => {
-            console.log('You clicked the pin action.');
-            ev.preventDefault();
-            ev.stopPropagation();
-          }
-        },
-        {
-          iconProps: { iconName: 'Ringer' },
-          onClick: (ev: any) => {
-            console.log('You clicked the Ringer action.');
-            ev.preventDefault();
-            ev.stopPropagation();
-          }
-        },
-      ]
+        [
+          {
+            iconProps: { iconName: 'Share' },
+            onClick: (ev: any) => {
+              console.log('You clicked the share action.');
+              ev.preventDefault();
+              ev.stopPropagation();
+            }
+          },
+          {
+            iconProps: { iconName: 'Pin' },
+            onClick: (ev: any) => {
+              console.log('You clicked the pin action.');
+              ev.preventDefault();
+              ev.stopPropagation();
+            }
+          },
+          {
+            iconProps: { iconName: 'Ringer' },
+            onClick: (ev: any) => {
+              console.log('You clicked the Ringer action.');
+              ev.preventDefault();
+              ev.stopPropagation();
+            }
+          },
+        ]
     },
     documentActivityProps: {
       activity: 'Created Feb 23, 2016',
       people:
-      [
-        { name: 'Kat Larrson', profileImageSrc: TestImages.personaFemale },
-        { name: 'Josh Hancock', profileImageSrc: '', initials: 'JH' },
-        { name: 'Tina Dasani', profileImageSrc: TestImages.personaFemale }
-      ]
+        [
+          { name: 'Kat Larrson', profileImageSrc: TestImages.personaFemale },
+          { name: 'Josh Hancock', profileImageSrc: '', initials: 'JH' },
+          { name: 'Tina Dasani', profileImageSrc: TestImages.personaFemale }
+        ]
     },
     documentTitleProps: {
       title: 'Document4',
@@ -333,9 +333,9 @@ export const SelectedDocumentItem: (documentProps: IPickerItemProps<IFullDocumen
 
 export class DocumentPicker extends BasePickerListBelow<IFullDocumentCardProps, IDocumentPickerProps> {
 }
-export class PickerCustomResultExample extends React.Component<any, IPeoplePickerExampleState> {
-  constructor() {
-    super();
+export class PickerCustomResultExample extends React.Component<{}, IPeoplePickerExampleState> {
+  constructor(props: {}) {
+    super(props);
     this._onFilterChanged = this._onFilterChanged.bind(this);
     this.state = {
       isPickerDisabled: false
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
index ba6711f45bbfb..092c23623a903 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
@@ -25,8 +25,8 @@ let _testTags = [
 ].map(item => ({ key: item, name: item }));
 
 export class TagPickerBasicExample extends React.Component<{}, ITagPickerDemoPageState> {
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
     this.state = {
       isPickerDisabled: false
     };
diff --git a/packages/office-ui-fabric-react/src/utilities/decorators/BaseDecorator.ts b/packages/office-ui-fabric-react/src/utilities/decorators/BaseDecorator.ts
index c58b5f329253e..0f9f765680ac8 100644
--- a/packages/office-ui-fabric-react/src/utilities/decorators/BaseDecorator.ts
+++ b/packages/office-ui-fabric-react/src/utilities/decorators/BaseDecorator.ts
@@ -5,15 +5,15 @@ import {
   unhoistMethods
 } from '../../Utilities';
 
-export class BaseDecorator<P, S> extends BaseComponent<P, S> {
+export class BaseDecorator<TProps, TState> extends BaseComponent<TProps, TState> {
   protected _shouldUpdateComponentRef = false;
 
-  protected _composedComponentInstance: React.Component<P, S>;
+  protected _composedComponentInstance: React.Component<TProps, TState>;
 
   private _hoisted: string[];
 
-  constructor() {
-    super();
+  constructor(props: TProps) {
+    super(props);
     this._updateComposedComponentRef = this._updateComposedComponentRef.bind(this);
   }
 
@@ -23,7 +23,7 @@ export class BaseDecorator<P, S> extends BaseComponent<P, S> {
    *
    * Pass this method as the argument to the 'ref' property of the composed component.
    */
-  protected _updateComposedComponentRef(composedComponentInstance: React.Component<P, S>) {
+  protected _updateComposedComponentRef(composedComponentInstance: React.Component<TProps, TState>) {
     this._composedComponentInstance = composedComponentInstance;
     if (composedComponentInstance) {
       this._hoisted = hoistMethods(this, composedComponentInstance);
diff --git a/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx b/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx
index 6a72b85ff2338..f2325ce53dd34 100644
--- a/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx
@@ -1,9 +1,9 @@
 import * as React from 'react';
 import { BaseDecorator } from './BaseDecorator';
 
-export function withContainsFocus<P extends { containsFocus?: boolean }, S>(ComposedComponent: (new (props: P, ...args: any[]) => (React.Component<P, S>))): any {
+export function withContainsFocus<TProps extends { containsFocus?: boolean }, S>(ComposedComponent: (new (props: TProps, ...args: any[]) => (React.Component<TProps, S>))): any {
 
-  return class WithContainsFocusComponent extends BaseDecorator<P & { containsFocus?: boolean }, { containsFocus?: boolean }> {
+  return class WithContainsFocusComponent extends BaseDecorator<TProps & { containsFocus?: boolean }, { containsFocus?: boolean }> {
     public refs: {
       [key: string]: React.ReactInstance,
     };
@@ -11,8 +11,8 @@ export function withContainsFocus<P extends { containsFocus?: boolean }, S>(Comp
     private _newContainsFocus: boolean;
     private _delayedSetContainsFocus: () => void;
 
-    constructor() {
-      super();
+    constructor(props: TProps) {
+      super(props);
 
       this.state = {
         containsFocus: false
diff --git a/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.test.tsx b/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.test.tsx
index 2ecb33dfc616b..5e04310d6069f 100644
--- a/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.test.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.test.tsx
@@ -21,13 +21,4 @@ describe('withResponsiveMode', () => {
     setSSR(false);
   });
 
-  it('throws in server scenario when responsive mode is not specified', () => {
-    setSSR(true);
-
-    setResponsiveMode(undefined);
-    expect(() => ReactTestUtils.renderIntoDocument(<Example />)).toThrow();
-
-    setSSR(false);
-  });
-
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx b/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx
index bf2c6c79b7eb3..ba4fc1a55e618 100644
--- a/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx
@@ -33,12 +33,12 @@ export function setResponsiveMode(responsiveMode: ResponsiveMode | undefined) {
   _defaultMode = responsiveMode;
 }
 
-export function withResponsiveMode<P extends { responsiveMode?: ResponsiveMode }, S>(ComposedComponent: (new (props: P, ...args: any[]) => React.Component<P, S>)): any {
+export function withResponsiveMode<TProps extends { responsiveMode?: ResponsiveMode }, TState>(ComposedComponent: (new (props: TProps, ...args: any[]) => React.Component<TProps, TState>)): any {
 
-  return class WithResponsiveMode extends BaseDecorator<P, IWithResponsiveModeState> {
+  return class WithResponsiveMode extends BaseDecorator<TProps, IWithResponsiveModeState> {
 
-    constructor() {
-      super();
+    constructor(props: TProps) {
+      super(props);
       this._updateComposedComponentRef = this._updateComposedComponentRef.bind(this);
 
       this.state = {
diff --git a/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx b/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx
index b0334ce2a4866..f7a3519f2d678 100644
--- a/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx
@@ -21,17 +21,17 @@ export interface IWithViewportProps {
 const RESIZE_DELAY = 500;
 const MAX_RESIZE_ATTEMPTS = 3;
 
-export function withViewport<P extends { viewport?: IViewport }, S>(ComposedComponent: (new (props: P, ...args: any[]) => React.Component<P, S>)): any {
+export function withViewport<TProps extends { viewport?: IViewport }, TState>(ComposedComponent: (new (props: TProps, ...args: any[]) => React.Component<TProps, TState>)): any {
 
-  return class WithViewportComponent extends BaseDecorator<P, IWithViewportState> {
+  return class WithViewportComponent extends BaseDecorator<TProps, IWithViewportState> {
     public refs: {
       [key: string]: React.ReactInstance;
     };
 
     private _resizeAttempts: number;
 
-    constructor() {
-      super();
+    constructor(props: TProps) {
+      super(props);
       this._resizeAttempts = 0;
 
       this.state = {
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx b/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
index 22c556ecf4b60..5ff1fa25d8d13 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
@@ -60,11 +60,11 @@ export class SelectionItemExample extends React.Component<ISelectionItemExampleP
 /**
  * The SelectionBasicExample controls the selection state of all items
  */
-export class SelectionBasicExample extends React.Component<any, ISelectionBasicExampleState> {
+export class SelectionBasicExample extends React.Component<{}, ISelectionBasicExampleState> {
   private _hasMounted: boolean;
 
-  constructor() {
-    super();
+  constructor(props: {}) {
+    super(props);
 
     this._hasMounted = false;
     this._onSelectionChanged = this._onSelectionChanged.bind(this);
diff --git a/packages/styling/package.json b/packages/styling/package.json
index c9cb11e7d61e4..5a98ff0b79dd1 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -16,20 +16,17 @@
     "start-test": "node ../../scripts/start-test.js"
   },
   "devDependencies": {
-    "@types/chai": "3.4.35",
-    "@types/enzyme": "2.8.8",
-    "@types/jest": "21.1.0",
-    "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
-    "@types/react": "15.6.7",
+    "@types/react": "16.0.25",
+    "@types/jest": "21.1.8",
     "es6-map": "^0.1.5",
     "es6-weak-map": "^2.0.2",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
-    "react": "^15.6.1",
-    "react-dom": "^15.6.1"
+    "react": "^16.2.0",
+    "react-dom": "^16.2.0"
   },
   "dependencies": {
-    "@microsoft/load-themed-styles": "^1.7.2",
+    "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/utilities": ">=5.5.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.8.1 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/utilities/jest.config.js b/packages/utilities/jest.config.js
index ffb2cd8b04514..1b0ae6dca5d63 100644
--- a/packages/utilities/jest.config.js
+++ b/packages/utilities/jest.config.js
@@ -1,3 +1,9 @@
+let path = require('path');
 let { createConfig } = require('../../scripts/tasks/jest-resources');
+module.exports = createConfig({
+  setupFiles: [
+    path.resolve(__dirname, 'lib/common/tests.js')
+  ]
+});
 
-module.exports = createConfig();
\ No newline at end of file
+console.log(module.exports.setupFiles);
\ No newline at end of file
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 80bb299169ce3..5dfdb960f1f57 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -20,22 +20,24 @@
     "webpack"
   ],
   "devDependencies": {
-    "@types/jest": "21.1.0",
-    "@types/enzyme": "2.8.8",
-    "@types/prop-types": "15.5.1",
-    "@types/react": "15.6.7",
-    "@types/react-dom": "15.5.6",
+    "@types/jest": "21.1.8",
+    "@types/enzyme": "3.1.5",
+    "@types/enzyme-adapter-react-16": "1.0.1",
+    "@types/prop-types": "15.5.2",
+    "@types/react": "16.0.25",
+    "@types/react-dom": "16.0.3",
     "@types/sinon": "2.2.2",
-    "enzyme": "^2.9.1",
+    "enzyme": "^3.2.0",
+    "enzyme-adapter-react-16": "^1.1.0",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
-    "react": "^15.6.1",
-    "react-dom": "^15.6.1",
-    "sinon": "^2.3.2"
+    "react": "^16.2.0",
+    "react-dom": "^16.2.0",
+    "sinon": "^4.1.3"
   },
   "dependencies": {
-    "@microsoft/load-themed-styles": "^1.7.2",
+    "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/merge-styles": ">=5.8.1 <6.0.0",
-    "prop-types": "^15.5.10",
+    "prop-types": "^15.6.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/utilities/src/BaseComponent.test.tsx b/packages/utilities/src/BaseComponent.test.tsx
index b20e4f6291909..bed1d511f4d9f 100644
--- a/packages/utilities/src/BaseComponent.test.tsx
+++ b/packages/utilities/src/BaseComponent.test.tsx
@@ -91,7 +91,7 @@ function _buildTestFor(methodName: string): void {
 
     BaseComponent.onError = (errorMessage: string | undefined) => lastErrorMessage = errorMessage;
 
-    let c = new TestComponent();
+    let c = new TestComponent({});
 
     // tslint:disable-next-line:no-any
     (c as any)[methodName]();
diff --git a/packages/utilities/src/BaseComponent.ts b/packages/utilities/src/BaseComponent.ts
index baac0662e8671..1c89e37697838 100644
--- a/packages/utilities/src/BaseComponent.ts
+++ b/packages/utilities/src/BaseComponent.ts
@@ -18,7 +18,7 @@ export interface IBaseProps {
  *
  * @public
  */
-export class BaseComponent<P extends IBaseProps, S = {}> extends React.Component<P, S> {
+export class BaseComponent<P extends IBaseProps = {}, S = {}> extends React.Component<P, S> {
   /**
    * External consumers should override BaseComponent.onError to hook into error messages that occur from
    * exceptions thrown from within components.
@@ -47,7 +47,7 @@ export class BaseComponent<P extends IBaseProps, S = {}> extends React.Component
    * @param context - The context for the component.
    */
   // tslint:disable-next-line:no-any
-  constructor(props?: P, context?: any) {
+  constructor(props: P, context?: any) {
     super(props, context);
 
     this._shouldUpdateComponentRef = true;
diff --git a/packages/utilities/src/FabricPerformance.ts b/packages/utilities/src/FabricPerformance.ts
index f76c25e13ac7f..3fba65ed999ba 100644
--- a/packages/utilities/src/FabricPerformance.ts
+++ b/packages/utilities/src/FabricPerformance.ts
@@ -1,3 +1,5 @@
+declare const setTimeout: (cb: () => void, delay: number) => number;
+
 /**
  * PerfData interface.
  *
diff --git a/packages/utilities/src/common/tests.ts b/packages/utilities/src/common/tests.ts
new file mode 100644
index 0000000000000..6fd0b271b5e1e
--- /dev/null
+++ b/packages/utilities/src/common/tests.ts
@@ -0,0 +1,13 @@
+/** Jest test setup file. */
+import { configure } from 'enzyme';
+import * as Adapter from 'enzyme-adapter-react-16';
+
+// Mock requestAnimationFrame for React 16+.
+declare const global: { requestAnimationFrame: (cb: () => void) => void };
+
+global.requestAnimationFrame = (callback: () => void) => {
+  setTimeout(callback, 0);
+};
+
+// Configure enzyme.
+configure({ adapter: new Adapter() });
diff --git a/rush.json b/rush.json
index 93a2ebd4fa648..debe79f711b6e 100644
--- a/rush.json
+++ b/rush.json
@@ -1,6 +1,6 @@
 {
   "npmVersion": "5.5.1",
-  "rushVersion": "4.0.0",
+  "rushVersion": "4.1.0",
   "repository": {
     "url": "https://github.com/OfficeDev/office-ui-fabric-react.git"
   },
diff --git a/scripts/package.json b/scripts/package.json
index e27c92f0cb2dd..648a78cbe0420 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -9,7 +9,7 @@
   },
   "devDependencies": {
     "@microsoft/api-extractor": "^4.2.6",
-    "@microsoft/load-themed-styles": "^1.7.5",
+    "@microsoft/load-themed-styles": "^1.7.13",
     "@microsoft/loader-load-themed-styles": "^1.6.0",
     "@uifabric/merge-styles": ">=5.8.1 <6.0.0",
     "autoprefixer": "^7.1.5",
@@ -29,13 +29,13 @@
     "node-sass": "^4.5.3",
     "open": "^0.0.5",
     "postcss": "^6.0.9",
-    "postcss-loader": "^2.0.6",
+    "postcss-loader": "^2.0.9",
     "postcss-modules": "^0.8.0",
+    "raf": "^3.4.0",
     "raw-loader": "^0.5.1",
     "sass-loader": "^6.0.6",
-    "sinon": "^4.0.1",
     "source-map-loader": "^0.2.1",
-    "style-loader": "^0.18.2",
+    "style-loader": "^0.19.0",
     "tslint": "^5.7.0",
     "tslint-microsoft-contrib": "^5.0.1",
     "typescript": "2.6.2",
diff --git a/scripts/tasks/jest-disable-warnings.js b/scripts/tasks/jest-disable-warnings.js
deleted file mode 100644
index ee06bb448e170..0000000000000
--- a/scripts/tasks/jest-disable-warnings.js
+++ /dev/null
@@ -1,4 +0,0 @@
-// Fail on warnings.
-console.warn = (message) => {
-  throw new Error(message);
-};
\ No newline at end of file
diff --git a/scripts/tasks/jest-mock.js b/scripts/tasks/jest-mock.js
index 38385ae8d057b..dce535c5c08d4 100644
--- a/scripts/tasks/jest-mock.js
+++ b/scripts/tasks/jest-mock.js
@@ -20,4 +20,4 @@ const KeyCodes = {
 
 module.exports = {
   KeyCodes
-};
\ No newline at end of file
+};
diff --git a/scripts/tasks/jest-resources.js b/scripts/tasks/jest-resources.js
index 2a145b8bc9850..bd08e5432b443 100644
--- a/scripts/tasks/jest-resources.js
+++ b/scripts/tasks/jest-resources.js
@@ -35,7 +35,7 @@ const styleMockPath =
         ],
 
         'setupFiles': [
-          path.resolve(__dirname, './jest-disable-warnings.js')
+          path.resolve(__dirname, 'jest-setup.js')
         ],
 
         'moduleDirectories': [
diff --git a/scripts/tasks/jest-setup.js b/scripts/tasks/jest-setup.js
new file mode 100644
index 0000000000000..96bd4d6b80acd
--- /dev/null
+++ b/scripts/tasks/jest-setup.js
@@ -0,0 +1,15 @@
+// Polyfill requestAnimiationFrame
+require('raf/polyfill');
+
+// Fail on warnings.
+const consoleError = console.error;
+
+console.error = console.warn = (message) => {
+  // Ignore error boundary warnings so that tests which throw exceptions can be validated.
+  if (message.indexOf('error boundary') >= 0) {
+    return;
+  }
+
+  consoleError(message);
+  throw new Error("Caught: " + message);
+};

From a9865ce46e24a4ac3b5fb82fcdc7d7d901eab2ab Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Sat, 16 Dec 2017 05:07:22 +0000
Subject: [PATCH 1160/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 26 +++++++++++
 apps/fabric-website/CHANGELOG.md              | 13 +++++-
 apps/fabric-website/package.json              |  4 +-
 .../react-update_2017-12-10-21-48.json        | 11 -----
 .../rename-props_2017-11-11-20-23.json        | 11 -----
 .../react-update_2017-12-10-21-48.json        | 11 -----
 .../getstarted-link_2017-12-15-18-13.json     | 11 -----
 .../react-update_2017-12-10-21-48.json        | 11 -----
 .../react-update_2017-12-10-21-48.json        | 11 -----
 .../rename-props_2017-11-11-20-23.json        | 11 -----
 .../react-update_2017-12-10-21-48.json        | 11 -----
 .../react-update_2017-12-10-21-48.json        | 11 -----
 .../react-update_2017-12-10-21-48.json        | 11 -----
 .../react-update_2017-12-10-21-48.json        | 11 -----
 packages/example-app-base/CHANGELOG.json      | 22 +++++++++
 packages/example-app-base/CHANGELOG.md        | 45 +++++++++++--------
 packages/example-app-base/package.json        |  6 +--
 packages/experiments/CHANGELOG.json           | 25 +++++++++++
 packages/experiments/CHANGELOG.md             |  9 +++-
 packages/experiments/package.json             |  8 ++--
 .../CHANGELOG.json                            | 19 ++++++++
 .../jest-serializer-merge-styles/CHANGELOG.md |  9 +++-
 .../jest-serializer-merge-styles/package.json |  4 +-
 packages/merge-styles/CHANGELOG.json          | 14 ++++++
 packages/merge-styles/CHANGELOG.md            |  9 +++-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 31 +++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 +++-
 packages/office-ui-fabric-react/package.json  | 12 ++---
 packages/styling/CHANGELOG.json               | 22 +++++++++
 packages/styling/CHANGELOG.md                 |  9 +++-
 packages/styling/package.json                 |  6 +--
 packages/utilities/CHANGELOG.json             | 19 ++++++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  4 +-
 scripts/package.json                          |  2 +-
 36 files changed, 288 insertions(+), 171 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/react-update_2017-12-10-21-48.json
 delete mode 100644 common/changes/@uifabric/example-app-base/rename-props_2017-11-11-20-23.json
 delete mode 100644 common/changes/@uifabric/experiments/react-update_2017-12-10-21-48.json
 delete mode 100644 common/changes/@uifabric/fabric-website/getstarted-link_2017-12-15-18-13.json
 delete mode 100644 common/changes/@uifabric/fabric-website/react-update_2017-12-10-21-48.json
 delete mode 100644 common/changes/@uifabric/jest-serializer-merge-styles/react-update_2017-12-10-21-48.json
 delete mode 100644 common/changes/@uifabric/jest-serializer-merge-styles/rename-props_2017-11-11-20-23.json
 delete mode 100644 common/changes/@uifabric/merge-styles/react-update_2017-12-10-21-48.json
 delete mode 100644 common/changes/@uifabric/styling/react-update_2017-12-10-21-48.json
 delete mode 100644 common/changes/@uifabric/utilities/react-update_2017-12-10-21-48.json
 delete mode 100644 common/changes/office-ui-fabric-react/react-update_2017-12-10-21-48.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 430cddb9e5573..d50a93f8dc392 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.2.0",
+      "tag": "@uifabric/fabric-website_v5.2.0",
+      "date": "Sat, 16 Dec 2017 05:07:22 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "e329c53575a45272da4d28dbc725804f7fac4062",
+            "comment": "GetStarted Page: More specific selectors for button with link to deal with UHF styles."
+          }
+        ],
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "08e59c871894c8ff443d48dbe5b0dd3316eb4331",
+            "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.33.1 <6.0.0` to `>=5.34.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.1.0",
       "tag": "@uifabric/fabric-website_v5.1.0",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 5aed9ec84bfad..2869f5ba757b1 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Thu, 14 Dec 2017 11:23:17 GMT and should not be manually modified.
+This log was last generated on Sat, 16 Dec 2017 05:07:22 GMT and should not be manually modified.
+
+## 5.2.0
+Sat, 16 Dec 2017 05:07:22 GMT
+
+### Minor changes
+
+- Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme
+
+### Patches
+
+- GetStarted Page: More specific selectors for button with link to deal with UHF styles.
 
 ## 5.1.0
 Thu, 14 Dec 2017 11:23:17 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 0690fe9fc7e3f..ee38a3c8a358c 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.1.0",
+  "version": "5.2.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.33.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.34.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/react-update_2017-12-10-21-48.json b/common/changes/@uifabric/example-app-base/react-update_2017-12-10-21-48.json
deleted file mode 100644
index 21590ae4144cf..0000000000000
--- a/common/changes/@uifabric/example-app-base/react-update_2017-12-10-21-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/rename-props_2017-11-11-20-23.json b/common/changes/@uifabric/example-app-base/rename-props_2017-11-11-20-23.json
deleted file mode 100644
index cde5b3e29d95c..0000000000000
--- a/common/changes/@uifabric/example-app-base/rename-props_2017-11-11-20-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/react-update_2017-12-10-21-48.json b/common/changes/@uifabric/experiments/react-update_2017-12-10-21-48.json
deleted file mode 100644
index 22f222e997fdb..0000000000000
--- a/common/changes/@uifabric/experiments/react-update_2017-12-10-21-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/getstarted-link_2017-12-15-18-13.json b/common/changes/@uifabric/fabric-website/getstarted-link_2017-12-15-18-13.json
deleted file mode 100644
index 0f5630e4e00aa..0000000000000
--- a/common/changes/@uifabric/fabric-website/getstarted-link_2017-12-15-18-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "GetStarted Page: More specific selectors for button with link to deal with UHF styles.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/react-update_2017-12-10-21-48.json b/common/changes/@uifabric/fabric-website/react-update_2017-12-10-21-48.json
deleted file mode 100644
index ae46c8e96a14e..0000000000000
--- a/common/changes/@uifabric/fabric-website/react-update_2017-12-10-21-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/jest-serializer-merge-styles/react-update_2017-12-10-21-48.json b/common/changes/@uifabric/jest-serializer-merge-styles/react-update_2017-12-10-21-48.json
deleted file mode 100644
index ed131fe62cb9b..0000000000000
--- a/common/changes/@uifabric/jest-serializer-merge-styles/react-update_2017-12-10-21-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/jest-serializer-merge-styles",
-      "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/jest-serializer-merge-styles",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/jest-serializer-merge-styles/rename-props_2017-11-11-20-23.json b/common/changes/@uifabric/jest-serializer-merge-styles/rename-props_2017-11-11-20-23.json
deleted file mode 100644
index 8ca592e81d622..0000000000000
--- a/common/changes/@uifabric/jest-serializer-merge-styles/rename-props_2017-11-11-20-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/jest-serializer-merge-styles",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/jest-serializer-merge-styles",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/react-update_2017-12-10-21-48.json b/common/changes/@uifabric/merge-styles/react-update_2017-12-10-21-48.json
deleted file mode 100644
index 77a98d97644cf..0000000000000
--- a/common/changes/@uifabric/merge-styles/react-update_2017-12-10-21-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/react-update_2017-12-10-21-48.json b/common/changes/@uifabric/styling/react-update_2017-12-10-21-48.json
deleted file mode 100644
index cbdd65bdfca6e..0000000000000
--- a/common/changes/@uifabric/styling/react-update_2017-12-10-21-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/react-update_2017-12-10-21-48.json b/common/changes/@uifabric/utilities/react-update_2017-12-10-21-48.json
deleted file mode 100644
index 4508ef62e3411..0000000000000
--- a/common/changes/@uifabric/utilities/react-update_2017-12-10-21-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/react-update_2017-12-10-21-48.json b/common/changes/office-ui-fabric-react/react-update_2017-12-10-21-48.json
deleted file mode 100644
index c1f3f4ee53fa2..0000000000000
--- a/common/changes/office-ui-fabric-react/react-update_2017-12-10-21-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme happy.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 68479e0ef33f1..f98ada02a7646 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "5.2.0",
+      "tag": "@uifabric/example-app-base_v5.2.0",
+      "date": "Sat, 16 Dec 2017 05:07:22 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "08e59c871894c8ff443d48dbe5b0dd3316eb4331",
+            "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.14.0 <6.0.0` to `>=5.15.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.5.0 <6.0.0` to `>=5.6.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.1.2",
       "tag": "@uifabric/example-app-base_v5.1.2",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index bc4984068961f..694af417dbac1 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Wed, 25 Oct 2017 02:03:33 GMT and should not be manually modified.
+This log was last generated on Sat, 16 Dec 2017 05:07:22 GMT and should not be manually modified.
+
+## 5.2.0
+Sat, 16 Dec 2017 05:07:22 GMT
+
+### Minor changes
+
+- Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme
 
 ## 5.1.2
 Wed, 25 Oct 2017 02:03:33 GMT
@@ -26,12 +33,12 @@ Thu, 05 Oct 2017 17:03:43 GMT
 ## 5.0.5
 Thu, 05 Oct 2017 10:17:42 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 5.0.4
 Wed, 04 Oct 2017 22:40:22 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 5.0.3
 Fri, 29 Sep 2017 10:20:24 GMT
@@ -43,7 +50,7 @@ Fri, 29 Sep 2017 10:20:24 GMT
 ## 5.0.2
 Thu, 28 Sep 2017 10:19:12 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 5.0.1
 Wed, 27 Sep 2017 00:20:58 GMT
@@ -179,7 +186,7 @@ Thu, 08 Jun 2017 00:18:05 GMT
 ## 2.1.2
 Tue, 06 Jun 2017 07:41:47 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 2.1.1
 Tue, 06 Jun 2017 06:06:46 GMT
@@ -198,22 +205,22 @@ Tue, 06 Jun 2017 00:50:06 GMT
 ## 2.0.4
 Fri, 02 Jun 2017 01:19:36 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 2.0.3
 Thu, 01 Jun 2017 16:34:03 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 2.0.2
 Wed, 31 May 2017 01:58:23 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 2.0.1
 Tue, 30 May 2017 20:23:45 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 2.0.0
 Tue, 30 May 2017 03:27:20 GMT
@@ -229,17 +236,17 @@ Tue, 30 May 2017 03:27:20 GMT
 ## 1.3.14
 Fri, 26 May 2017 10:21:03 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 1.3.13
 Tue, 23 May 2017 10:16:04 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 1.3.12
 Thu, 18 May 2017 10:09:58 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 1.3.11
 Fri, 05 May 2017 10:18:19 GMT
@@ -251,12 +258,12 @@ Fri, 05 May 2017 10:18:19 GMT
 ## 1.3.10
 Fri, 21 Apr 2017 06:23:54 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 1.3.8
 Wed, 19 Apr 2017 16:54:26 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 1.3.7
 Tue, 18 Apr 2017 03:09:12 GMT
@@ -275,7 +282,7 @@ Tue, 04 Apr 2017 20:08:53 GMT
 ## 1.3.5
 Tue, 04 Apr 2017 15:18:51 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 1.3.4
 Wed, 29 Mar 2017 18:15:29 GMT
@@ -294,12 +301,12 @@ Tue, 28 Mar 2017 03:05:36 GMT
 ## 1.3.2
 Fri, 24 Mar 2017 20:25:07 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 1.3.1
 Fri, 24 Mar 2017 04:26:48 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 1.3.0
 Thu, 23 Mar 2017 03:13:02 GMT
@@ -311,7 +318,7 @@ Thu, 23 Mar 2017 03:13:02 GMT
 ## 1.2.1
 Wed, 22 Mar 2017 03:18:05 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 1.2.0
 Tue, 21 Mar 2017 03:20:12 GMT
@@ -344,7 +351,7 @@ Thu, 09 Mar 2017 06:33:00 GMT
 ## 1.0.4
 Thu, 09 Mar 2017 06:11:07 GMT
 
-*Changes not tracked*
+*Version update only*
 
 ## 1.0.3
 Mon, 27 Feb 2017 21:45:53 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 2448b14640f32..62662e995a313 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "5.1.2",
+  "version": "5.2.0",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -32,8 +32,8 @@
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.14.0 <6.0.0",
-    "@uifabric/utilities": ">=5.5.0 <6.0.0",
+    "@uifabric/styling": ">=5.15.0 <6.0.0",
+    "@uifabric/utilities": ">=5.6.0 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 72f43c8067fc6..40f8e1035a68f 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,31 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.11.0",
+      "tag": "@uifabric/experiments_v5.11.0",
+      "date": "Sat, 16 Dec 2017 05:07:22 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "08e59c871894c8ff443d48dbe5b0dd3316eb4331",
+            "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.33.1 <6.0.0` to `>=5.34.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=5.1.2 <6.0.0` to `>=5.2.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/jest-serializer-merge-styles\" from `>=5.0.1 <6.0.0` to `>=5.1.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.10.1",
       "tag": "@uifabric/experiments_v5.10.1",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index cdaae4e001dc5..279e2368c6afc 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Fri, 15 Dec 2017 11:22:38 GMT and should not be manually modified.
+This log was last generated on Sat, 16 Dec 2017 05:07:22 GMT and should not be manually modified.
+
+## 5.11.0
+Sat, 16 Dec 2017 05:07:22 GMT
+
+### Minor changes
+
+- Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme
 
 ## 5.10.1
 Fri, 15 Dec 2017 11:22:38 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index a2ebbaf1d274a..abf48f573ce2a 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.10.1",
+  "version": "5.11.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,9 +29,9 @@
     "@types/enzyme": "3.1.5",
     "@types/enzyme-adapter-react-16": "1.0.1",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=5.1.2 <6.0.0",
+    "@uifabric/example-app-base": ">=5.2.0 <6.0.0",
     "@uifabric/file-type-icons": ">=0.1.0 <1.0.0",
-    "@uifabric/jest-serializer-merge-styles": ">=5.0.1 <6.0.0",
+    "@uifabric/jest-serializer-merge-styles": ">=5.1.0 <6.0.0",
     "es6-weak-map": "^2.0.2",
     "enzyme": "^3.2.0",
     "enzyme-adapter-react-16": "^1.1.0",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.33.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.34.0 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "prop-types": "^15.6.0",
     "tslib": "^1.7.1"
diff --git a/packages/jest-serializer-merge-styles/CHANGELOG.json b/packages/jest-serializer-merge-styles/CHANGELOG.json
index 0c1c71e4c7a4a..98bc13f1b76e4 100644
--- a/packages/jest-serializer-merge-styles/CHANGELOG.json
+++ b/packages/jest-serializer-merge-styles/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/jest-serializer-merge-styles",
   "entries": [
+    {
+      "version": "5.1.0",
+      "tag": "@uifabric/jest-serializer-merge-styles_v5.1.0",
+      "date": "Sat, 16 Dec 2017 05:07:22 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "08e59c871894c8ff443d48dbe5b0dd3316eb4331",
+            "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.8.1 <6.0.0` to `>=5.9.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.1",
       "tag": "@uifabric/jest-serializer-merge-styles_v5.0.1",
diff --git a/packages/jest-serializer-merge-styles/CHANGELOG.md b/packages/jest-serializer-merge-styles/CHANGELOG.md
index c90a68c774009..908118d0926f4 100644
--- a/packages/jest-serializer-merge-styles/CHANGELOG.md
+++ b/packages/jest-serializer-merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/jest-serializer-merge-styles
 
-This log was last generated on Tue, 24 Oct 2017 10:21:08 GMT and should not be manually modified.
+This log was last generated on Sat, 16 Dec 2017 05:07:22 GMT and should not be manually modified.
+
+## 5.1.0
+Sat, 16 Dec 2017 05:07:22 GMT
+
+### Minor changes
+
+- Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme
 
 ## 5.0.1
 Tue, 24 Oct 2017 10:21:08 GMT
diff --git a/packages/jest-serializer-merge-styles/package.json b/packages/jest-serializer-merge-styles/package.json
index a36369accd932..428502e83b527 100644
--- a/packages/jest-serializer-merge-styles/package.json
+++ b/packages/jest-serializer-merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/jest-serializer-merge-styles",
-  "version": "5.0.1",
+  "version": "5.1.0",
   "description": "Jest serializer for merge-styles.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -24,6 +24,6 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/merge-styles": ">=5.8.1 <6.0.0"
+    "@uifabric/merge-styles": ">=5.9.0 <6.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index 0b754a56d298d..82a38d45087dc 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.9.0",
+      "tag": "@uifabric/merge-styles_v5.9.0",
+      "date": "Sat, 16 Dec 2017 05:07:22 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "08e59c871894c8ff443d48dbe5b0dd3316eb4331",
+            "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme"
+          }
+        ]
+      }
+    },
     {
       "version": "5.8.1",
       "tag": "@uifabric/merge-styles_v5.8.1",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index 0ea0a14369ea5..d929c78ca1bfe 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Mon, 11 Dec 2017 11:24:05 GMT and should not be manually modified.
+This log was last generated on Sat, 16 Dec 2017 05:07:22 GMT and should not be manually modified.
+
+## 5.9.0
+Sat, 16 Dec 2017 05:07:22 GMT
+
+### Minor changes
+
+- Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme
 
 ## 5.8.1
 Mon, 11 Dec 2017 11:24:05 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index fee3b17b70dbe..c5e826d789b88 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.8.1",
+  "version": "5.9.0",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index b226b176883f7..10e81020be8ef 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,37 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.34.0",
+      "tag": "office-ui-fabric-react_v5.34.0",
+      "date": "Sat, 16 Dec 2017 05:07:22 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "08e59c871894c8ff443d48dbe5b0dd3316eb4331",
+            "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme happy."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.8.1 <6.0.0` to `>=5.9.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.14.0 <6.0.0` to `>=5.15.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.5.0 <6.0.0` to `>=5.6.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/jest-serializer-merge-styles\" from `>=5.0.1 <6.0.0` to `>=5.1.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=5.1.2 <6.0.0` to `>=5.2.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.33.1",
       "tag": "office-ui-fabric-react_v5.33.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 1a5f13f96f678..cc75ca1dd40c6 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 15 Dec 2017 11:22:38 GMT and should not be manually modified.
+This log was last generated on Sat, 16 Dec 2017 05:07:22 GMT and should not be manually modified.
+
+## 5.34.0
+Sat, 16 Dec 2017 05:07:22 GMT
+
+### Minor changes
+
+- Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme happy.
 
 ## 5.33.1
 Fri, 15 Dec 2017 11:22:38 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 10ef283841003..04ecc404254af 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.33.1",
+  "version": "5.34.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -28,8 +28,8 @@
     "@types/resemblejs": "~1.3.28",
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/jest-serializer-merge-styles": ">=5.0.1 <6.0.0",
-    "@uifabric/example-app-base": ">=5.1.2 <6.0.0",
+    "@uifabric/jest-serializer-merge-styles": ">=5.1.0 <6.0.0",
+    "@uifabric/example-app-base": ">=5.2.0 <6.0.0",
     "enzyme": "^3.2.0",
     "enzyme-adapter-react-16": "^1.1.0",
     "es6-promise": "^4.1.0",
@@ -48,9 +48,9 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.8.1 <6.0.0",
-    "@uifabric/styling": ">=5.14.0 <6.0.0",
-    "@uifabric/utilities": ">=5.5.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.9.0 <6.0.0",
+    "@uifabric/styling": ">=5.15.0 <6.0.0",
+    "@uifabric/utilities": ">=5.6.0 <6.0.0",
     "prop-types": "^15.6.0",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index b1abb03094857..7731782a4c388 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.15.0",
+      "tag": "@uifabric/styling_v5.15.0",
+      "date": "Sat, 16 Dec 2017 05:07:22 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "08e59c871894c8ff443d48dbe5b0dd3316eb4331",
+            "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.5.0 <6.0.0` to `>=5.6.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.8.1 <6.0.0` to `>=5.9.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.14.0",
       "tag": "@uifabric/styling_v5.14.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 2a4add2b43ecc..d3d9d83367ba8 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Mon, 04 Dec 2017 17:27:54 GMT and should not be manually modified.
+This log was last generated on Sat, 16 Dec 2017 05:07:22 GMT and should not be manually modified.
+
+## 5.15.0
+Sat, 16 Dec 2017 05:07:22 GMT
+
+### Minor changes
+
+- Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme
 
 ## 5.14.0
 Mon, 04 Dec 2017 17:27:54 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 5a98ff0b79dd1..17f48bfd7a054 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.14.0",
+  "version": "5.15.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "repository": {
     "type": "git",
@@ -27,8 +27,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.5.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.8.1 <6.0.0",
+    "@uifabric/utilities": ">=5.6.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.9.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 4b04656790db6..31ecfe5bbb99b 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.6.0",
+      "tag": "@uifabric/utilities_v5.6.0",
+      "date": "Sat, 16 Dec 2017 05:07:22 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "08e59c871894c8ff443d48dbe5b0dd3316eb4331",
+            "comment": "Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.8.1 <6.0.0` to `>=5.9.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.5.0",
       "tag": "@uifabric/utilities_v5.5.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 4b0c5f987b655..63ecbef7a7133 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Tue, 28 Nov 2017 02:24:21 GMT and should not be manually modified.
+This log was last generated on Sat, 16 Dec 2017 05:07:22 GMT and should not be manually modified.
+
+## 5.6.0
+Sat, 16 Dec 2017 05:07:22 GMT
+
+### Minor changes
+
+- Updated build to newest React version and typings. Updated tests and made various tweaks to the code to remove React warnings and keep Enzyme
 
 ## 5.5.0
 Tue, 28 Nov 2017 02:24:21 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 5dfdb960f1f57..8d5e8e67f3cd7 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.5.0",
+  "version": "5.6.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -36,7 +36,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/merge-styles": ">=5.8.1 <6.0.0",
+    "@uifabric/merge-styles": ">=5.9.0 <6.0.0",
     "prop-types": "^15.6.0",
     "tslib": "^1.7.1"
   },
diff --git a/scripts/package.json b/scripts/package.json
index 648a78cbe0420..a7d9c87aa297d 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -11,7 +11,7 @@
     "@microsoft/api-extractor": "^4.2.6",
     "@microsoft/load-themed-styles": "^1.7.13",
     "@microsoft/loader-load-themed-styles": "^1.6.0",
-    "@uifabric/merge-styles": ">=5.8.1 <6.0.0",
+    "@uifabric/merge-styles": ">=5.9.0 <6.0.0",
     "autoprefixer": "^7.1.5",
     "awesome-typescript-loader": "^3.2.3",
     "bundlesize": "^0.15.2",

From 4b344435e71f8e1eaafb8ee8370d4d8d752d33a4 Mon Sep 17 00:00:00 2001
From: MirandaGe <lingge@microsoft.com>
Date: Mon, 18 Dec 2017 15:38:51 +0800
Subject: [PATCH 1161/1641] Make PersonaCoin respect class passed from
 coinProps (#3582)

* respect className passed in PersonaCoin

* add rush change file
---
 .../lingge-persona-className_2017-12-15-09-01.json    | 11 +++++++++++
 .../src/components/Persona/PersonaCoin.tsx            |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/lingge-persona-className_2017-12-15-09-01.json

diff --git a/common/changes/office-ui-fabric-react/lingge-persona-className_2017-12-15-09-01.json b/common/changes/office-ui-fabric-react/lingge-persona-className_2017-12-15-09-01.json
new file mode 100644
index 0000000000000..a2c9a057b46d1
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/lingge-persona-className_2017-12-15-09-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "respect className for PersonaCoin",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lingge@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
index badfcc7fd1f2d..348fc7ab6cb5f 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
@@ -87,7 +87,7 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
     return (
       <div
         { ...divProps }
-        className={ css('ms-Persona-coin', PERSONA_SIZE[size]) }
+        className={ css('ms-Persona-coin', PERSONA_SIZE[size], coinProps && coinProps.className) }
       >
         { (size !== PersonaSize.size10 && size !== PersonaSize.tiny) ? (
           <div

From ea4bff02f8bb841f24a75ee9e89ed2f5f0b7c9c8 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 18 Dec 2017 03:22:54 -0800
Subject: [PATCH 1162/1641] Applying package updates.

---
 apps/fabric-website/package.json                   |  2 +-
 apps/ssr-tests/package.json                        |  2 +-
 apps/test-bundle-button/package.json               |  2 +-
 apps/todo-app/package.json                         |  2 +-
 apps/vr-tests/package.json                         |  2 +-
 .../lingge-persona-className_2017-12-15-09-01.json | 11 -----------
 packages/experiments/package.json                  |  2 +-
 packages/office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md       |  9 ++++++++-
 packages/office-ui-fabric-react/package.json       |  2 +-
 10 files changed, 29 insertions(+), 19 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/lingge-persona-className_2017-12-15-09-01.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index ee38a3c8a358c..b3092454e5099 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.34.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.34.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index ca5af65f9c667..c8c3d73055edf 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.33.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.34.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 1a1c8bab97027..c06c6be8cba55 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.33.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.34.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index d3b1d5cb81c89..c95e0b828347a 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.33.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.34.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 27d84dfd1a634..3289741204b86 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.33.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.34.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/office-ui-fabric-react/lingge-persona-className_2017-12-15-09-01.json b/common/changes/office-ui-fabric-react/lingge-persona-className_2017-12-15-09-01.json
deleted file mode 100644
index a2c9a057b46d1..0000000000000
--- a/common/changes/office-ui-fabric-react/lingge-persona-className_2017-12-15-09-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "respect className for PersonaCoin",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lingge@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index abf48f573ce2a..b45ab2f730126 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.34.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.34.1 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "prop-types": "^15.6.0",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 10e81020be8ef..d3dcc3c40d960 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.34.1",
+      "tag": "office-ui-fabric-react_v5.34.1",
+      "date": "Mon, 18 Dec 2017 11:22:54 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "MirandaGe <lingge@microsoft.com>",
+            "commit": "4b344435e71f8e1eaafb8ee8370d4d8d752d33a4",
+            "comment": "respect className for PersonaCoin"
+          }
+        ]
+      }
+    },
     {
       "version": "5.34.0",
       "tag": "office-ui-fabric-react_v5.34.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index cc75ca1dd40c6..6890583e7d28d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Sat, 16 Dec 2017 05:07:22 GMT and should not be manually modified.
+This log was last generated on Mon, 18 Dec 2017 11:22:54 GMT and should not be manually modified.
+
+## 5.34.1
+Mon, 18 Dec 2017 11:22:54 GMT
+
+### Patches
+
+- respect className for PersonaCoin
 
 ## 5.34.0
 Sat, 16 Dec 2017 05:07:22 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 04ecc404254af..2aeb11fb10f61 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.34.0",
+  "version": "5.34.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 4de6890ed8f24f88c5aa1ec6801abf6c18a5fe5e Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Mon, 18 Dec 2017 10:34:49 -0800
Subject: [PATCH 1163/1641] Persona: Initials high contrast color (#3595)

* Initials high contrast color

* Added change file

* Fixed border cut off
---
 .../persona-initials-a11y_2017-12-18-18-03.json       | 11 +++++++++++
 .../src/components/Persona/Persona.scss               |  2 ++
 2 files changed, 13 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/persona-initials-a11y_2017-12-18-18-03.json

diff --git a/common/changes/office-ui-fabric-react/persona-initials-a11y_2017-12-18-18-03.json b/common/changes/office-ui-fabric-react/persona-initials-a11y_2017-12-18-18-03.json
new file mode 100644
index 0000000000000..a86decb18388b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/persona-initials-a11y_2017-12-18-18-03.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Persona: Set initials color for high contrast mode.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
index 4be75d5a3f7f6..58fc5e67750d7 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
@@ -100,6 +100,8 @@ $ms-Persona-presenceBorder: 2px;
   @include high-contrast {
     border: 1px solid WindowText;
     -ms-high-contrast-adjust: none;
+    color: WindowText;
+    box-sizing: border-box;
     // Using important to override all of the more specific initialsIsColor rules
     background-color: Window !important;
   }

From 745d39de8459b457c00c81af37b458188608eaad Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Mon, 18 Dec 2017 15:46:36 -0800
Subject: [PATCH 1164/1641] Allow for a broader range of the prop-type
 dependency (#3596)

* Broaden the range of prop types allowed for fabric-react

* Missed fabric-react!

* Rush cange
---
 .../experiments/prop-types-deps_2017-12-18-22-06.json | 11 +++++++++++
 .../utilities/prop-types-deps_2017-12-18-22-06.json   | 11 +++++++++++
 .../prop-types-deps_2017-12-18-22-06.json             | 11 +++++++++++
 packages/experiments/package.json                     |  2 +-
 packages/office-ui-fabric-react/package.json          |  2 +-
 packages/utilities/package.json                       |  2 +-
 6 files changed, 36 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/prop-types-deps_2017-12-18-22-06.json
 create mode 100644 common/changes/@uifabric/utilities/prop-types-deps_2017-12-18-22-06.json
 create mode 100644 common/changes/office-ui-fabric-react/prop-types-deps_2017-12-18-22-06.json

diff --git a/common/changes/@uifabric/experiments/prop-types-deps_2017-12-18-22-06.json b/common/changes/@uifabric/experiments/prop-types-deps_2017-12-18-22-06.json
new file mode 100644
index 0000000000000..c14ad06800997
--- /dev/null
+++ b/common/changes/@uifabric/experiments/prop-types-deps_2017-12-18-22-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Broaden the range of allowed prop-type versions",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "<christianjordangonzalez@gmail.com>"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/prop-types-deps_2017-12-18-22-06.json b/common/changes/@uifabric/utilities/prop-types-deps_2017-12-18-22-06.json
new file mode 100644
index 0000000000000..3b1c6a0757817
--- /dev/null
+++ b/common/changes/@uifabric/utilities/prop-types-deps_2017-12-18-22-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Broaden the range of allowed prop-type versions",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "<christianjordangonzalez@gmail.com>"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/prop-types-deps_2017-12-18-22-06.json b/common/changes/office-ui-fabric-react/prop-types-deps_2017-12-18-22-06.json
new file mode 100644
index 0000000000000..86b574ab2db02
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/prop-types-deps_2017-12-18-22-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Broaden the range of allowed prop-type versions",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "<christianjordangonzalez@gmail.com>"
+}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index b45ab2f730126..34ff4b44ff029 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -46,7 +46,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "office-ui-fabric-react": ">=5.34.1 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
-    "prop-types": "^15.6.0",
+    "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 2aeb11fb10f61..c9a110d93f4bf 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -51,7 +51,7 @@
     "@uifabric/merge-styles": ">=5.9.0 <6.0.0",
     "@uifabric/styling": ">=5.15.0 <6.0.0",
     "@uifabric/utilities": ">=5.6.0 <6.0.0",
-    "prop-types": "^15.6.0",
+    "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 8d5e8e67f3cd7..7968636d29cac 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -37,7 +37,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/merge-styles": ">=5.9.0 <6.0.0",
-    "prop-types": "^15.6.0",
+    "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {

From e1e05a4b678498c7054b7760215f1d737567167d Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 19 Dec 2017 03:22:47 -0800
Subject: [PATCH 1165/1641] Applying package updates.

---
 .../prop-types-deps_2017-12-18-22-06.json     | 11 ---------
 .../prop-types-deps_2017-12-18-22-06.json     | 11 ---------
 ...ersona-initials-a11y_2017-12-18-18-03.json | 11 ---------
 .../prop-types-deps_2017-12-18-22-06.json     | 11 ---------
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/CHANGELOG.json           | 19 +++++++++++++++
 packages/experiments/CHANGELOG.md             |  9 ++++++-
 packages/experiments/package.json             |  4 ++--
 .../office-ui-fabric-react/CHANGELOG.json     | 24 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++++-
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 +++++++++++
 packages/utilities/CHANGELOG.md               |  9 ++++++-
 packages/utilities/package.json               |  2 +-
 15 files changed, 89 insertions(+), 54 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/prop-types-deps_2017-12-18-22-06.json
 delete mode 100644 common/changes/@uifabric/utilities/prop-types-deps_2017-12-18-22-06.json
 delete mode 100644 common/changes/office-ui-fabric-react/persona-initials-a11y_2017-12-18-18-03.json
 delete mode 100644 common/changes/office-ui-fabric-react/prop-types-deps_2017-12-18-22-06.json

diff --git a/common/changes/@uifabric/experiments/prop-types-deps_2017-12-18-22-06.json b/common/changes/@uifabric/experiments/prop-types-deps_2017-12-18-22-06.json
deleted file mode 100644
index c14ad06800997..0000000000000
--- a/common/changes/@uifabric/experiments/prop-types-deps_2017-12-18-22-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Broaden the range of allowed prop-type versions",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "<christianjordangonzalez@gmail.com>"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/prop-types-deps_2017-12-18-22-06.json b/common/changes/@uifabric/utilities/prop-types-deps_2017-12-18-22-06.json
deleted file mode 100644
index 3b1c6a0757817..0000000000000
--- a/common/changes/@uifabric/utilities/prop-types-deps_2017-12-18-22-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Broaden the range of allowed prop-type versions",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "<christianjordangonzalez@gmail.com>"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/persona-initials-a11y_2017-12-18-18-03.json b/common/changes/office-ui-fabric-react/persona-initials-a11y_2017-12-18-18-03.json
deleted file mode 100644
index a86decb18388b..0000000000000
--- a/common/changes/office-ui-fabric-react/persona-initials-a11y_2017-12-18-18-03.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Persona: Set initials color for high contrast mode.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/prop-types-deps_2017-12-18-22-06.json b/common/changes/office-ui-fabric-react/prop-types-deps_2017-12-18-22-06.json
deleted file mode 100644
index 86b574ab2db02..0000000000000
--- a/common/changes/office-ui-fabric-react/prop-types-deps_2017-12-18-22-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Broaden the range of allowed prop-type versions",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "<christianjordangonzalez@gmail.com>"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 62662e995a313..f9f2d00881e6a 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.15.0 <6.0.0",
-    "@uifabric/utilities": ">=5.6.0 <6.0.0",
+    "@uifabric/utilities": ">=5.6.1 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 40f8e1035a68f..5693101f9ebab 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.11.1",
+      "tag": "@uifabric/experiments_v5.11.1",
+      "date": "Tue, 19 Dec 2017 11:22:47 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "745d39de8459b457c00c81af37b458188608eaad",
+            "comment": "Broaden the range of allowed prop-type versions"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.34.1 <6.0.0` to `>=5.34.2 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.11.0",
       "tag": "@uifabric/experiments_v5.11.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 279e2368c6afc..c1f6fb47d53b1 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Sat, 16 Dec 2017 05:07:22 GMT and should not be manually modified.
+This log was last generated on Tue, 19 Dec 2017 11:22:47 GMT and should not be manually modified.
+
+## 5.11.1
+Tue, 19 Dec 2017 11:22:47 GMT
+
+### Patches
+
+- Broaden the range of allowed prop-type versions
 
 ## 5.11.0
 Sat, 16 Dec 2017 05:07:22 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 34ff4b44ff029..2edaf7c6fbbd2 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.11.0",
+  "version": "5.11.1",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.34.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.34.2 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index d3dcc3c40d960..cfaeb7d99e947 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.34.2",
+      "tag": "office-ui-fabric-react_v5.34.2",
+      "date": "Tue, 19 Dec 2017 11:22:47 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "4de6890ed8f24f88c5aa1ec6801abf6c18a5fe5e",
+            "comment": "Persona: Set initials color for high contrast mode."
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "745d39de8459b457c00c81af37b458188608eaad",
+            "comment": "Broaden the range of allowed prop-type versions"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.6.0 <6.0.0` to `>=5.6.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.34.1",
       "tag": "office-ui-fabric-react_v5.34.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 6890583e7d28d..a94d8863ad374 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 18 Dec 2017 11:22:54 GMT and should not be manually modified.
+This log was last generated on Tue, 19 Dec 2017 11:22:47 GMT and should not be manually modified.
+
+## 5.34.2
+Tue, 19 Dec 2017 11:22:47 GMT
+
+### Patches
+
+- Persona: Set initials color for high contrast mode.
+- Broaden the range of allowed prop-type versions
 
 ## 5.34.1
 Mon, 18 Dec 2017 11:22:54 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index c9a110d93f4bf..8763c47facd81 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.34.1",
+  "version": "5.34.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -50,7 +50,7 @@
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.9.0 <6.0.0",
     "@uifabric/styling": ">=5.15.0 <6.0.0",
-    "@uifabric/utilities": ">=5.6.0 <6.0.0",
+    "@uifabric/utilities": ">=5.6.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 17f48bfd7a054..7bdb8638d9c59 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.6.0 <6.0.0",
+    "@uifabric/utilities": ">=5.6.1 <6.0.0",
     "@uifabric/merge-styles": ">=5.9.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 31ecfe5bbb99b..16547202f35e4 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.6.1",
+      "tag": "@uifabric/utilities_v5.6.1",
+      "date": "Tue, 19 Dec 2017 11:22:47 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "745d39de8459b457c00c81af37b458188608eaad",
+            "comment": "Broaden the range of allowed prop-type versions"
+          }
+        ]
+      }
+    },
     {
       "version": "5.6.0",
       "tag": "@uifabric/utilities_v5.6.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 63ecbef7a7133..8db185ba911dd 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Sat, 16 Dec 2017 05:07:22 GMT and should not be manually modified.
+This log was last generated on Tue, 19 Dec 2017 11:22:47 GMT and should not be manually modified.
+
+## 5.6.1
+Tue, 19 Dec 2017 11:22:47 GMT
+
+### Patches
+
+- Broaden the range of allowed prop-type versions
 
 ## 5.6.0
 Sat, 16 Dec 2017 05:07:22 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 7968636d29cac..d81dcadc24a63 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.6.0",
+  "version": "5.6.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 332ba751c6f0d9b1e286d30940bf39b50ccc434a Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Tue, 19 Dec 2017 14:01:55 -0800
Subject: [PATCH 1166/1641] Fixing detection of whether scrolling is needed in
 expanded HoverCards (#3356)

* using existing checkNeedsScroll async function instead of checking for scroll too early in component did mount, also fixing expanded card class name issues

* rush change

* Making sure expanded scroll class only triggers when needsScroll is on
---
 .../v-krbrow-hovercard-scroll_2017-11-09-22-23.json   | 11 +++++++++++
 .../src/components/HoverCard/ExpandingCard.tsx        | 11 +++--------
 2 files changed, 14 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-hovercard-scroll_2017-11-09-22-23.json

diff --git a/common/changes/office-ui-fabric-react/v-krbrow-hovercard-scroll_2017-11-09-22-23.json b/common/changes/office-ui-fabric-react/v-krbrow-hovercard-scroll_2017-11-09-22-23.json
new file mode 100644
index 0000000000000..53dd3641db410
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-hovercard-scroll_2017-11-09-22-23.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "HoverCard: fixing detection of if expanded scrolling is needed",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
index 7db069f775b54..f6c807ddf53d5 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
@@ -48,11 +48,7 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
   }
 
   public componentDidMount() {
-    if (this._expandedElem && this._expandedElem.scrollHeight >= (this.props.expandedCardHeight as number)) {
-      this.setState({
-        needsScroll: true
-      });
-    }
+    this._checkNeedsScroll();
 
     if (this.props.trapFocus) {
       this._events.on(this._expandingCard, 'keydown', this._onDismiss);
@@ -145,12 +141,11 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
       <div
         className={ mergeStyles(
           this._styles.expandedCard,
-          this.props.mode === ExpandingCardMode.expanded && this.state.firstFrameRendered && { height: this.props.expandedCardHeight + 'px' },
-          this.state.needsScroll && { overflowY: 'auto' }
+          this.props.mode === ExpandingCardMode.expanded && this.state.firstFrameRendered && { height: this.props.expandedCardHeight + 'px' }
         ) }
         ref={ this._resolveRef('_expandedElem') }
       >
-        <div className={ this._styles.expandedCardScroll as string }>
+        <div className={ mergeStyles(this.state.needsScroll && this._styles.expandedCardScroll) }>
           { this.props.onRenderExpandedCard && this.props.onRenderExpandedCard(this.props.renderData) }
         </div>
       </div>

From 48360e17f2c680aa61d01eba3092ea8d1b48c50c Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 20 Dec 2017 11:21:48 +0000
Subject: [PATCH 1167/1641] Applying package updates.

---
 apps/fabric-website/package.json                   |  2 +-
 apps/ssr-tests/package.json                        |  2 +-
 apps/test-bundle-button/package.json               |  2 +-
 apps/todo-app/package.json                         |  2 +-
 apps/vr-tests/package.json                         |  2 +-
 ...v-krbrow-hovercard-scroll_2017-11-09-22-23.json | 11 -----------
 packages/experiments/package.json                  |  2 +-
 packages/office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md       |  9 ++++++++-
 packages/office-ui-fabric-react/package.json       |  2 +-
 10 files changed, 29 insertions(+), 19 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-hovercard-scroll_2017-11-09-22-23.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index b3092454e5099..af78b8eb2f04e 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.34.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.34.3 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index c8c3d73055edf..732b171b31ab5 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.34.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.34.3 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index c06c6be8cba55..8c8e70c5f75fb 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.34.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.34.3 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index c95e0b828347a..95dee2daabe92 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.34.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.34.3 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 3289741204b86..4fa6cdc1537fe 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.34.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.34.3 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-hovercard-scroll_2017-11-09-22-23.json b/common/changes/office-ui-fabric-react/v-krbrow-hovercard-scroll_2017-11-09-22-23.json
deleted file mode 100644
index 53dd3641db410..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-hovercard-scroll_2017-11-09-22-23.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "HoverCard: fixing detection of if expanded scrolling is needed",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 2edaf7c6fbbd2..18302a8ae339b 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.34.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.34.3 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index cfaeb7d99e947..5d60ab147f04e 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.34.3",
+      "tag": "office-ui-fabric-react_v5.34.3",
+      "date": "Wed, 20 Dec 2017 11:21:48 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "332ba751c6f0d9b1e286d30940bf39b50ccc434a",
+            "comment": "HoverCard: fixing detection of if expanded scrolling is needed"
+          }
+        ]
+      }
+    },
     {
       "version": "5.34.2",
       "tag": "office-ui-fabric-react_v5.34.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index a94d8863ad374..56bce1ff506fe 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 19 Dec 2017 11:22:47 GMT and should not be manually modified.
+This log was last generated on Wed, 20 Dec 2017 11:21:48 GMT and should not be manually modified.
+
+## 5.34.3
+Wed, 20 Dec 2017 11:21:48 GMT
+
+### Patches
+
+- HoverCard: fixing detection of if expanded scrolling is needed
 
 ## 5.34.2
 Tue, 19 Dec 2017 11:22:47 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 8763c47facd81..a3ce99685a5e0 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.34.2",
+  "version": "5.34.3",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From b57846d853e1ea13421726efca9079dbe3fef3a9 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 20 Dec 2017 09:55:21 -0800
Subject: [PATCH 1168/1641] Updated codeowners to support subfolders and
 explicit ownership of PersonaCoin files (#3612)

---
 .github/CODEOWNERS | 143 +++++++++++++++++++++++----------------------
 1 file changed, 72 insertions(+), 71 deletions(-)

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index 5361016596541..4869022a4e9bd 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -13,87 +13,88 @@
 
 # You can also use email addresses if you prefer. They'll be used to look up
 # users just like we do for commit author emails.
-# docs/*  docs@example.com
+# docs/  docs@example.com
 
 #### Apps
-# component-demo/*
-# fabric-website/*
-# ssr-tests/*
-# test-bundle-button/*
-# todo-app/*
+# component-demo/
+# fabric-website/
+# ssr-tests/
+# test-bundle-button/
+# todo-app/
 
 #### Packages
-# packages/example-app-base/*
-# packages/example-component/*
+# packages/example-app-base/
+# packages/example-component/
 
   ### Fabric
-  # packages/office-ui-fabric-react/src/common/*
+  # packages/office-ui-fabric-react/src/common/
   packages/office-ui-fabric-react/src/common/_semanticSlots.scss  @phkuo
   packages/office-ui-fabric-react/src/common/_themeOverrides.scss @phkuo
   packages/office-ui-fabric-react/src/common/_common.scss @phkuo
 
     ## Components
-    # packages/office-ui-fabric-react/src/components/ActivityItem/*
-    # packages/office-ui-fabric-react/src/components/Breadcrumb/*
-    # packages/office-ui-fabric-react/src/components/Button/*
-    packages/office-ui-fabric-react/src/components/Calendar/*   @johannao76 @lorejoh12@gmail.com @jolore@microsoft.com
-    # packages/office-ui-fabric-react/src/components/Callout/*
-    # packages/office-ui-fabric-react/src/components/Check/*
-    # packages/office-ui-fabric-react/src/components/Checkbox/*
-    # packages/office-ui-fabric-react/src/components/ChoiceGroup/*
-    # packages/office-ui-fabric-react/src/components/ColorPicker/*
-    # packages/office-ui-fabric-react/src/components/ComboBox/*
-    packages/office-ui-fabric-react/src/components/CommandBar/*   @micahgodbolt
-    # packages/office-ui-fabric-react/src/components/ContextualMenu/*
-    packages/office-ui-fabric-react/src/components/DatePicker/*   @johannao76 @lorejoh12@gmail.com @jolore@microsoft.com
-    # packages/office-ui-fabric-react/src/components/DetailsList/*
-    # packages/office-ui-fabric-react/src/components/Dialog/*
-    # packages/office-ui-fabric-react/src/components/DocumentCard/*
-    # packages/office-ui-fabric-react/src/components/Dropdown/*
-    # packages/office-ui-fabric-react/src/components/Fabric/*
-    # packages/office-ui-fabric-react/src/components/FacePile/*
-    # packages/office-ui-fabric-react/src/components/FocusTrapZone/*
-    # packages/office-ui-fabric-react/src/components/FocusZone/*
-    # packages/office-ui-fabric-react/src/components/GroupedList/*
-    packages/office-ui-fabric-react/src/components/HoverCard/*   @atneik @Jahnp
-    # packages/office-ui-fabric-react/src/components/Icon/*
-    # packages/office-ui-fabric-react/src/components/Image/*
-    # packages/office-ui-fabric-react/src/components/Label/*
-    # packages/office-ui-fabric-react/src/components/Layer/*
-    # packages/office-ui-fabric-react/src/components/Link/*
-    packages/office-ui-fabric-react/src/components/List/*  @cschleiden
-    # packages/office-ui-fabric-react/src/components/MarqueeSelection/*
-    # packages/office-ui-fabric-react/src/components/MessageBar/*
-    # packages/office-ui-fabric-react/src/components/Modal/*
-    # packages/office-ui-fabric-react/src/components/Nav/*
-    packages/office-ui-fabric-react/src/components/OverflowSet/*  @micahgodbolt
-    # packages/office-ui-fabric-react/src/components/Overlay/*
-    # packages/office-ui-fabric-react/src/components/Panel/*
-    # packages/office-ui-fabric-react/src/components/Persona/*
-    packages/office-ui-fabric-react/src/components/Persona/PersonaCo* @mtennoe @jakob101
-    # packages/office-ui-fabric-react/src/components/pickers/*
-    # packages/office-ui-fabric-react/src/components/Pivot/*
-    # packages/office-ui-fabric-react/src/components/Popup/*
-    # packages/office-ui-fabric-react/src/components/ProgressIndicator/*
-    packages/office-ui-fabric-react/src/components/Rating/*  @cschleiden
-    packages/office-ui-fabric-react/src/components/ResizeGroup/*  @micahgodbolt
-    # packages/office-ui-fabric-react/src/components/SearchBox/*
-    # packages/office-ui-fabric-react/src/components/Slider/*
-    # packages/office-ui-fabric-react/src/components/SpinButton/*
-    # packages/office-ui-fabric-react/src/components/Spinner/*
-    # packages/office-ui-fabric-react/src/components/SwatchColorPicker/*
-    packages/office-ui-fabric-react/src/components/TeachingBubble/*   @micahgodbolt
-    # packages/office-ui-fabric-react/src/components/TextField/*
-    # packages/office-ui-fabric-react/src/components/Theme/*
-    packages/office-ui-fabric-react/src/components/Toggle/*  @phkuo
-    packages/office-ui-fabric-react/src/components/Tooltip/*  @micahgodbolt
+    # packages/office-ui-fabric-react/src/components/ActivityItem/
+    # packages/office-ui-fabric-react/src/components/Breadcrumb/
+    # packages/office-ui-fabric-react/src/components/Button/
+    packages/office-ui-fabric-react/src/components/Calendar/   @johannao76 @lorejoh12@gmail.com @jolore@microsoft.com
+    # packages/office-ui-fabric-react/src/components/Callout/
+    # packages/office-ui-fabric-react/src/components/Check/
+    # packages/office-ui-fabric-react/src/components/Checkbox/
+    # packages/office-ui-fabric-react/src/components/ChoiceGroup/
+    # packages/office-ui-fabric-react/src/components/ColorPicker/
+    # packages/office-ui-fabric-react/src/components/ComboBox/
+    packages/office-ui-fabric-react/src/components/CommandBar/   @micahgodbolt
+    # packages/office-ui-fabric-react/src/components/ContextualMenu/
+    packages/office-ui-fabric-react/src/components/DatePicker/   @johannao76 @lorejoh12@gmail.com @jolore@microsoft.com
+    # packages/office-ui-fabric-react/src/components/DetailsList/
+    # packages/office-ui-fabric-react/src/components/Dialog/
+    # packages/office-ui-fabric-react/src/components/DocumentCard/
+    # packages/office-ui-fabric-react/src/components/Dropdown/
+    # packages/office-ui-fabric-react/src/components/Fabric/
+    # packages/office-ui-fabric-react/src/components/FacePile/
+    # packages/office-ui-fabric-react/src/components/FocusTrapZone/
+    # packages/office-ui-fabric-react/src/components/FocusZone/
+    # packages/office-ui-fabric-react/src/components/GroupedList/
+    packages/office-ui-fabric-react/src/components/HoverCard/   @atneik @Jahnp
+    # packages/office-ui-fabric-react/src/components/Icon/
+    # packages/office-ui-fabric-react/src/components/Image/
+    # packages/office-ui-fabric-react/src/components/Label/
+    # packages/office-ui-fabric-react/src/components/Layer/
+    # packages/office-ui-fabric-react/src/components/Link/
+    packages/office-ui-fabric-react/src/components/List/  @cschleiden
+    # packages/office-ui-fabric-react/src/components/MarqueeSelection/
+    # packages/office-ui-fabric-react/src/components/MessageBar/
+    # packages/office-ui-fabric-react/src/components/Modal/
+    # packages/office-ui-fabric-react/src/components/Nav/
+    packages/office-ui-fabric-react/src/components/OverflowSet/  @micahgodbolt
+    # packages/office-ui-fabric-react/src/components/Overlay/
+    # packages/office-ui-fabric-react/src/components/Panel/
+    # packages/office-ui-fabric-react/src/components/Persona/
+    packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx @mtennoe @jakob101
+    packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.tsx @mtennoe @jakob101
+    # packages/office-ui-fabric-react/src/components/pickers/
+    # packages/office-ui-fabric-react/src/components/Pivot/
+    # packages/office-ui-fabric-react/src/components/Popup/
+    # packages/office-ui-fabric-react/src/components/ProgressIndicator/
+    packages/office-ui-fabric-react/src/components/Rating/  @cschleiden
+    packages/office-ui-fabric-react/src/components/ResizeGroup/  @micahgodbolt
+    # packages/office-ui-fabric-react/src/components/SearchBox/
+    # packages/office-ui-fabric-react/src/components/Slider/
+    # packages/office-ui-fabric-react/src/components/SpinButton/
+    # packages/office-ui-fabric-react/src/components/Spinner/
+    # packages/office-ui-fabric-react/src/components/SwatchColorPicker/
+    packages/office-ui-fabric-react/src/components/TeachingBubble/   @micahgodbolt
+    # packages/office-ui-fabric-react/src/components/TextField/
+    # packages/office-ui-fabric-react/src/components/Theme/
+    packages/office-ui-fabric-react/src/components/Toggle/  @phkuo
+    packages/office-ui-fabric-react/src/components/Tooltip/  @micahgodbolt
 
-  # packages/office-ui-fabric-react/src/demo/*
-  # packages/office-ui-fabric-react/src/utilities/*
-  # packages/office-ui-fabric-react/src/visualtest/*
+  # packages/office-ui-fabric-react/src/demo/
+  # packages/office-ui-fabric-react/src/utilities/
+  # packages/office-ui-fabric-react/src/visualtest/
 
-# packages/office-ui-fabric-react-tslint/*
-packages/styling/*  @dzearing
-packages/styling/src/interfaces/* @phkuo
-packages/styling/src/styles/* @phkuo
-# packages/utilities/*
+# packages/office-ui-fabric-react-tslint/
+packages/styling/  @dzearing
+packages/styling/src/interfaces/ @phkuo
+packages/styling/src/styles/ @phkuo
+# packages/utilities/

From fc376bb77449323463cf80b52b69fb35aa9b9f92 Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Wed, 20 Dec 2017 16:20:13 -0800
Subject: [PATCH 1169/1641] Fixed persona import paths (#3615)

* Fixed persona import paths

* Change file
---
 .../law-fix_amdgraph_2017-12-21-00-00.json            | 11 +++++++++++
 .../src/components/ActivityItem/ActivityItem.tsx      |  2 +-
 .../src/components/ActivityItem/ActivityItem.types.ts |  2 +-
 .../src/components/Facepile/Facepile.test.tsx         |  2 +-
 4 files changed, 14 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/law-fix_amdgraph_2017-12-21-00-00.json

diff --git a/common/changes/office-ui-fabric-react/law-fix_amdgraph_2017-12-21-00-00.json b/common/changes/office-ui-fabric-react/law-fix_amdgraph_2017-12-21-00-00.json
new file mode 100644
index 0000000000000..a29ee2902e0a3
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/law-fix_amdgraph_2017-12-21-00-00.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixed persona import paths",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
index d0f1f0a6057dd..610e71dbc1913 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
@@ -7,7 +7,7 @@ import { IActivityItemProps, IActivityItemStyles } from './ActivityItem.types';
 import { mergeStyles } from '../../Styling';
 import { IActivityItemClassNames, getClassNames } from './ActivityItem.classNames';
 import { getStyles } from './ActivityItem.styles';
-import { PersonaSize, PersonaCoin, IPersonaProps} from '../Persona';
+import { PersonaSize, PersonaCoin, IPersonaProps } from '../../Persona';
 
 export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
   private _classNames: IActivityItemClassNames;
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.types.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.types.ts
index a24865a115d79..8a054fe144979 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.types.ts
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { IStyle } from '../../Styling';
 import { IRenderFunction } from '../../Utilities';
-import { IPersonaProps } from '../Persona';
+import { IPersonaProps } from '../../Persona';
 
 // Please keep alphabetized
 export interface IActivityItemProps extends React.AllHTMLAttributes<HTMLElement> {
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
index 5af69c0b3e3d8..ebf447e68a97c 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
@@ -7,7 +7,7 @@ import { mount, shallow, ReactWrapper } from 'enzyme';
 import { setRTL } from '../../Utilities';
 import { Facepile } from './Facepile';
 import { IFacepilePersona, OverflowButtonType } from './Facepile.types';
-import { PersonaSize } from '../Persona';
+import { PersonaSize } from '../../Persona';
 import { PersonaCoin } from '../../PersonaCoin';
 import { TestImages } from '../../common/TestImages';
 import { findNodes, expectOne, expectMissing } from '../../common/testUtilities';

From e6eee8b4f76967676cc05a8da247589c10f764ff Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Wed, 20 Dec 2017 17:52:34 -0800
Subject: [PATCH 1170/1641] Grid: Convert grid to getStyles to enable grid
 customization (#3614)

* Add custom styling to grid

* Add grid styles file and update snapshots

* Fix grid cell unit test

* Use lambda to provide getStyles for grid

* Add comments for grid styles

* Add comments for swatchcolorpicker

* Make tests run over grid base

* Add grid base file

* Remove unused import

* Add change file

* Add theme as a gridstyle prop
---
 ...no-GridCustomStyling_2017-12-20-23-07.json |  11 ++
 .../SwatchColorPicker.base.tsx                |  12 +-
 .../SwatchColorPicker.styles.ts               |  10 +-
 .../SwatchColorPicker.types.ts                |  12 +-
 .../SwatchColorPicker.test.tsx.snap           | 171 +++++++++++-------
 .../src/utilities/grid/Grid.base.tsx          |  84 +++++++++
 .../src/utilities/grid/Grid.styles.ts         |  13 ++
 .../src/utilities/grid/Grid.test.tsx          |  12 +-
 .../src/utilities/grid/Grid.tsx               |  80 +-------
 .../src/utilities/grid/Grid.types.ts          |  49 ++++-
 10 files changed, 305 insertions(+), 149 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/malozano-GridCustomStyling_2017-12-20-23-07.json
 create mode 100644 packages/office-ui-fabric-react/src/utilities/grid/Grid.base.tsx
 create mode 100644 packages/office-ui-fabric-react/src/utilities/grid/Grid.styles.ts

diff --git a/common/changes/office-ui-fabric-react/malozano-GridCustomStyling_2017-12-20-23-07.json b/common/changes/office-ui-fabric-react/malozano-GridCustomStyling_2017-12-20-23-07.json
new file mode 100644
index 0000000000000..54c94c951c2d9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-GridCustomStyling_2017-12-20-23-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Grid: Enable styling customization to grid through getStyles",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
index 43199c4b35ab5..8e9e1e3769caf 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
@@ -4,7 +4,8 @@ import {
   BaseComponent,
   findIndex,
   getId,
-  customizable
+  customizable,
+  classNamesFunction
 } from '../../Utilities';
 import {
   ISwatchColorPicker,
@@ -16,7 +17,6 @@ import { Grid } from '../../utilities/grid/Grid';
 import { IColorCellProps } from './ColorPickerGridCell.types';
 import { ColorPickerGridCell } from './ColorPickerGridCell';
 import { mergeStyleSets } from '../../Styling';
-import { classNamesFunction } from '../../Utilities';
 
 export interface ISwatchColorPickerState {
   selectedIndex?: number;
@@ -98,7 +98,13 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
         shouldFocusCircularNavigate={ shouldFocusCircularNavigate }
         doNotContainWithinFocusZone={ doNotContainWithinFocusZone }
         onBlur={ this._onSwatchColorPickerBlur }
-        containerClassName={ classNames.root }
+        theme={ this.props.theme! }
+        // tslint:disable-next-line:jsx-no-lambda
+        getStyles={ (props) => ({
+          root: classNames.root,
+          tableCell: classNames.tableCell,
+          focusedContainer: classNames.focusedContainer
+        }) }
       />);
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.styles.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.styles.ts
index fd1f6d773cc80..08a3c546af9fb 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.styles.ts
@@ -8,8 +8,16 @@ export const getStyles = (props: ISwatchColorPickerStyleProps): ISwatchColorPick
   } = props;
 
   const { semanticColors, fonts } = theme;
+
   return {
-    root: [
+    root: {
+      padding: 2,
+      outline: 'none'
+    },
+    tableCell: {
+      padding: 0
+    },
+    focusedContainer: [
       'ms-swatchColorPickerBodyContainer',
       {
         clear: 'both',
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts
index 70b80799f8891..c2fc67fcb3f42 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts
@@ -123,7 +123,17 @@ export interface ISwatchColorPickerStyleProps {
  */
 export interface ISwatchColorPickerStyles {
   /**
-   * Style applied to the container of the swatchColorPicker
+   * Style applied to the container grid of the swatchColorPicker
    */
   root: IStyle;
+
+  /**
+  * Style for the table cells of the grid.
+  */
+  tableCell: IStyle;
+
+  /**
+  * Optional, style for the FocusZone container for the grid
+  */
+  focusedContainer?: IStyle;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
index 301df02c3f14d..32120e45c26f3 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
@@ -22,26 +22,32 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
   <table
     aria-posinset={undefined}
     aria-setsize={undefined}
+    className=
+
+        {
+          outline: none;
+          padding-bottom: 2px;
+          padding-left: 2px;
+          padding-right: 2px;
+          padding-top: 2px;
+        }
     id="id__2"
     role="grid"
-    style={
-      Object {
-        "outline": "none",
-        "padding": "2px",
-      }
-    }
   >
     <tbody>
       <tr
         role="row"
       >
         <td
+          className=
+
+              {
+                padding-bottom: 0px;
+                padding-left: 0px;
+                padding-right: 0px;
+                padding-top: 0px;
+              }
           role="presentation"
-          style={
-            Object {
-              "padding": "0px",
-            }
-          }
         >
           <button
             aria-describedby={null}
@@ -217,12 +223,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
           </button>
         </td>
         <td
+          className=
+
+              {
+                padding-bottom: 0px;
+                padding-left: 0px;
+                padding-right: 0px;
+                padding-top: 0px;
+              }
           role="presentation"
-          style={
-            Object {
-              "padding": "0px",
-            }
-          }
         >
           <button
             aria-describedby={null}
@@ -398,12 +407,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
           </button>
         </td>
         <td
+          className=
+
+              {
+                padding-bottom: 0px;
+                padding-left: 0px;
+                padding-right: 0px;
+                padding-top: 0px;
+              }
           role="presentation"
-          style={
-            Object {
-              "padding": "0px",
-            }
-          }
         >
           <button
             aria-describedby={null}
@@ -579,12 +591,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
           </button>
         </td>
         <td
+          className=
+
+              {
+                padding-bottom: 0px;
+                padding-left: 0px;
+                padding-right: 0px;
+                padding-top: 0px;
+              }
           role="presentation"
-          style={
-            Object {
-              "padding": "0px",
-            }
-          }
         >
           <button
             aria-describedby={null}
@@ -764,12 +779,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
         role="row"
       >
         <td
+          className=
+
+              {
+                padding-bottom: 0px;
+                padding-left: 0px;
+                padding-right: 0px;
+                padding-top: 0px;
+              }
           role="presentation"
-          style={
-            Object {
-              "padding": "0px",
-            }
-          }
         >
           <button
             aria-describedby={null}
@@ -945,12 +963,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
           </button>
         </td>
         <td
+          className=
+
+              {
+                padding-bottom: 0px;
+                padding-left: 0px;
+                padding-right: 0px;
+                padding-top: 0px;
+              }
           role="presentation"
-          style={
-            Object {
-              "padding": "0px",
-            }
-          }
         >
           <button
             aria-describedby={null}
@@ -1126,12 +1147,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
           </button>
         </td>
         <td
+          className=
+
+              {
+                padding-bottom: 0px;
+                padding-left: 0px;
+                padding-right: 0px;
+                padding-top: 0px;
+              }
           role="presentation"
-          style={
-            Object {
-              "padding": "0px",
-            }
-          }
         >
           <button
             aria-describedby={null}
@@ -1307,12 +1331,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
           </button>
         </td>
         <td
+          className=
+
+              {
+                padding-bottom: 0px;
+                padding-left: 0px;
+                padding-right: 0px;
+                padding-top: 0px;
+              }
           role="presentation"
-          style={
-            Object {
-              "padding": "0px",
-            }
-          }
         >
           <button
             aria-describedby={null}
@@ -1492,12 +1519,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
         role="row"
       >
         <td
+          className=
+
+              {
+                padding-bottom: 0px;
+                padding-left: 0px;
+                padding-right: 0px;
+                padding-top: 0px;
+              }
           role="presentation"
-          style={
-            Object {
-              "padding": "0px",
-            }
-          }
         >
           <button
             aria-describedby={null}
@@ -1673,12 +1703,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
           </button>
         </td>
         <td
+          className=
+
+              {
+                padding-bottom: 0px;
+                padding-left: 0px;
+                padding-right: 0px;
+                padding-top: 0px;
+              }
           role="presentation"
-          style={
-            Object {
-              "padding": "0px",
-            }
-          }
         >
           <button
             aria-describedby={null}
@@ -1854,12 +1887,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
           </button>
         </td>
         <td
+          className=
+
+              {
+                padding-bottom: 0px;
+                padding-left: 0px;
+                padding-right: 0px;
+                padding-top: 0px;
+              }
           role="presentation"
-          style={
-            Object {
-              "padding": "0px",
-            }
-          }
         >
           <button
             aria-describedby={null}
@@ -2035,12 +2071,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
           </button>
         </td>
         <td
+          className=
+
+              {
+                padding-bottom: 0px;
+                padding-left: 0px;
+                padding-right: 0px;
+                padding-top: 0px;
+              }
           role="presentation"
-          style={
-            Object {
-              "padding": "0px",
-            }
-          }
         >
           <button
             aria-describedby={null}
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.base.tsx b/packages/office-ui-fabric-react/src/utilities/grid/Grid.base.tsx
new file mode 100644
index 0000000000000..011a6712bd5e4
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.base.tsx
@@ -0,0 +1,84 @@
+import * as React from 'react';
+import {
+  BaseComponent,
+  getId,
+  toMatrix,
+  classNamesFunction
+} from '../../Utilities';
+import { FocusZone } from '../../FocusZone';
+import { IGrid, IGridProps, IGridStyleProps, IGridStyles } from './Grid.types';
+
+const getClassNames = classNamesFunction<IGridStyleProps, IGridStyles>();
+
+export class GridBase extends BaseComponent<IGridProps, {}> implements IGrid {
+
+  private _id: string;
+
+  constructor(props: IGridProps) {
+    super(props);
+    this._id = getId();
+  }
+
+  public render() {
+    let {
+      items,
+      columnCount,
+      onRenderItem,
+      positionInSet,
+      setSize,
+      getStyles
+    } = this.props;
+
+    const classNames = getClassNames(getStyles!, { theme: this.props.theme! });
+
+    // Array to store the cells in the correct row index
+    let rowsOfItems: any[][] = toMatrix(items, columnCount);
+
+    let content = (
+      <table
+        id={ this._id }
+        role={ 'grid' }
+        aria-posinset={ positionInSet }
+        aria-setsize={ setSize }
+        className={ classNames.root }
+      >
+        <tbody>
+          {
+            rowsOfItems.map((rows: any[], rowIndex) => {
+              return (
+                <tr
+                  role={ 'row' }
+                  key={ this._id + '-' + rowIndex + '-row' }
+                >
+                  { rows.map((cell, cellIndex) => {
+                    return (
+                      <td
+                        role={ 'presentation' }
+                        key={ this._id + '-' + cellIndex + '-cell' }
+                        className={ classNames.tableCell }
+                      >
+                        { onRenderItem(cell, cellIndex) }
+                      </td>
+                    );
+                  }) }
+                </tr>
+              );
+            })
+          }
+        </tbody>
+      </table >
+    );
+
+    // Create the table/grid
+    return (
+      this.props.doNotContainWithinFocusZone ? content : (
+        <FocusZone
+          isCircularNavigation={ this.props.shouldFocusCircularNavigate }
+          className={ classNames.focusedContainer }
+          onBlur={ this.props.onBlur }
+        >
+          { content }
+        </FocusZone>
+      ));
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.styles.ts b/packages/office-ui-fabric-react/src/utilities/grid/Grid.styles.ts
new file mode 100644
index 0000000000000..48e96fa1ac31c
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.styles.ts
@@ -0,0 +1,13 @@
+import { IGridStyleProps, IGridStyles } from './Grid.types';
+
+export const getStyles = (props: IGridStyleProps): IGridStyles => {
+  return {
+    root: {
+      padding: 2,
+      outline: 'none'
+    },
+    tableCell: {
+      padding: 0
+    }
+  };
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx b/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx
index 8d200cb2b1fc8..1f0281f717e6d 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx
@@ -2,7 +2,8 @@
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
-import { Grid } from './Grid';
+import { GridBase } from './Grid.base';
+import { getStyles } from './Grid.styles';
 import { DefaultButton } from '../../Button';
 import { shallow } from 'enzyme';
 
@@ -21,9 +22,10 @@ describe('Grid', () => {
 
   it('Can render a grid with width of four', () => {
     let wrapper = shallow(
-      <Grid
+      <GridBase
         items={ DEFAULT_ITEMS }
         columnCount={ 4 }
+        getStyles={ getStyles }
         // tslint:disable-next-line:jsx-no-lambda
         onRenderItem={ (item: any, index: number) => { return <DefaultButton role='gridcell'>item.text</DefaultButton>; } }
       />
@@ -36,9 +38,10 @@ describe('Grid', () => {
   });
   it('Can render a grid with width of 2', () => {
     let wrapper = shallow(
-      <Grid
+      <GridBase
         items={ DEFAULT_ITEMS }
         columnCount={ 2 }
+        getStyles={ getStyles }
         // tslint:disable-next-line:jsx-no-lambda
         onRenderItem={ (item: any, index: number) => { return <DefaultButton role='gridcell'>item.text</DefaultButton>; } }
       />
@@ -51,9 +54,10 @@ describe('Grid', () => {
   });
   it('Can render a grid with posInSet and setSize', () => {
     let wrapper = shallow(
-      <Grid
+      <GridBase
         items={ DEFAULT_ITEMS }
         columnCount={ 2 }
+        getStyles={ getStyles }
         // tslint:disable-next-line:jsx-no-lambda
         onRenderItem={ (item: any, index: number) => { return <DefaultButton role='gridcell'>item.text</DefaultButton>; } }
         positionInSet={ 1 }
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx b/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
index 017e559b1afd2..503908da33ba2 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
@@ -1,78 +1,12 @@
 import * as React from 'react';
 import {
-  BaseComponent,
-  getId,
-  toMatrix
+  styled
 } from '../../Utilities';
-import { FocusZone } from '../../FocusZone';
+import { GridBase } from './Grid.base';
 import { IGridProps } from './Grid.types';
+import { getStyles } from './Grid.styles';
 
-export class Grid extends BaseComponent<IGridProps, {}> {
-
-  private _id: string;
-
-  constructor(props: IGridProps) {
-    super(props);
-    this._id = getId();
-  }
-
-  public render() {
-    let {
-      items,
-      columnCount,
-      onRenderItem,
-      positionInSet,
-      setSize
-    } = this.props;
-
-    // Array to store the cells in the correct row index
-    let rowsOfItems: any[][] = toMatrix(items, columnCount);
-
-    let content = (
-      <table
-        id={ this._id }
-        role={ 'grid' }
-        aria-posinset={ positionInSet }
-        aria-setsize={ setSize }
-        style={ { padding: '2px', outline: 'none' } }
-      >
-        <tbody>
-          {
-            rowsOfItems.map((rows: any[], rowIndex) => {
-              return (
-                <tr
-                  role={ 'row' }
-                  key={ this._id + '-' + rowIndex + '-row' }
-                >
-                  { rows.map((cell, cellIndex) => {
-                    return (
-                      <td
-                        role={ 'presentation' }
-                        key={ this._id + '-' + cellIndex + '-cell' }
-                        style={ { padding: '0px' } }
-                      >
-                        { onRenderItem(cell, cellIndex) }
-                      </td>
-                    );
-                  }) }
-                </tr>
-              );
-            })
-          }
-        </tbody>
-      </table>
-    );
-
-    // Create the table/grid
-    return (
-      this.props.doNotContainWithinFocusZone ? content : (
-        <FocusZone
-          isCircularNavigation={ this.props.shouldFocusCircularNavigate }
-          className={ this.props.containerClassName }
-          onBlur={ this.props.onBlur }
-        >
-          { content }
-        </FocusZone>
-      ));
-  }
-}
\ No newline at end of file
+export const Grid = styled(
+  GridBase,
+  getStyles
+);
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.types.ts b/packages/office-ui-fabric-react/src/utilities/grid/Grid.types.ts
index 367b9b8263068..5c3b9d5e1764c 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.types.ts
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.types.ts
@@ -1,8 +1,13 @@
+import { IStyle, ITheme } from '../../Styling';
+import { IStyleFunction } from '../../Utilities';
+
+export interface IGrid { }
+
 export interface IGridProps {
   /**
    * Gets the component ref.
    */
-  componentRef?: () => void;
+  componentRef?: (componentRef?: IGrid) => void;
 
   /**
    * The items to turn into a grid
@@ -33,6 +38,8 @@ export interface IGridProps {
 
   /**
    * Optional, class name for the FocusZone container for the grid
+   * @deprecated Use getStyles and IGridStyles to define a styling for the focus zone container with
+   * focusedContainer property.
    */
   containerClassName?: string;
 
@@ -50,4 +57,44 @@ export interface IGridProps {
    * The optional size of the parent set (size of parent menu, for example)
    */
   setSize?: number;
+
+  /**
+   * Theme to apply to the component.
+   */
+  theme?: ITheme;
+
+  /**
+ * Optional styles for the component.
+ */
+  getStyles?: IStyleFunction<IGridStyleProps, IGridStyles>;
+}
+
+/**
+ * Properties required to build the styles for the grid component.
+ */
+export interface IGridStyleProps {
+  /**
+  * Theme to apply to the grid
+  */
+  theme: ITheme;
+}
+
+/**
+ * Styles for the Grid Component.
+ */
+export interface IGridStyles {
+  /**
+   * Style for the table container of a grid.
+   */
+  root: IStyle;
+
+  /**
+   * Style for the table cells of the grid.
+   */
+  tableCell: IStyle;
+
+  /**
+   * Optional, style for the FocusZone container for the grid
+   */
+  focusedContainer?: IStyle;
 }
\ No newline at end of file

From de81641c99ca70198e611b5e8a5178d81c9c540f Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 21 Dec 2017 11:23:03 +0000
Subject: [PATCH 1171/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../law-fix_amdgraph_2017-12-21-00-00.json    | 11 ----------
 ...no-GridCustomStyling_2017-12-20-23-07.json | 11 ----------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 21 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 13 +++++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 11 files changed, 40 insertions(+), 30 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/law-fix_amdgraph_2017-12-21-00-00.json
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-GridCustomStyling_2017-12-20-23-07.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index af78b8eb2f04e..d2f0c234ae41b 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.34.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.35.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 732b171b31ab5..b9f2722b21b13 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.34.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.35.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 8c8e70c5f75fb..41cb7568dd8e6 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.34.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.35.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 95dee2daabe92..2f231433c07d1 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.34.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.35.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 4fa6cdc1537fe..c522072ef72bf 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.34.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.35.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/office-ui-fabric-react/law-fix_amdgraph_2017-12-21-00-00.json b/common/changes/office-ui-fabric-react/law-fix_amdgraph_2017-12-21-00-00.json
deleted file mode 100644
index a29ee2902e0a3..0000000000000
--- a/common/changes/office-ui-fabric-react/law-fix_amdgraph_2017-12-21-00-00.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixed persona import paths",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/malozano-GridCustomStyling_2017-12-20-23-07.json b/common/changes/office-ui-fabric-react/malozano-GridCustomStyling_2017-12-20-23-07.json
deleted file mode 100644
index 54c94c951c2d9..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-GridCustomStyling_2017-12-20-23-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Grid: Enable styling customization to grid through getStyles",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 18302a8ae339b..6ac29d7bbc0ff 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.34.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.35.0 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 5d60ab147f04e..97fcd6c96be22 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,27 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.35.0",
+      "tag": "office-ui-fabric-react_v5.35.0",
+      "date": "Thu, 21 Dec 2017 11:23:03 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "fc376bb77449323463cf80b52b69fb35aa9b9f92",
+            "comment": "Fixed persona import paths"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "e6eee8b4f76967676cc05a8da247589c10f764ff",
+            "comment": "Grid: Enable styling customization to grid through getStyles"
+          }
+        ]
+      }
+    },
     {
       "version": "5.34.3",
       "tag": "office-ui-fabric-react_v5.34.3",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 56bce1ff506fe..68c3844777b22 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 20 Dec 2017 11:21:48 GMT and should not be manually modified.
+This log was last generated on Thu, 21 Dec 2017 11:23:03 GMT and should not be manually modified.
+
+## 5.35.0
+Thu, 21 Dec 2017 11:23:03 GMT
+
+### Minor changes
+
+- Grid: Enable styling customization to grid through getStyles
+
+### Patches
+
+- Fixed persona import paths
 
 ## 5.34.3
 Wed, 20 Dec 2017 11:21:48 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index a3ce99685a5e0..bd3c60b647af8 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.34.3",
+  "version": "5.35.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 1cbf872fe8f2feac82a8c2566dfd19b20be7d191 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Thu, 21 Dec 2017 08:44:02 -0800
Subject: [PATCH 1172/1641] Website: More descriptive comments about UHF
 specificity (#3580)

* More specific comments about UHF variables

* Typography variable comment added to pagestyles

* Added change file

* Typo
---
 apps/fabric-website/src/components/Nav/Nav.types.ts   |  2 ++
 apps/fabric-website/src/pages/PageStyles.module.scss  |  2 ++
 apps/fabric-website/src/styles/_variables.scss        |  9 ++++++---
 .../fabric-website/uhf-comments_2017-12-14-19-19.json | 11 +++++++++++
 4 files changed, 21 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/uhf-comments_2017-12-14-19-19.json

diff --git a/apps/fabric-website/src/components/Nav/Nav.types.ts b/apps/fabric-website/src/components/Nav/Nav.types.ts
index 6a784cae26007..77e77b8c876fa 100644
--- a/apps/fabric-website/src/components/Nav/Nav.types.ts
+++ b/apps/fabric-website/src/components/Nav/Nav.types.ts
@@ -56,6 +56,8 @@ export interface INavPage {
 
   /**
    * Whether this link appears in the UHF header nav.
+   * This flag is different from isHiddenFromMainNav because we want the UHF link's childLinks to be rendered.
+   * isHiddenFromMainNav will not render childLinks.
    * @default false
    */
   isUhfLink?: boolean;
diff --git a/apps/fabric-website/src/pages/PageStyles.module.scss b/apps/fabric-website/src/pages/PageStyles.module.scss
index 497dc1de43973..2241a0dbad562 100644
--- a/apps/fabric-website/src/pages/PageStyles.module.scss
+++ b/apps/fabric-website/src/pages/PageStyles.module.scss
@@ -1,6 +1,8 @@
 @import '../styles/variables';
 
 .basePage {
+  // Typography values are set in _typography.scss,
+  // but they sometimes need to be added to more specific selectors throughout the website because of UHF
   h2 {
     margin: $uhf-h2-margin;
   }
diff --git a/apps/fabric-website/src/styles/_variables.scss b/apps/fabric-website/src/styles/_variables.scss
index 6b468b077240b..bff860e6ce658 100644
--- a/apps/fabric-website/src/styles/_variables.scss
+++ b/apps/fabric-website/src/styles/_variables.scss
@@ -41,7 +41,7 @@ $color-blog-lighter: #d1ec3c;
 // Component variables
 $App-maximumWidth: 1600px;
 
-//Padding matches padding at the same UHF breakpoints
+// Padding matches padding used by UHF at the same (lg / sm) UHF breakpoints
 $App-padding-left-lg: 5%;
 $App-padding-right-lg: 5%;
 $App-padding-left-sm: 6px;
@@ -92,14 +92,17 @@ $contentMargin-vertical: 16px; // Consistent spacing across pages for titles and
 $titleMargin-vertical: 32px; // Consistent spacing across pages for titles and descriptions
 
 // Screen sizes that align with UHF breakpoints
+// They differ from Fabric Core breakpoints
 $uhf-screen-min-mobile: 768px;
 $uhf-screen-max-mobile: ($uhf-screen-min-mobile - 1);
 $uhf-screen-max-lg: 1083px;
 
-// These variables assist with overriding UHF styles
+// These variables assist with overriding UHF typography styles
+// Typography values are set in _typography.scss,
+// but they sometimes need to be added to more specific selectors throughout the website because of UHF
 $uhf-h3-margin: 40px 0 8px 0;
 $uhf-h2-margin: 48px 0 4px 0;
 $uhf-h4-margin: 8px 0;
 $uhf-p-margin-bottom: 12px;
 
-$baseURL: ' https://static2.sharepointonline.com/files/fabric/';
\ No newline at end of file
+$baseURL: ' https://static2.sharepointonline.com/files/fabric/';
diff --git a/common/changes/@uifabric/fabric-website/uhf-comments_2017-12-14-19-19.json b/common/changes/@uifabric/fabric-website/uhf-comments_2017-12-14-19-19.json
new file mode 100644
index 0000000000000..48ff4a7d8ce23
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/uhf-comments_2017-12-14-19-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Added more descriptive comments to account for the specificity needed to style with the UHF.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From e963ea8a58939b8a567beaff361ed3292a257cbd Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Thu, 21 Dec 2017 14:58:30 -0800
Subject: [PATCH 1173/1641] Calendar (bug fix): fixing scrollbar issue that
 occurs with Go to today button (#3531)

* no message

* no message

* Add fix for today button issue

* Adding change file
---
 ...gorr-Calendar-TodayButtonFix_2017-12-06-18-47.json | 11 +++++++++++
 .../src/components/Calendar/Calendar.scss             |  6 ++++++
 .../src/components/Calendar/Calendar.tsx              |  3 ++-
 .../src/components/Calendar/CalendarPage.tsx          | 10 ++++++++++
 .../Calendar/examples/Calendar.Button.Example.tsx     |  7 ++++++-
 5 files changed, 35 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-Calendar-TodayButtonFix_2017-12-06-18-47.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-Calendar-TodayButtonFix_2017-12-06-18-47.json b/common/changes/office-ui-fabric-react/kegorr-Calendar-TodayButtonFix_2017-12-06-18-47.json
new file mode 100644
index 0000000000000..c5a4c5c1f5621
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-Calendar-TodayButtonFix_2017-12-06-18-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Calendar: Fix scrollbar when today button is added to overlayed calendars",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
index be5d577f44230..14ea137ae4bf6 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
@@ -543,6 +543,12 @@ $Calendar-dayPicker-margin: 10px;
     }
     .holder {
       height: 240px;
+      min-height: 240px;
+    }
+
+    .holderWithButton{
+      padding-top:6px;
+      height: auto;
     }
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index 1810f58171d28..637d6cd4da094 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -123,6 +123,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     let { selectedDate, navigatedDate, isMonthPickerVisible, isDayPickerVisible } = this.state;
     let onHeaderSelect = showMonthPickerAsOverlay ? this._onHeaderSelect : undefined;
     let monthPickerOnly = !showMonthPickerAsOverlay && !isDayPickerVisible;
+    let overlayedWithButton = showMonthPickerAsOverlay && showGoToToday;
 
     return (
       <div className={ css(rootClass, styles.root) } ref='root' role='application'>
@@ -138,7 +139,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
             showMonthPickerAsOverlay && ('ms-DatePicker-monthPickerAsOverlay ' + styles.monthPickerAsOverlay),
           ) }
         >
-          <div className={ css('ms-DatePicker-holder ms-slideDownIn10', styles.holder) } onKeyDown={ this._onDatePickerPopupKeyDown }>
+          <div className={ css('ms-DatePicker-holder ms-slideDownIn10', styles.holder, overlayedWithButton && styles.holderWithButton) } onKeyDown={ this._onDatePickerPopupKeyDown }>
             <div className={ css('ms-DatePicker-frame', styles.frame) }>
               <div className={ css('ms-DatePicker-wrap', styles.wrap, showGoToToday && styles.goTodaySpacing) }>
                 { isDayPickerVisible && <CalendarDay
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
index 333b23b35b22a..ce080fbc14e02 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
@@ -135,6 +135,16 @@ export class CalendarPage extends React.Component<IComponentDemoPageProps, any>
                 buttonString={ 'Click for Month Picker' }
               />
             </ExampleCard>
+            <ExampleCard
+              title='Calendar with overlayed month picker launched from a button'
+              code={ CalendarButtonExampleCode }
+            >
+              <CalendarButtonExample
+                showMonthPickerAsOverlay={ true }
+                highlightCurrentMonth={ true }
+                buttonString={ 'Click for Overlayed Day Picker and Month Picker' }
+              />
+            </ExampleCard>
           </div>
         }
         propertiesTables={
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
index ff579f86070af..0bfa49659fd2d 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Button.Example.tsx
@@ -67,13 +67,17 @@ export interface ICalendarButtonExampleState {
 
 export interface ICalendarButtonExampleProps {
   isDayPickerVisible?: boolean;
+  isMonthPickerVisible?: boolean;
   highlightCurrentMonth?: boolean;
   buttonString?: string;
+  showMonthPickerAsOverlay?: boolean;
 }
 
 export class CalendarButtonExample extends React.Component<ICalendarButtonExampleProps, ICalendarButtonExampleState> {
   public static defaultProps: ICalendarButtonExampleProps = {
+    showMonthPickerAsOverlay: false,
     isDayPickerVisible: true,
+    isMonthPickerVisible: true,
     buttonString: 'Click for Calendar'
   };
 
@@ -115,12 +119,13 @@ export class CalendarButtonExample extends React.Component<ICalendarButtonExampl
             <Calendar
               onSelectDate={ this._onSelectDate }
               onDismiss={ this._onDismiss }
-              isMonthPickerVisible={ true }
+              isMonthPickerVisible={ this.props.isMonthPickerVisible }
               value={ this.state.selectedDate! }
               firstDayOfWeek={ DayOfWeek.Sunday }
               strings={ DayPickerStrings }
               isDayPickerVisible={ this.props.isDayPickerVisible }
               highlightCurrentMonth={ this.props.highlightCurrentMonth }
+              showMonthPickerAsOverlay={ this.props.showMonthPickerAsOverlay }
             />
           </Callout>
         )

From cc4f4e4dae7ee5d3c075a078f0c3ec4ac871496e Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Thu, 21 Dec 2017 16:07:21 -0800
Subject: [PATCH 1174/1641] ExpandingCard: Fix callout opacity (#3617)

* fix expanding card and callout opacity in edge

* adding change file

* update callout snapshot
---
 .../fix-calloutopacity-inedge_2017-12-21-00-33.json   | 11 +++++++++++
 .../src/components/Callout/CalloutContent.tsx         |  5 ++++-
 .../Callout/__snapshots__/Callout.test.tsx.snap       |  1 +
 3 files changed, 16 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-calloutopacity-inedge_2017-12-21-00-33.json

diff --git a/common/changes/office-ui-fabric-react/fix-calloutopacity-inedge_2017-12-21-00-33.json b/common/changes/office-ui-fabric-react/fix-calloutopacity-inedge_2017-12-21-00-33.json
new file mode 100644
index 0000000000000..ca3181475440f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-calloutopacity-inedge_2017-12-21-00-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Callout: Fix opacity when class name has animation that involves opacity",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index 800678eacf443..32f2c03cc1d05 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -30,7 +30,10 @@ import { AnimationClassNames, mergeStyles } from '../../Styling';
 const styles: any = stylesImport;
 
 const BEAK_ORIGIN_POSITION = { top: 0, left: 0 };
-const OFF_SCREEN_STYLE = { opacity: 0 };
+// Microsoft Edge will overwrite inline styles if there is an animation pertaining to that style.
+// To help ensure that edge will respect the offscreen style opacity
+// filter needs to be added as an additional way to set opacity.
+const OFF_SCREEN_STYLE = { opacity: 0, filter: 'opacity(0)' };
 const BORDER_WIDTH: number = 1;
 const SLIDE_ANIMATIONS: { [key: number]: string; } = {
   [RectangleEdge.top]: 'slideUpIn20',
diff --git a/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
index 4f649424e81dc..235c704d0d271 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
@@ -8,6 +8,7 @@ exports[`Callout renders Callout correctly 1`] = `
     className="ms-Callout"
     style={
       Object {
+        "filter": "opacity(0)",
         "opacity": 0,
       }
     }

From 8c0b717e51bb704e4608fa05e358bb7dfab22c4f Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 22 Dec 2017 11:10:56 +0000
Subject: [PATCH 1175/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 19 +++++++++++++++++++
 apps/fabric-website/CHANGELOG.md              |  9 ++++++++-
 apps/fabric-website/package.json              |  4 ++--
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../uhf-comments_2017-12-14-19-19.json        | 11 -----------
 ...alloutopacity-inedge_2017-12-21-00-33.json | 11 -----------
 ...endar-TodayButtonFix_2017-12-06-18-47.json | 11 -----------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 14 files changed, 63 insertions(+), 43 deletions(-)
 delete mode 100644 common/changes/@uifabric/fabric-website/uhf-comments_2017-12-14-19-19.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-calloutopacity-inedge_2017-12-21-00-33.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-Calendar-TodayButtonFix_2017-12-06-18-47.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index d50a93f8dc392..ed9f302601f33 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.2.1",
+      "tag": "@uifabric/fabric-website_v5.2.1",
+      "date": "Fri, 22 Dec 2017 11:10:56 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "1cbf872fe8f2feac82a8c2566dfd19b20be7d191",
+            "comment": "Added more descriptive comments to account for the specificity needed to style with the UHF."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.35.0 <6.0.0` to `>=5.35.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.2.0",
       "tag": "@uifabric/fabric-website_v5.2.0",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 2869f5ba757b1..d976af8115344 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Sat, 16 Dec 2017 05:07:22 GMT and should not be manually modified.
+This log was last generated on Fri, 22 Dec 2017 11:10:56 GMT and should not be manually modified.
+
+## 5.2.1
+Fri, 22 Dec 2017 11:10:56 GMT
+
+### Patches
+
+- Added more descriptive comments to account for the specificity needed to style with the UHF.
 
 ## 5.2.0
 Sat, 16 Dec 2017 05:07:22 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index d2f0c234ae41b..343a861b89efc 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.2.0",
+  "version": "5.2.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.35.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.35.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index b9f2722b21b13..a392e640fd002 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.35.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.35.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 41cb7568dd8e6..83d6736e99397 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.35.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.35.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 2f231433c07d1..7cdabe707a5bd 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.35.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.35.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index c522072ef72bf..39254818d39fc 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.35.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.35.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/@uifabric/fabric-website/uhf-comments_2017-12-14-19-19.json b/common/changes/@uifabric/fabric-website/uhf-comments_2017-12-14-19-19.json
deleted file mode 100644
index 48ff4a7d8ce23..0000000000000
--- a/common/changes/@uifabric/fabric-website/uhf-comments_2017-12-14-19-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Added more descriptive comments to account for the specificity needed to style with the UHF.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-calloutopacity-inedge_2017-12-21-00-33.json b/common/changes/office-ui-fabric-react/fix-calloutopacity-inedge_2017-12-21-00-33.json
deleted file mode 100644
index ca3181475440f..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-calloutopacity-inedge_2017-12-21-00-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Callout: Fix opacity when class name has animation that involves opacity",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kegorr-Calendar-TodayButtonFix_2017-12-06-18-47.json b/common/changes/office-ui-fabric-react/kegorr-Calendar-TodayButtonFix_2017-12-06-18-47.json
deleted file mode 100644
index c5a4c5c1f5621..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-Calendar-TodayButtonFix_2017-12-06-18-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Calendar: Fix scrollbar when today button is added to overlayed calendars",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 6ac29d7bbc0ff..42d4b0e7667c6 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.35.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.35.1 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 97fcd6c96be22..1dc63e1da933e 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.35.1",
+      "tag": "office-ui-fabric-react_v5.35.1",
+      "date": "Fri, 22 Dec 2017 11:10:56 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "cc4f4e4dae7ee5d3c075a078f0c3ec4ac871496e",
+            "comment": "Callout: Fix opacity when class name has animation that involves opacity"
+          },
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "e963ea8a58939b8a567beaff361ed3292a257cbd",
+            "comment": "Calendar: Fix scrollbar when today button is added to overlayed calendars"
+          }
+        ]
+      }
+    },
     {
       "version": "5.35.0",
       "tag": "office-ui-fabric-react_v5.35.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 68c3844777b22..7691194f0d792 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 21 Dec 2017 11:23:03 GMT and should not be manually modified.
+This log was last generated on Fri, 22 Dec 2017 11:10:56 GMT and should not be manually modified.
+
+## 5.35.1
+Fri, 22 Dec 2017 11:10:56 GMT
+
+### Patches
+
+- Callout: Fix opacity when class name has animation that involves opacity
+- Calendar: Fix scrollbar when today button is added to overlayed calendars
 
 ## 5.35.0
 Thu, 21 Dec 2017 11:23:03 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index bd3c60b647af8..3397507debf12 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.35.0",
+  "version": "5.35.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 58f68a474e62a012882d34cf5f4387fd8fefde53 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Fri, 22 Dec 2017 16:10:11 -0800
Subject: [PATCH 1176/1641] Spinbutton value check (#3624)

* Fix falsey check for value and add test

* Add change file

* Remove blank line to fix tslint build error
---
 ...inbutton-value-check_2017-12-22-01-39.json | 11 ++++++++
 .../components/SpinButton/SpinButton.test.tsx | 27 +++++++++++++++++++
 .../src/components/SpinButton/SpinButton.tsx  |  2 +-
 3 files changed, 39 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/spinbutton-value-check_2017-12-22-01-39.json

diff --git a/common/changes/office-ui-fabric-react/spinbutton-value-check_2017-12-22-01-39.json b/common/changes/office-ui-fabric-react/spinbutton-value-check_2017-12-22-01-39.json
new file mode 100644
index 0000000000000..4b57784f4591a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/spinbutton-value-check_2017-12-22-01-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SpinButton: Fix falsey check for value so custom handlers work even if value is 0",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "erabelle@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
index 4a8cee61cb9bd..095d02bb483f0 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
@@ -617,4 +617,31 @@ describe('SpinButton', () => {
     let newCurrentValue = inputDOM.value;
     expect(currentValue).toEqual(newCurrentValue);
   });
+
+  it('should fire custom handlers even when value prop is 0', () => {
+    const val: string = 0 as any;
+    const onIncrement: jest.Mock = jest.fn();
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <SpinButton
+        label='label'
+        value={ val }
+        onIncrement={ onIncrement }
+      />
+    );
+
+    // Assert on the input element.
+    const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
+    const buttonDOM: Element = renderedDOM.getElementsByClassName('ms-UpButton')[0];
+
+    ReactTestUtils.Simulate.mouseDown(buttonDOM,
+      {
+        type: 'mousedown',
+        clientX: 0,
+        clientY: 0
+      }
+    );
+
+    expect(onIncrement).toBeCalled();
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index 0e2e0a38e9e40..43d76e8e109d2 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -91,7 +91,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
     this._inputId = getId('input');
     this._spinningByMouse = false;
 
-    if (!props.defaultValue && props.value) {
+    if (!props.defaultValue && props.value !== undefined) {
       this._onValidate = props.onValidate;
       this._onIncrement = props.onIncrement;
       this._onDecrement = props.onDecrement;

From 404d663cd52c79b56d0904678e744b1201f0316b Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 25 Dec 2017 11:13:32 +0000
Subject: [PATCH 1177/1641] Applying package updates.

---
 apps/fabric-website/package.json                   |  2 +-
 apps/ssr-tests/package.json                        |  2 +-
 apps/test-bundle-button/package.json               |  2 +-
 apps/todo-app/package.json                         |  2 +-
 apps/vr-tests/package.json                         |  2 +-
 .../spinbutton-value-check_2017-12-22-01-39.json   | 11 -----------
 packages/experiments/package.json                  |  2 +-
 packages/office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md       |  9 ++++++++-
 packages/office-ui-fabric-react/package.json       |  2 +-
 10 files changed, 29 insertions(+), 19 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/spinbutton-value-check_2017-12-22-01-39.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 343a861b89efc..0d18651a47f1c 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.35.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.35.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index a392e640fd002..e02ad1fa0623d 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.35.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.35.2 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 83d6736e99397..860a0f8fe57a5 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.35.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.35.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 7cdabe707a5bd..d6e19720af377 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.35.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.35.2 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 39254818d39fc..556187420787a 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.35.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.35.2 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/office-ui-fabric-react/spinbutton-value-check_2017-12-22-01-39.json b/common/changes/office-ui-fabric-react/spinbutton-value-check_2017-12-22-01-39.json
deleted file mode 100644
index 4b57784f4591a..0000000000000
--- a/common/changes/office-ui-fabric-react/spinbutton-value-check_2017-12-22-01-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SpinButton: Fix falsey check for value so custom handlers work even if value is 0",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "erabelle@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 42d4b0e7667c6..44d5199b4d1d7 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.35.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.35.2 <6.0.0",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 1dc63e1da933e..6ff09e7f4fce8 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.35.2",
+      "tag": "office-ui-fabric-react_v5.35.2",
+      "date": "Mon, 25 Dec 2017 11:13:32 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "58f68a474e62a012882d34cf5f4387fd8fefde53",
+            "comment": "SpinButton: Fix falsey check for value so custom handlers work even if value is 0"
+          }
+        ]
+      }
+    },
     {
       "version": "5.35.1",
       "tag": "office-ui-fabric-react_v5.35.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 7691194f0d792..bd239e64abf7a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 22 Dec 2017 11:10:56 GMT and should not be manually modified.
+This log was last generated on Mon, 25 Dec 2017 11:13:32 GMT and should not be manually modified.
+
+## 5.35.2
+Mon, 25 Dec 2017 11:13:32 GMT
+
+### Patches
+
+- SpinButton: Fix falsey check for value so custom handlers work even if value is 0
 
 ## 5.35.1
 Fri, 22 Dec 2017 11:10:56 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 3397507debf12..7e11d8f64d41c 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.35.1",
+  "version": "5.35.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From e5c7d91dff4a37f5d6dabe3ac461afd644804d37 Mon Sep 17 00:00:00 2001
From: Jakob Werner <jaxxx_w@yahoo.com>
Date: Wed, 27 Dec 2017 19:14:00 +0100
Subject: [PATCH 1178/1641] [Merge styles]: Add a setting to change the default
 prefix (#3584)

* [MergeStyles] Added an option to Stylesheet to define the default prefix

* Changefile

* Update Stylesheet.test.ts
---
 .../mergeStyles_2017-12-15-14-15.json         | 11 ++++++++++
 packages/merge-styles/src/Stylesheet.test.ts  | 22 +++++++++++++++++++
 packages/merge-styles/src/Stylesheet.ts       |  7 +++++-
 3 files changed, 39 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/merge-styles/mergeStyles_2017-12-15-14-15.json
 create mode 100644 packages/merge-styles/src/Stylesheet.test.ts

diff --git a/common/changes/@uifabric/merge-styles/mergeStyles_2017-12-15-14-15.json b/common/changes/@uifabric/merge-styles/mergeStyles_2017-12-15-14-15.json
new file mode 100644
index 0000000000000..ab29f924cc990
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/mergeStyles_2017-12-15-14-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "Added a setting to Stylesheet which allows overriding the default prefix",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "jawerne@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/merge-styles/src/Stylesheet.test.ts b/packages/merge-styles/src/Stylesheet.test.ts
new file mode 100644
index 0000000000000..cdc9f0c02bc50
--- /dev/null
+++ b/packages/merge-styles/src/Stylesheet.test.ts
@@ -0,0 +1,22 @@
+import {
+  InjectionMode,
+  Stylesheet
+} from './Stylesheet';
+
+import { styleToClassName } from './styleToClassName';
+
+const _stylesheet: Stylesheet = Stylesheet.getInstance();
+_stylesheet.setConfig({ injectionMode: InjectionMode.none, defaultPrefix: 'myCss' });
+
+describe('Stylesheet', () => {
+  beforeEach(() => {
+    _stylesheet.reset();
+  });
+
+  it('supports overriding the default prefix', () => {
+    const className = styleToClassName({ background: 'red' });
+
+    expect(className).toEqual('myCss-0');
+    expect(_stylesheet.getRules()).toEqual('.myCss-0{background:red;}');
+  });
+});
diff --git a/packages/merge-styles/src/Stylesheet.ts b/packages/merge-styles/src/Stylesheet.ts
index bc92184fc47d0..594a4acd03a14 100644
--- a/packages/merge-styles/src/Stylesheet.ts
+++ b/packages/merge-styles/src/Stylesheet.ts
@@ -31,6 +31,10 @@ export interface IStyleSheetConfig {
    * Injection mode for how rules are inserted.
    */
   injectionMode?: InjectionMode;
+  /**
+   * Falls back to "css".
+   */
+  defaultPrefix?: string;
   onInsertRule?: (rule: string) => void;
 }
 
@@ -78,6 +82,7 @@ export class Stylesheet {
   constructor(config?: IStyleSheetConfig) {
     this._config = {
       injectionMode: InjectionMode.insertNode,
+      defaultPrefix: 'css',
       ...config
     };
 
@@ -100,7 +105,7 @@ export class Stylesheet {
    * @param displayName - Optional value to use as a prefix.
    */
   public getClassName(displayName?: string): string {
-    const prefix = displayName || 'css';
+    const prefix = displayName || this._config.defaultPrefix;
 
     return `${prefix}-${this._counter++}`;
   }

From 4c523699e33d9e2c15d60d947f8f4017c48e00e2 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 27 Dec 2017 10:36:56 -0800
Subject: [PATCH 1179/1641] Searchbox get styles (#3616)

* Searchbox, first pass

* SearchBox getstyles

* Change files

* Cleaned up linting errors

* updates via PR feedback

* fixed linting errors

* Added snapshot test for search, fixed classnames
---
 .../searchbox-getStyles_2017-12-21-00-02.json |  11 +
 .../searchbox-getStyles_2017-12-21-00-02.json |  11 +
 .../components/SearchBox/SearchBox.base.tsx   | 205 ++++++++++++++++++
 .../src/components/SearchBox/SearchBox.scss   | 132 -----------
 .../components/SearchBox/SearchBox.styles.tsx | 142 ++++++++++++
 .../components/SearchBox/SearchBox.test.tsx   |  15 ++
 .../src/components/SearchBox/SearchBox.tsx    | 201 +----------------
 .../components/SearchBox/SearchBox.types.ts   |  27 +++
 .../__snapshots__/SearchBox.test.tsx.snap     | 110 ++++++++++
 .../src/interfaces/IAnimationStyles.ts        |   9 +
 packages/styling/src/interfaces/index.ts      |   2 +-
 .../styling/src/styles/AnimationStyles.ts     |  14 +-
 packages/styling/src/styles/GeneralStyles.ts  |  10 +
 packages/styling/src/styles/index.ts          |   3 +-
 14 files changed, 563 insertions(+), 329 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/searchbox-getStyles_2017-12-21-00-02.json
 create mode 100644 common/changes/office-ui-fabric-react/searchbox-getStyles_2017-12-21-00-02.json
 create mode 100644 packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.test.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
 create mode 100644 packages/styling/src/styles/GeneralStyles.ts

diff --git a/common/changes/@uifabric/styling/searchbox-getStyles_2017-12-21-00-02.json b/common/changes/@uifabric/styling/searchbox-getStyles_2017-12-21-00-02.json
new file mode 100644
index 0000000000000..e07477e3fcef2
--- /dev/null
+++ b/common/changes/@uifabric/styling/searchbox-getStyles_2017-12-21-00-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Adding new normalize and AnimationValues",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/searchbox-getStyles_2017-12-21-00-02.json b/common/changes/office-ui-fabric-react/searchbox-getStyles_2017-12-21-00-02.json
new file mode 100644
index 0000000000000..b8ca8aa5fec54
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/searchbox-getStyles_2017-12-21-00-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SearchBox: Converted component to getStyles",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
new file mode 100644
index 0000000000000..0f44432fdd15d
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
@@ -0,0 +1,205 @@
+import * as React from 'react';
+import { ISearchBoxProps, ISearchBoxStyleProps, ISearchBoxStyles } from './SearchBox.types';
+import {
+  BaseComponent,
+  autobind,
+  css,
+  getId,
+  KeyCodes,
+  customizable,
+  classNamesFunction
+} from '../../Utilities';
+
+import { IconButton } from '../../Button';
+import { Icon } from '../../Icon';
+
+import { FocusZone } from '../../FocusZone';
+
+const getClassNames = classNamesFunction<ISearchBoxStyleProps, ISearchBoxStyles>();
+
+export interface ISearchBoxState {
+  value?: string;
+  hasFocus?: boolean;
+  id?: string;
+}
+
+@customizable('SearchBox', ['theme'])
+export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxState> {
+  public static defaultProps: ISearchBoxProps = {
+    labelText: 'Search',
+  };
+
+  private _rootElement: HTMLElement;
+  private _inputElement: HTMLInputElement;
+  private _latestValue: string;
+
+  public constructor(props: ISearchBoxProps) {
+    super(props);
+
+    this.state = {
+      value: props.value || '',
+      hasFocus: false,
+      id: getId('SearchBox')
+    };
+  }
+
+  public componentWillReceiveProps(newProps: ISearchBoxProps) {
+    if (newProps.value !== undefined) {
+      this._latestValue = newProps.value;
+      this.setState({
+        value: newProps.value
+      });
+    }
+  }
+
+  public render() {
+    let { labelText, className, disabled, underlined, getStyles, theme } = this.props;
+    let { value, hasFocus, id } = this.state;
+
+    const classNames = getClassNames(getStyles!, { theme: theme!, underlined, hasFocus, disabled });
+
+    return (
+      <div
+        ref={ this._resolveRef('_rootElement') }
+        className={ css(className, classNames.root,
+          hasFocus && 'is-active',
+          disabled && 'is-disabled',
+          value!.length > 0 && 'can-clear',
+          underlined && 'is-underlined'
+        ) }
+        onFocusCapture={ this._onFocusCapture }
+      >
+        <div className={ classNames.iconContainer }>
+          <Icon className={ classNames.icon } iconName='Search' />
+        </div>
+        <input
+          id={ id }
+          className={ classNames.field }
+          placeholder={ labelText }
+          onChange={ this._onInputChange }
+          onInput={ this._onInputChange }
+          onKeyDown={ this._onKeyDown }
+          value={ value }
+          disabled={ this.props.disabled }
+          aria-label={ this.props.ariaLabel ? this.props.ariaLabel : this.props.labelText }
+          ref={ this._resolveRef('_inputElement') }
+        />
+        { value!.length > 0 &&
+          <div className={ classNames.clearButton }>
+            <IconButton styles={ { root: { height: 'auto' }, icon: { fontSize: '12px' } } } onClick={ this._onClearClick } iconProps={ { iconName: 'Clear' } } />
+          </div>
+        }
+      </div>
+    );
+  }
+
+  /**
+   * Sets focus to the search box input field
+   */
+  public focus() {
+    if (this._inputElement) {
+      this._inputElement.focus();
+    }
+  }
+
+  private _onClear(ev: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement> | React.KeyboardEvent<HTMLElement>) {
+    this.props.onClear && this.props.onClear(ev);
+    if (!ev.defaultPrevented) {
+      this._latestValue = '';
+      this.setState({
+        value: ''
+      });
+      this._callOnChange('');
+      ev.stopPropagation();
+      ev.preventDefault();
+
+      this._inputElement.focus();
+    }
+  }
+
+  @autobind
+  private _onFocusCapture(ev: React.FocusEvent<HTMLElement>) {
+    this.setState({
+      hasFocus: true
+    });
+
+    this._events.on(this._rootElement, 'blur', this._onBlur, true);
+
+    if (this.props.onFocus) {
+      this.props.onFocus(ev as React.FocusEvent<HTMLInputElement>);
+    }
+  }
+
+  @autobind
+  private _onClearClick(ev: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>) {
+    this._onClear(ev);
+  }
+
+  @autobind
+  private _onKeyDown(ev: React.KeyboardEvent<HTMLInputElement>) {
+
+    switch (ev.which) {
+
+      case KeyCodes.escape:
+        this.props.onEscape && this.props.onEscape(ev);
+        if (!ev.defaultPrevented) {
+          this._onClear(ev);
+        }
+        break;
+
+      case KeyCodes.enter:
+        if (this.props.onSearch && this.state.value!.length > 0) {
+          this.props.onSearch(this.state.value);
+        }
+        break;
+
+      default:
+        this.props.onKeyDown && this.props.onKeyDown(ev);
+        if (!ev.defaultPrevented) {
+          return;
+        }
+    }
+
+    // We only get here if the keypress has been handled,
+    // or preventDefault was called in case of default keyDown handler
+    ev.preventDefault();
+    ev.stopPropagation();
+  }
+
+  @autobind
+  private _onBlur(ev: React.FocusEvent<HTMLInputElement>) {
+    this._events.off(this._rootElement, 'blur');
+    this.setState({
+      hasFocus: false
+    });
+
+    if (this.props.onBlur) {
+      this.props.onBlur(ev);
+    }
+  }
+
+  @autobind
+  private _onInputChange(ev: React.ChangeEvent<HTMLInputElement>) {
+    const value = this._inputElement.value;
+    if (value === this._latestValue) {
+      return;
+    }
+    this._latestValue = value;
+
+    this.setState({ value });
+    this._callOnChange(value);
+  }
+
+  private _callOnChange(newValue: string): void {
+    let { onChange, onChanged } = this.props;
+
+    // Call @deprecated method.
+    if (onChanged) {
+      onChanged(newValue);
+    }
+
+    if (onChange) {
+      onChange(newValue);
+    }
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
deleted file mode 100644
index fb6d4bf5fe980..0000000000000
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.scss
+++ /dev/null
@@ -1,132 +0,0 @@
-@import '../../common/common';
-
-// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
-
-//
-// Office UI Fabric
-// --------------------------------------------------
-// Search box styles
-
-.root {
-  @include ms-font-m;
-  @include ms-normalize;
-  color: $ms-color-neutralPrimary;
-  display: flex;
-  flex-direction: row;
-  flex-wrap: nowrap;
-  align-items: stretch;
-  @include padding(0, 0, 0, 8px);
-  border: 1px solid $ms-color-neutralTertiary;
-  height: 32px;
-  @include high-contrast {
-    border: 1px solid WindowText;
-  }
-}
-
-.iconContainer {
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  flex-shrink: 0;
-  font-size: 16px;
-  width: 32px;
-  text-align: center;
-  transition: width $ms-animation-duration-1;
-  color: $ms-color-themePrimary;
-}
-
-.icon {
-  opacity: 1;
-  transition: opacity $ms-animation-duration-1 0s;
-}
-
-// Input Field
-.field {
-  @include ms-normalize;
-  border: none;
-  outline: none;
-  font-weight: inherit;
-  font-family: inherit;
-  font-size: inherit;
-  color: $ms-color-neutralPrimary;
-  background-color: transparent;
-  flex: 1 1 0px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  // This padding forces the text placement to round up.
-  padding-bottom: .5px;
-  // This removes the IE specific clear button in the input since we implimented our own
-  &::-ms-clear {
-    display: none;
-  }
-}
-
-.clearButton {
-  flex-direction: column;
-  justify-content: center;
-  display: none;
-  cursor: pointer;
-  text-align: center;
-  font-size: 12px;
-  flex-basis: 32px;
-  flex-shrink: 0;
-  color: $ms-color-themePrimary;
-}
-
-// Modifier: Inline searchbox
-.root.rootIsUnderlined {
-  border-width: 0px 0px 1px 0px;
-
-  &.rootIsDisabled {
-    background-color: transparent;
-  }
-}
-
-// State: Active searchbox
-.root.rootIsActive {
-  border-color: $ms-color-themePrimary;
-  &:hover {
-    border-color: $ms-color-themePrimary;
-  }
-  @include high-contrast {
-    border-color: Highlight;
-  }
-  .iconContainer {
-    width: 4px;
-    transition: width $ms-animation-duration-1;
-  }
-  .icon {
-    opacity: 0;
-    opacity: 0 0s $ms-animation-duration-1;
-   }
-}
-
- // State: Disabled searchbox
-.rootIsDisabled {
-  border-color: $ms-color-neutralLighter;
-  background-color: $ms-color-neutralLighter;
-  pointer-events: none;
-  cursor: default;
-  .iconContainer {
-    color: $ms-color-neutralTertiary;
-  }
-  .field {
-    color: $ms-color-neutralTertiary;
-  }
-}
-
-.rootCanClear .clearButton {
-  display: flex;
-}
-
-
-.root:hover {
-  border-color: $ms-color-neutralDark;
-  .label {
-    color: $ms-color-black;
-
-    .iconContainer {
-      color:$ms-color-themeDark;
-    }
-  }
-}
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx
new file mode 100644
index 0000000000000..645adee4b54d6
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx
@@ -0,0 +1,142 @@
+import {
+  FontSizes,
+  HighContrastSelector,
+  ScreenWidthMaxMedium,
+  ScreenWidthMaxSmall,
+  AnimationVariables,
+  normalize
+} from '../../Styling';
+import { SearchBoxBase } from './SearchBox.base';
+import { ISearchBoxProps, ISearchBoxStyleProps, ISearchBoxStyles } from './SearchBox.types';
+
+export function getStyles(props: ISearchBoxStyleProps): ISearchBoxStyles {
+  const { theme, underlined, disabled, hasFocus } = props;
+  const { palette, fonts } = theme;
+
+  return {
+    root: [
+      'ms-SearchBox',
+      fonts.medium,
+      normalize,
+      {
+        color: palette.neutralPrimary,
+        display: 'flex',
+        flexDirection: 'row',
+        flexWrap: 'nowrap',
+        alignItems: 'stretch',
+        padding: '0 0 0 8px',
+        border: `1px solid ${palette.neutralTertiary}`,
+        height: 32,
+        selectors: {
+          [HighContrastSelector]: {
+            border: '1px solid WindowText'
+          },
+          ':hover': {
+            borderColor: palette.neutralDark,
+            $label: {
+              color: palette.black,
+              $iconContainer: {
+                color: palette.themeDark
+              }
+            }
+          }
+        }
+      },
+      hasFocus && {
+        borderColor: palette.themePrimary,
+        selectors: {
+          ':hover': {
+            borderColor: palette.themePrimary,
+          },
+          [HighContrastSelector]: {
+            borderColor: 'Highlight'
+          }
+        }
+      },
+      disabled && {
+        borderColor: palette.neutralLighter,
+        backgroundColor: palette.neutralLighter,
+        pointerEvents: 'none',
+        cursor: 'default',
+      },
+      underlined && {
+        borderWidth: '0 0 1px 0'
+      },
+      underlined && disabled && {
+        backgroundColor: 'transparent'
+      }
+    ],
+    iconContainer: [
+      'ms-SearchBox-iconContainer',
+      {
+        display: 'flex',
+        flexDirection: 'column',
+        justifyContent: 'center',
+        flexShrink: 0,
+        fontSize: 16,
+        width: 32,
+        textAlign: 'center',
+        transition: `width ${AnimationVariables.durationValue1}`,
+        color: palette.themePrimary
+      },
+      hasFocus && {
+        width: 4,
+        transition: `width  ${AnimationVariables.durationValue1}`
+      },
+      disabled && {
+        color: palette.neutralTertiary
+      }
+    ],
+    icon: [
+      'ms-SearchBox-icon',
+      {
+        opacity: 1,
+        transition: `opacity ${AnimationVariables.durationValue1} 0s`
+      },
+      hasFocus && {
+        opacity: 0,
+        transition: `opacity 0 ${AnimationVariables.durationValue1}`
+      }
+    ],
+    clearButton: [
+      'ms-SearchBox-clearButton',
+      {
+        display: 'flex',
+        flexDirection: 'row',
+        alignItems: 'stretch',
+        cursor: 'pointer',
+        flexBasis: '32px',
+        flexShrink: 0,
+        padding: 1,
+        color: palette.themePrimary,
+      }
+    ],
+    field: [
+      'ms-SearchBox-field',
+      normalize,
+      {
+        border: 'none',
+        outline: 'none',
+        fontWeight: 'inherit',
+        fontFamily: 'inherit',
+        fontSize: 'inherit',
+        color: palette.neutralPrimary,
+        backgroundColor: 'transparent',
+        flex: '1 1 0',
+        overflow: 'hidden',
+        textOverflow: 'ellipsis',
+        // This padding forces the text placement to round up.
+        paddingBottom: 0.5,
+        // This removes the IE specific clear button in the input since we implimented our own
+        selectors: {
+          '::-ms-clear': {
+            display: 'none'
+          }
+        }
+      },
+      disabled && {
+        color: palette.neutralTertiary
+      }
+    ]
+  };
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.test.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.test.tsx
new file mode 100644
index 0000000000000..cf002263cafea
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.test.tsx
@@ -0,0 +1,15 @@
+import { Promise } from 'es6-promise';
+import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+import * as ReactTestUtils from 'react-dom/test-utils';
+import * as renderer from 'react-test-renderer';
+import { SearchBox } from './SearchBox';
+
+describe('SearchBox', () => {
+
+  it('renders SearchBox correctly', () => {
+    const component = renderer.create(<SearchBox />);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
index f8cc527257e95..45ac52526fb2e 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
@@ -1,196 +1,9 @@
-import * as React from 'react';
+import { styled } from '../../Utilities';
+import { SearchBoxBase } from './SearchBox.base';
 import { ISearchBoxProps } from './SearchBox.types';
-import {
-  BaseComponent,
-  autobind,
-  css,
-  getId,
-  KeyCodes
-} from '../../Utilities';
+import { getStyles } from './SearchBox.styles';
 
-import { Icon } from '../../Icon';
-import * as stylesImport from './SearchBox.scss';
-const styles: any = stylesImport;
-
-export interface ISearchBoxState {
-  value?: string;
-  hasFocus?: boolean;
-  id?: string;
-}
-
-export class SearchBox extends BaseComponent<ISearchBoxProps, ISearchBoxState> {
-  public static defaultProps: ISearchBoxProps = {
-    labelText: 'Search',
-  };
-
-  private _rootElement: HTMLElement;
-  private _inputElement: HTMLInputElement;
-  private _latestValue: string;
-
-  public constructor(props: ISearchBoxProps) {
-    super(props);
-
-    this.state = {
-      value: props.value || '',
-      hasFocus: false,
-      id: getId('SearchBox')
-    };
-  }
-
-  public componentWillReceiveProps(newProps: ISearchBoxProps) {
-    if (newProps.value !== undefined) {
-      this._latestValue = newProps.value;
-      this.setState({
-        value: newProps.value
-      });
-    }
-  }
-
-  public render() {
-    let { labelText, className, disabled, underlined } = this.props;
-    let { value, hasFocus, id } = this.state;
-    return (
-      <div
-        ref={ this._resolveRef('_rootElement') }
-        className={ css('ms-SearchBox', className, styles.root, {
-          ['is-active ' + styles.rootIsActive]: hasFocus,
-          ['is-disabled ' + styles.rootIsDisabled]: disabled,
-          ['can-clear ' + styles.rootCanClear]: value!.length > 0,
-          ['is-underlined ' + styles.rootIsUnderlined]: underlined,
-        }) }
-        { ...{ onFocusCapture: this._onFocusCapture } }
-      >
-        <div
-          className={ css('ms-SearchBox-iconContainer', styles.iconContainer) }
-        >
-          <Icon className={ css('ms-SearchBox-icon', styles.icon) } iconName='Search' />
-        </div>
-        <input
-          id={ id }
-          className={ css('ms-SearchBox-field', styles.field) }
-          placeholder={ labelText }
-          onChange={ this._onInputChange }
-          onInput={ this._onInputChange }
-          onKeyDown={ this._onKeyDown }
-          value={ value }
-          disabled={ this.props.disabled }
-          aria-label={ this.props.ariaLabel ? this.props.ariaLabel : this.props.labelText }
-          ref={ this._resolveRef('_inputElement') }
-        />
-        <div
-          className={ css('ms-SearchBox-clearButton', styles.clearButton) }
-          onClick={ this._onClear }
-        >
-          <Icon iconName='Clear' />
-        </div>
-      </div>
-    );
-  }
-
-  /**
-   * Sets focus to the search box input field
-   */
-  public focus() {
-    if (this._inputElement) {
-      this._inputElement.focus();
-    }
-  }
-
-  @autobind
-  private _onClear(ev: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) {
-    this.props.onClear && this.props.onClear(ev);
-    if (!ev.defaultPrevented) {
-      this._latestValue = '';
-      this.setState({
-        value: ''
-      });
-      this._callOnChange('');
-      ev.stopPropagation();
-      ev.preventDefault();
-
-      this._inputElement.focus();
-    }
-
-  }
-
-  @autobind
-  private _onFocusCapture(ev: React.FocusEvent<HTMLElement>) {
-    this.setState({
-      hasFocus: true
-    });
-
-    this._events.on(this._rootElement, 'blur', this._onBlur, true);
-
-    if (this.props.onFocus) {
-      this.props.onFocus(ev as React.FocusEvent<HTMLInputElement>);
-    }
-  }
-
-  @autobind
-  private _onKeyDown(ev: React.KeyboardEvent<HTMLInputElement>) {
-
-    switch (ev.which) {
-
-      case KeyCodes.escape:
-        this.props.onEscape && this.props.onEscape(ev);
-        if (!ev.defaultPrevented) {
-          this._onClear(ev);
-        }
-        break;
-
-      case KeyCodes.enter:
-        if (this.props.onSearch && this.state.value!.length > 0) {
-          this.props.onSearch(this.state.value);
-        }
-        break;
-
-      default:
-        this.props.onKeyDown && this.props.onKeyDown(ev);
-        if (!ev.defaultPrevented) {
-          return;
-        }
-    }
-
-    // We only get here if the keypress has been handled,
-    // or preventDefault was called in case of default keyDown handler
-    ev.preventDefault();
-    ev.stopPropagation();
-  }
-
-  @autobind
-  private _onBlur(ev: React.FocusEvent<HTMLInputElement>) {
-    this._events.off(this._rootElement, 'blur');
-    this.setState({
-      hasFocus: false
-    });
-
-    if (this.props.onBlur) {
-      this.props.onBlur(ev);
-    }
-  }
-
-  @autobind
-  private _onInputChange(ev: React.ChangeEvent<HTMLInputElement>) {
-    const value = this._inputElement.value;
-    if (value === this._latestValue) {
-      return;
-    }
-    this._latestValue = value;
-
-    this.setState({ value });
-    this._callOnChange(value);
-  }
-
-  private _callOnChange(newValue: string): void {
-    let { onChange, onChanged } = this.props;
-
-    // Call @deprecated method.
-    if (onChanged) {
-      onChanged(newValue);
-    }
-
-    if (onChange) {
-      onChange(newValue);
-    }
-  }
-}
+export const SearchBox = styled(
+  SearchBoxBase,
+  getStyles
+);
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
index 372ca5fbae446..72a3e4fc064ac 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
@@ -1,4 +1,6 @@
 import * as React from 'react';
+import { ITheme, IStyle } from '../../Styling';
+import { IStyleFunction } from '../../Utilities';
 
 export interface ISearchBox {
   /**
@@ -67,4 +69,29 @@ export interface ISearchBoxProps extends React.InputHTMLAttributes<HTMLInputElem
    * @default false
    */
   underlined?: boolean;
+
+  /**
+   * Theme (provided through customization.)
+   */
+  theme?: ITheme;
+
+  /**
+   * Call to provide customized styling that will layer on top of the variant rules.
+   */
+  getStyles?: IStyleFunction<ISearchBoxProps, ISearchBoxStyles>;
+}
+
+export interface ISearchBoxStyleProps {
+  theme: ITheme;
+  disabled?: boolean;
+  hasFocus?: boolean;
+  underlined?: boolean;
+}
+
+export interface ISearchBoxStyles {
+  root?: IStyle;
+  iconContainer?: IStyle;
+  icon?: IStyle;
+  field?: IStyle;
+  clearButton?: IStyle;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
new file mode 100644
index 0000000000000..8b8ae95c9f60f
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
@@ -0,0 +1,110 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`SearchBox renders SearchBox correctly 1`] = `
+<div
+  className=
+      ms-SearchBox
+      {
+        -moz-osx-font-smoothing: grayscale;
+        -webkit-font-smoothing: antialiased;
+        align-items: stretch;
+        border: 1px solid #a6a6a6;
+        box-shadow: none;
+        box-sizing: border-box;
+        color: #333333;
+        display: flex;
+        flex-direction: row;
+        flex-wrap: nowrap;
+        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-size: 14px;
+        font-weight: 400;
+        height: 32px;
+        margin-bottom: 0px;
+        margin-left: 0px;
+        margin-right: 0px;
+        margin-top: 0px;
+        padding-bottom: 0;
+        padding-left: 8px;
+        padding-right: 0;
+        padding-top: 0;
+      }
+      @media screen and (-ms-high-contrast: active){& {
+        border: 1px solid WindowText;
+      }
+      &:hover {
+        $label: [object Object];
+        border-color: #212121;
+      }
+  onFocusCapture={[Function]}
+>
+  <div
+    className=
+        ms-SearchBox-iconContainer
+        {
+          color: #0078d7;
+          display: flex;
+          flex-direction: column;
+          flex-shrink: 0;
+          font-size: 16px;
+          justify-content: center;
+          text-align: center;
+          transition: width 0.167s;
+          width: 32px;
+        }
+  >
+    <i
+      aria-hidden={true}
+      aria-label={undefined}
+      className=
+          ms-Icon
+          ms-SearchBox-icon
+          {
+            display: inline-block;
+          }
+          {
+            opacity: 1;
+            transition: opacity 0.167s 0s;
+          }
+      data-icon-name="Search"
+      role="presentation"
+    />
+  </div>
+  <input
+    aria-label="Search"
+    className=
+        ms-SearchBox-field
+        {
+          background-color: transparent;
+          border: none;
+          box-shadow: none;
+          box-sizing: border-box;
+          color: #333333;
+          flex: 1 1 0;
+          font-family: inherit;
+          font-size: inherit;
+          font-weight: inherit;
+          margin-bottom: 0px;
+          margin-left: 0px;
+          margin-right: 0px;
+          margin-top: 0px;
+          outline: none;
+          overflow: hidden;
+          padding-bottom: 0.5px;
+          padding-left: 0px;
+          padding-right: 0px;
+          padding-top: 0px;
+          text-overflow: ellipsis;
+        }
+        &::-ms-clear {
+          display: none;
+        }
+    disabled={undefined}
+    id="SearchBox0"
+    onChange={[Function]}
+    onInput={[Function]}
+    onKeyDown={[Function]}
+    placeholder="Search"
+    value=""
+  />
+</div>
+`;
diff --git a/packages/styling/src/interfaces/IAnimationStyles.ts b/packages/styling/src/interfaces/IAnimationStyles.ts
index 9371462150e4b..2a5789bf79cbc 100644
--- a/packages/styling/src/interfaces/IAnimationStyles.ts
+++ b/packages/styling/src/interfaces/IAnimationStyles.ts
@@ -44,3 +44,12 @@ export interface IAnimationStyles {
   rotate90deg: IRawStyle;
   rotateN90deg: IRawStyle;
 }
+
+export interface IAnimationVariables {
+  easeFunction1: string;
+  easeFunction2: string;
+  durationValue1: string;
+  durationValue2: string;
+  durationValue3: string;
+  durationValue4: string;
+}
\ No newline at end of file
diff --git a/packages/styling/src/interfaces/index.ts b/packages/styling/src/interfaces/index.ts
index daf0be7b9ff4d..f50da76e5038c 100644
--- a/packages/styling/src/interfaces/index.ts
+++ b/packages/styling/src/interfaces/index.ts
@@ -1,4 +1,4 @@
-export { IAnimationStyles } from './IAnimationStyles';
+export { IAnimationStyles, IAnimationVariables } from './IAnimationStyles';
 export { IFontStyles } from './IFontStyles';
 export { IPalette } from './IPalette';
 export { ISemanticColors } from './ISemanticColors';
diff --git a/packages/styling/src/styles/AnimationStyles.ts b/packages/styling/src/styles/AnimationStyles.ts
index d0cc02e1f4610..a0ce1a78c1d32 100644
--- a/packages/styling/src/styles/AnimationStyles.ts
+++ b/packages/styling/src/styles/AnimationStyles.ts
@@ -1,4 +1,4 @@
-import { IAnimationStyles } from '../interfaces/index';
+import { IAnimationStyles, IAnimationVariables } from '../interfaces/index';
 import { IRawStyle, keyframes } from '@uifabric/merge-styles/lib/index';
 
 /* Register the keyframes */
@@ -76,6 +76,18 @@ const ROTATE_N90: string = keyframes({
   to: { transform: 'rotateZ(-90deg)' }
 });
 
+/**
+ * Exporting raw duraction values and easing functions to be used in custom animations
+ */
+export const AnimationVariables: IAnimationVariables = {
+  easeFunction1: EASING_FUNCTION_1,
+  easeFunction2: EASING_FUNCTION_2,
+  durationValue1: DURATION_1,
+  durationValue2: DURATION_2,
+  durationValue3: DURATION_3,
+  durationValue4: DURATION_4
+};
+
 /**
  * All Fabric standard animations, exposed as json objects referencing predefined
  * keyframes. These objects can be mixed in with other class definitions.
diff --git a/packages/styling/src/styles/GeneralStyles.ts b/packages/styling/src/styles/GeneralStyles.ts
new file mode 100644
index 0000000000000..4b3232a912f94
--- /dev/null
+++ b/packages/styling/src/styles/GeneralStyles.ts
@@ -0,0 +1,10 @@
+// This file mimics styles and mixins from _General.Mixins.scss
+
+import { IRawStyle } from '@uifabric/merge-styles/lib/index';
+
+export const normalize: IRawStyle = {
+  boxShadow: 'none',
+  margin: 0,
+  padding: 0,
+  boxSizing: 'border-box'
+};
\ No newline at end of file
diff --git a/packages/styling/src/styles/index.ts b/packages/styling/src/styles/index.ts
index 7b5a7895ffd80..5e76b6ac401c9 100644
--- a/packages/styling/src/styles/index.ts
+++ b/packages/styling/src/styles/index.ts
@@ -1,4 +1,4 @@
-export { AnimationStyles } from './AnimationStyles';
+export { AnimationStyles, AnimationVariables } from './AnimationStyles';
 export { DefaultPalette } from './DefaultPalette';
 export { DefaultFontStyles, registerDefaultFontFaces } from './DefaultFontStyles';
 export { FontSizes, FontWeights, IconFontSizes, createFontStyles } from './fonts';
@@ -13,3 +13,4 @@ export {
   removeOnThemeChangeCallback
 } from './theme';
 export * from './CommonStyles';
+export { normalize } from './GeneralStyles';

From 6ad2fed62aa8ffb8b42b813d614af552ffceb5d4 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Wed, 27 Dec 2017 14:36:16 -0800
Subject: [PATCH 1180/1641] Searchbox classname (#3640)

* Moved className into styles file

* Changefile

* Moved all classnames into styles file
---
 .../searchboxClassname_2017-12-27-19-44.json  | 11 ++++
 .../components/SearchBox/SearchBox.base.tsx   | 16 +++---
 .../components/SearchBox/SearchBox.styles.tsx | 51 +++++++++++--------
 .../components/SearchBox/SearchBox.types.ts   |  2 +
 4 files changed, 53 insertions(+), 27 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/searchboxClassname_2017-12-27-19-44.json

diff --git a/common/changes/office-ui-fabric-react/searchboxClassname_2017-12-27-19-44.json b/common/changes/office-ui-fabric-react/searchboxClassname_2017-12-27-19-44.json
new file mode 100644
index 0000000000000..f06771c4cf153
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/searchboxClassname_2017-12-27-19-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SearchBox: moved className into styles file and added it to styles interface",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
index 0f44432fdd15d..3a0c8eea2a98b 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
@@ -56,17 +56,19 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
     let { labelText, className, disabled, underlined, getStyles, theme } = this.props;
     let { value, hasFocus, id } = this.state;
 
-    const classNames = getClassNames(getStyles!, { theme: theme!, underlined, hasFocus, disabled });
+    const classNames = getClassNames(getStyles!, {
+      theme: theme!,
+      className,
+      underlined,
+      hasFocus,
+      disabled,
+      hasInput: value!.length > 0
+    });
 
     return (
       <div
         ref={ this._resolveRef('_rootElement') }
-        className={ css(className, classNames.root,
-          hasFocus && 'is-active',
-          disabled && 'is-disabled',
-          value!.length > 0 && 'can-clear',
-          underlined && 'is-underlined'
-        ) }
+        className={ classNames.root }
         onFocusCapture={ this._onFocusCapture }
       >
         <div className={ classNames.iconContainer }>
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx
index 645adee4b54d6..736de420cc1e7 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx
@@ -10,7 +10,7 @@ import { SearchBoxBase } from './SearchBox.base';
 import { ISearchBoxProps, ISearchBoxStyleProps, ISearchBoxStyles } from './SearchBox.types';
 
 export function getStyles(props: ISearchBoxStyleProps): ISearchBoxStyles {
-  const { theme, underlined, disabled, hasFocus } = props;
+  const { theme, underlined, disabled, hasFocus, className, hasInput } = props;
   const { palette, fonts } = theme;
 
   return {
@@ -42,29 +42,40 @@ export function getStyles(props: ISearchBoxStyleProps): ISearchBoxStyles {
           }
         }
       },
-      hasFocus && {
-        borderColor: palette.themePrimary,
-        selectors: {
-          ':hover': {
-            borderColor: palette.themePrimary,
-          },
-          [HighContrastSelector]: {
-            borderColor: 'Highlight'
+      hasFocus && [
+        'is-active',
+        {
+          borderColor: palette.themePrimary,
+          selectors: {
+            ':hover': {
+              borderColor: palette.themePrimary,
+            },
+            [HighContrastSelector]: {
+              borderColor: 'Highlight'
+            }
           }
         }
-      },
-      disabled && {
-        borderColor: palette.neutralLighter,
-        backgroundColor: palette.neutralLighter,
-        pointerEvents: 'none',
-        cursor: 'default',
-      },
-      underlined && {
-        borderWidth: '0 0 1px 0'
-      },
+      ],
+      disabled && [
+        'is-disabled',
+        {
+          borderColor: palette.neutralLighter,
+          backgroundColor: palette.neutralLighter,
+          pointerEvents: 'none',
+          cursor: 'default',
+        }
+      ],
+      underlined && [
+        'is-underlined',
+        {
+          borderWidth: '0 0 1px 0'
+        }
+      ],
       underlined && disabled && {
         backgroundColor: 'transparent'
-      }
+      },
+      hasInput && 'can-clear',
+      className
     ],
     iconContainer: [
       'ms-SearchBox-iconContainer',
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
index 72a3e4fc064ac..41a04bb516b4a 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
@@ -83,9 +83,11 @@ export interface ISearchBoxProps extends React.InputHTMLAttributes<HTMLInputElem
 
 export interface ISearchBoxStyleProps {
   theme: ITheme;
+  className?: string;
   disabled?: boolean;
   hasFocus?: boolean;
   underlined?: boolean;
+  hasInput?: boolean;
 }
 
 export interface ISearchBoxStyles {

From 861b47f8cf30c4921be379bce6af8e782004a6c1 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 28 Dec 2017 11:23:50 +0000
Subject: [PATCH 1181/1641] Applying package updates.

---
 .../mergeStyles_2017-12-15-14-15.json         | 11 -------
 .../searchbox-getStyles_2017-12-21-00-02.json | 11 -------
 .../searchbox-getStyles_2017-12-21-00-02.json | 11 -------
 .../searchboxClassname_2017-12-27-19-44.json  | 11 -------
 packages/example-app-base/package.json        |  2 +-
 packages/file-type-icons/package.json         |  2 +-
 packages/icons/package.json                   |  2 +-
 .../jest-serializer-merge-styles/package.json |  2 +-
 packages/merge-styles/CHANGELOG.json          | 14 +++++++++
 packages/merge-styles/CHANGELOG.md            |  9 +++++-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 29 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 13 ++++++++-
 packages/office-ui-fabric-react/package.json  |  6 ++--
 packages/styling/CHANGELOG.json               | 19 ++++++++++++
 packages/styling/CHANGELOG.md                 |  9 +++++-
 packages/styling/package.json                 |  4 +--
 packages/utilities/package.json               |  2 +-
 scripts/package.json                          |  2 +-
 19 files changed, 102 insertions(+), 59 deletions(-)
 delete mode 100644 common/changes/@uifabric/merge-styles/mergeStyles_2017-12-15-14-15.json
 delete mode 100644 common/changes/@uifabric/styling/searchbox-getStyles_2017-12-21-00-02.json
 delete mode 100644 common/changes/office-ui-fabric-react/searchbox-getStyles_2017-12-21-00-02.json
 delete mode 100644 common/changes/office-ui-fabric-react/searchboxClassname_2017-12-27-19-44.json

diff --git a/common/changes/@uifabric/merge-styles/mergeStyles_2017-12-15-14-15.json b/common/changes/@uifabric/merge-styles/mergeStyles_2017-12-15-14-15.json
deleted file mode 100644
index ab29f924cc990..0000000000000
--- a/common/changes/@uifabric/merge-styles/mergeStyles_2017-12-15-14-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "Added a setting to Stylesheet which allows overriding the default prefix",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "jawerne@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/searchbox-getStyles_2017-12-21-00-02.json b/common/changes/@uifabric/styling/searchbox-getStyles_2017-12-21-00-02.json
deleted file mode 100644
index e07477e3fcef2..0000000000000
--- a/common/changes/@uifabric/styling/searchbox-getStyles_2017-12-21-00-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Adding new normalize and AnimationValues",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/searchbox-getStyles_2017-12-21-00-02.json b/common/changes/office-ui-fabric-react/searchbox-getStyles_2017-12-21-00-02.json
deleted file mode 100644
index b8ca8aa5fec54..0000000000000
--- a/common/changes/office-ui-fabric-react/searchbox-getStyles_2017-12-21-00-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SearchBox: Converted component to getStyles",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/searchboxClassname_2017-12-27-19-44.json b/common/changes/office-ui-fabric-react/searchboxClassname_2017-12-27-19-44.json
deleted file mode 100644
index f06771c4cf153..0000000000000
--- a/common/changes/office-ui-fabric-react/searchboxClassname_2017-12-27-19-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SearchBox: moved className into styles file and added it to styles interface",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index f9f2d00881e6a..ceb4a1c8039c0 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -32,7 +32,7 @@
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.15.0 <6.0.0",
+    "@uifabric/styling": ">=5.15.1 <6.0.0",
     "@uifabric/utilities": ">=5.6.1 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
diff --git a/packages/file-type-icons/package.json b/packages/file-type-icons/package.json
index a2b750b7c76e6..7d561b693104d 100644
--- a/packages/file-type-icons/package.json
+++ b/packages/file-type-icons/package.json
@@ -26,7 +26,7 @@
     "react-dom": "^16.2.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.14.0 <6.0.0",
+    "@uifabric/styling": ">=5.15.1 <6.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 51c9ff49fc922..c2bccf63bd5b0 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -22,7 +22,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.14.0 <6.0.0",
+    "@uifabric/styling": ">=5.15.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/jest-serializer-merge-styles/package.json b/packages/jest-serializer-merge-styles/package.json
index 428502e83b527..773a912bf8dad 100644
--- a/packages/jest-serializer-merge-styles/package.json
+++ b/packages/jest-serializer-merge-styles/package.json
@@ -24,6 +24,6 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/merge-styles": ">=5.9.0 <6.0.0"
+    "@uifabric/merge-styles": ">=5.10.0 <6.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index 82a38d45087dc..d22e92d16282c 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.10.0",
+      "tag": "@uifabric/merge-styles_v5.10.0",
+      "date": "Thu, 28 Dec 2017 11:23:50 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Jakob Werner <jaxxx_w@yahoo.com>",
+            "commit": "e5c7d91dff4a37f5d6dabe3ac461afd644804d37",
+            "comment": "Added a setting to Stylesheet which allows overriding the default prefix"
+          }
+        ]
+      }
+    },
     {
       "version": "5.9.0",
       "tag": "@uifabric/merge-styles_v5.9.0",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index d929c78ca1bfe..6a140d9619d62 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Sat, 16 Dec 2017 05:07:22 GMT and should not be manually modified.
+This log was last generated on Thu, 28 Dec 2017 11:23:50 GMT and should not be manually modified.
+
+## 5.10.0
+Thu, 28 Dec 2017 11:23:50 GMT
+
+### Minor changes
+
+- Added a setting to Stylesheet which allows overriding the default prefix
 
 ## 5.9.0
 Sat, 16 Dec 2017 05:07:22 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index c5e826d789b88..34b7d7ea32cb4 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.9.0",
+  "version": "5.10.0",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 6ff09e7f4fce8..ad703e7779b76 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,35 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.36.0",
+      "tag": "office-ui-fabric-react_v5.36.0",
+      "date": "Thu, 28 Dec 2017 11:23:50 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "4c523699e33d9e2c15d60d947f8f4017c48e00e2",
+            "comment": "SearchBox: Converted component to getStyles"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "6ad2fed62aa8ffb8b42b813d614af552ffceb5d4",
+            "comment": "SearchBox: moved className into styles file and added it to styles interface"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.9.0 <6.0.0` to `>=5.10.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.15.0 <6.0.0` to `>=5.15.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.35.2",
       "tag": "office-ui-fabric-react_v5.35.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index bd239e64abf7a..e78358c6eb279 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 25 Dec 2017 11:13:32 GMT and should not be manually modified.
+This log was last generated on Thu, 28 Dec 2017 11:23:50 GMT and should not be manually modified.
+
+## 5.36.0
+Thu, 28 Dec 2017 11:23:50 GMT
+
+### Minor changes
+
+- SearchBox: Converted component to getStyles
+
+### Patches
+
+- SearchBox: moved className into styles file and added it to styles interface
 
 ## 5.35.2
 Mon, 25 Dec 2017 11:13:32 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 7e11d8f64d41c..31c8b8633e5d5 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.35.2",
+  "version": "5.36.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -48,8 +48,8 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/icons": ">=5.3.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.9.0 <6.0.0",
-    "@uifabric/styling": ">=5.15.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.10.0 <6.0.0",
+    "@uifabric/styling": ">=5.15.1 <6.0.0",
     "@uifabric/utilities": ">=5.6.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 7731782a4c388..48d7b0c19525b 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.15.1",
+      "tag": "@uifabric/styling_v5.15.1",
+      "date": "Thu, 28 Dec 2017 11:23:50 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "4c523699e33d9e2c15d60d947f8f4017c48e00e2",
+            "comment": "Adding new normalize and AnimationValues"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.9.0 <6.0.0` to `>=5.10.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.15.0",
       "tag": "@uifabric/styling_v5.15.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index d3d9d83367ba8..15ff21cfd1389 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Sat, 16 Dec 2017 05:07:22 GMT and should not be manually modified.
+This log was last generated on Thu, 28 Dec 2017 11:23:50 GMT and should not be manually modified.
+
+## 5.15.1
+Thu, 28 Dec 2017 11:23:50 GMT
+
+### Patches
+
+- Adding new normalize and AnimationValues
 
 ## 5.15.0
 Sat, 16 Dec 2017 05:07:22 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 7bdb8638d9c59..572c542c4d5d1 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.15.0",
+  "version": "5.15.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "repository": {
     "type": "git",
@@ -28,7 +28,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/utilities": ">=5.6.1 <6.0.0",
-    "@uifabric/merge-styles": ">=5.9.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.10.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index d81dcadc24a63..cc9ffde939e50 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -36,7 +36,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/merge-styles": ">=5.9.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.10.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/scripts/package.json b/scripts/package.json
index a7d9c87aa297d..18ea90414d0f4 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -11,7 +11,7 @@
     "@microsoft/api-extractor": "^4.2.6",
     "@microsoft/load-themed-styles": "^1.7.13",
     "@microsoft/loader-load-themed-styles": "^1.6.0",
-    "@uifabric/merge-styles": ">=5.9.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.10.0 <6.0.0",
     "autoprefixer": "^7.1.5",
     "awesome-typescript-loader": "^3.2.3",
     "bundlesize": "^0.15.2",

From 9323f11e1636c51f05e403d7f3cbf0cba311bbd2 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 2 Jan 2018 09:55:24 -0800
Subject: [PATCH 1182/1641] Update CODEOWNERS

---
 .github/CODEOWNERS | 137 ++++++++++++++++++++++-----------------------
 1 file changed, 67 insertions(+), 70 deletions(-)

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index 4869022a4e9bd..8df3ebf2e6a25 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -4,12 +4,12 @@
 # These owners will be the default owners for everything in the repo.
 # Unless a later match takes precedence, @global-owner1 and @global-owner2
 # will be requested for review when someone opens a pull request.
-# *       @global-owner1 @global-owner2
+# *   @global-owner1 @global-owner2
 
 # Order is important; the last matching pattern takes the most precedence.
 # When someone opens a pull request that only modifies JS files, only @js-owner
 # and not the global owner(s) will be requested for a review.
-# *.js    @js-owner
+# *.js@js-owner
 
 # You can also use email addresses if you prefer. They'll be used to look up
 # users just like we do for commit author emails.
@@ -25,76 +25,73 @@
 #### Packages
 # packages/example-app-base/
 # packages/example-component/
-
-  ### Fabric
-  # packages/office-ui-fabric-react/src/common/
-  packages/office-ui-fabric-react/src/common/_semanticSlots.scss  @phkuo
-  packages/office-ui-fabric-react/src/common/_themeOverrides.scss @phkuo
-  packages/office-ui-fabric-react/src/common/_common.scss @phkuo
-
-    ## Components
-    # packages/office-ui-fabric-react/src/components/ActivityItem/
-    # packages/office-ui-fabric-react/src/components/Breadcrumb/
-    # packages/office-ui-fabric-react/src/components/Button/
-    packages/office-ui-fabric-react/src/components/Calendar/   @johannao76 @lorejoh12@gmail.com @jolore@microsoft.com
-    # packages/office-ui-fabric-react/src/components/Callout/
-    # packages/office-ui-fabric-react/src/components/Check/
-    # packages/office-ui-fabric-react/src/components/Checkbox/
-    # packages/office-ui-fabric-react/src/components/ChoiceGroup/
-    # packages/office-ui-fabric-react/src/components/ColorPicker/
-    # packages/office-ui-fabric-react/src/components/ComboBox/
-    packages/office-ui-fabric-react/src/components/CommandBar/   @micahgodbolt
-    # packages/office-ui-fabric-react/src/components/ContextualMenu/
-    packages/office-ui-fabric-react/src/components/DatePicker/   @johannao76 @lorejoh12@gmail.com @jolore@microsoft.com
-    # packages/office-ui-fabric-react/src/components/DetailsList/
-    # packages/office-ui-fabric-react/src/components/Dialog/
-    # packages/office-ui-fabric-react/src/components/DocumentCard/
-    # packages/office-ui-fabric-react/src/components/Dropdown/
-    # packages/office-ui-fabric-react/src/components/Fabric/
-    # packages/office-ui-fabric-react/src/components/FacePile/
-    # packages/office-ui-fabric-react/src/components/FocusTrapZone/
-    # packages/office-ui-fabric-react/src/components/FocusZone/
-    # packages/office-ui-fabric-react/src/components/GroupedList/
-    packages/office-ui-fabric-react/src/components/HoverCard/   @atneik @Jahnp
-    # packages/office-ui-fabric-react/src/components/Icon/
-    # packages/office-ui-fabric-react/src/components/Image/
-    # packages/office-ui-fabric-react/src/components/Label/
-    # packages/office-ui-fabric-react/src/components/Layer/
-    # packages/office-ui-fabric-react/src/components/Link/
-    packages/office-ui-fabric-react/src/components/List/  @cschleiden
-    # packages/office-ui-fabric-react/src/components/MarqueeSelection/
-    # packages/office-ui-fabric-react/src/components/MessageBar/
-    # packages/office-ui-fabric-react/src/components/Modal/
-    # packages/office-ui-fabric-react/src/components/Nav/
-    packages/office-ui-fabric-react/src/components/OverflowSet/  @micahgodbolt
-    # packages/office-ui-fabric-react/src/components/Overlay/
-    # packages/office-ui-fabric-react/src/components/Panel/
-    # packages/office-ui-fabric-react/src/components/Persona/
-    packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx @mtennoe @jakob101
-    packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.tsx @mtennoe @jakob101
-    # packages/office-ui-fabric-react/src/components/pickers/
-    # packages/office-ui-fabric-react/src/components/Pivot/
-    # packages/office-ui-fabric-react/src/components/Popup/
-    # packages/office-ui-fabric-react/src/components/ProgressIndicator/
-    packages/office-ui-fabric-react/src/components/Rating/  @cschleiden
-    packages/office-ui-fabric-react/src/components/ResizeGroup/  @micahgodbolt
-    # packages/office-ui-fabric-react/src/components/SearchBox/
-    # packages/office-ui-fabric-react/src/components/Slider/
-    # packages/office-ui-fabric-react/src/components/SpinButton/
-    # packages/office-ui-fabric-react/src/components/Spinner/
-    # packages/office-ui-fabric-react/src/components/SwatchColorPicker/
-    packages/office-ui-fabric-react/src/components/TeachingBubble/   @micahgodbolt
-    # packages/office-ui-fabric-react/src/components/TextField/
-    # packages/office-ui-fabric-react/src/components/Theme/
-    packages/office-ui-fabric-react/src/components/Toggle/  @phkuo
-    packages/office-ui-fabric-react/src/components/Tooltip/  @micahgodbolt
-
-  # packages/office-ui-fabric-react/src/demo/
-  # packages/office-ui-fabric-react/src/utilities/
-  # packages/office-ui-fabric-react/src/visualtest/
-
 # packages/office-ui-fabric-react-tslint/
 packages/styling/  @dzearing
 packages/styling/src/interfaces/ @phkuo
 packages/styling/src/styles/ @phkuo
 # packages/utilities/
+
+### Fabric
+# common/
+common/_semanticSlots.scss  @phkuo
+common/_themeOverrides.scss @phkuo
+common/_common.scss @phkuo
+
+## Components
+# ActivityItem/
+# Breadcrumb/
+# Button/
+Calendar/   @johannao76 lorejoh12@gmail.com jolore@microsoft.com
+# Callout/
+# Check/
+# Checkbox/
+# ChoiceGroup/
+# ColorPicker/
+# ComboBox/
+CommandBar/   @micahgodbolt
+# ContextualMenu/
+DatePicker/   @johannao76 lorejoh12@gmail.com jolore@microsoft.com
+# DetailsList/
+# Dialog/
+# DocumentCard/
+# Dropdown/
+# Fabric/
+# FacePile/
+# FocusTrapZone/
+# FocusZone/
+# GroupedList/
+HoverCard/   @atneik @Jahnp
+# Icon/
+# Image/
+# Label/
+# Layer/
+# Link/
+List/  @cschleiden
+# MarqueeSelection/
+# MessageBar/
+# Modal/
+# Nav/
+OverflowSet/  @micahgodbolt
+# Overlay/
+# Panel/
+# Persona/
+Persona/PersonaCoin.tsx @mtennoe @jakob101
+Persona/PersonaConsts.tsx @mtennoe @jakob101
+# pickers/
+# Pivot/
+# Popup/
+# ProgressIndicator/
+Rating/  @cschleiden
+ResizeGroup/  @micahgodbolt
+# SearchBox/
+# Slider/
+# SpinButton/
+# Spinner/
+# SwatchColorPicker/
+TeachingBubble/   @micahgodbolt
+# TextField/
+# Theme/
+Toggle/  @phkuo
+Tooltip/  @micahgodbolt
+
+

From 57763c505a6ebdf04577a3db70a521add6735cf4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20Tenn=C3=B8e?= <mariust@outlook.com>
Date: Tue, 2 Jan 2018 19:00:26 +0100
Subject: [PATCH 1183/1641] Added optional callback for getting image load
 state change events from PersonaCoin through Persona component (#3583)

* Added optional callback for getting image load state change events from personacoin through Persona component

* Added change file

* Fixed a typo
---
 ...ersonacoin_image_load_events_2017-12-15-13-19.json | 11 +++++++++++
 .../src/components/Persona/Persona.tsx                |  6 ++++--
 .../src/components/Persona/Persona.types.ts           |  6 ++++++
 .../src/components/Persona/PersonaCoin.tsx            |  4 ++++
 4 files changed, 25 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/mariust-personacoin_image_load_events_2017-12-15-13-19.json

diff --git a/common/changes/office-ui-fabric-react/mariust-personacoin_image_load_events_2017-12-15-13-19.json b/common/changes/office-ui-fabric-react/mariust-personacoin_image_load_events_2017-12-15-13-19.json
new file mode 100644
index 0000000000000..8f401c72091b5
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/mariust-personacoin_image_load_events_2017-12-15-13-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added optional callback for getting image load state change events from personacoin through Persona component",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mariust@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index 89c45907b301c..e42c958de196c 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -56,7 +56,8 @@ export class Persona extends BaseComponent<IPersonaProps, {}> {
       primaryText,
       imageShouldFadeIn,
       imageShouldStartVisible,
-      showSecondaryText
+      showSecondaryText,
+      onPhotoLoadingStateChange
      } = this.props;
 
     let personaCoinProps = {
@@ -70,7 +71,8 @@ export class Persona extends BaseComponent<IPersonaProps, {}> {
       primaryText,
       imageShouldFadeIn,
       imageShouldStartVisible,
-      size
+      size,
+      onPhotoLoadingStateChange
     };
 
     let divProps = getNativeProps(this.props, divProperties);
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts b/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts
index 0b6d45420933b..c91bde05791dc 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { IRenderFunction } from '../../Utilities';
 import { Persona } from './Persona';
+import { ImageLoadState } from '../../Image';
 
 export interface IPersona {
 
@@ -62,6 +63,11 @@ export interface IPersonaProps extends React.HTMLAttributes<Persona> {
    */
   onRenderInitials?: IRenderFunction<IPersonaProps>;
 
+  /**
+   * Optional callback for when loading state of the photo changes
+   */
+  onPhotoLoadingStateChange?: (newImageLoadState: ImageLoadState) => void;
+
   /**
    * The background color when the user's initials are displayed.
    * @defaultvalue [Derived from primaryText]
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
index 348fc7ab6cb5f..1d06b81762b5b 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
@@ -167,5 +167,9 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
       isImageLoaded: loadState === ImageLoadState.loaded,
       isImageError: loadState === ImageLoadState.error
     });
+
+    if (this.props.onPhotoLoadingStateChange) {
+      this.props.onPhotoLoadingStateChange(loadState);
+    }
   }
 }
\ No newline at end of file

From ca52fe19a919c0fe6630b7fc0f44aa1fdda98a98 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 2 Jan 2018 10:10:29 -0800
Subject: [PATCH 1184/1641] Icons: Updated font files to match the src files
 previously updated (#3650)

* Added icon font files to match src files and repo

* Removed old icon font files

* Added change file
---
 .../icons/icon-fonts_2018-01-02-16-47.json      |  11 +++++++++++
 .../icons/fonts/fabric-icons-10-795d6e25.woff   | Bin 12416 -> 0 bytes
 .../icons/fonts/fabric-icons-10-a9486bb8.woff   | Bin 0 -> 12224 bytes
 .../icons/fonts/fabric-icons-4-03329fef.woff    | Bin 15940 -> 0 bytes
 .../icons/fonts/fabric-icons-4-46fbc7bc.woff    | Bin 0 -> 15328 bytes
 packages/icons/fonts/fabric-icons-4ac62dd2.woff | Bin 6372 -> 0 bytes
 .../icons/fonts/fabric-icons-5-5bc71068.woff    | Bin 0 -> 13452 bytes
 .../icons/fonts/fabric-icons-5-82c8b87c.woff    | Bin 13512 -> 0 bytes
 .../icons/fonts/fabric-icons-6-2ab76fc9.woff    | Bin 12672 -> 0 bytes
 .../icons/fonts/fabric-icons-6-328cd253.woff    | Bin 0 -> 12148 bytes
 10 files changed, 11 insertions(+)
 create mode 100644 common/changes/@uifabric/icons/icon-fonts_2018-01-02-16-47.json
 delete mode 100644 packages/icons/fonts/fabric-icons-10-795d6e25.woff
 create mode 100644 packages/icons/fonts/fabric-icons-10-a9486bb8.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-4-03329fef.woff
 create mode 100644 packages/icons/fonts/fabric-icons-4-46fbc7bc.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-4ac62dd2.woff
 create mode 100644 packages/icons/fonts/fabric-icons-5-5bc71068.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-5-82c8b87c.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-6-2ab76fc9.woff
 create mode 100644 packages/icons/fonts/fabric-icons-6-328cd253.woff

diff --git a/common/changes/@uifabric/icons/icon-fonts_2018-01-02-16-47.json b/common/changes/@uifabric/icons/icon-fonts_2018-01-02-16-47.json
new file mode 100644
index 0000000000000..b60258d35706d
--- /dev/null
+++ b/common/changes/@uifabric/icons/icon-fonts_2018-01-02-16-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/icons",
+      "comment": "Updated icon font files to match the hash in the src files.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/icons",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/icons/fonts/fabric-icons-10-795d6e25.woff b/packages/icons/fonts/fabric-icons-10-795d6e25.woff
deleted file mode 100644
index 83f9dddcca07528aae528fa1745288b7e7c18785..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 12416
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
VLPA0;|C58k1Pp>u{nxnv{{U_hp3wjR

diff --git a/packages/icons/fonts/fabric-icons-10-a9486bb8.woff b/packages/icons/fonts/fabric-icons-10-a9486bb8.woff
new file mode 100644
index 0000000000000000000000000000000000000000..e36520bdba0254934af6b85cd1ad5c98047369c1
GIT binary patch
literal 12224
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

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-4-03329fef.woff b/packages/icons/fonts/fabric-icons-4-03329fef.woff
deleted file mode 100644
index 070d9d534ee25f4d624887407d61d93530e2d282..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 15940
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
OL<bB2QDFTP;Qs>!OsKN}

diff --git a/packages/icons/fonts/fabric-icons-4-46fbc7bc.woff b/packages/icons/fonts/fabric-icons-4-46fbc7bc.woff
new file mode 100644
index 0000000000000000000000000000000000000000..21f88850142e85378dff453c1a90531e7a2f0e50
GIT binary patch
literal 15328
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

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-4ac62dd2.woff b/packages/icons/fonts/fabric-icons-4ac62dd2.woff
deleted file mode 100644
index 755a37daffb697f8ffbca517643721948088b111..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 6372
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
B^mqUO

diff --git a/packages/icons/fonts/fabric-icons-5-5bc71068.woff b/packages/icons/fonts/fabric-icons-5-5bc71068.woff
new file mode 100644
index 0000000000000000000000000000000000000000..f4eba2d21eecbc92a2d848141c275087be01d723
GIT binary patch
literal 13452
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
QCJloL7yzNf`Cfqk2P$93SpWb4

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-5-82c8b87c.woff b/packages/icons/fonts/fabric-icons-5-82c8b87c.woff
deleted file mode 100644
index 35380535eefa8ebff03a7ded3d7bfb180aac6fc1..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 13512
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
R%DM~`24E2A=hgrK_<uo074HB5

diff --git a/packages/icons/fonts/fabric-icons-6-2ab76fc9.woff b/packages/icons/fonts/fabric-icons-6-2ab76fc9.woff
deleted file mode 100644
index 59d4c97553589805cf3ccc7a11fcad30123ded7a..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 12672
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
ULqjdC%ERFR2Ee}k_v6C<1KU@0S^xk5

diff --git a/packages/icons/fonts/fabric-icons-6-328cd253.woff b/packages/icons/fonts/fabric-icons-6-328cd253.woff
new file mode 100644
index 0000000000000000000000000000000000000000..7fc776ee4d4af1faf362b69551f8a755348f04da
GIT binary patch
literal 12148
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
MFaSjUUs(PB0U6e?761SM

literal 0
HcmV?d00001


From 057b0bea9bf3aa9daab532c93bd9d9a206a085dd Mon Sep 17 00:00:00 2001
From: MirandaGe <lingge@microsoft.com>
Date: Wed, 3 Jan 2018 02:26:27 +0800
Subject: [PATCH 1185/1641] Base Picker: check unmount state when updating
 suggestion list (#3581)

* add unmount check for BasePicker update suggestion promise

* add rush change file

* avoid using unmount
---
 ...-state-unmount-check_2017-12-15-05-43.json | 11 ++++++++++
 .../src/components/pickers/BasePicker.tsx     | 20 +++++++++++++++----
 2 files changed, 27 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/lingge-BasePicker-update-state-unmount-check_2017-12-15-05-43.json

diff --git a/common/changes/office-ui-fabric-react/lingge-BasePicker-update-state-unmount-check_2017-12-15-05-43.json b/common/changes/office-ui-fabric-react/lingge-BasePicker-update-state-unmount-check_2017-12-15-05-43.json
new file mode 100644
index 0000000000000..b4f033e954cde
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/lingge-BasePicker-update-state-unmount-check_2017-12-15-05-43.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "add unmount check in suggestion promise",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lingge@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index eed4ecff6fe74..77573b85fce2a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -42,7 +42,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   protected suggestionStore: SuggestionsController<T>;
   protected SuggestionOfProperType = Suggestions as new (props: ISuggestionsProps<T>) => Suggestions<T>;
   protected loadingTimer: number | undefined;
-  protected currentPromise: PromiseLike<any>;
+  protected currentPromise: PromiseLike<any> | undefined;
 
   constructor(basePickerProps: P) {
     super(basePickerProps);
@@ -97,6 +97,16 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     }
   }
 
+  public componentWillUnmount(): void {
+    super.componentWillUnmount();
+    if (this.loadingTimer) {
+      this._async.clearTimeout(this.loadingTimer);
+    }
+    if (this.currentPromise) {
+      this.currentPromise = undefined;
+    }
+  }
+
   public focus() {
     this.focusZone.focus();
   }
@@ -306,9 +316,11 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
       }
     } else if (suggestionsPromiseLike && suggestionsPromiseLike.then) {
       if (!this.loadingTimer) {
-        this.loadingTimer = this._async.setTimeout(() => this.setState({
-          suggestionsLoading: true
-        }), 500);
+        this.loadingTimer = this._async.setTimeout(() => {
+          this.setState({
+            suggestionsLoading: true
+          });
+        }, 500);
       }
 
       // Clear suggestions

From 6d6a796f27a91408a065f330c08afc739075ae9f Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Tue, 2 Jan 2018 14:55:13 -0800
Subject: [PATCH 1186/1641] [TextField] autocomplete (#3654)

* Enable autocomplete for textfield

* Change file

* Update magellan-textfield_autocomplete_2018-01-02-22-37.json

* Update magellan-textfield_autocomplete_2018-01-02-22-37.json
---
 ...xtfield_autocomplete_2018-01-02-22-37.json | 11 +++++++++++
 .../components/TextField/TextField.types.ts   |  9 +++++++--
 .../components/TextField/TextFieldPage.tsx    |  8 ++++++++
 .../TextField.AutoComplete.Example.tsx        | 19 +++++++++++++++++++
 4 files changed, 45 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/magellan-textfield_autocomplete_2018-01-02-22-37.json
 create mode 100644 packages/office-ui-fabric-react/src/components/TextField/examples/TextField.AutoComplete.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/magellan-textfield_autocomplete_2018-01-02-22-37.json b/common/changes/office-ui-fabric-react/magellan-textfield_autocomplete_2018-01-02-22-37.json
new file mode 100644
index 0000000000000..1547b6bfc7530
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/magellan-textfield_autocomplete_2018-01-02-22-37.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "TextField: Allows user to provide the `autocomplete` prop.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts b/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts
index f53d55fffa298..7f32537bc68d4 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts
@@ -223,8 +223,13 @@ export interface ITextFieldProps extends React.AllHTMLAttributes<HTMLInputElemen
   iconClass?: string;
 
   /**
- * Internal ID passed to render functions.
- */
+   * Internal ID passed to render functions.
+   */
   componentId?: string;
 
+  /**
+   * Whether the input field should have autocomplete enabled.
+   * This tells the browser to display options based on earlier typed values.
+   */
+  autoComplete?: 'on' | 'off';
 }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
index 3543f8cee37f7..68251f037c2ab 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
@@ -18,6 +18,7 @@ import { TextFieldPrefixAndSuffixExample } from './examples/TextField.PrefixAndS
 import { TextFieldStatus } from './TextField.checklist';
 import { TextFieldSuffixExample } from './examples/TextField.Suffix.Example';
 import { TextFieldUnderlinedExample } from './examples/TextField.Underlined.Example';
+import { TextFieldAutoCompleteExample } from './examples/TextField.AutoComplete.Example';
 
 const TextFieldBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx') as string;
 const TextFieldBorderlessExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Borderless.Example.tsx') as string;
@@ -30,6 +31,7 @@ const TextFieldPrefixExampleCode = require('!raw-loader!office-ui-fabric-react/s
 const TextFieldPrefixAndSuffixExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.PrefixAndSuffix.Example.tsx') as string;
 const TextFieldSuffixExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Suffix.Example.tsx') as string;
 const TextFieldUnderlinedExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.Underlined.Example.tsx') as string;
+const TextFieldAutoCompleteExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/TextField/examples/TextField.AutoComplete.Example.tsx') as string;
 
 export class TextFieldPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
@@ -69,6 +71,12 @@ export class TextFieldPage extends React.Component<IComponentDemoPageProps, {}>
             >
               <TextFieldBorderlessExample />
             </ExampleCard>
+            <ExampleCard
+              title='TextField with browser AutoComplete'
+              code={ TextFieldAutoCompleteExampleCode }
+            >
+              <TextFieldAutoCompleteExample />
+            </ExampleCard>
           </div>
         }
         implementationExampleCards={
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.AutoComplete.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.AutoComplete.Example.tsx
new file mode 100644
index 0000000000000..a2e9029cae05b
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.AutoComplete.Example.tsx
@@ -0,0 +1,19 @@
+import * as React from 'react';
+import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
+import { TextField } from 'office-ui-fabric-react/lib/TextField';
+import './TextField.Examples.scss';
+
+export class TextFieldAutoCompleteExample extends React.Component<any, any> {
+  public render() {
+    return (
+      <form action='' className='docs-TextFieldExample'>
+        <TextField
+          label='Fill in and submit this form. The page will reload and autocomplete suggestions will appear.'
+          name='example'
+          autoComplete='on'
+        />
+        <PrimaryButton type='submit'>Submit</PrimaryButton>
+      </form>
+    );
+  }
+}
\ No newline at end of file

From 9cdc7901357f243d01430152738e73119c724067 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 3 Jan 2018 03:23:13 -0800
Subject: [PATCH 1187/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../icons/icon-fonts_2018-01-02-16-47.json    | 11 -------
 ...-state-unmount-check_2017-12-15-05-43.json | 11 -------
 ...xtfield_autocomplete_2018-01-02-22-37.json | 11 -------
 ...in_image_load_events_2017-12-15-13-19.json | 11 -------
 packages/experiments/package.json             |  4 +--
 packages/icons/CHANGELOG.json                 | 14 +++++++++
 packages/icons/CHANGELOG.md                   |  9 +++++-
 packages/icons/package.json                   |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 31 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 14 ++++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 16 files changed, 76 insertions(+), 56 deletions(-)
 delete mode 100644 common/changes/@uifabric/icons/icon-fonts_2018-01-02-16-47.json
 delete mode 100644 common/changes/office-ui-fabric-react/lingge-BasePicker-update-state-unmount-check_2017-12-15-05-43.json
 delete mode 100644 common/changes/office-ui-fabric-react/magellan-textfield_autocomplete_2018-01-02-22-37.json
 delete mode 100644 common/changes/office-ui-fabric-react/mariust-personacoin_image_load_events_2017-12-15-13-19.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 0d18651a47f1c..a4f84c906da98 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.35.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.37.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index e02ad1fa0623d..e4cbf00b014db 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.35.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.37.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 860a0f8fe57a5..a8de5eeeedba8 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.35.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.37.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index d6e19720af377..1bbea8a896c67 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.35.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.37.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 556187420787a..045edfef766ee 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.35.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.37.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/@uifabric/icons/icon-fonts_2018-01-02-16-47.json b/common/changes/@uifabric/icons/icon-fonts_2018-01-02-16-47.json
deleted file mode 100644
index b60258d35706d..0000000000000
--- a/common/changes/@uifabric/icons/icon-fonts_2018-01-02-16-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/icons",
-      "comment": "Updated icon font files to match the hash in the src files.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/icons",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/lingge-BasePicker-update-state-unmount-check_2017-12-15-05-43.json b/common/changes/office-ui-fabric-react/lingge-BasePicker-update-state-unmount-check_2017-12-15-05-43.json
deleted file mode 100644
index b4f033e954cde..0000000000000
--- a/common/changes/office-ui-fabric-react/lingge-BasePicker-update-state-unmount-check_2017-12-15-05-43.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "add unmount check in suggestion promise",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lingge@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/magellan-textfield_autocomplete_2018-01-02-22-37.json b/common/changes/office-ui-fabric-react/magellan-textfield_autocomplete_2018-01-02-22-37.json
deleted file mode 100644
index 1547b6bfc7530..0000000000000
--- a/common/changes/office-ui-fabric-react/magellan-textfield_autocomplete_2018-01-02-22-37.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "TextField: Allows user to provide the `autocomplete` prop.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/mariust-personacoin_image_load_events_2017-12-15-13-19.json b/common/changes/office-ui-fabric-react/mariust-personacoin_image_load_events_2017-12-15-13-19.json
deleted file mode 100644
index 8f401c72091b5..0000000000000
--- a/common/changes/office-ui-fabric-react/mariust-personacoin_image_load_events_2017-12-15-13-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added optional callback for getting image load state change events from personacoin through Persona component",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mariust@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 44d5199b4d1d7..c571f4f3bdf46 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,8 +44,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.35.2 <6.0.0",
-    "@uifabric/icons": ">=5.3.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.37.0 <6.0.0",
+    "@uifabric/icons": ">=5.4.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/icons/CHANGELOG.json b/packages/icons/CHANGELOG.json
index 0f562f53e9215..458594bab786f 100644
--- a/packages/icons/CHANGELOG.json
+++ b/packages/icons/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/icons",
   "entries": [
+    {
+      "version": "5.4.0",
+      "tag": "@uifabric/icons_v5.4.0",
+      "date": "Wed, 03 Jan 2018 11:23:12 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "ca52fe19a919c0fe6630b7fc0f44aa1fdda98a98",
+            "comment": "Updated icon font files to match the hash in the src files."
+          }
+        ]
+      }
+    },
     {
       "version": "5.3.0",
       "tag": "@uifabric/icons_v5.3.0",
diff --git a/packages/icons/CHANGELOG.md b/packages/icons/CHANGELOG.md
index 4cff5b6f37385..a6cb3ad141863 100644
--- a/packages/icons/CHANGELOG.md
+++ b/packages/icons/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/icons
 
-This log was last generated on Thu, 30 Nov 2017 11:23:35 GMT and should not be manually modified.
+This log was last generated on Wed, 03 Jan 2018 11:23:12 GMT and should not be manually modified.
+
+## 5.4.0
+Wed, 03 Jan 2018 11:23:12 GMT
+
+### Minor changes
+
+- Updated icon font files to match the hash in the src files.
 
 ## 5.3.0
 Thu, 30 Nov 2017 11:23:35 GMT
diff --git a/packages/icons/package.json b/packages/icons/package.json
index c2bccf63bd5b0..4b06bffd0798c 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/icons",
-  "version": "5.3.0",
+  "version": "5.4.0",
   "description": "Office UI Fabric icon set.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index ad703e7779b76..1131bf89acc74 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,37 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.37.0",
+      "tag": "office-ui-fabric-react_v5.37.0",
+      "date": "Wed, 03 Jan 2018 11:23:12 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "MirandaGe <lingge@microsoft.com>",
+            "commit": "057b0bea9bf3aa9daab532c93bd9d9a206a085dd",
+            "comment": "add unmount check in suggestion promise"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "6d6a796f27a91408a065f330c08afc739075ae9f",
+            "comment": "TextField: Allows user to provide the `autocomplete` prop."
+          },
+          {
+            "author": "Marius Tennøe <mariust@outlook.com>",
+            "commit": "57763c505a6ebdf04577a3db70a521add6735cf4",
+            "comment": "Added optional callback for getting image load state change events from personacoin through Persona component"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/icons\" from `>=5.3.0 <6.0.0` to `>=5.4.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.36.0",
       "tag": "office-ui-fabric-react_v5.36.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index e78358c6eb279..aa839a6f159af 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,18 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 28 Dec 2017 11:23:50 GMT and should not be manually modified.
+This log was last generated on Wed, 03 Jan 2018 11:23:12 GMT and should not be manually modified.
+
+## 5.37.0
+Wed, 03 Jan 2018 11:23:12 GMT
+
+### Minor changes
+
+- TextField: Allows user to provide the `autocomplete` prop.
+- Added optional callback for getting image load state change events from personacoin through Persona component
+
+### Patches
+
+- add unmount check in suggestion promise
 
 ## 5.36.0
 Thu, 28 Dec 2017 11:23:50 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 31c8b8633e5d5..885e4d565bd65 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.36.0",
+  "version": "5.37.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -47,7 +47,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/icons": ">=5.3.0 <6.0.0",
+    "@uifabric/icons": ">=5.4.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.10.0 <6.0.0",
     "@uifabric/styling": ">=5.15.1 <6.0.0",
     "@uifabric/utilities": ">=5.6.1 <6.0.0",

From b6e016c4bbe6169761b6d8f1c0db5373650cf993 Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Wed, 3 Jan 2018 09:58:14 -0800
Subject: [PATCH 1188/1641] [ToolTip] Positioning fix for IE (#3594)

* Changed tooltip to inline-block

* Change file

* Update dev-tool_tip_position_fix_2017-12-18-17-51.json
---
 .../dev-tool_tip_position_fix_2017-12-18-17-51.json   | 11 +++++++++++
 .../src/components/Tooltip/TooltipHost.scss           |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/dev-tool_tip_position_fix_2017-12-18-17-51.json

diff --git a/common/changes/office-ui-fabric-react/dev-tool_tip_position_fix_2017-12-18-17-51.json b/common/changes/office-ui-fabric-react/dev-tool_tip_position_fix_2017-12-18-17-51.json
new file mode 100644
index 0000000000000..448634f03f852
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/dev-tool_tip_position_fix_2017-12-18-17-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ToolTop: Changed ToolTipHost to inline-block",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.scss b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.scss
index 560b98d22bff4..34c9bd6c04168 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.scss
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.scss
@@ -7,5 +7,5 @@
 // TooltipHost styles
 
 .host {
-  display: inline;
+  display: inline-block;
 }
\ No newline at end of file

From 2ac81fcaafe36e2b90649bffc3c2e86805a8ae46 Mon Sep 17 00:00:00 2001
From: John Lorenz <jcl47@duke.edu>
Date: Wed, 3 Jan 2018 11:02:08 -0800
Subject: [PATCH 1189/1641] adding johanna and john as code owners of the
 datemath utilities (#3660)

---
 .github/CODEOWNERS | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index 8df3ebf2e6a25..89f73608fcc4b 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -37,6 +37,10 @@ common/_semanticSlots.scss  @phkuo
 common/_themeOverrides.scss @phkuo
 common/_common.scss @phkuo
 
+### Utilities
+dateMath/     @johannao76 lorejoh12@gmail.com jolore@microsoft.com
+dateValues/   @johannao76 lorejoh12@gmail.com jolore@microsoft.com
+
 ## Components
 # ActivityItem/
 # Breadcrumb/

From 37551c0963930b3df892ad0b3bf0ba267b1e803b Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Wed, 3 Jan 2018 11:45:04 -0800
Subject: [PATCH 1190/1641] ContextualMenu: Added styling for disabled icons
 (#3661)

* ContextualMenu: Disabled icon stlyling

* Change file
---
 ...llan-disabledContextMenuIcon_2018-01-03-19-17.json | 11 +++++++++++
 .../ContextualMenu/ContextualMenu.classNames.ts       |  4 ++++
 .../ContextualMenu/ContextualMenu.styles.ts           |  3 +++
 3 files changed, 18 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/magellan-disabledContextMenuIcon_2018-01-03-19-17.json

diff --git a/common/changes/office-ui-fabric-react/magellan-disabledContextMenuIcon_2018-01-03-19-17.json b/common/changes/office-ui-fabric-react/magellan-disabledContextMenuIcon_2018-01-03-19-17.json
new file mode 100644
index 0000000000000..4b82467e3f531
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/magellan-disabledContextMenuIcon_2018-01-03-19-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: Added styling for disabled icon\"",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
index 682de1f8fcde4..9909db6f527bf 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
@@ -183,6 +183,10 @@ export const getItemClassNames = memoizeFunction((
       knownIcon && 'ms-ContextualMenu-iconColor ' && styles.iconColor,
       styles.icon,
       iconClassName,
+      disabled && [
+        'is-disabled',
+        styles.iconDisabled
+      ]
     ],
     checkmarkIcon: [
       'ms-ContextualMenu-checkmarkIcon',
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
index ff82757e696e1..97a49db1577b8 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
@@ -133,6 +133,9 @@ export const getMenuItemStyles = memoizeFunction((
         }
       }
     },
+    iconDisabled: {
+      color: semanticColors.disabledBodyText,
+    },
     checkmarkIcon: {
       color: semanticColors.bodySubtext,
       selectors: {

From 226cdf8b62ec9f32776bb153f4d151292a86ef77 Mon Sep 17 00:00:00 2001
From: Markus Krallinger <mkrallinger@gmail.com>
Date: Fri, 5 Jan 2018 09:15:09 +0100
Subject: [PATCH 1191/1641] Add onDismiss on the people picker (#3610)

* Added customizable onDismiss to the BasePicker

* Change request file added

* Implemented feedback from PR

* Add event to onDismiss

* Switched parameters

* Fixed typo

* Added missing whitespace
---
 ...-on-the-people-picker_2017-12-20-15-47.json | 11 +++++++++++
 .../src/components/pickers/BasePicker.tsx      | 18 ++++++++++++++----
 .../src/components/pickers/BasePicker.types.ts |  6 +++++-
 3 files changed, 30 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/add-onDismiss-on-the-people-picker_2017-12-20-15-47.json

diff --git a/common/changes/office-ui-fabric-react/add-onDismiss-on-the-people-picker_2017-12-20-15-47.json b/common/changes/office-ui-fabric-react/add-onDismiss-on-the-people-picker_2017-12-20-15-47.json
new file mode 100644
index 0000000000000..c483a93e5955b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/add-onDismiss-on-the-people-picker_2017-12-20-15-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added a customizable onDismiss to the BasePicker",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "makralli@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 77573b85fce2a..481adc98fc68d 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -118,13 +118,23 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   }
 
   @autobind
-  public dismissSuggestions() {
-    // Select the first suggestion if one is available when user leaves.
+  public dismissSuggestions(ev?: any) {
     let selectItemFunction = () => {
-      if (this.suggestionStore.hasSelectedSuggestion() && this.state.suggestedDisplayValue) {
-        this.addItemByIndex(0);
+      if (this.props.onDismiss) {
+        this.props.onDismiss(
+          ev,
+          this.suggestionStore.currentSuggestion ? this.suggestionStore.currentSuggestion.item : undefined
+        );
+      }
+
+      if (!ev || (ev && !ev.defaultPrevented)) {
+        // Select the first suggestion if one is available when user leaves.
+        if (this.suggestionStore.hasSelectedSuggestion() && this.state.suggestedDisplayValue) {
+          this.addItemByIndex(0);
+        }
       }
     };
+
     if (this.currentPromise) {
       this.currentPromise.then(() => selectItemFunction());
     } else {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts
index f569b79b5535f..4e15c252db4ca 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts
@@ -123,6 +123,10 @@ export interface IBasePickerProps<T> extends React.Props<any> {
    * A callback used to modify the input string.
    */
   onInputChange?: (input: string) => string;
+  /**
+   * A callback to override the default behavior of adding the selected suggestion on dismiss.
+   */
+  onDismiss?: (ev?: any, selectedItem?: T) => void;
 }
 
 export interface IBasePickerSuggestionsProps {
@@ -135,7 +139,7 @@ export interface IBasePickerSuggestionsProps {
    */
   suggestionsHeaderText?: string;
   /**
-   * The text that should appear at the top of the most recenty used box.
+   * The text that should appear at the top of the most recently used box.
    */
   mostRecentlyUsedHeaderText?: string;
   /**

From d60ef2442242d6f2a16ed0276e5af12c88c2651c Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 5 Jan 2018 11:14:59 +0000
Subject: [PATCH 1192/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...on-the-people-picker_2017-12-20-15-47.json | 11 --------
 ...ool_tip_position_fix_2017-12-18-17-51.json | 11 --------
 ...abledContextMenuIcon_2018-01-03-19-17.json | 11 --------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 26 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 14 +++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 12 files changed, 46 insertions(+), 41 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/add-onDismiss-on-the-people-picker_2017-12-20-15-47.json
 delete mode 100644 common/changes/office-ui-fabric-react/dev-tool_tip_position_fix_2017-12-18-17-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/magellan-disabledContextMenuIcon_2018-01-03-19-17.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index a4f84c906da98..4fa9cbe0de211 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.37.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.38.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index e4cbf00b014db..95668e6463a60 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.37.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.38.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index a8de5eeeedba8..7847bb9c59fca 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.37.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.38.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 1bbea8a896c67..8fa0aa9714287 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.37.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.38.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 045edfef766ee..48d719baed8c1 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.37.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.38.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/office-ui-fabric-react/add-onDismiss-on-the-people-picker_2017-12-20-15-47.json b/common/changes/office-ui-fabric-react/add-onDismiss-on-the-people-picker_2017-12-20-15-47.json
deleted file mode 100644
index c483a93e5955b..0000000000000
--- a/common/changes/office-ui-fabric-react/add-onDismiss-on-the-people-picker_2017-12-20-15-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added a customizable onDismiss to the BasePicker",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "makralli@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/dev-tool_tip_position_fix_2017-12-18-17-51.json b/common/changes/office-ui-fabric-react/dev-tool_tip_position_fix_2017-12-18-17-51.json
deleted file mode 100644
index 448634f03f852..0000000000000
--- a/common/changes/office-ui-fabric-react/dev-tool_tip_position_fix_2017-12-18-17-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ToolTop: Changed ToolTipHost to inline-block",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/magellan-disabledContextMenuIcon_2018-01-03-19-17.json b/common/changes/office-ui-fabric-react/magellan-disabledContextMenuIcon_2018-01-03-19-17.json
deleted file mode 100644
index 4b82467e3f531..0000000000000
--- a/common/changes/office-ui-fabric-react/magellan-disabledContextMenuIcon_2018-01-03-19-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: Added styling for disabled icon\"",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index c571f4f3bdf46..2791e926dde2f 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.37.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.38.0 <6.0.0",
     "@uifabric/icons": ">=5.4.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 1131bf89acc74..7a2b5a963385b 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.38.0",
+      "tag": "office-ui-fabric-react_v5.38.0",
+      "date": "Fri, 05 Jan 2018 11:14:58 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Markus Krallinger <mkrallinger@gmail.com>",
+            "commit": "226cdf8b62ec9f32776bb153f4d151292a86ef77",
+            "comment": "Added a customizable onDismiss to the BasePicker"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "b6e016c4bbe6169761b6d8f1c0db5373650cf993",
+            "comment": "ToolTop: Changed ToolTipHost to inline-block"
+          },
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "37551c0963930b3df892ad0b3bf0ba267b1e803b",
+            "comment": "ContextualMenu: Added styling for disabled icon\""
+          }
+        ]
+      }
+    },
     {
       "version": "5.37.0",
       "tag": "office-ui-fabric-react_v5.37.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index aa839a6f159af..2629932e9d325 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,18 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 03 Jan 2018 11:23:12 GMT and should not be manually modified.
+This log was last generated on Fri, 05 Jan 2018 11:14:58 GMT and should not be manually modified.
+
+## 5.38.0
+Fri, 05 Jan 2018 11:14:58 GMT
+
+### Minor changes
+
+- Added a customizable onDismiss to the BasePicker
+
+### Patches
+
+- ToolTop: Changed ToolTipHost to inline-block
+- ContextualMenu: Added styling for disabled icon"
 
 ## 5.37.0
 Wed, 03 Jan 2018 11:23:12 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 885e4d565bd65..9f3db0effbe41 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.37.0",
+  "version": "5.38.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From bf89b4c81ccfaff777e6915857508f60958af3e7 Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Fri, 5 Jan 2018 09:55:09 -0800
Subject: [PATCH 1193/1641] CommandBar: Allow disabled anchor and text items
 (#3659)

* CommandBar allow disabled anchor and text items

* Change file
---
 ...llan-disableHrefItem_2018-01-03-18-50.json | 11 ++++++++
 .../src/components/CommandBar/CommandBar.scss | 18 ++++++-------
 .../src/components/CommandBar/CommandBar.tsx  |  8 +++---
 .../examples/CommandBar.Basic.Example.tsx     | 27 +++++++++++++++----
 .../components/CommandBar/examples/data.ts    | 12 ++++-----
 5 files changed, 52 insertions(+), 24 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/magellan-disableHrefItem_2018-01-03-18-50.json

diff --git a/common/changes/office-ui-fabric-react/magellan-disableHrefItem_2018-01-03-18-50.json b/common/changes/office-ui-fabric-react/magellan-disableHrefItem_2018-01-03-18-50.json
new file mode 100644
index 0000000000000..6ca2a1c793009
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/magellan-disableHrefItem_2018-01-03-18-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "CommandBar: Allow disabled anchor and text items",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss
index 962e02d0cdac5..64842145f3487 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss
@@ -109,6 +109,15 @@ $SearchBox-sidePadding: 8px; // padding in input on left and right sides without
   &.itemLinkIsNoName {
     padding: 0 8px;
   }
+
+  &[disabled] {
+    color: $ms-color-neutralTertiaryAlt;
+    cursor: default;
+    pointer-events: none;
+    .itemIcon {
+      color: $ms-color-neutralTertiaryAlt;
+    }
+  }
 }
 
 .itemText {
@@ -162,15 +171,6 @@ $SearchBox-sidePadding: 8px; // padding in input on left and right sides without
   &.itemLinkIsExpanded:hover {
     background-color: $ms-color-neutralQuaternary;
   }
-
-  &[disabled] {
-    color: $ms-color-neutralTertiaryAlt;
-    cursor: default;
-    pointer-events: none;
-    .itemIcon {
-      color: $ms-color-neutralTertiaryAlt;
-    }
-  }
 }
 
 .itemIcon {
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index fec7c8564e04e..b2f7f23e7d16e 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -211,12 +211,13 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
         </button>
       );
     } else if (item.href) {
+      // Allow the disabled property on anchor elements for commandbar
       command = (
         <a
-          { ...getNativeProps(item, anchorProperties) }
+          { ...getNativeProps(item, anchorProperties.concat(['disabled'])) }
           id={ this._id + item.key }
           className={ className }
-          href={ item.href }
+          href={ item.disabled ? undefined : item.href }
           data-command-key={ itemKey }
           aria-haspopup={ hasSubmenuItems(item) }
           role='menuitem'
@@ -233,9 +234,10 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
         </a>
       );
     } else {
+      // Allow the disabled property on div elements for commandbar
       command = (
         <div
-          { ...getNativeProps(item, divProperties) }
+          { ...getNativeProps(item, divProperties.concat(['disabled'])) }
           id={ this._id + item.key }
           className={ className }
           data-command-key={ itemKey }
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
index f7d87a782f4a2..dc109995ec9b4 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
@@ -10,27 +10,36 @@ export class CommandBarBasicExample extends React.Component<any, any> {
     this.state = {
       isSearchBoxVisible: true,
       areNamesVisible: true,
-      areIconsVisible: true
+      areIconsVisible: true,
+      areItemsEnabled: true
     };
   }
 
   public render() {
     let { items, overflowItems, farItems } = this.props;
-    let { isSearchBoxVisible: searchBoxVisible, areIconsVisible: iconsVisible, areNamesVisible: namesVisible } = this.state;
+    let {
+      isSearchBoxVisible: searchBoxVisible,
+      areIconsVisible: iconsVisible,
+      areNamesVisible: namesVisible,
+      areItemsEnabled: itemsEnabled
+    } = this.state;
 
     let filteredItems = items.map((item: any) => assign({}, item, {
       iconOnly: !namesVisible,
-      icon: iconsVisible ? item.icon : ''
+      icon: iconsVisible ? item.icon : '',
+      disabled: !itemsEnabled
     }));
 
     let filteredOverflowItems = overflowItems.map((item: any) => assign({}, item, {
       iconOnly: !namesVisible,
-      icon: iconsVisible ? item.icon : ''
+      icon: iconsVisible ? item.icon : '',
+      disabled: !itemsEnabled
     }));
 
     let filteredFarItems = farItems.map((item: any) => assign({}, item, {
       iconOnly: !namesVisible,
-      icon: iconsVisible ? item.icon : ''
+      icon: iconsVisible ? item.icon : '',
+      disabled: !itemsEnabled
     }));
 
     return (
@@ -59,6 +68,14 @@ export class CommandBarBasicExample extends React.Component<any, any> {
           onText='Visible'
           offText='Hidden'
         />
+        <Toggle
+          label='Enable Items'
+          checked={ itemsEnabled }
+          // tslint:disable-next-line:jsx-no-lambda
+          onChanged={ areItemsEnabled => this.setState({ areItemsEnabled }) }
+          onText='Visible'
+          offText='Hidden'
+        />
         <CommandBar
           isSearchBoxVisible={ searchBoxVisible }
           searchPlaceholderText='Search...'
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/examples/data.ts b/packages/office-ui-fabric-react/src/components/CommandBar/examples/data.ts
index 369732a5b4e55..2d20e139a4118 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/examples/data.ts
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/examples/data.ts
@@ -25,7 +25,7 @@ export const items = [
     key: 'upload',
     name: 'Upload',
     icon: 'Upload',
-    href: 'https://mytenenat.sharepoint.com/teams/IT/BPU/',
+    href: 'https://microsoft.com',
     ['data-automation-id']: 'uploadButton'
   },
   {
@@ -38,14 +38,12 @@ export const items = [
     key: 'download',
     name: 'Download',
     icon: 'Download',
-    onClick: () => { return; }
   },
   {
-    key: 'disabled',
-    name: 'Disabled...',
-    icon: 'Cancel',
-    disabled: true,
-    onClick: () => { return; }
+    key: 'link',
+    name: 'Link',
+    icon: 'WindowsLogo',
+    href: 'https://microsoft.com',
   }
 ];
 

From adfcb2659b53d7d3dd7dccbf7bf760148fa65caa Mon Sep 17 00:00:00 2001
From: Kelsey Young <kelseyyoung4@gmail.com>
Date: Fri, 5 Jan 2018 14:40:11 -0800
Subject: [PATCH 1194/1641] Contextual Menu empty submenu changes (#3672)

* Contextual Menu submenus that have no items will have the chevron icon and call onMenuOpened
- Check only for the existence of a submenu, not that it has items
- Apply changes to CommandBar
- Add tests for icon check and onMenuOpened on click

* Add change file

* Simplify hasSubmenu logic
---
 ...mpty-submenu-changes_2018-01-05-19-17.json | 11 ++++
 .../components/CommandBar/CommandBar.test.tsx | 53 +++++++++++++++++++
 .../src/components/CommandBar/CommandBar.tsx  | 16 +++---
 .../ContextualMenu/ContextualMenu.test.tsx    | 53 +++++++++++++++++++
 .../ContextualMenu/ContextualMenu.tsx         | 24 ++++-----
 5 files changed, 136 insertions(+), 21 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/keyou-empty-submenu-changes_2018-01-05-19-17.json

diff --git a/common/changes/office-ui-fabric-react/keyou-empty-submenu-changes_2018-01-05-19-17.json b/common/changes/office-ui-fabric-react/keyou-empty-submenu-changes_2018-01-05-19-17.json
new file mode 100644
index 0000000000000..d59e28aeb776c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/keyou-empty-submenu-changes_2018-01-05-19-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Contextual Menu submenus that have no items will have chevron icon and call onMenuOpened",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "keyou@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
index 2f03eda007a6b..ac810998684d0 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
@@ -263,4 +263,57 @@ describe('CommandBar', () => {
       document.body.removeChild(renderContainer);
     }
   });
+
+  it('Command bar item shows chevron even if submenu has no items', () => {
+    const menuWithNoSubmenu: IContextualMenuItem[] = [
+      {
+        name: 'TestText 1',
+        key: 'TestKey1',
+        subMenuProps: {
+          items: []
+        }
+      },
+    ];
+
+    let renderedContent = ReactTestUtils.renderIntoDocument<CommandBar>(
+      <CommandBar
+        items={ menuWithNoSubmenu }
+      />
+    ) as React.Component<CommandBar, {}>;
+    let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
+
+    expect(menuItem.querySelector('.ms-CommandBarItem-chevronDown')).not.toEqual(null);
+  });
+
+  it('Command bar item onMenuOpened is called even if submenu has no items', () => {
+    let subMenuOpened = false;
+
+    const onSubMenuOpened = (): void => {
+      subMenuOpened = true;
+    };
+
+    const menuWithEmptySubMenu: IContextualMenuItem[] = [
+      {
+        name: 'TestText 1',
+        key: 'TestKey1',
+        subMenuProps: {
+          items: [],
+          onMenuOpened: onSubMenuOpened
+        }
+      }
+    ];
+
+    let renderedContent = ReactTestUtils.renderIntoDocument<CommandBar>(
+      <CommandBar
+        items={ menuWithEmptySubMenu }
+      />
+    ) as React.Component<CommandBar, {}>;
+
+    let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
+
+    ReactTestUtils.Simulate.click(menuItem);
+
+    expect(subMenuOpened).toEqual(true);
+  });
+
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index b2f7f23e7d16e..a40a2bb30501e 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -11,7 +11,7 @@ import {
 } from '../../Utilities';
 import { ICommandBar, ICommandBarProps, ICommandBarItemProps } from './CommandBar.types';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
-import { ContextualMenu, IContextualMenuProps, IContextualMenuItem, hasSubmenuItems } from '../../ContextualMenu';
+import { ContextualMenu, IContextualMenuProps, IContextualMenuItem, hasSubmenu } from '../../ContextualMenu';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import {
   Icon,
@@ -173,7 +173,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
     }
 
     const itemKey = item.key || String(index);
-    const isLink = item.onClick || hasSubmenuItems(item);
+    const isLink = item.onClick || hasSubmenu(item);
     const className = css(
       isLink ? ('ms-CommandBarItem-link ' + styles.itemLink) : ('ms-CommandBarItem-text ' + styles.itemText),
       !item.name && ('ms-CommandBarItem--noName ' + styles.itemLinkIsNoName),
@@ -192,8 +192,8 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
           className={ className }
           onClick={ this._onItemClick(item) }
           data-command-key={ itemKey }
-          aria-haspopup={ hasSubmenuItems(item) }
-          aria-expanded={ hasSubmenuItems(item) ? expandedMenuItemKey === item.key : undefined }
+          aria-haspopup={ hasSubmenu(item) }
+          aria-expanded={ hasSubmenu(item) ? expandedMenuItemKey === item.key : undefined }
           role='menuitem'
           aria-label={ ariaLabel }
         >
@@ -205,7 +205,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
               { item.name }
             </span>
           ) }
-          { hasSubmenuItems(item) ? (
+          { hasSubmenu(item) ? (
             <Icon className={ css('ms-CommandBarItem-chevronDown', styles.itemChevronDown) } iconName='ChevronDown' />
           ) : (null) }
         </button>
@@ -219,7 +219,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
           className={ className }
           href={ item.disabled ? undefined : item.href }
           data-command-key={ itemKey }
-          aria-haspopup={ hasSubmenuItems(item) }
+          aria-haspopup={ hasSubmenu(item) }
           role='menuitem'
           aria-label={ ariaLabel }
         >
@@ -241,7 +241,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
           id={ this._id + item.key }
           className={ className }
           data-command-key={ itemKey }
-          aria-haspopup={ hasSubmenuItems(item) }
+          aria-haspopup={ hasSubmenu(item) }
           aria-label={ ariaLabel }
         >
           { (hasIcon) ? this._renderIcon(item) : (null) }
@@ -373,7 +373,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
 
   private _onItemClick(item: IContextualMenuItem): (ev: React.MouseEvent<HTMLButtonElement>) => void {
     return (ev: React.MouseEvent<HTMLButtonElement>): void => {
-      if (item.key === this.state.expandedMenuItemKey || !hasSubmenuItems(item)) {
+      if (item.key === this.state.expandedMenuItemKey || !hasSubmenu(item)) {
         this._onContextMenuDismiss();
       } else {
         this.setState({
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
index 8d0c5672b7ee3..628199910bb4e 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
@@ -508,6 +508,59 @@ describe('ContextualMenu', () => {
     expect(menuMountedFirst).toEqual(false);
   });
 
+  it('Contextual Menu submenu has chrevron icon even if submenu has no items', () => {
+    const menuWithEmptySubMenu: IContextualMenuItem[] = [
+      {
+        name: 'TestText 1',
+        key: 'TestKey1',
+        subMenuProps: {
+          items: []
+        }
+      }
+    ];
+
+    ReactTestUtils.renderIntoDocument<ContextualMenu>(
+      <ContextualMenu
+        items={ menuWithEmptySubMenu }
+      />
+    );
+
+    let menuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
+
+    expect(menuItem.querySelector('.ms-ContextualMenu-submenuIcon')).not.toEqual(null);
+  });
+
+  it('Contextual Menu submenu calls onMenuOpened on click even if submenu has no items', () => {
+    let subMenuOpened = false;
+
+    const onSubMenuOpened = (): void => {
+      subMenuOpened = true;
+    };
+
+    const menuWithEmptySubMenu: IContextualMenuItem[] = [
+      {
+        name: 'TestText 1',
+        key: 'TestKey1',
+        subMenuProps: {
+          items: [],
+          onMenuOpened: onSubMenuOpened
+        }
+      }
+    ];
+
+    ReactTestUtils.renderIntoDocument<ContextualMenu>(
+      <ContextualMenu
+        items={ menuWithEmptySubMenu }
+      />
+    );
+
+    let menuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
+
+    ReactTestUtils.Simulate.click(menuItem);
+
+    expect(subMenuOpened).toEqual(true);
+  });
+
   describe('canAnyMenuItemsCheck', () => {
     it('returns false when there are no checkable menu items', () => {
       const items: IContextualMenuItem[] = [
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 686b89ab34b93..2ab90b4c2c58c 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -47,10 +47,8 @@ export interface IContextualMenuState {
   submenuDirection?: DirectionalHint;
 }
 
-export function hasSubmenuItems(item: IContextualMenuItem) {
-  let submenuItems = getSubmenuItems(item);
-
-  return !!(submenuItems && submenuItems.length);
+export function hasSubmenu(item: IContextualMenuItem) {
+  return !!(item.subMenuProps || item.items);
 }
 
 export function getSubmenuItems(item: IContextualMenuItem) {
@@ -450,7 +448,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       return this._renderAnchorMenuItem(item, classNames, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons);
     }
 
-    if (item.split && hasSubmenuItems(item)) {
+    if (item.split && hasSubmenu(item)) {
       return this._renderSplitButton(item, classNames, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons);
     }
 
@@ -508,7 +506,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     const itemButtonProperties = {
       className: classNames.root,
       onClick: this._onItemClick.bind(this, item),
-      onKeyDown: hasSubmenuItems(item) ? this._onItemKeyDown.bind(this, item) : null,
+      onKeyDown: hasSubmenu(item) ? this._onItemKeyDown.bind(this, item) : null,
       onMouseEnter: this._onItemMouseEnter.bind(this, item),
       onMouseLeave: this._onMouseItemLeave.bind(this, item),
       onMouseDown: (ev: any) => this._onItemMouseDown(item, ev),
@@ -517,9 +515,9 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       href: item.href,
       title: item.title,
       'aria-label': ariaLabel,
-      'aria-haspopup': hasSubmenuItems(item) || null,
+      'aria-haspopup': hasSubmenu(item) || null,
       'aria-owns': item.key === expandedMenuItemKey ? subMenuId : null,
-      'aria-expanded': hasSubmenuItems(item) ? item.key === expandedMenuItemKey : null,
+      'aria-expanded': hasSubmenu(item) ? item.key === expandedMenuItemKey : null,
       'aria-checked': isChecked,
       'aria-posinset': focusableElementIndex + 1,
       'aria-setsize': totalItemCount,
@@ -634,7 +632,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
           <span className={ classNames.label }>{ item.name }</span>
         ) : null
         }
-        { hasSubmenuItems(item) ? (
+        { hasSubmenu(item) ? (
           <Icon
             iconName={ getRTL() ? 'ChevronLeft' : 'ChevronRight' }
             { ...item.submenuIconProps }
@@ -724,7 +722,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     let targetElement = ev.currentTarget as HTMLElement;
 
     if (item.key !== this.state.expandedMenuItemKey) {
-      if (hasSubmenuItems(item)) {
+      if (hasSubmenu(item)) {
         this._enterTimerId = this._async.setTimeout(() => this._onItemSubMenuExpand(item, targetElement), 500);
       } else {
         this._enterTimerId = this._async.setTimeout(() => this._onSubMenuDismiss(ev), 500);
@@ -743,7 +741,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     }
 
     if (item.key !== this.state.expandedMenuItemKey) {
-      if (hasSubmenuItems(item)) {
+      if (hasSubmenu(item)) {
         this._enterTimerId = this._async.setTimeout(() => this._onItemSubMenuExpand(item, targetElement), 500);
       } else {
         this._enterTimerId = this._async.setTimeout(() => this._onSubMenuDismiss(ev), 500);
@@ -764,7 +762,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       this._enterTimerId = undefined;
     }
 
-    if (item.key === this.state.expandedMenuItemKey && hasSubmenuItems(item)) {
+    if (item.key === this.state.expandedMenuItemKey && hasSubmenu(item)) {
       return;
     }
 
@@ -789,7 +787,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   private _onItemClick(item: IContextualMenuItem, ev: React.MouseEvent<HTMLElement>) {
     let items = getSubmenuItems(item);
 
-    if (!items || !items.length) { // This is an item without a menu. Click it.
+    if (!hasSubmenu(item) && (!items || !items.length)) { // This is an item without a menu. Click it.
       this._executeItemClick(item, ev);
     } else {
       if (item.key === this.state.expandedMenuItemKey) { // This has an expanded sub menu. collapse it.

From b69a4aff021e8b0f76d6e8e5908571271af1ff7e Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Sun, 7 Jan 2018 14:58:47 -0800
Subject: [PATCH 1195/1641] Rating: focus issues (#3668)

* Fixed rating focus issues

* Updated snapshot and added change file
---
 ...magellan-ratingFocus_2018-01-04-21-53.json | 11 +++++
 .../src/components/Rating/Rating.tsx          | 41 ++++++++++++++-----
 .../Rating/__snapshots__/Rating.test.tsx.snap |  8 +++-
 .../Rating/examples/Rating.Basic.Example.tsx  |  2 +-
 4 files changed, 50 insertions(+), 12 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/magellan-ratingFocus_2018-01-04-21-53.json

diff --git a/common/changes/office-ui-fabric-react/magellan-ratingFocus_2018-01-04-21-53.json b/common/changes/office-ui-fabric-react/magellan-ratingFocus_2018-01-04-21-53.json
new file mode 100644
index 0000000000000..66cbc1f893d65
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/magellan-ratingFocus_2018-01-04-21-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Rating: Set default active element and fixed focusability",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx b/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
index dc4c1960f7a6e..2074f7d54ed96 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
@@ -70,24 +70,38 @@ export class Rating extends BaseComponent<IRatingProps, IRatingState> {
   }
 
   public render() {
+    let id = this._id;
     let stars = [];
-
-    for (let i = this.props.min as number; i <= (this.props.max as number); i++) {
+    let starIds = [];
+    let {
+      disabled,
+      getAriaLabel,
+      max,
+      min,
+      rating,
+      readOnly,
+      size
+    } = this.props;
+
+    for (let i = min as number; i <= (max as number); i++) {
       let ratingStarProps: IRatingStarProps = {
         fillPercentage: this._getFillingPercentage(i),
-        disabled: this.props.disabled ? true : false
+        disabled: disabled ? true : false
       };
 
+      starIds.push(this._getStarId(i - 1));
+
       stars.push(
         <button
           className={ css('ms-Rating-button', styles.ratingButton, {
-            ['ms-Rating--large ' + styles.rootIsLarge]: this.props.size === RatingSize.Large,
-            ['ms-Rating--small ' + styles.rootIsSmall]: this.props.size !== RatingSize.Large
+            ['ms-Rating--large ' + styles.rootIsLarge]: size === RatingSize.Large,
+            ['ms-Rating--small ' + styles.rootIsSmall]: size !== RatingSize.Large
           }) }
+          id={ starIds[i - 1] }
           key={ i }
-          { ...((i === Math.ceil(this.state.rating as number)) ? { 'data-is-current': true } : {}) }
+          { ...((i === Math.ceil(rating as number)) ? { 'data-is-current': true } : {}) }
           onFocus={ this._onFocus.bind(this, i) }
-          disabled={ this.props.disabled || this.props.readOnly ? true : false }
+          disabled={ disabled || readOnly ? true : false }
           role='presentation'
         >
           { this._getLabel(i) }
@@ -99,19 +113,26 @@ export class Rating extends BaseComponent<IRatingProps, IRatingState> {
     return (
       <div
         className={ css('ms-Rating-star') }
-        aria-label={ this.props.getAriaLabel ? this.props.getAriaLabel(this.state.rating ? this.state.rating : 0, this.props.max as number) : '' }
+        aria-label={ getAriaLabel ? getAriaLabel(rating ? rating : 0, max as number) : '' }
+        id={ id }
       >
         <FocusZone
           direction={ FocusZoneDirection.horizontal }
-          tabIndex={ this.props.readOnly ? 0 : -1 }
+          tabIndex={ readOnly ? 0 : -1 }
+          data-is-focusable={ readOnly ? true : false }
+          defaultActiveElement={ rating ? starIds[rating - 1] && '#' + starIds[rating - 1] : undefined }
           className={ css('ms-Rating-focuszone', styles.ratingFocusZone) }
         >
           { stars }
         </FocusZone>
-      </div>
+      </div >
     );
   }
 
+  private _getStarId(index: number): string {
+    return this._id + '-star-' + index;
+  }
+
   private _onFocus(value: number, ev: React.FocusEvent<HTMLElement>): void {
     this.setState({
       rating: value
diff --git a/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap
index 51c2d080a6bdb..09dcff4c2e40a 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap
@@ -4,12 +4,14 @@ exports[`Rating Renders Rating correctly 1`] = `
 <div
   aria-label=""
   className="ms-Rating-star"
+  id="Rating0"
 >
   <div
     aria-describedby={undefined}
     aria-labelledby={undefined}
     className="ms-FocusZone ms-Rating-focuszone"
     data-focuszone-id="FocusZone2"
+    data-is-focusable={false}
     onFocus={[Function]}
     onKeyDown={[Function]}
     onMouseDownCapture={[Function]}
@@ -18,8 +20,8 @@ exports[`Rating Renders Rating correctly 1`] = `
   >
     <button
       className="ms-Rating-button ms-Rating--small undefined"
-      data-is-current={true}
       disabled={false}
+      id="Rating0-star-0"
       onFocus={[Function]}
       role="presentation"
     >
@@ -66,6 +68,7 @@ exports[`Rating Renders Rating correctly 1`] = `
     <button
       className="ms-Rating-button ms-Rating--small undefined"
       disabled={false}
+      id="Rating0-star-1"
       onFocus={[Function]}
       role="presentation"
     >
@@ -112,6 +115,7 @@ exports[`Rating Renders Rating correctly 1`] = `
     <button
       className="ms-Rating-button ms-Rating--small undefined"
       disabled={false}
+      id="Rating0-star-2"
       onFocus={[Function]}
       role="presentation"
     >
@@ -158,6 +162,7 @@ exports[`Rating Renders Rating correctly 1`] = `
     <button
       className="ms-Rating-button ms-Rating--small undefined"
       disabled={false}
+      id="Rating0-star-3"
       onFocus={[Function]}
       role="presentation"
     >
@@ -204,6 +209,7 @@ exports[`Rating Renders Rating correctly 1`] = `
     <button
       className="ms-Rating-button ms-Rating--small undefined"
       disabled={false}
+      id="Rating0-star-4"
       onFocus={[Function]}
       role="presentation"
     >
diff --git a/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx
index 7cb279e06f51c..0d6fd889b73ce 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx
@@ -18,7 +18,7 @@ export class RatingBasicExample extends React.Component<{}, {
 
     this.state = {
       largeStarRating: undefined,
-      smallStarRating: undefined,
+      smallStarRating: 3,
       tenStarRating: undefined
     };
   }

From 0c94ca402f68f29c0033a9f4d96857a123c87498 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 8 Jan 2018 11:13:51 +0000
Subject: [PATCH 1196/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...mpty-submenu-changes_2018-01-05-19-17.json | 11 ---------
 ...llan-disableHrefItem_2018-01-03-18-50.json | 11 ---------
 ...magellan-ratingFocus_2018-01-04-21-53.json | 11 ---------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 24 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 11 ++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 12 files changed, 41 insertions(+), 41 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/keyou-empty-submenu-changes_2018-01-05-19-17.json
 delete mode 100644 common/changes/office-ui-fabric-react/magellan-disableHrefItem_2018-01-03-18-50.json
 delete mode 100644 common/changes/office-ui-fabric-react/magellan-ratingFocus_2018-01-04-21-53.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 4fa9cbe0de211..e546b26cafe4a 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.38.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.38.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 95668e6463a60..299c72173539c 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.38.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.38.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 7847bb9c59fca..008266ad0b4c9 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.38.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.38.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 8fa0aa9714287..857791970630e 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.38.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.38.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 48d719baed8c1..dcb61d5e0520d 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.38.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.38.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/office-ui-fabric-react/keyou-empty-submenu-changes_2018-01-05-19-17.json b/common/changes/office-ui-fabric-react/keyou-empty-submenu-changes_2018-01-05-19-17.json
deleted file mode 100644
index d59e28aeb776c..0000000000000
--- a/common/changes/office-ui-fabric-react/keyou-empty-submenu-changes_2018-01-05-19-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Contextual Menu submenus that have no items will have chevron icon and call onMenuOpened",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "keyou@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/magellan-disableHrefItem_2018-01-03-18-50.json b/common/changes/office-ui-fabric-react/magellan-disableHrefItem_2018-01-03-18-50.json
deleted file mode 100644
index 6ca2a1c793009..0000000000000
--- a/common/changes/office-ui-fabric-react/magellan-disableHrefItem_2018-01-03-18-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "CommandBar: Allow disabled anchor and text items",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/magellan-ratingFocus_2018-01-04-21-53.json b/common/changes/office-ui-fabric-react/magellan-ratingFocus_2018-01-04-21-53.json
deleted file mode 100644
index 66cbc1f893d65..0000000000000
--- a/common/changes/office-ui-fabric-react/magellan-ratingFocus_2018-01-04-21-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Rating: Set default active element and fixed focusability",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 2791e926dde2f..8abcf981e9b82 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.38.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.38.1 <6.0.0",
     "@uifabric/icons": ">=5.4.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 7a2b5a963385b..4820cf3077bc8 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.38.1",
+      "tag": "office-ui-fabric-react_v5.38.1",
+      "date": "Mon, 08 Jan 2018 11:13:51 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Kelsey Young <kelseyyoung4@gmail.com>",
+            "commit": "adfcb2659b53d7d3dd7dccbf7bf760148fa65caa",
+            "comment": "Contextual Menu submenus that have no items will have chevron icon and call onMenuOpened"
+          },
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "bf89b4c81ccfaff777e6915857508f60958af3e7",
+            "comment": "CommandBar: Allow disabled anchor and text items"
+          },
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "b69a4aff021e8b0f76d6e8e5908571271af1ff7e",
+            "comment": "Rating: Set default active element and fixed focusability"
+          }
+        ]
+      }
+    },
     {
       "version": "5.38.0",
       "tag": "office-ui-fabric-react_v5.38.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 2629932e9d325..d9084ce4f8e79 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,15 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 05 Jan 2018 11:14:58 GMT and should not be manually modified.
+This log was last generated on Mon, 08 Jan 2018 11:13:51 GMT and should not be manually modified.
+
+## 5.38.1
+Mon, 08 Jan 2018 11:13:51 GMT
+
+### Patches
+
+- Contextual Menu submenus that have no items will have chevron icon and call onMenuOpened
+- CommandBar: Allow disabled anchor and text items
+- Rating: Set default active element and fixed focusability
 
 ## 5.38.0
 Fri, 05 Jan 2018 11:14:58 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 9f3db0effbe41..0dd89af5e4bee 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.38.0",
+  "version": "5.38.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 41bc26b7f5663aa84842e4643e2cb48af08532c3 Mon Sep 17 00:00:00 2001
From: Mark Polak <mark@thedutchies.com>
Date: Mon, 8 Jan 2018 19:30:45 +0100
Subject: [PATCH 1197/1641] Filetype icon registration options (#3649)

* Add icon registration options for file type icons

* Add change request file
---
 ...pe-icon-registration-options_2018-01-02-11-57.json | 11 +++++++++++
 .../file-type-icons/src/initializeFileTypeIcons.tsx   | 10 +++++-----
 2 files changed, 16 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/@uifabric/file-type-icons/filetype-icon-registration-options_2018-01-02-11-57.json

diff --git a/common/changes/@uifabric/file-type-icons/filetype-icon-registration-options_2018-01-02-11-57.json b/common/changes/@uifabric/file-type-icons/filetype-icon-registration-options_2018-01-02-11-57.json
new file mode 100644
index 0000000000000..84d2fb84a8478
--- /dev/null
+++ b/common/changes/@uifabric/file-type-icons/filetype-icon-registration-options_2018-01-02-11-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/file-type-icons",
+      "comment": "Adds possibility to pass options for icon registration when initializing file type icons",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/file-type-icons",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/packages/file-type-icons/src/initializeFileTypeIcons.tsx b/packages/file-type-icons/src/initializeFileTypeIcons.tsx
index f8b557e88296b..d634e5b3822a9 100644
--- a/packages/file-type-icons/src/initializeFileTypeIcons.tsx
+++ b/packages/file-type-icons/src/initializeFileTypeIcons.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { registerIcons } from '@uifabric/styling/lib/index';
+import { registerIcons, IIconOptions } from '@uifabric/styling/lib/index';
 import { FileTypeIconMap } from './FileTypeIconMap';
 
 const PNG_SUFFIX = '_png';
@@ -8,13 +8,13 @@ const SVG_SUFFIX = '_svg';
 const DEFAULT_BASE_URL = 'https://spoprod-a.akamaihd.net/files/fabric/assets/item-types/';
 const ICON_SIZES: number[] = [16, 20, 32, 40, 48, 96];
 
-export function initializeFileTypeIcons(baseUrl: string = DEFAULT_BASE_URL): void {
+export function initializeFileTypeIcons(baseUrl: string = DEFAULT_BASE_URL, options?: Partial<IIconOptions>): void {
   ICON_SIZES.forEach((size: number) => {
-    _initializeIcons(baseUrl, size);
+    _initializeIcons(baseUrl, size, options);
   });
 }
 
-function _initializeIcons(baseUrl: string, size: number): void {
+function _initializeIcons(baseUrl: string, size: number, options?: Partial<IIconOptions>): void {
   const iconTypes: string[] = Object.keys(FileTypeIconMap);
   const fileTypeIcons: { [key: string]: JSX.Element } = {};
 
@@ -58,5 +58,5 @@ function _initializeIcons(baseUrl: string, size: number): void {
       overflow: 'hidden'
     },
     icons: fileTypeIcons
-  });
+  }, options);
 }

From fe2323d33d29afd794cf9246de10954e013d479f Mon Sep 17 00:00:00 2001
From: Peter Jahn <pejahn@microsoft.com>
Date: Mon, 8 Jan 2018 11:05:58 -0800
Subject: [PATCH 1198/1641] Update CODEOWNERS (#3674)

Add @aditima as codeowner for GroupedList control. Thanks @aditima!
---
 .github/CODEOWNERS | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index 89f73608fcc4b..dfd0137de54d8 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -63,7 +63,7 @@ DatePicker/   @johannao76 lorejoh12@gmail.com jolore@microsoft.com
 # FacePile/
 # FocusTrapZone/
 # FocusZone/
-# GroupedList/
+GroupedList/  @aditima
 HoverCard/   @atneik @Jahnp
 # Icon/
 # Image/

From 91ff28f32139a07528e0d4cec42fd5641c41dc1c Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 9 Jan 2018 11:12:25 +0000
Subject: [PATCH 1199/1641] Applying package updates.

---
 ...icon-registration-options_2018-01-02-11-57.json | 11 -----------
 packages/experiments/package.json                  |  2 +-
 packages/file-type-icons/CHANGELOG.json            | 14 ++++++++++++++
 packages/file-type-icons/CHANGELOG.md              |  9 ++++++++-
 packages/file-type-icons/package.json              |  2 +-
 5 files changed, 24 insertions(+), 14 deletions(-)
 delete mode 100644 common/changes/@uifabric/file-type-icons/filetype-icon-registration-options_2018-01-02-11-57.json

diff --git a/common/changes/@uifabric/file-type-icons/filetype-icon-registration-options_2018-01-02-11-57.json b/common/changes/@uifabric/file-type-icons/filetype-icon-registration-options_2018-01-02-11-57.json
deleted file mode 100644
index 84d2fb84a8478..0000000000000
--- a/common/changes/@uifabric/file-type-icons/filetype-icon-registration-options_2018-01-02-11-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/file-type-icons",
-      "comment": "Adds possibility to pass options for icon registration when initializing file type icons",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/file-type-icons",
-  "email": "mark@thedutchies.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 8abcf981e9b82..956dc2b7b57bc 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -30,7 +30,7 @@
     "@types/enzyme-adapter-react-16": "1.0.1",
     "@types/webpack-env": "1.13.0",
     "@uifabric/example-app-base": ">=5.2.0 <6.0.0",
-    "@uifabric/file-type-icons": ">=0.1.0 <1.0.0",
+    "@uifabric/file-type-icons": ">=0.2.0 <1.0.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.1.0 <6.0.0",
     "es6-weak-map": "^2.0.2",
     "enzyme": "^3.2.0",
diff --git a/packages/file-type-icons/CHANGELOG.json b/packages/file-type-icons/CHANGELOG.json
index b9ce4d25ca27e..534fb9e4479dc 100644
--- a/packages/file-type-icons/CHANGELOG.json
+++ b/packages/file-type-icons/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/file-type-icons",
   "entries": [
+    {
+      "version": "0.2.0",
+      "tag": "@uifabric/file-type-icons_v0.2.0",
+      "date": "Tue, 09 Jan 2018 11:12:24 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Mark Polak <mark@thedutchies.com>",
+            "commit": "41bc26b7f5663aa84842e4643e2cb48af08532c3",
+            "comment": "Adds possibility to pass options for icon registration when initializing file type icons"
+          }
+        ]
+      }
+    },
     {
       "version": "0.1.0",
       "tag": "@uifabric/file-type-icons_v0.1.0",
diff --git a/packages/file-type-icons/CHANGELOG.md b/packages/file-type-icons/CHANGELOG.md
index 0a670e8729342..5b608d94bdc91 100644
--- a/packages/file-type-icons/CHANGELOG.md
+++ b/packages/file-type-icons/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/file-type-icons
 
-This log was last generated on Mon, 04 Dec 2017 17:27:54 GMT and should not be manually modified.
+This log was last generated on Tue, 09 Jan 2018 11:12:24 GMT and should not be manually modified.
+
+## 0.2.0
+Tue, 09 Jan 2018 11:12:24 GMT
+
+### Minor changes
+
+- Adds possibility to pass options for icon registration when initializing file type icons
 
 ## 0.1.0
 Mon, 04 Dec 2017 17:27:54 GMT
diff --git a/packages/file-type-icons/package.json b/packages/file-type-icons/package.json
index 7d561b693104d..6164cb31b887d 100644
--- a/packages/file-type-icons/package.json
+++ b/packages/file-type-icons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/file-type-icons",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "Office UI Fabric file type icon set.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From e0f80abf26836c11e4fbb62c798ef15d92d2416d Mon Sep 17 00:00:00 2001
From: Stanley Yao <stanley.yao@microsoft.com>
Date: Tue, 9 Jan 2018 10:54:10 -0800
Subject: [PATCH 1200/1641] Add audo expand on focus for Combobox (#3677)

* Add expand on focus for Combobox

* change file

* Make test event handler a method

* Refactor away from lamda inside jsx

* Refactor away from lamda inside jsx

* Fix a typo
---
 .../expand_2018-01-08-11-10.json              | 11 ++++++++++
 .../src/components/ComboBox/ComboBox.tsx      | 21 +++++++++++++++++--
 .../src/components/ComboBox/ComboBox.types.ts |  2 +-
 .../examples/ComboBox.Basic.Example.tsx       | 21 ++++++++++++++++++-
 4 files changed, 51 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/expand_2018-01-08-11-10.json

diff --git a/common/changes/office-ui-fabric-react/expand_2018-01-08-11-10.json b/common/changes/office-ui-fabric-react/expand_2018-01-08-11-10.json
new file mode 100644
index 0000000000000..76d1abeda3386
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/expand_2018-01-08-11-10.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add auto expand on focus for Combobox",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "stanleyy@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 17a89a347b9c4..315d4690ff8c8 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -312,7 +312,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
             onBlur={ this._onBlur }
             onKeyDown={ this._onInputKeyDown }
             onKeyUp={ this._onInputKeyUp }
-            onClick={ allowFreeform ? this.focus : this._onComboBoxClick }
+            onClick={ this._onBaseAutofillClick }
             onInputValueChange={ this._onInputChange }
             aria-expanded={ isOpen }
             aria-autocomplete={ (!disabled && autoComplete === 'on') }
@@ -370,9 +370,14 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * Set focus on the input
    */
   @autobind
-  public focus() {
+  public focus(shouldOpenOnFocus?: boolean) {
     if (this._comboBox) {
       this._comboBox.focus();
+      if (shouldOpenOnFocus) {
+        this.setState({
+          isOpen: true
+        });
+      }
     }
   }
 
@@ -1502,6 +1507,18 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     }
   }
 
+  /**
+   * Click handler for the autofill.
+   */
+  @autobind
+  private _onBaseAutofillClick() {
+    if (this.props.allowFreeform) {
+      this.focus(true);
+    } else {
+       this._onComboBoxClick();
+    }
+  }
+
   /**
  * Get the styles for the current option.
  * @param item Item props for the current option
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
index b803d5612e05b..2abc4a44c830c 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
@@ -15,7 +15,7 @@ export interface IComboBox {
    * Sets focus to the input in the comboBox
    * @returns True if focus could be set, false if no operation was taken.
    */
-  focus(): boolean;
+  focus(shouldOpenOnFocus?: boolean): boolean;
 }
 
 export interface IComboBoxOption extends ISelectableOption {
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
index 2eb2e593da54a..b60a6d25d7c0c 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
@@ -11,6 +11,8 @@ import {
   autobind
 } from 'office-ui-fabric-react/lib/Utilities';
 import { SelectableOptionMenuItemType } from 'office-ui-fabric-react/lib/utilities/selectableOption/SelectableOption.types';
+import { IComboBox } from '../ComboBox.types';
+import { PrimaryButton } from '../../../Button';
 
 export class ComboBoxBasicExample extends React.Component<{}, {
   options: IComboBoxOption[];
@@ -41,6 +43,7 @@ export class ComboBoxBasicExample extends React.Component<{}, {
   };
 
   private scaleOptions: IComboBoxOption[] = [];
+  private _basicCombobox: IComboBox;
 
   constructor(props: {}) {
     super(props);
@@ -73,11 +76,17 @@ export class ComboBoxBasicExample extends React.Component<{}, {
           autoComplete='on'
           options={ this._testOptions }
           onRenderOption={ this._onRenderFontOption }
+          componentRef={ this._basicComboBoxComponentRef }
           // tslint:disable:jsx-no-lambda
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
           onMenuOpen={ () => console.log('ComboBox menu opened') }
-        // tslint:enable:jsx-no-lambda
+          // tslint:enable:jsx-no-lambda
+        />
+
+        <PrimaryButton
+          text='Set focus'
+          onClick={ this._basicComboBoxOnClick }
         />
 
         <ComboBox
@@ -303,4 +312,14 @@ export class ComboBoxBasicExample extends React.Component<{}, {
       });
     }
   }
+
+  @autobind
+  private _basicComboBoxOnClick(): void {
+    this._basicCombobox.focus(true);
+  }
+
+  @autobind
+  private _basicComboBoxComponentRef(component: IComboBox) {
+    this._basicCombobox = component;
+  }
 }

From 3626565be858e54cbb8ddcb617d62fa52823254a Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Tue, 9 Jan 2018 10:54:29 -0800
Subject: [PATCH 1201/1641] [Rating] getStyles (#3662)

* Rating: convert to getStyles

* Change files

* Fix lint issue

* Fixed tests and updated snapshot

* Changed semantic colors

* Fixed example color

* Changed back star color

* Use palette for star back

* Added focus style to rating button

* fix build
---
 .../master_2018-01-04-01-10.json              |  11 +
 .../src/components/Rating/Rating.scss         |  70 ---
 .../src/components/Rating/Rating.styles.ts    | 112 +++++
 .../src/components/Rating/Rating.test.tsx     |  27 +-
 .../src/components/Rating/Rating.tsx          | 192 +-------
 .../src/components/Rating/Rating.types.ts     |  31 ++
 .../src/components/Rating/RatingBase.tsx      | 203 ++++++++
 .../Rating/__snapshots__/Rating.test.tsx.snap | 434 +++++++++++++++++-
 .../Rating/examples/Rating.Basic.Example.tsx  |  36 +-
 9 files changed, 834 insertions(+), 282 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/master_2018-01-04-01-10.json
 delete mode 100644 packages/office-ui-fabric-react/src/components/Rating/Rating.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/Rating/Rating.styles.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Rating/RatingBase.tsx

diff --git a/common/changes/office-ui-fabric-react/master_2018-01-04-01-10.json b/common/changes/office-ui-fabric-react/master_2018-01-04-01-10.json
new file mode 100644
index 0000000000000..8584c987033d4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2018-01-04-01-10.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Rating: Convert to getstyles",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.scss b/packages/office-ui-fabric-react/src/components/Rating/Rating.scss
deleted file mode 100644
index b1feebd3460c5..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.scss
+++ /dev/null
@@ -1,70 +0,0 @@
-@import '../../common/common';
-
-$Rating-defaultColor: $ms-color-neutralTertiary;
-$Rating-selectedColor: $ms-color-black;
-$Rating-disabledColor: $ms-color-neutralTertiaryAlt;
-
-$Rating-smallIconSize: 16px;
-$Rating-largeIconSize: 20px;
-
-.ratingStar {
-  display: inline-block;
-  position: relative;
-}
-
-.ratingStarBack {
-  color: $Rating-defaultColor;
-  width: 100%;
-
-  &.ratingStarDisabled {
-    color: $Rating-disabledColor;
-    @include high-contrast {
-      color: GrayText;
-    }
-  }
-}
-
-.ratingStarFront {
-  position: absolute;
-  height: 100%;
-  left: 0;
-  top: 0;
-  text-align: center;
-  vertical-align: middle;
-  overflow: hidden;
-  color: $Rating-selectedColor;
-  @include high-contrast {
-    color: Highlight;
-  }
-}
-
-.ratingButton {
-  background: none;
-  margin: 3px 3px 0px 0px;
-  padding: 0px;
-  border: none;
-  cursor: pointer;
-  
-  &:disabled, &[disabled] {
-	cursor: default;
-  }
-}
-
-.rootIsSmall  {
-    font-size: $Rating-smallIconSize;
-    line-height: $Rating-smallIconSize;
-  }
-
-.rootIsLarge  {
-    font-size: $Rating-largeIconSize;
-    line-height: $Rating-largeIconSize;
-}
-
-.labelText {
-  @include ms-screenReaderOnly();
-}
-
-.ratingFocusZone {
-  display: inline-block;
-  padding-bottom: 1px;
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.styles.ts b/packages/office-ui-fabric-react/src/components/Rating/Rating.styles.ts
new file mode 100644
index 0000000000000..d4b106e3bd988
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.styles.ts
@@ -0,0 +1,112 @@
+import {
+  getFocusStyle,
+  hiddenContentStyle,
+  HighContrastSelector,
+} from '../../Styling';
+import { RatingSize, IRatingStyleProps, IRatingStyles } from './Rating.types';
+
+export function getStyles(props: IRatingStyleProps): IRatingStyles {
+  const {
+    disabled,
+    theme
+  } = props;
+
+  const {
+    semanticColors,
+    palette
+  } = theme;
+
+  const ratingSmallIconSize = '16px';
+  const ratingLargeIconSize = '20px';
+
+  return {
+    ratingStar: [
+      'ms-RatingStar-container',
+      {
+        display: 'inline-block',
+        position: 'relative'
+      }
+    ],
+    ratingStarBack: [
+      'ms-RatingStar-back',
+      {
+        // TODO: Use a proper semantic color for this
+        color: palette.neutralTertiary,
+        width: '100%'
+      },
+      disabled && {
+        color: semanticColors.disabledBodyText,
+        selectors: {
+          [HighContrastSelector]: {
+            color: 'GrayText'
+          }
+        }
+      }
+    ],
+    ratingStarFront: [
+      'ms-RatingStar-front',
+      {
+        position: 'absolute',
+        height: '100 %',
+        left: '0',
+        top: '0',
+        textAlign: 'center',
+        verticalAlign: 'middle',
+        overflow: 'hidden',
+        color: semanticColors.bodyTextChecked,
+        selectors: {
+          [HighContrastSelector]: {
+            'color': 'Highlight'
+          }
+        }
+      }
+    ],
+    ratingButton: [
+      getFocusStyle(theme, 0),
+      'ms-Rating-button',
+      {
+        background: 'none',
+        margin: '3px 3px 0px 0px',
+        padding: '0px',
+        border: 'none',
+        cursor: 'pointer',
+        selectors: {
+          '&:disabled': {
+            cursor: 'default'
+          },
+          '&[disabled]': {
+            cursor: 'default'
+          }
+        }
+      },
+      disabled && {
+        cursor: 'default'
+      },
+    ],
+    rootIsSmall: [
+      'ms-Rating--small',
+      {
+        fontSize: ratingSmallIconSize,
+        lineHeight: ratingSmallIconSize
+      }
+    ],
+    rootIsLarge: [
+      'ms-Rating--large',
+      {
+        fontSize: ratingLargeIconSize,
+        lineHeight: ratingLargeIconSize
+      }
+    ],
+    labelText: [
+      'ms-Rating-labelText',
+      hiddenContentStyle
+    ],
+    ratingFocusZone: [
+      'ms-Rating-focuszone',
+      {
+        display: 'inline-block',
+        paddingBottom: '1px'
+      }
+    ]
+  };
+}
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx b/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
index 667ae995ee733..045a730bb1f0a 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
@@ -7,6 +7,8 @@ import * as ReactTestUtils from 'react-dom/test-utils';
 import * as renderer from 'react-test-renderer';
 
 import { Rating } from './Rating';
+import { RatingBase } from './RatingBase';
+import { getStyles } from './Rating.styles';
 
 describe('Rating', () => {
   it('Renders Rating correctly', () => {
@@ -20,8 +22,9 @@ describe('Rating', () => {
     let threwException = false;
     let rating;
     try {
-      rating = ReactTestUtils.renderIntoDocument<Rating>(
-        <Rating
+      rating = ReactTestUtils.renderIntoDocument(
+        <RatingBase
+          getStyles={ getStyles }
           rating={ 2 }
         />
       );
@@ -61,8 +64,9 @@ describe('Rating', () => {
     let threwException = false;
     let rating;
     try {
-      rating = ReactTestUtils.renderIntoDocument<Rating>(
-        <Rating
+      rating = ReactTestUtils.renderIntoDocument(
+        <RatingBase
+          getStyles={ getStyles }
           rating={ 10 }
         />
       );
@@ -96,8 +100,9 @@ describe('Rating', () => {
     let threwException = false;
     let rating;
     try {
-      rating = ReactTestUtils.renderIntoDocument<Rating>(
-        <Rating
+      rating = ReactTestUtils.renderIntoDocument<RatingBase>(
+        <RatingBase
+          getStyles={ getStyles }
           rating={ 2.5 }
         />
       );
@@ -129,8 +134,9 @@ describe('Rating', () => {
     let threwException = false;
     let choiceGroup;
     try {
-      choiceGroup = ReactTestUtils.renderIntoDocument<Rating>(
-        <Rating
+      choiceGroup = ReactTestUtils.renderIntoDocument<RatingBase>(
+        <RatingBase
+          getStyles={ getStyles }
           disabled={ true }
         />
       );
@@ -155,8 +161,9 @@ describe('Rating', () => {
     let threwException = false;
     let choiceGroup;
     try {
-      choiceGroup = ReactTestUtils.renderIntoDocument<Rating>(
-        <Rating
+      choiceGroup = ReactTestUtils.renderIntoDocument<RatingBase>(
+        <RatingBase
+          getStyles={ getStyles }
           readOnly={ true }
           rating={ 2 }
         />
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx b/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
index 2074f7d54ed96..373e57e06ef68 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
@@ -1,189 +1,11 @@
-import * as React from 'react';
 import {
-  BaseComponent,
-  css,
-  getId
+  styled
 } from '../../Utilities';
-import { Icon } from '../../Icon';
-import { FocusZone, FocusZoneDirection } from '../../FocusZone';
-import { IRatingProps, RatingSize } from './Rating.types';
-import * as stylesImport from './Rating.scss';
-import { format } from '../../Utilities';
+import { IRatingProps } from './Rating.types';
+import { getStyles } from './Rating.styles';
+import { RatingBase } from './RatingBase';
 
-const styles: any = stylesImport;
-
-interface IRatingStarProps extends React.AllHTMLAttributes<HTMLElement> {
-  fillPercentage: number;
-  disabled: boolean;
-}
-
-export interface IRatingState {
-  rating: number | null | undefined;
-}
-
-const RatingStar = (props: IRatingStarProps) => (
-  <div
-    className={ css('ms-RatingStar-container', styles.ratingStar) }
-    key={ props.id }
-  >
-    <Icon
-      className={ css('ms-RatingStar-back', styles.ratingStarBack, {
-        ['is-disabled ' + styles.ratingStarDisabled]: props.disabled
-      }) }
-      iconName='FavoriteStarFill'
-    />
-    { !props.disabled &&
-      <Icon
-        className={ css('ms-RatingStar-front', styles.ratingStarFront) }
-        iconName='FavoriteStarFill'
-        style={ { width: props.fillPercentage + '%' } }
-      />
-    }
-  </div>
+export const Rating = styled(
+  RatingBase,
+  getStyles
 );
-
-export class Rating extends BaseComponent<IRatingProps, IRatingState> {
-  public static defaultProps: IRatingProps = {
-    min: 1,
-    max: 5
-  };
-  private _id: string;
-  private _labelId: string;
-
-  constructor(props: IRatingProps) {
-    super(props);
-
-    this.state = {
-      rating: this._getInitialValue(props)
-    };
-
-    this._id = getId('Rating');
-    this._labelId = getId('RatingLabel');
-  }
-
-  public componentWillReceiveProps(nextProps: IRatingProps) {
-    if (typeof nextProps.rating !== 'undefined' && nextProps.rating !== this.state.rating) {
-      this.setState({
-        rating: this._getClampedRating(nextProps.rating)
-      } as IRatingState);
-    }
-  }
-
-  public render() {
-    let id = this._id;
-    let stars = [];
-    let starIds = [];
-    let {
-      disabled,
-      getAriaLabel,
-      max,
-      min,
-      rating,
-      readOnly,
-      size
-    } = this.props;
-
-    for (let i = min as number; i <= (max as number); i++) {
-      let ratingStarProps: IRatingStarProps = {
-        fillPercentage: this._getFillingPercentage(i),
-        disabled: disabled ? true : false
-      };
-
-      starIds.push(this._getStarId(i - 1));
-
-      stars.push(
-        <button
-          className={ css('ms-Rating-button', styles.ratingButton, {
-            ['ms-Rating--large ' + styles.rootIsLarge]: size === RatingSize.Large,
-            ['ms-Rating--small ' + styles.rootIsSmall]: size !== RatingSize.Large
-          }) }
-          id={ starIds[i - 1] }
-          key={ i }
-          { ...((i === Math.ceil(rating as number)) ? { 'data-is-current': true } : {}) }
-          onFocus={ this._onFocus.bind(this, i) }
-          disabled={ disabled || readOnly ? true : false }
-          role='presentation'
-        >
-          { this._getLabel(i) }
-          <RatingStar key={ i + 'rating' }  {...ratingStarProps} />
-        </button>
-      );
-    }
-
-    return (
-      <div
-        className={ css('ms-Rating-star') }
-        aria-label={ getAriaLabel ? getAriaLabel(rating ? rating : 0, max as number) : '' }
-        id={ id }
-      >
-        <FocusZone
-          direction={ FocusZoneDirection.horizontal }
-          tabIndex={ readOnly ? 0 : -1 }
-          data-is-focusable={ readOnly ? true : false }
-          defaultActiveElement={ rating ? starIds[rating - 1] && '#' + starIds[rating - 1] : undefined }
-          className={ css('ms-Rating-focuszone', styles.ratingFocusZone) }
-        >
-          { stars }
-        </FocusZone>
-      </div >
-    );
-  }
-
-  private _getStarId(index: number): string {
-    return this._id + '-star-' + index;
-  }
-
-  private _onFocus(value: number, ev: React.FocusEvent<HTMLElement>): void {
-    this.setState({
-      rating: value
-    } as IRatingState);
-
-    const { onChanged } = this.props;
-    if (onChanged) {
-      onChanged(value);
-    }
-  }
-
-  private _getLabel(rating: number): JSX.Element {
-    const text = this.props.ariaLabelFormat || '';
-
-    return (
-      <span
-        id={ `${this._labelId}-${rating}` }
-        className={ css('ms-Rating-labelText', styles.labelText) }
-      >
-        { format(text, rating, this.props.max) }
-      </span>
-    );
-  }
-
-  private _getInitialValue(props: IRatingProps) {
-    if (typeof props.rating === 'undefined') {
-      return props.min;
-    }
-
-    if (props.rating === null) {
-      return null;
-    }
-
-    return this._getClampedRating(props.rating);
-  }
-
-  private _getClampedRating(rating: number): number {
-    return Math.min(Math.max(rating, this.props.min as number), this.props.max as number);
-  }
-
-  private _getFillingPercentage(starPosition: number): number {
-    let ceilValue = Math.ceil((this.state.rating as number));
-    let fillPercentage = 100;
-
-    if (starPosition === this.state.rating) {
-      fillPercentage = 100;
-    } else if (starPosition === ceilValue) {
-      fillPercentage = 100 * (this.state.rating as number % 1);
-    } else if (starPosition > ceilValue) {
-      fillPercentage = 0;
-    }
-    return fillPercentage;
-  }
-}
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.types.ts b/packages/office-ui-fabric-react/src/components/Rating/Rating.types.ts
index e12af1a32bb40..675e210a5d105 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.types.ts
@@ -1,4 +1,9 @@
 import * as React from 'react';
+import {
+  IStyle,
+  ITheme
+} from '../../Styling';
+import { IStyleFunction } from '../../Utilities';
 
 export interface IRating {
 
@@ -66,9 +71,35 @@ export interface IRatingProps extends React.AllHTMLAttributes<HTMLElement> {
   * Optional callback to set the arialabel for rating control.
   */
   getAriaLabel?: (rating: number, max: number) => string;
+
+  /**
+   * Call to provide customized styling that will layer on top of the variant rules.
+   */
+  getStyles?: IStyleFunction<IRatingStyleProps, IRatingStyles>;
+
+  /**
+   * Theme (provided through customization.)
+   */
+  theme?: ITheme;
 }
 
 export enum RatingSize {
   Small = 0,
   Large = 1
 }
+
+export interface IRatingStyleProps {
+  disabled?: boolean;
+  theme: ITheme;
+}
+
+export interface IRatingStyles {
+  ratingStar?: IStyle;
+  ratingStarBack?: IStyle;
+  ratingStarFront?: IStyle;
+  ratingButton?: IStyle;
+  rootIsSmall?: IStyle;
+  rootIsLarge?: IStyle;
+  labelText?: IStyle;
+  ratingFocusZone?: IStyle;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Rating/RatingBase.tsx b/packages/office-ui-fabric-react/src/components/Rating/RatingBase.tsx
new file mode 100644
index 0000000000000..ae02307082db4
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Rating/RatingBase.tsx
@@ -0,0 +1,203 @@
+import * as React from 'react';
+import {
+  BaseComponent,
+  classNamesFunction,
+  css,
+  customizable,
+  format,
+  getId
+} from '../../Utilities';
+import {
+  IClassNames
+} from '@uifabric/utilities/lib/IClassNames';
+import { Icon } from '../../Icon';
+import { FocusZone, FocusZoneDirection } from '../../FocusZone';
+import { IRatingProps, RatingSize, IRatingStyleProps, IRatingStyles } from './Rating.types';
+
+const getClassNames = classNamesFunction<IRatingStyleProps, IRatingStyles>();
+
+interface IRatingStarProps extends React.AllHTMLAttributes<HTMLElement> {
+  fillPercentage: number;
+  disabled: boolean;
+  classNames: IClassNames<IRatingStyles>;
+}
+
+export interface IRatingState {
+  rating: number | null | undefined;
+}
+
+const RatingStar = (props: IRatingStarProps, ) => (
+  <div
+    className={ props.classNames.ratingStar }
+    key={ props.id }
+  >
+    <Icon
+      className={ props.classNames.ratingStarBack }
+      iconName='FavoriteStarFill'
+    />
+    {
+      !props.disabled &&
+      <Icon
+        className={ props.classNames.ratingStarFront }
+        iconName='FavoriteStarFill'
+        style={ { width: props.fillPercentage + '%' } }
+      />
+    }
+  </div >
+);
+
+@customizable('Rating', ['theme', 'getStyles'])
+export class RatingBase extends BaseComponent<IRatingProps, IRatingState> {
+  public static defaultProps: IRatingProps = {
+    min: 1,
+    max: 5
+  };
+  private _id: string;
+  private _labelId: string;
+  private _classNames: {[key in keyof IRatingStyles]: string };
+
+  constructor(props: IRatingProps) {
+    super(props);
+
+    this.state = {
+      rating: this._getInitialValue(props)
+    };
+
+    this._id = getId('Rating');
+    this._labelId = getId('RatingLabel');
+  }
+
+  public componentWillReceiveProps(nextProps: IRatingProps) {
+    if (typeof nextProps.rating !== 'undefined' && nextProps.rating !== this.state.rating) {
+      this.setState({
+        rating: this._getClampedRating(nextProps.rating)
+      } as IRatingState);
+    }
+  }
+
+  public render() {
+    let id = this._id;
+    let stars = [];
+    let starIds = [];
+    let {
+      disabled,
+      getAriaLabel,
+      getStyles,
+      max,
+      min,
+      rating,
+      readOnly,
+      size,
+      theme
+    } = this.props;
+
+    this._classNames = getClassNames(getStyles!, {
+      disabled,
+      theme: theme!
+    });
+
+    for (let i = min as number; i <= (max as number); i++) {
+      let ratingStarProps: IRatingStarProps = {
+        fillPercentage: this._getFillingPercentage(i),
+        disabled: disabled ? true : false,
+        classNames: this._classNames
+      };
+
+      starIds.push(this._getStarId(i - 1));
+
+      stars.push(
+        <button
+          className={ css(this._classNames.ratingButton, {
+            [this._classNames.rootIsLarge]: size === RatingSize.Large,
+            [this._classNames.rootIsSmall]: size !== RatingSize.Large
+          }) }
+          id={ starIds[i - 1] }
+          key={ i }
+          { ...((i === Math.ceil(this.state.rating as number)) ? { 'data-is-current': true } : {}) }
+          onFocus={ this._onFocus.bind(this, i) }
+          disabled={ disabled || readOnly ? true : false }
+          role='presentation'
+        >
+          { this._getLabel(i) }
+          <RatingStar key={ i + 'rating' }  {...ratingStarProps} />
+        </button>
+      );
+    }
+
+    return (
+      <div
+        className={ 'ms-Rating-star' }
+        aria-label={ getAriaLabel ? getAriaLabel(this.state.rating ? this.state.rating : 0, this.props.max as number) : '' }
+        id={ id }
+      >
+        <FocusZone
+          direction={ FocusZoneDirection.horizontal }
+          tabIndex={ readOnly ? 0 : -1 }
+          className={ this._classNames.ratingFocusZone }
+          data-is-focusable={ readOnly ? true : false }
+          defaultActiveElement={ rating ? starIds[rating - 1] && '#' + starIds[rating - 1] : undefined }
+        >
+          { stars }
+        </FocusZone>
+      </div>
+    );
+  }
+
+  private _getStarId(index: number): string {
+    return this._id + '-star-' + index;
+  }
+
+  private _onFocus(value: number, ev: React.FocusEvent<HTMLElement>): void {
+    this.setState({
+      rating: value
+    } as IRatingState);
+
+    const { onChanged } = this.props;
+    if (onChanged) {
+      onChanged(value);
+    }
+  }
+
+  private _getLabel(rating: number): JSX.Element {
+    const text = this.props.ariaLabelFormat || '';
+
+    return (
+      <span
+        id={ `${this._labelId}-${rating}` }
+        className={ this._classNames.labelText }
+      >
+        { format(text, rating, this.props.max) }
+      </span >
+    );
+  }
+
+  private _getInitialValue(props: IRatingProps) {
+    if (typeof props.rating === 'undefined') {
+      return props.min;
+    }
+
+    if (props.rating === null) {
+      return null;
+    }
+
+    return this._getClampedRating(props.rating);
+  }
+
+  private _getClampedRating(rating: number): number {
+    return Math.min(Math.max(rating, this.props.min as number), this.props.max as number);
+  }
+
+  private _getFillingPercentage(starPosition: number): number {
+    let ceilValue = Math.ceil((this.state.rating as number));
+    let fillPercentage = 100;
+
+    if (starPosition === this.state.rating) {
+      fillPercentage = 100;
+    } else if (starPosition === ceilValue) {
+      fillPercentage = 100 * (this.state.rating as number % 1);
+    } else if (starPosition > ceilValue) {
+      fillPercentage = 0;
+    }
+    return fillPercentage;
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap
index 09dcff4c2e40a..311e8cd78f08a 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap
@@ -9,7 +9,13 @@ exports[`Rating Renders Rating correctly 1`] = `
   <div
     aria-describedby={undefined}
     aria-labelledby={undefined}
-    className="ms-FocusZone ms-Rating-focuszone"
+    className=
+        ms-FocusZone
+        ms-Rating-focuszone
+        {
+          display: inline-block;
+          padding-bottom: 1px;
+        }
     data-focuszone-id="FocusZone2"
     data-is-focusable={false}
     onFocus={[Function]}
@@ -19,20 +25,83 @@ exports[`Rating Renders Rating correctly 1`] = `
     tabIndex={-1}
   >
     <button
-      className="ms-Rating-button ms-Rating--small undefined"
+      className=
+          ms-Rating-button
+          ms-Rating--small
+          {
+            background: none;
+            border: none;
+            cursor: pointer;
+            margin-bottom: 0px;
+            margin-left: 0px;
+            margin-right: 3px;
+            margin-top: 3px;
+            outline: transparent;
+            padding-bottom: 0px;
+            padding-left: 0px;
+            padding-right: 0px;
+            padding-top: 0px;
+            position: relative;
+          }
+          &::-moz-focus-inner {
+            border: 0;
+          }
+          .ms-Fabric.is-focusVisible &:focus:after {
+            border: 1px solid #ffffff;
+            bottom: 1px;
+            content: "";
+            left: 1px;
+            outline: 1px solid #666666;
+            position: absolute;
+            right: 1px;
+            top: 1px;
+            z-index: 1;
+          }
+          &:disabled {
+            cursor: default;
+          }
+          &[disabled] {
+            cursor: default;
+          }
+          {
+            font-size: 16px;
+            line-height: 16px;
+          }
+      data-is-current={true}
       disabled={false}
       id="Rating0-star-0"
       onFocus={[Function]}
       role="presentation"
     >
       <span
-        className="ms-Rating-labelText"
+        className=
+            ms-Rating-labelText
+            {
+              border: 0px;
+              height: 1px;
+              margin-bottom: -1px;
+              margin-left: -1px;
+              margin-right: -1px;
+              margin-top: -1px;
+              overflow: hidden;
+              padding-bottom: 0px;
+              padding-left: 0px;
+              padding-right: 0px;
+              padding-top: 0px;
+              position: absolute;
+              width: 1px;
+            }
         id="RatingLabel1-1"
       >
         
       </span>
       <div
-        className="ms-RatingStar-container"
+        className=
+            ms-RatingStar-container
+            {
+              display: inline-block;
+              position: relative;
+            }
       >
         <i
           aria-hidden={true}
@@ -43,6 +112,10 @@ exports[`Rating Renders Rating correctly 1`] = `
               {
                 display: inline-block;
               }
+              {
+                color: #a6a6a6;
+                width: 100%;
+              }
           data-icon-name="FavoriteStarFill"
           role="presentation"
         />
@@ -55,6 +128,19 @@ exports[`Rating Renders Rating correctly 1`] = `
               {
                 display: inline-block;
               }
+              {
+                color: #000000;
+                height: 100 %;
+                left: 0;
+                overflow: hidden;
+                position: absolute;
+                text-align: center;
+                top: 0;
+                vertical-align: middle;
+              }
+              @media screen and (-ms-high-contrast: active){& {
+                color: Highlight;
+              }
           data-icon-name="FavoriteStarFill"
           role="presentation"
           style={
@@ -66,20 +152,82 @@ exports[`Rating Renders Rating correctly 1`] = `
       </div>
     </button>
     <button
-      className="ms-Rating-button ms-Rating--small undefined"
+      className=
+          ms-Rating-button
+          ms-Rating--small
+          {
+            background: none;
+            border: none;
+            cursor: pointer;
+            margin-bottom: 0px;
+            margin-left: 0px;
+            margin-right: 3px;
+            margin-top: 3px;
+            outline: transparent;
+            padding-bottom: 0px;
+            padding-left: 0px;
+            padding-right: 0px;
+            padding-top: 0px;
+            position: relative;
+          }
+          &::-moz-focus-inner {
+            border: 0;
+          }
+          .ms-Fabric.is-focusVisible &:focus:after {
+            border: 1px solid #ffffff;
+            bottom: 1px;
+            content: "";
+            left: 1px;
+            outline: 1px solid #666666;
+            position: absolute;
+            right: 1px;
+            top: 1px;
+            z-index: 1;
+          }
+          &:disabled {
+            cursor: default;
+          }
+          &[disabled] {
+            cursor: default;
+          }
+          {
+            font-size: 16px;
+            line-height: 16px;
+          }
       disabled={false}
       id="Rating0-star-1"
       onFocus={[Function]}
       role="presentation"
     >
       <span
-        className="ms-Rating-labelText"
+        className=
+            ms-Rating-labelText
+            {
+              border: 0px;
+              height: 1px;
+              margin-bottom: -1px;
+              margin-left: -1px;
+              margin-right: -1px;
+              margin-top: -1px;
+              overflow: hidden;
+              padding-bottom: 0px;
+              padding-left: 0px;
+              padding-right: 0px;
+              padding-top: 0px;
+              position: absolute;
+              width: 1px;
+            }
         id="RatingLabel1-2"
       >
         
       </span>
       <div
-        className="ms-RatingStar-container"
+        className=
+            ms-RatingStar-container
+            {
+              display: inline-block;
+              position: relative;
+            }
       >
         <i
           aria-hidden={true}
@@ -90,6 +238,10 @@ exports[`Rating Renders Rating correctly 1`] = `
               {
                 display: inline-block;
               }
+              {
+                color: #a6a6a6;
+                width: 100%;
+              }
           data-icon-name="FavoriteStarFill"
           role="presentation"
         />
@@ -102,6 +254,19 @@ exports[`Rating Renders Rating correctly 1`] = `
               {
                 display: inline-block;
               }
+              {
+                color: #000000;
+                height: 100 %;
+                left: 0;
+                overflow: hidden;
+                position: absolute;
+                text-align: center;
+                top: 0;
+                vertical-align: middle;
+              }
+              @media screen and (-ms-high-contrast: active){& {
+                color: Highlight;
+              }
           data-icon-name="FavoriteStarFill"
           role="presentation"
           style={
@@ -113,20 +278,82 @@ exports[`Rating Renders Rating correctly 1`] = `
       </div>
     </button>
     <button
-      className="ms-Rating-button ms-Rating--small undefined"
+      className=
+          ms-Rating-button
+          ms-Rating--small
+          {
+            background: none;
+            border: none;
+            cursor: pointer;
+            margin-bottom: 0px;
+            margin-left: 0px;
+            margin-right: 3px;
+            margin-top: 3px;
+            outline: transparent;
+            padding-bottom: 0px;
+            padding-left: 0px;
+            padding-right: 0px;
+            padding-top: 0px;
+            position: relative;
+          }
+          &::-moz-focus-inner {
+            border: 0;
+          }
+          .ms-Fabric.is-focusVisible &:focus:after {
+            border: 1px solid #ffffff;
+            bottom: 1px;
+            content: "";
+            left: 1px;
+            outline: 1px solid #666666;
+            position: absolute;
+            right: 1px;
+            top: 1px;
+            z-index: 1;
+          }
+          &:disabled {
+            cursor: default;
+          }
+          &[disabled] {
+            cursor: default;
+          }
+          {
+            font-size: 16px;
+            line-height: 16px;
+          }
       disabled={false}
       id="Rating0-star-2"
       onFocus={[Function]}
       role="presentation"
     >
       <span
-        className="ms-Rating-labelText"
+        className=
+            ms-Rating-labelText
+            {
+              border: 0px;
+              height: 1px;
+              margin-bottom: -1px;
+              margin-left: -1px;
+              margin-right: -1px;
+              margin-top: -1px;
+              overflow: hidden;
+              padding-bottom: 0px;
+              padding-left: 0px;
+              padding-right: 0px;
+              padding-top: 0px;
+              position: absolute;
+              width: 1px;
+            }
         id="RatingLabel1-3"
       >
         
       </span>
       <div
-        className="ms-RatingStar-container"
+        className=
+            ms-RatingStar-container
+            {
+              display: inline-block;
+              position: relative;
+            }
       >
         <i
           aria-hidden={true}
@@ -137,6 +364,10 @@ exports[`Rating Renders Rating correctly 1`] = `
               {
                 display: inline-block;
               }
+              {
+                color: #a6a6a6;
+                width: 100%;
+              }
           data-icon-name="FavoriteStarFill"
           role="presentation"
         />
@@ -149,6 +380,19 @@ exports[`Rating Renders Rating correctly 1`] = `
               {
                 display: inline-block;
               }
+              {
+                color: #000000;
+                height: 100 %;
+                left: 0;
+                overflow: hidden;
+                position: absolute;
+                text-align: center;
+                top: 0;
+                vertical-align: middle;
+              }
+              @media screen and (-ms-high-contrast: active){& {
+                color: Highlight;
+              }
           data-icon-name="FavoriteStarFill"
           role="presentation"
           style={
@@ -160,20 +404,82 @@ exports[`Rating Renders Rating correctly 1`] = `
       </div>
     </button>
     <button
-      className="ms-Rating-button ms-Rating--small undefined"
+      className=
+          ms-Rating-button
+          ms-Rating--small
+          {
+            background: none;
+            border: none;
+            cursor: pointer;
+            margin-bottom: 0px;
+            margin-left: 0px;
+            margin-right: 3px;
+            margin-top: 3px;
+            outline: transparent;
+            padding-bottom: 0px;
+            padding-left: 0px;
+            padding-right: 0px;
+            padding-top: 0px;
+            position: relative;
+          }
+          &::-moz-focus-inner {
+            border: 0;
+          }
+          .ms-Fabric.is-focusVisible &:focus:after {
+            border: 1px solid #ffffff;
+            bottom: 1px;
+            content: "";
+            left: 1px;
+            outline: 1px solid #666666;
+            position: absolute;
+            right: 1px;
+            top: 1px;
+            z-index: 1;
+          }
+          &:disabled {
+            cursor: default;
+          }
+          &[disabled] {
+            cursor: default;
+          }
+          {
+            font-size: 16px;
+            line-height: 16px;
+          }
       disabled={false}
       id="Rating0-star-3"
       onFocus={[Function]}
       role="presentation"
     >
       <span
-        className="ms-Rating-labelText"
+        className=
+            ms-Rating-labelText
+            {
+              border: 0px;
+              height: 1px;
+              margin-bottom: -1px;
+              margin-left: -1px;
+              margin-right: -1px;
+              margin-top: -1px;
+              overflow: hidden;
+              padding-bottom: 0px;
+              padding-left: 0px;
+              padding-right: 0px;
+              padding-top: 0px;
+              position: absolute;
+              width: 1px;
+            }
         id="RatingLabel1-4"
       >
         
       </span>
       <div
-        className="ms-RatingStar-container"
+        className=
+            ms-RatingStar-container
+            {
+              display: inline-block;
+              position: relative;
+            }
       >
         <i
           aria-hidden={true}
@@ -184,6 +490,10 @@ exports[`Rating Renders Rating correctly 1`] = `
               {
                 display: inline-block;
               }
+              {
+                color: #a6a6a6;
+                width: 100%;
+              }
           data-icon-name="FavoriteStarFill"
           role="presentation"
         />
@@ -196,6 +506,19 @@ exports[`Rating Renders Rating correctly 1`] = `
               {
                 display: inline-block;
               }
+              {
+                color: #000000;
+                height: 100 %;
+                left: 0;
+                overflow: hidden;
+                position: absolute;
+                text-align: center;
+                top: 0;
+                vertical-align: middle;
+              }
+              @media screen and (-ms-high-contrast: active){& {
+                color: Highlight;
+              }
           data-icon-name="FavoriteStarFill"
           role="presentation"
           style={
@@ -207,20 +530,82 @@ exports[`Rating Renders Rating correctly 1`] = `
       </div>
     </button>
     <button
-      className="ms-Rating-button ms-Rating--small undefined"
+      className=
+          ms-Rating-button
+          ms-Rating--small
+          {
+            background: none;
+            border: none;
+            cursor: pointer;
+            margin-bottom: 0px;
+            margin-left: 0px;
+            margin-right: 3px;
+            margin-top: 3px;
+            outline: transparent;
+            padding-bottom: 0px;
+            padding-left: 0px;
+            padding-right: 0px;
+            padding-top: 0px;
+            position: relative;
+          }
+          &::-moz-focus-inner {
+            border: 0;
+          }
+          .ms-Fabric.is-focusVisible &:focus:after {
+            border: 1px solid #ffffff;
+            bottom: 1px;
+            content: "";
+            left: 1px;
+            outline: 1px solid #666666;
+            position: absolute;
+            right: 1px;
+            top: 1px;
+            z-index: 1;
+          }
+          &:disabled {
+            cursor: default;
+          }
+          &[disabled] {
+            cursor: default;
+          }
+          {
+            font-size: 16px;
+            line-height: 16px;
+          }
       disabled={false}
       id="Rating0-star-4"
       onFocus={[Function]}
       role="presentation"
     >
       <span
-        className="ms-Rating-labelText"
+        className=
+            ms-Rating-labelText
+            {
+              border: 0px;
+              height: 1px;
+              margin-bottom: -1px;
+              margin-left: -1px;
+              margin-right: -1px;
+              margin-top: -1px;
+              overflow: hidden;
+              padding-bottom: 0px;
+              padding-left: 0px;
+              padding-right: 0px;
+              padding-top: 0px;
+              position: absolute;
+              width: 1px;
+            }
         id="RatingLabel1-5"
       >
         
       </span>
       <div
-        className="ms-RatingStar-container"
+        className=
+            ms-RatingStar-container
+            {
+              display: inline-block;
+              position: relative;
+            }
       >
         <i
           aria-hidden={true}
@@ -231,6 +616,10 @@ exports[`Rating Renders Rating correctly 1`] = `
               {
                 display: inline-block;
               }
+              {
+                color: #a6a6a6;
+                width: 100%;
+              }
           data-icon-name="FavoriteStarFill"
           role="presentation"
         />
@@ -243,6 +632,19 @@ exports[`Rating Renders Rating correctly 1`] = `
               {
                 display: inline-block;
               }
+              {
+                color: #000000;
+                height: 100 %;
+                left: 0;
+                overflow: hidden;
+                position: absolute;
+                text-align: center;
+                top: 0;
+                vertical-align: middle;
+              }
+              @media screen and (-ms-high-contrast: active){& {
+                color: Highlight;
+              }
           data-icon-name="FavoriteStarFill"
           role="presentation"
           style={
diff --git a/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx
index 0d6fd889b73ce..7c433b38283a4 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx
@@ -4,6 +4,11 @@ import {
   Rating,
   RatingSize
 } from 'office-ui-fabric-react/lib/Rating';
+import {
+  getTheme,
+  createTheme,
+  ITheme
+} from '../../../Styling';
 
 import './Rating.Basic.Example.scss';
 
@@ -12,15 +17,23 @@ export class RatingBasicExample extends React.Component<{}, {
   largeStarRating?: number;
   smallStarRating?: number;
   tenStarRating?: number;
+  themedStarRating?: number;
 }> {
+  private _customTheme: ITheme;
+
   constructor(props: {}) {
     super(props);
 
     this.state = {
       largeStarRating: undefined,
       smallStarRating: 3,
-      tenStarRating: undefined
+      tenStarRating: undefined,
+      themedStarRating: undefined
     };
+
+    this._customTheme = createTheme(getTheme());
+    this._customTheme.semanticColors.bodySubtext = '#DFDFDF';
+    this._customTheme.semanticColors.bodyTextChecked = '#1E9FE8';
   }
 
   // tslint:disable:jsx-no-lambda
@@ -88,6 +101,20 @@ export class RatingBasicExample extends React.Component<{}, {
           readOnly={ true }
           ariaLabelFormat={ '{0} of {1} stars selected' }
         />
+
+        Themed star
+        <Rating
+          id={ 'themedRatingStar' }
+          min={ 1 }
+          max={ 5 }
+          rating={ this.state.themedStarRating }
+          onChanged={ this._onThemedStarChanged }
+          getAriaLabel={ this._getRatingComponentAriaLabel }
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
+          ariaLabelFormat={ '{0} of {1} stars selected' }
+          theme={ this._customTheme }
+        />
       </div>
     );
   }
@@ -113,6 +140,13 @@ export class RatingBasicExample extends React.Component<{}, {
     });
   }
 
+  @autobind
+  private _onThemedStarChanged(rating: number) {
+    this.setState({
+      themedStarRating: rating
+    });
+  }
+
   private _getRatingComponentAriaLabel(rating: number, maxRating: number) {
 
     return 'Rating value is ' + rating + ' of ' + maxRating;

From c017cea5cb68d62a39efc0dc0afead9cd32e5cd1 Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Tue, 9 Jan 2018 11:28:37 -0800
Subject: [PATCH 1202/1641] Positioning/Callout: Fix positioning for HTMLImg
 elements when used as target (#3681)

* fix a bug where the callout would position incorrectly if the html element being target was an img element

* adding change file

* adding in comment
---
 ...ix-positioningfor-imgtargets_2018-01-09-02-14.json | 11 +++++++++++
 .../src/components/Callout/CalloutContent.tsx         |  9 +++++----
 .../src/utilities/positioning/positioning.ts          |  7 ++++---
 3 files changed, 20 insertions(+), 7 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-positioningfor-imgtargets_2018-01-09-02-14.json

diff --git a/common/changes/office-ui-fabric-react/fix-positioningfor-imgtargets_2018-01-09-02-14.json b/common/changes/office-ui-fabric-react/fix-positioningfor-imgtargets_2018-01-09-02-14.json
new file mode 100644
index 0000000000000..70e2694c791b9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-positioningfor-imgtargets_2018-01-09-02-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Callout/Positioning: Fix a bug where callouts would position incorrectly if the target was  an HTMLImg element",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index 32f2c03cc1d05..7c597ac6b54b9 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -390,13 +390,14 @@ export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState>
       } else if ((target as MouseEvent).stopPropagation) {
         this._targetWindow = getWindow((target as MouseEvent).toElement as HTMLElement)!;
         this._target = target;
-      } else if ((target as IPoint).x !== undefined && (target as IPoint).y !== undefined) {
-        this._targetWindow = getWindow()!;
-        this._target = target;
-      } else {
+      } else if ((target as HTMLElement).getBoundingClientRect) {
         let targetElement: HTMLElement = target as HTMLElement;
         this._targetWindow = getWindow(targetElement)!;
         this._target = target;
+        // HTMLImgElements can have x and y values. The check for it being a point must go last.
+      } else {
+        this._targetWindow = getWindow()!;
+        this._target = target;
       }
     } else {
       this._targetWindow = getWindow()!;
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts b/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts
index a2730bddff5b1..342e10776f883 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts
@@ -579,11 +579,12 @@ export module positioningFunctions {
       if ((target as MouseEvent).preventDefault) {
         let ev: MouseEvent = target as MouseEvent;
         targetRectangle = new Rectangle(ev.clientX, ev.clientX, ev.clientY, ev.clientY);
-      } else if ((target as IPoint).x !== undefined) {
+      } else if ((target as HTMLElement).getBoundingClientRect) {
+        targetRectangle = _getRectangleFromHTMLElement(target as HTMLElement);
+        // HTMLImgElements can have x and y values. The check for it being a point must go last.
+      } else {
         let point: IPoint = target as IPoint;
         targetRectangle = new Rectangle(point.x, point.x, point.y, point.y);
-      } else {
-        targetRectangle = _getRectangleFromHTMLElement(target as HTMLElement);
       }
 
       if (!_isRectangleWithinBounds(targetRectangle, bounds)) {

From 6c4e42e8e5ec7d671a9a579053c1e2af6c4ef6ee Mon Sep 17 00:00:00 2001
From: amyngu <31973030+amyngu@users.noreply.github.com>
Date: Tue, 9 Jan 2018 15:26:55 -0800
Subject: [PATCH 1203/1641] FloatingPicker: Throttle search (#3653)

* add search throttle and small fixes

* add change file

* fix tslint issue

* use async debounce

* add missing semicolon

* change to numeric sizing
---
 .../throttleSearch_2018-01-02-21-14.json      | 11 ++++++++
 .../ExtendedPicker/BaseExtendedPicker.scss    |  4 +++
 .../ExtendedPeoplePicker.Basic.Example.tsx    |  3 ++-
 .../FloatingPicker/BaseFloatingPicker.tsx     | 25 +++++++++++++++----
 .../BaseFloatingPicker.types.ts               | 13 ++++++++++
 .../SuggestionItemDefault.tsx                 |  2 +-
 .../FloatingPeoplePicker.Basic.Example.tsx    |  1 +
 7 files changed, 52 insertions(+), 7 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/throttleSearch_2018-01-02-21-14.json

diff --git a/common/changes/@uifabric/experiments/throttleSearch_2018-01-02-21-14.json b/common/changes/@uifabric/experiments/throttleSearch_2018-01-02-21-14.json
new file mode 100644
index 0000000000000..77e8ee74a80df
--- /dev/null
+++ b/common/changes/@uifabric/experiments/throttleSearch_2018-01-02-21-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Add search throttle to floating picker",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "amyngu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.scss b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.scss
index 0569ed71ba119..3612590af80a1 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.scss
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.scss
@@ -21,4 +21,8 @@
   outline: none;
   padding: 0 6px 0px;
   margin: 1px;
+
+  &::-ms-clear {
+    display: none;
+  }
 }
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
index 8e842275e33ee..9ecc290c64d07 100644
--- a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
@@ -29,7 +29,8 @@ const suggestionProps: IBasePickerSuggestionsProps = {
   loadingText: 'Loading',
   showRemoveButtons: true,
   suggestionsAvailableAlertText: 'People Picker Suggestions available',
-  suggestionsContainerAriaLabel: 'Suggested contacts'
+  suggestionsContainerAriaLabel: 'Suggested contacts',
+  searchForMoreText: 'Search more',
 };
 
 // tslint:disable-next-line:no-any
diff --git a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
index b44024a84fcb8..d657288ad95a3 100644
--- a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
+++ b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
@@ -96,6 +96,8 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
 
   public componentDidMount(): void {
     this._bindToInputElement();
+
+    this._onResolveSuggestions = this._async.debounce(this._onResolveSuggestions, this.props.resolveDelay);
   }
 
   public componentDidUpdate(): void {
@@ -197,11 +199,12 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
   }
 
   protected updateValue(updatedValue: string): void {
-    let suggestions: T[] | PromiseLike<T[]> = this.props.onResolveSuggestions(
-      updatedValue,
-      this.props.selectedItems
-    );
-    this.updateSuggestionsList(suggestions, updatedValue);
+    // Call onInputChanged
+    if (this.props.onInputChanged) {
+      (this.props.onInputChanged as (filter: string) => void)(updatedValue);
+    }
+
+    this._onResolveSuggestions(updatedValue);
   }
 
   protected updateSuggestionWithZeroState(): void {
@@ -341,6 +344,7 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
       case KeyCodes.enter:
         if (
           !ev.shiftKey &&
+          !ev.ctrlKey &&
           this.suggestionStore.hasSelectedSuggestion()) {
           this.completeSuggestion();
           ev.preventDefault();
@@ -429,6 +433,11 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
               this.setState({ isSearching: false });
             });
           }
+
+          // Focus back on the input element
+          if (this.props.inputElement) {
+            (this.props.inputElement as HTMLDivElement).focus();
+          }
         } else {
           this.setState({ isSearching: false });
         }
@@ -440,6 +449,12 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
     );
   }
 
+  private _onResolveSuggestions(updatedValue: string): void {
+    let suggestions: T[] | PromiseLike<T[]> = this.props.onResolveSuggestions(updatedValue, this.props.selectedItems);
+
+    this.updateSuggestionsList(suggestions, updatedValue);
+  }
+
   private _onValidateInput(): void {
     if (
       this.props.onValidateInput &&
diff --git a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts
index cd8b32707702c..a4e9c83f12fea 100644
--- a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts
+++ b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts
@@ -44,9 +44,22 @@ export interface IBaseFloatingPickerProps<T> extends React.Props<any> {
   /**
    * A callback for what should happen when a person types text into the input.
    * Returns the already selected items so the resolver can filter them out.
+   * If used in conjunction with resolveDelay this will ony kick off after the delay throttle.
    */
   onResolveSuggestions: (filter: string, selectedItems?: T[]) => T[] | PromiseLike<T[]>;
 
+  /**
+   * A callback for when the input has been changed
+   */
+  onInputChanged?: (filter: string) => void;
+
+  /**
+   * The delay time in ms before resolving suggestions, which is kicked off when input has been cahnged.
+   * e.g. If a second input change happens within the resolveDelay time, the timer will start over.
+   * Only until after the timer completes will onResolveSuggestions be called.
+   */
+  resolveDelay?: number;
+
   /**
    * A callback for when a suggestion is clicked
    */
diff --git a/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx b/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
index 140416399fb09..7a54d8aa2d341 100644
--- a/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
+++ b/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/SuggestionItemDefault.tsx
@@ -12,7 +12,7 @@ export const SuggestionItemNormal: (persona: IPersonaProps, suggestionProps?: IB
       <div className={ css('ms-PeoplePicker-personaContent', stylesImport.peoplePickerPersonaContent) }>
         <Persona
           presence={ personaProps.presence !== undefined ? personaProps.presence : PersonaPresence.none }
-          size={ PersonaSize.size24 }
+          size={ PersonaSize.size40 }
           className={ css('ms-PeoplePicker-Persona', stylesImport.peoplePickerPersona) }
           showSecondaryText={ true }
           { ...personaProps }
diff --git a/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
index 37651028dcc35..2c27db626b9a4 100644
--- a/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
+++ b/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
@@ -83,6 +83,7 @@ export class FloatingPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
         componentRef={ this._setComponentRef }
         onChange={ this._onPickerChange }
         inputElement={ this._inputElement }
+        resolveDelay={ 300 }
       />
     );
   }

From 9add5751390f30c7214928dda90a0b9120ad0c99 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 10 Jan 2018 03:23:36 -0800
Subject: [PATCH 1204/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../throttleSearch_2018-01-02-21-14.json      | 11 --------
 .../expand_2018-01-08-11-10.json              | 11 --------
 ...ioningfor-imgtargets_2018-01-09-02-14.json | 11 --------
 .../master_2018-01-04-01-10.json              | 11 --------
 packages/experiments/CHANGELOG.json           | 19 ++++++++++++++
 packages/experiments/CHANGELOG.md             |  9 ++++++-
 packages/experiments/package.json             |  4 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 26 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 14 +++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 15 files changed, 74 insertions(+), 54 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/throttleSearch_2018-01-02-21-14.json
 delete mode 100644 common/changes/office-ui-fabric-react/expand_2018-01-08-11-10.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-positioningfor-imgtargets_2018-01-09-02-14.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2018-01-04-01-10.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index e546b26cafe4a..cc327717d32f8 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.38.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.39.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 299c72173539c..73fb8aaafcb62 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.38.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.39.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 008266ad0b4c9..2e12ee991585e 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.38.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.39.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 857791970630e..ab165414fd5e4 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.38.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.39.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index dcb61d5e0520d..497febb575533 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.38.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.39.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/@uifabric/experiments/throttleSearch_2018-01-02-21-14.json b/common/changes/@uifabric/experiments/throttleSearch_2018-01-02-21-14.json
deleted file mode 100644
index 77e8ee74a80df..0000000000000
--- a/common/changes/@uifabric/experiments/throttleSearch_2018-01-02-21-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Add search throttle to floating picker",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "amyngu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/expand_2018-01-08-11-10.json b/common/changes/office-ui-fabric-react/expand_2018-01-08-11-10.json
deleted file mode 100644
index 76d1abeda3386..0000000000000
--- a/common/changes/office-ui-fabric-react/expand_2018-01-08-11-10.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add auto expand on focus for Combobox",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "stanleyy@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-positioningfor-imgtargets_2018-01-09-02-14.json b/common/changes/office-ui-fabric-react/fix-positioningfor-imgtargets_2018-01-09-02-14.json
deleted file mode 100644
index 70e2694c791b9..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-positioningfor-imgtargets_2018-01-09-02-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Callout/Positioning: Fix a bug where callouts would position incorrectly if the target was  an HTMLImg element",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2018-01-04-01-10.json b/common/changes/office-ui-fabric-react/master_2018-01-04-01-10.json
deleted file mode 100644
index 8584c987033d4..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2018-01-04-01-10.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Rating: Convert to getstyles",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 5693101f9ebab..1e193cc1034c5 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.12.0",
+      "tag": "@uifabric/experiments_v5.12.0",
+      "date": "Wed, 10 Jan 2018 11:23:36 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "amyngu <31973030+amyngu@users.noreply.github.com>",
+            "commit": "6c4e42e8e5ec7d671a9a579053c1e2af6c4ef6ee",
+            "comment": "Add search throttle to floating picker"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.38.1 <6.0.0` to `>=5.39.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.11.1",
       "tag": "@uifabric/experiments_v5.11.1",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index c1f6fb47d53b1..f2b901614c7a1 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Tue, 19 Dec 2017 11:22:47 GMT and should not be manually modified.
+This log was last generated on Wed, 10 Jan 2018 11:23:36 GMT and should not be manually modified.
+
+## 5.12.0
+Wed, 10 Jan 2018 11:23:36 GMT
+
+### Minor changes
+
+- Add search throttle to floating picker
 
 ## 5.11.1
 Tue, 19 Dec 2017 11:22:47 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 956dc2b7b57bc..5d45b06e1a55a 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.11.1",
+  "version": "5.12.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.38.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.39.0 <6.0.0",
     "@uifabric/icons": ">=5.4.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 4820cf3077bc8..93f6ec8ec9668 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.39.0",
+      "tag": "office-ui-fabric-react_v5.39.0",
+      "date": "Wed, 10 Jan 2018 11:23:36 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Stanley Yao <stanley.yao@microsoft.com>",
+            "commit": "e0f80abf26836c11e4fbb62c798ef15d92d2416d",
+            "comment": "Add auto expand on focus for Combobox"
+          },
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "c017cea5cb68d62a39efc0dc0afead9cd32e5cd1",
+            "comment": "Callout/Positioning: Fix a bug where callouts would position incorrectly if the target was  an HTMLImg element"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "3626565be858e54cbb8ddcb617d62fa52823254a",
+            "comment": "Rating: Convert to getstyles"
+          }
+        ]
+      }
+    },
     {
       "version": "5.38.1",
       "tag": "office-ui-fabric-react_v5.38.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index d9084ce4f8e79..e79c9dd06865e 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,18 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 08 Jan 2018 11:13:51 GMT and should not be manually modified.
+This log was last generated on Wed, 10 Jan 2018 11:23:36 GMT and should not be manually modified.
+
+## 5.39.0
+Wed, 10 Jan 2018 11:23:36 GMT
+
+### Minor changes
+
+- Rating: Convert to getstyles
+
+### Patches
+
+- Add auto expand on focus for Combobox
+- Callout/Positioning: Fix a bug where callouts would position incorrectly if the target was  an HTMLImg element
 
 ## 5.38.1
 Mon, 08 Jan 2018 11:13:51 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 0dd89af5e4bee..989dc0ab9cf01 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.38.1",
+  "version": "5.39.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 6cf2f05c67df587f5d599fe37ab69b02d35ba4e0 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Thu, 11 Jan 2018 12:26:01 -0800
Subject: [PATCH 1205/1641] Checkbox and Choicegroup: lightened resting state
 border color (#3710)

* Checkbox and radio now have a resting neutralSecondary border color

* Added change file

* Updated snapshot test
---
 .../checkbox-rest_2018-01-11-18-54.json               | 11 +++++++++++
 .../src/components/Checkbox/Checkbox.styles.ts        |  2 +-
 .../Checkbox/__snapshots__/Checkbox.test.tsx.snap     |  2 +-
 .../src/components/ChoiceGroup/ChoiceGroup.scss       |  2 +-
 4 files changed, 14 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/checkbox-rest_2018-01-11-18-54.json

diff --git a/common/changes/office-ui-fabric-react/checkbox-rest_2018-01-11-18-54.json b/common/changes/office-ui-fabric-react/checkbox-rest_2018-01-11-18-54.json
new file mode 100644
index 0000000000000..040117bd1a8a9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/checkbox-rest_2018-01-11-18-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Checkbox and ChoiceGroup: New resting state border color.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
index 060cf7b2119a8..cfd7bf7184fc4 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
@@ -18,7 +18,7 @@ export const getStyles = memoizeFunction((
   const { semanticColors, palette } = theme;
   const checkmarkFontColor = semanticColors.inputForegroundChecked;
   const checkmarkFontColorCheckedDisabled = semanticColors.disabledBackground;
-  const checkboxBorderColor = semanticColors.inputBorderHovered;
+  const checkboxBorderColor = semanticColors.bodySubtext;
   const checkboxBorderColorChecked = semanticColors.inputBackgroundChecked;
   const checkboxBorderColorDisabled = semanticColors.disabledText;
   const checkboxBorderHoveredColor = semanticColors.inputBorderHovered;
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
index de6ef83d6c17a..b2bc439374e0e 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
@@ -83,7 +83,7 @@ exports[`Checkbox renders Checkbox correctly 1`] = `
           ms-Checkbox-checkbox
           {
             align-items: center;
-            border-color: #212121;
+            border-color: #666666;
             border-style: solid;
             border-width: 1px;
             box-sizing: border-box;
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
index 359e8cf271a5f..43f683caa802d 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
@@ -14,7 +14,7 @@ $radioButton-text-hover-color: $bodyTextCheckedColor;
 
 $radioButton-dot-color: $inputBackgroundCheckedColor;
 
-$radioButton-border-color: $inputBorderColor;
+$radioButton-border-color: $bodySubtextColor;
 $radioButton-border-hover-color: $inputBorderHoveredColor;
 $radioButton-border-selected-color: $radioButton-dot-color;
 $radioButton-border-selected-hover-color: $inputBackgroundCheckedHoveredColor;

From c874551bebff3b1936262d482c0b2f180ca6edb8 Mon Sep 17 00:00:00 2001
From: KatherineThayerMicrosoft <kathayer@microsoft.com>
Date: Thu, 11 Jan 2018 15:34:13 -0800
Subject: [PATCH 1206/1641] File type icons: support size 64 icons (#3704)

Support size 64 file type icons
---
 .../kathayer-add64_2018-01-11-00-29.json      | 11 +++++
 .../kathayer-add64_2018-01-11-00-29.json      | 11 +++++
 .../examples/FileTypeIcon.Basic.Example.tsx   |  8 +++-
 .../src/getFileTypeIconProps.ts               | 48 ++++++++++++-------
 .../src/initializeFileTypeIcons.tsx           | 33 +++++++++++++
 5 files changed, 91 insertions(+), 20 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/kathayer-add64_2018-01-11-00-29.json
 create mode 100644 common/changes/@uifabric/file-type-icons/kathayer-add64_2018-01-11-00-29.json

diff --git a/common/changes/@uifabric/experiments/kathayer-add64_2018-01-11-00-29.json b/common/changes/@uifabric/experiments/kathayer-add64_2018-01-11-00-29.json
new file mode 100644
index 0000000000000..289b6f5674c34
--- /dev/null
+++ b/common/changes/@uifabric/experiments/kathayer-add64_2018-01-11-00-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Add demo of size 64 file type icons",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "kathayer@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/file-type-icons/kathayer-add64_2018-01-11-00-29.json b/common/changes/@uifabric/file-type-icons/kathayer-add64_2018-01-11-00-29.json
new file mode 100644
index 0000000000000..befd0788373f2
--- /dev/null
+++ b/common/changes/@uifabric/file-type-icons/kathayer-add64_2018-01-11-00-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/file-type-icons",
+      "comment": "Support size 64 file type icons",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/file-type-icons",
+  "email": "kathayer@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/FileTypeIcon/examples/FileTypeIcon.Basic.Example.tsx b/packages/experiments/src/components/FileTypeIcon/examples/FileTypeIcon.Basic.Example.tsx
index 60be05661a12f..d83f2c05971f3 100644
--- a/packages/experiments/src/components/FileTypeIcon/examples/FileTypeIcon.Basic.Example.tsx
+++ b/packages/experiments/src/components/FileTypeIcon/examples/FileTypeIcon.Basic.Example.tsx
@@ -17,6 +17,8 @@ export class FileTypeIconBasicExample extends React.Component<{}, {}> {
         <Icon {...getFileTypeIconProps({ extension: '.cpp', size: 40, imageFileType: 'png' }) } />
         <h3>Size 48 csv icon as .png</h3>
         <Icon {...getFileTypeIconProps({ extension: 'csv', size: 48, imageFileType: 'png' }) } />
+        <h3>Size 64 model icon as .png</h3>
+        <Icon {...getFileTypeIconProps({ extension: 'blend', size: 64, imageFileType: 'png' }) } />
         <h3>Size 96 docx icon as .png</h3>
         <Icon {...getFileTypeIconProps({ extension: 'docx', size: 96, imageFileType: 'png' }) } />
         <h3>Size 16 dotx icon as .svg</h3>
@@ -29,6 +31,8 @@ export class FileTypeIconBasicExample extends React.Component<{}, {}> {
         <Icon {...getFileTypeIconProps({ extension: '.woff', size: 40 }) } />
         <h3>Size 48 html icon as .svg</h3>
         <Icon {...getFileTypeIconProps({ extension: 'html', size: 48 }) } />
+        <h3>Size 64 mpp icon as .svg</h3>
+        <Icon {...getFileTypeIconProps({ extension: 'mpp', size: 64 }) } />
         <h3>Size 96 link icon as .svg</h3>
         <Icon {...getFileTypeIconProps({ extension: 'url', size: 96 }) } />
         <h3>Size 16 docset icon as .png</h3>
@@ -39,8 +43,8 @@ export class FileTypeIconBasicExample extends React.Component<{}, {}> {
         <Icon {...getFileTypeIconProps({ size: 40, imageFileType: 'png' }) } />
         <h3>Size 48 listitem icon as .svg</h3>
         <Icon {...getFileTypeIconProps({ type: FileIconType.listItem, size: 48, imageFileType: 'svg' }) } />
-        <h3>Size 96 sharedfolder icon as .png</h3>
-        <Icon {...getFileTypeIconProps({ type: FileIconType.sharedFolder, size: 96, imageFileType: 'png' }) } />
+        <h3>Size 64 sharedfolder icon as .png</h3>
+        <Icon {...getFileTypeIconProps({ type: FileIconType.sharedFolder, size: 64, imageFileType: 'png' }) } />
       </div>
     );
   }
diff --git a/packages/file-type-icons/src/getFileTypeIconProps.ts b/packages/file-type-icons/src/getFileTypeIconProps.ts
index 9d25e907e1ad5..831b4cf0a5201 100644
--- a/packages/file-type-icons/src/getFileTypeIconProps.ts
+++ b/packages/file-type-icons/src/getFileTypeIconProps.ts
@@ -10,7 +10,7 @@ const DOCSET_FOLDER = 'docset';
 const LIST_ITEM = 'listitem';
 const DEFAULT_ICON_SIZE: FileTypeIconSize = 16;
 
-export type FileTypeIconSize = 16 | 20 | 32 | 40 | 48 | 96;
+export type FileTypeIconSize = 16 | 20 | 32 | 40 | 48 | 64 | 96;
 export type ImageFileType = 'svg' | 'png';
 
 export interface IFileTypeIconOptions {
@@ -105,24 +105,36 @@ function _getFileTypeIconSuffix(size: FileTypeIconSize, imageFileType: ImageFile
   let devicePixelRatio: number = window.devicePixelRatio;
   let devicePixelRatioSuffix = ''; // Default is 1x
 
-  // SVGs scale well, so you can generally use the default image.
-  // 1.5x is a special case where SVGs need a different image.
-  if (imageFileType === 'svg' && 1 < devicePixelRatio && devicePixelRatio <= 1.5) {
-    // Currently missing 1.5x SVGs at sizes 20 and 40, snap to 1x for now
-    if (size !== 20 && size !== 40) {
-      devicePixelRatioSuffix = '_1.5x';
+  if (size !== 64) {
+    // SVGs scale well, so you can generally use the default image.
+    // 1.5x is a special case where SVGs need a different image.
+    if (imageFileType === 'svg' && 1 < devicePixelRatio && devicePixelRatio <= 1.5) {
+      // Currently missing 1.5x SVGs at sizes 20 and 40, snap to 1x for now
+      if (size !== 20 && size !== 40) {
+        devicePixelRatioSuffix = '_1.5x';
+      }
+    } else if (imageFileType === 'png') {
+      // To look good, PNGs should use a different image for higher device pixel ratios
+      if (1 < devicePixelRatio && devicePixelRatio <= 1.5) {
+        // Currently missing 1.5x icons for size 20, snap to 2x for now
+        devicePixelRatioSuffix = (size === 20) ? '_2x' : '_1.5x';
+      } else if (1.5 < devicePixelRatio && devicePixelRatio <= 2) {
+        devicePixelRatioSuffix = '_2x';
+      } else if (2 < devicePixelRatio && devicePixelRatio <= 3) {
+        devicePixelRatioSuffix = '_3x';
+      } else if (3 < devicePixelRatio) {
+        devicePixelRatioSuffix = '_4x';
+      }
     }
-  } else if (imageFileType === 'png') {
-    // To look good, PNGs should use a different image for higher device pixel ratios
-    if (1 < devicePixelRatio && devicePixelRatio <= 1.5) {
-      // Currently missing 1.5x icons for size 20, snap to 2x for now
-      devicePixelRatioSuffix = (size === 20) ? '_2x' : '_1.5x';
-    } else if (1.5 < devicePixelRatio && devicePixelRatio <= 2) {
-      devicePixelRatioSuffix = '_2x';
-    } else if (2 < devicePixelRatio && devicePixelRatio <= 3) {
-      devicePixelRatioSuffix = '_3x';
-    } else if (3 < devicePixelRatio) {
-      devicePixelRatioSuffix = '_4x';
+  } else {
+    // Currently we have a more limited set of image files for size 64.
+    // For SVGs, we only have the default 1x. For PNGs, we have 1x, 1.5x, and 2x.
+    if (imageFileType === 'png') {
+      if (1 < devicePixelRatio && devicePixelRatio <= 1.5) {
+        devicePixelRatioSuffix = '_1.5x';
+      } else if (1.5 < devicePixelRatio) {
+        devicePixelRatioSuffix = '_2x';
+      }
     }
   }
 
diff --git a/packages/file-type-icons/src/initializeFileTypeIcons.tsx b/packages/file-type-icons/src/initializeFileTypeIcons.tsx
index d634e5b3822a9..6cac0f4b1f8e0 100644
--- a/packages/file-type-icons/src/initializeFileTypeIcons.tsx
+++ b/packages/file-type-icons/src/initializeFileTypeIcons.tsx
@@ -12,6 +12,9 @@ export function initializeFileTypeIcons(baseUrl: string = DEFAULT_BASE_URL, opti
   ICON_SIZES.forEach((size: number) => {
     _initializeIcons(baseUrl, size, options);
   });
+  // Currently we have a more limited set of image files for size 64.
+  // When we have the full set, add 64 to ICON_SIZES and remove _initializeSize64Icons.
+  _initializeSize64Icons(baseUrl, options);
 }
 
 function _initializeIcons(baseUrl: string, size: number, options?: Partial<IIconOptions>): void {
@@ -60,3 +63,33 @@ function _initializeIcons(baseUrl: string, size: number, options?: Partial<IIcon
     icons: fileTypeIcons
   }, options);
 }
+
+function _initializeSize64Icons(baseUrl: string, options?: Partial<IIconOptions>): void {
+  const iconTypes: string[] = Object.keys(FileTypeIconMap);
+  const fileTypeIcons: { [key: string]: JSX.Element } = {};
+  const size = 64;
+
+  iconTypes.forEach((type: string) => {
+    fileTypeIcons[type + size + PNG_SUFFIX] = <img src={ baseUrl + size + '/' + type + '.png' } />;
+    fileTypeIcons[type + size + SVG_SUFFIX] = <img src={ baseUrl + size + '/' + type + '.svg' } />;
+
+    // For high resolution screens, register additional versions.
+    // Size 64 only has PNGs for 1.5x and 2x.
+    fileTypeIcons[type + size + '_1.5x' + PNG_SUFFIX] = (
+      <img src={ baseUrl + size + '_1.5x/' + type + '.png' } height='100%' width='100%' />
+    );
+    fileTypeIcons[type + size + '_2x' + PNG_SUFFIX] = (
+      <img src={ baseUrl + size + '_2x/' + type + '.png' } height='100%' width='100%' />
+    );
+  });
+
+  registerIcons({
+    fontFace: {},
+    style: {
+      width: size,
+      height: size,
+      overflow: 'hidden'
+    },
+    icons: fileTypeIcons
+  }, options);
+}

From 698db03d6b411f82c330d072eb31479ba517e67f Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 12 Jan 2018 11:41:18 -0800
Subject: [PATCH 1207/1641] Update rush.json

---
 rush.json | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/rush.json b/rush.json
index debe79f711b6e..bb4ca448d4cf5 100644
--- a/rush.json
+++ b/rush.json
@@ -1,5 +1,5 @@
 {
-  "npmVersion": "5.5.1",
+  "npmVersion": "5.3.0",
   "rushVersion": "4.1.0",
   "repository": {
     "url": "https://github.com/OfficeDev/office-ui-fabric-react.git"
@@ -94,4 +94,4 @@
       "shouldPublish": false
     }
   ]
-}
\ No newline at end of file
+}

From 7e2d3617f302cd07f042f8e67ca117e65ac1a235 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 12 Jan 2018 20:03:22 +0000
Subject: [PATCH 1208/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../kathayer-add64_2018-01-11-00-29.json      | 11 ----------
 .../kathayer-add64_2018-01-11-00-29.json      | 11 ----------
 .../checkbox-rest_2018-01-11-18-54.json       | 11 ----------
 packages/experiments/CHANGELOG.json           | 22 +++++++++++++++++++
 packages/experiments/CHANGELOG.md             |  9 +++++++-
 packages/experiments/package.json             |  6 ++---
 packages/file-type-icons/CHANGELOG.json       | 14 ++++++++++++
 packages/file-type-icons/CHANGELOG.md         |  9 +++++++-
 packages/file-type-icons/package.json         |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 +++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 17 files changed, 84 insertions(+), 46 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/kathayer-add64_2018-01-11-00-29.json
 delete mode 100644 common/changes/@uifabric/file-type-icons/kathayer-add64_2018-01-11-00-29.json
 delete mode 100644 common/changes/office-ui-fabric-react/checkbox-rest_2018-01-11-18-54.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index cc327717d32f8..ff4f956293332 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.39.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.39.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 73fb8aaafcb62..7e2a84092e339 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.39.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.39.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 2e12ee991585e..d19905a3d29dc 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.39.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.39.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index ab165414fd5e4..1ee39a8171175 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.39.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.39.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 497febb575533..9f2c781cd2504 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.39.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.39.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/@uifabric/experiments/kathayer-add64_2018-01-11-00-29.json b/common/changes/@uifabric/experiments/kathayer-add64_2018-01-11-00-29.json
deleted file mode 100644
index 289b6f5674c34..0000000000000
--- a/common/changes/@uifabric/experiments/kathayer-add64_2018-01-11-00-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Add demo of size 64 file type icons",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "kathayer@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/file-type-icons/kathayer-add64_2018-01-11-00-29.json b/common/changes/@uifabric/file-type-icons/kathayer-add64_2018-01-11-00-29.json
deleted file mode 100644
index befd0788373f2..0000000000000
--- a/common/changes/@uifabric/file-type-icons/kathayer-add64_2018-01-11-00-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/file-type-icons",
-      "comment": "Support size 64 file type icons",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/file-type-icons",
-  "email": "kathayer@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/checkbox-rest_2018-01-11-18-54.json b/common/changes/office-ui-fabric-react/checkbox-rest_2018-01-11-18-54.json
deleted file mode 100644
index 040117bd1a8a9..0000000000000
--- a/common/changes/office-ui-fabric-react/checkbox-rest_2018-01-11-18-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Checkbox and ChoiceGroup: New resting state border color.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 1e193cc1034c5..b84ea9a188fcd 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.13.0",
+      "tag": "@uifabric/experiments_v5.13.0",
+      "date": "Fri, 12 Jan 2018 20:03:21 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "KatherineThayerMicrosoft <kathayer@microsoft.com>",
+            "commit": "c874551bebff3b1936262d482c0b2f180ca6edb8",
+            "comment": "Add demo of size 64 file type icons"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.39.0 <6.0.0` to `>=5.39.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/file-type-icons\" from `>=0.2.0 <1.0.0` to `>=0.3.0 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.12.0",
       "tag": "@uifabric/experiments_v5.12.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index f2b901614c7a1..7169b39061be3 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Wed, 10 Jan 2018 11:23:36 GMT and should not be manually modified.
+This log was last generated on Fri, 12 Jan 2018 20:03:21 GMT and should not be manually modified.
+
+## 5.13.0
+Fri, 12 Jan 2018 20:03:21 GMT
+
+### Minor changes
+
+- Add demo of size 64 file type icons
 
 ## 5.12.0
 Wed, 10 Jan 2018 11:23:36 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 5d45b06e1a55a..a627ce5fc61f5 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.12.0",
+  "version": "5.13.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -30,7 +30,7 @@
     "@types/enzyme-adapter-react-16": "1.0.1",
     "@types/webpack-env": "1.13.0",
     "@uifabric/example-app-base": ">=5.2.0 <6.0.0",
-    "@uifabric/file-type-icons": ">=0.2.0 <1.0.0",
+    "@uifabric/file-type-icons": ">=0.3.0 <1.0.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.1.0 <6.0.0",
     "es6-weak-map": "^2.0.2",
     "enzyme": "^3.2.0",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.39.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.39.1 <6.0.0",
     "@uifabric/icons": ">=5.4.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/file-type-icons/CHANGELOG.json b/packages/file-type-icons/CHANGELOG.json
index 534fb9e4479dc..2c7d865154efa 100644
--- a/packages/file-type-icons/CHANGELOG.json
+++ b/packages/file-type-icons/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/file-type-icons",
   "entries": [
+    {
+      "version": "0.3.0",
+      "tag": "@uifabric/file-type-icons_v0.3.0",
+      "date": "Fri, 12 Jan 2018 20:03:21 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "KatherineThayerMicrosoft <kathayer@microsoft.com>",
+            "commit": "c874551bebff3b1936262d482c0b2f180ca6edb8",
+            "comment": "Support size 64 file type icons"
+          }
+        ]
+      }
+    },
     {
       "version": "0.2.0",
       "tag": "@uifabric/file-type-icons_v0.2.0",
diff --git a/packages/file-type-icons/CHANGELOG.md b/packages/file-type-icons/CHANGELOG.md
index 5b608d94bdc91..93eaac50b83ab 100644
--- a/packages/file-type-icons/CHANGELOG.md
+++ b/packages/file-type-icons/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/file-type-icons
 
-This log was last generated on Tue, 09 Jan 2018 11:12:24 GMT and should not be manually modified.
+This log was last generated on Fri, 12 Jan 2018 20:03:22 GMT and should not be manually modified.
+
+## 0.3.0
+Fri, 12 Jan 2018 20:03:21 GMT
+
+### Minor changes
+
+- Support size 64 file type icons
 
 ## 0.2.0
 Tue, 09 Jan 2018 11:12:24 GMT
diff --git a/packages/file-type-icons/package.json b/packages/file-type-icons/package.json
index 6164cb31b887d..4f6251834bf99 100644
--- a/packages/file-type-icons/package.json
+++ b/packages/file-type-icons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/file-type-icons",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "Office UI Fabric file type icon set.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 93f6ec8ec9668..ac6c2e3c51aaa 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.39.1",
+      "tag": "office-ui-fabric-react_v5.39.1",
+      "date": "Fri, 12 Jan 2018 20:03:22 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "6cf2f05c67df587f5d599fe37ab69b02d35ba4e0",
+            "comment": "Checkbox and ChoiceGroup: New resting state border color."
+          }
+        ]
+      }
+    },
     {
       "version": "5.39.0",
       "tag": "office-ui-fabric-react_v5.39.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index e79c9dd06865e..56e397e0b9e10 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 10 Jan 2018 11:23:36 GMT and should not be manually modified.
+This log was last generated on Fri, 12 Jan 2018 20:03:22 GMT and should not be manually modified.
+
+## 5.39.1
+Fri, 12 Jan 2018 20:03:22 GMT
+
+### Patches
+
+- Checkbox and ChoiceGroup: New resting state border color.
 
 ## 5.39.0
 Wed, 10 Jan 2018 11:23:36 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 989dc0ab9cf01..3d38e515f1967 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.39.0",
+  "version": "5.39.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 3a3877323f5a0b1a9d9d7bb74d4a649802aa9bc0 Mon Sep 17 00:00:00 2001
From: Trevor Gau <trevorsg@gmail.com>
Date: Fri, 12 Jan 2018 16:11:56 -0500
Subject: [PATCH 1209/1641] Do not emit style rules for properties with a value
 of undefined. (#3701)

---
 .../merge-styles/master_2018-01-10-15-59.json         | 11 +++++++++++
 packages/merge-styles/src/styleToClassName.test.ts    |  5 +++++
 packages/merge-styles/src/styleToClassName.ts         |  4 ++--
 3 files changed, 18 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/merge-styles/master_2018-01-10-15-59.json

diff --git a/common/changes/@uifabric/merge-styles/master_2018-01-10-15-59.json b/common/changes/@uifabric/merge-styles/master_2018-01-10-15-59.json
new file mode 100644
index 0000000000000..37a6043509d12
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/master_2018-01-10-15-59.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "Fix styles with undefined values being added to document (#3700)",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "trgau@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/merge-styles/src/styleToClassName.test.ts b/packages/merge-styles/src/styleToClassName.test.ts
index ba6e63ac23f9b..a46fcaebc337a 100644
--- a/packages/merge-styles/src/styleToClassName.test.ts
+++ b/packages/merge-styles/src/styleToClassName.test.ts
@@ -96,6 +96,11 @@ describe('styleToClassName', () => {
     expect(styleToClassName()).toEqual('');
   });
 
+  it('does not emit a rule which has an undefined value', () => {
+    expect(styleToClassName({fontFamily: undefined})).toEqual('');
+    expect(_stylesheet.getRules()).toEqual('');
+  });
+
   it('returns the same class name for a rule that only has a displayName', () => {
     expect(styleToClassName({ displayName: 'foo' })).toEqual('foo-0');
     expect(styleToClassName({ displayName: 'foo' })).toEqual('foo-0');
diff --git a/packages/merge-styles/src/styleToClassName.ts b/packages/merge-styles/src/styleToClassName.ts
index b9baa77160f91..b1eb495010eea 100644
--- a/packages/merge-styles/src/styleToClassName.ts
+++ b/packages/merge-styles/src/styleToClassName.ts
@@ -108,7 +108,7 @@ function getKeyForRules(rules: IRuleSet): string | undefined {
     const rulesForSelector = rules[selector];
 
     for (const propName in rulesForSelector) {
-      if (rulesForSelector.hasOwnProperty(propName)) {
+      if (rulesForSelector.hasOwnProperty(propName) && rulesForSelector[propName] !== undefined) {
         hasProps = true;
         serialized.push(propName, rulesForSelector[propName]);
       }
@@ -126,7 +126,7 @@ export function serializeRuleEntries(ruleEntries: { [key: string]: string | numb
   const allEntries: (string | number)[] = [];
 
   for (const entry in ruleEntries) {
-    if (ruleEntries.hasOwnProperty(entry) && entry !== DISPLAY_NAME) {
+    if (ruleEntries.hasOwnProperty(entry) && entry !== DISPLAY_NAME && ruleEntries[entry] !== undefined) {
       allEntries.push(entry, ruleEntries[entry]);
     }
   }

From 2f06f0b76d40d2fe5758d1f35ace403fb5ed1ca5 Mon Sep 17 00:00:00 2001
From: Alex Bettadapur <alexbettadapur@gmail.com>
Date: Fri, 12 Jan 2018 15:17:02 -0800
Subject: [PATCH 1210/1641] DatePicker: Add an initial picker date property
 (#3645)

* Add an initial picker date

* Change file
---
 .../alebet-initialPickerDate_2017-12-28-21-56.json    | 11 +++++++++++
 .../src/components/DatePicker/DatePicker.tsx          |  4 +++-
 .../src/components/DatePicker/DatePicker.types.ts     |  5 +++++
 3 files changed, 19 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/alebet-initialPickerDate_2017-12-28-21-56.json

diff --git a/common/changes/office-ui-fabric-react/alebet-initialPickerDate_2017-12-28-21-56.json b/common/changes/office-ui-fabric-react/alebet-initialPickerDate_2017-12-28-21-56.json
new file mode 100644
index 0000000000000..179498ae97a2b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/alebet-initialPickerDate_2017-12-28-21-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DatePicker: Add an initialPickerDate property",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "alexbettadapur@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 5b1658ec8343d..73e5df76809b1 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -107,6 +107,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
       return null;
     },
     firstDayOfWeek: DayOfWeek.Sunday,
+    initialPickerDate: new Date(),
     isRequired: false,
     isMonthPickerVisible: true,
     showMonthPickerAsOverlay: false,
@@ -173,6 +174,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
       firstDayOfWeek,
       strings,
       label,
+      initialPickerDate,
       isRequired,
       disabled,
       ariaLabel,
@@ -240,7 +242,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
               isMonthPickerVisible={ this.props.isMonthPickerVisible }
               showMonthPickerAsOverlay={ this.props.showMonthPickerAsOverlay }
               today={ this.props.today }
-              value={ selectedDate }
+              value={ selectedDate || initialPickerDate }
               firstDayOfWeek={ firstDayOfWeek }
               strings={ strings! }
               highlightCurrentMonth={ this.props.highlightCurrentMonth }
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
index 6708d605918c3..788ffbefae432 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
@@ -164,6 +164,11 @@ export interface IDatePickerProps extends React.Props<DatePicker> {
    * The maximum allowable date.
    */
   maxDate?: Date;
+
+  /**
+   * The initially highlighted date in the calendar picker
+   */
+  initialPickerDate?: Date;
 }
 
 export interface IDatePickerStrings {

From a06b46af716a79f84c27d897042b2578062f6987 Mon Sep 17 00:00:00 2001
From: Alex Bettadapur <alexbettadapur@gmail.com>
Date: Fri, 12 Jan 2018 15:17:14 -0800
Subject: [PATCH 1211/1641] DatePicker: Default Value should be undefined, not
 new Date() (#3573)

* Make default value to be undefined

* Change file
---
 .../alebet-datePickerUndefined_2017-12-13-21-54.json  | 11 +++++++++++
 .../src/components/DatePicker/DatePicker.tsx          |  7 ++-----
 .../src/components/DatePicker/DatePicker.types.ts     |  2 +-
 3 files changed, 14 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/alebet-datePickerUndefined_2017-12-13-21-54.json

diff --git a/common/changes/office-ui-fabric-react/alebet-datePickerUndefined_2017-12-13-21-54.json b/common/changes/office-ui-fabric-react/alebet-datePickerUndefined_2017-12-13-21-54.json
new file mode 100644
index 0000000000000..48c4dcdb3e77e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/alebet-datePickerUndefined_2017-12-13-21-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DatePicker: Default selectedDate should be undefined, not new Date()",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "alexbettadapur@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 73e5df76809b1..c5b287406010c 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -22,8 +22,6 @@ import * as stylesImport from './DatePicker.scss';
 const styles: any = stylesImport;
 
 export interface IDatePickerState {
-  /** The currently focused date in the drop down, but not necessarily selected */
-  navigatedDate?: Date;
   selectedDate?: Date;
   formattedDate?: string;
   isDatePickerShown?: boolean;
@@ -134,7 +132,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     let { formatDate, value } = props;
 
     this.state = {
-      selectedDate: value || new Date(),
+      selectedDate: value || undefined,
       formattedDate: (formatDate && value) ? formatDate(value) : '',
       isDatePickerShown: false,
       errorMessage: undefined
@@ -163,7 +161,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     let oldValue = this.state.selectedDate;
     if (!compareDates(oldValue!, value!) || this.props.formatDate !== formatDate) {
       this.setState({
-        selectedDate: value || new Date(),
+        selectedDate: value || undefined,
         formattedDate: (formatDate && value) ? formatDate(value) : '',
       });
     }
@@ -367,7 +365,6 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
       this._focusOnSelectedDateOnUpdate = true;
       this.setState({
         isDatePickerShown: true,
-        navigatedDate: this.state.selectedDate,
         errorMessage: ''
       });
     }
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
index 788ffbefae432..cb46f0a1d351e 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
@@ -96,7 +96,7 @@ export interface IDatePickerProps extends React.Props<DatePicker> {
    * Optional method to format the chosen date to a string to display in the DatePicker
    * @defaultvalue date.toString()
    */
-  formatDate?: (date: Date) => string;
+  formatDate?: (date?: Date) => string;
 
   /**
    * Optional method to parse the text input value to date, it is only useful when allowTextInput is set to true

From c8feab0bdc3b1b71842d699b08e20145c95d9cf5 Mon Sep 17 00:00:00 2001
From: John Miller <rubixws@gmail.com>
Date: Fri, 12 Jan 2018 16:43:25 -0800
Subject: [PATCH 1212/1641] Adding more clarity to component contributions
 (#3705)

* Adding more clarity to contributing to components.

* Updating a word.

* Fixing a couple nits and addressing PR comments.

* Updating the section to include more specific guidance around designing the component.
---
 CONTRIBUTING.md | 52 +++++++++++++++++++++++++++++++++++++++++++++----
 1 file changed, 48 insertions(+), 4 deletions(-)

diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index 92919bede73a1..f94d307d14381 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -1,14 +1,58 @@
 # Contributing to Office UI Fabric
 
-## Creating New Components
+## Components
+Our components are a collection of small, independent, general-purpose UI components intended to be reused throughout an existing application.
 
-### Creating a component via the command line
+### Contributing new components
+We have two main buckets for our new and existing components, Experimental and Fundamental. These categories are created to notify Fabric users which components are expected to be fully supported and stable and which ones are likely to change drastically over a short period of time.
+
+### Design
+
+#### Does the component already exist?
+Before making the decision to design a new component, check to see if the pattern already exists within any current Microsoft design system including our [Adobe XD Toolkit](https://static2.sharepointonline.com/files/fabric/fabric-website/files/officeuifabric.zip). If you are a Microsoft employee please check the internal version of the [Adobe XD Toolkit (Microsoft Employees)](https://microsoft.sharepoint.com/teams/OfficeUIFabric97) or if you have more in depth questions regarding any Microsoft design system, please visit our internal Microsoft [Teams channel](https://teams.microsoft.com/l/channel/19%3a73a5dbc26c9a4d8d91264611995bbdbb%40thread.skype/Fabric%2520Design?groupId=ffe264f2-14d0-48b5-9384-64f808b81294&tenantId=72f988bf-86f1-41af-91ab-2d7cd011db47).
+
+#### Is the proposed component a variant of an existing component?
+If the new component pattern you are proposing already exists, but varies slightly, then please consider creating a variant of the existing pattern. For example, if you were to create a new button that does 1 new thing for our exisiting button then we would suggest creating a variant off the original button, but containing the one additional feature.
+
+#### Qualify - Should it be a shared component?​
+If it’s a new component request, does it add value at a broad level or is it a product-specific customization?​ Product-specific customizations should be stored in local product repos. [//]: # (TODO: add line exlaining how we extend our components and also create a page for extending components)
+
+#### Does this pattern contain Microsoft Intellectual Property?
+If the new component contains Microsoft Intellectual Property, it should be considered Internal and therefore all discussions around the component should __only__ happen internally or within our [Fabric Design Teams channel](https://teams.microsoft.com/l/channel/19%3a73a5dbc26c9a4d8d91264611995bbdbb%40thread.skype/Fabric%2520Design?groupId=ffe264f2-14d0-48b5-9384-64f808b81294&tenantId=72f988bf-86f1-41af-91ab-2d7cd011db47). If the component does not contain Microsoft Intellectual Property then this component can be discussed directly on GitHub in our [issues section](https://github.com/OfficeDev/office-ui-fabric-react/issues).
+
+#### Create
+Create a new component pattern or leverage an existing component and create a variant. Use our [Adobe XD Toolkit](https://static2.sharepointonline.com/files/fabric/fabric-website/files/officeuifabric.zip) as a model for how we document component patterns in Fabric. ​We require that all components have detailed usage guidelines for developers and designers who want to integrate this pattern into their respective product/project. Component should be genericized before submission as much as possible leaving out product specific colors/customizations etc.
+
+#### Review and Socialize​
+Ask for design feedback within the Fabric community through our [Fabric Design Teams channel](https://teams.microsoft.com/l/channel/19%3a73a5dbc26c9a4d8d91264611995bbdbb%40thread.skype/Fabric%2520Design?groupId=ffe264f2-14d0-48b5-9384-64f808b81294&tenantId=72f988bf-86f1-41af-91ab-2d7cd011db47). Or, schedule review with the HVC product team for review.
+Socialize component in Fabric community so other teams have visibility. ​ You can also post an issue on GitHub outlining the component request as long as it doesn't contain any Microsoft Intellectual Property.
+
+### Design Implementation
+
+#### Request the component be added to our Fabric Adobe XD toolkit.
+Submit Internal components to our [Fabric Design Teams channel](https://teams.microsoft.com/l/channel/19%3a73a5dbc26c9a4d8d91264611995bbdbb%40thread.skype/Fabric%2520Design?groupId=ffe264f2-14d0-48b5-9384-64f808b81294&tenantId=72f988bf-86f1-41af-91ab-2d7cd011db47) so a designer on our team can update our toolkit. External components can be submitted via GitHub in our [issue tracking](https://github.com/OfficeDev/office-ui-fabric-react/issues) section.
+
+### Where does the code live for this component?
+If the component has no Microsoft Intellectual Property then it belongs in our public project office-ui-fabric-react. If the component contains Microsoft Intellectual Property then it must live internally. Please reach out to our team for more information about our internal repository.
+
+### How we categorize components within the project.
+
+#### Experimental components
+Experimental components are any new components and or do not currently exist within our [Adobe XD Toolkit](https://static2.sharepointonline.com/files/fabric/fabric-website/files/officeuifabric.zip). By Default, our `create-component` script will place the component folder and files in packages/experiments. new components stay in the experimental phase until a Fabric team member approves the migrations from Experimental to Fundamental. Experimental components are developed in the experiments project located in the `<root of project>packages/experiments` folder. We also view any components that were created as a prototype or proof of concept to be an experiment.
+
+#### Fundamental components
+Fundamental components are the official React representation of our [Adobe XD Toolkit](https://static2.sharepointonline.com/files/fabric/fabric-website/files/officeuifabric.zip) and receive higher priority in respect to stabilization, bug fixes, accessibility, and general design resourcing. Components __cannot__ be immediately added as a Fundamental type component as it will need a period of stabilization and potential API changes. A good portion of the components are currently integrated within some of our major products such as OneDrive and SharePoint. Fundamental components are developed in the office-ui-fabric-react project and within our `<root of project>/packages/office-ui-fabric-react` folder.
+
+### Getting started coding your component
+
+#### Creating a component via the command line
 1. Open a command prompt in the root directory of your project directory.
 2. Run `npm run create-component -- --name YourAwesomeNewComponentName`
   * Our components use the Pascal Case naming convention.
 
-### Creating a component manually.
-1. From the root of the project, travel to `packages/experiments/src/components/`
+#### Creating a component manually.
+1. From the root of the project, navigate to `packages/experiments/src/components/`
+  * Note: All new components should start off as an experimental component in the experiment package. As the component matures, and the Fabric team signs off then we can migrate it over to our main component project.
 2. Create a new folder here with your component name
   * Our components use the Pascal Case naming convention.
   * In this example the component will be called `ExcitingNewComponent`.

From d0ebd373d85dc5848e081ed1d19182f7f14b1706 Mon Sep 17 00:00:00 2001
From: vecooper <35309495+vecooper@users.noreply.github.com>
Date: Sun, 14 Jan 2018 14:31:30 -0800
Subject: [PATCH 1213/1641] Combo box escape key behavior (#3703)

* Fix bug

* Change file

* Update vecooper-comboBoxEscFix_2018-01-10-22-28.json
---
 .../vecooper-comboBoxEscFix_2018-01-10-22-28.json     | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.tsx              |  4 +++-
 2 files changed, 14 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/vecooper-comboBoxEscFix_2018-01-10-22-28.json

diff --git a/common/changes/office-ui-fabric-react/vecooper-comboBoxEscFix_2018-01-10-22-28.json b/common/changes/office-ui-fabric-react/vecooper-comboBoxEscFix_2018-01-10-22-28.json
new file mode 100644
index 0000000000000..28345cc44d626
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/vecooper-comboBoxEscFix_2018-01-10-22-28.json
@@ -0,0 +1,11 @@
+
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Escape key shouldn't propagate in combo box if it isn't open",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "vecooper@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 315d4690ff8c8..22d0875891a1f 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -1313,6 +1313,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
           this.setState({
             isOpen: false
           });
+        } else {
+          return;
         }
         break;
 
@@ -1515,7 +1517,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     if (this.props.allowFreeform) {
       this.focus(true);
     } else {
-       this._onComboBoxClick();
+      this._onComboBoxClick();
     }
   }
 

From 88fd649d875b4535914e9a1f809aa6ac48a613ee Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Sun, 14 Jan 2018 14:44:04 -0800
Subject: [PATCH 1214/1641] Adding indeterminate ProgressIndicator variation
 (#3679)

* Basic indeterminate progress implementation

* Fixing snapshot issues.

* Adding zero check, prop comments, and removing unused SASS.

* Adding RTL support.

* Rush change

* no message

* Fixing build

* Addressing PR comments and improving zero handling

* Fixing snapshot
---
 ...determinate-progress_2018-01-08-22-52.json | 11 ++++++
 .../ProgressIndicator/ProgressIndicator.scss  | 31 +++++++++++++++
 .../ProgressIndicator.test.tsx                |  8 +++-
 .../ProgressIndicator/ProgressIndicator.tsx   | 12 +++---
 .../ProgressIndicator.types.ts                |  2 +-
 .../ProgressIndicatorPage.tsx                 | 13 +++++--
 .../ProgressIndicator.test.tsx.snap           | 39 +++++++++++++++++--
 ...rogressIndicator.Indeterminate.Example.tsx | 20 ++++++++++
 8 files changed, 123 insertions(+), 13 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-indeterminate-progress_2018-01-08-22-52.json
 create mode 100644 packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Indeterminate.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/v-krbrow-indeterminate-progress_2018-01-08-22-52.json b/common/changes/office-ui-fabric-react/v-krbrow-indeterminate-progress_2018-01-08-22-52.json
new file mode 100644
index 0000000000000..c84c20a01ce35
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-indeterminate-progress_2018-01-08-22-52.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ProgressIndicator: Adding indeterminate progress variant.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
index 19884a9b6a69c..c0a002d3bb8e7 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
@@ -55,13 +55,44 @@ $ProgressIndicatorTextHeight: 18px;
   transition: width .3s ease;
   width: 0;
 
+  &.indeterminate {
+    position: absolute;
+    min-width: 33%;
+    background: linear-gradient(to right, transparent 0%, $ms-color-themePrimary 50%, transparent 100%);
+    animation: indeterminateProgress 3s infinite;
+  }
+
   @include high-contrast {
     background-color: WindowText;
   }
+
+  @include RTL {
+    &.indeterminate {
+      animation: indeterminateProgressRTL 3s infinite;
+    }
+  }
 }
 
 .smoothTransition {
   transition-property: width;
   transition-timing-function: linear;
   transition-duration: 150ms;
+}
+
+@keyframes indeterminateProgress {
+  0% {
+    left: -30%;
+  }
+  100% {
+    left: 100%;
+  }
+}
+
+@keyframes indeterminateProgressRTL {
+  0% {
+    right: -30%;
+  }
+  100% {
+    right: 100%;
+  }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.test.tsx b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.test.tsx
index dbef4b0000313..3b5ad5c04f39e 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.test.tsx
@@ -5,8 +5,14 @@ import { ProgressIndicator } from './ProgressIndicator';
 
 describe('ProgressIndicator', () => {
   it('renders ProgressIndicator correctly', () => {
+    const component = renderer.create(<ProgressIndicator percentComplete={ 0.75 } />);
+    const tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
+  it('renders indeterminate ProgressIndicator correctly', () => {
     const component = renderer.create(<ProgressIndicator />);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx
index 7201a03476865..f4085b75881c2 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx
@@ -18,7 +18,6 @@ export class ProgressIndicator extends BaseComponent<IProgressIndicatorProps, {}
   public static defaultProps = {
     label: '',
     description: '',
-    percentComplete: 0,
     width: 180
   };
 
@@ -39,7 +38,9 @@ export class ProgressIndicator extends BaseComponent<IProgressIndicatorProps, {}
       label = title;
     }
 
-    percentComplete = Math.min(100, Math.max(0, percentComplete! * 100));
+    if (this.props.percentComplete !== undefined) {
+      percentComplete = Math.min(100, Math.max(0, percentComplete! * 100));
+    }
 
     return (
       <div className={ css('ms-ProgressIndicator', styles.root, className) }>
@@ -50,13 +51,14 @@ export class ProgressIndicator extends BaseComponent<IProgressIndicatorProps, {}
             className={ css(
               'ms-ProgressIndicator-progressBar',
               styles.progressBar,
-              percentComplete > ZERO_THRESHOLD && 'smoothTransition'
+              percentComplete && percentComplete > ZERO_THRESHOLD && 'smoothTransition',
+              percentComplete === undefined && styles.indeterminate
             ) }
-            style={ { width: percentComplete + '%' } }
+            style={ percentComplete !== undefined ? { width: percentComplete + '%' } : undefined }
             role='progressbar'
             aria-valuemin='0'
             aria-valuemax='100'
-            aria-valuenow={ percentComplete.toFixed().toString() }
+            aria-valuenow={ percentComplete && percentComplete.toFixed().toString() }
             aria-valuetext={ ariaValueText }
           />
         </div>
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.types.ts b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.types.ts
index 157820aa0ce6f..e920ff538f387 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.types.ts
@@ -25,7 +25,7 @@ export interface IProgressIndicatorProps {
   description?: string;
 
   /**
-   * Percentage of the operation's completeness.
+   * Percentage of the operation's completeness. If this is not set, the indeterminate progress animation will be shown instead.
    */
   percentComplete?: number;
 
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx
index 9160c86d0de5c..85746ac5d3bd4 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicatorPage.tsx
@@ -6,10 +6,12 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import { ProgressIndicatorBasicExample } from './examples/ProgressIndicator.Basic.Example';
+import { ProgressIndicatorIndeterminateExample } from './examples/ProgressIndicator.Indeterminate.Example';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { ProgressIndicatorStatus } from './ProgressIndicator.checklist';
 
 const ProgressIndicatorBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Basic.Example.tsx') as string;
+const ProgressIndicatorIndeterminateExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Indeterminate.Example.tsx') as string;
 
 export class ProgressIndicatorPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
@@ -18,9 +20,14 @@ export class ProgressIndicatorPage extends React.Component<IComponentDemoPagePro
         title='ProgressIndicator'
         componentName='ProgressIndicatorExample'
         exampleCards={
-          <ExampleCard title='Default ProgressIndicator' code={ ProgressIndicatorBasicExampleCode }>
-            <ProgressIndicatorBasicExample />
-          </ExampleCard>
+          <div>
+            <ExampleCard title='Default ProgressIndicator' code={ ProgressIndicatorBasicExampleCode }>
+              <ProgressIndicatorBasicExample />
+            </ExampleCard>
+            <ExampleCard title='Indeterminate ProgressIndicator' code={ ProgressIndicatorIndeterminateExampleCode }>
+              <ProgressIndicatorIndeterminateExample />
+            </ExampleCard>
+          </div>
         }
         propertiesTables={
           <PropertiesTableSet
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/__snapshots__/ProgressIndicator.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ProgressIndicator/__snapshots__/ProgressIndicator.test.tsx.snap
index 8a72e32525a1f..1e5a1e6566ea0 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/__snapshots__/ProgressIndicator.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/__snapshots__/ProgressIndicator.test.tsx.snap
@@ -18,13 +18,13 @@ exports[`ProgressIndicator renders ProgressIndicator correctly 1`] = `
     <div
       aria-valuemax="100"
       aria-valuemin="0"
-      aria-valuenow="0"
+      aria-valuenow="75"
       aria-valuetext={undefined}
-      className="ms-ProgressIndicator-progressBar"
+      className="ms-ProgressIndicator-progressBar smoothTransition"
       role="progressbar"
       style={
         Object {
-          "width": "0%",
+          "width": "75%",
         }
       }
     />
@@ -36,3 +36,36 @@ exports[`ProgressIndicator renders ProgressIndicator correctly 1`] = `
   </div>
 </div>
 `;
+
+exports[`ProgressIndicator renders indeterminate ProgressIndicator correctly 1`] = `
+<div
+  className="ms-ProgressIndicator"
+>
+  <div
+    className="ms-ProgressIndicator-itemName"
+  >
+    
+  </div>
+  <div
+    className="ms-ProgressIndicator-itemProgress"
+  >
+    <div
+      className="ms-ProgressIndicator-progressTrack"
+    />
+    <div
+      aria-valuemax="100"
+      aria-valuemin="0"
+      aria-valuenow={undefined}
+      aria-valuetext={undefined}
+      className="ms-ProgressIndicator-progressBar"
+      role="progressbar"
+      style={undefined}
+    />
+  </div>
+  <div
+    className="ms-ProgressIndicator-itemDescription"
+  >
+    
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Indeterminate.Example.tsx b/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Indeterminate.Example.tsx
new file mode 100644
index 0000000000000..84408eaf4605c
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Indeterminate.Example.tsx
@@ -0,0 +1,20 @@
+import * as React from 'react';
+import {
+  ProgressIndicator
+} from 'office-ui-fabric-react/lib/ProgressIndicator';
+import { Async } from 'office-ui-fabric-react/lib/Utilities';
+
+export class ProgressIndicatorIndeterminateExample extends React.Component<{}, {}> {
+  constructor(props: {}) {
+    super(props);
+  }
+
+  public render() {
+    return (
+      <ProgressIndicator
+        label='Example title'
+        description='Example description'
+      />
+    );
+  }
+}

From faf6ef75015c3d6488467e595742993d679b57ae Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Tue, 16 Jan 2018 09:46:56 -0800
Subject: [PATCH 1215/1641] [Picker] Fixed border clipping in high contrast
 mode (#3694)

* Set box-sizing: content-box on TagItem

* Change file
---
 ...gellan-tag_picker_border_fix_2018-01-10-01-43.json | 11 +++++++++++
 .../src/components/pickers/TagPicker/TagItem.scss     |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/magellan-tag_picker_border_fix_2018-01-10-01-43.json

diff --git a/common/changes/office-ui-fabric-react/magellan-tag_picker_border_fix_2018-01-10-01-43.json b/common/changes/office-ui-fabric-react/magellan-tag_picker_border_fix_2018-01-10-01-43.json
new file mode 100644
index 0000000000000..039ba34c555c6
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/magellan-tag_picker_border_fix_2018-01-10-01-43.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Pickers: Fixed border clipping of tag item in high-contrast mode",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.scss b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.scss
index b3537a46c4252..5f5b449d13a8a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.scss
@@ -2,6 +2,7 @@
 
 .root {
   @include focus-border();
+  box-sizing: content-box;
   flex-shrink: 1;
   background: $ms-color-neutralLighter;
   margin: 1px;

From 3879310a7378c6ad1fa2144dedab8730eb9f9953 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 16 Jan 2018 18:16:02 -0800
Subject: [PATCH 1216/1641] Icon component: remove ms-Icon to avoid collisions
 with fabric-core css. (#3720)

* When fabric core css is on the page, the ms-Icon class collides with styling in fabric-react, and can override the partitioned icon font-family, causing icons to render from the fabric-core 88k+ uber font.

* change file.

* Fixing combobox styling.

* Updating snapshot.
---
 .../remove-icon-classname_2018-01-14-21-43.json       | 11 +++++++++++
 .../__snapshots__/ActivityItem.test.tsx.snap          |  4 ++--
 .../Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap |  8 --------
 .../Button/__snapshots__/Button.test.tsx.snap         |  3 ---
 .../Calendar/__snapshots__/Calendar.test.tsx.snap     |  8 ++++----
 .../Checkbox/__snapshots__/Checkbox.test.tsx.snap     |  2 +-
 .../src/components/ComboBox/ComboBox.styles.ts        |  7 +++----
 .../ComboBox/__snapshots__/ComboBox.test.tsx.snap     |  6 +-----
 .../CommandBar/__snapshots__/CommandBar.test.tsx.snap |  1 -
 .../DatePicker/__snapshots__/DatePicker.test.tsx.snap |  1 -
 .../__snapshots__/DocumentCard.test.tsx.snap          |  2 +-
 .../Dropdown/__snapshots__/Dropdown.test.tsx.snap     |  2 --
 .../src/components/Icon/Icon.tsx                      |  4 +---
 .../components/Icon/__snapshots__/Icon.test.tsx.snap  |  2 +-
 .../MessageBar/__snapshots__/MessageBar.test.tsx.snap |  2 +-
 .../components/Nav/__snapshots__/Nav.test.tsx.snap    |  1 -
 .../Rating/__snapshots__/Rating.test.tsx.snap         | 10 ----------
 .../SearchBox/__snapshots__/SearchBox.test.tsx.snap   |  1 -
 .../SpinButton/__snapshots__/SpinButton.test.tsx.snap |  2 --
 19 files changed, 26 insertions(+), 51 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/remove-icon-classname_2018-01-14-21-43.json

diff --git a/common/changes/office-ui-fabric-react/remove-icon-classname_2018-01-14-21-43.json b/common/changes/office-ui-fabric-react/remove-icon-classname_2018-01-14-21-43.json
new file mode 100644
index 0000000000000..8dfd7b8d8e179
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/remove-icon-classname_2018-01-14-21-43.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Icon: the `ms-Icon` class name, despite being unused, is causing conflicts with fabric-core usage inadvertently. There isn't a great way to deal with this other than to avoid re-using the `ms-Icon` class name.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap
index 9fa533ba04b9a..b3acb36fff522 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap
@@ -175,7 +175,7 @@ exports[`ActivityItem renders compact with an icon correctly 1`] = `
       aria-hidden={true}
       aria-label={undefined}
       className=
-          ms-Icon
+
           {
             display: inline-block;
           }
@@ -596,7 +596,7 @@ exports[`ActivityItem renders with an icon correctly 1`] = `
       aria-hidden={true}
       aria-label={undefined}
       className=
-          ms-Icon
+
           {
             display: inline-block;
           }
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
index 731d9b33a9335..30ff42150359c 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
@@ -46,7 +46,6 @@ exports[`Breadcrumb renders breadcumb correctly 1`] = `
               aria-hidden={true}
               aria-label={undefined}
               className=
-                  ms-Icon
                   ms-Breadcrumb-chevron
                   {
                     display: inline-block;
@@ -76,7 +75,6 @@ exports[`Breadcrumb renders breadcumb correctly 1`] = `
               aria-hidden={true}
               aria-label={undefined}
               className=
-                  ms-Icon
                   ms-Breadcrumb-chevron
                   {
                     display: inline-block;
@@ -106,7 +104,6 @@ exports[`Breadcrumb renders breadcumb correctly 1`] = `
               aria-hidden={true}
               aria-label={undefined}
               className=
-                  ms-Icon
                   ms-Breadcrumb-chevron
                   {
                     display: inline-block;
@@ -136,7 +133,6 @@ exports[`Breadcrumb renders breadcumb correctly 1`] = `
               aria-hidden={true}
               aria-label={undefined}
               className=
-                  ms-Icon
                   ms-Breadcrumb-chevron
                   {
                     display: inline-block;
@@ -259,7 +255,6 @@ exports[`Breadcrumb renders breadcumb correctly 2`] = `
                   aria-hidden={true}
                   aria-label={undefined}
                   className=
-                      ms-Icon
                       ms-Button-icon
                       {
                         display: inline-block;
@@ -285,7 +280,6 @@ exports[`Breadcrumb renders breadcumb correctly 2`] = `
               aria-hidden={true}
               aria-label={undefined}
               className=
-                  ms-Icon
                   ms-Breadcrumb-chevron
                   {
                     display: inline-block;
@@ -315,7 +309,6 @@ exports[`Breadcrumb renders breadcumb correctly 2`] = `
               aria-hidden={true}
               aria-label={undefined}
               className=
-                  ms-Icon
                   ms-Breadcrumb-chevron
                   {
                     display: inline-block;
@@ -345,7 +338,6 @@ exports[`Breadcrumb renders breadcumb correctly 2`] = `
               aria-hidden={true}
               aria-label={undefined}
               className=
-                  ms-Icon
                   ms-Breadcrumb-chevron
                   {
                     display: inline-block;
diff --git a/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
index 6995aa46232a5..0fbc1378c8cfc 100644
--- a/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
@@ -182,7 +182,6 @@ exports[`Button renders CommandBarButton correctly 1`] = `
       aria-hidden={true}
       aria-label={undefined}
       className=
-          ms-Icon
           ms-Button-icon
           {
             display: inline-block;
@@ -230,7 +229,6 @@ exports[`Button renders CommandBarButton correctly 1`] = `
       aria-hidden={true}
       aria-label={undefined}
       className=
-          ms-Icon
           ms-Button-menuIcon
           {
             display: inline-block;
@@ -557,7 +555,6 @@ exports[`Button renders IconButton correctly 1`] = `
       aria-hidden={true}
       aria-label={undefined}
       className=
-          ms-Icon
           ms-Button-icon
           {
             display: inline-block;
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/__snapshots__/Calendar.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Calendar/__snapshots__/Calendar.test.tsx.snap
index 31df7ed33f3a1..8c17fcba58ee9 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/__snapshots__/Calendar.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Calendar/__snapshots__/Calendar.test.tsx.snap
@@ -41,7 +41,7 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                     aria-hidden={true}
                     aria-label={undefined}
                     className=
-                        ms-Icon
+
                         {
                           display: inline-block;
                         }
@@ -62,7 +62,7 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                     aria-hidden={true}
                     aria-label={undefined}
                     className=
-                        ms-Icon
+
                         {
                           display: inline-block;
                         }
@@ -918,7 +918,7 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                     aria-hidden={true}
                     aria-label={undefined}
                     className=
-                        ms-Icon
+
                         {
                           display: inline-block;
                         }
@@ -938,7 +938,7 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                     aria-hidden={true}
                     aria-label={undefined}
                     className=
-                        ms-Icon
+
                         {
                           display: inline-block;
                         }
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
index b2bc439374e0e..a40e7894da1ed 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
@@ -106,7 +106,7 @@ exports[`Checkbox renders Checkbox correctly 1`] = `
         aria-hidden={true}
         aria-label={undefined}
         className=
-            ms-Icon
+
             {
               display: inline-block;
             }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index 2817bc67cc090..23814ba2fb8f8 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -160,12 +160,12 @@ export const getCaretDownButtonStyles = memoizeFunction((
           borderColor: 'ButtonText',
           color: 'ButtonText',
           MsHighContrastAdjust: 'none'
-        },
-        '.ms-Icon': {
-          fontSize: FontSizes.small
         }
       }
     },
+    icon: {
+      fontSize: FontSizes.small
+    },
     rootHovered: {
       backgroundColor: caretButtonBackgroundHovered,
       color: caretButtonTextColorHoveredChecked,
@@ -195,7 +195,6 @@ export const getStyles = memoizeFunction((
 ): Partial<IComboBoxStyles> => {
 
   const { semanticColors, fonts, palette } = theme;
-
   const ComboBoxRootBackground = semanticColors.bodyBackground;
   const ComboBoxRootTextColor = semanticColors.bodyText;
   const ComboBoxRootBorderColor = semanticColors.inputBorder;
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
index ce96a7f090f96..c3fb997882aee 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
@@ -173,9 +173,6 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
             border-color: ButtonText;
             color: ButtonText;
           }
-          & .ms-Icon {
-            font-size: 12px;
-          }
           &:hover {
             background-color: #f4f4f4;
             color: #212121;
@@ -207,14 +204,13 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
           aria-hidden={true}
           aria-label={undefined}
           className=
-              ms-Icon
               ms-Button-icon
               {
                 display: inline-block;
               }
               {
                 flex-shrink: 0;
-                font-size: 16px;
+                font-size: 12px;
                 height: 16px;
                 line-height: 16px;
                 margin-bottom: 0;
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap b/packages/office-ui-fabric-react/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
index c696f9f443dbd..06410c197e976 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
@@ -40,7 +40,6 @@ exports[`CommandBar renders CommandBar correctly 1`] = `
             aria-hidden={true}
             aria-label={undefined}
             className=
-                ms-Icon
                 ms-CommandBarItem-chevronDown
                 {
                   display: inline-block;
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap
index ea0e3e73a30de..213d16b79fbc4 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap
@@ -40,7 +40,6 @@ exports[`DatePicker renders default DatePicker correctly 1`] = `
             aria-hidden={true}
             aria-label={undefined}
             className=
-                ms-Icon
                 ms-DatePicker-event--without-label
                 {
                   display: inline-block;
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap b/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap
index aa9b51f2f7a81..a60ae4c7ac5c2 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap
@@ -50,7 +50,7 @@ exports[`DocumentCard renders DocumentCard correctly 1`] = `
                 aria-hidden={true}
                 aria-label={undefined}
                 className=
-                    ms-Icon
+
                     {
                       display: inline-block;
                     }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap
index 66b625309f7a9..89eb9f638d7c5 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap
@@ -37,7 +37,6 @@ exports[`Dropdown multi-select Renders multiselect Dropdown correctly 1`] = `
         aria-hidden={true}
         aria-label={undefined}
         className=
-            ms-Icon
             ms-Dropdown-caretDown
             {
               display: inline-block;
@@ -87,7 +86,6 @@ exports[`Dropdown single-select Renders single-select Dropdown correctly 1`] = `
         aria-hidden={true}
         aria-label={undefined}
         className=
-            ms-Icon
             ms-Dropdown-caretDown
             {
               display: inline-block;
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
index c3083e8d0af0d..d38fecb3baeae 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
@@ -24,7 +24,6 @@ export const Icon = (props: IIconProps): JSX.Element => {
 
   if (props.iconType === IconType.image || props.iconType === IconType.Image) {
     let containerClassName = css(
-      'ms-Icon',
       'ms-Icon-imageContainer',
       classNames.root,
       classNames.imageContainer,
@@ -53,7 +52,7 @@ export const Icon = (props: IIconProps): JSX.Element => {
         { ...getNativeProps(props, htmlElementProperties) }
         className={
           css(
-            'ms-Icon ms-Icon-placeHolder',
+            'ms-Icon-placeHolder',
             classNames.rootHasPlaceHolder,
             props.className
           ) }
@@ -78,7 +77,6 @@ export const Icon = (props: IIconProps): JSX.Element => {
         { ...getNativeProps(props, htmlElementProperties) }
         className={
           css(
-            'ms-Icon', // dangerous?
             iconDefinition.subset.className,
             classNames.root,
             props.className
diff --git a/packages/office-ui-fabric-react/src/components/Icon/__snapshots__/Icon.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Icon/__snapshots__/Icon.test.tsx.snap
index 51ea391b750b4..3b1bc246f9721 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/__snapshots__/Icon.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Icon/__snapshots__/Icon.test.tsx.snap
@@ -5,7 +5,7 @@ exports[`Icon renders Icon correctly 1`] = `
   aria-hidden={true}
   aria-label={undefined}
   className=
-      ms-Icon
+
       {
         display: inline-block;
       }
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/__snapshots__/MessageBar.test.tsx.snap b/packages/office-ui-fabric-react/src/components/MessageBar/__snapshots__/MessageBar.test.tsx.snap
index 2880cfdad049c..582e808dec4c9 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/__snapshots__/MessageBar.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/__snapshots__/MessageBar.test.tsx.snap
@@ -16,7 +16,7 @@ exports[`MessageBar renders MessageBar correctly 1`] = `
         aria-hidden={true}
         aria-label={undefined}
         className=
-            ms-Icon
+
             {
               display: inline-block;
             }
diff --git a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
index 9a9e92ba649af..25e12db86478e 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
@@ -124,7 +124,6 @@ exports[`Nav renders Nav correctly 1`] = `
                     aria-hidden={true}
                     aria-label={undefined}
                     className=
-                        ms-Icon
                         ms-Icon-placeHolder
                         ms-Button-icon
                         {
diff --git a/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap
index 311e8cd78f08a..fc292a8d5840e 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap
@@ -107,7 +107,6 @@ exports[`Rating Renders Rating correctly 1`] = `
           aria-hidden={true}
           aria-label={undefined}
           className=
-              ms-Icon
               ms-RatingStar-back
               {
                 display: inline-block;
@@ -123,7 +122,6 @@ exports[`Rating Renders Rating correctly 1`] = `
           aria-hidden={true}
           aria-label={undefined}
           className=
-              ms-Icon
               ms-RatingStar-front
               {
                 display: inline-block;
@@ -233,7 +231,6 @@ exports[`Rating Renders Rating correctly 1`] = `
           aria-hidden={true}
           aria-label={undefined}
           className=
-              ms-Icon
               ms-RatingStar-back
               {
                 display: inline-block;
@@ -249,7 +246,6 @@ exports[`Rating Renders Rating correctly 1`] = `
           aria-hidden={true}
           aria-label={undefined}
           className=
-              ms-Icon
               ms-RatingStar-front
               {
                 display: inline-block;
@@ -359,7 +355,6 @@ exports[`Rating Renders Rating correctly 1`] = `
           aria-hidden={true}
           aria-label={undefined}
           className=
-              ms-Icon
               ms-RatingStar-back
               {
                 display: inline-block;
@@ -375,7 +370,6 @@ exports[`Rating Renders Rating correctly 1`] = `
           aria-hidden={true}
           aria-label={undefined}
           className=
-              ms-Icon
               ms-RatingStar-front
               {
                 display: inline-block;
@@ -485,7 +479,6 @@ exports[`Rating Renders Rating correctly 1`] = `
           aria-hidden={true}
           aria-label={undefined}
           className=
-              ms-Icon
               ms-RatingStar-back
               {
                 display: inline-block;
@@ -501,7 +494,6 @@ exports[`Rating Renders Rating correctly 1`] = `
           aria-hidden={true}
           aria-label={undefined}
           className=
-              ms-Icon
               ms-RatingStar-front
               {
                 display: inline-block;
@@ -611,7 +603,6 @@ exports[`Rating Renders Rating correctly 1`] = `
           aria-hidden={true}
           aria-label={undefined}
           className=
-              ms-Icon
               ms-RatingStar-back
               {
                 display: inline-block;
@@ -627,7 +618,6 @@ exports[`Rating Renders Rating correctly 1`] = `
           aria-hidden={true}
           aria-label={undefined}
           className=
-              ms-Icon
               ms-RatingStar-front
               {
                 display: inline-block;
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
index 8b8ae95c9f60f..d0e21b9e6842a 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
@@ -56,7 +56,6 @@ exports[`SearchBox renders SearchBox correctly 1`] = `
       aria-hidden={true}
       aria-label={undefined}
       className=
-          ms-Icon
           ms-SearchBox-icon
           {
             display: inline-block;
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
index 931835bcb4a6d..0abcbc137c9f9 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
@@ -230,7 +230,6 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
             aria-hidden={true}
             aria-label={undefined}
             className=
-                ms-Icon
                 ms-Button-icon
                 {
                   display: inline-block;
@@ -338,7 +337,6 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
             aria-hidden={true}
             aria-label={undefined}
             className=
-                ms-Icon
                 ms-Button-icon
                 {
                   display: inline-block;

From 9844d465e78b127e0b5e8f4bd097bac53fbe53c0 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 16 Jan 2018 18:29:45 -0800
Subject: [PATCH 1217/1641] Update
 vecooper-comboBoxEscFix_2018-01-10-22-28.json

---
 .../vecooper-comboBoxEscFix_2018-01-10-22-28.json               | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/common/changes/office-ui-fabric-react/vecooper-comboBoxEscFix_2018-01-10-22-28.json b/common/changes/office-ui-fabric-react/vecooper-comboBoxEscFix_2018-01-10-22-28.json
index 28345cc44d626..2244bbd9d6104 100644
--- a/common/changes/office-ui-fabric-react/vecooper-comboBoxEscFix_2018-01-10-22-28.json
+++ b/common/changes/office-ui-fabric-react/vecooper-comboBoxEscFix_2018-01-10-22-28.json
@@ -1,4 +1,4 @@
-
+{
   "changes": [
     {
       "packageName": "office-ui-fabric-react",

From 549c4175398b9bac4bcffe49c317103d0f462bdb Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 17 Jan 2018 11:11:25 +0000
Subject: [PATCH 1218/1641] Applying package updates.

---
 .../merge-styles/master_2018-01-10-15-59.json | 11 -----
 ...-datePickerUndefined_2017-12-13-21-54.json | 11 -----
 ...et-initialPickerDate_2017-12-28-21-56.json | 11 -----
 ...ag_picker_border_fix_2018-01-10-01-43.json | 11 -----
 ...emove-icon-classname_2018-01-14-21-43.json | 11 -----
 ...determinate-progress_2018-01-08-22-52.json | 11 -----
 ...ooper-comboBoxEscFix_2018-01-10-22-28.json | 11 -----
 .../jest-serializer-merge-styles/package.json |  2 +-
 packages/merge-styles/CHANGELOG.json          | 14 ++++++
 packages/merge-styles/CHANGELOG.md            |  9 +++-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 46 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 17 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/package.json                 |  2 +-
 packages/utilities/package.json               |  2 +-
 scripts/package.json                          |  2 +-
 17 files changed, 91 insertions(+), 86 deletions(-)
 delete mode 100644 common/changes/@uifabric/merge-styles/master_2018-01-10-15-59.json
 delete mode 100644 common/changes/office-ui-fabric-react/alebet-datePickerUndefined_2017-12-13-21-54.json
 delete mode 100644 common/changes/office-ui-fabric-react/alebet-initialPickerDate_2017-12-28-21-56.json
 delete mode 100644 common/changes/office-ui-fabric-react/magellan-tag_picker_border_fix_2018-01-10-01-43.json
 delete mode 100644 common/changes/office-ui-fabric-react/remove-icon-classname_2018-01-14-21-43.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-indeterminate-progress_2018-01-08-22-52.json
 delete mode 100644 common/changes/office-ui-fabric-react/vecooper-comboBoxEscFix_2018-01-10-22-28.json

diff --git a/common/changes/@uifabric/merge-styles/master_2018-01-10-15-59.json b/common/changes/@uifabric/merge-styles/master_2018-01-10-15-59.json
deleted file mode 100644
index 37a6043509d12..0000000000000
--- a/common/changes/@uifabric/merge-styles/master_2018-01-10-15-59.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "Fix styles with undefined values being added to document (#3700)",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "trgau@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/alebet-datePickerUndefined_2017-12-13-21-54.json b/common/changes/office-ui-fabric-react/alebet-datePickerUndefined_2017-12-13-21-54.json
deleted file mode 100644
index 48c4dcdb3e77e..0000000000000
--- a/common/changes/office-ui-fabric-react/alebet-datePickerUndefined_2017-12-13-21-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DatePicker: Default selectedDate should be undefined, not new Date()",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "alexbettadapur@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/alebet-initialPickerDate_2017-12-28-21-56.json b/common/changes/office-ui-fabric-react/alebet-initialPickerDate_2017-12-28-21-56.json
deleted file mode 100644
index 179498ae97a2b..0000000000000
--- a/common/changes/office-ui-fabric-react/alebet-initialPickerDate_2017-12-28-21-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DatePicker: Add an initialPickerDate property",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "alexbettadapur@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/magellan-tag_picker_border_fix_2018-01-10-01-43.json b/common/changes/office-ui-fabric-react/magellan-tag_picker_border_fix_2018-01-10-01-43.json
deleted file mode 100644
index 039ba34c555c6..0000000000000
--- a/common/changes/office-ui-fabric-react/magellan-tag_picker_border_fix_2018-01-10-01-43.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Pickers: Fixed border clipping of tag item in high-contrast mode",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/remove-icon-classname_2018-01-14-21-43.json b/common/changes/office-ui-fabric-react/remove-icon-classname_2018-01-14-21-43.json
deleted file mode 100644
index 8dfd7b8d8e179..0000000000000
--- a/common/changes/office-ui-fabric-react/remove-icon-classname_2018-01-14-21-43.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Icon: the `ms-Icon` class name, despite being unused, is causing conflicts with fabric-core usage inadvertently. There isn't a great way to deal with this other than to avoid re-using the `ms-Icon` class name.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-indeterminate-progress_2018-01-08-22-52.json b/common/changes/office-ui-fabric-react/v-krbrow-indeterminate-progress_2018-01-08-22-52.json
deleted file mode 100644
index c84c20a01ce35..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-indeterminate-progress_2018-01-08-22-52.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ProgressIndicator: Adding indeterminate progress variant.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/vecooper-comboBoxEscFix_2018-01-10-22-28.json b/common/changes/office-ui-fabric-react/vecooper-comboBoxEscFix_2018-01-10-22-28.json
deleted file mode 100644
index 2244bbd9d6104..0000000000000
--- a/common/changes/office-ui-fabric-react/vecooper-comboBoxEscFix_2018-01-10-22-28.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Escape key shouldn't propagate in combo box if it isn't open",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "vecooper@microsoft.com"
-}
diff --git a/packages/jest-serializer-merge-styles/package.json b/packages/jest-serializer-merge-styles/package.json
index 773a912bf8dad..01711f8ee61e8 100644
--- a/packages/jest-serializer-merge-styles/package.json
+++ b/packages/jest-serializer-merge-styles/package.json
@@ -24,6 +24,6 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/merge-styles": ">=5.10.0 <6.0.0"
+    "@uifabric/merge-styles": ">=5.10.1 <6.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index d22e92d16282c..1810ab72ec69a 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.10.1",
+      "tag": "@uifabric/merge-styles_v5.10.1",
+      "date": "Wed, 17 Jan 2018 11:11:25 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Trevor Gau <trevorsg@gmail.com>",
+            "commit": "3a3877323f5a0b1a9d9d7bb74d4a649802aa9bc0",
+            "comment": "Fix styles with undefined values being added to document (#3700)"
+          }
+        ]
+      }
+    },
     {
       "version": "5.10.0",
       "tag": "@uifabric/merge-styles_v5.10.0",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index 6a140d9619d62..37091bcd19b88 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Thu, 28 Dec 2017 11:23:50 GMT and should not be manually modified.
+This log was last generated on Wed, 17 Jan 2018 11:11:25 GMT and should not be manually modified.
+
+## 5.10.1
+Wed, 17 Jan 2018 11:11:25 GMT
+
+### Patches
+
+- Fix styles with undefined values being added to document (#3700)
 
 ## 5.10.0
 Thu, 28 Dec 2017 11:23:50 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index 34b7d7ea32cb4..9a40febda14df 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.10.0",
+  "version": "5.10.1",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index ac6c2e3c51aaa..7de7b4f42e6ae 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,52 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.40.0",
+      "tag": "office-ui-fabric-react_v5.40.0",
+      "date": "Wed, 17 Jan 2018 11:11:25 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Alex Bettadapur <alexbettadapur@gmail.com>",
+            "commit": "a06b46af716a79f84c27d897042b2578062f6987",
+            "comment": "DatePicker: Default selectedDate should be undefined, not new Date()"
+          },
+          {
+            "author": "Alex Bettadapur <alexbettadapur@gmail.com>",
+            "commit": "2f06f0b76d40d2fe5758d1f35ace403fb5ed1ca5",
+            "comment": "DatePicker: Add an initialPickerDate property"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "3879310a7378c6ad1fa2144dedab8730eb9f9953",
+            "comment": "Icon: the `ms-Icon` class name, despite being unused, is causing conflicts with fabric-core usage inadvertently. There isn't a great way to deal with this other than to avoid re-using the `ms-Icon` class name."
+          },
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "88fd649d875b4535914e9a1f809aa6ac48a613ee",
+            "comment": "ProgressIndicator: Adding indeterminate progress variant."
+          }
+        ],
+        "patch": [
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "faf6ef75015c3d6488467e595742993d679b57ae",
+            "comment": "Pickers: Fixed border clipping of tag item in high-contrast mode"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "9844d465e78b127e0b5e8f4bd097bac53fbe53c0",
+            "comment": "Escape key shouldn't propagate in combo box if it isn't open"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.10.0 <6.0.0` to `>=5.10.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.39.1",
       "tag": "office-ui-fabric-react_v5.39.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 56e397e0b9e10..687eb85b1db68 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,21 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 12 Jan 2018 20:03:22 GMT and should not be manually modified.
+This log was last generated on Wed, 17 Jan 2018 11:11:25 GMT and should not be manually modified.
+
+## 5.40.0
+Wed, 17 Jan 2018 11:11:25 GMT
+
+### Minor changes
+
+- DatePicker: Default selectedDate should be undefined, not new Date()
+- DatePicker: Add an initialPickerDate property
+- Icon: the `ms-Icon` class name, despite being unused, is causing conflicts with fabric-core usage inadvertently. There isn't a great way to deal with this other than to avoid re-using the `ms-Icon` class name.
+- ProgressIndicator: Adding indeterminate progress variant.
+
+### Patches
+
+- Pickers: Fixed border clipping of tag item in high-contrast mode
+- Escape key shouldn't propagate in combo box if it isn't open
 
 ## 5.39.1
 Fri, 12 Jan 2018 20:03:22 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 3d38e515f1967..2dc45a41e925f 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.39.1",
+  "version": "5.40.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -48,7 +48,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/icons": ">=5.4.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.10.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.10.1 <6.0.0",
     "@uifabric/styling": ">=5.15.1 <6.0.0",
     "@uifabric/utilities": ">=5.6.1 <6.0.0",
     "prop-types": "^15.5.10",
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 572c542c4d5d1..1b3bdc8aa0d32 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -28,7 +28,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/utilities": ">=5.6.1 <6.0.0",
-    "@uifabric/merge-styles": ">=5.10.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.10.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index cc9ffde939e50..c5421e9818a34 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -36,7 +36,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/merge-styles": ">=5.10.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.10.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/scripts/package.json b/scripts/package.json
index 18ea90414d0f4..3d2ff6af1f331 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -11,7 +11,7 @@
     "@microsoft/api-extractor": "^4.2.6",
     "@microsoft/load-themed-styles": "^1.7.13",
     "@microsoft/loader-load-themed-styles": "^1.6.0",
-    "@uifabric/merge-styles": ">=5.10.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.10.1 <6.0.0",
     "autoprefixer": "^7.1.5",
     "awesome-typescript-loader": "^3.2.3",
     "bundlesize": "^0.15.2",

From 320de0af73525c030af023d10e667c1c9272783b Mon Sep 17 00:00:00 2001
From: Mike Wheaton <miwhea@microsoft.com>
Date: Wed, 17 Jan 2018 11:49:40 -0800
Subject: [PATCH 1219/1641] Publish all example files to NPM (#3736)

* Update NPM ignore to publish all example files, regardless of file name

* Add change file
---
 ...hea-npm-publish-all-examples_2018-01-17-18-02.json | 11 +++++++++++
 packages/office-ui-fabric-react/.npmignore            |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/miwhea-npm-publish-all-examples_2018-01-17-18-02.json

diff --git a/common/changes/office-ui-fabric-react/miwhea-npm-publish-all-examples_2018-01-17-18-02.json b/common/changes/office-ui-fabric-react/miwhea-npm-publish-all-examples_2018-01-17-18-02.json
new file mode 100644
index 0000000000000..d3df05813543b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/miwhea-npm-publish-all-examples_2018-01-17-18-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Update .npmignore to publish all examples",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "miwhea@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/.npmignore b/packages/office-ui-fabric-react/.npmignore
index 80ff782d53024..bc156d511e38c 100644
--- a/packages/office-ui-fabric-react/.npmignore
+++ b/packages/office-ui-fabric-react/.npmignore
@@ -20,7 +20,7 @@ karma.config.js
 node_modules
 src/**/*
 !src/**/*.types.ts
-!src/**/*.Example.tsx
+!src/**/examples/*.tsx
 tsconfig.json
 tsd.json
 tslint.json

From 83c324998c1b39666c1d41770366afddacfae94f Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 17 Jan 2018 12:36:18 -0800
Subject: [PATCH 1220/1641] Update package.json

---
 scripts/package.json | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/scripts/package.json b/scripts/package.json
index 3d2ff6af1f331..d736ca0e41270 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -49,7 +49,7 @@
   "bundlesize": [
     {
       "path": "../apps/test-bundle-button/dist/main.min.js",
-      "maxSize": "42.5 kB"
+      "maxSize": "42.8 kB"
     }
   ]
-}
\ No newline at end of file
+}

From dbd8339d41e228ac1884c5780f3af6ddb67c4b8a Mon Sep 17 00:00:00 2001
From: Kelsey Young <kelseyyoung4@gmail.com>
Date: Wed, 17 Jan 2018 16:00:09 -0800
Subject: [PATCH 1221/1641] Calculate overflow manually to determine if a
 Callout needs a scrollbar (#3712)

* Calculate overflow manually to determine if a Callout needs a scrollbar
- Update snapshot tests
- Don't set overflow Y in Callout .scss file

* Add rush change file
---
 ...ou-callout-scrollbar-changes_2018-01-12-00-51.json | 11 +++++++++++
 .../src/components/Callout/Callout.scss               |  1 -
 .../Callout/__snapshots__/Callout.test.tsx.snap       |  1 +
 .../src/components/Popup/Popup.tsx                    |  8 +++++++-
 4 files changed, 19 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/keyou-callout-scrollbar-changes_2018-01-12-00-51.json

diff --git a/common/changes/office-ui-fabric-react/keyou-callout-scrollbar-changes_2018-01-12-00-51.json b/common/changes/office-ui-fabric-react/keyou-callout-scrollbar-changes_2018-01-12-00-51.json
new file mode 100644
index 0000000000000..fe39a3a02a763
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/keyou-callout-scrollbar-changes_2018-01-12-00-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Calculate overflow manually to determine if Callout needs a scrollbar",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "keyou@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
index f9e16980d02b0..0567f787fa7a1 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
@@ -42,7 +42,6 @@ $Callout-smallbeak-slant-width: 16px;
 .main {
   background-color: $ms-color-white;
   overflow-x: hidden;
-  overflow-y: auto;
   position: relative;
 }
 
diff --git a/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
index 235c704d0d271..232ebb8cd1345 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
@@ -26,6 +26,7 @@ exports[`Callout renders Callout correctly 1`] = `
         Object {
           "backgroundColor": undefined,
           "maxHeight": 750,
+          "overflowY": "auto",
         }
       }
     >
diff --git a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
index 31c6999b4db98..d430613b34288 100644
--- a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
+++ b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
@@ -55,7 +55,12 @@ export class Popup extends BaseComponent<IPopupProps, {}> {
   }
 
   public render() {
-    let { role, className, ariaLabel, ariaLabelledBy, ariaDescribedBy } = this.props;
+    let { role, className, ariaLabel, ariaLabelledBy, ariaDescribedBy, style } = this.props;
+
+    let needsVerticalScrollBar = false;
+    if (this.refs.root && this.refs.root.firstElementChild) {
+      needsVerticalScrollBar = this.refs.root.firstElementChild.clientHeight > this.refs.root.clientHeight;
+    }
 
     return (
       <div
@@ -67,6 +72,7 @@ export class Popup extends BaseComponent<IPopupProps, {}> {
         aria-labelledby={ ariaLabelledBy }
         aria-describedby={ ariaDescribedBy }
         onKeyDown={ this._onKeyDown }
+        style={ { ...style, overflowY: needsVerticalScrollBar ? 'scroll' : 'auto' } }
       >
         { this.props.children }
       </div>

From e292345559756a62ccc92543d918d3c2854c3fb7 Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Wed, 17 Jan 2018 16:37:55 -0800
Subject: [PATCH 1222/1641] BasePicker: Fix accessibility bug where it always
 has aria-expanded=true (#3728)

* fix baseautofill always having expanded be true

* adding in change file

* Fix comments

* updated snapshots

* Fix comments
---
 .../baseautofill-fixexpanded_2018-01-16-19-31.json    | 11 +++++++++++
 .../src/components/pickers/BasePicker.tsx             |  4 ++--
 .../pickers/__snapshots__/BasePicker.test.tsx.snap    |  4 ++--
 3 files changed, 15 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/baseautofill-fixexpanded_2018-01-16-19-31.json

diff --git a/common/changes/office-ui-fabric-react/baseautofill-fixexpanded_2018-01-16-19-31.json b/common/changes/office-ui-fabric-react/baseautofill-fixexpanded_2018-01-16-19-31.json
new file mode 100644
index 0000000000000..daf0c49c06520
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/baseautofill-fixexpanded_2018-01-16-19-31.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "BasePicker: Fix accessibility bug where it always has aria-expanded=true",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 481adc98fc68d..457208f2d0f1f 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -199,7 +199,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
                 suggestedDisplayValue={ suggestedDisplayValue }
                 aria-activedescendant={ 'sug-' + this.suggestionStore.currentIndex }
                 aria-owns='suggestion-list'
-                aria-expanded='true'
+                aria-expanded={ !!this.state.suggestionsVisible }
                 aria-haspopup='true'
                 autoCapitalize='off'
                 autoComplete='off'
@@ -698,7 +698,7 @@ export class BasePickerListBelow<T, P extends IBasePickerProps<T>> extends BaseP
                 suggestedDisplayValue={ suggestedDisplayValue }
                 aria-activedescendant={ 'sug-' + this.suggestionStore.currentIndex }
                 aria-owns='suggestion-list'
-                aria-expanded='true'
+                aria-expanded={ !!this.state.suggestionsVisible }
                 aria-haspopup='true'
                 autoCapitalize='off'
                 autoComplete='off'
diff --git a/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
index 2cf3f9d99d088..f4c1a74dea981 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
@@ -44,7 +44,7 @@ exports[`Pickers BasePicker renders BasePicker correctly 1`] = `
         <input
           aria-activedescendant="sug--1"
           aria-controls="selected-suggestion-alert"
-          aria-expanded="true"
+          aria-expanded={false}
           aria-haspopup="true"
           aria-owns="suggestion-list"
           autoCapitalize="off"
@@ -109,7 +109,7 @@ exports[`Pickers TagPicker renders TagPicker correctly 1`] = `
         <input
           aria-activedescendant="sug--1"
           aria-controls="selected-suggestion-alert"
-          aria-expanded="true"
+          aria-expanded={false}
           aria-haspopup="true"
           aria-owns="suggestion-list"
           autoCapitalize="off"

From 68c143efa00b4897ac070812bced2f0db3e41b14 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 18 Jan 2018 03:21:56 -0800
Subject: [PATCH 1223/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...autofill-fixexpanded_2018-01-16-19-31.json | 11 ---------
 ...ut-scrollbar-changes_2018-01-12-00-51.json | 11 ---------
 ...publish-all-examples_2018-01-17-18-02.json | 11 ---------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 24 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 11 ++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 12 files changed, 41 insertions(+), 41 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/baseautofill-fixexpanded_2018-01-16-19-31.json
 delete mode 100644 common/changes/office-ui-fabric-react/keyou-callout-scrollbar-changes_2018-01-12-00-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/miwhea-npm-publish-all-examples_2018-01-17-18-02.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index ff4f956293332..2a2599b37dcac 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.39.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.40.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 7e2a84092e339..4e0d08eea9b22 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.39.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.40.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index d19905a3d29dc..52973455b9699 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.39.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.40.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 1ee39a8171175..7f8ff26fa6dac 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.39.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.40.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 9f2c781cd2504..07696f330d576 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.39.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.40.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/office-ui-fabric-react/baseautofill-fixexpanded_2018-01-16-19-31.json b/common/changes/office-ui-fabric-react/baseautofill-fixexpanded_2018-01-16-19-31.json
deleted file mode 100644
index daf0c49c06520..0000000000000
--- a/common/changes/office-ui-fabric-react/baseautofill-fixexpanded_2018-01-16-19-31.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "BasePicker: Fix accessibility bug where it always has aria-expanded=true",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/keyou-callout-scrollbar-changes_2018-01-12-00-51.json b/common/changes/office-ui-fabric-react/keyou-callout-scrollbar-changes_2018-01-12-00-51.json
deleted file mode 100644
index fe39a3a02a763..0000000000000
--- a/common/changes/office-ui-fabric-react/keyou-callout-scrollbar-changes_2018-01-12-00-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Calculate overflow manually to determine if Callout needs a scrollbar",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "keyou@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/miwhea-npm-publish-all-examples_2018-01-17-18-02.json b/common/changes/office-ui-fabric-react/miwhea-npm-publish-all-examples_2018-01-17-18-02.json
deleted file mode 100644
index d3df05813543b..0000000000000
--- a/common/changes/office-ui-fabric-react/miwhea-npm-publish-all-examples_2018-01-17-18-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Update .npmignore to publish all examples",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "miwhea@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index a627ce5fc61f5..f306d2dea3d0d 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.39.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.40.1 <6.0.0",
     "@uifabric/icons": ">=5.4.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 7de7b4f42e6ae..3d5924303e49f 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.40.1",
+      "tag": "office-ui-fabric-react_v5.40.1",
+      "date": "Thu, 18 Jan 2018 11:21:56 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "e292345559756a62ccc92543d918d3c2854c3fb7",
+            "comment": "BasePicker: Fix accessibility bug where it always has aria-expanded=true"
+          },
+          {
+            "author": "Kelsey Young <kelseyyoung4@gmail.com>",
+            "commit": "dbd8339d41e228ac1884c5780f3af6ddb67c4b8a",
+            "comment": "Calculate overflow manually to determine if Callout needs a scrollbar"
+          },
+          {
+            "author": "Mike Wheaton <miwhea@microsoft.com>",
+            "commit": "320de0af73525c030af023d10e667c1c9272783b",
+            "comment": "Update .npmignore to publish all examples"
+          }
+        ]
+      }
+    },
     {
       "version": "5.40.0",
       "tag": "office-ui-fabric-react_v5.40.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 687eb85b1db68..0aba4e56aa237 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,15 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 17 Jan 2018 11:11:25 GMT and should not be manually modified.
+This log was last generated on Thu, 18 Jan 2018 11:21:56 GMT and should not be manually modified.
+
+## 5.40.1
+Thu, 18 Jan 2018 11:21:56 GMT
+
+### Patches
+
+- BasePicker: Fix accessibility bug where it always has aria-expanded=true
+- Calculate overflow manually to determine if Callout needs a scrollbar
+- Update .npmignore to publish all examples
 
 ## 5.40.0
 Wed, 17 Jan 2018 11:11:25 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 2dc45a41e925f..e3e18b10ed01c 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.40.0",
+  "version": "5.40.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 39864da18b987267a4c412398aae96342f1640f4 Mon Sep 17 00:00:00 2001
From: Ben Truelove <betrue@microsoft.com>
Date: Thu, 18 Jan 2018 10:41:48 -0800
Subject: [PATCH 1224/1641] Updated radio, checkbox and toggle to use new
 smallInputBorder slots. (#3727)

* Updated radio, checkbox and toggle to use new smallInputBorder slots.

* Added change file for realz.

* Updated snapshot for toggle

* Changed toggle.styles back to toggle.classNames

* Updated reference to toggle.classNames

* Updated semantic slot guidance for inputBorder

* Added example to smallInputBorderHovered

* Removed smallInputBorderHovered class

* Removed errant comma.
---
 ...allInputBorder_semantic_slot_2018-01-16-16-57.json | 11 +++++++++++
 ...allInputBorder_semantic_slot_2018-01-16-16-57.json | 11 +++++++++++
 .../src/common/_semanticSlots.scss                    |  1 +
 .../src/components/Checkbox/Checkbox.styles.ts        |  2 +-
 .../src/components/ChoiceGroup/ChoiceGroup.scss       |  2 +-
 .../src/components/Toggle/Toggle.classNames.ts        |  2 +-
 .../Toggle/__snapshots__/Toggle.test.tsx.snap         |  2 +-
 packages/styling/src/interfaces/ISemanticColors.ts    |  9 +++++++--
 packages/styling/src/styles/theme.ts                  |  1 +
 9 files changed, 35 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/betrue-addSmallInputBorder_semantic_slot_2018-01-16-16-57.json
 create mode 100644 common/changes/office-ui-fabric-react/betrue-addSmallInputBorder_semantic_slot_2018-01-16-16-57.json

diff --git a/common/changes/@uifabric/styling/betrue-addSmallInputBorder_semantic_slot_2018-01-16-16-57.json b/common/changes/@uifabric/styling/betrue-addSmallInputBorder_semantic_slot_2018-01-16-16-57.json
new file mode 100644
index 0000000000000..a815a6a1083b9
--- /dev/null
+++ b/common/changes/@uifabric/styling/betrue-addSmallInputBorder_semantic_slot_2018-01-16-16-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "added semantic slots for smallInputBorder and smallInputBorderHover",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "betrue@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/betrue-addSmallInputBorder_semantic_slot_2018-01-16-16-57.json b/common/changes/office-ui-fabric-react/betrue-addSmallInputBorder_semantic_slot_2018-01-16-16-57.json
new file mode 100644
index 0000000000000..4a911fc5071e9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/betrue-addSmallInputBorder_semantic_slot_2018-01-16-16-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "added smallInputBorder semantic slots and updated checkbox, choicegroup, and toggle to use it.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "betrue@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/common/_semanticSlots.scss b/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
index 011380b5251ef..dd815d7105ad3 100644
--- a/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
+++ b/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
@@ -26,6 +26,7 @@ $inputBackgroundCheckedColor: "[theme:inputBackgroundChecked, default: #0078d7]"
 $inputBackgroundCheckedHoveredColor: "[theme:inputBackgroundCheckedHovered, default: #106ebe]";
 $inputForegroundCheckedColor: "[theme:inputForegroundChecked, default: #ffffff]";
 $inputFocusBorderAltColor: "[theme:inputFocusBorderAlt, default: #0078d7]";
+$smallInputBorderColor: "[theme:inputBorder, default: #666666]";
 
 /* Buttons */
 $buttonBackgroundColor: "[theme:buttonBackground, default: #f4f4f4]";
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
index cfd7bf7184fc4..3dc4721e2ab08 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
@@ -18,7 +18,7 @@ export const getStyles = memoizeFunction((
   const { semanticColors, palette } = theme;
   const checkmarkFontColor = semanticColors.inputForegroundChecked;
   const checkmarkFontColorCheckedDisabled = semanticColors.disabledBackground;
-  const checkboxBorderColor = semanticColors.bodySubtext;
+  const checkboxBorderColor = semanticColors.smallInputBorder;
   const checkboxBorderColorChecked = semanticColors.inputBackgroundChecked;
   const checkboxBorderColorDisabled = semanticColors.disabledText;
   const checkboxBorderHoveredColor = semanticColors.inputBorderHovered;
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
index 43f683caa802d..44cd51145533e 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
@@ -14,7 +14,7 @@ $radioButton-text-hover-color: $bodyTextCheckedColor;
 
 $radioButton-dot-color: $inputBackgroundCheckedColor;
 
-$radioButton-border-color: $bodySubtextColor;
+$radioButton-border-color: $smallInputBorderColor;
 $radioButton-border-hover-color: $inputBorderHoveredColor;
 $radioButton-border-selected-color: $radioButton-dot-color;
 $radioButton-border-selected-hover-color: $inputBackgroundCheckedHoveredColor;
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
index 7aff21b8cf354..922df3b113f30 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
@@ -32,7 +32,7 @@ export const getClassNames = memoizeFunction((
   const thumbCheckedBackground = semanticColors.inputForegroundChecked;
   const thumbDisabledBackground = semanticColors.disabledText;
   const thumbCheckedDisabledBackground = semanticColors.disabledBackground;
-  const pillBorderColor = semanticColors.inputBorder;
+  const pillBorderColor = semanticColors.smallInputBorder;
   const pillBorderHoveredColor = semanticColors.inputBorderHovered;
   const pillBorderDisabledColor = semanticColors.disabledText;
   const textDisabledColor = semanticColors.disabledBodyText;
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap
index a2f6fc843afa9..f46f8708b1855 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap
@@ -49,7 +49,7 @@ exports[`Toggle renders toggle correctly 1`] = `
           ms-Toggle-background
           {
             background: #ffffff;
-            border-color: #a6a6a6;
+            border-color: #666666;
             border-radius: 1em;
             border-style: solid;
             border-width: 1px;
diff --git a/packages/styling/src/interfaces/ISemanticColors.ts b/packages/styling/src/interfaces/ISemanticColors.ts
index 62c541a429e30..dc48a06e33314 100644
--- a/packages/styling/src/interfaces/ISemanticColors.ts
+++ b/packages/styling/src/interfaces/ISemanticColors.ts
@@ -135,14 +135,19 @@ export interface ISemanticColors {
   //// Input controls slots (text fields, checkboxes, radios...)
 
   /**
-   * The border of an input control in its resting, unchecked state; e.g. the box of an unchecked checkbox.
+   * The border of a large input control in its resting, state; e.g. the box of dropdown.
    */
   inputBorder: string;
   /**
-   * The border color of a hovered input control.
+   * The border color of a large hovered input control, such as textbox.
    */
   inputBorderHovered: string;
 
+  /**
+* The border of a small input control in its resting unchecked state; e.g. the box of an unchecked checkbox.
+*/
+  smallInputBorder: string;
+
   /**
    * The background of a checked control; e.g. checked radio button's dot, checked toggle's background.
    */
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index 2c5eb0b437a46..203d08fad2406 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -141,6 +141,7 @@ function _makeSemanticColorsFromPalette(p: IPalette, isInverted: boolean): ISema
     inputBackgroundCheckedHovered: p.themeDarkAlt,
     inputForegroundChecked: p.white,
     inputFocusBorderAlt: p.themePrimary,
+    smallInputBorder: p.neutralSecondary,
 
     buttonBackground: p.neutralLighter,
     buttonBackgroundChecked: p.neutralTertiaryAlt,

From 1bfbeb9c1def0696ce3e946b3db67157e9d43fe1 Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Thu, 18 Jan 2018 12:05:49 -0800
Subject: [PATCH 1225/1641] Persona: Fix a bug where secondary text would take
 space even though there was no text (#3739)

* fix persona so that secondary text no longer takes up space when there is none

* adding change file

* updating persona snapshot
---
 ...na-withtooltipchange_2018-01-18-01-39.json | 11 ++++
 .../src/components/Persona/Persona.tsx        |  4 +-
 .../__snapshots__/Persona.test.tsx.snap       | 66 ++-----------------
 3 files changed, 19 insertions(+), 62 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-persona-withtooltipchange_2018-01-18-01-39.json

diff --git a/common/changes/office-ui-fabric-react/fix-persona-withtooltipchange_2018-01-18-01-39.json b/common/changes/office-ui-fabric-react/fix-persona-withtooltipchange_2018-01-18-01-39.json
new file mode 100644
index 0000000000000..8d786c3cc4bb6
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-persona-withtooltipchange_2018-01-18-01-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Persona: Fix a bug where space would be taken even though there was no secondary text",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index e42c958de196c..60b85db742045 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -124,13 +124,13 @@ export class Persona extends BaseComponent<IPersonaProps, {}> {
       <div className={ className }>
         { render
           ? render(this.props)
-          : <TooltipHost
+          : text && (<TooltipHost
             content={ text }
             overflowMode={ TooltipOverflowMode.Parent }
             directionalHint={ DirectionalHint.topLeftEdge }
           >
             { text }
-          </TooltipHost>
+          </TooltipHost>)
         }
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap
index 62730d70580aa..13ec48d656f4c 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap
@@ -53,40 +53,13 @@ exports[`Persona renders Persona correctly with image 1`] = `
     </div>
     <div
       className="ms-Persona-secondaryText"
-    >
-      <div
-        aria-describedby={undefined}
-        className="ms-TooltipHost"
-        onBlurCapture={[Function]}
-        onFocusCapture={[Function]}
-        onMouseEnter={[Function]}
-        onMouseLeave={[Function]}
-      />
-    </div>
+    />
     <div
       className="ms-Persona-tertiaryText"
-    >
-      <div
-        aria-describedby={undefined}
-        className="ms-TooltipHost"
-        onBlurCapture={[Function]}
-        onFocusCapture={[Function]}
-        onMouseEnter={[Function]}
-        onMouseLeave={[Function]}
-      />
-    </div>
+    />
     <div
       className="ms-Persona-optionalText"
-    >
-      <div
-        aria-describedby={undefined}
-        className="ms-TooltipHost"
-        onBlurCapture={[Function]}
-        onFocusCapture={[Function]}
-        onMouseEnter={[Function]}
-        onMouseLeave={[Function]}
-      />
-    </div>
+    />
   </div>
 </div>
 `;
@@ -157,40 +130,13 @@ exports[`Persona renders Persona correctly with initials 1`] = `
     </div>
     <div
       className="ms-Persona-secondaryText"
-    >
-      <div
-        aria-describedby={undefined}
-        className="ms-TooltipHost"
-        onBlurCapture={[Function]}
-        onFocusCapture={[Function]}
-        onMouseEnter={[Function]}
-        onMouseLeave={[Function]}
-      />
-    </div>
+    />
     <div
       className="ms-Persona-tertiaryText"
-    >
-      <div
-        aria-describedby={undefined}
-        className="ms-TooltipHost"
-        onBlurCapture={[Function]}
-        onFocusCapture={[Function]}
-        onMouseEnter={[Function]}
-        onMouseLeave={[Function]}
-      />
-    </div>
+    />
     <div
       className="ms-Persona-optionalText"
-    >
-      <div
-        aria-describedby={undefined}
-        className="ms-TooltipHost"
-        onBlurCapture={[Function]}
-        onFocusCapture={[Function]}
-        onMouseEnter={[Function]}
-        onMouseLeave={[Function]}
-      />
-    </div>
+    />
   </div>
 </div>
 `;

From 9a2692b254633537189138fc1dfb93f7d04a1eb1 Mon Sep 17 00:00:00 2001
From: Peter Jahn <pejahn@microsoft.com>
Date: Thu, 18 Jan 2018 13:20:22 -0800
Subject: [PATCH 1226/1641] Update CODEOWNERS with new packages and owner
 assignments (#3740)

* Update CODEOWNERS with new packages and owner assignments

* Add @joschect as codeowner for utilities/positioning
---
 .github/CODEOWNERS | 16 ++++++++++------
 1 file changed, 10 insertions(+), 6 deletions(-)

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index dfd0137de54d8..ee5d7f936bcf9 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -24,12 +24,16 @@
 
 #### Packages
 # packages/example-app-base/
-# packages/example-component/
+packages/file-type-icons/  @KatherineThayerMicrosoft @jahnp
+# packages/icons/
+# packages/jest-serializer-merge-styles/
+# packages/merge-styles/
 # packages/office-ui-fabric-react-tslint/
 packages/styling/  @dzearing
 packages/styling/src/interfaces/ @phkuo
 packages/styling/src/styles/ @phkuo
 # packages/utilities/
+packages/utilities/positioning/ @joschect
 
 ### Fabric
 # common/
@@ -46,18 +50,18 @@ dateValues/   @johannao76 lorejoh12@gmail.com jolore@microsoft.com
 # Breadcrumb/
 # Button/
 Calendar/   @johannao76 lorejoh12@gmail.com jolore@microsoft.com
-# Callout/
+Callout/  @joschect
 # Check/
 # Checkbox/
 # ChoiceGroup/
 # ColorPicker/
 # ComboBox/
 CommandBar/   @micahgodbolt
-# ContextualMenu/
+ContextualMenu/  @joschect
 DatePicker/   @johannao76 lorejoh12@gmail.com jolore@microsoft.com
 # DetailsList/
 # Dialog/
-# DocumentCard/
+DocumentCard/ @yiminwu @mikewheaton
 # Dropdown/
 # Fabric/
 # FacePile/
@@ -68,7 +72,7 @@ HoverCard/   @atneik @Jahnp
 # Icon/
 # Image/
 # Label/
-# Layer/
+Layer/  @ThomasMichon
 # Link/
 List/  @cschleiden
 # MarqueeSelection/
@@ -81,7 +85,7 @@ OverflowSet/  @micahgodbolt
 # Persona/
 Persona/PersonaCoin.tsx @mtennoe @jakob101
 Persona/PersonaConsts.tsx @mtennoe @jakob101
-# pickers/
+pickers/  @joschect
 # Pivot/
 # Popup/
 # ProgressIndicator/

From e3dfe7671e4f7b26c0ad888dd7be735c0545d032 Mon Sep 17 00:00:00 2001
From: manas-misra <manas.misra@outlook.com>
Date: Fri, 19 Jan 2018 03:12:17 +0530
Subject: [PATCH 1227/1641]  Bug Fix: FirstWeekOfYear - with FirstFourDayWeek
 setting enabled December 2020 has 2 weeks with number 52 #3119 (#3588)

* Bug Fix: FirstWeekOfYear - with FirstFourDayWeek setting enabled December 2020 has 2 weeks with number 52 #3119

* Removed extra lines

* Renamed the variable referring to last day of previous year

* Added change file
---
 .../fixWeekNumberIssue_2017-12-20-05-55.json  | 11 +++++++++
 .../src/utilities/dateMath/DateMath.test.ts   | 24 +++++++++++++++++++
 .../src/utilities/dateMath/DateMath.ts        |  4 ++--
 3 files changed, 37 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fixWeekNumberIssue_2017-12-20-05-55.json

diff --git a/common/changes/office-ui-fabric-react/fixWeekNumberIssue_2017-12-20-05-55.json b/common/changes/office-ui-fabric-react/fixWeekNumberIssue_2017-12-20-05-55.json
new file mode 100644
index 0000000000000..5857d723722bf
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fixWeekNumberIssue_2017-12-20-05-55.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Changes in Week Number Computation logic for FirstFourDayWeek setting to fix issue 3119",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "manas.misra@outlook.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts
index 5c1fa97cecdeb..b4ff299dcc3ac 100644
--- a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts
+++ b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts
@@ -371,6 +371,18 @@ describe('DateMath', () => {
     result = DateMath.getWeekNumber(date1, 1, 1);
     expected = 52;
     expect(result).toEqual(expected);
+
+    // firstDayOfWeek is Sunday
+    date1 = new Date(2021, 0, 1);
+    result = DateMath.getWeekNumber(date1, 0, 1);
+    expected = 52;
+    expect(result).toEqual(expected);
+
+    // firstDayOfWeek is Monday
+    date1 = new Date(2021, 0, 1);
+    result = DateMath.getWeekNumber(date1, 1, 1);
+    expected = 52;
+    expect(result).toEqual(expected);
   });
 
   // First week of year set to FirstWeekOfYear.FirstFourDayWeek
@@ -410,6 +422,18 @@ describe('DateMath', () => {
     result = DateMath.getWeekNumber(date1, 1, 2);
     expected = 52;
     expect(result).toEqual(expected);
+
+    // firstDayOfWeek is Sunday
+    date1 = new Date(2021, 0, 1);
+    result = DateMath.getWeekNumber(date1, 0, 2);
+    expected = 53;
+    expect(result).toEqual(expected);
+
+    // firstDayOfWeek is Monday
+    date1 = new Date(2021, 0, 1);
+    result = DateMath.getWeekNumber(date1, 1, 2);
+    expected = 53;
+    expect(result).toEqual(expected);
   });
 
   it('can get the month start and end', () => {
diff --git a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
index 0c35b321d6a6a..933e51b82f2b4 100644
--- a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
+++ b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
@@ -305,8 +305,8 @@ function getWeekOfYearFullDays(date: Date, firstDayOfWeek: DayOfWeek, numberOfFu
   let dateWeekDay = date.getDay();
   let num = (date.getDay()) - (dayOfYear % TimeConstants.DaysInOneWeek);
 
-  let lastDayOfyear = new Date(date.getFullYear(), MonthOfYear.December, 31);
-  let daysInYear = getDayOfYear(lastDayOfyear) - 1;
+  let lastDayOfPrevYear = new Date(date.getFullYear() - 1, MonthOfYear.December, 31);
+  let daysInYear = getDayOfYear(lastDayOfPrevYear) - 1;
 
   let adjustedWeekDay = adjustWeekDay(firstDayOfWeek, dateWeekDay);
 

From 2d5b7d478c83e7953fb5e4f870fac84a042e3625 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Thu, 18 Jan 2018 13:54:07 -0800
Subject: [PATCH 1228/1641] DatePicker: Prevent calendar from opening if
 disabled (#3629)

* Fix disabled DatePicker so calendar doesn't open

* Add change file

* Fix style names
---
 .../datepicker-disabled_2017-12-22-22-07.json       | 11 +++++++++++
 .../src/components/DatePicker/DatePicker.scss       |  7 +++++--
 .../src/components/DatePicker/DatePicker.test.tsx   | 13 +++++++++++++
 .../src/components/DatePicker/DatePicker.tsx        |  3 ++-
 4 files changed, 31 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/datepicker-disabled_2017-12-22-22-07.json

diff --git a/common/changes/office-ui-fabric-react/datepicker-disabled_2017-12-22-22-07.json b/common/changes/office-ui-fabric-react/datepicker-disabled_2017-12-22-22-07.json
new file mode 100644
index 0000000000000..845d0f2666a65
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/datepicker-disabled_2017-12-22-22-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Datepicker: Fix so calendar doesn't open when clicking icon when DatePicker is disabled",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "erabelle@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss
index b648f8649f949..bcd809bc56156 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss
@@ -34,9 +34,12 @@
 // Insert a calendar icon over the date field.
 .eventWithLabel {
   @include ms-DatePicker-event();
-  pointer-events: initial;
-  cursor: pointer;
   bottom:5px;
+
+  &:not(.msDatePickerDisabled) {
+    pointer-events: initial;
+    cursor: pointer;
+  }
 }
 
 .eventWithoutLabel {
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx
index 4529685fe885a..a4c080b5436ae 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx
@@ -14,6 +14,19 @@ describe('DatePicker', () => {
     expect(tree).toMatchSnapshot();
   });
 
+  it('should not open DatePicker when disabled, no label', () => {
+    let wrapper = mount(<DatePicker disabled />);
+    wrapper.find('i').simulate('click');
+
+    expect(wrapper.state('isDatePickerShown')).toBe(false);
+  });
+
+  it('should not open DatePicker when disabled, with label', () => {
+    let wrapper = mount(<DatePicker disabled label='label' />);
+    wrapper.find('i').simulate('click');
+    expect(wrapper.state('isDatePickerShown')).toBe(false);
+  });
+
   describe('when Calendar properties are not specified', () => {
     const datePicker = shallow(<DatePicker />);
     datePicker.setState({ isDatePickerShown: true });
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index c5b287406010c..995bfedeeebbf 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -210,6 +210,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
               iconName: 'Calendar',
               onClick: this._onIconClick,
               className: css(
+                disabled && styles.msDatePickerDisabled,
                 label ? 'ms-DatePicker-event--with-label' : 'ms-DatePicker-event--without-label',
                 label ? styles.eventWithLabel : styles.eventWithoutLabel
               )
@@ -342,7 +343,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
 
   @autobind
   private _onTextFieldClick(ev: React.MouseEvent<HTMLElement>) {
-    if (!this.state.isDatePickerShown) {
+    if (!this.state.isDatePickerShown && !this.props.disabled) {
       this._showDatePickerPopup();
     } else {
       if (this.props.allowTextInput) {

From fb28e13cff1ee693e1393ed13ad23383e63095da Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Thu, 18 Jan 2018 15:50:27 -0800
Subject: [PATCH 1229/1641] Address Issue #1026 ChoiceGroup: Support image alt
 text (#3742)

Added imageAlt to Choicegroup component with empty tag fallback
---
 .../src/components/ChoiceGroup/ChoiceGroup.tsx               | 2 ++
 .../src/components/ChoiceGroup/ChoiceGroup.types.ts          | 5 +++++
 .../ChoiceGroup/examples/ChoiceGroup.Image.Example.tsx       | 1 +
 3 files changed, 8 insertions(+)

diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
index caa5960d48e53..2ecb61a404756 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
@@ -174,6 +174,7 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
               >
                 <Image
                   src={ option.imageSrc }
+                  alt={ option.imageAlt ? option.imageAlt : '' }
                   width={ option.imageSize ? option.imageSize.width : undefined }
                   height={ option.imageSize ? option.imageSize.height : undefined }
                 />
@@ -188,6 +189,7 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
               >
                 <Image
                   src={ option.selectedImageSrc }
+                  alt={ option.imageAlt ? option.imageAlt : '' }
                   width={ option.imageSize ? option.imageSize.width : undefined }
                   height={ option.imageSize ? option.imageSize.height : undefined }
                 />
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.types.ts b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.types.ts
index 3345352217461..9d1ac742fdcf3 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.types.ts
@@ -77,6 +77,11 @@ export interface IChoiceGroupOption extends React.HTMLAttributes<HTMLElement | H
    */
   imageSrc?: string;
 
+  /**
+   * The alt of image for choice field. Defaults to '' if not set.
+   */
+  imageAlt?: string;
+
   /**
    * The src of image for choice field which is selected.
    */
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Image.Example.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Image.Example.tsx
index ca09c0ca99042..6695b3a528608 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Image.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Image.Example.tsx
@@ -32,6 +32,7 @@ export class ChoiceGroupImageExample extends React.Component<{}, IChoiceGroupIma
             {
               key: 'bar',
               imageSrc: TestImages.choiceGroupBarUnselected,
+              imageAlt: 'Bar chart icon',
               selectedImageSrc: TestImages.choiceGroupBarSelected,
               imageSize: { width: 32, height: 32 },
               text: 'Bar chart'

From 6b2e70d111640a5eb73d4420cb7db920b7d860ff Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Thu, 18 Jan 2018 15:51:38 -0800
Subject: [PATCH 1230/1641] added selectionMode options to
 documentation/comment in DetailsList (#3743)

---
 .../src/components/DetailsList/DetailsList.types.ts             | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
index cfe73230c1a16..b23be1ac51475 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
@@ -62,7 +62,7 @@ export interface IDetailsListProps extends React.Props<DetailsList>, IWithViewpo
   /** Optional selection model to track selection state.  */
   selection?: ISelection;
 
-  /** Controls how/if the details list manages selection. */
+  /** Controls how/if the details list manages selection. Options include none, single, multiple */
   selectionMode?: SelectionMode;
 
   /**

From b1f94259d8358ba55cdc4a69cda4eecf32df6528 Mon Sep 17 00:00:00 2001
From: Jordan Janzen <jordancjanzen@gmail.com>
Date: Thu, 18 Jan 2018 22:27:15 -0800
Subject: [PATCH 1231/1641] ChoiceGroup: Fix the hidden input on the image and
 icon variant (#3744)

* Add classnames for image and icon choice groups to the hidden input

* Style hidden input so narrator looks correct.

* npm run change output

* Rename classNames from inputIsImage/Icon to inputHasImage/Icon
---
 ...oiceGroup-option--2131_2018-01-19-00-10.json | 11 +++++++++++
 .../src/components/ChoiceGroup/ChoiceGroup.scss | 17 ++++++++++++++---
 .../src/components/ChoiceGroup/ChoiceGroup.tsx  |  5 ++++-
 3 files changed, 29 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/Choice-group--Narrator-focus-boundary-is-improper-on-the-ChoiceGroup-option--2131_2018-01-19-00-10.json

diff --git a/common/changes/office-ui-fabric-react/Choice-group--Narrator-focus-boundary-is-improper-on-the-ChoiceGroup-option--2131_2018-01-19-00-10.json b/common/changes/office-ui-fabric-react/Choice-group--Narrator-focus-boundary-is-improper-on-the-ChoiceGroup-option--2131_2018-01-19-00-10.json
new file mode 100644
index 0000000000000..1b62dbc68cabe
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/Choice-group--Narrator-focus-boundary-is-improper-on-the-ChoiceGroup-option--2131_2018-01-19-00-10.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add classNames and style the hidden input inside the ChoiceGroup image and icon variants so the Narrator highlights it correctly. ",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-jojanz@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
index 44cd51145533e..a295baf2a055b 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
@@ -64,7 +64,7 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
 .input {
   position: absolute;
   opacity: 0;
-  top: 8px
+  top: 8px;
 }
 
 // The circle
@@ -194,9 +194,10 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
   @include ms-padding-left(0px);
   @include ms-bgColor-neutralLighter;
 
+  $radioButtonSpacing: 3px;
+  $radioButtonInnerSize: 5px;
+
   .fieldIsImage, .fieldIsIcon {
-    $radioButtonSpacing: 3px;
-    $radioButtonInnerSize: 5px;
 
     display: inline-block;
     box-sizing: border-box;
@@ -312,6 +313,16 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
       }
     }
   }
+
+  // Hidden input for icon and image
+  .inputHasImage, .inputHasIcon {
+    top: 0;
+    right: 0;
+    opacity: 0;
+    width: 100%;
+    height: 100%;
+    margin: 0;
+  }
 }
 
 .choiceFieldIsIcon {
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
index 2ecb61a404756..dd6dae41c0db9 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
@@ -105,7 +105,10 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
                   <input
                     ref={ this._resolveRef('_inputElement') }
                     id={ option.id }
-                    className={ css('ms-ChoiceField-input', styles.input) }
+                    className={ css('ms-ChoiceField-input', styles.input, {
+                      ['ms-ChoiceField--image ' + styles.inputHasImage]: !!option.imageSrc,
+                      ['ms-ChoiceField--icon ' + styles.inputHasIcon]: !!option.iconProps
+                    }) }
                     type='radio'
                     name={ this.props.name || this._id }
                     disabled={ option.disabled || this.props.disabled }

From 6f283beec33f4478cb2dbc6f4a8338d01845b8c5 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 19 Jan 2018 11:14:03 +0000
Subject: [PATCH 1232/1641] Applying package updates.

---
 ...Border_semantic_slot_2018-01-16-16-57.json | 11 ------
 ...ceGroup-option--2131_2018-01-19-00-10.json | 11 ------
 ...Border_semantic_slot_2018-01-16-16-57.json | 11 ------
 .../datepicker-disabled_2017-12-22-22-07.json | 11 ------
 ...na-withtooltipchange_2018-01-18-01-39.json | 11 ------
 .../fixWeekNumberIssue_2017-12-20-05-55.json  | 11 ------
 packages/example-app-base/package.json        |  2 +-
 packages/file-type-icons/package.json         |  2 +-
 packages/icons/package.json                   |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 39 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 13 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/CHANGELOG.json               | 14 +++++++
 packages/styling/CHANGELOG.md                 |  9 ++++-
 packages/styling/package.json                 |  2 +-
 15 files changed, 79 insertions(+), 74 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/betrue-addSmallInputBorder_semantic_slot_2018-01-16-16-57.json
 delete mode 100644 common/changes/office-ui-fabric-react/Choice-group--Narrator-focus-boundary-is-improper-on-the-ChoiceGroup-option--2131_2018-01-19-00-10.json
 delete mode 100644 common/changes/office-ui-fabric-react/betrue-addSmallInputBorder_semantic_slot_2018-01-16-16-57.json
 delete mode 100644 common/changes/office-ui-fabric-react/datepicker-disabled_2017-12-22-22-07.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-persona-withtooltipchange_2018-01-18-01-39.json
 delete mode 100644 common/changes/office-ui-fabric-react/fixWeekNumberIssue_2017-12-20-05-55.json

diff --git a/common/changes/@uifabric/styling/betrue-addSmallInputBorder_semantic_slot_2018-01-16-16-57.json b/common/changes/@uifabric/styling/betrue-addSmallInputBorder_semantic_slot_2018-01-16-16-57.json
deleted file mode 100644
index a815a6a1083b9..0000000000000
--- a/common/changes/@uifabric/styling/betrue-addSmallInputBorder_semantic_slot_2018-01-16-16-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "added semantic slots for smallInputBorder and smallInputBorderHover",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "betrue@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/Choice-group--Narrator-focus-boundary-is-improper-on-the-ChoiceGroup-option--2131_2018-01-19-00-10.json b/common/changes/office-ui-fabric-react/Choice-group--Narrator-focus-boundary-is-improper-on-the-ChoiceGroup-option--2131_2018-01-19-00-10.json
deleted file mode 100644
index 1b62dbc68cabe..0000000000000
--- a/common/changes/office-ui-fabric-react/Choice-group--Narrator-focus-boundary-is-improper-on-the-ChoiceGroup-option--2131_2018-01-19-00-10.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add classNames and style the hidden input inside the ChoiceGroup image and icon variants so the Narrator highlights it correctly. ",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-jojanz@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/betrue-addSmallInputBorder_semantic_slot_2018-01-16-16-57.json b/common/changes/office-ui-fabric-react/betrue-addSmallInputBorder_semantic_slot_2018-01-16-16-57.json
deleted file mode 100644
index 4a911fc5071e9..0000000000000
--- a/common/changes/office-ui-fabric-react/betrue-addSmallInputBorder_semantic_slot_2018-01-16-16-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "added smallInputBorder semantic slots and updated checkbox, choicegroup, and toggle to use it.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "betrue@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/datepicker-disabled_2017-12-22-22-07.json b/common/changes/office-ui-fabric-react/datepicker-disabled_2017-12-22-22-07.json
deleted file mode 100644
index 845d0f2666a65..0000000000000
--- a/common/changes/office-ui-fabric-react/datepicker-disabled_2017-12-22-22-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Datepicker: Fix so calendar doesn't open when clicking icon when DatePicker is disabled",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "erabelle@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-persona-withtooltipchange_2018-01-18-01-39.json b/common/changes/office-ui-fabric-react/fix-persona-withtooltipchange_2018-01-18-01-39.json
deleted file mode 100644
index 8d786c3cc4bb6..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-persona-withtooltipchange_2018-01-18-01-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Persona: Fix a bug where space would be taken even though there was no secondary text",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fixWeekNumberIssue_2017-12-20-05-55.json b/common/changes/office-ui-fabric-react/fixWeekNumberIssue_2017-12-20-05-55.json
deleted file mode 100644
index 5857d723722bf..0000000000000
--- a/common/changes/office-ui-fabric-react/fixWeekNumberIssue_2017-12-20-05-55.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Changes in Week Number Computation logic for FirstFourDayWeek setting to fix issue 3119",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "manas.misra@outlook.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index ceb4a1c8039c0..4d35674aba9dc 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -32,7 +32,7 @@
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.15.1 <6.0.0",
+    "@uifabric/styling": ">=5.15.2 <6.0.0",
     "@uifabric/utilities": ">=5.6.1 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
diff --git a/packages/file-type-icons/package.json b/packages/file-type-icons/package.json
index 4f6251834bf99..7c3d96d5a56c4 100644
--- a/packages/file-type-icons/package.json
+++ b/packages/file-type-icons/package.json
@@ -26,7 +26,7 @@
     "react-dom": "^16.2.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.15.1 <6.0.0",
+    "@uifabric/styling": ">=5.15.2 <6.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 4b06bffd0798c..af872ccf49507 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -22,7 +22,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.15.1 <6.0.0",
+    "@uifabric/styling": ">=5.15.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 3d5924303e49f..d5bc5ebc7064d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,45 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.40.2",
+      "tag": "office-ui-fabric-react_v5.40.2",
+      "date": "Fri, 19 Jan 2018 11:14:03 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Ben Truelove <betrue@microsoft.com>",
+            "commit": "39864da18b987267a4c412398aae96342f1640f4",
+            "comment": "added smallInputBorder semantic slots and updated checkbox, choicegroup, and toggle to use it."
+          },
+          {
+            "author": "Jordan Janzen <jordancjanzen@gmail.com>",
+            "commit": "b1f94259d8358ba55cdc4a69cda4eecf32df6528",
+            "comment": "Add classNames and style the hidden input inside the ChoiceGroup image and icon variants so the Narrator highlights it correctly. "
+          },
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "2d5b7d478c83e7953fb5e4f870fac84a042e3625",
+            "comment": "Datepicker: Fix so calendar doesn't open when clicking icon when DatePicker is disabled"
+          },
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "1bfbeb9c1def0696ce3e946b3db67157e9d43fe1",
+            "comment": "Persona: Fix a bug where space would be taken even though there was no secondary text"
+          },
+          {
+            "author": "manas-misra <manas.misra@outlook.com>",
+            "commit": "e3dfe7671e4f7b26c0ad888dd7be735c0545d032",
+            "comment": "Changes in Week Number Computation logic for FirstFourDayWeek setting to fix issue 3119"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.15.1 <6.0.0` to `>=5.15.2 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.40.1",
       "tag": "office-ui-fabric-react_v5.40.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 0aba4e56aa237..6a62b8dec0bcd 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 18 Jan 2018 11:21:56 GMT and should not be manually modified.
+This log was last generated on Fri, 19 Jan 2018 11:14:03 GMT and should not be manually modified.
+
+## 5.40.2
+Fri, 19 Jan 2018 11:14:03 GMT
+
+### Patches
+
+- added smallInputBorder semantic slots and updated checkbox, choicegroup, and toggle to use it.
+- Add classNames and style the hidden input inside the ChoiceGroup image and icon variants so the Narrator highlights it correctly. 
+- Datepicker: Fix so calendar doesn't open when clicking icon when DatePicker is disabled
+- Persona: Fix a bug where space would be taken even though there was no secondary text
+- Changes in Week Number Computation logic for FirstFourDayWeek setting to fix issue 3119
 
 ## 5.40.1
 Thu, 18 Jan 2018 11:21:56 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index e3e18b10ed01c..d0f546254e187 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.40.1",
+  "version": "5.40.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -49,7 +49,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/icons": ">=5.4.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.10.1 <6.0.0",
-    "@uifabric/styling": ">=5.15.1 <6.0.0",
+    "@uifabric/styling": ">=5.15.2 <6.0.0",
     "@uifabric/utilities": ">=5.6.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 48d7b0c19525b..37eb24e7a232c 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.15.2",
+      "tag": "@uifabric/styling_v5.15.2",
+      "date": "Fri, 19 Jan 2018 11:14:02 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Ben Truelove <betrue@microsoft.com>",
+            "commit": "39864da18b987267a4c412398aae96342f1640f4",
+            "comment": "added semantic slots for smallInputBorder and smallInputBorderHover"
+          }
+        ]
+      }
+    },
     {
       "version": "5.15.1",
       "tag": "@uifabric/styling_v5.15.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 15ff21cfd1389..e8b5e6927ff19 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 28 Dec 2017 11:23:50 GMT and should not be manually modified.
+This log was last generated on Fri, 19 Jan 2018 11:14:02 GMT and should not be manually modified.
+
+## 5.15.2
+Fri, 19 Jan 2018 11:14:02 GMT
+
+### Patches
+
+- added semantic slots for smallInputBorder and smallInputBorderHover
 
 ## 5.15.1
 Thu, 28 Dec 2017 11:23:50 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 1b3bdc8aa0d32..9d313d7935590 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.15.1",
+  "version": "5.15.2",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "repository": {
     "type": "git",

From d94d83e908c3deed8de6a05063f18f857c95ea12 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Fri, 19 Jan 2018 08:26:24 -0800
Subject: [PATCH 1233/1641] MessageBar: Scss refactor and polish to sync with
 Toolkit (#3708)

* Padding refactor and code cleanup

* Updated theme overrides for more accessible icon colors

* Padding for mobil breakpoint

* Revised space between multiline text and buttons

* New blocked icon

* Dismiss alignment fix and link spacing fix

* Refactored with mixins, singleline acts like multiline in mobile

* Small example refactor

* Added change files

* jsx alignment fix

* Text margin fix

* Padding for no dismiss button

* mobile no dismiss button
---
 .../message-bar-polish_2018-01-11-17-44.json  |  11 ++
 .../message-bar-polish_2018-01-11-17-44.json  |  11 ++
 .../src/common/_themeOverrides.scss           |   4 +-
 .../src/common/_themeOverrides.scss           |   4 +-
 .../src/components/MessageBar/MessageBar.scss | 170 +++++++++---------
 .../src/components/MessageBar/MessageBar.tsx  |  26 +--
 .../examples/MessageBar.Basic.Example.tsx     |  14 +-
 7 files changed, 128 insertions(+), 112 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/message-bar-polish_2018-01-11-17-44.json
 create mode 100644 common/changes/office-ui-fabric-react/message-bar-polish_2018-01-11-17-44.json

diff --git a/common/changes/@uifabric/example-app-base/message-bar-polish_2018-01-11-17-44.json b/common/changes/@uifabric/example-app-base/message-bar-polish_2018-01-11-17-44.json
new file mode 100644
index 0000000000000..22af79e784751
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/message-bar-polish_2018-01-11-17-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Updated theme override colors for MessageBar.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/message-bar-polish_2018-01-11-17-44.json b/common/changes/office-ui-fabric-react/message-bar-polish_2018-01-11-17-44.json
new file mode 100644
index 0000000000000..10e3e9259660f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/message-bar-polish_2018-01-11-17-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "MessageBar: scss refactor and component polish.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/src/common/_themeOverrides.scss b/packages/example-app-base/src/common/_themeOverrides.scss
index 44912e2a55c07..f0ba2adfce387 100644
--- a/packages/example-app-base/src/common/_themeOverrides.scss
+++ b/packages/example-app-base/src/common/_themeOverrides.scss
@@ -58,10 +58,10 @@ $ms-color-alertBackground: "[theme:alertBackground, default: #deecf9]";
 $ms-color-warning: "[theme:warning, default: #767676]";
 $ms-color-warningText: "[theme:warningText, default: #333333]";
 $ms-color-warningBackground: "[theme:warningBackground, default: #fff4ce]";
-$ms-color-severeWarning: "[theme:severeWarning, default: #d83b01]";
+$ms-color-severeWarning: "[theme:severeWarning, default: #a80000]";
 $ms-color-severeWarningText: "[theme:severeWarningText, default: #333333]";
 $ms-color-severeWarningBackground: "[theme:severeWarningBackground, default: #fed9cc]";
-$ms-color-info: "[theme:info, default: #767676]";
+$ms-color-info: "[theme:info, default: #666666]";
 $ms-color-infoText: "[theme:infoText, default: #333333]";
 $ms-color-infoBackground: "[theme:infoBackground, default: #f4f4f4]";
 $ms-color-orangeLighter: "[theme:orangeLighter, default: #ea4300]";
diff --git a/packages/office-ui-fabric-react/src/common/_themeOverrides.scss b/packages/office-ui-fabric-react/src/common/_themeOverrides.scss
index 865e7ede3ea1b..c4526a6867539 100644
--- a/packages/office-ui-fabric-react/src/common/_themeOverrides.scss
+++ b/packages/office-ui-fabric-react/src/common/_themeOverrides.scss
@@ -60,10 +60,10 @@ $ms-color-alertBackground: "[theme:alertBackground, default: #deecf9]";
 $ms-color-warning: "[theme:warning, default: #767676]";
 $ms-color-warningText: "[theme:warningText, default: #333333]";
 $ms-color-warningBackground: "[theme:warningBackground, default: #fff4ce]";
-$ms-color-severeWarning: "[theme:severeWarning, default: #d83b01]";
+$ms-color-severeWarning: "[theme:severeWarning, default: #a80000]";
 $ms-color-severeWarningText: "[theme:severeWarningText, default: #333333]";
 $ms-color-severeWarningBackground: "[theme:severeWarningBackground, default: #fed9cc]";
-$ms-color-info: "[theme:info, default: #767676]";
+$ms-color-info: "[theme:info, default: #666666]";
 $ms-color-infoText: "[theme:infoText, default: #333333]";
 $ms-color-infoBackground: "[theme:infoBackground, default: #f4f4f4]";
 $ms-color-orangeLighter: "[theme:orangeLighter, default: #ea4300]";
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
index 82f428d359777..a8bb1af7cff60 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
@@ -7,6 +7,21 @@
 // --------------------------------------------------
 // MessageBar Styles
 
+// Mixins
+@mixin multilineContent {
+  flex-direction: column;
+  .content {
+    flex-direction: row;
+  }
+}
+
+@mixin buttonMargins($sidesAndBottom, $top: $sidesAndBottom) {
+  @include margin($top, $sidesAndBottom, $sidesAndBottom, 0);
+  :nth-child(n+2) {
+    @include margin-left($sidesAndBottom);
+  }
+}
+
 .root {
   @include ms-bgColor-info;
   min-height: 32px;
@@ -16,20 +31,11 @@
   display: flex;
   position: relative;
   word-break: break-word;
-  .icon {
-    @include padding-right(8px);
-    color: $ms-color-info;
-    flex-shrink: 0;
-  }
 
   :global(.ms-Link) {
     font-size: $ms-font-size-s;
     color: $ms-color-themeDark;
   }
-
-  :global(.ms-Button) {
-    @include margin-left(6px);
-  }
 }
 
 .icon,
@@ -43,6 +49,13 @@
   min-width: 16px;
   min-height: 16px;
   display: flex;
+  color: $ms-color-info;
+  flex-shrink: 0;
+  // Margin-right is accounted for in the .innerText margin-left
+  @include margin(16px, 0, 16px, 16px);
+  @media screen and (max-width: $ms-screen-max-sm) {
+    @include margin(8px, 0, 8px, 8px);
+  }
 }
 
 .text {
@@ -50,8 +63,26 @@
   min-width: 0;
   display: flex;
   flex-grow: 1;
+  @include margin(16px, 8px, 16px, 8px);
+  @media screen and (max-width: $ms-screen-max-sm) {
+    @include margin(8px, 0, 8px, 8px);
+    &.noDismissButton {
+      @include margin-right(8px);
+    }
+  }
+  &.noDismissButton {
+    @include margin-right(16px);
+  }
 }
 
+.innerText {
+  line-height: 16px;
+
+  // Add padding between text and hyperlink
+  span a {
+    @include padding-left(4px);
+  }
+}
 
 //== Modifier: Warning message
 //
@@ -108,7 +139,7 @@
   }
 }
 
-// Shared
+// Shared between Single- and Multi- Line
 .content {
   display: flex;
   line-height: normal;
@@ -130,40 +161,11 @@
 }
 
 .actions {
-  padding-top: 12px;
+  @include buttonMargins(12px, 0);
 }
 
-.innerTextPadding {
-  span, .innerText > span {
-    @include padding-right(4px); // Add padding between text and hyperlink.
-  }
-}
-
-// Single line specific attributes
-.singleline {
-  height: 32px;
-  .content {
-    align-items: center;
-    padding: 8px 0px;
-    .icon {
-      font-family: 'FabricMDL2Icons';
-      padding: 0px 8px;
-    }
-
-    .text {
-      align-items: center;
-      flex: 1 1 auto;
-
-      .innerText,
-      .innerTextPadding {
-        @include padding-right(8px);
-        max-height: 1.3em;
-        overflow: hidden;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-      }
-    }
-  }
+.actionsOneline {
+  @include buttonMargins(8px);
 }
 
 .actions, .actionsOneline {
@@ -171,13 +173,22 @@
   flex: 0 0 auto;
   flex-direction: row-reverse;
   align-items: center;
+  @media screen and (max-width: $ms-screen-max-sm) {
+    @include buttonMargins(8px, 0);
+    :global(.ms-Button) {
+      margin-top: 8px;
+    }
+  }
 }
 
 .dismissal {
   @include focus-border();
-  @include right(0);
-  max-height: 16px;
   flex-shrink: 0;
+  @include margin(8px, 8px, 8px, 0); // Margin-left is accounted for in the .text margin-right
+
+  @media screen and (max-width: $ms-screen-max-sm) {
+    @include margin(0, 0, 0, 8px);
+  }
 
   @include high-contrast {
     -ms-high-contrast-adjust: none;
@@ -188,57 +199,40 @@
   display: flex;
 }
 
-.rootIsOneline {
-  min-width: 16px;
-  min-height: 16px;
-  // We want padding between the outside of the dismiss button to be 8px
-  // and the padding between the dismiss button and the text to be 12px
-  @include padding(8px, 12px, 8px, 12px);
-}
-
-.actionsOneline {
-  position: relative;
-  padding: 0px 8px;
-}
-
-.actionableOneline {
-  height: 48px;
-  .content {
-    .icon {
-      padding: 0px 16px;
-    }
-    .innerText {
-      @include padding-right(0px);
-    }
+.dismissal,
+.dismissOneline {
+  :global(.ms-Icon) {
+    font-size: 12px;
+    height: 12px;
+    line-height: 12px;
   }
 }
 
 // Multi line specific attributes
 .multiline {
-  @include padding(16px, 12px, 12px, 16px);
-  .content {
-      flex-direction: row;
-    .icon {
-      @include padding-right(8px);
-      font-family: 'FabricMDL2Icons';
-    }
-
-    .innerText {
-      line-height: 16px; // Each line should add 16px to the height
+  @include multilineContent();
+  .text.multilineWithActions {
+    margin-bottom: 8px; // This creates an 8px space between text and actions
+    @media screen and (max-width: $ms-screen-max-sm) {
+      margin-bottom: 0;
     }
   }
-
-  .dismissal {
-    margin: 0;
-  }
-}
-
-.multiline {
-  flex-direction: column;
 }
 
-.actionableMultiline.dismissalMultiline {
-  .innerTextPadding {
-    @include padding-right(48px);
+// Single line specific attributes
+.singleline {
+  .innerText {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
   }
-}
+  @media screen and (max-width: $ms-screen-max-sm) {
+    // Singleline acts like multiline in mobile, unless text is specified to be truncated
+    @include multilineContent();
+    .text.multilineWithActions {
+      @media screen and (max-width: $ms-screen-max-sm) {
+        margin-bottom: 0;
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
index 1a4fdd2459b1d..8f12d4e5129d1 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
@@ -28,7 +28,7 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
     [MessageBarType.info]: 'Info',
     [MessageBarType.warning]: 'Info',
     [MessageBarType.error]: 'ErrorBadge',
-    [MessageBarType.blocked]: 'Blocked',
+    [MessageBarType.blocked]: 'Blocked2',
     [MessageBarType.remove]: 'Blocked', // TODO remove deprecated value at >= 1.0.0
     [MessageBarType.severeWarning]: 'Warning',
     [MessageBarType.success]: 'Completed'
@@ -69,7 +69,7 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
       ['ms-MessageBar ' + styles.root]: this.props.messageBarType === MessageBarType.info,
       ['ms-MessageBar--error ' + styles.rootIsError]: this.props.messageBarType === MessageBarType.error,
       ['ms-MessageBar--blocked ' + styles.rootIsBlocked]: (this.props.messageBarType === MessageBarType.blocked) ||
-      (this.props.messageBarType === MessageBarType.remove), // TODO remove deprecated value at >= 1.0.0
+        (this.props.messageBarType === MessageBarType.remove), // TODO remove deprecated value at >= 1.0.0
       ['ms-MessageBar--severeWarning ' + styles.rootIsSevereWarning]: this.props.messageBarType === MessageBarType.severeWarning,
       ['ms-MessageBar--success ' + styles.rootIsSuccess]: this.props.messageBarType === MessageBarType.success,
       ['ms-MessageBar--warning ' + styles.rootIsWarning]: this.props.messageBarType === MessageBarType.warning
@@ -110,11 +110,6 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
     );
   }
 
-  private _getInnerTextClassName(): string {
-    return this.props.onDismiss || this.props.actions ?
-      'ms-MessageBar-innerTextPadding ' + styles.innerTextPadding : 'ms-MessageBar-innerText ' + styles.innerText;
-  }
-
   private _renderMultiLine(): React.ReactElement<React.HTMLAttributes<HTMLAreaElement>> {
     return (
       <div
@@ -122,8 +117,7 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
           css(this._getClassName(),
             'ms-MessageBar-multiline',
             styles.multiline,
-            this.props.onDismiss && styles.dismissalMultiline,
-            this.props.actions && styles.actionableMultiline
+            this.props.onDismiss && styles.dismissalMultiline
           )
         }
         role='status'
@@ -146,8 +140,7 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
           css(this._getClassName(),
             'ms-MessageBar-singleline',
             styles.singleline,
-            this.props.onDismiss && 'ms-MessageBar-dismissalOneline ' + styles.rootIsOneline,
-            this.props.actions && styles.actionableOneline
+            this.props.onDismiss && 'ms-MessageBar-dismissalOneline'
           )
         }
       >
@@ -163,8 +156,15 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
 
   private _renderInnerText(): JSX.Element {
     return (
-      <div className={ css('ms-MessageBar-text', styles.text) } id={ this.state.labelId }>
-        <span className={ this._getInnerTextClassName() } role='status' aria-live={ this._getAnnouncementPriority() }>
+      <div
+        className={ css('ms-MessageBar-text', styles.text, this.props.actions && styles.multilineWithActions, !this.props.onDismiss && styles.noDismissButton) }
+        id={ this.state.labelId }
+      >
+        <span
+          className={ css('ms-MessageBar-innerText ' + styles.innerText) }
+          role='status'
+          aria-live={ this._getAnnouncementPriority() }
+        >
           <DelayedRender>
             <span>{ this.props.children }</span>
           </DelayedRender>
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx
index a037bdee35358..9578fd2ebf378 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx
@@ -13,7 +13,7 @@ const log = (text: string): () => void =>
 export const MessageBarBasicExample = () => (
   <div className='ms-BasicMessageBarsExample'>
     <Label>Info/Default MessageBar</Label>
-    <MessageBar>Info - lorem ipsum dolor sit amet, a elit sem interdum consectetur adipiscing elit. <Link href='www.bing.com'>Visit our website</Link></MessageBar>
+    <MessageBar>Info lorem ipsum dolor sit amet, a elit sem interdum consectetur adipiscing elit. <Link href='www.bing.com'>Visit our website.</Link></MessageBar>
 
     <Label>Error MessageBar - only dismiss single line</Label>
     <MessageBar
@@ -21,7 +21,7 @@ export const MessageBarBasicExample = () => (
       isMultiline={ false }
       onDismiss={ log('test') }
     >
-      Error - lorem ipsum dolor sit amet, a elit sem interdum consectetur adipiscing elit. <Link href='www.bing.com'>Visit our website</Link>
+      Error lorem ipsum dolor sit amet, a elit sem interdum consectetur adipiscing elit. <Link href='www.bing.com'>Visit our website.</Link>
     </MessageBar>
 
     <Label>Blocked MessageBar - single line no buttons</Label>
@@ -30,7 +30,7 @@ export const MessageBarBasicExample = () => (
       isMultiline={ false }
       onDismiss={ log('test') }
     >
-      Blocked - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi luctus, purus a lobortis tristique, odio augue pharetra metus, ac placerat nunc mi nec dui. Vestibulum aliquam et nunc semper scelerisque. Curabitur vitae orci nec quam condimentum porttitor et sed lacus. Vivamus ac efficitur leo. Cras faucibus mauris libero, ac placerat erat euismod et. Donec pulvinar commodo odio sit amet faucibus. In hac habitasse platea dictumst. Duis eu ante commodo, condimentum nibh pellentesque, laoreet enim. Fusce massa lorem, ultrices eu mi a, fermentum suscipit magna. Integer porta purus pulvinar, hendrerit felis eget, condimentum mauris. <Link href='www.bing.com'>Visit our website</Link>
+      Blocked lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi luctus, purus a lobortis tristique, odio augue pharetra metus, ac placerat nunc mi nec dui. Vestibulum aliquam et nunc semper scelerisque. Curabitur vitae orci nec quam condimentum porttitor et sed lacus. Vivamus ac efficitur leo. Cras faucibus mauris libero, ac placerat erat euismod et. Donec pulvinar commodo odio sit amet faucibus. In hac habitasse platea dictumst. Duis eu ante commodo, condimentum nibh pellentesque, laoreet enim. Fusce massa lorem, ultrices eu mi a, fermentum suscipit magna. Integer porta purus pulvinar, hendrerit felis eget, condimentum mauris. <Link href='www.bing.com'>Visit our website.</Link>
     </MessageBar>
 
     <Label>SevereWarning MessageBar - multiline (default)</Label>
@@ -43,8 +43,8 @@ export const MessageBarBasicExample = () => (
         </div>
       }
     >
-      <span>SevereWarning - lorem ipsum dolor sit amet, a elit sem interdum consectetur adipiscing elit.</span>
-      <Link href='www.bing.com'>Visit our website</Link>
+      <span>Severe warning lorem ipsum dolor sit amet, a elit sem interdum consectetur adipiscing elit.</span>
+      <Link href='www.bing.com'>Visit our website.</Link>
     </MessageBar>
 
     <Label>Success MessageBar - single line, short text with buttons</Label>
@@ -58,7 +58,7 @@ export const MessageBarBasicExample = () => (
       messageBarType={ MessageBarType.success }
       isMultiline={ false }
     >
-      Success - Lorem ipsum dolor sit amet <Link href='www.bing.com'>Visit our website</Link>
+      Success lorem ipsum dolor sit amet. <Link href='www.bing.com'>Visit our website.</Link>
     </MessageBar>
 
     <Label>Warning MessageBar</Label>
@@ -73,7 +73,7 @@ export const MessageBarBasicExample = () => (
         </div>
       }
     >
-      Warning - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi luctus, purus a lobortis tristique, odio augue pharetra metus, ac placerat nunc mi nec dui. Vestibulum aliquam et nunc semper scelerisque. Curabitur vitae orci nec quam condimentum porttitor et sed lacus. Vivamus ac efficitur leo. Cras faucibus mauris libero, ac placerat erat euismod et. Donec pulvinar commodo odio sit amet faucibus. In hac habitasse platea dictumst. Duis eu ante commodo, condimentum nibh pellentesque, laoreet enim. Fusce massa lorem, ultrices eu mi a, fermentum suscipit magna. Integer porta purus pulvinar, hendrerit felis eget, condimentum mauris.<Link href='www.bing.com'>Visit our website</Link>
+      Warning lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi luctus, purus a lobortis tristique, odio augue pharetra metus, ac placerat nunc mi nec dui. Vestibulum aliquam et nunc semper scelerisque. Curabitur vitae orci nec quam condimentum porttitor et sed lacus. Vivamus ac efficitur leo. Cras faucibus mauris libero, ac placerat erat euismod et. Donec pulvinar commodo odio sit amet faucibus. In hac habitasse platea dictumst. Duis eu ante commodo, condimentum nibh pellentesque, laoreet enim. Fusce massa lorem, ultrices eu mi a, fermentum suscipit magna. Integer porta purus pulvinar, hendrerit felis eget, condimentum mauris.<Link href='www.bing.com'>Visit our website.</Link>
     </MessageBar>
   </div>
 );
\ No newline at end of file

From 3918313795cd6f12b7405aa94b559e68c7d71652 Mon Sep 17 00:00:00 2001
From: Bryan Watts <brwatt@microsoft.com>
Date: Fri, 19 Jan 2018 12:43:56 -0800
Subject: [PATCH 1234/1641]  Add a measured context value to ResizeGroup
 (#3718)

* Add a helper component to inject context values

* Add a measured context value to ResizeGroup

* Add change files

* update allowed bundle size

* Remove context from index

* Add unit test for provideContext

* Fix build issues in test file

* Add a comment for isMeasured

* Add documentation for isMeasured
---
 ...att-measured-context_2018-01-13-22-47.json | 11 ++++++
 ...att-measured-context_2018-01-13-22-47.json | 11 ++++++
 .../components/ResizeGroup/ResizeGroup.tsx    | 12 ++++++-
 .../ResizeGroup/ResizeGroupPage.tsx           |  3 ++
 packages/utilities/src/Context.test.tsx       | 35 +++++++++++++++++++
 packages/utilities/src/Context.tsx            | 22 ++++++++++++
 6 files changed, 93 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/utilities/brwatt-measured-context_2018-01-13-22-47.json
 create mode 100644 common/changes/office-ui-fabric-react/brwatt-measured-context_2018-01-13-22-47.json
 create mode 100644 packages/utilities/src/Context.test.tsx
 create mode 100644 packages/utilities/src/Context.tsx

diff --git a/common/changes/@uifabric/utilities/brwatt-measured-context_2018-01-13-22-47.json b/common/changes/@uifabric/utilities/brwatt-measured-context_2018-01-13-22-47.json
new file mode 100644
index 0000000000000..d49db02f74938
--- /dev/null
+++ b/common/changes/@uifabric/utilities/brwatt-measured-context_2018-01-13-22-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Adding a helper component to inject context values",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "brwatt@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/brwatt-measured-context_2018-01-13-22-47.json b/common/changes/office-ui-fabric-react/brwatt-measured-context_2018-01-13-22-47.json
new file mode 100644
index 0000000000000..565633f61ac4f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/brwatt-measured-context_2018-01-13-22-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add a context value under ResizeGroup to allow child components to detect whether they are being used only for measurement.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "brwatt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index fb281de27982f..c48d3f17e5aaa 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -1,8 +1,10 @@
 import * as React from 'react';
+import * as PropTypes from 'prop-types';
 import {
   css,
   BaseComponent
 } from '../../Utilities';
+import { provideContext } from '@uifabric/utilities/lib/Context';
 import { IResizeGroupProps } from './ResizeGroup.types';
 import * as styles from './ResizeGroup.scss';
 
@@ -272,6 +274,14 @@ export const getNextResizeGroupStateProvider = (measurementCache = getMeasuremen
   };
 };
 
+// Provides a context property that (if true) tells any child components that
+// they are only being used for measurement purposes and will not be visible.
+const MeasuredContext = provideContext({
+  isMeasured: PropTypes.bool
+}, () => {
+  return { isMeasured: true };
+});
+
 export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupState> {
   private _nextResizeGroupStateProvider = getNextResizeGroupStateProvider();
   private _root: HTMLElement;
@@ -294,7 +304,7 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
       <div className={ css('ms-ResizeGroup', className) } ref={ this._resolveRef('_root') }>
         { this._nextResizeGroupStateProvider.shouldRenderDataToMeasureInHiddenDiv(dataToMeasure) && (
           <div className={ css(styles.measured) } ref={ this._resolveRef('_measured') }>
-            { onRenderData(dataToMeasure) }
+            <MeasuredContext>{ onRenderData(dataToMeasure) }</MeasuredContext>
           </div>
         ) }
 
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
index f19254ae4b7c8..3a0e3ba50ddea 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
@@ -63,6 +63,9 @@ export class ResizeGroupPage extends React.Component<IComponentDemoPageProps, an
                 skipped for that data object. In the controls with an overflow example, the cacheKey is simply the concatenation of the
                 keys of the controls that appear in the top level.
               </p>
+              <p>
+                There is a boolean context property (isMeasured) added to let child components know if they are only being used for measurement purposes. When isMeasured is true, it will signify that the component is not the instance visible to the user. This will not be needed for most scenarios. It is intended to be used to to skip unwanted side effects of mounting a child component more than once. This includes cases where the the component makes API requests, requests focus to one of its elements, expensive computations, and/or renders markup unrelated to its size. Be careful not to use this property to change the components rendered output in a way that effects it size in any way.
+              </p>
             </span>
           </div>
         }
diff --git a/packages/utilities/src/Context.test.tsx b/packages/utilities/src/Context.test.tsx
new file mode 100644
index 0000000000000..1884ccb44e2fe
--- /dev/null
+++ b/packages/utilities/src/Context.test.tsx
@@ -0,0 +1,35 @@
+
+import * as React from 'react';
+import * as PropTypes from 'prop-types';
+
+import * as ReactDOM from 'react-dom/server';
+import { provideContext } from './Context';
+
+const TestContext = provideContext({
+  isTest: PropTypes.bool
+}, (props: { isTest: boolean }) => {
+  return { isTest: props.isTest };
+});
+
+class Child extends React.Component {
+  public static contextTypes: PropTypes.ValidationMap<{ isTest: boolean }> = {
+    isTest: PropTypes.bool
+  };
+
+  public render(): JSX.Element {
+    return <div>{ `${this.context.isTest || false}` }</div>;
+  }
+}
+
+class Parent extends React.Component {
+  public render(): JSX.Element {
+    return <Child />;
+  }
+}
+
+describe('Context', () => {
+  it('can provide context for child components', () => {
+    expect(ReactDOM.renderToStaticMarkup(<Parent />)).toEqual('<div>false</div>');
+    expect(ReactDOM.renderToStaticMarkup(<TestContext isTest={ true }><Parent /></TestContext>)).toEqual('<div>true</div>');
+  });
+});
\ No newline at end of file
diff --git a/packages/utilities/src/Context.tsx b/packages/utilities/src/Context.tsx
new file mode 100644
index 0000000000000..d0361465a0a8c
--- /dev/null
+++ b/packages/utilities/src/Context.tsx
@@ -0,0 +1,22 @@
+
+import * as React from 'react';
+import * as PropTypes from 'prop-types';
+
+export function provideContext<TContext, TProps>(
+  contextTypes: PropTypes.ValidationMap<TContext>,
+  mapPropsToContext: (props: TProps) => TContext
+): React.ComponentType<TProps & React.Props<{}>> {
+  class Provider extends React.PureComponent<TProps> {
+    public static readonly childContextTypes: PropTypes.ValidationMap<TContext> = contextTypes;
+
+    public getChildContext(): TContext {
+      return mapPropsToContext(this.props);
+    }
+
+    public render(): JSX.Element | null {
+      return React.Children.only(this.props.children);
+    }
+  }
+
+  return Provider;
+}

From f8dfda114728bf4cd800f8cc69b9ad6a826ba94f Mon Sep 17 00:00:00 2001
From: Ben Truelove <betrue@microsoft.com>
Date: Fri, 19 Jan 2018 13:03:10 -0800
Subject: [PATCH 1235/1641] Adjusted divider color to neutralTertiaryAlt for
 visibility. (#3750)

* Adjusted divider color to neutralTertiaryAlt for visibility.

* Added changelist
---
 ...ectionDivider_contextualMenu_2018-01-19-19-20.json | 11 +++++++++++
 ...ectionDivider_contextualMenu_2018-01-19-19-20.json | 11 +++++++++++
 .../src/common/_semanticSlots.scss                    |  2 +-
 .../ContextualMenu/ContextualMenu.styles.ts           |  3 ++-
 packages/styling/src/styles/theme.ts                  |  2 +-
 5 files changed, 26 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/betrue-darkenSectionDivider_contextualMenu_2018-01-19-19-20.json
 create mode 100644 common/changes/office-ui-fabric-react/betrue-darkenSectionDivider_contextualMenu_2018-01-19-19-20.json

diff --git a/common/changes/@uifabric/styling/betrue-darkenSectionDivider_contextualMenu_2018-01-19-19-20.json b/common/changes/@uifabric/styling/betrue-darkenSectionDivider_contextualMenu_2018-01-19-19-20.json
new file mode 100644
index 0000000000000..3fb7b3e2673e7
--- /dev/null
+++ b/common/changes/@uifabric/styling/betrue-darkenSectionDivider_contextualMenu_2018-01-19-19-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "updated divider color to neutralTertiaryAlt",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "betrue@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/betrue-darkenSectionDivider_contextualMenu_2018-01-19-19-20.json b/common/changes/office-ui-fabric-react/betrue-darkenSectionDivider_contextualMenu_2018-01-19-19-20.json
new file mode 100644
index 0000000000000..c656ca15062c1
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/betrue-darkenSectionDivider_contextualMenu_2018-01-19-19-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "updated divider color to be more visible",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "betrue@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/common/_semanticSlots.scss b/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
index dd815d7105ad3..e3cbc93bd375d 100644
--- a/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
+++ b/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
@@ -3,7 +3,7 @@ $bodyBackgroundColor: "[theme:bodyBackground, default: #ffffff]";
 $bodyTextColor: "[theme:bodyText, default: #333333]";
 $bodyTextCheckedColor: "[theme:bodyTextChecked, default: #000000]";
 $bodySubtextColor: "[theme:bodySubtext, default: #666666]";
-$bodyDividerColor: "[theme:bodyDivider, default: #eaeaea]";
+$bodyDividerColor: "[theme:bodyDivider, default: #c8c8c8]";
 
 $disabledBackgroundColor: "[theme:disabledBackground, default: #f4f4f4]";
 $disabledTextColor: "[theme:disabledText, default: #a6a6a6]";
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
index 97a49db1577b8..07c886c7a8292 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
@@ -32,6 +32,7 @@ export const getMenuItemStyles = memoizeFunction((
   const { semanticColors, fonts } = theme;
   const ContextualMenuItemBackgroundHoverColor = semanticColors.menuItemBackgroundHovered;
   const ContextualMenuItemBackgroundSelectedColor = semanticColors.menuItemBackgroundChecked;
+  const ContextualMenuItemDividerColor = semanticColors.bodyDivider;
 
   const menuItemStyles: IMenuItemStyles = {
     item: [
@@ -44,7 +45,7 @@ export const getMenuItemStyles = memoizeFunction((
     divider: {
       display: 'block',
       height: '1px',
-      backgroundColor: semanticColors.bodyDivider,
+      backgroundColor: ContextualMenuItemDividerColor,
       position: 'relative'
     },
     root: [
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index 203d08fad2406..dbe52e03d4cad 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -118,7 +118,7 @@ function _makeSemanticColorsFromPalette(p: IPalette, isInverted: boolean): ISema
     bodyText: p.neutralPrimary,
     bodyTextChecked: p.black,
     bodySubtext: p.neutralSecondary,
-    bodyDivider: p.neutralLight,
+    bodyDivider: p.neutralTertiaryAlt,
 
     disabledBackground: p.neutralLighter,
     disabledText: p.neutralTertiary,

From fd2206f8041ba6aca3b61a67a8552652e67d4954 Mon Sep 17 00:00:00 2001
From: Jordan Janzen <jordancjanzen@gmail.com>
Date: Fri, 19 Jan 2018 16:18:31 -0800
Subject: [PATCH 1236/1641] Calendar: change clickable spans to buttons (#3741)

* Change clickable spans to buttons.

* Add button resets to classes used by buttons that were spans

* npm run changes output

* Correct email to microsoft alias

* Update snapshot
---
 ...ange-clickable-spans_2018-01-18-19-16.json | 11 +++
 .../src/components/Calendar/Calendar.scss     |  8 +++
 .../src/components/Calendar/Calendar.tsx      |  4 +-
 .../src/components/Calendar/CalendarDay.tsx   |  8 +--
 .../src/components/Calendar/CalendarMonth.tsx | 14 ++--
 .../__snapshots__/Calendar.test.tsx.snap      | 68 +++++++++----------
 6 files changed, 66 insertions(+), 47 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/-1535-calendar-change-clickable-spans_2018-01-18-19-16.json

diff --git a/common/changes/office-ui-fabric-react/-1535-calendar-change-clickable-spans_2018-01-18-19-16.json b/common/changes/office-ui-fabric-react/-1535-calendar-change-clickable-spans_2018-01-18-19-16.json
new file mode 100644
index 0000000000000..023705d3627ed
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/-1535-calendar-change-clickable-spans_2018-01-18-19-16.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Address issue #1535 - Calendar: Change clickable spans to buttons.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-jojanz@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
index 14ea137ae4bf6..0d0d0ddf1aa36 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
@@ -251,6 +251,9 @@ $Calendar-dayPicker-margin: 10px;
   color: $ms-color-neutralDark;
   position: relative;
   top: 2px;
+  background-color: transparent;
+  border: none;
+  padding: 0;
   &:hover {
     color: $ms-color-neutralDark;
     cursor: pointer;
@@ -308,6 +311,9 @@ $Calendar-dayPicker-margin: 10px;
   @include ms-font-s-plus;
   color: $ms-color-neutralPrimary;
   text-align: center; // border-radius: 2px;
+  border: none;
+  padding: 0;
+  background-color: transparent;
   &:hover {
     color: $ms-color-black;
     background-color: $ms-color-neutralTertiaryAlt;
@@ -336,6 +342,8 @@ $Calendar-dayPicker-margin: 10px;
   height: 30px;
   line-height: 30px;
   padding: 0 10px;
+  background-color: transparent;
+  border: none;
   position: absolute !important;
   @include ms-right(13px);
   &:hover {
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index 637d6cd4da094..7705e3f1b6b82 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -180,7 +180,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                 /> }
 
                 { showGoToToday &&
-                  <span
+                  <button
                     role='button'
                     className={ css('ms-DatePicker-goToday js-goToday', styles.goToday) }
                     onClick={ this._onGotoToday }
@@ -188,7 +188,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                     tabIndex={ 0 }
                   >
                     { strings!.goToToday }
-                  </span>
+                  </button>
                 }
               </div>
             </div>
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index 20202e81a073a..462b38a62fc8d 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -129,7 +129,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
       >
         <div className={ css('ms-DatePicker-monthComponents', styles.monthComponents) }>
           <div className={ css('ms-DatePicker-navContainer', styles.navContainer) }>
-            <span
+            <button
               className={ css('ms-DatePicker-prevMonth js-prevMonth', styles.prevMonth,
                 {
                   ['ms-DatePicker-prevMonth--disabled ' + styles.prevMonthIsDisabled]: !prevMonthInBounds
@@ -143,8 +143,8 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
               tabIndex={ 0 }
             >
               <Icon iconName={ getRTL() ? rightNavigationIcon : leftNavigationIcon } />
-            </span >
-            <span
+            </button >
+            <button
               className={ css('ms-DatePicker-nextMonth js-nextMonth', styles.nextMonth,
                 {
                   ['ms-DatePicker-nextMonth--disabled ' + styles.nextMonthIsDisabled]: !nextMonthInBounds
@@ -157,7 +157,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
               tabIndex={ 0 }
             >
               <Icon iconName={ getRTL() ? leftNavigationIcon : rightNavigationIcon } />
-            </span >
+            </button >
           </div >
         </div >
         <div className={ css('ms-DatePicker-header', styles.header) } >
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
index 23fb4e59609dd..93d5e361d78be 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
@@ -33,7 +33,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
     navigatedMonth: HTMLElement;
   };
 
-  private _selectMonthCallbacks: (() => void)[];
+  private _selectMonthCallbacks: (() => void) [];
 
   public constructor(props: ICalendarMonthProps) {
     super(props);
@@ -63,7 +63,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
       <div className={ css('ms-DatePicker-monthPicker', styles.monthPicker) }>
         <div className={ css('ms-DatePicker-yearComponents', styles.yearComponents) }>
           <div className={ css('ms-DatePicker-navContainer', styles.navContainer) }>
-            <span
+            <button
               className={ css('ms-DatePicker-prevYear js-prevYear', styles.prevYear, {
                 ['ms-DatePicker-prevYear--disabled ' + styles.prevYearIsDisabled]: !isPrevYearInBounds
               }) }
@@ -74,8 +74,8 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
               tabIndex={ 0 }
             >
               <Icon iconName={ getRTL() ? rightNavigationIcon : leftNavigationIcon } />
-            </span>
-            <span
+            </button>
+            <button
               className={ css('ms-DatePicker-nextYear js-nextYear', styles.nextYear, {
                 ['ms-DatePicker-nextYear--disabled ' + styles.nextYearIsDisabled]: !isNextYearInBounds
               }) }
@@ -86,7 +86,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
               tabIndex={ 0 }
             >
               <Icon iconName={ getRTL() ? leftNavigationIcon : rightNavigationIcon } />
-            </span>
+            </button>
           </div>
         </div>
         <div className={ css('ms-DatePicker-header', styles.header) }>
@@ -120,7 +120,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
               const isInBounds = (minDate ? compareDatePart(minDate, getMonthEnd(indexedMonth)) < 1 : true) &&
                 (maxDate ? compareDatePart(getMonthStart(indexedMonth), maxDate) < 1 : true);
 
-              return <span
+              return <button
                 role={ 'gridcell' }
                 className={
                   css('ms-DatePicker-monthOption', styles.monthOption,
@@ -138,7 +138,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
                 ref={ isNavigatedMonth ? 'navigatedMonth' : undefined }
               >
                 { month }
-              </span>;
+              </button>;
             }
             ) }
           </div>
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/__snapshots__/Calendar.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Calendar/__snapshots__/Calendar.test.tsx.snap
index 8c17fcba58ee9..9bd37fc04426c 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/__snapshots__/Calendar.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Calendar/__snapshots__/Calendar.test.tsx.snap
@@ -28,7 +28,7 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
               <div
                 className="ms-DatePicker-navContainer"
               >
-                <span
+                <button
                   aria-controls="DatePickerDay-dayPicker10"
                   aria-label={undefined}
                   className="ms-DatePicker-prevMonth js-prevMonth"
@@ -48,8 +48,8 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                     data-icon-name="Up"
                     role="presentation"
                   />
-                </span>
-                <span
+                </button>
+                <button
                   aria-controls="DatePickerDay-dayPicker10"
                   aria-label={undefined}
                   className="ms-DatePicker-nextMonth js-nextMonth"
@@ -69,7 +69,7 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                     data-icon-name="Down"
                     role="presentation"
                   />
-                </span>
+                </button>
               </div>
             </div>
             <div
@@ -906,7 +906,7 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
               <div
                 className="ms-DatePicker-navContainer"
               >
-                <span
+                <button
                   aria-label={undefined}
                   className="ms-DatePicker-prevYear js-prevYear"
                   onClick={[Function]}
@@ -925,8 +925,8 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                     data-icon-name="Up"
                     role="presentation"
                   />
-                </span>
-                <span
+                </button>
+                <button
                   aria-label={undefined}
                   className="ms-DatePicker-nextYear js-nextYear"
                   onClick={[Function]}
@@ -945,7 +945,7 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                     data-icon-name="Down"
                     role="presentation"
                   />
-                </span>
+                </button>
               </div>
             </div>
             <div
@@ -971,7 +971,7 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                 className="ms-DatePicker-optionGrid"
                 role="grid"
               >
-                <span
+                <button
                   aria-label="January 2000"
                   aria-selected={false}
                   className="ms-DatePicker-monthOption"
@@ -980,8 +980,8 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                   role="gridcell"
                 >
                   Jan
-                </span>
-                <span
+                </button>
+                <button
                   aria-label="February 2000"
                   aria-selected={true}
                   className="ms-DatePicker-monthOption"
@@ -990,8 +990,8 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                   role="gridcell"
                 >
                   Feb
-                </span>
-                <span
+                </button>
+                <button
                   aria-label="March 2000"
                   aria-selected={false}
                   className="ms-DatePicker-monthOption"
@@ -1000,8 +1000,8 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                   role="gridcell"
                 >
                   Mar
-                </span>
-                <span
+                </button>
+                <button
                   aria-label="April 2000"
                   aria-selected={false}
                   className="ms-DatePicker-monthOption"
@@ -1010,8 +1010,8 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                   role="gridcell"
                 >
                   Apr
-                </span>
-                <span
+                </button>
+                <button
                   aria-label="May 2000"
                   aria-selected={false}
                   className="ms-DatePicker-monthOption"
@@ -1020,8 +1020,8 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                   role="gridcell"
                 >
                   May
-                </span>
-                <span
+                </button>
+                <button
                   aria-label="June 2000"
                   aria-selected={false}
                   className="ms-DatePicker-monthOption"
@@ -1030,8 +1030,8 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                   role="gridcell"
                 >
                   Jun
-                </span>
-                <span
+                </button>
+                <button
                   aria-label="July 2000"
                   aria-selected={false}
                   className="ms-DatePicker-monthOption"
@@ -1040,8 +1040,8 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                   role="gridcell"
                 >
                   Jul
-                </span>
-                <span
+                </button>
+                <button
                   aria-label="August 2000"
                   aria-selected={false}
                   className="ms-DatePicker-monthOption"
@@ -1050,8 +1050,8 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                   role="gridcell"
                 >
                   Aug
-                </span>
-                <span
+                </button>
+                <button
                   aria-label="September 2000"
                   aria-selected={false}
                   className="ms-DatePicker-monthOption"
@@ -1060,8 +1060,8 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                   role="gridcell"
                 >
                   Sep
-                </span>
-                <span
+                </button>
+                <button
                   aria-label="October 2000"
                   aria-selected={false}
                   className="ms-DatePicker-monthOption"
@@ -1070,8 +1070,8 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                   role="gridcell"
                 >
                   Oct
-                </span>
-                <span
+                </button>
+                <button
                   aria-label="November 2000"
                   aria-selected={false}
                   className="ms-DatePicker-monthOption"
@@ -1080,8 +1080,8 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                   role="gridcell"
                 >
                   Nov
-                </span>
-                <span
+                </button>
+                <button
                   aria-label="December 2000"
                   aria-selected={false}
                   className="ms-DatePicker-monthOption"
@@ -1090,11 +1090,11 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                   role="gridcell"
                 >
                   Dec
-                </span>
+                </button>
               </div>
             </div>
           </div>
-          <span
+          <button
             className="ms-DatePicker-goToday js-goToday"
             onClick={[Function]}
             onKeyDown={[Function]}
@@ -1102,7 +1102,7 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
             tabIndex={0}
           >
             Go to today
-          </span>
+          </button>
         </div>
       </div>
     </div>

From 2f247fff85ffd515c41b20aacc771f1269657713 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Fri, 19 Jan 2018 22:44:30 -0800
Subject: [PATCH 1237/1641] Minor visual alignment for FolderCover (#3641)

* Minor visual alignment for FolderCover

* Update change output
---
 .../folder-cover_2017-12-27-21-49.json        | 11 +++++++++
 .../components/FolderCover/FolderCover.scss   | 23 ++++---------------
 .../examples/FolderCover.Basic.Example.tsx    |  4 ++--
 3 files changed, 17 insertions(+), 21 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/folder-cover_2017-12-27-21-49.json

diff --git a/common/changes/@uifabric/experiments/folder-cover_2017-12-27-21-49.json b/common/changes/@uifabric/experiments/folder-cover_2017-12-27-21-49.json
new file mode 100644
index 0000000000000..411c99e610472
--- /dev/null
+++ b/common/changes/@uifabric/experiments/folder-cover_2017-12-27-21-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Minor visual alignment for FolderCover text",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.scss b/packages/experiments/src/components/FolderCover/FolderCover.scss
index 81bb2bf2279fe..dc7a14c35fa2d 100644
--- a/packages/experiments/src/components/FolderCover/FolderCover.scss
+++ b/packages/experiments/src/components/FolderCover/FolderCover.scss
@@ -85,19 +85,12 @@
   &,
   &.isSmall {
     font-size: $ms-font-size-s;
+    margin-bottom: 3px;
   }
 
   .isLarge & {
     font-size: $ms-font-size-m;
-  }
-
-  &,
-  &.isDefault {
-    margin-bottom: 8px;
-  }
-
-  .isMedia & {
-    margin-bottom: 4px;
+    margin-bottom: 3px;
   }
 }
 
@@ -111,19 +104,11 @@
   &,
   &.isSmall {
     font-size: $ms-font-size-l;
+    margin-bottom: 3px;
   }
 
   .isLarge & {
     font-size: $ms-font-size-xl;
-  }
-
-
-  &,
-  &.isDefault {
-    margin-bottom: 8px;
-  }
-
-  .isMedia & {
-    margin-bottom: 4px;
+    margin-bottom: 3px;
   }
 }
diff --git a/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx b/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx
index 97838a31f1fb3..c769f4d50b34c 100644
--- a/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx
+++ b/packages/experiments/src/components/FolderCover/examples/FolderCover.Basic.Example.tsx
@@ -4,7 +4,6 @@ import { FolderCover, getFolderCoverLayout, renderFolderCoverWithLayout } from '
 import { IFolderCoverProps } from '../FolderCover.types';
 import { ISize, fitContentToBounds } from '../../../Utilities';
 import { SharedSignal } from '../../signals/Signals';
-import { lorem } from '@uifabric/example-app-base';
 
 interface IFolderCoverWithImageProps extends IFolderCoverProps {
   originalImageSize: ISize;
@@ -76,7 +75,8 @@ export class FolderCoverBasicExample extends React.Component<{}, {}> {
           }
           folderCoverSize='large'
           folderCoverType='media'
-          metadata={ lorem(5) }
+          metadata={ 20 }
+          signal={ <SharedSignal /> }
         />
         <h3>Small Media Cover</h3>
         <FolderCoverWithImage

From 60225fba2411d965163b74eae9d61046013115b1 Mon Sep 17 00:00:00 2001
From: staylo8 <33881401+staylo8@users.noreply.github.com>
Date: Fri, 19 Jan 2018 22:46:21 -0800
Subject: [PATCH 1238/1641] Add post reduce grow callbacks (#3752)

* Add callbacks for onDataReduced and onDataGrown

* Add change file
---
 .../AddPostReduceGrowCallbacks_2018-01-19-23-48.json | 11 +++++++++++
 .../src/components/CommandBar/CommandBar.base.tsx    | 12 ++++++++++--
 .../src/components/CommandBar/CommandBar.types.ts    | 10 ++++++++++
 3 files changed, 31 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/AddPostReduceGrowCallbacks_2018-01-19-23-48.json

diff --git a/common/changes/@uifabric/experiments/AddPostReduceGrowCallbacks_2018-01-19-23-48.json b/common/changes/@uifabric/experiments/AddPostReduceGrowCallbacks_2018-01-19-23-48.json
new file mode 100644
index 0000000000000..2f6089719fc9d
--- /dev/null
+++ b/common/changes/@uifabric/experiments/AddPostReduceGrowCallbacks_2018-01-19-23-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Add callbacks for onDataReduced and onDataGrown",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "staylo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.base.tsx b/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
index efb96a9b73c7a..9161424602709 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
@@ -155,7 +155,7 @@ export class CommandBarBase extends BaseComponent<ICommandBarProps, {}> implemen
 
   @autobind
   private _onReduceData(data: ICommandBarData): ICommandBarData | undefined {
-    const { endAligned } = this.props;
+    const { endAligned, onDataReduced } = this.props;
     let { primaryItems, overflowItems, cacheKey, farItems } = data;
 
     // Use first item if endAligned, otherwise use last item
@@ -168,6 +168,10 @@ export class CommandBarBase extends BaseComponent<ICommandBarProps, {}> implemen
       primaryItems = endAligned ? primaryItems.slice(1) : primaryItems.slice(0, -1);
       cacheKey = this._computeCacheKey(primaryItems, farItems!, !!overflowItems.length);
 
+      if (onDataReduced) {
+        onDataReduced(movedItem);
+      }
+
       return { ...data, primaryItems, overflowItems, cacheKey };
     }
 
@@ -176,7 +180,7 @@ export class CommandBarBase extends BaseComponent<ICommandBarProps, {}> implemen
 
   @autobind
   private _onGrowData(data: ICommandBarData): ICommandBarData | undefined {
-    const { endAligned } = this.props;
+    const { endAligned, onDataGrown } = this.props;
     let { primaryItems, overflowItems, cacheKey, minimumOverflowItems, farItems } = data;
     const movedItem = overflowItems[0];
 
@@ -189,6 +193,10 @@ export class CommandBarBase extends BaseComponent<ICommandBarProps, {}> implemen
       primaryItems = endAligned ? [movedItem, ...primaryItems] : [...primaryItems, movedItem];
       cacheKey = this._computeCacheKey(primaryItems, farItems!, !!overflowItems.length);
 
+      if (onDataGrown) {
+        onDataGrown(movedItem);
+      }
+
       return { ...data, primaryItems, overflowItems, cacheKey };
     }
 
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.types.ts b/packages/experiments/src/components/CommandBar/CommandBar.types.ts
index 494f85ed0f4a9..53ead53555ebf 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.types.ts
+++ b/packages/experiments/src/components/CommandBar/CommandBar.types.ts
@@ -89,6 +89,16 @@ export interface ICommandBarProps extends React.HTMLAttributes<HTMLDivElement> {
    */
   onGrowData?: (data: ICommandBarData) => ICommandBarData;
 
+  /**
+   * Function callback invoked when data has been reduced.
+   */
+  onDataReduced?: (movedItem: ICommandBarItemProps) => void;
+
+  /**
+   * Function callback invoked when data has been grown.
+   */
+  onDataGrown?: (movedItem: ICommandBarItemProps) => void;
+
   /**
    * Additional css class to apply to the command bar
    * @defaultvalue undefined

From f3811054f54bdc22b2ee2bcbe9b277faf889b9f5 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Fri, 19 Jan 2018 22:49:59 -0800
Subject: [PATCH 1239/1641] MessageBar: New prop for text truncation with
 singleline text (#3751)

* Basic truncated message bar variant

* Removed comment

* hasOverflow implemented, still need to resolve conflict with DelayedRender

* Refactored naming for consistency and changing text overflow on click. Reinstating truncated prop.

* More case consistency

* Updated examples

* Added tests

* Revised example text

* New class for mobile to expand instead of wrap

* Added change file

* Updating dismiss icon to Clear icon per toolkit

* Change dismiss and expand icon color
---
 .../src/stories/MessageBar.stories.tsx        |  2 +
 .../message-bar_2018-01-19-21-14.json         | 11 ++++
 .../src/components/MessageBar/MessageBar.scss | 45 ++++++++++------
 .../components/MessageBar/MessageBar.test.tsx | 14 +++++
 .../src/components/MessageBar/MessageBar.tsx  | 54 ++++++++++++++-----
 .../components/MessageBar/MessageBar.types.ts |  8 +++
 .../examples/MessageBar.Basic.Example.tsx     | 11 ++--
 7 files changed, 111 insertions(+), 34 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/message-bar_2018-01-19-21-14.json

diff --git a/apps/vr-tests/src/stories/MessageBar.stories.tsx b/apps/vr-tests/src/stories/MessageBar.stories.tsx
index 3f4572e25e606..102389d8fdbe4 100644
--- a/apps/vr-tests/src/stories/MessageBar.stories.tsx
+++ b/apps/vr-tests/src/stories/MessageBar.stories.tsx
@@ -25,6 +25,8 @@ storiesOf('MessageBar', module)
   .add('Root', () => (<MessageBar>Info/default message bar. { link }</MessageBar>))
   .add('Root dismiss', () => (
     <MessageBar onDismiss={ noop }>Info/default message bar. { link }</MessageBar>))
+  .add('Root truncated', () => (
+    <MessageBar truncated={ true } isMultiline={ false }>Blocked lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi luctus, purus a lobortis tristique, odio augue pharetra metus, ac placerat nunc mi nec dui. Vestibulum aliquam et nunc semper scelerisque. Curabitur vitae orci nec quam condimentum porttitor et sed lacus. Vivamus ac efficitur leo. Cras faucibus mauris libero, ac placerat erat euismod et. Donec pulvinar commodo odio sit amet faucibus. In hac habitasse platea dictumst. Duis eu ante commodo, condimentum nibh pellentesque, laoreet enim. Fusce massa lorem, ultrices eu mi a, fermentum suscipit magna. Integer porta purus pulvinar, hendrerit felis eget, condimentum mauris. { link }</MessageBar>))
   .add('Root actions', () => (
     <MessageBar
       actions={
diff --git a/common/changes/office-ui-fabric-react/message-bar_2018-01-19-21-14.json b/common/changes/office-ui-fabric-react/message-bar_2018-01-19-21-14.json
new file mode 100644
index 0000000000000..33bbbaca487ee
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/message-bar_2018-01-19-21-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "MessageBar: New prop to allow singleline text with no action buttons to be truncated.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
index a8bb1af7cff60..7f31a1c724736 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.scss
@@ -8,11 +8,15 @@
 // MessageBar Styles
 
 // Mixins
-@mixin multilineContent {
+@mixin multiLineContent {
   flex-direction: column;
   .content {
     flex-direction: row;
   }
+  .innerText {
+    overflow: visible;
+    white-space: pre-wrap;
+  }
 }
 
 @mixin buttonMargins($sidesAndBottom, $top: $sidesAndBottom) {
@@ -164,11 +168,11 @@
   @include buttonMargins(12px, 0);
 }
 
-.actionsOneline {
+.actionsSingleLine {
   @include buttonMargins(8px);
 }
 
-.actions, .actionsOneline {
+.actions, .actionsSingleLine {
   display: flex;
   flex: 0 0 auto;
   flex-direction: row-reverse;
@@ -181,7 +185,8 @@
   }
 }
 
-.dismissal {
+.dismissal,
+.expand {
   @include focus-border();
   flex-shrink: 0;
   @include margin(8px, 8px, 8px, 0); // Margin-left is accounted for in the .text margin-right
@@ -195,23 +200,26 @@
   }
 }
 
-.dismissOneline {
+.dismissSingleLine,
+.expandSingleLine {
   display: flex;
 }
 
 .dismissal,
-.dismissOneline {
-  :global(.ms-Icon) {
+.dismissSingleLine,
+.expandSingleLine {
+  :global(.ms-Button-icon) {
     font-size: 12px;
     height: 12px;
     line-height: 12px;
+    color: $ms-color-neutralSecondary;
   }
 }
 
 // Multi line specific attributes
-.multiline {
-  @include multilineContent();
-  .text.multilineWithActions {
+.multiLine {
+  @include multiLineContent();
+  .text.multiLineWithActions {
     margin-bottom: 8px; // This creates an 8px space between text and actions
     @media screen and (max-width: $ms-screen-max-sm) {
       margin-bottom: 0;
@@ -220,18 +228,23 @@
 }
 
 // Single line specific attributes
-.singleline {
+.singleLine {
   .innerText {
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
   }
+  .expandSingleLine {
+    @include multiLineContent();
+  }
   @media screen and (max-width: $ms-screen-max-sm) {
-    // Singleline acts like multiline in mobile, unless text is specified to be truncated
-    @include multilineContent();
-    .text.multilineWithActions {
-      @media screen and (max-width: $ms-screen-max-sm) {
-        margin-bottom: 0;
+    // Singleline acts like multiLine in mobile, unless text is specified to be truncated
+    &:not(.expandingSingleLine) {
+      @include multiLineContent();
+      .text.multiLineWithActions {
+        @media screen and (max-width: $ms-screen-max-sm) {
+          margin-bottom: 0;
+        }
       }
     }
   }
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.test.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.test.tsx
index 311197014777e..50816d1aa2cbe 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.test.tsx
@@ -53,4 +53,18 @@ describe('MessageBar', () => {
       });
     });
   });
+
+  describe('truncated', () => {
+    it('is present when onDismiss exists', () => {
+      const renderedDOM: HTMLElement = renderIntoDocument(<MessageBar truncated={ true } isMultiline={ false } />);
+      let expandElement = renderedDOM.querySelector('.ms-MessageBar-expand');
+      expect(expandElement).not.toBeNull();
+    });
+
+    it('is not present when truncated is missing', () => {
+      const renderedDOM: HTMLElement = renderIntoDocument(<MessageBar isMultiline={ false } />);
+      let expandElement = renderedDOM.querySelector('.ms-MessageBar-expand');
+      expect(expandElement).toBeNull();
+    });
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
index 8f12d4e5129d1..581ac17e72ccc 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
@@ -3,6 +3,7 @@ import {
   BaseComponent,
   DelayedRender,
   css,
+  autobind,
   getId
 } from '../../Utilities';
 import { IconButton } from '../../Button';
@@ -14,6 +15,7 @@ const styles: any = stylesImport;
 export interface IMessageBarState {
   labelId?: string;
   showContent?: boolean;
+  expandSingleLine?: boolean;
 }
 
 export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState> {
@@ -39,7 +41,8 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
 
     this.state = {
       labelId: getId('MessageBar'),
-      showContent: false
+      showContent: false,
+      expandSingleLine: false,
     };
   }
 
@@ -55,7 +58,7 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
         <div
           className={ this.props.isMultiline ?
             ('ms-MessageBar-actions ' + styles.actions) :
-            ('ms-MessageBar-actionsOneline ' + styles.actionsOneline) }
+            ('ms-MessageBar-actionsSingleLine ' + styles.actionsSingleLine) }
         >
           { this.props.actions }
         </div>
@@ -83,7 +86,7 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
           disabled={ false }
           className={ css('ms-MessageBar-dismissal', styles.dismissal) }
           onClick={ this.props.onDismiss }
-          iconProps={ { iconName: 'Cancel' } }
+          iconProps={ { iconName: 'Clear' } }
           ariaLabel={ this.props.dismissButtonAriaLabel }
         />
       );
@@ -91,10 +94,10 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
     return null;
   }
 
-  private _getDismissOneLine(): JSX.Element | null {
+  private _getDismissSingleLine(): JSX.Element | null {
     if (this.props.onDismiss) {
       return (
-        <div className={ css('ms-MessageBar-dismissOneline', styles.dismissOneline) }>
+        <div className={ css('ms-MessageBar-dismissSingleLine', styles.dismissSingleLine) }>
           { this._getDismissDiv() }
         </div>
       );
@@ -102,6 +105,23 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
     return null;
   }
 
+  private _getExpandSingleLine(): JSX.Element | null {
+    if (!this.props.actions && this.props.truncated) {
+      return (
+        <div className={ css('ms-MessageBar-expandSingleLine', styles.expandSingleLine) }>
+          <IconButton
+            disabled={ false }
+            className={ css('ms-MessageBar-expand', styles.expand) }
+            onClick={ this._onClick }
+            iconProps={ { iconName: this.state.expandSingleLine ? 'DoubleChevronUp' : 'DoubleChevronDown' } }
+            ariaLabel={ this.props.dismissButtonAriaLabel }
+          />
+        </div>
+      );
+    }
+    return null;
+  }
+
   private _getIconSpan(): JSX.Element {
     return (
       <div className={ css('ms-MessageBar-icon', styles.icon) }>
@@ -116,8 +136,8 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
         className={
           css(this._getClassName(),
             'ms-MessageBar-multiline',
-            styles.multiline,
-            this.props.onDismiss && styles.dismissalMultiline
+            styles.multiLine,
+            this.props.onDismiss && styles.dismissalMultiLine
           )
         }
         role='status'
@@ -139,15 +159,18 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
         className={
           css(this._getClassName(),
             'ms-MessageBar-singleline',
-            styles.singleline,
-            this.props.onDismiss && 'ms-MessageBar-dismissalOneline'
+            styles.singleLine,
+            this.props.onDismiss && 'ms-MessageBar-dismissalSingleLine',
+            this.props.truncated && 'ms-MessageBar-expandingSingleLine',
+            this.props.truncated && styles.expandingSingleLine
           )
         }
       >
         <div className={ css(styles.content, 'ms-MessageBar-content') }>
           { this._getIconSpan() }
           { this._renderInnerText() }
-          { this._getDismissOneLine() }
+          { this._getExpandSingleLine() }
+          { this._getDismissSingleLine() }
         </div>
         { this._getActionsDiv() }
       </div >
@@ -157,7 +180,7 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
   private _renderInnerText(): JSX.Element {
     return (
       <div
-        className={ css('ms-MessageBar-text', styles.text, this.props.actions && styles.multilineWithActions, !this.props.onDismiss && styles.noDismissButton) }
+        className={ css('ms-MessageBar-text', styles.text, this.props.actions && styles.multiLineWithActions, !this.props.onDismiss && styles.noDismissButton, this.state.expandSingleLine && styles.expandSingleLine) }
         id={ this.state.labelId }
       >
         <span
@@ -169,7 +192,7 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
             <span>{ this.props.children }</span>
           </DelayedRender>
         </span>
-      </div>
+      </div >
     );
   }
 
@@ -182,4 +205,9 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
     }
     return 'polite';
   }
-}
+
+  @autobind
+  private _onClick(ev: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>) {
+    this.setState({ expandSingleLine: !this.state.expandSingleLine });
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts
index 21d828fe2aa90..f294c9fddc90d 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts
@@ -46,6 +46,14 @@ export interface IMessageBarProps extends React.HTMLAttributes<HTMLElement> {
   * Aria label on dismiss button if onDismiss is defined.
   */
   dismissButtonAriaLabel?: string;
+
+  /**
+  * Determines if the message bar text is truncated.
+  * If true, a button will render to toggle between a single line view and multiline view.
+  * This prop is for single line message bars with no buttons only in a limited space scenario.
+  * @defaultvalue false
+  */
+  truncated?: boolean;
 }
 
 export enum MessageBarType {
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx
index 9578fd2ebf378..1082a2ad73524 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx
@@ -15,7 +15,7 @@ export const MessageBarBasicExample = () => (
     <Label>Info/Default MessageBar</Label>
     <MessageBar>Info lorem ipsum dolor sit amet, a elit sem interdum consectetur adipiscing elit. <Link href='www.bing.com'>Visit our website.</Link></MessageBar>
 
-    <Label>Error MessageBar - only dismiss single line</Label>
+    <Label>Error MessageBar - single line, with dismiss button</Label>
     <MessageBar
       messageBarType={ MessageBarType.error }
       isMultiline={ false }
@@ -24,16 +24,17 @@ export const MessageBarBasicExample = () => (
       Error lorem ipsum dolor sit amet, a elit sem interdum consectetur adipiscing elit. <Link href='www.bing.com'>Visit our website.</Link>
     </MessageBar>
 
-    <Label>Blocked MessageBar - single line no buttons</Label>
+    <Label>Blocked MessageBar - single line, with dismiss button and truncated text. Truncation is not available if you use action buttons or multiline and should be used sparingly.</Label>
     <MessageBar
       messageBarType={ MessageBarType.blocked }
       isMultiline={ false }
       onDismiss={ log('test') }
+      truncated={ true }
     >
       Blocked lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi luctus, purus a lobortis tristique, odio augue pharetra metus, ac placerat nunc mi nec dui. Vestibulum aliquam et nunc semper scelerisque. Curabitur vitae orci nec quam condimentum porttitor et sed lacus. Vivamus ac efficitur leo. Cras faucibus mauris libero, ac placerat erat euismod et. Donec pulvinar commodo odio sit amet faucibus. In hac habitasse platea dictumst. Duis eu ante commodo, condimentum nibh pellentesque, laoreet enim. Fusce massa lorem, ultrices eu mi a, fermentum suscipit magna. Integer porta purus pulvinar, hendrerit felis eget, condimentum mauris. <Link href='www.bing.com'>Visit our website.</Link>
     </MessageBar>
 
-    <Label>SevereWarning MessageBar - multiline (default)</Label>
+    <Label>SevereWarning MessageBar - defaults to multiline, with action buttons</Label>
     <MessageBar
       messageBarType={ MessageBarType.severeWarning }
       actions={
@@ -47,7 +48,7 @@ export const MessageBarBasicExample = () => (
       <Link href='www.bing.com'>Visit our website.</Link>
     </MessageBar>
 
-    <Label>Success MessageBar - single line, short text with buttons</Label>
+    <Label>Success MessageBar - single line, with action buttons</Label>
     <MessageBar
       actions={
         <div>
@@ -61,7 +62,7 @@ export const MessageBarBasicExample = () => (
       Success lorem ipsum dolor sit amet. <Link href='www.bing.com'>Visit our website.</Link>
     </MessageBar>
 
-    <Label>Warning MessageBar</Label>
+    <Label>Warning MessageBar - defaults to multiline, with dismiss and action buttons</Label>
     <MessageBar
       onDismiss={ log('test') }
       messageBarType={ MessageBarType.warning }

From 8b2e9c33ba8128e11809bf3f0111d43933457e0c Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Fri, 19 Jan 2018 23:00:33 -0800
Subject: [PATCH 1240/1641] [ExpandingCard] fix for null content ref (#3628)

* ExpandingCard fix for null content ref

* Change file

* Update magellan-fix_hovercard_2017-12-22-19-38.json

* Update magellan-fix_hovercard_2017-12-22-19-38.json
---
 ...gellan-fix_hovercard_2017-12-22-19-38.json | 11 +++++++++++
 .../components/HoverCard/ExpandingCard.tsx    | 19 ++++++++-----------
 2 files changed, 19 insertions(+), 11 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/magellan-fix_hovercard_2017-12-22-19-38.json

diff --git a/common/changes/office-ui-fabric-react/magellan-fix_hovercard_2017-12-22-19-38.json b/common/changes/office-ui-fabric-react/magellan-fix_hovercard_2017-12-22-19-38.json
new file mode 100644
index 0000000000000..29e1909fcfee5
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/magellan-fix_hovercard_2017-12-22-19-38.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Hovercard: Changed content keydown listener to element event binding",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
index f6c807ddf53d5..fe3be1880b014 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
@@ -31,8 +31,6 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
     gapSpace: 0
   };
 
-  private _expandingCard: HTMLElement;
-
   private _styles: IExpandingCardStyles;
   // tslint:disable-next-line:no-unused-variable
   private _callout: ICallout;
@@ -49,10 +47,6 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
 
   public componentDidMount() {
     this._checkNeedsScroll();
-
-    if (this.props.trapFocus) {
-      this._events.on(this._expandingCard, 'keydown', this._onDismiss);
-    }
   }
 
   public componentWillUnmount() {
@@ -73,9 +67,9 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
 
     const content = (
       <div
-        ref={ this._resolveRef('_expandingCard') }
         onMouseEnter={ this.props.onEnter }
         onMouseLeave={ this.props.onLeave }
+        onKeyDown={ this._onKeyDown }
       >
         { this._onRenderCompactCard() }
         { this._onRenderExpandedCard() }
@@ -110,14 +104,17 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
   }
 
   @autobind
-  private _onDismiss(ev: MouseEvent): void {
-    if (ev.type === 'keydown' && (ev.which !== KeyCodes.escape)) {
-      return;
-    } else {
+  private _onKeyDown(ev: React.KeyboardEvent<HTMLElement>): void {
+    if (ev.which === KeyCodes.escape) {
       this.props.onLeave && this.props.onLeave(ev);
     }
   }
 
+  @autobind
+  private _onDismiss(ev: MouseEvent): void {
+    this.props.onLeave && this.props.onLeave(ev);
+  }
+
   @autobind
   private _onRenderCompactCard(): JSX.Element {
     return (

From 04bf3df995b81d6bc60a3ec21c5497208ce0affa Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Fri, 19 Jan 2018 23:06:48 -0800
Subject: [PATCH 1241/1641] Theming: Fix listText semantic slot name (#3403)

* fix colors

* change file

* deprecate slots correctly
---
 .../phkuo-fixListText_2017-11-16-03-20.json   | 11 +++++++++
 .../ThemeGenerator/ThemeGeneratorPage.tsx     |  2 +-
 .../styling/src/interfaces/ISemanticColors.ts |  8 ++++++-
 packages/styling/src/styles/theme.ts          | 24 +++++++++++++++----
 4 files changed, 39 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/phkuo-fixListText_2017-11-16-03-20.json

diff --git a/common/changes/@uifabric/styling/phkuo-fixListText_2017-11-16-03-20.json b/common/changes/@uifabric/styling/phkuo-fixListText_2017-11-16-03-20.json
new file mode 100644
index 0000000000000..6277f3c506bd4
--- /dev/null
+++ b/common/changes/@uifabric/styling/phkuo-fixListText_2017-11-16-03-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Theming: fix listText semantic slot",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
index bef7d188b5588..fbbe633f9bdd1 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
@@ -481,7 +481,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
     }
     document.body.style.backgroundColor = themeAsJson.backgroundColor;
     document.body.style.color = themeAsJson.bodyText;
-    loadTheme({ palette: themeAsJson });
+    console.log('Full theme... ', loadTheme({ palette: themeAsJson }));
   }
 
   @autobind
diff --git a/packages/styling/src/interfaces/ISemanticColors.ts b/packages/styling/src/interfaces/ISemanticColors.ts
index dc48a06e33314..db2cb0750c34a 100644
--- a/packages/styling/src/interfaces/ISemanticColors.ts
+++ b/packages/styling/src/interfaces/ISemanticColors.ts
@@ -243,7 +243,7 @@ export interface ISemanticColors {
   /**
    * The default text color for list item titles and text in column fields.
    */
-  listTextColor: string;
+  listText: string;
 
   /**
    * The background color of a hovered list item.
@@ -259,4 +259,10 @@ export interface ISemanticColors {
    * The background color of a checked and hovered list item.
    */
   listItemBackgroundCheckedHovered: string;
+
+  //// DEPRECATED SLOTS
+  // Do not use these slots, they are only maintained for backwards compatibility.
+
+  /** DEPRECATED use listText instead */
+  listTextColor: string;
 }
\ No newline at end of file
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index dbe52e03d4cad..49ac93594b35e 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -99,21 +99,26 @@ export function createTheme(theme: IPartialTheme): ITheme {
     newPalette.accent = newPalette.themePrimary;
   }
 
+  // mix in custom overrides with good slots first, since custom overrides might be used in fixing deprecated slots
+  let newSemanticColors = { ..._makeSemanticColorsFromPalette(newPalette, !!theme.isInverted), ...theme.semanticColors };
+  newSemanticColors = { ..._fixDeprecatedSlots(newSemanticColors), ...theme.semanticColors };
+
   return {
     palette: newPalette,
     fonts: {
       ...DefaultFontStyles,
       ...theme.fonts
     },
-    semanticColors: { ..._makeSemanticColorsFromPalette(newPalette, !!theme.isInverted), ...theme.semanticColors },
+    semanticColors: newSemanticColors,
     isInverted: !!theme.isInverted
   } as ITheme;
 }
 
 // Generates all the semantic slot colors based on the Fabric palette.
 // We'll use these as fallbacks for semantic slots that the passed in theme did not define.
+// This does NOT fix deprecated slots.
 function _makeSemanticColorsFromPalette(p: IPalette, isInverted: boolean): ISemanticColors {
-  return {
+  let toReturn: ISemanticColors = {
     bodyBackground: p.white,
     bodyText: p.neutralPrimary,
     bodyTextChecked: p.black,
@@ -159,9 +164,20 @@ function _makeSemanticColorsFromPalette(p: IPalette, isInverted: boolean): ISema
     menuHeader: p.themePrimary,
 
     listBackground: p.white,
-    listTextColor: p.neutralPrimary,
+    listText: p.neutralPrimary,
     listItemBackgroundHovered: p.neutralLighter,
     listItemBackgroundChecked: p.neutralLight,
-    listItemBackgroundCheckedHovered: p.neutralQuaternaryAlt
+    listItemBackgroundCheckedHovered: p.neutralQuaternaryAlt,
+
+    // Deprecated slots, fixed by _fixDeprecatedSlots()
+    listTextColor: ''
   };
+
+  return toReturn;
 }
+
+function _fixDeprecatedSlots(s: ISemanticColors): ISemanticColors {
+  s.listTextColor = s.listText;
+
+  return s;
+}
\ No newline at end of file

From a9d0f70495f315998a5dad78699ffd2349436420 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Fri, 19 Jan 2018 23:18:16 -0800
Subject: [PATCH 1242/1641] Website: Left navigation scroll implementation
 (#3749)

* Left nav scroll works, but not with uhf

* Attached left nav and resizing on scroll

* _handleNavPositioning for scroll and resize both

* Wrapped Nav in FocusZone for arrow key nav instead of tab

* Focus Zone for page header

* Removed isNavOpen concept and other clean up

* More isNavOpen cleanup

* Revert "More isNavOpen cleanup"

This reverts commit d8ac7dea5ab95f1c595bf4456e2d82db95af64ff.

* Revert "Removed isNavOpen concept and other clean up"

This reverts commit ed823f6290cbdf4ee5519e352754de0340eb2ebe.

* Removed isNavOpen state, no longer needed since mobile nav is gone

* Nav position fixed and float left, more comments, adjusted scroll thresh

* AttachScroll refactor, some app content refactor

* App content refactor for header

* Removed height variable, using state

* Fixes jittery scroll in edge, attached header in ie, and small refactors

* Max-width to make IE happy

* IE top:unset fix

* Removed console.log

* Added change file

* Adding width back in

* Fixed test env edge case

* Removed unused variables
---
 .../src/components/App/App.scss               | 60 +++----------
 .../fabric-website/src/components/App/App.tsx | 88 ++++++++++++++++---
 .../fabric-website/src/components/Nav/Nav.tsx |  9 +-
 .../PageHeader/PageHeader.module.scss         |  3 +-
 .../src/components/PageHeader/PageHeader.tsx  | 80 +++++++++--------
 .../src/utilities/AttachedScrollUtility.ts    | 24 +++++
 .../left-nav-scroll_2018-01-19-00-11.json     | 11 +++
 7 files changed, 173 insertions(+), 102 deletions(-)
 create mode 100644 apps/fabric-website/src/utilities/AttachedScrollUtility.ts
 create mode 100644 common/changes/@uifabric/fabric-website/left-nav-scroll_2018-01-19-00-11.json

diff --git a/apps/fabric-website/src/components/App/App.scss b/apps/fabric-website/src/components/App/App.scss
index 68dba7bef333a..088921c759926 100644
--- a/apps/fabric-website/src/components/App/App.scss
+++ b/apps/fabric-website/src/components/App/App.scss
@@ -13,14 +13,12 @@
   // Nav is hidden off screen by default
   .App-nav {
     -webkit-overflow-scrolling: touch; // Improves scrolling performance
-    bottom: 0;
-    @include ms-left(-$Nav-width);
     overflow-y: auto;
     position: fixed;
     top: $Header-height;
-    transition: $ms-animation-duration-2 $ms-animation-ease-1;
-    @include ms-transition-property(left);
     width: $Nav-width;
+    @include ms-float(left);
+    z-index: $ms-zIndex-1;
   }
 
   .App-content {
@@ -39,31 +37,6 @@
     }
   }
 
-  // When the nav is open (smaller screens only) push the content over and prevent app from scrolling
-  @media screen and (max-width: $uhf-screen-min-mobile) {
-    .App {
-      padding: 0;
-    }
-
-    .App.is-navOpen {
-      bottom: 0;
-      left: 0;
-      overflow: hidden;
-      position: fixed;
-      right: 0;
-      top: 0;
-
-      .App-nav {
-        @include ms-left(0);
-      }
-
-      .App-content {
-        @include ms-left($Nav-width);
-        opacity: 0.5; // Dim the content
-      }
-    }
-  }
-
   // Show the nav at all times, to the left of the content
   @media screen and (min-width: $uhf-screen-min-mobile) {
     .App {
@@ -78,27 +51,17 @@
     }
 
     .App-nav {
-      @include ms-left(auto);
-      top: auto; // Mobile nav bar is no longer there
-      position: relative;
-      overflow-y: visible
+      top: $Header-height*2;
+      bottom: 0;
+      overflow-y: auto;
+      overflow-x: hidden;
     }
 
     .App-content {
-      margin-top: 0;
       flex-grow: unset;
+      max-width: calc(100% - #{$Nav-width}); // IE needs max-width, it was ignoring width
       width: calc(100% - #{$Nav-width});
-    }
-
-    // Reset values for the nav and content if opened on larger screens
-    .App.is-navOpen {
-      .App-nav {
-        @include ms-left(auto);
-      }
-
-      .App-content {
-        @include ms-left(auto);
-      }
+      @include ms-left($Nav-width);
     }
   }
 
@@ -111,6 +74,11 @@
     .App-nav {
       @include ms-margin-left(18px);
     }
+
+    .App-content {
+      width: calc(100% - #{$Nav-width});
+      @include ms-left($Nav-width + 18px);
+    }
   }
 }
 
@@ -118,4 +86,4 @@
   .App {
     padding: 0;
   }
-}
+}
\ No newline at end of file
diff --git a/apps/fabric-website/src/components/App/App.tsx b/apps/fabric-website/src/components/App/App.tsx
index cdf7eb1b571d7..5611b0d616a57 100644
--- a/apps/fabric-website/src/components/App/App.tsx
+++ b/apps/fabric-website/src/components/App/App.tsx
@@ -1,7 +1,8 @@
 import * as React from 'react';
 import './App.scss';
 import { AppState } from './AppState';
-import { css } from 'office-ui-fabric-react/lib/Utilities';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+import AttachedScrollUtility from '../../utilities/AttachedScrollUtility';
 import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
 import { Nav } from '../Nav/Nav';
 
@@ -9,37 +10,66 @@ export interface IAppProps extends React.Props<App> {
 }
 
 export interface IAppState {
-  isNavOpen: boolean;
+  isAttached: boolean;
+  navHeight: number;
 }
 
 export class App extends React.Component<IAppProps, any> {
 
+  private _attachedScrollThreshold: number;
+  private _appContent: HTMLDivElement;
+  private _appContentRect: ClientRect;
+
   constructor(props: IAppProps) {
     super(props);
 
     this.state = {
-      isNavOpen: false
+      isAttached: false
     };
   }
 
+  public componentDidMount() {
+    window.addEventListener('scroll', this._handleNavPositioning);
+    window.addEventListener('resize', this._handleNavPositioning);
+
+    this._attachedScrollThreshold = AttachedScrollUtility.calculateAttachedScrollThreshold();
+    this._handleNavPositioning();
+  }
+
+  public componentWillUnmount() {
+    window.removeEventListener('scroll', this._handleNavPositioning);
+    window.removeEventListener('resize', this._handleNavPositioning);
+  }
+
   public render() {
-    let { isNavOpen } = this.state;
+    let { navHeight } = this.state;
+    let appContentTop = this._appContentRect ? this._appContentRect.top : 100;
+    // Using appContentTop as a reference to match instead of 'unset' because it does not work in IE.
+    let navTop: string = this.state.isAttached ? '0' : appContentTop.toString();
+    let navStyle = {
+      top: navTop,
+      height: navHeight
+    };
 
     return (
       <Fabric
-        className={ css(
-          'App',
-          isNavOpen && 'is-navOpen'
-        ) }
+        className='App'
       >
         <div className='App-wrapper'>
-          <div className='App-nav'>
+          <div
+            className='App-nav'
+            style={ navStyle }
+          >
             <Nav
               pages={ AppState.pages }
-              onLinkClick={ this._onNavItemClicked.bind(this) }
             />
           </div>
-          <div className='App-content' data-is-scrollable='true'>
+          <div
+            className='App-content'
+            data-is-scrollable='true'
+            ref={ (el) => this._appContent = el }
+            data-app-content-div='true'
+          >
             { this.props.children }
           </div>
         </div>
@@ -47,9 +77,41 @@ export class App extends React.Component<IAppProps, any> {
     );
   }
 
-  private _onNavItemClicked(ev: MouseEvent) {
+  @autobind
+  private _handleNavPositioning() {
+    let { isAttached, navHeight } = this.state;
+    this._appContentRect = this._appContent.getBoundingClientRect();
+    const viewPortHeight = window.innerHeight;
+    isAttached = AttachedScrollUtility.shouldComponentAttach(isAttached, this._attachedScrollThreshold);
+    navHeight = this._calculateNavHeight(viewPortHeight, this._appContentRect, navHeight);
     this.setState({
-      isNavOpen: false
+      isAttached: isAttached,
+      navHeight: navHeight
     });
   }
+
+  private _calculateNavHeight(viewPortHeight: number, appContentRect: ClientRect, height: number): number {
+    if (!appContentRect) {
+      return height;
+    }
+    if (appContentRect.top >= 0) {
+      // This case accounts for space taken up by the UHF header in the viewport.
+      height = viewPortHeight - appContentRect.top;
+      if (appContentRect.height < appContentRect.bottom && viewPortHeight > appContentRect.bottom) {
+        // This case might only exist in the UHF testing environment, when content isn't rendering properly and its height is weird.
+        height = appContentRect.height;
+      }
+    } else if (viewPortHeight < appContentRect.bottom && appContentRect.top < 0) {
+      // For pages with content that's longer than the viewport, the viewport is the height.
+      // Takes effect when you scroll past the header.
+      height = viewPortHeight;
+    } else if (appContentRect.bottom < 0) {
+      // In smaller screens when you scroll till the footer takes the whole page, collapse the nav.
+      height = 0;
+    } else {
+      // Once the footer is in view, match nav bottom to content bottom.
+      height = appContentRect.bottom;
+    }
+    return height;
+  }
 }
\ No newline at end of file
diff --git a/apps/fabric-website/src/components/Nav/Nav.tsx b/apps/fabric-website/src/components/Nav/Nav.tsx
index 0844cd7b62a74..1ca61b4a5c929 100644
--- a/apps/fabric-website/src/components/Nav/Nav.tsx
+++ b/apps/fabric-website/src/components/Nav/Nav.tsx
@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { css } from 'office-ui-fabric-react/lib/Utilities';
+import { FocusZone } from 'office-ui-fabric-react/lib/FocusZone';
 import * as stylesImport from './Nav.module.scss';
 const styles: any = stylesImport;
 import {
@@ -24,9 +25,11 @@ export class Nav extends React.Component<INavProps, INavState> {
       : null;
 
     return (
-      <nav className={ styles.nav } role='navigation'>
-        { links }
-      </nav>
+      <FocusZone>
+        <nav className={ styles.nav } role='navigation'>
+          { links }
+        </nav>
+      </FocusZone>
     );
   }
 
diff --git a/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss b/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss
index 6a5a20ccf4790..fb00f01fb9dcf 100644
--- a/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss
+++ b/apps/fabric-website/src/components/PageHeader/PageHeader.module.scss
@@ -47,7 +47,6 @@
         box-shadow: 0 10px 30px -10px rgba(0,0,0,.2);
         max-width: $App-maximumWidth - $Nav-width;
         position: fixed;
-        top: 0;
         width: calc(100% - #{$Nav-width} - #{$App-padding-left-lg} - #{$App-padding-right-lg});
         z-index: $ms-zIndex-1;
         height: $PageHeader-attachedTitleHeight + $PageHeader-navHeight;
@@ -131,7 +130,7 @@
   .pageHeader {
     &.isAttached {
       .content {
-        width: calc(100% - #{$Nav-width} - #{$App-padding-right-sm} - #{$App-padding-left-sm} - 13px);
+        width: calc(100% - #{$Nav-width} - #{$App-padding-right-sm} - #{$App-padding-left-sm});
       }
     }
   }
diff --git a/apps/fabric-website/src/components/PageHeader/PageHeader.tsx b/apps/fabric-website/src/components/PageHeader/PageHeader.tsx
index 21b583549ed9f..51833d676efc5 100644
--- a/apps/fabric-website/src/components/PageHeader/PageHeader.tsx
+++ b/apps/fabric-website/src/components/PageHeader/PageHeader.tsx
@@ -3,10 +3,9 @@ import { css, BaseComponent, IBaseProps } from 'office-ui-fabric-react/lib/Utili
 import * as stylesImport from './PageHeader.module.scss';
 const styles: any = stylesImport;
 import { getPageRouteFromState } from '../../utilities/pageroute';
+import AttachedScrollUtility from '../../utilities/AttachedScrollUtility';
 import { PageHeaderLink } from '../../components/PageHeaderLink/PageHeaderLink';
-
-const FULL_HEADER_HEIGHT = 236;
-const ATTACHED_HEADER_HEIGHT = 128;
+import { FocusZone } from 'office-ui-fabric-react/lib/FocusZone';
 
 export interface IPageHeaderProps extends IBaseProps {
 
@@ -47,6 +46,8 @@ export interface IPageHeaderState {
    * The section title area is in a collapsed state.
    */
   isAttached: boolean;
+  headerBottom: string;
+  headerTop: string;
 }
 
 export class PageHeader extends BaseComponent<IPageHeaderProps, IPageHeaderState> {
@@ -56,12 +57,16 @@ export class PageHeader extends BaseComponent<IPageHeaderProps, IPageHeaderState
   };
 
   private _attachedScrollThreshold: number;
+  private _appContent: HTMLDivElement;
+  private _appContentRect: ClientRect;
 
   constructor(props: IPageHeaderProps) {
     super(props);
 
     this.state = {
-      isAttached: false
+      isAttached: false,
+      headerBottom: 'unset',
+      headerTop: '0'
     };
 
   }
@@ -71,7 +76,8 @@ export class PageHeader extends BaseComponent<IPageHeaderProps, IPageHeaderState
     // Only attach the header if there are in-page nav items
     if (this.props.links) {
       this._events.on(window, 'scroll', this._onScroll, true);
-      this._calculateAttachedScrollThreshold();
+      this._appContent = document.querySelector('[data-app-content-div]');
+      this._attachedScrollThreshold = AttachedScrollUtility.calculateAttachedScrollThreshold();
     }
   }
 
@@ -81,31 +87,27 @@ export class PageHeader extends BaseComponent<IPageHeaderProps, IPageHeaderState
     let baseRoute: string = getPageRouteFromState(
       this.props.pageTitle
     );
-
-    let backgroundStyle;
-    if (backgroundColor) {
-      backgroundStyle = {
-        backgroundColor: backgroundColor,
-      };
-    }
-
-    if (backgroundImage) {
-      backgroundStyle.backgroundImage = backgroundImage;
-    }
-
     let inPageNav;
+    let backgroundStyle = {
+      bottom: this.state.headerBottom,
+      top: this.state.headerTop,
+      backgroundColor: backgroundColor,
+      backgroundImage: backgroundImage
+    };
+
     if (links) {
       inPageNav = (
-        <nav className={ styles.pageNav } aria-label='In page navigation'>
-          <ul>
-            { links.map((link, linkIndex) => (
-              <li key={ linkIndex }>
-                <PageHeaderLink href={ baseRoute + '#' + link.location } text={ link.text } />
-              </li>
-              // <li key={ linkIndex }><a>{ link.text }</a></li>
-            )) }
-          </ul>
-        </nav>
+        <FocusZone>
+          <nav className={ styles.pageNav } aria-label='In page navigation'>
+            <ul>
+              { links.map((link, linkIndex) => (
+                <li key={ linkIndex }>
+                  <PageHeaderLink href={ baseRoute + '#' + link.location } text={ link.text } />
+                </li>
+              )) }
+            </ul>
+          </nav>
+        </FocusZone>
       );
     }
 
@@ -122,21 +124,23 @@ export class PageHeader extends BaseComponent<IPageHeaderProps, IPageHeaderState
   }
 
   private _onScroll() {
-    let { isAttached } = this.state;
-
-    if (window.scrollY >= this._attachedScrollThreshold) {
-      isAttached = true;
+    let { isAttached, headerBottom, headerTop } = this.state;
+    this._appContentRect = this._appContent && this._appContent.getBoundingClientRect();
+    isAttached = AttachedScrollUtility.shouldComponentAttach(isAttached, this._attachedScrollThreshold);
+
+    if (this._appContent && this._appContentRect.bottom < AttachedScrollUtility.attachedHeaderHeight) {
+      // This causes the header to bump into the footer instead of overlapping it, usually on narrow screens.
+      headerBottom = (window.innerHeight - this._appContentRect.bottom).toString();
+      headerTop = 'unset';
     } else {
-      isAttached = false;
+      headerBottom = 'unset';
+      headerTop = '0';
     }
 
     this.setState({
-      isAttached: isAttached
+      isAttached: isAttached,
+      headerBottom: headerBottom,
+      headerTop: headerTop
     });
   }
-
-  private _calculateAttachedScrollThreshold() {
-    let attachedScrollThreshold = FULL_HEADER_HEIGHT - ATTACHED_HEADER_HEIGHT;
-    this._attachedScrollThreshold = attachedScrollThreshold;
-  }
 }
diff --git a/apps/fabric-website/src/utilities/AttachedScrollUtility.ts b/apps/fabric-website/src/utilities/AttachedScrollUtility.ts
new file mode 100644
index 0000000000000..a92154a9ae60f
--- /dev/null
+++ b/apps/fabric-website/src/utilities/AttachedScrollUtility.ts
@@ -0,0 +1,24 @@
+/**
+ * @copyright Microsoft Corporation. All rights reserved.
+ *
+ * @file AttachedScrollUtility, returns window size
+ */
+
+export default class AttachedScrollUtility {
+  public static attachedHeaderHeight = 128;
+
+  public static shouldComponentAttach(isAttached, attachedScrollThreshold): boolean {
+    if (window.pageYOffset >= attachedScrollThreshold) {
+      isAttached = true;
+    } else {
+      isAttached = false;
+    }
+    return isAttached;
+  }
+
+  public static calculateAttachedScrollThreshold(): number {
+    const UHF_HEADER_HEIGHT = 50;
+    const attachedScrollThreshold = UHF_HEADER_HEIGHT * 2;
+    return attachedScrollThreshold;
+  }
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/left-nav-scroll_2018-01-19-00-11.json b/common/changes/@uifabric/fabric-website/left-nav-scroll_2018-01-19-00-11.json
new file mode 100644
index 0000000000000..ceffc585afe02
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/left-nav-scroll_2018-01-19-00-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Adding left nav scroll functionality, including fixing the left nav with the header. Other layout refactoring to accommodate.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From c7b183aafed6defdf60f2e232d7fc37a8b7ddf2e Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 22 Jan 2018 11:14:28 +0000
Subject: [PATCH 1243/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 19 +++++++
 apps/fabric-website/CHANGELOG.md              |  9 +++-
 apps/fabric-website/package.json              |  4 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../message-bar-polish_2018-01-11-17-44.json  | 11 ----
 ...tReduceGrowCallbacks_2018-01-19-23-48.json | 11 ----
 .../folder-cover_2017-12-27-21-49.json        | 11 ----
 .../left-nav-scroll_2018-01-19-00-11.json     | 11 ----
 ...vider_contextualMenu_2018-01-19-19-20.json | 11 ----
 .../phkuo-fixListText_2017-11-16-03-20.json   | 11 ----
 ...att-measured-context_2018-01-13-22-47.json | 11 ----
 ...ange-clickable-spans_2018-01-18-19-16.json | 11 ----
 ...vider_contextualMenu_2018-01-19-19-20.json | 11 ----
 ...att-measured-context_2018-01-13-22-47.json | 11 ----
 ...gellan-fix_hovercard_2017-12-22-19-38.json | 11 ----
 .../message-bar-polish_2018-01-11-17-44.json  | 11 ----
 .../message-bar_2018-01-19-21-14.json         | 11 ----
 packages/example-app-base/CHANGELOG.json      | 22 ++++++++
 packages/example-app-base/CHANGELOG.md        |  9 +++-
 packages/example-app-base/package.json        |  6 +--
 packages/experiments/CHANGELOG.json           | 29 +++++++++++
 packages/experiments/CHANGELOG.md             | 13 ++++-
 packages/experiments/package.json             |  6 +--
 packages/file-type-icons/package.json         |  2 +-
 packages/icons/package.json                   |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 52 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 17 +++++-
 packages/office-ui-fabric-react/package.json  |  8 +--
 packages/styling/CHANGELOG.json               | 24 +++++++++
 packages/styling/CHANGELOG.md                 | 10 +++-
 packages/styling/package.json                 |  4 +-
 packages/utilities/CHANGELOG.json             | 14 +++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  2 +-
 37 files changed, 242 insertions(+), 170 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/message-bar-polish_2018-01-11-17-44.json
 delete mode 100644 common/changes/@uifabric/experiments/AddPostReduceGrowCallbacks_2018-01-19-23-48.json
 delete mode 100644 common/changes/@uifabric/experiments/folder-cover_2017-12-27-21-49.json
 delete mode 100644 common/changes/@uifabric/fabric-website/left-nav-scroll_2018-01-19-00-11.json
 delete mode 100644 common/changes/@uifabric/styling/betrue-darkenSectionDivider_contextualMenu_2018-01-19-19-20.json
 delete mode 100644 common/changes/@uifabric/styling/phkuo-fixListText_2017-11-16-03-20.json
 delete mode 100644 common/changes/@uifabric/utilities/brwatt-measured-context_2018-01-13-22-47.json
 delete mode 100644 common/changes/office-ui-fabric-react/-1535-calendar-change-clickable-spans_2018-01-18-19-16.json
 delete mode 100644 common/changes/office-ui-fabric-react/betrue-darkenSectionDivider_contextualMenu_2018-01-19-19-20.json
 delete mode 100644 common/changes/office-ui-fabric-react/brwatt-measured-context_2018-01-13-22-47.json
 delete mode 100644 common/changes/office-ui-fabric-react/magellan-fix_hovercard_2017-12-22-19-38.json
 delete mode 100644 common/changes/office-ui-fabric-react/message-bar-polish_2018-01-11-17-44.json
 delete mode 100644 common/changes/office-ui-fabric-react/message-bar_2018-01-19-21-14.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index ed9f302601f33..b7b6161fbe4ac 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.3.0",
+      "tag": "@uifabric/fabric-website_v5.3.0",
+      "date": "Mon, 22 Jan 2018 11:14:27 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "a9d0f70495f315998a5dad78699ffd2349436420",
+            "comment": "Adding left nav scroll functionality, including fixing the left nav with the header. Other layout refactoring to accommodate."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.40.1 <6.0.0` to `>=5.41.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.2.1",
       "tag": "@uifabric/fabric-website_v5.2.1",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index d976af8115344..5f789e2e71bb9 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Fri, 22 Dec 2017 11:10:56 GMT and should not be manually modified.
+This log was last generated on Mon, 22 Jan 2018 11:14:27 GMT and should not be manually modified.
+
+## 5.3.0
+Mon, 22 Jan 2018 11:14:27 GMT
+
+### Minor changes
+
+- Adding left nav scroll functionality, including fixing the left nav with the header. Other layout refactoring to accommodate.
 
 ## 5.2.1
 Fri, 22 Dec 2017 11:10:56 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 2a2599b37dcac..3863940b50ed2 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.2.1",
+  "version": "5.3.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.40.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.41.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 4e0d08eea9b22..5af016b1b2d46 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.40.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.41.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 52973455b9699..681693497a1b4 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.40.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.41.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 7f8ff26fa6dac..275d1e653f1bd 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.40.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.41.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 07696f330d576..07e9a4adfd4ff 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.40.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.41.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/@uifabric/example-app-base/message-bar-polish_2018-01-11-17-44.json b/common/changes/@uifabric/example-app-base/message-bar-polish_2018-01-11-17-44.json
deleted file mode 100644
index 22af79e784751..0000000000000
--- a/common/changes/@uifabric/example-app-base/message-bar-polish_2018-01-11-17-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Updated theme override colors for MessageBar.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/AddPostReduceGrowCallbacks_2018-01-19-23-48.json b/common/changes/@uifabric/experiments/AddPostReduceGrowCallbacks_2018-01-19-23-48.json
deleted file mode 100644
index 2f6089719fc9d..0000000000000
--- a/common/changes/@uifabric/experiments/AddPostReduceGrowCallbacks_2018-01-19-23-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Add callbacks for onDataReduced and onDataGrown",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "staylo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/folder-cover_2017-12-27-21-49.json b/common/changes/@uifabric/experiments/folder-cover_2017-12-27-21-49.json
deleted file mode 100644
index 411c99e610472..0000000000000
--- a/common/changes/@uifabric/experiments/folder-cover_2017-12-27-21-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Minor visual alignment for FolderCover text",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/left-nav-scroll_2018-01-19-00-11.json b/common/changes/@uifabric/fabric-website/left-nav-scroll_2018-01-19-00-11.json
deleted file mode 100644
index ceffc585afe02..0000000000000
--- a/common/changes/@uifabric/fabric-website/left-nav-scroll_2018-01-19-00-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Adding left nav scroll functionality, including fixing the left nav with the header. Other layout refactoring to accommodate.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/betrue-darkenSectionDivider_contextualMenu_2018-01-19-19-20.json b/common/changes/@uifabric/styling/betrue-darkenSectionDivider_contextualMenu_2018-01-19-19-20.json
deleted file mode 100644
index 3fb7b3e2673e7..0000000000000
--- a/common/changes/@uifabric/styling/betrue-darkenSectionDivider_contextualMenu_2018-01-19-19-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "updated divider color to neutralTertiaryAlt",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "betrue@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/phkuo-fixListText_2017-11-16-03-20.json b/common/changes/@uifabric/styling/phkuo-fixListText_2017-11-16-03-20.json
deleted file mode 100644
index 6277f3c506bd4..0000000000000
--- a/common/changes/@uifabric/styling/phkuo-fixListText_2017-11-16-03-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Theming: fix listText semantic slot",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/brwatt-measured-context_2018-01-13-22-47.json b/common/changes/@uifabric/utilities/brwatt-measured-context_2018-01-13-22-47.json
deleted file mode 100644
index d49db02f74938..0000000000000
--- a/common/changes/@uifabric/utilities/brwatt-measured-context_2018-01-13-22-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Adding a helper component to inject context values",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "brwatt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/-1535-calendar-change-clickable-spans_2018-01-18-19-16.json b/common/changes/office-ui-fabric-react/-1535-calendar-change-clickable-spans_2018-01-18-19-16.json
deleted file mode 100644
index 023705d3627ed..0000000000000
--- a/common/changes/office-ui-fabric-react/-1535-calendar-change-clickable-spans_2018-01-18-19-16.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Address issue #1535 - Calendar: Change clickable spans to buttons.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-jojanz@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/betrue-darkenSectionDivider_contextualMenu_2018-01-19-19-20.json b/common/changes/office-ui-fabric-react/betrue-darkenSectionDivider_contextualMenu_2018-01-19-19-20.json
deleted file mode 100644
index c656ca15062c1..0000000000000
--- a/common/changes/office-ui-fabric-react/betrue-darkenSectionDivider_contextualMenu_2018-01-19-19-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "updated divider color to be more visible",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "betrue@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/brwatt-measured-context_2018-01-13-22-47.json b/common/changes/office-ui-fabric-react/brwatt-measured-context_2018-01-13-22-47.json
deleted file mode 100644
index 565633f61ac4f..0000000000000
--- a/common/changes/office-ui-fabric-react/brwatt-measured-context_2018-01-13-22-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add a context value under ResizeGroup to allow child components to detect whether they are being used only for measurement.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "brwatt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/magellan-fix_hovercard_2017-12-22-19-38.json b/common/changes/office-ui-fabric-react/magellan-fix_hovercard_2017-12-22-19-38.json
deleted file mode 100644
index 29e1909fcfee5..0000000000000
--- a/common/changes/office-ui-fabric-react/magellan-fix_hovercard_2017-12-22-19-38.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Hovercard: Changed content keydown listener to element event binding",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/message-bar-polish_2018-01-11-17-44.json b/common/changes/office-ui-fabric-react/message-bar-polish_2018-01-11-17-44.json
deleted file mode 100644
index 10e3e9259660f..0000000000000
--- a/common/changes/office-ui-fabric-react/message-bar-polish_2018-01-11-17-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "MessageBar: scss refactor and component polish.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/message-bar_2018-01-19-21-14.json b/common/changes/office-ui-fabric-react/message-bar_2018-01-19-21-14.json
deleted file mode 100644
index 33bbbaca487ee..0000000000000
--- a/common/changes/office-ui-fabric-react/message-bar_2018-01-19-21-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "MessageBar: New prop to allow singleline text with no action buttons to be truncated.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index f98ada02a7646..7dd97650925ab 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "5.2.1",
+      "tag": "@uifabric/example-app-base_v5.2.1",
+      "date": "Mon, 22 Jan 2018 11:14:27 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "d94d83e908c3deed8de6a05063f18f857c95ea12",
+            "comment": "Updated theme override colors for MessageBar."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.15.2 <6.0.0` to `>=5.15.3 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.6.1 <6.0.0` to `>=5.7.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.2.0",
       "tag": "@uifabric/example-app-base_v5.2.0",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index 694af417dbac1..5d7c957178263 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Sat, 16 Dec 2017 05:07:22 GMT and should not be manually modified.
+This log was last generated on Mon, 22 Jan 2018 11:14:27 GMT and should not be manually modified.
+
+## 5.2.1
+Mon, 22 Jan 2018 11:14:27 GMT
+
+### Patches
+
+- Updated theme override colors for MessageBar.
 
 ## 5.2.0
 Sat, 16 Dec 2017 05:07:22 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 4d35674aba9dc..816975d84e580 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "5.2.0",
+  "version": "5.2.1",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -32,8 +32,8 @@
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.15.2 <6.0.0",
-    "@uifabric/utilities": ">=5.6.1 <6.0.0",
+    "@uifabric/styling": ">=5.15.3 <6.0.0",
+    "@uifabric/utilities": ">=5.7.0 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index b84ea9a188fcd..fa60473a7c8e9 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,35 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.14.0",
+      "tag": "@uifabric/experiments_v5.14.0",
+      "date": "Mon, 22 Jan 2018 11:14:27 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "staylo8 <33881401+staylo8@users.noreply.github.com>",
+            "commit": "60225fba2411d965163b74eae9d61046013115b1",
+            "comment": "Add callbacks for onDataReduced and onDataGrown"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "2f247fff85ffd515c41b20aacc771f1269657713",
+            "comment": "Minor visual alignment for FolderCover text"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.40.1 <6.0.0` to `>=5.41.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=5.2.0 <6.0.0` to `>=5.2.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.13.0",
       "tag": "@uifabric/experiments_v5.13.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 7169b39061be3..f4aa722211f8f 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Fri, 12 Jan 2018 20:03:21 GMT and should not be manually modified.
+This log was last generated on Mon, 22 Jan 2018 11:14:27 GMT and should not be manually modified.
+
+## 5.14.0
+Mon, 22 Jan 2018 11:14:27 GMT
+
+### Minor changes
+
+- Add callbacks for onDataReduced and onDataGrown
+
+### Patches
+
+- Minor visual alignment for FolderCover text
 
 ## 5.13.0
 Fri, 12 Jan 2018 20:03:21 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index f306d2dea3d0d..d622ddde69740 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.13.0",
+  "version": "5.14.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/enzyme": "3.1.5",
     "@types/enzyme-adapter-react-16": "1.0.1",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=5.2.0 <6.0.0",
+    "@uifabric/example-app-base": ">=5.2.1 <6.0.0",
     "@uifabric/file-type-icons": ">=0.3.0 <1.0.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.1.0 <6.0.0",
     "es6-weak-map": "^2.0.2",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.40.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.41.0 <6.0.0",
     "@uifabric/icons": ">=5.4.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/file-type-icons/package.json b/packages/file-type-icons/package.json
index 7c3d96d5a56c4..ec6064302b44d 100644
--- a/packages/file-type-icons/package.json
+++ b/packages/file-type-icons/package.json
@@ -26,7 +26,7 @@
     "react-dom": "^16.2.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.15.2 <6.0.0",
+    "@uifabric/styling": ">=5.15.3 <6.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/icons/package.json b/packages/icons/package.json
index af872ccf49507..b54c87702bfa5 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -22,7 +22,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.15.2 <6.0.0",
+    "@uifabric/styling": ">=5.15.3 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index d5bc5ebc7064d..0cd435eb0133d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,58 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.41.0",
+      "tag": "office-ui-fabric-react_v5.41.0",
+      "date": "Mon, 22 Jan 2018 11:14:27 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jordan Janzen <jordancjanzen@gmail.com>",
+            "commit": "fd2206f8041ba6aca3b61a67a8552652e67d4954",
+            "comment": "Address issue #1535 - Calendar: Change clickable spans to buttons."
+          },
+          {
+            "author": "Ben Truelove <betrue@microsoft.com>",
+            "commit": "f8dfda114728bf4cd800f8cc69b9ad6a826ba94f",
+            "comment": "updated divider color to be more visible"
+          },
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "8b2e9c33ba8128e11809bf3f0111d43933457e0c",
+            "comment": "Hovercard: Changed content keydown listener to element event binding"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "d94d83e908c3deed8de6a05063f18f857c95ea12",
+            "comment": "MessageBar: scss refactor and component polish."
+          }
+        ],
+        "minor": [
+          {
+            "author": "Bryan Watts <brwatt@microsoft.com>",
+            "commit": "3918313795cd6f12b7405aa94b559e68c7d71652",
+            "comment": "Add a context value under ResizeGroup to allow child components to detect whether they are being used only for measurement."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "f3811054f54bdc22b2ee2bcbe9b277faf889b9f5",
+            "comment": "MessageBar: New prop to allow singleline text with no action buttons to be truncated."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.15.2 <6.0.0` to `>=5.15.3 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.6.1 <6.0.0` to `>=5.7.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=5.2.0 <6.0.0` to `>=5.2.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.40.2",
       "tag": "office-ui-fabric-react_v5.40.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 6a62b8dec0bcd..dc654e8df177a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,21 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 19 Jan 2018 11:14:03 GMT and should not be manually modified.
+This log was last generated on Mon, 22 Jan 2018 11:14:27 GMT and should not be manually modified.
+
+## 5.41.0
+Mon, 22 Jan 2018 11:14:27 GMT
+
+### Minor changes
+
+- Add a context value under ResizeGroup to allow child components to detect whether they are being used only for measurement.
+- MessageBar: New prop to allow singleline text with no action buttons to be truncated.
+
+### Patches
+
+- Address issue #1535 - Calendar: Change clickable spans to buttons.
+- updated divider color to be more visible
+- Hovercard: Changed content keydown listener to element event binding
+- MessageBar: scss refactor and component polish.
 
 ## 5.40.2
 Fri, 19 Jan 2018 11:14:03 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index d0f546254e187..6d6f3e494faaf 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.40.2",
+  "version": "5.41.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.1.0 <6.0.0",
-    "@uifabric/example-app-base": ">=5.2.0 <6.0.0",
+    "@uifabric/example-app-base": ">=5.2.1 <6.0.0",
     "enzyme": "^3.2.0",
     "enzyme-adapter-react-16": "^1.1.0",
     "es6-promise": "^4.1.0",
@@ -49,8 +49,8 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/icons": ">=5.4.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.10.1 <6.0.0",
-    "@uifabric/styling": ">=5.15.2 <6.0.0",
-    "@uifabric/utilities": ">=5.6.1 <6.0.0",
+    "@uifabric/styling": ">=5.15.3 <6.0.0",
+    "@uifabric/utilities": ">=5.7.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 37eb24e7a232c..abfacbd525ec0 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.15.3",
+      "tag": "@uifabric/styling_v5.15.3",
+      "date": "Mon, 22 Jan 2018 11:14:27 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Ben Truelove <betrue@microsoft.com>",
+            "commit": "f8dfda114728bf4cd800f8cc69b9ad6a826ba94f",
+            "comment": "updated divider color to neutralTertiaryAlt"
+          },
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "04bf3df995b81d6bc60a3ec21c5497208ce0affa",
+            "comment": "Theming: fix listText semantic slot"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.6.1 <6.0.0` to `>=5.7.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.15.2",
       "tag": "@uifabric/styling_v5.15.2",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index e8b5e6927ff19..2d0fd379b5d42 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 19 Jan 2018 11:14:02 GMT and should not be manually modified.
+This log was last generated on Mon, 22 Jan 2018 11:14:27 GMT and should not be manually modified.
+
+## 5.15.3
+Mon, 22 Jan 2018 11:14:27 GMT
+
+### Patches
+
+- updated divider color to neutralTertiaryAlt
+- Theming: fix listText semantic slot
 
 ## 5.15.2
 Fri, 19 Jan 2018 11:14:02 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 9d313d7935590..4d1fd88969932 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.15.2",
+  "version": "5.15.3",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "repository": {
     "type": "git",
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.6.1 <6.0.0",
+    "@uifabric/utilities": ">=5.7.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.10.1 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 16547202f35e4..0611296da4e0e 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.7.0",
+      "tag": "@uifabric/utilities_v5.7.0",
+      "date": "Mon, 22 Jan 2018 11:14:27 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Bryan Watts <brwatt@microsoft.com>",
+            "commit": "3918313795cd6f12b7405aa94b559e68c7d71652",
+            "comment": "Adding a helper component to inject context values"
+          }
+        ]
+      }
+    },
     {
       "version": "5.6.1",
       "tag": "@uifabric/utilities_v5.6.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 8db185ba911dd..0aa317be7ed66 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Tue, 19 Dec 2017 11:22:47 GMT and should not be manually modified.
+This log was last generated on Mon, 22 Jan 2018 11:14:27 GMT and should not be manually modified.
+
+## 5.7.0
+Mon, 22 Jan 2018 11:14:27 GMT
+
+### Minor changes
+
+- Adding a helper component to inject context values
 
 ## 5.6.1
 Tue, 19 Dec 2017 11:22:47 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index c5421e9818a34..5c83c55ac0803 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.6.1",
+  "version": "5.7.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From a541f4ea72c22da9b5b5ae46e896f99f2d97d3e6 Mon Sep 17 00:00:00 2001
From: MirandaGe <lingge@microsoft.com>
Date: Mon, 22 Jan 2018 08:10:07 -0800
Subject: [PATCH 1244/1641] [hover card] fix bug for quickly enter/leave card
 cannot dismiss card correctly (#3606)

* fix card dismiss issue for hover card

* add rush change file
---
 ...ard-open-and-dismiss_2017-12-20-08-33.json | 11 ++++++
 .../src/components/HoverCard/HoverCard.tsx    | 38 ++++++++++++-------
 2 files changed, 35 insertions(+), 14 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/lingge-hover-card-open-and-dismiss_2017-12-20-08-33.json

diff --git a/common/changes/office-ui-fabric-react/lingge-hover-card-open-and-dismiss_2017-12-20-08-33.json b/common/changes/office-ui-fabric-react/lingge-hover-card-open-and-dismiss_2017-12-20-08-33.json
new file mode 100644
index 0000000000000..05e44b6bfb41c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/lingge-hover-card-open-and-dismiss_2017-12-20-08-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "fix hover card dismiss issue",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lingge@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
index 73e1c40e5b316..463ddd1806dcc 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
@@ -74,9 +74,9 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
     }
   }
 
-  public componentWillUpdate(newProps: IHoverCardProps, newState: IHoverCardState) {
-    if (newState.isHoverCardVisible !== this.state.isHoverCardVisible) {
-      if (newState.isHoverCardVisible) {
+  public componentDidUpdate(prevProps: IHoverCardProps, prevState: IHoverCardState) {
+    if (prevState.isHoverCardVisible !== this.state.isHoverCardVisible) {
+      if (this.state.isHoverCardVisible) {
         this._async.setTimeout(() => {
           this.setState({
             mode: ExpandingCardMode.expanded
@@ -162,14 +162,17 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
 
   @autobind
   private _executeCardOpen(ev: MouseEvent) {
+    this._async.clearTimeout(this._openTimerId);
     this._openTimerId = this._async.setTimeout(() => {
-      if (!this.state.isHoverCardVisible) {
-        this.setState({
-          isHoverCardVisible: true,
-          mode: ExpandingCardMode.compact,
-          openMode: ev.type === 'keydown' ? OpenCardMode.hotKey : OpenCardMode.hover
-        });
-      }
+      this.setState((prevState: IHoverCardState) => {
+        if (!prevState.isHoverCardVisible) {
+          return ({
+            isHoverCardVisible: true,
+            mode: ExpandingCardMode.compact,
+            openMode: ev.type === 'keydown' ? OpenCardMode.hotKey : OpenCardMode.hover
+          });
+        }
+      });
     }, this.props.cardOpenDelay!);
   }
 
@@ -179,7 +182,6 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
     if (ev.type === 'keydown' && (ev.which !== KeyCodes.escape)) {
       return;
     }
-    this._async.clearTimeout(this._openTimerId);
 
     // Dismiss if not sticky and currentTarget is the same element that mouse last entered
     if (!this.props.sticky && (this._currentMouseTarget === ev.currentTarget || (ev.which === KeyCodes.escape))) {
@@ -189,6 +191,8 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
 
   @autobind
   private _executeCardDimiss() {
+    this._async.clearTimeout(this._openTimerId);
+    this._async.clearTimeout(this._dismissTimerId);
     this._dismissTimerId = this._async.setTimeout(() => {
       this.setState({
         isHoverCardVisible: false,
@@ -201,9 +205,15 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
   // Instant Open the card in Expanded mode
   @autobind
   private _instantOpenExpanded(ev: React.MouseEvent<HTMLDivElement>) {
-    this.setState({
-      isHoverCardVisible: true,
-      mode: ExpandingCardMode.expanded
+    this._async.clearTimeout(this._dismissTimerId);
+
+    this.setState((prevState: IHoverCardState) => {
+      if (!prevState.isHoverCardVisible) {
+        return ({
+          isHoverCardVisible: true,
+          mode: ExpandingCardMode.expanded
+        });
+      }
     });
   }
 }

From 8fcd40a85b53d1cb43ed444e102a0bdf9975281c Mon Sep 17 00:00:00 2001
From: Jakob Werner <jaxxx_w@yahoo.com>
Date: Mon, 22 Jan 2018 19:16:54 +0100
Subject: [PATCH 1245/1641] [FocusTrapZone]: Fix text selection within
 FocusTrapZone (#3759)

* Enabling back text selection inside focusTrapZone

* Changefile
---
 .../focusTrapZone_2018-01-22-17-58.json               | 11 +++++++++++
 .../src/components/FocusTrapZone/FocusTrapZone.tsx    |  9 ---------
 2 files changed, 11 insertions(+), 9 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/focusTrapZone_2018-01-22-17-58.json

diff --git a/common/changes/office-ui-fabric-react/focusTrapZone_2018-01-22-17-58.json b/common/changes/office-ui-fabric-react/focusTrapZone_2018-01-22-17-58.json
new file mode 100644
index 0000000000000..aa1df030e656f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/focusTrapZone_2018-01-22-17-58.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "[FocusTrapZone] Text selection inside FocusTrapZone was broken. This brings it back",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jawerne@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
index a757b7be7b30c..7e8bdecd69ecc 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
@@ -94,8 +94,6 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
         ref='root'
         aria-labelledby={ ariaLabelledBy }
         onKeyDown={ this._onKeyboardHandler }
-        tabIndex={ -1 }
-        onFocus={ this._onRootFocus }
       >
         { this.props.children }
       </div>
@@ -124,13 +122,6 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
     }
   }
 
-  @autobind
-  private _onRootFocus(ev: React.FocusEvent<HTMLElement>) {
-    if (ev.target === this.refs.root) {
-      this.focus();
-    }
-  }
-
   @autobind
   private _onKeyboardHandler(ev: React.KeyboardEvent<HTMLElement>) {
     if (ev.which !== KeyCodes.tab) {

From f7899b22893cc6b4aadd3f85696fb156bc9f7867 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 22 Jan 2018 10:39:02 -0800
Subject: [PATCH 1246/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../focusTrapZone_2018-01-22-17-58.json       | 11 -----------
 ...ard-open-and-dismiss_2017-12-20-08-33.json | 11 -----------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 11 files changed, 35 insertions(+), 30 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/focusTrapZone_2018-01-22-17-58.json
 delete mode 100644 common/changes/office-ui-fabric-react/lingge-hover-card-open-and-dismiss_2017-12-20-08-33.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 3863940b50ed2..5e8544a658e3a 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.41.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.41.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 5af016b1b2d46..bda16017caa32 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.41.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.41.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 681693497a1b4..a54997ee94af8 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.41.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.41.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 275d1e653f1bd..f59a670c1e0db 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.41.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.41.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 07e9a4adfd4ff..7e4b1c4fe303c 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.41.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.41.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/office-ui-fabric-react/focusTrapZone_2018-01-22-17-58.json b/common/changes/office-ui-fabric-react/focusTrapZone_2018-01-22-17-58.json
deleted file mode 100644
index aa1df030e656f..0000000000000
--- a/common/changes/office-ui-fabric-react/focusTrapZone_2018-01-22-17-58.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "[FocusTrapZone] Text selection inside FocusTrapZone was broken. This brings it back",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jawerne@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/lingge-hover-card-open-and-dismiss_2017-12-20-08-33.json b/common/changes/office-ui-fabric-react/lingge-hover-card-open-and-dismiss_2017-12-20-08-33.json
deleted file mode 100644
index 05e44b6bfb41c..0000000000000
--- a/common/changes/office-ui-fabric-react/lingge-hover-card-open-and-dismiss_2017-12-20-08-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "fix hover card dismiss issue",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lingge@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index d622ddde69740..4a4117815a985 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.41.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.41.1 <6.0.0",
     "@uifabric/icons": ">=5.4.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 0cd435eb0133d..48d648f1ecf91 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.41.1",
+      "tag": "office-ui-fabric-react_v5.41.1",
+      "date": "Mon, 22 Jan 2018 18:39:02 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jakob Werner <jaxxx_w@yahoo.com>",
+            "commit": "8fcd40a85b53d1cb43ed444e102a0bdf9975281c",
+            "comment": "[FocusTrapZone] Text selection inside FocusTrapZone was broken. This brings it back"
+          },
+          {
+            "author": "MirandaGe <lingge@microsoft.com>",
+            "commit": "a541f4ea72c22da9b5b5ae46e896f99f2d97d3e6",
+            "comment": "fix hover card dismiss issue"
+          }
+        ]
+      }
+    },
     {
       "version": "5.41.0",
       "tag": "office-ui-fabric-react_v5.41.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index dc654e8df177a..c264f741ea527 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 22 Jan 2018 11:14:27 GMT and should not be manually modified.
+This log was last generated on Mon, 22 Jan 2018 18:39:02 GMT and should not be manually modified.
+
+## 5.41.1
+Mon, 22 Jan 2018 18:39:02 GMT
+
+### Patches
+
+- [FocusTrapZone] Text selection inside FocusTrapZone was broken. This brings it back
+- fix hover card dismiss issue
 
 ## 5.41.0
 Mon, 22 Jan 2018 11:14:27 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 6d6f3e494faaf..512370a5d32aa 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.41.0",
+  "version": "5.41.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From e49507cddc72a273449a01aa56d9496787134427 Mon Sep 17 00:00:00 2001
From: Sohan Fernando <ohritz@users.noreply.github.com>
Date: Mon, 22 Jan 2018 23:30:51 +0100
Subject: [PATCH 1247/1641] Fix basePicker createGenericItem handling. (#3519)

* adding typings signatures in _onValidateInput()

(cherry picked from commit 6e64defb6aa443f89c984ea17250833947d78bf9)

* updated convertSuggestionsToSuggestionItems to handle both ISuggestionModel<T> and T

(cherry picked from commit 9a8dd46d0e8d7242939ffaf2c8359eae61de221c)

* added change file

(cherry picked from commit 2abe50828d472f03d8d4bca8a05c56e382198e4d)

* updated changes file to correct comment and email

* first fix of accidental formatting to better show actual changes

* added bind to SuggestionsController's private methods

* formatting.1 of basePicker

* formatting.2 of basePicker

* formatting.3 of basePicker

* formatting.4 of basePicker

* changed to use autobind in Suggestions Controller

* removed unnecessary inline typing of inferable type.

* removed unnecessary parens.
---
 ...xPickerCreateGeneric_2017-12-05-00-00.json | 12 +++++++
 .../src/components/pickers/BasePicker.tsx     |  6 ++--
 .../Suggestions/SuggestionsController.ts      | 34 ++++++++++++++++---
 3 files changed, 44 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fixPickerCreateGeneric_2017-12-05-00-00.json

diff --git a/common/changes/office-ui-fabric-react/fixPickerCreateGeneric_2017-12-05-00-00.json b/common/changes/office-ui-fabric-react/fixPickerCreateGeneric_2017-12-05-00-00.json
new file mode 100644
index 0000000000000..33bcc6ba1b691
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fixPickerCreateGeneric_2017-12-05-00-00.json
@@ -0,0 +1,12 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment":
+        "Fixed SuggestionsController method convertSuggestionsToSuggestionItems to handle BasePicker createGenericItem correctly",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "sohan@graceful.nu"
+}
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 457208f2d0f1f..d977bbb96484f 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -11,7 +11,7 @@ import { Callout, DirectionalHint } from '../../Callout';
 import { Selection, SelectionZone, SelectionMode } from '../../utilities/selection/index';
 import { Suggestions } from './Suggestions/Suggestions';
 import { ISuggestionsProps } from './Suggestions/Suggestions.types';
-import { SuggestionsController } from './Suggestions/SuggestionsController';
+import { SuggestionsController, ISuggestionModel } from './Suggestions/SuggestionsController';
 import { IBasePicker, IBasePickerProps, ValidationState } from './BasePicker.types';
 import { BaseAutoFill } from './AutoFill/BaseAutoFill';
 import { IPickerItemProps } from './PickerItem.types';
@@ -634,7 +634,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   /**
    * Controls what happens whenever there is an action that impacts the selected items.
    * If selectedItems is provided as a property then this will act as a controlled component and it will not update it's own state.
-  */
+   */
   private _updateSelectedItems(items: T[], focusIndex?: number) {
     if (this.props.selectedItems) {
       // If the component is a controlled component then the controlling component will need
@@ -653,7 +653,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   private _onValidateInput() {
     if (this.props.onValidateInput && (this.props.onValidateInput as any)(this.input.value) !== ValidationState.invalid && this.props.createGenericItem) {
-      let itemToConvert = (this.props.createGenericItem as any)(this.input.value, (this.props.onValidateInput as any)(this.input.value));
+      let itemToConvert = this.props.createGenericItem(this.input.value, this.props.onValidateInput(this.input.value));
       this.suggestionStore.createGenericSuggestion(itemToConvert);
       this.completeSuggestion();
     }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
index 0379e9b041fb1..d6f1ddae8ddaf 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
@@ -1,3 +1,5 @@
+import { autobind } from '../../../Utilities';
+
 export interface ISuggestionModel<T> {
   item: T;
   selected: boolean;
@@ -88,10 +90,10 @@ export class SuggestionsController<T> {
     this.currentSuggestion = itemToAdd;
   }
 
-  public convertSuggestionsToSuggestionItems(suggestions: any[]): ISuggestionModel<T>[] {
-    let converted: ISuggestionModel<T>[] = [];
-    suggestions.forEach((suggestion: any) => converted.push({ item: suggestion, selected: false, ariaLabel: suggestion.name || suggestion.primaryText }));
-    return converted;
+  public convertSuggestionsToSuggestionItems(suggestions: Array<ISuggestionModel<T> | T>): ISuggestionModel<T>[] {
+    return Array.isArray(suggestions)
+      ? suggestions.map(this._ensureSuggestionModel)
+      : [];
   }
 
   public deselectAllSuggestions(): void {
@@ -114,4 +116,26 @@ export class SuggestionsController<T> {
       this.currentSuggestion = this.suggestions[index];
     }
   }
-}
\ No newline at end of file
+
+  @autobind
+  private _isSuggestionModel(
+    value: ISuggestionModel<T> | T
+    ): value is ISuggestionModel<T> {
+    return (<ISuggestionModel<T>>value).item !== undefined;
+  }
+
+  @autobind
+  private _ensureSuggestionModel(
+    suggestion: ISuggestionModel<T> | T
+    ): ISuggestionModel<T> {
+    if (this._isSuggestionModel(suggestion)) {
+      return suggestion as ISuggestionModel<T>;
+    } else {
+      return {
+        item: suggestion,
+        selected: false,
+        ariaLabel: (<any>suggestion).name || (<any>suggestion).primaryText
+      } as ISuggestionModel<T>;
+    }
+  }
+}

From 7e9f89aa3ff96289f688d2e3782f1e8dfd516957 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 23 Jan 2018 11:22:12 +0000
Subject: [PATCH 1248/1641] Applying package updates.

---
 apps/fabric-website/package.json                   |  2 +-
 apps/ssr-tests/package.json                        |  2 +-
 apps/test-bundle-button/package.json               |  2 +-
 apps/todo-app/package.json                         |  2 +-
 apps/vr-tests/package.json                         |  2 +-
 .../fixPickerCreateGeneric_2017-12-05-00-00.json   | 12 ------------
 packages/experiments/package.json                  |  2 +-
 packages/office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md       |  9 ++++++++-
 packages/office-ui-fabric-react/package.json       |  2 +-
 10 files changed, 29 insertions(+), 20 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/fixPickerCreateGeneric_2017-12-05-00-00.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 5e8544a658e3a..a30e09b86a92d 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.41.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.41.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index bda16017caa32..d579180679c71 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.41.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.41.2 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index a54997ee94af8..c9ba51ad34352 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.41.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.41.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index f59a670c1e0db..ef722fe4de8a5 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.41.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.41.2 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 7e4b1c4fe303c..61e1f69420d85 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.41.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.41.2 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/office-ui-fabric-react/fixPickerCreateGeneric_2017-12-05-00-00.json b/common/changes/office-ui-fabric-react/fixPickerCreateGeneric_2017-12-05-00-00.json
deleted file mode 100644
index 33bcc6ba1b691..0000000000000
--- a/common/changes/office-ui-fabric-react/fixPickerCreateGeneric_2017-12-05-00-00.json
+++ /dev/null
@@ -1,12 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment":
-        "Fixed SuggestionsController method convertSuggestionsToSuggestionItems to handle BasePicker createGenericItem correctly",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "sohan@graceful.nu"
-}
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 4a4117815a985..b786403b901df 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.41.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.41.2 <6.0.0",
     "@uifabric/icons": ">=5.4.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 48d648f1ecf91..86557e72159be 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.41.2",
+      "tag": "office-ui-fabric-react_v5.41.2",
+      "date": "Tue, 23 Jan 2018 11:22:12 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Sohan Fernando <ohritz@users.noreply.github.com>",
+            "commit": "e49507cddc72a273449a01aa56d9496787134427",
+            "comment": "Fixed SuggestionsController method convertSuggestionsToSuggestionItems to handle BasePicker createGenericItem correctly"
+          }
+        ]
+      }
+    },
     {
       "version": "5.41.1",
       "tag": "office-ui-fabric-react_v5.41.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index c264f741ea527..e35c02702294a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 22 Jan 2018 18:39:02 GMT and should not be manually modified.
+This log was last generated on Tue, 23 Jan 2018 11:22:12 GMT and should not be manually modified.
+
+## 5.41.2
+Tue, 23 Jan 2018 11:22:12 GMT
+
+### Patches
+
+- Fixed SuggestionsController method convertSuggestionsToSuggestionItems to handle BasePicker createGenericItem correctly
 
 ## 5.41.1
 Mon, 22 Jan 2018 18:39:02 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 512370a5d32aa..9f2e3c1ed75ad 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.41.1",
+  "version": "5.41.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From b31132497466cd88b1887badfef8c05833e35784 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 23 Jan 2018 09:27:51 -0800
Subject: [PATCH 1249/1641] TextField & SearchBox: Specified placeholder colors
 (#3762)

* Searchbox and textfield neutral secondary placeholder text

* Using the palette

* Added change file

* New slot for inputPlaceholderText

* Semantic slots in styles

* style change file

* Minor bump

* Searchbox snapshot update
---
 .../styling/placeholder-colors_2018-01-23-16-44.json  | 11 +++++++++++
 .../placeholder-colors_2018-01-22-23-51.json          | 11 +++++++++++
 .../src/common/_semanticSlots.scss                    |  1 +
 .../src/components/SearchBox/SearchBox.styles.tsx     |  9 ++++++++-
 .../SearchBox/__snapshots__/SearchBox.test.tsx.snap   |  7 +++++++
 .../src/components/TextField/TextField.scss           |  7 +++++++
 packages/styling/src/interfaces/ISemanticColors.ts    |  5 +++++
 packages/styling/src/styles/theme.ts                  |  1 +
 8 files changed, 51 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/styling/placeholder-colors_2018-01-23-16-44.json
 create mode 100644 common/changes/office-ui-fabric-react/placeholder-colors_2018-01-22-23-51.json

diff --git a/common/changes/@uifabric/styling/placeholder-colors_2018-01-23-16-44.json b/common/changes/@uifabric/styling/placeholder-colors_2018-01-23-16-44.json
new file mode 100644
index 0000000000000..23fcf650681e1
--- /dev/null
+++ b/common/changes/@uifabric/styling/placeholder-colors_2018-01-23-16-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "New slot for inputPlaceholderText color.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/placeholder-colors_2018-01-22-23-51.json b/common/changes/office-ui-fabric-react/placeholder-colors_2018-01-22-23-51.json
new file mode 100644
index 0000000000000..1919b464e0a2a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/placeholder-colors_2018-01-22-23-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "TextField and SearchBox: Specified placeholder text color to be more consistent across browsers.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/common/_semanticSlots.scss b/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
index e3cbc93bd375d..cd4c3729fdedd 100644
--- a/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
+++ b/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
@@ -27,6 +27,7 @@ $inputBackgroundCheckedHoveredColor: "[theme:inputBackgroundCheckedHovered, defa
 $inputForegroundCheckedColor: "[theme:inputForegroundChecked, default: #ffffff]";
 $inputFocusBorderAltColor: "[theme:inputFocusBorderAlt, default: #0078d7]";
 $smallInputBorderColor: "[theme:inputBorder, default: #666666]";
+$inputPlaceholderTextColor: "[theme:inputPlaceholderText, default: #666666]";
 
 /* Buttons */
 $buttonBackgroundColor: "[theme:buttonBackground, default: #f4f4f4]";
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx
index 736de420cc1e7..db3009f493177 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx
@@ -11,7 +11,7 @@ import { ISearchBoxProps, ISearchBoxStyleProps, ISearchBoxStyles } from './Searc
 
 export function getStyles(props: ISearchBoxStyleProps): ISearchBoxStyles {
   const { theme, underlined, disabled, hasFocus, className, hasInput } = props;
-  const { palette, fonts } = theme;
+  const { palette, fonts, semanticColors } = theme;
 
   return {
     root: [
@@ -142,6 +142,13 @@ export function getStyles(props: ISearchBoxStyleProps): ISearchBoxStyles {
         selectors: {
           '::-ms-clear': {
             display: 'none'
+          },
+          '::placeholder': {
+            color: semanticColors.inputPlaceholderText,
+            opacity: 1
+          },
+          ':-ms-input-placeholder': {
+            color: semanticColors.inputPlaceholderText
           }
         }
       },
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
index d0e21b9e6842a..e7791cbce3b14 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
@@ -97,6 +97,13 @@ exports[`SearchBox renders SearchBox correctly 1`] = `
         &::-ms-clear {
           display: none;
         }
+        &::placeholder {
+          color: #666666;
+          opacity: 1;
+        }
+        &:-ms-input-placeholder {
+          color: #666666;
+        }
     disabled={undefined}
     id="SearchBox0"
     onChange={[Function]}
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index e781d5b95cf6c..d432be085046f 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -1,4 +1,5 @@
 @import '../../common/common';
+@import '../../common/semanticSlots';
 
 // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
 
@@ -73,6 +74,12 @@ $field-error-color: $errorTextColor;
   &::-ms-clear {
     display: none;
   }
+
+  ::placeholder,
+  :-ms-input-placeholder {
+    color: $inputPlaceholderTextColor;
+    opacity: 1;
+  }
 }
 
 //= State: A disabled textfield
diff --git a/packages/styling/src/interfaces/ISemanticColors.ts b/packages/styling/src/interfaces/ISemanticColors.ts
index db2cb0750c34a..257f5f31513de 100644
--- a/packages/styling/src/interfaces/ISemanticColors.ts
+++ b/packages/styling/src/interfaces/ISemanticColors.ts
@@ -169,6 +169,11 @@ export interface ISemanticColors {
    */
   inputFocusBorderAlt: string;
 
+  /**
+   * The color of placeholder text.
+   */
+  inputPlaceholderText: string;
+
   //// Buttons
 
   /**
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index 49ac93594b35e..ae34f0f6f1d8d 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -147,6 +147,7 @@ function _makeSemanticColorsFromPalette(p: IPalette, isInverted: boolean): ISema
     inputForegroundChecked: p.white,
     inputFocusBorderAlt: p.themePrimary,
     smallInputBorder: p.neutralSecondary,
+    inputPlaceholderText: p.neutralSecondary,
 
     buttonBackground: p.neutralLighter,
     buttonBackgroundChecked: p.neutralTertiaryAlt,

From f2dcf91ae4e484ce483b52c35b012c90d28fd89e Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 23 Jan 2018 10:51:11 -0800
Subject: [PATCH 1250/1641] Dropdown: Align error message style to TextField
 and ComboBox (#3760)

* Removed astrisk and aligning font to text field

* Better error border states

* New Error example and example scss clean up

* Added change file

* Text field focused and invalid border fix

* Better ComboBox error message borders

* Update dropdown-errormessage_2018-01-22-18-50.json
---
 ...ropdown-errormessage_2018-01-22-18-50.json | 11 ++++++
 .../ComboBox/ComboBox.classNames.ts           | 11 +++---
 .../src/components/Dropdown/Dropdown.scss     | 23 ++++++++----
 .../src/components/Dropdown/DropdownPage.tsx  | 19 ++++++++--
 .../examples/Dropdown.Basic.Example.scss      |  8 ++--
 .../examples/Dropdown.Basic.Example.tsx       |  5 +--
 .../examples/Dropdown.Custom.Example.tsx      |  2 +-
 .../examples/Dropdown.Error.Example.tsx       | 37 +++++++++++++++++++
 .../src/components/TextField/TextField.scss   |  6 +++
 9 files changed, 97 insertions(+), 25 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/dropdown-errormessage_2018-01-22-18-50.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Error.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/dropdown-errormessage_2018-01-22-18-50.json b/common/changes/office-ui-fabric-react/dropdown-errormessage_2018-01-22-18-50.json
new file mode 100644
index 0000000000000..9335122b59613
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/dropdown-errormessage_2018-01-22-18-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: Align error message styling to TextField. TextField & ComboBox: Updated invalid input border color to be red in all states.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
index 85d47f0690e73..d3ecea6951f8e 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.classNames.ts
@@ -44,17 +44,16 @@ export const getClassNames = memoizeFunction((
     ),
     root: mergeStyles(
       'ms-ComboBox',
-      isOpen && 'is-open',
+      hasErrorMessage ? styles.rootError : isOpen && 'is-open',
       required && 'is-required',
       styles.root,
       !allowFreeForm && styles.rootDisallowFreeForm,
-      hasErrorMessage && styles.rootError,
-      !disabled && focused && styles.rootFocused,
+      hasErrorMessage ? styles.rootError : !disabled && focused && styles.rootFocused,
       !disabled && {
         selectors: {
-          ':hover': !isOpen && !focused && styles.rootHovered,
-          ':active': styles.rootPressed,
-          ':focus': styles.rootFocused
+          ':hover': hasErrorMessage ? styles.rootError : !isOpen && !focused && styles.rootHovered,
+          ':active': hasErrorMessage ? styles.rootError : styles.rootPressed,
+          ':focus': hasErrorMessage ? styles.rootError : styles.rootFocused
         }
       },
       disabled && [
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
index 5fd1193a3d6b8..eee0431f42084 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
@@ -54,18 +54,31 @@ $DropDown-item-height: 32px;
     .title {
       border-color: $ms-color-neutralDark;
     }
+    .titleIsError {
+      border-color: $ms-color-error;
+    }
   }
 
   &:active {
     .title {
       border-color: $ms-color-themeDark;
     }
+    .titleIsError {
+      border-color: $ms-color-error;
+    }
   }
 
   &:focus {
     .title {
       border-color: $ms-color-themePrimary;
     }
+    .titleIsError {
+      border-color: $ms-color-error;
+    }
+  }
+
+  .titleIsError {
+    border-color: $ms-color-error;
   }
 
   :global(.ms-Label) {
@@ -135,9 +148,6 @@ $DropDown-item-height: 32px;
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
-  &.titleIsError {
-    border-color: $ms-color-error;
-  }
   &.titleIsPlaceHolder {
     color: $ms-color-neutralSecondary;
   }
@@ -160,10 +170,9 @@ $DropDown-item-height: 32px;
 }
 
 .errorMessage{
-    color: $ms-color-error;
-  &::before {
-    content: '* ';
-  }
+  color: $ms-color-error;
+  @include ms-font-s;
+  padding-top: 5px;
 }
 
 .items {
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
index 2ede3082086e0..0dccfe5466652 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
@@ -7,11 +7,13 @@ import {
 } from '@uifabric/example-app-base';
 import { DropdownBasicExample } from './examples/Dropdown.Basic.Example';
 import { DropdownCustomExample } from './examples/Dropdown.Custom.Example';
+import { DropdownErrorExample } from './examples/Dropdown.Error.Example';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { DropdownStatus } from './Dropdown.checklist';
 
 const DropdownBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx') as string;
 const DropdownCustomExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx') as string;
+const DropdownErrorExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Error.Example.tsx') as string;
 
 export class DropdownPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
@@ -21,14 +23,25 @@ export class DropdownPage extends React.Component<IComponentDemoPageProps, {}> {
         componentName='DropdownExample'
         exampleCards={
           <div>
-            <ExampleCard title='Dropdown' code={ DropdownBasicExampleCode }>
+            <ExampleCard
+              title='Dropdown'
+              code={ DropdownBasicExampleCode }
+            >
               <DropdownBasicExample />
             </ExampleCard>
 
-            <ExampleCard title='Customized Dropdown' code={ DropdownCustomExampleCode }>
+            <ExampleCard
+              title='Customized Dropdown'
+              code={ DropdownCustomExampleCode }
+            >
               <DropdownCustomExample />
             </ExampleCard>
-
+            <ExampleCard
+              title='Dropdown with Error Message'
+              code={ DropdownErrorExampleCode }
+            >
+              <DropdownErrorExample />
+            </ExampleCard>
           </div>
 
         }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss
index 2baa41e4291c7..3270b1ef991e7 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.scss
@@ -1,8 +1,8 @@
 :global {
-  .DropdownBasicExample {
+  .docs-DropdownExample {
     max-width: 300px;
-  }
-  .Dropdown-example {
-    margin-bottom: 10px;
+    .ms-Dropdown-container {
+      margin-bottom: 10px;
+    }
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
index f1bd9871962b7..291d03f3f4bf2 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
@@ -22,9 +22,8 @@ export class DropdownBasicExample extends BaseComponent<{}, {
     let { selectedItem, selectedItems } = this.state;
 
     return (
-      <div className='DropdownBasicExample'>
+      <div className='docs-DropdownExample'>
         <Dropdown
-          className='Dropdown-example'
           placeHolder='Select an Option'
           label='Basic uncontrolled example:'
           id='Basicdrop1'
@@ -55,7 +54,6 @@ export class DropdownBasicExample extends BaseComponent<{}, {
           onClick={ this._onSetFocusButtonClicked }
         />
         <Dropdown
-          className='Dropdown-example'
           label='Disabled uncontrolled example with defaultSelectedKey:'
           defaultSelectedKey='D'
           options={
@@ -75,7 +73,6 @@ export class DropdownBasicExample extends BaseComponent<{}, {
         />
 
         <Dropdown
-          className='Dropdown-example'
           label='Controlled example:'
           selectedKey={ (selectedItem ? selectedItem.key : undefined) }
           onChanged={ this.changeState }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
index 0f1f3f3a3f19d..92c616020ffdd 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Custom.Example.tsx
@@ -15,7 +15,7 @@ export class DropdownCustomExample extends React.Component {
 
   public render() {
     return (
-      <div className='dropdownExample'>
+      <div className='docs-DropdownExample'>
 
         <Dropdown
           placeHolder='Select an Option'
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Error.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Error.Example.tsx
new file mode 100644
index 0000000000000..dcaca7dab6dcf
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Error.Example.tsx
@@ -0,0 +1,37 @@
+import * as React from 'react';
+import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
+import { Dropdown, IDropdown, DropdownMenuItemType, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
+import { autobind, BaseComponent } from '../../../Utilities';
+import './Dropdown.Basic.Example.scss';
+
+export class DropdownErrorExample extends BaseComponent<{}, {}> {
+  private _basicDropdown: IDropdown;
+
+  constructor(props: {}) {
+    super(props);
+  }
+
+  public render() {
+    return (
+      <div className='docs-DropdownExample'>
+        <Dropdown
+          placeHolder='Select an Option'
+          label='Error message example:'
+          id='Errormessagedrop1'
+          ariaLabel='Error message dropdown example'
+          options={
+            [
+              { key: 'A', text: 'Option a' },
+              { key: 'B', text: 'Option b' },
+              { key: 'C', text: 'Option c' },
+              { key: 'D', text: 'Option d' },
+              { key: 'E', text: 'Option e' },
+            ]
+          }
+          componentRef={ this._resolveRef('_basicDropdown') }
+          errorMessage='Error message'
+        />
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index d432be085046f..d140f37a9ff32 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -57,6 +57,12 @@ $field-error-color: $errorTextColor;
     border-color: $field-border-focus-color;
   }
 
+  &.fieldGroupIsFocused {
+    &.invalid {
+      border-color: $field-border-error-color;
+    }
+  }
+
   .rootIsDisabled & {
     background-color: $field-background-disabled-color;
     border-color: $field-border-disabled-color;

From 2a57fb1c2476d8677c4cee76c3ff23958c9ae5bd Mon Sep 17 00:00:00 2001
From: Spencer Lynn <sllynn8907@gmail.com>
Date: Tue, 23 Jan 2018 11:55:14 -0800
Subject: [PATCH 1251/1641] In Panel component, allow user to override all
 focus zone props. (#3568)

* In Panel component, allow user to override all focus zone props.

* Adding change file

* Deprecate props rather than remove them completely.

* Fixing comment.

* If className is passed in focus trap zone props, ensure it is added alongside other class names provided to component.

* Adding warnings about deprecations.
---
 ...nel-focus-zone-props_2017-12-13-06-46.json | 11 ++++++++
 .../src/components/Panel/Panel.tsx            | 15 ++++++++--
 .../src/components/Panel/Panel.types.ts       | 28 +++++++++++++------
 3 files changed, 43 insertions(+), 11 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/panel-focus-zone-props_2017-12-13-06-46.json

diff --git a/common/changes/office-ui-fabric-react/panel-focus-zone-props_2017-12-13-06-46.json b/common/changes/office-ui-fabric-react/panel-focus-zone-props_2017-12-13-06-46.json
new file mode 100644
index 0000000000000..bf0f65910d686
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/panel-focus-zone-props_2017-12-13-06-46.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Enhance Panel component props to allow all of FocusTrapZone props overrides.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "sllynn8907@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
index c6299be4c7b24..d996d0a5b8c4c 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
@@ -42,6 +42,12 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
   constructor(props: IPanelProps) {
     super(props);
 
+    this._warnDeprecations({
+      'ignoreExternalFocusing': 'focusTrapZoneProps',
+      'forceFocusInsideTrap': 'focusTrapZoneProps',
+      'firstFocusableSelector': 'focusTrapZoneProps'
+    });
+
     this.state = {
       isFooterSticky: false,
       isOpen: false,
@@ -73,6 +79,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
       className = '',
       elementToFocusOnDismiss,
       firstFocusableSelector,
+      focusTrapZoneProps,
       forceFocusInsideTrap,
       hasCloseButton,
       headerText,
@@ -151,6 +158,10 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
           >
             { overlay }
             <FocusTrapZone
+              ignoreExternalFocusing={ ignoreExternalFocusing }
+              forceFocusInsideTrap={ forceFocusInsideTrap }
+              firstFocusableSelector={ firstFocusableSelector }
+              { ...focusTrapZoneProps }
               className={
                 css(
                   'ms-Panel-main',
@@ -159,13 +170,11 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
                   isOpen && isAnimating && isOnRightSide && AnimationClassNames.slideLeftIn40,
                   !isOpen && isAnimating && !isOnRightSide && AnimationClassNames.slideLeftOut40,
                   !isOpen && isAnimating && isOnRightSide && AnimationClassNames.slideRightOut40,
+                  focusTrapZoneProps ? focusTrapZoneProps.className : undefined
                 ) }
               style={ customWidthStyles }
               elementToFocusOnDismiss={ elementToFocusOnDismiss }
               isClickableOutsideFocusTrap={ isLightDismiss || isHiddenOnDismiss }
-              ignoreExternalFocusing={ ignoreExternalFocusing }
-              forceFocusInsideTrap={ forceFocusInsideTrap }
-              firstFocusableSelector={ firstFocusableSelector }
             >
               <div className={ css('ms-Panel-commands') } data-is-visible={ true } >
                 { onRenderNavigation(renderProps, this._onRenderNavigation) }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.types.ts b/packages/office-ui-fabric-react/src/components/Panel/Panel.types.ts
index 3feb0fbd5ad72..1e6acd0c9f70f 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.types.ts
@@ -2,6 +2,7 @@ import * as React from 'react';
 import { Panel } from './Panel';
 import { IRenderFunction } from '../../Utilities';
 import { ILayerProps } from '../../Layer';
+import { IFocusTrapZoneProps } from '../../FocusTrapZone';
 
 export interface IPanel {
   /**
@@ -106,22 +107,33 @@ export interface IPanelProps extends React.Props<Panel> {
   elementToFocusOnDismiss?: HTMLElement;
 
   /**
-   * Indicates if this Panel will ignore keeping track of HTMLElement that activated the Zone.
-   * @default false
-   */
+    * Indicates if this Panel will ignore keeping track of HTMLElement that activated the Zone.
+    * Deprecated, use focusTrapZoneProps.
+    * @default false
+    * @deprecated
+    */
   ignoreExternalFocusing?: boolean;
 
   /**
-  * Indicates whether Panel should force focus inside the focus trap zone
-  * @default true
-  */
+   * Indicates whether Panel should force focus inside the focus trap zone
+   * Deprecated, use focusTrapZoneProps.
+   * @default true
+   * @deprecated
+   */
   forceFocusInsideTrap?: boolean;
 
   /**
-  * Indicates the selector for first focusable item
-  */
+   * Indicates the selector for first focusable item.
+   * Deprecated, use focusTrapZoneProps.
+   * @deprecated
+   */
   firstFocusableSelector?: string;
 
+  /**
+   * Optional props to pass to the FocusTrapZone component to manage focus in the panel.
+   */
+  focusTrapZoneProps?: IFocusTrapZoneProps;
+
   /**
    * Optional props to pass to the Layer component hosting the panel.
    */

From 5270872fcdfcbe3dfb5c3592d1bd895bf283414e Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Tue, 23 Jan 2018 12:34:55 -0800
Subject: [PATCH 1252/1641] ResizeGroup: Add the ability for ResizeGroup to
 take divProps (#3775)

* Add divProps to ResizeGroup

* rush change
---
 ...in-AddAraiPropsToResizeGroup_2018-01-23-20-18.json | 11 +++++++++++
 .../src/components/ResizeGroup/ResizeGroup.tsx        |  7 +++++--
 .../examples/ResizeGroup.OverflowSet.Example.tsx      |  2 ++
 3 files changed, 18 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-AddAraiPropsToResizeGroup_2018-01-23-20-18.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-AddAraiPropsToResizeGroup_2018-01-23-20-18.json b/common/changes/office-ui-fabric-react/jspurlin-AddAraiPropsToResizeGroup_2018-01-23-20-18.json
new file mode 100644
index 0000000000000..6c5240e82df68
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-AddAraiPropsToResizeGroup_2018-01-23-20-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ResizeGroup: Add the ability for ResizeGroup to get divProps",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index c48d3f17e5aaa..c8c486a47f3ea 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -1,8 +1,10 @@
 import * as React from 'react';
 import * as PropTypes from 'prop-types';
 import {
+  BaseComponent,
   css,
-  BaseComponent
+  divProperties,
+  getNativeProps
 } from '../../Utilities';
 import { provideContext } from '@uifabric/utilities/lib/Context';
 import { IResizeGroupProps } from './ResizeGroup.types';
@@ -299,9 +301,10 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
   public render() {
     const { onRenderData, className } = this.props;
     const { dataToMeasure, renderedData } = this.state;
+    const divProps = getNativeProps(this.props, divProperties, ['data']);
 
     return (
-      <div className={ css('ms-ResizeGroup', className) } ref={ this._resolveRef('_root') }>
+      <div {...divProps} className={ css('ms-ResizeGroup', className) } ref={ this._resolveRef('_root') }>
         { this._nextResizeGroupStateProvider.shouldRenderDataToMeasureInHiddenDiv(dataToMeasure) && (
           <div className={ css(styles.measured) } ref={ this._resolveRef('_measured') }>
             <MeasuredContext>{ onRenderData(dataToMeasure) }</MeasuredContext>
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
index 8ad5384c16d1e..0888d19501e45 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
@@ -75,6 +75,8 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<{}, IResizeGrou
     return (
       <div className={ short ? styles.resizeIsShort : 'notResized' }>
         <ResizeGroup
+          role='tabpanel'
+          aria-label='Resize Group with an Overflow Set'
           data={ dataToRender }
           onReduceData={ this._onReduceData }
           onGrowData={ onGrowDataEnabled ? this._onGrowData : undefined }

From ee2299a2ea7f5410343a6d50d94fd542c687fc26 Mon Sep 17 00:00:00 2001
From: Srikanth Reddy Kandula <srikanthreddy.iitp@gmail.com>
Date: Wed, 24 Jan 2018 02:31:26 +0530
Subject: [PATCH 1253/1641] DatePicker: Fix datePicker overlap with week
 numbers for RTL (#3772)

* Fix week numbers column overlap with first column of calendar datepicker in RTL mode

* Adding change file
---
 ...rk-CalendarDayRTLFix_2018-01-23-12-33.json | 11 +++++
 .../src/components/Calendar/Calendar.scss     | 42 +++++++++++++++++++
 .../src/components/Calendar/CalendarDay.tsx   |  2 +-
 3 files changed, 54 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/srk-CalendarDayRTLFix_2018-01-23-12-33.json

diff --git a/common/changes/office-ui-fabric-react/srk-CalendarDayRTLFix_2018-01-23-12-33.json b/common/changes/office-ui-fabric-react/srk-CalendarDayRTLFix_2018-01-23-12-33.json
new file mode 100644
index 0000000000000..bd9829d858c34
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/srk-CalendarDayRTLFix_2018-01-23-12-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix CalendarDay RTL view",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "srkandu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
index 0d0d0ddf1aa36..5dea7e3f5b337 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.scss
@@ -223,6 +223,32 @@ $Calendar-dayPicker-margin: 10px;
   }
 }
 
+// week numbers style in right-to-left view
+.showWeekNumbersRTL {
+  .weekNumbers {
+    position: absolute;
+    margin-top: $Calendar-day;
+    border-left: 1px solid $ms-color-neutralLight;
+    box-sizing: border-box;
+    width: 30px;
+    .day {
+      color: $ms-color-neutralSecondary;
+      &.weekIsHighlighted {
+        color: $ms-color-black;
+      }
+    }
+  }
+  .table {
+    &:not(.weekNumbers) {
+      margin-right: 30px;
+    }
+    .day,
+    .weekday {
+      width: 30px;
+    }
+  }
+}
+
 // Month and year previous/next components.
 .monthComponents,
 .yearComponents,
@@ -440,6 +466,22 @@ $Calendar-dayPicker-margin: 10px;
         width: 26px;
       }
     }
+  } // week numbers style in right-to-left view
+  .showWeekNumbersRTL {
+    .weekNumbers {
+      margin-top: $Calendar-day;
+      width: 26px;
+      margin-right: -7px;
+    }
+    .table {
+      &:not(.weekNumbers) {
+        margin-right: 19px;
+      }
+      .day,
+      .weekday {
+        width: 26px;
+      }
+    }
   } // Show month picker, if enabled
   .monthPickerVisible {
     .wrap {
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index 462b38a62fc8d..37cc999b89105 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -123,7 +123,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
       <div
         className={ css('ms-DatePicker-dayPicker',
           styles.dayPicker,
-          showWeekNumbers && 'ms-DatePicker-showWeekNumbers' && styles.showWeekNumbers
+          showWeekNumbers && 'ms-DatePicker-showWeekNumbers' && (getRTL() ? styles.showWeekNumbersRTL : styles.showWeekNumbers)
         ) }
         id={ dayPickerId }
       >

From 09c29d1e2c1d6fc541fb13eacf535fca82f868ba Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Tue, 23 Jan 2018 13:55:24 -0800
Subject: [PATCH 1254/1641] BaseAutoFill: Fix a bug where BaseAutoFill would
 not work with composed languages (#3713)

* enable the base auto fill to work with composed languages like Japanese. Also made some small improvements to structure

* adding change file

* removing unecessary import

* fix lint

* Update BasePicker Snap

* Fixing comments and minor bug in firefox

* Make onchange better and update snaps

* adding in comments

* fixing comments

* small code cleanup
---
 ...utofill-fixime-input_2018-01-12-02-56.json |  11 ++
 .../__snapshots__/ComboBox.test.tsx.snap      |   2 +
 .../pickers/AutoFill/BaseAutoFill.tsx         | 130 +++++++++++++-----
 .../__snapshots__/BasePicker.test.tsx.snap    |   4 +
 4 files changed, 114 insertions(+), 33 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/baseautofill-fixime-input_2018-01-12-02-56.json

diff --git a/common/changes/office-ui-fabric-react/baseautofill-fixime-input_2018-01-12-02-56.json b/common/changes/office-ui-fabric-react/baseautofill-fixime-input_2018-01-12-02-56.json
new file mode 100644
index 0000000000000..33b5d94c697d8
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/baseautofill-fixime-input_2018-01-12-02-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "BaseAutoFill: Fixed a bug where baseautofill would not work with composed languages like Japanese",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
index c3fb997882aee..a9e542b214e9a 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
@@ -106,6 +106,8 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
       onBlur={[Function]}
       onChange={[Function]}
       onClick={[Function]}
+      onCompositionEnd={[Function]}
+      onCompositionStart={[Function]}
       onFocus={[Function]}
       onKeyDown={[Function]}
       onKeyUp={[Function]}
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
index 0448b991c61f9..72e5b83f51a1e 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
@@ -73,9 +73,7 @@ export class BaseAutoFill extends BaseComponent<IBaseAutoFillProps, IBaseAutoFil
       newValue = this.props.updateValueInWillReceiveProps();
     }
 
-    if (this._autoFillEnabled && this._doesTextStartWith(nextProps.suggestedDisplayValue!, newValue ? newValue : this._value)) {
-      newValue = nextProps.suggestedDisplayValue;
-    }
+    newValue = this._getDisplayValue(newValue ? newValue : this._value, nextProps.suggestedDisplayValue);
 
     if (typeof newValue === 'string') {
       this.setState({ displayValue: newValue });
@@ -118,11 +116,13 @@ export class BaseAutoFill extends BaseComponent<IBaseAutoFillProps, IBaseAutoFil
     const nativeProps = getNativeProps(this.props, inputProperties);
     return (
       <input
-        { ...nativeProps}
+        { ...nativeProps }
         ref={ this._resolveRef('_inputElement') }
         value={ displayValue }
         autoCapitalize={ 'off' }
         autoComplete={ 'off' }
+        onCompositionStart={ this._onCompositionStart }
+        onCompositionEnd={ this._onCompositionEnd }
         onChange={ this._onChange }
         onKeyDown={ this._onKeyDown }
         onClick={ this.props.onClick ? this.props.onClick : this._onClick }
@@ -141,6 +141,25 @@ export class BaseAutoFill extends BaseComponent<IBaseAutoFillProps, IBaseAutoFil
     this._inputElement.setSelectionRange(0, 0);
   }
 
+  // Composition events are used when the character/text requires several keystrokes to be completed.
+  // Some examples of this are mobile text input and langauges like Japanese or Arabic.
+  // Find out more at https://developer.mozilla.org/en-US/docs/Web/Events/compositionstart
+  @autobind
+  private _onCompositionStart(ev: React.CompositionEvent<HTMLInputElement>) {
+    this._autoFillEnabled = false;
+  }
+
+  // Composition events are used when the character/text requires several keystrokes to be completed.
+  // Some examples of this are mobile text input and langauges like Japanese or Arabic.
+  // Find out more at https://developer.mozilla.org/en-US/docs/Web/Events/compositionstart
+  @autobind
+  private _onCompositionEnd(ev: React.CompositionEvent<HTMLInputElement>) {
+    let inputValue = this._getCurrentInputValue();
+    this._tryEnableAutofill(inputValue, this.value, false, true);
+    // Due to timing, this needs to be async, otherwise no text will be selected.
+    this._async.setTimeout(() => this._updateValue(inputValue), 0);
+  }
+
   @autobind
   private _onClick() {
     if (this._value && this._value !== '' && this._autoFillEnabled) {
@@ -154,37 +173,66 @@ export class BaseAutoFill extends BaseComponent<IBaseAutoFillProps, IBaseAutoFil
       this.props.onKeyDown(ev);
     }
 
-    switch (ev.which) {
-      case KeyCodes.backspace:
-        this._autoFillEnabled = false;
-        break;
-      case KeyCodes.left:
-        if (this._autoFillEnabled) {
+    // If the event is actively being composed, then don't alert autofill.
+    // Right now typing does not have isComposing, once that has been fixed any should be removed.
+    if (!(ev.nativeEvent as any).isComposing) {
+      switch (ev.which) {
+        case KeyCodes.backspace:
           this._autoFillEnabled = false;
-        }
-        break;
-      case KeyCodes.right:
-        if (this._autoFillEnabled) {
-          this._autoFillEnabled = false;
-        }
-        break;
-      default:
-        if (!this._autoFillEnabled) {
-          if (this.props.enableAutoFillOnKeyPress!.indexOf(ev.which) !== -1) {
-            this._autoFillEnabled = true;
+          break;
+        case KeyCodes.left:
+        case KeyCodes.right:
+          if (this._autoFillEnabled) {
+            this._value = this.state.displayValue!;
+            this._autoFillEnabled = false;
           }
-        }
-        break;
+          break;
+        default:
+          if (!this._autoFillEnabled) {
+            if (this.props.enableAutoFillOnKeyPress!.indexOf(ev.which) !== -1) {
+              this._autoFillEnabled = true;
+            }
+          }
+          break;
+      }
     }
   }
 
   @autobind
   private _onChange(ev: React.FormEvent<HTMLElement>) {
-    let value: string = (ev.target as HTMLInputElement).value;
-    if (value && (ev.target as HTMLInputElement).selectionStart === value.length && !this._autoFillEnabled && value.length > this._value.length) {
+    let value: string = this._getCurrentInputValue(ev);
+    // Right now typing does not have isComposing, once that has been fixed any should be removed.
+    this._tryEnableAutofill(value, this._value, (ev.nativeEvent as any).isComposing);
+    this._updateValue(value);
+  }
+
+  private _getCurrentInputValue(ev?: React.FormEvent<HTMLElement>): string {
+    if (ev && ev.target && (ev.target as any).value) {
+      return (ev.target as any).value;
+    } else {
+      return this._inputElement.value;
+    }
+  }
+
+  /**
+   * Attempts to enable autofill. Whether or not autofill is enabled depends on the input value,
+   * whether or not any text is selected, and only if the new input value is longer than the old input value.
+   * Autofill should never be set to true if the value is composing. Once compositionEnd is called, then
+   * it should be completed.
+   * See https://developer.mozilla.org/en-US/docs/Web/API/CompositionEvent for more information on composition.
+   * @param newValue
+   * @param oldValue
+   * @param isComposing if true then the text is actively being composed and it has not completed.
+   * @param isComposed if the text is a composed text value.
+   */
+  private _tryEnableAutofill(newValue: string, oldValue: string, isComposing?: boolean, isComposed?: boolean) {
+    if (!isComposing
+      && newValue
+      && this._inputElement.selectionStart === newValue.length
+      && !this._autoFillEnabled
+      && (newValue.length > oldValue.length || isComposed)) {
       this._autoFillEnabled = true;
     }
-    this._updateValue(value);
   }
 
   private _notifyInputChange(newValue: string) {
@@ -193,20 +241,36 @@ export class BaseAutoFill extends BaseComponent<IBaseAutoFillProps, IBaseAutoFil
     }
   }
 
+  /**
+   * Updates the current input value as well as getting a new display value.
+   * @param newValue The new value from the input
+   */
   @autobind
   private _updateValue(newValue: string) {
     this._value = this.props.onInputChange ? this.props.onInputChange(newValue) : newValue;
-    let displayValue = newValue;
-    if (this.props.suggestedDisplayValue &&
-      this._doesTextStartWith(this.props.suggestedDisplayValue, displayValue)
-      && this._autoFillEnabled) {
-      displayValue = this.props.suggestedDisplayValue;
-    }
     this.setState({
-      displayValue: newValue
+      displayValue: this._getDisplayValue(this._value, this.props.suggestedDisplayValue)
     }, () => this._notifyInputChange(this._value));
   }
 
+  /**
+   * Returns a string that should be used as the display value.
+   * It evaluates this based on whether or not the suggested value starts with the input value
+   * and whether or not autofill is enabled.
+   * @param inputValue the value that the input currently has.
+   * @param suggestedDisplayValue the possible full value
+   */
+  private _getDisplayValue(inputValue: string, suggestedDisplayValue?: string) {
+    let displayValue = inputValue;
+    if (suggestedDisplayValue
+      && inputValue
+      && this._doesTextStartWith(suggestedDisplayValue, displayValue)
+      && this._autoFillEnabled) {
+      displayValue = suggestedDisplayValue;
+    }
+    return displayValue;
+  }
+
   private _doesTextStartWith(text: string, startWith: string) {
     if (!text || !startWith) {
       return false;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
index f4c1a74dea981..6df55e9308d6f 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
@@ -54,6 +54,8 @@ exports[`Pickers BasePicker renders BasePicker correctly 1`] = `
           disabled={undefined}
           onChange={[Function]}
           onClick={[Function]}
+          onCompositionEnd={[Function]}
+          onCompositionStart={[Function]}
           onFocus={[Function]}
           onKeyDown={[Function]}
           role="combobox"
@@ -119,6 +121,8 @@ exports[`Pickers TagPicker renders TagPicker correctly 1`] = `
           disabled={undefined}
           onChange={[Function]}
           onClick={[Function]}
+          onCompositionEnd={[Function]}
+          onCompositionStart={[Function]}
           onFocus={[Function]}
           onKeyDown={[Function]}
           role="combobox"

From 13911ac55f042c665812d04d6480a6d9b95fa2fd Mon Sep 17 00:00:00 2001
From: Josh Goldberg <joshuakgoldberg@outlook.com>
Date: Tue, 23 Jan 2018 15:08:36 -0800
Subject: [PATCH 1255/1641] Fix "isntance"/"instance" typo in
 positioning.types.ts (#3779)

---
 .../src/utilities/positioning/positioning.types.ts              | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/src/utilities/positioning/positioning.types.ts b/packages/office-ui-fabric-react/src/utilities/positioning/positioning.types.ts
index 7211a295b193d..247ad444ce729 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning/positioning.types.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning/positioning.types.ts
@@ -72,7 +72,7 @@ export interface IPositionedData {
    */
   elementPosition: IPosition;
   /**
-   * The finalized target edge that element is aligning to. For isntance RectangleEdge.bottom would mean
+   * The finalized target edge that element is aligning to. For instance RectangleEdge.bottom would mean
    * that the bottom edge of the target is being aligned to.
    */
   targetEdge: RectangleEdge;

From e3f2856f94d3a7dd297c05c10ccc49181536dcb4 Mon Sep 17 00:00:00 2001
From: manueldosal <manuel_dosal32@hotmail.com>
Date: Tue, 23 Jan 2018 18:27:59 -0800
Subject: [PATCH 1256/1641] Prevent default to avoid setting focus on
 SplitButton menu button (#3777)

* Prevent default to avoid setting focus on SplitButton menu button

* Adding rush change file
---
 ...ult_OnMouseDown_SplitButton_2018-01-23-21-51.json | 11 +++++++++++
 .../src/components/Button/BaseButton.tsx             | 12 +++++++++++-
 2 files changed, 22 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/PreventDefault_OnMouseDown_SplitButton_2018-01-23-21-51.json

diff --git a/common/changes/office-ui-fabric-react/PreventDefault_OnMouseDown_SplitButton_2018-01-23-21-51.json b/common/changes/office-ui-fabric-react/PreventDefault_OnMouseDown_SplitButton_2018-01-23-21-51.json
new file mode 100644
index 0000000000000..7cac009b03880
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/PreventDefault_OnMouseDown_SplitButton_2018-01-23-21-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Prevent default to avoid setting focus on SplitButton menu button",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "madosal@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 3a972ea2b90a7..d289857d0d273 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -481,7 +481,17 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       'ariaLabel': splitButtonAriaLabel
     };
 
-    return <BaseButton {...splitButtonProps} />;
+    return <BaseButton {...splitButtonProps} onMouseDown={ this._onMouseDown } />;
+
+  }
+
+  @autobind
+  private _onMouseDown(ev: React.MouseEvent<BaseButton>) {
+    if (this.props.onMouseDown) {
+      this.props.onMouseDown(ev);
+    }
+
+    ev.preventDefault();
   }
 
   @autobind

From 2c37e804dd339e13451c9a4d192d1c2caca5783e Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 24 Jan 2018 11:23:26 +0000
Subject: [PATCH 1257/1641] Applying package updates.

---
 .../placeholder-colors_2018-01-23-16-44.json  | 11 ----
 ...ouseDown_SplitButton_2018-01-23-21-51.json | 11 ----
 ...utofill-fixime-input_2018-01-12-02-56.json | 11 ----
 ...ropdown-errormessage_2018-01-22-18-50.json | 11 ----
 ...aiPropsToResizeGroup_2018-01-23-20-18.json | 11 ----
 ...nel-focus-zone-props_2017-12-13-06-46.json | 11 ----
 .../placeholder-colors_2018-01-22-23-51.json  | 11 ----
 ...rk-CalendarDayRTLFix_2018-01-23-12-33.json | 11 ----
 packages/example-app-base/package.json        |  2 +-
 packages/file-type-icons/package.json         |  2 +-
 packages/icons/package.json                   |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 51 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 18 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/CHANGELOG.json               | 14 +++++
 packages/styling/CHANGELOG.md                 |  9 +++-
 packages/styling/package.json                 |  2 +-
 17 files changed, 96 insertions(+), 96 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/placeholder-colors_2018-01-23-16-44.json
 delete mode 100644 common/changes/office-ui-fabric-react/PreventDefault_OnMouseDown_SplitButton_2018-01-23-21-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/baseautofill-fixime-input_2018-01-12-02-56.json
 delete mode 100644 common/changes/office-ui-fabric-react/dropdown-errormessage_2018-01-22-18-50.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-AddAraiPropsToResizeGroup_2018-01-23-20-18.json
 delete mode 100644 common/changes/office-ui-fabric-react/panel-focus-zone-props_2017-12-13-06-46.json
 delete mode 100644 common/changes/office-ui-fabric-react/placeholder-colors_2018-01-22-23-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/srk-CalendarDayRTLFix_2018-01-23-12-33.json

diff --git a/common/changes/@uifabric/styling/placeholder-colors_2018-01-23-16-44.json b/common/changes/@uifabric/styling/placeholder-colors_2018-01-23-16-44.json
deleted file mode 100644
index 23fcf650681e1..0000000000000
--- a/common/changes/@uifabric/styling/placeholder-colors_2018-01-23-16-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "New slot for inputPlaceholderText color.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/PreventDefault_OnMouseDown_SplitButton_2018-01-23-21-51.json b/common/changes/office-ui-fabric-react/PreventDefault_OnMouseDown_SplitButton_2018-01-23-21-51.json
deleted file mode 100644
index 7cac009b03880..0000000000000
--- a/common/changes/office-ui-fabric-react/PreventDefault_OnMouseDown_SplitButton_2018-01-23-21-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Prevent default to avoid setting focus on SplitButton menu button",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "madosal@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/baseautofill-fixime-input_2018-01-12-02-56.json b/common/changes/office-ui-fabric-react/baseautofill-fixime-input_2018-01-12-02-56.json
deleted file mode 100644
index 33b5d94c697d8..0000000000000
--- a/common/changes/office-ui-fabric-react/baseautofill-fixime-input_2018-01-12-02-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "BaseAutoFill: Fixed a bug where baseautofill would not work with composed languages like Japanese",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/dropdown-errormessage_2018-01-22-18-50.json b/common/changes/office-ui-fabric-react/dropdown-errormessage_2018-01-22-18-50.json
deleted file mode 100644
index 9335122b59613..0000000000000
--- a/common/changes/office-ui-fabric-react/dropdown-errormessage_2018-01-22-18-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: Align error message styling to TextField. TextField & ComboBox: Updated invalid input border color to be red in all states.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/jspurlin-AddAraiPropsToResizeGroup_2018-01-23-20-18.json b/common/changes/office-ui-fabric-react/jspurlin-AddAraiPropsToResizeGroup_2018-01-23-20-18.json
deleted file mode 100644
index 6c5240e82df68..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-AddAraiPropsToResizeGroup_2018-01-23-20-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ResizeGroup: Add the ability for ResizeGroup to get divProps",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/panel-focus-zone-props_2017-12-13-06-46.json b/common/changes/office-ui-fabric-react/panel-focus-zone-props_2017-12-13-06-46.json
deleted file mode 100644
index bf0f65910d686..0000000000000
--- a/common/changes/office-ui-fabric-react/panel-focus-zone-props_2017-12-13-06-46.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Enhance Panel component props to allow all of FocusTrapZone props overrides.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "sllynn8907@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/placeholder-colors_2018-01-22-23-51.json b/common/changes/office-ui-fabric-react/placeholder-colors_2018-01-22-23-51.json
deleted file mode 100644
index 1919b464e0a2a..0000000000000
--- a/common/changes/office-ui-fabric-react/placeholder-colors_2018-01-22-23-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "TextField and SearchBox: Specified placeholder text color to be more consistent across browsers.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/srk-CalendarDayRTLFix_2018-01-23-12-33.json b/common/changes/office-ui-fabric-react/srk-CalendarDayRTLFix_2018-01-23-12-33.json
deleted file mode 100644
index bd9829d858c34..0000000000000
--- a/common/changes/office-ui-fabric-react/srk-CalendarDayRTLFix_2018-01-23-12-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix CalendarDay RTL view",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "srkandu@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 816975d84e580..4501b1fb9ad8b 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -32,7 +32,7 @@
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.15.3 <6.0.0",
+    "@uifabric/styling": ">=5.16.0 <6.0.0",
     "@uifabric/utilities": ">=5.7.0 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
diff --git a/packages/file-type-icons/package.json b/packages/file-type-icons/package.json
index ec6064302b44d..1cda2d14ad073 100644
--- a/packages/file-type-icons/package.json
+++ b/packages/file-type-icons/package.json
@@ -26,7 +26,7 @@
     "react-dom": "^16.2.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.15.3 <6.0.0",
+    "@uifabric/styling": ">=5.16.0 <6.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/icons/package.json b/packages/icons/package.json
index b54c87702bfa5..8875ad706dc1e 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -22,7 +22,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.15.3 <6.0.0",
+    "@uifabric/styling": ">=5.16.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 86557e72159be..5ae6ee58821a3 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,57 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.42.0",
+      "tag": "office-ui-fabric-react_v5.42.0",
+      "date": "Wed, 24 Jan 2018 11:23:26 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "09c29d1e2c1d6fc541fb13eacf535fca82f868ba",
+            "comment": "BaseAutoFill: Fixed a bug where baseautofill would not work with composed languages like Japanese"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "f2dcf91ae4e484ce483b52c35b012c90d28fd89e",
+            "comment": "Dropdown: Align error message styling to TextField. TextField & ComboBox: Updated invalid input border color to be red in all states."
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "b31132497466cd88b1887badfef8c05833e35784",
+            "comment": "TextField and SearchBox: Specified placeholder text color to be more consistent across browsers."
+          },
+          {
+            "author": "manueldosal <manuel_dosal32@hotmail.com>",
+            "commit": "e3f2856f94d3a7dd297c05c10ccc49181536dcb4",
+            "comment": "Prevent default to avoid setting focus on SplitButton menu button"
+          },
+          {
+            "author": "Srikanth Reddy Kandula <srikanthreddy.iitp@gmail.com>",
+            "commit": "ee2299a2ea7f5410343a6d50d94fd542c687fc26",
+            "comment": "Fix CalendarDay RTL view"
+          }
+        ],
+        "minor": [
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "5270872fcdfcbe3dfb5c3592d1bd895bf283414e",
+            "comment": "ResizeGroup: Add the ability for ResizeGroup to get divProps"
+          },
+          {
+            "author": "Spencer Lynn <sllynn8907@gmail.com>",
+            "commit": "2a57fb1c2476d8677c4cee76c3ff23958c9ae5bd",
+            "comment": "Enhance Panel component props to allow all of FocusTrapZone props overrides."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.15.3 <6.0.0` to `>=5.16.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.41.2",
       "tag": "office-ui-fabric-react_v5.41.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index e35c02702294a..5dc20f90042d7 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,22 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 23 Jan 2018 11:22:12 GMT and should not be manually modified.
+This log was last generated on Wed, 24 Jan 2018 11:23:26 GMT and should not be manually modified.
+
+## 5.42.0
+Wed, 24 Jan 2018 11:23:26 GMT
+
+### Minor changes
+
+- ResizeGroup: Add the ability for ResizeGroup to get divProps
+- Enhance Panel component props to allow all of FocusTrapZone props overrides.
+
+### Patches
+
+- BaseAutoFill: Fixed a bug where baseautofill would not work with composed languages like Japanese
+- Dropdown: Align error message styling to TextField. TextField & ComboBox: Updated invalid input border color to be red in all states.
+- TextField and SearchBox: Specified placeholder text color to be more consistent across browsers.
+- Prevent default to avoid setting focus on SplitButton menu button
+- Fix CalendarDay RTL view
 
 ## 5.41.2
 Tue, 23 Jan 2018 11:22:12 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 9f2e3c1ed75ad..232255f48eeac 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.41.2",
+  "version": "5.42.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -49,7 +49,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/icons": ">=5.4.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.10.1 <6.0.0",
-    "@uifabric/styling": ">=5.15.3 <6.0.0",
+    "@uifabric/styling": ">=5.16.0 <6.0.0",
     "@uifabric/utilities": ">=5.7.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index abfacbd525ec0..caff77820ee7e 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.16.0",
+      "tag": "@uifabric/styling_v5.16.0",
+      "date": "Wed, 24 Jan 2018 11:23:26 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "b31132497466cd88b1887badfef8c05833e35784",
+            "comment": "New slot for inputPlaceholderText color."
+          }
+        ]
+      }
+    },
     {
       "version": "5.15.3",
       "tag": "@uifabric/styling_v5.15.3",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 2d0fd379b5d42..dbadd235d4d37 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Mon, 22 Jan 2018 11:14:27 GMT and should not be manually modified.
+This log was last generated on Wed, 24 Jan 2018 11:23:26 GMT and should not be manually modified.
+
+## 5.16.0
+Wed, 24 Jan 2018 11:23:26 GMT
+
+### Minor changes
+
+- New slot for inputPlaceholderText color.
 
 ## 5.15.3
 Mon, 22 Jan 2018 11:14:27 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 4d1fd88969932..64cb711e45a42 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.15.3",
+  "version": "5.16.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "repository": {
     "type": "git",

From 79ea899e4cbf601d0ada67e631739c9702b7c4d7 Mon Sep 17 00:00:00 2001
From: Hlynur Tryggvason <hlynur.tryggvason@officeatwork.com>
Date: Wed, 24 Jan 2018 19:06:28 +0100
Subject: [PATCH 1258/1641] [SearchBox] onChange and flex layout fix for IE
 (#3664)

* [SearchBox] onChange and flex layout fix for IE

* [SearchBox] Use flex shorthand
---
 .../src/components/SearchBox/SearchBox.base.tsx               | 4 +++-
 .../src/components/SearchBox/SearchBox.styles.tsx             | 2 +-
 .../SearchBox/__snapshots__/SearchBox.test.tsx.snap           | 2 +-
 .../SearchBox/examples/SearchBox.FullSize.Example.tsx         | 1 +
 4 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
index 3a0c8eea2a98b..956f56893e608 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
@@ -36,8 +36,10 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
   public constructor(props: ISearchBoxProps) {
     super(props);
 
+    this._latestValue = props.value || '';
+
     this.state = {
-      value: props.value || '',
+      value: this._latestValue,
       hasFocus: false,
       id: getId('SearchBox')
     };
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx
index db3009f493177..440765ee9d6ab 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx
@@ -133,7 +133,7 @@ export function getStyles(props: ISearchBoxStyleProps): ISearchBoxStyles {
         fontSize: 'inherit',
         color: palette.neutralPrimary,
         backgroundColor: 'transparent',
-        flex: '1 1 0',
+        flex: '1 1 0px',
         overflow: 'hidden',
         textOverflow: 'ellipsis',
         // This padding forces the text placement to round up.
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
index e7791cbce3b14..13129de5ee23a 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
@@ -78,7 +78,7 @@ exports[`SearchBox renders SearchBox correctly 1`] = `
           box-shadow: none;
           box-sizing: border-box;
           color: #333333;
-          flex: 1 1 0;
+          flex: 1 1 0px;
           font-family: inherit;
           font-size: inherit;
           font-weight: inherit;
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.FullSize.Example.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.FullSize.Example.tsx
index df8fe5268c1bf..8e044a01cc86b 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.FullSize.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.FullSize.Example.tsx
@@ -8,6 +8,7 @@ export class SearchBoxFullSizeExample extends React.Component<any, any> {
         // tslint:disable:jsx-no-lambda
         onFocus={ () => console.log('onFocus called') }
         onBlur={ () => console.log('onBlur called') }
+        onChange={ () => console.log('onChange called') }
       />
     );
   }

From bd19b42da3e1452580283a30a682d22349af1fe6 Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Wed, 24 Jan 2018 11:07:28 -0800
Subject: [PATCH 1259/1641] Addressing Issue #999 - [Accessibility]
 PeoplePicker doesn't have focus border when focused by keyboard (#3774)

* added onFocus to BasePicker state and added a control class to input container & Updated Snapshot and Rush Changelog
---
 .../picker-focus-999_2018-01-23-23-02.json         | 11 +++++++++++
 .../src/components/pickers/BasePicker.tsx          | 14 ++++++++++++--
 .../pickers/__snapshots__/BasePicker.test.tsx.snap |  2 ++
 3 files changed, 25 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/picker-focus-999_2018-01-23-23-02.json

diff --git a/common/changes/office-ui-fabric-react/picker-focus-999_2018-01-23-23-02.json b/common/changes/office-ui-fabric-react/picker-focus-999_2018-01-23-23-02.json
new file mode 100644
index 0000000000000..8c891377555b3
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/picker-focus-999_2018-01-23-23-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added onFocus state Boolean to BasePicker",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index d977bbb96484f..62ba1775ee1db 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -23,6 +23,7 @@ export interface IBasePickerState {
   items?: any;
   suggestedDisplayValue?: string;
   moreSuggestionsAvailable?: boolean;
+  isFocused?: boolean;
   isSearching?: boolean;
   isMostRecentlyUsedVisible?: boolean;
   suggestionsVisible?: boolean;
@@ -57,6 +58,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
       suggestedDisplayValue: '',
       isMostRecentlyUsedVisible: false,
       moreSuggestionsAvailable: false,
+      isFocused: false,
       isSearching: false
     };
   }
@@ -188,13 +190,14 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
         >
           <div className={ styles.screenReaderOnly } role='alert' id='selected-suggestion-alert' aria-live='assertive'>{ selectedSuggestionAlert } </div>
           <SelectionZone selection={ this.selection } selectionMode={ SelectionMode.multiple }>
-            <div className={ css('ms-BasePicker-text', styles.pickerText) } role={ 'list' }>
+            <div className={ css('ms-BasePicker-text', styles.pickerText, this.state.isFocused && styles.inputFocused) } role={ 'list' }>
               { this.renderItems() }
               { this.canAddItems() && (<BaseAutoFill
                 { ...inputProps as any }
                 className={ css('ms-BasePicker-input', styles.pickerInput) }
                 ref={ this._resolveRef('input') }
                 onFocus={ this.onInputFocus }
+                onBlur={ this.onInputBlur }
                 onInputValueChange={ this.onInputChange }
                 suggestedDisplayValue={ suggestedDisplayValue }
                 aria-activedescendant={ 'sug-' + this.suggestionStore.currentIndex }
@@ -413,6 +416,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   @autobind
   protected onInputFocus(ev: React.FocusEvent<HTMLInputElement | BaseAutoFill>) {
+    this.setState({ isFocused: true });
     this.selection.setAllSelected(false);
     if (this.input && this.input.value === '' && this.props.onEmptyInputFocus) {
       this.onEmptyInputFocus();
@@ -432,6 +436,11 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     }
   }
 
+  @autobind
+  protected onInputBlur(ev: React.FocusEvent<HTMLInputElement | BaseAutoFill>) {
+    this.setState({ isFocused: false });
+  }
+
   @autobind
   protected onKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
     switch (ev.which) {
@@ -688,12 +697,13 @@ export class BasePickerListBelow<T, P extends IBasePickerProps<T>> extends BaseP
             selection={ this.selection }
             selectionMode={ SelectionMode.multiple }
           >
-            <div className={ css('ms-BasePicker-text', styles.pickerText) }>
+            <div className={ css('ms-BasePicker-text', styles.pickerText, this.state.isFocused && styles.inputFocused) }>
               <BaseAutoFill
                 { ...inputProps as any }
                 className={ css('ms-BasePicker-input', styles.pickerInput) }
                 ref={ this._resolveRef('input') }
                 onFocus={ this.onInputFocus }
+                onBlur={ this.onInputBlur }
                 onInputValueChange={ this.onInputChange }
                 suggestedDisplayValue={ suggestedDisplayValue }
                 aria-activedescendant={ 'sug-' + this.suggestionStore.currentIndex }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
index 6df55e9308d6f..43b7f1992ae11 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
@@ -52,6 +52,7 @@ exports[`Pickers BasePicker renders BasePicker correctly 1`] = `
           className="ms-BasePicker-input"
           data-lpignore={true}
           disabled={undefined}
+          onBlur={[Function]}
           onChange={[Function]}
           onClick={[Function]}
           onCompositionEnd={[Function]}
@@ -119,6 +120,7 @@ exports[`Pickers TagPicker renders TagPicker correctly 1`] = `
           className="ms-BasePicker-input"
           data-lpignore={true}
           disabled={undefined}
+          onBlur={[Function]}
           onChange={[Function]}
           onClick={[Function]}
           onCompositionEnd={[Function]}

From c0d264e51b37fb707a149c1dd22641f9378e367b Mon Sep 17 00:00:00 2001
From: Alex Bettadapur <alexbettadapur@gmail.com>
Date: Wed, 24 Jan 2018 11:27:50 -0800
Subject: [PATCH 1260/1641] Async: Cancel should set timeoutId to null (#3782)

* Null out timeouts

* Change file

* Tweaks

* Lint
---
 .../debounceCancel_2018-01-23-23-50.json      | 11 ++++++++++
 packages/utilities/src/Async.ts               | 22 +++++++++++--------
 2 files changed, 24 insertions(+), 9 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/debounceCancel_2018-01-23-23-50.json

diff --git a/common/changes/@uifabric/utilities/debounceCancel_2018-01-23-23-50.json b/common/changes/@uifabric/utilities/debounceCancel_2018-01-23-23-50.json
new file mode 100644
index 0000000000000..90a958ca0fdda
--- /dev/null
+++ b/common/changes/@uifabric/utilities/debounceCancel_2018-01-23-23-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Set timeout ids to null for cancel and flush functions",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "alexbettadapur@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/src/Async.ts b/packages/utilities/src/Async.ts
index b35c62ba50e88..0806cf3e7e79b 100644
--- a/packages/utilities/src/Async.ts
+++ b/packages/utilities/src/Async.ts
@@ -359,12 +359,16 @@ export class Async {
       maxWait = options.maxWait;
     }
 
-    let invokeFunction = (time: number) => {
+    let markExecuted = (time: number) => {
       if (timeoutId) {
         this.clearTimeout(timeoutId);
         timeoutId = null;
       }
       lastExecuteTime = time;
+    };
+
+    let invokeFunction = (time: number) => {
+      markExecuted(time);
       lastResult = func.apply(this._parent, lastArgs);
     };
 
@@ -400,25 +404,25 @@ export class Async {
       return lastResult;
     };
 
+    let pending = (): boolean => {
+      return !!timeoutId;
+    };
+
     let cancel = (): void => {
-      if (timeoutId) {
-        this.clearTimeout(timeoutId);
+      if (pending()) {
+        // Mark the debounced function as having executed
+        markExecuted(new Date().getTime());
       }
     };
 
     let flush = (): T => {
-      if (timeoutId) {
-        this.clearTimeout(timeoutId);
+      if (pending()) {
         invokeFunction(new Date().getTime());
       }
 
       return lastResult;
     };
 
-    let pending = (): boolean => {
-      return !!timeoutId;
-    };
-
     // tslint:disable-next-line:no-any
     let resultFunction: ICancelable<T> & (() => T) = ((...args: any[]) => {
       lastArgs = args;

From 59111034b784874eec5c28fef8d6dd11f06502b1 Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Wed, 24 Jan 2018 13:06:49 -0800
Subject: [PATCH 1261/1641] Fixing some broken links in documentation pages
 (#3792)

* Fixing broken links.

* rush change
---
 .../v-krbrow-list-link-fix_2018-01-24-20-49.json      | 11 +++++++++++
 .../src/components/Button/ButtonPage.tsx              |  2 +-
 .../src/components/DetailsList/DetailsListPage.tsx    |  2 +-
 3 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-list-link-fix_2018-01-24-20-49.json

diff --git a/common/changes/office-ui-fabric-react/v-krbrow-list-link-fix_2018-01-24-20-49.json b/common/changes/office-ui-fabric-react/v-krbrow-list-link-fix_2018-01-24-20-49.json
new file mode 100644
index 0000000000000..7e89b7e9164cd
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-list-link-fix_2018-01-24-20-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixed broken links on documentation pages",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
index e833b0b18ba91..ee0ef8aa003cf 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
@@ -142,7 +142,7 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
             <p>Buttons are best used to enable a user to commit a change or complete steps in a task. They are typically found inside forms, dialogs, panels or pages. An example of their usage is confirming the deletion of a file in a confirmation dialog.</p>
             <p>When considering their place in a layout, contemplate the order in which a user will flow through the UI. As an example, in a form, the individual will need to read and interact with the form fields before submiting the form. Therefore, as a general rule, the button should be placed at the bottom of the UI container (a dialog, panel, or page) which holds the related UI elements.</p>
             <p>While buttons can technically be used to navigate a user to another part of the experience, this is not recommended unless that navigation is part of an action or their flow.</p>
-            <p>Note that both iconProps and menuIconProps take <Link href='#/examples/icon'>IIconProps</Link> to specify name and type.</p>
+            <p>Note that both iconProps and menuIconProps take <Link href='#/components/icon'>IIconProps</Link> to specify name and type.</p>
           </div>
         }
         bestPractices={
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
index 3bf50a9956623..2dad5a197e3a6 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsListPage.tsx
@@ -89,7 +89,7 @@ export class DetailsListPage extends React.Component<IComponentDemoPageProps, {}
         overview={
           <div>
             <p>
-              DetailsList is a derivative of the <Link href='#/examples/list'>List</Link> component. It is a robust way to display an information rich collection of items. It can support powerful ways to aid a user in finding content with sorting, grouping and filtering. Lists are a great way to handle large amounts of content, but poorly designed Lists can be difficult to parse.
+              DetailsList is a derivative of the <Link href='#/components/list'>List</Link> component. It is a robust way to display an information rich collection of items. It can support powerful ways to aid a user in finding content with sorting, grouping and filtering. Lists are a great way to handle large amounts of content, but poorly designed Lists can be difficult to parse.
             </p>
             <p>
               Use a DetailsList when density of information is critical. Lists can support single and multiple selection, as well as drag and drop and marquee selection. They are composed of a column header, which contains the metadata fields which are attached to the list items, and provide the ability to sort, filter and even group the list. List items are composed of selection, icon, and name columns at minimum. One can also include other columns such as Date Modified, or any other metadata field associated with the collection. Place the most important columns from left to right for ease of recall and comparison.

From 3b5b375421343cbc74b4aa72c432a0910224459e Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Wed, 24 Jan 2018 14:53:19 -0800
Subject: [PATCH 1262/1641] Fixing Picker suggestions RTL alignment (#3795)

* Making picker suggestions callout align to correct rtl position

* rush change

* Removing getRTL import
---
 .../v-krbrow-pickers-rtl_2018-01-24-22-11.json        | 11 +++++++++++
 .../src/components/pickers/BasePicker.tsx             |  6 +++---
 2 files changed, 14 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-pickers-rtl_2018-01-24-22-11.json

diff --git a/common/changes/office-ui-fabric-react/v-krbrow-pickers-rtl_2018-01-24-22-11.json b/common/changes/office-ui-fabric-react/v-krbrow-pickers-rtl_2018-01-24-22-11.json
new file mode 100644
index 0000000000000..af92a22d75777
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-pickers-rtl_2018-01-24-22-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Pickers: Aligning suggestions callout to the correct RTL position",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 62ba1775ee1db..191c1e05424bc 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -3,8 +3,7 @@ import {
   BaseComponent,
   KeyCodes,
   autobind,
-  css,
-  getRTL
+  css
 } from '../../Utilities';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { Callout, DirectionalHint } from '../../Callout';
@@ -233,7 +232,8 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
         gapSpace={ 5 }
         target={ this.input.inputElement }
         onDismiss={ this.dismissSuggestions }
-        directionalHint={ getRTL() ? DirectionalHint.bottomRightEdge : DirectionalHint.bottomLeftEdge }
+        directionalHint={ DirectionalHint.bottomLeftEdge }
+        directionalHintForRTL={ DirectionalHint.bottomRightEdge }
       >
         <TypedSuggestion
           onRenderSuggestion={ this.props.onRenderSuggestionsItem }

From 194ce4efa804ac4bbacef04b03d426c8a561a6b0 Mon Sep 17 00:00:00 2001
From: amyngu <31973030+amyngu@users.noreply.github.com>
Date: Wed, 24 Jan 2018 15:54:46 -0800
Subject: [PATCH 1263/1641] Picker header (#3737)

* add header element, fix css styling for items and input

* add change file

* fix tslint errors
---
 .../pickerHeader_2018-01-17-19-36.json        | 11 +++
 .../ExtendedPicker/BaseExtendedPicker.tsx     | 54 ++++++++------
 .../BaseExtendedPicker.types.ts               |  5 ++
 .../ExtendedPeoplePicker.Basic.Example.tsx    | 14 ++++
 .../BaseSelectedItemsList.tsx                 | 71 +++++--------------
 .../BaseSelectedItemsList.types.ts            |  3 +
 .../SelectedPeopleList/SelectedPeopleList.tsx |  4 +-
 .../SelectedPeopleList.Basic.Example.tsx      | 10 ++-
 8 files changed, 95 insertions(+), 77 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/pickerHeader_2018-01-17-19-36.json

diff --git a/common/changes/@uifabric/experiments/pickerHeader_2018-01-17-19-36.json b/common/changes/@uifabric/experiments/pickerHeader_2018-01-17-19-36.json
new file mode 100644
index 0000000000000..43ab94179b734
--- /dev/null
+++ b/common/changes/@uifabric/experiments/pickerHeader_2018-01-17-19-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "add optional title element to extendedPicker, css changes to have selected items flow on the same row as input",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "amyngu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
index 50e8a2bed5337..b02d495cb1d07 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
@@ -15,6 +15,7 @@ import * as stylesImport from './BaseExtendedPicker.scss';
 import { IBaseExtendedPickerProps, IBaseExtendedPicker } from './BaseExtendedPicker.types';
 import { IBaseFloatingPickerProps, BaseFloatingPicker } from '../../FloatingPicker';
 import { BaseSelectedItemsList, IBaseSelectedItemsListProps } from '../../SelectedItemsList';
+import { Selection, SelectionMode, SelectionZone } from 'office-ui-fabric-react/lib/Selection';
 // tslint:disable-next-line:no-any
 const styles: any = stylesImport;
 
@@ -38,6 +39,7 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
   protected root: HTMLElement;
   protected input: BaseAutoFill;
   protected focusZone: FocusZone;
+  protected selection: Selection;
   protected floatingPickerProps: IBaseFloatingPickerProps<T>;
   protected selectedItemsListProps: IBaseSelectedItemsListProps<T>;
 
@@ -46,6 +48,9 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
 
     let items: T[] = basePickerProps.selectedItems || basePickerProps.defaultSelectedItems || [];
 
+    this.selection = new Selection({ onSelectionChanged: () => this.onSelectionChange() });
+    this.selection.setItems(items);
+
     this.state = {
       items: items ? items : [],
       suggestedDisplayValue: '',
@@ -91,32 +96,40 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
           onKeyDown={ this.onBackspace }
           onCopy={ this.onCopy }
         >
-          <div className={ css('ms-BasePicker-text', styles.pickerText) } role={ 'list' }>
-            { this.renderSelectedItemsList() }
-            { this.canAddItems() && (<BaseAutoFill
-              { ...inputProps as IInputProps }
-              className={ css('ms-BasePicker-input', styles.pickerInput) }
-              ref={ this._resolveRef('input') }
-              onFocus={ this.onInputFocus }
-              onInputValueChange={ this.onInputChange }
-              suggestedDisplayValue={ suggestedDisplayValue }
-              aria-activedescendant={ 'sug-' + this.state.items.length }
-              aria-owns='suggestion-list'
-              aria-expanded='true'
-              aria-haspopup='true'
-              autoCapitalize='off'
-              autoComplete='off'
-              role='combobox'
-              disabled={ disabled }
-              aria-controls='selected-suggestion-alert'
-            />) }
-          </div>
+
+          <SelectionZone selection={ this.selection } selectionMode={ SelectionMode.multiple }>
+            <div className={ css('ms-BasePicker-text', styles.pickerText) } role={ 'list' }>
+              { this.props.headerComponent }
+              { this.renderSelectedItemsList() }
+              { this.canAddItems() && (<BaseAutoFill
+                { ...inputProps as IInputProps }
+                className={ css('ms-BasePicker-input', styles.pickerInput) }
+                ref={ this._resolveRef('input') }
+                onFocus={ this.onInputFocus }
+                onInputValueChange={ this.onInputChange }
+                suggestedDisplayValue={ suggestedDisplayValue }
+                aria-activedescendant={ 'sug-' + this.state.items.length }
+                aria-owns='suggestion-list'
+                aria-expanded='true'
+                aria-haspopup='true'
+                autoCapitalize='off'
+                autoComplete='off'
+                role='combobox'
+                disabled={ disabled }
+                aria-controls='selected-suggestion-alert'
+              />) }
+            </div>
+          </SelectionZone>
         </FocusZone>
         { this.renderSuggestions() }
       </div>
     );
   }
 
+  protected onSelectionChange(): void {
+    this.forceUpdate();
+  }
+
   protected canAddItems(): boolean {
     const { items } = this.state;
     const { itemLimit } = this.props;
@@ -217,6 +230,7 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
   protected _onSuggestionSelected(item: T): void {
     this.selectedItemsList.addItems([item]);
     this.input.clear();
+
     this.floatingPicker.hidePicker();
   }
 
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts
index de96937dd06b6..49b9a584262b8 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts
@@ -18,6 +18,11 @@ export interface IBaseExtendedPicker<T> {
 export interface IBaseExtendedPickerProps<T> {
   componentRef?: (component?: IBaseExtendedPicker<T>) => void;
 
+  /**
+   * Header/title element for the picker
+   */
+  headerComponent?: JSX.Element;
+
   /**
    * Initial items that have already been selected and should appear in the people picker.
    */
diff --git a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
index 9ecc290c64d07..57cf88fb3707f 100644
--- a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
@@ -16,6 +16,7 @@ import './ExtendedPeoplePicker.Basic.Example.scss';
 import { FloatingPeoplePicker, IBaseFloatingPickerProps } from '../../FloatingPicker';
 import { IBaseSelectedItemsListProps, IExtendedPersonaProps, ISelectedPeopleProps, SelectedPeopleList }
   from '../../SelectedItemsList';
+import { Selection } from 'office-ui-fabric-react/lib/Selection';
 
 export interface IPeoplePickerExampleState {
   peopleList: IPersonaProps[];
@@ -38,6 +39,7 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
   private _picker: ExtendedPeoplePicker;
   private floatingPickerProps: IBaseFloatingPickerProps<IExtendedPersonaProps>;
   private selectedItemsListProps: ISelectedPeopleProps;
+  private selection: Selection;
 
   constructor(props: {}) {
     super(props);
@@ -49,6 +51,8 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
       peopleList.push(target);
     });
 
+    this.selection = new Selection({ onSelectionChanged: () => this._onSelectionChange() });
+
     this.state = {
       peopleList: peopleList,
       mostRecentlyUsed: mru,
@@ -70,6 +74,7 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
       onExpandGroup: this._onExpandItem,
       removeMenuItemText: 'Remove',
       copyMenuItemText: 'Copy name',
+      selection: this.selection
     };
   }
 
@@ -100,10 +105,15 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
           'aria-label': 'People Picker'
         } }
         componentRef={ this._setComponentRef }
+        headerComponent={ this._renderHeader() }
       />
     );
   }
 
+  private _renderHeader(): JSX.Element {
+    return <div>TO:</div>;
+  }
+
   private _onRenderFloatingPicker(props: IBaseFloatingPickerProps<IExtendedPersonaProps>): JSX.Element {
     return (<FloatingPeoplePicker {...props} />);
   }
@@ -112,6 +122,10 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
     return (<SelectedPeopleList {...props} />);
   }
 
+  private _onSelectionChange(): void {
+    this.forceUpdate();
+  }
+
   @autobind
   private _setComponentRef(component: ExtendedPeoplePicker): void {
     this._picker = component;
diff --git a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx
index fe5e8c56e06ce..97c45f74aebe2 100644
--- a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx
@@ -3,10 +3,8 @@ import {
   BaseComponent,
   KeyCodes,
   autobind,
-  css
 } from '../../Utilities';
-import { FocusZone, FocusZoneDirection } from 'office-ui-fabric-react/lib/FocusZone';
-import { Selection, SelectionZone, SelectionMode } from 'office-ui-fabric-react/lib/Selection';
+
 import { IBaseSelectedItemsList, IBaseSelectedItemsListProps, ISelectedItemProps } from './BaseSelectedItemsList.types';
 
 export interface IBaseSelectedItemsListState {
@@ -24,18 +22,12 @@ export interface IBaseSelectedItemsListState {
 export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
   extends BaseComponent<P, IBaseSelectedItemsListState> implements IBaseSelectedItemsList<T> {
 
-  protected selection: Selection;
-
   protected root: HTMLElement;
-  protected focusZone: FocusZone;
 
   constructor(basePickerProps: P) {
     super(basePickerProps);
 
     let items: T[] = basePickerProps.selectedItems || basePickerProps.defaultSelectedItems || [];
-
-    this.selection = new Selection({ onSelectionChanged: () => this.onSelectionChange() });
-    this.selection.setItems(items);
     this.state = {
       items: items,
     };
@@ -56,11 +48,11 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
     if (processedItemPromiseLikes && processedItemPromiseLikes.then) {
       processedItemPromiseLikes.then((resolvedProcessedItems: T[]) => {
         let newItems: T[] = this.state.items.concat(resolvedProcessedItems);
-        this.updateSelectedItems(newItems);
+        this.updateItems(newItems);
       });
     } else {
       let newItems: T[] = this.state.items.concat(processedItemObjects);
-      this.updateSelectedItems(newItems);
+      this.updateItems(newItems);
     }
     this.setState({ suggestedDisplayValue: '' });
   }
@@ -71,30 +63,30 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
     // tslint:disable-next-line:no-any
     if (index > -1) {
       let newItems = items.slice(0, index).concat(items.slice(index + 1));
-      this.updateSelectedItems(newItems);
+      this.updateItems(newItems);
     }
   }
 
   @autobind
   public onCopy(ev: React.ClipboardEvent<HTMLElement>): void {
-    if (this.props.onCopyItems && this.selection.getSelectedCount() > 0) {
-      let selectedItems: T[] = this.selection.getSelection() as T[];
+    if (this.props.onCopyItems && this.props.selection.getSelectedCount() > 0) {
+      let selectedItems: T[] = this.props.selection.getSelection() as T[];
       this.copyItems(selectedItems);
     }
   }
 
   public unselectAll(): void {
-    this.selection.setAllSelected(false);
+    this.props.selection.setAllSelected(false);
   }
 
   public componentWillUpdate(newProps: P, newState: IBaseSelectedItemsListState): void {
     if (newState.items && newState.items !== this.state.items) {
-      this.selection.setItems(newState.items);
+      this.props.selection.setItems(newState.items);
     }
   }
 
   public componentDidMount(): void {
-    this.selection.setItems(this.state.items);
+    this.props.selection.setItems(this.state.items);
   }
 
   public componentWillReceiveProps(newProps: P): void {
@@ -105,31 +97,8 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
     }
   }
 
-  public render(): JSX.Element {
-    let { className } = this.props;
-
-    return (
-      <div
-        ref={ this._resolveRef('root') }
-        className={ css(
-          'ms-BasePicker',
-          className ? className : '') }
-        onKeyDown={ this.onKeyDown }
-        onCopy={ this.onCopy }
-      >
-        <FocusZone
-          ref={ this._resolveRef('focusZone') }
-          direction={ FocusZoneDirection.bidirectional }
-          isInnerZoneKeystroke={ this._isFocusZoneInnerKeystroke }
-        >
-          <SelectionZone selection={ this.selection } selectionMode={ SelectionMode.multiple } >
-            <div role={ 'list' }>
-              { this.renderItems() }
-            </div>
-          </SelectionZone>
-        </FocusZone>
-      </div>
-    );
+  public render(): JSX.Element[] {
+    return this.renderItems();
   }
 
   @autobind
@@ -143,7 +112,7 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
       item,
       index,
       key: item.key ? item.key : index,
-      selected: this.selection.isIndexSelected(index),
+      selected: this.props.selection.isIndexSelected(index),
       onRemoveItem: () => this.removeItem(item),
       onItemChange: this.onItemChange,
       removeButtonAriaLabel: removeButtonAriaLabel,
@@ -151,10 +120,6 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
     }));
   }
 
-  protected onSelectionChange(): void {
-    this.forceUpdate();
-  }
-
   protected onChange(items?: T[]): void {
     if (this.props.onChange) {
       (this.props.onChange as (items?: T[]) => void)(items);
@@ -182,7 +147,7 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
       let newItems: T[] = items;
       newItems[index] = changedItem;
 
-      this.updateSelectedItems(newItems);
+      this.updateItems(newItems);
     }
   }
 
@@ -193,7 +158,7 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
 
     if (index >= 0) {
       let newItems: T[] = items.slice(0, index).concat(items.slice(index + 1));
-      this.updateSelectedItems(newItems);
+      this.updateItems(newItems);
     }
   }
 
@@ -206,15 +171,15 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
     let firstItemToRemove = itemsToRemove[0];
     let index: number = items.indexOf(firstItemToRemove);
 
-    this.updateSelectedItems(newItems, index);
+    this.updateItems(newItems, index);
   }
 
   // This is protected because we may expect the backspace key to work differently in a different kind of picker.
   // This lets the subclass override it and provide it's own onBackspace. For an example see the BasePickerListBelow
   protected onBackspace(ev: React.KeyboardEvent<HTMLElement>): void {
     if (this.state.items.length) {
-      if (this.selection.getSelectedCount() > 0) {
-        this.removeItems(this.selection.getSelection());
+      if (this.props.selection.getSelectedCount() > 0) {
+        this.removeItems(this.props.selection.getSelection());
       } else {
         this.removeItem(this.state.items[this.state.items.length - 1]);
       }
@@ -225,7 +190,7 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
    * Controls what happens whenever there is an action that impacts the selected items.
    * If selectedItems is provided as a property then this will act as a controlled component and it will not update it's own state.
   */
-  protected updateSelectedItems(items: T[], focusIndex?: number): void {
+  protected updateItems(items: T[], focusIndex?: number): void {
     if (this.props.selectedItems) {
       // If the component is a controlled component then the controlling component will need
       this.onChange(items);
diff --git a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.types.ts b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.types.ts
index 2f5262bf02dd2..930e018eaeefd 100644
--- a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.types.ts
+++ b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.types.ts
@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { IPickerItemProps, ISuggestionModel, ValidationState } from 'office-ui-fabric-react/lib/Pickers';
+import { Selection } from 'office-ui-fabric-react/lib/Selection';
 
 export interface IBaseSelectedItemsList<T> {
   /** Gets the current value of the input. */
@@ -17,6 +18,8 @@ export interface ISelectedItemProps<T> extends IPickerItemProps<T> {
 // tslint:disable-next-line:no-any
 export interface IBaseSelectedItemsListProps<T> extends React.Props<any> {
   componentRef?: (component?: IBaseSelectedItemsList<T>) => void;
+
+  selection: Selection;
   /**
    * A callback for when items are copied
    */
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
index 3fd25ed60c77a..07055f1731e3f 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
@@ -44,7 +44,7 @@ export class SelectedPeopleList extends BasePeopleSelectedItemsList {
     let filteredExpandedItems = expandedItems.filter((item: any) => items.indexOf(item) === -1);
     if (index > -1) {
       let newItems = items.slice(0, index).concat(filteredExpandedItems).concat(items.slice(index + 1));
-      this.updateSelectedItems(newItems);
+      this.updateItems(newItems);
     }
   }
 
@@ -59,7 +59,7 @@ export class SelectedPeopleList extends BasePeopleSelectedItemsList {
       item,
       index,
       key: item.key ? item.key : index,
-      selected: this.selection.isIndexSelected(index),
+      selected: this.props.selection.isIndexSelected(index),
       onRemoveItem: () => this.removeItem(item),
       onItemChange: this.onItemChange,
       removeButtonAriaLabel: removeButtonAriaLabel,
diff --git a/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx b/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
index b77f6a7a7d775..1402db0f8d37b 100644
--- a/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
@@ -8,12 +8,13 @@ import {
 import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
 import { people, groupOne, groupTwo } from '../../ExtendedPicker';
 import 'office-ui-fabric-react/lib/components/Pickers/PeoplePicker/examples/PeoplePicker.Types.Example.scss';
-import { IBaseSelectedItemsListProps } from '../BaseSelectedItemsList.types';
 import { IExtendedPersonaProps, SelectedPeopleList } from '../SelectedPeopleList/SelectedPeopleList';
+import { Selection } from 'office-ui-fabric-react/lib/Selection';
 
-export class PeopleSelectedItemsListExample extends BaseComponent<IBaseSelectedItemsListProps<IExtendedPersonaProps>, {}> {
+export class PeopleSelectedItemsListExample extends BaseComponent<{}, {}> {
   private _selectionList: SelectedPeopleList;
   private index: number;
+  private selection: Selection = new Selection({ onSelectionChanged: () => this._onSelectionChange() });
 
   public render(): JSX.Element {
     return (
@@ -39,6 +40,7 @@ export class PeopleSelectedItemsListExample extends BaseComponent<IBaseSelectedI
         onExpandGroup={ this._onExpandItem }
         copyMenuItemText={ 'Copy' }
         removeMenuItemText={ 'Remove' }
+        selection={ this.selection }
       />
     );
   }
@@ -65,6 +67,10 @@ export class PeopleSelectedItemsListExample extends BaseComponent<IBaseSelectedI
     this._selectionList.onExpandItem(item, this._getExpandedGroupItems(item as any));
   }
 
+  private _onSelectionChange(): void {
+    this.forceUpdate();
+  }
+
   private _onCopyItems(items: IExtendedPersonaProps[]): string {
     let copyText = '';
     items.forEach((item: IExtendedPersonaProps, index: number) => {

From 1f86b535cf6347ef09ce6c172eb875a0aaf203ea Mon Sep 17 00:00:00 2001
From: chang47 <coralbue@gmail.com>
Date: Wed, 24 Jan 2018 19:28:00 -0800
Subject: [PATCH 1264/1641] Spin Button - Removing aria-hidden and adding
 aria-labels for up/down buttons (#3780)

* removed spin button aria-hiddne property

* updated spin button test to no longer need aria-hidden

* added accessibiltiy labels for spin buttons increment/decrement buttons

* added change file
---
 .../chiechan-accSpinBtn_2018-01-23-22-21.json         | 11 +++++++++++
 .../src/components/SpinButton/SpinButton.tsx          |  6 ++++--
 .../src/components/SpinButton/SpinButton.types.ts     | 10 ++++++++++
 .../SpinButton/__snapshots__/SpinButton.test.tsx.snap |  2 --
 4 files changed, 25 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/chiechan-accSpinBtn_2018-01-23-22-21.json

diff --git a/common/changes/office-ui-fabric-react/chiechan-accSpinBtn_2018-01-23-22-21.json b/common/changes/office-ui-fabric-react/chiechan-accSpinBtn_2018-01-23-22-21.json
new file mode 100644
index 0000000000000..e7e46cd650d0b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/chiechan-accSpinBtn_2018-01-23-22-21.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "spin button - add aria label for decrement and increment buttons",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chiechan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index 43d76e8e109d2..5292a2e5b4b28 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -126,7 +126,9 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
       labelPosition,
       iconProps,
       incrementButtonIcon,
+      incrementButtonAriaLabel,
       decrementButtonIcon,
+      decrementButtonAriaLabel,
       title,
       ariaLabel,
       styles: customStyles,
@@ -197,11 +199,11 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
               checked={ keyboardSpinDirection === KeyboardSpinDirection.up }
               disabled={ disabled }
               iconProps={ incrementButtonIcon }
-              aria-hidden='true'
               onMouseDown={ this._onIncrementMouseDown }
               onMouseLeave={ this._stop }
               onMouseUp={ this._stop }
               tabIndex={ -1 }
+              ariaLabel={ incrementButtonAriaLabel }
             />
             <IconButton
               styles={ getArrowButtonStyles(theme!, false, customDownArrowButtonStyles) }
@@ -209,11 +211,11 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
               checked={ keyboardSpinDirection === KeyboardSpinDirection.down }
               disabled={ disabled }
               iconProps={ decrementButtonIcon }
-              aria-hidden='true'
               onMouseDown={ this._onDecrementMouseDown }
               onMouseLeave={ this._stop }
               onMouseUp={ this._stop }
               tabIndex={ -1 }
+              ariaLabel={ decrementButtonAriaLabel }
             />
           </span>
         </div>
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts
index f00467988a911..513085a989290 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts
@@ -155,6 +155,16 @@ export interface ISpinButtonProps {
    * Theme provided by HOC.
    */
   theme?: ITheme;
+
+  /**
+   * Accessibility label text for the increment button for the benefit of the screen reader.
+   */
+  incrementButtonAriaLabel?: string;
+
+  /**
+   * Accessibility label text for the decrement button for the benefit of the screen reader.
+   */
+  decrementButtonAriaLabel?: string;
 }
 
 export interface ISpinButtonStyles {
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
index 0abcbc137c9f9..928e00cac02cf 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
@@ -146,7 +146,6 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
     >
       <button
         aria-describedby={null}
-        aria-hidden="true"
         aria-label={undefined}
         aria-labelledby={null}
         aria-pressed={false}
@@ -253,7 +252,6 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
       </button>
       <button
         aria-describedby={null}
-        aria-hidden="true"
         aria-label={undefined}
         aria-labelledby={null}
         aria-pressed={false}

From 1da9cd3b4fb56f3c39f6b222f91d59c10804b69a Mon Sep 17 00:00:00 2001
From: Peter Jahn <pejahn@microsoft.com>
Date: Wed, 24 Jan 2018 19:28:55 -0800
Subject: [PATCH 1265/1641] Minor README.md update for styling (#3768)

Fixes a minor docs bug with the `@uifabric/styling` README. `colors` should instead be `palette`. See the value of the object returned from `createTheme` [here](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/styling/src/styles/theme.ts#L107) for an example of what I mean.
---
 packages/styling/README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/styling/README.md b/packages/styling/README.md
index 793b76a8d1e8b..459b48669b1fd 100644
--- a/packages/styling/README.md
+++ b/packages/styling/README.md
@@ -94,7 +94,7 @@ The default palette of colors matches the default Fabric core styling convention
 ```tsx
 import {
   loadTheme({
-    colors: {
+    palette: {
       themePrimary: 'red',
       themeSeconary: 'blue'
     }

From a2864f8c6d0fc2b271c952b9929767ed760660ab Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Wed, 24 Jan 2018 19:31:13 -0800
Subject: [PATCH 1266/1641] CalloutContent: Convert CalloutContent to JS
 Styling (#3745)

* Add base callout file

* Rename file to CalloutContent.base

* CalloutContentbase

* Callout content styling

* Callout content styling

* Add hostid

* Revert "Add hostid"

This reverts commit d5a842d8ebc099fa4652d7abd7205bdfcf033b0a.

* Animation styles

* Refactor base callout content to use js styling

* Create calloutContent const

* Fix import

* Styling changes

* FIx beak background styling and boxShadow

* Fix callout width

* Add inline styling from popup

* Remove callout.scss file

* Add change file

* Update snapshot and maxheight and masfontsize to CSSPixelUnitRule

* Add focus clear mixin to styling package an use it

* Add remaining change files

* Add base callout file

* Rename file to CalloutContent.base

* CalloutContentbase

* Callout content styling

* Callout content styling

* Animation styles

* Refactor base callout content to use js styling

* Create calloutContent const

* Fix import

* Styling changes

* FIx beak background styling and boxShadow

* Fix callout width

* Add inline styling from popup

* Remove callout.scss file

* Add change file

* Update snapshot and maxheight and masfontsize to CSSPixelUnitRule

* Add focus clear mixin to styling package an use it

* Add remaining change files

* Add comments

* Add comment for beak style

* Test using CalloutContent

* Use spread operator
---
 ...ozano-CalloutStyling_2018-01-19-02-15.json |  11 +
 ...ozano-CalloutStyling_2018-01-19-02-15.json |  11 +
 ...ozano-CalloutStyling_2018-01-18-23-58.json |  11 +
 package.json                                  |   2 +-
 packages/merge-styles/api/merge-styles.api.ts |  10 +-
 packages/merge-styles/src/IRawStyleBase.ts    |   4 +-
 packages/office-ui-fabric-react/package.json  |   2 +-
 .../src/components/Callout/Callout.scss       |  63 ---
 .../src/components/Callout/Callout.test.tsx   |   9 +-
 .../src/components/Callout/Callout.tsx        |   3 +-
 .../src/components/Callout/Callout.types.ts   |  90 +++-
 .../Callout/CalloutContent.base.tsx           | 397 ++++++++++++++++
 .../Callout/CalloutContent.styles.ts          | 141 ++++++
 .../src/components/Callout/CalloutContent.tsx | 435 +-----------------
 .../__snapshots__/Callout.test.tsx.snap       |  46 +-
 packages/styling/src/styles/getFocusStyle.ts  |  18 +
 packages/styling/src/styles/index.ts          |   2 +-
 17 files changed, 741 insertions(+), 514 deletions(-)
 create mode 100644 common/changes/@uifabric/merge-styles/malozano-CalloutStyling_2018-01-19-02-15.json
 create mode 100644 common/changes/@uifabric/styling/malozano-CalloutStyling_2018-01-19-02-15.json
 create mode 100644 common/changes/office-ui-fabric-react/malozano-CalloutStyling_2018-01-18-23-58.json
 delete mode 100644 packages/office-ui-fabric-react/src/components/Callout/Callout.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Callout/CalloutContent.styles.ts

diff --git a/common/changes/@uifabric/merge-styles/malozano-CalloutStyling_2018-01-19-02-15.json b/common/changes/@uifabric/merge-styles/malozano-CalloutStyling_2018-01-19-02-15.json
new file mode 100644
index 0000000000000..c78ec0e73a2a0
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/malozano-CalloutStyling_2018-01-19-02-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "Change maxHeight/maxFontSize to CSSPixelUnitRule (number and string)",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/malozano-CalloutStyling_2018-01-19-02-15.json b/common/changes/@uifabric/styling/malozano-CalloutStyling_2018-01-19-02-15.json
new file mode 100644
index 0000000000000..b57065ec40b9e
--- /dev/null
+++ b/common/changes/@uifabric/styling/malozano-CalloutStyling_2018-01-19-02-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Add focus clear func to styling and change maxheight/maxfontsize to CSSPixelUnitRule ",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/malozano-CalloutStyling_2018-01-18-23-58.json b/common/changes/office-ui-fabric-react/malozano-CalloutStyling_2018-01-18-23-58.json
new file mode 100644
index 0000000000000..98111973689a3
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-CalloutStyling_2018-01-18-23-58.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Callout: Convert component to JS Styling",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/package.json b/package.json
index bdcdc5f08fce9..e0d02cda28eb4 100644
--- a/package.json
+++ b/package.json
@@ -29,4 +29,4 @@
   "devDependencies": {
     "@microsoft/rush": "4.1.0"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/merge-styles/api/merge-styles.api.ts b/packages/merge-styles/api/merge-styles.api.ts
index d0fc53e5dab8f..eb475fd14c0c8 100644
--- a/packages/merge-styles/api/merge-styles.api.ts
+++ b/packages/merge-styles/api/merge-styles.api.ts
@@ -1,5 +1,5 @@
 // @public
-export function concatStyleSets < T extends object >(...args: (T | false | null | undefined)[]): T;
+export function concatStyleSets<T extends object>(...args: (T | false | null | undefined)[]): T;
 
 // @public
 export function fontFace(font: IFontFace): void;
@@ -8,7 +8,7 @@ export function fontFace(font: IFontFace): void;
 interface IExtendedRawStyle extends IRawStyle {
   displayName?: string;
   selectors?: {
-    [ key: string ]: IStyle;
+    [key: string]: IStyle;
   }
 }
 
@@ -161,8 +161,8 @@ interface IRawStyle extends IRawFontStyle {
   maskBorderWidth?: ICSSRule | ICSSPixelUnitRule;
   maskClip?: ICSSRule | string;
   maskOrigin?: ICSSRule | string;
-  maxFontSize?: ICSSRule | string;
-  maxHeight?: ICSSRule | string;
+  maxFontSize?: ICSSRule | ICSSPixelUnitRule;
+  maxHeight?: ICSSRule | ICSSPixelUnitRule;
   maxWidth?: ICSSRule | ICSSPixelUnitRule;
   minHeight?: ICSSRule | ICSSPixelUnitRule;
   minWidth?: ICSSRule | ICSSPixelUnitRule;
@@ -282,7 +282,7 @@ export function keyframes(timeline: { [key: string]: {} }): string;
 export function mergeStyles(...args: (IStyle | IStyle[] | false | null | undefined)[]): string;
 
 // @public
-export function mergeStyleSets < T extends object >(...cssSets: (T | false | null | undefined)[]): {[P in keyof T]?: string };
+export function mergeStyleSets<T extends object>(...cssSets: (T | false | null | undefined)[]): {[P in keyof T]?: string };
 
 // @public
 class Stylesheet {
diff --git a/packages/merge-styles/src/IRawStyleBase.ts b/packages/merge-styles/src/IRawStyleBase.ts
index 7eec66334a749..a1e8ce30117a2 100644
--- a/packages/merge-styles/src/IRawStyleBase.ts
+++ b/packages/merge-styles/src/IRawStyleBase.ts
@@ -1053,14 +1053,14 @@ export interface IRawStyleBase extends IRawFontStyle {
    * used when the text-align-last property is set to size. It controls allowed
    * adjustments of font-size to fit line content.
    */
-  maxFontSize?: ICSSRule | string;
+  maxFontSize?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * Sets the maximum height for an element. It prevents the height of the element to
    *  exceed the specified value. If min-height is specified and is greater than
    * max-height, max-height is overridden.
    */
-  maxHeight?: ICSSRule | string;
+  maxHeight?: ICSSRule | ICSSPixelUnitRule;
 
   /**
    * Sets the maximum width for an element. It limits the width property to be larger
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 232255f48eeac..b7f6d1539d3e2 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -58,4 +58,4 @@
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss b/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
deleted file mode 100644
index 0567f787fa7a1..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.scss
+++ /dev/null
@@ -1,63 +0,0 @@
-@import '../../common/common';
-
-// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
-
-//
-// Office UI Fabric
-// --------------------------------------------------
-// Callout styles
-
-$Callout-beak-slant-width: 28px;
-$Callout-smallbeak-slant-width: 16px;
-
-@mixin calloutBeak {
-  position: absolute;
-  background-color: $ms-color-white;
-  box-shadow:  inherit;
-  border: inherit;
-  box-sizing: border-box;
-  -webkit-transform: rotate(45deg);
-  -ms-transform: rotate(45deg);
-  transform: rotate(45deg);
-}
-
-.root {
-  @include ms-drop-shadow(0,0, 5px, 0px);
-  position: absolute;
-  box-sizing: border-box;
-  border: 1px solid $ms-color-neutralLight;
-
-  @include focus-clear();
-
-  @include high-contrast {
-    border: 1px solid WindowText;
-  }
-}
-
-.container {
-  position: relative;
-}
-
-// The actual callout element
-.main {
-  background-color: $ms-color-white;
-  overflow-x: hidden;
-  position: relative;
-}
-
-.overFlowYHidden {
-  overflow-y: hidden;
-}
-
-.beak {
-  @include calloutBeak;
-}
-
-.beakCurtain {
-  position: absolute;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
-  background-color: $ms-color-white;
-}
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx b/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
index 8b930ff32d90a..623f2f333f7e7 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
@@ -6,9 +6,16 @@ import * as ReactDOM from 'react-dom';
 import * as ReactTestUtils from 'react-dom/test-utils';
 import * as renderer from 'react-test-renderer';
 import { Callout } from './Callout';
+import { ICalloutProps } from './Callout.types';
 import { CalloutContent } from './CalloutContent';
 import { DirectionalHint } from '../../common/DirectionalHint';
 
+class CalloutContentWrapper extends React.Component<ICalloutProps, {}> {
+  public render(): JSX.Element {
+    return <CalloutContent { ...this.props } />;
+  }
+}
+
 describe('Callout', () => {
 
   it('renders Callout correctly', () => {
@@ -18,7 +25,7 @@ describe('Callout', () => {
       };
     };
     const component = renderer.create(
-      <CalloutContent>Content</CalloutContent>,
+      <CalloutContentWrapper>Content</CalloutContentWrapper>,
       { createNodeMock }
     );
     let tree = component.toJSON();
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.tsx b/packages/office-ui-fabric-react/src/components/Callout/Callout.tsx
index 8edf334dc2912..b8c8127d2383d 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.tsx
@@ -4,7 +4,8 @@ import * as React from 'react';
 
 import { BaseComponent } from '../../Utilities';
 import { ICalloutProps } from './Callout.types';
-import { ICalloutState, CalloutContent } from './CalloutContent';
+import { ICalloutState } from './CalloutContent.base';
+import { CalloutContent } from './CalloutContent';
 import { Layer } from '../../Layer';
 
 export class Callout extends BaseComponent<ICalloutProps, ICalloutState> {
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts b/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
index d8e4fb805be7b..82c5f6f83e73f 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { Callout } from './Callout';
+import { IStyle, ITheme } from '../../Styling';
 import { CalloutContent } from './CalloutContent';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import {
@@ -7,12 +8,13 @@ import {
   IRectangle
 } from '../../Utilities';
 import { ICalloutPositionedInfo } from '../../utilities/positioning';
+import { IStyleFunction } from '../../Utilities';
 
 export interface ICallout {
 
 }
 
-export interface ICalloutProps extends React.Props<Callout | CalloutContent> {
+export interface ICalloutProps {
   /**
    * Optional callback to access the ICallout interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
@@ -192,4 +194,90 @@ export interface ICalloutProps extends React.Props<Callout | CalloutContent> {
    * Callback when the Callout body is scrolled.
    */
   onScroll?: () => void;
+
+  /**
+   * Optional theme for component
+   */
+  theme?: ITheme;
+
+  /**
+  * Optional styles for the component.
+  */
+  getStyles?: IStyleFunction<ICalloutContentStyleProps, ICalloutContentStyles>;
+}
+
+export interface ICalloutContentStyleProps {
+  /**
+   * Theme to apply to the calloutContent.
+   */
+  theme: ITheme;
+
+  /**
+   * Width for callout including borders.
+   */
+  calloutWidth?: number;
+
+  /**
+ * CSS class to apply to the callout.
+ */
+  className?: string;
+
+  /**
+   * Callout positioning data
+   */
+  positions?: ICalloutPositionedInfo;
+
+  /**
+   * Whether or not to clip content of the callout,
+   * if it overflows vertically.
+   */
+  overflowYHidden?: boolean;
+
+  /**
+   * Max height applied to the content of a callout.
+   */
+  contentMaxHeight?: number;
+
+  /**
+   * Background color for the beak and callout.
+   */
+  backgroundColor?: string;
+
+  /**
+   * Width of Callout beak
+   */
+  beakWidth?: number;
+
+  /**
+    * Deprecated at v0.59.1, to be removed at >= v1.0.0. Pass in a beakWidth to dictate size.
+    * @deprecated
+    */
+  beakStyle?: string;
+}
+
+export interface ICalloutContentStyles {
+  /**
+   * Style for wrapper of Callout component.
+   */
+  container: IStyle;
+
+  /**
+  * Style for callout container root element.
+  */
+  root: IStyle;
+
+  /**
+  * Style for callout beak.
+  */
+  beak: IStyle;
+
+  /**
+  * Style for callout beak curtain.
+  */
+  beakCurtain: IStyle;
+
+  /**
+  * Style for content component of the callout.
+  */
+  calloutMain: IStyle;
 }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
new file mode 100644
index 0000000000000..9ecce2d43dd3e
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
@@ -0,0 +1,397 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+import {
+  ICalloutProps,
+  ICalloutContentStyleProps,
+  ICalloutContentStyles
+} from './Callout.types';
+import { DirectionalHint } from '../../common/DirectionalHint';
+import {
+  BaseComponent,
+  IPoint,
+  IRectangle,
+  assign,
+  autobind,
+  css,
+  elementContains,
+  focusFirstChild,
+  getWindow,
+  getDocument,
+  customizable
+} from '../../Utilities';
+import {
+  positionCallout,
+  ICalloutPositionedInfo,
+  IPositionProps,
+  getMaxHeight,
+  IPosition,
+  RectangleEdge
+} from '../../utilities/positioning';
+import { Popup } from '../../Popup';
+import { classNamesFunction } from '../../Utilities';
+
+const getClassNames = classNamesFunction<ICalloutContentStyleProps, ICalloutContentStyles>();
+const BORDER_WIDTH: number = 1;
+
+export interface ICalloutState {
+  positions?: ICalloutPositionedInfo;
+  slideDirectionalClassName?: string;
+  calloutElementRect?: ClientRect;
+  heightOffset?: number;
+}
+
+@customizable('CalloutContent', ['theme'])
+export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutState> {
+
+  public static defaultProps = {
+    preventDismissOnScroll: false,
+    isBeakVisible: true,
+    beakWidth: 16,
+    gapSpace: 0,
+    minPagePadding: 8,
+    directionalHint: DirectionalHint.bottomAutoEdge
+  };
+
+  private _classNames: {[key in keyof ICalloutContentStyles]: string };
+  private _didSetInitialFocus: boolean;
+  private _hostElement: HTMLDivElement;
+  private _calloutElement: HTMLDivElement;
+  private _targetWindow: Window;
+  private _bounds: IRectangle;
+  private _maxHeight: number | undefined;
+  private _positionAttempts: number;
+  private _target: HTMLElement | MouseEvent | IPoint | null;
+  private _setHeightOffsetTimer: number;
+
+  constructor(props: ICalloutProps) {
+    super(props);
+
+    this._warnDeprecations({ 'beakStyle': 'beakWidth' });
+
+    this._didSetInitialFocus = false;
+    this.state = {
+      positions: undefined,
+      slideDirectionalClassName: undefined,
+      // @TODO it looks like this is not even being used anymore.
+      calloutElementRect: undefined,
+      heightOffset: 0
+    };
+    this._positionAttempts = 0;
+  }
+
+  public componentDidUpdate() {
+    this._setInitialFocus();
+    this._updateAsyncPosition();
+  }
+
+  public componentWillMount() {
+    this._setTargetWindowAndElement(this._getTarget());
+  }
+
+  public componentWillUpdate(newProps: ICalloutProps) {
+    // If the target element changed, find the new one. If we are tracking target with class name, always find element because we do not know if fabric has rendered a new element and disposed the old element.
+    let newTarget = this._getTarget(newProps);
+    let oldTarget = this._getTarget();
+    if (newTarget !== oldTarget || typeof (newTarget) === 'string' || newTarget instanceof String) {
+      this._maxHeight = undefined;
+      this._setTargetWindowAndElement(newTarget!);
+    }
+    if (newProps.gapSpace !== this.props.gapSpace || this.props.beakWidth !== newProps.beakWidth) {
+      this._maxHeight = undefined;
+    }
+
+    if (newProps.finalHeight !== this.props.finalHeight) {
+      this._setHeightOffsetEveryFrame();
+    }
+  }
+
+  public componentDidMount() {
+    this._onComponentDidMount();
+  }
+
+  public render() {
+    // If there is no target window then we are likely in server side rendering and we should not render anything.
+    if (!this._targetWindow) {
+      return null;
+    }
+    let {
+      getStyles,
+      role,
+      ariaLabel,
+      ariaDescribedBy,
+      ariaLabelledBy,
+      className,
+      target,
+      isBeakVisible,
+      beakStyle,
+      children,
+      beakWidth,
+      calloutWidth,
+      finalHeight,
+      backgroundColor,
+      calloutMaxHeight,
+      onScroll,
+       } = this.props;
+    target = this._getTarget();
+    let { positions } = this.state;
+
+    let getContentMaxHeight: number = this._getMaxHeight() + this.state.heightOffset!;
+    let contentMaxHeight: number = calloutMaxHeight! && (calloutMaxHeight! < getContentMaxHeight) ? calloutMaxHeight! : getContentMaxHeight!;
+
+    let beakVisible = isBeakVisible && (!!target);
+    this._classNames = getClassNames(
+      getStyles!,
+      {
+        theme: this.props.theme!,
+        className,
+        overflowYHidden: !!finalHeight,
+        calloutWidth,
+        contentMaxHeight,
+        positions,
+        beakWidth,
+        backgroundColor,
+        beakStyle
+      }
+    );
+
+    let content = (
+      <div
+        ref={ this._resolveRef('_hostElement') }
+        className={ this._classNames.container }
+      >
+        <div
+          className={ this._classNames.root }
+          tabIndex={ -1 } // Safari and Firefox on Mac OS requires this to back-stop click events so focus remains in the Callout.
+          // See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus
+          ref={ this._resolveRef('_calloutElement') }
+        >
+
+          { beakVisible && (
+            <div
+              className={ this._classNames.beak }
+            />) }
+          { beakVisible &&
+            (<div className={ this._classNames.beakCurtain } />) }
+          <Popup
+            role={ role }
+            ariaLabel={ ariaLabel }
+            ariaDescribedBy={ ariaDescribedBy }
+            ariaLabelledBy={ ariaLabelledBy }
+            className={ this._classNames.calloutMain }
+            onDismiss={ this.dismiss }
+            onScroll={ onScroll }
+            shouldRestoreFocus={ true }
+          >
+            { children }
+          </Popup>
+        </div>
+      </div>
+    );
+
+    return content;
+  }
+
+  @autobind
+  public dismiss(ev?: Event | React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) {
+    let { onDismiss } = this.props;
+
+    if (onDismiss) {
+      onDismiss(ev);
+    }
+  }
+
+  protected _dismissOnScroll(ev: Event) {
+    const { preventDismissOnScroll } = this.props;
+    if (this.state.positions && !preventDismissOnScroll) {
+      this._dismissOnLostFocus(ev);
+    }
+  }
+
+  protected _dismissOnLostFocus(ev: Event) {
+    let target = ev.target as HTMLElement;
+    let clickedOutsideCallout = this._hostElement && !elementContains(this._hostElement, target);
+
+    if (
+      (!this._target && clickedOutsideCallout) ||
+      ev.target !== this._targetWindow &&
+      clickedOutsideCallout &&
+      ((this._target as MouseEvent).stopPropagation ||
+        (!this._target || (target !== this._target && !elementContains(this._target as HTMLElement, target))))) {
+      this.dismiss(ev);
+    }
+  }
+
+  @autobind
+  protected _setInitialFocus() {
+    if (this.props.setInitialFocus && !this._didSetInitialFocus && this.state.positions) {
+      this._didSetInitialFocus = true;
+      focusFirstChild(this._calloutElement);
+    }
+  }
+
+  @autobind
+  protected _onComponentDidMount() {
+    // This is added so the callout will dismiss when the window is scrolled
+    // but not when something inside the callout is scrolled. The delay seems
+    // to be required to avoid React firing an async focus event in IE from
+    // the target changing focus quickly prior to rendering the callout.
+    this._async.setTimeout(() => {
+      this._events.on(this._targetWindow, 'scroll', this._dismissOnScroll, true);
+      this._events.on(this._targetWindow, 'resize', this.dismiss, true);
+      this._events.on(this._targetWindow.document.body, 'focus', this._dismissOnLostFocus, true);
+      this._events.on(this._targetWindow.document.body, 'click', this._dismissOnLostFocus, true);
+    }, 0);
+
+    if (this.props.onLayerMounted) {
+      this.props.onLayerMounted();
+    }
+
+    this._updateAsyncPosition();
+    this._setHeightOffsetEveryFrame();
+  }
+
+  private _updateAsyncPosition() {
+    this._async.requestAnimationFrame(() => this._updatePosition());
+  }
+
+  private _updatePosition() {
+    let { positions } = this.state;
+    let hostElement: HTMLElement = this._hostElement;
+    let calloutElement: HTMLElement = this._calloutElement;
+
+    if (hostElement && calloutElement) {
+      let currentProps: IPositionProps | undefined;
+      currentProps = assign(currentProps, this.props);
+      currentProps!.bounds = this._getBounds();
+      currentProps!.target = this._target!;
+      let newPositions: ICalloutPositionedInfo = positionCallout(currentProps!, hostElement, calloutElement);
+
+      // Set the new position only when the positions are not exists or one of the new callout positions are different.
+      // The position should not change if the position is within 2 decimal places.
+      if ((!positions && newPositions) ||
+        (positions && newPositions && !this._arePositionsEqual(positions, newPositions)
+          && this._positionAttempts < 5)) {
+        // We should not reposition the callout more than a few times, if it is then the content is likely resizing
+        // and we should stop trying to reposition to prevent a stack overflow.
+        this._positionAttempts++;
+        this.setState({
+          positions: newPositions
+        });
+      } else {
+        this._positionAttempts = 0;
+        if (this.props.onPositioned) {
+          this.props.onPositioned(this.state.positions);
+        }
+      }
+    }
+  }
+
+  private _getBounds(): IRectangle {
+    if (!this._bounds) {
+      let currentBounds = this.props.bounds;
+
+      if (!currentBounds) {
+        currentBounds = {
+          top: 0 + this.props.minPagePadding!,
+          left: 0 + this.props.minPagePadding!,
+          right: this._targetWindow.innerWidth - this.props.minPagePadding!,
+          bottom: this._targetWindow.innerHeight - this.props.minPagePadding!,
+          width: this._targetWindow.innerWidth - this.props.minPagePadding! * 2,
+          height: this._targetWindow.innerHeight - this.props.minPagePadding! * 2
+        };
+      }
+      this._bounds = currentBounds;
+    }
+    return this._bounds;
+  }
+
+  private _getMaxHeight(): number {
+    if (!this._maxHeight) {
+      if (this.props.directionalHintFixed && this._target) {
+        let beakWidth = this.props.isBeakVisible ? this.props.beakWidth : 0;
+        let gapSpace = this.props.gapSpace ? this.props.gapSpace : 0;
+        // Since the callout cannot measure it's border size it must be taken into account here. Otherwise it will
+        // overlap with the target.
+        const totalGap = gapSpace + beakWidth! + BORDER_WIDTH * 2;
+        this._maxHeight = getMaxHeight(this._target, this.props.directionalHint!, totalGap, this._getBounds());
+      } else {
+        this._maxHeight = this._getBounds().height! - BORDER_WIDTH * 2;
+      }
+    }
+    return this._maxHeight!;
+  }
+
+  private _arePositionsEqual(positions: ICalloutPositionedInfo, newPosition: ICalloutPositionedInfo) {
+    return this._comparePositions(positions.elementPosition, newPosition.elementPosition) &&
+      this._comparePositions(positions.beakPosition.elementPosition, newPosition.beakPosition.elementPosition);
+  }
+
+  private _comparePositions(oldPositions: IPosition, newPositions: IPosition) {
+    for (const key in newPositions) {
+      // This needs to be checked here and below because there is a linting error if for in does not immediately have an if statement
+      if (newPositions.hasOwnProperty(key)) {
+        const oldPositionEdge = oldPositions[key];
+        const newPositionEdge = newPositions[key];
+
+        if (oldPositionEdge !== undefined && newPositionEdge !== undefined) {
+          if (oldPositionEdge.toFixed(2) !== newPositionEdge.toFixed(2)) {
+            return false;
+          }
+        } else {
+          return false;
+        }
+      }
+    }
+    return true;
+  }
+
+  private _setTargetWindowAndElement(target: HTMLElement | string | MouseEvent | IPoint | null): void {
+    if (target) {
+      if (typeof target === 'string') {
+        let currentDoc: Document = getDocument()!;
+        this._target = currentDoc ? currentDoc.querySelector(target) as HTMLElement : null;
+        this._targetWindow = getWindow()!;
+      } else if ((target as MouseEvent).stopPropagation) {
+        this._targetWindow = getWindow((target as MouseEvent).toElement as HTMLElement)!;
+        this._target = target;
+      } else if ((target as HTMLElement).getBoundingClientRect) {
+        let targetElement: HTMLElement = target as HTMLElement;
+        this._targetWindow = getWindow(targetElement)!;
+        this._target = target;
+        // HTMLImgElements can have x and y values. The check for it being a point must go last.
+      } else {
+        this._targetWindow = getWindow()!;
+        this._target = target;
+      }
+    } else {
+      this._targetWindow = getWindow()!;
+    }
+  }
+
+  private _setHeightOffsetEveryFrame(): void {
+    if (this._calloutElement && this.props.finalHeight) {
+      this._setHeightOffsetTimer = this._async.requestAnimationFrame(() => {
+        const calloutMainElem = this._calloutElement.lastChild as HTMLElement;
+        const cardScrollHeight: number = calloutMainElem.scrollHeight;
+        const cardCurrHeight: number = calloutMainElem.offsetHeight;
+        const scrollDiff: number = cardScrollHeight - cardCurrHeight;
+
+        this.setState({
+          heightOffset: this.state.heightOffset! + scrollDiff
+        });
+
+        if (calloutMainElem.offsetHeight < this.props.finalHeight!) {
+          this._setHeightOffsetEveryFrame();
+        } else {
+          this._async.cancelAnimationFrame(this._setHeightOffsetTimer);
+        }
+      });
+    }
+  }
+
+  private _getTarget(props: ICalloutProps = this.props): HTMLElement | string | MouseEvent | IPoint | null {
+    let { useTargetPoint, targetPoint, target } = props;
+    return useTargetPoint ? targetPoint! : target!;
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.styles.ts b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.styles.ts
new file mode 100644
index 0000000000000..327cf4dd38f6e
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.styles.ts
@@ -0,0 +1,141 @@
+import {
+  HighContrastSelector,
+  AnimationStyles,
+  IRawStyle,
+  focusClear
+} from '../../Styling';
+import {
+  ICalloutPositionedInfo,
+  RectangleEdge
+} from '../../utilities/positioning';
+import { ICalloutContentStyleProps, ICalloutContentStyles } from './Callout.types';
+
+const BEAK_ORIGIN_POSITION = { top: 0, left: 0 };
+
+const ANIMATIONS: { [key: number]: IRawStyle; } = {
+  [RectangleEdge.top]: AnimationStyles.slideUpIn20,
+  [RectangleEdge.bottom]: AnimationStyles.slideDownIn20,
+  [RectangleEdge.left]: AnimationStyles.slideLeftIn20,
+  [RectangleEdge.right]: AnimationStyles.slideRightIn20,
+};
+
+function getBeakStylePosition(positions?: ICalloutPositionedInfo,
+  beakWidth?: number,
+  beakStyle?: string): IRawStyle {
+  let beakStyleWidth = beakWidth;
+
+  // This is here to support the old way of setting the beak size until version 1.0.0.
+  // beakStyle is now deprecated and will be be removed at version 1.0.0
+  if (beakStyle === 'ms-Callout-smallbeak') {
+    beakStyleWidth = 16;
+  }
+
+  let beakReactStyle: IRawStyle = {
+    ...(positions && positions.beakPosition ? positions.beakPosition.elementPosition : null),
+  };
+  beakReactStyle.height = beakStyleWidth;
+  beakReactStyle.width = beakStyleWidth;
+  if (!beakReactStyle.top && !beakReactStyle.bottom && !beakReactStyle.left && !beakReactStyle.right) {
+    beakReactStyle.left = BEAK_ORIGIN_POSITION.left;
+    beakReactStyle.top = BEAK_ORIGIN_POSITION.top;
+  }
+
+  return beakReactStyle;
+}
+
+export const getStyles = (props: ICalloutContentStyleProps): ICalloutContentStyles => {
+  const {
+    theme,
+    className,
+    overflowYHidden,
+    calloutWidth,
+    contentMaxHeight,
+    positions,
+    beakWidth,
+    backgroundColor,
+    beakStyle
+  } = props;
+
+  const { palette } = theme;
+  return {
+    container: [
+      'ms-Callout-container',
+      {
+        position: 'relative',
+      }
+    ],
+    root: [
+      'ms-Callout',
+      {
+        position: 'absolute',
+        boxSizing: 'border-box',
+        borderWidth: 1,
+        borderStyle: 'solid',
+        borderColor: palette.neutralLight,
+        boxShadow: '0 0 5px 0px rgba(0,0,0,0.4)',
+        selectors: {
+          [HighContrastSelector]: {
+            borderWidth: 1,
+            borderStyle: 'solid',
+            borderColor: 'WindowText',
+          }
+        }
+      },
+      focusClear(),
+      className,
+      positions && positions.targetEdge && ANIMATIONS[positions.targetEdge],
+      // Microsoft Edge will overwrite inline styles if there is an animation pertaining to that style.
+      // To help ensure that edge will respect the offscreen style opacity
+      // filter needs to be added as an additional way to set opacity.
+      !positions && {
+        opacity: 0,
+        filter: 'opacity(0)',
+      },
+      positions && { ...positions.elementPosition },
+      !!calloutWidth && { width: calloutWidth },
+    ],
+    beak: [
+      'ms-Callout-beak',
+      {
+        position: 'absolute',
+        backgroundColor: palette.white,
+        boxShadow: 'inherit',
+        border: 'inherit',
+        boxSizing: 'border-box',
+        transform: 'rotate(45deg)'
+      },
+      getBeakStylePosition(positions, beakWidth, beakStyle),
+      backgroundColor && {
+        backgroundColor: backgroundColor
+      }
+    ],
+    beakCurtain: [
+      'ms-Callout-beakCurtain',
+      {
+        position: 'absolute',
+        top: 0,
+        right: 0,
+        bottom: 0,
+        left: 0,
+        backgroundColor: palette.white,
+      }
+    ],
+    calloutMain: [
+      'ms-Callout-main',
+      {
+        backgroundColor: palette.white,
+        overflowX: 'hidden',
+        overflowY: 'auto',
+        position: 'relative',
+        maxHeight: contentMaxHeight
+      },
+      !!calloutWidth && { width: calloutWidth },
+      overflowYHidden && {
+        overflowY: 'hidden'
+      },
+      backgroundColor && {
+        backgroundColor: backgroundColor
+      }
+    ],
+  };
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
index 7c597ac6b54b9..bab78ae1af389 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.tsx
@@ -1,432 +1,13 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
-/* tslint:enable:no-unused-variable */
-import { ICalloutProps } from './Callout.types';
-import { DirectionalHint } from '../../common/DirectionalHint';
 import {
-  BaseComponent,
-  IPoint,
-  IRectangle,
-  assign,
-  autobind,
-  css,
-  elementContains,
-  focusFirstChild,
-  getWindow,
-  getDocument
+  styled
 } from '../../Utilities';
-import {
-  positionCallout,
-  ICalloutPositionedInfo,
-  IPositionProps,
-  getMaxHeight,
-  IPosition,
-  RectangleEdge
-} from '../../utilities/positioning';
-import { Popup } from '../../Popup';
-import * as stylesImport from './Callout.scss';
-import { AnimationClassNames, mergeStyles } from '../../Styling';
-
-const styles: any = stylesImport;
-
-const BEAK_ORIGIN_POSITION = { top: 0, left: 0 };
-// Microsoft Edge will overwrite inline styles if there is an animation pertaining to that style.
-// To help ensure that edge will respect the offscreen style opacity
-// filter needs to be added as an additional way to set opacity.
-const OFF_SCREEN_STYLE = { opacity: 0, filter: 'opacity(0)' };
-const BORDER_WIDTH: number = 1;
-const SLIDE_ANIMATIONS: { [key: number]: string; } = {
-  [RectangleEdge.top]: 'slideUpIn20',
-  [RectangleEdge.bottom]: 'slideDownIn20',
-  [RectangleEdge.left]: 'slideLeftIn20',
-  [RectangleEdge.right]: 'slideRightIn20'
-};
-
-export interface ICalloutState {
-  positions?: ICalloutPositionedInfo;
-  slideDirectionalClassName?: string;
-  calloutElementRect?: ClientRect;
-  heightOffset?: number;
-}
-
-export class CalloutContent extends BaseComponent<ICalloutProps, ICalloutState> {
-
-  public static defaultProps = {
-    preventDismissOnScroll: false,
-    isBeakVisible: true,
-    beakWidth: 16,
-    gapSpace: 0,
-    minPagePadding: 8,
-    directionalHint: DirectionalHint.bottomAutoEdge
-  };
-
-  private _didSetInitialFocus: boolean;
-  private _hostElement: HTMLDivElement;
-  private _calloutElement: HTMLDivElement;
-  private _targetWindow: Window;
-  private _bounds: IRectangle;
-  private _maxHeight: number | undefined;
-  private _positionAttempts: number;
-  private _target: HTMLElement | MouseEvent | IPoint | null;
-  private _setHeightOffsetTimer: number;
-
-  constructor(props: ICalloutProps) {
-    super(props);
-
-    this._warnDeprecations({ 'beakStyle': 'beakWidth' });
-
-    this._didSetInitialFocus = false;
-    this.state = {
-      positions: undefined,
-      slideDirectionalClassName: undefined,
-      // @TODO it looks like this is not even being used anymore.
-      calloutElementRect: undefined,
-      heightOffset: 0
-    };
-    this._positionAttempts = 0;
-  }
-
-  public componentDidUpdate() {
-    this._setInitialFocus();
-    this._updateAsyncPosition();
-  }
-
-  public componentWillMount() {
-    this._setTargetWindowAndElement(this._getTarget());
-  }
-
-  public componentWillUpdate(newProps: ICalloutProps) {
-    // If the target element changed, find the new one. If we are tracking target with class name, always find element because we do not know if fabric has rendered a new element and disposed the old element.
-    let newTarget = this._getTarget(newProps);
-    let oldTarget = this._getTarget();
-    if (newTarget !== oldTarget || typeof (newTarget) === 'string' || newTarget instanceof String) {
-      this._maxHeight = undefined;
-      this._setTargetWindowAndElement(newTarget!);
-    }
-    if (newProps.gapSpace !== this.props.gapSpace || this.props.beakWidth !== newProps.beakWidth) {
-      this._maxHeight = undefined;
-    }
-
-    if (newProps.finalHeight !== this.props.finalHeight) {
-      this._setHeightOffsetEveryFrame();
-    }
-  }
-
-  public componentDidMount() {
-    this._onComponentDidMount();
-  }
-
-  public render() {
-    // If there is no target window then we are likely in server side rendering and we should not render anything.
-    if (!this._targetWindow) {
-      return null;
-    }
-    let {
-      role,
-      ariaLabel,
-      ariaDescribedBy,
-      ariaLabelledBy,
-      className,
-      target,
-      isBeakVisible,
-      beakStyle,
-      children,
-      beakWidth,
-      calloutWidth,
-      finalHeight,
-      backgroundColor,
-      calloutMaxHeight,
-      onScroll } = this.props;
-    target = this._getTarget();
-    let { positions } = this.state;
-
-    let directionalClassName = (positions && positions.targetEdge)
-      ? (AnimationClassNames as any)[SLIDE_ANIMATIONS[positions.targetEdge]]
-      : '';
-
-    let getContentMaxHeight: number = this._getMaxHeight() + this.state.heightOffset!;
-    let contentMaxHeight: number = calloutMaxHeight! && (calloutMaxHeight! < getContentMaxHeight) ? calloutMaxHeight! : getContentMaxHeight!;
-
-    const beakReactStyle = this._getBeakPosition(positions, beakWidth, backgroundColor, beakStyle);
-
-    let beakVisible = isBeakVisible && (!!target);
-
-    let content = (
-      <div
-        ref={ this._resolveRef('_hostElement') }
-        className={ css('ms-Callout-container', styles.container) }
-      >
-        <div
-          className={
-            mergeStyles(
-              'ms-Callout',
-              styles.root,
-              className,
-              directionalClassName,
-              !!calloutWidth && { width: calloutWidth }
-            ) }
-          style={ positions ? positions.elementPosition : OFF_SCREEN_STYLE }
-          tabIndex={ -1 } // Safari and Firefox on Mac OS requires this to back-stop click events so focus remains in the Callout.
-          // See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus
-          ref={ this._resolveRef('_calloutElement') }
-        >
-
-          { beakVisible && (
-            <div
-              className={ css('ms-Callout-beak', styles.beak) }
-              style={ beakReactStyle }
-            />) }
-
-          { beakVisible &&
-            (<div className={ css('ms-Callout-beakCurtain', styles.beakCurtain) } />) }
-          <Popup
-            role={ role }
-            ariaLabel={ ariaLabel }
-            ariaDescribedBy={ ariaDescribedBy }
-            ariaLabelledBy={ ariaLabelledBy }
-            className={ css('ms-Callout-main', styles.main, {
-              [styles.overFlowYHidden]: !!finalHeight
-            }) }
-            onDismiss={ this.dismiss }
-            onScroll={ onScroll }
-            shouldRestoreFocus={ true }
-            style={ { maxHeight: contentMaxHeight, backgroundColor: backgroundColor } }
-          >
-            { children }
-          </Popup>
-        </div>
-      </div>
-    );
-
-    return content;
-  }
-
-  @autobind
-  public dismiss(ev?: Event | React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) {
-    let { onDismiss } = this.props;
-
-    if (onDismiss) {
-      onDismiss(ev);
-    }
-  }
-
-  protected _dismissOnScroll(ev: Event) {
-    const { preventDismissOnScroll } = this.props;
-    if (this.state.positions && !preventDismissOnScroll) {
-      this._dismissOnLostFocus(ev);
-    }
-  }
-
-  protected _dismissOnLostFocus(ev: Event) {
-    let target = ev.target as HTMLElement;
-    let clickedOutsideCallout = this._hostElement && !elementContains(this._hostElement, target);
-
-    if (
-      (!this._target && clickedOutsideCallout) ||
-      ev.target !== this._targetWindow &&
-      clickedOutsideCallout &&
-      ((this._target as MouseEvent).stopPropagation ||
-        (!this._target || (target !== this._target && !elementContains(this._target as HTMLElement, target))))) {
-      this.dismiss(ev);
-    }
-  }
-
-  @autobind
-  protected _setInitialFocus() {
-    if (this.props.setInitialFocus && !this._didSetInitialFocus && this.state.positions) {
-      this._didSetInitialFocus = true;
-      focusFirstChild(this._calloutElement);
-    }
-  }
-
-  @autobind
-  protected _onComponentDidMount() {
-    // This is added so the callout will dismiss when the window is scrolled
-    // but not when something inside the callout is scrolled. The delay seems
-    // to be required to avoid React firing an async focus event in IE from
-    // the target changing focus quickly prior to rendering the callout.
-    this._async.setTimeout(() => {
-      this._events.on(this._targetWindow, 'scroll', this._dismissOnScroll, true);
-      this._events.on(this._targetWindow, 'resize', this.dismiss, true);
-      this._events.on(this._targetWindow.document.body, 'focus', this._dismissOnLostFocus, true);
-      this._events.on(this._targetWindow.document.body, 'click', this._dismissOnLostFocus, true);
-    }, 0);
-
-    if (this.props.onLayerMounted) {
-      this.props.onLayerMounted();
-    }
-
-    this._updateAsyncPosition();
-    this._setHeightOffsetEveryFrame();
-  }
-
-  private _updateAsyncPosition() {
-    this._async.requestAnimationFrame(() => this._updatePosition());
-  }
-
-  private _updatePosition() {
-    let { positions } = this.state;
-    let hostElement: HTMLElement = this._hostElement;
-    let calloutElement: HTMLElement = this._calloutElement;
-
-    if (hostElement && calloutElement) {
-      let currentProps: IPositionProps | undefined;
-      currentProps = assign(currentProps, this.props);
-      currentProps!.bounds = this._getBounds();
-      currentProps!.target = this._target!;
-      let newPositions: ICalloutPositionedInfo = positionCallout(currentProps!, hostElement, calloutElement);
-
-      // Set the new position only when the positions are not exists or one of the new callout positions are different.
-      // The position should not change if the position is within 2 decimal places.
-      if ((!positions && newPositions) ||
-        (positions && newPositions && !this._arePositionsEqual(positions, newPositions)
-          && this._positionAttempts < 5)) {
-        // We should not reposition the callout more than a few times, if it is then the content is likely resizing
-        // and we should stop trying to reposition to prevent a stack overflow.
-        this._positionAttempts++;
-        this.setState({
-          positions: newPositions
-        });
-      } else {
-        this._positionAttempts = 0;
-        if (this.props.onPositioned) {
-          this.props.onPositioned(this.state.positions);
-        }
-      }
-    }
-  }
-
-  private _getBeakPosition(positions?: ICalloutPositionedInfo,
-    beakWidth?: number,
-    backgroundColor?: string,
-    beakStyle?: string) {
-    let beakStyleWidth = beakWidth;
-
-    // This is here to support the old way of setting the beak size until version 1.0.0.
-    // beakStyle is now deprecated and will be be removed at version 1.0.0
-    if (beakStyle === 'ms-Callout-smallbeak') {
-      beakStyleWidth = 16;
-    }
-
-    let beakReactStyle: React.CSSProperties = {
-      ...(positions && positions.beakPosition ? positions.beakPosition.elementPosition : null),
-    };
-    beakReactStyle.height = beakStyleWidth;
-    beakReactStyle.width = beakStyleWidth;
-    beakReactStyle.backgroundColor = backgroundColor;
-    if (!beakReactStyle.top && !beakReactStyle.bottom && !beakReactStyle.left && !beakReactStyle.right) {
-      beakReactStyle.left = BEAK_ORIGIN_POSITION.left;
-      beakReactStyle.top = BEAK_ORIGIN_POSITION.top;
-    }
-
-    return beakReactStyle;
-  }
-
-  private _getBounds(): IRectangle {
-    if (!this._bounds) {
-      let currentBounds = this.props.bounds;
-
-      if (!currentBounds) {
-        currentBounds = {
-          top: 0 + this.props.minPagePadding!,
-          left: 0 + this.props.minPagePadding!,
-          right: this._targetWindow.innerWidth - this.props.minPagePadding!,
-          bottom: this._targetWindow.innerHeight - this.props.minPagePadding!,
-          width: this._targetWindow.innerWidth - this.props.minPagePadding! * 2,
-          height: this._targetWindow.innerHeight - this.props.minPagePadding! * 2
-        };
-      }
-      this._bounds = currentBounds;
-    }
-    return this._bounds;
-  }
-
-  private _getMaxHeight(): number {
-    if (!this._maxHeight) {
-      if (this.props.directionalHintFixed && this._target) {
-        let beakWidth = this.props.isBeakVisible ? this.props.beakWidth : 0;
-        let gapSpace = this.props.gapSpace ? this.props.gapSpace : 0;
-        // Since the callout cannot measure it's border size it must be taken into account here. Otherwise it will
-        // overlap with the target.
-        const totalGap = gapSpace + beakWidth! + BORDER_WIDTH * 2;
-        this._maxHeight = getMaxHeight(this._target, this.props.directionalHint!, totalGap, this._getBounds());
-      } else {
-        this._maxHeight = this._getBounds().height! - BORDER_WIDTH * 2;
-      }
-    }
-    return this._maxHeight!;
-  }
-
-  private _arePositionsEqual(positions: ICalloutPositionedInfo, newPosition: ICalloutPositionedInfo) {
-    return this._comparePositions(positions.elementPosition, newPosition.elementPosition) &&
-      this._comparePositions(positions.beakPosition.elementPosition, newPosition.beakPosition.elementPosition);
-  }
-
-  private _comparePositions(oldPositions: IPosition, newPositions: IPosition) {
-    for (const key in newPositions) {
-      // This needs to be checked here and below because there is a linting error if for in does not immediately have an if statement
-      if (newPositions.hasOwnProperty(key)) {
-        const oldPositionEdge = oldPositions[key];
-        const newPositionEdge = newPositions[key];
-
-        if (oldPositionEdge !== undefined && newPositionEdge !== undefined) {
-          if (oldPositionEdge.toFixed(2) !== newPositionEdge.toFixed(2)) {
-            return false;
-          }
-        } else {
-          return false;
-        }
-      }
-    }
-    return true;
-  }
-
-  private _setTargetWindowAndElement(target: HTMLElement | string | MouseEvent | IPoint | null): void {
-    if (target) {
-      if (typeof target === 'string') {
-        let currentDoc: Document = getDocument()!;
-        this._target = currentDoc ? currentDoc.querySelector(target) as HTMLElement : null;
-        this._targetWindow = getWindow()!;
-      } else if ((target as MouseEvent).stopPropagation) {
-        this._targetWindow = getWindow((target as MouseEvent).toElement as HTMLElement)!;
-        this._target = target;
-      } else if ((target as HTMLElement).getBoundingClientRect) {
-        let targetElement: HTMLElement = target as HTMLElement;
-        this._targetWindow = getWindow(targetElement)!;
-        this._target = target;
-        // HTMLImgElements can have x and y values. The check for it being a point must go last.
-      } else {
-        this._targetWindow = getWindow()!;
-        this._target = target;
-      }
-    } else {
-      this._targetWindow = getWindow()!;
-    }
-  }
-
-  private _setHeightOffsetEveryFrame(): void {
-    if (this._calloutElement && this.props.finalHeight) {
-      this._setHeightOffsetTimer = this._async.requestAnimationFrame(() => {
-        const calloutMainElem = this._calloutElement.lastChild as HTMLElement;
-        const cardScrollHeight: number = calloutMainElem.scrollHeight;
-        const cardCurrHeight: number = calloutMainElem.offsetHeight;
-        const scrollDiff: number = cardScrollHeight - cardCurrHeight;
-
-        this.setState({
-          heightOffset: this.state.heightOffset! + scrollDiff
-        });
-
-        if (calloutMainElem.offsetHeight < this.props.finalHeight!) {
-          this._setHeightOffsetEveryFrame();
-        } else {
-          this._async.cancelAnimationFrame(this._setHeightOffsetTimer);
-        }
-      });
-    }
-  }
+import { ICalloutProps } from './Callout.types';
+import { CalloutContentBase } from './CalloutContent.base';
+import { getStyles } from './CalloutContent.styles';
 
-  private _getTarget(props: ICalloutProps = this.props): HTMLElement | string | MouseEvent | IPoint | null {
-    let { useTargetPoint, targetPoint, target } = props;
-    return useTargetPoint ? targetPoint! : target!;
-  }
-}
+export const CalloutContent = styled(
+  CalloutContentBase,
+  getStyles
+);
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
index 232ebb8cd1345..e0d53d5ed7639 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
@@ -2,30 +2,54 @@
 
 exports[`Callout renders Callout correctly 1`] = `
 <div
-  className="ms-Callout-container"
+  className=
+      ms-Callout-container
+      {
+        position: relative;
+      }
 >
   <div
-    className="ms-Callout"
-    style={
-      Object {
-        "filter": "opacity(0)",
-        "opacity": 0,
-      }
-    }
+    className=
+        ms-Callout
+        {
+          border-color: #eaeaea;
+          border-style: solid;
+          border-width: 1px;
+          box-shadow: 0 0 5px 0px rgba(0,0,0,0.4);
+          box-sizing: border-box;
+          filter: opacity(0);
+          opacity: 0;
+          outline: transparent;
+          position: absolute;
+        }
+        @media screen and (-ms-high-contrast: active){& {
+          border-color: WindowText;
+          border-style: solid;
+          border-width: 1px;
+        }
+        &::-moz-focus-inner {
+          border: 0px;
+        }
     tabIndex={-1}
   >
     <div
       aria-describedby={undefined}
       aria-label={undefined}
       aria-labelledby={undefined}
-      className="ms-Callout-main"
+      className=
+          ms-Callout-main
+          {
+            background-color: #ffffff;
+            max-height: 750px;
+            overflow-x: hidden;
+            overflow-y: auto;
+            position: relative;
+          }
       onKeyDown={[Function]}
       onScroll={undefined}
       role={undefined}
       style={
         Object {
-          "backgroundColor": undefined,
-          "maxHeight": 750,
           "overflowY": "auto",
         }
       }
diff --git a/packages/styling/src/styles/getFocusStyle.ts b/packages/styling/src/styles/getFocusStyle.ts
index 54309fbdb967e..5d69bce7e2b13 100644
--- a/packages/styling/src/styles/getFocusStyle.ts
+++ b/packages/styling/src/styles/getFocusStyle.ts
@@ -40,4 +40,22 @@ export function getFocusStyle(
 
     }
   };
+}
+
+/**
+ * Generates style to clear browser specific focus styles.
+ */
+export function focusClear(): IRawStyle {
+  return {
+    selectors: {
+      '&::-moz-focus-inner': {
+        // Clear the focus border in Firefox. Reference: http://stackoverflow.com/a/199319/1436671
+        border: 0
+      },
+      '&': {
+        // Clear browser specific focus styles and use transparent as placeholder for focus style
+        outline: 'transparent'
+      }
+    }
+  };
 }
\ No newline at end of file
diff --git a/packages/styling/src/styles/index.ts b/packages/styling/src/styles/index.ts
index 5e76b6ac401c9..c734f9d094987 100644
--- a/packages/styling/src/styles/index.ts
+++ b/packages/styling/src/styles/index.ts
@@ -2,7 +2,7 @@ export { AnimationStyles, AnimationVariables } from './AnimationStyles';
 export { DefaultPalette } from './DefaultPalette';
 export { DefaultFontStyles, registerDefaultFontFaces } from './DefaultFontStyles';
 export { FontSizes, FontWeights, IconFontSizes, createFontStyles } from './fonts';
-export { getFocusStyle } from './getFocusStyle';
+export { getFocusStyle, focusClear } from './getFocusStyle';
 export { hiddenContentStyle } from './hiddenContentStyle';
 export {
   ThemeSettingName,

From 325c15ab5ea077d5b1c1ac77d898eba0dfc0f59a Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Wed, 24 Jan 2018 21:51:22 -0800
Subject: [PATCH 1267/1641] V krbrow/limited picker blur error (#3798)

* Adding null check around dismiss input clearing and canAddItems check around dismiss item adding

* rush change
---
 ...ow-limited-picker-blur-error_2018-01-24-23-45.json | 11 +++++++++++
 .../src/components/pickers/BasePicker.tsx             |  6 ++++--
 2 files changed, 15 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-limited-picker-blur-error_2018-01-24-23-45.json

diff --git a/common/changes/office-ui-fabric-react/v-krbrow-limited-picker-blur-error_2018-01-24-23-45.json b/common/changes/office-ui-fabric-react/v-krbrow-limited-picker-blur-error_2018-01-24-23-45.json
new file mode 100644
index 0000000000000..e35899b780f60
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-limited-picker-blur-error_2018-01-24-23-45.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Pickers: Fixing errors occuring onBlur of limited pickers",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 191c1e05424bc..dd4d6a2900bfb 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -130,7 +130,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
       if (!ev || (ev && !ev.defaultPrevented)) {
         // Select the first suggestion if one is available when user leaves.
-        if (this.suggestionStore.hasSelectedSuggestion() && this.state.suggestedDisplayValue) {
+        if (this.canAddItems() && this.suggestionStore.hasSelectedSuggestion() && this.state.suggestedDisplayValue) {
           this.addItemByIndex(0);
         }
       }
@@ -566,7 +566,9 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   @autobind
   protected addItemByIndex(index: number): void {
     this.addItem(this.suggestionStore.getSuggestionAtIndex(index).item);
-    this.input.clear();
+    if (this.input) {
+      this.input.clear();
+    }
     this.updateValue('');
   }
 

From 9aefcc5eb8deab065e95c384e561f421bc87bd54 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 25 Jan 2018 03:23:07 -0800
Subject: [PATCH 1268/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../pickerHeader_2018-01-17-19-36.json        | 11 ----
 ...ozano-CalloutStyling_2018-01-19-02-15.json | 11 ----
 ...ozano-CalloutStyling_2018-01-19-02-15.json | 11 ----
 .../debounceCancel_2018-01-23-23-50.json      | 11 ----
 .../chiechan-accSpinBtn_2018-01-23-22-21.json | 11 ----
 ...ozano-CalloutStyling_2018-01-18-23-58.json | 11 ----
 .../picker-focus-999_2018-01-23-23-02.json    | 11 ----
 ...ed-picker-blur-error_2018-01-24-23-45.json | 11 ----
 ...krbrow-list-link-fix_2018-01-24-20-49.json | 11 ----
 ...v-krbrow-pickers-rtl_2018-01-24-22-11.json | 11 ----
 packages/example-app-base/package.json        |  4 +-
 packages/experiments/CHANGELOG.json           | 19 +++++++
 packages/experiments/CHANGELOG.md             |  9 +++-
 packages/experiments/package.json             |  4 +-
 .../jest-serializer-merge-styles/package.json |  2 +-
 packages/merge-styles/CHANGELOG.json          | 14 +++++
 packages/merge-styles/CHANGELOG.md            |  9 +++-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 52 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 17 +++++-
 packages/office-ui-fabric-react/package.json  | 10 ++--
 packages/styling/CHANGELOG.json               | 22 ++++++++
 packages/styling/CHANGELOG.md                 |  9 +++-
 packages/styling/package.json                 |  6 +--
 packages/utilities/CHANGELOG.json             | 19 +++++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  4 +-
 scripts/package.json                          |  4 +-
 33 files changed, 197 insertions(+), 138 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/pickerHeader_2018-01-17-19-36.json
 delete mode 100644 common/changes/@uifabric/merge-styles/malozano-CalloutStyling_2018-01-19-02-15.json
 delete mode 100644 common/changes/@uifabric/styling/malozano-CalloutStyling_2018-01-19-02-15.json
 delete mode 100644 common/changes/@uifabric/utilities/debounceCancel_2018-01-23-23-50.json
 delete mode 100644 common/changes/office-ui-fabric-react/chiechan-accSpinBtn_2018-01-23-22-21.json
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-CalloutStyling_2018-01-18-23-58.json
 delete mode 100644 common/changes/office-ui-fabric-react/picker-focus-999_2018-01-23-23-02.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-limited-picker-blur-error_2018-01-24-23-45.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-list-link-fix_2018-01-24-20-49.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-pickers-rtl_2018-01-24-22-11.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index a30e09b86a92d..5a55297797fcf 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.41.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.43.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index d579180679c71..53851a9323ee9 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.41.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.43.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index c9ba51ad34352..9e3687895fd0a 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.41.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.43.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index ef722fe4de8a5..1e03dc41727c5 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.0.0",
-    "office-ui-fabric-react": ">=5.41.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.43.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 61e1f69420d85..c4aa79a423433 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.41.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.43.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/@uifabric/experiments/pickerHeader_2018-01-17-19-36.json b/common/changes/@uifabric/experiments/pickerHeader_2018-01-17-19-36.json
deleted file mode 100644
index 43ab94179b734..0000000000000
--- a/common/changes/@uifabric/experiments/pickerHeader_2018-01-17-19-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "add optional title element to extendedPicker, css changes to have selected items flow on the same row as input",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "amyngu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/malozano-CalloutStyling_2018-01-19-02-15.json b/common/changes/@uifabric/merge-styles/malozano-CalloutStyling_2018-01-19-02-15.json
deleted file mode 100644
index c78ec0e73a2a0..0000000000000
--- a/common/changes/@uifabric/merge-styles/malozano-CalloutStyling_2018-01-19-02-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "Change maxHeight/maxFontSize to CSSPixelUnitRule (number and string)",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/malozano-CalloutStyling_2018-01-19-02-15.json b/common/changes/@uifabric/styling/malozano-CalloutStyling_2018-01-19-02-15.json
deleted file mode 100644
index b57065ec40b9e..0000000000000
--- a/common/changes/@uifabric/styling/malozano-CalloutStyling_2018-01-19-02-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Add focus clear func to styling and change maxheight/maxfontsize to CSSPixelUnitRule ",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/debounceCancel_2018-01-23-23-50.json b/common/changes/@uifabric/utilities/debounceCancel_2018-01-23-23-50.json
deleted file mode 100644
index 90a958ca0fdda..0000000000000
--- a/common/changes/@uifabric/utilities/debounceCancel_2018-01-23-23-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Set timeout ids to null for cancel and flush functions",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "alexbettadapur@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/chiechan-accSpinBtn_2018-01-23-22-21.json b/common/changes/office-ui-fabric-react/chiechan-accSpinBtn_2018-01-23-22-21.json
deleted file mode 100644
index e7e46cd650d0b..0000000000000
--- a/common/changes/office-ui-fabric-react/chiechan-accSpinBtn_2018-01-23-22-21.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "spin button - add aria label for decrement and increment buttons",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chiechan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/malozano-CalloutStyling_2018-01-18-23-58.json b/common/changes/office-ui-fabric-react/malozano-CalloutStyling_2018-01-18-23-58.json
deleted file mode 100644
index 98111973689a3..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-CalloutStyling_2018-01-18-23-58.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Callout: Convert component to JS Styling",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/picker-focus-999_2018-01-23-23-02.json b/common/changes/office-ui-fabric-react/picker-focus-999_2018-01-23-23-02.json
deleted file mode 100644
index 8c891377555b3..0000000000000
--- a/common/changes/office-ui-fabric-react/picker-focus-999_2018-01-23-23-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added onFocus state Boolean to BasePicker",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-limited-picker-blur-error_2018-01-24-23-45.json b/common/changes/office-ui-fabric-react/v-krbrow-limited-picker-blur-error_2018-01-24-23-45.json
deleted file mode 100644
index e35899b780f60..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-limited-picker-blur-error_2018-01-24-23-45.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Pickers: Fixing errors occuring onBlur of limited pickers",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-list-link-fix_2018-01-24-20-49.json b/common/changes/office-ui-fabric-react/v-krbrow-list-link-fix_2018-01-24-20-49.json
deleted file mode 100644
index 7e89b7e9164cd..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-list-link-fix_2018-01-24-20-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixed broken links on documentation pages",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-pickers-rtl_2018-01-24-22-11.json b/common/changes/office-ui-fabric-react/v-krbrow-pickers-rtl_2018-01-24-22-11.json
deleted file mode 100644
index af92a22d75777..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-pickers-rtl_2018-01-24-22-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Pickers: Aligning suggestions callout to the correct RTL position",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 4501b1fb9ad8b..d5f122e0b25b6 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -32,8 +32,8 @@
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.16.0 <6.0.0",
-    "@uifabric/utilities": ">=5.7.0 <6.0.0",
+    "@uifabric/styling": ">=5.17.0 <6.0.0",
+    "@uifabric/utilities": ">=5.7.1 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index fa60473a7c8e9..e34fdcc808095 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.15.0",
+      "tag": "@uifabric/experiments_v5.15.0",
+      "date": "Thu, 25 Jan 2018 11:23:06 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "amyngu <31973030+amyngu@users.noreply.github.com>",
+            "commit": "194ce4efa804ac4bbacef04b03d426c8a561a6b0",
+            "comment": "add optional title element to extendedPicker, css changes to have selected items flow on the same row as input"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.41.2 <6.0.0` to `>=5.43.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.14.0",
       "tag": "@uifabric/experiments_v5.14.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index f4aa722211f8f..cefb05b7c5207 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Mon, 22 Jan 2018 11:14:27 GMT and should not be manually modified.
+This log was last generated on Thu, 25 Jan 2018 11:23:06 GMT and should not be manually modified.
+
+## 5.15.0
+Thu, 25 Jan 2018 11:23:06 GMT
+
+### Minor changes
+
+- add optional title element to extendedPicker, css changes to have selected items flow on the same row as input
 
 ## 5.14.0
 Mon, 22 Jan 2018 11:14:27 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index b786403b901df..12af911d5e289 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.14.0",
+  "version": "5.15.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.41.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.43.0 <6.0.0",
     "@uifabric/icons": ">=5.4.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/jest-serializer-merge-styles/package.json b/packages/jest-serializer-merge-styles/package.json
index 01711f8ee61e8..6726de0dcab0e 100644
--- a/packages/jest-serializer-merge-styles/package.json
+++ b/packages/jest-serializer-merge-styles/package.json
@@ -24,6 +24,6 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/merge-styles": ">=5.10.1 <6.0.0"
+    "@uifabric/merge-styles": ">=5.11.0 <6.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index 1810ab72ec69a..43bf929efe821 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.11.0",
+      "tag": "@uifabric/merge-styles_v5.11.0",
+      "date": "Thu, 25 Jan 2018 11:23:06 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "a2864f8c6d0fc2b271c952b9929767ed760660ab",
+            "comment": "Change maxHeight/maxFontSize to CSSPixelUnitRule (number and string)"
+          }
+        ]
+      }
+    },
     {
       "version": "5.10.1",
       "tag": "@uifabric/merge-styles_v5.10.1",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index 37091bcd19b88..93b7272d36580 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Wed, 17 Jan 2018 11:11:25 GMT and should not be manually modified.
+This log was last generated on Thu, 25 Jan 2018 11:23:06 GMT and should not be manually modified.
+
+## 5.11.0
+Thu, 25 Jan 2018 11:23:06 GMT
+
+### Minor changes
+
+- Change maxHeight/maxFontSize to CSSPixelUnitRule (number and string)
 
 ## 5.10.1
 Wed, 17 Jan 2018 11:11:25 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index 9a40febda14df..2990935f87fed 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.10.1",
+  "version": "5.11.0",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 5ae6ee58821a3..e669df8bc02f5 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,58 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.43.0",
+      "tag": "office-ui-fabric-react_v5.43.0",
+      "date": "Thu, 25 Jan 2018 11:23:07 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "chang47 <coralbue@gmail.com>",
+            "commit": "1f86b535cf6347ef09ce6c172eb875a0aaf203ea",
+            "comment": "spin button - add aria label for decrement and increment buttons"
+          },
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "325c15ab5ea077d5b1c1ac77d898eba0dfc0f59a",
+            "comment": "Pickers: Fixing errors occuring onBlur of limited pickers"
+          },
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "59111034b784874eec5c28fef8d6dd11f06502b1",
+            "comment": "Fixed broken links on documentation pages"
+          },
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "3b5b375421343cbc74b4aa72c432a0910224459e",
+            "comment": "Pickers: Aligning suggestions callout to the correct RTL position"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "a2864f8c6d0fc2b271c952b9929767ed760660ab",
+            "comment": "Callout: Convert component to JS Styling"
+          },
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "bd19b42da3e1452580283a30a682d22349af1fe6",
+            "comment": "Added onFocus state Boolean to BasePicker"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.10.1 <6.0.0` to `>=5.11.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.16.0 <6.0.0` to `>=5.17.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.7.0 <6.0.0` to `>=5.7.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.42.0",
       "tag": "office-ui-fabric-react_v5.42.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 5dc20f90042d7..7e33b0abb198f 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,21 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 24 Jan 2018 11:23:26 GMT and should not be manually modified.
+This log was last generated on Thu, 25 Jan 2018 11:23:07 GMT and should not be manually modified.
+
+## 5.43.0
+Thu, 25 Jan 2018 11:23:07 GMT
+
+### Minor changes
+
+- Callout: Convert component to JS Styling
+- Added onFocus state Boolean to BasePicker
+
+### Patches
+
+- spin button - add aria label for decrement and increment buttons
+- Pickers: Fixing errors occuring onBlur of limited pickers
+- Fixed broken links on documentation pages
+- Pickers: Aligning suggestions callout to the correct RTL position
 
 ## 5.42.0
 Wed, 24 Jan 2018 11:23:26 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index b7f6d1539d3e2..53aa9a9e311e6 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.42.0",
+  "version": "5.43.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -48,9 +48,9 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/icons": ">=5.4.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.10.1 <6.0.0",
-    "@uifabric/styling": ">=5.16.0 <6.0.0",
-    "@uifabric/utilities": ">=5.7.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.11.0 <6.0.0",
+    "@uifabric/styling": ">=5.17.0 <6.0.0",
+    "@uifabric/utilities": ">=5.7.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
@@ -58,4 +58,4 @@
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   }
-}
+}
\ No newline at end of file
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index caff77820ee7e..d0e363eea13c8 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.17.0",
+      "tag": "@uifabric/styling_v5.17.0",
+      "date": "Thu, 25 Jan 2018 11:23:06 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "a2864f8c6d0fc2b271c952b9929767ed760660ab",
+            "comment": "Add focus clear func to styling and change maxheight/maxfontsize to CSSPixelUnitRule "
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.7.0 <6.0.0` to `>=5.7.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.10.1 <6.0.0` to `>=5.11.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.16.0",
       "tag": "@uifabric/styling_v5.16.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index dbadd235d4d37..e44bb6fb9b021 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Wed, 24 Jan 2018 11:23:26 GMT and should not be manually modified.
+This log was last generated on Thu, 25 Jan 2018 11:23:06 GMT and should not be manually modified.
+
+## 5.17.0
+Thu, 25 Jan 2018 11:23:06 GMT
+
+### Minor changes
+
+- Add focus clear func to styling and change maxheight/maxfontsize to CSSPixelUnitRule 
 
 ## 5.16.0
 Wed, 24 Jan 2018 11:23:26 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 64cb711e45a42..5f446f16d9ee1 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.16.0",
+  "version": "5.17.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "repository": {
     "type": "git",
@@ -27,8 +27,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.7.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.10.1 <6.0.0",
+    "@uifabric/utilities": ">=5.7.1 <6.0.0",
+    "@uifabric/merge-styles": ">=5.11.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 0611296da4e0e..034df666c5e8d 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.7.1",
+      "tag": "@uifabric/utilities_v5.7.1",
+      "date": "Thu, 25 Jan 2018 11:23:06 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Alex Bettadapur <alexbettadapur@gmail.com>",
+            "commit": "c0d264e51b37fb707a149c1dd22641f9378e367b",
+            "comment": "Set timeout ids to null for cancel and flush functions"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.10.1 <6.0.0` to `>=5.11.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.7.0",
       "tag": "@uifabric/utilities_v5.7.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 0aa317be7ed66..4bec8e9738e0e 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Mon, 22 Jan 2018 11:14:27 GMT and should not be manually modified.
+This log was last generated on Thu, 25 Jan 2018 11:23:06 GMT and should not be manually modified.
+
+## 5.7.1
+Thu, 25 Jan 2018 11:23:06 GMT
+
+### Patches
+
+- Set timeout ids to null for cancel and flush functions
 
 ## 5.7.0
 Mon, 22 Jan 2018 11:14:27 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 5c83c55ac0803..b27b1fa47bd2a 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.7.0",
+  "version": "5.7.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -36,7 +36,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/merge-styles": ">=5.10.1 <6.0.0",
+    "@uifabric/merge-styles": ">=5.11.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/scripts/package.json b/scripts/package.json
index d736ca0e41270..1b2a4ceeec5cd 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -11,7 +11,7 @@
     "@microsoft/api-extractor": "^4.2.6",
     "@microsoft/load-themed-styles": "^1.7.13",
     "@microsoft/loader-load-themed-styles": "^1.6.0",
-    "@uifabric/merge-styles": ">=5.10.1 <6.0.0",
+    "@uifabric/merge-styles": ">=5.11.0 <6.0.0",
     "autoprefixer": "^7.1.5",
     "awesome-typescript-loader": "^3.2.3",
     "bundlesize": "^0.15.2",
@@ -52,4 +52,4 @@
       "maxSize": "42.8 kB"
     }
   ]
-}
+}
\ No newline at end of file

From c8a644b42c74a65224fa85c18eacd0de8e2e91c4 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Thu, 25 Jan 2018 09:46:37 -0800
Subject: [PATCH 1269/1641] Dropdown: Fix disabled options (#3618)

* Fix disabled options in Dropdown

* Update stories and examples to include disabled options

* Add change file

* Update styles, add more stories with disabled options

* Update change file

* Remove old change file

* Change bg to transparent
---
 .../vr-tests/src/stories/Dropdown.stories.tsx | 26 ++++++++++++++--
 ...opdown-disabled-opts_2017-12-22-00-45.json | 11 +++++++
 .../components/Checkbox/Checkbox.styles.ts    |  5 ++-
 .../src/components/Dropdown/Dropdown.scss     | 27 +++++++++-------
 .../src/components/Dropdown/Dropdown.tsx      | 31 +++++++++++--------
 .../examples/Dropdown.Basic.Example.tsx       |  8 ++---
 6 files changed, 74 insertions(+), 34 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/dropdown-disabled-opts_2017-12-22-00-45.json

diff --git a/apps/vr-tests/src/stories/Dropdown.stories.tsx b/apps/vr-tests/src/stories/Dropdown.stories.tsx
index f42358208cdf9..3e6b5b397e0f7 100644
--- a/apps/vr-tests/src/stories/Dropdown.stories.tsx
+++ b/apps/vr-tests/src/stories/Dropdown.stories.tsx
@@ -34,7 +34,7 @@ storiesOf('Dropdown', module)
           { key: 'B', text: 'Option b' },
           { key: 'divider_2', text: '-', itemType: DropdownMenuItemType.Divider },
           { key: 'Header2', text: 'People', itemType: DropdownMenuItemType.Header },
-          { key: 'F', text: 'Option f' },
+          { key: 'F', text: 'Option f', disabled: true },
           { key: 'G', text: 'Option g' }
         ]
       }
@@ -59,17 +59,37 @@ storiesOf('Dropdown', module)
       }
     />
   ))
+  .add('Disabled option selected', () => (
+    <Dropdown
+      placeHolder='Select an Option'
+      label='Basic example:'
+      defaultSelectedKey='F'
+      ariaLabel='Basic dropdown example'
+      options={
+        [
+          { key: 'Header', text: 'Actions', itemType: DropdownMenuItemType.Header },
+          { key: 'A', text: 'Option a' },
+          { key: 'B', text: 'Option b' },
+          { key: 'divider_2', text: '-', itemType: DropdownMenuItemType.Divider },
+          { key: 'Header2', text: 'People', itemType: DropdownMenuItemType.Header },
+          { key: 'F', text: 'Option f', disabled: true },
+          { key: 'G', text: 'Option g' }
+        ]
+      }
+    />
+  ))
   .add('Multiselect', () => (
     <Dropdown
       placeHolder='Select options'
       label='Multi-Select example:'
-      defaultSelectedKeys={ ['Orange'] }
+      defaultSelectedKeys={ ['Orange', 'Lemon'] }
       multiSelect
       options={
         [
           { key: 'Header2', text: 'Fruits', itemType: DropdownMenuItemType.Header },
           { key: 'Apple', text: 'apple' },
-          { key: 'Banana', text: 'banana' },
+          { key: 'Banana', text: 'banana', disabled: true },
+          { key: 'Lemon', text: 'lemon', disabled: true },
           { key: 'Orange', text: 'orange' },
         ]
       }
diff --git a/common/changes/office-ui-fabric-react/dropdown-disabled-opts_2017-12-22-00-45.json b/common/changes/office-ui-fabric-react/dropdown-disabled-opts_2017-12-22-00-45.json
new file mode 100644
index 0000000000000..070309aac5aff
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/dropdown-disabled-opts_2017-12-22-00-45.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown, Checkbox: Fix disabled Dropdown options and update Checkbox disabled styles",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "erabelle@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
index 3dc4721e2ab08..3f737ccb6b64d 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.styles.ts
@@ -20,12 +20,12 @@ export const getStyles = memoizeFunction((
   const checkmarkFontColorCheckedDisabled = semanticColors.disabledBackground;
   const checkboxBorderColor = semanticColors.smallInputBorder;
   const checkboxBorderColorChecked = semanticColors.inputBackgroundChecked;
-  const checkboxBorderColorDisabled = semanticColors.disabledText;
+  const checkboxBorderColorDisabled = semanticColors.disabledBodyText;
   const checkboxBorderHoveredColor = semanticColors.inputBorderHovered;
   const checkboxBackgroundChecked = semanticColors.inputBackgroundChecked;
   const checkboxBackgroundCheckedHovered = semanticColors.inputBackgroundCheckedHovered;
   const checkboxBorderColorCheckedHovered = semanticColors.inputBackgroundCheckedHovered;
-  const checkboxBackgroundDisabled = semanticColors.disabledText;
+  const checkboxBackgroundDisabled = semanticColors.disabledBodyText;
   const checkboxTextColor = semanticColors.bodyText;
   const checkboxTextColorDisabled = semanticColors.disabledText;
 
@@ -96,7 +96,6 @@ export const getStyles = memoizeFunction((
       borderColor: checkboxBorderColorCheckedHovered
     },
     checkboxDisabled: {
-      background: checkboxBackgroundDisabled,
       borderColor: checkboxBorderColorDisabled
     },
     checkboxCheckedDisabled: {
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
index eee0431f42084..e24c22d132821 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
@@ -101,7 +101,7 @@ $DropDown-item-height: 32px;
     }
 
     &.titleIsError {
-        border-color: $ms-color-error;
+      border-color: $ms-color-error;
     }
   }
 
@@ -154,21 +154,22 @@ $DropDown-item-height: 32px;
 }
 
 .panel {
-    // Force drop shadow even under medium breakpoint
-    :global(.ms-Panel-main) {
-      @include ms-drop-shadow(-30px, 0px, 30px, -30px, .2);
-    }
-    // Remove padding as items have their own padding and bg
-    :global(.ms-Panel-contentInner) {
-      padding: 0 0 20px
-    }
+  // Force drop shadow even under medium breakpoint
+   :global(.ms-Panel-main) {
+    @include ms-drop-shadow(-30px, 0px, 30px, -30px, .2);
   }
+  // Remove padding as items have their own padding and bg
+   :global(.ms-Panel-contentInner) {
+    padding: 0 0 20px
+  }
+}
 
 .callout {
   box-shadow: 0 0px 2px 0px rgba(0, 0, 0, 0.2);
   border: 1px solid $ms-color-neutralLight;
 }
 
+
 .errorMessage{
   color: $ms-color-error;
   @include ms-font-s;
@@ -215,11 +216,10 @@ $DropDown-item-height: 32px;
   }
 
   &.itemIsDisabled {
-    background: $ms-color-white;
     color: $ms-color-neutralTertiary;
     cursor: default;
   }
-  :global(.ms-Button-flexContainer) {
+   :global(.ms-Button-flexContainer) {
     justify-content: flex-start;
   }
 }
@@ -230,6 +230,11 @@ $DropDown-item-height: 32px;
   color: $ms-color-black;
 
   @include highContrastListItemState;
+
+  &.itemIsDisabled {
+    color: $ms-color-neutralTertiary;
+    background-color: transparent;
+  }
 }
 
 .header {
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index f5af20a612059..a2d11867564c1 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -482,14 +482,15 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
             ref={ Dropdown.Option + item.index }
             key={ item.key }
             data-index={ item.index }
-            data-is-focusable={ true }
+            data-is-focusable={ !item.disabled }
+            disabled={ item.disabled }
             className={ css(
               'ms-Dropdown-item', styles.item, {
                 ['is-selected ' + styles.itemIsSelected]: isItemSelected,
-                ['is-disabled ' + styles.itemIsDisabled]: this.props.disabled === true
+                ['is-disabled ' + styles.itemIsDisabled]: item.disabled === true
               }
             ) }
-            onClick={ this._onItemClick(item.index!) }
+            onClick={ this._onItemClick(item) }
             onMouseEnter={ this._onItemMouseEnter.bind(this, item) }
             onMouseLeave={ this._onMouseItemLeave.bind(this, item) }
             onMouseMove={ this._onItemMouseMove.bind(this, item) }
@@ -506,8 +507,9 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
             ref={ Dropdown.Option + item.index }
             key={ item.key }
             data-index={ item.index }
-            data-is-focusable={ true }
-            onChange={ this._onItemClick(item.index!) }
+            data-is-focusable={ !item.disabled }
+            disabled={ item.disabled }
+            onChange={ this._onItemClick(item) }
             inputProps={ {
               onMouseEnter: this._onItemMouseEnter.bind(this, item),
               onMouseLeave: this._onMouseItemLeave.bind(this, item),
@@ -516,9 +518,10 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
             label={ item.text }
             className={ css(
               'ms-ColumnManagementPanel-checkbox',
+              styles.dropdownCheckbox,
               'ms-Dropdown-item', styles.item, {
                 ['is-selected ' + styles.itemIsSelected]: isItemSelected,
-                ['is-disabled ' + styles.itemIsDisabled]: isItemSelected
+                ['is-disabled ' + styles.itemIsDisabled]: item.disabled
               }
             ) }
             role='option'
@@ -549,14 +552,16 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   @autobind
-  private _onItemClick(index: number): () => void {
+  private _onItemClick(item: IDropdownOption): () => void {
     return (): void => {
-      this.setSelectedIndex(index);
-      if (!this.props.multiSelect) {
-        // only close the callout when it's in single-select mode
-        this.setState({
-          isOpen: false
-        });
+      if (!item.disabled) {
+        this.setSelectedIndex(item.index!);
+        if (!this.props.multiSelect) {
+          // only close the callout when it's in single-select mode
+          this.setState({
+            isOpen: false
+          });
+        }
       }
     };
   }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
index 291d03f3f4bf2..598cb19a6901e 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
@@ -33,7 +33,7 @@ export class DropdownBasicExample extends BaseComponent<{}, {
               { key: 'Header', text: 'Actions', itemType: DropdownMenuItemType.Header },
               { key: 'A', text: 'Option a' },
               { key: 'B', text: 'Option b' },
-              { key: 'C', text: 'Option c' },
+              { key: 'C', text: 'Option c', disabled: true },
               { key: 'D', text: 'Option d' },
               { key: 'E', text: 'Option e' },
               { key: 'divider_2', text: '-', itemType: DropdownMenuItemType.Divider },
@@ -96,7 +96,7 @@ export class DropdownBasicExample extends BaseComponent<{}, {
         <Dropdown
           placeHolder='Select options'
           label='Multi-Select uncontrolled example:'
-          defaultSelectedKeys={ ['Apple', 'Banana'] }
+          defaultSelectedKeys={ ['Apple', 'Banana', 'Orange'] }
           onFocus={ this._log('onFocus called') }
           onBlur={ this._log('onBlur called') }
           multiSelect
@@ -105,8 +105,8 @@ export class DropdownBasicExample extends BaseComponent<{}, {
               { key: 'Header2', text: 'Fruits', itemType: DropdownMenuItemType.Header },
               { key: 'Apple', text: 'apple' },
               { key: 'Banana', text: 'banana' },
-              { key: 'Orange', text: 'orange' },
-              { key: 'Grape', text: 'grape' },
+              { key: 'Orange', text: 'orange', disabled: true },
+              { key: 'Grape', text: 'grape', disabled: true },
               { key: 'divider_1', text: '-', itemType: DropdownMenuItemType.Divider },
               { key: 'Header3', text: 'Lanuages', itemType: DropdownMenuItemType.Header },
               { key: 'English', text: 'english' },

From 9432151081a1c3af197fe5c74b3192fb97267b79 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Thu, 25 Jan 2018 11:21:44 -0800
Subject: [PATCH 1270/1641] Persona: Increased heights to account for double
 diacriticals and prevent textoverflow (#3806)

* Increased heights to account for double diacriticals and prevent text overflow

* Added change file
---
 .../people-picker-height_2018-01-25-18-32.json        | 11 +++++++++++
 .../src/components/Persona/Persona.scss               |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/people-picker-height_2018-01-25-18-32.json

diff --git a/common/changes/office-ui-fabric-react/people-picker-height_2018-01-25-18-32.json b/common/changes/office-ui-fabric-react/people-picker-height_2018-01-25-18-32.json
new file mode 100644
index 0000000000000..20c7258711b90
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/people-picker-height_2018-01-25-18-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Persona: Changed text and root heights for size24 when secondary text is shown.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
index 58fc5e67750d7..ad5db01649bb7 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
@@ -360,12 +360,12 @@ $ms-Persona-presenceBorder: 2px;
   }
 
   &.showSecondaryText {
-    height: 32px;
+    height: 36px;
 
     .primaryText,
     .secondaryText {
       display: block;
-      height: 16px;
+      height: 18px;
       line-height: 16px;
       overflow-x: hidden;
     }

From ec38e5b026b1f8a8e58fa6f3211f98d6d0eb2098 Mon Sep 17 00:00:00 2001
From: chang47 <coralbue@gmail.com>
Date: Thu, 25 Jan 2018 14:07:26 -0800
Subject: [PATCH 1271/1641] Split Button - Adding aria support for all buttons
 including the overall container. (#3763)

* added accessibility options to the menu button in the split button

* updated div group to be considered button if aria is hidden

* added change file

* removed comment and aria hidden
---
 .../chiechan-accSplitButtons_2018-01-23-00-13.json    | 11 +++++++++++
 .../src/components/Button/BaseButton.tsx              |  7 ++++---
 2 files changed, 15 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/chiechan-accSplitButtons_2018-01-23-00-13.json

diff --git a/common/changes/office-ui-fabric-react/chiechan-accSplitButtons_2018-01-23-00-13.json b/common/changes/office-ui-fabric-react/chiechan-accSplitButtons_2018-01-23-00-13.json
new file mode 100644
index 0000000000000..5330dfd2d0ea4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/chiechan-accSplitButtons_2018-01-23-00-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SplitButton - added aria support for button in split buttons and the whole container",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chiechan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index d289857d0d273..0c75e3084b169 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -429,6 +429,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
 
     return (
       <div
+        role={ 'button' }
         aria-labelledby={ buttonProps.ariaLabel }
         aria-disabled={ disabled }
         aria-haspopup={ true }
@@ -440,8 +441,6 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         ref={ this._resolveRef('_splitButtonContainer') }
       >
         <span
-          aria-hidden={ true }
-          // TODO: THIS SHOULD BE REMOVED!
           style={ { 'display': 'flex' } }
         >
           { this._onRenderContent(tag, buttonProps) }
@@ -478,7 +477,9 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       'onClick': this._onMenuClick,
       'menuProps': undefined,
       'iconProps': menuIconProps,
-      'ariaLabel': splitButtonAriaLabel
+      'ariaLabel': splitButtonAriaLabel,
+      'aria-haspopup': true,
+      'aria-expanded': this._isExpanded
     };
 
     return <BaseButton {...splitButtonProps} onMouseDown={ this._onMouseDown } />;

From ecd9ec777720dc4e3c1e72e34640103e803a3a9b Mon Sep 17 00:00:00 2001
From: Kris Brown <kristoferbrown@users.noreply.github.com>
Date: Thu, 25 Jan 2018 14:16:32 -0800
Subject: [PATCH 1272/1641] Homogenizing TextField and Picker inputs (#3791)

* Adjusting picker hover and focus colors

* Unifying input heights and border color behavior

* Aligning peoplePicker well height to other inputs

* rush change

* Updating snapshots

* Removing duplicate isFocused from merge conflict

* Fixing build and behavior after merge conflict
---
 ...w-input-field-styles_2018-01-24-17-58.json | 11 +++++++
 .../src/components/TextField/TextField.scss   | 29 ++++++++++---------
 .../src/components/pickers/BasePicker.scss    | 11 ++++---
 .../PeoplePickerItems/PickerItemsDefault.scss |  2 +-
 .../PeoplePickerItems/SelectedItemDefault.tsx |  2 +-
 .../components/pickers/TagPicker/TagItem.scss |  2 +-
 6 files changed, 35 insertions(+), 22 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/v-krbrow-input-field-styles_2018-01-24-17-58.json

diff --git a/common/changes/office-ui-fabric-react/v-krbrow-input-field-styles_2018-01-24-17-58.json b/common/changes/office-ui-fabric-react/v-krbrow-input-field-styles_2018-01-24-17-58.json
new file mode 100644
index 0000000000000..34cfaef0cc8bb
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/v-krbrow-input-field-styles_2018-01-24-17-58.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "TextField, Pickers, PeoplePicker: Homogenizing input heights and colors",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-krbrow@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index d140f37a9ff32..57a30a72932de 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -187,19 +187,13 @@ $field-error-color: $errorTextColor;
 
 //== Modifier: Single line (default), underlined
 .root.rootIsUnderlined {
-  border-width: 0px;
-
-  &:hover:not(.rootIsDisabled) {
-    border-color: $field-border-hover-color;
-
-    @include high-contrast {
-      border-color: Highlight;
-    }
-  }
+  border: 0px solid $field-border-color;
 
   .wrapper {
     display: flex;
-    border-bottom: 1px solid $field-border-color;
+    border-bottom-width: 1px;
+    border-bottom-style: solid;
+    border-bottom-color: inherit;
     width: 100%;
 
     &.invalid,
@@ -225,7 +219,7 @@ $field-error-color: $errorTextColor;
   }
 
   &.rootIsDisabled {
-    border-bottom-color: $field-border-disabled-color;
+    border-color: $field-border-disabled-color;
 
     :global(.ms-Label) {
       @include ms-Label-is-disabled;
@@ -241,11 +235,20 @@ $field-error-color: $errorTextColor;
     }
   }
 
+  &:hover:not(.rootIsActive):not(.rootIsDisabled) {
+    border-color: $field-border-hover-color;
+  }
+
   &.rootIsActive {
     border-color: $field-border-focus-color;
+  }
 
-    @include high-contrast {
-      border-color: Highlight;
+  &:hover:not(.rootIsDisabled),
+  &.rootIsActive {
+    .wrapper {
+      @include high-contrast {
+        border-color: Highlight;
+      }
     }
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.scss b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.scss
index 67a0129c3510e..bc1b92cedc895 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.scss
@@ -1,4 +1,5 @@
 @import '../../common/common';
+@import '../../common/semanticSlots';
 
 .pickerText {
   display: flex;
@@ -7,24 +8,22 @@
   box-sizing: border-box;
   border: 1px solid $ms-color-neutralTertiary;
   min-width: 180px;
-  padding: 1px;
-  min-height: 32px;
+  min-height: 30px;
   &:hover {
-    border-color: $ms-color-themeLight;
+    border-color: $inputBorderHoveredColor;
   }
 
   &.inputFocused {
-    border-color: $ms-color-themePrimary;
+    border-color: $inputFocusBorderAltColor;
   }
 }
 
 .pickerInput {
-  height: 34px;
+  height: 30px;
   border: none;
   flex-grow: 1;
   outline: none;
   padding: 0 6px 0px;
-  margin: 1px;
 }
 
 .screenReaderOnly {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
index f14f2bb7b8c13..464c0279e07fc 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
@@ -6,7 +6,7 @@
   display: inline-flex;
   align-items: center;
   background: $ms-color-neutralLighter;
-  margin: 4px;
+  margin: 1px 2px;
   cursor: default;
   user-select: none;
   max-width: 300px;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
index b8deb62126cea..74430524dc207 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
@@ -48,7 +48,7 @@ export const SelectedItemDefault: (props: IPeoplePickerItemProps) => JSX.Element
         <Persona
           { ...item }
           presence={ item.presence !== undefined ? item.presence : PersonaPresence.none }
-          size={ PersonaSize.size28 }
+          size={ PersonaSize.size24 }
         />
       </div>
       <IconButton
diff --git a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.scss b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.scss
index 5f5b449d13a8a..85e558ec2b36e 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/TagPicker/TagItem.scss
@@ -5,7 +5,7 @@
   box-sizing: content-box;
   flex-shrink: 1;
   background: $ms-color-neutralLighter;
-  margin: 1px;
+  margin: 2px;
   height: 26px;
   line-height: 26px;
   cursor: default;

From 46ca980e37486b51ccf2bc13aea571213bb081e9 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 25 Jan 2018 21:14:04 -0800
Subject: [PATCH 1273/1641] TypeScript strict mode fix (#3808)

* Adjusting typings to play with with TypeScript strict mode.

* Adding change files.

* Undoing shrinkwrap.

* Updating immutability helper only.
---
 apps/todo-app/package.json                    |  2 +-
 apps/todo-app/src/components/Todo.tsx         |  4 +-
 apps/todo-app/src/components/TodoForm.tsx     | 43 +++++++++++++++----
 apps/todo-app/src/components/TodoItem.tsx     |  2 +-
 apps/todo-app/src/components/TodoTabs.tsx     |  6 +--
 apps/todo-app/src/types/ITodoForm.ts          | 27 ------------
 apps/todo-app/src/types/index.ts              |  1 -
 apps/todo-app/tsconfig.json                   |  5 +++
 .../strict-fix_2018-01-25-19-00.json          | 11 +++++
 common/config/rush/npm-shrinkwrap.json        |  9 ++--
 .../FolderCover/FolderCover.types.ts          |  1 -
 .../office-ui-fabric-react-tslint/tslint.json |  5 +--
 packages/utilities/src/BaseComponent.ts       |  5 ++-
 13 files changed, 67 insertions(+), 54 deletions(-)
 delete mode 100644 apps/todo-app/src/types/ITodoForm.ts
 create mode 100644 common/changes/@uifabric/utilities/strict-fix_2018-01-25-19-00.json

diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 1e03dc41727c5..5b133efbcb69e 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -18,7 +18,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
-    "immutability-helper": "^2.0.0",
+    "immutability-helper": "^2.6.4",
     "office-ui-fabric-react": ">=5.43.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/todo-app/src/components/Todo.tsx b/apps/todo-app/src/components/Todo.tsx
index 09adfe573f9d2..b1437176d52ca 100644
--- a/apps/todo-app/src/components/Todo.tsx
+++ b/apps/todo-app/src/components/Todo.tsx
@@ -53,7 +53,7 @@ export default class Todo extends React.Component<ITodoProps, ITodoState> {
     );
   }
 
-  private _renderWorkingOnItSpinner(): React.ReactElement<React.HTMLAttributes<HTMLDivElement>> {
+  private _renderWorkingOnItSpinner(): React.ReactElement<React.HTMLAttributes<HTMLDivElement>> | false {
     return (this.props.dataProvider.isLoading && this.state.items.length > 0) && (
       <div className={ styles.workingOnItSpinner }>
         <Spinner type={ SpinnerType.normal } />
@@ -61,7 +61,7 @@ export default class Todo extends React.Component<ITodoProps, ITodoState> {
     );
   }
 
-  private _renderFetchingTasksSpinner(): React.ReactElement<React.HTMLAttributes<HTMLDivElement>> {
+  private _renderFetchingTasksSpinner(): React.ReactElement<React.HTMLAttributes<HTMLDivElement>> | false {
     return (this.props.dataProvider.isLoading && this.state.items.length === 0) && (
       <div className={ styles.fetchingTasksSpinner }>
         <Spinner type={ SpinnerType.large } label={ strings.fetchingTasksLabel } />
diff --git a/apps/todo-app/src/components/TodoForm.tsx b/apps/todo-app/src/components/TodoForm.tsx
index 734130cb0c53e..72b714bc40964 100644
--- a/apps/todo-app/src/components/TodoForm.tsx
+++ b/apps/todo-app/src/components/TodoForm.tsx
@@ -1,12 +1,39 @@
 import * as React from 'react';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { autobind, BaseComponent, IBaseProps } from 'office-ui-fabric-react/lib/Utilities';
 import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
-import { TextField } from 'office-ui-fabric-react/lib/TextField';
-import { ITodoFormProps, ITodoFormState } from '../types/index';
+import { TextField, ITextField } from 'office-ui-fabric-react/lib/TextField';
 import * as stylesImport from './Todo.scss';
 const styles: any = stylesImport;
 import strings from './../strings';
 
+/**
+ * Props for TodoForm component.
+ */
+export interface ITodoFormProps extends IBaseProps {
+  /**
+   * onSubmit callback triggered when the is submitted.
+   * Either triggered by clicking on add button or pressed Enter key in input field.
+   *
+   * @params {string} title represents the value in input box when submitting.
+   */
+  onSubmit: (title: string) => void;
+}
+
+/**
+ * States for TodoForm component.
+ */
+export interface ITodoFormState {
+  /**
+   * inputValue is the react state of input box value.
+   */
+  inputValue: string;
+
+  /**
+   * The error message will show below the input box if the title filled in is invalid.
+   */
+  errorMessage: string;
+}
+
 /**
  * The form component used for adding new item to the list. It uses fabric-react components
  * TextField and PrimaryButton.
@@ -14,8 +41,8 @@ import strings from './../strings';
  * TextField: https://fabricreact.azurewebsites.net/fabric-react/master/#/examples/textfield
  * Button: https://fabricreact.azurewebsites.net/fabric-react/master/#/examples/button
  */
-export default class TodoForm extends React.Component<ITodoFormProps, ITodoFormState> {
-  private _textField: TextField;
+export default class TodoForm extends BaseComponent<ITodoFormProps, ITodoFormState> {
+  private _textField: ITextField;
 
   constructor(props: ITodoFormProps) {
     super(props);
@@ -35,7 +62,7 @@ export default class TodoForm extends React.Component<ITodoFormProps, ITodoFormS
         <TextField
           className={ styles.textField }
           value={ this.state.inputValue }
-          ref={ ref => this._textField = ref }
+          componentRef={ this._resolveRef('_textField') }
           placeholder={ strings.inputBoxPlaceholder }
           onBeforeChange={ this._onBeforeTextFieldChange }
           autoComplete='off'
@@ -55,12 +82,12 @@ export default class TodoForm extends React.Component<ITodoFormProps, ITodoFormS
   private _onSubmit(event: React.FormEvent<HTMLElement>): void {
     event.preventDefault();
 
-    if (!this._getTitleErrorMessage(this._textField.value)) {
+    if (!this._getTitleErrorMessage(this._textField.value || '')) {
       this.setState({
         inputValue: ''
       } as ITodoFormState);
 
-      this.props.onSubmit(this._textField.value);
+      this.props.onSubmit(this._textField.value || '');
     } else {
       this.setState({
         errorMessage: this._getTitleErrorMessage(this.state.inputValue)
diff --git a/apps/todo-app/src/components/TodoItem.tsx b/apps/todo-app/src/components/TodoItem.tsx
index 0ec6c4db0e265..dbb215e6ab296 100644
--- a/apps/todo-app/src/components/TodoItem.tsx
+++ b/apps/todo-app/src/components/TodoItem.tsx
@@ -78,7 +78,7 @@ export default class TodoItem extends React.Component<ITodoItemProps, {}> {
     return `${completeState} ${titleString}`;
   }
 
-  private _onCheckboxChange(ev: React.FormEvent<HTMLElement>, isChecked: boolean): void {
+  private _onCheckboxChange(ev?: React.FormEvent<HTMLElement>, isChecked?: boolean): void {
     this._handleWithAnimation(this.props.onToggleComplete, 'ms-slideUpOut20');
   }
 
diff --git a/apps/todo-app/src/components/TodoTabs.tsx b/apps/todo-app/src/components/TodoTabs.tsx
index c7fd2422c824a..1905304763535 100644
--- a/apps/todo-app/src/components/TodoTabs.tsx
+++ b/apps/todo-app/src/components/TodoTabs.tsx
@@ -23,8 +23,8 @@ import strings from './../strings';
  * Link of <FocusZone>: https://fabricreact.azurewebsites.net/fabric-react/master/#examples/focuszone
  */
 export default class TodoTabs extends React.Component<ITodoTabsProps, {}> {
-  public render(): React.ReactElement<IPivotProps> {
-    const pivotArray: IPivotProps[] = [];
+  public render(): React.ReactElement<IPivotProps> | null {
+    const pivotArray: React.ReactElement<IPivotProps>[] = [];
 
     const activeTasks: ITodoItem[] = this.props.items.filter((task: ITodoItem) => task.isComplete === false);
     const completedTasks: ITodoItem[] = this.props.items.filter((task: ITodoItem) => task.isComplete === true);
@@ -74,7 +74,7 @@ export default class TodoTabs extends React.Component<ITodoTabsProps, {}> {
   }
 
   @autobind
-  private _isInnerZoneKeystroke(ev): boolean {
+  private _isInnerZoneKeystroke(ev: React.KeyboardEvent<HTMLElement>): boolean {
     return ev.which === KeyCodes.right;
   }
 
diff --git a/apps/todo-app/src/types/ITodoForm.ts b/apps/todo-app/src/types/ITodoForm.ts
deleted file mode 100644
index 35c7a98e53909..0000000000000
--- a/apps/todo-app/src/types/ITodoForm.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-/**
- * Props for TodoForm component.
- */
-export interface ITodoFormProps {
-  /**
-   * onSubmit callback triggered when the is submitted.
-   * Either triggered by clicking on add button or pressed Enter key in input field.
-   *
-   * @params {string} title represents the value in input box when submitting.
-   */
-  onSubmit: (title: string) => void;
-}
-
-/**
- * States for TodoForm component.
- */
-export interface ITodoFormState {
-  /**
-   * inputValue is the react state of input box value.
-   */
-  inputValue: string;
-
-  /**
-   * The error message will show below the input box if the title filled in is invalid.
-   */
-  errorMessage: string;
-}
\ No newline at end of file
diff --git a/apps/todo-app/src/types/index.ts b/apps/todo-app/src/types/index.ts
index 86bc72a9d252a..fe97c9dcde007 100644
--- a/apps/todo-app/src/types/index.ts
+++ b/apps/todo-app/src/types/index.ts
@@ -1,5 +1,4 @@
 export * from './ITodo';
 export * from './ITodoTask';
-export * from './ITodoForm';
 export * from './ITodoTabs';
 export * from './IDataProvider';
\ No newline at end of file
diff --git a/apps/todo-app/tsconfig.json b/apps/todo-app/tsconfig.json
index e0cc58a3f09e3..bc1329ea89ddc 100644
--- a/apps/todo-app/tsconfig.json
+++ b/apps/todo-app/tsconfig.json
@@ -10,6 +10,11 @@
     "forceConsistentCasingInFileNames": true,
     "moduleResolution": "node",
     "preserveConstEnums": true,
+    "strict": true,
+    "lib": [
+      "es6",
+      "dom"
+    ],
     "types": [
       "webpack-env"
     ]
diff --git a/common/changes/@uifabric/utilities/strict-fix_2018-01-25-19-00.json b/common/changes/@uifabric/utilities/strict-fix_2018-01-25-19-00.json
new file mode 100644
index 0000000000000..504baa4a4a68c
--- /dev/null
+++ b/common/changes/@uifabric/utilities/strict-fix_2018-01-25-19-00.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "IBaseProps: typings adjusted to be less restrictive and compatible with strict mode.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 64b0b8e179d3b..2abaf9ca0411e 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -334,7 +334,7 @@
         "@types/react-dom": "16.0.3",
         "@types/webpack-env": "1.13.0",
         "es6-promise": "4.1.1",
-        "immutability-helper": "2.6.2",
+        "immutability-helper": "2.6.4",
         "react": "16.2.0",
         "react-dom": "16.2.0",
         "tslib": "1.8.1",
@@ -5885,9 +5885,8 @@
       "integrity": "sha1-vjPUCsEO8ZJnAfbwii2G+/0a0+Q="
     },
     "immutability-helper": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.6.2.tgz",
-      "integrity": "sha512-2boGYtiA++szFIXl9tlTJ7f2emec+3UCaRjv8Ixnw62G43rz2n+vZ5kfs6fUmCORKuhJHFR2oSuAxBgrMxt95g==",
+      "version": "2.6.4",
+      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.6.4.tgz",
       "requires": {
         "invariant": "2.2.2"
       }
@@ -14880,4 +14879,4 @@
       }
     }
   }
-}
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/FolderCover/FolderCover.types.ts b/packages/experiments/src/components/FolderCover/FolderCover.types.ts
index d81c8cb147a97..5c0d5f83a14d0 100644
--- a/packages/experiments/src/components/FolderCover/FolderCover.types.ts
+++ b/packages/experiments/src/components/FolderCover/FolderCover.types.ts
@@ -1,4 +1,3 @@
-
 import * as React from 'react';
 import { IBaseProps } from '../../Utilities';
 import { FolderCover } from './FolderCover';
diff --git a/packages/office-ui-fabric-react-tslint/tslint.json b/packages/office-ui-fabric-react-tslint/tslint.json
index 4080beec334cb..67a68159eae09 100644
--- a/packages/office-ui-fabric-react-tslint/tslint.json
+++ b/packages/office-ui-fabric-react-tslint/tslint.json
@@ -135,7 +135,7 @@
     "no-constant-condition": true,
     "no-construct": true,
     "no-debugger": true,
-    "no-duplicate-case": true,
+    "no-duplicate-switch-case": true,
     "no-duplicate-parameter-names": true,
     "no-empty": true,
     "no-eval": true,
@@ -172,7 +172,6 @@
         "variable-declaration": "nospace"
       }
     ],
-    "use-named-parameter": true,
-    "valid-typeof": true
+    "use-named-parameter": true
   }
 }
\ No newline at end of file
diff --git a/packages/utilities/src/BaseComponent.ts b/packages/utilities/src/BaseComponent.ts
index 1c89e37697838..915e2840fd549 100644
--- a/packages/utilities/src/BaseComponent.ts
+++ b/packages/utilities/src/BaseComponent.ts
@@ -9,8 +9,9 @@ import { warnDeprecations, warnMutuallyExclusive, warnConditionallyRequiredProps
  *
  * @public
  */
-export interface IBaseProps {
-  componentRef?: (ref: React.ReactNode | null) => (void | React.ReactNode);
+// tslint:disable-next-line:no-any
+export interface IBaseProps<T = any> {
+  componentRef?: (ref: T | null) => (void | T);
 }
 
 /**

From 0ab447106a52f68dcea5973494b91e1ce74c5ba7 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 26 Jan 2018 11:25:22 +0000
Subject: [PATCH 1274/1641] Applying package updates.

---
 .../strict-fix_2018-01-25-19-00.json          | 11 ------
 ...chan-accSplitButtons_2018-01-23-00-13.json | 11 ------
 ...opdown-disabled-opts_2017-12-22-00-45.json | 11 ------
 ...people-picker-height_2018-01-25-18-32.json | 11 ------
 ...w-input-field-styles_2018-01-24-17-58.json | 11 ------
 packages/example-app-base/package.json        |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 34 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 12 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 ++++++++
 packages/utilities/CHANGELOG.md               |  9 ++++-
 packages/utilities/package.json               |  2 +-
 13 files changed, 72 insertions(+), 62 deletions(-)
 delete mode 100644 common/changes/@uifabric/utilities/strict-fix_2018-01-25-19-00.json
 delete mode 100644 common/changes/office-ui-fabric-react/chiechan-accSplitButtons_2018-01-23-00-13.json
 delete mode 100644 common/changes/office-ui-fabric-react/dropdown-disabled-opts_2017-12-22-00-45.json
 delete mode 100644 common/changes/office-ui-fabric-react/people-picker-height_2018-01-25-18-32.json
 delete mode 100644 common/changes/office-ui-fabric-react/v-krbrow-input-field-styles_2018-01-24-17-58.json

diff --git a/common/changes/@uifabric/utilities/strict-fix_2018-01-25-19-00.json b/common/changes/@uifabric/utilities/strict-fix_2018-01-25-19-00.json
deleted file mode 100644
index 504baa4a4a68c..0000000000000
--- a/common/changes/@uifabric/utilities/strict-fix_2018-01-25-19-00.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "IBaseProps: typings adjusted to be less restrictive and compatible with strict mode.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/chiechan-accSplitButtons_2018-01-23-00-13.json b/common/changes/office-ui-fabric-react/chiechan-accSplitButtons_2018-01-23-00-13.json
deleted file mode 100644
index 5330dfd2d0ea4..0000000000000
--- a/common/changes/office-ui-fabric-react/chiechan-accSplitButtons_2018-01-23-00-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SplitButton - added aria support for button in split buttons and the whole container",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chiechan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/dropdown-disabled-opts_2017-12-22-00-45.json b/common/changes/office-ui-fabric-react/dropdown-disabled-opts_2017-12-22-00-45.json
deleted file mode 100644
index 070309aac5aff..0000000000000
--- a/common/changes/office-ui-fabric-react/dropdown-disabled-opts_2017-12-22-00-45.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown, Checkbox: Fix disabled Dropdown options and update Checkbox disabled styles",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "erabelle@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/people-picker-height_2018-01-25-18-32.json b/common/changes/office-ui-fabric-react/people-picker-height_2018-01-25-18-32.json
deleted file mode 100644
index 20c7258711b90..0000000000000
--- a/common/changes/office-ui-fabric-react/people-picker-height_2018-01-25-18-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Persona: Changed text and root heights for size24 when secondary text is shown.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/v-krbrow-input-field-styles_2018-01-24-17-58.json b/common/changes/office-ui-fabric-react/v-krbrow-input-field-styles_2018-01-24-17-58.json
deleted file mode 100644
index 34cfaef0cc8bb..0000000000000
--- a/common/changes/office-ui-fabric-react/v-krbrow-input-field-styles_2018-01-24-17-58.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "TextField, Pickers, PeoplePicker: Homogenizing input heights and colors",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-krbrow@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index d5f122e0b25b6..e79c249fafdc2 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.17.0 <6.0.0",
-    "@uifabric/utilities": ">=5.7.1 <6.0.0",
+    "@uifabric/utilities": ">=5.8.0 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index e669df8bc02f5..1c1914e842872 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,40 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.43.1",
+      "tag": "office-ui-fabric-react_v5.43.1",
+      "date": "Fri, 26 Jan 2018 11:25:22 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "chang47 <coralbue@gmail.com>",
+            "commit": "ec38e5b026b1f8a8e58fa6f3211f98d6d0eb2098",
+            "comment": "SplitButton - added aria support for button in split buttons and the whole container"
+          },
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "c8a644b42c74a65224fa85c18eacd0de8e2e91c4",
+            "comment": "Dropdown, Checkbox: Fix disabled Dropdown options and update Checkbox disabled styles"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "9432151081a1c3af197fe5c74b3192fb97267b79",
+            "comment": "Persona: Changed text and root heights for size24 when secondary text is shown."
+          },
+          {
+            "author": "Kris Brown <kristoferbrown@users.noreply.github.com>",
+            "commit": "ecd9ec777720dc4e3c1e72e34640103e803a3a9b",
+            "comment": "TextField, Pickers, PeoplePicker: Homogenizing input heights and colors"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.7.1 <6.0.0` to `>=5.8.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.43.0",
       "tag": "office-ui-fabric-react_v5.43.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 7e33b0abb198f..b582149e31418 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,16 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 25 Jan 2018 11:23:07 GMT and should not be manually modified.
+This log was last generated on Fri, 26 Jan 2018 11:25:22 GMT and should not be manually modified.
+
+## 5.43.1
+Fri, 26 Jan 2018 11:25:22 GMT
+
+### Patches
+
+- SplitButton - added aria support for button in split buttons and the whole container
+- Dropdown, Checkbox: Fix disabled Dropdown options and update Checkbox disabled styles
+- Persona: Changed text and root heights for size24 when secondary text is shown.
+- TextField, Pickers, PeoplePicker: Homogenizing input heights and colors
 
 ## 5.43.0
 Thu, 25 Jan 2018 11:23:07 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 53aa9a9e311e6..e3842f32aeee9 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.43.0",
+  "version": "5.43.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -50,7 +50,7 @@
     "@uifabric/icons": ">=5.4.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.11.0 <6.0.0",
     "@uifabric/styling": ">=5.17.0 <6.0.0",
-    "@uifabric/utilities": ">=5.7.1 <6.0.0",
+    "@uifabric/utilities": ">=5.8.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 5f446f16d9ee1..b8684c1dd3cc2 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.7.1 <6.0.0",
+    "@uifabric/utilities": ">=5.8.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.11.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 034df666c5e8d..df4fa1c074a8d 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.8.0",
+      "tag": "@uifabric/utilities_v5.8.0",
+      "date": "Fri, 26 Jan 2018 11:25:22 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "46ca980e37486b51ccf2bc13aea571213bb081e9",
+            "comment": "IBaseProps: typings adjusted to be less restrictive and compatible with strict mode."
+          }
+        ]
+      }
+    },
     {
       "version": "5.7.1",
       "tag": "@uifabric/utilities_v5.7.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 4bec8e9738e0e..c13805688dc58 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Thu, 25 Jan 2018 11:23:06 GMT and should not be manually modified.
+This log was last generated on Fri, 26 Jan 2018 11:25:22 GMT and should not be manually modified.
+
+## 5.8.0
+Fri, 26 Jan 2018 11:25:22 GMT
+
+### Minor changes
+
+- IBaseProps: typings adjusted to be less restrictive and compatible with strict mode.
 
 ## 5.7.1
 Thu, 25 Jan 2018 11:23:06 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index b27b1fa47bd2a..a0168224c834b 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.7.1",
+  "version": "5.8.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 489029c305a765db94f8b42e25fed99147420cd7 Mon Sep 17 00:00:00 2001
From: Sean Larkin <sean.larkin@cuw.edu>
Date: Fri, 26 Jan 2018 10:01:18 -0800
Subject: [PATCH 1275/1641] feat(pkg): add sideEffects false field (#3805)

Update package.json to add sideEffects: false
---
 packages/office-ui-fabric-react/package.json | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index e3842f32aeee9..758ce36787175 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -8,6 +8,7 @@
     "type": "git",
     "url": "https://github.com/OfficeDev/office-ui-fabric-react"
   },
+  "sideEffects": false,
   "license": "MIT",
   "scripts": {
     "build": "node ../../scripts/build.js",
@@ -58,4 +59,4 @@
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   }
-}
\ No newline at end of file
+}

From 58615e57bf5698dc425d8c825163697b26303243 Mon Sep 17 00:00:00 2001
From: chang47 <coralbue@gmail.com>
Date: Fri, 26 Jan 2018 10:04:07 -0800
Subject: [PATCH 1276/1641] Combo Box - Adding title and Improved
 aria-activedescendant for accessibility (#3738)

* added aria-autocomplete; added title; added activedescendant with focus item

* added comments in combobox

* removed autocomplete value for now

* cleaned up code

* added change files

* fixed for id for label to point to the input element

* updated changes with aria-autocomplete

* fixed lint problem; updated test snap file

* fixed aria autocomplete to have the correct logic in if check

* simplified code and changed priority of title values

* addressed lint problems and updated test

* updated title to only use title attribute for combobox
---
 ...chiechan-checkboxAcc_2018-01-17-19-40.json | 11 +++++++
 .../src/components/ComboBox/ComboBox.tsx      | 30 +++++++++++++++++--
 .../__snapshots__/ComboBox.test.tsx.snap      |  3 +-
 3 files changed, 40 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/chiechan-checkboxAcc_2018-01-17-19-40.json

diff --git a/common/changes/office-ui-fabric-react/chiechan-checkboxAcc_2018-01-17-19-40.json b/common/changes/office-ui-fabric-react/chiechan-checkboxAcc_2018-01-17-19-40.json
new file mode 100644
index 0000000000000..b0685324f8ef1
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/chiechan-checkboxAcc_2018-01-17-19-40.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Combox box: added accessibility changes added a title and changed activedescendant to use focused element",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chiechan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 22d0875891a1f..7f3d9dea9c3ab 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -273,6 +273,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       buttonIconProps,
       styles: customStyles,
       theme,
+      title
     } = this.props;
     let { isOpen, selectedIndex, focused, suggestedDisplayValue } = this.state;
     this._currentVisibleValue = this._getVisibleValue();
@@ -295,7 +296,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     return (
       <div {...divProps } ref='root' className={ this._classNames.container }>
         { label && (
-          <Label id={ id + '-label' } disabled={ disabled } required={ required } htmlFor={ id } className={ this._classNames.label }>{ label }</Label>
+          <Label id={ id + '-label' } disabled={ disabled } required={ required } htmlFor={ id + '-input' } className={ this._classNames.label }>{ label }</Label>
         ) }
         <div
           ref={ this._resolveRef('_comboBoxWrapper') }
@@ -315,14 +316,14 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
             onClick={ this._onBaseAutofillClick }
             onInputValueChange={ this._onInputChange }
             aria-expanded={ isOpen }
-            aria-autocomplete={ (!disabled && autoComplete === 'on') }
+            aria-autocomplete={ this._getAriaAutoCompleteValue() }
             role='combobox'
             aria-readonly={ ((allowFreeform || disabled) ? null : 'true') }
             readOnly={ disabled || !allowFreeform }
             aria-labelledby={ (label && (id + '-label')) }
             aria-label={ ((ariaLabel && !label) && ariaLabel) }
             aria-describedby={ (id + '-option') }
-            aria-activedescendant={ (isOpen && (selectedIndex as number) >= 0 ? (id + '-list' + selectedIndex) : null) }
+            aria-activedescendant={ this._getAriaActiveDescentValue() }
             aria-disabled={ disabled }
             aria-owns={ (id + '-list') }
             spellCheck={ false }
@@ -330,6 +331,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
             suggestedDisplayValue={ suggestedDisplayValue }
             updateValueInWillReceiveProps={ this._onUpdateValueInAutoFillWillReceiveProps }
             shouldSelectFullInputValueInComponentDidUpdate={ this._onShouldSelectFullInputValueInAutoFillComponentDidUpdate }
+            title={ title }
           />
           <IconButton
             className={ 'ms-ComboBox-CaretDown-button' }
@@ -1540,4 +1542,26 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
     return getOptionStyles(this.props.theme!, customStylesForAllOptions, customStylesForCurrentOption);
   }
+
+  /**
+   * Get the aria-activedescendant value for the comboxbox.
+   * @returns the id of the current focused combo item, otherwise the id of the currently selected element, null otherwise
+   */
+  private _getAriaActiveDescentValue(): string | null {
+    let descendantText = (this.state.isOpen && (this.state.selectedIndex as number) >= 0 ? (this._id + '-list' + this.state.selectedIndex) : null);
+    if (this.state.isOpen && this.state.focused && this.state.currentPendingValueValidIndex !== -1) {
+      descendantText = (this._id + '-list' + this.state.currentPendingValueValidIndex);
+    }
+    return descendantText;
+  }
+
+  /**
+  * Get the aria autocomplete value for the Combobox
+  * @returns 'inline' if auto-complete automatically dynamic, 'both' if we have a list of possible values to pick from and can
+  * dynamically populate input, and 'none' if auto-complete is not enabled as we can't give user inputs.
+  */
+  private _getAriaAutoCompleteValue(): string {
+    let autoComplete = !this.props.disabled && this.props.autoComplete === 'on';
+    return autoComplete ? (this.props.allowFreeform ? 'inline' : 'both') : 'none';
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
index a9e542b214e9a..fcb541039f1d3 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
@@ -71,7 +71,7 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
   >
     <input
       aria-activedescendant={null}
-      aria-autocomplete={true}
+      aria-autocomplete="both"
       aria-describedby="ComboBox0-option"
       aria-disabled={undefined}
       aria-expanded={false}
@@ -114,6 +114,7 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
       readOnly={true}
       role="combobox"
       spellCheck={false}
+      title={undefined}
       type="text"
       value=""
     />

From 9d785c7971d56222ec9cbb72d5d624fa8209718c Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Fri, 26 Jan 2018 11:39:40 -0800
Subject: [PATCH 1277/1641] Fix peoplepicker coin (#3816)

* setting people picker coin default back to 28 from 24

* change note
---
 .../fix-peoplepicker-coin_2018-01-26-19-16.json       | 11 +++++++++++
 .../PeoplePickerItems/SelectedItemDefault.tsx         |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-peoplepicker-coin_2018-01-26-19-16.json

diff --git a/common/changes/office-ui-fabric-react/fix-peoplepicker-coin_2018-01-26-19-16.json b/common/changes/office-ui-fabric-react/fix-peoplepicker-coin_2018-01-26-19-16.json
new file mode 100644
index 0000000000000..96563b214ec1e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-peoplepicker-coin_2018-01-26-19-16.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "setting people picker default size back to 28 from 24",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
index 74430524dc207..b8deb62126cea 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
@@ -48,7 +48,7 @@ export const SelectedItemDefault: (props: IPeoplePickerItemProps) => JSX.Element
         <Persona
           { ...item }
           presence={ item.presence !== undefined ? item.presence : PersonaPresence.none }
-          size={ PersonaSize.size24 }
+          size={ PersonaSize.size28 }
         />
       </div>
       <IconButton

From da8f81e67666094e5b522db3b3c9917e3cc9767c Mon Sep 17 00:00:00 2001
From: John Miller <rubixws@gmail.com>
Date: Fri, 26 Jan 2018 12:53:09 -0800
Subject: [PATCH 1278/1641] Fixing height on picker input (#3814)

---
 .../src/components/pickers/BasePicker.scss                      | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.scss b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.scss
index bc1b92cedc895..c75e4daf29313 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.scss
@@ -19,7 +19,7 @@
 }
 
 .pickerInput {
-  height: 30px;
+  height: 34px;
   border: none;
   flex-grow: 1;
   outline: none;

From 25129e761bc4463160015d5282c82f66aad99174 Mon Sep 17 00:00:00 2001
From: Srikanth Deshpande <srideshpande@users.noreply.github.com>
Date: Fri, 26 Jan 2018 13:17:39 -0800
Subject: [PATCH 1279/1641] Fabric icons update (#3797)

* new line

* Updating icons

* rush change file

* Removing the third party logos from the list of icons being exported

* Updating the names of enum, not to start with a number
---
 ...eshpande-icon-update_2018-01-24-23-44.json |  11 +
 packages/icons/src/IconNames.ts               | 339 ++++++++++++++----
 packages/icons/src/fabric-icons-0.ts          |  16 +-
 packages/icons/src/fabric-icons-1.ts          |  48 +--
 packages/icons/src/fabric-icons-10.ts         | 124 +++----
 packages/icons/src/fabric-icons-11.ts         | 110 +++---
 packages/icons/src/fabric-icons-12.ts         | 132 +++++++
 packages/icons/src/fabric-icons-13.ts         | 128 +++++++
 packages/icons/src/fabric-icons-14.ts         |  34 ++
 packages/icons/src/fabric-icons-2.ts          |  48 +--
 packages/icons/src/fabric-icons-3.ts          |  62 ++--
 packages/icons/src/fabric-icons-4.ts          |  77 ++--
 packages/icons/src/fabric-icons-5.ts          |  61 ++--
 packages/icons/src/fabric-icons-6.ts          |  77 ++--
 packages/icons/src/fabric-icons-7.ts          |  96 ++---
 packages/icons/src/fabric-icons-8.ts          | 118 +++---
 packages/icons/src/fabric-icons-9.ts          |  76 ++--
 packages/icons/src/fabric-icons.ts            |   7 +-
 packages/icons/src/index.ts                   |   7 +-
 19 files changed, 1069 insertions(+), 502 deletions(-)
 create mode 100644 common/changes/@uifabric/icons/srideshpande-icon-update_2018-01-24-23-44.json
 create mode 100644 packages/icons/src/fabric-icons-12.ts
 create mode 100644 packages/icons/src/fabric-icons-13.ts
 create mode 100644 packages/icons/src/fabric-icons-14.ts

diff --git a/common/changes/@uifabric/icons/srideshpande-icon-update_2018-01-24-23-44.json b/common/changes/@uifabric/icons/srideshpande-icon-update_2018-01-24-23-44.json
new file mode 100644
index 0000000000000..6fcb96111e0eb
--- /dev/null
+++ b/common/changes/@uifabric/icons/srideshpande-icon-update_2018-01-24-23-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/icons",
+      "comment": "Updating fabric icons in office-ui-fabric-react's  @uifabric/icons package",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/icons",
+  "email": "srdeshpa@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/icons/src/IconNames.ts b/packages/icons/src/IconNames.ts
index 995f7100446d1..d0bdf920b1958 100644
--- a/packages/icons/src/IconNames.ts
+++ b/packages/icons/src/IconNames.ts
@@ -1,6 +1,7 @@
 export const enum IconNames {
   DecreaseIndentLegacy = 'DecreaseIndentLegacy',
   IncreaseIndentLegacy = 'IncreaseIndentLegacy',
+  SizeLegacy = 'SizeLegacy',
   GlobalNavButton = 'GlobalNavButton',
   InternetSharing = 'InternetSharing',
   Brightness = 'Brightness',
@@ -38,6 +39,8 @@ export const enum IconNames {
   Refresh = 'Refresh',
   Share = 'Share',
   Lock = 'Lock',
+  BlockedSite = 'BlockedSite',
+  ReportHacked = 'ReportHacked',
   EMI = 'EMI',
   MiniLink = 'MiniLink',
   Blocked = 'Blocked',
@@ -56,6 +59,7 @@ export const enum IconNames {
   Print = 'Print',
   Up = 'Up',
   Down = 'Down',
+  OEM = 'OEM',
   Delete = 'Delete',
   Save = 'Save',
   Cloud = 'Cloud',
@@ -99,6 +103,7 @@ export const enum IconNames {
   Contrast = 'Contrast',
   Redo = 'Redo',
   Undo = 'Undo',
+  Crop = 'Crop',
   PhotoCollection = 'PhotoCollection',
   Album = 'Album',
   Rotate = 'Rotate',
@@ -123,6 +128,7 @@ export const enum IconNames {
   Admin = 'Admin',
   TVMonitor = 'TVMonitor',
   Speakers = 'Speakers',
+  StackIndicator = 'StackIndicator',
   Nav2DMapView = 'Nav2DMapView',
   Car = 'Car',
   Bus = 'Bus',
@@ -134,15 +140,20 @@ export const enum IconNames {
   IncidentTriangle = 'IncidentTriangle',
   Touch = 'Touch',
   MapDirections = 'MapDirections',
+  CaretHollow = 'CaretHollow',
+  CaretSolid = 'CaretSolid',
   History = 'History',
   Location = 'Location',
   Work = 'Work',
   Recent = 'Recent',
   Hotel = 'Hotel',
   LocationDot = 'LocationDot',
-  News = 'News',
-  Chat = 'Chat',
-  Group = 'Group',
+  Dictionary = 'Dictionary',
+  ChromeBack = 'ChromeBack',
+  FolderOpen = 'FolderOpen',
+  Pinned = 'Pinned',
+  PinnedFill = 'PinnedFill',
+  RevToggleKey = 'RevToggleKey',
   View = 'View',
   Previous = 'Previous',
   Next = 'Next',
@@ -165,9 +176,13 @@ export const enum IconNames {
   ViewAll = 'ViewAll',
   Switch = 'Switch',
   Rename = 'Rename',
+  Remote = 'Remote',
+  SelectAll = 'SelectAll',
+  Orientation = 'Orientation',
   Import = 'Import',
   Folder = 'Folder',
   Picture = 'Picture',
+  ChromeClose = 'ChromeClose',
   ShowResults = 'ShowResults',
   Message = 'Message',
   CalendarDay = 'CalendarDay',
@@ -202,6 +217,7 @@ export const enum IconNames {
   FontSize = 'FontSize',
   CellPhone = 'CellPhone',
   Tag = 'Tag',
+  Calculator = 'Calculator',
   Library = 'Library',
   PostUpdate = 'PostUpdate',
   NewFolder = 'NewFolder',
@@ -210,8 +226,12 @@ export const enum IconNames {
   SyncFolder = 'SyncFolder',
   BlockContact = 'BlockContact',
   AddFriend = 'AddFriend',
+  Accept = 'Accept',
   BulletedList = 'BulletedList',
   Preview = 'Preview',
+  News = 'News',
+  Chat = 'Chat',
+  Group = 'Group',
   World = 'World',
   Comment = 'Comment',
   DockLeft = 'DockLeft',
@@ -229,17 +249,16 @@ export const enum IconNames {
   LocationFill = 'LocationFill',
   ChromeMinimize = 'ChromeMinimize',
   Annotation = 'Annotation',
-  ChromeClose = 'ChromeClose',
-  Accept = 'Accept',
   Fingerprint = 'Fingerprint',
   Handwriting = 'Handwriting',
-  StackIndicator = 'StackIndicator',
   Completed = 'Completed',
   Label = 'Label',
   FlickDown = 'FlickDown',
   FlickUp = 'FlickUp',
   FlickLeft = 'FlickLeft',
   FlickRight = 'FlickRight',
+  MiniExpand = 'MiniExpand',
+  MiniContract = 'MiniContract',
   Streaming = 'Streaming',
   MusicInCollection = 'MusicInCollection',
   OneDrive = 'OneDrive',
@@ -263,29 +282,21 @@ export const enum IconNames {
   ChevronDownMed = 'ChevronDownMed',
   ChevronLeftMed = 'ChevronLeftMed',
   ChevronRightMed = 'ChevronRightMed',
-  Dictionary = 'Dictionary',
-  ChromeBack = 'ChromeBack',
   PC1 = 'PC1',
   PresenceChickletVideo = 'PresenceChickletVideo',
   Reply = 'Reply',
   HalfAlpha = 'HalfAlpha',
-  LockSolid = 'LockSolid',
   ConstructionCone = 'ConstructionCone',
   DoubleChevronLeftMed = 'DoubleChevronLeftMed',
   Volume0 = 'Volume0',
   Volume1 = 'Volume1',
   Volume2 = 'Volume2',
   Volume3 = 'Volume3',
-  CaretHollow = 'CaretHollow',
-  CaretSolid = 'CaretSolid',
-  FolderOpen = 'FolderOpen',
-  Pinned = 'Pinned',
-  PinnedFill = 'PinnedFill',
   Chart = 'Chart',
   Robot = 'Robot',
+  LockSolid = 'LockSolid',
   BidiLtr = 'BidiLtr',
   BidiRtl = 'BidiRtl',
-  RevToggleKey = 'RevToggleKey',
   RightDoubleQuote = 'RightDoubleQuote',
   Sunny = 'Sunny',
   CloudWeather = 'CloudWeather',
@@ -305,8 +316,6 @@ export const enum IconNames {
   Duststorm = 'Duststorm',
   Unknown = 'Unknown',
   Precipitation = 'Precipitation',
-  Ringer = 'Ringer',
-  PDF = 'PDF',
   SortLines = 'SortLines',
   Ribbon = 'Ribbon',
   AreaChart = 'AreaChart',
@@ -323,15 +332,24 @@ export const enum IconNames {
   SnowShowerDay = 'SnowShowerDay',
   HailDay = 'HailDay',
   WorkFlow = 'WorkFlow',
-  StoreLogoMed = 'StoreLogoMed',
+  HourGlass = 'HourGlass',
+  StoreLogoMed20 = 'StoreLogoMed20',
+  TimeSheet = 'TimeSheet',
   TriangleSolid = 'TriangleSolid',
+  VideoSolid = 'VideoSolid',
   RainShowersNight = 'RainShowersNight',
   SnowShowerNight = 'SnowShowerNight',
+  Teamwork = 'Teamwork',
   HailNight = 'HailNight',
+  PeopleAdd = 'PeopleAdd',
+  Glasses = 'Glasses',
+  DateTime2 = 'DateTime2',
+  Shield = 'Shield',
+  Header1 = 'Header1',
+  PageAdd = 'PageAdd',
+  NumberedList = 'NumberedList',
+  PowerBILogo = 'PowerBILogo',
   Info2 = 'Info2',
-  StoreLogo = 'StoreLogo',
-  MultiSelectMirrored = 'MultiSelectMirrored',
-  Broom = 'Broom',
   MusicInCollectionFill = 'MusicInCollectionFill',
   List = 'List',
   Asterisk = 'Asterisk',
@@ -366,6 +384,12 @@ export const enum IconNames {
   EmojiNeutral = 'EmojiNeutral',
   EmojiDisappointed = 'EmojiDisappointed',
   HomeSolid = 'HomeSolid',
+  Ringer = 'Ringer',
+  PDF = 'PDF',
+  HeartBroken = 'HeartBroken',
+  StoreLogo16 = 'StoreLogo16',
+  MultiSelectMirrored = 'MultiSelectMirrored',
+  Broom = 'Broom',
   Cocktails = 'Cocktails',
   Wines = 'Wines',
   Articles = 'Articles',
@@ -373,9 +397,11 @@ export const enum IconNames {
   DietPlanNotebook = 'DietPlanNotebook',
   Pill = 'Pill',
   ExerciseTracker = 'ExerciseTracker',
+  HandsFree = 'HandsFree',
   Medical = 'Medical',
   Running = 'Running',
   Weights = 'Weights',
+  AddNotes = 'AddNotes',
   BarChart4 = 'BarChart4',
   CirclePlus = 'CirclePlus',
   Coffee = 'Coffee',
@@ -386,8 +412,10 @@ export const enum IconNames {
   PieSingle = 'PieSingle',
   RemoveFilter = 'RemoveFilter',
   Savings = 'Savings',
+  Sell = 'Sell',
   StockDown = 'StockDown',
   StockUp = 'StockUp',
+  Lamp = 'Lamp',
   MSNVideos = 'MSNVideos',
   Cricket = 'Cricket',
   Golf = 'Golf',
@@ -400,6 +428,7 @@ export const enum IconNames {
   ProFootball = 'ProFootball',
   ProHockey = 'ProHockey',
   Rugby = 'Rugby',
+  SubstitutionsIn = 'SubstitutionsIn',
   Tennis = 'Tennis',
   Arrivals = 'Arrivals',
   Design = 'Design',
@@ -431,14 +460,20 @@ export const enum IconNames {
   Rewind = 'Rewind',
   Photo2 = 'Photo2',
   OpenSource = 'OpenSource',
+  Movers = 'Movers',
   CloudDownload = 'CloudDownload',
-  WindDirection = 'WindDirection',
   Family = 'Family',
+  WindDirection = 'WindDirection',
+  Bug = 'Bug',
+  SiteScan = 'SiteScan',
+  BrowserScreenShot = 'BrowserScreenShot',
+  F12DevTools = 'F12DevTools',
   CSS = 'CSS',
   JS = 'JS',
   DeliveryTruck = 'DeliveryTruck',
   ReminderPerson = 'ReminderPerson',
   ReminderGroup = 'ReminderGroup',
+  TabletMode = 'TabletMode',
   Umbrella = 'Umbrella',
   NetworkTower = 'NetworkTower',
   CityNext = 'CityNext',
@@ -457,6 +492,7 @@ export const enum IconNames {
   PowerPointLogoInverse = 'PowerPointLogoInverse',
   Cafe = 'Cafe',
   SpeedHigh = 'SpeedHigh',
+  Commitments = 'Commitments',
   ThisPC = 'ThisPC',
   MusicNote = 'MusicNote',
   MicOff = 'MicOff',
@@ -471,6 +507,7 @@ export const enum IconNames {
   DeveloperTools = 'DeveloperTools',
   InsertTextBox = 'InsertTextBox',
   LowerBrightness = 'LowerBrightness',
+  DOM = 'DOM',
   CloudUpload = 'CloudUpload',
   ScrollUpDown = 'ScrollUpDown',
   DateTime = 'DateTime',
@@ -490,16 +527,6 @@ export const enum IconNames {
   RadioBtnOn = 'RadioBtnOn',
   ExploreContent = 'ExploreContent',
   Embed = 'Embed',
-  VideoSolid = 'VideoSolid',
-  Teamwork = 'Teamwork',
-  PeopleAdd = 'PeopleAdd',
-  Glasses = 'Glasses',
-  DateTime2 = 'DateTime2',
-  Shield = 'Shield',
-  Header1 = 'Header1',
-  PageAdd = 'PageAdd',
-  NumberedList = 'NumberedList',
-  PowerBILogo = 'PowerBILogo',
   Product = 'Product',
   ProgressLoopInner = 'ProgressLoopInner',
   ProgressLoopOuter = 'ProgressLoopOuter',
@@ -508,6 +535,7 @@ export const enum IconNames {
   Glimmer = 'Glimmer',
   ChatInviteFriend = 'ChatInviteFriend',
   Crown = 'Crown',
+  ScaleUp = 'ScaleUp',
   Feedback = 'Feedback',
   SharepointLogoInverse = 'SharepointLogoInverse',
   YammerLogo = 'YammerLogo',
@@ -520,6 +548,7 @@ export const enum IconNames {
   OutOfOffice = 'OutOfOffice',
   Trophy = 'Trophy',
   ReopenPages = 'ReopenPages',
+  EmojiTabSymbols = 'EmojiTabSymbols',
   AADLogo = 'AADLogo',
   AccessLogo = 'AccessLogo',
   AdminALogoInverse32 = 'AdminALogoInverse32',
@@ -574,6 +603,7 @@ export const enum IconNames {
   Room = 'Room',
   Unsubscribe = 'Unsubscribe',
   Subscribe = 'Subscribe',
+  HardDrive = 'HardDrive',
   RecurringTask = 'RecurringTask',
   TaskManager = 'TaskManager',
   TaskManagerMirrored = 'TaskManagerMirrored',
@@ -617,10 +647,14 @@ export const enum IconNames {
   ExportMirrored = 'ExportMirrored',
   SingleBookmark = 'SingleBookmark',
   DoubleChevronDown = 'DoubleChevronDown',
+  FollowUser = 'FollowUser',
   ReplyAll = 'ReplyAll',
+  WorkforceManagement = 'WorkforceManagement',
   Questionnaire = 'Questionnaire',
+  ManagerSelfService = 'ManagerSelfService',
   ReplyMirrored = 'ReplyMirrored',
   ReplyAllMirrored = 'ReplyAllMirrored',
+  Medal = 'Medal',
   AddGroup = 'AddGroup',
   QuestionnaireMirrored = 'QuestionnaireMirrored',
   TemporaryUser = 'TemporaryUser',
@@ -632,6 +666,7 @@ export const enum IconNames {
   AwayStatus = 'AwayStatus',
   MyMoviesTV = 'MyMoviesTV',
   SyncToPC = 'SyncToPC',
+  GenericScan = 'GenericScan',
   AustralianRules = 'AustralianRules',
   WifiEthernet = 'WifiEthernet',
   DateTimeMirrored = 'DateTimeMirrored',
@@ -673,7 +708,10 @@ export const enum IconNames {
   DelveAnalytics = 'DelveAnalytics',
   ArrowUpRightMirrored8 = 'ArrowUpRightMirrored8',
   ArrowDownRightMirrored8 = 'ArrowDownRightMirrored8',
+  CompanyDirectory = 'CompanyDirectory',
+  CompanyDirectoryMirrored = 'CompanyDirectoryMirrored',
   OneDriveAdd = 'OneDriveAdd',
+  ProfileSearch = 'ProfileSearch',
   Header2 = 'Header2',
   Header3 = 'Header3',
   Header4 = 'Header4',
@@ -736,13 +774,21 @@ export const enum IconNames {
   EmptyRecycleBin = 'EmptyRecycleBin',
   Hide2 = 'Hide2',
   Breadcrumb = 'Breadcrumb',
+  BirthdayCake = 'BirthdayCake',
   ClearFilter = 'ClearFilter',
   Flow = 'Flow',
+  TimeEntry = 'TimeEntry',
   PageEdit = 'PageEdit',
+  PageRemove = 'PageRemove',
   Database = 'Database',
+  EditContact = 'EditContact',
+  ConnectContacts = 'ConnectContacts',
+  ActivateOrders = 'ActivateOrders',
+  DeactivateOrders = 'DeactivateOrders',
   DocumentManagement = 'DocumentManagement',
   CRMReport = 'CRMReport',
   ZipFolder = 'ZipFolder',
+  SurveyQuestions = 'SurveyQuestions',
   TextDocument = 'TextDocument',
   PageCheckedOut = 'PageCheckedOut',
   SaveAndClose = 'SaveAndClose',
@@ -793,6 +839,7 @@ export const enum IconNames {
   StatusCircleOuter = 'StatusCircleOuter',
   StatusCircleInner = 'StatusCircleInner',
   StatusCircleCheckmark = 'StatusCircleCheckmark',
+  Toll = 'Toll',
   ExploreContentSingle = 'ExploreContentSingle',
   CollapseContent = 'CollapseContent',
   CollapseContentSingle = 'CollapseContentSingle',
@@ -800,7 +847,11 @@ export const enum IconNames {
   ProgressRingDots = 'ProgressRingDots',
   CaloriesAdd = 'CaloriesAdd',
   BranchFork = 'BranchFork',
+  MobileReport = 'MobileReport',
   HardDriveGroup = 'HardDriveGroup',
+  FastMode = 'FastMode',
+  ToggleOff = 'ToggleOff',
+  Trophy2 = 'Trophy2',
   BucketColor = 'BucketColor',
   BucketColorFill = 'BucketColorFill',
   Taskboard = 'Taskboard',
@@ -834,6 +885,8 @@ export const enum IconNames {
   LinkedInLogo = 'LinkedInLogo',
   SidePanelMirrored = 'SidePanelMirrored',
   ProtectRestrict = 'ProtectRestrict',
+  UnknownMirrored = 'UnknownMirrored',
+  PublicContactCardMirrored = 'PublicContactCardMirrored',
   GridViewSmall = 'GridViewSmall',
   GridViewMedium = 'GridViewMedium',
   GridViewLarge = 'GridViewLarge',
@@ -854,9 +907,13 @@ export const enum IconNames {
   BuildQueue = 'BuildQueue',
   BuildQueueNew = 'BuildQueueNew',
   UserFollowed = 'UserFollowed',
+  ContactLink = 'ContactLink',
+  Stack = 'Stack',
+  Bullseye = 'Bullseye',
   VennDiagram = 'VennDiagram',
   FiveTileGrid = 'FiveTileGrid',
   FocalPoint = 'FocalPoint',
+  RingerRemove = 'RingerRemove',
   TeamsLogoInverse = 'TeamsLogoInverse',
   TeamsLogo = 'TeamsLogo',
   TeamsLogoFill = 'TeamsLogoFill',
@@ -890,35 +947,6 @@ export const enum IconNames {
   Deploy = 'Deploy',
   Redeploy = 'Redeploy',
   ServerEnviroment = 'ServerEnviroment',
-  Plug = 'Plug',
-  PlugSolid = 'PlugSolid',
-  PlugConnected = 'PlugConnected',
-  PlugDisconnected = 'PlugDisconnected',
-  UnlockSolid = 'UnlockSolid',
-  Variable = 'Variable',
-  Parameter = 'Parameter',
-  CommentUrgent = 'CommentUrgent',
-  Storyboard = 'Storyboard',
-  DiffInline = 'DiffInline',
-  DiffSideBySide = 'DiffSideBySide',
-  ImageDiff = 'ImageDiff',
-  ImagePixel = 'ImagePixel',
-  FileBug = 'FileBug',
-  FileCode = 'FileCode',
-  FileComment = 'FileComment',
-  FileImage = 'FileImage',
-  FileSymlink = 'FileSymlink',
-  AutoFillTemplate = 'AutoFillTemplate',
-  WorkItem = 'WorkItem',
-  WorkItemBug = 'WorkItemBug',
-  LogRemove = 'LogRemove',
-  ColumnOptions = 'ColumnOptions',
-  Packages = 'Packages',
-  BuildIssue = 'BuildIssue',
-  AssessmentGroup = 'AssessmentGroup',
-  VariableGroup = 'VariableGroup',
-  FullHistory = 'FullHistory',
-  BusinessHoursSign = 'BusinessHoursSign',
   VisioDiagram = 'VisioDiagram',
   HighlightMappedShapes = 'HighlightMappedShapes',
   TextCallout = 'TextCallout',
@@ -1010,6 +1038,35 @@ export const enum IconNames {
   MarkDownLanguage = 'MarkDownLanguage',
   FullWidth = 'FullWidth',
   FullWidthEdit = 'FullWidthEdit',
+  Plug = 'Plug',
+  PlugSolid = 'PlugSolid',
+  PlugConnected = 'PlugConnected',
+  PlugDisconnected = 'PlugDisconnected',
+  UnlockSolid = 'UnlockSolid',
+  Variable = 'Variable',
+  Parameter = 'Parameter',
+  CommentUrgent = 'CommentUrgent',
+  Storyboard = 'Storyboard',
+  DiffInline = 'DiffInline',
+  DiffSideBySide = 'DiffSideBySide',
+  ImageDiff = 'ImageDiff',
+  ImagePixel = 'ImagePixel',
+  FileBug = 'FileBug',
+  FileCode = 'FileCode',
+  FileComment = 'FileComment',
+  BusinessHoursSign = 'BusinessHoursSign',
+  FileImage = 'FileImage',
+  FileSymlink = 'FileSymlink',
+  AutoFillTemplate = 'AutoFillTemplate',
+  WorkItem = 'WorkItem',
+  WorkItemBug = 'WorkItemBug',
+  LogRemove = 'LogRemove',
+  ColumnOptions = 'ColumnOptions',
+  Packages = 'Packages',
+  BuildIssue = 'BuildIssue',
+  AssessmentGroup = 'AssessmentGroup',
+  VariableGroup = 'VariableGroup',
+  FullHistory = 'FullHistory',
   SingleColumnEdit = 'SingleColumnEdit',
   DoubleColumnEdit = 'DoubleColumnEdit',
   TripleColumnEdit = 'TripleColumnEdit',
@@ -1082,6 +1139,7 @@ export const enum IconNames {
   ChevronUpEnd6 = 'ChevronUpEnd6',
   ChevronLeftEnd6 = 'ChevronLeftEnd6',
   ChevronRightEnd6 = 'ChevronRightEnd6',
+  ContextMenu = 'ContextMenu',
   AzureAPIManagement = 'AzureAPIManagement',
   AzureServiceEndpoint = 'AzureServiceEndpoint',
   VSTSLogo = 'VSTSLogo',
@@ -1125,9 +1183,11 @@ export const enum IconNames {
   TriggerApproval = 'TriggerApproval',
   Rocket = 'Rocket',
   AzureKeyVault = 'AzureKeyVault',
+  Transition = 'Transition',
   LikeSolid = 'LikeSolid',
   DislikeSolid = 'DislikeSolid',
   DeclineCall = 'DeclineCall',
+  RectangularClipping = 'RectangularClipping',
   Spacer = 'Spacer',
   SkypeLogo16 = 'SkypeLogo16',
   SkypeForBusinessLogo16 = 'SkypeForBusinessLogo16',
@@ -1151,6 +1211,7 @@ export const enum IconNames {
   EventTentativeMirrored = 'EventTentativeMirrored',
   EventDeclined = 'EventDeclined',
   IDBadge = 'IDBadge',
+  BackgroundColor = 'BackgroundColor',
   OfficeFormsLogoInverse16 = 'OfficeFormsLogoInverse16',
   OfficeFormsLogo = 'OfficeFormsLogo',
   OfficeFormsLogoFill = 'OfficeFormsLogoFill',
@@ -1225,5 +1286,159 @@ export const enum IconNames {
   AdminALogo32 = 'AdminALogo32',
   AdminALogoFill32 = 'AdminALogoFill32',
   ToDoLogoInverse = 'ToDoLogoInverse',
-  Snooze = 'Snooze'
+  Snooze = 'Snooze',
+  WaffleOffice365 = 'WaffleOffice365',
+  ImageSearch = 'ImageSearch',
+  NewsSearch = 'NewsSearch',
+  VideoSearch = 'VideoSearch',
+  R = 'R',
+  FontColorA = 'FontColorA',
+  FontColorSwatch = 'FontColorSwatch',
+  LightWeight = 'LightWeight',
+  NormalWeight = 'NormalWeight',
+  SemiboldWeight = 'SemiboldWeight',
+  GroupObject = 'GroupObject',
+  UngroupObject = 'UngroupObject',
+  AlignHorizontalLeft = 'AlignHorizontalLeft',
+  AlignHorizontalCenter = 'AlignHorizontalCenter',
+  AlignHorizontalRight = 'AlignHorizontalRight',
+  AlignVerticalTop = 'AlignVerticalTop',
+  AlignVerticalCenter = 'AlignVerticalCenter',
+  AlignVerticalBottom = 'AlignVerticalBottom',
+  HorizontalDistributeCenter = 'HorizontalDistributeCenter',
+  VerticalDistributeCenter = 'VerticalDistributeCenter',
+  Ellipse = 'Ellipse',
+  Line = 'Line',
+  Octagon = 'Octagon',
+  Hexagon = 'Hexagon',
+  Pentagon = 'Pentagon',
+  RightTriangle = 'RightTriangle',
+  HalfCircle = 'HalfCircle',
+  QuarterCircle = 'QuarterCircle',
+  ThreeQuarterCircle = 'ThreeQuarterCircle',
+  SixPointStar = '6PointStar',
+  TwelvePointStar = '12PointStar',
+  ArrangeBringToFront = 'ArrangeBringToFront',
+  ArrangeSendToBack = 'ArrangeSendToBack',
+  ArrangeSendBackward = 'ArrangeSendBackward',
+  ArrangeBringForward = 'ArrangeBringForward',
+  BorderDash = 'BorderDash',
+  BorderDot = 'BorderDot',
+  LineStyle = 'LineStyle',
+  LineThickness = 'LineThickness',
+  WindowEdit = 'WindowEdit',
+  HintText = 'HintText',
+  MediaAdd = 'MediaAdd',
+  AnchorLock = 'AnchorLock',
+  AutoHeight = 'AutoHeight',
+  ChartSeries = 'ChartSeries',
+  ChartXAngle = 'ChartXAngle',
+  ChartYAngle = 'ChartYAngle',
+  Combobox = 'Combobox',
+  LineSpacing = 'LineSpacing',
+  Padding = 'Padding',
+  PaddingTop = 'PaddingTop',
+  PaddingBottom = 'PaddingBottom',
+  PaddingLeft = 'PaddingLeft',
+  PaddingRight = 'PaddingRight',
+  NavigationFlipper = 'NavigationFlipper',
+  AlignJustify = 'AlignJustify',
+  TextOverflow = 'TextOverflow',
+  VisualsFolder = 'VisualsFolder',
+  VisualsStore = 'VisualsStore',
+  PictureCenter = 'PictureCenter',
+  PictureFill = 'PictureFill',
+  PicturePosition = 'PicturePosition',
+  PictureStretch = 'PictureStretch',
+  PictureTile = 'PictureTile',
+  Slider = 'Slider',
+  SliderHandleSize = 'SliderHandleSize',
+  DefaultRatio = 'DefaultRatio',
+  NumberSequence = 'NumberSequence',
+  GUID = 'GUID',
+  ReportAdd = 'ReportAdd',
+  DashboardAdd = 'DashboardAdd',
+  MapPinSolid = 'MapPinSolid',
+  WebPublish = 'WebPublish',
+  PieSingleSolid = 'PieSingleSolid',
+  BlockedSolid = 'BlockedSolid',
+  DrillDown = 'DrillDown',
+  DrillDownSolid = 'DrillDownSolid',
+  DrillExpand = 'DrillExpand',
+  DrillShow = 'DrillShow',
+  OneDriveFolder16 = 'OneDriveFolder16',
+  ChronosLogo = 'ChronosLogo',
+  FunctionalManagerDashboard = 'FunctionalManagerDashboard',
+  BIDashboard = 'BIDashboard',
+  CodeEdit = 'CodeEdit',
+  RenewalCurrent = 'RenewalCurrent',
+  RenewalFuture = 'RenewalFuture',
+  SplitObject = 'SplitObject',
+  BulkUpload = 'BulkUpload',
+  DownloadDocument = 'DownloadDocument',
+  WaitlistConfirm = 'WaitlistConfirm',
+  WaitlistConfirmMirrored = 'WaitlistConfirmMirrored',
+  LaptopSecure = 'LaptopSecure',
+  DragObject = 'DragObject',
+  EntryView = 'EntryView',
+  EntryDecline = 'EntryDecline',
+  ContactCardSettings = 'ContactCardSettings',
+  ContactCardSettingsMirrored = 'ContactCardSettingsMirrored',
+  CalendarSettings = 'CalendarSettings',
+  CalendarSettingsMirrored = 'CalendarSettingsMirrored',
+  HardDriveLock = 'HardDriveLock',
+  HardDriveUnlock = 'HardDriveUnlock',
+  AccountManagement = 'AccountManagement',
+  TransitionPop = 'TransitionPop',
+  TransitionPush = 'TransitionPush',
+  TransitionEffect = 'TransitionEffect',
+  LookupEntities = 'LookupEntities',
+  ExploreData = 'ExploreData',
+  AddBookmark = 'AddBookmark',
+  SearchBookmark = 'SearchBookmark',
+  DrillThrough = 'DrillThrough',
+  MasterDatabase = 'MasterDatabase',
+  CertifiedDatabase = 'CertifiedDatabase',
+  MaximumValue = 'MaximumValue',
+  MinimumValue = 'MinimumValue',
+  VisualStudioIDELogo32 = 'VisualStudioIDELogo32',
+  PasteAsText = 'PasteAsText',
+  PasteAsCode = 'PasteAsCode',
+  BrowserTab = 'BrowserTab',
+  BrowserTabScreenshot = 'BrowserTabScreenshot',
+  DesktopScreenshot = 'DesktopScreenshot',
+  FileYML = 'FileYML',
+  ClipboardSolid = 'ClipboardSolid',
+  AnalyticsView = 'AnalyticsView',
+  Leave = 'Leave',
+  Trending12 = 'Trending12',
+  Blocked12 = 'Blocked12',
+  Warning12 = 'Warning12',
+  CheckedOutByOther12 = 'CheckedOutByOther12',
+  CheckedOutByYou12 = 'CheckedOutByYou12',
+  CircleShapeSolid = 'CircleShapeSolid',
+  SquareShapeSolid = 'SquareShapeSolid',
+  TriangleShapeSolid = 'TriangleShapeSolid',
+  DropShapeSolid = 'DropShapeSolid',
+  InsertColumnsLeft = 'InsertColumnsLeft',
+  InsertColumnsRight = 'InsertColumnsRight',
+  InsertRowsAbove = 'InsertRowsAbove',
+  InsertRowsBelow = 'InsertRowsBelow',
+  DeleteColumns = 'DeleteColumns',
+  DeleteRows = 'DeleteRows',
+  DeleteRowsMirrored = 'DeleteRowsMirrored',
+  DeleteTable = 'DeleteTable',
+  GitLogo = 'GitLogo',
+  GitHubLogo = 'GitHubLogo',
+  ApacheMavenLogo = 'ApacheMavenLogo',
+  NPMLogo = 'NPMLogo',
+  GitFork = 'GitFork',
+  SVNLogo = 'SVNLogo',
+  JenkinsLogo = 'JenkinsLogo',
+  VersionControlPush = 'VersionControlPush',
+  ExternalGit = 'ExternalGit',
+  InsertSignatureLine = 'InsertSignatureLine',
+  ArrangeByFrom = 'ArrangeByFrom',
+  Phishing = 'Phishing',
+  CreateMailRule = 'CreateMailRule'
 }
diff --git a/packages/icons/src/fabric-icons-0.ts b/packages/icons/src/fabric-icons-0.ts
index 2cc3634fbd374..fb8f3cbf228fd 100644
--- a/packages/icons/src/fabric-icons-0.ts
+++ b/packages/icons/src/fabric-icons-0.ts
@@ -1,3 +1,5 @@
+  // Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+
 // tslint:disable:max-line-length
 
 import {
@@ -20,11 +22,12 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-0"`,
-      src: `url('${baseUrl}fabric-icons-0-8a1666a2.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-0-2e092c7d.woff') format('woff')`,
     },
     icons: {
       'DecreaseIndentLegacy': '\uE290',
       'IncreaseIndentLegacy': '\uE291',
+      'SizeLegacy': '\uE2B2',
       'InternetSharing': '\uE704',
       'Brightness': '\uE706',
       'MapPin': '\uE707',
@@ -50,6 +53,8 @@ export function initializeIcons(
       'Back': '\uE72B',
       'Refresh': '\uE72C',
       'Lock': '\uE72E',
+      'BlockedSite': '\uE72F',
+      'ReportHacked': '\uE730',
       'EMI': '\uE731',
       'MiniLink': '\uE732',
       'Blocked': '\uE733',
@@ -65,6 +70,7 @@ export function initializeIcons(
       'Print': '\uE749',
       'Up': '\uE74A',
       'Down': '\uE74B',
+      'OEM': '\uE74C',
       'Save': '\uE74E',
       'Cloud': '\uE753',
       'CommandPrompt': '\uE756',
@@ -93,7 +99,6 @@ export function initializeIcons(
       'Error': '\uE783',
       'GripperBarVertical': '\uE784',
       'Unlock': '\uE785',
-      'Megaphone': '\uE789',
       'AutoEnhanceOn': '\uE78D',
       'AutoEnhanceOff': '\uE78E',
       'Color': '\uE790',
@@ -103,6 +108,7 @@ export function initializeIcons(
       'AspectRatio': '\uE799',
       'Contrast': '\uE7A1',
       'Redo': '\uE7A6',
+      'Crop': '\uE7A8',
       'PhotoCollection': '\uE7AA',
       'Album': '\uE7AB',
       'Rotate': '\uE7AD',
@@ -118,11 +124,7 @@ export function initializeIcons(
       'Move': '\uE7C2',
       'TouchPointer': '\uE7C9',
       'Merge': '\uE7D5',
-      'TurnRight': '\uE7DB',
-      'Ferry': '\uE7E3',
-      'Highlight': '\uE7E6',
-      'Tab': '\uE7E9',
-      'Admin': '\uE7EF'
+      'TurnRight': '\uE7DB'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons-1.ts b/packages/icons/src/fabric-icons-1.ts
index 165003f2f22b7..bfdc1140b9692 100644
--- a/packages/icons/src/fabric-icons-1.ts
+++ b/packages/icons/src/fabric-icons-1.ts
@@ -1,3 +1,5 @@
+  // Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+
 // tslint:disable:max-line-length
 
 import {
@@ -20,11 +22,16 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-1"`,
-      src: `url('${baseUrl}fabric-icons-1-a961c249.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-1-a86438ef.woff') format('woff')`,
     },
     icons: {
+      'Ferry': '\uE7E3',
+      'Highlight': '\uE7E6',
+      'Tab': '\uE7E9',
+      'Admin': '\uE7EF',
       'TVMonitor': '\uE7F4',
       'Speakers': '\uE7F5',
+      'StackIndicator': '\uE7FF',
       'Nav2DMapView': '\uE800',
       'Car': '\uE804',
       'Bus': '\uE806',
@@ -36,15 +43,19 @@ export function initializeIcons(
       'IncidentTriangle': '\uE814',
       'Touch': '\uE815',
       'MapDirections': '\uE816',
+      'CaretHollow': '\uE817',
+      'CaretSolid': '\uE818',
       'History': '\uE81C',
       'Location': '\uE81D',
       'Work': '\uE821',
       'Recent': '\uE823',
       'Hotel': '\uE824',
       'LocationDot': '\uE827',
-      'News': '\uE900',
-      'Chat': '\uE901',
-      'Group': '\uE902',
+      'Dictionary': '\uE82D',
+      'ChromeBack': '\uE830',
+      'FolderOpen': '\uE838',
+      'PinnedFill': '\uE842',
+      'RevToggleKey': '\uE845',
       'Previous': '\uE892',
       'Next': '\uE893',
       'Sync': '\uE895',
@@ -63,8 +74,12 @@ export function initializeIcons(
       'ViewAll': '\uE8A9',
       'Switch': '\uE8AB',
       'Rename': '\uE8AC',
+      'Remote': '\uE8AF',
+      'SelectAll': '\uE8B3',
+      'Orientation': '\uE8B4',
       'Import': '\uE8B5',
       'Picture': '\uE8B9',
+      'ChromeClose': '\uE8BB',
       'ShowResults': '\uE8BC',
       'Message': '\uE8BD',
       'CalendarDay': '\uE8BF',
@@ -95,6 +110,7 @@ export function initializeIcons(
       'FontIncrease': '\uE8E8',
       'FontSize': '\uE8E9',
       'CellPhone': '\uE8EA',
+      'Calculator': '\uE8EF',
       'Library': '\uE8F1',
       'PostUpdate': '\uE8F3',
       'NewFolder': '\uE8F4',
@@ -102,27 +118,13 @@ export function initializeIcons(
       'UnsyncFolder': '\uE8F6',
       'SyncFolder': '\uE8F7',
       'BlockContact': '\uE8F8',
+      'Accept': '\uE8FB',
       'BulletedList': '\uE8FD',
       'Preview': '\uE8FF',
-      'World': '\uE909',
-      'Comment': '\uE90A',
-      'DockLeft': '\uE90C',
-      'DockRight': '\uE90D',
-      'Repair': '\uE90F',
-      'Accounts': '\uE910',
-      'RadioBullet': '\uE915',
-      'Stopwatch': '\uE916',
-      'Clock': '\uE917',
-      'WorldClock': '\uE918',
-      'AlarmClock': '\uE919',
-      'Hospital': '\uE91D',
-      'Timer': '\uE91E',
-      'FullCircleMask': '\uE91F',
-      'LocationFill': '\uE920',
-      'ChromeMinimize': '\uE921',
-      'Annotation': '\uE924',
-      'ChromeClose': '\uE8BB',
-      'Accept': '\uE8FB'
+      'News': '\uE900',
+      'Chat': '\uE901',
+      'Group': '\uE902',
+      'World': '\uE909'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons-10.ts b/packages/icons/src/fabric-icons-10.ts
index 8c93d97a59894..d8d8a94390439 100644
--- a/packages/icons/src/fabric-icons-10.ts
+++ b/packages/icons/src/fabric-icons-10.ts
@@ -1,3 +1,5 @@
+// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+
 // tslint:disable:max-line-length
 
 import {
@@ -10,7 +12,7 @@ export function initializeIcons(
   baseUrl: string = '',
   options?: IIconOptions
 ): void {
-  const iconSubset: IIconSubset = {
+  const subset: IIconSubset = {
     style: {
       MozOsxFontSmoothing: 'grayscale',
       WebkitFontSmoothing: 'antialiased',
@@ -20,9 +22,65 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-10"`,
-      src: `url('${baseUrl}fabric-icons-10-a9486bb8.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-10-90d2dc10.woff') format('woff')`,
     },
     icons: {
+      'DiffInline': '\uF309',
+      'DiffSideBySide': '\uF30A',
+      'ImageDiff': '\uF30B',
+      'ImagePixel': '\uF30C',
+      'FileBug': '\uF30D',
+      'FileCode': '\uF30E',
+      'FileComment': '\uF30F',
+      'BusinessHoursSign': '\uF310',
+      'FileImage': '\uF311',
+      'FileSymlink': '\uF312',
+      'AutoFillTemplate': '\uF313',
+      'WorkItem': '\uF314',
+      'WorkItemBug': '\uF315',
+      'LogRemove': '\uF316',
+      'ColumnOptions': '\uF317',
+      'Packages': '\uF318',
+      'BuildIssue': '\uF319',
+      'AssessmentGroup': '\uF31A',
+      'VariableGroup': '\uF31B',
+      'FullHistory': '\uF31C',
+      'SingleColumnEdit': '\uF321',
+      'DoubleColumnEdit': '\uF322',
+      'TripleColumnEdit': '\uF323',
+      'ColumnLeftTwoThirdsEdit': '\uF324',
+      'ColumnRightTwoThirdsEdit': '\uF325',
+      'StreamLogo': '\uF329',
+      'AlertSolid': '\uF331',
+      'MegaphoneSolid': '\uF332',
+      'TaskSolid': '\uF333',
+      'ConfigurationSolid': '\uF334',
+      'BugSolid': '\uF335',
+      'CrownSolid': '\uF336',
+      'Trophy2Solid': '\uF337',
+      'QuickNoteSolid': '\uF338',
+      'ConstructionConeSolid': '\uF339',
+      'PageListSolid': '\uF33A',
+      'PageListMirroredSolid': '\uF33B',
+      'StarburstSolid': '\uF33C',
+      'ReadingModeSolid': '\uF33D',
+      'SadSolid': '\uF33E',
+      'HealthSolid': '\uF33F',
+      'ShieldSolid': '\uF340',
+      'GiftBoxSolid': '\uF341',
+      'ShoppingCartSolid': '\uF342',
+      'MailSolid': '\uF343',
+      'ChatSolid': '\uF344',
+      'RibbonSolid': '\uF345',
+      'FinancialSolid': '\uF346',
+      'FinancialMirroredSolid': '\uF347',
+      'HeadsetSolid': '\uF348',
+      'PermissionsSolid': '\uF349',
+      'ParkingSolid': '\uF34A',
+      'ParkingMirroredSolid': '\uF34B',
+      'DiamondSolid': '\uF34C',
+      'AsteriskSolid': '\uF34D',
+      'OfflineStorageSolid': '\uF34E',
       'BankSolid': '\uF34F',
       'DecisionSolid': '\uF350',
       'Parachute': '\uF351',
@@ -59,68 +117,12 @@ export function initializeIcons(
       'ChevronUpEnd6': '\uF370',
       'ChevronLeftEnd6': '\uF371',
       'ChevronRightEnd6': '\uF372',
+      'ContextMenu': '\uF37C',
       'AzureAPIManagement': '\uF37F',
       'AzureServiceEndpoint': '\uF380',
-      'VSTSLogo': '\uF381',
-      'VSTSAltLogo1': '\uF382',
-      'VSTSAltLogo2': '\uF383',
-      'FileTypeSolution': '\uF387',
-      'WordLogoInverse16': '\uF390',
-      'WordLogo16': '\uF391',
-      'WordLogoFill16': '\uF392',
-      'PowerPointLogoInverse16': '\uF393',
-      'PowerPointLogo16': '\uF394',
-      'PowerPointLogoFill16': '\uF395',
-      'ExcelLogoInverse16': '\uF396',
-      'ExcelLogo16': '\uF397',
-      'ExcelLogoFill16': '\uF398',
-      'OneNoteLogoInverse16': '\uF399',
-      'OneNoteLogo16': '\uF39A',
-      'OneNoteLogoFill16': '\uF39B',
-      'OutlookLogoInverse16': '\uF39C',
-      'OutlookLogo16': '\uF39D',
-      'OutlookLogoFill16': '\uF39E',
-      'PublisherLogoInverse16': '\uF39F',
-      'PublisherLogo16': '\uF3A0',
-      'PublisherLogoFill16': '\uF3A1',
-      'VisioLogoInverse16': '\uF3A2',
-      'VisioLogo16': '\uF3A3',
-      'VisioLogoFill16': '\uF3A4',
-      'TestBeaker': '\uF3A5',
-      'TestBeakerSolid': '\uF3A6',
-      'TestExploreSolid': '\uF3A7',
-      'TestAutoSolid': '\uF3A8',
-      'TestUserSolid': '\uF3A9',
-      'TestImpactSolid': '\uF3AA',
-      'TestPlan': '\uF3AB',
-      'TestStep': '\uF3AC',
-      'TestParameter': '\uF3AD',
-      'TestSuite': '\uF3AE',
-      'TestCase': '\uF3AF',
-      'Sprint': '\uF3B0',
-      'SignOut': '\uF3B1',
-      'TriggerApproval': '\uF3B2',
-      'Rocket': '\uF3B3',
-      'AzureKeyVault': '\uF3B4',
-      'LikeSolid': '\uF3BF',
-      'DislikeSolid': '\uF3C0',
-      'DeclineCall': '\uF405',
-      'Spacer': '\uF40D',
-      'SkypeLogo16': '\uF40E',
-      'SkypeForBusinessLogo16': '\uF40F',
-      'SkypeForBusinessLogoFill16': '\uF410',
-      'FilterSolid': '\uF412',
-      'MailUndelivered': '\uF415',
-      'MailTentative': '\uF416',
-      'MailTentativeMirrored': '\uF417',
-      'MailReminder': '\uF418',
-      'ReceiptUndelivered': '\uF419',
-      'ReceiptTentative': '\uF41A',
-      'ReceiptTentativeMirrored': '\uF41B',
-      'Inbox': '\uF41C',
-      'IRMReply': '\uF41D'
+      'VSTSLogo': '\uF381'
     }
   };
 
-  registerIcons(iconSubset, options);
+  registerIcons(subset, options);
 }
diff --git a/packages/icons/src/fabric-icons-11.ts b/packages/icons/src/fabric-icons-11.ts
index fe66a01899911..dbb06f2a9f6a4 100644
--- a/packages/icons/src/fabric-icons-11.ts
+++ b/packages/icons/src/fabric-icons-11.ts
@@ -1,3 +1,5 @@
+  // Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+
 // tslint:disable:max-line-length
 
 import {
@@ -20,9 +22,68 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-11"`,
-      src: `url('${baseUrl}fabric-icons-11-c0dbf638.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-11-18d2ffa4.woff') format('woff')`,
     },
     icons: {
+      'VSTSAltLogo1': '\uF382',
+      'VSTSAltLogo2': '\uF383',
+      'FileTypeSolution': '\uF387',
+      'WordLogoInverse16': '\uF390',
+      'WordLogo16': '\uF391',
+      'WordLogoFill16': '\uF392',
+      'PowerPointLogoInverse16': '\uF393',
+      'PowerPointLogo16': '\uF394',
+      'PowerPointLogoFill16': '\uF395',
+      'ExcelLogoInverse16': '\uF396',
+      'ExcelLogo16': '\uF397',
+      'ExcelLogoFill16': '\uF398',
+      'OneNoteLogoInverse16': '\uF399',
+      'OneNoteLogo16': '\uF39A',
+      'OneNoteLogoFill16': '\uF39B',
+      'OutlookLogoInverse16': '\uF39C',
+      'OutlookLogo16': '\uF39D',
+      'OutlookLogoFill16': '\uF39E',
+      'PublisherLogoInverse16': '\uF39F',
+      'PublisherLogo16': '\uF3A0',
+      'PublisherLogoFill16': '\uF3A1',
+      'VisioLogoInverse16': '\uF3A2',
+      'VisioLogo16': '\uF3A3',
+      'VisioLogoFill16': '\uF3A4',
+      'TestBeaker': '\uF3A5',
+      'TestBeakerSolid': '\uF3A6',
+      'TestExploreSolid': '\uF3A7',
+      'TestAutoSolid': '\uF3A8',
+      'TestUserSolid': '\uF3A9',
+      'TestImpactSolid': '\uF3AA',
+      'TestPlan': '\uF3AB',
+      'TestStep': '\uF3AC',
+      'TestParameter': '\uF3AD',
+      'TestSuite': '\uF3AE',
+      'TestCase': '\uF3AF',
+      'Sprint': '\uF3B0',
+      'SignOut': '\uF3B1',
+      'TriggerApproval': '\uF3B2',
+      'Rocket': '\uF3B3',
+      'AzureKeyVault': '\uF3B4',
+      'Transition': '\uF3BC',
+      'LikeSolid': '\uF3BF',
+      'DislikeSolid': '\uF3C0',
+      'DeclineCall': '\uF405',
+      'RectangularClipping': '\uF407',
+      'Spacer': '\uF40D',
+      'SkypeLogo16': '\uF40E',
+      'SkypeForBusinessLogo16': '\uF40F',
+      'SkypeForBusinessLogoFill16': '\uF410',
+      'FilterSolid': '\uF412',
+      'MailUndelivered': '\uF415',
+      'MailTentative': '\uF416',
+      'MailTentativeMirrored': '\uF417',
+      'MailReminder': '\uF418',
+      'ReceiptUndelivered': '\uF419',
+      'ReceiptTentative': '\uF41A',
+      'ReceiptTentativeMirrored': '\uF41B',
+      'Inbox': '\uF41C',
+      'IRMReply': '\uF41D',
       'IRMReplyMirrored': '\uF41E',
       'IRMForward': '\uF41F',
       'IRMForwardMirrored': '\uF420',
@@ -32,6 +93,7 @@ export function initializeIcons(
       'EventTentativeMirrored': '\uF424',
       'EventDeclined': '\uF425',
       'IDBadge': '\uF427',
+      'BackgroundColor': '\uF42B',
       'OfficeFormsLogoInverse16': '\uF433',
       'OfficeFormsLogo': '\uF434',
       'OfficeFormsLogoFill': '\uF435',
@@ -62,51 +124,7 @@ export function initializeIcons(
       'SwayLogo32': '\uF482',
       'SwayLogoFill32': '\uF483',
       'SwayLogo16': '\uF484',
-      'SwayLogoFill16': '\uF485',
-      'ClassNotebookLogo32': '\uF486',
-      'ClassNotebookLogoFill32': '\uF487',
-      'ClassNotebookLogo16': '\uF488',
-      'ClassNotebookLogoFill16': '\uF489',
-      'ClassNotebookLogoInverse32': '\uF48A',
-      'ClassNotebookLogoInverse16': '\uF48B',
-      'StaffNotebookLogo32': '\uF48C',
-      'StaffNotebookLogoFill32': '\uF48D',
-      'StaffNotebookLogo16': '\uF48E',
-      'StaffNotebookLogoFill16': '\uF48F',
-      'StaffNotebookLogoInverted32': '\uF490',
-      'StaffNotebookLogoInverted16': '\uF491',
-      'KaizalaLogo': '\uF492',
-      'TaskLogo': '\uF493',
-      'ProtectionCenterLogo32': '\uF494',
-      'NonprofitLogo32': '\uF495',
-      'GallatinLogo': '\uF496',
-      'Globe2': '\uF49A',
-      'Guitar': '\uF49B',
-      'Breakfast': '\uF49C',
-      'Brunch': '\uF49D',
-      'BeerMug': '\uF49E',
-      'Vacation': '\uF49F',
-      'Teeth': '\uF4A0',
-      'Taxi': '\uF4A1',
-      'Chopsticks': '\uF4A2',
-      'SyncOccurence': '\uF4A3',
-      'UnsyncOccurence': '\uF4A4',
-      'PrimaryCalendar': '\uF4AE',
-      'SearchCalendar': '\uF4AF',
-      'VideoOff': '\uF4B0',
-      'MicrosoftFlowLogo': '\uF4B1',
-      'BusinessCenterLogo': '\uF4B2',
-      'ToDoLogoBottom': '\uF4B3',
-      'ToDoLogoTop': '\uF4B4',
-      'EditSolid12': '\uF4B5',
-      'EditSolidMirrored12': '\uF4B6',
-      'UneditableSolid12': '\uF4B7',
-      'UneditableSolidMirrored12': '\uF4B8',
-      'UneditableMirrored': '\uF4B9',
-      'AdminALogo32': '\uF4BA',
-      'AdminALogoFill32': '\uF4BB',
-      'ToDoLogoInverse': '\uF4BC',
-      'Snooze': '\uF4BD'
+      'SwayLogoFill16': '\uF485'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons-12.ts b/packages/icons/src/fabric-icons-12.ts
new file mode 100644
index 0000000000000..df412bbe53c58
--- /dev/null
+++ b/packages/icons/src/fabric-icons-12.ts
@@ -0,0 +1,132 @@
+  // Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+
+// tslint:disable:max-line-length
+
+import {
+  IIconOptions,
+  IIconSubset,
+  registerIcons
+} from '@uifabric/styling/lib/index';
+
+export function initializeIcons(
+  baseUrl: string = '',
+  options?: IIconOptions
+): void {
+  const subset: IIconSubset = {
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-12"`,
+      src: `url('${baseUrl}fabric-icons-12-6c96597e.woff') format('woff')`,
+    },
+    icons: {
+      'ClassNotebookLogo32': '\uF486',
+      'ClassNotebookLogoFill32': '\uF487',
+      'ClassNotebookLogo16': '\uF488',
+      'ClassNotebookLogoFill16': '\uF489',
+      'ClassNotebookLogoInverse32': '\uF48A',
+      'ClassNotebookLogoInverse16': '\uF48B',
+      'StaffNotebookLogo32': '\uF48C',
+      'StaffNotebookLogoFill32': '\uF48D',
+      'StaffNotebookLogo16': '\uF48E',
+      'StaffNotebookLogoFill16': '\uF48F',
+      'StaffNotebookLogoInverted32': '\uF490',
+      'StaffNotebookLogoInverted16': '\uF491',
+      'KaizalaLogo': '\uF492',
+      'TaskLogo': '\uF493',
+      'ProtectionCenterLogo32': '\uF494',
+      'NonprofitLogo32': '\uF495',
+      'GallatinLogo': '\uF496',
+      'Globe2': '\uF49A',
+      'Guitar': '\uF49B',
+      'Breakfast': '\uF49C',
+      'Brunch': '\uF49D',
+      'BeerMug': '\uF49E',
+      'Vacation': '\uF49F',
+      'Teeth': '\uF4A0',
+      'Taxi': '\uF4A1',
+      'Chopsticks': '\uF4A2',
+      'SyncOccurence': '\uF4A3',
+      'UnsyncOccurence': '\uF4A4',
+      'PrimaryCalendar': '\uF4AE',
+      'SearchCalendar': '\uF4AF',
+      'VideoOff': '\uF4B0',
+      'MicrosoftFlowLogo': '\uF4B1',
+      'BusinessCenterLogo': '\uF4B2',
+      'ToDoLogoBottom': '\uF4B3',
+      'ToDoLogoTop': '\uF4B4',
+      'EditSolid12': '\uF4B5',
+      'EditSolidMirrored12': '\uF4B6',
+      'UneditableSolid12': '\uF4B7',
+      'UneditableSolidMirrored12': '\uF4B8',
+      'UneditableMirrored': '\uF4B9',
+      'AdminALogo32': '\uF4BA',
+      'AdminALogoFill32': '\uF4BB',
+      'ToDoLogoInverse': '\uF4BC',
+      'Snooze': '\uF4BD',
+      'WaffleOffice365': '\uF4E0',
+      'ImageSearch': '\uF4E8',
+      'NewsSearch': '\uF4E9',
+      'VideoSearch': '\uF4EA',
+      'R': '\uF4EB',
+      'FontColorA': '\uF4EC',
+      'FontColorSwatch': '\uF4ED',
+      'LightWeight': '\uF4EE',
+      'NormalWeight': '\uF4EF',
+      'SemiboldWeight': '\uF4F0',
+      'GroupObject': '\uF4F1',
+      'UngroupObject': '\uF4F2',
+      'AlignHorizontalLeft': '\uF4F3',
+      'AlignHorizontalCenter': '\uF4F4',
+      'AlignHorizontalRight': '\uF4F5',
+      'AlignVerticalTop': '\uF4F6',
+      'AlignVerticalCenter': '\uF4F7',
+      'AlignVerticalBottom': '\uF4F8',
+      'HorizontalDistributeCenter': '\uF4F9',
+      'VerticalDistributeCenter': '\uF4FA',
+      'Ellipse': '\uF4FB',
+      'Line': '\uF4FC',
+      'Octagon': '\uF4FD',
+      'Hexagon': '\uF4FE',
+      'Pentagon': '\uF4FF',
+      'RightTriangle': '\uF500',
+      'HalfCircle': '\uF501',
+      'QuarterCircle': '\uF502',
+      'ThreeQuarterCircle': '\uF503',
+      '6PointStar': '\uF504',
+      '12PointStar': '\uF505',
+      'ArrangeBringToFront': '\uF506',
+      'ArrangeSendToBack': '\uF507',
+      'ArrangeSendBackward': '\uF508',
+      'ArrangeBringForward': '\uF509',
+      'BorderDash': '\uF50A',
+      'BorderDot': '\uF50B',
+      'LineStyle': '\uF50C',
+      'LineThickness': '\uF50D',
+      'WindowEdit': '\uF50E',
+      'HintText': '\uF50F',
+      'MediaAdd': '\uF510',
+      'AnchorLock': '\uF511',
+      'AutoHeight': '\uF512',
+      'ChartSeries': '\uF513',
+      'ChartXAngle': '\uF514',
+      'ChartYAngle': '\uF515',
+      'Combobox': '\uF516',
+      'LineSpacing': '\uF517',
+      'Padding': '\uF518',
+      'PaddingTop': '\uF519',
+      'PaddingBottom': '\uF51A',
+      'PaddingLeft': '\uF51B',
+      'PaddingRight': '\uF51C',
+      'NavigationFlipper': '\uF51D',
+      'AlignJustify': '\uF51E'
+    }
+  };
+
+  registerIcons(subset, options);
+}
diff --git a/packages/icons/src/fabric-icons-13.ts b/packages/icons/src/fabric-icons-13.ts
new file mode 100644
index 0000000000000..1fa7cbff67e92
--- /dev/null
+++ b/packages/icons/src/fabric-icons-13.ts
@@ -0,0 +1,128 @@
+// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+
+// tslint:disable:max-line-length
+
+import {
+  IIconOptions,
+  IIconSubset,
+  registerIcons
+} from '@uifabric/styling/lib/index';
+
+export function initializeIcons(
+  baseUrl: string = '',
+  options?: IIconOptions
+): void {
+  const subset: IIconSubset = {
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-13"`,
+      src: `url('${baseUrl}fabric-icons-13-02c4bea1.woff') format('woff')`,
+    },
+    icons: {
+      'TextOverflow': '\uF51F',
+      'VisualsFolder': '\uF520',
+      'VisualsStore': '\uF521',
+      'PictureCenter': '\uF522',
+      'PictureFill': '\uF523',
+      'PicturePosition': '\uF524',
+      'PictureStretch': '\uF525',
+      'PictureTile': '\uF526',
+      'Slider': '\uF527',
+      'SliderHandleSize': '\uF528',
+      'DefaultRatio': '\uF529',
+      'NumberSequence': '\uF52A',
+      'GUID': '\uF52B',
+      'ReportAdd': '\uF52C',
+      'DashboardAdd': '\uF52D',
+      'MapPinSolid': '\uF52E',
+      'WebPublish': '\uF52F',
+      'PieSingleSolid': '\uF530',
+      'BlockedSolid': '\uF531',
+      'DrillDown': '\uF532',
+      'DrillDownSolid': '\uF533',
+      'DrillExpand': '\uF534',
+      'DrillShow': '\uF535',
+      'OneDriveFolder16': '\uF53B',
+      'ChronosLogo': '\uF541',
+      'FunctionalManagerDashboard': '\uF542',
+      'BIDashboard': '\uF543',
+      'CodeEdit': '\uF544',
+      'RenewalCurrent': '\uF545',
+      'RenewalFuture': '\uF546',
+      'SplitObject': '\uF547',
+      'BulkUpload': '\uF548',
+      'DownloadDocument': '\uF549',
+      'WaitlistConfirm': '\uF550',
+      'WaitlistConfirmMirrored': '\uF551',
+      'LaptopSecure': '\uF552',
+      'DragObject': '\uF553',
+      'EntryView': '\uF554',
+      'EntryDecline': '\uF555',
+      'ContactCardSettings': '\uF556',
+      'ContactCardSettingsMirrored': '\uF557',
+      'CalendarSettings': '\uF558',
+      'CalendarSettingsMirrored': '\uF559',
+      'HardDriveLock': '\uF55A',
+      'HardDriveUnlock': '\uF55B',
+      'AccountManagement': '\uF55C',
+      'TransitionPop': '\uF5B2',
+      'TransitionPush': '\uF5B3',
+      'TransitionEffect': '\uF5B4',
+      'LookupEntities': '\uF5B5',
+      'ExploreData': '\uF5B6',
+      'AddBookmark': '\uF5B7',
+      'SearchBookmark': '\uF5B8',
+      'DrillThrough': '\uF5B9',
+      'MasterDatabase': '\uF5BA',
+      'CertifiedDatabase': '\uF5BB',
+      'MaximumValue': '\uF5BC',
+      'MinimumValue': '\uF5BD',
+      'VisualStudioIDELogo32': '\uF5D0',
+      'PasteAsText': '\uF5D5',
+      'PasteAsCode': '\uF5D6',
+      'BrowserTab': '\uF5D7',
+      'BrowserTabScreenshot': '\uF5D8',
+      'DesktopScreenshot': '\uF5D9',
+      'FileYML': '\uF5DA',
+      'ClipboardSolid': '\uF5DC',
+      'AnalyticsView': '\uF5F1',
+      'Leave': '\uF627',
+      'Trending12': '\uF62D',
+      'Blocked12': '\uF62E',
+      'Warning12': '\uF62F',
+      'CheckedOutByOther12': '\uF630',
+      'CheckedOutByYou12': '\uF631',
+      'CircleShapeSolid': '\uF63C',
+      'SquareShapeSolid': '\uF63D',
+      'TriangleShapeSolid': '\uF63E',
+      'DropShapeSolid': '\uF63F',
+      'InsertColumnsLeft': '\uF64A',
+      'InsertColumnsRight': '\uF64B',
+      'InsertRowsAbove': '\uF64C',
+      'InsertRowsBelow': '\uF64D',
+      'DeleteColumns': '\uF64E',
+      'DeleteRows': '\uF64F',
+      'DeleteRowsMirrored': '\uF650',
+      'DeleteTable': '\uF651',
+      'GitLogo': '\uF65D',
+      'GitHubLogo': '\uF65E',
+      'ApacheMavenLogo': '\uF65F',
+      'NPMLogo': '\uF660',
+      'GitFork': '\uF661',
+      'SVNLogo': '\uF662',
+      'JenkinsLogo': '\uF663',
+      'VersionControlPush': '\uF664',
+      'ExternalGit': '\uF665',
+      'InsertSignatureLine': '\uF677',
+      'ArrangeByFrom': '\uF678'
+    }
+  };
+
+  registerIcons(subset, options);
+}
diff --git a/packages/icons/src/fabric-icons-14.ts b/packages/icons/src/fabric-icons-14.ts
new file mode 100644
index 0000000000000..1492454e350b1
--- /dev/null
+++ b/packages/icons/src/fabric-icons-14.ts
@@ -0,0 +1,34 @@
+  // Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+
+// tslint:disable:max-line-length
+
+import {
+  IIconOptions,
+  IIconSubset,
+  registerIcons
+} from '@uifabric/styling/lib/index';
+
+export function initializeIcons(
+  baseUrl: string = '',
+  options?: IIconOptions
+): void {
+  const subset: IIconSubset = {
+    style: {
+      MozOsxFontSmoothing: 'grayscale',
+      WebkitFontSmoothing: 'antialiased',
+      fontStyle: 'normal',
+      fontWeight: 'normal',
+      speak: 'none'
+    },
+    fontFace: {
+      fontFamily: `"FabricMDL2Icons-14"`,
+      src: `url('${baseUrl}fabric-icons-14-36569c01.woff') format('woff')`,
+    },
+    icons: {
+      'Phishing': '\uF679',
+      'CreateMailRule': '\uF67A'
+    }
+  };
+
+  registerIcons(subset, options);
+}
diff --git a/packages/icons/src/fabric-icons-2.ts b/packages/icons/src/fabric-icons-2.ts
index f04be16bff35a..fbb527a9e888c 100644
--- a/packages/icons/src/fabric-icons-2.ts
+++ b/packages/icons/src/fabric-icons-2.ts
@@ -1,3 +1,5 @@
+  // Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+
 // tslint:disable:max-line-length
 
 import {
@@ -20,18 +22,35 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-2"`,
-      src: `url('${baseUrl}fabric-icons-2-2be8dca9.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-2-e2ae1f0c.woff') format('woff')`,
     },
     icons: {
+      'Comment': '\uE90A',
+      'DockLeft': '\uE90C',
+      'DockRight': '\uE90D',
+      'Repair': '\uE90F',
+      'Accounts': '\uE910',
+      'RadioBullet': '\uE915',
+      'Stopwatch': '\uE916',
+      'Clock': '\uE917',
+      'WorldClock': '\uE918',
+      'AlarmClock': '\uE919',
+      'Hospital': '\uE91D',
+      'Timer': '\uE91E',
+      'FullCircleMask': '\uE91F',
+      'LocationFill': '\uE920',
+      'ChromeMinimize': '\uE921',
+      'Annotation': '\uE924',
       'Fingerprint': '\uE928',
       'Handwriting': '\uE929',
-      'StackIndicator': '\uE7FF',
       'Completed': '\uE930',
       'Label': '\uE932',
       'FlickDown': '\uE935',
       'FlickUp': '\uE936',
       'FlickLeft': '\uE937',
       'FlickRight': '\uE938',
+      'MiniExpand': '\uE93A',
+      'MiniContract': '\uE93B',
       'Streaming': '\uE93E',
       'MusicInCollection': '\uE940',
       'OneDrive': '\uE941',
@@ -54,28 +73,21 @@ export function initializeIcons(
       'ChevronDownMed': '\uE972',
       'ChevronLeftMed': '\uE973',
       'ChevronRightMed': '\uE974',
-      'Dictionary': '\uE82D',
-      'ChromeBack': '\uE830',
       'PC1': '\uE977',
       'PresenceChickletVideo': '\uE979',
       'Reply': '\uE97A',
       'HalfAlpha': '\uE97E',
-      'LockSolid': '\uE9A2',
       'ConstructionCone': '\uE98F',
       'DoubleChevronLeftMed': '\uE991',
       'Volume0': '\uE992',
       'Volume1': '\uE993',
       'Volume2': '\uE994',
       'Volume3': '\uE995',
-      'CaretHollow': '\uE817',
-      'CaretSolid': '\uE818',
-      'FolderOpen': '\uE838',
-      'PinnedFill': '\uE842',
       'Chart': '\uE999',
       'Robot': '\uE99A',
+      'LockSolid': '\uE9A2',
       'BidiLtr': '\uE9AA',
       'BidiRtl': '\uE9AB',
-      'RevToggleKey': '\uE845',
       'RightDoubleQuote': '\uE9B1',
       'Sunny': '\uE9BD',
       'CloudWeather': '\uE9BE',
@@ -95,8 +107,6 @@ export function initializeIcons(
       'Duststorm': '\uE9CD',
       'Unknown': '\uE9CE',
       'Precipitation': '\uE9CF',
-      'Ringer': '\uEA8F',
-      'PDF': '\uEA90',
       'Ribbon': '\uE9D1',
       'AreaChart': '\uE9D2',
       'Assign': '\uE9D3',
@@ -112,17 +122,9 @@ export function initializeIcons(
       'SnowShowerDay': '\uE9FD',
       'HailDay': '\uEA00',
       'WorkFlow': '\uEA01',
-      'StoreLogoMed': '\uEA04',
-      'TriangleSolid': '\uEA08',
-      'RainShowersNight': '\uEA0F',
-      'SnowShowerNight': '\uEA11',
-      'HailNight': '\uEA13',
-      'Info2': '\uEA1F',
-      'StoreLogo': '\uEA96',
-      'MultiSelectMirrored': '\uEA98',
-      'Broom': '\uEA99',
-      'MusicInCollectionFill': '\uEA36',
-      'Asterisk': '\uEA38'
+      'HourGlass': '\uEA03',
+      'StoreLogoMed20': '\uEA04',
+      'TimeSheet': '\uEA05'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons-3.ts b/packages/icons/src/fabric-icons-3.ts
index 0758fa8440e7c..dd813f825c81a 100644
--- a/packages/icons/src/fabric-icons-3.ts
+++ b/packages/icons/src/fabric-icons-3.ts
@@ -1,3 +1,5 @@
+  // Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+
 // tslint:disable:max-line-length
 
 import {
@@ -20,9 +22,26 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-3"`,
-      src: `url('${baseUrl}fabric-icons-3-80b6008d.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-3-a13cb765.woff') format('woff')`,
     },
     icons: {
+      'TriangleSolid': '\uEA08',
+      'VideoSolid': '\uEA0C',
+      'RainShowersNight': '\uEA0F',
+      'SnowShowerNight': '\uEA11',
+      'Teamwork': '\uEA12',
+      'HailNight': '\uEA13',
+      'PeopleAdd': '\uEA15',
+      'Glasses': '\uEA16',
+      'DateTime2': '\uEA17',
+      'Shield': '\uEA18',
+      'Header1': '\uEA19',
+      'PageAdd': '\uEA1A',
+      'NumberedList': '\uEA1C',
+      'PowerBILogo': '\uEA1E',
+      'Info2': '\uEA1F',
+      'MusicInCollectionFill': '\uEA36',
+      'Asterisk': '\uEA38',
       'ErrorBadge': '\uEA39',
       'CircleFill': '\uEA3B',
       'Record2': '\uEA3F',
@@ -53,6 +72,12 @@ export function initializeIcons(
       'EmojiNeutral': '\uEA87',
       'EmojiDisappointed': '\uEA88',
       'HomeSolid': '\uEA8A',
+      'Ringer': '\uEA8F',
+      'PDF': '\uEA90',
+      'HeartBroken': '\uEA92',
+      'StoreLogo16': '\uEA96',
+      'MultiSelectMirrored': '\uEA98',
+      'Broom': '\uEA99',
       'Cocktails': '\uEA9D',
       'Wines': '\uEABF',
       'Articles': '\uEAC1',
@@ -60,9 +85,11 @@ export function initializeIcons(
       'DietPlanNotebook': '\uEAC8',
       'Pill': '\uEACB',
       'ExerciseTracker': '\uEACC',
+      'HandsFree': '\uEAD0',
       'Medical': '\uEAD4',
       'Running': '\uEADA',
       'Weights': '\uEADB',
+      'AddNotes': '\uEAE3',
       'BarChart4': '\uEAE7',
       'CirclePlus': '\uEAEE',
       'Coffee': '\uEAEF',
@@ -73,8 +100,10 @@ export function initializeIcons(
       'PieSingle': '\uEB05',
       'RemoveFilter': '\uEB08',
       'Savings': '\uEB0B',
+      'Sell': '\uEB0C',
       'StockDown': '\uEB0F',
       'StockUp': '\uEB11',
+      'Lamp': '\uEB19',
       'MSNVideos': '\uEB1C',
       'Cricket': '\uEB1E',
       'Golf': '\uEB1F',
@@ -87,6 +116,7 @@ export function initializeIcons(
       'ProFootball': '\uEB27',
       'ProHockey': '\uEB28',
       'Rugby': '\uEB2D',
+      'SubstitutionsIn': '\uEB31',
       'Tennis': '\uEB33',
       'Arrivals': '\uEB34',
       'Design': '\uEB3C',
@@ -94,35 +124,7 @@ export function initializeIcons(
       'Drop': '\uEB42',
       'SkiResorts': '\uEB45',
       'Snowflake': '\uEB46',
-      'BusSolid': '\uEB47',
-      'FerrySolid': '\uEB48',
-      'AirplaneSolid': '\uEB4C',
-      'TrainSolid': '\uEB4D',
-      'Ticket': '\uEB54',
-      'Devices4': '\uEB66',
-      'AzureLogo': '\uEB6A',
-      'BingLogo': '\uEB6B',
-      'MSNLogo': '\uEB6C',
-      'OutlookLogoInverse': '\uEB6D',
-      'OfficeLogo': '\uEB6E',
-      'SkypeLogo': '\uEB6F',
-      'Door': '\uEB75',
-      'EditMirrored': '\uEB7E',
-      'GiftCard': '\uEB8E',
-      'DoubleBookmark': '\uEB8F',
-      'StatusErrorFull': '\uEB90',
-      'Certificate': '\uEB95',
-      'FastForward': '\uEB9D',
-      'Rewind': '\uEB9E',
-      'Photo2': '\uEB9F',
-      'OpenSource': '\uEBC2',
-      'CloudDownload': '\uEBD3',
-      'WindDirection': '\uEBE6',
-      'Family': '\uEBDA',
-      'CSS': '\uEBEF',
-      'JS': '\uEBF0',
-      'DeliveryTruck': '\uEBF4',
-      'ReminderPerson': '\uEBF7'
+      'BusSolid': '\uEB47'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons-4.ts b/packages/icons/src/fabric-icons-4.ts
index a27a0773ca31b..03c61f57769a5 100644
--- a/packages/icons/src/fabric-icons-4.ts
+++ b/packages/icons/src/fabric-icons-4.ts
@@ -1,3 +1,5 @@
+// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+
 // tslint:disable:max-line-length
 
 import {
@@ -20,10 +22,44 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-4"`,
-      src: `url('${baseUrl}fabric-icons-4-46fbc7bc.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-4-97372384.woff') format('woff')`,
     },
     icons: {
+      'FerrySolid': '\uEB48',
+      'AirplaneSolid': '\uEB4C',
+      'TrainSolid': '\uEB4D',
+      'Ticket': '\uEB54',
+      'Devices4': '\uEB66',
+      'AzureLogo': '\uEB6A',
+      'BingLogo': '\uEB6B',
+      'MSNLogo': '\uEB6C',
+      'OutlookLogoInverse': '\uEB6D',
+      'OfficeLogo': '\uEB6E',
+      'SkypeLogo': '\uEB6F',
+      'Door': '\uEB75',
+      'EditMirrored': '\uEB7E',
+      'GiftCard': '\uEB8E',
+      'DoubleBookmark': '\uEB8F',
+      'StatusErrorFull': '\uEB90',
+      'Certificate': '\uEB95',
+      'FastForward': '\uEB9D',
+      'Rewind': '\uEB9E',
+      'Photo2': '\uEB9F',
+      'OpenSource': '\uEBC2',
+      'Movers': '\uEBCD',
+      'CloudDownload': '\uEBD3',
+      'Family': '\uEBDA',
+      'WindDirection': '\uEBE6',
+      'Bug': '\uEBE8',
+      'SiteScan': '\uEBEC',
+      'BrowserScreenShot': '\uEBED',
+      'F12DevTools': '\uEBEE',
+      'CSS': '\uEBEF',
+      'JS': '\uEBF0',
+      'DeliveryTruck': '\uEBF4',
+      'ReminderPerson': '\uEBF7',
       'ReminderGroup': '\uEBF8',
+      'TabletMode': '\uEBFC',
       'Umbrella': '\uEC04',
       'NetworkTower': '\uEC05',
       'CityNext': '\uEC06',
@@ -42,6 +78,7 @@ export function initializeIcons(
       'PowerPointLogoInverse': '\uEC2A',
       'Cafe': '\uEC32',
       'SpeedHigh': '\uEC4A',
+      'Commitments': '\uEC4D',
       'ThisPC': '\uEC4E',
       'MusicNote': '\uEC4F',
       'MicOff': '\uEC54',
@@ -56,6 +93,7 @@ export function initializeIcons(
       'DeveloperTools': '\uEC7A',
       'InsertTextBox': '\uEC7D',
       'LowerBrightness': '\uEC8A',
+      'DOM': '\uEC8D',
       'CloudUpload': '\uEC8E',
       'ScrollUpDown': '\uEC8F',
       'DateTime': '\uEC92',
@@ -73,16 +111,6 @@ export function initializeIcons(
       'RadioBtnOff': '\uECCA',
       'RadioBtnOn': '\uECCB',
       'ExploreContent': '\uECCD',
-      'VideoSolid': '\uEA0C',
-      'Teamwork': '\uEA12',
-      'PeopleAdd': '\uEA15',
-      'Glasses': '\uEA16',
-      'DateTime2': '\uEA17',
-      'Shield': '\uEA18',
-      'Header1': '\uEA19',
-      'PageAdd': '\uEA1A',
-      'NumberedList': '\uEA1C',
-      'PowerBILogo': '\uEA1E',
       'Product': '\uECDC',
       'ProgressLoopInner': '\uECDE',
       'ProgressLoopOuter': '\uECDF',
@@ -91,34 +119,11 @@ export function initializeIcons(
       'Glimmer': '\uECF4',
       'ChatInviteFriend': '\uECFE',
       'Crown': '\uED01',
+      'ScaleUp': '\uED09',
       'Feedback': '\uED15',
       'SharepointLogoInverse': '\uED18',
       'YammerLogo': '\uED19',
-      'Hide': '\uED1A',
-      'Uneditable': '\uED1D',
-      'ReturnToSession': '\uED24',
-      'OpenFolderHorizontal': '\uED25',
-      'CalendarMirrored': '\uED28',
-      'SwayLogoInverse': '\uED29',
-      'OutOfOffice': '\uED34',
-      'Trophy': '\uED3F',
-      'ReopenPages': '\uED50',
-      'AADLogo': '\uED68',
-      'AccessLogo': '\uED69',
-      'AdminALogoInverse32': '\uED6A',
-      'AdminCLogoInverse32': '\uED6B',
-      'AdminDLogoInverse32': '\uED6C',
-      'AdminELogoInverse32': '\uED6D',
-      'AdminLLogoInverse32': '\uED6E',
-      'AdminMLogoInverse32': '\uED6F',
-      'AdminOLogoInverse32': '\uED70',
-      'AdminPLogoInverse32': '\uED71',
-      'AdminSLogoInverse32': '\uED72',
-      'AdminYLogoInverse32': '\uED73',
-      'DelveLogoInverse': '\uED76',
-      'ExchangeLogoInverse': '\uED78',
-      'LyncLogo': '\uED79',
-      'OfficeVideoLogoInverse': '\uED7A'
+      'Hide': '\uED1A'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons-5.ts b/packages/icons/src/fabric-icons-5.ts
index b44a232cad394..05c1144911ca7 100644
--- a/packages/icons/src/fabric-icons-5.ts
+++ b/packages/icons/src/fabric-icons-5.ts
@@ -1,3 +1,5 @@
+// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+
 // tslint:disable:max-line-length
 
 import {
@@ -20,9 +22,35 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-5"`,
-      src: `url('${baseUrl}fabric-icons-5-5bc71068.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-5-125dbde8.woff') format('woff')`,
     },
     icons: {
+      'Uneditable': '\uED1D',
+      'ReturnToSession': '\uED24',
+      'OpenFolderHorizontal': '\uED25',
+      'CalendarMirrored': '\uED28',
+      'SwayLogoInverse': '\uED29',
+      'OutOfOffice': '\uED34',
+      'Trophy': '\uED3F',
+      'ReopenPages': '\uED50',
+      'EmojiTabSymbols': '\uED58',
+      'AADLogo': '\uED68',
+      'AccessLogo': '\uED69',
+      'AdminALogoInverse32': '\uED6A',
+      'AdminCLogoInverse32': '\uED6B',
+      'AdminDLogoInverse32': '\uED6C',
+      'AdminELogoInverse32': '\uED6D',
+      'AdminLLogoInverse32': '\uED6E',
+      'AdminMLogoInverse32': '\uED6F',
+      'AdminOLogoInverse32': '\uED70',
+      'AdminPLogoInverse32': '\uED71',
+      'AdminSLogoInverse32': '\uED72',
+      'AdminYLogoInverse32': '\uED73',
+      'DelveLogoInverse': '\uED76',
+      'ExchangeLogoInverse': '\uED78',
+      'LyncLogo': '\uED79',
+      'OfficeVideoLogoInverse': '\uED7A',
+      'ParatureLogo': '\uED7B',
       'SocialListeningLogo': '\uED7C',
       'VisioLogoInverse': '\uED7D',
       'Balloons': '\uED7E',
@@ -61,6 +89,7 @@ export function initializeIcons(
       'Room': '\uED9F',
       'Unsubscribe': '\uEDA0',
       'Subscribe': '\uEDA1',
+      'HardDrive': '\uEDA2',
       'RecurringTask': '\uEDB2',
       'TaskManager': '\uEDB7',
       'TaskManagerMirrored': '\uEDB8',
@@ -93,35 +122,7 @@ export function initializeIcons(
       'CaretLeftSolid8': '\uEDD9',
       'CaretRightSolid8': '\uEDDA',
       'CaretUpSolid8': '\uEDDB',
-      'CaretDownSolid8': '\uEDDC',
-      'ClearFormatting': '\uEDDD',
-      'Superscript': '\uEDDE',
-      'Subscript': '\uEDDF',
-      'Strikethrough': '\uEDE0',
-      'Export': '\uEDE1',
-      'ExportMirrored': '\uEDE2',
-      'SingleBookmark': '\uEDFF',
-      'DoubleChevronDown': '\uEE04',
-      'ReplyAll': '\uEE0A',
-      'Questionnaire': '\uEE19',
-      'ReplyMirrored': '\uEE35',
-      'ReplyAllMirrored': '\uEE36',
-      'AddGroup': '\uEE3D',
-      'QuestionnaireMirrored': '\uEE4B',
-      'TemporaryUser': '\uEE58',
-      'CaretSolid16': '\uEE62',
-      'GroupedDescending': '\uEE66',
-      'GroupedAscending': '\uEE67',
-      'AwayStatus': '\uEE6A',
-      'MyMoviesTV': '\uEE6C',
-      'AustralianRules': '\uEE70',
-      'WifiEthernet': '\uEE77',
-      'DateTimeMirrored': '\uEE93',
-      'StopSolid': '\uEE95',
-      'DoubleChevronUp12': '\uEE96',
-      'DoubleChevronDown12': '\uEE97',
-      'DoubleChevronLeft12': '\uEE98',
-      'DoubleChevronRight12': '\uEE99'
+      'CaretDownSolid8': '\uEDDC'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons-6.ts b/packages/icons/src/fabric-icons-6.ts
index ce037afb76fa9..951a2ac5c22f1 100644
--- a/packages/icons/src/fabric-icons-6.ts
+++ b/packages/icons/src/fabric-icons-6.ts
@@ -1,3 +1,5 @@
+// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+
 // tslint:disable:max-line-length
 
 import {
@@ -20,9 +22,42 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-6"`,
-      src: `url('${baseUrl}fabric-icons-6-328cd253.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-6-2e7e2914.woff') format('woff')`,
     },
     icons: {
+      'ClearFormatting': '\uEDDD',
+      'Superscript': '\uEDDE',
+      'Subscript': '\uEDDF',
+      'Strikethrough': '\uEDE0',
+      'Export': '\uEDE1',
+      'ExportMirrored': '\uEDE2',
+      'SingleBookmark': '\uEDFF',
+      'DoubleChevronDown': '\uEE04',
+      'FollowUser': '\uEE05',
+      'ReplyAll': '\uEE0A',
+      'WorkforceManagement': '\uEE0F',
+      'Questionnaire': '\uEE19',
+      'ManagerSelfService': '\uEE23',
+      'ReplyMirrored': '\uEE35',
+      'ReplyAllMirrored': '\uEE36',
+      'Medal': '\uEE38',
+      'AddGroup': '\uEE3D',
+      'QuestionnaireMirrored': '\uEE4B',
+      'TemporaryUser': '\uEE58',
+      'CaretSolid16': '\uEE62',
+      'GroupedDescending': '\uEE66',
+      'GroupedAscending': '\uEE67',
+      'AwayStatus': '\uEE6A',
+      'MyMoviesTV': '\uEE6C',
+      'GenericScan': '\uEE6F',
+      'AustralianRules': '\uEE70',
+      'WifiEthernet': '\uEE77',
+      'DateTimeMirrored': '\uEE93',
+      'StopSolid': '\uEE95',
+      'DoubleChevronUp12': '\uEE96',
+      'DoubleChevronDown12': '\uEE97',
+      'DoubleChevronLeft12': '\uEE98',
+      'DoubleChevronRight12': '\uEE99',
       'CalendarAgenda': '\uEE9A',
       'AddEvent': '\uEEB5',
       'AssetLibrary': '\uEEB6',
@@ -55,7 +90,10 @@ export function initializeIcons(
       'DelveAnalytics': '\uEEEE',
       'ArrowUpRightMirrored8': '\uEEEF',
       'ArrowDownRightMirrored8': '\uEEF0',
+      'CompanyDirectory': '\uEF0D',
+      'CompanyDirectoryMirrored': '\uEF2B',
       'OneDriveAdd': '\uEF32',
+      'ProfileSearch': '\uEF35',
       'Header2': '\uEF36',
       'Header3': '\uEF37',
       'Header4': '\uEF38',
@@ -85,42 +123,7 @@ export function initializeIcons(
       'ExpandMenu': '\uEF67',
       'Boards': '\uEF68',
       'SunAdd': '\uEF69',
-      'SunQuestionMark': '\uEF6A',
-      'LandscapeOrientation': '\uEF6B',
-      'DocumentSearch': '\uEF6C',
-      'PublicCalendar': '\uEF6D',
-      'PublicContactCard': '\uEF6E',
-      'PublicEmail': '\uEF6F',
-      'PublicFolder': '\uEF70',
-      'WordDocument': '\uEF71',
-      'PowerPointDocument': '\uEF72',
-      'ExcelDocument': '\uEF73',
-      'GroupedList': '\uEF74',
-      'ClassroomLogo': '\uEF75',
-      'Sections': '\uEF76',
-      'EditPhoto': '\uEF77',
-      'Starburst': '\uEF78',
-      'ShareiOS': '\uEF79',
-      'AirTickets': '\uEF7A',
-      'PencilReply': '\uEF7B',
-      'Tiles2': '\uEF7C',
-      'SkypeCircleCheck': '\uEF7D',
-      'SkypeCircleClock': '\uEF7E',
-      'SkypeCircleMinus': '\uEF7F',
-      'SkypeMessage': '\uEF83',
-      'ClosedCaption': '\uEF84',
-      'ATPLogo': '\uEF85',
-      'OfficeFormsLogoInverse': '\uEF86',
-      'RecycleBin': '\uEF87',
-      'EmptyRecycleBin': '\uEF88',
-      'Hide2': '\uEF89',
-      'Breadcrumb': '\uEF8C',
-      'PageEdit': '\uEFB6',
-      'Database': '\uEFC7',
-      'DocumentManagement': '\uEFFC',
-      'CRMReport': '\uEFFE',
-      'ZipFolder': '\uF012',
-      'TextDocument': '\uF029'
+      'SunQuestionMark': '\uEF6A'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons-7.ts b/packages/icons/src/fabric-icons-7.ts
index b94f854b4edfb..ab89a59e387b0 100644
--- a/packages/icons/src/fabric-icons-7.ts
+++ b/packages/icons/src/fabric-icons-7.ts
@@ -1,3 +1,5 @@
+// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+
 // tslint:disable:max-line-length
 
 import {
@@ -20,9 +22,52 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-7"`,
-      src: `url('${baseUrl}fabric-icons-7-1bae3315.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-7-143895dd.woff') format('woff')`,
     },
     icons: {
+      'LandscapeOrientation': '\uEF6B',
+      'DocumentSearch': '\uEF6C',
+      'PublicCalendar': '\uEF6D',
+      'PublicContactCard': '\uEF6E',
+      'PublicEmail': '\uEF6F',
+      'PublicFolder': '\uEF70',
+      'WordDocument': '\uEF71',
+      'PowerPointDocument': '\uEF72',
+      'ExcelDocument': '\uEF73',
+      'GroupedList': '\uEF74',
+      'ClassroomLogo': '\uEF75',
+      'Sections': '\uEF76',
+      'EditPhoto': '\uEF77',
+      'Starburst': '\uEF78',
+      'ShareiOS': '\uEF79',
+      'AirTickets': '\uEF7A',
+      'PencilReply': '\uEF7B',
+      'Tiles2': '\uEF7C',
+      'SkypeCircleCheck': '\uEF7D',
+      'SkypeCircleClock': '\uEF7E',
+      'SkypeCircleMinus': '\uEF7F',
+      'SkypeMessage': '\uEF83',
+      'ClosedCaption': '\uEF84',
+      'ATPLogo': '\uEF85',
+      'OfficeFormsLogoInverse': '\uEF86',
+      'RecycleBin': '\uEF87',
+      'EmptyRecycleBin': '\uEF88',
+      'Hide2': '\uEF89',
+      'Breadcrumb': '\uEF8C',
+      'BirthdayCake': '\uEF8D',
+      'TimeEntry': '\uEF95',
+      'PageEdit': '\uEFB6',
+      'PageRemove': '\uEFBA',
+      'Database': '\uEFC7',
+      'EditContact': '\uEFD3',
+      'ConnectContacts': '\uEFD4',
+      'ActivateOrders': '\uEFE0',
+      'DeactivateOrders': '\uEFE1',
+      'DocumentManagement': '\uEFFC',
+      'CRMReport': '\uEFFE',
+      'ZipFolder': '\uF012',
+      'SurveyQuestions': '\uF01B',
+      'TextDocument': '\uF029',
       'PageCheckedOut': '\uF02C',
       'SaveAndClose': '\uF038',
       'Script': '\uF03A',
@@ -71,58 +116,13 @@ export function initializeIcons(
       'GiftboxOpen': '\uF133',
       'StatusCircleOuter': '\uF136',
       'StatusCircleInner': '\uF137',
+      'Toll': '\uF160',
       'ExploreContentSingle': '\uF164',
       'CollapseContent': '\uF165',
       'CollapseContentSingle': '\uF166',
       'InfoSolid': '\uF167',
       'ProgressRingDots': '\uF16A',
-      'CaloriesAdd': '\uF172',
-      'BranchFork': '\uF173',
-      'HardDriveGroup': '\uF18F',
-      'BucketColor': '\uF1B6',
-      'BucketColorFill': '\uF1B7',
-      'Taskboard': '\uF1C2',
-      'SingleColumn': '\uF1D3',
-      'DoubleColumn': '\uF1D4',
-      'TripleColumn': '\uF1D5',
-      'ColumnLeftTwoThirds': '\uF1D6',
-      'ColumnRightTwoThirds': '\uF1D7',
-      'AccessLogoFill': '\uF1DB',
-      'AnalyticsLogo': '\uF1DE',
-      'AnalyticsQuery': '\uF1DF',
-      'NewAnalyticsQuery': '\uF1E0',
-      'AnalyticsReport': '\uF1E1',
-      'WordLogo': '\uF1E3',
-      'WordLogoFill': '\uF1E4',
-      'ExcelLogo': '\uF1E5',
-      'ExcelLogoFill': '\uF1E6',
-      'OneNoteLogo': '\uF1E7',
-      'OneNoteLogoFill': '\uF1E8',
-      'OutlookLogo': '\uF1E9',
-      'OutlookLogoFill': '\uF1EA',
-      'PowerPointLogo': '\uF1EB',
-      'PowerPointLogoFill': '\uF1EC',
-      'PublisherLogo': '\uF1ED',
-      'PublisherLogoFill': '\uF1EE',
-      'ScheduleEventAction': '\uF1EF',
-      'FlameSolid': '\uF1F3',
-      'ServerProcesses': '\uF1FE',
-      'Server': '\uF201',
-      'SaveAll': '\uF203',
-      'LinkedInLogo': '\uF20A',
-      'SidePanelMirrored': '\uF221',
-      'ProtectRestrict': '\uF22A',
-      'GridViewSmall': '\uF232',
-      'GridViewMedium': '\uF233',
-      'GridViewLarge': '\uF234',
-      'Step': '\uF241',
-      'StepInsert': '\uF242',
-      'StepShared': '\uF243',
-      'StepSharedAdd': '\uF244',
-      'StepSharedInsert': '\uF245',
-      'ViewDashboard': '\uF246',
-      'ViewList': '\uF247',
-      'ViewListGroup': '\uF248'
+      'CaloriesAdd': '\uF172'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons-8.ts b/packages/icons/src/fabric-icons-8.ts
index 3f6eccbce7e3c..57325985ef742 100644
--- a/packages/icons/src/fabric-icons-8.ts
+++ b/packages/icons/src/fabric-icons-8.ts
@@ -1,3 +1,5 @@
+  // Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+
 // tslint:disable:max-line-length
 
 import {
@@ -20,9 +22,61 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-8"`,
-      src: `url('${baseUrl}fabric-icons-8-bf5c8e0c.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-8-bd2a110b.woff') format('woff')`,
     },
     icons: {
+      'BranchFork': '\uF173',
+      'MobileReport': '\uF18A',
+      'HardDriveGroup': '\uF18F',
+      'FastMode': '\uF19A',
+      'ToggleOff': '\uF19F',
+      'Trophy2': '\uF1AE',
+      'BucketColor': '\uF1B6',
+      'BucketColorFill': '\uF1B7',
+      'Taskboard': '\uF1C2',
+      'SingleColumn': '\uF1D3',
+      'DoubleColumn': '\uF1D4',
+      'TripleColumn': '\uF1D5',
+      'ColumnLeftTwoThirds': '\uF1D6',
+      'ColumnRightTwoThirds': '\uF1D7',
+      'AccessLogoFill': '\uF1DB',
+      'AnalyticsLogo': '\uF1DE',
+      'AnalyticsQuery': '\uF1DF',
+      'NewAnalyticsQuery': '\uF1E0',
+      'AnalyticsReport': '\uF1E1',
+      'WordLogo': '\uF1E3',
+      'WordLogoFill': '\uF1E4',
+      'ExcelLogo': '\uF1E5',
+      'ExcelLogoFill': '\uF1E6',
+      'OneNoteLogo': '\uF1E7',
+      'OneNoteLogoFill': '\uF1E8',
+      'OutlookLogo': '\uF1E9',
+      'OutlookLogoFill': '\uF1EA',
+      'PowerPointLogo': '\uF1EB',
+      'PowerPointLogoFill': '\uF1EC',
+      'PublisherLogo': '\uF1ED',
+      'PublisherLogoFill': '\uF1EE',
+      'ScheduleEventAction': '\uF1EF',
+      'FlameSolid': '\uF1F3',
+      'ServerProcesses': '\uF1FE',
+      'Server': '\uF201',
+      'SaveAll': '\uF203',
+      'LinkedInLogo': '\uF20A',
+      'SidePanelMirrored': '\uF221',
+      'ProtectRestrict': '\uF22A',
+      'UnknownMirrored': '\uF22E',
+      'PublicContactCardMirrored': '\uF230',
+      'GridViewSmall': '\uF232',
+      'GridViewMedium': '\uF233',
+      'GridViewLarge': '\uF234',
+      'Step': '\uF241',
+      'StepInsert': '\uF242',
+      'StepShared': '\uF243',
+      'StepSharedAdd': '\uF244',
+      'StepSharedInsert': '\uF245',
+      'ViewDashboard': '\uF246',
+      'ViewList': '\uF247',
+      'ViewListGroup': '\uF248',
       'ViewListTree': '\uF249',
       'TriggerAuto': '\uF24A',
       'TriggerUser': '\uF24B',
@@ -32,9 +86,13 @@ export function initializeIcons(
       'BuildQueue': '\uF24F',
       'BuildQueueNew': '\uF250',
       'UserFollowed': '\uF25C',
+      'ContactLink': '\uF25F',
+      'Stack': '\uF26F',
+      'Bullseye': '\uF272',
       'VennDiagram': '\uF273',
       'FiveTileGrid': '\uF274',
       'FocalPoint': '\uF277',
+      'RingerRemove': '\uF279',
       'TeamsLogoInverse': '\uF27A',
       'TeamsLogo': '\uF27B',
       'TeamsLogoFill': '\uF27C',
@@ -66,63 +124,7 @@ export function initializeIcons(
       'RowsGroup': '\uF29B',
       'RowsChild': '\uF29C',
       'Deploy': '\uF29D',
-      'Redeploy': '\uF29E',
-      'ServerEnviroment': '\uF29F',
-      'Plug': '\uF300',
-      'PlugSolid': '\uF301',
-      'PlugConnected': '\uF302',
-      'PlugDisconnected': '\uF303',
-      'UnlockSolid': '\uF304',
-      'Variable': '\uF305',
-      'Parameter': '\uF306',
-      'CommentUrgent': '\uF307',
-      'Storyboard': '\uF308',
-      'DiffInline': '\uF309',
-      'DiffSideBySide': '\uF30A',
-      'ImageDiff': '\uF30B',
-      'ImagePixel': '\uF30C',
-      'FileBug': '\uF30D',
-      'FileCode': '\uF30E',
-      'FileComment': '\uF30F',
-      'FileImage': '\uF311',
-      'FileSymlink': '\uF312',
-      'AutoFillTemplate': '\uF313',
-      'WorkItem': '\uF314',
-      'WorkItemBug': '\uF315',
-      'LogRemove': '\uF316',
-      'ColumnOptions': '\uF317',
-      'Packages': '\uF318',
-      'BuildIssue': '\uF319',
-      'AssessmentGroup': '\uF31A',
-      'VariableGroup': '\uF31B',
-      'FullHistory': '\uF31C',
-      'BusinessHoursSign': '\uF310',
-      'VisioDiagram': '\uF2A0',
-      'HighlightMappedShapes': '\uF2A1',
-      'TextCallout': '\uF2A2',
-      'IconSetsFlag': '\uF2A4',
-      'VisioLogo': '\uF2A7',
-      'VisioLogoFill': '\uF2A8',
-      'VisioDocument': '\uF2A9',
-      'TimelineProgress': '\uF2AA',
-      'TimelineDelivery': '\uF2AB',
-      'Backlog': '\uF2AC',
-      'TeamFavorite': '\uF2AD',
-      'TaskGroup': '\uF2AE',
-      'TaskGroupMirrored': '\uF2AF',
-      'ScopeTemplate': '\uF2B0',
-      'AssessmentGroupTemplate': '\uF2B1',
-      'NewTeamProject': '\uF2B2',
-      'CommentAdd': '\uF2B3',
-      'CommentNext': '\uF2B4',
-      'CommentPrevious': '\uF2B5',
-      'ShopServer': '\uF2B6',
-      'LocaleLanguage': '\uF2B7',
-      'QueryList': '\uF2B8',
-      'UserSync': '\uF2B9',
-      'UserPause': '\uF2BA',
-      'StreamingOff': '\uF2BB',
-      'ArrowTallUpLeft': '\uF2BD'
+      'Redeploy': '\uF29E'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons-9.ts b/packages/icons/src/fabric-icons-9.ts
index 1304bf3541261..3dc4b6431a896 100644
--- a/packages/icons/src/fabric-icons-9.ts
+++ b/packages/icons/src/fabric-icons-9.ts
@@ -1,3 +1,5 @@
+  // Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+
 // tslint:disable:max-line-length
 
 import {
@@ -20,9 +22,36 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-9"`,
-      src: `url('${baseUrl}fabric-icons-9-a362212c.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-9-8ab77260.woff') format('woff')`,
     },
     icons: {
+      'ServerEnviroment': '\uF29F',
+      'VisioDiagram': '\uF2A0',
+      'HighlightMappedShapes': '\uF2A1',
+      'TextCallout': '\uF2A2',
+      'IconSetsFlag': '\uF2A4',
+      'VisioLogo': '\uF2A7',
+      'VisioLogoFill': '\uF2A8',
+      'VisioDocument': '\uF2A9',
+      'TimelineProgress': '\uF2AA',
+      'TimelineDelivery': '\uF2AB',
+      'Backlog': '\uF2AC',
+      'TeamFavorite': '\uF2AD',
+      'TaskGroup': '\uF2AE',
+      'TaskGroupMirrored': '\uF2AF',
+      'ScopeTemplate': '\uF2B0',
+      'AssessmentGroupTemplate': '\uF2B1',
+      'NewTeamProject': '\uF2B2',
+      'CommentAdd': '\uF2B3',
+      'CommentNext': '\uF2B4',
+      'CommentPrevious': '\uF2B5',
+      'ShopServer': '\uF2B6',
+      'LocaleLanguage': '\uF2B7',
+      'QueryList': '\uF2B8',
+      'UserSync': '\uF2B9',
+      'UserPause': '\uF2BA',
+      'StreamingOff': '\uF2BB',
+      'ArrowTallUpLeft': '\uF2BD',
       'ArrowTallUpRight': '\uF2BE',
       'ArrowTallDownLeft': '\uF2BF',
       'ArrowTallDownRight': '\uF2C0',
@@ -87,42 +116,15 @@ export function initializeIcons(
       'MarkDownLanguage': '\uF2FB',
       'FullWidth': '\uF2FE',
       'FullWidthEdit': '\uF2FF',
-      'SingleColumnEdit': '\uF321',
-      'DoubleColumnEdit': '\uF322',
-      'TripleColumnEdit': '\uF323',
-      'ColumnLeftTwoThirdsEdit': '\uF324',
-      'ColumnRightTwoThirdsEdit': '\uF325',
-      'StreamLogo': '\uF329',
-      'AlertSolid': '\uF331',
-      'MegaphoneSolid': '\uF332',
-      'TaskSolid': '\uF333',
-      'ConfigurationSolid': '\uF334',
-      'BugSolid': '\uF335',
-      'CrownSolid': '\uF336',
-      'Trophy2Solid': '\uF337',
-      'QuickNoteSolid': '\uF338',
-      'ConstructionConeSolid': '\uF339',
-      'PageListSolid': '\uF33A',
-      'PageListMirroredSolid': '\uF33B',
-      'StarburstSolid': '\uF33C',
-      'ReadingModeSolid': '\uF33D',
-      'SadSolid': '\uF33E',
-      'HealthSolid': '\uF33F',
-      'ShieldSolid': '\uF340',
-      'GiftBoxSolid': '\uF341',
-      'ShoppingCartSolid': '\uF342',
-      'MailSolid': '\uF343',
-      'ChatSolid': '\uF344',
-      'RibbonSolid': '\uF345',
-      'FinancialSolid': '\uF346',
-      'FinancialMirroredSolid': '\uF347',
-      'HeadsetSolid': '\uF348',
-      'PermissionsSolid': '\uF349',
-      'ParkingSolid': '\uF34A',
-      'ParkingMirroredSolid': '\uF34B',
-      'DiamondSolid': '\uF34C',
-      'AsteriskSolid': '\uF34D',
-      'OfflineStorageSolid': '\uF34E'
+      'Plug': '\uF300',
+      'PlugSolid': '\uF301',
+      'PlugConnected': '\uF302',
+      'PlugDisconnected': '\uF303',
+      'UnlockSolid': '\uF304',
+      'Variable': '\uF305',
+      'Parameter': '\uF306',
+      'CommentUrgent': '\uF307',
+      'Storyboard': '\uF308'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons.ts b/packages/icons/src/fabric-icons.ts
index ea787ad8c1986..02d7e4ed2f83e 100644
--- a/packages/icons/src/fabric-icons.ts
+++ b/packages/icons/src/fabric-icons.ts
@@ -1,3 +1,5 @@
+  // Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+
 // tslint:disable:max-line-length
 
 import {
@@ -20,7 +22,7 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons"`,
-      src: `url('${baseUrl}fabric-icons-4ac62dd2.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-cf6d96bb.woff') format('woff')`,
     },
     icons: {
       'GlobalNavButton': '\uE700',
@@ -42,9 +44,11 @@ export function initializeIcons(
       'ChevronLeft': '\uE76B',
       'ChevronRight': '\uE76C',
       'Calendar': '\uE787',
+      'Megaphone': '\uE789',
       'Undo': '\uE7A7',
       'Flag': '\uE7C1',
       'Page': '\uE7C3',
+      'Pinned': '\uE840',
       'View': '\uE890',
       'Clear': '\uE894',
       'Download': '\uE896',
@@ -56,7 +60,6 @@ export function initializeIcons(
       'Tag': '\uE8EC',
       'AddFriend': '\uE8FA',
       'Info': '\uE946',
-      'Pinned': '\uE840',
       'SortLines': '\uE9D0',
       'List': '\uEA37',
       'CircleRing': '\uEA3A',
diff --git a/packages/icons/src/index.ts b/packages/icons/src/index.ts
index 56016b60ce5bf..1d07d5304f327 100644
--- a/packages/icons/src/index.ts
+++ b/packages/icons/src/index.ts
@@ -11,16 +11,19 @@ import { initializeIcons as i8 } from './fabric-icons-8';
 import { initializeIcons as i9 } from './fabric-icons-9';
 import { initializeIcons as i10 } from './fabric-icons-10';
 import { initializeIcons as i11 } from './fabric-icons-11';
+import { initializeIcons as i12 } from './fabric-icons-12';
+import { initializeIcons as i13 } from './fabric-icons-13';
+import { initializeIcons as i14 } from './fabric-icons-14';
+
 import { IIconOptions } from '@uifabric/styling/lib/index';
 import './icon-aliases';
-
 const DEFAULT_BASE_URL = 'https://spoprod-a.akamaihd.net/files/fabric/assets/icons/';
 
 export function initializeIcons(
   baseUrl: string = DEFAULT_BASE_URL,
   options?: IIconOptions
 ): void {
-  [i, i0, i1, i2, i3, i4, i5, i6, i7, i8, i9, i10, i11].forEach(
+  [i,i0,i1,i2,i3,i4,i5,i6,i7,i8,i9,i10,i11,i12,i13,i14].forEach(
     (initialize: (url: string, options?: IIconOptions) => void) => initialize(baseUrl, options)
   );
 }

From e2487c7a2bbf513b47f4f5694180b56e1f6a4ed1 Mon Sep 17 00:00:00 2001
From: staylo8 <33881401+staylo8@users.noreply.github.com>
Date: Fri, 26 Jan 2018 13:20:45 -0800
Subject: [PATCH 1280/1641] Add overflow menu props to command bar (#3819)

* Add overflow menu props to CommandBar

* Add change file
---
 ...verflowMenuPropsToCommandBar_2018-01-26-21-02.json | 11 +++++++++++
 .../src/components/CommandBar/CommandBar.base.tsx     |  3 ++-
 .../src/components/CommandBar/CommandBar.types.ts     |  7 ++++++-
 3 files changed, 19 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/addOverflowMenuPropsToCommandBar_2018-01-26-21-02.json

diff --git a/common/changes/@uifabric/experiments/addOverflowMenuPropsToCommandBar_2018-01-26-21-02.json b/common/changes/@uifabric/experiments/addOverflowMenuPropsToCommandBar_2018-01-26-21-02.json
new file mode 100644
index 0000000000000..d7afb469163a0
--- /dev/null
+++ b/common/changes/@uifabric/experiments/addOverflowMenuPropsToCommandBar_2018-01-26-21-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Add overflowMenuProps to Experiments CommandBar",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "staylo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.base.tsx b/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
index 9161424602709..150dfbf4ed8f3 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
@@ -67,6 +67,7 @@ export class CommandBarBase extends BaseComponent<ICommandBarProps, {}> implemen
       farItems,
       elipisisAriaLabel,
       elipisisIconProps,
+      overflowMenuProps,
       buttonStyles,
       getStyles,
       theme,
@@ -111,7 +112,7 @@ export class CommandBarBase extends BaseComponent<ICommandBarProps, {}> implemen
                       styles: { ...buttonStyles, menuIcon: { fontSize: '17px' } },
                       ariaLabel: elipisisAriaLabel,
                       className: css('ms-CommandBar-overflowButton'),
-                      menuProps: { items: renderedOverflowItems },
+                      menuProps: { ...overflowMenuProps, items: renderedOverflowItems },
                       menuIconProps: elipisisIconProps,
                     })
                   );
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.types.ts b/packages/experiments/src/components/CommandBar/CommandBar.types.ts
index 53ead53555ebf..9231023f6e94b 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.types.ts
+++ b/packages/experiments/src/components/CommandBar/CommandBar.types.ts
@@ -1,6 +1,6 @@
 
 import * as React from 'react';
-import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { IContextualMenuItem, IContextualMenuProps } from 'office-ui-fabric-react/lib/ContextualMenu';
 import { IButtonStyles } from 'office-ui-fabric-react/lib/Button';
 import { IIconProps } from 'office-ui-fabric-react/lib/Icon';
 import { ICommandBarData } from './CommandBar.base';
@@ -51,6 +51,11 @@ export interface ICommandBarProps extends React.HTMLAttributes<HTMLDivElement> {
   */
   elipisisIconProps?: IIconProps;
 
+  /**
+  * Menu props to be passed to overflow elipsis
+  */
+  overflowMenuProps?: Partial<IContextualMenuProps>;
+
   /**
   * If endAligned, all icons will be aligned to the far side of the commandbar, and overflow items
   * will be taking from the starting side

From 4b472acc791f1b1d22b95e2ea48c6538aae94573 Mon Sep 17 00:00:00 2001
From: Jordan Janzen <jordancjanzen@gmail.com>
Date: Fri, 26 Jan 2018 14:10:21 -0800
Subject: [PATCH 1281/1641] Fix teaching bubble overriding all default callout
 props (#3811)

* Add private _defaultCalloutProps instead of public defaultProps to set calloutProps.

* npm run change output

* Re-add public static defaultProps but deprecate the calloutProps, and then spread the default calloutProps and the _defaultCalloutProps into a new object that's passed into Callout.
---
 ...default-calloutProps_2018-01-25-20-30.json | 11 +++++++++
 .../TeachingBubble/TeachingBubble.tsx         | 24 +++++++++++++++----
 2 files changed, 30 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/Fix-TeachingBubble-overridding-all-default-calloutProps_2018-01-25-20-30.json

diff --git a/common/changes/office-ui-fabric-react/Fix-TeachingBubble-overridding-all-default-calloutProps_2018-01-25-20-30.json b/common/changes/office-ui-fabric-react/Fix-TeachingBubble-overridding-all-default-calloutProps_2018-01-25-20-30.json
new file mode 100644
index 0000000000000..902f1c77d9d40
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/Fix-TeachingBubble-overridding-all-default-calloutProps_2018-01-25-20-30.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add private _defaultCalloutProps instead of public defaultProps to set calloutProps.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-jojanz@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
index cc7c4cf1eeb6c..5d8c6162ec03f 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
@@ -4,7 +4,7 @@ import * as React from 'react';
 import { BaseComponent, css } from '../../Utilities';
 import { TeachingBubbleContent } from './TeachingBubbleContent';
 import { ITeachingBubbleProps } from './TeachingBubble.types';
-import { Callout } from '../../Callout';
+import { Callout, ICalloutProps } from '../../Callout';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import * as stylesImport from './TeachingBubble.scss';
 const styles: any = stylesImport;
@@ -14,28 +14,42 @@ export interface ITeachingBubbleState {
 }
 
 export class TeachingBubble extends BaseComponent<ITeachingBubbleProps, ITeachingBubbleState> {
-
-  // Specify default props values
   public static defaultProps = {
+    /**
+     * Default calloutProps is deprecated in favor of private _defaultCalloutProps.
+     * Remove in next release.
+     * @deprecated
+     */
     calloutProps: {
       beakWidth: 16,
       gapSpace: 0,
       setInitialFocus: true,
       doNotLayer: false,
-      directionalHint: DirectionalHint.rightCenter
+      directionalHint: DirectionalHint.rightCenter,
     }
   };
 
+  private _defaultCalloutProps: ICalloutProps;
+
   // Constructor
   constructor(props: ITeachingBubbleProps) {
     super(props);
 
     this.state = {
     };
+
+    this._defaultCalloutProps = {
+      beakWidth: 16,
+      gapSpace: 0,
+      setInitialFocus: true,
+      doNotLayer: false,
+      directionalHint: DirectionalHint.rightCenter,
+    };
   }
 
   public render() {
-    let { calloutProps, targetElement } = this.props;
+    let { calloutProps: setCalloutProps, targetElement } = this.props;
+    const calloutProps = { ...this._defaultCalloutProps, ...setCalloutProps };
 
     return (
       <Callout

From 071a6daa6867df57ab98affde613a3264ae62b88 Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Fri, 26 Jan 2018 14:14:04 -0800
Subject: [PATCH 1282/1641] Addressing Issue #1094 - Persona - onRenderCoin
 prop (#3799)

onRenderCoin prop that controls the image coin - with example
---
 ...persona-coin-or-1094_2018-01-26-17-44.json | 11 ++++
 .../src/components/Persona/Persona.tsx        |  6 +-
 .../src/components/Persona/Persona.types.ts   |  5 ++
 .../src/components/Persona/PersonaCoin.tsx    | 40 ++++++++++----
 .../src/components/Persona/PersonaPage.tsx    |  5 ++
 .../Persona.CustomCoinRender.Example.tsx      | 55 +++++++++++++++++++
 .../Persona/examples/PersonaExample.scss      |  8 ++-
 7 files changed, 115 insertions(+), 15 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/persona-coin-or-1094_2018-01-26-17-44.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomCoinRender.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/persona-coin-or-1094_2018-01-26-17-44.json b/common/changes/office-ui-fabric-react/persona-coin-or-1094_2018-01-26-17-44.json
new file mode 100644
index 0000000000000..ccbb0320b4cb8
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/persona-coin-or-1094_2018-01-26-17-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added onRenderCoin prop that controls the persona coin image",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index 60b85db742045..e9e34a8f28424 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -57,7 +57,8 @@ export class Persona extends BaseComponent<IPersonaProps, {}> {
       imageShouldFadeIn,
       imageShouldStartVisible,
       showSecondaryText,
-      onPhotoLoadingStateChange
+      onPhotoLoadingStateChange,
+      onRenderCoin
      } = this.props;
 
     let personaCoinProps = {
@@ -72,7 +73,8 @@ export class Persona extends BaseComponent<IPersonaProps, {}> {
       imageShouldFadeIn,
       imageShouldStartVisible,
       size,
-      onPhotoLoadingStateChange
+      onPhotoLoadingStateChange,
+      onRenderCoin
     };
 
     let divProps = getNativeProps(this.props, divProperties);
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts b/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts
index c91bde05791dc..78c8507daa729 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts
@@ -30,6 +30,11 @@ export interface IPersonaProps extends React.HTMLAttributes<Persona> {
    */
   size?: PersonaSize;
 
+  /**
+   * Optional custom renderer for the coin
+   */
+  onRenderCoin?: IRenderFunction<IPersonaProps>;
+
   /**
    * If true, adds the css class 'is-fadeIn' to the image.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
index 1d06b81762b5b..cce51e3fb0ba9 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
@@ -76,6 +76,7 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
       initialsColor,
       primaryText,
       imageShouldFadeIn,
+      onRenderCoin = this._onRenderCoin,
       onRenderInitials = this._onRenderInitials,
       imageShouldStartVisible
      } = this.props;
@@ -114,17 +115,7 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
                 </div>
               )
             }
-            <Image
-              className={ css('ms-Persona-image', styles.image) }
-              imageFit={ ImageFit.cover }
-              src={ imageUrl }
-              width={ coinSize || SIZE_TO_PIXELS[size] }
-              height={ coinSize || SIZE_TO_PIXELS[size] }
-              alt={ imageAlt }
-              shouldFadeIn={ imageShouldFadeIn }
-              shouldStartVisible={ imageShouldStartVisible }
-              onLoadingStateChange={ this._onPhotoLoadingStateChange }
-            />
+            { onRenderCoin(this.props, this._onRenderCoin) }
             <PersonaPresence { ...this.props } />
           </div>
         ) :
@@ -143,6 +134,33 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
     );
   }
 
+  @autobind
+  private _onRenderCoin(props: IPersonaProps): JSX.Element | null {
+    let {
+      coinSize,
+      imageUrl,
+      imageAlt,
+      imageShouldFadeIn,
+      imageShouldStartVisible
+    } = this.props;
+
+    let size = this.props.size as PersonaSize;
+
+    return(
+      <Image
+        className={ css('ms-Persona-image', styles.image) }
+        imageFit={ ImageFit.cover }
+        src={ imageUrl }
+        width={ coinSize || SIZE_TO_PIXELS[size] }
+        height={ coinSize || SIZE_TO_PIXELS[size] }
+        alt={ imageAlt }
+        shouldFadeIn={ imageShouldFadeIn }
+        shouldStartVisible={ imageShouldStartVisible }
+        onLoadingStateChange={ this._onPhotoLoadingStateChange }
+      />
+    );
+  }
+
   @autobind
   private _onRenderInitials(props: IPersonaProps): JSX.Element {
     let {
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
index ac98fabba9ed2..bcadebf3bbf87 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
@@ -9,6 +9,7 @@ import { PersonaInitialsExample } from './examples/Persona.Initials.Example';
 import { PersonaBasicExample } from './examples/Persona.Basic.Example';
 import { PersonaAlternateExample } from './examples/Persona.Alternate.Example';
 import { PersonaCustomRenderExample } from './examples/Persona.CustomRender.Example';
+import { PersonaCustomCoinRenderExample } from './examples/Persona.CustomCoinRender.Example';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { PersonaStatus } from './Persona.checklist';
 
@@ -16,6 +17,7 @@ const PersonaInitialsExampleCode = require('!raw-loader!office-ui-fabric-react/s
 const PersonaBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx') as string;
 const PersonaAlternateExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Persona/examples/Persona.Alternate.Example.tsx') as string;
 const PersonaCustomRenderExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx') as string;
+const PersonaCustomCoinRenderExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Persona/examples/Persona.CustomCoinRender.Example.tsx') as string;
 
 export class PersonaPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
@@ -37,6 +39,9 @@ export class PersonaPage extends React.Component<IComponentDemoPageProps, {}> {
             <ExampleCard title='Rendering custom persona text' code={ PersonaCustomRenderExampleCode }>
               <PersonaCustomRenderExample />
             </ExampleCard>
+            <ExampleCard title='Rendering custom coin' code={ PersonaCustomCoinRenderExampleCode }>
+              <PersonaCustomCoinRenderExample />
+            </ExampleCard>
           </div>
         }
         propertiesTables={
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomCoinRender.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomCoinRender.Example.tsx
new file mode 100644
index 0000000000000..ce7618c9e61e1
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomCoinRender.Example.tsx
@@ -0,0 +1,55 @@
+import * as React from 'react';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+import {
+  IPersonaProps,
+  Persona,
+  PersonaSize,
+  PersonaPresence
+} from 'office-ui-fabric-react/lib/Persona';
+import { Icon } from 'office-ui-fabric-react/lib/Icon';
+import { TestImages } from '../../../common/TestImages';
+import './PersonaExample.scss';
+import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
+const exampleStyles: any = exampleStylesImport;
+
+const examplePersona = {
+  imageUrl: TestImages.personaMale,
+  imageInitials: 'TR',
+  primaryText: 'Ted Randall',
+  secondaryText: 'Project Manager',
+  optionalText: 'Available at 4:00pm'
+};
+
+export class PersonaCustomCoinRenderExample extends React.Component {
+
+  public render() {
+    return (
+      <div className='ms-PersonaExample'>
+        <div className={ exampleStyles.exampleLabel }>Custom functional element in place of persona coin's image</div>
+        <Persona
+          { ...examplePersona }
+          size={ PersonaSize.size72 }
+          presence={ PersonaPresence.online }
+          onRenderCoin={ this._onRenderCoin }
+          imageAlt={ 'Custom Coin Image' }
+          coinSize={ 72 }
+        />
+      </div>
+    );
+  }
+
+  @autobind
+  private _onRenderCoin(props: IPersonaProps): JSX.Element {
+    let {
+      coinSize,
+      imageUrl,
+      imageAlt,
+    } = props;
+
+    return (
+      <div className='customExampleCoin'>
+        <img src={ imageUrl } alt={ imageAlt } width={ coinSize } height={ coinSize } />
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/PersonaExample.scss b/packages/office-ui-fabric-react/src/components/Persona/examples/PersonaExample.scss
index 3f6089366153c..7cb40a69d43f2 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/PersonaExample.scss
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/PersonaExample.scss
@@ -7,7 +7,11 @@
     margin-right: 5px;
   }
 
-  .example-label {
+  .exampleLabel {
     margin: 10px 0;
   }
-}
\ No newline at end of file
+
+  .customExampleCoin img {
+    border-radius: 20px;
+  }
+}

From 048cf3af397658b628b7495c6ef7354b49147f22 Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Fri, 26 Jan 2018 17:04:38 -0800
Subject: [PATCH 1283/1641] Callout: Fix scrollbar (#3820)

* Fix the callout having an overflow when it shouldn't

* Minor fixes
---
 .../fix-callout-scrollbar_2018-01-26-22-47.json       | 11 +++++++++++
 .../src/components/Callout/CalloutContent.base.tsx    |  7 +++++--
 .../src/components/Popup/Popup.tsx                    |  2 +-
 3 files changed, 17 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-callout-scrollbar_2018-01-26-22-47.json

diff --git a/common/changes/office-ui-fabric-react/fix-callout-scrollbar_2018-01-26-22-47.json b/common/changes/office-ui-fabric-react/fix-callout-scrollbar_2018-01-26-22-47.json
new file mode 100644
index 0000000000000..01ba7f556116c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-callout-scrollbar_2018-01-26-22-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Callout/Popup: Fix a bug where callout doesn't have the correct overflow style\"",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
index 9ecce2d43dd3e..de0022878e027 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
@@ -132,12 +132,13 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
       backgroundColor,
       calloutMaxHeight,
       onScroll,
-       } = this.props;
+    } = this.props;
     target = this._getTarget();
     let { positions } = this.state;
 
     let getContentMaxHeight: number = this._getMaxHeight() + this.state.heightOffset!;
     let contentMaxHeight: number = calloutMaxHeight! && (calloutMaxHeight! < getContentMaxHeight) ? calloutMaxHeight! : getContentMaxHeight!;
+    const overflowYHidden = !!finalHeight;
 
     let beakVisible = isBeakVisible && (!!target);
     this._classNames = getClassNames(
@@ -145,7 +146,7 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
       {
         theme: this.props.theme!,
         className,
-        overflowYHidden: !!finalHeight,
+        overflowYHidden: overflowYHidden,
         calloutWidth,
         contentMaxHeight,
         positions,
@@ -155,6 +156,7 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
       }
     );
 
+    const overflowStyle: React.CSSProperties = overflowYHidden ? { overflowY: 'hidden' } : {};
     let content = (
       <div
         ref={ this._resolveRef('_hostElement') }
@@ -182,6 +184,7 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
             onDismiss={ this.dismiss }
             onScroll={ onScroll }
             shouldRestoreFocus={ true }
+            style={ overflowStyle }
           >
             { children }
           </Popup>
diff --git a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
index d430613b34288..23cd996751eda 100644
--- a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
+++ b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
@@ -72,7 +72,7 @@ export class Popup extends BaseComponent<IPopupProps, {}> {
         aria-labelledby={ ariaLabelledBy }
         aria-describedby={ ariaDescribedBy }
         onKeyDown={ this._onKeyDown }
-        style={ { ...style, overflowY: needsVerticalScrollBar ? 'scroll' : 'auto' } }
+        style={ { overflowY: needsVerticalScrollBar ? 'scroll' : 'auto', ...style } }
       >
         { this.props.children }
       </div>

From c91e28996fc74eff98bbb3c59426e8f6f159e64f Mon Sep 17 00:00:00 2001
From: John Lorenz <jcl47@duke.edu>
Date: Fri, 26 Jan 2018 18:24:20 -0800
Subject: [PATCH 1284/1641] Jolore/adding work week date range (#3784)

* adding new work week date range type

* adding the work week type, adding the highlighting and selecting logic of work week, adding date range selection unit test for DateMath for work week

* adding npm change files, updating default for the datemath utility

* changing selectableDaysOfWeek to workWeekDays, adding comment noting that the property does nothing if not in WorkWeek view
---
 ...ingWorkWeekDateRange_2018-01-24-01-39.json | 11 +++++++
 ...ingWorkWeekDateRange_2018-01-24-01-39.json | 11 +++++++
 ...ingWorkWeekDateRange_2018-01-24-01-39.json | 11 +++++++
 ...ingWorkWeekDateRange_2018-01-24-01-39.json | 11 +++++++
 ...ingWorkWeekDateRange_2018-01-24-01-39.json | 11 +++++++
 ...ingWorkWeekDateRange_2018-01-24-01-39.json | 11 +++++++
 ...ingWorkWeekDateRange_2018-01-24-01-39.json | 11 +++++++
 .../src/components/Calendar/Calendar.tsx      | 13 ++++++--
 .../src/components/Calendar/Calendar.types.ts |  6 ++++
 .../src/components/Calendar/CalendarDay.tsx   | 32 +++++++++++++++----
 .../src/components/Calendar/CalendarPage.tsx  | 16 ++++++++--
 .../examples/Calendar.Inline.Example.tsx      |  5 ++-
 .../src/utilities/dateMath/DateMath.test.ts   | 31 ++++++++++++++++--
 .../src/utilities/dateMath/DateMath.ts        | 26 +++++++++++----
 .../src/utilities/dateValues/DateValues.ts    |  3 +-
 15 files changed, 188 insertions(+), 21 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
 create mode 100644 common/changes/@uifabric/experiments/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
 create mode 100644 common/changes/@uifabric/fabric-website/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
 create mode 100644 common/changes/@uifabric/file-type-icons/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
 create mode 100644 common/changes/@uifabric/icons/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
 create mode 100644 common/changes/@uifabric/utilities/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
 create mode 100644 common/changes/office-ui-fabric-react/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json

diff --git a/common/changes/@uifabric/example-app-base/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json b/common/changes/@uifabric/example-app-base/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
new file mode 100644
index 0000000000000..9401437d55539
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "jolore@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json b/common/changes/@uifabric/experiments/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
new file mode 100644
index 0000000000000..09eb2e90aad09
--- /dev/null
+++ b/common/changes/@uifabric/experiments/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/experiments",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "jolore@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json b/common/changes/@uifabric/fabric-website/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
new file mode 100644
index 0000000000000..6218fcd512b73
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "jolore@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/file-type-icons/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json b/common/changes/@uifabric/file-type-icons/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
new file mode 100644
index 0000000000000..b8195d1db67c5
--- /dev/null
+++ b/common/changes/@uifabric/file-type-icons/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/file-type-icons",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/file-type-icons",
+  "email": "jolore@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json b/common/changes/@uifabric/icons/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
new file mode 100644
index 0000000000000..d0c42de74e742
--- /dev/null
+++ b/common/changes/@uifabric/icons/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/icons",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/icons",
+  "email": "jolore@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json b/common/changes/@uifabric/utilities/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
new file mode 100644
index 0000000000000..c94b3730708e9
--- /dev/null
+++ b/common/changes/@uifabric/utilities/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Add work week date range type and update date math getDateRangeArray to consume it, add unit tests",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "jolore@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json b/common/changes/office-ui-fabric-react/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
new file mode 100644
index 0000000000000..cb855df8031fd
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add work week date range type and update calendar and calendarDay components to consume it",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jolore@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index 7705e3f1b6b82..5f0f764c59289 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -19,6 +19,13 @@ let iconStrings: ICalendarIconStrings = {
   leftNavigation: leftArrow,
   rightNavigation: rightArrow
 };
+let defaultWorkWeekDays: DayOfWeek[] = [
+  DayOfWeek.Monday,
+  DayOfWeek.Tuesday,
+  DayOfWeek.Wednesday,
+  DayOfWeek.Thursday,
+  DayOfWeek.Friday,
+];
 
 let dateTimeFormatterCallbacks: ICalendarFormatDateCallbacks = {
   formatMonthDayYear: (date: Date, strings: ICalendarStrings) => (strings.months[date.getMonth()] + ' ' + date.getDate() + ', ' + date.getFullYear()),
@@ -61,6 +68,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     firstWeekOfYear: FirstWeekOfYear.FirstDay,
     dateTimeFormatter: dateTimeFormatterCallbacks,
     showSixWeeksByDefault: false,
+    workWeekDays: defaultWorkWeekDays
   };
 
   public refs: {
@@ -161,6 +169,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   showSixWeeksByDefault={ this.props.showSixWeeksByDefault }
                   minDate={ minDate }
                   maxDate={ maxDate }
+                  workWeekDays={ this.props.workWeekDays }
                   ref='dayPicker'
                 />
                 }
@@ -251,9 +260,9 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
   @autobind
   private _onGotoToday() {
 
-    let { dateRangeType, firstDayOfWeek, today } = this.props;
+    let { dateRangeType, firstDayOfWeek, today, workWeekDays } = this.props;
 
-    let dates = getDateRangeArray(today!, dateRangeType!, firstDayOfWeek!);
+    let dates = getDateRangeArray(today!, dateRangeType!, firstDayOfWeek!, workWeekDays!);
 
     this._onSelectDate(today!, dates);
 
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.types.ts b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.types.ts
index 39546d9ed67e9..a833fe1adc7a9 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.types.ts
@@ -138,6 +138,12 @@ export interface ICalendarProps extends React.Props<Calendar> {
   * @defaultvalue false
   */
   showSixWeeksByDefault?: boolean;
+
+  /**
+   * The days that are selectable when dateRangeType is WorkWeek. If dateRangeType is not WorkWeek this property does nothing.
+   * @defaultvalue [Monday,Tuesday,Wednesday,Thursday,Friday]
+   */
+  workWeekDays?: DayOfWeek[];
 }
 
 export interface ICalendarStrings {
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index 37cc999b89105..04d6d747decbb 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -63,6 +63,7 @@ export interface ICalendarDayProps extends React.Props<CalendarDay> {
   showSixWeeksByDefault?: boolean;
   minDate?: Date;
   maxDate?: Date;
+  workWeekDays?: DayOfWeek[];
 }
 
 export interface ICalendarDayState {
@@ -239,7 +240,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
                       key={ day.key }
                       className={ css(
                         {
-                          ['ms-DatePicker-weekBackground ' + styles.weekBackground]: day.isSelected && dateRangeType === DateRangeType.Week,
+                          ['ms-DatePicker-weekBackground ' + styles.weekBackground]: day.isSelected && (dateRangeType === DateRangeType.Week || dateRangeType === DateRangeType.WorkWeek),
                           ['ms-DatePicker-monthBackground ' + styles.monthBackground + ' ' + this._getHighlightedCornerStyle(weekCorners, dayIndex, weekIndex)]: day.isInMonth && day.isSelected && dateRangeType === DateRangeType.Month,
                           ['ms-DatePicker-dayBackground ' + styles.dayBackground]: day.isSelected && dateRangeType === DateRangeType.Day
                         }) }
@@ -416,9 +417,18 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
 
   @autobind
   private _onSelectDate(selectedDate: Date) {
-    let { onSelectDate, dateRangeType, firstDayOfWeek, navigatedDate, autoNavigateOnSelection, minDate, maxDate } = this.props;
-
-    let dateRange = getDateRangeArray(selectedDate, dateRangeType, firstDayOfWeek);
+    let {
+      onSelectDate,
+      dateRangeType,
+      firstDayOfWeek,
+      navigatedDate,
+      autoNavigateOnSelection,
+      minDate,
+      maxDate,
+      workWeekDays
+    } = this.props;
+
+    let dateRange = getDateRangeArray(selectedDate, dateRangeType, firstDayOfWeek, workWeekDays);
     if (dateRangeType !== DateRangeType.Day) {
       dateRange = this._getBoundedDateRange(dateRange, minDate, maxDate);
     }
@@ -475,7 +485,17 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
   }
 
   private _getWeeks(propsToUse: ICalendarDayProps): IDayInfo[][] {
-    let { navigatedDate, selectedDate, dateRangeType, firstDayOfWeek, today, minDate, maxDate, showSixWeeksByDefault } = propsToUse;
+    let {
+      navigatedDate,
+      selectedDate,
+      dateRangeType,
+      firstDayOfWeek,
+      today,
+      minDate,
+      maxDate,
+      showSixWeeksByDefault,
+      workWeekDays
+    } = propsToUse;
     let date = new Date(navigatedDate.getFullYear(), navigatedDate.getMonth(), 1);
     let todaysDate = today || new Date();
     let weeks: IDayInfo[][] = [];
@@ -488,7 +508,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
     // a flag to indicate whether all days of the week are in the month
     let isAllDaysOfWeekOutOfMonth = false;
 
-    let selectedDates = getDateRangeArray(selectedDate, dateRangeType, firstDayOfWeek);
+    let selectedDates = getDateRangeArray(selectedDate, dateRangeType, firstDayOfWeek, workWeekDays);
     if (dateRangeType !== DateRangeType.Day) {
       selectedDates = this._getBoundedDateRange(selectedDates, minDate, maxDate);
     }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
index ce080fbc14e02..b360902469275 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarPage.tsx
@@ -5,7 +5,7 @@ import {
   IComponentDemoPageProps,
   PropertiesTableSet
 } from '@uifabric/example-app-base';
-import { DateRangeType } from 'office-ui-fabric-react/lib/Calendar';
+import { DateRangeType, DayOfWeek } from 'office-ui-fabric-react/lib/Calendar';
 import { CalendarButtonExample } from './examples/Calendar.Button.Example';
 import { CalendarInlineExample } from './examples/Calendar.Inline.Example';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
@@ -116,7 +116,19 @@ export class CalendarPage extends React.Component<IComponentDemoPageProps, any>
                 minDate={ addMonths(today, -1) }
                 maxDate={ addYears(today, 1) }
               />
-
+            </ExampleCard>
+            <ExampleCard
+              title='Calendar with selectableDays = [Tuesday, Wednesday, Friday, Saturday] provided, first day of week = Monday'
+              code={ CalendarButtonExampleCode }
+            >
+              <CalendarInlineExample
+                dateRangeType={ DateRangeType.WorkWeek }
+                firstDayOfWeek={ DayOfWeek.Monday }
+                autoNavigateOnSelection={ true }
+                highlightCurrentMonth={ true }
+                showGoToToday={ true }
+                workWeekDays={ [DayOfWeek.Tuesday, DayOfWeek.Saturday, DayOfWeek.Wednesday, DayOfWeek.Friday] }
+              />
             </ExampleCard>
             <ExampleCard
               title='Calendar launched from a button'
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
index 94223d222cdcd..9ea7ba10d71d1 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
@@ -79,6 +79,8 @@ export interface ICalendarInlineExampleProps {
   minDate?: Date;
   maxDate?: Date;
   showSixWeeksByDefault?: boolean;
+  workWeekDays?: DayOfWeek[];
+  firstDayOfWeek?: DayOfWeek;
 }
 
 export class CalendarInlineExample extends React.Component<ICalendarInlineExampleProps, ICalendarInlineExampleState> {
@@ -135,7 +137,7 @@ export class CalendarInlineExample extends React.Component<ICalendarInlineExampl
           autoNavigateOnSelection={ this.props.autoNavigateOnSelection }
           showGoToToday={ this.props.showGoToToday }
           value={ this.state.selectedDate! }
-          firstDayOfWeek={ DayOfWeek.Sunday }
+          firstDayOfWeek={ this.props.firstDayOfWeek ? this.props.firstDayOfWeek : DayOfWeek.Sunday }
           strings={ DayPickerStrings }
           highlightCurrentMonth={ this.props.highlightCurrentMonth }
           isDayPickerVisible={ this.props.isDayPickerVisible }
@@ -144,6 +146,7 @@ export class CalendarInlineExample extends React.Component<ICalendarInlineExampl
           minDate={ this.props.minDate }
           maxDate={ this.props.maxDate }
           showSixWeeksByDefault={ this.props.showSixWeeksByDefault }
+          workWeekDays={ this.props.workWeekDays }
         />
         { this.props.showNavigateButtons &&
           <div>
diff --git a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts
index b4ff299dcc3ac..e6ac56c83b57e 100644
--- a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts
+++ b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts
@@ -279,12 +279,39 @@ describe('DateMath', () => {
     // Date range: week
     let expectedDates = Array(7).map((val, i) => new Date(2017, 2, 12 + i));
     dateRangeArray = DateMath.getDateRangeArray(date, DateRangeType.Week, DayOfWeek.Sunday);
-    Array(7).forEach((val, i) => expect(DateMath.compareDates(dateRangeArray[i], date)).toBe(true));
+    Array(7).forEach((val, i) => expect(DateMath.compareDates(dateRangeArray[i], expectedDates[i])).toBe(true));
+
+    // Date range: work week
+    let workWeekDays = [
+      DayOfWeek.Monday,
+      DayOfWeek.Tuesday,
+      DayOfWeek.Thursday,
+      DayOfWeek.Friday
+    ];
+    expectedDates = [
+      new Date(2017, 2, 13),
+      new Date(2017, 2, 14),
+      new Date(2017, 2, 16),
+      new Date(2017, 2, 17),
+    ];
+    dateRangeArray = DateMath.getDateRangeArray(date, DateRangeType.Week, DayOfWeek.Sunday, workWeekDays);
+    Array(4).forEach((val, i) => expect(DateMath.compareDates(dateRangeArray[i], expectedDates[i])).toBe(true));
+
+    // work week defaults
+    expectedDates = [
+      new Date(2017, 2, 13),
+      new Date(2017, 2, 14),
+      new Date(2017, 2, 15),
+      new Date(2017, 2, 16),
+      new Date(2017, 2, 17),
+    ];
+    dateRangeArray = DateMath.getDateRangeArray(date, DateRangeType.Week, DayOfWeek.Sunday);
+    Array(4).forEach((val, i) => expect(DateMath.compareDates(dateRangeArray[i], expectedDates[i])).toBe(true));
 
     // Date range: month
     expectedDates = Array(31).map((val, i) => new Date(2017, 2, 1 + i));
     dateRangeArray = DateMath.getDateRangeArray(date, DateRangeType.Month, DayOfWeek.Sunday);
-    Array(31).forEach((val, i) => expect(DateMath.compareDates(dateRangeArray[i], date)).toBe(true));
+    Array(31).forEach((val, i) => expect(DateMath.compareDates(dateRangeArray[i], expectedDates[i])).toBe(true));
 
     // First day of week: Tuesday
     expectedDates = Array(7).map((val, i) => new Date(2017, 2, 14 + i));
diff --git a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
index 933e51b82f2b4..8e45f1af1cd7c 100644
--- a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
+++ b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
@@ -147,14 +147,19 @@ export function compareDatePart(date1: Date, date2: Date): Number {
  * of dates accounting for the specified first day of the week and date range type.
  * @param {Date} date - The input date
  * @param {DateRangeType} dateRangeType - The desired date range type, i.e., day, week, month, etc.
- * @param {DayOfWeek} dayOfWeek - The first day of the week.
+ * @param {DayOfWeek} firstDayOfWeek - The first day of the week.
+ * @param {DayOfWeek[]} workWeekDays - The allowed days in work week. If not provided, assumes all days are allowed.
  * @returns {Date[]} An array of dates representing the date range containing the specified date.
  */
-export function getDateRangeArray(date: Date, dateRangeType: DateRangeType, firstDayOfWeek: DayOfWeek): Date[] {
+export function getDateRangeArray(date: Date, dateRangeType: DateRangeType, firstDayOfWeek: DayOfWeek, workWeekDays?: DayOfWeek[]): Date[] {
   let datesArray = new Array<Date>();
   let startDate: Date;
   let endDate = null;
 
+  if (!workWeekDays) {
+    workWeekDays = [DayOfWeek.Monday, DayOfWeek.Tuesday, DayOfWeek.Wednesday, DayOfWeek.Thursday, DayOfWeek.Friday];
+  }
+
   switch (dateRangeType) {
     case DateRangeType.Day:
       startDate = getDatePart(date);
@@ -162,6 +167,7 @@ export function getDateRangeArray(date: Date, dateRangeType: DateRangeType, firs
       break;
 
     case DateRangeType.Week:
+    case DateRangeType.WorkWeek:
       startDate = getStartDateOfWeek(getDatePart(date), firstDayOfWeek);
       endDate = addDays(startDate, TimeConstants.DaysInOneWeek);
       break;
@@ -170,17 +176,23 @@ export function getDateRangeArray(date: Date, dateRangeType: DateRangeType, firs
       startDate = new Date(date.getFullYear(), date.getMonth(), 1);
       endDate = addMonths(startDate, 1);
       break;
+
     default:
       return assertNever(dateRangeType);
   }
 
   // Populate the dates array with the dates in range
-  datesArray.push(startDate);
-  let nextDate = addDays(startDate, 1);
-  while (!compareDates(nextDate, endDate)) {
-    datesArray.push(nextDate);
+  let nextDate = startDate;
+
+  do {
+    if (dateRangeType !== DateRangeType.WorkWeek) {
+      // push all days not in work week view
+      datesArray.push(nextDate);
+    } else if (workWeekDays.includes(nextDate.getDay())) {
+      datesArray.push(nextDate);
+    }
     nextDate = addDays(nextDate, 1);
-  }
+  } while (!compareDates(nextDate, endDate));
 
   return datesArray;
 }
diff --git a/packages/office-ui-fabric-react/src/utilities/dateValues/DateValues.ts b/packages/office-ui-fabric-react/src/utilities/dateValues/DateValues.ts
index 02df413075506..f22c53ecec648 100644
--- a/packages/office-ui-fabric-react/src/utilities/dateValues/DateValues.ts
+++ b/packages/office-ui-fabric-react/src/utilities/dateValues/DateValues.ts
@@ -44,5 +44,6 @@ export enum FirstWeekOfYear {
 export enum DateRangeType {
   Day = 0,
   Week = 1,
-  Month = 2
+  Month = 2,
+  WorkWeek = 3,
 }

From d00fd3f2175aaaa0bf9f2a9861ae237a20f12112 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 29 Jan 2018 03:23:41 -0800
Subject: [PATCH 1285/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...enuPropsToCommandBar_2018-01-26-21-02.json | 11 -----
 ...ingWorkWeekDateRange_2018-01-24-01-39.json | 11 -----
 ...ingWorkWeekDateRange_2018-01-24-01-39.json | 11 -----
 ...eshpande-icon-update_2018-01-24-23-44.json | 11 -----
 ...ingWorkWeekDateRange_2018-01-24-01-39.json | 11 -----
 ...default-calloutProps_2018-01-25-20-30.json | 11 -----
 ...chiechan-checkboxAcc_2018-01-17-19-40.json | 11 -----
 ...ix-callout-scrollbar_2018-01-26-22-47.json | 11 -----
 ...ix-peoplepicker-coin_2018-01-26-19-16.json | 11 -----
 ...ingWorkWeekDateRange_2018-01-24-01-39.json | 11 -----
 ...persona-coin-or-1094_2018-01-26-17-44.json | 11 -----
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/CHANGELOG.json           | 22 +++++++++
 packages/experiments/CHANGELOG.md             |  9 +++-
 packages/experiments/package.json             |  6 +--
 packages/icons/CHANGELOG.json                 | 14 ++++++
 packages/icons/CHANGELOG.md                   |  9 +++-
 packages/icons/package.json                   |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 49 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 17 ++++++-
 packages/office-ui-fabric-react/package.json  |  8 +--
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 ++++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  2 +-
 30 files changed, 155 insertions(+), 141 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/addOverflowMenuPropsToCommandBar_2018-01-26-21-02.json
 delete mode 100644 common/changes/@uifabric/experiments/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
 delete mode 100644 common/changes/@uifabric/icons/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
 delete mode 100644 common/changes/@uifabric/icons/srideshpande-icon-update_2018-01-24-23-44.json
 delete mode 100644 common/changes/@uifabric/utilities/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
 delete mode 100644 common/changes/office-ui-fabric-react/Fix-TeachingBubble-overridding-all-default-calloutProps_2018-01-25-20-30.json
 delete mode 100644 common/changes/office-ui-fabric-react/chiechan-checkboxAcc_2018-01-17-19-40.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-callout-scrollbar_2018-01-26-22-47.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-peoplepicker-coin_2018-01-26-19-16.json
 delete mode 100644 common/changes/office-ui-fabric-react/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
 delete mode 100644 common/changes/office-ui-fabric-react/persona-coin-or-1094_2018-01-26-17-44.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 5a55297797fcf..33b2fa9b7bbe4 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.43.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.44.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 53851a9323ee9..c22ac333322ad 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.43.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.44.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 9e3687895fd0a..65de7f3ec1b14 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.43.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.44.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 5b133efbcb69e..629d2e47755b9 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.43.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.44.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index c4aa79a423433..73f303bc448ff 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.43.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.44.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/@uifabric/experiments/addOverflowMenuPropsToCommandBar_2018-01-26-21-02.json b/common/changes/@uifabric/experiments/addOverflowMenuPropsToCommandBar_2018-01-26-21-02.json
deleted file mode 100644
index d7afb469163a0..0000000000000
--- a/common/changes/@uifabric/experiments/addOverflowMenuPropsToCommandBar_2018-01-26-21-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Add overflowMenuProps to Experiments CommandBar",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "staylo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json b/common/changes/@uifabric/experiments/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
deleted file mode 100644
index 09eb2e90aad09..0000000000000
--- a/common/changes/@uifabric/experiments/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/experiments",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "jolore@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json b/common/changes/@uifabric/icons/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
deleted file mode 100644
index d0c42de74e742..0000000000000
--- a/common/changes/@uifabric/icons/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/icons",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/icons",
-  "email": "jolore@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/srideshpande-icon-update_2018-01-24-23-44.json b/common/changes/@uifabric/icons/srideshpande-icon-update_2018-01-24-23-44.json
deleted file mode 100644
index 6fcb96111e0eb..0000000000000
--- a/common/changes/@uifabric/icons/srideshpande-icon-update_2018-01-24-23-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/icons",
-      "comment": "Updating fabric icons in office-ui-fabric-react's  @uifabric/icons package",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/icons",
-  "email": "srdeshpa@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json b/common/changes/@uifabric/utilities/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
deleted file mode 100644
index c94b3730708e9..0000000000000
--- a/common/changes/@uifabric/utilities/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Add work week date range type and update date math getDateRangeArray to consume it, add unit tests",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "jolore@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/Fix-TeachingBubble-overridding-all-default-calloutProps_2018-01-25-20-30.json b/common/changes/office-ui-fabric-react/Fix-TeachingBubble-overridding-all-default-calloutProps_2018-01-25-20-30.json
deleted file mode 100644
index 902f1c77d9d40..0000000000000
--- a/common/changes/office-ui-fabric-react/Fix-TeachingBubble-overridding-all-default-calloutProps_2018-01-25-20-30.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add private _defaultCalloutProps instead of public defaultProps to set calloutProps.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-jojanz@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/chiechan-checkboxAcc_2018-01-17-19-40.json b/common/changes/office-ui-fabric-react/chiechan-checkboxAcc_2018-01-17-19-40.json
deleted file mode 100644
index b0685324f8ef1..0000000000000
--- a/common/changes/office-ui-fabric-react/chiechan-checkboxAcc_2018-01-17-19-40.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Combox box: added accessibility changes added a title and changed activedescendant to use focused element",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chiechan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-callout-scrollbar_2018-01-26-22-47.json b/common/changes/office-ui-fabric-react/fix-callout-scrollbar_2018-01-26-22-47.json
deleted file mode 100644
index 01ba7f556116c..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-callout-scrollbar_2018-01-26-22-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Callout/Popup: Fix a bug where callout doesn't have the correct overflow style\"",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-peoplepicker-coin_2018-01-26-19-16.json b/common/changes/office-ui-fabric-react/fix-peoplepicker-coin_2018-01-26-19-16.json
deleted file mode 100644
index 96563b214ec1e..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-peoplepicker-coin_2018-01-26-19-16.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "setting people picker default size back to 28 from 24",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json b/common/changes/office-ui-fabric-react/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
deleted file mode 100644
index cb855df8031fd..0000000000000
--- a/common/changes/office-ui-fabric-react/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add work week date range type and update calendar and calendarDay components to consume it",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jolore@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/persona-coin-or-1094_2018-01-26-17-44.json b/common/changes/office-ui-fabric-react/persona-coin-or-1094_2018-01-26-17-44.json
deleted file mode 100644
index ccbb0320b4cb8..0000000000000
--- a/common/changes/office-ui-fabric-react/persona-coin-or-1094_2018-01-26-17-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added onRenderCoin prop that controls the persona coin image",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index e79c249fafdc2..2bf696bc634db 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.17.0 <6.0.0",
-    "@uifabric/utilities": ">=5.8.0 <6.0.0",
+    "@uifabric/utilities": ">=5.9.0 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index e34fdcc808095..e5582341dab05 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.16.0",
+      "tag": "@uifabric/experiments_v5.16.0",
+      "date": "Mon, 29 Jan 2018 11:23:40 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "staylo8 <33881401+staylo8@users.noreply.github.com>",
+            "commit": "e2487c7a2bbf513b47f4f5694180b56e1f6a4ed1",
+            "comment": "Add overflowMenuProps to Experiments CommandBar"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.43.0 <6.0.0` to `>=5.44.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/icons\" from `>=5.4.0 <6.0.0` to `>=5.4.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.15.0",
       "tag": "@uifabric/experiments_v5.15.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index cefb05b7c5207..7ae6ef6c9c2d7 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Thu, 25 Jan 2018 11:23:06 GMT and should not be manually modified.
+This log was last generated on Mon, 29 Jan 2018 11:23:40 GMT and should not be manually modified.
+
+## 5.16.0
+Mon, 29 Jan 2018 11:23:40 GMT
+
+### Minor changes
+
+- Add overflowMenuProps to Experiments CommandBar
 
 ## 5.15.0
 Thu, 25 Jan 2018 11:23:06 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 12af911d5e289..f16047b79e605 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.15.0",
+  "version": "5.16.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,8 +44,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.43.0 <6.0.0",
-    "@uifabric/icons": ">=5.4.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.44.0 <6.0.0",
+    "@uifabric/icons": ">=5.4.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/icons/CHANGELOG.json b/packages/icons/CHANGELOG.json
index 458594bab786f..b77224eddf7cf 100644
--- a/packages/icons/CHANGELOG.json
+++ b/packages/icons/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/icons",
   "entries": [
+    {
+      "version": "5.4.1",
+      "tag": "@uifabric/icons_v5.4.1",
+      "date": "Mon, 29 Jan 2018 11:23:40 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Srikanth Deshpande <srideshpande@users.noreply.github.com>",
+            "commit": "25129e761bc4463160015d5282c82f66aad99174",
+            "comment": "Updating fabric icons in office-ui-fabric-react's  @uifabric/icons package"
+          }
+        ]
+      }
+    },
     {
       "version": "5.4.0",
       "tag": "@uifabric/icons_v5.4.0",
diff --git a/packages/icons/CHANGELOG.md b/packages/icons/CHANGELOG.md
index a6cb3ad141863..41811b8733de0 100644
--- a/packages/icons/CHANGELOG.md
+++ b/packages/icons/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/icons
 
-This log was last generated on Wed, 03 Jan 2018 11:23:12 GMT and should not be manually modified.
+This log was last generated on Mon, 29 Jan 2018 11:23:40 GMT and should not be manually modified.
+
+## 5.4.1
+Mon, 29 Jan 2018 11:23:40 GMT
+
+### Patches
+
+- Updating fabric icons in office-ui-fabric-react's  @uifabric/icons package
 
 ## 5.4.0
 Wed, 03 Jan 2018 11:23:12 GMT
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 8875ad706dc1e..7b87ae1fe5dcb 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/icons",
-  "version": "5.4.0",
+  "version": "5.4.1",
   "description": "Office UI Fabric icon set.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 1c1914e842872..484c1e1520e47 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,55 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.44.0",
+      "tag": "office-ui-fabric-react_v5.44.0",
+      "date": "Mon, 29 Jan 2018 11:23:40 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "chang47 <coralbue@gmail.com>",
+            "commit": "58615e57bf5698dc425d8c825163697b26303243",
+            "comment": "Combox box: added accessibility changes added a title and changed activedescendant to use focused element"
+          },
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "048cf3af397658b628b7495c6ef7354b49147f22",
+            "comment": "Callout/Popup: Fix a bug where callout doesn't have the correct overflow style\""
+          },
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "9d785c7971d56222ec9cbb72d5d624fa8209718c",
+            "comment": "setting people picker default size back to 28 from 24"
+          },
+          {
+            "author": "Jordan Janzen <jordancjanzen@gmail.com>",
+            "commit": "4b472acc791f1b1d22b95e2ea48c6538aae94573",
+            "comment": "Add private _defaultCalloutProps instead of public defaultProps to set calloutProps."
+          }
+        ],
+        "minor": [
+          {
+            "author": "John Lorenz <jcl47@duke.edu>",
+            "commit": "c91e28996fc74eff98bbb3c59426e8f6f159e64f",
+            "comment": "Add work week date range type and update calendar and calendarDay components to consume it"
+          },
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "071a6daa6867df57ab98affde613a3264ae62b88",
+            "comment": "Added onRenderCoin prop that controls the persona coin image"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/icons\" from `>=5.4.0 <6.0.0` to `>=5.4.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.8.0 <6.0.0` to `>=5.9.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.43.1",
       "tag": "office-ui-fabric-react_v5.43.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index b582149e31418..57250c6aa570a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,21 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 26 Jan 2018 11:25:22 GMT and should not be manually modified.
+This log was last generated on Mon, 29 Jan 2018 11:23:40 GMT and should not be manually modified.
+
+## 5.44.0
+Mon, 29 Jan 2018 11:23:40 GMT
+
+### Minor changes
+
+- Add work week date range type and update calendar and calendarDay components to consume it
+- Added onRenderCoin prop that controls the persona coin image
+
+### Patches
+
+- Combox box: added accessibility changes added a title and changed activedescendant to use focused element
+- Callout/Popup: Fix a bug where callout doesn't have the correct overflow style"
+- setting people picker default size back to 28 from 24
+- Add private _defaultCalloutProps instead of public defaultProps to set calloutProps.
 
 ## 5.43.1
 Fri, 26 Jan 2018 11:25:22 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 758ce36787175..ce36104a6bbba 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.43.1",
+  "version": "5.44.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -48,10 +48,10 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/icons": ">=5.4.0 <6.0.0",
+    "@uifabric/icons": ">=5.4.1 <6.0.0",
     "@uifabric/merge-styles": ">=5.11.0 <6.0.0",
     "@uifabric/styling": ">=5.17.0 <6.0.0",
-    "@uifabric/utilities": ">=5.8.0 <6.0.0",
+    "@uifabric/utilities": ">=5.9.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
@@ -59,4 +59,4 @@
     "react": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   }
-}
+}
\ No newline at end of file
diff --git a/packages/styling/package.json b/packages/styling/package.json
index b8684c1dd3cc2..5c9edbcaea5f1 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.8.0 <6.0.0",
+    "@uifabric/utilities": ">=5.9.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.11.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index df4fa1c074a8d..43df62c0fd494 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.9.0",
+      "tag": "@uifabric/utilities_v5.9.0",
+      "date": "Mon, 29 Jan 2018 11:23:40 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "John Lorenz <jcl47@duke.edu>",
+            "commit": "c91e28996fc74eff98bbb3c59426e8f6f159e64f",
+            "comment": "Add work week date range type and update date math getDateRangeArray to consume it, add unit tests"
+          }
+        ]
+      }
+    },
     {
       "version": "5.8.0",
       "tag": "@uifabric/utilities_v5.8.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index c13805688dc58..3f4b42b99f7fe 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Fri, 26 Jan 2018 11:25:22 GMT and should not be manually modified.
+This log was last generated on Mon, 29 Jan 2018 11:23:40 GMT and should not be manually modified.
+
+## 5.9.0
+Mon, 29 Jan 2018 11:23:40 GMT
+
+### Minor changes
+
+- Add work week date range type and update date math getDateRangeArray to consume it, add unit tests
 
 ## 5.8.0
 Fri, 26 Jan 2018 11:25:22 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index a0168224c834b..f0afb8f04b651 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.8.0",
+  "version": "5.9.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From b53aad15358e65df001ab1248cb336b76052cb3e Mon Sep 17 00:00:00 2001
From: Jordan Janzen <jordancjanzen@gmail.com>
Date: Mon, 29 Jan 2018 08:43:48 -0800
Subject: [PATCH 1286/1641] Fix TeachingBubble dismiss on scroll (#3810)

* Pass onDismiss to Callout component.

* npm run change output
---
 ...hingBubble-dismiss-on-scroll_2018-01-25-20-16.json | 11 +++++++++++
 .../src/components/TeachingBubble/TeachingBubble.tsx  |  3 ++-
 2 files changed, 13 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/-3809-TeachingBubble-dismiss-on-scroll_2018-01-25-20-16.json

diff --git a/common/changes/office-ui-fabric-react/-3809-TeachingBubble-dismiss-on-scroll_2018-01-25-20-16.json b/common/changes/office-ui-fabric-react/-3809-TeachingBubble-dismiss-on-scroll_2018-01-25-20-16.json
new file mode 100644
index 0000000000000..8caadf263a649
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/-3809-TeachingBubble-dismiss-on-scroll_2018-01-25-20-16.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": " Fix TeachingBubble dismiss on scroll by passing onDismiss to callout.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-jojanz@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
index 5d8c6162ec03f..c872fd13a0577 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
@@ -48,7 +48,7 @@ export class TeachingBubble extends BaseComponent<ITeachingBubbleProps, ITeachin
   }
 
   public render() {
-    let { calloutProps: setCalloutProps, targetElement } = this.props;
+    let { calloutProps: setCalloutProps, targetElement, onDismiss } = this.props;
     const calloutProps = { ...this._defaultCalloutProps, ...setCalloutProps };
 
     return (
@@ -56,6 +56,7 @@ export class TeachingBubble extends BaseComponent<ITeachingBubbleProps, ITeachin
         className={ css('ms-TeachingBubble', styles.root, this.props.isWide ? styles.wideCallout : null) }
         ref={ this._resolveRef('_callout') }
         target={ targetElement }
+        onDismiss={ onDismiss }
         {...calloutProps}
       >
         <TeachingBubbleContent { ...this.props } />

From d64535e7e0a001f39bc81eab1e517d9acd95252c Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Mon, 29 Jan 2018 14:17:13 -0800
Subject: [PATCH 1287/1641] Addressing issue #3793 - Can't set ComboBox's
 button to aria-hidden="false" (#3831)

Added prop to ComboBox to control its button's aria-hidden attribute
---
 .../combobox-ariabtn-3793_2018-01-29-19-47.json       | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.tsx              |  3 ++-
 .../src/components/ComboBox/ComboBox.types.ts         |  6 ++++++
 .../ComboBox/__snapshots__/ComboBox.test.tsx.snap     |  2 +-
 4 files changed, 20 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/combobox-ariabtn-3793_2018-01-29-19-47.json

diff --git a/common/changes/office-ui-fabric-react/combobox-ariabtn-3793_2018-01-29-19-47.json b/common/changes/office-ui-fabric-react/combobox-ariabtn-3793_2018-01-29-19-47.json
new file mode 100644
index 0000000000000..60a9fe36d55fb
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/combobox-ariabtn-3793_2018-01-29-19-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added prop to ComboBox to control its button's aria-hidden attribute",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 7f3d9dea9c3ab..e7ac4bb985f78 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -271,6 +271,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       allowFreeform,
       autoComplete,
       buttonIconProps,
+      isButtonAriaHidden = true,
       styles: customStyles,
       theme,
       title
@@ -337,7 +338,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
             className={ 'ms-ComboBox-CaretDown-button' }
             styles={ this._getCaretButtonStyles() }
             role='presentation'
-            aria-hidden='true'
+            aria-hidden={ isButtonAriaHidden }
             tabIndex={ -1 }
             onClick={ this._onComboBoxClick }
             iconProps={ buttonIconProps }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
index 2abc4a44c830c..f15c3cb116484 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
@@ -132,6 +132,12 @@ export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox>
    * Whether to use the ComboBoxes width as the menu's width
    */
   useComboBoxAsMenuWidth?: boolean;
+
+  /**
+   * Sets the 'aria-hidden' attribute on the ComboBox's button element instructing screen readers how to handle the element. This element is hidden by default because all functionality is handled by the input element and the arrow button is only meant to be decorative.
+   * @default true
+   */
+  isButtonAriaHidden?: boolean;
 }
 
 export interface IComboBoxStyles {
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
index fcb541039f1d3..72cfa71b8c91a 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
@@ -120,7 +120,7 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
     />
     <button
       aria-describedby={null}
-      aria-hidden="true"
+      aria-hidden={true}
       aria-label={undefined}
       aria-labelledby={null}
       aria-pressed={false}

From 7bfa07adb43a8e5217c679b49b20a081dbddd70d Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 30 Jan 2018 03:22:57 -0800
Subject: [PATCH 1288/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...le-dismiss-on-scroll_2018-01-25-20-16.json | 11 ----------
 ...ombobox-ariabtn-3793_2018-01-29-19-47.json | 11 ----------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 21 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 13 +++++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 11 files changed, 40 insertions(+), 30 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/-3809-TeachingBubble-dismiss-on-scroll_2018-01-25-20-16.json
 delete mode 100644 common/changes/office-ui-fabric-react/combobox-ariabtn-3793_2018-01-29-19-47.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 33b2fa9b7bbe4..cd6cbce8dc49a 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.44.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.45.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index c22ac333322ad..ab6c1cbbb8ae2 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.44.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.45.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 65de7f3ec1b14..8a97d513d90bc 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.44.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.45.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 629d2e47755b9..a9d49b9cc700d 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.44.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.45.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 73f303bc448ff..3130e56a904d6 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.44.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.45.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/office-ui-fabric-react/-3809-TeachingBubble-dismiss-on-scroll_2018-01-25-20-16.json b/common/changes/office-ui-fabric-react/-3809-TeachingBubble-dismiss-on-scroll_2018-01-25-20-16.json
deleted file mode 100644
index 8caadf263a649..0000000000000
--- a/common/changes/office-ui-fabric-react/-3809-TeachingBubble-dismiss-on-scroll_2018-01-25-20-16.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": " Fix TeachingBubble dismiss on scroll by passing onDismiss to callout.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-jojanz@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/combobox-ariabtn-3793_2018-01-29-19-47.json b/common/changes/office-ui-fabric-react/combobox-ariabtn-3793_2018-01-29-19-47.json
deleted file mode 100644
index 60a9fe36d55fb..0000000000000
--- a/common/changes/office-ui-fabric-react/combobox-ariabtn-3793_2018-01-29-19-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added prop to ComboBox to control its button's aria-hidden attribute",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index f16047b79e605..fa2537f647e00 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.44.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.45.0 <6.0.0",
     "@uifabric/icons": ">=5.4.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 484c1e1520e47..3f81c571fed9d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,27 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.45.0",
+      "tag": "office-ui-fabric-react_v5.45.0",
+      "date": "Tue, 30 Jan 2018 11:22:56 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jordan Janzen <jordancjanzen@gmail.com>",
+            "commit": "b53aad15358e65df001ab1248cb336b76052cb3e",
+            "comment": " Fix TeachingBubble dismiss on scroll by passing onDismiss to callout."
+          }
+        ],
+        "minor": [
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "d64535e7e0a001f39bc81eab1e517d9acd95252c",
+            "comment": "Added prop to ComboBox to control its button's aria-hidden attribute"
+          }
+        ]
+      }
+    },
     {
       "version": "5.44.0",
       "tag": "office-ui-fabric-react_v5.44.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 57250c6aa570a..8dd275f39ede6 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 29 Jan 2018 11:23:40 GMT and should not be manually modified.
+This log was last generated on Tue, 30 Jan 2018 11:22:56 GMT and should not be manually modified.
+
+## 5.45.0
+Tue, 30 Jan 2018 11:22:56 GMT
+
+### Minor changes
+
+- Added prop to ComboBox to control its button's aria-hidden attribute
+
+### Patches
+
+-  Fix TeachingBubble dismiss on scroll by passing onDismiss to callout.
 
 ## 5.44.0
 Mon, 29 Jan 2018 11:23:40 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index ce36104a6bbba..a401a4ee06fca 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.44.0",
+  "version": "5.45.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From e6136d1726d59c4766b58af9dd0bd40a3936952b Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Tue, 30 Jan 2018 09:59:39 -0800
Subject: [PATCH 1289/1641] ComboBox: Fix auto expand for allowFreeform (#3817)

* Update the way the comboBox expands to not autoexpand for allowfreeform (but it should stay expanded if it is already open)

* rush change
---
 ...purlin-ComboBoxAutoExpandFix_2018-01-26-19-35.json | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.tsx              |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxAutoExpandFix_2018-01-26-19-35.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxAutoExpandFix_2018-01-26-19-35.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxAutoExpandFix_2018-01-26-19-35.json
new file mode 100644
index 0000000000000..5667273b2156c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxAutoExpandFix_2018-01-26-19-35.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: ComboBoxes were changed to always expand which is incorrect behavior, fixing to align with the correct design",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index e7ac4bb985f78..30a8992faae93 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -1518,7 +1518,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   @autobind
   private _onBaseAutofillClick() {
     if (this.props.allowFreeform) {
-      this.focus(true);
+      this.focus(this.state.isOpen);
     } else {
       this._onComboBoxClick();
     }

From 88066a817c1341690e124d93b499f34550214a69 Mon Sep 17 00:00:00 2001
From: Srikanth Reddy Kandula <srikanthreddy.iitp@gmail.com>
Date: Tue, 30 Jan 2018 23:56:39 +0530
Subject: [PATCH 1290/1641] Fix DatePicker prev and next arrows in RTL (#3822)

* Fixing the up and down arrows position and behavior

* Adding change file
---
 ...xDatePickerPrevAndNextArrows_2018-01-25-09-39.json | 11 +++++++++++
 .../src/components/Calendar/CalendarDay.tsx           |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/srk-RTL-FixDatePickerPrevAndNextArrows_2018-01-25-09-39.json

diff --git a/common/changes/office-ui-fabric-react/srk-RTL-FixDatePickerPrevAndNextArrows_2018-01-25-09-39.json b/common/changes/office-ui-fabric-react/srk-RTL-FixDatePickerPrevAndNextArrows_2018-01-25-09-39.json
new file mode 100644
index 0000000000000..72c9cd019a492
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/srk-RTL-FixDatePickerPrevAndNextArrows_2018-01-25-09-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixing the up and down arrows position and behavior according to RTL expected behavior",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "srkandu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index 04d6d747decbb..719346d4bc378 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -143,7 +143,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
               role='button'
               tabIndex={ 0 }
             >
-              <Icon iconName={ getRTL() ? rightNavigationIcon : leftNavigationIcon } />
+              <Icon iconName={ leftNavigationIcon } />
             </button >
             <button
               className={ css('ms-DatePicker-nextMonth js-nextMonth', styles.nextMonth,
@@ -157,7 +157,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
               role='button'
               tabIndex={ 0 }
             >
-              <Icon iconName={ getRTL() ? leftNavigationIcon : rightNavigationIcon } />
+              <Icon iconName={ rightNavigationIcon } />
             </button >
           </div >
         </div >

From 0bcc2870320b3940d9e386a9996981e759ba4ddf Mon Sep 17 00:00:00 2001
From: amyngu <31973030+amyngu@users.noreply.github.com>
Date: Tue, 30 Jan 2018 13:12:18 -0800
Subject: [PATCH 1291/1641] BaseSelectedListMake selection optional, Change
 render to any (#3839)

* make selection optional, change render to any

* npm change

* add override for recieved props
---
 ...orSelectedPeopleList_2018-01-30-19-13.json | 11 ++++++++
 .../ExtendedPeoplePicker.Basic.Example.tsx    |  9 ------
 .../BaseSelectedItemsList.tsx                 | 28 +++++++++++++------
 .../BaseSelectedItemsList.types.ts            |  5 +++-
 .../SelectedPeopleList/SelectedPeopleList.tsx |  2 +-
 5 files changed, 35 insertions(+), 20 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/fixRenderForSelectedPeopleList_2018-01-30-19-13.json

diff --git a/common/changes/@uifabric/experiments/fixRenderForSelectedPeopleList_2018-01-30-19-13.json b/common/changes/@uifabric/experiments/fixRenderForSelectedPeopleList_2018-01-30-19-13.json
new file mode 100644
index 0000000000000..78b29bf32d1dc
--- /dev/null
+++ b/common/changes/@uifabric/experiments/fixRenderForSelectedPeopleList_2018-01-30-19-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Make Selection optional (create default seleciton fallback), change render typedef to any, to allow use in lower versions of types/react\"",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "amyngu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
index 57cf88fb3707f..719bac468612b 100644
--- a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
@@ -16,7 +16,6 @@ import './ExtendedPeoplePicker.Basic.Example.scss';
 import { FloatingPeoplePicker, IBaseFloatingPickerProps } from '../../FloatingPicker';
 import { IBaseSelectedItemsListProps, IExtendedPersonaProps, ISelectedPeopleProps, SelectedPeopleList }
   from '../../SelectedItemsList';
-import { Selection } from 'office-ui-fabric-react/lib/Selection';
 
 export interface IPeoplePickerExampleState {
   peopleList: IPersonaProps[];
@@ -39,7 +38,6 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
   private _picker: ExtendedPeoplePicker;
   private floatingPickerProps: IBaseFloatingPickerProps<IExtendedPersonaProps>;
   private selectedItemsListProps: ISelectedPeopleProps;
-  private selection: Selection;
 
   constructor(props: {}) {
     super(props);
@@ -51,8 +49,6 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
       peopleList.push(target);
     });
 
-    this.selection = new Selection({ onSelectionChanged: () => this._onSelectionChange() });
-
     this.state = {
       peopleList: peopleList,
       mostRecentlyUsed: mru,
@@ -74,7 +70,6 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
       onExpandGroup: this._onExpandItem,
       removeMenuItemText: 'Remove',
       copyMenuItemText: 'Copy name',
-      selection: this.selection
     };
   }
 
@@ -122,10 +117,6 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
     return (<SelectedPeopleList {...props} />);
   }
 
-  private _onSelectionChange(): void {
-    this.forceUpdate();
-  }
-
   @autobind
   private _setComponentRef(component: ExtendedPeoplePicker): void {
     this._picker = component;
diff --git a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx
index 97c45f74aebe2..3e4791a6bceab 100644
--- a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx
@@ -4,6 +4,7 @@ import {
   KeyCodes,
   autobind,
 } from '../../Utilities';
+import { Selection } from 'office-ui-fabric-react/lib/Selection';
 
 import { IBaseSelectedItemsList, IBaseSelectedItemsListProps, ISelectedItemProps } from './BaseSelectedItemsList.types';
 
@@ -23,6 +24,7 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
   extends BaseComponent<P, IBaseSelectedItemsListState> implements IBaseSelectedItemsList<T> {
 
   protected root: HTMLElement;
+  protected selection: Selection;
 
   constructor(basePickerProps: P) {
     super(basePickerProps);
@@ -31,6 +33,9 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
     this.state = {
       items: items,
     };
+
+    // Create a new selection if one is not specified
+    this.selection = this.props.selection ? this.props.selection as Selection : new Selection({ onSelectionChanged: this.forceUpdate });
   }
 
   public get items(): T[] {
@@ -69,24 +74,24 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
 
   @autobind
   public onCopy(ev: React.ClipboardEvent<HTMLElement>): void {
-    if (this.props.onCopyItems && this.props.selection.getSelectedCount() > 0) {
-      let selectedItems: T[] = this.props.selection.getSelection() as T[];
+    if (this.props.onCopyItems && this.selection.getSelectedCount() > 0) {
+      let selectedItems: T[] = this.selection.getSelection() as T[];
       this.copyItems(selectedItems);
     }
   }
 
   public unselectAll(): void {
-    this.props.selection.setAllSelected(false);
+    this.selection.setAllSelected(false);
   }
 
   public componentWillUpdate(newProps: P, newState: IBaseSelectedItemsListState): void {
     if (newState.items && newState.items !== this.state.items) {
-      this.props.selection.setItems(newState.items);
+      this.selection.setItems(newState.items);
     }
   }
 
   public componentDidMount(): void {
-    this.props.selection.setItems(this.state.items);
+    this.selection.setItems(this.state.items);
   }
 
   public componentWillReceiveProps(newProps: P): void {
@@ -95,9 +100,14 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
     if (newItems) {
       this.setState({ items: newProps.selectedItems });
     }
+
+    if (newProps.selection) {
+      this.selection = newProps.selection;
+    }
   }
 
-  public render(): JSX.Element[] {
+  // tslint:disable-next-line:no-any
+  public render(): any {
     return this.renderItems();
   }
 
@@ -112,7 +122,7 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
       item,
       index,
       key: item.key ? item.key : index,
-      selected: this.props.selection.isIndexSelected(index),
+      selected: this.selection.isIndexSelected(index),
       onRemoveItem: () => this.removeItem(item),
       onItemChange: this.onItemChange,
       removeButtonAriaLabel: removeButtonAriaLabel,
@@ -178,8 +188,8 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
   // This lets the subclass override it and provide it's own onBackspace. For an example see the BasePickerListBelow
   protected onBackspace(ev: React.KeyboardEvent<HTMLElement>): void {
     if (this.state.items.length) {
-      if (this.props.selection.getSelectedCount() > 0) {
-        this.removeItems(this.props.selection.getSelection());
+      if (this.selection.getSelectedCount() > 0) {
+        this.removeItems(this.selection.getSelection());
       } else {
         this.removeItem(this.state.items[this.state.items.length - 1]);
       }
diff --git a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.types.ts b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.types.ts
index 930e018eaeefd..b0f82dfbaefe9 100644
--- a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.types.ts
+++ b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.types.ts
@@ -19,7 +19,10 @@ export interface ISelectedItemProps<T> extends IPickerItemProps<T> {
 export interface IBaseSelectedItemsListProps<T> extends React.Props<any> {
   componentRef?: (component?: IBaseSelectedItemsList<T>) => void;
 
-  selection: Selection;
+  /**
+   * The selection
+   */
+  selection?: Selection;
   /**
    * A callback for when items are copied
    */
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
index 07055f1731e3f..63bd372d812e4 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
@@ -59,7 +59,7 @@ export class SelectedPeopleList extends BasePeopleSelectedItemsList {
       item,
       index,
       key: item.key ? item.key : index,
-      selected: this.props.selection.isIndexSelected(index),
+      selected: this.selection.isIndexSelected(index),
       onRemoveItem: () => this.removeItem(item),
       onItemChange: this.onItemChange,
       removeButtonAriaLabel: removeButtonAriaLabel,

From b6a301e8164b5120d9c25049942ef112628f067d Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Tue, 30 Jan 2018 13:35:45 -0800
Subject: [PATCH 1292/1641] ContextualMenu: Remove the list inside the menu and
 move aria labeling to the correct element (#3838)

* Contextual Menus should not contain a list and the aria-label/labelledby should be on the menu

* rush change
---
 ...ContextualMenuRemoveListness_2018-01-30-18-06.json | 11 +++++++++++
 .../src/components/ContextualMenu/ContextualMenu.tsx  |  5 +++--
 2 files changed, 14 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-ContextualMenuRemoveListness_2018-01-30-18-06.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-ContextualMenuRemoveListness_2018-01-30-18-06.json b/common/changes/office-ui-fabric-react/jspurlin-ContextualMenuRemoveListness_2018-01-30-18-06.json
new file mode 100644
index 0000000000000..71e925aaad74a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-ContextualMenuRemoveListness_2018-01-30-18-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: Remove the list in the menu and move the aria-label/labelledby to the correct element",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 2ab90b4c2c58c..75f503bb0b426 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -289,6 +289,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
         >
           <div
             role='menu'
+            aria-label={ ariaLabel }
+            aria-labelledby={ labelElementId }
             style={ contextMenuStyle }
             ref={ (host: HTMLDivElement) => this._host = host }
             id={ id }
@@ -305,8 +307,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
                 allowTabKey={ true }
               >
                 <ul
-                  aria-label={ ariaLabel }
-                  aria-labelledby={ labelElementId }
+                  role='presentation'
                   className={ this._classNames.list }
                   onKeyDown={ this._onKeyDown }
                 >

From 2a554f6da9bc2655cd13fdd40b3efd0b902a9752 Mon Sep 17 00:00:00 2001
From: chang47 <coralbue@gmail.com>
Date: Tue, 30 Jan 2018 13:36:13 -0800
Subject: [PATCH 1293/1641] SwatchColorPicker: Adding Aria Label Text (#3765)

* added aria-label support for the swatch color picker

* removed aria label for cells

* added aria comment; added change files

* updated test snap file

* added native props spread operators instead of defining aria attributes to be more generic

* remove inheriting the onblur prop in the wrong location

* added the aria-set attributes back in and excluded the native ones the user might add in

* reverted test

* updated to just pass in props to grid to parse
---
 .../chiechan-accColor_2018-01-23-00-51.json           | 11 +++++++++++
 .../SwatchColorPicker/SwatchColorPicker.base.tsx      |  5 ++++-
 .../__snapshots__/SwatchColorPicker.test.tsx.snap     |  1 +
 .../src/utilities/grid/Grid.base.tsx                  | 11 ++++++++---
 .../src/utilities/grid/Grid.types.ts                  |  4 ++--
 5 files changed, 26 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/chiechan-accColor_2018-01-23-00-51.json

diff --git a/common/changes/office-ui-fabric-react/chiechan-accColor_2018-01-23-00-51.json b/common/changes/office-ui-fabric-react/chiechan-accColor_2018-01-23-00-51.json
new file mode 100644
index 0000000000000..739568423b3d8
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/chiechan-accColor_2018-01-23-00-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "swatch color picker - add ability to add aria-label",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chiechan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
index 8e9e1e3769caf..2ca8484c3df25 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
@@ -5,7 +5,9 @@ import {
   findIndex,
   getId,
   customizable,
-  classNamesFunction
+  classNamesFunction,
+  getNativeProps,
+  htmlElementProperties
 } from '../../Utilities';
 import {
   ISwatchColorPicker,
@@ -90,6 +92,7 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
     }
     return (
       <Grid
+        {...this.props}
         items={ colorCells.map((item, index) => { return { ...item, index }; }) }
         columnCount={ columnCount }
         onRenderItem={ this._renderOption }
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
index 32120e45c26f3..8310a30440fa9 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
@@ -32,6 +32,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
           padding-top: 2px;
         }
     id="id__2"
+    onBlur={[Function]}
     role="grid"
   >
     <tbody>
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.base.tsx b/packages/office-ui-fabric-react/src/utilities/grid/Grid.base.tsx
index 011a6712bd5e4..4a1672fcff08d 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.base.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.base.tsx
@@ -3,7 +3,9 @@ import {
   BaseComponent,
   getId,
   toMatrix,
-  classNamesFunction
+  classNamesFunction,
+  getNativeProps,
+  htmlElementProperties
 } from '../../Utilities';
 import { FocusZone } from '../../FocusZone';
 import { IGrid, IGridProps, IGridStyleProps, IGridStyles } from './Grid.types';
@@ -29,6 +31,8 @@ export class GridBase extends BaseComponent<IGridProps, {}> implements IGrid {
       getStyles
     } = this.props;
 
+    const htmlProps = getNativeProps(this.props, htmlElementProperties, ['onBlur, aria-posinset, aria-setsize']);
+
     const classNames = getClassNames(getStyles!, { theme: this.props.theme! });
 
     // Array to store the cells in the correct row index
@@ -36,10 +40,11 @@ export class GridBase extends BaseComponent<IGridProps, {}> implements IGrid {
 
     let content = (
       <table
-        id={ this._id }
-        role={ 'grid' }
+        {...htmlProps}
         aria-posinset={ positionInSet }
         aria-setsize={ setSize }
+        id={ this._id }
+        role={ 'grid' }
         className={ classNames.root }
       >
         <tbody>
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.types.ts b/packages/office-ui-fabric-react/src/utilities/grid/Grid.types.ts
index 5c3b9d5e1764c..23168738afa55 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.types.ts
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.types.ts
@@ -64,8 +64,8 @@ export interface IGridProps {
   theme?: ITheme;
 
   /**
- * Optional styles for the component.
- */
+   * Optional styles for the component.
+   */
   getStyles?: IStyleFunction<IGridStyleProps, IGridStyles>;
 }
 

From 2a9d79021114b2ad4b4c04f8557716077399c592 Mon Sep 17 00:00:00 2001
From: Scott Balentine <sbalentine88@gmail.com>
Date: Tue, 30 Jan 2018 14:14:43 -0800
Subject: [PATCH 1294/1641] Prefix suffix whitespace (#3840)

* fix whitespace wrapping with prefix/suffix

* change file

* Update prefix-suffix-whitespace_2018-01-30-21-56.json
---
 .../prefix-suffix-whitespace_2018-01-30-21-56.json    | 11 +++++++++++
 .../src/components/TextField/TextField.scss           |  5 +++--
 2 files changed, 14 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/prefix-suffix-whitespace_2018-01-30-21-56.json

diff --git a/common/changes/office-ui-fabric-react/prefix-suffix-whitespace_2018-01-30-21-56.json b/common/changes/office-ui-fabric-react/prefix-suffix-whitespace_2018-01-30-21-56.json
new file mode 100644
index 0000000000000..fb6e65a7e4484
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/prefix-suffix-whitespace_2018-01-30-21-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "TextField: fixed whitespace wrapping with prefix/suffix.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "sbalentine88@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index 57a30a72932de..43b076b98c360 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -99,12 +99,13 @@ $field-error-color: $errorTextColor;
 }
 
 .fieldPrefixSuffix {
+  align-items: center;
   background: $ms-color-neutralLighter;
   color: $ms-color-neutralSecondary;
   display: flex;
-  align-items: center;
-  padding: 0 10px;
   line-height: 1;
+  padding: 0 10px;
+  white-space: nowrap;
 }
 
 .field {

From f803269ad6750215dad105710caeee16c8ea0aea Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 30 Jan 2018 15:27:52 -0800
Subject: [PATCH 1295/1641] ChoiceGroup: Wrap long text for icon and image
 types. (#3761)

* Adjusted css to wrap text and not cut off descenders

* Edited example to show wrapping text

* Added change file

* Gave the field height and width so that it doesn't stretch past its box

* Updated story to include text wrappingd

* Image height test

* Text margin fix

* Border test
---
 .../src/stories/ChoiceGroup.stories.tsx       |  2 +-
 ...cegroup-textoverflow_2018-01-22-22-51.json | 11 ++++++++++
 .../components/ChoiceGroup/ChoiceGroup.scss   | 21 ++++++++++++-------
 .../examples/ChoiceGroup.Image.Example.tsx    |  2 +-
 4 files changed, 27 insertions(+), 9 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/choicegroup-textoverflow_2018-01-22-22-51.json

diff --git a/apps/vr-tests/src/stories/ChoiceGroup.stories.tsx b/apps/vr-tests/src/stories/ChoiceGroup.stories.tsx
index 38514271f950c..b3facd8fe5b42 100644
--- a/apps/vr-tests/src/stories/ChoiceGroup.stories.tsx
+++ b/apps/vr-tests/src/stories/ChoiceGroup.stories.tsx
@@ -87,7 +87,7 @@ storiesOf('ChoiceGroup', module)
           imageSrc: TestImages.choiceGroupBarUnselected,
           selectedImageSrc: TestImages.choiceGroupBarSelected,
           imageSize: { width: 32, height: 32 },
-          text: 'Bar chart'
+          text: 'Clustered bar chart'
         },
         {
           key: 'pie',
diff --git a/common/changes/office-ui-fabric-react/choicegroup-textoverflow_2018-01-22-22-51.json b/common/changes/office-ui-fabric-react/choicegroup-textoverflow_2018-01-22-22-51.json
new file mode 100644
index 0000000000000..4432b795ff527
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/choicegroup-textoverflow_2018-01-22-22-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ChoiceGroup: Wrap long text for image and icon types.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
index a295baf2a055b..44b91b2d53912 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
@@ -29,6 +29,8 @@ $radioButton-border-disabled-color: $radioButton-background-unselected-disabled-
 // ChoiceField styles
 
 $ms-choiceField-field-size: 20px;
+$ms-choiceField-image-size: 32px;
+$ms-choiceField-text-height: 32px;
 $ms-choiceField-iconField-size: 96px;
 $ms-choiceField-transition-duration: 200ms;
 $ms-choiceField-transition-duration-inner: 150ms;
@@ -197,6 +199,9 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
   $radioButtonSpacing: 3px;
   $radioButtonInnerSize: 5px;
 
+  height: $ms-choiceField-iconField-size;
+  width: $ms-choiceField-iconField-size;
+
   .fieldIsImage, .fieldIsIcon {
 
     display: inline-block;
@@ -208,6 +213,8 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
     text-align: center;
     transition: all $ms-choiceField-transition-duration ease;
     border: 2px solid transparent;
+    height: $ms-choiceField-iconField-size;
+    width: $ms-choiceField-iconField-size;
 
     &.fieldIsDisabled {
       cursor: default;
@@ -225,6 +232,8 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
     .innerField {
       position: relative;
       padding: 0 28px;
+      height: $ms-choiceField-image-size;
+      width: $ms-choiceField-image-size;
 
       .imageWrapper {
         padding-bottom: 2px;
@@ -242,19 +251,20 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
 
         :global(.ms-Image) {
           display: inline-block;
+          border-style: none;
         }
       }
     }
 
     .labelWrapper {
-      $lineHeight: 16px;
+      $lineHeight: 15px;
       display: block;
       position: relative;
-      margin: 4px 0 0 0;
-      height: $lineHeight * 2;
+      margin: 4px 0 2px 0;
+      height: $ms-choiceField-text-height;
       line-height: $lineHeight;
       overflow: hidden;
-      white-space: nowrap;
+      white-space: pre-wrap;
       text-overflow: ellipsis;
       @include ms-font-m;
 
@@ -328,9 +338,6 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
 .choiceFieldIsIcon {
   $iconSize: 32px;
 
-  height: $ms-choiceField-iconField-size;
-  width: $ms-choiceField-iconField-size;
-
   .iconWrapper {
     font-size: $iconSize;
     line-height: $iconSize;
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Image.Example.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Image.Example.tsx
index 6695b3a528608..d04b50bcee94a 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Image.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Image.Example.tsx
@@ -35,7 +35,7 @@ export class ChoiceGroupImageExample extends React.Component<{}, IChoiceGroupIma
               imageAlt: 'Bar chart icon',
               selectedImageSrc: TestImages.choiceGroupBarSelected,
               imageSize: { width: 32, height: 32 },
-              text: 'Bar chart'
+              text: 'Clustered bar chart' // This text is long to show text wrapping.
             },
             {
               key: 'pie',

From 7d5b46f17b9fe7f997b815d77e5a2e4a4d038579 Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Tue, 30 Jan 2018 16:05:18 -0800
Subject: [PATCH 1296/1641] removed unused scss file (#3842)

removed unused scss file from Sticky component
---
 .../sticky-stylemigration_2018-01-30-22-58.json       | 11 +++++++++++
 .../src/components/Sticky/Sticky.scss                 | 11 -----------
 2 files changed, 11 insertions(+), 11 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/sticky-stylemigration_2018-01-30-22-58.json
 delete mode 100644 packages/office-ui-fabric-react/src/components/Sticky/Sticky.scss

diff --git a/common/changes/office-ui-fabric-react/sticky-stylemigration_2018-01-30-22-58.json b/common/changes/office-ui-fabric-react/sticky-stylemigration_2018-01-30-22-58.json
new file mode 100644
index 0000000000000..8a5670f226472
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/sticky-stylemigration_2018-01-30-22-58.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Removed unused scss file in Sticky component",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.scss b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.scss
deleted file mode 100644
index fe0ac64e04e19..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.scss
+++ /dev/null
@@ -1,11 +0,0 @@
-@import '../../common/common';
-
-.isSticky {
-  position: fixed;
-  -webkit-overflow-scrolling: touch;
-  -webkit-transform: translateZ(0);
-  transform: translateZ(0);
-  -webkit-backface-visibility: hidden;
-  backface-visibility: hidden;
-  z-index: 1;
-}
\ No newline at end of file

From 7df5be25f84af0d634cc2c428026b0a98000703b Mon Sep 17 00:00:00 2001
From: John Lorenz <jcl47@duke.edu>
Date: Tue, 30 Jan 2018 17:55:22 -0800
Subject: [PATCH 1297/1641] Adding check to DatePicker
 componentWillReceiveProps to prevent unnecessary validation failures (#3843)

* direct comparison of objects returns false, need to stringify to compare

* adding change file

* build didn't like ==, changing to ===

* final fixes
---
 ...lore-datePickerValidationFix_2018-01-30-23-50.json | 11 +++++++++++
 .../src/components/DatePicker/DatePicker.tsx          | 10 ++++++++++
 2 files changed, 21 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/jolore-datePickerValidationFix_2018-01-30-23-50.json

diff --git a/common/changes/office-ui-fabric-react/jolore-datePickerValidationFix_2018-01-30-23-50.json b/common/changes/office-ui-fabric-react/jolore-datePickerValidationFix_2018-01-30-23-50.json
new file mode 100644
index 0000000000000..754a5ff32b9ef
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jolore-datePickerValidationFix_2018-01-30-23-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "updating willReceiveProps of date picker to not run validation unless the props actually changed",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jolore@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 995bfedeeebbf..35fd4a6ed376e 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -143,6 +143,16 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
 
   public componentWillReceiveProps(nextProps: IDatePickerProps) {
     let { formatDate, isRequired, strings, value, minDate, maxDate } = nextProps;
+
+    if (compareDates(this.props.minDate!, nextProps.minDate!) &&
+      compareDates(this.props.maxDate!, nextProps.maxDate!) &&
+      this.props.isRequired === nextProps.isRequired &&
+      compareDates(this.state.selectedDate!, value!) &&
+      this.props.formatDate === formatDate) {
+      // if the props we care about haven't changed, don't run validation or updates
+      return;
+    }
+
     let errorMessage = (isRequired && !value) ? (strings!.isRequiredErrorMessage || '*') : undefined;
 
     if (!errorMessage && value) {

From 7794372800dca108820caa9d7415ba713d94c779 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 31 Jan 2018 11:11:59 +0000
Subject: [PATCH 1298/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...orSelectedPeopleList_2018-01-30-19-13.json | 11 -----
 .../chiechan-accColor_2018-01-23-00-51.json   | 11 -----
 ...cegroup-textoverflow_2018-01-22-22-51.json | 11 -----
 ...ePickerValidationFix_2018-01-30-23-50.json | 11 -----
 ...omboBoxAutoExpandFix_2018-01-26-19-35.json | 11 -----
 ...alMenuRemoveListness_2018-01-30-18-06.json | 11 -----
 ...ix-suffix-whitespace_2018-01-30-21-56.json | 11 -----
 ...kerPrevAndNextArrows_2018-01-25-09-39.json | 11 -----
 ...ticky-stylemigration_2018-01-30-22-58.json | 11 -----
 packages/experiments/CHANGELOG.json           | 19 +++++++
 packages/experiments/CHANGELOG.md             |  9 +++-
 packages/experiments/package.json             |  4 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 49 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 16 +++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 20 files changed, 99 insertions(+), 109 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/fixRenderForSelectedPeopleList_2018-01-30-19-13.json
 delete mode 100644 common/changes/office-ui-fabric-react/chiechan-accColor_2018-01-23-00-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/choicegroup-textoverflow_2018-01-22-22-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/jolore-datePickerValidationFix_2018-01-30-23-50.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-ComboBoxAutoExpandFix_2018-01-26-19-35.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-ContextualMenuRemoveListness_2018-01-30-18-06.json
 delete mode 100644 common/changes/office-ui-fabric-react/prefix-suffix-whitespace_2018-01-30-21-56.json
 delete mode 100644 common/changes/office-ui-fabric-react/srk-RTL-FixDatePickerPrevAndNextArrows_2018-01-25-09-39.json
 delete mode 100644 common/changes/office-ui-fabric-react/sticky-stylemigration_2018-01-30-22-58.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index cd6cbce8dc49a..fb05e91dcafa9 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.45.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.45.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index ab6c1cbbb8ae2..d93a62255b90c 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.45.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.45.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 8a97d513d90bc..423e47748dc17 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.45.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.45.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index a9d49b9cc700d..86563e4c8da56 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.45.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.45.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 3130e56a904d6..87619aa70d8f7 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.45.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.45.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/@uifabric/experiments/fixRenderForSelectedPeopleList_2018-01-30-19-13.json b/common/changes/@uifabric/experiments/fixRenderForSelectedPeopleList_2018-01-30-19-13.json
deleted file mode 100644
index 78b29bf32d1dc..0000000000000
--- a/common/changes/@uifabric/experiments/fixRenderForSelectedPeopleList_2018-01-30-19-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Make Selection optional (create default seleciton fallback), change render typedef to any, to allow use in lower versions of types/react\"",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "amyngu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/chiechan-accColor_2018-01-23-00-51.json b/common/changes/office-ui-fabric-react/chiechan-accColor_2018-01-23-00-51.json
deleted file mode 100644
index 739568423b3d8..0000000000000
--- a/common/changes/office-ui-fabric-react/chiechan-accColor_2018-01-23-00-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "swatch color picker - add ability to add aria-label",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chiechan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/choicegroup-textoverflow_2018-01-22-22-51.json b/common/changes/office-ui-fabric-react/choicegroup-textoverflow_2018-01-22-22-51.json
deleted file mode 100644
index 4432b795ff527..0000000000000
--- a/common/changes/office-ui-fabric-react/choicegroup-textoverflow_2018-01-22-22-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ChoiceGroup: Wrap long text for image and icon types.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jolore-datePickerValidationFix_2018-01-30-23-50.json b/common/changes/office-ui-fabric-react/jolore-datePickerValidationFix_2018-01-30-23-50.json
deleted file mode 100644
index 754a5ff32b9ef..0000000000000
--- a/common/changes/office-ui-fabric-react/jolore-datePickerValidationFix_2018-01-30-23-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "updating willReceiveProps of date picker to not run validation unless the props actually changed",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jolore@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxAutoExpandFix_2018-01-26-19-35.json b/common/changes/office-ui-fabric-react/jspurlin-ComboBoxAutoExpandFix_2018-01-26-19-35.json
deleted file mode 100644
index 5667273b2156c..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-ComboBoxAutoExpandFix_2018-01-26-19-35.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: ComboBoxes were changed to always expand which is incorrect behavior, fixing to align with the correct design",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-ContextualMenuRemoveListness_2018-01-30-18-06.json b/common/changes/office-ui-fabric-react/jspurlin-ContextualMenuRemoveListness_2018-01-30-18-06.json
deleted file mode 100644
index 71e925aaad74a..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-ContextualMenuRemoveListness_2018-01-30-18-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: Remove the list in the menu and move the aria-label/labelledby to the correct element",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/prefix-suffix-whitespace_2018-01-30-21-56.json b/common/changes/office-ui-fabric-react/prefix-suffix-whitespace_2018-01-30-21-56.json
deleted file mode 100644
index fb6e65a7e4484..0000000000000
--- a/common/changes/office-ui-fabric-react/prefix-suffix-whitespace_2018-01-30-21-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "TextField: fixed whitespace wrapping with prefix/suffix.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "sbalentine88@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/srk-RTL-FixDatePickerPrevAndNextArrows_2018-01-25-09-39.json b/common/changes/office-ui-fabric-react/srk-RTL-FixDatePickerPrevAndNextArrows_2018-01-25-09-39.json
deleted file mode 100644
index 72c9cd019a492..0000000000000
--- a/common/changes/office-ui-fabric-react/srk-RTL-FixDatePickerPrevAndNextArrows_2018-01-25-09-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixing the up and down arrows position and behavior according to RTL expected behavior",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "srkandu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/sticky-stylemigration_2018-01-30-22-58.json b/common/changes/office-ui-fabric-react/sticky-stylemigration_2018-01-30-22-58.json
deleted file mode 100644
index 8a5670f226472..0000000000000
--- a/common/changes/office-ui-fabric-react/sticky-stylemigration_2018-01-30-22-58.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Removed unused scss file in Sticky component",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index e5582341dab05..68522e4ca708d 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.16.1",
+      "tag": "@uifabric/experiments_v5.16.1",
+      "date": "Wed, 31 Jan 2018 11:11:59 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "amyngu <31973030+amyngu@users.noreply.github.com>",
+            "commit": "0bcc2870320b3940d9e386a9996981e759ba4ddf",
+            "comment": "Make Selection optional (create default seleciton fallback), change render typedef to any, to allow use in lower versions of types/react\""
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.45.0 <6.0.0` to `>=5.45.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.16.0",
       "tag": "@uifabric/experiments_v5.16.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 7ae6ef6c9c2d7..dbda5316b63fd 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Mon, 29 Jan 2018 11:23:40 GMT and should not be manually modified.
+This log was last generated on Wed, 31 Jan 2018 11:11:59 GMT and should not be manually modified.
+
+## 5.16.1
+Wed, 31 Jan 2018 11:11:59 GMT
+
+### Patches
+
+- Make Selection optional (create default seleciton fallback), change render typedef to any, to allow use in lower versions of types/react"
 
 ## 5.16.0
 Mon, 29 Jan 2018 11:23:40 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index fa2537f647e00..54932f82bea6f 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.16.0",
+  "version": "5.16.1",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.45.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.45.1 <6.0.0",
     "@uifabric/icons": ">=5.4.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 3f81c571fed9d..6ed5890e8e686 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,55 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.45.1",
+      "tag": "office-ui-fabric-react_v5.45.1",
+      "date": "Wed, 31 Jan 2018 11:11:59 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "chang47 <coralbue@gmail.com>",
+            "commit": "2a554f6da9bc2655cd13fdd40b3efd0b902a9752",
+            "comment": "swatch color picker - add ability to add aria-label"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "f803269ad6750215dad105710caeee16c8ea0aea",
+            "comment": "ChoiceGroup: Wrap long text for image and icon types."
+          },
+          {
+            "author": "John Lorenz <jcl47@duke.edu>",
+            "commit": "7df5be25f84af0d634cc2c428026b0a98000703b",
+            "comment": "updating willReceiveProps of date picker to not run validation unless the props actually changed"
+          },
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "e6136d1726d59c4766b58af9dd0bd40a3936952b",
+            "comment": "ComboBox: ComboBoxes were changed to always expand which is incorrect behavior, fixing to align with the correct design"
+          },
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "b6a301e8164b5120d9c25049942ef112628f067d",
+            "comment": "ContextualMenu: Remove the list in the menu and move the aria-label/labelledby to the correct element"
+          },
+          {
+            "author": "Scott Balentine <sbalentine88@gmail.com>",
+            "commit": "2a9d79021114b2ad4b4c04f8557716077399c592",
+            "comment": "TextField: fixed whitespace wrapping with prefix/suffix."
+          },
+          {
+            "author": "Srikanth Reddy Kandula <srikanthreddy.iitp@gmail.com>",
+            "commit": "88066a817c1341690e124d93b499f34550214a69",
+            "comment": "Fixing the up and down arrows position and behavior according to RTL expected behavior"
+          },
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "7d5b46f17b9fe7f997b815d77e5a2e4a4d038579",
+            "comment": "Removed unused scss file in Sticky component"
+          }
+        ]
+      }
+    },
     {
       "version": "5.45.0",
       "tag": "office-ui-fabric-react_v5.45.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 8dd275f39ede6..775681a12afdb 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,20 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 30 Jan 2018 11:22:56 GMT and should not be manually modified.
+This log was last generated on Wed, 31 Jan 2018 11:11:59 GMT and should not be manually modified.
+
+## 5.45.1
+Wed, 31 Jan 2018 11:11:59 GMT
+
+### Patches
+
+- swatch color picker - add ability to add aria-label
+- ChoiceGroup: Wrap long text for image and icon types.
+- updating willReceiveProps of date picker to not run validation unless the props actually changed
+- ComboBox: ComboBoxes were changed to always expand which is incorrect behavior, fixing to align with the correct design
+- ContextualMenu: Remove the list in the menu and move the aria-label/labelledby to the correct element
+- TextField: fixed whitespace wrapping with prefix/suffix.
+- Fixing the up and down arrows position and behavior according to RTL expected behavior
+- Removed unused scss file in Sticky component
 
 ## 5.45.0
 Tue, 30 Jan 2018 11:22:56 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index a401a4ee06fca..7a28ef220fe84 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.45.0",
+  "version": "5.45.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From b17a45fe057f50aa489be21d3e517d783b40b9e1 Mon Sep 17 00:00:00 2001
From: Jordan Janzen <jordancjanzen@gmail.com>
Date: Wed, 31 Jan 2018 10:33:33 -0800
Subject: [PATCH 1299/1641] Controlled TextFields (#3796)

* Add isControlled flag that enables/disables onInput and onChange so TextFields with a value prop can't be edited by users, use defaultValue instead (BREAKING CHANGE).

* Update docs to clarify usage of value and defaultValue.

* Add examples using value and defaultValue

* Remove redundant check on _isControlled flag.

* Clarify examples

* npm run change output

* Add readOnly to non-editable example fields.

* Trying: Add readOnly to input/textarea if _isControlled is false instead of requiring it on the TextField component props to pass jest.

* Change NumberTextField value to defaultValue

* DatePicker use defaultValue instead of value on TextField

* Error examples use defaultValue instead of Value.

* TextField tests to use defaultValue instead of value.

* Update snapshots.
---
 ...controlled-textfield_2018-01-24-23-29.json | 11 ++++++++
 .../__snapshots__/ColorPicker.test.tsx.snap   | 25 +++++++++++-------
 .../src/components/DatePicker/DatePicker.tsx  |  2 +-
 .../__snapshots__/DatePicker.test.tsx.snap    |  2 +-
 .../components/TextField/TextField.test.tsx   | 26 +++++++++----------
 .../src/components/TextField/TextField.tsx    | 12 ++++++---
 .../components/TextField/TextField.types.ts   |  2 +-
 .../__snapshots__/TextField.test.tsx.snap     |  1 +
 .../TextField/examples/NumberTextField.tsx    |  2 +-
 .../examples/TextField.Basic.Example.tsx      | 15 +++++++++++
 .../TextField.ErrorMessage.Example.tsx        |  8 +++---
 11 files changed, 71 insertions(+), 35 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/-1350-controlled-textfield_2018-01-24-23-29.json

diff --git a/common/changes/office-ui-fabric-react/-1350-controlled-textfield_2018-01-24-23-29.json b/common/changes/office-ui-fabric-react/-1350-controlled-textfield_2018-01-24-23-29.json
new file mode 100644
index 0000000000000..7a07c28b30bbc
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/-1350-controlled-textfield_2018-01-24-23-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Adds the _isControlled flag to the TextField component that disabled onChange if the value prop is set, which follows developer expectations with React inputs.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-jojanz@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/__snapshots__/ColorPicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ColorPicker/__snapshots__/ColorPicker.test.tsx.snap
index 0776b8f363c6d..98b91e6a9727f 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/__snapshots__/ColorPicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/__snapshots__/ColorPicker.test.tsx.snap
@@ -128,9 +128,10 @@ exports[`ColorPicker renders ColorPicker correctly 1`] = `
                     className="ms-TextField-field"
                     id="TextField0"
                     onBlur={[Function]}
-                    onChange={[Function]}
+                    onChange={undefined}
                     onFocus={[Function]}
-                    onInput={[Function]}
+                    onInput={undefined}
+                    readOnly={true}
                     spellCheck={false}
                     type="text"
                     value="ffffff"
@@ -162,9 +163,10 @@ exports[`ColorPicker renders ColorPicker correctly 1`] = `
                     className="ms-TextField-field"
                     id="TextField2"
                     onBlur={[Function]}
-                    onChange={[Function]}
+                    onChange={undefined}
                     onFocus={[Function]}
-                    onInput={[Function]}
+                    onInput={undefined}
+                    readOnly={true}
                     spellCheck={false}
                     type="text"
                     value="255"
@@ -196,9 +198,10 @@ exports[`ColorPicker renders ColorPicker correctly 1`] = `
                     className="ms-TextField-field"
                     id="TextField4"
                     onBlur={[Function]}
-                    onChange={[Function]}
+                    onChange={undefined}
                     onFocus={[Function]}
-                    onInput={[Function]}
+                    onInput={undefined}
+                    readOnly={true}
                     spellCheck={false}
                     type="text"
                     value="255"
@@ -230,9 +233,10 @@ exports[`ColorPicker renders ColorPicker correctly 1`] = `
                     className="ms-TextField-field"
                     id="TextField6"
                     onBlur={[Function]}
-                    onChange={[Function]}
+                    onChange={undefined}
                     onFocus={[Function]}
-                    onInput={[Function]}
+                    onInput={undefined}
+                    readOnly={true}
                     spellCheck={false}
                     type="text"
                     value="255"
@@ -264,9 +268,10 @@ exports[`ColorPicker renders ColorPicker correctly 1`] = `
                     className="ms-TextField-field"
                     id="TextField8"
                     onBlur={[Function]}
-                    onChange={[Function]}
+                    onChange={undefined}
                     onFocus={[Function]}
-                    onInput={[Function]}
+                    onInput={undefined}
+                    readOnly={true}
                     spellCheck={false}
                     type="text"
                     value="100"
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 35fd4a6ed376e..093cfaa8f0d6a 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -226,7 +226,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
               )
             } }
             readOnly={ !allowTextInput }
-            value={ formattedDate }
+            defaultValue={ formattedDate }
             ref={ this._resolveRef('_textField') }
             role={ allowTextInput ? 'combobox' : 'menu' }
           />
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap
index 213d16b79fbc4..66caed779204f 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap
@@ -30,7 +30,7 @@ exports[`DatePicker renders default DatePicker correctly 1`] = `
             onInput={[Function]}
             onKeyDown={[Function]}
             placeholder={undefined}
-            readOnly={true}
+            readOnly={false}
             required={false}
             role="menu"
             type="text"
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
index cca8acb446834..883c7f5866cfc 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
@@ -37,7 +37,7 @@ describe('TextField', () => {
     const renderedDOM: HTMLElement = renderIntoDocument(
       <TextField
         label={ exampleLabel }
-        value={ exampleValue }
+        defaultValue={ exampleValue }
       />
     );
 
@@ -84,7 +84,7 @@ describe('TextField', () => {
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <TextField
-        prefix={ examplePrefix}
+        prefix={ examplePrefix }
         suffix={ exampleSuffix }
       />
     );
@@ -98,7 +98,7 @@ describe('TextField', () => {
 
   it('should render multiline as text area element', () => {
     const renderedDOM: HTMLElement = renderIntoDocument(
-      <TextField value='This\nIs\nMultiline\nText\n' multiline />
+      <TextField defaultValue='This\nIs\nMultiline\nText\n' multiline />
     );
 
     // Assert on the input element.
@@ -110,7 +110,7 @@ describe('TextField', () => {
     const renderedDOM: HTMLElement = renderIntoDocument(
       <TextField
         label='text-field-label'
-        value='whatever value'
+        defaultValue='whatever value'
       />
     );
 
@@ -154,7 +154,7 @@ describe('TextField', () => {
       const renderedDOM: HTMLElement = renderIntoDocument(
         <TextField
           label='text-field-label'
-          value='whatever value'
+          defaultValue='whatever value'
           onGetErrorMessage={ validator }
         />
       );
@@ -174,7 +174,7 @@ describe('TextField', () => {
       const renderedDOM: HTMLElement = renderIntoDocument(
         <TextField
           label='text-field-label'
-          value='whatever value'
+          defaultValue='whatever value'
           onGetErrorMessage={ validator }
         />
       );
@@ -190,7 +190,7 @@ describe('TextField', () => {
       const renderedDOM: HTMLElement = renderIntoDocument(
         <TextField
           label='text-field-label'
-          value='whatever value'
+          defaultValue='whatever value'
           // tslint:disable-next-line:jsx-no-lambda
           onGetErrorMessage={ () => errorMessage }
         />
@@ -203,7 +203,7 @@ describe('TextField', () => {
       const renderedDOM: HTMLElement = renderIntoDocument(
         <TextField
           label='text-field-label'
-          value='whatever value'
+          defaultValue='whatever value'
           // tslint:disable-next-line:jsx-no-lambda
           onGetErrorMessage={ () => Promise.resolve(errorMessage) }
         />
@@ -217,7 +217,7 @@ describe('TextField', () => {
       const renderedDOM: HTMLElement = renderIntoDocument(
         <TextField
           label='text-field-label'
-          value='whatever value'
+          defaultValue='whatever value'
           // tslint:disable-next-line:jsx-no-lambda
           onGetErrorMessage={ () => '' }
         />
@@ -275,7 +275,7 @@ describe('TextField', () => {
 
       const renderedDOM: HTMLElement = renderIntoDocument(
         <TextField
-          value='initial value'
+          defaultValue='initial value'
           onGetErrorMessage={ validatorSpy }
           validateOnFocusIn
         />
@@ -298,7 +298,7 @@ describe('TextField', () => {
 
       const renderedDOM: HTMLElement = renderIntoDocument(
         <TextField
-          value='initial value'
+          defaultValue='initial value'
           onGetErrorMessage={ validatorSpy }
           validateOnFocusOut
         />
@@ -322,7 +322,7 @@ describe('TextField', () => {
 
       const renderedDOM: HTMLElement = renderIntoDocument(
         <TextField
-          value='initial value'
+          defaultValue='initial value'
           onGetErrorMessage={ validatorSpy }
           validateOnFocusOut
           validateOnFocusIn
@@ -349,7 +349,7 @@ describe('TextField', () => {
 
       renderIntoDocument(
         <TextField
-          value='initial value'
+          defaultValue='initial value'
           onGetErrorMessage={ validatorSpy }
           validateOnLoad={ false }
         />
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index bb711fbd70f7e..3222f58884723 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -55,6 +55,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
   private _latestValue: string | undefined;
   private _latestValidateValue: string | undefined;
   private _isDescriptionAvailable: boolean;
+  private _isControlled: boolean;
   private _textElement: HTMLTextAreaElement;
 
   public constructor(props: ITextFieldProps) {
@@ -86,6 +87,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
     this._delayedValidate = this._async.debounce(this._validate, this.props.deferredValidationTime);
     this._lastValidation = 0;
     this._isDescriptionAvailable = false;
+    this._isControlled = typeof props.value !== 'string';
   }
 
   /**
@@ -352,8 +354,9 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
         { ...textAreaProps }
         ref={ this._resolveRef('_textElement') }
         value={ this.state.value }
-        onInput={ this._onInputChange }
-        onChange={ this._onInputChange }
+        onInput={ this._isControlled ? this._onInputChange : undefined }
+        onChange={ this._isControlled ? this._onInputChange : undefined }
+        readOnly={ !this._isControlled }
         className={ this._getTextElementClassName() }
         aria-describedby={ this._isDescriptionAvailable ? this._descriptionId : null }
         aria-invalid={ !!this.state.errorMessage }
@@ -374,8 +377,9 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
         { ...inputProps }
         ref={ this._resolveRef('_textElement') }
         value={ this.state.value }
-        onInput={ this._onInputChange }
-        onChange={ this._onInputChange }
+        onInput={ this._isControlled ? this._onInputChange : undefined }
+        onChange={ this._isControlled ? this._onInputChange : undefined }
+        readOnly={ !this._isControlled }
         className={ this._getTextElementClassName() }
         aria-label={ this.props.ariaLabel }
         aria-describedby={ this._isDescriptionAvailable ? this._descriptionId : null }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts b/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts
index 7f32537bc68d4..ca25da994a6df 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts
@@ -132,7 +132,7 @@ export interface ITextFieldProps extends React.AllHTMLAttributes<HTMLInputElemen
 
   /**
    * Current value of the textfield. Only provide this if the textfield is a controlled component where you
-   * are maintaining its current state; otherwise, use the "defaultValue" property.
+   * are maintaining its current state; otherwise, use the "defaultValue" property. User can't edit if supplied.
    */
   value?: string;
 
diff --git a/packages/office-ui-fabric-react/src/components/TextField/__snapshots__/TextField.test.tsx.snap b/packages/office-ui-fabric-react/src/components/TextField/__snapshots__/TextField.test.tsx.snap
index 5fb70d8366cdf..de2efec846269 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/__snapshots__/TextField.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/TextField/__snapshots__/TextField.test.tsx.snap
@@ -43,6 +43,7 @@ exports[`TextField renders TextField correctly 1`] = `
         onChange={[Function]}
         onFocus={[Function]}
         onInput={[Function]}
+        readOnly={false}
         type="text"
         value=""
       />
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/NumberTextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/NumberTextField.tsx
index 899829d9ce115..34ad4ead87cef 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/NumberTextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/NumberTextField.tsx
@@ -30,7 +30,7 @@ export class NumberTextField extends React.Component<INumberTextFieldProps, INum
         <TextField
           className='NumberTextField-textField'
           label={ this.props.label }
-          value={ this.state.value }
+          defaultValue={ this.state.value }
           onChanged={ this._onChanged }
           onGetErrorMessage={ this._validateNumber }
         />
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
index 0413006a10d4f..658e203cd2bb1 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
@@ -9,6 +9,21 @@ export class TextFieldBasicExample extends React.Component<any, any> {
         <TextField
           label='Standard'
         />
+        <TextField
+          label='Standard with a blank value attribute'
+          value=''
+          description='Can not be edited by the user.'
+        />
+        <TextField
+          label='Standard with value attribute'
+          value='With a set value.'
+          description='Can not be edited by the user.'
+        />
+        <TextField
+          label='Standard with defaultValue attribute'
+          defaultValue='With a set defaultValue.'
+          description='Can be edited by the user.'
+        />
         <TextField
           label='Disabled'
           disabled={ true }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx
index a9b365f259e13..fb70dca88a381 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx
@@ -25,23 +25,23 @@ export class TextFieldErrorMessageExample extends React.Component<{}, {}> {
         />
         <TextField
           label='TextField with a string-based validator. Hint: the length of the input string must be less than 3.'
-          value='It should show an error message under this error message on render.'
+          defaultValue='It should show an error message under this error message on render.'
           onGetErrorMessage={ this._getErrorMessage }
         />
         <TextField
           label='TextField with a string-based validator. Hint: the length of the input string must be less than 3.'
-          value='It will run validation only on input change and not on render.'
+          defaultValue='It will run validation only on input change and not on render.'
           onGetErrorMessage={ this._getErrorMessage }
           validateOnLoad={ false }
         />
         <TextField
           label='TextField with a Promise-based validator. Hint: the length of the input string must be less than 3.'
-          value='It should show an error message under this error message 5 seconds after render.'
+          defaultValue='It should show an error message under this error message 5 seconds after render.'
           onGetErrorMessage={ this._getErrorMessagePromise }
         />
         <TextField
           label='TextField has both description and error message.'
-          value='It should show description and error message on render at the same time.'
+          defaultValue='It should show description and error message on render at the same time.'
           description='This field has description and error message both under the input box.'
           onGetErrorMessage={ this._getErrorMessage }
         />

From 66a91aadb99bca3923125d62cadc15984dba0be6 Mon Sep 17 00:00:00 2001
From: Srikanth Deshpande <srideshpande@users.noreply.github.com>
Date: Wed, 31 Jan 2018 12:57:08 -0800
Subject: [PATCH 1300/1641] Adding new WOFF files to the @uifabric/icons/fonts
 folder (#3848)

* new line

* Updating icons

* rush change file

* Removing the third party logos from the list of icons being exported

* Updating the names of enum, not to start with a number

* Adding new WOFF files to the @uifabric/icons/fonts folder
---
 ...ideshpande-icon-update_2018-01-24-23-44.json |  11 +++++++++++
 .../icons/fonts/fabric-icons-0-2e092c7d.woff    | Bin 0 -> 11648 bytes
 .../icons/fonts/fabric-icons-0-8a1666a2.woff    | Bin 11984 -> 0 bytes
 .../icons/fonts/fabric-icons-1-a86438ef.woff    | Bin 0 -> 11900 bytes
 .../icons/fonts/fabric-icons-1-a961c249.woff    | Bin 12024 -> 0 bytes
 .../icons/fonts/fabric-icons-10-90d2dc10.woff   | Bin 0 -> 10640 bytes
 .../icons/fonts/fabric-icons-10-a9486bb8.woff   | Bin 12224 -> 0 bytes
 .../icons/fonts/fabric-icons-11-18d2ffa4.woff   | Bin 0 -> 14500 bytes
 .../icons/fonts/fabric-icons-11-c0dbf638.woff   | Bin 15192 -> 0 bytes
 .../icons/fonts/fabric-icons-12-6c96597e.woff   | Bin 0 -> 14384 bytes
 .../icons/fonts/fabric-icons-13-02c4bea1.woff   | Bin 0 -> 15084 bytes
 .../icons/fonts/fabric-icons-14-36569c01.woff   | Bin 0 -> 2364 bytes
 .../icons/fonts/fabric-icons-2-2be8dca9.woff    | Bin 12124 -> 0 bytes
 .../icons/fonts/fabric-icons-2-e2ae1f0c.woff    | Bin 0 -> 12568 bytes
 .../icons/fonts/fabric-icons-3-80b6008d.woff    | Bin 14136 -> 0 bytes
 .../icons/fonts/fabric-icons-3-a13cb765.woff    | Bin 0 -> 13976 bytes
 .../icons/fonts/fabric-icons-4-46fbc7bc.woff    | Bin 15328 -> 0 bytes
 .../icons/fonts/fabric-icons-4-97372384.woff    | Bin 0 -> 15464 bytes
 .../icons/fonts/fabric-icons-5-125dbde8.woff    | Bin 0 -> 15340 bytes
 .../icons/fonts/fabric-icons-5-5bc71068.woff    | Bin 13452 -> 0 bytes
 .../icons/fonts/fabric-icons-6-2e7e2914.woff    | Bin 0 -> 11264 bytes
 .../icons/fonts/fabric-icons-6-328cd253.woff    | Bin 12148 -> 0 bytes
 .../icons/fonts/fabric-icons-7-143895dd.woff    | Bin 0 -> 13464 bytes
 .../icons/fonts/fabric-icons-7-1bae3315.woff    | Bin 11204 -> 0 bytes
 .../icons/fonts/fabric-icons-8-bd2a110b.woff    | Bin 0 -> 13172 bytes
 .../icons/fonts/fabric-icons-8-bf5c8e0c.woff    | Bin 13772 -> 0 bytes
 .../icons/fonts/fabric-icons-9-8ab77260.woff    | Bin 0 -> 12344 bytes
 .../icons/fonts/fabric-icons-9-a362212c.woff    | Bin 11244 -> 0 bytes
 packages/icons/fonts/fabric-icons-cf6d96bb.woff | Bin 0 -> 6524 bytes
 29 files changed, 11 insertions(+)
 create mode 100644 common/changes/@uifabric/icons/srideshpande-icon-update_2018-01-24-23-44.json
 create mode 100644 packages/icons/fonts/fabric-icons-0-2e092c7d.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-0-8a1666a2.woff
 create mode 100644 packages/icons/fonts/fabric-icons-1-a86438ef.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-1-a961c249.woff
 create mode 100644 packages/icons/fonts/fabric-icons-10-90d2dc10.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-10-a9486bb8.woff
 create mode 100644 packages/icons/fonts/fabric-icons-11-18d2ffa4.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-11-c0dbf638.woff
 create mode 100644 packages/icons/fonts/fabric-icons-12-6c96597e.woff
 create mode 100644 packages/icons/fonts/fabric-icons-13-02c4bea1.woff
 create mode 100644 packages/icons/fonts/fabric-icons-14-36569c01.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-2-2be8dca9.woff
 create mode 100644 packages/icons/fonts/fabric-icons-2-e2ae1f0c.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-3-80b6008d.woff
 create mode 100644 packages/icons/fonts/fabric-icons-3-a13cb765.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-4-46fbc7bc.woff
 create mode 100644 packages/icons/fonts/fabric-icons-4-97372384.woff
 create mode 100644 packages/icons/fonts/fabric-icons-5-125dbde8.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-5-5bc71068.woff
 create mode 100644 packages/icons/fonts/fabric-icons-6-2e7e2914.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-6-328cd253.woff
 create mode 100644 packages/icons/fonts/fabric-icons-7-143895dd.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-7-1bae3315.woff
 create mode 100644 packages/icons/fonts/fabric-icons-8-bd2a110b.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-8-bf5c8e0c.woff
 create mode 100644 packages/icons/fonts/fabric-icons-9-8ab77260.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-9-a362212c.woff
 create mode 100644 packages/icons/fonts/fabric-icons-cf6d96bb.woff

diff --git a/common/changes/@uifabric/icons/srideshpande-icon-update_2018-01-24-23-44.json b/common/changes/@uifabric/icons/srideshpande-icon-update_2018-01-24-23-44.json
new file mode 100644
index 0000000000000..6fcb96111e0eb
--- /dev/null
+++ b/common/changes/@uifabric/icons/srideshpande-icon-update_2018-01-24-23-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/icons",
+      "comment": "Updating fabric icons in office-ui-fabric-react's  @uifabric/icons package",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/icons",
+  "email": "srdeshpa@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/icons/fonts/fabric-icons-0-2e092c7d.woff b/packages/icons/fonts/fabric-icons-0-2e092c7d.woff
new file mode 100644
index 0000000000000000000000000000000000000000..92734d72845d0c83f0940b8de88857422b744575
GIT binary patch
literal 11648
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

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-0-8a1666a2.woff b/packages/icons/fonts/fabric-icons-0-8a1666a2.woff
deleted file mode 100644
index e8f693e573c726bd3e3449c392205fd89c34b136..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 11984
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
Klz3kW`2PWbtok|t

diff --git a/packages/icons/fonts/fabric-icons-1-a86438ef.woff b/packages/icons/fonts/fabric-icons-1-a86438ef.woff
new file mode 100644
index 0000000000000000000000000000000000000000..5a7ffad2bd4a2d466eb4f9e72079d689eae3d69e
GIT binary patch
literal 11900
zcmZ8{b8ux(wDpa3<B2Ai*tRjz#C9^VZQGvMwkGDpwr$(SP4eaUz4zDKr&jgZtJm)C
z>aN<==hSwU6B7e~0ltjh3xM=rt8@$iFIf8T?f;sb5(6^;04DOq|N4R+GnE~Wp|!r<
z7Z>#faR30~yV$*CfT4>MApihA|E2kA0n~6SaMdPurq*BF{g;3JrPTmsAI6yKJATDN
z?0<2<{|{IIuBnx~$rtyfA(aLI1ovagmZ;2(^^E`kO5QIG+ZWj1wT&dqzQ`}m>C4Cc
z0x1eOEV!AqliL^f=gT+y!X#N7=9rbO;eWd4FMs?$+~GppTkE@h%}dq)<r92?5byxr
zVxw<u{Kb8(1>z9^fP0NkxK^^Wb^IEiZv9L1?LXb80$|<F!T2kd?rVL3@Gs1{b=)Gk
zWg6<~fA(<t`zQJPJ7ZQbK|mC+2AOmY{~09h?-?B(819FK1_}~(`vE$8;NgKtQ$M=)
z_W^fAq!8-(2tg&?-2ecB035(Ab7E$UMnoSQ`uZx0sZK#D^hj%*RwOZhL{e3;>9GkG
zVJVThH4!adij*q8Qbc3;Cz`@A65Nak`j%tZ9y?on%v_pzgs&d&L%Z$OX|r1}3Kg+x
z&h$BzcAK~P<i%qCBT@u&9JQp1`UZ_~8g)J`d|R3rgR_a^thhjZ+L#w6b2nOYeLzCy
zE~_c$7!<vIaE0~}baP7|-{qa3IPVVClv|Hfh}#(B)w5tib<}O-Rs&GqEM)9gGc6I?
zqxkwGV_$9kuFE8YC$avNW87F%hsj#T`r%*0AGgc3Q`T=095GdRZ|~J~k;a0UBj9Ni
z@3Umi>d!$`G^jne-?DFl#M_s(h=MGm41opMJ&YlYVPN+K$Q{Q*9BnB5c-%8FNDX-l
z<_PICL1L`A1kR<Rh~;_0-I3+X4DlEf3DWPr`!JHHtEON3XgF;EYfPzUrl&qI+`Zg=
z-tFes0~QI30sxfb!6dn5>cn=*_6Y(99Z4I4C<M8QvYe@flftr2LZnFN$;g05MSk;=
zg;#!w!2=LeyEZs?2C(C(AM{OKQ?FiKjwLT6UM`tM;?z{CnH)R0^9V?%7isS=L~>W`
z#`@9=?y675Jr;2Jma<q6GBswy(+|ng)&xJAGU*Ib24b#f?Pfz{PpttirCme#yDGf#
z10+FcTXHwvQBtpsw5lO<k>r&SPrvK$O2MQD4AI^0zoYmL7YaC=qVHL88LxHAItGa3
zjDkOjqzAo8#ri(v#(##qSr2zr2tCNG-(%i~>h}cH<fWLd$-{ludqD~U84Uu!0N?;v
z0Q~1C0NE|G$P>X0Zz1Wh<KcX<ph!_b(n5kxrMXSZx?|zgW-R_7*=nT@=tGPv<ugbQ
z7AQlAT?1EWfZXK1JVt_>3ar7w?bAaxx+T;IVN_sGGh!z_(|E4Si0;H`hd7TPhe?n&
zAunA}S#`8gY1E>FV5z55S*mJlw%PE!bO#+}t_6`yp%R1q-6(d#rGJUdB$gJNP2Kor
ze6l}T8)k;N9uk1!YqGmT14&Ma>tsn4CBm>)6+|O@Nz#9YNA8=9AM+|tp-Gx4FFLm2
z6tT4BPMsVAqtU>!eG#*D;cTfXRQjcI(}=}H$;zpTJ2mp`FzeSF;@F%ZCN*NlPw-H~
zB?>RPCh_0jay~VAZ=U2Pvf3%}YP*6+u#RMVk9SDU7}=4;)Sw|2N;!7r7H7hU&wiYO
zoK%;b&EiP7$uez@A+u+~C$q~aaO#l6=5WzK{IMu-uJC1@L_KRfkVmpDkKOMm+M%4K
zN4eR79<qc_?QeUg$fot7Iqx_Bp0ugD?p`1S+MlmKq)k5iuzcNeTiSPaa8nq%ZgvnK
zH5Rc1ERswg29ULkg&0o#vg}XMi0;TUq;PS_EJqrRaMJ>Cs8E9u)lc`8(pj8Z(v<Z;
z5{MLq*Xi-+k%%)!wqcS!7m`d8_Qv*UeTpOtir%$h97Qk2Iw@!I_|EU|Ws9rrmyu43
zu|5{=fqz3^RhuIUot<@I7k`%+KOiDL7$-6$It604!8RP-uRAf4pVsQJ!*Co*@Z%Cp
z1aaln<?(24;oR7-hCF~+YZNd&`+O$MAyyZh`U891#G@UHyYa|-0z)T@^OV$e)iryS
zo|B!hh$M0com-l~1W1B+6Nq=zCG~@jr6^Y3QBs^nJA}_WRn0;R4d>(ecv%sF@&ua+
z*c%I22+)RQSp{&sBpBCG1+n&B{RU2F{UHZ*mNA)YX*z9=tk8Roaq82<yCg4GC^pw~
z;WJrOHs8m@Fn=7Zyn|R>LZ1YTmb8=6JFG2}Z;g&xNi1a(k+q-Fd;%d2DH8^GLE(5H
z+rwpF<WS8v1B9qEQTGUC6agX|>Y=pk>2F-J7#zl;{?`n$Ha*U4_jC!0FvIOJG}Lkj
z9C9|3Q@N?PGZP7enEVmOXGr(&<ij2?l~s|HxuNPugonz`b5Zb>@8o>HkYzi|x~TX$
z%=vBjkwnV^34(fY>y>6-IBpZ{a5dYBvT~q^;_SQW<(Wxkxg~z!knjwfj@aj#<i@>{
zt_b_1?xs7}LBcNU`ziiGpZMXQ*3V-uf}rMKDsPn2Df@>7xikW0NEy1JTk208(ccEJ
zi?jUi6<}$5^G=dJ|LpI~=De4pHgTAsNnB%kUuYc$x1*75qh@Pg*_b}^#OmWZJEw{k
zunmQ--n8eZYoTtV9Az)GHzICBOgo$(WOokYF&ln!>5c2FSd6?{xf*l1TDv%%r@y6(
zaa4cD({8jtSyQaL*};X`DT=NUV~Lo0<0o@h1QGBmEh30tduDgc%wsj;NcC^AXc*Uc
z8e4i#H&F<>Vp;5d-$vy?Vcsjgi6Zx_8t(gnoE)T^;>-2P?41?a$z)!Y$8})P2+s67
zJJiEUzqrNOb~SS1Id;xmIWyh_Rug&mupR!u$!0L@^u8UEf`t0`#dhv)I@v*i_4_VR
z6V*tDespSohrovcy9Blk!-+bnM-~diuhHA}i<2O*OBUNL3_V_rG$w&f{k4!;gylrK
zjcla?dfrda?`Ayk=hI;H*;MAs<b6@fB)=nQdGhZ}H(%9MmoS7bJ?6CG=lvl9PC8@w
z-v(%xjVG9fyY-@zt4uBuRKr0pt9brFnGJUD@D0tbS^>vCMC2$RccteUUoUgH+QPql
zH>>!i6ar?yH{Gu0|H|z|+Di&zm9u#M^^0Ohizc;m>8_$0;$)qLlrf)2*0q!GN)A}5
zx5auv8K+cIg2Y<ZOUG8>fqA-Xv9k+yCG|%7t+FkTuYQ7Y_vX4Kqt*_N9!S1UbNICF
zu&gdj%QI;f{R))UVqKpd@$a7p+6xL1^)EboXNID?X%%qY9|}R3QTb;w9c{Wld^B2K
z`99!NXYtFB9gU7>b+%o4J`rFux1K_{m_{b$DoyrzA<Fmsk}{a7%Vv!u%N0##K0|PV
zFgz=<Gb=0XJ+G2`EKW6chRw?VUY++_h!-jm3KHrt;W$8)?bDYvEI2S#`qYvBhNJDo
zK>4%wd6agUA3Ja|Va@Np8BBDgZal#);l;6qE!Hk7mHSL;N_a@!y1T=D-#gVG))yE}
z*ULfXCfZK@2+$6_MxH-L+=u0o`M~}w+%BLv?GUf+h2x*ilEvD1ysGHG%$rLL30Ha&
z{8V685_x|_tfQ&Oz;K2w$9`;9K67ZJ!Q(aOW~mSFarP|JXW7iz=ppRTE*zOJbh*Zs
z9%hm8Hp_6n@%FRL)^TQI<*q0_nnHc&9vrb%*&N;8aAVc_?KRUyX{xxf!<DaQF>h}b
z=5n>7C@0I|^zG4FOABjdW>5R+Jj}^zxy5j35D_2YGMirE<i#~hpSxg3LIV98E%_bf
zwJY$sA>lrrRYNS~kCy!j&JS>`a;V%wCbvQ&9WaP|7fKM56>MnaHm<2@f)b6Ev7V@i
z0GA!g>KQ4{mK8IG9vIshBQ`v%K4UR`TzgD`wGLO(H`z&a!4FK%^o%OYrFKp)zf<=t
z@9o;X5TRJD)D(RmgDHKe6%l@@yI-#)$yLx5c*$58BxR&I5!4d4XvHC0`8niDsO1A}
z1YW4o(8|;Hn<#dA+<ng|tT_f)3xLg}P0w4b3G|Ws&eZA>eRJX_hUkG!4^?Sd*3aD$
z3MzL+-`LZu6S@2m$UG2wCy%9-7jmw)i)@Ll$^!O2g$j|YcXce^<mWOWn~JJjc+sUi
z#_(svPE(MswOqqW$qokhg}X<<2cmH=kKFih{~U;nFwX|md}6+uVXHRU^2sMheArVg
zwt$R0TYxGVRm=><V{U8pGhSz=R)+MaV#}>`8Z=0n;-M(*T`?Z>*>$cHdsI&hg6L7g
z2W#c=#kwqn8C4z^C`4=d%le-yO(nR6Cld5v5*wY|;pQ)TTk1XSn&q2?f3{t=M*GWu
z;2;i0rfcKk-fXryxRIg&X0|cdDSF(xSIeu(@1Pywk^QRBtC1$_3&Lby=(988ab0Dr
zwfz>-%Hd4u>EDi!9nx@v2{67&v!;2ba2AKTNL@$aeGK&1@PbPNLTVe5NP$h7g%1t!
zmeisB1c}k?qfSnFg-*zDI7Sp~Ed4BwD<UkpXMJddLi?Qje@8wbRoZx<{9>oWlW#44
z3($#L8hBH2{&NhfPz?k_W=VB(jQJLkEht}gD3-7EzPB*Oae2A7b+XoBFOPGTGwQB-
zekT*w3b)mX(Y$2_dWhzw{T0lyU6EhEwawe<*Bo#v=ivKJ+69|K*K28{ey-E#(=yRg
z-;nNEW9{}{{@Y$%_fd7K_~Y>KLx#_m4k92H5qq$ES$nETitk=GUrG&$7IlCOf+j_5
zq7JcPsJ)@*kdI?dAj^nlWvl_oj}lo|)L$=)x0iC7t8^f)6gFJgOK}iByUYohA&?(!
zo`^p|Ruomw9G(~AlS*EAshWGW!?9hh{Aon_RHM1x(@t&w^?Z8YtbB1R4lha!CISCr
zb^dr?zUlLI;Y8E6g-ij<${Nnoa;~EK>T2!w<X!8m{NHQ+#MOjBB7ke^=&^C>(62}O
zy_ZECsj>PLc$;JluDjG)$9LD7XG$;M(W|AVaj7;s`pwtfIIDS=|F=RQhVcSMowkCG
zDylNZCTp{|Mwh+t>Yh#56Kf||NuV>w69WCro};b_cEYK2ioQ{hd}?Y=nYw7-aM<`c
zyPJ6T7PelTp!=@)bY6fsQ!PlR`v>+=8HJ7!*@~D=lTnDMg_Vu$>iWbQ`&?}bh++Y2
zA<xK8?=el4;~wo#O;1x`8QMSf7JB_s&+^kge%r#%@^b#&hv2gcBj!kAV15ookz3%L
zlxHSM(N%tAOU7K}Tj*1*`n>3NADo!2fP9qt_kq{GT+D6l?nG>%8PKdKcica--;4|q
z=uVbMI<av6+WW)7AgCSU+zmMRrNe>9K}c67-yLw*9uXGT8B#1dE3*M&YKcE0V8*UB
z&i1?`qziZkmaJI~9ipg{IC=m$WxO^SYfG2=2&2DxGotZxFlsyajrF2XEzy{0?}j3W
z#}N{Rrbp>bE8tAWe``uB=(4C+5u)PcIeiAt0r}w3qc-J=DETW&>nq~7Ifq@hVYO0i
zxW#Q}3LnTX)w~wxy)E#o+Fpc^$NK$?*_3grPNKrkA@r!vaNd677*3BpnSiKVq6q6C
zv2qF0WsDnl++IYzjeh~|9aW-;#RiAKg%ue_prC<jW}qkAZ`FN$i^`Ym;z^Nw*TTN`
zsEy+rD;13>v7!`H23H`37P^ki`n&R!%mn)16`K*?g?Y=ifI&W&K)x2z<8I`U=Hcc)
z+%1B3C__xWkfp|FRM?$PVx466O1_>ItwJ|3z{9(-oR!sDI-#!LGmF%(nrqbKh~d`w
zS~(h%2!SNqMm`;l9iPRJ(_i1j<e$JZL{_wULBz<h?f`D2d>K2TPm*#1Ubj#TAtCe5
zj}?~CW+xXLF0aFtv%Bg!guOwzmiv}g6=GLBUbBzW*h<Ps8@8J78R&c35mM0^=(LYe
z)hP-?w|aN$!<G`j)_x55+yIl{N}C``<%3)><gG3&i>NK#i`GIkAwaG?94C1R!irb&
z8xKx404CAyvK5*03H*~Y%#3(-4V<8w+8#r222+0ACy`JP`S{ALbPx(TY40T6B?1Xw
zrN{COzUp%!5?|cY*XX1Er6Yxa@$T~})bLpT!*1KM>$$@Y&u*76ImUOuYso@<?BrSs
zSsrZd!so_SH-gW$^RpnZqVsulXUkqh0JQpU*#pvoQhmpJSXp5FT})HeB8(h`b)CNy
zks%Sy3N9&6{U`%TaG1Su-QuIClkaUcl#OqA(dIokO#r=r-`@uDy2o8ZL1Wc&IdAPr
z-h9<%Xyx%e;vWS?Uf4xV$3k47sFi?gkhYW!5i*M`m0L?3@l-Qw%uu1MV>diz`?wZE
z09|RNf_sHGlNUTm04i{gn_Gtv!FyxQ<nK0Tq$z)|3j2|K!Z-=`&Kbf06>#>__eAY!
z>$4)|QH?=^gVD!q3vuNf@ePR&8=)z>3h#G)S&8Xf`c9Ieb<c8f=m)6VU%=NaAyWHc
z;4zmU^eaV6yKv(O4mzy<*#S?4qf*+^l?EgSV<>H3Q?1SzSv|0{#<|bg7jV!oteiY?
zJ*1&GTiq&zqv>Co2rUH}fgw-ExedPKlYtPvBr|((h)h0(!zCM^s@vOP@HcmBs(Qv9
ztAoeaW)=jtc$RECu92ExO1WryAk&`wR^7t&7|$tGR26xQcQUwDb2*i+bPv*y7+T6#
ztwEZsdE<Wy_YQnlROlNX$O@cdbjBPMPm!a)%s4*MvygX=(SRH)IYL<Zo;1L|%#%OK
z!$@zGQh<#W5ZEyZPQ?{4ow<ZFFP?)O_!AN%EG7hj2qT!t|E+iZCv9NJtTlx5fLyp=
zR3)SY;<NX7Q|{j;@O26DmU!CaK^-=e4pc$1gD3r)z)g_Ax%<;*$Ck%wB#(!utJh7L
z?M370k~QOI=UH?~adEcC9{n2#|Nd`fE#7?q&DlW(hqf9hN~QB@gYOB0Z(uUhhEJT%
z7sC6Z_f?&hbW?dYwmYeqk-TuFmTe*yIq%5ev=U(1=Vb&32d?(K6E2MVS1(lb7^fD&
zxPs8|UNM!)^e|uWH4TRd{*l*W@)rx2PQ>K+B%xfLDQc|Sa)hQ?Axa>0Y>}V@fCw&1
zR|&c<&l57=V}F%otqH%CJ%A=8KXiAhc3D?;h$R@6)r92QL)#`>`)=AFg9eG$Nrotm
z1+iQsJ#Pk7-$S;rUY2G6I_p(uY-fnixBsrdJU$U9901+c>J;&@;7%A1s|Ytv24R?G
z%7JJ^3?1qZ(%`0(lhQ~;*;gftq!OfxBsI2|%UWsOb+)fdO9dK+;Z~=Sz!k@c;xG5e
zcCQgKWO~=j4;^;*dEl!4&L{Lu4Ckc$h7z^TCG|WR&XM)TNFjBUO79<oKeFc%V8sIU
zGsyk=Mn`#2-hwNt7TF!fO;jm$t#6zP&r8qmRfw9m0a3l21A=A%9*k{*df%O(h0HVp
zZ!(AC(0h3EY2y{P$k)Z>q4gq>-=p*@axYOfOY32~neu&h0%SkOddKTJzR$^LOHgoF
z3(DpjLMlojSfh$+bj6c;!sl#)a6{P+G#U<>2rOmZ;FV6hO<1=a9F?&7@fmc(+H5<k
zKGH!hw%u<7Z;LC3D<_P8$(FCbo_J$WmL2XFy9w<hjb`NQR|$C06<&-(G(s4&x+H%a
zHtp_eP4bFa7ri9X?e;>H#QbD}d2itsh+LrO6nRVAS3zRPg%-cVxC72$`4k4Hr1~sI
ze!!VXVtE~=<uN%I<H}TI!I93U<%3FvUsJi=cMwdlfC^1pW<$Hzl<jG`93Eui^={s(
zTEEdFC;%l!qx}8(5LYyAgU6_WY*YwicJ_xF;oK&EX-ygRq5Tb+7+|I_zc$88ayq%{
z2_tgW-+s6R)a4O|r;^cTqh){rKj*gIu0Ed&qv@?U?LQelcZ(z(q3erF9Z4@839FMB
zJK)Dbxr)$_82a7Xp)X1j*%Ncw5-bwF<ejBwyBrfs&Udq<?>O%o#+wl@YwWWTaxZB=
z^gaI&?;&Oq**b;;t4xJ%Q$3|Bldx6{r1TJ|^r>Y8>tWe(LSowz44K&0)an=WGL4lK
z=H<7QcN9Jr#qX|ROdp|AriE^d2{M)+&1z*RlHY3!{Z>fk>D{0=-%&<v)5y-cAN&qx
z@A{DhmOJ-9uQpLuMssRjFvhxM<k%YuRhohlR$tqm{dRi7s6tc$E`&u#amCyPTw>%n
zz&v)mo*um#%^V8$a{w|-ItyoiWtxIA`TiD<7^Vq5-VXt>7<+!@G?CBc8w`BfWc{75
zv_1AKpHJM;I!^;?hgLJ6d^JOi3i1chK{wf$NGoirrAX_#lh5kURuG#nhxrE<H|vY^
zRa`-{tsDl7%{UJ3PjJbXxN?<i9d-~#_}4FXn^)_#)bRM#&oWC5mjSS|rYy(Z>C{M0
zC>A@z`ABO7l#R^6ZQuYcBjHHKt=xW2Zbi_|`nS}#v{rjZF@EFt_0W7vjQ3>s=ocOJ
zlDnu#_&5H293JpNW(BBfN<=gzFTQ?bS}KQ>;`pz7{*AJOh4FegW0j8nN94=fp;6>i
zD?08<b|J}O<k<1=HrKS5{MJg+(Sei@4X$1?)vI6Jd6jJ9Y?GFtz*)YQx`Eb|%<nqA
zjub6NohCpB0Z=*<SIS#qOI1>=<L)7SamxJ9{Y>(X5jSO;n4GDd%`~d*q2rgknh(N4
zXl){94nJh5?l@Iae7i+pF6<vjc&}fazhU?X+zPshp{CXF&lL5Zv5;f*z2-()ZV}uX
z_Neh*!`s~lAkckYZ4V^?kw3;FiR~F{vG&`N8WL<QRjH)1v4)!=P$}13z#~%2o|XG!
zu`!Y!X_W{Bl?j4Xf6`=%b72x6S>?JiSP+u$Chr&q*k~I3J&MU;Gif>22tj-a+auMm
zeB(9y3o(9}7{_`tq;QLxUg*FD(;jVjjtC?QFy(^T*TJ|%yunciIlzDHg@-3Noxy3=
zo+J+upgTw!p6NBW{*-8#SM^ZwWwSMT`QA9GtFaVc$}aa<*eCRZuhD&JNf$*Azo!m#
zq0tuMvxdjfL{W!t;mPB?wCL`ULMJz5tj5c>yrrdruq(2*w$T`#XY)a22Xo05t98>v
zJ2I-_p03RER;zw4-%H0DPY~rlMu2cwN6Z=ybvN;DC~Wv{;>bAor_J!QmvrpWQ3Eea
z^BlhI1ceS$M|zpe`h!8@LeB%f@$7l!43j5hK}9>EmVa9QeD}iJdBbJ&_M~-|6bT9;
z6eDG~DpF@)|HGyr>rL$QC>e_<l0^9K{9!hqjtx_w?uA&ODQ;qaa3GC(GaLW8FQ3I!
zqS$I`BxwUJ9vE+8AJj+{98zi#H?dh8pIpZ?g|E}`N*PkW{Bp5r9V*^NzISL=ldXkS
zDQEK!g5fR)>R-d{+m*snUrE{hV+F<HsG?m>ngeFr>+aR28<DW#x?gn(e-ppY+j#89
z`S=8pr>>L=Ni|l7f7ZnL@Q!uIgV3vm*KO6a(b6#fTKt0$Jrwlodx7uE_VX%wbthsN
zLnpuL)?S50W!+Q#`seBnSEoB8<wysQ9PejJXm9MtV^IfQq|90Tfs~#y3}1~hv@uDq
zB~G*f>AP>%{;I5<H3b7U#cB)Y9R#@@tTh1bmTGrd5$kY>L{Atx7mM`!gJM;-g#ks<
zr%EJYRfp>#$Y;duP<Zc~?t8}8^}=CnhAL?$Wv;i+TCpWuTJYgn&PR?e<JvRfyFeJY
zFUh|y&HHaW5GUBRnDH_4mnQNia;=p*IE;?e(6ZQCat>Hb)O)=vD>rh5O8DkZw;!}P
zamty;xdD{&vst;>mm(L3sfw=t)Goc&rJb4G=>VIiNvoPk2L-TPeOJ`20NB-m(gZb&
z0;oBJ!M%#NP8Y9@wmsdol&*0OTkqSZot?F8*0JKO^GQ}Zt0sU>;y}o=pLFhus#Ug5
zCI<6Lrp9JKm1W|6ok~Z1T@7@wI{t@X9BqjN)I0k6Wg4y94Rh@sM%DxNqCti^W6;3m
zsf}n=xgrKfNGm)T`$vV0PWa-!UFb^GgpTyMLIwo3vm!=H^jITZo|vdPuyH<p!axBy
z8B-DXH`X5nfw6#Myh8NHp1cb<^Yx68J{U7v3N_mCV)l>|tXv_GGHKCyQewu5+tX+&
z?v-@ifR+o+P8wQ0pB=LX4V^paR_h+ylEbQnSk(s9N`4wAK0hLd&mG=#<aqAGB|P`m
zssA`Tw?cTc<0w~O$Yp0;bR%u<-dJsCueFb`V8*cq9z0yi?%lM7v^^TH77q=rHn|$M
zl(fcCKp5T`Ipr=Mt+=g?z{GAfC;|r+m9&~&7<ib^%lvKl*Ve0osyP2N%2qA@)iJ_K
zrAKx&_(!W>yUd$e^^<_w(>^C8>R$pAO12PDlqfCn$avFzxqo4%@m)HFG2O<y4Ef8U
zqaYZI)F(D&H$HW7w=0(PVk&)l<qc&<<qPJ7&)$o8Hj1;Q3$*z;oTvUPuXGNNI`2F0
z%P<vg>~<oex09dt4Oyh2V&A?>F3hF>x781popN1&)m?!O@WX)6tM96hb#)m@W9ln?
zqbl;3mpzn}jz{V(Ge|7?#5HvSZsX`uOf{T<kb3Dg2-inlY@qn71YOkhAWtT~uK`+M
zc%LIuW!eD~9hJ1b0)Pc}#q3+V^+zSsKvwg16b{&cVQy8!IwRnM7pr**k4c8?6)d*~
zY##92-Vt1`IXkmPeryV?wp|}wErN8)uE=j@FlE9y-$oXqO^|DA{FqZ`Hbo2I8_@ji
z6RHNxsTb4@5?lwyni>~>$jFCpYZu)KfJK<neL@bBbwOJ0f_+1rUOkOKq&tDu=-U}#
z(9n_PY$*@vbS3sZsU7Oa^nz#vU&D0r(DA~-^Twtp^P>LbZr!c!UcWeQ%aWrz@9)j6
z93BR~w)_E2U`YlvqN<iyk=;yM<;j|m9XgV@RTjz;ycQT*1Me`!pD=ikidUHGDw5$M
zcTsq<{J@lGnvDO<f=h|!me61rd>$qZtC@otVsfV?b&*t%F(I(`7Vc&iC>K&s$WNZm
z>6Jn1EdShM%3;BsoGy_~eWT6BS}BGC90cE@w^q4^VX02hnPYvxd^i{h$r=+y|CKMH
zw6VPi9q^K3CR^n~SywVwfOKsz1e#`xy4}(mK?$>55aJHLq+!W9(<}%3Gpw)at21#%
zq9rCC3b&1H@2-1Bq%o}5VksPBAgKNd^6MJn%-0(}++I*k#s{)fE!VW8`^=Zw+$eXt
z`;*Nf97c9U3B|8x8{mpb5Lt!)ejn;bUQ12s^v4rfX+vY^uMfFVSuck%MMat@3w1~w
z_^t8t=gfS7Wk?$35StSJY)-#CQDc74xuAh#KO7z=XZ)(Ege`W=IGTQJ_FFkdV_tAr
zH0J}8PwDpk@T-G*dY1oFHoO?ki{{V`P31lB3#51w!*f}fArkGOzqCJ0_bY~@5ZXx4
z8etD(G0Qe!xE!z9MWhbWyMOii7a2}wur#lsZBNoY6kbBk;z`2<^F*HvLMpV$4HiDd
zBA8!MbyK2mPe-Bq+J2KUa*PaLGdQJ<T3P{_O3tv}OEqlL0eJJDAvdF$9+d|nN2ilf
zK?~cprjaV^EK4zh+(qlx(||S1zot%+{>iweJX4aCDIdRP^B_=$Hq5}-j1y2%N5DtH
zt|`eD9)$7NZ!2c0Ir!}6oTbJ(w^!Vrr844pqa5z#cUFm)>L8|%%kNKg?<631?-$u}
zG%=T*EIt);;YpI+mpctudo2|AO$Wg+YzdY2S*#eMqB0eiGbgaFfC<74P6f_ohNq1n
zqWjJQH80{B-5llSF6XCk-L4inUGH<AX49r>Se_VBw}Hp;=NnLc5pHMD30jVM$pwRd
zwMaExi!=y|tlVb3?rK0cr{(R|GL|;{{NucXBu0zb;mXuiJOEwWaYUA_pk%&+IqX1z
z$@Mgj#s-7ZmLYodO6tn++eQRVKrItN&VGBoEAta)v_mL)G;)9X$hsk>M0N68<L%Kv
ztqTuU<+5?~fq&JXw@}%iE%GAjVsz2HozVdgq#prSG@yz*Ge%?q@~U;Uu}E_@F3B~{
z)|%ZT)VI9%*j<yq@rlwqUC)N<6p+D6R^o2+shXL6ZMUeyN#lR42{hPy%{7*f5E`!I
zP&CBEM!4JN;$3Mjds=E4m_-(TyFh%~6t`~A(=(<Oi+S5Os*ac}e=mTHDz{s_@)5-8
zPC1CrYcOgvBShq8g^u2%IX9J0D<z;OAIgL7r%9?c0z$w`v|u!6erM}DPu^};ZqS|V
z?^6sLwa0*-f%utxKG32HAX8T55gIQqJ=oBHV|5}N5^jiexwXd$^kpJ126sYM#EYzW
z)baxB!rN7eN*e*ghLp7BB^-cA_WLZZ)37XeqM|R#lcl4na2atppAlJ}lRv1y96SEH
z-aJ3LUj6vd_4&^>!?8pz!*LP=<0WA_BB280f6z{9H#mIJ1?qXp8`ad<9Xqus8&)7%
zzDl7EbQY3hyPDxOu5}}!P*qDxs-XWHVOw^mJP=PUptw-uVdZRim+sbzc`L<sp~Gk4
zoOEm8UT1$Y`RTFOgz$M%o2OUs9jNT6DSt0TM7LdGPIYF6T(Kk4;*wTfp}I^I88Gh1
zTeWZ0d`_R>7CXD%f0tcUW$i<@ny(@my)#`0?J8JVX&v2Iz7w5zq?NuDQ&pKD9s@d=
z$gilIU0SYe8!abQ$KX(p@@KDY6-~g1Q9A>9O+?f>2j0}=y3iuOrK5e2Wez7LErd|d
zHp7-|U=YMP9ArCS0sA&~P>p-YZW*+rElR8-z6&6edfB85Rk@8mwz#EdsJq<#xI{uU
zr^BCk*ttyA##J`%Y}4Ey8#9u{q~`5hb@)w9Q(@Qo@@M#F(`swhtgy_0graTiV7Z(;
zZ}i8#8*T-q8s=}+6dN;2M^~57P*=KY+wy8yr|3HZ33Fv!NLw9YQ5Bis^K#ld>gWSW
zDTrsT_%SGk9h%XN_I}5o&Psu^mHnDfASl(Mk^-(BI%HDiGVYqfKApK9_n?FMHSC8?
zultUi&YJNqBZ-VI_lfic8b$sU^h(=OdZi76_8A?8$)4U8Gh=5qUEB+aM>nnbG`s1m
zGf7rf$Af_8=IV;kJ$*OR)y<=L@{EzWfe+MF-BS>6Dcm-pE(jqXMP<$k0dhE`oD*X-
zX_(P?ZP(0Cf=-4-p?y^asLdEf&Utm7e?D5GICfe>+Ef80+!i~&sn^6Fls;#Po&jS+
zu-sTT5bhXL9dZB0?cvc3&2#AU&tiIog{1|)3M)hqiVqXG6d9oYBW4kSK9ApHfd-@@
z%~;IZ1Pva38VZVzw)T0AJo`AMXVn2m5KHBTPDb7k^qpZO(5++NV72qJu}W<@IkqFZ
z^so>9N2k2hSQsN)&9fjBUQcD3?Ubn*`iKN=4D6|R6@N9<G0Yfhla#C_EUDL}>Z%?T
zmSh7ONtDjm4py(ln9N7;YIZRxh7VdzsdQ-i?uZ{q+NQscQ~nWQP}>a5!v^M!n`Fh8
zh>^1q$W73CA*4`^W$eDUnwJE3ub#4HkEQUjIoci4<4$CMuMzr02GsgV{a5#9q^GB+
z>D3X;b^4pPYeEg$1_>Hv`SVE+BCONo-_6?Rm)SE03~=G33Vs8Wh#+-*70vxm+_oM7
z3@PMOu)Altd)N;?6`&mm`Tf7X1q1cL9sm>~5Ez9h$eg;v95y!JT?n6GV4)|d2n8O+
znC?FlllScxad;0vB(Vpq@aWT5%%p}87vei$Wdu0WnmGfOk8EbhZU}+WYi+D(3N(<1
ziOgLk1}aS1`T2tZPNz`*tKGu{umg+$K7f5NE3j>FT5wJ900@2vD~JGyc!&?kUyy}R
z04QRpXXxM1uQ0MOF0h=i{jmFRUT}4AAMn`lKJb<BrwGsp#0VY;?LaSJ4R8|?h$xHr
z7jYf&6-fli0?7lZ7-<rj09g<P1;qy?8)Y8l5tS5G1T`6T7mXjy4DA#h51kb~2z~h*
z`#0rp;}|9wVHn34ub9-BPMDKezp(nTk+6San_<UbcVj=|$m4|JEPiMFzKrXH2f$0j
ztHj&KxA-AXNKNSQzvuAFILc7o2mmI=I0DsA6%|KF4!|P;tNCxg8<piEaXG&E{^nVs
zGfzgN+%FZT${2`3=OAU}qLXkO{mrgVloG%jZz?iKLS)V?eUdkX_sZk}cdwL)>2cng
zlY5lyaqel$`e<_=Vx31Ib~iWo_U0)E?YCAir4RXjh2Z7M8=%#4c0+L9rv?|R@WHzS
zw_A<g3H>8b>Y3XMe2cstS-1BI?nigYwNx+1Hnxx4^WpK)4C#(A=jIzmK@|Cq9odWb
zv};&?+#HH_n9x02G=c(<buW6q0J#^UO|0+NFkv@8;I0C5@JPJ?LkT@oh;CdjL^~OK
z%?Vv-{6Q%&TkrR><5!!Wl(I6H)-_|4+3Hu7DKpF5=oBhslhO)<gp*FwAJM8SEUnk%
zSS4~fQv(vP+#xJFtV#E4Fl+IS7Z4tpcjrCtABjkB^;m5+nyG|^VZW(6;y)T|q)?^2
ziMo2%2IDxJX(%iUgqv7in8lvV*e%!CwGfYRR>uvFtagfM{;kX|GL5qz=Gp&c)`a68
z?x$G`OF9=pXC?O!k5d<+ai}()SIU#NOFA$9xhTnLd(A425v_|8H0NV%AmSPs6Im+#
z*YY+PMo3-2k4!YxCgrqUMTVdxAXR*gY6S=;O}9F`e-J#b3A8wExA@j%p4CxRA&ZyB
z^RpT=bxaJO&x=w^RjrslXo<+6By2$jz^wb`F%HDTi9&mb(A-88Q)#NAp;<6~G?Ght
zRE`;tZ(*NdQ=pVFj+ZT?aZOXe8*Gz0okwvB10|a1Gaj9vZiKiJ>LI!A5b%mP!9zP-
z>k)1L3ks{F2;<#!*Cdk!=6`4A<?@IB0cJ``liOe4%@eH~y=rTxQu+eCz-*z|`nE^)
zQ9r)IUqikUrvirfno#PF5m|AZ=}16yAf04#4Y<^;!>46f?bx=W{R{3~N*!)%1pQ4?
zE%U%K5mm}bvF?)o1AdcZcsn<1&o$UHoD0W<<_&8ceG0WGRxd<uOfKYOvw2D}6K6N3
z<J<XAUMNzL)T7wKq>C7GW_@1__GN*(mi(2jy-Yyb@%0*`D<3+aVIcbmt=fe`;OR8u
zK!*X}5dM|=PcM1Ap{x_@yM57;4x_D@H%T^eev%5PBPOT(-H2g};fiM1b*L^fjlY(u
zzso9Op5Uz=*5%TweGcDR=A1L1Xc&3J>FyHu+A`|dRU}urROhbO%d*xJWCo65AFj4j
z$erTcRt`F*cDfw?-TYlv@@JlM#GA|dZsM#4C47I;PN16#R$f?5=Fq-_`RB7!H8?(*
zrrC=|fYtMMR@wYAQpQqOB^I|+15rz{NtgphpitvR=Hm$G;uGg=J}vrbCnU9>c>?+1
zpI-6X<_EIto2^0?XZ-)<Srb6urw{M|m`aENpo#^jbIV-o&Yh?Uk4uoqut&!VTc2D=
z$F-;!?au4S;$d4Bl7sHw4Zp6L{sUR-mNn6M5G+K?kB@<aN`MlnEBiAw7NQ?*dvC|c
z6s#7q2hfkU%9uyk4H!09o`mH{hqGa2SvSLMnW?lZSlK82sx<41KJ>$#faCB;U?lnX
V2n`Ljv?>jU1?UH({Qi}I{~yM8;XeQX

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-1-a961c249.woff b/packages/icons/fonts/fabric-icons-1-a961c249.woff
deleted file mode 100644
index 8b48cac6875c31e328a8d481bf97297497b038f6..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 12024
zcmZ8{b8ux(wDpZ`+qP}%#+ul+ZA@(2n#{zSBsaD(u{E)i3BUZl_x^gjYE|#GdhfHV
z`kd3<)zx0g($WAhz?U&U1Cak~wKM?W-s=B(|JRh&S=a#pFv%}n_6x@B{LWft4kpfD
zTHF^{0RZs5ilx*5Gf#KYFaP&f%vTGbhg*gFY3Xd`@TF~h@$0Wx-M50H1S=D_uUv@9
zFAeek0~SDFW$$D8rL6z}lm`HSL^LTm*pan`i8%m3```1pzQFy~WZPr?C4Oo5U!33z
zl&Ija;MNZA-T(j{>KFg&15A^dV{O_ynSJ?m?qB@BI+Ku5SQ!o`-d}a;MZY-l7f1o8
z;O&kk4i;aU@mK9f008bKKKmNz?Bw>9$E@=egZW?Frz&8>+127Jm)ZV{fB(XQclRx_
zcb=KC$!8yLNJx4}hzE8p8w5ltXSik0Xwop{VBh%o(C8p6G@>XeC>YSw2M>>kJk$GI
zV;68oMhT%qgb-c{0s#Q125^ktc~i4W43c1&&^vA;xM<LLSDG9a>=yex*5lv=2!rER
z^8c6>C`o#QDWy`<SH8)ztBxYWCCheRiIG*vcGe4&AEAs^Kjm#Lsmn;JQ6?ARPGj%S
z+eEH+OHX!eqNi)nwd`T~W)JHhae%;~@l3POGMr-;@^%@I+ea<xUE|L-%;N+$4vA5`
z2h9qu<BostAvyVs`1M@p7rvGJD2eptlxX6VLEx%GTgPtL(w`bRr~I)pM;+7x#q2V)
z#N9sRpuK)vT$|6o2KCcm%C-3qC6fWi(oZm?cWcY!zijWnZbE39@LdE4`YDKuvOv7U
ztTAYaX0Tznq9QM|vBd5s#QD}TFl)1?6;M;w;uQEQiTsNt&_1ZosuA)UMTDwpRKjmw
zX3rnXuZed^yD1&8U*kS&3Tr`YY;CMFGzwY)orAoC`@mvhzrKJPLYQ>#JcGnu;D9LN
zup4D_IE^SjS-uCoM0#}o-$(_@MJg)9<MQA|`Le6vw1^>ynLS6mJ5$(6v=8Ri-kBHw
zUbo7BWB#6b<udeiT6sLXMT-c?rx)4p|HzcDxGhW+mwdFIEc$HWO6-6*4@$qRM`s^0
z6dj03TJxApGlvqc=bh&xfu{}t&#K-LqCHK)lp%_6^ljyvfH;Mh7Dlbeg;?r3h$q9Q
zyDBinAu|l`dwkTO(J~PaD~x@6K8tk_&@EK5a2)(eGAI01Au;HoDCINq)nT-^R_sA(
z;~x7y%A_y!S8=A*x(Xb=@jvA7H}hct7yujq3xNOp1fY25mHWf_6ApD)X%=$uOXE*b
z#h1<9$5~28c_c`ePRz?@*b}W}93m)ix0;cz7>B_{t`ORs8xt5IP!q^zgbO0%LM<OT
zpr@cl1&l+TQ@_dXjP%&wuj5=nG?M9hk4>!OP);>JzSeZflqSQn=*AY**VokV*Iqpb
z8EH!Jx_(F9z1!Oir(q{^=`uy3^E^cVL>Y5(*_KDbxVc<aH$q)Tdmib-YDCqgLLZ|U
z1be75fa_z3$wx=X&R-V4QxTM)Ehf{=*K9$}*Mjl@E>+k>!(M+(Tz}A?&}Cwx!i3m*
zvQe%{5O+ljt<!A`LGq-_mn~v$U=U`j^O2*+%dQ6s_#JpTeQF7QbkQ6G1z8BW1H%Vq
zX7YpQ21Ilt8eCXA3302$iNv&<!=W!4Uy{d_sWdbr@S7yd!`0R4L%cLf8olJ@^5Q_&
zIRT*)HW;BHzGTbuOuRW=yM`z;+@nu@O^IQy$m4vp$B?d9em{i+Xp?#G?`y9%yOIK*
zdICgzKPKaEp5v_wKIeKS?_W6D>hygkvLA*Gv@&~YDy<gFS<Y<4rmTZET~5)-?(lOJ
znD9s?%$Zi@sg0!{i}I0lYL3lf_}oY1)=b`1p=ivHvHY5;Hk3-Igy}odBFxkF#`oA^
z%3Ny(zx9jBD7uW*&}T}X$*--OX%5LP;nlGaJui;4Yd*Bp)uYQTonn*Jb<4ZSPmIgE
z(G~)$=~C3Bii9esfj$Ez_>a_<WM&1F7$G6v!5Fs__!8w0Vl<U?MkC5#1XRDc?6q^{
z#kxy6qyG?8Gq7J_W=T+Z-^{LHa>Ab>C@6Tt_ompAQNk~-gxj5YvZ<})tFfXctm2V<
z`&P=hJt8&b?#45rJ^zs89`~&=KC0#tI4&Ww1i{lB-o52)KO)Mtl??AaG8ffhWXj%b
zarcs*ZilRVDcgL33p?=4NO`VAb)9bBkAU~4@c>G|<%#&K0d91t8|Vt3JMfmc!jZWn
zDRYs-U2vWy`1{D)@wh^{tumS?jy-#9pm4M=h;8J9i?HS_CZ4r^;udm@f?2#yBY{<@
zc;yhbMUPGaKD<}32kj46xg%lbspyfWzN!y7AGdHuo;2H`gxP*|yg%%MFLLuc_NXsW
z-H(VBF_ea3vB~NY`F&#Ji?)-%&Y(A@2d10(_Q$M8T*`9(P7-vdX+>F_ZN&r$?nQ6)
zPF@Ic^8H|@B6HdB#Z+u|+16BnQMRIrt~`FKRp}5k@|eH{DA<+aRJA0GA*}Fh$x|B@
zILzQG74yOj-y{x#DtM9+4d_LXOj4sGa~HUSO%Xf;SoXf)54L~#w+$gNF!coO0$Hc<
zTS9;*gi$<$wmdwfxxRTWlMnX}EnraNNC{>+baw(uyNdh}{wT+hP^*~-);Ph|Qq7V;
zI8Kx8tlDeOA|dvW?J^bqom)rC_mI9b;woI+v#Zn7tE>Lbw77zfas+;+D6X7V0U{EW
z6w2)Po%}{E-q7B=IvFJcHLG9zw*>K6z69Eu>ApyQ;O=cj)Xd<-4d7(^TKL}?z*k}@
z-)@ZMo|6w^$8i2Cx6kJ8zu?<qU~ADQEymudByct3^4w-LteC5=lb=Y;hG{^r?|JfB
zz<q{>$l`vS7ITo$NaB=*r()^US9RwO>+SzYpR-I{-^Ye!jcqluCL}WOy4+~1+-i5-
ztsP0Yw8nMb)_a)jT6`Z;Earb<aS|e^T*6nq(7Yrdeir;u=x=tqempHl$@L?jr1H4q
zdziY@uR4#?i<?|WU+<k*0`SC-yL5x>c`o<2!!DJ!fD<F#z|TRX!u|voc~F^#1@{WF
zt0oXrExri?IW`-<J5OsNOWfcZ0>^`nElcRNB`Fbf&$cA)tg5EySHgcpD)N0Wl4de_
zk?(|lN|T=PQ(^5%<W+a=4qXwk#+k(?2qv++noF{+J8rou3`7_Kp8i1S?4!y9gNf;{
zpFA<P${WJdoFwN&T&DFM?jVo*>2fJ5GLpFSg*kn?pgiSY*;Ijnp;5ON3t~3oYv|mH
z+K@#>D(g08l~NhioQ<wLy)2S!AVE`>C=Y8AGkhj`>{@ob`*;FwQzUh<nZ_>GB2;up
zaAUA9=m1S~w)*JhiLS&9hg#+|PwK6^Mi+O<2+Jr3%n!;;#m5y@HVBn=Jj0?ulD@f(
z%#N50b53J9BPTqvffvf>j#W~J<yTJ0IO-z0VoC(tpv4WiF<ZEO(TgK_)R^uq&-MAf
zL0_|F%E9CaX*1!^$_A>L&b9tiN0ff(wn`6|Kv)O6$Z5Tj&&Kh?gw9>-?3g30i-Y0f
zt?mKMzjRfa1Acx{+&Sg8y6){jxMDPi4wEAOvbdIJ;V!?YrXNgZcpV%#O)Y53zd-g-
z^sWu(^n2E0v&%wEmfhbg_0l(=1O?6KT~2oWJQ;o{D`y=t`L!aaL$>i`&nT^jd7R0#
zIguC`wb4G=XW#>StdJK7k(3*2ij3K^X@au{K$Q<=+07})^YI%o3Nz2B?X#)SJn&(h
z@bg&C1h!H4Bm-{Fy0DMD92ogJnp6-B<fhqBD!nC=DGgTf)c_*>zuGZmJV?-`)#!3H
zylXX@7^=I2f?&<{5IG&$DOfQOQ7G5^)r~>dYYiGP#0xI;r|@t-Jm9~*1o$8~+QMVg
z>#XQs2dVSym@L>cfvW^v5#E%zvA%nog6ct7oXCv?Ng(`E-6M*a^O}msVP7ysUe1z1
z!k7W6CZ-CV90$^?%YAqu!?t)j(aAiDzhzSw516h2#or%y`_oGW^q#%+JQF-uqt<CG
z9fbVya)(x@riFyOwo+bJnFLjsXLdcYXS090aaXP<%Pi5f7Yg;UG$bq7Q~$-vef{&W
zTyZ(gd<0y2tUq(Y_FGCY;&QNldR^z?e6N83Ef`zTFY)pIxgRD_x;K(=sO7hlY^ZS4
z)RUdiRnBeZSw3q`Cby)VM4-TAEQoE0G!SD^w0wb1!ewORcSC37|G?0o-4Syd=Wm7X
z{w{1rXG2;GT5s2ElbB@S)MB!&BX=6@q&t42Nw-QPgK;jZ$K|P5WISx$O4`=R5Ueb0
zg7tC|vjP2u&A`S?gC?35wFyzQ1g%U3qsgY&3yoE;GEFC+_nf3?9xP5i7K>a<iT)X<
z?G?Q4#rlgW1xwhV&Wg)PM!A@lC_cxiv9tT6EUtR0Y@Yp8;whSYO`UEmWT{D(tmynn
zJ3s(nhPBFnO=@E97dAwPu-njwvmT~!@c|e!fZYargh4&sSWl$+3ge>M2N&tZYN>E8
zFG67dn`pj&pYV{$F`E1M`RJuhyqxm+Dia2a9k}?fpXGy+5Q1nnqT0-8d28WpPJhks
z(1hN&J3sUDIpUgQ4d&<hRnT?0L=Ys-;p_wol3Wp=PAHa939uA*c;Z=ZBt(gItBT=d
z_8s?{KMX{xR<ViZo#kixZg$#}e2Nve?&UzDUySeN-ZCquRx9&ZomgGOp=<hHkqYA#
z@6>fu-&aj1dr3$VMY%li;ww>M$j+)r@;uX)%u$tzJ*&V9v1I<LsTf38vDY6SM%I9c
z6^R&+cnQYBU*u;k=3cARgEMMM=%$sc6h?ltF#;lWK-P66#=<bl0RoE_{P)wJNPJJ;
z8F;Xl<J^%+R@~IdT^0%;D*LzA`ZT-kxH-8TbQZd7e=QSiIlpwhJ_bD9LnG+6nwhDP
z1Tf~IXUc*E#iE2l^7l#cO)P5gYj;Ght%xi_*kNA5wn@5%F25&`C9-uTDcBDVlql50
zx?vi`q|<A7A)3N7qE!`B?$q(Mw~I`^3@Yurmp=~Nj4d+K$W0yr_%DjLmFrb~5Z>)w
zUG-ndGHUrRcimqHnrPG16V3SCt*zQz>r!FGs_J5_pBEQD&8LiJsZWLw0CB~7i(xNA
z<#DYvA`K3p9pY7aAy>=&JIUO3z<w#iNM@_jqFfd}rV=}1(LR?jk<cCM#`p_tb^z%S
z&pg@Sn{&gZyOgkk<ZP*+JiGc09poD%7A&Gw0<7^09U>efH^;v$Xrzb}4NVT0KvZ*c
zELr+z^%Hqj_xOiki8Q!+%GlLF)=tgn$G(mfk>H^x{*=$=v+h@~pt~`cHXa_QpzATG
z%jJdK<;ty&<0%>%>H_~e;{6YY@a`9#M*%<u?{oh{F8lV}!c%YCSx8*lO1}ETQ&oZx
zs!aJGnMyL3!IFAZ#Kd9LD~8DJvi55#RwP~@MbH}S8wHuz4&3L>U>Q;r(P(FHb}Tp6
zzU43YMuT1P{$_3=9PoK%Wdt&WY&e^R`TIKhhzhHUWSZ43+}g$ltRD+Z)p!_y`;>~Z
zs+C%{0ziBidDPLIPHkUHRGXvFZ|-P@$dahN8Ma<Wts#L3v^1K~Ss`W~<$8hcpOseI
zf6wOoTIf`!<~fn53Llp-U1=&g*g~NK+)h|<OVRL~&BAq(cT<W&Yg&|M|1g6mgLD<a
z-NryVIJ%bb+0kOqq(Py;F?BU?D#(td0#H(2nrI4pp_YXwvzx)>2|F|m9(|ux^P=b{
zrbODgDbJ2W63+CfVrB#1^{*{DAz)gD$hagSCOqu$c^R{R>fY8^qNRmR%3pNrl{7&|
zm{D$ZQpv1BnmcUz(%d`*GkdWuFhf-pnT9#`vZ*eCYJ{?WX}gf}oc&*Fj9~R>3`xg6
zI~lr42hJaYbHt*Lfjf^fwD0R~wKQ$2FDD@xFi~{*S?3}TO7gwV3_*$u&6G1lOT5kt
zEu|U)IU6l!Cn3wNr2^r7SROKZdXGe#3CT{E9IV^^Sx&^m8%fnB!{i|7df;m{<qW0G
zLOXW(&)7^&&9}%$3{5|?ydI#@jPmKnuVOQ2EY=>CeyxJ{?~1jgt~*HY<PsNnxO`zM
zv}R58wrDCQ=qKp%xC*dUTB4O9hGJV1Pa%C6Im=WXjQp@`n=$-b6oTX1AJ*s}JJW$X
zX!xW4il$f+1(~OkB@<4IL%FwcwP9Yyg^4QO9u3PZ8cyT~RNui|JX}6Lx6YCtR={%$
z>np={t`>9d%_U+_ZEz5HRl>G8Sa6Bsa0lc1jLPl>=QS)iqY^y0fJhz*VPZ1KF-R>)
zuxK?LZvD+-^b|^?MgqgMrxo`P$0MUAb+ECVB_FFd7W(#uvTdb4zbcr~r2?W)fie)D
z;SjWASj`<vBOEkjmN^6lgG`W%L?w`p^nB%|kRP2vgnt4>yGDA~{GUhj*G;phL%1EX
zjAw6udZ!8Y^aZ2re1ZpO<@%1OK$jfYd@g>&_F?TyD5i-HF_~2sf#dj9Vl~viQIf8n
z#aD#81gY?w=b!hj%Nh&f3^2GeuYh2=;xH9I`(3vAe!<E1kIi<NN9SleZFeG>GJzp>
z?0lK31%s^OksA-rpYqWhB1_fAf}zx%CmBT+%PN^y?F;1(>+*$3xF?6$dEpCJm`x=w
zFYC;f1V-hU8Bblle$Ag-#9W)@Tr!x`$uBg1W`AnrIav7FR0iBeIuuySI@?LQlkf|3
z-ziCS5;dzM1DaX857@{HKyj)voapjVoFG;(6x;AZKp>*QZ`d;w@tjZ^Np89w39xh4
zQ!u0tW?&dLv|JG=DjZ@2+jfjzPk<VXs!lFs7v?u_WHP4^^a#t|T&D%^J%*1PSRcH|
zd#n$7+(qG`RB~2UKbWh5lva{-fEJrU0nS((^CnwFqXVYOpyJR-D0A~oRkKyrEuiF<
zwi#V~kaD~MHIEbV@VzP|E1H9-ie2oFJDavuqJgZETQS09>#Z1u`KjG2qIG@1<k3Nr
z)_g+gK^Uj}p+2%V!N|(_r8MN=9?xhO@#xvn{;%f_%<HF{DVmdveNLwVhvON9rpMcw
zdg&h{h6cKMSJ&<EK1_W$KJxnisM41r*1lIP2mg^%PT0IIEW|P<>T7%(fLc@TEk~+s
z)ucHUWYAKvbNT+G!_2}?vQ^U5;9?4Dh!p5P1aIf!;YIOD395c=F`JB>gOnSE^NGRC
zd5vY%VBF0}D)SxKxef1bf<vnb@0JUCHGVSgI(mx4n`gT)3Z`87D4U*ZC|6mN@3N^l
zk<QiIR}K4Y>Nm$WR$i<hz~N?sT8@Cym$J?8V#FZ7>fvvUZ`8T7_Y{o_jTi{!A=gwW
z_Pie+UWC6qyC~GnhHHK8Jl1`hPhld@Ct3ARCb1jC?Xa*}OyseI`3Se3)=i;XPt;wJ
zOEOR5%%`|VA~-E2&bJ?S1lFdlu=$ujoKoN-8$WsFv=N`$;U-!`Y^ga8>fvwt;s{e;
z0lJz`Uwex)IChSE+#a5j7=60l(iVs|U_PIZnq2UY`16&@cRi8?DvkcFyS2T<2^EIA
z8cv;rY_>>l7yp<lH}vIV|EL}Hme@AXD=jx<hK7C#qYx415_Eq%71%M6S&mT1&4W6G
z8aAAfU?Iube>X6cbKG)y%O)X#6?}<e=;Dj}1Tbpr>O*#$O8#o#9hXkh-h+n<0=|>b
zw6E>!Uwl7S8?oz<zmTAIhIIh>9GDF@mt)5f!SqGCi!;b_o)*c|X%70*f97I~;dchT
z?8U2{){>M1ZzFm?g^a4Yzs;#TNUO%Z3P2k)jWRy}{2bp70@faO-~WjQ4`R{l&A7qt
zg7}NufSsD4a;c?asr>Dp2qB9PYjZ?h59mBos%=MR|C6QrkCFKJR2DA+vdo30`%nU{
zirQ3Bw5_zzQI=X;Fg^DGR#nd=C>-DzGj9KDd@tXz$ixhKI}{dwED5ixuH0q;VR+xp
z&ybg!-Ss>|Xw2?+&;$mIpC5{F@u6Zi+8|xdRy4pM4HWYns#vs!U00xk@3Xj)m&|kT
zfs}07S_7QLevA_%(~1&Np=7XGMBe|ta}!~`hL8e>Fi;e3suS$MX#yL3SfkZdSp+g`
zGtD9;D%$DQno}{ry7;m1rnA{UNZ7&`JZI<8Jy&xY8Dm#%H<aGv+SR?Gty}kRC=NFg
zEfdm!1o|Hgy{|uKjNd-#zG5I=$zSNFII8{jUSPT?CE*}F_v)d$4BIWsIxTgwj7u(e
z&9%BwkmdE9hr9gx>TCAP;=hz5`EoNUIg43cYTNhZB{m~us%e6*Av%Xsf=pr`eTwN|
z#*E0bGdl>NpaB_nn$P%ntbK~+j^h)GW+G5UiW=gur)*89(6_Fv&Ri<0akrsw%_07T
z`E|l)o{v`<nm;zbbuNqsNVMK1e;;Xvq1VdkNqE_UCC1_POmG3VnYjF?T3#d~^c;NQ
z&;)qC2w=p{jp~TEENz5v?X(bd2n!kHg*V}?!jQ9UEnnSF7>DEj>64<qx?)(I?4%D4
zZw>dtBMNpYN)6T1X5Cm_9XD1%Y>~PYD1~7Zbd)?IrCDeYlg0x@$QnRgF>^7K7ntII
z{<WFhNmD-+rO~~n;s|&#bj3Oe@p}=!@PgHTMqfn#Jfvd95q!gLXbvm?!I(cV&z->>
z>~4l3otz~w($6KG1&tL#EHq+Qa1tXX?H{@en2KIFIqr_mGv%F^iZKa?-r7a{%$GwH
z<?)#h=i>Mco1vPuBMz`cZJbNup1Q$N!`P4_nzj~G5u|HQ?<9aO%0DI_&Y`FnlMw-6
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

diff --git a/packages/icons/fonts/fabric-icons-10-90d2dc10.woff b/packages/icons/fonts/fabric-icons-10-90d2dc10.woff
new file mode 100644
index 0000000000000000000000000000000000000000..00dbeb3167aac8a9f694151dc6b3017cd1d17588
GIT binary patch
literal 10640
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
NIDi2lE&k^P{6BhQDop?Y

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-10-a9486bb8.woff b/packages/icons/fonts/fabric-icons-10-a9486bb8.woff
deleted file mode 100644
index e36520bdba0254934af6b85cd1ad5c98047369c1..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 12224
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

diff --git a/packages/icons/fonts/fabric-icons-11-18d2ffa4.woff b/packages/icons/fonts/fabric-icons-11-18d2ffa4.woff
new file mode 100644
index 0000000000000000000000000000000000000000..25023cd56faab0bf8e560bf818801f43b792809a
GIT binary patch
literal 14500
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

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-11-c0dbf638.woff b/packages/icons/fonts/fabric-icons-11-c0dbf638.woff
deleted file mode 100644
index a3b190466c00766b54ddc3231d6f16201abd6f75..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 15192
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

diff --git a/packages/icons/fonts/fabric-icons-12-6c96597e.woff b/packages/icons/fonts/fabric-icons-12-6c96597e.woff
new file mode 100644
index 0000000000000000000000000000000000000000..7c86dbea9d017f2ee0450d93bee09c0e1c5c9bc3
GIT binary patch
literal 14384
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
L2t@H;q22!hu{?)p

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-13-02c4bea1.woff b/packages/icons/fonts/fabric-icons-13-02c4bea1.woff
new file mode 100644
index 0000000000000000000000000000000000000000..19f7eb179058966ad7694d857ecf24048e849443
GIT binary patch
literal 15084
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

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-14-36569c01.woff b/packages/icons/fonts/fabric-icons-14-36569c01.woff
new file mode 100644
index 0000000000000000000000000000000000000000..5c3e6cd98e6c2535a6940be3f28d2351de3a8555
GIT binary patch
literal 2364
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

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-2-2be8dca9.woff b/packages/icons/fonts/fabric-icons-2-2be8dca9.woff
deleted file mode 100644
index 368f5b314192dd17182d30946db21552f0e12cf3..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 12124
zcmZ8{V{m3o)a?`7=1gpxPiz|#+jb_N*tX4yZQHhOYjX2`-@SisSFP&atJXfdt54Og
z({+}cyqFjO1n@l=egP2wn{`D1pzg~5t^WTZugt&<0Dy>m^Ag|CXBKtnF|skR|K=jU
z!2tk(?sbk-Xc@UW|NLGLd~3dE05!}iOpU3%nawwM@EzZLYc)TzkD|>CoW66x7QQ+7
z{{b`r&&=Ax^qboO0LX9v0BK~U?Xo>{69Z!afb!#8^Iadn{!wSyWByG7091_MF~&DY
zkwKt2&260Bzq$YR7V}+$vyG2j!rIR0Ki$eVH}M}J9I%~j4BWr#QWt*51mE}x*a8)?
zHLx-H<_5lNKLG$RZ&7JCa`tvk&Hw;?$F~OkKi!uiV8h<g<U5ys<~t7i#=Lvy9in@t
zk-mZNIH$jVlE1$TW(5-%SOII0Y1c^X5a~eg*x2C605l}Lz|S5(Kvyp;EIi`$S9kg-
z$dRxF<X>(~XnB8s5C9%3Oul>O<cvIJpaVA4&2~myM&WN?l0zv)=~+3gh5^Ame9BST
zS0@x3(Zq=Pqn+uaBXdz2dZ{2Tn0m~i!9UOM1)2Ddo}R~l9rdzHjy*iH$4dx{RMMzb
zI_nB)&NbP`H~E&zCL}Rb4$EIBYk#{&TsDKbmJk@CeOjCN5nLFC@?GpBhj8^NPB~_y
z&@+#@khk=cDtGK4)K4%?tH=NNIKb+TGT|+rQ%SQ_Ho}!@he=IcWpo%;lw#E>WNXvP
zFc+L{i)f&l?W=AYYB6umC%BKtnI+V@{8U%=Z74O@j^4jFFSvG*(>rhAABM}09R{mw
z5r%AT5yCZd<Pn5@UlB%Km(WLJsx*W^395}Gqt!=bNlnh|;T)QY5F7=0=#SxE@QmpQ
z*$V6nk;YOJwdnl9237>LK?1(df5s5ngi_yJUt@5jXQk(&$K9_NBmx>404T?YN^;NC
ziRqT>7l0pfB5eqw5a1@ta-kMZ3e7qVmL^>wBZEIK@>`H9y!K1{GYB@lXNz-h2t9%F
zkG`pU`pvuBspNIk+cmRDoSI54lVdk`0S@u(GVSw~NdB7L#6V`zL+#n5*Agb*N)GE$
z_OJQK%ww{Q4dIWbOgh7q!RVVg`?+AbGaG<wY4<R}o+@wrAW0DFw*2kyNa?pmTD9Q$
z2=Yp>XWjbyQV^LzBQ*C1Tx8#oLZFKo+P*cH$$F2RQ-Da$80fP|deFOcjPGM^{8#Y1
z%}95J;G^uu1Li}BL2tm{ycDx_1sGiYSHz$X;~@YD02BZXfc^RcAh~CDdcnABFDBh|
zUh|!<-ePJdV@Nj{X(k&FM`vjyAL!h5na1pk*y2+V$>HyTgKEk&ssA)~VNV71SCWGM
zL8`1(EC82Rl~-iK-H_FXbT2!9DlRR|&+U86Q1szzEj|6k_1sA@uB{O)hu`V7y?Nbg
z)_$BR&UuGU)YsXz8AL%$#2+}h^B2cj{<a&gbEFg7maJ`)WcUX%Cfdue1FFkO+k-lc
zxO32eqZrsB>6PUQ(QJgLL?5CcY^MZ+koFiCXFf$+1tWb}5hUL6PEBwwe2xM`&$S~w
z3XcT7Br&<+A9}``r(-`TwpDmnus=DIh21hdV)WxF2jgvsZI<9|Aw1xYX(TB^DM8~z
zLOhfm<0%XwJT2pS(kU&{%yBSon&c@k)k(;m=)w}9wa8GTB=-jFfpqP$_t;Y9TpW!i
z6pqD-GE+7Mx*RewHQW-v*<)lGq9n2#qgr2O^{AHO6b<PbN(xuts<@enRhNvyS{a9B
zU>N?8h9&edP9wyxw=5M<z%8>MB1x}c^UPjZXBkgXu}asGN<x#od=dxuv>Dnzt3(!=
zT1F7{i?>ot1$n;SoAqtJb^cwvs{iQ!c&*>H6>`5IH4Kqqj#&`u-jkU!mKa6fi5pq9
zDMs%sZ8mE!^-orTBlOdwrK1Xpj51ZSCNWmX$kqtIpc;C(a5f6>96^o0bDF@6QSOo=
zQ=^nd7nrCkP)N2m)+B5iN`Ic9n;565&SK~e>6fS$n4_g|Inl%RvGa-I;ixgEcT1Hb
z(J=}dSJJ+V8CP<QBkPd2nF$mZvS6#iYz|wO!0jMa`o&g>!VbW=+EZb1@s#S|chJ_=
z(-f@k7|^e*g8x%asLj^R62p&`lT#r*IvJCaa^Nzh_o#uvpt1xi#Gj(Au#^JzcN4-s
zen5Vw14Jx<i)|I$tGVAF6HEg@?254y@Bq#B{JeeIet2-0V~rr$(eO5^+^&X>S-s+N
zHoBPSo0p>14?OOux})Z6t?$<RcN13yZ1ujw%qe75z#S*3$_%-07$f-0Ku|>y|Ia`X
zw1b`qZ}js(PanaZd$ong&4Fz=UWGp+3j_VF+=BzZkPE{V38Gqvy6+#$YbmHYkzL4B
zn2Lx5(}>D_m!+i$I3ShmP74CP&v%7HCe*!3Msbpg4z0Bmq;xuicgubcwt~ywneT0h
zFk;?9)5{=t)S{LX?D@lD`9dUurTwF;cfQf31QJQzn5VLS&*<vqezUoAJz=}G#a1qI
z-mqapYE+hH%j>{;z2`^UWNR^}a{M9+8cRu25ue#=eJ`IK-x?bSO|Pm(Jf>N;jRQHZ
z6FdTfEEv|3CED&lqnm5nCf_iRk?F7|L0FiY{95t9iTI(7jiLC7y(yi>7Dl#dD0_*E
z&_Dr*uf%S6%soca_Id<JcWkFhIbC%{vZNGEORSo7AkXL-E9oR%b8>a{gw|4WW(q3D
zxP_!d8e4NmVb6|pWNoKgcLTSX>hRt}3wX$)aRYkEHoqqWy<*m2Kz%fd+i_N7#<u%E
z?=rdT2GZ#;X_ul+p;zS=_Fs0F)l-JQaL4<zk)Qo(9Q|?xhUt~0ERn@4s0xfp_n^({
zn4}b<CzI%uX2r8~o!G9a96<YLaN^9)=#rDkq|0?i%!0|H_-;EJh&stQYF0BKa<?-K
zU^~-(2YCh0JKU0yRePs1<RH}~#5m6v7)0m>0C5v`>7b*Y&A70QY?GVGrkm`u&w&P^
zB&!?qnb{Ex_Fj`|_r_Eko3c<Raj}J0Fq)e1j=%8A0{GI5%8-y%Mh^VmT14djnjND%
z`e~0Y{)$#48MqJuNv+BC;=yJgdxk1=FpoX^azC_}9^a+$O%#WOIz+jQI+MF>f2yZ&
zg8*&M{#b4Nz5fb4>w@UC@KyL%f79FWxxi#6QTh6>tpBH7kq9ribA}8vdRHDQe0ZVd
zRwce4mfy71-!Fd9l|*GuDC0ROry~YR7eL{9eay{t#vPAPKR}<K+<3NEkp!E-1P=Bn
zQtQE3&Oojl93jS7xF6on*zN>UARbFxwH2U%9!kt(qvH305HO9Ltc0EeKNa_e-0^1t
zQ_7b}$u3u@kUn@3ZjDRytPztFF7%R9i`XaMHvt=jr(y)QF8cyIB$%K!p%(1`7594N
zz?^*A?@;K0_TX2O2w}veAyLfaZ)!U?A}dEBx{e|tGEp&7<mYs)lnU1<ZE2Q`=mnJ!
z9%0#5q>Sd~_FtFl8S9{U=NC_HQT`}ge`~jFYqqh?=g)$Std^>@=a<@yC9OCKa%^7c
zy;1oXi|f$YSfyX5ic54qMvG;E9=B!1O+8@pK0MeTPYFoiLrymPk9Xp|R!~T~a7~T>
zN^7pgtH$bOsgzFyh~p&&mIdZZiN{&DY6K7t(*?~^f1yfK2s_QSOHeOeJ$SlRSM@A(
z5&=nNsgVogh^%ZxZEZ!XRAnK~3qj?|b=4EHbn2_y%1g+3Ci}kLI%n6yM1`OxajUcW
z-25k-^slVxii{m$nE!&q;>&bn`~?SZ^ZW<<+y@4A8>BQ<S;q*qCtR+%%AUaI{?y_t
zfU5eB>ybE|tB1I@I@ckOY<@i+_;w#$RW<c`*_;S_f3}=V=j;YNnbJy9USCe;X{$Y2
z5`7Jme0Jw(!l1omJStJpnrrM{)rie8lh9kM?=(Do^(U)+64kVb8V|fr$=Yn38%epH
z8XLU7OIG2zUu#}ecV0fSH)(c#L)%xUlViuE-z0odGaNk2dc0R_gI(wFY>!?u+H27q
zt;a=rOg!5&9d1=uTcft)tB)VT(ZOh?B0Im*tvsto-9J`S5>J=FE5PzU#b3?!@uxSf
zTzb7AbjzDEsq;d0$zL~~UP$A!HKLv7iTs$^mEZb&@_%~++xB@*=vRDQ_R?#0?^yof
zbfX{H{robh?pZ_yLBI<1*7OPS(pTtW#}+Pz&pQff#Sx!@eTlv?NuPEJYF4Cy4>qGM
zd#5J)9Yo1`Z44W{KA^yYfgU3xIK5zoW=WlyvP&ll5j;PZlq}<RTWWOEB_wD;o#f1M
zaGHSW*;%s2XN7kM?$cD?R9Lvgm4S7KyX3hh@6idD@Zf>4Nfv<ap?TihWXXYVV8~$|
z5tS}Sz;*JNEUlrmw%yFsvSF)7xUsUV7rt5KSo6FSrz~3uRMgXeX!>#8zQj_?&}8OD
zte+-w5iVH78)k8P!Jsw?4csThCcC>XC4Jv5f2f$<_UHa$@1To=`K_9K^VSpC(m@0h
z8!VA}I(UG1SDX41G2Xqy#6S5Alnb`4JQZ1PhaWMR2*&Y8Jyb{dl_W%E9JP32eV{|)
zI(lh0WOFb1o(_bn&I^NxBjsS4HA)^b)0#QUD({Ue7@p)`^}b$r&-@LHD8h^|A-E-g
zZ)Q+|#7`jUV>EH>D(RmIkaPvxUyvEI2ka{bD($_OOv34qO6a{szusk9_z&et`{QR0
zV|Rogz5s@(;-z4Al<r(OBnB4nnB(6)v7LJ_6ogZVBuuC3Z|jmli}Wz={vy0|h^p47
zc#D^mOji}rJHJko1-FbyhlN%I^%nYXF~tF$*|uitU4;~}M8QI#3!$JnRysO@!Zx68
zYYkcRXVX!x@9!+Wzvq3^)tB48mu6V55Em}zpS?%xYfjo%!X~CSHzCtob^I%f9qy}P
zDb2ROUkB<2Cv|!sn|a^!eu~QbD~~BXkfy?-Mia*%K6U+@n`d19l=rrZVvb@yOt<56
z08TtTNY^}<Tg8)Mzx{nEsjfa!_jKUSY<f;Qs;&k~wxAE-Ng;+Y_cXxhUeqoSNbgSV
zMITNyIk=ZjY$h5u$?twbbL0KwzI1f3bG&2-8WP(6>!r+Jti~+@7Bds2xysfITxq?#
zy3Fw2+9G(S)qC8zWOH~vd5M1a^?VO+ceB2GWxs6k8ngj+b{A|hOs|t7je`7aLapXw
z9eQ3#nJmF<4St($cT;oqu?g9(FYjJx|LsB**;-!eJ{7>#{Pp0EXr|+4Vd0ilzrP`G
zr~TF0r28uVpt_MEu^it2M&4sRlM+iPXtEdbg^P=b@Rbx29{YmA5F8BL3&D89IF+9H
z2ij!D&FGB!g^Mb@r{@ue^@zm}8}@M{o@bz|a@EU#LWv%-`XX^{`Uz2~k{*`NjWhvm
zvn;euUPZ?YY0Ctxq!Yl8o&dFx#7!aBT}BdF3*UR1X`N{W`N!@1+fRDGx!#-72CzOy
zvgfktViLpe%0jNtZ+F~`6qJkV88lVfQFlZ_D(j|Wd`VE-BCXiWmss2=Wu*Lf6#8&Z
zBHc&8rs9Sfk$lNCMg~-v<uQ5I6jh-l%3`+%GnUD`(w}2xu5`HggNQ>|I*tM|G_x*e
z;swXPQV}MVwhqpi7+)~hZ^9t*B#&5TMvY}i%1=>(q$k4P4dknUL!iXqjOlEM+*sOE
zpOqO$Fi;JitiU(#0P<|?q7tazrVHG_hDP&9yhVu_5+GKCEX*b(C5iIs(|P#C_`%Kr
zq_kU><in+t#FZTX6tv}EdMe1w(^Z)8MX*O1rTvwb)qLw({K2qaNRlFK_lvtv^3JaH
z`A|6$tKU=9A`zMf11Gu(`NAp)O@AgRy8}U-X?>?;TM{i~7LrB84hHG*raQ@tkRU(C
zWONmzng>pRG#<sTP!|?02q#)o2GG1C<3cJos6|kKu>0$Tw%Z7x=>Js|&h+tUJ`iz`
z`T>s2>_8k3J`(8M<AnhrBn5Y?rJ?)*nth$CbGKNbZh&I1^pm1JNbR+}a*K<KR#0R;
z+fX#qetc%gX~$k=Wv$L!QF=yO_bTbjU~gt2Z+-3V?r4%h_;Dv+G*I^q%cMGjGtOJJ
zRjK!vXV|0(nd{6IjA%XT2zW!jJ^d}Y)A<#*`@>0Z^*^5L3*TMxikWS)Q3l{w$4A}5
zqWp0tQ2topUS1PxjpG?Gi4O+7GAg7b_JLx<>xjn^%`l&me$g^2^*9_rv5bLL!-I37
z<!Y}g*jpYro?Jn5&F#+mQIb)q%ZurK9*7rG`1RbYJ@X3H{kBQq_Hm^S)WGz#>I-hu
zk6`c_D=y7<W5$U}HfSeG7G?)L5RR|%au*)nAWJ;?5gNA*Aov5?$n_S%)|ACxRCmCA
zpond-o=IlV_+!yInL0)A4WXOEAL6S*9mw0ke8LG9Z7Ci4AjGB}&3$ik#T5S7-%?)h
zJHmmO*9nq??S}MBm5`^$pEY54@vU*9OGFvbLN>&^T`Y>KQPFuEY#y+VYMnICM<cd(
z&rp{!;JC_)th1OyS<z}nlwT4U#3xToOUp@1BMPdIwcys#>=<b<9M8M`MO9vc3pvjX
zLb$aOHfbXNtfxWfHU*1DF)>V!`8*->4!)18CV4tsjVxeFuCQ5&6-P)n?Kh93<@YJ-
z{u;X->~WBMJ?cFihvG<q>v4w&yV`o{R~}EvdD~@w<=pJNcxXC1vnffbWl@;I_zjIY
z(|sqH5Lq;&F|`BP1s=OlJ(#P5%lbJUWeW)7`EiwGUgJ&3Dx+{3yrkPwQF~hrXVprS
z2A`LNP!-@TF{j<vxvQ%s<YmENh65sS3%+jPg${v=d-3--bmA&X{%mYrH9EPAql3<Z
zaZU&2{s5VxFl|hm!-HjTehRUKfkuFL_EUH~s{<LOKRLaK8IDH+PYhn-G);%%3#4zw
zi*P)=6{rn<)ib3gcuW>9vC@$3&jvoG@y(8|v0bNhH0SMIyGcvn%%zn*skit?-bbX@
zda-`i`8kg0Vx!AxgR+n5E!uPSho|atviI8Pi`Kyej{x45#M@$fg@0ZHNX^Yy85~YS
zx|)KB>k5#EB=}#PHn0F=CIrL?obV64l9Cj)^K265s)BBe0Qx(ZmT*Wgyrv``{nxSL
zV0d<-33mL9OF)YhNp><*vbJY_4RgVWsj=&uN(bl&2x~7SI1FKI6j3;g9%Ak;hAnj)
ziLZ}sy<t(za+tly$<Qoh6gD@_yBsYa7fneiZ2}?{O}qaxc8N)(My5)Dzlpmb=VbUs
zNhG{oL}<o~1cd!Mck!do8Ubi*n7AAqb`jVPwjk1;h^4c?r+zU#e}I72*u^$=0DyaQ
zvYH+AgsDKLY?Z<ny|Dh3I2}FlYi?203`(5CZPXX$O!DC;Y%vkL7}But7Yeqd{u@#j
zRMugPP<QYaYZ${>0Fm&i4kLfUwE2FV1m=aKcT7|0t(59^<K|He&HEH|*$EOY!9_*+
z1y8H7%9`ilz+4eUwKW~>*yXx!oy+h!k`3!l?@p_9%id7?yLxeBRnPrUJxbx&Bt^<D
z-c#RJ?IPZ}6Xp*uGV1~U6%N1l%w->|DuUylCX~&ekS>AVb3=bU1O8AO`baHS%BS(F
zGT4NF!N{VAvz5n+T{y(W-)?^L&n)xDTt;W@W)_>Y+;A#qHWt|FO^!i5(}rok-sHKE
zFfaiPtG^a~%qsZKY1W^Y2a>8TXezd5cNa~TV88qqJtq0KUIyE{njB}tvS=b9w8z;@
z`@ZN}Ek3ujHt>bYs(Rnu?MFwuq@-w;7Y|je`5TFgO~)0r!WeI>-6~hHa}<^~e_<=H
z&F`dlA1ql4ONF+Q{oX{7GoBx;cy8vr$2RPN52^(~GW6I%QBmj-@f~2+{jts%symL{
z*c=i(TKwtCqL9bQ+U9KvMU5LP2bopxV5G`x%V4jr7sB?k5Js2Rj@@-OHxFWpGw%5|
z4lC#QV-sEJ4mln2sdMHLv=e;fcgy*oYRR4ozQ0xdbu)o1M+;Rn$285EdE3Hk0E6LS
ziWVL`%%SC`C@I*EGacpKL9|@lRD&NI97nz2uw7)#-s>=#d4vrSlJ@tY=D*6q?I!=Q
zdCr!kidhgdh}lQK&GgzUJKx*c<fu1_25R2+nefOQ7D?cQWgR!E*{f*WU_7t+@^;c4
zNS^V3es+D7*99WLd;SR)>vF(%ZSQU}grwDWbd<&bwY)u*y52uWjk}W?S8luR{7X*G
z6--W+@|d-+_Wb+H*-c3@c^)H2p{{TD(S?`QGIHqeAFHQEF(d2<TmX(&-~>dMWaJ>%
zBEGT&i_88N(b<>?IBM!#dU;|*SpciV<F#IEO;MNF+dQ89hT^8<cGB}<T<`wf$Yb7H
ztLn$ELBHCE3kIYqyN>sF-`J38sRn<NmFP1lBxT3pi=ENy&-GzFf<$rq+#`~jD-3W=
zB^g5T;eVg;?{O4UqhH7SdcS`s2y&OV=(7SPQ7c<=@JZbg-bWl9VWCM~GUwkT+hFVv
z4;StQ)!sH(2#p{xF6ZMC0#^rBX<%kl2(u)Zgd7dE1Y0N7bYqj<qa%Fsx}Trv3>z9I
zV~H0w6Gc2hH7Dl74}!ZU(*3)VPJ1H+Y{OK6TWntgO4is3*;~}t*+SA^aa>pw17XLe
zO6|Y*&bQ%Z@z90FOGmTQd`L4JuX?Izsw9HJWFz4#nlh(0yqT+-5G0w#r{sy5Kpvm5
z^AlD)(BrZarv2sI(MotQF8Ns>1z3TqBKf!D1%Bf>5uUF#CnPWALY?}zO#+7j7)ehS
zMA<rvyYv<7wG9A{&9%L@$C<RJ#*}I63~<TUdVwZaeWU%0&bN;@Rk#wNrFsKR(K)&M
zvCC&x5`}roriPZW_o?W2Q~yB*lIA!*#g0+4jI_lS75pqY74H0^0zN5Q+_KG+Bbzs9
z?lC`35y4@X$a5J%aVb#YmK_VSW8n}_q1#oR&v(oHF?Er`qO8$5-Y*5;^N7R_j)!a!
zun*2Vs!A`Lewk8^sF%p9RqqAerfMoJV`hUkBD2XMMN?8-l5}7BUSXi7&=g~P3>8^e
zc`t5H^UNX$&e<dB9c^KsypEJUgdgH2MQom@G8+)ZsF9~#yfIadFLso(yxrEpn2p_(
ziw;K3YK@kDDLpNXaC~^ORtt?*uF^pRbuKSBMs|9lVaTz5uJUvjZ#H!DW?8Yhx-#Ej
z=)O$L!P04v^x#l`4&O*On`!tgRGRrDYViJeDof9L0WW?JU#)0pFEWGAtHbo^g7Xy$
zEiRo}T+PMH&1nqgy*l_b=Ayb~(CfP~p-PEo3DemhEf3icX5(0Fu)_E}-2X_^=CU5f
zx++5+3Q%pwJz{H}FZt8DxT!JI;AJvP8XIB-a&&vD2o*Jq1Kby+_~~dLrI(u^B^edM
z&Ni@(rmoW7pnuj&t1+)@!fUDJ@m{-hk^qyXkIi(tVKxLEESja4i*&zF*<^^PDc>cz
zrOtOrJ7o27W}^P5!qsgwhM1cJRdqn+e6%2e$HxIYFK0~*i8gR`w>YwfVoXOewjl$h
z81+tUs6JHfL&UWZmE@igAL+V*Bp#98eGPBRIqpYr^#(jzWn`d;0Vq0vJSdQ5S^L+h
zWK@*oXmwe^Ss^sm(o#50h|TD<#h=3{t)#j+VmR%x<lZ8qz!}*%Bgi9?4!3&9(bHNF
zkJ{5wWu}N*3`F77r#_M-^n{}QI;Ht#0W{^wk8;BwwXsw$`_7^h#*pw%f=Dd_%;9wj
zjW>-47y0nW;U@oz{fE_Se7ti<^@??75A)8})myDPwUq6uycRDPH>x$c;KrC6W9ugB
zAh_yJU|zRBV_d<1tZHhv-^b|>7x?^Za~=IbNd2pAbK5mn<FDm!u^NmY=J$4bTG;wc
z)=_TB38r=78~ImC3~MD={AK&}JW+1cwE^tGW3E~8D~UqfyRy6PFb)*(qw{s`7nQye
zZ1Q_91w^b@H>mtny~ogAu$80(*&{{lS5>tTM*-DbNrFk%sT{t)9a!yPfiVv5F9{73
z*t3q|3<0MSBl2C|x_5)6o*Qlz3N8&4Sf}Urifchzvw=ongNV2gfj-Ovh+hOhca{2O
zP$aDtJuqxEMz^7~9L6+x#Jv{b7n${l@kvICKKu41hRo%EK8L>#BG)p%@4i_W{vjU}
z!`&or$L*pqR^VYz11R{MY;||u(+0ouzE5pmMNMtrUX3F?s;fN#AMV=SL=HFO(FJsO
zX)EZ!40}q3>`8M8m{?s%$$&D&kwr(Ro$<&5Tgt7)t@-)3x<7lE8(-r%HQ1h#3gU5N
z?1<?XjY@1b&kG=vLWY$7xSeIpvE&<7vCOrSv$_@*k3l#JTAt0JslQ~IxV;wiH+{M#
z!Iaoam^W+8WK9Fn&L*yP{j#uqOM+gl$y!7)bIAhIt#QxtYk&Bin?BjSbK;p%S{pgI
zGtbTllA{ImkYsB|<5Uhq?|_LDpU~WrdWIRy=#f<G_u;aTDqT#7M6LJQk<3XzR?dTI
zT@lZP&0;`4gtQ{CTRJK?M=(!wzFkMAik-|Fb6`izCI{J;Nt6*8CcCc4xT5VOjnYfa
zF{UTi%tge@(Cgwu%*7QUOF)qlm(EL*2(M8=7804d9utF8ik3$9ky)FYODJ_*f$oyF
zo>P-y9nzcH5t0N1>Bc}8JBS!`|Ab{r&ClT%(m;Jz5UP1I<tIl({rUK_W-U!6Iy|Y#
z0y7c*j2=8|JZUt;#+FQ`Y9(_dq6xayJSXjBK_zj*V{2l!gr(ENls?aA+NgKO$m{IK
zUOZ|-xKuiv@+<OlX>1x>iL<SbuApeNe+iOD02l%Sm>`mD>|)hkc~WL}WbuvyXX#Bh
z7$;^l4yE<@#*6{1vvryEmQHG-b>wu7?iJz=C8w6TM6x@)t`h2o6Y<*Sp!E($EomHf
z7{qS@m9W^m6`6e`cn15|2}rV8vS`#uYP_#m7S?)QpNpKcW~;Jn55y#Ws*hQ(M%-+3
zF4t~Qxxov)P=AjzK6Mq|3(3S1#GJRRV2<RoQpJe-*$Cp?P^OEAH_YaR?jPkvz$&}f
z-lHiB+?H)@Vevk@v1=#bzu&4li%Y#GS%FDRp`bHuyJ1t4K=ZPc@z)<+dfRm?$A6ak
z`+tp=*<<jjaILgj+gqvHuqoc;sq-S8*NJy9*l-L&v35|u?1(z&atMdqJ2`ebg~+ow
z|D=P;)@{Bz1*2Q%^53tkm!tTzcO7a$NmuQ7P`RDc6IO(GWoy%ECQL;a=XL7w0YYBN
z#fO8FRiWSaD{CsMf5+Zd*wk=decY~f&7*t(HRbVy-R+$3e0*$admfkk&h(#w$Gs^T
z5k6ArPYEW=4uW@b*nK^X54?ZS+z3XD1#ja?sr%EYb}~R|-dnRsOtn4zH$O8zXe(LM
z*`E_!;d%V%*cfaPNWuIElm0UyN+<mQJ5wYWSZBMDBF9skha6#^m-@PE_BY7i`|PX3
zIS7}zU*33UBq*Bx{LQd+L6!ca#5{^ExHW0wDobL5QEUTB{Vg@wa<&Hg+dVDti2ml$
z<f>~7VQL&d57#U|UYOFlAp_kQg(zq(ytQR5&cc_Qtv!B2)ODQ1*&Evii20vl`xg_r
z`hogKbCSZ#K8r?;%<Td=4r<D7L%@V(^nl>JH^|7&9k{3YEL=O}0eTk(2T>peluYaa
zXV%!o%rdbyXt=rCMG<|*q5Q)|$}Ku0-O$^4BzJCy&K^W!s0yDNC(Q;>z7MzCGp?Gt
z6dbc6uUHL9OCxr{zNfhn|H?;Yh;>c2%U5^QL=62`0nZMvr8xFVJn$L4CJF;+`zp9e
zCJMLZA6hp;FTBfMM3i4jxNHuJ_<Eq4BnH?sE$D?Hufx4?sH{gIRctp=|D^V?h_8$&
zlUeEANHvn;KDM#*kyx~5yQmtNK82!`+4RGKKbWQV6DcUD?&RJ#u|0VxyFaUT!cS2J
z!%m?qeyOy4VA3SRmB=sJfiiaag}AgPjlkCTM!{Rq*U1%172HYe3sAV`#pQ+Gg_ek_
zECe24-pX_@*@4@>ZfrY0sW>%NKhLVPS9^&3(~Gt9K_}eu{R10udx;@7?)JA+0?_m+
zw(s_GonE=5;*qsT`sEMR0U#htGSyJ_MSJ5&z*rww8YnK#t`D0?^PWPVS{{0t89@6i
zX1z<F8RQbE4Dy54$hBR78H&AGv~L=?#m9lH3gAXhn=+P$RCvU#OS>R`W_&H)Brc~E
z{uvde{L~<;40MWW9k5U*MrOS6+d4qNlwhp_FMw*~HK_%cDA$59ggg+>8Nw1luL7M#
zz0+ou&576mZ3%rsDnY?sE*PpOVr~^t3dAmEFvDHJ#_1-ac}2#VX7Rn^{Qfa+Kx#@?
z9-`QHkO-mS4+$n7io*8-C;gH~V~$E|>xlgazMKo2lZ)L(4t2C-YLeKDyvW*?5Q=zi
zz*yzbw1vLM6kf&5Dj^YDu8AMsB~grIo~HIX7ig37fsoYln^W^kPezye!@241H!~bv
z!H@>*8~Su7_4{h(!y*$rT|Z|%Q=Y=p__6-SEYwK_b7D+f38jic`Kt25HPG9bX?`A9
z5;elPIEGFUURW*%w_jR;+l;bX-=);wIp!IOlxC<8N?^Bmt31AJo7jT)&#rn&NJ!0h
ze!82<ma<P!{o)Z?M7R$5_Cm+s73Xc#S&Ra4mp<s(329XOM0?lF<4`U`1Tmsu@6wpa
z0-(h|)OCU}nGXjP!_+x>52o<Rf|V*y;S<2PPa9Nu0(8#No{{^4CG|mu;tqPu3zGY?
z405Da;9qTCZS?j1lE7Cz`h<I$OmDR7{nyuYyVoStsPZI_`q_qs8bimaTiazVZ&5a_
zuGLmzE&O^5F^pQ<;N9<j`UXpz1eO5m8gyJ>n)x?=BykolF98FBD|gDnnrN!^W@UkE
zc$wly2L3+UVYe+PVtaBWMTUU1SFraB7cUvhTd{J9liU|a<)PlnpC_&js)T%Lbhl@#
zc33(3SworPd$;jRy@B(+Iee#_g5%?dHj#~EOZ0K@XD+cinTH&t?H5ovOx(-E_X!;g
zydmpHJmo)M>;4Q)aV`hU9uOp+6vT)?GFRKZ_l1=<$w#e;KgXshSjE%m4tX2Z<hecL
zM;#Lf2QnSwvKeDYK2l&lHAnF3`N(Du4UnMo117vK-crAUf6DT1#2VaH*0Ht*#mn3E
z!zKJWVG*}mAZ%&eH=V^3iM+{ij~A+wpr;}wR0`t;ghFEZ5k%o|$HI5XSQfujq1U;#
z<lyZR$W0yg#F$OwmbZGBk;j(UDmO(WTzxLT@kL#4P<&yD2XXyVhr-NmUGm&7K%cj5
z_L7%6GySsCm?K{c+-*LL3EVCcE~E0=Ajw(SQ2#pU_Y}JS0DhhI8Fkx$-M0AbsD527
z0kh+<7Pi&vZ+79Z2z51_ax$52zOOp#jVw?ByUpf?-&+k)!t)$TByLq)B10vcg4<Vk
zicQe7<W+D^#a^qGIaN{V8*rXTJ$$4Re1BOb`&26M-+&|bH)isTBrOo-8$5}?iIXaN
zTS_j^PE8%c#Z*c@d%er|!^{dBNHs|;vJy0f6!zHGj9}rYYM$MbzIGoO&Yz^cmtg%!
ziH|xUZvB^bxXMc84r@-Ji|KM44!*Z367TV8uJC3zT9+1*N;_E$Ge2Lbx!_RS0+fna
zs^5ntQ+>i-2uxRx5*L4#X9!jKs=AMWu1$NFBN-~r^hw0lc5a({j>?u~3ch%$%D|QG
zT$^pL&tho_$VyK8Y|Wt_uw6=9#YIz$2C24qDxnyao*(r5A~;-h#_#0;6P}4<&{HYn
zT=8+_R%A=E@HUy3;SGEr|7wX%&u%rI9?<>=tpAnrZT9=mH>Pi_udiPY&0lp`iZN|>
zpX8qr2m=1}#kT^;uaWckAQW+8^c&>DNfkf`2=v0T{=b|Z{cn5W=!hTe1PJICK<R&<
zwP>g@)Z4QF7%0bwhlhurfbMe@aHWcM6~qu%8wSm9^~W}c1Y=OaANU6{Fj#8YyZ194
zC3KZ2)qw(e7<4rrd13|8If67k+f0CorBs)M^<LkUU0@S}J%<Z#PmXiPNFO2|K_8wp
zjkCuZ5)yL=QY;k~GnYTsnw%sSJRDYdfjI8Ne%=ompyi42KlV*b04;zQ;0Wjftbp)?
zSc8;<c7TzC1%r)&t%03^y@A7mmqQRj6hb0H=0c7^UO_=aVM0+uc|wyy$3vGx_d%~f
zU%`OG;KMM(NWg@`<iae#+`;0*3c%{aCd2N*$-ue7L&I~z2f<GvfFdL#A|u)&K_V3+
zvm-~NsG&TdrlaYi>tcjsd|(D+L1VRHb7OmAkKricOyDBoYT-`d9^jGUDc~*OqvIRn
zHxNJ*@Df}R(h^z|dJ`7@ApLPgL`zIhoKB)e8cP=Xf8UdYiThyBAOJK{A9X;^AQGGj
zgrX3X^ncF2QAIuij|1ITmuHpEA{mwPpj4PDV=xlUjfj<tPSR;im)(FUC4iS?Iy6#T
zXwEowPB@0^!RP_?q=b_0VZ{k3IL-IC@|?~3WP1^8lSe3aKR^He?j;ZD*IqDf0Dk)n
z(S;JTgLp-}75MvwdY5S|hk{q|!=;a7$LKH2c98tedeHN(^b7wk*bBOk<O?Q#|251u
z;U{l8sW<enSGQr}>;cIJhL<lnZ@}~r7R+_;?n_3{Fr{zC4ft&g%(h?q{x)hCjNylP
z-}??Z6wHsFTjLuiI9)j(iI=CB%Y&LAq}{__H()2){X3G}K-yH+ttrm;mrSJtv-!O7
zUPJX@D}BYzVC&sjr=sYS41MO*;OhLblfzjj?7v@0Hgua$y-f!~Trt^$ygVM*@~4d1
zoeD*YLS96o_H_z0r@C<U=y^&hcQjcRbYV{Qb#=32W;_WsLVsgS>#NV}7VWe1CTSm*
z66My)bLeEzKCF$dw5_bFU<IMl+)cD<<2%he`$!p?P$Tq3t`gxbsbMc|=-$g>Wr-^1
z-O~%g`)VHgsGH}Aa@$3xMHjf$5nlVi7$Wg{;)!LNr5mTvZ3v44QpMM)R^dUMN!p~2
z7mFsi;mb2RY~ifuxxMBWIyvW_gS6-vQ=+&%Ulf`ubx(@X<zD@=h}AeiM!YZ2nON)#
zzYRk)mj3hDjf^_Vc$&XV<i*Mp3moBt`x+6N5b_mN$WK+uo78az4Xob^<q!lzM&ygI
zaGj>Aw{6^^K#%Ny5ca_2v&_T>f`JiklYuAl2_D=`%~LDpqp-#9j#4eWKy!*~!eC^3
zY*BqsFZcvn`KM3M*!p|j$uec{0mm~h`K;mzG?QlXfnn*(wJp(85XZa9Qz{n0F8m#a
zJQ})9UcIZ>zaY*OR8hBk;L#~{9Fl7k#b{?G2iw|TXgs!w0|Q;7w=u5BjtbMNF7z1X
zd7%>d1912WfH-en+x*fFrlDR>N_9UX2t5<&SMgMN)^RqSrZ9Q(TVo7u1Ur2P*<eib
zhwa8UM9GPb0@+95)h`tS&lDI3fA@MO^K8`zz2tHx^Pt(>ABYxp8gD1ROR+)mlT<()
zGdbrUg^yT{&}g||1+2%@F0;whEUJ#bgW5Q5$fwnC-ZNb}6C8iSvdS9{^B%Tb9aTyv
z#k)o?Ht@O)%3X~Xn>q)*J>N*9wMleb+z~px)NI&xU|p1nr0sJdp2{KAw^alXy}9bf
zFiZkeQLSL`?OGrXfJ<7rh5KU&+ha(R*&WQP;qQiXxE0|ohZ&1?WF|b$PB+5oY}*IE
z*|RUxD}__m9Y`D^6v-Aol-m$21YYmJjmvHj<}1$V|Lw)5fWR*w_(S;ApBMnD7*IO*
z%=Mn!$-iN736dEOXjq{eQ;X?%mK9??d7W82Y%7BDkOO;RH-Beh!E4>KCL0g`2-5Ns
zVBnw-B1h=S38lt>4WRDq?;4wd)PnZ{22j@+^M3XKMhsV`pgGcEY*|@0%rRSLEA0zb
o4@mRG>ieUP{O~4WI6M;=N!p(vAt9F6WMHrW10a;R-+k%-0Gfv?O#lD@

diff --git a/packages/icons/fonts/fabric-icons-2-e2ae1f0c.woff b/packages/icons/fonts/fabric-icons-2-e2ae1f0c.woff
new file mode 100644
index 0000000000000000000000000000000000000000..b1651930ba8d4922d18090c050827dd8a60db4fb
GIT binary patch
literal 12568
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
U&``_&6yR_G17NiHUkC9207730A^-pY

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-3-80b6008d.woff b/packages/icons/fonts/fabric-icons-3-80b6008d.woff
deleted file mode 100644
index 9d7bbdae0d8a89556ef3fa39d4def651108aedcb..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 14136
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

diff --git a/packages/icons/fonts/fabric-icons-3-a13cb765.woff b/packages/icons/fonts/fabric-icons-3-a13cb765.woff
new file mode 100644
index 0000000000000000000000000000000000000000..43e515991234bd7478881569c2af7cc7cfcbfb6d
GIT binary patch
literal 13976
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
bo=Hrk9gmQZ5G(7lFqnWr5GtJS1Ni>{5gXGW

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-4-46fbc7bc.woff b/packages/icons/fonts/fabric-icons-4-46fbc7bc.woff
deleted file mode 100644
index 21f88850142e85378dff453c1a90531e7a2f0e50..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 15328
zcmZ9zb8x236E6J3PByk}+Z%6e+r|^yb~d*2#<ra&wvElk_9kC`-#LGssk&;Wuj=lZ
zduFO@>h5X}MM+5j7~s3{?*Wki*PEXLz&%y}H~N2@qAD{R001Wb%}am7h(pD-+SK0I
z>6?rFh9>|3QAFp2k7VlZO7cC1{MPyI0d#QdaCH_=miFHq#kYL(t*iZ!cM@-D4E(l*
z#Q5eA|9`*&@Gb4UEWSAs0Dv_c08p_@zJCa^GB-8@064q9b-w2ZaD6ODDp-A!-`uw^
z0OmI+et^M3SlPRNuYn8pTh{x=DDDg@vz?>qw;tEGJz)5M7_M9Qwm0_to|l{ETPFGj
z31A<b&B55-{G0p!E{G=p0PZa=^G3nR5$O88FCyPM|63!;moi|@$;JHJmS62#j{3%;
zXU`q7XO5|n@z(%PP*7@6kQ-JND+EL_N2o>bc;YC<@Bj!jGCm9ojVMCW9|-6jfQLs!
zuJhc{a1MO^kqlNH4>hQ2WCQ?wPQey>=1k8kN~bvEz})O^;Sgdi-TN6fb0U}&(~^<x
zgq$7?NP3<%LyNB1WFvhgv5-+na-4N<7MXvNpAxvn42O6{jg!4aT)+F#vC96?W6p*o
zDjo9Pdl&F^B=(GD^<R`8e(AQ?0U6vc`xKP!Z8y?p6h!fmO6Am}JI8nEBHocOw%*Ys
z+(YuOPx>R@Fu-J*MQg{q1g9|EG0Aq%!V}++R{0KF3!NZZcJyQWPDn7_GVb0A3eO)a
zUR5aCBiVLIa+Wz?&It*Y!u6Dhd282M>C~NZPFraJ`Knjl#K&CqsBJh+&-i>av5g`l
zzRnJOT(Jf8KZ#xK-&fbOpHSYjYq%J-U>N$$>qG4A_OVy?4=^?AV<iNJfC3}v3`WTJ
z8IqWoTVik?O2hVY`&bS|f%xO(5r_-zkr>H52|(#RM1^9Q?bAV-;UAAKkP${lZFZpW
z>PZh}XLI>pkmV~4v6=eLxb5r0%gYykuTc}!biQz*BLdp@`OTTYn$s9r8EK7-_pkL|
z^m_&lfW^T6001fpU{XDE^b`6NhC~oYffUW5)FOPOxo&h~sgb#V!(}O!C@B&Dlm;&S
zD!C5)9X0|nd*Fb3Zvs1o`pMMVH~Z$>2P}V`@O95Am7=57$l=~ESVBNPyUhIeN~(Cx
zWo|6D?4|K+K41e^WUGMvC|_?iKKGa=XHP`jn!{+4J`#Vk;It5~aAps1ujm^iJWv-%
z9w84!+f}^vi<NzAVbBO)jG?NAcs6LduK<%9F-7-$!21y}ULx#fiGFCuYrfg901Ot-
z2Z29}XNA7YCImbdB!7j!+mH8Ei9X72JzzaV7!L&37p7ZoD#76yy&{Kxn2iF!0N?;v
z0Q}b%0L3#W*B8MEW4Yso_kL@dDqHR;bz7cm-Oio+dey??o@||h;s`1Tl9UP(92Oj0
z$BPyg*Q=^PBTT4d#c)8Q#!t&$U2Vn3_Hucnvcf*#ZMUc*z_w0vbMq;}%;TjGXh8)B
zrn@;kGn1Lg{^vIL`kx<lq-X-k@a1tE8CDdm1ZCaP^RFGLwJ*7k$XDe?{9D~I$G(K@
zh`phHO)e6!|J)drR)Z;HJ+&<o!DqF2N!i&X;du5S+?3M5a0}?*i{M=$1)~i_9LYkf
z1Y@V^B9rseLC)=EQO-x%`|%NQ>fEgRSuUe!SiY~Kx@twwQ1c;#CcIBc^u%fj$!(xa
z*}CjK`xgDK;wVaUDYH=s6olnTTz4JC5+wgo&OB$v@fuw$O&=h0Q4GzhZjYy|t+7<x
znChZ(MJ^1!<*dW+A#%bnh;6L=B~>@m!w>!yE>PIEt#0Q#0>9+oQDzR|8Qt^SqikPW
z-{|(du!?qvS;3J0qVPW%FHIWV@X7L;UYEA6Ez9LubgL6W=)ZM;Ex8oJwVH~waDSVB
zTpnO@n!VgL-!1^}HnX>`<XNv)k9sIkq~e~IID177H^lt(+w66(;)I&T9h)tV4;0cJ
zWm5h1TZT1PG;!#sL3DALPpSHE!^<6>=13i*R&OkIP73}!eoIc!zWcBTIEggH$Q+?u
zMVEn$e8?3s9<N11E{F8Y4^v^oiy+ADdd)kToqA1p83Upu%JXXn?M;0ebQ(F`fzcL^
zDZ@J@j`|iU#%IDT1J&1oDNLog*i5+n80p?f7I4s>)%jeG$7}0mr?l##aV^(&6K6rH
z<;uuiY#Fsd_By|)>c*nP&;MYnID9a5BFujJAlpr1yVNfu8qvTwLHfQ1%Xejk?X$&_
z7uvuC&cTc0z~1fHpui{{{WR#qwPFzg5XKpSOEKHaKs3T{i^x-)LA@-z3xK3eXF9-v
z4*s5INBh}-AoUg}r#hMu(<v#(QgNMl{gRX8zAz%wj{cl%+TEz4A?*p%t|!m_g*WST
zQDFcjE^F?qnA8FWu2-gG#N={5@4}A^^)ZF$x3Cf`w%l0ul4Vdzs5MFU7A70%oqhz!
zG?(x+3F6iUYQ8m5@(XYN4ESX5f~ZAQY-Jxw{w-rV2Th8<kopr2WT3BaPEH<~^d49y
z5JY|K$b=z6$^kPC^@7&^Uq2!^IZ}k(!(Nc~n_X``HZp;d@-o=7g-Hq2*)LL5PA1z&
zBw`=i%^On>`x^>>n8^un#$x9|yP!!B;$-sJDg$nMN4t>l<wsmQT6)J;Q47Dr_14o$
z!~SU{KQ^2+6>&7qO(sA{lE|xpo0R^pIsI=Y*hLatpHwyMT8M9j_VGp_Cg}tyW8Ia2
z;ZH_A<WK^aF#!!M+7m-0IQ1_Lls{GnLv{kqX19aMGhNsGTyt*c&jGjlCtF+7#GeQ6
zZSF_}UDsDLRYa!5yhXm9wogG&2*^`ArM})J_V*#P-L2k_wzC559n*meTM}1yZ{2E8
z+r_b8w{gV6b7`6DPyGqIFXUKP#!5B@eqJ2a7hF?@N;+z4okqQ)>zq%wo6G_(mSRJ>
z3EekOW2WK;V8h}R<1|RT#vdZ*fqlj}F6>X?u*XASznRH89+L*fL1Fe>w6_fm)L<g9
z4C8=}OQdNRhwYEbJ)SKYkN^Pyoot&%PmTtmqtLw0J~_!KO3#zko=8Khz_kM0AAFpZ
zv}q{TP{YX1pW$2}C?Yjg;<rG`13QUaL@N7SSfHmb`^`_e;~KbiWyqS~9YFDtf}MdJ
z733C*1-Z(K<%u1skzbM(dX-8mPP~?Ymc)bz%f&$987v9G%yZbeGkRI7xYf@;InX#!
z1%x0lU>IfFiu!UwuDOA1THRXu;~pee*=i^_QF+y%PEU8ihBl77rTRLfxppmCdf%KK
z(+yvDe8H?ik~#Bq8w>&@fLcy7$^6PVrDpr6k<PTOtOH@Y1M`!hoV{jS*=VwkhQYP#
z()~Yr=JlC$XrS!2HMDB_y4~}d{b+_&OGmYKll&-#R1mw81x0g&Q(jO7j=G2kxfOb+
z{31O?2Ay0ak}O>aTZ%4G8Q3OGR|@Rkr05iaAD#y2?5}5Ll%I|K>8q$ST(!BH8f!vm
z&YCX_GYj6=o>RJpXB4H~0(aGRMD-WlxWOnWUyI!0;yS;IHZXhCgBi@QSC8tYujyoD
z+5Q_KTR0!qzO&JD48f|Gi=LRsmW%y;Do<IqJG@v)MOD@Kz?(Yle~S(g<j;&Jk&Vj6
zrVMlP1vOE9$3Jj~!ohr-a%6oR5bhtTs5oV>zpBbXnGxf?((<Gy5qi52K^Bzlz08)B
zsQIX;a$o6T0UA3p$3tgN^hL;y$QyR7d5CxD@%u%y+v~Q3?`8GhhTXM1SdCnsXj}S{
z{@V|3)iY{?F1Z2Yz%+Ab>QnC3LI_Ax-Uz`(<Cb$sop?@3o6#G_fg>#Z-({hkrD_av
zbd$-Mxz#+6OdOmD+_yLy1v#`g$G|xPuM~#Jx5?3fSnP|wOCdOXN}oy+xNx;Xt7h|+
zH*nJ|s|PJ|jRe+hU9DWrB~}$x_66lo)vfjQD-4oim-MDV%gHLHhca8t5f0OVH|-kP
z7<uFgOqR#(w-;t13nnaP*q7@7-44&w#G>whZUIK3w|7$HNmA*HhRQo_su~9V@y3~I
zQe{!*JjGhL@fxLkixk=NAg1T8*a?LNR$LJa?YU$4H1kf79~T?o1h;t7Fi+m5j90a)
zXdkrHToAMQIzRb!K3ZnRz<%HFgMx%4_^=Z+HMI|g5I!L)&RI`t-1efM2-8u4XtqJt
z49;_=qXh$k3sD}Vg_<t{Ik8skj6jBvD@WiGZ4kESl)@+a!#y@6JT?jmgq?~ODX-I(
zBV{;^gC}$xnyaguYmRMfnks5MOEfl-`z>pt==nX0G{$aqWeKQ%dQYHRD9=TpTpRxO
zb(#0~UBh0&eCC<A9&Z5Z8I%ZgM7~!Xg`b?@|4QTVyFaVyTOY<!+i5>Hk{TP(=hk4#
z{F;={_U9GWt`gEI(op+6Z^V1aYZQ7OHX*BOm)iC-&niqTbw7fq2~c&=R7*vpNRm6s
z_k`vJ#0%A5{_5{UD5S9gWVC{5k}RO0&;KeVNs2ilAj2Z>h!Q0?u_Or8G)5q(c0U=&
zqhJg1Z^#j6i>R;~75_Ic%&-7|kXa(&9}JUJiKrL|sv0lIjhh5V^aS6Lo6{``i(yCB
z(3sWgTDjQD0K0YWM{g^8He!a(UXav6W3b>oN5|r$i@rl#b0;$HB5kWDi{UJbeBmCP
z-!)<#8NYL;rM6Q1NNQOR;Z2@GAj=jQ)EkQiPvF>g7VdZAXA5?_5J|P7{X2oIB11Ef
zY~C39FPWIXBnvju0mhdR8IFUY3&KoX>Bt&$kN_~6|16aSp4AprwYY~4JGYC#3jaH2
znShI>Tju3u4`+xauFJIR6&UO#=qSfdF>4I}Hi<$tmesq%;N)EXw|gSWG`bpdZAej1
z+7Enp<S+nR#WVg`&OL=~xBp|QU<z$<#Gcq;AAbQcO5Vhxla?rj`s?6zL2q7e54;jn
z6}dhDVLj47!i#9`x2C!SPNDC?%c*HsXP1W{7l?8GmmF`$l4D9!XSg>%W#?E>zl@`^
z%I(uxEli=Fqlq^$5T(|}O3TgZYS_7FxR0}`YZ!=Bg*=t(6DXiL3(KA`L}m!pm^^ie
zRvN?t`&l_Y&PYhu7AyYHbo26J`o`HOO|R@}#RWYgJ~L#tA@XIxW9To+3&B2aX9CZ2
z%f!(AHI>J!@00IiC<Evt{JIGX5!`;y|N0T~bG7CA73KFWKMHLWaQ6EAY9ru|-~@R$
zYy>55b5+6_l`o0YZzZ<cX!<CL)n{3_KIva!fwxSH4nCEzfpT7AROv*{0BpWAh+4s@
zB(P`<ES2nPMK>j~2lKZy3Bv&?8Rs!Nx}_G0_#F{7b)-xRNp<KNE-T*{<tgdu`mYN_
zP~?Ah=uz~M<6K-7Y$lZ(3oc7V(d<RbDq^7q_5GgK>&6X>8Z7nCG_QANBO#$dQbnR<
zl>4A5v<~`8KDGxd@)LwoPE_+(@V~ja<UK*9s|K3D!@n)KfB)jzD(-3lw_9W(ddPEg
zPYRgnRWj4Eyyj2k<lC~MBhEkm0XGS#EG^0w&GH4?b`81p>>9J07_r$^7wO1ln)l{M
zv{SV?@imw;^)v8orn$T9tP4SoVXd5)jD!ZK6NFl9Dof3b4>cgAtm)jeT|5wDPLJ7R
zIG(5VZShA&aUm-iqxZ?^<E;C;<!Wk)xkorsxRa&3j?A`Qz;n~N<HxND?ZVogmA;0Z
z%dZ(ZL_JzcN+l96dY5Tj+><T%I<+6tV5WSTaI^9wlT^b8+Q_UD9GV=@jQYE4Zqxn2
zku{Z67iU}e{>}aAnVNaI`g!Sp={-5R+ZHiv|7(=MLeyJaZuhq~1cu=nxK1tD8{63O
zDkG1tXje!K754w8t2hr77$~)tbd2ou?8cJ-9}JRl7afHXnyVhFoDspGiTN#%2gx5x
zqn4sm?Hg4ES4W2F$pHpoV?~`1c}mTE)OG}Db#Csg)ikYyJ=262px(eOgqoX;rNJy6
zBJhmjJ}AK8bU`~g<f$D_W-UFs9lPcK6&o$99TjzVc(^)}+3s@0=Wf^I5-Ko219u=(
z$P|nNAH^J1N6vg#Octns317_D?3pzJjwpcfr0;GtJ(KMp=*nrbB05e2>1hL#)UUHJ
zfQDiGiK&I*fzx<_iyP0t+HqYvfwEZL9m>qlWQ079`n9P@+(C3NFc!!a9yU!K@Neb0
zjvdD{oD)u#2wS;x+L+)gkCj|~>z_&0lgIh+TFlFcwIOtQj$xc?1~Gj^+}BW<?B8nA
zAtMf28T3!QUh3mMcHiV9`G8$%Be^}+vVr1kkRTxV#v?R?7_tyQH2>EaDSc+MgxRz>
z{)ngsBbchuNXG8*9rfW7sb82WnIzRme~{RuQ9nbZKpy_TGt*~=1J5a^t!Vz*eXlfA
zpU`v{cq%2)8QJNs>@gjW5r?pQ*$u>w!6OR@|7h%2SH(_FBV`lG6K-hARlH`MV62Z?
zQR~Kv5ldM8#EwzpS|K$#&7MCC>Z@OBSkPH$r`KqYH8N_Qs*76+t6QWJ<jbnzJv8NO
zjMmmzKEG5}%F`E<>%0MA+s-*g9&E+5T(WfIcGdDbBCCAvCH&hds6-XB+l|GSBH2Hv
z8RbY8uuvz6rLpetB(dPIX;@oYm^s@%Gf}f{+u^~s7>w}&a@A*eaQ2(&gQ$jKOk!IF
zFi(ZX&Cr*H?8lL+;5>{lzJX0@+yfm1wbKN~&1(+X9QGBm43UIdCEo0hzcyI+C$p%C
zhQS^MyTlL^v3UkH)?Rk{df$6;FE9D~p05m_6__2p-`DGE9qshKmMwR8IBH^nHH-TD
zrC~U`EG1k2Ld(?I4QHqIyIed6jN)9}7a9GY$8Ei%p|KGSn`*tId@ugP6g14U7fF9E
zO=B*Y^j-vA_|468{OMA^d@#`O8!c|?+X70<{2X(%>oiB7siHm8r{CRd`^(`Pce{VA
zNSG2)1q4QQTg>C6jl_W8PA(U$t8U1{8G{#GqmI?2zgUx#GQ;v8m>muFyTJ9kwT#(N
zC%ehD8PqXu@5B+BF&whJj>JQmhF~(_3Hbj>3%Y|-6RJO+IlL%vm~9LmVItWc&g<&>
zl`nNP7iF0i5?$NNB8^kB0h#8;-)`O}uu^j7eJ^5>1D<0|(V3U(otar7PQfODP4(+U
z3<`?V$ct`A6aq~#E}uTX&;LDdEx5~ZbC>nnc8o};`|tLjgzdSd-uI)lwH%BSZu3<E
zry+ymkAN>b_qX7NG5^=~Ag|ri-s@)+#QKJ-Y{`vZ_O*>veQeA>kj%n0cV3Tlbv^uW
zgjG=AclJin@r(Q-6t?T%Q&tu1tY_TA^FGCSpWQ0S|MS)&jcr9|gnTF5mr0F3D@Th}
z1|NO|KM9WB>Ca%rc}l4)4?nWGp+yU8Imm8i!OBQ<huH_OOvWKYu1eH2Ip6~&k|@Se
z3!lKXV~CRw?oJy`4NDU3?94ah^4R}<CAd}9M1)FpPtX4A+#wdjy*Nn?%1Z7VJv|J2
zwvU}C6|6eH;e$?c=heO@y)B|08@!^hR|G(_d@lSXnq1r{vkZId-DdJ-<9X=XQ-X5t
z>(ZYn|FbmVVt43=aLadWwSAVi5W`^*X+DSpumDq2eBdjpQ077s&{b)vp<QU>X99);
z?~*&{xrY=rqSRS3c>Z*kp4(XLwl?(m9ojc-K1(te6&3DOR_+v%UD}D*Dl{{Bdk}x<
z$Tp2Sa`EYFhl8%@EUmv<^YZNfl}e0!{JnS4Ft?=iZF*?J@>p=&bDdkyh1ITTZc%=^
zpl(p8gJLS$DZq|3L_3gMP@+~=uiejo-Ru5<4sdt+K!U)@skDbr#V8Tb))!QKEIs$`
ze!l1QBH%DV1)j2C&E#(FO1Qe2f7}?G>-7zS-@k`UAc3f1ZvPdm8}7dvUv3`(mWI+o
zKy=GH;uYa<vXp#X1ao2>yhp`6vMmTZ)L|8G5_*$GVu;ZLRxD?c(X7E#Y%CEt_}P)D
zx|vckMGUA7L#};apL6fmNV$Ui4?FK<BlLGum>D8Qfs^P)6Q+SucMrT3?(U}yOTLCp
zkBRxCZ;+MrXm0a?qq8)hF-|}|jgJ>Z=0zMV_{D~%0_NWppYCoK1J(~%cYNKdL<SM4
zQiKeTTJ@Iy`EV@yl3L76aWr|kn5cQ=!hf-sc;n!*QMypyJ|LeUsW^h$OdcU)Q@2nX
z;3(vcS`P_}GYr_C!5n|Te{m9EhhxegYa1a@Ps9jI^wjnLNU-=G(WcW$acb<Pe3V3>
zPqyR^Lx~c_q%<r>A!hdNgAZO;<sL553FKi3&%4?$^oeoXX2T&$FteIQ?w^!yH~ry9
zXSMVSl9y{L>7AJzLQh)N0&DIfrg)G1MPiphFgVL+4|O~fI~d6Ph+Qr0Z1JMbB}g7J
zRG>y(7AMlO-Wr+TpH)(Y#YBm|z&rmcAq*uPA%YqY7BzkcrCpJH8!cl*@63zLwa0AU
zN=G`$?=}aXPbm;GXN)z)7^pK3Z?(;BF7jTGUa*1UE<Pj_qo^WipCSX5qOKm06GkIv
z^k;q8C_~31R?J5%k=pcN_+LmAx^$8$Yri@fD4BI|+k*Sd4bKw7V>?$r$+5wczR9#9
z2fl73*)U1|tkH#yYoh9q?J)he-sPu4p7Bg`bB=U@SuBeNt0a!gY*6EEjJG*aI^ikl
zKbr8^;N-|zRbB1GJ2i$UwO^v<HDlPcwBtAd;oUJyZo<-kM<U4zWK`bi#0l-zWQ#=P
z?Jy$hBiz<xmKru{qtgpCvs*_d@#eyorhnQTFh}*#w&{XrTGWlv?)CihOrQVD=xk|8
zU!zjUJb5)CudEX%RL5RbKtqm?;&0e)E`T`+GJIK@juI<nSc5M`1^k&GuIS-9vRq$K
zv2*3Q1it^_BLKepTxugjjK0Ws=iaPLaJB?pE(X^wJpL5rs8mozUR8_8E_2}%QPHZh
z*UBR0V`M)LDbw`?rreqdtjf9}mqGLELwJmF+ePjQ?zxzJY<jiTI9O@<Z3_G&AiQLt
zJ0pm*u?#7zYQDD1O62XZw(Q!lIgp8^UkR0AFX_0+f{#Vd?Plwtbx{B<;uTxU=Ut$t
zkR?$gpAk#oEU~I{PonJ6?wsvO{NjfEuUJyaO@aXYg#Pxf#Np);DE8;U@$SF0+b#)=
zm^gA4m;Na`{Lg>n?Z=UKt_y^J+*X|iIWJRztOg2Z&CT`PG(+VWo>E@UFDMB#&L_p`
z$(F9`Qm^#5^bLy4gy(8b=&?UcLR1`?VwX=KtSP<9B|+of73{Ze-QM6?zaNc9BU0Z}
zXlC*<@D39NGRp%^LH~wWewnb^n%d!xR<V+i=Oj-H82RH#v(RNz(xtiyW2R2PL59M*
zCPTW)2G`36`ld}#R(%c@-Z3FALnWIo2;(-usM@mKsm(0xrKCA?FnU+u(b~ArKUCD!
zcY9rKnG~T+E)4-Pe#qpu9iI+%cx>?)(dui~m7@)tc<1zV(R*&MZTFBT?Dhz~eyGJ}
zyvJ}@j>y;8+`(B*&6hTX{EMiosUzwxrB@P1CzfVQAo|avwfZmoO5Hz~MoE}5P_~;c
z!?O#1Y%G3kSzk{v9`p5w{k7U_-PB|#bVV5OZ-}1_?w*Vr9K|SSj{}j@X`FZ$MBsW0
z1ET^0M5DLJQR8s7Y-67^(pM}Z%Ss5L4Vo7ENm842h5IJxb70j`&000D>Cf2es=@YA
zZot@t+quFHtD$Hor5MR-`xCN|sdq2das4f>wr-eLgFte7DmJ>(c`Y;JWZkLZJg=rX
zwC+q^C%0DpLwK%ziQB0}!}+a54?3l!O7#yJe{x!lIS8j`{d9BfZOUVdkFCp3FX)!-
zGN*M>%?N47I@b|l0i-S{`R$y!nb5f<a?xP&M)0-j9|YyE9@xw5HR+)`!$@JGkmsL1
z^28Kg8g(HbPd1-4^_ELpL|JcQU8|bZFz>8LsrUU^ur2+n)Q71&Bqxa3@;~faV*&U)
z2|T>p7U&Y$jD*rW3NteJU*yMmUl487c~JVeo<I9j@o11U<Ze>nO*E)*B939=tjQ*$
ztw$L(2jupAAECM%e3(0YlH!F66LQsGQ$>$89SDPMD&urC*zKipNvQLwJF%rWl$99Z
zN-1F*<_E^jL^vQzN=IXdj0*lW%ewf$rZJ0$Si#{*tQK%u33djF_w^aoDpH(<Y=&C<
z`i~|Eo82dg1w+`HBi7w++=j6QSJI_VN>p)O+Pr==lbB>z(297^A=rA1-zKDlV+k(N
zGQ&Sg06z^*e!Lptb&?N@GOPPI0bawXhuH)DsL&`WM&pxg&Io=9u?`Ci2(bS44aUX!
zg-ihxE*@~#B{t=e@=pv7Vo~__g=H_lxEJ^BZ1TuoRiL-H4ZF3h=z)Iz*sxgtiv^o=
zf3#186D||}VBefJk7#S(<glpDNL~LZZ-7e%uQLiqc@ELw^*>qPoPJuU5ofu`7}hLq
zA8R|enP#n(KUNZ0BG`yoPzaU?r?>*5lsqZ0^s-lDmYztG96QUE(~jJ0Hs~<n$i4Up
z*Em8v!zF`scTRB$3$|d>5AYO8Gp3IkTD-N@{5-BCyrlFo;V6jHF^9!Y6M)(SlXhq!
z8e5KPkSn9`B)&yZViCs$2c<p|YzDRy&&z(0h&J9-X*Xh4JD`zB>9>%qjYmT)hfv|>
zmNLi9tH!fjU5R=4aLLmP4E3{{+a>>Nkd5QHW=0=yETWEJ7cIt~_Y)MsUj`!HV!L~p
zzYIxD4cSZ(5@M^7J8;&tk~rV*uI}~qD*m}+E^lqVO_ZH=j-B_nkE1ET4f-tW^cE9+
z&waDB19%~Pg9T*$>1D)!kU`LOJfulPbt(J-ifEH#u6v(2jHr#0tmA!nQCyLy2eLj2
z5}3{%GyivtaA#g;ZI0RNx<z;j26_dS6)m>PY=;dK4slXQqE3`}nImZ-DB8eTQs_Ch
z0b0@$1<*JN5ZyNz5^MF~G!`uec<jMDP*tJ?q(7SH1l&T?=Eg-b%qT)d2%n9zZ^U1>
zHoBcTzUJ_Xo~Bj>n`b~%a<b`;>XT{N6XxC4&0Cm{sCD4;awbo16e%skS+<Il2GGfd
zsw+DBYHE4-nkj}dl_;DE^s;yE4C^jHp=?Du6@!(B($ZY6t}Pz?T@xC|u1Y-zJz!*|
zWQvf1tc6ACJ+&f=zxflg-Yw2?*+>|2#0t2TM8k?8XtJcdl9GIKC^pMI?O-O&nvDq;
z-wKQ3Fd}O?Ua(KMSIq0aVLh&dXu9;djj_g3=}y>BchgNLKU$c>H)wolcQN?c-uusb
zot>4{+D)qE?m9<Jb!cSY(S6Gy!fB&sGh5a9bODf(lfMegZGdOG8V3>-3oZmX<c_>#
zfCs={rfC_9{ikEaS25bdN|Gr?q9(tPy4L=2I~%XQL*RAxbujh5rk^_I|1{R{?sW3y
zN9X-%N%>FL#|PSxxF(IQwLEjg99QM>^fE-SNB3QJ$~x+OOsJ>UGU6`6=SumrzW7h4
z;z;i3K$qbTUiZHt$2vADYzM#BE74**y~j%wM@{5ffyW-x22Oop-^aFWozX0Wq4Td|
zuWIu}N5g-{t66Ie*SR{l+QfOD%{`YJy`P`GwwoI=@piG}Ec;M&Ll*z-7%Fo<6?3u2
z2nsZOg=ED9*OcL^FA*XxnmBL$Z5Nu=UFmzBK^MbU*bz!dicr|<=;)iu_UIYny?#o;
zH@Wm_)z@|PdtB=o!)E03&)0Jkn{U~Ca;k6!Qmpuwc)T<en@-{(wUyO=yiLmG7do%6
z&5wouA+k=8;O2JleLbgFrG7e@)*-O}+uqw&VRiLL*l>EF?WIG|r67JVAfvk|d7rsA
z8Im?2<;(|NlXKx?d}zmjsyO^gOmY2&-XyyIzB}RbximJ;p{gZN5v$-^#xS;f#0Kwt
zDGyRK+=@PT)JgFai)u=Z;&zIyQ9DRsgMW!8=C~13FYk6?qjYohvcyxNh$m7@Veby)
zU$XhJ<EX!>N;9hitf;%5%hGl+p50i<1Kak;RZ^IhmNgs9+<~8kGAYZx@ek2eai?LO
zdo!3;^&qUyl*l6E$G9UyNjT-28y{j{q!|d5O3jsje4Ua^d=D5Y`^b=r+UHSp>Vt}l
zVumYMB0qzc_r~2|kxvO?Riv}1#GZ{Tj~%m)CkuzU!g06qnhf?XjX;RYIckxMA>=C}
zquL_JZeQb}v&&}#;Z@%1OdYEoS)O@poEy1msx1$>9XyL-yJIS0liZ0Vb<)3Jr~XOJ
zr>&zEKKiYzFX}?SI{{bz08M40w}pNMd)8{`nkjaBU|5Qww&L~R)1<NXo5Y{lmg3jq
z%a(s^gQ3Tr(HVxaFNlEZw=cSIb|kR;!{Ki3ujPyEBQ7U#&W7NUT#Sjb`0!O1AW*^g
z0fS!HTm+p)=K8iO|JS&p{+-b6Ad;2JRCzHvqk&0FO3STbxD!Pip<T8W>=Xmqt%;%D
z<M;|z<{H(oQ=)FGP-A6v(?(5I>(!aUaV{<$RbTd+s}ZpK=>ZaCJ7K;<v-O;-$vym?
zLS0Z{Xx(4FzM!AFG;HOntlF4wnS3kF%%Yk~*NM2Zt!p?XXPOT6sH%@H)G4US7yS>*
zUSj;`-KmuW!~W+|6I3YqM)MXa8Quer8V3PGxy&?&c-Y9qk)DiVUR-6A^l=6isx=C1
zw>U}}9Q2fmrTL0_aZu+<XW;Jfe>CuGQ+oTL%9{i2*RZ(DxG-F%I<>i^+)>LGmodLM
z3Y_^<dV$7da?b->V8@1U5N~ZB<7=v$Tk5N>w;mAuOh1@+3q(E`W|-HvFWml*!EwE}
z-Q9o#hvu#wd~}K+`=%hnbhef-lIvj^>fZ=a6~CA(&#+@O)nZjQHwHaTWLWn{bnyTp
zz4c^jSW}Z8ufwxjuC^>$5~X(TYR5M3nLZnqt>jI`Nn1PdUI#pjCC25?u`>7DQlqD2
z9wMXz=)iIaPpXsvJDw%+R$Qa1tc|Iv_sI4NcwVv^!Z$9ctcwwdz;bOqz4~yS1$hDL
z#L!<MPLt)_$I}L_mP^|hPo-V()hc;Q8^mxtCw}%j8)}x(iGOKbUd~l-`3x9fIcF;A
z-DD{3dZv@L&8E)?4H`;jX*W#i+w_GqXr+r76H}4|_VIQ+7vCh@W8^`|8zpKQMvO6B
zb_Od)MnVm5Ie)FSJ2Ia*efqkAEKrs)Gll1lZwqYBtV=EBe=<@RC$4E6XLh?7rnI9!
zH1hd#YfcGk{J|Xkzz%c5a}cYF$5XT~hN6%bPIq941Uk);XPA|D>eI_hbyQU#C`W|w
z(@h-o+s*uQ$60XKgN99O53;gcfHtMm$U}!LV<jukOnJnU()%}$Dy_T8`?D?IKi)^o
zN!Ph8s74%87fvmhfBp&Xyk>)RFYZim2;Y8zf>;#CZP1K>WbMO%5iv*~3@$bKablJ!
zzypI&G()VF%3$Otn33J_o`CylGH^C*$tmmZt{sfk^`d^9!*&~yIvJ4QmE-qdi?fuQ
zAQ^#l&b(!aYh%4KlHFI`-F;Ekmd@mtonm>#*6o>D<9!Uvh3s*yy=`NbrF%l;`}u}6
zyUSH)`}LjpjO#LRun}w(`Ee;E4^QVY8vh-gDKvn)H#dH;f9uP9^ne2z*FW!rgqT7e
z|MY7VlU%T~5v>H-XHerR;EY557R9PcqCXqiv&6g1hY<WQ8hhGzaw}y!molQr&wR0-
zmUgTOtpSA{1;J<~9XHW=$ZaL5V4X8xW1plH6tuOrQ7CDupPBU;HRq#5M6`J{Uj+))
z$NodFlWyrD=UjUtKOTgbnik>cZfbl3SKT3|msR$kO6QTSIs>QdX)!?4Svtb`e#`BN
z9#`l@q`@A@A>_H}KrX`;zy>8kyghrdenh$2=4s=0+(2~dn>SZes%fbuP3BNm3C25V
zWgS}v<W4PK(W69LeQZWgq1>4rR!^qndZwkz=ugkkco>RL2wCKE2cq_rR<MG{wkr8t
z*A=9b=FBRi$HvlMEF(rIrhC?kPdRiLz7B;WWvc^|Apfajx132?41tOqsFHnK@P(-g
zrt!IG0@@8ZY0X=Lb+kJwv*FnH9ggY5$sRfbR8#N&a)@mSlCSn6HA|2U`L!nczwGa|
zG<^~4sm{8rS(3vj>X#L=@Q(W_1^;)iki_|1;4b$Oa*n`a<4G+#_=#=B5;7bhUZh67
zEcZ_D4_U%%T&@>)7%8nx=b@o^)glW+bM)VOFb9hSg}C&cu{||$!zsaVKF#n0?BZ9N
zc|4y~sxjKMzpZo!wj<6#B2is%3k*ws1hRA_?5LkNtYaV^MXLI<YJI;j%$&*edDR)J
zNVN{Afssyfsl;UP?X>K^z7;MaSB)cbUUCjMh5BrUNSO=)3`a3HEjjIaViCuCt?Ek4
z=^nXFb=-QUMr%!l%xLOZf)Cum!_T?1uHP1vf9VmXhnbtI{mO~N`HCcQ9Ov~x_mc>u
z|Fd?$Cdp+HnC%kvm3lE<u4_qa$GQwZK`P++1kM+eTTROuCc|o>?xA^4J7-<dS3F?P
zc$caX`CsxaZ__Y*8E72>6A9r=Hk$4Z1P=tR<)=WWu=OglWGo8&%^TG#3wtPW$Wzx$
zBKfg!Hwl%w!6Q)t&sm7fNS#OFiGIy}n?2Mm6V8oK1*lJwk5_x>e_OCupzw(s5Q6h8
zB7xbIvW;V`a(_084%NC^@2MQo;@=<|<^Y!-B*Su)h@YCn@mGPin7Bx5qVK^%rDb%p
zg*lTK^r^L%T`%_@crI<$?<yZt6RvMX&L?99^sl4~xM6-`e56Bqb)-g7n^u~t%E;ep
zE_pTMM9bN8=l;r7ohQgDK2Q$<I}-$BHB+RFL}Wx3Yx+Hr6e<=(dQYJlu7{4VQkFCY
zS90<rMPPyJ^c>18LIq|`=^oAyEm8prkN=SqRd8|;y?)`sE7*f!`<geCl^K%Gi3ahc
zC4`Jp)LiH^UEE(xA(wnQY4jJa_22jlwTbLI?Cvh#{j#Unk7(a)`b%aY@+_;DO80)j
zbf&oxtL=-j<LsKWJQ|^`2h^pF24gSGwdwDet_~pdBrrB<pOGtD%b~R#e_<N*-)`&V
zs(Z<XEbxwgkwPz_VLUUMoYk;kGX)$8FCgZ%)eR<fc#_t_Vc`7Fb6@cD#`QslAg=3G
zCDU$%gH-ukU$LS5EbfZR*RqU;QGTzRf(keIkGrE_G*Wr>c@&LcIVhvwdn_8X+|oax
zf@!S&`#PJ+_T4^lR`br#n-dhFk{DEx5A6JFMJ=-bq(@McdkF3JJfnt@(hk17&F{;h
z7c@j#Pw)GXjy(c{U~7wzQoJr{TSlRV_?Fr1iawbkx7&)v|Kgg2eg|Qo04aeInmjg;
zhIi?XFl%O()i7YyFKD9kD=|qP7fWor)naAeou$OVzx}^jwIglvufTcZ;>Sf?v1l+4
zF+YZq?;NS3uR?^bS25+JiJQ5zUHt42LioLNX9;%{j|GOI?~ak@Csc@XRLsxnRu)wH
z>eAfRof7w%J3EkvT`5-Hh~$h#x}3m}sck&>7;=T=hMR>mxG4+H2`n`4e+r#0tb`CX
zXH}W%x;7bHh%jT$(8ZDbkYW~mo4@nCj(5hz-TKY2J-srh*nc6C`{t9b-k68HR@^Eq
zau@7z{CH*@AZJyu|CwrXuLSm(X6x>XTDGa*?b+D_qZiTWJ9y2j4?Lv(GCP2Grd#}g
z`necoS$Ys3IpWyxQo~6&k~zVP5#Hj)y|Rqdrg@yHZ=Vfqd1*yKF`cqi;Yk*6+FyG`
ztG$9fh(nL4%4M0zD^p${!;LwGr{yhgeyzXSR(davH9BW^Tm2&NOVna6S7*6`-wkGw
zRfi%%yy-w93o}9DfFD|duszga1mcrdoW+@tYyjw=&e^whOgGyW|AkLT_c_8nE8Hai
zLpvNZEbb$$tc{|t<~+Ayw2ZeaO_EI3V|xGnbCZxM;3`e3U_s)}BKh>`y4U}6kABM~
zOjU^G(4>q_j5jrjTILnEUHZQ_j!kvz0OLR8)>GL@N%}x(*=wQo4;}y49FNgPTcFBP
zJI@XG?Q{RGmKp?_N0>uH)x*&o58lLK=avyn6h9oSzso|eEcNAp*@}C%O@3W8BG>Ud
zz7Im_R5ZAhSClX#kDB(jVLpDfV-?D;b+D>7c6twFU~(kyo1?}GM<3(s<#t~hem4JD
znq;x;7~gBJaL4v?{2vd0dij^wdWI`x!;3Sgq3%(oT3#y@j56Lk2F3P9;Q70lye20G
zrpD3ceYK>=N-<T63t>_UHrS`(n`&zn2y6H8@}W(-IM;NtsL!A7sZ;If^kcaOi4pI*
zyk17syaIW;$OpFfCiI^g#>=TBxIK4akIZ`?F&T5f0GvYi_GVgIDzsW7{koj<aVNPT
zOs(~rAMpH>3)ydA;-jF6NHMVCjm`YV!|Xs{6t&CPsmt!*!K+v5kG803?qn^G;_a{d
zl2hL(^!aMEu#@Z6`(I^BdD`nAWf<*<UHY{){1Vqu9V2o6GI!iqwttSqFx;}Luv^3K
zz&gb25vqI~E|4I-9dpRS;xIN1yCue+W^(CTWy6q>w$YP1VtRHY?gx!s3<Q{`{C_!H
zwmE9-E|XJIl50Ls-#t1AZY{WY+SV!Hv);zyz_kCk4EQWnLal9nad*3fgJeLK+1`+Q
zno8Vex3GhdEWCqjG!Ngko@NGifB+P-*#Vh`OJ3fZszU^BFb4$wI{_VJrLz}2dG4eU
za$m>HV2*p@w{vB6xUmAi6aG2Wk)~RPJrK@<;Q=tH0R8x1lY~tE{$tMf%tLd~*5{YR
z9A6Q2b~AtVA6ZWv>+;hL2Vmk}f<VWqYwCx;sQLl!QcaUsskBcV?ha)Klkq1@D+l={
zig)2nzqxUeFqdt*gDRQ6aD=Hkaw|)=qEPCw=MA3TQ#|Vru3dOj8{N#sJ02IpK7H)$
zqYax#Z1oDBZ4QxPhT`jS;=^A9ydO+oPK5g&SKdLIYpRB>ANgoIv6^1JN#4o4qyK0w
z@x4H0%tCM_3#EJsh=IMt>P2CA&;~M+Y^r(1%mUmeKP{XsDVj(Y@tVUoVoI%pf%B~n
zbyQru`v?k|z%-_8Y!i_@ld@`HqF2sOBN)r9u76hPbn>Y!Ul)A6QpZdUJ=g|O^aIza
z>&ZxpDW>A2NC=DEf`J#EXtH-xAa&~2CSWpk?vG&v?cY#@#2vuqPP6&Eksu+%KO*gI
ze3O{kO86Nm>5EQK3T8iUDA`rDm9MJxPG;5Yt{paBQmbID+No@kiRftUboFrY9GIK6
zh!s)Y@;-v7e5BK~CWR?|3Vu*9G17Sybrfjam=2>JlA&3uvsV}Ooa=Wq{HLlfk#S+^
z;E{SraWfl*MQijLO-Vu-Am1?1*>~gmx1kB8f?Z9-!Tuw5>Sk%iv9u3YyR{1a1pD7|
z%Cs=`y^lwA;qk|Z<CNuF?|cL`4b-mVOWBJSe6dmv7WMP-aj-ld#JfLvC(^dmC458#
zb=N(QGVm%T&=7qz9)OOaoq>&9<r7Xh-F{FS;5noi@E>K7H_RR!vLv~3qFgtDHu1z+
zj<B$X7EZQsA3FjQy%fEShTgH&-HM}xBP?;iabADSmLtf6SO_Cb>ISK%A`Op^@BAP8
z6=$oVf5M9DoY}nL?)p55dL8UM-9(n|8SZFeT9O6Y0W?H<UaBG9EtScRw6(tmpCwCV
z@Exkc{_`QmF?nLNrHVnnu7R`+7k(cV&2`T{y)zz^fwH*458RZaDaPTDw`sU`Ya_W#
z?Hz0G@?~EgW;1il6Fy3Ga`^6wZpu55{!|355mqQ3d6><`{*SeQ?4X3!A}=dgQgZGI
zD{+F%JZ^<&ScL^V;l~6Oo8Z9M{vv{8lDGZT0_;3qPtZUShdK`5V8D}jFtU{KTFM_~
z|1&4ZAtJ^0xg-k}e|V3ABUnj+bxw^~FO{gReb&Ym3gLbE;Mr2WBf=?5<SR0lSIBz1
z9Yvv0hJ&lj3aUD<LD2|Y!*hB{sD;KFX_a1!GCz@Wu5)Eu=u2?CnLq@5_K5wAqx&)j
zPo=Z_R2}wsi_DC5Cv^FyC~cdumq0G{zXwgB3_?MuV7j*tbH6j;Btz0K1X8<=)hh(v
z`W+McUPKh^YaJE9-oJFXv9TQ;mOs7b8)k(}sRUnT@HSR{Dy~w;RXa()zRX?n96p&T
z`oY#AFQ){Eith;cUiZA*ED56~uV=)53Y&KKk^%l#cVuQ{WK;>evYW$<KI?d&8k8LZ
z2Kn?QxCSVyb67V-DB{KGKgdCpBY_9-w!%#U{;$oR5de&5VmuH&0{{*J5PlajefwHA
z(Hb29z#x%KjraG%pRlrjghU4N$W`Iu;E>wj;SlsE1{LNFBqRkjfEfcqk;sxHP*2#Q
zAtoSxpchg=6hmYj!=CW;FQ<V!<E?QbD!tc>6)*taAkeVC-D3fmz@))$!1ExGAsisG
zAZ8%-ps=9Yq1|EdV4`8VVWna1V5?#0;K1R2!c)LU!Z#xDA=D#MAZ{QDA^k>XLJmc4
zMt(pMLQz4<LfQC1@I(5?3Mw0FH5xdY3Ys_C89E+%JNgHP4n`~{7p4{_2ulFV0qY2x
z2m3dU8BQxM18yX4KOP6(3f>dG9RUWx8DRktA5kn3h**g@mV}KYk7S8dh0L97g<PC`
zfkKjEfl`ICmI{q3nfeE{FO3S#7A@ER-D_#H_5qS{0C=oXGD4&(4!NitfC?M@y8_KK
zr$tRM2A>-vz<__9(K-!{=BPr9HhUx%-Gh{amr(`?GT<^MO%E0zpN))_`nh11u^^Vf
z`(XNjc3Muu_^<{P7M&G*Tzk&rcyhQ1w=X1;ykA^=fA>*@4(uwPHHN%>hU!I4*!#Y;
zJ0X5Abo;EJd};yF54S<?J=1!)-B887&Cut4*%zUGh!+fhnHMaAp=-EZqJIKe6uz)y
zK7A&?=a0y@Fnt231cGNrvEi-<_Fu9?$7lkwZy;|I;C2JM4tLRd;Y>cH2H*FnVBm=R
zZ_RFi2nGuN(l1Xhmq&G>DEr3)9>P87_wOhQ!<jR=w-&g==!ezLY*veA2hFu39ZXew
zBOQ039%YFqIi{SMk@dwtK<Bd__)oo5d&cdjf!3p+ya{<D0{mV$iho)1dX!3)fBKM0
zI5jHK|205p!YEWpzoXB!W{d(hH8#$JEcsLFe%2>gG}WFrE<5EFPBT2L{8reg%x9EG
z|FAQ?(zUg%fft3z^fcFLNba%f8KhugMT;>Kzxs`6LkE9p&-ngdqC9E!qGwid^kCh?
zAYI!6X+f97ti%$ZCerI51amBYe=?a|n{3MrhCNYPaE8<-?K&cuD|zRyKg*?4e2A6V
z-3|zLi+nzdOFcXb&!IYuEa`E4-Y-h6)dr_!7z(d}xnvsLVB@}*=dA2bC9J=c=xu@)
zaavgPRq?g;%oQaoe;2zTh7YzNwIUTMsZsq^t8CT89Wl0hD^WlajTl!f#l{29)b84Q
z!hoMR5fk;p6|v7HhCo0N?NUPi78E_YnOUS$E<)u@+@GLbdV%GU(uTv#^V*^Ppj+|}
zu?@<aopT8CxszwjI}o1CxfHZbCe%)yD-w>%T5V{LpMm<buR5b<9quO7ZNjf*(CRa=
zj-v;4rlgLx+mDDrqwkznr!2`ZFEi5F^+NBpOBNF19>0ruMR`(^S#x2?q9_3KTPPS;
zh)@{!&1Y9g*4ZM`=SiiJIEKjkH`6-4I{zl_HgE=uzo;X@#9p)~V1yISqG-%<a!Z1W
z%rt~+0#Wl)DdbFvWyEj5JB@#*DfFd)CygK7{{Bd!w8v~W?fn-gj1YMh)E`#YqLb)x
zn{j#_&#U0gWQJ8vxw>Wb$#-yjmo3H2I-YyhD_6ol|KK?kO~wR{+pkWlWmA*g<CmKS
zJVq3*Cdw>aL*JfnWYIgNyD#pDfG>4h4&B%n|A}WF@*@9LKx*o&3MPGXH%MTf2B@Ri
z!Vx&OLmdgP=oFM3f{=DWDARe}Z0gbPCJT5~(e20C%Z-%g{I0+ou`JHrqkz2mm)W(F
z8M|&2ZgJ`~Yk!(uD0V`hcj2weJ}|Z`p7{S0Pb~l;U;c>4h#4fP0NNOETF;!#{(|ZH
zsH7B`Y-e=r$gP>>EPR_PP=8@hE<fj*s3P?6LDWtCTq0zHXYO>%ahNEB5FsWmD$$P^
zLxrCi2@u0*dx!gGmS7E#1At+)4VFTZe!#fN+6*jr7MueI`<4|}`+T)i@%j-(p=8rg
h+({t*G#s~g3JZDH6Erl`>V_N~HeeWx2JbuY{(nGgP`3a8

diff --git a/packages/icons/fonts/fabric-icons-4-97372384.woff b/packages/icons/fonts/fabric-icons-4-97372384.woff
new file mode 100644
index 0000000000000000000000000000000000000000..142ed7e3d4d3f6471eb0a79018d1d5d63c01fe98
GIT binary patch
literal 15464
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
G0RDd(B)Xpf

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-5-125dbde8.woff b/packages/icons/fonts/fabric-icons-5-125dbde8.woff
new file mode 100644
index 0000000000000000000000000000000000000000..f1c985ca97aab410fb04146672f9fa4ef5358fea
GIT binary patch
literal 15340
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

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-5-5bc71068.woff b/packages/icons/fonts/fabric-icons-5-5bc71068.woff
deleted file mode 100644
index f4eba2d21eecbc92a2d848141c275087be01d723..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 13452
zcmZ8nb8u%ry#3bN+W6MS*7nx6ZQHiHZMU|uwQbwBZFAe#-+TYP%$&(RC!gG8k~^6s
z_qfT4iUL3Y--#s}fbd_gw*UZjSNiYi|0g*mdL{q>MEF}5|Asz$pUb$Bje-5Q7X1xV
z003-`AP^<r$kmw;004dXj`_|3)G(_s)u#4lHs9rF-~8q~R^uc4D8|gd>ANmC__y}s
ze*q1^HM92keh)a(cQsxBKpM}ilvKss#K0H;_$mJ#!}cFO=0qLLzr}AY{F?*6L5c(l
z4PtKN?EbC&{pR}Lm>@QSFSWKa`i`TA{^n!<fq@cuU}NC^-7fvYH^=`5Az&Mn!q&jX
z<XijhGuRUV0Q2@c?MBw#&dC`7V7~Z{`LExEUkZSAdq<P+x-8!m5b=$9_s%;6_e>*w
zgRfqWfPkcc02hpMMli4fmSEGak+>n!f!?vP!I1%I$R7fPJ^p~MURc;42zFLmlLvr%
zB2qAQAY5=sPY(cqWDUdOp1Bw=MFTF6Hhj&XF>>_jCb{|sN}JdjAM%^BC{gSVW1rEe
z1Ja10KlRr4lGa4XBT4Mw-v=lg+vl+8m}RE)>ZqjS*@oBjYnD>?AnOomx_dEpST^~t
zHqEfvrL_9I*P?R<X@Vd-??ryf=7j<M`-&U^6vqhB8|MT-jB|)k2=5rYKhro^LDnIi
zIr9+jxV1;*r$ZWz_Aw-T>!8h*eTvt{F$ki^fKm2Mq8ZOI1ii<g)z(e2TgNep(O#ml
zL=x@jA0DcBrqVdc(qtS9q?BMXVkIUz=Gs(7{`8oS{L}svi=*b^*%m5dXd^tqXkq|A
z<gO5b=S~PzmU)=eD%P*DK&-hGxnobpd>#OMs7qh0D%oV)>Dz{5fegFWOaSEN0=11G
z`q*qR6HC5wJK0|`#xwc94S?4X5w^KMk!T#3?LLimPlJ3`d>Yl2wPsHP*+YJVU(jN6
zdbl4x-he$WreFZzd%k82p-m|D&Gpp>M|xIzE_&SkdqJY0zrVUNJg6l1Or6+n*?xf^
zLr$a(!4v{qL|HD>LP_CSr=e1$3uI(Jj*I*kBnz+o6GH~UruS^I?+u|RkUxJmbx*%}
zcRQ85j(WRh7Ku?)sb;e8<}Sb?oL#2<dnJ;)W-~F6Ui46XHtDs5$+wcle3Yp%ADMYf
zmbSqsXv(BBOc{*1nX{h@l|8coxc==P2JWfw#1E1LqioCF`b0~;HPWhv&PS0~fIaKh
z-~R=X9yCIAf51WV8!6;>F+<(A<}_LFk#!0b&KU!J7ETX-mx}d!%#HsFeYY9uE*E^1
z*?7Qs2s7vntjS9;TbGBy(SJn<{xBW_fB--N&;Z!4F94!@W~VotKJH-S(*z&ccru+-
z9j!)uXENC<6?Zb(Y79YL)<E@u!$n8jeg1(A%3aR^gb55ds04J}FF2o%M5Lc7EDa$|
zGmcW;aF~)*4VcZ(O)~527?d`xK8m(RTJ5jX6P6~c61kUO&zhQ-6IT-#7o28O-p3Qz
zB#^wJNN%`(V1|Ff<tK<WKH^0@qyJgl(M+f%@(pY=cq|XMfPnj9jf!LJ25|&e$d3_6
znS(~$ftN-iA%<BCKn6>X1VqX+mIX@6OGgG@9_&c0T}8zOX%8DjO>64uH^X$z2^11p
z3Sc57n;?uP%<PGfQv9LqK~*OmcTgkT2^8{5m;U@2kKemZx_3a8CK5R@*6;(bkbk4%
z6FiT7&e^S@VF?(21QeykahM4=Qje>xcs7Cc%zq9oBu8>%%KJn(rdZf6>z3K^esqJe
zmU%uWmVC5QJUX~l#-{n#t2#n#JTTJ+AdqxI9TQnX>-47bL|*HO%`SeOXo&vv*%}^i
z&c&Ye=g365Js(Kj=7{jAerF^A`issS$%Z148lLe_C>y!<wTZt_K3d<r1~Um{Cx`Yn
zq{y%6>V+T6uy`NQ9Vxw~bzR}ULXLnCAaOTy8oRr*l+<`~K~PkzjfKTuqb`l*+~Z$D
z-0ikwKPO@;bmeus^j(58F<qrEM<@EzzUqAQC=cpaz4M44KS*F6AvV(8gGD@z=(J+!
zu3A}9S{uctC)*wVf!@pf$e2|weD*(>nn<XpKBr1!k;QkU4$#VbRl@1CEqY+ewPgX7
zHVI^;B3|_6*j!tY#tAtu*j;r-?TXP_#6&4cln~`;bhLaJD|8I=vRq1TR7N*-%|>4t
z<)0?TDELbsM}DYOUM-y#8cTcaP&HX;bq;5$I_%D7F%k}XiZa^LtsEL;yrHFZha1oj
z6}CytnU=OEjhKra9SoBez?e67Lq@^ova|39+#nm=gc(Mzpg<}`y9_K5J22*OLJ#|e
z)PL)jG9s-2Oas_vbWEO?KwoFYW{J`!6m8^bCbfOTt~&WT`0O~BH<7AQod0~s{7WeF
zTp_eaZH?}F5RH9$tFdzZva|IiO$tmejM3p;S0&J=KbWRmRs_uJy^&>i^iHI4yuHAq
z8S|mCy(%pcIJ95?!u5D&y#-xIJX~UeMWW;GkcpIVnzD4+Uaw~6ah>(PBr&U0F7De>
z?N`lTTr}Fr8Y_}@pP~!2^$*o#BhczNLvwR@nvXYE4O{R<XB1zm9;@TypjQ;>SK#gU
zzoHSn{EJ8j%7@nT_a=e?0{oIMKdzIO$do%~fH;|9b_r+KsaB`q9ki#!KKf<^*3kr9
zah;4q0&-xW8F<djRD3zz-0$Vvhhvj-Z1pjc9}a_xO#J#<<e6=;?W#>rL$TW*80`?g
z$+|mu*Yiil22Z#4%mRr(&c>pv#6yF`$j}k1aH=C0(>Mnbd85R2$7z&=DK;_XR!!ke
z2f4!vV@wdkxTN6Mb;Dw~#+|3V0MQx@zRVcKiq1uqjxi;G1i35DGAUuv_CtmE3zpY8
zi>`2;KDQFe;+)uq7ZO!-!T_cuBX%UA+VZj=oUJN`Lbgw+IC-?f?nsGz)J8jjV-)ty
z>EnTuXN<xwz@mQzrSEMY8fqW`#zfnP{+0!m{`4Up%JJXbLJDgclNst5?n<V6B!3nj
zodvx~YTCixe1l^?&O*RZfi4p!WFQ7#uuoB7IGObjG0#L4FqiEijjYJJvYzEHdRz#v
z^)t47h1x%pLHnYDrQTGEjtefck>n4%BUQHHIPVOC_4lC?QBl6fA>Dr+ZwsGSSN}>>
zOQ!Ha>HQI<Fq`#{84DteYX2f|ooT;J9sG%Rhe1TOFm-X1&5wpWNh5P4Id`Ik<V_UF
z5tQqB@5NO%fSbt7jkJa^y~xPsQM^W#=r%7N8;upY*J4b}h#KvHBfT}`mfGe=`caD<
zRXnt&-(=|zm+GAdg4o2EpF1h(%oZcg5VMk+w2&Rp-vJLdwhs|AlRt!#sdA7VZTD|&
zmQ0wg)v|Fmlk@EHT<jWaQ*N$~wc5q+Jd-??%}U2LmT}vJF^=n%RS>gN1$Cd;3PU;W
zP8Ci|G!l8!W`wn(%fU`VKFsq&{WTD>n%He?%@*2)4(`vJRE)0;&8%D@!Yr+0@h@WP
z_zicMY7PgIDo&Dw_;y+{NIR)oClzZ)#?vC+Zs)@@6_8MB@;k>;(3oBO*N;Vo*X@O2
zxsAUuIaHT7aeGWbx7jF*dQIfCxfaf8@oGCoK+|@T6QvWW9=Tt<W8j2_mPa$BDkK%Y
zaO>cp*`{02jFng`;J>m1A#l{@$;xU}gBK|<QVX5scXJ}B^i7>k)b!7Ye?uEp0Su^5
z{f<u}-+C5AJspea>-i0T+u9w8{Q6hGe{%8BhY=rDp~0t)TsChvR(No7ALbRlLEm;g
z)6}zL#U1hSjOXinwkT5~w(fFkN5DJzgByx{bD>gC=Sz9Rxa=Sx^8mSU@D05ns|pa*
zaR2Z~6;??^YNAUvtvmZlAhzsnJp~&-+<JJJ#|wP3QFIo$h`4=5_|uj6thdg}AnoaX
z(s@gfUD^3ev)}&kr`76%=6SE9Yu&9ner`F14)#Z~o>R;klf#0!z#hB70$ZNyjJR>}
zokm}(wD{w!YOW89p~XH4d@s^94f-UHe72Li_n%Nev;{4s(Td%zQ4Xv1BTO`we&EN-
z3KpswQq3<{2yj20!nJ;w-q53(SX9nD;yIp@0VQDNJ)HhfG^5M&hST&w|3E|U*GC!w
z|J#Qd&+oymD<<-oeQR$;e7KfetQa_x#y>a_Eb_8AGq?wZ>EbqNxiP&30w9$^L-yBh
zKQFvP+GQE*`WPSChp+lP+>jYfXR`E{FCp5iP%1;4Nq?E#A~%-zdg2ip9>ku3q8FY)
zEGML`{BlkRu2go=z%xFJ8FJ6i$8^>~AJC=kIER6PC8yn7%nsEL82$SxQU*O>bGGj-
zSktRCpYUubNO-Zk^|S1rdzC-Fp-#l3S=uL3`JL<d$3h#A0`69DZ9zw`%vz0ML6LN#
zgu){|x=SH;IlY|ECO+k>VOK~Zw3^|ElcJu-2K6EuRfa^mKB^*Atbv+~gm2zIjp$km
zJX%U<7I)A=j!ctZl-$2DbtwJQX91d#s`)DBK+RaT0vq#^P@vMhoc&r?Qh31mJiIp3
zoDpBk2Bfe9QiazjDZ~ufMVLh-Uh+af9xP%QxCL@!#pMI?E6`(az}4=q8}L@gq~9h1
z7yxe>`7u6K+OAo(Qgd7YJXZ@C<z%yheSg3T?@5%VRw%&E{gWIz#-yfQd$^;+Yy5YB
zZKG2=)j~}!&(PwPg!k_5W-nE&PZ33a^r96$7k?=uL?b2-T`5%%12Li-;@^oNda&Wj
zZ-@;2Ah#g|T8-TxBh`qISP>>BMv|oqI|az(9XKZZ&A-{bu_Mx1(F6+9)-ME)4jQEi
zi^Cvw>bG%k#-ND%yTP8xpMT9XVj^hQyUdQyVrY-pY$sVIq_={EGKw=vK_Cb1%vAl~
z&NO5`UAje)qXEQUcnm3EM~=BxoMNSE_5I$X4kts+dVH)nv9Z~nua~&Y^ICd5PS!rs
z0=19BQyr9JDHt<zOr6~-G+9Go`a((hNN2*liIVd*<f5CX!iB`A%;bH_JK@?A>B6m@
zLSn><j&y%8$B6Et;?+{@AY8%ZD2(}hIRy=J)E^cfxzaVdBZa68a=Rtc#P>7Xa?1Us
z>1m)3vW)kfKs1j6MAV@$Fn7G5SRpP0vGRrpk^w9zg?r5PxzuC~nRL#-;QFJ<(=`-`
z-3RAF*K5I<)50~|i$BIZkX;&OLF+kK$jXmvb5i!f!YtidQfybZk=2lqyWEFA>7+Kf
zEfL`d;H0APR?oazuVNA4eHOB!oa%rgMIjZnBY(Z)Z=H^}*)TTKNPUsaqqr+abSj;e
zU6Tzs@rNBXj@Mc%b;RI9vYE6N_kb9Ow&O8_Dospsd4m1@%KSatZGv^>N;vn9z6kzh
z0~kLP6H=0D!mBRo<o(EK2#D;c5>g87MsjI9340#M>=*|}D$2S=LkXbXR-u!xK<1hQ
z4XIUr{REgJ(FW{<Vf7-E;u3DMLHz{SOx6mQ1Z7u~QRhVa3m_?Rr%LI7UHMnQtjPX;
zgJ#ry0qf;^=4@U**IoX+xwG2#z5jqKd3He;fyCMH5xh*MfgYKR@w0qh`S%(5wzQX=
zSJedD{x5UWiXKjR!U8V&xlJXfU7f~#>gsllW^Xa32}s~~R<ztTsak>u#&q9=xmGY)
zWo31;_Iv_&yzOnZo^L}F)>jDjpla1ZywmJ)VOg5RR^mOU0IVjI$)5j-)_yCu(RtXr
z<Vgvw!)4a2*5Cr)Sn==4ik|oJ7HE?TaoQig2+aX-ryH}_?zMFWn_=O-2shfXb0A(Z
zi(Qk_hSG0|17q<U<7Ze{t~Duc*OwC8MsmUAL4n(tsV;(<Ta=WYY#K=$u`bB^Q(6~V
zD$M?vM|FDEnPwZ%sU}q`rfM<yw2dTQ#5}GmT)%#3%Fnf0tyS*rDN85pG($-kBd4TC
zf%VKG!(9eWoG5JI<0{h%&QLy&3pOO_VaS)bmC9kWvbvS7LCesyaic#7?3|sHIvTmJ
z_S2W>e^UX|eKebukvc26Cq$4x+5g_=+XAnuu@lwvjP`dw5gm4ZJXZ6cb!{%yo2s2#
zk9A0*-Y=hEhPO-Eo<F!%TIjlZ8x@c&s5~|V7T0Gj4ghDDMn?zG>)(_oW-;WyI<J!(
zXUAI|KxZx35uB+%T5V*k+CQRsGK`dP5SJ&W?Js9NBJ!Ht=`6+6^5Exjs$j+D=BSHK
zpxFM}hKBX><cWw|%*xquIcFp%gTY_|4UuLX7>>egjmil)YxH{q#8ij(vzDu&!_>65
zONk9NknjlP<P<*cy^U9=TrUGH#)PkY1y#Gtx5L)t!<2k)qXshUEcJ-sRg4ui?XnW3
zwk1Bz-kW-nCYPo(*!Povge->n-J0%U+QrN~`I8%JHoNAAm_xKdHuTC6jtT&$#t)S0
zxlkY<u@eQV-+JznCl>fpF5*)Vl{%~`xLRljkVv|IQx(+f;99}g%7>Xmyoegb3!pL8
zQcq-3_R^(-SI#wz9nLt=c06wEZu#r^Jc`{ob@vkD!b_I+nzJx0Q+*lVsIouOX6*l7
zQaNyG90v|BN+@<b-#FPBeD06qcU-O!>KeyerjL)MTahNbIp3_U<9GA|{LcRQ@;?_T
z|Kl9@OfTz%yh3X2jK-jo;<gYZi+@@e-CzDVr+zI6Lm-IW-k5c8(tb}0TE1$tHCfoL
zcKBE@oW=KcD_hoksA$_Ah;M~@zDnodG+W*Za!Scu;qF_oLPx~s^N#xyq~#`bc`|nH
zY6t(5)1jXlkuD|CWiYcZB@q*&Ck3RfPN+m<IQlUQ4FjssVqk$^4#V{TW+3Ar;@OOz
zRY&+EBf?_3ol@>o*YpbFLVDRn8Hk=ES*U&bmX3)+0WZvDox4uD0O|t*iGhR)NX1xi
zw?s2k4;~*(<*NDHC=3}b{F@Hha|&(crg8)NiQ+hi*10v)8h&5Vw-kQ>_r~DR40tBw
z$CS}rno}=Edic!cxr6i=Kx*)27k*2QuPgYO%6xV2!m%26$F}tsU!I_^nT9`VAKs5?
z{qpD%y%t4LLD&;jGJE1GQy|^^{0<13(F_G&&}dH62E`j0w;er*R6S~~p5V%W6f}<_
zi$EX6YA~3-bJsz>xpEZeJlfP}Lph-5uvVDv^%MyGE|3f}-tGBX-@ZOqH_-jKaoM?f
zWLUnF8HqePylfKiVX8I()Yn@eZ7MA$)p}f}KPNYw;1L;U^J?`pT@`A!f!hH|K(kcU
zecHED3hbtJzuXNIC!@;n>N2wWqQ&&_^UMaSntAPhQPs5YuseM3r9Kp7VLYxc8Q6+r
zxXWy4LRm(CMx?L+TU{`p56RrFfwv3S8|~d8g6ZK_dwj#pb<YFwD>6{eq<&?w#X)0e
zBm7jp{Q=4Jdb3W|rLW_(^YT1X;gUGrNWw4AM3~!$7+j_WX%>rDJBQs+opJGJnDiQv
z8Su0%*Rob`;IW^&&_Z|W*^5s_Qq*TF4?GO<oQUeDnrd`2k4T<`{Rl5e)hvRf`Pj!O
zP&p)EU*6EkFfV-3pMF_FTDIN0XSPyi^z`UPPO|fx<E9R#thuS@m@);ayPtKk(>HNA
zU-nHSewFN*LWiBWS}9$1jU$T9TnlV=Y{Q}NP)~_wlFtPSRwG95G^wmMYB@!0GrEC1
zUyQ0q(jy$<Md7h4f&-<u-3D-@15S*E*<mme<k`^_y|N$M3{fMRP)|zDaO!LN*$89{
z^%k133YyoVIWJ<fIHA8)aCI}G-Wx!%$Ic1lJU%!ziV0a~7FN;XPOGoTD3I>`LSSg4
zGdX%|>C_%4ves3wW9Nm<lCE$lfD1lobsSV<J$T$ZD2aXiy(?sV5u?t31%L6nINcSc
z@j>$xhrp96tKM^XYnoQ4J#k3C<7!hza<OK}5<g)>#SvjmRu6&G>l-eK7$G=L<_YRo
zq`88#8mogt&N+^6On>drH}e&C{X4H`g*wygBj30^$V&A(9?UMp(?(lS-Ox2;NOXO@
zQcQBwJt3QWAujD5#eUHX4n3HyCb-h^dg_dY!0&HLX_{_7EHAj00Vr;nj_mF`=;mT#
zRbu%XL#~+Be(DZTU_pQjt8(_Y6|lPm)7|{SplTc<G2Dt=uK^oK^PH%~>Sy{?ju=yj
zEq_Xq;^t8b_iL(S*Sv6{F?ft&ov_NzM)ne^T}>*YrR@Z}DX#dUdVl#vGyivFOWcl3
zJQ+nd=$U!@sfFTVYcCghY+FInqch`;zFq-;mz9z{0+a4D9K&K)4hk{iPU11l@}@bu
z0^p&(!w4yhN?%GTH)3Vgs%0{drg6hUX16)8mDrI{q9CorWJq5&kOTJ+Cl67Uvpa3m
z8xSf07c&ICCF9{L2<^Q6vv_Pa+{j}3=W9Fmc7FD>^G#sQrlZ5!Fq}RC6pE$xZwmF8
zh@b1CyzLsma<{A1CfYH3cF?m$ybczDC@y!gm3axkj67T{+1x$gp%t*0%b;$Ph7W}j
zE~HcHOw?~+$_$Fc;37J#F3?PzhkM9$i^`+t<n^^dCxu&Y%Z3=^Yi)i|>*`YBVP%Sc
z0Y{m5VfIAo-zrC;Yjn++wrbquU+8{|mT&4i-f?#o%YsSES=UwDelH7Qa>UR&8N<+y
zD#?p4PAP{uOa?+$uTdY-DW;WjhVmu$!DSz-&i5$HR%x6!YCuJ(?=Oijrv~qXobMzE
zT&IgGS&BOehloIr2+AjsO-Zim?EZ>*bV9tm?&yT0*IP+aN(H-qSGZD%nzvBExj99h
zVjs$)PzK@W`g}X@BhYQPe;<D_=lf}Zcbi3nI6^LaYB8jg+Kb3Rr{sY_v0T70Je=h|
zx<5L^zU3a2F4i!eaLOlTju4q!g?P>$P0w#XzE=<?%qN^#@%D~%8sj}9#UN)roPqxO
z<AV{DlH)b?%`DTW3qVd_f^Z*+^6tMZp?bA)y9vh8j%ns+IL!Fy`8a)H7;CdP&88=f
zWT+`Ud&zKwKuD6?qgs=sn)~Q{MUqwChjDJAs9D_@JBSR{A5ld*^g*ce2!St6#t0oR
zz8pZ6yF>}Dhiu8MuApr;HO-!qDE(FCw4TU+5}@e!!mp8^imtY}&FsO}?8!E*cQ)DQ
zojW%ixHqt(x6SbC6chZzlWlK<gq>OX4v9V4t}A@vm6T6hu2x)%%x!JM$bmCPPaU~i
ziUns7YQt-3=gWB=GRbSD;$tI7x{8cq-N;o$=P94(kHVC!an2xx`v>!)p}sED-yAwy
z`l0Gu28?}il;MG|{M1&MN4>~oVEu=)YTJnnc@zLfw?+#F#oj-@F%A*(vGb)$hK?>H
z2H^)D*>O9@Dyf((!b*M<isR2$+5|m~sSGeztsZR!8zX$p*PSVZ?NQ@kADz{bY!kl`
zb#=Azqjn6d$5;f~E-R<;Q*XJnMa`pH^_|S?=Yw*ZjZGVsR#huo5v$k~&Y|b4_lL3a
z<fR?ff{s(v(b${=)g5@Vlgx3#2F19+VS(y9LQIC^Ut+(bA?nu`Vvz++K64KoqFR7T
z-Mg=rhY}|I?^YeC-PJr`cW7ew17ZVy0gQ@qb<|BIqR{XS2M>#C(h?Yi=OhDcxd=va
zt~5YSYidJ(c^23;I_oS85sv&_Y~|RY29Sk?hVoJiV_zSKs(PpAu_fH~noPY_)JgjB
zW(b?z*CY(lkG17gu?3RFYyb&^7A=HKQd3?2Mlo#sc=IuO(kfxjFq4}*C@G_l;LATN
z%$SZ~y8~&H%6_Y*<;TrVCtZYU{4!l`q)?9?;{ISy)iTsG<fHEsln3%~6qd^zp0hIB
zA2#ZAEZWp@;DJGF9A<q8nMmo-Bb)^gj3e<Rm8XZ8u>o4=ca_X}YN&Y}0x_+wZTJ*c
zs$wVR`h~xkB}j$;Z^)BEEG<I>DekH)y88Lw7S6OALkuksTO?;*ZZPbck&(2Wl?bCY
zo9busy2ICHu8s_X&BH8niM&`Rm+(K*ad2h8IM0_fl2fyr-ZwowY`b|~hQ36##4Sq2
zAUgEY)yh74M?PW&4{!XwFXu!s9@mqJy`y#LI2ZKRv`4M*imrdQyK=t!nAHru`QGQY
zmQ+*>^Q`c=&0MG^sOkOYZ1%XR$DYnLdt~<%8psJTX(QJN9aCV9Ua%QxUJ5iKT?nAI
z;Igw6*CyRX!pN4sV~{1$6!w<`J&iUO^d@XjzY$3X!6>p6d-#h^$1pfy&rq2z!#X>p
zDc5s&bIT6ne@qr=1`K!$t@)>epd&t*DtF`#DJgS!h~jsT|CEpv<<qo>(p{e0!O{J5
z%Y@D{Dmet~a58(Y=+NYzn5=i~Z0Ihgi1v>Dp_K&Q>C6&X<-figk3)k8P7SqA;=)RV
z35OJxGP?6oIY?)w1t%SO;kuEjrH>K)q-f^wC!mvSnc%N;3MV3`KF0+7(j&Jc=F-wr
zNR)Vme+;8Ip7l@1zLqQ~=3WqIJl>dW(d{MTHmV47O7R&pvShzhT8DUd6e)ME=wUUS
z2MDvY7gs(Yit0{HNf48GYRG1^!;p+Q?2$xHT<ezLUiSwJv<k6i@RG#&`U0wO_ZF8y
zT$sA1{z_kk)d=Com7ADfeaS676jrj%Z8eQXa_{z93v&Bgzsr5OO-x(J>>*L~{RX<M
z-bhx~W!aslWrxQ^*IV9E{M=JH&ZdHzV9N;R<NDi?2M%8L6cx8}1NYfGiOT)OL@2zp
zPeL_@Wm~!A#^Tn7>c_pkoK3(Ru(-OiVqB@IfvK&f_s|BfWBA~P8!pHeE~@*aBKv&&
zG5xX%*5bbSHymdCCk~Qxs!{5Bk`dy5r$$r7s6+v;)GO;f%%hkJk>9$$%BIRa%^M<y
zYLa@V3mv{%OGix)e~I{?BZS3a6kr$a{2EVreVxXcw&k>*1tUc)_!?BXrP@^W4TOC_
zoyRP!cSd{hs1{nOGdlQD%h8g{&)dcyA%T}V2<s?f+0`~0Ew&nBJ04;twTqgH8gaB%
zw9QT*a~JZtCi1)iZt#|jP@jn#HzUIN!y+U{79T+%WFW&aarO%bug;3##u<3nyM&za
zva_y8%(em_8s=m1F~1N4YYj`RX8I&Lba*+Ls-l_1hD)xn&0?qv_DQI<52wp0784>I
zJn*_;I)HW*m)NY`ZSJd`Ff7Gd{NWY`h+=cc;l>nD>B%^kJA!%U0c!^=Ns;<wWZ*3f
zAslII@e6E<b5zp2S1gGK)z=A+)t3pGt7Noazje|@oUG+4pWYuuAi)$xx5SZ%DYnF~
zq>vCux8y}r=k=j23uU8YDHIP%cnbLv@6%}q!m(-uUqmciQTs)WKA{EeSm@spO7SEc
ziL#duM<t(YUrw)`;h(&@U=)kVO1+B|*KpJ%zor+=zU1kiVwG8Dii@{yzr>0J{^4Ug
zkIfy-AhIwqSy-T+=n~F>SPC(-M27AN<3WKLMpt2{No=q!?hVv|fJ$}<3!Sah_ILX_
z@{)`n6#8S`-Mvxx`J_Tqa|S`k-9Na(eodfuL%lE}t_n1>6tJ-n&@CHAGw&MW$TL|8
zq-m;Wegggy2}OY3)d<mBK7%NwMWnUJpBA^2)LOXB-*x)Lms?GbEd|kiXqB1q`^sij
z6G*Qpw#a#W$t88x#@i*SJ&8(5=65Dl_aGjV3dHrQ4@%2SOCJ5m9Zb0uoN74f0qca5
z(_T&*FCSMyWUe#bj{g_*4#Wsik!2<c8m!$K<NqTnZd4sdfCc0g2seWtpwjnGOS|AB
z!CiCTfrC*RR;Z~J29331gfvphMfUW?QN%U+dX;HZ@Id+!pgZmo^-YU)`h`9mej(r}
zKO(6+GRkhoNc|3e{PQPET@ZiH8v?gk3-2rWGv4QO#5p`P9NxWEs2Nm3Ik+ivLXHg+
zbH=KilgOY*g?Jc6Y{c#h><uqmgBqQs;O0WC;*S=TAq5t3cFq?=7G3!s@0qjk+gdif
zg4|B5`&5jbAR-JX52*>zjsv62X2RIfGG-?7`d0)h6lVeQC@KUuHBF~V>wV=-_Ru!Z
z+hXgXV>>NH?iuAV<9*db3X@3{S#h1LNi@~zL0}n<7xZ!&<3}VlKD{Ni4~AcB&75hu
zL*j5`_lvWL+rYR6{YFkpj9=3}^)8~z_kb5o2C-h>zc5#wCC_cc_)*(bI*@g5If=He
zMDnkf@GQK!H^+<zP~^jUMhHLAi)qa=K0p}a{t4%I#mGLQ?_Jg%+BK2z?hwuzv6dFf
z5%&Mb?5de&VS)oU%{5Z?>MU4?KoyrXlJ+QwS^Jeo`F^uGkt4QUeFBZ%*3YYQ2qY@u
z-l*)r(ZsrKIXhAdc`Lv-+w_jEkBrO|ZC|(C3%Q^rdiCi|CAlFlU$=F}XsvVfZgd*|
zaI*4=ENSDua1G_6F5A(@I@>A!QI-EoXvPW+9w4(|%Gh4v)@9zf{zIe4r7}Q3%jR_9
znkJn_TeMxmrf28^?+?3%HruSmK`?Qn4TztXPAOw`B#r5c&)LtT&e;P;JtetZ!(3kZ
zwFTf`^$q+VYExRODtt3%)fbwu$4&lcOvZ=y<Yu+qJ**5JEhD@PEb_`olny2i<OwI#
z4!zHz`s;g<0&+%Fnd4xczl+#rjScU$#)>@PFvKgNntnRfi7MD*aPOYiBrdxtSLyDb
zo?bq!c<W+8&cwM+2hP3o8)QEf!0xz2dv2V7va49kM{ObdoMza@%+&-}>i>*@Mf0B}
z^-m90i*nek<Rv<%;t^G?#BTGgL|Uf*tB#;--NVXu1RE~S4aY>qom4eAtL#Z1FJ0n+
zFEgkEk}diu*GoUBWLyXfo`Q^<t$uSu#2AM8r!7gk2NS72sZzCBx0tp(sqmeVV1``%
zGvMI)28=4R__A8M5e`RUZVe0!S`#go<=%hkYNAecbcA>=vkjf!pMVfTBc1%;;3;2?
zrd=cc3Egztw0gt3=JALpzbt>$Qc8`kQf}o$2O@88X<O;Kvk!IzqM#C6<mgy<2@mkm
zKM3W#-yjYZ&|HBJ(wjA0lJE&9f-i^c+a`3W?HUd4^03z_ZAg7vL|?0?=o?I61S;tj
zmhQe}2~0VJ6WI(9U{CyH*Kf+C?PsTq-DMoA>^M~PEhNvi=7}MAFIzmUi&5%g(45Fd
zY@j864-Ie6{)vr@N&&PIjg}|KwI%o$3PP8I5&dzkV&f1N9#T<#<F2FL8Tqn;|9xNR
z`)m*hLonphB5M!BnU80u-j>_Sr<~d<0rK`<A*srIrB+P_RIDC+E-@BO3{l?xAlP6h
zx&NAJ4CBi++hC`^#Mz~&$F;wFo>ehtZbJZ)CU;}Z<}l$(4Ezjmqk@|)@k%%B3NN&o
z&p+xkjS4L&&DCYI(T+s9p2y2T^WRZy<4vvtkt~(x$$p&BkOyA;e1cbP(w<l9)gFf0
zE7x+JHc{nmO}D^?cb#-FJMNltUop3Gb`g1e3;j)Cz}Fpl+E!_s%c<Woh<A<)^WGM@
z{>H7wecPUpz3hGEZRZit-J0+3&_qV--sSPPx~{V<PKjSleQ|6oDYqyJkLGgeF5Bve
zO?O_)<B?&NJAK8v+Pa!DlH;J**6&oa*=gMK!{_m7Gy9}Z-rXRGhTBeNvIApP8%Rk@
zGw~C)@zuV!Bl!rzvV)_JP@mok4t=(kmcdK^<3L{cmuRXEu@xMTzv*XKi-F;<orP=C
z8!Jn9NA={_l0`L>^x^75(nFdBiYDTfH|gJRHiDVrdz>(=(R%ySx>bBI$tWZ0JMsvE
zw*wSZAXw48!V*o9)c!IFCm4?yFLVE%b<UO}ka<@eDDn9h{?sv!es)`Ev6>o>-ie38
z|EW_Vf(k7&ZKx@s&y>TiCMo>=+u3#{hQ~R@%O`*Y{frODEVDHZLK&6`sQWTCHU<W?
z7@uRWJ{4sSKa(Xo6qDy&$xrP%&`pk?i;DUR8PrHi{+T;_0#_0mvxzNd)r{{5i#Vee
zwje5YHRd|?3}(}_@VbtOmkKG>Dpcp#Gg30MagmZz^PhzZEu8rMQme;{XoNu4JCT|{
zl-~sWwI~bzx7=JbnV<iZ-Msvi<j1QUC<}35o`|wxa@iU=Y_xBL@%Jw}Vk0tEXJW3a
zym(SW*L|`EL)mifok8>(w(EC&*gPo@r$dU{hk=i~x#QQ8oMC7Ae4#hH9r&CrxLTNp
zDHvy1pKL>;FgsW83G|>L@$hKKt17H+=c0e>DIeQ`8m|*O<9ZY8$S=+hpG0)##eP;|
zU-n#*+rTThq_@Y4?uNQ?l?Hut7oE+rT?mn?s<8>LysjE<U@UiZn2U8hms}U`Iq3bU
zMjpL2X(yPjsV?2-!s=QQHfC{(t$KI<@TnH7*z~l<q0<1^;ca?fU%I;o;Z>@~^lH7K
zPf)g=OJpZ!0o;Q(@?=-OHi~LRv1_!v6J|vgB95CHmWy$)2A}spQJ88x0-a+GGrf*)
zLoZz&q%2fAfQ@7I%gJx71kGPJM53EXfrcE{Du}kpkPYhHh?N71`{M@8wYw5fLz}C@
zMIxtIIBGb-1X&PqjnU<@zwm_eh^HIIJ+&+QXz=J!RE^%=0(M4!dlw_olhttn>yLsj
zCA2~1H@<<<y{SgLS_{QrbX3Ma)C})yP~$p!4AuQG3?ZHS9_=WYw{Gn6uVR>5e13K$
zI&GK9=r=2O4kTjt>&7MNuUi?HyB7x+#c6{8PK38GqP)(ORu3K(Wc#v;6C>4i_CaFi
zF(~R^ZXW~3<g+rm3j<QEJ0~DDW+;Dosf@m$HC73FeM2ug<bX`S8?w0MuD%^IBxfE&
z)i%oVN^kaS%Q1$8Yzy=G|D>;n$<Cu#&8Y}eyNU5*t<#8K;;6B&6pIW^2Le|G-9Xpg
zHfDQ!3#M%rr#<7+KmE8yWT_wd+&YaugQC><JfBbO#jp4tCZ=@Q&yxz9g!e&<sPFk5
z;@a@WtdlYm?k<>EKC#W#%d$T2W^PV4W2-iv=lxo%>#ohj9z3%MHXEB3e(OztR1?X+
z!+sEV)Xn+j3wVd*Kce{d5@raWy(0634vS97IZ1&xy_8IiZ&*0qXRa~kpS8m^()k~3
z?-o8uXc%ZO2J&)Xy5#Ljz5a5o3%d-aipMaprkI#HSR}snkIhQ8E`QK)4`AM>MbW<Q
zo3+H-Kh)4vq?;=tLofOjV&{E+C?>Ywadd0)cPKXl?^<o!?;P8si^u-@T)#%;3$;tQ
zR!8`>lm>l?W>}2C=k+pZ;CS#4uZySpi^u_W*J%{LlFH+8&Wjn|@SvZ^Zj2!vf>eqW
zlx8r(`E_=Pf~zIbP>2GnYoe)9qKHtbgZw(LZnP0WY9CSbc{!uwpQJ`Y*TSajWkbfK
zOxej6@uq!6n5|oxN3}E5v#x6kZ0+!reUk0>(6`*Tx-!1{yos=Bc&*;K8U#D6xhY(;
z!`pk8_7dF>$gSWE1|iG8z{23wY}R_oBZ$U&1nVEfCEH5Rz59NTlR%cB*q(j3?pC3#
zn;-JGCXc;#4Hs4Y(}+Pbm^BDCGgF1F*dE?fYHR^)JVDqeedLNFmxaxB(e-D>+Vb4q
zCh1!hVzRfu+bpRi{g(Im=ep%fIj&W=mF0xzT5fa2jXxdq9^1YxPg9@Hkxl!BmmS%b
zVF;vaI4f(VcbHR!<uLpbTX2{OQ~xBfd245WN;WFx%o4~1#b?#x<?Hy@?J;>8y47&k
z&@T@Dn}|J)a7HV7zkhr1DoOzrClJ3pkAF7h(ekF)Jo<Eo&HI8Y5Y)^3Hbj4WNx!Y%
z?n;%kb4+@OJdXgl|E$*lK=;31|NrvEhVGoNPXGY=+pqmiVZNQG|C|2vP#f#-=mS6y
zLchK~zxMSF^^FA}qygHN;Mm_0-{p&j>O;LfGd%$CXnmBC&>85Ro*5VnEC2EQG7Ev3
zXo0&g{u+EJ!tDT<K2Q)97A0&fK_>j@BSH^yLU0hQ$r*r2En`i<W)dXJC3YP6DsiZ3
zGjb3qG$>%742AZ)2@C)^z!uO30uGW1iU;Zl#sO9Zwgrv?E)3oTkqH?M1qu}jO$!|e
z-33DllMZtN8wbbo<J*7(uMMAz0Euven2uzLOo)7eLWmNLvWJR>YKyvp#)OuM&VpWy
zK7e7235}VH)q%Bx4UMgcosQjyeSiavlZn%YbAW4#+l0peBnO5Avw;o3G2jmH1|NWr
zginZXiQhs1Nl-&DLvTZgLdZhsN;pLXN+e9oL>x%GM}kkHN@7g%MEaAohRl~NpKOTi
zjQrcf|9@ktFK)mw-qQ~Njn<EcBOStmF$4vW?ty+!hkItDvRo7{JDQ&^_bQ!5G79Cv
zUm>cD!Dv)BA{I_M38yh#HUpxRKpv9m@My7LbH=H2Lb03=Mh_?_C6sgzD^C1^)4Y!>
z&)F<bwilr`dHACD^YicTUUHEB?FG{Y;J42ZUC6OJ2v@{gK|U|kyNqKw6g+|-E`97f
zMl~?o!E!t6!Oy!=FMPXTFKE6JFBo|J*D%}o|9H|#y`hJ_x(yR&4@fr9z5K{|0;h*C
zVXk|3UowJ+Dg82Tz;9z=w*A}pw^6!a3_ryB-gn5MU<i6{jc=UbbY*?TU!Gnr52}L^
zcMp5r_&ZVW-w|a8(x$R*O|b`1_bVKj%;$~w8mb0cf0pkIw%(0(Du_Hu|IC~kT%A95
zayaXR{nSpfq1$}wZ94eH8Jj)G!|j13cgm36DPN@U%Zo_FzD}OzR2QxuEl)A!jwZ{3
zF2bq4u5NbBj60$FS52&Gebss0qJ4JWB<;geqU>5(4xJ3@hqcj_mX%c{tRPgHyNPCP
ze5ZM5A1MPPN|e6vRpJjzYS>E~y7$sJ8KR1L_w<6uzUqfQ>gGA3+;)*^kp(U__}4x#
z`e@vqcw*^hsm3WZ8~ozHRIzoc)gK_vByEz%i$xP$Kgu#XY~ifuxxD5VIyvT^gEi?G
zQhsxJzQ{LK=$;g#$-eq$5v#I;jCfz3Gcwy3GD^zRSO&~vH8SWZ;c94`$cdIE7C8P0
z?Q4W@g3p&%CO=g!Yf{4=G_Zavl!X@z8<8u*#BrLc+O~0r0zI-P!0&;{XP$`*0t3U}
zCIe686+F0^nx|ICM`n%N9i>`$f#wj?fI-jp*rNKNUhoaF3P_)xu?_ILlVQx>;~&qw
z<h6<iY9!6%^GBpF*S5q=K^*TYO(|Q1y6|-va;xh$dG)ShX+xaJtDtQ6{6M4BaY(LK
z5T%`!7;I~Qq4C%z4hnLO*+#!2J1R`8ywGEi<AF-#3&iFF@?*bwZSzSvn1*{jDb^80
z;d>_jT*X!4UdP^an!@1DZ;dsy5$yCEWQ8%!AGRCc5FsZv3St}mp>`=BbSBR*=+o<&
z%)M0~{F2L&%#CVue;`uSX}q2MF3AeTM^X-P%;=nd6ggr!LZj(^6}TQxyUZ$Gy{Iz&
z4r=4LA(vLoanE?=3_Sh^%OYnu%yZasbyOjh6z>|d*udj9D0?+pZ0a2R_Ix9S+9uv{
zafk2pQoUi@fq79XoVL%2a4HL5-&P(-^yaD?OFs!vL9v3tvulAk;9t_rE!-c2-yTDp
z%<f=PiF`Ml!zqt!Im}qBBQxQ4cDfNtXWc&V%btCiUMZZi?m%Q0rbxE%rQC*K270~o
zZ(MeRFkNxP{NK7@3JCi0{c-psl@J0z6$47^p1IzWJ6RL)CqW{^0TnZRV`?!S*Rp)9
zC$BS$n{`D{4su{G;-+RM4!qVqYqIe$M39ybh>nenj})aR`ztjTYyf3vf7jRyq!zpv
zFo3egkVn`97%^O#f@V*Lv1MW2Fvn<_t*|dxJs`~!t?&PR<c~WE!|s{DK+^sM2??>h
QCJloL7yzNf`Cfqk2P$93SpWb4

diff --git a/packages/icons/fonts/fabric-icons-6-2e7e2914.woff b/packages/icons/fonts/fabric-icons-6-2e7e2914.woff
new file mode 100644
index 0000000000000000000000000000000000000000..fa1c0dca1b67721ca703fb82f11b15ff307b7ddf
GIT binary patch
literal 11264
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
G0{%acgj_2C

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-6-328cd253.woff b/packages/icons/fonts/fabric-icons-6-328cd253.woff
deleted file mode 100644
index 7fc776ee4d4af1faf362b69551f8a755348f04da..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 12148
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
MFaSjUUs(PB0U6e?761SM

diff --git a/packages/icons/fonts/fabric-icons-7-143895dd.woff b/packages/icons/fonts/fabric-icons-7-143895dd.woff
new file mode 100644
index 0000000000000000000000000000000000000000..dd0b6e1881638226622f718fae9632350371c786
GIT binary patch
literal 13464
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

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-7-1bae3315.woff b/packages/icons/fonts/fabric-icons-7-1bae3315.woff
deleted file mode 100644
index cd0a223d4bd9cdff8e8fb1681a4f0e6c013c3ad7..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 11204
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
A#{d8T

diff --git a/packages/icons/fonts/fabric-icons-8-bd2a110b.woff b/packages/icons/fonts/fabric-icons-8-bd2a110b.woff
new file mode 100644
index 0000000000000000000000000000000000000000..3b6419e9a3ed699b488846d10f2b26b6fe45bac9
GIT binary patch
literal 13172
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

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-8-bf5c8e0c.woff b/packages/icons/fonts/fabric-icons-8-bf5c8e0c.woff
deleted file mode 100644
index 94c540669f5e08cdd82e8bec4d3cd3c01990ecc4..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 13772
zcmZ8{b8x0l(Cr&L*_a#Kwr$(CosG?nZSKalZQI7i)*F5K-S6Ii?o^$c=~Jhlp6aQZ
zny0Hh6vV{=Ab{_|HVHudZ#ESKfO@L@xBCBwf(ipO001KT%}aj6kT>p^yosHW<2M)c
z4SoOsEQt1qOxVQTl@I^`o&45(&j4zeHJBQ6M+>`e?&90N`POQ^=N`ve7`c4=f^B|t
z@c#$U09*@OFY|Bi9{@m81^_57rV!UoSehA`0ssuj-<t3E0QUEK>pshG@|zp|w$Z;q
z`U3<S%+k))^PAiKwk^IfO>Fby-PXb6TgUj{e*fFgq~wL3uAPzRcU&g4ZyWy`gn(Dj
zP<tagvu}>|JN6R*00aD;aU<{O;Ntq77us*le_FyXCBUYmv)Q*Vo8Y${`Hcn7t~*4}
zY!gGHuRhMez?8s1H;f7<Ft8%l5cBTQ_+iq)zVY#)(LrcPctOJ606=#iEG#@?9<RWJ
zW5DZ=M3Bl@h<+7ALjd4|4?5N}drE1HKG+EDgS+$=%jOC--6BDf6a_{)K~vik3PlQ?
z&9!Ki&{*9{S(++mk~l$<ce)Mf=B-fYjeCsmIoEq;pHzd&OzG5_GRfTR$<hqCq<-Ic
z#WP-EJ3dW>xG;tsJ3qt}>k`$FT@?4myGs=3If<Hk7Xy;ZGWvtTbBwXZa|+tQbAs~P
za|Y``mT?S?;AND8|6VOQeUKKTPC9j!RL7ZA<Brq-7F?N9OqrHUncB=a&ABXIx-8MU
z3_0A0@=>B3J7-+ZKTLTE2XZ^1A1={TRM-U%`N9ZuW3``y{WcWAr#}v<@&IAx#%cz~
zSW^s*X1ybZu@l+|Mu?U;03y3LSY&eGx0I_1sGeg1s=TY=k4r2;T;N<3e`7x8)IXsl
zch)nR;O)ipGWw6TFQ_EC1sLWyg1Pm}MF8OY9A=H7%_t2m4K;^GdslledOZXBK%$|4
z008B9P${0-dT~AS1A_3wE~Jei6oTADId0S<DG@oRVKStPWMuFsB>{`l#n%DJp+jIZ
z`}WxP#?X_<pY+W=GeDmnm%p!LKJM8i64X@c*&KWMi*Sf%ml+?gL<-mJW=670Uh2<g
zebz9AHu9K{a<!JDvyZ8=cK8I%*>uKfL$NpWj`LyiXLbPh(w>o@`)a(2LnI+6I|{eH
zF*3j=TJ^AnX!1(1XZ?ozQV`i86I9O!oFD$9#R6^?s0X%OW*fcoE<vJs<Dk!?nIUg7
zasH3_iC<xFcB4HNLXUEr4;T;OMtwoG1!)!=iZD2auZSV<ro#Xb04M+&0Q>a?K=RBk
z@qzKwSxWipa!8?bsHdGsrCUp+9dqv-OeOPbF&>#VmdxffO=u7r71zlpgEN|dLxYy0
zL`xT5AS#whD!63Svn){2W(-AS9QZnKwBq^5O#Ne&Ke6&qbeT-v{O~Stvi(e|g*eq{
z@_K6L!S}q`@P5@s49X=J@!;fzgd8a?IeFX!(aC;obz61l((h7MBD&4u_K(R5J5V4&
zmsHeuM_3Xan=A{uKx|P-{VHGo;NY3cI>sQ(s;x-Yt(+*-_tlq(4GpfoMpA+n%|(1o
zqjd}0rTpkdY~w9dQX+cy8675;Igao(>QYtVpM#Pd!4K9w?{;$DKj*J==iKte)4c;n
z+yxBhnL6F#N>`R00|ZyAxKE3Vp8eiD{eGT~Ykz_Bzy!p&zb3`ooNyk^wwX0()Ijcp
zQBtvo43rI+1k%04ZLgtyW`)PEN$TVrm@$z;t=$1j8?vE6`E0=soOy^wFzE?FE7<Te
zkC4j?Tet@AngN+W-g3-HW0hNGQyLnScm2N*kU~rJLV*jSE2Uxn!&+hHGNLj<Ze_P{
zm?$(>`Q<|f?70Ewx4;Ah<c|yKNqeGr1M+l>OpEvz1almQ`xe!?Ug^n3WdYnZMr8rS
zt$b0EH#NB}h4FloLK39)>znm{_Or<%M~co;e@RbSA2P1wGnIVL-`$yL<Ww0%Wvvfp
zA5tG&L{5~C5WlLfmQ)jUMdK!+lUNQ}L!Twdx#VbylfX*R_F0()3WaFybq3Eq*d4%e
zjEJ~>5=8@$&btE!phTHwaM(q&`t&skfBs3;JhPId2m9&v+y8HjDq0rFloe`024tPP
zX$xfsItq=Ky-0D7GRLMRIAx`Ear|n2xAcA(4t7dc%({M-6!LxLRZmDLd8F{4e93Y$
zHuW5K2&e~<P``80g*{T#3v7I<sm^|WeO6$pFae1vOiVRXmYE4T6mQ{x!?diwM9&YK
z0%Xq64L(Md6vgR5HHrYH26MVCPVe@0om6*Ko6*=&9c{Ofc?^TuPJ~Z1E)1<%&WYY*
zA9HITb-x<t+f2Hj=@|E}wptCX^F7^Loel;D$tf8*brz&sBNtkd^<^1+1h*<Mm>BFM
zf;RvVv4h@(f!DAio~k|9Aba5rWyaz5+o{Ap#)Aw#K^Q?v!7hNEC9xATs9Q^fAk!FO
zX*!W*LjEt&ztVxpd$jY%FoYyWTd_Kyr%)Zsepjd+BRY*@&%FLBC+&XMt9zLCt$U#Z
zCflEGIXb!9J@vIVzv?|s_Ueu#+@GGVc<X&GZl?8*NXl4%c_=gUEDv!6Sw4<l6E9Z^
zKK7SaE)0A)<r|*&dco-g6WE>S$8w*$KPmLL*XYO?P1J>?s2;(zlV7MmgxKY}Oao}i
zOibC@QZK^&Kw6T~rTh${e;98i*6OU{QkdYj(s|r<FECqpwesPBu@Min6y9A6N>D~*
zhCHd%br}eQhVUk1;=p@}zGA*@dwP0Z07(pd9w9F|7zFTIFWv6lzZ?wwEYF%&o5Po3
zLH&)9)`Q<-`8zU_WC@qMr-4U8A0M4Qz|q83Kks6B%h<(J16>r%@)w@WytJCz!!#<%
zPqCYVH2;pTFpVD1L*VLNxIquy&CNv5+~fww!(R>oZ&w1+rhAE?+NT0LCh?2Kg&g1I
zciv0_-Oqw{=q`@#!;BY{UvhfI*?cQINc4GrnMe~y;{azGLA_m0w`P8#QZCC>S;q7g
znRqUxdN3VkArfY>f?&mT;e-Lv_+mL0L^CK|CoNkF_eaoCA{wjkx}Oy1`Q`+a_OmPb
z%PG8AOd?eSs{y~5C6-CJ#=+U*Qd4;D2mL%(iR%LG<BmWKz=2k@#p6yIjQ@f}{>?K?
z>EQbD-fjx;wcP(c$&KpC@T{m{>3%!3x!!ad;i<{l{Ath@l&V|L5%O<}a1mN>wkIGC
z;%~Gh;$|wa`m^X?!QXCK|JAzgJ*2;8{nBA3K&5h4`YK=I+Y3pX{oGp))SlJ5=(t;D
zFNE+%8G@x9)XVcvub6FcS0bQH*5`Rqr>VNkoyu?Fn$Llf4)w{6eSPNZxW9p)PV;5m
z#odSxEkW<4P<;H*4@j$^tnk9zc(>z%@meZt(bnGh5NDypAFR(#cw-7RUcg+2v)^|{
z4jw9IW-2W!8+<kO&ic<2uDv@Q^=9|*Fo;|^B0>j`7FKw2@N#VrUC|spM4w!4s;hoI
z)At##S=4MFUCZdcetUcdQ_*bQ4-1R_&I{l#P;bmIzAy>$t@xp@-e7HT!`R~K9M#Yl
zZSe@)7SWlPVNi$+r1^||cKFug6lZR=pDehDFEb*6U*oDz+LHwlmZdN(HRWyT4|%q2
z*VGOO%%(Ov6XX0nJq~6vIy4aGb2Dx0c(LqhJvBo|)~5^SkK%+_AK|0Jd%t|^i^X4x
z`L!OgFIJpbioDqCUw${BA+?)BpG9qlMtv@E97gXf%%o*uj|-r?!bC?$KklGoW@S7)
zBN6*1F>uhXL%Xn-NF~;4=IO3RiwHJdwBN`gnJ*1bPsZl!oH{+WI^!LyMYxj8%;J^%
z{MgyWY9y2k9Q0%Kcz3po1(C@c^}4YsUwW*veAWL59OC0iZGpZ$H6j8I-RGs*xX`KE
zO@n>dPH4u}co;3HZFv8)YQOWCeXTO27?i^EG(&O49Q7FIA{zZ85OLDTr5O9f8wC*i
zuq^evnC0-G-w<G}dy4fi;A!Hqhdbt18mf3hWY~V45;1uc((!pNTiNb1xg4DRG;7FZ
zRmlGh+6n7??WQbIO~jE{Lz0H$3M!;ZYHWhnTZ(8B2J+=}m6$#Xx`b+FGz|l!sSK2L
z6lw<?Q+fm$_REXz@q~~fg;{!ei@#A@M`Ic9$84>pFN2azZ4$hw*SS8m8ervr6edR5
z<5@w|Yhv2-@)oet>9Xvos{~c*DVs#wV^teCJwI%ZX7U^OUOPJY>e#7u?Py$GRg`5L
zI87ZJt{7@C?%su-Eb-tr!zv88TI(NW^|WptIj6R%huC01*fo&_8Bi&nVM^FI{=576
zx-<ttW2`#JQ#!7*u&To2Pr80l>A2Ef;qiNg-unI*U-xXk<8Q%^W!jkWVn0t2R$it}
zN_(GTx6g6@JX&9ZlYwWlHX~D$#@j2^+IAP-<%UigG|PvVvt(h3+m*`DLfalYxs!TL
z%GF&bh^iyM6AtTakFmmyOMUbwdK-B9a)cVk6fRM%>teOb=wl+CNY-X!p+=m{NRRSL
z0i&vFM|KH`<CP~?cEpaA%bI7XD&QQb$A;pl{t^eQ3H|KPMs>cw*}-)yhMg?+sNy4e
z_--4Ow-fMrMD^umX9dhL3E|usdi^gLiR-+?u|~=F&=&egZY)KzRAE+s-__}qv(lbx
z%jhJ9|0QLGwqI48sI_!ZZ&YNedqT2nwDR6>Z9wS_@OyMb!_l=r1)c^MQl?VVt-yx~
zM^~Spc6srmPh_okysLK%^+UFp4TVExisP0ZRytVTqOHSL7E*SJS?PU6nJ2HgPRtz-
zn{|D@g90^${PLHd_d?l<5Hy|<?L5-dPSEE^(gzda4u?g;lZ~~gk~e>XRUG(c?elvm
zQeu=2tu5~+CclG*x7h3Nl;;+lhx-h%7s$T2SlNjsP@YV9Y2Ee2FZOqqhqv+N(J~(O
z>_6ATh#`PY&OrDPPCWL-@!Dt#Q%(d|tKw<#J;v#w4%jt`RTt<iKW%MqJTl!%Eu7~k
zZ6X$|FY0^eSDF;pEiQASG(lZZ|GTE5JajW1TKVfxevZ52`SD(X-)>c^DgP<dy#64i
z1%^bE8#AFO*h0w4puNHBuyDs%GRk5TXb}rGlboL>-JlKW6Lg$#vnTf^VFP;bY^&+`
z9Ml(n#Ak@*YcaPyQ;G9-!AApU=A=qhkXzQuJ7yLulm|Nx-#Dfib}G7718uDc{d)PY
ze&!F@4@%Ps^03cgCJ&3>{z_YQdA{<%U)0;JHnkon^~c9%Jl;?qY_Lhdv>lcFbE!r5
z7Urf!uic2x4U%xnTi-HXr-aY%w;uVhY>v@~#KUG0P@$lQ=$AYneIA%M>5d>;f1v^V
z#?k>*p@;9+6o=neFwdb&1ngi^O$5^xRC5lM3|wE2t^z($&Cyd#81Y^N0pc2Yk@-lO
z(PR#Wq7?gIkt1s=(_pGa1t?3NeNJ5l$3R}BPWAC6P}1EmK5@GApfLlV4GEs0d&;EA
zp~Y)arKvyVS;j7_x(E<*L(pWROkljWCCHS@Ii{rM=9S$q9W~uRy^jf3S)h1S$Q_*8
znvRB^sy6YcdpJwYsbM!|bRolG5*_={n&uNLdMWLwx{Xu856z7~XlbcOYQebA-#>|z
z{SsC2`MnN#^z==X)9imqrO~UIy+ipFwu>+(G=m;(guT>4IcsZV=;-QFG0s&KD=MbQ
z(6XBFlkNqL*||QksWlq&ZE!q=zaVjU9Y_hNfs2t80_V~xOHmg47-CN^TjoE34p&Xu
z5Xh2rXWm{g$<nXoyOqvSU@h(@zD|2Qvn1O=Iy_Y9Q6K(IFmSL@QI>{VKFbR|%QU4}
zC-bO=4cRK}U=HXm+lBJvDDSbg12wra*6lBPALc;Dc)c~=pK0Vt7SS_MLyA*1?Ac;S
z5XJ2G9%jnYcp>>;nG$k@!Rx9zy)sL1e>5^X<H5hcIo*Vz^DUwOS%f+*Y@tm<AEF3z
zlr@wAUe<4LE~y{Xo6D$f!fgjbS7Qcng?J<Ogf-)`B~0WQWlc~-_$Z~U%m3)jn?4+=
z0BL|UkxA=PftEP1v^V~VnNKbs=<8{mMBvI63RqaP>~INe`{Y9NlG^ZXplbP=4~1+K
z?IFBTnpo<ZQbs_}K-uxb-D)-?a|=1E(sxt4sK%N#zEWE$tR<3Pe}$s^ZQK#goVcyl
zO@PJXT33fTk+Ml4Dw*Q7_p=ETyHS3%3?~WdDCA7@V1BPZw7^q8oNsoQ<6-I}ZHYF<
z!bjx}<(&gIW$+1+5)~5t3G>JmglqE0>YZjM@R}u8jl${YvRMN!ToY>F{Jl8W`+Fty
zas37?jmFpyeiV=**VKt}Zv6a&?oUdd<a6b<d3Vt6nB+M~UpD{H8)OKb^czL79wow4
zVf%!5;uBfz^9&W3`Q<+(K<g5<7ggED0?lZRVzgEudK_nU$}|;Y`BMVVX`K+#k~r3p
z6`I|lch~-JFMtpGBm$H-mIHL5k$a()SmI+Jm@!ziUIc@z#+Z~rW$7~>0O3_=*T{7n
z;YiJPD;czhFw1DGf{RVgGiG0p#2G$o`wzdE4fF-?T%ib*%djUK0;%w~EK4+?7v`uz
zCSVS-pl00{7Hh?@Sd2S}oSlL{523f?cuf|3n|;O&+fW~C+TBr@1bOCRPe<%_`Gw!(
zxB9_0<_U+GeU`Zk=H;7<uZ0C4p7W5H99bHx80uFt$g71~f|{Fpv>)39YIMvjri8Rz
z^Lzqsc+N73MCJ4z?v!_h9GA0bomRM2j2cXM?Hb@%={WyF)YcAS4VKmahvl?t1vI;+
zHY&@JHQ0zLqGtr@bP(DR9%;gHtT=sujPO7f_r1o>S4ve5E+(WBBf^#b0={l*oy)n#
zl|jx<n-ymWGkmCup`{3||LZn|detxEYi1kU0mWV)7BS~88K>ADsROR=3g)#Ym(Gp$
z#|o$wjDP-A|L}L_Le)$%^mv9l;4Jm~)`JbUtS|9*)<RPZH@I8kp3y3QSz0K}OoywZ
zKg2j(v+f+C@i(!b1U{U%*|1X=?!&Lpf<#`EwZy-TS&XK&Lc(W}x-CFvl4EBj`1qvr
zE1ty8Re}hc%<*_fIQMPSAS6KCI-;^j+>C>FP=)6<&5j<^+pLuT+-g_f;On7h;I1R=
zg>=S*Kb#$&p8hS;=k7-^9B9{B9c-@rXT<R;V#<qH_E=HP&{&KG*-MV4?*-d3jdiWd
zM9sr*<v2l6OK(+WwZU13mal(9!%b(1*yg$X^0aSAspU^@&12o-)`8AcU&)6Cj-J!V
z<{U&8NDSm`Gh=s(;nKYqM0+-p7<@66X9d?_YSWb+QmoAZlKr{7!9S;lQ1SDUmzM+Y
zG#!-%LuLA%w-?S1)Wb#A?Nb6KD(hp$W6ow0@XTLuYc|9uT0RSb$IU8J!NE*%=?k^I
zL}&*$iuB<r1$B7iN7P~yIWv+O3lyk84@>|3Ln~Xus~Fj_MuRWJ?hxAatqUpgj%|)`
z3i~V`w;^O77iOWi-c+v0-|3mz1A1X{VHtzS`r;TQXrw)3<MFwZR-^-~vU*L>v^iO$
zd~2TsI#JMi;_k=Q?GMo!nUR6nOp5y%7@%+VUV9J03A)rX#2d52nxEl$uSX#Nww_LX
zHF6D%uOcJ|X?a*X>r_s=K6j~oXUzWTF=qK~?5zbF@ZayfW66GSCAm*uw8dDOo+o7w
zBNQXKs))0EpwH_oy}eiIGN2^=ArLk3jXledQICATbOC8ZJ?Q^xBW|h@)%&%z!yz<F
z&hnUKh3k{h8IpkI-*VM=;?nvV1*8OXSFC-W&1QM`^|r?wS^UyN3S?jSGN7kR{DM0o
zmCGcV&xAh3y`a~al~-sjuif3WDtX^YnJ1*?;1=+xb&>E#<bm#C$F3VMacG3nqvzqn
zmTuI~%~;cBet|6)AMYcvv#=R!kXUn=(K2J=gHEujN!XCLUv<1|M*cIsZ?5rMKEfl=
zqu3H<#Uvd*33pwNT#GyINb=4TRq^#0SX?-zpI5w_ROEo)TZ-X0cZ-AM_{`Q_o(pae
zk%b^dDP>-9^-}fY%CaDCkeG#0yk8gWXxoz~5~be@5qj5fOI>xakk@mg-;2rHNgzz7
z$QHqJB!P*SLcLNlzl7P{RDvPbX~{sC64Zy(79zSPo|OfrqxI>2?%zp`83?>NQ#SPM
zE_N$`A#O}YdX-a45@djshOu23A+WC?>_S`zG%T1xKIl61b4@}M8U!xKXri7v3<VG3
z<T7C~#PKX4#MGkZHz62^S^sasGy)~L_M)xz-rFA`<ajaLPmIBoo$#H8O5&=b>4OYW
zq+Ng*Ha_QDi;*wQV+Xg$!KE{Xw}S_Yd<)Tbr+bRTL)0vEESTfB{s1W)^4{WwSu3p$
z@Gf(Giu1Rnuxx8mr}}tWat$Zkb%q8(3<uIUaapDzogs`)Jm=L^_TEl%%#8rMi$LKh
zT2m0DXY3Db{Ify>xjeb7OjZ-u`CE&J#=VTT!u2I!-h;rLaHP;|eOUhNs|ly$NNF4}
zHiNy%i{BmJ_h>U7Wfw*+-REh|;wz-OqmF*E&N#NOF&KdvSFMWmJ*>7$3=u-O9JTu0
z6(bDqD$Qh9ZKZa!jTpO<(+r=jbbm@bsixY&Dahpvkqx2(y#0K&&IIUWhdAsbS^g0A
zZXaD$*zdk>uCmpgUn33E&RSB~<fodhN*-KowGVrSiH+~26nCC<fv!ib3XvsjUxy(r
z-z9nAN**jGLtR`RR9H^OPKhzz-1<S}P*N;#0(%$cv>EWb3&K>8tPB#)gNwj-Fs*Cx
zsztdchmM%AFromCxEjZzqS_IBj~BeK%cUz%#`aMVmSW}WuucNsZ+|3;uEZ!HWjdeF
zbE$*To79342uA`fY41AMprWx*$A6lN<!f?=zbD_7_(=_60aA*cHUF!Jtbwb*2B`DN
zH?S7dXPC2yH_iBFKWMpF{NWKF2$CFZxgEkOe0sxDnFzwOMx;*J!%w+izKNal(>FyX
zOLvM6^#ia~!?H(hg&t@wVJ*%=oSgq*?J<$)NRC6Zo8wlY7M|AV3Ff)cyiKq*$)MG*
zN*JE}z|z(j|AVGToBHbX8fN1Z1HXi`%YZW;)F=VZ#SF?>=(T#Ymp;wk7uR9wxYTJZ
z=`6I(4MtnuB_gtjkspr;CO)CXnczH_(uS7!k5t7pKH6J~ZE=7tl4nJ!21boRtqT<;
zB*}wxg+aSZ-+T&|WYec8ZL3AHfr;YMcu9kD^}A5@yHvs^#U0mA{*H&8Ik%0L1vlVz
zh|+bFH-V-xq&J<H;dRsYYUE?*%N(E30nU!lW5ay40MXf+*#OroK^u~||Eo;<0R>v|
zfC83{0X<}-*uokDnT-XIe}Bk^f_OM$a3Jtj61vhUG)gFnO3pMX)u={=(ZgI5yh3`G
zQE+WCP`%uV5i`_I|Cj8&;QAew6a!2^w+%a6E;4$ikQ}ne(>)vAJr1%ZxRlB)p<R@i
zLV5mG!8$f7`tkxrOwpj4#A3VDGCQkRD~dT?(WX4p3Mr@{0Rm<4ZJ`fU|FA9oL3X6}
z5<L+bZob7M3?Jh_Ed`4#It^Nrm7IVKSSF&BsU0^DJDZ9E%q*dbf~FgADk>c{rTVDK
z^WCaajGx+8<|i9o&V}{<tt(#`CaBvX3;YY8_%&$!fy@~7tewtS_!wLxaus&C!9&z1
zbdwGhHNDs)&pZAZc;F9X3pO5h_-%2LpG0RgiHnZWvU3hMG_lMSp<^1NYEcfaV57M9
z1+D8NX&C5Dl9Vng4&JQGSF|2zN*v-DeI||qXeMesBsjO~3wO-22<@nwiIx(@X<^)g
zHNSdq3y$Jpm>U&)FiAKx%ZO)UzOd%dE{pW@3W36X{OibU%=I4APj`&0EceTvYxrys
zkk!7*OMUB<l|=>K>gNV}zDNikFVj4y$&#mf{;5@|V5z*PZ)V7GJznR(c{k&raLdPk
zvS;O5)RfWEHA45G(1t!q$9+O6W!JBjR;nh)?d*`kM;6jYH7=Yg&#(#z`cst-z@-R_
z{m6d+4&REaA(s&<Qfr#FZ5uuJHpTnE;cFe*sYmjKt1i-Cj7U6AoIR$27c^E<ZvLcE
z(yg~dR`pJBD5xn^_HXm6+$I+C6APo^CRA*rRV9xI640;cfhp;g=_59B>X0d~!iXEu
zvZQiGcfGhMgv&QYzW|E7j?TUA<LAus0g0q^7!`4AmUaWa+CANj_ZgtPuDQr|PlEyj
zAs!6vT5JAR^{y{(5j_2||2+bQQG25OTwUt%%&d2yu<vAK<Ek-J-&H20(4$k3C`O-{
z!u(f+3aylK!cfn3g{~}EA4W20o%uRK&bhUV-J^n#@^x0yqeVx3*X*oQY@1eVcYLF+
zNTfX7AlV^>Dn%^q!rEQhxb9qxQYnEW+DkK)W*<~|c3hsryFKz~vZC}+`>rZcJ6FI#
zte1Lrjhj-kz0YE&&t0xIpuqKpA?K(wWk!jXkiMTbI6n+1rmBXl`o{DZ`E}411}R0t
z`mJ1|r*=68vHR^cOQ2nVhuzbq+*DqZah08ceTQSc!9~sD^RuvSE3PV=lP_PveJ9=*
z2?Yx!vWKpk#vx}$;%vF4`%&^>-UZ5H2m$J!|4|71-*rL8Ag1Pj?N@i`P&L=OtS^Al
z#!8;3nhf0*;+$j-tr%TQEm8GEyF+$o0<RDg+0RO7F1D3_R4BKH;5yv%N;n4_%GuON
zr-l5j&_jlwkY+!iEd7UmkSXofWkVnv?-7&m#Ys*NdQ15uB2>eLuONg?-sf%Y33_=E
zUa(J>`NueD{d;EEL?Q5fS;+HCCl^nn!~Ln(Vzt1{q^3s3V8GdK9ehz(732?{NZanj
zN;+|52V`34V4rp<Qu!@8R9hj9<)((+8!B3V9(EtCrPk1(`NRL>FpZqN+x3pg5~S;O
zisN(&>HM#R!Die2(A?Z0kH^-dyzmaO{#(i3oSMKkiM~Yzos`e(p@5)@yujD^a{G|m
zQNeMgdu;>$NdUMnQSwVDh`4H<r?{ytkIqK;7eIwCe``^KK_7t1!c~yEzBGRrQf!6E
z@FOZJYVR@ve3jXeXE>S}g3e}ZgFv_JH^JKWlxkPu>8)DcdP6567u`6-#IuhzdQP$U
zA@ei^ewGhNBmN0$kR(wYkeN842y9U*$IF;UR}uf7qPAA7B;A-4b~+!c9M2?RuT1yP
z7m<_S?qWL`l50=uOUs|*P%sAy%iEAoe7XX%vbX(?ETpq8sH_dckVD8PZa07KuFuC~
zc03wcF$4585iJKKT3dTy%b?8`60Mep^)7F6%Iwa-ymG|`<6PhIR!sL@mN=|YUIH0g
zR87FDohI4J<HTsynZ}Zi&{uA6$}eOJerMVRUN$s5i4Fmb*aAnx%m|_FUE#1JVkI*W
zHd{HxqgP>C*;t!y+5-;oTq?Luj&YDC9Wd_YIfjN(hp;E9`x!nnownx%8{Ii_4;>RT
z->M41s!Pk#s@k!yhogE6Sn2BRN6&tAyJ~y;YP$zj49NB@n;fz`uf6T@X-OL?zcRL-
z`nsN`{AC>zx?551_D(syz^I@?XPcYy<9gt7X$zD3u}%5S;HI8VP>`x|O=%_d!&Jpt
zH7(WI#U-uvS(%4cmHUs@r$4c|eI*D5ni(Fs3+QR*$|)24-ZP$lVj^<B8f`Um`h<(m
zv9X965neRF5&6w7&>dEHHAtQD&{*^pJ@4P=NoK(^sp=dtY~aIT$C35a&uFP>hidF2
z!EzN@-VRaftgqw89BsnY{mwFJ?1>I>arC&h4ar(nUD94&Qf_aCjE#l(jnTVp))!~n
zf)c)Fvuc(s&xlTMvP|yx`Cm5sitL-TP@PDrrJ=GpX2W?#f21su#7BFRjh?ZOGkV!k
ztxlU_FMQ1=TikJ+zFta#geH1vcw_hsXm?{T&4nhiZus!Dr#~C1_fJaJy1Z2Xlqc<D
zn{%LLQiRd0!N4sJs{Bg9*8l~sd0@)s?R(6Fe|WTFZijZu!iEf=t_dC|u6;pobXFjN
zTkhs~9xJEI=9Dl5rql`|MYLv-`=;r8^tu;1#21ja<M0-bhFQW!%MhorS`i2AiL|0+
zvKF!&HmHDX=8A!(k<XU&3_cxOYB&42qafV|rVf87_>7>hHviGP<aiQW??;>qSUiLw
zJfcE4FZzq}T`@H2KP;A21~DR*B0q@8jKu37*n$wW^d%NLuQd`xfp?!@6$CWF?+D4Y
zkmWtr2dO4$$Fw2dq*FZ&d0#Xh&0#e~?!{Ak--lFoVWVLoZjgd2!)u5sN0`Ej+GOJk
z$d8o`Tq9ES&_Eitk`GCl(1Z;eSCDI}fR#1a;ui1=K|M^3SU|VJ9d0EYFsd@l!MONC
zyzYKbwi#ALewn+|>zls)NoR<-g1n<t7M>DP#1;<JG|t?K?wvVAmiKv=>yR=}FbER^
z$Oq*iX@$`^y6CR|U1nS!8iW-ErH>zGPv5H~S?!)&cQb#?eAQP0=eV)L*{MmNIp#PS
zF>00=KAr*3TbmsHS^jCKV|3E5hgU0fqGH&KAPy|`u5Kh_J1_H-_+W&Sg267J+RPJ+
z1mtKq{^^Yo)Zyd$8qcy^P<V7xRP}|9s_bimDJ8a<shH$-jhQ^SFHg8uWv;cr?=yv*
zT$8o3yhDtJ7_5rnHB6tZMe@9O3h@gYVv4lw`~h*?%cBgb<jwLBsUMJR&Z=^UCbp_=
zs-zGfdQWe3Fyi&B?M%|fM<M}%#m=5HTPgUHx=2e?wgHWDC07ZR3q`~yT1ecB`%R3Y
zMf8J~b8BMDgq0_#-~l|ov0SmWxpB=L4#FDF)F!gXJ$D0xo?dbM?7h!fVbrYQFimru
z8xkXYvmjyxnYMz!U8*GIsxat`*xT1i$gh?u*<eA@uHg`!>dA3uUe%znf~LKo$0d%n
z`EP}TNo55OEGp7)1`E@GfoN6rIsv6(ly?75cL@y#1(_x>E42HlJF_f{+zRvjWfniR
z!ILt$<k7yzd%FpBgcB{a=yk#rG|b)*M=zkYwK_u_9njWzONB&agd$hK=jAo>K!il0
zN(Rp$I}{{(_+LxFmk8F`@BJo&Qn(fw`~oy0_Q+RueV4wVj3oTIQ|M)o0x`(`UU;m`
zcZ4Q9uXyUOkNz&1#+R#^uBYissLzv0Oyfonj!p6fiMs~3a0>tD+alogbdIf}<`29Z
z;I)JQV_=EQmG559V;Pi#|4Gx#Wh_JY^+tzVb0zp!;brd(zkkt({m4&-8K0;z<7Rgj
zo#rL1TTd;bn^SKvJCyqV>yU?39lrD2J5Iju>f)Z~!UYo>3KOq%((fjSq}Vl0%+-KD
z`E}S4C`lf&^M%^3H#UZt@%Rfq*R<54@W0R+qkY_dS2;1gR^Ubp_%JYCVGn9*{kFp&
z{M^l!+Fz8if}9V%Q&3c)jfK=%66H={FUPcC;^~Dp0wxZ*)_Wmnfan69ja@_xn~LDU
z=b)N76ELh7cJ@&;vy4@AOn)WOecIh2C`~E6%}{LnZM>Y+B@>IA%0FArS8(eP9m+(_
zj(0%tc|DU0K!-TIDfjsBIDKBiq&k3(Q8D`leab-0qPR-+W|YX(Ze{1XHme))IF@)f
zo~nwc?T(YeQYTg^7eDChT*Q{i{!z&!btda4R#=EK1In7~(6zX&dSYVnYGf^c`Sc>d
z0ZL2*_ECZagsILHNZd0`8~LZ5%|m#lWfX|ge+AO~`anCH7l{9^;F|VAScfO@m3(bm
zg0br6glKIjh>t4Y2*i|HJmG@V9zu^UiJaQ@^2Qz0^LT5y3P#|V2RQqiC9T*$v#ZJb
zPIg)sGNhztKG4#YFqAYO8@_TQf9d(xTO|0;(jo2-rW+Af78^Ys5=;dR5_c9dv_pN6
zPZ5RlQ_3D!V-)W{0Ndx4yKq)w8o8cIa!AS>E@aUAR9nHqa!gF-;Vh;Z%}7WsSt$Rq
zSRAis?PE)dWZm+~^j-2*2P+P*)*pMU2W5WffTd^&@CT&*;R`huVFn*<Br;+~?(!_n
zK5>0A0sKj3Dhgica85V)0<n21Z39~cPe%bM@_Vlx@~#drGuGcLa4ZWJpbL!V7d3Yp
zL)n1KODpnjI9QQG$ZpQP2y44!{NcLxk4q!Bcb}RA<ME-OLD3J*(j^&R!{<W5kVRyn
zt;RfNfVw_-b8<Pd9#r>zm|Qk^E(clh*(hNEcJJYnGU>L6NrK$ho-w9ukJ6wZLUO;G
z06*)7;q_nrl7`Y)o3Gmp8<WOv`IgD_^00O^AuKMnXteIx^P(HOYFc?T60i3F9m8ga
z=iG=vtJ#o>jJQC{{&pT;6T8#CkHStpxsH;YM85Z$kA#vP>noEB*>->NKX|2mnYd2B
zm0gjJn)O!a*QP2BhsYSbHmBD7!fIjq3WkN56~yIK32htebxe4M%I@2|=Z6}<ho!9V
za^XQMw8lB!*Mq`!$Jf?h4l)6OPCJc?nvS|cj@ttDYsEzhE~k9-EBk%%uEr{Tv(Ikf
zCuiIwv`L;6tc!-bzRRukdJzVnLlOo&?XawZKG>xjqV7S9m+3)Yd^LeW{eTQ*k@ZnP
z^0v_~k8FPkWxtm{#BD(XGJ!M(Vkg}N3nSi#0jg_pS%$nh7~lSh1sI>Jl5pIl@UQ)d
z&EhMI(chm_;ChQ6y$0reJo9P|dq24oB|k^-d??^ZD&7Fe@Gry36>R}p(kv!UKe%!I
zdBJk{_;UlNS$*f>H>3{cX;T>l+a(D$UPsdG_@UEt;beljLDd-eI)S&J4skv82f>af
zsuuKTv@SHl+Q(Z=n*uL=0nEOX&zO|m{k~@xJJEa0gVX*wp;OfOc87-D8lq4A5S&=B
zNf7V7#IzS_e6DD4J{n=;Rk%MiEZkiEgp6{RKpnlJ<Q0EwSe%&?I2sDHMa2XTYRW8=
z2qO#zYQLJ>$+I`(;&dscU&okJU)k7<LW5T;zb+G@*$_4Rj{O5|AXiK+q%Q)GtTowc
zx08fE4zCvj9{*~YAup;*Ws)*A*CJ(O>B%=66KB1+VVgie#fU!t*Xz`0CO@gK%fVb<
z>__`kx~L(@(YW46>dKu7kJ`Jc0rZvK)R1X&d*H_OpA=;msMix3sNQ%IZz1P*CyBc<
zgpD-n(As(SX^s}@2QDvR)`uzoshRi5245ob2sj?}=Gn8kyW#DsxB&dGWoa5sdoR`1
z%}zqyomp*?+ylO{Dl5BEBnHc68>ac_P^g@W()(6B_LjfZ!Zm7*lg^c&G5pnW6#qDX
zYD9LeYuJrESccZ(ivGazHJ8kt($f8Y@$99Nn6#zl&S}j1Oa1#2)+of8*6tCPDGIZC
ze;8-8_S$x5@6&9|rh`ZQ%_O!Q<(4R>Q=r5@@YH<T`s=sIWLlhxr1LW9XO{Q{f=4;g
zk%7*L!gceQ_Q;4qDf7xL3n!urp{ogQ!Yzp^i!D<QPWdYs<{cb#mUCL!&gOu)XMpY?
z4UUC%Hdv)^>_eB=^1PEv2F;TV-@CH$=M;RnlDWicoeVnFs3<57)G#E&_^)KI1a$w=
zjVU_}lES(C&C1nW$yLu0Li)(1aDn1K_>!k@Q-XMb7ntCd%b$xN^tfcl0BbEGmNz84
zABdK=GuP%%Iw+@nJ&T+7S=o!vw|qV0w`EdXh~~^Y4_QxM+ZK1qMi^KT_KfzIUT8VA
zM;~QAa^rb^1W+2evR%|$nK27-3vsxb?ua#}Mn0ni3ADNCM&yQxY<fps>Bk$#nzH#%
z&qLti$HU-JSS(}4pmtw>(*-T<(xD*6o$N;n^?W|D5GSD^AcW~$j6vIW2u4bKvHuvj
z7z?l@<gLXEai6ic^}WO3e-0?MA?Iaa$;EuJ4U^!)<sIQVei>%o5PS-k7qgm(3onq8
zGlCB%=o%`r2S&Czq?JlYg{(oyHtYeBKk>zr*NA-{p&2$N2DVtkh+7C`(Q$(Cnf=Q^
zx=B&GKKs~)<nDE(rO&0$Qx{7{6_y1SH{WN0dBxD1{R4@quW~~+_?`UaU%Wy+ay>b-
z{;~H7U*oBjcEI(y4H0Xpx)kL_;D^C#^CjGer&w82t0=;j--At7FN`<b-I)l?Sr-2U
z)x#G^yiG33cT@R){p6;GhKA+Pp9dUGB)L1sG+-Q1V9*y|-nAg2203>xU=hcLfM^$H
z#z0DdJtG|N|MS^31b}dkjRwG`13<?CKmYezOU9bReZ4oqfq?~qfgrM<h5;Z(kWi3N
z!>WuKAcM$)m575Z`PM|gaImm40!T^HAuwl5ZXnJ?N&_QZSQr@tWuHs}DD43vt>Wq0
z;;r!DfY*N6QF9@!m@~ti?jQUB(pj|d???a)Ks5*&h$u)b$S^1X)ETr93=eD>92Ptk
z{2ihm5(QEjN*3xJ+8jCtdK>x$79N%sRv$JVb{%dI9ua;VAp+48u@lMk2gZ+8<aHEs
z6it+BlzmiM)Iv0Bv{H0?3@i*yj8cqE%pX{_*rGT%IE*-&IP<ubxa+u|c*=MIc*8&O
ze=7gX#;3&hA)qCQA($n^Bm6};N(4(3MAS_TP0URkL_$fTO43jAPO3|qN`_CSNY+aB
zPR>i7PQFV1K!HNRPEkp*P6<tE{eSZ>X|`ytXa)cgXB>kVq>4!(BnM!IfCT=R>n2r&
zXj~37e|?@cI;&I^%EM9-s;r?HR1YFnE;=cfaea0pqO>4hl9`AY3E_Fu^m&mut_PC`
zlz)FI=^j>H1cYYz9#@}pS)c4L!t4t0#qSpu-rl?wAOkvzW{kjZpCP)D<8~3Rh_{1%
zU#Rz(#`7q6h2GuzId)BIVRk|kb~i$v_her9_rPAz{G?tm@CL47cJM!VGf91*N4$HC
zljjaeHqpKP$$5ijhB0BT`}SV4LPjY4vu?m|<6w3IIu3SFx?zmpCHmiX$)R8fdT&i{
zT;TNO{Ul$WUM>%7LXh^3`aA@>Q19Q6<OegRb8gMC2T>0yotP~bO!phBhuY{Xc8A*T
z#=Dfno@D8>r-#-SPF$SMx?n$bQ|#!rp8A>(g}LH#hj@9suoO-ibGsBvl!U#B#2o7t
zX-@Uw8qf-q)9z?;tmq<L8tUuk#w~b~YJ_X!%p0oD>z5pJ3#MovmXqbz%k${uP~UA$
zu5@f{s$hknGCa++>k_*xyZT8PnNXq)MX!?Kt*K!z?daah;^l}c7d$hIqWWtd`l(yy
ziSj$dX2ce`H4t9=!5Ct2dlQLeTV$H1(d_X51f@%CP_4m(xRSI>pDdM3a>JKrb=t$(
zE^vD<EOv3uKZj`3F{b_I{`I2RT&e%>51RaIKn}4w2gs<;<vA0JV=<GoB8_$60#*~F
zo(is(u9<>(d2*36d{}=ILNh|4qAK~RYI(B;_K=Y+uvi{JD120*1QW+)x_ZaX6AJX$
zkpRCJrjTVeJ{SxPe}@b_nNR5OW_p2IsSuehes7Fw@dcVwLJI~x*K3>VoqEwP*d{P@
zX4XE?`%aE2cVA#4`;yNl@uybGY@tA8=1N^_>@>v5p31bURhS!pr!kMFezSMq8kR1^
znW7rXPA@zfrJhr2jgmO+oYYWz#|w?u4smd>d+ZMS71?odM%9G@qXI8fGJg;@|4#vI
zp!W{HjFWkU_mgrxK{WoaWcoE+HJ%OZEthEwp2D^`V>_WP{~<OQ^TH8_iA^zbVv}I@
zF?fwj#o#kV#v$LnU#UFX4IwZ2oT)shcK3&3C0(XFsc+J3Q2Znn5GPEog~w5&)}u7q
zo>xH|iL@(hvNcO;6K|k)&YKDuHJtZMSFS%#K44iDj7NBnTCa{PWl|E|W0x9vJ%;43
z#{QVQh5(;$WKi2BJ1_3=U0!N7?K?3q%0x2`xDZd}5gOVnf{1|b`f&_X05udF7(9no
zh(m#8?fl|{afF?5q^aCaX0@m{<9VElsMe#brFt?m9#@wekxaIoL;u{lmzmY#Y1>XD
z4pE9!D?iE|2$rATZvvZ_Js`|ioU#9V$C?9zzx?2j;L{1w0aS6Ibe`E8z4=qMkqJps
zSx%^!5u4LXnYh*!<Glr4IXrBuLJE+B`;j-bv+>|{o;g!ZN1;Nr{6EpLk@0^-8^{Z%
z$AJx^>>liyT7cAn_W=e`))@;3djX@ytJBaNnK1UOESr`Xt#g%*MQewo1>y|@zmEfO
er(igKB{7n8JV8Q2tgOqzU;+j~C~>|o;Qs-XKvXvX

diff --git a/packages/icons/fonts/fabric-icons-9-8ab77260.woff b/packages/icons/fonts/fabric-icons-9-8ab77260.woff
new file mode 100644
index 0000000000000000000000000000000000000000..cf100875b14075407ee56c40e0fa926190e3ab1a
GIT binary patch
literal 12344
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

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-9-a362212c.woff b/packages/icons/fonts/fabric-icons-9-a362212c.woff
deleted file mode 100644
index 5e56c03eae426c42d53285af2bc8b615810c0746..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 11244
zcmZ8{b8sbJwDpZ`+rGg}Y-?iMww+8k!Nj(0+nHo?V{2mD_LtxH-e2!jtv<b0t$j|{
z?yg;3r?!WJgaiN#@HH6D0LcH%>dOFdPnG}f{_jvwVg3#PfQfzSQeQCShx86Gu`_b~
z(xSc)3;;lWFIUbnGI4h$1ppvWzdT<vfF5oIuGZYq!tP6B`Qle!UahyBgBS}Vm#<jJ
z|2&BQAFu!d3tKPqFAWF)kmUjZB3-;=oB5VzMy3D&)%cg^YkvU8TZ8q0<(CKmP=8SX
z))y#I!C)aQ?OZ*-G~6$)@P$c2b@&%s2b2GNmS6n8_;JNUV-Y(e&#!%H*uFUN7f1nn
z;4Jn=c4l9i>en+q003|=(dk$6jt(xaUwM)J@?iew`&0s~IXatt#WEOv@rW<Xd3N6*
zduEv!8h!S21qLPu2D)KaeuIE0WD7Cx0mc2L9PA$*9Rdx)LL&;1_5}cX`r+Xbk#isX
z9(Dn@WRwt^L<k|JeSH7`8W|kBXVyZ3mkg#N=Fld~H`H-5G<rtX((iLXmrb|%SzUV6
zAX3;MAy{zXuj_Gea&e18%W_YKxmjedjk<&!=R5Q}tLyglr1RxIktbP*rKSKk8T!Y7
zu|+&p4|&G+qa!YSecT@K5chx&2iGX+8<TUynC>?HQrjewy>sMhluKCW+O7Zw-xgV{
z=Qu{rP1Ir67FDh11f@foaYpO-Rm`KWVM?s;4y!>LM3h%gLmy|)ZLs*yo6Mwro&032
zb~VjnHLd0a&FTfMZg$N=cCALL>LKmw3HMcEn^xpio9soi^+l6cTYq{ik$)JJe8R`Q
zG}Cy^){2Zg)kX5<S~LqqVC)qJNId!8L>k#Is+A@cGfHZw;T5i$$vj2yM5^uHY9$c#
zYO(I+Dpb}>^37IZ4h#>Bt9~7zQuuD4Ob@KK&V>bE3!Nq{xP7bO!jN5EyIF5Zt(xjZ
z3A2ud(e*axrrGSYMY;-GD6=7dD?48$n-u@0PrZ1}4uiOl7YOt{Wo*FLyPP(LHKR4O
zG}Igd^)2_E^?3&LgGIuk0ss|+Fv*@-da=Foe}oYKx==QS&<OF6WxLUfCWmJqhssdS
zQ&Axv76;7#D7p+t`ZWYGwPTNWYYaP%_QBNBJN4q*>r(nW;_IGOEJ;tNp2fMHH;;gP
za-RPFOr~(jVP+(|;HCa()^810U?Y!nFIQ&?n!ZnwwIe2J$zn849g4Y{b({^AKd}S2
zm-P-4?Wpl33{ixjZz^2-MajH01Jy(4BB`q&9`ze<%fMuZOfWp}@KOCiMS^Y?7`wLI
zW~+VjE<s|squ`HX86mGSvHtgY37?^_cA(x$;d{BYJM6nKqyC_}{8WooML2xJXXKDK
z)4u>P05|{^0RQ<3K=I6)@PYFrSZMz2W=)XzZMV_@9I3B1V@uhiO2N@e@ffoq<dxq!
zTXxzBflNSc7!GU+grlSs3PAOIqq{?c4@ptZ`(y&{H>=@nG3q__@I5g<r<Rx<Ghp_#
z2ua&o-3T5|f>N-C;m&<FA8jYrcs(w<T@Kb<rk=B1E>UCnq{A=benwr1ky09?F$&C(
z3ykz)`RDiu%t+pu?0T%#>WFQ{?npl=KE>hYmsnyjk|DTdZ7axu8VrdN%(4kdu${x|
z@L?9rDBMS0il=LdU)U2|#Nwtz<Awg3bpsVZSDsZ<C-9W9Qbh?1t?A`Ljog-|aI=6c
ztLVtaeLTpD)>-wFGK8fUDrQ}Hv>%9+4cu{_a>!b{wYU+D>pnTS`am7ULw77Hk<s|(
zHRi1DKP}3w?S}Hk`H!$Pw>SQ{m389hBHdY@!x_xe)fnGtItLI&!TqK!8N1_O+Z&I%
zCiaoj@@CMOXUHG|<kQ*WhfLFS5nK=2+v3)ZN)k9hzlIz^%BvL!3vI6Q_(f8BZ5$wJ
zeO8OcaC7UiM&9{W7MChvJBDEs6m~Z>>yj7s3UyA{uB^jqprhx6_`#KwLWIcPR)e31
zV7>P}hR3B2_W1Q)pTpJUrNjEmJ1@*JFX2Zup4S@!Kfi&eub9kcjaGAQp)+lsD-Ndf
zJJhdyHJ|H*QK)2PeINc>hGRUqF+QbE)lLik?%-_WL%0Hga0<Hh2Gt1nGaWS*O(6qh
z#CK{I)s=b=wX!<E@H(5_8mkmXJvs~>r9G~Oh@J6rkTV3#FBeM8l&7Y7slP^S3!;HN
zn0TMF$`FKo7@$))Y}%XobRiYDEZBOq_$Mj4a?*t>*Dyv>E=u|`N=-^Ga%yc8nEZsU
z4@Wy9k{}T-TGcDC>JCfbgX!z-52L6=jOkoHd1J!uJ@DRM0CMj*NGQYAlkcwZ(ErUe
zspoNb5D)d7Yun81NfLg$#;AE)(eyso<Z@t7-~5I$j_`XbSD=J66=K`&oTxgabZlE$
zaB|;SU^xUM6TpJ0t}$@XOkp0P7h#%cl7T-RU>%^Jry05(jqy@R*gCW`xn03+h@HL@
zi)f-Oej?3qOxk^Ai@F*Yz7v7zIl&Wwgek>_Q@~!WO9_%GKsq)IDK9rgxQ@zPvlRC!
zD{7jZ$Yn(Q;pM!xTLWZ-Yu2D8Hr3C;1QuD`M(W8&4jt1^YVh%p$_MhQmYkV!1??jI
zkcg`m-ymmbk?M=ALzrfP4tm!orH-WFT{Ze9JQspE5s-_?Q$S1TC}%b=Pj{(-;IJ%P
zP;`3RMG@r>f^INO^rfxT<{9I?VcB5qqUaCYx}FGFGu59c?lLEwpP@2v$+{Mo&r#G+
z#&nK@h`Ut2&sJp45ZVurn9<tir(Qs|#L4Cu689ia32zs7t0>eKM#?LeD8Tk0u@rx{
z;-9YO_&r9KtU2n+3w9Gt*FnTh4LS_)wnfq=z8H>Qp6^((*26$bqg6a*nSpJYQJYKd
zOmd*zTo%`8z|ghk7hB1;Y8|-~ko$LAFEdI@%azck|9l1OCv{HYv>89>p5Y_5GI&4$
zf@)%*M4R5W1My}@jy3N)nak67MFtZ(GPNc%Kog$?gejUsZ*;h-&%-+&f%N9D9>!W3
zH62&S92j;z){CQPYRk53n7d#9?Y<Vw_{H`<T%;=BIHl83Q>53&FK%-`7r1NdE1+K$
zz}<Hz-gPp|@lK9w9q%>N{aG0iz7O<&qpXd$m?>)NAH0Tk%V?6@#f-g$l1z;y`na1o
zM0Rx}^1PT(Kq)<Ve0!BavA40`c-WHp?4h9&{L7!LDSj?GO8#<AM$z7uogt{eWL>`R
zwRJ0LbJTdZ!k(LJ&yW@b!1}XuSkh?`{!>SbP3$~EZB4}=VZ8&xCaHLImYq!_N1`?J
zZd{1dQrE^#uP8Y;YnN<ZpS}vPhPGo8_VM!91*W4Dh41mN0gBwdpdXa!^cf=1_Ig3T
zxwq2hQ>}S8n?3udzeV)i=Jd>#pgko{Gk4X&u<&cr3r|+ybL1kMk<1wwfiX<+Ov%B<
zcFNJv&8!!cujD;K2N$B{jZ5PPui*>;I`8~R2MT)CS*o>aqFQ!ZB|yy=ky0@fy>B^v
z)`@_s?8fa+7RpQb7>|hGC?38Xgb~*%h6N@`^2~#>fiD-)k8eJRQ`kLK{GEwWaeAhL
zil{#dNn@Q7lu%(ipW-SG<11O-+{2L2O4H{=u>!ckkP@vMgy*7y6vQtff#&~sDTz_o
zT-hOgC*FI`5|sVb&7JZFjTx{1Y1Q|71@4{D0mHq4RQfQz)P;FPN0q}I|76aqH9W9z
z9(Ctt8hTWe1&~`(wOnKh`n_hHb@Z(WJhY#m@ssi3NJ_t%yd{I@4y$aas?SiSyNQ%I
z>6NgnOzUJl{}O2JtSawnnz2A@2(4Zbk)H`x*3jwpyA0S+T=chdS#24*J-9che3P!a
zWM<S_CY6qU4-_&eqy+99(CP1)I`bXI0fhq9@-7b(llQC}lFuM7HrTia&M1{_{yi0B
zNl>P4{LbSe#k2K7Ch2=b-5LxxEx{brfQ7nO7mF2vWq4-j2fzTTp8H(j7OvxhZ2<RG
z0w66B33Zx1%F_Km{+{l;e=R;8xzhjfxiF@KKN8cJ?jLks7AKJ$dhG|yJbjz;w`Fr4
zJQ<yuU~}%>k2=r|JB{Tl_Ww3u(Ds%>#SxZ=2;|Xxn9_1c8i};!fO!At3vAH1=SV*N
zLqCRLp`06b9CB7=Yg;z?ZHbLdy@R%3q~+nE#S+tH#!{z~=Eqb=Mc!}j%8vZ<(PGfK
z9sOQN?pp7hN@wB6r?>mVxzt*xVJS@$#Z50Cueazcth0a{A}~PxAVIhxdQGZFVgv9Y
zLpLjTkItpwcoooG)n~bt6WNRI1oMV`t_rz1+N`v|fEXM`%Mu&ed@DCeBzPxY`nX^B
zyb$5?%)??dTZ#bTapfTwGo*g%$f1gv><(lYD=(uT8>KH#OSM6GIY^OwE!;OF3I?0X
zn_Ez^%|6T>gVLz!DRC~cn<g&9i4{2)i1i;@_V%}%=5HNL7kwQ(`D;D1IlYU`yEf@Q
z0>suD$_T|*`t91LGr-QMRRfOj4qmx$bMz3NT|-`tjcrtY(2<cM>mke}3>Kcd6G0DA
ziW;p;>bygr$uMR-Hl9L{|J&xDjI(PAaBi`x%eIhA1L&IkV`DU?!q6u|4YXl8hUUzl
zvR|3RdB}WzLW_*Edgql)rm<Z|ahVA0u3S5<?-;u!X~J2y&B+K5Jo{#mCTWMPSHi!f
zpB82|)NI`1ra5o1;@qSi`0q}8fl8%W=;xg*Gk6Td@d%l_GIS#sw~c7UR$AFFc;o<r
zm!{*&(m*NFpo@?o3W<5LxjzAPOSuC4MOh_Scj*Z^+NqV;`HV7N^4$E8oKAmfA(c8t
zS@vbu;D@FQc3zTBfYIf0(-%rwPnE*ZdUGQG;OgaZR5A|^R#ls2pW{fc6OxJIQF(>#
zu2IDzP~t0dJU=&j{Esd=9A-8y*OnLCUTs!21U6cq+7~?DE@80o(C>5iKfPuiK3M%$
zUw`JlhIJ@73m&h|Jf8kqefgPN%J-_i>+mGFc7NT<xuT2m>KE+sY596^xxukj+g3Tw
z?tJ3mTJ3Bv=9Sf85`r&z<h@TxOfkwmVEpZ<_m7WhUnZom4Z1c?J{kN~Y6tDY0cD+j
z<lm<zuYqKhQ`5<Tb~!KCIqBjZr{W7tqV&Y#*QKMyp4pmp6rjpQ(P{^Zz4c0`IQR2D
z$kM^e>QGH>^R4wo4uN5S!Gq&x;+TW&mSA?kOl;=wljGsPC;fIr8tVee)ifK=ywELz
z^y=7R>Ku~ZW5DaIpqB-^^-59oV)qP#IAKDeN6MP%yQqw2IA?TLM^oeP!&Iz4tku=O
zO*rAMe%p$O5XT5ti!=&Qa7=gNn_SN~oi(6aKsgeehd%#gGz`Z6;PRVByiqDXl-e<P
ziqVn?r$7N?T*7BDpDtGduPw<HH^EQ9C8di*x#pyO<jY$t>=aHoutR1)(^+D>DozZ(
zz^Y8e<Vvmi`n}a(GQiXBu^VpL&ktl4XqsmC|7oFg+U<8M0c{-siYV+L$U%AFiu~h}
ztyk&6gqsY*=i-b2RKQ8%adAGlXJ257kvJ&~*6~&+(cC$dYd;ts>sq|g=g2kkg-m~r
zb{EoOSBV#{gT@bqdWKVg!*X1PcYs#MOtX$>@w9Avf0GPdi|Egvi+AG>^n%F5=cxYG
zegv#KfwkT4`B-7!WJ^Qz4c+cMMHjWMbNYOawLg?LGF5XKlghLxr<&GQTGY%c)Ro*+
zkvH43Fz5b$RHt0j^=Bt#36=!he;ra+53!d;4<ejkH$K67=bLxHT>mx%$s(9C*0w!6
zFXP<<jsmV{A(f2QVkMAM=isQl(_h44<T~w+H+e3P?jrGWw<QJmaLXx=`m^mk((a;+
zRezxO;sSjYxoM~u`n!Ln1F7Qg6RV?;NlvE&Na<*c6=^UhH0E+>B8aS8m?jqNxnJ9H
zNN5yLvn+AH$ZLB|LGx1hKA4E&AfW4jG5VQ;q$v--v-UhE8x}W~)DBS}rw$Wp)IY^6
zA>2kO7V*d#Tws!(TQ~5xcC^yG0XBD{(tHnv{=FaVjB&`wvZ0|ey7Fci5y(IDz~7|e
zZ=6av%$fYYlLY_NBzPpr=$vJU4o<iP*_$S<PGm3tsBf~FDG9g8N1!hjtuSyK1+ssr
z0>Q|4deS^a_$_N+9TiV$A(e$nr|jr(AY&)wyMV$_jI=58Q?N^THQ&66rJh(~zc|9%
zq^^~)4FDp1QrCfG?<i42+cUc@|5uMLCUF@aNi`lU&J1%55r?bCnU<1Xx3PjGCyi+h
zqH7_}5)rNgd@Ql{xEiAX8$R@T=iI?4Yj$k<jV{N#mVaO&7i(`tek(jgy1$RW_Hl2!
zd=0L?qE@?Mn@CT}0iQ@MLiN9;jUETJa0;`rF^W~|^=AG+A%*JK;Dy+ACqJj_dk?;r
zmtZbB`0+-~1E}9=0-@K~#w?N(EY4=*!}FLhQpnj2BGm2^)bx`k-tK!Ok1dbuck>;k
z#CiFX-3&JLDYg!uDcc02)1QhQ{Bn9FXWXG{+^#voHMrb8*BN0gA<5+Y(zY%w2CJO@
zek#H{7#AN;pGx3&ay`InQ5$J}{fOjKsW}^L#(#XpOG1*ny~I(Xkg;)n$il{9nEenJ
zvgIvp=jJcrH#*kJ0)?07Y?t(F4jUwzgt!b^stv3@k~7imCR7lC^?iN)1X-^tSZght
z4r6CLv-b*DFe8sWkKMPDu#Ly%cUoF!QiU<!Bg^oAWU$2<S7gZf{@rP0F~fATZ>$_C
zb*4UN>P)Pvcxh6Z8V`Qfi!8HDU~v6Wsgld%N+ze(eiW59kW%n6oFqu{8mK?*ME$N1
zL+iiip~0kUaGNTaTyw;9X`{ndK#1!a`sVKAw7<4}s=JLYsU%+L!<DQOk?PEc9XUL3
zPYJ3$O%;dtO3+!<T5n%8>Ua@oY#i9V<CTrb&CE_Vb~4+}ik<u0mgJfUMd!eJY&jM3
zc$6Ibdek6lQ$dk=p|4k8GT!T}?`qOIwc69t?k%Ua;O4qMS+y>Uj{WTP=8;FKDMSr!
z@*&=OrjQ&03M~v~P_VU|Z2H-6#C*9qJKL7uI;d1<Q<EHO5r-0kUvBFOb&!}0{JR1P
zgb_}2{&jRHjB{uBS};5A(=CHs?a_>h)pWhWnipmEr?CJr=5(#CHI(^xZ|mL2pRs7I
zN6p6PGH7ldjmr*aQ2tBaz*O_{4`;@TK-YNwz4}OF;5dRAF|Bu@rOVb(ma3Qo3*7p(
zACWetc-lg3lR<=uRqhRt8F`4(PsZ!r`^ENsN3rLI$lmJfOE8oZpQ{KZR~W01{C<#v
ziIvh`%||1(ol>VdJA24@fu^_qVLOsN{M%QKzo2sg&wlELtNKp5yro$kUWmPXiB+XJ
z2B;9P7L8xT6K!j}+b~OXSNjoDDPnf(6QnWG{KPAHVk3Ew+AY9&)Vxw;_%rp7RjbVQ
z>@2i{yZHlqjIUk^1@op=tJk0X!0;rK(PhOd&Q-=|amDJEs;Zxh*7SG%-v+sYkQ0E$
z6wgKBo>KKZ5aJ9Sfo;&m-oI48E47%K%pnJ6!H`T3gS*mum?&xC^#~Ck6e{jT+So4U
z;yvacO8Om!-Cu1SZhJYE%(khF;$>?`%s_w?xj6B3=%M^Je|Rsi#g_~tGG|Du(*fps
z;-CSN_zhs|KUAJl8hjSxupBbz*1Bo`vDB~VSaaID&jS$;v317DJ?370PNo*lKeomy
zJ^6<T)NfEe>@OW2_^Os}vxNN<d;pgh&%0?&8B5oMQ?)z7iN$}nCYRbP@ZpcEM_VeA
zl?0h>S@5_Gc4BIOCKIUaMQ|^2yN^Ns`W7bRpdPrQYgp2o(`7fxI^Y04OlzV2HlGo6
zIx0;CXLZV$Z7M)UZJjt^dyhIp?+B-{)D&D&<Qn=t#n?s4&4O+53PgNRN)ZZ0W(Gs0
z;^nqr7pf|!I6npA+H!V&Qv*hodY+uD-nq3UX?kq!NVT5$H*i&Yj->HDjwZ2sA7A<C
z<{-M34lOURgEOWO&l;bW^?M@4S<67os-9^a7R~w>vIiX@-q{c$S`qF;Y?;4D+pyZQ
zOM8(lrF^h1nb(Bd-%UEDt318g7`3Gob=B4Y-@9#${D(VeR*Rk5?+0b7edwKZTTBaH
zAFKR!ZpNFM6_$#RVMJM8XAkuv#-`B^t;lOekLI;2*${?V&;i3$u@lP4fA>>$X_mYa
zPgg_tGTNbVTJM!8a~Y#OzJIsSHc(jLJ<0H`_^qUIpt1mWaaynvVCNCI0ev1NGNvxF
zvK?Ua9t@XxarYEFI=kN_?iKn0^Vl!;>nE$9d;5(_hb&5-kov`nP@|Ix!g{mtb7R(y
zOWyc>qMJq?y5}{#>_34}8PG~<%g5QV2?0fX^l;9{%HsUnj)_i2W-Fmi*PguWrEWsY
zp>SK#a&{{7h3v%X-aPU(SOlKCRNSY8kK&ze>j+e+(~)V;N4Jk6^&=Br{|<&7XPm;6
zF8R?bA0e*a;Rv^#3_8B{d(pU4TWZY6x$k$r{eIR%au5tqr3d=A$Y6r;sH5N95U=*L
zE7&(NCldS%7n|j-u5Y_1skvPYy1gx9u~cma6PwK~#I;T)go}3`HPPcM591Cf<{V6&
zEo64zgd`Itz}Ia~ktPUYnKb_9?HoV@|1jZmFx!mpu`V?11=s#+2=4VWU(EvjlkXLo
zO+_%@B(acNCBXqO4`!su+sCk$fwI7on_M5xokE5gHAGYu?-7(C+wj<;7R2h?1vt<W
z+c&9naV125K`OjPu{xC$ovS}un_HLBWa^J#%YAGm+fPvDnn+SBE$JygaUUnbl$>)U
z#~UQ-$P3S_bz7LZB%NCnw+R4f{}@AB?JH!zT1wTOn7Ub<w#PoHX!|iV!d3N{8d;-v
zCAyFx!?j;;C#5(iXjo^>$!48&1m@kqr-Ks@P_<LJF#GIW!aLhL)wF|r^*P4T<BPcr
zuy}WTI`Am%7pED<hbZOJDN~mtVuvb1R4bMP$n#T66vBY25u$F&7{7ZX74aoxH2kf8
zaPQ|`EK(L@z=(WWliol&T5%*GRT%UiO_=;N;9gE-`+W_LoC~eaB-aXNm-pil3S2!>
zG?zm-ja^J|iUr}mBhxe|v*3f|KK5_^9`<}R%NWzJ$2#Sv9I3cIdR7uNrEaFc01!h8
z3yvR*h#ABZX~;B%U2376k6t!W90Gnv!-SEc5Rby1a!hs`r<`1`Awtv0V4KTCf#G|)
zA_lI8Sm)r}L!rYgL!li<JB>>LYYC_)<*UfU#<GmTz*jToQS@!=Wh36#|D4NhTUvPT
z0oYC=Ob-TChwT0BhaKbUv+X9O!441t#<k-tM;N2IHt#ZeJG?P&jD5e`XiXyO;zV9)
zjWhV?ZN<HHV&4!K1>TD&zlM9!N2;Y4A|87}4m>kaT51w<7S{<cIhzu$lo-P2#G?8(
z`$N?DMXq!XyX?_iqjmhzBUXBCs;J&xibPa2T57PgOOtDpWb<&oJ6hawrkSli!W>gm
zP&O+*`D#HTHd&q4SsUvEXXZlRU%|z#MU|w^gPqgEjh&TL7<FrUL!>kmsJwa{e*cFx
zr7O~*$k2_se9o9HPfzO!I3)NTwucSEe*S^|k-x?F-J{ppQBH0mBiP{i!kaxekw`Gz
zypZmqD#++vEswIfBm>2+%KM!BHj{cYofJ;-sL+-s5ae#an??q4WxF##jeO6mt@bOM
z#&MqvySNWIJvbzGsL)Uyq5Kkzo@V24i|<-M8|foZlkKBta<V&iJ7h36UwrlUEjBOq
z5kN2({O?0gSHYeXqK|@?rI-tRO4h@V#$<%P@`<f}3*<KMIK@Bjm>tBh)VAQkd~vYJ
z`&=K;QR{J)Q(axHbBQNgVx^eopxf!R`|qi;4ALv%rCQip-$M2rd~OhlHNe2$S^fyO
zqb}VtP5dZ|68V$oNf5?EgS4Ar$H9?Of3mm#fF|-*xD#8>T6v#>DyaWgn%Hw9nra$z
zh5-8V4^w6Qc;e8>L?}!L92u&0itT%ag$4d*VjE4cx*hl6qBrVIO0Ve0jE;I!Pe(`G
zOYha}3gUu2^KEcLLz?lQ3G)%geS^}r3>@f(B`n$11?dg%D}joGV)qsv-QJtO-+YUC
zN(M0%)q6*$44gJAJ8S&y4A(mXmm12*)1t2vuM;I2^9C)WB%tsvIWLeuS@jv1Lp?Z+
zab#d5Bw<qiniUS=`X`b6+7qYxQJB%)pM4iJeip3~so;d%a*CoE`WGW0LELsfFdg%p
z)|v=`Cbd=4I_tW#pTm7)R@I|S5{wJ4x04pridhnB)upWFI7MD4u0gGe9^4YvT>^8M
zQ%x1D37<w>tw0Uswx~knlLeENkg`tieK0M?OU*&;*6Av5#1AXnzyFRw`;I`=x56PR
zEZ*;srN4?Z49$wMa0I1?)pOwKJ=78kw~QFmiIhF|Mqgn7YoEgt-66Y}z)IH5Dvt`~
zk^QywrP>AHz!vA;GMSj=7=z!5L26*9C#8oggfleGTKbFe%9!7?N{+c8Dd^PJYX48x
z8e0Pc`U?B3D+fXsgH6g$%%O_Mz9mT+k2Pms;Z6S5Gg_kemq2|r5hXue(xb{FGI9T3
z6xFByx;Gx&s;8fTt_7*}*0z5zUU_vSSH<i7nwnicF$j#u$&&VQZ)K0#j17C>yg#Ct
zrvOuzgRK#e<hGN`L}+1s*!gO-SVbo`(p<-mnW8!U2Zj--hO4B_9_(B2tpVivVXx-{
zZQMZ?6WZ<6+Azqr2#5@h045Q3<axa+03l~*aAf-hVMjUmA2lpar1j&S_K(EiV47F%
zoYa}<1R^se{ZqoxR<YI0uu=M~90KC^krYNjuRDp>#sb^2cK&|@bKL3<qUoX%oa6el
z(>*p`%~3ob<$q}834g+~ck6chYWRpoko{YAw>>Hm($d;0$v3g<)^cIx*RQ2<srepo
zp$$B+Ly!(#%q$%09_onM{lh>UDrxU<V!PsLUDfS(HvczevgG_~I!ptR<Z@cL_-LXU
znr{9edMIx3g1W|iKj%RckpwTA9IjsTH7B`QSB3LMOH8MgCD{LP&Q)7Eg{31w)t*%K
z9}XhGfGc5M=&2p_OS&5}<9S@^t!10mPt(wawA^DRU!j7F+X<gu=~T%q@g&%huHM+{
z;C-(xlZui2?U=y2>^fROKVEB(p7G@Mpj7ct4y3R(FAc(HDhwDyBq|CCS=qott&bbB
zi5s=-D;<?@<Jd77pw`+V{`nY+hLQ_bEFOpCmHymp?jqMy+?O^zWu@6ujMi-z+^}Rh
zQKz9fz7T_08R(<-d(jhV)Q*p34YfEaGmg%q$w*WI4qhzYMF7(&q>znxjM?GqsDyF+
z>6CgYp6kl@H^>>gwawCmGnm14wN?-n4)&~QGB#k#kmg=SpdZbM25W<x9E=YSkU;wl
z`ySctWxgr6_kb@Cq;tL7kxI@S(I2>q9Rvg3`>PcRQk)iiCHFZdaGLdczDAQWhnQ%X
z9f8}4tvZvzt8e}%K)09~pimTSWQo=%2~VIXaeoY8_e(S*@gv@PK(VwCk(UhA<pJ$&
z$Vp~*w%ImSNAx-#&}CK^qm({MS`4I*;1=rNZZYoY;wpi$(LNQ7-^0XWR>g}jIfO0q
zDaNYuhOj1ByN9QiR-p=J68+fOB;2c7fT7;BF6i12^Wzie<F4>re)P#v5=$<;11d{Q
z#VDgD;zc%7n`#4l(W~Zu%Se{Y<x?Qt*iLAxyyJvvSil+j134x$c|G(C%ZlHc*-gS?
zA0J5syLw+dFBNKgKT5m*HqocTxeI0}Cl_D8QdH{j<)kdcXTpSqLbsRBF|hR9$fio;
zXMn+sfnQEo%n2#NY+#)vsE-bd*r+oyU-JL_)JS3Eda5?)>0CPBc)eimb#v@*s9p2#
z@)+WbqO7cIVp%>KQ3b)7y#+5Bcowm8w%*3$=zj*_%R5re&EZCcEZh@g?*btNOH90z
z&@t03b2|Xy)MOiZ1q=PYMlH8p@&<+Ne;uvDOFGE$A|6>2o=fn}Mo^B{utG6LGcg49
z;xpg$lVYt6GMwkYBkYx2X>Q}2pS>BjLbwR)_dLo+9;|J1pGO;767mMFoC30O@*H)c
zyKv{mQm-P(rF&^Z<o!dQ#g%87jW@fU&#HzsO%VCWrhyT-JnO!Qs5_mb=~KJdXgpTT
zhc@n`2^M`@p3d<AK~C{N2>>-Y=ATu4e+08FgkC`3RIQsB(!x?IElZ&CJ5GR?B@=@<
z552nj@6kfz{RETDOn$0+;GhGgb&;S`OHodu$~sBfs-;b3-GUaM8oPr)i&zcwHs493
zc?^UiZ*VwxhJe427|b$>;f=A86dYp_Y#pZ^wen1++)x~@P*l!O6;B^+Qqq|$VpxEO
zUr%oD9QU@YMjr}8F1DuNp6~Z}PDDuB(qn%o(tx~QaPiFp%uRkOF3a*Cd@ZA5qE{&N
zN~VG&x-OlT(Co8O7D)=dpmuaY6?cZt`#;y8(*9gdNgt@QKFRC4GhlAQ!N1aXBA*--
zx{7aiz^KYdghTs`0uP};^v)q&eeN#MLEeKrXll3Zcd!AFjw9BZcppvZ5es(xM8QvU
zI-eNUSM?XGon3!UCA=Bvy(Jfsd^+tfd)kVOhd&5B?5@nTz6<3-y)IRgT)PvV1mt>{
zzIS|(IvjilY7KoIA2@wJZ22qc@sEt76Aq~{zGGp%GpY?ClQFn>OZSj5sBokaZR9ch
zNf}9R!|4A|2TqQIKx}(B8qE(d3PMgLjDN81c*ddk6PoK+8EW}eHa|&tBusbz>s>K4
zH8eD=fZgD7BT?b&ozQ@`M}|gS{(Llq2=C$9zm`Ou=m%gQni_&D0rV!}*8u+;vt<YX
z;~D`4z^4JgM*&1%jZI%`Ef{P5?f+`+LWKQlg9(7c-$DhaW*IlO>`OA+1I*zgE{_`q
zgnuVLLxmP;<3jZm(VK?FHi4{!8es=mQK#{P?0<EvrNx5*QkGGyzE%Wa1AqV#KnfTw
zm^D}r*bBHd_&*4I2o?x!2zQ7@NK{B$NDve)R0z}nv@Hx1tUPQH94wqUTmsxOJO_L@
z{44?w!cRnP!~(<{Bp^}}GB~m$iZV(DDkW+T>OV9dv=p=(bXD{y^ilLJ3~&q}MinL@
zCLd-S<_i`smLb+ptQ4#otS4+m>?Ryo9BmwToIG55Tu<B%JbF9{yd1nU{O|bY_~H0B
z1T_R#gw%xYgfB$;MD9ctM9akL#4*HIB#<N$Bt@hwq?Tm*|C?tiv$nsaeE{$%!vutI
z6<i8oSpYQ;IQD<JYgSc=B;dsK*XLbfv`Rsz-76EN%N&Zr@E~L3W|Vdr)#orGOAX?q
zm<o@Q6qz+mn-z`azB9Q)KPshVyjyk=6rSS0Uw+JCd$2zXwaX`#xSgAOef3d*4(KeL
zGJ?E*gz7<y-9o+~-w5`5qTl{DnoGkc{N^^mxn)uZw;7_awHorcE%PL>4e^BeQ~C*;
z@XsaOCh<F82Bk0TuurdX(##&k8kUbgHDA!wUmUp0{_UsCkYQT?%qz(2Sh&rA&fQJ)
z9ysGS$${4`Y8W_@zH8Gf7X*FzpHfc`Pv?8JAt>AX{T_nd7`Lw|@`LG<+1KWHgBZJ2
zPTwu(Om~`UhT54bw}#qpM!S{7A7q)bCWlt$4qcp1y5T=`lkFJSANpJNM7U#fhWL2B
za21YOa=I0Zl|+2V#2p(H8IJW48Zq;gQ*Riutr#O*8XFpBMlE;~Yeni}%^Pb@8x|aM
z@+W|Ii%IhTDsma+Fy3rUE_7^cs^NuU(ml<z>l3;yy9X#)zM)4Nid`fjTGPXy+cCbD
z$H|dZ&3R@N{vN2k8=!BUCClp+pAw(v(Lj10fMAXy=u04%ZIx-B#Iz$W2}+Y(rCUJ+
zbEW9`akx-C&VyKy*=3JlJICWQH{Z=Q`xv6l$dVe(<Nc)AQl)=Xf+_zTkWH@62?p{#
zKmEq)SoH0OB7=3{9Bwm<o(h4Mu9<>FMN*+NV(36KQVUXnqAK;VYDJ3%-jI>)OOZU1
za2QCT7zf{FvS!oH69)Xik%YJpu7GtqE*JuWc#{e;iC=i{YI2TVsQ`^VZhM4o{t1>#
zQVR|%$7_S`jeh=TuuWjb)U<t|&yC!-oE^cjtaE;w1R|~E=>oxsjHUXvm`SL^ZIww?
zt57$AE@NIz{T8486<l4Y6Gb)j%|1j-T0N(fS|thKjPy`P=M#h1CV6nMd(0-*1=T@O
zdi9wBivk}^l0Xoi0FfZxi_fNjjFWk|&x3LUNhGm%64MHS8t*FJy2~UsZ$W#kv7K<Y
z{}4NzdBL#5*qS&sxk)g`2%^ThV(^I~%aC8ccM9)DW5`n;R|+qN-R+)uakuGa%Igny
z7y*h(sKalr1qZ)D)*uFL&x@ed1mF_8Z0&;D*ekf5^O{0>E!XY03s<7UcX&1h<6*x2
zwu^%*ndAibn1v=jk0JSskrH#)keA0R8H^68uCp6rm#5k_`!1Zba<TMXZscQmq{fcQ
zAhH*C{aEG+fEv0D9HB!S)Slp?c3#o$DAMLA%0y1rceUTI#<Td9zuWdR7aFL{cwJqt
zL^Ieo_xy8ao~D+ICT+V=IK^mEtbWpNLa`G0yb7+J_kw-D;EMU5T51jm{``r!kC;Y^
z1)z%sXY|Zk?aP~}i-=E@&UC`S316FB$RMz;9PP{R&gNxb7FK{B+=;lVn~sC5_spJX
z-v1>G6d=OFLnB6wG>{ibi-j0O-`d?awE(M!><0{@|6|GjDmftI<w;o13^;o>)-_A)
uwwWr&!j(PBe2K<C(FXwp6L6f~i7XVI575w1OaElyZ~%i~wD?~I`2PV3-E#{7

diff --git a/packages/icons/fonts/fabric-icons-cf6d96bb.woff b/packages/icons/fonts/fabric-icons-cf6d96bb.woff
new file mode 100644
index 0000000000000000000000000000000000000000..790840eadb124566dac8fdd57b8e4e450fa6a647
GIT binary patch
literal 6524
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
DZ|o<e

literal 0
HcmV?d00001


From c304b01fa7c0a98e54dc1c9af67c6a0d695838e8 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Wed, 31 Jan 2018 13:22:48 -0800
Subject: [PATCH 1301/1641] Fix issue in modal Selection handling (#3836)

* Fix bug in modal selection handling

* Update change output

* Fix touch handling for modal selection

* Update snapshot output
---
 .../selection-modal_2018-01-30-15-24.json             | 11 +++++++++++
 .../src/components/DetailsList/DetailsList.tsx        |  9 +++++++++
 .../examples/DetailsList.Documents.Example.tsx        |  2 ++
 .../pickers/__snapshots__/BasePicker.test.tsx.snap    |  4 ----
 .../src/utilities/selection/Selection.ts              |  4 ++--
 .../src/utilities/selection/SelectionZone.tsx         |  4 ++--
 6 files changed, 26 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/selection-modal_2018-01-30-15-24.json

diff --git a/common/changes/office-ui-fabric-react/selection-modal_2018-01-30-15-24.json b/common/changes/office-ui-fabric-react/selection-modal_2018-01-30-15-24.json
new file mode 100644
index 0000000000000..8c3438eeae852
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/selection-modal_2018-01-30-15-24.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix bug in modal selection handling",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index ca6b5bf92a578..c5751ebc41a24 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -82,6 +82,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   private _activeRows: { [key: string]: DetailsRow };
   private _dragDropHelper: DragDropHelper | null;
   private _initialFocusedIndex: number | undefined;
+  private _pendingForceUpdate: boolean;
 
   private _columnOverrides: {
     [key: string]: IColumn;
@@ -213,6 +214,12 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     }
 
     if (shouldForceUpdates) {
+      this._pendingForceUpdate = true;
+    }
+  }
+
+  public componentWillUpdate(): void {
+    if (this._pendingForceUpdate) {
       this._forceListUpdates();
     }
   }
@@ -556,6 +563,8 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   }
 
   private _forceListUpdates() {
+    this._pendingForceUpdate = false;
+
     if (this._groupedList) {
       this._groupedList.forceUpdate();
     }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
index 174fcfb1abaf9..051671e1bce06 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
@@ -7,6 +7,7 @@ import {
   DetailsList,
   DetailsListLayoutMode,
   Selection,
+  SelectionMode,
   IColumn
 } from 'office-ui-fabric-react/lib/DetailsList';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
@@ -231,6 +232,7 @@ export class DetailsListDocumentsExample extends React.Component<any, IDetailsLi
             items={ items }
             compact={ isCompactMode }
             columns={ columns }
+            selectionMode={ this.state.isModalSelection ? SelectionMode.multiple : SelectionMode.none }
             setKey='set'
             layoutMode={ DetailsListLayoutMode.justified }
             isHeaderVisible={ true }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
index 43b7f1992ae11..f6694b3f2bc5e 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
@@ -33,8 +33,6 @@ exports[`Pickers BasePicker renders BasePicker correctly 1`] = `
       onKeyDownCapture={[Function]}
       onMouseDown={[Function]}
       onMouseDownCapture={[Function]}
-      onTouchEndCapture={[Function]}
-      onTouchStartCapture={[Function]}
       role="presentation"
     >
       <div
@@ -101,8 +99,6 @@ exports[`Pickers TagPicker renders TagPicker correctly 1`] = `
       onKeyDownCapture={[Function]}
       onMouseDown={[Function]}
       onMouseDownCapture={[Function]}
-      onTouchEndCapture={[Function]}
-      onTouchStartCapture={[Function]}
       role="presentation"
     >
       <div
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts b/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
index 908233730a509..f7e6b55ba664c 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
@@ -86,7 +86,7 @@ export class Selection implements ISelection {
 
   public setModal(isModal: boolean): void {
     if (this._isModal !== isModal) {
-      this.setChangeEvents(true);
+      this.setChangeEvents(false);
 
       this._isModal = isModal;
 
@@ -96,7 +96,7 @@ export class Selection implements ISelection {
 
       this._change();
 
-      this.setChangeEvents(false);
+      this.setChangeEvents(true);
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
index 300f97b141075..4e2fb23369619 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
@@ -79,6 +79,8 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     // Track the latest modifier keys globally.
     this._events.on(win, 'keydown, keyup', this._updateModifiers, true);
     this._events.on(scrollElement, 'click', this._tryClearOnEmptyClick);
+    this._events.on(document.body, 'touchstart', this._onTouchStartCapture, true);
+    this._events.on(document.body, 'touchend', this._onTouchStartCapture, true);
   }
 
   public render() {
@@ -89,8 +91,6 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
         onKeyDown={ this._onKeyDown }
         onMouseDown={ this._onMouseDown }
         onKeyDownCapture={ this._onKeyDownCapture }
-        onTouchStartCapture={ this._onTouchStartCapture }
-        onTouchEndCapture={ this._onTouchStartCapture }
         onClick={ this._onClick }
         role='presentation'
 

From ddc544059e61523a8294b16275ae2e8706241e4f Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Wed, 31 Jan 2018 13:56:58 -0800
Subject: [PATCH 1302/1641] Addressing Issue #3776 - Sticky component loops
 forever if background-color is not set for page (#3833)

Added return default when reaching the html tag in while loop inside _getBackground() inside Sticky component and added color prop that falls back to getBackground function, and added Sticky to ScrollablePane's property table
---
 .../stick-bgc-3776_2018-01-29-23-43.json              | 11 +++++++++++
 .../components/ScrollablePane/ScrollablePanePage.tsx  |  3 ++-
 .../examples/ScrollablePane.Default.Example.tsx       |  7 +++----
 .../src/components/Sticky/Sticky.tsx                  |  8 ++++++--
 .../src/components/Sticky/Sticky.types.ts             |  8 +++++++-
 5 files changed, 29 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/stick-bgc-3776_2018-01-29-23-43.json

diff --git a/common/changes/office-ui-fabric-react/stick-bgc-3776_2018-01-29-23-43.json b/common/changes/office-ui-fabric-react/stick-bgc-3776_2018-01-29-23-43.json
new file mode 100644
index 0000000000000..de7f060b2fb53
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/stick-bgc-3776_2018-01-29-23-43.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "added return default when reaching the html tag in while loop inside _getBackground() inside Sticky component.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
index 8c95b615cba51..badfb5bbd4124 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
@@ -33,7 +33,8 @@ export class ScrollablePanePage extends React.Component<IComponentDemoPageProps,
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts'),
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Sticky/Sticky.types.ts')
             ] }
           />
         }
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx
index 6611219f4f865..2d5df4ba126d1 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx
@@ -31,17 +31,16 @@ export class ScrollablePaneDefaultExample extends React.Component {
   }
 
   private _createContentArea(index: number) {
-    const style = {
-      backgroundColor: this._getRandomColor()
-    };
+    const style = this._getRandomColor();
 
     return (
       <div key={ index }>
         <Sticky
           stickyPosition={ StickyPositionType.Both }
           stickyClassName='largeFont'
+          stickyBackgroundColor={ style }
         >
-          <div className='sticky' style={ style }>
+          <div className='sticky'>
             Sticky Component #{ index + 1 }
           </div>
         </Sticky>
diff --git a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
index e19dc32a2ad98..02ecf1817ce41 100644
--- a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
+++ b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
@@ -64,7 +64,7 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
     const { scrollablePane } = this.context;
     scrollablePane.subscribe(this._onScrollEvent);
     this.content = document.createElement('div');
-    this.content.style.background = this._getBackground();
+    this.content.style.background = this.props.stickyBackgroundColor || this._getBackground();
     ReactDOM.render(<div>{ this.props.children }</div>, this.content);
     this.refs.root.appendChild(this.content);
     this.context.scrollablePane.notifySubscribers(true);
@@ -172,10 +172,14 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
   }
 
   // Gets background of nearest parent element that has a declared background-color attribute
-  private _getBackground(): string {
+  private _getBackground(): string | null {
     let curr = this.refs.root;
     while (window.getComputedStyle(curr).getPropertyValue('background-color') === 'rgba(0, 0, 0, 0)' ||
       window.getComputedStyle(curr).getPropertyValue('background-color') === 'transparent') {
+      if (curr.tagName === 'HTML') {
+        // Fallback color if no element has a declared background-color attribute
+        return null;
+      }
       if (curr.parentElement) {
         curr = curr.parentElement;
       }
diff --git a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.types.ts b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.types.ts
index 49813269b34ae..bad51e69235b4 100644
--- a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.types.ts
@@ -13,7 +13,13 @@ export interface IStickyProps extends React.Props<Sticky> {
   stickyClassName?: string;
 
   /**
-   * Region to render sticky component in.  Defaults to Both.
+   * color to apply as 'background-color' style for sticky element.
+  */
+  stickyBackgroundColor?: string;
+
+  /**
+   * Region to render sticky component in.
+   * @default Both
    */
   stickyPosition?: StickyPositionType;
 }

From 952ad7979322352ca597d4e6319391529d5d2212 Mon Sep 17 00:00:00 2001
From: Srikanth Deshpande <srideshpande@users.noreply.github.com>
Date: Wed, 31 Jan 2018 14:23:52 -0800
Subject: [PATCH 1303/1641] Updating config files in @uifabric/icons package
 (#3851)

* new line

* updating config files

* rush change file
---
 ...-icon-config-update2_2018-01-31-22-05.json |  11 +
 packages/icons/config/fabric-icons-0.json     | 820 +++++++++---------
 packages/icons/config/fabric-icons-1.json     | 820 +++++++++---------
 packages/icons/config/fabric-icons-10.json    | 804 ++++++++---------
 packages/icons/config/fabric-icons-11.json    | 756 ++++++++--------
 packages/icons/config/fabric-icons-12.json    | 412 +++++++++
 packages/icons/config/fabric-icons-13.json    | 412 +++++++++
 packages/icons/config/fabric-icons-14.json    |  20 +
 packages/icons/config/fabric-icons-2.json     | 820 +++++++++---------
 packages/icons/config/fabric-icons-3.json     | 820 +++++++++---------
 packages/icons/config/fabric-icons-4.json     | 804 ++++++++---------
 packages/icons/config/fabric-icons-5.json     | 816 ++++++++---------
 packages/icons/config/fabric-icons-6.json     | 812 ++++++++---------
 packages/icons/config/fabric-icons-7.json     | 820 +++++++++---------
 packages/icons/config/fabric-icons-8.json     | 820 +++++++++---------
 packages/icons/config/fabric-icons-9.json     | 820 +++++++++---------
 packages/icons/config/fabric-icons.json       | 456 +++++-----
 17 files changed, 6005 insertions(+), 5038 deletions(-)
 create mode 100644 common/changes/@uifabric/icons/srideshpande-icon-config-update2_2018-01-31-22-05.json
 create mode 100644 packages/icons/config/fabric-icons-12.json
 create mode 100644 packages/icons/config/fabric-icons-13.json
 create mode 100644 packages/icons/config/fabric-icons-14.json

diff --git a/common/changes/@uifabric/icons/srideshpande-icon-config-update2_2018-01-31-22-05.json b/common/changes/@uifabric/icons/srideshpande-icon-config-update2_2018-01-31-22-05.json
new file mode 100644
index 0000000000000..4ce5961009bea
--- /dev/null
+++ b/common/changes/@uifabric/icons/srideshpande-icon-config-update2_2018-01-31-22-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/icons",
+      "comment": "updating config files in @uifabric/icons package",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/icons",
+  "email": "srdeshpa@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-0.json b/packages/icons/config/fabric-icons-0.json
index 1a70365cbdf51..2a824e10112ee 100644
--- a/packages/icons/config/fabric-icons-0.json
+++ b/packages/icons/config/fabric-icons-0.json
@@ -1,412 +1,412 @@
 {
-  "fontName": "fabric-icons-0",
-  "fontFamilyName": "FabricMDL2Icons-0",
-  "excludeGlyphs": false,
-  "chunkSubsets": true,
-  "hashFontFileName": true,
-  "subsetChunkSettings": {
-    "maxSubsetSize": 100
-  },
-  "glyphs": [
-    {
-      "name": "DecreaseIndentLegacy",
-      "unicode": "E290"
-    },
-    {
-      "name": "IncreaseIndentLegacy",
-      "unicode": "E291"
-    },
-    {
-      "name": "InternetSharing",
-      "unicode": "E704"
-    },
-    {
-      "name": "Brightness",
-      "unicode": "E706"
-    },
-    {
-      "name": "MapPin",
-      "unicode": "E707"
-    },
-    {
-      "name": "Airplane",
-      "unicode": "E709"
-    },
-    {
-      "name": "Tablet",
-      "unicode": "E70A"
-    },
-    {
-      "name": "QuickNote",
-      "unicode": "E70B"
-    },
-    {
-      "name": "Video",
-      "unicode": "E714"
-    },
-    {
-      "name": "People",
-      "unicode": "E716"
-    },
-    {
-      "name": "Phone",
-      "unicode": "E717"
-    },
-    {
-      "name": "Pin",
-      "unicode": "E718"
-    },
-    {
-      "name": "Shop",
-      "unicode": "E719"
-    },
-    {
-      "name": "Stop",
-      "unicode": "E71A"
-    },
-    {
-      "name": "Link",
-      "unicode": "E71B"
-    },
-    {
-      "name": "Zoom",
-      "unicode": "E71E"
-    },
-    {
-      "name": "ZoomOut",
-      "unicode": "E71F"
-    },
-    {
-      "name": "Microphone",
-      "unicode": "E720"
-    },
-    {
-      "name": "Camera",
-      "unicode": "E722"
-    },
-    {
-      "name": "Attach",
-      "unicode": "E723"
-    },
-    {
-      "name": "Send",
-      "unicode": "E724"
-    },
-    {
-      "name": "FavoriteList",
-      "unicode": "E728"
-    },
-    {
-      "name": "PageSolid",
-      "unicode": "E729"
-    },
-    {
-      "name": "Forward",
-      "unicode": "E72A"
-    },
-    {
-      "name": "Back",
-      "unicode": "E72B"
-    },
-    {
-      "name": "Refresh",
-      "unicode": "E72C"
-    },
-    {
-      "name": "Lock",
-      "unicode": "E72E"
-    },
-    {
-      "name": "EMI",
-      "unicode": "E731"
-    },
-    {
-      "name": "MiniLink",
-      "unicode": "E732"
-    },
-    {
-      "name": "Blocked",
-      "unicode": "E733"
-    },
-    {
-      "name": "ReadingMode",
-      "unicode": "E736"
-    },
-    {
-      "name": "Favicon",
-      "unicode": "E737"
-    },
-    {
-      "name": "Remove",
-      "unicode": "E738"
-    },
-    {
-      "name": "Checkbox",
-      "unicode": "E739"
-    },
-    {
-      "name": "CheckboxComposite",
-      "unicode": "E73A"
-    },
-    {
-      "name": "CheckboxIndeterminate",
-      "unicode": "E73C"
-    },
-    {
-      "name": "CheckboxCompositeReversed",
-      "unicode": "E73D"
-    },
-    {
-      "name": "BackToWindow",
-      "unicode": "E73F"
-    },
-    {
-      "name": "FullScreen",
-      "unicode": "E740"
-    },
-    {
-      "name": "Print",
-      "unicode": "E749"
-    },
-    {
-      "name": "Up",
-      "unicode": "E74A"
-    },
-    {
-      "name": "Down",
-      "unicode": "E74B"
-    },
-    {
-      "name": "Save",
-      "unicode": "E74E"
-    },
-    {
-      "name": "Cloud",
-      "unicode": "E753"
-    },
-    {
-      "name": "CommandPrompt",
-      "unicode": "E756"
-    },
-    {
-      "name": "Sad",
-      "unicode": "E757"
-    },
-    {
-      "name": "SIPMove",
-      "unicode": "E759"
-    },
-    {
-      "name": "EraseTool",
-      "unicode": "E75C"
-    },
-    {
-      "name": "GripperTool",
-      "unicode": "E75E"
-    },
-    {
-      "name": "Dialpad",
-      "unicode": "E75F"
-    },
-    {
-      "name": "PageLeft",
-      "unicode": "E760"
-    },
-    {
-      "name": "PageRight",
-      "unicode": "E761"
-    },
-    {
-      "name": "MultiSelect",
-      "unicode": "E762"
-    },
-    {
-      "name": "Play",
-      "unicode": "E768"
-    },
-    {
-      "name": "Pause",
-      "unicode": "E769"
-    },
-    {
-      "name": "Emoji2",
-      "unicode": "E76E"
-    },
-    {
-      "name": "GripperBarHorizontal",
-      "unicode": "E76F"
-    },
-    {
-      "name": "System",
-      "unicode": "E770"
-    },
-    {
-      "name": "Personalize",
-      "unicode": "E771"
-    },
-    {
-      "name": "SearchAndApps",
-      "unicode": "E773"
-    },
-    {
-      "name": "Globe",
-      "unicode": "E774"
-    },
-    {
-      "name": "ContactInfo",
-      "unicode": "E779"
-    },
-    {
-      "name": "Unpin",
-      "unicode": "E77A"
-    },
-    {
-      "name": "Contact",
-      "unicode": "E77B"
-    },
-    {
-      "name": "Memo",
-      "unicode": "E77C"
-    },
-    {
-      "name": "Paste",
-      "unicode": "E77F"
-    },
-    {
-      "name": "WindowsLogo",
-      "unicode": "E782"
-    },
-    {
-      "name": "Error",
-      "unicode": "E783"
-    },
-    {
-      "name": "GripperBarVertical",
-      "unicode": "E784"
-    },
-    {
-      "name": "Unlock",
-      "unicode": "E785"
-    },
-    {
-      "name": "Megaphone",
-      "unicode": "E789"
-    },
-    {
-      "name": "AutoEnhanceOn",
-      "unicode": "E78D"
-    },
-    {
-      "name": "AutoEnhanceOff",
-      "unicode": "E78E"
-    },
-    {
-      "name": "Color",
-      "unicode": "E790"
-    },
-    {
-      "name": "SaveAs",
-      "unicode": "E792"
-    },
-    {
-      "name": "Light",
-      "unicode": "E793"
-    },
-    {
-      "name": "Filters",
-      "unicode": "E795"
-    },
-    {
-      "name": "AspectRatio",
-      "unicode": "E799"
-    },
-    {
-      "name": "Contrast",
-      "unicode": "E7A1"
-    },
-    {
-      "name": "Redo",
-      "unicode": "E7A6"
-    },
-    {
-      "name": "PhotoCollection",
-      "unicode": "E7AA"
-    },
-    {
-      "name": "Album",
-      "unicode": "E7AB"
-    },
-    {
-      "name": "Rotate",
-      "unicode": "E7AD"
-    },
-    {
-      "name": "PanoIndicator",
-      "unicode": "E7B0"
-    },
-    {
-      "name": "RedEye",
-      "unicode": "E7B3"
-    },
-    {
-      "name": "ThumbnailView",
-      "unicode": "E7B6"
-    },
-    {
-      "name": "Package",
-      "unicode": "E7B8"
-    },
-    {
-      "name": "Warning",
-      "unicode": "E7BA"
-    },
-    {
-      "name": "Financial",
-      "unicode": "E7BB"
-    },
-    {
-      "name": "Education",
-      "unicode": "E7BE"
-    },
-    {
-      "name": "ShoppingCart",
-      "unicode": "E7BF"
-    },
-    {
-      "name": "Train",
-      "unicode": "E7C0"
-    },
-    {
-      "name": "Move",
-      "unicode": "E7C2"
-    },
-    {
-      "name": "TouchPointer",
-      "unicode": "E7C9"
-    },
-    {
-      "name": "Merge",
-      "unicode": "E7D5"
-    },
-    {
-      "name": "TurnRight",
-      "unicode": "E7DB"
-    },
-    {
-      "name": "Ferry",
-      "unicode": "E7E3"
-    },
-    {
-      "name": "Highlight",
-      "unicode": "E7E6"
-    },
-    {
-      "name": "Tab",
-      "unicode": "E7E9"
-    },
-    {
-      "name": "Admin",
-      "unicode": "E7EF"
-    }
-  ]
+	"fontName": "fabric-icons-0",
+	"fontFamilyName": "FabricMDL2Icons-0",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "DecreaseIndentLegacy",
+			"unicode": "E290"
+		},
+		{
+			"name": "IncreaseIndentLegacy",
+			"unicode": "E291"
+		},
+		{
+			"name": "SizeLegacy",
+			"unicode": "E2B2"
+		},
+		{
+			"name": "InternetSharing",
+			"unicode": "E704"
+		},
+		{
+			"name": "Brightness",
+			"unicode": "E706"
+		},
+		{
+			"name": "MapPin",
+			"unicode": "E707"
+		},
+		{
+			"name": "Airplane",
+			"unicode": "E709"
+		},
+		{
+			"name": "Tablet",
+			"unicode": "E70A"
+		},
+		{
+			"name": "QuickNote",
+			"unicode": "E70B"
+		},
+		{
+			"name": "Video",
+			"unicode": "E714"
+		},
+		{
+			"name": "People",
+			"unicode": "E716"
+		},
+		{
+			"name": "Phone",
+			"unicode": "E717"
+		},
+		{
+			"name": "Pin",
+			"unicode": "E718"
+		},
+		{
+			"name": "Shop",
+			"unicode": "E719"
+		},
+		{
+			"name": "Stop",
+			"unicode": "E71A"
+		},
+		{
+			"name": "Link",
+			"unicode": "E71B"
+		},
+		{
+			"name": "Zoom",
+			"unicode": "E71E"
+		},
+		{
+			"name": "ZoomOut",
+			"unicode": "E71F"
+		},
+		{
+			"name": "Microphone",
+			"unicode": "E720"
+		},
+		{
+			"name": "Camera",
+			"unicode": "E722"
+		},
+		{
+			"name": "Attach",
+			"unicode": "E723"
+		},
+		{
+			"name": "Send",
+			"unicode": "E724"
+		},
+		{
+			"name": "FavoriteList",
+			"unicode": "E728"
+		},
+		{
+			"name": "PageSolid",
+			"unicode": "E729"
+		},
+		{
+			"name": "Forward",
+			"unicode": "E72A"
+		},
+		{
+			"name": "Back",
+			"unicode": "E72B"
+		},
+		{
+			"name": "Refresh",
+			"unicode": "E72C"
+		},
+		{
+			"name": "Lock",
+			"unicode": "E72E"
+		},
+		{
+			"name": "BlockedSite",
+			"unicode": "E72F"
+		},
+		{
+			"name": "ReportHacked",
+			"unicode": "E730"
+		},
+		{
+			"name": "EMI",
+			"unicode": "E731"
+		},
+		{
+			"name": "MiniLink",
+			"unicode": "E732"
+		},
+		{
+			"name": "Blocked",
+			"unicode": "E733"
+		},
+		{
+			"name": "ReadingMode",
+			"unicode": "E736"
+		},
+		{
+			"name": "Favicon",
+			"unicode": "E737"
+		},
+		{
+			"name": "Remove",
+			"unicode": "E738"
+		},
+		{
+			"name": "Checkbox",
+			"unicode": "E739"
+		},
+		{
+			"name": "CheckboxComposite",
+			"unicode": "E73A"
+		},
+		{
+			"name": "CheckboxIndeterminate",
+			"unicode": "E73C"
+		},
+		{
+			"name": "CheckboxCompositeReversed",
+			"unicode": "E73D"
+		},
+		{
+			"name": "BackToWindow",
+			"unicode": "E73F"
+		},
+		{
+			"name": "FullScreen",
+			"unicode": "E740"
+		},
+		{
+			"name": "Print",
+			"unicode": "E749"
+		},
+		{
+			"name": "Up",
+			"unicode": "E74A"
+		},
+		{
+			"name": "Down",
+			"unicode": "E74B"
+		},
+		{
+			"name": "OEM",
+			"unicode": "E74C"
+		},
+		{
+			"name": "Save",
+			"unicode": "E74E"
+		},
+		{
+			"name": "Cloud",
+			"unicode": "E753"
+		},
+		{
+			"name": "CommandPrompt",
+			"unicode": "E756"
+		},
+		{
+			"name": "Sad",
+			"unicode": "E757"
+		},
+		{
+			"name": "SIPMove",
+			"unicode": "E759"
+		},
+		{
+			"name": "EraseTool",
+			"unicode": "E75C"
+		},
+		{
+			"name": "GripperTool",
+			"unicode": "E75E"
+		},
+		{
+			"name": "Dialpad",
+			"unicode": "E75F"
+		},
+		{
+			"name": "PageLeft",
+			"unicode": "E760"
+		},
+		{
+			"name": "PageRight",
+			"unicode": "E761"
+		},
+		{
+			"name": "MultiSelect",
+			"unicode": "E762"
+		},
+		{
+			"name": "Play",
+			"unicode": "E768"
+		},
+		{
+			"name": "Pause",
+			"unicode": "E769"
+		},
+		{
+			"name": "Emoji2",
+			"unicode": "E76E"
+		},
+		{
+			"name": "GripperBarHorizontal",
+			"unicode": "E76F"
+		},
+		{
+			"name": "System",
+			"unicode": "E770"
+		},
+		{
+			"name": "Personalize",
+			"unicode": "E771"
+		},
+		{
+			"name": "SearchAndApps",
+			"unicode": "E773"
+		},
+		{
+			"name": "Globe",
+			"unicode": "E774"
+		},
+		{
+			"name": "ContactInfo",
+			"unicode": "E779"
+		},
+		{
+			"name": "Unpin",
+			"unicode": "E77A"
+		},
+		{
+			"name": "Contact",
+			"unicode": "E77B"
+		},
+		{
+			"name": "Memo",
+			"unicode": "E77C"
+		},
+		{
+			"name": "Paste",
+			"unicode": "E77F"
+		},
+		{
+			"name": "WindowsLogo",
+			"unicode": "E782"
+		},
+		{
+			"name": "Error",
+			"unicode": "E783"
+		},
+		{
+			"name": "GripperBarVertical",
+			"unicode": "E784"
+		},
+		{
+			"name": "Unlock",
+			"unicode": "E785"
+		},
+		{
+			"name": "AutoEnhanceOn",
+			"unicode": "E78D"
+		},
+		{
+			"name": "AutoEnhanceOff",
+			"unicode": "E78E"
+		},
+		{
+			"name": "Color",
+			"unicode": "E790"
+		},
+		{
+			"name": "SaveAs",
+			"unicode": "E792"
+		},
+		{
+			"name": "Light",
+			"unicode": "E793"
+		},
+		{
+			"name": "Filters",
+			"unicode": "E795"
+		},
+		{
+			"name": "AspectRatio",
+			"unicode": "E799"
+		},
+		{
+			"name": "Contrast",
+			"unicode": "E7A1"
+		},
+		{
+			"name": "Redo",
+			"unicode": "E7A6"
+		},
+		{
+			"name": "Crop",
+			"unicode": "E7A8"
+		},
+		{
+			"name": "PhotoCollection",
+			"unicode": "E7AA"
+		},
+		{
+			"name": "Album",
+			"unicode": "E7AB"
+		},
+		{
+			"name": "Rotate",
+			"unicode": "E7AD"
+		},
+		{
+			"name": "PanoIndicator",
+			"unicode": "E7B0"
+		},
+		{
+			"name": "RedEye",
+			"unicode": "E7B3"
+		},
+		{
+			"name": "ThumbnailView",
+			"unicode": "E7B6"
+		},
+		{
+			"name": "Package",
+			"unicode": "E7B8"
+		},
+		{
+			"name": "Warning",
+			"unicode": "E7BA"
+		},
+		{
+			"name": "Financial",
+			"unicode": "E7BB"
+		},
+		{
+			"name": "Education",
+			"unicode": "E7BE"
+		},
+		{
+			"name": "ShoppingCart",
+			"unicode": "E7BF"
+		},
+		{
+			"name": "Train",
+			"unicode": "E7C0"
+		},
+		{
+			"name": "Move",
+			"unicode": "E7C2"
+		},
+		{
+			"name": "TouchPointer",
+			"unicode": "E7C9"
+		},
+		{
+			"name": "Merge",
+			"unicode": "E7D5"
+		},
+		{
+			"name": "TurnRight",
+			"unicode": "E7DB"
+		}
+	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-1.json b/packages/icons/config/fabric-icons-1.json
index 93b0274ca2d4f..417ff4dac8a4c 100644
--- a/packages/icons/config/fabric-icons-1.json
+++ b/packages/icons/config/fabric-icons-1.json
@@ -1,412 +1,412 @@
 {
-  "fontName": "fabric-icons-1",
-  "fontFamilyName": "FabricMDL2Icons-1",
-  "excludeGlyphs": false,
-  "chunkSubsets": true,
-  "hashFontFileName": true,
-  "subsetChunkSettings": {
-    "maxSubsetSize": 100
-  },
-  "glyphs": [
-    {
-      "name": "TVMonitor",
-      "unicode": "E7F4"
-    },
-    {
-      "name": "Speakers",
-      "unicode": "E7F5"
-    },
-    {
-      "name": "Nav2DMapView",
-      "unicode": "E800"
-    },
-    {
-      "name": "Car",
-      "unicode": "E804"
-    },
-    {
-      "name": "Bus",
-      "unicode": "E806"
-    },
-    {
-      "name": "EatDrink",
-      "unicode": "E807"
-    },
-    {
-      "name": "LocationCircle",
-      "unicode": "E80E"
-    },
-    {
-      "name": "Home",
-      "unicode": "E80F"
-    },
-    {
-      "name": "SwitcherStartEnd",
-      "unicode": "E810"
-    },
-    {
-      "name": "ParkingLocation",
-      "unicode": "E811"
-    },
-    {
-      "name": "IncidentTriangle",
-      "unicode": "E814"
-    },
-    {
-      "name": "Touch",
-      "unicode": "E815"
-    },
-    {
-      "name": "MapDirections",
-      "unicode": "E816"
-    },
-    {
-      "name": "History",
-      "unicode": "E81C"
-    },
-    {
-      "name": "Location",
-      "unicode": "E81D"
-    },
-    {
-      "name": "Work",
-      "unicode": "E821"
-    },
-    {
-      "name": "Recent",
-      "unicode": "E823"
-    },
-    {
-      "name": "Hotel",
-      "unicode": "E824"
-    },
-    {
-      "name": "LocationDot",
-      "unicode": "E827"
-    },
-    {
-      "name": "News",
-      "unicode": "E900"
-    },
-    {
-      "name": "Chat",
-      "unicode": "E901"
-    },
-    {
-      "name": "Group",
-      "unicode": "E902"
-    },
-    {
-      "name": "Previous",
-      "unicode": "E892"
-    },
-    {
-      "name": "Next",
-      "unicode": "E893"
-    },
-    {
-      "name": "Sync",
-      "unicode": "E895"
-    },
-    {
-      "name": "Help",
-      "unicode": "E897"
-    },
-    {
-      "name": "Emoji",
-      "unicode": "E899"
-    },
-    {
-      "name": "MailForward",
-      "unicode": "E89C"
-    },
-    {
-      "name": "ClosePane",
-      "unicode": "E89F"
-    },
-    {
-      "name": "OpenPane",
-      "unicode": "E8A0"
-    },
-    {
-      "name": "PreviewLink",
-      "unicode": "E8A1"
-    },
-    {
-      "name": "ZoomIn",
-      "unicode": "E8A3"
-    },
-    {
-      "name": "Bookmarks",
-      "unicode": "E8A4"
-    },
-    {
-      "name": "Document",
-      "unicode": "E8A5"
-    },
-    {
-      "name": "ProtectedDocument",
-      "unicode": "E8A6"
-    },
-    {
-      "name": "OpenInNewWindow",
-      "unicode": "E8A7"
-    },
-    {
-      "name": "MailFill",
-      "unicode": "E8A8"
-    },
-    {
-      "name": "ViewAll",
-      "unicode": "E8A9"
-    },
-    {
-      "name": "Switch",
-      "unicode": "E8AB"
-    },
-    {
-      "name": "Rename",
-      "unicode": "E8AC"
-    },
-    {
-      "name": "Import",
-      "unicode": "E8B5"
-    },
-    {
-      "name": "Picture",
-      "unicode": "E8B9"
-    },
-    {
-      "name": "ShowResults",
-      "unicode": "E8BC"
-    },
-    {
-      "name": "Message",
-      "unicode": "E8BD"
-    },
-    {
-      "name": "CalendarDay",
-      "unicode": "E8BF"
-    },
-    {
-      "name": "CalendarWeek",
-      "unicode": "E8C0"
-    },
-    {
-      "name": "MailReplyAll",
-      "unicode": "E8C2"
-    },
-    {
-      "name": "Read",
-      "unicode": "E8C3"
-    },
-    {
-      "name": "Cut",
-      "unicode": "E8C6"
-    },
-    {
-      "name": "PaymentCard",
-      "unicode": "E8C7"
-    },
-    {
-      "name": "Copy",
-      "unicode": "E8C8"
-    },
-    {
-      "name": "Important",
-      "unicode": "E8C9"
-    },
-    {
-      "name": "MailReply",
-      "unicode": "E8CA"
-    },
-    {
-      "name": "GotoToday",
-      "unicode": "E8D1"
-    },
-    {
-      "name": "Font",
-      "unicode": "E8D2"
-    },
-    {
-      "name": "FontColor",
-      "unicode": "E8D3"
-    },
-    {
-      "name": "FolderFill",
-      "unicode": "E8D5"
-    },
-    {
-      "name": "Permissions",
-      "unicode": "E8D7"
-    },
-    {
-      "name": "DisableUpdates",
-      "unicode": "E8D8"
-    },
-    {
-      "name": "Unfavorite",
-      "unicode": "E8D9"
-    },
-    {
-      "name": "Italic",
-      "unicode": "E8DB"
-    },
-    {
-      "name": "Underline",
-      "unicode": "E8DC"
-    },
-    {
-      "name": "Bold",
-      "unicode": "E8DD"
-    },
-    {
-      "name": "MoveToFolder",
-      "unicode": "E8DE"
-    },
-    {
-      "name": "Dislike",
-      "unicode": "E8E0"
-    },
-    {
-      "name": "Like",
-      "unicode": "E8E1"
-    },
-    {
-      "name": "AlignCenter",
-      "unicode": "E8E3"
-    },
-    {
-      "name": "OpenFile",
-      "unicode": "E8E5"
-    },
-    {
-      "name": "FontDecrease",
-      "unicode": "E8E7"
-    },
-    {
-      "name": "FontIncrease",
-      "unicode": "E8E8"
-    },
-    {
-      "name": "FontSize",
-      "unicode": "E8E9"
-    },
-    {
-      "name": "CellPhone",
-      "unicode": "E8EA"
-    },
-    {
-      "name": "Library",
-      "unicode": "E8F1"
-    },
-    {
-      "name": "PostUpdate",
-      "unicode": "E8F3"
-    },
-    {
-      "name": "NewFolder",
-      "unicode": "E8F4"
-    },
-    {
-      "name": "CalendarReply",
-      "unicode": "E8F5"
-    },
-    {
-      "name": "UnsyncFolder",
-      "unicode": "E8F6"
-    },
-    {
-      "name": "SyncFolder",
-      "unicode": "E8F7"
-    },
-    {
-      "name": "BlockContact",
-      "unicode": "E8F8"
-    },
-    {
-      "name": "BulletedList",
-      "unicode": "E8FD"
-    },
-    {
-      "name": "Preview",
-      "unicode": "E8FF"
-    },
-    {
-      "name": "World",
-      "unicode": "E909"
-    },
-    {
-      "name": "Comment",
-      "unicode": "E90A"
-    },
-    {
-      "name": "DockLeft",
-      "unicode": "E90C"
-    },
-    {
-      "name": "DockRight",
-      "unicode": "E90D"
-    },
-    {
-      "name": "Repair",
-      "unicode": "E90F"
-    },
-    {
-      "name": "Accounts",
-      "unicode": "E910"
-    },
-    {
-      "name": "RadioBullet",
-      "unicode": "E915"
-    },
-    {
-      "name": "Stopwatch",
-      "unicode": "E916"
-    },
-    {
-      "name": "Clock",
-      "unicode": "E917"
-    },
-    {
-      "name": "WorldClock",
-      "unicode": "E918"
-    },
-    {
-      "name": "AlarmClock",
-      "unicode": "E919"
-    },
-    {
-      "name": "Hospital",
-      "unicode": "E91D"
-    },
-    {
-      "name": "Timer",
-      "unicode": "E91E"
-    },
-    {
-      "name": "FullCircleMask",
-      "unicode": "E91F"
-    },
-    {
-      "name": "LocationFill",
-      "unicode": "E920"
-    },
-    {
-      "name": "ChromeMinimize",
-      "unicode": "E921"
-    },
-    {
-      "name": "Annotation",
-      "unicode": "E924"
-    },
-    {
-      "name": "ChromeClose",
-      "unicode": "E8BB"
-    },
-    {
-      "name": "Accept",
-      "unicode": "E8FB"
-    }
-  ]
+	"fontName": "fabric-icons-1",
+	"fontFamilyName": "FabricMDL2Icons-1",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "Ferry",
+			"unicode": "E7E3"
+		},
+		{
+			"name": "Highlight",
+			"unicode": "E7E6"
+		},
+		{
+			"name": "Tab",
+			"unicode": "E7E9"
+		},
+		{
+			"name": "Admin",
+			"unicode": "E7EF"
+		},
+		{
+			"name": "TVMonitor",
+			"unicode": "E7F4"
+		},
+		{
+			"name": "Speakers",
+			"unicode": "E7F5"
+		},
+		{
+			"name": "StackIndicator",
+			"unicode": "E7FF"
+		},
+		{
+			"name": "Nav2DMapView",
+			"unicode": "E800"
+		},
+		{
+			"name": "Car",
+			"unicode": "E804"
+		},
+		{
+			"name": "Bus",
+			"unicode": "E806"
+		},
+		{
+			"name": "EatDrink",
+			"unicode": "E807"
+		},
+		{
+			"name": "LocationCircle",
+			"unicode": "E80E"
+		},
+		{
+			"name": "Home",
+			"unicode": "E80F"
+		},
+		{
+			"name": "SwitcherStartEnd",
+			"unicode": "E810"
+		},
+		{
+			"name": "ParkingLocation",
+			"unicode": "E811"
+		},
+		{
+			"name": "IncidentTriangle",
+			"unicode": "E814"
+		},
+		{
+			"name": "Touch",
+			"unicode": "E815"
+		},
+		{
+			"name": "MapDirections",
+			"unicode": "E816"
+		},
+		{
+			"name": "CaretHollow",
+			"unicode": "E817"
+		},
+		{
+			"name": "CaretSolid",
+			"unicode": "E818"
+		},
+		{
+			"name": "History",
+			"unicode": "E81C"
+		},
+		{
+			"name": "Location",
+			"unicode": "E81D"
+		},
+		{
+			"name": "Work",
+			"unicode": "E821"
+		},
+		{
+			"name": "Recent",
+			"unicode": "E823"
+		},
+		{
+			"name": "Hotel",
+			"unicode": "E824"
+		},
+		{
+			"name": "LocationDot",
+			"unicode": "E827"
+		},
+		{
+			"name": "Dictionary",
+			"unicode": "E82D"
+		},
+		{
+			"name": "ChromeBack",
+			"unicode": "E830"
+		},
+		{
+			"name": "FolderOpen",
+			"unicode": "E838"
+		},
+		{
+			"name": "PinnedFill",
+			"unicode": "E842"
+		},
+		{
+			"name": "RevToggleKey",
+			"unicode": "E845"
+		},
+		{
+			"name": "Previous",
+			"unicode": "E892"
+		},
+		{
+			"name": "Next",
+			"unicode": "E893"
+		},
+		{
+			"name": "Sync",
+			"unicode": "E895"
+		},
+		{
+			"name": "Help",
+			"unicode": "E897"
+		},
+		{
+			"name": "Emoji",
+			"unicode": "E899"
+		},
+		{
+			"name": "MailForward",
+			"unicode": "E89C"
+		},
+		{
+			"name": "ClosePane",
+			"unicode": "E89F"
+		},
+		{
+			"name": "OpenPane",
+			"unicode": "E8A0"
+		},
+		{
+			"name": "PreviewLink",
+			"unicode": "E8A1"
+		},
+		{
+			"name": "ZoomIn",
+			"unicode": "E8A3"
+		},
+		{
+			"name": "Bookmarks",
+			"unicode": "E8A4"
+		},
+		{
+			"name": "Document",
+			"unicode": "E8A5"
+		},
+		{
+			"name": "ProtectedDocument",
+			"unicode": "E8A6"
+		},
+		{
+			"name": "OpenInNewWindow",
+			"unicode": "E8A7"
+		},
+		{
+			"name": "MailFill",
+			"unicode": "E8A8"
+		},
+		{
+			"name": "ViewAll",
+			"unicode": "E8A9"
+		},
+		{
+			"name": "Switch",
+			"unicode": "E8AB"
+		},
+		{
+			"name": "Rename",
+			"unicode": "E8AC"
+		},
+		{
+			"name": "Remote",
+			"unicode": "E8AF"
+		},
+		{
+			"name": "SelectAll",
+			"unicode": "E8B3"
+		},
+		{
+			"name": "Orientation",
+			"unicode": "E8B4"
+		},
+		{
+			"name": "Import",
+			"unicode": "E8B5"
+		},
+		{
+			"name": "Picture",
+			"unicode": "E8B9"
+		},
+		{
+			"name": "ChromeClose",
+			"unicode": "E8BB"
+		},
+		{
+			"name": "ShowResults",
+			"unicode": "E8BC"
+		},
+		{
+			"name": "Message",
+			"unicode": "E8BD"
+		},
+		{
+			"name": "CalendarDay",
+			"unicode": "E8BF"
+		},
+		{
+			"name": "CalendarWeek",
+			"unicode": "E8C0"
+		},
+		{
+			"name": "MailReplyAll",
+			"unicode": "E8C2"
+		},
+		{
+			"name": "Read",
+			"unicode": "E8C3"
+		},
+		{
+			"name": "Cut",
+			"unicode": "E8C6"
+		},
+		{
+			"name": "PaymentCard",
+			"unicode": "E8C7"
+		},
+		{
+			"name": "Copy",
+			"unicode": "E8C8"
+		},
+		{
+			"name": "Important",
+			"unicode": "E8C9"
+		},
+		{
+			"name": "MailReply",
+			"unicode": "E8CA"
+		},
+		{
+			"name": "GotoToday",
+			"unicode": "E8D1"
+		},
+		{
+			"name": "Font",
+			"unicode": "E8D2"
+		},
+		{
+			"name": "FontColor",
+			"unicode": "E8D3"
+		},
+		{
+			"name": "FolderFill",
+			"unicode": "E8D5"
+		},
+		{
+			"name": "Permissions",
+			"unicode": "E8D7"
+		},
+		{
+			"name": "DisableUpdates",
+			"unicode": "E8D8"
+		},
+		{
+			"name": "Unfavorite",
+			"unicode": "E8D9"
+		},
+		{
+			"name": "Italic",
+			"unicode": "E8DB"
+		},
+		{
+			"name": "Underline",
+			"unicode": "E8DC"
+		},
+		{
+			"name": "Bold",
+			"unicode": "E8DD"
+		},
+		{
+			"name": "MoveToFolder",
+			"unicode": "E8DE"
+		},
+		{
+			"name": "Dislike",
+			"unicode": "E8E0"
+		},
+		{
+			"name": "Like",
+			"unicode": "E8E1"
+		},
+		{
+			"name": "AlignCenter",
+			"unicode": "E8E3"
+		},
+		{
+			"name": "OpenFile",
+			"unicode": "E8E5"
+		},
+		{
+			"name": "FontDecrease",
+			"unicode": "E8E7"
+		},
+		{
+			"name": "FontIncrease",
+			"unicode": "E8E8"
+		},
+		{
+			"name": "FontSize",
+			"unicode": "E8E9"
+		},
+		{
+			"name": "CellPhone",
+			"unicode": "E8EA"
+		},
+		{
+			"name": "Calculator",
+			"unicode": "E8EF"
+		},
+		{
+			"name": "Library",
+			"unicode": "E8F1"
+		},
+		{
+			"name": "PostUpdate",
+			"unicode": "E8F3"
+		},
+		{
+			"name": "NewFolder",
+			"unicode": "E8F4"
+		},
+		{
+			"name": "CalendarReply",
+			"unicode": "E8F5"
+		},
+		{
+			"name": "UnsyncFolder",
+			"unicode": "E8F6"
+		},
+		{
+			"name": "SyncFolder",
+			"unicode": "E8F7"
+		},
+		{
+			"name": "BlockContact",
+			"unicode": "E8F8"
+		},
+		{
+			"name": "Accept",
+			"unicode": "E8FB"
+		},
+		{
+			"name": "BulletedList",
+			"unicode": "E8FD"
+		},
+		{
+			"name": "Preview",
+			"unicode": "E8FF"
+		},
+		{
+			"name": "News",
+			"unicode": "E900"
+		},
+		{
+			"name": "Chat",
+			"unicode": "E901"
+		},
+		{
+			"name": "Group",
+			"unicode": "E902"
+		},
+		{
+			"name": "World",
+			"unicode": "E909"
+		}
+	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-10.json b/packages/icons/config/fabric-icons-10.json
index 64720f2ec6aef..c05e8831b8bea 100644
--- a/packages/icons/config/fabric-icons-10.json
+++ b/packages/icons/config/fabric-icons-10.json
@@ -1,396 +1,412 @@
 {
-  "fontName": "fabric-icons-10",
-  "fontFamilyName": "FabricMDL2Icons-10",
-  "excludeGlyphs": false,
-  "chunkSubsets": false,
-  "hashFontFileName": true,
-  "subsetChunkSettings": {
-    "maxSubsetSize": 100
-  },
-  "glyphs": [
-    {
-      "name": "BankSolid",
-      "unicode": "F34F"
-    },
-    {
-      "name": "DecisionSolid",
-      "unicode": "F350"
-    },
-    {
-      "name": "Parachute",
-      "unicode": "F351"
-    },
-    {
-      "name": "ParachuteSolid",
-      "unicode": "F352"
-    },
-    {
-      "name": "FiltersSolid",
-      "unicode": "F353"
-    },
-    {
-      "name": "ColorSolid",
-      "unicode": "F354"
-    },
-    {
-      "name": "ReviewSolid",
-      "unicode": "F355"
-    },
-    {
-      "name": "ReviewRequestSolid",
-      "unicode": "F356"
-    },
-    {
-      "name": "ReviewRequestMirroredSolid",
-      "unicode": "F357"
-    },
-    {
-      "name": "ReviewResponseSolid",
-      "unicode": "F358"
-    },
-    {
-      "name": "FeedbackRequestSolid",
-      "unicode": "F359"
-    },
-    {
-      "name": "FeedbackRequestMirroredSolid",
-      "unicode": "F35A"
-    },
-    {
-      "name": "FeedbackResponseSolid",
-      "unicode": "F35B"
-    },
-    {
-      "name": "WorkItemBar",
-      "unicode": "F35C"
-    },
-    {
-      "name": "WorkItemBarSolid",
-      "unicode": "F35D"
-    },
-    {
-      "name": "Separator",
-      "unicode": "F35E"
-    },
-    {
-      "name": "NavigateExternalInline",
-      "unicode": "F35F"
-    },
-    {
-      "name": "PlanView",
-      "unicode": "F360"
-    },
-    {
-      "name": "TimelineMatrixView",
-      "unicode": "F361"
-    },
-    {
-      "name": "EngineeringGroup",
-      "unicode": "F362"
-    },
-    {
-      "name": "ProjectCollection",
-      "unicode": "F363"
-    },
-    {
-      "name": "CaretBottomRightCenter8",
-      "unicode": "F364"
-    },
-    {
-      "name": "CaretBottomLeftCenter8",
-      "unicode": "F365"
-    },
-    {
-      "name": "CaretTopRightCenter8",
-      "unicode": "F366"
-    },
-    {
-      "name": "CaretTopLeftCenter8",
-      "unicode": "F367"
-    },
-    {
-      "name": "DonutChart",
-      "unicode": "F368"
-    },
-    {
-      "name": "ChevronUnfold10",
-      "unicode": "F369"
-    },
-    {
-      "name": "ChevronFold10",
-      "unicode": "F36A"
-    },
-    {
-      "name": "DoubleChevronDown8",
-      "unicode": "F36B"
-    },
-    {
-      "name": "DoubleChevronUp8",
-      "unicode": "F36C"
-    },
-    {
-      "name": "DoubleChevronLeft8",
-      "unicode": "F36D"
-    },
-    {
-      "name": "DoubleChevronRight8",
-      "unicode": "F36E"
-    },
-    {
-      "name": "ChevronDownEnd6",
-      "unicode": "F36F"
-    },
-    {
-      "name": "ChevronUpEnd6",
-      "unicode": "F370"
-    },
-    {
-      "name": "ChevronLeftEnd6",
-      "unicode": "F371"
-    },
-    {
-      "name": "ChevronRightEnd6",
-      "unicode": "F372"
-    },
-    {
-      "name": "AzureAPIManagement",
-      "unicode": "F37F"
-    },
-    {
-      "name": "AzureServiceEndpoint",
-      "unicode": "F380"
-    },
-    {
-      "name": "VSTSLogo",
-      "unicode": "F381"
-    },
-    {
-      "name": "VSTSAltLogo1",
-      "unicode": "F382"
-    },
-    {
-      "name": "VSTSAltLogo2",
-      "unicode": "F383"
-    },
-    {
-      "name": "FileTypeSolution",
-      "unicode": "F387"
-    },
-    {
-      "name": "WordLogoInverse16",
-      "unicode": "F390"
-    },
-    {
-      "name": "WordLogo16",
-      "unicode": "F391"
-    },
-    {
-      "name": "WordLogoFill16",
-      "unicode": "F392"
-    },
-    {
-      "name": "PowerPointLogoInverse16",
-      "unicode": "F393"
-    },
-    {
-      "name": "PowerPointLogo16",
-      "unicode": "F394"
-    },
-    {
-      "name": "PowerPointLogoFill16",
-      "unicode": "F395"
-    },
-    {
-      "name": "ExcelLogoInverse16",
-      "unicode": "F396"
-    },
-    {
-      "name": "ExcelLogo16",
-      "unicode": "F397"
-    },
-    {
-      "name": "ExcelLogoFill16",
-      "unicode": "F398"
-    },
-    {
-      "name": "OneNoteLogoInverse16",
-      "unicode": "F399"
-    },
-    {
-      "name": "OneNoteLogo16",
-      "unicode": "F39A"
-    },
-    {
-      "name": "OneNoteLogoFill16",
-      "unicode": "F39B"
-    },
-    {
-      "name": "OutlookLogoInverse16",
-      "unicode": "F39C"
-    },
-    {
-      "name": "OutlookLogo16",
-      "unicode": "F39D"
-    },
-    {
-      "name": "OutlookLogoFill16",
-      "unicode": "F39E"
-    },
-    {
-      "name": "PublisherLogoInverse16",
-      "unicode": "F39F"
-    },
-    {
-      "name": "PublisherLogo16",
-      "unicode": "F3A0"
-    },
-    {
-      "name": "PublisherLogoFill16",
-      "unicode": "F3A1"
-    },
-    {
-      "name": "VisioLogoInverse16",
-      "unicode": "F3A2"
-    },
-    {
-      "name": "VisioLogo16",
-      "unicode": "F3A3"
-    },
-    {
-      "name": "VisioLogoFill16",
-      "unicode": "F3A4"
-    },
-    {
-      "name": "TestBeaker",
-      "unicode": "F3A5"
-    },
-    {
-      "name": "TestBeakerSolid",
-      "unicode": "F3A6"
-    },
-    {
-      "name": "TestExploreSolid",
-      "unicode": "F3A7"
-    },
-    {
-      "name": "TestAutoSolid",
-      "unicode": "F3A8"
-    },
-    {
-      "name": "TestUserSolid",
-      "unicode": "F3A9"
-    },
-    {
-      "name": "TestImpactSolid",
-      "unicode": "F3AA"
-    },
-    {
-      "name": "TestPlan",
-      "unicode": "F3AB"
-    },
-    {
-      "name": "TestStep",
-      "unicode": "F3AC"
-    },
-    {
-      "name": "TestParameter",
-      "unicode": "F3AD"
-    },
-    {
-      "name": "TestSuite",
-      "unicode": "F3AE"
-    },
-    {
-      "name": "TestCase",
-      "unicode": "F3AF"
-    },
-    {
-      "name": "Sprint",
-      "unicode": "F3B0"
-    },
-    {
-      "name": "SignOut",
-      "unicode": "F3B1"
-    },
-    {
-      "name": "TriggerApproval",
-      "unicode": "F3B2"
-    },
-    {
-      "name": "Rocket",
-      "unicode": "F3B3"
-    },
-    {
-      "name": "AzureKeyVault",
-      "unicode": "F3B4"
-    },
-    {
-      "name": "LikeSolid",
-      "unicode": "F3BF"
-    },
-    {
-      "name": "DislikeSolid",
-      "unicode": "F3C0"
-    },
-    {
-      "name": "DeclineCall",
-      "unicode": "F405"
-    },
-    {
-      "name": "Spacer",
-      "unicode": "F40D"
-    },
-    {
-      "name": "SkypeLogo16",
-      "unicode": "F40E"
-    },
-    {
-      "name": "SkypeForBusinessLogo16",
-      "unicode": "F40F"
-    },
-    {
-      "name": "SkypeForBusinessLogoFill16",
-      "unicode": "F410"
-    },
-    {
-      "name": "FilterSolid",
-      "unicode": "F412"
-    },
-    {
-      "name": "MailUndelivered",
-      "unicode": "F415"
-    },
-    {
-      "name": "MailTentative",
-      "unicode": "F416"
-    },
-    {
-      "name": "MailTentativeMirrored",
-      "unicode": "F417"
-    },
-    {
-      "name": "MailReminder",
-      "unicode": "F418"
-    },
-    {
-      "name": "ReceiptUndelivered",
-      "unicode": "F419"
-    },
-    {
-      "name": "ReceiptTentative",
-      "unicode": "F41A"
-    },
-    {
-      "name": "ReceiptTentativeMirrored",
-      "unicode": "F41B"
-    },
-    {
-      "name": "Inbox",
-      "unicode": "F41C"
-    },
-    {
-      "name": "IRMReply",
-      "unicode": "F41D"
-    }
-  ]
+	"fontName": "fabric-icons-10",
+	"fontFamilyName": "FabricMDL2Icons-10",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "DiffInline",
+			"unicode": "F309"
+		},
+		{
+			"name": "DiffSideBySide",
+			"unicode": "F30A"
+		},
+		{
+			"name": "ImageDiff",
+			"unicode": "F30B"
+		},
+		{
+			"name": "ImagePixel",
+			"unicode": "F30C"
+		},
+		{
+			"name": "FileBug",
+			"unicode": "F30D"
+		},
+		{
+			"name": "FileCode",
+			"unicode": "F30E"
+		},
+		{
+			"name": "FileComment",
+			"unicode": "F30F"
+		},
+		{
+			"name": "BusinessHoursSign",
+			"unicode": "F310"
+		},
+		{
+			"name": "FileImage",
+			"unicode": "F311"
+		},
+		{
+			"name": "FileSymlink",
+			"unicode": "F312"
+		},
+		{
+			"name": "AutoFillTemplate",
+			"unicode": "F313"
+		},
+		{
+			"name": "WorkItem",
+			"unicode": "F314"
+		},
+		{
+			"name": "WorkItemBug",
+			"unicode": "F315"
+		},
+		{
+			"name": "LogRemove",
+			"unicode": "F316"
+		},
+		{
+			"name": "ColumnOptions",
+			"unicode": "F317"
+		},
+		{
+			"name": "Packages",
+			"unicode": "F318"
+		},
+		{
+			"name": "BuildIssue",
+			"unicode": "F319"
+		},
+		{
+			"name": "AssessmentGroup",
+			"unicode": "F31A"
+		},
+		{
+			"name": "VariableGroup",
+			"unicode": "F31B"
+		},
+		{
+			"name": "FullHistory",
+			"unicode": "F31C"
+		},
+		{
+			"name": "SingleColumnEdit",
+			"unicode": "F321"
+		},
+		{
+			"name": "DoubleColumnEdit",
+			"unicode": "F322"
+		},
+		{
+			"name": "TripleColumnEdit",
+			"unicode": "F323"
+		},
+		{
+			"name": "ColumnLeftTwoThirdsEdit",
+			"unicode": "F324"
+		},
+		{
+			"name": "ColumnRightTwoThirdsEdit",
+			"unicode": "F325"
+		},
+		{
+			"name": "StreamLogo",
+			"unicode": "F329"
+		},
+		{
+			"name": "AlertSolid",
+			"unicode": "F331"
+		},
+		{
+			"name": "MegaphoneSolid",
+			"unicode": "F332"
+		},
+		{
+			"name": "TaskSolid",
+			"unicode": "F333"
+		},
+		{
+			"name": "ConfigurationSolid",
+			"unicode": "F334"
+		},
+		{
+			"name": "BugSolid",
+			"unicode": "F335"
+		},
+		{
+			"name": "CrownSolid",
+			"unicode": "F336"
+		},
+		{
+			"name": "Trophy2Solid",
+			"unicode": "F337"
+		},
+		{
+			"name": "QuickNoteSolid",
+			"unicode": "F338"
+		},
+		{
+			"name": "ConstructionConeSolid",
+			"unicode": "F339"
+		},
+		{
+			"name": "PageListSolid",
+			"unicode": "F33A"
+		},
+		{
+			"name": "PageListMirroredSolid",
+			"unicode": "F33B"
+		},
+		{
+			"name": "StarburstSolid",
+			"unicode": "F33C"
+		},
+		{
+			"name": "ReadingModeSolid",
+			"unicode": "F33D"
+		},
+		{
+			"name": "SadSolid",
+			"unicode": "F33E"
+		},
+		{
+			"name": "HealthSolid",
+			"unicode": "F33F"
+		},
+		{
+			"name": "ShieldSolid",
+			"unicode": "F340"
+		},
+		{
+			"name": "GiftBoxSolid",
+			"unicode": "F341"
+		},
+		{
+			"name": "ShoppingCartSolid",
+			"unicode": "F342"
+		},
+		{
+			"name": "MailSolid",
+			"unicode": "F343"
+		},
+		{
+			"name": "ChatSolid",
+			"unicode": "F344"
+		},
+		{
+			"name": "RibbonSolid",
+			"unicode": "F345"
+		},
+		{
+			"name": "FinancialSolid",
+			"unicode": "F346"
+		},
+		{
+			"name": "FinancialMirroredSolid",
+			"unicode": "F347"
+		},
+		{
+			"name": "HeadsetSolid",
+			"unicode": "F348"
+		},
+		{
+			"name": "PermissionsSolid",
+			"unicode": "F349"
+		},
+		{
+			"name": "ParkingSolid",
+			"unicode": "F34A"
+		},
+		{
+			"name": "ParkingMirroredSolid",
+			"unicode": "F34B"
+		},
+		{
+			"name": "DiamondSolid",
+			"unicode": "F34C"
+		},
+		{
+			"name": "AsteriskSolid",
+			"unicode": "F34D"
+		},
+		{
+			"name": "OfflineStorageSolid",
+			"unicode": "F34E"
+		},
+		{
+			"name": "BankSolid",
+			"unicode": "F34F"
+		},
+		{
+			"name": "DecisionSolid",
+			"unicode": "F350"
+		},
+		{
+			"name": "Parachute",
+			"unicode": "F351"
+		},
+		{
+			"name": "ParachuteSolid",
+			"unicode": "F352"
+		},
+		{
+			"name": "FiltersSolid",
+			"unicode": "F353"
+		},
+		{
+			"name": "ColorSolid",
+			"unicode": "F354"
+		},
+		{
+			"name": "ReviewSolid",
+			"unicode": "F355"
+		},
+		{
+			"name": "ReviewRequestSolid",
+			"unicode": "F356"
+		},
+		{
+			"name": "ReviewRequestMirroredSolid",
+			"unicode": "F357"
+		},
+		{
+			"name": "ReviewResponseSolid",
+			"unicode": "F358"
+		},
+		{
+			"name": "FeedbackRequestSolid",
+			"unicode": "F359"
+		},
+		{
+			"name": "FeedbackRequestMirroredSolid",
+			"unicode": "F35A"
+		},
+		{
+			"name": "FeedbackResponseSolid",
+			"unicode": "F35B"
+		},
+		{
+			"name": "WorkItemBar",
+			"unicode": "F35C"
+		},
+		{
+			"name": "WorkItemBarSolid",
+			"unicode": "F35D"
+		},
+		{
+			"name": "Separator",
+			"unicode": "F35E"
+		},
+		{
+			"name": "NavigateExternalInline",
+			"unicode": "F35F"
+		},
+		{
+			"name": "PlanView",
+			"unicode": "F360"
+		},
+		{
+			"name": "TimelineMatrixView",
+			"unicode": "F361"
+		},
+		{
+			"name": "EngineeringGroup",
+			"unicode": "F362"
+		},
+		{
+			"name": "ProjectCollection",
+			"unicode": "F363"
+		},
+		{
+			"name": "CaretBottomRightCenter8",
+			"unicode": "F364"
+		},
+		{
+			"name": "CaretBottomLeftCenter8",
+			"unicode": "F365"
+		},
+		{
+			"name": "CaretTopRightCenter8",
+			"unicode": "F366"
+		},
+		{
+			"name": "CaretTopLeftCenter8",
+			"unicode": "F367"
+		},
+		{
+			"name": "DonutChart",
+			"unicode": "F368"
+		},
+		{
+			"name": "ChevronUnfold10",
+			"unicode": "F369"
+		},
+		{
+			"name": "ChevronFold10",
+			"unicode": "F36A"
+		},
+		{
+			"name": "DoubleChevronDown8",
+			"unicode": "F36B"
+		},
+		{
+			"name": "DoubleChevronUp8",
+			"unicode": "F36C"
+		},
+		{
+			"name": "DoubleChevronLeft8",
+			"unicode": "F36D"
+		},
+		{
+			"name": "DoubleChevronRight8",
+			"unicode": "F36E"
+		},
+		{
+			"name": "ChevronDownEnd6",
+			"unicode": "F36F"
+		},
+		{
+			"name": "ChevronUpEnd6",
+			"unicode": "F370"
+		},
+		{
+			"name": "ChevronLeftEnd6",
+			"unicode": "F371"
+		},
+		{
+			"name": "ChevronRightEnd6",
+			"unicode": "F372"
+		},
+		{
+			"name": "EgnyteLogo",
+			"unicode": "F373"
+		},
+		{
+			"name": "GoogleDriveLogoLeftGreen",
+			"unicode": "F374"
+		},
+		{
+			"name": "GoogleDriveLogoBottomBlue",
+			"unicode": "F375"
+		},
+		{
+			"name": "GoogleDriveLogoRightYellow",
+			"unicode": "F376"
+		},
+		{
+			"name": "ContextMenu",
+			"unicode": "F37C"
+		},
+		{
+			"name": "AzureAPIManagement",
+			"unicode": "F37F"
+		},
+		{
+			"name": "AzureServiceEndpoint",
+			"unicode": "F380"
+		},
+		{
+			"name": "VSTSLogo",
+			"unicode": "F381"
+		}
+	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-11.json b/packages/icons/config/fabric-icons-11.json
index 89181f7e50c81..9067084096c1f 100644
--- a/packages/icons/config/fabric-icons-11.json
+++ b/packages/icons/config/fabric-icons-11.json
@@ -1,348 +1,412 @@
 {
-  "fontName": "fabric-icons-11",
-  "fontFamilyName": "FabricMDL2Icons-11",
-  "excludeGlyphs": false,
-  "chunkSubsets": true,
-  "hashFontFileName": true,
-  "subsetChunkSettings": {
-    "maxSubsetSize": 100
-  },
-  "glyphs": [
-    {
-      "name": "IRMReplyMirrored",
-      "unicode": "F41E"
-    },
-    {
-      "name": "IRMForward",
-      "unicode": "F41F"
-    },
-    {
-      "name": "IRMForwardMirrored",
-      "unicode": "F420"
-    },
-    {
-      "name": "VoicemailIRM",
-      "unicode": "F421"
-    },
-    {
-      "name": "EventAccepted",
-      "unicode": "F422"
-    },
-    {
-      "name": "EventTentative",
-      "unicode": "F423"
-    },
-    {
-      "name": "EventTentativeMirrored",
-      "unicode": "F424"
-    },
-    {
-      "name": "EventDeclined",
-      "unicode": "F425"
-    },
-    {
-      "name": "IDBadge",
-      "unicode": "F427"
-    },
-    {
-      "name": "OfficeFormsLogoInverse16",
-      "unicode": "F433"
-    },
-    {
-      "name": "OfficeFormsLogo",
-      "unicode": "F434"
-    },
-    {
-      "name": "OfficeFormsLogoFill",
-      "unicode": "F435"
-    },
-    {
-      "name": "OfficeFormsLogo16",
-      "unicode": "F436"
-    },
-    {
-      "name": "OfficeFormsLogoFill16",
-      "unicode": "F437"
-    },
-    {
-      "name": "OfficeFormsLogoInverse24",
-      "unicode": "F43A"
-    },
-    {
-      "name": "OfficeFormsLogo24",
-      "unicode": "F43B"
-    },
-    {
-      "name": "OfficeFormsLogoFill24",
-      "unicode": "F43C"
-    },
-    {
-      "name": "PageLock",
-      "unicode": "F43F"
-    },
-    {
-      "name": "NotExecuted",
-      "unicode": "F440"
-    },
-    {
-      "name": "NotImpactedSolid",
-      "unicode": "F441"
-    },
-    {
-      "name": "FieldReadOnly",
-      "unicode": "F442"
-    },
-    {
-      "name": "FieldRequired",
-      "unicode": "F443"
-    },
-    {
-      "name": "BacklogBoard",
-      "unicode": "F444"
-    },
-    {
-      "name": "ExternalBuild",
-      "unicode": "F445"
-    },
-    {
-      "name": "ExternalTFVC",
-      "unicode": "F446"
-    },
-    {
-      "name": "ExternalXAML",
-      "unicode": "F447"
-    },
-    {
-      "name": "IssueSolid",
-      "unicode": "F448"
-    },
-    {
-      "name": "DefectSolid",
-      "unicode": "F449"
-    },
-    {
-      "name": "LadybugSolid",
-      "unicode": "F44A"
-    },
-    {
-      "name": "MTMLogo",
-      "unicode": "F44B"
-    },
-    {
-      "name": "NugetLogo",
-      "unicode": "F44C"
-    },
-    {
-      "name": "TFVCLogo",
-      "unicode": "F44D"
-    },
-    {
-      "name": "ProjectLogo32",
-      "unicode": "F47E"
-    },
-    {
-      "name": "ProjectLogoFill32",
-      "unicode": "F47F"
-    },
-    {
-      "name": "ProjectLogo16",
-      "unicode": "F480"
-    },
-    {
-      "name": "ProjectLogoFill16",
-      "unicode": "F481"
-    },
-    {
-      "name": "SwayLogo32",
-      "unicode": "F482"
-    },
-    {
-      "name": "SwayLogoFill32",
-      "unicode": "F483"
-    },
-    {
-      "name": "SwayLogo16",
-      "unicode": "F484"
-    },
-    {
-      "name": "SwayLogoFill16",
-      "unicode": "F485"
-    },
-    {
-      "name": "ClassNotebookLogo32",
-      "unicode": "F486"
-    },
-    {
-      "name": "ClassNotebookLogoFill32",
-      "unicode": "F487"
-    },
-    {
-      "name": "ClassNotebookLogo16",
-      "unicode": "F488"
-    },
-    {
-      "name": "ClassNotebookLogoFill16",
-      "unicode": "F489"
-    },
-    {
-      "name": "ClassNotebookLogoInverse32",
-      "unicode": "F48A"
-    },
-    {
-      "name": "ClassNotebookLogoInverse16",
-      "unicode": "F48B"
-    },
-    {
-      "name": "StaffNotebookLogo32",
-      "unicode": "F48C"
-    },
-    {
-      "name": "StaffNotebookLogoFill32",
-      "unicode": "F48D"
-    },
-    {
-      "name": "StaffNotebookLogo16",
-      "unicode": "F48E"
-    },
-    {
-      "name": "StaffNotebookLogoFill16",
-      "unicode": "F48F"
-    },
-    {
-      "name": "StaffNotebookLogoInverted32",
-      "unicode": "F490"
-    },
-    {
-      "name": "StaffNotebookLogoInverted16",
-      "unicode": "F491"
-    },
-    {
-      "name": "KaizalaLogo",
-      "unicode": "F492"
-    },
-    {
-      "name": "TaskLogo",
-      "unicode": "F493"
-    },
-    {
-      "name": "ProtectionCenterLogo32",
-      "unicode": "F494"
-    },
-    {
-      "name": "NonprofitLogo32",
-      "unicode": "F495"
-    },
-    {
-      "name": "GallatinLogo",
-      "unicode": "F496"
-    },
-    {
-      "name": "Globe2",
-      "unicode": "F49A"
-    },
-    {
-      "name": "Guitar",
-      "unicode": "F49B"
-    },
-    {
-      "name": "Breakfast",
-      "unicode": "F49C"
-    },
-    {
-      "name": "Brunch",
-      "unicode": "F49D"
-    },
-    {
-      "name": "BeerMug",
-      "unicode": "F49E"
-    },
-    {
-      "name": "Vacation",
-      "unicode": "F49F"
-    },
-    {
-      "name": "Teeth",
-      "unicode": "F4A0"
-    },
-    {
-      "name": "Taxi",
-      "unicode": "F4A1"
-    },
-    {
-      "name": "Chopsticks",
-      "unicode": "F4A2"
-    },
-    {
-      "name": "SyncOccurence",
-      "unicode": "F4A3"
-    },
-    {
-      "name": "UnsyncOccurence",
-      "unicode": "F4A4"
-    },
-    {
-      "name": "PrimaryCalendar",
-      "unicode": "F4AE"
-    },
-    {
-      "name": "SearchCalendar",
-      "unicode": "F4AF"
-    },
-    {
-      "name": "VideoOff",
-      "unicode": "F4B0"
-    },
-    {
-      "name": "MicrosoftFlowLogo",
-      "unicode": "F4B1"
-    },
-    {
-      "name": "BusinessCenterLogo",
-      "unicode": "F4B2"
-    },
-    {
-      "name": "ToDoLogoBottom",
-      "unicode": "F4B3"
-    },
-    {
-      "name": "ToDoLogoTop",
-      "unicode": "F4B4"
-    },
-    {
-      "name": "EditSolid12",
-      "unicode": "F4B5"
-    },
-    {
-      "name": "EditSolidMirrored12",
-      "unicode": "F4B6"
-    },
-    {
-      "name": "UneditableSolid12",
-      "unicode": "F4B7"
-    },
-    {
-      "name": "UneditableSolidMirrored12",
-      "unicode": "F4B8"
-    },
-    {
-      "name": "UneditableMirrored",
-      "unicode": "F4B9"
-    },
-    {
-      "name": "AdminALogo32",
-      "unicode": "F4BA"
-    },
-    {
-      "name": "AdminALogoFill32",
-      "unicode": "F4BB"
-    },
-    {
-      "name": "ToDoLogoInverse",
-      "unicode": "F4BC"
-    },
-    {
-      "name": "Snooze",
-      "unicode": "F4BD"
-    }
-  ]
+	"fontName": "fabric-icons-11",
+	"fontFamilyName": "FabricMDL2Icons-11",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "VSTSAltLogo1",
+			"unicode": "F382"
+		},
+		{
+			"name": "VSTSAltLogo2",
+			"unicode": "F383"
+		},
+		{
+			"name": "FileTypeSolution",
+			"unicode": "F387"
+		},
+		{
+			"name": "WordLogoInverse16",
+			"unicode": "F390"
+		},
+		{
+			"name": "WordLogo16",
+			"unicode": "F391"
+		},
+		{
+			"name": "WordLogoFill16",
+			"unicode": "F392"
+		},
+		{
+			"name": "PowerPointLogoInverse16",
+			"unicode": "F393"
+		},
+		{
+			"name": "PowerPointLogo16",
+			"unicode": "F394"
+		},
+		{
+			"name": "PowerPointLogoFill16",
+			"unicode": "F395"
+		},
+		{
+			"name": "ExcelLogoInverse16",
+			"unicode": "F396"
+		},
+		{
+			"name": "ExcelLogo16",
+			"unicode": "F397"
+		},
+		{
+			"name": "ExcelLogoFill16",
+			"unicode": "F398"
+		},
+		{
+			"name": "OneNoteLogoInverse16",
+			"unicode": "F399"
+		},
+		{
+			"name": "OneNoteLogo16",
+			"unicode": "F39A"
+		},
+		{
+			"name": "OneNoteLogoFill16",
+			"unicode": "F39B"
+		},
+		{
+			"name": "OutlookLogoInverse16",
+			"unicode": "F39C"
+		},
+		{
+			"name": "OutlookLogo16",
+			"unicode": "F39D"
+		},
+		{
+			"name": "OutlookLogoFill16",
+			"unicode": "F39E"
+		},
+		{
+			"name": "PublisherLogoInverse16",
+			"unicode": "F39F"
+		},
+		{
+			"name": "PublisherLogo16",
+			"unicode": "F3A0"
+		},
+		{
+			"name": "PublisherLogoFill16",
+			"unicode": "F3A1"
+		},
+		{
+			"name": "VisioLogoInverse16",
+			"unicode": "F3A2"
+		},
+		{
+			"name": "VisioLogo16",
+			"unicode": "F3A3"
+		},
+		{
+			"name": "VisioLogoFill16",
+			"unicode": "F3A4"
+		},
+		{
+			"name": "TestBeaker",
+			"unicode": "F3A5"
+		},
+		{
+			"name": "TestBeakerSolid",
+			"unicode": "F3A6"
+		},
+		{
+			"name": "TestExploreSolid",
+			"unicode": "F3A7"
+		},
+		{
+			"name": "TestAutoSolid",
+			"unicode": "F3A8"
+		},
+		{
+			"name": "TestUserSolid",
+			"unicode": "F3A9"
+		},
+		{
+			"name": "TestImpactSolid",
+			"unicode": "F3AA"
+		},
+		{
+			"name": "TestPlan",
+			"unicode": "F3AB"
+		},
+		{
+			"name": "TestStep",
+			"unicode": "F3AC"
+		},
+		{
+			"name": "TestParameter",
+			"unicode": "F3AD"
+		},
+		{
+			"name": "TestSuite",
+			"unicode": "F3AE"
+		},
+		{
+			"name": "TestCase",
+			"unicode": "F3AF"
+		},
+		{
+			"name": "Sprint",
+			"unicode": "F3B0"
+		},
+		{
+			"name": "SignOut",
+			"unicode": "F3B1"
+		},
+		{
+			"name": "TriggerApproval",
+			"unicode": "F3B2"
+		},
+		{
+			"name": "Rocket",
+			"unicode": "F3B3"
+		},
+		{
+			"name": "AzureKeyVault",
+			"unicode": "F3B4"
+		},
+		{
+			"name": "Transition",
+			"unicode": "F3BC"
+		},
+		{
+			"name": "LikeSolid",
+			"unicode": "F3BF"
+		},
+		{
+			"name": "DislikeSolid",
+			"unicode": "F3C0"
+		},
+		{
+			"name": "DeclineCall",
+			"unicode": "F405"
+		},
+		{
+			"name": "RectangularClipping",
+			"unicode": "F407"
+		},
+		{
+			"name": "Spacer",
+			"unicode": "F40D"
+		},
+		{
+			"name": "SkypeLogo16",
+			"unicode": "F40E"
+		},
+		{
+			"name": "SkypeForBusinessLogo16",
+			"unicode": "F40F"
+		},
+		{
+			"name": "SkypeForBusinessLogoFill16",
+			"unicode": "F410"
+		},
+		{
+			"name": "FilterSolid",
+			"unicode": "F412"
+		},
+		{
+			"name": "MailUndelivered",
+			"unicode": "F415"
+		},
+		{
+			"name": "MailTentative",
+			"unicode": "F416"
+		},
+		{
+			"name": "MailTentativeMirrored",
+			"unicode": "F417"
+		},
+		{
+			"name": "MailReminder",
+			"unicode": "F418"
+		},
+		{
+			"name": "ReceiptUndelivered",
+			"unicode": "F419"
+		},
+		{
+			"name": "ReceiptTentative",
+			"unicode": "F41A"
+		},
+		{
+			"name": "ReceiptTentativeMirrored",
+			"unicode": "F41B"
+		},
+		{
+			"name": "Inbox",
+			"unicode": "F41C"
+		},
+		{
+			"name": "IRMReply",
+			"unicode": "F41D"
+		},
+		{
+			"name": "IRMReplyMirrored",
+			"unicode": "F41E"
+		},
+		{
+			"name": "IRMForward",
+			"unicode": "F41F"
+		},
+		{
+			"name": "IRMForwardMirrored",
+			"unicode": "F420"
+		},
+		{
+			"name": "VoicemailIRM",
+			"unicode": "F421"
+		},
+		{
+			"name": "EventAccepted",
+			"unicode": "F422"
+		},
+		{
+			"name": "EventTentative",
+			"unicode": "F423"
+		},
+		{
+			"name": "EventTentativeMirrored",
+			"unicode": "F424"
+		},
+		{
+			"name": "EventDeclined",
+			"unicode": "F425"
+		},
+		{
+			"name": "IDBadge",
+			"unicode": "F427"
+		},
+		{
+			"name": "BackgroundColor",
+			"unicode": "F42B"
+		},
+		{
+			"name": "OfficeFormsLogoInverse16",
+			"unicode": "F433"
+		},
+		{
+			"name": "OfficeFormsLogo",
+			"unicode": "F434"
+		},
+		{
+			"name": "OfficeFormsLogoFill",
+			"unicode": "F435"
+		},
+		{
+			"name": "OfficeFormsLogo16",
+			"unicode": "F436"
+		},
+		{
+			"name": "OfficeFormsLogoFill16",
+			"unicode": "F437"
+		},
+		{
+			"name": "OfficeFormsLogoInverse24",
+			"unicode": "F43A"
+		},
+		{
+			"name": "OfficeFormsLogo24",
+			"unicode": "F43B"
+		},
+		{
+			"name": "OfficeFormsLogoFill24",
+			"unicode": "F43C"
+		},
+		{
+			"name": "PageLock",
+			"unicode": "F43F"
+		},
+		{
+			"name": "NotExecuted",
+			"unicode": "F440"
+		},
+		{
+			"name": "NotImpactedSolid",
+			"unicode": "F441"
+		},
+		{
+			"name": "FieldReadOnly",
+			"unicode": "F442"
+		},
+		{
+			"name": "FieldRequired",
+			"unicode": "F443"
+		},
+		{
+			"name": "BacklogBoard",
+			"unicode": "F444"
+		},
+		{
+			"name": "ExternalBuild",
+			"unicode": "F445"
+		},
+		{
+			"name": "ExternalTFVC",
+			"unicode": "F446"
+		},
+		{
+			"name": "ExternalXAML",
+			"unicode": "F447"
+		},
+		{
+			"name": "IssueSolid",
+			"unicode": "F448"
+		},
+		{
+			"name": "DefectSolid",
+			"unicode": "F449"
+		},
+		{
+			"name": "LadybugSolid",
+			"unicode": "F44A"
+		},
+		{
+			"name": "MTMLogo",
+			"unicode": "F44B"
+		},
+		{
+			"name": "NugetLogo",
+			"unicode": "F44C"
+		},
+		{
+			"name": "TFVCLogo",
+			"unicode": "F44D"
+		},
+		{
+			"name": "ProjectLogo32",
+			"unicode": "F47E"
+		},
+		{
+			"name": "ProjectLogoFill32",
+			"unicode": "F47F"
+		},
+		{
+			"name": "ProjectLogo16",
+			"unicode": "F480"
+		},
+		{
+			"name": "ProjectLogoFill16",
+			"unicode": "F481"
+		},
+		{
+			"name": "SwayLogo32",
+			"unicode": "F482"
+		},
+		{
+			"name": "SwayLogoFill32",
+			"unicode": "F483"
+		},
+		{
+			"name": "SwayLogo16",
+			"unicode": "F484"
+		},
+		{
+			"name": "SwayLogoFill16",
+			"unicode": "F485"
+		}
+	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-12.json b/packages/icons/config/fabric-icons-12.json
new file mode 100644
index 0000000000000..221828001e99c
--- /dev/null
+++ b/packages/icons/config/fabric-icons-12.json
@@ -0,0 +1,412 @@
+{
+	"fontName": "fabric-icons-12",
+	"fontFamilyName": "FabricMDL2Icons-12",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "ClassNotebookLogo32",
+			"unicode": "F486"
+		},
+		{
+			"name": "ClassNotebookLogoFill32",
+			"unicode": "F487"
+		},
+		{
+			"name": "ClassNotebookLogo16",
+			"unicode": "F488"
+		},
+		{
+			"name": "ClassNotebookLogoFill16",
+			"unicode": "F489"
+		},
+		{
+			"name": "ClassNotebookLogoInverse32",
+			"unicode": "F48A"
+		},
+		{
+			"name": "ClassNotebookLogoInverse16",
+			"unicode": "F48B"
+		},
+		{
+			"name": "StaffNotebookLogo32",
+			"unicode": "F48C"
+		},
+		{
+			"name": "StaffNotebookLogoFill32",
+			"unicode": "F48D"
+		},
+		{
+			"name": "StaffNotebookLogo16",
+			"unicode": "F48E"
+		},
+		{
+			"name": "StaffNotebookLogoFill16",
+			"unicode": "F48F"
+		},
+		{
+			"name": "StaffNotebookLogoInverted32",
+			"unicode": "F490"
+		},
+		{
+			"name": "StaffNotebookLogoInverted16",
+			"unicode": "F491"
+		},
+		{
+			"name": "KaizalaLogo",
+			"unicode": "F492"
+		},
+		{
+			"name": "TaskLogo",
+			"unicode": "F493"
+		},
+		{
+			"name": "ProtectionCenterLogo32",
+			"unicode": "F494"
+		},
+		{
+			"name": "NonprofitLogo32",
+			"unicode": "F495"
+		},
+		{
+			"name": "GallatinLogo",
+			"unicode": "F496"
+		},
+		{
+			"name": "Globe2",
+			"unicode": "F49A"
+		},
+		{
+			"name": "Guitar",
+			"unicode": "F49B"
+		},
+		{
+			"name": "Breakfast",
+			"unicode": "F49C"
+		},
+		{
+			"name": "Brunch",
+			"unicode": "F49D"
+		},
+		{
+			"name": "BeerMug",
+			"unicode": "F49E"
+		},
+		{
+			"name": "Vacation",
+			"unicode": "F49F"
+		},
+		{
+			"name": "Teeth",
+			"unicode": "F4A0"
+		},
+		{
+			"name": "Taxi",
+			"unicode": "F4A1"
+		},
+		{
+			"name": "Chopsticks",
+			"unicode": "F4A2"
+		},
+		{
+			"name": "SyncOccurence",
+			"unicode": "F4A3"
+		},
+		{
+			"name": "UnsyncOccurence",
+			"unicode": "F4A4"
+		},
+		{
+			"name": "PrimaryCalendar",
+			"unicode": "F4AE"
+		},
+		{
+			"name": "SearchCalendar",
+			"unicode": "F4AF"
+		},
+		{
+			"name": "VideoOff",
+			"unicode": "F4B0"
+		},
+		{
+			"name": "MicrosoftFlowLogo",
+			"unicode": "F4B1"
+		},
+		{
+			"name": "BusinessCenterLogo",
+			"unicode": "F4B2"
+		},
+		{
+			"name": "ToDoLogoBottom",
+			"unicode": "F4B3"
+		},
+		{
+			"name": "ToDoLogoTop",
+			"unicode": "F4B4"
+		},
+		{
+			"name": "EditSolid12",
+			"unicode": "F4B5"
+		},
+		{
+			"name": "EditSolidMirrored12",
+			"unicode": "F4B6"
+		},
+		{
+			"name": "UneditableSolid12",
+			"unicode": "F4B7"
+		},
+		{
+			"name": "UneditableSolidMirrored12",
+			"unicode": "F4B8"
+		},
+		{
+			"name": "UneditableMirrored",
+			"unicode": "F4B9"
+		},
+		{
+			"name": "AdminALogo32",
+			"unicode": "F4BA"
+		},
+		{
+			"name": "AdminALogoFill32",
+			"unicode": "F4BB"
+		},
+		{
+			"name": "ToDoLogoInverse",
+			"unicode": "F4BC"
+		},
+		{
+			"name": "Snooze",
+			"unicode": "F4BD"
+		},
+		{
+			"name": "WaffleOffice365",
+			"unicode": "F4E0"
+		},
+		{
+			"name": "ImageSearch",
+			"unicode": "F4E8"
+		},
+		{
+			"name": "NewsSearch",
+			"unicode": "F4E9"
+		},
+		{
+			"name": "VideoSearch",
+			"unicode": "F4EA"
+		},
+		{
+			"name": "R",
+			"unicode": "F4EB"
+		},
+		{
+			"name": "FontColorA",
+			"unicode": "F4EC"
+		},
+		{
+			"name": "FontColorSwatch",
+			"unicode": "F4ED"
+		},
+		{
+			"name": "LightWeight",
+			"unicode": "F4EE"
+		},
+		{
+			"name": "NormalWeight",
+			"unicode": "F4EF"
+		},
+		{
+			"name": "SemiboldWeight",
+			"unicode": "F4F0"
+		},
+		{
+			"name": "GroupObject",
+			"unicode": "F4F1"
+		},
+		{
+			"name": "UngroupObject",
+			"unicode": "F4F2"
+		},
+		{
+			"name": "AlignHorizontalLeft",
+			"unicode": "F4F3"
+		},
+		{
+			"name": "AlignHorizontalCenter",
+			"unicode": "F4F4"
+		},
+		{
+			"name": "AlignHorizontalRight",
+			"unicode": "F4F5"
+		},
+		{
+			"name": "AlignVerticalTop",
+			"unicode": "F4F6"
+		},
+		{
+			"name": "AlignVerticalCenter",
+			"unicode": "F4F7"
+		},
+		{
+			"name": "AlignVerticalBottom",
+			"unicode": "F4F8"
+		},
+		{
+			"name": "HorizontalDistributeCenter",
+			"unicode": "F4F9"
+		},
+		{
+			"name": "VerticalDistributeCenter",
+			"unicode": "F4FA"
+		},
+		{
+			"name": "Ellipse",
+			"unicode": "F4FB"
+		},
+		{
+			"name": "Line",
+			"unicode": "F4FC"
+		},
+		{
+			"name": "Octagon",
+			"unicode": "F4FD"
+		},
+		{
+			"name": "Hexagon",
+			"unicode": "F4FE"
+		},
+		{
+			"name": "Pentagon",
+			"unicode": "F4FF"
+		},
+		{
+			"name": "RightTriangle",
+			"unicode": "F500"
+		},
+		{
+			"name": "HalfCircle",
+			"unicode": "F501"
+		},
+		{
+			"name": "QuarterCircle",
+			"unicode": "F502"
+		},
+		{
+			"name": "ThreeQuarterCircle",
+			"unicode": "F503"
+		},
+		{
+			"name": "6PointStar",
+			"unicode": "F504"
+		},
+		{
+			"name": "12PointStar",
+			"unicode": "F505"
+		},
+		{
+			"name": "ArrangeBringToFront",
+			"unicode": "F506"
+		},
+		{
+			"name": "ArrangeSendToBack",
+			"unicode": "F507"
+		},
+		{
+			"name": "ArrangeSendBackward",
+			"unicode": "F508"
+		},
+		{
+			"name": "ArrangeBringForward",
+			"unicode": "F509"
+		},
+		{
+			"name": "BorderDash",
+			"unicode": "F50A"
+		},
+		{
+			"name": "BorderDot",
+			"unicode": "F50B"
+		},
+		{
+			"name": "LineStyle",
+			"unicode": "F50C"
+		},
+		{
+			"name": "LineThickness",
+			"unicode": "F50D"
+		},
+		{
+			"name": "WindowEdit",
+			"unicode": "F50E"
+		},
+		{
+			"name": "HintText",
+			"unicode": "F50F"
+		},
+		{
+			"name": "MediaAdd",
+			"unicode": "F510"
+		},
+		{
+			"name": "AnchorLock",
+			"unicode": "F511"
+		},
+		{
+			"name": "AutoHeight",
+			"unicode": "F512"
+		},
+		{
+			"name": "ChartSeries",
+			"unicode": "F513"
+		},
+		{
+			"name": "ChartXAngle",
+			"unicode": "F514"
+		},
+		{
+			"name": "ChartYAngle",
+			"unicode": "F515"
+		},
+		{
+			"name": "Combobox",
+			"unicode": "F516"
+		},
+		{
+			"name": "LineSpacing",
+			"unicode": "F517"
+		},
+		{
+			"name": "Padding",
+			"unicode": "F518"
+		},
+		{
+			"name": "PaddingTop",
+			"unicode": "F519"
+		},
+		{
+			"name": "PaddingBottom",
+			"unicode": "F51A"
+		},
+		{
+			"name": "PaddingLeft",
+			"unicode": "F51B"
+		},
+		{
+			"name": "PaddingRight",
+			"unicode": "F51C"
+		},
+		{
+			"name": "NavigationFlipper",
+			"unicode": "F51D"
+		},
+		{
+			"name": "AlignJustify",
+			"unicode": "F51E"
+		}
+	]
+}
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-13.json b/packages/icons/config/fabric-icons-13.json
new file mode 100644
index 0000000000000..73d02a787039a
--- /dev/null
+++ b/packages/icons/config/fabric-icons-13.json
@@ -0,0 +1,412 @@
+{
+	"fontName": "fabric-icons-13",
+	"fontFamilyName": "FabricMDL2Icons-13",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "TextOverflow",
+			"unicode": "F51F"
+		},
+		{
+			"name": "VisualsFolder",
+			"unicode": "F520"
+		},
+		{
+			"name": "VisualsStore",
+			"unicode": "F521"
+		},
+		{
+			"name": "PictureCenter",
+			"unicode": "F522"
+		},
+		{
+			"name": "PictureFill",
+			"unicode": "F523"
+		},
+		{
+			"name": "PicturePosition",
+			"unicode": "F524"
+		},
+		{
+			"name": "PictureStretch",
+			"unicode": "F525"
+		},
+		{
+			"name": "PictureTile",
+			"unicode": "F526"
+		},
+		{
+			"name": "Slider",
+			"unicode": "F527"
+		},
+		{
+			"name": "SliderHandleSize",
+			"unicode": "F528"
+		},
+		{
+			"name": "DefaultRatio",
+			"unicode": "F529"
+		},
+		{
+			"name": "NumberSequence",
+			"unicode": "F52A"
+		},
+		{
+			"name": "GUID",
+			"unicode": "F52B"
+		},
+		{
+			"name": "ReportAdd",
+			"unicode": "F52C"
+		},
+		{
+			"name": "DashboardAdd",
+			"unicode": "F52D"
+		},
+		{
+			"name": "MapPinSolid",
+			"unicode": "F52E"
+		},
+		{
+			"name": "WebPublish",
+			"unicode": "F52F"
+		},
+		{
+			"name": "PieSingleSolid",
+			"unicode": "F530"
+		},
+		{
+			"name": "BlockedSolid",
+			"unicode": "F531"
+		},
+		{
+			"name": "DrillDown",
+			"unicode": "F532"
+		},
+		{
+			"name": "DrillDownSolid",
+			"unicode": "F533"
+		},
+		{
+			"name": "DrillExpand",
+			"unicode": "F534"
+		},
+		{
+			"name": "DrillShow",
+			"unicode": "F535"
+		},
+		{
+			"name": "OneDriveFolder16",
+			"unicode": "F53B"
+		},
+		{
+			"name": "ChronosLogo",
+			"unicode": "F541"
+		},
+		{
+			"name": "FunctionalManagerDashboard",
+			"unicode": "F542"
+		},
+		{
+			"name": "BIDashboard",
+			"unicode": "F543"
+		},
+		{
+			"name": "CodeEdit",
+			"unicode": "F544"
+		},
+		{
+			"name": "RenewalCurrent",
+			"unicode": "F545"
+		},
+		{
+			"name": "RenewalFuture",
+			"unicode": "F546"
+		},
+		{
+			"name": "SplitObject",
+			"unicode": "F547"
+		},
+		{
+			"name": "BulkUpload",
+			"unicode": "F548"
+		},
+		{
+			"name": "DownloadDocument",
+			"unicode": "F549"
+		},
+		{
+			"name": "WaitlistConfirm",
+			"unicode": "F550"
+		},
+		{
+			"name": "WaitlistConfirmMirrored",
+			"unicode": "F551"
+		},
+		{
+			"name": "LaptopSecure",
+			"unicode": "F552"
+		},
+		{
+			"name": "DragObject",
+			"unicode": "F553"
+		},
+		{
+			"name": "EntryView",
+			"unicode": "F554"
+		},
+		{
+			"name": "EntryDecline",
+			"unicode": "F555"
+		},
+		{
+			"name": "ContactCardSettings",
+			"unicode": "F556"
+		},
+		{
+			"name": "ContactCardSettingsMirrored",
+			"unicode": "F557"
+		},
+		{
+			"name": "CalendarSettings",
+			"unicode": "F558"
+		},
+		{
+			"name": "CalendarSettingsMirrored",
+			"unicode": "F559"
+		},
+		{
+			"name": "HardDriveLock",
+			"unicode": "F55A"
+		},
+		{
+			"name": "HardDriveUnlock",
+			"unicode": "F55B"
+		},
+		{
+			"name": "AccountManagement",
+			"unicode": "F55C"
+		},
+		{
+			"name": "TransitionPop",
+			"unicode": "F5B2"
+		},
+		{
+			"name": "TransitionPush",
+			"unicode": "F5B3"
+		},
+		{
+			"name": "TransitionEffect",
+			"unicode": "F5B4"
+		},
+		{
+			"name": "LookupEntities",
+			"unicode": "F5B5"
+		},
+		{
+			"name": "ExploreData",
+			"unicode": "F5B6"
+		},
+		{
+			"name": "AddBookmark",
+			"unicode": "F5B7"
+		},
+		{
+			"name": "SearchBookmark",
+			"unicode": "F5B8"
+		},
+		{
+			"name": "DrillThrough",
+			"unicode": "F5B9"
+		},
+		{
+			"name": "MasterDatabase",
+			"unicode": "F5BA"
+		},
+		{
+			"name": "CertifiedDatabase",
+			"unicode": "F5BB"
+		},
+		{
+			"name": "MaximumValue",
+			"unicode": "F5BC"
+		},
+		{
+			"name": "MinimumValue",
+			"unicode": "F5BD"
+		},
+		{
+			"name": "VisualStudioIDELogo32",
+			"unicode": "F5D0"
+		},
+		{
+			"name": "ApacheIvyLogo32",
+			"unicode": "F5D1"
+		},
+		{
+			"name": "BitbucketLogo32",
+			"unicode": "F5D2"
+		},
+		{
+			"name": "LinuxLogo32",
+			"unicode": "F5D3"
+		},
+		{
+			"name": "GradleLogo32",
+			"unicode": "F5D4"
+		},
+		{
+			"name": "PasteAsText",
+			"unicode": "F5D5"
+		},
+		{
+			"name": "PasteAsCode",
+			"unicode": "F5D6"
+		},
+		{
+			"name": "BrowserTab",
+			"unicode": "F5D7"
+		},
+		{
+			"name": "BrowserTabScreenshot",
+			"unicode": "F5D8"
+		},
+		{
+			"name": "DesktopScreenshot",
+			"unicode": "F5D9"
+		},
+		{
+			"name": "FileYML",
+			"unicode": "F5DA"
+		},
+		{
+			"name": "ClipboardSolid",
+			"unicode": "F5DC"
+		},
+		{
+			"name": "AnalyticsView",
+			"unicode": "F5F1"
+		},
+		{
+			"name": "Leave",
+			"unicode": "F627"
+		},
+		{
+			"name": "Trending12",
+			"unicode": "F62D"
+		},
+		{
+			"name": "Blocked12",
+			"unicode": "F62E"
+		},
+		{
+			"name": "Warning12",
+			"unicode": "F62F"
+		},
+		{
+			"name": "CheckedOutByOther12",
+			"unicode": "F630"
+		},
+		{
+			"name": "CheckedOutByYou12",
+			"unicode": "F631"
+		},
+		{
+			"name": "CircleShapeSolid",
+			"unicode": "F63C"
+		},
+		{
+			"name": "SquareShapeSolid",
+			"unicode": "F63D"
+		},
+		{
+			"name": "TriangleShapeSolid",
+			"unicode": "F63E"
+		},
+		{
+			"name": "DropShapeSolid",
+			"unicode": "F63F"
+		},
+		{
+			"name": "InsertColumnsLeft",
+			"unicode": "F64A"
+		},
+		{
+			"name": "InsertColumnsRight",
+			"unicode": "F64B"
+		},
+		{
+			"name": "InsertRowsAbove",
+			"unicode": "F64C"
+		},
+		{
+			"name": "InsertRowsBelow",
+			"unicode": "F64D"
+		},
+		{
+			"name": "DeleteColumns",
+			"unicode": "F64E"
+		},
+		{
+			"name": "DeleteRows",
+			"unicode": "F64F"
+		},
+		{
+			"name": "DeleteRowsMirrored",
+			"unicode": "F650"
+		},
+		{
+			"name": "DeleteTable",
+			"unicode": "F651"
+		},
+		{
+			"name": "GitLogo",
+			"unicode": "F65D"
+		},
+		{
+			"name": "GitHubLogo",
+			"unicode": "F65E"
+		},
+		{
+			"name": "ApacheMavenLogo",
+			"unicode": "F65F"
+		},
+		{
+			"name": "NPMLogo",
+			"unicode": "F660"
+		},
+		{
+			"name": "GitFork",
+			"unicode": "F661"
+		},
+		{
+			"name": "SVNLogo",
+			"unicode": "F662"
+		},
+		{
+			"name": "JenkinsLogo",
+			"unicode": "F663"
+		},
+		{
+			"name": "VersionControlPush",
+			"unicode": "F664"
+		},
+		{
+			"name": "ExternalGit",
+			"unicode": "F665"
+		},
+		{
+			"name": "InsertSignatureLine",
+			"unicode": "F677"
+		},
+		{
+			"name": "ArrangeByFrom",
+			"unicode": "F678"
+		}
+	]
+}
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-14.json b/packages/icons/config/fabric-icons-14.json
new file mode 100644
index 0000000000000..3040a07465fc4
--- /dev/null
+++ b/packages/icons/config/fabric-icons-14.json
@@ -0,0 +1,20 @@
+{
+	"fontName": "fabric-icons-14",
+	"fontFamilyName": "FabricMDL2Icons-14",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "Phishing",
+			"unicode": "F679"
+		},
+		{
+			"name": "CreateMailRule",
+			"unicode": "F67A"
+		}
+	]
+}
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-2.json b/packages/icons/config/fabric-icons-2.json
index 4740337c3f9b6..8bd6865dcaadf 100644
--- a/packages/icons/config/fabric-icons-2.json
+++ b/packages/icons/config/fabric-icons-2.json
@@ -1,412 +1,412 @@
 {
-  "fontName": "fabric-icons-2",
-  "fontFamilyName": "FabricMDL2Icons-2",
-  "excludeGlyphs": false,
-  "chunkSubsets": true,
-  "hashFontFileName": true,
-  "subsetChunkSettings": {
-    "maxSubsetSize": 100
-  },
-  "glyphs": [
-    {
-      "name": "Fingerprint",
-      "unicode": "E928"
-    },
-    {
-      "name": "Handwriting",
-      "unicode": "E929"
-    },
-    {
-      "name": "StackIndicator",
-      "unicode": "E7FF"
-    },
-    {
-      "name": "Completed",
-      "unicode": "E930"
-    },
-    {
-      "name": "Label",
-      "unicode": "E932"
-    },
-    {
-      "name": "FlickDown",
-      "unicode": "E935"
-    },
-    {
-      "name": "FlickUp",
-      "unicode": "E936"
-    },
-    {
-      "name": "FlickLeft",
-      "unicode": "E937"
-    },
-    {
-      "name": "FlickRight",
-      "unicode": "E938"
-    },
-    {
-      "name": "Streaming",
-      "unicode": "E93E"
-    },
-    {
-      "name": "MusicInCollection",
-      "unicode": "E940"
-    },
-    {
-      "name": "OneDrive",
-      "unicode": "E941"
-    },
-    {
-      "name": "CompassNW",
-      "unicode": "E942"
-    },
-    {
-      "name": "Code",
-      "unicode": "E943"
-    },
-    {
-      "name": "LightningBolt",
-      "unicode": "E945"
-    },
-    {
-      "name": "CalculatorMultiply",
-      "unicode": "E947"
-    },
-    {
-      "name": "CalculatorAddition",
-      "unicode": "E948"
-    },
-    {
-      "name": "CalculatorSubtract",
-      "unicode": "E949"
-    },
-    {
-      "name": "CalculatorEqualTo",
-      "unicode": "E94E"
-    },
-    {
-      "name": "PrintfaxPrinterFile",
-      "unicode": "E956"
-    },
-    {
-      "name": "Communications",
-      "unicode": "E95A"
-    },
-    {
-      "name": "Headset",
-      "unicode": "E95B"
-    },
-    {
-      "name": "Health",
-      "unicode": "E95E"
-    },
-    {
-      "name": "ChevronUpSmall",
-      "unicode": "E96D"
-    },
-    {
-      "name": "ChevronDownSmall",
-      "unicode": "E96E"
-    },
-    {
-      "name": "ChevronLeftSmall",
-      "unicode": "E96F"
-    },
-    {
-      "name": "ChevronRightSmall",
-      "unicode": "E970"
-    },
-    {
-      "name": "ChevronUpMed",
-      "unicode": "E971"
-    },
-    {
-      "name": "ChevronDownMed",
-      "unicode": "E972"
-    },
-    {
-      "name": "ChevronLeftMed",
-      "unicode": "E973"
-    },
-    {
-      "name": "ChevronRightMed",
-      "unicode": "E974"
-    },
-    {
-      "name": "Dictionary",
-      "unicode": "E82D"
-    },
-    {
-      "name": "ChromeBack",
-      "unicode": "E830"
-    },
-    {
-      "name": "PC1",
-      "unicode": "E977"
-    },
-    {
-      "name": "PresenceChickletVideo",
-      "unicode": "E979"
-    },
-    {
-      "name": "Reply",
-      "unicode": "E97A"
-    },
-    {
-      "name": "HalfAlpha",
-      "unicode": "E97E"
-    },
-    {
-      "name": "LockSolid",
-      "unicode": "E9A2"
-    },
-    {
-      "name": "ConstructionCone",
-      "unicode": "E98F"
-    },
-    {
-      "name": "DoubleChevronLeftMed",
-      "unicode": "E991"
-    },
-    {
-      "name": "Volume0",
-      "unicode": "E992"
-    },
-    {
-      "name": "Volume1",
-      "unicode": "E993"
-    },
-    {
-      "name": "Volume2",
-      "unicode": "E994"
-    },
-    {
-      "name": "Volume3",
-      "unicode": "E995"
-    },
-    {
-      "name": "CaretHollow",
-      "unicode": "E817"
-    },
-    {
-      "name": "CaretSolid",
-      "unicode": "E818"
-    },
-    {
-      "name": "FolderOpen",
-      "unicode": "E838"
-    },
-    {
-      "name": "PinnedFill",
-      "unicode": "E842"
-    },
-    {
-      "name": "Chart",
-      "unicode": "E999"
-    },
-    {
-      "name": "Robot",
-      "unicode": "E99A"
-    },
-    {
-      "name": "BidiLtr",
-      "unicode": "E9AA"
-    },
-    {
-      "name": "BidiRtl",
-      "unicode": "E9AB"
-    },
-    {
-      "name": "RevToggleKey",
-      "unicode": "E845"
-    },
-    {
-      "name": "RightDoubleQuote",
-      "unicode": "E9B1"
-    },
-    {
-      "name": "Sunny",
-      "unicode": "E9BD"
-    },
-    {
-      "name": "CloudWeather",
-      "unicode": "E9BE"
-    },
-    {
-      "name": "Cloudy",
-      "unicode": "E9BF"
-    },
-    {
-      "name": "PartlyCloudyDay",
-      "unicode": "E9C0"
-    },
-    {
-      "name": "PartlyCloudyNight",
-      "unicode": "E9C1"
-    },
-    {
-      "name": "ClearNight",
-      "unicode": "E9C2"
-    },
-    {
-      "name": "RainShowersDay",
-      "unicode": "E9C3"
-    },
-    {
-      "name": "Rain",
-      "unicode": "E9C4"
-    },
-    {
-      "name": "Thunderstorms",
-      "unicode": "E9C6"
-    },
-    {
-      "name": "RainSnow",
-      "unicode": "E9C7"
-    },
-    {
-      "name": "Snow",
-      "unicode": "E9C8"
-    },
-    {
-      "name": "BlowingSnow",
-      "unicode": "E9C9"
-    },
-    {
-      "name": "Frigid",
-      "unicode": "E9CA"
-    },
-    {
-      "name": "Fog",
-      "unicode": "E9CB"
-    },
-    {
-      "name": "Squalls",
-      "unicode": "E9CC"
-    },
-    {
-      "name": "Duststorm",
-      "unicode": "E9CD"
-    },
-    {
-      "name": "Unknown",
-      "unicode": "E9CE"
-    },
-    {
-      "name": "Precipitation",
-      "unicode": "E9CF"
-    },
-    {
-      "name": "Ringer",
-      "unicode": "EA8F"
-    },
-    {
-      "name": "PDF",
-      "unicode": "EA90"
-    },
-    {
-      "name": "Ribbon",
-      "unicode": "E9D1"
-    },
-    {
-      "name": "AreaChart",
-      "unicode": "E9D2"
-    },
-    {
-      "name": "Assign",
-      "unicode": "E9D3"
-    },
-    {
-      "name": "CheckList",
-      "unicode": "E9D5"
-    },
-    {
-      "name": "Diagnostic",
-      "unicode": "E9D9"
-    },
-    {
-      "name": "Generate",
-      "unicode": "E9DA"
-    },
-    {
-      "name": "LineChart",
-      "unicode": "E9E6"
-    },
-    {
-      "name": "Equalizer",
-      "unicode": "E9E9"
-    },
-    {
-      "name": "BarChartHorizontal",
-      "unicode": "E9EB"
-    },
-    {
-      "name": "BarChartVertical",
-      "unicode": "E9EC"
-    },
-    {
-      "name": "Freezing",
-      "unicode": "E9EF"
-    },
-    {
-      "name": "Processing",
-      "unicode": "E9F5"
-    },
-    {
-      "name": "SnowShowerDay",
-      "unicode": "E9FD"
-    },
-    {
-      "name": "HailDay",
-      "unicode": "EA00"
-    },
-    {
-      "name": "WorkFlow",
-      "unicode": "EA01"
-    },
-    {
-      "name": "StoreLogoMed",
-      "unicode": "EA04"
-    },
-    {
-      "name": "TriangleSolid",
-      "unicode": "EA08"
-    },
-    {
-      "name": "RainShowersNight",
-      "unicode": "EA0F"
-    },
-    {
-      "name": "SnowShowerNight",
-      "unicode": "EA11"
-    },
-    {
-      "name": "HailNight",
-      "unicode": "EA13"
-    },
-    {
-      "name": "Info2",
-      "unicode": "EA1F"
-    },
-    {
-      "name": "StoreLogo",
-      "unicode": "EA96"
-    },
-    {
-      "name": "MultiSelectMirrored",
-      "unicode": "EA98"
-    },
-    {
-      "name": "Broom",
-      "unicode": "EA99"
-    },
-    {
-      "name": "MusicInCollectionFill",
-      "unicode": "EA36"
-    },
-    {
-      "name": "Asterisk",
-      "unicode": "EA38"
-    }
-  ]
+	"fontName": "fabric-icons-2",
+	"fontFamilyName": "FabricMDL2Icons-2",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "Comment",
+			"unicode": "E90A"
+		},
+		{
+			"name": "DockLeft",
+			"unicode": "E90C"
+		},
+		{
+			"name": "DockRight",
+			"unicode": "E90D"
+		},
+		{
+			"name": "Repair",
+			"unicode": "E90F"
+		},
+		{
+			"name": "Accounts",
+			"unicode": "E910"
+		},
+		{
+			"name": "RadioBullet",
+			"unicode": "E915"
+		},
+		{
+			"name": "Stopwatch",
+			"unicode": "E916"
+		},
+		{
+			"name": "Clock",
+			"unicode": "E917"
+		},
+		{
+			"name": "WorldClock",
+			"unicode": "E918"
+		},
+		{
+			"name": "AlarmClock",
+			"unicode": "E919"
+		},
+		{
+			"name": "Hospital",
+			"unicode": "E91D"
+		},
+		{
+			"name": "Timer",
+			"unicode": "E91E"
+		},
+		{
+			"name": "FullCircleMask",
+			"unicode": "E91F"
+		},
+		{
+			"name": "LocationFill",
+			"unicode": "E920"
+		},
+		{
+			"name": "ChromeMinimize",
+			"unicode": "E921"
+		},
+		{
+			"name": "Annotation",
+			"unicode": "E924"
+		},
+		{
+			"name": "Fingerprint",
+			"unicode": "E928"
+		},
+		{
+			"name": "Handwriting",
+			"unicode": "E929"
+		},
+		{
+			"name": "Completed",
+			"unicode": "E930"
+		},
+		{
+			"name": "Label",
+			"unicode": "E932"
+		},
+		{
+			"name": "FlickDown",
+			"unicode": "E935"
+		},
+		{
+			"name": "FlickUp",
+			"unicode": "E936"
+		},
+		{
+			"name": "FlickLeft",
+			"unicode": "E937"
+		},
+		{
+			"name": "FlickRight",
+			"unicode": "E938"
+		},
+		{
+			"name": "MiniExpand",
+			"unicode": "E93A"
+		},
+		{
+			"name": "MiniContract",
+			"unicode": "E93B"
+		},
+		{
+			"name": "Streaming",
+			"unicode": "E93E"
+		},
+		{
+			"name": "MusicInCollection",
+			"unicode": "E940"
+		},
+		{
+			"name": "OneDrive",
+			"unicode": "E941"
+		},
+		{
+			"name": "CompassNW",
+			"unicode": "E942"
+		},
+		{
+			"name": "Code",
+			"unicode": "E943"
+		},
+		{
+			"name": "LightningBolt",
+			"unicode": "E945"
+		},
+		{
+			"name": "CalculatorMultiply",
+			"unicode": "E947"
+		},
+		{
+			"name": "CalculatorAddition",
+			"unicode": "E948"
+		},
+		{
+			"name": "CalculatorSubtract",
+			"unicode": "E949"
+		},
+		{
+			"name": "CalculatorEqualTo",
+			"unicode": "E94E"
+		},
+		{
+			"name": "PrintfaxPrinterFile",
+			"unicode": "E956"
+		},
+		{
+			"name": "Communications",
+			"unicode": "E95A"
+		},
+		{
+			"name": "Headset",
+			"unicode": "E95B"
+		},
+		{
+			"name": "Health",
+			"unicode": "E95E"
+		},
+		{
+			"name": "ChevronUpSmall",
+			"unicode": "E96D"
+		},
+		{
+			"name": "ChevronDownSmall",
+			"unicode": "E96E"
+		},
+		{
+			"name": "ChevronLeftSmall",
+			"unicode": "E96F"
+		},
+		{
+			"name": "ChevronRightSmall",
+			"unicode": "E970"
+		},
+		{
+			"name": "ChevronUpMed",
+			"unicode": "E971"
+		},
+		{
+			"name": "ChevronDownMed",
+			"unicode": "E972"
+		},
+		{
+			"name": "ChevronLeftMed",
+			"unicode": "E973"
+		},
+		{
+			"name": "ChevronRightMed",
+			"unicode": "E974"
+		},
+		{
+			"name": "PC1",
+			"unicode": "E977"
+		},
+		{
+			"name": "PresenceChickletVideo",
+			"unicode": "E979"
+		},
+		{
+			"name": "Reply",
+			"unicode": "E97A"
+		},
+		{
+			"name": "HalfAlpha",
+			"unicode": "E97E"
+		},
+		{
+			"name": "ConstructionCone",
+			"unicode": "E98F"
+		},
+		{
+			"name": "DoubleChevronLeftMed",
+			"unicode": "E991"
+		},
+		{
+			"name": "Volume0",
+			"unicode": "E992"
+		},
+		{
+			"name": "Volume1",
+			"unicode": "E993"
+		},
+		{
+			"name": "Volume2",
+			"unicode": "E994"
+		},
+		{
+			"name": "Volume3",
+			"unicode": "E995"
+		},
+		{
+			"name": "Chart",
+			"unicode": "E999"
+		},
+		{
+			"name": "Robot",
+			"unicode": "E99A"
+		},
+		{
+			"name": "LockSolid",
+			"unicode": "E9A2"
+		},
+		{
+			"name": "BidiLtr",
+			"unicode": "E9AA"
+		},
+		{
+			"name": "BidiRtl",
+			"unicode": "E9AB"
+		},
+		{
+			"name": "RightDoubleQuote",
+			"unicode": "E9B1"
+		},
+		{
+			"name": "Sunny",
+			"unicode": "E9BD"
+		},
+		{
+			"name": "CloudWeather",
+			"unicode": "E9BE"
+		},
+		{
+			"name": "Cloudy",
+			"unicode": "E9BF"
+		},
+		{
+			"name": "PartlyCloudyDay",
+			"unicode": "E9C0"
+		},
+		{
+			"name": "PartlyCloudyNight",
+			"unicode": "E9C1"
+		},
+		{
+			"name": "ClearNight",
+			"unicode": "E9C2"
+		},
+		{
+			"name": "RainShowersDay",
+			"unicode": "E9C3"
+		},
+		{
+			"name": "Rain",
+			"unicode": "E9C4"
+		},
+		{
+			"name": "Thunderstorms",
+			"unicode": "E9C6"
+		},
+		{
+			"name": "RainSnow",
+			"unicode": "E9C7"
+		},
+		{
+			"name": "Snow",
+			"unicode": "E9C8"
+		},
+		{
+			"name": "BlowingSnow",
+			"unicode": "E9C9"
+		},
+		{
+			"name": "Frigid",
+			"unicode": "E9CA"
+		},
+		{
+			"name": "Fog",
+			"unicode": "E9CB"
+		},
+		{
+			"name": "Squalls",
+			"unicode": "E9CC"
+		},
+		{
+			"name": "Duststorm",
+			"unicode": "E9CD"
+		},
+		{
+			"name": "Unknown",
+			"unicode": "E9CE"
+		},
+		{
+			"name": "Precipitation",
+			"unicode": "E9CF"
+		},
+		{
+			"name": "Ribbon",
+			"unicode": "E9D1"
+		},
+		{
+			"name": "AreaChart",
+			"unicode": "E9D2"
+		},
+		{
+			"name": "Assign",
+			"unicode": "E9D3"
+		},
+		{
+			"name": "CheckList",
+			"unicode": "E9D5"
+		},
+		{
+			"name": "Diagnostic",
+			"unicode": "E9D9"
+		},
+		{
+			"name": "Generate",
+			"unicode": "E9DA"
+		},
+		{
+			"name": "LineChart",
+			"unicode": "E9E6"
+		},
+		{
+			"name": "Equalizer",
+			"unicode": "E9E9"
+		},
+		{
+			"name": "BarChartHorizontal",
+			"unicode": "E9EB"
+		},
+		{
+			"name": "BarChartVertical",
+			"unicode": "E9EC"
+		},
+		{
+			"name": "Freezing",
+			"unicode": "E9EF"
+		},
+		{
+			"name": "Processing",
+			"unicode": "E9F5"
+		},
+		{
+			"name": "SnowShowerDay",
+			"unicode": "E9FD"
+		},
+		{
+			"name": "HailDay",
+			"unicode": "EA00"
+		},
+		{
+			"name": "WorkFlow",
+			"unicode": "EA01"
+		},
+		{
+			"name": "HourGlass",
+			"unicode": "EA03"
+		},
+		{
+			"name": "StoreLogoMed20",
+			"unicode": "EA04"
+		},
+		{
+			"name": "TimeSheet",
+			"unicode": "EA05"
+		}
+	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-3.json b/packages/icons/config/fabric-icons-3.json
index dc4c3665aadaa..588abc9f72e8e 100644
--- a/packages/icons/config/fabric-icons-3.json
+++ b/packages/icons/config/fabric-icons-3.json
@@ -1,412 +1,412 @@
 {
-  "fontName": "fabric-icons-3",
-  "fontFamilyName": "FabricMDL2Icons-3",
-  "excludeGlyphs": false,
-  "chunkSubsets": true,
-  "hashFontFileName": true,
-  "subsetChunkSettings": {
-    "maxSubsetSize": 100
-  },
-  "glyphs": [
-    {
-      "name": "ErrorBadge",
-      "unicode": "EA39"
-    },
-    {
-      "name": "CircleFill",
-      "unicode": "EA3B"
-    },
-    {
-      "name": "Record2",
-      "unicode": "EA3F"
-    },
-    {
-      "name": "BookmarksMirrored",
-      "unicode": "EA41"
-    },
-    {
-      "name": "BulletedListMirrored",
-      "unicode": "EA42"
-    },
-    {
-      "name": "CaretHollowMirrored",
-      "unicode": "EA45"
-    },
-    {
-      "name": "CaretSolidMirrored",
-      "unicode": "EA46"
-    },
-    {
-      "name": "ChromeBackMirrored",
-      "unicode": "EA47"
-    },
-    {
-      "name": "ClosePaneMirrored",
-      "unicode": "EA49"
-    },
-    {
-      "name": "DockLeftMirrored",
-      "unicode": "EA4C"
-    },
-    {
-      "name": "DoubleChevronLeftMedMirrored",
-      "unicode": "EA4D"
-    },
-    {
-      "name": "HelpMirrored",
-      "unicode": "EA51"
-    },
-    {
-      "name": "ImportMirrored",
-      "unicode": "EA52"
-    },
-    {
-      "name": "ListMirrored",
-      "unicode": "EA55"
-    },
-    {
-      "name": "MailForwardMirrored",
-      "unicode": "EA56"
-    },
-    {
-      "name": "MailReplyMirrored",
-      "unicode": "EA57"
-    },
-    {
-      "name": "MailReplyAllMirrored",
-      "unicode": "EA58"
-    },
-    {
-      "name": "OpenPaneMirrored",
-      "unicode": "EA5B"
-    },
-    {
-      "name": "ParkingLocationMirrored",
-      "unicode": "EA5E"
-    },
-    {
-      "name": "SendMirrored",
-      "unicode": "EA63"
-    },
-    {
-      "name": "ShowResultsMirrored",
-      "unicode": "EA65"
-    },
-    {
-      "name": "ThumbnailViewMirrored",
-      "unicode": "EA67"
-    },
-    {
-      "name": "Devices3",
-      "unicode": "EA6C"
-    },
-    {
-      "name": "Lightbulb",
-      "unicode": "EA80"
-    },
-    {
-      "name": "StatusTriangle",
-      "unicode": "EA82"
-    },
-    {
-      "name": "VolumeDisabled",
-      "unicode": "EA85"
-    },
-    {
-      "name": "Puzzle",
-      "unicode": "EA86"
-    },
-    {
-      "name": "EmojiNeutral",
-      "unicode": "EA87"
-    },
-    {
-      "name": "EmojiDisappointed",
-      "unicode": "EA88"
-    },
-    {
-      "name": "HomeSolid",
-      "unicode": "EA8A"
-    },
-    {
-      "name": "Cocktails",
-      "unicode": "EA9D"
-    },
-    {
-      "name": "Wines",
-      "unicode": "EABF"
-    },
-    {
-      "name": "Articles",
-      "unicode": "EAC1"
-    },
-    {
-      "name": "Cycling",
-      "unicode": "EAC7"
-    },
-    {
-      "name": "DietPlanNotebook",
-      "unicode": "EAC8"
-    },
-    {
-      "name": "Pill",
-      "unicode": "EACB"
-    },
-    {
-      "name": "ExerciseTracker",
-      "unicode": "EACC"
-    },
-    {
-      "name": "Medical",
-      "unicode": "EAD4"
-    },
-    {
-      "name": "Running",
-      "unicode": "EADA"
-    },
-    {
-      "name": "Weights",
-      "unicode": "EADB"
-    },
-    {
-      "name": "BarChart4",
-      "unicode": "EAE7"
-    },
-    {
-      "name": "CirclePlus",
-      "unicode": "EAEE"
-    },
-    {
-      "name": "Coffee",
-      "unicode": "EAEF"
-    },
-    {
-      "name": "Cotton",
-      "unicode": "EAF3"
-    },
-    {
-      "name": "Market",
-      "unicode": "EAFC"
-    },
-    {
-      "name": "Money",
-      "unicode": "EAFD"
-    },
-    {
-      "name": "PieDouble",
-      "unicode": "EB04"
-    },
-    {
-      "name": "PieSingle",
-      "unicode": "EB05"
-    },
-    {
-      "name": "RemoveFilter",
-      "unicode": "EB08"
-    },
-    {
-      "name": "Savings",
-      "unicode": "EB0B"
-    },
-    {
-      "name": "StockDown",
-      "unicode": "EB0F"
-    },
-    {
-      "name": "StockUp",
-      "unicode": "EB11"
-    },
-    {
-      "name": "MSNVideos",
-      "unicode": "EB1C"
-    },
-    {
-      "name": "Cricket",
-      "unicode": "EB1E"
-    },
-    {
-      "name": "Golf",
-      "unicode": "EB1F"
-    },
-    {
-      "name": "Baseball",
-      "unicode": "EB20"
-    },
-    {
-      "name": "Soccer",
-      "unicode": "EB21"
-    },
-    {
-      "name": "MoreSports",
-      "unicode": "EB22"
-    },
-    {
-      "name": "AutoRacing",
-      "unicode": "EB24"
-    },
-    {
-      "name": "CollegeHoops",
-      "unicode": "EB25"
-    },
-    {
-      "name": "CollegeFootball",
-      "unicode": "EB26"
-    },
-    {
-      "name": "ProFootball",
-      "unicode": "EB27"
-    },
-    {
-      "name": "ProHockey",
-      "unicode": "EB28"
-    },
-    {
-      "name": "Rugby",
-      "unicode": "EB2D"
-    },
-    {
-      "name": "Tennis",
-      "unicode": "EB33"
-    },
-    {
-      "name": "Arrivals",
-      "unicode": "EB34"
-    },
-    {
-      "name": "Design",
-      "unicode": "EB3C"
-    },
-    {
-      "name": "Website",
-      "unicode": "EB41"
-    },
-    {
-      "name": "Drop",
-      "unicode": "EB42"
-    },
-    {
-      "name": "SkiResorts",
-      "unicode": "EB45"
-    },
-    {
-      "name": "Snowflake",
-      "unicode": "EB46"
-    },
-    {
-      "name": "BusSolid",
-      "unicode": "EB47"
-    },
-    {
-      "name": "FerrySolid",
-      "unicode": "EB48"
-    },
-    {
-      "name": "AirplaneSolid",
-      "unicode": "EB4C"
-    },
-    {
-      "name": "TrainSolid",
-      "unicode": "EB4D"
-    },
-    {
-      "name": "Ticket",
-      "unicode": "EB54"
-    },
-    {
-      "name": "Devices4",
-      "unicode": "EB66"
-    },
-    {
-      "name": "AzureLogo",
-      "unicode": "EB6A"
-    },
-    {
-      "name": "BingLogo",
-      "unicode": "EB6B"
-    },
-    {
-      "name": "MSNLogo",
-      "unicode": "EB6C"
-    },
-    {
-      "name": "OutlookLogoInverse",
-      "unicode": "EB6D"
-    },
-    {
-      "name": "OfficeLogo",
-      "unicode": "EB6E"
-    },
-    {
-      "name": "SkypeLogo",
-      "unicode": "EB6F"
-    },
-    {
-      "name": "Door",
-      "unicode": "EB75"
-    },
-    {
-      "name": "EditMirrored",
-      "unicode": "EB7E"
-    },
-    {
-      "name": "GiftCard",
-      "unicode": "EB8E"
-    },
-    {
-      "name": "DoubleBookmark",
-      "unicode": "EB8F"
-    },
-    {
-      "name": "StatusErrorFull",
-      "unicode": "EB90"
-    },
-    {
-      "name": "Certificate",
-      "unicode": "EB95"
-    },
-    {
-      "name": "FastForward",
-      "unicode": "EB9D"
-    },
-    {
-      "name": "Rewind",
-      "unicode": "EB9E"
-    },
-    {
-      "name": "Photo2",
-      "unicode": "EB9F"
-    },
-    {
-      "name": "OpenSource",
-      "unicode": "EBC2"
-    },
-    {
-      "name": "CloudDownload",
-      "unicode": "EBD3"
-    },
-    {
-      "name": "WindDirection",
-      "unicode": "EBE6"
-    },
-    {
-      "name": "Family",
-      "unicode": "EBDA"
-    },
-    {
-      "name": "CSS",
-      "unicode": "EBEF"
-    },
-    {
-      "name": "JS",
-      "unicode": "EBF0"
-    },
-    {
-      "name": "DeliveryTruck",
-      "unicode": "EBF4"
-    },
-    {
-      "name": "ReminderPerson",
-      "unicode": "EBF7"
-    }
-  ]
+	"fontName": "fabric-icons-3",
+	"fontFamilyName": "FabricMDL2Icons-3",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "TriangleSolid",
+			"unicode": "EA08"
+		},
+		{
+			"name": "VideoSolid",
+			"unicode": "EA0C"
+		},
+		{
+			"name": "RainShowersNight",
+			"unicode": "EA0F"
+		},
+		{
+			"name": "SnowShowerNight",
+			"unicode": "EA11"
+		},
+		{
+			"name": "Teamwork",
+			"unicode": "EA12"
+		},
+		{
+			"name": "HailNight",
+			"unicode": "EA13"
+		},
+		{
+			"name": "PeopleAdd",
+			"unicode": "EA15"
+		},
+		{
+			"name": "Glasses",
+			"unicode": "EA16"
+		},
+		{
+			"name": "DateTime2",
+			"unicode": "EA17"
+		},
+		{
+			"name": "Shield",
+			"unicode": "EA18"
+		},
+		{
+			"name": "Header1",
+			"unicode": "EA19"
+		},
+		{
+			"name": "PageAdd",
+			"unicode": "EA1A"
+		},
+		{
+			"name": "NumberedList",
+			"unicode": "EA1C"
+		},
+		{
+			"name": "PowerBILogo",
+			"unicode": "EA1E"
+		},
+		{
+			"name": "Info2",
+			"unicode": "EA1F"
+		},
+		{
+			"name": "MusicInCollectionFill",
+			"unicode": "EA36"
+		},
+		{
+			"name": "Asterisk",
+			"unicode": "EA38"
+		},
+		{
+			"name": "ErrorBadge",
+			"unicode": "EA39"
+		},
+		{
+			"name": "CircleFill",
+			"unicode": "EA3B"
+		},
+		{
+			"name": "Record2",
+			"unicode": "EA3F"
+		},
+		{
+			"name": "BookmarksMirrored",
+			"unicode": "EA41"
+		},
+		{
+			"name": "BulletedListMirrored",
+			"unicode": "EA42"
+		},
+		{
+			"name": "CaretHollowMirrored",
+			"unicode": "EA45"
+		},
+		{
+			"name": "CaretSolidMirrored",
+			"unicode": "EA46"
+		},
+		{
+			"name": "ChromeBackMirrored",
+			"unicode": "EA47"
+		},
+		{
+			"name": "ClosePaneMirrored",
+			"unicode": "EA49"
+		},
+		{
+			"name": "DockLeftMirrored",
+			"unicode": "EA4C"
+		},
+		{
+			"name": "DoubleChevronLeftMedMirrored",
+			"unicode": "EA4D"
+		},
+		{
+			"name": "HelpMirrored",
+			"unicode": "EA51"
+		},
+		{
+			"name": "ImportMirrored",
+			"unicode": "EA52"
+		},
+		{
+			"name": "ListMirrored",
+			"unicode": "EA55"
+		},
+		{
+			"name": "MailForwardMirrored",
+			"unicode": "EA56"
+		},
+		{
+			"name": "MailReplyMirrored",
+			"unicode": "EA57"
+		},
+		{
+			"name": "MailReplyAllMirrored",
+			"unicode": "EA58"
+		},
+		{
+			"name": "OpenPaneMirrored",
+			"unicode": "EA5B"
+		},
+		{
+			"name": "ParkingLocationMirrored",
+			"unicode": "EA5E"
+		},
+		{
+			"name": "SendMirrored",
+			"unicode": "EA63"
+		},
+		{
+			"name": "ShowResultsMirrored",
+			"unicode": "EA65"
+		},
+		{
+			"name": "ThumbnailViewMirrored",
+			"unicode": "EA67"
+		},
+		{
+			"name": "Devices3",
+			"unicode": "EA6C"
+		},
+		{
+			"name": "Lightbulb",
+			"unicode": "EA80"
+		},
+		{
+			"name": "StatusTriangle",
+			"unicode": "EA82"
+		},
+		{
+			"name": "VolumeDisabled",
+			"unicode": "EA85"
+		},
+		{
+			"name": "Puzzle",
+			"unicode": "EA86"
+		},
+		{
+			"name": "EmojiNeutral",
+			"unicode": "EA87"
+		},
+		{
+			"name": "EmojiDisappointed",
+			"unicode": "EA88"
+		},
+		{
+			"name": "HomeSolid",
+			"unicode": "EA8A"
+		},
+		{
+			"name": "Ringer",
+			"unicode": "EA8F"
+		},
+		{
+			"name": "PDF",
+			"unicode": "EA90"
+		},
+		{
+			"name": "HeartBroken",
+			"unicode": "EA92"
+		},
+		{
+			"name": "StoreLogo16",
+			"unicode": "EA96"
+		},
+		{
+			"name": "MultiSelectMirrored",
+			"unicode": "EA98"
+		},
+		{
+			"name": "Broom",
+			"unicode": "EA99"
+		},
+		{
+			"name": "Cocktails",
+			"unicode": "EA9D"
+		},
+		{
+			"name": "Wines",
+			"unicode": "EABF"
+		},
+		{
+			"name": "Articles",
+			"unicode": "EAC1"
+		},
+		{
+			"name": "Cycling",
+			"unicode": "EAC7"
+		},
+		{
+			"name": "DietPlanNotebook",
+			"unicode": "EAC8"
+		},
+		{
+			"name": "Pill",
+			"unicode": "EACB"
+		},
+		{
+			"name": "ExerciseTracker",
+			"unicode": "EACC"
+		},
+		{
+			"name": "HandsFree",
+			"unicode": "EAD0"
+		},
+		{
+			"name": "Medical",
+			"unicode": "EAD4"
+		},
+		{
+			"name": "Running",
+			"unicode": "EADA"
+		},
+		{
+			"name": "Weights",
+			"unicode": "EADB"
+		},
+		{
+			"name": "AddNotes",
+			"unicode": "EAE3"
+		},
+		{
+			"name": "BarChart4",
+			"unicode": "EAE7"
+		},
+		{
+			"name": "CirclePlus",
+			"unicode": "EAEE"
+		},
+		{
+			"name": "Coffee",
+			"unicode": "EAEF"
+		},
+		{
+			"name": "Cotton",
+			"unicode": "EAF3"
+		},
+		{
+			"name": "Market",
+			"unicode": "EAFC"
+		},
+		{
+			"name": "Money",
+			"unicode": "EAFD"
+		},
+		{
+			"name": "PieDouble",
+			"unicode": "EB04"
+		},
+		{
+			"name": "PieSingle",
+			"unicode": "EB05"
+		},
+		{
+			"name": "RemoveFilter",
+			"unicode": "EB08"
+		},
+		{
+			"name": "Savings",
+			"unicode": "EB0B"
+		},
+		{
+			"name": "Sell",
+			"unicode": "EB0C"
+		},
+		{
+			"name": "StockDown",
+			"unicode": "EB0F"
+		},
+		{
+			"name": "StockUp",
+			"unicode": "EB11"
+		},
+		{
+			"name": "Lamp",
+			"unicode": "EB19"
+		},
+		{
+			"name": "MSNVideos",
+			"unicode": "EB1C"
+		},
+		{
+			"name": "Cricket",
+			"unicode": "EB1E"
+		},
+		{
+			"name": "Golf",
+			"unicode": "EB1F"
+		},
+		{
+			"name": "Baseball",
+			"unicode": "EB20"
+		},
+		{
+			"name": "Soccer",
+			"unicode": "EB21"
+		},
+		{
+			"name": "MoreSports",
+			"unicode": "EB22"
+		},
+		{
+			"name": "AutoRacing",
+			"unicode": "EB24"
+		},
+		{
+			"name": "CollegeHoops",
+			"unicode": "EB25"
+		},
+		{
+			"name": "CollegeFootball",
+			"unicode": "EB26"
+		},
+		{
+			"name": "ProFootball",
+			"unicode": "EB27"
+		},
+		{
+			"name": "ProHockey",
+			"unicode": "EB28"
+		},
+		{
+			"name": "Rugby",
+			"unicode": "EB2D"
+		},
+		{
+			"name": "SubstitutionsIn",
+			"unicode": "EB31"
+		},
+		{
+			"name": "Tennis",
+			"unicode": "EB33"
+		},
+		{
+			"name": "Arrivals",
+			"unicode": "EB34"
+		},
+		{
+			"name": "Design",
+			"unicode": "EB3C"
+		},
+		{
+			"name": "Website",
+			"unicode": "EB41"
+		},
+		{
+			"name": "Drop",
+			"unicode": "EB42"
+		},
+		{
+			"name": "SkiResorts",
+			"unicode": "EB45"
+		},
+		{
+			"name": "Snowflake",
+			"unicode": "EB46"
+		},
+		{
+			"name": "BusSolid",
+			"unicode": "EB47"
+		}
+	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-4.json b/packages/icons/config/fabric-icons-4.json
index fa558c24e62ce..91b09abaf0e77 100644
--- a/packages/icons/config/fabric-icons-4.json
+++ b/packages/icons/config/fabric-icons-4.json
@@ -1,396 +1,412 @@
 {
-  "fontName": "fabric-icons-4",
-  "fontFamilyName": "FabricMDL2Icons-4",
-  "excludeGlyphs": false,
-  "chunkSubsets": false,
-  "hashFontFileName": true,
-  "subsetChunkSettings": {
-    "maxSubsetSize": 100
-  },
-  "glyphs": [
-    {
-      "name": "ReminderGroup",
-      "unicode": "EBF8"
-    },
-    {
-      "name": "Umbrella",
-      "unicode": "EC04"
-    },
-    {
-      "name": "NetworkTower",
-      "unicode": "EC05"
-    },
-    {
-      "name": "CityNext",
-      "unicode": "EC06"
-    },
-    {
-      "name": "Section",
-      "unicode": "EC0C"
-    },
-    {
-      "name": "OneNoteLogoInverse",
-      "unicode": "EC0D"
-    },
-    {
-      "name": "ToggleFilled",
-      "unicode": "EC11"
-    },
-    {
-      "name": "ToggleBorder",
-      "unicode": "EC12"
-    },
-    {
-      "name": "SliderThumb",
-      "unicode": "EC13"
-    },
-    {
-      "name": "ToggleThumb",
-      "unicode": "EC14"
-    },
-    {
-      "name": "Documentation",
-      "unicode": "EC17"
-    },
-    {
-      "name": "Badge",
-      "unicode": "EC1B"
-    },
-    {
-      "name": "Giftbox",
-      "unicode": "EC1F"
-    },
-    {
-      "name": "VisualStudioLogo",
-      "unicode": "EC22"
-    },
-    {
-      "name": "ExcelLogoInverse",
-      "unicode": "EC28"
-    },
-    {
-      "name": "WordLogoInverse",
-      "unicode": "EC29"
-    },
-    {
-      "name": "PowerPointLogoInverse",
-      "unicode": "EC2A"
-    },
-    {
-      "name": "Cafe",
-      "unicode": "EC32"
-    },
-    {
-      "name": "SpeedHigh",
-      "unicode": "EC4A"
-    },
-    {
-      "name": "ThisPC",
-      "unicode": "EC4E"
-    },
-    {
-      "name": "MusicNote",
-      "unicode": "EC4F"
-    },
-    {
-      "name": "MicOff",
-      "unicode": "EC54"
-    },
-    {
-      "name": "EdgeLogo",
-      "unicode": "EC60"
-    },
-    {
-      "name": "CompletedSolid",
-      "unicode": "EC61"
-    },
-    {
-      "name": "AlbumRemove",
-      "unicode": "EC62"
-    },
-    {
-      "name": "MessageFill",
-      "unicode": "EC70"
-    },
-    {
-      "name": "TabletSelected",
-      "unicode": "EC74"
-    },
-    {
-      "name": "MobileSelected",
-      "unicode": "EC75"
-    },
-    {
-      "name": "LaptopSelected",
-      "unicode": "EC76"
-    },
-    {
-      "name": "TVMonitorSelected",
-      "unicode": "EC77"
-    },
-    {
-      "name": "DeveloperTools",
-      "unicode": "EC7A"
-    },
-    {
-      "name": "InsertTextBox",
-      "unicode": "EC7D"
-    },
-    {
-      "name": "LowerBrightness",
-      "unicode": "EC8A"
-    },
-    {
-      "name": "CloudUpload",
-      "unicode": "EC8E"
-    },
-    {
-      "name": "ScrollUpDown",
-      "unicode": "EC8F"
-    },
-    {
-      "name": "DateTime",
-      "unicode": "EC92"
-    },
-    {
-      "name": "Event",
-      "unicode": "ECA3"
-    },
-    {
-      "name": "Cake",
-      "unicode": "ECA4"
-    },
-    {
-      "name": "Org",
-      "unicode": "ECA6"
-    },
-    {
-      "name": "PartyLeader",
-      "unicode": "ECA7"
-    },
-    {
-      "name": "DRM",
-      "unicode": "ECA8"
-    },
-    {
-      "name": "CloudAdd",
-      "unicode": "ECA9"
-    },
-    {
-      "name": "AppIconDefault",
-      "unicode": "ECAA"
-    },
-    {
-      "name": "Photo2Add",
-      "unicode": "ECAB"
-    },
-    {
-      "name": "Photo2Remove",
-      "unicode": "ECAC"
-    },
-    {
-      "name": "POI",
-      "unicode": "ECAF"
-    },
-    {
-      "name": "AddTo",
-      "unicode": "ECC8"
-    },
-    {
-      "name": "RadioBtnOff",
-      "unicode": "ECCA"
-    },
-    {
-      "name": "RadioBtnOn",
-      "unicode": "ECCB"
-    },
-    {
-      "name": "ExploreContent",
-      "unicode": "ECCD"
-    },
-    {
-      "name": "VideoSolid",
-      "unicode": "EA0C"
-    },
-    {
-      "name": "Teamwork",
-      "unicode": "EA12"
-    },
-    {
-      "name": "PeopleAdd",
-      "unicode": "EA15"
-    },
-    {
-      "name": "Glasses",
-      "unicode": "EA16"
-    },
-    {
-      "name": "DateTime2",
-      "unicode": "EA17"
-    },
-    {
-      "name": "Shield",
-      "unicode": "EA18"
-    },
-    {
-      "name": "Header1",
-      "unicode": "EA19"
-    },
-    {
-      "name": "PageAdd",
-      "unicode": "EA1A"
-    },
-    {
-      "name": "NumberedList",
-      "unicode": "EA1C"
-    },
-    {
-      "name": "PowerBILogo",
-      "unicode": "EA1E"
-    },
-    {
-      "name": "Product",
-      "unicode": "ECDC"
-    },
-    {
-      "name": "ProgressLoopInner",
-      "unicode": "ECDE"
-    },
-    {
-      "name": "ProgressLoopOuter",
-      "unicode": "ECDF"
-    },
-    {
-      "name": "Blocked2",
-      "unicode": "ECE4"
-    },
-    {
-      "name": "FangBody",
-      "unicode": "ECEB"
-    },
-    {
-      "name": "Glimmer",
-      "unicode": "ECF4"
-    },
-    {
-      "name": "ChatInviteFriend",
-      "unicode": "ECFE"
-    },
-    {
-      "name": "Crown",
-      "unicode": "ED01"
-    },
-    {
-      "name": "Feedback",
-      "unicode": "ED15"
-    },
-    {
-      "name": "SharepointLogoInverse",
-      "unicode": "ED18"
-    },
-    {
-      "name": "YammerLogo",
-      "unicode": "ED19"
-    },
-    {
-      "name": "Hide",
-      "unicode": "ED1A"
-    },
-    {
-      "name": "Uneditable",
-      "unicode": "ED1D"
-    },
-    {
-      "name": "ReturnToSession",
-      "unicode": "ED24"
-    },
-    {
-      "name": "OpenFolderHorizontal",
-      "unicode": "ED25"
-    },
-    {
-      "name": "CalendarMirrored",
-      "unicode": "ED28"
-    },
-    {
-      "name": "SwayLogoInverse",
-      "unicode": "ED29"
-    },
-    {
-      "name": "OutOfOffice",
-      "unicode": "ED34"
-    },
-    {
-      "name": "Trophy",
-      "unicode": "ED3F"
-    },
-    {
-      "name": "ReopenPages",
-      "unicode": "ED50"
-    },
-    {
-      "name": "AADLogo",
-      "unicode": "ED68"
-    },
-    {
-      "name": "AccessLogo",
-      "unicode": "ED69"
-    },
-    {
-      "name": "AdminALogoInverse32",
-      "unicode": "ED6A"
-    },
-    {
-      "name": "AdminCLogoInverse32",
-      "unicode": "ED6B"
-    },
-    {
-      "name": "AdminDLogoInverse32",
-      "unicode": "ED6C"
-    },
-    {
-      "name": "AdminELogoInverse32",
-      "unicode": "ED6D"
-    },
-    {
-      "name": "AdminLLogoInverse32",
-      "unicode": "ED6E"
-    },
-    {
-      "name": "AdminMLogoInverse32",
-      "unicode": "ED6F"
-    },
-    {
-      "name": "AdminOLogoInverse32",
-      "unicode": "ED70"
-    },
-    {
-      "name": "AdminPLogoInverse32",
-      "unicode": "ED71"
-    },
-    {
-      "name": "AdminSLogoInverse32",
-      "unicode": "ED72"
-    },
-    {
-      "name": "AdminYLogoInverse32",
-      "unicode": "ED73"
-    },
-    {
-      "name": "DelveLogoInverse",
-      "unicode": "ED76"
-    },
-    {
-      "name": "ExchangeLogoInverse",
-      "unicode": "ED78"
-    },
-    {
-      "name": "LyncLogo",
-      "unicode": "ED79"
-    },
-    {
-      "name": "OfficeVideoLogoInverse",
-      "unicode": "ED7A"
-    }
-  ]
+	"fontName": "fabric-icons-4",
+	"fontFamilyName": "FabricMDL2Icons-4",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "FerrySolid",
+			"unicode": "EB48"
+		},
+		{
+			"name": "AirplaneSolid",
+			"unicode": "EB4C"
+		},
+		{
+			"name": "TrainSolid",
+			"unicode": "EB4D"
+		},
+		{
+			"name": "Ticket",
+			"unicode": "EB54"
+		},
+		{
+			"name": "Devices4",
+			"unicode": "EB66"
+		},
+		{
+			"name": "AzureLogo",
+			"unicode": "EB6A"
+		},
+		{
+			"name": "BingLogo",
+			"unicode": "EB6B"
+		},
+		{
+			"name": "MSNLogo",
+			"unicode": "EB6C"
+		},
+		{
+			"name": "OutlookLogoInverse",
+			"unicode": "EB6D"
+		},
+		{
+			"name": "OfficeLogo",
+			"unicode": "EB6E"
+		},
+		{
+			"name": "SkypeLogo",
+			"unicode": "EB6F"
+		},
+		{
+			"name": "Door",
+			"unicode": "EB75"
+		},
+		{
+			"name": "EditMirrored",
+			"unicode": "EB7E"
+		},
+		{
+			"name": "GiftCard",
+			"unicode": "EB8E"
+		},
+		{
+			"name": "DoubleBookmark",
+			"unicode": "EB8F"
+		},
+		{
+			"name": "StatusErrorFull",
+			"unicode": "EB90"
+		},
+		{
+			"name": "Certificate",
+			"unicode": "EB95"
+		},
+		{
+			"name": "FastForward",
+			"unicode": "EB9D"
+		},
+		{
+			"name": "Rewind",
+			"unicode": "EB9E"
+		},
+		{
+			"name": "Photo2",
+			"unicode": "EB9F"
+		},
+		{
+			"name": "OpenSource",
+			"unicode": "EBC2"
+		},
+		{
+			"name": "Movers",
+			"unicode": "EBCD"
+		},
+		{
+			"name": "CloudDownload",
+			"unicode": "EBD3"
+		},
+		{
+			"name": "Family",
+			"unicode": "EBDA"
+		},
+		{
+			"name": "WindDirection",
+			"unicode": "EBE6"
+		},
+		{
+			"name": "Bug",
+			"unicode": "EBE8"
+		},
+		{
+			"name": "SiteScan",
+			"unicode": "EBEC"
+		},
+		{
+			"name": "BrowserScreenShot",
+			"unicode": "EBED"
+		},
+		{
+			"name": "F12DevTools",
+			"unicode": "EBEE"
+		},
+		{
+			"name": "CSS",
+			"unicode": "EBEF"
+		},
+		{
+			"name": "JS",
+			"unicode": "EBF0"
+		},
+		{
+			"name": "DeliveryTruck",
+			"unicode": "EBF4"
+		},
+		{
+			"name": "ReminderPerson",
+			"unicode": "EBF7"
+		},
+		{
+			"name": "ReminderGroup",
+			"unicode": "EBF8"
+		},
+		{
+			"name": "TabletMode",
+			"unicode": "EBFC"
+		},
+		{
+			"name": "Umbrella",
+			"unicode": "EC04"
+		},
+		{
+			"name": "NetworkTower",
+			"unicode": "EC05"
+		},
+		{
+			"name": "CityNext",
+			"unicode": "EC06"
+		},
+		{
+			"name": "Section",
+			"unicode": "EC0C"
+		},
+		{
+			"name": "OneNoteLogoInverse",
+			"unicode": "EC0D"
+		},
+		{
+			"name": "ToggleFilled",
+			"unicode": "EC11"
+		},
+		{
+			"name": "ToggleBorder",
+			"unicode": "EC12"
+		},
+		{
+			"name": "SliderThumb",
+			"unicode": "EC13"
+		},
+		{
+			"name": "ToggleThumb",
+			"unicode": "EC14"
+		},
+		{
+			"name": "Documentation",
+			"unicode": "EC17"
+		},
+		{
+			"name": "Badge",
+			"unicode": "EC1B"
+		},
+		{
+			"name": "Giftbox",
+			"unicode": "EC1F"
+		},
+		{
+			"name": "VisualStudioLogo",
+			"unicode": "EC22"
+		},
+		{
+			"name": "ExcelLogoInverse",
+			"unicode": "EC28"
+		},
+		{
+			"name": "WordLogoInverse",
+			"unicode": "EC29"
+		},
+		{
+			"name": "PowerPointLogoInverse",
+			"unicode": "EC2A"
+		},
+		{
+			"name": "Cafe",
+			"unicode": "EC32"
+		},
+		{
+			"name": "SpeedHigh",
+			"unicode": "EC4A"
+		},
+		{
+			"name": "Commitments",
+			"unicode": "EC4D"
+		},
+		{
+			"name": "ThisPC",
+			"unicode": "EC4E"
+		},
+		{
+			"name": "MusicNote",
+			"unicode": "EC4F"
+		},
+		{
+			"name": "MicOff",
+			"unicode": "EC54"
+		},
+		{
+			"name": "EdgeLogo",
+			"unicode": "EC60"
+		},
+		{
+			"name": "CompletedSolid",
+			"unicode": "EC61"
+		},
+		{
+			"name": "AlbumRemove",
+			"unicode": "EC62"
+		},
+		{
+			"name": "MessageFill",
+			"unicode": "EC70"
+		},
+		{
+			"name": "TabletSelected",
+			"unicode": "EC74"
+		},
+		{
+			"name": "MobileSelected",
+			"unicode": "EC75"
+		},
+		{
+			"name": "LaptopSelected",
+			"unicode": "EC76"
+		},
+		{
+			"name": "TVMonitorSelected",
+			"unicode": "EC77"
+		},
+		{
+			"name": "DeveloperTools",
+			"unicode": "EC7A"
+		},
+		{
+			"name": "InsertTextBox",
+			"unicode": "EC7D"
+		},
+		{
+			"name": "LowerBrightness",
+			"unicode": "EC8A"
+		},
+		{
+			"name": "DOM",
+			"unicode": "EC8D"
+		},
+		{
+			"name": "CloudUpload",
+			"unicode": "EC8E"
+		},
+		{
+			"name": "ScrollUpDown",
+			"unicode": "EC8F"
+		},
+		{
+			"name": "DateTime",
+			"unicode": "EC92"
+		},
+		{
+			"name": "Event",
+			"unicode": "ECA3"
+		},
+		{
+			"name": "Cake",
+			"unicode": "ECA4"
+		},
+		{
+			"name": "Org",
+			"unicode": "ECA6"
+		},
+		{
+			"name": "PartyLeader",
+			"unicode": "ECA7"
+		},
+		{
+			"name": "DRM",
+			"unicode": "ECA8"
+		},
+		{
+			"name": "CloudAdd",
+			"unicode": "ECA9"
+		},
+		{
+			"name": "AppIconDefault",
+			"unicode": "ECAA"
+		},
+		{
+			"name": "Photo2Add",
+			"unicode": "ECAB"
+		},
+		{
+			"name": "Photo2Remove",
+			"unicode": "ECAC"
+		},
+		{
+			"name": "POI",
+			"unicode": "ECAF"
+		},
+		{
+			"name": "FacebookLogo",
+			"unicode": "ECB3"
+		},
+		{
+			"name": "AddTo",
+			"unicode": "ECC8"
+		},
+		{
+			"name": "RadioBtnOff",
+			"unicode": "ECCA"
+		},
+		{
+			"name": "RadioBtnOn",
+			"unicode": "ECCB"
+		},
+		{
+			"name": "ExploreContent",
+			"unicode": "ECCD"
+		},
+		{
+			"name": "Product",
+			"unicode": "ECDC"
+		},
+		{
+			"name": "ProgressLoopInner",
+			"unicode": "ECDE"
+		},
+		{
+			"name": "ProgressLoopOuter",
+			"unicode": "ECDF"
+		},
+		{
+			"name": "Blocked2",
+			"unicode": "ECE4"
+		},
+		{
+			"name": "FangBody",
+			"unicode": "ECEB"
+		},
+		{
+			"name": "Glimmer",
+			"unicode": "ECF4"
+		},
+		{
+			"name": "ChatInviteFriend",
+			"unicode": "ECFE"
+		},
+		{
+			"name": "Crown",
+			"unicode": "ED01"
+		},
+		{
+			"name": "ScaleUp",
+			"unicode": "ED09"
+		},
+		{
+			"name": "Feedback",
+			"unicode": "ED15"
+		},
+		{
+			"name": "SharepointLogoInverse",
+			"unicode": "ED18"
+		},
+		{
+			"name": "YammerLogo",
+			"unicode": "ED19"
+		},
+		{
+			"name": "Hide",
+			"unicode": "ED1A"
+		}
+	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-5.json b/packages/icons/config/fabric-icons-5.json
index 6cd86e2b81acb..326804413f435 100644
--- a/packages/icons/config/fabric-icons-5.json
+++ b/packages/icons/config/fabric-icons-5.json
@@ -1,408 +1,412 @@
 {
-  "fontName": "fabric-icons-5",
-  "fontFamilyName": "FabricMDL2Icons-5",
-  "excludeGlyphs": false,
-  "chunkSubsets": false,
-  "hashFontFileName": true,
-  "subsetChunkSettings": {
-    "maxSubsetSize": 100
-  },
-  "glyphs": [
-    {
-      "name": "SocialListeningLogo",
-      "unicode": "ED7C"
-    },
-    {
-      "name": "VisioLogoInverse",
-      "unicode": "ED7D"
-    },
-    {
-      "name": "Balloons",
-      "unicode": "ED7E"
-    },
-    {
-      "name": "Cat",
-      "unicode": "ED7F"
-    },
-    {
-      "name": "MailAlert",
-      "unicode": "ED80"
-    },
-    {
-      "name": "MailCheck",
-      "unicode": "ED81"
-    },
-    {
-      "name": "MailLowImportance",
-      "unicode": "ED82"
-    },
-    {
-      "name": "MailPause",
-      "unicode": "ED83"
-    },
-    {
-      "name": "MailRepeat",
-      "unicode": "ED84"
-    },
-    {
-      "name": "SecurityGroup",
-      "unicode": "ED85"
-    },
-    {
-      "name": "Table",
-      "unicode": "ED86"
-    },
-    {
-      "name": "VoicemailForward",
-      "unicode": "ED87"
-    },
-    {
-      "name": "VoicemailReply",
-      "unicode": "ED88"
-    },
-    {
-      "name": "Waffle",
-      "unicode": "ED89"
-    },
-    {
-      "name": "RemoveEvent",
-      "unicode": "ED8A"
-    },
-    {
-      "name": "EventInfo",
-      "unicode": "ED8B"
-    },
-    {
-      "name": "ForwardEvent",
-      "unicode": "ED8C"
-    },
-    {
-      "name": "WipePhone",
-      "unicode": "ED8D"
-    },
-    {
-      "name": "AddOnlineMeeting",
-      "unicode": "ED8E"
-    },
-    {
-      "name": "JoinOnlineMeeting",
-      "unicode": "ED8F"
-    },
-    {
-      "name": "RemoveLink",
-      "unicode": "ED90"
-    },
-    {
-      "name": "PeopleBlock",
-      "unicode": "ED91"
-    },
-    {
-      "name": "PeopleRepeat",
-      "unicode": "ED92"
-    },
-    {
-      "name": "PeopleAlert",
-      "unicode": "ED93"
-    },
-    {
-      "name": "PeoplePause",
-      "unicode": "ED94"
-    },
-    {
-      "name": "TransferCall",
-      "unicode": "ED95"
-    },
-    {
-      "name": "AddPhone",
-      "unicode": "ED96"
-    },
-    {
-      "name": "UnknownCall",
-      "unicode": "ED97"
-    },
-    {
-      "name": "NoteReply",
-      "unicode": "ED98"
-    },
-    {
-      "name": "NoteForward",
-      "unicode": "ED99"
-    },
-    {
-      "name": "NotePinned",
-      "unicode": "ED9A"
-    },
-    {
-      "name": "RemoveOccurrence",
-      "unicode": "ED9B"
-    },
-    {
-      "name": "Timeline",
-      "unicode": "ED9C"
-    },
-    {
-      "name": "EditNote",
-      "unicode": "ED9D"
-    },
-    {
-      "name": "CircleHalfFull",
-      "unicode": "ED9E"
-    },
-    {
-      "name": "Room",
-      "unicode": "ED9F"
-    },
-    {
-      "name": "Unsubscribe",
-      "unicode": "EDA0"
-    },
-    {
-      "name": "Subscribe",
-      "unicode": "EDA1"
-    },
-    {
-      "name": "RecurringTask",
-      "unicode": "EDB2"
-    },
-    {
-      "name": "TaskManager",
-      "unicode": "EDB7"
-    },
-    {
-      "name": "TaskManagerMirrored",
-      "unicode": "EDB8"
-    },
-    {
-      "name": "Combine",
-      "unicode": "EDBB"
-    },
-    {
-      "name": "Split",
-      "unicode": "EDBC"
-    },
-    {
-      "name": "DoubleChevronUp",
-      "unicode": "EDBD"
-    },
-    {
-      "name": "DoubleChevronLeft",
-      "unicode": "EDBE"
-    },
-    {
-      "name": "DoubleChevronRight",
-      "unicode": "EDBF"
-    },
-    {
-      "name": "TextBox",
-      "unicode": "EDC2"
-    },
-    {
-      "name": "TextField",
-      "unicode": "EDC3"
-    },
-    {
-      "name": "NumberField",
-      "unicode": "EDC4"
-    },
-    {
-      "name": "Dropdown",
-      "unicode": "EDC5"
-    },
-    {
-      "name": "BookingsLogo",
-      "unicode": "EDC7"
-    },
-    {
-      "name": "ClassNotebookLogoInverse",
-      "unicode": "EDC8"
-    },
-    {
-      "name": "DelveAnalyticsLogo",
-      "unicode": "EDCA"
-    },
-    {
-      "name": "DocsLogoInverse",
-      "unicode": "EDCB"
-    },
-    {
-      "name": "Dynamics365Logo",
-      "unicode": "EDCC"
-    },
-    {
-      "name": "DynamicSMBLogo",
-      "unicode": "EDCD"
-    },
-    {
-      "name": "OfficeAssistantLogo",
-      "unicode": "EDCE"
-    },
-    {
-      "name": "OfficeStoreLogo",
-      "unicode": "EDCF"
-    },
-    {
-      "name": "OneNoteEduLogoInverse",
-      "unicode": "EDD0"
-    },
-    {
-      "name": "PlannerLogo",
-      "unicode": "EDD1"
-    },
-    {
-      "name": "PowerApps",
-      "unicode": "EDD2"
-    },
-    {
-      "name": "Suitcase",
-      "unicode": "EDD3"
-    },
-    {
-      "name": "ProjectLogoInverse",
-      "unicode": "EDD4"
-    },
-    {
-      "name": "CaretLeft8",
-      "unicode": "EDD5"
-    },
-    {
-      "name": "CaretRight8",
-      "unicode": "EDD6"
-    },
-    {
-      "name": "CaretUp8",
-      "unicode": "EDD7"
-    },
-    {
-      "name": "CaretDown8",
-      "unicode": "EDD8"
-    },
-    {
-      "name": "CaretLeftSolid8",
-      "unicode": "EDD9"
-    },
-    {
-      "name": "CaretRightSolid8",
-      "unicode": "EDDA"
-    },
-    {
-      "name": "CaretUpSolid8",
-      "unicode": "EDDB"
-    },
-    {
-      "name": "CaretDownSolid8",
-      "unicode": "EDDC"
-    },
-    {
-      "name": "ClearFormatting",
-      "unicode": "EDDD"
-    },
-    {
-      "name": "Superscript",
-      "unicode": "EDDE"
-    },
-    {
-      "name": "Subscript",
-      "unicode": "EDDF"
-    },
-    {
-      "name": "Strikethrough",
-      "unicode": "EDE0"
-    },
-    {
-      "name": "Export",
-      "unicode": "EDE1"
-    },
-    {
-      "name": "ExportMirrored",
-      "unicode": "EDE2"
-    },
-    {
-      "name": "SingleBookmark",
-      "unicode": "EDFF"
-    },
-    {
-      "name": "DoubleChevronDown",
-      "unicode": "EE04"
-    },
-    {
-      "name": "ReplyAll",
-      "unicode": "EE0A"
-    },
-    {
-      "name": "Questionnaire",
-      "unicode": "EE19"
-    },
-    {
-      "name": "ReplyMirrored",
-      "unicode": "EE35"
-    },
-    {
-      "name": "ReplyAllMirrored",
-      "unicode": "EE36"
-    },
-    {
-      "name": "AddGroup",
-      "unicode": "EE3D"
-    },
-    {
-      "name": "QuestionnaireMirrored",
-      "unicode": "EE4B"
-    },
-    {
-      "name": "TemporaryUser",
-      "unicode": "EE58"
-    },
-    {
-      "name": "CaretSolid16",
-      "unicode": "EE62"
-    },
-    {
-      "name": "GroupedDescending",
-      "unicode": "EE66"
-    },
-    {
-      "name": "GroupedAscending",
-      "unicode": "EE67"
-    },
-    {
-      "name": "AwayStatus",
-      "unicode": "EE6A"
-    },
-    {
-      "name": "MyMoviesTV",
-      "unicode": "EE6C"
-    },
-    {
-      "name": "AustralianRules",
-      "unicode": "EE70"
-    },
-    {
-      "name": "WifiEthernet",
-      "unicode": "EE77"
-    },
-    {
-      "name": "DateTimeMirrored",
-      "unicode": "EE93"
-    },
-    {
-      "name": "StopSolid",
-      "unicode": "EE95"
-    },
-    {
-      "name": "DoubleChevronUp12",
-      "unicode": "EE96"
-    },
-    {
-      "name": "DoubleChevronDown12",
-      "unicode": "EE97"
-    },
-    {
-      "name": "DoubleChevronLeft12",
-      "unicode": "EE98"
-    },
-    {
-      "name": "DoubleChevronRight12",
-      "unicode": "EE99"
-    }
-  ]
+	"fontName": "fabric-icons-5",
+	"fontFamilyName": "FabricMDL2Icons-5",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "Uneditable",
+			"unicode": "ED1D"
+		},
+		{
+			"name": "ReturnToSession",
+			"unicode": "ED24"
+		},
+		{
+			"name": "OpenFolderHorizontal",
+			"unicode": "ED25"
+		},
+		{
+			"name": "CalendarMirrored",
+			"unicode": "ED28"
+		},
+		{
+			"name": "SwayLogoInverse",
+			"unicode": "ED29"
+		},
+		{
+			"name": "OutOfOffice",
+			"unicode": "ED34"
+		},
+		{
+			"name": "Trophy",
+			"unicode": "ED3F"
+		},
+		{
+			"name": "ReopenPages",
+			"unicode": "ED50"
+		},
+		{
+			"name": "EmojiTabSymbols",
+			"unicode": "ED58"
+		},
+		{
+			"name": "AADLogo",
+			"unicode": "ED68"
+		},
+		{
+			"name": "AccessLogo",
+			"unicode": "ED69"
+		},
+		{
+			"name": "AdminALogoInverse32",
+			"unicode": "ED6A"
+		},
+		{
+			"name": "AdminCLogoInverse32",
+			"unicode": "ED6B"
+		},
+		{
+			"name": "AdminDLogoInverse32",
+			"unicode": "ED6C"
+		},
+		{
+			"name": "AdminELogoInverse32",
+			"unicode": "ED6D"
+		},
+		{
+			"name": "AdminLLogoInverse32",
+			"unicode": "ED6E"
+		},
+		{
+			"name": "AdminMLogoInverse32",
+			"unicode": "ED6F"
+		},
+		{
+			"name": "AdminOLogoInverse32",
+			"unicode": "ED70"
+		},
+		{
+			"name": "AdminPLogoInverse32",
+			"unicode": "ED71"
+		},
+		{
+			"name": "AdminSLogoInverse32",
+			"unicode": "ED72"
+		},
+		{
+			"name": "AdminYLogoInverse32",
+			"unicode": "ED73"
+		},
+		{
+			"name": "BoxLogo",
+			"unicode": "ED75"
+		},
+		{
+			"name": "DelveLogoInverse",
+			"unicode": "ED76"
+		},
+		{
+			"name": "DropboxLogo",
+			"unicode": "ED77"
+		},
+		{
+			"name": "ExchangeLogoInverse",
+			"unicode": "ED78"
+		},
+		{
+			"name": "LyncLogo",
+			"unicode": "ED79"
+		},
+		{
+			"name": "OfficeVideoLogoInverse",
+			"unicode": "ED7A"
+		},
+		{
+			"name": "ParatureLogo",
+			"unicode": "ED7B"
+		},
+		{
+			"name": "SocialListeningLogo",
+			"unicode": "ED7C"
+		},
+		{
+			"name": "VisioLogoInverse",
+			"unicode": "ED7D"
+		},
+		{
+			"name": "Balloons",
+			"unicode": "ED7E"
+		},
+		{
+			"name": "Cat",
+			"unicode": "ED7F"
+		},
+		{
+			"name": "MailAlert",
+			"unicode": "ED80"
+		},
+		{
+			"name": "MailCheck",
+			"unicode": "ED81"
+		},
+		{
+			"name": "MailLowImportance",
+			"unicode": "ED82"
+		},
+		{
+			"name": "MailPause",
+			"unicode": "ED83"
+		},
+		{
+			"name": "MailRepeat",
+			"unicode": "ED84"
+		},
+		{
+			"name": "SecurityGroup",
+			"unicode": "ED85"
+		},
+		{
+			"name": "Table",
+			"unicode": "ED86"
+		},
+		{
+			"name": "VoicemailForward",
+			"unicode": "ED87"
+		},
+		{
+			"name": "VoicemailReply",
+			"unicode": "ED88"
+		},
+		{
+			"name": "Waffle",
+			"unicode": "ED89"
+		},
+		{
+			"name": "RemoveEvent",
+			"unicode": "ED8A"
+		},
+		{
+			"name": "EventInfo",
+			"unicode": "ED8B"
+		},
+		{
+			"name": "ForwardEvent",
+			"unicode": "ED8C"
+		},
+		{
+			"name": "WipePhone",
+			"unicode": "ED8D"
+		},
+		{
+			"name": "AddOnlineMeeting",
+			"unicode": "ED8E"
+		},
+		{
+			"name": "JoinOnlineMeeting",
+			"unicode": "ED8F"
+		},
+		{
+			"name": "RemoveLink",
+			"unicode": "ED90"
+		},
+		{
+			"name": "PeopleBlock",
+			"unicode": "ED91"
+		},
+		{
+			"name": "PeopleRepeat",
+			"unicode": "ED92"
+		},
+		{
+			"name": "PeopleAlert",
+			"unicode": "ED93"
+		},
+		{
+			"name": "PeoplePause",
+			"unicode": "ED94"
+		},
+		{
+			"name": "TransferCall",
+			"unicode": "ED95"
+		},
+		{
+			"name": "AddPhone",
+			"unicode": "ED96"
+		},
+		{
+			"name": "UnknownCall",
+			"unicode": "ED97"
+		},
+		{
+			"name": "NoteReply",
+			"unicode": "ED98"
+		},
+		{
+			"name": "NoteForward",
+			"unicode": "ED99"
+		},
+		{
+			"name": "NotePinned",
+			"unicode": "ED9A"
+		},
+		{
+			"name": "RemoveOccurrence",
+			"unicode": "ED9B"
+		},
+		{
+			"name": "Timeline",
+			"unicode": "ED9C"
+		},
+		{
+			"name": "EditNote",
+			"unicode": "ED9D"
+		},
+		{
+			"name": "CircleHalfFull",
+			"unicode": "ED9E"
+		},
+		{
+			"name": "Room",
+			"unicode": "ED9F"
+		},
+		{
+			"name": "Unsubscribe",
+			"unicode": "EDA0"
+		},
+		{
+			"name": "Subscribe",
+			"unicode": "EDA1"
+		},
+		{
+			"name": "HardDrive",
+			"unicode": "EDA2"
+		},
+		{
+			"name": "RecurringTask",
+			"unicode": "EDB2"
+		},
+		{
+			"name": "TaskManager",
+			"unicode": "EDB7"
+		},
+		{
+			"name": "TaskManagerMirrored",
+			"unicode": "EDB8"
+		},
+		{
+			"name": "Combine",
+			"unicode": "EDBB"
+		},
+		{
+			"name": "Split",
+			"unicode": "EDBC"
+		},
+		{
+			"name": "DoubleChevronUp",
+			"unicode": "EDBD"
+		},
+		{
+			"name": "DoubleChevronLeft",
+			"unicode": "EDBE"
+		},
+		{
+			"name": "DoubleChevronRight",
+			"unicode": "EDBF"
+		},
+		{
+			"name": "TextBox",
+			"unicode": "EDC2"
+		},
+		{
+			"name": "TextField",
+			"unicode": "EDC3"
+		},
+		{
+			"name": "NumberField",
+			"unicode": "EDC4"
+		},
+		{
+			"name": "Dropdown",
+			"unicode": "EDC5"
+		},
+		{
+			"name": "BookingsLogo",
+			"unicode": "EDC7"
+		},
+		{
+			"name": "ClassNotebookLogoInverse",
+			"unicode": "EDC8"
+		},
+		{
+			"name": "DelveAnalyticsLogo",
+			"unicode": "EDCA"
+		},
+		{
+			"name": "DocsLogoInverse",
+			"unicode": "EDCB"
+		},
+		{
+			"name": "Dynamics365Logo",
+			"unicode": "EDCC"
+		},
+		{
+			"name": "DynamicSMBLogo",
+			"unicode": "EDCD"
+		},
+		{
+			"name": "OfficeAssistantLogo",
+			"unicode": "EDCE"
+		},
+		{
+			"name": "OfficeStoreLogo",
+			"unicode": "EDCF"
+		},
+		{
+			"name": "OneNoteEduLogoInverse",
+			"unicode": "EDD0"
+		},
+		{
+			"name": "PlannerLogo",
+			"unicode": "EDD1"
+		},
+		{
+			"name": "PowerApps",
+			"unicode": "EDD2"
+		},
+		{
+			"name": "Suitcase",
+			"unicode": "EDD3"
+		},
+		{
+			"name": "ProjectLogoInverse",
+			"unicode": "EDD4"
+		},
+		{
+			"name": "CaretLeft8",
+			"unicode": "EDD5"
+		},
+		{
+			"name": "CaretRight8",
+			"unicode": "EDD6"
+		},
+		{
+			"name": "CaretUp8",
+			"unicode": "EDD7"
+		},
+		{
+			"name": "CaretDown8",
+			"unicode": "EDD8"
+		},
+		{
+			"name": "CaretLeftSolid8",
+			"unicode": "EDD9"
+		},
+		{
+			"name": "CaretRightSolid8",
+			"unicode": "EDDA"
+		},
+		{
+			"name": "CaretUpSolid8",
+			"unicode": "EDDB"
+		},
+		{
+			"name": "CaretDownSolid8",
+			"unicode": "EDDC"
+		}
+	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-6.json b/packages/icons/config/fabric-icons-6.json
index f864b0ec89370..57c1f60d89a27 100644
--- a/packages/icons/config/fabric-icons-6.json
+++ b/packages/icons/config/fabric-icons-6.json
@@ -1,404 +1,412 @@
 {
-  "fontName": "fabric-icons-6",
-  "fontFamilyName": "FabricMDL2Icons-6",
-  "excludeGlyphs": false,
-  "chunkSubsets": false,
-  "hashFontFileName": true,
-  "subsetChunkSettings": {
-    "maxSubsetSize": 100
-  },
-  "glyphs": [
-    {
-      "name": "CalendarAgenda",
-      "unicode": "EE9A"
-    },
-    {
-      "name": "AddEvent",
-      "unicode": "EEB5"
-    },
-    {
-      "name": "AssetLibrary",
-      "unicode": "EEB6"
-    },
-    {
-      "name": "DataConnectionLibrary",
-      "unicode": "EEB7"
-    },
-    {
-      "name": "DocLibrary",
-      "unicode": "EEB8"
-    },
-    {
-      "name": "FormLibrary",
-      "unicode": "EEB9"
-    },
-    {
-      "name": "FormLibraryMirrored",
-      "unicode": "EEBA"
-    },
-    {
-      "name": "ReportLibrary",
-      "unicode": "EEBB"
-    },
-    {
-      "name": "ReportLibraryMirrored",
-      "unicode": "EEBC"
-    },
-    {
-      "name": "ContactCard",
-      "unicode": "EEBD"
-    },
-    {
-      "name": "CustomList",
-      "unicode": "EEBE"
-    },
-    {
-      "name": "CustomListMirrored",
-      "unicode": "EEBF"
-    },
-    {
-      "name": "IssueTracking",
-      "unicode": "EEC0"
-    },
-    {
-      "name": "IssueTrackingMirrored",
-      "unicode": "EEC1"
-    },
-    {
-      "name": "PictureLibrary",
-      "unicode": "EEC2"
-    },
-    {
-      "name": "OfficeAddinsLogo",
-      "unicode": "EEC7"
-    },
-    {
-      "name": "OfflineOneDriveParachute",
-      "unicode": "EEC8"
-    },
-    {
-      "name": "OfflineOneDriveParachuteDisabled",
-      "unicode": "EEC9"
-    },
-    {
-      "name": "TriangleSolidUp12",
-      "unicode": "EECC"
-    },
-    {
-      "name": "TriangleSolidDown12",
-      "unicode": "EECD"
-    },
-    {
-      "name": "TriangleSolidLeft12",
-      "unicode": "EECE"
-    },
-    {
-      "name": "TriangleSolidRight12",
-      "unicode": "EECF"
-    },
-    {
-      "name": "TriangleUp12",
-      "unicode": "EED0"
-    },
-    {
-      "name": "TriangleDown12",
-      "unicode": "EED1"
-    },
-    {
-      "name": "TriangleLeft12",
-      "unicode": "EED2"
-    },
-    {
-      "name": "TriangleRight12",
-      "unicode": "EED3"
-    },
-    {
-      "name": "ArrowUpRight8",
-      "unicode": "EED4"
-    },
-    {
-      "name": "ArrowDownRight8",
-      "unicode": "EED5"
-    },
-    {
-      "name": "DocumentSet",
-      "unicode": "EED6"
-    },
-    {
-      "name": "DelveAnalytics",
-      "unicode": "EEEE"
-    },
-    {
-      "name": "ArrowUpRightMirrored8",
-      "unicode": "EEEF"
-    },
-    {
-      "name": "ArrowDownRightMirrored8",
-      "unicode": "EEF0"
-    },
-    {
-      "name": "OneDriveAdd",
-      "unicode": "EF32"
-    },
-    {
-      "name": "Header2",
-      "unicode": "EF36"
-    },
-    {
-      "name": "Header3",
-      "unicode": "EF37"
-    },
-    {
-      "name": "Header4",
-      "unicode": "EF38"
-    },
-    {
-      "name": "MarketDown",
-      "unicode": "EF42"
-    },
-    {
-      "name": "CalendarWorkWeek",
-      "unicode": "EF51"
-    },
-    {
-      "name": "SidePanel",
-      "unicode": "EF52"
-    },
-    {
-      "name": "GlobeFavorite",
-      "unicode": "EF53"
-    },
-    {
-      "name": "CaretTopLeftSolid8",
-      "unicode": "EF54"
-    },
-    {
-      "name": "CaretTopRightSolid8",
-      "unicode": "EF55"
-    },
-    {
-      "name": "ViewAll2",
-      "unicode": "EF56"
-    },
-    {
-      "name": "DocumentReply",
-      "unicode": "EF57"
-    },
-    {
-      "name": "PlayerSettings",
-      "unicode": "EF58"
-    },
-    {
-      "name": "ReceiptForward",
-      "unicode": "EF59"
-    },
-    {
-      "name": "ReceiptReply",
-      "unicode": "EF5A"
-    },
-    {
-      "name": "ReceiptCheck",
-      "unicode": "EF5B"
-    },
-    {
-      "name": "Fax",
-      "unicode": "EF5C"
-    },
-    {
-      "name": "RecurringEvent",
-      "unicode": "EF5D"
-    },
-    {
-      "name": "ReplyAlt",
-      "unicode": "EF5E"
-    },
-    {
-      "name": "ReplyAllAlt",
-      "unicode": "EF5F"
-    },
-    {
-      "name": "EditStyle",
-      "unicode": "EF60"
-    },
-    {
-      "name": "EditMail",
-      "unicode": "EF61"
-    },
-    {
-      "name": "Lifesaver",
-      "unicode": "EF62"
-    },
-    {
-      "name": "LifesaverLock",
-      "unicode": "EF63"
-    },
-    {
-      "name": "InboxCheck",
-      "unicode": "EF64"
-    },
-    {
-      "name": "FolderSearch",
-      "unicode": "EF65"
-    },
-    {
-      "name": "CollapseMenu",
-      "unicode": "EF66"
-    },
-    {
-      "name": "ExpandMenu",
-      "unicode": "EF67"
-    },
-    {
-      "name": "Boards",
-      "unicode": "EF68"
-    },
-    {
-      "name": "SunAdd",
-      "unicode": "EF69"
-    },
-    {
-      "name": "SunQuestionMark",
-      "unicode": "EF6A"
-    },
-    {
-      "name": "LandscapeOrientation",
-      "unicode": "EF6B"
-    },
-    {
-      "name": "DocumentSearch",
-      "unicode": "EF6C"
-    },
-    {
-      "name": "PublicCalendar",
-      "unicode": "EF6D"
-    },
-    {
-      "name": "PublicContactCard",
-      "unicode": "EF6E"
-    },
-    {
-      "name": "PublicEmail",
-      "unicode": "EF6F"
-    },
-    {
-      "name": "PublicFolder",
-      "unicode": "EF70"
-    },
-    {
-      "name": "WordDocument",
-      "unicode": "EF71"
-    },
-    {
-      "name": "PowerPointDocument",
-      "unicode": "EF72"
-    },
-    {
-      "name": "ExcelDocument",
-      "unicode": "EF73"
-    },
-    {
-      "name": "GroupedList",
-      "unicode": "EF74"
-    },
-    {
-      "name": "ClassroomLogo",
-      "unicode": "EF75"
-    },
-    {
-      "name": "Sections",
-      "unicode": "EF76"
-    },
-    {
-      "name": "EditPhoto",
-      "unicode": "EF77"
-    },
-    {
-      "name": "Starburst",
-      "unicode": "EF78"
-    },
-    {
-      "name": "ShareiOS",
-      "unicode": "EF79"
-    },
-    {
-      "name": "AirTickets",
-      "unicode": "EF7A"
-    },
-    {
-      "name": "PencilReply",
-      "unicode": "EF7B"
-    },
-    {
-      "name": "Tiles2",
-      "unicode": "EF7C"
-    },
-    {
-      "name": "SkypeCircleCheck",
-      "unicode": "EF7D"
-    },
-    {
-      "name": "SkypeCircleClock",
-      "unicode": "EF7E"
-    },
-    {
-      "name": "SkypeCircleMinus",
-      "unicode": "EF7F"
-    },
-    {
-      "name": "SkypeMessage",
-      "unicode": "EF83"
-    },
-    {
-      "name": "ClosedCaption",
-      "unicode": "EF84"
-    },
-    {
-      "name": "ATPLogo",
-      "unicode": "EF85"
-    },
-    {
-      "name": "OfficeFormsLogoInverse",
-      "unicode": "EF86"
-    },
-    {
-      "name": "RecycleBin",
-      "unicode": "EF87"
-    },
-    {
-      "name": "EmptyRecycleBin",
-      "unicode": "EF88"
-    },
-    {
-      "name": "Hide2",
-      "unicode": "EF89"
-    },
-    {
-      "name": "Breadcrumb",
-      "unicode": "EF8C"
-    },
-    {
-      "name": "PageEdit",
-      "unicode": "EFB6"
-    },
-    {
-      "name": "Database",
-      "unicode": "EFC7"
-    },
-    {
-      "name": "DocumentManagement",
-      "unicode": "EFFC"
-    },
-    {
-      "name": "CRMReport",
-      "unicode": "EFFE"
-    },
-    {
-      "name": "ZipFolder",
-      "unicode": "F012"
-    },
-    {
-      "name": "TextDocument",
-      "unicode": "F029"
-    }
-  ]
+	"fontName": "fabric-icons-6",
+	"fontFamilyName": "FabricMDL2Icons-6",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "ClearFormatting",
+			"unicode": "EDDD"
+		},
+		{
+			"name": "Superscript",
+			"unicode": "EDDE"
+		},
+		{
+			"name": "Subscript",
+			"unicode": "EDDF"
+		},
+		{
+			"name": "Strikethrough",
+			"unicode": "EDE0"
+		},
+		{
+			"name": "Export",
+			"unicode": "EDE1"
+		},
+		{
+			"name": "ExportMirrored",
+			"unicode": "EDE2"
+		},
+		{
+			"name": "SingleBookmark",
+			"unicode": "EDFF"
+		},
+		{
+			"name": "DoubleChevronDown",
+			"unicode": "EE04"
+		},
+		{
+			"name": "FollowUser",
+			"unicode": "EE05"
+		},
+		{
+			"name": "ReplyAll",
+			"unicode": "EE0A"
+		},
+		{
+			"name": "GoogleDriveLogo",
+			"unicode": "EE0B"
+		},
+		{
+			"name": "WorkforceManagement",
+			"unicode": "EE0F"
+		},
+		{
+			"name": "Questionnaire",
+			"unicode": "EE19"
+		},
+		{
+			"name": "ManagerSelfService",
+			"unicode": "EE23"
+		},
+		{
+			"name": "ReplyMirrored",
+			"unicode": "EE35"
+		},
+		{
+			"name": "ReplyAllMirrored",
+			"unicode": "EE36"
+		},
+		{
+			"name": "Medal",
+			"unicode": "EE38"
+		},
+		{
+			"name": "AddGroup",
+			"unicode": "EE3D"
+		},
+		{
+			"name": "QuestionnaireMirrored",
+			"unicode": "EE4B"
+		},
+		{
+			"name": "TemporaryUser",
+			"unicode": "EE58"
+		},
+		{
+			"name": "CaretSolid16",
+			"unicode": "EE62"
+		},
+		{
+			"name": "GroupedDescending",
+			"unicode": "EE66"
+		},
+		{
+			"name": "GroupedAscending",
+			"unicode": "EE67"
+		},
+		{
+			"name": "AwayStatus",
+			"unicode": "EE6A"
+		},
+		{
+			"name": "MyMoviesTV",
+			"unicode": "EE6C"
+		},
+		{
+			"name": "GenericScan",
+			"unicode": "EE6F"
+		},
+		{
+			"name": "AustralianRules",
+			"unicode": "EE70"
+		},
+		{
+			"name": "WifiEthernet",
+			"unicode": "EE77"
+		},
+		{
+			"name": "DateTimeMirrored",
+			"unicode": "EE93"
+		},
+		{
+			"name": "StopSolid",
+			"unicode": "EE95"
+		},
+		{
+			"name": "DoubleChevronUp12",
+			"unicode": "EE96"
+		},
+		{
+			"name": "DoubleChevronDown12",
+			"unicode": "EE97"
+		},
+		{
+			"name": "DoubleChevronLeft12",
+			"unicode": "EE98"
+		},
+		{
+			"name": "DoubleChevronRight12",
+			"unicode": "EE99"
+		},
+		{
+			"name": "CalendarAgenda",
+			"unicode": "EE9A"
+		},
+		{
+			"name": "AddEvent",
+			"unicode": "EEB5"
+		},
+		{
+			"name": "AssetLibrary",
+			"unicode": "EEB6"
+		},
+		{
+			"name": "DataConnectionLibrary",
+			"unicode": "EEB7"
+		},
+		{
+			"name": "DocLibrary",
+			"unicode": "EEB8"
+		},
+		{
+			"name": "FormLibrary",
+			"unicode": "EEB9"
+		},
+		{
+			"name": "FormLibraryMirrored",
+			"unicode": "EEBA"
+		},
+		{
+			"name": "ReportLibrary",
+			"unicode": "EEBB"
+		},
+		{
+			"name": "ReportLibraryMirrored",
+			"unicode": "EEBC"
+		},
+		{
+			"name": "ContactCard",
+			"unicode": "EEBD"
+		},
+		{
+			"name": "CustomList",
+			"unicode": "EEBE"
+		},
+		{
+			"name": "CustomListMirrored",
+			"unicode": "EEBF"
+		},
+		{
+			"name": "IssueTracking",
+			"unicode": "EEC0"
+		},
+		{
+			"name": "IssueTrackingMirrored",
+			"unicode": "EEC1"
+		},
+		{
+			"name": "PictureLibrary",
+			"unicode": "EEC2"
+		},
+		{
+			"name": "OfficeAddinsLogo",
+			"unicode": "EEC7"
+		},
+		{
+			"name": "OfflineOneDriveParachute",
+			"unicode": "EEC8"
+		},
+		{
+			"name": "OfflineOneDriveParachuteDisabled",
+			"unicode": "EEC9"
+		},
+		{
+			"name": "TriangleSolidUp12",
+			"unicode": "EECC"
+		},
+		{
+			"name": "TriangleSolidDown12",
+			"unicode": "EECD"
+		},
+		{
+			"name": "TriangleSolidLeft12",
+			"unicode": "EECE"
+		},
+		{
+			"name": "TriangleSolidRight12",
+			"unicode": "EECF"
+		},
+		{
+			"name": "TriangleUp12",
+			"unicode": "EED0"
+		},
+		{
+			"name": "TriangleDown12",
+			"unicode": "EED1"
+		},
+		{
+			"name": "TriangleLeft12",
+			"unicode": "EED2"
+		},
+		{
+			"name": "TriangleRight12",
+			"unicode": "EED3"
+		},
+		{
+			"name": "ArrowUpRight8",
+			"unicode": "EED4"
+		},
+		{
+			"name": "ArrowDownRight8",
+			"unicode": "EED5"
+		},
+		{
+			"name": "DocumentSet",
+			"unicode": "EED6"
+		},
+		{
+			"name": "DelveAnalytics",
+			"unicode": "EEEE"
+		},
+		{
+			"name": "ArrowUpRightMirrored8",
+			"unicode": "EEEF"
+		},
+		{
+			"name": "ArrowDownRightMirrored8",
+			"unicode": "EEF0"
+		},
+		{
+			"name": "CompanyDirectory",
+			"unicode": "EF0D"
+		},
+		{
+			"name": "CompanyDirectoryMirrored",
+			"unicode": "EF2B"
+		},
+		{
+			"name": "OneDriveAdd",
+			"unicode": "EF32"
+		},
+		{
+			"name": "ProfileSearch",
+			"unicode": "EF35"
+		},
+		{
+			"name": "Header2",
+			"unicode": "EF36"
+		},
+		{
+			"name": "Header3",
+			"unicode": "EF37"
+		},
+		{
+			"name": "Header4",
+			"unicode": "EF38"
+		},
+		{
+			"name": "MarketDown",
+			"unicode": "EF42"
+		},
+		{
+			"name": "CalendarWorkWeek",
+			"unicode": "EF51"
+		},
+		{
+			"name": "SidePanel",
+			"unicode": "EF52"
+		},
+		{
+			"name": "GlobeFavorite",
+			"unicode": "EF53"
+		},
+		{
+			"name": "CaretTopLeftSolid8",
+			"unicode": "EF54"
+		},
+		{
+			"name": "CaretTopRightSolid8",
+			"unicode": "EF55"
+		},
+		{
+			"name": "ViewAll2",
+			"unicode": "EF56"
+		},
+		{
+			"name": "DocumentReply",
+			"unicode": "EF57"
+		},
+		{
+			"name": "PlayerSettings",
+			"unicode": "EF58"
+		},
+		{
+			"name": "ReceiptForward",
+			"unicode": "EF59"
+		},
+		{
+			"name": "ReceiptReply",
+			"unicode": "EF5A"
+		},
+		{
+			"name": "ReceiptCheck",
+			"unicode": "EF5B"
+		},
+		{
+			"name": "Fax",
+			"unicode": "EF5C"
+		},
+		{
+			"name": "RecurringEvent",
+			"unicode": "EF5D"
+		},
+		{
+			"name": "ReplyAlt",
+			"unicode": "EF5E"
+		},
+		{
+			"name": "ReplyAllAlt",
+			"unicode": "EF5F"
+		},
+		{
+			"name": "EditStyle",
+			"unicode": "EF60"
+		},
+		{
+			"name": "EditMail",
+			"unicode": "EF61"
+		},
+		{
+			"name": "Lifesaver",
+			"unicode": "EF62"
+		},
+		{
+			"name": "LifesaverLock",
+			"unicode": "EF63"
+		},
+		{
+			"name": "InboxCheck",
+			"unicode": "EF64"
+		},
+		{
+			"name": "FolderSearch",
+			"unicode": "EF65"
+		},
+		{
+			"name": "CollapseMenu",
+			"unicode": "EF66"
+		},
+		{
+			"name": "ExpandMenu",
+			"unicode": "EF67"
+		},
+		{
+			"name": "Boards",
+			"unicode": "EF68"
+		},
+		{
+			"name": "SunAdd",
+			"unicode": "EF69"
+		},
+		{
+			"name": "SunQuestionMark",
+			"unicode": "EF6A"
+		}
+	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-7.json b/packages/icons/config/fabric-icons-7.json
index addfa7ea3ba4c..c702f4c62638a 100644
--- a/packages/icons/config/fabric-icons-7.json
+++ b/packages/icons/config/fabric-icons-7.json
@@ -1,412 +1,412 @@
 {
-  "fontName": "fabric-icons-7",
-  "fontFamilyName": "FabricMDL2Icons-7",
-  "excludeGlyphs": false,
-  "chunkSubsets": true,
-  "hashFontFileName": true,
-  "subsetChunkSettings": {
-    "maxSubsetSize": 100
-  },
-  "glyphs": [
-    {
-      "name": "PageCheckedOut",
-      "unicode": "F02C"
-    },
-    {
-      "name": "SaveAndClose",
-      "unicode": "F038"
-    },
-    {
-      "name": "Script",
-      "unicode": "F03A"
-    },
-    {
-      "name": "Archive",
-      "unicode": "F03F"
-    },
-    {
-      "name": "ActivityFeed",
-      "unicode": "F056"
-    },
-    {
-      "name": "EventDate",
-      "unicode": "F059"
-    },
-    {
-      "name": "CaretRight",
-      "unicode": "F06B"
-    },
-    {
-      "name": "SetAction",
-      "unicode": "F071"
-    },
-    {
-      "name": "CaretSolidLeft",
-      "unicode": "F08D"
-    },
-    {
-      "name": "CaretSolidDown",
-      "unicode": "F08E"
-    },
-    {
-      "name": "CaretSolidRight",
-      "unicode": "F08F"
-    },
-    {
-      "name": "CaretSolidUp",
-      "unicode": "F090"
-    },
-    {
-      "name": "PowerAppsLogo",
-      "unicode": "F091"
-    },
-    {
-      "name": "PowerApps2Logo",
-      "unicode": "F092"
-    },
-    {
-      "name": "SearchIssue",
-      "unicode": "F09A"
-    },
-    {
-      "name": "SearchIssueMirrored",
-      "unicode": "F09B"
-    },
-    {
-      "name": "FabricAssetLibrary",
-      "unicode": "F09C"
-    },
-    {
-      "name": "FabricDataConnectionLibrary",
-      "unicode": "F09D"
-    },
-    {
-      "name": "FabricDocLibrary",
-      "unicode": "F09E"
-    },
-    {
-      "name": "FabricFormLibrary",
-      "unicode": "F09F"
-    },
-    {
-      "name": "FabricFormLibraryMirrored",
-      "unicode": "F0A0"
-    },
-    {
-      "name": "FabricReportLibrary",
-      "unicode": "F0A1"
-    },
-    {
-      "name": "FabricReportLibraryMirrored",
-      "unicode": "F0A2"
-    },
-    {
-      "name": "FabricPublicFolder",
-      "unicode": "F0A3"
-    },
-    {
-      "name": "FabricFolderSearch",
-      "unicode": "F0A4"
-    },
-    {
-      "name": "FabricMovetoFolder",
-      "unicode": "F0A5"
-    },
-    {
-      "name": "FabricUnsyncFolder",
-      "unicode": "F0A6"
-    },
-    {
-      "name": "FabricSyncFolder",
-      "unicode": "F0A7"
-    },
-    {
-      "name": "FabricOpenFolderHorizontal",
-      "unicode": "F0A8"
-    },
-    {
-      "name": "FabricFolder",
-      "unicode": "F0A9"
-    },
-    {
-      "name": "FabricFolderFill",
-      "unicode": "F0AA"
-    },
-    {
-      "name": "FabricNewFolder",
-      "unicode": "F0AB"
-    },
-    {
-      "name": "FabricPictureLibrary",
-      "unicode": "F0AC"
-    },
-    {
-      "name": "AddFavorite",
-      "unicode": "F0C8"
-    },
-    {
-      "name": "AddFavoriteFill",
-      "unicode": "F0C9"
-    },
-    {
-      "name": "BufferTimeBefore",
-      "unicode": "F0CF"
-    },
-    {
-      "name": "BufferTimeAfter",
-      "unicode": "F0D0"
-    },
-    {
-      "name": "BufferTimeBoth",
-      "unicode": "F0D1"
-    },
-    {
-      "name": "CannedChat",
-      "unicode": "F0F2"
-    },
-    {
-      "name": "SkypeForBusinessLogo",
-      "unicode": "F0FC"
-    },
-    {
-      "name": "PageCheckedin",
-      "unicode": "F104"
-    },
-    {
-      "name": "CaretBottomLeftSolid8",
-      "unicode": "F121"
-    },
-    {
-      "name": "CaretBottomRightSolid8",
-      "unicode": "F122"
-    },
-    {
-      "name": "FolderHorizontal",
-      "unicode": "F12B"
-    },
-    {
-      "name": "MicrosoftStaffhubLogo",
-      "unicode": "F130"
-    },
-    {
-      "name": "GiftboxOpen",
-      "unicode": "F133"
-    },
-    {
-      "name": "StatusCircleOuter",
-      "unicode": "F136"
-    },
-    {
-      "name": "StatusCircleInner",
-      "unicode": "F137"
-    },
-    {
-      "name": "ExploreContentSingle",
-      "unicode": "F164"
-    },
-    {
-      "name": "CollapseContent",
-      "unicode": "F165"
-    },
-    {
-      "name": "CollapseContentSingle",
-      "unicode": "F166"
-    },
-    {
-      "name": "InfoSolid",
-      "unicode": "F167"
-    },
-    {
-      "name": "ProgressRingDots",
-      "unicode": "F16A"
-    },
-    {
-      "name": "CaloriesAdd",
-      "unicode": "F172"
-    },
-    {
-      "name": "BranchFork",
-      "unicode": "F173"
-    },
-    {
-      "name": "HardDriveGroup",
-      "unicode": "F18F"
-    },
-    {
-      "name": "BucketColor",
-      "unicode": "F1B6"
-    },
-    {
-      "name": "BucketColorFill",
-      "unicode": "F1B7"
-    },
-    {
-      "name": "Taskboard",
-      "unicode": "F1C2"
-    },
-    {
-      "name": "SingleColumn",
-      "unicode": "F1D3"
-    },
-    {
-      "name": "DoubleColumn",
-      "unicode": "F1D4"
-    },
-    {
-      "name": "TripleColumn",
-      "unicode": "F1D5"
-    },
-    {
-      "name": "ColumnLeftTwoThirds",
-      "unicode": "F1D6"
-    },
-    {
-      "name": "ColumnRightTwoThirds",
-      "unicode": "F1D7"
-    },
-    {
-      "name": "AccessLogoFill",
-      "unicode": "F1DB"
-    },
-    {
-      "name": "AnalyticsLogo",
-      "unicode": "F1DE"
-    },
-    {
-      "name": "AnalyticsQuery",
-      "unicode": "F1DF"
-    },
-    {
-      "name": "NewAnalyticsQuery",
-      "unicode": "F1E0"
-    },
-    {
-      "name": "AnalyticsReport",
-      "unicode": "F1E1"
-    },
-    {
-      "name": "WordLogo",
-      "unicode": "F1E3"
-    },
-    {
-      "name": "WordLogoFill",
-      "unicode": "F1E4"
-    },
-    {
-      "name": "ExcelLogo",
-      "unicode": "F1E5"
-    },
-    {
-      "name": "ExcelLogoFill",
-      "unicode": "F1E6"
-    },
-    {
-      "name": "OneNoteLogo",
-      "unicode": "F1E7"
-    },
-    {
-      "name": "OneNoteLogoFill",
-      "unicode": "F1E8"
-    },
-    {
-      "name": "OutlookLogo",
-      "unicode": "F1E9"
-    },
-    {
-      "name": "OutlookLogoFill",
-      "unicode": "F1EA"
-    },
-    {
-      "name": "PowerPointLogo",
-      "unicode": "F1EB"
-    },
-    {
-      "name": "PowerPointLogoFill",
-      "unicode": "F1EC"
-    },
-    {
-      "name": "PublisherLogo",
-      "unicode": "F1ED"
-    },
-    {
-      "name": "PublisherLogoFill",
-      "unicode": "F1EE"
-    },
-    {
-      "name": "ScheduleEventAction",
-      "unicode": "F1EF"
-    },
-    {
-      "name": "FlameSolid",
-      "unicode": "F1F3"
-    },
-    {
-      "name": "ServerProcesses",
-      "unicode": "F1FE"
-    },
-    {
-      "name": "Server",
-      "unicode": "F201"
-    },
-    {
-      "name": "SaveAll",
-      "unicode": "F203"
-    },
-    {
-      "name": "LinkedInLogo",
-      "unicode": "F20A"
-    },
-    {
-      "name": "SidePanelMirrored",
-      "unicode": "F221"
-    },
-    {
-      "name": "ProtectRestrict",
-      "unicode": "F22A"
-    },
-    {
-      "name": "GridViewSmall",
-      "unicode": "F232"
-    },
-    {
-      "name": "GridViewMedium",
-      "unicode": "F233"
-    },
-    {
-      "name": "GridViewLarge",
-      "unicode": "F234"
-    },
-    {
-      "name": "Step",
-      "unicode": "F241"
-    },
-    {
-      "name": "StepInsert",
-      "unicode": "F242"
-    },
-    {
-      "name": "StepShared",
-      "unicode": "F243"
-    },
-    {
-      "name": "StepSharedAdd",
-      "unicode": "F244"
-    },
-    {
-      "name": "StepSharedInsert",
-      "unicode": "F245"
-    },
-    {
-      "name": "ViewDashboard",
-      "unicode": "F246"
-    },
-    {
-      "name": "ViewList",
-      "unicode": "F247"
-    },
-    {
-      "name": "ViewListGroup",
-      "unicode": "F248"
-    }
-  ]
+	"fontName": "fabric-icons-7",
+	"fontFamilyName": "FabricMDL2Icons-7",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "LandscapeOrientation",
+			"unicode": "EF6B"
+		},
+		{
+			"name": "DocumentSearch",
+			"unicode": "EF6C"
+		},
+		{
+			"name": "PublicCalendar",
+			"unicode": "EF6D"
+		},
+		{
+			"name": "PublicContactCard",
+			"unicode": "EF6E"
+		},
+		{
+			"name": "PublicEmail",
+			"unicode": "EF6F"
+		},
+		{
+			"name": "PublicFolder",
+			"unicode": "EF70"
+		},
+		{
+			"name": "WordDocument",
+			"unicode": "EF71"
+		},
+		{
+			"name": "PowerPointDocument",
+			"unicode": "EF72"
+		},
+		{
+			"name": "ExcelDocument",
+			"unicode": "EF73"
+		},
+		{
+			"name": "GroupedList",
+			"unicode": "EF74"
+		},
+		{
+			"name": "ClassroomLogo",
+			"unicode": "EF75"
+		},
+		{
+			"name": "Sections",
+			"unicode": "EF76"
+		},
+		{
+			"name": "EditPhoto",
+			"unicode": "EF77"
+		},
+		{
+			"name": "Starburst",
+			"unicode": "EF78"
+		},
+		{
+			"name": "ShareiOS",
+			"unicode": "EF79"
+		},
+		{
+			"name": "AirTickets",
+			"unicode": "EF7A"
+		},
+		{
+			"name": "PencilReply",
+			"unicode": "EF7B"
+		},
+		{
+			"name": "Tiles2",
+			"unicode": "EF7C"
+		},
+		{
+			"name": "SkypeCircleCheck",
+			"unicode": "EF7D"
+		},
+		{
+			"name": "SkypeCircleClock",
+			"unicode": "EF7E"
+		},
+		{
+			"name": "SkypeCircleMinus",
+			"unicode": "EF7F"
+		},
+		{
+			"name": "SkypeMessage",
+			"unicode": "EF83"
+		},
+		{
+			"name": "ClosedCaption",
+			"unicode": "EF84"
+		},
+		{
+			"name": "ATPLogo",
+			"unicode": "EF85"
+		},
+		{
+			"name": "OfficeFormsLogoInverse",
+			"unicode": "EF86"
+		},
+		{
+			"name": "RecycleBin",
+			"unicode": "EF87"
+		},
+		{
+			"name": "EmptyRecycleBin",
+			"unicode": "EF88"
+		},
+		{
+			"name": "Hide2",
+			"unicode": "EF89"
+		},
+		{
+			"name": "iOSAppStoreLogo",
+			"unicode": "EF8A"
+		},
+		{
+			"name": "AndroidLogo",
+			"unicode": "EF8B"
+		},
+		{
+			"name": "Breadcrumb",
+			"unicode": "EF8C"
+		},
+		{
+			"name": "BirthdayCake",
+			"unicode": "EF8D"
+		},
+		{
+			"name": "TimeEntry",
+			"unicode": "EF95"
+		},
+		{
+			"name": "PageEdit",
+			"unicode": "EFB6"
+		},
+		{
+			"name": "PageRemove",
+			"unicode": "EFBA"
+		},
+		{
+			"name": "Database",
+			"unicode": "EFC7"
+		},
+		{
+			"name": "EditContact",
+			"unicode": "EFD3"
+		},
+		{
+			"name": "ConnectContacts",
+			"unicode": "EFD4"
+		},
+		{
+			"name": "ActivateOrders",
+			"unicode": "EFE0"
+		},
+		{
+			"name": "DeactivateOrders",
+			"unicode": "EFE1"
+		},
+		{
+			"name": "DocumentManagement",
+			"unicode": "EFFC"
+		},
+		{
+			"name": "CRMReport",
+			"unicode": "EFFE"
+		},
+		{
+			"name": "ZipFolder",
+			"unicode": "F012"
+		},
+		{
+			"name": "SurveyQuestions",
+			"unicode": "F01B"
+		},
+		{
+			"name": "TextDocument",
+			"unicode": "F029"
+		},
+		{
+			"name": "PageCheckedOut",
+			"unicode": "F02C"
+		},
+		{
+			"name": "SaveAndClose",
+			"unicode": "F038"
+		},
+		{
+			"name": "Script",
+			"unicode": "F03A"
+		},
+		{
+			"name": "Archive",
+			"unicode": "F03F"
+		},
+		{
+			"name": "ActivityFeed",
+			"unicode": "F056"
+		},
+		{
+			"name": "EventDate",
+			"unicode": "F059"
+		},
+		{
+			"name": "CaretRight",
+			"unicode": "F06B"
+		},
+		{
+			"name": "SetAction",
+			"unicode": "F071"
+		},
+		{
+			"name": "CaretSolidLeft",
+			"unicode": "F08D"
+		},
+		{
+			"name": "CaretSolidDown",
+			"unicode": "F08E"
+		},
+		{
+			"name": "CaretSolidRight",
+			"unicode": "F08F"
+		},
+		{
+			"name": "CaretSolidUp",
+			"unicode": "F090"
+		},
+		{
+			"name": "PowerAppsLogo",
+			"unicode": "F091"
+		},
+		{
+			"name": "PowerApps2Logo",
+			"unicode": "F092"
+		},
+		{
+			"name": "SearchIssue",
+			"unicode": "F09A"
+		},
+		{
+			"name": "SearchIssueMirrored",
+			"unicode": "F09B"
+		},
+		{
+			"name": "FabricAssetLibrary",
+			"unicode": "F09C"
+		},
+		{
+			"name": "FabricDataConnectionLibrary",
+			"unicode": "F09D"
+		},
+		{
+			"name": "FabricDocLibrary",
+			"unicode": "F09E"
+		},
+		{
+			"name": "FabricFormLibrary",
+			"unicode": "F09F"
+		},
+		{
+			"name": "FabricFormLibraryMirrored",
+			"unicode": "F0A0"
+		},
+		{
+			"name": "FabricReportLibrary",
+			"unicode": "F0A1"
+		},
+		{
+			"name": "FabricReportLibraryMirrored",
+			"unicode": "F0A2"
+		},
+		{
+			"name": "FabricPublicFolder",
+			"unicode": "F0A3"
+		},
+		{
+			"name": "FabricFolderSearch",
+			"unicode": "F0A4"
+		},
+		{
+			"name": "FabricMovetoFolder",
+			"unicode": "F0A5"
+		},
+		{
+			"name": "FabricUnsyncFolder",
+			"unicode": "F0A6"
+		},
+		{
+			"name": "FabricSyncFolder",
+			"unicode": "F0A7"
+		},
+		{
+			"name": "FabricOpenFolderHorizontal",
+			"unicode": "F0A8"
+		},
+		{
+			"name": "FabricFolder",
+			"unicode": "F0A9"
+		},
+		{
+			"name": "FabricFolderFill",
+			"unicode": "F0AA"
+		},
+		{
+			"name": "FabricNewFolder",
+			"unicode": "F0AB"
+		},
+		{
+			"name": "FabricPictureLibrary",
+			"unicode": "F0AC"
+		},
+		{
+			"name": "AddFavorite",
+			"unicode": "F0C8"
+		},
+		{
+			"name": "AddFavoriteFill",
+			"unicode": "F0C9"
+		},
+		{
+			"name": "BufferTimeBefore",
+			"unicode": "F0CF"
+		},
+		{
+			"name": "BufferTimeAfter",
+			"unicode": "F0D0"
+		},
+		{
+			"name": "BufferTimeBoth",
+			"unicode": "F0D1"
+		},
+		{
+			"name": "CannedChat",
+			"unicode": "F0F2"
+		},
+		{
+			"name": "SkypeForBusinessLogo",
+			"unicode": "F0FC"
+		},
+		{
+			"name": "PageCheckedin",
+			"unicode": "F104"
+		},
+		{
+			"name": "CaretBottomLeftSolid8",
+			"unicode": "F121"
+		},
+		{
+			"name": "CaretBottomRightSolid8",
+			"unicode": "F122"
+		},
+		{
+			"name": "FolderHorizontal",
+			"unicode": "F12B"
+		},
+		{
+			"name": "MicrosoftStaffhubLogo",
+			"unicode": "F130"
+		},
+		{
+			"name": "GiftboxOpen",
+			"unicode": "F133"
+		},
+		{
+			"name": "StatusCircleOuter",
+			"unicode": "F136"
+		},
+		{
+			"name": "StatusCircleInner",
+			"unicode": "F137"
+		},
+		{
+			"name": "Toll",
+			"unicode": "F160"
+		},
+		{
+			"name": "ExploreContentSingle",
+			"unicode": "F164"
+		},
+		{
+			"name": "CollapseContent",
+			"unicode": "F165"
+		},
+		{
+			"name": "CollapseContentSingle",
+			"unicode": "F166"
+		},
+		{
+			"name": "InfoSolid",
+			"unicode": "F167"
+		},
+		{
+			"name": "ProgressRingDots",
+			"unicode": "F16A"
+		},
+		{
+			"name": "CaloriesAdd",
+			"unicode": "F172"
+		}
+	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-8.json b/packages/icons/config/fabric-icons-8.json
index 9db80a930819f..021dbc41677a1 100644
--- a/packages/icons/config/fabric-icons-8.json
+++ b/packages/icons/config/fabric-icons-8.json
@@ -1,412 +1,412 @@
 {
-  "fontName": "fabric-icons-8",
-  "fontFamilyName": "FabricMDL2Icons-8",
-  "excludeGlyphs": false,
-  "chunkSubsets": true,
-  "hashFontFileName": true,
-  "subsetChunkSettings": {
-    "maxSubsetSize": 100
-  },
-  "glyphs": [
-    {
-      "name": "ViewListTree",
-      "unicode": "F249"
-    },
-    {
-      "name": "TriggerAuto",
-      "unicode": "F24A"
-    },
-    {
-      "name": "TriggerUser",
-      "unicode": "F24B"
-    },
-    {
-      "name": "PivotChart",
-      "unicode": "F24C"
-    },
-    {
-      "name": "StackedBarChart",
-      "unicode": "F24D"
-    },
-    {
-      "name": "StackedLineChart",
-      "unicode": "F24E"
-    },
-    {
-      "name": "BuildQueue",
-      "unicode": "F24F"
-    },
-    {
-      "name": "BuildQueueNew",
-      "unicode": "F250"
-    },
-    {
-      "name": "UserFollowed",
-      "unicode": "F25C"
-    },
-    {
-      "name": "VennDiagram",
-      "unicode": "F273"
-    },
-    {
-      "name": "FiveTileGrid",
-      "unicode": "F274"
-    },
-    {
-      "name": "FocalPoint",
-      "unicode": "F277"
-    },
-    {
-      "name": "TeamsLogoInverse",
-      "unicode": "F27A"
-    },
-    {
-      "name": "TeamsLogo",
-      "unicode": "F27B"
-    },
-    {
-      "name": "TeamsLogoFill",
-      "unicode": "F27C"
-    },
-    {
-      "name": "SkypeForBusinessLogoFill",
-      "unicode": "F27D"
-    },
-    {
-      "name": "SharepointLogo",
-      "unicode": "F27E"
-    },
-    {
-      "name": "SharepointLogoFill",
-      "unicode": "F27F"
-    },
-    {
-      "name": "DelveLogo",
-      "unicode": "F280"
-    },
-    {
-      "name": "DelveLogoFill",
-      "unicode": "F281"
-    },
-    {
-      "name": "OfficeVideoLogo",
-      "unicode": "F282"
-    },
-    {
-      "name": "OfficeVideoLogoFill",
-      "unicode": "F283"
-    },
-    {
-      "name": "ExchangeLogo",
-      "unicode": "F284"
-    },
-    {
-      "name": "ExchangeLogoFill",
-      "unicode": "F285"
-    },
-    {
-      "name": "DocumentApproval",
-      "unicode": "F28B"
-    },
-    {
-      "name": "CloneToDesktop",
-      "unicode": "F28C"
-    },
-    {
-      "name": "InstallToDrive",
-      "unicode": "F28D"
-    },
-    {
-      "name": "Blur",
-      "unicode": "F28E"
-    },
-    {
-      "name": "Build",
-      "unicode": "F28F"
-    },
-    {
-      "name": "ProcessMetaTask",
-      "unicode": "F290"
-    },
-    {
-      "name": "BranchFork2",
-      "unicode": "F291"
-    },
-    {
-      "name": "BranchLocked",
-      "unicode": "F292"
-    },
-    {
-      "name": "BranchCommit",
-      "unicode": "F293"
-    },
-    {
-      "name": "BranchCompare",
-      "unicode": "F294"
-    },
-    {
-      "name": "BranchMerge",
-      "unicode": "F295"
-    },
-    {
-      "name": "BranchPullRequest",
-      "unicode": "F296"
-    },
-    {
-      "name": "BranchSearch",
-      "unicode": "F297"
-    },
-    {
-      "name": "BranchShelveset",
-      "unicode": "F298"
-    },
-    {
-      "name": "RawSource",
-      "unicode": "F299"
-    },
-    {
-      "name": "MergeDuplicate",
-      "unicode": "F29A"
-    },
-    {
-      "name": "RowsGroup",
-      "unicode": "F29B"
-    },
-    {
-      "name": "RowsChild",
-      "unicode": "F29C"
-    },
-    {
-      "name": "Deploy",
-      "unicode": "F29D"
-    },
-    {
-      "name": "Redeploy",
-      "unicode": "F29E"
-    },
-    {
-      "name": "ServerEnviroment",
-      "unicode": "F29F"
-    },
-    {
-      "name": "Plug",
-      "unicode": "F300"
-    },
-    {
-      "name": "PlugSolid",
-      "unicode": "F301"
-    },
-    {
-      "name": "PlugConnected",
-      "unicode": "F302"
-    },
-    {
-      "name": "PlugDisconnected",
-      "unicode": "F303"
-    },
-    {
-      "name": "UnlockSolid",
-      "unicode": "F304"
-    },
-    {
-      "name": "Variable",
-      "unicode": "F305"
-    },
-    {
-      "name": "Parameter",
-      "unicode": "F306"
-    },
-    {
-      "name": "CommentUrgent",
-      "unicode": "F307"
-    },
-    {
-      "name": "Storyboard",
-      "unicode": "F308"
-    },
-    {
-      "name": "DiffInline",
-      "unicode": "F309"
-    },
-    {
-      "name": "DiffSideBySide",
-      "unicode": "F30A"
-    },
-    {
-      "name": "ImageDiff",
-      "unicode": "F30B"
-    },
-    {
-      "name": "ImagePixel",
-      "unicode": "F30C"
-    },
-    {
-      "name": "FileBug",
-      "unicode": "F30D"
-    },
-    {
-      "name": "FileCode",
-      "unicode": "F30E"
-    },
-    {
-      "name": "FileComment",
-      "unicode": "F30F"
-    },
-    {
-      "name": "FileImage",
-      "unicode": "F311"
-    },
-    {
-      "name": "FileSymlink",
-      "unicode": "F312"
-    },
-    {
-      "name": "AutoFillTemplate",
-      "unicode": "F313"
-    },
-    {
-      "name": "WorkItem",
-      "unicode": "F314"
-    },
-    {
-      "name": "WorkItemBug",
-      "unicode": "F315"
-    },
-    {
-      "name": "LogRemove",
-      "unicode": "F316"
-    },
-    {
-      "name": "ColumnOptions",
-      "unicode": "F317"
-    },
-    {
-      "name": "Packages",
-      "unicode": "F318"
-    },
-    {
-      "name": "BuildIssue",
-      "unicode": "F319"
-    },
-    {
-      "name": "AssessmentGroup",
-      "unicode": "F31A"
-    },
-    {
-      "name": "VariableGroup",
-      "unicode": "F31B"
-    },
-    {
-      "name": "FullHistory",
-      "unicode": "F31C"
-    },
-    {
-      "name": "BusinessHoursSign",
-      "unicode": "F310"
-    },
-    {
-      "name": "VisioDiagram",
-      "unicode": "F2A0"
-    },
-    {
-      "name": "HighlightMappedShapes",
-      "unicode": "F2A1"
-    },
-    {
-      "name": "TextCallout",
-      "unicode": "F2A2"
-    },
-    {
-      "name": "IconSetsFlag",
-      "unicode": "F2A4"
-    },
-    {
-      "name": "VisioLogo",
-      "unicode": "F2A7"
-    },
-    {
-      "name": "VisioLogoFill",
-      "unicode": "F2A8"
-    },
-    {
-      "name": "VisioDocument",
-      "unicode": "F2A9"
-    },
-    {
-      "name": "TimelineProgress",
-      "unicode": "F2AA"
-    },
-    {
-      "name": "TimelineDelivery",
-      "unicode": "F2AB"
-    },
-    {
-      "name": "Backlog",
-      "unicode": "F2AC"
-    },
-    {
-      "name": "TeamFavorite",
-      "unicode": "F2AD"
-    },
-    {
-      "name": "TaskGroup",
-      "unicode": "F2AE"
-    },
-    {
-      "name": "TaskGroupMirrored",
-      "unicode": "F2AF"
-    },
-    {
-      "name": "ScopeTemplate",
-      "unicode": "F2B0"
-    },
-    {
-      "name": "AssessmentGroupTemplate",
-      "unicode": "F2B1"
-    },
-    {
-      "name": "NewTeamProject",
-      "unicode": "F2B2"
-    },
-    {
-      "name": "CommentAdd",
-      "unicode": "F2B3"
-    },
-    {
-      "name": "CommentNext",
-      "unicode": "F2B4"
-    },
-    {
-      "name": "CommentPrevious",
-      "unicode": "F2B5"
-    },
-    {
-      "name": "ShopServer",
-      "unicode": "F2B6"
-    },
-    {
-      "name": "LocaleLanguage",
-      "unicode": "F2B7"
-    },
-    {
-      "name": "QueryList",
-      "unicode": "F2B8"
-    },
-    {
-      "name": "UserSync",
-      "unicode": "F2B9"
-    },
-    {
-      "name": "UserPause",
-      "unicode": "F2BA"
-    },
-    {
-      "name": "StreamingOff",
-      "unicode": "F2BB"
-    },
-    {
-      "name": "ArrowTallUpLeft",
-      "unicode": "F2BD"
-    }
-  ]
+	"fontName": "fabric-icons-8",
+	"fontFamilyName": "FabricMDL2Icons-8",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "BranchFork",
+			"unicode": "F173"
+		},
+		{
+			"name": "MobileReport",
+			"unicode": "F18A"
+		},
+		{
+			"name": "HardDriveGroup",
+			"unicode": "F18F"
+		},
+		{
+			"name": "FastMode",
+			"unicode": "F19A"
+		},
+		{
+			"name": "ToggleOff",
+			"unicode": "F19F"
+		},
+		{
+			"name": "Trophy2",
+			"unicode": "F1AE"
+		},
+		{
+			"name": "BucketColor",
+			"unicode": "F1B6"
+		},
+		{
+			"name": "BucketColorFill",
+			"unicode": "F1B7"
+		},
+		{
+			"name": "Taskboard",
+			"unicode": "F1C2"
+		},
+		{
+			"name": "SingleColumn",
+			"unicode": "F1D3"
+		},
+		{
+			"name": "DoubleColumn",
+			"unicode": "F1D4"
+		},
+		{
+			"name": "TripleColumn",
+			"unicode": "F1D5"
+		},
+		{
+			"name": "ColumnLeftTwoThirds",
+			"unicode": "F1D6"
+		},
+		{
+			"name": "ColumnRightTwoThirds",
+			"unicode": "F1D7"
+		},
+		{
+			"name": "AccessLogoFill",
+			"unicode": "F1DB"
+		},
+		{
+			"name": "AnalyticsLogo",
+			"unicode": "F1DE"
+		},
+		{
+			"name": "AnalyticsQuery",
+			"unicode": "F1DF"
+		},
+		{
+			"name": "NewAnalyticsQuery",
+			"unicode": "F1E0"
+		},
+		{
+			"name": "AnalyticsReport",
+			"unicode": "F1E1"
+		},
+		{
+			"name": "WordLogo",
+			"unicode": "F1E3"
+		},
+		{
+			"name": "WordLogoFill",
+			"unicode": "F1E4"
+		},
+		{
+			"name": "ExcelLogo",
+			"unicode": "F1E5"
+		},
+		{
+			"name": "ExcelLogoFill",
+			"unicode": "F1E6"
+		},
+		{
+			"name": "OneNoteLogo",
+			"unicode": "F1E7"
+		},
+		{
+			"name": "OneNoteLogoFill",
+			"unicode": "F1E8"
+		},
+		{
+			"name": "OutlookLogo",
+			"unicode": "F1E9"
+		},
+		{
+			"name": "OutlookLogoFill",
+			"unicode": "F1EA"
+		},
+		{
+			"name": "PowerPointLogo",
+			"unicode": "F1EB"
+		},
+		{
+			"name": "PowerPointLogoFill",
+			"unicode": "F1EC"
+		},
+		{
+			"name": "PublisherLogo",
+			"unicode": "F1ED"
+		},
+		{
+			"name": "PublisherLogoFill",
+			"unicode": "F1EE"
+		},
+		{
+			"name": "ScheduleEventAction",
+			"unicode": "F1EF"
+		},
+		{
+			"name": "FlameSolid",
+			"unicode": "F1F3"
+		},
+		{
+			"name": "ServerProcesses",
+			"unicode": "F1FE"
+		},
+		{
+			"name": "Server",
+			"unicode": "F201"
+		},
+		{
+			"name": "SaveAll",
+			"unicode": "F203"
+		},
+		{
+			"name": "LinkedInLogo",
+			"unicode": "F20A"
+		},
+		{
+			"name": "SidePanelMirrored",
+			"unicode": "F221"
+		},
+		{
+			"name": "ProtectRestrict",
+			"unicode": "F22A"
+		},
+		{
+			"name": "UnknownMirrored",
+			"unicode": "F22E"
+		},
+		{
+			"name": "PublicContactCardMirrored",
+			"unicode": "F230"
+		},
+		{
+			"name": "GridViewSmall",
+			"unicode": "F232"
+		},
+		{
+			"name": "GridViewMedium",
+			"unicode": "F233"
+		},
+		{
+			"name": "GridViewLarge",
+			"unicode": "F234"
+		},
+		{
+			"name": "Step",
+			"unicode": "F241"
+		},
+		{
+			"name": "StepInsert",
+			"unicode": "F242"
+		},
+		{
+			"name": "StepShared",
+			"unicode": "F243"
+		},
+		{
+			"name": "StepSharedAdd",
+			"unicode": "F244"
+		},
+		{
+			"name": "StepSharedInsert",
+			"unicode": "F245"
+		},
+		{
+			"name": "ViewDashboard",
+			"unicode": "F246"
+		},
+		{
+			"name": "ViewList",
+			"unicode": "F247"
+		},
+		{
+			"name": "ViewListGroup",
+			"unicode": "F248"
+		},
+		{
+			"name": "ViewListTree",
+			"unicode": "F249"
+		},
+		{
+			"name": "TriggerAuto",
+			"unicode": "F24A"
+		},
+		{
+			"name": "TriggerUser",
+			"unicode": "F24B"
+		},
+		{
+			"name": "PivotChart",
+			"unicode": "F24C"
+		},
+		{
+			"name": "StackedBarChart",
+			"unicode": "F24D"
+		},
+		{
+			"name": "StackedLineChart",
+			"unicode": "F24E"
+		},
+		{
+			"name": "BuildQueue",
+			"unicode": "F24F"
+		},
+		{
+			"name": "BuildQueueNew",
+			"unicode": "F250"
+		},
+		{
+			"name": "UserFollowed",
+			"unicode": "F25C"
+		},
+		{
+			"name": "ContactLink",
+			"unicode": "F25F"
+		},
+		{
+			"name": "Stack",
+			"unicode": "F26F"
+		},
+		{
+			"name": "Bullseye",
+			"unicode": "F272"
+		},
+		{
+			"name": "VennDiagram",
+			"unicode": "F273"
+		},
+		{
+			"name": "FiveTileGrid",
+			"unicode": "F274"
+		},
+		{
+			"name": "FocalPoint",
+			"unicode": "F277"
+		},
+		{
+			"name": "RingerRemove",
+			"unicode": "F279"
+		},
+		{
+			"name": "TeamsLogoInverse",
+			"unicode": "F27A"
+		},
+		{
+			"name": "TeamsLogo",
+			"unicode": "F27B"
+		},
+		{
+			"name": "TeamsLogoFill",
+			"unicode": "F27C"
+		},
+		{
+			"name": "SkypeForBusinessLogoFill",
+			"unicode": "F27D"
+		},
+		{
+			"name": "SharepointLogo",
+			"unicode": "F27E"
+		},
+		{
+			"name": "SharepointLogoFill",
+			"unicode": "F27F"
+		},
+		{
+			"name": "DelveLogo",
+			"unicode": "F280"
+		},
+		{
+			"name": "DelveLogoFill",
+			"unicode": "F281"
+		},
+		{
+			"name": "OfficeVideoLogo",
+			"unicode": "F282"
+		},
+		{
+			"name": "OfficeVideoLogoFill",
+			"unicode": "F283"
+		},
+		{
+			"name": "ExchangeLogo",
+			"unicode": "F284"
+		},
+		{
+			"name": "ExchangeLogoFill",
+			"unicode": "F285"
+		},
+		{
+			"name": "DocumentApproval",
+			"unicode": "F28B"
+		},
+		{
+			"name": "CloneToDesktop",
+			"unicode": "F28C"
+		},
+		{
+			"name": "InstallToDrive",
+			"unicode": "F28D"
+		},
+		{
+			"name": "Blur",
+			"unicode": "F28E"
+		},
+		{
+			"name": "Build",
+			"unicode": "F28F"
+		},
+		{
+			"name": "ProcessMetaTask",
+			"unicode": "F290"
+		},
+		{
+			"name": "BranchFork2",
+			"unicode": "F291"
+		},
+		{
+			"name": "BranchLocked",
+			"unicode": "F292"
+		},
+		{
+			"name": "BranchCommit",
+			"unicode": "F293"
+		},
+		{
+			"name": "BranchCompare",
+			"unicode": "F294"
+		},
+		{
+			"name": "BranchMerge",
+			"unicode": "F295"
+		},
+		{
+			"name": "BranchPullRequest",
+			"unicode": "F296"
+		},
+		{
+			"name": "BranchSearch",
+			"unicode": "F297"
+		},
+		{
+			"name": "BranchShelveset",
+			"unicode": "F298"
+		},
+		{
+			"name": "RawSource",
+			"unicode": "F299"
+		},
+		{
+			"name": "MergeDuplicate",
+			"unicode": "F29A"
+		},
+		{
+			"name": "RowsGroup",
+			"unicode": "F29B"
+		},
+		{
+			"name": "RowsChild",
+			"unicode": "F29C"
+		},
+		{
+			"name": "Deploy",
+			"unicode": "F29D"
+		},
+		{
+			"name": "Redeploy",
+			"unicode": "F29E"
+		}
+	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-9.json b/packages/icons/config/fabric-icons-9.json
index c286705e82783..4f1f321b4a294 100644
--- a/packages/icons/config/fabric-icons-9.json
+++ b/packages/icons/config/fabric-icons-9.json
@@ -1,412 +1,412 @@
 {
-  "fontName": "fabric-icons-9",
-  "fontFamilyName": "FabricMDL2Icons-9",
-  "excludeGlyphs": false,
-  "chunkSubsets": true,
-  "hashFontFileName": true,
-  "subsetChunkSettings": {
-    "maxSubsetSize": 100
-  },
-  "glyphs": [
-    {
-      "name": "ArrowTallUpRight",
-      "unicode": "F2BE"
-    },
-    {
-      "name": "ArrowTallDownLeft",
-      "unicode": "F2BF"
-    },
-    {
-      "name": "ArrowTallDownRight",
-      "unicode": "F2C0"
-    },
-    {
-      "name": "FieldEmpty",
-      "unicode": "F2C1"
-    },
-    {
-      "name": "FieldFilled",
-      "unicode": "F2C2"
-    },
-    {
-      "name": "FieldChanged",
-      "unicode": "F2C3"
-    },
-    {
-      "name": "FieldNotChanged",
-      "unicode": "F2C4"
-    },
-    {
-      "name": "RingerOff",
-      "unicode": "F2C5"
-    },
-    {
-      "name": "PlayResume",
-      "unicode": "F2C6"
-    },
-    {
-      "name": "BulletedList2",
-      "unicode": "F2C7"
-    },
-    {
-      "name": "BulletedList2Mirrored",
-      "unicode": "F2C8"
-    },
-    {
-      "name": "ImageCrosshair",
-      "unicode": "F2C9"
-    },
-    {
-      "name": "GitGraph",
-      "unicode": "F2CA"
-    },
-    {
-      "name": "Repo",
-      "unicode": "F2CB"
-    },
-    {
-      "name": "RepoSolid",
-      "unicode": "F2CC"
-    },
-    {
-      "name": "FolderQuery",
-      "unicode": "F2CD"
-    },
-    {
-      "name": "FolderList",
-      "unicode": "F2CE"
-    },
-    {
-      "name": "FolderListMirrored",
-      "unicode": "F2CF"
-    },
-    {
-      "name": "LocationOutline",
-      "unicode": "F2D0"
-    },
-    {
-      "name": "POISolid",
-      "unicode": "F2D1"
-    },
-    {
-      "name": "CalculatorNotEqualTo",
-      "unicode": "F2D2"
-    },
-    {
-      "name": "BoxSubtractSolid",
-      "unicode": "F2D3"
-    },
-    {
-      "name": "BoxAdditionSolid",
-      "unicode": "F2D4"
-    },
-    {
-      "name": "BoxMultiplySolid",
-      "unicode": "F2D5"
-    },
-    {
-      "name": "BoxPlaySolid",
-      "unicode": "F2D6"
-    },
-    {
-      "name": "BoxCheckmarkSolid",
-      "unicode": "F2D7"
-    },
-    {
-      "name": "CirclePauseSolid",
-      "unicode": "F2D8"
-    },
-    {
-      "name": "CirclePause",
-      "unicode": "F2D9"
-    },
-    {
-      "name": "MSNVideosSolid",
-      "unicode": "F2DA"
-    },
-    {
-      "name": "CircleStopSolid",
-      "unicode": "F2DB"
-    },
-    {
-      "name": "CircleStop",
-      "unicode": "F2DC"
-    },
-    {
-      "name": "NavigateBack",
-      "unicode": "F2DD"
-    },
-    {
-      "name": "NavigateBackMirrored",
-      "unicode": "F2DE"
-    },
-    {
-      "name": "NavigateForward",
-      "unicode": "F2DF"
-    },
-    {
-      "name": "NavigateForwardMirrored",
-      "unicode": "F2E0"
-    },
-    {
-      "name": "UnknownSolid",
-      "unicode": "F2E1"
-    },
-    {
-      "name": "UnknownMirroredSolid",
-      "unicode": "F2E2"
-    },
-    {
-      "name": "CircleAddition",
-      "unicode": "F2E3"
-    },
-    {
-      "name": "CircleAdditionSolid",
-      "unicode": "F2E4"
-    },
-    {
-      "name": "FilePDB",
-      "unicode": "F2E5"
-    },
-    {
-      "name": "FileTemplate",
-      "unicode": "F2E6"
-    },
-    {
-      "name": "FileSQL",
-      "unicode": "F2E7"
-    },
-    {
-      "name": "FileJAVA",
-      "unicode": "F2E8"
-    },
-    {
-      "name": "FileASPX",
-      "unicode": "F2E9"
-    },
-    {
-      "name": "FileCSS",
-      "unicode": "F2EA"
-    },
-    {
-      "name": "FileSass",
-      "unicode": "F2EB"
-    },
-    {
-      "name": "FileLess",
-      "unicode": "F2EC"
-    },
-    {
-      "name": "FileHTML",
-      "unicode": "F2ED"
-    },
-    {
-      "name": "JavaScriptLanguage",
-      "unicode": "F2EE"
-    },
-    {
-      "name": "CSharpLanguage",
-      "unicode": "F2EF"
-    },
-    {
-      "name": "CSharp",
-      "unicode": "F2F0"
-    },
-    {
-      "name": "VisualBasicLanguage",
-      "unicode": "F2F1"
-    },
-    {
-      "name": "VB",
-      "unicode": "F2F2"
-    },
-    {
-      "name": "CPlusPlusLanguage",
-      "unicode": "F2F3"
-    },
-    {
-      "name": "CPlusPlus",
-      "unicode": "F2F4"
-    },
-    {
-      "name": "FSharpLanguage",
-      "unicode": "F2F5"
-    },
-    {
-      "name": "FSharp",
-      "unicode": "F2F6"
-    },
-    {
-      "name": "TypeScriptLanguage",
-      "unicode": "F2F7"
-    },
-    {
-      "name": "PythonLanguage",
-      "unicode": "F2F8"
-    },
-    {
-      "name": "PY",
-      "unicode": "F2F9"
-    },
-    {
-      "name": "CoffeeScript",
-      "unicode": "F2FA"
-    },
-    {
-      "name": "MarkDownLanguage",
-      "unicode": "F2FB"
-    },
-    {
-      "name": "FullWidth",
-      "unicode": "F2FE"
-    },
-    {
-      "name": "FullWidthEdit",
-      "unicode": "F2FF"
-    },
-    {
-      "name": "SingleColumnEdit",
-      "unicode": "F321"
-    },
-    {
-      "name": "DoubleColumnEdit",
-      "unicode": "F322"
-    },
-    {
-      "name": "TripleColumnEdit",
-      "unicode": "F323"
-    },
-    {
-      "name": "ColumnLeftTwoThirdsEdit",
-      "unicode": "F324"
-    },
-    {
-      "name": "ColumnRightTwoThirdsEdit",
-      "unicode": "F325"
-    },
-    {
-      "name": "StreamLogo",
-      "unicode": "F329"
-    },
-    {
-      "name": "AlertSolid",
-      "unicode": "F331"
-    },
-    {
-      "name": "MegaphoneSolid",
-      "unicode": "F332"
-    },
-    {
-      "name": "TaskSolid",
-      "unicode": "F333"
-    },
-    {
-      "name": "ConfigurationSolid",
-      "unicode": "F334"
-    },
-    {
-      "name": "BugSolid",
-      "unicode": "F335"
-    },
-    {
-      "name": "CrownSolid",
-      "unicode": "F336"
-    },
-    {
-      "name": "Trophy2Solid",
-      "unicode": "F337"
-    },
-    {
-      "name": "QuickNoteSolid",
-      "unicode": "F338"
-    },
-    {
-      "name": "ConstructionConeSolid",
-      "unicode": "F339"
-    },
-    {
-      "name": "PageListSolid",
-      "unicode": "F33A"
-    },
-    {
-      "name": "PageListMirroredSolid",
-      "unicode": "F33B"
-    },
-    {
-      "name": "StarburstSolid",
-      "unicode": "F33C"
-    },
-    {
-      "name": "ReadingModeSolid",
-      "unicode": "F33D"
-    },
-    {
-      "name": "SadSolid",
-      "unicode": "F33E"
-    },
-    {
-      "name": "HealthSolid",
-      "unicode": "F33F"
-    },
-    {
-      "name": "ShieldSolid",
-      "unicode": "F340"
-    },
-    {
-      "name": "GiftBoxSolid",
-      "unicode": "F341"
-    },
-    {
-      "name": "ShoppingCartSolid",
-      "unicode": "F342"
-    },
-    {
-      "name": "MailSolid",
-      "unicode": "F343"
-    },
-    {
-      "name": "ChatSolid",
-      "unicode": "F344"
-    },
-    {
-      "name": "RibbonSolid",
-      "unicode": "F345"
-    },
-    {
-      "name": "FinancialSolid",
-      "unicode": "F346"
-    },
-    {
-      "name": "FinancialMirroredSolid",
-      "unicode": "F347"
-    },
-    {
-      "name": "HeadsetSolid",
-      "unicode": "F348"
-    },
-    {
-      "name": "PermissionsSolid",
-      "unicode": "F349"
-    },
-    {
-      "name": "ParkingSolid",
-      "unicode": "F34A"
-    },
-    {
-      "name": "ParkingMirroredSolid",
-      "unicode": "F34B"
-    },
-    {
-      "name": "DiamondSolid",
-      "unicode": "F34C"
-    },
-    {
-      "name": "AsteriskSolid",
-      "unicode": "F34D"
-    },
-    {
-      "name": "OfflineStorageSolid",
-      "unicode": "F34E"
-    }
-  ]
+	"fontName": "fabric-icons-9",
+	"fontFamilyName": "FabricMDL2Icons-9",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "ServerEnviroment",
+			"unicode": "F29F"
+		},
+		{
+			"name": "VisioDiagram",
+			"unicode": "F2A0"
+		},
+		{
+			"name": "HighlightMappedShapes",
+			"unicode": "F2A1"
+		},
+		{
+			"name": "TextCallout",
+			"unicode": "F2A2"
+		},
+		{
+			"name": "IconSetsFlag",
+			"unicode": "F2A4"
+		},
+		{
+			"name": "VisioLogo",
+			"unicode": "F2A7"
+		},
+		{
+			"name": "VisioLogoFill",
+			"unicode": "F2A8"
+		},
+		{
+			"name": "VisioDocument",
+			"unicode": "F2A9"
+		},
+		{
+			"name": "TimelineProgress",
+			"unicode": "F2AA"
+		},
+		{
+			"name": "TimelineDelivery",
+			"unicode": "F2AB"
+		},
+		{
+			"name": "Backlog",
+			"unicode": "F2AC"
+		},
+		{
+			"name": "TeamFavorite",
+			"unicode": "F2AD"
+		},
+		{
+			"name": "TaskGroup",
+			"unicode": "F2AE"
+		},
+		{
+			"name": "TaskGroupMirrored",
+			"unicode": "F2AF"
+		},
+		{
+			"name": "ScopeTemplate",
+			"unicode": "F2B0"
+		},
+		{
+			"name": "AssessmentGroupTemplate",
+			"unicode": "F2B1"
+		},
+		{
+			"name": "NewTeamProject",
+			"unicode": "F2B2"
+		},
+		{
+			"name": "CommentAdd",
+			"unicode": "F2B3"
+		},
+		{
+			"name": "CommentNext",
+			"unicode": "F2B4"
+		},
+		{
+			"name": "CommentPrevious",
+			"unicode": "F2B5"
+		},
+		{
+			"name": "ShopServer",
+			"unicode": "F2B6"
+		},
+		{
+			"name": "LocaleLanguage",
+			"unicode": "F2B7"
+		},
+		{
+			"name": "QueryList",
+			"unicode": "F2B8"
+		},
+		{
+			"name": "UserSync",
+			"unicode": "F2B9"
+		},
+		{
+			"name": "UserPause",
+			"unicode": "F2BA"
+		},
+		{
+			"name": "StreamingOff",
+			"unicode": "F2BB"
+		},
+		{
+			"name": "ArrowTallUpLeft",
+			"unicode": "F2BD"
+		},
+		{
+			"name": "ArrowTallUpRight",
+			"unicode": "F2BE"
+		},
+		{
+			"name": "ArrowTallDownLeft",
+			"unicode": "F2BF"
+		},
+		{
+			"name": "ArrowTallDownRight",
+			"unicode": "F2C0"
+		},
+		{
+			"name": "FieldEmpty",
+			"unicode": "F2C1"
+		},
+		{
+			"name": "FieldFilled",
+			"unicode": "F2C2"
+		},
+		{
+			"name": "FieldChanged",
+			"unicode": "F2C3"
+		},
+		{
+			"name": "FieldNotChanged",
+			"unicode": "F2C4"
+		},
+		{
+			"name": "RingerOff",
+			"unicode": "F2C5"
+		},
+		{
+			"name": "PlayResume",
+			"unicode": "F2C6"
+		},
+		{
+			"name": "BulletedList2",
+			"unicode": "F2C7"
+		},
+		{
+			"name": "BulletedList2Mirrored",
+			"unicode": "F2C8"
+		},
+		{
+			"name": "ImageCrosshair",
+			"unicode": "F2C9"
+		},
+		{
+			"name": "GitGraph",
+			"unicode": "F2CA"
+		},
+		{
+			"name": "Repo",
+			"unicode": "F2CB"
+		},
+		{
+			"name": "RepoSolid",
+			"unicode": "F2CC"
+		},
+		{
+			"name": "FolderQuery",
+			"unicode": "F2CD"
+		},
+		{
+			"name": "FolderList",
+			"unicode": "F2CE"
+		},
+		{
+			"name": "FolderListMirrored",
+			"unicode": "F2CF"
+		},
+		{
+			"name": "LocationOutline",
+			"unicode": "F2D0"
+		},
+		{
+			"name": "POISolid",
+			"unicode": "F2D1"
+		},
+		{
+			"name": "CalculatorNotEqualTo",
+			"unicode": "F2D2"
+		},
+		{
+			"name": "BoxSubtractSolid",
+			"unicode": "F2D3"
+		},
+		{
+			"name": "BoxAdditionSolid",
+			"unicode": "F2D4"
+		},
+		{
+			"name": "BoxMultiplySolid",
+			"unicode": "F2D5"
+		},
+		{
+			"name": "BoxPlaySolid",
+			"unicode": "F2D6"
+		},
+		{
+			"name": "BoxCheckmarkSolid",
+			"unicode": "F2D7"
+		},
+		{
+			"name": "CirclePauseSolid",
+			"unicode": "F2D8"
+		},
+		{
+			"name": "CirclePause",
+			"unicode": "F2D9"
+		},
+		{
+			"name": "MSNVideosSolid",
+			"unicode": "F2DA"
+		},
+		{
+			"name": "CircleStopSolid",
+			"unicode": "F2DB"
+		},
+		{
+			"name": "CircleStop",
+			"unicode": "F2DC"
+		},
+		{
+			"name": "NavigateBack",
+			"unicode": "F2DD"
+		},
+		{
+			"name": "NavigateBackMirrored",
+			"unicode": "F2DE"
+		},
+		{
+			"name": "NavigateForward",
+			"unicode": "F2DF"
+		},
+		{
+			"name": "NavigateForwardMirrored",
+			"unicode": "F2E0"
+		},
+		{
+			"name": "UnknownSolid",
+			"unicode": "F2E1"
+		},
+		{
+			"name": "UnknownMirroredSolid",
+			"unicode": "F2E2"
+		},
+		{
+			"name": "CircleAddition",
+			"unicode": "F2E3"
+		},
+		{
+			"name": "CircleAdditionSolid",
+			"unicode": "F2E4"
+		},
+		{
+			"name": "FilePDB",
+			"unicode": "F2E5"
+		},
+		{
+			"name": "FileTemplate",
+			"unicode": "F2E6"
+		},
+		{
+			"name": "FileSQL",
+			"unicode": "F2E7"
+		},
+		{
+			"name": "FileJAVA",
+			"unicode": "F2E8"
+		},
+		{
+			"name": "FileASPX",
+			"unicode": "F2E9"
+		},
+		{
+			"name": "FileCSS",
+			"unicode": "F2EA"
+		},
+		{
+			"name": "FileSass",
+			"unicode": "F2EB"
+		},
+		{
+			"name": "FileLess",
+			"unicode": "F2EC"
+		},
+		{
+			"name": "FileHTML",
+			"unicode": "F2ED"
+		},
+		{
+			"name": "JavaScriptLanguage",
+			"unicode": "F2EE"
+		},
+		{
+			"name": "CSharpLanguage",
+			"unicode": "F2EF"
+		},
+		{
+			"name": "CSharp",
+			"unicode": "F2F0"
+		},
+		{
+			"name": "VisualBasicLanguage",
+			"unicode": "F2F1"
+		},
+		{
+			"name": "VB",
+			"unicode": "F2F2"
+		},
+		{
+			"name": "CPlusPlusLanguage",
+			"unicode": "F2F3"
+		},
+		{
+			"name": "CPlusPlus",
+			"unicode": "F2F4"
+		},
+		{
+			"name": "FSharpLanguage",
+			"unicode": "F2F5"
+		},
+		{
+			"name": "FSharp",
+			"unicode": "F2F6"
+		},
+		{
+			"name": "TypeScriptLanguage",
+			"unicode": "F2F7"
+		},
+		{
+			"name": "PythonLanguage",
+			"unicode": "F2F8"
+		},
+		{
+			"name": "PY",
+			"unicode": "F2F9"
+		},
+		{
+			"name": "CoffeeScript",
+			"unicode": "F2FA"
+		},
+		{
+			"name": "MarkDownLanguage",
+			"unicode": "F2FB"
+		},
+		{
+			"name": "FullWidth",
+			"unicode": "F2FE"
+		},
+		{
+			"name": "FullWidthEdit",
+			"unicode": "F2FF"
+		},
+		{
+			"name": "Plug",
+			"unicode": "F300"
+		},
+		{
+			"name": "PlugSolid",
+			"unicode": "F301"
+		},
+		{
+			"name": "PlugConnected",
+			"unicode": "F302"
+		},
+		{
+			"name": "PlugDisconnected",
+			"unicode": "F303"
+		},
+		{
+			"name": "UnlockSolid",
+			"unicode": "F304"
+		},
+		{
+			"name": "Variable",
+			"unicode": "F305"
+		},
+		{
+			"name": "Parameter",
+			"unicode": "F306"
+		},
+		{
+			"name": "CommentUrgent",
+			"unicode": "F307"
+		},
+		{
+			"name": "Storyboard",
+			"unicode": "F308"
+		}
+	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons.json b/packages/icons/config/fabric-icons.json
index 3135638f0bd45..1919619e0096d 100644
--- a/packages/icons/config/fabric-icons.json
+++ b/packages/icons/config/fabric-icons.json
@@ -1,228 +1,232 @@
 {
-  "fontName": "fabric-icons",
-  "fontFamilyName": "FabricMDL2Icons",
-  "excludeGlyphs": false,
-  "chunkSubsets": true,
-  "hashFontFileName": true,
-  "subsetChunkSettings": {
-    "maxSubsetSize": 100
-  },
-  "glyphs": [
-    {
-      "name": "GlobalNavButton",
-      "unicode": "E700"
-    },
-    {
-      "name": "ChevronDown",
-      "unicode": "E70D"
-    },
-    {
-      "name": "ChevronUp",
-      "unicode": "E70E"
-    },
-    {
-      "name": "Edit",
-      "unicode": "E70F"
-    },
-    {
-      "name": "Add",
-      "unicode": "E710"
-    },
-    {
-      "name": "Cancel",
-      "unicode": "E711"
-    },
-    {
-      "name": "More",
-      "unicode": "E712"
-    },
-    {
-      "name": "Settings",
-      "unicode": "E713"
-    },
-    {
-      "name": "Mail",
-      "unicode": "E715"
-    },
-    {
-      "name": "Filter",
-      "unicode": "E71C"
-    },
-    {
-      "name": "Search",
-      "unicode": "E721"
-    },
-    {
-      "name": "Share",
-      "unicode": "E72D"
-    },
-    {
-      "name": "FavoriteStar",
-      "unicode": "E734"
-    },
-    {
-      "name": "FavoriteStarFill",
-      "unicode": "E735"
-    },
-    {
-      "name": "CheckMark",
-      "unicode": "E73E"
-    },
-    {
-      "name": "Delete",
-      "unicode": "E74D"
-    },
-    {
-      "name": "ChevronLeft",
-      "unicode": "E76B"
-    },
-    {
-      "name": "ChevronRight",
-      "unicode": "E76C"
-    },
-    {
-      "name": "Calendar",
-      "unicode": "E787"
-    },
-    {
-      "name": "Undo",
-      "unicode": "E7A7"
-    },
-    {
-      "name": "Flag",
-      "unicode": "E7C1"
-    },
-    {
-      "name": "Page",
-      "unicode": "E7C3"
-    },
-    {
-      "name": "View",
-      "unicode": "E890"
-    },
-    {
-      "name": "Clear",
-      "unicode": "E894"
-    },
-    {
-      "name": "Download",
-      "unicode": "E896"
-    },
-    {
-      "name": "Upload",
-      "unicode": "E898"
-    },
-    {
-      "name": "Folder",
-      "unicode": "E8B7"
-    },
-    {
-      "name": "Sort",
-      "unicode": "E8CB"
-    },
-    {
-      "name": "AlignRight",
-      "unicode": "E8E2"
-    },
-    {
-      "name": "AlignLeft",
-      "unicode": "E8E4"
-    },
-    {
-      "name": "Tag",
-      "unicode": "E8EC"
-    },
-    {
-      "name": "AddFriend",
-      "unicode": "E8FA"
-    },
-    {
-      "name": "Info",
-      "unicode": "E946"
-    },
-    {
-      "name": "Pinned",
-      "unicode": "E840"
-    },
-    {
-      "name": "SortLines",
-      "unicode": "E9D0"
-    },
-    {
-      "name": "List",
-      "unicode": "EA37"
-    },
-    {
-      "name": "CircleRing",
-      "unicode": "EA3A"
-    },
-    {
-      "name": "Heart",
-      "unicode": "EB51"
-    },
-    {
-      "name": "HeartFill",
-      "unicode": "EB52"
-    },
-    {
-      "name": "Tiles",
-      "unicode": "ECA5"
-    },
-    {
-      "name": "Embed",
-      "unicode": "ECCE"
-    },
-    {
-      "name": "Ascending",
-      "unicode": "EDC0"
-    },
-    {
-      "name": "Descending",
-      "unicode": "EDC1"
-    },
-    {
-      "name": "SortUp",
-      "unicode": "EE68"
-    },
-    {
-      "name": "SortDown",
-      "unicode": "EE69"
-    },
-    {
-      "name": "SyncToPC",
-      "unicode": "EE6E"
-    },
-    {
-      "name": "LargeGrid",
-      "unicode": "EECB"
-    },
-    {
-      "name": "SkypeCheck",
-      "unicode": "EF80"
-    },
-    {
-      "name": "SkypeClock",
-      "unicode": "EF81"
-    },
-    {
-      "name": "SkypeMinus",
-      "unicode": "EF82"
-    },
-    {
-      "name": "ClearFilter",
-      "unicode": "EF8F"
-    },
-    {
-      "name": "Flow",
-      "unicode": "EF90"
-    },
-    {
-      "name": "StatusCircleCheckmark",
-      "unicode": "F13E"
-    },
-    {
-      "name": "MoreVertical",
-      "unicode": "F2BC"
-    }
-  ]
+	"fontName": "fabric-icons",
+	"fontFamilyName": "FabricMDL2Icons",
+	"excludeGlyphs": false,
+	"chunkSubsets": true,
+	"hashFontFileName": true,
+	"subsetChunkSettings": {
+		"maxSubsetSize": 100
+	},
+	"glyphs": [
+		{
+			"name": "GlobalNavButton",
+			"unicode": "E700"
+		},
+		{
+			"name": "ChevronDown",
+			"unicode": "E70D"
+		},
+		{
+			"name": "ChevronUp",
+			"unicode": "E70E"
+		},
+		{
+			"name": "Edit",
+			"unicode": "E70F"
+		},
+		{
+			"name": "Add",
+			"unicode": "E710"
+		},
+		{
+			"name": "Cancel",
+			"unicode": "E711"
+		},
+		{
+			"name": "More",
+			"unicode": "E712"
+		},
+		{
+			"name": "Settings",
+			"unicode": "E713"
+		},
+		{
+			"name": "Mail",
+			"unicode": "E715"
+		},
+		{
+			"name": "Filter",
+			"unicode": "E71C"
+		},
+		{
+			"name": "Search",
+			"unicode": "E721"
+		},
+		{
+			"name": "Share",
+			"unicode": "E72D"
+		},
+		{
+			"name": "FavoriteStar",
+			"unicode": "E734"
+		},
+		{
+			"name": "FavoriteStarFill",
+			"unicode": "E735"
+		},
+		{
+			"name": "CheckMark",
+			"unicode": "E73E"
+		},
+		{
+			"name": "Delete",
+			"unicode": "E74D"
+		},
+		{
+			"name": "ChevronLeft",
+			"unicode": "E76B"
+		},
+		{
+			"name": "ChevronRight",
+			"unicode": "E76C"
+		},
+		{
+			"name": "Calendar",
+			"unicode": "E787"
+		},
+		{
+			"name": "Megaphone",
+			"unicode": "E789"
+		},
+		{
+			"name": "Undo",
+			"unicode": "E7A7"
+		},
+		{
+			"name": "Flag",
+			"unicode": "E7C1"
+		},
+		{
+			"name": "Page",
+			"unicode": "E7C3"
+		},
+		{
+			"name": "Pinned",
+			"unicode": "E840"
+		},
+		{
+			"name": "View",
+			"unicode": "E890"
+		},
+		{
+			"name": "Clear",
+			"unicode": "E894"
+		},
+		{
+			"name": "Download",
+			"unicode": "E896"
+		},
+		{
+			"name": "Upload",
+			"unicode": "E898"
+		},
+		{
+			"name": "Folder",
+			"unicode": "E8B7"
+		},
+		{
+			"name": "Sort",
+			"unicode": "E8CB"
+		},
+		{
+			"name": "AlignRight",
+			"unicode": "E8E2"
+		},
+		{
+			"name": "AlignLeft",
+			"unicode": "E8E4"
+		},
+		{
+			"name": "Tag",
+			"unicode": "E8EC"
+		},
+		{
+			"name": "AddFriend",
+			"unicode": "E8FA"
+		},
+		{
+			"name": "Info",
+			"unicode": "E946"
+		},
+		{
+			"name": "SortLines",
+			"unicode": "E9D0"
+		},
+		{
+			"name": "List",
+			"unicode": "EA37"
+		},
+		{
+			"name": "CircleRing",
+			"unicode": "EA3A"
+		},
+		{
+			"name": "Heart",
+			"unicode": "EB51"
+		},
+		{
+			"name": "HeartFill",
+			"unicode": "EB52"
+		},
+		{
+			"name": "Tiles",
+			"unicode": "ECA5"
+		},
+		{
+			"name": "Embed",
+			"unicode": "ECCE"
+		},
+		{
+			"name": "Ascending",
+			"unicode": "EDC0"
+		},
+		{
+			"name": "Descending",
+			"unicode": "EDC1"
+		},
+		{
+			"name": "SortUp",
+			"unicode": "EE68"
+		},
+		{
+			"name": "SortDown",
+			"unicode": "EE69"
+		},
+		{
+			"name": "SyncToPC",
+			"unicode": "EE6E"
+		},
+		{
+			"name": "LargeGrid",
+			"unicode": "EECB"
+		},
+		{
+			"name": "SkypeCheck",
+			"unicode": "EF80"
+		},
+		{
+			"name": "SkypeClock",
+			"unicode": "EF81"
+		},
+		{
+			"name": "SkypeMinus",
+			"unicode": "EF82"
+		},
+		{
+			"name": "ClearFilter",
+			"unicode": "EF8F"
+		},
+		{
+			"name": "Flow",
+			"unicode": "EF90"
+		},
+		{
+			"name": "StatusCircleCheckmark",
+			"unicode": "F13E"
+		},
+		{
+			"name": "MoreVertical",
+			"unicode": "F2BC"
+		}
+	]
 }
\ No newline at end of file

From f37ea42b401f55ec9a7e223c90ec653b5aa6d827 Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Wed, 31 Jan 2018 17:52:38 -0800
Subject: [PATCH 1304/1641] Theme Generator: fix neutral colors (#3855)

* fix colors

* change file
---
 .../phkuo-fixAlgo_2018-02-01-00-41.json               | 11 +++++++++++
 .../components/ThemeGenerator/ThemeRulesStandard.ts   |  4 ++--
 .../src/utilities/color/shades.ts                     |  4 ++--
 3 files changed, 15 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/phkuo-fixAlgo_2018-02-01-00-41.json

diff --git a/common/changes/office-ui-fabric-react/phkuo-fixAlgo_2018-02-01-00-41.json b/common/changes/office-ui-fabric-react/phkuo-fixAlgo_2018-02-01-00-41.json
new file mode 100644
index 0000000000000..9c196422e9ecc
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/phkuo-fixAlgo_2018-02-01-00-41.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Theme Generator: fix autogenerated neutral colors",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
index 38a122110f205..0211f02aac1dc 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
@@ -149,8 +149,8 @@ export function themeRulesStandardCreator() {
   _makeFabricSlotRule(FabricSlots[FabricSlots.neutralQuaternary], BaseSlots.backgroundColor, Shade.Shade5, true);
   _makeFabricSlotRule(FabricSlots[FabricSlots.neutralTertiaryAlt], BaseSlots.backgroundColor, Shade.Shade6, true); // bg6 or fg2
   _makeFabricSlotRule(FabricSlots[FabricSlots.neutralTertiary], BaseSlots.foregroundColor, Shade.Shade3);
-  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralSecondary], BaseSlots.foregroundColor, Shade.Shade5);
-  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralPrimaryAlt], BaseSlots.foregroundColor, Shade.Shade6);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralSecondary], BaseSlots.foregroundColor, Shade.Shade4);
+  _makeFabricSlotRule(FabricSlots[FabricSlots.neutralPrimaryAlt], BaseSlots.foregroundColor, Shade.Shade5);
   _makeFabricSlotRule(FabricSlots[FabricSlots.neutralPrimary], BaseSlots.foregroundColor, Shade.Unshaded);
   _makeFabricSlotRule(FabricSlots[FabricSlots.neutralDark], BaseSlots.foregroundColor, Shade.Shade7);
 
diff --git a/packages/office-ui-fabric-react/src/utilities/color/shades.ts b/packages/office-ui-fabric-react/src/utilities/color/shades.ts
index 8a5178887ca35..c3278c90aaa02 100644
--- a/packages/office-ui-fabric-react/src/utilities/color/shades.ts
+++ b/packages/office-ui-fabric-react/src/utilities/color/shades.ts
@@ -19,8 +19,8 @@ const WhiteShadeTable = [.463, .651, .784, .816, .855, .918, .957, .973]; // whi
 const BlackTintTable = [.463, .55, .651, .784, .816, .855, .918, .957]; // black fg
 const LumTintTable = [.12, .23, .34, .45, .56, .67, .78, .89]; // light (strongen all)
 const LumShadeTable = [.89, .78, .67, .56, .45, .34, .23, .12]; // dark (soften all)
-const ColorTintTable = [.050, .100, .200, .42, .90]; // default soften
-const ColorShadeTable = [.90, .70, .550]; // default strongen
+const ColorTintTable = [.07, .18, .436, .751, .956]; // default soften
+const ColorShadeTable = [.90, .64, .550]; // default strongen
 
 // If the given shade's luminance is below/above these values, we'll swap to using the White/Black tables above
 const c_LuminanceLow = 0.2;

From 693dcf74a3a73de7ff042473ad689f3b3a331e37 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 1 Feb 2018 03:23:18 -0800
Subject: [PATCH 1305/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 ...-icon-config-update2_2018-01-31-22-05.json | 11 ------
 ...eshpande-icon-update_2018-01-24-23-44.json | 11 ------
 ...controlled-textfield_2018-01-24-23-29.json | 11 ------
 .../phkuo-fixAlgo_2018-02-01-00-41.json       | 11 ------
 .../selection-modal_2018-01-30-15-24.json     | 11 ------
 .../stick-bgc-3776_2018-01-29-23-43.json      | 11 ------
 packages/experiments/package.json             |  4 +--
 packages/icons/CHANGELOG.json                 | 19 +++++++++++
 packages/icons/CHANGELOG.md                   | 10 +++++-
 packages/icons/package.json                   |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 34 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 12 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 14 files changed, 79 insertions(+), 74 deletions(-)
 delete mode 100644 common/changes/@uifabric/icons/srideshpande-icon-config-update2_2018-01-31-22-05.json
 delete mode 100644 common/changes/@uifabric/icons/srideshpande-icon-update_2018-01-24-23-44.json
 delete mode 100644 common/changes/office-ui-fabric-react/-1350-controlled-textfield_2018-01-24-23-29.json
 delete mode 100644 common/changes/office-ui-fabric-react/phkuo-fixAlgo_2018-02-01-00-41.json
 delete mode 100644 common/changes/office-ui-fabric-react/selection-modal_2018-01-30-15-24.json
 delete mode 100644 common/changes/office-ui-fabric-react/stick-bgc-3776_2018-01-29-23-43.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index fb05e91dcafa9..cb67d96d7983b 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.45.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.45.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/srideshpande-icon-config-update2_2018-01-31-22-05.json b/common/changes/@uifabric/icons/srideshpande-icon-config-update2_2018-01-31-22-05.json
deleted file mode 100644
index 4ce5961009bea..0000000000000
--- a/common/changes/@uifabric/icons/srideshpande-icon-config-update2_2018-01-31-22-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/icons",
-      "comment": "updating config files in @uifabric/icons package",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/icons",
-  "email": "srdeshpa@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/srideshpande-icon-update_2018-01-24-23-44.json b/common/changes/@uifabric/icons/srideshpande-icon-update_2018-01-24-23-44.json
deleted file mode 100644
index 6fcb96111e0eb..0000000000000
--- a/common/changes/@uifabric/icons/srideshpande-icon-update_2018-01-24-23-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/icons",
-      "comment": "Updating fabric icons in office-ui-fabric-react's  @uifabric/icons package",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/icons",
-  "email": "srdeshpa@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/-1350-controlled-textfield_2018-01-24-23-29.json b/common/changes/office-ui-fabric-react/-1350-controlled-textfield_2018-01-24-23-29.json
deleted file mode 100644
index 7a07c28b30bbc..0000000000000
--- a/common/changes/office-ui-fabric-react/-1350-controlled-textfield_2018-01-24-23-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Adds the _isControlled flag to the TextField component that disabled onChange if the value prop is set, which follows developer expectations with React inputs.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-jojanz@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/phkuo-fixAlgo_2018-02-01-00-41.json b/common/changes/office-ui-fabric-react/phkuo-fixAlgo_2018-02-01-00-41.json
deleted file mode 100644
index 9c196422e9ecc..0000000000000
--- a/common/changes/office-ui-fabric-react/phkuo-fixAlgo_2018-02-01-00-41.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Theme Generator: fix autogenerated neutral colors",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/selection-modal_2018-01-30-15-24.json b/common/changes/office-ui-fabric-react/selection-modal_2018-01-30-15-24.json
deleted file mode 100644
index 8c3438eeae852..0000000000000
--- a/common/changes/office-ui-fabric-react/selection-modal_2018-01-30-15-24.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix bug in modal selection handling",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/stick-bgc-3776_2018-01-29-23-43.json b/common/changes/office-ui-fabric-react/stick-bgc-3776_2018-01-29-23-43.json
deleted file mode 100644
index de7f060b2fb53..0000000000000
--- a/common/changes/office-ui-fabric-react/stick-bgc-3776_2018-01-29-23-43.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "added return default when reaching the html tag in while loop inside _getBackground() inside Sticky component.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 54932f82bea6f..0421f7addd6ce 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,8 +44,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.45.1 <6.0.0",
-    "@uifabric/icons": ">=5.4.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.45.2 <6.0.0",
+    "@uifabric/icons": ">=5.4.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/icons/CHANGELOG.json b/packages/icons/CHANGELOG.json
index b77224eddf7cf..9853429310c50 100644
--- a/packages/icons/CHANGELOG.json
+++ b/packages/icons/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/icons",
   "entries": [
+    {
+      "version": "5.4.2",
+      "tag": "@uifabric/icons_v5.4.2",
+      "date": "Thu, 01 Feb 2018 11:23:17 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Srikanth Deshpande <srideshpande@users.noreply.github.com>",
+            "commit": "952ad7979322352ca597d4e6319391529d5d2212",
+            "comment": "updating config files in @uifabric/icons package"
+          },
+          {
+            "author": "Srikanth Deshpande <srideshpande@users.noreply.github.com>",
+            "commit": "66a91aadb99bca3923125d62cadc15984dba0be6",
+            "comment": "Updating fabric icons in office-ui-fabric-react's  @uifabric/icons package"
+          }
+        ]
+      }
+    },
     {
       "version": "5.4.1",
       "tag": "@uifabric/icons_v5.4.1",
diff --git a/packages/icons/CHANGELOG.md b/packages/icons/CHANGELOG.md
index 41811b8733de0..dd9cdf3e8ef04 100644
--- a/packages/icons/CHANGELOG.md
+++ b/packages/icons/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - @uifabric/icons
 
-This log was last generated on Mon, 29 Jan 2018 11:23:40 GMT and should not be manually modified.
+This log was last generated on Thu, 01 Feb 2018 11:23:17 GMT and should not be manually modified.
+
+## 5.4.2
+Thu, 01 Feb 2018 11:23:17 GMT
+
+### Patches
+
+- updating config files in @uifabric/icons package
+- Updating fabric icons in office-ui-fabric-react's  @uifabric/icons package
 
 ## 5.4.1
 Mon, 29 Jan 2018 11:23:40 GMT
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 7b87ae1fe5dcb..0718fae836e2b 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/icons",
-  "version": "5.4.1",
+  "version": "5.4.2",
   "description": "Office UI Fabric icon set.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 6ed5890e8e686..0946b11c331a0 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,40 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.45.2",
+      "tag": "office-ui-fabric-react_v5.45.2",
+      "date": "Thu, 01 Feb 2018 11:23:17 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jordan Janzen <jordancjanzen@gmail.com>",
+            "commit": "b17a45fe057f50aa489be21d3e517d783b40b9e1",
+            "comment": "Adds the _isControlled flag to the TextField component that disabled onChange if the value prop is set, which follows developer expectations with React inputs."
+          },
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "f37ea42b401f55ec9a7e223c90ec653b5aa6d827",
+            "comment": "Theme Generator: fix autogenerated neutral colors"
+          },
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "c304b01fa7c0a98e54dc1c9af67c6a0d695838e8",
+            "comment": "Fix bug in modal selection handling"
+          },
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "ddc544059e61523a8294b16275ae2e8706241e4f",
+            "comment": "added return default when reaching the html tag in while loop inside _getBackground() inside Sticky component."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/icons\" from `>=5.4.1 <6.0.0` to `>=5.4.2 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.45.1",
       "tag": "office-ui-fabric-react_v5.45.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 775681a12afdb..b8661c8aa3cfc 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,16 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 31 Jan 2018 11:11:59 GMT and should not be manually modified.
+This log was last generated on Thu, 01 Feb 2018 11:23:17 GMT and should not be manually modified.
+
+## 5.45.2
+Thu, 01 Feb 2018 11:23:17 GMT
+
+### Patches
+
+- Adds the _isControlled flag to the TextField component that disabled onChange if the value prop is set, which follows developer expectations with React inputs.
+- Theme Generator: fix autogenerated neutral colors
+- Fix bug in modal selection handling
+- added return default when reaching the html tag in while loop inside _getBackground() inside Sticky component.
 
 ## 5.45.1
 Wed, 31 Jan 2018 11:11:59 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 7a28ef220fe84..973fbd9aa4ed6 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.45.1",
+  "version": "5.45.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -48,7 +48,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/icons": ">=5.4.1 <6.0.0",
+    "@uifabric/icons": ">=5.4.2 <6.0.0",
     "@uifabric/merge-styles": ">=5.11.0 <6.0.0",
     "@uifabric/styling": ">=5.17.0 <6.0.0",
     "@uifabric/utilities": ">=5.9.0 <6.0.0",

From 78c61efde3fb8ba11d5124adca4934f823094747 Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Thu, 1 Feb 2018 11:20:29 -0800
Subject: [PATCH 1306/1641] ActivityItemExample mergeStyles Converstion (#3844)

migrated ActivityItemExample to use mergestyles instead of scss
---
 ...tyItemEx-mergestyles_2018-01-31-00-28.json |  11 ++
 .../ActivityItem/ActivityItemPage.tsx         |   1 -
 .../examples/ActivityItem.Basic.Example.tsx   |  91 +++++----
 .../examples/ActivityItem.Compact.Example.tsx | 111 ++++++-----
 .../examples/ActivityItem.Example.scss        |   9 -
 .../examples/ActivityItem.Example.styles.ts   |  23 +++
 .../examples/ActivityItem.Persona.Example.tsx | 183 +++++++++---------
 7 files changed, 240 insertions(+), 189 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/ActivityItemEx-mergestyles_2018-01-31-00-28.json
 delete mode 100644 packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Example.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Example.styles.ts

diff --git a/common/changes/office-ui-fabric-react/ActivityItemEx-mergestyles_2018-01-31-00-28.json b/common/changes/office-ui-fabric-react/ActivityItemEx-mergestyles_2018-01-31-00-28.json
new file mode 100644
index 0000000000000..8f965fe134481
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/ActivityItemEx-mergestyles_2018-01-31-00-28.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Converted ActivityItemExample to use mergeStyles instead of SCSS",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItemPage.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItemPage.tsx
index 156563f8dbb9b..c84fdf7a6ec9b 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItemPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItemPage.tsx
@@ -5,7 +5,6 @@ import {
   IComponentDemoPageProps,
   PropertiesTableSet
 } from '@uifabric/example-app-base';
-import './examples/ActivityItem.Example.scss';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { ActivityItemStatus } from './ActivityItem.checklist';
 import { ActivityItemBasicExample } from './examples/ActivityItem.Basic.Example';
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Basic.Example.tsx
index bd9ddf41104c7..183891565cf45 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Basic.Example.tsx
@@ -1,57 +1,66 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
+import { css, classNamesFunction } from '../../../Utilities';
 import { ActivityItem } from '../ActivityItem';
+import {
+  getStyles,
+  IActivityItemExampleStyleProps,
+  IActivityItemExampleStyles
+} from './ActivityItem.Example.styles';
 import { Icon } from '../../../Icon';
 import { Link } from '../../../Link';
 
-// tslint:disable:jsx-no-lambda
-const activityItemExamples = [
-  {
-    key: 1,
-    activityDescription: [
-      <Link key={ 1 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A name was clicked.'); } } >Philippe Lampros</Link>,
-      <span key={ 2 }> commented</span>
-    ],
-    activityIcon: <Icon iconName={ 'Message' } />,
-    comments: [
-      <span key={ 1 }>Hello! I am making a comment and mentioning </span>,
-      <Link key={ 2 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('An @mentioned name was clicked.'); } } >@Anđela Debeljak</Link>,
-      <span key={ 3 }> in the text of the comment.</span>
-    ],
-    timeStamp: 'Just now'
-  },
-  {
-    key: 2,
-    activityDescription: [
-      <Link key={ 1 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A name was clicked.'); } } >Lisha Refai</Link>,
-      <span key={ 2 }> deleted </span>,
-      <span key={ 3 } className={ 'ms-activityItem-nameText' }>DocumentTitle.docx</span>
-    ],
-    activityIcon: <Icon iconName={ 'Trash' } />,
-    timeStamp: '2 hours ago'
-  },
-  {
-    key: 3,
-    activityDescription: [
-      <Link key={ 1 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A name was clicked.'); } } >Julian Arvidsson</Link>,
-      <span key={ 2 }> moved </span>,
-      <Link key={ 3 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A document was clicked.'); } } >PresentationTitle.pptx</Link>,
-      <span key={ 4 }> to </span>,
-      <Link key={ 5 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A folder was clicked.'); } } >Destination Folder</Link>
-    ],
-    activityIcon: <Icon iconName={ 'FabricMovetoFolder' } />,
-    timeStamp: 'Yesterday'
-  }
-];
-
 export class ActivityItemBasicExample extends React.Component<React.Props<ActivityItemBasicExample>, {}> {
   public render() {
+    const getClassNames = classNamesFunction<IActivityItemExampleStyleProps, IActivityItemExampleStyles>();
+    const classNames = getClassNames(getStyles);
+
+    // tslint:disable:jsx-no-lambda
+    const activityItemExamples = [
+      {
+        key: 1,
+        activityDescription: [
+          <Link key={ 1 } className={ css(classNames.nameText) } onClick={ () => { alert('A name was clicked.'); } } >Philippe Lampros</Link>,
+          <span key={ 2 }> commented</span>
+        ],
+        activityIcon: <Icon iconName={ 'Message' } />,
+        comments: [
+          <span key={ 1 }>Hello! I am making a comment and mentioning </span>,
+          <Link key={ 2 } className={ css(classNames.nameText) } onClick={ () => { alert('An @mentioned name was clicked.'); } } >@Anđela Debeljak</Link>,
+          <span key={ 3 }> in the text of the comment.</span>
+        ],
+        timeStamp: 'Just now'
+      },
+      {
+        key: 2,
+        activityDescription: [
+          <Link key={ 1 } className={ css(classNames.nameText) } onClick={ () => { alert('A name was clicked.'); } } >Lisha Refai</Link>,
+          <span key={ 2 }> deleted </span>,
+          <span key={ 3 } className={ css(classNames.nameText) }>DocumentTitle.docx</span>
+        ],
+        activityIcon: <Icon iconName={ 'Trash' } />,
+        timeStamp: '2 hours ago'
+      },
+      {
+        key: 3,
+        activityDescription: [
+          <Link key={ 1 } className={ css(classNames.nameText) } onClick={ () => { alert('A name was clicked.'); } } >Julian Arvidsson</Link>,
+          <span key={ 2 }> moved </span>,
+          <Link key={ 3 } className={ css(classNames.nameText) } onClick={ () => { alert('A document was clicked.'); } } >PresentationTitle.pptx</Link>,
+          <span key={ 4 }> to </span>,
+          <Link key={ 5 } className={ css(classNames.nameText) } onClick={ () => { alert('A folder was clicked.'); } } >Destination Folder</Link>
+        ],
+        activityIcon: <Icon iconName={ 'FabricMovetoFolder' } />,
+        timeStamp: 'Yesterday'
+      }
+    ];
+
     let activityExampleList: Array<JSX.Element> = [];
     activityItemExamples.forEach((item) => {
       let props = item;
       activityExampleList.push(
-        <ActivityItem {...props} key={ item.key } className={ 'ms-activityItem-exampleRoot' } />
+        <ActivityItem {...props} key={ item.key } className={ css(classNames.exampleRoot) } />
       );
     });
 
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Compact.Example.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Compact.Example.tsx
index 335079872144d..1f845e585933b 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Compact.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Compact.Example.tsx
@@ -1,73 +1,82 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
+import { css, classNamesFunction } from '../../../Utilities';
 import { ActivityItem } from '../ActivityItem';
+import {
+  getStyles,
+  IActivityItemExampleStyleProps,
+  IActivityItemExampleStyles
+} from './ActivityItem.Example.styles';
 import { TestImages } from '../../../common/TestImages';
 import { Icon } from '../../../Icon';
 
-const activityItemExamples = [
-  {
-    key: 1,
-    activityDescription: [
-      <span key={ 1 } className={ 'ms-activityItem-nameText' }>Tahlia	Whittle</span>,
-      <span key={ 2 }> edited this file</span>
-    ],
-    activityPersonas: [
+export class ActivityItemCompactExample extends React.Component<React.Props<ActivityItemCompactExample>, {}> {
+  public render() {
+    const getClassNames = classNamesFunction<IActivityItemExampleStyleProps, IActivityItemExampleStyles>();
+    const classNames = getClassNames(getStyles);
+
+    const activityItemExamples = [
       {
-        imageUrl: TestImages.personaFemale
-      }
-    ],
-    isCompact: true
-  },
-  {
-    key: 2,
-    activityDescription: [
-      <span key={ 1 } className={ 'ms-activityItem-nameText' }>Patrick Loton</span>,
-      <span key={ 2 }> and </span>,
-      <span key={ 3 } className={ 'ms-activityItem-nameText' }> 6 others</span>
-    ],
-    activityPersonas: [
+        key: 1,
+        activityDescription: [
+          <span key={ 1 } className={ css(classNames.nameText) }>Tahlia	Whittle</span>,
+          <span key={ 2 }> edited this file</span>
+        ],
+        activityPersonas: [
+          {
+            imageUrl: TestImages.personaFemale
+          }
+        ],
+        isCompact: true
+      },
       {
-        imageInitials: 'PT',
-        primaryText: 'Robert Larsson'
+        key: 2,
+        activityDescription: [
+          <span key={ 1 } className={ css(classNames.nameText) }>Patrick Loton</span>,
+          <span key={ 2 }> and </span>,
+          <span key={ 3 } className={ css(classNames.nameText) }> 6 others</span>
+        ],
+        activityPersonas: [
+          {
+            imageInitials: 'PT',
+            primaryText: 'Robert Larsson'
+          },
+          {
+            imageUrl: TestImages.personaMale
+          },
+          {
+            imageInitials: 'EC',
+            primaryText: 'Eduarda Costa'
+          }
+        ],
+        isCompact: true
       },
       {
-        imageUrl: TestImages.personaMale
+        key: 3,
+        activityDescription: [
+          <span key={ 1 } className={ css(classNames.nameText) }>Sabrina De Luca</span>,
+          <span key={ 2 }> added this file</span>
+        ],
+        activityIcon: React.createElement(Icon, { iconName: 'Add' }),
+        isCompact: true
       },
       {
-        imageInitials: 'EC',
-        primaryText: 'Eduarda Costa'
+        key: 4,
+        activityDescription: [
+          <span key={ 1 } className={ css(classNames.nameText) }>Chuan Rojumanong</span>,
+          <span key={ 2 }> shared this file</span>
+        ],
+        activityIcon: React.createElement(Icon, { iconName: 'Share' }),
+        isCompact: true
       }
-    ],
-    isCompact: true
-  },
-  {
-    key: 3,
-    activityDescription: [
-      <span key={ 1 } className={ 'ms-activityItem-nameText' }>Sabrina De Luca</span>,
-      <span key={ 2 }> added this file</span>
-    ],
-    activityIcon: React.createElement(Icon, { iconName: 'Add' }),
-    isCompact: true
-  },
-  {
-    key: 4,
-    activityDescription: [
-      <span key={ 1 } className={ 'ms-activityItem-nameText' }>Chuan Rojumanong</span>,
-      <span key={ 2 }> shared this file</span>
-    ],
-    activityIcon: React.createElement(Icon, { iconName: 'Share' }),
-    isCompact: true
-  }
-];
+    ];
 
-export class ActivityItemCompactExample extends React.Component<React.Props<ActivityItemCompactExample>, {}> {
-  public render() {
     let activityExampleList: Array<JSX.Element> = [];
     activityItemExamples.forEach((item) => {
       let props = item;
       activityExampleList.push(
-        <ActivityItem {...props} key={ item.key } className={ 'ms-activityItem-exampleRoot' } />
+        <ActivityItem {...props} key={ item.key } className={ css(classNames.exampleRoot) } />
       );
     });
 
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Example.scss b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Example.scss
deleted file mode 100644
index fd944b732c7d8..0000000000000
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Example.scss
+++ /dev/null
@@ -1,9 +0,0 @@
-:global {
-  .ms-activityItem-exampleRoot {
-    margin-top: 20px;
-  }
-
-  .ms-activityItem-nameText {
-    font-weight: bold;
-  }
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Example.styles.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Example.styles.ts
new file mode 100644
index 0000000000000..ac1d9912c43cc
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Example.styles.ts
@@ -0,0 +1,23 @@
+import { IStyle } from '../../../Styling';
+
+export interface IActivityItemExampleStyleProps {
+  /**
+   * 404 No Style Props Found
+   */
+}
+
+export interface IActivityItemExampleStyles {
+  exampleRoot?: IStyle;
+  nameText?: IStyle;
+}
+
+export const getStyles = (props: IActivityItemExampleStyleProps): IActivityItemExampleStyles => {
+  return ({
+    exampleRoot: {
+      marginTop: '20px'
+    },
+    nameText: {
+      fontWeight: 'bold'
+    }
+  });
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Persona.Example.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Persona.Example.tsx
index 289fe84e5a7f3..7087b67f512a2 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Persona.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Persona.Example.tsx
@@ -1,110 +1,119 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
+import { css, classNamesFunction } from '../../../Utilities';
 import { ActivityItem } from '../ActivityItem';
+import {
+  getStyles,
+  IActivityItemExampleStyleProps,
+  IActivityItemExampleStyles
+} from './ActivityItem.Example.styles';
 import { TestImages } from '../../../common/TestImages';
 import { Link } from '../../../Link';
 
-// tslint:disable:jsx-no-lambda
-const activityItemExamples = [
-  {
-    key: 1,
-    activityDescription: [
-      <Link key={ 1 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A name was clicked.'); } } >Jack Howden</Link>,
-      <span key={ 2 }> renamed </span>,
-      <span key={ 3 } className={ 'ms-activityItem-nameText' }>DocumentTitle.docx</span>
-    ],
-    activityPersonas: [
-      {
-        imageUrl: TestImages.personaMale
-      }
-    ],
-    comments: 'Hello, this is the text of my basic comment!',
-    timeStamp: '23m ago'
-  },
-  {
-    key: 2,
-    activityDescription: [
-      <Link key={ 1 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A name was clicked.'); } } >Javiera Márquez</Link>,
-      <span key={ 2 }> and </span>,
-      <Link key={ 3 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A name was clicked.'); } } >Amelia Povalіy</Link>,
-      <span key={ 4 }> edited </span>,
-      <Link key={ 5 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A document was clicked.'); } } >SpreadsheetTitle.xlsx</Link>
-    ],
-    activityPersonas: [
-      {
-        imageInitials: 'JM',
-        primaryText: 'Javiera Márquez'
-      },
-      {
-        imageUrl: TestImages.personaFemale
-      }
-    ],
-    timeStamp: '9:27 am'
-  },
-  {
-    key: 3,
-    activityDescription: [
-      <Link key={ 1 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A name was clicked.'); } } >Robert Larsson</Link>,
-      <span key={ 2 }> and </span>,
-      <Link key={ 3 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A name was clicked.'); } } >2 others</Link>,
-      <span key={ 4 }> commented </span>
-    ],
-    activityPersonas: [
-      {
-        imageInitials: 'RL',
-        primaryText: 'Robert Larsson'
-      },
-      {
-        imageUrl: TestImages.personaMale
-      },
-      {
-        imageUrl: TestImages.personaFemale
-      }
-    ],
-    timeStamp: '3 days ago'
-  },
-  {
-    key: 4,
-    activityDescription: [
-      <Link key={ 1 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A name was clicked.'); } } >Jin Cheng</Link>,
-      <span key={ 2 }> and </span>,
-      <Link key={ 3 } className={ 'ms-activityItem-nameText' } onClick={ () => { alert('A name was clicked.'); } } >5 others</Link>,
-      <span key={ 4 }> edited this file</span>
-    ],
-    activityPersonas: [
-      {
-        imageInitials: 'JC',
-        primaryText: 'Jin Cheng'
-      },
-      {
-        imageUrl: TestImages.personaMale
-      },
+export class ActivityItemPersonaExample extends React.Component<React.Props<ActivityItemPersonaExample>, {}> {
+  public render() {
+    const getClassNames = classNamesFunction<IActivityItemExampleStyleProps, IActivityItemExampleStyles>();
+    const classNames = getClassNames(getStyles);
+
+    // tslint:disable:jsx-no-lambda
+    const activityItemExamples = [
       {
-        imageInitials: 'AL',
-        primaryText: 'Annie Lindqvist'
+        key: 1,
+        activityDescription: [
+          <Link key={ 1 } className={ css(classNames.nameText) } onClick={ () => { alert('A name was clicked.'); } } >Jack Howden</Link>,
+          <span key={ 2 }> renamed </span>,
+          <span key={ 3 } className={ css(classNames.nameText) }>DocumentTitle.docx</span>
+        ],
+        activityPersonas: [
+          {
+            imageUrl: TestImages.personaMale
+          }
+        ],
+        comments: 'Hello, this is the text of my basic comment!',
+        timeStamp: '23m ago'
       },
       {
-        imageUrl: TestImages.personaFemale
+        key: 2,
+        activityDescription: [
+          <Link key={ 1 } className={ css(classNames.nameText) } onClick={ () => { alert('A name was clicked.'); } } >Javiera Márquez</Link>,
+          <span key={ 2 }> and </span>,
+          <Link key={ 3 } className={ css(classNames.nameText) } onClick={ () => { alert('A name was clicked.'); } } >Amelia Povalіy</Link>,
+          <span key={ 4 }> edited </span>,
+          <Link key={ 5 } className={ css(classNames.nameText) } onClick={ () => { alert('A document was clicked.'); } } >SpreadsheetTitle.xlsx</Link>
+        ],
+        activityPersonas: [
+          {
+            imageInitials: 'JM',
+            primaryText: 'Javiera Márquez'
+          },
+          {
+            imageUrl: TestImages.personaFemale
+          }
+        ],
+        timeStamp: '9:27 am'
       },
       {
-        imageUrl: TestImages.personaMale
+        key: 3,
+        activityDescription: [
+          <Link key={ 1 } className={ css(classNames.nameText) } onClick={ () => { alert('A name was clicked.'); } } >Robert Larsson</Link>,
+          <span key={ 2 }> and </span>,
+          <Link key={ 3 } className={ css(classNames.nameText) } onClick={ () => { alert('A name was clicked.'); } } >2 others</Link>,
+          <span key={ 4 }> commented </span>
+        ],
+        activityPersonas: [
+          {
+            imageInitials: 'RL',
+            primaryText: 'Robert Larsson'
+          },
+          {
+            imageUrl: TestImages.personaMale
+          },
+          {
+            imageUrl: TestImages.personaFemale
+          }
+        ],
+        timeStamp: '3 days ago'
       },
       {
-        imageUrl: TestImages.personaMale
+        key: 4,
+        activityDescription: [
+          <Link key={ 1 } className={ css(classNames.nameText) } onClick={ () => { alert('A name was clicked.'); } } >Jin Cheng</Link>,
+          <span key={ 2 }> and </span>,
+          <Link key={ 3 } className={ css(classNames.nameText) } onClick={ () => { alert('A name was clicked.'); } } >5 others</Link>,
+          <span key={ 4 }> edited this file</span>
+        ],
+        activityPersonas: [
+          {
+            imageInitials: 'JC',
+            primaryText: 'Jin Cheng'
+          },
+          {
+            imageUrl: TestImages.personaMale
+          },
+          {
+            imageInitials: 'AL',
+            primaryText: 'Annie Lindqvist'
+          },
+          {
+            imageUrl: TestImages.personaFemale
+          },
+          {
+            imageUrl: TestImages.personaMale
+          },
+          {
+            imageUrl: TestImages.personaMale
+          }
+        ],
+        timeStamp: 'August 3, 2017'
       }
-    ],
-    timeStamp: 'August 3, 2017'
-  }
-];
+    ];
 
-export class ActivityItemPersonaExample extends React.Component<React.Props<ActivityItemPersonaExample>, {}> {
-  public render() {
     let activityExampleList: Array<JSX.Element> = [];
     activityItemExamples.forEach((item) => {
       let props = item;
       activityExampleList.push(
-        <ActivityItem {...props} key={ item.key } className={ 'ms-activityItem-exampleRoot' } />
+        <ActivityItem {...props} key={ item.key } className={ css(classNames.exampleRoot) } />
       );
     });
 

From e799f4f15311dcd6c4de5f3934148239da8f7b30 Mon Sep 17 00:00:00 2001
From: John Miller <rubixws@gmail.com>
Date: Thu, 1 Feb 2018 14:04:45 -0800
Subject: [PATCH 1307/1641] Revert "Controlled TextFields" (#3854)

* Revert "Updating config files in @uifabric/icons package (#3851)"

This reverts commit 952ad7979322352ca597d4e6319391529d5d2212.

* Revert "Addressing Issue #3776 - Sticky component loops forever if background-color is not set for page (#3833)"

This reverts commit ddc544059e61523a8294b16275ae2e8706241e4f.

* Revert "Fix issue in modal Selection handling (#3836)"

This reverts commit c304b01fa7c0a98e54dc1c9af67c6a0d695838e8.

* Revert "Adding new WOFF files to the @uifabric/icons/fonts folder (#3848)"

This reverts commit 66a91aadb99bca3923125d62cadc15984dba0be6.

* Revert "Controlled TextFields (#3796)"

This reverts commit b17a45fe057f50aa489be21d3e517d783b40b9e1.
---
 .../__snapshots__/ColorPicker.test.tsx.snap   | 25 +++++++-----------
 .../src/components/DatePicker/DatePicker.tsx  |  2 +-
 .../__snapshots__/DatePicker.test.tsx.snap    |  2 +-
 .../components/TextField/TextField.test.tsx   | 26 +++++++++----------
 .../src/components/TextField/TextField.tsx    | 12 +++------
 .../components/TextField/TextField.types.ts   |  2 +-
 .../__snapshots__/TextField.test.tsx.snap     |  1 -
 .../TextField/examples/NumberTextField.tsx    |  2 +-
 .../examples/TextField.Basic.Example.tsx      | 15 -----------
 .../TextField.ErrorMessage.Example.tsx        |  8 +++---
 10 files changed, 35 insertions(+), 60 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/__snapshots__/ColorPicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ColorPicker/__snapshots__/ColorPicker.test.tsx.snap
index 98b91e6a9727f..0776b8f363c6d 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/__snapshots__/ColorPicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/__snapshots__/ColorPicker.test.tsx.snap
@@ -128,10 +128,9 @@ exports[`ColorPicker renders ColorPicker correctly 1`] = `
                     className="ms-TextField-field"
                     id="TextField0"
                     onBlur={[Function]}
-                    onChange={undefined}
+                    onChange={[Function]}
                     onFocus={[Function]}
-                    onInput={undefined}
-                    readOnly={true}
+                    onInput={[Function]}
                     spellCheck={false}
                     type="text"
                     value="ffffff"
@@ -163,10 +162,9 @@ exports[`ColorPicker renders ColorPicker correctly 1`] = `
                     className="ms-TextField-field"
                     id="TextField2"
                     onBlur={[Function]}
-                    onChange={undefined}
+                    onChange={[Function]}
                     onFocus={[Function]}
-                    onInput={undefined}
-                    readOnly={true}
+                    onInput={[Function]}
                     spellCheck={false}
                     type="text"
                     value="255"
@@ -198,10 +196,9 @@ exports[`ColorPicker renders ColorPicker correctly 1`] = `
                     className="ms-TextField-field"
                     id="TextField4"
                     onBlur={[Function]}
-                    onChange={undefined}
+                    onChange={[Function]}
                     onFocus={[Function]}
-                    onInput={undefined}
-                    readOnly={true}
+                    onInput={[Function]}
                     spellCheck={false}
                     type="text"
                     value="255"
@@ -233,10 +230,9 @@ exports[`ColorPicker renders ColorPicker correctly 1`] = `
                     className="ms-TextField-field"
                     id="TextField6"
                     onBlur={[Function]}
-                    onChange={undefined}
+                    onChange={[Function]}
                     onFocus={[Function]}
-                    onInput={undefined}
-                    readOnly={true}
+                    onInput={[Function]}
                     spellCheck={false}
                     type="text"
                     value="255"
@@ -268,10 +264,9 @@ exports[`ColorPicker renders ColorPicker correctly 1`] = `
                     className="ms-TextField-field"
                     id="TextField8"
                     onBlur={[Function]}
-                    onChange={undefined}
+                    onChange={[Function]}
                     onFocus={[Function]}
-                    onInput={undefined}
-                    readOnly={true}
+                    onInput={[Function]}
                     spellCheck={false}
                     type="text"
                     value="100"
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 093cfaa8f0d6a..35fd4a6ed376e 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -226,7 +226,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
               )
             } }
             readOnly={ !allowTextInput }
-            defaultValue={ formattedDate }
+            value={ formattedDate }
             ref={ this._resolveRef('_textField') }
             role={ allowTextInput ? 'combobox' : 'menu' }
           />
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap
index 66caed779204f..213d16b79fbc4 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap
@@ -30,7 +30,7 @@ exports[`DatePicker renders default DatePicker correctly 1`] = `
             onInput={[Function]}
             onKeyDown={[Function]}
             placeholder={undefined}
-            readOnly={false}
+            readOnly={true}
             required={false}
             role="menu"
             type="text"
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
index 883c7f5866cfc..cca8acb446834 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
@@ -37,7 +37,7 @@ describe('TextField', () => {
     const renderedDOM: HTMLElement = renderIntoDocument(
       <TextField
         label={ exampleLabel }
-        defaultValue={ exampleValue }
+        value={ exampleValue }
       />
     );
 
@@ -84,7 +84,7 @@ describe('TextField', () => {
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <TextField
-        prefix={ examplePrefix }
+        prefix={ examplePrefix}
         suffix={ exampleSuffix }
       />
     );
@@ -98,7 +98,7 @@ describe('TextField', () => {
 
   it('should render multiline as text area element', () => {
     const renderedDOM: HTMLElement = renderIntoDocument(
-      <TextField defaultValue='This\nIs\nMultiline\nText\n' multiline />
+      <TextField value='This\nIs\nMultiline\nText\n' multiline />
     );
 
     // Assert on the input element.
@@ -110,7 +110,7 @@ describe('TextField', () => {
     const renderedDOM: HTMLElement = renderIntoDocument(
       <TextField
         label='text-field-label'
-        defaultValue='whatever value'
+        value='whatever value'
       />
     );
 
@@ -154,7 +154,7 @@ describe('TextField', () => {
       const renderedDOM: HTMLElement = renderIntoDocument(
         <TextField
           label='text-field-label'
-          defaultValue='whatever value'
+          value='whatever value'
           onGetErrorMessage={ validator }
         />
       );
@@ -174,7 +174,7 @@ describe('TextField', () => {
       const renderedDOM: HTMLElement = renderIntoDocument(
         <TextField
           label='text-field-label'
-          defaultValue='whatever value'
+          value='whatever value'
           onGetErrorMessage={ validator }
         />
       );
@@ -190,7 +190,7 @@ describe('TextField', () => {
       const renderedDOM: HTMLElement = renderIntoDocument(
         <TextField
           label='text-field-label'
-          defaultValue='whatever value'
+          value='whatever value'
           // tslint:disable-next-line:jsx-no-lambda
           onGetErrorMessage={ () => errorMessage }
         />
@@ -203,7 +203,7 @@ describe('TextField', () => {
       const renderedDOM: HTMLElement = renderIntoDocument(
         <TextField
           label='text-field-label'
-          defaultValue='whatever value'
+          value='whatever value'
           // tslint:disable-next-line:jsx-no-lambda
           onGetErrorMessage={ () => Promise.resolve(errorMessage) }
         />
@@ -217,7 +217,7 @@ describe('TextField', () => {
       const renderedDOM: HTMLElement = renderIntoDocument(
         <TextField
           label='text-field-label'
-          defaultValue='whatever value'
+          value='whatever value'
           // tslint:disable-next-line:jsx-no-lambda
           onGetErrorMessage={ () => '' }
         />
@@ -275,7 +275,7 @@ describe('TextField', () => {
 
       const renderedDOM: HTMLElement = renderIntoDocument(
         <TextField
-          defaultValue='initial value'
+          value='initial value'
           onGetErrorMessage={ validatorSpy }
           validateOnFocusIn
         />
@@ -298,7 +298,7 @@ describe('TextField', () => {
 
       const renderedDOM: HTMLElement = renderIntoDocument(
         <TextField
-          defaultValue='initial value'
+          value='initial value'
           onGetErrorMessage={ validatorSpy }
           validateOnFocusOut
         />
@@ -322,7 +322,7 @@ describe('TextField', () => {
 
       const renderedDOM: HTMLElement = renderIntoDocument(
         <TextField
-          defaultValue='initial value'
+          value='initial value'
           onGetErrorMessage={ validatorSpy }
           validateOnFocusOut
           validateOnFocusIn
@@ -349,7 +349,7 @@ describe('TextField', () => {
 
       renderIntoDocument(
         <TextField
-          defaultValue='initial value'
+          value='initial value'
           onGetErrorMessage={ validatorSpy }
           validateOnLoad={ false }
         />
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index 3222f58884723..bb711fbd70f7e 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -55,7 +55,6 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
   private _latestValue: string | undefined;
   private _latestValidateValue: string | undefined;
   private _isDescriptionAvailable: boolean;
-  private _isControlled: boolean;
   private _textElement: HTMLTextAreaElement;
 
   public constructor(props: ITextFieldProps) {
@@ -87,7 +86,6 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
     this._delayedValidate = this._async.debounce(this._validate, this.props.deferredValidationTime);
     this._lastValidation = 0;
     this._isDescriptionAvailable = false;
-    this._isControlled = typeof props.value !== 'string';
   }
 
   /**
@@ -354,9 +352,8 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
         { ...textAreaProps }
         ref={ this._resolveRef('_textElement') }
         value={ this.state.value }
-        onInput={ this._isControlled ? this._onInputChange : undefined }
-        onChange={ this._isControlled ? this._onInputChange : undefined }
-        readOnly={ !this._isControlled }
+        onInput={ this._onInputChange }
+        onChange={ this._onInputChange }
         className={ this._getTextElementClassName() }
         aria-describedby={ this._isDescriptionAvailable ? this._descriptionId : null }
         aria-invalid={ !!this.state.errorMessage }
@@ -377,9 +374,8 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
         { ...inputProps }
         ref={ this._resolveRef('_textElement') }
         value={ this.state.value }
-        onInput={ this._isControlled ? this._onInputChange : undefined }
-        onChange={ this._isControlled ? this._onInputChange : undefined }
-        readOnly={ !this._isControlled }
+        onInput={ this._onInputChange }
+        onChange={ this._onInputChange }
         className={ this._getTextElementClassName() }
         aria-label={ this.props.ariaLabel }
         aria-describedby={ this._isDescriptionAvailable ? this._descriptionId : null }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts b/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts
index ca25da994a6df..7f32537bc68d4 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts
@@ -132,7 +132,7 @@ export interface ITextFieldProps extends React.AllHTMLAttributes<HTMLInputElemen
 
   /**
    * Current value of the textfield. Only provide this if the textfield is a controlled component where you
-   * are maintaining its current state; otherwise, use the "defaultValue" property. User can't edit if supplied.
+   * are maintaining its current state; otherwise, use the "defaultValue" property.
    */
   value?: string;
 
diff --git a/packages/office-ui-fabric-react/src/components/TextField/__snapshots__/TextField.test.tsx.snap b/packages/office-ui-fabric-react/src/components/TextField/__snapshots__/TextField.test.tsx.snap
index de2efec846269..5fb70d8366cdf 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/__snapshots__/TextField.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/TextField/__snapshots__/TextField.test.tsx.snap
@@ -43,7 +43,6 @@ exports[`TextField renders TextField correctly 1`] = `
         onChange={[Function]}
         onFocus={[Function]}
         onInput={[Function]}
-        readOnly={false}
         type="text"
         value=""
       />
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/NumberTextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/NumberTextField.tsx
index 34ad4ead87cef..899829d9ce115 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/NumberTextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/NumberTextField.tsx
@@ -30,7 +30,7 @@ export class NumberTextField extends React.Component<INumberTextFieldProps, INum
         <TextField
           className='NumberTextField-textField'
           label={ this.props.label }
-          defaultValue={ this.state.value }
+          value={ this.state.value }
           onChanged={ this._onChanged }
           onGetErrorMessage={ this._validateNumber }
         />
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
index 658e203cd2bb1..0413006a10d4f 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Basic.Example.tsx
@@ -9,21 +9,6 @@ export class TextFieldBasicExample extends React.Component<any, any> {
         <TextField
           label='Standard'
         />
-        <TextField
-          label='Standard with a blank value attribute'
-          value=''
-          description='Can not be edited by the user.'
-        />
-        <TextField
-          label='Standard with value attribute'
-          value='With a set value.'
-          description='Can not be edited by the user.'
-        />
-        <TextField
-          label='Standard with defaultValue attribute'
-          defaultValue='With a set defaultValue.'
-          description='Can be edited by the user.'
-        />
         <TextField
           label='Disabled'
           disabled={ true }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx
index fb70dca88a381..a9b365f259e13 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.ErrorMessage.Example.tsx
@@ -25,23 +25,23 @@ export class TextFieldErrorMessageExample extends React.Component<{}, {}> {
         />
         <TextField
           label='TextField with a string-based validator. Hint: the length of the input string must be less than 3.'
-          defaultValue='It should show an error message under this error message on render.'
+          value='It should show an error message under this error message on render.'
           onGetErrorMessage={ this._getErrorMessage }
         />
         <TextField
           label='TextField with a string-based validator. Hint: the length of the input string must be less than 3.'
-          defaultValue='It will run validation only on input change and not on render.'
+          value='It will run validation only on input change and not on render.'
           onGetErrorMessage={ this._getErrorMessage }
           validateOnLoad={ false }
         />
         <TextField
           label='TextField with a Promise-based validator. Hint: the length of the input string must be less than 3.'
-          defaultValue='It should show an error message under this error message 5 seconds after render.'
+          value='It should show an error message under this error message 5 seconds after render.'
           onGetErrorMessage={ this._getErrorMessagePromise }
         />
         <TextField
           label='TextField has both description and error message.'
-          defaultValue='It should show description and error message on render at the same time.'
+          value='It should show description and error message on render at the same time.'
           description='This field has description and error message both under the input box.'
           onGetErrorMessage={ this._getErrorMessage }
         />

From 83be28cba3b75cf3db87c21da190f2247f4bc33e Mon Sep 17 00:00:00 2001
From: amyngu <31973030+amyngu@users.noreply.github.com>
Date: Thu, 1 Feb 2018 14:52:07 -0800
Subject: [PATCH 1308/1641] ExtendedPicker: Allow edit selected items (#3794)

* allow for item editing

* run npm run change

* make privates underscored

* Fix from bad merge
---
 ...lectedItemsListItems_2018-01-24-21-52.json |  11 ++
 .../ExtendedPeoplePicker.Basic.Example.tsx    |  22 +++-
 .../FloatingPicker/BaseFloatingPicker.tsx     |   8 ++
 .../SelectedPeopleList/Items/EditingItem.scss |   8 ++
 .../SelectedPeopleList/Items/EditingItem.tsx  | 120 ++++++++++++++++++
 .../SelectedPeopleList/SelectedPeopleList.tsx |  85 ++++++++++---
 .../SelectedPeopleList.Basic.Example.tsx      |   2 +-
 7 files changed, 229 insertions(+), 27 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/editSelectedItemsListItems_2018-01-24-21-52.json
 create mode 100644 packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.scss
 create mode 100644 packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx

diff --git a/common/changes/@uifabric/experiments/editSelectedItemsListItems_2018-01-24-21-52.json b/common/changes/@uifabric/experiments/editSelectedItemsListItems_2018-01-24-21-52.json
new file mode 100644
index 0000000000000..7766810335ce1
--- /dev/null
+++ b/common/changes/@uifabric/experiments/editSelectedItemsListItems_2018-01-24-21-52.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "allow editing of selected items in selected people list",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "amyngu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
index 719bac468612b..b8d38b35d3c20 100644
--- a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
@@ -36,8 +36,8 @@ const suggestionProps: IBasePickerSuggestionsProps = {
 // tslint:disable-next-line:no-any
 export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeoplePickerExampleState> {
   private _picker: ExtendedPeoplePicker;
-  private floatingPickerProps: IBaseFloatingPickerProps<IExtendedPersonaProps>;
-  private selectedItemsListProps: ISelectedPeopleProps;
+  private _floatingPickerProps: IBaseFloatingPickerProps<IExtendedPersonaProps>;
+  private _selectedItemsListProps: ISelectedPeopleProps;
 
   constructor(props: {}) {
     super(props);
@@ -54,7 +54,7 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
       mostRecentlyUsed: mru,
     };
 
-    this.floatingPickerProps = {
+    this._floatingPickerProps = {
       suggestionsController: new SuggestionsController<IExtendedPersonaProps>(),
       onResolveSuggestions: this._onFilterChanged,
       getTextFromItem: this._getTextFromItem,
@@ -65,11 +65,15 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
       onZeroQuerySuggestion: this._returnMostRecentlyUsed,
     };
 
-    this.selectedItemsListProps = {
+    this._selectedItemsListProps = {
       onCopyItems: this._onCopyItems,
       onExpandGroup: this._onExpandItem,
       removeMenuItemText: 'Remove',
       copyMenuItemText: 'Copy name',
+      editMenuItemText: 'Edit',
+      getEditingItemText: this._getEditingItemText,
+      onRenderFloatingPicker: this._onRenderFloatingPicker,
+      floatingPickerProps: this._floatingPickerProps,
     };
   }
 
@@ -88,8 +92,8 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
   private _renderExtendedPicker(): JSX.Element {
     return (
       <ExtendedPeoplePicker
-        floatingPickerProps={ this.floatingPickerProps }
-        selectedItemsListProps={ this.selectedItemsListProps }
+        floatingPickerProps={ this._floatingPickerProps }
+        selectedItemsListProps={ this._selectedItemsListProps }
         onRenderFloatingPicker={ this._onRenderFloatingPicker }
         onRenderSelectedItems={ this._onRenderSelectedItems }
         className={ 'ms-PeoplePicker' }
@@ -117,6 +121,10 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
     return (<SelectedPeopleList {...props} />);
   }
 
+  private _getEditingItemText(item: IExtendedPersonaProps): string {
+    return item.primaryText as string;
+  }
+
   @autobind
   private _setComponentRef(component: ExtendedPeoplePicker): void {
     this._picker = component;
@@ -132,7 +140,7 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
   @autobind
   private _onExpandItem(item: IExtendedPersonaProps): void {
     // tslint:disable-next-line:no-any
-    (this._picker.selectedItemsList as SelectedPeopleList).onExpandItem(item, this._getExpandedGroupItems(item as any));
+    (this._picker.selectedItemsList as SelectedPeopleList).replaceItem(item, this._getExpandedGroupItems(item as any));
   }
 
   @autobind
diff --git a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
index d657288ad95a3..f82f47b2cfcbd 100644
--- a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
+++ b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
@@ -54,6 +54,14 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
     };
   }
 
+  public forceResolveSuggestion(): void {
+    if (this.suggestionStore.hasSelectedSuggestion()) {
+      this.completeSuggestion();
+    } else {
+      this._onValidateInput();
+    }
+  }
+
   public get isSuggestionsShown(): boolean {
     return this.state.suggestionsVisible ? false : this.state.suggestionsVisible as boolean;
   }
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.scss b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.scss
new file mode 100644
index 0000000000000..b2332b1861a07
--- /dev/null
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.scss
@@ -0,0 +1,8 @@
+.editingInput {
+  border: 0px;
+  outline: none;
+
+  &::-ms-clear {
+    display: none;
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx
new file mode 100644
index 0000000000000..6ef143f7e5af0
--- /dev/null
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx
@@ -0,0 +1,120 @@
+/* tslint:disable */
+import * as React from 'react';
+/* tslint:enable */
+import { BaseComponent, KeyCodes, autobind, getId, getNativeProps, inputProperties } from '../../../../Utilities';
+import { FloatingPeoplePicker, IBaseFloatingPickerProps } from '../../../../FloatingPicker';
+import { ISelectedPeopleItemProps } from '../SelectedPeopleList';
+import { IExtendedPersonaProps } from '../SelectedPeopleList';
+import { IPeoplePickerItemState } from './ExtendedSelectedItem';
+
+import * as stylesImport from './EditingItem.scss';
+
+// tslint:disable-next-line:no-any
+const styles: any = stylesImport;
+
+export interface IEditingSelectedPeopleItemProps extends ISelectedPeopleItemProps {
+  // tslint:disable-next-line:no-any
+  onEditingComplete: (oldItem: any, newItem: any) => void;
+  onRenderFloatingPicker?: (props: IBaseFloatingPickerProps<IExtendedPersonaProps>) => JSX.Element;
+  floatingPickerProps?: IBaseFloatingPickerProps<IExtendedPersonaProps>;
+  getEditingItemText?: (item: IExtendedPersonaProps) => string;
+}
+
+export class EditingItem extends BaseComponent<IEditingSelectedPeopleItemProps, IPeoplePickerItemState> {
+  private _editingInput: HTMLInputElement;
+  private _editingFloatingPicker: FloatingPeoplePicker;
+  private _onRenderFloatingPicker: (props: IBaseFloatingPickerProps<IExtendedPersonaProps>) => JSX.Element;
+  private _floatingPickerProps: IBaseFloatingPickerProps<IExtendedPersonaProps>;
+
+  constructor(props: IEditingSelectedPeopleItemProps) {
+    super(props);
+    this.state = { contextualMenuVisible: false };
+    this._onRenderFloatingPicker = this.props.onRenderFloatingPicker as
+      (props: IBaseFloatingPickerProps<IExtendedPersonaProps>) => JSX.Element;
+    this._floatingPickerProps = this.props.floatingPickerProps as IBaseFloatingPickerProps<IExtendedPersonaProps>;
+  }
+
+  public componentDidMount(): void {
+    let getEditingItemText = this.props.getEditingItemText as (item: IExtendedPersonaProps) => string;
+    let itemText = getEditingItemText(this.props.item);
+    this._editingFloatingPicker.onQueryStringChanged(itemText);
+    this._editingInput.value = itemText;
+    this._editingInput.focus();
+  }
+
+  @autobind
+  public render(): JSX.Element {
+    const itemId = getId();
+    const nativeProps = getNativeProps(this.props, inputProperties);
+    return (
+      <div aria-labelledby={ 'editingItemPersona-' + itemId }>
+        <input
+          { ...nativeProps}
+          ref={ this._resolveInputRef }
+          autoCapitalize={ 'off' }
+          autoComplete={ 'off' }
+          onChange={ this._onInputChange }
+          onKeyDown={ this._onInputKeyDown }
+          onBlur={ this._onInputBlur }
+          onClick={ this._onInputClick }
+          data-lpignore={ true }
+          className={ styles.editingInput }
+          id={ itemId }
+        />
+        { this._renderEditingSuggestions() }
+      </div>);
+  }
+
+  @autobind
+  private _renderEditingSuggestions(): JSX.Element {
+    let onRenderFloatingPicker = this._onRenderFloatingPicker;
+    return (onRenderFloatingPicker({
+      componentRef: this._resolveRef('editingFloatingPicker'),
+      onChange: this._onSuggestionSelected,
+      inputElement: this._editingInput,
+      selectedItems: [],
+      ...this._floatingPickerProps
+    }));
+  }
+
+  @autobind
+  private _resolveInputRef(ref: HTMLInputElement): void {
+    this._editingInput = ref;
+
+    this.forceUpdate(() => { this._editingInput.focus(); });
+  }
+
+  @autobind
+  private _onInputClick(): void {
+    this._editingFloatingPicker.showPicker();
+  }
+
+  @autobind
+  private _onInputBlur(): void {
+    this._editingFloatingPicker.forceResolveSuggestion();
+  }
+
+  @autobind
+  private _onInputChange(ev: React.FormEvent<HTMLElement>): void {
+    let value: string = (ev.target as HTMLInputElement).value;
+
+    if (value === '') {
+      if (this.props.onRemoveItem) {
+        this.props.onRemoveItem();
+      }
+    } else {
+      this._editingFloatingPicker.onQueryStringChanged(value);
+    }
+  }
+
+  private _onInputKeyDown(ev: React.KeyboardEvent<HTMLInputElement>): void {
+    if (ev.which === KeyCodes.backspace || ev.which === KeyCodes.del) {
+      ev.stopPropagation();
+    }
+  }
+
+  @autobind
+  private _onSuggestionSelected(item: IExtendedPersonaProps): void {
+    this.props.onEditingComplete(this.props.item, item);
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
index 63bd372d812e4..ade17531c2ea3 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
@@ -8,9 +8,12 @@ import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
 import { ExtendedSelectedItem } from './Items/ExtendedSelectedItem';
 import { autobind } from '../../../Utilities';
 import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { IBaseFloatingPickerProps } from '../../../FloatingPicker';
+import { EditingItem } from './Items/EditingItem';
 
 export interface IExtendedPersonaProps extends IPersonaProps {
   canExpand?: boolean;
+  isEditing?: boolean;
 }
 
 export interface ISelectedPeopleItemProps extends ISelectedItemProps<IExtendedPersonaProps & { ValidationState: ValidationState }> {
@@ -22,6 +25,10 @@ export interface ISelectedPeopleProps extends IBaseSelectedItemsListProps<IExten
   onExpandGroup?: (item: IExtendedPersonaProps) => void;
   removeMenuItemText?: string;
   copyMenuItemText?: string;
+  editMenuItemText?: string;
+  getEditingItemText?: (item: IExtendedPersonaProps) => string;
+  onRenderFloatingPicker?: (props: IBaseFloatingPickerProps<IExtendedPersonaProps>) => JSX.Element;
+  floatingPickerProps?: IBaseFloatingPickerProps<IExtendedPersonaProps>;
 }
 
 export class BasePeopleSelectedItemsList extends BaseSelectedItemsList<IExtendedPersonaProps, ISelectedPeopleProps> {
@@ -37,25 +44,27 @@ export class SelectedPeopleList extends BasePeopleSelectedItemsList {
     onRenderItem: (props: ISelectedPeopleItemProps) => <ExtendedSelectedItem {...props} />,
   };
 
-  public onExpandItem(itemToExpand: IExtendedPersonaProps, expandedItems: IExtendedPersonaProps[]): void {
+  @autobind
+  public replaceItem(itemToReplace: IExtendedPersonaProps, itemsToReplaceWith: IExtendedPersonaProps[]): void {
     let { items } = this.state;
-    let index: number = items.indexOf(itemToExpand);
-    // tslint:disable-next-line:no-any
-    let filteredExpandedItems = expandedItems.filter((item: any) => items.indexOf(item) === -1);
+    let index: number = items.indexOf(itemToReplace);
     if (index > -1) {
-      let newItems = items.slice(0, index).concat(filteredExpandedItems).concat(items.slice(index + 1));
+      let newItems = items.slice(0, index).concat(itemsToReplaceWith).concat(items.slice(index + 1));
       this.updateItems(newItems);
     }
   }
 
   @autobind
   protected renderItems(): JSX.Element[] {
-    let { removeButtonAriaLabel } = this.props;
-    let onRenderItem = this.props.onRenderItem as (props: ISelectedPeopleItemProps) => JSX.Element;
-
     let { items } = this.state;
     // tslint:disable-next-line:no-any
-    return items.map((item: any, index: number) => onRenderItem({
+    return items.map((item: any, index: number) => this._renderItem(item, index));
+  }
+
+  // tslint:disable-next-line:no-any
+  private _renderItem(item: any, index: number): JSX.Element {
+    let { removeButtonAriaLabel } = this.props;
+    let props = {
       item,
       index,
       key: item.key ? item.key : index,
@@ -66,22 +75,48 @@ export class SelectedPeopleList extends BasePeopleSelectedItemsList {
       onCopyItem: (itemToCopy: IExtendedPersonaProps) => this.copyItems([itemToCopy]),
       onExpandItem: this.props.onExpandGroup ? () => (this.props.onExpandGroup as (item: IExtendedPersonaProps) => void)(item) : undefined,
       menuItems: this._createMenuItems(item),
-    }));
+    };
+
+    if ((item as IExtendedPersonaProps).isEditing) {
+      return (
+        <EditingItem
+          {...props}
+          onRenderFloatingPicker={ this.props.onRenderFloatingPicker }
+          floatingPickerProps={ this.props.floatingPickerProps }
+          onEditingComplete={ this._completeEditing }
+          getEditingItemText={ this.props.getEditingItemText }
+        />
+      );
+    } else {
+      let onRenderItem = this.props.onRenderItem as (props: ISelectedPeopleItemProps) => JSX.Element;
+      return onRenderItem({ ...props });
+    }
+  }
+
+  @autobind
+  // tslint:disable-next-line:no-any
+  private _completeEditing(oldItem: any, newItem: any): void {
+    oldItem.isEditing = false;
+    this.replaceItem(oldItem, newItem);
   }
 
   // tslint:disable-next-line:no-any
   private _createMenuItems(item: any): IContextualMenuItem[] {
-    return [
-      {
-        key: 'Copy',
-        name: this.props.copyMenuItemText ? this.props.copyMenuItemText : 'Copy',
+    let menuItems: IContextualMenuItem[] = [];
+
+    if (this.props.editMenuItemText && this.props.getEditingItemText) {
+      menuItems.push({
+        key: 'Edit',
+        name: this.props.editMenuItemText ? this.props.editMenuItemText : 'Edit',
         onClick: (ev: React.MouseEvent<HTMLElement>, menuItem: IContextualMenuItem) => {
-          if (this.props.onCopyItems) {
-            (this.copyItems as (items: IExtendedPersonaProps[]) => void)([menuItem.data] as IExtendedPersonaProps[]);
-          }
+          (menuItem.data as IExtendedPersonaProps).isEditing = true;
+          this.forceUpdate();
         },
         data: item,
-      },
+      });
+    }
+
+    menuItems.push(
       {
         key: 'Remove',
         name: this.props.removeMenuItemText ? this.props.removeMenuItemText : 'Remove',
@@ -90,6 +125,18 @@ export class SelectedPeopleList extends BasePeopleSelectedItemsList {
         },
         data: item,
       },
-    ];
+      {
+        key: 'Copy',
+        name: this.props.copyMenuItemText ? this.props.copyMenuItemText : 'Copy',
+        onClick: (ev: React.MouseEvent<HTMLElement>, menuItem: IContextualMenuItem) => {
+          if (this.props.onCopyItems) {
+            (this.copyItems as (items: IExtendedPersonaProps[]) => void)([menuItem.data] as IExtendedPersonaProps[]);
+          }
+        },
+        data: item,
+      },
+    );
+
+    return menuItems;
   }
 }
\ No newline at end of file
diff --git a/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx b/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
index 1402db0f8d37b..e75b9d012cab0 100644
--- a/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
@@ -64,7 +64,7 @@ export class PeopleSelectedItemsListExample extends BaseComponent<{}, {}> {
   @autobind
   private _onExpandItem(item: IExtendedPersonaProps): void {
     // tslint:disable-next-line:no-any
-    this._selectionList.onExpandItem(item, this._getExpandedGroupItems(item as any));
+    this._selectionList.replaceItem(item, this._getExpandedGroupItems(item as any));
   }
 
   private _onSelectionChange(): void {

From 1b709bc84a01334f990fd6474d9fba0a07dbe61d Mon Sep 17 00:00:00 2001
From: lejimsft <32402358+lejimsft@users.noreply.github.com>
Date: Thu, 1 Feb 2018 15:41:48 -0800
Subject: [PATCH 1309/1641] Leji/use blockedsite icon (#3827)

* Consume updated icon name for malware detected signal

* revert last change

* use updated icon for malware detected signal

* adding change file
---
 .../leji-use-blockedsite-icon_2018-01-28-23-58.json   | 11 +++++++++++
 .../experiments/src/components/signals/Signals.tsx    |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/experiments/leji-use-blockedsite-icon_2018-01-28-23-58.json

diff --git a/common/changes/@uifabric/experiments/leji-use-blockedsite-icon_2018-01-28-23-58.json b/common/changes/@uifabric/experiments/leji-use-blockedsite-icon_2018-01-28-23-58.json
new file mode 100644
index 0000000000000..7376670ee53f6
--- /dev/null
+++ b/common/changes/@uifabric/experiments/leji-use-blockedsite-icon_2018-01-28-23-58.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "consume BlockedSite icon for malware detected signal",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "leji@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/signals/Signals.tsx b/packages/experiments/src/components/signals/Signals.tsx
index 34e6037bfe556..5b7622957e6a1 100644
--- a/packages/experiments/src/components/signals/Signals.tsx
+++ b/packages/experiments/src/components/signals/Signals.tsx
@@ -201,7 +201,7 @@ export const MalwareDetectedSignal: Signal = (props: ISignalProps): JSX.Element
     <Icon
       ariaLabel={ props.ariaLabel }
       className={ css(SignalStyles.signal, SignalsStyles.malwareDetected) }
-      iconName='ATPLogo'
+      iconName='BlockedSite'
     />
   );
 };

From 66cd98c137b60c9272c2a1ef7d55a68ad45e7b39 Mon Sep 17 00:00:00 2001
From: Josh Goldberg <joshuakgoldberg@outlook.com>
Date: Thu, 1 Feb 2018 18:38:35 -0800
Subject: [PATCH 1310/1641] "unnecessarily" typo in List.tsx (#3869)

---
 packages/office-ui-fabric-react/src/components/List/List.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index d695db1c71eea..3d62a1d1595fe 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -398,7 +398,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       role: 'presentation'
     }, this._onRenderPage);
 
-    // cache the first page for now since it is re-rendered a lot times unncessarily.
+    // cache the first page for now since it is re-rendered a lot times unnecessarily.
     // todo: a more aggresive caching mechanism is to cache pages constaining the items not changed.
     // now we re-render pages too frequently, for example, props.items increased from 30 to 60, although the
     // first 30 items did not change, we still re-rendered all of them in this props.items change.

From a5b4da9b1c632a1d33a89d44905c83a1e3cfcd2f Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 2 Feb 2018 03:24:17 -0800
Subject: [PATCH 1311/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...lectedItemsListItems_2018-01-24-21-52.json | 11 --------
 ...use-blockedsite-icon_2018-01-28-23-58.json | 11 --------
 ...tyItemEx-mergestyles_2018-01-31-00-28.json | 11 --------
 packages/experiments/CHANGELOG.json           | 26 +++++++++++++++++++
 packages/experiments/CHANGELOG.md             | 13 +++++++++-
 packages/experiments/package.json             |  4 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 14 files changed, 68 insertions(+), 43 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/editSelectedItemsListItems_2018-01-24-21-52.json
 delete mode 100644 common/changes/@uifabric/experiments/leji-use-blockedsite-icon_2018-01-28-23-58.json
 delete mode 100644 common/changes/office-ui-fabric-react/ActivityItemEx-mergestyles_2018-01-31-00-28.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index cb67d96d7983b..cd52474b82653 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.45.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.45.3 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index d93a62255b90c..47e223913e7fb 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.45.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.45.3 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 423e47748dc17..e3505904309cd 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.45.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.45.3 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 86563e4c8da56..66c2f41b20f56 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.45.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.45.3 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 87619aa70d8f7..f34feafac2978 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.45.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.45.3 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/@uifabric/experiments/editSelectedItemsListItems_2018-01-24-21-52.json b/common/changes/@uifabric/experiments/editSelectedItemsListItems_2018-01-24-21-52.json
deleted file mode 100644
index 7766810335ce1..0000000000000
--- a/common/changes/@uifabric/experiments/editSelectedItemsListItems_2018-01-24-21-52.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "allow editing of selected items in selected people list",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "amyngu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/leji-use-blockedsite-icon_2018-01-28-23-58.json b/common/changes/@uifabric/experiments/leji-use-blockedsite-icon_2018-01-28-23-58.json
deleted file mode 100644
index 7376670ee53f6..0000000000000
--- a/common/changes/@uifabric/experiments/leji-use-blockedsite-icon_2018-01-28-23-58.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "consume BlockedSite icon for malware detected signal",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "leji@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/ActivityItemEx-mergestyles_2018-01-31-00-28.json b/common/changes/office-ui-fabric-react/ActivityItemEx-mergestyles_2018-01-31-00-28.json
deleted file mode 100644
index 8f965fe134481..0000000000000
--- a/common/changes/office-ui-fabric-react/ActivityItemEx-mergestyles_2018-01-31-00-28.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Converted ActivityItemExample to use mergeStyles instead of SCSS",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 68522e4ca708d..3c41749f11535 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.17.0",
+      "tag": "@uifabric/experiments_v5.17.0",
+      "date": "Fri, 02 Feb 2018 11:24:16 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "amyngu <31973030+amyngu@users.noreply.github.com>",
+            "commit": "83be28cba3b75cf3db87c21da190f2247f4bc33e",
+            "comment": "allow editing of selected items in selected people list"
+          }
+        ],
+        "patch": [
+          {
+            "author": "lejimsft <32402358+lejimsft@users.noreply.github.com>",
+            "commit": "1b709bc84a01334f990fd6474d9fba0a07dbe61d",
+            "comment": "consume BlockedSite icon for malware detected signal"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.45.2 <6.0.0` to `>=5.45.3 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.16.1",
       "tag": "@uifabric/experiments_v5.16.1",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index dbda5316b63fd..f1e74cc62e6ca 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Wed, 31 Jan 2018 11:11:59 GMT and should not be manually modified.
+This log was last generated on Fri, 02 Feb 2018 11:24:16 GMT and should not be manually modified.
+
+## 5.17.0
+Fri, 02 Feb 2018 11:24:16 GMT
+
+### Minor changes
+
+- allow editing of selected items in selected people list
+
+### Patches
+
+- consume BlockedSite icon for malware detected signal
 
 ## 5.16.1
 Wed, 31 Jan 2018 11:11:59 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 0421f7addd6ce..63631ba3fecc3 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.16.1",
+  "version": "5.17.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.45.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.45.3 <6.0.0",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 0946b11c331a0..9c917dbe33563 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.45.3",
+      "tag": "office-ui-fabric-react_v5.45.3",
+      "date": "Fri, 02 Feb 2018 11:24:16 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "78c61efde3fb8ba11d5124adca4934f823094747",
+            "comment": "Converted ActivityItemExample to use mergeStyles instead of SCSS"
+          }
+        ]
+      }
+    },
     {
       "version": "5.45.2",
       "tag": "office-ui-fabric-react_v5.45.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index b8661c8aa3cfc..d71482ee34637 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 01 Feb 2018 11:23:17 GMT and should not be manually modified.
+This log was last generated on Fri, 02 Feb 2018 11:24:16 GMT and should not be manually modified.
+
+## 5.45.3
+Fri, 02 Feb 2018 11:24:16 GMT
+
+### Patches
+
+- Converted ActivityItemExample to use mergeStyles instead of SCSS
 
 ## 5.45.2
 Thu, 01 Feb 2018 11:23:17 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 973fbd9aa4ed6..2196d98549c8a 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.45.2",
+  "version": "5.45.3",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 5c71bd92894505214a9a6df8c4fb9d8e43472d98 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Fri, 2 Feb 2018 10:34:16 -0800
Subject: [PATCH 1312/1641] Dropdown, ComboBox, TextField: Improved high
 contrast in focus state (#3870)

* Dropdown  highcontrast on focus

* TextField thicker border on hover in hc

* Text shifting fix

* ComboBox hc and layout for border-box sizing

* Updated snapshot

* Added change file

* Semicolon
---
 .../dropdown-hc_2018-02-02-02-15.json         | 11 ++++
 .../components/ComboBox/ComboBox.styles.ts    | 43 ++++++++++++----
 .../__snapshots__/ComboBox.test.tsx.snap      | 50 ++++++++++++++++---
 .../src/components/Dropdown/Dropdown.scss     | 25 ++++++----
 .../src/components/TextField/TextField.scss   | 17 +++++--
 5 files changed, 118 insertions(+), 28 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/dropdown-hc_2018-02-02-02-15.json

diff --git a/common/changes/office-ui-fabric-react/dropdown-hc_2018-02-02-02-15.json b/common/changes/office-ui-fabric-react/dropdown-hc_2018-02-02-02-15.json
new file mode 100644
index 0000000000000..96a1f0b493596
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/dropdown-hc_2018-02-02-02-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox, Dropdown, TextField: Improved high contrast in focus state. Layout changes for ComboBox to allow for border-box sizing.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index 23814ba2fb8f8..98de0475a975b 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -149,6 +149,9 @@ export const getCaretDownButtonStyles = memoizeFunction((
       color: caretButtonTextColor,
       fontSize: FontSizes.small,
       position: 'absolute',
+      // The negative positioning accounts for the 1px root border now that box-sizing is border-box
+      top: '-1px',
+      right: '-1px',
       height: ComboBoxHeight,
       lineHeight: ComboBoxLineHeight,
       width: ComboxBoxCaretDownWidth,
@@ -204,6 +207,25 @@ export const getStyles = memoizeFunction((
   const ComboBoxCalloutBorderColor = palette.neutralLight;
   const ComboBoxOptionHeaderTextColor = semanticColors.menuHeader;
   const ComboBoxOptionDividerBorderColor = semanticColors.bodyDivider;
+  const ComboBoxRootHighContrastFocused = {
+    color: 'HighlightText',
+    borderColor: 'Highlight',
+    backgroundColor: 'Window',
+    borderWidth: '2px',
+    MsHighContrastAdjust: 'none',
+    paddingLeft: '11px',
+    selectors: {
+      '.ms-ComboBox-Input': {
+        // ComboBoxHeight is 32, 28 accounts for the 2px borders
+        height: '28px'
+      },
+      '.ms-ComboBox-CaretDown-button': {
+        // Negative positioning to account for the 2px border
+        right: '-2px',
+        top: '-2px'
+      }
+    }
+  };
 
   const styles: IComboBoxStyles = {
     container: {},
@@ -230,11 +252,10 @@ export const getStyles = memoizeFunction((
         cursor: 'text',
         display: 'block',
         height: ComboBoxHeight,
-        lineHeight: ComboBoxLineHeight,
         overflow: 'hidden',
         whiteSpace: 'nowrap',
         textOverflow: 'ellipsis',
-        boxSizing: 'content-box',
+        boxSizing: 'border-box', // Border-box matches Dropdown and TextField
         selectors: {
           '.ms-Label': {
             display: 'inline-block',
@@ -248,7 +269,10 @@ export const getStyles = memoizeFunction((
             }
           },
           '&.is-open': {
-            borderColor: ComboBoxRootBorderColorFocused
+            borderColor: ComboBoxRootBorderColorFocused,
+            selectors: {
+              [HighContrastSelector]: ComboBoxRootHighContrastFocused
+            },
           }
         }
       }
@@ -260,23 +284,23 @@ export const getStyles = memoizeFunction((
         [HighContrastSelector]: {
           color: 'HighlightText',
           borderColor: 'Highlight',
+          backgroundColor: 'Window',
           MsHighContrastAdjust: 'none'
         }
       },
     },
 
     rootPressed: {
-      borderColor: ComboBoxRootBorderColorFocused
+      borderColor: ComboBoxRootBorderColorFocused,
+      selectors: {
+        [HighContrastSelector]: ComboBoxRootHighContrastFocused
+      }
     },
 
     rootFocused: {
       borderColor: ComboBoxRootBorderColorFocused,
       selectors: {
-        [HighContrastSelector]: {
-          color: 'HighlightText',
-          borderColor: 'Highlight',
-          MsHighContrastAdjust: 'none'
-        }
+        [HighContrastSelector]: ComboBoxRootHighContrastFocused
       },
     },
 
@@ -298,7 +322,6 @@ export const getStyles = memoizeFunction((
       font: 'inherit',
       textOverflow: 'ellipsis',
       padding: '0',
-      margin: '1px 0px'
     },
 
     inputDisabled: getDisabledStyles(theme),
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
index 72cfa71b8c91a..410413b8d2791 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
@@ -16,7 +16,7 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
           border-style: solid;
           border-width: 1px;
           box-shadow: none;
-          box-sizing: content-box;
+          box-sizing: border-box;
           color: #333333;
           cursor: text;
           display: block;
@@ -24,7 +24,6 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
           font-size: 14px;
           font-weight: 400;
           height: 32px;
-          line-height: 30px;
           margin-bottom: 10px;
           margin-left: 0;
           outline: 0;
@@ -48,24 +47,65 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
         &.is-open {
           border-color: #0078d7;
         }
+        @media screen and (-ms-high-contrast: active){&.is-open {
+          -ms-high-contrast-adjust: none;
+          background-color: Window;
+          border-color: Highlight;
+          border-width: 2px;
+          color: HighlightText;
+          padding-left: 11px;
+        }
+        @media screen and (-ms-high-contrast: active){&.is-open .ms-ComboBox-Input {
+          height: 28px;
+        }
+        @media screen and (-ms-high-contrast: active){&.is-open .ms-ComboBox-CaretDown-button {
+          right: -2px;
+          top: -2px;
+        }
         &:hover {
           border-color: #212121;
         }
         @media screen and (-ms-high-contrast: active){&:hover {
           -ms-high-contrast-adjust: none;
+          background-color: Window;
           border-color: Highlight;
           color: HighlightText;
         }
         &:active {
           border-color: #0078d7;
         }
+        @media screen and (-ms-high-contrast: active){&:active {
+          -ms-high-contrast-adjust: none;
+          background-color: Window;
+          border-color: Highlight;
+          border-width: 2px;
+          color: HighlightText;
+          padding-left: 11px;
+        }
+        @media screen and (-ms-high-contrast: active){&:active .ms-ComboBox-Input {
+          height: 28px;
+        }
+        @media screen and (-ms-high-contrast: active){&:active .ms-ComboBox-CaretDown-button {
+          right: -2px;
+          top: -2px;
+        }
         &:focus {
           border-color: #0078d7;
         }
         @media screen and (-ms-high-contrast: active){&:focus {
           -ms-high-contrast-adjust: none;
+          background-color: Window;
           border-color: Highlight;
+          border-width: 2px;
           color: HighlightText;
+          padding-left: 11px;
+        }
+        @media screen and (-ms-high-contrast: active){&:focus .ms-ComboBox-Input {
+          height: 28px;
+        }
+        @media screen and (-ms-high-contrast: active){&:focus .ms-ComboBox-CaretDown-button {
+          right: -2px;
+          top: -2px;
         }
     id="ComboBox0wrapper"
   >
@@ -88,10 +128,6 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
             box-sizing: border-box;
             font: inherit;
             height: 30px;
-            margin-bottom: 1px;
-            margin-left: 0px;
-            margin-right: 0px;
-            margin-top: 1px;
             outline: none;
             padding-bottom: 0;
             padding-left: 0;
@@ -150,8 +186,10 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
             padding-right: 4px;
             padding-top: 0;
             position: absolute;
+            right: -1px;
             text-align: center;
             text-decoration: none;
+            top: -1px;
             user-select: none;
             vertical-align: top;
             width: 32px;
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
index e24c22d132821..658672de7ce28 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.scss
@@ -12,8 +12,8 @@ $Dropdown-selectedItem-hover-bg: $ms-color-neutralLighter;
 $DropDown-height: 32px;
 $DropDown-item-height: 32px;
 
-// Mixin for high contrast mode link states
-@mixin highContrastListItemState {
+// Mixin for high contrast mode states
+@mixin highContrastItemAndTitleState {
   @include high-contrast {
     background-color: Highlight;
     border-color: Highlight;
@@ -23,6 +23,12 @@ $DropDown-item-height: 32px;
   @include highContrastAdjust();
 }
 
+@mixin highContrastBorderState {
+  @include high-contrast {
+    border-color: Highlight;
+  }
+}
+
 .root {
   @include ms-normalize;
   @include ms-font-m;
@@ -38,11 +44,6 @@ $DropDown-item-height: 32px;
     .title,
     .caretDown {
       color: $ms-color-neutralDark;
-
-      @include high-contrast {
-        // Using Highlight for text here specifically to match the border color that indicates focus on dropdown root elements.
-        color: Highlight;
-      }
     }
 
     .titleIsPlaceHolder {
@@ -53,6 +54,7 @@ $DropDown-item-height: 32px;
   &:hover {
     .title {
       border-color: $ms-color-neutralDark;
+      @include highContrastBorderState();
     }
     .titleIsError {
       border-color: $ms-color-error;
@@ -62,6 +64,7 @@ $DropDown-item-height: 32px;
   &:active {
     .title {
       border-color: $ms-color-themeDark;
+      @include highContrastBorderState();
     }
     .titleIsError {
       border-color: $ms-color-error;
@@ -71,6 +74,10 @@ $DropDown-item-height: 32px;
   &:focus {
     .title {
       border-color: $ms-color-themePrimary;
+      @include highContrastItemAndTitleState();
+    }
+    .caretDown {
+      @include highContrastAdjust();
     }
     .titleIsError {
       border-color: $ms-color-error;
@@ -207,7 +214,7 @@ $DropDown-item-height: 32px;
 
   &:focus {
     background-color: $ms-color-neutralLighter;
-    @include highContrastListItemState;
+    @include highContrastItemAndTitleState;
   }
 
   &:active {
@@ -229,7 +236,7 @@ $DropDown-item-height: 32px;
   background-color: $Dropdown-selectedItem-bg;
   color: $ms-color-black;
 
-  @include highContrastListItemState;
+  @include highContrastItemAndTitleState;
 
   &.itemIsDisabled {
     color: $ms-color-neutralTertiary;
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index 43b076b98c360..6deccdf4964fd 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -28,6 +28,17 @@ $field-placeholder-disabled-color: $disabledTextColor;
 $field-description-color: $bodySubtextColor;
 $field-error-color: $errorTextColor;
 
+// Mixin for focus border, including high contrast
+@mixin fieldFocusBorder {
+  border-color: $field-border-focus-color;
+  @include high-contrast {
+    border-width: 2px;
+    .field {
+      @include ms-padding(0, 11px, 0, 11px);
+    }
+  }
+}
+
 // the box containing the label and input field
 .root {
   @include ms-normalize;
@@ -54,7 +65,7 @@ $field-error-color: $errorTextColor;
   }
 
   &.fieldGroupIsFocused {
-    border-color: $field-border-focus-color;
+    @include fieldFocusBorder();
   }
 
   &.fieldGroupIsFocused {
@@ -163,7 +174,7 @@ $field-error-color: $errorTextColor;
 
 //= State: An active textfield
 .root.rootIsActive {
-  border-color: $field-border-focus-color;
+  @include fieldFocusBorder();
 }
 
 .icon {
@@ -241,7 +252,7 @@ $field-error-color: $errorTextColor;
   }
 
   &.rootIsActive {
-    border-color: $field-border-focus-color;
+    @include fieldFocusBorder();
   }
 
   &:hover:not(.rootIsDisabled),

From fe1c0f061947e66f1a3c63b168cdfecdc282b39b Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Fri, 2 Feb 2018 13:35:06 -0800
Subject: [PATCH 1313/1641] [SpinButton] Fix floating point rounding issues and
 implemented precision (#3867)

* SpinButton, implemented precision

* Change file

* Precision functions to utils

* Change file

* Removed default reference
---
 ...spinbutton_precision_2018-02-02-18-16.json | 11 +++++
 ...spinbutton_precision_2018-02-02-00-02.json | 11 +++++
 .../src/components/SpinButton/SpinButton.tsx  | 30 ++++++++----
 .../components/SpinButton/SpinButton.types.ts | 10 ++++
 .../examples/SpinButton.Basic.Example.tsx     |  9 ++++
 packages/utilities/src/math.test.ts           | 48 ++++++++++++++++++-
 packages/utilities/src/math.ts                | 37 ++++++++++++++
 7 files changed, 147 insertions(+), 9 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/magellan-spinbutton_precision_2018-02-02-18-16.json
 create mode 100644 common/changes/office-ui-fabric-react/magellan-spinbutton_precision_2018-02-02-00-02.json

diff --git a/common/changes/@uifabric/utilities/magellan-spinbutton_precision_2018-02-02-18-16.json b/common/changes/@uifabric/utilities/magellan-spinbutton_precision_2018-02-02-18-16.json
new file mode 100644
index 0000000000000..9d0d74345f74b
--- /dev/null
+++ b/common/changes/@uifabric/utilities/magellan-spinbutton_precision_2018-02-02-18-16.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "[Math] implemented precision rounding functions",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/magellan-spinbutton_precision_2018-02-02-00-02.json b/common/changes/office-ui-fabric-react/magellan-spinbutton_precision_2018-02-02-00-02.json
new file mode 100644
index 0000000000000..59b38e88323a2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/magellan-spinbutton_precision_2018-02-02-00-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "[SpinButton] Implemented precision",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index 5292a2e5b4b28..f219de768ef82 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -7,7 +7,9 @@ import {
   getId,
   KeyCodes,
   autobind,
-  customizable
+  customizable,
+  calculatePrecision,
+  precisionRound
 } from '../../Utilities';
 import {
   ISpinButton,
@@ -40,6 +42,11 @@ export interface ISpinButtonState {
    * as active when up/down arrow is pressed
    */
   keyboardSpinDirection: KeyboardSpinDirection;
+
+  /**
+   * The calculated precision for the value.
+   */
+  precision: number;
 }
 
 @customizable('SpinButton', ['theme'])
@@ -80,10 +87,14 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
     let value = props.value || props.defaultValue || String(props.min) || '0';
     this._lastValidValue = value;
 
+    // Ensure that the autocalculated precision is not negative.
+    const precision = props.precision || Math.max(calculatePrecision(props.step!), 0);
+
     this.state = {
       isFocused: false,
       value: value,
-      keyboardSpinDirection: KeyboardSpinDirection.notSpinning
+      keyboardSpinDirection: KeyboardSpinDirection.notSpinning,
+      precision
     };
 
     this._currentStepFunctionHandle = -1;
@@ -113,7 +124,8 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
     }
 
     this.setState({
-      value: value
+      value: value,
+      precision: newProps.precision || this.state.precision
     });
   }
 
@@ -287,16 +299,18 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
   /**
    * Increment function to use if one is not passed in
    */
-  private _defaultOnIncrement = (value: string) => {
-    let newValue = Math.min(Number(value) + (this.props.step as number), this.props.max as number);
+  private _defaultOnIncrement = (value: string): string | void => {
+    let newValue: number = Math.min(Number(value) + Number(this.props.step)!, this.props.max!);
+    newValue = precisionRound(newValue, this.state.precision);
     return String(newValue);
   }
 
   /**
    * Increment function to use if one is not passed in
    */
-  private _defaultOnDecrement = (value: string) => {
-    let newValue = Math.max(Number(value) - (this.props.step as number), this.props.min as number);
+  private _defaultOnDecrement = (value: string): string | void => {
+    let newValue: number = Math.max(Number(value) - Number(this.props.step)!, this.props.min!);
+    newValue = precisionRound(newValue, this.state.precision);
     return String(newValue);
   }
 
@@ -351,7 +365,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
    */
   @autobind
   private _updateValue(shouldSpin: boolean, stepDelay: number, stepFunction: (string: string) => string | void) {
-    const newValue = stepFunction(this.state.value as string);
+    let newValue: string | void = stepFunction(this.state.value);
     if (newValue) {
       this._lastValidValue = newValue;
       this.setState({ value: newValue });
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts
index 513085a989290..e21a7cc9cadd1 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts
@@ -51,6 +51,9 @@ export interface ISpinButtonProps {
 
   /**
    * The difference between the two adjacent values of the SpinButton.
+   * This value is sued to calculate the precision of the input if no
+   * precision is given. The precision calculated this way will always
+   * be >= 0.
    * @default 1
    */
   step?: number;
@@ -165,6 +168,13 @@ export interface ISpinButtonProps {
    * Accessibility label text for the decrement button for the benefit of the screen reader.
    */
   decrementButtonAriaLabel?: string;
+
+  /**
+   * To how many decimal places the value should be rounded to.
+   * The default value is calculated based on the precision of step.
+   * IE: if step = 1, precision = 0. step = 0.0089, precision = 4. step = 300, precision = 2. step = 23.00, precision = 2.
+   */
+  precision?: number;
 }
 
 export interface ISpinButtonStyles {
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx
index 170847ae76046..0b5eaf10976f7 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Basic.Example.tsx
@@ -15,6 +15,15 @@ export class SpinButtonBasicExample extends React.Component<any, any> {
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
         />
+        <SpinButton
+          defaultValue='0'
+          label={ 'Decimal SpinButton:' }
+          min={ 0 }
+          max={ 10 }
+          step={ 0.1 }
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
+        />
       </div>
     );
   }
diff --git a/packages/utilities/src/math.test.ts b/packages/utilities/src/math.test.ts
index a3a8f0b705682..63256b6f6b028 100644
--- a/packages/utilities/src/math.test.ts
+++ b/packages/utilities/src/math.test.ts
@@ -1,4 +1,8 @@
-import { fitContentToBounds } from './math';
+import {
+  fitContentToBounds,
+  calculatePrecision,
+  precisionRound
+} from './math';
 
 describe('math', () => {
   describe('#fitContentToBounds', () => {
@@ -144,4 +148,46 @@ describe('math', () => {
       });
     });
   });
+
+  describe('#calculatePrecision', () => {
+    it('caluclatePrecision should work as intended', () => {
+      expect(calculatePrecision(0)).toEqual(0);
+      expect(calculatePrecision(1)).toEqual(0);
+      expect(calculatePrecision('1')).toEqual(0);
+
+      expect(calculatePrecision(200)).toEqual(-2);
+      expect(calculatePrecision(32100012300000)).toEqual(-5);
+
+      expect(calculatePrecision(231.00)).toEqual(0);
+      expect(calculatePrecision('231.00')).toEqual(2);
+      expect(calculatePrecision(321.00002)).toEqual(5);
+      expect(calculatePrecision('321.00002')).toEqual(5);
+
+      expect(calculatePrecision(.002)).toEqual(3);
+      expect(calculatePrecision('.002')).toEqual(3);
+    });
+  });
+
+  describe('#precisionRound', () => {
+    it('precisionRound should work as intended', () => {
+      expect(precisionRound(1234, 0)).toEqual(1234);
+      expect(precisionRound(1234, -1)).toEqual(1230);
+      expect(precisionRound(1234, -3)).toEqual(1000);
+
+      expect(precisionRound(1234.5678, 0)).toEqual(1235);
+      expect(precisionRound(1234.5678, 1)).toEqual(1234.6);
+      expect(precisionRound(1234.5678, 5)).toEqual(1234.5678);
+
+      expect(precisionRound(1234.555, 2)).toEqual(1234.56);
+      expect(precisionRound(1234.554, 2)).toEqual(1234.55);
+      expect(precisionRound(1250, -2)).toEqual(1300);
+      expect(precisionRound(1249, -2)).toEqual(1200);
+
+      // Different bases
+      expect(precisionRound(1234.5, -2, 2)).toEqual(1236);
+      expect(precisionRound(1234.5, -2, 16)).toEqual(1280);
+      expect(precisionRound(1234.5, -2, 8)).toEqual(1216);
+      expect(precisionRound(1234.5, -2, 7)).toEqual(1225);
+    });
+  });
 });
diff --git a/packages/utilities/src/math.ts b/packages/utilities/src/math.ts
index 2eae208b5490e..c1288a4828075 100644
--- a/packages/utilities/src/math.ts
+++ b/packages/utilities/src/math.ts
@@ -93,3 +93,40 @@ export function fitContentToBounds(options: IFitContentToBoundsOptions): ISize {
     height: contentSize.height * finalScale
   };
 }
+
+/**
+ * Calculates a number's precision based on the number of trailing
+ * zeros if the number does not have a decimal indicated by a negative
+ * precision. Otherwise, it calculates the number of digits after
+ * the decimal point indicated by a positive precision.
+ * @param value
+ */
+export function calculatePrecision(value: number | string): number {
+  /**
+   * Group 1:
+   * [1-9]([0]+$) matches trailing zeros
+   * Group 2:
+   * \.([0-9]*) matches all digits after a decimal point.
+   */
+  const groups = /[1-9]([0]+$)|\.([0-9]*)/.exec(String(value));
+  if (!groups) {
+    return 0;
+  }
+  if (groups[1]) {
+    return -groups[1].length;
+  }
+  if (groups[2]) {
+    return groups[2].length;
+  }
+  return 0;
+}
+
+/**
+ * Rounds a number to a certain level of precision. Accepts negative precision.
+ * @param value The value that is being rounded.
+ * @param precision The number of decimal places to round the number to
+ */
+export function precisionRound(value: number, precision: number, base: number = 10): number {
+  const exp = Math.pow(base, precision);
+  return Math.round(value * exp) / exp;
+}

From 27319afb02ca64f3c70829d56f5809fa7d5937fd Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 5 Feb 2018 11:24:23 +0000
Subject: [PATCH 1314/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 ...spinbutton_precision_2018-02-02-18-16.json | 11 --------
 .../dropdown-hc_2018-02-02-02-15.json         | 11 --------
 ...spinbutton_precision_2018-02-02-00-02.json | 11 --------
 packages/example-app-base/package.json        |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 26 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 13 +++++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 ++++++++++
 packages/utilities/CHANGELOG.md               |  9 ++++++-
 packages/utilities/package.json               |  2 +-
 12 files changed, 66 insertions(+), 41 deletions(-)
 delete mode 100644 common/changes/@uifabric/utilities/magellan-spinbutton_precision_2018-02-02-18-16.json
 delete mode 100644 common/changes/office-ui-fabric-react/dropdown-hc_2018-02-02-02-15.json
 delete mode 100644 common/changes/office-ui-fabric-react/magellan-spinbutton_precision_2018-02-02-00-02.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index cd52474b82653..8951153cf1c2d 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.45.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.46.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/magellan-spinbutton_precision_2018-02-02-18-16.json b/common/changes/@uifabric/utilities/magellan-spinbutton_precision_2018-02-02-18-16.json
deleted file mode 100644
index 9d0d74345f74b..0000000000000
--- a/common/changes/@uifabric/utilities/magellan-spinbutton_precision_2018-02-02-18-16.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "[Math] implemented precision rounding functions",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/dropdown-hc_2018-02-02-02-15.json b/common/changes/office-ui-fabric-react/dropdown-hc_2018-02-02-02-15.json
deleted file mode 100644
index 96a1f0b493596..0000000000000
--- a/common/changes/office-ui-fabric-react/dropdown-hc_2018-02-02-02-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox, Dropdown, TextField: Improved high contrast in focus state. Layout changes for ComboBox to allow for border-box sizing.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/magellan-spinbutton_precision_2018-02-02-00-02.json b/common/changes/office-ui-fabric-react/magellan-spinbutton_precision_2018-02-02-00-02.json
deleted file mode 100644
index 59b38e88323a2..0000000000000
--- a/common/changes/office-ui-fabric-react/magellan-spinbutton_precision_2018-02-02-00-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "[SpinButton] Implemented precision",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 2bf696bc634db..da3e006af36f7 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.17.0 <6.0.0",
-    "@uifabric/utilities": ">=5.9.0 <6.0.0",
+    "@uifabric/utilities": ">=5.10.0 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 9c917dbe33563..6d8caa415d360 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.46.0",
+      "tag": "office-ui-fabric-react_v5.46.0",
+      "date": "Mon, 05 Feb 2018 11:24:23 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "5c71bd92894505214a9a6df8c4fb9d8e43472d98",
+            "comment": "ComboBox, Dropdown, TextField: Improved high contrast in focus state. Layout changes for ComboBox to allow for border-box sizing."
+          }
+        ],
+        "minor": [
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "fe1c0f061947e66f1a3c63b168cdfecdc282b39b",
+            "comment": "[SpinButton] Implemented precision"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.9.0 <6.0.0` to `>=5.10.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.45.3",
       "tag": "office-ui-fabric-react_v5.45.3",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index d71482ee34637..842cd7400767a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 02 Feb 2018 11:24:16 GMT and should not be manually modified.
+This log was last generated on Mon, 05 Feb 2018 11:24:23 GMT and should not be manually modified.
+
+## 5.46.0
+Mon, 05 Feb 2018 11:24:23 GMT
+
+### Minor changes
+
+- [SpinButton] Implemented precision
+
+### Patches
+
+- ComboBox, Dropdown, TextField: Improved high contrast in focus state. Layout changes for ComboBox to allow for border-box sizing.
 
 ## 5.45.3
 Fri, 02 Feb 2018 11:24:16 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 2196d98549c8a..3d95dd7df1382 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.45.3",
+  "version": "5.46.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -51,7 +51,7 @@
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "@uifabric/merge-styles": ">=5.11.0 <6.0.0",
     "@uifabric/styling": ">=5.17.0 <6.0.0",
-    "@uifabric/utilities": ">=5.9.0 <6.0.0",
+    "@uifabric/utilities": ">=5.10.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 5c9edbcaea5f1..a4f3f7607adc4 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.9.0 <6.0.0",
+    "@uifabric/utilities": ">=5.10.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.11.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 43df62c0fd494..fb0d2d00550af 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.10.0",
+      "tag": "@uifabric/utilities_v5.10.0",
+      "date": "Mon, 05 Feb 2018 11:24:23 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "fe1c0f061947e66f1a3c63b168cdfecdc282b39b",
+            "comment": "[Math] implemented precision rounding functions"
+          }
+        ]
+      }
+    },
     {
       "version": "5.9.0",
       "tag": "@uifabric/utilities_v5.9.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 3f4b42b99f7fe..a8c13b5334fcc 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Mon, 29 Jan 2018 11:23:40 GMT and should not be manually modified.
+This log was last generated on Mon, 05 Feb 2018 11:24:23 GMT and should not be manually modified.
+
+## 5.10.0
+Mon, 05 Feb 2018 11:24:23 GMT
+
+### Minor changes
+
+- [Math] implemented precision rounding functions
 
 ## 5.9.0
 Mon, 29 Jan 2018 11:23:40 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index f0afb8f04b651..b633f3c5795ac 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.9.0",
+  "version": "5.10.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From d98ba978273b040546a36cc8144b8aa961235235 Mon Sep 17 00:00:00 2001
From: akashperfect <akashperfect@gmail.com>
Date: Tue, 6 Feb 2018 00:53:21 +0530
Subject: [PATCH 1315/1641] [DetailsList] Adding aria-describedby optional
 callback for each item (#3770)

* Adding aria-describedby optional callback for each item

* Adding npm run change

* Update users-akashperfect-DetailsList-AddingAriaDescribedByForRows_2018-01-23-11-35.json

* resolve comment by adding an extra line at EOF
---
 ...AddingAriaDescribedByForRows_2018-01-23-11-35.json | 11 +++++++++++
 .../src/components/DetailsList/DetailsList.tsx        |  2 ++
 .../src/components/DetailsList/DetailsList.types.ts   |  3 +++
 .../src/components/DetailsList/DetailsRow.tsx         |  4 ++++
 4 files changed, 20 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/users-akashperfect-DetailsList-AddingAriaDescribedByForRows_2018-01-23-11-35.json

diff --git a/common/changes/office-ui-fabric-react/users-akashperfect-DetailsList-AddingAriaDescribedByForRows_2018-01-23-11-35.json b/common/changes/office-ui-fabric-react/users-akashperfect-DetailsList-AddingAriaDescribedByForRows_2018-01-23-11-35.json
new file mode 100644
index 0000000000000..6c6b4c4c3e17e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-akashperfect-DetailsList-AddingAriaDescribedByForRows_2018-01-23-11-35.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: Adding optional callback aria-describedby for each item in DetailsList",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "akashperfect@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index c5751ebc41a24..81e81101f4e81 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -430,6 +430,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       viewport,
       checkboxVisibility,
       getRowAriaLabel,
+      getRowAriaDescribedBy,
       checkButtonAriaLabel,
       checkboxCellClassName,
       groupProps
@@ -467,6 +468,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       checkboxVisibility: checkboxVisibility,
       collapseAllVisibility: collapseAllVisibility,
       getRowAriaLabel: getRowAriaLabel,
+      getRowAriaDescribedBy: getRowAriaDescribedBy,
       checkButtonAriaLabel: checkButtonAriaLabel,
       checkboxCellClassName: checkboxCellClassName,
     }, this._onRenderRow);
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
index b23be1ac51475..f370f567e8a30 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
@@ -162,6 +162,9 @@ export interface IDetailsListProps extends React.Props<DetailsList>, IWithViewpo
   /** Optional callback to get the aria-label string for a given item. */
   getRowAriaLabel?: (item: any) => string;
 
+  /** Optional callback to get the aria-describedby IDs (space separated strings) of the elements that describe the item. */
+  getRowAriaDescribedBy?: (item: any) => string;
+
   /** Optional callback to get the item key, to be used in the selection and on render. */
   getKey?: (item: any, index?: number) => string;
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index 6e53c0ddba93c..c3900ee57e1f5 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -49,6 +49,7 @@ export interface IDetailsRowProps extends React.Props<DetailsRow> {
   checkboxVisibility?: CheckboxVisibility;
   collapseAllVisibility?: CollapseAllVisibility;
   getRowAriaLabel?: (item: any) => string;
+  getRowAriaDescribedBy?: (item: any) => string;
   checkButtonAriaLabel?: string;
   checkboxCellClassName?: string;
   className?: string;
@@ -187,6 +188,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
       viewport,
       checkboxVisibility,
       getRowAriaLabel,
+      getRowAriaDescribedBy,
       checkButtonAriaLabel,
       checkboxCellClassName,
       selection,
@@ -196,6 +198,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
     const isDraggable = Boolean(dragDropEvents && dragDropEvents.canDrag && dragDropEvents.canDrag(item));
     const droppingClassName = isDropping ? (this._droppingClassNames ? this._droppingClassNames : DEFAULT_DROPPING_CSS_CLASS) : '';
     const ariaLabel = getRowAriaLabel ? getRowAriaLabel(item) : null;
+    const ariaDescribedBy = getRowAriaDescribedBy ? getRowAriaDescribedBy(item) : undefined;
     const canSelect = selection.canSelectItem!(item);
     const isContentUnselectable = selectionMode === SelectionMode.multiple;
     const showCheckbox = selectionMode !== SelectionMode.none && checkboxVisibility !== CheckboxVisibility.hidden;
@@ -208,6 +211,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
         componentRef={ this._resolveRef('_focusZone') }
         role='row'
         aria-label={ ariaLabel }
+        ariaDescribedBy={ ariaDescribedBy }
         className={ css(
           'ms-DetailsRow',
           className,

From 92c237d5804d8864ed44310ecb5ed93e835554e7 Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Mon, 5 Feb 2018 13:31:59 -0800
Subject: [PATCH 1316/1641] BaseAutofill: move to be it's own component (#3877)

* move base autofill and rename properly

* adding files

* adding change files

* renamed to autofill

* fixed rename

* added a few more comments
---
 ...ct-move-baseautofill_2018-02-02-23-42.json |  11 +
 ...ct-move-baseautofill_2018-02-02-23-42.json |  11 +
 .../ExtendedPicker/BaseExtendedPicker.tsx     |  12 +-
 .../BaseExtendedPicker.types.ts               |   9 +-
 .../office-ui-fabric-react/src/Autofill.ts    |   1 +
 .../Autofill.test.tsx}                        |  22 +-
 .../src/components/Autofill/Autofill.tsx      | 287 ++++++++++++++++++
 .../src/components/Autofill/Autofill.types.ts | 110 +++++++
 .../src/components/Autofill/index.ts          |   2 +
 .../src/components/ComboBox/ComboBox.tsx      |  28 +-
 .../pickers/AutoFill/BaseAutoFill.tsx         | 282 +----------------
 .../pickers/AutoFill/BaseAutoFill.types.ts    |  98 +-----
 .../src/components/pickers/BasePicker.tsx     |  12 +-
 13 files changed, 468 insertions(+), 417 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/joschect-move-baseautofill_2018-02-02-23-42.json
 create mode 100644 common/changes/office-ui-fabric-react/joschect-move-baseautofill_2018-02-02-23-42.json
 create mode 100644 packages/office-ui-fabric-react/src/Autofill.ts
 rename packages/office-ui-fabric-react/src/components/{pickers/AutoFill/BaseAutoFill.test.tsx => Autofill/Autofill.test.tsx} (92%)
 create mode 100644 packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Autofill/Autofill.types.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Autofill/index.ts

diff --git a/common/changes/@uifabric/experiments/joschect-move-baseautofill_2018-02-02-23-42.json b/common/changes/@uifabric/experiments/joschect-move-baseautofill_2018-02-02-23-42.json
new file mode 100644
index 0000000000000..e66e3ac2c6dc5
--- /dev/null
+++ b/common/changes/@uifabric/experiments/joschect-move-baseautofill_2018-02-02-23-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "BasePicker: Use correct autofillnow",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/joschect-move-baseautofill_2018-02-02-23-42.json b/common/changes/office-ui-fabric-react/joschect-move-baseautofill_2018-02-02-23-42.json
new file mode 100644
index 0000000000000..4f65b469aa918
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/joschect-move-baseautofill_2018-02-02-23-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "BaseAutofill: Move to it's own component",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
index b02d495cb1d07..20520fcac4cc1 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
@@ -9,7 +9,7 @@ import {
   FocusZone,
   FocusZoneDirection
 } from 'office-ui-fabric-react/lib/FocusZone';
-import { BaseAutoFill } from 'office-ui-fabric-react/lib/components/pickers/AutoFill/BaseAutoFill';
+import { Autofill } from 'office-ui-fabric-react/lib/components/Autofill/Autofill';
 import { IPickerItemProps, IInputProps } from 'office-ui-fabric-react/lib/Pickers';
 import * as stylesImport from './BaseExtendedPicker.scss';
 import { IBaseExtendedPickerProps, IBaseExtendedPicker } from './BaseExtendedPicker.types';
@@ -37,7 +37,7 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
   public selectedItemsList: BaseSelectedItemsList<T, IBaseSelectedItemsListProps<T>>;
 
   protected root: HTMLElement;
-  protected input: BaseAutoFill;
+  protected input: Autofill;
   protected focusZone: FocusZone;
   protected selection: Selection;
   protected floatingPickerProps: IBaseFloatingPickerProps<T>;
@@ -80,7 +80,7 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
       className,
       inputProps,
       disabled
-        } = this.props;
+    } = this.props;
 
     return (
       <div
@@ -101,7 +101,7 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
             <div className={ css('ms-BasePicker-text', styles.pickerText) } role={ 'list' }>
               { this.props.headerComponent }
               { this.renderSelectedItemsList() }
-              { this.canAddItems() && (<BaseAutoFill
+              { this.canAddItems() && (<Autofill
                 { ...inputProps as IInputProps }
                 className={ css('ms-BasePicker-input', styles.pickerInput) }
                 ref={ this._resolveRef('input') }
@@ -177,7 +177,7 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
   }
 
   @autobind
-  protected onInputFocus(ev: React.FocusEvent<HTMLInputElement | BaseAutoFill>): void {
+  protected onInputFocus(ev: React.FocusEvent<HTMLInputElement | Autofill>): void {
     this.selectedItemsList.unselectAll();
     this.floatingPicker.showPicker();
 
@@ -194,7 +194,7 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
       return;
     }
     if (this.state.items.length && !this.input || !this.input.isValueSelected) {
-      if ((this.input as BaseAutoFill).cursorLocation === 0) {
+      if ((this.input as Autofill).cursorLocation === 0) {
         this.selectedItemsList.removeItemAt(this.items.length - 1);
         this._onSelectedItemsChanged();
       }
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts
index 49b9a584262b8..df410ca4b822b 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts
@@ -1,5 +1,6 @@
 import * as React from 'react';
-import { BaseAutoFill, IInputProps } from 'office-ui-fabric-react/lib/Pickers';
+import { Autofill } from 'office-ui-fabric-react/lib/Autofill';
+import { IInputProps } from 'office-ui-fabric-react/lib/Pickers';
 import { IBaseFloatingPickerProps } from '../../FloatingPicker';
 import { IBaseSelectedItemsListProps } from '../../SelectedItemsList';
 
@@ -41,12 +42,12 @@ export interface IBaseExtendedPickerProps<T> {
   /**
    * A callback for when the user put focus on the picker
    */
-  onFocus?: React.FocusEventHandler<HTMLInputElement | BaseAutoFill>;
+  onFocus?: React.FocusEventHandler<HTMLInputElement | Autofill>;
 
   /**
    * A callback for when the user moves the focus away from the picker
    */
-  onBlur?: React.FocusEventHandler<HTMLInputElement | BaseAutoFill>;
+  onBlur?: React.FocusEventHandler<HTMLInputElement | Autofill>;
 
   /**
    * ClassName for the picker.
@@ -74,7 +75,7 @@ export interface IBaseExtendedPickerProps<T> {
   selectedItemsListProps: IBaseSelectedItemsListProps<T>;
 
   /**
-   * AutoFill input native props
+   * Autofill input native props
    * @default undefined
    */
   inputProps?: IInputProps;
diff --git a/packages/office-ui-fabric-react/src/Autofill.ts b/packages/office-ui-fabric-react/src/Autofill.ts
new file mode 100644
index 0000000000000..148455296e48f
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/Autofill.ts
@@ -0,0 +1 @@
+export * from './components/Autofill/index';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.test.tsx b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.test.tsx
similarity index 92%
rename from packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.test.tsx
rename to packages/office-ui-fabric-react/src/components/Autofill/Autofill.test.tsx
index a1da2465c6150..4f2963461f5c5 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.test.tsx
@@ -5,18 +5,18 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import * as ReactTestUtils from 'react-dom/test-utils';
 
-import { KeyCodes } from '../../../Utilities';
-import { BaseAutoFill } from './BaseAutoFill';
+import { KeyCodes } from '../../Utilities';
+import { Autofill } from './Autofill';
 
-describe('BaseAutoFill', () => {
-  let autoFill: BaseAutoFill;
+describe('Autofill', () => {
+  let autoFill: Autofill;
   let autoFillInput: HTMLInputElement;
   let baseNode = document.createElement('div');
   document.body.appendChild(baseNode);
   beforeEach(() => {
 
     let component = ReactDOM.render(
-      <BaseAutoFill
+      <Autofill
         ref={ (c) => autoFill = c! }
         suggestedDisplayValue='hello'
       />,
@@ -33,7 +33,7 @@ describe('BaseAutoFill', () => {
     };
 
     ReactDOM.render(
-      <BaseAutoFill
+      <Autofill
         ref={ (c) => autoFill = c! }
         onInputValueChange={ onInputValueChange }
         suggestedDisplayValue='hello'
@@ -43,7 +43,7 @@ describe('BaseAutoFill', () => {
     autoFillInput.value = 'hel';
     ReactTestUtils.Simulate.change(autoFillInput);
     ReactDOM.render(
-      <BaseAutoFill
+      <Autofill
         ref={ (c) => autoFill = c! }
         onInputValueChange={ onInputValueChange }
         suggestedDisplayValue='hello'
@@ -63,7 +63,7 @@ describe('BaseAutoFill', () => {
     autoFillInput.value = 'hep';
     ReactTestUtils.Simulate.change(autoFillInput);
     ReactDOM.render(
-      <BaseAutoFill
+      <Autofill
         ref={ (c) => autoFill = c! }
         onInputValueChange={ onInputValueChange }
         suggestedDisplayValue='hello'
@@ -78,7 +78,7 @@ describe('BaseAutoFill', () => {
     ReactTestUtils.Simulate.change(autoFillInput);
 
     ReactDOM.render(
-      <BaseAutoFill
+      <Autofill
         ref={ (c) => autoFill = c! }
         suggestedDisplayValue='hello'
       />,
@@ -102,7 +102,7 @@ describe('BaseAutoFill', () => {
     ReactTestUtils.Simulate.change(autoFillInput);
 
     ReactDOM.render(
-      <BaseAutoFill
+      <Autofill
         ref={ (c) => autoFill = c! }
         suggestedDisplayValue='hello'
       />,
@@ -121,7 +121,7 @@ describe('BaseAutoFill', () => {
     ReactTestUtils.Simulate.change(autoFillInput);
 
     ReactDOM.render(
-      <BaseAutoFill
+      <Autofill
         ref={ (c) => autoFill = c! }
         suggestedDisplayValue='hello'
       />,
diff --git a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx
new file mode 100644
index 0000000000000..4d40ee53a5963
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx
@@ -0,0 +1,287 @@
+import * as React from 'react';
+import { IAutofillProps, IAutofill } from './Autofill.types';
+import {
+  BaseComponent,
+  KeyCodes,
+  autobind,
+  getNativeProps,
+  inputProperties
+} from '../../Utilities';
+
+export interface IAutofillState {
+  displayValue?: string;
+}
+
+const SELECTION_FORWARD = 'forward';
+const SELECTION_BACKWARD = 'backward';
+
+export class Autofill extends BaseComponent<IAutofillProps, IAutofillState> implements IAutofill {
+
+  public static defaultProps = {
+    enableAutofillOnKeyPress: [KeyCodes.down, KeyCodes.up]
+  };
+
+  private _inputElement: HTMLInputElement;
+  private _autoFillEnabled: boolean = true;
+  private _value: string;
+
+  constructor(props: IAutofillProps) {
+    super(props);
+    this._value = '';
+    this.state = {
+      displayValue: props.defaultVisibleValue || ''
+    };
+  }
+
+  public get cursorLocation(): number {
+    if (this._inputElement) {
+      let inputElement = this._inputElement;
+      if (inputElement.selectionDirection !== SELECTION_FORWARD) {
+        return inputElement.selectionEnd;
+      } else {
+        return inputElement.selectionStart;
+      }
+    } else {
+      return -1;
+    }
+  }
+
+  public get isValueSelected(): boolean {
+    return this.inputElement.selectionStart !== this.inputElement.selectionEnd;
+  }
+
+  public get value(): string {
+    return this._value;
+  }
+
+  public get selectionStart(): number {
+    return this._inputElement ? this._inputElement.selectionStart : -1;
+  }
+
+  public get selectionEnd(): number {
+    return this._inputElement ? this._inputElement.selectionEnd : -1;
+  }
+
+  public get inputElement(): HTMLInputElement {
+    return this._inputElement;
+  }
+
+  public componentWillReceiveProps(nextProps: IAutofillProps) {
+    let newValue;
+
+    if (this.props.updateValueInWillReceiveProps) {
+      newValue = this.props.updateValueInWillReceiveProps();
+    }
+
+    newValue = this._getDisplayValue(newValue ? newValue : this._value, nextProps.suggestedDisplayValue);
+
+    if (typeof newValue === 'string') {
+      this.setState({ displayValue: newValue });
+    }
+  }
+
+  public componentDidUpdate() {
+    let value = this._value;
+    let {
+      suggestedDisplayValue,
+      shouldSelectFullInputValueInComponentDidUpdate
+    } = this.props;
+    let differenceIndex = 0;
+
+    if (this._autoFillEnabled && value && suggestedDisplayValue && this._doesTextStartWith(suggestedDisplayValue, value)) {
+      let shouldSelectFullRange = false;
+
+      if (shouldSelectFullInputValueInComponentDidUpdate) {
+        shouldSelectFullRange = shouldSelectFullInputValueInComponentDidUpdate();
+      }
+
+      if (shouldSelectFullRange) {
+        this._inputElement.setSelectionRange(0, suggestedDisplayValue.length, SELECTION_BACKWARD);
+      } else {
+        while (differenceIndex < value.length && value[differenceIndex].toLocaleLowerCase() === suggestedDisplayValue[differenceIndex].toLocaleLowerCase()) {
+          differenceIndex++;
+        }
+        if (differenceIndex > 0) {
+          this._inputElement.setSelectionRange(differenceIndex, suggestedDisplayValue.length, SELECTION_BACKWARD);
+        }
+      }
+    }
+  }
+
+  public render() {
+    let {
+      displayValue
+    } = this.state;
+
+    const nativeProps = getNativeProps(this.props, inputProperties);
+    return (
+      <input
+        { ...nativeProps }
+        ref={ this._resolveRef('_inputElement') }
+        value={ displayValue }
+        autoCapitalize={ 'off' }
+        autoComplete={ 'off' }
+        onCompositionStart={ this._onCompositionStart }
+        onCompositionEnd={ this._onCompositionEnd }
+        onChange={ this._onChange }
+        onKeyDown={ this._onKeyDown }
+        onClick={ this.props.onClick ? this.props.onClick : this._onClick }
+        data-lpignore={ true }
+      />
+    );
+  }
+
+  public focus() {
+    this._inputElement.focus();
+  }
+
+  public clear() {
+    this._autoFillEnabled = true;
+    this._updateValue('');
+    this._inputElement.setSelectionRange(0, 0);
+  }
+
+  // Composition events are used when the character/text requires several keystrokes to be completed.
+  // Some examples of this are mobile text input and langauges like Japanese or Arabic.
+  // Find out more at https://developer.mozilla.org/en-US/docs/Web/Events/compositionstart
+  @autobind
+  private _onCompositionStart(ev: React.CompositionEvent<HTMLInputElement>) {
+    this._autoFillEnabled = false;
+  }
+
+  // Composition events are used when the character/text requires several keystrokes to be completed.
+  // Some examples of this are mobile text input and langauges like Japanese or Arabic.
+  // Find out more at https://developer.mozilla.org/en-US/docs/Web/Events/compositionstart
+  @autobind
+  private _onCompositionEnd(ev: React.CompositionEvent<HTMLInputElement>) {
+    let inputValue = this._getCurrentInputValue();
+    this._tryEnableAutofill(inputValue, this.value, false, true);
+    // Due to timing, this needs to be async, otherwise no text will be selected.
+    this._async.setTimeout(() => this._updateValue(inputValue), 0);
+  }
+
+  @autobind
+  private _onClick() {
+    if (this._value && this._value !== '' && this._autoFillEnabled) {
+      this._autoFillEnabled = false;
+    }
+  }
+
+  @autobind
+  private _onKeyDown(ev: React.KeyboardEvent<HTMLInputElement>) {
+    if (this.props.onKeyDown) {
+      this.props.onKeyDown(ev);
+    }
+
+    // If the event is actively being composed, then don't alert autofill.
+    // Right now typing does not have isComposing, once that has been fixed any should be removed.
+    if (!(ev.nativeEvent as any).isComposing) {
+      switch (ev.which) {
+        case KeyCodes.backspace:
+          this._autoFillEnabled = false;
+          break;
+        case KeyCodes.left:
+        case KeyCodes.right:
+          if (this._autoFillEnabled) {
+            this._value = this.state.displayValue!;
+            this._autoFillEnabled = false;
+          }
+          break;
+        default:
+          if (!this._autoFillEnabled) {
+            if (this.props.enableAutofillOnKeyPress!.indexOf(ev.which) !== -1) {
+              this._autoFillEnabled = true;
+            }
+          }
+          break;
+      }
+    }
+  }
+
+  @autobind
+  private _onChange(ev: React.FormEvent<HTMLElement>) {
+    let value: string = this._getCurrentInputValue(ev);
+    // Right now typing does not have isComposing, once that has been fixed any should be removed.
+    this._tryEnableAutofill(value, this._value, (ev.nativeEvent as any).isComposing);
+    this._updateValue(value);
+  }
+
+  private _getCurrentInputValue(ev?: React.FormEvent<HTMLElement>): string {
+    if (ev && ev.target && (ev.target as any).value) {
+      return (ev.target as any).value;
+    } else {
+      return this._inputElement.value;
+    }
+  }
+
+  /**
+   * Attempts to enable autofill. Whether or not autofill is enabled depends on the input value,
+   * whether or not any text is selected, and only if the new input value is longer than the old input value.
+   * Autofill should never be set to true if the value is composing. Once compositionEnd is called, then
+   * it should be completed.
+   * See https://developer.mozilla.org/en-US/docs/Web/API/CompositionEvent for more information on composition.
+   * @param newValue
+   * @param oldValue
+   * @param isComposing if true then the text is actively being composed and it has not completed.
+   * @param isComposed if the text is a composed text value.
+   */
+  private _tryEnableAutofill(newValue: string, oldValue: string, isComposing?: boolean, isComposed?: boolean) {
+    if (!isComposing
+      && newValue
+      && this._inputElement.selectionStart === newValue.length
+      && !this._autoFillEnabled
+      && (newValue.length > oldValue.length || isComposed)) {
+      this._autoFillEnabled = true;
+    }
+  }
+
+  private _notifyInputChange(newValue: string) {
+    if (this.props.onInputValueChange) {
+      this.props.onInputValueChange(newValue);
+    }
+  }
+
+  /**
+   * Updates the current input value as well as getting a new display value.
+   * @param newValue The new value from the input
+   */
+  @autobind
+  private _updateValue(newValue: string) {
+    this._value = this.props.onInputChange ? this.props.onInputChange(newValue) : newValue;
+    this.setState({
+      displayValue: this._getDisplayValue(this._value, this.props.suggestedDisplayValue)
+    }, () => this._notifyInputChange(this._value));
+  }
+
+  /**
+   * Returns a string that should be used as the display value.
+   * It evaluates this based on whether or not the suggested value starts with the input value
+   * and whether or not autofill is enabled.
+   * @param inputValue the value that the input currently has.
+   * @param suggestedDisplayValue the possible full value
+   */
+  private _getDisplayValue(inputValue: string, suggestedDisplayValue?: string) {
+    let displayValue = inputValue;
+    if (suggestedDisplayValue
+      && inputValue
+      && this._doesTextStartWith(suggestedDisplayValue, displayValue)
+      && this._autoFillEnabled) {
+      displayValue = suggestedDisplayValue;
+    }
+    return displayValue;
+  }
+
+  private _doesTextStartWith(text: string, startWith: string) {
+    if (!text || !startWith) {
+      return false;
+    }
+    return text.toLocaleLowerCase().indexOf(startWith.toLocaleLowerCase()) === 0;
+  }
+}
+
+/**
+ *  Legacy, @deprecated, do not use.
+ */
+export class BaseAutoFill extends Autofill {
+
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.types.ts b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.types.ts
new file mode 100644
index 0000000000000..eede0c7114c05
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.types.ts
@@ -0,0 +1,110 @@
+import * as React from 'react';
+import { Autofill } from './Autofill';
+import { KeyCodes } from '../../Utilities';
+export interface IAutofill {
+
+  /**
+   * The current index of the cursor in the input area. Returns -1 if the input element
+   * is not ready.
+   */
+  cursorLocation: number;
+  /**
+   * A boolean for whether or not there is a value selected in the input area.
+   */
+  isValueSelected: boolean;
+  /**
+   * The current text value that the user has entered.
+   */
+  value: string;
+  /**
+   * The current index of where the selection starts. Returns -1 if the input element
+   * is not ready.
+   */
+  selectionStart: number;
+  /**
+   * the current index of where the selection ends. Returns -1 if the input element
+   * is not ready.
+   */
+  selectionEnd: number;
+  /**
+   * The current input element.
+   */
+  inputElement: HTMLInputElement;
+  /**
+   * Focus the input element.
+   */
+  focus(): void;
+  /**
+   * Clear all text in the input. Sets value to '';
+   */
+  clear(): void;
+}
+
+export interface IAutofillProps extends
+  React.InputHTMLAttributes<HTMLInputElement | Autofill> {
+  /**
+   * Gets the compoonent ref.
+   */
+  componentRef?: (componentRef?: IAutofill) => void;
+
+  /**
+   * The suggested autofill value that will display.
+   */
+  suggestedDisplayValue?: string;
+
+  /**
+   * A callback for when the current input value changes.
+   */
+  onInputValueChange?: (newValue?: string) => void;
+
+  /**
+   * When the user uses left arrow, right arrow, clicks, or deletes text autofill is disabled
+   * Since the user has taken control. It is automatically reenabled when the user enters text and the
+   * cursor is at the end of the text in the input box. This specifies other key presses that will reenabled
+   * autofill.
+   * @default [KeyCodes.down, KeyCodes.up]
+   */
+  enableAutofillOnKeyPress?: KeyCodes[];
+
+  /**
+   * the default value to be visible
+   */
+  defaultVisibleValue?: string;
+
+  /**
+   * Handler for checking and updating the value if needed
+   *  in componentWillReceiveProps
+   *
+   * @param {IAutofillProps} defaultVisibleValue - the defaultVisibleValue that got passed
+   *  in to the auto fill's componentWillReceiveProps
+   * @returns {string} - the updated value to set, if needed
+   */
+  updateValueInWillReceiveProps?: () => string | null;
+
+  /**
+   * Handler for checking if the full value of the input should
+   * be seleced in componentDidUpdate
+   *
+   * @returns {boolean} - should the full value of the input be selected?
+   */
+  shouldSelectFullInputValueInComponentDidUpdate?: () => boolean;
+
+  /**
+   * A callback used to modify the input string.
+   */
+  onInputChange?: (value: string) => string;
+}
+
+/**
+ * @deprecated do not use, will be removed in 6.0
+*/
+export interface IBaseAutoFill extends IAutofill {
+
+}
+
+/**
+ * @deprecated do not use, will be removed in 6.0
+*/
+export interface IBaseAutoFillProps extends IAutofillProps {
+
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Autofill/index.ts b/packages/office-ui-fabric-react/src/components/Autofill/index.ts
new file mode 100644
index 0000000000000..1fc84edb0d62f
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Autofill/index.ts
@@ -0,0 +1,2 @@
+export * from './Autofill';
+export * from './Autofill.types';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 30a8992faae93..1d5e0e94c82bd 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -7,7 +7,7 @@ import {
   CommandButton,
   IconButton
 } from '../../Button';
-import { BaseAutoFill } from '../pickers/AutoFill/BaseAutoFill';
+import { Autofill } from '../Autofill/Autofill';
 import {
   autobind,
   BaseComponent,
@@ -94,7 +94,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   };
 
   // The input aspect of the comboBox
-  private _comboBox: BaseAutoFill;
+  private _comboBox: Autofill;
 
   // The wrapping div of the input and button
   private _comboBoxWrapper: HTMLDivElement;
@@ -295,7 +295,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     );
 
     return (
-      <div {...divProps } ref='root' className={ this._classNames.container }>
+      <div { ...divProps } ref='root' className={ this._classNames.container }>
         { label && (
           <Label id={ id + '-label' } disabled={ disabled } required={ required } htmlFor={ id + '-input' } className={ this._classNames.label }>{ label }</Label>
         ) }
@@ -304,7 +304,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
           id={ id + 'wrapper' }
           className={ this._classNames.root }
         >
-          <BaseAutoFill
+          <Autofill
             data-is-interactable={ !disabled }
             ref={ this._resolveRef('_comboBox') }
             id={ id + '-input' }
@@ -314,7 +314,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
             onBlur={ this._onBlur }
             onKeyDown={ this._onInputKeyDown }
             onKeyUp={ this._onInputKeyUp }
-            onClick={ this._onBaseAutofillClick }
+            onClick={ this._onAutofillClick }
             onInputValueChange={ this._onInputChange }
             aria-expanded={ isOpen }
             aria-autocomplete={ this._getAriaAutoCompleteValue() }
@@ -330,8 +330,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
             spellCheck={ false }
             defaultVisibleValue={ this._currentVisibleValue }
             suggestedDisplayValue={ suggestedDisplayValue }
-            updateValueInWillReceiveProps={ this._onUpdateValueInAutoFillWillReceiveProps }
-            shouldSelectFullInputValueInComponentDidUpdate={ this._onShouldSelectFullInputValueInAutoFillComponentDidUpdate }
+            updateValueInWillReceiveProps={ this._onUpdateValueInAutofillWillReceiveProps }
+            shouldSelectFullInputValueInComponentDidUpdate={ this._onShouldSelectFullInputValueInAutofillComponentDidUpdate }
             title={ title }
           />
           <IconButton
@@ -396,12 +396,12 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   /**
    * componentWillReceiveProps handler for the auto fill component
    * Checks/updates the iput value to set, if needed
-   * @param {IBaseAutoFillProps} defaultVisibleValue - the defaultVisibleValue that got passed
+   * @param {IAutofillProps} defaultVisibleValue - the defaultVisibleValue that got passed
    *  in to the auto fill's componentWillReceiveProps
    * @returns {string} - the updated value to set, if needed
    */
   @autobind
-  private _onUpdateValueInAutoFillWillReceiveProps(): string | null {
+  private _onUpdateValueInAutofillWillReceiveProps(): string | null {
     if (this._comboBox === null || this._comboBox === undefined) {
       return null;
     }
@@ -422,7 +422,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * True if the defaultVisibleValue equals the suggestedDisplayValue, false otherwise
    */
   @autobind
-  private _onShouldSelectFullInputValueInAutoFillComponentDidUpdate(): boolean {
+  private _onShouldSelectFullInputValueInAutofillComponentDidUpdate(): boolean {
     return this._currentVisibleValue === this.state.suggestedDisplayValue;
   }
 
@@ -1247,7 +1247,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * @param ev - The keyboard event that was fired
    */
   @autobind
-  private _onInputKeyDown(ev: React.KeyboardEvent<HTMLElement | BaseAutoFill>) {
+  private _onInputKeyDown(ev: React.KeyboardEvent<HTMLElement | Autofill>) {
     let {
       disabled,
       allowFreeform,
@@ -1410,7 +1410,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * @param ev - the keyboard event that was fired
    */
   @autobind
-  private _onInputKeyUp(ev: React.KeyboardEvent<HTMLElement | BaseAutoFill>) {
+  private _onInputKeyUp(ev: React.KeyboardEvent<HTMLElement | Autofill>) {
     let {
       disabled,
       allowFreeform,
@@ -1477,7 +1477,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * eating the required key event when disabled
    * @param ev - the keyboard event that was fired
    */
-  private _handleInputWhenDisabled(ev: React.KeyboardEvent<HTMLElement | BaseAutoFill> | null) {
+  private _handleInputWhenDisabled(ev: React.KeyboardEvent<HTMLElement | Autofill> | null) {
     // If we are disabled, close the menu (if needed)
     // and eat all keystokes other than TAB or ESC
     if (this.props.disabled) {
@@ -1516,7 +1516,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * Click handler for the autofill.
    */
   @autobind
-  private _onBaseAutofillClick() {
+  private _onAutofillClick() {
     if (this.props.allowFreeform) {
       this.focus(this.state.isOpen);
     } else {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
index 72e5b83f51a1e..e03bbf9b3d234 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.tsx
@@ -1,280 +1,2 @@
-import * as React from 'react';
-import { IBaseAutoFillProps, IBaseAutoFill } from './BaseAutoFill.types';
-import {
-  BaseComponent,
-  KeyCodes,
-  autobind,
-  getNativeProps,
-  inputProperties
-} from '../../../Utilities';
-
-export interface IBaseAutoFillState {
-  displayValue?: string;
-}
-
-const SELECTION_FORWARD = 'forward';
-const SELECTION_BACKWARD = 'backward';
-
-export class BaseAutoFill extends BaseComponent<IBaseAutoFillProps, IBaseAutoFillState> implements IBaseAutoFill {
-
-  public static defaultProps = {
-    enableAutoFillOnKeyPress: [KeyCodes.down, KeyCodes.up]
-  };
-
-  private _inputElement: HTMLInputElement;
-  private _autoFillEnabled: boolean = true;
-  private _value: string;
-
-  constructor(props: IBaseAutoFillProps) {
-    super(props);
-    this._value = '';
-    this.state = {
-      displayValue: props.defaultVisibleValue || ''
-    };
-  }
-
-  public get cursorLocation(): number {
-    if (this._inputElement) {
-      let inputElement = this._inputElement;
-      if (inputElement.selectionDirection !== SELECTION_FORWARD) {
-        return inputElement.selectionEnd;
-      } else {
-        return inputElement.selectionStart;
-      }
-    } else {
-      return -1;
-    }
-  }
-
-  public get isValueSelected(): boolean {
-    return this.inputElement.selectionStart !== this.inputElement.selectionEnd;
-  }
-
-  public get value(): string {
-    return this._value;
-  }
-
-  public get selectionStart(): number {
-    return this._inputElement ? this._inputElement.selectionStart : -1;
-  }
-
-  public get selectionEnd(): number {
-    return this._inputElement ? this._inputElement.selectionEnd : -1;
-  }
-
-  public get inputElement(): HTMLInputElement {
-    return this._inputElement;
-  }
-
-  public componentWillReceiveProps(nextProps: IBaseAutoFillProps) {
-    let newValue;
-
-    if (this.props.updateValueInWillReceiveProps) {
-      newValue = this.props.updateValueInWillReceiveProps();
-    }
-
-    newValue = this._getDisplayValue(newValue ? newValue : this._value, nextProps.suggestedDisplayValue);
-
-    if (typeof newValue === 'string') {
-      this.setState({ displayValue: newValue });
-    }
-  }
-
-  public componentDidUpdate() {
-    let value = this._value;
-    let {
-      suggestedDisplayValue,
-      shouldSelectFullInputValueInComponentDidUpdate
-    } = this.props;
-    let differenceIndex = 0;
-
-    if (this._autoFillEnabled && value && suggestedDisplayValue && this._doesTextStartWith(suggestedDisplayValue, value)) {
-      let shouldSelectFullRange = false;
-
-      if (shouldSelectFullInputValueInComponentDidUpdate) {
-        shouldSelectFullRange = shouldSelectFullInputValueInComponentDidUpdate();
-      }
-
-      if (shouldSelectFullRange) {
-        this._inputElement.setSelectionRange(0, suggestedDisplayValue.length, SELECTION_BACKWARD);
-      } else {
-        while (differenceIndex < value.length && value[differenceIndex].toLocaleLowerCase() === suggestedDisplayValue[differenceIndex].toLocaleLowerCase()) {
-          differenceIndex++;
-        }
-        if (differenceIndex > 0) {
-          this._inputElement.setSelectionRange(differenceIndex, suggestedDisplayValue.length, SELECTION_BACKWARD);
-        }
-      }
-    }
-  }
-
-  public render() {
-    let {
-      displayValue
-    } = this.state;
-
-    const nativeProps = getNativeProps(this.props, inputProperties);
-    return (
-      <input
-        { ...nativeProps }
-        ref={ this._resolveRef('_inputElement') }
-        value={ displayValue }
-        autoCapitalize={ 'off' }
-        autoComplete={ 'off' }
-        onCompositionStart={ this._onCompositionStart }
-        onCompositionEnd={ this._onCompositionEnd }
-        onChange={ this._onChange }
-        onKeyDown={ this._onKeyDown }
-        onClick={ this.props.onClick ? this.props.onClick : this._onClick }
-        data-lpignore={ true }
-      />
-    );
-  }
-
-  public focus() {
-    this._inputElement.focus();
-  }
-
-  public clear() {
-    this._autoFillEnabled = true;
-    this._updateValue('');
-    this._inputElement.setSelectionRange(0, 0);
-  }
-
-  // Composition events are used when the character/text requires several keystrokes to be completed.
-  // Some examples of this are mobile text input and langauges like Japanese or Arabic.
-  // Find out more at https://developer.mozilla.org/en-US/docs/Web/Events/compositionstart
-  @autobind
-  private _onCompositionStart(ev: React.CompositionEvent<HTMLInputElement>) {
-    this._autoFillEnabled = false;
-  }
-
-  // Composition events are used when the character/text requires several keystrokes to be completed.
-  // Some examples of this are mobile text input and langauges like Japanese or Arabic.
-  // Find out more at https://developer.mozilla.org/en-US/docs/Web/Events/compositionstart
-  @autobind
-  private _onCompositionEnd(ev: React.CompositionEvent<HTMLInputElement>) {
-    let inputValue = this._getCurrentInputValue();
-    this._tryEnableAutofill(inputValue, this.value, false, true);
-    // Due to timing, this needs to be async, otherwise no text will be selected.
-    this._async.setTimeout(() => this._updateValue(inputValue), 0);
-  }
-
-  @autobind
-  private _onClick() {
-    if (this._value && this._value !== '' && this._autoFillEnabled) {
-      this._autoFillEnabled = false;
-    }
-  }
-
-  @autobind
-  private _onKeyDown(ev: React.KeyboardEvent<HTMLInputElement>) {
-    if (this.props.onKeyDown) {
-      this.props.onKeyDown(ev);
-    }
-
-    // If the event is actively being composed, then don't alert autofill.
-    // Right now typing does not have isComposing, once that has been fixed any should be removed.
-    if (!(ev.nativeEvent as any).isComposing) {
-      switch (ev.which) {
-        case KeyCodes.backspace:
-          this._autoFillEnabled = false;
-          break;
-        case KeyCodes.left:
-        case KeyCodes.right:
-          if (this._autoFillEnabled) {
-            this._value = this.state.displayValue!;
-            this._autoFillEnabled = false;
-          }
-          break;
-        default:
-          if (!this._autoFillEnabled) {
-            if (this.props.enableAutoFillOnKeyPress!.indexOf(ev.which) !== -1) {
-              this._autoFillEnabled = true;
-            }
-          }
-          break;
-      }
-    }
-  }
-
-  @autobind
-  private _onChange(ev: React.FormEvent<HTMLElement>) {
-    let value: string = this._getCurrentInputValue(ev);
-    // Right now typing does not have isComposing, once that has been fixed any should be removed.
-    this._tryEnableAutofill(value, this._value, (ev.nativeEvent as any).isComposing);
-    this._updateValue(value);
-  }
-
-  private _getCurrentInputValue(ev?: React.FormEvent<HTMLElement>): string {
-    if (ev && ev.target && (ev.target as any).value) {
-      return (ev.target as any).value;
-    } else {
-      return this._inputElement.value;
-    }
-  }
-
-  /**
-   * Attempts to enable autofill. Whether or not autofill is enabled depends on the input value,
-   * whether or not any text is selected, and only if the new input value is longer than the old input value.
-   * Autofill should never be set to true if the value is composing. Once compositionEnd is called, then
-   * it should be completed.
-   * See https://developer.mozilla.org/en-US/docs/Web/API/CompositionEvent for more information on composition.
-   * @param newValue
-   * @param oldValue
-   * @param isComposing if true then the text is actively being composed and it has not completed.
-   * @param isComposed if the text is a composed text value.
-   */
-  private _tryEnableAutofill(newValue: string, oldValue: string, isComposing?: boolean, isComposed?: boolean) {
-    if (!isComposing
-      && newValue
-      && this._inputElement.selectionStart === newValue.length
-      && !this._autoFillEnabled
-      && (newValue.length > oldValue.length || isComposed)) {
-      this._autoFillEnabled = true;
-    }
-  }
-
-  private _notifyInputChange(newValue: string) {
-    if (this.props.onInputValueChange) {
-      this.props.onInputValueChange(newValue);
-    }
-  }
-
-  /**
-   * Updates the current input value as well as getting a new display value.
-   * @param newValue The new value from the input
-   */
-  @autobind
-  private _updateValue(newValue: string) {
-    this._value = this.props.onInputChange ? this.props.onInputChange(newValue) : newValue;
-    this.setState({
-      displayValue: this._getDisplayValue(this._value, this.props.suggestedDisplayValue)
-    }, () => this._notifyInputChange(this._value));
-  }
-
-  /**
-   * Returns a string that should be used as the display value.
-   * It evaluates this based on whether or not the suggested value starts with the input value
-   * and whether or not autofill is enabled.
-   * @param inputValue the value that the input currently has.
-   * @param suggestedDisplayValue the possible full value
-   */
-  private _getDisplayValue(inputValue: string, suggestedDisplayValue?: string) {
-    let displayValue = inputValue;
-    if (suggestedDisplayValue
-      && inputValue
-      && this._doesTextStartWith(suggestedDisplayValue, displayValue)
-      && this._autoFillEnabled) {
-      displayValue = suggestedDisplayValue;
-    }
-    return displayValue;
-  }
-
-  private _doesTextStartWith(text: string, startWith: string) {
-    if (!text || !startWith) {
-      return false;
-    }
-    return text.toLocaleLowerCase().indexOf(startWith.toLocaleLowerCase()) === 0;
-  }
-}
\ No newline at end of file
+// Deprecated, import directly from the component folder now.
+export * from '../../Autofill/Autofill';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.types.ts b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.types.ts
index 80fdb4d2f021b..cd9fc8b68cc37 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.types.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/AutoFill/BaseAutoFill.types.ts
@@ -1,96 +1,2 @@
-import * as React from 'react';
-import { BaseAutoFill } from './BaseAutoFill';
-import { KeyCodes } from '../../../Utilities';
-export interface IBaseAutoFill {
-
-  /**
-   * The current index of the cursor in the input area. Returns -1 if the input element
-   * is not ready.
-   */
-  cursorLocation: number;
-  /**
-   * A boolean for whether or not there is a value selected in the input area.
-   */
-  isValueSelected: boolean;
-  /**
-   * The current text value that the user has entered.
-   */
-  value: string;
-  /**
-   * The current index of where the selection starts. Returns -1 if the input element
-   * is not ready.
-   */
-  selectionStart: number;
-  /**
-   * the current index of where the selection ends. Returns -1 if the input element
-   * is not ready.
-   */
-  selectionEnd: number;
-  /**
-   * The current input element.
-   */
-  inputElement: HTMLInputElement;
-  /**
-   * Focus the input element.
-   */
-  focus(): void;
-  /**
-   * Clear all text in the input. Sets value to '';
-   */
-  clear(): void;
-}
-
-export interface IBaseAutoFillProps extends
-  React.InputHTMLAttributes<HTMLInputElement | BaseAutoFill> {
-  /**
-   * Gets the compoonent ref.
-   */
-  componentRef?: (componentRef?: IBaseAutoFill) => void;
-
-  /**
-   * The suggested autofill value that will display.
-   */
-  suggestedDisplayValue?: string;
-
-  /**
-   * A callback for when the current input value changes.
-   */
-  onInputValueChange?: (newValue?: string) => void;
-
-  /**
-   * When the user uses left arrow, right arrow, clicks, or deletes text autofill is disabled
-   * Since the user has taken control. It is automatically reenabled when the user enters text and the
-   * cursor is at the end of the text in the input box. This specifies other key presses that will reenabled
-   * autofill.
-   * @default [KeyCodes.down, KeyCodes.up]
-   */
-  enableAutoFillOnKeyPress?: KeyCodes[];
-
-  /**
-   * the default value to be visible
-   */
-  defaultVisibleValue?: string;
-
-  /**
-   * Handler for checking and updating the value if needed
-   *  in componentWillReceiveProps
-   *
-   * @param {IBaseAutoFillProps} defaultVisibleValue - the defaultVisibleValue that got passed
-   *  in to the auto fill's componentWillReceiveProps
-   * @returns {string} - the updated value to set, if needed
-   */
-  updateValueInWillReceiveProps?: () => string | null;
-
-  /**
-   * Handler for checking if the full value of the input should
-   * be seleced in componentDidUpdate
-   *
-   * @returns {boolean} - should the full value of the input be selected?
-   */
-  shouldSelectFullInputValueInComponentDidUpdate?: () => boolean;
-
-  /**
-   * A callback used to modify the input string.
-   */
-  onInputChange?: (value: string) => string;
-}
\ No newline at end of file
+// Deprecated, import directly from the component folder now.
+export * from '../../Autofill/Autofill.types';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index dd4d6a2900bfb..b5473a5469811 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -12,7 +12,7 @@ import { Suggestions } from './Suggestions/Suggestions';
 import { ISuggestionsProps } from './Suggestions/Suggestions.types';
 import { SuggestionsController, ISuggestionModel } from './Suggestions/SuggestionsController';
 import { IBasePicker, IBasePickerProps, ValidationState } from './BasePicker.types';
-import { BaseAutoFill } from './AutoFill/BaseAutoFill';
+import { Autofill } from '../Autofill/Autofill';
 import { IPickerItemProps } from './PickerItem.types';
 import { IPersonaProps } from '../Persona/Persona.types';
 import * as stylesImport from './BasePicker.scss';
@@ -35,7 +35,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   protected selection: Selection;
 
   protected root: HTMLElement;
-  protected input: BaseAutoFill;
+  protected input: Autofill;
   protected focusZone: FocusZone;
   protected suggestionElement: Suggestions<T>;
 
@@ -191,7 +191,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
           <SelectionZone selection={ this.selection } selectionMode={ SelectionMode.multiple }>
             <div className={ css('ms-BasePicker-text', styles.pickerText, this.state.isFocused && styles.inputFocused) } role={ 'list' }>
               { this.renderItems() }
-              { this.canAddItems() && (<BaseAutoFill
+              { this.canAddItems() && (<Autofill
                 { ...inputProps as any }
                 className={ css('ms-BasePicker-input', styles.pickerInput) }
                 ref={ this._resolveRef('input') }
@@ -415,7 +415,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   }
 
   @autobind
-  protected onInputFocus(ev: React.FocusEvent<HTMLInputElement | BaseAutoFill>) {
+  protected onInputFocus(ev: React.FocusEvent<HTMLInputElement | Autofill>) {
     this.setState({ isFocused: true });
     this.selection.setAllSelected(false);
     if (this.input && this.input.value === '' && this.props.onEmptyInputFocus) {
@@ -437,7 +437,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   }
 
   @autobind
-  protected onInputBlur(ev: React.FocusEvent<HTMLInputElement | BaseAutoFill>) {
+  protected onInputBlur(ev: React.FocusEvent<HTMLInputElement | Autofill>) {
     this.setState({ isFocused: false });
   }
 
@@ -700,7 +700,7 @@ export class BasePickerListBelow<T, P extends IBasePickerProps<T>> extends BaseP
             selectionMode={ SelectionMode.multiple }
           >
             <div className={ css('ms-BasePicker-text', styles.pickerText, this.state.isFocused && styles.inputFocused) }>
-              <BaseAutoFill
+              <Autofill
                 { ...inputProps as any }
                 className={ css('ms-BasePicker-input', styles.pickerInput) }
                 ref={ this._resolveRef('input') }

From 36c24d4e085515a0d74f2eb1b1cafd847af67667 Mon Sep 17 00:00:00 2001
From: amyngu <31973030+amyngu@users.noreply.github.com>
Date: Mon, 5 Feb 2018 14:02:41 -0800
Subject: [PATCH 1317/1641] ExtendedPeoplePicker: change persona css (#3884)

* change itemType name, item css

* persona pill css

* render functions for text and persona coin

* changelist
---
 .../personaPill_2018-02-05-18-20.json         |  11 ++
 .../personaPill_2018-02-05-18-20.json         |  11 ++
 .../ExtendedPicker/BaseExtendedPicker.tsx     |   2 +-
 .../PeoplePicker/ExtendedPeoplePicker.tsx     |   9 +-
 .../ExtendedPeoplePicker.Basic.Example.tsx    |  18 +--
 .../examples/PeopleExampleData.ts             |  42 +++++++
 .../FloatingPicker/BaseFloatingPicker.tsx     |   9 +-
 .../BaseFloatingPicker.types.ts               |   6 +-
 .../PeoplePicker/FloatingPeoplePicker.tsx     |   8 +-
 .../PeoplePickerItems/SelectedItemDefault.tsx |   3 +-
 .../FloatingPeoplePicker.Basic.Example.tsx    |  10 +-
 .../BaseSelectedItemsList.tsx                 |   9 +-
 .../SelectedPeopleList/Items/EditingItem.tsx  |  14 ++-
 .../Items/ExtendedSelectedItem.scss           | 103 ++++++++++--------
 .../Items/ExtendedSelectedItem.tsx            |  14 +--
 .../SelectedPeopleList/SelectedPeopleList.tsx |  14 ++-
 .../SelectedPeopleList.Basic.Example.scss     |   4 +
 .../SelectedPeopleList.Basic.Example.tsx      |  27 ++++-
 .../src/components/SelectedItemsList/index.ts |   3 +-
 .../Suggestions/SuggestionsController.ts      |   2 +-
 20 files changed, 221 insertions(+), 98 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/personaPill_2018-02-05-18-20.json
 create mode 100644 common/changes/office-ui-fabric-react/personaPill_2018-02-05-18-20.json
 create mode 100644 packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.scss

diff --git a/common/changes/@uifabric/experiments/personaPill_2018-02-05-18-20.json b/common/changes/@uifabric/experiments/personaPill_2018-02-05-18-20.json
new file mode 100644
index 0000000000000..010a15a1e7e0d
--- /dev/null
+++ b/common/changes/@uifabric/experiments/personaPill_2018-02-05-18-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "change persona pill css",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "amyngu@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/personaPill_2018-02-05-18-20.json b/common/changes/office-ui-fabric-react/personaPill_2018-02-05-18-20.json
new file mode 100644
index 0000000000000..c2bc72015aff6
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/personaPill_2018-02-05-18-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "fix deselect all in suggestionsController",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "amyngu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
index 20520fcac4cc1..a814d81153d81 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
@@ -96,7 +96,6 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
           onKeyDown={ this.onBackspace }
           onCopy={ this.onCopy }
         >
-
           <SelectionZone selection={ this.selection } selectionMode={ SelectionMode.multiple }>
             <div className={ css('ms-BasePicker-text', styles.pickerText) } role={ 'list' }>
               { this.props.headerComponent }
@@ -126,6 +125,7 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
     );
   }
 
+  @autobind
   protected onSelectionChange(): void {
     this.forceUpdate();
   }
diff --git a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.tsx b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.tsx
index e09881c71fca5..11170195a87ee 100644
--- a/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/PeoplePicker/ExtendedPeoplePicker.tsx
@@ -1,19 +1,20 @@
 /* tslint:disable */
-import { IPickerItemProps, ValidationState } from 'office-ui-fabric-react/lib/Pickers';
+import { IPickerItemProps } from 'office-ui-fabric-react/lib/Pickers';
 /* tslint:enable */
 
 import { IExtendedPersonaProps } from '../../../SelectedItemsList';
+import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
 import './ExtendedPeoplePicker.scss';
 import { BaseExtendedPicker } from '../BaseExtendedPicker';
 import { IBaseExtendedPickerProps } from '../BaseExtendedPicker.types';
 
-export interface IPeoplePickerItemProps extends IPickerItemProps<IExtendedPersonaProps & { ValidationState: ValidationState }> {
+export interface IPeoplePickerItemProps extends IPickerItemProps<IExtendedPersonaProps> {
 }
 
-export interface IExtendedPeoplePickerProps extends IBaseExtendedPickerProps<IExtendedPersonaProps> {
+export interface IExtendedPeoplePickerProps extends IBaseExtendedPickerProps<IPersonaProps> {
 }
 
-export class BaseExtendedPeoplePicker extends BaseExtendedPicker<IExtendedPersonaProps, IExtendedPeoplePickerProps> {
+export class BaseExtendedPeoplePicker extends BaseExtendedPicker<IPersonaProps, IExtendedPeoplePickerProps> {
 }
 
 export class ExtendedPeoplePicker extends BaseExtendedPeoplePicker {
diff --git a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
index b8d38b35d3c20..f7e13e84bba91 100644
--- a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
@@ -7,14 +7,14 @@ import {
   autobind
 } from 'office-ui-fabric-react/lib/Utilities';
 import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
-import { IBasePickerSuggestionsProps, ValidationState, SuggestionsController } from 'office-ui-fabric-react/lib/Pickers';
+import { IBasePickerSuggestionsProps, SuggestionsController } from 'office-ui-fabric-react/lib/Pickers';
 import { ExtendedPeoplePicker } from '../PeoplePicker/ExtendedPeoplePicker';
 import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
 import { IPersonaWithMenu } from 'office-ui-fabric-react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.types';
 import { people, mru, groupOne, groupTwo } from './PeopleExampleData';
 import './ExtendedPeoplePicker.Basic.Example.scss';
 import { FloatingPeoplePicker, IBaseFloatingPickerProps } from '../../FloatingPicker';
-import { IBaseSelectedItemsListProps, IExtendedPersonaProps, ISelectedPeopleProps, SelectedPeopleList }
+import { IBaseSelectedItemsListProps, ISelectedPeopleProps, SelectedPeopleList, IExtendedPersonaProps }
   from '../../SelectedItemsList';
 
 export interface IPeoplePickerExampleState {
@@ -36,7 +36,7 @@ const suggestionProps: IBasePickerSuggestionsProps = {
 // tslint:disable-next-line:no-any
 export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeoplePickerExampleState> {
   private _picker: ExtendedPeoplePicker;
-  private _floatingPickerProps: IBaseFloatingPickerProps<IExtendedPersonaProps>;
+  private _floatingPickerProps: IBaseFloatingPickerProps<IPersonaProps>;
   private _selectedItemsListProps: ISelectedPeopleProps;
 
   constructor(props: {}) {
@@ -55,7 +55,7 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
     };
 
     this._floatingPickerProps = {
-      suggestionsController: new SuggestionsController<IExtendedPersonaProps>(),
+      suggestionsController: new SuggestionsController<IPersonaProps>(),
       onResolveSuggestions: this._onFilterChanged,
       getTextFromItem: this._getTextFromItem,
       pickerSuggestionsProps: suggestionProps,
@@ -113,7 +113,7 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
     return <div>TO:</div>;
   }
 
-  private _onRenderFloatingPicker(props: IBaseFloatingPickerProps<IExtendedPersonaProps>): JSX.Element {
+  private _onRenderFloatingPicker(props: IBaseFloatingPickerProps<IPersonaProps>): JSX.Element {
     return (<FloatingPeoplePicker {...props} />);
   }
 
@@ -217,13 +217,13 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
   }
 
   @autobind
-  private _validateInput(input: string): ValidationState {
+  private _validateInput(input: string): boolean {
     if (input.indexOf('@') !== -1) {
-      return ValidationState.valid;
+      return true;
     } else if (input.length > 1) {
-      return ValidationState.warning;
+      return false;
     } else {
-      return ValidationState.invalid;
+      return false;
     }
   }
 
diff --git a/packages/experiments/src/components/ExtendedPicker/examples/PeopleExampleData.ts b/packages/experiments/src/components/ExtendedPicker/examples/PeopleExampleData.ts
index 10564ef8270c9..fc064ccf50ac3 100644
--- a/packages/experiments/src/components/ExtendedPicker/examples/PeopleExampleData.ts
+++ b/packages/experiments/src/components/ExtendedPicker/examples/PeopleExampleData.ts
@@ -11,6 +11,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.online
   },
   {
@@ -21,6 +22,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.busy
   },
   {
@@ -31,6 +33,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'Software Developer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.dnd
   },
   {
@@ -41,6 +44,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'Financial Analyst',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.offline
   },
   {
@@ -51,6 +55,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'Sr. Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.online
   },
   {
@@ -61,6 +66,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'Design Developer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.online
   },
   {
@@ -71,6 +77,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.away
   },
   {
@@ -81,6 +88,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.busy
   },
   {
@@ -91,6 +99,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.dnd
   },
   {
@@ -101,6 +110,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'Software Developer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.offline
   },
   {
@@ -111,6 +121,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'Financial Analyst',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.none
 
   },
@@ -122,6 +133,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'Sr. Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.busy
   },
   {
@@ -132,6 +144,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'Design Developer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.busy
   },
   {
@@ -142,6 +155,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.blocked
   },
   {
@@ -152,6 +166,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'SDE',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.blocked
   },
   {
@@ -162,6 +177,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'SE',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.away
   },
   {
@@ -172,6 +188,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'SDET',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.online
   },
   {
@@ -182,6 +199,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'Senior Manager of SDET',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.offline
   },
   {
@@ -192,6 +210,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'Junior Manager of Software',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.away
   },
   {
@@ -202,6 +221,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.blocked
   },
   {
@@ -212,6 +232,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'Design Developer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.online
   },
   {
@@ -222,6 +243,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.online
   },
   {
@@ -232,6 +254,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'Design Developer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.blocked
   },
   {
@@ -242,6 +265,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.offline
   },
   {
@@ -252,6 +276,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'Design Developer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 3:00pm',
+    isValid: true,
     presence: PersonaPresence.online
   },
   {
@@ -262,6 +287,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 3:00pm',
+    isValid: true,
     presence: PersonaPresence.away
   },
   {
@@ -272,6 +298,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.busy
   },
   {
@@ -282,6 +309,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.online
   },
   {
@@ -292,6 +320,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.busy
   },
   {
@@ -302,6 +331,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.dnd
   },
   {
@@ -312,6 +342,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.blocked
   },
   {
@@ -322,6 +353,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.online
   },
   {
@@ -332,6 +364,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.away
   },
   {
@@ -342,6 +375,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.offline
   },
   {
@@ -352,6 +386,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.busy
   },
   {
@@ -362,6 +397,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.busy
   },
   {
@@ -372,6 +408,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.offline
   },
   {
@@ -382,6 +419,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'UX Designer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.online
   },
   {
@@ -392,6 +430,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'Software Developer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.dnd
   },
   {
@@ -402,6 +441,7 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     secondaryText: 'Software Developer',
     tertiaryText: 'In a meeting',
     optionalText: 'Available at 4:00pm',
+    isValid: true,
     presence: PersonaPresence.online
   },
   {
@@ -409,12 +449,14 @@ export const people: (IExtendedPersonaProps & { key: string | number })[] = [
     imageInitials: 'GO',
     primaryText: 'Group One',
     canExpand: true,
+    isValid: true,
   },
   {
     key: 42,
     imageInitials: 'GT',
     primaryText: 'Group Two',
     canExpand: true,
+    isValid: true,
   },
 ];
 
diff --git a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
index f82f47b2cfcbd..a7da08048a00a 100644
--- a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
+++ b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
@@ -7,7 +7,7 @@ import {
   getRTL
 } from '../../Utilities';
 import { Callout, DirectionalHint } from 'office-ui-fabric-react/lib/Callout';
-import { ValidationState, Suggestions, ISuggestionsProps, SuggestionsController, IBasePickerSuggestionsProps, ISuggestionModel }
+import { Suggestions, ISuggestionsProps, SuggestionsController, IBasePickerSuggestionsProps, ISuggestionModel }
   from 'office-ui-fabric-react/lib/Pickers';
 import { IBaseFloatingPicker, IBaseFloatingPickerProps } from './BaseFloatingPicker.types';
 import * as stylesImport from './BaseFloatingPicker.scss';
@@ -466,16 +466,15 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
   private _onValidateInput(): void {
     if (
       this.props.onValidateInput &&
-      (this.props.onValidateInput as ((input: string) => ValidationState))(this.state.queryString) !==
-      ValidationState.invalid &&
+      (this.props.onValidateInput as ((input: string) => boolean))(this.state.queryString) !== true &&
       this.props.createGenericItem
     ) {
       let itemToConvert = (this.props.createGenericItem as ((
         input: string,
-        ValidationState: ValidationState
+        isValid: boolean
       ) => ISuggestionModel<T>))(
         this.state.queryString,
-        (this.props.onValidateInput as ((input: string) => ValidationState))(this.state.queryString)
+        (this.props.onValidateInput as ((input: string) => boolean))(this.state.queryString)
         );
       this.suggestionStore.createGenericSuggestion(itemToConvert);
       this.completeSuggestion();
diff --git a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts
index a4e9c83f12fea..88669257e1275 100644
--- a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts
+++ b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { ISuggestionModel, ValidationState, IBasePickerSuggestionsProps, SuggestionsController } from 'office-ui-fabric-react/lib/Pickers';
+import { ISuggestionModel, IBasePickerSuggestionsProps, SuggestionsController } from 'office-ui-fabric-react/lib/Pickers';
 import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
 
 export interface IBaseFloatingPicker {
@@ -84,7 +84,7 @@ export interface IBaseFloatingPickerProps<T> extends React.Props<any> {
   /**
    * A function used to validate if raw text entered into the well can be added
    */
-  onValidateInput?: (input: string) => ValidationState;
+  onValidateInput?: (input: string) => boolean;
   /**
    * The text to display while searching for more results in a limited suggestions list
    */
@@ -95,7 +95,7 @@ export interface IBaseFloatingPickerProps<T> extends React.Props<any> {
    */
   createGenericItem?: (
     input: string,
-    ValidationState: ValidationState
+    isValid: boolean
   ) => ISuggestionModel<T>;
 
   /**
diff --git a/packages/experiments/src/components/FloatingPicker/PeoplePicker/FloatingPeoplePicker.tsx b/packages/experiments/src/components/FloatingPicker/PeoplePicker/FloatingPeoplePicker.tsx
index 39bb8945a12fa..de027adbf4790 100644
--- a/packages/experiments/src/components/FloatingPicker/PeoplePicker/FloatingPeoplePicker.tsx
+++ b/packages/experiments/src/components/FloatingPicker/PeoplePicker/FloatingPeoplePicker.tsx
@@ -4,7 +4,7 @@ import { IBaseFloatingPickerProps } from '../BaseFloatingPicker.types';
 import { SuggestionItemNormal } from './PeoplePickerItems/SuggestionItemDefault';
 import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
 import './PeoplePicker.scss';
-import { ValidationState, IBasePickerSuggestionsProps, ISuggestionModel } from 'office-ui-fabric-react/lib/Pickers';
+import { IBasePickerSuggestionsProps, ISuggestionModel } from 'office-ui-fabric-react/lib/Pickers';
 
 export interface IPeopleFloatingPickerProps extends IBaseFloatingPickerProps<IPersonaProps> {
 }
@@ -21,16 +21,16 @@ export class FloatingPeoplePicker extends BaseFloatingPeoplePicker {
   };
 }
 
-export function createGenericItem(name: string, currentValidationState: ValidationState): ISuggestionModel<IPersonaProps> {
+export function createGenericItem(name: string, isValid: boolean): ISuggestionModel<IPersonaProps> {
   // tslint:disable-next-line:no-any
   let personaToConvert: any = {
     key: name,
     primaryText: name,
     imageInitials: '!',
-    ValidationState: currentValidationState
+    isValid: isValid
   };
 
-  if (currentValidationState !== ValidationState.warning) {
+  if (!isValid) {
     personaToConvert.imageInitials = getInitials(name, getRTL());
   }
 
diff --git a/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx b/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
index 9ef6684af2a67..1799e953076ad 100644
--- a/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
+++ b/packages/experiments/src/components/FloatingPicker/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
@@ -4,7 +4,6 @@ import * as React from 'react';
 import { css, getId } from '../../../../Utilities';
 import { Persona, PersonaSize, PersonaPresence } from 'office-ui-fabric-react/lib/Persona';
 import { IPeoplePickerItemProps } from '../../../ExtendedPicker';
-import { ValidationState } from 'office-ui-fabric-react/lib/Pickers';
 import { IconButton } from 'office-ui-fabric-react/lib/Button';
 import * as stylesImport from './PickerItemsDefault.scss';
 // tslint:disable-next-line:no-any
@@ -34,7 +33,7 @@ export const SelectedItemDefault: (props: IPeoplePickerItemProps) => JSX.Element
         'ms-PickerPersona-container',
         styles.personaContainer,
         { ['is-selected ' + styles.personaContainerIsSelected]: selected },
-        { ['is-invalid ' + styles.validationError]: item.ValidationState === ValidationState.warning }
+        { ['is-invalid ' + styles.validationError]: !item.isValid }
       ) }
       data-is-focusable={ true }
       data-is-sub-focuszone={ true }
diff --git a/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
index 2c27db626b9a4..6ec0079517a46 100644
--- a/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
+++ b/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
@@ -7,7 +7,7 @@ import {
   autobind
 } from 'office-ui-fabric-react/lib/Utilities';
 import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
-import { IBasePickerSuggestionsProps, ValidationState, SuggestionsController } from 'office-ui-fabric-react/lib/Pickers';
+import { IBasePickerSuggestionsProps, SuggestionsController } from 'office-ui-fabric-react/lib/Pickers';
 import { IBaseFloatingPicker } from '../../BaseFloatingPicker.types';
 import { FloatingPeoplePicker } from '../FloatingPeoplePicker';
 import { IPersonaWithMenu } from 'office-ui-fabric-react/lib/components/pickers/PeoplePicker/PeoplePickerItems/PeoplePickerItem.types';
@@ -161,13 +161,13 @@ export class FloatingPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
   }
 
   @autobind
-  private _validateInput(input: string): ValidationState {
+  private _validateInput(input: string): boolean {
     if (input.indexOf('@') !== -1) {
-      return ValidationState.valid;
+      return true;
     } else if (input.length > 1) {
-      return ValidationState.warning;
+      return false;
     } else {
-      return ValidationState.invalid;
+      return false;
     }
   }
 }
diff --git a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx
index 3e4791a6bceab..b288ae1690b02 100644
--- a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx
@@ -35,7 +35,9 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
     };
 
     // Create a new selection if one is not specified
-    this.selection = this.props.selection ? this.props.selection as Selection : new Selection({ onSelectionChanged: this.forceUpdate });
+    this.selection = this.props.selection
+      ? this.props.selection as Selection
+      : new Selection({ onSelectionChanged: this.onSelectionChanged });
   }
 
   public get items(): T[] {
@@ -130,6 +132,11 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
     }));
   }
 
+  @autobind
+  protected onSelectionChanged(): void {
+    this.forceUpdate();
+  }
+
   protected onChange(items?: T[]): void {
     if (this.props.onChange) {
       (this.props.onChange as (items?: T[]) => void)(items);
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx
index 6ef143f7e5af0..17d6bb7b45502 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx
@@ -6,6 +6,7 @@ import { FloatingPeoplePicker, IBaseFloatingPickerProps } from '../../../../Floa
 import { ISelectedPeopleItemProps } from '../SelectedPeopleList';
 import { IExtendedPersonaProps } from '../SelectedPeopleList';
 import { IPeoplePickerItemState } from './ExtendedSelectedItem';
+import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
 
 import * as stylesImport from './EditingItem.scss';
 
@@ -15,8 +16,8 @@ const styles: any = stylesImport;
 export interface IEditingSelectedPeopleItemProps extends ISelectedPeopleItemProps {
   // tslint:disable-next-line:no-any
   onEditingComplete: (oldItem: any, newItem: any) => void;
-  onRenderFloatingPicker?: (props: IBaseFloatingPickerProps<IExtendedPersonaProps>) => JSX.Element;
-  floatingPickerProps?: IBaseFloatingPickerProps<IExtendedPersonaProps>;
+  onRenderFloatingPicker?: (props: IBaseFloatingPickerProps<IPersonaProps>) => JSX.Element;
+  floatingPickerProps?: IBaseFloatingPickerProps<IPersonaProps>;
   getEditingItemText?: (item: IExtendedPersonaProps) => string;
 }
 
@@ -34,6 +35,7 @@ export class EditingItem extends BaseComponent<IEditingSelectedPeopleItemProps,
     this._floatingPickerProps = this.props.floatingPickerProps as IBaseFloatingPickerProps<IExtendedPersonaProps>;
   }
 
+  @autobind
   public componentDidMount(): void {
     let getEditingItemText = this.props.getEditingItemText as (item: IExtendedPersonaProps) => string;
     let itemText = getEditingItemText(this.props.item);
@@ -69,7 +71,7 @@ export class EditingItem extends BaseComponent<IEditingSelectedPeopleItemProps,
   private _renderEditingSuggestions(): JSX.Element {
     let onRenderFloatingPicker = this._onRenderFloatingPicker;
     return (onRenderFloatingPicker({
-      componentRef: this._resolveRef('editingFloatingPicker'),
+      componentRef: this._resolveRef('_editingFloatingPicker'),
       onChange: this._onSuggestionSelected,
       inputElement: this._editingInput,
       selectedItems: [],
@@ -90,8 +92,10 @@ export class EditingItem extends BaseComponent<IEditingSelectedPeopleItemProps,
   }
 
   @autobind
-  private _onInputBlur(): void {
-    this._editingFloatingPicker.forceResolveSuggestion();
+  private _onInputBlur(ev: React.FocusEvent<HTMLElement>): void {
+    if (ev.relatedTarget === null || (ev.relatedTarget as HTMLElement).className.indexOf('ms-SearchMore-button') === -1) {
+      this._editingFloatingPicker.forceResolveSuggestion();
+    }
   }
 
   @autobind
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.scss b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.scss
index 322c8b7bcd3c9..0c9387646b656 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.scss
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.scss
@@ -5,24 +5,57 @@
   border-radius: 15px;
   display: inline-flex;
   align-items: center;
-  background: $ms-color-neutralLighter;
+  background: $ms-color-themeLighterAlt;
   margin: 4px;
   cursor: default;
   user-select: none;
-  max-width: 300px;
   vertical-align: middle;
   position: relative;
 
+  // Setting global values here to override persona's normal behavior specifically in this selected variation
+  :global(.ms-Persona-primaryText) {
+    color: $ms-color-themeDark;
+    @include ms-font-m;
+
+    &.hover {
+      color: $ms-color-themeDark;
+    }
+
+    @include high-contrast {
+      color: HighlightText;
+    }
+  }
+
+  .actionButton {
+    &:hover {
+      background: $ms-color-themeLight;
+    }
+
+    :global(.ms-Button-icon) {
+      color: $ms-color-themeDark;
+
+      @include high-contrast {
+        color: HighlightText;
+      }
+    }
+  }
+
   &:hover {
-    background: $ms-color-neutralLight;
+    background: $ms-color-themeLighter;
 
-    .removeButton {
-      color: $ms-color-neutralPrimary;
+    // Setting global values here to override persona's normal behavior specifically in this selected variation
+    :global(.ms-Persona-primaryText) {
+      color: $ms-color-themeDark;
+      @include ms-font-m;
+
+      @include high-contrast {
+        color: HighlightText;
+      }
     }
   }
 
   &.personaContainerIsSelected {
-    background: $ms-color-blue;
+    background: $ms-color-themePrimary;
 
     // Setting global values here to override persona's normal behavior specifically in this selected variation
     :global(.ms-Persona-primaryText) {
@@ -34,18 +67,19 @@
     }
 
     .actionButton {
+      color: $ms-color-white;
+
       :global(.ms-Button-icon) {
-        color: $ms-color-white;
+        color: $ms-color-themeDark;
+
+        &:hover {
+          background: $ms-color-themeDark;
+        }
 
         @include high-contrast {
           color: HighlightText;
         }
       }
-
-      &:hover {
-        color: $ms-color-white;
-        background: $ms-color-themeDark;
-      }
     }
 
     @include high-contrast {
@@ -58,26 +92,12 @@
   &.validationError {
     // Setting global values here to override persona's normal behavior in the error version
     :global(.ms-Persona-primaryText) {
-      color: $ms-color-redDark;
-      border-bottom: 2px dotted $ms-color-redDark;
+      color: $ms-color-red;
     }
 
     :global(.ms-Persona-initials) {
       font-size: 20px;
     }
-
-    &.personaContainerIsSelected {
-      background: $ms-color-redDark;
-
-      :global(.ms-Persona-primaryText) {
-        color: $ms-color-white;
-        border-bottom: 2px dotted $ms-color-white;
-      }
-
-      .removeButton:hover {
-        background: $ms-color-red;
-      }
-    }
   }
 
   @include high-contrast {
@@ -96,33 +116,28 @@
   .removeButton {
     border-radius: 15px;
     flex: 0 0 auto;
-    width: 28px;
-    height: 28px;
-    flex-basis: 28px;
-
-    &:hover {
-      background: $ms-color-neutralTertiaryAlt;
-      color: $ms-color-neutralDark;
-    }
+    width: 33px;
+    height: 33px;
+    flex-basis: 32px;
   }
 
   .expandButton {
     border-radius: 15px 0px 0px 15px;
-    height: 28px;
-    flex-basis: 28px;
-    padding-right: 12px;
+    height: 33px;
+    width: 44px;
+    padding-right: 16px;
     position: inherit;
-    margin-right: -8px;
-
-    &:hover {
-      background: $ms-color-neutralTertiaryAlt;
-      color: $ms-color-neutralDark;
-    }
+    display: flex;
+    margin-right: -17px;
   }
 
   .personaWrapper {
     position: relative;
     display: inherit;
+
+    :global(.ms-Persona-details) {
+      padding: 0px 8px;
+    }
   }
 
   .personaDetails {
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx
index f2802a5602b28..8555a580eea3e 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx
@@ -2,8 +2,7 @@
 import * as React from 'react';
 /* tslint:enable */
 import { BaseComponent, autobind, css, getId } from '../../../../Utilities';
-import { Persona, PersonaSize, PersonaPresence } from 'office-ui-fabric-react/lib/Persona';
-import { ValidationState } from 'office-ui-fabric-react/lib/Pickers';
+import { Persona, PersonaSize } from 'office-ui-fabric-react/lib/Persona';
 import { ISelectedPeopleItemProps } from '../SelectedPeopleList';
 import { IconButton } from 'office-ui-fabric-react/lib/Button';
 import { ContextualMenu, DirectionalHint } from 'office-ui-fabric-react/lib/ContextualMenu';
@@ -40,7 +39,7 @@ export class ExtendedSelectedItem extends BaseComponent<ISelectedPeopleItemProps
           'ms-PickerPersona-container',
           styles.personaContainer,
           { ['is-selected ' + styles.personaContainerIsSelected]: selected },
-          { ['is-invalid ' + styles.validationError]: item.ValidationState === ValidationState.warning }
+          { ['is-invalid ' + styles.validationError]: !item.isValid }
         ) }
         data-is-focusable={ true }
         data-is-sub-focuszone={ true }
@@ -52,7 +51,7 @@ export class ExtendedSelectedItem extends BaseComponent<ISelectedPeopleItemProps
         <div hidden={ !item.canExpand || onExpandItem === undefined }>
           <IconButton
             onClick={ this.onClickIconButton(onExpandItem) }
-            iconProps={ { iconName: 'Add', style: { fontSize: '12px' } } }
+            iconProps={ { iconName: 'Add', style: { fontSize: '14px' } } }
             className={ css('ms-PickerItem-removeButton', styles.expandButton, styles.actionButton) }
             ariaLabel={ removeButtonAriaLabel }
           />
@@ -64,13 +63,14 @@ export class ExtendedSelectedItem extends BaseComponent<ISelectedPeopleItemProps
           >
             <Persona
               { ...item }
-              presence={ item.presence !== undefined ? item.presence : PersonaPresence.none }
-              size={ PersonaSize.size28 }
+              onRenderCoin={ this.props.renderPersonaCoin }
+              onRenderPrimaryText={ this.props.renderPrimaryText }
+              size={ PersonaSize.size32 }
             />
           </div>
           <IconButton
             onClick={ this.onClickIconButton(onRemoveItem) }
-            iconProps={ { iconName: 'Cancel', style: { fontSize: '12px' } } }
+            iconProps={ { iconName: 'Cancel', style: { fontSize: '14px' } } }
             className={ css('ms-PickerItem-removeButton', styles.removeButton, styles.actionButton) }
             ariaLabel={ removeButtonAriaLabel }
           />
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
index ade17531c2ea3..28a951de54aa6 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
@@ -1,24 +1,28 @@
 /* tslint:disable */
 import * as React from 'react';
-import { ValidationState } from 'office-ui-fabric-react/lib/Pickers';
 /* tslint:enable */
 import { BaseSelectedItemsList } from '../BaseSelectedItemsList';
 import { IBaseSelectedItemsListProps, ISelectedItemProps } from '../BaseSelectedItemsList.types';
 import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
 import { ExtendedSelectedItem } from './Items/ExtendedSelectedItem';
-import { autobind } from '../../../Utilities';
+import { autobind, IRenderFunction } from '../../../Utilities';
 import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
 import { IBaseFloatingPickerProps } from '../../../FloatingPicker';
 import { EditingItem } from './Items/EditingItem';
 
 export interface IExtendedPersonaProps extends IPersonaProps {
+  isValid: boolean;
+  blockRecipientRemoval?: boolean;
+  shouldBlockSelection?: boolean;
   canExpand?: boolean;
   isEditing?: boolean;
 }
 
-export interface ISelectedPeopleItemProps extends ISelectedItemProps<IExtendedPersonaProps & { ValidationState: ValidationState }> {
+export interface ISelectedPeopleItemProps extends ISelectedItemProps<IExtendedPersonaProps> {
   onExpandItem?: () => void;
   menuItems: IContextualMenuItem[];
+  renderPersonaCoin?: IRenderFunction<IPersonaProps>;
+  renderPrimaryText?: IRenderFunction<IPersonaProps>;
 }
 
 export interface ISelectedPeopleProps extends IBaseSelectedItemsListProps<IExtendedPersonaProps> {
@@ -27,8 +31,8 @@ export interface ISelectedPeopleProps extends IBaseSelectedItemsListProps<IExten
   copyMenuItemText?: string;
   editMenuItemText?: string;
   getEditingItemText?: (item: IExtendedPersonaProps) => string;
-  onRenderFloatingPicker?: (props: IBaseFloatingPickerProps<IExtendedPersonaProps>) => JSX.Element;
-  floatingPickerProps?: IBaseFloatingPickerProps<IExtendedPersonaProps>;
+  onRenderFloatingPicker?: (props: IBaseFloatingPickerProps<IPersonaProps>) => JSX.Element;
+  floatingPickerProps?: IBaseFloatingPickerProps<IPersonaProps>;
 }
 
 export class BasePeopleSelectedItemsList extends BaseSelectedItemsList<IExtendedPersonaProps, ISelectedPeopleProps> {
diff --git a/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.scss b/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.scss
new file mode 100644
index 0000000000000..8691a2ef04e0e
--- /dev/null
+++ b/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.scss
@@ -0,0 +1,4 @@
+.persona {
+  fontSize: '14px';
+  verticalAlign: '-webkit-baseline-middle'
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx b/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
index e75b9d012cab0..245f2b544db3e 100644
--- a/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
@@ -8,8 +8,13 @@ import {
 import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
 import { people, groupOne, groupTwo } from '../../ExtendedPicker';
 import 'office-ui-fabric-react/lib/components/Pickers/PeoplePicker/examples/PeoplePicker.Types.Example.scss';
-import { IExtendedPersonaProps, SelectedPeopleList } from '../SelectedPeopleList/SelectedPeopleList';
+import { IExtendedPersonaProps, SelectedPeopleList, ISelectedPeopleItemProps } from '../SelectedPeopleList/SelectedPeopleList';
+import { ExtendedSelectedItem } from '../SelectedPeopleList/Items/ExtendedSelectedItem';
 import { Selection } from 'office-ui-fabric-react/lib/Selection';
+import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
+import { Icon } from 'office-ui-fabric-react/lib/Icon';
+
+import * as styles from './SelectedPeopleList.Basic.Example.scss';
 
 export class PeopleSelectedItemsListExample extends BaseComponent<{}, {}> {
   private _selectionList: SelectedPeopleList;
@@ -41,6 +46,26 @@ export class PeopleSelectedItemsListExample extends BaseComponent<{}, {}> {
         copyMenuItemText={ 'Copy' }
         removeMenuItemText={ 'Remove' }
         selection={ this.selection }
+        onRenderItem={ this._onRenderItem }
+      />
+    );
+  }
+
+  @autobind
+  private _onRenderItem(props: ISelectedPeopleItemProps): JSX.Element {
+    return (
+      <ExtendedSelectedItem
+        {...props}
+        renderPersonaCoin={ this._renderPersonaElement }
+      />
+    );
+  }
+
+  private _renderPersonaElement(props: IPersonaProps, defaultRender: (props?: IPersonaProps) => JSX.Element | null): JSX.Element {
+    return (
+      <Icon
+        iconName={ 'Contact' }
+        className={ styles.persona }
       />
     );
   }
diff --git a/packages/experiments/src/components/SelectedItemsList/index.ts b/packages/experiments/src/components/SelectedItemsList/index.ts
index d89176bdc78f0..cd2a173d7958d 100644
--- a/packages/experiments/src/components/SelectedItemsList/index.ts
+++ b/packages/experiments/src/components/SelectedItemsList/index.ts
@@ -1,3 +1,4 @@
 export * from './BaseSelectedItemsList.types';
 export * from './BaseSelectedItemsList';
-export * from './SelectedPeopleList/SelectedPeopleList';
\ No newline at end of file
+export * from './SelectedPeopleList/SelectedPeopleList';
+export * from './SelectedPeopleList/Items/ExtendedSelectedItem';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
index d6f1ddae8ddaf..d35720a8a6c71 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
@@ -97,8 +97,8 @@ export class SuggestionsController<T> {
   }
 
   public deselectAllSuggestions(): void {
-    this.currentIndex = -1;
     this.suggestions[this.currentIndex].selected = false;
+    this.currentIndex = -1;
   }
 
   public setSelectedSuggestion(index: number): void {

From 857b101451a04bb20ee88d08b36511485939005d Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Mon, 5 Feb 2018 22:51:26 -0800
Subject: [PATCH 1318/1641] [provideUnits] Ignore line-height units (#3886)

* [provideUnits] Ignore units for line-height

* Change file
---
 .../law-ignoreLineHeightUnits_2018-02-06-01-03.json   | 11 +++++++++++
 .../merge-styles/src/transforms/provideUnits.test.ts  | 10 ++++++++++
 packages/merge-styles/src/transforms/provideUnits.ts  |  1 +
 3 files changed, 22 insertions(+)
 create mode 100644 common/changes/@uifabric/merge-styles/law-ignoreLineHeightUnits_2018-02-06-01-03.json

diff --git a/common/changes/@uifabric/merge-styles/law-ignoreLineHeightUnits_2018-02-06-01-03.json b/common/changes/@uifabric/merge-styles/law-ignoreLineHeightUnits_2018-02-06-01-03.json
new file mode 100644
index 0000000000000..644fe0498548d
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/law-ignoreLineHeightUnits_2018-02-06-01-03.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "[provideUnits] Add line-height to ignore",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/merge-styles/src/transforms/provideUnits.test.ts b/packages/merge-styles/src/transforms/provideUnits.test.ts
index e45391fc0d009..faec99189df8b 100644
--- a/packages/merge-styles/src/transforms/provideUnits.test.ts
+++ b/packages/merge-styles/src/transforms/provideUnits.test.ts
@@ -58,4 +58,14 @@ describe('provideUnits', () => {
     expect(testSet).toEqual(['opacity', '0']);
   });
 
+  it('ignores line-height', () => {
+    const testSet = [
+      'line-height',
+      1
+    ];
+
+    provideUnits(testSet, 0);
+
+    expect(testSet).toEqual(['line-height', '1']);
+  });
 });
\ No newline at end of file
diff --git a/packages/merge-styles/src/transforms/provideUnits.ts b/packages/merge-styles/src/transforms/provideUnits.ts
index 2d2fe1e018988..44ed365d77a93 100644
--- a/packages/merge-styles/src/transforms/provideUnits.ts
+++ b/packages/merge-styles/src/transforms/provideUnits.ts
@@ -5,6 +5,7 @@ const NON_PIXEL_NUMBER_PROPS = [
   'flex',
   'flex-grow',
   'flex-shrink',
+  'line-height',
   'opacity',
   'order',
   'z-index',

From 9e5eaed998fc7bae43f437bd2487a2de05a222db Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 6 Feb 2018 11:14:36 +0000
Subject: [PATCH 1319/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...ct-move-baseautofill_2018-02-02-23-42.json | 11 -------
 .../personaPill_2018-02-05-18-20.json         | 11 -------
 ...gnoreLineHeightUnits_2018-02-06-01-03.json | 11 -------
 ...ct-move-baseautofill_2018-02-02-23-42.json | 11 -------
 .../personaPill_2018-02-05-18-20.json         | 11 -------
 ...iaDescribedByForRows_2018-01-23-11-35.json | 11 -------
 packages/experiments/CHANGELOG.json           | 26 ++++++++++++++++
 packages/experiments/CHANGELOG.md             | 13 +++++++-
 packages/experiments/package.json             |  4 +--
 .../jest-serializer-merge-styles/package.json |  2 +-
 packages/merge-styles/CHANGELOG.json          | 14 +++++++++
 packages/merge-styles/CHANGELOG.md            |  9 +++++-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 31 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 14 ++++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/package.json                 |  2 +-
 packages/utilities/package.json               |  2 +-
 scripts/package.json                          |  2 +-
 24 files changed, 118 insertions(+), 83 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/joschect-move-baseautofill_2018-02-02-23-42.json
 delete mode 100644 common/changes/@uifabric/experiments/personaPill_2018-02-05-18-20.json
 delete mode 100644 common/changes/@uifabric/merge-styles/law-ignoreLineHeightUnits_2018-02-06-01-03.json
 delete mode 100644 common/changes/office-ui-fabric-react/joschect-move-baseautofill_2018-02-02-23-42.json
 delete mode 100644 common/changes/office-ui-fabric-react/personaPill_2018-02-05-18-20.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-akashperfect-DetailsList-AddingAriaDescribedByForRows_2018-01-23-11-35.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 8951153cf1c2d..7818339787a83 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.46.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.47.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 47e223913e7fb..082e7be177809 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.45.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.47.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index e3505904309cd..0858d09f23c0c 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.45.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.47.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 66c2f41b20f56..8d66ea9c0e243 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.45.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.47.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index f34feafac2978..206e2a459e4ee 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.45.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.47.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/@uifabric/experiments/joschect-move-baseautofill_2018-02-02-23-42.json b/common/changes/@uifabric/experiments/joschect-move-baseautofill_2018-02-02-23-42.json
deleted file mode 100644
index e66e3ac2c6dc5..0000000000000
--- a/common/changes/@uifabric/experiments/joschect-move-baseautofill_2018-02-02-23-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "BasePicker: Use correct autofillnow",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/personaPill_2018-02-05-18-20.json b/common/changes/@uifabric/experiments/personaPill_2018-02-05-18-20.json
deleted file mode 100644
index 010a15a1e7e0d..0000000000000
--- a/common/changes/@uifabric/experiments/personaPill_2018-02-05-18-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "change persona pill css",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "amyngu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/law-ignoreLineHeightUnits_2018-02-06-01-03.json b/common/changes/@uifabric/merge-styles/law-ignoreLineHeightUnits_2018-02-06-01-03.json
deleted file mode 100644
index 644fe0498548d..0000000000000
--- a/common/changes/@uifabric/merge-styles/law-ignoreLineHeightUnits_2018-02-06-01-03.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "[provideUnits] Add line-height to ignore",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/joschect-move-baseautofill_2018-02-02-23-42.json b/common/changes/office-ui-fabric-react/joschect-move-baseautofill_2018-02-02-23-42.json
deleted file mode 100644
index 4f65b469aa918..0000000000000
--- a/common/changes/office-ui-fabric-react/joschect-move-baseautofill_2018-02-02-23-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "BaseAutofill: Move to it's own component",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/personaPill_2018-02-05-18-20.json b/common/changes/office-ui-fabric-react/personaPill_2018-02-05-18-20.json
deleted file mode 100644
index c2bc72015aff6..0000000000000
--- a/common/changes/office-ui-fabric-react/personaPill_2018-02-05-18-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "fix deselect all in suggestionsController",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "amyngu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-akashperfect-DetailsList-AddingAriaDescribedByForRows_2018-01-23-11-35.json b/common/changes/office-ui-fabric-react/users-akashperfect-DetailsList-AddingAriaDescribedByForRows_2018-01-23-11-35.json
deleted file mode 100644
index 6c6b4c4c3e17e..0000000000000
--- a/common/changes/office-ui-fabric-react/users-akashperfect-DetailsList-AddingAriaDescribedByForRows_2018-01-23-11-35.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: Adding optional callback aria-describedby for each item in DetailsList",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "akashperfect@gmail.com"
-}
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 3c41749f11535..807c304c188d2 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.18.0",
+      "tag": "@uifabric/experiments_v5.18.0",
+      "date": "Tue, 06 Feb 2018 11:14:36 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "92c237d5804d8864ed44310ecb5ed93e835554e7",
+            "comment": "BasePicker: Use correct autofillnow"
+          }
+        ],
+        "minor": [
+          {
+            "author": "amyngu <31973030+amyngu@users.noreply.github.com>",
+            "commit": "36c24d4e085515a0d74f2eb1b1cafd847af67667",
+            "comment": "change persona pill css"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.45.3 <6.0.0` to `>=5.47.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.17.0",
       "tag": "@uifabric/experiments_v5.17.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index f1e74cc62e6ca..c0cd5eb46fa38 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Fri, 02 Feb 2018 11:24:16 GMT and should not be manually modified.
+This log was last generated on Tue, 06 Feb 2018 11:14:36 GMT and should not be manually modified.
+
+## 5.18.0
+Tue, 06 Feb 2018 11:14:36 GMT
+
+### Minor changes
+
+- change persona pill css
+
+### Patches
+
+- BasePicker: Use correct autofillnow
 
 ## 5.17.0
 Fri, 02 Feb 2018 11:24:16 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 63631ba3fecc3..6465019771703 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.17.0",
+  "version": "5.18.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.45.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.47.0 <6.0.0",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/jest-serializer-merge-styles/package.json b/packages/jest-serializer-merge-styles/package.json
index 6726de0dcab0e..6eed5c6475a57 100644
--- a/packages/jest-serializer-merge-styles/package.json
+++ b/packages/jest-serializer-merge-styles/package.json
@@ -24,6 +24,6 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/merge-styles": ">=5.11.0 <6.0.0"
+    "@uifabric/merge-styles": ">=5.11.1 <6.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index 43bf929efe821..f60c89511b023 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.11.1",
+      "tag": "@uifabric/merge-styles_v5.11.1",
+      "date": "Tue, 06 Feb 2018 11:14:36 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "857b101451a04bb20ee88d08b36511485939005d",
+            "comment": "[provideUnits] Add line-height to ignore"
+          }
+        ]
+      }
+    },
     {
       "version": "5.11.0",
       "tag": "@uifabric/merge-styles_v5.11.0",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index 93b7272d36580..ee2b9d9ae83d3 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Thu, 25 Jan 2018 11:23:06 GMT and should not be manually modified.
+This log was last generated on Tue, 06 Feb 2018 11:14:36 GMT and should not be manually modified.
+
+## 5.11.1
+Tue, 06 Feb 2018 11:14:36 GMT
+
+### Patches
+
+- [provideUnits] Add line-height to ignore
 
 ## 5.11.0
 Thu, 25 Jan 2018 11:23:06 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index 2990935f87fed..ff80814be7ee2 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.11.0",
+  "version": "5.11.1",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 6d8caa415d360..7365436a76b64 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,37 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.47.0",
+      "tag": "office-ui-fabric-react_v5.47.0",
+      "date": "Tue, 06 Feb 2018 11:14:36 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "92c237d5804d8864ed44310ecb5ed93e835554e7",
+            "comment": "BaseAutofill: Move to it's own component"
+          }
+        ],
+        "patch": [
+          {
+            "author": "amyngu <31973030+amyngu@users.noreply.github.com>",
+            "commit": "36c24d4e085515a0d74f2eb1b1cafd847af67667",
+            "comment": "fix deselect all in suggestionsController"
+          },
+          {
+            "author": "akashperfect <akashperfect@gmail.com>",
+            "commit": "d98ba978273b040546a36cc8144b8aa961235235",
+            "comment": "DetailsList: Adding optional callback aria-describedby for each item in DetailsList"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.11.0 <6.0.0` to `>=5.11.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.46.0",
       "tag": "office-ui-fabric-react_v5.46.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 842cd7400767a..6a8259b845b0c 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,18 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 05 Feb 2018 11:24:23 GMT and should not be manually modified.
+This log was last generated on Tue, 06 Feb 2018 11:14:36 GMT and should not be manually modified.
+
+## 5.47.0
+Tue, 06 Feb 2018 11:14:36 GMT
+
+### Minor changes
+
+- BaseAutofill: Move to it's own component
+
+### Patches
+
+- fix deselect all in suggestionsController
+- DetailsList: Adding optional callback aria-describedby for each item in DetailsList
 
 ## 5.46.0
 Mon, 05 Feb 2018 11:24:23 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 3d95dd7df1382..346126014e89d 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.46.0",
+  "version": "5.47.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -49,7 +49,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
-    "@uifabric/merge-styles": ">=5.11.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.11.1 <6.0.0",
     "@uifabric/styling": ">=5.17.0 <6.0.0",
     "@uifabric/utilities": ">=5.10.0 <6.0.0",
     "prop-types": "^15.5.10",
diff --git a/packages/styling/package.json b/packages/styling/package.json
index a4f3f7607adc4..9d8b12ed9b279 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -28,7 +28,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/utilities": ">=5.10.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.11.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.11.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index b633f3c5795ac..33c909f5661bf 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -36,7 +36,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/merge-styles": ">=5.11.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.11.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/scripts/package.json b/scripts/package.json
index 1b2a4ceeec5cd..54d906ff19f31 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -11,7 +11,7 @@
     "@microsoft/api-extractor": "^4.2.6",
     "@microsoft/load-themed-styles": "^1.7.13",
     "@microsoft/loader-load-themed-styles": "^1.6.0",
-    "@uifabric/merge-styles": ">=5.11.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.11.1 <6.0.0",
     "autoprefixer": "^7.1.5",
     "awesome-typescript-loader": "^3.2.3",
     "bundlesize": "^0.15.2",

From d963888b02557a332d347520a44105c00b936d2b Mon Sep 17 00:00:00 2001
From: Mike Wheaton <miwhea@microsoft.com>
Date: Tue, 6 Feb 2018 09:03:10 -0800
Subject: [PATCH 1320/1641] Revert "[provideUnits] Ignore line-height units"
 (#3892)

* Revert "Applying package updates."

This reverts commit 9e5eaed998fc7bae43f437bd2487a2de05a222db.

* Revert "[provideUnits] Ignore line-height units (#3886)"

This reverts commit 857b101451a04bb20ee88d08b36511485939005d.
---
 .../merge-styles/src/transforms/provideUnits.test.ts   | 10 ----------
 packages/merge-styles/src/transforms/provideUnits.ts   |  1 -
 2 files changed, 11 deletions(-)

diff --git a/packages/merge-styles/src/transforms/provideUnits.test.ts b/packages/merge-styles/src/transforms/provideUnits.test.ts
index faec99189df8b..e45391fc0d009 100644
--- a/packages/merge-styles/src/transforms/provideUnits.test.ts
+++ b/packages/merge-styles/src/transforms/provideUnits.test.ts
@@ -58,14 +58,4 @@ describe('provideUnits', () => {
     expect(testSet).toEqual(['opacity', '0']);
   });
 
-  it('ignores line-height', () => {
-    const testSet = [
-      'line-height',
-      1
-    ];
-
-    provideUnits(testSet, 0);
-
-    expect(testSet).toEqual(['line-height', '1']);
-  });
 });
\ No newline at end of file
diff --git a/packages/merge-styles/src/transforms/provideUnits.ts b/packages/merge-styles/src/transforms/provideUnits.ts
index 44ed365d77a93..2d2fe1e018988 100644
--- a/packages/merge-styles/src/transforms/provideUnits.ts
+++ b/packages/merge-styles/src/transforms/provideUnits.ts
@@ -5,7 +5,6 @@ const NON_PIXEL_NUMBER_PROPS = [
   'flex',
   'flex-grow',
   'flex-shrink',
-  'line-height',
   'opacity',
   'order',
   'z-index',

From 33f7c4d1d055f123cbf7237adc44e231b7efca1f Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Tue, 6 Feb 2018 14:30:48 -0800
Subject: [PATCH 1321/1641] Remove duplicate export from button index (#3899)

* Remove duplicate command button export

* Rush change
---
 .../chrisgo-duplicate-export_2018-02-06-21-59.json    | 11 +++++++++++
 .../src/components/Button/index.ts                    |  1 -
 2 files changed, 11 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/chrisgo-duplicate-export_2018-02-06-21-59.json

diff --git a/common/changes/office-ui-fabric-react/chrisgo-duplicate-export_2018-02-06-21-59.json b/common/changes/office-ui-fabric-react/chrisgo-duplicate-export_2018-02-06-21-59.json
new file mode 100644
index 0000000000000..fdb76b2804a33
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/chrisgo-duplicate-export_2018-02-06-21-59.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Remove duplicate export of command button from the button index",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/index.ts b/packages/office-ui-fabric-react/src/components/Button/index.ts
index 1a08c6eb8c842..4bbc372625709 100644
--- a/packages/office-ui-fabric-react/src/components/Button/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/index.ts
@@ -6,7 +6,6 @@ export * from './CommandBarButton/CommandBarButton';
 export * from './CommandButton/CommandButton';
 export * from './CompoundButton/CompoundButton';
 export * from './DefaultButton/DefaultButton';
-export * from './CommandButton/CommandButton';
 export * from './MessageBarButton/MessageBarButton';
 export * from './PrimaryButton/PrimaryButton';
 export * from './IconButton/IconButton';
\ No newline at end of file

From d121208b61c93811909fb69d2ba8d104c3531769 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 6 Feb 2018 21:24:34 -0800
Subject: [PATCH 1322/1641] SearchBox nullref fix (#3887)

* Updates in rtlify and searchbox.

* Adding changes.

* Updates to tests.

* Updating snapshot.

* Updating the setting of rtl for mergeStyles.

* Updating consts and comments.
---
 .../merge-fix_2018-02-06-06-06.json           | 11 ++++
 .../merge-fix_2018-02-06-06-06.json           | 11 ++++
 .../src/transforms/rtlifyRules.test.ts        |  7 +++
 .../src/transforms/rtlifyRules.ts             | 62 +++++++++++++------
 .../components/SearchBox/SearchBox.base.tsx   |  1 -
 .../components/SearchBox/SearchBox.styles.tsx |  9 +--
 .../__snapshots__/SearchBox.test.tsx.snap     |  4 +-
 packages/utilities/src/rtl.ts                 |  3 +
 8 files changed, 80 insertions(+), 28 deletions(-)
 create mode 100644 common/changes/@uifabric/merge-styles/merge-fix_2018-02-06-06-06.json
 create mode 100644 common/changes/office-ui-fabric-react/merge-fix_2018-02-06-06-06.json

diff --git a/common/changes/@uifabric/merge-styles/merge-fix_2018-02-06-06-06.json b/common/changes/@uifabric/merge-styles/merge-fix_2018-02-06-06-06.json
new file mode 100644
index 0000000000000..7445be5e07e57
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/merge-fix_2018-02-06-06-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "Adjusting rtl flipping logic to be more resilient to invalid styling.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/merge-fix_2018-02-06-06-06.json b/common/changes/office-ui-fabric-react/merge-fix_2018-02-06-06-06.json
new file mode 100644
index 0000000000000..b53d1683083b9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/merge-fix_2018-02-06-06-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SearchBox: minor correction in hover styles.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/merge-styles/src/transforms/rtlifyRules.test.ts b/packages/merge-styles/src/transforms/rtlifyRules.test.ts
index 74d9f87123a9a..cff34694b45aa 100644
--- a/packages/merge-styles/src/transforms/rtlifyRules.test.ts
+++ b/packages/merge-styles/src/transforms/rtlifyRules.test.ts
@@ -51,4 +51,11 @@ describe('rtlifyRules', () => {
     expect(rules).toEqual(['cursor', 'hand']);
   });
 
+  it('does not crash when name or value are not strings', () => {
+    // tslint:disable:no-any
+    rtlifyRules(['left', null] as any, 0);
+    rtlifyRules(['left', {}] as any, 0);
+    rtlifyRules([null, 'abc'] as any, 0);
+    // tslint:enable:no-any
+  });
 });
diff --git a/packages/merge-styles/src/transforms/rtlifyRules.ts b/packages/merge-styles/src/transforms/rtlifyRules.ts
index af57b70ffc528..211cf60772dea 100644
--- a/packages/merge-styles/src/transforms/rtlifyRules.ts
+++ b/packages/merge-styles/src/transforms/rtlifyRules.ts
@@ -1,21 +1,28 @@
-const _nameReplacements: { [key: string]: string } = {
-  'left': 'right',
-  'right': 'left'
+const LEFT = 'left';
+const RIGHT = 'right';
+const NO_FLIP = '@noflip';
+const NAME_REPLACEMENTS: { [key: string]: string } = {
+  [LEFT]: RIGHT,
+  [RIGHT]: LEFT
 };
-
-const _valueReplacements: { [key: string]: string } = {
+const VALUE_REPLACEMENTS: { [key: string]: string } = {
   'w-resize': 'e-resize',
   'sw-resize': 'se-resize',
   'nw-resize': 'ne-resize'
 };
 
-const NO_FLIP = '@noflip';
-
 let _rtl = getRTL();
 
+/**
+ * Sets the current RTL value.
+ */
 export function setRTL(isRTL: boolean): void {
   _rtl = isRTL;
 }
+
+/**
+ * Gets the current RTL value.
+ */
 export function getRTL(): boolean {
   if (_rtl === undefined) {
     _rtl = (
@@ -27,28 +34,37 @@ export function getRTL(): boolean {
   return _rtl;
 }
 
+/**
+ * RTLifies the rulePair in the array at the current index. This mutates the array for performance
+ * reasons.
+ */
 export function rtlifyRules(
   rulePairs: (string | number)[],
   index: number
 ): void {
   if (getRTL()) {
     const name = rulePairs[index] as string;
+
+    if (!name) {
+      return;
+    }
+
     const value = rulePairs[index + 1] as string;
 
-    if (value.indexOf(NO_FLIP) >= 0) {
+    if (typeof value === 'string' && value.indexOf(NO_FLIP) >= 0) {
       rulePairs[index + 1] = value.replace(/\s*(?:\/\*\s*)?\@noflip\b(?:\s*\*\/)?\s*?/g, '');
-    } else if (name.indexOf('left') >= 0) {
-      rulePairs[index] = name.replace('left', 'right');
-    } else if (name.indexOf('right') >= 0) {
-      rulePairs[index] = name.replace('right', 'left');
-    } else if (String(value).indexOf('left') >= 0) {
-      rulePairs[index + 1] = value.replace('left', 'right');
-    } else if (String(value).indexOf('right') >= 0) {
-      rulePairs[index + 1] = value.replace('right', 'left');
-    } else if (_nameReplacements[name]) {
-      rulePairs[index] = _nameReplacements[name];
-    } else if (_valueReplacements[value]) {
-      rulePairs[index + 1] = _valueReplacements[value];
+    } else if (name.indexOf(LEFT) >= 0) {
+      rulePairs[index] = name.replace(LEFT, RIGHT);
+    } else if (name.indexOf(RIGHT) >= 0) {
+      rulePairs[index] = name.replace(RIGHT, LEFT);
+    } else if (String(value).indexOf(LEFT) >= 0) {
+      rulePairs[index + 1] = value.replace(LEFT, RIGHT);
+    } else if (String(value).indexOf(RIGHT) >= 0) {
+      rulePairs[index + 1] = value.replace(RIGHT, LEFT);
+    } else if (NAME_REPLACEMENTS[name]) {
+      rulePairs[index] = NAME_REPLACEMENTS[name];
+    } else if (VALUE_REPLACEMENTS[value]) {
+      rulePairs[index + 1] = VALUE_REPLACEMENTS[value];
     } else {
       switch (name) {
         case 'margin':
@@ -63,6 +79,9 @@ export function rtlifyRules(
   }
 }
 
+/**
+ * Given a string value in a space delimited format (e.g. "1 2 3 4"), negates a particular value.
+ */
 function negateNum(value: string, partIndex: number): string {
   const parts = value.split(' ');
   const numberVal = parseInt(parts[partIndex], 10);
@@ -72,6 +91,9 @@ function negateNum(value: string, partIndex: number): string {
   return parts.join(' ');
 }
 
+/**
+ * Given a string quad, flips the left and right values.
+ */
 function flipQuad(value: string): string {
   if (typeof value === 'string') {
     const parts = value.split(' ');
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
index 956f56893e608..b1f33e8e3512b 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
@@ -3,7 +3,6 @@ import { ISearchBoxProps, ISearchBoxStyleProps, ISearchBoxStyles } from './Searc
 import {
   BaseComponent,
   autobind,
-  css,
   getId,
   KeyCodes,
   customizable,
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx
index 440765ee9d6ab..9299f4f6bcb45 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx
@@ -33,12 +33,9 @@ export function getStyles(props: ISearchBoxStyleProps): ISearchBoxStyles {
           },
           ':hover': {
             borderColor: palette.neutralDark,
-            $label: {
-              color: palette.black,
-              $iconContainer: {
-                color: palette.themeDark
-              }
-            }
+          },
+          ':hover $iconContainer': {
+            color: palette.themeDark
           }
         }
       },
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
index 13129de5ee23a..92af36c12bd50 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
@@ -32,9 +32,11 @@ exports[`SearchBox renders SearchBox correctly 1`] = `
         border: 1px solid WindowText;
       }
       &:hover {
-        $label: [object Object];
         border-color: #212121;
       }
+      &:hover $iconContainer {
+        color: #005a9e;
+      }
   onFocusCapture={[Function]}
 >
   <div
diff --git a/packages/utilities/src/rtl.ts b/packages/utilities/src/rtl.ts
index feffb62defd0a..e549957da406e 100644
--- a/packages/utilities/src/rtl.ts
+++ b/packages/utilities/src/rtl.ts
@@ -1,6 +1,7 @@
 import { KeyCodes } from './KeyCodes';
 import { getDocument } from './dom';
 import { getItem, setItem } from './sessionStorage';
+import { setRTL as mergeStylesSetRTL } from '@uifabric/merge-styles/lib/transforms/rtlifyRules';
 
 const RTL_LOCAL_STORAGE_KEY = 'isRTL';
 
@@ -22,6 +23,7 @@ export function getRTL(): boolean {
     let doc = getDocument();
     if (_isRTL === undefined && doc) {
       _isRTL = doc.documentElement.getAttribute('dir') === 'rtl';
+      mergeStylesSetRTL(_isRTL);
     }
   }
 
@@ -42,6 +44,7 @@ export function setRTL(isRTL: boolean, persistSetting: boolean = false): void {
   }
 
   _isRTL = isRTL;
+  mergeStylesSetRTL(_isRTL);
 }
 
 /**

From 741c536b273b29b301ffda685711080e6bf85b89 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 6 Feb 2018 21:40:48 -0800
Subject: [PATCH 1323/1641] Updating test.

---
 apps/vr-tests/src/stories/Button.stories.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/apps/vr-tests/src/stories/Button.stories.tsx b/apps/vr-tests/src/stories/Button.stories.tsx
index 00748de83e905..bc51fdbfb9022 100644
--- a/apps/vr-tests/src/stories/Button.stories.tsx
+++ b/apps/vr-tests/src/stories/Button.stories.tsx
@@ -137,6 +137,7 @@ storiesOf('Button Split', module)
         .mouseDown('.ms-Button:nth-child(1)')
         .snapshot('pressed main', { cropTo: '.testWrapper' })
         .hover('.ms-Button') // reset mouseDown
+        .mouseUp('.ms-Button:nth-child(2)')
         .mouseDown('.ms-Button:nth-child(2)')
         .snapshot('pressed split', { cropTo: '.testWrapper' })
         .click('.ms-Button:nth-child(2)')

From a47b964dde95fa4b4fd3e436025fada9f1affa12 Mon Sep 17 00:00:00 2001
From: Hlynur Tryggvason <hlynur.tryggvason@officeatwork.com>
Date: Wed, 7 Feb 2018 06:54:15 +0100
Subject: [PATCH 1324/1641] [Spinner] Use rotateZ to stop the spinner from
 wiggling in IE (#3893)

---
 .../fix-spinner-ie-wiggle_2018-02-06-17-13.json       | 11 +++++++++++
 .../src/components/Spinner/Spinner.scss               |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-spinner-ie-wiggle_2018-02-06-17-13.json

diff --git a/common/changes/office-ui-fabric-react/fix-spinner-ie-wiggle_2018-02-06-17-13.json b/common/changes/office-ui-fabric-react/fix-spinner-ie-wiggle_2018-02-06-17-13.json
new file mode 100644
index 0000000000000..4ad69ff7e1ea4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-spinner-ie-wiggle_2018-02-06-17-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "[Spinner] Use rotateZ to stop the spinner from wiggling in IE",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "hlynur.tryggvason@officeatwork.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss
index 124073248b58b..e5a2b7581fd87 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss
+++ b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss
@@ -12,10 +12,10 @@ $borderSize: 1.5px;
 
 @keyframes spinAnimation {
   0% {
-    transform: rotate(0deg);
+    transform: rotateZ(0deg);
   }
   100% {
-    transform: rotate(360deg);
+    transform: rotateZ(360deg);
   }
 }
 

From 48700c65292e57126b95be80c3092a39c6e171d0 Mon Sep 17 00:00:00 2001
From: Serkan Inci <serkan.inci@hotmail.com>
Date: Wed, 7 Feb 2018 01:04:40 -0500
Subject: [PATCH 1325/1641] Fixing direct reference to @uifabric/utilities/lib
 (#3889)

---
 .../@uifabric/utilities/master_2018-02-06-09-33.json  | 11 +++++++++++
 .../master_2018-02-06-09-33.json                      | 11 +++++++++++
 .../src/components/ResizeGroup/ResizeGroup.tsx        |  4 ++--
 packages/utilities/src/index.ts                       |  1 +
 4 files changed, 25 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/master_2018-02-06-09-33.json
 create mode 100644 common/changes/office-ui-fabric-react/master_2018-02-06-09-33.json

diff --git a/common/changes/@uifabric/utilities/master_2018-02-06-09-33.json b/common/changes/@uifabric/utilities/master_2018-02-06-09-33.json
new file mode 100644
index 0000000000000..4dcea375c4165
--- /dev/null
+++ b/common/changes/@uifabric/utilities/master_2018-02-06-09-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Fixing direct reference to @uifabric/utilities/lib from ResizeGroup",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "serkani@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2018-02-06-09-33.json b/common/changes/office-ui-fabric-react/master_2018-02-06-09-33.json
new file mode 100644
index 0000000000000..5508d280f85ad
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2018-02-06-09-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixing direct reference to @uifabric/utilities/lib from ResizeGroup",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "serkani@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index c8c486a47f3ea..e5223f184f9d2 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -4,9 +4,9 @@ import {
   BaseComponent,
   css,
   divProperties,
-  getNativeProps
+  getNativeProps,
+  provideContext
 } from '../../Utilities';
-import { provideContext } from '@uifabric/utilities/lib/Context';
 import { IResizeGroupProps } from './ResizeGroup.types';
 import * as styles from './ResizeGroup.scss';
 
diff --git a/packages/utilities/src/index.ts b/packages/utilities/src/index.ts
index 0a81bde68bc5d..6349375a6812c 100644
--- a/packages/utilities/src/index.ts
+++ b/packages/utilities/src/index.ts
@@ -1,6 +1,7 @@
 export * from './Async';
 export * from './AutoScroll';
 export * from './BaseComponent';
+export * from './Context';
 export * from './Customizations';
 export * from './Customizer';
 export * from './DelayedRender';

From e39a80a4bef31a9dd758933a35b2890a468726a8 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 6 Feb 2018 22:06:02 -0800
Subject: [PATCH 1326/1641] Search box base export (#3866)

* exporting searchbox base

* Change file
---
 .../searchBoxBase-export_2018-02-01-23-56.json        | 11 +++++++++++
 .../src/components/SearchBox/index.ts                 |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/searchBoxBase-export_2018-02-01-23-56.json

diff --git a/common/changes/office-ui-fabric-react/searchBoxBase-export_2018-02-01-23-56.json b/common/changes/office-ui-fabric-react/searchBoxBase-export_2018-02-01-23-56.json
new file mode 100644
index 0000000000000..c0500a8db5d1f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/searchBoxBase-export_2018-02-01-23-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SearchBox: Export base component as well as styled",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/index.ts b/packages/office-ui-fabric-react/src/components/SearchBox/index.ts
index 47af0244f9f49..4f122e6c354ff 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/index.ts
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/index.ts
@@ -1,2 +1,3 @@
 export * from './SearchBox';
+export * from './SearchBox.base';
 export * from './SearchBox.types';
\ No newline at end of file

From a91d1e819adc9c9b7973fc6fce0a9cd3a8c2ab4a Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Tue, 6 Feb 2018 22:17:46 -0800
Subject: [PATCH 1327/1641] Add fillHorizontal stretch mode to TilesList
 (#3862)

* Add fillHorizontal grid mode to TilesList

* Update change output
---
 .../tiles-mobile_2018-02-01-14-12.json        | 11 ++++++++
 .../src/components/TilesList/TilesList.tsx    | 26 ++++++++++++++-----
 .../components/TilesList/TilesList.types.ts   |  8 ++++--
 .../TilesList/examples/ExampleHelpers.tsx     | 12 ++++++---
 4 files changed, 44 insertions(+), 13 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/tiles-mobile_2018-02-01-14-12.json

diff --git a/common/changes/@uifabric/experiments/tiles-mobile_2018-02-01-14-12.json b/common/changes/@uifabric/experiments/tiles-mobile_2018-02-01-14-12.json
new file mode 100644
index 0000000000000..a9f1c99c10bd0
--- /dev/null
+++ b/common/changes/@uifabric/experiments/tiles-mobile_2018-02-01-14-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Added a fillHorizontal mode to TilesList",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/TilesList/TilesList.tsx b/packages/experiments/src/components/TilesList/TilesList.tsx
index e68fd816ed4a1..13dfac23629ef 100644
--- a/packages/experiments/src/components/TilesList/TilesList.tsx
+++ b/packages/experiments/src/components/TilesList/TilesList.tsx
@@ -148,9 +148,13 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
         className={ css(TilesListStyles.cell) }
         // tslint:disable-next-line:jsx-ban-props
         style={
-          {
-            paddingTop: `${(100 * itemHeightOverWidth).toFixed(2)}%`
-          }
+          item.grid.mode === TilesGridMode.fillHorizontal ?
+            {
+              height: `${item.grid.minRowHeight}px`
+            } :
+            {
+              paddingTop: `${(100 * itemHeightOverWidth).toFixed(2)}%`
+            }
         }
       >
         <div
@@ -214,12 +218,17 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
             scaleFactor
           } = currentRow;
 
-          if (grid.mode === TilesGridMode.fill && (!currentRow.isLastRow || scaleFactor <= grid.maxScaleFactor)) {
+          if ((grid.mode === TilesGridMode.fill ||
+            grid.mode === TilesGridMode.fillHorizontal) &&
+            (!currentRow.isLastRow ||
+              scaleFactor <= grid.maxScaleFactor)) {
             const finalScaleFactor = Math.min(grid.maxScaleFactor, scaleFactor);
 
             finalSize = {
               width: finalSize.width * finalScaleFactor,
-              height: finalSize.height * finalScaleFactor
+              height: grid.mode === TilesGridMode.fill ?
+                finalSize.height * finalScaleFactor :
+                grid.minRowHeight
             };
           }
         }
@@ -390,7 +399,10 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
         currentRow.scaleFactor = (boundsWidth - totalMargin) / (rowWidth - totalMargin);
       }
 
-      if (!isAtGridEnd && currentRow.scaleFactor > (grid.mode === TilesGridMode.fill ? grid.maxScaleFactor : 1)) {
+      if (!isAtGridEnd && currentRow.scaleFactor > (
+        grid.mode === TilesGridMode.fill || grid.mode === TilesGridMode.fillHorizontal ?
+          grid.maxScaleFactor :
+          1)) {
         // If the last computed row is not the end of the grid, and the content cannot scale to fit the width,
         // declare these cells as 'extra' and let them be pushed into the next page.
         extraCells = cells.slice(rowStart, i);
@@ -442,7 +454,7 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
 
     const itemWidthOverHeight = item.aspectRatio || 1;
     const margin = grid.spacing / 2;
-    const isFill = gridMode === TilesGridMode.fill;
+    const isFill = gridMode === TilesGridMode.fill || gridMode === TilesGridMode.fillHorizontal;
     const width = itemWidthOverHeight * grid.minRowHeight;
 
     return {
diff --git a/packages/experiments/src/components/TilesList/TilesList.types.ts b/packages/experiments/src/components/TilesList/TilesList.types.ts
index 622e5e032ae27..43636b91c24cf 100644
--- a/packages/experiments/src/components/TilesList/TilesList.types.ts
+++ b/packages/experiments/src/components/TilesList/TilesList.types.ts
@@ -36,9 +36,13 @@ export const enum TilesGridMode {
    */
   stack,
   /**
-   * Items in the row are stretched if necessary to fill the row.
+   * Items in the row are stretched proportionally if necessary to fill the row.
    */
-  fill
+  fill,
+  /**
+   * Items in the row are stretched horizontally only if necessary to fill the row.
+   */
+  fillHorizontal
 }
 
 export interface ITilesGridSegment<TItem> {
diff --git a/packages/experiments/src/components/TilesList/examples/ExampleHelpers.tsx b/packages/experiments/src/components/TilesList/examples/ExampleHelpers.tsx
index ef41583327410..c6267a4d0974d 100644
--- a/packages/experiments/src/components/TilesList/examples/ExampleHelpers.tsx
+++ b/packages/experiments/src/components/TilesList/examples/ExampleHelpers.tsx
@@ -78,10 +78,12 @@ export function createGroup(items: IExampleItem[], type: 'document' | 'media', i
 
 export function getTileCells(groups: IExampleGroup[], {
   onRenderCell,
-  onRenderHeader
+  onRenderHeader,
+  size = 'large'
 }: {
     onRenderHeader: (item: IExampleItem) => JSX.Element;
     onRenderCell: (item: IExampleItem, finalSize?: ITileSize) => JSX.Element;
+    size?: 'large' | 'small'
   }): (ITilesGridSegment<IExampleItem> | ITilesGridItem<IExampleItem>)[] {
   const items: (ITilesGridSegment<IExampleItem> | ITilesGridItem<IExampleItem>)[] = [];
 
@@ -89,9 +91,9 @@ export function getTileCells(groups: IExampleGroup[], {
     const header: ITilesGridItem<IExampleItem> = {
       key: `header-${group.key}`,
       content: {
-        key: '',
+        key: group.key,
         aspectRatio: 1,
-        name: lorem(6),
+        name: group.name,
         index: group.index
       },
       onRender: onRenderHeader
@@ -118,7 +120,9 @@ export function getTileCells(groups: IExampleGroup[], {
       marginBottom: 40,
       minRowHeight: 171,
       mode: group.type === 'document' ?
-        TilesGridMode.stack :
+        size === 'small' ?
+          TilesGridMode.fillHorizontal :
+          TilesGridMode.stack :
         TilesGridMode.fill,
       key: group.key
     });

From a1cc06c6bbcd5aee03a690434b8e285d1be8817b Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 7 Feb 2018 11:23:59 +0000
Subject: [PATCH 1328/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 .../tiles-mobile_2018-02-01-14-12.json        | 11 -----
 .../merge-fix_2018-02-06-06-06.json           | 11 -----
 .../utilities/master_2018-02-06-09-33.json    | 11 -----
 ...sgo-duplicate-export_2018-02-06-21-59.json | 11 -----
 ...ix-spinner-ie-wiggle_2018-02-06-17-13.json | 11 -----
 .../master_2018-02-06-09-33.json              | 11 -----
 .../merge-fix_2018-02-06-06-06.json           | 11 -----
 ...searchBoxBase-export_2018-02-01-23-56.json | 11 -----
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/CHANGELOG.json           | 19 ++++++++
 packages/experiments/CHANGELOG.md             |  9 +++-
 packages/experiments/package.json             |  4 +-
 .../jest-serializer-merge-styles/package.json |  2 +-
 packages/merge-styles/CHANGELOG.json          | 14 ++++++
 packages/merge-styles/CHANGELOG.md            |  9 +++-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 44 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 16 ++++++-
 packages/office-ui-fabric-react/package.json  |  6 +--
 packages/styling/package.json                 |  4 +-
 packages/utilities/CHANGELOG.json             | 19 ++++++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  4 +-
 scripts/package.json                          |  2 +-
 25 files changed, 149 insertions(+), 106 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/tiles-mobile_2018-02-01-14-12.json
 delete mode 100644 common/changes/@uifabric/merge-styles/merge-fix_2018-02-06-06-06.json
 delete mode 100644 common/changes/@uifabric/utilities/master_2018-02-06-09-33.json
 delete mode 100644 common/changes/office-ui-fabric-react/chrisgo-duplicate-export_2018-02-06-21-59.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-spinner-ie-wiggle_2018-02-06-17-13.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2018-02-06-09-33.json
 delete mode 100644 common/changes/office-ui-fabric-react/merge-fix_2018-02-06-06-06.json
 delete mode 100644 common/changes/office-ui-fabric-react/searchBoxBase-export_2018-02-01-23-56.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 7818339787a83..f124dd16adc76 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.47.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.48.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/tiles-mobile_2018-02-01-14-12.json b/common/changes/@uifabric/experiments/tiles-mobile_2018-02-01-14-12.json
deleted file mode 100644
index a9f1c99c10bd0..0000000000000
--- a/common/changes/@uifabric/experiments/tiles-mobile_2018-02-01-14-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Added a fillHorizontal mode to TilesList",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/merge-fix_2018-02-06-06-06.json b/common/changes/@uifabric/merge-styles/merge-fix_2018-02-06-06-06.json
deleted file mode 100644
index 7445be5e07e57..0000000000000
--- a/common/changes/@uifabric/merge-styles/merge-fix_2018-02-06-06-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "Adjusting rtl flipping logic to be more resilient to invalid styling.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/master_2018-02-06-09-33.json b/common/changes/@uifabric/utilities/master_2018-02-06-09-33.json
deleted file mode 100644
index 4dcea375c4165..0000000000000
--- a/common/changes/@uifabric/utilities/master_2018-02-06-09-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Fixing direct reference to @uifabric/utilities/lib from ResizeGroup",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "serkani@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/chrisgo-duplicate-export_2018-02-06-21-59.json b/common/changes/office-ui-fabric-react/chrisgo-duplicate-export_2018-02-06-21-59.json
deleted file mode 100644
index fdb76b2804a33..0000000000000
--- a/common/changes/office-ui-fabric-react/chrisgo-duplicate-export_2018-02-06-21-59.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Remove duplicate export of command button from the button index",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-spinner-ie-wiggle_2018-02-06-17-13.json b/common/changes/office-ui-fabric-react/fix-spinner-ie-wiggle_2018-02-06-17-13.json
deleted file mode 100644
index 4ad69ff7e1ea4..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-spinner-ie-wiggle_2018-02-06-17-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "[Spinner] Use rotateZ to stop the spinner from wiggling in IE",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "hlynur.tryggvason@officeatwork.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2018-02-06-09-33.json b/common/changes/office-ui-fabric-react/master_2018-02-06-09-33.json
deleted file mode 100644
index 5508d280f85ad..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2018-02-06-09-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixing direct reference to @uifabric/utilities/lib from ResizeGroup",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "serkani@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/merge-fix_2018-02-06-06-06.json b/common/changes/office-ui-fabric-react/merge-fix_2018-02-06-06-06.json
deleted file mode 100644
index b53d1683083b9..0000000000000
--- a/common/changes/office-ui-fabric-react/merge-fix_2018-02-06-06-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SearchBox: minor correction in hover styles.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/searchBoxBase-export_2018-02-01-23-56.json b/common/changes/office-ui-fabric-react/searchBoxBase-export_2018-02-01-23-56.json
deleted file mode 100644
index c0500a8db5d1f..0000000000000
--- a/common/changes/office-ui-fabric-react/searchBoxBase-export_2018-02-01-23-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SearchBox: Export base component as well as styled",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index da3e006af36f7..240c13e7d0e3b 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.17.0 <6.0.0",
-    "@uifabric/utilities": ">=5.10.0 <6.0.0",
+    "@uifabric/utilities": ">=5.10.1 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 807c304c188d2..fa2ba02414ce4 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.19.0",
+      "tag": "@uifabric/experiments_v5.19.0",
+      "date": "Wed, 07 Feb 2018 11:23:59 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "a91d1e819adc9c9b7973fc6fce0a9cd3a8c2ab4a",
+            "comment": "Added a fillHorizontal mode to TilesList"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.47.0 <6.0.0` to `>=5.48.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.18.0",
       "tag": "@uifabric/experiments_v5.18.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index c0cd5eb46fa38..40fb694b5bce3 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Tue, 06 Feb 2018 11:14:36 GMT and should not be manually modified.
+This log was last generated on Wed, 07 Feb 2018 11:23:59 GMT and should not be manually modified.
+
+## 5.19.0
+Wed, 07 Feb 2018 11:23:59 GMT
+
+### Minor changes
+
+- Added a fillHorizontal mode to TilesList
 
 ## 5.18.0
 Tue, 06 Feb 2018 11:14:36 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 6465019771703..624e934b15f47 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.18.0",
+  "version": "5.19.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.47.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.48.0 <6.0.0",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/jest-serializer-merge-styles/package.json b/packages/jest-serializer-merge-styles/package.json
index 6eed5c6475a57..9d4f4f562016f 100644
--- a/packages/jest-serializer-merge-styles/package.json
+++ b/packages/jest-serializer-merge-styles/package.json
@@ -24,6 +24,6 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/merge-styles": ">=5.11.1 <6.0.0"
+    "@uifabric/merge-styles": ">=5.11.2 <6.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index f60c89511b023..38d3604da2e39 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.11.2",
+      "tag": "@uifabric/merge-styles_v5.11.2",
+      "date": "Wed, 07 Feb 2018 11:23:59 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "d121208b61c93811909fb69d2ba8d104c3531769",
+            "comment": "Adjusting rtl flipping logic to be more resilient to invalid styling."
+          }
+        ]
+      }
+    },
     {
       "version": "5.11.1",
       "tag": "@uifabric/merge-styles_v5.11.1",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index ee2b9d9ae83d3..b418f1158b389 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Tue, 06 Feb 2018 11:14:36 GMT and should not be manually modified.
+This log was last generated on Wed, 07 Feb 2018 11:23:59 GMT and should not be manually modified.
+
+## 5.11.2
+Wed, 07 Feb 2018 11:23:59 GMT
+
+### Patches
+
+- Adjusting rtl flipping logic to be more resilient to invalid styling.
 
 ## 5.11.1
 Tue, 06 Feb 2018 11:14:36 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index ff80814be7ee2..4a9301242e395 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.11.1",
+  "version": "5.11.2",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 7365436a76b64..4d04e8d38173d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,50 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.48.0",
+      "tag": "office-ui-fabric-react_v5.48.0",
+      "date": "Wed, 07 Feb 2018 11:23:59 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "33f7c4d1d055f123cbf7237adc44e231b7efca1f",
+            "comment": "Remove duplicate export of command button from the button index"
+          },
+          {
+            "author": "Hlynur Tryggvason <hlynur.tryggvason@officeatwork.com>",
+            "commit": "a47b964dde95fa4b4fd3e436025fada9f1affa12",
+            "comment": "[Spinner] Use rotateZ to stop the spinner from wiggling in IE"
+          },
+          {
+            "author": "Serkan Inci <serkan.inci@hotmail.com>",
+            "commit": "48700c65292e57126b95be80c3092a39c6e171d0",
+            "comment": "Fixing direct reference to @uifabric/utilities/lib from ResizeGroup"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "d121208b61c93811909fb69d2ba8d104c3531769",
+            "comment": "SearchBox: minor correction in hover styles."
+          }
+        ],
+        "minor": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "e39a80a4bef31a9dd758933a35b2890a468726a8",
+            "comment": "SearchBox: Export base component as well as styled"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.11.1 <6.0.0` to `>=5.11.2 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.10.0 <6.0.0` to `>=5.10.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.47.0",
       "tag": "office-ui-fabric-react_v5.47.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 6a8259b845b0c..a0a3bad52fb7e 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,20 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 06 Feb 2018 11:14:36 GMT and should not be manually modified.
+This log was last generated on Wed, 07 Feb 2018 11:23:59 GMT and should not be manually modified.
+
+## 5.48.0
+Wed, 07 Feb 2018 11:23:59 GMT
+
+### Minor changes
+
+- SearchBox: Export base component as well as styled
+
+### Patches
+
+- Remove duplicate export of command button from the button index
+- [Spinner] Use rotateZ to stop the spinner from wiggling in IE
+- Fixing direct reference to @uifabric/utilities/lib from ResizeGroup
+- SearchBox: minor correction in hover styles.
 
 ## 5.47.0
 Tue, 06 Feb 2018 11:14:36 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 346126014e89d..f9dd78e63915e 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.47.0",
+  "version": "5.48.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -49,9 +49,9 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
-    "@uifabric/merge-styles": ">=5.11.1 <6.0.0",
+    "@uifabric/merge-styles": ">=5.11.2 <6.0.0",
     "@uifabric/styling": ">=5.17.0 <6.0.0",
-    "@uifabric/utilities": ">=5.10.0 <6.0.0",
+    "@uifabric/utilities": ">=5.10.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 9d8b12ed9b279..5c53f0ee32071 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -27,8 +27,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.10.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.11.1 <6.0.0",
+    "@uifabric/utilities": ">=5.10.1 <6.0.0",
+    "@uifabric/merge-styles": ">=5.11.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index fb0d2d00550af..a9c8f55adaa12 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.10.1",
+      "tag": "@uifabric/utilities_v5.10.1",
+      "date": "Wed, 07 Feb 2018 11:23:59 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Serkan Inci <serkan.inci@hotmail.com>",
+            "commit": "48700c65292e57126b95be80c3092a39c6e171d0",
+            "comment": "Fixing direct reference to @uifabric/utilities/lib from ResizeGroup"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.11.1 <6.0.0` to `>=5.11.2 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.10.0",
       "tag": "@uifabric/utilities_v5.10.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index a8c13b5334fcc..c4993a1d08084 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Mon, 05 Feb 2018 11:24:23 GMT and should not be manually modified.
+This log was last generated on Wed, 07 Feb 2018 11:23:59 GMT and should not be manually modified.
+
+## 5.10.1
+Wed, 07 Feb 2018 11:23:59 GMT
+
+### Patches
+
+- Fixing direct reference to @uifabric/utilities/lib from ResizeGroup
 
 ## 5.10.0
 Mon, 05 Feb 2018 11:24:23 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 33c909f5661bf..992be6b537252 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.10.0",
+  "version": "5.10.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -36,7 +36,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/merge-styles": ">=5.11.1 <6.0.0",
+    "@uifabric/merge-styles": ">=5.11.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/scripts/package.json b/scripts/package.json
index 54d906ff19f31..ed95b5f509b16 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -11,7 +11,7 @@
     "@microsoft/api-extractor": "^4.2.6",
     "@microsoft/load-themed-styles": "^1.7.13",
     "@microsoft/loader-load-themed-styles": "^1.6.0",
-    "@uifabric/merge-styles": ">=5.11.1 <6.0.0",
+    "@uifabric/merge-styles": ">=5.11.2 <6.0.0",
     "autoprefixer": "^7.1.5",
     "awesome-typescript-loader": "^3.2.3",
     "bundlesize": "^0.15.2",

From 7533d0e07dbfda819c8761bce764b4bc4fabfcae Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Wed, 7 Feb 2018 10:00:24 -0800
Subject: [PATCH 1329/1641] Callout/Positioning: Fix RTL bug where alignment
 would be lost for some directionalhints (#3907)

* fixed a bug where callout would lose alignment for some hints

* adding change file

* add a gap
---
 .../callout-rtlpositionfix_2018-02-07-01-43.json      | 11 +++++++++++
 .../src/utilities/positioning/positioning.ts          |  7 +++++--
 2 files changed, 16 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/callout-rtlpositionfix_2018-02-07-01-43.json

diff --git a/common/changes/office-ui-fabric-react/callout-rtlpositionfix_2018-02-07-01-43.json b/common/changes/office-ui-fabric-react/callout-rtlpositionfix_2018-02-07-01-43.json
new file mode 100644
index 0000000000000..24fe2e974adc8
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/callout-rtlpositionfix_2018-02-07-01-43.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Callout/Positioning: Fixed a bug where callout would lose alignment for some hints in rtl",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts b/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts
index 342e10776f883..ed1975ab16ede 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts
@@ -455,9 +455,12 @@ export module positioningFunctions {
   ): IPositionDirectionalHintData {
     let positionInformation: IPositionDirectionalHintData = { ...DirectionalDictionary[directionalHint] };
     if (getRTL()) {
+
       // If alignment edge exists and that alignment edge is -2 or 2, right or left, then flip it.
-      positionInformation.alignmentEdge = positionInformation.alignmentEdge && positionInformation.alignmentEdge % 2 === 0
-        ? positionInformation.alignmentEdge * -1 : undefined;
+      if (positionInformation.alignmentEdge && positionInformation.alignmentEdge % 2 === 0) {
+        positionInformation.alignmentEdge = positionInformation.alignmentEdge * -1;
+      }
+
       return directionalHintForRTL !== undefined ?
         DirectionalDictionary[directionalHintForRTL] :
         positionInformation;

From 38120bf5cbd359ee786a0746ce40fdec8eff4394 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 7 Feb 2018 12:03:27 -0800
Subject: [PATCH 1330/1641] Update STYLING.md

---
 ghdocs/STYLING.md | 35 ++++++++++++++---------------------
 1 file changed, 14 insertions(+), 21 deletions(-)

diff --git a/ghdocs/STYLING.md b/ghdocs/STYLING.md
index ae05ec3fca792..dd870c2d1085a 100644
--- a/ghdocs/STYLING.md
+++ b/ghdocs/STYLING.md
@@ -195,36 +195,29 @@ export const ComponentName = styled(
 );
 ```
 
-#### Support for customized sub component styling
+#### Support for customizable sub-component styling
 
-Note that the component may also intend to provide customized styling for nested components. For example, a `Breadcrumb` component may want to expose the `getStyles` function for nested `Crumb` components.
+The component may also intend to provide customized styling for nested components. For example, a `Breadcrumb` component may want to render `Crumb` components, which may take in their own styles.
 
-The extra getStyles function would be added to the outer compoent's props:
+The recommended approach is to avoid exposing the individual `Crumb` props at the `Breadcrumb` layer. Instead, expose a way to provide an alternative component for the `Crumb` using the `as` prop convention. This lets the caller create their own `Crumb` variant and use it within the `Breadcrumb`. It also opens up other scenarios such as providing additional default props on the sub-component, or replacing it completely.
 
-```
-getCrumbStyles?: IStyleFunction<ICrumbStyleProps, ICrumbStyles>;
-```
+In the `Breadcrumb` case, we would expose an optional `crumbAs` prop. This would allow the consumer to make a `Breadcrumb` variant which renders red `Crumb` components:
 
-The base component would pipe the function into the child:
+```
+const RedCrumb = styled(Crumb, props => ({ root: background: 'red' }));
 
-```tsx
-let { getCrumbStyles } = this.props;
+render() {
+  return <Breadcrumb crumbAs={ RedCrumb } ... />
+```
 
-// ...and in the render function:
+Additionally this "breadcrumb with red crumbs" scenario could be abstracted as its own component, by passing in the 3rd optional param to `styled`, which lets the caller provide new default prop values:
 
-<Crumb getStyles={ getCrumbStyles }>
 ```
+const RedBreadcrumb = styled(Breadcrumb, undefined, { crumbAs: RedCrumb });
 
-And finally, the composite component created by the `styles` wrapper would link default styling for the property:
-
-```tsx
-export const Breadcrumb = styled(
-  BreadcrumbBase,
-  {
-    getStyles,
-    getCrumbStyles
-  }
-)
+render() {
+  return <RedBreadcrumb ... />
+}
 ```
 
 ### ComponentName.test.tsx

From 62cc53d57ea4bd4d01f452a3767f400d00d4cddf Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Wed, 7 Feb 2018 17:57:07 -0800
Subject: [PATCH 1331/1641] Callout: Fix positioning in RTL Auto Flipping
 (#3912)

* Add hostid

* Revert "Add hostid"

This reverts commit d5a842d8ebc099fa4652d7abd7205bdfcf033b0a.

* Fix rtl positioning bug for callout

* Add change file

* Fix syntax error

* Change name of func

* Change bundle max size to 42.81

* Update package.json
---
 .../malozano-CalloutRTL_2018-02-07-22-43.json | 11 ++++++++
 .../Callout/CalloutContent.base.tsx           | 22 +++++++++++++++-
 .../Callout/CalloutContent.styles.ts          | 26 ++++---------------
 .../__snapshots__/Callout.test.tsx.snap       |  8 ++++--
 scripts/package.json                          |  4 +--
 5 files changed, 45 insertions(+), 26 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/malozano-CalloutRTL_2018-02-07-22-43.json

diff --git a/common/changes/office-ui-fabric-react/malozano-CalloutRTL_2018-02-07-22-43.json b/common/changes/office-ui-fabric-react/malozano-CalloutRTL_2018-02-07-22-43.json
new file mode 100644
index 0000000000000..b5c8710c743fa
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-CalloutRTL_2018-02-07-22-43.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Callout: Move positioning to inline styling",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
index de0022878e027..dc141308bf96d 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
@@ -13,7 +13,6 @@ import {
   IRectangle,
   assign,
   autobind,
-  css,
   elementContains,
   focusFirstChild,
   getWindow,
@@ -33,6 +32,11 @@ import { classNamesFunction } from '../../Utilities';
 
 const getClassNames = classNamesFunction<ICalloutContentStyleProps, ICalloutContentStyles>();
 const BORDER_WIDTH: number = 1;
+const BEAK_ORIGIN_POSITION = { top: 0, left: 0 };
+// Microsoft Edge will overwrite inline styles if there is an animation pertaining to that style.
+// To help ensure that edge will respect the offscreen style opacity
+// filter needs to be added as an additional way to set opacity.
+const OFF_SCREEN_STYLE = { opacity: 0, filter: 'opacity(0)' };
 
 export interface ICalloutState {
   positions?: ICalloutPositionedInfo;
@@ -164,6 +168,7 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
       >
         <div
           className={ this._classNames.root }
+          style={ positions ? positions.elementPosition : OFF_SCREEN_STYLE }
           tabIndex={ -1 } // Safari and Firefox on Mac OS requires this to back-stop click events so focus remains in the Callout.
           // See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus
           ref={ this._resolveRef('_calloutElement') }
@@ -172,6 +177,7 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
           { beakVisible && (
             <div
               className={ this._classNames.beak }
+              style={ this._getBeakPosition() }
             />) }
           { beakVisible &&
             (<div className={ this._classNames.beakCurtain } />) }
@@ -258,6 +264,20 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
     this._async.requestAnimationFrame(() => this._updatePosition());
   }
 
+  private _getBeakPosition(): React.CSSProperties {
+    let { positions } = this.state;
+    let beakPostionStyle: React.CSSProperties = {
+      ...(positions && positions.beakPosition ? positions.beakPosition.elementPosition : null),
+    };
+
+    if (!beakPostionStyle.top && !beakPostionStyle.bottom && !beakPostionStyle.left && !beakPostionStyle.right) {
+      beakPostionStyle.left = BEAK_ORIGIN_POSITION.left;
+      beakPostionStyle.top = BEAK_ORIGIN_POSITION.top;
+    }
+
+    return beakPostionStyle;
+  }
+
   private _updatePosition() {
     let { positions } = this.state;
     let hostElement: HTMLElement = this._hostElement;
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.styles.ts b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.styles.ts
index 327cf4dd38f6e..c0019c4e59e51 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.styles.ts
@@ -19,8 +19,7 @@ const ANIMATIONS: { [key: number]: IRawStyle; } = {
   [RectangleEdge.right]: AnimationStyles.slideRightIn20,
 };
 
-function getBeakStylePosition(positions?: ICalloutPositionedInfo,
-  beakWidth?: number,
+function getBeakStyle(beakWidth?: number,
   beakStyle?: string): IRawStyle {
   let beakStyleWidth = beakWidth;
 
@@ -30,17 +29,10 @@ function getBeakStylePosition(positions?: ICalloutPositionedInfo,
     beakStyleWidth = 16;
   }
 
-  let beakReactStyle: IRawStyle = {
-    ...(positions && positions.beakPosition ? positions.beakPosition.elementPosition : null),
+  return {
+    height: beakStyleWidth,
+    width: beakStyleWidth
   };
-  beakReactStyle.height = beakStyleWidth;
-  beakReactStyle.width = beakStyleWidth;
-  if (!beakReactStyle.top && !beakReactStyle.bottom && !beakReactStyle.left && !beakReactStyle.right) {
-    beakReactStyle.left = BEAK_ORIGIN_POSITION.left;
-    beakReactStyle.top = BEAK_ORIGIN_POSITION.top;
-  }
-
-  return beakReactStyle;
 }
 
 export const getStyles = (props: ICalloutContentStyleProps): ICalloutContentStyles => {
@@ -84,14 +76,6 @@ export const getStyles = (props: ICalloutContentStyleProps): ICalloutContentStyl
       focusClear(),
       className,
       positions && positions.targetEdge && ANIMATIONS[positions.targetEdge],
-      // Microsoft Edge will overwrite inline styles if there is an animation pertaining to that style.
-      // To help ensure that edge will respect the offscreen style opacity
-      // filter needs to be added as an additional way to set opacity.
-      !positions && {
-        opacity: 0,
-        filter: 'opacity(0)',
-      },
-      positions && { ...positions.elementPosition },
       !!calloutWidth && { width: calloutWidth },
     ],
     beak: [
@@ -104,7 +88,7 @@ export const getStyles = (props: ICalloutContentStyleProps): ICalloutContentStyl
         boxSizing: 'border-box',
         transform: 'rotate(45deg)'
       },
-      getBeakStylePosition(positions, beakWidth, beakStyle),
+      getBeakStyle(beakWidth, beakStyle),
       backgroundColor && {
         backgroundColor: backgroundColor
       }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
index e0d53d5ed7639..3f49786bdf6d1 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Callout/__snapshots__/Callout.test.tsx.snap
@@ -17,8 +17,6 @@ exports[`Callout renders Callout correctly 1`] = `
           border-width: 1px;
           box-shadow: 0 0 5px 0px rgba(0,0,0,0.4);
           box-sizing: border-box;
-          filter: opacity(0);
-          opacity: 0;
           outline: transparent;
           position: absolute;
         }
@@ -30,6 +28,12 @@ exports[`Callout renders Callout correctly 1`] = `
         &::-moz-focus-inner {
           border: 0px;
         }
+    style={
+      Object {
+        "filter": "opacity(0)",
+        "opacity": 0,
+      }
+    }
     tabIndex={-1}
   >
     <div
diff --git a/scripts/package.json b/scripts/package.json
index ed95b5f509b16..d2ea945a50af1 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -49,7 +49,7 @@
   "bundlesize": [
     {
       "path": "../apps/test-bundle-button/dist/main.min.js",
-      "maxSize": "42.8 kB"
+      "maxSize": "42.9 kB"
     }
   ]
-}
\ No newline at end of file
+}

From 6aa5c2f3472d88fd1656a44c984bbe5e44ae127a Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 8 Feb 2018 02:29:26 +0000
Subject: [PATCH 1332/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...llout-rtlpositionfix_2018-02-07-01-43.json | 11 -----------
 .../malozano-CalloutRTL_2018-02-07-22-43.json | 11 -----------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 11 files changed, 35 insertions(+), 30 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/callout-rtlpositionfix_2018-02-07-01-43.json
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-CalloutRTL_2018-02-07-22-43.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index f124dd16adc76..cf3e38358c3a7 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.48.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.48.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 082e7be177809..0e3cfaff1ce88 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.47.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.48.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 0858d09f23c0c..19428dd171722 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.47.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.48.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 8d66ea9c0e243..ddafba0317992 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.47.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.48.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 206e2a459e4ee..3bf21d9495612 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.47.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.48.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/office-ui-fabric-react/callout-rtlpositionfix_2018-02-07-01-43.json b/common/changes/office-ui-fabric-react/callout-rtlpositionfix_2018-02-07-01-43.json
deleted file mode 100644
index 24fe2e974adc8..0000000000000
--- a/common/changes/office-ui-fabric-react/callout-rtlpositionfix_2018-02-07-01-43.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Callout/Positioning: Fixed a bug where callout would lose alignment for some hints in rtl",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/malozano-CalloutRTL_2018-02-07-22-43.json b/common/changes/office-ui-fabric-react/malozano-CalloutRTL_2018-02-07-22-43.json
deleted file mode 100644
index b5c8710c743fa..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-CalloutRTL_2018-02-07-22-43.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Callout: Move positioning to inline styling",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 624e934b15f47..78a21a468313a 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.48.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.48.1 <6.0.0",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 4d04e8d38173d..0607e5c153409 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.48.1",
+      "tag": "office-ui-fabric-react_v5.48.1",
+      "date": "Thu, 08 Feb 2018 02:29:26 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "7533d0e07dbfda819c8761bce764b4bc4fabfcae",
+            "comment": "Callout/Positioning: Fixed a bug where callout would lose alignment for some hints in rtl"
+          },
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "62cc53d57ea4bd4d01f452a3767f400d00d4cddf",
+            "comment": "Callout: Move positioning to inline styling"
+          }
+        ]
+      }
+    },
     {
       "version": "5.48.0",
       "tag": "office-ui-fabric-react_v5.48.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index a0a3bad52fb7e..70bf218b08570 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 07 Feb 2018 11:23:59 GMT and should not be manually modified.
+This log was last generated on Thu, 08 Feb 2018 02:29:26 GMT and should not be manually modified.
+
+## 5.48.1
+Thu, 08 Feb 2018 02:29:26 GMT
+
+### Patches
+
+- Callout/Positioning: Fixed a bug where callout would lose alignment for some hints in rtl
+- Callout: Move positioning to inline styling
 
 ## 5.48.0
 Wed, 07 Feb 2018 11:23:59 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index f9dd78e63915e..8df0662dbd196 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.48.0",
+  "version": "5.48.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 77a0be82fb6c440fa7ec6f4e80efed7d67f007c1 Mon Sep 17 00:00:00 2001
From: Kristian Halle <khalle@microsoft.com>
Date: Thu, 8 Feb 2018 10:10:09 +0100
Subject: [PATCH 1333/1641] Initials (#3909)

* Don't show initials for phone numbers

* Change request files

* Fixes
---
 .../initials_2018-02-07-13-49.json            | 11 +++++++
 .../initials_2018-02-07-13-49.json            | 11 +++++++
 .../initials_2018-02-07-13-49.json            | 11 +++++++
 .../initials_2018-02-07-13-49.json            | 11 +++++++
 .../icons/initials_2018-02-07-13-49.json      | 11 +++++++
 .../initials_2018-02-07-13-49.json            | 11 +++++++
 .../initials_2018-02-07-13-49.json            | 11 +++++++
 .../styling/initials_2018-02-07-13-49.json    | 11 +++++++
 .../utilities/initials_2018-02-07-13-49.json  | 11 +++++++
 .../initials_2018-02-07-13-49.json            | 11 +++++++
 .../src/components/Persona/Persona.test.tsx   |  4 +--
 .../examples/Persona.Initials.Example.tsx     |  4 +++
 packages/utilities/src/initials.test.ts       | 32 +++++++++++++++++--
 packages/utilities/src/initials.ts            |  9 +++++-
 14 files changed, 154 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/initials_2018-02-07-13-49.json
 create mode 100644 common/changes/@uifabric/experiments/initials_2018-02-07-13-49.json
 create mode 100644 common/changes/@uifabric/fabric-website/initials_2018-02-07-13-49.json
 create mode 100644 common/changes/@uifabric/file-type-icons/initials_2018-02-07-13-49.json
 create mode 100644 common/changes/@uifabric/icons/initials_2018-02-07-13-49.json
 create mode 100644 common/changes/@uifabric/jest-serializer-merge-styles/initials_2018-02-07-13-49.json
 create mode 100644 common/changes/@uifabric/merge-styles/initials_2018-02-07-13-49.json
 create mode 100644 common/changes/@uifabric/styling/initials_2018-02-07-13-49.json
 create mode 100644 common/changes/@uifabric/utilities/initials_2018-02-07-13-49.json
 create mode 100644 common/changes/office-ui-fabric-react/initials_2018-02-07-13-49.json

diff --git a/common/changes/@uifabric/example-app-base/initials_2018-02-07-13-49.json b/common/changes/@uifabric/example-app-base/initials_2018-02-07-13-49.json
new file mode 100644
index 0000000000000..55ac6310053df
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/initials_2018-02-07-13-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "khalle@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/initials_2018-02-07-13-49.json b/common/changes/@uifabric/experiments/initials_2018-02-07-13-49.json
new file mode 100644
index 0000000000000..da6fd82d9a0c3
--- /dev/null
+++ b/common/changes/@uifabric/experiments/initials_2018-02-07-13-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/experiments",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "khalle@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/initials_2018-02-07-13-49.json b/common/changes/@uifabric/fabric-website/initials_2018-02-07-13-49.json
new file mode 100644
index 0000000000000..449e1cc3620ed
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/initials_2018-02-07-13-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "khalle@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/file-type-icons/initials_2018-02-07-13-49.json b/common/changes/@uifabric/file-type-icons/initials_2018-02-07-13-49.json
new file mode 100644
index 0000000000000..bc41d040120da
--- /dev/null
+++ b/common/changes/@uifabric/file-type-icons/initials_2018-02-07-13-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/file-type-icons",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/file-type-icons",
+  "email": "khalle@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/initials_2018-02-07-13-49.json b/common/changes/@uifabric/icons/initials_2018-02-07-13-49.json
new file mode 100644
index 0000000000000..4d68b78541429
--- /dev/null
+++ b/common/changes/@uifabric/icons/initials_2018-02-07-13-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/icons",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/icons",
+  "email": "khalle@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/jest-serializer-merge-styles/initials_2018-02-07-13-49.json b/common/changes/@uifabric/jest-serializer-merge-styles/initials_2018-02-07-13-49.json
new file mode 100644
index 0000000000000..f308df63f7ee1
--- /dev/null
+++ b/common/changes/@uifabric/jest-serializer-merge-styles/initials_2018-02-07-13-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/jest-serializer-merge-styles",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/jest-serializer-merge-styles",
+  "email": "khalle@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/initials_2018-02-07-13-49.json b/common/changes/@uifabric/merge-styles/initials_2018-02-07-13-49.json
new file mode 100644
index 0000000000000..ad82059ac3623
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/initials_2018-02-07-13-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/merge-styles",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "khalle@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/initials_2018-02-07-13-49.json b/common/changes/@uifabric/styling/initials_2018-02-07-13-49.json
new file mode 100644
index 0000000000000..bd2b4f2e78b32
--- /dev/null
+++ b/common/changes/@uifabric/styling/initials_2018-02-07-13-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "khalle@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/initials_2018-02-07-13-49.json b/common/changes/@uifabric/utilities/initials_2018-02-07-13-49.json
new file mode 100644
index 0000000000000..e325d1cc0b533
--- /dev/null
+++ b/common/changes/@uifabric/utilities/initials_2018-02-07-13-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Return empty initials for phone numbers",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "khalle@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/initials_2018-02-07-13-49.json b/common/changes/office-ui-fabric-react/initials_2018-02-07-13-49.json
new file mode 100644
index 0000000000000..02066ef6c3797
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/initials_2018-02-07-13-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Return empty initials for phone numbers",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "khalle@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
index 180e8e2df2111..0b2b42c6bcfb2 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
@@ -46,10 +46,10 @@ describe('Persona', () => {
       expect(result.text()).toEqual('DZ');
       wrapper.unmount();
 
-      wrapper = mount(<Persona primaryText='4lex 4loo' />);
+      wrapper = mount(<Persona primaryText='4lex 5loo' />);
       result = wrapper.find(STYLES.initials);
       expect(result).toHaveLength(1);
-      expect(result.text()).toEqual('44');
+      expect(result.text()).toEqual('45');
       wrapper.unmount();
 
       wrapper = mount(<Persona primaryText='David (The man) Goff' />);
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Initials.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Initials.Example.tsx
index cba8dc222a5ea..549d016b6869b 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Initials.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Initials.Example.tsx
@@ -29,6 +29,10 @@ export class PersonaInitialsExample extends React.Component<any, any> {
           { ...examplePersona  }
           primaryText='Annie Lindqvist'
         />
+        <Persona
+          { ...examplePersona  }
+          primaryText='+1 (555) 123-4567 X4567'
+        />
         <Persona
           { ...examplePersona  }
           primaryText='宋智洋'
diff --git a/packages/utilities/src/initials.test.ts b/packages/utilities/src/initials.test.ts
index 9d76d15b22e14..9a5a6e3f1580f 100644
--- a/packages/utilities/src/initials.test.ts
+++ b/packages/utilities/src/initials.test.ts
@@ -28,8 +28,8 @@ describe('getInitials', () => {
   });
 
   it('calculates an expected initials in LTR with numbers', () => {
-    let result = getInitials('4lex 4loo', false);
-    expect(result).toEqual('44');
+    let result = getInitials('4lex 5loo', false);
+    expect(result).toEqual('45');
   });
 
   it('calculates an expected initials in LTR with parentheses', () => {
@@ -99,4 +99,32 @@ describe('getInitials', () => {
     expect(result).toEqual('');
   });
 
+  it('calculates expected initials for phone numbers', () => {
+    let result = getInitials('12345678', false);
+    expect(result).toEqual('');
+
+    result = getInitials('+1 (555) 123-4567 ext.4567', false);
+    expect(result).toEqual('');
+
+    result = getInitials('+47 12 34 56 78 (X 5678)', false);
+    expect(result).toEqual('');
+
+    result = getInitials('1 Ext 2', false);
+    expect(result).toEqual('');
+
+    result = getInitials('James Ext 2', false);
+    expect(result).toEqual('J2');
+
+    result = getInitials('1x1', false);
+    expect(result).toEqual('');
+
+    result = getInitials('1y1', false);
+    expect(result).toEqual('1');
+
+    result = getInitials('1', false);
+    expect(result).toEqual('1');
+
+    result = getInitials('A 2', false);
+    expect(result).toEqual('A2');
+  });
 });
diff --git a/packages/utilities/src/initials.ts b/packages/utilities/src/initials.ts
index f85a2704637ea..387495adf4482 100644
--- a/packages/utilities/src/initials.ts
+++ b/packages/utilities/src/initials.ts
@@ -5,6 +5,12 @@
  */
 const UNWANTED_CHARS_REGEX: RegExp = /\([^)]*\)|[\0-\u001F\!-/:-@\[-`\{-\u00BF\u0250-\u036F\uD800-\uFFFF]/g;
 
+/**
+ * Regular expression matching phone numbers. Applied after chars matching UNWANTED_CHARS_REGEX have been removed
+ * and number has been trimmed for whitespaces
+ */
+const PHONENUMBER_REGEX: RegExp = /^\d+[\d\s]*(:?ext|x|)\s*\d+$/i;
+
 /** Regular expression matching one or more spaces. */
 const MULTIPLE_WHITESPACES_REGEX: RegExp = /\s+/g;
 
@@ -61,7 +67,8 @@ export function getInitials(displayName: string | undefined | null, isRtl: boole
 
   displayName = cleanupDisplayName(displayName);
 
-  if (UNSUPPORTED_TEXT_REGEX.test(displayName)) {
+  // For names containing CJK characters, and phone numbers, we don't display initials
+  if (UNSUPPORTED_TEXT_REGEX.test(displayName) || PHONENUMBER_REGEX.test(displayName)) {
     return '';
   }
 

From 2389b8dabd023f5ebea39d03e4f8d94572e673f7 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 8 Feb 2018 11:13:51 +0000
Subject: [PATCH 1334/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 .../utilities/initials_2018-02-07-13-49.json  | 11 -----------
 .../initials_2018-02-07-13-49.json            | 11 -----------
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++++-
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 ++++++++++++++
 packages/utilities/CHANGELOG.md               |  9 ++++++++-
 packages/utilities/package.json               |  2 +-
 12 files changed, 56 insertions(+), 31 deletions(-)
 delete mode 100644 common/changes/@uifabric/utilities/initials_2018-02-07-13-49.json
 delete mode 100644 common/changes/office-ui-fabric-react/initials_2018-02-07-13-49.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index cf3e38358c3a7..500373c55d3ee 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.48.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.48.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/initials_2018-02-07-13-49.json b/common/changes/@uifabric/utilities/initials_2018-02-07-13-49.json
deleted file mode 100644
index e325d1cc0b533..0000000000000
--- a/common/changes/@uifabric/utilities/initials_2018-02-07-13-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Return empty initials for phone numbers",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "khalle@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/initials_2018-02-07-13-49.json b/common/changes/office-ui-fabric-react/initials_2018-02-07-13-49.json
deleted file mode 100644
index 02066ef6c3797..0000000000000
--- a/common/changes/office-ui-fabric-react/initials_2018-02-07-13-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Return empty initials for phone numbers",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "khalle@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 240c13e7d0e3b..a4e33e8ba924d 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.17.0 <6.0.0",
-    "@uifabric/utilities": ">=5.10.1 <6.0.0",
+    "@uifabric/utilities": ">=5.10.2 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 78a21a468313a..1113863c46148 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.48.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.48.2 <6.0.0",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 0607e5c153409..7113dade45bdf 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.48.2",
+      "tag": "office-ui-fabric-react_v5.48.2",
+      "date": "Thu, 08 Feb 2018 11:13:51 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Kristian Halle <khalle@microsoft.com>",
+            "commit": "77a0be82fb6c440fa7ec6f4e80efed7d67f007c1",
+            "comment": "Return empty initials for phone numbers"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.10.1 <6.0.0` to `>=5.10.2 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.48.1",
       "tag": "office-ui-fabric-react_v5.48.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 70bf218b08570..366d7b27f252b 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 08 Feb 2018 02:29:26 GMT and should not be manually modified.
+This log was last generated on Thu, 08 Feb 2018 11:13:51 GMT and should not be manually modified.
+
+## 5.48.2
+Thu, 08 Feb 2018 11:13:51 GMT
+
+### Patches
+
+- Return empty initials for phone numbers
 
 ## 5.48.1
 Thu, 08 Feb 2018 02:29:26 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 8df0662dbd196..2cb9066ca5d69 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.48.1",
+  "version": "5.48.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -51,7 +51,7 @@
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "@uifabric/merge-styles": ">=5.11.2 <6.0.0",
     "@uifabric/styling": ">=5.17.0 <6.0.0",
-    "@uifabric/utilities": ">=5.10.1 <6.0.0",
+    "@uifabric/utilities": ">=5.10.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 5c53f0ee32071..cc8e6438a5587 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.10.1 <6.0.0",
+    "@uifabric/utilities": ">=5.10.2 <6.0.0",
     "@uifabric/merge-styles": ">=5.11.2 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index a9c8f55adaa12..51ed09a3a2b62 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.10.2",
+      "tag": "@uifabric/utilities_v5.10.2",
+      "date": "Thu, 08 Feb 2018 11:13:51 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Kristian Halle <khalle@microsoft.com>",
+            "commit": "77a0be82fb6c440fa7ec6f4e80efed7d67f007c1",
+            "comment": "Return empty initials for phone numbers"
+          }
+        ]
+      }
+    },
     {
       "version": "5.10.1",
       "tag": "@uifabric/utilities_v5.10.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index c4993a1d08084..17c3172de70e6 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Wed, 07 Feb 2018 11:23:59 GMT and should not be manually modified.
+This log was last generated on Thu, 08 Feb 2018 11:13:51 GMT and should not be manually modified.
+
+## 5.10.2
+Thu, 08 Feb 2018 11:13:51 GMT
+
+### Patches
+
+- Return empty initials for phone numbers
 
 ## 5.10.1
 Wed, 07 Feb 2018 11:23:59 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 992be6b537252..5d36a0cab3b7b 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.10.1",
+  "version": "5.10.2",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 1e22ceeef52c46b7f7bfda9b2d1015664105f6ff Mon Sep 17 00:00:00 2001
From: Mike Wheaton <miwhea@microsoft.com>
Date: Thu, 8 Feb 2018 10:32:21 -0800
Subject: [PATCH 1335/1641] Rating: Rename RatingBase.tsx to Rating.base.tsx to
 match convention (#3921)

* Rename RatingBase.tsx to Rating.base.tsx to match convention

* Add change file
---
 .../miwhea-rename-rating-base_2018-02-08-16-38.json   | 11 +++++++++++
 .../Rating/{RatingBase.tsx => Rating.base.tsx}        |  0
 .../src/components/Rating/Rating.test.tsx             |  2 +-
 .../src/components/Rating/Rating.tsx                  |  2 +-
 4 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/miwhea-rename-rating-base_2018-02-08-16-38.json
 rename packages/office-ui-fabric-react/src/components/Rating/{RatingBase.tsx => Rating.base.tsx} (100%)

diff --git a/common/changes/office-ui-fabric-react/miwhea-rename-rating-base_2018-02-08-16-38.json b/common/changes/office-ui-fabric-react/miwhea-rename-rating-base_2018-02-08-16-38.json
new file mode 100644
index 0000000000000..b6ce41b184355
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/miwhea-rename-rating-base_2018-02-08-16-38.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Rating: Renamed RatingBase.tsx to Rating.base.tsx to match convention",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mike@mikewheaton.ca"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Rating/RatingBase.tsx b/packages/office-ui-fabric-react/src/components/Rating/Rating.base.tsx
similarity index 100%
rename from packages/office-ui-fabric-react/src/components/Rating/RatingBase.tsx
rename to packages/office-ui-fabric-react/src/components/Rating/Rating.base.tsx
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx b/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
index 045a730bb1f0a..d98139e79d00b 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
@@ -7,7 +7,7 @@ import * as ReactTestUtils from 'react-dom/test-utils';
 import * as renderer from 'react-test-renderer';
 
 import { Rating } from './Rating';
-import { RatingBase } from './RatingBase';
+import { RatingBase } from './Rating.base';
 import { getStyles } from './Rating.styles';
 
 describe('Rating', () => {
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx b/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
index 373e57e06ef68..3699b845ccf1d 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
@@ -3,7 +3,7 @@ import {
 } from '../../Utilities';
 import { IRatingProps } from './Rating.types';
 import { getStyles } from './Rating.styles';
-import { RatingBase } from './RatingBase';
+import { RatingBase } from './Rating.base';
 
 export const Rating = styled(
   RatingBase,

From d716d81c844e366e37d1fdf023c527541a7b6b57 Mon Sep 17 00:00:00 2001
From: Kushal Yarlagadda <whykushal93@gmail.com>
Date: Thu, 8 Feb 2018 15:16:17 -0800
Subject: [PATCH 1336/1641] Close contextual menu on Alt key. (#3923)

* ContextualMenus and Dropdowns now close on Alt keypresses.

* Revert "ContextualMenus and Dropdowns now close on Alt keypresses."

This reverts commit 0916b5f206379d14d961c0485495cdff90bfe718.

* Allowing for contextual and menus to be closed on Alt keys.
Works for any number of submenus. Closes the last opened sub menu but does not close all menus on Alt key.

* Change file
---
 .../MenuKeyboarding_2018-02-08-02-16.json           | 11 +++++++++++
 .../components/ContextualMenu/ContextualMenu.tsx    |  4 +++-
 .../src/components/Dropdown/Dropdown.tsx            | 13 +++++++++++++
 3 files changed, 27 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/MenuKeyboarding_2018-02-08-02-16.json

diff --git a/common/changes/office-ui-fabric-react/MenuKeyboarding_2018-02-08-02-16.json b/common/changes/office-ui-fabric-react/MenuKeyboarding_2018-02-08-02-16.json
new file mode 100644
index 0000000000000..47ac1877e140f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/MenuKeyboarding_2018-02-08-02-16.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Allowing for contextual and menus to be closed on Alt keys",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kushaly@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 75f503bb0b426..a1457b818c094 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -663,6 +663,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     let submenuCloseKey = getRTL() ? KeyCodes.right : KeyCodes.left;
 
     if (ev.which === KeyCodes.escape
+      || ev.altKey
+      || ev.metaKey
       || (ev.which === submenuCloseKey && this.props.isSubMenu && this.props.arrowDirection === FocusZoneDirection.vertical)) {
       // When a user presses escape, we will try to refocus the previous focused element.
       this._isFocusingPreviousElement = true;
@@ -674,7 +676,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
   @autobind
   private _onMenuKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
-    if (ev.which === KeyCodes.escape) {
+    if (ev.which === KeyCodes.escape || ev.altKey || ev.metaKey) {
       this._isFocusingPreviousElement = true;
       ev.preventDefault();
       ev.stopPropagation();
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index a2d11867564c1..097988c063f55 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -748,6 +748,13 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
         break;
 
       default:
+        if (ev.altKey || ev.metaKey) {
+          this.setState({
+            isOpen: false
+          });
+          ev.stopPropagation();
+          ev.preventDefault();
+        }
         return;
     }
 
@@ -815,6 +822,12 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
         return;
 
       default:
+        if (ev.altKey || ev.metaKey) {
+          this.setState({
+            isOpen: false
+          });
+          break;
+        }
         return;
     }
 

From 2d66f65d8b1be05684f52e0c2a94af8e44e88857 Mon Sep 17 00:00:00 2001
From: Peter Jahn <pejahn@microsoft.com>
Date: Thu, 8 Feb 2018 15:42:33 -0800
Subject: [PATCH 1337/1641] Update CONTRIBUTING.md

---
 ghdocs/CONTRIBUTING.md | 2 --
 1 file changed, 2 deletions(-)

diff --git a/ghdocs/CONTRIBUTING.md b/ghdocs/CONTRIBUTING.md
index a2ab1d7bfd15e..212f1c6369634 100644
--- a/ghdocs/CONTRIBUTING.md
+++ b/ghdocs/CONTRIBUTING.md
@@ -2,8 +2,6 @@
 
 Office UI Fabric React is an evolving snapshot of the Office 365 Design Language's components, built with [React](https://facebook.github.io/react/).
 
-Right now, the project is in a **pre-v1** state, so we're mainly driving torwards the goals outlined in the [roadmap](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/ROADMAP.md). With this in mind, feel free to file bugs but new components or additional features will probably not be considered to be executed on until after the v1 state is reached.
-
 ### Contribution license agreement
 For pull requests affecting fewer than 15 lines of code, you will need to sign a [Contribution License Agreement (CLA)](https://cla.microsoft.com/) before your contribution can be incorporated. To complete the CLA, you will need to submit the request via the form and then electronically sign the CLA when you receive the email containing the link to the document.
 

From c761919891df8df48a02c4cbee2bc18ac8635d55 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Thu, 8 Feb 2018 21:34:33 -0800
Subject: [PATCH 1338/1641] ChoiceGroup: More flexible field sizing, especially
 for images (#3930)

* More flexible sizing, default h w, and large image size class

* Bumped up padding on large format

* Added change file

* jsx alignment
---
 .../src/stories/ChoiceGroup.stories.tsx       | 26 +++++++++++++++--
 ...egroup-size-refactor_2018-02-08-22-52.json | 11 ++++++++
 .../components/ChoiceGroup/ChoiceGroup.scss   | 28 +++++++++++--------
 .../components/ChoiceGroup/ChoiceGroup.tsx    | 23 ++++++++++-----
 .../ChoiceGroup/ChoiceGroup.types.ts          |  1 +
 5 files changed, 67 insertions(+), 22 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/choicegroup-size-refactor_2018-02-08-22-52.json

diff --git a/apps/vr-tests/src/stories/ChoiceGroup.stories.tsx b/apps/vr-tests/src/stories/ChoiceGroup.stories.tsx
index b3facd8fe5b42..dc4609f217909 100644
--- a/apps/vr-tests/src/stories/ChoiceGroup.stories.tsx
+++ b/apps/vr-tests/src/stories/ChoiceGroup.stories.tsx
@@ -77,7 +77,7 @@ storiesOf('ChoiceGroup', module)
       ] }
     />
   ))
-  .add('With images', () => (
+  .add('With default size images', () => (
     <ChoiceGroup
       label='Pick one image'
       defaultSelectedKey='bar'
@@ -86,14 +86,34 @@ storiesOf('ChoiceGroup', module)
           key: 'bar',
           imageSrc: TestImages.choiceGroupBarUnselected,
           selectedImageSrc: TestImages.choiceGroupBarSelected,
-          imageSize: { width: 32, height: 32 },
           text: 'Clustered bar chart'
         },
         {
           key: 'pie',
           imageSrc: TestImages.choiceGroupBarUnselected,
           selectedImageSrc: TestImages.choiceGroupBarSelected,
-          imageSize: { width: 32, height: 32 },
+          text: 'Pie chart'
+        }
+      ] }
+    />
+  ))
+  .add('With large size images', () => (
+    <ChoiceGroup
+      label='Pick one image'
+      defaultSelectedKey='bar'
+      options={ [
+        {
+          key: 'bar2',
+          imageSrc: TestImages.choiceGroupBarUnselected,
+          selectedImageSrc: TestImages.choiceGroupBarSelected,
+          imageSize: { width: 120, height: 120 },
+          text: 'Clustered bar chart'
+        },
+        {
+          key: 'pie2',
+          imageSrc: TestImages.choiceGroupBarUnselected,
+          selectedImageSrc: TestImages.choiceGroupBarSelected,
+          imageSize: { width: 120, height: 120 },
           text: 'Pie chart'
         }
       ] }
diff --git a/common/changes/office-ui-fabric-react/choicegroup-size-refactor_2018-02-08-22-52.json b/common/changes/office-ui-fabric-react/choicegroup-size-refactor_2018-02-08-22-52.json
new file mode 100644
index 0000000000000..a65b37299b160
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/choicegroup-size-refactor_2018-02-08-22-52.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ChoiceGroup: More flexible image field sizing, default image size, large image class.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
index 44b91b2d53912..30e4ed7aa50b5 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
@@ -30,7 +30,6 @@ $radioButton-border-disabled-color: $radioButton-background-unselected-disabled-
 
 $ms-choiceField-field-size: 20px;
 $ms-choiceField-image-size: 32px;
-$ms-choiceField-text-height: 32px;
 $ms-choiceField-iconField-size: 96px;
 $ms-choiceField-transition-duration: 200ms;
 $ms-choiceField-transition-duration-inner: 150ms;
@@ -199,22 +198,20 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
   $radioButtonSpacing: 3px;
   $radioButtonInnerSize: 5px;
 
-  height: $ms-choiceField-iconField-size;
-  width: $ms-choiceField-iconField-size;
-
   .fieldIsImage, .fieldIsIcon {
 
     display: inline-block;
     box-sizing: border-box;
-    min-width: $ms-choiceField-iconField-size;
     cursor: pointer;
     padding-top: 22px;
     margin: 0;
     text-align: center;
     transition: all $ms-choiceField-transition-duration ease;
     border: 2px solid transparent;
-    height: $ms-choiceField-iconField-size;
-    width: $ms-choiceField-iconField-size;
+    justify-content: center;
+    align-items: center;
+    display: flex;
+    flex-direction: column;
 
     &.fieldIsDisabled {
       cursor: default;
@@ -229,11 +226,18 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
       }
     }
 
+    &.imageIsLarge {
+      .innerField {
+        padding-left: 24px;
+        padding-right: 24px;
+      }
+    }
+
     .innerField {
       position: relative;
-      padding: 0 28px;
-      height: $ms-choiceField-image-size;
-      width: $ms-choiceField-image-size;
+      display: inline-block;
+      padding-left: 30px;
+      padding-right: 30px;
 
       .imageWrapper {
         padding-bottom: 2px;
@@ -260,8 +264,8 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
       $lineHeight: 15px;
       display: block;
       position: relative;
-      margin: 4px 0 2px 0;
-      height: $ms-choiceField-text-height;
+      margin: 4px 8px;
+      height: $lineHeight*2;
       line-height: $lineHeight;
       overflow: hidden;
       white-space: pre-wrap;
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
index dd6dae41c0db9..fdd6c3975898e 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
@@ -153,6 +153,8 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
   private _onRenderField(option: IChoiceGroupOption) {
 
     let { onRenderLabel } = option;
+    let imageSize = option.imageSize ? option.imageSize : { width: 32, height: 32 };
+    let imageIsLarge: boolean = imageSize.width > 71 || imageSize.height > 71;
 
     return (
       <label
@@ -161,12 +163,16 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
           ['ms-ChoiceField-field--image ' + styles.fieldIsImage]: !!option.imageSrc,
           ['ms-ChoiceField--icon ' + styles.fieldIsIcon]: !!option.iconProps,
           ['is-checked ' + styles.fieldIsChecked]: option.checked,
-          ['is-disabled ' + styles.fieldIsDisabled]: option.disabled
+          ['is-disabled ' + styles.fieldIsDisabled]: option.disabled,
+          ['is-largeImage ' + styles.imageIsLarge]: !!option.imageSrc && imageIsLarge
         }) }
       >
         {
           option.imageSrc && (
-            <div className={ css('ms-ChoiceField-innerField', styles.innerField) }>
+            <div
+              className={ css('ms-ChoiceField-innerField', styles.innerField) }
+              style={ { height: imageSize.height, width: imageSize.width } }
+            >
               <div
                 className={ css(
                   'ms-ChoiceField-imageWrapper',
@@ -178,8 +184,8 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
                 <Image
                   src={ option.imageSrc }
                   alt={ option.imageAlt ? option.imageAlt : '' }
-                  width={ option.imageSize ? option.imageSize.width : undefined }
-                  height={ option.imageSize ? option.imageSize.height : undefined }
+                  width={ imageSize.width }
+                  height={ imageSize.height }
                 />
               </div>
               <div
@@ -193,8 +199,8 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
                 <Image
                   src={ option.selectedImageSrc }
                   alt={ option.imageAlt ? option.imageAlt : '' }
-                  width={ option.imageSize ? option.imageSize.width : undefined }
-                  height={ option.imageSize ? option.imageSize.height : undefined }
+                  width={ imageSize.width }
+                  height={ imageSize.height }
                 />
               </div>
             </div>
@@ -212,7 +218,10 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
         {
           option.imageSrc || option.iconProps
             ? (
-              <div className={ css('ms-ChoiceField-labelWrapper', styles.labelWrapper) }>
+              <div
+                className={ css('ms-ChoiceField-labelWrapper', styles.labelWrapper) }
+                style={ { maxWidth: imageSize.width * 2 } }
+              >
                 { onRenderLabel!(option) }
               </div>
             ) : onRenderLabel!(option)
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.types.ts b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.types.ts
index 9d1ac742fdcf3..c33df4544c589 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.types.ts
@@ -89,6 +89,7 @@ export interface IChoiceGroupOption extends React.HTMLAttributes<HTMLElement | H
 
   /**
    * The width and height of the image in px for choice field.
+   * @default { width: 32, height: 32 }
    */
   imageSize?: { width: number, height: number };
 

From 52735a2330fe8dcfe381c99c9e41aefcee63410a Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 9 Feb 2018 18:11:53 +0000
Subject: [PATCH 1339/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../MenuKeyboarding_2018-02-08-02-16.json     | 11 --------
 ...egroup-size-refactor_2018-02-08-22-52.json | 11 --------
 ...a-rename-rating-base_2018-02-08-16-38.json | 11 --------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 26 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 14 +++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 12 files changed, 46 insertions(+), 41 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/MenuKeyboarding_2018-02-08-02-16.json
 delete mode 100644 common/changes/office-ui-fabric-react/choicegroup-size-refactor_2018-02-08-22-52.json
 delete mode 100644 common/changes/office-ui-fabric-react/miwhea-rename-rating-base_2018-02-08-16-38.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 500373c55d3ee..21ac7ec53ffac 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.48.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.49.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 0e3cfaff1ce88..faa890ec7e028 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.48.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.49.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 19428dd171722..c63d0a1fe4d74 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.48.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.49.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index ddafba0317992..5c4178e7196e8 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.48.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.49.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 3bf21d9495612..bae45ea1fd243 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.48.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.49.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/office-ui-fabric-react/MenuKeyboarding_2018-02-08-02-16.json b/common/changes/office-ui-fabric-react/MenuKeyboarding_2018-02-08-02-16.json
deleted file mode 100644
index 47ac1877e140f..0000000000000
--- a/common/changes/office-ui-fabric-react/MenuKeyboarding_2018-02-08-02-16.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Allowing for contextual and menus to be closed on Alt keys",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kushaly@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/choicegroup-size-refactor_2018-02-08-22-52.json b/common/changes/office-ui-fabric-react/choicegroup-size-refactor_2018-02-08-22-52.json
deleted file mode 100644
index a65b37299b160..0000000000000
--- a/common/changes/office-ui-fabric-react/choicegroup-size-refactor_2018-02-08-22-52.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ChoiceGroup: More flexible image field sizing, default image size, large image class.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/miwhea-rename-rating-base_2018-02-08-16-38.json b/common/changes/office-ui-fabric-react/miwhea-rename-rating-base_2018-02-08-16-38.json
deleted file mode 100644
index b6ce41b184355..0000000000000
--- a/common/changes/office-ui-fabric-react/miwhea-rename-rating-base_2018-02-08-16-38.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Rating: Renamed RatingBase.tsx to Rating.base.tsx to match convention",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mike@mikewheaton.ca"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 1113863c46148..00eb3d1b4e0de 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.48.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.49.0 <6.0.0",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 7113dade45bdf..47034dc9856db 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.49.0",
+      "tag": "office-ui-fabric-react_v5.49.0",
+      "date": "Fri, 09 Feb 2018 18:11:52 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "c761919891df8df48a02c4cbee2bc18ac8635d55",
+            "comment": "ChoiceGroup: More flexible image field sizing, default image size, large image class."
+          }
+        ],
+        "patch": [
+          {
+            "author": "Kushal Yarlagadda <whykushal93@gmail.com>",
+            "commit": "d716d81c844e366e37d1fdf023c527541a7b6b57",
+            "comment": "Allowing for contextual and menus to be closed on Alt keys"
+          },
+          {
+            "author": "Mike Wheaton <miwhea@microsoft.com>",
+            "commit": "1e22ceeef52c46b7f7bfda9b2d1015664105f6ff",
+            "comment": "Rating: Renamed RatingBase.tsx to Rating.base.tsx to match convention"
+          }
+        ]
+      }
+    },
     {
       "version": "5.48.2",
       "tag": "office-ui-fabric-react_v5.48.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 366d7b27f252b..f5989ebaf02b3 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,18 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 08 Feb 2018 11:13:51 GMT and should not be manually modified.
+This log was last generated on Fri, 09 Feb 2018 18:11:52 GMT and should not be manually modified.
+
+## 5.49.0
+Fri, 09 Feb 2018 18:11:52 GMT
+
+### Minor changes
+
+- ChoiceGroup: More flexible image field sizing, default image size, large image class.
+
+### Patches
+
+- Allowing for contextual and menus to be closed on Alt keys
+- Rating: Renamed RatingBase.tsx to Rating.base.tsx to match convention
 
 ## 5.48.2
 Thu, 08 Feb 2018 11:13:51 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 2cb9066ca5d69..cca8592bd2c6a 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.48.2",
+  "version": "5.49.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From f8550b758c75d4e2a3b47d13873d75c1760efc83 Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Fri, 9 Feb 2018 10:44:39 -0800
Subject: [PATCH 1340/1641] [DetailsList] Header box-sizing (#3874)

* Set box-sizing of DetailsHeader to content-box

* change file

* Update magellan-detailsList_header_box_sizing_2018-02-02-17-58.json
---
 ...etailsList_header_box_sizing_2018-02-02-17-58.json | 11 +++++++++++
 .../src/components/DetailsList/DetailsHeader.scss     |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/magellan-detailsList_header_box_sizing_2018-02-02-17-58.json

diff --git a/common/changes/office-ui-fabric-react/magellan-detailsList_header_box_sizing_2018-02-02-17-58.json b/common/changes/office-ui-fabric-react/magellan-detailsList_header_box_sizing_2018-02-02-17-58.json
new file mode 100644
index 0000000000000..08c35a7a4db99
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/magellan-detailsList_header_box_sizing_2018-02-02-17-58.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: fix disappearing line when hovering on column header",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
index 1b2baea32e403..ccdd8a6f77e35 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
@@ -18,6 +18,7 @@ $isPaddedMargin: 24px;
   height: $rowHeight;
   line-height: $rowHeight;
   white-space: nowrap;
+  box-sizing: content-box;
   padding-bottom: 1px;
   border-bottom: 1px solid $bodyDividerColor;
   cursor: default;

From 669762f89c5c145c215610d043cbf28dbbdcd491 Mon Sep 17 00:00:00 2001
From: Daryl <DarylCantrell@users.noreply.github.com>
Date: Fri, 9 Feb 2018 15:09:46 -0500
Subject: [PATCH 1341/1641] ChevronDown was too dark when CommandBar component
 was disabled (#3901)

---
 .../disabledChevronCSS_2018-02-06-22-19.json          | 11 +++++++++++
 .../src/components/CommandBar/CommandBar.scss         |  3 ++-
 2 files changed, 13 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/disabledChevronCSS_2018-02-06-22-19.json

diff --git a/common/changes/office-ui-fabric-react/disabledChevronCSS_2018-02-06-22-19.json b/common/changes/office-ui-fabric-react/disabledChevronCSS_2018-02-06-22-19.json
new file mode 100644
index 0000000000000..1e63359cb4550
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/disabledChevronCSS_2018-02-06-22-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix issue where CommandBar chevron doesn't change color with rest of control when disabled",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "darylc@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss
index 64842145f3487..b7866ce88a0c8 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss
@@ -114,7 +114,8 @@ $SearchBox-sidePadding: 8px; // padding in input on left and right sides without
     color: $ms-color-neutralTertiaryAlt;
     cursor: default;
     pointer-events: none;
-    .itemIcon {
+    .itemIcon,
+    .itemChevronDown {
       color: $ms-color-neutralTertiaryAlt;
     }
   }

From 8f6920b6ad755a3b0b8fc57a92204e1e8229921e Mon Sep 17 00:00:00 2001
From: Jordan Janzen <jordancjanzen@gmail.com>
Date: Fri, 9 Feb 2018 17:18:53 -0800
Subject: [PATCH 1342/1641] Add update-snapshots script to project root.
 (#3939)

---
 package.json | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/package.json b/package.json
index e0d02cda28eb4..728bc8ebcc2d9 100644
--- a/package.json
+++ b/package.json
@@ -23,10 +23,11 @@
     "generate": "node node_modules/@microsoft/rush/bin/rush generate --force",
     "bundlesize": "cd scripts && npm run bundlesize",
     "create-component": "node scripts/create-component.js",
-    "checkchange": "node node_modules/@microsoft/rush/bin/rush change -v"
+    "checkchange": "node node_modules/@microsoft/rush/bin/rush change -v",
+    "update-snapshots": "cd packages/office-ui-fabric-react && npm run update-snapshots"
   },
   "license": "MIT",
   "devDependencies": {
     "@microsoft/rush": "4.1.0"
   }
-}
+}
\ No newline at end of file

From 28187459f547807741493387dd55fc892988945d Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 12 Feb 2018 11:14:02 +0000
Subject: [PATCH 1343/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../disabledChevronCSS_2018-02-06-22-19.json  | 11 -----------
 ...st_header_box_sizing_2018-02-02-17-58.json | 11 -----------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 11 files changed, 35 insertions(+), 30 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/disabledChevronCSS_2018-02-06-22-19.json
 delete mode 100644 common/changes/office-ui-fabric-react/magellan-detailsList_header_box_sizing_2018-02-02-17-58.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 21ac7ec53ffac..62aa0a88417df 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.49.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.49.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index faa890ec7e028..aecc8645e6d7b 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.49.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.49.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index c63d0a1fe4d74..77ddc5c02fef2 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.49.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.49.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 5c4178e7196e8..205e1b07ebc79 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.49.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.49.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index bae45ea1fd243..71de458bc5e23 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.49.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.49.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/office-ui-fabric-react/disabledChevronCSS_2018-02-06-22-19.json b/common/changes/office-ui-fabric-react/disabledChevronCSS_2018-02-06-22-19.json
deleted file mode 100644
index 1e63359cb4550..0000000000000
--- a/common/changes/office-ui-fabric-react/disabledChevronCSS_2018-02-06-22-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix issue where CommandBar chevron doesn't change color with rest of control when disabled",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "darylc@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/magellan-detailsList_header_box_sizing_2018-02-02-17-58.json b/common/changes/office-ui-fabric-react/magellan-detailsList_header_box_sizing_2018-02-02-17-58.json
deleted file mode 100644
index 08c35a7a4db99..0000000000000
--- a/common/changes/office-ui-fabric-react/magellan-detailsList_header_box_sizing_2018-02-02-17-58.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: fix disappearing line when hovering on column header",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 00eb3d1b4e0de..829311260ad18 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.49.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.49.1 <6.0.0",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 47034dc9856db..11e9d4f859192 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.49.1",
+      "tag": "office-ui-fabric-react_v5.49.1",
+      "date": "Mon, 12 Feb 2018 11:14:02 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Daryl <DarylCantrell@users.noreply.github.com>",
+            "commit": "669762f89c5c145c215610d043cbf28dbbdcd491",
+            "comment": "Fix issue where CommandBar chevron doesn't change color with rest of control when disabled"
+          },
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "f8550b758c75d4e2a3b47d13873d75c1760efc83",
+            "comment": "DetailsList: fix disappearing line when hovering on column header"
+          }
+        ]
+      }
+    },
     {
       "version": "5.49.0",
       "tag": "office-ui-fabric-react_v5.49.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index f5989ebaf02b3..af3a8d47659bf 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 09 Feb 2018 18:11:52 GMT and should not be manually modified.
+This log was last generated on Mon, 12 Feb 2018 11:14:02 GMT and should not be manually modified.
+
+## 5.49.1
+Mon, 12 Feb 2018 11:14:02 GMT
+
+### Patches
+
+- Fix issue where CommandBar chevron doesn't change color with rest of control when disabled
+- DetailsList: fix disappearing line when hovering on column header
 
 ## 5.49.0
 Fri, 09 Feb 2018 18:11:52 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index cca8592bd2c6a..5b75d90edb129 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.49.0",
+  "version": "5.49.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 2514f1588d70c2722baddd0778d4555f18b07dbd Mon Sep 17 00:00:00 2001
From: VincentBailly <vincentbaill@gmail.com>
Date: Mon, 12 Feb 2018 18:05:57 +0100
Subject: [PATCH 1344/1641] The size of a persona is not impacted by the
 presence indicator. (#3845)

* PersonaCoin: presence does not influence layout

* commit change file

* fix persona pill
---
 .../master_2018-01-31-12-27.json              | 11 ++++++
 .../src/components/Persona/Persona.scss       | 34 ++++++++-----------
 .../PeoplePickerItems/PickerItemsDefault.scss |  6 ++--
 3 files changed, 30 insertions(+), 21 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/master_2018-01-31-12-27.json

diff --git a/common/changes/office-ui-fabric-react/master_2018-01-31-12-27.json b/common/changes/office-ui-fabric-react/master_2018-01-31-12-27.json
new file mode 100644
index 0000000000000..46febb419dae8
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2018-01-31-12-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "presence indicator does not influence layout of Persona",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "vibailly@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
index ad5db01649bb7..bd2911c3c36ff 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
@@ -51,7 +51,6 @@ $ms-Persona-presenceBorder: 2px;
   height: $ms-Persona-size48;
   display: flex;
   align-items: center;
-  overflow: hidden;
 
   .contextualHost {
     display: none;
@@ -202,7 +201,7 @@ $ms-Persona-presenceBorder: 2px;
   min-width: $ms-Persona-size10;
 }
 
-.rootIsSize10{
+.rootIsSize10 {
   .imageArea {
     overflow: visible;
     background: transparent;
@@ -266,9 +265,8 @@ $ms-Persona-presenceBorder: 2px;
 //== Modifier: Size 16 Persona
 //
 .root.rootIsSize16 {
-  height: $ms-Persona-size16 + $ms-Persona-presenceBorder;
-  min-width: $ms-Persona-size16  + $ms-Persona-presenceBorder;
-  overflow: hidden;
+  height: $ms-Persona-size16;
+  min-width: $ms-Persona-size16;
 }
 
 .rootIsSize16 {
@@ -312,8 +310,8 @@ $ms-Persona-presenceBorder: 2px;
 //== Modifier: Size 24 Persona
 //
 .root.rootIsSize24 {
-  height: $ms-Persona-size24 + $ms-Persona-presenceBorder;
-  min-width: $ms-Persona-size24 + $ms-Persona-presenceBorder;
+  height: $ms-Persona-size24;
+  min-width: $ms-Persona-size24;
 }
 
 .rootIsSize24 {
@@ -372,13 +370,11 @@ $ms-Persona-presenceBorder: 2px;
   }
 }
 
-
 //== Modifier: Size 28 Persona
 //
 .root.rootIsSize28 {
-  height: $ms-Persona-size28 + $ms-Persona-presenceBorder;
-  min-width: $ms-Persona-size28 + $ms-Persona-presenceBorder;
-  overflow: hidden;
+  height: $ms-Persona-size28;
+  min-width: $ms-Persona-size28;
 }
 
 .rootIsSize28 {
@@ -441,8 +437,8 @@ $ms-Persona-presenceBorder: 2px;
 //== Modifier: Size 32 Persona
 //
 .root.rootIsSize32 {
-  height: $ms-Persona-size32 + $ms-Persona-presenceBorder;
-  min-width: $ms-Persona-size32 + $ms-Persona-presenceBorder;
+  height: $ms-Persona-size32;
+  min-width: $ms-Persona-size32;
 }
 
 .rootIsSize32 {
@@ -495,8 +491,8 @@ $ms-Persona-presenceBorder: 2px;
 //== Modifier: Size 40 Persona
 //
 .root.rootIsSize40 {
-  height: $ms-Persona-size40 + $ms-Persona-presenceBorder;
-  min-width: $ms-Persona-size40 + $ms-Persona-presenceBorder;
+  height: $ms-Persona-size40;
+  min-width: $ms-Persona-size40;
 }
 
 .rootIsSize40 {
@@ -526,8 +522,8 @@ $ms-Persona-presenceBorder: 2px;
 //== Modifier: Size 72 Persona
 //
 .root.rootIsSize72 {
-  height: $ms-Persona-size72 + $ms-Persona-presenceBorder;
-  min-width: $ms-Persona-size72 + $ms-Persona-presenceBorder;
+  height: $ms-Persona-size72;
+  min-width: $ms-Persona-size72;
 }
 
 .rootIsSize72 {
@@ -575,8 +571,8 @@ $ms-Persona-presenceBorder: 2px;
 //== Modifier: Size 100 Persona
 //
 .root.rootIsSize100 {
-  height: $ms-Persona-size100 + $ms-Persona-presenceBorder;
-  min-width: $ms-Persona-size100 + $ms-Persona-presenceBorder;
+  height: $ms-Persona-size100;
+  min-width: $ms-Persona-size100;
 }
 
 .rootIsSize100 {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
index 464c0279e07fc..be82562459d81 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/PickerItemsDefault.scss
@@ -87,9 +87,11 @@
     flex: 0 1 auto;
     min-width: 0px;
 
-    /** CSS below is needed for IE 11 to properly truncate long persona names in the picker **/
+    /** CSS below is needed for IE 11 to properly truncate long persona names in the picker
+     ** and to clip the presence indicator (in all browsers)
+     **/
     max-width: 100%;
-    overflow-x: hidden;
+    overflow: hidden;
   }
 
   .removeButton {

From 27cb18b10d554a01573f6c181c05a12a3bfb26dd Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 12 Feb 2018 17:33:12 +0000
Subject: [PATCH 1345/1641] Applying package updates.

---
 apps/fabric-website/package.json                   |  2 +-
 apps/ssr-tests/package.json                        |  2 +-
 apps/test-bundle-button/package.json               |  2 +-
 apps/todo-app/package.json                         |  2 +-
 apps/vr-tests/package.json                         |  2 +-
 .../master_2018-01-31-12-27.json                   | 11 -----------
 packages/experiments/package.json                  |  2 +-
 packages/office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md       |  9 ++++++++-
 packages/office-ui-fabric-react/package.json       |  2 +-
 10 files changed, 29 insertions(+), 19 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/master_2018-01-31-12-27.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 62aa0a88417df..c8d37c1917b18 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.49.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.49.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index aecc8645e6d7b..2cfbad3498c21 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.49.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.49.2 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 77ddc5c02fef2..5f1d67975b3cb 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.49.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.49.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 205e1b07ebc79..b3f5539cef410 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.49.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.49.2 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 71de458bc5e23..3e6e1fbdc56b1 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.49.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.49.2 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/office-ui-fabric-react/master_2018-01-31-12-27.json b/common/changes/office-ui-fabric-react/master_2018-01-31-12-27.json
deleted file mode 100644
index 46febb419dae8..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2018-01-31-12-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "presence indicator does not influence layout of Persona",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "vibailly@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 829311260ad18..623b171a4002c 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.49.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.49.2 <6.0.0",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 11e9d4f859192..a48ebfa6b3a80 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.49.2",
+      "tag": "office-ui-fabric-react_v5.49.2",
+      "date": "Mon, 12 Feb 2018 17:33:11 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "VincentBailly <vincentbaill@gmail.com>",
+            "commit": "2514f1588d70c2722baddd0778d4555f18b07dbd",
+            "comment": "presence indicator does not influence layout of Persona"
+          }
+        ]
+      }
+    },
     {
       "version": "5.49.1",
       "tag": "office-ui-fabric-react_v5.49.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index af3a8d47659bf..545a97d90e9f3 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 12 Feb 2018 11:14:02 GMT and should not be manually modified.
+This log was last generated on Mon, 12 Feb 2018 17:33:11 GMT and should not be manually modified.
+
+## 5.49.2
+Mon, 12 Feb 2018 17:33:11 GMT
+
+### Patches
+
+- presence indicator does not influence layout of Persona
 
 ## 5.49.1
 Mon, 12 Feb 2018 11:14:02 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 5b75d90edb129..2241edf54a446 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.49.1",
+  "version": "5.49.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 23070cad70c1e18548cf6a07dfa4f27d365db770 Mon Sep 17 00:00:00 2001
From: Joe Martella <martellaj@live.com>
Date: Mon, 12 Feb 2018 11:44:13 -0800
Subject: [PATCH 1346/1641] Moves label outside of DatePicker hit target
 (#3832)

* Moves label outside of DatePicker input

* Adds change file

* Fixes import statement

* Adjusts snapshot for DatePicker test

* Fixes DatePicker story maybe (can't test locally)

* Reverts "Adjusts snapshot for DatePicker test"

This reverts commit a6048d957dcdc0597578abd3e21f806d5382e2c2.

* Reverts "Fixes DatePicker story maybe (can't test locally)"

This reverts commit 1a4077dbb096ae30c70c2bdf1e4b35c94338f95f.

* Only renders Label component if label prop is provided
---
 ...em-fix-datepicker-hit-target_2018-01-29-21-52.json | 11 +++++++++++
 .../src/components/DatePicker/DatePicker.tsx          |  5 ++++-
 2 files changed, 15 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/joem-fix-datepicker-hit-target_2018-01-29-21-52.json

diff --git a/common/changes/office-ui-fabric-react/joem-fix-datepicker-hit-target_2018-01-29-21-52.json b/common/changes/office-ui-fabric-react/joem-fix-datepicker-hit-target_2018-01-29-21-52.json
new file mode 100644
index 0000000000000..a36036eefa442
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/joem-fix-datepicker-hit-target_2018-01-29-21-52.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Moves DatePicker label outside of hit target",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joem@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 35fd4a6ed376e..279c48643e951 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -11,6 +11,7 @@ import { FirstWeekOfYear } from '../../utilities/dateValues/DateValues';
 import { Callout } from '../../Callout';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { TextField } from '../../TextField';
+import { Label } from '../../Label';
 import {
   autobind,
   BaseComponent,
@@ -199,6 +200,9 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
 
     return (
       <div className={ css('ms-DatePicker', styles.root, className) } ref={ this._resolveRef('_root') }>
+        { label && (
+          <Label required={ isRequired }>{ label }</Label>
+        ) }
         <div ref={ this._resolveRef('_datepicker') }>
           <TextField
             className={ styles.textField }
@@ -213,7 +217,6 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
             onClick={ this._onTextFieldClick }
             onChanged={ this._onTextFieldChanged }
             errorMessage={ errorMessage }
-            label={ label }
             placeholder={ placeholder }
             borderless={ borderless }
             iconProps={ {

From 32c4e2529eef487e2c2b69adab8ff85d2fa0d23d Mon Sep 17 00:00:00 2001
From: Jordan Janzen <jordancjanzen@gmail.com>
Date: Mon, 12 Feb 2018 13:41:10 -0800
Subject: [PATCH 1347/1641] Add name attribute to button in pivot (#3849)

* Add name attribute to button in pivot

* npm run change output

* Update snapshot
---
 .../pivot-button-name_2018-01-31-19-51.json           | 11 +++++++++++
 .../src/components/Pivot/Pivot.tsx                    |  1 +
 .../Pivot/__snapshots__/Pivot.test.tsx.snap           |  2 ++
 3 files changed, 14 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/pivot-button-name_2018-01-31-19-51.json

diff --git a/common/changes/office-ui-fabric-react/pivot-button-name_2018-01-31-19-51.json b/common/changes/office-ui-fabric-react/pivot-button-name_2018-01-31-19-51.json
new file mode 100644
index 0000000000000..462b59ca033c4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/pivot-button-name_2018-01-31-19-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add name attribute to button",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-jojanz@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
index 042b75a0625c2..2fad626d665d3 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
@@ -149,6 +149,7 @@ export class Pivot extends BaseComponent<IPivotProps, IPivotState> {
         ariaLabel={ link.ariaLabel }
         role='tab'
         aria-selected={ this.state.selectedKey === itemKey }
+        name={ link.linkText }
       >
         { linkContent }
       </CommandButton>
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap
index 8058f2c9d08bd..ed44a63d7761a 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap
@@ -83,6 +83,7 @@ exports[`Pivot renders Pivot correctly 1`] = `
         data-is-focusable={true}
         disabled={undefined}
         id="Pivot0-Tab0"
+        name=""
         onClick={[Function]}
         onKeyPress={[Function]}
         role="tab"
@@ -176,6 +177,7 @@ exports[`Pivot renders Pivot correctly 1`] = `
         data-is-focusable={true}
         disabled={undefined}
         id="Pivot0-Tab1"
+        name=""
         onClick={[Function]}
         onKeyPress={[Function]}
         role="tab"

From 438d5e33bb2bd7ce92bf6155c1e9766ae665df98 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 12 Feb 2018 14:27:04 -0800
Subject: [PATCH 1348/1641] Changes. (#3949)

---
 apps/vr-tests/src/stories/Image.css         | 4 ----
 apps/vr-tests/src/stories/Image.stories.tsx | 2 --
 2 files changed, 6 deletions(-)
 delete mode 100644 apps/vr-tests/src/stories/Image.css

diff --git a/apps/vr-tests/src/stories/Image.css b/apps/vr-tests/src/stories/Image.css
deleted file mode 100644
index 8e2860d398bec..0000000000000
--- a/apps/vr-tests/src/stories/Image.css
+++ /dev/null
@@ -1,4 +0,0 @@
-.ms-Image {
-  border: 2px solid #aaa;
-  margin-bottom: 20px;
-}
\ No newline at end of file
diff --git a/apps/vr-tests/src/stories/Image.stories.tsx b/apps/vr-tests/src/stories/Image.stories.tsx
index 3263598b35319..c9950f1725517 100644
--- a/apps/vr-tests/src/stories/Image.stories.tsx
+++ b/apps/vr-tests/src/stories/Image.stories.tsx
@@ -5,8 +5,6 @@ import { storiesOf } from '@storybook/react';
 import { FabricDecorator } from '../utilities';
 import { Image, ImageFit, Label, Layer } from 'office-ui-fabric-react';
 
-import './Image.css';
-
 const img350x150 = 'http://placehold.it/350x150';
 
 let imagePropsFitNone = {

From 938be5b0904db106f39b5afdc0bd6a79a78462cd Mon Sep 17 00:00:00 2001
From: Jordan Janzen <jordancjanzen@gmail.com>
Date: Mon, 12 Feb 2018 14:30:21 -0800
Subject: [PATCH 1349/1641] Export IClassNames from Utilities (#3938)

* Export IClassNames

* npm run change output
---
 ...t-IClassNames-from-utilities_2018-02-12-18-07.json | 11 +++++++++++
 packages/utilities/src/index.ts                       |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/@uifabric/utilities/fix-export-IClassNames-from-utilities_2018-02-12-18-07.json

diff --git a/common/changes/@uifabric/utilities/fix-export-IClassNames-from-utilities_2018-02-12-18-07.json b/common/changes/@uifabric/utilities/fix-export-IClassNames-from-utilities_2018-02-12-18-07.json
new file mode 100644
index 0000000000000..31bd9bfe99bbc
--- /dev/null
+++ b/common/changes/@uifabric/utilities/fix-export-IClassNames-from-utilities_2018-02-12-18-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Export IClassNames fro Utilities for creating private getClassNames methods",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "v-jojanz@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/src/index.ts b/packages/utilities/src/index.ts
index 6349375a6812c..ef210f20ebc26 100644
--- a/packages/utilities/src/index.ts
+++ b/packages/utilities/src/index.ts
@@ -8,6 +8,7 @@ export * from './DelayedRender';
 export * from './EventGroup';
 export * from './FabricPerformance';
 export * from './GlobalSettings';
+export * from './IClassNames';
 export * from './IDisposable';
 export * from './IPoint';
 export * from './IRectangle';

From 8dc2a79a815874d6bb26d867a49b9f46809397e1 Mon Sep 17 00:00:00 2001
From: chang47 <coralbue@gmail.com>
Date: Mon, 12 Feb 2018 14:53:36 -0800
Subject: [PATCH 1350/1641] Contextual Menu Item - Passing Extra Information
 For MenuItem OnRender (#3878)

* added new aria types for contextual menu

* add change files

* added other passed in values

* added all selector

* used all prop selector; changes comments

* removed reference to new posinset and setsize props

* removed aray of aria set size for contextual menu
---
 .../accContextualMenu_2018-02-03-00-25.json           | 11 +++++++++++
 .../src/components/ContextualMenu/ContextualMenu.tsx  |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/accContextualMenu_2018-02-03-00-25.json

diff --git a/common/changes/office-ui-fabric-react/accContextualMenu_2018-02-03-00-25.json b/common/changes/office-ui-fabric-react/accContextualMenu_2018-02-03-00-25.json
new file mode 100644
index 0000000000000..5def6f81b68fd
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/accContextualMenu_2018-02-03-00-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Contextual Menu - adding support for aria-setsize and aria-posinset for rendering menu items that relies on the menu item's own rendering",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chiechan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index a1457b818c094..a3ddeb26e95dc 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -443,7 +443,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
   private _renderNormalItem(item: IContextualMenuItem, classNames: IMenuItemClassNames, index: number, focusableElementIndex: number, totalItemCount: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
     if (item.onRender) {
-      return [item.onRender(item, this.dismiss)];
+      return [item.onRender({ 'aria-posinset': focusableElementIndex, 'aria-setsize': totalItemCount, ...item }, this.dismiss)];
     }
     if (item.href) {
       return this._renderAnchorMenuItem(item, classNames, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons);

From df97b5a0492a46943c2a434b5b74dd2fe939cd98 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 13 Feb 2018 11:24:05 +0000
Subject: [PATCH 1351/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 ...Names-from-utilities_2018-02-12-18-07.json | 11 -------
 .../accContextualMenu_2018-02-03-00-25.json   | 11 -------
 ...atepicker-hit-target_2018-01-29-21-52.json | 11 -------
 .../pivot-button-name_2018-01-31-19-51.json   | 11 -------
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 29 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 11 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 +++++++++
 packages/utilities/CHANGELOG.md               |  9 +++++-
 packages/utilities/package.json               |  2 +-
 14 files changed, 68 insertions(+), 53 deletions(-)
 delete mode 100644 common/changes/@uifabric/utilities/fix-export-IClassNames-from-utilities_2018-02-12-18-07.json
 delete mode 100644 common/changes/office-ui-fabric-react/accContextualMenu_2018-02-03-00-25.json
 delete mode 100644 common/changes/office-ui-fabric-react/joem-fix-datepicker-hit-target_2018-01-29-21-52.json
 delete mode 100644 common/changes/office-ui-fabric-react/pivot-button-name_2018-01-31-19-51.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index c8d37c1917b18..f3642517a61d9 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.49.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.49.3 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/fix-export-IClassNames-from-utilities_2018-02-12-18-07.json b/common/changes/@uifabric/utilities/fix-export-IClassNames-from-utilities_2018-02-12-18-07.json
deleted file mode 100644
index 31bd9bfe99bbc..0000000000000
--- a/common/changes/@uifabric/utilities/fix-export-IClassNames-from-utilities_2018-02-12-18-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Export IClassNames fro Utilities for creating private getClassNames methods",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "v-jojanz@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/accContextualMenu_2018-02-03-00-25.json b/common/changes/office-ui-fabric-react/accContextualMenu_2018-02-03-00-25.json
deleted file mode 100644
index 5def6f81b68fd..0000000000000
--- a/common/changes/office-ui-fabric-react/accContextualMenu_2018-02-03-00-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Contextual Menu - adding support for aria-setsize and aria-posinset for rendering menu items that relies on the menu item's own rendering",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chiechan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/joem-fix-datepicker-hit-target_2018-01-29-21-52.json b/common/changes/office-ui-fabric-react/joem-fix-datepicker-hit-target_2018-01-29-21-52.json
deleted file mode 100644
index a36036eefa442..0000000000000
--- a/common/changes/office-ui-fabric-react/joem-fix-datepicker-hit-target_2018-01-29-21-52.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Moves DatePicker label outside of hit target",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joem@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/pivot-button-name_2018-01-31-19-51.json b/common/changes/office-ui-fabric-react/pivot-button-name_2018-01-31-19-51.json
deleted file mode 100644
index 462b59ca033c4..0000000000000
--- a/common/changes/office-ui-fabric-react/pivot-button-name_2018-01-31-19-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add name attribute to button",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-jojanz@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index a4e33e8ba924d..3eb561aaa93d9 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.17.0 <6.0.0",
-    "@uifabric/utilities": ">=5.10.2 <6.0.0",
+    "@uifabric/utilities": ">=5.10.3 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 623b171a4002c..d18955e50d366 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.49.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.49.3 <6.0.0",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index a48ebfa6b3a80..b41fd6b8d553f 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,35 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.49.3",
+      "tag": "office-ui-fabric-react_v5.49.3",
+      "date": "Tue, 13 Feb 2018 11:24:05 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "chang47 <coralbue@gmail.com>",
+            "commit": "8dc2a79a815874d6bb26d867a49b9f46809397e1",
+            "comment": "Contextual Menu - adding support for aria-setsize and aria-posinset for rendering menu items that relies on the menu item's own rendering"
+          },
+          {
+            "author": "Joe Martella <martellaj@live.com>",
+            "commit": "23070cad70c1e18548cf6a07dfa4f27d365db770",
+            "comment": "Moves DatePicker label outside of hit target"
+          },
+          {
+            "author": "Jordan Janzen <jordancjanzen@gmail.com>",
+            "commit": "32c4e2529eef487e2c2b69adab8ff85d2fa0d23d",
+            "comment": "Add name attribute to button"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.10.2 <6.0.0` to `>=5.10.3 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.49.2",
       "tag": "office-ui-fabric-react_v5.49.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 545a97d90e9f3..0836e4400d56e 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,15 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 12 Feb 2018 17:33:11 GMT and should not be manually modified.
+This log was last generated on Tue, 13 Feb 2018 11:24:05 GMT and should not be manually modified.
+
+## 5.49.3
+Tue, 13 Feb 2018 11:24:05 GMT
+
+### Patches
+
+- Contextual Menu - adding support for aria-setsize and aria-posinset for rendering menu items that relies on the menu item's own rendering
+- Moves DatePicker label outside of hit target
+- Add name attribute to button
 
 ## 5.49.2
 Mon, 12 Feb 2018 17:33:11 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 2241edf54a446..3ea66672f13cf 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.49.2",
+  "version": "5.49.3",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -51,7 +51,7 @@
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "@uifabric/merge-styles": ">=5.11.2 <6.0.0",
     "@uifabric/styling": ">=5.17.0 <6.0.0",
-    "@uifabric/utilities": ">=5.10.2 <6.0.0",
+    "@uifabric/utilities": ">=5.10.3 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index cc8e6438a5587..e1b1a76707421 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.10.2 <6.0.0",
+    "@uifabric/utilities": ">=5.10.3 <6.0.0",
     "@uifabric/merge-styles": ">=5.11.2 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 51ed09a3a2b62..0ba610d4e9254 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.10.3",
+      "tag": "@uifabric/utilities_v5.10.3",
+      "date": "Tue, 13 Feb 2018 11:24:05 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jordan Janzen <jordancjanzen@gmail.com>",
+            "commit": "938be5b0904db106f39b5afdc0bd6a79a78462cd",
+            "comment": "Export IClassNames fro Utilities for creating private getClassNames methods"
+          }
+        ]
+      }
+    },
     {
       "version": "5.10.2",
       "tag": "@uifabric/utilities_v5.10.2",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 17c3172de70e6..aae80a486f4e8 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Thu, 08 Feb 2018 11:13:51 GMT and should not be manually modified.
+This log was last generated on Tue, 13 Feb 2018 11:24:05 GMT and should not be manually modified.
+
+## 5.10.3
+Tue, 13 Feb 2018 11:24:05 GMT
+
+### Patches
+
+- Export IClassNames fro Utilities for creating private getClassNames methods
 
 ## 5.10.2
 Thu, 08 Feb 2018 11:13:51 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 5d36a0cab3b7b..d90650bf7bebe 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.10.2",
+  "version": "5.10.3",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From a006e35c5baa75505241c09719d5c3d5f6e49047 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 13 Feb 2018 11:15:34 -0800
Subject: [PATCH 1352/1641] Updating shrinkwrap, including latest screener
 package. (#3957)

* updating shrinkwrap.

* Updating deps.

* bundle size bump to address 54 bytes.
---
 apps/vr-tests/package.json             |    2 +-
 common/config/rush/npm-shrinkwrap.json | 3133 +++++++++++++++---------
 scripts/package.json                   |    4 +-
 3 files changed, 2003 insertions(+), 1136 deletions(-)

diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 3e6e1fbdc56b1..62fc519d8f2bf 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -23,7 +23,7 @@
     "style-loader": "^0.19.0",
     "awesome-typescript-loader": "^3.2.3",
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0",
-    "screener-storybook": "^0.9.2",
+    "screener-storybook": "^0.11.1",
     "screener-runner": "^0.6.19",
     "storybook-readme": "=3.0.6"
   },
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 2abaf9ca0411e..3e9de58cf5e67 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -4,18 +4,13 @@
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
-    "@hypnosphi/fuse.js": {
-      "version": "3.0.9",
-      "resolved": "https://registry.npmjs.org/@hypnosphi/fuse.js/-/fuse.js-3.0.9.tgz",
-      "integrity": "sha1-6pn2EhtKjwZbTHH4VZXbJxRJiAc="
-    },
     "@microsoft/api-extractor": {
-      "version": "4.3.4",
-      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-4.3.4.tgz",
-      "integrity": "sha1-YLgRx/KPIVPpM2qS26p06RWiA/Q=",
+      "version": "4.3.7",
+      "resolved": "https://registry.npmjs.org/@microsoft/api-extractor/-/api-extractor-4.3.7.tgz",
+      "integrity": "sha1-lwkA2yt7qjbQxTzmS6eZfMAri3o=",
       "requires": {
-        "@microsoft/node-core-library": "0.3.21",
-        "@microsoft/ts-command-line": "2.2.9",
+        "@microsoft/node-core-library": "0.3.24",
+        "@microsoft/ts-command-line": "2.2.12",
         "@types/fs-extra": "0.0.37",
         "@types/node": "6.0.88",
         "@types/z-schema": "3.16.31",
@@ -40,23 +35,23 @@
       }
     },
     "@microsoft/load-themed-styles": {
-      "version": "1.7.14",
-      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.14.tgz",
-      "integrity": "sha1-94a/GDCgjx4973fPHgd7WbX1K0A="
+      "version": "1.7.29",
+      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.29.tgz",
+      "integrity": "sha1-KG8rZZsgFbC5VRcrdYsNvVvzalw="
     },
     "@microsoft/loader-load-themed-styles": {
-      "version": "1.6.9",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.6.9.tgz",
-      "integrity": "sha1-y/ydLav1P8tnNcGogtMLURPtiWg=",
+      "version": "1.7.10",
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.7.10.tgz",
+      "integrity": "sha1-nvH6PAF2eZ1++f/QpWekYj1RY6g=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.14",
+        "@microsoft/load-themed-styles": "1.7.29",
         "loader-utils": "1.1.0"
       }
     },
     "@microsoft/node-core-library": {
-      "version": "0.3.21",
-      "resolved": "https://registry.npmjs.org/@microsoft/node-core-library/-/node-core-library-0.3.21.tgz",
-      "integrity": "sha1-jBt2IAW65+7DK3jw0LksdCAgTXI=",
+      "version": "0.3.24",
+      "resolved": "https://registry.npmjs.org/@microsoft/node-core-library/-/node-core-library-0.3.24.tgz",
+      "integrity": "sha1-GnbISyDF+kgnmFJIphmvEHmMqyw=",
       "requires": {
         "@types/fs-extra": "0.0.37",
         "@types/node": "6.0.88",
@@ -74,9 +69,9 @@
       }
     },
     "@microsoft/ts-command-line": {
-      "version": "2.2.9",
-      "resolved": "https://registry.npmjs.org/@microsoft/ts-command-line/-/ts-command-line-2.2.9.tgz",
-      "integrity": "sha1-lKiqVYrXQFqBp10oARbspgw9Tuo=",
+      "version": "2.2.12",
+      "resolved": "https://registry.npmjs.org/@microsoft/ts-command-line/-/ts-command-line-2.2.12.tgz",
+      "integrity": "sha1-bNvP8KxY9DUsKRXnNeQKtviRBrA=",
       "requires": {
         "@types/argparse": "1.0.33",
         "@types/node": "6.0.88",
@@ -93,18 +88,18 @@
     },
     "@rush-temp/build": {
       "version": "file:projects/build.tgz",
-      "integrity": "sha1-w/7BKfX9iJm7TQC9hTv5Dzugs7o=",
+      "integrity": "sha1-b/0rm0AlrCQ72dOpittRoaChESA=",
       "requires": {
-        "@microsoft/api-extractor": "4.3.4",
-        "@microsoft/load-themed-styles": "1.7.14",
-        "@microsoft/loader-load-themed-styles": "1.6.9",
-        "autoprefixer": "7.2.3",
+        "@microsoft/api-extractor": "4.3.7",
+        "@microsoft/load-themed-styles": "1.7.29",
+        "@microsoft/loader-load-themed-styles": "1.7.10",
+        "autoprefixer": "7.2.6",
         "awesome-typescript-loader": "3.4.1",
         "bundlesize": "0.15.3",
-        "chalk": "2.3.0",
+        "chalk": "2.3.1",
         "command-line-args": "4.0.7",
         "cpx": "1.5.0",
-        "css-loader": "0.28.7",
+        "css-loader": "0.28.9",
         "github": "7.3.2",
         "glob": "7.1.2",
         "gzip-size": "3.0.0",
@@ -113,8 +108,8 @@
         "mustache": "2.3.0",
         "node-sass": "4.7.2",
         "open": "0.0.5",
-        "postcss": "6.0.14",
-        "postcss-loader": "2.0.9",
+        "postcss": "6.0.17",
+        "postcss-loader": "2.1.0",
         "postcss-modules": "0.8.0",
         "raf": "3.4.0",
         "raw-loader": "0.5.1",
@@ -122,20 +117,20 @@
         "source-map-loader": "0.2.3",
         "style-loader": "0.19.1",
         "ts-jest": "21.2.4",
-        "tslint": "5.8.0",
-        "tslint-microsoft-contrib": "5.0.1",
+        "tslint": "5.9.1",
+        "tslint-microsoft-contrib": "5.0.2",
         "typescript": "2.6.2",
         "uglifyjs-webpack-plugin": "0.4.6",
-        "webpack": "3.10.0",
-        "webpack-bundle-analyzer": "2.9.1",
-        "webpack-dev-server": "2.9.7",
-        "webpack-notifier": "1.5.0",
+        "webpack": "3.11.0",
+        "webpack-bundle-analyzer": "2.10.0",
+        "webpack-dev-server": "2.11.1",
+        "webpack-notifier": "1.5.1",
         "yargs": "6.6.0"
       }
     },
     "@rush-temp/example-app-base": {
       "version": "file:projects/example-app-base.tgz",
-      "integrity": "sha1-yv/gcJU5bSKdZDTXrlZiwqyhgOc=",
+      "integrity": "sha1-LV6ExSpkKngD93QHjMXpAU1X2Ak=",
       "requires": {
         "@types/es6-promise": "0.0.32",
         "@types/highlight.js": "9.12.2",
@@ -143,20 +138,20 @@
         "@types/react-dom": "16.0.3",
         "@types/webpack-env": "1.13.0",
         "es6-map": "0.1.5",
-        "es6-promise": "4.1.1",
+        "es6-promise": "4.2.4",
         "es6-weak-map": "2.0.2",
         "highlight.js": "9.12.0",
-        "office-ui-fabric-react": "5.33.1",
+        "office-ui-fabric-react": "5.49.2",
         "react": "16.2.0",
         "react-dom": "16.2.0",
-        "tslib": "1.8.1"
+        "tslib": "1.9.0"
       }
     },
     "@rush-temp/experiments": {
       "version": "file:projects/experiments.tgz",
-      "integrity": "sha1-YEUlDKp26ZYNmnnZ98ZjxkfyfcU=",
+      "integrity": "sha1-UaWwyEGM5mXZNeweA2POBGayJPg=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.14",
+        "@microsoft/load-themed-styles": "1.7.29",
         "@types/enzyme": "3.1.5",
         "@types/enzyme-adapter-react-16": "1.0.1",
         "@types/es6-promise": "0.0.32",
@@ -165,27 +160,27 @@
         "@types/react": "16.0.25",
         "@types/react-addons-test-utils": "0.14.18",
         "@types/react-dom": "16.0.3",
-        "@types/react-test-renderer": "16.0.0",
+        "@types/react-test-renderer": "16.0.1",
         "@types/resemblejs": "1.3.28",
         "@types/sinon": "2.2.2",
         "@types/webpack-env": "1.13.0",
-        "enzyme": "3.2.0",
-        "enzyme-adapter-react-16": "1.1.0",
+        "enzyme": "3.3.0",
+        "enzyme-adapter-react-16": "1.1.1",
         "es6-weak-map": "2.0.2",
         "prop-types": "15.6.0",
         "react": "16.2.0",
         "react-dom": "16.2.0",
         "react-highlight": "0.10.0",
         "react-test-renderer": "16.2.0",
-        "sinon": "4.1.3",
-        "tslib": "1.8.1"
+        "sinon": "4.3.0",
+        "tslib": "1.9.0"
       }
     },
     "@rush-temp/fabric-website": {
       "version": "file:projects/fabric-website.tgz",
-      "integrity": "sha1-gYsXsKWTmM+W9uqrQeIiMpcSjIY=",
+      "integrity": "sha1-nGJiE4jMIhiQ48ra19peu7WL3FY=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.14",
+        "@microsoft/load-themed-styles": "1.7.29",
         "@types/es6-promise": "0.0.32",
         "@types/node": "8.0.26",
         "@types/prop-types": "15.5.2",
@@ -194,56 +189,56 @@
         "@types/resemblejs": "1.3.28",
         "@types/webpack-env": "1.13.0",
         "color-functions": "1.1.0",
-        "es6-promise": "4.1.1",
+        "es6-promise": "4.2.4",
         "es6-weak-map": "2.0.2",
         "highlight.js": "9.12.0",
         "json-loader": "0.5.7",
-        "office-ui-fabric-core": "9.3.0",
+        "office-ui-fabric-core": "9.4.0",
         "react": "16.2.0",
         "react-dom": "16.2.0",
         "react-highlight": "0.10.0",
-        "tslib": "1.8.1",
+        "tslib": "1.9.0",
         "write-file-webpack-plugin": "4.2.0"
       }
     },
     "@rush-temp/file-type-icons": {
       "version": "file:projects/file-type-icons.tgz",
-      "integrity": "sha1-iodhc0X0kWDVfFEa1EXIbJlBAkg=",
+      "integrity": "sha1-WNiMlnuaua8SYuo1Moc5JiK60z4=",
       "requires": {
         "@types/react": "16.0.25",
         "@types/react-dom": "16.0.3",
         "react": "16.2.0",
         "react-dom": "16.2.0",
-        "tslib": "1.8.1"
+        "tslib": "1.9.0"
       }
     },
     "@rush-temp/icons": {
       "version": "file:projects/icons.tgz",
-      "integrity": "sha1-h1sg1jJD+9BQBWnTZGky86SthHU=",
+      "integrity": "sha1-C9GkDWFFIVRO+gLcom+N2JnUGes=",
       "requires": {
-        "tslib": "1.8.1"
+        "tslib": "1.9.0"
       }
     },
     "@rush-temp/jest-serializer-merge-styles": {
       "version": "file:projects/jest-serializer-merge-styles.tgz",
-      "integrity": "sha1-7yqvQu+aqWCLHvTvFA9SKYaTAIM=",
+      "integrity": "sha1-+MCeidPU9OKloQmiGdGozBtl0t4=",
       "requires": {
         "@types/jest": "21.1.8"
       }
     },
     "@rush-temp/merge-styles": {
       "version": "file:projects/merge-styles.tgz",
-      "integrity": "sha1-wrp/z/fR48MjQ7UM2pHEM4fZJpg=",
+      "integrity": "sha1-3KNQc0lwQRpSzAXHg8p9tYmt61c=",
       "requires": {
         "@types/jest": "21.1.8",
-        "tslib": "1.8.1"
+        "tslib": "1.9.0"
       }
     },
     "@rush-temp/office-ui-fabric-react": {
       "version": "file:projects/office-ui-fabric-react.tgz",
-      "integrity": "sha1-OQC5rWWFkJt2uAakLsUkrdaoUAk=",
+      "integrity": "sha1-MND9Li663/9tbmFYfmNQxhoGxxU=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.14",
+        "@microsoft/load-themed-styles": "1.7.29",
         "@types/enzyme": "3.1.5",
         "@types/enzyme-adapter-react-16": "1.0.1",
         "@types/es6-promise": "0.0.32",
@@ -251,56 +246,56 @@
         "@types/prop-types": "15.5.2",
         "@types/react": "16.0.25",
         "@types/react-dom": "16.0.3",
-        "@types/react-test-renderer": "16.0.0",
+        "@types/react-test-renderer": "16.0.1",
         "@types/resemblejs": "1.3.28",
         "@types/sinon": "2.2.2",
         "@types/webpack-env": "1.13.0",
-        "enzyme": "3.2.0",
-        "enzyme-adapter-react-16": "1.1.0",
+        "enzyme": "3.3.0",
+        "enzyme-adapter-react-16": "1.1.1",
         "es6-map": "0.1.5",
-        "es6-promise": "4.1.1",
+        "es6-promise": "4.2.4",
         "es6-weak-map": "2.0.2",
         "highlight.js": "9.12.0",
-        "office-ui-fabric-core": "9.3.0",
+        "office-ui-fabric-core": "9.4.0",
         "prop-types": "15.6.0",
         "react": "16.2.0",
         "react-dom": "16.2.0",
         "react-highlight": "0.10.0",
         "react-test-renderer": "16.2.0",
         "resemblejs": "2.2.6",
-        "sinon": "4.1.3",
-        "tslib": "1.8.1"
+        "sinon": "4.3.0",
+        "tslib": "1.9.0"
       }
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
       "version": "file:projects/office-ui-fabric-react-tslint.tgz",
-      "integrity": "sha1-WhVDndm+8A91sOhaSJP4DoVcWUs=",
+      "integrity": "sha1-wfJIcEzB9c1v+5eNV5c8kMoVfTQ=",
       "requires": {
-        "tslint-react": "3.2.0"
+        "tslint-react": "3.5.0"
       }
     },
     "@rush-temp/ssr-tests": {
       "version": "file:projects/ssr-tests.tgz",
-      "integrity": "sha1-lTlFe2tuN/0ZkkB9qZcy+hcoMP0=",
+      "integrity": "sha1-Ww9vJarq435YVGT/pb2F5l94PXA=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.14",
+        "@microsoft/load-themed-styles": "1.7.29",
         "@types/es6-promise": "0.0.32",
         "@types/mocha": "2.2.39",
         "@types/webpack-env": "1.13.0",
-        "es6-promise": "4.1.1",
+        "es6-promise": "4.2.4",
         "mocha": "3.5.3",
         "raw-loader": "0.5.1",
         "react": "16.2.0",
         "react-dom": "16.2.0",
-        "tslib": "1.8.1",
-        "webpack": "3.10.0"
+        "tslib": "1.9.0",
+        "webpack": "3.11.0"
       }
     },
     "@rush-temp/styling": {
       "version": "file:projects/styling.tgz",
-      "integrity": "sha1-5ZFIqOTdmEnfFV4YvdtxwfzZgoo=",
+      "integrity": "sha1-SSb9aI6B3V9iwyZjAr7ZSmwsYN8=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.14",
+        "@microsoft/load-themed-styles": "1.7.29",
         "@types/jest": "21.1.8",
         "@types/react": "16.0.25",
         "@types/webpack-env": "1.13.0",
@@ -308,12 +303,12 @@
         "es6-weak-map": "2.0.2",
         "react": "16.2.0",
         "react-dom": "16.2.0",
-        "tslib": "1.8.1"
+        "tslib": "1.9.0"
       }
     },
     "@rush-temp/test-bundle-button": {
       "version": "file:projects/test-bundle-button.tgz",
-      "integrity": "sha1-Y2JNJ5HZUs1pH2q6Xui4Sz4IMy0=",
+      "integrity": "sha1-lN0tQocYh2OEZCa5P/K85OXzjkI=",
       "requires": {
         "@types/prop-types": "15.5.2",
         "@types/react": "16.0.25",
@@ -321,31 +316,31 @@
         "@types/webpack-env": "1.13.0",
         "react": "16.2.0",
         "react-dom": "16.2.0",
-        "tslib": "1.8.1"
+        "tslib": "1.9.0"
       }
     },
     "@rush-temp/todo-app": {
       "version": "file:projects/todo-app.tgz",
-      "integrity": "sha1-Iqd75WQ6efvycKDtaFlYUU465eA=",
+      "integrity": "sha1-nre4a9QdHlXZFhtK6PBPHVuM8Gc=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.14",
+        "@microsoft/load-themed-styles": "1.7.29",
         "@types/es6-promise": "0.0.32",
         "@types/react": "16.0.25",
         "@types/react-dom": "16.0.3",
         "@types/webpack-env": "1.13.0",
-        "es6-promise": "4.1.1",
+        "es6-promise": "4.2.4",
         "immutability-helper": "2.6.4",
         "react": "16.2.0",
         "react-dom": "16.2.0",
-        "tslib": "1.8.1",
+        "tslib": "1.9.0",
         "typescript": "2.6.2"
       }
     },
     "@rush-temp/utilities": {
       "version": "file:projects/utilities.tgz",
-      "integrity": "sha1-luCc+RU7XhQ8TdzZ/AIuHYh9Or4=",
+      "integrity": "sha1-GNjb2ebTodto0adRpvjnRiR8S9w=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.14",
+        "@microsoft/load-themed-styles": "1.7.29",
         "@types/enzyme": "3.1.5",
         "@types/enzyme-adapter-react-16": "1.0.1",
         "@types/jest": "21.1.8",
@@ -353,58 +348,68 @@
         "@types/react": "16.0.25",
         "@types/react-dom": "16.0.3",
         "@types/sinon": "2.2.2",
-        "enzyme": "3.2.0",
-        "enzyme-adapter-react-16": "1.1.0",
+        "enzyme": "3.3.0",
+        "enzyme-adapter-react-16": "1.1.1",
         "prop-types": "15.6.0",
         "react": "16.2.0",
         "react-dom": "16.2.0",
-        "sinon": "4.1.3",
-        "tslib": "1.8.1"
+        "sinon": "4.3.0",
+        "tslib": "1.9.0"
       }
     },
     "@rush-temp/vr-tests": {
       "version": "file:projects/vr-tests.tgz",
-      "integrity": "sha1-ZBRZ+Dnb2VRC5EVyPHdbe7DcQ4E=",
+      "integrity": "sha1-W2Vs4MI7qoJFVlZlraVkhB5t3jM=",
       "requires": {
         "@storybook/addon-options": "3.2.3",
-        "@storybook/react": "3.2.17",
+        "@storybook/react": "3.3.13",
         "@types/react": "16.0.25",
         "@types/react-dom": "16.0.3",
         "@types/storybook__react": "3.0.5",
         "awesome-typescript-loader": "3.4.1",
-        "css-loader": "0.28.7",
+        "css-loader": "0.28.9",
         "file-loader": "0.11.2",
-        "postcss-loader": "2.0.9",
+        "postcss-loader": "2.1.0",
         "raw-loader": "0.5.1",
         "react": "16.2.0",
         "react-dom": "16.2.0",
         "screener-runner": "0.6.19",
-        "screener-storybook": "0.9.15",
+        "screener-storybook": "0.11.1",
         "storybook-readme": "3.0.6",
         "style-loader": "0.19.1",
-        "tslib": "1.8.1",
+        "tslib": "1.9.0",
         "typescript": "2.6.2"
       }
     },
+    "@sinonjs/formatio": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@sinonjs/formatio/-/formatio-2.0.0.tgz",
+      "integrity": "sha512-ls6CAMA6/5gG+O/IdsBcblvnd8qcO/l1TYoNeAzp3wcISOxlPXQEus0mLcdwazEkWjaBdaJ3TaxmNgCLWwvWzg==",
+      "requires": {
+        "samsam": "1.3.0"
+      }
+    },
     "@storybook/addon-actions": {
-      "version": "3.2.17",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-actions/-/addon-actions-3.2.17.tgz",
-      "integrity": "sha512-B4++4+p6zWTeTBzqe9lgzT8J0onaMfSZsBRJpa5URoDo3d4kTq+DTDs2qHhhTKJb2Drtu24/JlEgJG7lv0Fb0w==",
+      "version": "3.3.13",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-actions/-/addon-actions-3.3.13.tgz",
+      "integrity": "sha512-fceT2O3tXkeSHZJI/sh51FXpaBiWuGwjfFKDn8e4QAJrEeA4Ig59AQeoiWMMy1RdgPooUXuQvg7WKCvWj/IBWQ==",
       "requires": {
-        "@storybook/addons": "3.2.17",
         "deep-equal": "1.0.1",
-        "json-stringify-safe": "5.0.1",
+        "global": "4.3.2",
+        "make-error": "1.3.3",
         "prop-types": "15.6.0",
         "react-inspector": "2.2.2",
-        "uuid": "3.1.0"
+        "uuid": "3.2.1"
       }
     },
     "@storybook/addon-links": {
-      "version": "3.2.17",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-links/-/addon-links-3.2.17.tgz",
-      "integrity": "sha512-AdCH9DsbOfiMDv42/l0Zfk2yhiBrlWuzHk7ubhSwqF3/61sXr+BWFv+SlOx2oFfSWAT7zfg2sC7Wr+us8gs7GQ==",
+      "version": "3.3.13",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-links/-/addon-links-3.3.13.tgz",
+      "integrity": "sha512-9xfz46SV+0PrLPcP2UWR+ajGiK6fjH8SAiEaFIM9hAwY7Xe5DefpS0A49dRdZ2UPxTohuzGJAlS5J2MXCeWEUg==",
       "requires": {
-        "@storybook/addons": "3.2.17"
+        "@storybook/components": "3.3.13",
+        "global": "4.3.2",
+        "prop-types": "15.6.0"
       }
     },
     "@storybook/addon-options": {
@@ -412,36 +417,41 @@
       "resolved": "https://registry.npmjs.org/@storybook/addon-options/-/addon-options-3.2.3.tgz",
       "integrity": "sha1-6jdA0onUKc52fpaZvzpkfddBWS0=",
       "requires": {
-        "@storybook/addons": "3.2.17"
+        "@storybook/addons": "3.3.13"
       }
     },
     "@storybook/addons": {
-      "version": "3.2.17",
-      "resolved": "https://registry.npmjs.org/@storybook/addons/-/addons-3.2.17.tgz",
-      "integrity": "sha512-1/Ux++3hMfYqAgBwgWbGtGAM0CfSdAchf//wDLBUmX09+E5CjiQvW3YwVplNYzfRuAsSrE1GOYJRAsz639oTYQ=="
+      "version": "3.3.13",
+      "resolved": "https://registry.npmjs.org/@storybook/addons/-/addons-3.3.13.tgz",
+      "integrity": "sha512-c7LNVMQbpvGdWiW6D9tONlM/DA6pIMJ0IkO9JT89Of1gLwFAJyKVQKGOYBzcKa1G0I0qzzmdXAc9lzCfmGYKMg=="
     },
     "@storybook/channel-postmessage": {
-      "version": "3.2.17",
-      "resolved": "https://registry.npmjs.org/@storybook/channel-postmessage/-/channel-postmessage-3.2.17.tgz",
-      "integrity": "sha512-sNlXcHTKM6aIxRsQMaMbowsAToYRlbeP/THqulVxoRRKNDPndNnZe/Lu3eSjBjAfNWBLRFfgX903adt82QAPCA==",
+      "version": "3.3.13",
+      "resolved": "https://registry.npmjs.org/@storybook/channel-postmessage/-/channel-postmessage-3.3.13.tgz",
+      "integrity": "sha512-WiEN4wlL07eOq5aE0j60jECH6ppCKeyJqC+qqeRoDoRRY7OlJFpKXuZnhmV6TKGIDgvtsNBSCg6DhfytuQMGJw==",
       "requires": {
-        "@storybook/channels": "3.2.17",
+        "@storybook/channels": "3.3.13",
         "global": "4.3.2",
         "json-stringify-safe": "5.0.1"
       }
     },
     "@storybook/channels": {
-      "version": "3.2.17",
-      "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-3.2.17.tgz",
-      "integrity": "sha512-HIdRmFTFVLcbrwYFf6+LyAlgcd57ki+6DDTmcvXQTHCWrOOCJKwfKjHgn6tbnHlGHiWByA8lAdO1bFcYhHxl4Q=="
+      "version": "3.3.13",
+      "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-3.3.13.tgz",
+      "integrity": "sha512-e4eHNogqLpUxb/imixsQDt4sa/kOLKQb3EBatQ8DCzUpLdPgZJnJRElcMic/mjJ33Wowb/wtSi3dR44SDKz+ww=="
+    },
+    "@storybook/client-logger": {
+      "version": "3.3.13",
+      "resolved": "https://registry.npmjs.org/@storybook/client-logger/-/client-logger-3.3.13.tgz",
+      "integrity": "sha512-fFBy7C/5j5vkYCVNcMzLpkP4hppcmO4ixPGoHkMxD5HMseBa2wRnOWIFsWti9hhGTh6mEIV86VRTySN25mIKDg=="
     },
     "@storybook/components": {
-      "version": "3.2.17",
-      "resolved": "https://registry.npmjs.org/@storybook/components/-/components-3.2.17.tgz",
-      "integrity": "sha512-pXwNKLavYCu18B2EynFu9EKXlKi0LDo0B/KctbJvidxR5ubzqkZu9h2ti3hPPVomR2DQiRx61Vzqd7cbcyy14w==",
+      "version": "3.3.13",
+      "resolved": "https://registry.npmjs.org/@storybook/components/-/components-3.3.13.tgz",
+      "integrity": "sha512-htNVEUfW//Xw9RfXtNExDnVEJaHVIA4U08tsfKHOaCkeA3urpPkSZD9+4SCLixw2IYodbolbFWphaqBk1yrQDw==",
       "requires": {
         "glamor": "2.20.40",
-        "glamorous": "4.11.0",
+        "glamorous": "4.11.4",
         "prop-types": "15.6.0"
       }
     },
@@ -455,96 +465,133 @@
         "babel-runtime": "6.26.0"
       }
     },
+    "@storybook/node-logger": {
+      "version": "3.3.13",
+      "resolved": "https://registry.npmjs.org/@storybook/node-logger/-/node-logger-3.3.13.tgz",
+      "integrity": "sha512-kKiCudlOJOt64+nq3uw96NdjxSGHOU6DXEVGC4TkjU8Q8BEigWiKNmitQjuk7yCodKtjIl9SUMQ/y3PzqKVAkg==",
+      "requires": {
+        "chalk": "2.3.1",
+        "npmlog": "4.1.2"
+      }
+    },
     "@storybook/react": {
-      "version": "3.2.17",
-      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-3.2.17.tgz",
-      "integrity": "sha512-1bZXP0wGdlTgRiGsTLQ90G0Swx+Re7o3IAblOdobS/E5fREzEC1zEHdSQYC5ROUoWDLourqcF/zo4I9HpKvnZg==",
-      "requires": {
-        "@storybook/addon-actions": "3.2.17",
-        "@storybook/addon-links": "3.2.17",
-        "@storybook/addons": "3.2.17",
-        "@storybook/channel-postmessage": "3.2.17",
-        "@storybook/ui": "3.2.17",
-        "airbnb-js-shims": "1.4.0",
-        "autoprefixer": "7.2.3",
-        "babel-core": "6.26.0",
+      "version": "3.3.13",
+      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-3.3.13.tgz",
+      "integrity": "sha512-h+WmeTqsylG+X9KMHfIAm1ZbVJMYbXdZuvTkPz0Nns7t9yrTWd877dtZIOKzTHhA4GUxgla2qPYy7dF2+vsJtA==",
+      "requires": {
+        "@storybook/addon-actions": "3.3.13",
+        "@storybook/addon-links": "3.3.13",
+        "@storybook/addons": "3.3.13",
+        "@storybook/channel-postmessage": "3.3.13",
+        "@storybook/client-logger": "3.3.13",
+        "@storybook/node-logger": "3.3.13",
+        "@storybook/ui": "3.3.13",
+        "airbnb-js-shims": "1.4.1",
+        "autoprefixer": "7.2.6",
         "babel-loader": "7.1.2",
-        "babel-plugin-react-docgen": "1.8.1",
+        "babel-plugin-react-docgen": "1.8.2",
         "babel-plugin-transform-regenerator": "6.26.0",
         "babel-plugin-transform-runtime": "6.23.0",
         "babel-preset-env": "1.6.1",
         "babel-preset-minify": "0.2.0",
         "babel-preset-react": "6.24.1",
-        "babel-preset-react-app": "3.1.0",
+        "babel-preset-react-app": "3.1.1",
         "babel-preset-stage-0": "6.24.1",
         "babel-runtime": "6.26.0",
         "case-sensitive-paths-webpack-plugin": "2.1.1",
-        "chalk": "2.3.0",
-        "commander": "2.12.2",
-        "common-tags": "1.5.1",
+        "chalk": "2.3.1",
+        "commander": "2.14.1",
+        "common-tags": "1.7.2",
         "configstore": "3.1.1",
         "core-js": "2.5.3",
-        "css-loader": "0.28.7",
+        "css-loader": "0.28.9",
         "dotenv-webpack": "1.5.4",
         "express": "4.16.2",
-        "file-loader": "1.1.5",
+        "file-loader": "1.1.6",
         "find-cache-dir": "1.0.0",
         "glamor": "2.20.40",
-        "glamorous": "4.11.0",
+        "glamorous": "4.11.4",
         "global": "4.3.2",
+        "html-loader": "0.5.5",
+        "html-webpack-plugin": "2.30.1",
         "json-loader": "0.5.7",
         "json-stringify-safe": "5.0.1",
         "json5": "0.5.1",
         "lodash.flattendeep": "4.4.0",
-        "lodash.pick": "4.4.0",
-        "postcss-flexbugs-fixes": "3.2.0",
-        "postcss-loader": "2.0.9",
+        "markdown-loader": "2.0.2",
+        "npmlog": "4.1.2",
+        "postcss-flexbugs-fixes": "3.3.0",
+        "postcss-loader": "2.1.0",
         "prop-types": "15.6.0",
         "qs": "6.5.1",
         "redux": "3.7.2",
         "request": "2.83.0",
         "serve-favicon": "2.4.5",
         "shelljs": "0.7.8",
-        "style-loader": "0.18.2",
+        "style-loader": "0.19.1",
+        "uglifyjs-webpack-plugin": "1.1.8",
         "url-loader": "0.6.2",
         "util-deprecate": "1.0.2",
-        "uuid": "3.1.0",
-        "webpack": "3.10.0",
+        "uuid": "3.2.1",
+        "webpack": "3.11.0",
         "webpack-dev-middleware": "1.12.2",
         "webpack-hot-middleware": "2.21.0"
       },
       "dependencies": {
         "file-loader": {
-          "version": "1.1.5",
-          "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-1.1.5.tgz",
-          "integrity": "sha512-RzGHDatcVNpGISTvCpfUfOGpYuSR7HSsSg87ki+wF6rw1Hm0RALPTiAdsxAq1UwLf0RRhbe22/eHK6nhXspiOQ==",
+          "version": "1.1.6",
+          "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-1.1.6.tgz",
+          "integrity": "sha512-873ztuL+/hfvXbLDJ262PGO6XjERnybJu2gW1/5j8HUfxSiFJI9Hj/DhZ50ZGRUxBvuNiazb/cM2rh9pqrxP6Q==",
           "requires": {
             "loader-utils": "1.1.0",
             "schema-utils": "0.3.0"
           }
         },
-        "style-loader": {
-          "version": "0.18.2",
-          "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.18.2.tgz",
-          "integrity": "sha512-WPpJPZGUxWYHWIUMNNOYqql7zh85zGmr84FdTVWq52WTIkqlW9xSxD3QYWi/T31cqn9UNSsietVEgGn2aaSCzw==",
+        "schema-utils": {
+          "version": "0.3.0",
+          "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-0.3.0.tgz",
+          "integrity": "sha1-9YdyIs4+kx7a4DnxfrNxbnE3+M8=",
           "requires": {
-            "loader-utils": "1.1.0",
-            "schema-utils": "0.3.0"
+            "ajv": "5.5.2"
+          }
+        },
+        "uglify-es": {
+          "version": "3.3.10",
+          "resolved": "https://registry.npmjs.org/uglify-es/-/uglify-es-3.3.10.tgz",
+          "integrity": "sha512-rPzPisCzW68Okj1zNrfa2dR9uEm43SevDmpR6FChoZABFk9dANGnzzBMgHYUXI3609//63fnVkyQ1SQmAMyjww==",
+          "requires": {
+            "commander": "2.14.1",
+            "source-map": "0.6.1"
+          }
+        },
+        "uglifyjs-webpack-plugin": {
+          "version": "1.1.8",
+          "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-1.1.8.tgz",
+          "integrity": "sha512-XG8/QmR1pyPeE1kj2aigo5kos8umefB31zW+PMvAAytHSB0T/vQvN6sqt8+Sh+y0b0A7zlmxNi2dzRnj0wcqGA==",
+          "requires": {
+            "cacache": "10.0.2",
+            "find-cache-dir": "1.0.0",
+            "schema-utils": "0.4.3",
+            "serialize-javascript": "1.4.0",
+            "source-map": "0.6.1",
+            "uglify-es": "3.3.10",
+            "webpack-sources": "1.1.0",
+            "worker-farm": "1.5.2"
+          },
+          "dependencies": {
+            "schema-utils": {
+              "version": "0.4.3",
+              "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-0.4.3.tgz",
+              "integrity": "sha512-sgv/iF/T4/SewJkaVpldKC4WjSkz0JsOh2eKtxCPpCO1oR05+7MOF+H476HVRbLArkgA7j5TRJJ4p2jdFkUGQQ==",
+              "requires": {
+                "ajv": "5.5.2",
+                "ajv-keywords": "2.1.1"
+              }
+            }
           }
         }
       }
     },
-    "@storybook/react-fuzzy": {
-      "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/@storybook/react-fuzzy/-/react-fuzzy-0.4.3.tgz",
-      "integrity": "sha512-TaFbDiEc/34eiAFyOjyvrh5tOqoKscyVH2BHJB15cQ8RepccX3LKIBqSNr7IUi1jmMB5aWjeefvJywPQf13ByQ==",
-      "requires": {
-        "babel-runtime": "6.26.0",
-        "classnames": "2.2.5",
-        "fuse.js": "3.2.0",
-        "prop-types": "15.6.0"
-      }
-    },
     "@storybook/react-komposer": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/@storybook/react-komposer/-/react-komposer-2.0.3.tgz",
@@ -563,7 +610,7 @@
       "integrity": "sha512-RH6gPQaYMs/VzQX2dgbZU8DQMKFXVOv1ruohHjjNPys4q+YdqMFMDe5jOP1AUE3j9g01x0eW7bVjRawSpl++Ew==",
       "requires": {
         "babel-runtime": "6.26.0",
-        "create-react-class": "15.6.2",
+        "create-react-class": "15.6.3",
         "hoist-non-react-statics": "1.2.0",
         "prop-types": "15.6.0"
       }
@@ -577,18 +624,17 @@
       }
     },
     "@storybook/ui": {
-      "version": "3.2.17",
-      "resolved": "https://registry.npmjs.org/@storybook/ui/-/ui-3.2.17.tgz",
-      "integrity": "sha512-At0oWWTALJrJhtdnP+0AMANBC5omIBnEg3Pin3M0+yzUy6Poelcvt8+81dQEKLBP6LiyFOVpiDjfqpiHR5l0ow==",
+      "version": "3.3.13",
+      "resolved": "https://registry.npmjs.org/@storybook/ui/-/ui-3.3.13.tgz",
+      "integrity": "sha512-ecmu9l0Pr2PyZ6gWcK+AW0ZHNCQ1t1FkYm7JIYXWpAP0cBQ6EtvEoQLowzJ9GXw5s/s4hwdHmoxJ8j2SRuUulw==",
       "requires": {
-        "@hypnosphi/fuse.js": "3.0.9",
-        "@storybook/components": "3.2.17",
+        "@storybook/components": "3.3.13",
         "@storybook/mantra-core": "1.7.2",
-        "@storybook/react-fuzzy": "0.4.3",
         "@storybook/react-komposer": "2.0.3",
         "babel-runtime": "6.26.0",
         "deep-equal": "1.0.1",
         "events": "1.1.1",
+        "fuse.js": "3.2.0",
         "global": "4.3.2",
         "json-stringify-safe": "5.0.1",
         "keycode": "2.1.9",
@@ -598,10 +644,11 @@
         "podda": "1.2.2",
         "prop-types": "15.6.0",
         "qs": "6.5.1",
+        "react-fuzzy": "0.5.1",
         "react-icons": "2.2.7",
         "react-inspector": "2.2.2",
-        "react-modal": "3.1.8",
-        "react-split-pane": "0.1.71",
+        "react-modal": "3.1.13",
+        "react-split-pane": "0.1.77",
         "react-treebeard": "2.1.0",
         "redux": "3.7.2"
       }
@@ -612,16 +659,16 @@
       "integrity": "sha512-VQgHxyPMTj3hIlq9SY1mctqx+Jj8kpQfoLvDlVSDNOyuYs8JYfkuY3OW/4+dO657yPmNhHpePRx0/Tje5ImNVQ=="
     },
     "@types/cheerio": {
-      "version": "0.22.6",
-      "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.6.tgz",
-      "integrity": "sha512-Nyk3Gut4CMFZOebvutYAk/Nis7d6u9b7VX4OcG4zUX5gnKnXMiq+8EPdcX7FVakeL4+t770iy8E46W8ZSSXeFA=="
+      "version": "0.22.7",
+      "resolved": "https://registry.npmjs.org/@types/cheerio/-/cheerio-0.22.7.tgz",
+      "integrity": "sha512-+T9qBbqe/jXtTjzVddArZExahoPPmt8eq3O1ZuCKZXjBVxf/ciUYNXrIDZJEVgYvpELnv6VlPRCfLzufRxpAag=="
     },
     "@types/enzyme": {
       "version": "3.1.5",
       "resolved": "https://registry.npmjs.org/@types/enzyme/-/enzyme-3.1.5.tgz",
       "integrity": "sha512-f1HnxoBnHsK+mcjF6xAofaewv+vPrMtBdxAQuRyO4MltIJV20nf9EVILPBJqfl6/9Gbf9ygbxv4bmwCY9CFsnQ==",
       "requires": {
-        "@types/cheerio": "0.22.6",
+        "@types/cheerio": "0.22.7",
         "@types/react": "16.0.25"
       }
     },
@@ -651,11 +698,6 @@
       "resolved": "https://registry.npmjs.org/@types/highlight.js/-/highlight.js-9.12.2.tgz",
       "integrity": "sha512-y5x0XD/WXDaGSyiTaTcKS4FurULJtSiYbGTeQd0m2LYZGBcZZ/7fM6t5H/DzeUF+kv8y6UfmF6yJABQsHcp9VQ=="
     },
-    "@types/inline-style-prefixer": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/@types/inline-style-prefixer/-/inline-style-prefixer-3.0.1.tgz",
-      "integrity": "sha512-+kbOcYW1/noncDwRryRoB9tH87IYcMfdBGvw98iocK39LtTA2DFL7agmk4UHW/GxjzVfwrxfjlLrqrgA7MCtmg=="
-    },
     "@types/jest": {
       "version": "21.1.8",
       "resolved": "https://registry.npmjs.org/@types/jest/-/jest-21.1.8.tgz",
@@ -699,9 +741,9 @@
       }
     },
     "@types/react-test-renderer": {
-      "version": "16.0.0",
-      "resolved": "https://registry.npmjs.org/@types/react-test-renderer/-/react-test-renderer-16.0.0.tgz",
-      "integrity": "sha512-tbuDajGYu8tEBAGVXZqh0Hmfm+pZA9P+4UfMIWTvzO4PA8yBbL2TCsZNSky+S74oAKy96Z/PBdDTj22iPMYqcQ==",
+      "version": "16.0.1",
+      "resolved": "https://registry.npmjs.org/@types/react-test-renderer/-/react-test-renderer-16.0.1.tgz",
+      "integrity": "sha512-kmNh8g67Ck/y/vp6KX+4JTJXiTGLZBylNhu+R7sm7zcvsrnIGVO6J1zew5inVg428j9f8yHpl68RcYOZXVborQ==",
       "requires": {
         "@types/react": "16.0.25"
       }
@@ -736,42 +778,42 @@
       "integrity": "sha1-LrHQCl5Ow/pYx2r94S4YK2bcXBw="
     },
     "@uifabric/icons": {
-      "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.3.0.tgz",
-      "integrity": "sha512-3jh++ktFidYimHCnnJLMAFHbVvCLABTrU1ikii5FmfdqYpwYL5mOBdRgyCBCAUcQn+w3fXfn+TREM5PXa2Ihzg==",
+      "version": "5.4.2",
+      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.4.2.tgz",
+      "integrity": "sha512-JG0euHlQhcVsI9wCfKE/DYDoDjzQNcHDg2Wh1NeFeVPz/6L0s0D7Izw2ULkZgW1TCLFcNx0xdwN+SSnGjIlTkw==",
       "requires": {
-        "@uifabric/styling": "5.14.0",
-        "tslib": "1.8.1"
+        "@uifabric/styling": "5.17.0",
+        "tslib": "1.9.0"
       }
     },
     "@uifabric/merge-styles": {
-      "version": "5.8.1",
-      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.8.1.tgz",
-      "integrity": "sha512-mgxb0rMwxJ7LfrPjF4dSUAPJkamlGCjKxzd5nR0wSxde9/k0Sw3zcf4BoefrbR03jnVkdtDXfj1rpq2yYbXXoA==",
+      "version": "5.11.2",
+      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.11.2.tgz",
+      "integrity": "sha512-Qipbhp1J+yyBSAEDCGWjuv2mdkIEwRFB9qr8kNCew/8t4TNt2V2O8GbMjIqj0ieCOyj8M11rlALOGThOY91z0w==",
       "requires": {
-        "tslib": "1.8.1"
+        "tslib": "1.9.0"
       }
     },
     "@uifabric/styling": {
-      "version": "5.14.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.14.0.tgz",
-      "integrity": "sha512-xHW/KuMMFbvr5z3+YRzUlz/yizDdUEh9MW2kzF0D1Omg1Jdfjg6qrDTVPifuyNQTbW9nCiAnb2lX4f0DEl/tuQ==",
+      "version": "5.17.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.17.0.tgz",
+      "integrity": "sha512-FXw7GQEaGGkfEXnGJFSKgbk+uzlM+1PFYwb4BnxlscsXQe1sdmqCKYmY2XrAIdwywfQAZA3t6zshn/EjE+eS7g==",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.14",
-        "@uifabric/merge-styles": "5.8.1",
-        "@uifabric/utilities": "5.5.0",
-        "tslib": "1.8.1"
+        "@microsoft/load-themed-styles": "1.7.29",
+        "@uifabric/merge-styles": "5.11.2",
+        "@uifabric/utilities": "5.10.2",
+        "tslib": "1.9.0"
       }
     },
     "@uifabric/utilities": {
-      "version": "5.5.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.5.0.tgz",
-      "integrity": "sha512-+U5gM9s9ue1zKYXlguzOHMl/NSYNvPZre7/LLH5RLfrBYJwkddUZ5AOFDD3xRT6nwpRhb5fPSJaJldAakFVY8Q==",
+      "version": "5.10.2",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.10.2.tgz",
+      "integrity": "sha512-mKJYVydBEekrBSDn8VDIafIWiqL82WnigdTSv2ooo3v4ClJc39zbV1NLWXC4T6RLSTZHIi/W4CTudtWOtdVcAA==",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.14",
-        "@uifabric/merge-styles": "5.8.1",
+        "@microsoft/load-themed-styles": "1.7.29",
+        "@uifabric/merge-styles": "5.11.2",
         "prop-types": "15.6.0",
-        "tslib": "1.8.1"
+        "tslib": "1.9.0"
       }
     },
     "abab": {
@@ -831,16 +873,16 @@
       }
     },
     "airbnb-js-shims": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/airbnb-js-shims/-/airbnb-js-shims-1.4.0.tgz",
-      "integrity": "sha512-KIlW3epMtB1x3PtJr2L7ltkoYvuKzjqrgZPq6mzJUL6Gz+3Y2Oc9FS9ZRzRWym2/jk1r+JsDOOyS2Vavc0E3Pw==",
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/airbnb-js-shims/-/airbnb-js-shims-1.4.1.tgz",
+      "integrity": "sha512-b7S3d+DPRMwaDAs0cgKQTMLO/JG/iSehIlzEGvt2FpxIztRDDABEjWI73AfTxkSiK3/OsraPRYxVNAX3yhSNLw==",
       "requires": {
         "array-includes": "3.0.3",
-        "array.prototype.flatmap": "1.1.1",
-        "array.prototype.flatten": "1.1.1",
-        "es5-shim": "4.5.9",
+        "array.prototype.flatmap": "1.2.0",
+        "array.prototype.flatten": "1.2.0",
+        "es5-shim": "4.5.10",
         "es6-shim": "0.35.3",
-        "function.prototype.name": "1.0.3",
+        "function.prototype.name": "1.1.0",
         "object.entries": "1.0.4",
         "object.getownpropertydescriptors": "2.0.3",
         "object.values": "1.0.4",
@@ -850,9 +892,9 @@
       }
     },
     "ajv": {
-      "version": "5.5.1",
-      "resolved": "https://registry.npmjs.org/ajv/-/ajv-5.5.1.tgz",
-      "integrity": "sha1-s4u4h22ehr7plJVqBOch6IskjrI=",
+      "version": "5.5.2",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-5.5.2.tgz",
+      "integrity": "sha1-c7Xuyj+rZT49P5Qis0GtQiBdyWU=",
       "requires": {
         "co": "4.6.0",
         "fast-deep-equal": "1.0.0",
@@ -918,11 +960,6 @@
         "color-convert": "1.9.1"
       }
     },
-    "ansicolors": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/ansicolors/-/ansicolors-0.2.1.tgz",
-      "integrity": "sha1-vgiVmQl7dKXJxKhKDNvNtivYeu8="
-    },
     "anymatch": {
       "version": "1.3.2",
       "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-1.3.2.tgz",
@@ -1020,7 +1057,7 @@
       "integrity": "sha1-u13KOCu5TwXhUZQ3PRb9O6HKEQ0=",
       "requires": {
         "delegates": "1.0.0",
-        "readable-stream": "2.3.3"
+        "readable-stream": "2.3.4"
       }
     },
     "argparse": {
@@ -1117,9 +1154,9 @@
       "integrity": "sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg="
     },
     "array.prototype.flatmap": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/array.prototype.flatmap/-/array.prototype.flatmap-1.1.1.tgz",
-      "integrity": "sha512-LYxij5OIk/e1wxCPu0Ng1Rtqpe3c1FmfQ/uS/2HGk9GfySnzEpJ4N8eKJgnTCI3PSBBsNNwbUORetjs7B+3oLA==",
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/array.prototype.flatmap/-/array.prototype.flatmap-1.2.0.tgz",
+      "integrity": "sha512-Mks+PkOK0iOmxq0WtINn1rlPmFC8ZTdLq37MzgZG7ihF5eF+cT29H9MZ6TqbBvxGFLArGwuMxXl/DQjeNI3zeQ==",
       "requires": {
         "define-properties": "1.1.2",
         "es-abstract": "1.10.0",
@@ -1127,9 +1164,9 @@
       }
     },
     "array.prototype.flatten": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/array.prototype.flatten/-/array.prototype.flatten-1.1.1.tgz",
-      "integrity": "sha512-9DM+ZgShl2O01ERvRiEqljn+UAOn5yUwvfdrhM/NBLxuh98+MN/6SyBpvIpJBA0UcUuayRl/5BhmZ4TyjlHqyg==",
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/array.prototype.flatten/-/array.prototype.flatten-1.2.0.tgz",
+      "integrity": "sha512-GfDeDMS9gFiKtJrtJVPljbUQowQoo5X+TTGjMTAxZL1qs4xq758+R1QxRS6dToM4YHk8Mf/L0INMHOsF9hmHGw==",
       "requires": {
         "define-properties": "1.1.2",
         "es-abstract": "1.10.0",
@@ -1174,6 +1211,11 @@
       "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
       "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
     },
+    "assign-symbols": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/assign-symbols/-/assign-symbols-1.0.0.tgz",
+      "integrity": "sha1-WWZ/QfrdTyDMvCu5a41Pf3jsA2c="
+    },
     "ast-types": {
       "version": "0.10.1",
       "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.10.1.tgz",
@@ -1223,15 +1265,15 @@
       "integrity": "sha1-NCQX2PLzRhsUzwkIjV7fh5HcmDI="
     },
     "autoprefixer": {
-      "version": "7.2.3",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-7.2.3.tgz",
-      "integrity": "sha512-dqzVGiz3v934+s3YZA6nk7tAs9xuTz5wMJbX1M+L4cY/MTNkOUqP61c1GWkEVlUL/PEy1pKRSCFuoRZrXYx9qA==",
+      "version": "7.2.6",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-7.2.6.tgz",
+      "integrity": "sha512-Iq8TRIB+/9eQ8rbGhcP7ct5cYb/3qjNYAR2SnzLCEcwF6rvVOax8+9+fccgXk4bEhQGjOZd5TLhsksmAdsbGqQ==",
       "requires": {
-        "browserslist": "2.10.0",
-        "caniuse-lite": "1.0.30000783",
+        "browserslist": "2.11.3",
+        "caniuse-lite": "1.0.30000808",
         "normalize-range": "0.1.2",
         "num2fraction": "1.2.2",
-        "postcss": "6.0.14",
+        "postcss": "6.0.17",
         "postcss-value-parser": "3.3.0"
       }
     },
@@ -1243,17 +1285,17 @@
         "colors": "1.1.2",
         "enhanced-resolve": "3.3.0",
         "loader-utils": "1.1.0",
-        "lodash": "4.17.4",
-        "micromatch": "3.1.4",
+        "lodash": "4.17.5",
+        "micromatch": "3.1.5",
         "mkdirp": "0.5.1",
         "object-assign": "4.1.1",
         "source-map-support": "0.4.18"
       },
       "dependencies": {
         "lodash": {
-          "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
         }
       }
     },
@@ -1272,7 +1314,7 @@
       "resolved": "https://registry.npmjs.org/axios/-/axios-0.16.2.tgz",
       "integrity": "sha1-uk+S8XFn37q0CYN4VFS5rBScPG0=",
       "requires": {
-        "follow-redirects": "1.2.6",
+        "follow-redirects": "1.4.1",
         "is-buffer": "1.1.6"
       }
     },
@@ -1316,7 +1358,7 @@
       "integrity": "sha1-rzL3izGm/O8RnIew/Y2XU/A6C7g=",
       "requires": {
         "babel-code-frame": "6.26.0",
-        "babel-generator": "6.26.0",
+        "babel-generator": "6.26.1",
         "babel-helpers": "6.24.1",
         "babel-messages": "6.23.0",
         "babel-register": "6.26.0",
@@ -1328,7 +1370,7 @@
         "convert-source-map": "1.5.1",
         "debug": "2.6.9",
         "json5": "0.5.1",
-        "lodash": "4.17.4",
+        "lodash": "4.17.5",
         "minimatch": "3.0.4",
         "path-is-absolute": "1.0.1",
         "private": "0.1.8",
@@ -1337,9 +1379,9 @@
       },
       "dependencies": {
         "lodash": {
-          "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
         },
         "source-map": {
           "version": "0.5.7",
@@ -1349,16 +1391,16 @@
       }
     },
     "babel-generator": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-generator/-/babel-generator-6.26.0.tgz",
-      "integrity": "sha1-rBriAHC3n248odMmlhMFN3TyDcU=",
+      "version": "6.26.1",
+      "resolved": "https://registry.npmjs.org/babel-generator/-/babel-generator-6.26.1.tgz",
+      "integrity": "sha512-HyfwY6ApZj7BYTcJURpM5tznulaBvyio7/0d4zFOeMPUmfxkCjHocCuoLa2SAGzBI8AREcH3eP3758F672DppA==",
       "requires": {
         "babel-messages": "6.23.0",
         "babel-runtime": "6.26.0",
         "babel-types": "6.26.0",
         "detect-indent": "4.0.0",
         "jsesc": "1.3.0",
-        "lodash": "4.17.4",
+        "lodash": "4.17.5",
         "source-map": "0.5.7",
         "trim-right": "1.0.1"
       },
@@ -1369,9 +1411,9 @@
           "integrity": "sha1-RsP+yMGJKxKwgz25vHYiF226s0s="
         },
         "lodash": {
-          "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
         },
         "source-map": {
           "version": "0.5.7",
@@ -1429,13 +1471,13 @@
         "babel-helper-function-name": "6.24.1",
         "babel-runtime": "6.26.0",
         "babel-types": "6.26.0",
-        "lodash": "4.17.4"
+        "lodash": "4.17.5"
       },
       "dependencies": {
         "lodash": {
-          "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
         }
       }
     },
@@ -1531,13 +1573,13 @@
       "requires": {
         "babel-runtime": "6.26.0",
         "babel-types": "6.26.0",
-        "lodash": "4.17.4"
+        "lodash": "4.17.5"
       },
       "dependencies": {
         "lodash": {
-          "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
         }
       }
     },
@@ -1730,13 +1772,20 @@
       }
     },
     "babel-plugin-react-docgen": {
-      "version": "1.8.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-react-docgen/-/babel-plugin-react-docgen-1.8.1.tgz",
-      "integrity": "sha512-11Yxwk8/iEULr+n5DG0BxXD6j/9htpiiR0/hLfi/gtEAK/d6NCNkyKFrC8loQcyMvF3hehPo30SKXG/itSX+hw==",
+      "version": "1.8.2",
+      "resolved": "https://registry.npmjs.org/babel-plugin-react-docgen/-/babel-plugin-react-docgen-1.8.2.tgz",
+      "integrity": "sha512-201wzLbDeeZri6p+KREqspsFA8rNV6SiVx65jiPC6lhM7TUTNcbEoacFHbB6ou8ONsQT3phTqLpd5Nl02mZaqw==",
       "requires": {
         "babel-types": "6.26.0",
-        "lodash": "4.15.0",
+        "lodash": "4.17.5",
         "react-docgen": "2.20.0"
+      },
+      "dependencies": {
+        "lodash": {
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
+        }
       }
     },
     "babel-plugin-syntax-async-functions": {
@@ -1896,13 +1945,13 @@
         "babel-template": "6.26.0",
         "babel-traverse": "6.26.0",
         "babel-types": "6.26.0",
-        "lodash": "4.17.4"
+        "lodash": "4.17.5"
       },
       "dependencies": {
         "lodash": {
-          "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
         }
       }
     },
@@ -2145,19 +2194,19 @@
       "integrity": "sha512-GlhOuLOQ28ua9prg0hT33HslCrEmz9xWXy9ZNZSACppCyRxxRW+haYtRgm7uYXCcd0q8ggCWD2pfWEJp5iiZfQ=="
     },
     "babel-plugin-transform-member-expression-literals": {
-      "version": "6.8.5",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-member-expression-literals/-/babel-plugin-transform-member-expression-literals-6.8.5.tgz",
-      "integrity": "sha512-Ux3ligf+ukzWaCbBYOstDuFBhRgMiJHlpJBKV4P47qtzVkd0lg1ddPj9fqIJqAM0n+CvxipyrZrnNnw3CdtQCg=="
+      "version": "6.9.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-member-expression-literals/-/babel-plugin-transform-member-expression-literals-6.9.0.tgz",
+      "integrity": "sha512-bxtac+8w755ctVeDs4vU98RhWY49eW1wO02HAN+eirZYSKk/dVrKONIznXbHmxWKxT4UX1rpTKOCyezuzLpbTw=="
     },
     "babel-plugin-transform-merge-sibling-variables": {
-      "version": "6.8.6",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-merge-sibling-variables/-/babel-plugin-transform-merge-sibling-variables-6.8.6.tgz",
-      "integrity": "sha512-o5Jioq553HtEAUN5uty7ELJMenXIxHI3PIs1yLqYWYQwP6mg6IPVAJ+U7i4zr9XGF/kb2RGsdehglGTV+vngqA=="
+      "version": "6.9.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-merge-sibling-variables/-/babel-plugin-transform-merge-sibling-variables-6.9.0.tgz",
+      "integrity": "sha512-9G1URVEEKoQLDqe0GwqYudECN7kE/q0OCNo5TiD1iwWnnaKi97xY915l5r2KKUvNflXEm9c3faNWknSXYQ7h6Q=="
     },
     "babel-plugin-transform-minify-booleans": {
-      "version": "6.8.3",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-minify-booleans/-/babel-plugin-transform-minify-booleans-6.8.3.tgz",
-      "integrity": "sha512-bPbUhkeN2Nc0KH0/A19GwQGj8w+CvdJzyu8t59VoEDgsNMQ9Bopzi5DrVkrSsVjbYUaZpzq/DYLrH+wD5K2Tig=="
+      "version": "6.9.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-minify-booleans/-/babel-plugin-transform-minify-booleans-6.9.0.tgz",
+      "integrity": "sha512-JtpyTRyF+wF/r7GSxpRbNCrVve5M/aCC8xoGcnFItaPUDqjxKmFYvBzMc9u+g0lgo8NWjuZLc16MYaIwkHKD/A=="
     },
     "babel-plugin-transform-object-rest-spread": {
       "version": "6.26.0",
@@ -2169,9 +2218,9 @@
       }
     },
     "babel-plugin-transform-property-literals": {
-      "version": "6.8.5",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-property-literals/-/babel-plugin-transform-property-literals-6.8.5.tgz",
-      "integrity": "sha512-MmiQsQ5AcIaRZMJD0zY5C4H3xuHm06/nWgtOsz7AXV44VEIXIlPiJ39IFYJ4Qx67/fEm8zJAedzR8t+B7d10Bg==",
+      "version": "6.9.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-property-literals/-/babel-plugin-transform-property-literals-6.9.0.tgz",
+      "integrity": "sha512-B8s+71+4DPye9+pmZiPGgLPy3YqcmIuvE/9UcZLczPlwL5ALwF6qRUdLC3Fk17NhL6jxp4u33ZVZ8R4kvASPzw==",
       "requires": {
         "esutils": "2.0.2"
       }
@@ -2234,14 +2283,14 @@
       "integrity": "sha512-7IsQ6aQx6LAaOqy97/PthTf+5Nx9grZww3r6E62IdWe76Yr8KsuwVjxzqSPQvESJqTE3EMADQ9S0RtwWDGNG9Q=="
     },
     "babel-plugin-transform-remove-console": {
-      "version": "6.8.5",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-remove-console/-/babel-plugin-transform-remove-console-6.8.5.tgz",
-      "integrity": "sha512-uuCKvtweCyIvvC8fi92EcWRtO2Kt5KMNMRK6BhpDXdeb3sxvGM7453RSmgeu4DlKns3OlvY9Ep5Q9m5a7RQAgg=="
+      "version": "6.9.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-remove-console/-/babel-plugin-transform-remove-console-6.9.0.tgz",
+      "integrity": "sha512-mck9//yGTwObqqqDzY/sISO88/5/XfIB3ILb4uJLXk2xq124NT4yQVjFSRgVSbLcNq8OyBAn2acxKUqg4W/okQ=="
     },
     "babel-plugin-transform-remove-debugger": {
-      "version": "6.8.5",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-remove-debugger/-/babel-plugin-transform-remove-debugger-6.8.5.tgz",
-      "integrity": "sha512-InDQDdHPOLJKM+G6oXrEesf+P29QFBmcTXID+TAvZziVz+38xe2VO/Bn3FcRcRtnOOycbgsJkUNp9jIK+ist6g=="
+      "version": "6.9.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-remove-debugger/-/babel-plugin-transform-remove-debugger-6.9.0.tgz",
+      "integrity": "sha512-i/HWGjsmL2d1N2dl+eIzf44XpSP5v7hi1/GXB0xzom9kjrU8js3T8Kadizn95ZxfHK592Vg8P4JJWP/fvimEWw=="
     },
     "babel-plugin-transform-remove-undefined": {
       "version": "0.2.0",
@@ -2260,9 +2309,9 @@
       }
     },
     "babel-plugin-transform-simplify-comparison-operators": {
-      "version": "6.8.5",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-simplify-comparison-operators/-/babel-plugin-transform-simplify-comparison-operators-6.8.5.tgz",
-      "integrity": "sha512-B3HlBZb+Uq86nRj5yNPO6pJ3noEdqHvzYkEYoUWtrsWTv48ZIRatYlumoOiif/v8llF13YjYjx9zhyznDx+N9g=="
+      "version": "6.9.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-simplify-comparison-operators/-/babel-plugin-transform-simplify-comparison-operators-6.9.0.tgz",
+      "integrity": "sha512-EJyfYeph0CSekwQuwWVwJqy2go/bETkR95iaWQ/HTUis7tkCGNYmXngaFzuIXdmoPXfvmXYCvAXR4/93hqHVjw=="
     },
     "babel-plugin-transform-strict-mode": {
       "version": "6.24.1",
@@ -2274,9 +2323,9 @@
       }
     },
     "babel-plugin-transform-undefined-to-void": {
-      "version": "6.8.3",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-undefined-to-void/-/babel-plugin-transform-undefined-to-void-6.8.3.tgz",
-      "integrity": "sha512-goYwp8dMrzHD6x9GjZ2M85Mk2vxf1h85CnUgAjfftUnlJvzF4uj5MrbReHBTbjQ96C8CuRzvhYZ3tv8H3Sc1ZA=="
+      "version": "6.9.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-transform-undefined-to-void/-/babel-plugin-transform-undefined-to-void-6.9.0.tgz",
+      "integrity": "sha512-AVDVEmp0S9mbF1O8zekWbsOOmqnR08PZah5NRZJqSvJnFgiL0ep4Lwo4EymH8OieJR2QgQdR3q71TNW+wiVn4g=="
     },
     "babel-polyfill": {
       "version": "6.23.0",
@@ -2320,9 +2369,9 @@
         "babel-plugin-transform-es2015-unicode-regex": "6.24.1",
         "babel-plugin-transform-exponentiation-operator": "6.24.1",
         "babel-plugin-transform-regenerator": "6.26.0",
-        "browserslist": "2.10.0",
+        "browserslist": "2.11.3",
         "invariant": "2.2.2",
-        "semver": "5.4.1"
+        "semver": "5.5.0"
       }
     },
     "babel-preset-flow": {
@@ -2359,16 +2408,16 @@
         "babel-plugin-minify-simplify": "0.2.0",
         "babel-plugin-minify-type-constructors": "0.2.0",
         "babel-plugin-transform-inline-consecutive-adds": "0.2.0",
-        "babel-plugin-transform-member-expression-literals": "6.8.5",
-        "babel-plugin-transform-merge-sibling-variables": "6.8.6",
-        "babel-plugin-transform-minify-booleans": "6.8.3",
-        "babel-plugin-transform-property-literals": "6.8.5",
+        "babel-plugin-transform-member-expression-literals": "6.9.0",
+        "babel-plugin-transform-merge-sibling-variables": "6.9.0",
+        "babel-plugin-transform-minify-booleans": "6.9.0",
+        "babel-plugin-transform-property-literals": "6.9.0",
         "babel-plugin-transform-regexp-constructors": "0.2.0",
-        "babel-plugin-transform-remove-console": "6.8.5",
-        "babel-plugin-transform-remove-debugger": "6.8.5",
+        "babel-plugin-transform-remove-console": "6.9.0",
+        "babel-plugin-transform-remove-debugger": "6.9.0",
         "babel-plugin-transform-remove-undefined": "0.2.0",
-        "babel-plugin-transform-simplify-comparison-operators": "6.8.5",
-        "babel-plugin-transform-undefined-to-void": "6.8.3",
+        "babel-plugin-transform-simplify-comparison-operators": "6.9.0",
+        "babel-plugin-transform-undefined-to-void": "6.9.0",
         "lodash.isplainobject": "4.0.6"
       }
     },
@@ -2386,13 +2435,14 @@
       }
     },
     "babel-preset-react-app": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/babel-preset-react-app/-/babel-preset-react-app-3.1.0.tgz",
-      "integrity": "sha512-jEAeVozxLzftLl0iDZ0d5jrmfbo3yogON/eI4AsEDIs8p6WW+t9mDRUsj5l12bqPOLSiVOElCQ3QyGjMcyBiwA==",
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/babel-preset-react-app/-/babel-preset-react-app-3.1.1.tgz",
+      "integrity": "sha512-9fRHopNaGL5ScRZdPSoyxRaABKmkS2fx0HUJ5Yphan5G8QDFD7lETsPyY7El6b7YPT3sNrw9gfrWzl4/LsJcfA==",
       "requires": {
         "babel-plugin-dynamic-import-node": "1.1.0",
         "babel-plugin-syntax-dynamic-import": "6.18.0",
         "babel-plugin-transform-class-properties": "6.24.1",
+        "babel-plugin-transform-es2015-destructuring": "6.23.0",
         "babel-plugin-transform-object-rest-spread": "6.26.0",
         "babel-plugin-transform-react-constant-elements": "6.23.0",
         "babel-plugin-transform-react-jsx": "6.24.1",
@@ -2456,15 +2506,15 @@
         "babel-runtime": "6.26.0",
         "core-js": "2.5.3",
         "home-or-tmp": "2.0.0",
-        "lodash": "4.17.4",
+        "lodash": "4.17.5",
         "mkdirp": "0.5.1",
         "source-map-support": "0.4.18"
       },
       "dependencies": {
         "lodash": {
-          "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
         }
       }
     },
@@ -2493,13 +2543,13 @@
         "babel-traverse": "6.26.0",
         "babel-types": "6.26.0",
         "babylon": "6.18.0",
-        "lodash": "4.17.4"
+        "lodash": "4.17.5"
       },
       "dependencies": {
         "lodash": {
-          "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
         }
       }
     },
@@ -2516,13 +2566,13 @@
         "debug": "2.6.9",
         "globals": "9.18.0",
         "invariant": "2.2.2",
-        "lodash": "4.17.4"
+        "lodash": "4.17.5"
       },
       "dependencies": {
         "lodash": {
-          "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
         }
       }
     },
@@ -2533,14 +2583,14 @@
       "requires": {
         "babel-runtime": "6.26.0",
         "esutils": "2.0.2",
-        "lodash": "4.17.4",
+        "lodash": "4.17.5",
         "to-fast-properties": "1.0.3"
       },
       "dependencies": {
         "lodash": {
-          "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
         }
       }
     },
@@ -2560,11 +2610,11 @@
       "integrity": "sha512-5T6P4xPgpp0YDFvSWwEZ4NoE3aM4QBQXDzmVbraCkFj8zHM+mba8SyqB5DbZWyR7mYHo6Y7BdQo3MoA4m0TeQg==",
       "requires": {
         "cache-base": "1.0.1",
-        "class-utils": "0.3.5",
+        "class-utils": "0.3.6",
         "component-emitter": "1.2.1",
         "define-property": "1.0.0",
         "isobject": "3.0.1",
-        "mixin-deep": "1.3.0",
+        "mixin-deep": "1.3.1",
         "pascalcase": "0.1.1"
       }
     },
@@ -2578,6 +2628,16 @@
       "resolved": "https://registry.npmjs.org/batch/-/batch-0.6.1.tgz",
       "integrity": "sha1-3DQxT05nkxgJP8dgJyUl+UvyXBY="
     },
+    "bfj-node4": {
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/bfj-node4/-/bfj-node4-5.2.1.tgz",
+      "integrity": "sha512-w+OTPD/R0AvDVR/sy/uVUVeoCpEgUoYj9/1P2zB6mR1yx7F/ADzLX4nlvZ/91WWzGgdZnuLxWP/J89D7ZDt0DA==",
+      "requires": {
+        "bluebird": "3.5.1",
+        "check-types": "7.3.0",
+        "tryer": "1.0.0"
+      }
+    },
     "big.js": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/big.js/-/big.js-3.2.0.tgz",
@@ -2606,9 +2666,9 @@
       }
     },
     "bluebird": {
-      "version": "3.4.7",
-      "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.4.7.tgz",
-      "integrity": "sha1-9y12C+Cbf3bQjtj66Ysomo0F+rM="
+      "version": "3.5.1",
+      "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.5.1.tgz",
+      "integrity": "sha512-MKiLiV+I1AA596t9w1sQJ8jkiSr5+ZKi0WKrYGUn6d1Fx+Ij4tIj+m2WMQSGczs5jZVxV339chE8iwk6F64wjA=="
     },
     "bn.js": {
       "version": "4.11.8",
@@ -2623,7 +2683,7 @@
         "bytes": "3.0.0",
         "content-type": "1.0.4",
         "debug": "2.6.9",
-        "depd": "1.1.1",
+        "depd": "1.1.2",
         "http-errors": "1.6.2",
         "iconv-lite": "0.4.19",
         "on-finished": "2.3.0",
@@ -2641,7 +2701,7 @@
         "deep-equal": "1.0.1",
         "dns-equal": "1.0.0",
         "dns-txt": "2.0.2",
-        "multicast-dns": "6.2.1",
+        "multicast-dns": "6.2.3",
         "multicast-dns-service-types": "1.1.0"
       },
       "dependencies": {
@@ -2666,14 +2726,14 @@
       }
     },
     "bowser": {
-      "version": "1.8.1",
-      "resolved": "https://registry.npmjs.org/bowser/-/bowser-1.8.1.tgz",
-      "integrity": "sha512-NMPaR8ILtdLSWzxQtEs16XbxMcY8ohWGQ5V+TZSJS3fNUt/PBAGkF6YWO9B/4qWE23bK3o0moQKq8UyFEosYkA=="
+      "version": "1.9.2",
+      "resolved": "https://registry.npmjs.org/bowser/-/bowser-1.9.2.tgz",
+      "integrity": "sha512-fuiANC1Bqbqa/S4gmvfCt7bGBmNELMsGZj4Wg3PrP6esP66Ttoj1JSlzFlXtHyduMv07kDNmDsX6VsMWT/MLGg=="
     },
     "brace-expansion": {
-      "version": "1.1.8",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.8.tgz",
-      "integrity": "sha1-wHshHHyVLsH479Uad+8NHTmQopI=",
+      "version": "1.1.11",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
+      "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
       "requires": {
         "balanced-match": "1.0.0",
         "concat-map": "0.0.1"
@@ -2766,7 +2826,7 @@
       "integrity": "sha1-IeCr+vbyApzy+vsTNWenAdQTVSQ=",
       "requires": {
         "bn.js": "4.11.8",
-        "randombytes": "2.0.5"
+        "randombytes": "2.0.6"
       }
     },
     "browserify-sign": {
@@ -2792,12 +2852,12 @@
       }
     },
     "browserslist": {
-      "version": "2.10.0",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.10.0.tgz",
-      "integrity": "sha512-WyvzSLsuAVPOjbljXnyeWl14Ae+ukAT8MUuagKVzIDvwBxl4UAwD1xqtyQs2eWYPGUKMeC3Ol62goqYuKqTTcw==",
+      "version": "2.11.3",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.11.3.tgz",
+      "integrity": "sha512-yWu5cXT7Av6mVwzWc8lMsJMHWn4xyjSuGYi4IozbVTLUOEYPSagUB8kiMDUHA1fS3zjr8nkxkn9jdvug4BBRmA==",
       "requires": {
-        "caniuse-lite": "1.0.30000783",
-        "electron-to-chromium": "1.3.28"
+        "caniuse-lite": "1.0.30000808",
+        "electron-to-chromium": "1.3.33"
       }
     },
     "bser": {
@@ -2851,7 +2911,7 @@
         "axios": "0.16.2",
         "bytes": "3.0.0",
         "ci-env": "1.5.2",
-        "commander": "2.12.2",
+        "commander": "2.14.1",
         "github-build": "1.2.0",
         "glob": "7.1.2",
         "gzip-size": "4.1.0",
@@ -2876,6 +2936,26 @@
       "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.0.0.tgz",
       "integrity": "sha1-0ygVQE1olpn4Wk6k+odV3ROpYEg="
     },
+    "cacache": {
+      "version": "10.0.2",
+      "resolved": "https://registry.npmjs.org/cacache/-/cacache-10.0.2.tgz",
+      "integrity": "sha512-dljb7dk1jqO5ogE+dRpoR9tpHYv5xz9vPSNunh1+0wRuNdYxmzp9WmsyokgW/DUF1FDRVA/TMsmxt027R8djbQ==",
+      "requires": {
+        "bluebird": "3.5.1",
+        "chownr": "1.0.1",
+        "glob": "7.1.2",
+        "graceful-fs": "4.1.11",
+        "lru-cache": "4.1.1",
+        "mississippi": "1.3.1",
+        "mkdirp": "0.5.1",
+        "move-concurrently": "1.0.1",
+        "promise-inflight": "1.0.1",
+        "rimraf": "2.6.2",
+        "ssri": "5.2.1",
+        "unique-filename": "1.1.0",
+        "y18n": "3.2.1"
+      }
+    },
     "cache-base": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/cache-base/-/cache-base-1.0.1.tgz",
@@ -2897,6 +2977,15 @@
       "resolved": "https://registry.npmjs.org/callsites/-/callsites-2.0.0.tgz",
       "integrity": "sha1-BuuE8A7qQT2oav/vrL/7Ngk7PFA="
     },
+    "camel-case": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/camel-case/-/camel-case-3.0.0.tgz",
+      "integrity": "sha1-yjw2iKTpzzpM2nd9xNy8cTJJz3M=",
+      "requires": {
+        "no-case": "2.3.2",
+        "upper-case": "1.1.3"
+      }
+    },
     "camelcase": {
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
@@ -2924,7 +3013,7 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw=",
       "requires": {
         "browserslist": "1.7.7",
-        "caniuse-db": "1.0.30000783",
+        "caniuse-db": "1.0.30000808",
         "lodash.memoize": "4.1.2",
         "lodash.uniq": "4.5.0"
       },
@@ -2934,30 +3023,21 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000783",
-            "electron-to-chromium": "1.3.28"
+            "caniuse-db": "1.0.30000808",
+            "electron-to-chromium": "1.3.33"
           }
         }
       }
     },
     "caniuse-db": {
-      "version": "1.0.30000783",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000783.tgz",
-      "integrity": "sha1-FrMNRyZqT1FcxprgMWtnDJYDzb4="
+      "version": "1.0.30000808",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000808.tgz",
+      "integrity": "sha1-MN/YMAnVcE8C3/s3clBo7RKjZrs="
     },
     "caniuse-lite": {
-      "version": "1.0.30000783",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000783.tgz",
-      "integrity": "sha1-m1SZ+xtQPSNF0SqmuGEoUvQnb/0="
-    },
-    "cardinal": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/cardinal/-/cardinal-1.0.0.tgz",
-      "integrity": "sha1-UOIcGwqjdyn5N33vGWtanOyTLuk=",
-      "requires": {
-        "ansicolors": "0.2.1",
-        "redeyed": "1.0.1"
-      }
+      "version": "1.0.30000808",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000808.tgz",
+      "integrity": "sha512-vT0JLmHdvq1UVbYXioxCXHYdNw55tyvi+IUWyX0Zeh1OFQi2IllYtm38IJnSgHWCv/zUnX1hdhy3vMJvuTNSqw=="
     },
     "case-sensitive-paths-webpack-plugin": {
       "version": "2.1.1",
@@ -2999,13 +3079,13 @@
       }
     },
     "chalk": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.3.0.tgz",
-      "integrity": "sha512-Az5zJR2CBujap2rqXGaJKaPHyJ0IrUimvYNX+ncCy8PJP4ltOGTrHUIo097ZaL2zMeKYpiCdqDvS6zdrTFok3Q==",
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.3.1.tgz",
+      "integrity": "sha512-QUU4ofkDoMIVO7hcx1iPTISs88wsO8jA92RQIm4JAwZvFGGAV2hSAA1NX7oVj2Ej2Q6NDTcRDjPTFrMCRZoJ6g==",
       "requires": {
         "ansi-styles": "3.2.0",
         "escape-string-regexp": "1.0.5",
-        "supports-color": "4.5.0"
+        "supports-color": "5.2.0"
       }
     },
     "chardet": {
@@ -3013,6 +3093,11 @@
       "resolved": "https://registry.npmjs.org/chardet/-/chardet-0.4.2.tgz",
       "integrity": "sha1-tUc7M9yXxCTl2Y3IfVXU2KKci/I="
     },
+    "check-types": {
+      "version": "7.3.0",
+      "resolved": "https://registry.npmjs.org/check-types/-/check-types-7.3.0.tgz",
+      "integrity": "sha1-Ro9XGkQ1wkJI9f0MsOjYfDw0Hn0="
+    },
     "cheerio": {
       "version": "1.0.0-rc.2",
       "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-1.0.0-rc.2.tgz",
@@ -3051,6 +3136,11 @@
         "readdirp": "2.1.0"
       }
     },
+    "chownr": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/chownr/-/chownr-1.0.1.tgz",
+      "integrity": "sha1-4qdQQqlVGQi+vSW4Uj1fl2nXkYE="
+    },
     "ci-env": {
       "version": "1.5.2",
       "resolved": "https://registry.npmjs.org/ci-env/-/ci-env-1.5.2.tgz",
@@ -3103,14 +3193,13 @@
       }
     },
     "class-utils": {
-      "version": "0.3.5",
-      "resolved": "https://registry.npmjs.org/class-utils/-/class-utils-0.3.5.tgz",
-      "integrity": "sha1-F+eTEDdQ+WJ7IXbqNM/RtWWQPIA=",
+      "version": "0.3.6",
+      "resolved": "https://registry.npmjs.org/class-utils/-/class-utils-0.3.6.tgz",
+      "integrity": "sha512-qOhPa/Fj7s6TY8H8esGu5QNpMMQxz79h+urzrNYN6mn+9BnxlDGf5QZ+XeCDsxSjPqsSR56XOZOJmpeurnLMeg==",
       "requires": {
         "arr-union": "3.1.0",
         "define-property": "0.2.5",
         "isobject": "3.0.1",
-        "lazy-cache": "2.0.2",
         "static-extend": "0.1.2"
       },
       "dependencies": {
@@ -3122,6 +3211,42 @@
             "is-descriptor": "0.1.6"
           }
         },
+        "is-accessor-descriptor": {
+          "version": "0.1.6",
+          "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
+          "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
+          "requires": {
+            "kind-of": "3.2.2"
+          },
+          "dependencies": {
+            "kind-of": {
+              "version": "3.2.2",
+              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+              "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+              "requires": {
+                "is-buffer": "1.1.6"
+              }
+            }
+          }
+        },
+        "is-data-descriptor": {
+          "version": "0.1.4",
+          "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
+          "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
+          "requires": {
+            "kind-of": "3.2.2"
+          },
+          "dependencies": {
+            "kind-of": {
+              "version": "3.2.2",
+              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+              "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+              "requires": {
+                "is-buffer": "1.1.6"
+              }
+            }
+          }
+        },
         "is-descriptor": {
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
@@ -3144,36 +3269,27 @@
       "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.2.5.tgz",
       "integrity": "sha1-+zgB1FNGdknvNgPH1hoCvRKb3m0="
     },
-    "cli-cursor": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-2.1.0.tgz",
-      "integrity": "sha1-s12sN2R5+sw+lHR9QdDQ9SOP/LU=",
-      "requires": {
-        "restore-cursor": "2.0.0"
-      }
-    },
-    "cli-table": {
-      "version": "0.3.1",
-      "resolved": "https://registry.npmjs.org/cli-table/-/cli-table-0.3.1.tgz",
-      "integrity": "sha1-9TsFJmqLGguTSz0IIebi3FkUriM=",
+    "clean-css": {
+      "version": "4.1.9",
+      "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.9.tgz",
+      "integrity": "sha1-Nc7ornaHpJuYA09w3gDE7dOCYwE=",
       "requires": {
-        "colors": "1.0.3"
+        "source-map": "0.5.7"
       },
       "dependencies": {
-        "colors": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/colors/-/colors-1.0.3.tgz",
-          "integrity": "sha1-BDP0TYCWgP3rYO0mDxsMJi6CpAs="
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         }
       }
     },
-    "cli-usage": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/cli-usage/-/cli-usage-0.1.4.tgz",
-      "integrity": "sha1-fAHg3HBsI0s5yTODjI4gshdXduI=",
+    "cli-cursor": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-2.1.0.tgz",
+      "integrity": "sha1-s12sN2R5+sw+lHR9QdDQ9SOP/LU=",
       "requires": {
-        "marked": "0.3.7",
-        "marked-terminal": "1.7.0"
+        "restore-cursor": "2.0.0"
       }
     },
     "cli-width": {
@@ -3342,14 +3458,14 @@
       }
     },
     "commander": {
-      "version": "2.12.2",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-2.12.2.tgz",
-      "integrity": "sha512-BFnaq5ZOGcDN7FlrtBT4xxkgIToalIIxwjxLWVJ8bGTpe1LroqMiqQXdA7ygc7CRvaYS+9zfPGFnJqFSayx+AA=="
+      "version": "2.14.1",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-2.14.1.tgz",
+      "integrity": "sha512-+YR16o3rK53SmWHU3rEM3tPAh2rwb1yPcQX5irVn7mb0gXbwuCCrnkbV5+PBfETdfg1vui07nM6PCG1zndcjQw=="
     },
     "common-tags": {
-      "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/common-tags/-/common-tags-1.5.1.tgz",
-      "integrity": "sha512-NrUYGY5TApAk9KB+IZXkR3GR4tA3g26HDsoiGt4kCMHZ727gOGkC+UNfq0Z22jE15bLkc/6RV5Jw1RBW6Usg6A==",
+      "version": "1.7.2",
+      "resolved": "https://registry.npmjs.org/common-tags/-/common-tags-1.7.2.tgz",
+      "integrity": "sha512-joj9ZlUOjCrwdbmiLqafeUSgkUM74NqhLsZtSqDmhKudaIY197zTrb8JMl31fMnCUuxwFT23eC/oWvrZzDLRJQ==",
       "requires": {
         "babel-runtime": "6.26.0"
       }
@@ -3391,6 +3507,16 @@
       "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
       "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s="
     },
+    "concat-stream": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.0.tgz",
+      "integrity": "sha1-CqxmL9Ur54lk1VMvaUeE5wEQrPc=",
+      "requires": {
+        "inherits": "2.0.3",
+        "readable-stream": "2.3.4",
+        "typedarray": "0.0.6"
+      }
+    },
     "configstore": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/configstore/-/configstore-3.1.1.tgz",
@@ -3500,6 +3626,19 @@
       "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
       "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw="
     },
+    "copy-concurrently": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/copy-concurrently/-/copy-concurrently-1.0.5.tgz",
+      "integrity": "sha512-f2domd9fsVDFtaFcbaRZuYXwtdmnzqbADSwhSWYxYB/Q8zsdUUFMXVRwXGDMWmbEzAn1kdRrtI1T/KTFOL4X2A==",
+      "requires": {
+        "aproba": "1.2.0",
+        "fs-write-stream-atomic": "1.0.10",
+        "iferr": "0.1.5",
+        "mkdirp": "0.5.1",
+        "rimraf": "2.6.2",
+        "run-queue": "1.0.3"
+      }
+    },
     "copy-descriptor": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/copy-descriptor/-/copy-descriptor-0.1.1.tgz",
@@ -3571,7 +3710,7 @@
         "cipher-base": "1.0.4",
         "inherits": "2.0.3",
         "ripemd160": "2.0.1",
-        "sha.js": "2.4.9"
+        "sha.js": "2.4.10"
       }
     },
     "create-hmac": {
@@ -3584,13 +3723,13 @@
         "inherits": "2.0.3",
         "ripemd160": "2.0.1",
         "safe-buffer": "5.1.1",
-        "sha.js": "2.4.9"
+        "sha.js": "2.4.10"
       }
     },
     "create-react-class": {
-      "version": "15.6.2",
-      "resolved": "https://registry.npmjs.org/create-react-class/-/create-react-class-15.6.2.tgz",
-      "integrity": "sha1-zx7RXxKq1/FO9fLf4F5sQvke8Co=",
+      "version": "15.6.3",
+      "resolved": "https://registry.npmjs.org/create-react-class/-/create-react-class-15.6.3.tgz",
+      "integrity": "sha512-M+/3Q6E6DLO6Yx3OwrWjwHBnvfXXYA7W+dFjt/ZDBemHO1DDZhsalX/NUtnTYclN6GfnBDRh4qRHjcDHmlJBJg==",
       "requires": {
         "fbjs": "0.8.16",
         "loose-envify": "1.3.1",
@@ -3639,7 +3778,7 @@
         "inherits": "2.0.3",
         "pbkdf2": "3.0.14",
         "public-encrypt": "4.0.0",
-        "randombytes": "2.0.5",
+        "randombytes": "2.0.6",
         "randomfill": "1.0.3"
       }
     },
@@ -3662,9 +3801,9 @@
       }
     },
     "css-loader": {
-      "version": "0.28.7",
-      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.7.tgz",
-      "integrity": "sha512-GxMpax8a/VgcfRrVy0gXD6yLd5ePYbXX/5zGgTVYp4wXtJklS8Z2VaUArJgc//f6/Dzil7BaJObdSv8eKKCPgg==",
+      "version": "0.28.9",
+      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.9.tgz",
+      "integrity": "sha512-r3dgelMm/mkPz5Y7m9SeiGE46i2VsEU/OYbez+1llfxtv8b2y5/b5StaeEvPK3S5tlNQI+tDW/xDIhKJoZgDtw==",
       "requires": {
         "babel-code-frame": "6.26.0",
         "css-selector-tokenizer": "0.7.0",
@@ -3674,7 +3813,7 @@
         "lodash.camelcase": "4.3.0",
         "object-assign": "4.1.1",
         "postcss": "5.2.18",
-        "postcss-modules-extract-imports": "1.1.0",
+        "postcss-modules-extract-imports": "1.2.0",
         "postcss-modules-local-by-default": "1.2.0",
         "postcss-modules-scope": "1.1.0",
         "postcss-modules-values": "1.3.0",
@@ -3717,7 +3856,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -3789,6 +3928,14 @@
             "supports-color": "3.2.3"
           }
         },
+        "postcss-modules-extract-imports": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-1.1.0.tgz",
+          "integrity": "sha1-thTJcgvmgW6u41+zpfqh26agXds=",
+          "requires": {
+            "postcss": "6.0.1"
+          }
+        },
         "source-map": {
           "version": "0.5.7",
           "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
@@ -3885,7 +4032,7 @@
           "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ=",
           "requires": {
             "browserslist": "1.7.7",
-            "caniuse-db": "1.0.30000783",
+            "caniuse-db": "1.0.30000808",
             "normalize-range": "0.1.2",
             "num2fraction": "1.2.2",
             "postcss": "5.2.18",
@@ -3897,8 +4044,8 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000783",
-            "electron-to-chromium": "1.3.28"
+            "caniuse-db": "1.0.30000808",
+            "electron-to-chromium": "1.3.33"
           }
         },
         "chalk": {
@@ -3931,7 +4078,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -3988,12 +4135,17 @@
         "array-find-index": "1.0.2"
       }
     },
+    "cyclist": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/cyclist/-/cyclist-0.2.2.tgz",
+      "integrity": "sha1-GzN5LhHpFKL9bW7WRHRkRE5fpkA="
+    },
     "d": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/d/-/d-1.0.0.tgz",
       "integrity": "sha1-dUu1v+VUUdpppYuU1F9MWwRi1Y8=",
       "requires": {
-        "es5-ext": "0.10.37"
+        "es5-ext": "0.10.38"
       }
     },
     "dashdash": {
@@ -4106,7 +4258,7 @@
       "resolved": "https://registry.npmjs.org/define-property/-/define-property-1.0.0.tgz",
       "integrity": "sha1-dp66rz9KY6rTr56NMEybvnm/sOY=",
       "requires": {
-        "is-descriptor": "1.0.1"
+        "is-descriptor": "1.0.2"
       }
     },
     "defined": {
@@ -4138,9 +4290,9 @@
       "integrity": "sha1-hMbhWbgZBP3KWaDvRM2HDTElD5o="
     },
     "depd": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.1.tgz",
-      "integrity": "sha1-V4O04cRZ8G+lyif5kfPQbnoxA1k="
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.2.tgz",
+      "integrity": "sha1-m81S4UwJd2PnSbJ0xDRu0uVgtak="
     },
     "des.js": {
       "version": "1.0.0",
@@ -4181,7 +4333,7 @@
       "requires": {
         "bn.js": "4.11.8",
         "miller-rabin": "4.0.1",
-        "randombytes": "2.0.5"
+        "randombytes": "2.0.6"
       }
     },
     "discontinuous-range": {
@@ -4195,9 +4347,9 @@
       "integrity": "sha1-s55/HabrCnW6nBcySzR1PEfgZU0="
     },
     "dns-packet": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.2.2.tgz",
-      "integrity": "sha512-kN+DjfGF7dJGUL7nWRktL9Z18t1rWP3aQlyZdY8XlpvU3Nc6GeFTQApftcjtWKxAZfiggZSGrCEoszNgvnpwDg==",
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.3.1.tgz",
+      "integrity": "sha512-0UxfQkMhYAUaZI+xrNZOz/as5KgDU0M/fQ9b6SpkyLbk3GEswDi6PADJVaYJradtRVsRIlF1zLyOodbcTCDzUg==",
       "requires": {
         "ip": "1.1.5",
         "safe-buffer": "5.1.1"
@@ -4212,17 +4364,32 @@
       }
     },
     "doctrine": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-2.0.2.tgz",
-      "integrity": "sha512-y0tm5Pq6ywp3qSTZ1vPgVdAnbDEoeoc5wlOHXoY1c4Wug/a7JvqHIl7BTvwodaHmejWkK/9dSb3sCYfyo/om8A==",
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-2.1.0.tgz",
+      "integrity": "sha512-35mSku4ZXK0vfCuHEDAwt55dg2jNajHZ1odvF+8SSr82EsZY4QmXfuWso8oEd8zRhVObSN18aM0CjSdoBX7zIw==",
       "requires": {
         "esutils": "2.0.2"
       }
     },
+    "dom-converter": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/dom-converter/-/dom-converter-0.1.4.tgz",
+      "integrity": "sha1-pF71cnuJDJv/5tfIduexnLDhfzs=",
+      "requires": {
+        "utila": "0.3.3"
+      },
+      "dependencies": {
+        "utila": {
+          "version": "0.3.3",
+          "resolved": "https://registry.npmjs.org/utila/-/utila-0.3.3.tgz",
+          "integrity": "sha1-1+jn1+MJEHCSsF+NloiCTWM6QiY="
+        }
+      }
+    },
     "dom-helpers": {
-      "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-3.2.1.tgz",
-      "integrity": "sha1-MgPgf+0he9H0JLAZc1WC/Deyglo="
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-3.3.1.tgz",
+      "integrity": "sha512-2Sm+JaYn74OiTM2wHvxJOo3roiq/h25Yi69Fqk269cNUwIXsCvATB6CRSFC9Am/20G2b28hGv/+7NiWydIrPvg=="
     },
     "dom-serializer": {
       "version": "0.1.0",
@@ -4246,9 +4413,9 @@
       "integrity": "sha1-ZyIm3HTI95mtNTB9+TaroRrNYBg="
     },
     "domain-browser": {
-      "version": "1.1.7",
-      "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.1.7.tgz",
-      "integrity": "sha1-hnqksJP6oF8d4IwG9NeyH9+GmLw="
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.2.0.tgz",
+      "integrity": "sha512-jnjyiM6eRyZl2H+W8Q/zLMA481hzi0eszAaBUzIVnmYVDBbnLxVNnfu1HgEBvCbL+71FrxMl3E6lpKH7Ge3OXA=="
     },
     "domelementtype": {
       "version": "1.3.0",
@@ -4298,6 +4465,17 @@
       "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz",
       "integrity": "sha1-rOb/gIwc5mtX0ev5eXessCM0z8E="
     },
+    "duplexify": {
+      "version": "3.5.3",
+      "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-3.5.3.tgz",
+      "integrity": "sha512-g8ID9OroF9hKt2POf8YLayy+9594PzmM3scI00/uBXocX3TWNgoB67hjzkFe9ITAbQOne/lLdBxHXvYUM4ZgGA==",
+      "requires": {
+        "end-of-stream": "1.4.1",
+        "inherits": "2.0.3",
+        "readable-stream": "2.3.4",
+        "stream-shift": "1.0.0"
+      }
+    },
     "ee-first": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
@@ -4309,9 +4487,9 @@
       "integrity": "sha1-zIcsFoiArjxxiXYv1f/ACJbJUYo="
     },
     "electron-to-chromium": {
-      "version": "1.3.28",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.28.tgz",
-      "integrity": "sha1-jdTmRYCGZE6fnwoc8y4qH53/2e4="
+      "version": "1.3.33",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.33.tgz",
+      "integrity": "sha1-vwBwPWKnxlI4E2V4w1LWxcBCpUU="
     },
     "elliptic": {
       "version": "6.4.0",
@@ -4333,9 +4511,9 @@
       "integrity": "sha1-TapNnbAPmBmIDHn6RXrlsJof04k="
     },
     "encodeurl": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.1.tgz",
-      "integrity": "sha1-eePVhlU0aQn+bw9Fpd5oEDspTSA="
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz",
+      "integrity": "sha1-rT/0yG7C0CkyL1oCw6mmBslbP1k="
     },
     "encoding": {
       "version": "0.1.12",
@@ -4345,6 +4523,14 @@
         "iconv-lite": "0.4.19"
       }
     },
+    "end-of-stream": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.1.tgz",
+      "integrity": "sha512-1MkrZNvWTKCaigbn+W15elq2BB/L22nqrSY5DKlo3X6+vclJm8Bb5djXJBmEX6fS3+zCh/F4VBK5Z2KxJt4s2Q==",
+      "requires": {
+        "once": "1.4.0"
+      }
+    },
     "enhanced-resolve": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.3.0.tgz",
@@ -4362,17 +4548,22 @@
       "integrity": "sha1-blwtClYhtdra7O+AuQ7ftc13cvA="
     },
     "enzyme": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/enzyme/-/enzyme-3.2.0.tgz",
-      "integrity": "sha512-l0HcjycivXjB4IXkwuRc1K5z8hzWIVZB2b/Y/H2bao9eFTpBz4ACOwAQf44SgG5Nu3d1jF41LasxDgFWZeeysA==",
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/enzyme/-/enzyme-3.3.0.tgz",
+      "integrity": "sha512-l8csyPyLmtxskTz6pX9W8eDOyH1ckEtDttXk/vlFWCjv00SkjTjtoUrogqp4yEvMyneU9dUJoOLnqFoiHb8IHA==",
       "requires": {
         "cheerio": "1.0.0-rc.2",
-        "function.prototype.name": "1.0.3",
+        "function.prototype.name": "1.1.0",
         "has": "1.0.1",
+        "is-boolean-object": "1.0.0",
+        "is-callable": "1.1.3",
+        "is-number-object": "1.0.3",
+        "is-string": "1.0.4",
         "is-subset": "0.1.1",
-        "lodash": "4.17.4",
+        "lodash": "4.17.5",
+        "object-inspect": "1.5.0",
         "object-is": "1.0.1",
-        "object.assign": "4.0.4",
+        "object.assign": "4.1.0",
         "object.entries": "1.0.4",
         "object.values": "1.0.4",
         "raf": "3.4.0",
@@ -4380,46 +4571,47 @@
       },
       "dependencies": {
         "lodash": {
-          "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
         }
       }
     },
     "enzyme-adapter-react-16": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/enzyme-adapter-react-16/-/enzyme-adapter-react-16-1.1.0.tgz",
-      "integrity": "sha512-OlZJn5PJUJ91EOQQRuISZpXgPlqT9fYR2yBZQPu9UYok+wS19Rn4teXywF34LMcyw2AzE1s0ZRDtcI952/vQHg==",
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/enzyme-adapter-react-16/-/enzyme-adapter-react-16-1.1.1.tgz",
+      "integrity": "sha512-kC8pAtU2Jk3OJ0EG8Y2813dg9Ol0TXi7UNxHzHiWs30Jo/hj7alc//G1YpKUsPP1oKl9X+Lkx+WlGJpPYA+nvw==",
       "requires": {
-        "enzyme-adapter-utils": "1.2.0",
-        "lodash": "4.17.4",
-        "object.assign": "4.0.4",
+        "enzyme-adapter-utils": "1.3.0",
+        "lodash": "4.17.5",
+        "object.assign": "4.1.0",
         "object.values": "1.0.4",
         "prop-types": "15.6.0",
+        "react-reconciler": "0.7.0",
         "react-test-renderer": "16.2.0"
       },
       "dependencies": {
         "lodash": {
-          "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
         }
       }
     },
     "enzyme-adapter-utils": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/enzyme-adapter-utils/-/enzyme-adapter-utils-1.2.0.tgz",
-      "integrity": "sha512-6CeIrmymLWoQgvH5m/ixJLaCsa6pSoWU2nlMeO0nHCZR8LQ+tKzP/jPh4qceTPlB4oFfyMRFeqr0+IryY4gAxg==",
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/enzyme-adapter-utils/-/enzyme-adapter-utils-1.3.0.tgz",
+      "integrity": "sha512-vVXSt6uDv230DIv+ebCG66T1Pm36Kv+m74L1TrF4kaE7e1V7Q/LcxO0QRkajk5cA6R3uu9wJf5h13wOTezTbjA==",
       "requires": {
-        "lodash": "4.17.4",
-        "object.assign": "4.0.4",
+        "lodash": "4.17.5",
+        "object.assign": "4.1.0",
         "prop-types": "15.6.0"
       },
       "dependencies": {
         "lodash": {
-          "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
         }
       }
     },
@@ -4462,18 +4654,18 @@
       }
     },
     "es5-ext": {
-      "version": "0.10.37",
-      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.37.tgz",
-      "integrity": "sha1-DudB0Ui4AGm6J9AgOTdWryV978M=",
+      "version": "0.10.38",
+      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.38.tgz",
+      "integrity": "sha512-jCMyePo7AXbUESwbl8Qi01VSH2piY9s/a3rSU/5w/MlTIx8HPL1xn2InGN8ejt/xulcJgnTO7vqNtOAxzYd2Kg==",
       "requires": {
         "es6-iterator": "2.0.3",
         "es6-symbol": "3.1.1"
       }
     },
     "es5-shim": {
-      "version": "4.5.9",
-      "resolved": "https://registry.npmjs.org/es5-shim/-/es5-shim-4.5.9.tgz",
-      "integrity": "sha1-Kh4rnlg/9f7Qwgo+4svz91IwpcA="
+      "version": "4.5.10",
+      "resolved": "https://registry.npmjs.org/es5-shim/-/es5-shim-4.5.10.tgz",
+      "integrity": "sha512-vmryBdqKRO8Ei9LJ4yyEk/EOmAOGIagcHDYPpTAi6pot4IMHS1AC2q5cTKPmydpijg2iX8DVmCuqgrNxIWj8Yg=="
     },
     "es6-iterator": {
       "version": "2.0.3",
@@ -4481,7 +4673,7 @@
       "integrity": "sha1-p96IkUGgWpSwhUQDstCg+/qY87c=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.37",
+        "es5-ext": "0.10.38",
         "es6-symbol": "3.1.1"
       }
     },
@@ -4491,7 +4683,7 @@
       "integrity": "sha1-kTbgUD3MBqMBaQ8LsU/042TpSfA=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.37",
+        "es5-ext": "0.10.38",
         "es6-iterator": "2.0.3",
         "es6-set": "0.1.5",
         "es6-symbol": "3.1.1",
@@ -4499,9 +4691,9 @@
       }
     },
     "es6-promise": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.1.1.tgz",
-      "integrity": "sha512-OaU1hHjgJf+b0NzsxCg7NdIYERD6Hy/PEmFLTjw+b65scuisG3Kt4QoTvJ66BBkPZ581gr0kpoVzKnxniM8nng=="
+      "version": "4.2.4",
+      "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.2.4.tgz",
+      "integrity": "sha512-/NdNZVJg+uZgtm9eS3O6lrOLYmQag2DjdEXuPaHlZ6RuVqgqaVZfgYCepEIKsLqwdQArOPtC3XzRLqGGfT8KQQ=="
     },
     "es6-set": {
       "version": "0.1.5",
@@ -4509,7 +4701,7 @@
       "integrity": "sha1-0rPsXU2ADO2BjbU40ol02wpzzLE=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.37",
+        "es5-ext": "0.10.38",
         "es6-iterator": "2.0.3",
         "es6-symbol": "3.1.1",
         "event-emitter": "0.3.5"
@@ -4526,7 +4718,44 @@
       "integrity": "sha1-vwDvT9q2uhtG7Le2KbTH7VcVzHc=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.37"
+        "es5-ext": "0.10.38"
+      }
+    },
+    "es6-templates": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/es6-templates/-/es6-templates-0.2.3.tgz",
+      "integrity": "sha1-XLmsn7He1usSOTQrgdeSu7QHjuQ=",
+      "requires": {
+        "recast": "0.11.23",
+        "through": "2.3.8"
+      },
+      "dependencies": {
+        "ast-types": {
+          "version": "0.9.6",
+          "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.9.6.tgz",
+          "integrity": "sha1-ECyenpAF0+fjgpvwxPok7oYu6bk="
+        },
+        "esprima": {
+          "version": "3.1.3",
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz",
+          "integrity": "sha1-/cpRzuYTOJXjyI1TXOSdv/YqRjM="
+        },
+        "recast": {
+          "version": "0.11.23",
+          "resolved": "https://registry.npmjs.org/recast/-/recast-0.11.23.tgz",
+          "integrity": "sha1-RR/TAEqx5N+bTktmN2sqIZEkYtM=",
+          "requires": {
+            "ast-types": "0.9.6",
+            "esprima": "3.1.3",
+            "private": "0.1.8",
+            "source-map": "0.5.7"
+          }
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
+        }
       }
     },
     "es6-weak-map": {
@@ -4535,7 +4764,7 @@
       "integrity": "sha1-XjqzIlH/0VOKH45f+hNXdy+S2W8=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.37",
+        "es5-ext": "0.10.38",
         "es6-iterator": "2.0.3",
         "es6-symbol": "3.1.1"
       }
@@ -4614,7 +4843,7 @@
       "integrity": "sha1-34xp7vFkeSPHFXuc6DhAYQsCzDk=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.37"
+        "es5-ext": "0.10.38"
       }
     },
     "eventemitter3": {
@@ -4693,6 +4922,42 @@
             "is-descriptor": "0.1.6"
           }
         },
+        "is-accessor-descriptor": {
+          "version": "0.1.6",
+          "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
+          "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
+          "requires": {
+            "kind-of": "3.2.2"
+          },
+          "dependencies": {
+            "kind-of": {
+              "version": "3.2.2",
+              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+              "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+              "requires": {
+                "is-buffer": "1.1.6"
+              }
+            }
+          }
+        },
+        "is-data-descriptor": {
+          "version": "0.1.4",
+          "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
+          "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
+          "requires": {
+            "kind-of": "3.2.2"
+          },
+          "dependencies": {
+            "kind-of": {
+              "version": "3.2.2",
+              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+              "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+              "requires": {
+                "is-buffer": "1.1.6"
+              }
+            }
+          }
+        },
         "is-descriptor": {
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
@@ -4782,8 +5047,8 @@
         "cookie": "0.3.1",
         "cookie-signature": "1.0.6",
         "debug": "2.6.9",
-        "depd": "1.1.1",
-        "encodeurl": "1.0.1",
+        "depd": "1.1.2",
+        "encodeurl": "1.0.2",
         "escape-html": "1.0.3",
         "etag": "1.8.1",
         "finalhandler": "1.1.0",
@@ -4830,9 +5095,9 @@
       }
     },
     "extglob": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/extglob/-/extglob-2.0.2.tgz",
-      "integrity": "sha512-I0+eZBH+jFGL8F5BnIz2ON2nKCjTS3AS3H/5PeSmCp7UVC70Ym8IhdRiQly2juKYQ//f7z1aj1BRpQniFJoU1w==",
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/extglob/-/extglob-2.0.4.tgz",
+      "integrity": "sha512-Nmb6QXkELsuBr24CJSkilo6UHHgbekK5UiZgfE6UHD3Eb27YC6oD+bhcT+tJ6cl8dmsgdQxnWlcry8ksBIBLpw==",
       "requires": {
         "array-unique": "0.3.2",
         "define-property": "1.0.0",
@@ -4865,9 +5130,9 @@
       "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc="
     },
     "fast-memoize": {
-      "version": "2.2.8",
-      "resolved": "https://registry.npmjs.org/fast-memoize/-/fast-memoize-2.2.8.tgz",
-      "integrity": "sha512-3ppTC3fZ9Vwtjslx8DkhSIbI9PH1nM4pobuTHQINOxTxchG8n3SDGZ8L6jbatGJCGLKR+gbkNWKFN4E1iUROSA=="
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/fast-memoize/-/fast-memoize-2.3.0.tgz",
+      "integrity": "sha512-wH36QD7q17IXIq3WDEQTb+eehTzpCXXdGRAYw4jQdVmMWdBZc5ysRhV/5nZx67KBNgFt1H1XwLgDiYxQL3uXJw=="
     },
     "fastparse": {
       "version": "1.1.1",
@@ -4942,9 +5207,9 @@
       }
     },
     "filesize": {
-      "version": "3.5.11",
-      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.5.11.tgz",
-      "integrity": "sha512-ZH7loueKBoDb7yG9esn1U+fgq7BzlzW6NRi5/rMdxIZ05dj7GFD/Xc5rq2CDt5Yq86CyfSYVyx4242QQNZbx1g=="
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.6.0.tgz",
+      "integrity": "sha512-g5OWtoZWcPI56js1DFhIEqyG9tnu/7sG3foHwgS9KGYFMfsYguI3E+PRVCmtmE96VajQIEMRU2OhN+ME589Gdw=="
     },
     "fill-range": {
       "version": "4.0.0",
@@ -4963,7 +5228,7 @@
       "integrity": "sha1-zgtoVbRYU+eRsvzGgARtiCU91/U=",
       "requires": {
         "debug": "2.6.9",
-        "encodeurl": "1.0.1",
+        "encodeurl": "1.0.2",
         "escape-html": "1.0.3",
         "on-finished": "2.3.0",
         "parseurl": "1.3.2",
@@ -5018,10 +5283,19 @@
       "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz",
       "integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I="
     },
+    "flush-write-stream": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/flush-write-stream/-/flush-write-stream-1.0.2.tgz",
+      "integrity": "sha1-yBuQ2HRnZvGmCaRoCZRsRd2K5Bc=",
+      "requires": {
+        "inherits": "2.0.3",
+        "readable-stream": "2.3.4"
+      }
+    },
     "follow-redirects": {
-      "version": "1.2.6",
-      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.2.6.tgz",
-      "integrity": "sha512-FrMqZ/FONtHnbqO651UPpfRUVukIEwJhXMfdr/JWAmrDbeYBu773b1J6gdWDyRIj4hvvzQEHoEOTrdR8o6KLYA==",
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.4.1.tgz",
+      "integrity": "sha512-uxYePVPogtya1ktGnAAXOacnbIuRMB4dkvqeNz2qTtTQsuzSfbDolV+wMMKxAmCx0bLgAKLbBOkjItMbbkR1vg==",
       "requires": {
         "debug": "3.1.0"
       },
@@ -5069,14 +5343,6 @@
         "mime-types": "2.1.17"
       }
     },
-    "formatio": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/formatio/-/formatio-1.2.0.tgz",
-      "integrity": "sha1-87IWfZBoxGmKjVH092CjmlTYGOs=",
-      "requires": {
-        "samsam": "1.3.0"
-      }
-    },
     "forwarded": {
       "version": "0.1.2",
       "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.1.2.tgz",
@@ -5095,6 +5361,15 @@
       "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz",
       "integrity": "sha1-PYyt2Q2XZWn6g1qx+OSyOhBWBac="
     },
+    "from2": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/from2/-/from2-2.3.0.tgz",
+      "integrity": "sha1-i/tVAr3kpNNs/e6gB/zKIdfjgq8=",
+      "requires": {
+        "inherits": "2.0.3",
+        "readable-stream": "2.3.4"
+      }
+    },
     "fs-extra": {
       "version": "0.26.7",
       "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz",
@@ -5107,6 +5382,17 @@
         "rimraf": "2.6.2"
       }
     },
+    "fs-write-stream-atomic": {
+      "version": "1.0.10",
+      "resolved": "https://registry.npmjs.org/fs-write-stream-atomic/-/fs-write-stream-atomic-1.0.10.tgz",
+      "integrity": "sha1-tH31NJPvkR33VzHnCp3tAYnbQMk=",
+      "requires": {
+        "graceful-fs": "4.1.11",
+        "iferr": "0.1.5",
+        "imurmurhash": "0.1.4",
+        "readable-stream": "2.3.4"
+      }
+    },
     "fs.realpath": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
@@ -5129,9 +5415,9 @@
       "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A=="
     },
     "function.prototype.name": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.0.3.tgz",
-      "integrity": "sha512-5EblxZUdioXi2JiMZ9FUbwYj40eQ9MFHyzFLBSPdlRl3SO8l7SLWuAnQ/at/1Wi4hjJwME/C5WpF2ZfAc8nGNw==",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.1.0.tgz",
+      "integrity": "sha512-Bs0VRrTz4ghD8pTmbJQD1mZ8A/mN0ur/jGz+A6FBxPDUPkm1tNfF6bhTYPA7i7aF4lZJVr+OXTNNrnnIl58Wfg==",
       "requires": {
         "define-properties": "1.1.2",
         "function-bind": "1.1.1",
@@ -5314,12 +5600,12 @@
       }
     },
     "glamorous": {
-      "version": "4.11.0",
-      "resolved": "https://registry.npmjs.org/glamorous/-/glamorous-4.11.0.tgz",
-      "integrity": "sha512-qWRmq5HZ6kGnp09/z3I0L5ZWZF8PX9W90ED8Ndm3ccfaamWRcEURYilk3zA1M1VW1xJlV28+aD2XlwbQF5YlSw==",
+      "version": "4.11.4",
+      "resolved": "https://registry.npmjs.org/glamorous/-/glamorous-4.11.4.tgz",
+      "integrity": "sha512-H7e28mVL8IUGMD3yL6W3A/wtdZ7gM69xV6VMRe3ciI+5SgZxENiKDW49Tv14IhKeFVlUrBmhyAgzzUMMw4H0Cw==",
       "requires": {
         "brcast": "3.0.1",
-        "fast-memoize": "2.2.8",
+        "fast-memoize": "2.3.0",
         "html-tag-names": "1.1.2",
         "is-function": "1.0.1",
         "is-plain-object": "2.0.4",
@@ -5411,14 +5697,14 @@
       "integrity": "sha1-HcScaCLdnoovoAuiopUAboZkvQk=",
       "requires": {
         "glob": "7.1.2",
-        "lodash": "4.17.4",
+        "lodash": "4.17.5",
         "minimatch": "3.0.4"
       },
       "dependencies": {
         "lodash": {
-          "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
         }
       }
     },
@@ -5491,7 +5777,7 @@
       "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-5.0.3.tgz",
       "integrity": "sha1-ukAsJmGU8VlW7xXg/PJCmT9qff0=",
       "requires": {
-        "ajv": "5.5.1",
+        "ajv": "5.5.2",
         "har-schema": "2.0.0"
       }
     },
@@ -5512,9 +5798,14 @@
       }
     },
     "has-flag": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
-      "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
+      "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0="
+    },
+    "has-symbols": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.0.0.tgz",
+      "integrity": "sha1-uhqPGvKg/DllD1yFA2dwQSIGO0Q="
     },
     "has-unicode": {
       "version": "2.0.1",
@@ -5629,7 +5920,7 @@
       "requires": {
         "inherits": "2.0.3",
         "obuf": "1.1.1",
-        "readable-stream": "2.3.3",
+        "readable-stream": "2.3.4",
         "wbuf": "1.7.2"
       }
     },
@@ -5656,11 +5947,80 @@
       "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-1.2.1.tgz",
       "integrity": "sha1-DfKTUfByEWNRXfueVUPl9u7VFi8="
     },
+    "html-loader": {
+      "version": "0.5.5",
+      "resolved": "https://registry.npmjs.org/html-loader/-/html-loader-0.5.5.tgz",
+      "integrity": "sha512-7hIW7YinOYUpo//kSYcPB6dCKoceKLmOwjEMmhIobHuWGDVl0Nwe4l68mdG/Ru0wcUxQjVMEoZpkalZ/SE7zog==",
+      "requires": {
+        "es6-templates": "0.2.3",
+        "fastparse": "1.1.1",
+        "html-minifier": "3.5.9",
+        "loader-utils": "1.1.0",
+        "object-assign": "4.1.1"
+      }
+    },
+    "html-minifier": {
+      "version": "3.5.9",
+      "resolved": "https://registry.npmjs.org/html-minifier/-/html-minifier-3.5.9.tgz",
+      "integrity": "sha512-EZqO91XJwkj8BeLx9C12sKB/AHoTANaZax39vEOP9f/X/9jgJ3r1O2+neabuHqpz5kJO71TapP9JrtCY39su1A==",
+      "requires": {
+        "camel-case": "3.0.0",
+        "clean-css": "4.1.9",
+        "commander": "2.14.1",
+        "he": "1.1.1",
+        "ncname": "1.0.0",
+        "param-case": "2.1.1",
+        "relateurl": "0.2.7",
+        "uglify-js": "3.3.10"
+      },
+      "dependencies": {
+        "uglify-js": {
+          "version": "3.3.10",
+          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.3.10.tgz",
+          "integrity": "sha512-dNib7aUDNZFJNTXFyq0CDmLRVOsnY1F+IQgt2FAOdZFx2+LvKVLbbIb/fL+BYKCv3YH3bPCE/6M/JaxChtQLHQ==",
+          "requires": {
+            "commander": "2.14.1",
+            "source-map": "0.6.1"
+          }
+        }
+      }
+    },
     "html-tag-names": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/html-tag-names/-/html-tag-names-1.1.2.tgz",
       "integrity": "sha1-9lFolkxanIJnXv2ogoddyyqHXCI="
     },
+    "html-webpack-plugin": {
+      "version": "2.30.1",
+      "resolved": "https://registry.npmjs.org/html-webpack-plugin/-/html-webpack-plugin-2.30.1.tgz",
+      "integrity": "sha1-f5xCG36pHsRg9WUn1430hO51N9U=",
+      "requires": {
+        "bluebird": "3.5.1",
+        "html-minifier": "3.5.9",
+        "loader-utils": "0.2.17",
+        "lodash": "4.17.5",
+        "pretty-error": "2.1.1",
+        "toposort": "1.0.6"
+      },
+      "dependencies": {
+        "loader-utils": {
+          "version": "0.2.17",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-0.2.17.tgz",
+          "integrity": "sha1-+G5jdNQyBabmxg6RlvF8Apm/s0g=",
+          "requires": {
+            "big.js": "3.2.0",
+            "emojis-list": "2.1.0",
+            "json5": "0.5.1",
+            "object-assign": "4.1.1"
+          }
+        },
+        "lodash": {
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
+        }
+      }
+    },
     "htmlparser2": {
       "version": "3.9.2",
       "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.9.2.tgz",
@@ -5671,7 +6031,7 @@
         "domutils": "1.5.1",
         "entities": "1.1.1",
         "inherits": "2.0.3",
-        "readable-stream": "2.3.3"
+        "readable-stream": "2.3.4"
       }
     },
     "http-deceiver": {
@@ -5690,6 +6050,11 @@
         "statuses": "1.3.1"
       },
       "dependencies": {
+        "depd": {
+          "version": "1.1.1",
+          "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.1.tgz",
+          "integrity": "sha1-V4O04cRZ8G+lyif5kfPQbnoxA1k="
+        },
         "setprototypeof": {
           "version": "1.0.3",
           "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.0.3.tgz",
@@ -5698,9 +6063,9 @@
       }
     },
     "http-parser-js": {
-      "version": "0.4.9",
-      "resolved": "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.4.9.tgz",
-      "integrity": "sha1-6hoE+2St/wJC6ZdPKX3Uw8rSceE="
+      "version": "0.4.10",
+      "resolved": "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.4.10.tgz",
+      "integrity": "sha1-ksnBN0w1CF912zWexWzCV8u5P6Q="
     },
     "http-proxy": {
       "version": "1.16.2",
@@ -5718,7 +6083,7 @@
       "requires": {
         "http-proxy": "1.16.2",
         "is-glob": "3.1.0",
-        "lodash": "4.17.4",
+        "lodash": "4.17.5",
         "micromatch": "2.3.11"
       },
       "dependencies": {
@@ -5790,9 +6155,9 @@
           }
         },
         "lodash": {
-          "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
         },
         "micromatch": {
           "version": "2.3.11",
@@ -5876,7 +6241,7 @@
       "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-2.1.0.tgz",
       "integrity": "sha1-g/Cg7DeL8yRheLbCrZE28TWxyWI=",
       "requires": {
-        "postcss": "6.0.14"
+        "postcss": "6.0.17"
       }
     },
     "ieee754": {
@@ -5884,9 +6249,15 @@
       "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.8.tgz",
       "integrity": "sha1-vjPUCsEO8ZJnAfbwii2G+/0a0+Q="
     },
+    "iferr": {
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/iferr/-/iferr-0.1.5.tgz",
+      "integrity": "sha1-xg7taebY/bazEEofy8ocGS3FtQE="
+    },
     "immutability-helper": {
       "version": "2.6.4",
       "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.6.4.tgz",
+      "integrity": "sha512-jhFwZoBOOzfxKXGO86G0zrD0dHEUgAfFhDMOBRizonX2nUtWAG8vepjTVJkmJDoKV6XtPlm/21gNXcToBe0D/A==",
       "requires": {
         "invariant": "2.2.2"
       }
@@ -5897,9 +6268,9 @@
       "integrity": "sha1-wkOZUUVbs5kT2vKBN28VMOEErfM="
     },
     "import-local": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/import-local/-/import-local-0.1.1.tgz",
-      "integrity": "sha1-sReVcqrNwRxqkQCftDDbyrX2aKg=",
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/import-local/-/import-local-1.0.0.tgz",
+      "integrity": "sha512-vAaZHieK9qjGo58agRBg+bhHX3hoTZU/Oa3GESWLz7t1U62fk63aHuDJJEteXoDeTCcPmUT+z38gkHPZkkmpmQ==",
       "requires": {
         "pkg-dir": "2.0.0",
         "resolve-cwd": "2.0.0"
@@ -5952,7 +6323,7 @@
       "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-3.0.8.tgz",
       "integrity": "sha1-hVG45bTVcyROZqNLBPfTIHaitTQ=",
       "requires": {
-        "bowser": "1.8.1",
+        "bowser": "1.9.2",
         "css-in-js-utils": "2.0.0"
       }
     },
@@ -6042,21 +6413,11 @@
       "integrity": "sha1-UFMN+4T8yap9vnhS6Do3uTufKqY="
     },
     "is-accessor-descriptor": {
-      "version": "0.1.6",
-      "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
-      "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-1.0.0.tgz",
+      "integrity": "sha512-m5hnHTkcVsPfqx3AKlyttIPb7J+XykHvJP2B9bZDjlhLIoEq4XoK64Vg7boZlVWYK6LUY94dYPEE7Lh0ZkZKcQ==",
       "requires": {
-        "kind-of": "3.2.2"
-      },
-      "dependencies": {
-        "kind-of": {
-          "version": "3.2.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
-          "requires": {
-            "is-buffer": "1.1.6"
-          }
-        }
+        "kind-of": "6.0.2"
       }
     },
     "is-arrayish": {
@@ -6072,6 +6433,11 @@
         "binary-extensions": "1.11.0"
       }
     },
+    "is-boolean-object": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-boolean-object/-/is-boolean-object-1.0.0.tgz",
+      "integrity": "sha1-mPiygDBoQhmpXzdc+9iM40Bd/5M="
+    },
     "is-buffer": {
       "version": "1.1.6",
       "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
@@ -6091,29 +6457,19 @@
       "integrity": "sha1-hut1OSgF3cM69xySoO7fdO52BLI="
     },
     "is-ci": {
-      "version": "1.0.10",
-      "resolved": "https://registry.npmjs.org/is-ci/-/is-ci-1.0.10.tgz",
-      "integrity": "sha1-9zkzayYyNlBhqdSCcM1WrjNpMY4=",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/is-ci/-/is-ci-1.1.0.tgz",
+      "integrity": "sha512-c7TnwxLePuqIlxHgr7xtxzycJPegNHFuIrBkwbf8hc58//+Op1CqFkyS+xnIMkwn9UsJIwc174BIjkyBmSpjKg==",
       "requires": {
         "ci-info": "1.1.2"
       }
     },
     "is-data-descriptor": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
-      "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-1.0.0.tgz",
+      "integrity": "sha512-jbRXy1FmtAoCjQkVmIVYwuuqDFUbaOeDjmed1tOGPrsMhtJA4rD9tkgA0F1qJ3gRFRXcHYVkdeaP50Q5rE/jLQ==",
       "requires": {
-        "kind-of": "3.2.2"
-      },
-      "dependencies": {
-        "kind-of": {
-          "version": "3.2.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
-          "requires": {
-            "is-buffer": "1.1.6"
-          }
-        }
+        "kind-of": "6.0.2"
       }
     },
     "is-date-object": {
@@ -6122,20 +6478,13 @@
       "integrity": "sha1-mqIOtq7rv/d/vTPnTKAbM1gdOhY="
     },
     "is-descriptor": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-1.0.1.tgz",
-      "integrity": "sha512-G3fFVFTqfaqu7r4YuSBHKBAuOaLz8Sy7ekklUpFEliaLMP1Y2ZjoN9jS62YWCAPQrQpMUQSitRlrzibbuCZjdA==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-1.0.2.tgz",
+      "integrity": "sha512-2eis5WqQGV7peooDyLmNEPUrps9+SXX5c9pL3xEB+4e9HnGuDa7mB7kHxHw4CbqS9k1T2hOH3miL8n8WtiYVtg==",
       "requires": {
-        "is-accessor-descriptor": "0.1.6",
-        "is-data-descriptor": "0.1.4",
-        "kind-of": "5.1.0"
-      },
-      "dependencies": {
-        "kind-of": {
-          "version": "5.1.0",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
-          "integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw=="
-        }
+        "is-accessor-descriptor": "1.0.0",
+        "is-data-descriptor": "1.0.0",
+        "kind-of": "6.0.2"
       }
     },
     "is-directory": {
@@ -6198,9 +6547,9 @@
       }
     },
     "is-my-json-valid": {
-      "version": "2.16.1",
-      "resolved": "https://registry.npmjs.org/is-my-json-valid/-/is-my-json-valid-2.16.1.tgz",
-      "integrity": "sha512-ochPsqWS1WXj8ZnMIV0vnNXooaMhp7cyL4FMSIPKTtnV0Ha/T19G2b9kkhcNsabV9bxYkze7/aLZJb/bYuFduQ==",
+      "version": "2.17.1",
+      "resolved": "https://registry.npmjs.org/is-my-json-valid/-/is-my-json-valid-2.17.1.tgz",
+      "integrity": "sha512-Q2khNw+oBlWuaYvEEHtKSw/pCxD2L5Rc1C+UQme9X6JdRDh7m5D7HkozA0qa3DUkQ6VzCnEm8mVIQPyIRkI5sQ==",
       "requires": {
         "generate-function": "2.0.0",
         "generate-object-property": "1.2.0",
@@ -6226,6 +6575,11 @@
         }
       }
     },
+    "is-number-object": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/is-number-object/-/is-number-object-1.0.3.tgz",
+      "integrity": "sha1-8mWrian0RQNO9q/xWo8AsA9VF5k="
+    },
     "is-obj": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-1.0.1.tgz",
@@ -6306,6 +6660,11 @@
       "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz",
       "integrity": "sha1-EtSj3U5o4Lec6428hBc66A2RykQ="
     },
+    "is-string": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/is-string/-/is-string-1.0.4.tgz",
+      "integrity": "sha1-zDqbaYV9Yh6WNyWiTK7shzuCbmQ="
+    },
     "is-subset": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/is-subset/-/is-subset-0.1.1.tgz",
@@ -6409,13 +6768,13 @@
       "resolved": "https://registry.npmjs.org/istanbul-lib-instrument/-/istanbul-lib-instrument-1.9.1.tgz",
       "integrity": "sha512-RQmXeQ7sphar7k7O1wTNzVczF9igKpaeGQAG9qR2L+BS4DCJNTI9nytRmIVYevwO0bbq+2CXvJmYDuz0gMrywA==",
       "requires": {
-        "babel-generator": "6.26.0",
+        "babel-generator": "6.26.1",
         "babel-template": "6.26.0",
         "babel-traverse": "6.26.0",
         "babel-types": "6.26.0",
         "babylon": "6.18.0",
         "istanbul-lib-coverage": "1.1.1",
-        "semver": "5.4.1"
+        "semver": "5.5.0"
       }
     },
     "istanbul-lib-report": {
@@ -6547,10 +6906,10 @@
           "integrity": "sha512-T1BzrbFxDIW/LLYQqVfo94y/hhaj1NzVQkZgBumAC+sxbjMROI7VkihOdxNR758iYbQykL2ZOWUBurFgkQrzdg==",
           "requires": {
             "ansi-escapes": "3.0.0",
-            "chalk": "2.3.0",
+            "chalk": "2.3.1",
             "glob": "7.1.2",
             "graceful-fs": "4.1.11",
-            "is-ci": "1.0.10",
+            "is-ci": "1.1.0",
             "istanbul-api": "1.2.1",
             "istanbul-lib-coverage": "1.1.1",
             "istanbul-lib-instrument": "1.9.1",
@@ -6567,7 +6926,7 @@
             "jest-snapshot": "21.2.1",
             "jest-util": "21.2.1",
             "micromatch": "2.3.11",
-            "node-notifier": "5.1.2",
+            "node-notifier": "5.2.1",
             "pify": "3.0.0",
             "slash": "1.0.0",
             "string-length": "2.0.0",
@@ -6648,7 +7007,7 @@
       "resolved": "https://registry.npmjs.org/jest-config/-/jest-config-21.2.1.tgz",
       "integrity": "sha512-fJru5HtlD/5l2o25eY9xT0doK3t2dlglrqoGpbktduyoI0T5CwuB++2YfoNZCrgZipTwPuAGonYv0q7+8yDc/A==",
       "requires": {
-        "chalk": "2.3.0",
+        "chalk": "2.3.1",
         "glob": "7.1.2",
         "jest-environment-jsdom": "21.2.1",
         "jest-environment-node": "21.2.1",
@@ -6666,7 +7025,7 @@
       "resolved": "https://registry.npmjs.org/jest-diff/-/jest-diff-21.2.1.tgz",
       "integrity": "sha512-E5fu6r7PvvPr5qAWE1RaUwIh/k6Zx/3OOkZ4rk5dBJkEWRrUuSgbMt2EO8IUTPTd6DOqU3LW6uTIwX5FRvXoFA==",
       "requires": {
-        "chalk": "2.3.0",
+        "chalk": "2.3.1",
         "diff": "3.4.0",
         "jest-get-type": "21.2.0",
         "pretty-format": "21.2.1"
@@ -6710,7 +7069,7 @@
         "graceful-fs": "4.1.11",
         "jest-docblock": "21.2.0",
         "micromatch": "2.3.11",
-        "sane": "2.2.0",
+        "sane": "2.4.1",
         "worker-farm": "1.5.2"
       },
       "dependencies": {
@@ -6788,7 +7147,7 @@
       "resolved": "https://registry.npmjs.org/jest-jasmine2/-/jest-jasmine2-21.2.1.tgz",
       "integrity": "sha512-lw8FXXIEekD+jYNlStfgNsUHpfMWhWWCgHV7n0B7mA/vendH7vBFs8xybjQsDzJSduptBZJHqQX9SMssya9+3A==",
       "requires": {
-        "chalk": "2.3.0",
+        "chalk": "2.3.1",
         "expect": "21.2.1",
         "graceful-fs": "4.1.11",
         "jest-diff": "21.2.1",
@@ -6803,7 +7162,7 @@
       "resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-21.2.1.tgz",
       "integrity": "sha512-kn56My+sekD43dwQPrXBl9Zn9tAqwoy25xxe7/iY4u+mG8P3ALj5IK7MLHZ4Mi3xW7uWVCjGY8cm4PqgbsqMCg==",
       "requires": {
-        "chalk": "2.3.0",
+        "chalk": "2.3.1",
         "jest-get-type": "21.2.0",
         "pretty-format": "21.2.1"
       }
@@ -6813,7 +7172,7 @@
       "resolved": "https://registry.npmjs.org/jest-message-util/-/jest-message-util-21.2.1.tgz",
       "integrity": "sha512-EbC1X2n0t9IdeMECJn2BOg7buOGivCvVNjqKMXTzQOu7uIfLml+keUfCALDh8o4rbtndIeyGU8/BKfoTr/LVDQ==",
       "requires": {
-        "chalk": "2.3.0",
+        "chalk": "2.3.1",
         "micromatch": "2.3.11",
         "slash": "1.0.0"
       },
@@ -6903,7 +7262,7 @@
       "integrity": "sha512-vefQ/Lr+VdNvHUZFQXWtOqHX3HEdOc2MtSahBO89qXywEbUxGPB9ZLP9+BHinkxb60UT2Q/tTDOS6rYc6Mwigw==",
       "requires": {
         "browser-resolve": "1.11.2",
-        "chalk": "2.3.0",
+        "chalk": "2.3.1",
         "is-builtin-module": "1.0.0"
       }
     },
@@ -6940,7 +7299,7 @@
         "babel-core": "6.26.0",
         "babel-jest": "21.2.0",
         "babel-plugin-istanbul": "4.1.5",
-        "chalk": "2.3.0",
+        "chalk": "2.3.1",
         "convert-source-map": "1.5.1",
         "graceful-fs": "4.1.11",
         "jest-config": "21.2.1",
@@ -7050,7 +7409,7 @@
       "resolved": "https://registry.npmjs.org/jest-snapshot/-/jest-snapshot-21.2.1.tgz",
       "integrity": "sha512-bpaeBnDpdqaRTzN8tWg0DqOTo2DvD3StOemxn67CUd1p1Po+BUpvePAp44jdJ7Pxcjfg+42o4NHw1SxdCA2rvg==",
       "requires": {
-        "chalk": "2.3.0",
+        "chalk": "2.3.1",
         "jest-diff": "21.2.1",
         "jest-matcher-utils": "21.2.1",
         "mkdirp": "0.5.1",
@@ -7064,7 +7423,7 @@
       "integrity": "sha512-r20W91rmHY3fnCoO7aOAlyfC51x2yeV3xF+prGsJAUsYhKeV670ZB8NO88Lwm7ASu8SdH0S+U+eFf498kjhA4g==",
       "requires": {
         "callsites": "2.0.0",
-        "chalk": "2.3.0",
+        "chalk": "2.3.1",
         "graceful-fs": "4.1.11",
         "jest-message-util": "21.2.1",
         "jest-mock": "21.2.0",
@@ -7077,7 +7436,7 @@
       "resolved": "https://registry.npmjs.org/jest-validate/-/jest-validate-21.2.1.tgz",
       "integrity": "sha512-k4HLI1rZQjlU+EC682RlQ6oZvLrE5SCh3brseQc24vbZTxzT/k/3urar5QMCVgjadmSO7lECeGdc6YxnM3yEGg==",
       "requires": {
-        "chalk": "2.3.0",
+        "chalk": "2.3.1",
         "jest-get-type": "21.2.0",
         "leven": "2.1.0",
         "pretty-format": "21.2.1"
@@ -7096,14 +7455,14 @@
         "hoek": "4.2.0",
         "isemail": "2.2.1",
         "items": "2.1.1",
-        "moment": "2.19.4",
+        "moment": "2.20.1",
         "topo": "2.0.2"
       }
     },
     "js-base64": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.4.0.tgz",
-      "integrity": "sha512-Wehd+7Pf9tFvGb+ydPm9TjYjV8X1YHOVyG8QyELZxEMqOhemVwGRmoG8iQ/soqI3n8v4xn59zaLxiCJiaaRzKA=="
+      "version": "2.4.3",
+      "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.4.3.tgz",
+      "integrity": "sha512-H7ErYLM34CvDMto3GbD6xD0JLUGYXR3QTcH6B/tr4Hi/QpSThnCsIp+Sy5FRTw3B0d6py4HcNkW7nO/wdtGWEw=="
     },
     "js-tokens": {
       "version": "3.0.2",
@@ -7328,19 +7687,9 @@
       "integrity": "sha1-MWI5HY8BQKoiz49rPDTWt/Y9Oqk="
     },
     "lodash-es": {
-      "version": "4.17.4",
-      "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.4.tgz",
-      "integrity": "sha1-3MHXVS4VCgZABzupyzHXDwMpUOc="
-    },
-    "lodash._arraycopy": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._arraycopy/-/lodash._arraycopy-3.0.0.tgz",
-      "integrity": "sha1-due3wfH7klRzdIeKVi7Qaj5Q9uE="
-    },
-    "lodash._arrayeach": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lodash._arrayeach/-/lodash._arrayeach-3.0.0.tgz",
-      "integrity": "sha1-urFWsqkNPxu9XGU0AzSeXlkz754="
+      "version": "4.17.5",
+      "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.5.tgz",
+      "integrity": "sha512-Ez3ONp3TK9gX1HYKp6IhetcVybD+2F+Yp6GS9dfH8ue6EOCEzQtQEh4K0FYWBP9qLv+lzeQAYXw+3ySfxyZqkw=="
     },
     "lodash._baseassign": {
       "version": "3.2.0",
@@ -7351,19 +7700,6 @@
         "lodash.keys": "3.1.2"
       }
     },
-    "lodash._baseclone": {
-      "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/lodash._baseclone/-/lodash._baseclone-3.3.0.tgz",
-      "integrity": "sha1-MDUZv2OT/n5C802LYw73eU41Qrc=",
-      "requires": {
-        "lodash._arraycopy": "3.0.0",
-        "lodash._arrayeach": "3.0.0",
-        "lodash._baseassign": "3.2.0",
-        "lodash._basefor": "3.0.3",
-        "lodash.isarray": "3.0.4",
-        "lodash.keys": "3.1.2"
-      }
-    },
     "lodash._basecopy": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz",
@@ -7374,16 +7710,6 @@
       "resolved": "https://registry.npmjs.org/lodash._basecreate/-/lodash._basecreate-3.0.3.tgz",
       "integrity": "sha1-G8ZhYU2qf8MRt9A78WgGoCE8+CE="
     },
-    "lodash._basefor": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/lodash._basefor/-/lodash._basefor-3.0.3.tgz",
-      "integrity": "sha1-dVC06SGO8J+tJDQ7YSAhx5tMIMI="
-    },
-    "lodash._bindcallback": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/lodash._bindcallback/-/lodash._bindcallback-3.0.1.tgz",
-      "integrity": "sha1-5THCdkTPi1epnhftlbNcdIeJOS4="
-    },
     "lodash._getnative": {
       "version": "3.9.1",
       "resolved": "https://registry.npmjs.org/lodash._getnative/-/lodash._getnative-3.9.1.tgz",
@@ -7470,9 +7796,9 @@
       "integrity": "sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4="
     },
     "lodash.mergewith": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/lodash.mergewith/-/lodash.mergewith-4.6.0.tgz",
-      "integrity": "sha1-FQzwoWeR9ZA7iJHqsVRgknS96lU="
+      "version": "4.6.1",
+      "resolved": "https://registry.npmjs.org/lodash.mergewith/-/lodash.mergewith-4.6.1.tgz",
+      "integrity": "sha512-eWw5r+PYICtEBgrBE5hhlT6aAa75f411bgDz/ZL2KZqYV03USvucsxcHUIlGTDTECs1eunpI7HOV7U+WLDvNdQ=="
     },
     "lodash.pick": {
       "version": "4.4.0",
@@ -7494,25 +7820,20 @@
       "resolved": "https://registry.npmjs.org/lodash.tail/-/lodash.tail-4.1.1.tgz",
       "integrity": "sha1-0jM6NtnncXyK0vfKyv7HwytERmQ="
     },
-    "lodash.toarray": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/lodash.toarray/-/lodash.toarray-4.4.0.tgz",
-      "integrity": "sha1-JMS/zWsvuji/0FlNsRedjptlZWE="
-    },
     "lodash.uniq": {
       "version": "4.5.0",
       "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz",
       "integrity": "sha1-0CJTc662Uq3BvILklFM5qEJ1R3M="
     },
     "loglevel": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/loglevel/-/loglevel-1.6.0.tgz",
-      "integrity": "sha1-rgyqVhERSYxboTcj1vtjHSQAOTQ="
+      "version": "1.6.1",
+      "resolved": "https://registry.npmjs.org/loglevel/-/loglevel-1.6.1.tgz",
+      "integrity": "sha1-4PyVEztu8nbNyIh82vJKpvFW+Po="
     },
     "lolex": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/lolex/-/lolex-2.3.1.tgz",
-      "integrity": "sha512-mQuW55GhduF3ppo+ZRUTz1PRjEh1hS5BbqU7d8D0ez2OKxHDod7StPPeAVKisZR5aLkHZjdGWSL42LSONUJsZw=="
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/lolex/-/lolex-2.3.2.tgz",
+      "integrity": "sha512-A5pN2tkFj7H0dGIAM6MFvHKMJcPnjZsOMvR7ujCjfgW5TbV6H9vb1PgxLtHvjqNZTHsUolz+6/WEO0N1xNx2ng=="
     },
     "longest": {
       "version": "1.0.1",
@@ -7536,6 +7857,11 @@
         "signal-exit": "3.0.2"
       }
     },
+    "lower-case": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-1.1.4.tgz",
+      "integrity": "sha1-miyr0bno4K6ZOkv31YdcOcQujqw="
+    },
     "lru-cache": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.1.tgz",
@@ -7558,6 +7884,11 @@
         "pify": "3.0.0"
       }
     },
+    "make-error": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.3.tgz",
+      "integrity": "sha512-j3dZCri3cCd23wgPqK/0/KvTN8R+W6fXDqQe8BNLbTpONjbA8SPaRr+q0BQq9bx3Q/+g68/gDIh9FW3by702Tg=="
+    },
     "makeerror": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/makeerror/-/makeerror-1.0.11.tgz",
@@ -7584,47 +7915,20 @@
         "object-visit": "1.0.1"
       }
     },
-    "marked": {
-      "version": "0.3.7",
-      "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.7.tgz",
-      "integrity": "sha512-zBEP4qO1YQp5aXHt8S5wTiOv9i2X74V/LQL0zhUNvVaklt6Ywa6lChxIvS+ibYlCGgADwKwZFhjC3+XfpsvQvQ=="
-    },
-    "marked-terminal": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/marked-terminal/-/marked-terminal-1.7.0.tgz",
-      "integrity": "sha1-yMRgiBx3LHYEtkNnAH7l938SWQQ=",
+    "markdown-loader": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/markdown-loader/-/markdown-loader-2.0.2.tgz",
+      "integrity": "sha512-v/ej7DflZbb6t//3Yu9vg0T+sun+Q9EoqggifeyABKfvFROqPwwwpv+hd1NKT2QxTRg6VCFk10IIJcMI13yCoQ==",
       "requires": {
-        "cardinal": "1.0.0",
-        "chalk": "1.1.3",
-        "cli-table": "0.3.1",
-        "lodash.assign": "4.2.0",
-        "node-emoji": "1.8.1"
-      },
-      "dependencies": {
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
-          "requires": {
-            "ansi-styles": "2.2.1",
-            "escape-string-regexp": "1.0.5",
-            "has-ansi": "2.0.0",
-            "strip-ansi": "3.0.1",
-            "supports-color": "2.0.0"
-          }
-        },
-        "supports-color": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
-        }
+        "loader-utils": "1.1.0",
+        "marked": "0.3.12"
       }
     },
+    "marked": {
+      "version": "0.3.12",
+      "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.12.tgz",
+      "integrity": "sha512-k4NaW+vS7ytQn6MgJn3fYpQt20/mOgYM5Ft9BYMfQJDz2QT6yEeS9XJ8k2Nw8JTeWK/znPPW2n3UJGzyYEiMoA=="
+    },
     "math-expression-evaluator": {
       "version": "1.2.17",
       "resolved": "https://registry.npmjs.org/math-expression-evaluator/-/math-expression-evaluator-1.2.17.tgz",
@@ -7660,7 +7964,7 @@
       "resolved": "https://registry.npmjs.org/mem/-/mem-1.1.0.tgz",
       "integrity": "sha1-Xt1StIXKHZAP5kiVUFOZoN+kX3Y=",
       "requires": {
-        "mimic-fn": "1.1.0"
+        "mimic-fn": "1.2.0"
       }
     },
     "memory-fs": {
@@ -7669,7 +7973,7 @@
       "integrity": "sha1-OpoguEYlI+RHz7x+i7gO1me/xVI=",
       "requires": {
         "errno": "0.1.6",
-        "readable-stream": "2.3.3"
+        "readable-stream": "2.3.4"
       }
     },
     "meow": {
@@ -7783,19 +8087,19 @@
       "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4="
     },
     "micromatch": {
-      "version": "3.1.4",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-3.1.4.tgz",
-      "integrity": "sha512-kFRtviKYoAJT+t7HggMl0tBFGNAKLw/S7N+CO9qfEQyisob1Oy4pao+geRbkyeEd+V9aOkvZ4mhuyPvI/q9Sfg==",
+      "version": "3.1.5",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-3.1.5.tgz",
+      "integrity": "sha512-ykttrLPQrz1PUJcXjwsTUjGoPJ64StIGNE2lGVD1c9CuguJ+L7/navsE8IcDNndOoCMvYV0qc/exfVbMHkUhvA==",
       "requires": {
         "arr-diff": "4.0.0",
         "array-unique": "0.3.2",
         "braces": "2.3.0",
         "define-property": "1.0.0",
         "extend-shallow": "2.0.1",
-        "extglob": "2.0.2",
+        "extglob": "2.0.4",
         "fragment-cache": "0.2.1",
         "kind-of": "6.0.2",
-        "nanomatch": "1.2.6",
+        "nanomatch": "1.2.7",
         "object.pick": "1.3.0",
         "regex-not": "1.0.0",
         "snapdragon": "0.8.1",
@@ -7830,9 +8134,9 @@
       }
     },
     "mimic-fn": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-1.1.0.tgz",
-      "integrity": "sha1-5md4PZLonb00KBi1IwudYqZyrRg="
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-1.2.0.tgz",
+      "integrity": "sha512-jf84uxzwiuiIVKiOLpfYk7N46TSy8ubTonmneY9vrpHNAnp0QBt2BxWV9dO3/j+BoVAb+a5G6YDPW3M5HOdMWQ=="
     },
     "min-document": {
       "version": "2.19.0",
@@ -7857,7 +8161,7 @@
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
       "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==",
       "requires": {
-        "brace-expansion": "1.1.8"
+        "brace-expansion": "1.1.11"
       }
     },
     "minimist": {
@@ -7865,10 +8169,27 @@
       "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
       "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0="
     },
+    "mississippi": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/mississippi/-/mississippi-1.3.1.tgz",
+      "integrity": "sha512-/6rB8YXFbAtsUVRphIRQqB0+9c7VaPHCjVtvto+JqwVxgz8Zz+I+f68/JgQ+Pb4VlZb2svA9OtdXnHHsZz7ltg==",
+      "requires": {
+        "concat-stream": "1.6.0",
+        "duplexify": "3.5.3",
+        "end-of-stream": "1.4.1",
+        "flush-write-stream": "1.0.2",
+        "from2": "2.3.0",
+        "parallel-transform": "1.1.0",
+        "pump": "1.0.3",
+        "pumpify": "1.4.0",
+        "stream-each": "1.2.2",
+        "through2": "2.0.3"
+      }
+    },
     "mixin-deep": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/mixin-deep/-/mixin-deep-1.3.0.tgz",
-      "integrity": "sha512-dgaCvoh6i1nosAUBKb0l0pfJ78K8+S9fluyIR2YvAeUD/QuMahnFnF3xYty5eYXMjhGSsB0DsW6A0uAZyetoAg==",
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/mixin-deep/-/mixin-deep-1.3.1.tgz",
+      "integrity": "sha512-8ZItLHeEgaqEvd5lYBXfm4EZSFCX29Jb9K+lAHhDKzReKBQKj3R+7NOF6tjqYi9t4oI8VUfaWITJQm86wnXGNQ==",
       "requires": {
         "for-in": "1.0.2",
         "is-extendable": "1.0.1"
@@ -7982,9 +8303,22 @@
       }
     },
     "moment": {
-      "version": "2.19.4",
-      "resolved": "https://registry.npmjs.org/moment/-/moment-2.19.4.tgz",
-      "integrity": "sha512-1xFTAknSLfc47DIxHDUbnJWC+UwgWxATmymaxIPQpmMh7LBm7ZbwVEsuushqwL2GYZU0jie4xO+TK44hJPjNSQ=="
+      "version": "2.20.1",
+      "resolved": "https://registry.npmjs.org/moment/-/moment-2.20.1.tgz",
+      "integrity": "sha512-Yh9y73JRljxW5QxN08Fner68eFLxM5ynNOAw2LbIB1YAGeQzZT8QFSUvkAz609Zf+IHhhaUxqZK8dG3W/+HEvg=="
+    },
+    "move-concurrently": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/move-concurrently/-/move-concurrently-1.0.1.tgz",
+      "integrity": "sha1-viwAX9oy4LKa8fBdfEszIUxwH5I=",
+      "requires": {
+        "aproba": "1.2.0",
+        "copy-concurrently": "1.0.5",
+        "fs-write-stream-atomic": "1.0.10",
+        "mkdirp": "0.5.1",
+        "rimraf": "2.6.2",
+        "run-queue": "1.0.3"
+      }
     },
     "ms": {
       "version": "2.0.0",
@@ -7992,12 +8326,12 @@
       "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
     },
     "multicast-dns": {
-      "version": "6.2.1",
-      "resolved": "https://registry.npmjs.org/multicast-dns/-/multicast-dns-6.2.1.tgz",
-      "integrity": "sha512-uV3/ckdsffHx9IrGQrx613mturMdMqQ06WTq+C09NsStJ9iNG6RcUWgPKs1Rfjy+idZT6tfQoXEusGNnEZhT3w==",
+      "version": "6.2.3",
+      "resolved": "https://registry.npmjs.org/multicast-dns/-/multicast-dns-6.2.3.tgz",
+      "integrity": "sha512-ji6J5enbMyGRHIAkAOu3WdV8nggqviKCEKtXcOqfphZZtQrmHKycfynJ2V7eVPUA4NhJ6V7Wf4TmGbTwKE9B6g==",
       "requires": {
-        "dns-packet": "1.2.2",
-        "thunky": "0.1.0"
+        "dns-packet": "1.3.1",
+        "thunky": "1.0.2"
       }
     },
     "multicast-dns-service-types": {
@@ -8021,9 +8355,9 @@
       "integrity": "sha1-7XFfP+neArV6XmJS2QqWZ14fCFo="
     },
     "nanomatch": {
-      "version": "1.2.6",
-      "resolved": "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.6.tgz",
-      "integrity": "sha512-WJ6XTCbvWXUFPbi/bDwKcYkCeOGUHzaJj72KbuPqGn78Ba/F5Vu26Zlo6SuMQbCIst1RGKL1zfWBCOGAlbRLAg==",
+      "version": "1.2.7",
+      "resolved": "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.7.tgz",
+      "integrity": "sha512-/5ldsnyurvEw7wNpxLFgjVvBLMta43niEYOy0CJ4ntcYSbx6bugRUTQeFb4BR/WanEL1o3aQgHuVLHQaB6tOqg==",
       "requires": {
         "arr-diff": "4.0.0",
         "array-unique": "0.3.2",
@@ -8050,14 +8384,23 @@
       "resolved": "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz",
       "integrity": "sha1-Sr6/7tdUHywnrPspvbvRXI1bpPc="
     },
+    "ncname": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/ncname/-/ncname-1.0.0.tgz",
+      "integrity": "sha1-W1etGLHKCShk72Kwse2BlPODtxw=",
+      "requires": {
+        "xml-char-classes": "1.0.0"
+      }
+    },
     "nearley": {
-      "version": "2.11.0",
-      "resolved": "https://registry.npmjs.org/nearley/-/nearley-2.11.0.tgz",
-      "integrity": "sha512-clqqhEuP0ZCJQ85Xv2I/4o2Gs/fvSR6fCg5ZHVE2c8evWyNk2G++ih4JOO3lMb/k/09x6ihQ2nzKUlB/APCWjg==",
+      "version": "2.11.1",
+      "resolved": "https://registry.npmjs.org/nearley/-/nearley-2.11.1.tgz",
+      "integrity": "sha512-1azpqq1JvHKZNPEixS1jNEXf4kDilhFtr8AIZIGjP8N0TcAcUhKgi354niI5pM4JoOsMQ+H6vzCYWQa95LQjcw==",
       "requires": {
         "nomnom": "1.6.2",
         "railroad-diagrams": "1.0.0",
-        "randexp": "0.4.6"
+        "randexp": "0.4.6",
+        "semver": "5.5.0"
       }
     },
     "negotiator": {
@@ -8071,26 +8414,26 @@
       "integrity": "sha1-a+lPysqNd63gqWcNxGCRTJRHJEQ="
     },
     "ngrok": {
-      "version": "2.2.24",
-      "resolved": "https://registry.npmjs.org/ngrok/-/ngrok-2.2.24.tgz",
-      "integrity": "sha512-tz1X/yS3PD5N+Cwijn+bwSrDGNRNPpQPM0TEHtaT8K4sMpFUHFBhRJLlFyoGQyfmSML7Tdq9Fq17AKoEtGaJzw==",
+      "version": "2.2.26",
+      "resolved": "https://registry.npmjs.org/ngrok/-/ngrok-2.2.26.tgz",
+      "integrity": "sha512-DAWmOerUpBvtjLnX+Da9iE5JFCCWXBqYVFwjQtllnveIHL+u/TRjtsYqg4zttkoXXceG+gGon92atDGQd2SgiA==",
       "requires": {
         "@types/node": "8.0.26",
         "async": "2.6.0",
         "decompress-zip": "0.3.0",
         "lock": "0.1.4",
         "request": "2.83.0",
-        "uuid": "3.1.0"
+        "uuid": "3.2.1"
       }
     },
     "nise": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/nise/-/nise-1.2.0.tgz",
-      "integrity": "sha512-q9jXh3UNsMV28KeqI43ILz5+c3l+RiNW8mhurEwCKckuHQbL+hTJIKKTiUlCPKlgQ/OukFvSnKB/Jk3+sFbkGA==",
+      "version": "1.2.5",
+      "resolved": "https://registry.npmjs.org/nise/-/nise-1.2.5.tgz",
+      "integrity": "sha512-Es4hGuq3lpip5PckrB+Qpuma282M0UJANJ+jxAgI+0wWTL9X6MtNv+M385JgqsAE8hv6NvD3lv8CQtXgEnvlpQ==",
       "requires": {
-        "formatio": "1.2.0",
+        "@sinonjs/formatio": "2.0.0",
         "just-extend": "1.1.27",
-        "lolex": "1.6.0",
+        "lolex": "2.3.2",
         "path-to-regexp": "1.7.0",
         "text-encoding": "0.6.4"
       },
@@ -8100,11 +8443,6 @@
           "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
           "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
         },
-        "lolex": {
-          "version": "1.6.0",
-          "resolved": "https://registry.npmjs.org/lolex/-/lolex-1.6.0.tgz",
-          "integrity": "sha1-OpoCg0UqR9dDnnJzG54H1zhuSfY="
-        },
         "path-to-regexp": {
           "version": "1.7.0",
           "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.7.0.tgz",
@@ -8115,6 +8453,14 @@
         }
       }
     },
+    "no-case": {
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/no-case/-/no-case-2.3.2.tgz",
+      "integrity": "sha512-rmTZ9kz+f3rCvK2TD1Ue/oZlns7OGoIWP4fc3llxxRXlOkHKoWPPWJOfFYpITabSow43QJbRIoHQXtt10VldyQ==",
+      "requires": {
+        "lower-case": "1.1.4"
+      }
+    },
     "node-dir": {
       "version": "0.1.17",
       "resolved": "https://registry.npmjs.org/node-dir/-/node-dir-0.1.17.tgz",
@@ -8123,14 +8469,6 @@
         "minimatch": "3.0.4"
       }
     },
-    "node-emoji": {
-      "version": "1.8.1",
-      "resolved": "https://registry.npmjs.org/node-emoji/-/node-emoji-1.8.1.tgz",
-      "integrity": "sha512-+ktMAh1Jwas+TnGodfCfjUbJKoANqPaJFN0z0iqh41eqD8dvguNzcitVSBSVK1pidz0AqGbLKcoVuVLRVZ/aVg==",
-      "requires": {
-        "lodash.toarray": "4.4.0"
-      }
-    },
     "node-fetch": {
       "version": "1.6.3",
       "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.6.3.tgz",
@@ -8141,9 +8479,9 @@
       }
     },
     "node-forge": {
-      "version": "0.6.33",
-      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.6.33.tgz",
-      "integrity": "sha1-RjgRh59XPUUVWtap9D3ClujoXrw="
+      "version": "0.7.1",
+      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.7.1.tgz",
+      "integrity": "sha1-naYR6giYL0uUIGs760zJZl8gwwA="
     },
     "node-gyp": {
       "version": "3.6.2",
@@ -8188,7 +8526,7 @@
         "console-browserify": "1.1.0",
         "constants-browserify": "1.0.0",
         "crypto-browserify": "3.12.0",
-        "domain-browser": "1.1.7",
+        "domain-browser": "1.2.0",
         "events": "1.1.1",
         "https-browserify": "1.0.0",
         "os-browserify": "0.3.0",
@@ -8196,11 +8534,11 @@
         "process": "0.11.10",
         "punycode": "1.4.1",
         "querystring-es3": "0.2.1",
-        "readable-stream": "2.3.3",
+        "readable-stream": "2.3.4",
         "stream-browserify": "2.0.1",
-        "stream-http": "2.7.2",
+        "stream-http": "2.8.0",
         "string_decoder": "1.0.3",
-        "timers-browserify": "2.0.4",
+        "timers-browserify": "2.0.6",
         "tty-browserify": "0.0.0",
         "url": "0.11.0",
         "util": "0.10.3",
@@ -8208,12 +8546,12 @@
       }
     },
     "node-notifier": {
-      "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-5.1.2.tgz",
-      "integrity": "sha1-L6nhJgX6EACdRFSdb82KY93g5P8=",
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-5.2.1.tgz",
+      "integrity": "sha512-MIBs+AAd6dJ2SklbbE8RUDRlIVhU8MaNLh1A9SUZDUHPiZkWLFde6UNwG41yQHZEToHgJMXqyVZ9UcS/ReOVTg==",
       "requires": {
         "growly": "1.3.0",
-        "semver": "5.4.1",
+        "semver": "5.5.0",
         "shellwords": "0.1.1",
         "which": "1.3.0"
       }
@@ -8232,7 +8570,7 @@
         "in-publish": "2.0.0",
         "lodash.assign": "4.2.0",
         "lodash.clonedeep": "4.5.0",
-        "lodash.mergewith": "4.6.0",
+        "lodash.mergewith": "4.6.1",
         "meow": "3.7.0",
         "mkdirp": "0.5.1",
         "nan": "2.8.0",
@@ -8317,8 +8655,8 @@
           "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0=",
           "requires": {
             "chalk": "1.1.3",
-            "commander": "2.12.2",
-            "is-my-json-valid": "2.16.1",
+            "commander": "2.14.1",
+            "is-my-json-valid": "2.17.1",
             "pinkie-promise": "2.0.1"
           }
         },
@@ -8377,7 +8715,7 @@
             "stringstream": "0.0.5",
             "tough-cookie": "2.3.3",
             "tunnel-agent": "0.4.3",
-            "uuid": "3.1.0"
+            "uuid": "3.2.1"
           }
         },
         "sntp": {
@@ -8431,7 +8769,7 @@
       "requires": {
         "hosted-git-info": "2.5.0",
         "is-builtin-module": "1.0.0",
-        "semver": "5.4.1",
+        "semver": "5.5.0",
         "validate-npm-package-license": "3.0.1"
       }
     },
@@ -8529,6 +8867,22 @@
             "is-descriptor": "0.1.6"
           }
         },
+        "is-accessor-descriptor": {
+          "version": "0.1.6",
+          "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
+          "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
+          "requires": {
+            "kind-of": "3.2.2"
+          }
+        },
+        "is-data-descriptor": {
+          "version": "0.1.4",
+          "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
+          "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
+          "requires": {
+            "kind-of": "3.2.2"
+          }
+        },
         "is-descriptor": {
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
@@ -8556,6 +8910,11 @@
         }
       }
     },
+    "object-inspect": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.5.0.tgz",
+      "integrity": "sha512-UmOFbHbwvv+XHj7BerrhVq+knjceBdkvU5AriwLMvhv2qi+e7DJzxfBeFpILEjVzCp+xA+W/pIf06RGPWlZNfw=="
+    },
     "object-is": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.0.1.tgz",
@@ -8575,12 +8934,13 @@
       }
     },
     "object.assign": {
-      "version": "4.0.4",
-      "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.0.4.tgz",
-      "integrity": "sha1-scnMBE7xuf5jYG/BQau7MuFHMMw=",
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.1.0.tgz",
+      "integrity": "sha512-exHJeq6kBKj58mqGyTQ9DFvrZC/eR6OwxzoM9YRoGBqrXYonaFyGiFMuc9VZrXf7DarreEwMpurG3dd+CNyW5w==",
       "requires": {
         "define-properties": "1.1.2",
         "function-bind": "1.1.1",
+        "has-symbols": "1.0.0",
         "object-keys": "1.0.11"
       }
     },
@@ -8638,22 +8998,22 @@
       "integrity": "sha1-EEEktsYCxnlogaBCVB0220OlJk4="
     },
     "office-ui-fabric-core": {
-      "version": "9.3.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-9.3.0.tgz",
-      "integrity": "sha1-FE19kSUBS9+lf41fXmptgl2EJ0I="
+      "version": "9.4.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-9.4.0.tgz",
+      "integrity": "sha1-z1dU/7D63H0ewKVoxnNxxw8ranE="
     },
     "office-ui-fabric-react": {
-      "version": "5.33.1",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.33.1.tgz",
-      "integrity": "sha512-LrE9EYmXQ9tTZG/gtsKhWnrym2WB0TrmQ7WfyYclQXeJmt1PB6F80sUdzddNrgmsPz7Q0KJboeV4m6nASBCQDQ==",
-      "requires": {
-        "@microsoft/load-themed-styles": "1.7.14",
-        "@uifabric/icons": "5.3.0",
-        "@uifabric/merge-styles": "5.8.1",
-        "@uifabric/styling": "5.14.0",
-        "@uifabric/utilities": "5.5.0",
+      "version": "5.49.2",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.49.2.tgz",
+      "integrity": "sha512-A9M0viSXkJu4VRcoRrpWEN81Bz9p2QSjEEM1L9HhZLla0qnGcajOsePvMHuJIiCsf53zfpCHE/LAOvl32GqAVw==",
+      "requires": {
+        "@microsoft/load-themed-styles": "1.7.29",
+        "@uifabric/icons": "5.4.2",
+        "@uifabric/merge-styles": "5.11.2",
+        "@uifabric/styling": "5.17.0",
+        "@uifabric/utilities": "5.10.2",
         "prop-types": "15.6.0",
-        "tslib": "1.8.1"
+        "tslib": "1.9.0"
       }
     },
     "on-finished": {
@@ -8682,7 +9042,7 @@
       "resolved": "https://registry.npmjs.org/onetime/-/onetime-2.0.1.tgz",
       "integrity": "sha1-BnQoIw/WdEOyeUsiu6UotoZ5YtQ=",
       "requires": {
-        "mimic-fn": "1.1.0"
+        "mimic-fn": "1.2.0"
       }
     },
     "open": {
@@ -8839,16 +9199,19 @@
       "integrity": "sha1-P7z7FbiZpEEjs0ttzBi3JDNqLK4="
     },
     "p-limit": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-1.1.0.tgz",
-      "integrity": "sha1-sH/y2aXYi+yAYDWJWiurZqJ5iLw="
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-1.2.0.tgz",
+      "integrity": "sha512-Y/OtIaXtUPr4/YpMv1pCL5L5ed0rumAaAeBSj12F+bSlMdys7i8oQF/GUJmfpTS/QoaRrS/k6pma29haJpsMng==",
+      "requires": {
+        "p-try": "1.0.0"
+      }
     },
     "p-locate": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-2.0.0.tgz",
       "integrity": "sha1-IKAQOyIqcMj9OcwuWAaA893l7EM=",
       "requires": {
-        "p-limit": "1.1.0"
+        "p-limit": "1.2.0"
       }
     },
     "p-map": {
@@ -8856,11 +9219,34 @@
       "resolved": "https://registry.npmjs.org/p-map/-/p-map-1.2.0.tgz",
       "integrity": "sha512-r6zKACMNhjPJMTl8KcFH4li//gkrXWfbD6feV8l6doRHlzljFWGJ2AP6iKaCJXyZmAUMOPtvbW7EXkbWO/pLEA=="
     },
+    "p-try": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/p-try/-/p-try-1.0.0.tgz",
+      "integrity": "sha1-y8ec26+P1CKOE/Yh8rGiN8GyB7M="
+    },
     "pako": {
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/pako/-/pako-1.0.6.tgz",
       "integrity": "sha512-lQe48YPsMJAig+yngZ87Lus+NF+3mtu7DVOBu6b/gHO1YpKwIj5AWjZ/TOS7i46HD/UixzWb1zeWDZfGZ3iYcg=="
     },
+    "parallel-transform": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/parallel-transform/-/parallel-transform-1.1.0.tgz",
+      "integrity": "sha1-1BDwZbBdojCB/NEPKIVMKb2jOwY=",
+      "requires": {
+        "cyclist": "0.2.2",
+        "inherits": "2.0.3",
+        "readable-stream": "2.3.4"
+      }
+    },
+    "param-case": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/param-case/-/param-case-2.1.1.tgz",
+      "integrity": "sha1-35T9jPZTHs915r75oIWPvHK+Ikc=",
+      "requires": {
+        "no-case": "2.3.2"
+      }
+    },
     "parse-asn1": {
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.0.tgz",
@@ -8912,6 +9298,11 @@
       "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-0.0.0.tgz",
       "integrity": "sha1-oLhwcpquIUAFt9UDLsLLuw+0RRo="
     },
+    "path-dirname": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/path-dirname/-/path-dirname-1.0.2.tgz",
+      "integrity": "sha1-zDPSTVJeCZpTiMAzbG4yuRYGCeA="
+    },
     "path-exists": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-3.0.0.tgz",
@@ -8966,7 +9357,7 @@
         "create-hmac": "1.1.6",
         "ripemd160": "2.0.1",
         "safe-buffer": "5.1.1",
-        "sha.js": "2.4.9"
+        "sha.js": "2.4.10"
       }
     },
     "performance-now": {
@@ -9032,13 +9423,13 @@
       "integrity": "sha1-AerA/jta9xoqbAL+q7jB/vfgDqs="
     },
     "postcss": {
-      "version": "6.0.14",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.14.tgz",
-      "integrity": "sha512-NJ1z0f+1offCgadPhz+DvGm5Mkci+mmV5BqD13S992o0Xk9eElxUfPPF+t2ksH5R/17gz4xVK8KWocUQ5o3Rog==",
+      "version": "6.0.17",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.17.tgz",
+      "integrity": "sha512-Bl1nybsSzWYbP8O4gAVD8JIjZIul9hLNOPTGBIlVmZNUnNAGL+W0cpYWzVwfImZOwumct4c1SDvSbncVWKtXUw==",
       "requires": {
-        "chalk": "2.3.0",
+        "chalk": "2.3.1",
         "source-map": "0.6.1",
-        "supports-color": "4.5.0"
+        "supports-color": "5.2.0"
       }
     },
     "postcss-calc": {
@@ -9086,7 +9477,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9151,7 +9542,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9215,7 +9606,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9278,7 +9669,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9341,7 +9732,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9404,7 +9795,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9467,7 +9858,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9531,7 +9922,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9595,7 +9986,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9616,11 +10007,11 @@
       }
     },
     "postcss-flexbugs-fixes": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/postcss-flexbugs-fixes/-/postcss-flexbugs-fixes-3.2.0.tgz",
-      "integrity": "sha512-0AuD9HG1Ey3/3nqPWu9yqf7rL0KCPu5VgjDsjf5mzEcuo9H/z8nco/fljKgjsOUrZypa95MI0kS4xBZeBzz2lw==",
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/postcss-flexbugs-fixes/-/postcss-flexbugs-fixes-3.3.0.tgz",
+      "integrity": "sha512-15JauG6a2hu2XZHdB9BaOwCLrI9oyK2UB8kt1ToTGdP1Pd3BQ/TJI9tNiTALntll25/66xMLUIyUPA9w/3BLtg==",
       "requires": {
-        "postcss": "6.0.14"
+        "postcss": "6.0.17"
       }
     },
     "postcss-load-config": {
@@ -9653,14 +10044,14 @@
       }
     },
     "postcss-loader": {
-      "version": "2.0.9",
-      "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-2.0.9.tgz",
-      "integrity": "sha512-sgoXPtmgVT3aBAhU47Kig8oPF+mbXl8Unjvtz1Qj1q2D2EvSVJW2mKJNzxv5y/LvA9xWwuvdysvhc7Zn80UWWw==",
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-2.1.0.tgz",
+      "integrity": "sha512-S/dKzpDwGFmP9g8eyCu9sUIV+/+3UooeTpYlsKf23qKDdrhHuA4pTSfytVu0rEJ0iDqUavXrgtOPq5KhNyNMOw==",
       "requires": {
         "loader-utils": "1.1.0",
-        "postcss": "6.0.14",
+        "postcss": "6.0.17",
         "postcss-load-config": "1.2.0",
-        "schema-utils": "0.3.0"
+        "schema-utils": "0.4.3"
       }
     },
     "postcss-merge-idents": {
@@ -9708,7 +10099,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9771,7 +10162,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9813,8 +10204,8 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000783",
-            "electron-to-chromium": "1.3.28"
+            "caniuse-db": "1.0.30000808",
+            "electron-to-chromium": "1.3.33"
           }
         },
         "chalk": {
@@ -9847,7 +10238,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9917,7 +10308,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -9981,7 +10372,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10047,7 +10438,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10113,7 +10504,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10140,16 +10531,16 @@
       "requires": {
         "css-modules-loader-core": "1.1.0",
         "generic-names": "1.0.3",
-        "postcss": "6.0.14",
+        "postcss": "6.0.17",
         "string-hash": "1.1.3"
       }
     },
     "postcss-modules-extract-imports": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-1.1.0.tgz",
-      "integrity": "sha1-thTJcgvmgW6u41+zpfqh26agXds=",
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-1.2.0.tgz",
+      "integrity": "sha1-ZhQOzs447wa/DT41XWm/WdFB6oU=",
       "requires": {
-        "postcss": "6.0.14"
+        "postcss": "6.0.17"
       }
     },
     "postcss-modules-local-by-default": {
@@ -10158,7 +10549,7 @@
       "integrity": "sha1-99gMOYxaOT+nlkRmvRlQCn1hwGk=",
       "requires": {
         "css-selector-tokenizer": "0.7.0",
-        "postcss": "6.0.14"
+        "postcss": "6.0.17"
       }
     },
     "postcss-modules-scope": {
@@ -10167,7 +10558,7 @@
       "integrity": "sha1-1upkmUx5+XtipytCb75gVqGUu5A=",
       "requires": {
         "css-selector-tokenizer": "0.7.0",
-        "postcss": "6.0.14"
+        "postcss": "6.0.17"
       }
     },
     "postcss-modules-values": {
@@ -10176,7 +10567,7 @@
       "integrity": "sha1-7P+p1+GSUYOJ9CrQ6D9yrsRW6iA=",
       "requires": {
         "icss-replace-symbols": "1.1.0",
-        "postcss": "6.0.14"
+        "postcss": "6.0.17"
       }
     },
     "postcss-normalize-charset": {
@@ -10222,7 +10613,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10288,7 +10679,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10352,7 +10743,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10416,7 +10807,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10479,7 +10870,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10544,7 +10935,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10620,7 +11011,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10685,7 +11076,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10755,7 +11146,7 @@
           "integrity": "sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==",
           "requires": {
             "chalk": "1.1.3",
-            "js-base64": "2.4.0",
+            "js-base64": "2.4.3",
             "source-map": "0.5.7",
             "supports-color": "3.2.3"
           }
@@ -10790,6 +11181,15 @@
       "resolved": "https://registry.npmjs.org/preserve/-/preserve-0.2.0.tgz",
       "integrity": "sha1-gV7R9uvGWSb4ZbMQwHE7yzMVzks="
     },
+    "pretty-error": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/pretty-error/-/pretty-error-2.1.1.tgz",
+      "integrity": "sha1-X0+HyPkeWuPzuoerTPXgOxoX8aM=",
+      "requires": {
+        "renderkid": "2.0.1",
+        "utila": "0.4.0"
+      }
+    },
     "pretty-format": {
       "version": "21.2.1",
       "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-21.2.1.tgz",
@@ -10823,6 +11223,19 @@
             "escape-string-regexp": "1.0.5",
             "supports-color": "4.5.0"
           }
+        },
+        "has-flag": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
+          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
+        },
+        "supports-color": {
+          "version": "4.5.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.5.0.tgz",
+          "integrity": "sha1-vnoN5ITexcXN34s9WRJQRJEvY1s=",
+          "requires": {
+            "has-flag": "2.0.0"
+          }
         }
       }
     },
@@ -10837,9 +11250,9 @@
       "integrity": "sha1-czIwDoQBYb2j5podHZGn1LwW8YI="
     },
     "process-nextick-args": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz",
-      "integrity": "sha1-FQ4gt1ZZCtP5EJPyWk8q2L/zC6M="
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.0.tgz",
+      "integrity": "sha512-MtEC1TqN0EU5nephaJ4rAtThHtC86dNN9qCuEhtshvpVBkAW5ZO7BASN9REnF9eoXGcRub+pFuKEpOHE+HbEMw=="
     },
     "promise": {
       "version": "7.3.1",
@@ -10849,6 +11262,11 @@
         "asap": "2.0.6"
       }
     },
+    "promise-inflight": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/promise-inflight/-/promise-inflight-1.0.1.tgz",
+      "integrity": "sha1-mEcocL8igTL8vdhoEputEsPAKeM="
+    },
     "promise.prototype.finally": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/promise.prototype.finally/-/promise.prototype.finally-3.1.0.tgz",
@@ -10897,16 +11315,46 @@
         "browserify-rsa": "4.0.1",
         "create-hash": "1.1.3",
         "parse-asn1": "5.1.0",
-        "randombytes": "2.0.5"
+        "randombytes": "2.0.6"
       }
     },
-    "punycode": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
-      "integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4="
-    },
-    "q": {
-      "version": "1.5.1",
+    "pump": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/pump/-/pump-1.0.3.tgz",
+      "integrity": "sha512-8k0JupWme55+9tCVE+FS5ULT3K6AbgqrGa58lTT49RpyfwwcGedHqaC5LlQNdEAumn/wFsu6aPwkuPMioy8kqw==",
+      "requires": {
+        "end-of-stream": "1.4.1",
+        "once": "1.4.0"
+      }
+    },
+    "pumpify": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/pumpify/-/pumpify-1.4.0.tgz",
+      "integrity": "sha512-2kmNR9ry+Pf45opRVirpNuIFotsxUGLaYqxIwuR77AYrYRMuFCz9eryHBS52L360O+NcR383CL4QYlMKPq4zYA==",
+      "requires": {
+        "duplexify": "3.5.3",
+        "inherits": "2.0.3",
+        "pump": "2.0.1"
+      },
+      "dependencies": {
+        "pump": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/pump/-/pump-2.0.1.tgz",
+          "integrity": "sha512-ruPMNRkN3MHP1cWJc9OWr+T/xDP0jhXYCLfJcBuX54hhfIBnaQmAUMfDcG4DM5UMWByBbJY69QSphm3jtDKIkA==",
+          "requires": {
+            "end-of-stream": "1.4.1",
+            "once": "1.4.0"
+          }
+        }
+      }
+    },
+    "punycode": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
+      "integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4="
+    },
+    "q": {
+      "version": "1.5.1",
       "resolved": "https://registry.npmjs.org/q/-/q-1.5.1.tgz",
       "integrity": "sha1-fjL3W0E4EpHQRhHxvxQQmsAGUdc="
     },
@@ -10955,7 +11403,7 @@
           "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-2.0.5.tgz",
           "integrity": "sha1-wVPH6I/YT+9cYC6VqBaLJ3BnH+c=",
           "requires": {
-            "bowser": "1.8.1",
+            "bowser": "1.9.2",
             "hyphenate-style-name": "1.0.2"
           }
         }
@@ -11003,9 +11451,9 @@
       }
     },
     "randombytes": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.0.5.tgz",
-      "integrity": "sha512-8T7Zn1AhMsQ/HI1SjcCfT/t4ii3eAqco3yOcSzS4mozsOz69lHLsoMXmF9nZgnFanYscnSlUSgs8uZyKzpE6kg==",
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.0.6.tgz",
+      "integrity": "sha512-CIQ5OFxf4Jou6uOKe9t1AOgqpeU5fd70A8NPdHSGeYXqXsPe6peOwI0cUl88RWZ6sP1vPMV3avd/R6cZ5/sP1A==",
       "requires": {
         "safe-buffer": "5.1.1"
       }
@@ -11015,7 +11463,7 @@
       "resolved": "https://registry.npmjs.org/randomfill/-/randomfill-1.0.3.tgz",
       "integrity": "sha512-YL6GrhrWoic0Eq8rXVbMptH7dAxCs0J+mh5Y0euNekPPYaxEmdVGim6GdoxoRzKW2yJoU8tueifS7mYxvcFDEQ==",
       "requires": {
-        "randombytes": "2.0.5",
+        "randombytes": "2.0.6",
         "safe-buffer": "5.1.1"
       }
     },
@@ -11059,8 +11507,8 @@
         "async": "2.6.0",
         "babel-runtime": "6.26.0",
         "babylon": "5.8.38",
-        "commander": "2.12.2",
-        "doctrine": "2.0.2",
+        "commander": "2.14.1",
+        "doctrine": "2.1.0",
         "node-dir": "0.1.17",
         "recast": "0.12.9"
       },
@@ -11083,6 +11531,17 @@
         "prop-types": "15.6.0"
       }
     },
+    "react-fuzzy": {
+      "version": "0.5.1",
+      "resolved": "https://registry.npmjs.org/react-fuzzy/-/react-fuzzy-0.5.1.tgz",
+      "integrity": "sha512-m2QClpw+Z51m6oEpfznVr7CQ9zdUGQ7vvidv05+drt0c3UMkpOWqmB0fQhYJYP/5QNh7ojyMCgu99cxvFaya6Q==",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "classnames": "2.2.5",
+        "fuse.js": "3.2.0",
+        "prop-types": "15.6.0"
+      }
+    },
     "react-highlight": {
       "version": "0.10.0",
       "resolved": "https://registry.npmjs.org/react-highlight/-/react-highlight-0.10.0.tgz",
@@ -11098,7 +11557,7 @@
           "resolved": "https://registry.npmjs.org/react/-/react-15.6.2.tgz",
           "integrity": "sha1-26BDSrQ5z+gvEI8PURZjkIF5qnI=",
           "requires": {
-            "create-react-class": "15.6.2",
+            "create-react-class": "15.6.3",
             "fbjs": "0.8.16",
             "loose-envify": "1.3.1",
             "object-assign": "4.1.1",
@@ -11149,15 +11608,26 @@
       }
     },
     "react-modal": {
-      "version": "3.1.8",
-      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.1.8.tgz",
-      "integrity": "sha512-cp5fSUBuwkyojclrxZuWXudK2kTBycbDG9Eg1t/bEPdUVBW6vDiGE+4eZg7bVwMyFtiwvyVJ2ugdCOFllNPReg==",
+      "version": "3.1.13",
+      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.1.13.tgz",
+      "integrity": "sha512-YSNoLKd/zgfILPwx6Uio2f6JNX7UqPvWO7vGKXXpFcsDaj+z97FVxJo82dMsbca4SSitu0A9Q+Xq750CPQUAYA==",
       "requires": {
         "exenv": "1.2.2",
         "prop-types": "15.6.0",
         "warning": "3.0.0"
       }
     },
+    "react-reconciler": {
+      "version": "0.7.0",
+      "resolved": "https://registry.npmjs.org/react-reconciler/-/react-reconciler-0.7.0.tgz",
+      "integrity": "sha512-50JwZ3yNyMS8fchN+jjWEJOH3Oze7UmhxeoJLn2j6f3NjpfCRbcmih83XTWmzqtar/ivd5f7tvQhvvhism2fgg==",
+      "requires": {
+        "fbjs": "0.8.16",
+        "loose-envify": "1.3.1",
+        "object-assign": "4.1.1",
+        "prop-types": "15.6.0"
+      }
+    },
     "react-remarkable": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/react-remarkable/-/react-remarkable-1.1.3.tgz",
@@ -11167,21 +11637,19 @@
       }
     },
     "react-split-pane": {
-      "version": "0.1.71",
-      "resolved": "https://registry.npmjs.org/react-split-pane/-/react-split-pane-0.1.71.tgz",
-      "integrity": "sha512-c7aK5ffRyeOySSWVeoSEsQHBUrNtzXTB9TFNUnZv/2EM7HEnN1Rfsgxag/bpDcl5GuaY5IuMvq7XySc6nyokog==",
+      "version": "0.1.77",
+      "resolved": "https://registry.npmjs.org/react-split-pane/-/react-split-pane-0.1.77.tgz",
+      "integrity": "sha512-xq0PPsbkNI9xEd6yTrGPr7hzf6XfIgnsxuUEdRJELq+kLPHMsO3ymFCjhiYP35wlDPn9W46+rHDsJd7LFYteMw==",
       "requires": {
-        "@types/inline-style-prefixer": "3.0.1",
-        "@types/react": "16.0.25",
         "inline-style-prefixer": "3.0.8",
         "prop-types": "15.6.0",
-        "react-style-proptype": "3.1.0"
+        "react-style-proptype": "3.2.0"
       }
     },
     "react-style-proptype": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/react-style-proptype/-/react-style-proptype-3.1.0.tgz",
-      "integrity": "sha512-e4lOMjF4f8Pp/jdO9myNzDvSAx1aG5r0olziD64Bgk40LN8LxidRCgnKeI2RiKrqYD6j2Z8ByXoUbwV+/mwpwg==",
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/react-style-proptype/-/react-style-proptype-3.2.0.tgz",
+      "integrity": "sha512-Mafmkzj3oNmLSJNOlH+WWWyGIdzVLhPj+d12fDxQMQdwDQ5sMX7vQKOLpry4U+zRWieTCx448AyRKK0NLWuXmg==",
       "requires": {
         "prop-types": "15.6.0"
       }
@@ -11202,7 +11670,7 @@
       "integrity": "sha512-CWaL3laCmgAFdxdKbhhps+c0HRGF4c+hdM4H23+FI1QBNUyx/AMeIJGWorehPNSaKnQNOAxL7PQmqMu78CDj3Q==",
       "requires": {
         "chain-function": "1.0.0",
-        "dom-helpers": "3.2.1",
+        "dom-helpers": "3.3.1",
         "loose-envify": "1.3.1",
         "prop-types": "15.6.0",
         "warning": "3.0.0"
@@ -11241,14 +11709,14 @@
       }
     },
     "readable-stream": {
-      "version": "2.3.3",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
-      "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ==",
+      "version": "2.3.4",
+      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.4.tgz",
+      "integrity": "sha512-vuYxeWYM+fde14+rajzqgeohAI7YoJcHE7kXDAc4Nk0EbuKnJfqtY9YtRkLo/tqkuF7MsBQRhPnPeyjYITp3ZQ==",
       "requires": {
         "core-util-is": "1.0.2",
         "inherits": "2.0.3",
         "isarray": "1.0.0",
-        "process-nextick-args": "1.0.7",
+        "process-nextick-args": "2.0.0",
         "safe-buffer": "5.1.1",
         "string_decoder": "1.0.3",
         "util-deprecate": "1.0.2"
@@ -11261,7 +11729,7 @@
       "requires": {
         "graceful-fs": "4.1.11",
         "minimatch": "3.0.4",
-        "readable-stream": "2.3.3",
+        "readable-stream": "2.3.4",
         "set-immediate-shim": "1.0.1"
       }
     },
@@ -11301,21 +11769,6 @@
         "strip-indent": "1.0.1"
       }
     },
-    "redeyed": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/redeyed/-/redeyed-1.0.1.tgz",
-      "integrity": "sha1-6WwZO0DAgWsArshCaY5hGF5VSYo=",
-      "requires": {
-        "esprima": "3.0.0"
-      },
-      "dependencies": {
-        "esprima": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/esprima/-/esprima-3.0.0.tgz",
-          "integrity": "sha1-U88kes2ncxPlUcOqLnM0LT+099k="
-        }
-      }
-    },
     "reduce-css-calc": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/reduce-css-calc/-/reduce-css-calc-1.3.0.tgz",
@@ -11354,9 +11807,9 @@
       "integrity": "sha512-pNqnf9q1hI5HHZRBkj3bAngGZW/JMCmexDlOxw4XagXY2o1327nHH54LoTjiPJ0gizoqPDRqWyX/00g0hD6w+A==",
       "requires": {
         "lodash": "4.15.0",
-        "lodash-es": "4.17.4",
+        "lodash-es": "4.17.5",
         "loose-envify": "1.3.1",
-        "symbol-observable": "1.1.0"
+        "symbol-observable": "1.2.0"
       }
     },
     "regenerate": {
@@ -11418,6 +11871,11 @@
         "jsesc": "0.5.0"
       }
     },
+    "relateurl": {
+      "version": "0.2.7",
+      "resolved": "https://registry.npmjs.org/relateurl/-/relateurl-0.2.7.tgz",
+      "integrity": "sha1-VNvzd+UUQKypCkzSdGANP/LYiKk="
+    },
     "remarkable": {
       "version": "1.7.1",
       "resolved": "https://registry.npmjs.org/remarkable/-/remarkable-1.7.1.tgz",
@@ -11440,6 +11898,11 @@
           "version": "1.7.0",
           "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.7.0.tgz",
           "integrity": "sha1-a7rwh3UA02vjTsqlhODbn+8DUgk="
+        },
+        "underscore.string": {
+          "version": "2.4.0",
+          "resolved": "https://registry.npmjs.org/underscore.string/-/underscore.string-2.4.0.tgz",
+          "integrity": "sha1-jN2PusTi0uoefi6Al8QvRCKA+Fs="
         }
       }
     },
@@ -11448,6 +11911,73 @@
       "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.1.0.tgz",
       "integrity": "sha1-wkvOKig62tW8P1jg1IJJuSN52O8="
     },
+    "renderkid": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/renderkid/-/renderkid-2.0.1.tgz",
+      "integrity": "sha1-iYyr/Ivt5Le5ETWj/9Mj5YwNsxk=",
+      "requires": {
+        "css-select": "1.2.0",
+        "dom-converter": "0.1.4",
+        "htmlparser2": "3.3.0",
+        "strip-ansi": "3.0.1",
+        "utila": "0.3.3"
+      },
+      "dependencies": {
+        "domhandler": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.1.0.tgz",
+          "integrity": "sha1-0mRvXlf2w7qxHPbLBdPArPdBJZQ=",
+          "requires": {
+            "domelementtype": "1.3.0"
+          }
+        },
+        "domutils": {
+          "version": "1.1.6",
+          "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.1.6.tgz",
+          "integrity": "sha1-vdw94Jm5ou+sxRxiPyj0FuzFdIU=",
+          "requires": {
+            "domelementtype": "1.3.0"
+          }
+        },
+        "htmlparser2": {
+          "version": "3.3.0",
+          "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.3.0.tgz",
+          "integrity": "sha1-zHDQWln2VC5D8OaFyYLhTJJKnv4=",
+          "requires": {
+            "domelementtype": "1.3.0",
+            "domhandler": "2.1.0",
+            "domutils": "1.1.6",
+            "readable-stream": "1.0.34"
+          }
+        },
+        "isarray": {
+          "version": "0.0.1",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
+        },
+        "readable-stream": {
+          "version": "1.0.34",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=",
+          "requires": {
+            "core-util-is": "1.0.2",
+            "inherits": "2.0.3",
+            "isarray": "0.0.1",
+            "string_decoder": "0.10.31"
+          }
+        },
+        "string_decoder": {
+          "version": "0.10.31",
+          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
+          "integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
+        },
+        "utila": {
+          "version": "0.3.3",
+          "resolved": "https://registry.npmjs.org/utila/-/utila-0.3.3.tgz",
+          "integrity": "sha1-1+jn1+MJEHCSsF+NloiCTWM6QiY="
+        }
+      }
+    },
     "repeat-element": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/repeat-element/-/repeat-element-1.1.2.tgz",
@@ -11492,7 +12022,7 @@
         "stringstream": "0.0.5",
         "tough-cookie": "2.3.3",
         "tunnel-agent": "0.6.0",
-        "uuid": "3.1.0"
+        "uuid": "3.2.1"
       }
     },
     "request-promise": {
@@ -11500,7 +12030,7 @@
       "resolved": "https://registry.npmjs.org/request-promise/-/request-promise-4.1.1.tgz",
       "integrity": "sha1-JgIeT29W/Uwwn2vx69jJepWsH7U=",
       "requires": {
-        "bluebird": "3.4.7",
+        "bluebird": "3.5.1",
         "request-promise-core": "1.1.1",
         "stealthy-require": "1.1.1"
       }
@@ -11514,9 +12044,9 @@
       }
     },
     "requestretry": {
-      "version": "1.12.2",
-      "resolved": "https://registry.npmjs.org/requestretry/-/requestretry-1.12.2.tgz",
-      "integrity": "sha512-wDYnH4imurLs5upu31WoPaOFfEu31qhFlF7KgpYbBsmBagFmreZZo8E/XpoQ3erCP5za+72t8k8QI4wlrtwVXw==",
+      "version": "1.12.3",
+      "resolved": "https://registry.npmjs.org/requestretry/-/requestretry-1.12.3.tgz",
+      "integrity": "sha512-3H5xTOfORJGSDWV0WZYWLt39tqFyW19V+joQqsKvbbIR1AfJo8b1PDYlSYBoC5jPvmQcG0ZS0DkAKF23mChTow==",
       "requires": {
         "extend": "3.0.1",
         "lodash": "4.15.0",
@@ -11620,7 +12150,7 @@
       "integrity": "sha1-gbIw6i/MYGbInjRy3nlChdmwPZE=",
       "requires": {
         "lodash.flattendeep": "4.4.0",
-        "nearley": "2.11.0"
+        "nearley": "2.11.1"
       }
     },
     "run-async": {
@@ -11631,6 +12161,14 @@
         "is-promise": "2.1.0"
       }
     },
+    "run-queue": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/run-queue/-/run-queue-1.0.3.tgz",
+      "integrity": "sha1-6Eg5bwV9Ij8kOGkkYY4laUFh7Ec=",
+      "requires": {
+        "aproba": "1.2.0"
+      }
+    },
     "rx": {
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/rx/-/rx-4.1.0.tgz",
@@ -11647,9 +12185,9 @@
       "integrity": "sha512-1HwIYD/8UlOtFS3QO3w7ey+SdSDFE4HRNLZoZRYVQefrOY3l17epswImeB1ijgJFQJodIaHcwkp3r/myBjFVbg=="
     },
     "sane": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/sane/-/sane-2.2.0.tgz",
-      "integrity": "sha512-OSJxhHO0CgPUw3lUm3GhfREAfza45smvEI9ozuFrxKG10GHVo0ryW9FK5VYlLvxj0SV7HVKHW0voYJIRu27GWg==",
+      "version": "2.4.1",
+      "resolved": "https://registry.npmjs.org/sane/-/sane-2.4.1.tgz",
+      "integrity": "sha512-fW9svvNd81XzHDZyis9/tEY1bZikDGryy8Hi1BErPyNPYv47CdLseUN+tI5FBHWXEENRtj1SWtX/jBnggLaP0w==",
       "requires": {
         "anymatch": "1.3.2",
         "exec-sh": "0.2.1",
@@ -11833,11 +12371,12 @@
       "integrity": "sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw=="
     },
     "schema-utils": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-0.3.0.tgz",
-      "integrity": "sha1-9YdyIs4+kx7a4DnxfrNxbnE3+M8=",
+      "version": "0.4.3",
+      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-0.4.3.tgz",
+      "integrity": "sha512-sgv/iF/T4/SewJkaVpldKC4WjSkz0JsOh2eKtxCPpCO1oR05+7MOF+H476HVRbLArkgA7j5TRJJ4p2jdFkUGQQ==",
       "requires": {
-        "ajv": "5.5.1"
+        "ajv": "5.5.2",
+        "ajv-keywords": "2.1.1"
       }
     },
     "screener-runner": {
@@ -11853,7 +12392,7 @@
         "http-proxy": "1.16.2",
         "joi": "9.2.0",
         "lodash": "4.16.6",
-        "ngrok": "2.2.24",
+        "ngrok": "2.2.26",
         "portfinder": "1.0.13",
         "request": "2.78.0",
         "request-promise": "4.1.1"
@@ -11874,6 +12413,11 @@
           "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz",
           "integrity": "sha1-FDQt0428yU0OW4fXY81jYSwOeU8="
         },
+        "bluebird": {
+          "version": "3.4.7",
+          "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.4.7.tgz",
+          "integrity": "sha1-9y12C+Cbf3bQjtj66Ysomo0F+rM="
+        },
         "boom": {
           "version": "2.10.1",
           "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
@@ -11958,7 +12502,7 @@
           "requires": {
             "chalk": "1.1.3",
             "commander": "2.9.0",
-            "is-my-json-valid": "2.16.1",
+            "is-my-json-valid": "2.17.1",
             "pinkie-promise": "2.0.1"
           }
         },
@@ -12056,9 +12600,9 @@
       }
     },
     "screener-storybook": {
-      "version": "0.9.15",
-      "resolved": "https://registry.npmjs.org/screener-storybook/-/screener-storybook-0.9.15.tgz",
-      "integrity": "sha1-EtU1lXPUBH5G1LwCgHC2TMbqKmU=",
+      "version": "0.11.1",
+      "resolved": "https://registry.npmjs.org/screener-storybook/-/screener-storybook-0.11.1.tgz",
+      "integrity": "sha1-hIk6qwuWyBI7tmjz9o5pm+vSwK0=",
       "requires": {
         "bluebird": "3.4.7",
         "colors": "1.1.2",
@@ -12066,13 +12610,13 @@
         "get-port": "3.2.0",
         "joi": "10.0.6",
         "jsdom": "9.8.3",
-        "lodash": "4.17.4",
+        "lodash": "4.17.5",
         "prop-types": "15.6.0",
         "react": "15.6.2",
         "react-dom": "15.4.2",
         "request": "2.81.0",
-        "requestretry": "1.12.2",
-        "screener-runner": "0.7.12"
+        "requestretry": "1.12.3",
+        "screener-runner": "0.8.1"
       },
       "dependencies": {
         "acorn": {
@@ -12112,6 +12656,11 @@
           "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.6.0.tgz",
           "integrity": "sha1-FDQt0428yU0OW4fXY81jYSwOeU8="
         },
+        "bluebird": {
+          "version": "3.4.7",
+          "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.4.7.tgz",
+          "integrity": "sha1-9y12C+Cbf3bQjtj66Ysomo0F+rM="
+        },
         "boom": {
           "version": "2.10.1",
           "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
@@ -12272,9 +12821,9 @@
           }
         },
         "lodash": {
-          "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
         },
         "ms": {
           "version": "0.7.1",
@@ -12289,7 +12838,7 @@
             "decompress-zip": "0.3.0",
             "lock": "0.1.4",
             "request": "2.81.0",
-            "uuid": "3.1.0"
+            "uuid": "3.2.1"
           }
         },
         "node-uuid": {
@@ -12312,7 +12861,7 @@
           "resolved": "https://registry.npmjs.org/react/-/react-15.6.2.tgz",
           "integrity": "sha1-26BDSrQ5z+gvEI8PURZjkIF5qnI=",
           "requires": {
-            "create-react-class": "15.6.2",
+            "create-react-class": "15.6.3",
             "fbjs": "0.8.16",
             "loose-envify": "1.3.1",
             "object-assign": "4.1.1",
@@ -12355,13 +12904,13 @@
             "stringstream": "0.0.5",
             "tough-cookie": "2.3.3",
             "tunnel-agent": "0.6.0",
-            "uuid": "3.1.0"
+            "uuid": "3.2.1"
           }
         },
         "screener-runner": {
-          "version": "0.7.12",
-          "resolved": "https://registry.npmjs.org/screener-runner/-/screener-runner-0.7.12.tgz",
-          "integrity": "sha1-2+wn4gRAVEueDBFFQK5fEGm6sm4=",
+          "version": "0.8.1",
+          "resolved": "https://registry.npmjs.org/screener-runner/-/screener-runner-0.8.1.tgz",
+          "integrity": "sha1-EGUqCcftTH88ABSKX4HglNv3CnU=",
           "requires": {
             "bluebird": "3.4.7",
             "colors": "1.1.2",
@@ -12389,7 +12938,7 @@
               "requires": {
                 "chalk": "1.1.3",
                 "commander": "2.9.0",
-                "is-my-json-valid": "2.16.1",
+                "is-my-json-valid": "2.17.1",
                 "pinkie-promise": "2.0.1"
               }
             },
@@ -12401,7 +12950,7 @@
                 "hoek": "4.2.0",
                 "isemail": "2.2.1",
                 "items": "2.1.1",
-                "moment": "2.19.4",
+                "moment": "2.20.1",
                 "topo": "2.0.2"
               }
             },
@@ -12490,7 +13039,7 @@
       "resolved": "https://registry.npmjs.org/scss-tokenizer/-/scss-tokenizer-0.2.3.tgz",
       "integrity": "sha1-jrBtualyMzOCTT9VMGQRSYR85dE=",
       "requires": {
-        "js-base64": "2.4.0",
+        "js-base64": "2.4.3",
         "source-map": "0.4.4"
       },
       "dependencies": {
@@ -12510,17 +13059,17 @@
       "integrity": "sha1-Yl2GWPhlr0Psliv8N2o3NZpJlMo="
     },
     "selfsigned": {
-      "version": "1.10.1",
-      "resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-1.10.1.tgz",
-      "integrity": "sha1-v4y3uDJWxFUeMTR8YxF3jbme7FI=",
+      "version": "1.10.2",
+      "resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-1.10.2.tgz",
+      "integrity": "sha1-tESVgNmZKbZbEKSDiTAaZZIIh1g=",
       "requires": {
-        "node-forge": "0.6.33"
+        "node-forge": "0.7.1"
       }
     },
     "semver": {
-      "version": "5.4.1",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
-      "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg=="
+      "version": "5.5.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-5.5.0.tgz",
+      "integrity": "sha512-4SJ3dm0WAwWy/NVeioZh5AntkdJoWKxHxcmyP622fOkgHa4z3R0TdBJICINyaSDE6uNwVc8gZr+ZinwZAH4xIA=="
     },
     "send": {
       "version": "0.16.1",
@@ -12528,9 +13077,9 @@
       "integrity": "sha512-ElCLJdJIKPk6ux/Hocwhk7NFHpI3pVm/IZOYWqUmoxcgeyM+MpxHHKhb8QmlJDX1pU6WrgaHBkVNm73Sv7uc2A==",
       "requires": {
         "debug": "2.6.9",
-        "depd": "1.1.1",
+        "depd": "1.1.2",
         "destroy": "1.0.4",
-        "encodeurl": "1.0.1",
+        "encodeurl": "1.0.2",
         "escape-html": "1.0.3",
         "etag": "1.8.1",
         "fresh": "0.5.2",
@@ -12549,6 +13098,11 @@
         }
       }
     },
+    "serialize-javascript": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-1.4.0.tgz",
+      "integrity": "sha1-fJWFFNtqwkQ6irwGLcn3iGp/YAU="
+    },
     "serve-favicon": {
       "version": "2.4.5",
       "resolved": "https://registry.npmjs.org/serve-favicon/-/serve-favicon-2.4.5.tgz",
@@ -12580,7 +13134,7 @@
       "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.13.1.tgz",
       "integrity": "sha512-hSMUZrsPa/I09VYFJwa627JJkNs0NrfL1Uzuup+GqHfToR2KcsXFymXSV90hoyw3M+msjFuQly+YzIH/q0MGlQ==",
       "requires": {
-        "encodeurl": "1.0.1",
+        "encodeurl": "1.0.2",
         "escape-html": "1.0.3",
         "parseurl": "1.3.2",
         "send": "0.16.1"
@@ -12626,9 +13180,9 @@
       "integrity": "sha512-BvE/TwpZX4FXExxOxZyRGQQv651MSwmWKZGqvmPcRIjDqWub67kTKuIMx43cZZrS/cBBzwBcNDWoFxt2XEFIpQ=="
     },
     "sha.js": {
-      "version": "2.4.9",
-      "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.9.tgz",
-      "integrity": "sha512-G8zektVqbiPHrylgew9Zg1VRB1L/DtXNUVAM6q4QLy8NE3qtHlFXTf8VLL4k1Yl6c7NMjtZUTdXV+X44nFaT6A==",
+      "version": "2.4.10",
+      "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.10.tgz",
+      "integrity": "sha512-vnwmrFDlOExK4Nm16J2KMWHLrp14lBrjxMxBJpu++EnsuBmpiYaM/MEs46Vxxm/4FvdP5yTwuCTO9it5FSjrqA==",
       "requires": {
         "inherits": "2.0.3",
         "safe-buffer": "5.1.1"
@@ -12713,17 +13267,17 @@
       "integrity": "sha1-tf3AjxKH6hF4Yo5BXiUTK3NkbG0="
     },
     "sinon": {
-      "version": "4.1.3",
-      "resolved": "https://registry.npmjs.org/sinon/-/sinon-4.1.3.tgz",
-      "integrity": "sha512-c7u0ZuvBRX1eXuB4jN3BRCAOGiUTlM8SE3TxbJHrNiHUKL7wonujMOB6Fi1gQc00U91IscFORQHDga/eccqpbw==",
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/sinon/-/sinon-4.3.0.tgz",
+      "integrity": "sha512-pmf05hFgEZUS52AGJcsVjOjqAyJW2yo14cOwVYvzCyw7+inv06YXkLyW75WG6X6p951lzkoKh51L2sNbR9CDvw==",
       "requires": {
+        "@sinonjs/formatio": "2.0.0",
         "diff": "3.4.0",
-        "formatio": "1.2.0",
         "lodash.get": "4.4.2",
-        "lolex": "2.3.1",
-        "nise": "1.2.0",
-        "supports-color": "4.5.0",
-        "type-detect": "4.0.5"
+        "lolex": "2.3.2",
+        "nise": "1.2.5",
+        "supports-color": "5.2.0",
+        "type-detect": "4.0.8"
       }
     },
     "slash": {
@@ -12754,6 +13308,42 @@
             "is-descriptor": "0.1.6"
           }
         },
+        "is-accessor-descriptor": {
+          "version": "0.1.6",
+          "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
+          "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
+          "requires": {
+            "kind-of": "3.2.2"
+          },
+          "dependencies": {
+            "kind-of": {
+              "version": "3.2.2",
+              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+              "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+              "requires": {
+                "is-buffer": "1.1.6"
+              }
+            }
+          }
+        },
+        "is-data-descriptor": {
+          "version": "0.1.4",
+          "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
+          "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
+          "requires": {
+            "kind-of": "3.2.2"
+          },
+          "dependencies": {
+            "kind-of": {
+              "version": "3.2.2",
+              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+              "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+              "requires": {
+                "is-buffer": "1.1.6"
+              }
+            }
+          }
+        },
         "is-descriptor": {
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
@@ -12813,19 +13403,12 @@
       }
     },
     "sockjs": {
-      "version": "0.3.18",
-      "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.18.tgz",
-      "integrity": "sha1-2bKJMWyn33dZXvKZ4HXw+TfrQgc=",
+      "version": "0.3.19",
+      "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.19.tgz",
+      "integrity": "sha512-V48klKZl8T6MzatbLlzzRNhMepEys9Y4oGFpypBFFn1gLI/QQ9HtLLyWJNbPlwGLelOVOEijUbTTJeLLI59jLw==",
       "requires": {
         "faye-websocket": "0.10.0",
-        "uuid": "2.0.3"
-      },
-      "dependencies": {
-        "uuid": {
-          "version": "2.0.3",
-          "resolved": "https://registry.npmjs.org/uuid/-/uuid-2.0.3.tgz",
-          "integrity": "sha1-Z+LoY3lyFVMN/zGOW/nc6/1Hsho="
-        }
+        "uuid": "3.2.1"
       }
     },
     "sockjs-client": {
@@ -12964,7 +13547,7 @@
         "detect-node": "2.0.3",
         "hpack.js": "2.1.6",
         "obuf": "1.1.1",
-        "readable-stream": "2.3.3",
+        "readable-stream": "2.3.4",
         "safe-buffer": "5.1.1",
         "wbuf": "1.7.2"
       }
@@ -12974,14 +13557,15 @@
       "resolved": "https://registry.npmjs.org/split-string/-/split-string-3.1.0.tgz",
       "integrity": "sha512-NzNVhJDYpwceVVii8/Hu6DKfD2G+NrQHlS/V/qgv763EYudVwEcMQNxd2lh+0VrUByXN/oJkl5grOhYWvQUYiw==",
       "requires": {
-        "extend-shallow": "3.0.1"
+        "extend-shallow": "3.0.2"
       },
       "dependencies": {
         "extend-shallow": {
-          "version": "3.0.1",
-          "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-3.0.1.tgz",
-          "integrity": "sha512-Fg1xXAv+qXKdwHiJFMcZSqsMcbPlkzsZtf8KkLJ2fqnP+lqg2RjEKgDcSfO9CO1+p4LZKgApDBUUUqKaaRhwZQ==",
+          "version": "3.0.2",
+          "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-3.0.2.tgz",
+          "integrity": "sha1-Jqcarwc7OfshJxcnRhMcJwQCjbg=",
           "requires": {
+            "assign-symbols": "1.0.0",
             "is-extendable": "1.0.1"
           }
         },
@@ -13011,6 +13595,14 @@
         "getpass": "0.1.7"
       }
     },
+    "ssri": {
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/ssri/-/ssri-5.2.1.tgz",
+      "integrity": "sha512-y4PjOWlAuxt+yAcXitQYOnOzZpKaH3+f/qGV3OWxbyC2noC9FA9GNC9uILnVdV7jruA1aDKr4OKz3ZDBcVZwFQ==",
+      "requires": {
+        "safe-buffer": "5.1.1"
+      }
+    },
     "static-extend": {
       "version": "0.1.2",
       "resolved": "https://registry.npmjs.org/static-extend/-/static-extend-0.1.2.tgz",
@@ -13028,6 +13620,42 @@
             "is-descriptor": "0.1.6"
           }
         },
+        "is-accessor-descriptor": {
+          "version": "0.1.6",
+          "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
+          "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
+          "requires": {
+            "kind-of": "3.2.2"
+          },
+          "dependencies": {
+            "kind-of": {
+              "version": "3.2.2",
+              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+              "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+              "requires": {
+                "is-buffer": "1.1.6"
+              }
+            }
+          }
+        },
+        "is-data-descriptor": {
+          "version": "0.1.4",
+          "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
+          "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
+          "requires": {
+            "kind-of": "3.2.2"
+          },
+          "dependencies": {
+            "kind-of": {
+              "version": "3.2.2",
+              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+              "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+              "requires": {
+                "is-buffer": "1.1.6"
+              }
+            }
+          }
+        },
         "is-descriptor": {
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
@@ -13055,7 +13683,7 @@
       "resolved": "https://registry.npmjs.org/stdout-stream/-/stdout-stream-1.4.0.tgz",
       "integrity": "sha1-osfIWH5U2UJ+qe2zrD8s1SLfN4s=",
       "requires": {
-        "readable-stream": "2.3.3"
+        "readable-stream": "2.3.4"
       }
     },
     "stealthy-require": {
@@ -13079,7 +13707,7 @@
       "integrity": "sha1-ZiZu5fm9uZQKTkUUyvtDu3Hlyds=",
       "requires": {
         "inherits": "2.0.3",
-        "readable-stream": "2.3.3"
+        "readable-stream": "2.3.4"
       }
     },
     "stream-consume": {
@@ -13087,23 +13715,45 @@
       "resolved": "https://registry.npmjs.org/stream-consume/-/stream-consume-0.1.0.tgz",
       "integrity": "sha1-pB6tGm1ggc63n2WwYZAbbY89HQ8="
     },
+    "stream-each": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/stream-each/-/stream-each-1.2.2.tgz",
+      "integrity": "sha512-mc1dbFhGBxvTM3bIWmAAINbqiuAk9TATcfIQC8P+/+HJefgaiTlMn2dHvkX8qlI12KeYKSQ1Ua9RrIqrn1VPoA==",
+      "requires": {
+        "end-of-stream": "1.4.1",
+        "stream-shift": "1.0.0"
+      }
+    },
     "stream-http": {
-      "version": "2.7.2",
-      "resolved": "https://registry.npmjs.org/stream-http/-/stream-http-2.7.2.tgz",
-      "integrity": "sha512-c0yTD2rbQzXtSsFSVhtpvY/vS6u066PcXOX9kBB3mSO76RiUQzL340uJkGBWnlBg4/HZzqiUXtaVA7wcRcJgEw==",
+      "version": "2.8.0",
+      "resolved": "https://registry.npmjs.org/stream-http/-/stream-http-2.8.0.tgz",
+      "integrity": "sha512-sZOFxI/5xw058XIRHl4dU3dZ+TTOIGJR78Dvo0oEAejIt4ou27k+3ne1zYmCV+v7UucbxIFQuOgnkTVHh8YPnw==",
       "requires": {
         "builtin-status-codes": "3.0.0",
         "inherits": "2.0.3",
-        "readable-stream": "2.3.3",
+        "readable-stream": "2.3.4",
         "to-arraybuffer": "1.0.1",
         "xtend": "4.0.1"
       }
     },
+    "stream-shift": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/stream-shift/-/stream-shift-1.0.0.tgz",
+      "integrity": "sha1-1cdSgl5TZ+eG944Y5EXqIjoVWVI="
+    },
     "strict-uri-encode": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz",
       "integrity": "sha1-J5siXfHVgrH1TmWt3UNS4Y+qBxM="
     },
+    "string_decoder": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
+      "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ==",
+      "requires": {
+        "safe-buffer": "5.1.1"
+      }
+    },
     "string-hash": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/string-hash/-/string-hash-1.1.3.tgz",
@@ -13182,14 +13832,6 @@
         "function-bind": "1.1.1"
       }
     },
-    "string_decoder": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
-      "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ==",
-      "requires": {
-        "safe-buffer": "5.1.1"
-      }
-    },
     "stringstream": {
       "version": "0.0.5",
       "resolved": "https://registry.npmjs.org/stringstream/-/stringstream-0.0.5.tgz",
@@ -13228,6 +13870,16 @@
       "requires": {
         "loader-utils": "1.1.0",
         "schema-utils": "0.3.0"
+      },
+      "dependencies": {
+        "schema-utils": {
+          "version": "0.3.0",
+          "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-0.3.0.tgz",
+          "integrity": "sha1-9YdyIs4+kx7a4DnxfrNxbnE3+M8=",
+          "requires": {
+            "ajv": "5.5.2"
+          }
+        }
       }
     },
     "subarg": {
@@ -13246,11 +13898,11 @@
       }
     },
     "supports-color": {
-      "version": "4.5.0",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.5.0.tgz",
-      "integrity": "sha1-vnoN5ITexcXN34s9WRJQRJEvY1s=",
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.2.0.tgz",
+      "integrity": "sha512-F39vS48la4YvTZUPVeTqsjsFNrvcMwrV3RLZINsmHo+7djCvuUzSIeXOnZ5hmjef4bajL1dNccN+tg5XAliO5Q==",
       "requires": {
-        "has-flag": "2.0.0"
+        "has-flag": "3.0.0"
       }
     },
     "svg-tag-names": {
@@ -13273,9 +13925,9 @@
       }
     },
     "symbol-observable": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/symbol-observable/-/symbol-observable-1.1.0.tgz",
-      "integrity": "sha512-dQoid9tqQ+uotGhuTKEY11X4xhyYePVnqGSoSm3OGKh2E8LZ6RPULp1uXTctk33IeERlrRJYoVSBglsL05F5Uw=="
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/symbol-observable/-/symbol-observable-1.2.0.tgz",
+      "integrity": "sha512-e900nM8RRtGhlV36KGEU9k65K3mPb1WV70OdjfxlG2EAuM1noi/E/BaW/uMhL7bPEssK8QV57vN3esixjUvcXQ=="
     },
     "symbol-tree": {
       "version": "3.2.2",
@@ -13483,10 +14135,19 @@
       "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
       "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU="
     },
+    "through2": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/through2/-/through2-2.0.3.tgz",
+      "integrity": "sha1-AARWmzfHx0ujnEPzzteNGtlBQL4=",
+      "requires": {
+        "readable-stream": "2.3.4",
+        "xtend": "4.0.1"
+      }
+    },
     "thunky": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/thunky/-/thunky-0.1.0.tgz",
-      "integrity": "sha1-vzAUaCTituZ7Dy16Ssi+smkIaE4="
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/thunky/-/thunky-1.0.2.tgz",
+      "integrity": "sha1-qGLgGOP7HqLsP85dVWBc9X8kc3E="
     },
     "time-stamp": {
       "version": "2.0.0",
@@ -13494,9 +14155,9 @@
       "integrity": "sha1-lcakRTDhW6jW9KPsuMOj+sRto1c="
     },
     "timers-browserify": {
-      "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.4.tgz",
-      "integrity": "sha512-uZYhyU3EX8O7HQP+J9fTVYwsq90Vr68xPEFo7yrVImIxYvHgukBEgOB/SgGoorWVTzGM/3Z+wUNnboA4M8jWrg==",
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.6.tgz",
+      "integrity": "sha512-HQ3nbYRAowdVd0ckGFvmJPPCOH/CHleFN/Y0YQCX1DVaB7t+KFvisuyN09fuP8Jtp1CpfSh8O8bMkHbdbPe6Pw==",
       "requires": {
         "setimmediate": "1.0.5"
       }
@@ -13560,6 +14221,42 @@
             "is-descriptor": "0.1.6"
           }
         },
+        "is-accessor-descriptor": {
+          "version": "0.1.6",
+          "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
+          "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
+          "requires": {
+            "kind-of": "3.2.2"
+          },
+          "dependencies": {
+            "kind-of": {
+              "version": "3.2.2",
+              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+              "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+              "requires": {
+                "is-buffer": "1.1.6"
+              }
+            }
+          }
+        },
+        "is-data-descriptor": {
+          "version": "0.1.4",
+          "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
+          "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
+          "requires": {
+            "kind-of": "3.2.2"
+          },
+          "dependencies": {
+            "kind-of": {
+              "version": "3.2.2",
+              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+              "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+              "requires": {
+                "is-buffer": "1.1.6"
+              }
+            }
+          }
+        },
         "is-descriptor": {
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
@@ -13594,6 +14291,11 @@
         "hoek": "4.2.0"
       }
     },
+    "toposort": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/toposort/-/toposort-1.0.6.tgz",
+      "integrity": "sha1-wxdI5V0hDv/AD9zcfW5o19e7nOw="
+    },
     "touch": {
       "version": "0.0.3",
       "resolved": "https://registry.npmjs.org/touch/-/touch-0.0.3.tgz",
@@ -13662,6 +14364,11 @@
         }
       }
     },
+    "tryer": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/tryer/-/tryer-1.0.0.tgz",
+      "integrity": "sha1-Antp+oIyJeVRys4+8DsR9qs3wdc="
+    },
     "ts-jest": {
       "version": "21.2.4",
       "resolved": "https://registry.npmjs.org/ts-jest/-/ts-jest-21.2.4.tgz",
@@ -13675,10 +14382,25 @@
         "fs-extra": "4.0.3",
         "jest-config": "21.2.1",
         "pkg-dir": "2.0.0",
-        "source-map-support": "0.5.0",
-        "yargs": "10.0.3"
+        "source-map-support": "0.5.3",
+        "yargs": "10.1.2"
       },
       "dependencies": {
+        "ansi-regex": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg="
+        },
+        "cliui": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-4.0.0.tgz",
+          "integrity": "sha512-nY3W5Gu2racvdDk//ELReY+dHjb9PlIcVDFXP72nVIhq2Gy3LuVXYwJoPVudwQnv1shtohpgkdCKT2YaKY0CKw==",
+          "requires": {
+            "string-width": "2.1.1",
+            "strip-ansi": "4.0.0",
+            "wrap-ansi": "2.1.0"
+          }
+        },
         "fs-extra": {
           "version": "4.0.3",
           "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-4.0.3.tgz",
@@ -13698,19 +14420,27 @@
           }
         },
         "source-map-support": {
-          "version": "0.5.0",
-          "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.0.tgz",
-          "integrity": "sha512-vUoN3I7fHQe0R/SJLKRdKYuEdRGogsviXFkHHo17AWaTGv17VLnxw+CFXvqy+y4ORZ3doWLQcxRYfwKrsd/H7Q==",
+          "version": "0.5.3",
+          "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.3.tgz",
+          "integrity": "sha512-eKkTgWYeBOQqFGXRfKabMFdnWepo51vWqEdoeikaEPFiJC7MCU5j2h4+6Q8npkZTeLGbSyecZvRxiSoWl3rh+w==",
           "requires": {
             "source-map": "0.6.1"
           }
         },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
+          "requires": {
+            "ansi-regex": "3.0.0"
+          }
+        },
         "yargs": {
-          "version": "10.0.3",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-10.0.3.tgz",
-          "integrity": "sha512-DqBpQ8NAUX4GyPP/ijDGHsJya4tYqLQrjPr95HNsr1YwL3+daCfvBwg7+gIC6IdJhR2kATh3hb61vjzMWEtjdw==",
+          "version": "10.1.2",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-10.1.2.tgz",
+          "integrity": "sha512-ivSoxqBGYOqQVruxD35+EyCFDYNEFL/Uo6FcOnz+9xZdZzK0Zzw4r4KhbrME1Oo2gOggwJod2MnsdamSG7H9ig==",
           "requires": {
-            "cliui": "3.2.0",
+            "cliui": "4.0.0",
             "decamelize": "1.2.0",
             "find-up": "2.1.0",
             "get-caller-file": "1.0.2",
@@ -13721,13 +14451,13 @@
             "string-width": "2.1.1",
             "which-module": "2.0.0",
             "y18n": "3.2.1",
-            "yargs-parser": "8.0.0"
+            "yargs-parser": "8.1.0"
           }
         },
         "yargs-parser": {
-          "version": "8.0.0",
-          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-8.0.0.tgz",
-          "integrity": "sha1-IdR2Mw5agieaS4gTRb8GYQLiGcY=",
+          "version": "8.1.0",
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-8.1.0.tgz",
+          "integrity": "sha512-yP+6QqN8BmrgW2ggLtTbdrOyBNSI7zBa4IykmiV5R1wl1JWNxQvWhMfMdmzIYtKU7oP3OOInY/tl2ov3BDjnJQ==",
           "requires": {
             "camelcase": "4.1.0"
           }
@@ -13735,57 +14465,51 @@
       }
     },
     "tslib": {
-      "version": "1.8.1",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.8.1.tgz",
-      "integrity": "sha1-aUavLR1lGnsYY7Ux1uWvpBqkTqw="
+      "version": "1.9.0",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.9.0.tgz",
+      "integrity": "sha512-f/qGG2tUkrISBlQZEjEqoZ3B2+npJjIf04H1wuAv9iA8i04Icp+61KRXxFdha22670NJopsZCIjhC3SnjPRKrQ=="
     },
     "tslint": {
-      "version": "5.8.0",
-      "resolved": "https://registry.npmjs.org/tslint/-/tslint-5.8.0.tgz",
-      "integrity": "sha1-H0mtWy53x2w69N3K5VKuTjYS6xM=",
+      "version": "5.9.1",
+      "resolved": "https://registry.npmjs.org/tslint/-/tslint-5.9.1.tgz",
+      "integrity": "sha1-ElX4ej/1frCw4fDmEKi0dIBGya4=",
       "requires": {
         "babel-code-frame": "6.26.0",
         "builtin-modules": "1.1.1",
-        "chalk": "2.3.0",
-        "commander": "2.12.2",
+        "chalk": "2.3.1",
+        "commander": "2.14.1",
         "diff": "3.4.0",
         "glob": "7.1.2",
+        "js-yaml": "3.7.0",
         "minimatch": "3.0.4",
         "resolve": "1.5.0",
-        "semver": "5.4.1",
-        "tslib": "1.8.1",
-        "tsutils": "2.13.1"
+        "semver": "5.5.0",
+        "tslib": "1.9.0",
+        "tsutils": "2.21.1"
       }
     },
     "tslint-microsoft-contrib": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/tslint-microsoft-contrib/-/tslint-microsoft-contrib-5.0.1.tgz",
-      "integrity": "sha1-Mo7pwo0HzfeTKTIEyW4v+rkiGZQ=",
+      "version": "5.0.2",
+      "resolved": "https://registry.npmjs.org/tslint-microsoft-contrib/-/tslint-microsoft-contrib-5.0.2.tgz",
+      "integrity": "sha1-7MKnl/d3oS8AZpRM7AyBqefFnuk=",
       "requires": {
-        "tsutils": "1.9.1"
-      },
-      "dependencies": {
-        "tsutils": {
-          "version": "1.9.1",
-          "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-1.9.1.tgz",
-          "integrity": "sha1-ufmrROVa+WgYMdXyjQrur1x1DLA="
-        }
+        "tsutils": "2.21.1"
       }
     },
     "tslint-react": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/tslint-react/-/tslint-react-3.2.0.tgz",
-      "integrity": "sha1-hR+1BSAcY9A0PFFybmNk9+mtLpk=",
+      "version": "3.5.0",
+      "resolved": "https://registry.npmjs.org/tslint-react/-/tslint-react-3.5.0.tgz",
+      "integrity": "sha512-/530IQLogPjCMC1oVnn7pxw2g9gVN84SEgRF5BV9/BTc6mRXi0qoDfXvQsqejqvBBTxw39ntA1V1STP+xXwsnw==",
       "requires": {
-        "tsutils": "2.13.1"
+        "tsutils": "2.21.1"
       }
     },
     "tsutils": {
-      "version": "2.13.1",
-      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.13.1.tgz",
-      "integrity": "sha512-XMOEvc2TiYesVSOJMI7OYPnBMSgcvERuGW5Li/J+2A0TuH607BPQnOLQ82oSPZCssB8c9+QGi6qhTBa/f1xQRA==",
+      "version": "2.21.1",
+      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.21.1.tgz",
+      "integrity": "sha512-heMkdeQ9iUc90ynfiNo5Y+GXrEEGy86KMvnSTfHO+Q40AuNQ1lZGXcv58fuU9XTUxI0V7YIN9xPN+CO9b1Gn3w==",
       "requires": {
-        "tslib": "1.8.1"
+        "tslib": "1.9.0"
       }
     },
     "tty-browserify": {
@@ -13810,9 +14534,9 @@
       }
     },
     "type-detect": {
-      "version": "4.0.5",
-      "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.0.5.tgz",
-      "integrity": "sha512-N9IvkQslUGYGC24RkJk1ba99foK6TkwC2FHAEBlQFBP0RxQZS8ZpJuAZcwiY/w9ZJHFQb1aOXBI60OdxhTrwEQ=="
+      "version": "4.0.8",
+      "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.0.8.tgz",
+      "integrity": "sha512-0fr/mIH1dlO+x7TlcMy+bIDqKPsw/70tVyeHW787goQjhmqaZe10uwLujubK9q9Lg6Fiho1KUKDYz0Z7k7g5/g=="
     },
     "type-is": {
       "version": "1.6.15",
@@ -13823,6 +14547,11 @@
         "mime-types": "2.1.17"
       }
     },
+    "typedarray": {
+      "version": "0.0.6",
+      "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
+      "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
+    },
     "typescript": {
       "version": "2.6.2",
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.6.2.tgz",
@@ -13913,9 +14642,9 @@
       "integrity": "sha1-YaajIBBiKvoHljvzJSA88SI51gQ="
     },
     "underscore.string": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/underscore.string/-/underscore.string-2.4.0.tgz",
-      "integrity": "sha1-jN2PusTi0uoefi6Al8QvRCKA+Fs="
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/underscore.string/-/underscore.string-2.3.3.tgz",
+      "integrity": "sha1-ccCL9rQosRM/N+ePo6Icgvcymw0="
     },
     "union-value": {
       "version": "1.0.0",
@@ -13959,6 +14688,22 @@
       "resolved": "https://registry.npmjs.org/uniqs/-/uniqs-2.0.0.tgz",
       "integrity": "sha1-/+3ks2slKQaW5uFl1KWe25mOawI="
     },
+    "unique-filename": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/unique-filename/-/unique-filename-1.1.0.tgz",
+      "integrity": "sha1-0F8v5AMlYIcfMOk8vnNe6iAVFPM=",
+      "requires": {
+        "unique-slug": "2.0.0"
+      }
+    },
+    "unique-slug": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/unique-slug/-/unique-slug-2.0.0.tgz",
+      "integrity": "sha1-22Z258fMBimHj/GWCXx4hVrp9Ks=",
+      "requires": {
+        "imurmurhash": "0.1.4"
+      }
+    },
     "unique-string": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/unique-string/-/unique-string-1.0.0.tgz",
@@ -14013,6 +14758,27 @@
         }
       }
     },
+    "upath": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/upath/-/upath-1.0.0.tgz",
+      "integrity": "sha1-tHBrlGHKhHOt+JEz0jVonKF/NlY=",
+      "requires": {
+        "lodash": "3.10.1",
+        "underscore.string": "2.3.3"
+      },
+      "dependencies": {
+        "lodash": {
+          "version": "3.10.1",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
+          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
+        }
+      }
+    },
+    "upper-case": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/upper-case/-/upper-case-1.1.3.tgz",
+      "integrity": "sha1-9rRQHC7EzdJrp4vnIilh3ndiFZg="
+    },
     "urix": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/urix/-/urix-0.1.0.tgz",
@@ -14042,6 +14808,16 @@
         "loader-utils": "1.1.0",
         "mime": "1.6.0",
         "schema-utils": "0.3.0"
+      },
+      "dependencies": {
+        "schema-utils": {
+          "version": "0.3.0",
+          "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-0.3.0.tgz",
+          "integrity": "sha1-9YdyIs4+kx7a4DnxfrNxbnE3+M8=",
+          "requires": {
+            "ajv": "5.5.2"
+          }
+        }
       }
     },
     "url-parse": {
@@ -14078,6 +14854,42 @@
             "is-descriptor": "0.1.6"
           }
         },
+        "is-accessor-descriptor": {
+          "version": "0.1.6",
+          "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
+          "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
+          "requires": {
+            "kind-of": "3.2.2"
+          },
+          "dependencies": {
+            "kind-of": {
+              "version": "3.2.2",
+              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+              "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+              "requires": {
+                "is-buffer": "1.1.6"
+              }
+            }
+          }
+        },
+        "is-data-descriptor": {
+          "version": "0.1.4",
+          "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
+          "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
+          "requires": {
+            "kind-of": "3.2.2"
+          },
+          "dependencies": {
+            "kind-of": {
+              "version": "3.2.2",
+              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+              "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+              "requires": {
+                "is-buffer": "1.1.6"
+              }
+            }
+          }
+        },
         "is-descriptor": {
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
@@ -14115,15 +14927,20 @@
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
       "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8="
     },
+    "utila": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/utila/-/utila-0.4.0.tgz",
+      "integrity": "sha1-ihagXURWV6Oupe7MWxKk+lN5dyw="
+    },
     "utils-merge": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.1.tgz",
       "integrity": "sha1-n5VxD1CiZ5R7LMwSR0HBAoQn5xM="
     },
     "uuid": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.1.0.tgz",
-      "integrity": "sha512-DIWtzUkw04M4k3bf1IcpS2tngXEL26YUD2M0tMDUpnUrz2hgzUBlD55a4FjdLGPvfHxS6uluGWvaVEqgBcVa+g=="
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.2.1.tgz",
+      "integrity": "sha512-jZnMwlb9Iku/O3smGWvZhauCf6cvvpKi4BKRiliS3cxnI+Gz9j5MEpTz2UFuXiKPJocb7gnsLHwiS05ige5BEA=="
     },
     "validate-npm-package-license": {
       "version": "3.0.1",
@@ -14145,9 +14962,9 @@
       "integrity": "sha1-IpnwLG3tMNSllhsLn3RSShj2NPw="
     },
     "velocity-animate": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/velocity-animate/-/velocity-animate-1.5.0.tgz",
-      "integrity": "sha1-/Idx2N/hE2/wKnB+EPuwlXxLAw8="
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/velocity-animate/-/velocity-animate-1.5.1.tgz",
+      "integrity": "sha512-VJ3csMz5zP1ifkbBlsNYpxnoWkPHfVRQ8tUongS78W5DxSGHB68pjYHDTgUYBkVM7P/HpYdVukgVUFcxjr1gGg=="
     },
     "velocity-react": {
       "version": "1.3.3",
@@ -14157,7 +14974,7 @@
         "lodash": "3.10.1",
         "prop-types": "15.6.0",
         "react-transition-group": "1.2.1",
-        "velocity-animate": "1.5.0"
+        "velocity-animate": "1.5.1"
       },
       "dependencies": {
         "lodash": {
@@ -14246,14 +15063,14 @@
       "integrity": "sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg=="
     },
     "webpack": {
-      "version": "3.10.0",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-3.10.0.tgz",
-      "integrity": "sha512-fxxKXoicjdXNUMY7LIdY89tkJJJ0m1Oo8PQutZ5rLgWbV5QVKI15Cn7+/IHnRTd3vfKfiwBx6SBqlorAuNA8LA==",
+      "version": "3.11.0",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-3.11.0.tgz",
+      "integrity": "sha512-3kOFejWqj5ISpJk4Qj/V7w98h9Vl52wak3CLiw/cDOfbVTq7FeoZ0SdoHHY9PYlHr50ZS42OfvzE2vB4nncKQg==",
       "requires": {
-        "acorn": "5.2.1",
+        "acorn": "5.4.1",
         "acorn-dynamic-import": "2.0.2",
-        "ajv": "5.5.1",
-        "ajv-keywords": "2.1.1",
+        "ajv": "6.1.1",
+        "ajv-keywords": "3.1.0",
         "async": "2.6.0",
         "enhanced-resolve": "3.4.1",
         "escope": "3.6.0",
@@ -14275,9 +15092,24 @@
       },
       "dependencies": {
         "acorn": {
-          "version": "5.2.1",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.2.1.tgz",
-          "integrity": "sha512-jG0u7c4Ly+3QkkW18V+NRDN+4bWHdln30NL1ZL2AvFZZmQe/BfopYCtghCKKVBUSetZ4QKcyA0pY6/4Gw8Pv8w=="
+          "version": "5.4.1",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.4.1.tgz",
+          "integrity": "sha512-XLmq3H/BVvW6/GbxKryGxWORz1ebilSsUDlyC27bXhWGWAZWkGwS6FLHjOlwFXNFoWFQEO/Df4u0YYd0K3BQgQ=="
+        },
+        "ajv": {
+          "version": "6.1.1",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.1.1.tgz",
+          "integrity": "sha1-l41Zf7wrfQ5aXD3esUmmgvKr+g4=",
+          "requires": {
+            "fast-deep-equal": "1.0.0",
+            "fast-json-stable-stringify": "2.0.0",
+            "json-schema-traverse": "0.3.1"
+          }
+        },
+        "ajv-keywords": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.1.0.tgz",
+          "integrity": "sha1-rCsnk5xUPpXSwG5/f1wnvkqlQ74="
         },
         "enhanced-resolve": {
           "version": "3.4.1",
@@ -14290,11 +15122,24 @@
             "tapable": "0.2.8"
           }
         },
+        "has-flag": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
+          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
+        },
         "source-map": {
           "version": "0.5.7",
           "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
           "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
         },
+        "supports-color": {
+          "version": "4.5.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.5.0.tgz",
+          "integrity": "sha1-vnoN5ITexcXN34s9WRJQRJEvY1s=",
+          "requires": {
+            "has-flag": "2.0.0"
+          }
+        },
         "yargs": {
           "version": "8.0.2",
           "resolved": "https://registry.npmjs.org/yargs/-/yargs-8.0.2.tgz",
@@ -14318,54 +15163,42 @@
       }
     },
     "webpack-bundle-analyzer": {
-      "version": "2.9.1",
-      "resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.9.1.tgz",
-      "integrity": "sha512-a+UcvlsXvCmclNgfThT8PVyuJKd029By7CxkYEbNNCfs0Lqj9gagjkdv3S3MBvCIKBaUGYs8l4UpiVI0bFoh2Q==",
+      "version": "2.10.0",
+      "resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.10.0.tgz",
+      "integrity": "sha512-eA/9F/ZLFlVXfCLYqefHFbelJ3JcvyeFdmpAG6Vu3iJNcisj3KWNPqu00lCqK9caeaesipVrGb9alUSi2lEvAg==",
       "requires": {
-        "acorn": "5.2.1",
-        "chalk": "1.1.3",
-        "commander": "2.12.2",
+        "acorn": "5.4.1",
+        "bfj-node4": "5.2.1",
+        "chalk": "2.3.1",
+        "commander": "2.14.1",
         "ejs": "2.5.7",
         "express": "4.16.2",
-        "filesize": "3.5.11",
-        "gzip-size": "3.0.0",
-        "lodash": "4.17.4",
+        "filesize": "3.6.0",
+        "gzip-size": "4.1.0",
+        "lodash": "4.17.5",
         "mkdirp": "0.5.1",
         "opener": "1.4.3",
-        "ws": "3.3.2"
+        "ws": "4.0.0"
       },
       "dependencies": {
         "acorn": {
-          "version": "5.2.1",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.2.1.tgz",
-          "integrity": "sha512-jG0u7c4Ly+3QkkW18V+NRDN+4bWHdln30NL1ZL2AvFZZmQe/BfopYCtghCKKVBUSetZ4QKcyA0pY6/4Gw8Pv8w=="
-        },
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+          "version": "5.4.1",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.4.1.tgz",
+          "integrity": "sha512-XLmq3H/BVvW6/GbxKryGxWORz1ebilSsUDlyC27bXhWGWAZWkGwS6FLHjOlwFXNFoWFQEO/Df4u0YYd0K3BQgQ=="
         },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+        "gzip-size": {
+          "version": "4.1.0",
+          "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-4.1.0.tgz",
+          "integrity": "sha1-iuCWJX6r59acRb4rZ8RIEk/7UXw=",
           "requires": {
-            "ansi-styles": "2.2.1",
-            "escape-string-regexp": "1.0.5",
-            "has-ansi": "2.0.0",
-            "strip-ansi": "3.0.1",
-            "supports-color": "2.0.0"
+            "duplexer": "0.1.1",
+            "pify": "3.0.0"
           }
         },
         "lodash": {
-          "version": "4.17.4",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.4.tgz",
-          "integrity": "sha1-eCA6TRwyiuHYbcpkYONptX9AVa4="
-        },
-        "supports-color": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
         }
       }
     },
@@ -14382,14 +15215,14 @@
       }
     },
     "webpack-dev-server": {
-      "version": "2.9.7",
-      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.9.7.tgz",
-      "integrity": "sha512-Pu7uoQFgQj5RE5wmlfkpYSzihMKxulwEuO2xCsaMnAnyRSApwoVi3B8WCm9XbigyWTHaIMzYGkB90Vr6leAeTQ==",
+      "version": "2.11.1",
+      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.11.1.tgz",
+      "integrity": "sha512-ombhu5KsO/85sVshIDTyQ5HF3xjZR3N0sf5Ao6h3vFwpNyzInEzA1GV3QPVjTMLTNckp8PjfG1PFGznzBwS5lg==",
       "requires": {
         "ansi-html": "0.0.7",
         "array-includes": "3.0.3",
         "bonjour": "3.5.0",
-        "chokidar": "1.7.0",
+        "chokidar": "2.0.1",
         "compression": "1.7.1",
         "connect-history-api-fallback": "1.5.0",
         "debug": "3.1.0",
@@ -14397,24 +15230,51 @@
         "express": "4.16.2",
         "html-entities": "1.2.1",
         "http-proxy-middleware": "0.17.4",
-        "import-local": "0.1.1",
+        "import-local": "1.0.0",
         "internal-ip": "1.2.0",
         "ip": "1.1.5",
         "killable": "1.0.0",
-        "loglevel": "1.6.0",
-        "opn": "5.1.0",
+        "loglevel": "1.6.1",
+        "opn": "5.2.0",
         "portfinder": "1.0.13",
-        "selfsigned": "1.10.1",
+        "selfsigned": "1.10.2",
         "serve-index": "1.9.1",
-        "sockjs": "0.3.18",
+        "sockjs": "0.3.19",
         "sockjs-client": "1.1.4",
         "spdy": "3.4.7",
         "strip-ansi": "3.0.1",
-        "supports-color": "4.5.0",
+        "supports-color": "5.2.0",
         "webpack-dev-middleware": "1.12.2",
         "yargs": "6.6.0"
       },
       "dependencies": {
+        "anymatch": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-2.0.0.tgz",
+          "integrity": "sha512-5teOsQWABXHHBFP9y3skS5P3d/WfWXpv3FUpy+LorMrNYaT9pI4oLMQX7jzQ2KklNpGpWHzdCXTDT2Y3XGlZBw==",
+          "requires": {
+            "micromatch": "3.1.5",
+            "normalize-path": "2.1.1"
+          }
+        },
+        "chokidar": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-2.0.1.tgz",
+          "integrity": "sha512-rv5iP8ENhpqvDWr677rAXcB+SMoPQ1urd4ch79+PhM4lQwbATdJUQK69t0lJIKNB+VXpqxt5V1gvqs59XEPKnw==",
+          "requires": {
+            "anymatch": "2.0.0",
+            "async-each": "1.0.1",
+            "braces": "2.3.0",
+            "glob-parent": "3.1.0",
+            "inherits": "2.0.3",
+            "is-binary-path": "1.0.1",
+            "is-glob": "4.0.0",
+            "normalize-path": "2.1.1",
+            "path-is-absolute": "1.0.1",
+            "readdirp": "2.1.0",
+            "upath": "1.0.0"
+          }
+        },
         "debug": {
           "version": "3.1.0",
           "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
@@ -14423,10 +15283,42 @@
             "ms": "2.0.0"
           }
         },
+        "glob-parent": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-3.1.0.tgz",
+          "integrity": "sha1-nmr2KZ2NO9K9QEMIMr0RPfkGxa4=",
+          "requires": {
+            "is-glob": "3.1.0",
+            "path-dirname": "1.0.2"
+          },
+          "dependencies": {
+            "is-glob": {
+              "version": "3.1.0",
+              "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz",
+              "integrity": "sha1-e6WuJCF4BKxwcHuWkiVnSGzD6Eo=",
+              "requires": {
+                "is-extglob": "2.1.1"
+              }
+            }
+          }
+        },
+        "is-extglob": {
+          "version": "2.1.1",
+          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
+          "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI="
+        },
+        "is-glob": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.0.tgz",
+          "integrity": "sha1-lSHHaEXMJhCoUgPd8ICpWML/q8A=",
+          "requires": {
+            "is-extglob": "2.1.1"
+          }
+        },
         "opn": {
-          "version": "5.1.0",
-          "resolved": "https://registry.npmjs.org/opn/-/opn-5.1.0.tgz",
-          "integrity": "sha512-iPNl7SyM8L30Rm1sjGdLLheyHVw5YXVfi3SKWJzBI7efxRwHojfRFjwE/OLM6qp9xJYMgab8WicTU1cPoY+Hpg==",
+          "version": "5.2.0",
+          "resolved": "https://registry.npmjs.org/opn/-/opn-5.2.0.tgz",
+          "integrity": "sha512-Jd/GpzPyHF4P2/aNOVmS3lfMSWV9J7cOhCG1s08XCEAsPkB7lp6ddiU0J7XzyQRDUh8BqJ7PchfINjR8jyofRQ==",
           "requires": {
             "is-wsl": "1.1.0"
           }
@@ -14445,43 +15337,13 @@
       }
     },
     "webpack-notifier": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/webpack-notifier/-/webpack-notifier-1.5.0.tgz",
-      "integrity": "sha1-wBAAfUSM68NN78mezyiPpejGuvY=",
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/webpack-notifier/-/webpack-notifier-1.5.1.tgz",
+      "integrity": "sha1-z19rmhcR+Alpu8T3vRXUDqexh2E=",
       "requires": {
-        "node-notifier": "4.6.1",
+        "node-notifier": "5.2.1",
         "object-assign": "4.1.1",
         "strip-ansi": "3.0.1"
-      },
-      "dependencies": {
-        "lodash.clonedeep": {
-          "version": "3.0.2",
-          "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-3.0.2.tgz",
-          "integrity": "sha1-oKHkDYKl6on/WxR7hETtY9koJ9s=",
-          "requires": {
-            "lodash._baseclone": "3.3.0",
-            "lodash._bindcallback": "3.0.1"
-          }
-        },
-        "minimist": {
-          "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
-          "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
-        },
-        "node-notifier": {
-          "version": "4.6.1",
-          "resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-4.6.1.tgz",
-          "integrity": "sha1-BW0UJE89zBzq3+aK+c/wxUc6M/M=",
-          "requires": {
-            "cli-usage": "0.1.4",
-            "growly": "1.3.0",
-            "lodash.clonedeep": "3.0.2",
-            "minimist": "1.2.0",
-            "semver": "5.4.1",
-            "shellwords": "0.1.1",
-            "which": "1.3.0"
-          }
-        }
       }
     },
     "webpack-sources": {
@@ -14498,7 +15360,7 @@
       "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.7.0.tgz",
       "integrity": "sha1-DK+dLXVdk67gSdS90NP+LMoqJOs=",
       "requires": {
-        "http-parser-js": "0.4.9",
+        "http-parser-js": "0.4.10",
         "websocket-extensions": "0.1.3"
       }
     },
@@ -14657,10 +15519,10 @@
       "requires": {
         "chalk": "1.1.3",
         "debug": "2.6.9",
-        "filesize": "3.5.11",
+        "filesize": "3.6.0",
         "lodash": "4.15.0",
         "mkdirp": "0.5.1",
-        "moment": "2.19.4"
+        "moment": "2.20.1"
       },
       "dependencies": {
         "ansi-styles": {
@@ -14688,9 +15550,9 @@
       }
     },
     "ws": {
-      "version": "3.3.2",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-3.3.2.tgz",
-      "integrity": "sha512-t+WGpsNxhMR4v6EClXS8r8km5ZljKJzyGhJf7goJz9k5Ye3+b5Bvno5rjqPuIBn5mnn5GBb7o8IrIWHxX1qOLQ==",
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-4.0.0.tgz",
+      "integrity": "sha512-QYslsH44bH8O7/W2815u5DpnCpXWpEK44FmaHffNwgJI4JMaSZONgPBTOfrxJ29mXKbXak+LsJ2uAkDTYq2ptQ==",
       "requires": {
         "async-limiter": "1.0.0",
         "safe-buffer": "5.1.1",
@@ -14702,6 +15564,11 @@
       "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-3.0.0.tgz",
       "integrity": "sha1-SWsswQnsqNus/i3HK2A8F8WHCtQ="
     },
+    "xml-char-classes": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/xml-char-classes/-/xml-char-classes-1.0.0.tgz",
+      "integrity": "sha1-ZGV4SKIP/F31g6Qq2KJ3tFErvE0="
+    },
     "xml-name-validator": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-2.0.1.tgz",
@@ -14872,11 +15739,11 @@
       "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-3.18.4.tgz",
       "integrity": "sha512-DUOKC/IhbkdLKKiV89gw9DUauTV8U/8yJl1sjf6MtDmzevLKOF2duNJ495S3MFVjqZarr+qNGCPbkg4mu4PpLw==",
       "requires": {
-        "commander": "2.12.2",
+        "commander": "2.14.1",
         "lodash.get": "4.4.2",
         "lodash.isequal": "4.5.0",
         "validator": "8.2.0"
       }
     }
   }
-}
\ No newline at end of file
+}
diff --git a/scripts/package.json b/scripts/package.json
index d2ea945a50af1..91ac68da3a252 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -49,7 +49,7 @@
   "bundlesize": [
     {
       "path": "../apps/test-bundle-button/dist/main.min.js",
-      "maxSize": "42.9 kB"
+      "maxSize": "43.0 kB"
     }
   ]
-}
+}
\ No newline at end of file

From f57acaa79994e796b1219ed4cbe61904c4948e5b Mon Sep 17 00:00:00 2001
From: Trevor Gau <trevorsg@gmail.com>
Date: Tue, 13 Feb 2018 16:02:12 -0500
Subject: [PATCH 1353/1641] Fix aria attributes in ContextualMenu and
 CommandBar (#3951)

* Add aria-setsize and -posinset to command bar items.

* Fix the aria-owns property on contextual menu items.

* Add unit test for aria properties on CommandBar.
---
 .../master_2018-02-12-21-15.json              | 11 +++++
 .../components/CommandBar/CommandBar.test.tsx | 46 +++++++++++++++++++
 .../src/components/CommandBar/CommandBar.tsx  | 23 +++++++---
 .../__snapshots__/CommandBar.test.tsx.snap    |  2 +
 .../ContextualMenu/ContextualMenu.test.tsx    | 33 +++++++++++++
 .../ContextualMenu/ContextualMenu.tsx         | 11 +++--
 6 files changed, 117 insertions(+), 9 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/master_2018-02-12-21-15.json

diff --git a/common/changes/office-ui-fabric-react/master_2018-02-12-21-15.json b/common/changes/office-ui-fabric-react/master_2018-02-12-21-15.json
new file mode 100644
index 0000000000000..760c8144a8dac
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2018-02-12-21-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix aria-owns in contextual menu items, and add appropriate aria properties to CommandBar items.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "trgau@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
index ac810998684d0..5626722982de8 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
@@ -43,6 +43,52 @@ describe('CommandBar', () => {
     expect(tree).toMatchSnapshot();
   });
 
+  it('adds the correct aria-setsize and -posinset attributes to the command bar items.', () => {
+    const items: IContextualMenuItem[] = [
+      {
+        name: 'TestText 1',
+        key: 'TestKey1',
+        className: 'item1',
+        subMenuProps: {
+          items: [
+            {
+              name: 'SubmenuText 1',
+              key: 'SubmenuKey1',
+              className: 'SubMenuClass'
+            }
+          ]
+        }
+      },
+      {
+        name: 'TestText 2',
+        key: 'TestKey2',
+        className: 'item2',
+      },
+      {
+        name: 'TestText 3',
+        key: 'TestKey3',
+        className: 'item3',
+      },
+    ];
+
+    const renderedContent = ReactTestUtils.renderIntoDocument<CommandBar>(
+      <CommandBar
+        items={ items }
+      />
+    ) as React.Component<CommandBar, {}>;
+    document.body.appendChild(ReactDOM.findDOMNode(renderedContent));
+
+    console.log(document.body.innerHTML);
+
+    const [item1, item2, item3] = ['.item1', '.item2', '.item3'].map(i => document.querySelector(i)!.children[0]);
+    expect(item1.getAttribute('aria-setsize')).toBe('3');
+    expect(item2.getAttribute('aria-setsize')).toBe('3');
+    expect(item3.getAttribute('aria-setsize')).toBe('3');
+    expect(item1.getAttribute('aria-posinset')).toBe('1');
+    expect(item2.getAttribute('aria-posinset')).toBe('2');
+    expect(item3.getAttribute('aria-posinset')).toBe('3');
+  });
+
   it('opens a menu with deprecated IContextualMenuItem.items property', () => {
     const items: IContextualMenuItem[] = [
       {
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index a40a2bb30501e..380c19195a352 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -110,14 +110,17 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
         </div>
       );
     }
+    // Total # of menu items is regular items + far items + 1 for the ellipsis, if necessary
+    const setSize = renderedItems!.length + renderedFarItems!.length + (renderedOverflowItems && renderedOverflowItems.length > 0 ? 1 : 0);
+    let posInSet = 1;
 
     return (
       <div className={ css('ms-CommandBar', styles.root, className) } ref='commandBarRegion'>
         { searchBox }
         <FocusZone ref='focusZone' className={ styles.container } direction={ FocusZoneDirection.horizontal } role='menubar' >
           <div className={ css('ms-CommandBar-primaryCommands', styles.primaryCommands) } ref='commandSurface'>
-            { renderedItems!.map((item, index) => (
-              this._renderItemInCommandBar(item, index, expandedMenuItemKey!)
+            { renderedItems!.map(item => (
+              this._renderItemInCommandBar(item, posInSet++, setSize, expandedMenuItemKey!)
             )).concat((renderedOverflowItems && renderedOverflowItems.length) ? [
               <div className={ css('ms-CommandBarItem', styles.item) } key={ OVERFLOW_KEY } ref={ OVERFLOW_KEY }>
                 <button
@@ -131,6 +134,8 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
                   aria-expanded={ this.state.expandedMenuItemKey === OVERFLOW_KEY }
                   aria-label={ this.props.elipisisAriaLabel || '' }
                   aria-haspopup={ true }
+                  aria-setsize={ setSize }
+                  aria-posinset={ posInSet++ }
                   data-automation-id='commandBarOverflow'
                 >
                   <Icon className={ css('ms-CommandBarItem-overflow', styles.itemOverflow) } iconName='more' />
@@ -139,8 +144,8 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
             ] : []) }
           </div>
           <div className={ css('ms-CommandBar-sideCommands', styles.sideCommands) } ref='farCommandSurface'>
-            { renderedFarItems!.map((item, index) => (
-              this._renderItemInCommandBar(item, index, expandedMenuItemKey!, true)
+            { renderedFarItems!.map(item => (
+              this._renderItemInCommandBar(item, posInSet++, setSize, expandedMenuItemKey!, true)
             )) }
           </div>
         </FocusZone>
@@ -163,7 +168,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
     this.refs.focusZone.focus();
   }
 
-  private _renderItemInCommandBar(item: ICommandBarItemProps, index: number, expandedMenuItemKey: string, isFarItem?: boolean) {
+  private _renderItemInCommandBar(item: ICommandBarItemProps, posInSet: number, setSize: number, expandedMenuItemKey: string, isFarItem?: boolean) {
     if (item.onRender) {
       return (
         <div className={ css('ms-CommandBarItem', styles.item, item.className) } key={ item.key } ref={ item.key }>
@@ -172,7 +177,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
       );
     }
 
-    const itemKey = item.key || String(index);
+    const itemKey = item.key || String(posInSet);
     const isLink = item.onClick || hasSubmenu(item);
     const className = css(
       isLink ? ('ms-CommandBarItem-link ' + styles.itemLink) : ('ms-CommandBarItem-text ' + styles.itemText),
@@ -196,6 +201,8 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
           aria-expanded={ hasSubmenu(item) ? expandedMenuItemKey === item.key : undefined }
           role='menuitem'
           aria-label={ ariaLabel }
+          aria-setsize={ setSize }
+          aria-posinset={ posInSet }
         >
           { (hasIcon) ? this._renderIcon(item) : (null) }
           { isNameVisible && (
@@ -222,6 +229,8 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
           aria-haspopup={ hasSubmenu(item) }
           role='menuitem'
           aria-label={ ariaLabel }
+          aria-setsize={ setSize }
+          aria-posinset={ posInSet }
         >
           { (hasIcon) ? this._renderIcon(item) : (null) }
           { isNameVisible && (
@@ -243,6 +252,8 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
           data-command-key={ itemKey }
           aria-haspopup={ hasSubmenu(item) }
           aria-label={ ariaLabel }
+          aria-setsize={ setSize }
+          aria-posinset={ posInSet }
         >
           { (hasIcon) ? this._renderIcon(item) : (null) }
           { (isNameVisible) && (
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap b/packages/office-ui-fabric-react/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
index 06410c197e976..1d75d3b33a5d1 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
@@ -24,6 +24,8 @@ exports[`CommandBar renders CommandBar correctly 1`] = `
           aria-expanded={false}
           aria-haspopup={true}
           aria-label={undefined}
+          aria-posinset={1}
+          aria-setsize={1}
           className="ms-CommandBarItem-link undefined"
           data-command-key="TestKey1"
           id="CommandBar0TestKey1"
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
index 628199910bb4e..be5b2f4147d9d 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
@@ -179,6 +179,39 @@ describe('ContextualMenu', () => {
     expect(document.querySelector('.SubMenuClass')).toBeDefined();
   });
 
+  it('sets the correct aria-owns attribute for the submenu', () => {
+    const submenuId = 'testSubmenuId';
+    const items: IContextualMenuItem[] = [
+      {
+        name: 'TestText 1',
+        key: 'TestKey1',
+        subMenuProps: {
+          id: submenuId,
+          items: [
+            {
+              name: 'SubmenuText 1',
+              key: 'SubmenuKey1',
+              className: 'SubMenuClass'
+            }
+          ]
+        }
+      },
+    ];
+
+    ReactTestUtils.renderIntoDocument<ContextualMenu>(
+      <ContextualMenu
+        items={ items }
+      />
+    );
+
+    const parentMenuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
+    ReactTestUtils.Simulate.click(parentMenuItem);
+    const childMenu = document.getElementById(submenuId);
+
+    expect(childMenu!.id).toBe(submenuId);
+    expect(parentMenuItem.getAttribute('aria-owns')).toBe(submenuId);
+  });
+
   it('still works with deprecated IContextualMenuItem.items property', () => {
     const items: IContextualMenuItem[] = [
       {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index a3ddeb26e95dc..829906931bb9e 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -492,6 +492,10 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     hasCheckmarks?: boolean,
     hasIcons?: boolean) {
     let { expandedMenuItemKey, subMenuId } = this.state;
+    if (item.subMenuProps && item.subMenuProps.id) {
+      subMenuId = item.subMenuProps.id;
+    }
+
     let ariaLabel = '';
 
     if (item.ariaLabel) {
@@ -503,11 +507,12 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     const isChecked: boolean | null | undefined = getIsChecked(item);
     const canCheck: boolean = isChecked !== null;
     const defaultRole = canCheck ? 'menuitemcheckbox' : 'menuitem';
+    const itemHasSubmenu = hasSubmenu(item);
 
     const itemButtonProperties = {
       className: classNames.root,
       onClick: this._onItemClick.bind(this, item),
-      onKeyDown: hasSubmenu(item) ? this._onItemKeyDown.bind(this, item) : null,
+      onKeyDown: itemHasSubmenu ? this._onItemKeyDown.bind(this, item) : null,
       onMouseEnter: this._onItemMouseEnter.bind(this, item),
       onMouseLeave: this._onMouseItemLeave.bind(this, item),
       onMouseDown: (ev: any) => this._onItemMouseDown(item, ev),
@@ -516,9 +521,9 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       href: item.href,
       title: item.title,
       'aria-label': ariaLabel,
-      'aria-haspopup': hasSubmenu(item) || null,
+      'aria-haspopup': itemHasSubmenu || null,
       'aria-owns': item.key === expandedMenuItemKey ? subMenuId : null,
-      'aria-expanded': hasSubmenu(item) ? item.key === expandedMenuItemKey : null,
+      'aria-expanded': itemHasSubmenu ? item.key === expandedMenuItemKey : null,
       'aria-checked': isChecked,
       'aria-posinset': focusableElementIndex + 1,
       'aria-setsize': totalItemCount,

From 8fa181dab613c604f49ca518eceff53b7206deda Mon Sep 17 00:00:00 2001
From: Kurt Carpenter <github@kurtcarpenter.io>
Date: Tue, 13 Feb 2018 13:09:56 -0800
Subject: [PATCH 1354/1641]  Make ComboBox, ContextualMenu, TeachingBubble
 support calloutProps.className  (#3504)

* Fix ComboBox, ContextualMenu, TeachingBubble calloutProps.className

* Regression tests callout.className

* add changelog
---
 ...calloutprops-classname_2017-12-11-20-00.json | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.test.tsx   | 16 ++++++++++++++++
 .../src/components/ComboBox/ComboBox.tsx        |  5 +++--
 .../ContextualMenu/ContextualMenu.test.tsx      | 17 +++++++++++++++++
 .../ContextualMenu/ContextualMenu.tsx           |  5 +++--
 .../TeachingBubble/TeachingBubble.test.tsx      | 14 ++++++++++++++
 .../TeachingBubble/TeachingBubble.tsx           |  2 +-
 7 files changed, 65 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/component-calloutprops-classname_2017-12-11-20-00.json

diff --git a/common/changes/office-ui-fabric-react/component-calloutprops-classname_2017-12-11-20-00.json b/common/changes/office-ui-fabric-react/component-calloutprops-classname_2017-12-11-20-00.json
new file mode 100644
index 0000000000000..eac96ed35f8aa
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/component-calloutprops-classname_2017-12-11-20-00.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix ComboBox, ContextualMenu, Teachingbubble overwriting calloutProps.className",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kurt.carpenter@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
index 5d7513d8d3c09..5b2d2896df638 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
@@ -377,4 +377,20 @@ describe('ComboBox', () => {
     wrapper.update();
     expect(wrapper.find('.ms-ComboBox input').props().value).toEqual('Text');
   });
+
+  it('merges callout classNames', () => {
+    ReactTestUtils.renderIntoDocument<ComboBox>(
+      <ComboBox
+        options={ DEFAULT_OPTIONS }
+        calloutProps={ { className: 'foo' } }
+      />
+    );
+
+    setTimeout(() => {
+      let callout = document.querySelector('.ms-Callout') as HTMLElement;
+      expect(callout).toBeDefined();
+      expect(callout.classList.contains('ms-ComboBox-callout')).toBeTruthy();
+      expect(callout.classList.contains('foo')).toBeTruthy();
+    }, 0);
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 1d5e0e94c82bd..d195d4a57055a 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -16,7 +16,8 @@ import {
   getId,
   getNativeProps,
   KeyCodes,
-  customizable
+  customizable,
+  css
 } from '../../Utilities';
 import { SelectableOptionMenuItemType, ISelectableOption } from '../../utilities/selectableOption/SelectableOption.types';
 import {
@@ -870,7 +871,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         directionalHint={ DirectionalHint.bottomLeftEdge }
         directionalHintFixed={ true }
         { ...calloutProps }
-        className={ this._classNames.callout }
+        className={ css(this._classNames.callout, calloutProps ? calloutProps.className : undefined) }
         target={ this._comboBoxWrapper }
         onDismiss={ this._onDismiss }
         onScroll={ this._onScroll }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
index be5b2f4147d9d..bae1f27df927d 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
@@ -541,6 +541,23 @@ describe('ContextualMenu', () => {
     expect(menuMountedFirst).toEqual(false);
   });
 
+  it('merges callout classNames', () => {
+    ReactTestUtils.renderIntoDocument<ContextualMenu>(
+      <ContextualMenu
+        items={ [{
+          name: 'TestText 0',
+          key: 'TestKey0'
+        }] }
+        calloutProps={ { className: 'foo' } }
+      />
+    );
+
+    let callout = document.querySelector('.ms-Callout') as HTMLElement;
+    expect(callout).toBeDefined();
+    expect(callout.classList.contains('ms-ContextualMenu-Callout')).toBeTruthy();
+    expect(callout.classList.contains('foo')).toBeTruthy();
+  });
+
   it('Contextual Menu submenu has chrevron icon even if submenu has no items', () => {
     const menuWithEmptySubMenu: IContextualMenuItem[] = [
       {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 829906931bb9e..0bbdc7a0a6242 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -24,7 +24,8 @@ import {
   getWindow,
   customizable,
   getFirstFocusable,
-  getLastFocusable
+  getLastFocusable,
+  css
 } from '../../Utilities';
 import { withResponsiveMode, ResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
 import { Callout } from '../../Callout';
@@ -280,7 +281,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
           gapSpace={ gapSpace }
           coverTarget={ coverTarget }
           doNotLayer={ doNotLayer }
-          className='ms-ContextualMenu-Callout'
+          className={ css('ms-ContextualMenu-Callout', calloutProps ? calloutProps.className : undefined) }
           setInitialFocus={ shouldFocusOnMount }
           onDismiss={ this.props.onDismiss }
           onScroll={ this._onScroll }
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.test.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.test.tsx
index 963a3cc0d6c49..bbfc2130364fa 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.test.tsx
@@ -33,4 +33,18 @@ describe('TeachingBubble', () => {
     expect(titleElement!.textContent).toEqual('Title');
   });
 
+  it('merges callout classNames', () => {
+    ReactTestUtils.renderIntoDocument<TeachingBubbleContent>(
+      <TeachingBubbleContent
+        headline='Title'
+        calloutProps={ { className: 'foo' } }
+      />
+    );
+    setTimeout(() => {
+      let callout = document.querySelector('.ms-Callout') as HTMLElement;
+      expect(callout).toBeDefined();
+      expect(callout.classList.contains('ms-TeachingBubble')).toBeTruthy();
+      expect(callout.classList.contains('foo')).toBeTruthy();
+    }, 0);
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
index c872fd13a0577..c0f117e8457c9 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
@@ -53,11 +53,11 @@ export class TeachingBubble extends BaseComponent<ITeachingBubbleProps, ITeachin
 
     return (
       <Callout
-        className={ css('ms-TeachingBubble', styles.root, this.props.isWide ? styles.wideCallout : null) }
         ref={ this._resolveRef('_callout') }
         target={ targetElement }
         onDismiss={ onDismiss }
         {...calloutProps}
+        className={ css('ms-TeachingBubble', styles.root, this.props.isWide ? styles.wideCallout : null, calloutProps ? calloutProps.className : undefined) }
       >
         <TeachingBubbleContent { ...this.props } />
       </Callout>

From ad1dcfca80bf8f14209f4911a24874b5582ac60e Mon Sep 17 00:00:00 2001
From: Ivan Samoylov <IA.Samoylov@outlook.com>
Date: Wed, 14 Feb 2018 03:11:41 +0600
Subject: [PATCH 1355/1641] [TextField] fix validate function works with
 validate on focus out (#3944)

* + fix validate with validateOnFocusOut and validateOnFocusIn

* + extended the test, added case for validateOnFocusOut from issue

* + change validateOnFocus... tests

* + add change file
---
 ...h-validateOnFocusOut_2018-02-11-17-19.json | 11 ++++++++
 .../components/TextField/TextField.test.tsx   | 27 ++++++++++++++++---
 .../src/components/TextField/TextField.tsx    |  4 ++-
 3 files changed, 38 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/bugfix-Fix-validate-function-works-with-validateOnFocusOut_2018-02-11-17-19.json

diff --git a/common/changes/office-ui-fabric-react/bugfix-Fix-validate-function-works-with-validateOnFocusOut_2018-02-11-17-19.json b/common/changes/office-ui-fabric-react/bugfix-Fix-validate-function-works-with-validateOnFocusOut_2018-02-11-17-19.json
new file mode 100644
index 0000000000000..c57cdd8fedaef
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/bugfix-Fix-validate-function-works-with-validateOnFocusOut_2018-02-11-17-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix bug: '#3940 Validate function works incorrect with attribute validateOnFocusOut'",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "ia.samoylov@icloud.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
index cca8acb446834..04f715640aaf0 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
@@ -84,7 +84,7 @@ describe('TextField', () => {
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <TextField
-        prefix={ examplePrefix}
+        prefix={ examplePrefix }
         suffix={ exampleSuffix }
       />
     );
@@ -287,6 +287,11 @@ describe('TextField', () => {
 
       ReactTestUtils.Simulate.focus(inputDOM);
       expect(validationCallCount).toEqual(2);
+
+      ReactTestUtils.Simulate.input(inputDOM, mockEvent('the input '));
+      ReactTestUtils.Simulate.input(inputDOM, mockEvent('the input value'));
+      ReactTestUtils.Simulate.focus(inputDOM);
+      expect(validationCallCount).toEqual(3);
     });
 
     it('should trigger validation only on blur', () => {
@@ -305,12 +310,17 @@ describe('TextField', () => {
       );
 
       const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
-      ReactTestUtils.Simulate.focus(inputDOM);
       ReactTestUtils.Simulate.input(inputDOM, mockEvent('the input value'));
       expect(validationCallCount).toEqual(1);
 
       ReactTestUtils.Simulate.blur(inputDOM);
       expect(validationCallCount).toEqual(2);
+
+      ReactTestUtils.Simulate.input(inputDOM, mockEvent('the input va'));
+      ReactTestUtils.Simulate.input(inputDOM, mockEvent('the input value'));
+
+      ReactTestUtils.Simulate.blur(inputDOM);
+      expect(validationCallCount).toEqual(3);
     });
 
     it('should trigger validation on both blur and focus', () => {
@@ -335,9 +345,20 @@ describe('TextField', () => {
 
       ReactTestUtils.Simulate.focus(inputDOM);
       expect(validationCallCount).toEqual(2);
+
+      ReactTestUtils.Simulate.input(inputDOM, mockEvent('value before foc'));
+      ReactTestUtils.Simulate.input(inputDOM, mockEvent('value before focus'));
+      ReactTestUtils.Simulate.focus(inputDOM);
+      expect(validationCallCount).toEqual(3);
+
       ReactTestUtils.Simulate.input(inputDOM, mockEvent('value before blur'));
       ReactTestUtils.Simulate.blur(inputDOM);
-      expect(validationCallCount).toEqual(3);
+      expect(validationCallCount).toEqual(4);
+
+      ReactTestUtils.Simulate.input(inputDOM, mockEvent('value before bl'));
+      ReactTestUtils.Simulate.input(inputDOM, mockEvent('value before blur'));
+      ReactTestUtils.Simulate.blur(inputDOM);
+      expect(validationCallCount).toEqual(5);
     });
 
     it('should not trigger validation on component mount', () => {
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index bb711fbd70f7e..06e63901eedc9 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -418,8 +418,10 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
   }
 
   private _validate(value: string | undefined): void {
+    const { validateOnFocusIn, validateOnFocusOut } = this.props;
+
     // In case of _validate called multi-times during executing validate logic with promise return.
-    if (this._latestValidateValue === value) {
+    if (this._latestValidateValue === value && !(validateOnFocusIn || validateOnFocusOut)) {
       return;
     }
 

From 45c24f3abdc747f77221e0bb90b32a17ac5b9e13 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 13 Feb 2018 13:51:11 -0800
Subject: [PATCH 1356/1641] ChoiceGroup: Updating stories (#3964)

* No default selected, click to select added

* Removed leftover defaultSelectedKey
---
 apps/vr-tests/src/stories/ChoiceGroup.stories.tsx | 12 +++++-------
 1 file changed, 5 insertions(+), 7 deletions(-)

diff --git a/apps/vr-tests/src/stories/ChoiceGroup.stories.tsx b/apps/vr-tests/src/stories/ChoiceGroup.stories.tsx
index dc4609f217909..21fa7b976c834 100644
--- a/apps/vr-tests/src/stories/ChoiceGroup.stories.tsx
+++ b/apps/vr-tests/src/stories/ChoiceGroup.stories.tsx
@@ -29,9 +29,12 @@ storiesOf('ChoiceGroup', module)
       steps={ new Screener.Steps()
         .snapshot('default', { cropTo: '.testWrapper' })
         .hover('div.ms-ChoiceField:nth-of-type(1)')
-        .snapshot('hover selected', { cropTo: '.testWrapper' })
-        .hover('div.ms-ChoiceField:nth-of-type(2)')
         .snapshot('hover unselected', { cropTo: '.testWrapper' })
+        .click('div.ms-ChoiceField:nth-of-type(1)')
+        .snapshot('selected', { cropTo: '.testWrapper' })
+        .click('div.ms-ChoiceField:nth-of-type(1)')
+        .hover('div.ms-ChoiceField:nth-of-type(1)')
+        .snapshot('hover selected', { cropTo: '.testWrapper' })
         .end()
       }
     >
@@ -40,14 +43,12 @@ storiesOf('ChoiceGroup', module)
   ))
   .add('Root', () => (
     <ChoiceGroup
-      defaultSelectedKey='A'
       options={ options }
       label='Pick one'
     />
   ))
   .add('Required', () => (
     <ChoiceGroup
-      defaultSelectedKey='A'
       options={ options }
       label='Pick one'
       required
@@ -56,7 +57,6 @@ storiesOf('ChoiceGroup', module)
   .add('With icons', () => (
     <ChoiceGroup
       label='Pick one icon'
-      defaultSelectedKey='day'
       options={ [
         {
           key: 'day',
@@ -80,7 +80,6 @@ storiesOf('ChoiceGroup', module)
   .add('With default size images', () => (
     <ChoiceGroup
       label='Pick one image'
-      defaultSelectedKey='bar'
       options={ [
         {
           key: 'bar',
@@ -100,7 +99,6 @@ storiesOf('ChoiceGroup', module)
   .add('With large size images', () => (
     <ChoiceGroup
       label='Pick one image'
-      defaultSelectedKey='bar'
       options={ [
         {
           key: 'bar2',

From 746b36e94dfbe2fa97bb5432a6d2e723e5a28551 Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Tue, 13 Feb 2018 14:06:16 -0800
Subject: [PATCH 1357/1641] Button ex mergestyles (#3863)

Converted ButtonBasicExample to use mergeStyles instead of SCSS.
---
 ...ButtonEx-mergestyles_2018-02-01-19-14.json | 11 +++++
 .../src/components/Button/ButtonPage.tsx      |  1 -
 .../Button/examples/Button.Action.Example.tsx | 11 ++++-
 .../Button/examples/Button.Anchor.Example.tsx | 11 ++++-
 .../Button/examples/Button.Basic.Example.scss | 14 -------
 .../examples/Button.Basic.Example.styles.ts   | 41 +++++++++++++++++++
 .../examples/Button.Compound.Example.tsx      | 11 ++++-
 .../examples/Button.Default.Example.tsx       | 11 ++++-
 .../Button/examples/Button.Icon.Example.tsx   | 11 ++++-
 .../examples/Button.Primary.Example.tsx       | 11 ++++-
 .../examples/Button.ScreenReader.Example.tsx  | 11 ++++-
 .../Button/examples/Button.Split.Example.tsx  | 11 ++++-
 .../Button/examples/Button.Swap.Example.tsx   | 12 +++++-
 13 files changed, 142 insertions(+), 25 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/ButtonEx-mergestyles_2018-02-01-19-14.json
 delete mode 100644 packages/office-ui-fabric-react/src/components/Button/examples/Button.Basic.Example.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/Button/examples/Button.Basic.Example.styles.ts

diff --git a/common/changes/office-ui-fabric-react/ButtonEx-mergestyles_2018-02-01-19-14.json b/common/changes/office-ui-fabric-react/ButtonEx-mergestyles_2018-02-01-19-14.json
new file mode 100644
index 0000000000000..8b47a90cb51d5
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/ButtonEx-mergestyles_2018-02-01-19-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Converted ButtonBasicExample to use mergeStyles instead of SCSS.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
index ee0ef8aa003cf..0cdcf9100cfc6 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
@@ -20,7 +20,6 @@ import { ButtonSplitExample, ButtonSplitCustomExample } from './examples/Button.
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { Link } from '../../Link';
-import './examples/Button.Basic.Example.scss';
 import * as exampleStylesImport from '../../common/_exampleStyles.scss';
 const exampleStyles: any = exampleStylesImport;
 
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx
index e6365cb5769c9..7dcfd418f4b1f 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx
@@ -1,4 +1,10 @@
 import * as React from 'react';
+import { css, classNamesFunction } from '../../../Utilities';
+import {
+  getStyles,
+  IButtonBasicExampleStyleProps,
+  IButtonBasicExampleStyles
+} from './Button.Basic.Example.styles';
 import {
   ActionButton,
   IButtonProps
@@ -12,8 +18,11 @@ export class ButtonActionExample extends React.Component<IButtonProps> {
   public render() {
     let { disabled, checked } = this.props;
 
+    const getClassNames = classNamesFunction<IButtonBasicExampleStyleProps, IButtonBasicExampleStyles>();
+    const classNames = getClassNames(getStyles);
+
     return (
-      <div className='ms-BasicButtonsExample'>
+      <div className={ css(classNames.example) }>
         <ActionButton
           data-automation-id='test'
           iconProps={ { iconName: 'AddFriend' } }
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
index c2e6e11cbd06a..5490a3a062eb8 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
@@ -1,4 +1,10 @@
 import * as React from 'react';
+import { css, classNamesFunction } from '../../../Utilities';
+import {
+  getStyles,
+  IButtonBasicExampleStyleProps,
+  IButtonBasicExampleStyles
+} from './Button.Basic.Example.styles';
 import {
   IButtonProps,
   DefaultButton
@@ -11,8 +17,11 @@ export class ButtonAnchorExample extends React.Component<IButtonProps> {
   public render() {
     let { disabled, checked } = this.props;
 
+    const getClassNames = classNamesFunction<IButtonBasicExampleStyleProps, IButtonBasicExampleStyles>();
+    const classNames = getClassNames(getStyles);
+
     return (
-      <div className='ms-BasicButtonsExample'>
+      <div className={ css(classNames.example) }>
         <DefaultButton
           data-automation-id='test'
           disabled={ disabled }
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Basic.Example.scss b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Basic.Example.scss
deleted file mode 100644
index 748891141c6c0..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Basic.Example.scss
+++ /dev/null
@@ -1,14 +0,0 @@
-:global {
-  .ms-BasicButtonsExample .ms-Button {
-    margin: 10px 0;
-  }
-  .ms-BasicButtonsTwoUp {
-    display: flex;
-    & > * {
-      flex-grow: 1;
-    }
-    .ms-Label {
-      margin-bottom: 10px;
-    }
-  }
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Basic.Example.styles.ts b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Basic.Example.styles.ts
new file mode 100644
index 0000000000000..dea19c6a76381
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Basic.Example.styles.ts
@@ -0,0 +1,41 @@
+import { IStyle } from '../../../Styling';
+
+export interface IButtonBasicExampleStyleProps {
+  /**
+   * 404 No Style Props Found
+   */
+}
+
+export interface IButtonBasicExampleStyles {
+  example?: IStyle;
+  twoup?: IStyle;
+}
+
+export function getStyles(props: IButtonBasicExampleStyleProps): IButtonBasicExampleStyles {
+  return ({
+    example: [
+      'ms-BasicButtonsExample',
+      {
+        selectors: {
+          '.ms-Button': {
+            margin: '10px 0'
+          }
+        }
+      }
+    ],
+    twoup: [
+      'ms-BasicButtonsTwoUp',
+      {
+        display: 'flex',
+        selectors: {
+          '& > *': {
+            flexGrow: 1
+          },
+          '.ms-Label': {
+            marginBottom: '10px'
+          }
+        }
+      }
+    ]
+  });
+}
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx
index 1c11cbc0a92d4..92c31dded940a 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx
@@ -1,4 +1,10 @@
 import * as React from 'react';
+import { css, classNamesFunction } from '../../../Utilities';
+import {
+  getStyles,
+  IButtonBasicExampleStyleProps,
+  IButtonBasicExampleStyles
+} from './Button.Basic.Example.styles';
 import {
   CompoundButton,
   IButtonProps
@@ -13,8 +19,11 @@ export class ButtonCompoundExample extends React.Component<IButtonProps> {
   public render() {
     let { disabled, checked } = this.props;
 
+    const getClassNames = classNamesFunction<IButtonBasicExampleStyleProps, IButtonBasicExampleStyles>();
+    const classNames = getClassNames(getStyles);
+
     return (
-      <div className='ms-BasicButtonsExample ms-BasicButtonsTwoUp'>
+      <div className={ css(classNames.example, classNames.twoup) }>
         <div>
           <Label>Standard</Label>
           <CompoundButton
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
index 6d2462494958b..c1edb4cdf9e5f 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
@@ -1,4 +1,10 @@
 import * as React from 'react';
+import { css, classNamesFunction } from '../../../Utilities';
+import {
+  getStyles,
+  IButtonBasicExampleStyleProps,
+  IButtonBasicExampleStyles
+} from './Button.Basic.Example.styles';
 import { DefaultButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
 import { Label } from 'office-ui-fabric-react/lib/Label';
 
@@ -6,8 +12,11 @@ export class ButtonDefaultExample extends React.Component<IButtonProps, {}> {
   public render() {
     let { disabled, checked } = this.props;
 
+    const getClassNames = classNamesFunction<IButtonBasicExampleStyleProps, IButtonBasicExampleStyles>();
+    const classNames = getClassNames(getStyles);
+
     return (
-      <div className='ms-BasicButtonsTwoUp'>
+      <div className={ css(classNames.twoup) }>
         <div>
           <Label>Standard</Label>
           <DefaultButton
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx
index 22149f6c4fe4e..88fd480f3c541 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx
@@ -1,4 +1,10 @@
 import * as React from 'react';
+import { css, classNamesFunction } from '../../../Utilities';
+import {
+  getStyles,
+  IButtonBasicExampleStyleProps,
+  IButtonBasicExampleStyles
+} from './Button.Basic.Example.styles';
 import { IconButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
 import { Label } from 'office-ui-fabric-react/lib/Label';
 
@@ -6,8 +12,11 @@ export class ButtonIconExample extends React.Component<IButtonProps> {
   public render() {
     let { disabled, checked } = this.props;
 
+    const getClassNames = classNamesFunction<IButtonBasicExampleStyleProps, IButtonBasicExampleStyles>();
+    const classNames = getClassNames(getStyles);
+
     return (
-      <div className='ms-BasicButtonsExample'>
+      <div className={ css(classNames.example) }>
         <IconButton
           disabled={ disabled }
           checked={ checked }
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
index 235e55dcf04d6..23c09a4f712b2 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
@@ -1,4 +1,10 @@
 import * as React from 'react';
+import { css, classNamesFunction } from '../../../Utilities';
+import {
+  getStyles,
+  IButtonBasicExampleStyleProps,
+  IButtonBasicExampleStyles
+} from './Button.Basic.Example.styles';
 import { PrimaryButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
 import { Label } from 'office-ui-fabric-react/lib/Label';
 
@@ -6,8 +12,11 @@ export class ButtonPrimaryExample extends React.Component<IButtonProps> {
   public render() {
     let { disabled, checked } = this.props;
 
+    const getClassNames = classNamesFunction<IButtonBasicExampleStyleProps, IButtonBasicExampleStyles>();
+    const classNames = getClassNames(getStyles);
+
     return (
-      <div className='ms-BasicButtonsExample'>
+      <div className={ css(classNames.example) }>
         <PrimaryButton
           data-automation-id='test'
           disabled={ disabled }
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx
index 03fc8143da301..8cbef6dc44719 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx
@@ -1,4 +1,10 @@
 import * as React from 'react';
+import { css, classNamesFunction } from '../../../Utilities';
+import {
+  getStyles,
+  IButtonBasicExampleStyleProps,
+  IButtonBasicExampleStyles
+} from './Button.Basic.Example.styles';
 import { PrimaryButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
 import { Label } from 'office-ui-fabric-react/lib/Label';
 
@@ -6,8 +12,11 @@ export class ButtonScreenReaderExample extends React.Component<IButtonProps, {}>
   public render() {
     let { disabled, checked } = this.props;
 
+    const getClassNames = classNamesFunction<IButtonBasicExampleStyleProps, IButtonBasicExampleStyles>();
+    const classNames = getClassNames(getStyles);
+
     return (
-      <div className='ms-BasicButtonsExample'>
+      <div className={ css(classNames.example) }>
         <PrimaryButton
           data-automation-id='test'
           disabled={ disabled }
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
index 8e72b37c6bbb6..2c1d498a523b6 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
@@ -1,4 +1,10 @@
 import * as React from 'react';
+import { css, classNamesFunction } from '../../../Utilities';
+import {
+  getStyles,
+  IButtonBasicExampleStyleProps,
+  IButtonBasicExampleStyles
+} from './Button.Basic.Example.styles';
 import { DefaultButton, IconButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
 import { Label } from 'office-ui-fabric-react/lib/Label';
 import { getCustomSplitButtonStyles } from './Button.Split.Example.styles';
@@ -12,8 +18,11 @@ export class ButtonSplitExample extends React.Component<IButtonProps> {
   public render() {
     let { disabled, checked } = this.props;
 
+    const getClassNames = classNamesFunction<IButtonBasicExampleStyleProps, IButtonBasicExampleStyles>();
+    const classNames = getClassNames(getStyles);
+
     return (
-      <div className='ms-BasicButtonsTwoUp'>
+      <div className={ css(classNames.twoup) }>
         <div>
           <Label>Standard</Label>
           <DefaultButton
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
index 8533e8da7e6ef..2124d506341f0 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
@@ -1,6 +1,11 @@
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
-
+import { css, classNamesFunction } from '../../../Utilities';
+import {
+  getStyles,
+  IButtonBasicExampleStyleProps,
+  IButtonBasicExampleStyles
+} from './Button.Basic.Example.styles';
 import {
   autobind
 } from 'office-ui-fabric-react/lib/Utilities';
@@ -65,8 +70,11 @@ export class ButtonSwapExample extends React.Component<IButtonProps, IButtonSwap
         </DefaultButton>
       );
 
+    const getClassNames = classNamesFunction<IButtonBasicExampleStyleProps, IButtonBasicExampleStyles>();
+    const classNames = getClassNames(getStyles);
+
     return (
-      <div className='ms-BasicButtonsExample'>
+      <div className={ css(classNames.example) }>
         { button }
       </div>
     );

From 7d67c1dc215c25dd3b734e53dc8e9499dded3c17 Mon Sep 17 00:00:00 2001
From: kysedate <35615581+kysedate@users.noreply.github.com>
Date: Tue, 13 Feb 2018 14:54:00 -0800
Subject: [PATCH 1358/1641] ComboBox: Add getClassNames prop to allow complete
 customization of the component (#3754)

* ComboBox: Add getClassNAmes prop to allow complete customization of the component

* rush change
---
 ...ox-getClassNamesProp_2018-01-20-02-14.json | 11 +++++++
 .../src/components/ComboBox/ComboBox.tsx      | 30 ++++++++++++-------
 .../src/components/ComboBox/ComboBox.types.ts | 16 ++++++++++
 3 files changed, 47 insertions(+), 10 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/kysedate-comboBox-getClassNamesProp_2018-01-20-02-14.json

diff --git a/common/changes/office-ui-fabric-react/kysedate-comboBox-getClassNamesProp_2018-01-20-02-14.json b/common/changes/office-ui-fabric-react/kysedate-comboBox-getClassNamesProp_2018-01-20-02-14.json
new file mode 100644
index 0000000000000..9c4b79fc3b8d3
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kysedate-comboBox-getClassNamesProp_2018-01-20-02-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Add getClassNAmes prop to allow complete customization of the component",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kysedate@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index d195d4a57055a..efc9e2c5a11c4 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -284,16 +284,26 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
     let hasErrorMessage = (errorMessage && errorMessage.length > 0) ? true : false;
 
-    this._classNames = getClassNames(
-      getStyles(theme!, customStyles),
-      className!,
-      !!isOpen,
-      !!disabled,
-      !!required,
-      !!focused,
-      !!allowFreeform,
-      !!hasErrorMessage
-    );
+    this._classNames = this.props.getClassNames ?
+      this.props.getClassNames(
+        theme!,
+        !!isOpen,
+        !!disabled,
+        !!required,
+        !!focused,
+        !!allowFreeform,
+        !!hasErrorMessage,
+        className) :
+      getClassNames(
+        getStyles(theme!, customStyles),
+        className!,
+        !!isOpen,
+        !!disabled,
+        !!required,
+        !!focused,
+        !!allowFreeform,
+        !!hasErrorMessage
+      );
 
     return (
       <div { ...divProps } ref='root' className={ this._classNames.container }>
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
index f15c3cb116484..d8380bf22bd0d 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
@@ -4,6 +4,7 @@ import { ISelectableDroppableTextProps } from '../../utilities/selectableOption/
 import { IStyle, ITheme } from '../../Styling';
 import { IButtonStyles } from '../../Button';
 import { IRenderFunction } from '../../Utilities';
+import { IComboBoxClassNames } from './ComboBox.classNames';
 
 export interface IComboBox {
   /**
@@ -101,6 +102,21 @@ export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox>
    */
   styles?: Partial<IComboBoxStyles>;
 
+  /**
+   * Custom function for providing the classNames for the ComboBox. Can be used to provide
+   * all styles for the component instead of applying them on top of the default styles.
+   */
+  getClassNames?: (
+    theme: ITheme,
+    isOpen: boolean,
+    disabled: boolean,
+    required: boolean,
+    focused: boolean,
+    allowFreeForm: boolean,
+    hasErrorMessage: boolean,
+    className?: string
+  ) => IComboBoxClassNames;
+
   /**
    * Styles for the caret down button.
    */

From 0fdbf1d7223ac21dc2775d68f22888aa7759b65a Mon Sep 17 00:00:00 2001
From: kysedate <35615581+kysedate@users.noreply.github.com>
Date: Tue, 13 Feb 2018 14:54:25 -0800
Subject: [PATCH 1359/1641] SpinButton: Add getClassNames prop to allow
 complete customization of the component (#3753)

* SpinButton: Add getClassNames prop to allow complete customization of the component

* rush change
---
 .../master_2018-01-20-01-21.json              | 11 ++++++++++
 .../src/components/SpinButton/SpinButton.tsx  | 21 ++++++++++++-------
 .../components/SpinButton/SpinButton.types.ts | 14 +++++++++++++
 3 files changed, 39 insertions(+), 7 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/master_2018-01-20-01-21.json

diff --git a/common/changes/office-ui-fabric-react/master_2018-01-20-01-21.json b/common/changes/office-ui-fabric-react/master_2018-01-20-01-21.json
new file mode 100644
index 0000000000000..10256a7c238b1
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2018-01-20-01-21.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SpinButton: Add getClassNAmes prop to allow complete customization of the component",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kysedate@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index f219de768ef82..47ee2bfa7d281 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -155,13 +155,20 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
       keyboardSpinDirection
     } = this.state;
 
-    const classNames = getClassNames(
-      getStyles(theme!, customStyles),
-      !!disabled,
-      !!isFocused,
-      keyboardSpinDirection,
-      labelPosition
-    );
+    const classNames = this.props.getClassNames ?
+      this.props.getClassNames(
+        theme!,
+        !!disabled,
+        !!isFocused,
+        keyboardSpinDirection,
+        labelPosition
+      ) : getClassNames(
+        getStyles(theme!, customStyles),
+        !!disabled,
+        !!isFocused,
+        keyboardSpinDirection,
+        labelPosition
+      );
 
     return (
       <div className={ classNames.root }>
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts
index e21a7cc9cadd1..2c0aeedd5dede 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts
@@ -2,6 +2,8 @@ import * as React from 'react';
 import { Position } from '../../utilities/positioning';
 import { IIconProps } from '../../Icon';
 import { ITheme, IStyle } from '../../Styling';
+import { ISpinButtonClassNames } from './SpinButton.classNames';
+import { KeyboardSpinDirection } from './SpinButton';
 import { IButtonStyles } from '../../Button';
 
 export interface ISpinButton {
@@ -136,6 +138,18 @@ export interface ISpinButtonProps {
    */
   styles?: Partial<ISpinButtonStyles>;
 
+  /**
+   * Custom function for providing the classNames for the spinbutton. Can be used to provide
+   * all styles for the component instead of applying them on top of the default styles.
+   */
+  getClassNames?: (
+    theme: ITheme,
+    disabled: boolean,
+    isFocused: boolean,
+    keyboardSpinDirection: KeyboardSpinDirection,
+    labelPosition?: Position
+  ) => ISpinButtonClassNames;
+
   /**
    * Custom styles for the upArrow button.
    *

From 27e230cd7f368d471e0dfceb5e4b11a9ab10354b Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 13 Feb 2018 15:15:47 -0800
Subject: [PATCH 1360/1641] Search box get styles props (#3967)

* Fixed getStyles interface

* Change file
---
 .../searchBox-getStyles-props_2018-02-13-22-46.json   | 11 +++++++++++
 .../src/components/SearchBox/SearchBox.types.ts       |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/searchBox-getStyles-props_2018-02-13-22-46.json

diff --git a/common/changes/office-ui-fabric-react/searchBox-getStyles-props_2018-02-13-22-46.json b/common/changes/office-ui-fabric-react/searchBox-getStyles-props_2018-02-13-22-46.json
new file mode 100644
index 0000000000000..92a797dfc4c62
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/searchBox-getStyles-props_2018-02-13-22-46.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SearchBox: Fixed getStyles interface to be using ISearchBoxStyleProps instead of ISearchBoxProps",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
index 41a04bb516b4a..37d87853caa1f 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
@@ -78,7 +78,7 @@ export interface ISearchBoxProps extends React.InputHTMLAttributes<HTMLInputElem
   /**
    * Call to provide customized styling that will layer on top of the variant rules.
    */
-  getStyles?: IStyleFunction<ISearchBoxProps, ISearchBoxStyles>;
+  getStyles?: IStyleFunction<ISearchBoxStyleProps, ISearchBoxStyles>;
 }
 
 export interface ISearchBoxStyleProps {

From 9e3fa5810fe09e5e7b0b8e6101aab95fc0c04980 Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Tue, 13 Feb 2018 15:37:45 -0800
Subject: [PATCH 1361/1641] Datepicker: Fixing pointer on datepickers with
 input field (#3922)

* no message

* no message

* Adding CSS for pointer when datepicker does not have a label

* change file
---
 ...orr-DatePicker-fixingPointer_2018-02-08-18-46.json | 11 +++++++++++
 .../src/components/DatePicker/DatePicker.scss         |  5 +++++
 2 files changed, 16 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-DatePicker-fixingPointer_2018-02-08-18-46.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-DatePicker-fixingPointer_2018-02-08-18-46.json b/common/changes/office-ui-fabric-react/kegorr-DatePicker-fixingPointer_2018-02-08-18-46.json
new file mode 100644
index 0000000000000..c34dc63ef8a29
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-DatePicker-fixingPointer_2018-02-08-18-46.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DatePicker: Fixing pointer when datepicker doesn't have a label",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss
index bcd809bc56156..2b345f0fc454e 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.scss
@@ -45,5 +45,10 @@
 .eventWithoutLabel {
   @include ms-DatePicker-event();
   top: 7px;
+
+  &:not(.msDatePickerDisabled) {
+    pointer-events: initial;
+    cursor: pointer;
+  }
 }
 

From 711ef243d0212f623a55ebde0d98042f148d81db Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 13 Feb 2018 15:39:59 -0800
Subject: [PATCH 1362/1641] mergeStyles: Global selector support (#3963)

* Adding support for global selectors.

* Adding change file.
---
 ...bal-support-merge-styles_2018-02-13-19-06.json | 11 +++++++++++
 packages/merge-styles/README.md                   | 15 +++++++++++++++
 .../merge-styles/src/styleToClassName.test.ts     | 13 ++++++++++++-
 packages/merge-styles/src/styleToClassName.ts     |  4 +++-
 4 files changed, 41 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/merge-styles/global-support-merge-styles_2018-02-13-19-06.json

diff --git a/common/changes/@uifabric/merge-styles/global-support-merge-styles_2018-02-13-19-06.json b/common/changes/@uifabric/merge-styles/global-support-merge-styles_2018-02-13-19-06.json
new file mode 100644
index 0000000000000..02a74cf75f129
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/global-support-merge-styles_2018-02-13-19-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "mergeStyles: Adding support to register selectors globally. Use `:global(rule)` as the selector to ensure that the unique className is not prepended in the output. See merge-styles README.md for more details.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/merge-styles/README.md b/packages/merge-styles/README.md
index 7cceed7041b16..cfab2d1d51b85 100644
--- a/packages/merge-styles/README.md
+++ b/packages/merge-styles/README.md
@@ -195,6 +195,21 @@ This would register the rules:
 .css-0 .child { background: green; }
 ```
 
+### Global selectors
+
+While we suggest avoiding global selectors, there are some cases which make sense to register things globally. Keep in mind that global selectors can't be guaranteed unique and may suffer from specificity problems and versioning issues in the case that two different versions of your library get rendered on the page.
+
+To register a selector globally, wrap it in a `:global()` wrapper:
+
+```tsx
+{
+  selectors: {
+    ':global(button): {
+      overflow: 'visible'
+    }
+  }
+}
+
 ### Media queries
 
 Media queries can be applied via selectors. For example, this style will produce a class which has a red background when above 600px, and green when at or below 600px:
diff --git a/packages/merge-styles/src/styleToClassName.test.ts b/packages/merge-styles/src/styleToClassName.test.ts
index a46fcaebc337a..022d435384798 100644
--- a/packages/merge-styles/src/styleToClassName.test.ts
+++ b/packages/merge-styles/src/styleToClassName.test.ts
@@ -97,7 +97,7 @@ describe('styleToClassName', () => {
   });
 
   it('does not emit a rule which has an undefined value', () => {
-    expect(styleToClassName({fontFamily: undefined})).toEqual('');
+    expect(styleToClassName({ fontFamily: undefined })).toEqual('');
     expect(_stylesheet.getRules()).toEqual('');
   });
 
@@ -146,6 +146,17 @@ describe('styleToClassName', () => {
     expect(_stylesheet.getRules()).toEqual('.css-0{background:red;}.css-1 > *{background:red;}');
   });
 
+  it('can register global selectors', () => {
+    const className = styleToClassName({
+      selectors: {
+        ':global(button)': { background: 'red' }
+      },
+    });
+
+    expect(className).toEqual('css-0');
+    expect(_stylesheet.getRules()).toEqual('button{background:red;}');
+  });
+
   it('can expand an array of rules', () => {
     styleToClassName([
       { background: 'red' },
diff --git a/packages/merge-styles/src/styleToClassName.ts b/packages/merge-styles/src/styleToClassName.ts
index b1eb495010eea..a9b0e827ce276 100644
--- a/packages/merge-styles/src/styleToClassName.ts
+++ b/packages/merge-styles/src/styleToClassName.ts
@@ -58,7 +58,9 @@ function extractRules(
             if (selectors.hasOwnProperty(newSelector)) {
               const selectorValue = selectors[newSelector];
 
-              if (newSelector.indexOf('@media') === 0) {
+              if (newSelector.indexOf(':global(') === 0) {
+                newSelector = newSelector.replace(/:global\(|\)$/g, '');
+              } else if (newSelector.indexOf('@media') === 0) {
                 newSelector = newSelector + '{' + currentSelector;
               } else if (newSelector.indexOf(':') === 0) {
                 newSelector = currentSelector + newSelector;

From 69854e90a1bc2eb447087df89f5276c166a9d766 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 13 Feb 2018 16:43:56 -0800
Subject: [PATCH 1363/1641] Removing undocumented BaseComponent.onError
 handler. (#3956)

* Removes the default BaseComponent.onError handler and deprecates the feature.

* Adding change file.

* Updating test.
---
 .../fix-error-handling_2018-02-13-02-38.json  | 11 +++
 packages/utilities/src/BaseComponent.test.tsx | 76 -------------------
 packages/utilities/src/BaseComponent.ts       | 26 ++-----
 3 files changed, 17 insertions(+), 96 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/fix-error-handling_2018-02-13-02-38.json

diff --git a/common/changes/@uifabric/utilities/fix-error-handling_2018-02-13-02-38.json b/common/changes/@uifabric/utilities/fix-error-handling_2018-02-13-02-38.json
new file mode 100644
index 0000000000000..ecd2c77dc8674
--- /dev/null
+++ b/common/changes/@uifabric/utilities/fix-error-handling_2018-02-13-02-38.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "BaseComponent.onError default implementation removed, exceptions now simply bubble out which lets partners use React 16 error handling.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/src/BaseComponent.test.tsx b/packages/utilities/src/BaseComponent.test.tsx
index bed1d511f4d9f..75562ec33f226 100644
--- a/packages/utilities/src/BaseComponent.test.tsx
+++ b/packages/utilities/src/BaseComponent.test.tsx
@@ -5,68 +5,7 @@ import * as React from 'react';
 import * as ReactTestUtils from 'react-dom/test-utils';
 import { BaseComponent } from './BaseComponent';
 
-let _originalOnError = BaseComponent.onError;
-
-class TestComponent extends BaseComponent<{}, {}> {
-
-  public componentWillMount(): void {
-    this._createNullRef();
-  }
-
-  public componentDidMount(): void {
-    this._createNullRef();
-  }
-
-  public shouldComponentUpdate(nextProps?: {}, nextState?: {}): boolean {
-    this._createNullRef();
-
-    return true;
-  }
-
-  public componentWillUpdate(): void {
-    this._createNullRef();
-  }
-
-  public componentWillReceiveProps(): void {
-    this._createNullRef();
-  }
-
-  public render(): JSX.Element | null {
-    this._createNullRef();
-    return null;
-  }
-
-  public componentDidUpdate(): void {
-    this._createNullRef();
-  }
-
-  public componentWillUnmount(): void {
-    this._createNullRef();
-  }
-
-  private _createNullRef(): void {
-    // tslint:disable-next-line:no-any
-    let foo: any = null;
-
-    // Calling a null
-    foo();
-  }
-}
-
 describe('BaseComponent', () => {
-  afterEach(() => {
-    BaseComponent.onError = _originalOnError;
-  });
-
-  _buildTestFor('componentWillMount');
-  _buildTestFor('componentDidMount');
-  _buildTestFor('shouldComponentUpdate');
-  _buildTestFor('componentWillUpdate');
-  _buildTestFor('componentWillReceiveProps');
-  _buildTestFor('render');
-  _buildTestFor('componentDidUpdate');
-  _buildTestFor('componentWillUnmount');
-
   it('can resolve refs', () => {
     class Foo extends BaseComponent<{}, {}> {
       public root: HTMLElement;
@@ -84,18 +23,3 @@ describe('BaseComponent', () => {
     expect(component.root).toBeDefined();
   });
 });
-
-function _buildTestFor(methodName: string): void {
-  it(`calls the error logger on ${methodName} exception`, () => {
-    let lastErrorMessage;
-
-    BaseComponent.onError = (errorMessage: string | undefined) => lastErrorMessage = errorMessage;
-
-    let c = new TestComponent({});
-
-    // tslint:disable-next-line:no-any
-    (c as any)[methodName]();
-
-    expect(lastErrorMessage).toBeDefined();
-  });
-}
\ No newline at end of file
diff --git a/packages/utilities/src/BaseComponent.ts b/packages/utilities/src/BaseComponent.ts
index 915e2840fd549..0cfa0445e3cd0 100644
--- a/packages/utilities/src/BaseComponent.ts
+++ b/packages/utilities/src/BaseComponent.ts
@@ -21,8 +21,7 @@ export interface IBaseProps<T = any> {
  */
 export class BaseComponent<P extends IBaseProps = {}, S = {}> extends React.Component<P, S> {
   /**
-   * External consumers should override BaseComponent.onError to hook into error messages that occur from
-   * exceptions thrown from within components.
+   * @deprecated Use React's error boundaries instead.
    */
   // tslint:disable-next-line:no-any
   public static onError: ((errorMessage?: string, ex?: any) => void);
@@ -241,19 +240,11 @@ function _makeSafe(obj: BaseComponent<{}, {}>, prototype: Object, methodName: st
     (obj as any)[methodName] = function (): any {
       let retVal;
 
-      try {
-        if (prototypeMethod) {
-          retVal = prototypeMethod.apply(this, arguments);
-        }
-        if (classMethod !== prototypeMethod) {
-          retVal = classMethod.apply(this, arguments);
-        }
-      } catch (e) {
-        const errorMessage = `Exception in ${obj.className}.${methodName}(): ${typeof e === 'string' ? e : e.stack}`;
-
-        if (BaseComponent.onError) {
-          BaseComponent.onError(errorMessage, e);
-        }
+      if (prototypeMethod) {
+        retVal = prototypeMethod.apply(this, arguments);
+      }
+      if (classMethod !== prototypeMethod) {
+        retVal = classMethod.apply(this, arguments);
       }
 
       return retVal;
@@ -261,11 +252,6 @@ function _makeSafe(obj: BaseComponent<{}, {}>, prototype: Object, methodName: st
   }
 }
 
-BaseComponent.onError = (errorMessage: string) => {
-  console.error(errorMessage);
-  throw errorMessage;
-};
-
 /**
  * Simple constant function for returning null, used to render empty templates in JSX.
  *

From cdd6bafa27a6514e51ffe816ebb89b8a71b63a94 Mon Sep 17 00:00:00 2001
From: amyngu <31973030+amyngu@users.noreply.github.com>
Date: Tue, 13 Feb 2018 17:13:49 -0800
Subject: [PATCH 1364/1641] Suggestions: add "use current input" command
 (#3929)

* add use current input command to suggestions

* update experiments to use new stuff in suggestions

* run gulp change

* fix up basepicker keydown

* move use text input command to before suggestions

* change name to forceResolve

* add comment for return

* rename more vars to forceResolve

* fix break inside else if statement
---
 ...myngu-newSuggestions_2018-02-08-21-28.json |  11 ++
 ...myngu-newSuggestions_2018-02-08-21-28.json |  11 ++
 .../ExtendedPeoplePicker.Basic.Example.tsx    |  33 ++--
 .../FloatingPicker/BaseFloatingPicker.tsx     |  94 ++++++----
 .../BaseFloatingPicker.types.ts               |   7 +-
 .../src/components/pickers/BasePicker.tsx     |  56 ++++--
 .../components/pickers/BasePicker.types.ts    |   4 +
 .../pickers/Suggestions/Suggestions.scss      |   6 +-
 .../pickers/Suggestions/Suggestions.tsx       | 172 +++++++++++++++++-
 .../pickers/Suggestions/Suggestions.types.ts  |  12 ++
 .../Suggestions/SuggestionsController.ts      |   6 +-
 11 files changed, 337 insertions(+), 75 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/amyngu-newSuggestions_2018-02-08-21-28.json
 create mode 100644 common/changes/office-ui-fabric-react/amyngu-newSuggestions_2018-02-08-21-28.json

diff --git a/common/changes/@uifabric/experiments/amyngu-newSuggestions_2018-02-08-21-28.json b/common/changes/@uifabric/experiments/amyngu-newSuggestions_2018-02-08-21-28.json
new file mode 100644
index 0000000000000..3241f919c4946
--- /dev/null
+++ b/common/changes/@uifabric/experiments/amyngu-newSuggestions_2018-02-08-21-28.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Use new \"use current input\" command in Suggestions",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "amyngu@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/amyngu-newSuggestions_2018-02-08-21-28.json b/common/changes/office-ui-fabric-react/amyngu-newSuggestions_2018-02-08-21-28.json
new file mode 100644
index 0000000000000..b9bd42d5e19a4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/amyngu-newSuggestions_2018-02-08-21-28.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add \"use current input command\" and remove need to explicity call focus when moving between suggestions and commands",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "amyngu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
index f7e13e84bba91..36cdd40ed5eb9 100644
--- a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
@@ -22,22 +22,12 @@ export interface IPeoplePickerExampleState {
   mostRecentlyUsed: IPersonaProps[];
 }
 
-const suggestionProps: IBasePickerSuggestionsProps = {
-  suggestionsHeaderText: 'Suggested People',
-  mostRecentlyUsedHeaderText: 'Suggested Contacts',
-  noResultsFoundText: 'No results found',
-  loadingText: 'Loading',
-  showRemoveButtons: true,
-  suggestionsAvailableAlertText: 'People Picker Suggestions available',
-  suggestionsContainerAriaLabel: 'Suggested contacts',
-  searchForMoreText: 'Search more',
-};
-
 // tslint:disable-next-line:no-any
 export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeoplePickerExampleState> {
   private _picker: ExtendedPeoplePicker;
   private _floatingPickerProps: IBaseFloatingPickerProps<IPersonaProps>;
   private _selectedItemsListProps: ISelectedPeopleProps;
+  private _suggestionProps: IBasePickerSuggestionsProps;
 
   constructor(props: {}) {
     super(props);
@@ -54,15 +44,28 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
       mostRecentlyUsed: mru,
     };
 
+    this._suggestionProps = {
+      suggestionsHeaderText: 'Suggested People',
+      mostRecentlyUsedHeaderText: 'Suggested Contacts',
+      noResultsFoundText: 'No results found',
+      loadingText: 'Loading',
+      showRemoveButtons: true,
+      suggestionsAvailableAlertText: 'People Picker Suggestions available',
+      suggestionsContainerAriaLabel: 'Suggested contacts',
+      searchForMoreText: 'Search more',
+      forceResolveText: 'Use this name',
+    };
+
     this._floatingPickerProps = {
       suggestionsController: new SuggestionsController<IPersonaProps>(),
       onResolveSuggestions: this._onFilterChanged,
       getTextFromItem: this._getTextFromItem,
-      pickerSuggestionsProps: suggestionProps,
+      pickerSuggestionsProps: this._suggestionProps,
       key: 'normal',
       onRemoveSuggestion: this._onRemoveSuggestion,
       onValidateInput: this._validateInput,
       onZeroQuerySuggestion: this._returnMostRecentlyUsed,
+      showForceResolve: this._shouldShowForceResolve,
     };
 
     this._selectedItemsListProps = {
@@ -193,6 +196,12 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
     return copyText;
   }
 
+  @autobind
+  private _shouldShowForceResolve(): boolean {
+    return this._validateInput(this._picker.floatingPicker.inputText)
+      && this._picker.floatingPicker.suggestions.length === 0;
+  }
+
   private _listContainsPersona(persona: IPersonaProps, personas: IPersonaProps[]): boolean {
     if (!personas || !personas.length || personas.length === 0) {
       return false;
diff --git a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
index a7da08048a00a..d682d8dc5dd57 100644
--- a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
+++ b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
@@ -54,6 +54,15 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
     };
   }
 
+  public get inputText(): string {
+    return this.state.queryString;
+  }
+
+  // tslint:disable-next-line:no-any
+  public get suggestions(): any[] {
+    return this.suggestionStore.suggestions;
+  }
+
   public forceResolveSuggestion(): void {
     if (this.suggestionStore.hasSelectedSuggestion()) {
       this.completeSuggestion();
@@ -87,7 +96,6 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
     this.setState({
       suggestionsVisible: false,
     });
-    console.log('hidepicker');
   }
 
   public showPicker(): void {
@@ -129,12 +137,14 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
 
   @autobind
   public refocusSuggestions(keyCode: KeyCodes): void {
-    if (keyCode === KeyCodes.up) {
-      this.suggestionStore.setSelectedSuggestion(
-        this.suggestionStore.suggestions.length - 1
-      );
-    } else if (keyCode === KeyCodes.down) {
-      this.suggestionStore.setSelectedSuggestion(0);
+    if (this.suggestionStore.suggestions && this.suggestionStore.suggestions.length > 0) {
+      if (keyCode === KeyCodes.up) {
+        this.suggestionStore.setSelectedSuggestion(
+          this.suggestionStore.suggestions.length - 1
+        );
+      } else if (keyCode === KeyCodes.down) {
+        this.suggestionStore.setSelectedSuggestion(0);
+      }
     }
   }
 
@@ -169,6 +179,8 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
         calloutWidth={ this.props.calloutWidth ? this.props.calloutWidth : 0 }
       >
         <TypedSuggestion
+          showForceResolve={ this._showForceResolve }
+          createGenericItem={ this._onValidateInput }
           onRenderSuggestion={ this.props.onRenderSuggestionsItem }
           onSuggestionClick={ this.onSuggestionClick }
           onSuggestionRemove={ this.onSuggestionRemove }
@@ -341,7 +353,8 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
         !(this.props.inputElement as HTMLElement).contains(ev.target as HTMLElement))) {
       return;
     }
-    switch (ev.which) {
+    let keyCode = ev.which;
+    switch (keyCode) {
       case KeyCodes.escape:
         this.setState({ suggestionsVisible: false });
         ev.preventDefault();
@@ -350,8 +363,9 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
 
       case KeyCodes.tab:
       case KeyCodes.enter:
-        if (
-          !ev.shiftKey &&
+        if (this.suggestionElement.hasSuggestedActionSelected()) {
+          this.suggestionElement.executeSelectedAction();
+        } else if (!ev.shiftKey &&
           !ev.ctrlKey &&
           this.suggestionStore.hasSelectedSuggestion()) {
           this.completeSuggestion();
@@ -378,38 +392,49 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
         break;
 
       case KeyCodes.up:
-        if (
-          this.state.moreSuggestionsAvailable &&
-          this.suggestionElement.props.searchForMoreText &&
-          this.suggestionStore.currentIndex === 0
-        ) {
-          this.suggestionElement.focusSearchForMoreButton();
-          this.suggestionStore.deselectAllSuggestions();
-          this.forceUpdate();
+        if (this.suggestionElement.tryHandleKeyDown(keyCode, this.suggestionStore.currentIndex)) {
+          ev.preventDefault();
+          ev.stopPropagation();
         } else {
-          if (this.suggestionStore.previousSuggestion()) {
+          if (this.suggestionElement.hasSuggestedAction() &&
+            this.suggestionStore.currentIndex === 0
+          ) {
             ev.preventDefault();
             ev.stopPropagation();
-            this.onSuggestionSelect();
+            this.suggestionElement.focusAboveSuggestions();
+            this.suggestionStore.deselectAllSuggestions();
+            this.forceUpdate();
+          } else {
+            if (this.suggestionStore.previousSuggestion()) {
+              ev.preventDefault();
+              ev.stopPropagation();
+              this.onSuggestionSelect();
+            }
           }
         }
         break;
 
       case KeyCodes.down:
-        if (
-          this.state.moreSuggestionsAvailable &&
-          this.suggestionElement.props.searchForMoreText &&
-          this.suggestionStore.currentIndex + 1 ===
-          this.suggestionStore.suggestions.length
-        ) {
-          this.suggestionElement.focusSearchForMoreButton();
-          this.suggestionStore.deselectAllSuggestions();
-          this.forceUpdate();
+        if (this.suggestionElement.tryHandleKeyDown(keyCode, this.suggestionStore.currentIndex)) {
+          ev.preventDefault();
+          ev.stopPropagation();
         } else {
-          if (this.suggestionStore.nextSuggestion()) {
+          if (
+            this.suggestionElement.hasSuggestedAction() &&
+            this.suggestionStore.currentIndex + 1 ===
+            this.suggestionStore.suggestions.length
+          ) {
             ev.preventDefault();
             ev.stopPropagation();
-            this.onSuggestionSelect();
+            this.suggestionElement.focusBelowSuggestions();
+            this.suggestionStore.deselectAllSuggestions();
+            this.forceUpdate();
+          } else {
+            if (this.suggestionStore.nextSuggestion()) {
+              ev.preventDefault();
+              ev.stopPropagation();
+              this.onSuggestionSelect();
+            }
           }
         }
         break;
@@ -463,10 +488,10 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
     this.updateSuggestionsList(suggestions, updatedValue);
   }
 
+  @autobind
   private _onValidateInput(): void {
     if (
       this.props.onValidateInput &&
-      (this.props.onValidateInput as ((input: string) => boolean))(this.state.queryString) !== true &&
       this.props.createGenericItem
     ) {
       let itemToConvert = (this.props.createGenericItem as ((
@@ -481,6 +506,11 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
     }
   }
 
+  @autobind
+  private _showForceResolve(): boolean {
+    return this.props.showForceResolve ? this.props.showForceResolve() : false;
+  }
+
   private _getTextFromItem(item: T, currentValue?: string): string {
     if (this.props.getTextFromItem) {
       return (this.props.getTextFromItem as ((item: T, currentValue?: string) => string))(item, currentValue);
diff --git a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts
index 88669257e1275..7261231864356 100644
--- a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts
+++ b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts
@@ -98,6 +98,11 @@ export interface IBaseFloatingPickerProps<T> extends React.Props<any> {
     isValid: boolean
   ) => ISuggestionModel<T>;
 
+  /**
+   * The callback that should be called to see if the force resolve command should be shown
+   */
+  showForceResolve?: () => boolean;
+
   /**
    * The items that the base picker should currently display as selected. If this is provided then the picker will act as a controlled
    * component.
@@ -113,4 +118,4 @@ export interface IBaseFloatingPickerProps<T> extends React.Props<any> {
    * Width for the suggestions callout
    */
   calloutWidth?: number;
-}
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index b5473a5469811..649e214b2e89a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -155,10 +155,12 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   @autobind
   public refocusSuggestions(keyCode: KeyCodes) {
     this.resetFocus();
-    if (keyCode === KeyCodes.up) {
-      this.suggestionStore.setSelectedSuggestion(this.suggestionStore.suggestions.length - 1);
-    } else if (keyCode === KeyCodes.down) {
-      this.suggestionStore.setSelectedSuggestion(0);
+    if (this.suggestionStore.suggestions && this.suggestionStore.suggestions.length > 0) {
+      if (keyCode === KeyCodes.up) {
+        this.suggestionStore.setSelectedSuggestion(this.suggestionStore.suggestions.length - 1);
+      } else if (keyCode === KeyCodes.down) {
+        this.suggestionStore.setSelectedSuggestion(0);
+      }
     }
   }
 
@@ -443,7 +445,8 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   @autobind
   protected onKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
-    switch (ev.which) {
+    let keyCode = ev.which;
+    switch (keyCode) {
       case KeyCodes.escape:
         if (this.state.suggestionsVisible) {
           this.setState({ suggestionsVisible: false });
@@ -454,7 +457,9 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
       case KeyCodes.tab:
       case KeyCodes.enter:
-        if (!ev.shiftKey && this.suggestionStore.hasSelectedSuggestion() && this.state.suggestionsVisible) {
+        if (this.suggestionElement.hasSuggestedActionSelected()) {
+          this.suggestionElement.executeSelectedAction();
+        } else if (!ev.shiftKey && this.suggestionStore.hasSelectedSuggestion() && this.state.suggestionsVisible) {
           this.completeSuggestion();
           ev.preventDefault();
           ev.stopPropagation();
@@ -488,15 +493,22 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
       case KeyCodes.up:
         if (ev.target === this.input.inputElement && this.state.suggestionsVisible) {
-          if (this.state.moreSuggestionsAvailable && this.suggestionElement.props.searchForMoreText && this.suggestionStore.currentIndex === 0) {
-            this.suggestionElement.focusSearchForMoreButton();
-            this.suggestionStore.deselectAllSuggestions();
-            this.forceUpdate();
+          if (this.suggestionElement.tryHandleKeyDown(keyCode, this.suggestionStore.currentIndex)) {
+            ev.preventDefault();
+            ev.stopPropagation();
           } else {
-            if (this.suggestionStore.previousSuggestion()) {
+            if (this.suggestionElement.hasSuggestedAction() && this.suggestionStore.currentIndex === 0) {
               ev.preventDefault();
               ev.stopPropagation();
-              this.onSuggestionSelect();
+              this.suggestionElement.focusAboveSuggestions();
+              this.suggestionStore.deselectAllSuggestions();
+              this.forceUpdate();
+            } else {
+              if (this.suggestionStore.previousSuggestion()) {
+                ev.preventDefault();
+                ev.stopPropagation();
+                this.onSuggestionSelect();
+              }
             }
           }
         }
@@ -504,18 +516,24 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
       case KeyCodes.down:
         if (ev.target === this.input.inputElement && this.state.suggestionsVisible) {
-          if (this.state.moreSuggestionsAvailable && this.suggestionElement.props.searchForMoreText && (this.suggestionStore.currentIndex + 1) === this.suggestionStore.suggestions.length) {
-            this.suggestionElement.focusSearchForMoreButton();
-            this.suggestionStore.deselectAllSuggestions();
-            this.forceUpdate();
+          if (this.suggestionElement.tryHandleKeyDown(keyCode, this.suggestionStore.currentIndex)) {
+            ev.preventDefault();
+            ev.stopPropagation();
           } else {
-            if (this.suggestionStore.nextSuggestion()) {
+            if (this.suggestionElement.hasSuggestedAction() && (this.suggestionStore.currentIndex + 1) === this.suggestionStore.suggestions.length) {
               ev.preventDefault();
               ev.stopPropagation();
-              this.onSuggestionSelect();
+              this.suggestionElement.focusBelowSuggestions();
+              this.suggestionStore.deselectAllSuggestions();
+              this.forceUpdate();
+            } else {
+              if (this.suggestionStore.nextSuggestion()) {
+                ev.preventDefault();
+                ev.stopPropagation();
+                this.onSuggestionSelect();
+              }
             }
           }
-
         }
         break;
     }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts
index 4e15c252db4ca..d8841b5265c0f 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts
@@ -162,6 +162,10 @@ export interface IBasePickerSuggestionsProps {
    * The text that should appear on the button to search for more.
    */
   searchForMoreText?: string;
+  /**
+   * The text that appears indicating to the use to force resolve the input
+   */
+  forceResolveText?: string;
   /**
    * The text to display while the results are loading.
    */
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
index 350d4ca0aa812..c8a4d6fe6eb52 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.scss
@@ -61,7 +61,7 @@
   }
 }
 
-.searchMoreButton {
+.actionButton {
   background: none;
   border: 0;
   cursor: pointer;
@@ -93,6 +93,10 @@
   }
 }
 
+.buttonSelected {
+  background-color: $ms-color-themeLight;
+}
+
 .suggestionsTitle {
   padding: 0 12px;
   color: $ms-color-themePrimary;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index cf07bd537d4df..229057ebde17a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -11,6 +11,16 @@ import { ISuggestionItemProps, ISuggestionsProps } from './Suggestions.types';
 import * as stylesImport from './Suggestions.scss';
 const styles: any = stylesImport;
 
+export enum SuggestionActionType {
+  none,
+  forceResolve,
+  searchMore,
+}
+
+export interface ISuggestionsState {
+  selectedActionType: SuggestionActionType;
+}
+
 export class SuggestionsItem<T> extends BaseComponent<ISuggestionItemProps<T>, {}> {
   public render() {
     let {
@@ -51,14 +61,18 @@ export class SuggestionsItem<T> extends BaseComponent<ISuggestionItemProps<T>, {
   }
 }
 
-export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
+export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggestionsState> {
 
+  protected _forceResolveButton: IButton;
   protected _searchForMoreButton: IButton;
   protected _selectedElement: HTMLDivElement;
   private SuggestionsItemOfProperType = SuggestionsItem as new (props: ISuggestionItemProps<T>) => SuggestionsItem<T>;
 
   constructor(suggestionsProps: ISuggestionsProps<T>) {
     super(suggestionsProps);
+    this.state = {
+      selectedActionType: SuggestionActionType.none,
+    };
   }
 
   public componentDidUpdate() {
@@ -67,6 +81,9 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
 
   public render() {
     let {
+      forceResolveText,
+      createGenericItem,
+      showForceResolve,
       mostRecentlyUsedHeaderText,
       searchForMoreText,
       className,
@@ -83,7 +100,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
       resultsFooterFull,
       resultsFooter,
       suggestionsAvailableAlertText,
-      suggestionsHeaderText
+      suggestionsHeaderText,
     } = this.props;
 
     let noResults = () => {
@@ -100,6 +117,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
       headerText = mostRecentlyUsedHeaderText;
     }
     let footerTitle = (suggestions.length >= (resultsMaximumNumber as number)) ? resultsFooterFull : resultsFooter;
+    let hasNoSuggestions = (!suggestions || !suggestions.length) && !isLoading;
     return (
       <div
         className={ css(
@@ -111,22 +129,41 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
           (<div className={ css('ms-Suggestions-title', styles.suggestionsTitle) }>
             { headerText }
           </div>) : (null) }
+        { forceResolveText && this._shouldShowForceResolve() && (
+          <CommandButton
+            componentRef={ this._resolveRef('_forceResolveButton') }
+            className={ css(
+              'ms-forceResolve-button',
+              styles.actionButton,
+              {
+                ['is-selected ' + styles.buttonSelected]:
+                this.state.selectedActionType === SuggestionActionType.forceResolve
+              }) }
+            onClick={ this._forceResolve }
+          >
+            { forceResolveText }
+          </CommandButton>
+        ) }
         { isLoading && (
           <Spinner
             className={ css('ms-Suggestions-spinner', styles.suggestionsSpinner) }
             label={ loadingText }
           />) }
-        { (!suggestions || !suggestions.length) && !isLoading ?
+        { hasNoSuggestions ?
           (onRenderNoResultFound ? onRenderNoResultFound(undefined, noResults) : noResults()) :
           this._renderSuggestions()
         }
         { searchForMoreText && moreSuggestionsAvailable && (
           <CommandButton
             componentRef={ this._resolveRef('_searchForMoreButton') }
-            className={ css('ms-SearchMore-button', styles.searchMoreButton) }
+            className={ css('ms-SearchMore-button',
+              styles.actionButton,
+              {
+                ['is-selected ' + styles.buttonSelected]:
+                this.state.selectedActionType === SuggestionActionType.searchMore
+              }) }
             iconProps={ { iconName: 'Search' } }
             onClick={ this._getMoreResults }
-            onKeyDown={ this._onKeyDown }
           >
             { searchForMoreText }
           </CommandButton>
@@ -155,6 +192,113 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
     );
   }
 
+  /**
+   * Returns true if the event was handled, false otherwise
+   */
+  @autobind
+  public tryHandleKeyDown(keyCode: number, currentSuggestionIndex: number): boolean {
+    let isEventHandled = false;
+    let newSelectedActionType = null;
+    let currentSelectedAction = this.state.selectedActionType;
+    let suggestionLength = this.props.suggestions.length;
+    if (keyCode === KeyCodes.down) {
+      switch (currentSelectedAction) {
+        case SuggestionActionType.forceResolve:
+          if (suggestionLength > 0) {
+            this._refocusOnSuggestions(keyCode);
+            newSelectedActionType = SuggestionActionType.none;
+          } else if (this._searchForMoreButton) {
+            newSelectedActionType = SuggestionActionType.searchMore;
+          } else {
+            newSelectedActionType = SuggestionActionType.forceResolve;
+          }
+          break;
+        case SuggestionActionType.searchMore:
+          if (this._forceResolveButton) {
+            newSelectedActionType = SuggestionActionType.forceResolve;
+          } else if (suggestionLength > 0) {
+            this._refocusOnSuggestions(keyCode);
+            newSelectedActionType = SuggestionActionType.none;
+          } else {
+            newSelectedActionType = SuggestionActionType.searchMore;
+          }
+          break;
+        case SuggestionActionType.none:
+          if (currentSuggestionIndex === -1 && this._forceResolveButton) {
+            newSelectedActionType = SuggestionActionType.forceResolve;
+          }
+          break;
+      }
+    } else if (keyCode === KeyCodes.up) {
+      switch (currentSelectedAction) {
+        case SuggestionActionType.forceResolve:
+          if (this._searchForMoreButton) {
+            newSelectedActionType = SuggestionActionType.searchMore;
+          } else if (suggestionLength > 0) {
+            this._refocusOnSuggestions(keyCode);
+            newSelectedActionType = SuggestionActionType.none;
+          }
+          break;
+        case SuggestionActionType.searchMore:
+          if (suggestionLength > 0) {
+            this._refocusOnSuggestions(keyCode);
+            newSelectedActionType = SuggestionActionType.none;
+          } else if (this._forceResolveButton) {
+            newSelectedActionType = SuggestionActionType.forceResolve;
+          }
+          break;
+        case SuggestionActionType.none:
+          if (currentSuggestionIndex === -1 && this._searchForMoreButton) {
+            newSelectedActionType = SuggestionActionType.searchMore;
+          }
+          break;
+      }
+    }
+
+    if (newSelectedActionType !== null) {
+      this.setState({ selectedActionType: newSelectedActionType });
+      isEventHandled = true;
+    }
+
+    return isEventHandled;
+  }
+
+  public hasSuggestedAction(): boolean {
+    return this._searchForMoreButton !== undefined || this._forceResolveButton !== undefined;
+  }
+
+  public hasSuggestedActionSelected(): boolean {
+    return (this.state.selectedActionType !== SuggestionActionType.none);
+  }
+
+  public executeSelectedAction(): void {
+    switch (this.state.selectedActionType) {
+      case SuggestionActionType.forceResolve:
+        this._forceResolve();
+        break;
+      case SuggestionActionType.searchMore:
+        this._getMoreResults();
+        break;
+    }
+  }
+
+  public focusAboveSuggestions(): void {
+    let newSelectedActionType = null;
+    if (this._forceResolveButton) {
+      this.setState({ selectedActionType: SuggestionActionType.forceResolve });
+    } else if (this._searchForMoreButton) {
+      this.setState({ selectedActionType: SuggestionActionType.searchMore });
+    }
+  }
+
+  public focusBelowSuggestions(): void {
+    if (this._searchForMoreButton) {
+      this.setState({ selectedActionType: SuggestionActionType.searchMore });
+    } else if (this._forceResolveButton) {
+      this.setState({ selectedActionType: SuggestionActionType.forceResolve });
+    }
+  }
+
   public focusSearchForMoreButton() {
     if (this._searchForMoreButton) {
       this._searchForMoreButton.focus();
@@ -218,6 +362,18 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
     }
   }
 
+  @autobind
+  private _forceResolve() {
+    if (this.props.createGenericItem) {
+      this.props.createGenericItem();
+    }
+  }
+
+  @autobind
+  private _shouldShowForceResolve() {
+    return this.props.showForceResolve ? this.props.showForceResolve() : false;
+  }
+
   @autobind
   private _onClickTypedSuggestionsItem(item: T, index: number): (ev: React.MouseEvent<HTMLElement>) => void {
     return (ev: React.MouseEvent<HTMLElement>): void => {
@@ -226,9 +382,9 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, {}> {
   }
 
   @autobind
-  private _onKeyDown(ev: React.KeyboardEvent<HTMLButtonElement>) {
-    if ((ev.keyCode === KeyCodes.up || ev.keyCode === KeyCodes.down) && typeof this.props.refocusSuggestions === 'function') {
-      this.props.refocusSuggestions(ev.keyCode);
+  private _refocusOnSuggestions(keyCode: number): void {
+    if (typeof this.props.refocusSuggestions === 'function') {
+      this.props.refocusSuggestions(keyCode);
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.types.ts b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.types.ts
index 7874e3626641d..10f711966da78 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.types.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.types.ts
@@ -41,6 +41,18 @@ export interface ISuggestionsProps<T> extends React.Props<any> {
    * The callback that should be called when the user attempts to get more results
    */
   onGetMoreResults?: () => void;
+  /**
+   * The text that appears indicating to the use to force resolve the input
+   */
+  forceResolveText?: string;
+  /**
+   * The callback that should be called to see if the force resolve command should be shown
+   */
+  showForceResolve?: () => boolean;
+  /**
+   * The callback that should be called when the user attempts to use the input text as as item
+   */
+  createGenericItem?: () => void;
   /**
    * The CSS classname of the suggestions list.
    */
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
index d35720a8a6c71..14b30cd849f8d 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
@@ -97,8 +97,10 @@ export class SuggestionsController<T> {
   }
 
   public deselectAllSuggestions(): void {
-    this.suggestions[this.currentIndex].selected = false;
-    this.currentIndex = -1;
+    if (this.currentIndex > -1) {
+      this.suggestions[this.currentIndex].selected = false;
+      this.currentIndex = -1;
+    }
   }
 
   public setSelectedSuggestion(index: number): void {

From cd1d7afb76421fbc3c744bc61c81ddffceafd0af Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Tue, 13 Feb 2018 18:26:00 -0800
Subject: [PATCH 1365/1641] Fabric button overflow (#3970)

* Added global button overflow visible stles

* change file
---
 .../fabric-button-overflow_2018-02-14-00-59.json      | 11 +++++++++++
 .../src/components/Fabric/Fabric.classNames.ts        |  5 ++++-
 2 files changed, 15 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/fabric-button-overflow_2018-02-14-00-59.json

diff --git a/common/changes/office-ui-fabric-react/fabric-button-overflow_2018-02-14-00-59.json b/common/changes/office-ui-fabric-react/fabric-button-overflow_2018-02-14-00-59.json
new file mode 100644
index 0000000000000..1324790d38767
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fabric-button-overflow_2018-02-14-00-59.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fabric: Adds button overflow visible global style so that ie11 renders like edge/chrome/firefox",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.classNames.ts b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.classNames.ts
index 6b369e3d14bd4..d9aa02390c9a7 100644
--- a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.classNames.ts
@@ -30,7 +30,10 @@ export const getClassNames = memoizeFunction((
         selectors: {
           '& button': inheritFont,
           '& input': inheritFont,
-          '& textarea': inheritFont
+          '& textarea': inheritFont,
+          ':global(button)': {
+            overflow: 'visible'
+          }
         }
       }
     ])

From 8b573a64f3d9f4e3dbd17b1f90788ab8fffd6185 Mon Sep 17 00:00:00 2001
From: Mark Polak <mark@thedutchies.com>
Date: Wed, 14 Feb 2018 03:41:33 +0100
Subject: [PATCH 1366/1641] Remove classes optional typings (#3894)

* Use partials instead of ?

* Add npm change file

* Use as IColorClassNames to omit partials.

* Update remove-classes-optional-typings_2018-02-06-18-28.json

* Update remove-classes-optional-typings_2018-02-06-18-28.json
---
 ...ses-optional-typings_2018-02-06-18-28.json |  11 +
 .../styling/src/classNames/ColorClassNames.ts | 578 +++++++++---------
 .../styling/src/interfaces/IFontStyles.ts     |  22 +-
 packages/styling/src/styles/DefaultPalette.ts |   1 +
 4 files changed, 312 insertions(+), 300 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/remove-classes-optional-typings_2018-02-06-18-28.json

diff --git a/common/changes/@uifabric/styling/remove-classes-optional-typings_2018-02-06-18-28.json b/common/changes/@uifabric/styling/remove-classes-optional-typings_2018-02-06-18-28.json
new file mode 100644
index 0000000000000..1e989a2bfcdb5
--- /dev/null
+++ b/common/changes/@uifabric/styling/remove-classes-optional-typings_2018-02-06-18-28.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "Adjusting IColorClassNames and IFontStyles to remove the optional part for the members, to make the interfaces easier to consume.",
+      "packageName": "@uifabric/styling",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "mark@thedutchies.com"
+}
diff --git a/packages/styling/src/classNames/ColorClassNames.ts b/packages/styling/src/classNames/ColorClassNames.ts
index 44ed67ef8bf6a..eec694625c47e 100644
--- a/packages/styling/src/classNames/ColorClassNames.ts
+++ b/packages/styling/src/classNames/ColorClassNames.ts
@@ -6,297 +6,297 @@ import { DefaultPalette } from '../styles/DefaultPalette';
 import { getTheme } from '../styles/index';
 
 export interface IColorClassNames {
-  themeDarker?: string;
-  themeDarkerHover?: string;
-  themeDarkerBackground?: string;
-  themeDarkerBackgroundHover?: string;
-  themeDarkerBorder?: string;
-  themeDarkerBorderHover?: string;
-  themeDark?: string;
-  themeDarkHover?: string;
-  themeDarkBackground?: string;
-  themeDarkBackgroundHover?: string;
-  themeDarkBorder?: string;
-  themeDarkBorderHover?: string;
-  themeDarkAlt?: string;
-  themeDarkAltHover?: string;
-  themeDarkAltBackground?: string;
-  themeDarkAltBackgroundHover?: string;
-  themeDarkAltBorder?: string;
-  themeDarkAltBorderHover?: string;
-  themePrimary?: string;
-  themePrimaryHover?: string;
-  themePrimaryBackground?: string;
-  themePrimaryBackgroundHover?: string;
-  themePrimaryBorder?: string;
-  themePrimaryBorderHover?: string;
-  themeSecondary?: string;
-  themeSecondaryHover?: string;
-  themeSecondaryBackground?: string;
-  themeSecondaryBackgroundHover?: string;
-  themeSecondaryBorder?: string;
-  themeSecondaryBorderHover?: string;
-  themeTertiary?: string;
-  themeTertiaryHover?: string;
-  themeTertiaryBackground?: string;
-  themeTertiaryBackgroundHover?: string;
-  themeTertiaryBorder?: string;
-  themeTertiaryBorderHover?: string;
-  themeLight?: string;
-  themeLightHover?: string;
-  themeLightBackground?: string;
-  themeLightBackgroundHover?: string;
-  themeLightBorder?: string;
-  themeLightBorderHover?: string;
-  themeLighter?: string;
-  themeLighterHover?: string;
-  themeLighterBackground?: string;
-  themeLighterBackgroundHover?: string;
-  themeLighterBorder?: string;
-  themeLighterBorderHover?: string;
-  themeLighterAlt?: string;
-  themeLighterAltHover?: string;
-  themeLighterAltBackground?: string;
-  themeLighterAltBackgroundHover?: string;
-  themeLighterAltBorder?: string;
-  themeLighterAltBorderHover?: string;
-  black?: string;
-  blackHover?: string;
-  blackBackground?: string;
-  blackBackgroundHover?: string;
-  blackBorder?: string;
-  blackBorderHover?: string;
-  blackTranslucent40?: string;
-  blackTranslucent40Hover?: string;
-  blackTranslucent40Background?: string;
-  blackTranslucent40BackgroundHover?: string;
-  blackTranslucent40Border?: string;
-  blackTranslucent40BorderHover?: string;
-  neutralDark?: string;
-  neutralDarkHover?: string;
-  neutralDarkBackground?: string;
-  neutralDarkBackgroundHover?: string;
-  neutralDarkBorder?: string;
-  neutralDarkBorderHover?: string;
-  neutralPrimary?: string;
-  neutralPrimaryHover?: string;
-  neutralPrimaryBackground?: string;
-  neutralPrimaryBackgroundHover?: string;
-  neutralPrimaryBorder?: string;
-  neutralPrimaryBorderHover?: string;
-  neutralPrimaryAlt?: string;
-  neutralPrimaryAltHover?: string;
-  neutralPrimaryAltBackground?: string;
-  neutralPrimaryAltBackgroundHover?: string;
-  neutralPrimaryAltBorder?: string;
-  neutralPrimaryAltBorderHover?: string;
-  neutralSecondary?: string;
-  neutralSecondaryHover?: string;
-  neutralSecondaryBackground?: string;
-  neutralSecondaryBackgroundHover?: string;
-  neutralSecondaryBorder?: string;
-  neutralSecondaryBorderHover?: string;
-  neutralSecondaryAlt?: string;
-  neutralSecondaryAltHover?: string;
-  neutralSecondaryAltBackground?: string;
-  neutralSecondaryAltBackgroundHover?: string;
-  neutralSecondaryAltBorder?: string;
-  neutralSecondaryAltBorderHover?: string;
-  neutralTertiary?: string;
-  neutralTertiaryHover?: string;
-  neutralTertiaryBackground?: string;
-  neutralTertiaryBackgroundHover?: string;
-  neutralTertiaryBorder?: string;
-  neutralTertiaryBorderHover?: string;
-  neutralTertiaryAlt?: string;
-  neutralTertiaryAltHover?: string;
-  neutralTertiaryAltBackground?: string;
-  neutralTertiaryAltBackgroundHover?: string;
-  neutralTertiaryAltBorder?: string;
-  neutralTertiaryAltBorderHover?: string;
-  neutralQuaternary?: string;
-  neutralQuaternaryHover?: string;
-  neutralQuaternaryBackground?: string;
-  neutralQuaternaryBackgroundHover?: string;
-  neutralQuaternaryBorder?: string;
-  neutralQuaternaryBorderHover?: string;
-  neutralQuaternaryAlt?: string;
-  neutralQuaternaryAltHover?: string;
-  neutralQuaternaryAltBackground?: string;
-  neutralQuaternaryAltBackgroundHover?: string;
-  neutralQuaternaryAltBorder?: string;
-  neutralQuaternaryAltBorderHover?: string;
-  neutralLight?: string;
-  neutralLightHover?: string;
-  neutralLightBackground?: string;
-  neutralLightBackgroundHover?: string;
-  neutralLightBorder?: string;
-  neutralLightBorderHover?: string;
-  neutralLighter?: string;
-  neutralLighterHover?: string;
-  neutralLighterBackground?: string;
-  neutralLighterBackgroundHover?: string;
-  neutralLighterBorder?: string;
-  neutralLighterBorderHover?: string;
-  neutralLighterAlt?: string;
-  neutralLighterAltHover?: string;
-  neutralLighterAltBackground?: string;
-  neutralLighterAltBackgroundHover?: string;
-  neutralLighterAltBorder?: string;
-  neutralLighterAltBorderHover?: string;
-  white?: string;
-  whiteHover?: string;
-  whiteBackground?: string;
-  whiteBackgroundHover?: string;
-  whiteBorder?: string;
-  whiteBorderHover?: string;
-  whiteTranslucent40?: string;
-  whiteTranslucent40Hover?: string;
-  whiteTranslucent40Background?: string;
-  whiteTranslucent40BackgroundHover?: string;
-  whiteTranslucent40Border?: string;
-  whiteTranslucent40BorderHover?: string;
-  yellow?: string;
-  yellowHover?: string;
-  yellowBackground?: string;
-  yellowBackgroundHover?: string;
-  yellowBorder?: string;
-  yellowBorderHover?: string;
-  yellowLight?: string;
-  yellowLightHover?: string;
-  yellowLightBackground?: string;
-  yellowLightBackgroundHover?: string;
-  yellowLightBorder?: string;
-  yellowLightBorderHover?: string;
-  orange?: string;
-  orangeHover?: string;
-  orangeBackground?: string;
-  orangeBackgroundHover?: string;
-  orangeBorder?: string;
-  orangeBorderHover?: string;
-  orangeLight?: string;
-  orangeLightHover?: string;
-  orangeLightBackground?: string;
-  orangeLightBackgroundHover?: string;
-  orangeLightBorder?: string;
-  orangeLightBorderHover?: string;
-  orangeLighter?: string;
-  orangeLighterHover?: string;
-  orangeLighterBackground?: string;
-  orangeLighterBackgroundHover?: string;
-  orangeLighterBorder?: string;
-  orangeLighterBorderHover?: string;
-  redDark?: string;
-  redDarkHover?: string;
-  redDarkBackground?: string;
-  redDarkBackgroundHover?: string;
-  redDarkBorder?: string;
-  redDarkBorderHover?: string;
-  red?: string;
-  redHover?: string;
-  redBackground?: string;
-  redBackgroundHover?: string;
-  redBorder?: string;
-  redBorderHover?: string;
-  magentaDark?: string;
-  magentaDarkHover?: string;
-  magentaDarkBackground?: string;
-  magentaDarkBackgroundHover?: string;
-  magentaDarkBorder?: string;
-  magentaDarkBorderHover?: string;
-  magenta?: string;
-  magentaHover?: string;
-  magentaBackground?: string;
-  magentaBackgroundHover?: string;
-  magentaBorder?: string;
-  magentaBorderHover?: string;
-  magentaLight?: string;
-  magentaLightHover?: string;
-  magentaLightBackground?: string;
-  magentaLightBackgroundHover?: string;
-  magentaLightBorder?: string;
-  magentaLightBorderHover?: string;
-  purpleDark?: string;
-  purpleDarkHover?: string;
-  purpleDarkBackground?: string;
-  purpleDarkBackgroundHover?: string;
-  purpleDarkBorder?: string;
-  purpleDarkBorderHover?: string;
-  purple?: string;
-  purpleHover?: string;
-  purpleBackground?: string;
-  purpleBackgroundHover?: string;
-  purpleBorder?: string;
-  purpleBorderHover?: string;
-  purpleLight?: string;
-  purpleLightHover?: string;
-  purpleLightBackground?: string;
-  purpleLightBackgroundHover?: string;
-  purpleLightBorder?: string;
-  purpleLightBorderHover?: string;
-  blueDark?: string;
-  blueDarkHover?: string;
-  blueDarkBackground?: string;
-  blueDarkBackgroundHover?: string;
-  blueDarkBorder?: string;
-  blueDarkBorderHover?: string;
-  blueMid?: string;
-  blueMidHover?: string;
-  blueMidBackground?: string;
-  blueMidBackgroundHover?: string;
-  blueMidBorder?: string;
-  blueMidBorderHover?: string;
-  blue?: string;
-  blueHover?: string;
-  blueBackground?: string;
-  blueBackgroundHover?: string;
-  blueBorder?: string;
-  blueBorderHover?: string;
-  blueLight?: string;
-  blueLightHover?: string;
-  blueLightBackground?: string;
-  blueLightBackgroundHover?: string;
-  blueLightBorder?: string;
-  blueLightBorderHover?: string;
-  tealDark?: string;
-  tealDarkHover?: string;
-  tealDarkBackground?: string;
-  tealDarkBackgroundHover?: string;
-  tealDarkBorder?: string;
-  tealDarkBorderHover?: string;
-  teal?: string;
-  tealHover?: string;
-  tealBackground?: string;
-  tealBackgroundHover?: string;
-  tealBorder?: string;
-  tealBorderHover?: string;
-  tealLight?: string;
-  tealLightHover?: string;
-  tealLightBackground?: string;
-  tealLightBackgroundHover?: string;
-  tealLightBorder?: string;
-  tealLightBorderHover?: string;
-  greenDark?: string;
-  greenDarkHover?: string;
-  greenDarkBackground?: string;
-  greenDarkBackgroundHover?: string;
-  greenDarkBorder?: string;
-  greenDarkBorderHover?: string;
-  green?: string;
-  greenHover?: string;
-  greenBackground?: string;
-  greenBackgroundHover?: string;
-  greenBorder?: string;
-  greenBorderHover?: string;
-  greenLight?: string;
-  greenLightHover?: string;
-  greenLightBackground?: string;
-  greenLightBackgroundHover?: string;
-  greenLightBorder?: string;
-  greenLightBorderHover?: string;
+  themeDarker: string;
+  themeDarkerHover: string;
+  themeDarkerBackground: string;
+  themeDarkerBackgroundHover: string;
+  themeDarkerBorder: string;
+  themeDarkerBorderHover: string;
+  themeDark: string;
+  themeDarkHover: string;
+  themeDarkBackground: string;
+  themeDarkBackgroundHover: string;
+  themeDarkBorder: string;
+  themeDarkBorderHover: string;
+  themeDarkAlt: string;
+  themeDarkAltHover: string;
+  themeDarkAltBackground: string;
+  themeDarkAltBackgroundHover: string;
+  themeDarkAltBorder: string;
+  themeDarkAltBorderHover: string;
+  themePrimary: string;
+  themePrimaryHover: string;
+  themePrimaryBackground: string;
+  themePrimaryBackgroundHover: string;
+  themePrimaryBorder: string;
+  themePrimaryBorderHover: string;
+  themeSecondary: string;
+  themeSecondaryHover: string;
+  themeSecondaryBackground: string;
+  themeSecondaryBackgroundHover: string;
+  themeSecondaryBorder: string;
+  themeSecondaryBorderHover: string;
+  themeTertiary: string;
+  themeTertiaryHover: string;
+  themeTertiaryBackground: string;
+  themeTertiaryBackgroundHover: string;
+  themeTertiaryBorder: string;
+  themeTertiaryBorderHover: string;
+  themeLight: string;
+  themeLightHover: string;
+  themeLightBackground: string;
+  themeLightBackgroundHover: string;
+  themeLightBorder: string;
+  themeLightBorderHover: string;
+  themeLighter: string;
+  themeLighterHover: string;
+  themeLighterBackground: string;
+  themeLighterBackgroundHover: string;
+  themeLighterBorder: string;
+  themeLighterBorderHover: string;
+  themeLighterAlt: string;
+  themeLighterAltHover: string;
+  themeLighterAltBackground: string;
+  themeLighterAltBackgroundHover: string;
+  themeLighterAltBorder: string;
+  themeLighterAltBorderHover: string;
+  black: string;
+  blackHover: string;
+  blackBackground: string;
+  blackBackgroundHover: string;
+  blackBorder: string;
+  blackBorderHover: string;
+  blackTranslucent40: string;
+  blackTranslucent40Hover: string;
+  blackTranslucent40Background: string;
+  blackTranslucent40BackgroundHover: string;
+  blackTranslucent40Border: string;
+  blackTranslucent40BorderHover: string;
+  neutralDark: string;
+  neutralDarkHover: string;
+  neutralDarkBackground: string;
+  neutralDarkBackgroundHover: string;
+  neutralDarkBorder: string;
+  neutralDarkBorderHover: string;
+  neutralPrimary: string;
+  neutralPrimaryHover: string;
+  neutralPrimaryBackground: string;
+  neutralPrimaryBackgroundHover: string;
+  neutralPrimaryBorder: string;
+  neutralPrimaryBorderHover: string;
+  neutralPrimaryAlt: string;
+  neutralPrimaryAltHover: string;
+  neutralPrimaryAltBackground: string;
+  neutralPrimaryAltBackgroundHover: string;
+  neutralPrimaryAltBorder: string;
+  neutralPrimaryAltBorderHover: string;
+  neutralSecondary: string;
+  neutralSecondaryHover: string;
+  neutralSecondaryBackground: string;
+  neutralSecondaryBackgroundHover: string;
+  neutralSecondaryBorder: string;
+  neutralSecondaryBorderHover: string;
+  neutralSecondaryAlt: string;
+  neutralSecondaryAltHover: string;
+  neutralSecondaryAltBackground: string;
+  neutralSecondaryAltBackgroundHover: string;
+  neutralSecondaryAltBorder: string;
+  neutralSecondaryAltBorderHover: string;
+  neutralTertiary: string;
+  neutralTertiaryHover: string;
+  neutralTertiaryBackground: string;
+  neutralTertiaryBackgroundHover: string;
+  neutralTertiaryBorder: string;
+  neutralTertiaryBorderHover: string;
+  neutralTertiaryAlt: string;
+  neutralTertiaryAltHover: string;
+  neutralTertiaryAltBackground: string;
+  neutralTertiaryAltBackgroundHover: string;
+  neutralTertiaryAltBorder: string;
+  neutralTertiaryAltBorderHover: string;
+  neutralQuaternary: string;
+  neutralQuaternaryHover: string;
+  neutralQuaternaryBackground: string;
+  neutralQuaternaryBackgroundHover: string;
+  neutralQuaternaryBorder: string;
+  neutralQuaternaryBorderHover: string;
+  neutralQuaternaryAlt: string;
+  neutralQuaternaryAltHover: string;
+  neutralQuaternaryAltBackground: string;
+  neutralQuaternaryAltBackgroundHover: string;
+  neutralQuaternaryAltBorder: string;
+  neutralQuaternaryAltBorderHover: string;
+  neutralLight: string;
+  neutralLightHover: string;
+  neutralLightBackground: string;
+  neutralLightBackgroundHover: string;
+  neutralLightBorder: string;
+  neutralLightBorderHover: string;
+  neutralLighter: string;
+  neutralLighterHover: string;
+  neutralLighterBackground: string;
+  neutralLighterBackgroundHover: string;
+  neutralLighterBorder: string;
+  neutralLighterBorderHover: string;
+  neutralLighterAlt: string;
+  neutralLighterAltHover: string;
+  neutralLighterAltBackground: string;
+  neutralLighterAltBackgroundHover: string;
+  neutralLighterAltBorder: string;
+  neutralLighterAltBorderHover: string;
+  white: string;
+  whiteHover: string;
+  whiteBackground: string;
+  whiteBackgroundHover: string;
+  whiteBorder: string;
+  whiteBorderHover: string;
+  whiteTranslucent40: string;
+  whiteTranslucent40Hover: string;
+  whiteTranslucent40Background: string;
+  whiteTranslucent40BackgroundHover: string;
+  whiteTranslucent40Border: string;
+  whiteTranslucent40BorderHover: string;
+  yellow: string;
+  yellowHover: string;
+  yellowBackground: string;
+  yellowBackgroundHover: string;
+  yellowBorder: string;
+  yellowBorderHover: string;
+  yellowLight: string;
+  yellowLightHover: string;
+  yellowLightBackground: string;
+  yellowLightBackgroundHover: string;
+  yellowLightBorder: string;
+  yellowLightBorderHover: string;
+  orange: string;
+  orangeHover: string;
+  orangeBackground: string;
+  orangeBackgroundHover: string;
+  orangeBorder: string;
+  orangeBorderHover: string;
+  orangeLight: string;
+  orangeLightHover: string;
+  orangeLightBackground: string;
+  orangeLightBackgroundHover: string;
+  orangeLightBorder: string;
+  orangeLightBorderHover: string;
+  orangeLighter: string;
+  orangeLighterHover: string;
+  orangeLighterBackground: string;
+  orangeLighterBackgroundHover: string;
+  orangeLighterBorder: string;
+  orangeLighterBorderHover: string;
+  redDark: string;
+  redDarkHover: string;
+  redDarkBackground: string;
+  redDarkBackgroundHover: string;
+  redDarkBorder: string;
+  redDarkBorderHover: string;
+  red: string;
+  redHover: string;
+  redBackground: string;
+  redBackgroundHover: string;
+  redBorder: string;
+  redBorderHover: string;
+  magentaDark: string;
+  magentaDarkHover: string;
+  magentaDarkBackground: string;
+  magentaDarkBackgroundHover: string;
+  magentaDarkBorder: string;
+  magentaDarkBorderHover: string;
+  magenta: string;
+  magentaHover: string;
+  magentaBackground: string;
+  magentaBackgroundHover: string;
+  magentaBorder: string;
+  magentaBorderHover: string;
+  magentaLight: string;
+  magentaLightHover: string;
+  magentaLightBackground: string;
+  magentaLightBackgroundHover: string;
+  magentaLightBorder: string;
+  magentaLightBorderHover: string;
+  purpleDark: string;
+  purpleDarkHover: string;
+  purpleDarkBackground: string;
+  purpleDarkBackgroundHover: string;
+  purpleDarkBorder: string;
+  purpleDarkBorderHover: string;
+  purple: string;
+  purpleHover: string;
+  purpleBackground: string;
+  purpleBackgroundHover: string;
+  purpleBorder: string;
+  purpleBorderHover: string;
+  purpleLight: string;
+  purpleLightHover: string;
+  purpleLightBackground: string;
+  purpleLightBackgroundHover: string;
+  purpleLightBorder: string;
+  purpleLightBorderHover: string;
+  blueDark: string;
+  blueDarkHover: string;
+  blueDarkBackground: string;
+  blueDarkBackgroundHover: string;
+  blueDarkBorder: string;
+  blueDarkBorderHover: string;
+  blueMid: string;
+  blueMidHover: string;
+  blueMidBackground: string;
+  blueMidBackgroundHover: string;
+  blueMidBorder: string;
+  blueMidBorderHover: string;
+  blue: string;
+  blueHover: string;
+  blueBackground: string;
+  blueBackgroundHover: string;
+  blueBorder: string;
+  blueBorderHover: string;
+  blueLight: string;
+  blueLightHover: string;
+  blueLightBackground: string;
+  blueLightBackgroundHover: string;
+  blueLightBorder: string;
+  blueLightBorderHover: string;
+  tealDark: string;
+  tealDarkHover: string;
+  tealDarkBackground: string;
+  tealDarkBackgroundHover: string;
+  tealDarkBorder: string;
+  tealDarkBorderHover: string;
+  teal: string;
+  tealHover: string;
+  tealBackground: string;
+  tealBackgroundHover: string;
+  tealBorder: string;
+  tealBorderHover: string;
+  tealLight: string;
+  tealLightHover: string;
+  tealLightBackground: string;
+  tealLightBackgroundHover: string;
+  tealLightBorder: string;
+  tealLightBorderHover: string;
+  greenDark: string;
+  greenDarkHover: string;
+  greenDarkBackground: string;
+  greenDarkBackgroundHover: string;
+  greenDarkBorder: string;
+  greenDarkBorderHover: string;
+  green: string;
+  greenHover: string;
+  greenBackground: string;
+  greenBackgroundHover: string;
+  greenBorder: string;
+  greenBorderHover: string;
+  greenLight: string;
+  greenLightHover: string;
+  greenLightBackground: string;
+  greenLightBackgroundHover: string;
+  greenLightBorder: string;
+  greenLightBorderHover: string;
 }
 
-export const ColorClassNames: IColorClassNames = {};
+export const ColorClassNames: IColorClassNames = {} as IColorClassNames;
 
 for (const colorName in DefaultPalette) {
   if (DefaultPalette.hasOwnProperty(colorName)) {
diff --git a/packages/styling/src/interfaces/IFontStyles.ts b/packages/styling/src/interfaces/IFontStyles.ts
index d72169280cdd7..2fd5d6d46be9b 100644
--- a/packages/styling/src/interfaces/IFontStyles.ts
+++ b/packages/styling/src/interfaces/IFontStyles.ts
@@ -4,15 +4,15 @@ import { IRawStyle } from '@uifabric/merge-styles/lib/index';
  * UI Fabric font set.
  */
 export interface IFontStyles {
-  tiny?: IRawStyle;
-  xSmall?: IRawStyle;
-  small?: IRawStyle;
-  smallPlus?: IRawStyle;
-  medium?: IRawStyle;
-  mediumPlus?: IRawStyle;
-  large?: IRawStyle;
-  xLarge?: IRawStyle;
-  xxLarge?: IRawStyle;
-  superLarge?: IRawStyle;
-  mega?: IRawStyle;
+  tiny: IRawStyle;
+  xSmall: IRawStyle;
+  small: IRawStyle;
+  smallPlus: IRawStyle;
+  medium: IRawStyle;
+  mediumPlus: IRawStyle;
+  large: IRawStyle;
+  xLarge: IRawStyle;
+  xxLarge: IRawStyle;
+  superLarge: IRawStyle;
+  mega: IRawStyle;
 }
diff --git a/packages/styling/src/styles/DefaultPalette.ts b/packages/styling/src/styles/DefaultPalette.ts
index ad3e0825cc3a4..a543a5ce866b0 100644
--- a/packages/styling/src/styles/DefaultPalette.ts
+++ b/packages/styling/src/styles/DefaultPalette.ts
@@ -1,5 +1,6 @@
 import { IPalette } from '../interfaces/index';
 
+// When adding or removing a color, make sure you keep this consistent with IColorClassNames by adding the color variants.
 export const DefaultPalette: IPalette = {
   themeDarker: '#004578',
   themeDark: '#005a9e',

From 0d7e546429c8c6d26404e9514e2abbf746df92ad Mon Sep 17 00:00:00 2001
From: Mark Polak <mark@thedutchies.com>
Date: Wed, 14 Feb 2018 03:46:14 +0100
Subject: [PATCH 1367/1641] Do not ignore onKeyDown for buttons with a menu
 (#3915)

* Trigger passed keydown event when not arrow down

* Solve it without changing the typings

* Revert "Solve it without changing the typings"

This reverts commit 607898bb9d700512934c370f0418fac34870a3cf.

* Add npm change file

* Also applies to split button

* Always execute onKeyDown when it is provided. Prevent logic from executing when defaultPrevented is set.

* Align the logic for click and keypress
---
 ...for-menu-only-button_2018-02-08-07-56.json | 11 ++++
 .../src/components/Button/BaseButton.tsx      | 30 ++++++---
 .../src/components/Button/Button.test.tsx     | 65 +++++++++++++++++++
 .../src/components/Button/Button.types.ts     |  2 +-
 .../components/MessageBar/MessageBar.types.ts |  2 +-
 5 files changed, 99 insertions(+), 11 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/dont-ignore-on-key-down-for-menu-only-button_2018-02-08-07-56.json

diff --git a/common/changes/office-ui-fabric-react/dont-ignore-on-key-down-for-menu-only-button_2018-02-08-07-56.json b/common/changes/office-ui-fabric-react/dont-ignore-on-key-down-for-menu-only-button_2018-02-08-07-56.json
new file mode 100644
index 0000000000000..e938eae664ab6
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/dont-ignore-on-key-down-for-menu-only-button_2018-02-08-07-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fire onKeyDown for Button with menuProps",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 0c75e3084b169..7c0ec7e68e725 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -496,11 +496,18 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   }
 
   @autobind
-  private _onMenuKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
-    if (ev.which === KeyCodes.down) {
-      let { onMenuClick } = this.props;
-      onMenuClick && onMenuClick(ev, this);
-      !ev.defaultPrevented && this._onToggleMenu();
+  private _onMenuKeyDown(ev: React.KeyboardEvent<HTMLDivElement | HTMLAnchorElement | HTMLButtonElement>) {
+    if (this.props.onKeyDown) {
+      this.props.onKeyDown(ev);
+    }
+
+    let { onMenuClick } = this.props;
+    if (onMenuClick) {
+      onMenuClick(ev, this);
+    }
+
+    if (!ev.defaultPrevented && ev.which === KeyCodes.down) {
+      this._onToggleMenu();
       ev.preventDefault();
       ev.stopPropagation();
     }
@@ -509,9 +516,14 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   @autobind
   private _onMenuClick(ev: React.MouseEvent<HTMLAnchorElement>) {
     let { onMenuClick } = this.props;
-    onMenuClick && onMenuClick(ev, this);
-    !ev.defaultPrevented && this._onToggleMenu();
-    ev.preventDefault();
-    ev.stopPropagation();
+    if (onMenuClick) {
+      onMenuClick(ev, this);
+    }
+
+    if (!ev.defaultPrevented) {
+      this._onToggleMenu();
+      ev.preventDefault();
+      ev.stopPropagation();
+    }
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
index f865e1a6c8364..ade522285e157 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
@@ -263,6 +263,71 @@ describe('Button', () => {
       expect(renderedDOM.tagName).not.toEqual('DIV');
     });
 
+    it('Providing onKeyDown and menuProps still fires provided onKeyDown', () => {
+      const keyDownSpy = jest.fn();
+
+      const button = ReactTestUtils.renderIntoDocument<any>(
+        <DefaultButton
+          data-automation-id='test'
+          text='Create account'
+          onKeyDown={ keyDownSpy }
+          menuProps={ {
+            items: [
+              {
+                key: 'emailMessage',
+                name: 'Email message',
+                icon: 'Mail'
+              },
+              {
+                key: 'calendarEvent',
+                name: 'Calendar event',
+                icon: 'Calendar'
+              }
+            ]
+          } }
+        />
+      );
+      const menuButtonDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+
+      ReactTestUtils.Simulate.keyDown(menuButtonDOM, { which: KeyCodes.enter });
+
+      expect(keyDownSpy).toHaveBeenCalled();
+    });
+
+    it('Providing onKeyDown, menuProps and setting splitButton to true fires provided onKeyDown on both buttons', () => {
+      const keyDownSpy = jest.fn();
+
+      const button = ReactTestUtils.renderIntoDocument<any>(
+        <DefaultButton
+          data-automation-id='test'
+          text='Create account'
+          onKeyDown={ keyDownSpy }
+          split={ true }
+          onClick={ alertClicked }
+          menuProps={ {
+            items: [
+              {
+                key: 'emailMessage',
+                name: 'Email message',
+                icon: 'Mail'
+              },
+              {
+                key: 'calendarEvent',
+                name: 'Calendar event',
+                icon: 'Calendar'
+              }
+            ]
+          } }
+        />
+      );
+      const renderedDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+      const primaryButtonDOM: HTMLDivElement = renderedDOM.getElementsByTagName('div')[0] as HTMLDivElement;
+
+      ReactTestUtils.Simulate.keyDown(primaryButtonDOM, { which: KeyCodes.enter });
+
+      expect(keyDownSpy).toHaveBeenCalled();
+    });
+
     it('Providing onClick, menuProps and setting splitButton to true renders a SplitButton', () => {
       const button = ReactTestUtils.renderIntoDocument<any>(
         <DefaultButton
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.types.ts b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
index f8fa11f8af393..8c14bdc82d636 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
@@ -20,7 +20,7 @@ export interface IButton {
   dismissMenu: () => void;
 }
 
-export interface IButtonProps extends React.AllHTMLAttributes<HTMLAnchorElement | HTMLButtonElement | BaseButton | Button> {
+export interface IButtonProps extends React.AllHTMLAttributes<HTMLAnchorElement | HTMLButtonElement | HTMLDivElement | BaseButton | Button> {
   /**
    * Optional callback to access the IButton interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts
index f294c9fddc90d..3fb450e9eeed3 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts
@@ -33,7 +33,7 @@ export interface IMessageBarProps extends React.HTMLAttributes<HTMLElement> {
    * If null, we don't show a dismiss button.
    * @defaultvalue null
    */
-  onDismiss?: (ev?: React.MouseEvent<HTMLButtonElement | BaseButton | HTMLAnchorElement | Button>) => any;
+  onDismiss?: (ev?: React.MouseEvent<HTMLButtonElement | BaseButton | HTMLAnchorElement | HTMLDivElement | Button>) => any;
 
   /**
    * Determines if the message bar is multi lined.

From 6dcf97580ec7690ffd73af23f2162a00b3ccf091 Mon Sep 17 00:00:00 2001
From: Montse Lozano Dieck <malozano@microsoft.com>
Date: Wed, 14 Feb 2018 00:28:11 -0800
Subject: [PATCH 1368/1641] CalloutContent: Remove CalloutWidth from
 calloutMain div (#3968)

* Remove calloutWidth from calloutMain div

* Add change file
---
 .../malozano-CalloutBorderWidth_2018-02-13-23-13.json | 11 +++++++++++
 .../src/components/Callout/CalloutContent.styles.ts   |  1 -
 2 files changed, 11 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/malozano-CalloutBorderWidth_2018-02-13-23-13.json

diff --git a/common/changes/office-ui-fabric-react/malozano-CalloutBorderWidth_2018-02-13-23-13.json b/common/changes/office-ui-fabric-react/malozano-CalloutBorderWidth_2018-02-13-23-13.json
new file mode 100644
index 0000000000000..f937fb91eb768
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malozano-CalloutBorderWidth_2018-02-13-23-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "CalloutContent: Remove calloutWidth from calloutMain ",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malozano@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.styles.ts b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.styles.ts
index c0019c4e59e51..c648133fe05fa 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.styles.ts
@@ -113,7 +113,6 @@ export const getStyles = (props: ICalloutContentStyleProps): ICalloutContentStyl
         position: 'relative',
         maxHeight: contentMaxHeight
       },
-      !!calloutWidth && { width: calloutWidth },
       overflowYHidden && {
         overflowY: 'hidden'
       },

From 45f36ccd4e4954d54d3008a09aef5f0adb24fb16 Mon Sep 17 00:00:00 2001
From: Cody Hoover <hoovercj@users.noreply.github.com>
Date: Wed, 14 Feb 2018 18:52:07 +0100
Subject: [PATCH 1369/1641] Add search box props for clear button aria
 attributes (#3946)

* Add props to search box to allow setting aria-label and aria-description for clear button

* Add change file

* Move clear button props to property bag

* remove unnecessary prop

* remove accidentally added files

* Use the object spread operator for cleaner code and easier updates in the future

* Use IButtonProps to allow all button props to be passed to clear button
---
 ...earch-arialabel-ariadescription_2018-02-12-10-52.json | 9 +++++++++
 .../src/components/SearchBox/SearchBox.base.tsx          | 9 +++++++--
 .../src/components/SearchBox/SearchBox.types.ts          | 6 ++++++
 3 files changed, 22 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/bugs-3858-clear-search-arialabel-ariadescription_2018-02-12-10-52.json

diff --git a/common/changes/office-ui-fabric-react/bugs-3858-clear-search-arialabel-ariadescription_2018-02-12-10-52.json b/common/changes/office-ui-fabric-react/bugs-3858-clear-search-arialabel-ariadescription_2018-02-12-10-52.json
new file mode 100644
index 0000000000000..ef168edc60c71
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/bugs-3858-clear-search-arialabel-ariadescription_2018-02-12-10-52.json
@@ -0,0 +1,9 @@
+{
+  "changes": [{
+    "packageName": "office-ui-fabric-react",
+    "comment": "Add clearButtonProps prop to SearchBox.types.ts with the IButtonPropsType. This is passed to the icon button in SearchBox.base.tsx",
+    "type": "minor"
+  }],
+  "packageName": "office-ui-fabric-react",
+  "email": "cohoov@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
index b1f33e8e3512b..46ccda1ed9abd 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
@@ -54,7 +54,7 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
   }
 
   public render() {
-    let { labelText, className, disabled, underlined, getStyles, theme } = this.props;
+    let { labelText, className, disabled, underlined, getStyles, theme, clearButtonProps } = this.props;
     let { value, hasFocus, id } = this.state;
 
     const classNames = getClassNames(getStyles!, {
@@ -89,7 +89,12 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
         />
         { value!.length > 0 &&
           <div className={ classNames.clearButton }>
-            <IconButton styles={ { root: { height: 'auto' }, icon: { fontSize: '12px' } } } onClick={ this._onClearClick } iconProps={ { iconName: 'Clear' } } />
+            <IconButton
+              styles={ { root: { height: 'auto' }, icon: { fontSize: '12px' } } }
+              onClick={ this._onClearClick }
+              iconProps={ { iconName: 'Clear' } }
+              { ...clearButtonProps }
+            />
           </div>
         }
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
index 37d87853caa1f..92019602a7fb3 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { ITheme, IStyle } from '../../Styling';
 import { IStyleFunction } from '../../Utilities';
+import { IButtonProps } from '../Button';
 
 export interface ISearchBox {
   /**
@@ -64,6 +65,11 @@ export interface ISearchBoxProps extends React.InputHTMLAttributes<HTMLInputElem
    */
   ariaLabel?: string;
 
+  /**
+   * The props for the clear button.
+   */
+  clearButtonProps?: IButtonProps;
+
   /**
    * Whether or not the SearchBox is underlined.
    * @default false

From da166365d2a15141de1e955ade1c2ef4adf7aa0a Mon Sep 17 00:00:00 2001
From: Rich <nero120@users.noreply.github.com>
Date: Wed, 14 Feb 2018 18:02:14 +0000
Subject: [PATCH 1370/1641] Updated TextField component so that
 _adjustInputHeight is called when value is changed via prop update. (#3942)

---
 .../src/components/TextField/TextField.tsx                   | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index 06e63901eedc9..f55b13f66b963 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -116,7 +116,10 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
       this.setState({
         value: newProps.value,
         errorMessage: ''
-      } as ITextFieldState);
+      } as ITextFieldState,
+        () => {
+          this._adjustInputHeight();
+        });
 
       this._delayedValidate(newProps.value);
     }

From fbbbbeb54e4f0e42ad15ccff1a031fa65f5433c5 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 14 Feb 2018 14:05:54 -0800
Subject: [PATCH 1371/1641] SearchBox: Adding unit test. (#3976)

* Updating SearchBox to pull value from ev.target.value, and adding a test, and ensuring that clearButtonProps.onClick is executed if provided.

* Adding change file.

* Removing unneeded import.
---
 .../searchbox-test_2018-02-14-19-03.json      | 11 ++++++++
 .../components/SearchBox/SearchBox.base.tsx   | 15 ++++++++---
 .../components/SearchBox/SearchBox.test.tsx   | 26 +++++++++++++++++++
 .../components/SearchBox/SearchBox.types.ts   |  9 +++++--
 4 files changed, 56 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/searchbox-test_2018-02-14-19-03.json

diff --git a/common/changes/office-ui-fabric-react/searchbox-test_2018-02-14-19-03.json b/common/changes/office-ui-fabric-react/searchbox-test_2018-02-14-19-03.json
new file mode 100644
index 0000000000000..2c7520ca3668c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/searchbox-test_2018-02-14-19-03.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SearchBox: adding unit test and tweaking how the value is read from ev rather than the element itself.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
index 46ccda1ed9abd..d5a5fc52af40b 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
@@ -91,9 +91,9 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
           <div className={ classNames.clearButton }>
             <IconButton
               styles={ { root: { height: 'auto' }, icon: { fontSize: '12px' } } }
-              onClick={ this._onClearClick }
               iconProps={ { iconName: 'Clear' } }
               { ...clearButtonProps }
+              onClick={ this._onClearClick }
             />
           </div>
         }
@@ -140,7 +140,15 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
 
   @autobind
   private _onClearClick(ev: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>) {
-    this._onClear(ev);
+    let { clearButtonProps } = this.props;
+
+    if (clearButtonProps && clearButtonProps.onClick) {
+      clearButtonProps.onClick(ev);
+    }
+
+    if (!ev.defaultPrevented) {
+      this._onClear(ev);
+    }
   }
 
   @autobind
@@ -188,7 +196,8 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
 
   @autobind
   private _onInputChange(ev: React.ChangeEvent<HTMLInputElement>) {
-    const value = this._inputElement.value;
+    const value = ev.target.value;
+
     if (value === this._latestValue) {
       return;
     }
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.test.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.test.tsx
index cf002263cafea..00f651c4b2d6a 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.test.tsx
@@ -3,8 +3,11 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import * as ReactTestUtils from 'react-dom/test-utils';
 import * as renderer from 'react-test-renderer';
+import { mount } from 'enzyme';
 import { SearchBox } from './SearchBox';
 
+// tslint:disable:jsx-no-lambda
+
 describe('SearchBox', () => {
 
   it('renders SearchBox correctly', () => {
@@ -12,4 +15,27 @@ describe('SearchBox', () => {
     let tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
+
+  it('can execute an onClick on clear button', () => {
+    let clickExecuted = false;
+    const component = mount(
+      <SearchBox
+        clearButtonProps={ {
+          onClick: () => clickExecuted = true
+        } }
+      />
+    );
+
+    expect(component.find('input').prop('value')).toEqual('');
+
+    component.find('input').simulate('change', { target: { value: 'New value' } });
+
+    expect(component.find('input').prop('value')).toEqual('New value');
+
+    component.find('button').simulate('click');
+
+    expect(clickExecuted).toEqual(true);
+
+    expect(component.find('input').prop('value')).toEqual('');
+  });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
index 92019602a7fb3..0e0479b822713 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
@@ -50,10 +50,15 @@ export interface ISearchBoxProps extends React.InputHTMLAttributes<HTMLInputElem
   onChanged?: (newValue: any) => void;
 
   /**
-  * The value of the text in the SearchBox.
-  */
+   * The value of the text in the SearchBox.
+   */
   value?: string;
 
+  /**
+   * The default value of the text in the SearchBox, in the case of an uncontrolled component.
+   */
+  defaultValue?: string;
+
   /**
   * CSS class to apply to the SearchBox.
   */

From 4ee11e7a11c954714d2bdcc2c0e3360bfbf45adf Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 14 Feb 2018 22:10:50 +0000
Subject: [PATCH 1372/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...myngu-newSuggestions_2018-02-08-21-28.json | 11 ---
 .../initials_2018-02-07-13-49.json            | 11 ---
 ...support-merge-styles_2018-02-13-19-06.json | 11 ---
 .../initials_2018-02-07-13-49.json            | 11 ---
 .../styling/initials_2018-02-07-13-49.json    | 11 ---
 ...ses-optional-typings_2018-02-06-18-28.json | 11 ---
 .../fix-error-handling_2018-02-13-02-38.json  | 11 ---
 ...ButtonEx-mergestyles_2018-02-01-19-14.json | 11 ---
 ...myngu-newSuggestions_2018-02-08-21-28.json | 11 ---
 ...h-validateOnFocusOut_2018-02-11-17-19.json | 11 ---
 ...abel-ariadescription_2018-02-12-10-52.json |  9 --
 ...lloutprops-classname_2017-12-11-20-00.json | 11 ---
 ...for-menu-only-button_2018-02-08-07-56.json | 11 ---
 ...bric-button-overflow_2018-02-14-00-59.json | 11 ---
 ...Picker-fixingPointer_2018-02-08-18-46.json | 11 ---
 ...ox-getClassNamesProp_2018-01-20-02-14.json | 11 ---
 ...o-CalloutBorderWidth_2018-02-13-23-13.json | 11 ---
 .../master_2018-01-20-01-21.json              | 11 ---
 .../master_2018-02-12-21-15.json              | 11 ---
 ...hBox-getStyles-props_2018-02-13-22-46.json | 11 ---
 packages/example-app-base/package.json        |  4 +-
 packages/experiments/CHANGELOG.json           | 19 ++++
 packages/experiments/CHANGELOG.md             |  9 +-
 packages/experiments/package.json             |  4 +-
 packages/file-type-icons/package.json         |  2 +-
 packages/icons/package.json                   |  2 +-
 .../jest-serializer-merge-styles/package.json |  2 +-
 packages/merge-styles/CHANGELOG.json          | 14 +++
 packages/merge-styles/CHANGELOG.md            |  9 +-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 87 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 24 ++++-
 packages/office-ui-fabric-react/package.json  |  8 +-
 packages/styling/CHANGELOG.json               | 22 +++++
 packages/styling/CHANGELOG.md                 |  9 +-
 packages/styling/package.json                 |  6 +-
 packages/utilities/CHANGELOG.json             | 19 ++++
 packages/utilities/CHANGELOG.md               |  9 +-
 packages/utilities/package.json               |  4 +-
 44 files changed, 238 insertions(+), 245 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/amyngu-newSuggestions_2018-02-08-21-28.json
 delete mode 100644 common/changes/@uifabric/experiments/initials_2018-02-07-13-49.json
 delete mode 100644 common/changes/@uifabric/merge-styles/global-support-merge-styles_2018-02-13-19-06.json
 delete mode 100644 common/changes/@uifabric/merge-styles/initials_2018-02-07-13-49.json
 delete mode 100644 common/changes/@uifabric/styling/initials_2018-02-07-13-49.json
 delete mode 100644 common/changes/@uifabric/styling/remove-classes-optional-typings_2018-02-06-18-28.json
 delete mode 100644 common/changes/@uifabric/utilities/fix-error-handling_2018-02-13-02-38.json
 delete mode 100644 common/changes/office-ui-fabric-react/ButtonEx-mergestyles_2018-02-01-19-14.json
 delete mode 100644 common/changes/office-ui-fabric-react/amyngu-newSuggestions_2018-02-08-21-28.json
 delete mode 100644 common/changes/office-ui-fabric-react/bugfix-Fix-validate-function-works-with-validateOnFocusOut_2018-02-11-17-19.json
 delete mode 100644 common/changes/office-ui-fabric-react/bugs-3858-clear-search-arialabel-ariadescription_2018-02-12-10-52.json
 delete mode 100644 common/changes/office-ui-fabric-react/component-calloutprops-classname_2017-12-11-20-00.json
 delete mode 100644 common/changes/office-ui-fabric-react/dont-ignore-on-key-down-for-menu-only-button_2018-02-08-07-56.json
 delete mode 100644 common/changes/office-ui-fabric-react/fabric-button-overflow_2018-02-14-00-59.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-DatePicker-fixingPointer_2018-02-08-18-46.json
 delete mode 100644 common/changes/office-ui-fabric-react/kysedate-comboBox-getClassNamesProp_2018-01-20-02-14.json
 delete mode 100644 common/changes/office-ui-fabric-react/malozano-CalloutBorderWidth_2018-02-13-23-13.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2018-01-20-01-21.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2018-02-12-21-15.json
 delete mode 100644 common/changes/office-ui-fabric-react/searchBox-getStyles-props_2018-02-13-22-46.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index f3642517a61d9..9055303fca466 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.49.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.50.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 2cfbad3498c21..eedd633c6d0d8 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.49.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.50.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 5f1d67975b3cb..924e7d5fc239a 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.49.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.50.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index b3f5539cef410..167edaf7c7d9a 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.49.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.50.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 62fc519d8f2bf..1b712c84bf90a 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.49.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.50.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/@uifabric/experiments/amyngu-newSuggestions_2018-02-08-21-28.json b/common/changes/@uifabric/experiments/amyngu-newSuggestions_2018-02-08-21-28.json
deleted file mode 100644
index 3241f919c4946..0000000000000
--- a/common/changes/@uifabric/experiments/amyngu-newSuggestions_2018-02-08-21-28.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Use new \"use current input\" command in Suggestions",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "amyngu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/initials_2018-02-07-13-49.json b/common/changes/@uifabric/experiments/initials_2018-02-07-13-49.json
deleted file mode 100644
index da6fd82d9a0c3..0000000000000
--- a/common/changes/@uifabric/experiments/initials_2018-02-07-13-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/experiments",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "khalle@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/global-support-merge-styles_2018-02-13-19-06.json b/common/changes/@uifabric/merge-styles/global-support-merge-styles_2018-02-13-19-06.json
deleted file mode 100644
index 02a74cf75f129..0000000000000
--- a/common/changes/@uifabric/merge-styles/global-support-merge-styles_2018-02-13-19-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "mergeStyles: Adding support to register selectors globally. Use `:global(rule)` as the selector to ensure that the unique className is not prepended in the output. See merge-styles README.md for more details.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/initials_2018-02-07-13-49.json b/common/changes/@uifabric/merge-styles/initials_2018-02-07-13-49.json
deleted file mode 100644
index ad82059ac3623..0000000000000
--- a/common/changes/@uifabric/merge-styles/initials_2018-02-07-13-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/merge-styles",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "khalle@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/initials_2018-02-07-13-49.json b/common/changes/@uifabric/styling/initials_2018-02-07-13-49.json
deleted file mode 100644
index bd2b4f2e78b32..0000000000000
--- a/common/changes/@uifabric/styling/initials_2018-02-07-13-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "khalle@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/remove-classes-optional-typings_2018-02-06-18-28.json b/common/changes/@uifabric/styling/remove-classes-optional-typings_2018-02-06-18-28.json
deleted file mode 100644
index 1e989a2bfcdb5..0000000000000
--- a/common/changes/@uifabric/styling/remove-classes-optional-typings_2018-02-06-18-28.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "Adjusting IColorClassNames and IFontStyles to remove the optional part for the members, to make the interfaces easier to consume.",
-      "packageName": "@uifabric/styling",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "mark@thedutchies.com"
-}
diff --git a/common/changes/@uifabric/utilities/fix-error-handling_2018-02-13-02-38.json b/common/changes/@uifabric/utilities/fix-error-handling_2018-02-13-02-38.json
deleted file mode 100644
index ecd2c77dc8674..0000000000000
--- a/common/changes/@uifabric/utilities/fix-error-handling_2018-02-13-02-38.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "BaseComponent.onError default implementation removed, exceptions now simply bubble out which lets partners use React 16 error handling.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/ButtonEx-mergestyles_2018-02-01-19-14.json b/common/changes/office-ui-fabric-react/ButtonEx-mergestyles_2018-02-01-19-14.json
deleted file mode 100644
index 8b47a90cb51d5..0000000000000
--- a/common/changes/office-ui-fabric-react/ButtonEx-mergestyles_2018-02-01-19-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Converted ButtonBasicExample to use mergeStyles instead of SCSS.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/amyngu-newSuggestions_2018-02-08-21-28.json b/common/changes/office-ui-fabric-react/amyngu-newSuggestions_2018-02-08-21-28.json
deleted file mode 100644
index b9bd42d5e19a4..0000000000000
--- a/common/changes/office-ui-fabric-react/amyngu-newSuggestions_2018-02-08-21-28.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add \"use current input command\" and remove need to explicity call focus when moving between suggestions and commands",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "amyngu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/bugfix-Fix-validate-function-works-with-validateOnFocusOut_2018-02-11-17-19.json b/common/changes/office-ui-fabric-react/bugfix-Fix-validate-function-works-with-validateOnFocusOut_2018-02-11-17-19.json
deleted file mode 100644
index c57cdd8fedaef..0000000000000
--- a/common/changes/office-ui-fabric-react/bugfix-Fix-validate-function-works-with-validateOnFocusOut_2018-02-11-17-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix bug: '#3940 Validate function works incorrect with attribute validateOnFocusOut'",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "ia.samoylov@icloud.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/bugs-3858-clear-search-arialabel-ariadescription_2018-02-12-10-52.json b/common/changes/office-ui-fabric-react/bugs-3858-clear-search-arialabel-ariadescription_2018-02-12-10-52.json
deleted file mode 100644
index ef168edc60c71..0000000000000
--- a/common/changes/office-ui-fabric-react/bugs-3858-clear-search-arialabel-ariadescription_2018-02-12-10-52.json
+++ /dev/null
@@ -1,9 +0,0 @@
-{
-  "changes": [{
-    "packageName": "office-ui-fabric-react",
-    "comment": "Add clearButtonProps prop to SearchBox.types.ts with the IButtonPropsType. This is passed to the icon button in SearchBox.base.tsx",
-    "type": "minor"
-  }],
-  "packageName": "office-ui-fabric-react",
-  "email": "cohoov@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/component-calloutprops-classname_2017-12-11-20-00.json b/common/changes/office-ui-fabric-react/component-calloutprops-classname_2017-12-11-20-00.json
deleted file mode 100644
index eac96ed35f8aa..0000000000000
--- a/common/changes/office-ui-fabric-react/component-calloutprops-classname_2017-12-11-20-00.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix ComboBox, ContextualMenu, Teachingbubble overwriting calloutProps.className",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kurt.carpenter@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/dont-ignore-on-key-down-for-menu-only-button_2018-02-08-07-56.json b/common/changes/office-ui-fabric-react/dont-ignore-on-key-down-for-menu-only-button_2018-02-08-07-56.json
deleted file mode 100644
index e938eae664ab6..0000000000000
--- a/common/changes/office-ui-fabric-react/dont-ignore-on-key-down-for-menu-only-button_2018-02-08-07-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fire onKeyDown for Button with menuProps",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mark@thedutchies.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fabric-button-overflow_2018-02-14-00-59.json b/common/changes/office-ui-fabric-react/fabric-button-overflow_2018-02-14-00-59.json
deleted file mode 100644
index 1324790d38767..0000000000000
--- a/common/changes/office-ui-fabric-react/fabric-button-overflow_2018-02-14-00-59.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fabric: Adds button overflow visible global style so that ie11 renders like edge/chrome/firefox",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kegorr-DatePicker-fixingPointer_2018-02-08-18-46.json b/common/changes/office-ui-fabric-react/kegorr-DatePicker-fixingPointer_2018-02-08-18-46.json
deleted file mode 100644
index c34dc63ef8a29..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-DatePicker-fixingPointer_2018-02-08-18-46.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DatePicker: Fixing pointer when datepicker doesn't have a label",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kysedate-comboBox-getClassNamesProp_2018-01-20-02-14.json b/common/changes/office-ui-fabric-react/kysedate-comboBox-getClassNamesProp_2018-01-20-02-14.json
deleted file mode 100644
index 9c4b79fc3b8d3..0000000000000
--- a/common/changes/office-ui-fabric-react/kysedate-comboBox-getClassNamesProp_2018-01-20-02-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Add getClassNAmes prop to allow complete customization of the component",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kysedate@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/malozano-CalloutBorderWidth_2018-02-13-23-13.json b/common/changes/office-ui-fabric-react/malozano-CalloutBorderWidth_2018-02-13-23-13.json
deleted file mode 100644
index f937fb91eb768..0000000000000
--- a/common/changes/office-ui-fabric-react/malozano-CalloutBorderWidth_2018-02-13-23-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "CalloutContent: Remove calloutWidth from calloutMain ",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malozano@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2018-01-20-01-21.json b/common/changes/office-ui-fabric-react/master_2018-01-20-01-21.json
deleted file mode 100644
index 10256a7c238b1..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2018-01-20-01-21.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SpinButton: Add getClassNAmes prop to allow complete customization of the component",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kysedate@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2018-02-12-21-15.json b/common/changes/office-ui-fabric-react/master_2018-02-12-21-15.json
deleted file mode 100644
index 760c8144a8dac..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2018-02-12-21-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix aria-owns in contextual menu items, and add appropriate aria properties to CommandBar items.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "trgau@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/searchBox-getStyles-props_2018-02-13-22-46.json b/common/changes/office-ui-fabric-react/searchBox-getStyles-props_2018-02-13-22-46.json
deleted file mode 100644
index 92a797dfc4c62..0000000000000
--- a/common/changes/office-ui-fabric-react/searchBox-getStyles-props_2018-02-13-22-46.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SearchBox: Fixed getStyles interface to be using ISearchBoxStyleProps instead of ISearchBoxProps",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 3eb561aaa93d9..f4ed95d185a99 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -32,8 +32,8 @@
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.17.0 <6.0.0",
-    "@uifabric/utilities": ">=5.10.3 <6.0.0",
+    "@uifabric/styling": ">=5.18.0 <6.0.0",
+    "@uifabric/utilities": ">=5.11.0 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index fa2ba02414ce4..0351e861fe448 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.20.0",
+      "tag": "@uifabric/experiments_v5.20.0",
+      "date": "Wed, 14 Feb 2018 22:10:49 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "amyngu <31973030+amyngu@users.noreply.github.com>",
+            "commit": "cdd6bafa27a6514e51ffe816ebb89b8a71b63a94",
+            "comment": "Use new \"use current input\" command in Suggestions"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.49.3 <6.0.0` to `>=5.50.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.19.0",
       "tag": "@uifabric/experiments_v5.19.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 40fb694b5bce3..cb97b6cf43ac6 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Wed, 07 Feb 2018 11:23:59 GMT and should not be manually modified.
+This log was last generated on Wed, 14 Feb 2018 22:10:50 GMT and should not be manually modified.
+
+## 5.20.0
+Wed, 14 Feb 2018 22:10:49 GMT
+
+### Minor changes
+
+- Use new "use current input" command in Suggestions
 
 ## 5.19.0
 Wed, 07 Feb 2018 11:23:59 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index d18955e50d366..46b74672ca05e 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.19.0",
+  "version": "5.20.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.49.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.50.0 <6.0.0",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/file-type-icons/package.json b/packages/file-type-icons/package.json
index 1cda2d14ad073..9106495ca9f51 100644
--- a/packages/file-type-icons/package.json
+++ b/packages/file-type-icons/package.json
@@ -26,7 +26,7 @@
     "react-dom": "^16.2.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.16.0 <6.0.0",
+    "@uifabric/styling": ">=5.18.0 <6.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 0718fae836e2b..b97428ed361f5 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -22,7 +22,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.16.0 <6.0.0",
+    "@uifabric/styling": ">=5.18.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/jest-serializer-merge-styles/package.json b/packages/jest-serializer-merge-styles/package.json
index 9d4f4f562016f..68b9b283c52cc 100644
--- a/packages/jest-serializer-merge-styles/package.json
+++ b/packages/jest-serializer-merge-styles/package.json
@@ -24,6 +24,6 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/merge-styles": ">=5.11.2 <6.0.0"
+    "@uifabric/merge-styles": ">=5.12.0 <6.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index 38d3604da2e39..6812a3c66a1de 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.12.0",
+      "tag": "@uifabric/merge-styles_v5.12.0",
+      "date": "Wed, 14 Feb 2018 22:10:50 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "711ef243d0212f623a55ebde0d98042f148d81db",
+            "comment": "mergeStyles: Adding support to register selectors globally. Use `:global(rule)` as the selector to ensure that the unique className is not prepended in the output. See merge-styles README.md for more details."
+          }
+        ]
+      }
+    },
     {
       "version": "5.11.2",
       "tag": "@uifabric/merge-styles_v5.11.2",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index b418f1158b389..b14f64113690e 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Wed, 07 Feb 2018 11:23:59 GMT and should not be manually modified.
+This log was last generated on Wed, 14 Feb 2018 22:10:50 GMT and should not be manually modified.
+
+## 5.12.0
+Wed, 14 Feb 2018 22:10:50 GMT
+
+### Minor changes
+
+- mergeStyles: Adding support to register selectors globally. Use `:global(rule)` as the selector to ensure that the unique className is not prepended in the output. See merge-styles README.md for more details.
 
 ## 5.11.2
 Wed, 07 Feb 2018 11:23:59 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index 4a9301242e395..937772ae49850 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.11.2",
+  "version": "5.12.0",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index b41fd6b8d553f..6f3f245eaae8b 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,93 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.50.0",
+      "tag": "office-ui-fabric-react_v5.50.0",
+      "date": "Wed, 14 Feb 2018 22:10:50 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "amyngu <31973030+amyngu@users.noreply.github.com>",
+            "commit": "cdd6bafa27a6514e51ffe816ebb89b8a71b63a94",
+            "comment": "Add \"use current input command\" and remove need to explicity call focus when moving between suggestions and commands"
+          },
+          {
+            "author": "Cody Hoover <hoovercj@users.noreply.github.com>",
+            "commit": "45f36ccd4e4954d54d3008a09aef5f0adb24fb16",
+            "comment": "Add clearButtonProps prop to SearchBox.types.ts with the IButtonPropsType. This is passed to the icon button in SearchBox.base.tsx"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "27e230cd7f368d471e0dfceb5e4b11a9ab10354b",
+            "comment": "SearchBox: Fixed getStyles interface to be using ISearchBoxStyleProps instead of ISearchBoxProps"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Ivan Samoylov <IA.Samoylov@outlook.com>",
+            "commit": "ad1dcfca80bf8f14209f4911a24874b5582ac60e",
+            "comment": "Fix bug: '#3940 Validate function works incorrect with attribute validateOnFocusOut'"
+          },
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "746b36e94dfbe2fa97bb5432a6d2e723e5a28551",
+            "comment": "Converted ButtonBasicExample to use mergeStyles instead of SCSS."
+          },
+          {
+            "author": "Kurt Carpenter <github@kurtcarpenter.io>",
+            "commit": "8fa181dab613c604f49ca518eceff53b7206deda",
+            "comment": "Fix ComboBox, ContextualMenu, Teachingbubble overwriting calloutProps.className"
+          },
+          {
+            "author": "Mark Polak <mark@thedutchies.com>",
+            "commit": "0d7e546429c8c6d26404e9514e2abbf746df92ad",
+            "comment": "Fire onKeyDown for Button with menuProps"
+          },
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "cd1d7afb76421fbc3c744bc61c81ddffceafd0af",
+            "comment": "Fabric: Adds button overflow visible global style so that ie11 renders like edge/chrome/firefox"
+          },
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "9e3fa5810fe09e5e7b0b8e6101aab95fc0c04980",
+            "comment": "DatePicker: Fixing pointer when datepicker doesn't have a label"
+          },
+          {
+            "author": "kysedate <35615581+kysedate@users.noreply.github.com>",
+            "commit": "7d67c1dc215c25dd3b734e53dc8e9499dded3c17",
+            "comment": "ComboBox: Add getClassNAmes prop to allow complete customization of the component"
+          },
+          {
+            "author": "Montse Lozano Dieck <malozano@microsoft.com>",
+            "commit": "6dcf97580ec7690ffd73af23f2162a00b3ccf091",
+            "comment": "CalloutContent: Remove calloutWidth from calloutMain "
+          },
+          {
+            "author": "kysedate <35615581+kysedate@users.noreply.github.com>",
+            "commit": "0fdbf1d7223ac21dc2775d68f22888aa7759b65a",
+            "comment": "SpinButton: Add getClassNAmes prop to allow complete customization of the component"
+          },
+          {
+            "author": "Trevor Gau <trevorsg@gmail.com>",
+            "commit": "f57acaa79994e796b1219ed4cbe61904c4948e5b",
+            "comment": "Fix aria-owns in contextual menu items, and add appropriate aria properties to CommandBar items."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.11.2 <6.0.0` to `>=5.12.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.17.0 <6.0.0` to `>=5.18.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.10.3 <6.0.0` to `>=5.11.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.49.3",
       "tag": "office-ui-fabric-react_v5.49.3",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 0836e4400d56e..091c4e455c513 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,28 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 13 Feb 2018 11:24:05 GMT and should not be manually modified.
+This log was last generated on Wed, 14 Feb 2018 22:10:50 GMT and should not be manually modified.
+
+## 5.50.0
+Wed, 14 Feb 2018 22:10:50 GMT
+
+### Minor changes
+
+- Add "use current input command" and remove need to explicity call focus when moving between suggestions and commands
+- Add clearButtonProps prop to SearchBox.types.ts with the IButtonPropsType. This is passed to the icon button in SearchBox.base.tsx
+- SearchBox: Fixed getStyles interface to be using ISearchBoxStyleProps instead of ISearchBoxProps
+
+### Patches
+
+- Fix bug: '#3940 Validate function works incorrect with attribute validateOnFocusOut'
+- Converted ButtonBasicExample to use mergeStyles instead of SCSS.
+- Fix ComboBox, ContextualMenu, Teachingbubble overwriting calloutProps.className
+- Fire onKeyDown for Button with menuProps
+- Fabric: Adds button overflow visible global style so that ie11 renders like edge/chrome/firefox
+- DatePicker: Fixing pointer when datepicker doesn't have a label
+- ComboBox: Add getClassNAmes prop to allow complete customization of the component
+- CalloutContent: Remove calloutWidth from calloutMain 
+- SpinButton: Add getClassNAmes prop to allow complete customization of the component
+- Fix aria-owns in contextual menu items, and add appropriate aria properties to CommandBar items.
 
 ## 5.49.3
 Tue, 13 Feb 2018 11:24:05 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 3ea66672f13cf..5418d5b3d3395 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.49.3",
+  "version": "5.50.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -49,9 +49,9 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
-    "@uifabric/merge-styles": ">=5.11.2 <6.0.0",
-    "@uifabric/styling": ">=5.17.0 <6.0.0",
-    "@uifabric/utilities": ">=5.10.3 <6.0.0",
+    "@uifabric/merge-styles": ">=5.12.0 <6.0.0",
+    "@uifabric/styling": ">=5.18.0 <6.0.0",
+    "@uifabric/utilities": ">=5.11.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index d0e363eea13c8..0fa0b63690bea 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.18.0",
+      "tag": "@uifabric/styling_v5.18.0",
+      "date": "Wed, 14 Feb 2018 22:10:50 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Mark Polak <mark@thedutchies.com>",
+            "commit": "8b573a64f3d9f4e3dbd17b1f90788ab8fffd6185",
+            "comment": "Adjusting IColorClassNames and IFontStyles to remove the optional part for the members, to make the interfaces easier to consume."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.10.3 <6.0.0` to `>=5.11.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.11.2 <6.0.0` to `>=5.12.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.17.0",
       "tag": "@uifabric/styling_v5.17.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index e44bb6fb9b021..8885125e5eda6 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Thu, 25 Jan 2018 11:23:06 GMT and should not be manually modified.
+This log was last generated on Wed, 14 Feb 2018 22:10:50 GMT and should not be manually modified.
+
+## 5.18.0
+Wed, 14 Feb 2018 22:10:50 GMT
+
+### Minor changes
+
+- Adjusting IColorClassNames and IFontStyles to remove the optional part for the members, to make the interfaces easier to consume.
 
 ## 5.17.0
 Thu, 25 Jan 2018 11:23:06 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index e1b1a76707421..8d8b6c7504549 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.17.0",
+  "version": "5.18.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "repository": {
     "type": "git",
@@ -27,8 +27,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.10.3 <6.0.0",
-    "@uifabric/merge-styles": ">=5.11.2 <6.0.0",
+    "@uifabric/utilities": ">=5.11.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.12.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 0ba610d4e9254..f4c3bda6621a2 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.11.0",
+      "tag": "@uifabric/utilities_v5.11.0",
+      "date": "Wed, 14 Feb 2018 22:10:50 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "69854e90a1bc2eb447087df89f5276c166a9d766",
+            "comment": "BaseComponent.onError default implementation removed, exceptions now simply bubble out which lets partners use React 16 error handling."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.11.2 <6.0.0` to `>=5.12.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.10.3",
       "tag": "@uifabric/utilities_v5.10.3",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index aae80a486f4e8..955c76e4bddbb 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Tue, 13 Feb 2018 11:24:05 GMT and should not be manually modified.
+This log was last generated on Wed, 14 Feb 2018 22:10:50 GMT and should not be manually modified.
+
+## 5.11.0
+Wed, 14 Feb 2018 22:10:50 GMT
+
+### Minor changes
+
+- BaseComponent.onError default implementation removed, exceptions now simply bubble out which lets partners use React 16 error handling.
 
 ## 5.10.3
 Tue, 13 Feb 2018 11:24:05 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index d90650bf7bebe..fa69686227ecb 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.10.3",
+  "version": "5.11.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -36,7 +36,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/merge-styles": ">=5.11.2 <6.0.0",
+    "@uifabric/merge-styles": ">=5.12.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },

From e1643ddc1862e030bd1f1908c148e778867a23f8 Mon Sep 17 00:00:00 2001
From: Manish Garg <manishga@microsoft.com>
Date: Wed, 14 Feb 2018 15:58:34 -0800
Subject: [PATCH 1373/1641] ChangeFile for 3942 (#3975)

---
 ...120-pull-request-3942-autoAdjustTextboxHeight.json | 11 +++++++++++
 1 file changed, 11 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/nero120-pull-request-3942-autoAdjustTextboxHeight.json

diff --git a/common/changes/office-ui-fabric-react/nero120-pull-request-3942-autoAdjustTextboxHeight.json b/common/changes/office-ui-fabric-react/nero120-pull-request-3942-autoAdjustTextboxHeight.json
new file mode 100644
index 0000000000000..4d162c4f1aafb
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/nero120-pull-request-3942-autoAdjustTextboxHeight.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix bug: '#3942 Fixed controlled TextField with multiline and autoAdjustHeight does not adjust when setting value via state'",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": ""
+}
\ No newline at end of file

From 7b7abfa12cec76632570dad7c2524901e4580ab1 Mon Sep 17 00:00:00 2001
From: Cody Hoover <hoovercj@users.noreply.github.com>
Date: Thu, 15 Feb 2018 04:01:29 +0100
Subject: [PATCH 1374/1641] Respect "forceintofirstchild" parameter of
 FocusZone.focus() (#3961)

* Add forceIntoFirstChild param for FocusZone.focus and fix implementation

* Add change file
---
 ...ocuszone-forceintofirstchild_2018-02-13-16-29.json | 11 +++++++++++
 .../src/components/FocusZone/FocusZone.tsx            |  3 ++-
 .../src/components/FocusZone/FocusZone.types.ts       |  3 ++-
 3 files changed, 15 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/issues-3960-focuszone-forceintofirstchild_2018-02-13-16-29.json

diff --git a/common/changes/office-ui-fabric-react/issues-3960-focuszone-forceintofirstchild_2018-02-13-16-29.json b/common/changes/office-ui-fabric-react/issues-3960-focuszone-forceintofirstchild_2018-02-13-16-29.json
new file mode 100644
index 0000000000000..00975027a79de
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/issues-3960-focuszone-forceintofirstchild_2018-02-13-16-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "FocusZone.Focus now respects forceIntoFirstChild parameter and  IFocusZone.ts has been updated to reflect this",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "cohoov@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 5686b4edb7f3f..1952a0b5df70b 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -139,6 +139,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
   /**
    * Sets focus to the first tabbable item in the zone.
+   * @param {boolean} forceIntoFirstElement If true, focus will be forced into the first element, even if focus is already in the focus zone.
    * @returns True if focus could be set to an active element, false if no operation was taken.
    */
   public focus(forceIntoFirstElement: boolean = false): boolean {
@@ -153,7 +154,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
         }
 
         return false;
-      } else if (this._activeElement && elementContains(this._root, this._activeElement)
+      } else if (!forceIntoFirstElement && this._activeElement && elementContains(this._root, this._activeElement)
         && isElementTabbable(this._activeElement)) {
         this._activeElement.focus();
         return true;
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
index d8417e1699c65..300bb3b20aa33 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
@@ -7,9 +7,10 @@ import { FocusZone } from './FocusZone';
 export interface IFocusZone {
   /**
    * Sets focus to the first tabbable item in the zone.
+   * @param {boolean} forceIntoFirstElement If true, focus will be forced into the first element, even if focus is already in the focus zone.
    * @returns True if focus could be set to an active element, false if no operation was taken.
    */
-  focus(): boolean;
+  focus(forceIntoFirstElement?: boolean): boolean;
 
   /**
    * Sets focus to a specific child element within the zone. This can be used in conjunction with

From c58f5f8bbe3be371475985b54bd3419f8573c678 Mon Sep 17 00:00:00 2001
From: Stephen Kempin <SKempin@users.noreply.github.com>
Date: Thu, 15 Feb 2018 18:04:22 +0000
Subject: [PATCH 1375/1641] Correcting mistype error (#3982)

Correcting mistyping error of 'Butjon' to 'Button' in button component text attribute.
---
 .../components/Button/examples/Button.Default.Example.tsx   | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
index c1edb4cdf9e5f..a9809406fd143 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
@@ -23,7 +23,7 @@ export class ButtonDefaultExample extends React.Component<IButtonProps, {}> {
             data-automation-id='test'
             disabled={ disabled }
             checked={ checked }
-            text='Butjon'
+            text='Button'
           />
         </div>
         <div>
@@ -33,7 +33,7 @@ export class ButtonDefaultExample extends React.Component<IButtonProps, {}> {
             data-automation-id='test'
             disabled={ disabled }
             checked={ checked }
-            text='Butjon'
+            text='Button'
             onClick={ this._alertClicked }
           />
         </div>
@@ -44,4 +44,4 @@ export class ButtonDefaultExample extends React.Component<IButtonProps, {}> {
   private _alertClicked(): void {
     alert('Clicked');
   }
-}
\ No newline at end of file
+}

From 97593b0e0ff8c69cafbaefe40a3ba6834572eddf Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Thu, 15 Feb 2018 13:04:20 -0800
Subject: [PATCH 1376/1641] Website: Left nav scroll bug fixes (#3986)

* Don't load the component until the page is loaded - otherwise the height is off

* Higher z index for nav to prevent jittery scrolling in edge

* LoadingComponent height + revert shouldLeftNavLoad

* Added change file

* Removed more shouldLeftNavLoad remnants
---
 apps/fabric-website/src/components/App/App.scss       |  2 +-
 apps/fabric-website/src/components/App/AppState.tsx   |  9 ++++++---
 .../fabric-website/leftnav-perf_2018-02-15-17-08.json | 11 +++++++++++
 3 files changed, 18 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/leftnav-perf_2018-02-15-17-08.json

diff --git a/apps/fabric-website/src/components/App/App.scss b/apps/fabric-website/src/components/App/App.scss
index 088921c759926..39a95b8a63796 100644
--- a/apps/fabric-website/src/components/App/App.scss
+++ b/apps/fabric-website/src/components/App/App.scss
@@ -18,7 +18,7 @@
     top: $Header-height;
     width: $Nav-width;
     @include ms-float(left);
-    z-index: $ms-zIndex-1;
+    z-index: 999; // This z-index needs to be high to prevent jittery scrolling in Edge.
   }
 
   .App-content {
diff --git a/apps/fabric-website/src/components/App/AppState.tsx b/apps/fabric-website/src/components/App/AppState.tsx
index 4037e4e10691f..ff578e47e80df 100644
--- a/apps/fabric-website/src/components/App/AppState.tsx
+++ b/apps/fabric-website/src/components/App/AppState.tsx
@@ -10,11 +10,14 @@ export interface IAppState {
   pages: INavPage[];
 }
 
+// Giving the loading component a height so that the left nav loads in full screen and there is less flashing as the component page loads.
 const LoadingComponent = (props: any): JSX.Element => {
   return (
-    <ComponentPage>
-      <PageHeader pageTitle={ props.title } backgroundColor='#038387' />
-    </ComponentPage>
+    <div style={ { height: '1500px' } }>
+      <ComponentPage>
+        <PageHeader pageTitle={ props.title } backgroundColor='#038387' />
+      </ComponentPage>
+    </div>
   );
 };
 
diff --git a/common/changes/@uifabric/fabric-website/leftnav-perf_2018-02-15-17-08.json b/common/changes/@uifabric/fabric-website/leftnav-perf_2018-02-15-17-08.json
new file mode 100644
index 0000000000000..5cdc1b437ad9a
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/leftnav-perf_2018-02-15-17-08.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Left nav: Less jittery and component pages load in full height.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From 04bd4051d81e68f7b007009e85b50665d4b9db4e Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 15 Feb 2018 14:50:13 -0800
Subject: [PATCH 1377/1641] mergeStyles: Fill opacity is now unitless. (#3992)

* fill-opacity

* fixing fill-opacity
---
 .../merge-styles/fill-opacity_2018-02-15-22-38.json   | 11 +++++++++++
 packages/merge-styles/src/transforms/provideUnits.ts  |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/@uifabric/merge-styles/fill-opacity_2018-02-15-22-38.json

diff --git a/common/changes/@uifabric/merge-styles/fill-opacity_2018-02-15-22-38.json b/common/changes/@uifabric/merge-styles/fill-opacity_2018-02-15-22-38.json
new file mode 100644
index 0000000000000..d663586f93056
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/fill-opacity_2018-02-15-22-38.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "mergeStyles: setting `fill-opacity` as unitless.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/merge-styles/src/transforms/provideUnits.ts b/packages/merge-styles/src/transforms/provideUnits.ts
index 2d2fe1e018988..7d85156e01ab7 100644
--- a/packages/merge-styles/src/transforms/provideUnits.ts
+++ b/packages/merge-styles/src/transforms/provideUnits.ts
@@ -5,6 +5,7 @@ const NON_PIXEL_NUMBER_PROPS = [
   'flex',
   'flex-grow',
   'flex-shrink',
+  'fill-opacity',
   'opacity',
   'order',
   'z-index',

From 6aecee329e1652eb2e4dff3a313a242632b37e2f Mon Sep 17 00:00:00 2001
From: Mike Wheaton <miwhea@microsoft.com>
Date: Thu, 15 Feb 2018 18:11:48 -0800
Subject: [PATCH 1378/1641] Link: Convert to merge-styles, support theming
 (#3927)

* Remove dependency of Link.Example.scss on Link.scss, which will soon be removed

* Convert the default state of Link to use merge-styles

* Add 'disabled' prop to link styles and use it

* Remove SCSS file that is no longer needed, and other cleanup

* Add change file

* Add semantic colors for links, set these in the default theme, and use in the styles

* Remove the linkTextFocused color, as this is the same as the default link color

* Remove linkTextDisabled, use existing disabledText instead

* Simplify semantic color names by removing 'text'

* Move button-specific styles to the correct area, and move getFocusStyle() up a level as it should be applied to all elements

* Remove unused variable and make ILinkStyles root property required

* Define types for styled()

* Update Link snapshots

* Add LinkBase

* Add style prop to distinguish between the element being an anchor or a button, and style appropriately

* Update Link snapshot

* Output a custom class name and include a test for this
---
 ...ea-link-merge-styles_2018-02-08-20-12.json |  11 ++
 .../src/components/Link/Link.base.tsx         |  76 +++++++
 .../src/components/Link/Link.scss             |  65 ------
 .../src/components/Link/Link.styles.ts        |  62 ++++++
 .../src/components/Link/Link.test.tsx         |   5 +
 .../src/components/Link/Link.tsx              |  80 +-------
 .../src/components/Link/Link.types.ts         |  30 ++-
 .../Link/__snapshots__/Link.test.tsx.snap     | 185 +++++++++++++++++-
 .../Link/examples/Link.Example.scss           |  22 ++-
 .../styling/src/interfaces/ISemanticColors.ts |  10 +
 packages/styling/src/styles/theme.ts          |   3 +
 11 files changed, 403 insertions(+), 146 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/miwhea-link-merge-styles_2018-02-08-20-12.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Link/Link.base.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/components/Link/Link.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/Link/Link.styles.ts

diff --git a/common/changes/office-ui-fabric-react/miwhea-link-merge-styles_2018-02-08-20-12.json b/common/changes/office-ui-fabric-react/miwhea-link-merge-styles_2018-02-08-20-12.json
new file mode 100644
index 0000000000000..d4b6418786295
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/miwhea-link-merge-styles_2018-02-08-20-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Link: Update to use merge-styles",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mike@mikewheaton.ca"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.base.tsx b/packages/office-ui-fabric-react/src/components/Link/Link.base.tsx
new file mode 100644
index 0000000000000..d501f96825c68
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.base.tsx
@@ -0,0 +1,76 @@
+import * as React from 'react';
+import {
+  anchorProperties,
+  autobind,
+  BaseComponent,
+  buttonProperties,
+  classNamesFunction,
+  customizable,
+  getNativeProps
+} from '../../Utilities';
+import {
+  ILink,
+  ILinkProps,
+  ILinkStyleProps,
+  ILinkStyles
+} from './Link.types';
+
+const getClassNames = classNamesFunction<ILinkStyleProps, ILinkStyles>();
+
+@customizable('Link', ['theme', 'getStyles'])
+export class LinkBase extends BaseComponent<ILinkProps, any> implements ILink {
+  private _link: HTMLElement;
+
+  public render() {
+    let { disabled, children, className, href, theme, getStyles } = this.props;
+
+    const classNames = getClassNames(getStyles!, {
+      className,
+      isButton: !href,
+      isDisabled: disabled,
+      theme: theme!
+    });
+
+    const anchorElement: JSX.Element = (
+      <a
+        { ...getNativeProps(this.props, anchorProperties) }
+        className={ classNames.root }
+        onClick={ this._onClick }
+        ref={ this._resolveRef('_link') }
+        target={ this.props.target }
+        aria-disabled={ disabled }
+      >
+        { children }
+      </a>
+    );
+
+    const buttonElement: JSX.Element = (
+      <button
+        { ...getNativeProps(this.props, buttonProperties) }
+        className={ classNames.root }
+        onClick={ this._onClick }
+        ref={ this._resolveRef('_link') }
+        aria-disabled={ disabled }
+      >
+        { children }
+      </button>
+    );
+
+    return href ? anchorElement : buttonElement;
+  }
+
+  public focus() {
+    if (this._link) {
+      this._link.focus();
+    }
+  }
+
+  @autobind
+  private _onClick(ev: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>) {
+    let { onClick } = this.props;
+
+    if (onClick) {
+      onClick(ev);
+    }
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.scss b/packages/office-ui-fabric-react/src/components/Link/Link.scss
deleted file mode 100644
index 7f66f199ff4ac..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Link/Link.scss
+++ /dev/null
@@ -1,65 +0,0 @@
-@import '../../common/common';
-
-// Mixins: to be shared with Link.Example.scss
-@mixin root {
-  color: $ms-color-themePrimary;
-  margin: 0;
-  overflow: inherit;
-  padding: 0;
-  text-overflow: inherit;
-}
-
-@mixin isEnabled {
-  &:active,
-  &:hover,
-  &:active:hover {
-    color: $ms-color-themeDarker;
-  }
-
-  &:focus {
-    color: $ms-color-themePrimary;
-  }
-}
-
-@mixin isDisabled {
-  color: $ms-color-neutralTertiary;
-  pointer-events: none;
-  cursor: default;
-}
-
-// Element: ms-Link root component
-.root {
-  @include root;
-}
-
-// State: The button is not disabled.
-.isEnabled {
-  @include isEnabled;
-}
-
-// State: The button is disabled.
-.isDisabled {
-  @include isDisabled;
-}
-
-// Link implemented as a button.
-button.root {
-  @include focus-border;
-  @include text-align(left);
-  background: none;
-  border: none;
-  cursor: pointer;
-  display: inline;
-  font-size: inherit; // Ensure that we inherit font size, rather than the browser's default.
-
-  @include high-contrast {
-    // Using Highlight here so we still have a themeable system color that is different from both window text and link text.
-    color: Highlight;
-  }
-}
-
-// Link implemented as an anchor.
-a.root {
-  @include focus-outline;
-  text-decoration: none;
-}
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.styles.ts b/packages/office-ui-fabric-react/src/components/Link/Link.styles.ts
new file mode 100644
index 0000000000000..2fcca8da7bc8f
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.styles.ts
@@ -0,0 +1,62 @@
+import {
+  getFocusStyle,
+  HighContrastSelector
+} from '../../Styling';
+import {
+  ILinkStyleProps,
+  ILinkStyles
+} from './Link.types';
+
+export const getStyles = (props: ILinkStyleProps): ILinkStyles => {
+  const { className, isButton, isDisabled, theme } = props;
+  const { semanticColors } = theme;
+
+  return {
+    root: [
+      'ms-Link',
+      className,
+      getFocusStyle(theme),
+      {
+        color: semanticColors.link,
+      },
+      isButton && {
+        background: 'none',
+        border: 'none',
+        cursor: 'pointer',
+        display: 'inline',
+        fontSize: 'inherit',
+        margin: 0,
+        overflow: 'inherit',
+        padding: 0,
+        textAlign: 'left',
+        textOverflow: 'inherit',
+        selectors: {
+          [HighContrastSelector]: {
+            color: 'Highlight'
+          }
+        }
+      },
+      !isButton && {
+        textDecoration: 'none'
+      },
+      isDisabled && [
+        'is-disabled',
+        {
+          color: semanticColors.disabledText,
+          cursor: 'default',
+          pointerEvents: 'none'
+        }
+      ],
+      !isDisabled && {
+        selectors: {
+          '&:active, &:hover, &:active:hover': {
+            color: semanticColors.linkHovered
+          },
+          '&:focus': {
+            color: semanticColors.link
+          }
+        }
+      }
+    ]
+  };
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.test.tsx b/packages/office-ui-fabric-react/src/components/Link/Link.test.tsx
index 21c38f5ff3e17..c3d1734a7fc52 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.test.tsx
@@ -24,4 +24,9 @@ describe('Link', () => {
     let tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
+  it('renders Link with a custom class name', () => {
+    const component = renderer.create(<Link href='#' className='customClassName'>I'm a link</Link>);
+    let tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.tsx b/packages/office-ui-fabric-react/src/components/Link/Link.tsx
index 7e1a2b3028173..ee04fd30ea60f 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.tsx
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.tsx
@@ -1,71 +1,9 @@
-import * as React from 'react';
-import {
-  BaseComponent,
-  anchorProperties,
-  autobind,
-  buttonProperties,
-  css,
-  getNativeProps
-} from '../../Utilities';
-import { ILink, ILinkProps } from './Link.types';
-import * as stylesImport from './Link.scss';
-const styles: any = stylesImport;
-
-export class Link extends BaseComponent<ILinkProps, any> implements ILink {
-  private _link: HTMLElement;
-
-  public render() {
-    let { disabled, children, className, href } = this.props;
-
-    return (
-      href ? (
-        <a
-          { ...getNativeProps(this.props, anchorProperties) }
-          className={ css(
-            'ms-Link',
-            styles.root,
-            className,
-            disabled && ('is-disabled ' + styles.isDisabled),
-            !disabled && styles.isEnabled
-          ) }
-          onClick={ this._onClick }
-          ref={ this._resolveRef('_link') }
-          target={ this.props.target }
-          aria-disabled={ disabled }
-        >
-          { children }
-        </a>
-      ) : (
-          <button
-            { ...getNativeProps(this.props, buttonProperties) }
-            className={ css(
-              'ms-Link',
-              styles.root,
-              className,
-              disabled && ('is-disabled ' + styles.isDisabled),
-              !disabled && styles.isEnabled
-            ) }
-            onClick={ this._onClick }
-            ref={ this._resolveRef('_link') }
-            aria-disabled={ disabled }
-          >
-            { children }
-          </button>
-        ));
-  }
-
-  public focus() {
-    if (this._link) {
-      this._link.focus();
-    }
-  }
-
-  @autobind
-  private _onClick(ev: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>) {
-    let { onClick } = this.props;
-
-    if (onClick) {
-      onClick(ev);
-    }
-  }
-}
+import { styled } from '../../Utilities';
+import { LinkBase } from './Link.base';
+import { ILinkProps, ILinkStyleProps, ILinkStyles } from './Link.types';
+import { getStyles } from './Link.styles';
+
+export const Link = styled<ILinkProps, ILinkStyleProps, ILinkStyles>(
+  LinkBase,
+  getStyles
+);
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.types.ts b/packages/office-ui-fabric-react/src/components/Link/Link.types.ts
index d72ae7b73816b..9ada1d9d5aedf 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.types.ts
@@ -1,14 +1,20 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
-import { Link } from './Link';
+import { LinkBase } from './Link.base';
+
+import {
+  IStyle,
+  ITheme
+} from '../../Styling';
+import { IStyleFunction } from '../../Utilities';
 
 export interface ILink {
   /** Sets focus to the link. */
   focus(): void;
 }
 
-export interface ILinkProps extends React.AllHTMLAttributes<HTMLAnchorElement | HTMLButtonElement | HTMLElement | Link> {
+export interface ILinkProps extends React.AllHTMLAttributes<HTMLAnchorElement | HTMLButtonElement | HTMLElement | LinkBase> {
   /**
    * Optional callback to access the ILink interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
@@ -20,4 +26,24 @@ export interface ILinkProps extends React.AllHTMLAttributes<HTMLAnchorElement |
    */
   disabled?: boolean;
 
+  /**
+   * Call to provide customized styling that will layer on top of the variant rules.
+   */
+  getStyles?: IStyleFunction<ILinkProps, ILinkStyles>;
+
+  /**
+   * Theme (provided through customization.)
+   */
+  theme?: ITheme;
+}
+
+export interface ILinkStyleProps {
+  className?: string;
+  isButton?: boolean;
+  isDisabled?: boolean;
+  theme: ITheme;
 }
+
+export interface ILinkStyles {
+  root: IStyle;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap
index 5b5ab34cac8de..ab56a5c038c8a 100644
--- a/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap
@@ -3,7 +3,74 @@
 exports[`Link renders Link correctly 1`] = `
 <a
   aria-disabled={undefined}
-  className="ms-Link"
+  className=
+      ms-Link
+      {
+        color: #0078d7;
+        outline: transparent;
+        position: relative;
+        text-decoration: none;
+      }
+      &::-moz-focus-inner {
+        border: 0;
+      }
+      .ms-Fabric.is-focusVisible &:focus:after {
+        border: 1px solid #ffffff;
+        bottom: 1px;
+        content: "";
+        left: 1px;
+        outline: 1px solid #666666;
+        position: absolute;
+        right: 1px;
+        top: 1px;
+        z-index: 1;
+      }
+      &:active, &:hover, &:active:hover {
+        color: #004578;
+      }
+      &:focus {
+        color: #0078d7;
+      }
+  href="#"
+  onClick={[Function]}
+  target={undefined}
+>
+  I'm a link
+</a>
+`;
+
+exports[`Link renders Link with a custom class name 1`] = `
+<a
+  aria-disabled={undefined}
+  className=
+      ms-Link
+      customClassName
+      {
+        color: #0078d7;
+        outline: transparent;
+        position: relative;
+        text-decoration: none;
+      }
+      &::-moz-focus-inner {
+        border: 0;
+      }
+      .ms-Fabric.is-focusVisible &:focus:after {
+        border: 1px solid #ffffff;
+        bottom: 1px;
+        content: "";
+        left: 1px;
+        outline: 1px solid #666666;
+        position: absolute;
+        right: 1px;
+        top: 1px;
+        z-index: 1;
+      }
+      &:active, &:hover, &:active:hover {
+        color: #004578;
+      }
+      &:focus {
+        color: #0078d7;
+      }
   href="#"
   onClick={[Function]}
   target={undefined}
@@ -15,7 +82,52 @@ exports[`Link renders Link correctly 1`] = `
 exports[`Link renders Link with no href as a button 1`] = `
 <button
   aria-disabled={undefined}
-  className="ms-Link"
+  className=
+      ms-Link
+      {
+        background: none;
+        border: none;
+        color: #0078d7;
+        cursor: pointer;
+        display: inline;
+        font-size: inherit;
+        margin-bottom: 0px;
+        margin-left: 0px;
+        margin-right: 0px;
+        margin-top: 0px;
+        outline: transparent;
+        overflow: inherit;
+        padding-bottom: 0px;
+        padding-left: 0px;
+        padding-right: 0px;
+        padding-top: 0px;
+        position: relative;
+        text-align: left;
+        text-overflow: inherit;
+      }
+      &::-moz-focus-inner {
+        border: 0;
+      }
+      .ms-Fabric.is-focusVisible &:focus:after {
+        border: 1px solid #ffffff;
+        bottom: 1px;
+        content: "";
+        left: 1px;
+        outline: 1px solid #666666;
+        position: absolute;
+        right: 1px;
+        top: 1px;
+        z-index: 1;
+      }
+      @media screen and (-ms-high-contrast: active){& {
+        color: Highlight;
+      }
+      &:active, &:hover, &:active:hover {
+        color: #004578;
+      }
+      &:focus {
+        color: #0078d7;
+      }
   onClick={[Function]}
 >
   I'm a link as a button
@@ -25,7 +137,31 @@ exports[`Link renders Link with no href as a button 1`] = `
 exports[`Link renders disabled Link correctly 1`] = `
 <a
   aria-disabled={true}
-  className="ms-Link is-disabled undefined"
+  className=
+      ms-Link
+      is-disabled
+      {
+        color: #a6a6a6;
+        cursor: default;
+        outline: transparent;
+        pointer-events: none;
+        position: relative;
+        text-decoration: none;
+      }
+      &::-moz-focus-inner {
+        border: 0;
+      }
+      .ms-Fabric.is-focusVisible &:focus:after {
+        border: 1px solid #ffffff;
+        bottom: 1px;
+        content: "";
+        left: 1px;
+        outline: 1px solid #666666;
+        position: absolute;
+        right: 1px;
+        top: 1px;
+        z-index: 1;
+      }
   href="#"
   onClick={[Function]}
   target={undefined}
@@ -37,7 +173,48 @@ exports[`Link renders disabled Link correctly 1`] = `
 exports[`Link renders disabled Link with no href as a button correctly 1`] = `
 <button
   aria-disabled={true}
-  className="ms-Link is-disabled undefined"
+  className=
+      ms-Link
+      is-disabled
+      {
+        background: none;
+        border: none;
+        color: #a6a6a6;
+        cursor: default;
+        display: inline;
+        font-size: inherit;
+        margin-bottom: 0px;
+        margin-left: 0px;
+        margin-right: 0px;
+        margin-top: 0px;
+        outline: transparent;
+        overflow: inherit;
+        padding-bottom: 0px;
+        padding-left: 0px;
+        padding-right: 0px;
+        padding-top: 0px;
+        pointer-events: none;
+        position: relative;
+        text-align: left;
+        text-overflow: inherit;
+      }
+      &::-moz-focus-inner {
+        border: 0;
+      }
+      .ms-Fabric.is-focusVisible &:focus:after {
+        border: 1px solid #ffffff;
+        bottom: 1px;
+        content: "";
+        left: 1px;
+        outline: 1px solid #666666;
+        position: absolute;
+        right: 1px;
+        top: 1px;
+        z-index: 1;
+      }
+      @media screen and (-ms-high-contrast: active){& {
+        color: Highlight;
+      }
   disabled={true}
   onClick={[Function]}
 >
diff --git a/packages/office-ui-fabric-react/src/components/Link/examples/Link.Example.scss b/packages/office-ui-fabric-react/src/components/Link/examples/Link.Example.scss
index 52caecbff6f5a..6d8ae071e718d 100644
--- a/packages/office-ui-fabric-react/src/components/Link/examples/Link.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/Link/examples/Link.Example.scss
@@ -1,4 +1,4 @@
-@import '../Link.scss';
+@import '../../../common/common';
 
 // UHF overrides link color and state so we need to re-assign them for the website documentation
 :global {
@@ -6,17 +6,31 @@
     .ms-Link {
       // Element: ms-Link root component
       .root {
-        @include root;
+        color: $ms-color-themePrimary;
+        margin: 0;
+        overflow: inherit;
+        padding: 0;
+        text-overflow: inherit;
       }
 
       // State: The button is not disabled.
       .isEnabled {
-        @include isEnabled;
+        &:active,
+        &:hover,
+        &:active:hover {
+          color: $ms-color-themeDarker;
+        }
+
+        &:focus {
+          color: $ms-color-themePrimary;
+        }
       }
 
       // State: The button is disabled.
       .isDisabled {
-        @include isDisabled;
+        color: $ms-color-neutralTertiary;
+        pointer-events: none;
+        cursor: default;
       }
     }
   }
diff --git a/packages/styling/src/interfaces/ISemanticColors.ts b/packages/styling/src/interfaces/ISemanticColors.ts
index 257f5f31513de..09e46f2fcd9ac 100644
--- a/packages/styling/src/interfaces/ISemanticColors.ts
+++ b/packages/styling/src/interfaces/ISemanticColors.ts
@@ -265,6 +265,16 @@ export interface ISemanticColors {
    */
   listItemBackgroundCheckedHovered: string;
 
+  /**
+   * The color of a link.
+   */
+  link: string;
+
+  /**
+   * The color of a hovered link. Also used when the link is active.
+   */
+  linkHovered: string;
+
   //// DEPRECATED SLOTS
   // Do not use these slots, they are only maintained for backwards compatibility.
 
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index ae34f0f6f1d8d..a71a910780a2d 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -170,6 +170,9 @@ function _makeSemanticColorsFromPalette(p: IPalette, isInverted: boolean): ISema
     listItemBackgroundChecked: p.neutralLight,
     listItemBackgroundCheckedHovered: p.neutralQuaternaryAlt,
 
+    link: p.themePrimary,
+    linkHovered: p.themeDarker,
+
     // Deprecated slots, fixed by _fixDeprecatedSlots()
     listTextColor: ''
   };

From f0c4c5cfd1d20ea16af3378bf68e05269653d321 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Thu, 15 Feb 2018 18:45:17 -0800
Subject: [PATCH 1379/1641] FocusUtil: fix getPreviousElement to include
 previous sibling elements correctly (#3928)

* getPreviousChild would skip over siblings if a childmatch was found but not tabbable (with tabindex=0), this fixes that

* rush change

* add unit test for FocusTrapZone testing the behavior that is being fixed by this change

* update comment for the ut
---
 ...usFixFindPrevElement_2018-02-08-21-02.json |  11 ++
 .../FocusTrapZone/FocusTrapZone.test.tsx      | 152 ++++++++++++++++++
 packages/utilities/src/focus.ts               |  21 ++-
 3 files changed, 182 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/jspurlin-FocusFixFindPrevElement_2018-02-08-21-02.json
 create mode 100644 packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.test.tsx

diff --git a/common/changes/@uifabric/utilities/jspurlin-FocusFixFindPrevElement_2018-02-08-21-02.json b/common/changes/@uifabric/utilities/jspurlin-FocusFixFindPrevElement_2018-02-08-21-02.json
new file mode 100644
index 0000000000000..276943d8ecba7
--- /dev/null
+++ b/common/changes/@uifabric/utilities/jspurlin-FocusFixFindPrevElement_2018-02-08-21-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Focus: Fix getPreviousElement to correctly walk across previous siblings if a potential child match was found",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.test.tsx
new file mode 100644
index 0000000000000..3d99c4000e8db
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.test.tsx
@@ -0,0 +1,152 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+
+import * as ReactDOM from 'react-dom';
+import * as ReactTestUtils from 'react-dom/test-utils';
+import { KeyCodes } from '../../Utilities';
+
+import { FocusZone, FocusZoneDirection } from '../FocusZone';
+import { FocusTrapZone } from './FocusTrapZone';
+
+describe('FocusTrapZone', () => {
+  let lastFocusedElement: HTMLElement | undefined;
+  function _onFocus(ev: any) {
+    lastFocusedElement = ev.target;
+  }
+
+  function setupElement(element: HTMLElement, {
+    clientRect,
+    isVisible = true
+  }: {
+      clientRect: {
+        top: number;
+        left: number;
+        bottom: number;
+        right: number;
+      };
+      isVisible?: boolean;
+    }): void {
+    element.getBoundingClientRect = () => ({
+      top: clientRect.top,
+      left: clientRect.left,
+      bottom: clientRect.bottom,
+      right: clientRect.right,
+      width: clientRect.right - clientRect.left,
+      height: clientRect.bottom - clientRect.top
+    });
+
+    element.setAttribute('data-is-visible', String(isVisible));
+
+    element.focus = () => ReactTestUtils.Simulate.focus(element);
+  }
+
+  beforeEach(() => {
+    lastFocusedElement = undefined;
+  });
+
+  it('can tab across FocusZones with different button structures', () => {
+    const component = ReactTestUtils.renderIntoDocument(
+      <div { ...{ onFocusCapture: _onFocus } }>
+        <FocusTrapZone forceFocusInsideTrap={ false }>
+          <FocusZone direction={ FocusZoneDirection.horizontal } data-is-visible={ true }>
+            <div data-is-visible={ true }>
+              <button className='a'>a</button>
+            </div>
+            <div data-is-visible={ true }>
+              <button className='b'>b</button>
+            </div>
+            <div data-is-visible={ true }>
+              <button className='c'>c</button>
+            </div>
+          </FocusZone>
+          <FocusZone direction={ FocusZoneDirection.horizontal } data-is-visible={ true }>
+            <div data-is-visible={ true }>
+              <div data-is-visible={ true }>
+                <button className='d'>d</button>
+                <button className='e'>e</button>
+                <button className='f'>f</button>
+              </div>
+            </div>
+          </FocusZone>
+        </FocusTrapZone>
+      </div>
+    );
+
+    const focusTrapZone = ReactDOM.findDOMNode(component as React.ReactInstance) as Element;
+
+    const buttonA = focusTrapZone.querySelector('.a') as HTMLElement;
+    const buttonB = focusTrapZone.querySelector('.b') as HTMLElement;
+    const buttonC = focusTrapZone.querySelector('.c') as HTMLElement;
+    const buttonD = focusTrapZone.querySelector('.d') as HTMLElement;
+    const buttonE = focusTrapZone.querySelector('.e') as HTMLElement;
+    const buttonF = focusTrapZone.querySelector('.f') as HTMLElement;
+
+    // Assign bounding locations to buttons.
+    setupElement(buttonA, {
+      clientRect: {
+        top: 0,
+        bottom: 30,
+        left: 0,
+        right: 30
+      }
+    });
+
+    setupElement(buttonB, {
+      clientRect: {
+        top: 0,
+        bottom: 30,
+        left: 30,
+        right: 60
+      }
+    });
+
+    setupElement(buttonC, {
+      clientRect: {
+        top: 0,
+        bottom: 30,
+        left: 60,
+        right: 90
+      }
+    });
+
+    setupElement(buttonD, {
+      clientRect: {
+        top: 30,
+        bottom: 60,
+        left: 0,
+        right: 30
+      }
+    });
+
+    setupElement(buttonE, {
+      clientRect: {
+        top: 30,
+        bottom: 60,
+        left: 30,
+        right: 60
+      }
+    });
+
+    setupElement(buttonF, {
+      clientRect: {
+        top: 30,
+        bottom: 60,
+        left: 60,
+        right: 90
+      }
+    });
+
+    // Focus the first button.
+    ReactTestUtils.Simulate.focus(buttonA);
+    expect(lastFocusedElement).toBe(buttonA);
+
+    // Pressing shift + tab should go to d.
+    ReactTestUtils.Simulate.keyDown(buttonA, { which: KeyCodes.tab, shiftKey: true });
+    expect(lastFocusedElement).toBe(buttonD);
+
+    // Pressing tab should go to a.
+    ReactTestUtils.Simulate.keyDown(buttonD, { which: KeyCodes.tab });
+    expect(lastFocusedElement).toBe(buttonA);
+  });
+});
diff --git a/packages/utilities/src/focus.ts b/packages/utilities/src/focus.ts
index 984e3a3562d56..071bfde4ad2e6 100644
--- a/packages/utilities/src/focus.ts
+++ b/packages/utilities/src/focus.ts
@@ -99,8 +99,25 @@ export function getPreviousElement(
       allowFocusRoot,
       tabbable);
 
-    if (childMatch && ((tabbable && (isElementTabbable(childMatch, true))) || !tabbable)) {
-      return childMatch;
+    if (childMatch) {
+      if ((tabbable && (isElementTabbable(childMatch, true))) || !tabbable) {
+        return childMatch;
+      } else {
+        // Check previous sibling of the child match.
+        const childMatchSiblingMatch = getPreviousElement(
+          rootElement,
+          childMatch.previousElementSibling as HTMLElement,
+          true,
+          true,
+          true,
+          includeElementsInFocusZones,
+          allowFocusRoot,
+          tabbable
+        );
+        if (childMatchSiblingMatch) {
+          return childMatchSiblingMatch;
+        }
+      }
     }
   }
 

From 01b3c8a05ea5c33bd1a12bda479f7587f02eb8eb Mon Sep 17 00:00:00 2001
From: amyngu <31973030+amyngu@users.noreply.github.com>
Date: Thu, 15 Feb 2018 18:51:00 -0800
Subject: [PATCH 1380/1641] BaseExtendedPicker: Hook up onPaste (#3885)

* wire up onPaste

* changefile

* wire up onItemSelected

* use react events

* fix error

* prevent default and propagation on icon clicks

* expose input element

* add generic className for for editing item

* fix default className for editingItem

* prefix private function with underscore

* address PR comments
---
 .../amyngu-paste_2018-02-05-22-57.json         | 11 +++++++++++
 .../ExtendedPicker/BaseExtendedPicker.tsx      | 18 +++++++++++++++++-
 .../SelectedPeopleList/Items/EditingItem.tsx   |  2 +-
 .../Items/ExtendedSelectedItem.tsx             | 10 ++++++----
 4 files changed, 35 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/amyngu-paste_2018-02-05-22-57.json

diff --git a/common/changes/@uifabric/experiments/amyngu-paste_2018-02-05-22-57.json b/common/changes/@uifabric/experiments/amyngu-paste_2018-02-05-22-57.json
new file mode 100644
index 0000000000000..9e77194bb2d3b
--- /dev/null
+++ b/common/changes/@uifabric/experiments/amyngu-paste_2018-02-05-22-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Hook up onPaste for BaseExtendedPicker",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "amyngu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
index a814d81153d81..fda64e3fdbe45 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
@@ -70,10 +70,13 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
   }
 
   public focus(): void {
-    console.log('extended picker focus');
     this.focusZone.focus();
   }
 
+  public get inputElement(): HTMLInputElement {
+    return this.input.inputElement;
+  }
+
   public render(): JSX.Element {
     let { suggestedDisplayValue } = this.state;
     let {
@@ -116,6 +119,7 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
                 role='combobox'
                 disabled={ disabled }
                 aria-controls='selected-suggestion-alert'
+                onPaste={ this.onPaste }
               />) }
             </div>
           </SelectionZone>
@@ -207,6 +211,15 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
     this.selectedItemsList.onCopy(ev);
   }
 
+  @autobind
+  protected onPaste(ev: React.ClipboardEvent<Autofill | HTMLInputElement>): void {
+    if (this.props.onPaste) {
+      let inputText = ev.clipboardData.getData('Text');
+      ev.preventDefault();
+      this.props.onPaste(inputText);
+    }
+  }
+
   @autobind
   protected _isFocusZoneInnerKeystroke(ev: React.KeyboardEvent<HTMLElement>): boolean {
     // If suggestions are shown let up/down keys control them, otherwise allow them through to control the focusZone.
@@ -229,6 +242,9 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
   @autobind
   protected _onSuggestionSelected(item: T): void {
     this.selectedItemsList.addItems([item]);
+    if (this.props.onItemSelected) {
+      this.props.onItemSelected(item);
+    }
     this.input.clear();
 
     this.floatingPicker.hidePicker();
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx
index 17d6bb7b45502..6678b842fa3bd 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx
@@ -49,7 +49,7 @@ export class EditingItem extends BaseComponent<IEditingSelectedPeopleItemProps,
     const itemId = getId();
     const nativeProps = getNativeProps(this.props, inputProperties);
     return (
-      <div aria-labelledby={ 'editingItemPersona-' + itemId }>
+      <div aria-labelledby={ 'editingItemPersona-' + itemId } className={ 'ms-EditingItem' }>
         <input
           { ...nativeProps}
           ref={ this._resolveInputRef }
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx
index 8555a580eea3e..ca5d180fc8b64 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx
@@ -50,7 +50,7 @@ export class ExtendedSelectedItem extends BaseComponent<ISelectedPeopleItemProps
       >
         <div hidden={ !item.canExpand || onExpandItem === undefined }>
           <IconButton
-            onClick={ this.onClickIconButton(onExpandItem) }
+            onClick={ this._onClickIconButton(onExpandItem) }
             iconProps={ { iconName: 'Add', style: { fontSize: '14px' } } }
             className={ css('ms-PickerItem-removeButton', styles.expandButton, styles.actionButton) }
             ariaLabel={ removeButtonAriaLabel }
@@ -69,7 +69,7 @@ export class ExtendedSelectedItem extends BaseComponent<ISelectedPeopleItemProps
             />
           </div>
           <IconButton
-            onClick={ this.onClickIconButton(onRemoveItem) }
+            onClick={ this._onClickIconButton(onRemoveItem) }
             iconProps={ { iconName: 'Cancel', style: { fontSize: '14px' } } }
             className={ css('ms-PickerItem-removeButton', styles.removeButton, styles.actionButton) }
             ariaLabel={ removeButtonAriaLabel }
@@ -88,8 +88,10 @@ export class ExtendedSelectedItem extends BaseComponent<ISelectedPeopleItemProps
       </div >);
   }
 
-  private onClickIconButton = (action: (() => void) | undefined): () => void => {
-    return (): void => {
+  private _onClickIconButton(action: (() => void) | undefined): (ev: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>) => void {
+    return (ev: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>): void => {
+      ev.stopPropagation();
+      ev.preventDefault();
       if (action) {
         action();
       }

From 2bdbb7e44c9300861ea466b707829843781a35db Mon Sep 17 00:00:00 2001
From: Eigo Kawatani <e.k.dev@outlook.com>
Date: Fri, 16 Feb 2018 05:28:03 +0100
Subject: [PATCH 1381/1641] Added enum for triggering menu with arrow keys and
 bool to allow it or not (#3950)

* Added enum for triggering menu with arrow keys and bool to allow it or not

* Replaced the enum with KeyCode and removed the bool prop

* Fixed tslint error that broke the build

* Fixed the comment for the new prop
---
 ...button-configuration_2018-02-12-21-02.json | 11 +++
 .../src/components/Button/BaseButton.tsx      |  4 +-
 .../src/components/Button/Button.test.tsx     | 68 +++++++++++++++++++
 .../src/components/Button/Button.types.ts     |  8 ++-
 4 files changed, 89 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/add-menu-trigger-button-configuration_2018-02-12-21-02.json

diff --git a/common/changes/office-ui-fabric-react/add-menu-trigger-button-configuration_2018-02-12-21-02.json b/common/changes/office-ui-fabric-react/add-menu-trigger-button-configuration_2018-02-12-21-02.json
new file mode 100644
index 0000000000000..15267957479b9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/add-menu-trigger-button-configuration_2018-02-12-21-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added enum for triggering menu with arrow keys and bool to allow it or not",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "eikawata@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 7c0ec7e68e725..aa00e77d0dc64 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -506,7 +506,9 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       onMenuClick(ev, this);
     }
 
-    if (!ev.defaultPrevented && ev.which === KeyCodes.down) {
+    if (!ev.defaultPrevented &&
+      this.props.menuTriggerKeyCode !== null &&
+      ev.which === (this.props.menuTriggerKeyCode === undefined ? KeyCodes.down : this.props.menuTriggerKeyCode)) {
       this._onToggleMenu();
       ev.preventDefault();
       ev.stopPropagation();
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
index ade522285e157..b50f0b53f612c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
@@ -384,6 +384,74 @@ describe('Button', () => {
       expect(renderedDOM.getAttribute('aria-expanded')).toEqual('true');
     });
 
+    it('If menu trigger is disabled, pressing down does not trigger menu', () => {
+      const button = ReactTestUtils.renderIntoDocument<any>(
+        <DefaultButton
+          data-automation-id='test'
+          text='Create account'
+          menuTriggerKeyCode={ null }
+          menuProps={ {
+            items: [
+              {
+                key: 'emailMessage',
+                name: 'Email message',
+                icon: 'Mail'
+              },
+              {
+                key: 'calendarEvent',
+                name: 'Calendar event',
+                icon: 'Calendar'
+              }
+            ]
+          } }
+        />
+      );
+      const menuButtonDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+
+      ReactTestUtils.Simulate.keyDown(menuButtonDOM,
+        {
+          which: KeyCodes.down
+        });
+      expect(menuButtonDOM.getAttribute('aria-expanded')).toEqual('false');
+    });
+
+    it('If menu trigger is specefied, default key is overridden', () => {
+      const button = ReactTestUtils.renderIntoDocument<any>(
+        <DefaultButton
+          data-automation-id='test'
+          text='Create account'
+          menuTriggerKeyCode={ KeyCodes.right }
+          menuProps={ {
+            items: [
+              {
+                key: 'emailMessage',
+                name: 'Email message',
+                icon: 'Mail'
+              },
+              {
+                key: 'calendarEvent',
+                name: 'Calendar event',
+                icon: 'Calendar'
+              }
+            ]
+          } }
+        />
+      );
+      const menuButtonDOM = ReactDOM.findDOMNode(button as React.ReactInstance);
+
+      ReactTestUtils.Simulate.keyDown(menuButtonDOM,
+        {
+          which: KeyCodes.down
+        });
+      expect(menuButtonDOM.getAttribute('aria-expanded')).toEqual('false');
+
+      ReactTestUtils.Simulate.keyDown(menuButtonDOM,
+        {
+          which: KeyCodes.right
+        });
+      expect(menuButtonDOM.getAttribute('aria-expanded')).toEqual('true');
+    });
+
     describe('Response to click event', () => {
       let didClick = false;
       const setTrue = (): void => {
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.types.ts b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
index 8c14bdc82d636..223f1db8cd110 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
@@ -3,7 +3,7 @@ import { BaseButton } from './BaseButton';
 import { Button } from './Button';
 import { IButtonClassNames } from './BaseButton.classNames';
 import { ISplitButtonClassNames } from './SplitButton/SplitButton.classNames';
-import { IRenderFunction } from '../../Utilities';
+import { IRenderFunction, KeyCodes } from '../../Utilities';
 import { IContextualMenuProps } from '../../ContextualMenu';
 import { IIconProps } from '../../Icon';
 import { IStyle, ITheme } from '../../Styling';
@@ -223,6 +223,12 @@ export interface IButtonProps extends React.AllHTMLAttributes<HTMLAnchorElement
   getSplitButtonClassNames?: (disabled: boolean,
     expanded: boolean,
     checked: boolean) => ISplitButtonClassNames;
+
+  /**
+  * Provides a custom KeyCode that can be used to open the button menu.
+  * The default KeyCode is the down arrow. A value of null can be provided to disable the key codes for opening the button menu.
+  */
+  menuTriggerKeyCode?: KeyCodes | null;
 }
 
 export enum ElementType {

From 2f46771d5e1a63ff383bea6ad32c2cc5972dc2fb Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 15 Feb 2018 20:28:28 -0800
Subject: [PATCH 1382/1641] Update package.json

---
 scripts/package.json | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/scripts/package.json b/scripts/package.json
index 91ac68da3a252..09347162f9b8e 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -49,7 +49,7 @@
   "bundlesize": [
     {
       "path": "../apps/test-bundle-button/dist/main.min.js",
-      "maxSize": "43.0 kB"
+      "maxSize": "43.1 kB"
     }
   ]
-}
\ No newline at end of file
+}

From 44b167af31b9b6dd079359209f101f1af10762a5 Mon Sep 17 00:00:00 2001
From: John Miller <rubixws@gmail.com>
Date: Thu, 15 Feb 2018 21:31:06 -0800
Subject: [PATCH 1383/1641] Migrating Coachmark to main Package, Added a beak
 component and updated experiment PositioningContainer. (#3919)

* Adding beak and transfering beak functionality from Callout.

* Beak updates

* Removing junk and fixing getClassNames function.

* beak updates

* Adding the beak page and example page

* Adding canvas

* Adding new props to coachmark and beak as well as adding a definition.

* Moved beak to the Coachmark directory, started fixing the beak space issue. added a Triangle helper class.

* Fixing comment typo

* Updating the opacity

* Fixing the beak and element proximity

* updating element target

* Moving all folders and files over to the main package.

* Adding MouseEventType

* Adding additional beak properties

* Fixing some nits

* Updating styles to accept colors

* Removing random MouseEvent import and adding width height and color options to the coachmark.

* Refactoring Beak a bit.

* Adding more styling functionality to beak.

* updating props for beak.

* Adding mergeStyles to the coachmark example.

* Updating positioning container with latest bits from Callout.

* fixing some linting errors.

* Committing rush change files

* Removing coachmark types as it doesnt exist anymore.

* Removing Callout sass, its no longer needed.

* Removing positioning container page.

* fixing some nits

* Fixing pr comments.

* Making properties read only.

* Fixing gapspace/offset from target

* Removing beak positioning bits to coachmark and out form beak.

* Adding back isMouseInProximity state

* Removing mouseInProximity

* Adding a clarifying comment and fixing opacity bug.

* Adding clarifying comment

* Adding Basic tab Support.

* Removing console log

* Fixed animation bug with the innerHost

* Fixing nit

* nit

* Removing unsuded library triangle

* Fixing PR comments.

* Adding space for test

* Adding coachmark to the public website.

* updating casing

* Fixing a couple PR nits
---
 .../src/components/App/AppState.tsx           |   6 +
 .../Components/CoachmarkComponentPage.tsx     |  38 +++
 .../component-beak_2018-02-08-13-45.json      |  11 +
 .../component-beak_2018-02-08-13-45.json      |  11 +
 .../component-beak_2018-02-08-13-45.json      |  11 +
 .../experiments/src/PositioningContainer.ts   |   1 -
 .../src/components/Coachmark/Coachmark.tsx    | 230 --------------
 .../components/Coachmark/Coachmark.types.ts   |  52 ---
 .../experiments/src/demo/AppDefinition.tsx    |  12 -
 .../src/Coachmark.ts                          |   0
 .../components/Coachmark/Beak/Beak.styles.ts  |  35 +++
 .../src/components/Coachmark/Beak/Beak.tsx    |  56 ++++
 .../components/Coachmark/Beak/Beak.types.ts   |  46 +++
 .../components/Coachmark/Coachmark.styles.ts  | 100 +++---
 .../src/components/Coachmark/Coachmark.tsx    | 297 ++++++++++++++++++
 .../components/Coachmark/Coachmark.types.ts   |  93 ++++++
 .../components/Coachmark/CoachmarkPage.tsx    |   4 +-
 .../PositioningContainer.styles.ts            |   6 +-
 .../PositioningContainer.tsx                  |  71 +++--
 .../PositioningContainer.types.ts             |  15 +-
 .../PositioningContainerPage.tsx              |   0
 .../PositioningContainer.Basic.Example.tsx    |   0
 .../Coachmark}/PositioningContainer/index.ts  |   0
 .../examples/Coachmark.Basic.Example.tsx      |  45 ++-
 .../src/components/Coachmark/index.ts         |   0
 .../src/demo/AppDefinition.tsx                |   6 +
 26 files changed, 773 insertions(+), 373 deletions(-)
 create mode 100644 apps/fabric-website/src/pages/Components/CoachmarkComponentPage.tsx
 create mode 100644 common/changes/@uifabric/experiments/component-beak_2018-02-08-13-45.json
 create mode 100644 common/changes/@uifabric/utilities/component-beak_2018-02-08-13-45.json
 create mode 100644 common/changes/office-ui-fabric-react/component-beak_2018-02-08-13-45.json
 delete mode 100644 packages/experiments/src/PositioningContainer.ts
 delete mode 100644 packages/experiments/src/components/Coachmark/Coachmark.tsx
 delete mode 100644 packages/experiments/src/components/Coachmark/Coachmark.types.ts
 rename packages/{experiments => office-ui-fabric-react}/src/Coachmark.ts (100%)
 create mode 100644 packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.styles.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.types.ts
 rename packages/{experiments => office-ui-fabric-react}/src/components/Coachmark/Coachmark.styles.ts (80%)
 create mode 100644 packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.types.ts
 rename packages/{experiments => office-ui-fabric-react}/src/components/Coachmark/CoachmarkPage.tsx (90%)
 rename packages/{experiments/src/components => office-ui-fabric-react/src/components/Coachmark}/PositioningContainer/PositioningContainer.styles.ts (90%)
 rename packages/{experiments/src/components => office-ui-fabric-react/src/components/Coachmark}/PositioningContainer/PositioningContainer.tsx (88%)
 rename packages/{experiments/src/components => office-ui-fabric-react/src/components/Coachmark}/PositioningContainer/PositioningContainer.types.ts (92%)
 rename packages/{experiments/src/components => office-ui-fabric-react/src/components/Coachmark}/PositioningContainer/PositioningContainerPage.tsx (100%)
 rename packages/{experiments/src/components => office-ui-fabric-react/src/components/Coachmark}/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx (100%)
 rename packages/{experiments/src/components => office-ui-fabric-react/src/components/Coachmark}/PositioningContainer/index.ts (100%)
 rename packages/{experiments => office-ui-fabric-react}/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx (57%)
 rename packages/{experiments => office-ui-fabric-react}/src/components/Coachmark/index.ts (100%)

diff --git a/apps/fabric-website/src/components/App/AppState.tsx b/apps/fabric-website/src/components/App/AppState.tsx
index ff578e47e80df..91d89f2426659 100644
--- a/apps/fabric-website/src/components/App/AppState.tsx
+++ b/apps/fabric-website/src/components/App/AppState.tsx
@@ -137,6 +137,12 @@ export const AppState: IAppState = {
           component: () => <LoadingComponent title='Checkbox' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/CheckboxComponentPage').CheckboxComponentPage))
         },
+        {
+          title: 'Coachmark',
+          url: '#/components/coachmark',
+          component: () => <LoadingComponent title='Coachmark' />,
+          getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Components/CoachmarkComponentPage').CoachmarkComponentPage))
+        },
         {
           title: 'ChoiceGroup',
           url: '#/components/choicegroup',
diff --git a/apps/fabric-website/src/pages/Components/CoachmarkComponentPage.tsx b/apps/fabric-website/src/pages/Components/CoachmarkComponentPage.tsx
new file mode 100644
index 0000000000000..6096e06988736
--- /dev/null
+++ b/apps/fabric-website/src/pages/Components/CoachmarkComponentPage.tsx
@@ -0,0 +1,38 @@
+import * as React from 'react';
+import { CoachmarkPage } from 'office-ui-fabric-react/lib/components/Coachmark/CoachmarkPage';
+import { PageHeader } from '../../components/PageHeader/PageHeader';
+import { ComponentPage } from '../../components/ComponentPage/ComponentPage';
+const pageStyles: any = require('../PageStyles.module.scss');
+
+export class CoachmarkComponentPage extends React.Component<any, any> {
+  public render() {
+    return (
+      <div ref='pageElement' className={ pageStyles.basePage }>
+        <ComponentPage>
+          <PageHeader pageTitle='Coachmark' backgroundColor='#038387'
+            links={
+              [
+                {
+                  'text': 'Overview',
+                  'location': 'Overview'
+                },
+                {
+                  'text': 'Best Practices',
+                  'location': 'BestPractices'
+                },
+                {
+                  'text': 'Variants',
+                  'location': 'Variants'
+                },
+                {
+                  'text': 'Implementation',
+                  'location': 'Implementation'
+                }
+              ]
+            } />
+          <CoachmarkPage isHeaderVisible={ false } />
+        </ComponentPage>
+      </div>
+    );
+  }
+}
diff --git a/common/changes/@uifabric/experiments/component-beak_2018-02-08-13-45.json b/common/changes/@uifabric/experiments/component-beak_2018-02-08-13-45.json
new file mode 100644
index 0000000000000..34aab286454d2
--- /dev/null
+++ b/common/changes/@uifabric/experiments/component-beak_2018-02-08-13-45.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Removing Coachmark",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "miljo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/component-beak_2018-02-08-13-45.json b/common/changes/@uifabric/utilities/component-beak_2018-02-08-13-45.json
new file mode 100644
index 0000000000000..706e47ee22514
--- /dev/null
+++ b/common/changes/@uifabric/utilities/component-beak_2018-02-08-13-45.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Added a triangle abstraction class",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "miljo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/component-beak_2018-02-08-13-45.json b/common/changes/office-ui-fabric-react/component-beak_2018-02-08-13-45.json
new file mode 100644
index 0000000000000..776a42207c30b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/component-beak_2018-02-08-13-45.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Migrating Coachmark to main office-ui-fabrc-react package and adding a beak compoentn as well as updating  the experimental component PositioningContainer to reflect some of the latest bits in  Callout",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "miljo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/PositioningContainer.ts b/packages/experiments/src/PositioningContainer.ts
deleted file mode 100644
index ddecfbb4488e6..0000000000000
--- a/packages/experiments/src/PositioningContainer.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './components/PositioningContainer/index';
\ No newline at end of file
diff --git a/packages/experiments/src/components/Coachmark/Coachmark.tsx b/packages/experiments/src/components/Coachmark/Coachmark.tsx
deleted file mode 100644
index 8e41d4eeb3374..0000000000000
--- a/packages/experiments/src/components/Coachmark/Coachmark.tsx
+++ /dev/null
@@ -1,230 +0,0 @@
-// Utilities
-import * as React from 'react';
-import { BaseComponent, classNamesFunction } from '../../Utilities';
-
-// Component Dependencies
-import { PositioningContainer } from '../PositioningContainer/PositioningContainer';
-
-// Coachmark
-import { ICoachmarkProps } from './Coachmark.types';
-import { getStyles, ICoachmarkStyles, ICoachmarkStyleProps } from './Coachmark.styles';
-
-const getClassNames = classNamesFunction<ICoachmarkStyleProps, ICoachmarkStyles>();
-
-/**
- * An interface for the cached dimensions of entity inner host.
- */
-export interface IEntityRect {
-  width: number;
-  height: number;
-}
-
-export interface ICoachmarkState {
-  /**
-   * Is the Coachmark currently collapsed into
-   * a tear drop shape
-   */
-  collapsed: boolean;
-
-  /**
-   * Enables/Disables the beacon that radiates
-   * from the center of the coachmark.
-   */
-  isBeaconAnimating: boolean;
-
-  /**
-   * Is the teaching bubble currently retreiving the
-   * original dimensions of the hosted entity.
-   */
-  isMeasuring: boolean;
-
-  /**
-   * Cached width and height of _entityInnerHostElement
-   */
-  entityInnerHostRect: IEntityRect;
-
-  /**
-   * Is the mouse in proximity of the default target element
-   */
-  isMouseInProximity: boolean;
-}
-
-export class Coachmark extends BaseComponent<ICoachmarkProps, ICoachmarkState> {
-  public static defaultProps: Partial<ICoachmarkProps> = {
-    collapsed: true,
-    mouseProximityOffset: 100
-  };
-
-  /**
-   * The cached HTMLElement reference to the Entity Inner Host
-   * element.
-   */
-  private _entityInnerHostElement: HTMLElement;
-  private _translateAnimationContainer: HTMLElement;
-
-  constructor(props: ICoachmarkProps) {
-    super(props);
-
-    // Set defaults for state
-    this.state = {
-      collapsed: props.collapsed!,
-      isBeaconAnimating: true,
-      isMeasuring: true,
-      entityInnerHostRect: {
-        width: 0,
-        height: 0
-      },
-      isMouseInProximity: true
-    };
-  }
-
-  public render(): JSX.Element {
-    let {
-      children
-    } = this.props;
-
-    const classNames = getClassNames(getStyles, {
-      collapsed: this.state.collapsed,
-      isBeaconAnimating: this.state.isBeaconAnimating,
-      isMeasuring: this.state.isMeasuring,
-      entityHostHeight: this.state.entityInnerHostRect.height + 'px',
-      entityHostWidth: this.state.entityInnerHostRect.width + 'px'
-    });
-
-    return (
-      <PositioningContainer
-        target={ this.props.target }
-      >
-        <div
-          className={ classNames.root }
-        >
-          <div className={ classNames.pulsingBeacon } />
-          <div
-            className={ classNames.translateAnimationContainer }
-            ref={ this._resolveRef('_translateAnimationContainer') }
-          >
-            <div
-              className={ classNames.scaleAnimationLayer }
-              ref={ this._resolveRef('_scaleAnimationContainer') }
-            >
-              <div
-                className={ classNames.rotateAnimationLayer }
-                ref={ this._resolveRef('_rotateAnimationContainer') }
-              >
-                <div
-                  className={ classNames.entityHost }
-                  ref={ this._resolveRef('_entityHost') }
-                >
-                  <div
-                    className={ classNames.entityInnerHost }
-                    ref={ this._resolveRef('_entityInnerHostElement') }
-                  >
-                    { children }
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </PositioningContainer>
-    );
-  }
-
-  public componentWillReceiveProps(newProps: ICoachmarkProps): void {
-    if (this.props.collapsed && !newProps.collapsed) {
-      // The coachmark is about to open
-      this._openCoachmark();
-    }
-  }
-
-  public componentDidMount(): void {
-    // If we have already accessed the width and height
-    // We do not wan't to do it again.
-    if (this.state.isMeasuring) {
-      this._async.setTimeout((): void => {
-        if ((this.state.entityInnerHostRect.width + this.state.entityInnerHostRect.width) === 0) {
-          this.setState({
-            isMeasuring: false,
-            entityInnerHostRect: {
-              width: this._entityInnerHostElement.offsetWidth,
-              height: this._entityInnerHostElement.offsetHeight
-            }
-          });
-
-          this.forceUpdate();
-        }
-
-        // Initialize element in proximity now that initial
-        // measurements have been taken
-        this._isElementInProximity(this._entityInnerHostElement);
-      }, 10);
-    }
-  }
-
-  private _openCoachmark(): void {
-    this.setState({
-      collapsed: false
-    });
-
-    this._translateAnimationContainer.addEventListener('animationstart', (): void => {
-      if (this.props.onAnimationOpenStart) {
-        this.props.onAnimationOpenStart();
-      }
-    });
-
-    this._translateAnimationContainer.addEventListener('animationend', (): void => {
-      if (this.props.onAnimationOpenEnd) {
-        this.props.onAnimationOpenEnd();
-      }
-    });
-  }
-
-  private _isElementInProximity(targetElement: HTMLElement, mouseProximityOffset: number = 0): void {
-    /**
-     * An array of cached ids returned when setTimeout runs during
-     * the window resize event trigger.
-     */
-    let timeoutIds: number[] = [];
-
-    /**
-     * The target element the mouse would be in
-     * proximity to
-     */
-    let targetElementRect: ClientRect = targetElement.getBoundingClientRect();
-
-    // When the window resizes we want to async
-    // get the bounding client rectangle.
-    // Every time the event is triggered we wan't to
-    // setTimeout and then clear any previous instances
-    // of setTimeout.
-    this._events.on(window, 'resize', (): void => {
-      timeoutIds.forEach((value: number): void => {
-        clearInterval(value);
-      });
-
-      timeoutIds.push(this._async.setTimeout((): void => {
-        targetElementRect = targetElement.getBoundingClientRect();
-      }, 100));
-    });
-
-    // Everytime the document's mouse move is triggered
-    // we want to check if inside of an element and
-    // set the state with the result.
-    this._events.on(document, 'mousemove', (e: MouseEvent) => {
-      let mouseY = e.pageY;
-      let mouseX = e.pageX;
-      let isMouseInProximity = this._isInsideElement(targetElementRect, mouseX, mouseY);
-
-      if (isMouseInProximity !== this.state.isMouseInProximity) {
-        this.setState({
-          isMouseInProximity: isMouseInProximity
-        });
-      }
-    });
-  }
-
-  private _isInsideElement(elementRect: ClientRect, mouseX: number, mouseY: number, mouseProximityOffset: number = 0): boolean {
-    return mouseX > (elementRect.left - mouseProximityOffset) && mouseX < ((elementRect.left + elementRect.width) + mouseProximityOffset) &&
-      mouseY > (elementRect.top - mouseProximityOffset) && mouseY < ((elementRect.top + elementRect.height) + mouseProximityOffset);
-  }
-}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Coachmark/Coachmark.types.ts b/packages/experiments/src/components/Coachmark/Coachmark.types.ts
deleted file mode 100644
index 943e5e4ea562b..0000000000000
--- a/packages/experiments/src/components/Coachmark/Coachmark.types.ts
+++ /dev/null
@@ -1,52 +0,0 @@
-import * as React from 'react';
-import { Coachmark } from './Coachmark';
-import { ICoachmarkStyles, ICoachmarkStyleProps } from './Coachmark.styles';
-import { IPositioningContainerTypes } from '../PositioningContainer/PositioningContainer.types';
-import { IPoint, IStyleFunction } from '../../Utilities';
-
-export interface ICoachmark {
-}
-
-export interface ICoachmarkProps extends React.Props<Coachmark> {
-  /**
-  * All props for your component are to be defined here.
-  */
-  componentRef?: (component: ICoachmark) => void;
-
-  /**
-   * Get styles method
-   */
-  getStyles?: IStyleFunction<ICoachmarkStyleProps, ICoachmarkStyles>;
-
-  /**
-   * The target that the TeachingBubble should try to position itself based on.
-   * It can be either an HTMLElement a querySelector string of a valid HTMLElement
-   * or a MouseEvent. If MouseEvent is given then the origin point of the event will be used.
-   */
-  target?: HTMLElement | string | MouseEvent | IPoint | null;
-
-  positioningContainerProps?: IPositioningContainerTypes;
-
-  /**
-   * Is the Coachmark expanded
-   * @default true
-   */
-  collapsed?: boolean;
-
-  /**
-   * The distance in pixels the mouse is located
-   * before opening up the coachmark.
-   * @default 100
-   */
-  mouseProximityOffset?: number;
-
-  /**
-   * Callback when the opening animation begins
-   */
-  onAnimationOpenStart?: () => void;
-
-  /**
-   * Callback when the opening animation completes
-   */
-  onAnimationOpenEnd?: () => void;
-}
diff --git a/packages/experiments/src/demo/AppDefinition.tsx b/packages/experiments/src/demo/AppDefinition.tsx
index 705d2e5420d29..b009e29266e79 100644
--- a/packages/experiments/src/demo/AppDefinition.tsx
+++ b/packages/experiments/src/demo/AppDefinition.tsx
@@ -10,18 +10,6 @@ export const AppDefinition: IAppDefinition = {
   examplePages: [
     {
       links: [
-        {
-          component: require<any>('../components/PositioningContainer/PositioningContainerPage').PositioningContainerPage,
-          key: 'PositioningContainer',
-          name: 'PositioningContainer',
-          url: '#/examples/PositioningContainer'
-        },
-        {
-          component: require<any>('../components/Coachmark/CoachmarkPage').CoachmarkPage,
-          key: 'Coachmark',
-          name: 'Coachmark',
-          url: '#/examples/coachmark'
-        },
         {
           component: require<any>('../components/CommandBar/CommandBarPage').CommandBarPage,
           key: 'CommandBar',
diff --git a/packages/experiments/src/Coachmark.ts b/packages/office-ui-fabric-react/src/Coachmark.ts
similarity index 100%
rename from packages/experiments/src/Coachmark.ts
rename to packages/office-ui-fabric-react/src/Coachmark.ts
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.styles.ts b/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.styles.ts
new file mode 100644
index 0000000000000..84c6dc1626378
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.styles.ts
@@ -0,0 +1,35 @@
+import { IStyle, DefaultPalette } from '../../../Styling';
+import { IBeakStylesProps } from './Beak.types';
+
+export interface IBeakStyles {
+  /**
+   * Style for the root element in the default enabled/unchecked state.
+   */
+  root?: IStyle;
+  beak?: IStyle;
+}
+
+export function getStyles(props: IBeakStylesProps): IBeakStyles {
+  return {
+    root: [
+      {
+        position: 'absolute',
+        boxShadow: 'inherit',
+        border: 'none',
+        boxSizing: 'border-box',
+        transform: 'translateY(-50%)',
+        left: '50%',
+        width: props.width,
+        height: props.height
+      },
+      (props.left && props.top) && {
+        left: props.left,
+        top: props.top
+      }
+    ],
+    beak: {
+      fill: DefaultPalette.themePrimary,
+      display: 'block'
+    }
+  };
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.tsx b/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.tsx
new file mode 100644
index 0000000000000..110771aa50b5f
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.tsx
@@ -0,0 +1,56 @@
+import * as React from 'react';
+import {
+  BaseComponent,
+  css,
+  classNamesFunction
+} from '../../../Utilities';
+import { IBeakProps } from './Beak.types';
+import { getStyles, IBeakStyles } from './Beak.styles';
+import { getComboBoxOptionClassNames } from 'src/components/ComboBox/ComboBox.classNames';
+import { IBeakStylesProps } from './Beak.types';
+
+export interface IBeakState {
+  left: string | null;
+  top: string | null;
+}
+
+export class Beak extends BaseComponent<IBeakProps, IBeakState> {
+  constructor(props: IBeakProps) {
+    super(props);
+  }
+
+  public render(): JSX.Element {
+    const {
+      height = 18,
+      width = 18,
+      left,
+      top
+    } = this.props;
+
+    const getClassNames = classNamesFunction<IBeakStylesProps, IBeakStyles>();
+    const classNames = getClassNames(getStyles, {
+      left: this.props.left,
+      top: this.props.top,
+      height: height + 'px',
+      width: width + 'px'
+    });
+
+    const pointOne = width / 2 + ',' + 0;
+    const pointTwo = width + ',' + height;
+    const pointThree = 0 + ',' + height;
+
+    return (
+      <div
+        className={ css('ms-Beak', classNames.root) }
+      >
+        <svg
+          height={ height }
+          width={ width }
+          className={ classNames.beak }
+        >
+          <polygon points={ pointOne + ' ' + pointTwo + ' ' + pointThree } />
+        </svg>
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.types.ts b/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.types.ts
new file mode 100644
index 0000000000000..c1e19763100fb
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.types.ts
@@ -0,0 +1,46 @@
+import * as React from 'react';
+import { Beak } from './Beak';
+import { IPositionInfo } from '../PositioningContainer/PositioningContainer.types';
+
+export interface IBeak { }
+
+export interface IBeakProps extends React.Props<Beak> {
+  /**
+  * All props for your component are to be defined here.
+  */
+  componentRef?: (component: IBeak) => void;
+
+  /**
+   * Beak width.
+   * @default 18
+   */
+  width?: number;
+
+  /**
+   * Beak height.
+   * @default 18
+   */
+  height?: number;
+
+  /**
+   * Color of the beak
+   */
+  color?: string;
+
+  /**
+   * Left position of the beak
+   */
+  left?: string | null;
+
+  /**
+   * Top position of the beak
+   */
+  top?: string | null;
+}
+
+export interface IBeakStylesProps {
+  left?: string | null;
+  top?: string | null;
+  width?: string;
+  height?: string;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Coachmark/Coachmark.styles.ts b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.styles.ts
similarity index 80%
rename from packages/experiments/src/components/Coachmark/Coachmark.styles.ts
rename to packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.styles.ts
index e0c72a5dbf369..58164a257efb8 100644
--- a/packages/experiments/src/components/Coachmark/Coachmark.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.styles.ts
@@ -1,7 +1,5 @@
 import { IStyle, IRawStyle, keyframes } from '../../Styling';
 
-export const themePrimary = '#0078d7';
-
 export interface ICoachmarkStyleProps {
   /**
    * Is the Coachmark collapsed
@@ -28,6 +26,31 @@ export interface ICoachmarkStyleProps {
    * The width measured in pixels
    */
   entityHostWidth?: string;
+
+  /**
+   * Width of the coachmark
+   */
+  width?: string;
+
+  /**
+   * Height of the coachmark
+   */
+  height?: string;
+
+  /**
+   * Color
+   */
+  color?: string;
+
+  /**
+   * Beacon color one
+   */
+  beaconColorOne?: string;
+
+  /**
+   * Beacon color two
+   */
+  beaconColorTwo?: string;
 }
 
 export interface ICoachmarkStyles {
@@ -75,11 +98,7 @@ export interface ICoachmarkStyles {
   collapsed?: IStyle;
 }
 
-export const coachmarkCollapsedSize = '36px';
-export const beaconColorOne = '#00FFEC';
-export const beaconColorTwo = '#005EDD';
-
-function continuousPulseStepOne(): IRawStyle {
+function continuousPulseStepOne(beaconColorOne: string): IRawStyle {
   return {
     borderColor: beaconColorOne,
     borderWidth: '0px',
@@ -101,7 +120,7 @@ function continuousPulseStepThree(): IRawStyle {
   };
 }
 
-function continuousPulseStepFour(): IRawStyle {
+function continuousPulseStepFour(beaconColorTwo: string): IRawStyle {
   return {
     borderWidth: '0',
     width: '150px',
@@ -111,32 +130,12 @@ function continuousPulseStepFour(): IRawStyle {
   };
 }
 
-function continuousPulseStepFive(): IRawStyle {
-  return Object.assign(continuousPulseStepOne(), {
+function continuousPulseStepFive(beaconColorOne: string): IRawStyle {
+  return Object.assign(continuousPulseStepOne(beaconColorOne), {
     opacity: '0'
   });
 }
 
-export const ContinuousPulse: string = keyframes({
-  '0%': continuousPulseStepOne(),
-  '1.42%': continuousPulseStepTwo(),
-  '3.57%': continuousPulseStepThree(),
-  '7.14%': continuousPulseStepFour(),
-  '8%': continuousPulseStepFive(),
-  '29.99%': continuousPulseStepFive(),
-  '30%': continuousPulseStepOne(),
-  '31.42%': continuousPulseStepTwo(),
-  '33.57%': continuousPulseStepThree(),
-  '37.14%': continuousPulseStepFour(),
-  '38%': continuousPulseStepFive(),
-  '79.42%': continuousPulseStepFive(),
-  '79.43': continuousPulseStepOne(),
-  '81.85': continuousPulseStepTwo(),
-  '83.42': continuousPulseStepThree(),
-  '87%': continuousPulseStepFour(),
-  '100%': {}
-});
-
 export const translateOne: string = keyframes({
   '0%': {
     transform: 'translate(0, 0)', // orig 25
@@ -252,6 +251,26 @@ export const rotateOne: string = keyframes({
 });
 
 export function getStyles(props: ICoachmarkStyleProps): ICoachmarkStyles {
+  const ContinuousPulse: string = keyframes({
+    '0%': continuousPulseStepOne(props.beaconColorOne!),
+    '1.42%': continuousPulseStepTwo(),
+    '3.57%': continuousPulseStepThree(),
+    '7.14%': continuousPulseStepFour(props.beaconColorTwo!),
+    '8%': continuousPulseStepFive(props.beaconColorOne!),
+    '29.99%': continuousPulseStepFive(props.beaconColorOne!),
+    '30%': continuousPulseStepOne(props.beaconColorOne!),
+    '31.42%': continuousPulseStepTwo(),
+    '33.57%': continuousPulseStepThree(),
+    '37.14%': continuousPulseStepFour(props.beaconColorTwo!),
+    '38%': continuousPulseStepFive(props.beaconColorOne!),
+    '79.42%': continuousPulseStepFive(props.beaconColorOne!),
+    '79.43': continuousPulseStepOne(props.beaconColorOne!),
+    '81.85': continuousPulseStepTwo(),
+    '83.42': continuousPulseStepThree(),
+    '87%': continuousPulseStepFour(props.beaconColorTwo!),
+    '100%': {}
+  });
+
   return {
     root: [
       {
@@ -319,7 +338,8 @@ export function getStyles(props: ICoachmarkStyleProps): ICoachmarkStyles {
     rotateAnimationLayer: [
       {
         width: '100%',
-        height: '100%'
+        height: '100%',
+        opacity: '0.8'
       },
       props.collapsed && {
         animationDuration: '14s',
@@ -329,6 +349,9 @@ export function getStyles(props: ICoachmarkStyleProps): ICoachmarkStyles {
         animationDelay: '0s',
         animationFillMode: 'forwards',
         animationName: rotateOne
+      },
+      !props.collapsed && {
+        opacity: '1'
       }
     ],
     // Layer Host, defaults to collapsed
@@ -337,15 +360,14 @@ export function getStyles(props: ICoachmarkStyleProps): ICoachmarkStyles {
         position: 'relative',
         outline: 'none',
         overflow: 'hidden',
-        backgroundColor: themePrimary,
-        borderRadius: coachmarkCollapsedSize,
-        opacity: '0.8',
+        backgroundColor: props.color,
+        borderRadius: props.width,
         transition: 'border-radius 250ms, width 500ms, height 500ms cubic-bezier(0.5, 0, 0, 1)',
         visibility: 'hidden'
       },
-      (!props.isMeasuring) && {
-        width: coachmarkCollapsedSize,
-        height: coachmarkCollapsedSize,
+      !props.isMeasuring && {
+        width: props.width,
+        height: props.height,
         visibility: 'visible'
       },
       !props.collapsed && {
@@ -362,10 +384,12 @@ export function getStyles(props: ICoachmarkStyleProps): ICoachmarkStyles {
         transform: 'scale(0)'
       },
       (!props.collapsed) && {
+        width: props.entityHostWidth,
+        height: props.entityHostHeight,
         transform: 'scale(1)'
       },
       (!props.isMeasuring) && {
-        visibility: 'visible'
+        visibility: 'visible',
       }
     ]
   };
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.tsx b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.tsx
new file mode 100644
index 0000000000000..fa5b71968633d
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.tsx
@@ -0,0 +1,297 @@
+// Utilities
+import * as React from 'react';
+import { BaseComponent, classNamesFunction, autobind } from '../../Utilities';
+import { DefaultPalette } from '../../Styling';
+
+// Component Dependencies
+import { PositioningContainer } from './PositioningContainer/PositioningContainer';
+import { Beak } from './Beak/Beak';
+
+// Coachmark
+import { ICoachmarkTypes } from './Coachmark.types';
+import { getStyles, ICoachmarkStyles, ICoachmarkStyleProps } from './Coachmark.styles';
+import { FocusZone } from '../../FocusZone';
+
+const getClassNames = classNamesFunction<ICoachmarkStyleProps, ICoachmarkStyles>();
+
+/**
+ * An interface for the cached dimensions of entity inner host.
+ */
+export interface IEntityRect {
+  width: number;
+  height: number;
+}
+
+export interface ICoachmarkState {
+  /**
+   * Is the Coachmark currently collapsed into
+   * a tear drop shape
+   */
+  collapsed: boolean;
+
+  /**
+   * Enables/Disables the beacon that radiates
+   * from the center of the coachmark.
+   */
+  isBeaconAnimating: boolean;
+
+  /**
+   * Is the teaching bubble currently retreiving the
+   * original dimensions of the hosted entity.
+   */
+  isMeasuring: boolean;
+
+  /**
+   * Cached width and height of _entityInnerHostElement
+   */
+  entityInnerHostRect: IEntityRect;
+
+  /**
+   * Is the mouse in proximity of the default target element
+   */
+  isMouseInProximity: boolean;
+
+  /**
+   * The left position of the beak
+   */
+  beakLeft?: string | null;
+
+  /**
+   * The right position of the beak
+   */
+  beakTop?: string | null;
+}
+
+export class Coachmark extends BaseComponent<ICoachmarkTypes, ICoachmarkState> {
+  public static defaultProps: Partial<ICoachmarkTypes> = {
+    collapsed: true,
+    mouseProximityOffset: 100,
+    beakWidth: 26,
+    beakHeight: 12,
+    delayBeforeMouseOpen: 3600, // The approximate time the coachmark shows up
+    width: 36,
+    height: 36,
+    beaconColorOne: '#00FFEC',
+    beaconColorTwo: '#005EDD',
+    color: DefaultPalette.themePrimary
+  };
+
+  /**
+   * The cached HTMLElement reference to the Entity Inner Host
+   * element.
+   */
+  private _entityInnerHostElement: HTMLElement;
+  private _translateAnimationContainer: HTMLElement;
+  private _entityHost: HTMLElement;
+  private _positioningContainer: PositioningContainer;
+
+  constructor(props: ICoachmarkTypes) {
+    super(props);
+
+    // Set defaults for state
+    this.state = {
+      collapsed: props.collapsed!,
+      isBeaconAnimating: true,
+      isMeasuring: true,
+      entityInnerHostRect: {
+        width: 0,
+        height: 0
+      },
+      isMouseInProximity: false
+    };
+  }
+
+  public render(): JSX.Element {
+    let {
+      children,
+      beakWidth,
+      beakHeight,
+      target,
+      width,
+      height,
+      color,
+      beaconColorOne,
+      beaconColorTwo
+    } = this.props;
+
+    const classNames = getClassNames(getStyles, {
+      collapsed: this.state.collapsed,
+      isBeaconAnimating: this.state.isBeaconAnimating,
+      isMeasuring: this.state.isMeasuring,
+      entityHostHeight: this.state.entityInnerHostRect.height + 'px',
+      entityHostWidth: this.state.entityInnerHostRect.width + 'px',
+      width: width + 'px',
+      height: height + 'px',
+      color: color,
+      beaconColorOne: beaconColorOne,
+      beaconColorTwo: beaconColorTwo
+    });
+
+    return (
+      <PositioningContainer
+        target={ target }
+        offsetFromTarget={ beakHeight }
+        componentRef={ this._resolveRef('_positioningContainer') }
+      >
+        <div className={ classNames.root }>
+          <div className={ classNames.pulsingBeacon } />
+          <div
+            className={ classNames.translateAnimationContainer }
+            ref={ this._resolveRef('_translateAnimationContainer') }
+          >
+            <div className={ classNames.scaleAnimationLayer }>
+              <div className={ classNames.rotateAnimationLayer }>
+                {
+                  this._positioningContainer && <Beak
+                    width={ beakWidth }
+                    height={ beakHeight }
+                    left={ this.state.beakLeft }
+                    top={ this.state.beakTop }
+                  />
+                }
+                <FocusZone>
+                  <div
+                    className={ classNames.entityHost }
+                    ref={ this._resolveRef('_entityHost') }
+                    data-is-focusable={ true }
+                    onFocus={ this._onFocusHandler }
+                  >
+                    <div
+                      className={ classNames.entityInnerHost }
+                      ref={ this._resolveRef('_entityInnerHostElement') }
+                    >
+                      { children }
+                    </div>
+                  </div>
+                </FocusZone>
+              </div>
+            </div>
+          </div>
+        </div>
+      </PositioningContainer>
+    );
+  }
+
+  public componentWillReceiveProps(newProps: ICoachmarkTypes): void {
+    if (this.props.collapsed && !newProps.collapsed) {
+      // The coachmark is about to open
+      this._openCoachmark();
+    }
+  }
+
+  public componentDidMount(): void {
+    this._async.requestAnimationFrame(((): void => {
+      if ((this.state.entityInnerHostRect.width + this.state.entityInnerHostRect.width) === 0) {
+
+        // @TODO Eventually we need to add the various directions
+        const beakLeft = (this.props.width! / 2) - (this.props.beakWidth! / 2);
+        const beakTop = 0;
+
+        this.setState({
+          isMeasuring: false,
+          entityInnerHostRect: {
+            width: this._entityInnerHostElement.offsetWidth,
+            height: this._entityInnerHostElement.offsetHeight
+          },
+          beakLeft: beakLeft + 'px',
+          beakTop: beakTop + 'px'
+        });
+
+        this.forceUpdate();
+      }
+
+      // We dont want to the user to immediatley trigger the coachmark when it's opened
+      this._async.setTimeout(() => {
+        this._addProximityHandler(100);
+      }, this.props.delayBeforeMouseOpen!);
+    }));
+  }
+
+  @autobind
+  private _onFocusHandler(): void {
+    this._openCoachmark();
+  }
+
+  @autobind
+  private _openCoachmark(): void {
+    this.setState({
+      collapsed: false
+    });
+
+    this._translateAnimationContainer.addEventListener('animationstart', (): void => {
+      if (this.props.onAnimationOpenStart) {
+        this.props.onAnimationOpenStart();
+      }
+    });
+
+    this._translateAnimationContainer.addEventListener('animationend', (): void => {
+      if (this.props.onAnimationOpenEnd) {
+        this.props.onAnimationOpenEnd();
+      }
+    });
+  }
+
+  private _addProximityHandler(mouseProximityOffset: number = 0): void {
+    /**
+     * An array of cached ids returned when setTimeout runs during
+     * the window resize event trigger.
+     */
+    let timeoutIds: number[] = [];
+
+    /**
+     * The target element the mouse would be in
+     * proximity to
+     */
+    let targetElementRect: ClientRect;
+
+    // Take the initial measure out of the initial render to prevent
+    // an unnessecary render.
+    this._async.setTimeout(() => {
+      targetElementRect = this._entityInnerHostElement.getBoundingClientRect();
+
+      // When the window resizes we want to async
+      // get the bounding client rectangle.
+      // Every time the event is triggered we want to
+      // setTimeout and then clear any previous instances
+      // of setTimeout.
+      this._events.on(window, 'resize', (): void => {
+        timeoutIds.forEach((value: number): void => {
+          clearInterval(value);
+        });
+
+        timeoutIds.push(this._async.setTimeout((): void => {
+          targetElementRect = this._entityInnerHostElement.getBoundingClientRect();
+        }, 100));
+      });
+    }, 10);
+
+    // Every time the document's mouse move is triggered
+    // we want to check if inside of an element and
+    // set the state with the result.
+    this._events.on(document, 'mousemove', (e: MouseEvent) => {
+      let mouseY = e.pageY;
+      let mouseX = e.pageX;
+      let isMouseInProximity = this._isInsideElement(mouseX, mouseY, targetElementRect, mouseProximityOffset);
+
+      if (isMouseInProximity !== this.state.isMouseInProximity) {
+        // We don't want to update the isMouseInProximtiy state because
+        // The coachmark only opens and does not collapse.
+        // Setting isMouseInProximity here will cause the coachmark to open and close
+        this.setState({
+          collapsed: !isMouseInProximity
+        });
+      }
+
+      if (this.props.onMouseMove) {
+        this.props.onMouseMove(e);
+      }
+    });
+  }
+
+  private _isInsideElement(mouseX: number, mouseY: number, elementRect: ClientRect, mouseProximityOffset: number = 0): boolean {
+    return mouseX > (elementRect.left - mouseProximityOffset) &&
+      mouseX < ((elementRect.left + elementRect.width) + mouseProximityOffset) &&
+      mouseY > (elementRect.top - mouseProximityOffset) &&
+      mouseY < ((elementRect.top + elementRect.height) + mouseProximityOffset);
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.types.ts b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.types.ts
new file mode 100644
index 0000000000000..08cd9fc1a453a
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.types.ts
@@ -0,0 +1,93 @@
+import * as React from 'react';
+import { Coachmark } from './Coachmark';
+import { ICoachmarkStyles, ICoachmarkStyleProps } from './Coachmark.styles';
+import { IPositioningContainerTypes } from './PositioningContainer/PositioningContainer.types';
+import { IPoint, IStyleFunction } from '../../Utilities';
+
+export interface ICoachmark {
+}
+
+export interface ICoachmarkTypes extends React.Props<Coachmark> {
+  componentRef?: (component: ICoachmark) => void;
+
+  /**
+   * Get styles method.
+   */
+  getStyles?: IStyleFunction<ICoachmarkStyleProps, ICoachmarkStyles>;
+
+  /**
+   * The target that the TeachingBubble should try to position itself based on.
+   */
+  target: HTMLElement;
+
+  positioningContainerProps?: IPositioningContainerTypes;
+
+  /**
+   * The starting collapsed state for the Coachmark?
+   * @default true
+   */
+  collapsed?: boolean;
+
+  /**
+   * The distance in pixels the mouse is located
+   * before opening up the coachmark.
+   * @default 100
+   */
+  mouseProximityOffset?: number;
+
+  /**
+   * Callback when the opening animation begins.
+   */
+  onAnimationOpenStart?: () => void;
+
+  /**
+   * Callback when the opening animation completes.
+   */
+  onAnimationOpenEnd?: () => void;
+
+  /**
+   * The width of the beak component.
+   */
+  beakWidth?: number;
+
+  /**
+   * The height of the beak component
+   */
+  beakHeight?: number;
+
+  /**
+   * Delay before allowing mouse movements to open
+   * the Coachmark
+   */
+  delayBeforeMouseOpen?: number;
+
+  /**
+   * Runs every time the mouse moves
+   */
+  onMouseMove?: (e: MouseEvent) => void;
+
+  /**
+   * The width of the coachmark
+   */
+  width?: number;
+
+  /**
+   * The height of the coachmark
+   */
+  height?: number;
+
+  /**
+   * Color
+   */
+  color?: string;
+
+  /**
+   * Beacon color one
+   */
+  beaconColorOne?: string;
+
+  /**
+   * Beacon color two
+   */
+  beaconColorTwo?: string;
+}
diff --git a/packages/experiments/src/components/Coachmark/CoachmarkPage.tsx b/packages/office-ui-fabric-react/src/components/Coachmark/CoachmarkPage.tsx
similarity index 90%
rename from packages/experiments/src/components/Coachmark/CoachmarkPage.tsx
rename to packages/office-ui-fabric-react/src/components/Coachmark/CoachmarkPage.tsx
index b82bd9ac3b46b..458642ae39327 100644
--- a/packages/experiments/src/components/Coachmark/CoachmarkPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/CoachmarkPage.tsx
@@ -8,7 +8,7 @@ import {
 
 import { CoachmarkBasicExample } from './examples/Coachmark.Basic.Example';
 const CoachmarkBasicExampleCode =
-  require('!raw-loader!experiments/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx') as string;
+  require('!raw-loader!office-ui-fabric-react/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx') as string;
 
 export class CoachmarkPage extends React.Component<IComponentDemoPageProps, {}> {
   public render(): JSX.Element {
@@ -26,7 +26,7 @@ export class CoachmarkPage extends React.Component<IComponentDemoPageProps, {}>
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!experiments/src/components/coachmark/Coachmark.types.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Coachmark/Coachmark.types.ts')
             ] }
           />
         }
diff --git a/packages/experiments/src/components/PositioningContainer/PositioningContainer.styles.ts b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.styles.ts
similarity index 90%
rename from packages/experiments/src/components/PositioningContainer/PositioningContainer.styles.ts
rename to packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.styles.ts
index 5d0a4e80c5ef6..210f64e66ae09 100644
--- a/packages/experiments/src/components/PositioningContainer/PositioningContainer.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.styles.ts
@@ -1,6 +1,6 @@
-import { memoizeFunction } from '../../Utilities';
-import { mergeStyleSets } from '../../Styling';
-import { IStyle } from '../../Styling';
+import { memoizeFunction } from '../../../Utilities';
+import { mergeStyleSets } from '../../../Styling';
+import { IStyle } from '../../../Styling';
 
 export interface IPositioningContainerStyles {
   /**
diff --git a/packages/experiments/src/components/PositioningContainer/PositioningContainer.tsx b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.tsx
similarity index 88%
rename from packages/experiments/src/components/PositioningContainer/PositioningContainer.tsx
rename to packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.tsx
index 97e97898ce4f0..39250cf4088be 100644
--- a/packages/experiments/src/components/PositioningContainer/PositioningContainer.tsx
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.tsx
@@ -18,36 +18,42 @@ import {
   focusFirstChild,
   getWindow,
   getDocument
-} from '../../Utilities';
+} from '../../../Utilities';
 
 import {
   getRelativePositions,
   IPositionProps,
   getMaxHeight,
-  ICalloutPositon
+  ICalloutPositon,
+  positionElement,
+  IPositionedData,
+  RectangleEdge
 } from 'office-ui-fabric-react/lib/utilities/positioning';
 
-import { AnimationClassNames, mergeStyles } from '../../Styling';
+import {
+  IPositionInfo
+} from './PositioningContainer.types';
 
-export interface IPositionInfo {
-  calloutPosition: ICalloutPositon;
-  beakPosition: { position: ICalloutPositon, display: string };
-  directionalClassName: string;
-  submenuDirection: DirectionalHint;
-}
+import { AnimationClassNames, mergeStyles } from '../../../Styling';
 
 const OFF_SCREEN_STYLE = { opacity: 0 };
 
 // In order for some of the max height logic to work
-// properly we need to set the border needs to be set.
+// properly we need to set the border.
 // The value is abitrary.
 const BORDER_WIDTH = 1;
+const SLIDE_ANIMATIONS: { [key: number]: string; } = {
+  [RectangleEdge.top]: 'slideUpIn20',
+  [RectangleEdge.bottom]: 'slideDownIn20',
+  [RectangleEdge.left]: 'slideLeftIn20',
+  [RectangleEdge.right]: 'slideRightIn20'
+};
 
 export interface IPositioningContainerState {
   /**
    * Current set of calcualted positions for the outermost parent container.
    */
-  positions?: IPositionInfo;
+  positions?: IPositionedData;
 
   /**
    * Tracks the current height offset and updates during
@@ -153,12 +159,10 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
     let { positions } = this.state;
 
     const styles = getClassNames();
-    let directionalClassName = '';
 
-    if (positions && positions.directionalClassName) {
-      // tslint:disable-next-line:no-any
-      directionalClassName = (AnimationClassNames as any)[positions.directionalClassName];
-    }
+    let directionalClassName = (positions && positions.targetEdge)
+      ? (AnimationClassNames as any)[SLIDE_ANIMATIONS[positions.targetEdge]]
+      : '';
 
     let getContentMaxHeight: number = this._getMaxHeight() + this.state.heightOffset!;
     let contentMaxHeight: number = positioningContainerMaxHeight!
@@ -178,13 +182,13 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
               !!positioningContainerWidth && { width: positioningContainerWidth }
             ) }
           // tslint:disable-next-line:jsx-ban-props
-          style={ positions ? positions.calloutPosition : OFF_SCREEN_STYLE }
+          style={ positions ? positions.elementPosition : OFF_SCREEN_STYLE }
           tabIndex={ -1 } // Safari and Firefox on Mac OS requires this to back-stop click events so focus remains in the Callout.
           // See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus
           ref={ this._resolveRef('_contentHost') }
         >
           { children }
-          { // @TODO apply  to the content container
+          { // @TODO apply to the content container
             contentMaxHeight
           }
         </div>
@@ -262,7 +266,12 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
   }
 
   private _updatePosition(): void {
-    let { positions } = this.state;
+    const { positions } = this.state;
+    const {
+      offsetFromTarget,
+      onPositioned
+    } = this.props;
+
     let hostElement: HTMLElement = this._positionedHost;
     let positioningContainerElement: HTMLElement = this._contentHost;
 
@@ -271,7 +280,8 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
       currentProps = assign(currentProps, this.props);
       currentProps!.bounds = this._getBounds();
       currentProps!.target = this._target!;
-      let newPositions: IPositionInfo = getRelativePositions(currentProps!, hostElement, positioningContainerElement);
+      currentProps!.gapSpace = offsetFromTarget;
+      let newPositions: IPositionedData = positionElement(currentProps!, hostElement, positioningContainerElement);
 
       // Set the new position only when the positions are not exists or one of the new positioningContainer positions are different.
       // The position should not change if the position is within 2 decimal places.
@@ -286,8 +296,8 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
         });
       } else {
         this._positionAttempts = 0;
-        if (this.props.onPositioned) {
-          this.props.onPositioned();
+        if (onPositioned) {
+          onPositioned();
         }
       }
     }
@@ -317,11 +327,16 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
    * without going out of the specified bounds
    */
   private _getMaxHeight(): number {
-    // If the max height is undefined.
+    const {
+      directionalHintFixed,
+      offsetFromTarget,
+      directionalHint
+    } = this.props;
+
     if (!this._maxHeight) {
-      // if the directional hint is fixed and our target Exists
-      if (this.props.directionalHintFixed && this._target) {
-        this._maxHeight = getMaxHeight(this._target, this.props.directionalHint!, this.props.offsetFromTarget, this._getBounds());
+      if (directionalHintFixed && this._target) {
+        let gapSpace = offsetFromTarget ? offsetFromTarget : 0;
+        this._maxHeight = getMaxHeight(this._target, directionalHint!, gapSpace, this._getBounds());
       } else {
         this._maxHeight = this._getBounds().height! - BORDER_WIDTH * 2;
       }
@@ -329,8 +344,8 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
     return this._maxHeight!;
   }
 
-  private _arePositionsEqual(positions: IPositionInfo, newPosition: IPositionInfo): boolean {
-    return this._comparePositions(positions.calloutPosition, newPosition.calloutPosition);
+  private _arePositionsEqual(positions: IPositionedData, newPosition: IPositionedData): boolean {
+    return this._comparePositions(positions.elementPosition, newPosition.elementPosition);
   }
 
   private _comparePositions(oldPositions: ICalloutPositon, newPositions: ICalloutPositon): boolean {
diff --git a/packages/experiments/src/components/PositioningContainer/PositioningContainer.types.ts b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.types.ts
similarity index 92%
rename from packages/experiments/src/components/PositioningContainer/PositioningContainer.types.ts
rename to packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.types.ts
index ff6e4c1a1ce41..605d2f81b629f 100644
--- a/packages/experiments/src/components/PositioningContainer/PositioningContainer.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.types.ts
@@ -4,11 +4,24 @@ import { DirectionalHint } from 'office-ui-fabric-react/lib/common/DirectionalHi
 import {
   IPoint,
   IRectangle
-} from '../../Utilities';
+} from '../../../Utilities';
+import {
+  getRelativePositions,
+  IPositionProps,
+  getMaxHeight,
+  ICalloutPositon
+} from 'office-ui-fabric-react/lib/utilities/positioning';
 
 export interface IPositioningContainer {
 }
 
+export interface IPositionInfo {
+  calloutPosition: ICalloutPositon;
+  beakPosition: { position: ICalloutPositon, display: string };
+  directionalClassName: string;
+  submenuDirection: DirectionalHint;
+}
+
 export interface IPositioningContainerTypes extends React.Props<PositioningContainer> {
   /**
   * All props for your component are to be defined here.
diff --git a/packages/experiments/src/components/PositioningContainer/PositioningContainerPage.tsx b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainerPage.tsx
similarity index 100%
rename from packages/experiments/src/components/PositioningContainer/PositioningContainerPage.tsx
rename to packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainerPage.tsx
diff --git a/packages/experiments/src/components/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx
similarity index 100%
rename from packages/experiments/src/components/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx
rename to packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx
diff --git a/packages/experiments/src/components/PositioningContainer/index.ts b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/index.ts
similarity index 100%
rename from packages/experiments/src/components/PositioningContainer/index.ts
rename to packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/index.ts
diff --git a/packages/experiments/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx
similarity index 57%
rename from packages/experiments/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx
rename to packages/office-ui-fabric-react/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx
index cd445deb2cffa..a4d6fe302bf10 100644
--- a/packages/experiments/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx
@@ -3,13 +3,34 @@ import { Coachmark } from '../Coachmark';
 import { TeachingBubbleContent } from 'office-ui-fabric-react/lib/TeachingBubble';
 import { ICalloutProps } from 'office-ui-fabric-react/lib/Callout';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
+import { IStyle, DefaultPalette } from '../../../Styling';
+import {
+  BaseComponent,
+  assign,
+  autobind,
+  classNamesFunction
+} from 'office-ui-fabric-react/lib/Utilities';
 
 export interface ICoachmarkBasicExampleState {
   isVisible?: boolean;
   isCoachmarkCollapsed?: boolean;
+  targetElement?: HTMLElement;
 }
 
-export class CoachmarkBasicExample extends React.Component<{}, ICoachmarkBasicExampleState> {
+export interface ICoachmarkBasicExampleStyles {
+  /**
+   * Style for the root element in the default enabled/unchecked state.
+   */
+  root?: IStyle;
+
+  /**
+   * The example button container
+   */
+  buttonContainer: IStyle;
+}
+
+export class CoachmarkBasicExample extends BaseComponent<{}, ICoachmarkBasicExampleState> {
+  private _targetButton: HTMLElement;
 
   public constructor(props: {}) {
     super(props);
@@ -30,18 +51,30 @@ export class CoachmarkBasicExample extends React.Component<{}, ICoachmarkBasicEx
       doNotLayer: true
     };
 
+    const getClassNames = classNamesFunction<{}, ICoachmarkBasicExampleStyles>();
+    const classNames = getClassNames(() => {
+      return {
+        root: {},
+        buttonContainer: {
+          display: 'inline-block'
+        }
+      };
+    });
+
     return (
-      <div className='ms-CoachmarkBasicExample'>
-        <div className='ms-CoachmarkBasicExample-buttonArea'>
+      <div className={ classNames.root }>
+        <div
+          className={ classNames.buttonContainer }
+          ref={ this._resolveRef('_targetButton') }
+        >
           <DefaultButton
             onClick={ this._onShowMenuClicked }
-            text={ isVisible ? 'Hide coachmark' : 'Show coachmark' }
-            className={ 'ms-Coachmark-basicExampleButton' }
+            text={ isVisible ? 'Hide Coachmark' : 'Show Coachmark' }
           />
         </div>
         { isVisible && (
           <Coachmark
-            target={ '.ms-Coachmark-basicExampleButton' }
+            target={ this._targetButton }
           >
             <TeachingBubbleContent
               headline='Example Title'
diff --git a/packages/experiments/src/components/Coachmark/index.ts b/packages/office-ui-fabric-react/src/components/Coachmark/index.ts
similarity index 100%
rename from packages/experiments/src/components/Coachmark/index.ts
rename to packages/office-ui-fabric-react/src/components/Coachmark/index.ts
diff --git a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
index 8af25e6e9211d..31b1229fc9fcb 100644
--- a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
+++ b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
@@ -52,6 +52,12 @@ export const AppDefinition: IAppDefinition = {
           name: 'Checkbox',
           url: '#/examples/checkbox'
         },
+        {
+          component: require<any>('../components/Coachmark/CoachmarkPage').CoachmarkPage,
+          key: 'Coachmark',
+          name: 'Coachmark',
+          url: '#/examples/coachmark'
+        },
         {
           component: require<any>('../components/ChoiceGroup/ChoiceGroupPage').ChoiceGroupPage,
           key: 'ChoiceGroup',

From fc92bb8c7227abdda66c7af1b3fc67a5a8f6190c Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 16 Feb 2018 03:23:29 -0800
Subject: [PATCH 1384/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 19 +++++++
 apps/fabric-website/CHANGELOG.md              |  9 +++-
 apps/fabric-website/package.json              |  4 +-
 .../amyngu-paste_2018-02-05-22-57.json        | 11 -----
 .../component-beak_2018-02-08-13-45.json      | 11 -----
 .../initials_2018-02-07-13-49.json            | 11 -----
 ...ingWorkWeekDateRange_2018-01-24-01-39.json | 11 -----
 .../leftnav-perf_2018-02-15-17-08.json        | 11 -----
 .../fill-opacity_2018-02-15-22-38.json        | 11 -----
 .../component-beak_2018-02-08-13-45.json      | 11 -----
 ...usFixFindPrevElement_2018-02-08-21-02.json | 11 -----
 ...button-configuration_2018-02-12-21-02.json | 11 -----
 .../component-beak_2018-02-08-13-45.json      | 11 -----
 ...-forceintofirstchild_2018-02-13-16-29.json | 11 -----
 ...ea-link-merge-styles_2018-02-08-20-12.json | 11 -----
 ...-request-3942-autoAdjustTextboxHeight.json | 11 -----
 .../searchbox-test_2018-02-14-19-03.json      | 11 -----
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/CHANGELOG.json           | 26 ++++++++++
 packages/experiments/CHANGELOG.md             | 13 ++++-
 packages/experiments/package.json             |  4 +-
 .../jest-serializer-merge-styles/package.json |  2 +-
 packages/merge-styles/CHANGELOG.json          | 14 ++++++
 packages/merge-styles/CHANGELOG.md            |  9 +++-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 49 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 17 ++++++-
 packages/office-ui-fabric-react/package.json  |  6 +--
 packages/styling/package.json                 |  4 +-
 packages/utilities/CHANGELOG.json             | 26 ++++++++++
 packages/utilities/CHANGELOG.md               | 13 ++++-
 packages/utilities/package.json               |  4 +-
 scripts/package.json                          |  4 +-
 33 files changed, 206 insertions(+), 175 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/amyngu-paste_2018-02-05-22-57.json
 delete mode 100644 common/changes/@uifabric/experiments/component-beak_2018-02-08-13-45.json
 delete mode 100644 common/changes/@uifabric/fabric-website/initials_2018-02-07-13-49.json
 delete mode 100644 common/changes/@uifabric/fabric-website/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
 delete mode 100644 common/changes/@uifabric/fabric-website/leftnav-perf_2018-02-15-17-08.json
 delete mode 100644 common/changes/@uifabric/merge-styles/fill-opacity_2018-02-15-22-38.json
 delete mode 100644 common/changes/@uifabric/utilities/component-beak_2018-02-08-13-45.json
 delete mode 100644 common/changes/@uifabric/utilities/jspurlin-FocusFixFindPrevElement_2018-02-08-21-02.json
 delete mode 100644 common/changes/office-ui-fabric-react/add-menu-trigger-button-configuration_2018-02-12-21-02.json
 delete mode 100644 common/changes/office-ui-fabric-react/component-beak_2018-02-08-13-45.json
 delete mode 100644 common/changes/office-ui-fabric-react/issues-3960-focuszone-forceintofirstchild_2018-02-13-16-29.json
 delete mode 100644 common/changes/office-ui-fabric-react/miwhea-link-merge-styles_2018-02-08-20-12.json
 delete mode 100644 common/changes/office-ui-fabric-react/nero120-pull-request-3942-autoAdjustTextboxHeight.json
 delete mode 100644 common/changes/office-ui-fabric-react/searchbox-test_2018-02-14-19-03.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index b7b6161fbe4ac..b0107ed45ac45 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.3.1",
+      "tag": "@uifabric/fabric-website_v5.3.1",
+      "date": "Fri, 16 Feb 2018 11:23:29 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "97593b0e0ff8c69cafbaefe40a3ba6834572eddf",
+            "comment": "Left nav: Less jittery and component pages load in full height."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.50.0 <6.0.0` to `>=5.51.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.3.0",
       "tag": "@uifabric/fabric-website_v5.3.0",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 5f789e2e71bb9..660e664b42705 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Mon, 22 Jan 2018 11:14:27 GMT and should not be manually modified.
+This log was last generated on Fri, 16 Feb 2018 11:23:29 GMT and should not be manually modified.
+
+## 5.3.1
+Fri, 16 Feb 2018 11:23:29 GMT
+
+### Patches
+
+- Left nav: Less jittery and component pages load in full height.
 
 ## 5.3.0
 Mon, 22 Jan 2018 11:14:27 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 9055303fca466..cfeb77587b2ad 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.3.0",
+  "version": "5.3.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.50.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.51.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/amyngu-paste_2018-02-05-22-57.json b/common/changes/@uifabric/experiments/amyngu-paste_2018-02-05-22-57.json
deleted file mode 100644
index 9e77194bb2d3b..0000000000000
--- a/common/changes/@uifabric/experiments/amyngu-paste_2018-02-05-22-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Hook up onPaste for BaseExtendedPicker",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "amyngu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/component-beak_2018-02-08-13-45.json b/common/changes/@uifabric/experiments/component-beak_2018-02-08-13-45.json
deleted file mode 100644
index 34aab286454d2..0000000000000
--- a/common/changes/@uifabric/experiments/component-beak_2018-02-08-13-45.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Removing Coachmark",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "miljo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/initials_2018-02-07-13-49.json b/common/changes/@uifabric/fabric-website/initials_2018-02-07-13-49.json
deleted file mode 100644
index 449e1cc3620ed..0000000000000
--- a/common/changes/@uifabric/fabric-website/initials_2018-02-07-13-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "khalle@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json b/common/changes/@uifabric/fabric-website/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
deleted file mode 100644
index 6218fcd512b73..0000000000000
--- a/common/changes/@uifabric/fabric-website/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "jolore@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/leftnav-perf_2018-02-15-17-08.json b/common/changes/@uifabric/fabric-website/leftnav-perf_2018-02-15-17-08.json
deleted file mode 100644
index 5cdc1b437ad9a..0000000000000
--- a/common/changes/@uifabric/fabric-website/leftnav-perf_2018-02-15-17-08.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Left nav: Less jittery and component pages load in full height.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/fill-opacity_2018-02-15-22-38.json b/common/changes/@uifabric/merge-styles/fill-opacity_2018-02-15-22-38.json
deleted file mode 100644
index d663586f93056..0000000000000
--- a/common/changes/@uifabric/merge-styles/fill-opacity_2018-02-15-22-38.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "mergeStyles: setting `fill-opacity` as unitless.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/component-beak_2018-02-08-13-45.json b/common/changes/@uifabric/utilities/component-beak_2018-02-08-13-45.json
deleted file mode 100644
index 706e47ee22514..0000000000000
--- a/common/changes/@uifabric/utilities/component-beak_2018-02-08-13-45.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Added a triangle abstraction class",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "miljo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/jspurlin-FocusFixFindPrevElement_2018-02-08-21-02.json b/common/changes/@uifabric/utilities/jspurlin-FocusFixFindPrevElement_2018-02-08-21-02.json
deleted file mode 100644
index 276943d8ecba7..0000000000000
--- a/common/changes/@uifabric/utilities/jspurlin-FocusFixFindPrevElement_2018-02-08-21-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Focus: Fix getPreviousElement to correctly walk across previous siblings if a potential child match was found",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/add-menu-trigger-button-configuration_2018-02-12-21-02.json b/common/changes/office-ui-fabric-react/add-menu-trigger-button-configuration_2018-02-12-21-02.json
deleted file mode 100644
index 15267957479b9..0000000000000
--- a/common/changes/office-ui-fabric-react/add-menu-trigger-button-configuration_2018-02-12-21-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added enum for triggering menu with arrow keys and bool to allow it or not",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "eikawata@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/component-beak_2018-02-08-13-45.json b/common/changes/office-ui-fabric-react/component-beak_2018-02-08-13-45.json
deleted file mode 100644
index 776a42207c30b..0000000000000
--- a/common/changes/office-ui-fabric-react/component-beak_2018-02-08-13-45.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Migrating Coachmark to main office-ui-fabrc-react package and adding a beak compoentn as well as updating  the experimental component PositioningContainer to reflect some of the latest bits in  Callout",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "miljo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/issues-3960-focuszone-forceintofirstchild_2018-02-13-16-29.json b/common/changes/office-ui-fabric-react/issues-3960-focuszone-forceintofirstchild_2018-02-13-16-29.json
deleted file mode 100644
index 00975027a79de..0000000000000
--- a/common/changes/office-ui-fabric-react/issues-3960-focuszone-forceintofirstchild_2018-02-13-16-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "FocusZone.Focus now respects forceIntoFirstChild parameter and  IFocusZone.ts has been updated to reflect this",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "cohoov@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/miwhea-link-merge-styles_2018-02-08-20-12.json b/common/changes/office-ui-fabric-react/miwhea-link-merge-styles_2018-02-08-20-12.json
deleted file mode 100644
index d4b6418786295..0000000000000
--- a/common/changes/office-ui-fabric-react/miwhea-link-merge-styles_2018-02-08-20-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Link: Update to use merge-styles",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mike@mikewheaton.ca"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/nero120-pull-request-3942-autoAdjustTextboxHeight.json b/common/changes/office-ui-fabric-react/nero120-pull-request-3942-autoAdjustTextboxHeight.json
deleted file mode 100644
index 4d162c4f1aafb..0000000000000
--- a/common/changes/office-ui-fabric-react/nero120-pull-request-3942-autoAdjustTextboxHeight.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix bug: '#3942 Fixed controlled TextField with multiline and autoAdjustHeight does not adjust when setting value via state'",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": ""
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/searchbox-test_2018-02-14-19-03.json b/common/changes/office-ui-fabric-react/searchbox-test_2018-02-14-19-03.json
deleted file mode 100644
index 2c7520ca3668c..0000000000000
--- a/common/changes/office-ui-fabric-react/searchbox-test_2018-02-14-19-03.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SearchBox: adding unit test and tweaking how the value is read from ev rather than the element itself.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index f4ed95d185a99..4d48211da8636 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.18.0 <6.0.0",
-    "@uifabric/utilities": ">=5.11.0 <6.0.0",
+    "@uifabric/utilities": ">=5.12.0 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 0351e861fe448..d48808c830e14 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.21.0",
+      "tag": "@uifabric/experiments_v5.21.0",
+      "date": "Fri, 16 Feb 2018 11:23:28 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "amyngu <31973030+amyngu@users.noreply.github.com>",
+            "commit": "01b3c8a05ea5c33bd1a12bda479f7587f02eb8eb",
+            "comment": "Hook up onPaste for BaseExtendedPicker"
+          }
+        ],
+        "minor": [
+          {
+            "author": "John Miller <rubixws@gmail.com>",
+            "commit": "44b167af31b9b6dd079359209f101f1af10762a5",
+            "comment": "Removing Coachmark"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.50.0 <6.0.0` to `>=5.51.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.20.0",
       "tag": "@uifabric/experiments_v5.20.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index cb97b6cf43ac6..b41f09002fd09 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Wed, 14 Feb 2018 22:10:50 GMT and should not be manually modified.
+This log was last generated on Fri, 16 Feb 2018 11:23:29 GMT and should not be manually modified.
+
+## 5.21.0
+Fri, 16 Feb 2018 11:23:28 GMT
+
+### Minor changes
+
+- Removing Coachmark
+
+### Patches
+
+- Hook up onPaste for BaseExtendedPicker
 
 ## 5.20.0
 Wed, 14 Feb 2018 22:10:49 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 46b74672ca05e..899e7ba84d0c3 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.20.0",
+  "version": "5.21.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.50.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.51.0 <6.0.0",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/jest-serializer-merge-styles/package.json b/packages/jest-serializer-merge-styles/package.json
index 68b9b283c52cc..8017dccb73bc5 100644
--- a/packages/jest-serializer-merge-styles/package.json
+++ b/packages/jest-serializer-merge-styles/package.json
@@ -24,6 +24,6 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/merge-styles": ">=5.12.0 <6.0.0"
+    "@uifabric/merge-styles": ">=5.12.1 <6.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index 6812a3c66a1de..41ed5baba24bd 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.12.1",
+      "tag": "@uifabric/merge-styles_v5.12.1",
+      "date": "Fri, 16 Feb 2018 11:23:29 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "04bd4051d81e68f7b007009e85b50665d4b9db4e",
+            "comment": "mergeStyles: setting `fill-opacity` as unitless."
+          }
+        ]
+      }
+    },
     {
       "version": "5.12.0",
       "tag": "@uifabric/merge-styles_v5.12.0",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index b14f64113690e..7848d728f0576 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Wed, 14 Feb 2018 22:10:50 GMT and should not be manually modified.
+This log was last generated on Fri, 16 Feb 2018 11:23:29 GMT and should not be manually modified.
+
+## 5.12.1
+Fri, 16 Feb 2018 11:23:29 GMT
+
+### Patches
+
+- mergeStyles: setting `fill-opacity` as unitless.
 
 ## 5.12.0
 Wed, 14 Feb 2018 22:10:50 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index 937772ae49850..875091583a001 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.12.0",
+  "version": "5.12.1",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 6f3f245eaae8b..0b7070796cd26 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,55 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.51.0",
+      "tag": "office-ui-fabric-react_v5.51.0",
+      "date": "Fri, 16 Feb 2018 11:23:29 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Eigo Kawatani <e.k.dev@outlook.com>",
+            "commit": "2bdbb7e44c9300861ea466b707829843781a35db",
+            "comment": "Added enum for triggering menu with arrow keys and bool to allow it or not"
+          },
+          {
+            "author": "John Miller <rubixws@gmail.com>",
+            "commit": "44b167af31b9b6dd079359209f101f1af10762a5",
+            "comment": "Migrating Coachmark to main office-ui-fabrc-react package and adding a beak compoentn as well as updating  the experimental component PositioningContainer to reflect some of the latest bits in  Callout"
+          },
+          {
+            "author": "Cody Hoover <hoovercj@users.noreply.github.com>",
+            "commit": "7b7abfa12cec76632570dad7c2524901e4580ab1",
+            "comment": "FocusZone.Focus now respects forceIntoFirstChild parameter and  IFocusZone.ts has been updated to reflect this"
+          },
+          {
+            "author": "Mike Wheaton <miwhea@microsoft.com>",
+            "commit": "6aecee329e1652eb2e4dff3a313a242632b37e2f",
+            "comment": "Link: Update to use merge-styles"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Manish Garg <manishga@microsoft.com>",
+            "commit": "e1643ddc1862e030bd1f1908c148e778867a23f8",
+            "comment": "Fix bug: '#3942 Fixed controlled TextField with multiline and autoAdjustHeight does not adjust when setting value via state'"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "fbbbbeb54e4f0e42ad15ccff1a031fa65f5433c5",
+            "comment": "SearchBox: adding unit test and tweaking how the value is read from ev rather than the element itself."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.12.0 <6.0.0` to `>=5.12.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.11.0 <6.0.0` to `>=5.12.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.50.0",
       "tag": "office-ui-fabric-react_v5.50.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 091c4e455c513..8f4c223a7abc1 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,21 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 14 Feb 2018 22:10:50 GMT and should not be manually modified.
+This log was last generated on Fri, 16 Feb 2018 11:23:29 GMT and should not be manually modified.
+
+## 5.51.0
+Fri, 16 Feb 2018 11:23:29 GMT
+
+### Minor changes
+
+- Added enum for triggering menu with arrow keys and bool to allow it or not
+- Migrating Coachmark to main office-ui-fabrc-react package and adding a beak compoentn as well as updating  the experimental component PositioningContainer to reflect some of the latest bits in  Callout
+- FocusZone.Focus now respects forceIntoFirstChild parameter and  IFocusZone.ts has been updated to reflect this
+- Link: Update to use merge-styles
+
+### Patches
+
+- Fix bug: '#3942 Fixed controlled TextField with multiline and autoAdjustHeight does not adjust when setting value via state'
+- SearchBox: adding unit test and tweaking how the value is read from ev rather than the element itself.
 
 ## 5.50.0
 Wed, 14 Feb 2018 22:10:50 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 5418d5b3d3395..453aa4d188c5d 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.50.0",
+  "version": "5.51.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -49,9 +49,9 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
-    "@uifabric/merge-styles": ">=5.12.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.12.1 <6.0.0",
     "@uifabric/styling": ">=5.18.0 <6.0.0",
-    "@uifabric/utilities": ">=5.11.0 <6.0.0",
+    "@uifabric/utilities": ">=5.12.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 8d8b6c7504549..840e8ed78cfd0 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -27,8 +27,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.11.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.12.0 <6.0.0",
+    "@uifabric/utilities": ">=5.12.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.12.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index f4c3bda6621a2..400a2189c222e 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.12.0",
+      "tag": "@uifabric/utilities_v5.12.0",
+      "date": "Fri, 16 Feb 2018 11:23:29 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "John Miller <rubixws@gmail.com>",
+            "commit": "44b167af31b9b6dd079359209f101f1af10762a5",
+            "comment": "Added a triangle abstraction class"
+          }
+        ],
+        "patch": [
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "f0c4c5cfd1d20ea16af3378bf68e05269653d321",
+            "comment": "Focus: Fix getPreviousElement to correctly walk across previous siblings if a potential child match was found"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.12.0 <6.0.0` to `>=5.12.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.11.0",
       "tag": "@uifabric/utilities_v5.11.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 955c76e4bddbb..740dd480558a2 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Wed, 14 Feb 2018 22:10:50 GMT and should not be manually modified.
+This log was last generated on Fri, 16 Feb 2018 11:23:29 GMT and should not be manually modified.
+
+## 5.12.0
+Fri, 16 Feb 2018 11:23:29 GMT
+
+### Minor changes
+
+- Added a triangle abstraction class
+
+### Patches
+
+- Focus: Fix getPreviousElement to correctly walk across previous siblings if a potential child match was found
 
 ## 5.11.0
 Wed, 14 Feb 2018 22:10:50 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index fa69686227ecb..57df5b5ca3d16 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.11.0",
+  "version": "5.12.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -36,7 +36,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/merge-styles": ">=5.12.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.12.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/scripts/package.json b/scripts/package.json
index 09347162f9b8e..8ee991768cd7a 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -11,7 +11,7 @@
     "@microsoft/api-extractor": "^4.2.6",
     "@microsoft/load-themed-styles": "^1.7.13",
     "@microsoft/loader-load-themed-styles": "^1.6.0",
-    "@uifabric/merge-styles": ">=5.11.2 <6.0.0",
+    "@uifabric/merge-styles": ">=5.12.1 <6.0.0",
     "autoprefixer": "^7.1.5",
     "awesome-typescript-loader": "^3.2.3",
     "bundlesize": "^0.15.2",
@@ -52,4 +52,4 @@
       "maxSize": "43.1 kB"
     }
   ]
-}
+}
\ No newline at end of file

From 8b235107117de864c76803eeedbefb9de9e9c17e Mon Sep 17 00:00:00 2001
From: Alex Bettadapur <alexbettadapur@gmail.com>
Date: Fri, 16 Feb 2018 08:58:47 -0800
Subject: [PATCH 1385/1641] List: Add a _notifyPageChanges function  (#3990)

* Add a _notifyPageChanges function

* buidl fix

* nit comments

* change file
---
 .../alebet-onPageAdded_2018-02-15-21-11.json  | 11 +++
 .../src/components/List/List.tsx              | 75 ++++++++++++-------
 2 files changed, 60 insertions(+), 26 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/alebet-onPageAdded_2018-02-15-21-11.json

diff --git a/common/changes/office-ui-fabric-react/alebet-onPageAdded_2018-02-15-21-11.json b/common/changes/office-ui-fabric-react/alebet-onPageAdded_2018-02-15-21-11.json
new file mode 100644
index 0000000000000..c2a111ee02e9e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/alebet-onPageAdded_2018-02-15-21-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add notifyPageChange function to List",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "alebet@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index 3d62a1d1595fe..26e774f4407fb 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -435,7 +435,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     const {
       page: {
         items,
-      startIndex
+        startIndex
       },
       ...divProps
     } = pageProps;
@@ -570,13 +570,15 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     }
 
     let newListState = this._buildPages(props);
-    let oldListPages = this.state.pages;
+    let oldListPages = this.state.pages!;
+
+    this._notifyPageChanges(oldListPages, newListState.pages!);
 
     this.setState(newListState, () => {
       // If we weren't provided with the page height, measure the pages
       if (!props.getPageHeight) {
         // If measured version is invalid since we've updated the DOM
-        const heightsChanged = this._updatePageMeasurements(oldListPages as IPage[], newListState.pages as IPage[]);
+        const heightsChanged = this._updatePageMeasurements(newListState.pages!);
 
         // On first render, we should re-measure so that we don't get a visual glitch.
         if (heightsChanged) {
@@ -598,7 +600,48 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     });
   }
 
-  private _updatePageMeasurements(oldPages: IPage[], newPages: IPage[]) {
+  /**
+   * Notify consumers that the rendered pages have changed
+   * @param oldPages The old pages
+   * @param newPages The new pages
+   * @param props The props to use
+   */
+  private _notifyPageChanges(oldPages: IPage[], newPages: IPage[], props: IListProps = this.props) {
+    const {
+      onPageAdded,
+      onPageRemoved
+    } = props;
+
+    if (onPageAdded || onPageRemoved) {
+      const renderedIndexes: {
+        [index: number]: IPage;
+      } = {};
+
+      for (const page of oldPages) {
+        if (page.items) {
+          renderedIndexes[page.startIndex] = page;
+        }
+      }
+
+      for (const page of newPages) {
+        if (page.items) {
+          if (!renderedIndexes[page.startIndex]) {
+            this._onPageAdded(page);
+          } else {
+            delete renderedIndexes[page.startIndex];
+          }
+        }
+      }
+
+      for (let index in renderedIndexes) {
+        if (renderedIndexes.hasOwnProperty(index)) {
+          this._onPageRemoved(renderedIndexes[index]);
+        }
+      }
+    }
+  }
+
+  private _updatePageMeasurements(pages: IPage[]) {
     const renderedIndexes: {
       [index: number]: IPage;
     } = {};
@@ -610,31 +653,11 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       return heightChanged;
     }
 
-    for (let i = 0; i < oldPages.length; i++) {
-      let page = oldPages[i];
-
-      if (page.items) {
-        renderedIndexes[page.startIndex] = page;
-      }
-    }
-
-    for (let i = 0; i < newPages.length; i++) {
-      let page = newPages[i];
+    for (let i = 0; i < pages.length; i++) {
+      let page = pages[i];
 
       if (page.items) {
         heightChanged = this._measurePage(page) || heightChanged;
-
-        if (!renderedIndexes[page.startIndex]) {
-          this._onPageAdded(page);
-        } else {
-          delete renderedIndexes[page.startIndex];
-        }
-      }
-    }
-
-    for (let index in renderedIndexes) {
-      if (renderedIndexes.hasOwnProperty(index)) {
-        this._onPageRemoved(renderedIndexes[index]);
       }
     }
 

From 108ba47a0f555af5a833d3dbd880ddfb1bf6f5e4 Mon Sep 17 00:00:00 2001
From: Mike Pateras <35780775+paterasMSFT@users.noreply.github.com>
Date: Fri, 16 Feb 2018 11:59:55 -0500
Subject: [PATCH 1386/1641] DetailsList: Consider groups when setting
 aria-rowcount

* Added groups to aria-rowcount.

* Change file.

* Added nested groups to row count.

* Added comment and changed import paths.
---
 ...tailsListCountGroups_2018-02-13-20-00.json | 11 ++++
 .../components/DetailsList/DetailsList.tsx    |  5 +-
 .../groupedList/GroupedListUtility.test.tsx   | 58 +++++++++++++++++++
 .../groupedList/GroupedListUtility.tsx        | 26 +++++++++
 4 files changed, 99 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-mipatera-DetailsListCountGroups_2018-02-13-20-00.json
 create mode 100644 packages/office-ui-fabric-react/src/utilities/groupedList/GroupedListUtility.test.tsx
 create mode 100644 packages/office-ui-fabric-react/src/utilities/groupedList/GroupedListUtility.tsx

diff --git a/common/changes/office-ui-fabric-react/users-mipatera-DetailsListCountGroups_2018-02-13-20-00.json b/common/changes/office-ui-fabric-react/users-mipatera-DetailsListCountGroups_2018-02-13-20-00.json
new file mode 100644
index 0000000000000..cc596bc5d5e9f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-mipatera-DetailsListCountGroups_2018-02-13-20-00.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: Groups are now considered for aria-rowcount.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mipatera@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 81e81101f4e81..3418d3d71a9bd 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -36,6 +36,7 @@ import { DragDropHelper } from '../../utilities/dragdrop/DragDropHelper';
 import { GroupedList } from '../../GroupedList';
 import { List, IListProps } from '../../List';
 import { withViewport } from '../../utilities/decorators/withViewport';
+import { GetGroupCount } from '../../utilities/groupedList/GroupedListUtility';
 
 const styles: any = stylesImport;
 
@@ -293,6 +294,8 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       onRenderDetailsHeader = this._onRenderDetailsHeader
     } = this.props;
 
+    const rowCount = (isHeaderVisible ? 1 : 0) + GetGroupCount(groups) + (items ? items.length : 0);
+
     return (
       // If shouldApplyApplicationRole is true, role application will be applied to make arrow keys work
       // with JAWS.
@@ -314,7 +317,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
         <div
           role='grid'
           aria-label={ ariaLabelForGrid }
-          aria-rowcount={ (isHeaderVisible ? 1 : 0) + (items ? items.length : 0) }
+          aria-rowcount={ rowCount }
           aria-colcount={ (selectAllVisibility !== SelectAllVisibility.none ? 1 : 0) + (adjustedColumns ? adjustedColumns.length : 0) }
           aria-readonly='true'
         >
diff --git a/packages/office-ui-fabric-react/src/utilities/groupedList/GroupedListUtility.test.tsx b/packages/office-ui-fabric-react/src/utilities/groupedList/GroupedListUtility.test.tsx
new file mode 100644
index 0000000000000..557f6148e6ec7
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/utilities/groupedList/GroupedListUtility.test.tsx
@@ -0,0 +1,58 @@
+import { IGroup } from '../../components/GroupedList/GroupedList.types';
+import { GetGroupCount } from './GroupedListUtility';
+
+const G = (children: IGroup[] = []): IGroup => {
+  return { key: 'Key', name: 'Group', startIndex: 0, count: 0, children };
+};
+
+describe('GroupedListUtility', () => {
+  describe('GetGroupCount', () => {
+    it('Accepts undefined', () => {
+      expect(GetGroupCount(undefined)).toEqual(0);
+    });
+
+    it('Counts single group', () => {
+      expect(GetGroupCount([G()])).toEqual(1);
+    });
+
+    it('Counts flat groups 1', () => {
+      const groups: IGroup[] = [
+        G(),
+        G(),
+        G()
+      ];
+      expect(GetGroupCount(groups)).toEqual(3);
+    });
+
+    it('Counts flat groups 2', () => {
+      const groups: IGroup[] = [];
+      const amount = 10;
+      for (let i = 0; i < amount; ++i) {
+        groups.push(G());
+      }
+      expect(GetGroupCount(groups)).toEqual(amount);
+    });
+
+    it('Counts nested groups 1', () => {
+      expect(GetGroupCount([G([G()])])).toEqual(2);
+    });
+
+    it('Counts nested groups 2', () => {
+      const groups: IGroup[] = [
+        G(), // 1
+        G([ // 1
+          G([G()]), // 2
+          G(), // 1
+          G([ // 1
+            G([G()]), // 2
+            G([G(), G(), G()]), // 4
+            G([G(), G(), G()]) // 4
+          ])
+        ]),
+        G([G(), G()]), // 3
+        G() // 1
+      ];
+      expect(GetGroupCount(groups)).toEqual(20);
+    });
+  });
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/groupedList/GroupedListUtility.tsx b/packages/office-ui-fabric-react/src/utilities/groupedList/GroupedListUtility.tsx
new file mode 100644
index 0000000000000..e2c9ca50c58ca
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/utilities/groupedList/GroupedListUtility.tsx
@@ -0,0 +1,26 @@
+import { IGroup } from '../../components/GroupedList/GroupedList.types';
+
+/**
+ * Takes an array of groups and returns a count of the groups and all descendant groups.
+ * @param groups - The array of groups to count.
+ */
+export const GetGroupCount = (groups: IGroup[] | undefined): number => {
+  let total = 0;
+
+  if (groups) {
+    const remainingGroups = [...groups];
+    let currentGroup: IGroup;
+
+    while (remainingGroups && remainingGroups.length > 0) {
+      ++total;
+
+      currentGroup = remainingGroups.pop() as IGroup;
+
+      if (currentGroup && currentGroup.children) {
+        remainingGroups.push(...currentGroup.children);
+      }
+    }
+  }
+
+  return total;
+};
\ No newline at end of file

From 6a7d210880de2cf99cfa5ac154ea887140635d01 Mon Sep 17 00:00:00 2001
From: Joe Martella <martellaj@live.com>
Date: Fri, 16 Feb 2018 09:10:14 -0800
Subject: [PATCH 1387/1641] [ContextualMenu] Fixes useTargetWidth property
 (#3943)

* Fixes useTargetWidth usage for ContextualMenu
* Accounts for border width
---
 ...joem-fix-callout-targetwidth_2018-02-11-00-32.json | 11 +++++++++++
 .../src/components/ContextualMenu/ContextualMenu.tsx  |  6 ++++--
 2 files changed, 15 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/joem-fix-callout-targetwidth_2018-02-11-00-32.json

diff --git a/common/changes/office-ui-fabric-react/joem-fix-callout-targetwidth_2018-02-11-00-32.json b/common/changes/office-ui-fabric-react/joem-fix-callout-targetwidth_2018-02-11-00-32.json
new file mode 100644
index 0000000000000..c49ee0f15e324
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/joem-fix-callout-targetwidth_2018-02-11-00-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixes useTargetWidth prop for ContextualMenu",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joem@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 0bbdc7a0a6242..23290580005af 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -248,7 +248,9 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     let contextMenuStyle;
     let targetAsHtmlElement = this._target as HTMLElement;
     if ((useTargetWidth || useTargetAsMinWidth) && targetAsHtmlElement && targetAsHtmlElement.offsetWidth) {
-      let targetWidth = targetAsHtmlElement.offsetWidth;
+      const targetBoundingRect = targetAsHtmlElement.getBoundingClientRect();
+      const targetWidth = targetBoundingRect.width - 2 /* Accounts for 1px border */;
+
       if (useTargetWidth) {
         contextMenuStyle = {
           width: targetWidth
@@ -272,7 +274,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       }
       return (
         <Callout
-          {...calloutProps}
+          { ...calloutProps }
           target={ useTargetPoint ? targetPoint : target }
           isBeakVisible={ isBeakVisible }
           beakWidth={ beakWidth }

From f009d10b1c548e15b905a0148a3b79bb5c8d34b6 Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Fri, 16 Feb 2018 14:52:34 -0800
Subject: [PATCH 1388/1641] ScrollablePane SCSS to MergeStyles Part 1: File
 Structure (#4008)

Implement base file structure and styled() function
---
 ...rollablepane-scss2ms_2018-02-16-22-12.json |  11 +
 .../ScrollablePane/ScrollablePane.base.tsx    | 237 +++++++++++++++++
 .../ScrollablePane/ScrollablePane.styles.ts   |  28 ++
 .../ScrollablePane/ScrollablePane.tsx         | 245 +-----------------
 .../ScrollablePane/ScrollablePane.types.ts    |  46 +++-
 5 files changed, 330 insertions(+), 237 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/scrollablepane-scss2ms_2018-02-16-22-12.json
 create mode 100644 packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.styles.ts

diff --git a/common/changes/office-ui-fabric-react/scrollablepane-scss2ms_2018-02-16-22-12.json b/common/changes/office-ui-fabric-react/scrollablepane-scss2ms_2018-02-16-22-12.json
new file mode 100644
index 0000000000000..cb915232cf933
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/scrollablepane-scss2ms_2018-02-16-22-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Converting SCSS to MergeStyles step 1 - file structure",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
new file mode 100644
index 0000000000000..9494b41b8a29d
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
@@ -0,0 +1,237 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+/* tslint:enable:no-unused-variable */
+import * as PropTypes from 'prop-types';
+import {
+  autobind,
+  BaseComponent,
+  css
+} from '../../Utilities';
+import {
+  IScrollablePane,
+  IScrollablePaneProps,
+} from './ScrollablePane.types';
+import { Sticky } from '../../Sticky';
+import * as stylesImport from './ScrollablePane.scss';
+const styles: any = stylesImport;
+
+export interface IScrollablePaneContext {
+  scrollablePane: PropTypes.Requireable<object>;
+}
+
+export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}> implements IScrollablePane {
+  public static childContextTypes: React.ValidationMap<IScrollablePaneContext> = {
+    scrollablePane: PropTypes.object
+  };
+
+  public refs: {
+    root: HTMLElement;
+    stickyContainer: HTMLElement;
+    stickyAbove: HTMLElement;
+    stickyBelow: HTMLElement;
+  };
+
+  private _subscribers: Set<Function>;
+  private _stickyAbove: Set<Sticky>;
+  private _stickyBelow: Set<Sticky>;
+
+  constructor(props: IScrollablePaneProps) {
+    super(props);
+    this._subscribers = new Set<Function>();
+    this._stickyAbove = new Set<Sticky>();
+    this._stickyBelow = new Set<Sticky>();
+  }
+
+  public getChildContext() {
+    return {
+      scrollablePane: {
+        subscribe: this.subscribe,
+        unsubscribe: this.unsubscribe,
+        addStickyHeader: this.addStickyHeader,
+        removeStickyHeader: this.removeStickyHeader,
+        addStickyFooter: this.addStickyFooter,
+        removeStickyFooter: this.removeStickyFooter,
+        notifySubscribers: this.notifySubscribers
+      }
+    };
+  }
+
+  public componentDidMount() {
+    const { root, stickyContainer } = this.refs;
+
+    this._events.on(root, 'scroll', this.notifySubscribers);
+    this._events.on(window, 'resize', this._onWindowResize);
+    setTimeout(() => {
+      this._resizeContainer();
+      if (stickyContainer.parentElement && root.parentElement) {
+        stickyContainer.parentElement.removeChild(stickyContainer);
+        root.parentElement.insertBefore(stickyContainer, root.nextSibling);
+        this.notifySubscribers();
+      }
+    }, 500);
+  }
+
+  public componentWillUnmount() {
+    const { stickyContainer } = this.refs;
+    this._events.off(this.refs.root);
+    this._events.off(window);
+    if (stickyContainer.parentElement) {
+      stickyContainer.parentElement.removeChild(stickyContainer);
+    }
+  }
+
+  public render() {
+    const { className } = this.props;
+
+    return (
+      <div
+        ref='root'
+        className={ css('ms-ScrollablePane', styles.root, className) }
+        data-is-scrollable={ true }
+      >
+        <div ref='stickyContainer' className={ styles.stickyContainer }>
+          <div ref='stickyAbove' className={ styles.stickyAbove } />
+          <div ref='stickyBelow' className={ styles.stickyBelow } />
+        </div>
+        { this.props.children }
+      </div>
+    );
+  }
+
+  public forceLayoutUpdate() {
+    this._onWindowResize();
+  }
+
+  @autobind
+  public subscribe(handler: (headerBound: ClientRect, footerBound: ClientRect) => void) {
+    this._subscribers.add(handler);
+  }
+
+  @autobind
+  public unsubscribe(handler: (headerBound: ClientRect, footerBound: ClientRect) => void) {
+    this._subscribers.delete(handler);
+  }
+
+  @autobind
+  public addStickyHeader(sticky: Sticky) {
+    const { stickyAbove } = this.refs;
+    this._addSticky(sticky, this._stickyAbove, stickyAbove, () => {
+      stickyAbove.appendChild(sticky.content);
+    });
+  }
+
+  @autobind
+  public addStickyFooter(sticky: Sticky) {
+    const { stickyBelow } = this.refs;
+    this._addSticky(sticky, this._stickyBelow, stickyBelow, () => {
+      stickyBelow.insertBefore(sticky.content, stickyBelow.firstChild);
+    });
+  }
+
+  @autobind
+  public removeStickyHeader(sticky: Sticky) {
+    this._removeSticky(sticky, this._stickyAbove, this.refs.stickyAbove);
+  }
+
+  @autobind
+  public removeStickyFooter(sticky: Sticky) {
+    this._removeSticky(sticky, this._stickyBelow, this.refs.stickyBelow);
+  }
+
+  @autobind
+  public notifySubscribers(sort?: boolean): void {
+    const { stickyAbove, stickyBelow } = this.refs;
+    this._subscribers.forEach((handle) => {
+      handle(stickyAbove.getBoundingClientRect(), stickyBelow.getBoundingClientRect());
+    });
+    if (this._stickyAbove.size > 1) {
+      this._sortStickies(this._stickyAbove, stickyAbove);
+    }
+    if (this._stickyBelow.size > 1) {
+      this._sortStickies(this._stickyBelow, stickyBelow);
+    }
+  }
+
+  private _addSticky(sticky: Sticky, stickyList: Set<Sticky>, container: HTMLElement, addStickyToContainer: () => void) {
+    if (!stickyList.has(sticky)) {
+      stickyList.add(sticky);
+      addStickyToContainer();
+      sticky.content.addEventListener('transitionend',
+        this._setPlaceholderHeights.bind(null, stickyList),
+        false);
+      if (sticky.props.stickyClassName) {
+        setTimeout(() => {
+          if (sticky.props.stickyClassName) {
+            sticky.content.children[0].classList.add(sticky.props.stickyClassName);
+          }
+        }, 1);
+      }
+      this.notifySubscribers();
+      this._setPlaceholderHeights(stickyList);
+    }
+  }
+
+  private _removeSticky(sticky: Sticky, stickyList: Set<Sticky>, container: HTMLElement) {
+    if (stickyList.has(sticky)) {
+      sticky.content.removeEventListener('transitionend',
+        this._setPlaceholderHeights.bind(null, stickyList, container));
+      stickyList.delete(sticky);
+    }
+  }
+
+  private _onWindowResize() {
+    setTimeout(() => {
+      this._resizeContainer();
+      this.notifySubscribers();
+      this._setPlaceholderHeights(this._stickyAbove);
+      this._setPlaceholderHeights(this._stickyBelow);
+    }, 5);
+  }
+
+  private _resizeContainer() {
+    const { stickyContainer, root } = this.refs;
+    const { borderTopWidth, borderLeftWidth } = getComputedStyle(root);
+    stickyContainer.style.height = root.clientHeight + 'px';
+    stickyContainer.style.width = root.clientWidth + 'px';
+    if (borderTopWidth) {
+      stickyContainer.style.top = root.offsetTop + parseInt(borderTopWidth, 10) + 'px';
+    }
+    if (borderLeftWidth) {
+      stickyContainer.style.left = root.offsetLeft + parseInt(borderLeftWidth, 10) + 'px';
+    }
+  }
+
+  @autobind
+  private _setPlaceholderHeights(stickies: Set<Sticky>) {
+    stickies.forEach((sticky, idx) => {
+      sticky.setPlaceholderHeight(sticky.content.clientHeight);
+    });
+  }
+
+  private _sortStickies(stickyList: Set<Sticky>, container: HTMLElement): void {
+    let stickyArr = Array.from(stickyList);
+    stickyArr = stickyArr.sort((a, b) => {
+      const aOffset = this._calculateOffsetParent(a.refs.root);
+      const bOffset = this._calculateOffsetParent(b.refs.root);
+      return aOffset - bOffset;
+    });
+    while (container.lastChild) {
+      container.removeChild(container.lastChild);
+    }
+    stickyArr.forEach((sticky) => {
+      container.appendChild(sticky.content);
+    });
+  }
+
+  private _calculateOffsetParent(ele: HTMLElement): number {
+    let offset = 0;
+    while (ele.offsetParent !== this.refs.root.offsetParent) {
+      offset += ele.offsetTop;
+      if (ele.parentElement) {
+        ele = ele.parentElement;
+      }
+    }
+    return offset;
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.styles.ts b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.styles.ts
new file mode 100644
index 0000000000000..c672585439093
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.styles.ts
@@ -0,0 +1,28 @@
+import { IScrollablePaneStyleProps, IScrollablePaneStyles } from './ScrollablePane.types';
+import {
+  IStyle,
+  ITheme,
+} from '../../Styling';
+
+export const getStyles = (
+  props: IScrollablePaneStyleProps
+): IScrollablePaneStyles => {
+  const {
+    className,
+    theme,
+  } = props;
+
+  const { palette, semanticColors } = theme;
+
+  return ({
+    root: [
+      'ms-ScrollablePane',
+      {
+        // Insert css properties
+
+      }
+    ],
+
+    // Insert className styles
+  });
+};
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
index 5641de3d0b3a0..89350f8afb7e4 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.tsx
@@ -1,234 +1,13 @@
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-import * as ReactDOM from 'react-dom';
-/* tslint:enable:no-unused-variable */
-import * as PropTypes from 'prop-types';
+import { styled } from '../../Utilities';
 import {
-  autobind,
-  BaseComponent,
-  css
-} from '../../Utilities';
-import { IScrollablePane, IScrollablePaneProps } from './ScrollablePane.types';
-import { Sticky } from '../../Sticky';
-import * as stylesImport from './ScrollablePane.scss';
-const styles: any = stylesImport;
-
-export interface IScrollablePaneContext {
-  scrollablePane: PropTypes.Requireable<object>;
-}
-
-export class ScrollablePane extends BaseComponent<IScrollablePaneProps, {}> implements IScrollablePane {
-  public static childContextTypes: IScrollablePaneContext = {
-    scrollablePane: PropTypes.object
-  };
-
-  public refs: {
-    root: HTMLElement;
-    stickyContainer: HTMLElement;
-    stickyAbove: HTMLElement;
-    stickyBelow: HTMLElement;
-  };
-
-  private _subscribers: Set<Function>;
-  private _stickyAbove: Set<Sticky>;
-  private _stickyBelow: Set<Sticky>;
-
-  constructor(props: IScrollablePaneProps) {
-    super(props);
-    this._subscribers = new Set<Function>();
-    this._stickyAbove = new Set<Sticky>();
-    this._stickyBelow = new Set<Sticky>();
-  }
-
-  public getChildContext() {
-    return {
-      scrollablePane: {
-        subscribe: this.subscribe,
-        unsubscribe: this.unsubscribe,
-        addStickyHeader: this.addStickyHeader,
-        removeStickyHeader: this.removeStickyHeader,
-        addStickyFooter: this.addStickyFooter,
-        removeStickyFooter: this.removeStickyFooter,
-        notifySubscribers: this.notifySubscribers
-      }
-    };
-  }
-
-  public componentDidMount() {
-    const { root, stickyContainer } = this.refs;
-
-    this._events.on(root, 'scroll', this.notifySubscribers);
-    this._events.on(window, 'resize', this._onWindowResize);
-    setTimeout(() => {
-      this._resizeContainer();
-      if (stickyContainer.parentElement && root.parentElement) {
-        stickyContainer.parentElement.removeChild(stickyContainer);
-        root.parentElement.insertBefore(stickyContainer, root.nextSibling);
-        this.notifySubscribers();
-      }
-    }, 500);
-  }
-
-  public componentWillUnmount() {
-    const { stickyContainer } = this.refs;
-    this._events.off(this.refs.root);
-    this._events.off(window);
-    if (stickyContainer.parentElement) {
-      stickyContainer.parentElement.removeChild(stickyContainer);
-    }
-  }
-
-  public render() {
-    const { className } = this.props;
-
-    return (
-      <div
-        ref='root'
-        className={ css('ms-ScrollablePane', styles.root, className) }
-        data-is-scrollable={ true }
-      >
-        <div ref='stickyContainer' className={ styles.stickyContainer }>
-          <div ref='stickyAbove' className={ styles.stickyAbove } />
-          <div ref='stickyBelow' className={ styles.stickyBelow } />
-        </div>
-        { this.props.children }
-      </div>
-    );
-  }
-
-  public forceLayoutUpdate() {
-    this._onWindowResize();
-  }
-
-  @autobind
-  public subscribe(handler: (headerBound: ClientRect, footerBound: ClientRect) => void) {
-    this._subscribers.add(handler);
-  }
-
-  @autobind
-  public unsubscribe(handler: (headerBound: ClientRect, footerBound: ClientRect) => void) {
-    this._subscribers.delete(handler);
-  }
-
-  @autobind
-  public addStickyHeader(sticky: Sticky) {
-    const { stickyAbove } = this.refs;
-    this._addSticky(sticky, this._stickyAbove, stickyAbove, () => {
-      stickyAbove.appendChild(sticky.content);
-    });
-  }
-
-  @autobind
-  public addStickyFooter(sticky: Sticky) {
-    const { stickyBelow } = this.refs;
-    this._addSticky(sticky, this._stickyBelow, stickyBelow, () => {
-      stickyBelow.insertBefore(sticky.content, stickyBelow.firstChild);
-    });
-  }
-
-  @autobind
-  public removeStickyHeader(sticky: Sticky) {
-    this._removeSticky(sticky, this._stickyAbove, this.refs.stickyAbove);
-  }
-
-  @autobind
-  public removeStickyFooter(sticky: Sticky) {
-    this._removeSticky(sticky, this._stickyBelow, this.refs.stickyBelow);
-  }
-
-  @autobind
-  public notifySubscribers(sort?: boolean): void {
-    const { stickyAbove, stickyBelow } = this.refs;
-    this._subscribers.forEach((handle) => {
-      handle(stickyAbove.getBoundingClientRect(), stickyBelow.getBoundingClientRect());
-    });
-    if (this._stickyAbove.size > 1) {
-      this._sortStickies(this._stickyAbove, stickyAbove);
-    }
-    if (this._stickyBelow.size > 1) {
-      this._sortStickies(this._stickyBelow, stickyBelow);
-    }
-  }
-
-  private _addSticky(sticky: Sticky, stickyList: Set<Sticky>, container: HTMLElement, addStickyToContainer: () => void) {
-    if (!stickyList.has(sticky)) {
-      stickyList.add(sticky);
-      addStickyToContainer();
-      sticky.content.addEventListener('transitionend',
-        this._setPlaceholderHeights.bind(null, stickyList),
-        false);
-      if (sticky.props.stickyClassName) {
-        setTimeout(() => {
-          if (sticky.props.stickyClassName) {
-            sticky.content.children[0].classList.add(sticky.props.stickyClassName);
-          }
-        }, 1);
-      }
-      this.notifySubscribers();
-      this._setPlaceholderHeights(stickyList);
-    }
-  }
-
-  private _removeSticky(sticky: Sticky, stickyList: Set<Sticky>, container: HTMLElement) {
-    if (stickyList.has(sticky)) {
-      sticky.content.removeEventListener('transitionend',
-        this._setPlaceholderHeights.bind(null, stickyList, container));
-      stickyList.delete(sticky);
-    }
-  }
-
-  private _onWindowResize() {
-    setTimeout(() => {
-      this._resizeContainer();
-      this.notifySubscribers();
-      this._setPlaceholderHeights(this._stickyAbove);
-      this._setPlaceholderHeights(this._stickyBelow);
-    }, 5);
-  }
-
-  private _resizeContainer() {
-    const { stickyContainer, root } = this.refs;
-    const { borderTopWidth, borderLeftWidth } = getComputedStyle(root);
-    stickyContainer.style.height = root.clientHeight + 'px';
-    stickyContainer.style.width = root.clientWidth + 'px';
-    if (borderTopWidth) {
-      stickyContainer.style.top = root.offsetTop + parseInt(borderTopWidth, 10) + 'px';
-    }
-    if (borderLeftWidth) {
-      stickyContainer.style.left = root.offsetLeft + parseInt(borderLeftWidth, 10) + 'px';
-    }
-  }
-
-  @autobind
-  private _setPlaceholderHeights(stickies: Set<Sticky>) {
-    stickies.forEach((sticky, idx) => {
-      sticky.setPlaceholderHeight(sticky.content.clientHeight);
-    });
-  }
-
-  private _sortStickies(stickyList: Set<Sticky>, container: HTMLElement): void {
-    let stickyArr = Array.from(stickyList);
-    stickyArr = stickyArr.sort((a, b) => {
-      const aOffset = this._calculateOffsetParent(a.refs.root);
-      const bOffset = this._calculateOffsetParent(b.refs.root);
-      return aOffset - bOffset;
-    });
-    while (container.lastChild) {
-      container.removeChild(container.lastChild);
-    }
-    stickyArr.forEach((sticky) => {
-      container.appendChild(sticky.content);
-    });
-  }
-
-  private _calculateOffsetParent(ele: HTMLElement): number {
-    let offset = 0;
-    while (ele.offsetParent !== this.refs.root.offsetParent) {
-      offset += ele.offsetTop;
-      if (ele.parentElement) {
-        ele = ele.parentElement;
-      }
-    }
-    return offset;
-  }
-}
\ No newline at end of file
+  IScrollablePaneProps,
+  IScrollablePaneStyleProps,
+  IScrollablePaneStyles
+} from './ScrollablePane.types';
+import { ScrollablePaneBase } from './ScrollablePane.base';
+import { getStyles } from './ScrollablePane.styles';
+
+export const ScrollablePane = styled<IScrollablePaneProps, IScrollablePaneStyleProps, IScrollablePaneStyles>(
+  ScrollablePaneBase,
+  getStyles
+);
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts
index c55e41bd2d365..037423a096c63 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts
@@ -1,12 +1,15 @@
 import * as React from 'react';
-import { ScrollablePane } from './ScrollablePane';
+import { ScrollablePaneBase } from './ScrollablePane.base';
+import { IStyle, ITheme } from '../../Styling';
+import { IStyleFunction } from '../../Utilities';
 
 export interface IScrollablePane {
   /** Triggers a layout update for the pane. */
   forceLayoutUpdate(): void;
 }
 
-export interface IScrollablePaneProps extends React.HTMLAttributes<HTMLElement | ScrollablePane> {
+export interface IScrollablePaneProps extends React.HTMLAttributes<HTMLElement | ScrollablePaneBase> {
+  // export interface IScrollablePaneProps extends React.Props<ScrollablePaneBase> {
   /**
    * Optional callback to access the IScrollablePane interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
@@ -14,7 +17,42 @@ export interface IScrollablePaneProps extends React.HTMLAttributes<HTMLElement |
   componentRef?: (component: IScrollablePane) => void;
 
   /**
-   * Class name to apply to the root in addition to ms-ScrollablePane.
-  */
+   * Call to provide customized styling that will layer on top of the variant rules
+   */
+  getStyles?: IStyleFunction<IScrollablePaneStyleProps, IScrollablePaneStyles>;
+
+  /**
+   * Theme provided by HOC.
+   */
+  theme?: ITheme;
+
+  /**
+   * Additional css class to apply to the ScrollablePane
+   * @defaultvalue undefined
+   */
+  className?: string;
+}
+
+export interface IScrollablePaneStyleProps {
+  /**
+   * Accept theme prop.
+   */
+  theme: ITheme;
+
+  /**
+   * Accept custom classNames
+   */
   className?: string;
+
+  // Insert ScrollablePane style props below
+
+}
+
+export interface IScrollablePaneStyles {
+  /**
+   * Style for the root element.
+   */
+  root: IStyle;
+
+  // Insert ScrollablePane classNames below
 }
\ No newline at end of file

From 1f1db9da4f7368806e1a819e75d7685ec7b73f04 Mon Sep 17 00:00:00 2001
From: Jordan Janzen <jordancjanzen@gmail.com>
Date: Fri, 16 Feb 2018 16:10:59 -0800
Subject: [PATCH 1389/1641] Convert Overlay to mergeStyles (#3978)

* Create base

* Add whiteTranslucent40 to the palette.

* Convert overlay sass to styles.ts

* Change Overlay to return styled OverlayBase

* User getClassnames instead of styles. Move logic to styles.ts

* Add style props

* Add customizable decorator. Remove css logic.

* White instead of black default.

* Export base component

* Convert examples to mergeStyles too

* Delete sass files

* npm run change output

* Remove comment

* Fix some imports

* Revert extended type change.

* Rename isDarkThemed style prop to isDark.

* Make Root className required.
---
 .../mergeStyles-Overlay_2018-02-14-21-47.json | 11 ++++
 .../mergeStyles-Overlay_2018-02-14-21-47.json | 11 ++++
 .../src/components/Overlay/Overlay.base.tsx   | 50 ++++++++++++++++
 .../src/components/Overlay/Overlay.scss       | 33 -----------
 .../src/components/Overlay/Overlay.styles.ts  | 52 +++++++++++++++++
 .../src/components/Overlay/Overlay.tsx        | 52 ++++-------------
 .../src/components/Overlay/Overlay.types.ts   | 57 +++++++++++++++++--
 .../Overlay/examples/Overlay.Dark.Example.tsx | 21 +++++--
 .../Overlay/examples/Overlay.Example.scss     | 14 -----
 .../examples/Overlay.Example.styles.ts        | 23 ++++++++
 .../examples/Overlay.Light.Example.tsx        | 45 ++++++++++-----
 .../src/components/Overlay/index.ts           |  1 +
 packages/styling/src/interfaces/IPalette.ts   |  5 ++
 packages/styling/src/styles/DefaultPalette.ts |  1 +
 14 files changed, 265 insertions(+), 111 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/mergeStyles-Overlay_2018-02-14-21-47.json
 create mode 100644 common/changes/office-ui-fabric-react/mergeStyles-Overlay_2018-02-14-21-47.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Overlay/Overlay.base.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/components/Overlay/Overlay.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/Overlay/Overlay.styles.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Example.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Example.styles.ts

diff --git a/common/changes/@uifabric/styling/mergeStyles-Overlay_2018-02-14-21-47.json b/common/changes/@uifabric/styling/mergeStyles-Overlay_2018-02-14-21-47.json
new file mode 100644
index 0000000000000..471bf31aa6df8
--- /dev/null
+++ b/common/changes/@uifabric/styling/mergeStyles-Overlay_2018-02-14-21-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Add whiteTranslucent40 to palette",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "v-jojanz@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/mergeStyles-Overlay_2018-02-14-21-47.json b/common/changes/office-ui-fabric-react/mergeStyles-Overlay_2018-02-14-21-47.json
new file mode 100644
index 0000000000000..90c28ae80be9c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/mergeStyles-Overlay_2018-02-14-21-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Convert overlay and examples to mergeStyles",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-jojanz@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.base.tsx b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.base.tsx
new file mode 100644
index 0000000000000..baa25fc6f8f53
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.base.tsx
@@ -0,0 +1,50 @@
+import * as React from 'react';
+import {
+  BaseComponent,
+  customizable,
+  classNamesFunction,
+  getNativeProps,
+  divProperties,
+  enableBodyScroll,
+  disableBodyScroll
+} from '../../Utilities';
+import {
+  IOverlayProps,
+  IOverlayStyleProps,
+  IOverlayStyles,
+} from './Overlay.types';
+
+const getClassNames = classNamesFunction<IOverlayStyleProps, IOverlayStyles>();
+
+@customizable('Overlay', ['theme'])
+export class OverlayBase extends BaseComponent<IOverlayProps, {}> {
+
+  public componentDidMount() {
+    disableBodyScroll();
+  }
+
+  public componentWillUnmount() {
+    enableBodyScroll();
+  }
+
+  public render() {
+    const {
+      isDarkThemed: isDark,
+      className,
+      theme,
+      getStyles
+    } = this.props;
+
+    const divProps = getNativeProps(this.props, divProperties);
+
+    const classNames = getClassNames(getStyles!, {
+      theme: theme!,
+      className,
+      isDark,
+    });
+
+    return (
+      <div { ...divProps } className={ classNames.root } />
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.scss b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.scss
deleted file mode 100644
index 19c709336ac24..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.scss
+++ /dev/null
@@ -1,33 +0,0 @@
-@import '../../common/common';
-
-// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
-
-//
-// Office UI Fabric
-// --------------------------------------------------
-// Modal overlay styles
-
-.root {
-  background-color: $ms-color-whiteTranslucent40;
-  position: absolute;
-  bottom: 0;
-  left:   0;
-  right:  0;
-  top:    0;
-
-//== Modifier: Hidden overlay
-  //
-  &.rootIsNone {
-    visibility: hidden;
-  }
-
-  //== Modifier: Dark overlay
-  //
-  &.rootIsDark {
-    background-color: $ms-color-blackTranslucent40;
-  }
-
-  @include high-contrast {
-    border: 1px solid WindowText;
-  }
-}
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.styles.ts b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.styles.ts
new file mode 100644
index 0000000000000..377847ff2ff1e
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.styles.ts
@@ -0,0 +1,52 @@
+import { IOverlayStyleProps, IOverlayStyles } from './Overlay.types';
+import {
+  IStyle,
+  ITheme,
+  HighContrastSelector,
+} from '../../Styling';
+
+export const getStyles = (
+  props: IOverlayStyleProps
+): IOverlayStyles => {
+  const {
+    className,
+    theme,
+    isNone,
+    isDark,
+  } = props;
+
+  const { palette, semanticColors } = theme;
+
+  return ({
+    root: [
+      'ms-Overlay',
+      {
+        backgroundColor: palette.whiteTranslucent40,
+        top: 0,
+        right: 0,
+        bottom: 0,
+        left: 0,
+        position: 'absolute',
+
+        selectors: {
+          [HighContrastSelector]: {
+            border: '1px solid WindowText',
+          }
+        }
+      },
+
+      isNone && {
+        visibility: 'hidden',
+      },
+
+      isDark && [
+        'ms-Overlay--dark',
+        {
+          backgroundColor: palette.blackTranslucent40,
+        }
+      ],
+
+      className
+    ],
+  });
+};
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.tsx b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.tsx
index a76d03bef5c66..990d2dde00143 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.tsx
@@ -1,41 +1,13 @@
-import * as React from 'react';
+import { styled } from '../../Utilities';
 import {
-  BaseComponent,
-  css,
-  getNativeProps,
-  divProperties,
-  enableBodyScroll,
-  disableBodyScroll
-} from '../../Utilities';
-import { IOverlayProps } from './Overlay.types';
-
-import * as stylesImport from './Overlay.scss';
-const styles: any = stylesImport;
-
-export class Overlay extends BaseComponent<IOverlayProps, {}> {
-
-  public componentDidMount() {
-    disableBodyScroll();
-  }
-
-  public componentWillUnmount() {
-    enableBodyScroll();
-  }
-
-  public render() {
-    let { isDarkThemed, className } = this.props;
-    let divProps = getNativeProps(this.props, divProperties);
-
-    let modifiedClassName = css(
-      'ms-Overlay',
-      styles.root,
-      className,
-      {
-        ['ms-Overlay--dark ' + styles.rootIsDark]: isDarkThemed,
-      });
-
-    return (
-      <div { ...divProps } className={ modifiedClassName } />
-    );
-  }
-}
+  IOverlayProps,
+  IOverlayStyleProps,
+  IOverlayStyles
+} from './Overlay.types';
+import { OverlayBase } from './Overlay.base';
+import { getStyles } from './Overlay.styles';
+
+export const Overlay = styled<IOverlayProps, IOverlayStyleProps, IOverlayStyles>(
+  OverlayBase,
+  getStyles
+);
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.types.ts b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.types.ts
index f93363283a0dd..2710d2ee4bb21 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.types.ts
@@ -1,4 +1,7 @@
 import * as React from 'react';
+import { OverlayBase } from './Overlay.base';
+import { IStyle, ITheme } from '../../Styling';
+import { IStyleFunction } from '../../Utilities';
 
 export interface IOverlay {
 
@@ -6,14 +9,60 @@ export interface IOverlay {
 
 export interface IOverlayProps extends React.HTMLAttributes<HTMLElement> {
   /**
-   * Optional callback to access the IOverlay interface. Use this instead of ref for accessing
-   * the public methods and properties of the component.
+   * Gets the component ref.
    */
-  componentRef?: (component: IOverlay) => void;
+  componentRef?: (component: IOverlayProps) => void;
+
+  /**
+   * Call to provide customized styling that will layer on top of the variant rules
+   */
+  getStyles?: IStyleFunction<IOverlayStyleProps, IOverlayStyles>;
+
+  /**
+   * Theme provided by HOC.
+   */
+  theme?: ITheme;
+
+  /**
+   * Additional css class to apply to the Overlay
+   * @defaultvalue undefined
+   */
+  className?: string;
 
   /**
    * Whether to use the dark-themed overlay.
    * @defaultvalue false
    */
   isDarkThemed?: boolean;
-}
\ No newline at end of file
+
+  onClick?: () => void;
+}
+
+export interface IOverlayStyleProps {
+  /**
+   * Accept theme prop.
+   */
+  theme: ITheme;
+
+  /**
+   * Accept custom classNames
+   */
+  className?: string;
+
+  /**
+   * Is overlay visible
+   */
+  isNone?: boolean;
+
+  /**
+   * Is overlay dark themed
+   */
+  isDark?: boolean;
+}
+
+export interface IOverlayStyles {
+  /**
+   * Style for the root element.
+   */
+  root: IStyle;
+}
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Dark.Example.tsx b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Dark.Example.tsx
index 7c0f82f43bbe2..5e232b15d8f3c 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Dark.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Dark.Example.tsx
@@ -1,9 +1,18 @@
 import * as React from 'react';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+import {
+  autobind,
+  IStyleFunction,
+  classNamesFunction
+} from '../../../Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
-import { Overlay } from 'office-ui-fabric-react/lib/Overlay';
 
-import './Overlay.Example.scss';
+import { Overlay } from '../Overlay';
+
+import { getStyles, IOverlayExampleStyles } from './Overlay.Example.styles';
+
+export interface IOverlayDarkExampleProps {
+  getStyles?: IStyleFunction<{}, IOverlayExampleStyles>;
+}
 
 export class OverlayDarkExample extends React.Component<{}, {
   isOverlayVisible: boolean;
@@ -15,7 +24,9 @@ export class OverlayDarkExample extends React.Component<{}, {
   }
 
   public render() {
-    let { isOverlayVisible } = this.state;
+    const { isOverlayVisible } = this.state;
+    const getClassNames = classNamesFunction<{}, IOverlayExampleStyles>();
+    const classNames = getClassNames(getStyles);
 
     return (
       <div>
@@ -28,7 +39,7 @@ export class OverlayDarkExample extends React.Component<{}, {
             isDarkThemed={ true }
             onClick={ this._setVisibilityFalse }
           >
-            <div className='OverlayExample-content'>
+            <div className={ classNames.root }>
               <p>I am content within the overlay.</p>
             </div>
           </Overlay>
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Example.scss b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Example.scss
deleted file mode 100644
index 7fe7f8a883af7..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Example.scss
+++ /dev/null
@@ -1,14 +0,0 @@
-:global {
-
-  .OverlayExample-content {
-    position: absolute;
-    background: blue;
-    color: white;
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    padding: 10px;
-  }
-
-}
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Example.styles.ts b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Example.styles.ts
new file mode 100644
index 0000000000000..da0fa19e10345
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Example.styles.ts
@@ -0,0 +1,23 @@
+import { IStyle } from '../../../Styling';
+
+export interface IOverlayExampleStyles {
+  root: IStyle;
+}
+
+export const getStyles = (): IOverlayExampleStyles => {
+
+  return ({
+    root: [
+      'OverlayExample-content',
+      {
+        background: 'blue',
+        bottom: '0',
+        color: 'white',
+        left: '0',
+        padding: '10px',
+        position: 'absolute',
+        right: '0',
+      }
+    ]
+  });
+};
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Light.Example.tsx b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Light.Example.tsx
index bbfd3f6889c87..b563f5cba3af6 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Light.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Light.Example.tsx
@@ -1,8 +1,18 @@
 import * as React from 'react';
+import {
+  autobind,
+  IStyleFunction,
+  classNamesFunction
+} from '../../../Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
-import { Overlay } from 'office-ui-fabric-react/lib/Overlay';
 
-import './Overlay.Example.scss';
+import { Overlay } from '../Overlay';
+
+import { getStyles, IOverlayExampleStyles } from './Overlay.Example.styles';
+
+export interface IOverlayLightExampleProps {
+  getStyles?: IStyleFunction<{}, IOverlayExampleStyles>;
+}
 
 export class OverlayLightExample extends React.Component<{}, {
   isOverlayVisible: boolean;
@@ -10,22 +20,23 @@ export class OverlayLightExample extends React.Component<{}, {
   constructor(props: {}) {
     super(props);
 
-    this._onClick = this._onClick.bind(this);
-
-    this.state = {
-      isOverlayVisible: false
-    };
+    this.state = { isOverlayVisible: false };
   }
 
   public render() {
-    let { isOverlayVisible } = this.state;
+    const { isOverlayVisible } = this.state;
+    const getClassNames = classNamesFunction<{}, IOverlayExampleStyles>();
+    const classNames = getClassNames(getStyles);
 
     return (
       <div>
-        <DefaultButton onClick={ this._onClick }>Show the overlay</DefaultButton>
+        <DefaultButton
+          onClick={ this._toggleOverlay }
+          text='Show the overlay'
+        />
         { isOverlayVisible && (
-          <Overlay onClick={ this._onClick }>
-            <div className='OverlayExample-content'>
+          <Overlay onClick={ this._setVisibilityFalse } >
+            <div className={ classNames.root }>
               <p>I am content within the overlay.</p>
             </div>
           </Overlay>
@@ -34,9 +45,13 @@ export class OverlayLightExample extends React.Component<{}, {
     );
   }
 
-  private _onClick() {
-    this.setState({
-      isOverlayVisible: !this.state.isOverlayVisible
-    });
+  @autobind
+  private _setVisibilityFalse(): void {
+    this.setState({ isOverlayVisible: false });
+  }
+
+  @autobind
+  private _toggleOverlay(): void {
+    this.setState({ isOverlayVisible: !this.state.isOverlayVisible });
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/index.ts b/packages/office-ui-fabric-react/src/components/Overlay/index.ts
index 34cc685fc4bb3..8dbb699616e0b 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Overlay/index.ts
@@ -1,2 +1,3 @@
 export * from './Overlay';
+export * from './Overlay.base';
 export * from './Overlay.types';
diff --git a/packages/styling/src/interfaces/IPalette.ts b/packages/styling/src/interfaces/IPalette.ts
index e7e19aa3b3785..95aa41a0a1b7f 100644
--- a/packages/styling/src/interfaces/IPalette.ts
+++ b/packages/styling/src/interfaces/IPalette.ts
@@ -123,6 +123,11 @@ export interface IPalette {
    */
   white: string;
 
+  /**
+   * Color code for whiteTranslucent40
+   */
+  whiteTranslucent40: string;
+
   /**
    * Color code for yellow.
    */
diff --git a/packages/styling/src/styles/DefaultPalette.ts b/packages/styling/src/styles/DefaultPalette.ts
index a543a5ce866b0..1a7fd7802cf6a 100644
--- a/packages/styling/src/styles/DefaultPalette.ts
+++ b/packages/styling/src/styles/DefaultPalette.ts
@@ -26,6 +26,7 @@ export const DefaultPalette: IPalette = {
   neutralLighterAlt: '#f8f8f8',
   accent: '#0078d7',
   white: '#ffffff',
+  whiteTranslucent40: 'rgba(255,255,255,.4)',
   yellow: '#ffb900',
   yellowLight: '#fff100',
   orange: '#d83b01',

From c4aceacd30e2eddfb9ed23b2c2e2a335d268237a Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Sat, 17 Feb 2018 11:42:06 -0800
Subject: [PATCH 1390/1641] Cleaning Up Console Log in CommandBar Test (#4011)

* cleaning up a console.log in CommandBar.test.tsx

* rush change
---
 .../cammandbar-test-removelog_2018-02-17-01-35.json   | 11 +++++++++++
 .../src/components/CommandBar/CommandBar.test.tsx     |  2 --
 2 files changed, 11 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/cammandbar-test-removelog_2018-02-17-01-35.json

diff --git a/common/changes/office-ui-fabric-react/cammandbar-test-removelog_2018-02-17-01-35.json b/common/changes/office-ui-fabric-react/cammandbar-test-removelog_2018-02-17-01-35.json
new file mode 100644
index 0000000000000..cb960ac0acf55
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/cammandbar-test-removelog_2018-02-17-01-35.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Cleaning up a console.log in CommandBar.test.tsx that I noticed while updating snapshots",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
index 5626722982de8..91e3bc93eb15a 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
@@ -78,8 +78,6 @@ describe('CommandBar', () => {
     ) as React.Component<CommandBar, {}>;
     document.body.appendChild(ReactDOM.findDOMNode(renderedContent));
 
-    console.log(document.body.innerHTML);
-
     const [item1, item2, item3] = ['.item1', '.item2', '.item3'].map(i => document.querySelector(i)!.children[0]);
     expect(item1.getAttribute('aria-setsize')).toBe('3');
     expect(item2.getAttribute('aria-setsize')).toBe('3');

From 26f0690330859ea3c7a4cadf8624519cfc545be1 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 17 Feb 2018 12:51:45 -0800
Subject: [PATCH 1391/1641] Update .npmrc

---
 .npmrc | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.npmrc b/.npmrc
index 825c83e09df4d..1df2a6d8579b7 100644
--- a/.npmrc
+++ b/.npmrc
@@ -1,2 +1,2 @@
 registry=https://registry.npmjs.org/
-
+package-lock=false

From bad1f87d5b39397bd75305974f9933d120a41f4a Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 17 Feb 2018 13:02:40 -0800
Subject: [PATCH 1392/1641] Delete initials_2018-02-07-13-49.json

---
 .../example-app-base/initials_2018-02-07-13-49.json   | 11 -----------
 1 file changed, 11 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/initials_2018-02-07-13-49.json

diff --git a/common/changes/@uifabric/example-app-base/initials_2018-02-07-13-49.json b/common/changes/@uifabric/example-app-base/initials_2018-02-07-13-49.json
deleted file mode 100644
index 55ac6310053df..0000000000000
--- a/common/changes/@uifabric/example-app-base/initials_2018-02-07-13-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "khalle@microsoft.com"
-}
\ No newline at end of file

From d06a33ff5020d871e388f01f43f9cb68f0a9faab Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 17 Feb 2018 13:02:49 -0800
Subject: [PATCH 1393/1641] Delete
 jolore-addingWorkWeekDateRange_2018-01-24-01-39.json

---
 ...lore-addingWorkWeekDateRange_2018-01-24-01-39.json | 11 -----------
 1 file changed, 11 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json

diff --git a/common/changes/@uifabric/example-app-base/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json b/common/changes/@uifabric/example-app-base/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
deleted file mode 100644
index 9401437d55539..0000000000000
--- a/common/changes/@uifabric/example-app-base/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "jolore@microsoft.com"
-}
\ No newline at end of file

From 2774ee89fef5b5e8bd3b11599c961ad3fc91cf6c Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 17 Feb 2018 13:02:59 -0800
Subject: [PATCH 1394/1641] Delete initials_2018-02-07-13-49.json

---
 .../file-type-icons/initials_2018-02-07-13-49.json    | 11 -----------
 1 file changed, 11 deletions(-)
 delete mode 100644 common/changes/@uifabric/file-type-icons/initials_2018-02-07-13-49.json

diff --git a/common/changes/@uifabric/file-type-icons/initials_2018-02-07-13-49.json b/common/changes/@uifabric/file-type-icons/initials_2018-02-07-13-49.json
deleted file mode 100644
index bc41d040120da..0000000000000
--- a/common/changes/@uifabric/file-type-icons/initials_2018-02-07-13-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/file-type-icons",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/file-type-icons",
-  "email": "khalle@microsoft.com"
-}
\ No newline at end of file

From 4085d8452745e9f032de1bdad95c92fc8636b2f4 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 17 Feb 2018 13:03:07 -0800
Subject: [PATCH 1395/1641] Delete
 jolore-addingWorkWeekDateRange_2018-01-24-01-39.json

---
 ...lore-addingWorkWeekDateRange_2018-01-24-01-39.json | 11 -----------
 1 file changed, 11 deletions(-)
 delete mode 100644 common/changes/@uifabric/file-type-icons/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json

diff --git a/common/changes/@uifabric/file-type-icons/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json b/common/changes/@uifabric/file-type-icons/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
deleted file mode 100644
index b8195d1db67c5..0000000000000
--- a/common/changes/@uifabric/file-type-icons/jolore-addingWorkWeekDateRange_2018-01-24-01-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/file-type-icons",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/file-type-icons",
-  "email": "jolore@microsoft.com"
-}
\ No newline at end of file

From 134e85a19f68e9b4e5a3a65fca9e062c74c4edb2 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 17 Feb 2018 13:05:15 -0800
Subject: [PATCH 1396/1641] Delete initials_2018-02-07-13-49.json

---
 .../@uifabric/icons/initials_2018-02-07-13-49.json    | 11 -----------
 1 file changed, 11 deletions(-)
 delete mode 100644 common/changes/@uifabric/icons/initials_2018-02-07-13-49.json

diff --git a/common/changes/@uifabric/icons/initials_2018-02-07-13-49.json b/common/changes/@uifabric/icons/initials_2018-02-07-13-49.json
deleted file mode 100644
index 4d68b78541429..0000000000000
--- a/common/changes/@uifabric/icons/initials_2018-02-07-13-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/icons",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/icons",
-  "email": "khalle@microsoft.com"
-}
\ No newline at end of file

From cbf92456b142d9ffb3bdbce4073e0335a380d751 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 17 Feb 2018 13:05:33 -0800
Subject: [PATCH 1397/1641] Delete initials_2018-02-07-13-49.json

---
 .../initials_2018-02-07-13-49.json                    | 11 -----------
 1 file changed, 11 deletions(-)
 delete mode 100644 common/changes/@uifabric/jest-serializer-merge-styles/initials_2018-02-07-13-49.json

diff --git a/common/changes/@uifabric/jest-serializer-merge-styles/initials_2018-02-07-13-49.json b/common/changes/@uifabric/jest-serializer-merge-styles/initials_2018-02-07-13-49.json
deleted file mode 100644
index f308df63f7ee1..0000000000000
--- a/common/changes/@uifabric/jest-serializer-merge-styles/initials_2018-02-07-13-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/jest-serializer-merge-styles",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/jest-serializer-merge-styles",
-  "email": "khalle@microsoft.com"
-}
\ No newline at end of file

From 33ea0dfb5d5fcb07e5a4f96ff278cf9149cbffee Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Sat, 17 Feb 2018 13:29:00 -0800
Subject: [PATCH 1398/1641] Applying package updates.

---
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../mergeStyles-Overlay_2018-02-14-21-47.json | 11 -----
 .../alebet-onPageAdded_2018-02-15-21-11.json  | 11 -----
 ...ndbar-test-removelog_2018-02-17-01-35.json | 11 -----
 ...-callout-targetwidth_2018-02-11-00-32.json | 11 -----
 .../mergeStyles-Overlay_2018-02-14-21-47.json | 11 -----
 ...rollablepane-scss2ms_2018-02-16-22-12.json | 11 -----
 ...tailsListCountGroups_2018-02-13-20-00.json | 11 -----
 packages/example-app-base/package.json        |  2 +-
 packages/file-type-icons/package.json         |  2 +-
 packages/icons/package.json                   |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 46 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 17 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/CHANGELOG.json               | 14 ++++++
 packages/styling/CHANGELOG.md                 |  9 +++-
 packages/styling/package.json                 |  2 +-
 20 files changed, 94 insertions(+), 89 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/mergeStyles-Overlay_2018-02-14-21-47.json
 delete mode 100644 common/changes/office-ui-fabric-react/alebet-onPageAdded_2018-02-15-21-11.json
 delete mode 100644 common/changes/office-ui-fabric-react/cammandbar-test-removelog_2018-02-17-01-35.json
 delete mode 100644 common/changes/office-ui-fabric-react/joem-fix-callout-targetwidth_2018-02-11-00-32.json
 delete mode 100644 common/changes/office-ui-fabric-react/mergeStyles-Overlay_2018-02-14-21-47.json
 delete mode 100644 common/changes/office-ui-fabric-react/scrollablepane-scss2ms_2018-02-16-22-12.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-mipatera-DetailsListCountGroups_2018-02-13-20-00.json

diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index eedd633c6d0d8..e9f1f46aced6f 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.50.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.52.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 924e7d5fc239a..21c1a5be2f5e7 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.50.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.52.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 167edaf7c7d9a..3e1d7036aaa78 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.50.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.52.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 1b712c84bf90a..0b582bfe827d1 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.50.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.52.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/@uifabric/styling/mergeStyles-Overlay_2018-02-14-21-47.json b/common/changes/@uifabric/styling/mergeStyles-Overlay_2018-02-14-21-47.json
deleted file mode 100644
index 471bf31aa6df8..0000000000000
--- a/common/changes/@uifabric/styling/mergeStyles-Overlay_2018-02-14-21-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Add whiteTranslucent40 to palette",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "v-jojanz@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/alebet-onPageAdded_2018-02-15-21-11.json b/common/changes/office-ui-fabric-react/alebet-onPageAdded_2018-02-15-21-11.json
deleted file mode 100644
index c2a111ee02e9e..0000000000000
--- a/common/changes/office-ui-fabric-react/alebet-onPageAdded_2018-02-15-21-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add notifyPageChange function to List",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "alebet@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/cammandbar-test-removelog_2018-02-17-01-35.json b/common/changes/office-ui-fabric-react/cammandbar-test-removelog_2018-02-17-01-35.json
deleted file mode 100644
index cb960ac0acf55..0000000000000
--- a/common/changes/office-ui-fabric-react/cammandbar-test-removelog_2018-02-17-01-35.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Cleaning up a console.log in CommandBar.test.tsx that I noticed while updating snapshots",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/joem-fix-callout-targetwidth_2018-02-11-00-32.json b/common/changes/office-ui-fabric-react/joem-fix-callout-targetwidth_2018-02-11-00-32.json
deleted file mode 100644
index c49ee0f15e324..0000000000000
--- a/common/changes/office-ui-fabric-react/joem-fix-callout-targetwidth_2018-02-11-00-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixes useTargetWidth prop for ContextualMenu",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joem@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/mergeStyles-Overlay_2018-02-14-21-47.json b/common/changes/office-ui-fabric-react/mergeStyles-Overlay_2018-02-14-21-47.json
deleted file mode 100644
index 90c28ae80be9c..0000000000000
--- a/common/changes/office-ui-fabric-react/mergeStyles-Overlay_2018-02-14-21-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Convert overlay and examples to mergeStyles",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-jojanz@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/scrollablepane-scss2ms_2018-02-16-22-12.json b/common/changes/office-ui-fabric-react/scrollablepane-scss2ms_2018-02-16-22-12.json
deleted file mode 100644
index cb915232cf933..0000000000000
--- a/common/changes/office-ui-fabric-react/scrollablepane-scss2ms_2018-02-16-22-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Converting SCSS to MergeStyles step 1 - file structure",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-mipatera-DetailsListCountGroups_2018-02-13-20-00.json b/common/changes/office-ui-fabric-react/users-mipatera-DetailsListCountGroups_2018-02-13-20-00.json
deleted file mode 100644
index cc596bc5d5e9f..0000000000000
--- a/common/changes/office-ui-fabric-react/users-mipatera-DetailsListCountGroups_2018-02-13-20-00.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: Groups are now considered for aria-rowcount.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mipatera@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 4d48211da8636..fffbfacd06429 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -32,7 +32,7 @@
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.18.0 <6.0.0",
+    "@uifabric/styling": ">=5.18.1 <6.0.0",
     "@uifabric/utilities": ">=5.12.0 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
diff --git a/packages/file-type-icons/package.json b/packages/file-type-icons/package.json
index 9106495ca9f51..60702aedc0bc5 100644
--- a/packages/file-type-icons/package.json
+++ b/packages/file-type-icons/package.json
@@ -26,7 +26,7 @@
     "react-dom": "^16.2.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.18.0 <6.0.0",
+    "@uifabric/styling": ">=5.18.1 <6.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/icons/package.json b/packages/icons/package.json
index b97428ed361f5..c6ed8609ea0c5 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -22,7 +22,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.18.0 <6.0.0",
+    "@uifabric/styling": ">=5.18.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 0b7070796cd26..ddbc814619fbc 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,52 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.52.0",
+      "tag": "office-ui-fabric-react_v5.52.0",
+      "date": "Sat, 17 Feb 2018 21:29:00 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Alex Bettadapur <alexbettadapur@gmail.com>",
+            "commit": "8b235107117de864c76803eeedbefb9de9e9c17e",
+            "comment": "Add notifyPageChange function to List"
+          },
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "c4aceacd30e2eddfb9ed23b2c2e2a335d268237a",
+            "comment": "Cleaning up a console.log in CommandBar.test.tsx that I noticed while updating snapshots"
+          },
+          {
+            "author": "Joe Martella <martellaj@live.com>",
+            "commit": "6a7d210880de2cf99cfa5ac154ea887140635d01",
+            "comment": "Fixes useTargetWidth prop for ContextualMenu"
+          },
+          {
+            "author": "Jordan Janzen <jordancjanzen@gmail.com>",
+            "commit": "1f1db9da4f7368806e1a819e75d7685ec7b73f04",
+            "comment": "Convert overlay and examples to mergeStyles"
+          },
+          {
+            "author": "Mike Pateras <35780775+paterasMSFT@users.noreply.github.com>",
+            "commit": "108ba47a0f555af5a833d3dbd880ddfb1bf6f5e4",
+            "comment": "DetailsList: Groups are now considered for aria-rowcount."
+          }
+        ],
+        "minor": [
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "f009d10b1c548e15b905a0148a3b79bb5c8d34b6",
+            "comment": "Converting SCSS to MergeStyles step 1 - file structure"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.18.0 <6.0.0` to `>=5.18.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.51.0",
       "tag": "office-ui-fabric-react_v5.51.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 8f4c223a7abc1..3a93d6436271f 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,21 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 16 Feb 2018 11:23:29 GMT and should not be manually modified.
+This log was last generated on Sat, 17 Feb 2018 21:29:00 GMT and should not be manually modified.
+
+## 5.52.0
+Sat, 17 Feb 2018 21:29:00 GMT
+
+### Minor changes
+
+- Converting SCSS to MergeStyles step 1 - file structure
+
+### Patches
+
+- Add notifyPageChange function to List
+- Cleaning up a console.log in CommandBar.test.tsx that I noticed while updating snapshots
+- Fixes useTargetWidth prop for ContextualMenu
+- Convert overlay and examples to mergeStyles
+- DetailsList: Groups are now considered for aria-rowcount.
 
 ## 5.51.0
 Fri, 16 Feb 2018 11:23:29 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 453aa4d188c5d..9dc3d175299ed 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.51.0",
+  "version": "5.52.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -50,7 +50,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "@uifabric/merge-styles": ">=5.12.1 <6.0.0",
-    "@uifabric/styling": ">=5.18.0 <6.0.0",
+    "@uifabric/styling": ">=5.18.1 <6.0.0",
     "@uifabric/utilities": ">=5.12.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 0fa0b63690bea..2c96d38642bf6 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.18.1",
+      "tag": "@uifabric/styling_v5.18.1",
+      "date": "Sat, 17 Feb 2018 21:29:00 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jordan Janzen <jordancjanzen@gmail.com>",
+            "commit": "1f1db9da4f7368806e1a819e75d7685ec7b73f04",
+            "comment": "Add whiteTranslucent40 to palette"
+          }
+        ]
+      }
+    },
     {
       "version": "5.18.0",
       "tag": "@uifabric/styling_v5.18.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 8885125e5eda6..ac1bb4683bc0f 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Wed, 14 Feb 2018 22:10:50 GMT and should not be manually modified.
+This log was last generated on Sat, 17 Feb 2018 21:29:00 GMT and should not be manually modified.
+
+## 5.18.1
+Sat, 17 Feb 2018 21:29:00 GMT
+
+### Patches
+
+- Add whiteTranslucent40 to palette
 
 ## 5.18.0
 Wed, 14 Feb 2018 22:10:50 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 840e8ed78cfd0..c923abebf0e52 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.18.0",
+  "version": "5.18.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "repository": {
     "type": "git",

From 99e2a7a5b8e070bfd190f84a077b0aca7c633502 Mon Sep 17 00:00:00 2001
From: Manish Garg <manishga@microsoft.com>
Date: Mon, 19 Feb 2018 19:08:24 -0800
Subject: [PATCH 1399/1641] Enable prefer-const tslint flag (#4018)

* Change let to const

* All converted and tests passing

* removed unwanted file

* Removed unwanted changes

* Make default tslint prefer-const to true
---
 apps/fabric-website/tslint.json               |   3 +-
 apps/todo-app/tslint.json                     |   3 +-
 packages/example-app-base/tslint.json         |   4 +-
 packages/experiments/tslint.json              |   4 +-
 packages/file-type-icons/tslint.json          |   4 +-
 .../jest-serializer-merge-styles/tslint.json  |   4 +-
 packages/merge-styles/tslint.json             |   4 +-
 .../office-ui-fabric-react-tslint/tslint.json |   2 +-
 .../ActivityItem/ActivityItem.styles.ts       |   2 +-
 .../ActivityItem/ActivityItem.test.tsx        |  26 +--
 .../components/ActivityItem/ActivityItem.tsx  |  10 +-
 .../examples/ActivityItem.Basic.Example.tsx   |   4 +-
 .../examples/ActivityItem.Compact.Example.tsx |   4 +-
 .../examples/ActivityItem.Persona.Example.tsx |   4 +-
 .../src/components/Autofill/Autofill.test.tsx |   4 +-
 .../src/components/Autofill/Autofill.tsx      |  12 +-
 .../components/Breadcrumb/Breadcrumb.test.tsx |  12 +-
 .../src/components/Breadcrumb/Breadcrumb.tsx  |   8 +-
 .../ActionButton/ActionButton.styles.ts       |   4 +-
 .../Button/ActionButton/ActionButton.tsx      |   2 +-
 .../components/Button/BaseButton.styles.ts    |   8 +-
 .../src/components/Button/BaseButton.tsx      |  35 ++--
 .../src/components/Button/Button.test.tsx     |  12 +-
 .../src/components/Button/ButtonThemes.ts     |  18 +-
 .../CommandBarButton.styles.ts                |   6 +-
 .../CommandBarButton/CommandBarButton.tsx     |   2 +-
 .../CompoundButton/CompoundButton.styles.ts   |  10 +-
 .../Button/CompoundButton/CompoundButton.tsx  |   2 +-
 .../DefaultButton/DefaultButton.styles.ts     |   6 +-
 .../Button/IconButton/IconButton.styles.ts    |   6 +-
 .../Button/IconButton/IconButton.tsx          |   2 +-
 .../MessageBarButton.styles.ts                |   4 +-
 .../MessageBarButton/MessageBarButton.tsx     |   2 +-
 .../Button/SplitButton/SplitButton.styles.ts  |   2 +-
 .../Button/examples/Button.Action.Example.tsx |   2 +-
 .../Button/examples/Button.Anchor.Example.tsx |   4 +-
 .../examples/Button.Command.Example.tsx       |   2 +-
 .../examples/Button.CommandBar.Example.tsx    |   2 +-
 .../examples/Button.Compound.Example.tsx      |   2 +-
 .../Button.ContextualMenu.Example.tsx         |   2 +-
 .../examples/Button.Default.Example.tsx       |   2 +-
 .../Button/examples/Button.Icon.Example.tsx   |   2 +-
 .../examples/Button.Primary.Example.tsx       |   2 +-
 .../examples/Button.ScreenReader.Example.tsx  |   2 +-
 .../Button/examples/Button.Split.Example.tsx  |   4 +-
 .../Button/examples/Button.Swap.Example.tsx   |   8 +-
 .../src/components/Calendar/Calendar.test.tsx |  52 +++---
 .../src/components/Calendar/Calendar.tsx      |  30 ++--
 .../src/components/Calendar/CalendarDay.tsx   |  56 +++---
 .../src/components/Calendar/CalendarMonth.tsx |  16 +-
 .../examples/Calendar.Inline.Example.tsx      |  20 +--
 .../src/components/Callout/Callout.test.tsx   |  14 +-
 .../src/components/Callout/Callout.tsx        |   2 +-
 .../Callout/CalloutContent.base.tsx           |  46 ++---
 .../src/components/Callout/CalloutPage.tsx    |   2 +-
 .../examples/Callout.Basic.Example.tsx        |   2 +-
 .../examples/Callout.Cover.Example.tsx        |   2 +-
 .../examples/Callout.Directional.Example.tsx  |   2 +-
 .../examples/Callout.Nested.Example.tsx       |   2 +-
 .../src/components/Check/Check.tsx            |   3 +-
 .../src/components/Checkbox/Checkbox.test.tsx |   2 +-
 .../examples/Checkbox.Basic.Example.tsx       |   2 +-
 .../Checkbox.ImplementationExamples.tsx       |   4 +-
 .../ChoiceGroup/ChoiceGroup.test.tsx          |  26 +--
 .../components/ChoiceGroup/ChoiceGroup.tsx    |  14 +-
 .../examples/ChoiceGroup.Image.Example.tsx    |   2 +-
 .../src/components/Coachmark/Coachmark.tsx    |  10 +-
 .../PositioningContainer.tsx                  |  36 ++--
 .../PositioningContainer.Basic.Example.tsx    |   2 +-
 .../examples/Coachmark.Basic.Example.tsx      |   2 +-
 .../ColorPicker/ColorPicker.test.tsx          |   2 +-
 .../components/ColorPicker/ColorPicker.tsx    |   4 +-
 .../components/ColorPicker/ColorRectangle.tsx |  18 +-
 .../components/ColorPicker/ColorSlider.tsx    |  16 +-
 .../src/components/ComboBox/ComboBox.test.tsx |  73 ++++----
 .../src/components/ComboBox/ComboBox.tsx      | 118 ++++++-------
 .../examples/ComboBox.Basic.Example.tsx       |   6 +-
 .../components/CommandBar/CommandBar.test.tsx |  34 ++--
 .../src/components/CommandBar/CommandBar.tsx  |  38 ++--
 .../components/CommandBar/CommandBarPage.tsx  |   2 +-
 .../examples/CommandBar.Basic.Example.tsx     |  10 +-
 .../CommandBar.Customization.Example.tsx      |   6 +-
 .../ContextualMenu/ContextualMenu.test.tsx    |  46 ++---
 .../ContextualMenu/ContextualMenu.tsx         |  69 ++++----
 .../ContextualMenu.Checkmarks.Example.tsx     |   6 +-
 .../ContextualMenu.Directional.Example.tsx    |   2 +-
 .../examples/ContextualMenu.Icon.Example.tsx  |   2 +-
 .../components/DatePicker/DatePicker.test.tsx |   6 +-
 .../src/components/DatePicker/DatePicker.tsx  |  10 +-
 .../examples/DatePicker.Basic.Example.tsx     |   2 +-
 .../examples/DatePicker.Bounded.Example.tsx   |   2 +-
 .../examples/DatePicker.Format.Example.tsx    |  10 +-
 .../examples/DatePicker.Input.Example.tsx     |   2 +-
 .../examples/DatePicker.Required.Example.tsx  |   2 +-
 .../DatePicker.WeekNumbers.Example.tsx        |   2 +-
 .../components/DetailsList/DetailsHeader.tsx  |  40 ++---
 .../components/DetailsList/DetailsList.tsx    |  87 ++++-----
 .../src/components/DetailsList/DetailsRow.tsx |  24 +--
 .../DetailsList/DetailsRowCheck.tsx           |   2 +-
 .../DetailsList/DetailsRowFields.tsx          |   8 +-
 .../examples/DetailsList.Advanced.Example.tsx |  39 ++--
 .../examples/DetailsList.Basic.Example.tsx    |   8 +-
 .../examples/DetailsList.Compact.Example.tsx  |   8 +-
 .../DetailsList.CustomColumns.Example.tsx     |  15 +-
 .../DetailsList.Documents.Example.tsx         |   8 +-
 .../examples/DetailsList.DragDrop.Example.tsx |   6 +-
 .../examples/DetailsList.Grouped.Example.tsx  |   8 +-
 .../src/components/Dialog/Dialog.test.tsx     |   2 +-
 .../src/components/Dialog/Dialog.tsx          |   6 +-
 .../src/components/Dialog/DialogContent.tsx   |   6 +-
 .../DocumentCard/DocumentCard.test.tsx        |   2 +-
 .../components/DocumentCard/DocumentCard.tsx  |  10 +-
 .../DocumentCard/DocumentCardActions.tsx      |   2 +-
 .../DocumentCard/DocumentCardActivity.tsx     |   2 +-
 .../DocumentCard/DocumentCardLocation.tsx     |   2 +-
 .../DocumentCard/DocumentCardPreview.tsx      |  14 +-
 .../DocumentCard/DocumentCardTitle.tsx        |  12 +-
 .../examples/DocumentCard.Basic.Example.tsx   |   2 +-
 .../examples/DocumentCard.Compact.Example.tsx |   4 +-
 .../DocumentCard.Complete.Example.tsx         |   4 +-
 .../src/components/Dropdown/Dropdown.test.tsx | 166 +++++++++---------
 .../src/components/Dropdown/Dropdown.tsx      |  80 +++++----
 .../examples/Dropdown.Basic.Example.tsx       |   8 +-
 .../src/components/Fabric/Fabric.tsx          |   2 +-
 .../src/components/Facepile/Facepile.test.tsx |   2 +-
 .../src/components/Facepile/Facepile.tsx      |  22 +--
 .../examples/Facepile.AddFace.Example.tsx     |   4 +-
 .../examples/Facepile.Basic.Example.tsx       |   4 +-
 .../examples/Facepile.Overflow.Example.tsx    |   2 +-
 .../FocusTrapZone/FocusTrapZone.tsx           |  18 +-
 .../FocusTrapZone/FocusTrapZonePage.tsx       |   8 +-
 .../FocusTrapZone.Box.Click.Example.tsx       |   4 +-
 .../examples/FocusTrapZone.Box.Example.tsx    |   4 +-
 ...pZone.Box.FocusOnCustomElement.Example.tsx |   4 +-
 .../examples/FocusTrapZone.Nested.Example.tsx |   4 +-
 .../src/components/FocusZone/FocusZone.tsx    |  35 ++--
 .../components/GroupedList/GroupFooter.tsx    |   2 +-
 .../components/GroupedList/GroupHeader.tsx    |  32 ++--
 .../components/GroupedList/GroupShowAll.tsx   |   2 +-
 .../components/GroupedList/GroupedList.tsx    |  46 ++---
 .../GroupedList/GroupedListSection.tsx        |  52 +++---
 .../examples/GroupedList.Basic.Example.tsx    |   2 +-
 .../examples/HoverCard.Basic.Example.tsx      |   4 +-
 .../examples/HoverCard.Target.Example.tsx     |   4 +-
 .../src/components/Icon/Icon.test.tsx         |   2 +-
 .../src/components/Icon/Icon.tsx              |   8 +-
 .../src/components/Image/Image.test.tsx       |  18 +-
 .../src/components/Image/Image.tsx            |  22 +--
 .../Image/examples/Image.Center.Example.tsx   |   2 +-
 .../Image/examples/Image.Contain.Example.tsx  |   2 +-
 .../Image/examples/Image.Cover.Example.tsx    |   2 +-
 .../examples/Image.MaximizeFrame.Example.tsx  |   2 +-
 .../Image/examples/Image.None.Example.tsx     |   2 +-
 .../src/components/Label/Label.test.tsx       |   6 +-
 .../src/components/Label/Label.tsx            |   2 +-
 .../src/components/Layer/Layer.test.tsx       |   8 +-
 .../src/components/Layer/Layer.tsx            |  12 +-
 .../Layer/examples/Layer.Basic.Example.tsx    |   2 +-
 .../Layer/examples/Layer.Hosted.Example.tsx   |   4 +-
 .../src/components/Link/Link.base.tsx         |   4 +-
 .../src/components/Link/Link.test.tsx         |  10 +-
 .../src/components/Link/LinkPage.tsx          |   2 +-
 .../src/components/List/List.test.tsx         |   2 +-
 .../src/components/List/List.tsx              |  71 ++++----
 .../List/examples/List.Basic.Example.tsx      |   8 +-
 .../List/examples/List.Ghosting.Example.tsx   |   2 +-
 .../List/examples/List.Scrolling.Example.tsx  |   2 +-
 .../MarqueeSelection/MarqueeSelection.tsx     |  30 ++--
 .../components/MessageBar/MessageBar.test.tsx |  16 +-
 .../src/components/MessageBar/MessageBar.tsx  |   2 +-
 .../src/components/Modal/Modal.tsx            |   4 +-
 .../src/components/Nav/Nav.test.tsx           |   2 +-
 .../src/components/Nav/Nav.tsx                |  16 +-
 .../components/OverflowSet/OverflowSet.tsx    |   6 +-
 .../src/components/Overlay/Overlay.tsx        |   2 +-
 .../src/components/Panel/Panel.test.tsx       |   2 +-
 .../src/components/Panel/Panel.tsx            |  20 +--
 .../src/components/Persona/Persona.test.tsx   |   8 +-
 .../src/components/Persona/Persona.tsx        |  12 +-
 .../src/components/Persona/PersonaCoin.tsx    |  20 +--
 .../Persona/PersonaInitialsColor.ts           |   3 +-
 .../components/Persona/PersonaPresence.tsx    |   2 +-
 .../examples/Persona.Alternate.Example.tsx    |   2 +-
 .../examples/Persona.Basic.Example.tsx        |   2 +-
 .../Persona.CustomCoinRender.Example.tsx      |   2 +-
 .../src/components/Pivot/Pivot.test.tsx       |   2 +-
 .../src/components/Pivot/Pivot.tsx            |   2 +-
 .../src/components/Popup/Popup.tsx            |   2 +-
 .../ProgressIndicator/ProgressIndicator.tsx   |   3 +-
 .../ProgressIndicator.Basic.Example.tsx       |   2 +-
 .../src/components/Rating/Rating.base.tsx     |  12 +-
 .../src/components/Rating/Rating.test.tsx     |  42 ++---
 .../ResizeGroup/ResizeGroup.test.tsx          |  68 +++----
 .../components/ResizeGroup/ResizeGroup.tsx    |  10 +-
 .../examples/ResizeGroup.FlexBox.Example.tsx  |   4 +-
 .../ResizeGroup.OverflowSet.Example.tsx       |  16 +-
 .../ScrollablePane.Default.Example.tsx        |   4 +-
 .../ScrollablePane.DetailsList.Example.tsx    |   8 +-
 .../components/SearchBox/SearchBox.base.tsx   |   8 +-
 .../components/SearchBox/SearchBox.test.tsx   |   2 +-
 .../src/components/Slider/Slider.test.tsx     |  26 +--
 .../src/components/Slider/Slider.tsx          |  17 +-
 .../components/SpinButton/SpinButton.test.tsx |  10 +-
 .../src/components/SpinButton/SpinButton.tsx  |   4 +-
 .../examples/SpinButton.Stateful.Example.tsx  |   4 +-
 .../src/components/Spinner/Spinner.tsx        |   2 +-
 .../ColorPickerGridCell.base.tsx              |  14 +-
 .../SwatchColorPicker.base.tsx                |   8 +-
 .../SwatchColorPicker.test.tsx                |   2 +-
 .../TeachingBubble/TeachingBubble.test.tsx    |  12 +-
 .../TeachingBubble/TeachingBubble.tsx         |   2 +-
 .../TeachingBubble/TeachingBubbleContent.tsx  |   2 +-
 .../examples/TeachingBubble.Basic.Example.tsx |   6 +-
 .../TeachingBubble.Condensed.Example.tsx      |   2 +-
 .../TeachingBubble.Illustration.Example.tsx   |   8 +-
 .../TeachingBubble.SmallHeadline.Example.tsx  |   4 +-
 ...eachingBubble.WideIllustration.Example.tsx |   8 +-
 .../components/TextField/TextField.test.tsx   |  12 +-
 .../src/components/TextField/TextField.tsx    |  22 +--
 .../TextField.CustomRender.Example.tsx        |   2 +-
 .../src/components/Theme/ThemePage.tsx        |  10 +-
 .../ThemeGenerator/ThemeGenerator.ts          |  28 +--
 .../ThemeGenerator/ThemeGeneratorPage.tsx     |  42 ++---
 .../ThemeGenerator/ThemeRulesStandard.ts      |  18 +-
 .../src/components/Toggle/Toggle.test.tsx     |  32 ++--
 .../src/components/Toggle/Toggle.tsx          |  10 +-
 .../components/pickers/BasePicker.test.tsx    |  52 +++---
 .../src/components/pickers/BasePicker.tsx     |  82 ++++-----
 .../pickers/PeoplePicker/PeoplePicker.tsx     |   2 +-
 .../PeoplePickerItems/SelectedItemDefault.tsx |   2 +-
 .../SelectedItemWithMenu.tsx                  |   2 +-
 .../examples/PeoplePicker.Types.Example.tsx   |  18 +-
 .../pickers/Suggestions/Suggestions.tsx       |  24 +--
 .../Suggestions/SuggestionsController.ts      |   2 +-
 .../examples/Picker.CustomResult.Example.tsx  |   8 +-
 .../examples/TagPicker.Basic.Example.tsx      |   2 +-
 .../ComponentStatus/ComponentStatusPage.tsx   |   4 +-
 .../office-ui-fabric-react/src/demo/index.tsx |  10 +-
 .../src/utilities/color/colors.ts             |  20 +--
 .../src/utilities/color/shades.ts             |  16 +-
 .../src/utilities/dateMath/DateMath.test.ts   |  60 +++----
 .../src/utilities/dateMath/DateMath.ts        |  38 ++--
 .../src/utilities/dateValues/TimeConstants.ts |   2 +-
 .../decorators/withContainsFocus.tsx          |   2 +-
 .../decorators/withResponsiveMode.tsx         |   6 +-
 .../src/utilities/decorators/withViewport.tsx |  18 +-
 .../src/utilities/dragdrop/DragDropHelper.tsx |  18 +-
 .../src/utilities/grid/Grid.base.tsx          |   8 +-
 .../src/utilities/grid/Grid.test.tsx          |   6 +-
 .../src/utilities/grid/GridCell.tsx           |  10 +-
 .../src/utilities/positioning.test.ts         |  51 +++---
 .../src/utilities/positioning/positioning.ts  |  40 ++---
 .../src/utilities/router/Router.tsx           |  15 +-
 .../src/utilities/selection/Selection.test.ts |  10 +-
 .../src/utilities/selection/Selection.ts      |  38 ++--
 .../src/utilities/selection/SelectionZone.tsx |  64 +++----
 .../examples/Selection.Basic.Example.tsx      |  14 +-
 packages/office-ui-fabric-react/tslint.json   |   1 -
 packages/styling/tslint.json                  |   4 +-
 packages/utilities/tslint.json                |   4 +-
 260 files changed, 1728 insertions(+), 1701 deletions(-)

diff --git a/apps/fabric-website/tslint.json b/apps/fabric-website/tslint.json
index c1579f8b41531..150bae09e1c3e 100644
--- a/apps/fabric-website/tslint.json
+++ b/apps/fabric-website/tslint.json
@@ -14,6 +14,7 @@
     "jsx-alignment": false,
     "jsx-ban-props": false,
     "jsx-no-string-ref": false,
-    "jsx-no-bind": false
+    "jsx-no-bind": false,
+    "prefer-const": false
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/tslint.json b/apps/todo-app/tslint.json
index cd3b575b4545f..640af822902da 100644
--- a/apps/todo-app/tslint.json
+++ b/apps/todo-app/tslint.json
@@ -6,6 +6,7 @@
     "no-any": false,
     "typedef": [
       false
-    ]
+    ],
+    "prefer-const": false
   }
 }
\ No newline at end of file
diff --git a/packages/example-app-base/tslint.json b/packages/example-app-base/tslint.json
index 621ee6ba04605..672d9eba8927e 100644
--- a/packages/example-app-base/tslint.json
+++ b/packages/example-app-base/tslint.json
@@ -2,5 +2,7 @@
   "extends": [
     "office-ui-fabric-react-tslint"
   ],
-  "rules": {}
+  "rules": {
+    "prefer-const": false
+  }
 }
\ No newline at end of file
diff --git a/packages/experiments/tslint.json b/packages/experiments/tslint.json
index 621ee6ba04605..672d9eba8927e 100644
--- a/packages/experiments/tslint.json
+++ b/packages/experiments/tslint.json
@@ -2,5 +2,7 @@
   "extends": [
     "office-ui-fabric-react-tslint"
   ],
-  "rules": {}
+  "rules": {
+    "prefer-const": false
+  }
 }
\ No newline at end of file
diff --git a/packages/file-type-icons/tslint.json b/packages/file-type-icons/tslint.json
index 621ee6ba04605..672d9eba8927e 100644
--- a/packages/file-type-icons/tslint.json
+++ b/packages/file-type-icons/tslint.json
@@ -2,5 +2,7 @@
   "extends": [
     "office-ui-fabric-react-tslint"
   ],
-  "rules": {}
+  "rules": {
+    "prefer-const": false
+  }
 }
\ No newline at end of file
diff --git a/packages/jest-serializer-merge-styles/tslint.json b/packages/jest-serializer-merge-styles/tslint.json
index 009d06e3cf447..621ee6ba04605 100644
--- a/packages/jest-serializer-merge-styles/tslint.json
+++ b/packages/jest-serializer-merge-styles/tslint.json
@@ -2,7 +2,5 @@
   "extends": [
     "office-ui-fabric-react-tslint"
   ],
-  "rules": {
-    "prefer-const": true
-  }
+  "rules": {}
 }
\ No newline at end of file
diff --git a/packages/merge-styles/tslint.json b/packages/merge-styles/tslint.json
index 009d06e3cf447..621ee6ba04605 100644
--- a/packages/merge-styles/tslint.json
+++ b/packages/merge-styles/tslint.json
@@ -2,7 +2,5 @@
   "extends": [
     "office-ui-fabric-react-tslint"
   ],
-  "rules": {
-    "prefer-const": true
-  }
+  "rules": {}
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-tslint/tslint.json b/packages/office-ui-fabric-react-tslint/tslint.json
index 67a68159eae09..0fcb71bed6ed9 100644
--- a/packages/office-ui-fabric-react-tslint/tslint.json
+++ b/packages/office-ui-fabric-react-tslint/tslint.json
@@ -53,7 +53,7 @@
       "property-declaration",
       "member-variable-declaration"
     ],
-    "prefer-const": false,
+    "prefer-const": true,
     "quotemark": [
       true,
       "single",
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
index c07eed7a0bab1..fd6951300fd3a 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
@@ -18,7 +18,7 @@ export const getStyles = memoizeFunction((
   theme: ITheme = getTheme(),
   customStyles?: IActivityItemStyles
 ): IActivityItemStyles => {
-  let ActivityItemStyles: IActivityItemStyles = {
+  const ActivityItemStyles: IActivityItemStyles = {
 
     root: [
       theme.fonts.small,
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.test.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.test.tsx
index f993d7b6ae030..462414f66dd3d 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.test.tsx
@@ -32,72 +32,72 @@ const defaultPersonaProps = [
 describe('ActivityItem', () => {
 
   it('renders with an icon correctly', () => {
-    let component = renderer.create(
+    const component = renderer.create(
       <ActivityItem
         {...defaultProps}
         activityIcon={ <Icon iconName={ 'Message' } /> }
       />
     );
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
   it('renders with a single persona correctly', () => {
-    let component = renderer.create(
+    const component = renderer.create(
       <ActivityItem
         {...defaultProps}
         activityPersonas={ [defaultPersonaProps[0]] }
       />
     );
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
   it('renders with multiple personas correctly', () => {
-    let component = renderer.create(
+    const component = renderer.create(
       <ActivityItem
         {...defaultProps}
         activityPersonas={ defaultPersonaProps }
       />
     );
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
   it('renders compact with an icon correctly', () => {
-    let component = renderer.create(
+    const component = renderer.create(
       <ActivityItem
         {...defaultProps}
         activityIcon={ <Icon iconName={ 'Message' } /> }
         isCompact={ true }
       />
     );
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
   it('renders compact with a single persona correctly', () => {
-    let component = renderer.create(
+    const component = renderer.create(
       <ActivityItem
         {...defaultProps}
         activityPersonas={ [defaultPersonaProps[0]] }
         isCompact={ true }
       />
     );
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
   it('renders compact with multiple personas correctly', () => {
-    let component = renderer.create(
+    const component = renderer.create(
       <ActivityItem
         {...defaultProps}
         activityPersonas={ defaultPersonaProps }
         isCompact={ true }
       />
     );
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
-});
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
index 610e71dbc1913..814a480422d6f 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
@@ -18,7 +18,7 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
   }
 
   public render() {
-    let {
+    const {
       onRenderIcon = this._onRenderIcon,
       onRenderActivityDescription = this._onRenderActivityDescription,
       onRenderComments = this._onRenderComments,
@@ -97,11 +97,11 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
   @autobind
   private _onRenderPersonaArray(props: IActivityItemProps): JSX.Element | null {
     let personaElement: JSX.Element | null = null;
-    let activityPersonas = props.activityPersonas as Array<IPersonaProps & { key?: string | number }>;
+    const activityPersonas = props.activityPersonas as Array<IPersonaProps & { key?: string | number }>;
     if (activityPersonas[0].imageUrl || activityPersonas[0].imageInitials) {
-      let personaList: Array<JSX.Element> = [];
-      let showSize16Personas = (activityPersonas.length > 1 || props.isCompact);
-      let personaLimit = props.isCompact ? 3 : 4;
+      const personaList: Array<JSX.Element> = [];
+      const showSize16Personas = (activityPersonas.length > 1 || props.isCompact);
+      const personaLimit = props.isCompact ? 3 : 4;
       let style: React.CSSProperties | undefined = undefined;
       if (props.isCompact) {
         style = {
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Basic.Example.tsx
index 183891565cf45..838d6fd39bec7 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Basic.Example.tsx
@@ -56,9 +56,9 @@ export class ActivityItemBasicExample extends React.Component<React.Props<Activi
       }
     ];
 
-    let activityExampleList: Array<JSX.Element> = [];
+    const activityExampleList: Array<JSX.Element> = [];
     activityItemExamples.forEach((item) => {
-      let props = item;
+      const props = item;
       activityExampleList.push(
         <ActivityItem {...props} key={ item.key } className={ css(classNames.exampleRoot) } />
       );
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Compact.Example.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Compact.Example.tsx
index 1f845e585933b..56a68c5f440d6 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Compact.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Compact.Example.tsx
@@ -72,9 +72,9 @@ export class ActivityItemCompactExample extends React.Component<React.Props<Acti
       }
     ];
 
-    let activityExampleList: Array<JSX.Element> = [];
+    const activityExampleList: Array<JSX.Element> = [];
     activityItemExamples.forEach((item) => {
-      let props = item;
+      const props = item;
       activityExampleList.push(
         <ActivityItem {...props} key={ item.key } className={ css(classNames.exampleRoot) } />
       );
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Persona.Example.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Persona.Example.tsx
index 7087b67f512a2..204be27e2a29f 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Persona.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Persona.Example.tsx
@@ -109,9 +109,9 @@ export class ActivityItemPersonaExample extends React.Component<React.Props<Acti
       }
     ];
 
-    let activityExampleList: Array<JSX.Element> = [];
+    const activityExampleList: Array<JSX.Element> = [];
     activityItemExamples.forEach((item) => {
-      let props = item;
+      const props = item;
       activityExampleList.push(
         <ActivityItem {...props} key={ item.key } className={ css(classNames.exampleRoot) } />
       );
diff --git a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.test.tsx b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.test.tsx
index 4f2963461f5c5..c70c381eb2c75 100644
--- a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.test.tsx
@@ -11,11 +11,11 @@ import { Autofill } from './Autofill';
 describe('Autofill', () => {
   let autoFill: Autofill;
   let autoFillInput: HTMLInputElement;
-  let baseNode = document.createElement('div');
+  const baseNode = document.createElement('div');
   document.body.appendChild(baseNode);
   beforeEach(() => {
 
-    let component = ReactDOM.render(
+    const component = ReactDOM.render(
       <Autofill
         ref={ (c) => autoFill = c! }
         suggestedDisplayValue='hello'
diff --git a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx
index 4d40ee53a5963..b4dfb73618bb2 100644
--- a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx
+++ b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx
@@ -35,7 +35,7 @@ export class Autofill extends BaseComponent<IAutofillProps, IAutofillState> impl
 
   public get cursorLocation(): number {
     if (this._inputElement) {
-      let inputElement = this._inputElement;
+      const inputElement = this._inputElement;
       if (inputElement.selectionDirection !== SELECTION_FORWARD) {
         return inputElement.selectionEnd;
       } else {
@@ -81,8 +81,8 @@ export class Autofill extends BaseComponent<IAutofillProps, IAutofillState> impl
   }
 
   public componentDidUpdate() {
-    let value = this._value;
-    let {
+    const value = this._value;
+    const {
       suggestedDisplayValue,
       shouldSelectFullInputValueInComponentDidUpdate
     } = this.props;
@@ -109,7 +109,7 @@ export class Autofill extends BaseComponent<IAutofillProps, IAutofillState> impl
   }
 
   public render() {
-    let {
+    const {
       displayValue
     } = this.state;
 
@@ -154,7 +154,7 @@ export class Autofill extends BaseComponent<IAutofillProps, IAutofillState> impl
   // Find out more at https://developer.mozilla.org/en-US/docs/Web/Events/compositionstart
   @autobind
   private _onCompositionEnd(ev: React.CompositionEvent<HTMLInputElement>) {
-    let inputValue = this._getCurrentInputValue();
+    const inputValue = this._getCurrentInputValue();
     this._tryEnableAutofill(inputValue, this.value, false, true);
     // Due to timing, this needs to be async, otherwise no text will be selected.
     this._async.setTimeout(() => this._updateValue(inputValue), 0);
@@ -200,7 +200,7 @@ export class Autofill extends BaseComponent<IAutofillProps, IAutofillState> impl
 
   @autobind
   private _onChange(ev: React.FormEvent<HTMLElement>) {
-    let value: string = this._getCurrentInputValue(ev);
+    const value: string = this._getCurrentInputValue(ev);
     // Right now typing does not have isComposing, once that has been fixed any should be removed.
     this._tryEnableAutofill(value, this._value, (ev.nativeEvent as any).isComposing);
     this._updateValue(value);
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx
index d2ae7c88e4e24..843ca2f525553 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.test.tsx
@@ -49,14 +49,14 @@ describe('Breadcrumb', () => {
       { text: 'TestText', key: 'TestKey', onClick: clickCallback }
     ];
 
-    let component = ReactTestUtils.renderIntoDocument<Breadcrumb>(
+    const component = ReactTestUtils.renderIntoDocument<Breadcrumb>(
       <Breadcrumb
         items={ items }
       />
     );
 
-    let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
-    let itemLink = renderedDOM.querySelector('.ms-Breadcrumb-itemLink');
+    const renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
+    const itemLink = renderedDOM.querySelector('.ms-Breadcrumb-itemLink');
 
     ReactTestUtils.Simulate.click(itemLink!);
     expect(callbackValue).toEqual('TestKey');
@@ -71,15 +71,15 @@ describe('Breadcrumb', () => {
       { text: 'TestText4', key: 'TestKey4' }
     ];
 
-    let component = ReactTestUtils.renderIntoDocument<Breadcrumb>(
+    const component = ReactTestUtils.renderIntoDocument<Breadcrumb>(
       <Breadcrumb
         items={ items }
         maxDisplayedItems={ 2 }
       />
     );
 
-    let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
-    let itemLink = renderedDOM.querySelectorAll('.ms-Breadcrumb-item');
+    const renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
+    const itemLink = renderedDOM.querySelectorAll('.ms-Breadcrumb-item');
 
     expect(itemLink[0].textContent).toEqual('TestText3');
   });
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
index 1b3b682702215..6c6409e6733dc 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
@@ -56,7 +56,7 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
   @autobind
   private _onReduceData(data: IBreadCrumbData): IBreadCrumbData | undefined {
     let { renderedItems, renderedOverflowItems } = data;
-    let movedItem = renderedItems[0];
+    const movedItem = renderedItems[0];
     renderedItems = renderedItems.slice(1);
 
     renderedOverflowItems = [...renderedOverflowItems, movedItem];
@@ -68,10 +68,10 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
 
   @autobind
   private _onRenderBreadcrumb(data: IBreadCrumbData) {
-    let { className, ariaLabel, onRenderItem = this._onRenderItem } = data.props;
-    let { renderedOverflowItems, renderedItems } = data;
+    const { className, ariaLabel, onRenderItem = this._onRenderItem } = data.props;
+    const { renderedOverflowItems, renderedItems } = data;
 
-    let contextualItems = renderedOverflowItems.map(
+    const contextualItems = renderedOverflowItems.map(
       (item, index) => ({
         name: item.text,
         key: item.key,
diff --git a/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.styles.ts
index 406b8c933d9c7..3ea21f35580ff 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.styles.ts
@@ -15,8 +15,8 @@ export const getStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: IButtonStyles
 ): IButtonStyles => {
-  let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
-  let actionButtonStyles: IButtonStyles = {
+  const baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
+  const actionButtonStyles: IButtonStyles = {
     root: {
       padding: DEFAULT_PADDING,
       height: DEFAULT_BUTTON_HEIGHT,
diff --git a/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx b/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx
index 491b6ece22e84..c99913121c977 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ActionButton/ActionButton.tsx
@@ -13,7 +13,7 @@ export class ActionButton extends BaseComponent<IButtonProps, {}> {
   protected _shouldUpdateComponentRef = false;
 
   public render() {
-    let { styles, theme } = this.props;
+    const { styles, theme } = this.props;
 
     return (
       <BaseButton
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
index c2116f22bd57f..0d8c57082c3a3 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
@@ -30,11 +30,11 @@ const iconStyle = {
 export const getStyles = memoizeFunction((
   theme: ITheme
 ): IButtonStyles => {
-  let { semanticColors } = theme;
+  const { semanticColors } = theme;
 
-  let border = semanticColors.buttonBorder;
-  let disabledBackground = semanticColors.disabledBackground;
-  let disabledText = semanticColors.disabledText;
+  const border = semanticColors.buttonBorder;
+  const disabledBackground = semanticColors.disabledBackground;
+  const disabledText = semanticColors.disabledText;
 
   return {
     root: [
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index aa00e77d0dc64..dc4cdb3965e29 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -90,9 +90,9 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       getClassNames
          } = this.props;
 
-    let { menuProps } = this.state;
+    const { menuProps } = this.state;
     // Button is disabled if the whole button (in case of splitbutton is disabled) or if the primary action is disabled
-    let isPrimaryButtonDisabled = (disabled || primaryDisabled);
+    const isPrimaryButtonDisabled = (disabled || primaryDisabled);
 
     this._classNames = getClassNames ? getClassNames(
       theme!,
@@ -124,7 +124,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         this.props),
       renderAsAnchor ? anchorProperties : buttonProperties,
       [
-        'disabled' // Let disabled buttons be focused and styled as disabled.
+        'disabled' // let disabled buttons be focused and styled as disabled.
       ]);
 
     // Check for ariaDescription, description or aria-describedby in the native props to determine source of aria-describedby
@@ -210,9 +210,9 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   }
 
   private _onRenderContent(tag: any, buttonProps: IButtonProps): JSX.Element {
-    let props = this.props;
-    let Tag = tag;
-    let {
+    const props = this.props;
+    const Tag = tag;
+    const {
       menuIconProps,
       menuProps,
       onRenderIcon = this._onRenderIcon,
@@ -249,7 +249,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
 
   @autobind
   private _onRenderIcon(buttonProps?: IButtonProps, defaultRender?: IRenderFunction<IButtonProps>): JSX.Element | null {
-    let {
+    const {
       iconProps
        } = this.props;
 
@@ -264,7 +264,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
 
   @autobind
   private _onRenderTextContents(): JSX.Element | (JSX.Element | null)[] {
-    let {
+    const {
       text,
       children,
       description,
@@ -291,9 +291,11 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   @autobind
   private _onRenderText(): JSX.Element | null {
     let {
-      children,
       text
-            } = this.props;
+    } = this.props;
+    const {
+      children
+    } = this.props;
 
     // For backwards compat, we should continue to take in the text content from children.
     if (text === undefined && typeof (children) === 'string') {
@@ -366,7 +368,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
 
   @autobind
   private _onRenderMenuIcon(props: IButtonProps): JSX.Element | null {
-    let {
+    const {
       menuIconProps
     } = this.props;
 
@@ -406,7 +408,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   @autobind
   private _onToggleMenu(): void {
     const { menuProps } = this.props;
-    let currentMenuProps = this.state.menuProps;
+    const currentMenuProps = this.state.menuProps;
     this.setState({ menuProps: currentMenuProps ? null : menuProps });
   }
 
@@ -461,6 +463,9 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   private _onRenderSplitButtonMenuButton(classNames: ISplitButtonClassNames | undefined): JSX.Element {
     let {
       menuIconProps,
+    } = this.props;
+
+    const {
       splitButtonAriaLabel
     } = this.props;
 
@@ -470,7 +475,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       };
     }
 
-    let splitButtonProps = {
+    const splitButtonProps = {
       'styles': classNames,
       'checked': this.props.checked,
       'disabled': this.props.disabled,
@@ -501,7 +506,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       this.props.onKeyDown(ev);
     }
 
-    let { onMenuClick } = this.props;
+    const { onMenuClick } = this.props;
     if (onMenuClick) {
       onMenuClick(ev, this);
     }
@@ -517,7 +522,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
 
   @autobind
   private _onMenuClick(ev: React.MouseEvent<HTMLAnchorElement>) {
-    let { onMenuClick } = this.props;
+    const { onMenuClick } = this.props;
     if (onMenuClick) {
       onMenuClick(ev, this);
     }
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
index b50f0b53f612c..df1c3edab4bbb 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
@@ -19,13 +19,13 @@ const alertClicked = (): void => { /*noop*/ };
 describe('Button', () => {
   it('renders DefaultButton correctly', () => {
     const component = renderer.create(<DefaultButton text='Button' />);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
   it('renders ActionButton correctly', () => {
     const component = renderer.create(<ActionButton>Button</ActionButton>);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
@@ -49,7 +49,7 @@ describe('Button', () => {
           ]
         } }
       />);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
@@ -58,7 +58,7 @@ describe('Button', () => {
       <CompoundButton description='You can create a new account here.'>
         Create account
     </CompoundButton>);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
@@ -69,7 +69,7 @@ describe('Button', () => {
         title='Emoji'
         ariaLabel='Emoji'
       />);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
@@ -89,7 +89,7 @@ describe('Button', () => {
     });
 
     it('can render with an onClick.', () => {
-      let onClick: () => null = () => null;
+      const onClick: () => null = () => null;
 
       const button = ReactTestUtils.renderIntoDocument<any>(
         <DefaultButton onClick={ onClick }>Hello</DefaultButton>
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts b/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
index 808bcfd3a1966..8ffc2d20125e2 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
@@ -2,17 +2,17 @@ import { IButtonStyles } from './Button.types';
 import { ITheme, HighContrastSelector } from '../../Styling';
 
 export function standardStyles(theme: ITheme): IButtonStyles {
-  let s = theme.semanticColors;
+  const s = theme.semanticColors;
 
-  let buttonBackground = s.buttonBackground;
-  let buttonBackgroundChecked = s.buttonBackgroundChecked;
-  let buttonBackgroundHovered = s.buttonBackgroundHovered;
-  let buttonBackgroundCheckedHovered = s.buttonBackgroundCheckedHovered;
+  const buttonBackground = s.buttonBackground;
+  const buttonBackgroundChecked = s.buttonBackgroundChecked;
+  const buttonBackgroundHovered = s.buttonBackgroundHovered;
+  const buttonBackgroundCheckedHovered = s.buttonBackgroundCheckedHovered;
 
-  let buttonText = s.buttonText;
-  let buttonTextHovered = s.buttonTextHovered;
-  let buttonTextChecked = s.buttonTextChecked;
-  let buttonTextCheckedHovered = s.buttonTextCheckedHovered;
+  const buttonText = s.buttonText;
+  const buttonTextHovered = s.buttonTextHovered;
+  const buttonTextChecked = s.buttonTextChecked;
+  const buttonTextCheckedHovered = s.buttonTextCheckedHovered;
 
   return {
     root: {
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts
index 6a8f5856c1d60..d76227886d637 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts
@@ -17,9 +17,9 @@ export const getStyles = memoizeFunction((
   focusInset?: string,
   focusColor?: string
 ): IButtonStyles => {
-  let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
-  let baseSplitButtonStyles: IButtonStyles = getSplitButtonStyles(theme);
-  let commandButtonStyles: IButtonStyles = {
+  const baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
+  const baseSplitButtonStyles: IButtonStyles = getSplitButtonStyles(theme);
+  const commandButtonStyles: IButtonStyles = {
     root: {
       minWidth: '40px',
       backgroundColor: theme.palette.neutralLighter,
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx
index dbd000543dd3a..c5b55c2678e0d 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.tsx
@@ -12,7 +12,7 @@ export class CommandBarButton extends BaseComponent<IButtonProps, {}> {
   protected _shouldUpdateComponentRef = false;
 
   public render() {
-    let { styles, theme } = this.props;
+    const { styles, theme } = this.props;
 
     return (
       <BaseButton
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
index 7db84da2cdd90..2722551167fe5 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.styles.ts
@@ -22,9 +22,9 @@ export const getStyles = memoizeFunction((
   customStyles?: IButtonStyles,
   primary?: boolean
 ): IButtonStyles => {
-  let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
-  let splitButtonStyles: IButtonStyles = getSplitButtonStyles(theme);
-  let compoundButtonStyles: IButtonStyles = {
+  const baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
+  const splitButtonStyles: IButtonStyles = getSplitButtonStyles(theme);
+  const compoundButtonStyles: IButtonStyles = {
     root: {
       maxWidth: '280px',
       minHeight: '72px',
@@ -66,7 +66,7 @@ export const getStyles = memoizeFunction((
 
   };
 
-  let standardCompoundTheme: IButtonStyles = {
+  const standardCompoundTheme: IButtonStyles = {
 
     description: {
       color: theme.palette.neutralSecondary,
@@ -89,7 +89,7 @@ export const getStyles = memoizeFunction((
     }
   };
 
-  let primaryCompoundTheme: IButtonStyles = {
+  const primaryCompoundTheme: IButtonStyles = {
 
     description: {
       color: theme.palette.white,
diff --git a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
index 8b44d9f464dff..96cd9e73660a7 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/CompoundButton/CompoundButton.tsx
@@ -12,7 +12,7 @@ export class CompoundButton extends BaseComponent<IButtonProps, {}> {
   protected _shouldUpdateComponentRef = false;
 
   public render() {
-    let { primary = false, styles, theme } = this.props;
+    const { primary = false, styles, theme } = this.props;
     return (
       <BaseButton
         { ...this.props }
diff --git a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
index a7096313aa56d..c8880bba06e0f 100644
--- a/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/DefaultButton/DefaultButton.styles.ts
@@ -25,9 +25,9 @@ export const getStyles = memoizeFunction((
   customStyles?: IButtonStyles,
   primary?: boolean
 ): IButtonStyles => {
-  let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
-  let splitButtonStyles: IButtonStyles = getSplitButtonStyles(theme);
-  let defaultButtonStyles: IButtonStyles = {
+  const baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
+  const splitButtonStyles: IButtonStyles = getSplitButtonStyles(theme);
+  const defaultButtonStyles: IButtonStyles = {
     root: {
       minWidth: DEFAULT_BUTTON_MINWIDTH,
       height: DEFAULT_BUTTON_HEIGHT,
diff --git a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
index dae28404cd08c..7792c4b2551b0 100644
--- a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.styles.ts
@@ -15,9 +15,9 @@ export const getStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: IButtonStyles
 ): IButtonStyles => {
-  let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
-  let splitButtonStyles: IButtonStyles = getSplitButtonStyles(theme);
-  let iconButtonStyles: IButtonStyles = {
+  const baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
+  const splitButtonStyles: IButtonStyles = getSplitButtonStyles(theme);
+  const iconButtonStyles: IButtonStyles = {
     root: {
       padding: '0 4px',
       width: '32px',
diff --git a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
index 9d6367a36cfbe..775ecceba5cc6 100644
--- a/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/IconButton/IconButton.tsx
@@ -12,7 +12,7 @@ export class IconButton extends BaseComponent<IButtonProps, {}> {
   protected _shouldUpdateComponentRef = false;
 
   public render() {
-    let { styles, theme } = this.props;
+    const { styles, theme } = this.props;
 
     return (
       <BaseButton
diff --git a/packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.styles.ts
index 7e797034447bb..a13d1956c2db5 100644
--- a/packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.styles.ts
@@ -14,8 +14,8 @@ export const getStyles = memoizeFunction((
   focusInset?: string,
   focusColor?: string
 ): IButtonStyles => {
-  let baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
-  let messageBarButtonStyles: IButtonStyles = {
+  const baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
+  const messageBarButtonStyles: IButtonStyles = {
     root: {
       backgroundColor: theme.palette.neutralQuaternaryAlt,
       color: theme.palette.neutralPrimary
diff --git a/packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.tsx b/packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.tsx
index e39a2789c8b6c..c59d000ab98a1 100644
--- a/packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/MessageBarButton/MessageBarButton.tsx
@@ -8,7 +8,7 @@ import { getStyles } from './MessageBarButton.styles';
 export class MessageBarButton extends BaseComponent<IButtonProps, {}> {
 
   public render() {
-    let { styles, theme } = this.props;
+    const { styles, theme } = this.props;
 
     return (
       <DefaultButton
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
index 913c8b0ab1680..7c37163660a57 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
@@ -10,7 +10,7 @@ export const getStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: IButtonStyles
 ): IButtonStyles => {
-  let splitButtonStyles: IButtonStyles = {
+  const splitButtonStyles: IButtonStyles = {
     splitButtonContainer: {
       position: 'relative',
       display: 'inline-block',
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx
index 7dcfd418f4b1f..dd8603446821a 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Action.Example.tsx
@@ -16,7 +16,7 @@ export class ButtonActionExample extends React.Component<IButtonProps> {
   }
 
   public render() {
-    let { disabled, checked } = this.props;
+    const { disabled, checked } = this.props;
 
     const getClassNames = classNamesFunction<IButtonBasicExampleStyleProps, IButtonBasicExampleStyles>();
     const classNames = getClassNames(getStyles);
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
index 5490a3a062eb8..adbd686f9f493 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
@@ -15,7 +15,7 @@ import {
 
 export class ButtonAnchorExample extends React.Component<IButtonProps> {
   public render() {
-    let { disabled, checked } = this.props;
+    const { disabled, checked } = this.props;
 
     const getClassNames = classNamesFunction<IButtonBasicExampleStyleProps, IButtonBasicExampleStyles>();
     const classNames = getClassNames(getStyles);
@@ -28,7 +28,7 @@ export class ButtonAnchorExample extends React.Component<IButtonProps> {
           checked={ checked }
           href='http://bing.com'
           target='_blank'
-          title='Let us bing!'
+          title='let us bing!'
         >
           Bing
         </DefaultButton>
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Command.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Command.Example.tsx
index 6e11b46aafb08..4617d5420cb86 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Command.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Command.Example.tsx
@@ -3,7 +3,7 @@ import { CommandButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
 
 export class ButtonCommandExample extends React.Component<IButtonProps, {}> {
   public render() {
-    let { disabled, checked } = this.props;
+    const { disabled, checked } = this.props;
 
     return (
       <div>
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.CommandBar.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.CommandBar.Example.tsx
index 3ef494a34669f..c1ba4cf865759 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.CommandBar.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.CommandBar.Example.tsx
@@ -3,7 +3,7 @@ import { CommandBarButton, IButtonProps } from 'office-ui-fabric-react/lib/Butto
 
 export class ButtonCommandBarExample extends React.Component<IButtonProps, {}> {
   public render() {
-    let { disabled, checked } = this.props;
+    const { disabled, checked } = this.props;
 
     return (
       <div>
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx
index 92c31dded940a..19a42f41c4c63 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Compound.Example.tsx
@@ -17,7 +17,7 @@ export class ButtonCompoundExample extends React.Component<IButtonProps> {
   }
 
   public render() {
-    let { disabled, checked } = this.props;
+    const { disabled, checked } = this.props;
 
     const getClassNames = classNamesFunction<IButtonBasicExampleStyleProps, IButtonBasicExampleStyles>();
     const classNames = getClassNames(getStyles);
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.ContextualMenu.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.ContextualMenu.Example.tsx
index fe610776134a1..31aff85d1f4cd 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.ContextualMenu.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.ContextualMenu.Example.tsx
@@ -3,7 +3,7 @@ import { DefaultButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
 
 export class ButtonContextualMenuExample extends React.Component<IButtonProps, {}> {
   public render() {
-    let { disabled, checked } = this.props;
+    const { disabled, checked } = this.props;
 
     return (
       <div className='ms-ContextualMenuButtonsExample'>
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
index a9809406fd143..7e145591eefde 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Default.Example.tsx
@@ -10,7 +10,7 @@ import { Label } from 'office-ui-fabric-react/lib/Label';
 
 export class ButtonDefaultExample extends React.Component<IButtonProps, {}> {
   public render() {
-    let { disabled, checked } = this.props;
+    const { disabled, checked } = this.props;
 
     const getClassNames = classNamesFunction<IButtonBasicExampleStyleProps, IButtonBasicExampleStyles>();
     const classNames = getClassNames(getStyles);
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx
index 88fd480f3c541..74b9d3be7d68e 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx
@@ -10,7 +10,7 @@ import { Label } from 'office-ui-fabric-react/lib/Label';
 
 export class ButtonIconExample extends React.Component<IButtonProps> {
   public render() {
-    let { disabled, checked } = this.props;
+    const { disabled, checked } = this.props;
 
     const getClassNames = classNamesFunction<IButtonBasicExampleStyleProps, IButtonBasicExampleStyles>();
     const classNames = getClassNames(getStyles);
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
index 23c09a4f712b2..7962b3cd33805 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
@@ -10,7 +10,7 @@ import { Label } from 'office-ui-fabric-react/lib/Label';
 
 export class ButtonPrimaryExample extends React.Component<IButtonProps> {
   public render() {
-    let { disabled, checked } = this.props;
+    const { disabled, checked } = this.props;
 
     const getClassNames = classNamesFunction<IButtonBasicExampleStyleProps, IButtonBasicExampleStyles>();
     const classNames = getClassNames(getStyles);
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx
index 8cbef6dc44719..b0fc2ef829ce3 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx
@@ -10,7 +10,7 @@ import { Label } from 'office-ui-fabric-react/lib/Label';
 
 export class ButtonScreenReaderExample extends React.Component<IButtonProps, {}> {
   public render() {
-    let { disabled, checked } = this.props;
+    const { disabled, checked } = this.props;
 
     const getClassNames = classNamesFunction<IButtonBasicExampleStyleProps, IButtonBasicExampleStyles>();
     const classNames = getClassNames(getStyles);
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
index 2c1d498a523b6..36049fc90a03c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
@@ -16,7 +16,7 @@ const alertClicked = (): void => {
 export class ButtonSplitExample extends React.Component<IButtonProps> {
 
   public render() {
-    let { disabled, checked } = this.props;
+    const { disabled, checked } = this.props;
 
     const getClassNames = classNamesFunction<IButtonBasicExampleStyleProps, IButtonBasicExampleStyles>();
     const classNames = getClassNames(getStyles);
@@ -113,7 +113,7 @@ export class ButtonSplitExample extends React.Component<IButtonProps> {
 export class ButtonSplitCustomExample extends React.Component<IButtonProps> {
 
   public render() {
-    let { disabled, checked } = this.props;
+    const { disabled, checked } = this.props;
     const customSplitButtonStyles = getCustomSplitButtonStyles();
 
     return (
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
index 2124d506341f0..a48b773f1dd60 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
@@ -44,12 +44,12 @@ export class ButtonSwapExample extends React.Component<IButtonProps, IButtonSwap
   }
 
   public render() {
-    let { isPrimary } = this.state;
-    let { disabled, checked } = this.props;
-    let text = 'Swap';
+    const { isPrimary } = this.state;
+    const { disabled, checked } = this.props;
+    const text = 'Swap';
 
     // determine which button to render
-    let button = isPrimary
+    const button = isPrimary
       ? (
         <PrimaryButton
           ref={ this._setButtonRef }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
index 770846ffc51e3..6616d450c70a4 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.test.tsx
@@ -12,7 +12,7 @@ import { DateRangeType, DayOfWeek } from './Calendar.types';
 import { addDays, compareDates } from '../../utilities/dateMath/DateMath';
 
 describe('Calendar', () => {
-  let dayPickerStrings = {
+  const dayPickerStrings = {
     months: [
       'January',
       'February',
@@ -68,18 +68,18 @@ describe('Calendar', () => {
 
   it('can handle invalid starting dates', () => {
     // Arrange
-    let defaultDate = new Date('invalid');
+    const defaultDate = new Date('invalid');
 
     // Act
 
-    let renderedComponent = mount(
+    const renderedComponent = mount(
       <Calendar
         strings={ dayPickerStrings }
         isMonthPickerVisible={ true }
         value={ defaultDate }
       />);
 
-    let today = renderedComponent.find('.ms-DatePicker-day--today');
+    const today = renderedComponent.find('.ms-DatePicker-day--today');
     expect(+today.text()).toEqual(new Date().getDate());
   });
 
@@ -104,21 +104,21 @@ describe('Calendar', () => {
         />
       );
 
-      let tree = component.toJSON();
+      const tree = component.toJSON();
       expect(tree).toMatchSnapshot();
     });
 
     it('Verify day picker header', () => {
-      let today = new Date();
-      let monthName = dayPickerStrings.months[today.getMonth()];
-      let year = today.getFullYear();
-      let dayPickerMonth = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-monthAndYear');
+      const today = new Date();
+      const monthName = dayPickerStrings.months[today.getMonth()];
+      const year = today.getFullYear();
+      const dayPickerMonth = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-monthAndYear');
       expect(dayPickerMonth).toBeDefined();
       expect(dayPickerMonth.textContent).toEqual(monthName + ' ' + year.toString());
     });
 
     it('Verify first day of week', () => {
-      let dayHeaders = ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedComponent, 'ms-DatePicker-weekday');
+      const dayHeaders = ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedComponent, 'ms-DatePicker-weekday');
       expect(dayHeaders.length).toEqual(7);
       expect(dayHeaders[0].textContent).toEqual(dayPickerStrings.shortDays[0]);
       expect(dayHeaders[1].textContent).toEqual(dayPickerStrings.shortDays[1]);
@@ -133,7 +133,7 @@ describe('Calendar', () => {
       // When not passed in selected & navigated dates default to current date
       // These dates will be ms different, so just compare their day, month, and year
       // This test will likely fail around midnight.
-      let today = new Date();
+      const today = new Date();
       expect(renderedComponent.state.selectedDate).not.toBeNull();
       expect(renderedComponent.state.selectedDate!.getDate()).toEqual(today.getDate());
       expect(renderedComponent.state.selectedDate!.getMonth()).toEqual(today.getMonth());
@@ -145,7 +145,7 @@ describe('Calendar', () => {
     });
 
     it('Verify go to today', () => {
-      let goToToday = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-goToday');
+      const goToToday = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-goToday');
       expect(goToToday).toBeDefined();
       expect(goToToday.textContent).toEqual(dayPickerStrings.goToToday);
     });
@@ -158,7 +158,7 @@ describe('Calendar', () => {
 
     beforeAll(() => {
       defaultDate = new Date(2017, 2, 16);
-      let onSelectDate = (): (date: Date, dateRangeArray: Date[]) => void => {
+      const onSelectDate = (): (date: Date, dateRangeArray: Date[]) => void => {
         return (date: Date, dateRangeArray: Date[]): void => {
           lastSelectedDateRange = dateRangeArray;
         };
@@ -177,14 +177,14 @@ describe('Calendar', () => {
     });
 
     it('Verify day picker header', () => {
-      let monthName = dayPickerStrings.months[defaultDate.getMonth()];
-      let dayPickerMonth = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-monthAndYear');
+      const monthName = dayPickerStrings.months[defaultDate.getMonth()];
+      const dayPickerMonth = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-monthAndYear');
       expect(dayPickerMonth).toBeDefined();
       expect(dayPickerMonth.textContent).toEqual(monthName + ' ' + defaultDate.getFullYear().toString());
     });
 
     it('Verify first day of week', () => {
-      let dayHeaders = ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedComponent, 'ms-DatePicker-weekday');
+      const dayHeaders = ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedComponent, 'ms-DatePicker-weekday');
       expect(dayHeaders.length).toEqual(7);
       expect(dayHeaders[0].textContent).toEqual(dayPickerStrings.shortDays[2]);
       expect(dayHeaders[1].textContent).toEqual(dayPickerStrings.shortDays[3]);
@@ -201,19 +201,19 @@ describe('Calendar', () => {
     });
 
     it('Verify month picker seen', () => {
-      let monthPicker = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-monthPicker') as HTMLElement;
+      const monthPicker = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-monthPicker') as HTMLElement;
       expect(monthPicker).toBeDefined();
       expect(monthPicker.style.display).not.toEqual('none');
     });
 
     it('Verify month picker header', () => {
-      let currentYear = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-currentYear');
+      const currentYear = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-currentYear');
       expect(currentYear).toBeDefined();
       expect(currentYear.textContent).toEqual(defaultDate.getFullYear().toString());
     });
 
     it('Verify month picker months', () => {
-      let months = ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedComponent, 'ms-DatePicker-monthOption');
+      const months = ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedComponent, 'ms-DatePicker-monthOption');
       expect(months.length).toEqual(12);
       for (let i = 0; i < 12; i++) {
         expect(months[i].textContent).toEqual(dayPickerStrings.shortMonths[i]);
@@ -221,15 +221,15 @@ describe('Calendar', () => {
     });
 
     it('Verify go to today', () => {
-      let goToToday = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-goToday');
+      const goToToday = ReactTestUtils.findRenderedDOMComponentWithClass(renderedComponent, 'ms-DatePicker-goToday');
       expect(goToToday).toBeDefined();
       expect(goToToday.textContent).toEqual(dayPickerStrings.goToToday);
     });
 
     it('Verify navigate to different week in same month', () => {
       lastSelectedDateRange = null;
-      let days = ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedComponent, 'ms-DatePicker-day');
-      let day = days[8]; // 03/08/2017
+      const days = ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedComponent, 'ms-DatePicker-day');
+      const day = days[8]; // 03/08/2017
       ReactTestUtils.Simulate.click(day);
       expect(lastSelectedDateRange).not.toBeNull();
       expect(lastSelectedDateRange!.length).toEqual(7);
@@ -238,9 +238,9 @@ describe('Calendar', () => {
 
     it('Verify navigate to day in different month', () => {
       lastSelectedDateRange = null;
-      let days = ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedComponent, 'ms-DatePicker-day');
-      let day = days[34]; // 04/03/2017
-      let firstDate = new Date(2017, 2, 28);
+      const days = ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedComponent, 'ms-DatePicker-day');
+      const day = days[34]; // 04/03/2017
+      const firstDate = new Date(2017, 2, 28);
       ReactTestUtils.Simulate.click(day);
       expect(lastSelectedDateRange).not.toBeNull();
       expect(lastSelectedDateRange!.length).toEqual(7);
@@ -291,7 +291,7 @@ describe('Calendar', () => {
           onSelectDate={ onSelectDate() }
         />) as Calendar;
 
-      let days = ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedComponent, 'ms-DatePicker-day');
+      const days = ReactTestUtils.scryRenderedDOMComponentsWithClass(renderedComponent, 'ms-DatePicker-day');
       ReactTestUtils.Simulate.click(days[18]);
       expect(lastSelectedDateRange!.length).toEqual(19);
       lastSelectedDateRange!.forEach((val, i) => expect(compareDates(val, addDays(minDate, i))).toEqual(true));
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index 5f0f764c59289..18d47b3612e65 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -15,11 +15,11 @@ const styles: any = stylesImport;
 
 const leftArrow: string = 'Up';
 const rightArrow: string = 'Down';
-let iconStrings: ICalendarIconStrings = {
+const iconStrings: ICalendarIconStrings = {
   leftNavigation: leftArrow,
   rightNavigation: rightArrow
 };
-let defaultWorkWeekDays: DayOfWeek[] = [
+const defaultWorkWeekDays: DayOfWeek[] = [
   DayOfWeek.Monday,
   DayOfWeek.Tuesday,
   DayOfWeek.Wednesday,
@@ -27,7 +27,7 @@ let defaultWorkWeekDays: DayOfWeek[] = [
   DayOfWeek.Friday,
 ];
 
-let dateTimeFormatterCallbacks: ICalendarFormatDateCallbacks = {
+const dateTimeFormatterCallbacks: ICalendarFormatDateCallbacks = {
   formatMonthDayYear: (date: Date, strings: ICalendarStrings) => (strings.months[date.getMonth()] + ' ' + date.getDate() + ', ' + date.getFullYear()),
   formatMonthYear: (date: Date, strings: ICalendarStrings) => (strings.months[date.getMonth()] + ' ' + date.getFullYear()),
   formatDay: (date: Date) => date.getDate().toString(),
@@ -82,7 +82,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
 
   constructor(props: ICalendarProps) {
     super(props);
-    let currentDate = props.value && !isNaN(props.value.getTime()) ? props.value : (props.today || new Date());
+    const currentDate = props.value && !isNaN(props.value.getTime()) ? props.value : (props.today || new Date());
 
     this.state = {
       selectedDate: currentDate,
@@ -97,11 +97,11 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
   }
 
   public componentWillReceiveProps(nextProps: ICalendarProps) {
-    let { autoNavigateOnSelection, value, today = new Date() } = nextProps;
+    const { autoNavigateOnSelection, value, today = new Date() } = nextProps;
 
     // Make sure auto-navigation is supported for programmatic changes to selected date, i.e.,
     // if selected date is updated via props, we may need to modify the navigated date
-    let overrideNavigatedDate = (autoNavigateOnSelection && !compareDates(value!, this.props.value!));
+    const overrideNavigatedDate = (autoNavigateOnSelection && !compareDates(value!, this.props.value!));
     if (overrideNavigatedDate) {
       this.setState({
         navigatedDate: value
@@ -126,12 +126,12 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
   }
 
   public render() {
-    let rootClass = 'ms-DatePicker';
-    let { firstDayOfWeek, dateRangeType, strings, showMonthPickerAsOverlay, autoNavigateOnSelection, showGoToToday, highlightCurrentMonth, navigationIcons, minDate, maxDate } = this.props;
-    let { selectedDate, navigatedDate, isMonthPickerVisible, isDayPickerVisible } = this.state;
-    let onHeaderSelect = showMonthPickerAsOverlay ? this._onHeaderSelect : undefined;
-    let monthPickerOnly = !showMonthPickerAsOverlay && !isDayPickerVisible;
-    let overlayedWithButton = showMonthPickerAsOverlay && showGoToToday;
+    const rootClass = 'ms-DatePicker';
+    const { firstDayOfWeek, dateRangeType, strings, showMonthPickerAsOverlay, autoNavigateOnSelection, showGoToToday, highlightCurrentMonth, navigationIcons, minDate, maxDate } = this.props;
+    const { selectedDate, navigatedDate, isMonthPickerVisible, isDayPickerVisible } = this.state;
+    const onHeaderSelect = showMonthPickerAsOverlay ? this._onHeaderSelect : undefined;
+    const monthPickerOnly = !showMonthPickerAsOverlay && !isDayPickerVisible;
+    const overlayedWithButton = showMonthPickerAsOverlay && showGoToToday;
 
     return (
       <div className={ css(rootClass, styles.root) } ref='root' role='application'>
@@ -234,7 +234,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
 
   @autobind
   private _onSelectDate(date: Date, selectedDateRangeArray?: Date[]) {
-    let { onSelectDate } = this.props;
+    const { onSelectDate } = this.props;
 
     this.setState({
       selectedDate: date
@@ -260,9 +260,9 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
   @autobind
   private _onGotoToday() {
 
-    let { dateRangeType, firstDayOfWeek, today, workWeekDays } = this.props;
+    const { dateRangeType, firstDayOfWeek, today, workWeekDays } = this.props;
 
-    let dates = getDateRangeArray(today!, dateRangeType!, firstDayOfWeek!, workWeekDays!);
+    const dates = getDateRangeArray(today!, dateRangeType!, firstDayOfWeek!, workWeekDays!);
 
     this._onSelectDate(today!, dates);
 
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index 719346d4bc378..5515c6acab311 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -100,14 +100,14 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
   }
 
   public render() {
-    let { activeDescendantId, weeks } = this.state;
-    let { firstDayOfWeek, strings, navigatedDate, selectedDate, dateRangeType, navigationIcons, showWeekNumbers, firstWeekOfYear, dateTimeFormatter, minDate, maxDate } = this.props;
-    let dayPickerId = getId('DatePickerDay-dayPicker');
-    let monthAndYearId = getId('DatePickerDay-monthAndYear');
-    let leftNavigationIcon = navigationIcons.leftNavigation;
-    let rightNavigationIcon = navigationIcons.rightNavigation;
-    let weekNumbers = showWeekNumbers ? getWeekNumbersInMonth(weeks!.length, firstDayOfWeek, firstWeekOfYear, navigatedDate) : null;
-    let selectedDateWeekNumber = showWeekNumbers ? getWeekNumber(selectedDate, firstDayOfWeek, firstWeekOfYear) : undefined;
+    const { activeDescendantId, weeks } = this.state;
+    const { firstDayOfWeek, strings, navigatedDate, selectedDate, dateRangeType, navigationIcons, showWeekNumbers, firstWeekOfYear, dateTimeFormatter, minDate, maxDate } = this.props;
+    const dayPickerId = getId('DatePickerDay-dayPicker');
+    const monthAndYearId = getId('DatePickerDay-monthAndYear');
+    const leftNavigationIcon = navigationIcons.leftNavigation;
+    const rightNavigationIcon = navigationIcons.rightNavigation;
+    const weekNumbers = showWeekNumbers ? getWeekNumbersInMonth(weeks!.length, firstDayOfWeek, firstWeekOfYear, navigatedDate) : null;
+    const selectedDateWeekNumber = showWeekNumbers ? getWeekNumber(selectedDate, firstDayOfWeek, firstWeekOfYear) : undefined;
 
     // When the month is highlighted get the corner dates so that styles can be added to them
     let weekCorners: IWeekCorners = {};
@@ -288,11 +288,11 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
 
   private _findCornerIndexes(week: IDayInfo[]) {
 
-    let cornerIndexes = [];
+    const cornerIndexes = [];
 
     for (let i = 0, length = week.length; i < length; i++) {
 
-      let day = week[i];
+      const day = week[i];
       if (day.isInMonth) {
         cornerIndexes.push(i);
       }
@@ -314,7 +314,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
     leftCornerStyle: string,
     rightCornerStyle: string) {
 
-    let cornersLength = cornerIndexes.length;
+    const cornersLength = cornerIndexes.length;
     if (cornersLength > 0) {
 
       if (cornersLength === 1) {
@@ -337,7 +337,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
       } else {
 
         // Assume we are on the last week. Check if second-to-last week needs corner styles
-        let lastDayIndex = DAYS_IN_WEEK - 1;
+        const lastDayIndex = DAYS_IN_WEEK - 1;
         if (cornerIndexes[cornersLength - 1] !== lastDayIndex) {
           weekCornersStyled[(weekIndex - 1) + '_' + lastDayIndex] = rightCornerStyle;
         }
@@ -347,10 +347,10 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
 
   private _getWeekCornerStyles(weeks: IDayInfo[][]) {
 
-    let weekCornersStyled: any = {};
-    let numberOfWeeks = weeks.length;
-    let indexesFirstWeek = this._findCornerIndexes(weeks[0]);
-    let indexesLastWeek = this._findCornerIndexes(weeks[numberOfWeeks - 1]);
+    const weekCornersStyled: any = {};
+    const numberOfWeeks = weeks.length;
+    const indexesFirstWeek = this._findCornerIndexes(weeks[0]);
+    const indexesLastWeek = this._findCornerIndexes(weeks[numberOfWeeks - 1]);
 
     this._populateCornerStyles(
       weekCornersStyled,
@@ -374,7 +374,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
   }
 
   private _getHighlightedCornerStyle(weekCorners: IWeekCorners, dayIndex: number, weekIndex: number) {
-    let cornerStyle = weekCorners[weekIndex + '_' + dayIndex] ? weekCorners[weekIndex + '_' + dayIndex] : '';
+    const cornerStyle = weekCorners[weekIndex + '_' + dayIndex] ? weekCorners[weekIndex + '_' + dayIndex] : '';
 
     return cornerStyle;
   }
@@ -417,7 +417,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
 
   @autobind
   private _onSelectDate(selectedDate: Date) {
-    let {
+    const {
       onSelectDate,
       dateRangeType,
       firstDayOfWeek,
@@ -439,7 +439,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
 
     // Navigate to next or previous month if needed
     if (autoNavigateOnSelection && selectedDate.getMonth() !== navigatedDate.getMonth()) {
-      let compareResult = compareDatePart(selectedDate, navigatedDate);
+      const compareResult = compareDatePart(selectedDate, navigatedDate);
       if (compareResult < 0) {
         this._onSelectPrevMonth();
       } else if (compareResult > 0) {
@@ -460,7 +460,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
 
   @autobind
   private _onHeaderSelect() {
-    let { onHeaderSelect } = this.props;
+    const { onHeaderSelect } = this.props;
     if (onHeaderSelect) {
       onHeaderSelect(true);
     }
@@ -468,7 +468,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
 
   @autobind
   private _onHeaderKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
-    let { onHeaderSelect } = this.props;
+    const { onHeaderSelect } = this.props;
     if (onHeaderSelect && (ev.which === KeyCodes.enter || ev.which === KeyCodes.space)) {
       onHeaderSelect(true);
     }
@@ -485,7 +485,7 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
   }
 
   private _getWeeks(propsToUse: ICalendarDayProps): IDayInfo[][] {
-    let {
+    const {
       navigatedDate,
       selectedDate,
       dateRangeType,
@@ -496,9 +496,9 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
       showSixWeeksByDefault,
       workWeekDays
     } = propsToUse;
-    let date = new Date(navigatedDate.getFullYear(), navigatedDate.getMonth(), 1);
-    let todaysDate = today || new Date();
-    let weeks: IDayInfo[][] = [];
+    const date = new Date(navigatedDate.getFullYear(), navigatedDate.getMonth(), 1);
+    const todaysDate = today || new Date();
+    const weeks: IDayInfo[][] = [];
 
     // Cycle the date backwards to get to the first day of the week.
     while (date.getDay() !== firstDayOfWeek) {
@@ -516,13 +516,13 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
     let shouldGetWeeks = true;
 
     for (let weekIndex = 0; shouldGetWeeks; weekIndex++) {
-      let week: IDayInfo[] = [];
+      const week: IDayInfo[] = [];
 
       isAllDaysOfWeekOutOfMonth = true;
 
       for (let dayIndex = 0; dayIndex < DAYS_IN_WEEK; dayIndex++) {
-        let originalDate = new Date(date.toString());
-        let dayInfo: IDayInfo = {
+        const originalDate = new Date(date.toString());
+        const dayInfo: IDayInfo = {
           key: date.toString(),
           date: date.getDate().toString(),
           originalDate: originalDate,
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
index 93d5e361d78be..2aad369f0f16f 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
@@ -51,9 +51,9 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
 
   public render() {
 
-    let { navigatedDate, strings, today, highlightCurrentMonth, navigationIcons, dateTimeFormatter, minDate, maxDate } = this.props;
-    let leftNavigationIcon = navigationIcons.leftNavigation;
-    let rightNavigationIcon = navigationIcons.rightNavigation;
+    const { navigatedDate, strings, today, highlightCurrentMonth, navigationIcons, dateTimeFormatter, minDate, maxDate } = this.props;
+    const leftNavigationIcon = navigationIcons.leftNavigation;
+    const rightNavigationIcon = navigationIcons.rightNavigation;
 
     // determine if previous/next years are in bounds
     const isPrevYearInBounds = minDate ? compareDatePart(minDate, getYearStart(navigatedDate)) < 0 : true;
@@ -167,7 +167,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
 
   @autobind
   private _onSelectNextYear() {
-    let { navigatedDate, onNavigateDate } = this.props;
+    const { navigatedDate, onNavigateDate } = this.props;
     onNavigateDate(addYears(navigatedDate, 1), false);
   }
 
@@ -178,7 +178,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
 
   @autobind
   private _onSelectPrevYear() {
-    let { navigatedDate, onNavigateDate } = this.props;
+    const { navigatedDate, onNavigateDate } = this.props;
     onNavigateDate(addYears(navigatedDate, -1), false);
   }
 
@@ -189,7 +189,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
 
   @autobind
   private _onSelectMonth(newMonth: number) {
-    let { navigatedDate, onNavigateDate, onHeaderSelect } = this.props;
+    const { navigatedDate, onNavigateDate, onHeaderSelect } = this.props;
 
     // If header is clickable the calendars are overlayed, switch back to day picker when month is clicked
     if (onHeaderSelect) {
@@ -200,7 +200,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
 
   @autobind
   private _onHeaderSelect() {
-    let { onHeaderSelect } = this.props;
+    const { onHeaderSelect } = this.props;
     if (onHeaderSelect) {
       onHeaderSelect(true);
     }
@@ -208,7 +208,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
 
   @autobind
   private _onHeaderKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
-    let { onHeaderSelect } = this.props;
+    const { onHeaderSelect } = this.props;
     if (onHeaderSelect && (ev.which === KeyCodes.enter || ev.which === KeyCodes.space)) {
       onHeaderSelect(true);
     }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
index 9ea7ba10d71d1..2441e519a53c2 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/examples/Calendar.Inline.Example.tsx
@@ -99,18 +99,18 @@ export class CalendarInlineExample extends React.Component<ICalendarInlineExampl
   }
 
   public render() {
-    let divStyle: React.CSSProperties = {
+    const divStyle: React.CSSProperties = {
       height: '340px'
     };
 
-    let buttonStyle: React.CSSProperties = {
+    const buttonStyle: React.CSSProperties = {
       margin: '17px 10px 0 0'
     };
 
     let dateRangeString: string | null = null;
     if (this.state.selectedDateRange) {
-      let rangeStart = this.state.selectedDateRange[0];
-      let rangeEnd = this.state.selectedDateRange[this.state.selectedDateRange.length - 1];
+      const rangeStart = this.state.selectedDateRange[0];
+      const rangeEnd = this.state.selectedDateRange[this.state.selectedDateRange.length - 1];
       dateRangeString = rangeStart.toLocaleDateString() + '-' + rangeEnd.toLocaleDateString();
     }
 
@@ -166,8 +166,8 @@ export class CalendarInlineExample extends React.Component<ICalendarInlineExampl
 
   private _goPrevious() {
     this.setState((prevState: ICalendarInlineExampleState) => {
-      let selectedDate = prevState.selectedDate || new Date();
-      let dateRangeArray = getDateRangeArray(selectedDate, this.props.dateRangeType, DayOfWeek.Sunday);
+      const selectedDate = prevState.selectedDate || new Date();
+      const dateRangeArray = getDateRangeArray(selectedDate, this.props.dateRangeType, DayOfWeek.Sunday);
 
       let subtractFrom = dateRangeArray[0];
       let daysToSubtract = dateRangeArray.length;
@@ -177,16 +177,16 @@ export class CalendarInlineExample extends React.Component<ICalendarInlineExampl
         daysToSubtract = 1;
       }
 
-      let newSelectedDate = addDays(subtractFrom, -daysToSubtract);
+      const newSelectedDate = addDays(subtractFrom, -daysToSubtract);
       return prevState.selectedDate = newSelectedDate;
     });
   }
 
   private _goNext() {
     this.setState((prevState: ICalendarInlineExampleState) => {
-      let selectedDate = prevState.selectedDate || new Date();
-      let dateRangeArray = getDateRangeArray(selectedDate, this.props.dateRangeType, DayOfWeek.Sunday);
-      let newSelectedDate = addDays(dateRangeArray.pop()!, 1);
+      const selectedDate = prevState.selectedDate || new Date();
+      const dateRangeArray = getDateRangeArray(selectedDate, this.props.dateRangeType, DayOfWeek.Sunday);
+      const newSelectedDate = addDays(dateRangeArray.pop()!, 1);
       return prevState.selectedDate = newSelectedDate;
     });
   }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx b/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
index 623f2f333f7e7..2618dfb79b7fe 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
@@ -28,7 +28,7 @@ describe('Callout', () => {
       <CalloutContentWrapper>Content</CalloutContentWrapper>,
       { createNodeMock }
     );
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
@@ -59,8 +59,8 @@ describe('Callout', () => {
   });
 
   it('target MouseEvents does not throw exception', () => {
-    let mouseEvent = document.createEvent('MouseEvent');
-    let eventTarget = document.createElement('div');
+    const mouseEvent = document.createEvent('MouseEvent');
+    const eventTarget = document.createElement('div');
     mouseEvent.initMouseEvent('click', false, false, window, 0, 0, 0, 0, 0, false, false, false, false, 1, eventTarget);
     let threwException: boolean = false;
     try {
@@ -85,7 +85,7 @@ describe('Callout', () => {
   });
 
   it('target HTMLElements does not throw exception', () => {
-    let targetElement = document.createElement('div');
+    const targetElement = document.createElement('div');
     document.body.appendChild(targetElement);
     let threwException: boolean = false;
     try {
@@ -132,7 +132,7 @@ describe('Callout', () => {
   it('passes event to onDismiss prop', (done) => {
     let threwException: boolean = false;
     let gotEvent: boolean = false;
-    let onDismiss = (ev?: any) => {
+    const onDismiss = (ev?: any) => {
       if (ev) {
         gotEvent = true;
       }
@@ -140,7 +140,7 @@ describe('Callout', () => {
 
     // In order to have eventlisteners that have been added to the window to be called the JSX needs
     // to be rendered into the real dom rather than the testutil simulated dom.
-    let root = document.createElement('div');
+    const root = document.createElement('div');
     document.body.appendChild(root);
     try {
       ReactDOM.render<HTMLDivElement>(
@@ -163,7 +163,7 @@ describe('Callout', () => {
     }
     expect(threwException).toEqual(false);
 
-    let focusTarget = document.querySelector('#focustarget') as HTMLButtonElement;
+    const focusTarget = document.querySelector('#focustarget') as HTMLButtonElement;
 
     // Move focus
     setTimeout(() => {
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.tsx b/packages/office-ui-fabric-react/src/components/Callout/Callout.tsx
index b8c8127d2383d..07bf90be3eb67 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.tsx
@@ -20,7 +20,7 @@ export class Callout extends BaseComponent<ICalloutProps, ICalloutState> {
   }
 
   public render() {
-    let content = (
+    const content = (
       <CalloutContent { ...this.props } />
     );
     return this.props.doNotLayer ? content : (
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
index dc141308bf96d..e9dcc0c3ff02e 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
@@ -95,8 +95,8 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
 
   public componentWillUpdate(newProps: ICalloutProps) {
     // If the target element changed, find the new one. If we are tracking target with class name, always find element because we do not know if fabric has rendered a new element and disposed the old element.
-    let newTarget = this._getTarget(newProps);
-    let oldTarget = this._getTarget();
+    const newTarget = this._getTarget(newProps);
+    const oldTarget = this._getTarget();
     if (newTarget !== oldTarget || typeof (newTarget) === 'string' || newTarget instanceof String) {
       this._maxHeight = undefined;
       this._setTargetWindowAndElement(newTarget!);
@@ -120,13 +120,15 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
       return null;
     }
     let {
+      target
+    } = this.props;
+    const {
       getStyles,
       role,
       ariaLabel,
       ariaDescribedBy,
       ariaLabelledBy,
       className,
-      target,
       isBeakVisible,
       beakStyle,
       children,
@@ -138,13 +140,13 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
       onScroll,
     } = this.props;
     target = this._getTarget();
-    let { positions } = this.state;
+    const { positions } = this.state;
 
-    let getContentMaxHeight: number = this._getMaxHeight() + this.state.heightOffset!;
-    let contentMaxHeight: number = calloutMaxHeight! && (calloutMaxHeight! < getContentMaxHeight) ? calloutMaxHeight! : getContentMaxHeight!;
+    const getContentMaxHeight: number = this._getMaxHeight() + this.state.heightOffset!;
+    const contentMaxHeight: number = calloutMaxHeight! && (calloutMaxHeight! < getContentMaxHeight) ? calloutMaxHeight! : getContentMaxHeight!;
     const overflowYHidden = !!finalHeight;
 
-    let beakVisible = isBeakVisible && (!!target);
+    const beakVisible = isBeakVisible && (!!target);
     this._classNames = getClassNames(
       getStyles!,
       {
@@ -161,7 +163,7 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
     );
 
     const overflowStyle: React.CSSProperties = overflowYHidden ? { overflowY: 'hidden' } : {};
-    let content = (
+    const content = (
       <div
         ref={ this._resolveRef('_hostElement') }
         className={ this._classNames.container }
@@ -203,7 +205,7 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
 
   @autobind
   public dismiss(ev?: Event | React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) {
-    let { onDismiss } = this.props;
+    const { onDismiss } = this.props;
 
     if (onDismiss) {
       onDismiss(ev);
@@ -218,8 +220,8 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
   }
 
   protected _dismissOnLostFocus(ev: Event) {
-    let target = ev.target as HTMLElement;
-    let clickedOutsideCallout = this._hostElement && !elementContains(this._hostElement, target);
+    const target = ev.target as HTMLElement;
+    const clickedOutsideCallout = this._hostElement && !elementContains(this._hostElement, target);
 
     if (
       (!this._target && clickedOutsideCallout) ||
@@ -265,8 +267,8 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
   }
 
   private _getBeakPosition(): React.CSSProperties {
-    let { positions } = this.state;
-    let beakPostionStyle: React.CSSProperties = {
+    const { positions } = this.state;
+    const beakPostionStyle: React.CSSProperties = {
       ...(positions && positions.beakPosition ? positions.beakPosition.elementPosition : null),
     };
 
@@ -279,16 +281,16 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
   }
 
   private _updatePosition() {
-    let { positions } = this.state;
-    let hostElement: HTMLElement = this._hostElement;
-    let calloutElement: HTMLElement = this._calloutElement;
+    const { positions } = this.state;
+    const hostElement: HTMLElement = this._hostElement;
+    const calloutElement: HTMLElement = this._calloutElement;
 
     if (hostElement && calloutElement) {
       let currentProps: IPositionProps | undefined;
       currentProps = assign(currentProps, this.props);
       currentProps!.bounds = this._getBounds();
       currentProps!.target = this._target!;
-      let newPositions: ICalloutPositionedInfo = positionCallout(currentProps!, hostElement, calloutElement);
+      const newPositions: ICalloutPositionedInfo = positionCallout(currentProps!, hostElement, calloutElement);
 
       // Set the new position only when the positions are not exists or one of the new callout positions are different.
       // The position should not change if the position is within 2 decimal places.
@@ -332,8 +334,8 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
   private _getMaxHeight(): number {
     if (!this._maxHeight) {
       if (this.props.directionalHintFixed && this._target) {
-        let beakWidth = this.props.isBeakVisible ? this.props.beakWidth : 0;
-        let gapSpace = this.props.gapSpace ? this.props.gapSpace : 0;
+        const beakWidth = this.props.isBeakVisible ? this.props.beakWidth : 0;
+        const gapSpace = this.props.gapSpace ? this.props.gapSpace : 0;
         // Since the callout cannot measure it's border size it must be taken into account here. Otherwise it will
         // overlap with the target.
         const totalGap = gapSpace + beakWidth! + BORDER_WIDTH * 2;
@@ -372,14 +374,14 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
   private _setTargetWindowAndElement(target: HTMLElement | string | MouseEvent | IPoint | null): void {
     if (target) {
       if (typeof target === 'string') {
-        let currentDoc: Document = getDocument()!;
+        const currentDoc: Document = getDocument()!;
         this._target = currentDoc ? currentDoc.querySelector(target) as HTMLElement : null;
         this._targetWindow = getWindow()!;
       } else if ((target as MouseEvent).stopPropagation) {
         this._targetWindow = getWindow((target as MouseEvent).toElement as HTMLElement)!;
         this._target = target;
       } else if ((target as HTMLElement).getBoundingClientRect) {
-        let targetElement: HTMLElement = target as HTMLElement;
+        const targetElement: HTMLElement = target as HTMLElement;
         this._targetWindow = getWindow(targetElement)!;
         this._target = target;
         // HTMLImgElements can have x and y values. The check for it being a point must go last.
@@ -414,7 +416,7 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
   }
 
   private _getTarget(props: ICalloutProps = this.props): HTMLElement | string | MouseEvent | IPoint | null {
-    let { useTargetPoint, targetPoint, target } = props;
+    const { useTargetPoint, targetPoint, target } = props;
     return useTargetPoint ? targetPoint! : target!;
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
index 876d4ef40a184..1ad35f6e42f52 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutPage.tsx
@@ -21,7 +21,7 @@ const CalloutCoverExampleCode = require('!raw-loader!office-ui-fabric-react/src/
 
 export class CalloutPage extends React.Component<IComponentDemoPageProps, any> {
   public render() {
-    let cmdBarParamsTextAndIcons: any = { items: items, farItems: null };
+    const cmdBarParamsTextAndIcons: any = { items: items, farItems: null };
 
     return (
       <ComponentPage
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Basic.Example.tsx
index adc178391dff5..efc88b828b773 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Basic.Example.tsx
@@ -23,7 +23,7 @@ export class CalloutBasicExample extends React.Component<{}, ICalloutBaiscExampl
   }
 
   public render() {
-    let { isCalloutVisible } = this.state;
+    const { isCalloutVisible } = this.state;
 
     return (
       <div className='ms-CalloutExample'>
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
index a8e1dad35fcf8..7ab156a067e62 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Cover.Example.tsx
@@ -43,7 +43,7 @@ export class CalloutCoverExample extends React.Component<{}, ICalloutCoverExampl
   }
 
   public render() {
-    let { isCalloutVisible, directionalHint } = this.state;
+    const { isCalloutVisible, directionalHint } = this.state;
     // ms-Callout-smallbeak is used in this directional example to reflect all the positions. Large beak will disable some position to avoid beak over the callout edge.
     return (
       <div className='ms-CalloutExample'>
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
index 37d72e82d1413..925e5fd74701d 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
@@ -49,7 +49,7 @@ export class CalloutDirectionalExample extends React.Component<{}, ICalloutDirec
   }
 
   public render() {
-    let { isCalloutVisible, isBeakVisible, directionalHint, gapSpace, beakWidth } = this.state;
+    const { isCalloutVisible, isBeakVisible, directionalHint, gapSpace, beakWidth } = this.state;
     //  ms-Callout-smallbeak is used in this directional example to reflect all the positions. Large beak will disable some position to avoid beak over the callout edge.
     return (
       <div className='ms-CalloutExample'>
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx
index 9ad3df311e054..f314cac7c8e3e 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Nested.Example.tsx
@@ -24,7 +24,7 @@ export class CalloutNestedExample extends React.Component<ICalloutNestedExampleP
   }
 
   public render() {
-    let { isCalloutVisible } = this.state;
+    const { isCalloutVisible } = this.state;
 
     return (
       <div className='ms-CalloutExample'>
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.tsx b/packages/office-ui-fabric-react/src/components/Check/Check.tsx
index 0141ca290999d..0875ec362247a 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.tsx
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.tsx
@@ -34,7 +34,8 @@ export class Check extends BaseComponent<ICheckProps, {}> {
   }
 
   public render() {
-    let { isChecked, checked } = this.props;
+    let { isChecked } = this.props;
+    const { checked } = this.props;
 
     isChecked = isChecked || checked;
 
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.test.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.test.tsx
index 6073672f66c56..a4ad3d37d173d 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.test.tsx
@@ -10,7 +10,7 @@ describe('Checkbox', () => {
         label='Standard checkbox'
         ariaDescribedBy={ 'descriptionID' }
       />);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
index bcf73414b112c..306611a78ffe3 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
@@ -21,7 +21,7 @@ export class CheckboxBasicExample extends React.Component<{}, ICheckboxBasicExam
   }
 
   public render() {
-    let { isChecked } = this.state;
+    const { isChecked } = this.state;
 
     return (
       <div>
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.ImplementationExamples.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.ImplementationExamples.tsx
index 7b853909a62c2..93e339a65b57c 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.ImplementationExamples.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.ImplementationExamples.tsx
@@ -27,9 +27,9 @@ export class CheckboxImplementationExamples extends React.Component<{}, ICheckbo
   }
 
   public render() {
-    let { isChecked } = this.state;
+    const { isChecked } = this.state;
 
-    let styles: ICheckboxStyles = {
+    const styles: ICheckboxStyles = {
       root: {
         marginTop: '10px'
       }
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
index e611afd43b23f..c3c7912172b47 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
@@ -25,7 +25,7 @@ describe('ChoiceGroup', () => {
         required
       />
     );
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
@@ -52,8 +52,8 @@ describe('ChoiceGroup', () => {
     }
     expect(threwException).toEqual(false);
 
-    let renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
-    let choiceOptions = renderedDOM.querySelectorAll(QUERY_SELECTOR);
+    const renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
+    const choiceOptions = renderedDOM.querySelectorAll(QUERY_SELECTOR);
 
     expect((choiceOptions[0] as HTMLInputElement).checked).toEqual(false);
     expect((choiceOptions[1] as HTMLInputElement).checked).toEqual(false);
@@ -101,8 +101,8 @@ describe('ChoiceGroup', () => {
     }
     expect(threwException).toEqual(false);
 
-    let renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
-    let choiceOptions = renderedDOM.querySelectorAll(QUERY_SELECTOR);
+    const renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
+    const choiceOptions = renderedDOM.querySelectorAll(QUERY_SELECTOR);
 
     expect((choiceOptions[0] as HTMLInputElement).disabled).toEqual(true);
     expect((choiceOptions[1] as HTMLInputElement).disabled).toEqual(false);
@@ -133,8 +133,8 @@ describe('ChoiceGroup', () => {
     }
     expect(threwException).toEqual(false);
 
-    let renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
-    let choiceOptions = renderedDOM.querySelectorAll(QUERY_SELECTOR);
+    const renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
+    const choiceOptions = renderedDOM.querySelectorAll(QUERY_SELECTOR);
 
     expect((choiceOptions[0] as HTMLInputElement).disabled).toEqual(true);
     expect((choiceOptions[1] as HTMLInputElement).disabled).toEqual(true);
@@ -142,14 +142,14 @@ describe('ChoiceGroup', () => {
   });
 
   it('can act as an uncontrolled component', () => {
-    let choiceGroup = ReactTestUtils.renderIntoDocument<ChoiceGroup>(
+    const choiceGroup = ReactTestUtils.renderIntoDocument<ChoiceGroup>(
       <ChoiceGroup
         defaultSelectedKey='1'
         options={ TEST_OPTIONS }
       />
     );
-    let renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
-    let choiceOptions = renderedDOM.querySelectorAll(QUERY_SELECTOR);
+    const renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
+    const choiceOptions = renderedDOM.querySelectorAll(QUERY_SELECTOR);
 
     expect((choiceOptions[0] as HTMLInputElement).checked).toEqual(true);
 
@@ -164,15 +164,15 @@ describe('ChoiceGroup', () => {
       _selectedItem = item;
     };
 
-    let choiceGroup = ReactTestUtils.renderIntoDocument<ChoiceGroup>(
+    const choiceGroup = ReactTestUtils.renderIntoDocument<ChoiceGroup>(
       <ChoiceGroup
         selectedKey='1'
         options={ TEST_OPTIONS }
         onChange={ onChange }
       />
     );
-    let renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
-    let choiceOptions = renderedDOM.querySelectorAll(QUERY_SELECTOR);
+    const renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
+    const choiceOptions = renderedDOM.querySelectorAll(QUERY_SELECTOR);
 
     expect((choiceOptions[0] as HTMLInputElement).checked).toEqual(true);
 
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
index fdd6c3975898e..1d1094e1e1b2a 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
@@ -61,8 +61,8 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
   }
 
   public render() {
-    let { label, options, className, required } = this.props;
-    let { keyChecked, keyFocused } = this.state;
+    const { label, options, className, required } = this.props;
+    const { keyChecked, keyFocused } = this.state;
 
     return (
       // Need to assign role application on containing div because JAWS doesn't call OnKeyDown without this role
@@ -77,7 +77,7 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
           ) }
 
           { options!.map((option: IChoiceGroupOption) => {
-            let {
+            const {
               onRenderField = this._onRenderField,
               onRenderLabel = this._onRenderLabel
             } = option;
@@ -152,9 +152,9 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
 
   private _onRenderField(option: IChoiceGroupOption) {
 
-    let { onRenderLabel } = option;
-    let imageSize = option.imageSize ? option.imageSize : { width: 32, height: 32 };
-    let imageIsLarge: boolean = imageSize.width > 71 || imageSize.height > 71;
+    const { onRenderLabel } = option;
+    const imageSize = option.imageSize ? option.imageSize : { width: 32, height: 32 };
+    const imageIsLarge: boolean = imageSize.width > 71 || imageSize.height > 71;
 
     return (
       <label
@@ -237,7 +237,7 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
   }
 
   private _onChange(option: IChoiceGroupOption, evt: React.FormEvent<HTMLInputElement>) {
-    let { onChanged, onChange, selectedKey } = this.props;
+    const { onChanged, onChange, selectedKey } = this.props;
 
     // Only manage state in uncontrolled scenarios.
     if (selectedKey === undefined) {
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Image.Example.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Image.Example.tsx
index d04b50bcee94a..d4920a214f5f9 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Image.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Image.Example.tsx
@@ -21,7 +21,7 @@ export class ChoiceGroupImageExample extends React.Component<{}, IChoiceGroupIma
   }
 
   public render() {
-    let { selectedKey } = this.state;
+    const { selectedKey } = this.state;
 
     return (
       <div>
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.tsx b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.tsx
index fa5b71968633d..1fa1f79354b10 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.tsx
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.tsx
@@ -102,7 +102,7 @@ export class Coachmark extends BaseComponent<ICoachmarkTypes, ICoachmarkState> {
   }
 
   public render(): JSX.Element {
-    let {
+    const {
       children,
       beakWidth,
       beakHeight,
@@ -236,7 +236,7 @@ export class Coachmark extends BaseComponent<ICoachmarkTypes, ICoachmarkState> {
      * An array of cached ids returned when setTimeout runs during
      * the window resize event trigger.
      */
-    let timeoutIds: number[] = [];
+    const timeoutIds: number[] = [];
 
     /**
      * The target element the mouse would be in
@@ -269,9 +269,9 @@ export class Coachmark extends BaseComponent<ICoachmarkTypes, ICoachmarkState> {
     // we want to check if inside of an element and
     // set the state with the result.
     this._events.on(document, 'mousemove', (e: MouseEvent) => {
-      let mouseY = e.pageY;
-      let mouseX = e.pageX;
-      let isMouseInProximity = this._isInsideElement(mouseX, mouseY, targetElementRect, mouseProximityOffset);
+      const mouseY = e.pageY;
+      const mouseX = e.pageX;
+      const isMouseInProximity = this._isInsideElement(mouseX, mouseY, targetElementRect, mouseProximityOffset);
 
       if (isMouseInProximity !== this.state.isMouseInProximity) {
         // We don't want to update the isMouseInProximtiy state because
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.tsx b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.tsx
index 39250cf4088be..802c0e6e6a811 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.tsx
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.tsx
@@ -129,8 +129,8 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
     // If the target element changed, find the new one. If we are tracking
     // target with class name, always find element because we do not know if
     // fabric has rendered a new element and disposed the old element.
-    let newTarget = this._getTarget(newProps);
-    let oldTarget = this._getTarget();
+    const newTarget = this._getTarget(newProps);
+    const oldTarget = this._getTarget();
     if (newTarget !== oldTarget || typeof (newTarget) === 'string' || newTarget instanceof String) {
       this._maxHeight = undefined;
       this._setTargetWindowAndElement(newTarget!);
@@ -151,23 +151,23 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
       return null;
     }
 
-    let {
+    const {
       className,
       positioningContainerWidth,
       positioningContainerMaxHeight,
       children } = this.props;
-    let { positions } = this.state;
+    const { positions } = this.state;
 
     const styles = getClassNames();
 
-    let directionalClassName = (positions && positions.targetEdge)
+    const directionalClassName = (positions && positions.targetEdge)
       ? (AnimationClassNames as any)[SLIDE_ANIMATIONS[positions.targetEdge]]
       : '';
 
-    let getContentMaxHeight: number = this._getMaxHeight() + this.state.heightOffset!;
-    let contentMaxHeight: number = positioningContainerMaxHeight!
+    const getContentMaxHeight: number = this._getMaxHeight() + this.state.heightOffset!;
+    const contentMaxHeight: number = positioningContainerMaxHeight!
       && (positioningContainerMaxHeight! > getContentMaxHeight) ? getContentMaxHeight : positioningContainerMaxHeight!;
-    let content = (
+    const content = (
       <div
         ref={ this._resolveRef('_positionedHost') }
         className={ css('ms-PositioningContainer', styles.container) }
@@ -204,7 +204,7 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
 
   @autobind
   public dismiss(ev?: Event | React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>): void {
-    let { onDismiss } = this.props;
+    const { onDismiss } = this.props;
 
     if (onDismiss) {
       onDismiss(ev);
@@ -219,8 +219,8 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
   }
 
   protected _dismissOnLostFocus(ev: Event): void {
-    let target = ev.target as HTMLElement;
-    let clickedOutsideCallout = this._positionedHost && !elementContains(this._positionedHost, target);
+    const target = ev.target as HTMLElement;
+    const clickedOutsideCallout = this._positionedHost && !elementContains(this._positionedHost, target);
 
     if (
       (!this._target && clickedOutsideCallout) ||
@@ -272,8 +272,8 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
       onPositioned
     } = this.props;
 
-    let hostElement: HTMLElement = this._positionedHost;
-    let positioningContainerElement: HTMLElement = this._contentHost;
+    const hostElement: HTMLElement = this._positionedHost;
+    const positioningContainerElement: HTMLElement = this._contentHost;
 
     if (hostElement && positioningContainerElement) {
       let currentProps: IPositionProps | undefined;
@@ -281,7 +281,7 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
       currentProps!.bounds = this._getBounds();
       currentProps!.target = this._target!;
       currentProps!.gapSpace = offsetFromTarget;
-      let newPositions: IPositionedData = positionElement(currentProps!, hostElement, positioningContainerElement);
+      const newPositions: IPositionedData = positionElement(currentProps!, hostElement, positioningContainerElement);
 
       // Set the new position only when the positions are not exists or one of the new positioningContainer positions are different.
       // The position should not change if the position is within 2 decimal places.
@@ -335,7 +335,7 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
 
     if (!this._maxHeight) {
       if (directionalHintFixed && this._target) {
-        let gapSpace = offsetFromTarget ? offsetFromTarget : 0;
+        const gapSpace = offsetFromTarget ? offsetFromTarget : 0;
         this._maxHeight = getMaxHeight(this._target, directionalHint!, gapSpace, this._getBounds());
       } else {
         this._maxHeight = this._getBounds().height! - BORDER_WIDTH * 2;
@@ -368,7 +368,7 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
   private _setTargetWindowAndElement(target: HTMLElement | string | MouseEvent | IPoint | null): void {
     if (target) {
       if (typeof target === 'string') {
-        let currentDoc: Document = getDocument()!;
+        const currentDoc: Document = getDocument()!;
         this._target = currentDoc ? currentDoc.querySelector(target) as HTMLElement : null;
         this._targetWindow = getWindow()!;
       } else if ((target as MouseEvent).stopPropagation) {
@@ -378,7 +378,7 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
         this._targetWindow = getWindow()!;
         this._target = target;
       } else {
-        let targetElement: HTMLElement = target as HTMLElement;
+        const targetElement: HTMLElement = target as HTMLElement;
         this._targetWindow = getWindow(targetElement)!;
         this._target = target;
       }
@@ -412,7 +412,7 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
   }
 
   private _getTarget(props: IPositioningContainerTypes = this.props): HTMLElement | string | MouseEvent | IPoint | null {
-    let { target } = props;
+    const { target } = props;
     return target!;
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx
index 41977ae170de5..39a7b09e429ef 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/examples/PositioningContainer.Basic.Example.tsx
@@ -20,7 +20,7 @@ export class PositioningContainerBasicExample extends React.Component<{}, IPosit
   }
 
   public render(): JSX.Element {
-    let { isPositioningContainerVisible } = this.state;
+    const { isPositioningContainerVisible } = this.state;
     return (
       <div>
         <div className='ms-PositioningContainerBasicExample-buttonArea'>
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx
index a4d6fe302bf10..13950e6a7d0eb 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx
@@ -45,7 +45,7 @@ export class CoachmarkBasicExample extends BaseComponent<{}, ICoachmarkBasicExam
   }
 
   public render(): JSX.Element {
-    let { isVisible } = this.state;
+    const { isVisible } = this.state;
 
     const calloutProps: ICalloutProps = {
       doNotLayer: true
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.test.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.test.tsx
index 16a320b015aa6..87a2578f4f60a 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.test.tsx
@@ -12,7 +12,7 @@ describe('ColorPicker', () => {
     const component = renderer.create(
       <ColorPicker color='#FFFFFF' />
     );
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
index 1eb8f5ca893a9..f0d3a4b871ee5 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
@@ -56,7 +56,7 @@ export class ColorPicker extends BaseComponent<IColorPickerProps, IColorPickerSt
   }
 
   public render() {
-    let { color } = this.state;
+    const { color } = this.state;
 
     return (
       <div className={ css('ms-ColorPicker', styles.root) }>
@@ -181,7 +181,7 @@ export class ColorPicker extends BaseComponent<IColorPickerProps, IColorPickerSt
       return;
     }
 
-    let { onColorChanged } = this.props;
+    const { onColorChanged } = this.props;
 
     if (newColor.str !== this.state.color.str) {
       this.setState({
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx
index 45f59d66a5580..49b88e4b3d5fa 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx
@@ -43,7 +43,7 @@ export class ColorRectangle extends BaseComponent<IColorRectangleProps, IColorPi
   constructor(props: IColorRectangleProps) {
     super(props);
 
-    let { color } = this.props;
+    const { color } = this.props;
 
     this.state = {
       isAdjusting: false,
@@ -58,7 +58,7 @@ export class ColorRectangle extends BaseComponent<IColorRectangleProps, IColorPi
   }
 
   public componentWillReceiveProps(newProps: IColorRectangleProps) {
-    let { color } = newProps;
+    const { color } = newProps;
 
     this.setState({
       color: color,
@@ -67,8 +67,8 @@ export class ColorRectangle extends BaseComponent<IColorRectangleProps, IColorPi
   }
 
   public render() {
-    let { minSize } = this.props;
-    let { color, fullColorString } = this.state;
+    const { minSize } = this.props;
+    const { color, fullColorString } = this.state;
 
     return (
       <div ref='root' className={ css('ms-ColorPicker-colorRect', styles.colorRect) } style={ { minWidth: minSize, minHeight: minSize, backgroundColor: fullColorString } } onMouseDown={ this._onMouseDown }>
@@ -89,13 +89,13 @@ export class ColorRectangle extends BaseComponent<IColorRectangleProps, IColorPi
 
   @autobind
   private _onMouseMove(ev: React.MouseEvent<HTMLElement>) {
-    let { color, onSVChanged } = this.props;
-    let rectSize = this.refs.root.getBoundingClientRect();
+    const { color, onSVChanged } = this.props;
+    const rectSize = this.refs.root.getBoundingClientRect();
 
-    let sPercentage = (ev.clientX - rectSize.left) / rectSize.width;
-    let vPercentage = (ev.clientY - rectSize.top) / rectSize.height;
+    const sPercentage = (ev.clientX - rectSize.left) / rectSize.width;
+    const vPercentage = (ev.clientY - rectSize.top) / rectSize.height;
 
-    let newColor = assign({}, color, {
+    const newColor = assign({}, color, {
       s: Math.min(MAX_COLOR_SATURATION, Math.max(0, sPercentage * MAX_COLOR_SATURATION)),
       v: Math.min(MAX_COLOR_VALUE, Math.max(0, MAX_COLOR_VALUE - (vPercentage * MAX_COLOR_VALUE))),
     });
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
index 57c4851505053..4f453776680be 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
@@ -42,7 +42,7 @@ export class ColorSlider extends BaseComponent<IColorSliderProps, IColorSliderSt
   constructor(props: IColorSliderProps) {
     super(props);
 
-    let { value } = this.props;
+    const { value } = this.props;
 
     this.state = {
       isAdjusting: false,
@@ -58,10 +58,10 @@ export class ColorSlider extends BaseComponent<IColorSliderProps, IColorSliderSt
   }
 
   public render() {
-    let { className, minValue, maxValue, overlayStyle } = this.props;
-    let { currentValue, isAdjusting } = this.state;
+    const { className, minValue, maxValue, overlayStyle } = this.props;
+    const { currentValue, isAdjusting } = this.state;
 
-    let currentPercentage = 100 * (currentValue! - minValue!) / (maxValue! - minValue!);
+    const currentPercentage = 100 * (currentValue! - minValue!) / (maxValue! - minValue!);
 
     return (
       <div
@@ -90,11 +90,11 @@ export class ColorSlider extends BaseComponent<IColorSliderProps, IColorSliderSt
 
   @autobind
   private _onMouseMove(ev: React.MouseEvent<HTMLElement>) {
-    let { onChanged, minValue, maxValue } = this.props;
-    let rectSize = this.refs.root.getBoundingClientRect();
+    const { onChanged, minValue, maxValue } = this.props;
+    const rectSize = this.refs.root.getBoundingClientRect();
 
-    let currentPercentage = (ev.clientX - rectSize.left) / rectSize.width;
-    let newValue = Math.min(maxValue!, Math.max(minValue!, currentPercentage * maxValue!));
+    const currentPercentage = (ev.clientX - rectSize.left) / rectSize.width;
+    const newValue = Math.min(maxValue!, Math.max(minValue!, currentPercentage * maxValue!));
 
     this.setState({
       isAdjusting: true,
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
index 5b2d2896df638..53caf0245275f 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
@@ -34,7 +34,7 @@ describe('ComboBox', () => {
       <ComboBox options={ DEFAULT_OPTIONS } />,
       { createNodeMock }
     );
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
@@ -45,7 +45,7 @@ describe('ComboBox', () => {
         label='testgroup'
         options={ DEFAULT_OPTIONS }
       />);
-    let comboBoxRoot = wrapper.find('.ms-ComboBox');
+    const comboBoxRoot = wrapper.find('.ms-ComboBox');
 
     expectMissing(wrapper, '.ms-ComboBox.is-disabled');
     expectOne(wrapper, '[data-is-interactable=true]');
@@ -63,7 +63,7 @@ describe('ComboBox', () => {
 
   it('Renders no selected item in default case', () => {
 
-    let wrapper = mount(
+    const wrapper = mount(
       <ComboBox
         label='testgroup'
         options={ DEFAULT_OPTIONS }
@@ -73,27 +73,27 @@ describe('ComboBox', () => {
   });
 
   it('Renders a selected item in uncontrolled case', () => {
-    let wrapper = mount(
+    const wrapper = mount(
       <ComboBox
         label='testgroup'
         defaultSelectedKey='1'
         options={ DEFAULT_OPTIONS }
       />);
-    let comboBoxRoot = wrapper.find('.ms-ComboBox');
-    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = comboBoxRoot.find('input');
+    const comboBoxRoot = wrapper.find('.ms-ComboBox');
+    const inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = comboBoxRoot.find('input');
 
     expect(inputElement.props().value).toEqual('1');
   });
 
   it('Renders a selected item in controlled case', () => {
-    let wrapper = mount(
+    const wrapper = mount(
       <ComboBox
         label='testgroup'
         selectedKey='1'
         options={ DEFAULT_OPTIONS }
       />);
-    let comboBoxRoot = wrapper.find('.ms-ComboBox');
-    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = comboBoxRoot.find('input');
+    const comboBoxRoot = wrapper.find('.ms-ComboBox');
+    const inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = comboBoxRoot.find('input');
 
     expect(inputElement.props().value).toEqual('1');
   });
@@ -109,7 +109,7 @@ describe('ComboBox', () => {
       comboBoxComponent = ref;
     };
 
-    let wrapper = mount(
+    const wrapper = mount(
       <ComboBox
         label='testgroup'
         options={ DEFAULT_OPTIONS }
@@ -132,7 +132,7 @@ describe('ComboBox', () => {
       comboBoxComponent = ref;
     };
 
-    let wrapper = mount(
+    const wrapper = mount(
       <ComboBox
         label='testgroup'
         options={ DEFAULT_OPTIONS }
@@ -143,40 +143,39 @@ describe('ComboBox', () => {
     inputElement = comboBoxRoot.find('input');
     inputElement.simulate('change', { target: { value: 'f' } });
     inputElement.simulate('keydown', { which: KeyCodes.enter });
-    let currentOptions = (comboBoxComponent as React.Component<any, any>).state.currentOptions;
+    const currentOptions = (comboBoxComponent as React.Component<any, any>).state.currentOptions;
     expect(currentOptions.length).toEqual(DEFAULT_OPTIONS.length + 1);
     expect(currentOptions[currentOptions.length - 1].text).toEqual('f');
   });
 
   it('Renders a default value with options', () => {
-    let wrapper = mount(
+    const wrapper = mount(
       <ComboBox
         label='testgroup'
         value='1'
         options={ DEFAULT_OPTIONS }
       />);
-    let comboBoxRoot = wrapper.find('.ms-ComboBox');
-    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = comboBoxRoot.find('input');
+    const comboBoxRoot = wrapper.find('.ms-ComboBox');
+    const inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = comboBoxRoot.find('input');
 
     expect(inputElement.props().value).toEqual('1');
   });
 
   it('Renders a default value with no options', () => {
-    let wrapper = mount(
+    const wrapper = mount(
       <ComboBox
         label='testgroup'
         options={ [] }
         value='1'
       />);
-    let comboBoxRoot = wrapper.find('.ms-ComboBox');
-    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = comboBoxRoot.find('input');
+    const comboBoxRoot = wrapper.find('.ms-ComboBox');
+    const inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = comboBoxRoot.find('input');
 
     expect(inputElement.props().value).toEqual('1');
   });
 
   it('Can change items in uncontrolled case', () => {
-    let comboBoxRoot;
-    let wrapper = mount(
+    const wrapper = mount(
       <ComboBox
         label='testgroup'
         defaultSelectedKey='1'
@@ -184,24 +183,24 @@ describe('ComboBox', () => {
       />);
 
     // Manually assign `offsetParent` and `scrollIntoView` since it doesn't exist without DOM
-    let el = document.createElement('div') as Element;
+    const el = document.createElement('div') as Element;
     el.scrollIntoView = () => null;
     Object.defineProperty(HTMLElement.prototype, 'offsetParent', { get: () => el });
 
-    let buttonElement = wrapper.find('button');
+    const buttonElement = wrapper.find('button');
     buttonElement.simulate('click');
-    let secondItemElement: Element = wrapper.getDOMNode().ownerDocument.querySelector('.ms-ComboBox-option[data-index="1"]')!;
+    const secondItemElement: Element = wrapper.getDOMNode().ownerDocument.querySelector('.ms-ComboBox-option[data-index="1"]')!;
 
     ReactTestUtils.Simulate.click(secondItemElement);
 
     wrapper.update();
 
-    let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = wrapper.find('input');
+    const inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any> = wrapper.find('input');
     expect(inputElement.props().value).toEqual('2');
   });
 
   it('Can insert text in uncontrolled case with autoComplete and allowFreeform on', () => {
-    let wrapper = mount(
+    const wrapper = mount(
       <ComboBox
         label='testgroup'
         defaultSelectedKey='1'
@@ -216,7 +215,7 @@ describe('ComboBox', () => {
   });
 
   it('Can insert text in uncontrolled case with autoComplete on and allowFreeform off', () => {
-    let wrapper = mount(
+    const wrapper = mount(
       <ComboBox
         label='testgroup'
         defaultSelectedKey='1'
@@ -231,7 +230,7 @@ describe('ComboBox', () => {
   });
 
   it('Can insert text in uncontrolled case with autoComplete off and allowFreeform on', () => {
-    let wrapper = mount(
+    const wrapper = mount(
       <ComboBox
         label='testgroup'
         defaultSelectedKey='1'
@@ -245,7 +244,7 @@ describe('ComboBox', () => {
   });
 
   it('Can insert text in uncontrolled case with autoComplete and allowFreeform off', () => {
-    let wrapper = mount(
+    const wrapper = mount(
       <ComboBox
         label='testgroup'
         defaultSelectedKey='1'
@@ -259,7 +258,7 @@ describe('ComboBox', () => {
   });
 
   it('Can change selected option with keyboard', () => {
-    let wrapper = mount(
+    const wrapper = mount(
       <ComboBox
         label='testgroup'
         defaultSelectedKey='1'
@@ -271,7 +270,7 @@ describe('ComboBox', () => {
   });
 
   it('Cannot insert text while disabled', () => {
-    let wrapper = mount(
+    const wrapper = mount(
       <ComboBox
         label='testgroup'
         defaultSelectedKey='1'
@@ -284,7 +283,7 @@ describe('ComboBox', () => {
   });
 
   it('Cannot change selected option with keyboard while disabled', () => {
-    let wrapper = mount(
+    const wrapper = mount(
       <ComboBox
         label='testgroup'
         defaultSelectedKey='1'
@@ -297,7 +296,7 @@ describe('ComboBox', () => {
   });
 
   it('Cannot expand the menu when clicking on the input while disabled', () => {
-    let wrapper = mount(
+    const wrapper = mount(
       <ComboBox
         label='testgroup'
         defaultSelectedKey='1'
@@ -311,7 +310,7 @@ describe('ComboBox', () => {
   it('Cannot expand the menu when clicking on the button while disabled', () => {
     let comboBoxRoot;
     let buttonElement;
-    let wrapper = mount(
+    const wrapper = mount(
       <ComboBox
         label='testgroup'
         defaultSelectedKey='1'
@@ -329,7 +328,7 @@ describe('ComboBox', () => {
     let buttonElement;
     const returnUndefined = jest.fn();
 
-    let wrapper = mount(
+    const wrapper = mount(
       <ComboBox
         label='testgroup'
         defaultSelectedKey='1'
@@ -346,11 +345,11 @@ describe('ComboBox', () => {
     let updatedOption;
     let updatedIndex;
     let executionCount = 0;
-    let initialOption = { key: '1', text: 'Text' };
+    const initialOption = { key: '1', text: 'Text' };
 
     let comboBoxRoot;
     let inputElement: ReactWrapper<React.InputHTMLAttributes<any>, any>;
-    let wrapper = mount(
+    const wrapper = mount(
       <ComboBox
         label='testgroup'
         options={ [initialOption] }
@@ -387,7 +386,7 @@ describe('ComboBox', () => {
     );
 
     setTimeout(() => {
-      let callout = document.querySelector('.ms-Callout') as HTMLElement;
+      const callout = document.querySelector('.ms-Callout') as HTMLElement;
       expect(callout).toBeDefined();
       expect(callout.classList.contains('ms-ComboBox-callout')).toBeTruthy();
       expect(callout.classList.contains('foo')).toBeTruthy();
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index efc9e2c5a11c4..fb211aefa3c85 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -152,10 +152,10 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
     this._id = props.id || getId('ComboBox');
 
-    let selectedKey = props.defaultSelectedKey !== undefined ? props.defaultSelectedKey : props.selectedKey;
+    const selectedKey = props.defaultSelectedKey !== undefined ? props.defaultSelectedKey : props.selectedKey;
     this._isScrollIdle = true;
 
-    let index: number = this._getSelectedIndex(props.options, selectedKey);
+    const index: number = this._getSelectedIndex(props.options, selectedKey);
 
     this.state = {
       isOpen: false,
@@ -181,7 +181,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       newProps.value !== this.props.value ||
       newProps.options !== this.props.options) {
 
-      let index: number = this._getSelectedIndex(newProps.options, newProps.selectedKey);
+      const index: number = this._getSelectedIndex(newProps.options, newProps.selectedKey);
 
       this.setState({
         selectedIndex: index,
@@ -191,13 +191,13 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   }
 
   public componentDidUpdate(prevProps: IComboBoxProps, prevState: IComboBoxState) {
-    let {
+    const {
       allowFreeform,
       value,
       onMenuOpen,
       onMenuDismissed
     } = this.props;
-    let {
+    const {
       isOpen,
       focused,
       selectedIndex,
@@ -257,8 +257,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
   // Primary Render
   public render() {
-    let id = this._id;
-    let {
+    const id = this._id;
+    const {
       className,
       label,
       disabled,
@@ -277,12 +277,12 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       theme,
       title
     } = this.props;
-    let { isOpen, selectedIndex, focused, suggestedDisplayValue } = this.state;
+    const { isOpen, selectedIndex, focused, suggestedDisplayValue } = this.state;
     this._currentVisibleValue = this._getVisibleValue();
 
-    let divProps = getNativeProps(this.props, divProperties);
+    const divProps = getNativeProps(this.props, divProperties);
 
-    let hasErrorMessage = (errorMessage && errorMessage.length > 0) ? true : false;
+    const hasErrorMessage = (errorMessage && errorMessage.length > 0) ? true : false;
 
     this._classNames = this.props.getClassNames ?
       this.props.getClassNames(
@@ -400,7 +400,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    */
   @autobind
   public dismissMenu(): void {
-    let { isOpen } = this.state;
+    const { isOpen } = this.state;
     isOpen && this.setState({ isOpen: false });
   }
 
@@ -444,12 +444,12 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    */
   @autobind
   private _getVisibleValue(): string | undefined {
-    let {
+    const {
       value,
       allowFreeform,
       autoComplete
     } = this.props;
-    let {
+    const {
       selectedIndex,
       currentPendingValueValidIndex,
       currentOptions,
@@ -458,7 +458,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       isOpen
     } = this.state;
 
-    let currentPendingIndexValid = this._indexWithinBounds(currentOptions, currentPendingValueValidIndex);
+    const currentPendingIndexValid = this._indexWithinBounds(currentOptions, currentPendingValueValidIndex);
 
     // If the user passed is a value prop, use that
     // unless we are open and have a valid current pending index
@@ -538,7 +538,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * @param updatedValue - the input's newly changed value
    */
   private _processInputChangeWithFreeform(updatedValue: string) {
-    let {
+    const {
       currentOptions
     } = this.state;
 
@@ -549,7 +549,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
     // Remember the original value and then,
     // make the value lowercase for comparison
-    let originalUpdatedValue: string = updatedValue;
+    const originalUpdatedValue: string = updatedValue;
     updatedValue = updatedValue.toLocaleLowerCase();
 
     let newSuggestedDisplayValue = '';
@@ -559,7 +559,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     if (this.props.autoComplete === 'on') {
 
       // If autoComplete is on, attempt to find a match where the text of an option starts with the updated value
-      let items = currentOptions.map((item, index) => { return { ...item, index }; }).filter((option) => option.itemType !== SelectableOptionMenuItemType.Header && option.itemType !== SelectableOptionMenuItemType.Divider).filter((option) => option.text.toLocaleLowerCase().indexOf(updatedValue) === 0);
+      const items = currentOptions.map((item, index) => { return { ...item, index }; }).filter((option) => option.itemType !== SelectableOptionMenuItemType.Header && option.itemType !== SelectableOptionMenuItemType.Divider).filter((option) => option.text.toLocaleLowerCase().indexOf(updatedValue) === 0);
       if (items.length > 0) {
         // If the user typed out the complete option text, we don't need any suggested display text anymore
         newSuggestedDisplayValue = items[0].text.toLocaleLowerCase() !== updatedValue ? items[0].text : '';
@@ -570,7 +570,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     } else {
 
       // If autoComplete is off, attempt to find a match only when the value is exactly equal to the text of an option
-      let items = currentOptions.map((item, index) => { return { ...item, index }; }).filter((option) => option.itemType !== SelectableOptionMenuItemType.Header && option.itemType !== SelectableOptionMenuItemType.Divider).filter((option) => option.text.toLocaleLowerCase() === updatedValue);
+      const items = currentOptions.map((item, index) => { return { ...item, index }; }).filter((option) => option.itemType !== SelectableOptionMenuItemType.Header && option.itemType !== SelectableOptionMenuItemType.Divider).filter((option) => option.text.toLocaleLowerCase() === updatedValue);
 
       // if we fould a match remember the index
       if (items.length === 1) {
@@ -588,7 +588,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * @param updatedValue - the input's newly changed value
    */
   private _processInputChangeWithoutFreeform(updatedValue: string) {
-    let {
+    const {
       currentPendingValue,
       currentPendingValueValidIndex,
       currentOptions,
@@ -614,11 +614,11 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
           updatedValue = currentPendingValue + updatedValue;
         }
 
-        let originalUpdatedValue: string = updatedValue;
+        const originalUpdatedValue: string = updatedValue;
         updatedValue = updatedValue.toLocaleLowerCase();
 
         // If autoComplete is on, attempt to find a match where the text of an option starts with the updated value
-        let items = currentOptions.map((item, i) => { return { ...item, index: i }; }).filter((option) => option.itemType !== SelectableOptionMenuItemType.Header && option.itemType !== SelectableOptionMenuItemType.Divider).filter((option) => option.text.toLocaleLowerCase().indexOf(updatedValue) === 0);
+        const items = currentOptions.map((item, i) => { return { ...item, index: i }; }).filter((option) => option.itemType !== SelectableOptionMenuItemType.Header && option.itemType !== SelectableOptionMenuItemType.Divider).filter((option) => option.text.toLocaleLowerCase().indexOf(updatedValue) === 0);
 
         // If we found a match, udpdate the state
         if (items.length > 0) {
@@ -638,7 +638,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     // If we get here, either autoComplete is on or we did not find a match with autoComplete on.
     // Remember we are not allowing freeform, so at this point, if we have a pending valid value index
     // use that; otherwise use the selectedIndex
-    let index = currentPendingValueValidIndex >= 0 ? currentPendingValueValidIndex : selectedIndex;
+    const index = currentPendingValueValidIndex >= 0 ? currentPendingValueValidIndex : selectedIndex;
 
     // Since we are not allowing freeform, we need to
     // set both the pending and suggested values/index
@@ -656,7 +656,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * it will snap to the edge of the options array. If delta == 0 and the given index is not selectable
    */
   private _getNextSelectableIndex(index: number, searchDirection: SearchDirection): number {
-    let { currentOptions } = this.state;
+    const { currentOptions } = this.state;
 
     let newIndex = index + searchDirection;
 
@@ -666,7 +666,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       return -1;
     }
 
-    let option: IComboBoxOption = currentOptions[newIndex];
+    const option: IComboBoxOption = currentOptions[newIndex];
 
     // attempt to skip headers and dividers
     if ((option.itemType === SelectableOptionMenuItemType.Header ||
@@ -694,8 +694,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * @param searchDirection - the direction to search along the options from the given index
    */
   private _setSelectedIndex(index: number, searchDirection: SearchDirection = SearchDirection.none) {
-    let { onChanged } = this.props;
-    let { selectedIndex, currentOptions } = this.state;
+    const { onChanged } = this.props;
+    const { selectedIndex, currentOptions } = this.state;
 
     // Find the next selectable index, if searchDirection is none
     // we will get our starting index back
@@ -708,7 +708,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     // Are we at a new index? If so, update the state, otherwise
     // there is nothing to do
     if (index !== selectedIndex) {
-      let option: IComboBoxOption = currentOptions[index];
+      const option: IComboBoxOption = currentOptions[index];
 
       // Set the selected option
       this.setState({
@@ -749,7 +749,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     if (this.props.onResolveOptions) {
 
       // get the options
-      let newOptions = this.props.onResolveOptions({ ...this.state.currentOptions });
+      const newOptions = this.props.onResolveOptions({ ...this.state.currentOptions });
 
       // Check to see if the returned value is an array, if it is update the state
       // If the returned value is not an array then check to see if it's a promise or PromiseLike. If it is then resolve it asynchronously.
@@ -761,7 +761,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
         // Ensure that the promise will only use the callback if it was the most recent one
         // and update the state when the promise returns
-        let promise: PromiseLike<IComboBoxOption[]> = this._currentPromise = newOptions;
+        const promise: PromiseLike<IComboBoxOption[]> = this._currentPromise = newOptions;
         promise.then((newOptionsFromPromise: IComboBoxOption[]) => {
           if (promise === this._currentPromise) {
             this.setState({
@@ -801,12 +801,12 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * Submit a pending value if there is one
    */
   private _submitPendingValue() {
-    let {
+    const {
       onChanged,
       allowFreeform,
       autoComplete
     } = this.props;
-    let {
+    const {
       currentPendingValue,
       currentPendingValueValidIndex,
       currentOptions,
@@ -819,7 +819,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
       // Check to see if the user typed an exact match
       if (this._indexWithinBounds(currentOptions, currentPendingValueValidIndex)) {
-        let pendingOptionText: string = currentOptions[currentPendingValueValidIndex].text.toLocaleLowerCase();
+        const pendingOptionText: string = currentOptions[currentPendingValueValidIndex].text.toLocaleLowerCase();
 
         // By exact match, that means: our pending value is the same as the the pending option text OR
         // the pending option starts with the pending value and we have an "autoComplete" selection
@@ -841,8 +841,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         onChanged(undefined, undefined, currentPendingValue);
       } else {
         // If we are not controlled, create a new option
-        let newOption: IComboBoxOption = { key: currentPendingValue, text: currentPendingValue };
-        let newOptions: IComboBoxOption[] = [...currentOptions, newOption];
+        const newOption: IComboBoxOption = { key: currentPendingValue, text: currentPendingValue };
+        const newOptions: IComboBoxOption[] = [...currentOptions, newOption];
 
         this.setState({
           currentOptions: newOptions,
@@ -865,7 +865,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   // Render Callout container and pass in list
   @autobind
   private _onRenderContainer(props: IComboBoxProps): JSX.Element {
-    let {
+    const {
       onRenderList,
       calloutProps,
       dropdownWidth,
@@ -902,12 +902,12 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   // Render List of items
   @autobind
   private _onRenderList(props: IComboBoxProps): JSX.Element {
-    let {
+    const {
       onRenderItem,
       options
     } = props;
 
-    let id = this._id;
+    const id = this._id;
     return (
       <div
         id={ id + '-list' }
@@ -941,7 +941,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
   // Render separator
   private _renderSeparator(item: IComboBoxOption): JSX.Element | null {
-    let { index, key } = item;
+    const { index, key } = item;
 
     if (index && index > 0) {
       return (
@@ -956,7 +956,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   }
 
   private _renderHeader(item: IComboBoxOption): JSX.Element {
-    let { onRenderOption = this._onRenderOption } = this.props;
+    const { onRenderOption = this._onRenderOption } = this.props;
 
     return (
       <div key={ item.key } className={ this._classNames.header } role='heading'>
@@ -967,9 +967,9 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   // Render menu item
   @autobind
   private _renderOption(item: IComboBoxOption): JSX.Element {
-    let { onRenderOption = this._onRenderOption } = this.props;
-    let id = this._id;
-    let isSelected: boolean = this._isOptionSelected(item.index);
+    const { onRenderOption = this._onRenderOption } = this.props;
+    const id = this._id;
+    const isSelected: boolean = this._isOptionSelected(item.index);
     const rootClassNames = getComboBoxOptionClassNames(this._getCurrentOptionStyles(item)).root;
 
     return (
@@ -1009,7 +1009,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * otherwise use the selected index
    * */
   private _isOptionSelected(index: number | undefined): boolean {
-    let {
+    const {
       currentPendingValueValidIndexOnHover
     } = this.state;
 
@@ -1028,7 +1028,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * finding the index
    */
   private _getPendingSelectedIndex(includeCurrentPendingValue: boolean): number {
-    let {
+    const {
       currentPendingValueValidIndexOnHover,
       currentPendingValueValidIndex,
       currentPendingValue,
@@ -1064,12 +1064,12 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * Scroll the selected element into view
    */
   private _scrollIntoView() {
-    let {
+    const {
       onScrollToItem,
       scrollSelectedToTop
     } = this.props;
 
-    let {
+    const {
       currentPendingValueValidIndex,
       currentPendingValue,
       selectedIndex
@@ -1086,8 +1086,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         let alignToTop = true;
 
         if (this._comboBoxMenu.offsetParent) {
-          let scrollableParentRect = this._comboBoxMenu.offsetParent.getBoundingClientRect();
-          let selectedElementRect = this._selectedElement.offsetParent.getBoundingClientRect();
+          const scrollableParentRect = this._comboBoxMenu.offsetParent.getBoundingClientRect();
+          const selectedElementRect = this._selectedElement.offsetParent.getBoundingClientRect();
 
           // If we are completely in view then we do not need to scroll
           if (scrollableParentRect.top <= selectedElementRect.top &&
@@ -1166,7 +1166,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * selected state text
    */
   private _resetSelectedIndex() {
-    let {
+    const {
       selectedIndex,
       currentOptions
     } = this.state;
@@ -1212,12 +1212,12 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * @param index - the index to set the pending info from
    */
   private _setPendingInfoFromIndex(index: number) {
-    let {
+    const {
       currentOptions
     } = this.state;
 
     if (index >= 0 && index < currentOptions.length) {
-      let option = currentOptions[index];
+      const option = currentOptions[index];
       this._setPendingInfo(option.text, index, option.text);
     } else {
       this._clearPendingInfo();
@@ -1231,7 +1231,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * @param searchDirection - the direction to search
    */
   private _setPendingInfoFromIndexAndDirection(index: number, searchDirection: SearchDirection) {
-    let {
+    const {
       isOpen,
       selectedIndex,
       currentOptions
@@ -1259,12 +1259,12 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    */
   @autobind
   private _onInputKeyDown(ev: React.KeyboardEvent<HTMLElement | Autofill>) {
-    let {
+    const {
       disabled,
       allowFreeform,
       autoComplete
     } = this.props;
-    let {
+    const {
       isOpen,
       currentPendingValueValidIndex,
       currentOptions,
@@ -1422,7 +1422,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    */
   @autobind
   private _onInputKeyUp(ev: React.KeyboardEvent<HTMLElement | Autofill>) {
-    let {
+    const {
       disabled,
       allowFreeform,
       autoComplete
@@ -1439,7 +1439,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         // make space expand/collapse the comboBox
         // and allow the event to propagate
         if (!allowFreeform && autoComplete === 'off') {
-          let isOpen = this.state.isOpen;
+          const isOpen = this.state.isOpen;
           this._setOpenStateAndFocusOnClose(!isOpen, !!isOpen);
           return;
         }
@@ -1515,8 +1515,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    */
   @autobind
   private _onComboBoxClick() {
-    let { disabled } = this.props;
-    let { isOpen } = this.state;
+    const { disabled } = this.props;
+    const { isOpen } = this.state;
 
     if (!disabled) {
       this._setOpenStateAndFocusOnClose(!isOpen, false /* focusInputAfterClose */);
@@ -1573,7 +1573,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   * dynamically populate input, and 'none' if auto-complete is not enabled as we can't give user inputs.
   */
   private _getAriaAutoCompleteValue(): string {
-    let autoComplete = !this.props.disabled && this.props.autoComplete === 'on';
+    const autoComplete = !this.props.disabled && this.props.autoComplete === 'on';
     return autoComplete ? (this.props.allowFreeform ? 'inline' : 'both') : 'none';
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
index b60a6d25d7c0c..ea1c7d5a71fb2 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
@@ -62,7 +62,7 @@ export class ComboBoxBasicExample extends React.Component<{}, {
   }
 
   public render() {
-    let { options, selectedOptionKey, value } = this.state;
+    const { options, selectedOptionKey, value } = this.state;
 
     return (
       <div className='ms-ComboBoxBasicExample'>
@@ -264,7 +264,7 @@ export class ComboBoxBasicExample extends React.Component<{}, {
       return this.state.options;
     }
 
-    let newOptions =
+    const newOptions =
       [
         { key: 'Header', text: 'Theme Fonts', itemType: SelectableOptionMenuItemType.Header },
         { key: 'A', text: 'Arial Black', fontFamily: '"Arial Black", "Arial Black_MSFontService", sans-serif' },
@@ -303,7 +303,7 @@ export class ComboBoxBasicExample extends React.Component<{}, {
         value: undefined
       });
     } else if (value !== undefined) {
-      let newOption: IComboBoxOption = { key: value, text: value };
+      const newOption: IComboBoxOption = { key: value, text: value };
 
       this.setState({
         options: [...this.state.options, newOption],
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
index 91e3bc93eb15a..2783c1710eaed 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.test.tsx
@@ -39,7 +39,7 @@ describe('CommandBar', () => {
     const component = renderer.create(
       <CommandBar items={ items } />
     );
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
@@ -102,14 +102,14 @@ describe('CommandBar', () => {
       },
     ];
 
-    let renderedContent = ReactTestUtils.renderIntoDocument<CommandBar>(
+    const renderedContent = ReactTestUtils.renderIntoDocument<CommandBar>(
       <CommandBar
         items={ items }
       />
     ) as React.Component<CommandBar, {}>;
     document.body.appendChild(ReactDOM.findDOMNode(renderedContent));
 
-    let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
+    const menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
     ReactTestUtils.Simulate.click(menuItem);
 
     expect(document.querySelector('.SubMenuClass')).toBeDefined();
@@ -132,25 +132,25 @@ describe('CommandBar', () => {
       },
     ];
 
-    let renderedContent = ReactTestUtils.renderIntoDocument<CommandBar>(
+    const renderedContent = ReactTestUtils.renderIntoDocument<CommandBar>(
       <CommandBar
         items={ items }
       />
     ) as React.Component<CommandBar, {}>;
     document.body.appendChild(ReactDOM.findDOMNode(renderedContent));
 
-    let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
+    const menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
     ReactTestUtils.Simulate.click(menuItem);
 
     expect(document.querySelector('.SubMenuClass')).toBeDefined();
   });
 
   it('keeps menu open after update if item is still present', () => {
-    let renderContainer = document.createElement('div');
+    const renderContainer = document.createElement('div');
     document.body.appendChild(renderContainer);
 
     try {
-      let items: IContextualMenuItem[] = [
+      const items: IContextualMenuItem[] = [
         {
           name: 'TestText 1',
           key: 'TestKey1',
@@ -173,7 +173,7 @@ describe('CommandBar', () => {
         renderContainer
       ) as React.Component<CommandBar, {}>;
 
-      let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
+      const menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
       ReactTestUtils.Simulate.click(menuItem);
 
       // Make sure the menu is open before the re-render
@@ -201,7 +201,7 @@ describe('CommandBar', () => {
   });
 
   it('closes menu after update if item is not longer present', () => {
-    let renderContainer = document.createElement('div');
+    const renderContainer = document.createElement('div');
     document.body.appendChild(renderContainer);
 
     try {
@@ -228,7 +228,7 @@ describe('CommandBar', () => {
         renderContainer
       ) as React.Component<CommandBar, {}>;
 
-      let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
+      const menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
       ReactTestUtils.Simulate.click(menuItem);
 
       // Make sure the menu is open before the re-render
@@ -256,11 +256,11 @@ describe('CommandBar', () => {
   });
 
   it('updates menu after update if item is still present', () => {
-    let renderContainer = document.createElement('div');
+    const renderContainer = document.createElement('div');
     document.body.appendChild(renderContainer);
 
     try {
-      let items: IContextualMenuItem[] = [
+      const items: IContextualMenuItem[] = [
         {
           name: 'TestText 1',
           key: 'TestKey1',
@@ -283,7 +283,7 @@ describe('CommandBar', () => {
         renderContainer
       ) as React.Component<CommandBar, {}>;
 
-      let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
+      const menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
       ReactTestUtils.Simulate.click(menuItem);
 
       // Make sure the menu is open before the re-render
@@ -319,12 +319,12 @@ describe('CommandBar', () => {
       },
     ];
 
-    let renderedContent = ReactTestUtils.renderIntoDocument<CommandBar>(
+    const renderedContent = ReactTestUtils.renderIntoDocument<CommandBar>(
       <CommandBar
         items={ menuWithNoSubmenu }
       />
     ) as React.Component<CommandBar, {}>;
-    let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
+    const menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
 
     expect(menuItem.querySelector('.ms-CommandBarItem-chevronDown')).not.toEqual(null);
   });
@@ -347,13 +347,13 @@ describe('CommandBar', () => {
       }
     ];
 
-    let renderedContent = ReactTestUtils.renderIntoDocument<CommandBar>(
+    const renderedContent = ReactTestUtils.renderIntoDocument<CommandBar>(
       <CommandBar
         items={ menuWithEmptySubMenu }
       />
     ) as React.Component<CommandBar, {}>;
 
-    let menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
+    const menuItem = (ReactDOM.findDOMNode(renderedContent) as HTMLElement).querySelector('button') as HTMLButtonElement;
 
     ReactTestUtils.Simulate.click(menuItem);
 
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 380c19195a352..537a81c7fdb40 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -184,7 +184,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
       !item.name && ('ms-CommandBarItem--noName ' + styles.itemLinkIsNoName),
       (expandedMenuItemKey === item.key) && ('is-expanded ' + styles.itemLinkIsExpanded)
     );
-    let hasIcon = !!item.icon || !!item.iconProps;
+    const hasIcon = !!item.icon || !!item.iconProps;
     const isNameVisible = !!item.name && !item.iconOnly;
     const ariaLabel = item.ariaLabel || (item.iconOnly ? item.name : undefined);
 
@@ -286,12 +286,12 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
 
   private _renderIcon(item: IContextualMenuItem) {
     // Only present to allow continued use of item.icon which is deprecated.
-    let iconProps: IIconProps = item.iconProps ? item.iconProps : {
+    const iconProps: IIconProps = item.iconProps ? item.iconProps : {
       iconName: item.icon
     };
     // Use the default icon color for the known icon names
-    let iconColorClassName = iconProps.iconName === 'None' ? '' : ('ms-CommandBarItem-iconColor ' + styles.itemIconColor);
-    let iconClassName = css('ms-CommandBarItem-icon', styles.itemIcon, iconColorClassName, iconProps.className);
+    const iconColorClassName = iconProps.iconName === 'None' ? '' : ('ms-CommandBarItem-iconColor ' + styles.itemIconColor);
+    const iconClassName = css('ms-CommandBarItem-icon', styles.itemIcon, iconColorClassName, iconProps.className);
 
     return <Icon { ...iconProps } className={ iconClassName } />;
   }
@@ -316,10 +316,10 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
     }
 
     for (let i = 0; i < this.props.items.length; i++) {
-      let item = this.props.items[i];
+      const item = this.props.items[i];
 
       if (!this._commandItemWidths[item.key]) {
-        let el = this.refs[item.key] as HTMLElement;
+        const el = this.refs[item.key] as HTMLElement;
 
         if (el) {
           this._commandItemWidths[item.key] = el.getBoundingClientRect().width;
@@ -329,17 +329,17 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
   }
 
   private _updateRenderedItems() {
-    let { items, overflowItems } = this.props;
-    let commandSurface = this.refs.commandSurface;
-    let farCommandSurface = this.refs.farCommandSurface;
-    let commandBarRegion = this.refs.commandBarRegion;
-    let searchSurface = this.refs.searchSurface;
-    let renderedItems = [...items];
+    const { items, overflowItems } = this.props;
+    const commandSurface = this.refs.commandSurface;
+    const farCommandSurface = this.refs.farCommandSurface;
+    const commandBarRegion = this.refs.commandBarRegion;
+    const searchSurface = this.refs.searchSurface;
+    const renderedItems = [...items];
     let renderedOverflowItems = overflowItems;
     let consumedWidth = 0;
-    let isOverflowVisible = overflowItems && overflowItems.length;
+    const isOverflowVisible = overflowItems && overflowItems.length;
 
-    let style = window.getComputedStyle(commandSurface);
+    const style = window.getComputedStyle(commandSurface);
     let availableWidth = commandBarRegion.clientWidth - parseInt(style.marginLeft!, 10) - parseInt(style.marginRight!, 10);
     if (searchSurface) {
       availableWidth -= searchSurface.getBoundingClientRect().width;
@@ -353,8 +353,8 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
     }
 
     for (let i = 0; i < renderedItems.length; i++) {
-      let item = renderedItems[i];
-      let itemWidth = this._commandItemWidths![item.key];
+      const item = renderedItems[i];
+      const itemWidth = this._commandItemWidths![item.key];
 
       if ((consumedWidth + itemWidth) >= availableWidth) {
         if (i > 0 && !isOverflowVisible && (availableWidth - consumedWidth) < OVERFLOW_WIDTH) {
@@ -369,7 +369,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
 
     }
 
-    let renderedContextualMenuProps = this._getContextualMenuPropsAfterUpdate(
+    const renderedContextualMenuProps = this._getContextualMenuPropsAfterUpdate(
       renderedItems.concat(this.state.renderedFarItems!),
       renderedOverflowItems!);
 
@@ -417,7 +417,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
   @autobind
   private _onContextMenuDismiss(ev?: any) {
     if (!ev || !ev.relatedTarget || !this.refs.commandSurface.contains(ev.relatedTarget as HTMLElement)) {
-      let { contextualMenuProps } = this.state;
+      const { contextualMenuProps } = this.state;
 
       if (contextualMenuProps && contextualMenuProps.onDismiss) {
         this.state.contextualMenuProps!.onDismiss!(ev);
@@ -451,7 +451,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
         return { items: overflowItems };
       } else {
         // Find the currently open key in the new props
-        let matchingItem = renderedItems.filter(item => item.key === this.state.expandedMenuItemKey);
+        const matchingItem = renderedItems.filter(item => item.key === this.state.expandedMenuItemKey);
 
         if (matchingItem.length === 1) {
           return this._getContextualMenuPropsFromItem(matchingItem[0]);
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx
index 25ad0b83dbc07..c61b34d578c66 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBarPage.tsx
@@ -18,7 +18,7 @@ const CommandBarCustomizationExampleCode = require('!raw-loader!office-ui-fabric
 
 export class CommandBarPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
-    let cmdBarParamsTextAndIcons: any = { items, overflowItems, farItems };
+    const cmdBarParamsTextAndIcons: any = { items, overflowItems, farItems };
 
     return (
       <ComponentPage
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
index dc109995ec9b4..85e85d209c54a 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Basic.Example.tsx
@@ -16,27 +16,27 @@ export class CommandBarBasicExample extends React.Component<any, any> {
   }
 
   public render() {
-    let { items, overflowItems, farItems } = this.props;
-    let {
+    const { items, overflowItems, farItems } = this.props;
+    const {
       isSearchBoxVisible: searchBoxVisible,
       areIconsVisible: iconsVisible,
       areNamesVisible: namesVisible,
       areItemsEnabled: itemsEnabled
     } = this.state;
 
-    let filteredItems = items.map((item: any) => assign({}, item, {
+    const filteredItems = items.map((item: any) => assign({}, item, {
       iconOnly: !namesVisible,
       icon: iconsVisible ? item.icon : '',
       disabled: !itemsEnabled
     }));
 
-    let filteredOverflowItems = overflowItems.map((item: any) => assign({}, item, {
+    const filteredOverflowItems = overflowItems.map((item: any) => assign({}, item, {
       iconOnly: !namesVisible,
       icon: iconsVisible ? item.icon : '',
       disabled: !itemsEnabled
     }));
 
-    let filteredFarItems = farItems.map((item: any) => assign({}, item, {
+    const filteredFarItems = farItems.map((item: any) => assign({}, item, {
       iconOnly: !namesVisible,
       icon: iconsVisible ? item.icon : '',
       disabled: !itemsEnabled
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
index ef28110f38991..e5ef9fbfd6e37 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
@@ -55,13 +55,13 @@ export class CommandBarCustomizationExample extends React.Component<{}, ISplitDr
 
   @autobind
   private _renderSplitButtonMenuItem(item: IContextualMenuItem) {
-    let darkerBG = this.state.isContextMenuShown && styles.darkerBG;
+    const darkerBG = this.state.isContextMenuShown && styles.darkerBG;
 
-    let dropDownButtonClass = css(
+    const dropDownButtonClass = css(
       styles.button,
       darkerBG
     );
-    let mainBtnClassName = css(
+    const mainBtnClassName = css(
       !item.name && ('ms-CommandBarItem--noName'),
       styles.button,
       darkerBG
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
index bae1f27df927d..ea64faa7cf7f8 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
@@ -38,7 +38,7 @@ describe('ContextualMenu', () => {
       />
     );
 
-    let menuList = document.querySelector('.ms-ContextualMenu-list') as HTMLUListElement;
+    const menuList = document.querySelector('.ms-ContextualMenu-list') as HTMLUListElement;
 
     expect(menuList.scrollHeight).toBeLessThanOrEqual(menuList.offsetHeight);
   });
@@ -52,7 +52,7 @@ describe('ContextualMenu', () => {
     ];
 
     let spyCalled = false;
-    let onDismissSpy = (ev?: any, dismissAll?: boolean) => { spyCalled = true; };
+    const onDismissSpy = (ev?: any, dismissAll?: boolean) => { spyCalled = true; };
 
     ReactTestUtils.renderIntoDocument<ContextualMenu>(
       <ContextualMenu
@@ -62,7 +62,7 @@ describe('ContextualMenu', () => {
       />
     );
 
-    let menuList = document.querySelector('ul.ms-ContextualMenu-list') as HTMLUListElement;
+    const menuList = document.querySelector('ul.ms-ContextualMenu-list') as HTMLUListElement;
     ReactTestUtils.Simulate.keyDown(menuList, { which: KeyCodes.left });
 
     expect(spyCalled).toEqual(true);
@@ -77,7 +77,7 @@ describe('ContextualMenu', () => {
     ];
 
     let spyCalled = false;
-    let onDismissSpy = (ev?: any, dismissAll?: boolean) => { spyCalled = true; };
+    const onDismissSpy = (ev?: any, dismissAll?: boolean) => { spyCalled = true; };
 
     ReactTestUtils.renderIntoDocument<ContextualMenu>(
       <ContextualMenu
@@ -88,7 +88,7 @@ describe('ContextualMenu', () => {
       />
     );
 
-    let menuList = document.querySelector('ul.ms-ContextualMenu-list') as HTMLUListElement;
+    const menuList = document.querySelector('ul.ms-ContextualMenu-list') as HTMLUListElement;
     ReactTestUtils.Simulate.keyDown(menuList, { which: KeyCodes.left });
 
     expect(spyCalled).toEqual(false);
@@ -103,7 +103,7 @@ describe('ContextualMenu', () => {
     ];
 
     let spyCalled = false;
-    let onDismissSpy = (ev?: any, dismissAll?: boolean) => { spyCalled = true; };
+    const onDismissSpy = (ev?: any, dismissAll?: boolean) => { spyCalled = true; };
 
     ReactTestUtils.renderIntoDocument<ContextualMenu>(
       <ContextualMenu
@@ -114,7 +114,7 @@ describe('ContextualMenu', () => {
       />
     );
 
-    let menuList = document.querySelector('ul.ms-ContextualMenu-list') as HTMLUListElement;
+    const menuList = document.querySelector('ul.ms-ContextualMenu-list') as HTMLUListElement;
     ReactTestUtils.Simulate.keyDown(menuList, { which: KeyCodes.left });
 
     expect(spyCalled).toEqual(false);
@@ -142,7 +142,7 @@ describe('ContextualMenu', () => {
       />
     );
 
-    let menuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
+    const menuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
 
     ReactTestUtils.Simulate.keyDown(menuItem, { which: KeyCodes.right });
 
@@ -172,7 +172,7 @@ describe('ContextualMenu', () => {
       />
     );
 
-    let menuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
+    const menuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
 
     ReactTestUtils.Simulate.click(menuItem);
 
@@ -233,7 +233,7 @@ describe('ContextualMenu', () => {
       />
     );
 
-    let menuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
+    const menuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
     ReactTestUtils.Simulate.keyDown(menuItem, { which: KeyCodes.right });
 
     expect(document.querySelector('.SubMenuClass')).toBeDefined();
@@ -254,7 +254,7 @@ describe('ContextualMenu', () => {
       />
     );
 
-    let menuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
+    const menuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
 
     expect(menuItem.disabled).toBeTruthy();
   });
@@ -274,7 +274,7 @@ describe('ContextualMenu', () => {
       />
     );
 
-    let menuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
+    const menuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
 
     expect(menuItem.disabled).toBeTruthy();
   });
@@ -303,12 +303,12 @@ describe('ContextualMenu', () => {
       />
     );
 
-    let menuItems = document.querySelectorAll('li');
+    const menuItems = document.querySelectorAll('li');
 
     expect(menuItems.length).toEqual(4);
-    let headerOne = menuItems[0];
-    let dividerOne = menuItems[2];
-    let headerTwo = menuItems[3];
+    const headerOne = menuItems[0];
+    const dividerOne = menuItems[2];
+    const headerTwo = menuItems[3];
 
     expect(headerOne.className).not.toEqual(expect.stringMatching('divider'));
     expect(headerOne.firstElementChild!.className).toEqual(expect.stringMatching('header'));
@@ -363,7 +363,7 @@ describe('ContextualMenu', () => {
       />
     );
 
-    let menuItems = document.querySelectorAll('li');
+    const menuItems = document.querySelectorAll('li');
     expect(menuItems.length).toEqual(8);
 
   });
@@ -374,7 +374,7 @@ describe('ContextualMenu', () => {
         items={ [] }
       />
     );
-    let menuList = document.querySelector('.ms-ContextualMenu-list');
+    const menuList = document.querySelector('.ms-ContextualMenu-list');
 
     expect(menuList).toBeNull();
 
@@ -473,8 +473,8 @@ describe('ContextualMenu', () => {
         focusedItem = document.querySelector('.testkey2')!.firstChild;
 
         if (focusedItem) {
-          let focusedItemElement = focusedItem as HTMLElement;
-          let eventObject = document.createEvent('Events');
+          const focusedItemElement = focusedItem as HTMLElement;
+          const eventObject = document.createEvent('Events');
           eventObject.initEvent('mouseenter', true, false);
           focusedItemElement.dispatchEvent(eventObject);
         }
@@ -552,7 +552,7 @@ describe('ContextualMenu', () => {
       />
     );
 
-    let callout = document.querySelector('.ms-Callout') as HTMLElement;
+    const callout = document.querySelector('.ms-Callout') as HTMLElement;
     expect(callout).toBeDefined();
     expect(callout.classList.contains('ms-ContextualMenu-Callout')).toBeTruthy();
     expect(callout.classList.contains('foo')).toBeTruthy();
@@ -575,7 +575,7 @@ describe('ContextualMenu', () => {
       />
     );
 
-    let menuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
+    const menuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
 
     expect(menuItem.querySelector('.ms-ContextualMenu-submenuIcon')).not.toEqual(null);
   });
@@ -604,7 +604,7 @@ describe('ContextualMenu', () => {
       />
     );
 
-    let menuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
+    const menuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
 
     ReactTestUtils.Simulate.click(menuItem);
 
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 23290580005af..4310a441eafb8 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -143,7 +143,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
   @autobind
   public dismiss(ev?: any, dismissAll?: boolean) {
-    let { onDismiss } = this.props;
+    const { onDismiss } = this.props;
 
     if (onDismiss) {
       onDismiss(ev, dismissAll);
@@ -152,14 +152,14 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
   public componentWillUpdate(newProps: IContextualMenuProps) {
     if (newProps.target !== this.props.target) {
-      let newTarget = newProps.target;
+      const newTarget = newProps.target;
       this._setTargetWindowAndElement(newTarget!);
     }
   }
 
   // Invoked once, both on the client and server, immediately before the initial rendering occurs.
   public componentWillMount() {
-    let target = this.props.target;
+    const target = this.props.target;
     this._setTargetWindowAndElement(target!);
     this._previousActiveElement = this._targetWindow ? this._targetWindow.document.activeElement as HTMLElement : null;
   }
@@ -176,7 +176,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   public componentWillUnmount() {
     if (this._isFocusingPreviousElement && this._previousActiveElement) {
 
-      // This slight delay is required so that we can unwind the stack, let react try to mess with focus, and then
+      // This slight delay is required so that we can unwind the stack, const react try to mess with focus, and then
       // apply the correct focus. Without the setTimeout, we end up focusing the correct thing, and then React wants
       // to reset the focus back to the thing it thinks should have been focused.
       setTimeout(() => this._previousActiveElement!.focus(), 0);
@@ -191,9 +191,13 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   }
 
   public render(): JSX.Element | null {
-    let { className,
+    let {
+      isBeakVisible
+    } = this.props;
+
+    const {
+      className,
       items,
-      isBeakVisible,
       labelElementId,
       id,
       targetPoint,
@@ -219,10 +223,10 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       onRenderSubMenu = this._onRenderSubMenu
     } = this.props;
 
-    let menuClassNames = this.props.getMenuClassNames || getContextualMenuClassNames;
+    const menuClassNames = this.props.getMenuClassNames || getContextualMenuClassNames;
     this._classNames = menuClassNames(theme!, className);
 
-    let hasIcons = itemsHaveIcons(items);
+    const hasIcons = itemsHaveIcons(items);
 
     function itemsHaveIcons(contextualMenuItems: IContextualMenuItem[]): boolean {
       for (const item of contextualMenuItems) {
@@ -238,7 +242,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       return false;
     }
 
-    let hasCheckmarks = canAnyMenuItemsCheck(items);
+    const hasCheckmarks = canAnyMenuItemsCheck(items);
     const submenuProps = this.state.expandedMenuItemKey ? this._getSubmenuProps() : null;
 
     isBeakVisible = isBeakVisible === undefined ? this.props.responsiveMode! <= ResponsiveMode.medium : isBeakVisible;
@@ -246,7 +250,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
      * When useTargetWidth is true, get the width of the target element and apply it for the context menu container
      */
     let contextMenuStyle;
-    let targetAsHtmlElement = this._target as HTMLElement;
+    const targetAsHtmlElement = this._target as HTMLElement;
     if ((useTargetWidth || useTargetAsMinWidth) && targetAsHtmlElement && targetAsHtmlElement.offsetWidth) {
       const targetBoundingRect = targetAsHtmlElement.getBoundingClientRect();
       const targetWidth = targetBoundingRect.width - 2 /* Accounts for 1px border */;
@@ -266,7 +270,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     if (items && items.length > 0) {
       let indexCorrection = 0;
       let totalItemCount = 0;
-      for (let item of items) {
+      for (const item of items) {
         if (item.itemType !== ContextualMenuItemType.Divider &&
           item.itemType !== ContextualMenuItemType.Header) {
           totalItemCount++;
@@ -338,13 +342,13 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   }
 
   private _renderMenuItem(item: IContextualMenuItem, index: number, focusableElementIndex: number, totalItemCount: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
-    let renderedItems: React.ReactNode[] = [];
-    let iconProps = this._getIconProps(item);
+    const renderedItems: React.ReactNode[] = [];
+    const iconProps = this._getIconProps(item);
     // We only send a dividerClassName when the item to be rendered is a divider. For all other cases, the default divider style is used.
-    let dividerClassName = item.itemType === ContextualMenuItemType.Divider ? item.className : undefined;
-    let subMenuIconClassName = item.submenuIconProps ? item.submenuIconProps.className : '';
-    let getClassNames = item.getItemClassNames || getItemClassNames;
-    let itemClassNames = getClassNames(
+    const dividerClassName = item.itemType === ContextualMenuItemType.Divider ? item.className : undefined;
+    const subMenuIconClassName = item.submenuIconProps ? item.submenuIconProps.className : '';
+    const getClassNames = item.getItemClassNames || getItemClassNames;
+    const itemClassNames = getClassNames(
       this.props.theme!,
       this._isItemDisabled(item),
       (this.state.expandedMenuItemKey === item.key),
@@ -366,14 +370,14 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
         break;
       case ContextualMenuItemType.Header:
         renderedItems.push(this._renderSeparator(index, itemClassNames));
-        let headerItem = this._renderHeaderMenuItem(item, itemClassNames, index, hasCheckmarks, hasIcons);
+        const headerItem = this._renderHeaderMenuItem(item, itemClassNames, index, hasCheckmarks, hasIcons);
         renderedItems.push(this._renderListItem(headerItem, item.key || index, itemClassNames, item.title));
         break;
       case ContextualMenuItemType.Section:
         renderedItems.push(this._renderSectionItem(item, itemClassNames, index, hasCheckmarks, hasIcons));
         break;
       default:
-        let menuItem = this._renderNormalItem(item, itemClassNames, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons);
+        const menuItem = this._renderNormalItem(item, itemClassNames, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons);
         renderedItems.push(this._renderListItem(menuItem, item.key || index, itemClassNames, item.title));
         break;
     }
@@ -494,7 +498,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     totalItemCount: number,
     hasCheckmarks?: boolean,
     hasIcons?: boolean) {
-    let { expandedMenuItemKey, subMenuId } = this.state;
+    const { expandedMenuItemKey } = this.state;
+    let { subMenuId } = this.state;
     if (item.subMenuProps && item.subMenuProps.id) {
       subMenuId = item.subMenuProps.id;
     }
@@ -619,7 +624,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   }
 
   private _renderSplitDivider(item: IContextualMenuItem) {
-    let getDividerClassnames = item.getSplitButtonVerticalDividerClassNames || getSplitButtonVerticalDividerClassNames;
+    const getDividerClassnames = item.getSplitButtonVerticalDividerClassNames || getSplitButtonVerticalDividerClassNames;
     return <VerticalDivider getClassNames={ getDividerClassnames } />;
   }
 
@@ -653,7 +658,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   }
 
   private _getIconProps(item: IContextualMenuItem): IIconProps {
-    let iconProps: IIconProps = item.iconProps ? item.iconProps : {
+    const iconProps: IIconProps = item.iconProps ? item.iconProps : {
       iconName: item.icon
     };
     return iconProps;
@@ -661,14 +666,14 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
   private _renderIcon(item: IContextualMenuItem, classNames: IMenuItemClassNames) {
     // Only present to allow continued use of item.icon which is deprecated.
-    let iconProps = this._getIconProps(item);
+    const iconProps = this._getIconProps(item);
 
     return <Icon { ...iconProps } className={ classNames.icon } />;
   }
 
   @autobind
   private _onKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
-    let submenuCloseKey = getRTL() ? KeyCodes.right : KeyCodes.left;
+    const submenuCloseKey = getRTL() ? KeyCodes.right : KeyCodes.left;
 
     if (ev.which === KeyCodes.escape
       || ev.altKey
@@ -696,7 +701,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       return;
     }
 
-    let elementToFocus = ev.which === KeyCodes.up ?
+    const elementToFocus = ev.which === KeyCodes.up ?
       getLastFocusable(this._host, (this._host.lastChild as HTMLElement), true) :
       ev.which === KeyCodes.down ?
         getFirstFocusable(this._host, (this._host.firstChild as HTMLElement), true) :
@@ -730,7 +735,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       return;
     }
 
-    let targetElement = ev.currentTarget as HTMLElement;
+    const targetElement = ev.currentTarget as HTMLElement;
 
     if (item.key !== this.state.expandedMenuItemKey) {
       if (hasSubmenu(item)) {
@@ -745,7 +750,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
   private _onItemMouseMove(item: any, ev: React.MouseEvent<HTMLElement>) {
 
-    let targetElement = ev.currentTarget as HTMLElement;
+    const targetElement = ev.currentTarget as HTMLElement;
 
     if (!this._isScrollIdle || targetElement === this._targetWindow.document.activeElement as HTMLElement) {
       return;
@@ -796,7 +801,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   }
 
   private _onItemClick(item: IContextualMenuItem, ev: React.MouseEvent<HTMLElement>) {
-    let items = getSubmenuItems(item);
+    const items = getSubmenuItems(item);
 
     if (!hasSubmenu(item) && (!items || !items.length)) { // This is an item without a menu. Click it.
       this._executeItemClick(item, ev);
@@ -828,7 +833,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   }
 
   private _onItemKeyDown(item: any, ev: KeyboardEvent) {
-    let openKey = getRTL() ? KeyCodes.left : KeyCodes.right;
+    const openKey = getRTL() ? KeyCodes.left : KeyCodes.right;
 
     if (ev.which === openKey) {
       this._onItemSubMenuExpand(item, ev.currentTarget as HTMLElement);
@@ -876,7 +881,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   }
 
   private _findItemByKey(key: string): IContextualMenuItem | undefined {
-    let { items } = this.props;
+    const { items } = this.props;
     return this._findItemByKeyFromItems(key, items);
   }
 
@@ -914,7 +919,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   private _setTargetWindowAndElement(target: HTMLElement | string | MouseEvent | IPoint): void {
     if (target) {
       if (typeof target === 'string') {
-        let currentDoc: Document = getDocument()!;
+        const currentDoc: Document = getDocument()!;
         this._target = currentDoc ? currentDoc.querySelector(target) as HTMLElement : null;
         this._targetWindow = getWindow()!;
       } else if ((target as MouseEvent).stopPropagation) {
@@ -924,7 +929,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
         this._targetWindow = getWindow()!;
         this._target = target;
       } else {
-        let targetElement: HTMLElement = target as HTMLElement;
+        const targetElement: HTMLElement = target as HTMLElement;
         this._targetWindow = getWindow(targetElement)!;
         this._target = target;
       }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
index e94043cc69f7f..3e9d34033dc2a 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
@@ -7,7 +7,7 @@ export interface IContextualMenuMultiselectExampleState {
   selection?: { [key: string]: boolean };
 }
 
-let keys: string[] = ['newItem', 'share', 'mobile', 'enablePrint', 'enableMusic', 'newSub', 'emailMessage', 'calendarEvent'];
+const keys: string[] = ['newItem', 'share', 'mobile', 'enablePrint', 'enableMusic', 'newSub', 'emailMessage', 'calendarEvent'];
 
 export class ContextualMenuCheckmarksExample extends React.Component<{}, IContextualMenuMultiselectExampleState> {
 
@@ -22,7 +22,7 @@ export class ContextualMenuCheckmarksExample extends React.Component<{}, IContex
   }
 
   public render() {
-    let { selection } = this.state;
+    const { selection } = this.state;
 
     return (
       <DefaultButton
@@ -110,7 +110,7 @@ export class ContextualMenuCheckmarksExample extends React.Component<{}, IContex
   }
 
   private _onToggleSelect(ev?: React.MouseEvent<HTMLButtonElement>, item?: IContextualMenuItem) {
-    let { selection } = this.state;
+    const { selection } = this.state;
     ev!.preventDefault();
     selection![item!.key] = !selection![item!.key];
 
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
index a591d48fd70b4..69b1f74836261 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
@@ -57,7 +57,7 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
   }
 
   public render() {
-    let {
+    const {
       beakWidth,
       directionalHint,
       directionalHintForRTL,
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.Example.tsx
index 3096efe21ab88..159d6f6a4922f 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.Example.tsx
@@ -14,7 +14,7 @@ export class ContextualMenuIconExample extends React.Component<{}, { showCallout
   }
 
   public render() {
-    let { showCallout } = this.state;
+    const { showCallout } = this.state;
 
     return (
       <div>
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx
index a4c080b5436ae..8476fd2e3eba2 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.test.tsx
@@ -10,19 +10,19 @@ describe('DatePicker', () => {
   it('renders default DatePicker correctly', () => {
     // This will only render the input. Calendar component has its own snapshot.
     const component = renderer.create(<DatePicker />);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
   it('should not open DatePicker when disabled, no label', () => {
-    let wrapper = mount(<DatePicker disabled />);
+    const wrapper = mount(<DatePicker disabled />);
     wrapper.find('i').simulate('click');
 
     expect(wrapper.state('isDatePickerShown')).toBe(false);
   });
 
   it('should not open DatePicker when disabled, with label', () => {
-    let wrapper = mount(<DatePicker disabled label='label' />);
+    const wrapper = mount(<DatePicker disabled label='label' />);
     wrapper.find('i').simulate('click');
     expect(wrapper.state('isDatePickerShown')).toBe(false);
   });
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 279c48643e951..9dc5caacfe1e1 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -130,7 +130,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
   constructor(props: IDatePickerProps) {
     super(props);
 
-    let { formatDate, value } = props;
+    const { formatDate, value } = props;
 
     this.state = {
       selectedDate: value || undefined,
@@ -143,7 +143,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
   }
 
   public componentWillReceiveProps(nextProps: IDatePickerProps) {
-    let { formatDate, isRequired, strings, value, minDate, maxDate } = nextProps;
+    const { formatDate, isRequired, strings, value, minDate, maxDate } = nextProps;
 
     if (compareDates(this.props.minDate!, nextProps.minDate!) &&
       compareDates(this.props.maxDate!, nextProps.maxDate!) &&
@@ -169,7 +169,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     // passed in or if the formatting function was modified. We only update the selected date if either of these
     // had a legit change. Note tha the bug will still repro when only the formatDate was passed in props and this
     // is the result of the onSelectDate callback, but this should be a rare scenario.
-    let oldValue = this.state.selectedDate;
+    const oldValue = this.state.selectedDate;
     if (!compareDates(oldValue!, value!) || this.props.formatDate !== formatDate) {
       this.setState({
         selectedDate: value || undefined,
@@ -274,7 +274,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
 
   @autobind
   private _onSelectDate(date: Date) {
-    let { formatDate, onSelectDate } = this.props;
+    const { formatDate, onSelectDate } = this.props;
 
     this.setState({
       selectedDate: date,
@@ -319,7 +319,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
         this._dismissDatePickerPopup();
       }
 
-      let { isRequired, value, strings } = this.props;
+      const { isRequired, value, strings } = this.props;
 
       this.setState({
         errorMessage: (isRequired && !value) ? (strings!.isRequiredErrorMessage || '*') : undefined,
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx
index ddb8f1f0ea460..4218f5276044c 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx
@@ -75,7 +75,7 @@ export class DatePickerBasicExample extends React.Component<{}, IDatePickerBasic
   }
 
   public render() {
-    let { firstDayOfWeek } = this.state;
+    const { firstDayOfWeek } = this.state;
 
     return (
       <div>
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Bounded.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Bounded.Example.tsx
index 7b923ec79ef37..33d6890745785 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Bounded.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Bounded.Example.tsx
@@ -90,7 +90,7 @@ export class DatePickerBoundedExample extends React.Component<{}, IDatePickerReq
   }
 
   public render() {
-    let { firstDayOfWeek } = this.state;
+    const { firstDayOfWeek } = this.state;
 
     return (
       <div>
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Format.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Format.Example.tsx
index ee5c5e88e6680..1750d9fe5a87f 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Format.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Format.Example.tsx
@@ -80,7 +80,7 @@ export class DatePickerFormatExample extends React.Component<
   }
 
   public render() {
-    let { firstDayOfWeek, value } = this.state;
+    const { firstDayOfWeek, value } = this.state;
     const desc =
       'This field is required. One of the support input formats is year dash month dash day.';
     return (
@@ -133,13 +133,13 @@ export class DatePickerFormatExample extends React.Component<
 
   @autobind
   private _onParseDateFromString(value: string): Date {
-    let date = this.state.value || new Date();
-    let values = (value || '').trim().split('/');
-    let day =
+    const date = this.state.value || new Date();
+    const values = (value || '').trim().split('/');
+    const day =
       values.length > 0
         ? Math.max(1, Math.min(31, parseInt(values[0], 10)))
         : date.getDate();
-    let month =
+    const month =
       values.length > 1
         ? Math.max(1, Math.min(12, parseInt(values[1], 10))) - 1
         : date.getMonth();
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx
index eb6f25595e0dc..616074044dece 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx
@@ -82,7 +82,7 @@ export class DatePickerInputExample extends React.Component<{}, IDatePickerInput
   }
 
   public render() {
-    let { firstDayOfWeek, value } = this.state;
+    const { firstDayOfWeek, value } = this.state;
     const desc = 'This field is required. One of the support input formats is year dash month dash day.';
     return (
       <div>
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Required.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Required.Example.tsx
index f3ce21c075815..211e0976099ba 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Required.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Required.Example.tsx
@@ -81,7 +81,7 @@ export class DatePickerRequiredExample extends React.Component<{}, IDatePickerRe
   }
 
   public render() {
-    let { firstDayOfWeek } = this.state;
+    const { firstDayOfWeek } = this.state;
 
     return (
       <div>
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.WeekNumbers.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.WeekNumbers.Example.tsx
index 4ffda00841333..7708fb68cc06c 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.WeekNumbers.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.WeekNumbers.Example.tsx
@@ -75,7 +75,7 @@ export class DatePickerWeekNumbersExample extends React.Component<{}, IDatePicke
   }
 
   public render() {
-    let { firstDayOfWeek } = this.state;
+    const { firstDayOfWeek } = this.state;
 
     return (
       <div>
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index 766244900c53c..6e88bf7b10b83 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -104,7 +104,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
   }
 
   public componentDidMount() {
-    let { selection } = this.props;
+    const { selection } = this.props;
 
     this._events.on(selection, SELECTION_CHANGE, this._onSelectionChanged);
 
@@ -117,7 +117,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
   }
 
   public componentWillReceiveProps(newProps: IDetailsHeaderProps) {
-    let { groupNestingDepth } = this.state;
+    const { groupNestingDepth } = this.state;
 
     if (newProps.groupNestingDepth !== groupNestingDepth) {
       this.setState({ groupNestingDepth: newProps.groupNestingDepth });
@@ -125,8 +125,8 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
   }
 
   public render() {
-    let { columns, ariaLabel, ariaLabelForSelectAllCheckbox, selectAllVisibility, ariaLabelForSelectionColumn } = this.props;
-    let { isAllSelected, columnResizeDetails, isSizing, groupNestingDepth, isAllCollapsed } = this.state;
+    const { columns, ariaLabel, ariaLabelForSelectAllCheckbox, selectAllVisibility, ariaLabelForSelectionColumn } = this.props;
+    const { isAllSelected, columnResizeDetails, isSizing, groupNestingDepth, isAllCollapsed } = this.state;
 
     const showCheckbox = selectAllVisibility !== SelectAllVisibility.none;
 
@@ -376,7 +376,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
    * @param {React.MouseEvent} ev (mouse double click event)
    */
   private _onSizerDoubleClick(columnIndex: number, ev: React.MouseEvent<HTMLElement>) {
-    let { onColumnAutoResized, columns } = this.props;
+    const { onColumnAutoResized, columns } = this.props;
     if (onColumnAutoResized) {
       onColumnAutoResized(columns[columnIndex], columnIndex);
     }
@@ -388,16 +388,16 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
 
   @autobind
   private _onSelectAllClicked() {
-    let { selection } = this.props;
+    const { selection } = this.props;
 
     selection.toggleAllSelected();
   }
 
   @autobind
   private _onRootMouseDown(ev: MouseEvent) {
-    let columnIndexAttr = (ev.target as HTMLElement).getAttribute('data-sizer-index');
-    let columnIndex = Number(columnIndexAttr);
-    let { columns } = this.props;
+    const columnIndexAttr = (ev.target as HTMLElement).getAttribute('data-sizer-index');
+    const columnIndex = Number(columnIndexAttr);
+    const { columns } = this.props;
 
     if (columnIndexAttr === null || ev.button !== MOUSEDOWN_PRIMARY_BUTTON) {
       // Ignore anything except the primary button.
@@ -418,7 +418,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
 
   @autobind
   private _onRootMouseMove(ev: React.MouseEvent<HTMLElement>) {
-    let { columnResizeDetails, isSizing } = this.state;
+    const { columnResizeDetails, isSizing } = this.state;
 
     if (columnResizeDetails && !isSizing && ev.clientX !== columnResizeDetails.originX) {
       this.setState({ isSizing: true });
@@ -497,13 +497,13 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
    */
   @autobind
   private _onSizerMouseMove(ev: React.MouseEvent<HTMLElement>) {
-    let {
+    const {
       // use buttons property here since ev.button in some edge case is not upding well during the move.
       // but firefox doesn't support it, so we set the default value when it is not defined.
       buttons
   } = ev;
-    let { onColumnIsSizingChanged, onColumnResized, columns } = this.props;
-    let { columnResizeDetails } = this.state;
+    const { onColumnIsSizingChanged, onColumnResized, columns } = this.props;
+    const { columnResizeDetails } = this.state;
 
     if (buttons !== undefined && buttons !== MOUSEMOVE_PRIMARY_BUTTON) {
       // cancel mouse down event and return early when the primary button is not pressed
@@ -555,8 +555,8 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
    */
   @autobind
   private _onSizerMouseUp(ev: React.MouseEvent<HTMLElement>) {
-    let { columns, onColumnIsSizingChanged } = this.props;
-    let { columnResizeDetails } = this.state;
+    const { columns, onColumnIsSizingChanged } = this.props;
+    const { columnResizeDetails } = this.state;
 
     this.setState({
       columnResizeDetails: undefined,
@@ -569,7 +569,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
   }
 
   private _onSelectionChanged() {
-    let isAllSelected = this.props.selection.isAllSelected();
+    const isAllSelected = this.props.selection.isAllSelected();
 
     if (this.state.isAllSelected !== isAllSelected) {
       this.setState({
@@ -579,7 +579,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
   }
 
   private _onColumnClick(column: IColumn, ev: React.MouseEvent<HTMLElement>) {
-    let { onColumnClick } = this.props;
+    const { onColumnClick } = this.props;
 
     if (column.onColumnClick) {
       column.onColumnClick(ev, column);
@@ -591,7 +591,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
   }
 
   private _onColumnContextMenu(column: IColumn, ev: React.MouseEvent<HTMLElement>) {
-    let { onColumnContextMenu } = this.props;
+    const { onColumnContextMenu } = this.props;
 
     if (column.onColumnContextMenu) {
       column.onColumnContextMenu(column, ev);
@@ -607,8 +607,8 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
   }
 
   private _onToggleCollapseAll() {
-    let { onToggleCollapseAll } = this.props;
-    let newCollapsed = !this.state.isAllCollapsed;
+    const { onToggleCollapseAll } = this.props;
+    const newCollapsed = !this.state.isAllCollapsed;
     this.setState({
       isAllCollapsed: newCollapsed
     });
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 3418d3d71a9bd..df241e22f95cf 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -177,7 +177,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   }
 
   public componentWillReceiveProps(newProps: IDetailsListProps) {
-    let {
+    const {
       checkboxVisibility,
       items,
       setKey,
@@ -185,7 +185,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       columns,
       viewport
     } = this.props;
-    let shouldResetSelection = (newProps.setKey !== setKey) || newProps.setKey === undefined;
+    const shouldResetSelection = (newProps.setKey !== setKey) || newProps.setKey === undefined;
     let shouldForceUpdates = false;
 
     if (newProps.layoutMode !== this.props.layoutMode) {
@@ -226,7 +226,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   }
 
   public render() {
-    let {
+    const {
       ariaLabelForListHeader,
       ariaLabelForSelectAllCheckbox,
       ariaLabelForSelectionColumn,
@@ -255,17 +255,17 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       usePageCache,
       onShouldVirtualize
     } = this.props;
-    let {
+    const {
       adjustedColumns,
       isCollapsed,
       isSizing,
       isSomeGroupExpanded
     } = this.state;
-    let {
+    const {
       _selection: selection,
       _dragDropHelper: dragDropHelper
     } = this;
-    let groupNestingDepth = this._getGroupNestingDepth();
+    const groupNestingDepth = this._getGroupNestingDepth();
     const additionalListProps: IListProps = {
       renderedWindowsAhead: isSizing ? 0 : DEFAULT_RENDERED_WINDOWS_AHEAD,
       renderedWindowsBehind: isSizing ? 0 : DEFAULT_RENDERED_WINDOWS_BEHIND,
@@ -282,7 +282,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       if (isCollapsedGroupSelectVisible === undefined) {
         isCollapsedGroupSelectVisible = true;
       }
-      let isSelectAllVisible = isCollapsedGroupSelectVisible || !groups || isSomeGroupExpanded;
+      const isSelectAllVisible = isCollapsedGroupSelectVisible || !groups || isSomeGroupExpanded;
       selectAllVisibility = isSelectAllVisible ? SelectAllVisibility.visible : SelectAllVisibility.hidden;
     }
 
@@ -422,7 +422,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   }
 
   private _onRenderCell(nestingDepth: number, item: any, index: number): React.ReactNode {
-    let {
+    const {
       compact,
       dragDropEvents,
       rowElementEventMap: eventsToRegister,
@@ -438,10 +438,10 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       checkboxCellClassName,
       groupProps
     } = this.props;
-    let collapseAllVisibility = groupProps && groupProps.collapseAllVisibility;
-    let selection = this._selection;
-    let dragDropHelper = this._dragDropHelper;
-    let {
+    const collapseAllVisibility = groupProps && groupProps.collapseAllVisibility;
+    const selection = this._selection;
+    const dragDropHelper = this._dragDropHelper;
+    const {
       adjustedColumns: columns
     } = this.state;
 
@@ -504,7 +504,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   }
 
   private _getGroupNestingDepth(): number {
-    let { groups } = this.props;
+    const { groups } = this.props;
     let level = 0;
     let groupsInLevel = groups;
 
@@ -547,7 +547,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   }
 
   private _onRowWillUnmount(row: DetailsRow) {
-    let { onRowWillUnmount } = this.props;
+    const { onRowWillUnmount } = this.props;
 
     const { item, itemIndex } = row.props;
     const itemKey = this._getItemKey(item, itemIndex);
@@ -579,8 +579,8 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   }
 
   private _adjustColumns(newProps: IDetailsListProps, forceUpdate?: boolean, resizingColumnIndex?: number) {
-    let adjustedColumns = this._getAdjustedColumns(newProps, forceUpdate, resizingColumnIndex);
-    let { width: viewportWidth } = this.props.viewport!;
+    const adjustedColumns = this._getAdjustedColumns(newProps, forceUpdate, resizingColumnIndex);
+    const { width: viewportWidth } = this.props.viewport!;
 
     if (adjustedColumns) {
       this.setState({
@@ -592,12 +592,13 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
 
   /** Returns adjusted columns, given the viewport size and layout mode. */
   private _getAdjustedColumns(newProps: IDetailsListProps, forceUpdate?: boolean, resizingColumnIndex?: number): IColumn[] | undefined {
-    let { columns: newColumns, items: newItems, layoutMode, selectionMode } = newProps;
+    const { items: newItems, layoutMode, selectionMode } = newProps;
+    let { columns: newColumns } = newProps;
     let { width: viewportWidth } = newProps.viewport!;
 
-    let columns = this.props ? this.props.columns : [];
-    let lastWidth = this.state ? this.state.lastWidth : -1;
-    let lastSelectionMode = this.state ? this.state.lastSelectionMode : undefined;
+    const columns = this.props ? this.props.columns : [];
+    const lastWidth = this.state ? this.state.lastWidth : -1;
+    const lastSelectionMode = this.state ? this.state.lastSelectionMode : undefined;
 
     if (viewportWidth !== undefined) {
       if (!forceUpdate &&
@@ -639,7 +640,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   /** Builds a set of columns based on the given columns mixed with the current overrides. */
   private _getFixedColumns(newColumns: IColumn[]) {
     return newColumns.map(column => {
-      let newColumn = assign({}, column, this._columnOverrides[column.key]);
+      const newColumn = assign({}, column, this._columnOverrides[column.key]);
 
       if (!newColumn.calculatedWidth) {
         newColumn.calculatedWidth = newColumn.maxWidth || newColumn.minWidth || MIN_COLUMN_WIDTH;
@@ -667,18 +668,18 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
 
   /** Builds a set of columns to fix within the viewport width. */
   private _getJustifiedColumns(newColumns: IColumn[], viewportWidth: number, props: IDetailsListProps, firstIndex: number) {
-    let {
+    const {
       selectionMode,
       checkboxVisibility,
       groups
     } = props;
-    let outerPadding = DEFAULT_INNER_PADDING;
-    let rowCheckWidth = (selectionMode !== SelectionMode.none && checkboxVisibility !== CheckboxVisibility.hidden) ? CHECKBOX_WIDTH : 0;
-    let groupExpandWidth = groups ? GROUP_EXPAND_WIDTH : 0;
+    const outerPadding = DEFAULT_INNER_PADDING;
+    const rowCheckWidth = (selectionMode !== SelectionMode.none && checkboxVisibility !== CheckboxVisibility.hidden) ? CHECKBOX_WIDTH : 0;
+    const groupExpandWidth = groups ? GROUP_EXPAND_WIDTH : 0;
     let totalWidth = 0; // offset because we have one less inner padding.
-    let availableWidth = viewportWidth - (outerPadding + rowCheckWidth + groupExpandWidth);
-    let adjustedColumns: IColumn[] = newColumns.map((column, i) => {
-      let newColumn = assign(
+    const availableWidth = viewportWidth - (outerPadding + rowCheckWidth + groupExpandWidth);
+    const adjustedColumns: IColumn[] = newColumns.map((column, i) => {
+    const newColumn = assign(
         {},
         column,
         {
@@ -696,7 +697,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
 
     // Shrink or remove collapsable columns.
     while (lastIndex > 0 && totalWidth > availableWidth) {
-      let column = adjustedColumns[lastIndex];
+      const column = adjustedColumns[lastIndex];
 
       const minWidth = column.minWidth || MIN_COLUMN_WIDTH;
       const overflowWidth = totalWidth - availableWidth;
@@ -713,20 +714,20 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
 
     // Then expand columns starting at the beginning, until we've filled the width.
     for (let i = 0; i < adjustedColumns.length && totalWidth < availableWidth; i++) {
-      let column = adjustedColumns[i];
+      const column = adjustedColumns[i];
       const isLast = i === (adjustedColumns.length - 1);
       const overrides = this._columnOverrides[column.key];
       if (overrides && overrides.calculatedWidth && !isLast) {
         continue;
       }
 
-      let spaceLeft = availableWidth - totalWidth;
+      const spaceLeft = availableWidth - totalWidth;
       let increment: number;
       if (isLast) {
         increment = spaceLeft;
       } else {
-        let maxWidth = column.maxWidth;
-        let minWidth = column.minWidth || maxWidth || MIN_COLUMN_WIDTH;
+        const maxWidth = column.maxWidth;
+        const minWidth = column.minWidth || maxWidth || MIN_COLUMN_WIDTH;
         increment = maxWidth ? Math.min(spaceLeft, maxWidth - minWidth) : spaceLeft;
       }
 
@@ -738,7 +739,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   }
 
   private _onColumnResized(resizingColumn: IColumn, newWidth: number, resizingColumnIndex: number) {
-    let newCalculatedWidth = Math.max(resizingColumn.minWidth || MIN_COLUMN_WIDTH, newWidth);
+    const newCalculatedWidth = Math.max(resizingColumn.minWidth || MIN_COLUMN_WIDTH, newWidth);
     if (this.props.onColumnResize) {
       this.props.onColumnResize(resizingColumn, newCalculatedWidth, resizingColumnIndex);
     }
@@ -750,7 +751,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   }
 
   private _rememberCalculatedWidth(column: IColumn, newCalculatedWidth: number) {
-    let overrides = this._getColumnOverride(column.key);
+    const overrides = this._getColumnOverride(column.key);
     overrides.calculatedWidth = newCalculatedWidth;
     overrides.currentWidth = newCalculatedWidth;
   }
@@ -772,11 +773,11 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   private _onColumnAutoResized(column: IColumn, columnIndex: number) {
     let max = 0;
     let count = 0;
-    let totalCount = Object.keys(this._activeRows).length;
+    const totalCount = Object.keys(this._activeRows).length;
 
-    for (let key in this._activeRows) {
+    for (const key in this._activeRows) {
       if (this._activeRows.hasOwnProperty(key)) {
-        let currentRow = this._activeRows[key];
+        const currentRow = this._activeRows[key];
         currentRow.measureCell(columnIndex, (width: number) => {
           max = Math.max(max, width);
           count++;
@@ -797,12 +798,12 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
    * @param {ev} focus event from Focus Zone
    */
   private _onActiveRowChanged(el?: HTMLElement, ev?: React.FocusEvent<HTMLElement>) {
-    let { items, onActiveItemChanged } = this.props;
+    const { items, onActiveItemChanged } = this.props;
 
     if (!el) {
       return;
     }
-    let index = Number(el.getAttribute('data-item-index'));
+    const index = Number(el.getAttribute('data-item-index'));
     if (index >= 0) {
       if (onActiveItemChanged) {
         onActiveItemChanged(items[index], index, ev);
@@ -847,13 +848,13 @@ export function buildColumns(
   isSortedDescending?: boolean,
   groupedColumnKey?: string,
   isMultiline?: boolean) {
-  let columns: IColumn[] = [];
+  const columns: IColumn[] = [];
 
   if (items && items.length) {
-    let firstItem = items[0];
+    const firstItem = items[0];
     let isFirstColumn = true;
 
-    for (let propName in firstItem) {
+    for (const propName in firstItem) {
       if (firstItem.hasOwnProperty(propName)) {
         columns.push({
           key: propName,
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index c3900ee57e1f5..9e38851d5c7f0 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -105,7 +105,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
   }
 
   public componentDidMount() {
-    let { dragDropHelper } = this.props;
+    const { dragDropHelper } = this.props;
 
     if (dragDropHelper) {
       this._dragDropSubscription = dragDropHelper.subscribe(this._root as HTMLElement, this._events, this._getRowDragDropOptions());
@@ -121,9 +121,9 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
   }
 
   public componentDidUpdate(previousProps: IDetailsRowProps) {
-    let state = this.state;
-    let { item, onDidMount } = this.props;
-    let { columnMeasureInfo } = state;
+    const state = this.state;
+    const { item, onDidMount } = this.props;
+    const { columnMeasureInfo } = state;
 
     if (this.props.itemIndex !== previousProps.itemIndex ||
       this.props.item !== previousProps.item ||
@@ -139,7 +139,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
     }
 
     if (columnMeasureInfo && columnMeasureInfo.index >= 0) {
-      let newWidth = this.refs.cellMeasurer.getBoundingClientRect().width;
+      const newWidth = this.refs.cellMeasurer.getBoundingClientRect().width;
 
       columnMeasureInfo.onMeasureDone(newWidth);
 
@@ -155,7 +155,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
   }
 
   public componentWillUnmount() {
-    let { item, onWillUnmount } = this.props;
+    const { item, onWillUnmount } = this.props;
 
     // Only call the onWillUnmount callback if we have an item.
     if (onWillUnmount && item) {
@@ -297,7 +297,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
    * @param {(width: number) => void} onMeasureDone (the call back function when finish measure)
    */
   public measureCell(index: number, onMeasureDone: (width: number) => void) {
-    let column = assign({}, this.props.columns[index]) as IColumn;
+    const column = assign({}, this.props.columns[index]) as IColumn;
 
     column.minWidth = 0;
     column.maxWidth = 999999;
@@ -322,7 +322,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
   }
 
   private _getSelectionState(props: IDetailsRowProps): IDetailsRowSelectionState {
-    let { itemIndex, selection } = props;
+    const { itemIndex, selection } = props;
 
     return {
       isSelected: selection.isIndexSelected(itemIndex),
@@ -331,7 +331,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
   }
 
   private _onSelectionChanged() {
-    let selectionState = this._getSelectionState(this.props);
+    const selectionState = this._getSelectionState(this.props);
 
     if (!shallowCompare(selectionState, this.state.selectionState)) {
       this.setState({
@@ -363,7 +363,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
       dragDropEvents,
       eventsToRegister
     } = this.props;
-    let options = {
+    const options = {
       eventMap: eventsToRegister,
       selectionIndex: itemIndex,
       context: { data: item, index: itemIndex },
@@ -391,8 +391,8 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
    * @param {DragEvent} event (the event trigger dropping state change which can be dragenter, dragleave etc)
    */
   private _updateDroppingState(newValue: boolean, event: DragEvent) {
-    let { selectionState, isDropping } = this.state;
-    let { dragDropEvents, item } = this.props;
+    const { selectionState, isDropping } = this.state;
+    const { dragDropEvents, item } = this.props;
 
     if (!newValue) {
       if (dragDropEvents!.onDragLeave) {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx
index 4d2610476da2c..49428fe9b3fec 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowCheck.tsx
@@ -33,7 +33,7 @@ export const DetailsRowCheck = (props: IDetailsRowCheckProps) => {
     ...buttonProps
   } = props;
 
-  let isPressed = props.isSelected || props.selected;
+  const isPressed = props.isSelected || props.selected;
 
   return (
     <div
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
index a14d06067951c..1cf78c17c1931 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
@@ -33,8 +33,8 @@ export class DetailsRowFields extends BaseComponent<IDetailsRowFieldsProps, IDet
   }
 
   public render() {
-    let { columns, columnStartIndex } = this.props;
-    let { cellContent } = this.state;
+    const { columns, columnStartIndex } = this.props;
+    const { cellContent } = this.state;
 
     return (
       <div
@@ -65,14 +65,14 @@ export class DetailsRowFields extends BaseComponent<IDetailsRowFieldsProps, IDet
   }
 
   private _getState(props: IDetailsRowFieldsProps) {
-    let { item, itemIndex, onRenderItemColumn } = props;
+    const { item, itemIndex, onRenderItemColumn } = props;
 
     return {
       cellContent: props.columns.map((column) => {
         let cellContent;
 
         try {
-          let render = column.onRender || onRenderItemColumn;
+          const render = column.onRender || onRenderItemColumn;
 
           cellContent = render ? render(item, itemIndex, column) : this._getCellText(item, column);
         } catch (e) { /* no-op */ }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
index b350a86bfbac6..c232112266b74 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
@@ -86,7 +86,7 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
   }
 
   public render() {
-    let {
+    const {
       checkboxVisibility,
       columns,
       constrainMode,
@@ -99,8 +99,8 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
       selectionMode
     } = this.state;
 
-    let isGrouped = groups && groups.length > 0;
-    let groupProps = {
+    const isGrouped = groups && groups.length > 0;
+    const groupProps = {
       getGroupItemLimit: (group: IGroup) => {
         if (group) {
           return group.isShowingAll ? group.count : Math.min(group.count, groupItemLimit as number);
@@ -159,7 +159,7 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
 
       setTimeout(() => {
         this._isFetchingItems = false;
-        let itemsCopy = ([] as any[]).concat(this.state.items);
+        const itemsCopy = ([] as any[]).concat(this.state.items);
 
         itemsCopy.splice.apply(itemsCopy, [index, PAGING_SIZE].concat(_items.slice(index, index + PAGING_SIZE)));
 
@@ -190,7 +190,8 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
 
   @autobind
   private _onToggleResizing() {
-    let { items, canResizeColumns, sortedColumnKey, isSortedDescending } = this.state;
+    const { items, sortedColumnKey, isSortedDescending } = this.state;
+    let { canResizeColumns } = this.state;
 
     canResizeColumns = !canResizeColumns;
 
@@ -233,7 +234,7 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
   }
 
   private _getCommandItems(): IContextualMenuItem[] {
-    let {
+    const {
       canResizeColumns,
       checkboxVisibility,
       constrainMode,
@@ -404,7 +405,7 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
   }
 
   private _getContextualMenuProps(ev: React.MouseEvent<HTMLElement>, column: IColumn): IContextualMenuProps {
-    let items = [
+    const items = [
       {
         key: 'aToZ',
         name: 'A to Z',
@@ -482,7 +483,7 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
 
   @autobind
   private _onSortColumn(key: string, isSortedDescending: boolean) {
-    let sortedItems = _items.slice(0).sort((a: any, b: any) => (isSortedDescending ? a[key] < b[key] : a[key] > b[key]) ? 1 : -1);
+    const sortedItems = _items.slice(0).sort((a: any, b: any) => (isSortedDescending ? a[key] < b[key] : a[key] > b[key]) ? 1 : -1);
 
     this.setState({
       items: sortedItems,
@@ -502,8 +503,8 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
 
   @autobind
   private _onGroupByColumn(column: IColumn) {
-    let { key, isGrouped } = column;
-    let { sortedColumnKey, isSortedDescending, groups, items, columns } = this.state;
+    const { key, isGrouped } = column;
+    const { sortedColumnKey, isSortedDescending, groups, items, columns } = this.state;
 
     if (isGrouped) { // ungroup
       this._onSortColumn(sortedColumnKey as string, !!isSortedDescending);
@@ -518,7 +519,7 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
         newGroups = this._getGroups(groupedItems, key);
       }
 
-      let newColumns = columns as IColumn[];
+      const newColumns = columns as IColumn[];
       newColumns.filter(matchColumn => matchColumn.key === key).forEach((groupedColumn: IColumn) => {
         groupedColumn.isGrouped = true;
       });
@@ -535,11 +536,11 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
     if (groups) {
       groups.forEach((group: IGroup) => {
         if (group.children && group.children.length > 0) {
-          let childGroupedItems = this._groupByKey(group.children, items, key);
+          const childGroupedItems = this._groupByKey(group.children, items, key);
           groupedItems = groupedItems.concat(childGroupedItems);
         } else {
-          let itemsInGroup = items.slice(group.startIndex, group.startIndex + group.count);
-          let nextLevelGroupedItems = this._groupItems(itemsInGroup, key);
+          const itemsInGroup = items.slice(group.startIndex, group.startIndex + group.count);
+          const nextLevelGroupedItems = this._groupItems(itemsInGroup, key);
           groupedItems = groupedItems.concat(nextLevelGroupedItems);
           group.children = this._getGroups(nextLevelGroupedItems, key, group);
         }
@@ -553,9 +554,9 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
   }
 
   private _getGroups(groupedItems: any[], key: string, parentGroup?: IGroup): IGroup[] {
-    let separator = '-';
-    let groups = groupedItems.reduce((current, item, index) => {
-      let currentGroup = current[current.length - 1];
+    const separator = '-';
+    const groups = groupedItems.reduce((current, item, index) => {
+      const currentGroup = current[current.length - 1];
 
       if (!currentGroup || (this._getLeafGroupKey(currentGroup.key, separator) !== item[key])) {
         current.push({
@@ -577,7 +578,7 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
   private _getLeafGroupKey(key: string, separator: string): string {
     let leafKey = key;
     if (key.indexOf(separator) !== -1) {
-      let arrKeys = key.split(separator);
+      const arrKeys = key.split(separator);
       leafKey = arrKeys[arrKeys.length - 1];
     }
     return leafKey;
@@ -605,7 +606,7 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
     isSortedDescending?: boolean,
     groupedColumnKey?: string,
     onColumnContextMenu?: (column: IColumn, ev: React.MouseEvent<HTMLElement>) => any) {
-    let columns = buildColumns(items, canResizeColumns, onColumnClick, sortedColumnKey, isSortedDescending, groupedColumnKey);
+    const columns = buildColumns(items, canResizeColumns, onColumnClick, sortedColumnKey, isSortedDescending, groupedColumnKey);
 
     columns.forEach(column => {
       column.onColumnContextMenu = onColumnContextMenu;
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
index f121a24db1908..593a874f99882 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
@@ -11,9 +11,9 @@ import {
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 
-let _items: any[] = [];
+const _items: any[] = [];
 
-let _columns: IColumn[] = [
+const _columns: IColumn[] = [
   {
     key: 'column1',
     name: 'Name',
@@ -65,7 +65,7 @@ export class DetailsListBasicExample extends React.Component<{}, {
   }
 
   public render() {
-    let { items, selectionDetails } = this.state;
+    const { items, selectionDetails } = this.state;
 
     return (
       <div>
@@ -92,7 +92,7 @@ export class DetailsListBasicExample extends React.Component<{}, {
   }
 
   private _getSelectionDetails(): string {
-    let selectionCount = this._selection.getSelectedCount();
+    const selectionCount = this._selection.getSelectedCount();
 
     switch (selectionCount) {
       case 0:
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Compact.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Compact.Example.tsx
index 26c9b2f1fe04e..b47e35d658b9a 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Compact.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Compact.Example.tsx
@@ -10,13 +10,13 @@ import {
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 
-let _items: {
+const _items: {
   key: number,
   name: string,
   value: number
 }[] = [];
 
-let _columns = [
+const _columns = [
   {
     key: 'column1',
     name: 'Name',
@@ -66,7 +66,7 @@ export class DetailsListCompactExample extends React.Component<{}, {
   }
 
   public render() {
-    let { items, selectionDetails } = this.state;
+    const { items, selectionDetails } = this.state;
 
     return (
       <div>
@@ -92,7 +92,7 @@ export class DetailsListCompactExample extends React.Component<{}, {
   }
 
   private _getSelectionDetails(): string {
-    let selectionCount = this._selection.getSelectedCount();
+    const selectionCount = this._selection.getSelectedCount();
 
     switch (selectionCount) {
       case 0:
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
index a798064e9bdc6..ad411d2bca048 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
@@ -32,7 +32,7 @@ export class DetailsListCustomColumnsExample extends React.Component<{}, IDetail
   }
 
   public render() {
-    let { sortedItems, columns } = this.state;
+    const { sortedItems, columns } = this.state;
 
     return (
       <DetailsList
@@ -49,7 +49,8 @@ export class DetailsListCustomColumnsExample extends React.Component<{}, IDetail
 
   @autobind
   private _onColumnClick(event: React.MouseEvent<HTMLElement>, column: IColumn) {
-    let { sortedItems, columns } = this.state;
+    const { columns } = this.state;
+    let { sortedItems } = this.state;
     let isSortedDescending = column.isSortedDescending;
 
     // If we've sorted this column, flip it.
@@ -59,8 +60,8 @@ export class DetailsListCustomColumnsExample extends React.Component<{}, IDetail
 
     // Sort the items.
     sortedItems = sortedItems!.concat([]).sort((a, b) => {
-      let firstValue = a[column.fieldName];
-      let secondValue = b[column.fieldName];
+      const firstValue = a[column.fieldName];
+      const secondValue = b[column.fieldName];
 
       if (isSortedDescending) {
         return firstValue > secondValue ? -1 : 1;
@@ -94,9 +95,9 @@ export class DetailsListCustomColumnsExample extends React.Component<{}, IDetail
 }
 
 function _buildColumns() {
-  let columns = buildColumns(_items);
+  const columns = buildColumns(_items);
 
-  let thumbnailColumn = columns.filter(column => column.name === 'thumbnail')[0];
+  const thumbnailColumn = columns.filter(column => column.name === 'thumbnail')[0];
 
   // Special case one column's definition.
   thumbnailColumn.name = '';
@@ -106,7 +107,7 @@ function _buildColumns() {
 }
 
 function _renderItemColumn(item: any, index: number, column: IColumn) {
-  let fieldContent = item[column.fieldName];
+  const fieldContent = item[column.fieldName];
 
   switch (column.key) {
     case 'thumbnail':
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
index 051671e1bce06..3be99fc94d1d3 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
@@ -204,7 +204,7 @@ export class DetailsListDocumentsExample extends React.Component<any, IDetailsLi
   }
 
   public render() {
-    let { columns, isCompactMode, items, selectionDetails } = this.state;
+    const { columns, isCompactMode, items, selectionDetails } = this.state;
 
     return (
       <div>
@@ -297,7 +297,7 @@ export class DetailsListDocumentsExample extends React.Component<any, IDetailsLi
   }
 
   private _getSelectionDetails(): string {
-    let selectionCount = this._selection.getSelectedCount();
+    const selectionCount = this._selection.getSelectedCount();
 
     switch (selectionCount) {
       case 0:
@@ -313,8 +313,8 @@ export class DetailsListDocumentsExample extends React.Component<any, IDetailsLi
   private _onColumnClick(ev: React.MouseEvent<HTMLElement>, column: IColumn) {
     const { columns, items } = this.state;
     let newItems: IDocument[] = items.slice();
-    let newColumns: IColumn[] = columns.slice();
-    let currColumn: IColumn = newColumns.filter((currCol: IColumn, idx: number) => {
+    const newColumns: IColumn[] = columns.slice();
+    const currColumn: IColumn = newColumns.filter((currCol: IColumn, idx: number) => {
       return column.key === currCol.key;
     })[0];
     newColumns.forEach((newCol: IColumn) => {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx
index 71ae50aadd449..1322754b5bd7d 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx
@@ -34,7 +34,7 @@ export class DetailsListDragDropExample extends React.Component<{}, {
   }
 
   public render() {
-    let { items, selectionDetails } = this.state;
+    const { items, selectionDetails } = this.state;
 
     return (
       <div className='detailsListDragDropExample'>
@@ -89,9 +89,9 @@ export class DetailsListDragDropExample extends React.Component<{}, {
   }
 
   private _insertBeforeItem(item: any) {
-    let draggedItems = this._selection.isIndexSelected(_draggedIndex) ? this._selection.getSelection() : [_draggedItem];
+    const draggedItems = this._selection.isIndexSelected(_draggedIndex) ? this._selection.getSelection() : [_draggedItem];
 
-    let items: any[] = this.state.items.filter((i: number) => draggedItems.indexOf(i) === -1);
+    const items: any[] = this.state.items.filter((i: number) => draggedItems.indexOf(i) === -1);
     let insertIndex = items.indexOf(item);
 
     // if dragging/dropping on itself, index will be 0.
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
index c68af796cf07e..4bd594fa936f1 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
@@ -5,7 +5,7 @@ import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
 import { DetailsList } from 'office-ui-fabric-react/lib/DetailsList';
 
-let _columns = [
+const _columns = [
   {
     key: 'name',
     name: 'Name',
@@ -22,7 +22,7 @@ let _columns = [
     maxWidth: 200
   }
 ];
-let _items = [
+const _items = [
   {
     key: 'a',
     name: 'a',
@@ -62,7 +62,7 @@ export class DetailsListGroupedExample extends React.Component<{}, {
   }
 
   public render() {
-    let { items } = this.state;
+    const { items } = this.state;
 
     return (
       <Fabric className='foo'>
@@ -104,7 +104,7 @@ export class DetailsListGroupedExample extends React.Component<{}, {
   }
 
   private _addItem() {
-    let items = this.state.items;
+    const items = this.state.items;
 
     this.setState({
       items: items.concat([{
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
index 03ba9f6bdd4c0..5c2e5ac89d2b0 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
@@ -14,7 +14,7 @@ import { DialogType } from './DialogContent.types';
 describe('Dialog', () => {
   it('renders Dialog correctly', () => {
     const component = renderer.create(<DialogContent />);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
index 3e5f14f800c77..c1df330949100 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
@@ -59,7 +59,7 @@ export class Dialog extends BaseComponent<IDialogProps, {}> {
   }
 
   public render() {
-    let {
+    const {
       elementToFocusOnDismiss,
       firstFocusableSelector,
       forceFocusInsideTrap,
@@ -123,7 +123,7 @@ export class Dialog extends BaseComponent<IDialogProps, {}> {
   }
 
   private _getSubTextId = (): string | undefined => {
-    let { ariaDescribedById, modalProps, dialogContentProps, subText } = this.props;
+    const { ariaDescribedById, modalProps, dialogContentProps, subText } = this.props;
     let id = ariaDescribedById || (modalProps && modalProps.subtitleAriaId);
 
     if (!id) {
@@ -134,7 +134,7 @@ export class Dialog extends BaseComponent<IDialogProps, {}> {
   }
 
   private _getTitleTextId = (): string | undefined => {
-    let { ariaLabelledById, modalProps, dialogContentProps, title } = this.props;
+    const { ariaLabelledById, modalProps, dialogContentProps, title } = this.props;
     let id = ariaLabelledById || (modalProps && modalProps.titleAriaId);
 
     if (!id) {
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx
index 321c696b7f7f4..59aa872b81f14 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx
@@ -25,7 +25,7 @@ export class DialogContent extends BaseComponent<IDialogContentProps, {}> {
   }
 
   public render() {
-    let {
+    const {
       showCloseButton,
       closeButtonAriaLabel,
       onDismiss,
@@ -36,7 +36,7 @@ export class DialogContent extends BaseComponent<IDialogContentProps, {}> {
       type
     } = this.props;
 
-    let groupings = this._groupChildren();
+    const groupings = this._groupChildren();
     let subTextContent;
     if (subText) {
       subTextContent = <p className={ css('ms-Dialog-subText', styles.subText) } id={ subTextId }>{ subText }</p>;
@@ -84,7 +84,7 @@ export class DialogContent extends BaseComponent<IDialogContentProps, {}> {
   // "Neither type 'ReactElement<any>' nor type 'DialogFooter' is assignable to the other."
   private _groupChildren(): { footers: any[]; contents: any[]; } {
 
-    let groupings: { footers: any[]; contents: any[]; } = {
+    const groupings: { footers: any[]; contents: any[]; } = {
       footers: [],
       contents: []
     };
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.test.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.test.tsx
index 391ba31a71bf3..b8955e180c98b 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.test.tsx
@@ -23,7 +23,7 @@ describe('DocumentCard', () => {
           }
         />
       </DocumentCard>);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx
index dd381c1aa22ca..f04eaa7838f4a 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx
@@ -23,8 +23,8 @@ export class DocumentCard extends BaseComponent<IDocumentCardProps, any> {
   }
 
   public render() {
-    let { onClick, onClickHref, children, className, type, accentColor } = this.props;
-    let actionable = (onClick || onClickHref) ? true : false;
+    const { onClick, onClickHref, children, className, type, accentColor } = this.props;
+    const actionable = (onClick || onClickHref) ? true : false;
 
     // Override the border color if an accent color was provided (compact card only)
     let style;
@@ -35,8 +35,8 @@ export class DocumentCard extends BaseComponent<IDocumentCardProps, any> {
     }
 
     // if this element is actionable it should have an aria role
-    let role = actionable ? (onClick ? 'button' : 'link') : undefined;
-    let tabIndex = actionable ? 0 : undefined;
+    const role = actionable ? (onClick ? 'button' : 'link') : undefined;
+    const tabIndex = actionable ? 0 : undefined;
 
     return (
       <div
@@ -76,7 +76,7 @@ export class DocumentCard extends BaseComponent<IDocumentCardProps, any> {
 
   @autobind
   private _onAction(ev: React.SyntheticEvent<HTMLElement>): void {
-    let { onClick, onClickHref } = this.props;
+    const { onClick, onClickHref } = this.props;
 
     if (onClick) {
       onClick(ev);
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActions.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActions.tsx
index 16358ba7505bb..73957cd5537eb 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActions.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActions.tsx
@@ -8,7 +8,7 @@ const styles: any = stylesImport;
 
 export class DocumentCardActions extends BaseComponent<IDocumentCardActionsProps, any> {
   public render() {
-    let { actions, views } = this.props;
+    const { actions, views } = this.props;
 
     return (
       <div className={ css('ms-DocumentCardActions', styles.actions) }>
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx
index c2ac7856ff5fa..4f08c7dae8db2 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardActivity.tsx
@@ -8,7 +8,7 @@ const styles: any = stylesImport;
 
 export class DocumentCardActivity extends BaseComponent<IDocumentCardActivityProps, any> {
   public render() {
-    let { activity, people } = this.props;
+    const { activity, people } = this.props;
 
     return (
       people && people.length > 0 &&
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardLocation.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardLocation.tsx
index edf27091ab815..bc6fff48f1906 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardLocation.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardLocation.tsx
@@ -6,7 +6,7 @@ const styles: any = stylesImport;
 
 export class DocumentCardLocation extends BaseComponent<IDocumentCardLocationProps, any> {
   public render() {
-    let { location, locationHref, ariaLabel, onClick } = this.props;
+    const { location, locationHref, ariaLabel, onClick } = this.props;
 
     return (
       <a
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx
index 98d4bda776f02..cf725198238f5 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx
@@ -14,7 +14,7 @@ const LIST_ITEM_COUNT = 3;
 
 export class DocumentCardPreview extends BaseComponent<IDocumentCardPreviewProps, any> {
   public render() {
-    let { previewImages } = this.props;
+    const { previewImages } = this.props;
     let style, preview;
     let isFileList = false;
 
@@ -45,7 +45,7 @@ export class DocumentCardPreview extends BaseComponent<IDocumentCardPreviewProps
   }
 
   private _renderPreviewImage(previewImage: IDocumentCardPreviewImage): React.ReactElement<React.HTMLAttributes<HTMLDivElement>> {
-    let { width, height, imageFit, previewIconProps } = previewImage;
+    const { width, height, imageFit, previewIconProps } = previewImage;
 
     if (previewIconProps) {
       return (
@@ -55,7 +55,7 @@ export class DocumentCardPreview extends BaseComponent<IDocumentCardPreviewProps
       );
     }
 
-    let image = (
+    const image = (
       <Image
         width={ width }
         height={ height }
@@ -81,19 +81,19 @@ export class DocumentCardPreview extends BaseComponent<IDocumentCardPreviewProps
 
   @autobind
   private _renderPreviewList(previewImages: IDocumentCardPreviewImage[]): React.ReactElement<React.HTMLAttributes<HTMLDivElement>> {
-    let { getOverflowDocumentCountText } = this.props;
+    const { getOverflowDocumentCountText } = this.props;
 
     // Determine how many documents we won't be showing
-    let overflowDocumentCount = previewImages.length - LIST_ITEM_COUNT;
+    const overflowDocumentCount = previewImages.length - LIST_ITEM_COUNT;
 
     // Determine the overflow text that will be rendered after the preview list.
-    let overflowText = overflowDocumentCount ?
+    const overflowText = overflowDocumentCount ?
       (getOverflowDocumentCountText ?
         getOverflowDocumentCountText(overflowDocumentCount) :
         '+' + overflowDocumentCount) : null;
 
     // Create list items for the documents to be shown
-    let fileListItems = previewImages.slice(0, LIST_ITEM_COUNT).map((file, fileIndex) => (
+    const fileListItems = previewImages.slice(0, LIST_ITEM_COUNT).map((file, fileIndex) => (
       <li key={ fileIndex }>
         <Image
           className={ css('ms-DocumentCardPreview-fileListIcon', styles.fileListIcon) }
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx
index a541d4294dd06..0a970d3eed25e 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx
@@ -38,7 +38,7 @@ export class DocumentCardTitle extends BaseComponent<IDocumentCardTitleProps, ID
   }
 
   public componentDidMount() {
-    let { title, shouldTruncate } = this.props;
+    const { title, shouldTruncate } = this.props;
     if (shouldTruncate && title && title.length > TRUNCATION_MINIMUM_LENGTH) {
       if (this._doesTitleOverflow()) {
         this._startTruncation(this.props);
@@ -65,8 +65,8 @@ export class DocumentCardTitle extends BaseComponent<IDocumentCardTitleProps, ID
   }
 
   public render() {
-    let { title, shouldTruncate } = this.props;
-    let { truncatedTitleFirstPiece, truncatedTitleSecondPiece } = this.state;
+    const { title, shouldTruncate } = this.props;
+    const { truncatedTitleFirstPiece, truncatedTitleSecondPiece } = this.state;
 
     let documentCardTitle;
     if (shouldTruncate && this._isTruncated) {
@@ -84,7 +84,7 @@ export class DocumentCardTitle extends BaseComponent<IDocumentCardTitleProps, ID
 
   @autobind
   private _startTruncation(props: IDocumentCardTitleProps) {
-    let originalTitle = props.title;
+    const originalTitle = props.title;
     this._isTruncated = false;
 
     // If the title is really short, there's no need to truncate it
@@ -114,7 +114,7 @@ export class DocumentCardTitle extends BaseComponent<IDocumentCardTitleProps, ID
 
   private _shrinkTitle() {
     if (this._doesTitleOverflow()) {
-      let { truncatedTitleFirstPiece, truncatedTitleSecondPiece } = this.state;
+      const { truncatedTitleFirstPiece, truncatedTitleSecondPiece } = this.state;
       this._isTruncated = true;
 
       if (!truncatedTitleFirstPiece && !truncatedTitleSecondPiece) {
@@ -129,7 +129,7 @@ export class DocumentCardTitle extends BaseComponent<IDocumentCardTitleProps, ID
   }
 
   private _doesTitleOverflow(): boolean {
-    let titleElement = this._titleElement;
+    const titleElement = this._titleElement;
     return titleElement.scrollHeight > titleElement.clientHeight + TRUNCATION_VERTICAL_OVERFLOW_THRESHOLD || titleElement.scrollWidth > titleElement.clientWidth;
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Basic.Example.tsx
index d22f0d18d04c6..64216d54d58d2 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Basic.Example.tsx
@@ -12,7 +12,7 @@ import './DocumentCard.Example.scss';
 
 export class DocumentCardBasicExample extends React.Component<any, any> {
   public render() {
-    let previewProps: IDocumentCardPreviewProps = {
+    const previewProps: IDocumentCardPreviewProps = {
       previewImages: [
         {
           name: 'Revenue stream proposal fiscal year 2016 version02.pptx',
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Compact.Example.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Compact.Example.tsx
index 63669e4b000ac..2645db4b70d70 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Compact.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Compact.Example.tsx
@@ -11,7 +11,7 @@ import { TestImages } from '../../../common/TestImages';
 
 export class DocumentCardCompactExample extends React.Component<any, any> {
   public render() {
-    let previewProps: IDocumentCardPreviewProps = {
+    const previewProps: IDocumentCardPreviewProps = {
       getOverflowDocumentCountText: (overflowCount: number) => `+${overflowCount} more`,
       previewImages: [
         {
@@ -45,7 +45,7 @@ export class DocumentCardCompactExample extends React.Component<any, any> {
       ],
     };
 
-    let previewPropsUsingIcon: IDocumentCardPreviewProps = {
+    const previewPropsUsingIcon: IDocumentCardPreviewProps = {
       previewImages: [
         {
           previewIconProps: { iconName: 'OpenFile', styles: { root: { fontSize: 42, color: '#ffffff' } } },
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx
index 9d178ba8166b5..73b2356cb87f6 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx
@@ -13,7 +13,7 @@ import { TestImages } from '../../../common/TestImages';
 
 export class DocumentCardCompleteExample extends React.Component<any, any> {
   public render() {
-    let previewProps: IDocumentCardPreviewProps = {
+    const previewProps: IDocumentCardPreviewProps = {
       getOverflowDocumentCountText: (overflowCount: number) => `+${overflowCount} more`,
       previewImages: [
         {
@@ -74,7 +74,7 @@ export class DocumentCardCompleteExample extends React.Component<any, any> {
 
     };
 
-    let previewPropsUsingIcon: IDocumentCardPreviewProps = {
+    const previewPropsUsingIcon: IDocumentCardPreviewProps = {
       previewImages: [
         {
           previewIconProps: { iconName: 'OpenFile', styles: { root: { fontSize: 42, color: '#ffffff' } } },
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
index 57b2001e3b1f8..9b54c8982a152 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
@@ -30,20 +30,20 @@ describe('Dropdown', () => {
 
     it('Renders single-select Dropdown correctly', () => {
       const component = renderer.create(<Dropdown options={ DEFAULT_OPTIONS } />);
-      let tree = component.toJSON();
+      const tree = component.toJSON();
       expect(tree).toMatchSnapshot();
     });
 
     it('Can flip between enabled and disabled.', () => {
 
-      let container = document.createElement('div');
+      const container = document.createElement('div');
       ReactDOM.render(
         <Dropdown
           label='testgroup'
           options={ DEFAULT_OPTIONS }
         />,
         container);
-      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      const dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
 
       expect(dropdownRoot.className).not.toEqual(expect.stringMatching('is-disabled'));
       expect(dropdownRoot.getAttribute('data-is-focusable')).toEqual('true');
@@ -61,7 +61,7 @@ describe('Dropdown', () => {
     });
 
     it('Renders no selected item in default case', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
 
       ReactDOM.render(
         <Dropdown
@@ -69,14 +69,14 @@ describe('Dropdown', () => {
           options={ DEFAULT_OPTIONS }
         />,
         container);
-      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      const dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      const titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
       expect(titleElement.textContent).toEqual('');
     });
 
     it('Renders a selected item if option specifies selected', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
 
       ReactDOM.render(
         <Dropdown
@@ -84,14 +84,14 @@ describe('Dropdown', () => {
           options={ [{ key: '1', text: '1', selected: true }, { key: '2', text: '2' },] }
         />,
         container);
-      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      const dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      const titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
       expect(titleElement.textContent).toEqual('1');
     });
 
     it('Renders a selected item in uncontrolled case', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
 
       ReactDOM.render(
         <Dropdown
@@ -100,14 +100,14 @@ describe('Dropdown', () => {
           options={ DEFAULT_OPTIONS }
         />,
         container);
-      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      const dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      const titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
       expect(titleElement.textContent).toEqual('1');
     });
 
     it('does not change the selected item in when defaultKey changes', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
 
       ReactDOM.render(
         <Dropdown
@@ -116,8 +116,8 @@ describe('Dropdown', () => {
           options={ DEFAULT_OPTIONS }
         />,
         container);
-      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      const dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      const titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
       expect(titleElement.textContent).toEqual('1');
 
@@ -132,7 +132,7 @@ describe('Dropdown', () => {
     });
 
     it('Renders a selected item in controlled case', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
 
       ReactDOM.render(
         <Dropdown
@@ -141,14 +141,14 @@ describe('Dropdown', () => {
           options={ DEFAULT_OPTIONS }
         />,
         container);
-      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      const dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      const titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
       expect(titleElement.textContent).toEqual('1');
     });
 
     it('does change the selected item in when selectedKey changes', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
 
       ReactDOM.render(
         <Dropdown
@@ -157,8 +157,8 @@ describe('Dropdown', () => {
           options={ DEFAULT_OPTIONS }
         />,
         container);
-      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      const dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      const titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
       expect(titleElement.textContent).toEqual('1');
 
@@ -173,7 +173,7 @@ describe('Dropdown', () => {
     });
 
     it('Can change items in uncontrolled case', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
       let dropdownRoot: HTMLElement | undefined;
 
       document.body.appendChild(container);
@@ -190,7 +190,7 @@ describe('Dropdown', () => {
 
         ReactTestUtils.Simulate.click(dropdownRoot);
 
-        let secondItemElement = document.querySelector('.ms-Dropdown-item[data-index="2"]') as HTMLElement;
+        const secondItemElement = document.querySelector('.ms-Dropdown-item[data-index="2"]') as HTMLElement;
         ReactTestUtils.Simulate.click(secondItemElement);
       }
       finally {
@@ -199,12 +199,12 @@ describe('Dropdown', () => {
     });
 
     it('issues the onChanged callback when the selected item is different', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
       let dropdownRoot: HTMLElement | undefined;
 
       document.body.appendChild(container);
 
-      let onChangedSpy = jasmine.createSpy('onChanged');
+      const onChangedSpy = jasmine.createSpy('onChanged');
 
       try {
         ReactDOM.render(
@@ -219,7 +219,7 @@ describe('Dropdown', () => {
 
         ReactTestUtils.Simulate.click(dropdownRoot);
 
-        let secondItemElement = document.querySelector('.ms-Dropdown-item[data-index="2"]') as HTMLElement;
+        const secondItemElement = document.querySelector('.ms-Dropdown-item[data-index="2"]') as HTMLElement;
         ReactTestUtils.Simulate.click(secondItemElement);
       }
       finally {
@@ -228,12 +228,12 @@ describe('Dropdown', () => {
     });
 
     it('issues the onDismiss callback when dismissing options callout', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
       let dropdownRoot: HTMLElement | undefined;
 
       document.body.appendChild(container);
 
-      let onDismissSpy = jasmine.createSpy('onDismiss');
+      const onDismissSpy = jasmine.createSpy('onDismiss');
 
       try {
         ReactDOM.render(
@@ -248,7 +248,7 @@ describe('Dropdown', () => {
 
         ReactTestUtils.Simulate.click(dropdownRoot);
 
-        let secondItemElement = document.querySelector('.ms-Dropdown-item[data-index="2"]') as HTMLElement;
+        const secondItemElement = document.querySelector('.ms-Dropdown-item[data-index="2"]') as HTMLElement;
         ReactTestUtils.Simulate.click(secondItemElement);
       }
       finally {
@@ -278,12 +278,12 @@ describe('Dropdown', () => {
     });
 
     it('issues the onChanged callback when the selected item is different', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
       let dropdownRoot: HTMLElement | undefined;
 
       document.body.appendChild(container);
 
-      let onChangedSpy = jasmine.createSpy('onChanged');
+      const onChangedSpy = jasmine.createSpy('onChanged');
 
       try {
         ReactDOM.render(
@@ -298,7 +298,7 @@ describe('Dropdown', () => {
 
         ReactTestUtils.Simulate.click(dropdownRoot);
 
-        let secondItemElement = document.querySelector('.ms-Dropdown-item[data-index="1"]') as HTMLElement;
+        const secondItemElement = document.querySelector('.ms-Dropdown-item[data-index="1"]') as HTMLElement;
         ReactTestUtils.Simulate.click(secondItemElement);
       }
       finally {
@@ -307,7 +307,7 @@ describe('Dropdown', () => {
     });
 
     it('Will select the first valid item on keypress', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
 
       ReactDOM.render(
         <Dropdown
@@ -315,15 +315,15 @@ describe('Dropdown', () => {
           options={ DEFAULT_OPTIONS }
         />,
         container);
-      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      const dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
       ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
 
-      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      const titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
       expect(titleElement.textContent).toEqual('1');
     });
 
     it('Will select the first valid item on Home keypress', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
 
       ReactDOM.render(
         <Dropdown
@@ -331,15 +331,15 @@ describe('Dropdown', () => {
           options={ DEFAULT_OPTIONS }
         />,
         container);
-      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      const dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
       ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.home });
 
-      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      const titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
       expect(titleElement.textContent).toEqual('1');
     });
 
     it('Will select the last valid item on End keypress', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
 
       ReactDOM.render(
         <Dropdown
@@ -347,15 +347,15 @@ describe('Dropdown', () => {
           options={ DEFAULT_OPTIONS }
         />,
         container);
-      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      const dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
       ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.end });
 
-      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      const titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
       expect(titleElement.textContent).toEqual('6');
     });
 
     it('Will skip over headers and separators on keypress', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
       let dropdownRoot;
       let titleElement;
 
@@ -387,12 +387,12 @@ describe('Dropdown', () => {
           options={ DEFAULT_OPTIONS }
           multiSelect
         />);
-      let tree = component.toJSON();
+      const tree = component.toJSON();
       expect(tree).toMatchSnapshot();
     });
 
     it('Renders no selected item in default case', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
 
       ReactDOM.render(
         <Dropdown
@@ -401,14 +401,14 @@ describe('Dropdown', () => {
           multiSelect
         />,
         container);
-      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      const dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      const titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
       expect(titleElement.textContent).toEqual('');
     });
 
     it('Renders a selected item if option specifies selected', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
 
       ReactDOM.render(
         <Dropdown
@@ -417,8 +417,8 @@ describe('Dropdown', () => {
           multiSelect
         />,
         container);
-      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      const dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      const titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
       expect(titleElement.textContent).toEqual('1');
     });
@@ -446,7 +446,7 @@ describe('Dropdown', () => {
     });
 
     it('Renders multiple selected items if multiple options specify selected', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
 
       ReactDOM.render(
         <Dropdown
@@ -455,14 +455,14 @@ describe('Dropdown', () => {
           multiSelect
         />,
         container);
-      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      const dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      const titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
       expect(titleElement.textContent).toEqual('1, 2');
     });
 
     it('Renders a selected item in uncontrolled case', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
 
       ReactDOM.render(
         <Dropdown
@@ -472,14 +472,14 @@ describe('Dropdown', () => {
           options={ DEFAULT_OPTIONS }
         />,
         container);
-      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      const dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      const titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
       expect(titleElement.textContent).toEqual('1, 2');
     });
 
     it('does not change the selected items when defaultSelectedKeys changes', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
 
       ReactDOM.render(
         <Dropdown
@@ -489,8 +489,8 @@ describe('Dropdown', () => {
           options={ DEFAULT_OPTIONS }
         />,
         container);
-      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      const dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      const titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
       expect(titleElement.textContent).toEqual('1, 2');
 
@@ -507,7 +507,7 @@ describe('Dropdown', () => {
     });
 
     it('Renders selected items in controlled case', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
 
       ReactDOM.render(
         <Dropdown
@@ -517,14 +517,14 @@ describe('Dropdown', () => {
           options={ DEFAULT_OPTIONS }
         />,
         container);
-      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      const dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      const titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
       expect(titleElement.textContent).toEqual('1, 3');
     });
 
     it('changes selected items in controlled case', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
 
       ReactDOM.render(
         <Dropdown
@@ -534,8 +534,8 @@ describe('Dropdown', () => {
           options={ DEFAULT_OPTIONS }
         />,
         container);
-      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
-      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      const dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      const titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
 
       expect(titleElement.textContent).toEqual('1, 3');
 
@@ -551,7 +551,7 @@ describe('Dropdown', () => {
     });
 
     it('Can change items in uncontrolled case', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
       let dropdownRoot: HTMLElement | undefined;
 
       document.body.appendChild(container);
@@ -570,7 +570,7 @@ describe('Dropdown', () => {
 
         ReactTestUtils.Simulate.click(dropdownRoot);
 
-        let secondItemElement = document.querySelectorAll('.ms-Dropdown-item[role="checkbox"]')[1] as HTMLElement;
+        const secondItemElement = document.querySelectorAll('.ms-Dropdown-item[role="checkbox"]')[1] as HTMLElement;
         ReactTestUtils.Simulate.click(secondItemElement);
       }
       finally {
@@ -582,12 +582,12 @@ describe('Dropdown', () => {
     // I'm not sure why these two tests fail. I've manually verified the scenario, even manually through programatic clicks, but these
     // tests simply won't pass
     it('issues the onChanged callback when selecting an item', () => {
-      let container = document.createElement('div');
-      let dropdownRoot: HTMLElement | undefined;
+      const container = document.createElement('div');
+      const dropdownRoot: HTMLElement | undefined;
 
       document.body.appendChild(container);
 
-      let onChangedSpy = jasmine.createSpy('onChanged');
+      const onChangedSpy = jasmine.createSpy('onChanged');
 
       try {
         ReactDOM.render(
@@ -603,7 +603,7 @@ describe('Dropdown', () => {
 
         ReactTestUtils.Simulate.click(dropdownRoot);
 
-        let secondItemElement = document.querySelectorAll('.ms-Dropdown-item[role="checkbox"]')[1] as HTMLElement;
+        const secondItemElement = document.querySelectorAll('.ms-Dropdown-item[role="checkbox"]')[1] as HTMLElement;
         ReactTestUtils.Simulate.click(secondItemElement);
       }
       finally {
@@ -612,12 +612,12 @@ describe('Dropdown', () => {
     });
 
     it('issues the onChanged callback when unselecting an item', () => {
-      let container = document.createElement('div');
-      let dropdownRoot: HTMLElement | undefined;
+      const container = document.createElement('div');
+      const dropdownRoot: HTMLElement | undefined;
 
       document.body.appendChild(container);
 
-      let onChangedSpy = jasmine.createSpy('onChanged');
+      const onChangedSpy = jasmine.createSpy('onChanged');
 
       try {
         ReactDOM.render(
@@ -633,7 +633,7 @@ describe('Dropdown', () => {
 
         ReactTestUtils.Simulate.click(dropdownRoot);
 
-        let firstItemElement = document.querySelectorAll('.ms-Dropdown-item[role="checkbox"]')[0] as HTMLElement;
+        const firstItemElement = document.querySelectorAll('.ms-Dropdown-item[role="checkbox"]')[0] as HTMLElement;
         ReactTestUtils.Simulate.click(firstItemElement);
       }
       finally {
@@ -643,7 +643,7 @@ describe('Dropdown', () => {
     */
 
     it('Will not select the first valid item on keypress', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
 
       ReactDOM.render(
         <Dropdown
@@ -652,15 +652,15 @@ describe('Dropdown', () => {
           multiSelect
         />,
         container);
-      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      const dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
       ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.down });
 
-      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      const titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
       expect(titleElement.textContent).toEqual('');
     });
 
     it('Will not select the first valid item on Home keypress', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
 
       ReactDOM.render(
         <Dropdown
@@ -669,15 +669,15 @@ describe('Dropdown', () => {
           multiSelect
         />,
         container);
-      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      const dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
       ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.home });
 
-      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      const titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
       expect(titleElement.textContent).toEqual('');
     });
 
     it('Will not select the last valid item on End keypress', () => {
-      let container = document.createElement('div');
+      const container = document.createElement('div');
 
       ReactDOM.render(
         <Dropdown
@@ -686,10 +686,10 @@ describe('Dropdown', () => {
           multiSelect
         />,
         container);
-      let dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
+      const dropdownRoot = container.querySelector('.ms-Dropdown') as HTMLElement;
       ReactTestUtils.Simulate.keyDown(dropdownRoot, { which: KeyCodes.end });
 
-      let titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
+      const titleElement = dropdownRoot.querySelector('.ms-Dropdown-title') as HTMLElement;
       expect(titleElement.textContent).toEqual('');
     });
 
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 097988c063f55..24a041f7d1d8b 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -86,12 +86,12 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
       isOpen: false
     };
     if (this.props.multiSelect) {
-      let selectedKeys = props.defaultSelectedKeys !== undefined ? props.defaultSelectedKeys : props.selectedKeys;
+      const selectedKeys = props.defaultSelectedKeys !== undefined ? props.defaultSelectedKeys : props.selectedKeys;
       this.state = {
         selectedIndices: this._getSelectedIndexes(props.options, selectedKeys)
       };
     } else {
-      let selectedKey = props.defaultSelectedKey !== undefined ? props.defaultSelectedKey : props.selectedKey;
+      const selectedKey = props.defaultSelectedKey !== undefined ? props.defaultSelectedKey : props.selectedKey;
       this.state = {
         selectedIndices: this._getSelectedIndexes(props.options, selectedKey!)
       };
@@ -102,7 +102,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   public componentWillReceiveProps(newProps: IDropdownProps) {
     // In controlled component usage where selectedKey is provided, update the selectedIndex
     // state if the key or options change.
-    let selectedKeyProp: keyof IDropdownProps = this.props.multiSelect ? 'selectedKeys' : 'selectedKey';
+    const selectedKeyProp: keyof IDropdownProps = this.props.multiSelect ? 'selectedKeys' : 'selectedKey';
     if (newProps[selectedKeyProp] !== undefined &&
       (newProps[selectedKeyProp] !== this.props[selectedKeyProp] || newProps.options !== this.props.options)) {
       this.setState({
@@ -123,12 +123,14 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
 
   // Primary Render
   public render() {
-    let id = this._id;
+    const id = this._id;
     let {
+      disabled
+    } = this.props;
+    const {
       className,
       label,
       options,
-      disabled,
       isDisabled,
       ariaLabel,
       required,
@@ -138,9 +140,9 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
       onRenderPlaceHolder = this._onRenderPlaceHolder,
       onRenderCaretDown = this._onRenderCaretDown
     } = this.props;
-    let { isOpen, selectedIndices = [] } = this.state;
-    let selectedOptions = this._getAllSelectedOptions(options, selectedIndices);
-    let divProps = getNativeProps(this.props, divProperties);
+    const { isOpen, selectedIndices = [] } = this.state;
+    const selectedOptions = this._getAllSelectedOptions(options, selectedIndices);
+    const divProps = getNativeProps(this.props, divProperties);
 
     // Remove this deprecation workaround at 1.0.0
     if (isDisabled !== undefined) {
@@ -230,9 +232,9 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   public setSelectedIndex(index: number) {
-    let { onChanged, options, selectedKey, selectedKeys, multiSelect } = this.props;
-    let { selectedIndices = [] } = this.state;
-    let checked: boolean = selectedIndices ? selectedIndices.indexOf(index) > -1 : false;
+    const { onChanged, options, selectedKey, selectedKeys, multiSelect } = this.props;
+    const { selectedIndices = [] } = this.state;
+    const checked: boolean = selectedIndices ? selectedIndices.indexOf(index) > -1 : false;
 
     index = Math.max(0, Math.min(options.length - 1, index));
 
@@ -244,9 +246,9 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
         selectedIndices: [index]
       });
     } else if (multiSelect && selectedKeys === undefined) {
-      let newIndexes = selectedIndices ? this._copyArray(selectedIndices) : [];
+      const newIndexes = selectedIndices ? this._copyArray(selectedIndices) : [];
       if (checked) {
-        let position = newIndexes.indexOf(index);
+        const position = newIndexes.indexOf(index);
         if (position > -1) {
           // unchecked the current one
           newIndexes.splice(position, 1);
@@ -263,14 +265,14 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     if (onChanged) {
       // for single-select, option passed in will always be selected.
       // for multi-select, flip the checked value
-      let changedOpt = multiSelect ? { ...options[index], selected: !checked } : options[index];
+      const changedOpt = multiSelect ? { ...options[index], selected: !checked } : options[index];
       onChanged(changedOpt, index);
     }
   }
 
   private _copyArray(array: any[]): any[] {
-    let newArray = [];
-    for (let element of array) {
+    const newArray = [];
+    for (const element of array) {
       newArray.push(element);
     }
     return newArray;
@@ -323,9 +325,9 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   // Render text in dropdown input
   @autobind
   private _onRenderTitle(item: IDropdownOption[]): JSX.Element {
-    let { multiSelectDelimiter = ', ' } = this.props;
+    const { multiSelectDelimiter = ', ' } = this.props;
 
-    let displayTxt = item.map(i => i.text).join(multiSelectDelimiter);
+    const displayTxt = item.map(i => i.text).join(multiSelectDelimiter);
     return <span>{ displayTxt }</span>;
   }
 
@@ -341,14 +343,14 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   // Render Callout or Panel container and pass in list
   @autobind
   private _onRenderContainer(props: IDropdownProps): JSX.Element {
-    let {
+    const {
       onRenderList = this._onRenderList,
       responsiveMode,
       calloutProps,
       dropdownWidth
     } = this.props;
 
-    let isSmall = responsiveMode! <= ResponsiveMode.medium;
+    const isSmall = responsiveMode! <= ResponsiveMode.medium;
 
     return (
       isSmall ?
@@ -396,12 +398,12 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   // Render List of items
   @autobind
   private _onRenderList(props: IDropdownProps): JSX.Element {
-    let {
+    const {
       onRenderItem = this._onRenderItem
     } = this.props;
 
-    let id = this._id;
-    let { selectedIndices = [] } = this.state;
+    const id = this._id;
+    const { selectedIndices = [] } = this.state;
 
     return (
       <div
@@ -440,7 +442,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
 
   // Render separator
   private _renderSeparator(item: IDropdownOption): JSX.Element | null {
-    let { index, key } = item;
+    const { index, key } = item;
     if (index! > 0) {
       return (
         <div
@@ -468,11 +470,11 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   // Render menu item
   @autobind
   private _renderOption(item: IDropdownOption): JSX.Element {
-    let { onRenderOption = this._onRenderOption } = this.props;
-    let { selectedIndices = [] } = this.state;
-    let id = this._id;
-    let isItemSelected = item.index !== undefined && selectedIndices ? selectedIndices.indexOf(item.index) > -1 : false;
-    let checkboxStyles = getCheckboxStyles(getTheme());
+    const { onRenderOption = this._onRenderOption } = this.props;
+    const { selectedIndices = [] } = this.state;
+    const id = this._id;
+    const isItemSelected = item.index !== undefined && selectedIndices ? selectedIndices.indexOf(item.index) > -1 : false;
+    const checkboxStyles = getCheckboxStyles(getTheme());
 
     return (
       !this.props.multiSelect ?
@@ -587,12 +589,12 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
       return;
     }
 
-    let targetElement = ev.currentTarget as HTMLElement;
+    const targetElement = ev.currentTarget as HTMLElement;
     targetElement.focus();
   }
 
   private _onItemMouseMove(item: any, ev: React.MouseEvent<HTMLElement>) {
-    let targetElement = ev.currentTarget as HTMLElement;
+    const targetElement = ev.currentTarget as HTMLElement;
 
     if (!this._isScrollIdle || document.activeElement === targetElement) {
       return;
@@ -631,14 +633,14 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
       if (this.props.multiSelect) {
         return this._getAllSelectedIndices(options);
       }
-      let selectedIndex = this._getSelectedIndex(options, null);
+      const selectedIndex = this._getSelectedIndex(options, null);
       return selectedIndex !== -1 ? [selectedIndex] : [];
     } else if (!Array.isArray(selectedKey)) {
       return [this._getSelectedIndex(options, selectedKey)];
     }
 
-    let selectedIndices: number[] = [];
-    for (let key of selectedKey) {
+    const selectedIndices: number[] = [];
+    for (const key of selectedKey) {
       selectedIndices.push(this._getSelectedIndex(options, key));
     }
     return selectedIndices;
@@ -646,8 +648,8 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
 
   // Get all selected options for multi-select mode
   private _getAllSelectedOptions(options: IDropdownOption[], selectedIndices: number[]) {
-    let selectedOptions: IDropdownOption[] = [];
-    for (let index of selectedIndices) {
+    const selectedOptions: IDropdownOption[] = [];
+    for (const index of selectedIndices) {
       const option = options[index];
 
       if (option) {
@@ -847,8 +849,9 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
         return;
       }
     }
-    let { disabled, isDisabled } = this.props;
-    let { isOpen } = this.state;
+    let { disabled } = this.props;
+    const { isDisabled } = this.props;
+    const { isOpen } = this.state;
 
     // Remove this deprecation workaround at 1.0.0
     if (isDisabled !== undefined) {
@@ -861,5 +864,4 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
       });
     }
   }
-
 }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
index 598cb19a6901e..79d6f1d99a8a5 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
@@ -19,7 +19,7 @@ export class DropdownBasicExample extends BaseComponent<{}, {
   }
 
   public render() {
-    let { selectedItem, selectedItems } = this.state;
+    const { selectedItem, selectedItems } = this.state;
 
     return (
       <div className='docs-DropdownExample'>
@@ -171,13 +171,13 @@ export class DropdownBasicExample extends BaseComponent<{}, {
 
   @autobind
   public onChangeMultiSelect(item: IDropdownOption) {
-    let updatedSelectedItem = this.state.selectedItems ? this.copyArray(this.state.selectedItems) : [];
+    const updatedSelectedItem = this.state.selectedItems ? this.copyArray(this.state.selectedItems) : [];
     if (item.selected) {
       // add the option if it's checked
       updatedSelectedItem.push(item.key);
     } else {
       // remove the option if it's unchecked
-      let currIndex = updatedSelectedItem.indexOf(item.key);
+      const currIndex = updatedSelectedItem.indexOf(item.key);
       if (currIndex > -1) {
         updatedSelectedItem.splice(currIndex, 1);
       }
@@ -188,7 +188,7 @@ export class DropdownBasicExample extends BaseComponent<{}, {
   }
 
   public copyArray(array: any[]): any[] {
-    let newArray: any[] = [];
+    const newArray: any[] = [];
     for (let i = 0; i < array.length; i++) {
       newArray[i] = array[i];
     }
diff --git a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
index e41b57371f6ac..5153acc5a49ca 100644
--- a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
+++ b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
@@ -68,7 +68,7 @@ export class Fabric extends BaseComponent<IFabricProps, IFabricState> {
       isFocusVisible!
     );
 
-    let divProps = getNativeProps(this.props, divProperties);
+    const divProps = getNativeProps(this.props, divProperties);
     return (
       <div
         { ...divProps }
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
index ebf447e68a97c..82163d85e52c7 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
@@ -39,7 +39,7 @@ describe('Facepile', () => {
 
   it('renders Facepile correctly', () => {
     const component = renderer.create(<Facepile personas={ facepilePersonas } />);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
index e655465c1e8c2..f6ab0ce814278 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
@@ -47,15 +47,17 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
   }
   public render(): JSX.Element {
     let {
-      chevronButtonProps,
-      maxDisplayablePersonas,
       overflowButtonProps,
       overflowButtonType,
+    } = this.props;
+    const {
+      chevronButtonProps,
+      maxDisplayablePersonas,
       className,
       personas,
       showAddButton
     } = this.props;
-    let numPersonasToShow: number = Math.min(personas.length, maxDisplayablePersonas as number);
+    const numPersonasToShow: number = Math.min(personas.length, maxDisplayablePersonas as number);
 
     // Added for deprecating chevronButtonProps.  Can remove after v1.0
     if (chevronButtonProps && !overflowButtonProps) {
@@ -102,7 +104,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
   }
 
   private _getPersonaControl(persona: IFacepilePersona): JSX.Element {
-    let { getPersonaProps, personaSize } = this.props;
+    const { getPersonaProps, personaSize } = this.props;
     return (
       <PersonaCoin
         imageInitials={ persona.imageInitials }
@@ -164,12 +166,12 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
   }
 
   private _getDescriptiveOverflowElement(numPersonasToShow: number): JSX.Element | null {
-    let { overflowButtonProps, personas, personaSize } = this.props;
-    let numPersonasNotPictured: number = personas.length - numPersonasToShow;
+    const { overflowButtonProps, personas, personaSize } = this.props;
+    const numPersonasNotPictured: number = personas.length - numPersonasToShow;
 
     if (!overflowButtonProps || numPersonasNotPictured < 1) { return null; }
 
-    let personaNames: string = personas.slice(numPersonasToShow).map((p: IFacepilePersona) => p.personaName).join(', ');
+    const personaNames: string = personas.slice(numPersonasToShow).map((p: IFacepilePersona) => p.personaName).join(', ');
 
     return (
       <FacepileButton
@@ -188,8 +190,8 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
   }
 
   private _getIconElement(icon: string): JSX.Element {
-    let { overflowButtonProps, personaSize } = this.props;
-    let overflowInitialsIcon = true;
+    const { overflowButtonProps, personaSize } = this.props;
+    const overflowInitialsIcon = true;
 
     return (
       <FacepileButton
@@ -206,7 +208,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
   }
 
   private _getAddNewElement(): JSX.Element {
-    let { addButtonProps, personaSize } = this.props;
+    const { addButtonProps, personaSize } = this.props;
 
     return (
       <FacepileButton
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.AddFace.Example.tsx b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.AddFace.Example.tsx
index 9f30f3daa948b..c153c8538b402 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.AddFace.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.AddFace.Example.tsx
@@ -21,8 +21,8 @@ export class FacepileAddFaceExample extends React.Component<{}, IFacepileAddFace
   }
 
   public render() {
-    let { numberOfFaces } = this.state;
-    let facepileProps: IFacepileProps = {
+    const { numberOfFaces } = this.state;
+    const facepileProps: IFacepileProps = {
       personas: facepilePersonas.slice(0, numberOfFaces),
       maxDisplayablePersonas: 5,
       overflowButtonProps: {
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
index af3a6ab896090..23744c0c47153 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
@@ -29,8 +29,8 @@ export class FacepileBasicExample extends React.Component<{}, IFacepileBasicExam
   }
 
   public render() {
-    let { numberOfFaces, personaSize } = this.state;
-    let facepileProps: IFacepileProps = {
+    const { numberOfFaces, personaSize } = this.state;
+    const facepileProps: IFacepileProps = {
       personaSize: personaSize,
       personas: facepilePersonas.slice(0, numberOfFaces),
       getPersonaProps: (persona: IFacepilePersona) => {
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx
index 2ae467beec801..292f63c3bb5ae 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx
@@ -39,7 +39,7 @@ export class FacepileOverflowExample extends React.Component<{}, IFacepileOverfl
   }
 
   public render() {
-    let { displayedPersonas, overflowButtonType } = this.state;
+    const { displayedPersonas, overflowButtonType } = this.state;
     facepileProps.maxDisplayablePersonas = displayedPersonas;
     facepileProps.overflowButtonType = overflowButtonType;
 
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
index 7e8bdecd69ecc..9eacd38130f0d 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
@@ -27,7 +27,7 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
   private _isInClickStack: boolean = false;
 
   public componentWillMount() {
-    let { isClickableOutsideFocusTrap = false, forceFocusInsideTrap = true } = this.props;
+    const { isClickableOutsideFocusTrap = false, forceFocusInsideTrap = true } = this.props;
     if (forceFocusInsideTrap) {
       this._isInFocusStack = true;
       FocusTrapZone._focusStack.push(this);
@@ -39,7 +39,7 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
   }
 
   public componentDidMount() {
-    let { isClickableOutsideFocusTrap = false, forceFocusInsideTrap = true, elementToFocusOnDismiss, disableFirstFocus = false } = this.props;
+    const { isClickableOutsideFocusTrap = false, forceFocusInsideTrap = true, elementToFocusOnDismiss, disableFirstFocus = false } = this.props;
 
     this._previouslyFocusedElement = elementToFocusOnDismiss ? elementToFocusOnDismiss : document.activeElement as HTMLElement;
     if (!elementContains(this.refs.root, this._previouslyFocusedElement) && !disableFirstFocus) {
@@ -56,18 +56,18 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
   }
 
   public componentWillReceiveProps(nextProps: IFocusTrapZoneProps) {
-    let { elementToFocusOnDismiss } = nextProps;
+    const { elementToFocusOnDismiss } = nextProps;
     if (elementToFocusOnDismiss && this._previouslyFocusedElement !== elementToFocusOnDismiss) {
       this._previouslyFocusedElement = elementToFocusOnDismiss;
     }
   }
 
   public componentWillUnmount() {
-    let { ignoreExternalFocusing } = this.props;
+    const { ignoreExternalFocusing } = this.props;
 
     this._events.dispose();
     if (this._isInFocusStack || this._isInClickStack) {
-      let filter = (value: FocusTrapZone) => {
+      const filter = (value: FocusTrapZone) => {
         return this !== value;
       };
       if (this._isInFocusStack) {
@@ -84,8 +84,8 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
   }
 
   public render() {
-    let { className, ariaLabelledBy } = this.props;
-    let divProps = getNativeProps(this.props, divProperties);
+    const { className, ariaLabelledBy } = this.props;
+    const divProps = getNativeProps(this.props, divProperties);
 
     return (
       <div
@@ -110,7 +110,7 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
       : firstFocusableSelector && firstFocusableSelector();
 
     let _firstFocusableChild;
-    let root = this.refs.root;
+    const root = this.refs.root;
 
     if (focusSelector) {
       _firstFocusableChild = root.querySelector('.' + focusSelector);
@@ -128,7 +128,7 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
       return;
     }
 
-    let { root } = this.refs;
+    const { root } = this.refs;
 
     const _firstFocusableChild = getFirstFocusable(root, root.firstChild as HTMLElement, true);
     const _lastFocusableChild = getLastTabbable(root, root.lastChild as HTMLElement, true);
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZonePage.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZonePage.tsx
index 18150eaecd7d4..912c9654d96bf 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZonePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZonePage.tsx
@@ -9,16 +9,16 @@ import {
   PropertiesTableSet
 } from '@uifabric/example-app-base';
 import FocusTrapZoneBoxExample from './examples/FocusTrapZone.Box.Example';
-let FocusTrapZoneBoxExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx') as string;
+const FocusTrapZoneBoxExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx') as string;
 
 import FocusTrapZoneBoxExampleWithFocusableItem from './examples/FocusTrapZone.Box.FocusOnCustomElement.Example';
-let FocusTrapZoneBoxExampleWithFocusableItemCode = require('!raw-loader!office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx') as string;
+const FocusTrapZoneBoxExampleWithFocusableItemCode = require('!raw-loader!office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx') as string;
 
 import FocusTrapZoneBoxClickExample from './examples/FocusTrapZone.Box.Click.Example';
-let FocusTrapZoneBoxClickExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx') as string;
+const FocusTrapZoneBoxClickExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx') as string;
 
 import FocusTrapZoneNestedExample from './examples/FocusTrapZone.Nested.Example';
-let FocusTrapZoneNestedExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx') as string;
+const FocusTrapZoneNestedExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx') as string;
 
 export class FocusTrapZonePage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
index 603cc4800d9ed..b4407acb7c392 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
@@ -26,7 +26,7 @@ export default class BoxNoClickExample extends React.Component<React.HTMLAttribu
   }
 
   public render() {
-    let { isToggled } = this.state;
+    const { isToggled } = this.state;
 
     return (
       <div>
@@ -56,7 +56,7 @@ export default class BoxNoClickExample extends React.Component<React.HTMLAttribu
   }
 
   private _internalContents() {
-    let { isToggled } = this.state;
+    const { isToggled } = this.state;
 
     return (
       <div className='ms-FocusTrapZoneBoxExample'>
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
index dcd1a73565524..0b6f3a9430ea9 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
@@ -26,7 +26,7 @@ export default class BoxExample extends React.Component<React.HTMLAttributes<HTM
   }
 
   public render() {
-    let { isChecked } = this.state;
+    const { isChecked } = this.state;
 
     return (
       <div>
@@ -56,7 +56,7 @@ export default class BoxExample extends React.Component<React.HTMLAttributes<HTM
   }
 
   private _internalContents() {
-    let { isChecked } = this.state;
+    const { isChecked } = this.state;
 
     return (
       <div className='ms-FocusTrapZoneBoxExample'>
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
index 7210625cc0c3f..880e791dec43d 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
@@ -25,7 +25,7 @@ export default class BoxExample extends React.Component<React.HTMLAttributes<HTM
   }
 
   public render() {
-    let { isChecked } = this.state;
+    const { isChecked } = this.state;
     const className: string = 'shouldFocus input';
 
     return (
@@ -54,7 +54,7 @@ export default class BoxExample extends React.Component<React.HTMLAttributes<HTM
   }
 
   private _internalContents() {
-    let { isChecked } = this.state;
+    const { isChecked } = this.state;
 
     return (
       <div className='ms-FocusTrapZoneBoxExample'>
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx
index ec592c6ed1072..efa8515f81155 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx
@@ -22,7 +22,7 @@ interface IFocusTrapComponentState {
 class FocusTrapComponent extends React.Component<IFocusTrapComponentProps, IFocusTrapComponentState> {
 
   public render() {
-    let contents = (
+    const contents = (
       <div className='ms-FocusTrapComponent'>
         <DefaultButton
           onClick={ this._onStringButtonClicked }
@@ -84,7 +84,7 @@ export default class FocusTrapZoneNestedExample extends React.Component<{}, IFoc
   }
 
   public render() {
-    let { stateMap } = this.state;
+    const { stateMap } = this.state;
 
     return (
       <div>
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 1952a0b5df70b..81831cf00a808 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -30,7 +30,7 @@ const IS_ENTER_DISABLED_ATTRIBUTE = 'data-disable-click-on-enter';
 const FOCUSZONE_ID_ATTRIBUTE = 'data-focuszone-id';
 const TABINDEX = 'tabindex';
 
-let _allInstances: {
+const _allInstances: {
   [key: string]: FocusZone
 } = {};
 
@@ -109,8 +109,8 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   }
 
   public render() {
-    let { rootProps, ariaDescribedBy, ariaLabelledBy, className } = this.props;
-    let divProps = getNativeProps(this.props, divProperties);
+    const { rootProps, ariaDescribedBy, ariaLabelledBy, className } = this.props;
+    const divProps = getNativeProps(this.props, divProperties);
 
     const Tag = this.props.elementType || 'div';
 
@@ -175,7 +175,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
    * @returns True if focus could be set to an active element, false if no operation was taken.
    */
   public focusElement(element: HTMLElement): boolean {
-    let { onBeforeFocus } = this.props;
+    const { onBeforeFocus } = this.props;
 
     if (onBeforeFocus && !onBeforeFocus(element)) {
       return false;
@@ -195,7 +195,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
   @autobind
   private _onFocus(ev: React.FocusEvent<HTMLElement>) {
-    let { onActiveElementChanged } = this.props;
+    const { onActiveElementChanged } = this.props;
 
     if (this._isImmediateDescendantOfZone(ev.target as HTMLElement)) {
       this._activeElement = ev.target as HTMLElement;
@@ -308,7 +308,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       this._isImmediateDescendantOfZone(ev.target as HTMLElement)) {
 
       // Try to focus
-      let innerZone = this._getFirstInnerZone();
+      const innerZone = this._getFirstInnerZone();
 
       if (innerZone) {
         if (!innerZone.focus(true)) {
@@ -459,7 +459,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       if (isElementFocusZone(child)) {
         return _allInstances[child.getAttribute(FOCUSZONE_ID_ATTRIBUTE) as string];
       }
-      let match = this._getFirstInnerZone(child);
+      const match = this._getFirstInnerZone(child);
 
       if (match) {
         return match;
@@ -480,7 +480,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     let candidateDistance = -1;
     let candidateElement: HTMLElement | undefined = undefined;
     let changedFocus = false;
-    let isBidirectional = this.props.direction === FocusZoneDirection.bidirectional;
+    const isBidirectional = this.props.direction === FocusZoneDirection.bidirectional;
 
     if (!element) {
       return false;
@@ -550,8 +550,8 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       // If the difference between top and bottom are within a pixel then we should treat
       // them as equivalent by using Math.floor. For instance 5.2222 and 5.222221 should be equivalent,
       // but without Math.Floor they will be handled incorrectly.
-      let targetRectTop = Math.floor(targetRect.top);
-      let activeRectBottom = Math.floor(activeRect.bottom);
+      const targetRectTop = Math.floor(targetRect.top);
+      const activeRectBottom = Math.floor(activeRect.bottom);
 
       if (targetRectTop < activeRectBottom) {
         return 999999999;
@@ -586,9 +586,9 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       // If the difference between top and bottom are within a pixel then we should treat
       // them as equivalent by using Math.floor. For instance 5.2222 and 5.222221 should be equivalent,
       // but without Math.Floor they will be handled incorrectly.
-      let targetRectBottom = Math.floor(targetRect.bottom);
-      let targetRectTop = Math.floor(targetRect.top);
-      let activeRectTop = Math.floor(activeRect.top);
+      const targetRectBottom = Math.floor(targetRect.bottom);
+      const targetRectTop = Math.floor(targetRect.top);
+      const activeRectTop = Math.floor(activeRect.top);
 
       if (targetRectBottom > activeRectTop) {
         return 999999999;
@@ -764,10 +764,10 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     if (element &&
       element.type &&
       ALLOWED_INPUT_TYPES.indexOf(element.type.toLowerCase()) > -1) {
-      let selectionStart = element.selectionStart;
-      let selectionEnd = element.selectionEnd;
-      let isRangeSelected = selectionStart !== selectionEnd;
-      let inputValue = element.value;
+      const selectionStart = element.selectionStart;
+      const selectionEnd = element.selectionEnd;
+      const isRangeSelected = selectionStart !== selectionEnd;
+      const inputValue = element.value;
 
       // We shouldn't lose focus in the following cases:
       // 1. There is range selected.
@@ -782,5 +782,4 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
     return true;
   }
-
 }
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.tsx
index dac0cb2d86161..15926ce7262dc 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupFooter.tsx
@@ -10,7 +10,7 @@ const styles: any = stylesImport;
 
 export class GroupFooter extends BaseComponent<IGroupDividerProps, {}> {
   public render(): JSX.Element | null {
-    let { group, groupLevel, footerText } = this.props;
+    const { group, groupLevel, footerText } = this.props;
 
     if (group && footerText) {
       return (
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
index 553a964dee25b..8483aa18b4428 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
@@ -31,9 +31,9 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
 
   public componentWillReceiveProps(newProps: any) {
     if (newProps.group) {
-      let newCollapsed = newProps.group.isCollapsed;
-      let isGroupLoading = newProps.headerProps && newProps.headerProps.isGroupLoading;
-      let newLoadingVisible = !newCollapsed && isGroupLoading && isGroupLoading(newProps.group);
+      const newCollapsed = newProps.group.isCollapsed;
+      const isGroupLoading = newProps.headerProps && newProps.headerProps.isGroupLoading;
+      const newLoadingVisible = !newCollapsed && isGroupLoading && isGroupLoading(newProps.group);
 
       this.setState({
         isCollapsed: newCollapsed,
@@ -44,23 +44,25 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
 
   public render(): JSX.Element | null {
     let {
+      isCollapsedGroupSelectVisible
+    } = this.props;
+    const {
       group,
       groupLevel,
       viewport,
       selectionMode,
       loadingText,
       isSelected,
-      selected,
-      isCollapsedGroupSelectVisible
+      selected
     } = this.props;
-    let { isCollapsed, isLoadingVisible } = this.state;
+    const { isCollapsed, isLoadingVisible } = this.state;
 
     if (isCollapsedGroupSelectVisible === undefined) {
       isCollapsedGroupSelectVisible = true;
     }
-    let canSelectGroup = selectionMode === SelectionMode.multiple;
-    let isSelectionCheckVisible = canSelectGroup && (isCollapsedGroupSelectVisible || !(group && group.isCollapsed));
-    let currentlySelected = isSelected || selected;
+    const canSelectGroup = selectionMode === SelectionMode.multiple;
+    const isSelectionCheckVisible = canSelectGroup && (isCollapsedGroupSelectVisible || !(group && group.isCollapsed));
+    const currentlySelected = isSelected || selected;
 
     if (!group) {
       return null;
@@ -136,11 +138,11 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
 
   @autobind
   private _onToggleCollapse(ev: React.MouseEvent<HTMLElement>) {
-    let { group, onToggleCollapse, isGroupLoading } = this.props;
-    let { isCollapsed } = this.state;
+    const { group, onToggleCollapse, isGroupLoading } = this.props;
+    const { isCollapsed } = this.state;
 
-    let newCollapsed = !isCollapsed;
-    let newLoadingVisible = !newCollapsed && isGroupLoading && isGroupLoading(group!);
+    const newCollapsed = !isCollapsed;
+    const newLoadingVisible = !newCollapsed && isGroupLoading && isGroupLoading(group!);
 
     this.setState({
       isCollapsed: newCollapsed,
@@ -156,7 +158,7 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
 
   @autobind
   private _onToggleSelectGroupClick(ev: React.MouseEvent<HTMLElement>) {
-    let { onToggleSelectGroup, group } = this.props;
+    const { onToggleSelectGroup, group } = this.props;
 
     if (onToggleSelectGroup) {
       onToggleSelectGroup(group!);
@@ -168,7 +170,7 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
 
   @autobind
   private _onHeaderClick() {
-    let { group, onGroupHeaderClick, onToggleSelectGroup } = this.props;
+    const { group, onGroupHeaderClick, onToggleSelectGroup } = this.props;
 
     if (onGroupHeaderClick) {
       onGroupHeaderClick(group!);
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupShowAll.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupShowAll.tsx
index cf6a36be0f960..3480dd5a106e2 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupShowAll.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupShowAll.tsx
@@ -24,7 +24,7 @@ export class GroupShowAll extends BaseComponent<IGroupDividerProps, {}> {
   };
 
   public render(): JSX.Element | null {
-    let { group, groupLevel, showAllLinkText } = this.props;
+    const { group, groupLevel, showAllLinkText } = this.props;
 
     if (group) {
       return (
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
index 5d3718724f1ea..769fd29fdd266 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
@@ -60,7 +60,7 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
   }
 
   public componentWillReceiveProps(newProps: IGroupedListProps) {
-    let {
+    const {
       groups,
       selectionMode
     } = this.props;
@@ -81,12 +81,12 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
   }
 
   public render() {
-    let {
+    const {
       className,
       usePageCache,
       onShouldVirtualize
     } = this.props;
-    let {
+    const {
       groups
     } = this.state;
 
@@ -121,9 +121,9 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
   }
 
   public toggleCollapseAll(allCollapsed: boolean) {
-    let { groups } = this.state;
-    let { groupProps } = this.props;
-    let onToggleCollapseAll = groupProps && groupProps.onToggleCollapseAll;
+    const { groups } = this.state;
+    const { groupProps } = this.props;
+    const onToggleCollapseAll = groupProps && groupProps.onToggleCollapseAll;
 
     if (groups) {
       if (onToggleCollapseAll) {
@@ -142,7 +142,7 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
 
   @autobind
   private _renderGroup(group: any, groupIndex: number) {
-    let {
+    const {
       dragDropEvents,
       dragDropHelper,
       eventsToRegister,
@@ -156,16 +156,16 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
     } = this.props;
 
     // override group header/footer props as needed
-    let dividerProps = {
+    const dividerProps = {
       onToggleSelectGroup: this._onToggleSelectGroup,
       onToggleCollapse: this._onToggleCollapse,
       onToggleSummarize: this._onToggleSummarize
     };
 
-    let headerProps = assign({}, groupProps!.headerProps, dividerProps);
-    let showAllProps = assign({}, groupProps!.showAllProps, dividerProps);
-    let footerProps = assign({}, groupProps!.footerProps, dividerProps);
-    let groupNestingDepth = this._getGroupNestingDepth();
+    const headerProps = assign({}, groupProps!.headerProps, dividerProps);
+    const showAllProps = assign({}, groupProps!.showAllProps, dividerProps);
+    const footerProps = assign({}, groupProps!.footerProps, dividerProps);
+    const groupNestingDepth = this._getGroupNestingDepth();
 
     if (!groupProps!.showEmptyGroups && group && group.count === 0) {
       return null;
@@ -207,7 +207,7 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
   }
 
   private _getGroupNestingDepth(): number {
-    let { groups } = this.state;
+    const { groups } = this.state;
     let level = 0;
     let groupsInLevel = groups;
 
@@ -221,8 +221,8 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
 
   @autobind
   private _onToggleCollapse(group: IGroup) {
-    let { groupProps } = this.props;
-    let onToggleCollapse = groupProps && groupProps.headerProps && groupProps.headerProps.onToggleCollapse;
+    const { groupProps } = this.props;
+    const onToggleCollapse = groupProps && groupProps.headerProps && groupProps.headerProps.onToggleCollapse;
 
     if (group) {
       if (onToggleCollapse) {
@@ -245,19 +245,19 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
   private _forceListUpdates(groups?: IGroup[]) {
     groups = groups || this.state.groups;
 
-    let groupCount = groups ? groups.length : 1;
+    const groupCount = groups ? groups.length : 1;
 
     if (this.refs.list) {
       this.refs.list.forceUpdate();
 
       for (let i = 0; i < groupCount; i++) {
-        let group = this.refs.list.refs['group_' + String(i)] as GroupedListSection;
+        const group = this.refs.list.refs['group_' + String(i)] as GroupedListSection;
         if (group) {
           group.forceListUpdate();
         }
       }
     } else {
-      let group = this.refs['group_' + String(0)] as GroupedListSection;
+      const group = this.refs['group_' + String(0)] as GroupedListSection;
       if (group) {
         group.forceListUpdate();
       }
@@ -266,8 +266,8 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
 
   @autobind
   private _onToggleSummarize(group: IGroup) {
-    let { groupProps } = this.props;
-    let onToggleSummarize = groupProps && groupProps.showAllProps && groupProps.showAllProps.onToggleSummarize;
+    const { groupProps } = this.props;
+    const onToggleSummarize = groupProps && groupProps.showAllProps && groupProps.showAllProps.onToggleSummarize;
 
     if (onToggleSummarize) {
       onToggleSummarize(group);
@@ -296,10 +296,10 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
   }
 
   private _updateIsSomeGroupExpanded() {
-    let { groups } = this.state;
-    let { onGroupExpandStateChanged } = this.props;
+    const { groups } = this.state;
+    const { onGroupExpandStateChanged } = this.props;
 
-    let newIsSomeGroupExpanded = this._computeIsSomeGroupExpanded(groups);
+    const newIsSomeGroupExpanded = this._computeIsSomeGroupExpanded(groups);
     if (this._isSomeGroupExpanded !== newIsSomeGroupExpanded) {
       if (onGroupExpandStateChanged) {
         onGroupExpandStateChanged(newIsSomeGroupExpanded);
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
index dbe28257e814e..da3f6638c3e0b 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
@@ -128,7 +128,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
   constructor(props: IGroupedListSectionProps) {
     super(props);
 
-    let { selection, group } = props;
+    const { selection, group } = props;
 
     this._subGroups = {};
     this.state = {
@@ -138,7 +138,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
   }
 
   public componentDidMount() {
-    let { dragDropHelper, selection } = this.props;
+    const { dragDropHelper, selection } = this.props;
 
     if (dragDropHelper) {
       this._dragDropSubscription = dragDropHelper.subscribe(this.refs.root, this._events, this._getGroupDragDropOptions());
@@ -171,7 +171,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
   }
 
   public render(): JSX.Element {
-    let {
+    const {
       getGroupItemLimit,
       group,
       groupIndex,
@@ -184,13 +184,13 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
       onRenderGroupShowAll = this._onRenderGroupShowAll,
       onRenderGroupFooter = this._onRenderGroupFooter
     } = this.props;
-    let { isSelected } = this.state;
-    let renderCount = group && getGroupItemLimit ? getGroupItemLimit(group) : Infinity;
-    let isShowAllVisible = group && !group.children && !group.isCollapsed && !group.isShowingAll &&
+    const { isSelected } = this.state;
+    const renderCount = group && getGroupItemLimit ? getGroupItemLimit(group) : Infinity;
+    const isShowAllVisible = group && !group.children && !group.isCollapsed && !group.isShowingAll &&
       (group.count > renderCount || group.hasMoreData);
-    let hasNestedGroups = group && group.children && group.children.length > 0;
+    const hasNestedGroups = group && group.children && group.children.length > 0;
 
-    let dividerProps: IGroupDividerProps = {
+    const dividerProps: IGroupDividerProps = {
       group: group,
       groupIndex: groupIndex,
       groupLevel: group ? group.level : 0,
@@ -198,9 +198,9 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
       viewport: viewport,
       selectionMode: selectionMode
     };
-    let groupHeaderProps: IGroupDividerProps = assign({}, headerProps, dividerProps);
-    let groupShowAllProps: IGroupDividerProps = assign({}, showAllProps, dividerProps);
-    let groupFooterProps: IGroupDividerProps = assign({}, footerProps, dividerProps);
+    const groupHeaderProps: IGroupDividerProps = assign({}, headerProps, dividerProps);
+    const groupShowAllProps: IGroupDividerProps = assign({}, showAllProps, dividerProps);
+    const groupFooterProps: IGroupDividerProps = assign({}, footerProps, dividerProps);
 
     return (
       <div
@@ -241,16 +241,16 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
   }
 
   public forceListUpdate() {
-    let { group } = this.props;
+    const { group } = this.props;
 
     if (this.refs.list) {
       this.refs.list.forceUpdate();
 
       if (group && group.children && group.children.length > 0) {
-        let subGroupCount = group.children.length;
+        const subGroupCount = group.children.length;
 
         for (let i = 0; i < subGroupCount; i++) {
-          let subGroup = this.refs.list.refs['subGroup_' + String(i)] as GroupedListSection;
+          const subGroup = this.refs.list.refs['subGroup_' + String(i)] as GroupedListSection;
 
           if (subGroup) {
             subGroup.forceListUpdate();
@@ -258,7 +258,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
         }
       }
     } else {
-      let subGroup = this.refs['subGroup_' + String(0)] as GroupedListSection;
+      const subGroup = this.refs['subGroup_' + String(0)] as GroupedListSection;
 
       if (subGroup) {
         subGroup.forceListUpdate();
@@ -282,8 +282,8 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
   }
 
   private _onSelectionChange() {
-    let { group, selection } = this.props;
-    let isSelected = selection!.isRangeSelected(group!.startIndex, group!.count);
+    const { group, selection } = this.props;
+    const isSelected = selection!.isRangeSelected(group!.startIndex, group!.count);
 
     if (isSelected !== this.state.isSelected) {
       this.setState({ isSelected });
@@ -298,15 +298,15 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
   }
 
   private _onRenderGroup(renderCount: number) {
-    let {
+    const {
       group,
       items,
       onRenderCell,
       listProps,
       groupNestingDepth
     } = this.props;
-    let count = group ? group.count : items.length;
-    let startIndex = group ? group.startIndex : 0;
+    const count = group ? group.count : items.length;
+    const startIndex = group ? group.startIndex : 0;
 
     return (
       <List
@@ -322,7 +322,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
 
   @autobind
   private _renderSubGroup(subGroup: any, subGroupIndex: number) {
-    let {
+    const {
       dragDropEvents,
       dragDropHelper,
       eventsToRegister,
@@ -382,8 +382,8 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
    */
   @autobind
   private _getGroupDragDropOptions(): IDragDropOptions {
-    let { group, groupIndex, dragDropEvents, eventsToRegister } = this.props;
-    let options = {
+    const { group, groupIndex, dragDropEvents, eventsToRegister } = this.props;
+    const options = {
       eventMap: eventsToRegister,
       selectionIndex: -1,
       context: { data: group, index: groupIndex, isGroup: true },
@@ -403,8 +403,8 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
    */
   @autobind
   private _updateDroppingState(newIsDropping: boolean, event: DragEvent) {
-    let { isDropping } = this.state;
-    let { dragDropEvents } = this.props;
+    const { isDropping } = this.state;
+    const { dragDropEvents } = this.props;
 
     if (!isDropping) {
       if (dragDropEvents && dragDropEvents.onDragLeave) {
@@ -430,7 +430,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
    */
   private _getDroppingClassName(): string {
     let { isDropping } = this.state;
-    let { group } = this.props;
+    const { group } = this.props;
 
     isDropping = !!(group && isDropping);
 
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Basic.Example.tsx
index 0eeb1a7205873..4f4073aa84842 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Basic.Example.tsx
@@ -59,7 +59,7 @@ export class GroupedListBasicExample extends React.Component {
   }
 
   private _onRenderCell(nestingDepth: number, item: any, itemIndex: number) {
-    let {
+    const {
       _selection: selection
     } = this;
     return (
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx
index ea4df20c6d85d..3e539dc9a96e7 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx
@@ -32,7 +32,7 @@ export class HoverCardBasicExample extends BaseComponent<{}, IHoverCardExampleSt
   }
 
   public render() {
-    let { items, columns } = this.state;
+    const { items, columns } = this.state;
 
     return (
       <div>
@@ -81,7 +81,7 @@ export class HoverCardBasicExample extends BaseComponent<{}, IHoverCardExampleSt
 
   @autobind
   private _onRenderExpandedCard(item: any): JSX.Element {
-    let { items, columns } = this.state;
+    const { items, columns } = this.state;
     return (
       <div className='hoverCardExample-expandedCard'>
         { item.description }
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
index da97820a6a7cc..920820c64e102 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
@@ -79,7 +79,7 @@ export class HoverCardTargetExample extends BaseComponent<{}, IHoverCardExampleS
   }
 
   public render() {
-    let { items, columns } = this.state;
+    const { items, columns } = this.state;
 
     return (
       <div>
@@ -132,7 +132,7 @@ export class HoverCardTargetExample extends BaseComponent<{}, IHoverCardExampleS
 
   @autobind
   private _onRenderExpandedCard(item: any): JSX.Element {
-    let { items, columns } = this.state;
+    const { items, columns } = this.state;
     return (
       <div className='hoverCardExample-expandedCard'>
         { item.description }
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.test.tsx b/packages/office-ui-fabric-react/src/components/Icon/Icon.test.tsx
index 56d0c7a9b99fc..9340cc5b039b4 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.test.tsx
@@ -6,7 +6,7 @@ import { Icon } from './Icon';
 describe('Icon', () => {
   it('renders Icon correctly', () => {
     const component = renderer.create(<Icon iconName='CompassNW' />);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
index d38fecb3baeae..4f14e0030802e 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
@@ -12,18 +12,18 @@ import { getIcon, IIconRecord } from '../../Styling';
 import { getClassNames } from './Icon.classNames';
 
 export const Icon = (props: IIconProps): JSX.Element => {
-  let {
+  const {
     ariaLabel,
     className,
     styles,
     iconName
    } = props;
-  let classNames = getClassNames(
+  const classNames = getClassNames(
     styles
   );
 
   if (props.iconType === IconType.image || props.iconType === IconType.Image) {
-    let containerClassName = css(
+    const containerClassName = css(
       'ms-Icon-imageContainer',
       classNames.root,
       classNames.imageContainer,
@@ -59,7 +59,7 @@ export const Icon = (props: IIconProps): JSX.Element => {
       />
     );
   } else {
-    let iconDefinition = getIcon(iconName) || {
+    const iconDefinition = getIcon(iconName) || {
       subset: {
         className: undefined
       },
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
index c587e9b95fb88..3d6f57c85e59a 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
@@ -25,12 +25,12 @@ describe('Image', () => {
 
   it('renders Image correctly', () => {
     const component = renderer.create(<Image src={ testImage1x1 } />);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
   it('renders an image', (done) => {
-    let component = ReactTestUtils.renderIntoDocument(
+    const component = ReactTestUtils.renderIntoDocument(
       <Image
         src={ testImage1x1 }
         // tslint:disable-next-line:jsx-no-lambda
@@ -38,13 +38,13 @@ describe('Image', () => {
       />
     );
 
-    let image = ReactTestUtils.findRenderedDOMComponentWithTag(component as any, 'img');
+    const image = ReactTestUtils.findRenderedDOMComponentWithTag(component as any, 'img');
     ReactTestUtils.Simulate.load(image);
 
   });
 
   it('can cover a portrait (tall) frame with a square image', () => {
-    let component = mount(
+    const component = mount(
       <div>
         <Image
           src={ testImage1x1 }
@@ -61,7 +61,7 @@ describe('Image', () => {
   });
 
   it('can cover a landscape (wide) frame with a square image', () => {
-    let component = mount(
+    const component = mount(
       <div>
         <Image
           src={ testImage1x1 }
@@ -78,7 +78,7 @@ describe('Image', () => {
   });
 
   it('can cover a landscape (wide) parent element with a square image', () => {
-    let component = mount(
+    const component = mount(
       <div style={ { width: '10px', height: '20px' } }>
         <Image
           className='is-frameMaximizedPortrait'
@@ -97,7 +97,7 @@ describe('Image', () => {
   });
 
   it('can cover a portrait (tall) parent element with a square image', () => {
-    let component = mount(
+    const component = mount(
       <div style={ { width: '10px', height: '20px' } }>
         <Image
           src={ testImage1x1 }
@@ -117,7 +117,7 @@ describe('Image', () => {
   });
 
   it('allows onError events to be attached', (done) => {
-    let component = ReactTestUtils.renderIntoDocument(
+    const component = ReactTestUtils.renderIntoDocument(
       <Image
         src={ brokenImage }
         // tslint:disable-next-line:jsx-no-lambda
@@ -125,7 +125,7 @@ describe('Image', () => {
       />
     );
 
-    let img = ReactTestUtils.findRenderedDOMComponentWithTag(component as any, 'img');
+    const img = ReactTestUtils.findRenderedDOMComponentWithTag(component as any, 'img');
     ReactTestUtils.Simulate.error(img);
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.tsx
index 97e636db701dd..a22c305b8cb2a 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.tsx
@@ -72,11 +72,11 @@ export class Image extends BaseComponent<IImageProps, IImageState> {
   }
 
   public render() {
-    let imageProps = getNativeProps(this.props, imageProperties, ['width', 'height']);
-    let { src, alt, width, height, shouldFadeIn, shouldStartVisible, className, imageFit, role, maximizeFrame } = this.props;
-    let { loadState } = this.state;
-    let coverStyle = this.props.coverStyle !== undefined ? this.props.coverStyle : this._coverStyle;
-    let loaded = loadState === ImageLoadState.loaded || (loadState === ImageLoadState.notLoaded && this.props.shouldStartVisible);
+    const imageProps = getNativeProps(this.props, imageProperties, ['width', 'height']);
+    const { src, alt, width, height, shouldFadeIn, shouldStartVisible, className, imageFit, role, maximizeFrame } = this.props;
+    const { loadState } = this.state;
+    const coverStyle = this.props.coverStyle !== undefined ? this.props.coverStyle : this._coverStyle;
+    const loaded = loadState === ImageLoadState.loaded || (loadState === ImageLoadState.notLoaded && this.props.shouldStartVisible);
 
     // If image dimensions aren't specified, the natural size of the image is used.
     return (
@@ -124,7 +124,7 @@ export class Image extends BaseComponent<IImageProps, IImageState> {
 
   @autobind
   private _onImageLoaded(ev: React.SyntheticEvent<HTMLImageElement>): void {
-    let { src, onLoad } = this.props;
+    const { src, onLoad } = this.props;
     if (onLoad) {
       onLoad(ev);
     }
@@ -139,15 +139,15 @@ export class Image extends BaseComponent<IImageProps, IImageState> {
   }
 
   private _checkImageLoaded(): void {
-    let { src } = this.props;
-    let { loadState } = this.state;
+    const { src } = this.props;
+    const { loadState } = this.state;
 
     if (loadState === ImageLoadState.notLoaded) {
       // testing if naturalWidth and naturalHeight are greater than zero is better than checking
       // .complete, because .complete will also be set to true if the image breaks. However,
       // for some browsers, SVG images do not have a naturalWidth or naturalHeight, so fall back
       // to checking .complete for these images.
-      let isLoaded: boolean = src && this._imageElement && (this._imageElement.naturalWidth > 0 && this._imageElement.naturalHeight > 0) ||
+      const isLoaded: boolean = src && this._imageElement && (this._imageElement.naturalWidth > 0 && this._imageElement.naturalHeight > 0) ||
         (this._imageElement.complete && Image._svgRegex.test(src!));
 
       if (isLoaded) {
@@ -160,7 +160,7 @@ export class Image extends BaseComponent<IImageProps, IImageState> {
   }
 
   private _computeCoverStyle(props: IImageProps) {
-    let { imageFit, width, height } = props;
+    const { imageFit, width, height } = props;
 
     // Do not compute cover style if it was already specified in props
     if ((imageFit === ImageFit.cover || imageFit === ImageFit.contain) &&
@@ -176,7 +176,7 @@ export class Image extends BaseComponent<IImageProps, IImageState> {
       }
 
       // Examine the source image to determine its original ratio.
-      let naturalRatio = this._imageElement.naturalWidth / this._imageElement.naturalHeight;
+      const naturalRatio = this._imageElement.naturalWidth / this._imageElement.naturalHeight;
 
       // Should we crop from the top or the sides?
       if (naturalRatio > desiredRatio) {
diff --git a/packages/office-ui-fabric-react/src/components/Image/examples/Image.Center.Example.tsx b/packages/office-ui-fabric-react/src/components/Image/examples/Image.Center.Example.tsx
index c344aba4c759f..cd578c92bf63d 100644
--- a/packages/office-ui-fabric-react/src/components/Image/examples/Image.Center.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/examples/Image.Center.Example.tsx
@@ -8,7 +8,7 @@ import { Label } from 'office-ui-fabric-react/lib/Label';
 
 export class ImageCenterExample extends React.Component<any, any> {
   public render() {
-    let imageProps: IImageProps = {
+    const imageProps: IImageProps = {
       src: 'http://placehold.it/800x300',
       imageFit: ImageFit.center,
       width: 350,
diff --git a/packages/office-ui-fabric-react/src/components/Image/examples/Image.Contain.Example.tsx b/packages/office-ui-fabric-react/src/components/Image/examples/Image.Contain.Example.tsx
index b331d2a82e523..4205b03e12b5e 100644
--- a/packages/office-ui-fabric-react/src/components/Image/examples/Image.Contain.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/examples/Image.Contain.Example.tsx
@@ -8,7 +8,7 @@ import { Label } from 'office-ui-fabric-react/lib/Label';
 
 export class ImageContainExample extends React.Component<any, any> {
   public render() {
-    let imageProps: IImageProps = {
+    const imageProps: IImageProps = {
       src: 'http://placehold.it/700x300',
       imageFit: ImageFit.contain
     };
diff --git a/packages/office-ui-fabric-react/src/components/Image/examples/Image.Cover.Example.tsx b/packages/office-ui-fabric-react/src/components/Image/examples/Image.Cover.Example.tsx
index 8d38ff7bbe9a6..cc7413420b627 100644
--- a/packages/office-ui-fabric-react/src/components/Image/examples/Image.Cover.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/examples/Image.Cover.Example.tsx
@@ -8,7 +8,7 @@ import { Label } from 'office-ui-fabric-react/lib/Label';
 
 export class ImageCoverExample extends React.Component<any, any> {
   public render() {
-    let imageProps: IImageProps = {
+    const imageProps: IImageProps = {
       src: 'http://placehold.it/500x500',
       imageFit: ImageFit.cover
     };
diff --git a/packages/office-ui-fabric-react/src/components/Image/examples/Image.MaximizeFrame.Example.tsx b/packages/office-ui-fabric-react/src/components/Image/examples/Image.MaximizeFrame.Example.tsx
index 2a587775324df..d16f5779de52f 100644
--- a/packages/office-ui-fabric-react/src/components/Image/examples/Image.MaximizeFrame.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/examples/Image.MaximizeFrame.Example.tsx
@@ -8,7 +8,7 @@ import { Label } from 'office-ui-fabric-react/lib/Label';
 
 export class ImageMaximizeFrameExample extends React.Component<any, any> {
   public render() {
-    let imageProps: IImageProps = {
+    const imageProps: IImageProps = {
       src: 'http://placehold.it/500x500',
       imageFit: ImageFit.cover,
       maximizeFrame: true
diff --git a/packages/office-ui-fabric-react/src/components/Image/examples/Image.None.Example.tsx b/packages/office-ui-fabric-react/src/components/Image/examples/Image.None.Example.tsx
index 68b4ffe8ff116..288bdfaadbda0 100644
--- a/packages/office-ui-fabric-react/src/components/Image/examples/Image.None.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/examples/Image.None.Example.tsx
@@ -8,7 +8,7 @@ import { Label } from 'office-ui-fabric-react/lib/Label';
 
 export class ImageNoneExample extends React.Component<any, any> {
   public render() {
-    let imageProps: IImageProps = {
+    const imageProps: IImageProps = {
       src: 'http://placehold.it/500x250',
       imageFit: ImageFit.none,
       width: 350,
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.test.tsx b/packages/office-ui-fabric-react/src/components/Label/Label.test.tsx
index a19745b54f801..a36c5ebda6dc0 100644
--- a/packages/office-ui-fabric-react/src/components/Label/Label.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Label/Label.test.tsx
@@ -11,10 +11,10 @@ import { Label } from './Label';
 describe('Label', () => {
 
   it('renders a label', () => {
-    let component = ReactTestUtils.renderIntoDocument(
+    const component = ReactTestUtils.renderIntoDocument(
       <Label>test</Label>
     );
-    let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
+    const renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
 
     expect(renderedDOM.textContent).toEqual('test');
   });
@@ -23,7 +23,7 @@ describe('Label', () => {
     const component = renderer.create(
       <Label>test</Label>
     );
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.tsx b/packages/office-ui-fabric-react/src/components/Label/Label.tsx
index 8a0b64343f9fd..ffad9139703d7 100644
--- a/packages/office-ui-fabric-react/src/components/Label/Label.tsx
+++ b/packages/office-ui-fabric-react/src/components/Label/Label.tsx
@@ -6,7 +6,7 @@ import { getLabelClassNames } from './Label.classNames';
 @customizable('Label', ['theme'])
 export class Label extends BaseComponent<ILabelProps, {}> {
   public render() {
-    let { disabled, required, children, className, theme } = this.props;
+    const { disabled, required, children, className, theme } = this.props;
     return (
       <label
         { ...getNativeProps(this.props, divProperties) }
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.test.tsx b/packages/office-ui-fabric-react/src/components/Layer/Layer.test.tsx
index dcd760279bfa1..c749b94e1ed7c 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/Layer.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.test.tsx
@@ -11,7 +11,7 @@ import { LayerHost } from './LayerHost';
 describe('Layer', () => {
   it('renders Layer correctly', () => {
     const component = renderer.create(<Layer>Content</Layer>);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
@@ -65,18 +65,18 @@ describe('Layer', () => {
       }
     }
 
-    let appElement = document.createElement('div');
+    const appElement = document.createElement('div');
 
     try {
       document.body.appendChild(appElement);
       ReactDOM.render(<App />, appElement);
 
-      let parentElement = appElement.querySelector('#parent');
+      const parentElement = appElement.querySelector('#parent');
 
       expect(parentElement).toBeDefined();
       expect(parentElement!.ownerDocument).toBeDefined();
 
-      let childElement = appElement.querySelector('#child') as Element;
+      const childElement = appElement.querySelector('#child') as Element;
 
       expect(childElement.textContent).toEqual('foo');
     } finally {
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx b/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx
index ad7b7b0845d11..4fc3473b10318 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx
@@ -9,7 +9,7 @@ import { css, BaseComponent, getDocument, setVirtualParent } from '../../Utiliti
 import * as stylesImport from './Layer.scss';
 const styles: any = stylesImport;
 
-let _layersByHostId: { [hostId: string]: Layer[] } = {};
+const _layersByHostId: { [hostId: string]: Layer[] } = {};
 let _defaultHostSelector: string | undefined;
 
 export class Layer extends BaseComponent<ILayerProps, {}> {
@@ -77,7 +77,7 @@ export class Layer extends BaseComponent<ILayerProps, {}> {
   }
 
   public componentDidUpdate() {
-    let host = this._getHost();
+    const host = this._getHost();
 
     if (host !== this._host) {
       this._removeLayerElement();
@@ -87,7 +87,7 @@ export class Layer extends BaseComponent<ILayerProps, {}> {
       this._host = host;
 
       if (!this._layerElement) {
-        let doc = getDocument(this._rootElement) as Document;
+        const doc = getDocument(this._rootElement) as Document;
 
         this._layerElement = doc.createElement('div');
         this._layerElement.className = css('ms-Layer', {
@@ -136,7 +136,7 @@ export class Layer extends BaseComponent<ILayerProps, {}> {
       this.props.onLayerWillUnmount!();
 
       ReactDOM.unmountComponentAtNode(this._layerElement);
-      let parentNode = this._layerElement.parentNode;
+      const parentNode = this._layerElement.parentNode;
       if (parentNode) {
         parentNode.removeChild(this._layerElement);
       }
@@ -146,8 +146,8 @@ export class Layer extends BaseComponent<ILayerProps, {}> {
   }
 
   private _getHost(): Node {
-    let { hostId } = this.props;
-    let doc = getDocument(this._rootElement) as Document;
+    const { hostId } = this.props;
+    const doc = getDocument(this._rootElement) as Document;
 
     if (hostId) {
       return doc.getElementById(hostId) as Node;
diff --git a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
index 369e6829b2bc4..a8cc8e746fa6b 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
@@ -64,7 +64,7 @@ export class LayerBasicExample extends BaseComponent<{}, {
   }
 
   public render() {
-    let { showLayer } = this.state;
+    const { showLayer } = this.state;
 
     return (
       <div>
diff --git a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
index 0dc249b832cfe..27ac832ece392 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
@@ -22,8 +22,8 @@ export class LayerHostedExample extends React.Component<{}, {
   }
 
   public render() {
-    let { showLayer, showHost } = this.state;
-    let content = (
+    const { showLayer, showHost } = this.state;
+    const content = (
       <div className={ 'LayerExample-content ' + AnimationClassNames.scaleUpIn100 } >
         This is example layer content.
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.base.tsx b/packages/office-ui-fabric-react/src/components/Link/Link.base.tsx
index d501f96825c68..3ffdc565f1c1c 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.base.tsx
@@ -22,7 +22,7 @@ export class LinkBase extends BaseComponent<ILinkProps, any> implements ILink {
   private _link: HTMLElement;
 
   public render() {
-    let { disabled, children, className, href, theme, getStyles } = this.props;
+    const { disabled, children, className, href, theme, getStyles } = this.props;
 
     const classNames = getClassNames(getStyles!, {
       className,
@@ -67,7 +67,7 @@ export class LinkBase extends BaseComponent<ILinkProps, any> implements ILink {
 
   @autobind
   private _onClick(ev: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>) {
-    let { onClick } = this.props;
+    const { onClick } = this.props;
 
     if (onClick) {
       onClick(ev);
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.test.tsx b/packages/office-ui-fabric-react/src/components/Link/Link.test.tsx
index c3d1734a7fc52..22a65951497af 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.test.tsx
@@ -6,27 +6,27 @@ import { Link } from './Link';
 describe('Link', () => {
   it('renders Link correctly', () => {
     const component = renderer.create(<Link href='#'>I'm a link</Link>);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
   it('renders disabled Link correctly', () => {
     const component = renderer.create(<Link href='#' disabled={ true }>I'm a disabled link</Link>);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
   it('renders Link with no href as a button', () => {
     const component = renderer.create(<Link>I'm a link as a button</Link>);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
   it('renders disabled Link with no href as a button correctly', () => {
     const component = renderer.create(<Link disabled={ true }>I'm a link as a button</Link>);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
   it('renders Link with a custom class name', () => {
     const component = renderer.create(<Link href='#' className='customClassName'>I'm a link</Link>);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx b/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx
index ccd434fea1b2f..0e15bcab62e26 100644
--- a/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx
@@ -9,7 +9,7 @@ import { LinkBasicExample } from './examples/Link.Basic.Example';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { LinkStatus } from './Link.checklist';
 
-let LinkBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Link/examples/Link.Basic.Example.tsx') as string;
+const LinkBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/Link/examples/Link.Basic.Example.tsx') as string;
 
 export class LinkPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
diff --git a/packages/office-ui-fabric-react/src/components/List/List.test.tsx b/packages/office-ui-fabric-react/src/components/List/List.test.tsx
index 4c05d1aa75175..47a2e723e2039 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.test.tsx
@@ -10,7 +10,7 @@ describe('List', () => {
     const component = renderer.create(
       // tslint:disable-next-line:jsx-no-lambda
       <List items={ [] } onRenderCell={ () => null } />);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index 26e774f4407fb..9ab99cc74aed8 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -289,8 +289,8 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   }
 
   public shouldComponentUpdate(newProps: IListProps, newState: IListState) {
-    let { pages: oldPages } = this.state;
-    let { pages: newPages } = newState;
+    const { pages: oldPages } = this.state;
+    const { pages: newPages } = newState;
     let shouldComponentUpdate = false;
 
     // Update if the page stops scrolling
@@ -301,8 +301,8 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     if (newProps.items === this.props.items &&
       oldPages!.length === newPages!.length) {
       for (let i = 0; i < oldPages!.length; i++) {
-        let oldPage = oldPages![i];
-        let newPage = newPages![i];
+        const oldPage = oldPages![i];
+        const newPage = newPages![i];
 
         if ((oldPage.key !== newPage.key ||
           oldPage.itemCount !== newPage.itemCount)) {
@@ -335,8 +335,8 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     const {
       pages = []
     } = this.state;
-    let pageElements: JSX.Element[] = [];
-    let divProps = getNativeProps(this.props, divProperties);
+    const pageElements: JSX.Element[] = [];
+    const divProps = getNativeProps(this.props, divProperties);
 
     for (const page of pages) {
       pageElements.push(this._renderPage(page));
@@ -373,7 +373,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   }
 
   private _renderPage(page: IPage): JSX.Element {
-    let { usePageCache } = this.props;
+    const { usePageCache } = this.props;
     let cachedPage;
     // if usePageCache is set and cached page element can be found, just return cached page
     if (usePageCache) {
@@ -479,7 +479,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     let target = ev.target as HTMLElement;
 
     while (target !== this.refs.surface) {
-      let indexString = target.getAttribute('data-list-index');
+      const indexString = target.getAttribute('data-list-index');
 
       if (indexString) {
         this._focusedIndex = Number(indexString);
@@ -569,8 +569,8 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       this._updateRenderRects(props);
     }
 
-    let newListState = this._buildPages(props);
-    let oldListPages = this.state.pages!;
+    const newListState = this._buildPages(props);
+    const oldListPages = this.state.pages!;
 
     this._notifyPageChanges(oldListPages, newListState.pages!);
 
@@ -633,7 +633,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
         }
       }
 
-      for (let index in renderedIndexes) {
+      for (const index in renderedIndexes) {
         if (renderedIndexes.hasOwnProperty(index)) {
           this._onPageRemoved(renderedIndexes[index]);
         }
@@ -654,7 +654,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     }
 
     for (let i = 0; i < pages.length; i++) {
-      let page = pages[i];
+      const page = pages[i];
 
       if (page.items) {
         heightChanged = this._measurePage(page) || heightChanged;
@@ -670,13 +670,13 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
    */
   private _measurePage(page: IPage): boolean {
     let hasChangedHeight = false;
-    let pageElement = this.refs[page.key] as HTMLElement;
-    let cachedHeight = this._cachedPageHeights[page.startIndex];
+    const pageElement = this.refs[page.key] as HTMLElement;
+    const cachedHeight = this._cachedPageHeights[page.startIndex];
 
     // console.log('   * measure attempt', page.startIndex, cachedHeight);
 
     if (pageElement && this._shouldVirtualize() && (!cachedHeight || cachedHeight.measureVersion !== this._measureVersion)) {
-      let newClientRect = {
+      const newClientRect = {
         width: pageElement.clientWidth,
         height: pageElement.clientHeight
       };
@@ -706,7 +706,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
 
   /** Called when a page has been added to the DOM. */
   private _onPageAdded(page: IPage) {
-    let { onPageAdded } = this.props;
+    const { onPageAdded } = this.props;
 
     // console.log('page added', page.startIndex, this.state.pages.map(page => page.key).join(', '));
 
@@ -717,7 +717,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
 
   /** Called when a page has been removed from the DOM. */
   private _onPageRemoved(page: IPage) {
-    let { onPageRemoved } = this.props;
+    const { onPageRemoved } = this.props;
 
     // console.log('  --- page removed', page.startIndex, this.state.pages.map(page => page.key).join(', '));
 
@@ -728,7 +728,8 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
 
   /** Build up the pages that should be rendered. */
   private _buildPages(props: IListProps): IListState {
-    let { items, startIndex, renderCount, getPageHeight } = props;
+    let { renderCount } = props;
+    const { items, startIndex, getPageHeight } = props;
 
     renderCount = this._getRenderCount(props);
 
@@ -738,14 +739,14 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     let itemsPerPage = 1;
     let pageTop = 0;
     let currentSpacer = null;
-    let focusedIndex = this._focusedIndex;
-    let endIndex = startIndex! + renderCount;
+    const focusedIndex = this._focusedIndex;
+    const endIndex = startIndex! + renderCount;
     const shouldVirtualize = this._shouldVirtualize(props);
 
     // First render is very important to track; when we render cells, we have no idea of estimated page height.
     // So we should default to rendering only the first page so that we can get information.
     // However if the user provides a measure function, let's just assume they know the right heights.
-    let isFirstRender = this._estimatedPageHeight === 0 && !getPageHeight;
+    const isFirstRender = this._estimatedPageHeight === 0 && !getPageHeight;
 
     const allowedRect = this._allowedRect;
 
@@ -757,14 +758,14 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
 
       itemsPerPage = pageSpecification.itemCount;
 
-      let pageBottom = pageTop + pageHeight - 1;
+      const pageBottom = pageTop + pageHeight - 1;
 
-      let isPageRendered = findIndex(this.state.pages as IPage[], (page: IPage) => !!page.items && page.startIndex === itemIndex) > -1;
-      let isPageInAllowedRange = !allowedRect || pageBottom >= allowedRect.top && pageTop <= allowedRect.bottom!;
-      let isPageInRequiredRange = !this._requiredRect || pageBottom >= this._requiredRect!.top && pageTop <= this._requiredRect!.bottom!;
-      let isPageVisible = !isFirstRender && (isPageInRequiredRange || (isPageInAllowedRange && isPageRendered)) || !shouldVirtualize;
-      let isPageFocused = focusedIndex >= itemIndex && focusedIndex < (itemIndex + itemsPerPage);
-      let isFirstPage = itemIndex === startIndex;
+      const isPageRendered = findIndex(this.state.pages as IPage[], (page: IPage) => !!page.items && page.startIndex === itemIndex) > -1;
+      const isPageInAllowedRange = !allowedRect || pageBottom >= allowedRect.top && pageTop <= allowedRect.bottom!;
+      const isPageInRequiredRange = !this._requiredRect || pageBottom >= this._requiredRect!.top && pageTop <= this._requiredRect!.bottom!;
+      const isPageVisible = !isFirstRender && (isPageInRequiredRange || (isPageInAllowedRange && isPageRendered)) || !shouldVirtualize;
+      const isPageFocused = focusedIndex >= itemIndex && focusedIndex < (itemIndex + itemsPerPage);
+      const isFirstPage = itemIndex === startIndex;
 
       // console.log('building page', itemIndex, 'pageTop: ' + pageTop, 'inAllowed: ' + isPageInAllowedRange, 'inRequired: ' + isPageInRequiredRange);
 
@@ -776,8 +777,8 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
           currentSpacer = null;
         }
 
-        let itemsInPage = Math.min(itemsPerPage, endIndex - itemIndex);
-        let newPage = this._createPage(key, items!.slice(itemIndex, itemIndex + itemsInPage), itemIndex, undefined, undefined, pageData);
+        const itemsInPage = Math.min(itemsPerPage, endIndex - itemIndex);
+        const newPage = this._createPage(key, items!.slice(itemIndex, itemIndex + itemsInPage), itemIndex, undefined, undefined, pageData);
 
         newPage.top = pageTop;
         newPage.height = pageHeight;
@@ -870,14 +871,14 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     if (this.props.getPageHeight) {
       return this.props.getPageHeight(itemIndex, visibleRect);
     } else {
-      let cachedHeight = (this._cachedPageHeights[itemIndex]);
+      const cachedHeight = (this._cachedPageHeights[itemIndex]);
 
       return cachedHeight ? cachedHeight.height : (this._estimatedPageHeight || DEFAULT_PAGE_HEIGHT);
     }
   }
 
   private _getItemCountForPage(itemIndex: number, visibileRect: IRectangle): number {
-    let itemsPerPage = this.props.getItemCountForPage ? this.props.getItemCountForPage(itemIndex, visibileRect) : DEFAULT_ITEMS_PER_PAGE;
+    const itemsPerPage = this.props.getItemCountForPage ? this.props.getItemCountForPage(itemIndex, visibileRect) : DEFAULT_ITEMS_PER_PAGE;
 
     return itemsPerPage ? itemsPerPage : DEFAULT_ITEMS_PER_PAGE;
   }
@@ -909,7 +910,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   }
 
   private _getRenderCount(props?: IListProps): number {
-    let { items, startIndex, renderCount } = props || this.props;
+    const { items, startIndex, renderCount } = props || this.props;
 
     return (renderCount === undefined ? (items ? items.length - startIndex! : 0) : renderCount);
   }
@@ -925,8 +926,8 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     }
 
     let surfaceRect = this._surfaceRect;
-    let scrollHeight = this._scrollElement && this._scrollElement.scrollHeight;
-    let scrollTop = this._scrollElement ? this._scrollElement.scrollTop : 0;
+    const scrollHeight = this._scrollElement && this._scrollElement.scrollHeight;
+    const scrollTop = this._scrollElement ? this._scrollElement.scrollTop : 0;
 
     // WARNING: EXPENSIVE CALL! We need to know the surface top relative to the window.
     // This needs to be called to recalculate when new pages should be loaded.
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx
index 1801030ef64a6..a55ce1d62f309 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Basic.Example.tsx
@@ -29,9 +29,9 @@ export class ListBasicExample extends React.Component<IListBasicExampleProps, an
   }
 
   public render() {
-    let { items: originalItems } = this.props;
-    let { items } = this.state;
-    let resultCountText = items.length === originalItems.length ? '' : ` (${items.length} of ${originalItems.length} shown)`;
+    const { items: originalItems } = this.props;
+    const { items } = this.state;
+    const resultCountText = items.length === originalItems.length ? '' : ` (${items.length} of ${originalItems.length} shown)`;
 
     return (
       <FocusZone direction={ FocusZoneDirection.vertical }>
@@ -45,7 +45,7 @@ export class ListBasicExample extends React.Component<IListBasicExampleProps, an
   }
 
   private _onFilterChanged(text: string) {
-    let { items } = this.props;
+    const { items } = this.props;
 
     this.setState({
       filterText: text,
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Ghosting.Example.tsx b/packages/office-ui-fabric-react/src/components/List/examples/List.Ghosting.Example.tsx
index df36023f1ddb3..bff85a17d7a2c 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Ghosting.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Ghosting.Example.tsx
@@ -17,7 +17,7 @@ export class ListGhostingExample extends React.Component<IListGhostingExamplePro
   }
 
   public render() {
-    let { items } = this.props;
+    const { items } = this.props;
 
     return (
       <FocusZone direction={ FocusZoneDirection.vertical }>
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx b/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx
index 0ae19f07b449a..aabde8d0484f1 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx
@@ -36,7 +36,7 @@ export class ListScrollingExample extends React.Component<IListScrollingExampleP
   }
 
   public render() {
-    let { items } = this.props;
+    const { items } = this.props;
 
     return (
       <FocusZone direction={ FocusZoneDirection.vertical }>
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
index 13450bab7b0ff..72a441851f777 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
@@ -93,8 +93,8 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
   }
 
   public render(): JSX.Element {
-    let { rootProps, children } = this.props;
-    let { dragRect } = this.state;
+    const { rootProps, children } = this.props;
+    const { dragRect } = this.state;
 
     return (
       <div
@@ -130,11 +130,11 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
 
   /** Determine if the mouse event occured on a scrollbar of the target element. */
   private _isMouseEventOnScrollbar(ev: MouseEvent) {
-    let targetElement = ev.target as HTMLElement;
-    let targetScrollbarWidth = (targetElement.offsetWidth - targetElement.clientWidth);
+    const targetElement = ev.target as HTMLElement;
+    const targetScrollbarWidth = (targetElement.offsetWidth - targetElement.clientWidth);
 
     if (targetScrollbarWidth) {
-      let targetRect = targetElement.getBoundingClientRect();
+      const targetRect = targetElement.getBoundingClientRect();
 
       // Check vertical scroll
       if (getRTL()) {
@@ -158,7 +158,7 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
 
   @autobind
   private _onMouseDown(ev: MouseEvent) {
-    let { isEnabled, onShouldStartSelection } = this.props;
+    const { isEnabled, onShouldStartSelection } = this.props;
 
     // Ensure the mousedown is within the boundaries of the target. If not, it may have been a click on a scrollbar.
     if (this._isMouseEventOnScrollbar(ev)) {
@@ -233,8 +233,8 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
       this._lastMouseEvent = ev;
     }
 
-    let rootRect = this._getRootRect();
-    let currentPoint = { x: ev.clientX - rootRect.left, y: ev.clientY - rootRect.top };
+    const rootRect = this._getRootRect();
+    const currentPoint = { x: ev.clientX - rootRect.left, y: ev.clientY - rootRect.top };
 
     if (!this._dragOrigin) {
       this._dragOrigin = currentPoint;
@@ -252,7 +252,7 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
           this._preservedIndicies = selection && selection.getSelectedIndices && selection.getSelectedIndices();
         }
         // We need to constrain the current point to the rootRect boundaries.
-        let constrainedPoint = this.props.isDraggingConstrainedToRoot ? {
+        const constrainedPoint = this.props.isDraggingConstrainedToRoot ? {
           x: Math.max(0, Math.min(rootRect.width, this._lastMouseEvent!.clientX - rootRect.left)),
           y: Math.max(0, Math.min(rootRect.height, this._lastMouseEvent!.clientY - rootRect.top))
         } : {
@@ -260,7 +260,7 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
             y: this._lastMouseEvent!.clientY - rootRect.top
           };
 
-        let dragRect = {
+        const dragRect = {
           left: Math.min(this._dragOrigin.x, constrainedPoint.x),
           top: Math.min(this._dragOrigin.y, constrainedPoint.y),
           width: Math.abs(constrainedPoint.x - this._dragOrigin.x),
@@ -349,8 +349,8 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
       return;
     }
 
-    let { selection } = this.props;
-    let allElements = this.refs.root.querySelectorAll('[data-selection-index]');
+    const { selection } = this.props;
+    const allElements = this.refs.root.querySelectorAll('[data-selection-index]');
 
     if (!this._itemRectCache) {
       this._itemRectCache = {};
@@ -361,8 +361,8 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
     selection.setAllSelected(false);
 
     for (let i = 0; i < allElements.length; i++) {
-      let element = allElements[i];
-      let index = element.getAttribute('data-selection-index') as string;
+      const element = allElements[i];
+      const index = element.getAttribute('data-selection-index') as string;
 
       // Pull the memoized rectangle for the item, or the get the rect and memoize.
       let itemRect = this._itemRectCache[index];
@@ -397,7 +397,7 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
       }
     }
 
-    for (let index in this._selectedIndicies!) {
+    for (const index in this._selectedIndicies!) {
       if (this._selectedIndicies!.hasOwnProperty(index)) {
         selection.setIndexSelected(Number(index), true, false);
       }
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.test.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.test.tsx
index 50816d1aa2cbe..bb9e3228c718e 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.test.tsx
@@ -8,7 +8,7 @@ import * as renderer from 'react-test-renderer';
 import { MessageBar } from './MessageBar';
 
 describe('MessageBar', () => {
-  let noop = () => {
+  const noop = () => {
     /* no-op */
   };
 
@@ -20,7 +20,7 @@ describe('MessageBar', () => {
 
   it('renders MessageBar correctly', () => {
     const component = renderer.create(<MessageBar>Message</MessageBar>);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
@@ -28,13 +28,13 @@ describe('MessageBar', () => {
     describe('single-line', () => {
       it('is present when onDismiss exists', () => {
         const renderedDOM: HTMLElement = renderIntoDocument(<MessageBar onDismiss={ noop } isMultiline={ false } />);
-        let dismissElement = renderedDOM.querySelector('.ms-MessageBar-dismissal');
+        const dismissElement = renderedDOM.querySelector('.ms-MessageBar-dismissal');
         expect(dismissElement).not.toBeNull();
       });
 
       it('is not present when onDismiss is missing', () => {
         const renderedDOM: HTMLElement = renderIntoDocument(<MessageBar isMultiline={ false } />);
-        let dismissElement = renderedDOM.querySelector('.ms-MessageBar-dismissal');
+        const dismissElement = renderedDOM.querySelector('.ms-MessageBar-dismissal');
         expect(dismissElement).toBeNull();
       });
     });
@@ -42,13 +42,13 @@ describe('MessageBar', () => {
     describe('multi-line', () => {
       it('is present when onDismiss exists', () => {
         const renderedDOM: HTMLElement = renderIntoDocument(<MessageBar onDismiss={ noop } isMultiline={ true } />);
-        let dismissElement = renderedDOM.querySelector('.ms-MessageBar-dismissal');
+        const dismissElement = renderedDOM.querySelector('.ms-MessageBar-dismissal');
         expect(dismissElement).not.toBeNull();
       });
 
       it('is not present when onDismiss is missing', () => {
         const renderedDOM: HTMLElement = renderIntoDocument(<MessageBar isMultiline={ true } />);
-        let dismissElement = renderedDOM.querySelector('.ms-MessageBar-dismissal');
+        const dismissElement = renderedDOM.querySelector('.ms-MessageBar-dismissal');
         expect(dismissElement).toBeNull();
       });
     });
@@ -57,13 +57,13 @@ describe('MessageBar', () => {
   describe('truncated', () => {
     it('is present when onDismiss exists', () => {
       const renderedDOM: HTMLElement = renderIntoDocument(<MessageBar truncated={ true } isMultiline={ false } />);
-      let expandElement = renderedDOM.querySelector('.ms-MessageBar-expand');
+      const expandElement = renderedDOM.querySelector('.ms-MessageBar-expand');
       expect(expandElement).not.toBeNull();
     });
 
     it('is not present when truncated is missing', () => {
       const renderedDOM: HTMLElement = renderIntoDocument(<MessageBar isMultiline={ false } />);
-      let expandElement = renderedDOM.querySelector('.ms-MessageBar-expand');
+      const expandElement = renderedDOM.querySelector('.ms-MessageBar-expand');
       expect(expandElement).toBeNull();
     });
   });
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
index 581ac17e72ccc..b87480c68fd7f 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
@@ -47,7 +47,7 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
   }
 
   public render(): JSX.Element {
-    let { isMultiline } = this.props;
+    const { isMultiline } = this.props;
 
     return isMultiline ? this._renderMultiLine() : this._renderSingleLine();
   }
diff --git a/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx b/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
index 50a068c074b93..edcb7b28c59cd 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
+++ b/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
@@ -81,7 +81,7 @@ export class Modal extends BaseComponent<IModalProps, IDialogState> implements I
   }
 
   public render(): JSX.Element | null {
-    let {
+    const {
       elementToFocusOnDismiss,
       firstFocusableSelector,
       forceFocusInsideTrap,
@@ -95,7 +95,7 @@ export class Modal extends BaseComponent<IModalProps, IDialogState> implements I
       titleAriaId,
       subtitleAriaId,
     } = this.props;
-    let { isOpen, isVisible } = this.state;
+    const { isOpen, isVisible } = this.state;
 
     const modalClassName = css(
       'ms-Modal',
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.test.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.test.tsx
index 13cd615147437..6159a9052325f 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.test.tsx
@@ -17,7 +17,7 @@ describe('Nav', () => {
           }
         ] }
       />);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
index 7f55d49ec036c..e4ce5042d5449 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
@@ -61,7 +61,7 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
     };
 
     if (props.groups) {
-      for (let group of props.groups) {
+      for (const group of props.groups) {
         if (group.collapseByDefault && group.name) {
           this.state.isGroupCollapsed![group.name] = true;
         }
@@ -71,14 +71,14 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
   }
 
   public componentWillReceiveProps(newProps: INavProps) {
-    let newGroups = newProps.groups || [];
-    let isGroupCollapsed = this.state.isGroupCollapsed!;
+    const newGroups = newProps.groups || [];
+    const isGroupCollapsed = this.state.isGroupCollapsed!;
 
     // If the component's props were updated, new groups may have been added, which may have
     // collapseByDefault set. Ensure that setting is respected for any new groups.
     // (If isGroupCollapsed is already set for a group, don't overwrite that.)
     let hasUpdated = false;
-    for (let newGroup of newGroups) {
+    for (const newGroup of newGroups) {
       if (newGroup.name && newGroup.collapseByDefault && !isGroupCollapsed.hasOwnProperty(newGroup.name)) {
         isGroupCollapsed[newGroup.name] = true;
         hasUpdated = true;
@@ -152,7 +152,7 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
         lineHeight: '36px'
       }
     };
-    let {
+    const {
       onRenderLink = this._onRenderLink
     } = this.props;
 
@@ -287,9 +287,9 @@ export class Nav extends BaseComponent<INavProps, INavState> implements INav {
   }
 
   private _onGroupHeaderClicked(group: INavLinkGroup, ev: React.MouseEvent<HTMLElement>): void {
-    let { isGroupCollapsed } = this.state;
-    let groupKey = group.name!;
-    let isCollapsed = !isGroupCollapsed![groupKey];
+    const { isGroupCollapsed } = this.state;
+    const groupKey = group.name!;
+    const isCollapsed = !isGroupCollapsed![groupKey];
 
     if (group.onHeaderClick) {
       group.onHeaderClick(ev, isCollapsed);
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
index e151126bddb1a..c886a5f3eeb83 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
@@ -16,7 +16,7 @@ export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> implements
   private _focusZone: FocusZone;
 
   public render() {
-    let {
+    const {
       items,
       overflowItems,
       onRenderOverflowButton,
@@ -54,7 +54,7 @@ export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> implements
   @autobind
   private _onRenderItems(items: any[]): JSX.Element[] {
     return items.map((item, i) => {
-      let wrapperDivProps: React.HTMLProps<HTMLDivElement> = { className: css('ms-OverflowSet-item', styles.item) };
+      const wrapperDivProps: React.HTMLProps<HTMLDivElement> = { className: css('ms-OverflowSet-item', styles.item) };
       if (item.key) {
         wrapperDivProps.key = item.key;
       }
@@ -68,7 +68,7 @@ export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> implements
 
   @autobind
   private _onRenderOverflowButtonWrapper(items: any[]): JSX.Element {
-    let wrapperDivProps: React.HTMLProps<HTMLDivElement> = { className: css('ms-OverflowSet-overflowButton', styles.item) };
+    const wrapperDivProps: React.HTMLProps<HTMLDivElement> = { className: css('ms-OverflowSet-overflowButton', styles.item) };
     return (
       <div {...wrapperDivProps}>
         { this.props.onRenderOverflowButton(items) }
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.tsx b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.tsx
index 990d2dde00143..508a171162fa9 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.tsx
@@ -10,4 +10,4 @@ import { getStyles } from './Overlay.styles';
 export const Overlay = styled<IOverlayProps, IOverlayStyleProps, IOverlayStyles>(
   OverlayBase,
   getStyles
-);
+);
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.test.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.test.tsx
index 3b200ec3e7b1c..342b065e1f397 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.test.tsx
@@ -27,7 +27,7 @@ describe('Panel', () => {
       dismissedCalled = true;
     };
 
-    let panel: Panel = ReactDOM.render(
+    const panel: Panel = ReactDOM.render(
       <Panel
         isOpen={ true }
         onDismiss={ setDismissTrue }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
index d996d0a5b8c4c..64fdf8039a0d4 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
@@ -75,7 +75,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
   }
 
   public render() {
-    let {
+    const {
       className = '',
       elementToFocusOnDismiss,
       firstFocusableSelector,
@@ -96,10 +96,10 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
       onRenderBody = this._onRenderBody,
       onRenderFooter = this._onRenderFooter
     } = this.props;
-    let { isOpen, isAnimating, id } = this.state;
-    let isLeft = type === PanelType.smallFixedNear ? true : false;
-    let isRTL = getRTL();
-    let isOnRightSide = isRTL ? isLeft : !isLeft;
+    const { isOpen, isAnimating, id } = this.state;
+    const isLeft = type === PanelType.smallFixedNear ? true : false;
+    const isRTL = getRTL();
+    const isOnRightSide = isRTL ? isLeft : !isLeft;
     const headerTextId = id + '-headerText';
     const customWidthStyles = (type === PanelType.custom) ? { width: customWidth } : {};
     const renderProps: IPanelProps = { ...this.props, componentId: id };
@@ -290,8 +290,8 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
 
   @autobind
   private _onRenderFooter(props: IPanelProps): JSX.Element | null {
-    let { isFooterSticky } = this.state;
-    let { onRenderFooterContent = null } = this.props;
+    const { isFooterSticky } = this.state;
+    const { onRenderFooterContent = null } = this.props;
     if (onRenderFooterContent) {
       return (
         <div className={ css('ms-Panel-footer', styles.footer, isFooterSticky && styles.footerIsSticky) } >
@@ -305,10 +305,10 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
   }
 
   private _updateFooterPosition() {
-    let _content = this._content;
+    const _content = this._content;
     if (_content) {
-      let height = _content.clientHeight;
-      let innerHeight = _content.scrollHeight;
+      const height = _content.clientHeight;
+      const innerHeight = _content.scrollHeight;
 
       this.setState({
         isFooterSticky: height < innerHeight ? true : false
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
index 0b2b42c6bcfb2..81aebf2de1a53 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
@@ -22,13 +22,13 @@ describe('Persona', () => {
 
   it('renders Persona correctly with initials', () => {
     const component = renderer.create(<Persona primaryText='Kat Larrson' />);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
   it('renders Persona correctly with image', () => {
     const component = renderer.create(<Persona primaryText='Kat Larrson' imageUrl={ testImage1x1 } />);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
@@ -61,7 +61,7 @@ describe('Persona', () => {
     it('calculates an expected initials in RTL if one was not specified', () => {
       setRTL(true);
       const wrapper = mount(<Persona primaryText='Kat Larrson' />);
-      let result = wrapper.find(STYLES.initials);
+      const result = wrapper.find(STYLES.initials);
       expect(result).toHaveLength(1);
       expect(result.text()).toEqual('LK');
 
@@ -71,7 +71,7 @@ describe('Persona', () => {
     it('uses provided initial', () => {
       setRTL(true);
       const wrapper = mount(<Persona primaryText='Kat Larrson' imageInitials='AT' />);
-      let result = wrapper.find(STYLES.initials);
+      const result = wrapper.find(STYLES.initials);
       expect(result).toHaveLength(1);
       expect(result.text()).toEqual('AT');
 
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index e9e34a8f28424..8842c67993ca2 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -34,17 +34,17 @@ export class Persona extends BaseComponent<IPersonaProps, {}> {
   }
 
   public render() {
-    let {
+    const {
       hidePersonaDetails,
       onRenderPrimaryText,
       onRenderSecondaryText,
       onRenderTertiaryText,
       onRenderOptionalText,
     } = this.props;
-    let size = this.props.size as PersonaSize;
+    const size = this.props.size as PersonaSize;
 
     // These properties are to be explicitly passed into PersonaCoin because they are the only props directly used
-    let {
+    const {
       className,
       coinProps,
       coinSize,
@@ -61,7 +61,7 @@ export class Persona extends BaseComponent<IPersonaProps, {}> {
       onRenderCoin
      } = this.props;
 
-    let personaCoinProps = {
+    const personaCoinProps = {
       coinProps,
       coinSize,
       imageUrl,
@@ -77,8 +77,8 @@ export class Persona extends BaseComponent<IPersonaProps, {}> {
       onRenderCoin
     };
 
-    let divProps = getNativeProps(this.props, divProperties);
-    let personaDetails = (
+    const divProps = getNativeProps(this.props, divProperties);
+    const personaDetails = (
       <div className={ css('ms-Persona-details', styles.details) }>
         { this._renderElement(
           this.props.primaryText,
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
index cce51e3fb0ba9..c3f2e9eff31a2 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
@@ -68,7 +68,7 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
   }
 
   public render(): JSX.Element | null {
-    let {
+    const {
       coinProps,
       coinSize,
       imageUrl,
@@ -81,9 +81,9 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
       imageShouldStartVisible
      } = this.props;
 
-    let size = this.props.size as PersonaSize;
-    let divProps = getNativeProps(this.props, divProperties);
-    let coinSizeStyle = coinSize ? { width: coinSize, height: coinSize } : undefined;
+    const size = this.props.size as PersonaSize;
+    const divProps = getNativeProps(this.props, divProperties);
+    const coinSizeStyle = coinSize ? { width: coinSize, height: coinSize } : undefined;
 
     return (
       <div
@@ -136,7 +136,7 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
 
   @autobind
   private _onRenderCoin(props: IPersonaProps): JSX.Element | null {
-    let {
+    const {
       coinSize,
       imageUrl,
       imageAlt,
@@ -144,7 +144,7 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
       imageShouldStartVisible
     } = this.props;
 
-    let size = this.props.size as PersonaSize;
+    const size = this.props.size as PersonaSize;
 
     return(
       <Image
@@ -163,12 +163,10 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
 
   @autobind
   private _onRenderInitials(props: IPersonaProps): JSX.Element {
-    let {
-      imageInitials,
-      primaryText
-    } = props;
+    let { imageInitials } = props;
+    const { primaryText } = props;
 
-    let isRTL = getRTL();
+    const isRTL = getRTL();
 
     imageInitials = imageInitials || getInitials(primaryText, isRTL);
 
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaInitialsColor.ts b/packages/office-ui-fabric-react/src/components/Persona/PersonaInitialsColor.ts
index 0bbc1ed99de78..b934ecbd4b5da 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaInitialsColor.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaInitialsColor.ts
@@ -82,7 +82,8 @@ function personaInitialsColorToHexCode(personaInitialsColor: PersonaInitialsColo
 }
 
 export function initialsColorPropToColorCode(props: IPersonaProps): string {
-  let { initialsColor, primaryText } = props;
+  const { primaryText } = props;
+  let { initialsColor } = props;
   let initialsColorCode: string;
   if (typeof initialsColor === 'string') {
     initialsColorCode = initialsColor;
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaPresence.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaPresence.tsx
index 354ddf29ebef8..4e37187e95313 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaPresence.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaPresence.tsx
@@ -47,7 +47,7 @@ export class PersonaPresence extends React.Component<IPersonaProps, {}> {
 
   @autobind
   private _determineIcon(): string | undefined {
-    let { presence } = this.props;
+    const { presence } = this.props;
 
     if (presence !== PersonaPresenceEnum.none) {
       let userPresence = PersonaPresenceEnum[presence as PersonaPresenceEnum];
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Alternate.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Alternate.Example.tsx
index 19c278e5734ce..ad08d5d1851fc 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Alternate.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Alternate.Example.tsx
@@ -28,7 +28,7 @@ export class PersonaAlternateExample extends React.Component<{}, {
   }
 
   public render() {
-    let { renderPersonaDetails } = this.state;
+    const { renderPersonaDetails } = this.state;
 
     return (
       <div className='ms-PersonaExample'>
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
index 32aa9479c263d..6fa37608e63e8 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
@@ -32,7 +32,7 @@ export class PersonaBasicExample extends React.Component<{}, {
   }
 
   public render() {
-    let { renderPersonaDetails } = this.state;
+    const { renderPersonaDetails } = this.state;
 
     return (
       <div>
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomCoinRender.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomCoinRender.Example.tsx
index ce7618c9e61e1..3eb019c58f4b2 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomCoinRender.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomCoinRender.Example.tsx
@@ -40,7 +40,7 @@ export class PersonaCustomCoinRenderExample extends React.Component {
 
   @autobind
   private _onRenderCoin(props: IPersonaProps): JSX.Element {
-    let {
+    const {
       coinSize,
       imageUrl,
       imageAlt,
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.test.tsx b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.test.tsx
index 2f0951b9c4198..d205a76ad6fab 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.test.tsx
@@ -11,7 +11,7 @@ describe('Pivot', () => {
         <PivotItem linkText='' />
         <PivotItem linkText='' />
       </Pivot>);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
index 2fad626d665d3..728d2cca54ec5 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
@@ -183,7 +183,7 @@ export class Pivot extends BaseComponent<IPivotProps, IPivotState> {
 
     const itemKey: string = this.state.selectedKey;
     const index = this._keyToIndexMapping[itemKey];
-    let { selectedTabId } = this.state;
+    const { selectedTabId } = this.state;
 
     return (
       <div
diff --git a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
index 23cd996751eda..720b5aa88f8ca 100644
--- a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
+++ b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
@@ -55,7 +55,7 @@ export class Popup extends BaseComponent<IPopupProps, {}> {
   }
 
   public render() {
-    let { role, className, ariaLabel, ariaLabelledBy, ariaDescribedBy, style } = this.props;
+    const { role, className, ariaLabel, ariaLabelledBy, ariaDescribedBy, style } = this.props;
 
     let needsVerticalScrollBar = false;
     if (this.refs.root && this.refs.root.firstElementChild) {
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx
index f4085b75881c2..1d141ee60b873 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.tsx
@@ -31,7 +31,8 @@ export class ProgressIndicator extends BaseComponent<IProgressIndicatorProps, {}
   }
 
   public render() {
-    let { title, label, description, percentComplete, className, ariaValueText } = this.props;
+    const { title, description, className, ariaValueText } = this.props;
+    let { label, percentComplete } = this.props;
 
     // Handle deprecated value.
     if (title) {
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Basic.Example.tsx
index a8a5c9fc121b1..d83192cc2717c 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Basic.Example.tsx
@@ -37,7 +37,7 @@ export class ProgressIndicatorBasicExample extends React.Component<{}, IProgress
   }
 
   public render() {
-    let { percentComplete } = this.state;
+    const { percentComplete } = this.state;
 
     return (
       <ProgressIndicator
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.base.tsx b/packages/office-ui-fabric-react/src/components/Rating/Rating.base.tsx
index ae02307082db4..d9ab8a8b3b480 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.base.tsx
@@ -76,10 +76,10 @@ export class RatingBase extends BaseComponent<IRatingProps, IRatingState> {
   }
 
   public render() {
-    let id = this._id;
-    let stars = [];
-    let starIds = [];
-    let {
+    const id = this._id;
+    const stars = [];
+    const starIds = [];
+    const {
       disabled,
       getAriaLabel,
       getStyles,
@@ -97,7 +97,7 @@ export class RatingBase extends BaseComponent<IRatingProps, IRatingState> {
     });
 
     for (let i = min as number; i <= (max as number); i++) {
-      let ratingStarProps: IRatingStarProps = {
+      const ratingStarProps: IRatingStarProps = {
         fillPercentage: this._getFillingPercentage(i),
         disabled: disabled ? true : false,
         classNames: this._classNames
@@ -188,7 +188,7 @@ export class RatingBase extends BaseComponent<IRatingProps, IRatingState> {
   }
 
   private _getFillingPercentage(starPosition: number): number {
-    let ceilValue = Math.ceil((this.state.rating as number));
+    const ceilValue = Math.ceil((this.state.rating as number));
     let fillPercentage = 100;
 
     if (starPosition === this.state.rating) {
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx b/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
index d98139e79d00b..df7e19f8bb00b 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
@@ -13,7 +13,7 @@ import { getStyles } from './Rating.styles';
 describe('Rating', () => {
   it('Renders Rating correctly', () => {
     const component = renderer.create(<Rating />);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
@@ -33,14 +33,14 @@ describe('Rating', () => {
       threwException = true;
     }
     expect(threwException).toEqual(false);
-    let renderedDOM = ReactDOM.findDOMNode(rating as React.ReactInstance);
+    const renderedDOM = ReactDOM.findDOMNode(rating as React.ReactInstance);
 
-    let ratingButtons = renderedDOM.querySelectorAll('.ms-Rating-button');
-    let ratingFrontStars = renderedDOM.querySelectorAll('.ms-RatingStar-front');
+    const ratingButtons = renderedDOM.querySelectorAll('.ms-Rating-button');
+    const ratingFrontStars = renderedDOM.querySelectorAll('.ms-RatingStar-front');
 
     const checkState = (ratingToCheck: number, state: string) => {
-      let iconElement = ratingFrontStars[ratingToCheck - 1] as HTMLElement;
-      let width = iconElement.style.width;
+      const iconElement = ratingFrontStars[ratingToCheck - 1] as HTMLElement;
+      const width = iconElement.style.width;
       expect(width).toEqual(state);
     };
 
@@ -76,13 +76,13 @@ describe('Rating', () => {
     }
     expect(threwException).toEqual(false);
 
-    let renderedDOM = ReactDOM.findDOMNode(rating as React.ReactInstance);
+    const renderedDOM = ReactDOM.findDOMNode(rating as React.ReactInstance);
 
-    let ratingFrontStars = renderedDOM.querySelectorAll('.ms-RatingStar-front');
+    const ratingFrontStars = renderedDOM.querySelectorAll('.ms-RatingStar-front');
 
     const checkState = (ratingToCheck: number, state: string) => {
-      let iconElement = ratingFrontStars[ratingToCheck - 1] as HTMLElement;
-      let width = iconElement.style.width;
+      const iconElement = ratingFrontStars[ratingToCheck - 1] as HTMLElement;
+      const width = iconElement.style.width;
       expect(width).toEqual(state);
     };
 
@@ -112,12 +112,12 @@ describe('Rating', () => {
     }
     expect(threwException).toEqual(false);
 
-    let renderedDOM = ReactDOM.findDOMNode(rating as React.ReactInstance);
-    let ratingFrontStars = renderedDOM.querySelectorAll('.ms-RatingStar-front');
+    const renderedDOM = ReactDOM.findDOMNode(rating as React.ReactInstance);
+    const ratingFrontStars = renderedDOM.querySelectorAll('.ms-RatingStar-front');
 
     const checkState = (ratingToCheck: number, state: string) => {
-      let iconElement = ratingFrontStars[ratingToCheck - 1] as HTMLElement;
-      let width = iconElement.style.width;
+      const iconElement = ratingFrontStars[ratingToCheck - 1] as HTMLElement;
+      const width = iconElement.style.width;
       expect(width).toEqual(state);
     };
 
@@ -146,8 +146,8 @@ describe('Rating', () => {
     }
     expect(threwException).toEqual(false);
 
-    let renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
-    let ratingButtons = renderedDOM.querySelectorAll('.ms-Rating-button');
+    const renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
+    const ratingButtons = renderedDOM.querySelectorAll('.ms-Rating-button');
     expect((ratingButtons[0] as HTMLButtonElement).disabled).toEqual(true);
     expect((ratingButtons[1] as HTMLButtonElement).disabled).toEqual(true);
     expect((ratingButtons[2] as HTMLButtonElement).disabled).toEqual(true);
@@ -175,18 +175,18 @@ describe('Rating', () => {
     }
     expect(threwException).toEqual(false);
 
-    let renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
-    let ratingButtons = renderedDOM.querySelectorAll('.ms-Rating-button');
+    const renderedDOM = ReactDOM.findDOMNode(choiceGroup as React.ReactInstance);
+    const ratingButtons = renderedDOM.querySelectorAll('.ms-Rating-button');
     expect((ratingButtons[0] as HTMLButtonElement).disabled).toEqual(true);
     expect((ratingButtons[1] as HTMLButtonElement).disabled).toEqual(true);
     expect((ratingButtons[2] as HTMLButtonElement).disabled).toEqual(true);
     expect((ratingButtons[3] as HTMLButtonElement).disabled).toEqual(true);
     expect((ratingButtons[4] as HTMLButtonElement).disabled).toEqual(true);
 
-    let ratingFrontStars = renderedDOM.querySelectorAll('.ms-RatingStar-front');
+    const ratingFrontStars = renderedDOM.querySelectorAll('.ms-RatingStar-front');
     const checkState = (ratingToCheck: number, state: string) => {
-      let iconElement = ratingFrontStars[ratingToCheck - 1] as HTMLElement;
-      let width = iconElement.style.width;
+      const iconElement = ratingFrontStars[ratingToCheck - 1] as HTMLElement;
+      const width = iconElement.style.width;
       expect(width).toEqual(state);
     };
 
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
index d5d8e2e6305b6..7206855a69417 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
@@ -62,7 +62,7 @@ describe('ResizeGroup', () => {
       const getNextResizeGroupState = getNextResizeGroupStateProvider().getNextState;
       const getMeasuredElementWidthStub = sinon.stub();
 
-      let result = getNextResizeGroupState(resizeGroupProps,
+      const result = getNextResizeGroupState(resizeGroupProps,
         resizeGroupState,
         getMeasuredElementWidthStub);
 
@@ -78,7 +78,7 @@ describe('ResizeGroup', () => {
       const getMeasuredElementWidthStub = sinon.stub();
       getMeasuredElementWidthStub.returns(25);
 
-      let result = getNextResizeGroupState(resizeGroupProps,
+      const result = getNextResizeGroupState(resizeGroupProps,
         resizeGroupState,
         getMeasuredElementWidthStub,
         50);
@@ -101,7 +101,7 @@ describe('ResizeGroup', () => {
       const getMeasuredElementWidthStub = sinon.stub();
       getMeasuredElementWidthStub.returns(25);
 
-      let result = getNextResizeGroupState(resizeGroupProps,
+      const result = getNextResizeGroupState(resizeGroupProps,
         resizeGroupState,
         getMeasuredElementWidthStub,
         10);
@@ -117,7 +117,7 @@ describe('ResizeGroup', () => {
     it('does not call getMeasuredElementBounds when the data has already been cached', () => {
       const dataToMeasure = { index: 5, cacheKey: 'foo' };
 
-      let measurementCache = getMeasurementCache();
+      const measurementCache = getMeasurementCache();
       measurementCache.addMeasurementToCache(dataToMeasure, 40);
       const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache).getNextState;
 
@@ -125,7 +125,7 @@ describe('ResizeGroup', () => {
       const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'shrink' };
       const measuredElementWidthStub = sinon.stub();
 
-      let result = getNextResizeGroupState(resizeGroupProps,
+      const result = getNextResizeGroupState(resizeGroupProps,
         resizeGroupState,
         measuredElementWidthStub,
         100);
@@ -144,7 +144,7 @@ describe('ResizeGroup', () => {
       { cacheKey: '4' },
       { cacheKey: '3' }];
 
-      let measurementCache = getMeasurementCache();
+      const measurementCache = getMeasurementCache();
       measurementCache.addMeasurementToCache(dataArray[0], 50);
       measurementCache.addMeasurementToCache(dataArray[1], 40);
       measurementCache.addMeasurementToCache(dataArray[2], 5);
@@ -157,7 +157,7 @@ describe('ResizeGroup', () => {
       const resizeGroupState: IResizeGroupState = { dataToMeasure: dataArray[0], resizeDirection: 'shrink' };
       const measuredElementWidthStub = sinon.stub();
 
-      let result = getNextResizeGroupState(resizeGroupProps,
+      const result = getNextResizeGroupState(resizeGroupProps,
         resizeGroupState,
         measuredElementWidthStub,
         10);
@@ -175,7 +175,7 @@ describe('ResizeGroup', () => {
       const dataArray = [{ cacheKey: '5' },
       { cacheKey: '4' }];
 
-      let measurementCache = getMeasurementCache();
+      const measurementCache = getMeasurementCache();
       measurementCache.addMeasurementToCache(dataArray[0], 50);
       const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache).getNextState;
 
@@ -185,7 +185,7 @@ describe('ResizeGroup', () => {
       const resizeGroupState: IResizeGroupState = { dataToMeasure: dataArray[0], resizeDirection: 'shrink' };
       const measuredElementWidthStub = sinon.stub();
 
-      let result = getNextResizeGroupState(resizeGroupProps,
+      const result = getNextResizeGroupState(resizeGroupProps,
         resizeGroupState,
         measuredElementWidthStub,
         10);
@@ -210,7 +210,7 @@ describe('ResizeGroup', () => {
       const getMeasuredElementWidthStub = sinon.stub();
       getMeasuredElementWidthStub.returns(25);
 
-      let result = getNextResizeGroupState(resizeGroupProps,
+      const result = getNextResizeGroupState(resizeGroupProps,
         resizeGroupState,
         getMeasuredElementWidthStub,
         10);
@@ -228,7 +228,7 @@ describe('ResizeGroup', () => {
       const dataArray = [{ cacheKey: '5' },
       { cacheKey: '4' }];
 
-      let measurementCache = getMeasurementCache();
+      const measurementCache = getMeasurementCache();
       measurementCache.addMeasurementToCache(dataArray[0], 50);
       measurementCache.addMeasurementToCache(dataArray[1], 40);
       const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache).getNextState;
@@ -240,7 +240,7 @@ describe('ResizeGroup', () => {
       const resizeGroupState: IResizeGroupState = { dataToMeasure: dataArray[0], resizeDirection: 'shrink' };
       const measuredElementWidthStub = sinon.stub();
 
-      let result = getNextResizeGroupState(resizeGroupProps,
+      const result = getNextResizeGroupState(resizeGroupProps,
         resizeGroupState,
         measuredElementWidthStub,
         10);
@@ -259,7 +259,7 @@ describe('ResizeGroup', () => {
       const getNextResizeGroupState = getNextResizeGroupStateProvider().getNextState;
       const getMeasuredElementWidthStub = sinon.stub();
 
-      let result = getNextResizeGroupState(resizeGroupProps,
+      const result = getNextResizeGroupState(resizeGroupProps,
         {},
         getMeasuredElementWidthStub,
         50);
@@ -285,11 +285,11 @@ describe('ResizeGroup', () => {
         initialWidth);
 
       // Pass in a state that reflects some rendered data
-      let currentState = {
+      const currentState = {
         renderedData: renderedData
       };
 
-      let result = getNextResizeGroupState(resizeGroupProps,
+      const result = getNextResizeGroupState(resizeGroupProps,
         currentState,
         getMeasuredElementWidthStub,
         reducedWidth);
@@ -320,11 +320,11 @@ describe('ResizeGroup', () => {
         initialWidth);
 
       // Pass in a state that reflects some rendered data
-      let currentState = {
+      const currentState = {
         renderedData: renderedData
       };
 
-      let result = getNextResizeGroupState(resizeGroupProps,
+      const result = getNextResizeGroupState(resizeGroupProps,
         currentState,
         getMeasuredElementWidthStub,
         increasedWidth);
@@ -346,7 +346,7 @@ describe('ResizeGroup', () => {
       const getMeasuredElementWidthStub = sinon.stub();
       getMeasuredElementWidthStub.returns(25);
 
-      let result = getNextResizeGroupState(resizeGroupProps,
+      const result = getNextResizeGroupState(resizeGroupProps,
         resizeGroupState,
         getMeasuredElementWidthStub,
         50);
@@ -369,7 +369,7 @@ describe('ResizeGroup', () => {
       const getMeasuredElementWidthStub = sinon.stub();
       getMeasuredElementWidthStub.returns(100);
 
-      let result = getNextResizeGroupState(resizeGroupProps,
+      const result = getNextResizeGroupState(resizeGroupProps,
         resizeGroupState,
         getMeasuredElementWidthStub,
         72);
@@ -393,7 +393,7 @@ describe('ResizeGroup', () => {
       const getMeasuredElementWidthStub = sinon.stub();
       getMeasuredElementWidthStub.returns(25);
 
-      let result = getNextResizeGroupState(resizeGroupProps,
+      const result = getNextResizeGroupState(resizeGroupProps,
         resizeGroupState,
         getMeasuredElementWidthStub,
         50);
@@ -416,7 +416,7 @@ describe('ResizeGroup', () => {
       const getMeasuredElementWidthStub = sinon.stub();
       getMeasuredElementWidthStub.returns(75);
 
-      let result = getNextResizeGroupState(resizeGroupProps,
+      const result = getNextResizeGroupState(resizeGroupProps,
         resizeGroupState,
         getMeasuredElementWidthStub,
         40);
@@ -441,7 +441,7 @@ describe('ResizeGroup', () => {
       const getMeasuredElementWidthStub = sinon.stub();
       getMeasuredElementWidthStub.returns(25);
 
-      let result = getNextResizeGroupState(resizeGroupProps,
+      const result = getNextResizeGroupState(resizeGroupProps,
         resizeGroupState,
         getMeasuredElementWidthStub,
         40);
@@ -474,11 +474,11 @@ describe('ResizeGroup', () => {
         initialWidth);
 
       // Pass in a state that reflects some rendered data
-      let currentState = {
+      const currentState = {
         renderedData: renderedData
       };
 
-      let result = getNextResizeGroupState(resizeGroupProps,
+      const result = getNextResizeGroupState(resizeGroupProps,
         currentState,
         getMeasuredElementWidthStub,
         increasedWidth);
@@ -505,7 +505,7 @@ describe('ResizeGroup', () => {
       const resizeGroupState: IResizeGroupState = { dataToMeasure, resizeDirection: 'grow' };
       const measuredElementWidthStub = sinon.stub();
 
-      let result = getNextResizeGroupState(resizeGroupProps,
+      const result = getNextResizeGroupState(resizeGroupProps,
         resizeGroupState,
         measuredElementWidthStub,
         100);
@@ -538,7 +538,7 @@ describe('ResizeGroup', () => {
       const resizeGroupState: IResizeGroupState = { dataToMeasure: dataArray[0], resizeDirection: 'grow' };
       const measuredElementWidthStub = sinon.stub();
 
-      let result = getNextResizeGroupState(resizeGroupProps,
+      const result = getNextResizeGroupState(resizeGroupProps,
         resizeGroupState,
         measuredElementWidthStub,
         100);
@@ -555,7 +555,7 @@ describe('ResizeGroup', () => {
       const dataArray = [{ cacheKey: '5' },
       { cacheKey: '6' }];
 
-      let measurementCache = getMeasurementCache();
+      const measurementCache = getMeasurementCache();
       measurementCache.addMeasurementToCache(dataArray[0], 40);
       const getNextResizeGroupState = getNextResizeGroupStateProvider(measurementCache).getNextState;
 
@@ -566,7 +566,7 @@ describe('ResizeGroup', () => {
       const resizeGroupState: IResizeGroupState = { dataToMeasure: dataArray[0], resizeDirection: 'grow' };
       const measuredElementWidthStub = sinon.stub();
 
-      let result = getNextResizeGroupState(resizeGroupProps,
+      const result = getNextResizeGroupState(resizeGroupProps,
         resizeGroupState,
         measuredElementWidthStub,
         100);
@@ -595,7 +595,7 @@ describe('ResizeGroup', () => {
       initialWidth);
 
     // Pass in a state that reflects some rendered data
-    let currentState: IResizeGroupState = {
+    const currentState: IResizeGroupState = {
       renderedData: renderedData,
       dataToMeasure: { index: 8 },
       resizeDirection: 'grow'
@@ -603,7 +603,7 @@ describe('ResizeGroup', () => {
 
     resizeGroupProps.onReduceData.returns({ index: 7 });
 
-    let result = getNextResizeGroupState(resizeGroupProps,
+    const result = getNextResizeGroupState(resizeGroupProps,
       currentState,
       getMeasuredElementWidthStub,
       initialWidth);
@@ -623,7 +623,7 @@ describe('ResizeGroup', () => {
   it('does not render to the hidden div when there is no dataToMeasure', () => {
     const resizeGroupStateProvider = getNextResizeGroupStateProvider();
 
-    let result = resizeGroupStateProvider.shouldRenderDataToMeasureInHiddenDiv(undefined);
+    const result = resizeGroupStateProvider.shouldRenderDataToMeasureInHiddenDiv(undefined);
 
     expect(result).toEqual(false);
   });
@@ -631,18 +631,18 @@ describe('ResizeGroup', () => {
   it('does render to the hidden div when there is dataToMeasure', () => {
     const resizeGroupStateProvider = getNextResizeGroupStateProvider();
 
-    let result = resizeGroupStateProvider.shouldRenderDataToMeasureInHiddenDiv({ index: 18 });
+    const result = resizeGroupStateProvider.shouldRenderDataToMeasureInHiddenDiv({ index: 18 });
 
     expect(result).toEqual(true);
   });
 
   it('does not render to the hidden div when there is dataToMeasure that is in the cache', () => {
-    let data = { index: 8, cacheKey: 'myCoolCacheKey' };
+    const data = { index: 8, cacheKey: 'myCoolCacheKey' };
     const measurementCache = getMeasurementCache();
     measurementCache.addMeasurementToCache(data, 12);
     const resizeGroupStateProvider = getNextResizeGroupStateProvider(measurementCache);
 
-    let result = resizeGroupStateProvider.shouldRenderDataToMeasureInHiddenDiv(data);
+    const result = resizeGroupStateProvider.shouldRenderDataToMeasureInHiddenDiv(data);
 
     expect(result).toEqual(false);
   });
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index e5223f184f9d2..d5aafd70197b4 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -86,12 +86,12 @@ export const getNextResizeGroupStateProvider = (measurementCache = getMeasuremen
    * is not in the cache.
    */
   function _getMeasuredWidth(measuredData: any, getElementToMeasureWidth: () => number): number {
-    let cachedWidth = _measurementCache.getCachedMeasurement(measuredData);
+    const cachedWidth = _measurementCache.getCachedMeasurement(measuredData);
     if (cachedWidth !== undefined) {
       return cachedWidth;
     }
 
-    let measuredWidth = getElementToMeasureWidth();
+    const measuredWidth = getElementToMeasureWidth();
     _measurementCache.addMeasurementToCache(measuredData, measuredWidth);
     return measuredWidth;
   }
@@ -111,7 +111,7 @@ export const getNextResizeGroupStateProvider = (measurementCache = getMeasuremen
     let measuredWidth: number | undefined = _getMeasuredWidth(data, getElementToMeasureWidth);
 
     while (measuredWidth > _containerWidth!) {
-      let nextMeasuredData = onReduceData(dataToMeasure);
+      const nextMeasuredData = onReduceData(dataToMeasure);
 
       // We don't want to get stuck in an infinite render loop when there are no more
       // scaling steps, so implementations of onReduceData should return undefined when
@@ -159,7 +159,7 @@ export const getNextResizeGroupStateProvider = (measurementCache = getMeasuremen
     let measuredWidth: number | undefined = _getMeasuredWidth(data, getElementToMeasureWidth);
 
     while (measuredWidth < _containerWidth!) {
-      let nextMeasuredData = onGrowData(dataToMeasure);
+      const nextMeasuredData = onGrowData(dataToMeasure);
 
       // We don't want to get stuck in an infinite render loop when there are no more
       // scaling steps, so implementations of onGrowData should return undefined when
@@ -350,7 +350,7 @@ export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupSt
       if (this.state.measureContainer) {
         containerWidth = this._root.getBoundingClientRect().width;
       }
-      let nextState = this._nextResizeGroupStateProvider.getNextState(this.props,
+      const nextState = this._nextResizeGroupStateProvider.getNextState(this.props,
         this.state,
         () => this._measured.scrollWidth,
         containerWidth);
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx
index c524b669e938a..f92c0febb1428 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.FlexBox.Example.tsx
@@ -39,7 +39,7 @@ const BoxWithLabel: React.StatelessComponent<IBoxWithLabelProps> =
   (props: IBoxWithLabelProps) => (<div className={ getNumberedBoxClassName(props.backgroundColor) } >{ props.label }</div >);
 
 function renderBoxWithLabels(count: number, backgroundColor: string): JSX.Element[] {
-  let result: JSX.Element[] = [];
+  const result: JSX.Element[] = [];
   for (let i = 1; i <= count; i += 1) {
     result.push(
       <BoxWithLabel
@@ -82,7 +82,7 @@ function onReduceData(props: ILeftRightBoxSetProps): ILeftRightBoxSetProps | und
 
 export class FlexBoxResizeGroupExample extends BaseComponent<{}, {}> {
   public render() {
-    let data: ILeftRightBoxSetProps = { leftCount: 5, rightCount: 5, cacheKey: '10' };
+    const data: ILeftRightBoxSetProps = { leftCount: 5, rightCount: 5, cacheKey: '10' };
     return (
       <ResizeGroup
         data={ data }
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
index 0888d19501e45..196ab527f905e 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
@@ -18,10 +18,10 @@ export interface IOverflowData {
 
 function generateData(count: number, cachingEnabled: boolean, checked: boolean): IOverflowData {
   const icons = ['Add', 'Share', 'Upload'];
-  let dataItems = [];
+  const dataItems = [];
   let cacheKey = '';
   for (let index = 0; index < count; index++) {
-    let item = {
+    const item = {
       key: `item${index}`,
       name: `Item ${index}`,
       icon: icons[index % icons.length],
@@ -70,8 +70,8 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<{}, IResizeGrou
   }
 
   public render() {
-    let { numberOfItems, cachingEnabled, buttonsChecked, short, onGrowDataEnabled } = this.state;
-    let dataToRender = generateData(numberOfItems, cachingEnabled, buttonsChecked);
+    const { numberOfItems, cachingEnabled, buttonsChecked, short, onGrowDataEnabled } = this.state;
+    const dataToRender = generateData(numberOfItems, cachingEnabled, buttonsChecked);
     return (
       <div className={ short ? styles.resizeIsShort : 'notResized' }>
         <ResizeGroup
@@ -137,8 +137,8 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<{}, IResizeGrou
       return undefined;
     }
 
-    let overflow = [...currentData.primary.slice(-1), ...currentData.overflow];
-    let primary = currentData.primary.slice(0, -1);
+    const overflow = [...currentData.primary.slice(-1), ...currentData.overflow];
+    const primary = currentData.primary.slice(0, -1);
 
     let cacheKey = undefined;
     if (this.state.cachingEnabled) {
@@ -153,8 +153,8 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<{}, IResizeGrou
       return undefined;
     }
 
-    let overflow = currentData.overflow.slice(1);
-    let primary = [...currentData.primary, ...currentData.overflow.slice(0, 1)];
+    const overflow = currentData.overflow.slice(1);
+    const primary = [...currentData.primary, ...currentData.overflow.slice(0, 1)];
 
     let cacheKey = undefined;
     if (this.state.cachingEnabled) {
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx
index 2d5df4ba126d1..f2ca794437da9 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx
@@ -7,7 +7,7 @@ import './ScrollablePane.Example.scss';
 export class ScrollablePaneDefaultExample extends React.Component {
 
   public render() {
-    let contentAreas: JSX.Element[] = [];
+    const contentAreas: JSX.Element[] = [];
     for (let i = 0; i < 4; i++) {
       contentAreas.push(this._createContentArea(i));
     }
@@ -22,7 +22,7 @@ export class ScrollablePaneDefaultExample extends React.Component {
   }
 
   private _getRandomColor() {
-    let letters = 'BCDEF'.split('');
+    const letters = 'BCDEF'.split('');
     let color = '#';
     for (let i = 0; i < 6; i++) {
       color += letters[Math.floor(Math.random() * letters.length)];
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.DetailsList.Example.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.DetailsList.Example.tsx
index cf360d711d8ae..d03049bf316b0 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.DetailsList.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.DetailsList.Example.tsx
@@ -24,13 +24,13 @@ import {
 } from 'office-ui-fabric-react/lib/Sticky';
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
 
-let _items: {
+const _items: {
   key: number,
   name: string,
   value: number
 }[] = [];
 
-let _columns: IColumn[] = [
+const _columns: IColumn[] = [
   {
     key: 'column1',
     name: 'Name',
@@ -82,7 +82,7 @@ export class ScrollablePaneDetailsListExample extends React.Component<{}, {
   }
 
   public render() {
-    let { items, selectionDetails } = this.state;
+    const { items, selectionDetails } = this.state;
 
     return (
       <ScrollablePane>
@@ -124,7 +124,7 @@ export class ScrollablePaneDetailsListExample extends React.Component<{}, {
   }
 
   private _getSelectionDetails(): string {
-    let selectionCount = this._selection.getSelectedCount();
+    const selectionCount = this._selection.getSelectedCount();
 
     switch (selectionCount) {
       case 0:
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
index d5a5fc52af40b..31c52fd15213a 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
@@ -54,8 +54,8 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
   }
 
   public render() {
-    let { labelText, className, disabled, underlined, getStyles, theme, clearButtonProps } = this.props;
-    let { value, hasFocus, id } = this.state;
+    const { labelText, className, disabled, underlined, getStyles, theme, clearButtonProps } = this.props;
+    const { value, hasFocus, id } = this.state;
 
     const classNames = getClassNames(getStyles!, {
       theme: theme!,
@@ -140,7 +140,7 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
 
   @autobind
   private _onClearClick(ev: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>) {
-    let { clearButtonProps } = this.props;
+    const { clearButtonProps } = this.props;
 
     if (clearButtonProps && clearButtonProps.onClick) {
       clearButtonProps.onClick(ev);
@@ -208,7 +208,7 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
   }
 
   private _callOnChange(newValue: string): void {
-    let { onChange, onChanged } = this.props;
+    const { onChange, onChanged } = this.props;
 
     // Call @deprecated method.
     if (onChanged) {
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.test.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.test.tsx
index 00f651c4b2d6a..05bde0d95edb3 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.test.tsx
@@ -12,7 +12,7 @@ describe('SearchBox', () => {
 
   it('renders SearchBox correctly', () => {
     const component = renderer.create(<SearchBox />);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
index e5969c31c6c9e..147ad56e7e29e 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
@@ -13,34 +13,34 @@ describe('Slider', () => {
 
   it('renders Slider correctly', () => {
     const component = renderer.create(<Slider />);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
   it('renders a slider', () => {
-    let component = ReactTestUtils.renderIntoDocument(
+    const component = ReactTestUtils.renderIntoDocument(
       <Slider label='slider' />
     );
-    let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
-    let labelElement = renderedDOM.querySelector('.ms-Label') as HTMLElement;
+    const renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
+    const labelElement = renderedDOM.querySelector('.ms-Label') as HTMLElement;
 
     expect(labelElement.textContent).toEqual('slider');
   });
 
   it('can slide to default min/max and execute onChange', () => {
     let changedValue;
-    let onChange = (val: any) => {
+    const onChange = (val: any) => {
       changedValue = val;
     };
-    let component = ReactTestUtils.renderIntoDocument<React.ReactInstance>(
+    const component = ReactTestUtils.renderIntoDocument<React.ReactInstance>(
       <Slider
         onChange={ onChange }
       />
     );
 
-    let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
-    let sliderLine = renderedDOM.querySelector('.ms-Slider-line') as HTMLElement;
-    let sliderThumb = renderedDOM.querySelector('.ms-Slider-slideBox') as HTMLElement;
+    const renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
+    const sliderLine = renderedDOM.querySelector('.ms-Slider-line') as HTMLElement;
+    const sliderThumb = renderedDOM.querySelector('.ms-Slider-slideBox') as HTMLElement;
 
     sliderLine.getBoundingClientRect = () => ({
       left: 0,
@@ -71,15 +71,15 @@ describe('Slider', () => {
   });
 
   it('has type=button on all buttons', () => {
-    let component = ReactTestUtils.renderIntoDocument<React.ReactInstance>(
+    const component = ReactTestUtils.renderIntoDocument<React.ReactInstance>(
       <Slider />
     );
 
-    let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
-    let allButtons = renderedDOM.querySelectorAll('button');
+    const renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
+    const allButtons = renderedDOM.querySelectorAll('button');
 
     for (let i = 0; i < allButtons.length; i++) {
-      let button = allButtons[i];
+      const button = allButtons[i];
 
       expect(button.getAttribute('type')).toEqual('button');
     }
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
index afde5e2399d8c..784b057a35214 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
@@ -52,7 +52,7 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
 
     this._id = getId('Slider');
 
-    let value = props.value || props.defaultValue || props.min;
+    const value = props.value || props.defaultValue || props.min;
 
     this.state = {
       value: value,
@@ -66,7 +66,7 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
   public componentWillReceiveProps(newProps: ISliderProps): void {
 
     if (newProps.value !== undefined) {
-      let value = Math.max(newProps.min as number, Math.min(newProps.max as number, newProps.value));
+      const value = Math.max(newProps.min as number, Math.min(newProps.max as number, newProps.value));
 
       this.setState({
         value: value,
@@ -174,7 +174,7 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
   }
 
   private _getThumbStyle(vertical: boolean | undefined, thumbOffsetPercent: number): any {
-    let direction: string = vertical ? 'bottom' : (getRTL() ? 'right' : 'left');
+    const direction: string = vertical ? 'bottom' : (getRTL() ? 'right' : 'left');
     return {
       [direction]: thumbOffsetPercent + '%'
     };
@@ -203,11 +203,11 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     let distance: number | undefined;
 
     if (!this.props.vertical) {
-      let left: number | undefined = this._getPosition(event, this.props.vertical);
+      const left: number | undefined = this._getPosition(event, this.props.vertical);
       distance = getRTL() ? sliderPositionRect.right - left! : left! - sliderPositionRect.left;
       currentSteps = distance / stepLength;
     } else {
-      let bottom: number | undefined = this._getPosition(event, this.props.vertical);
+      const bottom: number | undefined = this._getPosition(event, this.props.vertical);
       distance = sliderPositionRect.bottom - bottom!;
       currentSteps = distance / stepLength;
     }
@@ -248,11 +248,11 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     return currentPosition;
   }
   private _updateValue(value: number, renderedValue: number) {
-    let interval: number = 1.0 / this.props.step!;
+    const interval: number = 1.0 / this.props.step!;
     // Make sure value has correct number of decimal places based on steps without JS's floating point issues
-    let roundedValue: number = Math.round(value * interval) / interval;
+    const roundedValue: number = Math.round(value * interval) / interval;
 
-    let valueChanged = roundedValue !== this.state.value;
+    const valueChanged = roundedValue !== this.state.value;
 
     this.setState({
       value: roundedValue,
@@ -310,5 +310,4 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     event.preventDefault();
     event.stopPropagation();
   }
-
 }
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
index 095d02bb483f0..aa217308d399e 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
@@ -21,7 +21,7 @@ describe('SpinButton', () => {
 
   it('renders SpinButton correctly', () => {
     const component = renderer.create(<SpinButton label='label' />);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
@@ -405,7 +405,7 @@ describe('SpinButton', () => {
         defaultValue={ exampleDefaultValue }
         // tslint:disable-next-line:jsx-no-lambda
         onValidate={ (newValue: string): string => {
-          let numberValue: number = +newValue;
+          const numberValue: number = +newValue;
           return (!isNaN(numberValue) && numberValue >= exampleMinValue && numberValue <= exampleMaxValue) ? newValue : errorMessage;
         } }
       />
@@ -438,7 +438,7 @@ describe('SpinButton', () => {
         value={ exampleDefaultValue }
         // tslint:disable-next-line:jsx-no-lambda
         onValidate={ (newValue: string): string => {
-          let numberValue: number = Number(newValue);
+          const numberValue: number = Number(newValue);
           return (!isNaN(numberValue) && numberValue >= exampleMinValue && numberValue <= exampleMaxValue) ? newValue : errorMessage;
         } }
       />
@@ -608,13 +608,13 @@ describe('SpinButton', () => {
 
     delay(500).then(() => ReactTestUtils.Simulate.focus(inputDOM));
 
-    let currentValue = inputDOM.value;
+    const currentValue = inputDOM.value;
     expect(currentValue).not.toEqual('2');
     expect(inputDOM.getAttribute('aria-valuemin')).toEqual(String(exampleMinValue));
     expect(inputDOM.getAttribute('aria-valuemax')).toEqual(String(exampleMaxValue));
     expect(inputDOM.getAttribute('aria-valuenow')).toEqual(currentValue);
 
-    let newCurrentValue = inputDOM.value;
+    const newCurrentValue = inputDOM.value;
     expect(currentValue).toEqual(newCurrentValue);
   });
 
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index 47ee2bfa7d281..f461eb1613f81 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -84,7 +84,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
       'value': 'defaultValue'
     });
 
-    let value = props.value || props.defaultValue || String(props.min) || '0';
+    const value = props.value || props.defaultValue || String(props.min) || '0';
     this._lastValidValue = value;
 
     // Ensure that the autocalculated precision is not negative.
@@ -372,7 +372,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
    */
   @autobind
   private _updateValue(shouldSpin: boolean, stepDelay: number, stepFunction: (string: string) => string | void) {
-    let newValue: string | void = stepFunction(this.state.value);
+    const newValue: string | void = stepFunction(this.state.value);
     if (newValue) {
       this._lastValidValue = newValue;
       this.setState({ value: newValue });
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
index ce9639fbbb178..43816d66f1136 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
@@ -4,7 +4,7 @@ import { SpinButton } from 'office-ui-fabric-react/lib/SpinButton';
 // tslint:disable:jsx-no-lambda
 export class SpinButtonStatefulExample extends React.Component<any, any> {
   public render() {
-    let suffix = ' cm';
+    const suffix = ' cm';
 
     return (
       <div style={ { width: '400px' } }>
@@ -35,7 +35,7 @@ export class SpinButtonStatefulExample extends React.Component<any, any> {
   }
 
   private _hasSuffix(string: string, suffix: string): Boolean {
-    let subString = string.substr(string.length - suffix.length);
+    const subString = string.substr(string.length - suffix.length);
     return subString === suffix;
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx
index 31f5477d95b08..292534cd0efb5 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx
+++ b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx
@@ -11,7 +11,7 @@ export class Spinner extends BaseComponent<ISpinnerProps, any> {
   };
 
   public render() {
-    let { type, size, label, className, ariaLive, ariaLabel } = this.props; // TODO remove deprecated type property at >= 2.0.0
+    const { type, size, label, className, ariaLive, ariaLabel } = this.props; // TODO remove deprecated type property at >= 2.0.0
     const statusMessage = ariaLabel || label;
 
     return (
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.base.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.base.tsx
index f15f4b52a1333..189aed82ab13e 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.base.tsx
@@ -34,7 +34,7 @@ export class ColorPickerGridCellBase extends React.Component<IColorPickerGridCel
   private _classNames: {[key in keyof IColorPickerGridCellStyles]: string };
 
   public render() {
-    let {
+    const {
       item,
       id,
       selected,
@@ -92,11 +92,11 @@ export class ColorPickerGridCellBase extends React.Component<IColorPickerGridCel
     );
   }
 
-  /**
-* Validate if the cell's color is white or not to apply whiteCell style
-* @param inputColor - The color of the current cell
-* @returns - Whether the cell's color is white or not.
-*/
+ /**
+  * Validate if the cell's color is white or not to apply whiteCell style
+  * @param inputColor - The color of the current cell
+  * @returns - Whether the cell's color is white or not.
+  */
   private _isWhiteCell(inputColor: string | undefined): boolean {
     return inputColor!.toLocaleLowerCase() === '#ffffff';
   }
@@ -115,7 +115,7 @@ export class ColorPickerGridCellBase extends React.Component<IColorPickerGridCel
     checked: boolean,
     expanded: boolean,
     isSplit: boolean | undefined): IButtonClassNames {
-    let styles = getActionButtonStyles(theme);
+    const styles = getActionButtonStyles(theme);
     return mergeStyleSets(this._classNames as {}, {
       root: [
         'ms-Button',
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
index 2ca8484c3df25..0a99b04033dea 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
@@ -67,7 +67,7 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
   }
 
   public render() {
-    let {
+    const {
       colorCells,
       columnCount,
       positionInSet,
@@ -129,7 +129,7 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
    * @returns {number} - The index of the selected item's id, -1 if there was no match
    */
   private _getSelectedIndex(items: IColorCellProps[], selectedId: string): number | undefined {
-    let selectedIndex = findIndex(items, (item => (item.id === selectedId)));
+    const selectedIndex = findIndex(items, (item => (item.id === selectedId)));
     return selectedIndex >= 0 ? selectedIndex : undefined;
   }
 
@@ -144,7 +144,7 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
    */
   @autobind
   private _renderOption(item: IColorCellProps): JSX.Element {
-    let id = this._id;
+    const id = this._id;
 
     return (
       <ColorPickerGridCell
@@ -201,7 +201,7 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
       return;
     }
 
-    let index = item.index as number;
+    const index = item.index as number;
 
     // If we have a valid index and it is not already
     // selected, select it
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
index 6e74d6d8406ff..3f12d71e3e33e 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
@@ -34,7 +34,7 @@ describe('SwatchColorPicker', () => {
         columnCount={ 4 }
         getStyles={ getStyles }
       />);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.test.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.test.tsx
index bbfc2130364fa..44e7c76f8f332 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.test.tsx
@@ -12,23 +12,23 @@ describe('TeachingBubble', () => {
 
   it('renders TeachingBubble correctly', () => {
     const component = renderer.create(<TeachingBubble>Content</TeachingBubble>);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
 
     const componentContent = renderer.create(<TeachingBubbleContent headline='Title'>Content</TeachingBubbleContent>);
-    let treeContent = componentContent.toJSON();
+    const treeContent = componentContent.toJSON();
     expect(treeContent).toMatchSnapshot();
   });
 
   // <Layer> components will lead ReactDOM.findDOMNode(test_component) return null, so the test is based on the teaching bubble content.
   it('renders a label', () => {
-    let component = ReactTestUtils.renderIntoDocument(
+    const component = ReactTestUtils.renderIntoDocument(
       <TeachingBubbleContent
         headline='Title'
       />
     );
-    let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
-    let titleElement = renderedDOM.querySelector('.ms-TeachingBubble-headline');
+    const renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
+    const titleElement = renderedDOM.querySelector('.ms-TeachingBubble-headline');
 
     expect(titleElement!.textContent).toEqual('Title');
   });
@@ -41,7 +41,7 @@ describe('TeachingBubble', () => {
       />
     );
     setTimeout(() => {
-      let callout = document.querySelector('.ms-Callout') as HTMLElement;
+      const callout = document.querySelector('.ms-Callout') as HTMLElement;
       expect(callout).toBeDefined();
       expect(callout.classList.contains('ms-TeachingBubble')).toBeTruthy();
       expect(callout.classList.contains('foo')).toBeTruthy();
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
index c0f117e8457c9..5dc95774d2a89 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
@@ -48,7 +48,7 @@ export class TeachingBubble extends BaseComponent<ITeachingBubbleProps, ITeachin
   }
 
   public render() {
-    let { calloutProps: setCalloutProps, targetElement, onDismiss } = this.props;
+    const { calloutProps: setCalloutProps, targetElement, onDismiss } = this.props;
     const calloutProps = { ...this._defaultCalloutProps, ...setCalloutProps };
 
     return (
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubbleContent.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubbleContent.tsx
index ccbe99d2bbdcb..147d72089a179 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubbleContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubbleContent.tsx
@@ -38,7 +38,7 @@ export class TeachingBubbleContent extends BaseComponent<ITeachingBubbleProps, I
   }
 
   public render() {
-    let { illustrationImage, primaryButtonProps, secondaryButtonProps, headline, hasCondensedHeadline, hasCloseIcon, onDismiss, closeButtonAriaLabel, hasSmallHeadline } = this.props;
+    const { illustrationImage, primaryButtonProps, secondaryButtonProps, headline, hasCondensedHeadline, hasCloseIcon, onDismiss, closeButtonAriaLabel, hasSmallHeadline } = this.props;
 
     let imageContent;
     let headerContent;
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx
index c2ef38380e8a2..91bd4ec369aca 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Basic.Example.tsx
@@ -23,11 +23,11 @@ export class TeachingBubbleBasicExample extends React.Component<{}, ITeachingBub
   }
 
   public render() {
-    let { isTeachingBubbleVisible } = this.state;
-    let examplePrimaryButton: IButtonProps = {
+    const { isTeachingBubbleVisible } = this.state;
+    const examplePrimaryButton: IButtonProps = {
       children: 'Try it out'
     };
-    let exampleSecondaryButtonProps: IButtonProps = {
+    const exampleSecondaryButtonProps: IButtonProps = {
       children: 'Maybe later',
       onClick: this._onDismiss
     };
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Condensed.Example.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Condensed.Example.tsx
index 90034fe746df6..bdfc2d2a27c65 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Condensed.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Condensed.Example.tsx
@@ -22,7 +22,7 @@ export class TeachingBubbleCondensedExample extends React.Component<{}, ITeachin
   }
 
   public render() {
-    let { isTeachingBubbleVisible } = this.state;
+    const { isTeachingBubbleVisible } = this.state;
 
     return (
       <div className='ms-TeachingBubbleExample'>
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Illustration.Example.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Illustration.Example.tsx
index a59f5d022b077..7293397f80aaf 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Illustration.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.Illustration.Example.tsx
@@ -24,12 +24,12 @@ export class TeachingBubbleIllustrationExample extends React.Component<{}, ITeac
   }
 
   public render() {
-    let { isTeachingBubbleVisible } = this.state;
-    let exampleImageProps: IImageProps = { src: 'http://placehold.it/364x140' };
-    let examplePrimaryButton: IButtonProps = {
+    const { isTeachingBubbleVisible } = this.state;
+    const exampleImageProps: IImageProps = { src: 'http://placehold.it/364x140' };
+    const examplePrimaryButton: IButtonProps = {
       children: 'Try it out',
     };
-    let exampleSecondaryButtonProps: IButtonProps = {
+    const exampleSecondaryButtonProps: IButtonProps = {
       children: 'May be later',
       onClick: this._onDismiss
     };
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.SmallHeadline.Example.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.SmallHeadline.Example.tsx
index fbd6617a7c02a..aed369491e492 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.SmallHeadline.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.SmallHeadline.Example.tsx
@@ -22,8 +22,8 @@ export class TeachingBubbleSmallHeadlineExample extends React.Component<{}, ITea
   }
 
   public render() {
-    let { isTeachingBubbleVisible } = this.state;
-    let examplePrimaryButton: IButtonProps = {
+    const { isTeachingBubbleVisible } = this.state;
+    const examplePrimaryButton: IButtonProps = {
       children: 'Try it out',
     };
 
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.WideIllustration.Example.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.WideIllustration.Example.tsx
index 6713a5439bfb5..7448ab573a9b3 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.WideIllustration.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/examples/TeachingBubble.WideIllustration.Example.tsx
@@ -25,12 +25,12 @@ export class TeachingBubbleWideIllustrationExample extends React.Component<{}, I
   }
 
   public render() {
-    let { isTeachingBubbleVisible } = this.state;
-    let exampleImageProps: IImageProps = { src: 'http://placehold.it/364x140' };
-    let examplePrimaryButton: IButtonProps = {
+    const { isTeachingBubbleVisible } = this.state;
+    const exampleImageProps: IImageProps = { src: 'http://placehold.it/364x140' };
+    const examplePrimaryButton: IButtonProps = {
       children: 'Try it out',
     };
-    let exampleSecondaryButtonProps: IButtonProps = {
+    const exampleSecondaryButtonProps: IButtonProps = {
       children: 'May be later',
       onClick: this._onDismiss
     };
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
index 04f715640aaf0..d60f2a6c4f972 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
@@ -26,7 +26,7 @@ describe('TextField', () => {
 
   it('renders TextField correctly', () => {
     const component = renderer.create(<TextField label='Label' />);
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
@@ -268,7 +268,7 @@ describe('TextField', () => {
 
     it('should trigger validation only on focus', () => {
       let validationCallCount = 0;
-      let validatorSpy = (value: string) => {
+      const validatorSpy = (value: string) => {
         validationCallCount++;
         return value.length > 3 ? errorMessage : '';
       };
@@ -296,7 +296,7 @@ describe('TextField', () => {
 
     it('should trigger validation only on blur', () => {
       let validationCallCount = 0;
-      let validatorSpy = (value: string) => {
+      const validatorSpy = (value: string) => {
         validationCallCount++;
         return value.length > 3 ? errorMessage : '';
       };
@@ -325,7 +325,7 @@ describe('TextField', () => {
 
     it('should trigger validation on both blur and focus', () => {
       let validationCallCount = 0;
-      let validatorSpy = (value: string) => {
+      const validatorSpy = (value: string) => {
         validationCallCount++;
         return value.length > 3 ? errorMessage : '';
       };
@@ -363,7 +363,7 @@ describe('TextField', () => {
 
     it('should not trigger validation on component mount', () => {
       let validationCallCount = 0;
-      let validatorSpy = (value: string) => {
+      const validatorSpy = (value: string) => {
         validationCallCount++;
         return '';
       };
@@ -402,7 +402,7 @@ describe('TextField', () => {
 
   it('should call onChanged handler for input change', () => {
     let callCount = 0;
-    let onChangedSpy = (value: string) => { callCount++; };
+    const onChangedSpy = (value: string) => { callCount++; };
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <TextField
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index f55b13f66b963..2c45908e76e6b 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -130,7 +130,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
   }
 
   public render() {
-    let {
+    const {
       className,
       description,
       disabled,
@@ -148,7 +148,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
       onRenderSuffix = this._onRenderSuffix,
       onRenderLabel = this._onRenderLabel
     } = this.props;
-    let { isFocused } = this.state;
+    const { isFocused } = this.state;
     const errorMessage = this._errorMessage;
     this._isDescriptionAvailable = Boolean(description || errorMessage);
     const renderProps: ITextFieldProps = { ...this.props, componentId: this._id };
@@ -303,21 +303,21 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
 
   // @deprecated
   private _onRenderAddon(props: ITextFieldProps): JSX.Element {
-    let { addonString } = props;
+    const { addonString } = props;
     return (
       <span style={ { paddingBottom: '1px' } }>{ addonString }</span>
     );
   }
 
   private _onRenderPrefix(props: ITextFieldProps): JSX.Element {
-    let { prefix } = props;
+    const { prefix } = props;
     return (
       <span style={ { paddingBottom: '1px' } }>{ prefix }</span>
     );
   }
 
   private _onRenderSuffix(props: ITextFieldProps): JSX.Element {
-    let { suffix } = props;
+    const { suffix } = props;
     return (
       <span style={ { paddingBottom: '1px' } }>{ suffix }</span>
     );
@@ -347,7 +347,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
   }
 
   private _renderTextArea(): React.ReactElement<React.HTMLAttributes<HTMLAreaElement>> {
-    let textAreaProps = getNativeProps(this.props, textAreaProperties, ['defaultValue']);
+    const textAreaProps = getNativeProps(this.props, textAreaProperties, ['defaultValue']);
 
     return (
       <textarea
@@ -368,7 +368,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
   }
 
   private _renderInput(): React.ReactElement<React.HTMLAttributes<HTMLInputElement>> {
-    let inputProps = getNativeProps<React.HTMLAttributes<HTMLInputElement>>(this.props, inputProperties, ['defaultValue']);
+    const inputProps = getNativeProps<React.HTMLAttributes<HTMLInputElement>>(this.props, inputProperties, ['defaultValue']);
 
     return (
       <input
@@ -429,8 +429,8 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
     }
 
     this._latestValidateValue = value;
-    let onGetErrorMessage = this.props.onGetErrorMessage as (value: string) => string | PromiseLike<string> | undefined;
-    let result = onGetErrorMessage(value || '');
+    const onGetErrorMessage = this.props.onGetErrorMessage as (value: string) => string | PromiseLike<string> | undefined;
+    const result = onGetErrorMessage(value || '');
 
     if (result !== undefined) {
       if (typeof result === 'string') {
@@ -439,7 +439,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
         } as ITextFieldState);
         this._notifyAfterValidate(value, result);
       } else {
-        let currentValidation: number = ++this._lastValidation;
+        const currentValidation: number = ++this._lastValidation;
 
         result.then((errorMessage: string) => {
           if (this._isMounted && currentValidation === this._lastValidation) {
@@ -465,7 +465,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
     if (this._textElement && this.props.autoAdjustHeight && this.props.multiline) {
       const textField = this._textElement as HTMLElement;
       textField.style.height = '';
-      let scrollHeight = textField.scrollHeight + 2; // +2 to avoid vertical scroll bars
+      const scrollHeight = textField.scrollHeight + 2; // +2 to avoid vertical scroll bars
       textField.style.height = scrollHeight + 'px';
     }
   }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx
index 4ff3434b21c6c..818f76a8c9b48 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx
@@ -30,7 +30,7 @@ export class TextFieldCustomRenderExample extends React.Component<{}, {
   @autobind
   private _onRenderLabel(props: ITextFieldProps): JSX.Element {
 
-    let { isCalloutVisible } = this.state;
+    const { isCalloutVisible } = this.state;
     return (
       <div className='ms-CustomRenderExample' style={ { display: 'flex', alignItems: 'center' } }>
         <span>TextField with custom label render</span>
diff --git a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
index 05e8b1e9654b9..80c6c28973c0b 100644
--- a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
@@ -45,7 +45,7 @@ export class ThemePage extends React.Component<IComponentDemoPageProps, {
   }
 
   public render() {
-    let { colors, colorPickerProps } = this.state;
+    const { colors, colorPickerProps } = this.state;
 
     return (
       <div className='Themes'>
@@ -126,14 +126,14 @@ export class ThemePage extends React.Component<IComponentDemoPageProps, {
   }
 
   private _onColorChanged(index: number, newColor: string) {
-    let { colors } = this.state;
-    let color = colors[index];
-    let palette: Partial<IPalette> = {};
+    const { colors } = this.state;
+    const color = colors[index];
+    const palette: Partial<IPalette> = {};
 
     color.value = newColor;
 
     for (let i = 0; i < colors.length; i++) {
-      let themeColor = colors[i];
+      const themeColor = colors[i];
 
       (palette as any)[themeColor.key] = themeColor.value;
     }
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts
index dcf94446fc274..97fe626291e40 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGenerator.ts
@@ -55,9 +55,9 @@ export class ThemeGenerator {
    */
   public static insureSlots(slotRules: IThemeRules, isInverted: boolean) {
     // Get all the "root" rules, the ones which don't inherit. Then "set" them to trigger updating dependent slots.
-    for (let ruleName in slotRules) {
+    for (const ruleName in slotRules) {
       if (slotRules.hasOwnProperty(ruleName)) {
-        let rule: IThemeSlotRule = slotRules[ruleName];
+        const rule: IThemeSlotRule = slotRules[ruleName];
         if (!rule.inherits && !rule.value) {
           if (!rule.color) {
             throw 'A color slot rule that does not inherit must provide its own color.';
@@ -75,10 +75,10 @@ export class ThemeGenerator {
    *   ... }
    */
   public static getThemeAsJson(slotRules: IThemeRules): any {
-    let theme: any = {};
-    for (let ruleName in slotRules) {
+    const theme: any = {};
+    for (const ruleName in slotRules) {
       if (slotRules.hasOwnProperty(ruleName)) {
-        let rule: IThemeSlotRule = slotRules[ruleName];
+        const rule: IThemeSlotRule = slotRules[ruleName];
         theme[rule.name] = rule.color ? rule.color.str : rule.value || '';
       }
     }
@@ -91,13 +91,13 @@ export class ThemeGenerator {
    * ...
    */
   public static getThemeAsSass(slotRules: IThemeRules): any {
-    let sassVarTemplate = '${0}Color: "[theme: {1}, default: {2}]";\n';
+    const sassVarTemplate = '${0}Color: "[theme: {1}, default: {2}]";\n';
     let output = '';
 
-    for (let ruleName in slotRules) {
+    for (const ruleName in slotRules) {
       if (slotRules.hasOwnProperty(ruleName)) {
-        let rule: IThemeSlotRule = slotRules[ruleName];
-        let camelCasedName = rule.name.charAt(0).toLowerCase() + rule.name.slice(1);
+        const rule: IThemeSlotRule = slotRules[ruleName];
+        const camelCasedName = rule.name.charAt(0).toLowerCase() + rule.name.slice(1);
         output += format(sassVarTemplate,
           camelCasedName,
           camelCasedName,
@@ -115,17 +115,17 @@ export class ThemeGenerator {
    * }
    */
   public static getThemeForPowerShell(slotRules: IThemeRules): any {
-    let psVarTemplate = '"{0}" = "{1}";\n';
+    const psVarTemplate = '"{0}" = "{1}";\n';
     let output = '';
 
-    for (let ruleName in slotRules) {
+    for (const ruleName in slotRules) {
       if (slotRules.hasOwnProperty(ruleName)) {
-        let rule: IThemeSlotRule = slotRules[ruleName];
+        const rule: IThemeSlotRule = slotRules[ruleName];
         if (rule.value) {
           // skip this one, it's not a color
           continue;
         }
-        let camelCasedName = rule.name.charAt(0).toLowerCase() + rule.name.slice(1);
+        const camelCasedName = rule.name.charAt(0).toLowerCase() + rule.name.slice(1);
         let outputColor = rule.color ? '#' + rule.color.hex : rule.value || '';
         // powershell endpoint uses the RGBA format
         if (rule.color && rule.color.a && rule.color.a !== 100) {
@@ -170,7 +170,7 @@ export class ThemeGenerator {
       }
 
       // then update dependent colors
-      for (let ruleToUpdate of rule.dependentRules) {
+      for (const ruleToUpdate of rule.dependentRules) {
         ThemeGenerator._setSlot(ruleToUpdate, rule.color, isInverted, false, overwriteCustomColor);
       }
     }
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
index fbbe633f9bdd1..e954aa2f30f21 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
@@ -49,7 +49,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
   constructor(props: {}) {
     super(props);
 
-    let themeRules = themeRulesStandardCreator();
+    const themeRules = themeRulesStandardCreator();
     ThemeGenerator.insureSlots(themeRules, isDark(themeRules[BaseSlots[BaseSlots.backgroundColor]].color!));
 
     this.state = {
@@ -62,7 +62,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
 
   public componentWillUnmount(): void {
     // remove temp styles
-    let root = document.querySelector('.App-content') as HTMLElement;
+    const root = document.querySelector('.App-content') as HTMLElement;
     if (root) {
       root.style.backgroundColor = '';
       root.style.color = '';
@@ -71,15 +71,15 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
     document.body.style.color = '';
 
     // and apply the default theme to overwrite any existing custom theme
-    let themeRules = themeRulesStandardCreator();
+    const themeRules = themeRulesStandardCreator();
     ThemeGenerator.insureSlots(themeRules, false);
     loadTheme({ palette: themeRules });
   }
 
   public render() {
-    let { colorPickerVisible, colorPickerSlotRule, colorPickerElement } = this.state;
+    const { colorPickerVisible, colorPickerSlotRule, colorPickerElement } = this.state;
 
-    let fabricThemeSlots =
+    const fabricThemeSlots =
       [this._fabricSlotWidget(FabricSlots.themeDarker),
       this._fabricSlotWidget(FabricSlots.themeDark),
       this._fabricSlotWidget(FabricSlots.themeDarkAlt),
@@ -89,14 +89,14 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
       this._fabricSlotWidget(FabricSlots.themeLight),
       this._fabricSlotWidget(FabricSlots.themeLighter),
       this._fabricSlotWidget(FabricSlots.themeLighterAlt)];
-    let fabricNeutralForegroundSlots =
+    const fabricNeutralForegroundSlots =
       [this._fabricSlotWidget(FabricSlots.black),
       this._fabricSlotWidget(FabricSlots.neutralDark),
       this._fabricSlotWidget(FabricSlots.neutralPrimary),
       this._fabricSlotWidget(FabricSlots.neutralSecondary),
       this._fabricSlotWidget(FabricSlots.neutralTertiary)
       ];
-    let fabricNeutralBackgroundSlots =
+    const fabricNeutralBackgroundSlots =
       [this._fabricSlotWidget(FabricSlots.neutralTertiaryAlt),
       this._fabricSlotWidget(FabricSlots.neutralQuaternary),
       this._fabricSlotWidget(FabricSlots.neutralQuaternaryAlt),
@@ -242,7 +242,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
     (document.getElementById('imagePreview') as HTMLImageElement).src = this._imgUrl;
 
     if (this._imgUrl) {
-      let xhr = new XMLHttpRequest();
+      const xhr = new XMLHttpRequest();
       xhr.addEventListener('load', this._cognitiveVisionCallback.bind(this));
       // you may need to change the URL here
       xhr.open('POST', 'https://westus.api.cognitive.microsoft.com/vision/v1.0/analyze?visualFeatures=Description%2CColor&details=&language=en');
@@ -252,7 +252,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
       xhr.send('{ "url": "' + this._imgUrl + '" }');
     } else {
       // remove related properties from theme
-      let { themeRules } = this.state;
+      const { themeRules } = this.state;
       if (themeRules.hasOwnProperty(BackgroundImageUriKey)) {
         delete themeRules[BackgroundImageUriKey];
       }
@@ -298,7 +298,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
         return '#fff';
       };
 
-      let { themeRules } = this.state;
+      const { themeRules } = this.state;
       const bgColor = getHexFromColor(response.color.dominantColorBackground, true);
       const bgColorIsDark = isDark(getColorFromString(bgColor)!);
       ThemeGenerator.setSlot(
@@ -349,7 +349,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
       clearTimeout(this._semanticSlotColorChangeTimeout);
     }
     this._semanticSlotColorChangeTimeout = this._async.setTimeout(() => {
-      let { themeRules } = this.state;
+      const { themeRules } = this.state;
 
       ThemeGenerator.setSlot(slotRule, color, isDark(themeRules[BaseSlots[BaseSlots.backgroundColor]].color!), true, true);
       this.setState({ themeRules: themeRules }, this._makeNewTheme);
@@ -360,7 +360,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
 
   @autobind
   private _onSwatchClick(slotRule: IThemeSlotRule, ev: React.MouseEvent<HTMLElement>) {
-    let { colorPickerSlotRule, colorPickerElement } = this.state;
+    const { colorPickerSlotRule, colorPickerElement } = this.state;
 
     if (colorPickerSlotRule !== null && colorPickerSlotRule !== undefined && !!colorPickerElement && colorPickerSlotRule === slotRule && colorPickerElement === ev.target) { // same one, close it
       this.setState({ colorPickerVisible: false, colorPickerSlotRule: null, colorPickerElement: null });
@@ -402,11 +402,11 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
 
   @autobind
   private _accessibilityRow(foreground: FabricSlots, background: FabricSlots) {
-    let themeRules = this.state.themeRules;
-    let bgc: IColor = themeRules[FabricSlots[background]].color!;
-    let fgc: IColor = themeRules[FabricSlots[foreground]].color!;
+    const themeRules = this.state.themeRules;
+    const bgc: IColor = themeRules[FabricSlots[background]].color!;
+    const fgc: IColor = themeRules[FabricSlots[foreground]].color!;
 
-    let contrastRatio = getContrastRatio(bgc, fgc);
+    const contrastRatio = getContrastRatio(bgc, fgc);
     let contrastRatioString = String(contrastRatio);
     contrastRatioString = contrastRatioString.substr(0, contrastRatioString.indexOf('.') + 3);
     if (contrastRatio < 4.5) {
@@ -427,8 +427,8 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
     const themeRules = this.state.themeRules;
 
     // strip out the unnecessary shade slots from the final output theme
-    let abridgedTheme: IThemeRules = {};
-    for (let ruleName in themeRules) {
+    const abridgedTheme: IThemeRules = {};
+    for (const ruleName in themeRules) {
       if (themeRules.hasOwnProperty(ruleName)) {
         if (ruleName.indexOf('ColorShade') === -1 && ruleName !== 'primaryColor' && ruleName !== 'backgroundColor' && ruleName !== 'foregroundColor') {
           abridgedTheme[ruleName] = themeRules[ruleName];
@@ -471,10 +471,10 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
 
   @autobind
   private _makeNewTheme() {
-    let themeAsJson: { [key: string]: string } = ThemeGenerator.getThemeAsJson(this.state.themeRules);
+    const themeAsJson: { [key: string]: string } = ThemeGenerator.getThemeAsJson(this.state.themeRules);
     console.log('New theme...', themeAsJson);
 
-    let root = document.querySelector('.App-content') as HTMLElement;
+    const root = document.querySelector('.App-content') as HTMLElement;
     if (root) {
       root.style.backgroundColor = themeAsJson.backgroundColor;
       root.style.color = themeAsJson.bodyText;
@@ -493,7 +493,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
         clearTimeout(colorChangeTimeout);
       }
       colorChangeTimeout = this._async.setTimeout(() => {
-        let themeRules = this.state.themeRules;
+        const themeRules = this.state.themeRules;
         const currentIsDark = isDark(themeRules[BaseSlots[BaseSlots.backgroundColor]].color!);
         ThemeGenerator.setSlot(
           themeRules[BaseSlots[baseSlot]],
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
index 0211f02aac1dc..be99ff5655af2 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
@@ -59,7 +59,7 @@ export enum SemanticColorSlots {
 }
 
 export function themeRulesStandardCreator() {
-  let slotRules: IThemeRules = {};
+  const slotRules: IThemeRules = {};
 
   /*** BASE COLORS and their SHADES */
   // iterate through each base slot and make the SlotRules for those
@@ -76,8 +76,8 @@ export function themeRulesStandardCreator() {
       if (shadeName === Shade[Shade.Unshaded]) {
         return;
       }
-      let inherits = slotRules[baseSlot];
-      let thisSlotRule = {
+      const inherits = slotRules[baseSlot];
+      const thisSlotRule = {
         name: baseSlot + shadeName,
         inherits: slotRules[baseSlot],
         asShade: shadeValue,
@@ -120,8 +120,8 @@ export function themeRulesStandardCreator() {
   slotRules[BaseSlots[BaseSlots.foregroundColor] + Shade[Shade.Shade8]].color = getColorFromString('#000000');
 
   function _makeFabricSlotRule(slotName: string, inheritedBase: BaseSlots, inheritedShade: Shade, isBackgroundShade = false) {
-    let inherits = slotRules[BaseSlots[inheritedBase]];
-    let thisSlotRule = {
+    const inherits = slotRules[BaseSlots[inheritedBase]];
+    const thisSlotRule = {
       name: slotName,
       inherits: inherits,
       asShade: inheritedShade,
@@ -176,7 +176,7 @@ export function themeRulesStandardCreator() {
   slotRules[FabricSlots[FabricSlots.themeDarker]].isCustomized = true;
 
   // todo: can remove this once we remove these outdated slots from the product
-  let primaryBackground = 'primaryBackground';
+  const primaryBackground = 'primaryBackground';
   slotRules[primaryBackground] = {
     name: primaryBackground,
     inherits: slotRules[FabricSlots[FabricSlots.white]],
@@ -185,7 +185,7 @@ export function themeRulesStandardCreator() {
   };
   slotRules[FabricSlots[FabricSlots.white]].dependentRules.push(slotRules[primaryBackground]);
 
-  let primaryText = 'primaryText';
+  const primaryText = 'primaryText';
   slotRules[primaryText] = {
     name: primaryText,
     inherits: slotRules[FabricSlots[FabricSlots.neutralPrimary]],
@@ -197,8 +197,8 @@ export function themeRulesStandardCreator() {
   /*** SEMANTIC SLOTS */
   // create the SlotRule for a semantic slot
   function _makeSemanticSlotRule(semanticSlot: SemanticColorSlots, inheritedFabricSlot: FabricSlots) {
-    let inherits = slotRules[FabricSlots[inheritedFabricSlot]];
-    let thisSlotRule = {
+    const inherits = slotRules[FabricSlots[inheritedFabricSlot]];
+    const thisSlotRule = {
       name: SemanticColorSlots[semanticSlot],
       inherits: slotRules[FabricSlots[inheritedFabricSlot]],
       isCustomized: false,
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
index 6ffbae2bcb77d..007fc3c7b5fb2 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.test.tsx
@@ -12,13 +12,13 @@ import { Toggle } from './Toggle';
 describe('Toggle', () => {
 
   it('renders a label', () => {
-    let component = ReactTestUtils.renderIntoDocument(
+    const component = ReactTestUtils.renderIntoDocument(
       <Toggle
         label='Label'
       />
     );
-    let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
-    let labelElement = renderedDOM.querySelector('.ms-Toggle-label') as Element;
+    const renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
+    const labelElement = renderedDOM.querySelector('.ms-Toggle-label') as Element;
 
     expect(labelElement.textContent).toEqual('Label');
   });
@@ -29,26 +29,26 @@ describe('Toggle', () => {
         label='Label'
       />
     );
-    let tree = component.toJSON();
+    const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
 
   it('renders aria-label', () => {
-    let component = ReactTestUtils.renderIntoDocument(
+    const component = ReactTestUtils.renderIntoDocument(
       <Toggle
         label='Label'
         offAriaLabel='offLabel'
       />
     );
-    let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
-    let labelElement = renderedDOM.querySelector('button') as Element;
+    const renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
+    const labelElement = renderedDOM.querySelector('button') as Element;
 
     expect(labelElement.getAttribute('aria-label')).toEqual('offLabel');
   });
 
   it('can call the callback on a change of toggle', () => {
     let isToggledValue;
-    let callback = (isToggled: boolean) => {
+    const callback = (isToggled: boolean) => {
       isToggledValue = isToggled;
     };
     let component: any;
@@ -61,8 +61,8 @@ describe('Toggle', () => {
         onChanged={ callback }
       />
     );
-    let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
-    let button = renderedDOM.querySelector('button') as HTMLButtonElement;
+    const renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
+    const button = renderedDOM.querySelector('button') as HTMLButtonElement;
 
     ReactTestUtils.Simulate.click(button);
     expect(isToggledValue).toEqual(true);
@@ -80,8 +80,8 @@ describe('Toggle', () => {
         checked={ false }
       />
     );
-    let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
-    let button = renderedDOM.querySelector('button') as HTMLButtonElement;
+    const renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
+    const button = renderedDOM.querySelector('button') as HTMLButtonElement;
 
     ReactTestUtils.Simulate.click(button);
 
@@ -89,13 +89,13 @@ describe('Toggle', () => {
   });
 
   it(`doesn't render a label element if none is provided`, () => {
-    let component = ReactTestUtils.renderIntoDocument(
+    const component = ReactTestUtils.renderIntoDocument(
       <Toggle
         checked={ false }
       />
     );
-    let renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
-    let label = renderedDOM.querySelector('label');
+    const renderedDOM = ReactDOM.findDOMNode(component as React.ReactInstance);
+    const label = renderedDOM.querySelector('label');
 
     // tslint:disable-next-line:no-unused-expression
     expect(label).toBeNull();
@@ -121,7 +121,7 @@ describe('Toggle', () => {
         />
       </form>
     );
-    let button: any = wrapper.find('button');
+    const button: any = wrapper.find('button');
     // simulate to change toggle state
     button.simulate('click');
     expect((component as React.Component<any, any>).state.isChecked).toEqual(true);
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
index 6d6472a830337..13ad62e49a8fd 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
@@ -61,7 +61,7 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
     // In the future when more screenreaders support aria-pressed it would be a good idea to change this control back to using it as it is
     // more semantically correct.
 
-    let {
+    const {
       className,
       theme,
       styles: customStyles,
@@ -72,8 +72,8 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
       onAriaLabel,
       onText
       } = this.props;
-    let { isChecked } = this.state;
-    let stateText = isChecked ? onText : offText;
+    const { isChecked } = this.state;
+    const stateText = isChecked ? onText : offText;
     const ariaLabel = isChecked ? onAriaLabel : offAriaLabel;
     const toggleNativeProps = getNativeProps(this.props, inputProperties, ['defaultChecked']);
     const classNames = getClassNames(
@@ -124,8 +124,8 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
 
   @autobind
   private _onClick(ev: React.MouseEvent<HTMLElement>) {
-    let { disabled, checked, onChanged, onClick } = this.props;
-    let { isChecked } = this.state;
+    const { disabled, checked, onChanged, onClick } = this.props;
+    const { isChecked } = this.state;
 
     if (!disabled) {
       // Only update the state if the user hasn't provided it.
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
index 21ec922691e74..87425792e1fbf 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
@@ -63,14 +63,14 @@ describe('Pickers', () => {
           onRenderSuggestionsItem={ basicSuggestionRenderer }
         />
       );
-      let tree = component.toJSON();
+      const tree = component.toJSON();
       expect(tree).toMatchSnapshot();
     });
 
     it('can provide custom renderers', () => {
-      let root = document.createElement('div');
+      const root = document.createElement('div');
       document.body.appendChild(root);
-      let picker: TypedBasePicker = ReactDOM.render(
+      const picker: TypedBasePicker = ReactDOM.render(
         <BasePickerWithType
           onResolveSuggestions={ onResolveSuggestions }
           onRenderItem={ onRenderItem }
@@ -78,16 +78,16 @@ describe('Pickers', () => {
         />,
         root
       ) as TypedBasePicker;
-      let input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
+      const input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
       input.focus();
       input.value = 'bl';
 
       ReactTestUtils.Simulate.change(input);
 
-      let suggestions = document.querySelector('.ms-Suggestions') as HTMLInputElement;
+      const suggestions = document.querySelector('.ms-Suggestions') as HTMLInputElement;
 
       expect(suggestions).toBeDefined();
-      let suggestionOptions = document.querySelectorAll('.ms-Suggestions-itemButton');
+      const suggestionOptions = document.querySelectorAll('.ms-Suggestions-itemButton');
 
       expect(suggestionOptions.length).toEqual(2);
       ReactTestUtils.Simulate.click(suggestionOptions[0]);
@@ -100,9 +100,9 @@ describe('Pickers', () => {
     });
 
     it('can will not render input when items reach itemLimit', () => {
-      let root = document.createElement('div');
+      const root = document.createElement('div');
       document.body.appendChild(root);
-      let picker: TypedBasePicker = ReactDOM.render(
+      const picker: TypedBasePicker = ReactDOM.render(
         <BasePickerWithType
           onResolveSuggestions={ onResolveSuggestions }
           onRenderItem={ onRenderItem }
@@ -116,7 +116,7 @@ describe('Pickers', () => {
       input.value = 'bl';
       ReactTestUtils.Simulate.change(input);
 
-      let suggestionOptions = document.querySelectorAll('.ms-Suggestions-itemButton');
+      const suggestionOptions = document.querySelectorAll('.ms-Suggestions-itemButton');
       ReactTestUtils.Simulate.click(suggestionOptions[0]);
       expect(picker.items.length).toEqual(1);
       input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
@@ -126,7 +126,7 @@ describe('Pickers', () => {
     });
 
     it('will still render with itemLimit set to 0', () => {
-      let root = document.createElement('div');
+      const root = document.createElement('div');
       document.body.appendChild(root);
       ReactDOM.render(
         <BasePickerWithType
@@ -138,16 +138,16 @@ describe('Pickers', () => {
         root
       ) as TypedBasePicker;
 
-      let input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
+      const input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
       expect(input).toBeNull();
 
       ReactDOM.unmountComponentAtNode(root);
     });
 
     it('can be set with selectedItems and a lower itemLimit', () => {
-      let root = document.createElement('div');
+      const root = document.createElement('div');
       document.body.appendChild(root);
-      let picker: TypedBasePicker = ReactDOM.render(
+      const picker: TypedBasePicker = ReactDOM.render(
         <BasePickerWithType
           selectedItems={ [{ key: '1', name: 'blue' }, { key: '2', name: 'black' }] }
           onResolveSuggestions={ onResolveSuggestions }
@@ -158,7 +158,7 @@ describe('Pickers', () => {
         root
       ) as TypedBasePicker;
 
-      let input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
+      const input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
       expect(input).toBeNull();
       expect(picker.items.length).toEqual(2);
 
@@ -174,29 +174,29 @@ describe('Pickers', () => {
           onResolveSuggestions={ onResolveSuggestions }
         />
       );
-      let tree = component.toJSON();
+      const tree = component.toJSON();
       expect(tree).toMatchSnapshot();
     });
 
     it('can search for and select tags', () => {
-      let root = document.createElement('div');
+      const root = document.createElement('div');
       document.body.appendChild(root);
-      let picker: TagPicker = ReactDOM.render(
+      const picker: TagPicker = ReactDOM.render(
         <TagPicker
           onResolveSuggestions={ onResolveSuggestions }
         />,
         root
       ) as TagPicker;
-      let input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
+      const input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
       input.focus();
       input.value = 'bl';
 
       ReactTestUtils.Simulate.change(input);
 
-      let suggestions = document.querySelector('.ms-Suggestions') as HTMLInputElement;
+      const suggestions = document.querySelector('.ms-Suggestions') as HTMLInputElement;
 
       expect(suggestions).toBeDefined();
-      let suggestionOptions = document.querySelectorAll('.ms-Suggestions-itemButton');
+      const suggestionOptions = document.querySelectorAll('.ms-Suggestions-itemButton');
 
       expect(suggestionOptions.length).toEqual(2);
       ReactTestUtils.Simulate.click(suggestionOptions[0]);
@@ -208,7 +208,7 @@ describe('Pickers', () => {
     });
 
     it('can be a controlled component', () => {
-      let root = document.createElement('div');
+      const root = document.createElement('div');
       document.body.appendChild(root);
       let picker: TagPicker = ReactDOM.render(
         <TagPicker
@@ -217,13 +217,13 @@ describe('Pickers', () => {
         />,
         root
       ) as TagPicker;
-      let input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
+      const input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
 
       input.focus();
       input.value = 'bl';
       ReactTestUtils.Simulate.change(input);
 
-      let suggestionOptions = document.querySelectorAll('.ms-Suggestions-itemButton');
+      const suggestionOptions = document.querySelectorAll('.ms-Suggestions-itemButton');
 
       ReactTestUtils.Simulate.click(suggestionOptions[0]);
 
@@ -242,7 +242,7 @@ describe('Pickers', () => {
       ReactDOM.unmountComponentAtNode(root);
     });
     it('fires change events correctly for controlled components', (done) => {
-      let root = document.createElement('div');
+      const root = document.createElement('div');
       document.body.appendChild(root);
       const onChange = (items: ITag[] | undefined): void => {
         expect(items!.length).toBe(1);
@@ -258,13 +258,13 @@ describe('Pickers', () => {
         />,
         root
       ) as TagPicker;
-      let input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
+      const input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
 
       input.focus();
       input.value = 'bl';
       ReactTestUtils.Simulate.change(input);
 
-      let suggestionOptions = document.querySelectorAll('.ms-Suggestions-itemButton');
+      const suggestionOptions = document.querySelectorAll('.ms-Suggestions-itemButton');
 
       ReactTestUtils.Simulate.click(suggestionOptions[0]);
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 649e214b2e89a..eb76ad0991b95 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -47,7 +47,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   constructor(basePickerProps: P) {
     super(basePickerProps);
 
-    let items: T[] = basePickerProps.selectedItems || basePickerProps.defaultSelectedItems || [];
+    const items: T[] = basePickerProps.selectedItems || basePickerProps.defaultSelectedItems || [];
 
     this.suggestionStore = new SuggestionsController<T>();
     this.selection = new Selection({ onSelectionChanged: () => this.onSelectionChange() });
@@ -77,7 +77,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   }
 
   public componentWillReceiveProps(newProps: P) {
-    let newItems = newProps.selectedItems;
+    const newItems = newProps.selectedItems;
 
     if (newItems) {
       let focusIndex: number;
@@ -120,7 +120,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   @autobind
   public dismissSuggestions(ev?: any) {
-    let selectItemFunction = () => {
+    const selectItemFunction = () => {
       if (this.props.onDismiss) {
         this.props.onDismiss(
           ev,
@@ -165,8 +165,8 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   }
 
   public render() {
-    let { suggestedDisplayValue } = this.state;
-    let {
+    const { suggestedDisplayValue } = this.state;
+    const {
       className,
       inputProps,
       disabled
@@ -227,7 +227,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   }
 
   protected renderSuggestions(): JSX.Element | null {
-    let TypedSuggestion = this.SuggestionOfProperType;
+    const TypedSuggestion = this.SuggestionOfProperType;
     return this.state.suggestionsVisible ? (
       <Callout
         isBeakVisible={ false }
@@ -257,10 +257,10 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   }
 
   protected renderItems(): JSX.Element[] {
-    let { disabled, removeButtonAriaLabel } = this.props;
-    let onRenderItem = this.props.onRenderItem as (props: IPickerItemProps<T>) => JSX.Element;
+    const { disabled, removeButtonAriaLabel } = this.props;
+    const onRenderItem = this.props.onRenderItem as (props: IPickerItemProps<T>) => JSX.Element;
 
-    let { items } = this.state;
+    const { items } = this.state;
     return items.map((item: any, index: number) => onRenderItem({
       item,
       index,
@@ -274,10 +274,10 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   }
 
   protected resetFocus(index?: number) {
-    let { items } = this.state;
+    const { items } = this.state;
 
     if (items.length && index! >= 0) {
-      let newEl: HTMLElement = this.root.querySelectorAll('[data-selection-index]')[Math.min(index!, items.length - 1)] as HTMLElement;
+      const newEl: HTMLElement = this.root.querySelectorAll('[data-selection-index]')[Math.min(index!, items.length - 1)] as HTMLElement;
       if (newEl) {
         this.focusZone.focusElement(newEl);
       }
@@ -291,8 +291,8 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   protected onSuggestionSelect() {
     if (this.suggestionStore.currentSuggestion) {
-      let currentValue: string = this.input.value;
-      let itemValue: string = this._getTextFromItem(this.suggestionStore.currentSuggestion.item, currentValue);
+      const currentValue: string = this.input.value;
+      const itemValue: string = this._getTextFromItem(this.suggestionStore.currentSuggestion.item, currentValue);
       this.setState({ suggestedDisplayValue: itemValue });
     }
   }
@@ -307,19 +307,19 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   }
 
   protected onEmptyInputFocus() {
-    let onEmptyInputFocus = this.props.onEmptyInputFocus as (selectedItems?: T[]) => T[] | PromiseLike<T[]>;
-    let suggestions: T[] | PromiseLike<T[]> = onEmptyInputFocus(this.state.items);
+    const onEmptyInputFocus = this.props.onEmptyInputFocus as (selectedItems?: T[]) => T[] | PromiseLike<T[]>;
+    const suggestions: T[] | PromiseLike<T[]> = onEmptyInputFocus(this.state.items);
     this.updateSuggestionsList(suggestions);
   }
 
   protected updateValue(updatedValue: string) {
-    let suggestions: T[] | PromiseLike<T[]> = this.props.onResolveSuggestions(updatedValue, this.state.items);
+    const suggestions: T[] | PromiseLike<T[]> = this.props.onResolveSuggestions(updatedValue, this.state.items);
     this.updateSuggestionsList(suggestions, updatedValue);
   }
 
   protected updateSuggestionsList(suggestions: T[] | PromiseLike<T[]>, updatedValue?: string) {
-    let suggestionsArray: T[] = suggestions as T[];
-    let suggestionsPromiseLike: PromiseLike<T[]> = suggestions as PromiseLike<T[]>;
+    const suggestionsArray: T[] = suggestions as T[];
+    const suggestionsPromiseLike: PromiseLike<T[]> = suggestions as PromiseLike<T[]>;
 
     // Check to see if the returned value is an array, if it is then just pass it into the next function.
     // If the returned value is not an array then check to see if it's a promise or PromiseLike. If it is then resolve it asynchronously.
@@ -352,7 +352,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
       }
 
       // Ensure that the promise will only use the callback if it was the most recent one.
-      let promise: PromiseLike<T[]> = this.currentPromise = suggestionsPromiseLike;
+      const promise: PromiseLike<T[]> = this.currentPromise = suggestionsPromiseLike;
       promise.then((newSuggestions: T[]) => {
         if (promise === this.currentPromise) {
           if (updatedValue !== undefined) {
@@ -445,7 +445,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   @autobind
   protected onKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
-    let keyCode = ev.which;
+    const keyCode = ev.which;
     switch (keyCode) {
       case KeyCodes.escape:
         if (this.state.suggestionsVisible) {
@@ -541,10 +541,10 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   @autobind
   protected onItemChange(changedItem: T, index: number) {
-    let { items } = this.state;
+    const { items } = this.state;
 
     if (index >= 0) {
-      let newItems: T[] = items;
+      const newItems: T[] = items;
       newItems[index] = changedItem;
 
       this._updateSelectedItems(newItems);
@@ -557,9 +557,9 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
       isSearching: true
     }, () => {
       if (this.props.onGetMoreResults) {
-        let suggestions: T[] | PromiseLike<T[]> = (this.props.onGetMoreResults as any)(this.input.value, this.state.items);
-        let suggestionsArray: T[] = suggestions as T[];
-        let suggestionsPromiseLike: PromiseLike<T[]> = suggestions as PromiseLike<T[]>;
+        const suggestions: T[] | PromiseLike<T[]> = (this.props.onGetMoreResults as any)(this.input.value, this.state.items);
+        const suggestionsArray: T[] = suggestions as T[];
+        const suggestionsPromiseLike: PromiseLike<T[]> = suggestions as PromiseLike<T[]>;
 
         if (Array.isArray(suggestionsArray)) {
           this.updateSuggestions(suggestionsArray);
@@ -592,18 +592,18 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   @autobind
   protected addItem(item: T) {
-    let processedItem: T | PromiseLike<T> = this.props.onItemSelected ? (this.props.onItemSelected as any)(item) : item;
+    const processedItem: T | PromiseLike<T> = this.props.onItemSelected ? (this.props.onItemSelected as any)(item) : item;
 
-    let processedItemObject: T = processedItem as T;
-    let processedItemPromiseLike: PromiseLike<T> = processedItem as PromiseLike<T>;
+    const processedItemObject: T = processedItem as T;
+    const processedItemPromiseLike: PromiseLike<T> = processedItem as PromiseLike<T>;
 
     if (processedItemPromiseLike && processedItemPromiseLike.then) {
       processedItemPromiseLike.then((resolvedProcessedItem: T) => {
-        let newItems: T[] = this.state.items.concat([resolvedProcessedItem]);
+        const newItems: T[] = this.state.items.concat([resolvedProcessedItem]);
         this._updateSelectedItems(newItems);
       });
     } else {
-      let newItems: T[] = this.state.items.concat([processedItemObject]);
+      const newItems: T[] = this.state.items.concat([processedItemObject]);
       this._updateSelectedItems(newItems);
     }
     this.setState({ suggestedDisplayValue: '' });
@@ -611,21 +611,21 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   @autobind
   protected removeItem(item: IPickerItemProps<T>) {
-    let { items } = this.state;
-    let index: number = items.indexOf(item);
+    const { items } = this.state;
+    const index: number = items.indexOf(item);
 
     if (index >= 0) {
-      let newItems: T[] = items.slice(0, index).concat(items.slice(index + 1));
+      const newItems: T[] = items.slice(0, index).concat(items.slice(index + 1));
       this._updateSelectedItems(newItems);
     }
   }
 
   @autobind
   protected removeItems(itemsToRemove: any[]) {
-    let { items } = this.state;
-    let newItems: T[] = items.filter((item: any) => itemsToRemove.indexOf(item) === -1);
-    let firstItemToRemove = itemsToRemove[0];
-    let index: number = items.indexOf(firstItemToRemove);
+    const { items } = this.state;
+    const newItems: T[] = items.filter((item: any) => itemsToRemove.indexOf(item) === -1);
+    const firstItemToRemove = itemsToRemove[0];
+    const index: number = items.indexOf(firstItemToRemove);
 
     this._updateSelectedItems(newItems, index);
   }
@@ -644,7 +644,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   @autobind
   protected _isFocusZoneInnerKeystroke(ev: React.KeyboardEvent<HTMLElement>): boolean {
-    // If suggestions are shown let up/down keys control them, otherwise allow them through to control the focusZone.
+    // If suggestions are shown const up/down keys control them, otherwise allow them through to control the focusZone.
     if (this.state.suggestionsVisible) {
       switch (ev.which) {
         case KeyCodes.up:
@@ -682,7 +682,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   private _onValidateInput() {
     if (this.props.onValidateInput && (this.props.onValidateInput as any)(this.input.value) !== ValidationState.invalid && this.props.createGenericItem) {
-      let itemToConvert = this.props.createGenericItem(this.input.value, this.props.onValidateInput(this.input.value));
+      const itemToConvert = this.props.createGenericItem(this.input.value, this.props.onValidateInput(this.input.value));
       this.suggestionStore.createGenericSuggestion(itemToConvert);
       this.completeSuggestion();
     }
@@ -699,8 +699,8 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
 export class BasePickerListBelow<T, P extends IBasePickerProps<T>> extends BasePicker<T, P> {
   public render() {
-    let { suggestedDisplayValue } = this.state;
-    let {
+    const { suggestedDisplayValue } = this.state;
+    const {
       className,
       inputProps,
       disabled
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.tsx
index 28a3ed191c1e3..826640d46ab9e 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePicker.tsx
@@ -53,7 +53,7 @@ export class ListPeoplePicker extends MemberListPeoplePicker {
 }
 
 export function createGenericItem(name: string, currentValidationState: ValidationState) {
-  let personaToConvert = {
+  const personaToConvert = {
     key: name,
     primaryText: name,
     imageInitials: '!',
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
index b8deb62126cea..e1aa84a1b9ca9 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemDefault.tsx
@@ -10,7 +10,7 @@ import * as stylesImport from './PickerItemsDefault.scss';
 const styles: any = stylesImport;
 
 export const SelectedItemDefault: (props: IPeoplePickerItemProps) => JSX.Element = (peoplePickerItemProps: IPeoplePickerItemProps) => {
-  let {
+  const {
     item,
     onRemoveItem,
     index,
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
index 68ab0222c49a6..ceac517849b9a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
@@ -26,7 +26,7 @@ export class SelectedItemWithMenu extends BaseComponent<IPeoplePickerItemWithMen
   }
 
   public render() {
-    let {
+    const {
       item,
       onRemoveItem,
       removeButtonAriaLabel
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index d2fe5f67ef39e..7a879090d387b 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -55,9 +55,9 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
 
   constructor(props: {}) {
     super(props);
-    let peopleList: IPersonaWithMenu[] = [];
+    const peopleList: IPersonaWithMenu[] = [];
     people.forEach((persona: IPersonaProps) => {
-      let target: IPersonaWithMenu = {};
+      const target: IPersonaWithMenu = {};
 
       assign(target, persona);
       peopleList.push(target);
@@ -265,9 +265,9 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
   }
 
   private _renderControlledPicker() {
-    let controlledItems = [];
+    const controlledItems = [];
     for (let i = 0; i < 5; i++) {
-      let item = this.state.peopleList[i];
+      const item = this.state.peopleList[i];
       if (this.state.currentSelectedItems!.indexOf(item) === -1) {
         controlledItems.push(this.state.peopleList[i]);
       }
@@ -327,17 +327,17 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
 
   @autobind
   private _onRemoveSuggestion(item: IPersonaProps): void {
-    let { peopleList, mostRecentlyUsed: mruState } = this.state;
-    let indexPeopleList: number = peopleList.indexOf(item);
-    let indexMostRecentlyUsed: number = mruState.indexOf(item);
+    const { peopleList, mostRecentlyUsed: mruState } = this.state;
+    const indexPeopleList: number = peopleList.indexOf(item);
+    const indexMostRecentlyUsed: number = mruState.indexOf(item);
 
     if (indexPeopleList >= 0) {
-      let newPeople: IPersonaProps[] = peopleList.slice(0, indexPeopleList).concat(peopleList.slice(indexPeopleList + 1));
+      const newPeople: IPersonaProps[] = peopleList.slice(0, indexPeopleList).concat(peopleList.slice(indexPeopleList + 1));
       this.setState({ peopleList: newPeople });
     }
 
     if (indexMostRecentlyUsed >= 0) {
-      let newSuggestedPeople: IPersonaProps[] = mruState.slice(0, indexMostRecentlyUsed).concat(mruState.slice(indexMostRecentlyUsed + 1));
+      const newSuggestedPeople: IPersonaProps[] = mruState.slice(0, indexMostRecentlyUsed).concat(mruState.slice(indexMostRecentlyUsed + 1));
       this.setState({ mostRecentlyUsed: newSuggestedPeople });
     }
   }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index 229057ebde17a..ad51629beef19 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -23,7 +23,7 @@ export interface ISuggestionsState {
 
 export class SuggestionsItem<T> extends BaseComponent<ISuggestionItemProps<T>, {}> {
   public render() {
-    let {
+    const {
       suggestionModel,
       RenderSuggestion,
       onClick,
@@ -80,7 +80,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
   }
 
   public render() {
-    let {
+    const {
       forceResolveText,
       createGenericItem,
       showForceResolve,
@@ -103,7 +103,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
       suggestionsHeaderText,
     } = this.props;
 
-    let noResults = () => {
+    const noResults = () => {
       return noResultsFoundText ?
         (
           <div role='alert' className={ css('ms-Suggestions-none', styles.suggestionsNone) }>
@@ -116,8 +116,8 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
     if (isMostRecentlyUsedVisible && mostRecentlyUsedHeaderText) {
       headerText = mostRecentlyUsedHeaderText;
     }
-    let footerTitle = (suggestions.length >= (resultsMaximumNumber as number)) ? resultsFooterFull : resultsFooter;
-    let hasNoSuggestions = (!suggestions || !suggestions.length) && !isLoading;
+    const footerTitle = (suggestions.length >= (resultsMaximumNumber as number)) ? resultsFooterFull : resultsFooter;
+    const hasNoSuggestions = (!suggestions || !suggestions.length) && !isLoading;
     return (
       <div
         className={ css(
@@ -199,8 +199,8 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
   public tryHandleKeyDown(keyCode: number, currentSuggestionIndex: number): boolean {
     let isEventHandled = false;
     let newSelectedActionType = null;
-    let currentSelectedAction = this.state.selectedActionType;
-    let suggestionLength = this.props.suggestions.length;
+    const currentSelectedAction = this.state.selectedActionType;
+    const suggestionLength = this.props.suggestions.length;
     if (keyCode === KeyCodes.down) {
       switch (currentSelectedAction) {
         case SuggestionActionType.forceResolve:
@@ -283,7 +283,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
   }
 
   public focusAboveSuggestions(): void {
-    let newSelectedActionType = null;
+    const newSelectedActionType = null;
     if (this._forceResolveButton) {
       this.setState({ selectedActionType: SuggestionActionType.forceResolve });
     } else if (this._searchForMoreButton) {
@@ -313,14 +313,14 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
   }
 
   private _renderSuggestions(): JSX.Element {
-    let {
-      suggestions,
+    const {
       onRenderSuggestion,
       suggestionsItemClassName,
       resultsMaximumNumber,
       showRemoveButtons,
       suggestionsContainerAriaLabel } = this.props;
-    let TypedSuggestionsItem = this.SuggestionsItemOfProperType;
+    let { suggestions } = this.props;
+    const TypedSuggestionsItem = this.SuggestionsItemOfProperType;
 
     if (resultsMaximumNumber) {
       suggestions = suggestions.slice(0, resultsMaximumNumber);
@@ -391,7 +391,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
   @autobind
   private _onRemoveTypedSuggestionsItem(item: T, index: number): (ev: React.MouseEvent<HTMLElement>) => void {
     return (ev: React.MouseEvent<HTMLElement>): void => {
-      let onSuggestionRemove = this.props.onSuggestionRemove!;
+      const onSuggestionRemove = this.props.onSuggestionRemove!;
       onSuggestionRemove(ev, item, index);
       ev.stopPropagation();
     };
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
index 14b30cd849f8d..4b4e47c92db52 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
@@ -86,7 +86,7 @@ export class SuggestionsController<T> {
   }
 
   public createGenericSuggestion(itemToConvert: ISuggestionModel<T>) {
-    let itemToAdd = this.convertSuggestionsToSuggestionItems([itemToConvert])[0];
+    const itemToAdd = this.convertSuggestionsToSuggestionItems([itemToConvert])[0];
     this.currentSuggestion = itemToAdd;
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
index 27992cf64646a..99795d8ac93cd 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
@@ -282,7 +282,7 @@ export const SuggestedDocumentItem: (documentProps: IFullDocumentCardProps) => J
 };
 
 export const SuggestedBigItem: (documentProps: IFullDocumentCardProps, itemProps: ISuggestionItemProps<any>) => JSX.Element = (documentProps: IFullDocumentCardProps, itemProps: ISuggestionItemProps<any>) => {
-  let {
+  const {
     documentPreviewProps,
     documentTitleProps
   } = documentProps;
@@ -297,13 +297,13 @@ export const SuggestedBigItem: (documentProps: IFullDocumentCardProps, itemProps
 };
 
 export const SelectedDocumentItem: (documentProps: IPickerItemProps<IFullDocumentCardProps>) => JSX.Element = (documentProps: IPickerItemProps<IFullDocumentCardProps>) => {
-  let {
+  const {
     documentActionsProps,
     documentPreviewProps,
     documentActivityProps,
     documentTitleProps
   } = documentProps.item;
-  let actions: IButtonProps[] = [];
+  const actions: IButtonProps[] = [];
   if (documentActionsProps) {
     documentActionsProps.actions.forEach((action: IButtonProps) => actions.push(action));
     actions.push({
@@ -392,7 +392,7 @@ export class PickerCustomResultExample extends React.Component<{}, IPeoplePicker
     if (!items || !items.length || items.length === 0) {
       return false;
     }
-    let documentTitle = document.documentTitleProps && document.documentTitleProps.title;
+    const documentTitle = document.documentTitleProps && document.documentTitleProps.title;
     return items.filter(item => (item.documentTitleProps && item.documentTitleProps.title) === documentTitle).length > 0;
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
index 092c23623a903..da6797db596ec 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
@@ -6,7 +6,7 @@ import { ITagPickerDemoPageState } from 'office-ui-fabric-react/lib/components/p
 import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
 const exampleStyles: any = exampleStylesImport;
 
-let _testTags = [
+const _testTags = [
   'black',
   'blue',
   'brown',
diff --git a/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusPage.tsx b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusPage.tsx
index 7e3983cea2f9d..20d894d9a14e1 100644
--- a/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusPage.tsx
+++ b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusPage.tsx
@@ -8,7 +8,7 @@ import './ComponentStatusPage.scss';
 
 export class ComponentStatusPage extends React.Component<{}, {}> {
   public render() {
-    let sections: [IComponentPageSection] = [{ title: 'Badges', section: this._renderStatusesInfo() }, { title: 'Status', section: this._renderComponents() }];
+    const sections: [IComponentPageSection] = [{ title: 'Badges', section: this._renderStatusesInfo() }, { title: 'Status', section: this._renderComponents() }];
 
     return (
       <ComponentPage
@@ -43,7 +43,7 @@ export class ComponentStatusPage extends React.Component<{}, {}> {
   }
 
   private _renderComponent(componentName: string): JSX.Element {
-    let component = AllComponentsStatus[componentName];
+    const component = AllComponentsStatus[componentName];
     return (
       <tr key={ componentName + '-key' }>
         <th className='componentCells'><h3>{ componentName } </h3> </th>
diff --git a/packages/office-ui-fabric-react/src/demo/index.tsx b/packages/office-ui-fabric-react/src/demo/index.tsx
index 54d15e9e76fd3..23e30f0ccfa08 100644
--- a/packages/office-ui-fabric-react/src/demo/index.tsx
+++ b/packages/office-ui-fabric-react/src/demo/index.tsx
@@ -23,7 +23,7 @@ let rootElement: HTMLElement | null;
 
 // Return the anchor link from the URL without the hash
 function _extractAnchorLink(path: string) {
-  let index = path.lastIndexOf('#');
+  const index = path.lastIndexOf('#');
   if (index >= 0) {
     path = path.substr(index + 1, path.length - index);
   }
@@ -32,7 +32,7 @@ function _extractAnchorLink(path: string) {
 
 function _scrollAnchorLink() {
   if ((window.location.hash.match(/#/g) || []).length > 1) {
-    let anchor = _extractAnchorLink(window.location.hash);
+    const anchor = _extractAnchorLink(window.location.hash);
     document.getElementById(anchor)!.scrollIntoView();
   }
 }
@@ -50,8 +50,8 @@ function _onLoad() {
 }
 
 function _getRoutes() {
-  let routes = AppDefinition.testPages.map(page => <Route key={ page.key } path={ page.url } component={ page.component } />);
-  let appRoutes: JSX.Element[] = [];
+  const routes = AppDefinition.testPages.map(page => <Route key={ page.key } path={ page.url } component={ page.component } />);
+  const appRoutes: JSX.Element[] = [];
 
   AppDefinition.examplePages.forEach(group => {
     group.links
@@ -89,7 +89,7 @@ function _onUnload() {
   }
 }
 
-let isReady = document.readyState === 'interactive' || document.readyState === 'complete';
+const isReady = document.readyState === 'interactive' || document.readyState === 'complete';
 
 if (isReady) {
   _onLoad();
diff --git a/packages/office-ui-fabric-react/src/utilities/color/colors.ts b/packages/office-ui-fabric-react/src/utilities/color/colors.ts
index 3ae8159acb0cf..f7b08e9ab90a6 100644
--- a/packages/office-ui-fabric-react/src/utilities/color/colors.ts
+++ b/packages/office-ui-fabric-react/src/utilities/color/colors.ts
@@ -156,14 +156,14 @@ export function hsv2rgb(h: number, s: number, v: number): IRGB {
 }
 
 export function getColorFromString(inputColor: string): IColor | undefined {
-  let color = cssColor(inputColor);
+  const color = cssColor(inputColor);
 
   if (!color) {
     return;
   }
 
-  let { a, b, g, r } = color;
-  let { h, s, v } = rgb2hsv(r, g, b);
+  const { a, b, g, r } = color;
+  const { h, s, v } = rgb2hsv(r, g, b);
 
   return {
     a: a,
@@ -179,10 +179,10 @@ export function getColorFromString(inputColor: string): IColor | undefined {
 }
 
 export function getColorFromRGBA(rgba: { r: number, g: number, b: number, a: number }): IColor {
-  let { a, b, g, r } = rgba;
-  let { h, s, v } = rgb2hsv(r, g, b);
+  const { a, b, g, r } = rgba;
+  const { h, s, v } = rgb2hsv(r, g, b);
 
-  let hex = rgb2hex(r, g, b);
+  const hex = rgb2hex(r, g, b);
   return {
     a: a,
     b: b,
@@ -201,8 +201,8 @@ export function getFullColorString(color: IColor): string {
 }
 
 export function updateSV(color: IColor, s: number, v: number): IColor {
-  let { r, g, b } = hsv2rgb(color.h, s, v);
-  let hex = rgb2hex(r, g, b);
+  const { r, g, b } = hsv2rgb(color.h, s, v);
+  const hex = rgb2hex(r, g, b);
 
   return {
     a: color.a,
@@ -218,8 +218,8 @@ export function updateSV(color: IColor, s: number, v: number): IColor {
 }
 
 export function updateH(color: IColor, h: number): IColor {
-  let { r, g, b } = hsv2rgb(h, color.s, color.v);
-  let hex = rgb2hex(r, g, b);
+  const { r, g, b } = hsv2rgb(h, color.s, color.v);
+  const hex = rgb2hex(r, g, b);
 
   return {
     a: color.a,
diff --git a/packages/office-ui-fabric-react/src/utilities/color/shades.ts b/packages/office-ui-fabric-react/src/utilities/color/shades.ts
index c3278c90aaa02..f03e41b77595b 100644
--- a/packages/office-ui-fabric-react/src/utilities/color/shades.ts
+++ b/packages/office-ui-fabric-react/src/utilities/color/shades.ts
@@ -105,7 +105,7 @@ export function getShade(color: IColor, shade: Shade, isInverted = false) {
   }
 
   let hsl = Colors.hsv2hsl(color.h, color.s, color.v);
-  let tableIndex = shade - 1;
+  const tableIndex = shade - 1;
   let _soften = _lighten;
   let _strongen = _darken;
   if (isInverted) {
@@ -146,7 +146,7 @@ export function getBackgroundShade(color: IColor, shade: Shade, isInverted = fal
   }
 
   let hsl = Colors.hsv2hsl(color.h, color.s, color.v);
-  let tableIndex = shade - 1;
+  const tableIndex = shade - 1;
   if (!isInverted) { // lightish
     hsl = _darken(hsl, WhiteShadeTableBG[tableIndex]);
   } else { // default: if (hsl.l / 100 < .5) { // darkish
@@ -173,15 +173,15 @@ export function getContrastRatio(color1: IColor, color2: IColor) {
     }
   }
 
-  let r1 = _getThing(color1.r / MAX_COLOR_RGBA);
-  let g1 = _getThing(color1.g / MAX_COLOR_RGBA);
-  let b1 = _getThing(color1.b / MAX_COLOR_RGBA);
+  const r1 = _getThing(color1.r / MAX_COLOR_RGBA);
+  const g1 = _getThing(color1.g / MAX_COLOR_RGBA);
+  const b1 = _getThing(color1.b / MAX_COLOR_RGBA);
   let L1 = (.2126 * r1) + (.7152 * g1) + (.0722 * b1); // relative luminance of first color
   L1 += .05;
 
-  let r2 = _getThing(color2.r / MAX_COLOR_RGBA);
-  let g2 = _getThing(color2.g / MAX_COLOR_RGBA);
-  let b2 = _getThing(color2.b / MAX_COLOR_RGBA);
+  const r2 = _getThing(color2.r / MAX_COLOR_RGBA);
+  const g2 = _getThing(color2.g / MAX_COLOR_RGBA);
+  const b2 = _getThing(color2.b / MAX_COLOR_RGBA);
   let L2 = (.2126 * r2) + (.7152 * g2) + (.0722 * b2); // relative luminance of second color
   L2 += .05;
 
diff --git a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts
index e6ac56c83b57e..4e977978f3306 100644
--- a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts
+++ b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.test.ts
@@ -19,39 +19,39 @@ enum Months {
 describe('DateMath', () => {
 
   it('can add days', () => {
-    let startDate = new Date(2016, Months.Apr, 1);
-    let result = DateMath.addDays(startDate, 5);
-    let expected = new Date(2016, Months.Apr, 6);
+    const startDate = new Date(2016, Months.Apr, 1);
+    const result = DateMath.addDays(startDate, 5);
+    const expected = new Date(2016, Months.Apr, 6);
 
     expect(result.getTime()).toEqual(expected.getTime());
   });
 
   it('can add days across a month boundary', () => {
-    let startDate = new Date(2016, Months.Mar, 30);
-    let result = DateMath.addDays(startDate, 5);
-    let expected = new Date(2016, Months.Apr, 4);
+    const startDate = new Date(2016, Months.Mar, 30);
+    const result = DateMath.addDays(startDate, 5);
+    const expected = new Date(2016, Months.Apr, 4);
 
     expect(result.getTime()).toEqual(expected.getTime());
   });
 
   it('can add days across multiple month boundaries', () => {
-    let startDate = new Date(2016, Months.Mar, 31);
-    let result = DateMath.addDays(startDate, 65);
-    let expected = new Date(2016, Months.Jun, 4);
+    const startDate = new Date(2016, Months.Mar, 31);
+    const result = DateMath.addDays(startDate, 65);
+    const expected = new Date(2016, Months.Jun, 4);
 
     expect(result.getTime()).toEqual(expected.getTime());
   });
 
   it('can add days across leap day boundaries', () => {
-    let startDate = new Date(2016, Months.Feb, 28);
-    let result = DateMath.addDays(startDate, 2);
-    let expected = new Date(2016, Months.Mar, 1);
+    const startDate = new Date(2016, Months.Feb, 28);
+    const result = DateMath.addDays(startDate, 2);
+    const expected = new Date(2016, Months.Mar, 1);
 
     expect(result.getTime()).toEqual(expected.getTime());
   });
 
   it('can add months', () => {
-    let startDate = new Date(2015, Months.Dec, 31);
+    const startDate = new Date(2015, Months.Dec, 31);
 
     let result = DateMath.addMonths(startDate, 1);
     let expected = new Date(2016, Months.Jan, 31);
@@ -127,39 +127,39 @@ describe('DateMath', () => {
   });
 
   it('can subtract days', () => {
-    let startDate = new Date(2016, Months.Apr, 30);
-    let result = DateMath.addDays(startDate, -5);
-    let expected = new Date(2016, Months.Apr, 25);
+    const startDate = new Date(2016, Months.Apr, 30);
+    const result = DateMath.addDays(startDate, -5);
+    const expected = new Date(2016, Months.Apr, 25);
 
     expect(result.getTime()).toEqual(expected.getTime());
   });
 
   it('can subtract days across a month boundry', () => {
-    let startDate = new Date(2016, Months.Apr, 1);
-    let result = DateMath.addDays(startDate, -5);
-    let expected = new Date(2016, Months.Mar, 27);
+    const startDate = new Date(2016, Months.Apr, 1);
+    const result = DateMath.addDays(startDate, -5);
+    const expected = new Date(2016, Months.Mar, 27);
 
     expect(result.getTime()).toEqual(expected.getTime());
   });
 
   it('can subtract days across multiple month boundaries', () => {
-    let startDate = new Date(2016, Months.Jul, 4);
-    let result = DateMath.addDays(startDate, -65);
-    let expected = new Date(2016, Months.Apr, 30);
+    const startDate = new Date(2016, Months.Jul, 4);
+    const result = DateMath.addDays(startDate, -65);
+    const expected = new Date(2016, Months.Apr, 30);
 
     expect(result.getTime()).toEqual(expected.getTime());
   });
 
   it('can subtract days across leap day boundaries', () => {
-    let startDate = new Date(2016, Months.Mar, 1);
-    let result = DateMath.addDays(startDate, -2);
-    let expected = new Date(2016, Months.Feb, 28);
+    const startDate = new Date(2016, Months.Mar, 1);
+    const result = DateMath.addDays(startDate, -2);
+    const expected = new Date(2016, Months.Feb, 28);
 
     expect(result.getTime()).toEqual(expected.getTime());
   });
 
   it('can subtract months', () => {
-    let startDate = new Date(2016, Months.Dec, 31);
+    const startDate = new Date(2016, Months.Dec, 31);
 
     let result = DateMath.addMonths(startDate, -12);
     let expected = new Date(2015, Months.Dec, 31);
@@ -269,7 +269,7 @@ describe('DateMath', () => {
   });
 
   it('can get date range array', () => {
-    let date = new Date(2017, 2, 16);
+    const date = new Date(2017, 2, 16);
 
     // Date range: day
     let dateRangeArray = DateMath.getDateRangeArray(date, DateRangeType.Day, DayOfWeek.Sunday);
@@ -282,7 +282,7 @@ describe('DateMath', () => {
     Array(7).forEach((val, i) => expect(DateMath.compareDates(dateRangeArray[i], expectedDates[i])).toBe(true));
 
     // Date range: work week
-    let workWeekDays = [
+    const workWeekDays = [
       DayOfWeek.Monday,
       DayOfWeek.Tuesday,
       DayOfWeek.Thursday,
@@ -464,7 +464,7 @@ describe('DateMath', () => {
   });
 
   it('can get the month start and end', () => {
-    let date = new Date('Dec 15 2017');
+    const date = new Date('Dec 15 2017');
 
     // First day of month
     expect(DateMath.compareDates(new Date('Dec 1 2017'), DateMath.getMonthStart(date))).toBe(true);
@@ -474,7 +474,7 @@ describe('DateMath', () => {
   });
 
   it('can get the year start and end', () => {
-    let date = new Date('Dec 15 2017');
+    const date = new Date('Dec 15 2017');
 
     // First day of year
     expect(DateMath.compareDates(new Date('Jan 1 2017'), DateMath.getYearStart(date))).toBe(true);
diff --git a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
index 8e45f1af1cd7c..4e44342cd51bc 100644
--- a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
+++ b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
@@ -9,7 +9,7 @@ import { assertNever } from '../../Utilities';
  * @return {Date} A new Date object offset from the origin date by the given number of days
  */
 export function addDays(date: Date, days: number): Date {
-  let result = new Date(date.getTime());
+  const result = new Date(date.getTime());
   result.setDate(result.getDate() + days);
   return result;
 }
@@ -34,7 +34,7 @@ export function addWeeks(date: Date, weeks: number): Date {
  */
 export function addMonths(date: Date, months: number): Date {
   let result = new Date(date.getTime());
-  let newMonth = result.getMonth() + months;
+  const newMonth = result.getMonth() + months;
   result.setMonth(newMonth);
 
   // We want to maintain the same day-of-month, but that may not be possible if the new month doesn't have enough days.
@@ -152,7 +152,7 @@ export function compareDatePart(date1: Date, date2: Date): Number {
  * @returns {Date[]} An array of dates representing the date range containing the specified date.
  */
 export function getDateRangeArray(date: Date, dateRangeType: DateRangeType, firstDayOfWeek: DayOfWeek, workWeekDays?: DayOfWeek[]): Date[] {
-  let datesArray = new Array<Date>();
+  const datesArray = new Array<Date>();
   let startDate: Date;
   let endDate = null;
 
@@ -204,7 +204,7 @@ export function getDateRangeArray(date: Date, dateRangeType: DateRangeType, firs
  * @returns {bool} True if the date matches one of the dates in the specified array, false otherwise.
  */
 export function isInDateRangeArray(date: Date, dateRange: Date[]): boolean {
-  for (let dateInRange of dateRange) {
+  for (const dateInRange of dateRange) {
     if (compareDates(date, dateInRange)) {
       return true;
     }
@@ -225,17 +225,17 @@ export function getWeekNumbersInMonth(
   firstDayOfWeek: DayOfWeek,
   firstWeekOfYear: FirstWeekOfYear,
   navigatedDate: Date) {
-  let selectedYear = navigatedDate.getFullYear();
-  let selectedMonth = navigatedDate.getMonth();
+  const selectedYear = navigatedDate.getFullYear();
+  const selectedMonth = navigatedDate.getMonth();
   let dayOfMonth = 1;
-  let fistDayOfMonth = new Date(selectedYear, selectedMonth, dayOfMonth);
-  let endOfFirstWeek = dayOfMonth
+  const fistDayOfMonth = new Date(selectedYear, selectedMonth, dayOfMonth);
+  const endOfFirstWeek = dayOfMonth
     + (firstDayOfWeek + TimeConstants.DaysInOneWeek - 1)
     - adjustWeekDay(firstDayOfWeek, fistDayOfMonth.getDay());
   let endOfWeekRange = new Date(selectedYear, selectedMonth, endOfFirstWeek);
   dayOfMonth = endOfWeekRange.getDate();
 
-  let weeksArray = [];
+  const weeksArray = [];
   for (let i = 0; i < weeksInMonth; i++) {
     // Get week number for end of week
     weeksArray.push(getWeekNumber(endOfWeekRange, firstDayOfWeek, firstWeekOfYear));
@@ -313,14 +313,14 @@ function getDatePartHashValue(date: Date) {
 * @return {Number} The week's number in the year.
 */
 function getWeekOfYearFullDays(date: Date, firstDayOfWeek: DayOfWeek, numberOfFullDays: number) {
-  let dayOfYear = getDayOfYear(date) - 1;
-  let dateWeekDay = date.getDay();
+  const dayOfYear = getDayOfYear(date) - 1;
+  const dateWeekDay = date.getDay();
   let num = (date.getDay()) - (dayOfYear % TimeConstants.DaysInOneWeek);
 
-  let lastDayOfPrevYear = new Date(date.getFullYear() - 1, MonthOfYear.December, 31);
-  let daysInYear = getDayOfYear(lastDayOfPrevYear) - 1;
+  const lastDayOfPrevYear = new Date(date.getFullYear() - 1, MonthOfYear.December, 31);
+  const daysInYear = getDayOfYear(lastDayOfPrevYear) - 1;
 
-  let adjustedWeekDay = adjustWeekDay(firstDayOfWeek, dateWeekDay);
+  const adjustedWeekDay = adjustWeekDay(firstDayOfWeek, dateWeekDay);
 
   let num2 = ((firstDayOfWeek - num) + (2 * TimeConstants.DaysInOneWeek)) % TimeConstants.DaysInOneWeek;
   if ((num2 !== 0) && (num2 >= numberOfFullDays)) {
@@ -349,9 +349,9 @@ function getWeekOfYearFullDays(date: Date, firstDayOfWeek: DayOfWeek, numberOfFu
 * @return {Number} The week's number in the year.
 */
 function getFirstDayWeekOfYear(date: Date, firstDayOfWeek: number) {
-  let num = getDayOfYear(date) - 1;
-  let num2 = (date.getDay()) - (num % TimeConstants.DaysInOneWeek);
-  let num3 = ((num2 - firstDayOfWeek) + 2 * TimeConstants.DaysInOneWeek) % TimeConstants.DaysInOneWeek;
+  const num = getDayOfYear(date) - 1;
+  const num2 = (date.getDay()) - (num % TimeConstants.DaysInOneWeek);
+  const num3 = ((num2 - firstDayOfWeek) + 2 * TimeConstants.DaysInOneWeek) % TimeConstants.DaysInOneWeek;
 
   return Math.floor(((num + num3) / TimeConstants.DaysInOneWeek) + 1);
 }
@@ -375,8 +375,8 @@ function adjustWeekDay(firstDayOfWeek: DayOfWeek, dateWeekDay: DayOfWeek) {
  * @return {Number} The day's number in the year.
  */
 function getDayOfYear(date: Date) {
-  let month = date.getMonth();
-  let year = date.getFullYear();
+  const month = date.getMonth();
+  const year = date.getFullYear();
   let daysUntilDate = 0;
 
   for (let i = 0; i < month; i++) {
diff --git a/packages/office-ui-fabric-react/src/utilities/dateValues/TimeConstants.ts b/packages/office-ui-fabric-react/src/utilities/dateValues/TimeConstants.ts
index b81095d5c4af0..78057a176776d 100644
--- a/packages/office-ui-fabric-react/src/utilities/dateValues/TimeConstants.ts
+++ b/packages/office-ui-fabric-react/src/utilities/dateValues/TimeConstants.ts
@@ -1,7 +1,7 @@
 /**
  * Common constants and methods
  */
-let TimeConstants = {
+const TimeConstants = {
   MillisecondsInOneDay: 86400000,
   MillisecondsIn1Sec: 1000,
   MillisecondsIn1Min: 60000,
diff --git a/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx b/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx
index f2325ce53dd34..a6e46052fa9af 100644
--- a/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx
@@ -29,7 +29,7 @@ export function withContainsFocus<TProps extends { containsFocus?: boolean }, S>
     }
 
     public render() {
-      let { containsFocus } = this.state;
+      const { containsFocus } = this.state;
 
       return (
         <div ref='root' onFocus={ this._handleFocus } onBlur={ this._handleBlur }>
diff --git a/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx b/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx
index ba4fc1a55e618..c192b013b4d83 100644
--- a/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx
@@ -48,7 +48,7 @@ export function withResponsiveMode<TProps extends { responsiveMode?: ResponsiveM
 
     public componentDidMount() {
       this._events.on(window, 'resize', () => {
-        let responsiveMode = this._getResponsiveMode();
+        const responsiveMode = this._getResponsiveMode();
 
         if (responsiveMode !== this.state.responsiveMode) {
           this.setState({
@@ -63,7 +63,7 @@ export function withResponsiveMode<TProps extends { responsiveMode?: ResponsiveM
     }
 
     public render() {
-      let { responsiveMode } = this.state;
+      const { responsiveMode } = this.state;
 
       return (
         <ComposedComponent ref={ this._updateComposedComponentRef } responsiveMode={ responsiveMode } { ...this.props as any } />
@@ -72,7 +72,7 @@ export function withResponsiveMode<TProps extends { responsiveMode?: ResponsiveM
 
     private _getResponsiveMode(): ResponsiveMode {
       let responsiveMode = ResponsiveMode.small;
-      let win = getWindow();
+      const win = getWindow();
 
       if (typeof win !== 'undefined') {
         try {
diff --git a/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx b/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx
index f7a3519f2d678..edfd68e72432a 100644
--- a/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx
@@ -64,11 +64,11 @@ export function withViewport<TProps extends { viewport?: IViewport }, TState>(Co
     }
 
     public render() {
-      let { viewport } = this.state;
+      const { viewport } = this.state;
       const {
         skipViewportMeasures
       } = this.props as IWithViewportProps;
-      let isViewportVisible = skipViewportMeasures || (viewport!.width > 0 && viewport!.height > 0);
+      const isViewportVisible = skipViewportMeasures || (viewport!.width > 0 && viewport!.height > 0);
 
       return (
         <div className='ms-Viewport' ref='root' style={ { minWidth: 1, minHeight: 1 } }>
@@ -89,18 +89,18 @@ export function withViewport<TProps extends { viewport?: IViewport }, TState>(Co
 
     /* Note: using lambda here because decorators don't seem to work in decorators. */
     private _updateViewport = (withForceUpdate?: boolean) => {
-      let { viewport } = this.state;
-      let viewportElement = (this.refs as any).root;
-      let scrollElement = findScrollableParent(viewportElement);
-      let scrollRect = getRect(scrollElement);
-      let clientRect = getRect(viewportElement);
-      let updateComponent = () => {
+      const { viewport } = this.state;
+      const viewportElement = (this.refs as any).root;
+      const scrollElement = findScrollableParent(viewportElement);
+      const scrollRect = getRect(scrollElement);
+      const clientRect = getRect(viewportElement);
+      const updateComponent = () => {
         if (withForceUpdate && this._composedComponentInstance) {
           this._composedComponentInstance.forceUpdate();
         }
       };
 
-      let isSizeChanged = (
+      const isSizeChanged = (
         (clientRect && clientRect.width) !== viewport!.width ||
         (scrollRect && scrollRect.height) !== viewport!.height);
 
diff --git a/packages/office-ui-fabric-react/src/utilities/dragdrop/DragDropHelper.tsx b/packages/office-ui-fabric-react/src/utilities/dragdrop/DragDropHelper.tsx
index 0f56b7d7da29a..625d6505a221b 100644
--- a/packages/office-ui-fabric-react/src/utilities/dragdrop/DragDropHelper.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/dragdrop/DragDropHelper.tsx
@@ -238,7 +238,7 @@ export class DragDropHelper implements IDragDropHelper {
   }
 
   private _onDragEnd(target: IDragDropTarget, event: DragEvent) {
-    let { options } = target;
+    const { options } = target;
     if (options.onDragEnd) {
       options.onDragEnd(options.context.data, event);
     }
@@ -283,7 +283,7 @@ export class DragDropHelper implements IDragDropHelper {
    * The target will handle style change on dragenter and dragleave events.
    */
   private _onMouseMove(target: IDragDropTarget, event: MouseEvent) {
-    let {
+    const {
       // use buttons property here since ev.button in some edge case is not updating well during the move.
       // but firefox doesn't support it, so we set the default value when it is not defined.
       buttons = MOUSEMOVE_PRIMARY_BUTTON
@@ -295,7 +295,7 @@ export class DragDropHelper implements IDragDropHelper {
       return;
     }
 
-    let { root, options, key } = target;
+    const { root, options, key } = target;
     if (this._isDragging) {
       if (this._isDroppable(target)) {
         // we can have nested drop targets in the DOM, like a folder inside a group. In that case, when we drag into
@@ -319,8 +319,8 @@ export class DragDropHelper implements IDragDropHelper {
       }
     } else if (this._dragData) {
       if (this._isDraggable(target)) {
-        let xDiff = this._dragData.clientX - event.clientX;
-        let yDiff = this._dragData.clientY - event.clientY;
+        const xDiff = this._dragData.clientX - event.clientX;
+        const yDiff = this._dragData.clientY - event.clientY;
         if (xDiff * xDiff + yDiff * yDiff >= this._distanceSquaredForDrag) {
           if (this._dragData.dragTarget) {
             this._isDragging = true;
@@ -378,7 +378,7 @@ export class DragDropHelper implements IDragDropHelper {
    * determine whether the child target is a descendant of the parent
    */
   private _isChild(parent: React.ReactInstance, child: React.ReactInstance): boolean {
-    let parentElement = ReactDOM.findDOMNode(parent);
+    const parentElement = ReactDOM.findDOMNode(parent);
     let childElement = ReactDOM.findDOMNode(child);
     while (childElement && childElement.parentElement) {
       if (childElement.parentElement === parentElement) {
@@ -390,14 +390,14 @@ export class DragDropHelper implements IDragDropHelper {
   }
 
   private _isDraggable(target: IDragDropTarget): boolean {
-    let { options } = target;
+    const { options } = target;
     return !!(options.canDrag && options.canDrag(options.context.data));
   }
 
   private _isDroppable(target: IDragDropTarget): boolean {
     // TODO: take the drag item into consideration to prevent dragging an item into the same group
-    let { options } = target;
-    let dragContext = this._dragData && this._dragData.dragTarget ? this._dragData.dragTarget.options.context : undefined;
+    const { options } = target;
+    const dragContext = this._dragData && this._dragData.dragTarget ? this._dragData.dragTarget.options.context : undefined;
     return !!(options.canDrop && options.canDrop(options.context, dragContext));
   }
 }
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.base.tsx b/packages/office-ui-fabric-react/src/utilities/grid/Grid.base.tsx
index 4a1672fcff08d..eb445c226724e 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.base.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.base.tsx
@@ -22,7 +22,7 @@ export class GridBase extends BaseComponent<IGridProps, {}> implements IGrid {
   }
 
   public render() {
-    let {
+    const {
       items,
       columnCount,
       onRenderItem,
@@ -36,9 +36,9 @@ export class GridBase extends BaseComponent<IGridProps, {}> implements IGrid {
     const classNames = getClassNames(getStyles!, { theme: this.props.theme! });
 
     // Array to store the cells in the correct row index
-    let rowsOfItems: any[][] = toMatrix(items, columnCount);
+    const rowsOfItems: any[][] = toMatrix(items, columnCount);
 
-    let content = (
+    const content = (
       <table
         {...htmlProps}
         aria-posinset={ positionInSet }
@@ -49,7 +49,7 @@ export class GridBase extends BaseComponent<IGridProps, {}> implements IGrid {
       >
         <tbody>
           {
-            rowsOfItems.map((rows: any[], rowIndex) => {
+            rowsOfItems.map((rows: any[], rowIndex: any) => {
               return (
                 <tr
                   role={ 'row' }
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx b/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx
index 1f0281f717e6d..feb7945da8ddd 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.test.tsx
@@ -21,7 +21,7 @@ const DEFAULT_ITEMS: any[] = [
 describe('Grid', () => {
 
   it('Can render a grid with width of four', () => {
-    let wrapper = shallow(
+    const wrapper = shallow(
       <GridBase
         items={ DEFAULT_ITEMS }
         columnCount={ 4 }
@@ -37,7 +37,7 @@ describe('Grid', () => {
     expect(wrapper.find('[aria-setsize]').length).toEqual(0);
   });
   it('Can render a grid with width of 2', () => {
-    let wrapper = shallow(
+    const wrapper = shallow(
       <GridBase
         items={ DEFAULT_ITEMS }
         columnCount={ 2 }
@@ -53,7 +53,7 @@ describe('Grid', () => {
     expect(wrapper.find('[aria-setsize]').length).toEqual(0);
   });
   it('Can render a grid with posInSet and setSize', () => {
-    let wrapper = shallow(
+    const wrapper = shallow(
       <GridBase
         items={ DEFAULT_ITEMS }
         columnCount={ 2 }
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx b/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx
index dbc8cb0df7472..20c0cb155071d 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx
@@ -15,7 +15,7 @@ export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P,
   };
 
   public render() {
-    let {
+    const {
       item,
       id,
       className,
@@ -59,7 +59,7 @@ export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P,
 
   @autobind
   private _onClick() {
-    let {
+    const {
       onClick,
       disabled,
       item
@@ -72,7 +72,7 @@ export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P,
 
   @autobind
   private _onMouseEnter() {
-    let {
+    const {
       onHover,
       disabled,
       item
@@ -85,7 +85,7 @@ export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P,
 
   @autobind
   private _onMouseLeave() {
-    let {
+    const {
       onHover,
       disabled
       } = this.props as P;
@@ -97,7 +97,7 @@ export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P,
 
   @autobind
   private _onFocus() {
-    let {
+    const {
       onFocus,
       disabled,
       item
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning.test.ts b/packages/office-ui-fabric-react/src/utilities/positioning.test.ts
index ab77bcc2b842f..73c07cab98251 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning.test.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning.test.ts
@@ -18,11 +18,11 @@ function stringifyResults(expected: any, actual: any) {
 }
 
 function positionCalloutTest(testValues: ITestValues, alignment: DirectionalHint, validate: ITestValidation) {
-  let { callout, target, bounds, beakWidth } = testValues;
-  let gap: number = positioningFunctions._calculateActualBeakWidthInPixels(beakWidth) / 2;
-  let result: positioningFunctions.IElementPosition = positioningFunctions._positionElementWithinBounds(callout, target, bounds, positioningFunctions._getPositionData(alignment), gap);
+  const { callout, target, bounds, beakWidth } = testValues;
+  const gap: number = positioningFunctions._calculateActualBeakWidthInPixels(beakWidth) / 2;
+  const result: positioningFunctions.IElementPosition = positioningFunctions._positionElementWithinBounds(callout, target, bounds, positioningFunctions._getPositionData(alignment), gap);
 
-  let beak = positioningFunctions._positionBeak(beakWidth, { ...result, targetRectangle: target });
+  const beak = positioningFunctions._positionBeak(beakWidth, { ...result, targetRectangle: target });
 
   expect(result.elementRectangle).toEqual(validate.callout);
 
@@ -37,8 +37,8 @@ function positionCalloutTest(testValues: ITestValues, alignment: DirectionalHint
 }
 
 function validateNoBeakTest(testValues: ITestValues, alignment: DirectionalHint, validate: ITestValidation) {
-  let { callout, target, bounds, beakWidth } = testValues;
-  let result: positioningFunctions.IElementPosition = positioningFunctions._positionElementWithinBounds(callout, target, bounds, positioningFunctions._getPositionData(alignment), beakWidth);
+  const { callout, target, bounds, beakWidth } = testValues;
+  const result: positioningFunctions.IElementPosition = positioningFunctions._positionElementWithinBounds(callout, target, bounds, positioningFunctions._getPositionData(alignment), beakWidth);
 
   expect(result.elementRectangle).toEqual(validate.callout);
 }
@@ -46,24 +46,24 @@ function validateNoBeakTest(testValues: ITestValues, alignment: DirectionalHint,
 describe('Callout Positioning', () => {
   it('Correctly positions the callout without beak', () => {
 
-    let noBeakTestCase: ITestValues = {
+    const noBeakTestCase: ITestValues = {
       callout: new Rectangle(0, 300, 0, 300),
       target: new Rectangle(400, 800, 400, 800),
       bounds: new Rectangle(0, 1600, 0, 1600),
       beakWidth: 0,
     };
 
-    let validateNoBeakBottomLeft: ITestValidation = {
+    const validateNoBeakBottomLeft: ITestValidation = {
       callout: new Rectangle(400, 700, 800, 1100),
       beak: null
     };
 
-    let validateNoBeakLeft: ITestValidation = {
+    const validateNoBeakLeft: ITestValidation = {
       callout: new Rectangle(100, 400, 400, 700),
       beak: null
     };
 
-    let validateNoBeakTop: ITestValidation = {
+    const validateNoBeakTop: ITestValidation = {
       callout: new Rectangle(400, 700, 100, 400),
       beak: null
     };
@@ -77,24 +77,24 @@ describe('Callout Positioning', () => {
 
   it('Correctly positions the callout with the beak', () => {
 
-    let basicTestCase: ITestValues = {
+    const basicTestCase: ITestValues = {
       callout: new Rectangle(0, 300, 0, 300),
       target: new Rectangle(400, 800, 400, 800),
       bounds: new Rectangle(0, 1600, 0, 1600),
       beakWidth: 16,
     };
 
-    let validateBottomLeft: ITestValidation = {
+    const validateBottomLeft: ITestValidation = {
       callout: new Rectangle(400, 700, 800 + positioningFunctions._calculateActualBeakWidthInPixels(8), 1100 + positioningFunctions._calculateActualBeakWidthInPixels(8)),
       beak: new Rectangle(192, 208, -8, 8)
     };
 
-    let validateBottomCenter: ITestValidation = {
+    const validateBottomCenter: ITestValidation = {
       callout: new Rectangle(450, 750, 800 + positioningFunctions._calculateActualBeakWidthInPixels(8), 1100 + positioningFunctions._calculateActualBeakWidthInPixels(8)),
       beak: new Rectangle(142, 158, -8, 8)
     };
 
-    let validateBottomRight: ITestValidation = {
+    const validateBottomRight: ITestValidation = {
       callout: new Rectangle(500, 800, 800 + positioningFunctions._calculateActualBeakWidthInPixels(8), 1100 + positioningFunctions._calculateActualBeakWidthInPixels(8)),
       beak: new Rectangle(92, 108, -8, 8)
     };
@@ -107,13 +107,13 @@ describe('Callout Positioning', () => {
   });
 
   it('Correctly determines max height', () => {
-    let getMaxHeight = positioningFunctions._getMaxHeightFromTargetRectangle;
+    const getMaxHeight = positioningFunctions._getMaxHeightFromTargetRectangle;
     let targetTop;
     let targetBot;
-    let targetRight = targetBot = 20;
-    let targetLeft = targetTop = 10;
-    let targetRectangle = new Rectangle(targetLeft, targetRight, targetTop, targetBot);
-    let bounds = new Rectangle(0, 1000, 0, 1000);
+    const targetRight = targetBot = 20;
+    const targetLeft = targetTop = 10;
+    const targetRectangle = new Rectangle(targetLeft, targetRight, targetTop, targetBot);
+    const bounds = new Rectangle(0, 1000, 0, 1000);
 
     let testMax = getMaxHeight(targetRectangle, DirectionalHint.bottomCenter, 0, bounds);
     // Test for maxHeight from bottom of target to bottom of bounds
@@ -129,14 +129,14 @@ describe('Callout Positioning', () => {
   });
 
   it('Correctly determines max height with a gapSpace included', () => {
-    let getMaxHeight = positioningFunctions._getMaxHeightFromTargetRectangle;
+    const getMaxHeight = positioningFunctions._getMaxHeightFromTargetRectangle;
     let targetTop;
     let targetBot;
-    let targetRight = targetBot = 200;
-    let targetLeft = targetTop = 100;
-    let targetRectangle = new Rectangle(targetLeft, targetRight, targetTop, targetBot);
-    let bounds = new Rectangle(0, 1000, 0, 1000);
-    let gapSpace = 10;
+    const targetRight = targetBot = 200;
+    const targetLeft = targetTop = 100;
+    const targetRectangle = new Rectangle(targetLeft, targetRight, targetTop, targetBot);
+    const bounds = new Rectangle(0, 1000, 0, 1000);
+    const gapSpace = 10;
 
     let testMax = getMaxHeight(targetRectangle, DirectionalHint.bottomCenter, gapSpace, bounds);
 
@@ -151,5 +151,4 @@ describe('Callout Positioning', () => {
     // Test for maxHeight from top of target to bottom of bounds
     expect(testMax).toBe(1000 - targetTop - gapSpace);
   });
-
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts b/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts
index ed1975ab16ede..5dda3a42753c8 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts
@@ -34,7 +34,7 @@ function _createPositionData(
 }
 
 // Currently the beakPercent is set to 50 for all positions meaning that it should tend to the center of the target
-let DirectionalDictionary: { [key: number]: IPositionDirectionalHintData } = {
+const DirectionalDictionary: { [key: number]: IPositionDirectionalHintData } = {
   [DirectionalHint.topLeftEdge]: _createPositionData(RectangleEdge.top, RectangleEdge.left),
   [DirectionalHint.topCenter]: _createPositionData(RectangleEdge.top),
   [DirectionalHint.topRightEdge]: _createPositionData(RectangleEdge.top, RectangleEdge.right),
@@ -104,7 +104,7 @@ export module positioningFunctions {
    * If there are no out of bounds edges it returns an empty array.
    */
   function _getOutOfBoundsEdges(rect: Rectangle, boundingRect: Rectangle): RectangleEdge[] {
-    let outOfBounds: RectangleEdge[] = new Array<RectangleEdge>();
+    const outOfBounds: RectangleEdge[] = new Array<RectangleEdge>();
 
     if (rect.top < boundingRect.top) {
       outOfBounds.push(RectangleEdge.top);
@@ -250,7 +250,7 @@ export module positioningFunctions {
     bounding: Rectangle,
     positionData: IPositionDirectionalHintData,
     gap: number = 0, ): IElementPosition {
-    let directions: RectangleEdge[] = [RectangleEdge.left, RectangleEdge.right, RectangleEdge.bottom, RectangleEdge.top];
+    const directions: RectangleEdge[] = [RectangleEdge.left, RectangleEdge.right, RectangleEdge.bottom, RectangleEdge.top];
     let currentEstimate = rect;
     let currentEdge = positionData.targetEdge;
     let currentAlignment = positionData.alignmentEdge;
@@ -302,7 +302,7 @@ export module positioningFunctions {
     directionalHintFixed?: boolean,
     coverTarget?: boolean): IElementPosition {
 
-    let {
+    const {
       alignmentEdge
     } = positionData;
     let elementEstimate: IElementPosition = {
@@ -315,7 +315,7 @@ export module positioningFunctions {
       elementEstimate = _flipToFit(element, target, bounding, positionData, gap);
     }
 
-    let outOfBounds = _getOutOfBoundsEdges(element, bounding);
+    const outOfBounds = _getOutOfBoundsEdges(element, bounding);
 
     for (const direction of outOfBounds) {
       elementEstimate.elementRectangle = _alignEdges(elementEstimate.elementRectangle, bounding, direction);
@@ -360,7 +360,7 @@ export module positioningFunctions {
     coverTarget?: boolean
   ): Rectangle {
     let estimatedElementPosition: Rectangle;
-    let {
+    const {
       alignmentEdge,
       targetEdge
     } = positionData;
@@ -419,7 +419,7 @@ export module positioningFunctions {
     targetEdge: RectangleEdge,
     alignmentEdge?: RectangleEdge
   ): IPartialIRectangle {
-    let returnValue: IPartialIRectangle = {};
+    const returnValue: IPartialIRectangle = {};
 
     const hostRect: Rectangle = _getRectangleFromHTMLElement(hostElement);
     const elementEdge = targetEdge * -1;
@@ -453,7 +453,7 @@ export module positioningFunctions {
     directionalHint: DirectionalHint = DirectionalHint.bottomAutoEdge,
     directionalHintForRTL?: DirectionalHint
   ): IPositionDirectionalHintData {
-    let positionInformation: IPositionDirectionalHintData = { ...DirectionalDictionary[directionalHint] };
+    const positionInformation: IPositionDirectionalHintData = { ...DirectionalDictionary[directionalHint] };
     if (getRTL()) {
 
       // If alignment edge exists and that alignment edge is -2 or 2, right or left, then flip it.
@@ -506,7 +506,7 @@ export module positioningFunctions {
     gap: number,
     directionalHintFixed?: boolean,
     coverTarget?: boolean): IElementPosition {
-    let estimatedElementPosition: Rectangle = _estimatePosition(elementToPosition, target, positionData, gap, coverTarget);
+    const estimatedElementPosition: Rectangle = _estimatePosition(elementToPosition, target, positionData, gap, coverTarget);
     if (_isRectangleWithinBounds(estimatedElementPosition, bounding)) {
       return {
         elementRectangle: estimatedElementPosition,
@@ -524,7 +524,7 @@ export module positioningFunctions {
     // The "host" element that we will use to help position the beak.
     const actualElement = new Rectangle(0, elementPosition.elementRectangle.width, 0, elementPosition.elementRectangle.height);
     const returnEdge = elementPosition.alignmentEdge ? elementPosition.alignmentEdge : _getFlankingEdges(targetEdge).positiveEdge;
-    let returnValue: IPartialIRectangle = {};
+    const returnValue: IPartialIRectangle = {};
 
     returnValue[RectangleEdge[targetEdge]] = _getEdgeValue(positionedBeak, targetEdge);
     returnValue[RectangleEdge[returnEdge]] = _getRelativeEdgeDifference(positionedBeak, actualElement, returnEdge);
@@ -567,7 +567,7 @@ export module positioningFunctions {
   }
 
   export function _getRectangleFromHTMLElement(element: HTMLElement): Rectangle {
-    let clientRect: ClientRect = element.getBoundingClientRect();
+    const clientRect: ClientRect = element.getBoundingClientRect();
 
     return new Rectangle(clientRect.left, clientRect.right, clientRect.top, clientRect.bottom);
   }
@@ -580,20 +580,20 @@ export module positioningFunctions {
     let targetRectangle: Rectangle;
     if (target) {
       if ((target as MouseEvent).preventDefault) {
-        let ev: MouseEvent = target as MouseEvent;
+        const ev = target as MouseEvent;
         targetRectangle = new Rectangle(ev.clientX, ev.clientX, ev.clientY, ev.clientY);
       } else if ((target as HTMLElement).getBoundingClientRect) {
         targetRectangle = _getRectangleFromHTMLElement(target as HTMLElement);
         // HTMLImgElements can have x and y values. The check for it being a point must go last.
       } else {
-        let point: IPoint = target as IPoint;
+        const point: IPoint = target as IPoint;
         targetRectangle = new Rectangle(point.x, point.x, point.y, point.y);
       }
 
       if (!_isRectangleWithinBounds(targetRectangle, bounds)) {
-        let outOfBounds: RectangleEdge[] = _getOutOfBoundsEdges(targetRectangle, bounds);
+        const outOfBounds: RectangleEdge[] = _getOutOfBoundsEdges(targetRectangle, bounds);
 
-        for (let direction of outOfBounds) {
+        for (const direction of outOfBounds) {
           (targetRectangle as any)[RectangleEdge[direction]] = (bounds as any)[RectangleEdge[direction]];
         }
       }
@@ -680,7 +680,7 @@ export module positioningFunctions {
     callout: HTMLElement): ICalloutPositionedInfo {
     const beakWidth: number = !props.isBeakVisible ? 0 : (props.beakWidth || 0);
     const gap: number = _calculateActualBeakWidthInPixels(beakWidth) / 2 + (props.gapSpace ? props.gapSpace : 0);
-    let positionProps: IPositionProps = props;
+    const positionProps: IPositionProps = props;
     positionProps.gapSpace = gap;
     const positionedElement: IElementPositionInfo = _positionElementRelative(positionProps, hostElement, callout);
     const beakPositioned: Rectangle = _positionBeak(
@@ -763,11 +763,11 @@ export function positionCallout(props: IPositionProps,
  * If no bounds are provided then the window is treated as the bounds.
  */
 export function getMaxHeight(target: HTMLElement | MouseEvent | IPoint, targetEdge: DirectionalHint, gapSpace: number = 0, bounds?: IRectangle) {
-  let mouseTarget: MouseEvent = target as MouseEvent;
-  let elementTarget: HTMLElement = target as HTMLElement;
-  let pointTarget: IPoint = target as IPoint;
+  const mouseTarget: MouseEvent = target as MouseEvent;
+  const elementTarget: HTMLElement = target as HTMLElement;
+  const pointTarget: IPoint = target as IPoint;
   let targetRect: Rectangle;
-  let boundingRectangle = bounds ?
+  const boundingRectangle = bounds ?
     positioningFunctions._getRectangleFromIRect(bounds) :
     new Rectangle(0, window.innerWidth - getScrollbarWidth(), 0, window.innerHeight);
 
diff --git a/packages/office-ui-fabric-react/src/utilities/router/Router.tsx b/packages/office-ui-fabric-react/src/utilities/router/Router.tsx
index 83564f8b77ede..b200d640c24c6 100644
--- a/packages/office-ui-fabric-react/src/utilities/router/Router.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/router/Router.tsx
@@ -26,9 +26,9 @@ export class Router extends BaseComponent<IRouterProps, {}> {
   }
 
   private _getPath() {
-    let path = location.hash,
-      hashIndex = path.lastIndexOf('#'),
-      questionMarkIndex = path.indexOf('?');
+    let path = location.hash;
+    const hashIndex = path.lastIndexOf('#'),
+          questionMarkIndex = path.indexOf('?');
 
     // Look for the start of a query in the currentPath, then strip out the query to find the correct page to render
     if (questionMarkIndex > -1) {
@@ -46,13 +46,14 @@ export class Router extends BaseComponent<IRouterProps, {}> {
     path = path || this._getPath();
     children = children || this.props.children;
 
-    let routes = React.Children.toArray(children);
+    const routes = React.Children.toArray(children);
 
     for (let i = 0; i < routes.length; i++) {
-      let route: any = routes[i];
+      const route: any = routes[i];
 
       if (_match(path, route)) {
-        let { component, getComponent } = route.props;
+        const { getComponent } = route.props;
+        let { component } = route.props;
 
         if (getComponent) {
           let asynchronouslyResolved = false;
@@ -73,7 +74,7 @@ export class Router extends BaseComponent<IRouterProps, {}> {
         }
 
         if (component) {
-          let componentChildren = this._resolveRoute(path, route.props.children || []);
+          const componentChildren = this._resolveRoute(path, route.props.children || []);
 
           if (componentChildren) {
             return React.createElement(component, { key: route.key }, componentChildren) as React.DOMElement<any, any>;
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/Selection.test.ts b/packages/office-ui-fabric-react/src/utilities/selection/Selection.test.ts
index fb4845b2e17d6..434f112874bdf 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/Selection.test.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selection/Selection.test.ts
@@ -1,14 +1,14 @@
 import { Selection } from './Selection';
 import { IObjectWithKey } from './interfaces';
 
-let setA = [{ key: 'a' }, { key: 'b' }, { key: 'c' }];
-let setB = [{ key: 'a' }, { key: 'd' }, { key: 'b' }];
+const setA = [{ key: 'a' }, { key: 'b' }, { key: 'c' }];
+const setB = [{ key: 'a' }, { key: 'd' }, { key: 'b' }];
 
 describe('Selection', () => {
 
   it('fires change events only when selection changes occur', () => {
     let changeCount = 0;
-    let selection = new Selection({ onSelectionChanged: () => changeCount++ });
+    const selection = new Selection({ onSelectionChanged: () => changeCount++ });
 
     selection.setItems(setA, false);
     expect(changeCount).toEqual(0);
@@ -53,7 +53,7 @@ describe('Selection', () => {
 
   it('returns false on isAllSelected when no items are selectable', () => {
     let changeEvents = 0;
-    let selection = new Selection({
+    const selection = new Selection({
       canSelectItem: (item: IObjectWithKey) => false,
       onSelectionChanged: () => changeEvents++
     });
@@ -71,7 +71,7 @@ describe('Selection', () => {
 
   it('resets unselectable count on setting new items', () => {
     let canSelect = false;
-    let selection = new Selection({
+    const selection = new Selection({
       canSelectItem: (item: IObjectWithKey) => canSelect
     });
 
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts b/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
index f7e6b55ba664c..cea9eb6076125 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
@@ -107,8 +107,8 @@ export class Selection implements ISelection {
    * cleared.
    */
   public setItems(items: IObjectWithKey[], shouldClear = true) {
-    let newKeyToIndexMap: { [key: string]: number } = {};
-    let newUnselectableIndices: { [key: string]: boolean } = {};
+    const newKeyToIndexMap: { [key: string]: number } = {};
+    const newUnselectableIndices: { [key: string]: boolean } = {};
     let hasSelectionChanged = false;
 
     this.setChangeEvents(false);
@@ -118,7 +118,7 @@ export class Selection implements ISelection {
 
     // Build lookup table for quick selection evaluation.
     for (let i = 0; i < items.length; i++) {
-      let item = items[i];
+      const item = items[i];
 
       if (item) {
         const key = this.getKey(item, i);
@@ -139,14 +139,14 @@ export class Selection implements ISelection {
     }
 
     // Check the exemption list for discrepencies.
-    let newExemptedIndicies: { [key: string]: boolean } = {};
+    const newExemptedIndicies: { [key: string]: boolean } = {};
 
-    for (let indexProperty in this._exemptedIndices) {
+    for (const indexProperty in this._exemptedIndices) {
       if (this._exemptedIndices.hasOwnProperty(indexProperty)) {
-        let index = Number(indexProperty);
-        let item = this._items[index];
-        let exemptKey = item ? this.getKey(item, Number(index)) : undefined;
-        let newIndex = exemptKey ? newKeyToIndexMap[exemptKey] : index;
+        const index = Number(indexProperty);
+        const item = this._items[index];
+        const exemptKey = item ? this.getKey(item, Number(index)) : undefined;
+        const newIndex = exemptKey ? newKeyToIndexMap[exemptKey] : index;
 
         if (newIndex === undefined) {
           // We don't know the index of the item any more so it's either moved or removed.
@@ -223,7 +223,7 @@ export class Selection implements ISelection {
       return false;
     }
 
-    let endIndex = fromIndex + count;
+    const endIndex = fromIndex + count;
 
     for (let i = fromIndex; i < endIndex; i++) {
       if (!this.isIndexSelected(i)) {
@@ -249,7 +249,7 @@ export class Selection implements ISelection {
   }
 
   public isKeySelected(key: string): boolean {
-    let index = this._keyToIndexMap[key];
+    const index = this._keyToIndexMap[key];
 
     return this.isIndexSelected(index);
   }
@@ -266,7 +266,7 @@ export class Selection implements ISelection {
       return;
     }
 
-    let selectableCount = this._items ? (this._items.length - this._unselectableCount) : 0;
+    const selectableCount = this._items ? (this._items.length - this._unselectableCount) : 0;
 
     this.setChangeEvents(false);
 
@@ -286,7 +286,7 @@ export class Selection implements ISelection {
   }
 
   public setKeySelected(key: string, isSelected: boolean, shouldAnchor: boolean): void {
-    let index = this._keyToIndexMap[key];
+    const index = this._keyToIndexMap[key];
 
     if (index >= 0) {
       this.setIndexSelected(index, isSelected, shouldAnchor);
@@ -308,9 +308,9 @@ export class Selection implements ISelection {
 
     this.setChangeEvents(false);
 
-    let isExempt = this._exemptedIndices[index];
+    const isExempt = this._exemptedIndices[index];
     let hasChanged = false;
-    let canSelect = !this._unselectableIndices[index];
+    const canSelect = !this._unselectableIndices[index];
 
     if (canSelect) {
       if (isSelected && this.mode === SelectionMode.single) {
@@ -362,9 +362,9 @@ export class Selection implements ISelection {
       return;
     }
 
-    let anchorIndex = this._anchoredIndex || 0;
+    const anchorIndex = this._anchoredIndex || 0;
     let startIndex = Math.min(index, anchorIndex);
-    let endIndex = Math.max(index, anchorIndex);
+    const endIndex = Math.max(index, anchorIndex);
 
     this.setChangeEvents(false);
 
@@ -396,8 +396,8 @@ export class Selection implements ISelection {
       return;
     }
 
-    let isRangeSelected = this.isRangeSelected(fromIndex, count);
-    let endIndex = fromIndex + count;
+    const isRangeSelected = this.isRangeSelected(fromIndex, count);
+    const endIndex = fromIndex + count;
 
     if (this.mode === SelectionMode.single && count > 1) {
       return;
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
index 4e2fb23369619..52cf9bf8e6c1a 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
@@ -73,8 +73,8 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   private _isTouchTimeoutId: number | undefined;
 
   public componentDidMount() {
-    let win = getWindow(this.refs.root);
-    let scrollElement = findScrollableParent(this.refs.root);
+    const win = getWindow(this.refs.root);
+    const scrollElement = findScrollableParent(this.refs.root);
 
     // Track the latest modifier keys globally.
     this._events.on(win, 'keydown, keyup', this._updateModifiers, true);
@@ -147,18 +147,18 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
    */
   @autobind
   private _onFocus(ev: React.FocusEvent<HTMLElement>) {
-    let target = ev.target as HTMLElement;
-    let { selection } = this.props;
-    let isToggleModifierPressed = this._isCtrlPressed || this._isMetaPressed;
+    const target = ev.target as HTMLElement;
+    const { selection } = this.props;
+    const isToggleModifierPressed = this._isCtrlPressed || this._isMetaPressed;
 
     const selectionMode = this._getSelectionMode();
 
     if (this._shouldHandleFocus && selectionMode !== SelectionMode.none) {
-      let isToggle = this._hasAttribute(target, SELECTION_TOGGLE_ATTRIBUTE_NAME);
-      let itemRoot = this._findItemRoot(target);
+      const isToggle = this._hasAttribute(target, SELECTION_TOGGLE_ATTRIBUTE_NAME);
+      const itemRoot = this._findItemRoot(target);
 
       if (!isToggle && itemRoot) {
-        let index = this._getItemIndex(itemRoot);
+        const index = this._getItemIndex(itemRoot);
 
         if (isToggleModifierPressed) {
           // set anchor only.
@@ -183,7 +183,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     this._updateModifiers(ev);
 
     let target = ev.target as HTMLElement;
-    let itemRoot = this._findItemRoot(target);
+    const itemRoot = this._findItemRoot(target);
 
     while (target !== this.refs.root) {
       if (this._hasAttribute(target, SELECTALL_TOGGLE_ALL_ATTRIBUTE_NAME)) {
@@ -213,7 +213,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     this._updateModifiers(ev);
 
     let target = ev.target as HTMLElement;
-    let itemRoot = this._findItemRoot(target);
+    const itemRoot = this._findItemRoot(target);
 
     // No-op if selection is disabled
     if (this._isSelectionDisabled(target)) {
@@ -225,7 +225,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
         this._onToggleAllClick(ev);
         break;
       } else if (itemRoot) {
-        let index = this._getItemIndex(itemRoot);
+        const index = this._getItemIndex(itemRoot);
 
         if (this._hasAttribute(target, SELECTION_TOGGLE_ATTRIBUTE_NAME)) {
           if (this._isShiftPressed) {
@@ -292,13 +292,13 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
       return;
     }
 
-    let { onItemInvoked } = this.props;
-    let itemRoot = this._findItemRoot(target);
+    const { onItemInvoked } = this.props;
+    const itemRoot = this._findItemRoot(target);
 
     const selectionMode = this._getSelectionMode();
 
     if (itemRoot && onItemInvoked && selectionMode !== SelectionMode.none && !this._isInputElement(target)) {
-      let index = this._getItemIndex(itemRoot);
+      const index = this._getItemIndex(itemRoot);
 
       while (target !== this.refs.root) {
         if (
@@ -334,9 +334,9 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
       return;
     }
 
-    let { selection } = this.props;
-    let isSelectAllKey = ev.which === KeyCodes.a && (this._isCtrlPressed || this._isMetaPressed);
-    let isClearSelectionKey = ev.which === KeyCodes.escape;
+    const { selection } = this.props;
+    const isSelectAllKey = ev.which === KeyCodes.a && (this._isCtrlPressed || this._isMetaPressed);
+    const isClearSelectionKey = ev.which === KeyCodes.escape;
 
     // Ignore key downs from input elements.
     if (this._isInputElement(target)) {
@@ -362,11 +362,11 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
       return;
     }
 
-    let itemRoot = this._findItemRoot(target);
+    const itemRoot = this._findItemRoot(target);
 
     // If a key was pressed within an item, we should treat "enters" as invokes and "space" as toggle
     if (itemRoot) {
-      let index = this._getItemIndex(itemRoot);
+      const index = this._getItemIndex(itemRoot);
 
       while (target !== this.refs.root) {
         if (this._hasAttribute(target, SELECTION_TOGGLE_ATTRIBUTE_NAME)) {
@@ -395,7 +395,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   }
 
   private _onToggleAllClick(ev: React.MouseEvent<HTMLElement>) {
-    let { selection } = this.props;
+    const { selection } = this.props;
 
     const selectionMode = this._getSelectionMode();
 
@@ -407,7 +407,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   }
 
   private _onToggleClick(ev: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>, index: number) {
-    let { selection } = this.props;
+    const { selection } = this.props;
 
     const selectionMode = this._getSelectionMode();
 
@@ -421,7 +421,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     if (selectionMode === SelectionMode.multiple) {
       selection.toggleIndexSelected(index);
     } else if (selectionMode === SelectionMode.single) {
-      let isSelected = selection.isIndexSelected(index);
+      const isSelected = selection.isIndexSelected(index);
       selection.setAllSelected(false);
       selection.setIndexSelected(index, !isSelected, true);
     } else {
@@ -438,7 +438,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   }
 
   private _onInvokeClick(ev: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>, index: number) {
-    let { selection, onItemInvoked } = this.props;
+    const { selection, onItemInvoked } = this.props;
 
     if (onItemInvoked) {
       onItemInvoked(selection.getItems()[index], index, ev.nativeEvent);
@@ -448,8 +448,8 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   }
 
   private _onItemSurfaceClick(ev: React.SyntheticEvent<HTMLElement>, index: number) {
-    let { selection } = this.props;
-    let isToggleModifierPressed = this._isCtrlPressed || this._isMetaPressed;
+    const { selection } = this.props;
+    const isToggleModifierPressed = this._isCtrlPressed || this._isMetaPressed;
 
     const selectionMode = this._getSelectionMode();
 
@@ -467,7 +467,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   }
 
   private _onInvokeMouseDown(ev: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>, index: number) {
-    let { selection } = this.props;
+    const { selection } = this.props;
 
     // Only do work if item is not selected.
     if (selection.isIndexSelected(index)) {
@@ -487,8 +487,8 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   }
 
   private _clearAndSelectIndex(index: number) {
-    let { selection } = this.props;
-    let isAlreadySingleSelected = selection.getSelectedCount() === 1 && selection.isIndexSelected(index);
+    const { selection } = this.props;
+    const isAlreadySingleSelected = selection.getSelectedCount() === 1 && selection.isIndexSelected(index);
 
     if (!isAlreadySingleSelected) {
       selection.setChangeEvents(false);
@@ -513,11 +513,11 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   }
 
   private _findItemRoot(target: HTMLElement): HTMLElement | undefined {
-    let { selection } = this.props;
+    const { selection } = this.props;
 
     while (target !== this.refs.root) {
-      let indexValue = target.getAttribute(SELECTION_INDEX_ATTRIBUTE_NAME);
-      let index = Number(indexValue);
+      const indexValue = target.getAttribute(SELECTION_INDEX_ATTRIBUTE_NAME);
+      const index = Number(indexValue);
 
       if (indexValue !== null && index >= 0 && index < selection.getItems().length) {
         break;
@@ -553,7 +553,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   }
 
   private _isNonHandledClick(element: HTMLElement): boolean {
-    let doc = getDocument();
+    const doc = getDocument();
 
     if (doc && element) {
       while (element && element !== doc.documentElement) {
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx b/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
index 5ff1fa25d8d13..e0b1e06df8b38 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/examples/Selection.Basic.Example.tsx
@@ -35,7 +35,7 @@ export interface ISelectionItemExampleProps {
  */
 export class SelectionItemExample extends React.Component<ISelectionItemExampleProps, {}> {
   public render() {
-    let { item, itemIndex, selection } = this.props;
+    const { item, itemIndex, selection } = this.props;
     let isSelected = false;
 
     if (selection && itemIndex !== undefined) {
@@ -87,7 +87,7 @@ export class SelectionBasicExample extends React.Component<{}, ISelectionBasicEx
   }
 
   public render() {
-    let { items, selection } = this.state;
+    const { items, selection } = this.state;
 
     return (
       <div className='ms-SelectionBasicExample'>
@@ -120,13 +120,13 @@ export class SelectionBasicExample extends React.Component<{}, ISelectionBasicEx
   }
 
   private _onToggleSelectAll() {
-    let { selection } = this.state;
+    const { selection } = this.state;
     selection.toggleAllSelected();
   }
 
   private _onSelectionModeChanged(ev: React.MouseEvent<HTMLElement>, menuItem: IContextualMenuItem) {
     this.setState((previousState: ISelectionBasicExampleState) => {
-      let newSelection = new Selection({
+      const newSelection = new Selection({
         onSelectionChanged: this._onSelectionChanged,
         canSelectItem: previousState.canSelect === 'vowels' ? this._canSelectItem : undefined,
         selectionMode: menuItem.data
@@ -140,10 +140,10 @@ export class SelectionBasicExample extends React.Component<{}, ISelectionBasicEx
   }
 
   private _onCanSelectChanged(ev: React.MouseEvent<HTMLElement>, menuItem: IContextualMenuItem) {
-    let canSelectItem = (menuItem.data === 'vowels') ? this._canSelectItem : undefined;
+    const canSelectItem = (menuItem.data === 'vowels') ? this._canSelectItem : undefined;
 
     this.setState((previousState: ISelectionBasicExampleState) => {
-      let newSelection = new Selection({ onSelectionChanged: this._onSelectionChanged, canSelectItem: canSelectItem, selectionMode: previousState.selection.mode });
+      const newSelection = new Selection({ onSelectionChanged: this._onSelectionChanged, canSelectItem: canSelectItem, selectionMode: previousState.selection.mode });
       newSelection.setItems(previousState.items as IObjectWithKey[], false);
       return {
         selection: newSelection,
@@ -157,7 +157,7 @@ export class SelectionBasicExample extends React.Component<{}, ISelectionBasicEx
   }
 
   private _getCommandItems(): IContextualMenuItem[] {
-    let { selection, canSelect } = this.state;
+    const { selection, canSelect } = this.state;
 
     return [
       {
diff --git a/packages/office-ui-fabric-react/tslint.json b/packages/office-ui-fabric-react/tslint.json
index cbaba79e30a85..1ace03220456e 100644
--- a/packages/office-ui-fabric-react/tslint.json
+++ b/packages/office-ui-fabric-react/tslint.json
@@ -14,7 +14,6 @@
     "no-any": false,
     "variable-name": false,
     "no-internal-module": false,
-    "prefer-const": false,
     "typedef": [
       false
     ],
diff --git a/packages/styling/tslint.json b/packages/styling/tslint.json
index 621ee6ba04605..672d9eba8927e 100644
--- a/packages/styling/tslint.json
+++ b/packages/styling/tslint.json
@@ -2,5 +2,7 @@
   "extends": [
     "office-ui-fabric-react-tslint"
   ],
-  "rules": {}
+  "rules": {
+    "prefer-const": false
+  }
 }
\ No newline at end of file
diff --git a/packages/utilities/tslint.json b/packages/utilities/tslint.json
index 621ee6ba04605..672d9eba8927e 100644
--- a/packages/utilities/tslint.json
+++ b/packages/utilities/tslint.json
@@ -2,5 +2,7 @@
   "extends": [
     "office-ui-fabric-react-tslint"
   ],
-  "rules": {}
+  "rules": {
+    "prefer-const": false
+  }
 }
\ No newline at end of file

From 51d47a80898d9834d40205274268e60730f306a1 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 20 Feb 2018 09:53:26 -0800
Subject: [PATCH 1400/1641] Misc changes from 6.0 branch (#4031)

* Misc changes

* Adding change files.
---
 apps/vr-tests/src/stories/Button.stories.tsx  |  8 +++-
 .../src/stories/CommandBar.stories.tsx        | 44 ++++++++++++++-----
 .../misc-changes_2018-02-20-17-19.json        | 11 +++++
 .../misc-changes_2018-02-20-17-19.json        | 11 +++++
 .../misc-changes_2018-02-20-17-19.json        | 11 +++++
 .../ComponentPage/ComponentPage.scss          |  1 +
 .../components/ExampleCard/ExampleCard.scss   |  2 +-
 .../src/components/Header/Header.tsx          |  2 +-
 packages/merge-styles/src/mergeStyles.test.ts | 16 +++++++
 .../Button/BaseButton.classNames.ts           |  4 +-
 .../demo/ComponentStatus/ComponentStatus.tsx  |  1 +
 .../ComponentStatus/ComponentStatus.types.ts  |  3 +-
 12 files changed, 95 insertions(+), 19 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/misc-changes_2018-02-20-17-19.json
 create mode 100644 common/changes/@uifabric/merge-styles/misc-changes_2018-02-20-17-19.json
 create mode 100644 common/changes/office-ui-fabric-react/misc-changes_2018-02-20-17-19.json

diff --git a/apps/vr-tests/src/stories/Button.stories.tsx b/apps/vr-tests/src/stories/Button.stories.tsx
index bc51fdbfb9022..ce9b0125a0087 100644
--- a/apps/vr-tests/src/stories/Button.stories.tsx
+++ b/apps/vr-tests/src/stories/Button.stories.tsx
@@ -22,12 +22,16 @@ const commandProps: IButtonProps = {
       {
         key: 'emailMessage',
         name: 'Email message',
-        icon: 'Mail'
+        iconProps: {
+          iconName: 'Mail'
+        }
       },
       {
         key: 'calendarEvent',
         name: 'Calendar event',
-        icon: 'Calendar'
+        iconProps: {
+          iconName: 'Calendar'
+        }
       }
     ]
   }
diff --git a/apps/vr-tests/src/stories/CommandBar.stories.tsx b/apps/vr-tests/src/stories/CommandBar.stories.tsx
index 4915dc68c6207..7fd8133cd4fba 100644
--- a/apps/vr-tests/src/stories/CommandBar.stories.tsx
+++ b/apps/vr-tests/src/stories/CommandBar.stories.tsx
@@ -9,18 +9,24 @@ const items = [
   {
     key: 'newItem',
     name: 'New',
-    icon: 'Add',
+    iconProps: {
+      iconName: 'Add'
+    },
     subMenuProps: {
       items: [
         {
           key: 'emailMessage',
           name: 'Email message',
-          icon: 'Mail'
+          iconProps: {
+            iconName: 'Mail'
+          }
         },
         {
           key: 'calendarEvent',
           name: 'Calendar event',
-          icon: 'Calendar'
+          iconProps: {
+            iconName: 'Calendar'
+          }
         }
       ],
     },
@@ -28,22 +34,30 @@ const items = [
   {
     key: 'upload',
     name: 'Upload',
-    icon: 'Upload'
+    iconProps: {
+      iconName: 'Upload'
+    }
   },
   {
     key: 'share',
     name: 'Share',
-    icon: 'Share'
+    iconProps: {
+      iconName: 'Share'
+    }
   },
   {
     key: 'download',
     name: 'Download',
-    icon: 'Download'
+    iconProps: {
+      iconName: 'Download'
+    }
   },
   {
     key: 'disabled',
     name: 'Disabled...',
-    icon: 'Cancel',
+    iconProps: {
+      iconName: 'Cancel'
+    },
     disabled: true
   }
 ];
@@ -52,17 +66,23 @@ const farItems = [
   {
     key: 'sort',
     name: 'Sort',
-    icon: 'SortLines'
+    iconProps: {
+      iconName: 'SortLines'
+    }
   },
   {
     key: 'tile',
     name: 'Grid view',
-    icon: 'Tiles'
+    iconProps: {
+      iconName: 'Tiles'
+    }
   },
   {
     key: 'info',
     name: 'Info',
-    icon: 'Info'
+    iconProps: {
+      iconName: 'Info'
+    }
   }
 ];
 
@@ -100,8 +120,8 @@ storiesOf('CommandBar', module)
   .add('Text only', () => (
     <CommandBar
       isSearchBoxVisible={ false }
-      items={ items.map(item => ({ ...item, icon: '' })) }
-      farItems={ farItems.map(item => ({ ...item, icon: '' })) }
+      items={ items.map(item => ({ ...item, iconProps: undefined })) }
+      farItems={ farItems.map(item => ({ ...item, iconProps: undefined })) }
     />
   ))
   .add('Icons only', () => (
diff --git a/common/changes/@uifabric/example-app-base/misc-changes_2018-02-20-17-19.json b/common/changes/@uifabric/example-app-base/misc-changes_2018-02-20-17-19.json
new file mode 100644
index 0000000000000..7ef0035e98ee8
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/misc-changes_2018-02-20-17-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Tweaking css for example pages.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/misc-changes_2018-02-20-17-19.json b/common/changes/@uifabric/merge-styles/misc-changes_2018-02-20-17-19.json
new file mode 100644
index 0000000000000..2630dcaeb2a2b
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/misc-changes_2018-02-20-17-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "Adding test coverage for media queries.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/misc-changes_2018-02-20-17-19.json b/common/changes/office-ui-fabric-react/misc-changes_2018-02-20-17-19.json
new file mode 100644
index 0000000000000..d76ed12d0b88b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/misc-changes_2018-02-20-17-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Buttons: moving className lower in the merge list so that it has more precedence than default rules.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss b/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss
index d7ef28480b82e..9e4557531f4f9 100644
--- a/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss
+++ b/packages/example-app-base/src/components/ComponentPage/ComponentPage.scss
@@ -11,6 +11,7 @@ $dontColor: #A61E22;
 
   .ComponentPage {
     background-color: $ms-color-white;
+    overflow: hidden;
   }
 
   .ComponentPage-header {
diff --git a/packages/example-app-base/src/components/ExampleCard/ExampleCard.scss b/packages/example-app-base/src/components/ExampleCard/ExampleCard.scss
index 1446d102617ee..b20740c108081 100644
--- a/packages/example-app-base/src/components/ExampleCard/ExampleCard.scss
+++ b/packages/example-app-base/src/components/ExampleCard/ExampleCard.scss
@@ -57,7 +57,7 @@
     max-height: 80vh;
     overflow-x: hidden;
     overflow-y: auto;
-    padding: 20px 0;
+    padding: 20px 4px;
     position: relative;
   }
 
diff --git a/packages/example-app-base/src/components/Header/Header.tsx b/packages/example-app-base/src/components/Header/Header.tsx
index 4ad1bd3331cfc..5e75803c20ae4 100644
--- a/packages/example-app-base/src/components/Header/Header.tsx
+++ b/packages/example-app-base/src/components/Header/Header.tsx
@@ -125,7 +125,7 @@ export class Header extends React.Component<IHeaderProps, IHeaderState> {
     return [{
       key: 'isRTL',
       name: `Render in ${this._isRTLEnabled ? 'LTR' : 'RTL'}`,
-      icon: 'Settings',
+      iconProps: { iconName: 'Settings' },
       onClick: this._onRTLToggled
     }];
   }
diff --git a/packages/merge-styles/src/mergeStyles.test.ts b/packages/merge-styles/src/mergeStyles.test.ts
index 7aba032d6df4e..ba07949b4e700 100644
--- a/packages/merge-styles/src/mergeStyles.test.ts
+++ b/packages/merge-styles/src/mergeStyles.test.ts
@@ -80,4 +80,20 @@ describe('mergeStyles', () => {
     );
   });
 
+  it('can register media queries', () => {
+    mergeStyles({
+      background: 'red',
+      selectors: {
+        '@media screen and (max-width: 100px)': {
+          background: 'green'
+        }
+      }
+    });
+
+    expect(_stylesheet.getRules()).toEqual(
+      '.css-0{background:red;}' +
+      '@media screen and (max-width: 100px){.css-0{background:green;}}'
+    );
+  });
+
 });
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
index 7d1ad3759b2be..65da87a32c14c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
@@ -31,7 +31,6 @@ export const getBaseButtonClassNames = memoizeFunction((
       'ms-Button',
       styles.root,
       variantClassName,
-      className,
       checked && [
         'is-checked',
         styles.rootChecked
@@ -72,7 +71,8 @@ export const getBaseButtonClassNames = memoizeFunction((
           ':hover': styles.rootCheckedHovered,
           ':active': styles.rootCheckedPressed
         }
-      }
+      },
+      className
     ],
     flexContainer: [
       'ms-Button-flexContainer',
diff --git a/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.tsx b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.tsx
index a54fa10602999..70e8c9b23e998 100644
--- a/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.tsx
+++ b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.tsx
@@ -59,6 +59,7 @@ export class ComponentStatus extends React.Component<IComponentStatusProps, {}>
   private _colorForComponentStateStatus(testCoverageStatus: ChecklistStatus | undefined): string {
     switch (testCoverageStatus) {
       case ChecklistStatus.unknown:
+      case ChecklistStatus.notApplicable:
         return 'lightgrey';
       case ChecklistStatus.fail:
       case ChecklistStatus.none:
diff --git a/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.types.ts b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.types.ts
index 7388bad06d88d..31320904cd1df 100644
--- a/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.types.ts
+++ b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatus.types.ts
@@ -8,9 +8,10 @@ export interface IComponentStatusProps {
 
 export enum ChecklistStatus {
   unknown = 'Unknown',
+  notApplicable = 'Not applicable',
   pass = 'Pass',
   fail = 'Fail',
-  none = 'No Tests',
+  none = 'No tests',
   poor = 'Poor',
   fair = 'Fair',
   good = 'Good'

From c168360f1ae7e1a97df1d278552b1b3498c13c28 Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Tue, 20 Feb 2018 10:45:05 -0800
Subject: [PATCH 1401/1641] ResizeGroup SCSS to MergeStyles Part 1: File
 Structure (#4022)

Converting ResizeGroup SCSS to MergeStyles step 1 - file structure
---
 ...izegroup-scss2ms-pt1_2018-02-19-18-39.json |  11 +
 .../ResizeGroup/ResizeGroup.base.tsx          | 369 +++++++++++++++++
 .../ResizeGroup/ResizeGroup.styles.ts         |  28 ++
 .../ResizeGroup/ResizeGroup.test.tsx          |   5 +-
 .../components/ResizeGroup/ResizeGroup.tsx    | 380 +-----------------
 .../ResizeGroup/ResizeGroup.types.ts          |  42 +-
 6 files changed, 462 insertions(+), 373 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/resizegroup-scss2ms-pt1_2018-02-19-18-39.json
 create mode 100644 packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.base.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.styles.ts

diff --git a/common/changes/office-ui-fabric-react/resizegroup-scss2ms-pt1_2018-02-19-18-39.json b/common/changes/office-ui-fabric-react/resizegroup-scss2ms-pt1_2018-02-19-18-39.json
new file mode 100644
index 0000000000000..2e202be423c5a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/resizegroup-scss2ms-pt1_2018-02-19-18-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Converting ResizeGroup SCSS to MergeStyles step 1 - file structure",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.base.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.base.tsx
new file mode 100644
index 0000000000000..c51f005d893c7
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.base.tsx
@@ -0,0 +1,369 @@
+import * as React from 'react';
+import * as PropTypes from 'prop-types';
+import {
+  BaseComponent,
+  css,
+  divProperties,
+  getNativeProps,
+  provideContext
+} from '../../Utilities';
+import { IResizeGroupProps } from './ResizeGroup.types';
+import * as styles from './ResizeGroup.scss';
+
+const RESIZE_DELAY = 16;
+
+export interface IResizeGroupState {
+
+  /**
+   * Final data used to render proper sized component
+  */
+  renderedData?: any;
+
+  /**
+   * Data to render in a hidden div for measurement
+   */
+  dataToMeasure?: any;
+
+  /**
+   * Set to true when the content container might have new dimensions and should
+   * be remeasured.
+   */
+  measureContainer?: boolean;
+
+  /**
+   * Are we resizing to accommodate having more or less available space?
+   * The 'grow' direction is when the container may have more room than the last render,
+   * such as when a window resize occurs. This means we will try to fit more content in the window.
+   * The 'shrink' direction is when the contents don't fit in the container and we need
+   * to find a transformation of the data that makes everything fit.
+   */
+  resizeDirection?: 'grow' | 'shrink';
+}
+
+/**
+ * Returns a simple object is able to store measurements with a given key.
+ */
+export const getMeasurementCache = () => {
+  const measurementsCache: { [key: string]: number } = {};
+
+  return {
+    /**
+     * Checks if the provided data has a cacheKey. If it has a cacheKey and there is a
+     * corresponding entry in the measurementsCache, then it will return that value.
+     * Returns undefined otherwise.
+     */
+    getCachedMeasurement: (data: any): number | undefined => {
+      if (data && data.cacheKey && measurementsCache.hasOwnProperty(data.cacheKey)) {
+        return measurementsCache[data.cacheKey];
+      }
+
+      return undefined;
+    },
+    /**
+     * Should be called whenever there is a new measurement associated with a given data object.
+     * If the data has a cacheKey, store that measurement in the measurementsCache.
+     */
+    addMeasurementToCache: (data: any, measurement: number): void => {
+      if (data.cacheKey) {
+        measurementsCache[data.cacheKey] = measurement;
+      }
+    }
+  };
+};
+
+/**
+ * Returns a function that is able to compute the next state for the ResizeGroup given the current
+ * state and any measurement updates.
+ */
+export const getNextResizeGroupStateProvider = (measurementCache = getMeasurementCache()) => {
+  const _measurementCache = measurementCache;
+  let _containerWidth: number | undefined;
+
+  /**
+   * Gets the width of the data rendered in a hidden div.
+   * @param measuredData - The data corresponding to the measurement we wish to take.
+   * @param getElementToMeasureWidth - A function that returns the measurement of the rendered data. Only called when the measurement
+   * is not in the cache.
+   */
+  function _getMeasuredWidth(measuredData: any, getElementToMeasureWidth: () => number): number {
+    const cachedWidth = _measurementCache.getCachedMeasurement(measuredData);
+    if (cachedWidth !== undefined) {
+      return cachedWidth;
+    }
+
+    const measuredWidth = getElementToMeasureWidth();
+    _measurementCache.addMeasurementToCache(measuredData, measuredWidth);
+    return measuredWidth;
+  }
+
+  /**
+   * Will get the next IResizeGroupState based on the current data while trying to shrink contents
+   * to fit in the container.
+   * @param data - The initial data point to start measuring.
+   * @param onReduceData - Function that transforms the data into something that should render with less width.
+   * @param getElementToMeasureWidth - A function that returns the measurement of the rendered data. Only called when the measurement
+   * is not in the cache.
+   */
+  function _shrinkContentsUntilTheyFit(data: any,
+    onReduceData: (prevData: any) => any,
+    getElementToMeasureWidth: () => number): IResizeGroupState {
+    let dataToMeasure = data;
+    let measuredWidth: number | undefined = _getMeasuredWidth(data, getElementToMeasureWidth);
+
+    while (measuredWidth > _containerWidth!) {
+      const nextMeasuredData = onReduceData(dataToMeasure);
+
+      // We don't want to get stuck in an infinite render loop when there are no more
+      // scaling steps, so implementations of onReduceData should return undefined when
+      // there are no more scaling states to apply.
+      if (nextMeasuredData === undefined) {
+        return {
+          renderedData: dataToMeasure,
+          resizeDirection: undefined,
+          dataToMeasure: undefined
+        };
+      }
+
+      measuredWidth = _measurementCache.getCachedMeasurement(nextMeasuredData);
+
+      // If the measurement isn't in the cache, we need to rerender with some data in a hidden div
+      if (measuredWidth === undefined) {
+        return {
+          dataToMeasure: nextMeasuredData,
+          resizeDirection: 'shrink'
+        };
+      }
+
+      dataToMeasure = nextMeasuredData;
+    }
+
+    return {
+      renderedData: dataToMeasure,
+      resizeDirection: undefined,
+      dataToMeasure: undefined
+    };
+  }
+
+  /**
+   * This function should be called when the state changes in a manner that might allow for more content to fit
+   * on the screen, such as the window width growing.
+   * @param data - The initial data point to start measuring.
+   * @param onGrowData - Function that transforms the data into something that may take up more space when rendering.
+   * @param getElementToMeasureWidth - A function that returns the measurement of the rendered data. Only called when the measurement
+   * is not in the cache.
+   */
+  function _growDataUntilItDoesNotFit(data: any,
+    onGrowData: (prevData: any) => any,
+    getElementToMeasureWidth: () => number): IResizeGroupState {
+    let dataToMeasure = data;
+    let measuredWidth: number | undefined = _getMeasuredWidth(data, getElementToMeasureWidth);
+
+    while (measuredWidth < _containerWidth!) {
+      const nextMeasuredData = onGrowData(dataToMeasure);
+
+      // We don't want to get stuck in an infinite render loop when there are no more
+      // scaling steps, so implementations of onGrowData should return undefined when
+      // there are no more scaling states to apply.
+      if (nextMeasuredData === undefined) {
+        return {
+          renderedData: dataToMeasure,
+          resizeDirection: undefined,
+          dataToMeasure: undefined
+        };
+      }
+
+      measuredWidth = _measurementCache.getCachedMeasurement(nextMeasuredData);
+      // If the measurement isn't in the cache, we need to rerender with some data in a hidden div
+      if (measuredWidth === undefined) {
+        return {
+          dataToMeasure: nextMeasuredData
+        };
+      }
+
+      dataToMeasure = nextMeasuredData;
+    }
+
+    // Once the loop is done, we should now shrink until the contents fit.
+    return {
+      dataToMeasure,
+      resizeDirection: 'shrink'
+    };
+  }
+
+  /**
+   * Handles an update to the container width. Should only be called when we knew the previous container width.
+   * @param newWidth - The new width of the container.
+   * @param fullWidthData - The initial data passed in as a prop to resizeGroup.
+   * @param renderedData - The data that was rendered prior to the container size changing.
+   * @param onGrowData - Set to true if the Resize group has an onGrowData function.
+   */
+  function _updateContainerWidth(newWidth: number, fullWidthData: any, renderedData: any, onGrowData?: (prevData: any) => any): IResizeGroupState {
+    let nextState: IResizeGroupState;
+    if (newWidth > _containerWidth!) {
+      if (onGrowData) {
+        nextState = {
+          resizeDirection: 'grow',
+          dataToMeasure: onGrowData(renderedData)
+        };
+      } else {
+        nextState = {
+          resizeDirection: 'shrink',
+          dataToMeasure: fullWidthData
+        };
+      }
+    } else {
+      nextState = {
+        resizeDirection: 'shrink',
+        dataToMeasure: renderedData
+      };
+    }
+    _containerWidth = newWidth;
+    return { ...nextState, measureContainer: false };
+  }
+
+  function getNextState(props: IResizeGroupProps,
+    currentState: IResizeGroupState,
+    getElementToMeasureWidth: () => number,
+    newContainerWidth?: number): IResizeGroupState | undefined {
+    // If there is no new container width or data to measure, there is no need for a new state update
+    if (newContainerWidth === undefined && currentState.dataToMeasure === undefined) {
+      return undefined;
+    }
+
+    if (newContainerWidth) {
+      // If we know what the last container size was and we rendered data at that width, we can do an optimized render
+      if (_containerWidth && currentState.renderedData && !currentState.dataToMeasure) {
+        return { ...currentState, ..._updateContainerWidth(newContainerWidth, props.data, currentState.renderedData, props.onGrowData) };
+      }
+
+      // If we are just setting the container width for the first time, we can't do any optimizations
+      _containerWidth = newContainerWidth;
+    }
+
+    let nextState: IResizeGroupState = {
+      ...currentState,
+      measureContainer: false
+    };
+
+    if (currentState.dataToMeasure) {
+      if (currentState.resizeDirection === 'grow' && props.onGrowData) {
+        nextState = {
+          ...nextState,
+          ..._growDataUntilItDoesNotFit(currentState.dataToMeasure, props.onGrowData, getElementToMeasureWidth)
+        };
+      } else {
+        nextState = {
+          ...nextState,
+          ..._shrinkContentsUntilTheyFit(currentState.dataToMeasure, props.onReduceData, getElementToMeasureWidth)
+        };
+      }
+    }
+
+    return nextState;
+  }
+
+  function shouldRenderDataToMeasureInHiddenDiv(dataToMeasure: any | undefined): boolean {
+    if (!dataToMeasure || _measurementCache.getCachedMeasurement(dataToMeasure) !== undefined) {
+      return false;
+    }
+
+    return true;
+  }
+
+  return {
+    getNextState,
+    shouldRenderDataToMeasureInHiddenDiv
+  };
+};
+
+// Provides a context property that (if true) tells any child components that
+// they are only being used for measurement purposes and will not be visible.
+const MeasuredContext = provideContext({
+  isMeasured: PropTypes.bool
+}, () => {
+  return { isMeasured: true };
+});
+
+export class ResizeGroupBase extends BaseComponent<IResizeGroupProps, IResizeGroupState> {
+  private _nextResizeGroupStateProvider = getNextResizeGroupStateProvider();
+  private _root: HTMLElement;
+  private _measured: HTMLElement;
+
+  constructor(props: IResizeGroupProps) {
+    super(props);
+    this.state = {
+      dataToMeasure: { ...this.props.data },
+      resizeDirection: 'grow',
+      measureContainer: true,
+    };
+  }
+
+  public render() {
+    const { onRenderData, className } = this.props;
+    const { dataToMeasure, renderedData } = this.state;
+    const divProps = getNativeProps(this.props, divProperties, ['data']);
+
+    return (
+      <div { ...divProps } className={ css('ms-ResizeGroup', className) } ref={ this._resolveRef('_root') }>
+        { this._nextResizeGroupStateProvider.shouldRenderDataToMeasureInHiddenDiv(dataToMeasure) && (
+          <div className={ css(styles.measured) } ref={ this._resolveRef('_measured') }>
+            <MeasuredContext>{ onRenderData(dataToMeasure) }</MeasuredContext>
+          </div>
+        ) }
+
+        { renderedData && onRenderData(renderedData) }
+      </div>
+    );
+  }
+
+  public componentDidMount() {
+    this._afterComponentRendered();
+    this._events.on(window, 'resize', this._async.debounce(this._onResize, RESIZE_DELAY, { leading: true }));
+  }
+
+  public componentWillReceiveProps(nextProps: IResizeGroupProps) {
+    this.setState({
+      dataToMeasure: { ...nextProps.data },
+      resizeDirection: 'grow',
+      measureContainer: true // Receiving new props means the parent might rerender and the root width might change
+    });
+  }
+
+  public componentDidUpdate(prevProps: IResizeGroupProps) {
+    if (this.state.renderedData) {
+      if (this.props.dataDidRender) {
+        this.props.dataDidRender(this.state.renderedData);
+      }
+    }
+    this._afterComponentRendered();
+  }
+
+  public remeasure(): void {
+    if (this._root) {
+      this.setState({ measureContainer: true });
+    }
+  }
+
+  private _afterComponentRendered() {
+    this._async.requestAnimationFrame(() => {
+      let containerWidth = undefined;
+      if (this.state.measureContainer) {
+        containerWidth = this._root.getBoundingClientRect().width;
+      }
+      const nextState = this._nextResizeGroupStateProvider.getNextState(this.props,
+        this.state,
+        () => this._measured.scrollWidth,
+        containerWidth);
+
+      if (nextState) {
+        this.setState(nextState);
+      }
+    });
+  }
+
+  private _onResize() {
+    if (this._root) {
+      this.setState({ measureContainer: true });
+    }
+  }
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.styles.ts b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.styles.ts
new file mode 100644
index 0000000000000..c9414e6fbc4e9
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.styles.ts
@@ -0,0 +1,28 @@
+import { IResizeGroupStyleProps, IResizeGroupStyles } from './ResizeGroup.types';
+import {
+  IStyle,
+  ITheme,
+} from '../../Styling';
+
+export const getStyles = (
+  props: IResizeGroupStyleProps
+): IResizeGroupStyles => {
+  const {
+    className,
+    theme,
+  } = props;
+
+  const { palette, semanticColors } = theme;
+
+  return ({
+    root: [
+      'ms-ResizeGroup',
+      {
+        // Insert css properties
+
+      }
+    ],
+
+    // Insert className styles
+  });
+};
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
index 7206855a69417..cb680a34f805b 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
@@ -1,7 +1,8 @@
 import * as React from 'react';
 import { shallow } from 'enzyme';
 
-import { ResizeGroup, IResizeGroupState, getNextResizeGroupStateProvider, getMeasurementCache } from './ResizeGroup';
+import { ResizeGroup } from './ResizeGroup';
+import { ResizeGroupBase, IResizeGroupState, getNextResizeGroupStateProvider, getMeasurementCache } from './ResizeGroup.base';
 import { IResizeGroupProps } from './ResizeGroup.types';
 import * as sinon from 'sinon';
 import * as renderer from 'react-test-renderer';
@@ -45,7 +46,7 @@ describe('ResizeGroup', () => {
     const onRenderData = (data: any) => <div id={ renderedDataId }> Rendered data: { data.content }</div >;
 
     const wrapper = shallow<IResizeGroupProps, IResizeGroupState>(
-      <ResizeGroup
+      <ResizeGroupBase
         data={ initialData }
         onReduceData={ onReduceScalingData }
         onRenderData={ onRenderData }
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
index d5aafd70197b4..2fe73d8f2d5de 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.tsx
@@ -1,369 +1,13 @@
-import * as React from 'react';
-import * as PropTypes from 'prop-types';
+import { styled } from '../../Utilities';
 import {
-  BaseComponent,
-  css,
-  divProperties,
-  getNativeProps,
-  provideContext
-} from '../../Utilities';
-import { IResizeGroupProps } from './ResizeGroup.types';
-import * as styles from './ResizeGroup.scss';
-
-const RESIZE_DELAY = 16;
-
-export interface IResizeGroupState {
-
-  /**
-   * Final data used to render proper sized component
-  */
-  renderedData?: any;
-
-  /**
-   * Data to render in a hidden div for measurement
-   */
-  dataToMeasure?: any;
-
-  /**
-   * Set to true when the content container might have new dimensions and should
-   * be remeasured.
-   */
-  measureContainer?: boolean;
-
-  /**
-   * Are we resizing to accommodate having more or less available space?
-   * The 'grow' direction is when the container may have more room than the last render,
-   * such as when a window resize occurs. This means we will try to fit more content in the window.
-   * The 'shrink' direction is when the contents don't fit in the container and we need
-   * to find a transformation of the data that makes everything fit.
-   */
-  resizeDirection?: 'grow' | 'shrink';
-}
-
-/**
- * Returns a simple object is able to store measurements with a given key.
- */
-export const getMeasurementCache = () => {
-  const measurementsCache: { [key: string]: number } = {};
-
-  return {
-    /**
-     * Checks if the provided data has a cacheKey. If it has a cacheKey and there is a
-     * corresponding entry in the measurementsCache, then it will return that value.
-     * Returns undefined otherwise.
-     */
-    getCachedMeasurement: (data: any): number | undefined => {
-      if (data && data.cacheKey && measurementsCache.hasOwnProperty(data.cacheKey)) {
-        return measurementsCache[data.cacheKey];
-      }
-
-      return undefined;
-    },
-    /**
-     * Should be called whenever there is a new measurement associated with a given data object.
-     * If the data has a cacheKey, store that measurement in the measurementsCache.
-     */
-    addMeasurementToCache: (data: any, measurement: number): void => {
-      if (data.cacheKey) {
-        measurementsCache[data.cacheKey] = measurement;
-      }
-    }
-  };
-};
-
-/**
- * Returns a function that is able to compute the next state for the ResizeGroup given the current
- * state and any measurement updates.
- */
-export const getNextResizeGroupStateProvider = (measurementCache = getMeasurementCache()) => {
-  const _measurementCache = measurementCache;
-  let _containerWidth: number | undefined;
-
-  /**
-   * Gets the width of the data rendered in a hidden div.
-   * @param measuredData - The data corresponding to the measurement we wish to take.
-   * @param getElementToMeasureWidth - A function that returns the measurement of the rendered data. Only called when the measurement
-   * is not in the cache.
-   */
-  function _getMeasuredWidth(measuredData: any, getElementToMeasureWidth: () => number): number {
-    const cachedWidth = _measurementCache.getCachedMeasurement(measuredData);
-    if (cachedWidth !== undefined) {
-      return cachedWidth;
-    }
-
-    const measuredWidth = getElementToMeasureWidth();
-    _measurementCache.addMeasurementToCache(measuredData, measuredWidth);
-    return measuredWidth;
-  }
-
-  /**
-   * Will get the next IResizeGroupState based on the current data while trying to shrink contents
-   * to fit in the container.
-   * @param data - The initial data point to start measuring.
-   * @param onReduceData - Function that transforms the data into something that should render with less width.
-   * @param getElementToMeasureWidth - A function that returns the measurement of the rendered data. Only called when the measurement
-   * is not in the cache.
-   */
-  function _shrinkContentsUntilTheyFit(data: any,
-    onReduceData: (prevData: any) => any,
-    getElementToMeasureWidth: () => number): IResizeGroupState {
-    let dataToMeasure = data;
-    let measuredWidth: number | undefined = _getMeasuredWidth(data, getElementToMeasureWidth);
-
-    while (measuredWidth > _containerWidth!) {
-      const nextMeasuredData = onReduceData(dataToMeasure);
-
-      // We don't want to get stuck in an infinite render loop when there are no more
-      // scaling steps, so implementations of onReduceData should return undefined when
-      // there are no more scaling states to apply.
-      if (nextMeasuredData === undefined) {
-        return {
-          renderedData: dataToMeasure,
-          resizeDirection: undefined,
-          dataToMeasure: undefined
-        };
-      }
-
-      measuredWidth = _measurementCache.getCachedMeasurement(nextMeasuredData);
-
-      // If the measurement isn't in the cache, we need to rerender with some data in a hidden div
-      if (measuredWidth === undefined) {
-        return {
-          dataToMeasure: nextMeasuredData,
-          resizeDirection: 'shrink'
-        };
-      }
-
-      dataToMeasure = nextMeasuredData;
-    }
-
-    return {
-      renderedData: dataToMeasure,
-      resizeDirection: undefined,
-      dataToMeasure: undefined
-    };
-  }
-
-  /**
-   * This function should be called when the state changes in a manner that might allow for more content to fit
-   * on the screen, such as the window width growing.
-   * @param data - The initial data point to start measuring.
-   * @param onGrowData - Function that transforms the data into something that may take up more space when rendering.
-   * @param getElementToMeasureWidth - A function that returns the measurement of the rendered data. Only called when the measurement
-   * is not in the cache.
-   */
-  function _growDataUntilItDoesNotFit(data: any,
-    onGrowData: (prevData: any) => any,
-    getElementToMeasureWidth: () => number): IResizeGroupState {
-    let dataToMeasure = data;
-    let measuredWidth: number | undefined = _getMeasuredWidth(data, getElementToMeasureWidth);
-
-    while (measuredWidth < _containerWidth!) {
-      const nextMeasuredData = onGrowData(dataToMeasure);
-
-      // We don't want to get stuck in an infinite render loop when there are no more
-      // scaling steps, so implementations of onGrowData should return undefined when
-      // there are no more scaling states to apply.
-      if (nextMeasuredData === undefined) {
-        return {
-          renderedData: dataToMeasure,
-          resizeDirection: undefined,
-          dataToMeasure: undefined
-        };
-      }
-
-      measuredWidth = _measurementCache.getCachedMeasurement(nextMeasuredData);
-      // If the measurement isn't in the cache, we need to rerender with some data in a hidden div
-      if (measuredWidth === undefined) {
-        return {
-          dataToMeasure: nextMeasuredData
-        };
-      }
-
-      dataToMeasure = nextMeasuredData;
-    }
-
-    // Once the loop is done, we should now shrink until the contents fit.
-    return {
-      dataToMeasure,
-      resizeDirection: 'shrink'
-    };
-  }
-
-  /**
-   * Handles an update to the container width. Should only be called when we knew the previous container width.
-   * @param newWidth - The new width of the container.
-   * @param fullWidthData - The initial data passed in as a prop to resizeGroup.
-   * @param renderedData - The data that was rendered prior to the container size changing.
-   * @param onGrowData - Set to true if the Resize group has an onGrowData function.
-   */
-  function _updateContainerWidth(newWidth: number, fullWidthData: any, renderedData: any, onGrowData?: (prevData: any) => any): IResizeGroupState {
-    let nextState: IResizeGroupState;
-    if (newWidth > _containerWidth!) {
-      if (onGrowData) {
-        nextState = {
-          resizeDirection: 'grow',
-          dataToMeasure: onGrowData(renderedData)
-        };
-      } else {
-        nextState = {
-          resizeDirection: 'shrink',
-          dataToMeasure: fullWidthData
-        };
-      }
-    } else {
-      nextState = {
-        resizeDirection: 'shrink',
-        dataToMeasure: renderedData
-      };
-    }
-    _containerWidth = newWidth;
-    return { ...nextState, measureContainer: false };
-  }
-
-  function getNextState(props: IResizeGroupProps,
-    currentState: IResizeGroupState,
-    getElementToMeasureWidth: () => number,
-    newContainerWidth?: number): IResizeGroupState | undefined {
-    // If there is no new container width or data to measure, there is no need for a new state update
-    if (newContainerWidth === undefined && currentState.dataToMeasure === undefined) {
-      return undefined;
-    }
-
-    if (newContainerWidth) {
-      // If we know what the last container size was and we rendered data at that width, we can do an optimized render
-      if (_containerWidth && currentState.renderedData && !currentState.dataToMeasure) {
-        return { ...currentState, ..._updateContainerWidth(newContainerWidth, props.data, currentState.renderedData, props.onGrowData) };
-      }
-
-      // If we are just setting the container width for the first time, we can't do any optimizations
-      _containerWidth = newContainerWidth;
-    }
-
-    let nextState: IResizeGroupState = {
-      ...currentState,
-      measureContainer: false
-    };
-
-    if (currentState.dataToMeasure) {
-      if (currentState.resizeDirection === 'grow' && props.onGrowData) {
-        nextState = {
-          ...nextState,
-          ..._growDataUntilItDoesNotFit(currentState.dataToMeasure, props.onGrowData, getElementToMeasureWidth)
-        };
-      } else {
-        nextState = {
-          ...nextState,
-          ..._shrinkContentsUntilTheyFit(currentState.dataToMeasure, props.onReduceData, getElementToMeasureWidth)
-        };
-      }
-    }
-
-    return nextState;
-  }
-
-  function shouldRenderDataToMeasureInHiddenDiv(dataToMeasure: any | undefined): boolean {
-    if (!dataToMeasure || _measurementCache.getCachedMeasurement(dataToMeasure) !== undefined) {
-      return false;
-    }
-
-    return true;
-  }
-
-  return {
-    getNextState,
-    shouldRenderDataToMeasureInHiddenDiv
-  };
-};
-
-// Provides a context property that (if true) tells any child components that
-// they are only being used for measurement purposes and will not be visible.
-const MeasuredContext = provideContext({
-  isMeasured: PropTypes.bool
-}, () => {
-  return { isMeasured: true };
-});
-
-export class ResizeGroup extends BaseComponent<IResizeGroupProps, IResizeGroupState> {
-  private _nextResizeGroupStateProvider = getNextResizeGroupStateProvider();
-  private _root: HTMLElement;
-  private _measured: HTMLElement;
-
-  constructor(props: IResizeGroupProps) {
-    super(props);
-    this.state = {
-      dataToMeasure: { ...this.props.data },
-      resizeDirection: 'grow',
-      measureContainer: true,
-    };
-  }
-
-  public render() {
-    const { onRenderData, className } = this.props;
-    const { dataToMeasure, renderedData } = this.state;
-    const divProps = getNativeProps(this.props, divProperties, ['data']);
-
-    return (
-      <div {...divProps} className={ css('ms-ResizeGroup', className) } ref={ this._resolveRef('_root') }>
-        { this._nextResizeGroupStateProvider.shouldRenderDataToMeasureInHiddenDiv(dataToMeasure) && (
-          <div className={ css(styles.measured) } ref={ this._resolveRef('_measured') }>
-            <MeasuredContext>{ onRenderData(dataToMeasure) }</MeasuredContext>
-          </div>
-        ) }
-
-        { renderedData && onRenderData(renderedData) }
-      </div>
-    );
-  }
-
-  public componentDidMount() {
-    this._afterComponentRendered();
-    this._events.on(window, 'resize', this._async.debounce(this._onResize, RESIZE_DELAY, { leading: true }));
-  }
-
-  public componentWillReceiveProps(nextProps: IResizeGroupProps) {
-    this.setState({
-      dataToMeasure: { ...nextProps.data },
-      resizeDirection: 'grow',
-      measureContainer: true // Receiving new props means the parent might rerender and the root width might change
-    });
-  }
-
-  public componentDidUpdate(prevProps: IResizeGroupProps) {
-    if (this.state.renderedData) {
-      if (this.props.dataDidRender) {
-        this.props.dataDidRender(this.state.renderedData);
-      }
-    }
-    this._afterComponentRendered();
-  }
-
-  public remeasure(): void {
-    if (this._root) {
-      this.setState({ measureContainer: true });
-    }
-  }
-
-  private _afterComponentRendered() {
-    this._async.requestAnimationFrame(() => {
-      let containerWidth = undefined;
-      if (this.state.measureContainer) {
-        containerWidth = this._root.getBoundingClientRect().width;
-      }
-      const nextState = this._nextResizeGroupStateProvider.getNextState(this.props,
-        this.state,
-        () => this._measured.scrollWidth,
-        containerWidth);
-
-      if (nextState) {
-        this.setState(nextState);
-      }
-    });
-  }
-
-  private _onResize() {
-    if (this._root) {
-      this.setState({ measureContainer: true });
-    }
-  }
-}
\ No newline at end of file
+  IResizeGroupProps,
+  IResizeGroupStyleProps,
+  IResizeGroupStyles
+} from './ResizeGroup.types';
+import { ResizeGroupBase } from './ResizeGroup.base';
+import { getStyles } from './ResizeGroup.styles';
+
+export const ResizeGroup = styled<IResizeGroupProps, IResizeGroupStyleProps, IResizeGroupStyles>(
+  ResizeGroupBase,
+  getStyles
+);
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.types.ts b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.types.ts
index dec502a0d4dfc..c65d6d3418748 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.types.ts
@@ -1,6 +1,7 @@
 import * as React from 'react';
-import { ResizeGroup } from './ResizeGroup';
-
+import { ResizeGroupBase } from './ResizeGroup.base';
+import { IStyle, ITheme } from '../../Styling';
+import { IStyleFunction } from '../../Utilities';
 export interface IResizeGroup {
   /**
    * Remeasures the available space.
@@ -8,7 +9,7 @@ export interface IResizeGroup {
   remeasure(): void;
 }
 
-export interface IResizeGroupProps extends React.HTMLAttributes<ResizeGroup | HTMLElement> {
+export interface IResizeGroupProps extends React.HTMLAttributes<ResizeGroupBase | HTMLElement> {
 
   /**
    * Optional callback to access the IResizeGroup interface. Use this instead of ref for accessing
@@ -16,6 +17,22 @@ export interface IResizeGroupProps extends React.HTMLAttributes<ResizeGroup | HT
    */
   componentRef?: (component: IResizeGroup) => void;
 
+  /**
+   * Call to provide customized styling that will layer on top of the variant rules
+   */
+  getStyles?: IStyleFunction<IResizeGroupStyleProps, IResizeGroupStyles>;
+
+  /**
+   * Theme provided by HOC.
+   */
+  theme?: ITheme;
+
+  /**
+   * Additional css class to apply to the Component
+   * @defaultvalue undefined
+   */
+  className?: string;
+
   /**
    * Initial data to be passed to the onRenderData function. When there is no onGrowData provided, this data should represent what should
    * be passed to the render function when the parent container of the ResizeGroup is at it's maximum supported width. A cacheKey property
@@ -52,3 +69,22 @@ export interface IResizeGroupProps extends React.HTMLAttributes<ResizeGroup | HT
    */
   dataDidRender?: (renderedData: any) => void;
 }
+
+export interface IResizeGroupStyleProps {
+  /**
+   * Accept theme prop.
+   */
+  theme: ITheme;
+
+  /**
+   * Accept custom classNames
+   */
+  className?: string;
+}
+
+export interface IResizeGroupStyles {
+  /**
+   * Style for the root element.
+   */
+  root: IStyle;
+}
\ No newline at end of file

From 0661239920ded0ecfce53788322b4bc5b21860e1 Mon Sep 17 00:00:00 2001
From: jijizz <liu_zhi8@hotmail.com>
Date: Tue, 20 Feb 2018 13:20:22 -0800
Subject: [PATCH 1402/1641] make onShouldVirtualize work for grouped list
 (#4021)

* make onShouldVirtualize work for grouped list

* rush changes
---
 .../zhiliu-groupingOp_2018-02-19-19-18.json   | 11 ++++++++++
 .../zhiliu-groupingOp_2018-02-19-19-18.json   | 11 ++++++++++
 .../components/GroupedList/GroupedList.tsx    |  4 +++-
 .../GroupedList/GroupedListSection.tsx        | 22 ++++++++++++++++---
 packages/utilities/src/FabricPerformance.ts   |  2 +-
 5 files changed, 45 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/zhiliu-groupingOp_2018-02-19-19-18.json
 create mode 100644 common/changes/office-ui-fabric-react/zhiliu-groupingOp_2018-02-19-19-18.json

diff --git a/common/changes/@uifabric/utilities/zhiliu-groupingOp_2018-02-19-19-18.json b/common/changes/@uifabric/utilities/zhiliu-groupingOp_2018-02-19-19-18.json
new file mode 100644
index 0000000000000..7e6a7040b5822
--- /dev/null
+++ b/common/changes/@uifabric/utilities/zhiliu-groupingOp_2018-02-19-19-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "fix bug in IE that IE does not support Number.IsInteger",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "zhiliu@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/zhiliu-groupingOp_2018-02-19-19-18.json b/common/changes/office-ui-fabric-react/zhiliu-groupingOp_2018-02-19-19-18.json
new file mode 100644
index 0000000000000..0746a1f0dcb2d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/zhiliu-groupingOp_2018-02-19-19-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "make onShouldVirtualize work for grouped list",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "zhiliu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
index 769fd29fdd266..a3db445bee95a 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
@@ -152,7 +152,8 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
       onRenderCell,
       selectionMode,
       selection,
-      viewport
+      viewport,
+      onShouldVirtualize
     } = this.props;
 
     // override group header/footer props as needed
@@ -194,6 +195,7 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
         selection={ selection }
         showAllProps={ showAllProps }
         viewport={ viewport }
+        onShouldVirtualize={ onShouldVirtualize }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
index da3f6638c3e0b..02fc48727e1df 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
@@ -36,6 +36,8 @@ import {
 import { assign, css } from '../../Utilities';
 import { IViewport } from '../../utilities/decorators/withViewport';
 import * as stylesImport from './GroupedList.scss';
+import { IList, IListProps } from '../List/index';
+
 const styles: any = stylesImport;
 
 export interface IGroupedListSectionProps extends React.Props<GroupedListSection> {
@@ -104,6 +106,14 @@ export interface IGroupedListSectionProps extends React.Props<GroupedListSection
 
   /** Override for rendering the group footer. */
   onRenderGroupFooter?: IRenderFunction<IGroupDividerProps>;
+
+  /**
+   * Optional callback to determine whether the list should be rendered in full, or virtualized.
+   * Virtualization will add and remove pages of items as the user scrolls them into the visible range.
+   * This benefits larger list scenarios by reducing the DOM on the screen, but can negatively affect performance for smaller lists.
+   * The default implementation will virtualize when this callback is not provided.
+   */
+  onShouldVirtualize?: (props: IListProps) => boolean;
 }
 
 export interface IGroupedListSectionState {
@@ -182,7 +192,8 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
       selectionMode,
       onRenderGroupHeader = this._onRenderGroupHeader,
       onRenderGroupShowAll = this._onRenderGroupShowAll,
-      onRenderGroupFooter = this._onRenderGroupFooter
+      onRenderGroupFooter = this._onRenderGroupFooter,
+      onShouldVirtualize
     } = this.props;
     const { isSelected } = this.state;
     const renderCount = group && getGroupItemLimit ? getGroupItemLimit(group) : Infinity;
@@ -220,6 +231,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
                     items={ group!.children }
                     onRenderCell={ this._renderSubGroup }
                     getItemCountForPage={ this._returnOne }
+                    onShouldVirtualize={ onShouldVirtualize }
                   />
                 ) :
                 this._onRenderGroup(renderCount)
@@ -303,7 +315,8 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
       items,
       onRenderCell,
       listProps,
-      groupNestingDepth
+      groupNestingDepth,
+      onShouldVirtualize
     } = this.props;
     const count = group ? group.count : items.length;
     const startIndex = group ? group.startIndex : 0;
@@ -315,6 +328,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
         ref={ 'list' }
         renderCount={ Math.min(count, renderCount) }
         startIndex={ startIndex }
+        onShouldVirtualize={ onShouldVirtualize }
         { ...listProps }
       />
     );
@@ -339,7 +353,8 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
       viewport,
       onRenderGroupHeader,
       onRenderGroupShowAll,
-      onRenderGroupFooter
+      onRenderGroupFooter,
+      onShouldVirtualize
     } = this.props;
 
     return (!subGroup || subGroup.count > 0) ? (
@@ -365,6 +380,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
         onRenderGroupHeader={ onRenderGroupHeader }
         onRenderGroupShowAll={ onRenderGroupShowAll }
         onRenderGroupFooter={ onRenderGroupFooter }
+        onShouldVirtualize={ onShouldVirtualize }
       />
     ) : null;
   }
diff --git a/packages/utilities/src/FabricPerformance.ts b/packages/utilities/src/FabricPerformance.ts
index 3fba65ed999ba..4554b63a7485c 100644
--- a/packages/utilities/src/FabricPerformance.ts
+++ b/packages/utilities/src/FabricPerformance.ts
@@ -50,7 +50,7 @@ export class FabricPerformance {
    * @param func - The logic to be measured for execution time
    */
   public static measure(name: string, func: () => void): void {
-    if (Number.isInteger(FabricPerformance._timeoutId)) {
+    if (FabricPerformance._timeoutId) {
       FabricPerformance.setPeriodicReset();
     }
     const start = now();

From 6d58ab7f983c1cf8b2a93b444edf5d9c6b1b3f52 Mon Sep 17 00:00:00 2001
From: Mark Polak <mark@thedutchies.com>
Date: Tue, 20 Feb 2018 22:42:51 +0100
Subject: [PATCH 1403/1641] Enable jsx key (#4017)

* Re-enable jsx-key

* Use correct typings

* Add npm change file
---
 .../enable-jsx-key_2018-02-18-15-44.json             | 11 +++++++++++
 .../ContextualMenu.Customization.Example.tsx         |  2 +-
 .../src/components/OverflowSet/OverflowSet.tsx       | 12 +++++-------
 .../examples/PeoplePicker.Types.Example.tsx          |  4 ++--
 packages/office-ui-fabric-react/tslint.json          |  1 -
 5 files changed, 19 insertions(+), 11 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/enable-jsx-key_2018-02-18-15-44.json

diff --git a/common/changes/office-ui-fabric-react/enable-jsx-key_2018-02-18-15-44.json b/common/changes/office-ui-fabric-react/enable-jsx-key_2018-02-18-15-44.json
new file mode 100644
index 0000000000000..fa18d8566bd88
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/enable-jsx-key_2018-02-18-15-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Enable jsx-key tslint rule",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
index 39bcefdc86f68..cdf6e3742ce65 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
@@ -204,7 +204,7 @@ export class ContextualMenuCustomizationExample extends React.Component<{}, {}>
       <ul className='ms-ContextualMenu-customizationExample-categoriesList'>
         <li className='ms-ContextualMenu-item'>
           { item.categoryList.map((category: any) =>
-            <button className='ms-ContextualMenu-link' role='menuitem'>
+            <button className='ms-ContextualMenu-link' role='menuitem' key={category.name}>
               <div>
                 <span
                   className='ms-ContextualMenu-icon ms-ContextualMenu-customizationExample-categorySwatch'
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
index c886a5f3eeb83..c9355322dede0 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
@@ -5,7 +5,7 @@ import {
   BaseComponent
 } from '../../Utilities';
 import { mergeStyles } from '../../Styling';
-import { IOverflowSet, IOverflowSetProps } from './OverflowSet.types';
+import { IOverflowSet, IOverflowSetProps, IOverflowSetItemProps } from './OverflowSet.types';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 
 import * as stylesImport from './OverflowSet.scss';
@@ -52,14 +52,12 @@ export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> implements
   }
 
   @autobind
-  private _onRenderItems(items: any[]): JSX.Element[] {
+  private _onRenderItems(items: IOverflowSetItemProps[]): JSX.Element[] {
     return items.map((item, i) => {
       const wrapperDivProps: React.HTMLProps<HTMLDivElement> = { className: css('ms-OverflowSet-item', styles.item) };
-      if (item.key) {
-        wrapperDivProps.key = item.key;
-      }
+
       return (
-        <div {...wrapperDivProps}>
+        <div key={ item.key } { ...wrapperDivProps }>
           { this.props.onRenderItem(item) }
         </div>
       );
@@ -70,7 +68,7 @@ export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> implements
   private _onRenderOverflowButtonWrapper(items: any[]): JSX.Element {
     const wrapperDivProps: React.HTMLProps<HTMLDivElement> = { className: css('ms-OverflowSet-overflowButton', styles.item) };
     return (
-      <div {...wrapperDivProps}>
+      <div { ...wrapperDivProps }>
         { this.props.onRenderOverflowButton(items) }
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index 7a879090d387b..9e0ee4a011c86 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -289,7 +289,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
           componentRef={ this._resolveRef('_picker') }
         />
         <label> Click to Add a person </label>
-        { controlledItems.map(item => <div>
+        { controlledItems.map((item, index) => <div key={ index }>
           <DefaultButton
             className='controlledPickerButton'
             // tslint:disable-next-line:jsx-no-lambda
@@ -299,7 +299,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
               });
             } }
           >
-            <Persona { ...item} />
+            <Persona { ...item } />
           </DefaultButton>
         </div>) }
       </div>
diff --git a/packages/office-ui-fabric-react/tslint.json b/packages/office-ui-fabric-react/tslint.json
index 1ace03220456e..6619dab9251e0 100644
--- a/packages/office-ui-fabric-react/tslint.json
+++ b/packages/office-ui-fabric-react/tslint.json
@@ -4,7 +4,6 @@
   ],
   "rules": {
     "jsx-no-string-ref": false,
-    "jsx-key": false,
     "jsx-boolean-value": false,
     "jsx-ban-props": false,
     "max-line-length": [

From 2e447758c56e5a06fbe22726397e7fea4fc9f65f Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Tue, 20 Feb 2018 13:52:29 -0800
Subject: [PATCH 1404/1641] SwatchColorPicker: Improve keyboarding/mouse
 experience (#4035)

* Allow SwatchColorPickers to update focus on hover

* ts lint fixes

* update snapshot

* rush change
---
 ...boardingImprovements_2018-02-20-19-57.json |  11 ++
 .../ColorPickerGridCell.base.tsx              |  27 ++-
 .../ColorPickerGridCell.types.ts              |  28 +++
 .../SwatchColorPicker.base.tsx                | 180 ++++++++++++++++--
 .../SwatchColorPicker.types.ts                |  12 ++
 .../SwatchColorPicker.test.tsx.snap           |  60 +++---
 .../SwatchColorPicker.Basic.Example.tsx       |  38 +++-
 .../src/utilities/grid/GridCell.tsx           |  45 +++--
 .../src/utilities/grid/GridCell.types.ts      |  27 +++
 9 files changed, 368 insertions(+), 60 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerKeyboardingImprovements_2018-02-20-19-57.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerKeyboardingImprovements_2018-02-20-19-57.json b/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerKeyboardingImprovements_2018-02-20-19-57.json
new file mode 100644
index 0000000000000..df6ccf7f9acd4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerKeyboardingImprovements_2018-02-20-19-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SwatchColorPicker: Improve keyboard/mouse behavior",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.base.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.base.tsx
index 189aed82ab13e..c412598f6e82d 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.base.tsx
@@ -41,7 +41,16 @@ export class ColorPickerGridCellBase extends React.Component<IColorPickerGridCel
       disabled,
       getStyles,
       theme,
-      circle
+      circle,
+      color,
+      onClick,
+      onHover,
+      onFocus,
+      onMouseEnter,
+      onMouseMove,
+      onMouseLeave,
+      onWheel,
+      onKeyDown
     } = this.props;
 
     this._classNames = getClassNames(
@@ -51,25 +60,31 @@ export class ColorPickerGridCellBase extends React.Component<IColorPickerGridCel
         disabled,
         selected,
         circle,
-        isWhite: this._isWhiteCell(this.props.color)
+        isWhite: this._isWhiteCell(color)
       }
     );
 
     return (
       <ColorCell
         item={ item }
-        id={ id }
+        id={ `${id}-${item.id}-${item.index}` }
         key={ item.id }
         disabled={ disabled }
         role={ 'gridcell' }
         onRenderItem={ this._onRenderColorOption }
         selected={ selected }
-        onClick={ this.props.onClick }
-        onHover={ this.props.onHover }
-        onFocus={ this.props.onFocus }
+        onClick={ onClick }
+        onHover={ onHover }
+        onFocus={ onFocus }
         label={ item.label }
         className={ this._classNames.colorCell }
         getClassNames={ this._getClassNames }
+        index={ item.index }
+        onMouseEnter={ onMouseEnter }
+        onMouseMove={ onMouseMove }
+        onMouseLeave={ onMouseLeave }
+        onWheel={ onWheel }
+        onKeyDown={ onKeyDown }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.types.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.types.ts
index 1ead8620b299f..5f38daeb05f1e 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.types.ts
@@ -1,5 +1,6 @@
 import { IStyle, ITheme } from '../../Styling';
 import { IStyleFunction } from '../../Utilities';
+import { IGridCellProps } from '../../utilities/grid/GridCell.types';
 
 export interface IColorPickerGridCellProps {
   /**
@@ -68,6 +69,33 @@ export interface IColorPickerGridCellProps {
   * Optional styles for the component.
   */
   getStyles?: IStyleFunction<IColorPickerGridCellStyleProps, IColorPickerGridCellStyles>;
+
+  /**
+   * Optional, mouseEnter handler.
+   * @returns true if the event should be processed, false otherwise
+   */
+  onMouseEnter?: (ev: React.MouseEvent<HTMLButtonElement>) => boolean;
+
+  /**
+   * Optional, mouseMove handler
+   * @returns true if the event should be processed, false otherwise
+   */
+  onMouseMove?: (ev: React.MouseEvent<HTMLButtonElement>) => boolean;
+
+  /**
+   * Optional, mouseLeave handler
+   */
+  onMouseLeave?: (ev: React.MouseEvent<HTMLButtonElement>) => void;
+
+  /**
+   * Optional, onWheel handler
+   */
+  onWheel?: (ev: React.MouseEvent<HTMLButtonElement>) => void;
+
+  /**
+   * Optional, onkeydown handler
+   */
+  onKeyDown?: (ev: React.KeyboardEvent<HTMLButtonElement>) => void;
 }
 
 export interface IColorCellProps {
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
index 0a99b04033dea..63ceba7e78b9e 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
@@ -1,13 +1,15 @@
 import * as React from 'react';
 import {
+  Async,
   autobind,
   BaseComponent,
+  classNamesFunction,
+  customizable,
   findIndex,
+  htmlElementProperties,
+  KeyCodes,
   getId,
-  customizable,
-  classNamesFunction,
-  getNativeProps,
-  htmlElementProperties
+  getNativeProps
 } from '../../Utilities';
 import {
   ISwatchColorPicker,
@@ -37,11 +39,29 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
 
   private _id: string;
 
+  private navigationIdleTimeoutId: number | undefined;
+  private isNavigationIdle: boolean;
+  private readonly navigationIdleDelay: number = 250 /* ms */;
+  private async: Async;
+
   constructor(props: ISwatchColorPickerProps) {
     super(props);
 
     this._id = props.id || getId('swatchColorPicker');
 
+    this._warnMutuallyExclusive({
+      'focusOnHover': 'onHover'
+    });
+
+    this._warnConditionallyRequiredProps(
+      ['focusOnHover'],
+      'mouseLeaveParentSelector',
+      !!this.props.mouseLeaveParentSelector
+    );
+
+    this.isNavigationIdle = true;
+    this.async = new Async(this);
+
     let selectedIndex: number | undefined;
     if (props.selectedId) {
       selectedIndex = this._getSelectedIndex(props.colorCells, props.selectedId);
@@ -92,8 +112,8 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
     }
     return (
       <Grid
-        {...this.props}
-        items={ colorCells.map((item, index) => { return { ...item, index }; }) }
+        { ...this.props }
+        items={ colorCells.map((item, index) => { return { ...item, index: index }; }) }
         columnCount={ columnCount }
         onRenderItem={ this._renderOption }
         positionInSet={ positionInSet && positionInSet }
@@ -159,21 +179,148 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
         selected={ this.state.selectedIndex !== undefined && (this.state.selectedIndex === item.index) }
         circle={ this.props.cellShape === 'circle' }
         label={ item.label }
+        onMouseEnter={ this._onMouseEnter }
+        onMouseMove={ this._onMouseMove }
+        onMouseLeave={ this._onMouseLeave }
+        onWheel={ this._onWheel }
+        onKeyDown={ this._onKeyDown }
       />
     );
   }
 
+  /**
+   * Callback passed to the GridCell that will manage triggering the onCellHovered callback for mouseEnter
+   */
+  @autobind
+  private _onMouseEnter(ev: React.MouseEvent<HTMLButtonElement>): boolean {
+
+    if (!this.props.focusOnHover) {
+      if (!this.isNavigationIdle || this.props.disabled) {
+        return true;
+      }
+
+      return false;
+    }
+
+    if (this.isNavigationIdle && !this.props.disabled) {
+      ev.currentTarget.focus();
+    }
+
+    return true;
+  }
+
+  /**
+   * Callback passed to the GridCell that will manage Hover/Focus updates
+   */
+  @autobind
+  private _onMouseMove(ev: React.MouseEvent<HTMLButtonElement>): boolean {
+
+    if (!this.props.focusOnHover) {
+      if (!this.isNavigationIdle || this.props.disabled) {
+        return true;
+      }
+
+      return false;
+    }
+
+    const targetElement = ev.currentTarget as HTMLElement;
+
+    // If navigation is idle and the targetElement is the focused element bail out
+    // if (!this.isNavigationIdle || (document && targetElement === (document.activeElement as HTMLElement))) {
+    if (this.isNavigationIdle && !(document && targetElement === (document.activeElement as HTMLElement))) {
+      targetElement.focus();
+    }
+
+    return true;
+  }
+
+  /**
+   * Callback passed to the GridCell that will manage Hover/Focus updates
+   */
+  @autobind
+  private _onMouseLeave(ev: React.MouseEvent<HTMLButtonElement>): void {
+
+    const parentSelector = this.props.mouseLeaveParentSelector;
+
+    if (!this.props.focusOnHover ||
+      !parentSelector ||
+      !this.isNavigationIdle ||
+      this.props.disabled) {
+      return;
+    }
+
+    // Get the the elements that math the given selector
+    const elements = document.querySelectorAll(parentSelector);
+
+    // iterate over the elements return to make sure it is a parent of the target and focus it
+    for (let index = 0; index < elements.length; index += 1) {
+      if (elements[index].contains(ev.currentTarget)) {
+        /**
+         * IE11 focus() method forces parents to scroll to top of element.
+         * Edge and IE expose a setActive() function for focusable divs that
+         * sets the page focus but does not scroll the parent element.
+         */
+        if ((elements[index] as any).setActive) {
+          (elements[index] as any).setActive();
+        } else {
+          (elements[index] as HTMLElement).focus();
+        }
+
+        break;
+      }
+    }
+  }
+
+  /**
+   * Callback to make sure we don't update the hovered element during mouse wheel
+   */
+  @autobind
+  private _onWheel(): void {
+    this.setNavigationTimeout();
+  }
+
+  /**
+   * Callback that
+   */
+  @autobind
+  private _onKeyDown(ev: React.KeyboardEvent<HTMLButtonElement>): void {
+    if (
+      ev.which === KeyCodes.up ||
+      ev.which === KeyCodes.down ||
+      ev.which === KeyCodes.left ||
+      ev.which === KeyCodes.right
+    ) {
+      this.setNavigationTimeout();
+    }
+  }
+
+  /**
+   * Sets a timeout so we won't process any mouse "hover" events
+   * while navigating (via mouseWheel or arrowKeys)
+   */
+  private setNavigationTimeout = () => {
+    if (!this.isNavigationIdle && this.navigationIdleTimeoutId !== undefined) {
+      this.async.clearTimeout(this.navigationIdleTimeoutId);
+      this.navigationIdleTimeoutId = undefined;
+    } else {
+      this.isNavigationIdle = false;
+    }
+
+    this.navigationIdleTimeoutId = this.async.setTimeout(() => {
+      this.isNavigationIdle = true;
+    }, this.navigationIdleDelay);
+  }
+
   /**
    * Callback passed to the GridCell class that will trigger the onCellHovered callback of the SwatchColorPicker
+   * NOTE: This will not be triggered if shouldFocusOnHover === true
    */
   @autobind
   private _onGridCellHovered(item?: IColorCellProps): void {
-    if (this.props && this.props.onCellHovered) {
-      if (item) {
-        this.props.onCellHovered(item.id, item.color);
-      } else {
-        this.props.onCellHovered();
-      }
+    const { onCellHovered } = this.props;
+
+    if (onCellHovered) {
+      return item ? onCellHovered(item.id, item.color) : onCellHovered();
     }
   }
 
@@ -182,12 +329,9 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
    */
   @autobind
   private _onGridCellFocused(item?: IColorCellProps): void {
-    if (this.props && this.props.onCellFocused) {
-      if (item) {
-        this.props.onCellFocused(item.id, item.color);
-      } else {
-        this.props.onCellFocused();
-      }
+    const { onCellFocused } = this.props;
+    if (onCellFocused) {
+      return item ? onCellFocused(item.id, item.color) : onCellFocused();
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts
index c2fc67fcb3f42..b624363d295fb 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts
@@ -101,6 +101,18 @@ export interface ISwatchColorPickerProps {
   * Optional styles for the component.
   */
   getColorGridCellStyles?: IStyleFunction<IColorPickerGridCellStyleProps, IColorPickerGridCellStyles>;
+
+  /**
+   * Optional, whether to update focus when a cell is hovered.
+   * @default false
+   */
+  focusOnHover?: boolean;
+
+  /**
+   * Selector to focus on mouseLeave
+   * SHOULD ONLY BE USED IN CONJUNCTION WITH focusOnHover
+   */
+  mouseLeaveParentSelector?: string | undefined;
 }
 
 /**
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
index 8310a30440fa9..a633d7740fa85 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
@@ -176,14 +176,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                 &:active {
                   color: #000000;
                 }
-            data-index={undefined}
+            data-index={0}
             data-is-focusable={true}
             disabled={undefined}
-            id="swatchColorPicker1-itemundefined"
+            id="swatchColorPicker1-a-0"
             onClick={[Function]}
             onFocus={[Function]}
             onMouseEnter={[Function]}
             onMouseLeave={[Function]}
+            onMouseMove={[Function]}
             role="gridcell"
             title="green"
             type="button"
@@ -360,14 +361,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                 &:active {
                   color: #000000;
                 }
-            data-index={undefined}
+            data-index={1}
             data-is-focusable={true}
             disabled={undefined}
-            id="swatchColorPicker1-itemundefined"
+            id="swatchColorPicker1-b-1"
             onClick={[Function]}
             onFocus={[Function]}
             onMouseEnter={[Function]}
             onMouseLeave={[Function]}
+            onMouseMove={[Function]}
             role="gridcell"
             title="orange"
             type="button"
@@ -544,14 +546,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                 &:active {
                   color: #000000;
                 }
-            data-index={undefined}
+            data-index={2}
             data-is-focusable={true}
             disabled={undefined}
-            id="swatchColorPicker1-itemundefined"
+            id="swatchColorPicker1-c-2"
             onClick={[Function]}
             onFocus={[Function]}
             onMouseEnter={[Function]}
             onMouseLeave={[Function]}
+            onMouseMove={[Function]}
             role="gridcell"
             title="blue"
             type="button"
@@ -728,14 +731,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                 &:active {
                   color: #000000;
                 }
-            data-index={undefined}
+            data-index={3}
             data-is-focusable={true}
             disabled={undefined}
-            id="swatchColorPicker1-itemundefined"
+            id="swatchColorPicker1-d-3"
             onClick={[Function]}
             onFocus={[Function]}
             onMouseEnter={[Function]}
             onMouseLeave={[Function]}
+            onMouseMove={[Function]}
             role="gridcell"
             title="red"
             type="button"
@@ -916,14 +920,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                 &:active {
                   color: #000000;
                 }
-            data-index={undefined}
+            data-index={4}
             data-is-focusable={true}
             disabled={undefined}
-            id="swatchColorPicker1-itemundefined"
+            id="swatchColorPicker1-g-4"
             onClick={[Function]}
             onFocus={[Function]}
             onMouseEnter={[Function]}
             onMouseLeave={[Function]}
+            onMouseMove={[Function]}
             role="gridcell"
             title="green"
             type="button"
@@ -1100,14 +1105,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                 &:active {
                   color: #000000;
                 }
-            data-index={undefined}
+            data-index={5}
             data-is-focusable={true}
             disabled={undefined}
-            id="swatchColorPicker1-itemundefined"
+            id="swatchColorPicker1-h-5"
             onClick={[Function]}
             onFocus={[Function]}
             onMouseEnter={[Function]}
             onMouseLeave={[Function]}
+            onMouseMove={[Function]}
             role="gridcell"
             title="orange"
             type="button"
@@ -1284,14 +1290,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                 &:active {
                   color: #000000;
                 }
-            data-index={undefined}
+            data-index={6}
             data-is-focusable={true}
             disabled={undefined}
-            id="swatchColorPicker1-itemundefined"
+            id="swatchColorPicker1-i-6"
             onClick={[Function]}
             onFocus={[Function]}
             onMouseEnter={[Function]}
             onMouseLeave={[Function]}
+            onMouseMove={[Function]}
             role="gridcell"
             title="blue"
             type="button"
@@ -1468,14 +1475,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                 &:active {
                   color: #000000;
                 }
-            data-index={undefined}
+            data-index={7}
             data-is-focusable={true}
             disabled={undefined}
-            id="swatchColorPicker1-itemundefined"
+            id="swatchColorPicker1-j-7"
             onClick={[Function]}
             onFocus={[Function]}
             onMouseEnter={[Function]}
             onMouseLeave={[Function]}
+            onMouseMove={[Function]}
             role="gridcell"
             title="red"
             type="button"
@@ -1656,14 +1664,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                 &:active {
                   color: #000000;
                 }
-            data-index={undefined}
+            data-index={8}
             data-is-focusable={true}
             disabled={undefined}
-            id="swatchColorPicker1-itemundefined"
+            id="swatchColorPicker1-k-8"
             onClick={[Function]}
             onFocus={[Function]}
             onMouseEnter={[Function]}
             onMouseLeave={[Function]}
+            onMouseMove={[Function]}
             role="gridcell"
             title="black"
             type="button"
@@ -1840,14 +1849,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                 &:active {
                   color: #000000;
                 }
-            data-index={undefined}
+            data-index={9}
             data-is-focusable={true}
             disabled={undefined}
-            id="swatchColorPicker1-itemundefined"
+            id="swatchColorPicker1-l-9"
             onClick={[Function]}
             onFocus={[Function]}
             onMouseEnter={[Function]}
             onMouseLeave={[Function]}
+            onMouseMove={[Function]}
             role="gridcell"
             title="grey"
             type="button"
@@ -2024,14 +2034,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                 &:active {
                   color: #000000;
                 }
-            data-index={undefined}
+            data-index={10}
             data-is-focusable={true}
             disabled={undefined}
-            id="swatchColorPicker1-itemundefined"
+            id="swatchColorPicker1-m-10"
             onClick={[Function]}
             onFocus={[Function]}
             onMouseEnter={[Function]}
             onMouseLeave={[Function]}
+            onMouseMove={[Function]}
             role="gridcell"
             title="purple"
             type="button"
@@ -2208,14 +2219,15 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                 &:active {
                   color: #000000;
                 }
-            data-index={undefined}
+            data-index={11}
             data-is-focusable={true}
             disabled={undefined}
-            id="swatchColorPicker1-itemundefined"
+            id="swatchColorPicker1-n-11"
             onClick={[Function]}
             onFocus={[Function]}
             onMouseEnter={[Function]}
             onMouseLeave={[Function]}
+            onMouseMove={[Function]}
             role="gridcell"
             title="yellow"
             type="button"
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
index 98fb9ceafa264..c02edf71a529b 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/examples/SwatchColorPicker.Basic.Example.tsx
@@ -4,6 +4,8 @@ import { SwatchColorPicker } from 'office-ui-fabric-react/lib/SwatchColorPicker'
 export interface IBasicSwatchColorPickerExampleState {
   color: string | undefined;
   previewColor: string | undefined;
+  color2: string | undefined;
+  previewColor2: string | undefined;
 }
 
 export class SwatchColorPickerBasicExample extends React.Component<any, IBasicSwatchColorPickerExampleState> {
@@ -12,7 +14,9 @@ export class SwatchColorPickerBasicExample extends React.Component<any, IBasicSw
 
     this.state = {
       color: undefined,
-      previewColor: undefined
+      previewColor: undefined,
+      color2: undefined,
+      previewColor2: undefined
     };
   }
   public render() {
@@ -90,6 +94,38 @@ export class SwatchColorPickerBasicExample extends React.Component<any, IBasicSw
             ]
           }
         />
+        <div id='foo' tab-index='-1'>
+          <div>Simple swatch color picker with multiple rows that updates it's icon color and shows a preview color:</div>
+          <div style={ { color: this.state.previewColor2 ? this.state.previewColor2 : this.state.color2 ? this.state.color2 : null, fontSize: '24px' } } >Sample Text</div>
+          <SwatchColorPicker
+            focusOnHover={ true }
+            mouseLeaveParentSelector={ '#foo' }
+            // tslint:disable:jsx-no-lambda
+            onCellHovered={ (id, color) => this.setState({ previewColor2: color! }) }
+            onCellFocused={ (id, color) => this.setState({ previewColor2: color! }) }
+            onColorChanged={ (id, newColor) => this.setState({ color2: newColor }) }
+            // tslint:enable:jsx-no-lambda
+            columnCount={ 4 }
+            cellShape={ 'circle' }
+            colorCells={
+              [
+                { id: 'a', label: 'green', color: '#00ff00' },
+                { id: 'b', label: 'orange', color: '#ffa500' },
+                { id: 'c', label: 'blue', color: '#0000ff' },
+                { id: 'd', label: 'red', color: '#ff0000' },
+                { id: 'g', label: 'green', color: 'green' },
+                { id: 'h', label: 'orange', color: 'orange' },
+                { id: 'i', label: 'blue', color: 'blue' },
+                { id: 'j', label: 'red', color: 'red' },
+                { id: 'k', label: 'black', color: 'black' },
+                { id: 'l', label: 'grey', color: 'grey' },
+                { id: 'm', label: 'purple', color: 'purple' },
+                { id: 'n', label: 'yellow', color: 'yellow' }
+
+              ]
+            }
+          />
+        </div>
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx b/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx
index 20c0cb155071d..b5e8ac9a4a94f 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx
@@ -32,7 +32,7 @@ export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P,
 
     return (
       <CommandButton
-        id={ id + '-item' + index }
+        id={ id }
         data-index={ index }
         data-is-focusable={ true }
         disabled={ disabled }
@@ -44,6 +44,7 @@ export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P,
         ) }
         onClick={ this._onClick }
         onMouseEnter={ this._onMouseEnter }
+        onMouseMove={ this._onMouseMove }
         onMouseLeave={ this._onMouseLeave }
         onFocus={ this._onFocus }
         role={ role }
@@ -63,7 +64,7 @@ export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P,
       onClick,
       disabled,
       item
-      } = this.props as P;
+    } = this.props as P;
 
     if (onClick && !disabled) {
       onClick(item);
@@ -71,26 +72,48 @@ export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P,
   }
 
   @autobind
-  private _onMouseEnter() {
+  private _onMouseEnter(ev: React.MouseEvent<HTMLButtonElement>) {
     const {
       onHover,
       disabled,
-      item
-      } = this.props as P;
+      item,
+      onMouseEnter
+    } = this.props as P;
+
+    const didUpdateOnEnter = onMouseEnter && onMouseEnter(ev);
+
+    if (!didUpdateOnEnter && onHover && !disabled) {
+      onHover(item);
+    }
+  }
+
+  @autobind
+  private _onMouseMove(ev: React.MouseEvent<HTMLButtonElement>) {
+    const {
+      onHover,
+      disabled,
+      item,
+      onMouseMove
+    } = this.props as P;
+
+    const didUpdateOnMove = onMouseMove && onMouseMove(ev);
 
-    if (onHover && !disabled) {
+    if (!didUpdateOnMove && onHover && !disabled) {
       onHover(item);
     }
   }
 
   @autobind
-  private _onMouseLeave() {
+  private _onMouseLeave(ev: React.MouseEvent<HTMLButtonElement>) {
     const {
       onHover,
-      disabled
-      } = this.props as P;
+      disabled,
+      onMouseLeave
+    } = this.props as P;
+
+    const didUpdateOnLeave = onMouseLeave && onMouseLeave(ev);
 
-    if (onHover && !disabled) {
+    if (!didUpdateOnLeave && onHover && !disabled) {
       onHover();
     }
   }
@@ -101,7 +124,7 @@ export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P,
       onFocus,
       disabled,
       item
-      } = this.props as P;
+    } = this.props as P;
 
     if (onFocus && !disabled) {
       onFocus(item);
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/GridCell.types.ts b/packages/office-ui-fabric-react/src/utilities/grid/GridCell.types.ts
index 1cf5b9e3c38b3..bcd95716584ed 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/GridCell.types.ts
+++ b/packages/office-ui-fabric-react/src/utilities/grid/GridCell.types.ts
@@ -89,4 +89,31 @@ export interface IGridCellProps<T> {
     checked: boolean,
     expanded: boolean,
     isSplit: boolean | undefined) => IButtonClassNames;
+
+  /**
+  * Optional, mouseEnter handler.
+  * @returns true if the event should be processed, false otherwise
+  */
+  onMouseEnter?: (ev: React.MouseEvent<HTMLButtonElement>) => boolean;
+
+  /**
+   * Optional, mouseMove handler
+   * @returns true if the event should be processed, false otherwise
+   */
+  onMouseMove?: (ev: React.MouseEvent<HTMLButtonElement>) => boolean;
+
+  /**
+   * Optional, mouseLeave handler
+   */
+  onMouseLeave?: (ev: React.MouseEvent<HTMLButtonElement>) => void;
+
+  /**
+   * Optional, onWheel handler
+   */
+  onWheel?: (ev: React.MouseEvent<HTMLButtonElement>) => void;
+
+  /**
+   * Optional, onkeydown handler
+   */
+  onKeyDown?: (ev: React.KeyboardEvent<HTMLButtonElement>) => void;
 }

From 0a9153f40d3fc7e7757c352862d78de917e22656 Mon Sep 17 00:00:00 2001
From: chang47 <coralbue@gmail.com>
Date: Tue, 20 Feb 2018 14:00:49 -0800
Subject: [PATCH 1405/1641] Spin Button and Checkbox: Added Support for
 aria-setsize and aria-posinset (#4006)

* added support for aria-posinset and aria-setsize

* added change file

* updated snapshots
---
 .../accAriaSize_2018-02-16-19-56.json              | 11 +++++++++++
 .../src/components/Checkbox/Checkbox.tsx           |  4 ++++
 .../src/components/Checkbox/Checkbox.types.ts      | 10 ++++++++++
 .../Checkbox/__snapshots__/Checkbox.test.tsx.snap  |  2 ++
 .../src/components/SpinButton/SpinButton.tsx       |  6 +++++-
 .../src/components/SpinButton/SpinButton.types.ts  | 14 ++++++++++++--
 .../__snapshots__/SpinButton.test.tsx.snap         |  2 ++
 7 files changed, 46 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/accAriaSize_2018-02-16-19-56.json

diff --git a/common/changes/office-ui-fabric-react/accAriaSize_2018-02-16-19-56.json b/common/changes/office-ui-fabric-react/accAriaSize_2018-02-16-19-56.json
new file mode 100644
index 0000000000000..4926123daab9a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/accAriaSize_2018-02-16-19-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "added support for aria-posinset and aria-setsize",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chiechan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
index 1062305e0dccb..8a398c119e228 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
@@ -83,6 +83,8 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
       styles: customStyles,
       onRenderLabel = this._onRenderLabel,
       checkmarkIconProps,
+      ariaPositionInSet,
+      ariaSetSize
     } = this.props;
 
     const isChecked = checked === undefined ? this.state.isChecked : checked;
@@ -118,6 +120,8 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
         aria-label={ ariaLabel }
         aria-labelledby={ ariaLabelledBy }
         aria-describedby={ ariaDescribedBy }
+        aria-posinset={ ariaPositionInSet }
+        aria-setsize={ ariaSetSize }
       >
         <label className={ this._classNames.label } htmlFor={ this._id } >
           <div className={ this._classNames.checkbox }>
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.types.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.types.ts
index 67127151d734e..2a9398d9e36c2 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.types.ts
@@ -91,6 +91,16 @@ export interface ICheckboxProps extends React.ButtonHTMLAttributes<HTMLElement |
    */
   ariaDescribedBy?: string;
 
+  /**
+   * The position in the parent set (if in a set) for aria-posinset.
+   */
+  ariaPositionInSet?: number;
+
+  /**
+  * The total size of the parent set (if in a set) for aria-setsize.
+  */
+  ariaSetSize?: number;
+
   /**
    * Custom styles for this component
    */
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
index a40e7894da1ed..56ab252f499ae 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
@@ -7,6 +7,8 @@ exports[`Checkbox renders Checkbox correctly 1`] = `
   aria-disabled={undefined}
   aria-label={undefined}
   aria-labelledby={undefined}
+  aria-posinset={undefined}
+  aria-setsize={undefined}
   className=
       ms-Checkbox
       is-enabled
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index f461eb1613f81..6d61f99d8697e 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -146,7 +146,9 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
       styles: customStyles,
       upArrowButtonStyles: customUpArrowButtonStyles,
       downArrowButtonStyles: customDownArrowButtonStyles,
-      theme
+      theme,
+      ariaPositionInSet,
+      ariaSetSize
     } = this.props;
 
     const {
@@ -188,6 +190,8 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
           className={ classNames.spinButtonWrapper }
           title={ title && title }
           aria-label={ ariaLabel && ariaLabel }
+          aria-posinset={ ariaPositionInSet }
+          aria-setsize={ ariaSetSize }
         >
           <input
             value={ value }
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts
index 2c0aeedd5dede..9320fccd84435 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts
@@ -174,12 +174,12 @@ export interface ISpinButtonProps {
   theme?: ITheme;
 
   /**
-   * Accessibility label text for the increment button for the benefit of the screen reader.
+   * Accessibile label text for the increment button for the benefit of the screen reader.
    */
   incrementButtonAriaLabel?: string;
 
   /**
-   * Accessibility label text for the decrement button for the benefit of the screen reader.
+   * Accessibile label text for the decrement button for the benefit of the screen reader.
    */
   decrementButtonAriaLabel?: string;
 
@@ -189,6 +189,16 @@ export interface ISpinButtonProps {
    * IE: if step = 1, precision = 0. step = 0.0089, precision = 4. step = 300, precision = 2. step = 23.00, precision = 2.
    */
   precision?: number;
+
+  /**
+   * The position in the parent set (if in a set) for aria-posinset.
+   */
+  ariaPositionInSet?: number;
+
+  /**
+  * The total size of the parent set (if in a set) for aria-setsize.
+  */
+  ariaSetSize?: number;
 }
 
 export interface ISpinButtonStyles {
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
index 928e00cac02cf..1d61c9ea5b854 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
@@ -52,6 +52,8 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
   </div>
   <div
     aria-label={undefined}
+    aria-posinset={undefined}
+    aria-setsize={undefined}
     className=
 
         {

From f899dabeaf57d1f9c6018eb89b46b87835f8ade6 Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Tue, 20 Feb 2018 15:40:33 -0800
Subject: [PATCH 1406/1641] ScrollablePane SCSS to MergeStyles Part 2: Style
 Conversion (#4010)

Convert ScrollablePane SCSS to MergeStyles
---
 ...ablepane-scss2ms-pt2_2018-02-17-00-02.json | 11 +++++
 packages/merge-styles/src/IRawStyleBase.ts    |  5 ++
 .../ScrollablePane/ScrollablePane.base.tsx    | 26 ++++++----
 .../ScrollablePane/ScrollablePane.scss        | 38 ---------------
 .../ScrollablePane/ScrollablePane.styles.ts   | 47 +++++++++++++++++--
 .../ScrollablePane/ScrollablePane.types.ts    | 16 +++++--
 6 files changed, 90 insertions(+), 53 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/scrollablepane-scss2ms-pt2_2018-02-17-00-02.json
 delete mode 100644 packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.scss

diff --git a/common/changes/office-ui-fabric-react/scrollablepane-scss2ms-pt2_2018-02-17-00-02.json b/common/changes/office-ui-fabric-react/scrollablepane-scss2ms-pt2_2018-02-17-00-02.json
new file mode 100644
index 0000000000000..3434a87a0341a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/scrollablepane-scss2ms-pt2_2018-02-17-00-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Converting SCSS to MergeStyles step 2 - style conversion",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/merge-styles/src/IRawStyleBase.ts b/packages/merge-styles/src/IRawStyleBase.ts
index a1e8ce30117a2..c0a2414ee3dcd 100644
--- a/packages/merge-styles/src/IRawStyleBase.ts
+++ b/packages/merge-styles/src/IRawStyleBase.ts
@@ -173,6 +173,11 @@ export interface IRawStyleBase extends IRawFontStyle {
    */
   WebkitFontSmoothing?: 'none' | 'antialiased' | 'grayscale' | 'subpixel-antialiased';
 
+  /**
+   * (Webkit specific) momentum scrolling on iOS devices
+   */
+  WebkitOverflowScrolling?: 'auto' | 'touch';
+
   /**
    * Aligns a flex container's lines within the flex container when there is extra space
    * in the cross-axis, similar to how justify-content aligns individual items within the main-axis.
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
index 9494b41b8a29d..fba8e5fd19763 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
@@ -6,20 +6,24 @@ import * as PropTypes from 'prop-types';
 import {
   autobind,
   BaseComponent,
-  css
+  classNamesFunction,
+  customizable
 } from '../../Utilities';
 import {
   IScrollablePane,
   IScrollablePaneProps,
+  IScrollablePaneStyles,
+  IScrollablePaneStyleProps
 } from './ScrollablePane.types';
 import { Sticky } from '../../Sticky';
-import * as stylesImport from './ScrollablePane.scss';
-const styles: any = stylesImport;
 
 export interface IScrollablePaneContext {
   scrollablePane: PropTypes.Requireable<object>;
 }
 
+const getClassNames = classNamesFunction<IScrollablePaneStyleProps, IScrollablePaneStyles>();
+
+@customizable('ScrollablePane', ['theme'])
 export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}> implements IScrollablePane {
   public static childContextTypes: React.ValidationMap<IScrollablePaneContext> = {
     scrollablePane: PropTypes.object
@@ -82,17 +86,23 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
   }
 
   public render() {
-    const { className } = this.props;
+    const { className, theme, getStyles } = this.props;
+    const classNames = getClassNames(getStyles!,
+      {
+        theme: theme!,
+        className
+      }
+    );
 
     return (
       <div
         ref='root'
-        className={ css('ms-ScrollablePane', styles.root, className) }
+        className={ classNames.root }
         data-is-scrollable={ true }
       >
-        <div ref='stickyContainer' className={ styles.stickyContainer }>
-          <div ref='stickyAbove' className={ styles.stickyAbove } />
-          <div ref='stickyBelow' className={ styles.stickyBelow } />
+        <div ref='stickyContainer' className={ classNames.stickyContainer }>
+          <div ref='stickyAbove' className={ classNames.stickyAbove } />
+          <div ref='stickyBelow' className={ classNames.stickyBelow } />
         </div>
         { this.props.children }
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.scss b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.scss
deleted file mode 100644
index 43cc1c7576648..0000000000000
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.scss
+++ /dev/null
@@ -1,38 +0,0 @@
-@import '../../common/common';
-
-.root {
-  overflow-y: auto;
-  max-height: inherit;
-  height: inherit;
-  -webkit-overflow-scrolling: touch;
-}
-
-.stickyContainer {
-  overflow: hidden;
-  position: absolute;
-  pointer-events: none;
-}
-
-.stickyAbove,
-.stickyBelow {
-  position: absolute;
-  pointer-events: auto;
-  width: 100%;
-  z-index: 1;
-}
-
-.stickyAbove {
-  top: 0;
-
-  @include high-contrast {
-    border-bottom: 1px solid WindowText;
-  }
-}
-
-.stickyBelow {
-  bottom: 0;
-
-  @include high-contrast {
-    border-top: 1px solid WindowText;
-  }
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.styles.ts b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.styles.ts
index c672585439093..814f6ff432b26 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.styles.ts
@@ -1,7 +1,8 @@
 import { IScrollablePaneStyleProps, IScrollablePaneStyles } from './ScrollablePane.types';
 import {
+  HighContrastSelector,
   IStyle,
-  ITheme,
+  ITheme
 } from '../../Styling';
 
 export const getStyles = (
@@ -14,15 +15,53 @@ export const getStyles = (
 
   const { palette, semanticColors } = theme;
 
+  const AboveAndBelowStyles: IStyle = {
+    position: 'absolute',
+    pointerEvents: 'auto',
+    width: '100%',
+    zIndex: 1
+  };
+
   return ({
     root: [
       'ms-ScrollablePane',
       {
-        // Insert css properties
+        overflowY: 'auto',
+        maxHeight: 'inherit',
+        height: 'inherit',
+        WebkitOverflowScrolling: 'touch'
+      },
+      className
+    ],
+    stickyContainer: [
+      {
+        overflow: 'hidden',
+        position: 'absolute',
+        pointerEvents: 'none',
 
       }
     ],
-
-    // Insert className styles
+    stickyAbove: [
+      {
+        top: 0,
+        selectors: {
+          [HighContrastSelector]: {
+            borderBottom: '1px solid WindowText'
+          }
+        }
+      },
+      AboveAndBelowStyles
+    ],
+    stickyBelow: [
+      {
+        bottom: 0,
+        selectors: {
+          [HighContrastSelector]: {
+            borderTop: '1px solid WindowText'
+          }
+        }
+      },
+      AboveAndBelowStyles
+    ]
   });
 };
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts
index 037423a096c63..a048501a08ffb 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts
@@ -50,9 +50,19 @@ export interface IScrollablePaneStyleProps {
 
 export interface IScrollablePaneStyles {
   /**
-   * Style for the root element.
+   * Style set for the root element.
    */
   root: IStyle;
-
-  // Insert ScrollablePane classNames below
+  /**
+   * Style set for the stickyContainer element.
+   */
+  stickyContainer: IStyle;
+  /**
+   * Style set for the stickyAbove element.
+   */
+  stickyAbove: IStyle;
+  /**
+   * Style set for the stickyAbove element.
+   */
+  stickyBelow: IStyle;
 }
\ No newline at end of file

From 0037f82fbf63447b60ca73970fc116ad004f7c0e Mon Sep 17 00:00:00 2001
From: Jordan Janzen <jordancjanzen@gmail.com>
Date: Tue, 20 Feb 2018 19:29:02 -0800
Subject: [PATCH 1407/1641] Dialog: Converting to mergeStyles part 1 - file
 structure. (#4042)

* Round 1 on converting to mergeStyles.
- Move Dialog to DialogBase
- Create Dialog.styles
- Create new interfaces

* npm run change output
---
 ...Styles-Dialog-round1_2018-02-21-00-19.json |  11 ++
 .../src/components/Dialog/Dialog.base.tsx     | 146 ++++++++++++++++
 .../src/components/Dialog/Dialog.styles.ts    |  28 ++++
 .../src/components/Dialog/Dialog.test.tsx     |  10 +-
 .../src/components/Dialog/Dialog.tsx          | 157 ++----------------
 .../src/components/Dialog/Dialog.types.ts     |  38 ++++-
 .../src/components/Dialog/index.ts            |   1 +
 7 files changed, 239 insertions(+), 152 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-21-00-19.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Dialog/Dialog.base.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Dialog/Dialog.styles.ts

diff --git a/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-21-00-19.json b/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-21-00-19.json
new file mode 100644
index 0000000000000..2f42ad25a4d29
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-21-00-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Convert Dialog to mergeStyles, part 1 - file structure",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-jojanz@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.base.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.base.tsx
new file mode 100644
index 0000000000000..8e8a7b26de447
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.base.tsx
@@ -0,0 +1,146 @@
+import * as React from 'react';
+import {
+  BaseComponent,
+  css,
+  getId
+} from '../../Utilities';
+import { IDialogProps } from './Dialog.types';
+import { DialogType } from './DialogContent.types';
+import { Modal } from '../../Modal';
+import { withResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
+import * as stylesImport from './Dialog.scss';
+const styles: any = stylesImport;
+
+import { DialogContent } from './DialogContent';
+
+@withResponsiveMode
+export class DialogBase extends BaseComponent<IDialogProps, {}> {
+  public static defaultProps: IDialogProps = {
+    modalProps: {
+      isDarkOverlay: true,
+      isBlocking: false,
+      className: '',
+      containerClassName: ''
+    },
+    dialogContentProps: {
+      type: DialogType.normal,
+      className: '',
+      topButtonsProps: [],
+    },
+    hidden: true,
+  };
+
+  private _id: string;
+  private _defaultTitleTextId: string;
+  private _defaultSubTextId: string;
+
+  constructor(props: IDialogProps) {
+    super(props);
+
+    this._id = getId('Dialog');
+    this._defaultTitleTextId = this._id + '-title';
+    this._defaultSubTextId = this._id + '-subText';
+
+    this._warnDeprecations({
+      'isOpen': 'hidden',
+      'type': 'dialogContentProps.type',
+      'subText': 'dialogContentProps.subText',
+      'contentClassName': 'dialogContentProps.className',
+      'topButtonsProps': 'dialogContentProps.topButtonsProps',
+      'className': 'modalProps.className',
+      'isDarkOverlay': 'modalProps.isDarkOverlay',
+      'isBlocking': 'modalProps.isBlocking',
+      'containerClassName': 'modalProps.containerClassName',
+      'onDismissed': 'modalProps.onDismissed',
+      'onLayerDidMount': 'modalProps.onLayerDidMount',
+      'ariaDescribedById': 'modalProps.subtitleAriaId',
+      'ariaLabelledById': 'modalProps.titleAriaId'
+    });
+  }
+
+  public render() {
+    const {
+      elementToFocusOnDismiss,
+      firstFocusableSelector,
+      forceFocusInsideTrap,
+      ignoreExternalFocusing,
+      isBlocking,
+      isClickableOutsideFocusTrap,
+      isDarkOverlay,
+      isOpen,
+      className,
+      onDismiss,
+      onDismissed,
+      onLayerDidMount,
+      responsiveMode,
+      subText,
+      title,
+      type,
+      contentClassName,
+      topButtonsProps,
+      dialogContentProps,
+      modalProps,
+      containerClassName,
+      hidden
+    } = this.props;
+
+    return (
+      <Modal
+        elementToFocusOnDismiss={ elementToFocusOnDismiss }
+        firstFocusableSelector={ firstFocusableSelector }
+        forceFocusInsideTrap={ forceFocusInsideTrap }
+        ignoreExternalFocusing={ ignoreExternalFocusing }
+        isClickableOutsideFocusTrap={ isClickableOutsideFocusTrap }
+        onDismissed={ onDismissed }
+        onLayerDidMount={ onLayerDidMount }
+        responsiveMode={ responsiveMode }
+        { ...modalProps }
+        isDarkOverlay={ isDarkOverlay !== undefined ? isDarkOverlay : modalProps!.isDarkOverlay }
+        isBlocking={ isBlocking !== undefined ? isBlocking : modalProps!.isBlocking }
+        isOpen={ isOpen !== undefined ? isOpen : !hidden }
+        className={ css('ms-Dialog', className ? className : modalProps!.className) }
+        containerClassName={ css(styles.main, containerClassName ? containerClassName : modalProps!.containerClassName) }
+        onDismiss={ onDismiss ? onDismiss : modalProps!.onDismiss }
+        subtitleAriaId={ this._getSubTextId() }
+        titleAriaId={ this._getTitleTextId() }
+      >
+        <DialogContent
+          titleId={ this._defaultTitleTextId }
+          subTextId={ this._defaultSubTextId }
+          title={ title }
+          subText={ subText }
+          showCloseButton={ isBlocking !== undefined ? !isBlocking : !modalProps!.isBlocking }
+          topButtonsProps={ topButtonsProps ? topButtonsProps : dialogContentProps!.topButtonsProps }
+          type={ type !== undefined ? type : dialogContentProps!.type }
+          onDismiss={ onDismiss ? onDismiss : dialogContentProps!.onDismiss }
+          className={ css(contentClassName ? contentClassName : dialogContentProps!.className) }
+          { ...dialogContentProps }
+        >
+          { this.props.children }
+        </DialogContent>
+      </Modal>
+    );
+  }
+
+  private _getSubTextId = (): string | undefined => {
+    const { ariaDescribedById, modalProps, dialogContentProps, subText } = this.props;
+    let id = ariaDescribedById || (modalProps && modalProps.subtitleAriaId);
+
+    if (!id) {
+      id = (subText || (dialogContentProps && dialogContentProps.subText)) && this._defaultSubTextId;
+    }
+
+    return id;
+  }
+
+  private _getTitleTextId = (): string | undefined => {
+    const { ariaLabelledById, modalProps, dialogContentProps, title } = this.props;
+    let id = ariaLabelledById || (modalProps && modalProps.titleAriaId);
+
+    if (!id) {
+      id = (title || (dialogContentProps && dialogContentProps.title)) && this._defaultTitleTextId;
+    }
+
+    return id;
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.styles.ts b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.styles.ts
new file mode 100644
index 0000000000000..c5536f6e55f5f
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.styles.ts
@@ -0,0 +1,28 @@
+import { IDialogStyleProps, IDialogStyles } from './Dialog.types';
+import {
+  IStyle,
+  ITheme,
+} from '../../Styling';
+
+export const getStyles = (
+  props: IDialogStyleProps
+): IDialogStyles => {
+  const {
+    className,
+    theme,
+  } = props;
+
+  const { palette, semanticColors } = theme;
+
+  return ({
+    root: [
+      'ms-Dialog',
+      {
+        // Insert css properties
+
+      }
+    ],
+
+    // Insert className styles
+  });
+};
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
index 5c2e5ac89d2b0..21b58689ced00 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.test.tsx
@@ -5,7 +5,7 @@ import * as renderer from 'react-test-renderer';
 
 import { mount } from 'enzyme';
 
-import { Dialog } from './Dialog';
+import { DialogBase } from './Dialog.base';
 import { DialogContent } from './DialogContent';
 import { DialogType } from './DialogContent.types';
 
@@ -26,7 +26,7 @@ describe('Dialog', () => {
     };
 
     const wrapper = mount(
-      <Dialog
+      <DialogBase
         hidden={ false }
         modalProps={ { onDismissed: handleDismissed } }
       />
@@ -51,7 +51,7 @@ describe('Dialog', () => {
 
   it('Properly attaches auto-generated aria attributes IDs', () => {
     const wrapper = mount(
-      <Dialog
+      <DialogBase
         hidden={ false }
         modalProps={ { onDismissed: () => {/* no-op */ } } }
         dialogContentProps={ {
@@ -72,7 +72,7 @@ describe('Dialog', () => {
   it('Properly attaches IDs when aria-describedby is passed', () => {
     const subTextAriaId = 'subtextariaid';
     const wrapper = mount(
-      <Dialog
+      <DialogBase
         hidden={ false }
         modalProps={ {
           onDismissed: () => {/* no-op */ },
@@ -96,7 +96,7 @@ describe('Dialog', () => {
   it('Properly attaches IDs when aria-labelledby is passed', () => {
     const titleAriaId = 'titleariaid';
     const wrapper = mount(
-      <Dialog
+      <DialogBase
         hidden={ false }
         modalProps={ {
           onDismissed: () => {/* no-op */ },
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
index c1df330949100..ca3b141d644ba 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.tsx
@@ -1,146 +1,13 @@
-import * as React from 'react';
+import { styled } from '../../Utilities';
 import {
-  BaseComponent,
-  css,
-  getId
-} from '../../Utilities';
-import { IDialogProps } from './Dialog.types';
-import { DialogType } from './DialogContent.types';
-import { Modal } from '../../Modal';
-import { withResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
-import * as stylesImport from './Dialog.scss';
-const styles: any = stylesImport;
-
-import { DialogContent } from './DialogContent';
-
-@withResponsiveMode
-export class Dialog extends BaseComponent<IDialogProps, {}> {
-  public static defaultProps: IDialogProps = {
-    modalProps: {
-      isDarkOverlay: true,
-      isBlocking: false,
-      className: '',
-      containerClassName: ''
-    },
-    dialogContentProps: {
-      type: DialogType.normal,
-      className: '',
-      topButtonsProps: [],
-    },
-    hidden: true,
-  };
-
-  private _id: string;
-  private _defaultTitleTextId: string;
-  private _defaultSubTextId: string;
-
-  constructor(props: IDialogProps) {
-    super(props);
-
-    this._id = getId('Dialog');
-    this._defaultTitleTextId = this._id + '-title';
-    this._defaultSubTextId = this._id + '-subText';
-
-    this._warnDeprecations({
-      'isOpen': 'hidden',
-      'type': 'dialogContentProps.type',
-      'subText': 'dialogContentProps.subText',
-      'contentClassName': 'dialogContentProps.className',
-      'topButtonsProps': 'dialogContentProps.topButtonsProps',
-      'className': 'modalProps.className',
-      'isDarkOverlay': 'modalProps.isDarkOverlay',
-      'isBlocking': 'modalProps.isBlocking',
-      'containerClassName': 'modalProps.containerClassName',
-      'onDismissed': 'modalProps.onDismissed',
-      'onLayerDidMount': 'modalProps.onLayerDidMount',
-      'ariaDescribedById': 'modalProps.subtitleAriaId',
-      'ariaLabelledById': 'modalProps.titleAriaId'
-    });
-  }
-
-  public render() {
-    const {
-      elementToFocusOnDismiss,
-      firstFocusableSelector,
-      forceFocusInsideTrap,
-      ignoreExternalFocusing,
-      isBlocking,
-      isClickableOutsideFocusTrap,
-      isDarkOverlay,
-      isOpen,
-      className,
-      onDismiss,
-      onDismissed,
-      onLayerDidMount,
-      responsiveMode,
-      subText,
-      title,
-      type,
-      contentClassName,
-      topButtonsProps,
-      dialogContentProps,
-      modalProps,
-      containerClassName,
-      hidden
-    } = this.props;
-
-    return (
-      <Modal
-        elementToFocusOnDismiss={ elementToFocusOnDismiss }
-        firstFocusableSelector={ firstFocusableSelector }
-        forceFocusInsideTrap={ forceFocusInsideTrap }
-        ignoreExternalFocusing={ ignoreExternalFocusing }
-        isClickableOutsideFocusTrap={ isClickableOutsideFocusTrap }
-        onDismissed={ onDismissed }
-        onLayerDidMount={ onLayerDidMount }
-        responsiveMode={ responsiveMode }
-        { ...modalProps }
-        isDarkOverlay={ isDarkOverlay !== undefined ? isDarkOverlay : modalProps!.isDarkOverlay }
-        isBlocking={ isBlocking !== undefined ? isBlocking : modalProps!.isBlocking }
-        isOpen={ isOpen !== undefined ? isOpen : !hidden }
-        className={ css('ms-Dialog', className ? className : modalProps!.className) }
-        containerClassName={ css(styles.main, containerClassName ? containerClassName : modalProps!.containerClassName) }
-        onDismiss={ onDismiss ? onDismiss : modalProps!.onDismiss }
-        subtitleAriaId={ this._getSubTextId() }
-        titleAriaId={ this._getTitleTextId() }
-      >
-        <DialogContent
-          titleId={ this._defaultTitleTextId }
-          subTextId={ this._defaultSubTextId }
-          title={ title }
-          subText={ subText }
-          showCloseButton={ isBlocking !== undefined ? !isBlocking : !modalProps!.isBlocking }
-          topButtonsProps={ topButtonsProps ? topButtonsProps : dialogContentProps!.topButtonsProps }
-          type={ type !== undefined ? type : dialogContentProps!.type }
-          onDismiss={ onDismiss ? onDismiss : dialogContentProps!.onDismiss }
-          className={ css(contentClassName ? contentClassName : dialogContentProps!.className) }
-          { ...dialogContentProps }
-        >
-          { this.props.children }
-        </DialogContent>
-      </Modal>
-    );
-  }
-
-  private _getSubTextId = (): string | undefined => {
-    const { ariaDescribedById, modalProps, dialogContentProps, subText } = this.props;
-    let id = ariaDescribedById || (modalProps && modalProps.subtitleAriaId);
-
-    if (!id) {
-      id = (subText || (dialogContentProps && dialogContentProps.subText)) && this._defaultSubTextId;
-    }
-
-    return id;
-  }
-
-  private _getTitleTextId = (): string | undefined => {
-    const { ariaLabelledById, modalProps, dialogContentProps, title } = this.props;
-    let id = ariaLabelledById || (modalProps && modalProps.titleAriaId);
-
-    if (!id) {
-      id = (title || (dialogContentProps && dialogContentProps.title)) && this._defaultTitleTextId;
-    }
-
-    return id;
-  }
-}
+  IDialogProps,
+  IDialogStyleProps,
+  IDialogStyles
+} from './Dialog.types';
+import { DialogBase } from './Dialog.base';
+import { getStyles } from './Dialog.styles';
+
+export const Dialog = styled<IDialogProps, IDialogStyleProps, IDialogStyles>(
+  DialogBase,
+  getStyles
+);
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.types.ts b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.types.ts
index 951d35f5537ee..5a8a95acb6e7b 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.types.ts
@@ -1,16 +1,18 @@
 import * as React from 'react';
 import { IModalProps } from '../../Modal';
-import { Dialog } from './Dialog';
+import { DialogBase } from './Dialog.base';
 import { DialogType, IDialogContentProps } from './DialogContent.types';
 import { IButtonProps } from '../Button/Button.types';
 import { IWithResponsiveModeState } from '../../utilities/decorators/withResponsiveMode';
 import { IAccessiblePopupProps } from '../../common/IAccessiblePopupProps';
+import { IStyle, ITheme } from '../../Styling';
+import { IStyleFunction } from '../../Utilities';
 
 export interface IDialog {
 
 }
 
-export interface IDialogProps extends React.Props<Dialog>, IWithResponsiveModeState, IAccessiblePopupProps {
+export interface IDialogProps extends React.Props<DialogBase>, IWithResponsiveModeState, IAccessiblePopupProps {
 
   /**
    * Optional callback to access the IDialog interface. Use this instead of ref for accessing
@@ -18,6 +20,16 @@ export interface IDialogProps extends React.Props<Dialog>, IWithResponsiveModeSt
    */
   componentRef?: (component: IDialog) => void;
 
+  /**
+   * Call to provide customized styling that will layer on top of the variant rules
+   */
+  getStyles?: IStyleFunction<IDialogStyleProps, IDialogStyles>;
+
+  /**
+   * Theme provided by HOC.
+   */
+  theme?: ITheme;
+
   /**
   * Props to be passed through to Dialog Content
   */
@@ -132,5 +144,27 @@ export interface IDialogProps extends React.Props<Dialog>, IWithResponsiveModeSt
   * @deprecated Pass through via modalProps.subtitleAriaId instead
   */
   ariaDescribedById?: string;
+}
+
+export interface IDialogStyleProps {
+  /**
+   * Accept theme prop.
+   */
+  theme: ITheme;
+
+  /**
+   * Accept custom classNames
+   */
+  className?: string;
+
+  // Insert Dialog style props below
+}
+
+export interface IDialogStyles {
+  /**
+   * Style for the root element.
+   */
+  root: IStyle;
 
+  // Insert Dialog classNames below
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/index.ts b/packages/office-ui-fabric-react/src/components/Dialog/index.ts
index 0a40969d0aea4..565c09db9a331 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/index.ts
@@ -1,4 +1,5 @@
 export * from './Dialog';
+export * from './Dialog.base';
 export * from './DialogContent';
 export * from './DialogFooter';
 export * from './Dialog.types';

From a5f021f9a60e65b6b2824a588f31cd080fd74ecb Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 20 Feb 2018 20:39:42 -0800
Subject: [PATCH 1408/1641] Rating type (#4046)

* Updating type on Rating component.

* Adding change file.

* Updating snapshot.
---
 .../rating-type_2018-02-21-04-05.json                 | 11 +++++++++++
 .../src/components/Rating/Rating.base.tsx             |  1 +
 .../Rating/__snapshots__/Rating.test.tsx.snap         |  5 +++++
 3 files changed, 17 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/rating-type_2018-02-21-04-05.json

diff --git a/common/changes/office-ui-fabric-react/rating-type_2018-02-21-04-05.json b/common/changes/office-ui-fabric-react/rating-type_2018-02-21-04-05.json
new file mode 100644
index 0000000000000..d2bbaf994f0fe
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/rating-type_2018-02-21-04-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Rating: Adding `type=button` to Rating buttons.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.base.tsx b/packages/office-ui-fabric-react/src/components/Rating/Rating.base.tsx
index d9ab8a8b3b480..8344da7140f43 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.base.tsx
@@ -117,6 +117,7 @@ export class RatingBase extends BaseComponent<IRatingProps, IRatingState> {
           onFocus={ this._onFocus.bind(this, i) }
           disabled={ disabled || readOnly ? true : false }
           role='presentation'
+          type='button'
         >
           { this._getLabel(i) }
           <RatingStar key={ i + 'rating' }  {...ratingStarProps} />
diff --git a/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap
index fc292a8d5840e..18c3c11fa90a0 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap
@@ -72,6 +72,7 @@ exports[`Rating Renders Rating correctly 1`] = `
       id="Rating0-star-0"
       onFocus={[Function]}
       role="presentation"
+      type="button"
     >
       <span
         className=
@@ -196,6 +197,7 @@ exports[`Rating Renders Rating correctly 1`] = `
       id="Rating0-star-1"
       onFocus={[Function]}
       role="presentation"
+      type="button"
     >
       <span
         className=
@@ -320,6 +322,7 @@ exports[`Rating Renders Rating correctly 1`] = `
       id="Rating0-star-2"
       onFocus={[Function]}
       role="presentation"
+      type="button"
     >
       <span
         className=
@@ -444,6 +447,7 @@ exports[`Rating Renders Rating correctly 1`] = `
       id="Rating0-star-3"
       onFocus={[Function]}
       role="presentation"
+      type="button"
     >
       <span
         className=
@@ -568,6 +572,7 @@ exports[`Rating Renders Rating correctly 1`] = `
       id="Rating0-star-4"
       onFocus={[Function]}
       role="presentation"
+      type="button"
     >
       <span
         className=

From 4bf99461473d1fb282196c67f82410765a712f10 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 20 Feb 2018 20:40:10 -0800
Subject: [PATCH 1409/1641] Dialog: modal props now mixed correctly (#4045)

* Fixing Dialog/Modal default props.

* Adding change file.
---
 .../fix-dialog-props_2018-02-21-03-49.json    | 11 +++++
 .../src/components/Dialog/Dialog.base.tsx     | 40 ++++++++++++-------
 2 files changed, 36 insertions(+), 15 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-dialog-props_2018-02-21-03-49.json

diff --git a/common/changes/office-ui-fabric-react/fix-dialog-props_2018-02-21-03-49.json b/common/changes/office-ui-fabric-react/fix-dialog-props_2018-02-21-03-49.json
new file mode 100644
index 0000000000000..b5dc779ec7e7e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-dialog-props_2018-02-21-03-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dialog: default modal props now respective (Modal rendered with light background.)",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.base.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.base.tsx
index 8e8a7b26de447..dc8434d5d3f6d 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.base.tsx
@@ -5,28 +5,30 @@ import {
   getId
 } from '../../Utilities';
 import { IDialogProps } from './Dialog.types';
-import { DialogType } from './DialogContent.types';
-import { Modal } from '../../Modal';
+import { DialogType, IDialogContentProps } from './DialogContent.types';
+import { Modal, IModalProps } from '../../Modal';
 import { withResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
 import * as stylesImport from './Dialog.scss';
 const styles: any = stylesImport;
 
 import { DialogContent } from './DialogContent';
 
+const DefaultModalProps: IModalProps = {
+  isDarkOverlay: false,
+  isBlocking: false,
+  className: '',
+  containerClassName: ''
+};
+
+const DefaultDialogContentProps: IDialogContentProps = {
+  type: DialogType.normal,
+  className: '',
+  topButtonsProps: [],
+};
+
 @withResponsiveMode
 export class DialogBase extends BaseComponent<IDialogProps, {}> {
   public static defaultProps: IDialogProps = {
-    modalProps: {
-      isDarkOverlay: true,
-      isBlocking: false,
-      className: '',
-      containerClassName: ''
-    },
-    dialogContentProps: {
-      type: DialogType.normal,
-      className: '',
-      topButtonsProps: [],
-    },
     hidden: true,
   };
 
@@ -78,12 +80,20 @@ export class DialogBase extends BaseComponent<IDialogProps, {}> {
       type,
       contentClassName,
       topButtonsProps,
-      dialogContentProps,
-      modalProps,
       containerClassName,
       hidden
     } = this.props;
 
+    const modalProps = {
+      ...DefaultModalProps,
+      ...this.props.modalProps
+    };
+
+    const dialogContentProps: IDialogContentProps = {
+      ...DefaultDialogContentProps,
+      ...this.props.dialogContentProps
+    };
+
     return (
       <Modal
         elementToFocusOnDismiss={ elementToFocusOnDismiss }

From d6ed496697cb3ee61d7c52c0a04b271fd576f425 Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Tue, 20 Feb 2018 20:42:45 -0800
Subject: [PATCH 1410/1641] Nav SCSS to MergeStyles Part 1: File Structure
 (#4036)

* implement base file structure and styled() function

* rush change
---
 .../nav-scss2ms-pt1_2018-02-20-20-17.json     |  11 +
 .../src/components/Nav/Nav.base.tsx           | 381 +++++++++++++++++
 .../src/components/Nav/Nav.styles.ts          |  28 ++
 .../src/components/Nav/Nav.tsx                | 386 +-----------------
 .../src/components/Nav/Nav.types.ts           |  40 +-
 5 files changed, 465 insertions(+), 381 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/nav-scss2ms-pt1_2018-02-20-20-17.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Nav/Nav.styles.ts

diff --git a/common/changes/office-ui-fabric-react/nav-scss2ms-pt1_2018-02-20-20-17.json b/common/changes/office-ui-fabric-react/nav-scss2ms-pt1_2018-02-20-20-17.json
new file mode 100644
index 0000000000000..0a9eb4d10f6f0
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/nav-scss2ms-pt1_2018-02-20-20-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Converting Nav SCSS to MergeStyles step 1 - file structure",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
new file mode 100644
index 0000000000000..da9be9817ab85
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
@@ -0,0 +1,381 @@
+import * as React from 'react';
+import {
+  autobind,
+  BaseComponent,
+  css,
+  divProperties,
+  getNativeProps,
+  getRTL
+} from '../../Utilities';
+import { FocusZone, FocusZoneDirection } from '../../FocusZone';
+import { ActionButton, IButtonStyles } from '../../Button';
+import { Icon } from '../../Icon';
+import * as stylesImport from './Nav.scss';
+const styles: any = stylesImport;
+import { AnimationClassNames, mergeStyles } from '../../Styling';
+import {
+  INav,
+  INavProps,
+  INavLinkGroup,
+  INavLink
+} from './Nav.types';
+
+// The number pixels per indentation level for Nav links.
+const _indentationSize: number = 14;
+
+// The number of pixels of left margin
+const _baseIndent: number = 3;
+
+// The number of pixels of padding to add to the far side of the button (allows ellipsis to happen)
+const _farSidePadding: number = 20;
+
+// global var used in _isLinkSelectedKey
+let _urlResolver: HTMLAnchorElement | undefined;
+
+export function isRelativeUrl(url: string): boolean {
+  // A URL is relative if it has no protocol.
+  return !!url && !/^[a-z0-9+-.]:\/\//i.test(url);
+}
+
+export interface INavState {
+  isGroupCollapsed?: { [key: string]: boolean };
+  isLinkExpandStateChanged?: boolean;
+  selectedKey?: string;
+}
+
+export class NavBase extends BaseComponent<INavProps, INavState> implements INav {
+
+  public static defaultProps: INavProps = {
+    groups: null
+  };
+
+  private _hasExpandButton: boolean;
+
+  constructor(props: INavProps) {
+    super(props);
+
+    this.state = {
+      isGroupCollapsed: {},
+      isLinkExpandStateChanged: false,
+      selectedKey: props.initialSelectedKey || props.selectedKey,
+    };
+
+    if (props.groups) {
+      for (const group of props.groups) {
+        if (group.collapseByDefault && group.name) {
+          this.state.isGroupCollapsed![group.name] = true;
+        }
+      }
+    }
+    this._hasExpandButton = false;
+  }
+
+  public componentWillReceiveProps(newProps: INavProps) {
+    const newGroups = newProps.groups || [];
+    const isGroupCollapsed = this.state.isGroupCollapsed!;
+
+    // If the component's props were updated, new groups may have been added, which may have
+    // collapseByDefault set. Ensure that setting is respected for any new groups.
+    // (If isGroupCollapsed is already set for a group, don't overwrite that.)
+    let hasUpdated = false;
+    for (const newGroup of newGroups) {
+      if (newGroup.name && newGroup.collapseByDefault && !isGroupCollapsed.hasOwnProperty(newGroup.name)) {
+        isGroupCollapsed[newGroup.name] = true;
+        hasUpdated = true;
+      }
+    }
+
+    if (hasUpdated) {
+      this.setState({
+        isGroupCollapsed: isGroupCollapsed
+      });
+    }
+  }
+
+  public render(): JSX.Element | null {
+    const { groups, className, isOnTop } = this.props;
+
+    if (!groups) {
+      return null;
+    }
+
+    // When groups[x].name is specified or any of the links have children, the expand/collapse
+    // chevron button is shown and different padding is needed. _hasExpandButton marks this condition.
+    this._hasExpandButton = groups.some((group: INavLinkGroup) => {
+      return group ? !!group.name || (group.links && group.links.some((link: INavLink) => {
+        return !!(link && link.links && link.links.length);
+      })) : false;
+    });
+
+    const groupElements: React.ReactElement<{}>[] = groups.map(this._renderGroup);
+
+    return (
+      <FocusZone direction={ FocusZoneDirection.vertical }>
+        <nav
+          role='navigation'
+          className={ css(
+            'ms-Nav',
+            styles.root,
+            className,
+            isOnTop && css('is-onTop', styles.rootIsOnTop, AnimationClassNames.slideRightIn40)
+          ) }
+        >
+          { groupElements }
+        </nav>
+      </FocusZone>
+    );
+  }
+
+  public get selectedKey(): string | undefined {
+    return this.state.selectedKey;
+  }
+
+  private _onRenderLink(link: INavLink) {
+    return (<div className={ css('ms-Nav-linkText', styles.linkText) }>{ link.name }</div>);
+  }
+
+  private _renderNavLink(link: INavLink, linkIndex: number, nestingLevel: number) {
+    const isRtl: boolean = getRTL();
+    const paddingBefore = _indentationSize * nestingLevel + _baseIndent;
+    const buttonStyles: IButtonStyles = {
+      root: {
+        [isRtl ? 'paddingRight' : 'paddingLeft']: paddingBefore,
+        [isRtl ? 'paddingLeft' : 'paddingRight']: _farSidePadding,
+      },
+      textContainer: {
+        overflow: 'hidden',
+      },
+      label: {
+        whiteSpace: 'nowrap',
+        textOverflow: 'ellipsis',
+        overflow: 'hidden',
+        lineHeight: '36px'
+      }
+    };
+    const {
+      onRenderLink = this._onRenderLink
+    } = this.props;
+
+    // Prevent hijacking of the parent window if link.target is defined
+    const rel = link.url && link.target && !isRelativeUrl(link.url) ? 'noopener noreferrer' : undefined;
+
+    return (
+      <ActionButton
+        className={ mergeStyles(
+          'ms-Nav-link' + link.onClick && 'ms-Nav-linkButton',
+          styles.link,
+          link.onClick && !link.forceAnchor && styles.buttonEntry,
+          this._hasExpandButton && 'isOnExpanded') as string
+        }
+        styles={ buttonStyles }
+        href={ link.url || (link.forceAnchor ? 'javascript:' : undefined) }
+        iconProps={ { iconName: link.icon || '' } }
+        description={ link.title || link.name }
+        onClick={ link.onClick ? this._onNavButtonLinkClicked.bind(this, link) : this._onNavAnchorLinkClicked.bind(this, link) }
+        title={ link.title || link.name }
+        target={ link.target }
+        rel={ rel }
+        aria-label={ link.ariaLabel }
+      >
+        { onRenderLink(link, this._onRenderLink) }
+      </ActionButton>);
+  }
+
+  private _renderCompositeLink(link: INavLink, linkIndex: number, nestingLevel: number): React.ReactElement<{}> {
+    const isLinkSelected: boolean = this._isLinkSelected(link);
+    const isRtl: boolean = getRTL();
+    const absolutePositionString = `${_indentationSize * nestingLevel + 1}px`;
+
+    return (
+      <div
+        { ...getNativeProps(link, divProperties) }
+        key={ link.key || linkIndex }
+        className={ css(
+          'ms-Nav-compositeLink',
+          styles.compositeLink,
+          !!link.isExpanded && 'is-expanded',
+          isLinkSelected && 'is-selected',
+          !!link.isExpanded && styles.compositeLinkIsExpanded,
+          isLinkSelected && styles.compositeLinkIsSelected
+        ) }
+      >
+        { (link.links && link.links.length > 0 ?
+          <button
+            className={ mergeStyles(
+              'ms-Nav-chevronButton ms-Nav-chevronButton--link',
+              styles.chevronButton,
+              styles.chevronButtonLink,
+              isRtl && {
+                right: absolutePositionString,
+              },
+              !isRtl && {
+                left: absolutePositionString,
+              }) as string
+            }
+            onClick={ this._onLinkExpandClicked.bind(this, link) }
+            aria-label={ this.props.expandButtonAriaLabel }
+            aria-expanded={ link.isExpanded ? 'true' : 'false' }
+          >
+            <Icon
+              className={ css('ms-Nav-chevron', styles.chevronIcon, link.isExpanded) }
+              iconName='ChevronDown'
+            />
+          </button> : null
+        ) }
+        { this._renderNavLink(link, linkIndex, nestingLevel) }
+      </div>
+    );
+  }
+
+  private _renderLink(link: INavLink, linkIndex: number, nestingLevel: number): React.ReactElement<{}> {
+    return (
+      <li key={ link.key || linkIndex } role='listitem' className={ css(styles.navItem) }>
+        { this._renderCompositeLink(link, linkIndex, nestingLevel) }
+        { (link.isExpanded ? this._renderLinks(link.links, ++nestingLevel) : null) }
+      </li>
+    );
+  }
+
+  private _renderLinks(links: INavLink[] | undefined, nestingLevel: number): React.ReactElement<{}> | null {
+    if (!links || !links.length) {
+      return null;
+    }
+    const linkElements: React.ReactElement<{}>[] = links.map(
+      (link: INavLink, linkIndex: number) => this._renderLink(link, linkIndex, nestingLevel));
+
+    return (
+      <ul role='list' aria-label={ this.props.ariaLabel } className={ css(styles.navItems) }>
+        { linkElements }
+      </ul>
+    );
+  }
+
+  @autobind
+  private _renderGroup(group: INavLinkGroup, groupIndex: number): React.ReactElement<{}> {
+    const isGroupExpanded: boolean = !this.state.isGroupCollapsed![group.name!];
+
+    return (
+      <div
+        key={ groupIndex }
+        className={ css(
+          'ms-Nav-group',
+          styles.group,
+          isGroupExpanded && ('is-expanded ' + styles.groupIsExpanded)
+        ) }
+      >
+        { (group.name ?
+          <button
+            className={ css('ms-Nav-chevronButton ms-Nav-chevronButton--group ms-Nav-groupHeaderFontSize', styles.chevronButton, styles.chevronButtonIsGroup, styles.groupHeaderFontSize) }
+            onClick={ this._onGroupHeaderClicked.bind(this, group) }
+          >
+            <Icon
+              className={ css(
+                'ms-Nav-chevron',
+                styles.chevronIcon,
+                isGroupExpanded && styles.chevronIsExpanded
+              ) }
+              iconName='ChevronDown'
+            />
+            { group.name }
+          </button> : null)
+        }
+        <div className={ css('ms-Nav-groupContent', AnimationClassNames.slideDownIn20, styles.groupContent) }>
+          { this._renderLinks(group.links, 0 /* nestingLevel */) }
+        </div>
+      </div>
+    );
+  }
+
+  private _onGroupHeaderClicked(group: INavLinkGroup, ev: React.MouseEvent<HTMLElement>): void {
+    const { isGroupCollapsed } = this.state;
+    const groupKey = group.name!;
+    const isCollapsed = !isGroupCollapsed![groupKey];
+
+    if (group.onHeaderClick) {
+      group.onHeaderClick(ev, isCollapsed);
+    }
+
+    isGroupCollapsed![groupKey] = isCollapsed;
+    this.setState({ isGroupCollapsed: isGroupCollapsed });
+
+    ev.preventDefault();
+    ev.stopPropagation();
+  }
+
+  private _onLinkExpandClicked(link: INavLink, ev: React.MouseEvent<HTMLElement>): void {
+    const { onLinkExpandClick } = this.props;
+
+    if (onLinkExpandClick) {
+      onLinkExpandClick(ev, link);
+    }
+
+    if (!ev.defaultPrevented) {
+      link.isExpanded = !link.isExpanded;
+      this.setState({ isLinkExpandStateChanged: true });
+    }
+
+    ev.preventDefault();
+    ev.stopPropagation();
+  }
+
+  private _onNavAnchorLinkClicked(link: INavLink, ev: React.MouseEvent<HTMLElement>): void {
+    if (this.props.onLinkClick) {
+      this.props.onLinkClick(ev, link);
+    }
+
+    this.setState({ selectedKey: link.key });
+  }
+
+  private _onNavButtonLinkClicked(link: INavLink, ev: React.MouseEvent<HTMLElement>): void {
+    if (link.onClick) {
+      link.onClick(ev, link);
+    }
+
+    this.setState({ selectedKey: link.key });
+  }
+
+  private _isLinkSelected(link: INavLink): boolean {
+    // if caller passes in selectedKey, use it as first choice or
+    // if current state.selectedKey (from addressbar) is match to the link
+    if (this.props.selectedKey !== undefined) {
+      return link.key === this.props.selectedKey;
+    } else if (this.state.selectedKey !== undefined && link.key === this.state.selectedKey) {
+      return true;
+    }
+
+    // resolve is not supported for ssr
+    if (typeof (window) === 'undefined') {
+      return false;
+    }
+
+    if (!link.url) {
+      return false;
+    }
+
+    _urlResolver = _urlResolver || document.createElement('a');
+
+    _urlResolver.href = link.url || '';
+    const target: string = _urlResolver.href;
+
+    if (location.href === target) {
+      return true;
+    }
+
+    if (location.protocol + '//' + location.host + location.pathname === target) {
+      return true;
+    }
+
+    if (location.hash) {
+      // Match the hash to the url.
+      if (location.hash === link.url) {
+        return true;
+      }
+
+      // Match a rebased url. (e.g. #foo becomes http://hostname/foo)
+      _urlResolver.href = location.hash.substring(1);
+
+      return _urlResolver.href === target;
+    }
+    return false;
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.styles.ts b/packages/office-ui-fabric-react/src/components/Nav/Nav.styles.ts
new file mode 100644
index 0000000000000..55c5277ba6920
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.styles.ts
@@ -0,0 +1,28 @@
+import { INavStyleProps, INavStyles } from './Nav.types';
+import {
+  IStyle,
+  ITheme,
+} from '../../Styling';
+
+export const getStyles = (
+  props: INavStyleProps
+): INavStyles => {
+  const {
+    className,
+    theme,
+  } = props;
+
+  const { palette, semanticColors } = theme;
+
+  return ({
+    root: [
+      'ms-Nav',
+      {
+        // Insert css properties
+
+      }
+    ],
+
+    // Insert className styles
+  });
+};
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
index e4ce5042d5449..857d638b9998f 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.tsx
@@ -1,381 +1,13 @@
-import * as React from 'react';
+import { styled } from '../../Utilities';
 import {
-  autobind,
-  BaseComponent,
-  css,
-  divProperties,
-  getNativeProps,
-  getRTL
-} from '../../Utilities';
-import { FocusZone, FocusZoneDirection } from '../../FocusZone';
-import { ActionButton, IButtonStyles } from '../../Button';
-import { Icon } from '../../Icon';
-import * as stylesImport from './Nav.scss';
-const styles: any = stylesImport;
-import { AnimationClassNames, mergeStyles } from '../../Styling';
-import {
-  INav,
   INavProps,
-  INavLinkGroup,
-  INavLink
+  INavStyleProps,
+  INavStyles
 } from './Nav.types';
+import { NavBase } from './Nav.base';
+import { getStyles } from './Nav.styles';
 
-// The number pixels per indentation level for Nav links.
-const _indentationSize: number = 14;
-
-// The number of pixels of left margin
-const _baseIndent: number = 3;
-
-// The number of pixels of padding to add to the far side of the button (allows ellipsis to happen)
-const _farSidePadding: number = 20;
-
-// global var used in _isLinkSelectedKey
-let _urlResolver: HTMLAnchorElement | undefined;
-
-export function isRelativeUrl(url: string): boolean {
-  // A URL is relative if it has no protocol.
-  return !!url && !/^[a-z0-9+-.]:\/\//i.test(url);
-}
-
-export interface INavState {
-  isGroupCollapsed?: { [key: string]: boolean };
-  isLinkExpandStateChanged?: boolean;
-  selectedKey?: string;
-}
-
-export class Nav extends BaseComponent<INavProps, INavState> implements INav {
-
-  public static defaultProps: INavProps = {
-    groups: null
-  };
-
-  private _hasExpandButton: boolean;
-
-  constructor(props: INavProps) {
-    super(props);
-
-    this.state = {
-      isGroupCollapsed: {},
-      isLinkExpandStateChanged: false,
-      selectedKey: props.initialSelectedKey || props.selectedKey,
-    };
-
-    if (props.groups) {
-      for (const group of props.groups) {
-        if (group.collapseByDefault && group.name) {
-          this.state.isGroupCollapsed![group.name] = true;
-        }
-      }
-    }
-    this._hasExpandButton = false;
-  }
-
-  public componentWillReceiveProps(newProps: INavProps) {
-    const newGroups = newProps.groups || [];
-    const isGroupCollapsed = this.state.isGroupCollapsed!;
-
-    // If the component's props were updated, new groups may have been added, which may have
-    // collapseByDefault set. Ensure that setting is respected for any new groups.
-    // (If isGroupCollapsed is already set for a group, don't overwrite that.)
-    let hasUpdated = false;
-    for (const newGroup of newGroups) {
-      if (newGroup.name && newGroup.collapseByDefault && !isGroupCollapsed.hasOwnProperty(newGroup.name)) {
-        isGroupCollapsed[newGroup.name] = true;
-        hasUpdated = true;
-      }
-    }
-
-    if (hasUpdated) {
-      this.setState({
-        isGroupCollapsed: isGroupCollapsed
-      });
-    }
-  }
-
-  public render(): JSX.Element | null {
-    const { groups, className, isOnTop } = this.props;
-
-    if (!groups) {
-      return null;
-    }
-
-    // When groups[x].name is specified or any of the links have children, the expand/collapse
-    // chevron button is shown and different padding is needed. _hasExpandButton marks this condition.
-    this._hasExpandButton = groups.some((group: INavLinkGroup) => {
-      return group ? !!group.name || (group.links && group.links.some((link: INavLink) => {
-        return !!(link && link.links && link.links.length);
-      })) : false;
-    });
-
-    const groupElements: React.ReactElement<{}>[] = groups.map(this._renderGroup);
-
-    return (
-      <FocusZone direction={ FocusZoneDirection.vertical }>
-        <nav
-          role='navigation'
-          className={ css(
-            'ms-Nav',
-            styles.root,
-            className,
-            isOnTop && css('is-onTop', styles.rootIsOnTop, AnimationClassNames.slideRightIn40)
-          ) }
-        >
-          { groupElements }
-        </nav>
-      </FocusZone>
-    );
-  }
-
-  public get selectedKey(): string | undefined {
-    return this.state.selectedKey;
-  }
-
-  private _onRenderLink(link: INavLink) {
-    return (<div className={ css('ms-Nav-linkText', styles.linkText) }>{ link.name }</div>);
-  }
-
-  private _renderNavLink(link: INavLink, linkIndex: number, nestingLevel: number) {
-    const isRtl: boolean = getRTL();
-    const paddingBefore = _indentationSize * nestingLevel + _baseIndent;
-    const buttonStyles: IButtonStyles = {
-      root: {
-        [isRtl ? 'paddingRight' : 'paddingLeft']: paddingBefore,
-        [isRtl ? 'paddingLeft' : 'paddingRight']: _farSidePadding,
-      },
-      textContainer: {
-        overflow: 'hidden',
-      },
-      label: {
-        whiteSpace: 'nowrap',
-        textOverflow: 'ellipsis',
-        overflow: 'hidden',
-        lineHeight: '36px'
-      }
-    };
-    const {
-      onRenderLink = this._onRenderLink
-    } = this.props;
-
-    // Prevent hijacking of the parent window if link.target is defined
-    const rel = link.url && link.target && !isRelativeUrl(link.url) ? 'noopener noreferrer' : undefined;
-
-    return (
-      <ActionButton
-        className={ mergeStyles(
-          'ms-Nav-link' + link.onClick && 'ms-Nav-linkButton',
-          styles.link,
-          link.onClick && !link.forceAnchor && styles.buttonEntry,
-          this._hasExpandButton && 'isOnExpanded') as string
-        }
-        styles={ buttonStyles }
-        href={ link.url || (link.forceAnchor ? 'javascript:' : undefined) }
-        iconProps={ { iconName: link.icon || '' } }
-        description={ link.title || link.name }
-        onClick={ link.onClick ? this._onNavButtonLinkClicked.bind(this, link) : this._onNavAnchorLinkClicked.bind(this, link) }
-        title={ link.title || link.name }
-        target={ link.target }
-        rel={ rel }
-        aria-label={ link.ariaLabel }
-      >
-        { onRenderLink(link, this._onRenderLink) }
-      </ActionButton>);
-  }
-
-  private _renderCompositeLink(link: INavLink, linkIndex: number, nestingLevel: number): React.ReactElement<{}> {
-    const isLinkSelected: boolean = this._isLinkSelected(link);
-    const isRtl: boolean = getRTL();
-    const absolutePositionString = `${_indentationSize * nestingLevel + 1}px`;
-
-    return (
-      <div
-        { ...getNativeProps(link, divProperties) }
-        key={ link.key || linkIndex }
-        className={ css(
-          'ms-Nav-compositeLink',
-          styles.compositeLink,
-          !!link.isExpanded && 'is-expanded',
-          isLinkSelected && 'is-selected',
-          !!link.isExpanded && styles.compositeLinkIsExpanded,
-          isLinkSelected && styles.compositeLinkIsSelected
-        ) }
-      >
-        { (link.links && link.links.length > 0 ?
-          <button
-            className={ mergeStyles(
-              'ms-Nav-chevronButton ms-Nav-chevronButton--link',
-              styles.chevronButton,
-              styles.chevronButtonLink,
-              isRtl && {
-                right: absolutePositionString,
-              },
-              !isRtl && {
-                left: absolutePositionString,
-              }) as string
-            }
-            onClick={ this._onLinkExpandClicked.bind(this, link) }
-            aria-label={ this.props.expandButtonAriaLabel }
-            aria-expanded={ link.isExpanded ? 'true' : 'false' }
-          >
-            <Icon
-              className={ css('ms-Nav-chevron', styles.chevronIcon, link.isExpanded) }
-              iconName='ChevronDown'
-            />
-          </button> : null
-        ) }
-        { this._renderNavLink(link, linkIndex, nestingLevel) }
-      </div>
-    );
-  }
-
-  private _renderLink(link: INavLink, linkIndex: number, nestingLevel: number): React.ReactElement<{}> {
-    return (
-      <li key={ link.key || linkIndex } role='listitem' className={ css(styles.navItem) }>
-        { this._renderCompositeLink(link, linkIndex, nestingLevel) }
-        { (link.isExpanded ? this._renderLinks(link.links, ++nestingLevel) : null) }
-      </li>
-    );
-  }
-
-  private _renderLinks(links: INavLink[] | undefined, nestingLevel: number): React.ReactElement<{}> | null {
-    if (!links || !links.length) {
-      return null;
-    }
-    const linkElements: React.ReactElement<{}>[] = links.map(
-      (link: INavLink, linkIndex: number) => this._renderLink(link, linkIndex, nestingLevel));
-
-    return (
-      <ul role='list' aria-label={ this.props.ariaLabel } className={ css(styles.navItems) }>
-        { linkElements }
-      </ul>
-    );
-  }
-
-  @autobind
-  private _renderGroup(group: INavLinkGroup, groupIndex: number): React.ReactElement<{}> {
-    const isGroupExpanded: boolean = !this.state.isGroupCollapsed![group.name!];
-
-    return (
-      <div
-        key={ groupIndex }
-        className={ css(
-          'ms-Nav-group',
-          styles.group,
-          isGroupExpanded && ('is-expanded ' + styles.groupIsExpanded)
-        ) }
-      >
-        { (group.name ?
-          <button
-            className={ css('ms-Nav-chevronButton ms-Nav-chevronButton--group ms-Nav-groupHeaderFontSize', styles.chevronButton, styles.chevronButtonIsGroup, styles.groupHeaderFontSize) }
-            onClick={ this._onGroupHeaderClicked.bind(this, group) }
-          >
-            <Icon
-              className={ css(
-                'ms-Nav-chevron',
-                styles.chevronIcon,
-                isGroupExpanded && styles.chevronIsExpanded
-              ) }
-              iconName='ChevronDown'
-            />
-            { group.name }
-          </button> : null)
-        }
-        <div className={ css('ms-Nav-groupContent', AnimationClassNames.slideDownIn20, styles.groupContent) }>
-          { this._renderLinks(group.links, 0 /* nestingLevel */) }
-        </div>
-      </div>
-    );
-  }
-
-  private _onGroupHeaderClicked(group: INavLinkGroup, ev: React.MouseEvent<HTMLElement>): void {
-    const { isGroupCollapsed } = this.state;
-    const groupKey = group.name!;
-    const isCollapsed = !isGroupCollapsed![groupKey];
-
-    if (group.onHeaderClick) {
-      group.onHeaderClick(ev, isCollapsed);
-    }
-
-    isGroupCollapsed![groupKey] = isCollapsed;
-    this.setState({ isGroupCollapsed: isGroupCollapsed });
-
-    ev.preventDefault();
-    ev.stopPropagation();
-  }
-
-  private _onLinkExpandClicked(link: INavLink, ev: React.MouseEvent<HTMLElement>): void {
-    const { onLinkExpandClick } = this.props;
-
-    if (onLinkExpandClick) {
-      onLinkExpandClick(ev, link);
-    }
-
-    if (!ev.defaultPrevented) {
-      link.isExpanded = !link.isExpanded;
-      this.setState({ isLinkExpandStateChanged: true });
-    }
-
-    ev.preventDefault();
-    ev.stopPropagation();
-  }
-
-  private _onNavAnchorLinkClicked(link: INavLink, ev: React.MouseEvent<HTMLElement>): void {
-    if (this.props.onLinkClick) {
-      this.props.onLinkClick(ev, link);
-    }
-
-    this.setState({ selectedKey: link.key });
-  }
-
-  private _onNavButtonLinkClicked(link: INavLink, ev: React.MouseEvent<HTMLElement>): void {
-    if (link.onClick) {
-      link.onClick(ev, link);
-    }
-
-    this.setState({ selectedKey: link.key });
-  }
-
-  private _isLinkSelected(link: INavLink): boolean {
-    // if caller passes in selectedKey, use it as first choice or
-    // if current state.selectedKey (from addressbar) is match to the link
-    if (this.props.selectedKey !== undefined) {
-      return link.key === this.props.selectedKey;
-    } else if (this.state.selectedKey !== undefined && link.key === this.state.selectedKey) {
-      return true;
-    }
-
-    // resolve is not supported for ssr
-    if (typeof (window) === 'undefined') {
-      return false;
-    }
-
-    if (!link.url) {
-      return false;
-    }
-
-    _urlResolver = _urlResolver || document.createElement('a');
-
-    _urlResolver.href = link.url || '';
-    const target: string = _urlResolver.href;
-
-    if (location.href === target) {
-      return true;
-    }
-
-    if (location.protocol + '//' + location.host + location.pathname === target) {
-      return true;
-    }
-
-    if (location.hash) {
-      // Match the hash to the url.
-      if (location.hash === link.url) {
-        return true;
-      }
-
-      // Match a rebased url. (e.g. #foo becomes http://hostname/foo)
-      _urlResolver.href = location.hash.substring(1);
-
-      return _urlResolver.href === target;
-    }
-    return false;
-  }
-}
+export const Nav = styled<INavProps, INavStyleProps, INavStyles>(
+  NavBase,
+  getStyles
+);
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts b/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
index 200b55a318f21..37de48d7bb05f 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
@@ -1,5 +1,7 @@
 import * as React from 'react';
-import { IRenderFunction } from '../../Utilities';
+import { NavBase } from './Nav.base';
+import { IStyle, ITheme } from '../../Styling';
+import { IRenderFunction, IStyleFunction } from '../../Utilities';
 
 export interface INav {
   /**
@@ -19,15 +21,26 @@ export interface INavProps {
   componentRef?: (component: INav) => void;
 
   /**
-   * A collection of link groups to display in the navigation bar
+   * Call to provide customized styling that will layer on top of the variant rules
    */
-  groups: INavLinkGroup[] | null;
+  getStyles?: IStyleFunction<INavStyleProps, INavStyles>;
+
+  /**
+   * Theme provided by HOC.
+   */
+  theme?: ITheme;
 
   /**
-   * Optional class name to allow styling.
+   * Additional css class to apply to the Nav
+   * @defaultvalue undefined
    */
   className?: string;
 
+  /**
+   * A collection of link groups to display in the navigation bar
+   */
+  groups: INavLinkGroup[] | null;
+
   /**
    * Used to customize how content inside the link tag is rendered
    * @defaultvalue Default link rendering
@@ -201,3 +214,22 @@ export interface INavLink {
    */
   [propertyName: string]: any;
 }
+
+export interface INavStyleProps {
+  /**
+   * Accept theme prop.
+   */
+  theme: ITheme;
+
+  /**
+   * Accept custom classNames
+   */
+  className?: string;
+}
+
+export interface INavStyles {
+  /**
+   * Style for the root element.
+   */
+  root?: IStyle;
+}
\ No newline at end of file

From eaf26188ea91738b3daacc16bb7b426aa60a1e8d Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Tue, 20 Feb 2018 20:44:51 -0800
Subject: [PATCH 1411/1641] Image SCSS to MergeStyles Part 1: File Structure
 (#4037)

* implement base file structure and styled() function

* rush change

* Fix tests to recognize ImageBase

* Updated maxSize for bundlesize
---
 .../image-scss2ms-pt1_2018-02-20-20-25.json   |  11 +
 .../src/components/Image/Image.base.tsx       | 199 +++++++++++++++++
 .../src/components/Image/Image.styles.ts      |  28 +++
 .../src/components/Image/Image.test.tsx       |   5 +-
 .../src/components/Image/Image.tsx            | 210 +-----------------
 .../src/components/Image/Image.types.ts       |  43 +++-
 .../src/components/Persona/Persona.test.tsx   |   4 +-
 scripts/package.json                          |   2 +-
 8 files changed, 294 insertions(+), 208 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/image-scss2ms-pt1_2018-02-20-20-25.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Image/Image.base.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Image/Image.styles.ts

diff --git a/common/changes/office-ui-fabric-react/image-scss2ms-pt1_2018-02-20-20-25.json b/common/changes/office-ui-fabric-react/image-scss2ms-pt1_2018-02-20-20-25.json
new file mode 100644
index 0000000000000..34c1bafb5feb0
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/image-scss2ms-pt1_2018-02-20-20-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Converting Image SCSS to MergeStyles step 1 - file structure",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx
new file mode 100644
index 0000000000000..96e3ca77c12e4
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx
@@ -0,0 +1,199 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+import {
+  autobind,
+  BaseComponent,
+  css,
+  getNativeProps,
+  imageProperties
+} from '../../Utilities';
+import { IImageProps, ImageFit, ImageLoadState, ImageCoverStyle } from './Image.types';
+import { AnimationClassNames } from '../../Styling';
+import * as stylesImport from './Image.scss';
+const styles: any = stylesImport;
+
+export interface IImageState {
+  loadState?: ImageLoadState;
+}
+
+export const CoverStyleMap: { [key: number]: string } = {
+  [ImageCoverStyle.landscape]: 'ms-Image-image--landscape ' + styles.imageIsLandscape,
+  [ImageCoverStyle.portrait]: 'ms-Image-image--portrait ' + styles.imageIsPortrait
+};
+
+export const ImageFitMap: { [key: number]: string } = {
+  [ImageFit.center]: 'ms-Image-image--center ' + styles.imageIsCenter,
+  [ImageFit.contain]: 'ms-Image-image--contain ' + styles.imageIsContain,
+  [ImageFit.cover]: 'ms-Image-image--cover ' + styles.imageIsCover,
+  [ImageFit.none]: 'ms-Image-image--none ' + styles.imageIsNone
+};
+
+const KEY_PREFIX: string = 'fabricImage';
+
+export class ImageBase extends BaseComponent<IImageProps, IImageState> {
+  public static defaultProps = {
+    shouldFadeIn: true
+  };
+
+  private static _svgRegex = /\.svg$/i;
+
+  // Make an initial assumption about the image layout until we can
+  // check the rendered element. The value here only takes effect when
+  // shouldStartVisible is true.
+  private _coverStyle: ImageCoverStyle = ImageCoverStyle.portrait;
+  private _imageElement: HTMLImageElement;
+  private _frameElement: HTMLDivElement;
+
+  constructor(props: IImageProps) {
+    super(props);
+
+    this.state = {
+      loadState: ImageLoadState.notLoaded
+    };
+  }
+
+  public componentWillReceiveProps(nextProps: IImageProps) {
+    if (nextProps.src !== this.props.src) {
+      this.setState({
+        loadState: ImageLoadState.notLoaded
+      });
+    } else if (this.state.loadState === ImageLoadState.loaded) {
+      this._computeCoverStyle(nextProps);
+    }
+  }
+
+  public componentDidUpdate(prevProps: IImageProps, prevState: IImageState) {
+    this._checkImageLoaded();
+    if (this.props.onLoadingStateChange
+      && prevState.loadState !== this.state.loadState) {
+      this.props.onLoadingStateChange(this.state.loadState!);
+    }
+  }
+
+  public render() {
+    const imageProps = getNativeProps(this.props, imageProperties, ['width', 'height']);
+    const { src, alt, width, height, shouldFadeIn, shouldStartVisible, className, imageFit, role, maximizeFrame } = this.props;
+    const { loadState } = this.state;
+    const coverStyle = this.props.coverStyle !== undefined ? this.props.coverStyle : this._coverStyle;
+    const loaded = loadState === ImageLoadState.loaded || (loadState === ImageLoadState.notLoaded && this.props.shouldStartVisible);
+
+    // If image dimensions aren't specified, the natural size of the image is used.
+    return (
+      <div
+        className={ css(
+          'ms-Image',
+          styles.root,
+          className,
+          {
+            ['ms-Image--maximizeFrame ' + styles.rootIsMaximizeFrame]: maximizeFrame
+          })
+        }
+        style={ { width: width, height: height } }
+        ref={ this._resolveRef('_frameElement') }
+      >
+        <img
+          { ...imageProps }
+          onLoad={ this._onImageLoaded }
+          onError={ this._onImageError }
+          key={ KEY_PREFIX + this.props.src || '' }
+          className={
+            css(
+              'ms-Image-image',
+              styles.image,
+              CoverStyleMap[coverStyle],
+              (imageFit !== undefined) && ImageFitMap[imageFit],
+              !loaded && 'is-notLoaded',
+              loaded && 'is-loaded ' + styles.imageIsLoaded,
+              shouldFadeIn && 'is-fadeIn',
+              loadState === ImageLoadState.error && 'is-error',
+              loaded && shouldFadeIn && !shouldStartVisible && AnimationClassNames.fadeIn400,
+              {
+                ['ms-Image-image--scaleWidth ' + styles.imageIsScaleWidth]: (imageFit === undefined && !!width && !height),
+                ['ms-Image-image--scaleHeight ' + styles.imageIsScaleHeight]: (imageFit === undefined && !width && !!height),
+                ['ms-Image-image--scaleWidthHeight ' + styles.imageIsScaleWidthHeight]: (imageFit === undefined && !!width && !!height)
+              }) }
+          ref={ this._resolveRef('_imageElement') }
+          src={ src }
+          alt={ alt }
+          role={ role }
+        />
+      </div>
+    );
+  }
+
+  @autobind
+  private _onImageLoaded(ev: React.SyntheticEvent<HTMLImageElement>): void {
+    const { src, onLoad } = this.props;
+    if (onLoad) {
+      onLoad(ev);
+    }
+
+    this._computeCoverStyle(this.props);
+
+    if (src) {
+      this.setState({
+        loadState: ImageLoadState.loaded
+      });
+    }
+  }
+
+  private _checkImageLoaded(): void {
+    const { src } = this.props;
+    const { loadState } = this.state;
+
+    if (loadState === ImageLoadState.notLoaded) {
+      // testing if naturalWidth and naturalHeight are greater than zero is better than checking
+      // .complete, because .complete will also be set to true if the image breaks. However,
+      // for some browsers, SVG images do not have a naturalWidth or naturalHeight, so fall back
+      // to checking .complete for these images.
+      const isLoaded: boolean = src && this._imageElement && (this._imageElement.naturalWidth > 0 && this._imageElement.naturalHeight > 0) ||
+        (this._imageElement.complete && ImageBase._svgRegex.test(src!));
+
+      if (isLoaded) {
+        this._computeCoverStyle(this.props);
+        this.setState({
+          loadState: ImageLoadState.loaded
+        });
+      }
+    }
+  }
+
+  private _computeCoverStyle(props: IImageProps) {
+    const { imageFit, width, height } = props;
+
+    // Do not compute cover style if it was already specified in props
+    if ((imageFit === ImageFit.cover || imageFit === ImageFit.contain) &&
+      this.props.coverStyle === undefined &&
+      this._imageElement) {
+      // Determine the desired ratio using the width and height props.
+      // If those props aren't available, measure measure the frame.
+      let desiredRatio;
+      if (!!width && !!height) {
+        desiredRatio = (width as number) / (height as number);
+      } else {
+        desiredRatio = this._frameElement.clientWidth / this._frameElement.clientHeight;
+      }
+
+      // Examine the source image to determine its original ratio.
+      const naturalRatio = this._imageElement.naturalWidth / this._imageElement.naturalHeight;
+
+      // Should we crop from the top or the sides?
+      if (naturalRatio > desiredRatio) {
+        this._coverStyle = ImageCoverStyle.landscape;
+      } else {
+        this._coverStyle = ImageCoverStyle.portrait;
+      }
+    }
+  }
+
+  @autobind
+  private _onImageError(ev: React.SyntheticEvent<HTMLImageElement>) {
+    if (this.props.onError) {
+      this.props.onError(ev);
+    }
+    this.setState({
+      loadState: ImageLoadState.error
+    });
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.styles.ts b/packages/office-ui-fabric-react/src/components/Image/Image.styles.ts
new file mode 100644
index 0000000000000..251d2f01f1266
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.styles.ts
@@ -0,0 +1,28 @@
+import { IImageStyleProps, IImageStyles } from './Image.types';
+import {
+  IStyle,
+  ITheme,
+} from '../../Styling';
+
+export const getStyles = (
+  props: IImageStyleProps
+): IImageStyles => {
+  const {
+    className,
+    theme,
+  } = props;
+
+  const { palette, semanticColors } = theme;
+
+  return ({
+    root: [
+      'ms-Image',
+      {
+        // Insert css properties
+
+      }
+    ],
+
+    // Insert className styles
+  });
+};
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
index 3d6f57c85e59a..dd3e8c6482a88 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
@@ -8,6 +8,7 @@ import * as renderer from 'react-test-renderer';
 import { shallow, mount, ReactWrapper } from 'enzyme';
 
 import { Image } from './Image';
+import { ImageBase } from './Image.base';
 import { ImageFit, ImageLoadState } from './Image.types';
 
 /* tslint:disable:no-unused-variable */
@@ -31,7 +32,7 @@ describe('Image', () => {
 
   it('renders an image', (done) => {
     const component = ReactTestUtils.renderIntoDocument(
-      <Image
+      <ImageBase
         src={ testImage1x1 }
         // tslint:disable-next-line:jsx-no-lambda
         onLoad={ () => done() }
@@ -118,7 +119,7 @@ describe('Image', () => {
 
   it('allows onError events to be attached', (done) => {
     const component = ReactTestUtils.renderIntoDocument(
-      <Image
+      <ImageBase
         src={ brokenImage }
         // tslint:disable-next-line:jsx-no-lambda
         onError={ () => done() }
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.tsx
index a22c305b8cb2a..9da96481945e3 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.tsx
@@ -1,199 +1,13 @@
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-/* tslint:enable:no-unused-variable */
+import { styled } from '../../Utilities';
 import {
-  autobind,
-  BaseComponent,
-  css,
-  getNativeProps,
-  imageProperties
-} from '../../Utilities';
-import { IImageProps, ImageFit, ImageLoadState, ImageCoverStyle } from './Image.types';
-import { AnimationClassNames } from '../../Styling';
-import * as stylesImport from './Image.scss';
-const styles: any = stylesImport;
-
-export interface IImageState {
-  loadState?: ImageLoadState;
-}
-
-export const CoverStyleMap: { [key: number]: string } = {
-  [ImageCoverStyle.landscape]: 'ms-Image-image--landscape ' + styles.imageIsLandscape,
-  [ImageCoverStyle.portrait]: 'ms-Image-image--portrait ' + styles.imageIsPortrait
-};
-
-export const ImageFitMap: { [key: number]: string } = {
-  [ImageFit.center]: 'ms-Image-image--center ' + styles.imageIsCenter,
-  [ImageFit.contain]: 'ms-Image-image--contain ' + styles.imageIsContain,
-  [ImageFit.cover]: 'ms-Image-image--cover ' + styles.imageIsCover,
-  [ImageFit.none]: 'ms-Image-image--none ' + styles.imageIsNone
-};
-
-const KEY_PREFIX: string = 'fabricImage';
-
-export class Image extends BaseComponent<IImageProps, IImageState> {
-  public static defaultProps = {
-    shouldFadeIn: true
-  };
-
-  private static _svgRegex = /\.svg$/i;
-
-  // Make an initial assumption about the image layout until we can
-  // check the rendered element. The value here only takes effect when
-  // shouldStartVisible is true.
-  private _coverStyle: ImageCoverStyle = ImageCoverStyle.portrait;
-  private _imageElement: HTMLImageElement;
-  private _frameElement: HTMLDivElement;
-
-  constructor(props: IImageProps) {
-    super(props);
-
-    this.state = {
-      loadState: ImageLoadState.notLoaded
-    };
-  }
-
-  public componentWillReceiveProps(nextProps: IImageProps) {
-    if (nextProps.src !== this.props.src) {
-      this.setState({
-        loadState: ImageLoadState.notLoaded
-      });
-    } else if (this.state.loadState === ImageLoadState.loaded) {
-      this._computeCoverStyle(nextProps);
-    }
-  }
-
-  public componentDidUpdate(prevProps: IImageProps, prevState: IImageState) {
-    this._checkImageLoaded();
-    if (this.props.onLoadingStateChange
-      && prevState.loadState !== this.state.loadState) {
-      this.props.onLoadingStateChange(this.state.loadState!);
-    }
-  }
-
-  public render() {
-    const imageProps = getNativeProps(this.props, imageProperties, ['width', 'height']);
-    const { src, alt, width, height, shouldFadeIn, shouldStartVisible, className, imageFit, role, maximizeFrame } = this.props;
-    const { loadState } = this.state;
-    const coverStyle = this.props.coverStyle !== undefined ? this.props.coverStyle : this._coverStyle;
-    const loaded = loadState === ImageLoadState.loaded || (loadState === ImageLoadState.notLoaded && this.props.shouldStartVisible);
-
-    // If image dimensions aren't specified, the natural size of the image is used.
-    return (
-      <div
-        className={ css(
-          'ms-Image',
-          styles.root,
-          className,
-          {
-            ['ms-Image--maximizeFrame ' + styles.rootIsMaximizeFrame]: maximizeFrame
-          })
-        }
-        style={ { width: width, height: height } }
-        ref={ this._resolveRef('_frameElement') }
-      >
-        <img
-          { ...imageProps }
-          onLoad={ this._onImageLoaded }
-          onError={ this._onImageError }
-          key={ KEY_PREFIX + this.props.src || '' }
-          className={
-            css(
-              'ms-Image-image',
-              styles.image,
-              CoverStyleMap[coverStyle],
-              (imageFit !== undefined) && ImageFitMap[imageFit],
-              !loaded && 'is-notLoaded',
-              loaded && 'is-loaded ' + styles.imageIsLoaded,
-              shouldFadeIn && 'is-fadeIn',
-              loadState === ImageLoadState.error && 'is-error',
-              loaded && shouldFadeIn && !shouldStartVisible && AnimationClassNames.fadeIn400,
-              {
-                ['ms-Image-image--scaleWidth ' + styles.imageIsScaleWidth]: (imageFit === undefined && !!width && !height),
-                ['ms-Image-image--scaleHeight ' + styles.imageIsScaleHeight]: (imageFit === undefined && !width && !!height),
-                ['ms-Image-image--scaleWidthHeight ' + styles.imageIsScaleWidthHeight]: (imageFit === undefined && !!width && !!height)
-              }) }
-          ref={ this._resolveRef('_imageElement') }
-          src={ src }
-          alt={ alt }
-          role={ role }
-        />
-      </div>
-    );
-  }
-
-  @autobind
-  private _onImageLoaded(ev: React.SyntheticEvent<HTMLImageElement>): void {
-    const { src, onLoad } = this.props;
-    if (onLoad) {
-      onLoad(ev);
-    }
-
-    this._computeCoverStyle(this.props);
-
-    if (src) {
-      this.setState({
-        loadState: ImageLoadState.loaded
-      });
-    }
-  }
-
-  private _checkImageLoaded(): void {
-    const { src } = this.props;
-    const { loadState } = this.state;
-
-    if (loadState === ImageLoadState.notLoaded) {
-      // testing if naturalWidth and naturalHeight are greater than zero is better than checking
-      // .complete, because .complete will also be set to true if the image breaks. However,
-      // for some browsers, SVG images do not have a naturalWidth or naturalHeight, so fall back
-      // to checking .complete for these images.
-      const isLoaded: boolean = src && this._imageElement && (this._imageElement.naturalWidth > 0 && this._imageElement.naturalHeight > 0) ||
-        (this._imageElement.complete && Image._svgRegex.test(src!));
-
-      if (isLoaded) {
-        this._computeCoverStyle(this.props);
-        this.setState({
-          loadState: ImageLoadState.loaded
-        });
-      }
-    }
-  }
-
-  private _computeCoverStyle(props: IImageProps) {
-    const { imageFit, width, height } = props;
-
-    // Do not compute cover style if it was already specified in props
-    if ((imageFit === ImageFit.cover || imageFit === ImageFit.contain) &&
-      this.props.coverStyle === undefined &&
-      this._imageElement) {
-      // Determine the desired ratio using the width and height props.
-      // If those props aren't available, measure measure the frame.
-      let desiredRatio;
-      if (!!width && !!height) {
-        desiredRatio = (width as number) / (height as number);
-      } else {
-        desiredRatio = this._frameElement.clientWidth / this._frameElement.clientHeight;
-      }
-
-      // Examine the source image to determine its original ratio.
-      const naturalRatio = this._imageElement.naturalWidth / this._imageElement.naturalHeight;
-
-      // Should we crop from the top or the sides?
-      if (naturalRatio > desiredRatio) {
-        this._coverStyle = ImageCoverStyle.landscape;
-      } else {
-        this._coverStyle = ImageCoverStyle.portrait;
-      }
-    }
-  }
-
-  @autobind
-  private _onImageError(ev: React.SyntheticEvent<HTMLImageElement>) {
-    if (this.props.onError) {
-      this.props.onError(ev);
-    }
-    this.setState({
-      loadState: ImageLoadState.error
-    });
-  }
-}
+  IImageProps,
+  IImageStyleProps,
+  IImageStyles
+} from './Image.types';
+import { ImageBase } from './Image.base';
+import { getStyles } from './Image.styles';
+
+export const Image = styled<IImageProps, IImageStyleProps, IImageStyles>(
+  ImageBase,
+  getStyles
+);
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.types.ts b/packages/office-ui-fabric-react/src/components/Image/Image.types.ts
index e1374ad052553..41cc5f4dcd4a3 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.types.ts
@@ -1,4 +1,7 @@
 import * as React from 'react';
+import { ImageBase } from './Image.base';
+import { IStyle, ITheme } from '../../Styling';
+import { IStyleFunction } from '../../Utilities';
 
 export interface IImage {
 
@@ -11,6 +14,22 @@ export interface IImageProps extends React.ImgHTMLAttributes<HTMLImageElement> {
    */
   componentRef?: (component: IImage) => void;
 
+  /**
+   * Call to provide customized styling that will layer on top of the variant rules
+   */
+  getStyles?: IStyleFunction<IImageStyleProps, IImageStyles>;
+
+  /**
+   * Theme provided by HOC.
+   */
+  theme?: ITheme;
+
+  /**
+   * Additional css class to apply to the Component
+   * @defaultvalue undefined
+   */
+  className?: string;
+
   /**
    * If true, fades the image in when loaded.
    * @defaultvalue true
@@ -24,11 +43,6 @@ export interface IImageProps extends React.ImgHTMLAttributes<HTMLImageElement> {
    */
   shouldStartVisible?: boolean;
 
-  /**
-   * If provided, adds the indicated css class to the image.
-   */
-  className?: string;
-
   /**
    * Used to determine how the image is scaled and cropped to fit the frame.
    *
@@ -130,3 +144,22 @@ export enum ImageLoadState {
    */
   errorLoaded = 3
 }
+
+export interface IImageStyleProps {
+  /**
+   * Accept theme prop.
+   */
+  theme: ITheme;
+
+  /**
+   * Accept custom classNames
+   */
+  className?: string;
+}
+
+export interface IImageStyles {
+  /**
+   * Style for the root element.
+   */
+  root?: IStyle;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
index 81aebf2de1a53..bfc66bd2eecf6 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
@@ -82,14 +82,14 @@ describe('Persona', () => {
   describe('image', () => {
     it('renders empty alt text by default', () => {
       const wrapper = mount(<Persona primaryText='Kat Larrson' imageUrl={ testImage1x1 } />);
-      const image: ReactWrapper<React.ImgHTMLAttributes<any>, any> = wrapper.find('Image');
+      const image: ReactWrapper<React.ImgHTMLAttributes<any>, any> = wrapper.find('ImageBase');
 
       expect(image.props().alt).toEqual('');
     });
 
     it('renders its given alt text', () => {
       const wrapper = mount(<Persona primaryText='Kat Larrson' imageUrl={ testImage1x1 } imageAlt='ALT TEXT' />);
-      const image: ReactWrapper<React.ImgHTMLAttributes<any>, any> = wrapper.find('Image');
+      const image: ReactWrapper<React.ImgHTMLAttributes<any>, any> = wrapper.find('ImageBase');
 
       expect(image.props().alt).toEqual('ALT TEXT');
     });
diff --git a/scripts/package.json b/scripts/package.json
index 8ee991768cd7a..2f4792aea6422 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -49,7 +49,7 @@
   "bundlesize": [
     {
       "path": "../apps/test-bundle-button/dist/main.min.js",
-      "maxSize": "43.1 kB"
+      "maxSize": "43.3 kB"
     }
   ]
 }
\ No newline at end of file

From 6a35693c2cfb692a8adb381ecb228a2e23f801e4 Mon Sep 17 00:00:00 2001
From: Cody Hoover <hoovercj@users.noreply.github.com>
Date: Wed, 21 Feb 2018 05:47:27 +0100
Subject: [PATCH 1412/1641] Features/disabled link pointer events (#4020)

* Allow pointer events on diabled links used as buttons

* Add change file

* Fix wording in change file

* Update snapshot
---
 ...-disabled-link-pointer-events_2018-02-19-16-13.json |  9 +++++++++
 .../src/components/Link/Link.styles.ts                 | 10 ++++++++--
 .../components/Link/__snapshots__/Link.test.tsx.snap   |  8 ++++++--
 3 files changed, 23 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/features-disabled-link-pointer-events_2018-02-19-16-13.json

diff --git a/common/changes/office-ui-fabric-react/features-disabled-link-pointer-events_2018-02-19-16-13.json b/common/changes/office-ui-fabric-react/features-disabled-link-pointer-events_2018-02-19-16-13.json
new file mode 100644
index 0000000000000..17c7cacac5fb8
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/features-disabled-link-pointer-events_2018-02-19-16-13.json
@@ -0,0 +1,9 @@
+{
+  "changes": [{
+    "packageName": "office-ui-fabric-react",
+    "comment": "Only apply 'pointer-events: none' to disabled Link components if there is an href ",
+    "type": "patch"
+  }],
+  "packageName": "office-ui-fabric-react",
+  "email": "cohoov@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.styles.ts b/packages/office-ui-fabric-react/src/components/Link/Link.styles.ts
index 2fcca8da7bc8f..30464420d5d68 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.styles.ts
@@ -43,8 +43,14 @@ export const getStyles = (props: ILinkStyleProps): ILinkStyles => {
         'is-disabled',
         {
           color: semanticColors.disabledText,
-          cursor: 'default',
-          pointerEvents: 'none'
+          cursor: 'default'
+        },
+        {
+          selectors: {
+            '&:link, &:visited': {
+              pointerEvents: 'none'
+            }
+          }
         }
       ],
       !isDisabled && {
diff --git a/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap
index ab56a5c038c8a..22b0992c34d45 100644
--- a/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap
@@ -144,7 +144,6 @@ exports[`Link renders disabled Link correctly 1`] = `
         color: #a6a6a6;
         cursor: default;
         outline: transparent;
-        pointer-events: none;
         position: relative;
         text-decoration: none;
       }
@@ -162,6 +161,9 @@ exports[`Link renders disabled Link correctly 1`] = `
         top: 1px;
         z-index: 1;
       }
+      &:link, &:visited {
+        pointer-events: none;
+      }
   href="#"
   onClick={[Function]}
   target={undefined}
@@ -193,7 +195,6 @@ exports[`Link renders disabled Link with no href as a button correctly 1`] = `
         padding-left: 0px;
         padding-right: 0px;
         padding-top: 0px;
-        pointer-events: none;
         position: relative;
         text-align: left;
         text-overflow: inherit;
@@ -215,6 +216,9 @@ exports[`Link renders disabled Link with no href as a button correctly 1`] = `
       @media screen and (-ms-high-contrast: active){& {
         color: Highlight;
       }
+      &:link, &:visited {
+        pointer-events: none;
+      }
   disabled={true}
   onClick={[Function]}
 >

From 8a3584af8ef514a339ce85ad0a2172fee5cdfa5a Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 21 Feb 2018 11:12:11 +0000
Subject: [PATCH 1413/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 .../misc-changes_2018-02-20-17-19.json        | 11 ---
 .../misc-changes_2018-02-20-17-19.json        | 11 ---
 .../zhiliu-groupingOp_2018-02-19-19-18.json   | 11 ---
 .../accAriaSize_2018-02-16-19-56.json         | 11 ---
 .../enable-jsx-key_2018-02-18-15-44.json      | 11 ---
 ...-link-pointer-events_2018-02-19-16-13.json |  9 --
 .../fix-dialog-props_2018-02-21-03-49.json    | 11 ---
 .../image-scss2ms-pt1_2018-02-20-20-25.json   | 11 ---
 ...boardingImprovements_2018-02-20-19-57.json | 11 ---
 ...Styles-Dialog-round1_2018-02-21-00-19.json | 11 ---
 .../misc-changes_2018-02-20-17-19.json        | 11 ---
 .../nav-scss2ms-pt1_2018-02-20-20-17.json     | 11 ---
 .../rating-type_2018-02-21-04-05.json         | 11 ---
 ...izegroup-scss2ms-pt1_2018-02-19-18-39.json | 11 ---
 ...ablepane-scss2ms-pt2_2018-02-17-00-02.json | 11 ---
 .../zhiliu-groupingOp_2018-02-19-19-18.json   | 11 ---
 packages/example-app-base/CHANGELOG.json      | 19 ++++
 packages/example-app-base/CHANGELOG.md        |  9 +-
 packages/example-app-base/package.json        |  4 +-
 packages/experiments/package.json             |  4 +-
 .../jest-serializer-merge-styles/package.json |  2 +-
 packages/merge-styles/CHANGELOG.json          | 14 +++
 packages/merge-styles/CHANGELOG.md            |  9 +-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 87 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 24 ++++-
 packages/office-ui-fabric-react/package.json  |  8 +-
 packages/styling/package.json                 |  4 +-
 packages/utilities/CHANGELOG.json             | 19 ++++
 packages/utilities/CHANGELOG.md               |  9 +-
 packages/utilities/package.json               |  4 +-
 scripts/package.json                          |  2 +-
 33 files changed, 202 insertions(+), 194 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/misc-changes_2018-02-20-17-19.json
 delete mode 100644 common/changes/@uifabric/merge-styles/misc-changes_2018-02-20-17-19.json
 delete mode 100644 common/changes/@uifabric/utilities/zhiliu-groupingOp_2018-02-19-19-18.json
 delete mode 100644 common/changes/office-ui-fabric-react/accAriaSize_2018-02-16-19-56.json
 delete mode 100644 common/changes/office-ui-fabric-react/enable-jsx-key_2018-02-18-15-44.json
 delete mode 100644 common/changes/office-ui-fabric-react/features-disabled-link-pointer-events_2018-02-19-16-13.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-dialog-props_2018-02-21-03-49.json
 delete mode 100644 common/changes/office-ui-fabric-react/image-scss2ms-pt1_2018-02-20-20-25.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerKeyboardingImprovements_2018-02-20-19-57.json
 delete mode 100644 common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-21-00-19.json
 delete mode 100644 common/changes/office-ui-fabric-react/misc-changes_2018-02-20-17-19.json
 delete mode 100644 common/changes/office-ui-fabric-react/nav-scss2ms-pt1_2018-02-20-20-17.json
 delete mode 100644 common/changes/office-ui-fabric-react/rating-type_2018-02-21-04-05.json
 delete mode 100644 common/changes/office-ui-fabric-react/resizegroup-scss2ms-pt1_2018-02-19-18-39.json
 delete mode 100644 common/changes/office-ui-fabric-react/scrollablepane-scss2ms-pt2_2018-02-17-00-02.json
 delete mode 100644 common/changes/office-ui-fabric-react/zhiliu-groupingOp_2018-02-19-19-18.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index cfeb77587b2ad..3858e87d85a78 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.51.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.53.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/misc-changes_2018-02-20-17-19.json b/common/changes/@uifabric/example-app-base/misc-changes_2018-02-20-17-19.json
deleted file mode 100644
index 7ef0035e98ee8..0000000000000
--- a/common/changes/@uifabric/example-app-base/misc-changes_2018-02-20-17-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Tweaking css for example pages.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/misc-changes_2018-02-20-17-19.json b/common/changes/@uifabric/merge-styles/misc-changes_2018-02-20-17-19.json
deleted file mode 100644
index 2630dcaeb2a2b..0000000000000
--- a/common/changes/@uifabric/merge-styles/misc-changes_2018-02-20-17-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "Adding test coverage for media queries.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/zhiliu-groupingOp_2018-02-19-19-18.json b/common/changes/@uifabric/utilities/zhiliu-groupingOp_2018-02-19-19-18.json
deleted file mode 100644
index 7e6a7040b5822..0000000000000
--- a/common/changes/@uifabric/utilities/zhiliu-groupingOp_2018-02-19-19-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "fix bug in IE that IE does not support Number.IsInteger",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "zhiliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/accAriaSize_2018-02-16-19-56.json b/common/changes/office-ui-fabric-react/accAriaSize_2018-02-16-19-56.json
deleted file mode 100644
index 4926123daab9a..0000000000000
--- a/common/changes/office-ui-fabric-react/accAriaSize_2018-02-16-19-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "added support for aria-posinset and aria-setsize",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chiechan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/enable-jsx-key_2018-02-18-15-44.json b/common/changes/office-ui-fabric-react/enable-jsx-key_2018-02-18-15-44.json
deleted file mode 100644
index fa18d8566bd88..0000000000000
--- a/common/changes/office-ui-fabric-react/enable-jsx-key_2018-02-18-15-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Enable jsx-key tslint rule",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mark@thedutchies.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/features-disabled-link-pointer-events_2018-02-19-16-13.json b/common/changes/office-ui-fabric-react/features-disabled-link-pointer-events_2018-02-19-16-13.json
deleted file mode 100644
index 17c7cacac5fb8..0000000000000
--- a/common/changes/office-ui-fabric-react/features-disabled-link-pointer-events_2018-02-19-16-13.json
+++ /dev/null
@@ -1,9 +0,0 @@
-{
-  "changes": [{
-    "packageName": "office-ui-fabric-react",
-    "comment": "Only apply 'pointer-events: none' to disabled Link components if there is an href ",
-    "type": "patch"
-  }],
-  "packageName": "office-ui-fabric-react",
-  "email": "cohoov@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-dialog-props_2018-02-21-03-49.json b/common/changes/office-ui-fabric-react/fix-dialog-props_2018-02-21-03-49.json
deleted file mode 100644
index b5dc779ec7e7e..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-dialog-props_2018-02-21-03-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dialog: default modal props now respective (Modal rendered with light background.)",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/image-scss2ms-pt1_2018-02-20-20-25.json b/common/changes/office-ui-fabric-react/image-scss2ms-pt1_2018-02-20-20-25.json
deleted file mode 100644
index 34c1bafb5feb0..0000000000000
--- a/common/changes/office-ui-fabric-react/image-scss2ms-pt1_2018-02-20-20-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Converting Image SCSS to MergeStyles step 1 - file structure",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerKeyboardingImprovements_2018-02-20-19-57.json b/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerKeyboardingImprovements_2018-02-20-19-57.json
deleted file mode 100644
index df6ccf7f9acd4..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-SwatchColorPickerKeyboardingImprovements_2018-02-20-19-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SwatchColorPicker: Improve keyboard/mouse behavior",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-21-00-19.json b/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-21-00-19.json
deleted file mode 100644
index 2f42ad25a4d29..0000000000000
--- a/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-21-00-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Convert Dialog to mergeStyles, part 1 - file structure",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-jojanz@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/misc-changes_2018-02-20-17-19.json b/common/changes/office-ui-fabric-react/misc-changes_2018-02-20-17-19.json
deleted file mode 100644
index d76ed12d0b88b..0000000000000
--- a/common/changes/office-ui-fabric-react/misc-changes_2018-02-20-17-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Buttons: moving className lower in the merge list so that it has more precedence than default rules.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/nav-scss2ms-pt1_2018-02-20-20-17.json b/common/changes/office-ui-fabric-react/nav-scss2ms-pt1_2018-02-20-20-17.json
deleted file mode 100644
index 0a9eb4d10f6f0..0000000000000
--- a/common/changes/office-ui-fabric-react/nav-scss2ms-pt1_2018-02-20-20-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Converting Nav SCSS to MergeStyles step 1 - file structure",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/rating-type_2018-02-21-04-05.json b/common/changes/office-ui-fabric-react/rating-type_2018-02-21-04-05.json
deleted file mode 100644
index d2bbaf994f0fe..0000000000000
--- a/common/changes/office-ui-fabric-react/rating-type_2018-02-21-04-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Rating: Adding `type=button` to Rating buttons.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/resizegroup-scss2ms-pt1_2018-02-19-18-39.json b/common/changes/office-ui-fabric-react/resizegroup-scss2ms-pt1_2018-02-19-18-39.json
deleted file mode 100644
index 2e202be423c5a..0000000000000
--- a/common/changes/office-ui-fabric-react/resizegroup-scss2ms-pt1_2018-02-19-18-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Converting ResizeGroup SCSS to MergeStyles step 1 - file structure",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/scrollablepane-scss2ms-pt2_2018-02-17-00-02.json b/common/changes/office-ui-fabric-react/scrollablepane-scss2ms-pt2_2018-02-17-00-02.json
deleted file mode 100644
index 3434a87a0341a..0000000000000
--- a/common/changes/office-ui-fabric-react/scrollablepane-scss2ms-pt2_2018-02-17-00-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Converting SCSS to MergeStyles step 2 - style conversion",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/zhiliu-groupingOp_2018-02-19-19-18.json b/common/changes/office-ui-fabric-react/zhiliu-groupingOp_2018-02-19-19-18.json
deleted file mode 100644
index 0746a1f0dcb2d..0000000000000
--- a/common/changes/office-ui-fabric-react/zhiliu-groupingOp_2018-02-19-19-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "make onShouldVirtualize work for grouped list",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "zhiliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 7dd97650925ab..6f879184f3424 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "5.2.2",
+      "tag": "@uifabric/example-app-base_v5.2.2",
+      "date": "Wed, 21 Feb 2018 11:12:11 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "51d47a80898d9834d40205274268e60730f306a1",
+            "comment": "Tweaking css for example pages."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.12.0 <6.0.0` to `>=5.12.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.2.1",
       "tag": "@uifabric/example-app-base_v5.2.1",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index 5d7c957178263..2b1fa84e4bf2b 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Mon, 22 Jan 2018 11:14:27 GMT and should not be manually modified.
+This log was last generated on Wed, 21 Feb 2018 11:12:11 GMT and should not be manually modified.
+
+## 5.2.2
+Wed, 21 Feb 2018 11:12:11 GMT
+
+### Patches
+
+- Tweaking css for example pages.
 
 ## 5.2.1
 Mon, 22 Jan 2018 11:14:27 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index fffbfacd06429..f4d0c7a124bcb 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "5.2.1",
+  "version": "5.2.2",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.18.1 <6.0.0",
-    "@uifabric/utilities": ">=5.12.0 <6.0.0",
+    "@uifabric/utilities": ">=5.12.1 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 899e7ba84d0c3..ec613b80d0b5f 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -29,7 +29,7 @@
     "@types/enzyme": "3.1.5",
     "@types/enzyme-adapter-react-16": "1.0.1",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=5.2.1 <6.0.0",
+    "@uifabric/example-app-base": ">=5.2.2 <6.0.0",
     "@uifabric/file-type-icons": ">=0.3.0 <1.0.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.1.0 <6.0.0",
     "es6-weak-map": "^2.0.2",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.51.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.53.0 <6.0.0",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/jest-serializer-merge-styles/package.json b/packages/jest-serializer-merge-styles/package.json
index 8017dccb73bc5..923a8c0de1160 100644
--- a/packages/jest-serializer-merge-styles/package.json
+++ b/packages/jest-serializer-merge-styles/package.json
@@ -24,6 +24,6 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/merge-styles": ">=5.12.1 <6.0.0"
+    "@uifabric/merge-styles": ">=5.12.2 <6.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index 41ed5baba24bd..40961ce315edd 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.12.2",
+      "tag": "@uifabric/merge-styles_v5.12.2",
+      "date": "Wed, 21 Feb 2018 11:12:11 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "51d47a80898d9834d40205274268e60730f306a1",
+            "comment": "Adding test coverage for media queries."
+          }
+        ]
+      }
+    },
     {
       "version": "5.12.1",
       "tag": "@uifabric/merge-styles_v5.12.1",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index 7848d728f0576..360e0937b2fff 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Fri, 16 Feb 2018 11:23:29 GMT and should not be manually modified.
+This log was last generated on Wed, 21 Feb 2018 11:12:11 GMT and should not be manually modified.
+
+## 5.12.2
+Wed, 21 Feb 2018 11:12:11 GMT
+
+### Patches
+
+- Adding test coverage for media queries.
 
 ## 5.12.1
 Fri, 16 Feb 2018 11:23:29 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index 875091583a001..e33db84fbf4e5 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.12.1",
+  "version": "5.12.2",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index ddbc814619fbc..0237d1a11c3fd 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,93 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.53.0",
+      "tag": "office-ui-fabric-react_v5.53.0",
+      "date": "Wed, 21 Feb 2018 11:12:11 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "chang47 <coralbue@gmail.com>",
+            "commit": "0a9153f40d3fc7e7757c352862d78de917e22656",
+            "comment": "added support for aria-posinset and aria-setsize"
+          },
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "eaf26188ea91738b3daacc16bb7b426aa60a1e8d",
+            "comment": "Converting Image SCSS to MergeStyles step 1 - file structure"
+          },
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "2e447758c56e5a06fbe22726397e7fea4fc9f65f",
+            "comment": "SwatchColorPicker: Improve keyboard/mouse behavior"
+          },
+          {
+            "author": "Jordan Janzen <jordancjanzen@gmail.com>",
+            "commit": "0037f82fbf63447b60ca73970fc116ad004f7c0e",
+            "comment": "Convert Dialog to mergeStyles, part 1 - file structure"
+          },
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "d6ed496697cb3ee61d7c52c0a04b271fd576f425",
+            "comment": "Converting Nav SCSS to MergeStyles step 1 - file structure"
+          },
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "c168360f1ae7e1a97df1d278552b1b3498c13c28",
+            "comment": "Converting ResizeGroup SCSS to MergeStyles step 1 - file structure"
+          },
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "f899dabeaf57d1f9c6018eb89b46b87835f8ade6",
+            "comment": "Converting SCSS to MergeStyles step 2 - style conversion"
+          },
+          {
+            "author": "jijizz <liu_zhi8@hotmail.com>",
+            "commit": "0661239920ded0ecfce53788322b4bc5b21860e1",
+            "comment": "make onShouldVirtualize work for grouped list"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Mark Polak <mark@thedutchies.com>",
+            "commit": "6d58ab7f983c1cf8b2a93b444edf5d9c6b1b3f52",
+            "comment": "Enable jsx-key tslint rule"
+          },
+          {
+            "author": "Cody Hoover <hoovercj@users.noreply.github.com>",
+            "commit": "6a35693c2cfb692a8adb381ecb228a2e23f801e4",
+            "comment": "Only apply 'pointer-events: none' to disabled Link components if there is an href "
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "4bf99461473d1fb282196c67f82410765a712f10",
+            "comment": "Dialog: default modal props now respective (Modal rendered with light background.)"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "51d47a80898d9834d40205274268e60730f306a1",
+            "comment": "Buttons: moving className lower in the merge list so that it has more precedence than default rules."
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "a5f021f9a60e65b6b2824a588f31cd080fd74ecb",
+            "comment": "Rating: Adding `type=button` to Rating buttons."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.12.1 <6.0.0` to `>=5.12.2 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.12.0 <6.0.0` to `>=5.12.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=5.2.1 <6.0.0` to `>=5.2.2 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.52.0",
       "tag": "office-ui-fabric-react_v5.52.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 3a93d6436271f..f01b13e50bcf4 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,28 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Sat, 17 Feb 2018 21:29:00 GMT and should not be manually modified.
+This log was last generated on Wed, 21 Feb 2018 11:12:11 GMT and should not be manually modified.
+
+## 5.53.0
+Wed, 21 Feb 2018 11:12:11 GMT
+
+### Minor changes
+
+- added support for aria-posinset and aria-setsize
+- Converting Image SCSS to MergeStyles step 1 - file structure
+- SwatchColorPicker: Improve keyboard/mouse behavior
+- Convert Dialog to mergeStyles, part 1 - file structure
+- Converting Nav SCSS to MergeStyles step 1 - file structure
+- Converting ResizeGroup SCSS to MergeStyles step 1 - file structure
+- Converting SCSS to MergeStyles step 2 - style conversion
+- make onShouldVirtualize work for grouped list
+
+### Patches
+
+- Enable jsx-key tslint rule
+- Only apply 'pointer-events: none' to disabled Link components if there is an href 
+- Dialog: default modal props now respective (Modal rendered with light background.)
+- Buttons: moving className lower in the merge list so that it has more precedence than default rules.
+- Rating: Adding `type=button` to Rating buttons.
 
 ## 5.52.0
 Sat, 17 Feb 2018 21:29:00 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 9dc3d175299ed..7056f377c79bb 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.52.0",
+  "version": "5.53.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -30,7 +30,7 @@
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.1.0 <6.0.0",
-    "@uifabric/example-app-base": ">=5.2.1 <6.0.0",
+    "@uifabric/example-app-base": ">=5.2.2 <6.0.0",
     "enzyme": "^3.2.0",
     "enzyme-adapter-react-16": "^1.1.0",
     "es6-promise": "^4.1.0",
@@ -49,9 +49,9 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
-    "@uifabric/merge-styles": ">=5.12.1 <6.0.0",
+    "@uifabric/merge-styles": ">=5.12.2 <6.0.0",
     "@uifabric/styling": ">=5.18.1 <6.0.0",
-    "@uifabric/utilities": ">=5.12.0 <6.0.0",
+    "@uifabric/utilities": ">=5.12.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index c923abebf0e52..ca0eb282ce30b 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -27,8 +27,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.12.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.12.1 <6.0.0",
+    "@uifabric/utilities": ">=5.12.1 <6.0.0",
+    "@uifabric/merge-styles": ">=5.12.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 400a2189c222e..18acdfd099717 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.12.1",
+      "tag": "@uifabric/utilities_v5.12.1",
+      "date": "Wed, 21 Feb 2018 11:12:11 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "jijizz <liu_zhi8@hotmail.com>",
+            "commit": "0661239920ded0ecfce53788322b4bc5b21860e1",
+            "comment": "fix bug in IE that IE does not support Number.IsInteger"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.12.1 <6.0.0` to `>=5.12.2 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.12.0",
       "tag": "@uifabric/utilities_v5.12.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 740dd480558a2..04b94fd625568 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Fri, 16 Feb 2018 11:23:29 GMT and should not be manually modified.
+This log was last generated on Wed, 21 Feb 2018 11:12:11 GMT and should not be manually modified.
+
+## 5.12.1
+Wed, 21 Feb 2018 11:12:11 GMT
+
+### Patches
+
+- fix bug in IE that IE does not support Number.IsInteger
 
 ## 5.12.0
 Fri, 16 Feb 2018 11:23:29 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 57df5b5ca3d16..08c6a4044effc 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.12.0",
+  "version": "5.12.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -36,7 +36,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/merge-styles": ">=5.12.1 <6.0.0",
+    "@uifabric/merge-styles": ">=5.12.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/scripts/package.json b/scripts/package.json
index 2f4792aea6422..c1cd1387bd3e3 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -11,7 +11,7 @@
     "@microsoft/api-extractor": "^4.2.6",
     "@microsoft/load-themed-styles": "^1.7.13",
     "@microsoft/loader-load-themed-styles": "^1.6.0",
-    "@uifabric/merge-styles": ">=5.12.1 <6.0.0",
+    "@uifabric/merge-styles": ">=5.12.2 <6.0.0",
     "autoprefixer": "^7.1.5",
     "awesome-typescript-loader": "^3.2.3",
     "bundlesize": "^0.15.2",

From a40160db28a702c2bacb1cb7c147b150c59b7a9c Mon Sep 17 00:00:00 2001
From: davsm <36288536+davsm@users.noreply.github.com>
Date: Wed, 21 Feb 2018 12:09:12 -0800
Subject: [PATCH 1414/1641] scrollable pane null ref check to resolve "Failed
 to execute 'getComputedStyle' on 'Window'" bug (#4039)

* Checking this.refs.root for undefined before calling getComputedStyle(root) in _resizeContainer

* adding change file

* clarifying comment

* Cancelling timers during componentWillUnmount to avoid using unmounted refs

* updating comment

* updated to use _async.setTimeout

* updating comment
---
 ...rollable-pane-null-ref-check_2018-02-20-22-39.json | 11 +++++++++++
 .../components/ScrollablePane/ScrollablePane.base.tsx |  6 +++---
 2 files changed, 14 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/davsm.scrollable-pane-null-ref-check_2018-02-20-22-39.json

diff --git a/common/changes/office-ui-fabric-react/davsm.scrollable-pane-null-ref-check_2018-02-20-22-39.json b/common/changes/office-ui-fabric-react/davsm.scrollable-pane-null-ref-check_2018-02-20-22-39.json
new file mode 100644
index 0000000000000..1250c6e43a823
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/davsm.scrollable-pane-null-ref-check_2018-02-20-22-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix Scrollable-Pane getComputedStyle error - changing timeouts to use this._async.setTimeout to ensure this.refs isn't used after componentWillUnmount",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "davsm@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
index fba8e5fd19763..531f3eb2598a5 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
@@ -66,7 +66,7 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
 
     this._events.on(root, 'scroll', this.notifySubscribers);
     this._events.on(window, 'resize', this._onWindowResize);
-    setTimeout(() => {
+    this._async.setTimeout(() => {
       this._resizeContainer();
       if (stickyContainer.parentElement && root.parentElement) {
         stickyContainer.parentElement.removeChild(stickyContainer);
@@ -171,7 +171,7 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
         this._setPlaceholderHeights.bind(null, stickyList),
         false);
       if (sticky.props.stickyClassName) {
-        setTimeout(() => {
+        this._async.setTimeout(() => {
           if (sticky.props.stickyClassName) {
             sticky.content.children[0].classList.add(sticky.props.stickyClassName);
           }
@@ -191,7 +191,7 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
   }
 
   private _onWindowResize() {
-    setTimeout(() => {
+    this._async.setTimeout(() => {
       this._resizeContainer();
       this.notifySubscribers();
       this._setPlaceholderHeights(this._stickyAbove);

From 3cf846061686c05dbc2329aa16596c9be206ded1 Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Wed, 21 Feb 2018 14:43:39 -0800
Subject: [PATCH 1415/1641] Layer SCSS to MergeStyles (#3979)

Convert Layer component to mergeStyles
---
 .../layer-scss2ms_2018-02-14-22-55.json       |  11 ++
 .../ContextualMenu/ContextualMenu.test.tsx    |   2 +-
 .../src/components/Layer/Layer.base.tsx       | 178 ++++++++++++++++++
 .../src/components/Layer/Layer.scss           |  13 --
 .../src/components/Layer/Layer.styles.ts      |  42 +++++
 .../src/components/Layer/Layer.tsx            | 172 ++---------------
 .../src/components/Layer/Layer.types.ts       |  50 ++++-
 .../src/components/Layer/LayerHost.tsx        |   8 +-
 .../Layer/examples/Layer.Basic.Example.tsx    |   7 +-
 .../Layer/examples/Layer.Hosted.Example.tsx   |  39 +++-
 10 files changed, 333 insertions(+), 189 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/layer-scss2ms_2018-02-14-22-55.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Layer/Layer.base.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/components/Layer/Layer.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/Layer/Layer.styles.ts

diff --git a/common/changes/office-ui-fabric-react/layer-scss2ms_2018-02-14-22-55.json b/common/changes/office-ui-fabric-react/layer-scss2ms_2018-02-14-22-55.json
new file mode 100644
index 0000000000000..60e9c25fa5bf0
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/layer-scss2ms_2018-02-14-22-55.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Convert Layer component to mergeStyles",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
index ea64faa7cf7f8..57d37f382db25 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
@@ -10,7 +10,7 @@ import { FocusZoneDirection } from '../../FocusZone';
 
 import { ContextualMenu, canAnyMenuItemsCheck } from './ContextualMenu';
 import { IContextualMenuItem, ContextualMenuItemType } from './ContextualMenu.types';
-import { Layer } from '../Layer/Layer';
+import { LayerBase as Layer } from '../Layer/Layer.base';
 import { mount } from 'enzyme';
 
 describe('ContextualMenu', () => {
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.base.tsx b/packages/office-ui-fabric-react/src/components/Layer/Layer.base.tsx
new file mode 100644
index 0000000000000..c37fc26bde052
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.base.tsx
@@ -0,0 +1,178 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+/* tslint:enable:no-unused-variable */
+
+import { Fabric } from '../../Fabric';
+import {
+  ILayerProps,
+  ILayerStyleProps,
+  ILayerStyles,
+} from './Layer.types';
+import {
+  css,
+  BaseComponent,
+  classNamesFunction,
+  customizable,
+  getDocument,
+  setVirtualParent
+} from '../../Utilities';
+
+const _layersByHostId: { [hostId: string]: LayerBase[] } = {};
+let _defaultHostSelector: string | undefined;
+
+const getClassNames = classNamesFunction<ILayerStyleProps, ILayerStyles>();
+
+// @customizable('Layer', ['theme'])
+export class LayerBase extends BaseComponent<ILayerProps, {}> {
+
+  public static defaultProps: ILayerProps = {
+    onLayerDidMount: () => undefined,
+    onLayerWillUnmount: () => undefined
+  };
+
+  private _rootElement: HTMLElement;
+  private _host: Node;
+  private _layerElement: HTMLElement | undefined;
+  private _hasMounted: boolean;
+  /**
+   * Used for notifying applicable Layers that a host is available/unavailable and to re-evaluate Layers that
+   * care about the specific host.
+   */
+  public static notifyHostChanged(id: string) {
+    if (_layersByHostId[id]) {
+      _layersByHostId[id].forEach(layer => layer.forceUpdate());
+    }
+  }
+
+  /**
+   * Sets the default target selector to use when determining the host in which
+   * Layered content will be injected into. If not provided, an element will be
+   * created at the end of the document body.
+   *
+   * Passing in a falsey value will clear the default target and reset back to
+   * using a created element at the end of document body.
+   */
+  public static setDefaultTarget(selector?: string) {
+    _defaultHostSelector = selector;
+  }
+
+  constructor(props: ILayerProps) {
+    super(props);
+
+    this._warnDeprecations({
+      onLayerMounted: 'onLayerDidMount'
+    });
+
+    if (this.props.hostId) {
+      if (!_layersByHostId[this.props.hostId]) {
+        _layersByHostId[this.props.hostId] = [];
+      }
+
+      _layersByHostId[this.props.hostId].push(this);
+    }
+  }
+
+  public componentDidMount() {
+    this.componentDidUpdate();
+  }
+
+  public componentWillUnmount() {
+    this._removeLayerElement();
+
+    if (this.props.hostId) {
+      _layersByHostId[this.props.hostId] = _layersByHostId[this.props.hostId].filter(layer => layer !== this);
+      if (!_layersByHostId[this.props.hostId].length) {
+        delete _layersByHostId[this.props.hostId];
+      }
+    }
+  }
+
+  public componentDidUpdate() {
+    const host = this._getHost();
+
+    const { className, getStyles, theme } = this.props;
+    const classNames = getClassNames(getStyles!,
+      {
+        theme: theme!,
+        className,
+        isNotHost: !this.props.hostId
+      }
+    );
+
+    if (host !== this._host) {
+      this._removeLayerElement();
+    }
+
+    if (host) {
+      this._host = host;
+
+      if (!this._layerElement) {
+        const doc = getDocument(this._rootElement) as Document;
+
+        this._layerElement = doc.createElement('div');
+        this._layerElement.className = classNames.root;
+
+        host.appendChild(this._layerElement);
+        setVirtualParent(this._layerElement, this._rootElement);
+      }
+
+      // Using this 'unstable' method allows us to retain the React context across the layer projection.
+      ReactDOM.unstable_renderSubtreeIntoContainer(
+        this,
+        (
+          <Fabric className={ classNames.content }>
+            { this.props.children }
+          </Fabric>
+        ),
+        this._layerElement,
+        () => {
+          if (!this._hasMounted) {
+            this._hasMounted = true;
+
+            // TODO: @deprecated cleanup required.
+            if (this.props.onLayerMounted) {
+              this.props.onLayerMounted();
+            }
+
+            this.props.onLayerDidMount!();
+          }
+        });
+    }
+  }
+
+  public render() {
+    return (
+      <span
+        className='ms-Layer'
+        ref={ this._resolveRef('_rootElement') }
+      />
+    );
+  }
+
+  private _removeLayerElement() {
+    if (this._layerElement) {
+      this.props.onLayerWillUnmount!();
+
+      ReactDOM.unmountComponentAtNode(this._layerElement);
+      const parentNode = this._layerElement.parentNode;
+      if (parentNode) {
+        parentNode.removeChild(this._layerElement);
+      }
+      this._layerElement = undefined;
+      this._hasMounted = false;
+    }
+  }
+
+  private _getHost(): Node {
+    const { hostId } = this.props;
+    const doc = getDocument(this._rootElement) as Document;
+
+    if (hostId) {
+      return doc.getElementById(hostId) as Node;
+    } else {
+      return _defaultHostSelector ? doc.querySelector(_defaultHostSelector) as Node : doc.body;
+    }
+  }
+
+}
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.scss b/packages/office-ui-fabric-react/src/components/Layer/Layer.scss
deleted file mode 100644
index f09d8c521d96e..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Layer/Layer.scss
+++ /dev/null
@@ -1,13 +0,0 @@
-.rootIsFixed {
-  position: fixed;
-  z-index: 1000000;
-  top: 0;
-  left: 0;
-  width: 100vw;
-  height: 100vh;
-  visibility: hidden;
-}
-
-.content {
-  visibility: visible;
-}
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.styles.ts b/packages/office-ui-fabric-react/src/components/Layer/Layer.styles.ts
new file mode 100644
index 0000000000000..47ba53723ec2b
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.styles.ts
@@ -0,0 +1,42 @@
+import { ILayerStyleProps, ILayerStyles } from './Layer.types';
+import {
+  IStyle,
+  ITheme,
+} from '../../Styling';
+
+export const getStyles = (
+  props: ILayerStyleProps
+): ILayerStyles => {
+  const {
+    className,
+    theme,
+    isNotHost
+  } = props;
+
+  // const { palette, semanticColors } = theme;
+
+  return ({
+    root: [
+      'ms-Layer',
+      isNotHost && [
+        'ms-Layer--fixed',
+        {
+          position: 'fixed',
+          zIndex: 1000000,
+          top: 0,
+          left: 0,
+          width: '100vw',
+          height: '100vh',
+          visibility: 'hidden'
+        }
+      ],
+      className
+    ],
+    content: [
+      'ms-Layer-content',
+      {
+        visibility: 'visible'
+      }
+    ]
+  });
+};
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx b/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx
index 4fc3473b10318..0cdd7535ca9dc 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.tsx
@@ -1,159 +1,13 @@
-/* tslint:disable:no-unused-variable */
-import * as React from 'react';
-import * as ReactDOM from 'react-dom';
-/* tslint:enable:no-unused-variable */
-
-import { Fabric } from '../../Fabric';
-import { ILayerProps } from './Layer.types';
-import { css, BaseComponent, getDocument, setVirtualParent } from '../../Utilities';
-import * as stylesImport from './Layer.scss';
-const styles: any = stylesImport;
-
-const _layersByHostId: { [hostId: string]: Layer[] } = {};
-let _defaultHostSelector: string | undefined;
-
-export class Layer extends BaseComponent<ILayerProps, {}> {
-
-  public static defaultProps: ILayerProps = {
-    onLayerDidMount: () => undefined,
-    onLayerWillUnmount: () => undefined
-  };
-
-  private _rootElement: HTMLElement;
-  private _host: Node;
-  private _layerElement: HTMLElement | undefined;
-  private _hasMounted: boolean;
-  /**
-   * Used for notifying applicable Layers that a host is available/unavailable and to re-evaluate Layers that
-   * care about the specific host.
-   */
-  public static notifyHostChanged(id: string) {
-    if (_layersByHostId[id]) {
-      _layersByHostId[id].forEach(layer => layer.forceUpdate());
-    }
-  }
-
-  /**
-   * Sets the default target selector to use when determining the host in which
-   * Layered content will be injected into. If not provided, an element will be
-   * created at the end of the document body.
-   *
-   * Passing in a falsey value will clear the default target and reset back to
-   * using a created element at the end of document body.
-   */
-  public static setDefaultTarget(selector?: string) {
-    _defaultHostSelector = selector;
-  }
-
-  constructor(props: ILayerProps) {
-    super(props);
-
-    this._warnDeprecations({
-      onLayerMounted: 'onLayerDidMount'
-    });
-
-    if (this.props.hostId) {
-      if (!_layersByHostId[this.props.hostId]) {
-        _layersByHostId[this.props.hostId] = [];
-      }
-
-      _layersByHostId[this.props.hostId].push(this);
-    }
-  }
-
-  public componentDidMount() {
-    this.componentDidUpdate();
-  }
-
-  public componentWillUnmount() {
-    this._removeLayerElement();
-
-    if (this.props.hostId) {
-      _layersByHostId[this.props.hostId] = _layersByHostId[this.props.hostId].filter(layer => layer !== this);
-      if (!_layersByHostId[this.props.hostId].length) {
-        delete _layersByHostId[this.props.hostId];
-      }
-    }
-  }
-
-  public componentDidUpdate() {
-    const host = this._getHost();
-
-    if (host !== this._host) {
-      this._removeLayerElement();
-    }
-
-    if (host) {
-      this._host = host;
-
-      if (!this._layerElement) {
-        const doc = getDocument(this._rootElement) as Document;
-
-        this._layerElement = doc.createElement('div');
-        this._layerElement.className = css('ms-Layer', {
-          ['ms-Layer--fixed ' + styles.rootIsFixed]: !this.props.hostId
-        });
-
-        host.appendChild(this._layerElement);
-        setVirtualParent(this._layerElement, this._rootElement);
-      }
-
-      // Using this 'unstable' method allows us to retain the React context across the layer projection.
-      ReactDOM.unstable_renderSubtreeIntoContainer(
-        this,
-        (
-          <Fabric className={ css('ms-Layer-content', styles.content) }>
-            { this.props.children }
-          </Fabric>
-        ),
-        this._layerElement,
-        () => {
-          if (!this._hasMounted) {
-            this._hasMounted = true;
-
-            // TODO: @deprecated cleanup required.
-            if (this.props.onLayerMounted) {
-              this.props.onLayerMounted();
-            }
-
-            this.props.onLayerDidMount!();
-          }
-        });
-    }
-  }
-
-  public render() {
-    return (
-      <span
-        className='ms-Layer'
-        ref={ this._resolveRef('_rootElement') }
-      />
-    );
-  }
-
-  private _removeLayerElement() {
-    if (this._layerElement) {
-      this.props.onLayerWillUnmount!();
-
-      ReactDOM.unmountComponentAtNode(this._layerElement);
-      const parentNode = this._layerElement.parentNode;
-      if (parentNode) {
-        parentNode.removeChild(this._layerElement);
-      }
-      this._layerElement = undefined;
-      this._hasMounted = false;
-    }
-  }
-
-  private _getHost(): Node {
-    const { hostId } = this.props;
-    const doc = getDocument(this._rootElement) as Document;
-
-    if (hostId) {
-      return doc.getElementById(hostId) as Node;
-    } else {
-      return _defaultHostSelector ? doc.querySelector(_defaultHostSelector) as Node : doc.body;
-    }
-  }
-
-}
+import { styled } from '../../Utilities';
+import {
+  ILayerProps,
+  ILayerStyleProps,
+  ILayerStyles
+} from './Layer.types';
+import { LayerBase } from './Layer.base';
+import { getStyles } from './Layer.styles';
+
+export const Layer = styled<ILayerProps, ILayerStyleProps, ILayerStyles>(
+  LayerBase,
+  getStyles
+);
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.types.ts b/packages/office-ui-fabric-react/src/components/Layer/Layer.types.ts
index fb6f36842cef0..7b4151727ecdf 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/Layer.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.types.ts
@@ -1,17 +1,35 @@
 import * as React from 'react';
-import { Layer } from './Layer';
+import { LayerBase } from './Layer.base';
+import { IStyle, ITheme } from '../../Styling';
+import { IStyleFunction } from '../../Utilities';
 
 export interface ILayer {
 
 }
 
-export interface ILayerProps extends React.HTMLAttributes<HTMLDivElement | Layer> {
+export interface ILayerProps extends React.HTMLAttributes<HTMLDivElement | LayerBase> {
   /**
    * Optional callback to access the ILayer interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
   componentRef?: (component: ILayer) => void;
 
+  /**
+   * Call to provide customized styling that will layer on top of the variant rules
+   */
+  getStyles?: IStyleFunction<ILayerStyleProps, ILayerStyles>;
+
+  /**
+   * Theme provided by HOC.
+   */
+  theme?: ITheme;
+
+  /**
+   * Additional css class to apply to the Layer
+   * @defaultvalue undefined
+   */
+  className?: string;
+
   /** Callback for when the layer is mounted. */
   onLayerMounted?: () => void;
 
@@ -33,3 +51,31 @@ export interface ILayerProps extends React.HTMLAttributes<HTMLDivElement | Layer
    */
   hostId?: string;
 }
+
+export interface ILayerStyleProps {
+  /**
+   * Accept theme prop.
+   */
+  theme: ITheme;
+
+  /**
+   * Accept custom classNames
+   */
+  className?: string;
+
+  /**
+   * Check if Host
+  */
+  isNotHost?: boolean;
+}
+
+export interface ILayerStyles {
+  /**
+   * Style for the root element when fixed.
+   */
+  root?: IStyle;
+  /**
+   * Style for the Fabric component.
+   */
+  content?: IStyle;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Layer/LayerHost.tsx b/packages/office-ui-fabric-react/src/components/Layer/LayerHost.tsx
index 39e65356ab1c2..054c08096c93d 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/LayerHost.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/LayerHost.tsx
@@ -3,9 +3,7 @@ import {
   BaseComponent,
   css
 } from '../../Utilities';
-import {
-  Layer
-} from './Layer';
+import { LayerBase } from './Layer.base';
 import { ILayerHostProps } from './LayerHost.types';
 
 export class LayerHost extends BaseComponent<ILayerHostProps, {}> {
@@ -15,11 +13,11 @@ export class LayerHost extends BaseComponent<ILayerHostProps, {}> {
   }
 
   public componentDidMount() {
-    Layer.notifyHostChanged(this.props.id!);
+    LayerBase.notifyHostChanged(this.props.id!);
   }
 
   public componentWillUnmount() {
-    Layer.notifyHostChanged(this.props.id!);
+    LayerBase.notifyHostChanged(this.props.id!);
   }
 
   public render() {
diff --git a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
index a8cc8e746fa6b..3a0c18741663c 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
@@ -2,10 +2,9 @@ import * as React from 'react'; // tslint:disable-line:no-unused-variable
 import * as PropTypes from 'prop-types';
 import './Layer.Example.scss';
 import '../../../common/_exampleStyles.scss';
-import { BaseComponent } from 'office-ui-fabric-react/lib/Utilities';
-import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
-import { Layer } from 'office-ui-fabric-react/lib/Layer';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { autobind, BaseComponent } from '../../../Utilities';
+import { Checkbox } from '../../../Checkbox';
+import { Layer } from '../Layer';
 import { AnimationClassNames } from '../../../Styling';
 import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
 const exampleStyles: any = exampleStylesImport;
diff --git a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
index 27ac832ece392..e166d97068141 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
@@ -1,8 +1,9 @@
 import * as React from 'react';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
-import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
-import { Layer, LayerHost } from 'office-ui-fabric-react/lib/Layer';
-import { Toggle } from 'office-ui-fabric-react/lib/Toggle';
+import { autobind } from '../../../Utilities';
+import { Checkbox } from '../../../Checkbox';
+import { Layer } from '../Layer';
+import { LayerHost } from '../LayerHost';
+import { Toggle } from '../../../Toggle';
 import { AnimationClassNames } from '../../../Styling';
 import './Layer.Example.scss';
 import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
@@ -10,6 +11,7 @@ const exampleStyles: any = exampleStylesImport;
 
 export class LayerHostedExample extends React.Component<{}, {
   showLayer: boolean;
+  showLayerNoId: boolean;
   showHost: boolean;
 }> {
 
@@ -17,12 +19,13 @@ export class LayerHostedExample extends React.Component<{}, {
     super(props);
     this.state = {
       showLayer: false,
+      showLayerNoId: false,
       showHost: true
     };
   }
 
   public render() {
-    const { showLayer, showHost } = this.state;
+    const { showLayer, showLayerNoId, showHost } = this.state;
     const content = (
       <div className={ 'LayerExample-content ' + AnimationClassNames.scaleUpIn100 } >
         This is example layer content.
@@ -57,6 +60,7 @@ export class LayerHostedExample extends React.Component<{}, {
             hostId='layerhost1'
             onLayerDidMount={ this._log('didmount') }
             onLayerWillUnmount={ this._log('willunmount') }
+            className={ 'exampleLayerClassName' }
           >
             { content }
           </Layer>
@@ -64,6 +68,26 @@ export class LayerHostedExample extends React.Component<{}, {
 
         <div className='LayerExample-nonLayered'>I am normally below the content.</div>
 
+        <p>
+          If you do not specify a hostId then the hosted layer will default to being fixed to the page by default.
+        </p>
+
+        <Checkbox
+          className={ exampleStyles.exampleCheckbox }
+          label='Render the box below in a Layer without specifying a host, fixing it to the top of the page'
+          checked={ showLayerNoId }
+          onChange={ this._onChangeCheckboxNoId }
+        />
+
+        { showLayerNoId ? (
+          <Layer
+            onLayerDidMount={ this._log('didmount') }
+            onLayerWillUnmount={ this._log('willunmount') }
+          >
+            { content }
+          </Layer>
+        ) : content }
+
       </div>
     );
   }
@@ -79,6 +103,11 @@ export class LayerHostedExample extends React.Component<{}, {
     this.setState({ showLayer: checked });
   }
 
+  @autobind
+  private _onChangeCheckboxNoId(ev: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean): void {
+    this.setState({ showLayerNoId: checked });
+  }
+
   @autobind
   private _onChangeToggle(checked: boolean): void {
     this.setState({ showHost: checked });

From 4b74ee848acc55a619b99a2b1b08be90f5127149 Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Wed, 21 Feb 2018 14:44:39 -0800
Subject: [PATCH 1416/1641] Nav SCSS to MergeStyles Part 2: Style Conversion
 (#4056)

Converting SCSS to MergeStyles step 2 - style conversion
---
 .../nav-scss2ms-pt2_2018-02-21-20-05.json     |  11 +
 .../src/components/Nav/Nav.base.tsx           | 142 +++++-------
 .../src/components/Nav/Nav.scss               | 196 ----------------
 .../src/components/Nav/Nav.styles.ts          | 217 +++++++++++++++++-
 .../src/components/Nav/Nav.types.ts           | 113 ++++++++-
 .../Nav/__snapshots__/Nav.test.tsx.snap       |  78 +++++--
 6 files changed, 462 insertions(+), 295 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/nav-scss2ms-pt2_2018-02-21-20-05.json
 delete mode 100644 packages/office-ui-fabric-react/src/components/Nav/Nav.scss

diff --git a/common/changes/office-ui-fabric-react/nav-scss2ms-pt2_2018-02-21-20-05.json b/common/changes/office-ui-fabric-react/nav-scss2ms-pt2_2018-02-21-20-05.json
new file mode 100644
index 0000000000000..3434a87a0341a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/nav-scss2ms-pt2_2018-02-21-20-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Converting SCSS to MergeStyles step 2 - style conversion",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
index da9be9817ab85..56292b2c6f85a 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
@@ -2,22 +2,22 @@ import * as React from 'react';
 import {
   autobind,
   BaseComponent,
-  css,
+  classNamesFunction,
+  customizable,
   divProperties,
-  getNativeProps,
-  getRTL
+  getNativeProps
 } from '../../Utilities';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
-import { ActionButton, IButtonStyles } from '../../Button';
+import { ActionButton } from '../../Button';
 import { Icon } from '../../Icon';
-import * as stylesImport from './Nav.scss';
-const styles: any = stylesImport;
-import { AnimationClassNames, mergeStyles } from '../../Styling';
+import { buttonStyles } from './Nav.styles';
 import {
   INav,
   INavProps,
   INavLinkGroup,
-  INavLink
+  INavLink,
+  INavStyles,
+  INavStyleProps
 } from './Nav.types';
 
 // The number pixels per indentation level for Nav links.
@@ -26,9 +26,6 @@ const _indentationSize: number = 14;
 // The number of pixels of left margin
 const _baseIndent: number = 3;
 
-// The number of pixels of padding to add to the far side of the button (allows ellipsis to happen)
-const _farSidePadding: number = 20;
-
 // global var used in _isLinkSelectedKey
 let _urlResolver: HTMLAnchorElement | undefined;
 
@@ -37,12 +34,15 @@ export function isRelativeUrl(url: string): boolean {
   return !!url && !/^[a-z0-9+-.]:\/\//i.test(url);
 }
 
+const getClassNames = classNamesFunction<INavStyleProps, INavStyles>();
+
 export interface INavState {
   isGroupCollapsed?: { [key: string]: boolean };
   isLinkExpandStateChanged?: boolean;
   selectedKey?: string;
 }
 
+@customizable('Nav', ['theme'])
 export class NavBase extends BaseComponent<INavProps, INavState> implements INav {
 
   public static defaultProps: INavProps = {
@@ -93,7 +93,7 @@ export class NavBase extends BaseComponent<INavProps, INavState> implements INav
   }
 
   public render(): JSX.Element | null {
-    const { groups, className, isOnTop } = this.props;
+    const { getStyles, groups, className, isOnTop, theme } = this.props;
 
     if (!groups) {
       return null;
@@ -109,16 +109,13 @@ export class NavBase extends BaseComponent<INavProps, INavState> implements INav
 
     const groupElements: React.ReactElement<{}>[] = groups.map(this._renderGroup);
 
+    const classNames = getClassNames(getStyles!, { theme: theme!, className, isOnTop, groups });
+
     return (
       <FocusZone direction={ FocusZoneDirection.vertical }>
         <nav
           role='navigation'
-          className={ css(
-            'ms-Nav',
-            styles.root,
-            className,
-            isOnTop && css('is-onTop', styles.rootIsOnTop, AnimationClassNames.slideRightIn40)
-          ) }
+          className={ classNames.root }
         >
           { groupElements }
         </nav>
@@ -130,43 +127,35 @@ export class NavBase extends BaseComponent<INavProps, INavState> implements INav
     return this.state.selectedKey;
   }
 
+  @autobind
   private _onRenderLink(link: INavLink) {
-    return (<div className={ css('ms-Nav-linkText', styles.linkText) }>{ link.name }</div>);
+    const { getStyles, groups, theme } = this.props;
+    const classNames = getClassNames(getStyles!, { theme: theme!, groups });
+    return (<div className={ classNames.linkText }>{ link.name }</div>);
   }
 
   private _renderNavLink(link: INavLink, linkIndex: number, nestingLevel: number) {
-    const isRtl: boolean = getRTL();
-    const paddingBefore = _indentationSize * nestingLevel + _baseIndent;
-    const buttonStyles: IButtonStyles = {
-      root: {
-        [isRtl ? 'paddingRight' : 'paddingLeft']: paddingBefore,
-        [isRtl ? 'paddingLeft' : 'paddingRight']: _farSidePadding,
-      },
-      textContainer: {
-        overflow: 'hidden',
-      },
-      label: {
-        whiteSpace: 'nowrap',
-        textOverflow: 'ellipsis',
-        overflow: 'hidden',
-        lineHeight: '36px'
-      }
-    };
     const {
+      getStyles,
+      groups,
+      theme,
       onRenderLink = this._onRenderLink
     } = this.props;
 
+    const classNames = getClassNames(getStyles!, {
+      theme: theme!,
+      isSelected: this._isLinkSelected(link),
+      isButtonEntry: link.onClick && !link.forceAnchor,
+      leftPadding: _indentationSize * nestingLevel + _baseIndent,
+      groups
+    });
+
     // Prevent hijacking of the parent window if link.target is defined
     const rel = link.url && link.target && !isRelativeUrl(link.url) ? 'noopener noreferrer' : undefined;
 
     return (
       <ActionButton
-        className={ mergeStyles(
-          'ms-Nav-link' + link.onClick && 'ms-Nav-linkButton',
-          styles.link,
-          link.onClick && !link.forceAnchor && styles.buttonEntry,
-          this._hasExpandButton && 'isOnExpanded') as string
-        }
+        className={ classNames.link }
         styles={ buttonStyles }
         href={ link.url || (link.forceAnchor ? 'javascript:' : undefined) }
         iconProps={ { iconName: link.icon || '' } }
@@ -182,42 +171,31 @@ export class NavBase extends BaseComponent<INavProps, INavState> implements INav
   }
 
   private _renderCompositeLink(link: INavLink, linkIndex: number, nestingLevel: number): React.ReactElement<{}> {
-    const isLinkSelected: boolean = this._isLinkSelected(link);
-    const isRtl: boolean = getRTL();
-    const absolutePositionString = `${_indentationSize * nestingLevel + 1}px`;
+    const { getStyles, groups, theme } = this.props;
+    const classNames = getClassNames(getStyles!, {
+      theme: theme!,
+      isExpanded: !!link.isExpanded,
+      isSelected: this._isLinkSelected(link),
+      isLink: true,
+      position: _indentationSize * nestingLevel + 1,
+      groups
+    });
 
     return (
       <div
         { ...getNativeProps(link, divProperties) }
         key={ link.key || linkIndex }
-        className={ css(
-          'ms-Nav-compositeLink',
-          styles.compositeLink,
-          !!link.isExpanded && 'is-expanded',
-          isLinkSelected && 'is-selected',
-          !!link.isExpanded && styles.compositeLinkIsExpanded,
-          isLinkSelected && styles.compositeLinkIsSelected
-        ) }
+        className={ classNames.compositeLink }
       >
         { (link.links && link.links.length > 0 ?
           <button
-            className={ mergeStyles(
-              'ms-Nav-chevronButton ms-Nav-chevronButton--link',
-              styles.chevronButton,
-              styles.chevronButtonLink,
-              isRtl && {
-                right: absolutePositionString,
-              },
-              !isRtl && {
-                left: absolutePositionString,
-              }) as string
-            }
+            className={ classNames.chevronButton }
             onClick={ this._onLinkExpandClicked.bind(this, link) }
             aria-label={ this.props.expandButtonAriaLabel }
             aria-expanded={ link.isExpanded ? 'true' : 'false' }
           >
             <Icon
-              className={ css('ms-Nav-chevron', styles.chevronIcon, link.isExpanded) }
+              className={ classNames.chevronIcon }
               iconName='ChevronDown'
             />
           </button> : null
@@ -228,8 +206,11 @@ export class NavBase extends BaseComponent<INavProps, INavState> implements INav
   }
 
   private _renderLink(link: INavLink, linkIndex: number, nestingLevel: number): React.ReactElement<{}> {
+    const { getStyles, groups, theme } = this.props;
+    const classNames = getClassNames(getStyles!, { theme: theme!, groups });
+
     return (
-      <li key={ link.key || linkIndex } role='listitem' className={ css(styles.navItem) }>
+      <li key={ link.key || linkIndex } role='listitem' className={ classNames.navItem }>
         { this._renderCompositeLink(link, linkIndex, nestingLevel) }
         { (link.isExpanded ? this._renderLinks(link.links, ++nestingLevel) : null) }
       </li>
@@ -243,8 +224,11 @@ export class NavBase extends BaseComponent<INavProps, INavState> implements INav
     const linkElements: React.ReactElement<{}>[] = links.map(
       (link: INavLink, linkIndex: number) => this._renderLink(link, linkIndex, nestingLevel));
 
+    const { getStyles, groups, theme } = this.props;
+    const classNames = getClassNames(getStyles!, { theme: theme!, groups });
+
     return (
-      <ul role='list' aria-label={ this.props.ariaLabel } className={ css(styles.navItems) }>
+      <ul role='list' aria-label={ this.props.ariaLabel } className={ classNames.navItems }>
         { linkElements }
       </ul>
     );
@@ -252,34 +236,32 @@ export class NavBase extends BaseComponent<INavProps, INavState> implements INav
 
   @autobind
   private _renderGroup(group: INavLinkGroup, groupIndex: number): React.ReactElement<{}> {
-    const isGroupExpanded: boolean = !this.state.isGroupCollapsed![group.name!];
+    const { getStyles, groups, theme } = this.props;
+    const classNames = getClassNames(getStyles!, {
+      theme: theme!,
+      isGroup: true,
+      isExpanded: !this.state.isGroupCollapsed![group.name!],
+      groups
+    });
 
     return (
       <div
         key={ groupIndex }
-        className={ css(
-          'ms-Nav-group',
-          styles.group,
-          isGroupExpanded && ('is-expanded ' + styles.groupIsExpanded)
-        ) }
+        className={ classNames.group }
       >
         { (group.name ?
           <button
-            className={ css('ms-Nav-chevronButton ms-Nav-chevronButton--group ms-Nav-groupHeaderFontSize', styles.chevronButton, styles.chevronButtonIsGroup, styles.groupHeaderFontSize) }
+            className={ classNames.chevronButton }
             onClick={ this._onGroupHeaderClicked.bind(this, group) }
           >
             <Icon
-              className={ css(
-                'ms-Nav-chevron',
-                styles.chevronIcon,
-                isGroupExpanded && styles.chevronIsExpanded
-              ) }
+              className={ classNames.chevronIcon }
               iconName='ChevronDown'
             />
             { group.name }
           </button> : null)
         }
-        <div className={ css('ms-Nav-groupContent', AnimationClassNames.slideDownIn20, styles.groupContent) }>
+        <div className={ classNames.groupContent }>
           { this._renderLinks(group.links, 0 /* nestingLevel */) }
         </div>
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.scss b/packages/office-ui-fabric-react/src/components/Nav/Nav.scss
deleted file mode 100644
index 8095e4a0383ee..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.scss
+++ /dev/null
@@ -1,196 +0,0 @@
-@import '../../common/common';
-
-$navnode-height: 36px;
-$hasExpandButtonLinkLeftPadding: 28px;
-$noExpandButtonLinkLeftPadding: 20px;
-$linkRightPadding: 20px;
-
-.root {
-  overflow-y: auto;
-  -webkit-overflow-scrolling: touch;
-  user-select: none;
-}
-
-.rootIsOnTop {
-  position: absolute;
-}
-
-.navItems {
-  list-style-type: none;
-}
-
-.navItems,
-.navItems > .navItem {
-  padding: 0;
-}
-
-.groupContent {
-  display: none;
-  margin-bottom: 40px;
-}
-
-.group.groupIsExpanded .groupContent {
-  display: block;
-}
-
-.icon {
-  padding: 0px;
-  color: $ms-color-neutralPrimary;
-  background: $ms-color-neutralLighter;
-  transition: transform .1s linear;
-}
-
-.iconLink {
-  @include ms-margin-right(4px);
-}
-
-.chevronButton {
-  display: block;
-
-  font-weight: $ms-font-weight-regular;
-  font-size: $ms-font-size-s;
-
-  @include text-align(left);
-  line-height: $navnode-height;
-  margin: 5px 0;
-  @include padding(0px, $linkRightPadding, 0px, $hasExpandButtonLinkLeftPadding);
-  background: none;
-  border: none;
-
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  overflow: hidden;
-
-  cursor: pointer;
-
-  color: $bodyTextColor;
-  background: $bodyBackgroundColor;
-
-  &:visited {
-    color: inherit;
-  }
-
-  &:hover {
-    color: $bodyTextColor;
-    background: $ms-color-neutralLighterAlt;
-  }
-
-  &.chevronButtonIsGroup {
-    width: 100%;
-    height: $navnode-height;
-    border-bottom: 1px solid $bodyDividerColor;
-  }
-}
-
-.chevronIcon {
-  position: absolute;
-  @include ms-left(8px);
-  height: $navnode-height;
-  line-height: $navnode-height;
-  font-size: 12px;
-  transition: transform .1s linear;
-}
-
-.chevronIsExpanded {
-  transform: rotate(-180deg);
-}
-
-.linkText {
-  margin: 0 4px;
-  overflow: hidden;
-  vertical-align: middle;
-  text-overflow: ellipsis;
-}
-
-.compositeLink {
-  display: block;
-  position: relative;
-
-  .chevronButton.chevronButtonLink {
-    display: block;
-    width: $hasExpandButtonLinkLeftPadding - 2;
-    height: $navnode-height - 2;
-    position: absolute;
-    top: 1px;
-    z-index: 1;
-    padding: 0;
-    margin: 0;
-
-    .chevronIcon {
-      top: 0;
-    }
-  }
-
-  color: $bodyTextColor;
-  background: $bodyBackgroundColor;
-
-  &:hover {
-
-    & .link,
-    & .chevronButton {
-      background: $ms-color-neutralLighterAlt;
-      color: $bodyTextColor;
-    }
-  }
-
-  &.compositeLinkIsExpanded {
-    .chevronIcon {
-      transform: rotate(-180deg);
-    }
-  }
-
-  &.compositeLinkIsSelected {
-    & .link,
-    & .chevronButton {
-
-      color: $ms-color-themePrimary;
-      background: $ms-color-neutralLighter;
-
-      &:after {
-        @include border-left(2px, solid, $ms-color-themePrimary);
-
-        content: '';
-        position: absolute;
-        top: 0;
-        @include ms-right(0);
-        bottom: 0;
-        @include ms-left(0);
-      }
-    }
-  }
-}
-
-.link {
-  display: block;
-  position: relative;
-  height: $navnode-height;
-  width: 100%;
-  line-height: $navnode-height;
-  text-decoration: none;
-  cursor: pointer;
-  text-overflow: ellipsis;
-  text-decoration: none;
-  white-space: nowrap;
-  overflow: hidden;
-}
-
-.buttonEntry {
-  color: $ms-color-themePrimary;
-}
-
-.groupHeaderFontSize {
-  @include ms-font-l;
-}
-
-.chevronButton,
-.chevronButtonGroup,
-.chevronButtonLink,
-.link {
-  @include focus-border();
-}
-
-.root .link {
-  :global(.ms-Button-label) {
-    @include ms-font-m;
-  }
-}
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.styles.ts b/packages/office-ui-fabric-react/src/components/Nav/Nav.styles.ts
index 55c5277ba6920..816a978de43bd 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.styles.ts
@@ -1,15 +1,44 @@
 import { INavStyleProps, INavStyles } from './Nav.types';
+import { IButtonStyles } from '../../Button';
 import {
+  AnimationClassNames,
+  DefaultFontStyles,
+  getFocusStyle,
+  FontSizes,
+  FontWeights,
   IStyle,
   ITheme,
 } from '../../Styling';
 
+export const buttonStyles: IButtonStyles = {
+  textContainer: {
+    overflow: 'hidden',
+  },
+  label: {
+    whiteSpace: 'nowrap',
+    textOverflow: 'ellipsis',
+    overflow: 'hidden',
+    lineHeight: '36px'
+  }
+};
+
 export const getStyles = (
   props: INavStyleProps
 ): INavStyles => {
   const {
     className,
     theme,
+    isOnTop,
+    isExpanded,
+    isGroup,
+    isLink,
+    isSelected,
+    isButtonEntry,
+    navHeight = 36,
+    position,
+    leftPadding = 20,
+    leftPaddingExpanded = 28,
+    rightPadding = 20
   } = props;
 
   const { palette, semanticColors } = theme;
@@ -17,12 +46,192 @@ export const getStyles = (
   return ({
     root: [
       'ms-Nav',
+      className,
       {
-        // Insert css properties
-
+        overflowY: 'auto',
+        userSelect: 'none',
+        WebkitOverflowScrolling: 'touch'
+      },
+      isOnTop && [
+        {
+          position: 'absolute'
+        },
+        AnimationClassNames.slideRightIn40
+      ]
+    ],
+    linkText: [
+      'ms-Nav-linkText',
+      {
+        margin: '0 4px',
+        overflow: 'hidden',
+        verticalAlign: 'middle',
+        textOverflow: 'ellipsis'
       }
     ],
-
-    // Insert className styles
+    compositeLink: [
+      'ms-Nav-compositeLink',
+      {
+        display: 'block',
+        position: 'relative',
+        color: semanticColors.bodyText,
+        backgroundColor: semanticColors.bodyBackground,
+      }
+    ],
+    link: [
+      'ms-Nav-link',
+      getFocusStyle(theme),
+      {
+        display: 'block',
+        position: 'relative',
+        height: `${navHeight}px`,
+        width: '100%',
+        lineHeight: `${navHeight}px`,
+        textDecoration: 'none',
+        cursor: 'pointer',
+        textOverflow: 'ellipsis',
+        whiteSpace: 'nowrap',
+        overflow: 'hidden',
+        paddingLeft: leftPadding,
+        paddingRight: rightPadding,
+        selectors: {
+          '.ms-Nav-compositeLink:hover &': {
+            backgroundColor: palette.neutralLighterAlt,
+            color: semanticColors.bodyText
+          },
+        },
+      },
+      isSelected && {
+        color: palette.themePrimary,
+        backgroundColor: palette.neutralLighter,
+        selectors: {
+          '&:after': {
+            borderLeft: `2px solid ${palette.themePrimary}`,
+            content: '""',
+            position: 'absolute',
+            top: 0,
+            right: 0,
+            bottom: 0,
+            left: 0
+          }
+        }
+      },
+      isButtonEntry && {
+        color: palette.themePrimary
+      }
+    ],
+    chevronButton: [
+      'ms-Nav-chevronButton',
+      getFocusStyle(theme),
+      {
+        display: 'block',
+        fontWeight: FontWeights.regular,
+        fontSize: FontSizes.small,
+        textAlign: 'left',
+        lineHeight: `${navHeight}px`,
+        margin: '5px 0',
+        padding: `0px, ${rightPadding}px, 0px, ${leftPaddingExpanded}px`,
+        border: 'none',
+        textOverflow: 'ellipsis',
+        whiteSpace: 'nowrap',
+        overflow: 'hidden',
+        cursor: 'pointer',
+        color: semanticColors.bodyText,
+        backgroundColor: 'transparent',
+        selectors: {
+          '&:visited': {
+            color: 'inherit'
+          },
+          '&:hover': {
+            color: semanticColors.bodyText,
+            backgroundColor: palette.neutralLighterAlt
+          },
+          '$compositeLink:hover &': {
+            color: semanticColors.bodyText,
+            backgroundColor: palette.neutralLighterAlt
+          },
+        }
+      },
+      isGroup && [
+        {
+          width: '100%',
+          height: `${navHeight}px`,
+          borderBottom: `1px solid ${semanticColors.bodyDivider}`
+        },
+        DefaultFontStyles.large
+      ],
+      isLink && [
+        {
+          display: 'block',
+          width: `${leftPaddingExpanded - 2}px`,
+          height: `${navHeight - 2}px`,
+          position: 'absolute',
+          top: '1px',
+          left: `${position}px`,
+          zIndex: 1,
+          padding: 0,
+          margin: 0
+        }
+      ],
+      isSelected && {
+        color: palette.themePrimary,
+        backgroundColor: palette.neutralLighterAlt,
+        selectors: {
+          '&:after': {
+            borderLeft: `2px solid ${palette.themePrimary}`,
+            content: '""',
+            position: 'absolute',
+            top: 0,
+            right: 0,
+            bottom: 0,
+            left: 0
+          }
+        }
+      }
+    ],
+    chevronIcon: [
+      'ms-Nav-chevron',
+      {
+        position: 'absolute',
+        left: '8px',
+        height: `${navHeight}px`,
+        lineHeight: `${navHeight}px`,
+        fontSize: '12px',
+        transition: 'transform .1s linear',
+      },
+      isExpanded && {
+        transform: 'rotate(-180deg)'
+      },
+      isLink && {
+        top: 0
+      }
+    ],
+    navItem: [
+      'ms-Nav-navItem',
+      {
+        padding: 0
+      }
+    ],
+    navItems: [
+      'ms-Nav-navItems',
+      {
+        listStyleType: 'none',
+        padding: 0
+      }
+    ],
+    group: [
+      'ms-Nav-group',
+      isExpanded && 'is-expanded'
+    ],
+    groupContent: [
+      'ms-Nav-groupContent',
+      {
+        display: 'none',
+        marginBottom: '40px'
+      },
+      AnimationClassNames.slideDownIn20,
+      isExpanded && {
+        display: 'block'
+      }
+    ]
   });
 };
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts b/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
index 37de48d7bb05f..872c17b669897 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
@@ -225,11 +225,120 @@ export interface INavStyleProps {
    * Accept custom classNames
    */
   className?: string;
+
+  /**
+   * is element on top boolean
+   */
+  isOnTop?: boolean;
+
+  /**
+   * is element a link boolean
+   */
+  isLink?: boolean;
+
+  /**
+   * is element a group boolean
+   */
+  isGroup?: boolean;
+
+  /**
+   * is element expanded boolean
+   */
+  isExpanded?: boolean;
+
+  /**
+   * is element selected boolean
+   */
+  isSelected?: boolean;
+
+  /**
+   * is button
+   */
+  isButtonEntry?: boolean;
+
+  /**
+   * Nav height value
+   */
+  navHeight?: number;
+
+  /**
+   * left padding value
+   */
+  leftPadding?: number;
+
+  /**
+   * left padding when expanded value
+   */
+  leftPaddingExpanded?: number;
+
+  /**
+   * right padding value
+   */
+  rightPadding?: number;
+
+  /**
+   * position value
+   */
+  position?: number;
+
+  /**
+   * Inherited from INavProps
+   * A collection of link groups to display in the navigation bar
+   */
+  groups: INavLinkGroup[] | null;
 }
 
 export interface INavStyles {
   /**
-   * Style for the root element.
+   * Style set for the root element.
+   */
+  root: IStyle;
+
+  /**
+   * Style set for the link text container div element.
+   */
+  linkText: IStyle;
+
+  /**
+  * Style set for the link element extending the
+  * root style set for ActionButton component.
+  */
+  link: IStyle;
+
+  /**
+   * Style set for the composite link container div element
+   */
+  compositeLink: IStyle;
+
+  /**
+   * Style set for the chevron button inside the composite
+   * link and group elements.
+   */
+  chevronButton: IStyle;
+
+  /**
+   * Style set for the chevron icon inside the composite
+   * link and group elements.
+   */
+  chevronIcon: IStyle;
+
+  /**
+   * Style set for the nav links ul element.
+   */
+  navItems: IStyle;
+
+  /**
+   * Style set for the nav links li element.
+   */
+  navItem: IStyle;
+
+  /**
+   * Style set for the group root div.
+   */
+  group: IStyle;
+
+  /**
+   * Style set for the group content div inside group.
    */
-  root?: IStyle;
+  groupContent: IStyle;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
index 25e12db86478e..dc17a9038bfb2 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
@@ -12,11 +12,20 @@ exports[`Nav renders Nav correctly 1`] = `
   role="presentation"
 >
   <nav
-    className="ms-Nav"
+    className=
+        ms-Nav
+        {
+          -webkit-overflow-scrolling: touch;
+          overflow-y: auto;
+          user-select: none;
+        }
     role="navigation"
   >
     <div
-      className="ms-Nav-group is-expanded undefined"
+      className=
+          ms-Nav-group
+          is-expanded
+
     >
       <div
         className=
@@ -26,19 +35,43 @@ exports[`Nav renders Nav correctly 1`] = `
               animation-fill-mode: both;
               animation-name: css-0,css-13;
               animation-timing-function: cubic-bezier(.1,.9,.2,1);
+              display: block;
+              margin-bottom: 40px;
             }
       >
         <ul
           aria-label={undefined}
-          className=""
+          className=
+              ms-Nav-navItems
+              {
+                list-style-type: none;
+                padding-bottom: 0px;
+                padding-left: 0px;
+                padding-right: 0px;
+                padding-top: 0px;
+              }
           role="list"
         >
           <li
-            className=""
+            className=
+                ms-Nav-navItem
+                {
+                  padding-bottom: 0px;
+                  padding-left: 0px;
+                  padding-right: 0px;
+                  padding-top: 0px;
+                }
             role="listitem"
           >
             <div
-              className="ms-Nav-compositeLink"
+              className=
+                  ms-Nav-compositeLink
+                  {
+                    background-color: #ffffff;
+                    color: #333333;
+                    display: block;
+                    position: relative;
+                  }
               name=""
             >
               <button
@@ -50,7 +83,7 @@ exports[`Nav renders Nav correctly 1`] = `
                     ms-Button
                     ms-Button--action
                     ms-Button--command
-                    ms-Nav-linkButton
+                    ms-Nav-link
                     {
                       -moz-osx-font-smoothing: grayscale;
                       -webkit-font-smoothing: antialiased;
@@ -60,12 +93,14 @@ exports[`Nav renders Nav correctly 1`] = `
                       box-sizing: border-box;
                       color: #333333;
                       cursor: pointer;
-                      display: inline-block;
+                      display: block;
                       font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
                       font-size: 14px;
                       font-weight: 400;
-                      height: 40px;
+                      height: 36px;
+                      line-height: 36px;
                       outline: transparent;
+                      overflow: hidden;
                       padding-bottom: 0;
                       padding-left: 3px;
                       padding-right: 20px;
@@ -73,21 +108,24 @@ exports[`Nav renders Nav correctly 1`] = `
                       position: relative;
                       text-align: center;
                       text-decoration: none;
+                      text-overflow: ellipsis;
                       user-select: none;
                       vertical-align: top;
+                      white-space: nowrap;
+                      width: 100%;
                     }
                     &::-moz-focus-inner {
                       border: 0;
                     }
                     .ms-Fabric.is-focusVisible &:focus:after {
                       border: 1px solid #ffffff;
-                      bottom: 0px;
+                      bottom: 1px;
                       content: "";
-                      left: 0px;
+                      left: 1px;
                       outline: 1px solid #666666;
                       position: absolute;
-                      right: 0px;
-                      top: 0px;
+                      right: 1px;
+                      top: 1px;
                       z-index: 1;
                     }
                     &:hover {
@@ -102,6 +140,10 @@ exports[`Nav renders Nav correctly 1`] = `
                     &:active .ms-Button-icon {
                       color: #004578;
                     }
+                    .ms-Nav-compositeLink:hover & {
+                      background-color: #f8f8f8;
+                      color: #333333;
+                    }
                 data-is-focusable={true}
                 disabled={undefined}
                 onClick={[Function]}
@@ -145,7 +187,17 @@ exports[`Nav renders Nav correctly 1`] = `
                     role="presentation"
                   />
                   <div
-                    className="ms-Nav-linkText"
+                    className=
+                        ms-Nav-linkText
+                        {
+                          margin-bottom: 0;
+                          margin-left: 4px;
+                          margin-right: 4px;
+                          margin-top: 0;
+                          overflow: hidden;
+                          text-overflow: ellipsis;
+                          vertical-align: middle;
+                        }
                   >
                     
                   </div>

From 2674091f355760aa8c1b49bf30d6f96b462fb484 Mon Sep 17 00:00:00 2001
From: Mark Polak <mark@thedutchies.com>
Date: Wed, 21 Feb 2018 23:49:42 +0100
Subject: [PATCH 1417/1641] Enable no internal module (#4059)

* Enable no-internal-module lint rule

* Add npm change file
---
 .../enable-no-internal-module_2018-02-21-21-40.json   | 11 +++++++++++
 .../src/utilities/positioning/positioning.ts          |  2 +-
 packages/office-ui-fabric-react/tslint.json           |  1 -
 3 files changed, 12 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/enable-no-internal-module_2018-02-21-21-40.json

diff --git a/common/changes/office-ui-fabric-react/enable-no-internal-module_2018-02-21-21-40.json b/common/changes/office-ui-fabric-react/enable-no-internal-module_2018-02-21-21-40.json
new file mode 100644
index 0000000000000..074be2ab82375
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/enable-no-internal-module_2018-02-21-21-40.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "office-ui-fabric-react",
+      "type": "none"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts b/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts
index 5dda3a42753c8..f477ae46fdaf8 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts
@@ -64,7 +64,7 @@ const SLIDE_ANIMATIONS: { [key: number]: string; } = {
  * Do not call methods from this directly, use either positionCallout or positionElement or make another function that
  * utilizes them.
  */
-export module positioningFunctions {
+export namespace positioningFunctions {
 
   export interface IElementPosition {
     elementRectangle: Rectangle;
diff --git a/packages/office-ui-fabric-react/tslint.json b/packages/office-ui-fabric-react/tslint.json
index 6619dab9251e0..29238d549d5e8 100644
--- a/packages/office-ui-fabric-react/tslint.json
+++ b/packages/office-ui-fabric-react/tslint.json
@@ -12,7 +12,6 @@
     ],
     "no-any": false,
     "variable-name": false,
-    "no-internal-module": false,
     "typedef": [
       false
     ],

From 6fbbe8922e7b97983e36346f1577f040e8e13acb Mon Sep 17 00:00:00 2001
From: chang47 <coralbue@gmail.com>
Date: Wed, 21 Feb 2018 15:23:49 -0800
Subject: [PATCH 1418/1641] Contextual Menu: Added aria-setsize and
 aria-posinset for rendering split buttons (#4044)

* added split button aria for contetual menu

* add change files

* added change file

* added change file

* added change file

* aqdded change file

* removed extra change files that appereard due to case error with branch names
---
 .../splitbuttonMeny_2018-02-21-18-32.json             | 11 +++++++++++
 .../src/components/ContextualMenu/ContextualMenu.tsx  |  2 ++
 2 files changed, 13 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/splitbuttonMeny_2018-02-21-18-32.json

diff --git a/common/changes/office-ui-fabric-react/splitbuttonMeny_2018-02-21-18-32.json b/common/changes/office-ui-fabric-react/splitbuttonMeny_2018-02-21-18-32.json
new file mode 100644
index 0000000000000..baf153dc41b31
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/splitbuttonMeny_2018-02-21-18-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Contextual Menu - Added aria-posinset and aria-setsize to split buttons",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chiechan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 4310a441eafb8..9fb572198e975 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -565,6 +565,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
         aria-haspopup={ true }
         aria-describedby={ item.ariaDescription }
         aria-checked={ item.isChecked || item.checked }
+        aria-posinset={ focusableElementIndex + 1 }
+        aria-setsize={ totalItemCount }
       >
         <span
           aria-hidden={ true }

From 6b2f5885f2d76e8539d6108db8cd3ed6dc5deabc Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Wed, 21 Feb 2018 15:28:59 -0800
Subject: [PATCH 1419/1641] [TextField] input "size" attribute (#4060)

* set input text size on textfield to 1

* Change file

* Changed to min-width
---
 .../law-textfieldMinSize_2018-02-21-21-44.json        | 11 +++++++++++
 .../src/components/TextField/TextField.scss           |  6 ++++++
 .../src/components/TextField/TextField.tsx            |  2 +-
 3 files changed, 18 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/law-textfieldMinSize_2018-02-21-21-44.json

diff --git a/common/changes/office-ui-fabric-react/law-textfieldMinSize_2018-02-21-21-44.json b/common/changes/office-ui-fabric-react/law-textfieldMinSize_2018-02-21-21-44.json
new file mode 100644
index 0000000000000..962b8eae51e3d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/law-textfieldMinSize_2018-02-21-21-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "[TextField] Set input size to 1",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index 6deccdf4964fd..d802bb1ebd22e 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -128,6 +128,12 @@ $field-error-color: $errorTextColor;
   color: $field-text-color;
   @include ms-padding(0, 12px, 0, 12px);
   width: 100%;
+  /**
+   * min-width is set to 1 in order to tell the browser to ignore the
+   * default value calculated from the size attribute and respect the
+   * width set on parent elements.
+   */
+  min-width: 0;
   text-overflow: ellipsis;
   outline: 0;
   &:active,
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index 2c45908e76e6b..2183281ec7a2d 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -294,7 +294,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
     const {
       label,
       componentId
-     } = props;
+    } = props;
     if (label) {
       return (<Label htmlFor={ componentId }>{ label }</Label>);
     }

From b806c8d972e306f71c26874c5262a33ddc862d4a Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Wed, 21 Feb 2018 15:33:17 -0800
Subject: [PATCH 1420/1641] Datepicker: Adding public focus method (#4053)

* no message

* no message

* Adding public focus method

* Change file

* Fixing syntax and adding type

* changing order to fix error
---
 ...egorr-DatePicker-PublicFocus_2018-02-21-18-19.json | 11 +++++++++++
 .../src/components/DatePicker/DatePicker.tsx          |  6 ++++++
 .../src/components/DatePicker/DatePicker.types.ts     |  3 ++-
 3 files changed, 19 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-DatePicker-PublicFocus_2018-02-21-18-19.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-DatePicker-PublicFocus_2018-02-21-18-19.json b/common/changes/office-ui-fabric-react/kegorr-DatePicker-PublicFocus_2018-02-21-18-19.json
new file mode 100644
index 0000000000000..8fa302dc108e0
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-DatePicker-PublicFocus_2018-02-21-18-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DatePicker - Adding public focus method",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 9dc5caacfe1e1..8f0b16e9285f4 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -272,6 +272,12 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     );
   }
 
+  public focus(): void {
+    if (this._textField) {
+      this._textField.focus();
+    }
+  }
+
   @autobind
   private _onSelectDate(date: Date) {
     const { formatDate, onSelectDate } = this.props;
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
index cb46f0a1d351e..4fe60996f7864 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
@@ -5,7 +5,8 @@ import { FirstWeekOfYear } from '../../utilities/dateValues/DateValues';
 import { ICalendarFormatDateCallbacks } from '../Calendar/Calendar.types';
 
 export interface IDatePicker {
-
+  /** Sets focus to the text field */
+  focus(): void;
 }
 
 export interface IDatePickerProps extends React.Props<DatePicker> {

From 8f5fe3b6b8feb89df75ee76d886fdcccddceb875 Mon Sep 17 00:00:00 2001
From: chang47 <coralbue@gmail.com>
Date: Wed, 21 Feb 2018 15:48:54 -0800
Subject: [PATCH 1421/1641] ContextualMenu - Added support for custom component
 lengths and fixed aria-posinset value (#4004)

* used correct indexing for focusable element idnex

* fixed focus element index

* add support for custom components to have their own lists

* update comment

* fixed the indexing to include moving to the next element

* reverted, the original change is correct

* resoled build problems
---
 .../menusize_2018-02-16-18-26.json                | 11 +++++++++++
 .../components/ContextualMenu/ContextualMenu.tsx  | 15 +++++++++------
 .../ContextualMenu/ContextualMenu.types.ts        |  7 +++++++
 3 files changed, 27 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/menusize_2018-02-16-18-26.json

diff --git a/common/changes/office-ui-fabric-react/menusize_2018-02-16-18-26.json b/common/changes/office-ui-fabric-react/menusize_2018-02-16-18-26.json
new file mode 100644
index 0000000000000..b8a5eb60e1ed7
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/menusize_2018-02-16-18-26.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Updated contextual menu to pass the correct number",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chiechan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 9fb572198e975..65f4ac27d065e 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -273,7 +273,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       for (const item of items) {
         if (item.itemType !== ContextualMenuItemType.Divider &&
           item.itemType !== ContextualMenuItemType.Header) {
-          totalItemCount++;
+          const itemCount = item.customOnRenderListLength ? item.customOnRenderListLength : 1;
+          totalItemCount += itemCount;
         }
       }
       return (
@@ -319,11 +320,13 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
                   onKeyDown={ this._onKeyDown }
                 >
                   { items.map((item, index) => {
-                    if (item.itemType === ContextualMenuItemType.Divider ||
-                      item.itemType === ContextualMenuItemType.Header) {
-                      indexCorrection++;
+                    const menuItem = this._renderMenuItem(item, index, indexCorrection, totalItemCount, hasCheckmarks, hasIcons);
+                    if (item.itemType !== ContextualMenuItemType.Divider &&
+                      item.itemType !== ContextualMenuItemType.Header) {
+                      const indexIncrease = item.customOnRenderListLength ? item.customOnRenderListLength : 1;
+                      indexCorrection += indexIncrease;
                     }
-                    return this._renderMenuItem(item, index, index - indexCorrection, totalItemCount, hasCheckmarks, hasIcons);
+                    return menuItem;
                   }) }
                 </ul>
               </FocusZone>
@@ -450,7 +453,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
   private _renderNormalItem(item: IContextualMenuItem, classNames: IMenuItemClassNames, index: number, focusableElementIndex: number, totalItemCount: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
     if (item.onRender) {
-      return [item.onRender({ 'aria-posinset': focusableElementIndex, 'aria-setsize': totalItemCount, ...item }, this.dismiss)];
+      return [item.onRender({ 'aria-posinset': focusableElementIndex + 1, 'aria-setsize': totalItemCount, ...item }, this.dismiss)];
     }
     if (item.href) {
       return this._renderAnchorMenuItem(item, classNames, index, focusableElementIndex, totalItemCount, hasCheckmarks, hasIcons);
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
index 5f1eb27174d5e..ad1289a135fcf 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
@@ -406,6 +406,13 @@ export interface IContextualMenuItem {
    */
   role?: string;
 
+  /**
+   * When rendering a custom component that is passed in, the component might also be a list of
+   * elements. We want to keep track of the correct index our menu is using based off of
+   * the length of the custom list. It is up to the user to increment the count for their list.
+   */
+  customOnRenderListLength?: number;
+
   /**
    * Any additional properties to use when custom rendering menu items.
    */

From f99a700aedbe2b4d91c35bb8b5cc26199311d77e Mon Sep 17 00:00:00 2001
From: Mark Polak <mark@thedutchies.com>
Date: Thu, 22 Feb 2018 01:52:48 +0100
Subject: [PATCH 1422/1641] Enable jsx no string ref (#4016)

* Refactor to re-enable jsx-no-string-ref

* Unneccesary publics

* Update reference

* Revert BaseFloatingPicker

* Revert BaseFloatingPicker

* Follow best practice

* Remove unused ref

* Tslint fix

* Fix FocusTrapZone

* Fix command bar

* Update ContextualMenu.Directional.Example.tsx

* Update DetailsList.Advanced.Example.tsx
---
 ghdocs/BESTPRACTICES.md                       |  4 --
 .../src/components/Breadcrumb/Breadcrumb.tsx  |  5 +-
 .../src/components/Calendar/Calendar.tsx      | 27 ++++----
 .../components/ColorPicker/ColorRectangle.tsx |  9 +--
 .../components/ColorPicker/ColorSlider.tsx    |  9 +--
 .../src/components/ComboBox/ComboBox.tsx      |  9 +--
 .../src/components/CommandBar/CommandBar.tsx  | 38 ++++++-----
 .../ContextualMenu.Directional.Example.tsx    |  8 +--
 .../components/DetailsList/DetailsHeader.tsx  | 13 ++--
 .../src/components/DetailsList/DetailsRow.tsx | 12 ++--
 .../examples/DetailsList.Advanced.Example.tsx |  6 --
 .../FocusTrapZone/FocusTrapZone.tsx           | 25 +++----
 .../components/GroupedList/GroupedList.tsx    | 21 +++---
 .../GroupedList/GroupedListSection.tsx        | 23 +++----
 .../examples/GroupedList.Custom.Example.tsx   | 10 ++-
 .../src/components/List/List.tsx              | 19 +++---
 .../MarqueeSelection/MarqueeSelection.tsx     | 22 +++----
 .../src/components/Popup/Popup.tsx            | 17 ++---
 .../ScrollablePane/ScrollablePane.base.tsx    | 65 ++++++++-----------
 .../src/components/Slider/Slider.tsx          | 20 ++----
 .../src/components/Sticky/Sticky.tsx          | 18 ++---
 .../src/components/Theme/ThemePage.tsx        | 16 +++--
 .../SelectedItemWithMenu.tsx                  |  5 +-
 .../examples/TagPicker.Basic.Example.tsx      |  1 -
 .../decorators/withContainsFocus.tsx          |  6 +-
 .../src/utilities/decorators/withViewport.tsx |  9 +--
 .../src/utilities/selection/SelectionZone.tsx | 32 ++++-----
 packages/office-ui-fabric-react/tslint.json   |  1 -
 28 files changed, 187 insertions(+), 263 deletions(-)

diff --git a/ghdocs/BESTPRACTICES.md b/ghdocs/BESTPRACTICES.md
index bcf01c605c34f..203dd70c0aed6 100644
--- a/ghdocs/BESTPRACTICES.md
+++ b/ghdocs/BESTPRACTICES.md
@@ -187,10 +187,6 @@ Note that it's very critical you do NOT inline the functions in render! This cau
 is recreated. If you do this, react will call your function with null to clear it, and then render, and then once complete, will
 call it again with the element. This creates timing issues where your ref may be null when you didn't expect.
 
-See example here that illustates refs being re-evaluated:
-
-http://codepen.io/dzearing/pen/WGZOaR
-
 ## Use unique keys for items in a mapped array, avoid indexes for keys
 
 ```typescript
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
index 6c6409e6733dc..fa3dc54b318b7 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
@@ -83,14 +83,13 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
     return (
       <div
         className={ css('ms-Breadcrumb', className, styles.root) }
-        ref='renderingArea'
         role='navigation'
         aria-label={ ariaLabel }
       >
         <FocusZone direction={ FocusZoneDirection.horizontal } >
           <ol className={ css('ms-Breadcrumb-list', styles.list) }>
             { renderedOverflowItems && renderedOverflowItems.length !== 0 && (
-              <li className={ css('ms-Breadcrumb-overflow', styles.overflow) } key={ OVERFLOW_KEY } ref={ OVERFLOW_KEY }>
+              <li className={ css('ms-Breadcrumb-overflow', styles.overflow) } key={ OVERFLOW_KEY }>
                 <IconButton
                   className={ css('ms-Breadcrumb-overflowButton', styles.overflowButton) }
                   iconProps={ { iconName: 'More' } }
@@ -110,7 +109,7 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
             ) }
             { renderedItems.map(
               (item, index) => (
-                <li className={ css('ms-Breadcrumb-listItem', styles.listItem) } key={ item.key || String(index) } ref={ item.key || String(index) }>
+                <li className={ css('ms-Breadcrumb-listItem', styles.listItem) } key={ item.key || String(index) }>
                   { onRenderItem(item, this._onRenderItem) }
                   <Icon
                     className={ css('ms-Breadcrumb-chevron', styles.chevron) }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index 18d47b3612e65..0a7286e9f7255 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -71,12 +71,9 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     workWeekDays: defaultWorkWeekDays
   };
 
-  public refs: {
-    [key: string]: React.ReactInstance;
-    root: HTMLElement;
-    dayPicker: CalendarDay;
-    monthPicker: CalendarMonth;
-  };
+  public root: HTMLElement;
+  public dayPicker: CalendarDay;
+  public monthPicker: CalendarMonth;
 
   private _focusOnUpdate: boolean;
 
@@ -116,10 +113,10 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
   public componentDidUpdate() {
     if (this._focusOnUpdate) {
       // if the day picker is shown, focus on it
-      if (this.refs.dayPicker) {
-        this.refs.dayPicker.focus();
-      } else if (this.refs.monthPicker) {
-        this.refs.monthPicker.focus();
+      if (this.dayPicker) {
+        this.dayPicker.focus();
+      } else if (this.monthPicker) {
+        this.monthPicker.focus();
       }
       this._focusOnUpdate = false;
     }
@@ -134,7 +131,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     const overlayedWithButton = showMonthPickerAsOverlay && showGoToToday;
 
     return (
-      <div className={ css(rootClass, styles.root) } ref='root' role='application'>
+      <div className={ css(rootClass, styles.root) } ref={ this._resolveRef('root') } role='application'>
         <div
           className={ css(
             'ms-DatePicker-picker ms-DatePicker-picker--opened ms-DatePicker-picker--focused',
@@ -170,7 +167,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   minDate={ minDate }
                   maxDate={ maxDate }
                   workWeekDays={ this.props.workWeekDays }
-                  ref='dayPicker'
+                  ref={ this._resolveRef('_dayPicker') }
                 />
                 }
 
@@ -185,7 +182,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   dateTimeFormatter={ this.props.dateTimeFormatter! }
                   minDate={ minDate }
                   maxDate={ maxDate }
-                  ref='monthPicker'
+                  ref={ this._resolveRef('monthPicker') }
                 /> }
 
                 { showGoToToday &&
@@ -208,8 +205,8 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
   }
 
   public focus() {
-    if (this.refs.dayPicker) {
-      this.refs.dayPicker.focus();
+    if (this.dayPicker) {
+      this.dayPicker.focus();
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx
index 49b88e4b3d5fa..292182370cd44 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx
@@ -35,10 +35,7 @@ export class ColorRectangle extends BaseComponent<IColorRectangleProps, IColorPi
     minSize: 220
   };
 
-  public refs: {
-    [key: string]: React.ReactInstance;
-    root: HTMLElement;
-  };
+  private root: HTMLDivElement;
 
   constructor(props: IColorRectangleProps) {
     super(props);
@@ -71,7 +68,7 @@ export class ColorRectangle extends BaseComponent<IColorRectangleProps, IColorPi
     const { color, fullColorString } = this.state;
 
     return (
-      <div ref='root' className={ css('ms-ColorPicker-colorRect', styles.colorRect) } style={ { minWidth: minSize, minHeight: minSize, backgroundColor: fullColorString } } onMouseDown={ this._onMouseDown }>
+      <div ref={ this._resolveRef('_root') } className={ css('ms-ColorPicker-colorRect', styles.colorRect) } style={ { minWidth: minSize, minHeight: minSize, backgroundColor: fullColorString } } onMouseDown={ this._onMouseDown }>
         <div className={ css('ms-ColorPicker-light', styles.light) } />
         <div className={ css('ms-ColorPicker-dark', styles.dark) } />
         <div className={ css('ms-ColorPicker-thumb', styles.thumb) } style={ { left: color!.s + '%', top: (MAX_COLOR_VALUE - color!.v) + '%', backgroundColor: color!.str } } />
@@ -90,7 +87,7 @@ export class ColorRectangle extends BaseComponent<IColorRectangleProps, IColorPi
   @autobind
   private _onMouseMove(ev: React.MouseEvent<HTMLElement>) {
     const { color, onSVChanged } = this.props;
-    const rectSize = this.refs.root.getBoundingClientRect();
+    const rectSize = this.root.getBoundingClientRect();
 
     const sPercentage = (ev.clientX - rectSize.left) / rectSize.width;
     const vPercentage = (ev.clientY - rectSize.top) / rectSize.height;
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
index 4f453776680be..e2a96508f88d4 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
@@ -34,10 +34,7 @@ export class ColorSlider extends BaseComponent<IColorSliderProps, IColorSliderSt
     value: 0
   };
 
-  public refs: {
-    [key: string]: React.ReactInstance;
-    root: HTMLElement;
-  };
+  private _root: HTMLElement;
 
   constructor(props: IColorSliderProps) {
     super(props);
@@ -65,7 +62,7 @@ export class ColorSlider extends BaseComponent<IColorSliderProps, IColorSliderSt
 
     return (
       <div
-        ref='root'
+        ref={ this._resolveRef('_root') }
         className={ css(
           'ms-ColorPicker-slider',
           styles.slider,
@@ -91,7 +88,7 @@ export class ColorSlider extends BaseComponent<IColorSliderProps, IColorSliderSt
   @autobind
   private _onMouseMove(ev: React.MouseEvent<HTMLElement>) {
     const { onChanged, minValue, maxValue } = this.props;
-    const rectSize = this.refs.root.getBoundingClientRect();
+    const rectSize = this._root.getBoundingClientRect();
 
     const currentPercentage = (ev.clientX - rectSize.left) / rectSize.width;
     const newValue = Math.min(maxValue!, Math.max(minValue!, currentPercentage * maxValue!));
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index fb211aefa3c85..9501383589374 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -89,10 +89,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     buttonIconProps: { iconName: 'ChevronDown' }
   };
 
-  public refs: {
-    [key: string]: React.ReactInstance,
-    root: HTMLElement
-  };
+  private _root: HTMLElement;
 
   // The input aspect of the comboBox
   private _comboBox: Autofill;
@@ -306,7 +303,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       );
 
     return (
-      <div { ...divProps } ref='root' className={ this._classNames.container }>
+      <div { ...divProps } ref={ this._resolveRef('_root') } className={ this._classNames.container }>
         { label && (
           <Label id={ id + '-label' } disabled={ disabled } required={ required } htmlFor={ id + '-input' } className={ this._classNames.label }>{ label }</Label>
         ) }
@@ -784,7 +781,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     // inside the comboBox root or the comboBox menu since
     // it we are not really bluring from the whole comboBox
     if (event.relatedTarget &&
-      (this.refs.root && this.refs.root.contains(event.relatedTarget as HTMLElement) ||
+      (this._root && this._root.contains(event.relatedTarget as HTMLElement) ||
         this._comboBoxMenu && this._comboBoxMenu.contains(event.relatedTarget as HTMLElement))) {
       event.preventDefault();
       event.stopPropagation();
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 537a81c7fdb40..19f7244a8808d 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -44,13 +44,15 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
 
   public refs: {
     [key: string]: React.ReactInstance;
-    commandSurface: HTMLElement;
-    farCommandSurface: HTMLElement;
-    commandBarRegion: HTMLElement;
-    searchSurface: HTMLElement;
-    focusZone: FocusZone;
   };
 
+  private _searchSurface: HTMLElement;
+  private _commandSurface: HTMLElement;
+  private _commandBarRegion: HTMLElement;
+  private _farCommandSurface: HTMLElement;
+  private _focusZone: FocusZone;
+  private _overflow: HTMLElement;
+
   private _id: string;
   private _overflowWidth: number;
   private _commandItemWidths: { [key: string]: number } | null;
@@ -88,7 +90,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
 
     if (isSearchBoxVisible) {
       searchBox = (
-        <div className={ css('ms-CommandBarSearch', styles.search) } ref='searchSurface'>
+        <div className={ css('ms-CommandBarSearch', styles.search) } ref={ this._resolveRef('_searchSurface') }>
           <input className={ css('ms-CommandBarSearch-input', styles.searchInput) } type='text' placeholder={ searchPlaceholderText } />
           <div
             className={ css(
@@ -115,14 +117,14 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
     let posInSet = 1;
 
     return (
-      <div className={ css('ms-CommandBar', styles.root, className) } ref='commandBarRegion'>
+      <div className={ css('ms-CommandBar', styles.root, className) } ref={ this._resolveRef('_commandBarRegion') }>
         { searchBox }
-        <FocusZone ref='focusZone' className={ styles.container } direction={ FocusZoneDirection.horizontal } role='menubar' >
-          <div className={ css('ms-CommandBar-primaryCommands', styles.primaryCommands) } ref='commandSurface'>
+        <FocusZone ref={ this._resolveRef('_focusZone') } className={ styles.container } direction={ FocusZoneDirection.horizontal } role='menubar' >
+          <div className={ css('ms-CommandBar-primaryCommands', styles.primaryCommands) } ref={ this._resolveRef('_commandSurface') }>
             { renderedItems!.map(item => (
               this._renderItemInCommandBar(item, posInSet++, setSize, expandedMenuItemKey!)
             )).concat((renderedOverflowItems && renderedOverflowItems.length) ? [
-              <div className={ css('ms-CommandBarItem', styles.item) } key={ OVERFLOW_KEY } ref={ OVERFLOW_KEY }>
+              <div className={ css('ms-CommandBarItem', styles.item) } key={ OVERFLOW_KEY } ref={ this._resolveRef('_overflow') }>
                 <button
                   type='button'
                   id={ this._id + OVERFLOW_KEY }
@@ -143,7 +145,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
               </div>
             ] : []) }
           </div>
-          <div className={ css('ms-CommandBar-sideCommands', styles.sideCommands) } ref='farCommandSurface'>
+          <div className={ css('ms-CommandBar-sideCommands', styles.sideCommands) } ref={ this._resolveRef('_farCommandSurface') }>
             { renderedFarItems!.map(item => (
               this._renderItemInCommandBar(item, posInSet++, setSize, expandedMenuItemKey!, true)
             )) }
@@ -165,7 +167,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
   }
 
   public focus() {
-    this.refs.focusZone.focus();
+    this._focusZone.focus();
   }
 
   private _renderItemInCommandBar(item: ICommandBarItemProps, posInSet: number, setSize: number, expandedMenuItemKey: string, isFarItem?: boolean) {
@@ -305,7 +307,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
 
   private _updateItemMeasurements() {
     // the generated width for overflow is 35 in chrome, 38 in IE, but the actual value is 41.5
-    if (this.refs[OVERFLOW_KEY] || (this.props.overflowItems && this.props.overflowItems.length)) {
+    if (this._overflow || (this.props.overflowItems && this.props.overflowItems.length)) {
       this._overflowWidth = OVERFLOW_WIDTH;
     } else {
       this._overflowWidth = 0;
@@ -330,10 +332,10 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
 
   private _updateRenderedItems() {
     const { items, overflowItems } = this.props;
-    const commandSurface = this.refs.commandSurface;
-    const farCommandSurface = this.refs.farCommandSurface;
-    const commandBarRegion = this.refs.commandBarRegion;
-    const searchSurface = this.refs.searchSurface;
+    const commandSurface = this._commandSurface;
+    const farCommandSurface = this._farCommandSurface;
+    const commandBarRegion = this._commandBarRegion;
+    const searchSurface = this._searchSurface;
     const renderedItems = [...items];
     let renderedOverflowItems = overflowItems;
     let consumedWidth = 0;
@@ -416,7 +418,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
 
   @autobind
   private _onContextMenuDismiss(ev?: any) {
-    if (!ev || !ev.relatedTarget || !this.refs.commandSurface.contains(ev.relatedTarget as HTMLElement)) {
+    if (!ev || !ev.relatedTarget || !this._commandSurface.contains(ev.relatedTarget as HTMLElement)) {
       const { contextualMenuProps } = this.state;
 
       if (contextualMenuProps && contextualMenuProps.onDismiss) {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
index 69b1f74836261..e9b43c7f85ad7 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
@@ -36,12 +36,6 @@ const DIRECTION_OPTIONS = [{ key: DirectionalHint.topLeftEdge, text: 'Top Left E
 ];
 
 export class ContextualMenuDirectionalExample extends React.Component<{}, IContextualMenuDirectionalExampleState> {
-  public refs: {
-    [key: string]: React.ReactInstance;
-    menuButton: HTMLElement;
-    gapSize: TextField;
-  };
-
   public constructor(props: {}) {
     super(props);
 
@@ -95,7 +89,7 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
             />
           }
         </div>
-        <div className='ms-ContextualMenuDirectionalExample-buttonArea' ref='menuButton'>
+        <div className='ms-ContextualMenuDirectionalExample-buttonArea'>
           <DefaultButton
             text='Show context menu'
             menuProps={ {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index 6e88bf7b10b83..f1bd5d7749ab9 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -82,10 +82,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
     collapseAllVisibility: CollapseAllVisibility.visible
   };
 
-  public refs: {
-    [key: string]: React.ReactInstance;
-    root: FocusZone;
-  };
+  private _root: FocusZone;
 
   private _id: string;
 
@@ -108,7 +105,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
 
     this._events.on(selection, SELECTION_CHANGE, this._onSelectionChanged);
 
-    const rootElement = ReactDOM.findDOMNode(this.refs.root);
+    const rootElement = ReactDOM.findDOMNode(this._root);
 
     // We need to use native on this to avoid MarqueeSelection from handling the event before us.
     this._events.on(rootElement, 'mousedown', this._onRootMouseDown);
@@ -145,7 +142,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
           (selectAllVisibility === SelectAllVisibility.hidden) && ('is-selectAllHidden ' + styles.rootIsSelectAllHidden),
           (!!columnResizeDetails && isSizing) && 'is-resizingColumn'
         ) }
-        ref='root'
+        ref={ this._resolveRef('_root') }
         onMouseMove={ this._onRootMouseMove }
         data-automationid='DetailsHeader'
         direction={ FocusZoneDirection.horizontal }
@@ -329,7 +326,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
 
   /** Set focus to the active thing in the focus area. */
   public focus(): boolean {
-    return this.refs.root.focus();
+    return this._root.focus();
   }
 
   private _renderColumnSizer(columnIndex: number) {
@@ -501,7 +498,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
       // use buttons property here since ev.button in some edge case is not upding well during the move.
       // but firefox doesn't support it, so we set the default value when it is not defined.
       buttons
-  } = ev;
+    } = ev;
     const { onColumnIsSizingChanged, onColumnResized, columns } = this.props;
     const { columnResizeDetails } = this.state;
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index 9e38851d5c7f0..064c80759e8a4 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -74,12 +74,8 @@ export interface IDetailsRowState {
 const DEFAULT_DROPPING_CSS_CLASS = 'is-dropping';
 
 export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState> {
-  public refs: {
-    [key: string]: React.ReactInstance,
-    cellMeasurer: HTMLElement
-  };
-
   private _root: HTMLElement | undefined;
+  private _cellMeasurer: HTMLElement;
   private _focusZone: IFocusZone;
   private _hasSetFocus: boolean;
   private _droppingClassNames: string;
@@ -139,7 +135,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
     }
 
     if (columnMeasureInfo && columnMeasureInfo.index >= 0) {
-      const newWidth = this.refs.cellMeasurer.getBoundingClientRect().width;
+      const newWidth = this._cellMeasurer.getBoundingClientRect().width;
 
       columnMeasureInfo.onMeasureDone(newWidth);
 
@@ -205,7 +201,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
 
     return (
       <FocusZone
-        {...getNativeProps(this.props, divProperties) }
+        { ...getNativeProps(this.props, divProperties) }
         direction={ FocusZoneDirection.horizontal }
         ref={ this._onRootRef }
         componentRef={ this._resolveRef('_focusZone') }
@@ -268,7 +264,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
           <span
             role='presentation'
             className={ css('ms-DetailsRow-cellMeasurer ms-DetailsRow-cell', styles.cellMeasurer, styles.cell) }
-            ref='cellMeasurer'
+            ref={ this._resolveRef('_cellMeasurer') }
           >
             <DetailsRowFields
               columns={ [columnMeasureInfo.column] }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
index c232112266b74..276b11a3d3611 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
@@ -49,11 +49,6 @@ export interface IDetailsListAdvancedExampleState {
 }
 
 export class DetailsListAdvancedExample extends React.Component<{}, IDetailsListAdvancedExampleState> {
-  public refs: {
-    [key: string]: React.ReactInstance;
-    list: DetailsList
-  };
-
   private _isFetchingItems: boolean;
   private _selection: Selection;
 
@@ -124,7 +119,6 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
         }
 
         <DetailsList
-          ref='list'
           setKey='items'
           items={ items as any[] }
           groups={ groups }
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
index 9eacd38130f0d..1525357807954 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
@@ -17,11 +17,7 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
   private static _focusStack: FocusTrapZone[] = [];
   private static _clickStack: FocusTrapZone[] = [];
 
-  public refs: {
-    [key: string]: React.ReactInstance,
-    root: HTMLElement
-  };
-
+  private _root: HTMLElement;
   private _previouslyFocusedElement: HTMLElement;
   private _isInFocusStack: boolean = false;
   private _isInClickStack: boolean = false;
@@ -42,7 +38,7 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
     const { isClickableOutsideFocusTrap = false, forceFocusInsideTrap = true, elementToFocusOnDismiss, disableFirstFocus = false } = this.props;
 
     this._previouslyFocusedElement = elementToFocusOnDismiss ? elementToFocusOnDismiss : document.activeElement as HTMLElement;
-    if (!elementContains(this.refs.root, this._previouslyFocusedElement) && !disableFirstFocus) {
+    if (!elementContains(this._root, this._previouslyFocusedElement) && !disableFirstFocus) {
       this.focus();
     }
 
@@ -91,7 +87,7 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
       <div
         { ...divProps }
         className={ className }
-        ref='root'
+        ref={ this._resolveRef('_root') }
         aria-labelledby={ ariaLabelledBy }
         onKeyDown={ this._onKeyboardHandler }
       >
@@ -110,12 +106,11 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
       : firstFocusableSelector && firstFocusableSelector();
 
     let _firstFocusableChild;
-    const root = this.refs.root;
 
     if (focusSelector) {
-      _firstFocusableChild = root.querySelector('.' + focusSelector);
+      _firstFocusableChild = this._root.querySelector('.' + focusSelector);
     } else {
-      _firstFocusableChild = getNextElement(root, root.firstChild as HTMLElement, true, false, false, true);
+      _firstFocusableChild = getNextElement(this._root, this._root.firstChild as HTMLElement, true, false, false, true);
     }
     if (_firstFocusableChild) {
       (_firstFocusableChild as any).focus();
@@ -128,10 +123,8 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
       return;
     }
 
-    const { root } = this.refs;
-
-    const _firstFocusableChild = getFirstFocusable(root, root.firstChild as HTMLElement, true);
-    const _lastFocusableChild = getLastTabbable(root, root.lastChild as HTMLElement, true);
+    const _firstFocusableChild = getFirstFocusable(this._root, this._root.firstChild as HTMLElement, true);
+    const _lastFocusableChild = getLastTabbable(this._root, this._root.lastChild as HTMLElement, true);
 
     if (ev.shiftKey && _firstFocusableChild === ev.target) {
       _lastFocusableChild!.focus();
@@ -148,7 +141,7 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
     if (FocusTrapZone._focusStack.length && this === FocusTrapZone._focusStack[FocusTrapZone._focusStack.length - 1]) {
       const focusedElement = document.activeElement as HTMLElement;
 
-      if (!elementContains(this.refs.root, focusedElement)) {
+      if (!elementContains(this._root, focusedElement)) {
         this.focus();
         ev.preventDefault();
         ev.stopPropagation();
@@ -160,7 +153,7 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
     if (FocusTrapZone._clickStack.length && this === FocusTrapZone._clickStack[FocusTrapZone._clickStack.length - 1]) {
       const clickedElement = ev.target as HTMLElement;
 
-      if (clickedElement && !elementContains(this.refs.root, clickedElement)) {
+      if (clickedElement && !elementContains(this._root, clickedElement)) {
         this.focus();
         ev.preventDefault();
         ev.stopPropagation();
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
index a3db445bee95a..26f914eb1d8b4 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
@@ -38,10 +38,10 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
 
   public refs: {
     [key: string]: React.ReactInstance,
-    root: HTMLElement,
-    list: List
   };
 
+  private _list: List;
+
   private _isSomeGroupExpanded: boolean;
 
   constructor(props: IGroupedListProps) {
@@ -56,7 +56,7 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
   }
 
   public scrollToIndex(index: number, measureItem?: (itemIndex: number) => number): void {
-    this.refs.list && this.refs.list.scrollToIndex(index, measureItem);
+    this._list && this._list.scrollToIndex(index, measureItem);
   }
 
   public componentWillReceiveProps(newProps: IGroupedListProps) {
@@ -92,7 +92,6 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
 
     return (
       <div
-        ref='root'
         className={ css('ms-GroupedList', styles.root, className) }
         data-automationid='GroupedList'
         data-is-scrollable='false'
@@ -101,11 +100,11 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
         { !groups ?
           this._renderGroup(null, 0) : (
             <List
-              ref='list'
+              ref={ this._resolveRef('_list') }
               items={ groups }
               onRenderCell={ this._renderGroup }
               getItemCountForPage={ this._returnOne }
-              getPageSpecification= { this._getPageSpecification }
+              getPageSpecification={ this._getPageSpecification }
               usePageCache={ usePageCache }
               onShouldVirtualize={ onShouldVirtualize }
             />
@@ -249,11 +248,11 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
 
     const groupCount = groups ? groups.length : 1;
 
-    if (this.refs.list) {
-      this.refs.list.forceUpdate();
+    if (this._list) {
+      this._list.forceUpdate();
 
       for (let i = 0; i < groupCount; i++) {
-        const group = this.refs.list.refs['group_' + String(i)] as GroupedListSection;
+        const group = this._list.refs['group_' + String(i)] as GroupedListSection;
         if (group) {
           group.forceListUpdate();
         }
@@ -284,12 +283,12 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
 
   @autobind
   private _getPageSpecification(itemIndex: number, visibleRect: IRectangle): {
-      key?: string;
+    key?: string;
   } {
     const groups = this.state.groups;
     const pageGroup = groups && groups[itemIndex];
     return {
-        key: pageGroup && pageGroup.name
+      key: pageGroup && pageGroup.name
     };
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
index 02fc48727e1df..2974a2a3d8d20 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
@@ -124,11 +124,8 @@ export interface IGroupedListSectionState {
 const DEFAULT_DROPPING_CSS_CLASS = 'is-dropping';
 
 export class GroupedListSection extends BaseComponent<IGroupedListSectionProps, IGroupedListSectionState> {
-  public refs: {
-    [key: string]: React.ReactInstance,
-    root: HTMLElement,
-    list: List
-  };
+  private _root: HTMLElement;
+  private _list: List;
 
   private _subGroups: {
     [key: string]: GroupedListSection;
@@ -151,7 +148,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
     const { dragDropHelper, selection } = this.props;
 
     if (dragDropHelper) {
-      this._dragDropSubscription = dragDropHelper.subscribe(this.refs.root, this._events, this._getGroupDragDropOptions());
+      this._dragDropSubscription = dragDropHelper.subscribe(this._root, this._events, this._getGroupDragDropOptions());
     }
 
     if (selection) {
@@ -175,7 +172,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
       }
 
       if (this.props.dragDropHelper) {
-        this._dragDropSubscription = this.props.dragDropHelper.subscribe(this.refs.root, this._events, this._getGroupDragDropOptions());
+        this._dragDropSubscription = this.props.dragDropHelper.subscribe(this._root, this._events, this._getGroupDragDropOptions());
       }
     }
   }
@@ -215,7 +212,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
 
     return (
       <div
-        ref='root'
+        ref={ this._resolveRef('_root') }
         className={ css('ms-GroupedList-group', styles.group, this._getDroppingClassName()) }
         role='presentation'
       >
@@ -227,7 +224,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
               hasNestedGroups ?
                 (
                   <List
-                    ref='list'
+                    ref={ this._resolveRef('_list') }
                     items={ group!.children }
                     onRenderCell={ this._renderSubGroup }
                     getItemCountForPage={ this._returnOne }
@@ -255,14 +252,14 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
   public forceListUpdate() {
     const { group } = this.props;
 
-    if (this.refs.list) {
-      this.refs.list.forceUpdate();
+    if (this._list) {
+      this._list.forceUpdate();
 
       if (group && group.children && group.children.length > 0) {
         const subGroupCount = group.children.length;
 
         for (let i = 0; i < subGroupCount; i++) {
-          const subGroup = this.refs.list.refs['subGroup_' + String(i)] as GroupedListSection;
+          const subGroup = this._list.refs['subGroup_' + String(i)] as GroupedListSection;
 
           if (subGroup) {
             subGroup.forceListUpdate();
@@ -325,7 +322,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
       <List
         items={ items }
         onRenderCell={ this._onRenderGroupCell(onRenderCell, groupNestingDepth) }
-        ref={ 'list' }
+        ref={ this._resolveRef('list') }
         renderCount={ Math.min(count, renderCount) }
         startIndex={ startIndex }
         onShouldVirtualize={ onShouldVirtualize }
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx
index 2b24ac48f8968..0d715d1af9ea0 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx
@@ -4,7 +4,7 @@ import {
   IGroup,
   IGroupDividerProps
 } from 'office-ui-fabric-react/lib/components/GroupedList/index';
-import { css } from 'office-ui-fabric-react/lib/Utilities';
+import { css, autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { Link } from 'office-ui-fabric-react/lib/Link';
 import { createListItems, createGroups } from '@uifabric/example-app-base';
 import { FontClassNames } from '../../../Styling';
@@ -14,6 +14,7 @@ let _items: any[];
 let _groups: IGroup[];
 
 export class GroupedListCustomExample extends React.Component {
+  private _groupedList: GroupedList;
 
   constructor(props: {}) {
     super(props);
@@ -25,7 +26,7 @@ export class GroupedListCustomExample extends React.Component {
   public render() {
     return (
       <GroupedList
-        ref='groupedList'
+        ref={ this._createGroupedListRef }
         items={ _items }
         onRenderCell={ this._onRenderCell }
         groupProps={
@@ -39,6 +40,11 @@ export class GroupedListCustomExample extends React.Component {
     );
   }
 
+  @autobind
+  private _createGroupedListRef(groupedList: GroupedList) {
+    this._groupedList = groupedList;
+  }
+
   private _onRenderCell(nestingDepth: number, item: any, itemIndex: number) {
     return (
       <div data-selection-index={ itemIndex }>
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index 9ab99cc74aed8..e09da24fb1883 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -88,10 +88,11 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
 
   public refs: {
     [key: string]: React.ReactInstance,
-    root: HTMLElement,
-    surface: HTMLElement
   };
 
+  private _root: HTMLElement;
+  private _surface: HTMLElement;
+
   private _estimatedPageHeight: number;
   private _totalEstimates: number;
   private _cachedPageHeights: {
@@ -262,10 +263,10 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
 
     this._updatePages();
     this._measureVersion++;
-    this._scrollElement = findScrollableParent(this.refs.root) as HTMLElement;
+    this._scrollElement = findScrollableParent(this._root) as HTMLElement;
 
     this._events.on(window, 'resize', this._onAsyncResize);
-    this._events.on(this.refs.root, 'focus', this._onFocus, true);
+    this._events.on(this._root, 'focus', this._onFocus, true);
     if (this._scrollElement) {
       this._events.on(this._scrollElement, 'scroll', this._onScroll);
       this._events.on(this._scrollElement, 'scroll', this._onAsyncScroll);
@@ -342,16 +343,14 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       pageElements.push(this._renderPage(page));
     }
 
-    // console.log(`Page elements ${pageElements.length}`);
-
     return (
       <div
-        ref='root'
+        ref={ this._resolveRef('_root') }
         { ...divProps }
         role={ (role === undefined) ? 'list' : role }
         className={ css('ms-List', className) }
       >
-        <div ref='surface' className={ css('ms-List-surface') } role='presentation'>
+        <div ref={ this._resolveRef('_surface') } className={ css('ms-List-surface') } role='presentation'>
           { pageElements }
         </div>
       </div>
@@ -478,7 +477,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   private _onFocus(ev: any) {
     let target = ev.target as HTMLElement;
 
-    while (target !== this.refs.surface) {
+    while (target !== this._surface) {
       const indexString = target.getAttribute('data-list-index');
 
       if (indexString) {
@@ -939,7 +938,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
       !scrollHeight ||
       scrollHeight !== this._scrollHeight ||
       Math.abs(this._scrollTop - scrollTop) > this._estimatedPageHeight / 3) {
-      surfaceRect = this._surfaceRect = _measureSurfaceRect(this.refs.surface);
+      surfaceRect = this._surfaceRect = _measureSurfaceRect(this._surface);
       this._scrollTop = scrollTop;
     }
 
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
index 72a441851f777..4ba53eb325c61 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
@@ -38,11 +38,7 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
     isEnabled: true
   };
 
-  public refs: {
-    [key: string]: React.ReactInstance;
-    root: HTMLElement;
-  };
-
+  private _root: HTMLDivElement;
   private _dragOrigin: IPoint | undefined;
   private _rootRect: IRectangle;
   private _lastMouseEvent: MouseEvent | undefined;
@@ -64,11 +60,11 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
   }
 
   public componentDidMount() {
-    this._scrollableParent = findScrollableParent(this.refs.root) as HTMLElement;
+    this._scrollableParent = findScrollableParent(this._root) as HTMLElement;
     this._scrollableSurface = (this._scrollableParent === window as any) ? document.body : this._scrollableParent;
     // When scroll events come from window, we need to read scrollTop values from the body.
 
-    const hitTarget = this.props.isDraggingConstrainedToRoot ? this.refs.root : this._scrollableSurface;
+    const hitTarget = this.props.isDraggingConstrainedToRoot ? this._root : this._scrollableSurface;
 
     this._events.on(
       hitTarget,
@@ -104,7 +100,7 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
           styles.root,
           rootProps && rootProps.className
         ) }
-        ref='root'
+        ref={ this._resolveRef('_root') }
       >
         { children }
         { dragRect && (<div className={ css('ms-MarqueeSelection-dragMask', styles.dragMask) } />) }
@@ -177,9 +173,9 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
         this._events.on(this._scrollableParent, 'scroll', this._onAsyncMouseMove);
         this._events.on(window, 'click', this._onMouseUp, true);
 
-        this._autoScroll = new AutoScroll(this.refs.root);
+        this._autoScroll = new AutoScroll(this._root);
         this._scrollTop = this._scrollableSurface.scrollTop;
-        this._rootRect = this.refs.root.getBoundingClientRect();
+        this._rootRect = this._root.getBoundingClientRect();
 
         this._onMouseMove(ev);
       }
@@ -314,7 +310,7 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
       return false;
     }
 
-    const allElements = this.refs.root.querySelectorAll('[data-selection-index]');
+    const allElements = this._root.querySelectorAll('[data-selection-index]');
     for (let i = 0; i < allElements.length; i++) {
       const element = allElements[i];
       const index = Number(element.getAttribute('data-selection-index'));
@@ -332,7 +328,7 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
   private _isInSelectionToggle(ev: MouseEvent): boolean {
     let element: HTMLElement | null = ev.target as HTMLElement;
 
-    while (element && element !== this.refs.root) {
+    while (element && element !== this._root) {
       if (element.getAttribute('data-selection-toggle') === 'true') {
         return true;
       }
@@ -350,7 +346,7 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
     }
 
     const { selection } = this.props;
-    const allElements = this.refs.root.querySelectorAll('[data-selection-index]');
+    const allElements = this._root.querySelectorAll('[data-selection-index]');
 
     if (!this._itemRectCache) {
       this._itemRectCache = {};
diff --git a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
index 720b5aa88f8ca..fbce41b190d11 100644
--- a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
+++ b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
@@ -19,10 +19,7 @@ export class Popup extends BaseComponent<IPopupProps, {}> {
     shouldRestoreFocus: true
   };
 
-  public refs: {
-    [key: string]: React.ReactInstance;
-    root: HTMLElement;
-  };
+  public _root: HTMLDivElement;
 
   private _originalFocusedElement: HTMLElement;
   private _containsFocus: boolean;
@@ -32,9 +29,9 @@ export class Popup extends BaseComponent<IPopupProps, {}> {
   }
 
   public componentDidMount(): void {
-    this._events.on(this.refs.root, 'focus', this._onFocus, true);
-    this._events.on(this.refs.root, 'blur', this._onBlur, true);
-    if (doesElementContainFocus(this.refs.root)) {
+    this._events.on(this._root, 'focus', this._onFocus, true);
+    this._events.on(this._root, 'blur', this._onBlur, true);
+    if (doesElementContainFocus(this._root)) {
       this._containsFocus = true;
     }
   }
@@ -58,13 +55,13 @@ export class Popup extends BaseComponent<IPopupProps, {}> {
     const { role, className, ariaLabel, ariaLabelledBy, ariaDescribedBy, style } = this.props;
 
     let needsVerticalScrollBar = false;
-    if (this.refs.root && this.refs.root.firstElementChild) {
-      needsVerticalScrollBar = this.refs.root.firstElementChild.clientHeight > this.refs.root.clientHeight;
+    if (this._root && this._root.firstElementChild) {
+      needsVerticalScrollBar = this._root.firstElementChild.clientHeight > this._root.clientHeight;
     }
 
     return (
       <div
-        ref='root'
+        ref={ this._resolveRef('_root') }
         { ...getNativeProps(this.props, divProperties) }
         className={ className }
         role={ role }
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
index 531f3eb2598a5..bc6f994b89434 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
@@ -29,13 +29,10 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
     scrollablePane: PropTypes.object
   };
 
-  public refs: {
-    root: HTMLElement;
-    stickyContainer: HTMLElement;
-    stickyAbove: HTMLElement;
-    stickyBelow: HTMLElement;
-  };
-
+  public root: HTMLElement;
+  public stickyContainer: HTMLElement;
+  public stickyAbove: HTMLElement;
+  public stickyBelow: HTMLElement;
   private _subscribers: Set<Function>;
   private _stickyAbove: Set<Sticky>;
   private _stickyBelow: Set<Sticky>;
@@ -62,26 +59,23 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
   }
 
   public componentDidMount() {
-    const { root, stickyContainer } = this.refs;
-
-    this._events.on(root, 'scroll', this.notifySubscribers);
+    this._events.on(this.root, 'scroll', this.notifySubscribers);
     this._events.on(window, 'resize', this._onWindowResize);
     this._async.setTimeout(() => {
       this._resizeContainer();
-      if (stickyContainer.parentElement && root.parentElement) {
-        stickyContainer.parentElement.removeChild(stickyContainer);
-        root.parentElement.insertBefore(stickyContainer, root.nextSibling);
+      if (this.stickyContainer.parentElement && this.root.parentElement) {
+        this.stickyContainer.parentElement.removeChild(this.stickyContainer);
+        this.root.parentElement.insertBefore(this.stickyContainer, this.root.nextSibling);
         this.notifySubscribers();
       }
     }, 500);
   }
 
   public componentWillUnmount() {
-    const { stickyContainer } = this.refs;
-    this._events.off(this.refs.root);
+    this._events.off(this.root);
     this._events.off(window);
-    if (stickyContainer.parentElement) {
-      stickyContainer.parentElement.removeChild(stickyContainer);
+    if (this.stickyContainer.parentElement) {
+      this.stickyContainer.parentElement.removeChild(this.stickyContainer);
     }
   }
 
@@ -96,13 +90,13 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
 
     return (
       <div
-        ref='root'
+        ref={ this._resolveRef('root') }
         className={ classNames.root }
         data-is-scrollable={ true }
       >
-        <div ref='stickyContainer' className={ classNames.stickyContainer }>
-          <div ref='stickyAbove' className={ classNames.stickyAbove } />
-          <div ref='stickyBelow' className={ classNames.stickyBelow } />
+        <div ref={ this._resolveRef('stickyContainer') } className={ classNames.stickyContainer }>
+          <div ref={ this._resolveRef('stickyAbove') } className={ classNames.stickyAbove } />
+          <div ref={ this._resolveRef('stickyBelow') } className={ classNames.stickyBelow } />
         </div>
         { this.props.children }
       </div>
@@ -125,41 +119,38 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
 
   @autobind
   public addStickyHeader(sticky: Sticky) {
-    const { stickyAbove } = this.refs;
-    this._addSticky(sticky, this._stickyAbove, stickyAbove, () => {
-      stickyAbove.appendChild(sticky.content);
+    this._addSticky(sticky, this._stickyAbove, this.stickyAbove, () => {
+      this.stickyAbove.appendChild(sticky.content);
     });
   }
 
   @autobind
   public addStickyFooter(sticky: Sticky) {
-    const { stickyBelow } = this.refs;
-    this._addSticky(sticky, this._stickyBelow, stickyBelow, () => {
-      stickyBelow.insertBefore(sticky.content, stickyBelow.firstChild);
+    this._addSticky(sticky, this._stickyBelow, this.stickyBelow, () => {
+      this.stickyBelow.insertBefore(sticky.content, this.stickyBelow.firstChild);
     });
   }
 
   @autobind
   public removeStickyHeader(sticky: Sticky) {
-    this._removeSticky(sticky, this._stickyAbove, this.refs.stickyAbove);
+    this._removeSticky(sticky, this._stickyAbove, this.stickyAbove);
   }
 
   @autobind
   public removeStickyFooter(sticky: Sticky) {
-    this._removeSticky(sticky, this._stickyBelow, this.refs.stickyBelow);
+    this._removeSticky(sticky, this._stickyBelow, this.stickyBelow);
   }
 
   @autobind
   public notifySubscribers(sort?: boolean): void {
-    const { stickyAbove, stickyBelow } = this.refs;
     this._subscribers.forEach((handle) => {
-      handle(stickyAbove.getBoundingClientRect(), stickyBelow.getBoundingClientRect());
+      handle(this.stickyAbove.getBoundingClientRect(), this.stickyBelow.getBoundingClientRect());
     });
     if (this._stickyAbove.size > 1) {
-      this._sortStickies(this._stickyAbove, stickyAbove);
+      this._sortStickies(this._stickyAbove, this.stickyAbove);
     }
     if (this._stickyBelow.size > 1) {
-      this._sortStickies(this._stickyBelow, stickyBelow);
+      this._sortStickies(this._stickyBelow, this.stickyBelow);
     }
   }
 
@@ -200,7 +191,7 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
   }
 
   private _resizeContainer() {
-    const { stickyContainer, root } = this.refs;
+    const { stickyContainer, root } = this;
     const { borderTopWidth, borderLeftWidth } = getComputedStyle(root);
     stickyContainer.style.height = root.clientHeight + 'px';
     stickyContainer.style.width = root.clientWidth + 'px';
@@ -222,8 +213,8 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
   private _sortStickies(stickyList: Set<Sticky>, container: HTMLElement): void {
     let stickyArr = Array.from(stickyList);
     stickyArr = stickyArr.sort((a, b) => {
-      const aOffset = this._calculateOffsetParent(a.refs.root);
-      const bOffset = this._calculateOffsetParent(b.refs.root);
+      const aOffset = this._calculateOffsetParent(a.root);
+      const bOffset = this._calculateOffsetParent(b.root);
       return aOffset - bOffset;
     });
     while (container.lastChild) {
@@ -236,7 +227,7 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
 
   private _calculateOffsetParent(ele: HTMLElement): number {
     let offset = 0;
-    while (ele.offsetParent !== this.refs.root.offsetParent) {
+    while (ele.offsetParent !== this.root.offsetParent) {
       offset += ele.offsetTop;
       if (ele.parentElement) {
         ele = ele.parentElement;
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
index 784b057a35214..b4303db6412e4 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
@@ -34,13 +34,8 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     buttonProps: {}
   };
 
-  public refs: {
-    [key: string]: React.ReactInstance,
-    root: HTMLElement,
-    sliderLine: HTMLElement,
-    thumb: HTMLElement
-  };
-
+  private _sliderLine: HTMLDivElement;
+  private _thumb: HTMLSpanElement;
   private _id: string;
 
   constructor(props: ISliderProps) {
@@ -102,7 +97,6 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
           ['ms-Slider-row ' + styles.rootIsHorizontal]: !vertical,
           ['ms-Slider-column ' + styles.rootIsVertical]: vertical
         }) }
-        ref='root'
       >
         { label && (
           <Label className={ styles.titleLabel } { ...ariaLabel ? {} : { 'htmlFor': this._id } }>
@@ -133,11 +127,11 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
             role='slider'
           >
             <div
-              ref='sliderLine'
+              ref={ this._resolveRef('_sliderLine') }
               className={ css('ms-Slider-line', styles.line) }
             >
               <span
-                ref='thumb'
+                ref={ this._resolveRef('_thumb') }
                 className={ css('ms-Slider-thumb', styles.thumb) }
                 style={ this._getThumbStyle(vertical, thumbOffsetPercent) }
               />
@@ -157,8 +151,8 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     ) as React.ReactElement<{}>;
   }
   public focus(): void {
-    if (this.refs.thumb) {
-      this.refs.thumb.focus();
+    if (this._thumb) {
+      this._thumb.focus();
     }
   }
 
@@ -196,7 +190,7 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
   private _onMouseMoveOrTouchMove(event: MouseEvent | TouchEvent, suppressEventCancelation?: boolean): void {
     const { max, min, step } = this.props;
     const steps: number = (max! - min!) / step!;
-    const sliderPositionRect: ClientRect = this.refs.sliderLine.getBoundingClientRect();
+    const sliderPositionRect: ClientRect = this._sliderLine.getBoundingClientRect();
     const sliderLength: number = !this.props.vertical ? sliderPositionRect.width : sliderPositionRect.height;
     const stepLength: number = sliderLength / steps;
     let currentSteps: number | undefined;
diff --git a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
index 02ecf1817ce41..2c5934ccba9c2 100644
--- a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
+++ b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
@@ -29,11 +29,6 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
     scrollablePane: PropTypes.object
   };
 
-  public refs: {
-    root: HTMLElement;
-    placeholder: HTMLElement;
-  };
-
   public context: {
     scrollablePane: {
       subscribe: (handler: Function) => void;
@@ -47,6 +42,7 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
   };
 
   public content: HTMLElement;
+  public root: HTMLElement;
 
   constructor(props: IStickyProps) {
     super(props);
@@ -66,7 +62,7 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
     this.content = document.createElement('div');
     this.content.style.background = this.props.stickyBackgroundColor || this._getBackground();
     ReactDOM.render(<div>{ this.props.children }</div>, this.content);
-    this.refs.root.appendChild(this.content);
+    this.root.appendChild(this.content);
     this.context.scrollablePane.notifySubscribers(true);
   }
 
@@ -134,15 +130,15 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
     const isSticky = isStickyTop || isStickyBottom;
 
     return (
-      <div ref='root'>
-        <div ref='placeholder' style={ { height: (isSticky ? placeholderHeight : 0) } } />
+      <div ref={ this._resolveRef('_root') }>
+        <div style={ { height: (isSticky ? placeholderHeight : 0) } } />
       </div>
     );
   }
 
   @autobind
   private _onScrollEvent(headerBound: ClientRect, footerBound: ClientRect) {
-    const { top, bottom } = this.refs.root.getBoundingClientRect();
+    const { top, bottom } = this.root.getBoundingClientRect();
     const { isStickyTop, isStickyBottom } = this.state;
     const { stickyPosition } = this.props;
     const canStickyHeader = stickyPosition === StickyPositionType.Both || stickyPosition === StickyPositionType.Header;
@@ -162,7 +158,7 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
   }
 
   private _resetSticky(callback: () => void) {
-    this.refs.root.appendChild(this.content);
+    this.root.appendChild(this.content);
     setTimeout(() => {
       if (this.props.stickyClassName) {
         this.content.children[0].classList.remove(this.props.stickyClassName);
@@ -173,7 +169,7 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
 
   // Gets background of nearest parent element that has a declared background-color attribute
   private _getBackground(): string | null {
-    let curr = this.refs.root;
+    let curr = this.root;
     while (window.getComputedStyle(curr).getPropertyValue('background-color') === 'rgba(0, 0, 0, 0)' ||
       window.getComputedStyle(curr).getPropertyValue('background-color') === 'transparent') {
       if (curr.tagName === 'HTML') {
diff --git a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
index 80c6c28973c0b..72501cbdbb86a 100644
--- a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
@@ -6,6 +6,7 @@ import { Callout } from 'office-ui-fabric-react/lib/Callout';
 import { DetailsList, DetailsListLayoutMode as LayoutMode } from 'office-ui-fabric-react/lib/DetailsList';
 import { SelectionMode } from 'office-ui-fabric-react/lib/Selection';
 import { ColorPicker, IColorPickerProps } from 'office-ui-fabric-react/lib/ColorPicker';
+import { autobind } from '../../Utilities';
 import './ThemePage.scss';
 const ThemeCodeExample = require('!raw-loader!office-ui-fabric-react/src/components/Theme/examples/ThemeCode.Example.tsx');
 
@@ -22,11 +23,7 @@ export class ThemePage extends React.Component<IComponentDemoPageProps, {
     index: number;
   };
 }> {
-
-  public refs: {
-    [key: string]: React.ReactInstance;
-    list: DetailsList;
-  };
+  private _list: DetailsList;
 
   constructor(props: {}) {
     super(props);
@@ -60,7 +57,7 @@ export class ThemePage extends React.Component<IComponentDemoPageProps, {
         <h1 className={ FontClassNames.xLarge }>Define a theme</h1>
         <div>
           <DetailsList
-            ref='list'
+            ref={ this._createDetailsListRef }
             items={ colors }
             selectionMode={ SelectionMode.none }
             layoutMode={ LayoutMode.fixedColumns }
@@ -115,6 +112,11 @@ export class ThemePage extends React.Component<IComponentDemoPageProps, {
     );
   }
 
+  @autobind
+  private _createDetailsListRef(component: DetailsList) {
+    this._list = component;
+  }
+
   private _onSwatchClicked(item: any, index: number, ev: React.MouseEvent<HTMLElement>) {
     this.setState({
       colorPickerProps: {
@@ -141,7 +143,7 @@ export class ThemePage extends React.Component<IComponentDemoPageProps, {
     loadTheme({ palette });
 
     // The theme has changed values, but color state is the same. Force an update on the list.
-    this.refs.list.forceUpdate();
+    this._list.forceUpdate();
   }
 
   private _onPickerDismiss() {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
index ceac517849b9a..51ef8626b1a7e 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
@@ -17,9 +17,10 @@ export interface IPeoplePickerItemState {
 export class SelectedItemWithMenu extends BaseComponent<IPeoplePickerItemWithMenuProps, IPeoplePickerItemState> {
   public refs: {
     [key: string]: any,
-    ellipsisRef: HTMLElement
   };
 
+  private _ellipsisRef: HTMLElement;
+
   constructor(props: IPeoplePickerItemWithMenuProps) {
     super(props);
     this.state = { contextualMenuVisible: false };
@@ -40,7 +41,7 @@ export class SelectedItemWithMenu extends BaseComponent<IPeoplePickerItemWithMen
               presence={ item.presence !== undefined ? item.presence : PersonaPresence.none }
             />
           </div>
-          <div ref='ellipsisRef' className={ css('ms-PickerItem-content', styles.itemContent) }>
+          <div ref={ this._resolveRef('_ellipsisRef') } className={ css('ms-PickerItem-content', styles.itemContent) }>
             <IconButton
               iconProps={ { iconName: 'More' } }
               onClick={ this._onContextualMenu }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
index da6797db596ec..798c45a35ce54 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
@@ -42,7 +42,6 @@ export class TagPickerBasicExample extends React.Component<{}, ITagPickerDemoPag
           onChange={ this._onDisabledButtonClick }
         />
         <TagPicker
-          ref='tagPicker'
           onResolveSuggestions={ this._onFilterChanged }
           getTextFromItem={ this._getTextFromItem }
           pickerSuggestionsProps={
diff --git a/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx b/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx
index a6e46052fa9af..339e8b16d5d1d 100644
--- a/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/decorators/withContainsFocus.tsx
@@ -4,10 +4,6 @@ import { BaseDecorator } from './BaseDecorator';
 export function withContainsFocus<TProps extends { containsFocus?: boolean }, S>(ComposedComponent: (new (props: TProps, ...args: any[]) => (React.Component<TProps, S>))): any {
 
   return class WithContainsFocusComponent extends BaseDecorator<TProps & { containsFocus?: boolean }, { containsFocus?: boolean }> {
-    public refs: {
-      [key: string]: React.ReactInstance,
-    };
-
     private _newContainsFocus: boolean;
     private _delayedSetContainsFocus: () => void;
 
@@ -32,7 +28,7 @@ export function withContainsFocus<TProps extends { containsFocus?: boolean }, S>
       const { containsFocus } = this.state;
 
       return (
-        <div ref='root' onFocus={ this._handleFocus } onBlur={ this._handleBlur }>
+        <div onFocus={ this._handleFocus } onBlur={ this._handleBlur }>
           <ComposedComponent
             ref={ this._updateComposedComponentRef }
             containsFocus={ containsFocus }
diff --git a/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx b/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx
index edfd68e72432a..146431253953f 100644
--- a/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx
@@ -24,10 +24,7 @@ const MAX_RESIZE_ATTEMPTS = 3;
 export function withViewport<TProps extends { viewport?: IViewport }, TState>(ComposedComponent: (new (props: TProps, ...args: any[]) => React.Component<TProps, TState>)): any {
 
   return class WithViewportComponent extends BaseDecorator<TProps, IWithViewportState> {
-    public refs: {
-      [key: string]: React.ReactInstance;
-    };
-
+    private _root: HTMLDivElement;
     private _resizeAttempts: number;
 
     constructor(props: TProps) {
@@ -71,7 +68,7 @@ export function withViewport<TProps extends { viewport?: IViewport }, TState>(Co
       const isViewportVisible = skipViewportMeasures || (viewport!.width > 0 && viewport!.height > 0);
 
       return (
-        <div className='ms-Viewport' ref='root' style={ { minWidth: 1, minHeight: 1 } }>
+        <div className='ms-Viewport' ref={ this._resolveRef('_root') } style={ { minWidth: 1, minHeight: 1 } }>
           { isViewportVisible && (
             <ComposedComponent ref={ this._updateComposedComponentRef } viewport={ viewport } { ...this.props as any } />
           ) }
@@ -90,7 +87,7 @@ export function withViewport<TProps extends { viewport?: IViewport }, TState>(Co
     /* Note: using lambda here because decorators don't seem to work in decorators. */
     private _updateViewport = (withForceUpdate?: boolean) => {
       const { viewport } = this.state;
-      const viewportElement = (this.refs as any).root;
+      const viewportElement = this._root;
       const scrollElement = findScrollableParent(viewportElement);
       const scrollRect = getRect(scrollElement);
       const clientRect = getRect(viewportElement);
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
index 52cf9bf8e6c1a..d75a8ab642185 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
@@ -59,11 +59,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     selectionMode: SelectionMode.multiple
   };
 
-  public refs: {
-    [key: string]: React.ReactInstance,
-    root: HTMLElement
-  };
-
+  private _root: HTMLDivElement;
   private _isCtrlPressed: boolean;
   private _isShiftPressed: boolean;
   private _isMetaPressed: boolean;
@@ -73,8 +69,8 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   private _isTouchTimeoutId: number | undefined;
 
   public componentDidMount() {
-    const win = getWindow(this.refs.root);
-    const scrollElement = findScrollableParent(this.refs.root);
+    const win = getWindow(this._root);
+    const scrollElement = findScrollableParent(this._root);
 
     // Track the latest modifier keys globally.
     this._events.on(win, 'keydown, keyup', this._updateModifiers, true);
@@ -87,7 +83,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     return (
       <div
         className='ms-SelectionZone'
-        ref='root'
+        ref={ this._resolveRef('_root') }
         onKeyDown={ this._onKeyDown }
         onMouseDown={ this._onMouseDown }
         onKeyDownCapture={ this._onKeyDownCapture }
@@ -124,13 +120,13 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
       return;
     }
 
-    if (!elementContains(ev.target, this.refs.root)) {
+    if (!elementContains(ev.target, this._root)) {
       return;
     }
 
     let target = ev.target as HTMLElement;
 
-    while (target !== this.refs.root) {
+    while (target !== this._root) {
       if (this._hasAttribute(target, SELECTION_INVOKE_ATTRIBUTE_NAME)) {
         this.ignoreNextFocus();
         break;
@@ -185,7 +181,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     let target = ev.target as HTMLElement;
     const itemRoot = this._findItemRoot(target);
 
-    while (target !== this.refs.root) {
+    while (target !== this._root) {
       if (this._hasAttribute(target, SELECTALL_TOGGLE_ALL_ATTRIBUTE_NAME)) {
         break;
       } else if (itemRoot) {
@@ -220,7 +216,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
       return;
     }
 
-    while (target !== this.refs.root) {
+    while (target !== this._root) {
       if (this._hasAttribute(target, SELECTALL_TOGGLE_ALL_ATTRIBUTE_NAME)) {
         this._onToggleAllClick(ev);
         break;
@@ -270,7 +266,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   }
 
   private _isSelectionDisabled(target: HTMLElement): boolean {
-    while (target !== this.refs.root) {
+    while (target !== this._root) {
       if (this._hasAttribute(target, SELECTION_DISABLED_ATTRIBUTE_NAME)) {
         return true;
       }
@@ -300,7 +296,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     if (itemRoot && onItemInvoked && selectionMode !== SelectionMode.none && !this._isInputElement(target)) {
       const index = this._getItemIndex(itemRoot);
 
-      while (target !== this.refs.root) {
+      while (target !== this._root) {
         if (
           this._hasAttribute(target, SELECTION_TOGGLE_ATTRIBUTE_NAME) ||
           this._hasAttribute(target, SELECTION_INVOKE_ATTRIBUTE_NAME)) {
@@ -368,7 +364,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     if (itemRoot) {
       const index = this._getItemIndex(itemRoot);
 
-      while (target !== this.refs.root) {
+      while (target !== this._root) {
         if (this._hasAttribute(target, SELECTION_TOGGLE_ATTRIBUTE_NAME)) {
           // For toggle elements, assuming they are rendered as buttons, they will generate a click event,
           // so we can no-op for any keydowns in this case.
@@ -515,7 +511,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   private _findItemRoot(target: HTMLElement): HTMLElement | undefined {
     const { selection } = this.props;
 
-    while (target !== this.refs.root) {
+    while (target !== this._root) {
       const indexValue = target.getAttribute(SELECTION_INDEX_ATTRIBUTE_NAME);
       const index = Number(indexValue);
 
@@ -526,7 +522,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
       target = getParent(target) as HTMLElement;
     }
 
-    if (target === this.refs.root) {
+    if (target === this._root) {
       return undefined;
     }
 
@@ -540,7 +536,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   private _hasAttribute(element: HTMLElement, attributeName: string): boolean {
     let isToggle = false;
 
-    while (!isToggle && element !== this.refs.root) {
+    while (!isToggle && element !== this._root) {
       isToggle = element.getAttribute(attributeName) === 'true';
       element = getParent(element) as HTMLElement;
     }
diff --git a/packages/office-ui-fabric-react/tslint.json b/packages/office-ui-fabric-react/tslint.json
index 29238d549d5e8..99a0d877e4b13 100644
--- a/packages/office-ui-fabric-react/tslint.json
+++ b/packages/office-ui-fabric-react/tslint.json
@@ -3,7 +3,6 @@
     "office-ui-fabric-react-tslint"
   ],
   "rules": {
-    "jsx-no-string-ref": false,
     "jsx-boolean-value": false,
     "jsx-ban-props": false,
     "max-line-length": [

From af4a2976ca729f9a7107ed7b05e7f0f5292f674f Mon Sep 17 00:00:00 2001
From: staylo8 <33881401+staylo8@users.noreply.github.com>
Date: Wed, 21 Feb 2018 17:02:53 -0800
Subject: [PATCH 1423/1641] Add imageErrorAs to icon (#4009)

* Add errorAs callback to Icon

* change name

* add change file

* Fix Build Errors

* Fix build errors

* fix bundle error WITH PERMISSION. And extend base component and props

* Make imageErrorAs type safe
---
 ...ylo-AddErrorAsToIcon_2018-02-16-22-54.json |  11 ++
 .../__snapshots__/ActivityItem.test.tsx.snap  |   2 -
 .../src/components/Breadcrumb/Breadcrumb.tsx  |   8 +-
 .../__snapshots__/Breadcrumb.test.tsx.snap    |   8 -
 .../src/components/Button/BaseButton.tsx      |  10 +-
 .../Button/__snapshots__/Button.test.tsx.snap |   3 -
 .../__snapshots__/Calendar.test.tsx.snap      |   4 -
 .../src/components/Check/Check.tsx            |  16 +-
 .../__snapshots__/Checkbox.test.tsx.snap      |   1 -
 .../__snapshots__/ComboBox.test.tsx.snap      |   1 -
 .../src/components/CommandBar/CommandBar.tsx  |   2 +-
 .../__snapshots__/CommandBar.test.tsx.snap    |   1 -
 .../__snapshots__/DatePicker.test.tsx.snap    |   1 -
 .../__snapshots__/DocumentCard.test.tsx.snap  |   1 -
 .../__snapshots__/Dropdown.test.tsx.snap      |   2 -
 .../src/components/Icon/Icon.tsx              | 167 ++++++++++--------
 .../src/components/Icon/Icon.types.ts         |   9 +-
 .../Icon/__snapshots__/Icon.test.tsx.snap     |   1 -
 .../__snapshots__/MessageBar.test.tsx.snap    |   1 -
 .../Nav/__snapshots__/Nav.test.tsx.snap       |   2 +-
 .../Rating/__snapshots__/Rating.test.tsx.snap |  10 --
 .../__snapshots__/SearchBox.test.tsx.snap     |   1 -
 .../__snapshots__/SpinButton.test.tsx.snap    |   2 -
 23 files changed, 135 insertions(+), 129 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/staylo-AddErrorAsToIcon_2018-02-16-22-54.json

diff --git a/common/changes/office-ui-fabric-react/staylo-AddErrorAsToIcon_2018-02-16-22-54.json b/common/changes/office-ui-fabric-react/staylo-AddErrorAsToIcon_2018-02-16-22-54.json
new file mode 100644
index 0000000000000..e86b4124bafa3
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/staylo-AddErrorAsToIcon_2018-02-16-22-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add imageErrorAs to IIconProps",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "staylo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap
index b3acb36fff522..e861f56071077 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap
@@ -173,7 +173,6 @@ exports[`ActivityItem renders compact with an icon correctly 1`] = `
   >
     <i
       aria-hidden={true}
-      aria-label={undefined}
       className=
 
           {
@@ -594,7 +593,6 @@ exports[`ActivityItem renders with an icon correctly 1`] = `
   >
     <i
       aria-hidden={true}
-      aria-label={undefined}
       className=
 
           {
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
index fa3dc54b318b7..d0ad7d5f3328e 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
@@ -101,10 +101,10 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
                     directionalHint: DirectionalHint.bottomLeftEdge
                   } }
                 />
-                { Icon({
-                  className: css('ms-Breadcrumb-chevron', styles.chevron),
-                  iconName: getRTL() ? 'ChevronLeft' : 'ChevronRight'
-                }) }
+                { <Icon
+                  className={ css('ms-Breadcrumb-chevron', styles.chevron) }
+                  iconName={ getRTL() ? 'ChevronLeft' : 'ChevronRight' }
+                /> }
               </li>
             ) }
             { renderedItems.map(
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
index 30ff42150359c..9ea260d7df8d6 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
@@ -44,7 +44,6 @@ exports[`Breadcrumb renders breadcumb correctly 1`] = `
             </span>
             <i
               aria-hidden={true}
-              aria-label={undefined}
               className=
                   ms-Breadcrumb-chevron
                   {
@@ -73,7 +72,6 @@ exports[`Breadcrumb renders breadcumb correctly 1`] = `
             </span>
             <i
               aria-hidden={true}
-              aria-label={undefined}
               className=
                   ms-Breadcrumb-chevron
                   {
@@ -102,7 +100,6 @@ exports[`Breadcrumb renders breadcumb correctly 1`] = `
             </span>
             <i
               aria-hidden={true}
-              aria-label={undefined}
               className=
                   ms-Breadcrumb-chevron
                   {
@@ -131,7 +128,6 @@ exports[`Breadcrumb renders breadcumb correctly 1`] = `
             </span>
             <i
               aria-hidden={true}
-              aria-label={undefined}
               className=
                   ms-Breadcrumb-chevron
                   {
@@ -253,7 +249,6 @@ exports[`Breadcrumb renders breadcumb correctly 2`] = `
               >
                 <i
                   aria-hidden={true}
-                  aria-label={undefined}
                   className=
                       ms-Button-icon
                       {
@@ -278,7 +273,6 @@ exports[`Breadcrumb renders breadcumb correctly 2`] = `
             </button>
             <i
               aria-hidden={true}
-              aria-label={undefined}
               className=
                   ms-Breadcrumb-chevron
                   {
@@ -307,7 +301,6 @@ exports[`Breadcrumb renders breadcumb correctly 2`] = `
             </span>
             <i
               aria-hidden={true}
-              aria-label={undefined}
               className=
                   ms-Breadcrumb-chevron
                   {
@@ -336,7 +329,6 @@ exports[`Breadcrumb renders breadcumb correctly 2`] = `
             </span>
             <i
               aria-hidden={true}
-              aria-label={undefined}
               className=
                   ms-Breadcrumb-chevron
                   {
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index dc4cdb3965e29..12e16ba182dcb 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -254,10 +254,12 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
        } = this.props;
 
     if (iconProps) {
-      return Icon({
-        ...iconProps,
-        className: this._classNames.icon
-      });
+      return (
+        <Icon
+          {...iconProps}
+          className={ this._classNames.icon }
+        />
+      );
     }
     return null;
   }
diff --git a/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
index 0fbc1378c8cfc..c2803b1370a6b 100644
--- a/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
@@ -180,7 +180,6 @@ exports[`Button renders CommandBarButton correctly 1`] = `
   >
     <i
       aria-hidden={true}
-      aria-label={undefined}
       className=
           ms-Button-icon
           {
@@ -227,7 +226,6 @@ exports[`Button renders CommandBarButton correctly 1`] = `
     </div>
     <i
       aria-hidden={true}
-      aria-label={undefined}
       className=
           ms-Button-menuIcon
           {
@@ -553,7 +551,6 @@ exports[`Button renders IconButton correctly 1`] = `
   >
     <i
       aria-hidden={true}
-      aria-label={undefined}
       className=
           ms-Button-icon
           {
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/__snapshots__/Calendar.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Calendar/__snapshots__/Calendar.test.tsx.snap
index 9bd37fc04426c..507065a96d6f5 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/__snapshots__/Calendar.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Calendar/__snapshots__/Calendar.test.tsx.snap
@@ -39,7 +39,6 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                 >
                   <i
                     aria-hidden={true}
-                    aria-label={undefined}
                     className=
 
                         {
@@ -60,7 +59,6 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                 >
                   <i
                     aria-hidden={true}
-                    aria-label={undefined}
                     className=
 
                         {
@@ -916,7 +914,6 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                 >
                   <i
                     aria-hidden={true}
-                    aria-label={undefined}
                     className=
 
                         {
@@ -936,7 +933,6 @@ exports[`Calendar Test rendering simplest calendar Renders simple calendar corre
                 >
                   <i
                     aria-hidden={true}
-                    aria-label={undefined}
                     className=
 
                         {
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.tsx b/packages/office-ui-fabric-react/src/components/Check/Check.tsx
index 0875ec362247a..9f4357908ad39 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.tsx
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.tsx
@@ -49,14 +49,14 @@ export class Check extends BaseComponent<ICheckProps, {}> {
           }
         ) }
       >
-        { Icon({
-          className: 'ms-Check-circle ' + styles.circle,
-          iconName: 'CircleRing'
-        }) }
-        { Icon({
-          className: 'ms-Check-check ' + styles.check,
-          iconName: 'StatusCircleCheckmark'
-        }) }
+        { <Icon
+          className={ 'ms-Check-circle ' + styles.circle }
+          iconName={ 'CircleRing' }
+        /> }
+        { <Icon
+          className={ 'ms-Check-check ' + styles.check }
+          iconName={ 'StatusCircleCheckmark' }
+        /> }
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
index 56ab252f499ae..01505cb4f7b2f 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/__snapshots__/Checkbox.test.tsx.snap
@@ -106,7 +106,6 @@ exports[`Checkbox renders Checkbox correctly 1`] = `
     >
       <i
         aria-hidden={true}
-        aria-label={undefined}
         className=
 
             {
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
index 410413b8d2791..3230dce46f29d 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
@@ -243,7 +243,6 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
       >
         <i
           aria-hidden={true}
-          aria-label={undefined}
           className=
               ms-Button-icon
               {
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 19f7244a8808d..33f96ef5ce1e7 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -97,7 +97,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
               'ms-CommandBarSearch-iconWrapper ms-CommandBarSearch-iconSearchWrapper',
               styles.searchIconWrapper, styles.searchIconSearchWrapper) }
           >
-            { Icon({ iconName: 'Search' }) }
+            { <Icon iconName={ 'Search' } /> }
           </div>
           <div
             className={ css(
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap b/packages/office-ui-fabric-react/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
index 1d75d3b33a5d1..89282c08b05c9 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
@@ -40,7 +40,6 @@ exports[`CommandBar renders CommandBar correctly 1`] = `
           </span>
           <i
             aria-hidden={true}
-            aria-label={undefined}
             className=
                 ms-CommandBarItem-chevronDown
                 {
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap
index 213d16b79fbc4..9f3ccff2170c4 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/__snapshots__/DatePicker.test.tsx.snap
@@ -38,7 +38,6 @@ exports[`DatePicker renders default DatePicker correctly 1`] = `
           />
           <i
             aria-hidden={true}
-            aria-label={undefined}
             className=
                 ms-DatePicker-event--without-label
                 {
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap b/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap
index a60ae4c7ac5c2..d68c9fef76266 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap
@@ -48,7 +48,6 @@ exports[`DocumentCard renders DocumentCard correctly 1`] = `
             >
               <i
                 aria-hidden={true}
-                aria-label={undefined}
                 className=
 
                     {
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap
index 89eb9f638d7c5..219f16707a7dd 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap
@@ -35,7 +35,6 @@ exports[`Dropdown multi-select Renders multiselect Dropdown correctly 1`] = `
     >
       <i
         aria-hidden={true}
-        aria-label={undefined}
         className=
             ms-Dropdown-caretDown
             {
@@ -84,7 +83,6 @@ exports[`Dropdown single-select Renders single-select Dropdown correctly 1`] = `
     >
       <i
         aria-hidden={true}
-        aria-label={undefined}
         className=
             ms-Dropdown-caretDown
             {
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
index 4f14e0030802e..c85f56289bd8f 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
@@ -3,87 +3,112 @@ import * as React from 'react';
 /* tslint:enable */
 import { IIconProps, IconType } from './Icon.types';
 import { Image } from '../Image/Image';
+import { ImageLoadState } from '../Image/Image.types';
 import {
   css,
   getNativeProps,
-  htmlElementProperties
+  htmlElementProperties,
+  BaseComponent
 } from '../../Utilities';
 import { getIcon, IIconRecord } from '../../Styling';
 import { getClassNames } from './Icon.classNames';
 
-export const Icon = (props: IIconProps): JSX.Element => {
-  const {
-    ariaLabel,
-    className,
-    styles,
-    iconName
-   } = props;
-  const classNames = getClassNames(
-    styles
-  );
+export interface IIconState {
+  imageLoadError: boolean;
+}
 
-  if (props.iconType === IconType.image || props.iconType === IconType.Image) {
-    const containerClassName = css(
-      'ms-Icon-imageContainer',
-      classNames.root,
-      classNames.imageContainer,
-      className
-    );
+export class Icon extends BaseComponent<IIconProps, IIconState> {
+  constructor(props: IIconProps) {
+    super(props);
+    this.state = {
+      imageLoadError: false,
+    };
+  }
 
-    return (
-      <div
-        className={
-          css(
-            containerClassName,
-            classNames.root
-          ) }
-      >
-        <Image { ...props.imageProps as any } />
-      </div>
-    );
-  } else if (typeof iconName === 'string' && iconName.length === 0) {
-    return (
-      <i
-        aria-label={ ariaLabel }
-        { ...(ariaLabel ? {} : {
-          role: 'presentation',
-          'aria-hidden': true
-        }) }
-        { ...getNativeProps(props, htmlElementProperties) }
-        className={
-          css(
-            'ms-Icon-placeHolder',
-            classNames.rootHasPlaceHolder,
-            props.className
-          ) }
-      />
+  public render() {
+    const {
+    ariaLabel,
+      className,
+      styles,
+      iconName,
+      imageErrorAs,
+   } = this.props;
+    const classNames = getClassNames(
+      styles
     );
-  } else {
-    const iconDefinition = getIcon(iconName) || {
-      subset: {
-        className: undefined
-      },
-      code: undefined
+
+    const containerProps = ariaLabel ? { 'aria-label': ariaLabel, 'data-icon-name': iconName, } : {
+      role: 'presentation',
+      'aria-hidden': true,
+      'data-icon-name': iconName,
     };
 
-    return (
-      <i
-        aria-label={ ariaLabel }
-        { ...(ariaLabel ? {} : {
-          role: 'presentation',
-          'aria-hidden': true,
-          'data-icon-name': iconName,
-        }) }
-        { ...getNativeProps(props, htmlElementProperties) }
-        className={
-          css(
-            iconDefinition.subset.className,
-            classNames.root,
-            props.className
-          ) }
-      >
-        { iconDefinition.code }
-      </i>
-    );
+    if (this.props.iconType === IconType.image || this.props.iconType === IconType.Image) {
+      const containerClassName = css(
+        'ms-Icon-imageContainer',
+        classNames.root,
+        classNames.imageContainer,
+        className
+      );
+      const { imageLoadError } = this.state;
+      const imageProps = { ...this.props.imageProps, onLoadingStateChange: this.onImageLoadingStateChange };
+      const ImageType = imageLoadError && imageErrorAs || Image;
+      return (
+        <div
+          {...containerProps}
+          className={
+            css(
+              containerClassName,
+              classNames.root
+            ) }
+        >
+          <ImageType { ...imageProps } />
+        </div>
+      );
+    } else if (typeof iconName === 'string' && iconName.length === 0) {
+      return (
+        <i
+          {...containerProps}
+          { ...getNativeProps(this.props, htmlElementProperties) }
+          className={
+            css(
+              'ms-Icon-placeHolder',
+              classNames.rootHasPlaceHolder,
+              this.props.className
+            ) }
+        />
+      );
+    } else {
+      const iconDefinition = getIcon(iconName) || {
+        subset: {
+          className: undefined
+        },
+        code: undefined
+      };
+
+      return (
+        <i
+          {...containerProps}
+          { ...getNativeProps(this.props, htmlElementProperties) }
+          className={
+            css(
+              iconDefinition.subset.className,
+              classNames.root,
+              this.props.className
+            ) }
+        >
+          { iconDefinition.code }
+        </i>
+      );
+    }
+  }
+
+  private onImageLoadingStateChange = (state: ImageLoadState): void => {
+    if (this.props.imageProps && this.props.imageProps.onLoadingStateChange) {
+      this.props.imageProps.onLoadingStateChange(state);
+    }
+    if (state === ImageLoadState.error) {
+      this.setState({ imageLoadError: true });
+    }
   }
-};
+}
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.types.ts b/packages/office-ui-fabric-react/src/components/Icon/Icon.types.ts
index c776f1cfcee22..378e791046a08 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.types.ts
@@ -1,6 +1,8 @@
 import * as React from 'react';
 import { IImageProps } from '../Image/Image.types';
 import { IStyle } from '../../Styling';
+import { Icon } from './Icon';
+import { IBaseProps } from '../../Utilities';
 
 // Please keep alphabetized
 export enum IconType {
@@ -34,7 +36,7 @@ export interface IIconStyles {
   imageContainer?: IStyle;
 }
 
-export interface IIconProps extends React.HTMLAttributes<HTMLElement> {
+export interface IIconProps extends IBaseProps, React.HTMLAttributes<HTMLElement> {
   /**
    * The name of the icon to use from the icon font. If string is empty, a placeholder icon will be rendered the same width as an icon
    */
@@ -65,4 +67,9 @@ export interface IIconProps extends React.HTMLAttributes<HTMLElement> {
    * @memberOf IIconProps
    */
   imageProps?: IImageProps;
+
+  /**
+   * If rendering an image icon, this function callback will be invoked in the event loading the image errors.
+   */
+  imageErrorAs?: React.StatelessComponent<IImageProps> | React.ComponentClass<IImageProps>;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Icon/__snapshots__/Icon.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Icon/__snapshots__/Icon.test.tsx.snap
index 3b1bc246f9721..ab530ac055dbe 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/__snapshots__/Icon.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Icon/__snapshots__/Icon.test.tsx.snap
@@ -3,7 +3,6 @@
 exports[`Icon renders Icon correctly 1`] = `
 <i
   aria-hidden={true}
-  aria-label={undefined}
   className=
 
       {
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/__snapshots__/MessageBar.test.tsx.snap b/packages/office-ui-fabric-react/src/components/MessageBar/__snapshots__/MessageBar.test.tsx.snap
index 582e808dec4c9..c7ffb8da96dab 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/__snapshots__/MessageBar.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/__snapshots__/MessageBar.test.tsx.snap
@@ -14,7 +14,6 @@ exports[`MessageBar renders MessageBar correctly 1`] = `
     >
       <i
         aria-hidden={true}
-        aria-label={undefined}
         className=
 
             {
diff --git a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
index dc17a9038bfb2..eedb9cc7b26a8 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
@@ -164,7 +164,6 @@ exports[`Nav renders Nav correctly 1`] = `
                 >
                   <i
                     aria-hidden={true}
-                    aria-label={undefined}
                     className=
                         ms-Icon-placeHolder
                         ms-Button-icon
@@ -184,6 +183,7 @@ exports[`Nav renders Nav correctly 1`] = `
                           text-align: center;
                           vertical-align: middle;
                         }
+                    data-icon-name=""
                     role="presentation"
                   />
                   <div
diff --git a/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap
index 18c3c11fa90a0..686bdd8cd9267 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Rating/__snapshots__/Rating.test.tsx.snap
@@ -106,7 +106,6 @@ exports[`Rating Renders Rating correctly 1`] = `
       >
         <i
           aria-hidden={true}
-          aria-label={undefined}
           className=
               ms-RatingStar-back
               {
@@ -121,7 +120,6 @@ exports[`Rating Renders Rating correctly 1`] = `
         />
         <i
           aria-hidden={true}
-          aria-label={undefined}
           className=
               ms-RatingStar-front
               {
@@ -231,7 +229,6 @@ exports[`Rating Renders Rating correctly 1`] = `
       >
         <i
           aria-hidden={true}
-          aria-label={undefined}
           className=
               ms-RatingStar-back
               {
@@ -246,7 +243,6 @@ exports[`Rating Renders Rating correctly 1`] = `
         />
         <i
           aria-hidden={true}
-          aria-label={undefined}
           className=
               ms-RatingStar-front
               {
@@ -356,7 +352,6 @@ exports[`Rating Renders Rating correctly 1`] = `
       >
         <i
           aria-hidden={true}
-          aria-label={undefined}
           className=
               ms-RatingStar-back
               {
@@ -371,7 +366,6 @@ exports[`Rating Renders Rating correctly 1`] = `
         />
         <i
           aria-hidden={true}
-          aria-label={undefined}
           className=
               ms-RatingStar-front
               {
@@ -481,7 +475,6 @@ exports[`Rating Renders Rating correctly 1`] = `
       >
         <i
           aria-hidden={true}
-          aria-label={undefined}
           className=
               ms-RatingStar-back
               {
@@ -496,7 +489,6 @@ exports[`Rating Renders Rating correctly 1`] = `
         />
         <i
           aria-hidden={true}
-          aria-label={undefined}
           className=
               ms-RatingStar-front
               {
@@ -606,7 +598,6 @@ exports[`Rating Renders Rating correctly 1`] = `
       >
         <i
           aria-hidden={true}
-          aria-label={undefined}
           className=
               ms-RatingStar-back
               {
@@ -621,7 +612,6 @@ exports[`Rating Renders Rating correctly 1`] = `
         />
         <i
           aria-hidden={true}
-          aria-label={undefined}
           className=
               ms-RatingStar-front
               {
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
index 92af36c12bd50..ca2d164525dc7 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
@@ -56,7 +56,6 @@ exports[`SearchBox renders SearchBox correctly 1`] = `
   >
     <i
       aria-hidden={true}
-      aria-label={undefined}
       className=
           ms-SearchBox-icon
           {
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
index 1d61c9ea5b854..d75698525e6eb 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
@@ -229,7 +229,6 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
         >
           <i
             aria-hidden={true}
-            aria-label={undefined}
             className=
                 ms-Button-icon
                 {
@@ -335,7 +334,6 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
         >
           <i
             aria-hidden={true}
-            aria-label={undefined}
             className=
                 ms-Button-icon
                 {

From fa5626d6b1cfe17646f78927746b34c3efeb06a9 Mon Sep 17 00:00:00 2001
From: kellygorr <kegorr@microsoft.com>
Date: Wed, 21 Feb 2018 18:40:13 -0800
Subject: [PATCH 1424/1641] DatePicker: onAfterMenuDismiss callback (#4054)

* no message

* no message

* Added callback for menu dismiss and added example

* Change file
---
 ...atePicker-OnAfterMenuDismiss_2018-02-21-18-51.json | 11 +++++++++++
 .../src/components/DatePicker/DatePicker.tsx          |  7 +++++++
 .../src/components/DatePicker/DatePicker.types.ts     |  5 +++++
 .../DatePicker/examples/DatePicker.Basic.Example.tsx  |  9 ++++++++-
 4 files changed, 31 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/kegorr-DatePicker-OnAfterMenuDismiss_2018-02-21-18-51.json

diff --git a/common/changes/office-ui-fabric-react/kegorr-DatePicker-OnAfterMenuDismiss_2018-02-21-18-51.json b/common/changes/office-ui-fabric-react/kegorr-DatePicker-OnAfterMenuDismiss_2018-02-21-18-51.json
new file mode 100644
index 0000000000000..0b8b7f7237f9e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/kegorr-DatePicker-OnAfterMenuDismiss_2018-02-21-18-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DatePicker-onAfterMenuDismiss callback created",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "kegorr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 8f0b16e9285f4..9327e3a4c7051 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -178,6 +178,13 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     }
   }
 
+  public componentDidUpdate(prevProps: IDatePickerProps, prevState: IDatePickerState) {
+    // If DatePicker's menu (Calendar) is closed, run onAfterMenuDismiss
+    if (this.props.onAfterMenuDismiss && prevState.isDatePickerShown && !this.state.isDatePickerShown) {
+      this.props.onAfterMenuDismiss();
+    }
+  }
+
   public render() {
     const {
       firstDayOfWeek,
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
index 4fe60996f7864..590ec481a33a4 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
@@ -170,6 +170,11 @@ export interface IDatePickerProps extends React.Props<DatePicker> {
    * The initially highlighted date in the calendar picker
    */
   initialPickerDate?: Date;
+
+  /**
+ * Callback that runs after DatePicker's menu (Calendar) is closed
+ */
+  onAfterMenuDismiss?: () => void;
 }
 
 export interface IDatePickerStrings {
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx
index 4218f5276044c..2376899485f21 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx
@@ -79,7 +79,14 @@ export class DatePickerBasicExample extends React.Component<{}, IDatePickerBasic
 
     return (
       <div>
-        <DatePicker firstDayOfWeek={ firstDayOfWeek } strings={ DayPickerStrings } placeholder='Select a date...' />
+        <DatePicker
+          firstDayOfWeek={ firstDayOfWeek }
+          strings={ DayPickerStrings }
+          placeholder='Select a date...'
+          // tslint:disable:jsx-no-lambda
+          onAfterMenuDismiss={ () => console.log('onAfterMenuDismiss called') }
+        // tslint:enable:jsx-no-lambda
+        />
         <Dropdown
           label='Select the first day of the week'
           options={ [

From 08066258199e0de38a145777aeee1e0a31fd057b Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 21 Feb 2018 21:27:59 -0800
Subject: [PATCH 1425/1641] Fixing calendar keyboarding which was broken in the
 refs PR (#4065)

* Fixing ref issue introduced in Calendar.

* Adding change file.

* Updating the Datepicker.
---
 .../fix-calendar_2018-02-22-03-16.json        | 11 ++++++++
 .../src/components/Calendar/Calendar.tsx      | 28 +++++++++----------
 .../src/components/Calendar/CalendarDay.tsx   |  6 +++-
 .../src/components/Calendar/CalendarMonth.tsx |  8 ++++--
 .../src/components/DatePicker/DatePicker.tsx  | 17 +++++------
 5 files changed, 45 insertions(+), 25 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-calendar_2018-02-22-03-16.json

diff --git a/common/changes/office-ui-fabric-react/fix-calendar_2018-02-22-03-16.json b/common/changes/office-ui-fabric-react/fix-calendar_2018-02-22-03-16.json
new file mode 100644
index 0000000000000..5d6c00c33b14e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-calendar_2018-02-22-03-16.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Calendar: changing refs to componentRef.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index 0a7286e9f7255..ce71fc0bcabb5 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -1,8 +1,8 @@
 import * as React from 'react';
 import { ICalendar, ICalendarProps, ICalendarStrings, ICalendarIconStrings, ICalendarFormatDateCallbacks } from './Calendar.types';
 import { DayOfWeek, FirstWeekOfYear, DateRangeType } from '../../utilities/dateValues/DateValues';
-import { CalendarDay } from './CalendarDay';
-import { CalendarMonth } from './CalendarMonth';
+import { CalendarDay, ICalendarDay } from './CalendarDay';
+import { CalendarMonth, ICalendarMonth } from './CalendarMonth';
 import { compareDates, getDateRangeArray } from '../../utilities/dateMath/DateMath';
 import {
   autobind,
@@ -71,9 +71,9 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     workWeekDays: defaultWorkWeekDays
   };
 
-  public root: HTMLElement;
-  public dayPicker: CalendarDay;
-  public monthPicker: CalendarMonth;
+  private _root: HTMLElement;
+  private _dayPicker: ICalendarDay;
+  private _monthPicker: ICalendarMonth;
 
   private _focusOnUpdate: boolean;
 
@@ -113,10 +113,10 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
   public componentDidUpdate() {
     if (this._focusOnUpdate) {
       // if the day picker is shown, focus on it
-      if (this.dayPicker) {
-        this.dayPicker.focus();
-      } else if (this.monthPicker) {
-        this.monthPicker.focus();
+      if (this._dayPicker) {
+        this._dayPicker.focus();
+      } else if (this._monthPicker) {
+        this._monthPicker.focus();
       }
       this._focusOnUpdate = false;
     }
@@ -131,7 +131,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     const overlayedWithButton = showMonthPickerAsOverlay && showGoToToday;
 
     return (
-      <div className={ css(rootClass, styles.root) } ref={ this._resolveRef('root') } role='application'>
+      <div className={ css(rootClass, styles.root) } ref={ this._resolveRef('_root') } role='application'>
         <div
           className={ css(
             'ms-DatePicker-picker ms-DatePicker-picker--opened ms-DatePicker-picker--focused',
@@ -167,7 +167,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   minDate={ minDate }
                   maxDate={ maxDate }
                   workWeekDays={ this.props.workWeekDays }
-                  ref={ this._resolveRef('_dayPicker') }
+                  componentRef={ this._resolveRef('_dayPicker') }
                 />
                 }
 
@@ -182,7 +182,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   dateTimeFormatter={ this.props.dateTimeFormatter! }
                   minDate={ minDate }
                   maxDate={ maxDate }
-                  ref={ this._resolveRef('monthPicker') }
+                  componentRef={ this._resolveRef('_monthPicker') }
                 /> }
 
                 { showGoToToday &&
@@ -205,8 +205,8 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
   }
 
   public focus() {
-    if (this.dayPicker) {
-      this.dayPicker.focus();
+    if (this._dayPicker) {
+      this._dayPicker.focus();
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index 5515c6acab311..a368a2564d5f8 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -43,8 +43,12 @@ export interface IDayInfo {
   onSelected: () => void;
 }
 
+export interface ICalendarDay {
+  focus(): void;
+}
+
 export interface ICalendarDayProps extends React.Props<CalendarDay> {
-  componentRef?: () => void;
+  componentRef?: (c: ICalendarDay) => void;
   strings: ICalendarStrings;
   selectedDate: Date;
   navigatedDate: Date;
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
index 2aad369f0f16f..44e48726bd984 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
@@ -13,8 +13,12 @@ import { Icon } from '../../Icon';
 import * as stylesImport from './Calendar.scss';
 const styles: any = stylesImport;
 
+export interface ICalendarMonth {
+  focus(): void;
+}
+
 export interface ICalendarMonthProps extends React.Props<CalendarMonth> {
-  componentRef?: () => void;
+  componentRef?: (c: ICalendarMonth) => void;
   navigatedDate: Date;
   strings: ICalendarStrings;
   onNavigateDate: (date: Date, focusOnNavigatedDay: boolean) => void;
@@ -33,7 +37,7 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
     navigatedMonth: HTMLElement;
   };
 
-  private _selectMonthCallbacks: (() => void) [];
+  private _selectMonthCallbacks: (() => void)[];
 
   public constructor(props: ICalendarMonthProps) {
     super(props);
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 9327e3a4c7051..13545cc6157f5 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -5,12 +5,13 @@ import {
 } from './DatePicker.types';
 import {
   Calendar,
+  ICalendar,
   DayOfWeek
 } from '../../Calendar';
 import { FirstWeekOfYear } from '../../utilities/dateValues/DateValues';
 import { Callout } from '../../Callout';
 import { DirectionalHint } from '../../common/DirectionalHint';
-import { TextField } from '../../TextField';
+import { TextField, ITextField } from '../../TextField';
 import { Label } from '../../Label';
 import {
   autobind,
@@ -121,9 +122,9 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
   };
 
   private _root: HTMLElement;
-  private _calendar: Calendar;
-  private _datepicker: HTMLDivElement;
-  private _textField: TextField;
+  private _calendar: ICalendar;
+  private _datePickerDiv: HTMLDivElement;
+  private _textField: ITextField;
   private _preventFocusOpeningPicker: boolean;
   private _focusOnSelectedDateOnUpdate: boolean;
 
@@ -210,7 +211,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
         { label && (
           <Label required={ isRequired }>{ label }</Label>
         ) }
-        <div ref={ this._resolveRef('_datepicker') }>
+        <div ref={ this._resolveRef('_datePickerDiv') }>
           <TextField
             className={ styles.textField }
             ariaLabel={ ariaLabel }
@@ -237,7 +238,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
             } }
             readOnly={ !allowTextInput }
             value={ formattedDate }
-            ref={ this._resolveRef('_textField') }
+            componentRef={ this._resolveRef('_textField') }
             role={ allowTextInput ? 'combobox' : 'menu' }
           />
         </div>
@@ -249,7 +250,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
             className={ css('ms-DatePicker-callout') }
             gapSpace={ 0 }
             doNotLayer={ false }
-            target={ this._datepicker }
+            target={ this._datePickerDiv }
             directionalHint={ DirectionalHint.bottomLeftEdge }
             onDismiss={ this._calendarDismissed }
             onPositioned={ this._onCalloutPositioned }
@@ -271,7 +272,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
               dateTimeFormatter={ this.props.dateTimeFormatter }
               minDate={ minDate }
               maxDate={ maxDate }
-              ref={ this._resolveRef('_calendar') }
+              componentRef={ this._resolveRef('_calendar') }
             />
           </Callout>
         ) }

From 5a6a38cab63704b1e499078495ca1f8dbce7fa7d Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 21 Feb 2018 21:48:25 -0800
Subject: [PATCH 1426/1641] Update package.json

---
 scripts/package.json | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/scripts/package.json b/scripts/package.json
index c1cd1387bd3e3..8e5639e2f79d3 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -49,7 +49,7 @@
   "bundlesize": [
     {
       "path": "../apps/test-bundle-button/dist/main.min.js",
-      "maxSize": "43.3 kB"
+      "maxSize": "43.6 kB"
     }
   ]
-}
\ No newline at end of file
+}

From 7ff46ee4fe64b303d6a4845b404ee16f909ac847 Mon Sep 17 00:00:00 2001
From: Mark Polak <mark@thedutchies.com>
Date: Thu, 22 Feb 2018 06:49:11 +0100
Subject: [PATCH 1427/1641] Enable var name and boolean value (#4052)

* Enable variable-name and jsx-boolean-value

* Add npm change file

* Update shades.ts
---
 ...-var-name-and-boolean-value_2018-02-21-18-12.json | 11 +++++++++++
 .../src/components/SpinButton/SpinButton.tsx         |  2 +-
 .../examples/SpinButton.Stateful.Example.tsx         | 12 ++++++------
 .../src/utilities/color/shades.ts                    | 10 +++++-----
 packages/office-ui-fabric-react/tslint.json          |  2 --
 5 files changed, 23 insertions(+), 14 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/enable-var-name-and-boolean-value_2018-02-21-18-12.json

diff --git a/common/changes/office-ui-fabric-react/enable-var-name-and-boolean-value_2018-02-21-18-12.json b/common/changes/office-ui-fabric-react/enable-var-name-and-boolean-value_2018-02-21-18-12.json
new file mode 100644
index 0000000000000..6ca7e51f82d50
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/enable-var-name-and-boolean-value_2018-02-21-18-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Enable variable-name and jsx-boolean-value tslint rules",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index 6d61f99d8697e..8057bb0474ef0 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -375,7 +375,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
    * @param stepFunction - function to use to step by
    */
   @autobind
-  private _updateValue(shouldSpin: boolean, stepDelay: number, stepFunction: (string: string) => string | void) {
+  private _updateValue(shouldSpin: boolean, stepDelay: number, stepFunction: (value: string) => string | void) {
     const newValue: string | void = stepFunction(this.state.value);
     if (newValue) {
       this._lastValidValue = newValue;
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
index 43816d66f1136..85bc98d29a718 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/examples/SpinButton.Stateful.Example.tsx
@@ -34,16 +34,16 @@ export class SpinButtonStatefulExample extends React.Component<any, any> {
     );
   }
 
-  private _hasSuffix(string: string, suffix: string): Boolean {
-    const subString = string.substr(string.length - suffix.length);
+  private _hasSuffix(value: string, suffix: string): Boolean {
+    const subString = value.substr(value.length - suffix.length);
     return subString === suffix;
   }
 
-  private _removeSuffix(string: string, suffix: string): string {
-    if (!this._hasSuffix(string, suffix)) {
-      return string;
+  private _removeSuffix(value: string, suffix: string): string {
+    if (!this._hasSuffix(value, suffix)) {
+      return value;
     }
 
-    return string.substr(0, string.length - suffix.length);
+    return value.substr(0, value.length - suffix.length);
   }
 }
diff --git a/packages/office-ui-fabric-react/src/utilities/color/shades.ts b/packages/office-ui-fabric-react/src/utilities/color/shades.ts
index f03e41b77595b..49d5bbd437fa7 100644
--- a/packages/office-ui-fabric-react/src/utilities/color/shades.ts
+++ b/packages/office-ui-fabric-react/src/utilities/color/shades.ts
@@ -23,8 +23,8 @@ const ColorTintTable = [.07, .18, .436, .751, .956]; // default soften
 const ColorShadeTable = [.90, .64, .550]; // default strongen
 
 // If the given shade's luminance is below/above these values, we'll swap to using the White/Black tables above
-const c_LuminanceLow = 0.2;
-const c_LuminanceHigh = 0.8;
+const LowLuminanceThreshold = 0.2;
+const HighLuminanceThreshold = 0.8;
 
 /** Shades of a given color, from softest to strongest. */
 export enum Shade {
@@ -117,9 +117,9 @@ export function getShade(color: IColor, shade: Shade, isInverted = false) {
     hsl = _darken(hsl, WhiteShadeTable[tableIndex]);
   } else if (_isBlack(color)) { // black
     hsl = _lighten(hsl, BlackTintTable[tableIndex]);
-  } else if (hsl.l / 100 > c_LuminanceHigh) { // light
+  } else if (hsl.l / 100 > HighLuminanceThreshold) { // light
     hsl = _strongen(hsl, LumShadeTable[tableIndex]);
-  } else if (hsl.l / 100 < c_LuminanceLow) { // dark
+  } else if (hsl.l / 100 < LowLuminanceThreshold) { // dark
     hsl = _soften(hsl, LumTintTable[tableIndex]);
   } else { // default
     if (tableIndex < ColorTintTable.length) {
@@ -188,4 +188,4 @@ export function getContrastRatio(color1: IColor, color2: IColor) {
   // return the lighter color divided by darker
   return L1 / L2 > 1 ?
     L1 / L2 : L2 / L1;
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/tslint.json b/packages/office-ui-fabric-react/tslint.json
index 99a0d877e4b13..c62ddc630d659 100644
--- a/packages/office-ui-fabric-react/tslint.json
+++ b/packages/office-ui-fabric-react/tslint.json
@@ -3,14 +3,12 @@
     "office-ui-fabric-react-tslint"
   ],
   "rules": {
-    "jsx-boolean-value": false,
     "jsx-ban-props": false,
     "max-line-length": [
       false,
       140
     ],
     "no-any": false,
-    "variable-name": false,
     "typedef": [
       false
     ],

From 67730082e1053486ae59876f24c7ee639b4ca251 Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Wed, 21 Feb 2018 22:32:52 -0800
Subject: [PATCH 1428/1641] [TooltipHost] display: inline for when overflow
 mode is on (#3911)

* [TooltipHost] Inline display for overflow content

* Change file

* Removed undfined classname from snapshot

* Update Tooltip.Overflow.Example.tsx
---
 ...llan-fixTooltipOverflow_2018-02-07-22-42.json | 11 +++++++++++
 .../src/components/Tooltip/TooltipHost.scss      |  4 ++++
 .../src/components/Tooltip/TooltipHost.tsx       | 16 +++++++++++-----
 .../examples/Tooltip.Overflow.Example.tsx        |  2 +-
 4 files changed, 27 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/magellan-fixTooltipOverflow_2018-02-07-22-42.json

diff --git a/common/changes/office-ui-fabric-react/magellan-fixTooltipOverflow_2018-02-07-22-42.json b/common/changes/office-ui-fabric-react/magellan-fixTooltipOverflow_2018-02-07-22-42.json
new file mode 100644
index 0000000000000..90452728ae475
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/magellan-fixTooltipOverflow_2018-02-07-22-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "[TooltipHost] Inline display for when overflow mode is on\"",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.scss b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.scss
index 34c9bd6c04168..567120d040ce7 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.scss
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.scss
@@ -8,4 +8,8 @@
 
 .host {
   display: inline-block;
+}
+
+.hostOverflow {
+  display: inline;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
index 7a2ef55eee8cf..549019c510b50 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
@@ -43,21 +43,27 @@ export class TooltipHost extends BaseComponent<ITooltipHostProps, ITooltipHostSt
   public render() {
     const {
       calloutProps,
-      tooltipProps,
-      content,
       children,
+      content,
+      delay,
       directionalHint,
       directionalHintForRTL,
-      delay,
+      hostClassName,
       id,
+      overflowMode,
       setAriaDescribedBy = true,
-      hostClassName
+      tooltipProps
     } = this.props;
     const { isTooltipVisible } = this.state;
     const tooltipId = id || getId('tooltip');
+
     return (
       <div
-        className={ css('ms-TooltipHost', styles.host, hostClassName) }
+        className={ css('ms-TooltipHost',
+          styles.host,
+          hostClassName,
+          overflowMode !== undefined && styles.hostOverflow
+        ) }
         ref={ this._resolveRef('_tooltipHost') }
         { ...{ onFocusCapture: this._onTooltipMouseEnter } }
         { ...{ onBlurCapture: this._onTooltipMouseLeave } }
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/examples/Tooltip.Overflow.Example.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/examples/Tooltip.Overflow.Example.tsx
index c6338df2b0bcb..6bfdbe2e5c776 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/examples/Tooltip.Overflow.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/examples/Tooltip.Overflow.Example.tsx
@@ -58,4 +58,4 @@ export class TooltipOverflowExample extends BaseComponent<{}, ITooltipOverflowEx
       </div>
     );
   }
-}
\ No newline at end of file
+}

From b0550145231d18adea954f56be47967ab04cb19d Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Wed, 21 Feb 2018 23:11:06 -0800
Subject: [PATCH 1429/1641] FocusZone: Add the ability for directional no
 wrapping (#3962)

* Add the ability for FocusZones to not wrap (vertically or horizontally) when they get to the bounds of the zone

* update the example to make it more clear the changes I'm making

* rush change

* remove unneeded resolution

* Remove an extra change from a different issue I'm working on

* Update jspurlin-FocusZoneAddWrapProps_2018-02-13-16-53.json

updated the contents of the change file

* Update jspurlin-FocusZoneAddWrapProps_2018-02-13-16-53.json

add missing comma

* Address feedback

* Update dom.ts

* change let to const

* Add FocusZoneProps for ContextualMenu

* fix test and add missing semicolon

* update the max bundle size

* update example to include key... must be a new rule

* bumping the bundle size that went up due to the merge from master

* add a missing line

* Update FocusZone.tsx

* update incorrectly cased variable
---
 ...ocusZoneAddWrapProps_2018-02-13-16-53.json |  11 +
 ...ocusZoneAddWrapProps_2018-02-13-16-53.json |  11 +
 .../ContextualMenu/ContextualMenu.test.tsx    |   4 +-
 .../ContextualMenu/ContextualMenu.tsx         |  57 ++-
 .../ContextualMenu/ContextualMenu.types.ts    |  12 +-
 .../ContextualMenu/ContextualMenuPage.tsx     |   8 +
 ...alMenu.CustomizationWithNoWrap.Example.tsx | 234 ++++++++++++
 .../components/FocusZone/FocusZone.test.tsx   | 334 ++++++++++++++++++
 .../src/components/FocusZone/FocusZone.tsx    |  52 ++-
 .../components/FocusZone/FocusZone.types.ts   |   7 +
 packages/utilities/src/dom.ts                 |  25 ++
 packages/utilities/src/focus.ts               |  13 +-
 scripts/package.json                          |   4 +-
 13 files changed, 742 insertions(+), 30 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/jspurlin-FocusZoneAddWrapProps_2018-02-13-16-53.json
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-FocusZoneAddWrapProps_2018-02-13-16-53.json
 create mode 100644 packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomizationWithNoWrap.Example.tsx

diff --git a/common/changes/@uifabric/utilities/jspurlin-FocusZoneAddWrapProps_2018-02-13-16-53.json b/common/changes/@uifabric/utilities/jspurlin-FocusZoneAddWrapProps_2018-02-13-16-53.json
new file mode 100644
index 0000000000000..2574a45378c67
--- /dev/null
+++ b/common/changes/@uifabric/utilities/jspurlin-FocusZoneAddWrapProps_2018-02-13-16-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Focus/DOM: add the ability to find if an element (or any ancestor) contains a given attribute. Also, add a shouldrWapFocus function to the focus utility (which leverages the fild element attribute just described) which returns true if the given no wrap data attribute (data-no-vertical-wrap OR data-no-horizontal-wrap) exists and is set to true",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "jspurlin@microsoft.com"
+}
diff --git a/common/changes/office-ui-fabric-react/jspurlin-FocusZoneAddWrapProps_2018-02-13-16-53.json b/common/changes/office-ui-fabric-react/jspurlin-FocusZoneAddWrapProps_2018-02-13-16-53.json
new file mode 100644
index 0000000000000..61a72b95ce1ba
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-FocusZoneAddWrapProps_2018-02-13-16-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "FocusZone: Add the ability turn off directional wrapping on sections of a FocusZone",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
index 57d37f382db25..435a4f8d7f78d 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
@@ -84,7 +84,7 @@ describe('ContextualMenu', () => {
         items={ items }
         isSubMenu={ true }
         onDismiss={ onDismissSpy }
-        arrowDirection={ FocusZoneDirection.horizontal }
+        focusZoneProps={ { direction: FocusZoneDirection.horizontal } }
       />
     );
 
@@ -110,7 +110,7 @@ describe('ContextualMenu', () => {
         items={ items }
         isSubMenu={ true }
         onDismiss={ onDismissSpy }
-        arrowDirection={ FocusZoneDirection.horizontal }
+        focusZoneProps={ { direction: FocusZoneDirection.bidirectional } }
       />
     );
 
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 65f4ac27d065e..34f04a285937c 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { IContextualMenuProps, IContextualMenuItem, ContextualMenuItemType } from './ContextualMenu.types';
 import { DirectionalHint } from '../../common/DirectionalHint';
-import { FocusZone, FocusZoneDirection } from '../../FocusZone';
+import { FocusZone, FocusZoneDirection, IFocusZoneProps } from '../../FocusZone';
 import {
   IMenuItemClassNames,
   IContextualMenuClassNames,
@@ -25,7 +25,8 @@ import {
   customizable,
   getFirstFocusable,
   getLastFocusable,
-  css
+  css,
+  shouldWrapFocus
 } from '../../Utilities';
 import { withResponsiveMode, ResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
 import { Callout } from '../../Callout';
@@ -36,6 +37,7 @@ import {
 import {
   VerticalDivider
 } from '../../Divider';
+
 export interface IContextualMenuState {
   expandedMenuItemKey?: string;
   dismissedMenuItemKey?: string;
@@ -109,8 +111,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     gapSpace: 0,
     directionalHint: DirectionalHint.bottomAutoEdge,
     beakWidth: 16,
-    arrowDirection: FocusZoneDirection.vertical,
-    getMenuClassNames: getContextualMenuClassNames,
+    getMenuClassNames: getContextualMenuClassNames
   };
 
   private _host: HTMLElement;
@@ -124,6 +125,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   private readonly _scrollIdleDelay: number = 250 /* ms */;
   private _scrollIdleTimeoutId: number | undefined;
 
+  private _adjustedFocusZoneProps: IFocusZoneProps;
+
   constructor(props: IContextualMenuProps) {
     super(props);
 
@@ -135,6 +138,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     this._warnDeprecations({
       'targetPoint': 'target',
       'useTargetPoint': 'target',
+      'arrowDirection': 'focusZoneProps'
     });
 
     this._isFocusingPreviousElement = false;
@@ -220,7 +224,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       styles: customStyles,
       theme,
       calloutProps,
-      onRenderSubMenu = this._onRenderSubMenu
+      onRenderSubMenu = this._onRenderSubMenu,
+      focusZoneProps
     } = this.props;
 
     const menuClassNames = this.props.getMenuClassNames || getContextualMenuClassNames;
@@ -242,6 +247,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       return false;
     }
 
+    this._adjustedFocusZoneProps = { ...focusZoneProps, direction: this._getFocusZoneDirection() };
+
     const hasCheckmarks = canAnyMenuItemsCheck(items);
     const submenuProps = this.state.expandedMenuItemKey ? this._getSubmenuProps() : null;
 
@@ -309,8 +316,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
             { title && <div className={ this._classNames.title } role='heading' aria-level={ 1 }> { title } </div> }
             { (items && items.length) ? (
               <FocusZone
+                {...this._adjustedFocusZoneProps }
                 className={ this._classNames.root }
-                direction={ arrowDirection }
                 isCircularNavigation={ true }
                 allowTabKey={ true }
               >
@@ -340,6 +347,19 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     }
   }
 
+  /**
+   * Gets the focusZoneDirection by using the arrowDirection if specified,
+   * the direction specificed in the focusZoneProps, or defaults to FocusZoneDirection.vertical
+   */
+  private _getFocusZoneDirection() {
+    const {
+      arrowDirection,
+      focusZoneProps
+    } = this.props;
+    return arrowDirection !== undefined ? arrowDirection :
+      focusZoneProps && focusZoneProps.direction !== undefined ? focusZoneProps.direction : FocusZoneDirection.vertical;
+  }
+
   private _onRenderSubMenu(subMenuProps: IContextualMenuProps) {
     return <ContextualMenu { ...subMenuProps } />;
   }
@@ -678,12 +698,10 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
   @autobind
   private _onKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
-    const submenuCloseKey = getRTL() ? KeyCodes.right : KeyCodes.left;
-
-    if (ev.which === KeyCodes.escape
-      || ev.altKey
-      || ev.metaKey
-      || (ev.which === submenuCloseKey && this.props.isSubMenu && this.props.arrowDirection === FocusZoneDirection.vertical)) {
+    if (ev.which === KeyCodes.escape ||
+      ev.altKey ||
+      ev.metaKey ||
+      this._shouldCloseSubMenu(ev)) {
       // When a user presses escape, we will try to refocus the previous focused element.
       this._isFocusingPreviousElement = true;
       ev.preventDefault();
@@ -692,6 +710,21 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     }
   }
 
+  /**
+   * Checks if the submenu should be closed
+   */
+  @autobind
+  private _shouldCloseSubMenu(ev: React.KeyboardEvent<HTMLElement>): boolean {
+    const submenuCloseKey = getRTL() ? KeyCodes.right : KeyCodes.left;
+
+    if (ev.which !== submenuCloseKey || !this.props.isSubMenu) {
+      return false;
+    }
+
+    return this._adjustedFocusZoneProps.direction === FocusZoneDirection.vertical ||
+      (!!this._adjustedFocusZoneProps.checkForNoWrap && !shouldWrapFocus(ev.target as HTMLElement, 'data-no-horizontal-wrap'));
+  }
+
   @autobind
   private _onMenuKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
     if (ev.which === KeyCodes.escape || ev.altKey || ev.metaKey) {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
index ad1289a135fcf..7e6ebb098f4cd 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { ContextualMenu } from './ContextualMenu';
 import { DirectionalHint } from '../../common/DirectionalHint';
-import { FocusZoneDirection } from '../../FocusZone';
+import { FocusZoneDirection, IFocusZoneProps } from '../../FocusZone';
 import { IIconProps } from '../Icon/Icon.types';
 import { ICalloutProps } from '../../Callout';
 import { ITheme, IStyle } from '../../Styling';
@@ -169,7 +169,7 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
 
   /**
    * Direction for arrow navigation of the ContextualMenu. Should only be specified if using custom-rendered menu items.
-   * @default FocusZoneDirection.vertical
+   * @deprecated Use focusZoneProps instead
    */
   arrowDirection?: FocusZoneDirection;
 
@@ -219,6 +219,14 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
 
   /** Method to call when trying to render a submenu. */
   onRenderSubMenu?: IRenderFunction<IContextualMenuProps>;
+
+  /**
+   * Props to pass down to the FocusZone.
+   * NOTE: the default FocusZoneDirection will be used unless a direction
+   * is specified in the focusZoneProps (even if other focusZoneProps are defined)
+   * @default {direction: FocusZoneDirection.vertical}
+   */
+  focusZoneProps?: IFocusZoneProps;
 }
 
 export interface IContextualMenuItem {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
index 1281e932a2d14..109736bdae362 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
@@ -9,6 +9,7 @@ import { ContextualMenuBasicExample } from './examples/ContextualMenu.Basic.Exam
 import { ContextualMenuIconExample } from './examples/ContextualMenu.Icon.Example';
 import { ContextualMenuSectionExample } from './examples/ContextualMenu.Section.Example';
 import { ContextualMenuSubmenuExample } from './examples/ContextualMenu.Submenu.Example';
+import { ContextualMenuCustomizationWithNoWrapExample } from './examples/ContextualMenu.CustomizationWithNoWrap.Example';
 import { ContextualMenuCheckmarksExample } from './examples/ContextualMenu.Checkmarks.Example';
 import { ContextualMenuDirectionalExample } from './examples/ContextualMenu.Directional.Example';
 import { ContextualMenuCustomizationExample } from './examples/ContextualMenu.Customization.Example';
@@ -20,6 +21,7 @@ const ContextualMenuBasicExampleCode = require('!raw-loader!office-ui-fabric-rea
 const ContextualMenuIconExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.Example.tsx') as string;
 const ContextualMenuSectionExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx') as string;
 const ContextualMenuSubmenuExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Submenu.Example.tsx') as string;
+const ContextualMenuCustomizationWithNoWrapExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomizationWithNoWrap.Example.tsx') as string;
 const ContextualMenuCheckmarksExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx') as string;
 const ContextualMenuDirectionalExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx') as string;
 const ContextualMenuCustomizationExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx') as string;
@@ -76,6 +78,12 @@ export class ContextualMenuPage extends React.Component<IComponentDemoPageProps,
             >
               <ContextualMenuCustomizationExample />
             </ExampleCard>
+            <ExampleCard
+              title='ContextualMenu with customized submenus and noWrap attributes'
+              code={ ContextualMenuSubmenuExampleCode }
+            >
+              <ContextualMenuCustomizationWithNoWrapExample />
+            </ExampleCard>
             <ExampleCard
               title='ContextualMenu with a scroll bar and fixed direction'
               code={ ContextualMenuWithScrollBarExampleCode }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomizationWithNoWrap.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomizationWithNoWrap.Example.tsx
new file mode 100644
index 0000000000000..b5f6f22705843
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomizationWithNoWrap.Example.tsx
@@ -0,0 +1,234 @@
+import * as React from 'react';
+import { DirectionalHint, ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { DefaultButton, IconButton, IButton } from 'office-ui-fabric-react/lib/Button';
+import { FocusZoneDirection } from 'office-ui-fabric-react/lib/FocusZone';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+import './ContextualMenuExample.scss';
+
+export class ContextualMenuCustomizationWithNoWrapExample extends React.Component<{}, {}> {
+  public render() {
+    return (
+      <DefaultButton
+        className='ContextualMenuButton3'
+        text='Click for ContextualMenu'
+        menuProps={
+          {
+            shouldFocusOnMount: true,
+            directionalHint: DirectionalHint.bottomLeftEdge,
+            className: 'ms-ContextualMenu-customizationExample',
+            items:
+              [
+                {
+                  key: 'newItem',
+                  name: 'New'
+                },
+                {
+                  key: 'upload',
+                  name: 'Upload'
+                },
+                {
+                  key: 'divider_1',
+                  itemType: ContextualMenuItemType.Divider
+                },
+                {
+                  key: 'charm',
+                  name: 'Charm',
+                  className: 'Charm-List',
+                  subMenuProps: {
+                    focusZoneProps: {
+                      direction: FocusZoneDirection.bidirectional,
+                      checkForNoWrap: true
+                    },
+                    items: [
+                      {
+                        key: 'bulb',
+                        name: 'Lightbulb',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'run',
+                        name: 'Running',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'plane',
+                        name: 'Airplane',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'page',
+                        name: 'Page',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'cake',
+                        name: 'Cake',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'soccer',
+                        name: 'Soccer',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'home',
+                        name: 'Home',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'emoji',
+                        name: 'Emoji2',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'work',
+                        name: 'Work',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'coffee',
+                        name: 'Coffee',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'people',
+                        name: 'People',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'stopwatch',
+                        name: 'Stopwatch',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'music',
+                        name: 'MusicInCollectionFill',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'lock',
+                        name: 'Lock',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'item3',
+                        name: 'Item 3',
+                        'data-no-horizontal-wrap': true
+                      },
+                      {
+                        key: 'item4',
+                        name: 'Item 4',
+                        'data-no-horizontal-wrap': true
+                      },
+                    ]
+                  },
+                },
+                {
+                  key: 'categories',
+                  name: 'Categorize',
+                  subMenuProps: {
+                    items: [
+                      {
+                        key: 'categories',
+                        name: 'categories',
+                        categoryList: [
+                          {
+                            name: 'Personal',
+                            color: 'yellow'
+                          },
+                          {
+                            name: 'Work',
+                            color: 'green'
+                          },
+                          {
+                            name: 'Birthday',
+                            color: 'blue'
+                          },
+                          {
+                            name: 'Spam',
+                            color: 'grey'
+                          },
+                          {
+                            name: 'Urgent',
+                            color: 'red'
+                          },
+                          {
+                            name: 'Hobbies',
+                            color: 'black'
+                          },
+                        ],
+                        onRender: this._renderCategoriesList
+                      },
+                      {
+                        key: 'divider_1',
+                        itemType: ContextualMenuItemType.Divider
+                      },
+                      {
+                        key: 'clear',
+                        name: 'Clear categories'
+                      },
+                      {
+                        key: 'manage',
+                        name: 'Manage categories'
+                      }
+                    ]
+                  },
+                }
+              ]
+          }
+        }
+
+      />
+    );
+  }
+
+  @autobind
+  private _renderCharmMenuItem(item: any, dismissMenu: () => void) {
+    return (
+      <IconButton
+        {...item}
+        iconProps={ { iconName: item.name } }
+        className='ms-ContextualMenu-customizationExample-icon ms-ContextualMenu-link'
+        data-is-focusable={ true }
+        onClick={ dismissMenu }
+        data-no-vertical-wrap={ true }
+      />
+    );
+  }
+
+  private _renderCategoriesList(item: any) {
+    return (
+      <ul className='ms-ContextualMenu-customizationExample-categoriesList'>
+        <li className='ms-ContextualMenu-item'>
+          { item.categoryList.map((category: any) =>
+            <button key={ category.name } className='ms-ContextualMenu-link' role='menuitem'>
+              <div>
+                <span
+                  className='ms-ContextualMenu-icon ms-ContextualMenu-customizationExample-categorySwatch'
+                  style={ { backgroundColor: category.color } }
+                />
+                <span className='ms-ContextualMenu-itemText'>
+                  { category.name }
+                </span>
+              </div>
+            </button>
+          ) }
+        </li>
+      </ul>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
index ce4ef11a8c89e..df4efe0a93dc1 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
@@ -354,6 +354,340 @@ describe('FocusZone', () => {
     expect(lastFocusedElement).toBe(buttonA);
   });
 
+  it('can use arrows bidirectionally with data-no-vertical-wrap', () => {
+    const component = ReactTestUtils.renderIntoDocument(
+      <div { ...{ onFocusCapture: _onFocus } }>
+        <FocusZone checkForNoWrap={ true } data-no-vertical-wrap={ true }>
+          <button className='a'>a</button>
+          <button className='b'>b</button>
+          <button className='c'>c</button>
+          <button className='d'>d</button>
+        </FocusZone>
+      </div>
+    );
+
+    const focusZone = ReactDOM.findDOMNode(component as React.ReactInstance).firstChild as Element;
+    const buttonA = focusZone.querySelector('.a') as HTMLElement;
+    const buttonB = focusZone.querySelector('.b') as HTMLElement;
+    const buttonC = focusZone.querySelector('.c') as HTMLElement;
+    const buttonD = focusZone.querySelector('.d') as HTMLElement;
+
+    // Set up a grid like so:
+    // A B
+    // C D
+    setupElement(buttonA, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 0,
+        right: 20
+      }
+    });
+
+    setupElement(buttonB, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 20,
+        right: 40
+      }
+    });
+
+    setupElement(buttonC, {
+      clientRect: {
+        top: 20,
+        bottom: 40,
+        left: 0,
+        right: 20
+      }
+    });
+
+    setupElement(buttonD, {
+      clientRect: {
+        top: 20,
+        bottom: 40,
+        left: 20,
+        right: 40
+      }
+    });
+
+    // Focus the first button.
+    ReactTestUtils.Simulate.focus(buttonA);
+    expect(lastFocusedElement).toBe(buttonA);
+
+    // Pressing up should stay on a.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
+    expect(lastFocusedElement).toBe(buttonA);
+
+    // Pressing left should stay on a.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
+    expect(lastFocusedElement).toBe(buttonA);
+
+    // Pressing right should go to b.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    expect(lastFocusedElement).toBe(buttonB);
+
+    // Pressing down should go to d.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
+    expect(lastFocusedElement).toBe(buttonD);
+
+    // Pressing down stay on d.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
+    expect(lastFocusedElement).toBe(buttonD);
+
+    // Pressing right stay on d.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    expect(lastFocusedElement).toBe(buttonD);
+
+    // Pressing left should go to c.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
+    expect(lastFocusedElement).toBe(buttonC);
+
+    // Pressing down should stay on c.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
+    expect(lastFocusedElement).toBe(buttonC);
+
+    // Pressing left should go to b.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
+    expect(lastFocusedElement).toBe(buttonB);
+
+    // Pressing up should stay on b.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
+    expect(lastFocusedElement).toBe(buttonB);
+
+    // Pressing right should go to c.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    expect(lastFocusedElement).toBe(buttonC);
+  });
+
+  it('can use arrows bidirectionally with data-no-horizontal-wrap', () => {
+    const component = ReactTestUtils.renderIntoDocument(
+      <div { ...{ onFocusCapture: _onFocus } }>
+        <FocusZone checkForNoWrap={ true } data-no-horizontal-wrap={ true }>
+          <button className='a'>a</button>
+          <button className='b'>b</button>
+          <button className='c'>c</button>
+          <button className='d'>d</button>
+        </FocusZone>
+      </div>
+    );
+
+    const focusZone = ReactDOM.findDOMNode(component as React.ReactInstance).firstChild as Element;
+    const buttonA = focusZone.querySelector('.a') as HTMLElement;
+    const buttonB = focusZone.querySelector('.b') as HTMLElement;
+    const buttonC = focusZone.querySelector('.c') as HTMLElement;
+    const buttonD = focusZone.querySelector('.d') as HTMLElement;
+
+    // Set up a grid like so:
+    // A B
+    // C D
+    setupElement(buttonA, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 0,
+        right: 20
+      }
+    });
+
+    setupElement(buttonB, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 20,
+        right: 40
+      }
+    });
+
+    setupElement(buttonC, {
+      clientRect: {
+        top: 20,
+        bottom: 40,
+        left: 0,
+        right: 20
+      }
+    });
+
+    setupElement(buttonD, {
+      clientRect: {
+        top: 20,
+        bottom: 40,
+        left: 20,
+        right: 40
+      }
+    });
+
+    // Focus the first button.
+    ReactTestUtils.Simulate.focus(buttonA);
+    expect(lastFocusedElement).toBe(buttonA);
+
+    // Pressing up should stay on a.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
+    expect(lastFocusedElement).toBe(buttonA);
+
+    // Pressing left should stay on a.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
+    expect(lastFocusedElement).toBe(buttonA);
+
+    // Pressing right should go to b.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    expect(lastFocusedElement).toBe(buttonB);
+
+    // Pressing right should stay on b.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    expect(lastFocusedElement).toBe(buttonB);
+
+    // Pressing down should go to d.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
+    expect(lastFocusedElement).toBe(buttonD);
+
+    // Pressing down stay on d.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
+    expect(lastFocusedElement).toBe(buttonD);
+
+    // Pressing right stay on d.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    expect(lastFocusedElement).toBe(buttonD);
+
+    // Pressing left should go to c.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
+    expect(lastFocusedElement).toBe(buttonC);
+
+    // Pressing left should stay on c.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
+    expect(lastFocusedElement).toBe(buttonC);
+
+    // Pressing down should go to d.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
+    expect(lastFocusedElement).toBe(buttonD);
+
+    // Pressing left should go to c.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
+    expect(lastFocusedElement).toBe(buttonC);
+
+    // Pressing left should go to a.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
+    expect(lastFocusedElement).toBe(buttonA);
+
+    // Pressing left should go to b.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    expect(lastFocusedElement).toBe(buttonB);
+
+    // Pressing up should go to a.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
+    expect(lastFocusedElement).toBe(buttonA);
+  });
+
+  it('can use arrows bidirectionally with data-no-horizontal-wrap and data-no-vertical-wrap', () => {
+    const component = ReactTestUtils.renderIntoDocument(
+      <div { ...{ onFocusCapture: _onFocus } }>
+        <FocusZone checkForNoWrap={ true } data-no-horizontal-wrap={ true } data-no-vertical-wrap={ true }>
+          <button className='a'>a</button>
+          <button className='b'>b</button>
+          <button className='c'>c</button>
+          <button className='d'>d</button>
+        </FocusZone>
+      </div>
+    );
+
+    const focusZone = ReactDOM.findDOMNode(component as React.ReactInstance).firstChild as Element;
+    const buttonA = focusZone.querySelector('.a') as HTMLElement;
+    const buttonB = focusZone.querySelector('.b') as HTMLElement;
+    const buttonC = focusZone.querySelector('.c') as HTMLElement;
+    const buttonD = focusZone.querySelector('.d') as HTMLElement;
+
+    // Set up a grid like so:
+    // A B
+    // C D
+    setupElement(buttonA, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 0,
+        right: 20
+      }
+    });
+
+    setupElement(buttonB, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 20,
+        right: 40
+      }
+    });
+
+    setupElement(buttonC, {
+      clientRect: {
+        top: 20,
+        bottom: 40,
+        left: 0,
+        right: 20
+      }
+    });
+
+    setupElement(buttonD, {
+      clientRect: {
+        top: 20,
+        bottom: 40,
+        left: 20,
+        right: 40
+      }
+    });
+
+    // Focus the first button.
+    ReactTestUtils.Simulate.focus(buttonA);
+    expect(lastFocusedElement).toBe(buttonA);
+
+    // Pressing up should stay on a.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
+    expect(lastFocusedElement).toBe(buttonA);
+
+    // Pressing left should stay on a.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
+    expect(lastFocusedElement).toBe(buttonA);
+
+    // Pressing right should go to b.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    expect(lastFocusedElement).toBe(buttonB);
+
+    // Pressing right should stay on b.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    expect(lastFocusedElement).toBe(buttonB);
+
+    // Pressing up should stay on b.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
+    expect(lastFocusedElement).toBe(buttonB);
+
+    // Pressing down should go to d.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
+    expect(lastFocusedElement).toBe(buttonD);
+
+    // Pressing down stay on d.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
+    expect(lastFocusedElement).toBe(buttonD);
+
+    // Pressing right stay on d.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    expect(lastFocusedElement).toBe(buttonD);
+
+    // Pressing left should go to c.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
+    expect(lastFocusedElement).toBe(buttonC);
+
+    // Pressing left should stay on c.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.left });
+    expect(lastFocusedElement).toBe(buttonC);
+
+    // Pressing down should stay on c.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
+    expect(lastFocusedElement).toBe(buttonC);
+
+    // Pressing left should go to b.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.up });
+    expect(lastFocusedElement).toBe(buttonA);
+  });
+
   it('correctly skips data-not-focusable elements', () => {
     const component = ReactTestUtils.renderIntoDocument(
       <div { ...{ onFocusCapture: _onFocus } }>
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 81831cf00a808..0ed756889a895 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -22,13 +22,18 @@ import {
   getWindow,
   isElementFocusZone,
   isElementFocusSubZone,
-  isElementTabbable
+  isElementTabbable,
+  shouldWrapFocus
 } from '../../Utilities';
 
 const IS_FOCUSABLE_ATTRIBUTE = 'data-is-focusable';
 const IS_ENTER_DISABLED_ATTRIBUTE = 'data-disable-click-on-enter';
 const FOCUSZONE_ID_ATTRIBUTE = 'data-focuszone-id';
 const TABINDEX = 'tabindex';
+const NO_VERTICAL_WRAP = 'data-no-vertical-wrap';
+const NO_HORIZONTAL_WRAP = 'data-no-horizontal-wrap';
+const LARGE_DISTANCE_FROM_CENTER = 999999999;
+const LARGE_NEGATIVE_DISTANCE_FROM_CENTER = -999999999;
 
 const _allInstances: {
   [key: string]: FocusZone
@@ -357,7 +362,8 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
         case KeyCodes.tab:
           if (this.props.allowTabKey) {
-            if (direction === FocusZoneDirection.vertical) {
+            if (direction === FocusZoneDirection.vertical ||
+              !this._shouldWrapFocus(this._activeElement as HTMLElement, NO_HORIZONTAL_WRAP)) {
               if (ev.shiftKey) {
                 this._moveFocusUp();
               } else {
@@ -474,7 +480,8 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   private _moveFocus(
     isForward: boolean,
     getDistanceFromCenter: (activeRect: ClientRect, targetRect: ClientRect) => number,
-    ev?: Event): boolean {
+    ev?: Event,
+    useDefaultWrap: boolean = true): boolean {
 
     let element = this._activeElement;
     let candidateDistance = -1;
@@ -495,9 +502,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     const activeRect = isBidirectional ? element.getBoundingClientRect() : null;
 
     do {
-      element = (isForward ?
-        getNextElement(this._root, element) :
-        getPreviousElement(this._root, element)) as HTMLElement;
+      element = (isForward ? getNextElement(this._root, element) : getPreviousElement(this._root, element)) as HTMLElement;
 
       if (isBidirectional) {
         if (element) {
@@ -529,7 +534,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     if (candidateElement && candidateElement !== this._activeElement) {
       changedFocus = true;
       this.focusElement(candidateElement);
-    } else if (this.props.isCircularNavigation) {
+    } else if (this.props.isCircularNavigation && useDefaultWrap) {
       if (isForward) {
         return this.focusElement(getNextElement(this._root, this._root.firstElementChild as HTMLElement, true) as HTMLElement);
       } else {
@@ -554,7 +559,11 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       const activeRectBottom = Math.floor(activeRect.bottom);
 
       if (targetRectTop < activeRectBottom) {
-        return 999999999;
+        if (!this._shouldWrapFocus(this._activeElement as HTMLElement, NO_VERTICAL_WRAP)) {
+          return LARGE_NEGATIVE_DISTANCE_FROM_CENTER;
+        }
+
+        return LARGE_DISTANCE_FROM_CENTER;
       }
 
       if ((targetTop === -1 && targetRectTop >= activeRectBottom) ||
@@ -591,7 +600,10 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       const activeRectTop = Math.floor(activeRect.top);
 
       if (targetRectBottom > activeRectTop) {
-        return 999999999;
+        if (!this._shouldWrapFocus(this._activeElement as HTMLElement, NO_VERTICAL_WRAP)) {
+          return LARGE_NEGATIVE_DISTANCE_FROM_CENTER;
+        }
+        return LARGE_DISTANCE_FROM_CENTER;
       }
 
       if ((targetTop === -1 && targetRectBottom <= activeRectTop) ||
@@ -614,6 +626,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   }
 
   private _moveFocusLeft(): boolean {
+    const shouldWrap = this._shouldWrapFocus(this._activeElement as HTMLElement, NO_HORIZONTAL_WRAP);
     if (this._moveFocus(getRTL(), (activeRect: ClientRect, targetRect: ClientRect) => {
       let distance = -1;
 
@@ -624,10 +637,17 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       ) {
 
         distance = activeRect.right - targetRect.right;
+      } else {
+        if (!shouldWrap) {
+          distance = LARGE_NEGATIVE_DISTANCE_FROM_CENTER;
+        }
       }
 
       return distance;
-    })) {
+    },
+      undefined /*ev*/,
+      (shouldWrap || !getRTL())
+    )) {
       this._setFocusAlignment(this._activeElement as HTMLElement, true, false);
       return true;
     }
@@ -636,6 +656,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   }
 
   private _moveFocusRight(): boolean {
+    const shouldWrap = this._shouldWrapFocus(this._activeElement as HTMLElement, NO_HORIZONTAL_WRAP);
     if (this._moveFocus(!getRTL(), (activeRect: ClientRect, targetRect: ClientRect) => {
       let distance = -1;
 
@@ -646,10 +667,15 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       ) {
 
         distance = targetRect.left - activeRect.left;
+      } else if (!shouldWrap) {
+        distance = LARGE_NEGATIVE_DISTANCE_FROM_CENTER;
       }
 
       return distance;
-    })) {
+    },
+      undefined /*ev*/,
+      (shouldWrap || getRTL())
+    )) {
       this._setFocusAlignment(this._activeElement as HTMLElement, true, false);
       return true;
     }
@@ -782,4 +808,8 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
     return true;
   }
+
+  private _shouldWrapFocus(element: HTMLElement, noWrapDataAttribute: 'data-no-vertical-wrap' | 'data-no-horizontal-wrap'): boolean {
+    return !!this.props.checkForNoWrap ? shouldWrapFocus(element, noWrapDataAttribute) : true;
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
index 300bb3b20aa33..64af0ab337413 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
@@ -110,6 +110,13 @@ export interface IFocusZoneProps extends React.HTMLAttributes<HTMLElement | Focu
    * and have to hit escape or some other key.
    */
   allowTabKey?: boolean;
+
+  /**
+   * Whether the to check for data-no-horizontal-wrap or data-no-vertical-wrap attributes
+   * when determining how to move focus
+   * @default false
+   */
+  checkForNoWrap?: boolean;
 }
 
 export enum FocusZoneDirection {
diff --git a/packages/utilities/src/dom.ts b/packages/utilities/src/dom.ts
index a4ead03438601..d3250d1bbcbc0 100644
--- a/packages/utilities/src/dom.ts
+++ b/packages/utilities/src/dom.ts
@@ -204,6 +204,31 @@ export function getRect(element: HTMLElement | Window | null): IRectangle | unde
   return rect;
 }
 
+/**
+ * Finds the first parent element where the matchFunction returns true
+ * @param element element to start searching at
+ * @param matchFunction the function that determines if the element is a match
+ * @returns the matched element or null no match was found
+ */
+export function findElementRecursive(element: HTMLElement | null, matchFunction: (element: HTMLElement) => boolean): HTMLElement | null {
+  if (!element || element === document.body) {
+    return null;
+  }
+
+  return matchFunction(element) ? element : findElementRecursive(getParent(element), matchFunction);
+}
+
+/**
+ * Determines if an element, or any of its ancestors, contian the given attribute
+ * @param element - element to start searching at
+ * @param attribute - the attribute to search for
+ * @returns the value of the first instance found
+ */
+export function elementContainsAttribute(element: HTMLElement, attribute: string): string | null {
+  let elementMatch = findElementRecursive(element, (testElement: HTMLElement) => testElement.hasAttribute(attribute));
+  return elementMatch && elementMatch.getAttribute(attribute);
+}
+
 /**
  * Determines whether or not an element has the virtual hierarchy extension.
  *
diff --git a/packages/utilities/src/focus.ts b/packages/utilities/src/focus.ts
index 071bfde4ad2e6..73a0d6f8992e0 100644
--- a/packages/utilities/src/focus.ts
+++ b/packages/utilities/src/focus.ts
@@ -1,6 +1,6 @@
 /* tslint:disable:no-string-literal */
 
-import { elementContains, getDocument } from './dom';
+import { elementContains, getDocument, elementContainsAttribute } from './dom';
 
 const IS_FOCUSABLE_ATTRIBUTE = 'data-is-focusable';
 const IS_VISIBLE_ATTRIBUTE = 'data-is-visible';
@@ -316,3 +316,14 @@ export function doesElementContainFocus(element: HTMLElement): boolean {
   }
   return false;
 }
+
+/**
+ * Determines if an, or any of its ancestors, sepcificies that it doesn't want focus to wrap
+ * @param element - element to start searching from
+ * @param noWrapDataAttribute - the no wrap data attribute to match (either)
+ * @returns true if focus should wrap, false otherwise
+ */
+export function shouldWrapFocus(element: HTMLElement, noWrapDataAttribute: 'data-no-vertical-wrap' | 'data-no-horizontal-wrap'): boolean {
+
+  return elementContainsAttribute(element, noWrapDataAttribute) === 'true' ? false : true;
+}
diff --git a/scripts/package.json b/scripts/package.json
index 8e5639e2f79d3..1349d0e56e187 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -49,7 +49,7 @@
   "bundlesize": [
     {
       "path": "../apps/test-bundle-button/dist/main.min.js",
-      "maxSize": "43.6 kB"
+      "maxSize": "43.7 kB"
     }
   ]
-}
+}
\ No newline at end of file

From 622aeb1917f4efdb0a2b064c5921ea54ee18d733 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 22 Feb 2018 11:15:23 +0000
Subject: [PATCH 1430/1641] Applying package updates.

---
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...ocusZoneAddWrapProps_2018-02-13-16-53.json | 11 ---
 ...-pane-null-ref-check_2018-02-20-22-39.json | 11 ---
 ...e-no-internal-module_2018-02-21-21-40.json | 11 ---
 ...me-and-boolean-value_2018-02-21-18-12.json | 11 ---
 .../fix-calendar_2018-02-22-03-16.json        | 11 ---
 ...ocusZoneAddWrapProps_2018-02-13-16-53.json | 11 ---
 ...r-OnAfterMenuDismiss_2018-02-21-18-51.json | 11 ---
 ...tePicker-PublicFocus_2018-02-21-18-19.json | 11 ---
 ...law-textfieldMinSize_2018-02-21-21-44.json | 11 ---
 .../layer-scss2ms_2018-02-14-22-55.json       | 11 ---
 ...n-fixTooltipOverflow_2018-02-07-22-42.json | 11 ---
 .../menusize_2018-02-16-18-26.json            | 11 ---
 .../nav-scss2ms-pt2_2018-02-21-20-05.json     | 11 ---
 .../splitbuttonMeny_2018-02-21-18-32.json     | 11 ---
 ...ylo-AddErrorAsToIcon_2018-02-16-22-54.json | 11 ---
 packages/example-app-base/package.json        |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 81 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 24 +++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 ++++
 packages/utilities/CHANGELOG.md               |  9 ++-
 packages/utilities/package.json               |  2 +-
 27 files changed, 135 insertions(+), 176 deletions(-)
 delete mode 100644 common/changes/@uifabric/utilities/jspurlin-FocusZoneAddWrapProps_2018-02-13-16-53.json
 delete mode 100644 common/changes/office-ui-fabric-react/davsm.scrollable-pane-null-ref-check_2018-02-20-22-39.json
 delete mode 100644 common/changes/office-ui-fabric-react/enable-no-internal-module_2018-02-21-21-40.json
 delete mode 100644 common/changes/office-ui-fabric-react/enable-var-name-and-boolean-value_2018-02-21-18-12.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-calendar_2018-02-22-03-16.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-FocusZoneAddWrapProps_2018-02-13-16-53.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-DatePicker-OnAfterMenuDismiss_2018-02-21-18-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/kegorr-DatePicker-PublicFocus_2018-02-21-18-19.json
 delete mode 100644 common/changes/office-ui-fabric-react/law-textfieldMinSize_2018-02-21-21-44.json
 delete mode 100644 common/changes/office-ui-fabric-react/layer-scss2ms_2018-02-14-22-55.json
 delete mode 100644 common/changes/office-ui-fabric-react/magellan-fixTooltipOverflow_2018-02-07-22-42.json
 delete mode 100644 common/changes/office-ui-fabric-react/menusize_2018-02-16-18-26.json
 delete mode 100644 common/changes/office-ui-fabric-react/nav-scss2ms-pt2_2018-02-21-20-05.json
 delete mode 100644 common/changes/office-ui-fabric-react/splitbuttonMeny_2018-02-21-18-32.json
 delete mode 100644 common/changes/office-ui-fabric-react/staylo-AddErrorAsToIcon_2018-02-16-22-54.json

diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index e9f1f46aced6f..9cd01894365ad 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.52.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.54.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 21c1a5be2f5e7..0a740ebc5fe4d 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.52.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.54.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 3e1d7036aaa78..df36fc5d31e79 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.52.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.54.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 0b582bfe827d1..378bc51596a77 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.52.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.54.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/@uifabric/utilities/jspurlin-FocusZoneAddWrapProps_2018-02-13-16-53.json b/common/changes/@uifabric/utilities/jspurlin-FocusZoneAddWrapProps_2018-02-13-16-53.json
deleted file mode 100644
index 2574a45378c67..0000000000000
--- a/common/changes/@uifabric/utilities/jspurlin-FocusZoneAddWrapProps_2018-02-13-16-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Focus/DOM: add the ability to find if an element (or any ancestor) contains a given attribute. Also, add a shouldrWapFocus function to the focus utility (which leverages the fild element attribute just described) which returns true if the given no wrap data attribute (data-no-vertical-wrap OR data-no-horizontal-wrap) exists and is set to true",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "jspurlin@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/davsm.scrollable-pane-null-ref-check_2018-02-20-22-39.json b/common/changes/office-ui-fabric-react/davsm.scrollable-pane-null-ref-check_2018-02-20-22-39.json
deleted file mode 100644
index 1250c6e43a823..0000000000000
--- a/common/changes/office-ui-fabric-react/davsm.scrollable-pane-null-ref-check_2018-02-20-22-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix Scrollable-Pane getComputedStyle error - changing timeouts to use this._async.setTimeout to ensure this.refs isn't used after componentWillUnmount",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "davsm@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/enable-no-internal-module_2018-02-21-21-40.json b/common/changes/office-ui-fabric-react/enable-no-internal-module_2018-02-21-21-40.json
deleted file mode 100644
index 074be2ab82375..0000000000000
--- a/common/changes/office-ui-fabric-react/enable-no-internal-module_2018-02-21-21-40.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "office-ui-fabric-react",
-      "type": "none"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mark@thedutchies.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/enable-var-name-and-boolean-value_2018-02-21-18-12.json b/common/changes/office-ui-fabric-react/enable-var-name-and-boolean-value_2018-02-21-18-12.json
deleted file mode 100644
index 6ca7e51f82d50..0000000000000
--- a/common/changes/office-ui-fabric-react/enable-var-name-and-boolean-value_2018-02-21-18-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Enable variable-name and jsx-boolean-value tslint rules",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mark@thedutchies.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-calendar_2018-02-22-03-16.json b/common/changes/office-ui-fabric-react/fix-calendar_2018-02-22-03-16.json
deleted file mode 100644
index 5d6c00c33b14e..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-calendar_2018-02-22-03-16.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Calendar: changing refs to componentRef.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-FocusZoneAddWrapProps_2018-02-13-16-53.json b/common/changes/office-ui-fabric-react/jspurlin-FocusZoneAddWrapProps_2018-02-13-16-53.json
deleted file mode 100644
index 61a72b95ce1ba..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-FocusZoneAddWrapProps_2018-02-13-16-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "FocusZone: Add the ability turn off directional wrapping on sections of a FocusZone",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kegorr-DatePicker-OnAfterMenuDismiss_2018-02-21-18-51.json b/common/changes/office-ui-fabric-react/kegorr-DatePicker-OnAfterMenuDismiss_2018-02-21-18-51.json
deleted file mode 100644
index 0b8b7f7237f9e..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-DatePicker-OnAfterMenuDismiss_2018-02-21-18-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DatePicker-onAfterMenuDismiss callback created",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/kegorr-DatePicker-PublicFocus_2018-02-21-18-19.json b/common/changes/office-ui-fabric-react/kegorr-DatePicker-PublicFocus_2018-02-21-18-19.json
deleted file mode 100644
index 8fa302dc108e0..0000000000000
--- a/common/changes/office-ui-fabric-react/kegorr-DatePicker-PublicFocus_2018-02-21-18-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DatePicker - Adding public focus method",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "kegorr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/law-textfieldMinSize_2018-02-21-21-44.json b/common/changes/office-ui-fabric-react/law-textfieldMinSize_2018-02-21-21-44.json
deleted file mode 100644
index 962b8eae51e3d..0000000000000
--- a/common/changes/office-ui-fabric-react/law-textfieldMinSize_2018-02-21-21-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "[TextField] Set input size to 1",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/layer-scss2ms_2018-02-14-22-55.json b/common/changes/office-ui-fabric-react/layer-scss2ms_2018-02-14-22-55.json
deleted file mode 100644
index 60e9c25fa5bf0..0000000000000
--- a/common/changes/office-ui-fabric-react/layer-scss2ms_2018-02-14-22-55.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Convert Layer component to mergeStyles",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/magellan-fixTooltipOverflow_2018-02-07-22-42.json b/common/changes/office-ui-fabric-react/magellan-fixTooltipOverflow_2018-02-07-22-42.json
deleted file mode 100644
index 90452728ae475..0000000000000
--- a/common/changes/office-ui-fabric-react/magellan-fixTooltipOverflow_2018-02-07-22-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "[TooltipHost] Inline display for when overflow mode is on\"",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/menusize_2018-02-16-18-26.json b/common/changes/office-ui-fabric-react/menusize_2018-02-16-18-26.json
deleted file mode 100644
index b8a5eb60e1ed7..0000000000000
--- a/common/changes/office-ui-fabric-react/menusize_2018-02-16-18-26.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Updated contextual menu to pass the correct number",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chiechan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/nav-scss2ms-pt2_2018-02-21-20-05.json b/common/changes/office-ui-fabric-react/nav-scss2ms-pt2_2018-02-21-20-05.json
deleted file mode 100644
index 3434a87a0341a..0000000000000
--- a/common/changes/office-ui-fabric-react/nav-scss2ms-pt2_2018-02-21-20-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Converting SCSS to MergeStyles step 2 - style conversion",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/splitbuttonMeny_2018-02-21-18-32.json b/common/changes/office-ui-fabric-react/splitbuttonMeny_2018-02-21-18-32.json
deleted file mode 100644
index baf153dc41b31..0000000000000
--- a/common/changes/office-ui-fabric-react/splitbuttonMeny_2018-02-21-18-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Contextual Menu - Added aria-posinset and aria-setsize to split buttons",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chiechan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/staylo-AddErrorAsToIcon_2018-02-16-22-54.json b/common/changes/office-ui-fabric-react/staylo-AddErrorAsToIcon_2018-02-16-22-54.json
deleted file mode 100644
index e86b4124bafa3..0000000000000
--- a/common/changes/office-ui-fabric-react/staylo-AddErrorAsToIcon_2018-02-16-22-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add imageErrorAs to IIconProps",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "staylo@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index f4d0c7a124bcb..1ef6fb7bef9cd 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.18.1 <6.0.0",
-    "@uifabric/utilities": ">=5.12.1 <6.0.0",
+    "@uifabric/utilities": ">=5.13.0 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 0237d1a11c3fd..7fd27507b61c9 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,87 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.54.0",
+      "tag": "office-ui-fabric-react_v5.54.0",
+      "date": "Thu, 22 Feb 2018 11:15:23 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "davsm <36288536+davsm@users.noreply.github.com>",
+            "commit": "a40160db28a702c2bacb1cb7c147b150c59b7a9c",
+            "comment": "Fix Scrollable-Pane getComputedStyle error - changing timeouts to use this._async.setTimeout to ensure this.refs isn't used after componentWillUnmount"
+          },
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "b0550145231d18adea954f56be47967ab04cb19d",
+            "comment": "FocusZone: Add the ability turn off directional wrapping on sections of a FocusZone"
+          },
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "3cf846061686c05dbc2329aa16596c9be206ded1",
+            "comment": "Convert Layer component to mergeStyles"
+          },
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "4b74ee848acc55a619b99a2b1b08be90f5127149",
+            "comment": "Converting SCSS to MergeStyles step 2 - style conversion"
+          },
+          {
+            "author": "staylo8 <33881401+staylo8@users.noreply.github.com>",
+            "commit": "af4a2976ca729f9a7107ed7b05e7f0f5292f674f",
+            "comment": "Add imageErrorAs to IIconProps"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Mark Polak <mark@thedutchies.com>",
+            "commit": "7ff46ee4fe64b303d6a4845b404ee16f909ac847",
+            "comment": "Enable variable-name and jsx-boolean-value tslint rules"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "08066258199e0de38a145777aeee1e0a31fd057b",
+            "comment": "Calendar: changing refs to componentRef."
+          },
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "fa5626d6b1cfe17646f78927746b34c3efeb06a9",
+            "comment": "DatePicker-onAfterMenuDismiss callback created"
+          },
+          {
+            "author": "kellygorr <kegorr@microsoft.com>",
+            "commit": "b806c8d972e306f71c26874c5262a33ddc862d4a",
+            "comment": "DatePicker - Adding public focus method"
+          },
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "6b2f5885f2d76e8539d6108db8cd3ed6dc5deabc",
+            "comment": "[TextField] Set input size to 1"
+          },
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "67730082e1053486ae59876f24c7ee639b4ca251",
+            "comment": "[TooltipHost] Inline display for when overflow mode is on\""
+          },
+          {
+            "author": "chang47 <coralbue@gmail.com>",
+            "commit": "8f5fe3b6b8feb89df75ee76d886fdcccddceb875",
+            "comment": "Updated contextual menu to pass the correct number"
+          },
+          {
+            "author": "chang47 <coralbue@gmail.com>",
+            "commit": "6fbbe8922e7b97983e36346f1577f040e8e13acb",
+            "comment": "Contextual Menu - Added aria-posinset and aria-setsize to split buttons"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.12.1 <6.0.0` to `>=5.13.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.53.0",
       "tag": "office-ui-fabric-react_v5.53.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index f01b13e50bcf4..d7c631914f724 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,28 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 21 Feb 2018 11:12:11 GMT and should not be manually modified.
+This log was last generated on Thu, 22 Feb 2018 11:15:23 GMT and should not be manually modified.
+
+## 5.54.0
+Thu, 22 Feb 2018 11:15:23 GMT
+
+### Minor changes
+
+- Fix Scrollable-Pane getComputedStyle error - changing timeouts to use this._async.setTimeout to ensure this.refs isn't used after componentWillUnmount
+- FocusZone: Add the ability turn off directional wrapping on sections of a FocusZone
+- Convert Layer component to mergeStyles
+- Converting SCSS to MergeStyles step 2 - style conversion
+- Add imageErrorAs to IIconProps
+
+### Patches
+
+- Enable variable-name and jsx-boolean-value tslint rules
+- Calendar: changing refs to componentRef.
+- DatePicker-onAfterMenuDismiss callback created
+- DatePicker - Adding public focus method
+- [TextField] Set input size to 1
+- [TooltipHost] Inline display for when overflow mode is on"
+- Updated contextual menu to pass the correct number
+- Contextual Menu - Added aria-posinset and aria-setsize to split buttons
 
 ## 5.53.0
 Wed, 21 Feb 2018 11:12:11 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 7056f377c79bb..6c7a5c470327f 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.53.0",
+  "version": "5.54.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -51,7 +51,7 @@
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "@uifabric/merge-styles": ">=5.12.2 <6.0.0",
     "@uifabric/styling": ">=5.18.1 <6.0.0",
-    "@uifabric/utilities": ">=5.12.1 <6.0.0",
+    "@uifabric/utilities": ">=5.13.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index ca0eb282ce30b..d78eaa04db4c1 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.12.1 <6.0.0",
+    "@uifabric/utilities": ">=5.13.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.12.2 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 18acdfd099717..d1b70242fc3b4 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.13.0",
+      "tag": "@uifabric/utilities_v5.13.0",
+      "date": "Thu, 22 Feb 2018 11:15:23 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "b0550145231d18adea954f56be47967ab04cb19d",
+            "comment": "Focus/DOM: add the ability to find if an element (or any ancestor) contains a given attribute. Also, add a shouldrWapFocus function to the focus utility (which leverages the fild element attribute just described) which returns true if the given no wrap data attribute (data-no-vertical-wrap OR data-no-horizontal-wrap) exists and is set to true"
+          }
+        ]
+      }
+    },
     {
       "version": "5.12.1",
       "tag": "@uifabric/utilities_v5.12.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 04b94fd625568..14bb654343f52 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Wed, 21 Feb 2018 11:12:11 GMT and should not be manually modified.
+This log was last generated on Thu, 22 Feb 2018 11:15:23 GMT and should not be manually modified.
+
+## 5.13.0
+Thu, 22 Feb 2018 11:15:23 GMT
+
+### Minor changes
+
+- Focus/DOM: add the ability to find if an element (or any ancestor) contains a given attribute. Also, add a shouldrWapFocus function to the focus utility (which leverages the fild element attribute just described) which returns true if the given no wrap data attribute (data-no-vertical-wrap OR data-no-horizontal-wrap) exists and is set to true
 
 ## 5.12.1
 Wed, 21 Feb 2018 11:12:11 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 08c6a4044effc..c8bbebccfdb07 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.12.1",
+  "version": "5.13.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 203b20544d3985403ca4c5f7da426f0a021db4aa Mon Sep 17 00:00:00 2001
From: Mark Polak <mark@thedutchies.com>
Date: Thu, 22 Feb 2018 17:58:15 +0100
Subject: [PATCH 1431/1641] Enable no inferable types (#4067)

* Enable no-inferable-types rules

* Add npm change file
---
 ...e-no-inferable-types_2018-02-22-07-17.json |  11 ++
 .../src/components/Autofill/Autofill.tsx      |   2 +-
 .../src/components/Calendar/Calendar.tsx      |   4 +-
 .../src/components/Callout/Callout.test.tsx   |  12 +-
 .../Callout/CalloutContent.base.tsx           |   2 +-
 .../ChoiceGroup/ChoiceGroup.test.tsx          |   2 +-
 .../examples/DetailsList.DragDrop.Example.tsx |   2 +-
 .../src/components/Dropdown/Dropdown.tsx      |   2 +-
 .../src/components/Fabric/Fabric.tsx          |   2 +-
 .../FocusTrapZone/FocusTrapZone.tsx           |   4 +-
 ...pZone.Box.FocusOnCustomElement.Example.tsx |   2 +-
 .../src/components/Image/Image.base.tsx       |   2 +-
 .../src/components/Nav/Nav.base.tsx           |   4 +-
 .../ProgressIndicator.Basic.Example.tsx       |   6 +-
 .../components/SpinButton/SpinButton.test.tsx | 160 +++++++++---------
 .../components/TextField/TextField.test.tsx   |  14 +-
 packages/office-ui-fabric-react/tslint.json   |   3 -
 17 files changed, 121 insertions(+), 113 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/enable-no-inferable-types_2018-02-22-07-17.json

diff --git a/common/changes/office-ui-fabric-react/enable-no-inferable-types_2018-02-22-07-17.json b/common/changes/office-ui-fabric-react/enable-no-inferable-types_2018-02-22-07-17.json
new file mode 100644
index 0000000000000..074be2ab82375
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/enable-no-inferable-types_2018-02-22-07-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "office-ui-fabric-react",
+      "type": "none"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx
index b4dfb73618bb2..b578d383131e5 100644
--- a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx
+++ b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx
@@ -22,7 +22,7 @@ export class Autofill extends BaseComponent<IAutofillProps, IAutofillState> impl
   };
 
   private _inputElement: HTMLInputElement;
-  private _autoFillEnabled: boolean = true;
+  private _autoFillEnabled = true;
   private _value: string;
 
   constructor(props: IAutofillProps) {
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index ce71fc0bcabb5..97a7fe703569e 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -13,8 +13,8 @@ import {
 import * as stylesImport from './Calendar.scss';
 const styles: any = stylesImport;
 
-const leftArrow: string = 'Up';
-const rightArrow: string = 'Down';
+const leftArrow = 'Up';
+const rightArrow = 'Down';
 const iconStrings: ICalendarIconStrings = {
   leftNavigation: leftArrow,
   rightNavigation: rightArrow
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx b/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
index 2618dfb79b7fe..f0807c4504e37 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
@@ -34,7 +34,7 @@ describe('Callout', () => {
 
   it('target id strings does not throw exception', () => {
 
-    let threwException: boolean = false;
+    let threwException = false;
     let exception;
     try {
       ReactTestUtils.renderIntoDocument<HTMLDivElement>(
@@ -62,7 +62,7 @@ describe('Callout', () => {
     const mouseEvent = document.createEvent('MouseEvent');
     const eventTarget = document.createElement('div');
     mouseEvent.initMouseEvent('click', false, false, window, 0, 0, 0, 0, 0, false, false, false, false, 1, eventTarget);
-    let threwException: boolean = false;
+    let threwException = false;
     try {
 
       ReactTestUtils.renderIntoDocument<HTMLDivElement>(
@@ -87,7 +87,7 @@ describe('Callout', () => {
   it('target HTMLElements does not throw exception', () => {
     const targetElement = document.createElement('div');
     document.body.appendChild(targetElement);
-    let threwException: boolean = false;
+    let threwException = false;
     try {
 
       ReactTestUtils.renderIntoDocument<HTMLDivElement>(
@@ -110,7 +110,7 @@ describe('Callout', () => {
   });
 
   it('without target does not throw exception', () => {
-    let threwException: boolean = false;
+    let threwException = false;
     try {
       ReactTestUtils.renderIntoDocument<HTMLDivElement>(
         <div>
@@ -130,8 +130,8 @@ describe('Callout', () => {
   });
 
   it('passes event to onDismiss prop', (done) => {
-    let threwException: boolean = false;
-    let gotEvent: boolean = false;
+    let threwException = false;
+    let gotEvent = false;
     const onDismiss = (ev?: any) => {
       if (ev) {
         gotEvent = true;
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
index e9dcc0c3ff02e..00e4865075070 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
@@ -31,7 +31,7 @@ import { Popup } from '../../Popup';
 import { classNamesFunction } from '../../Utilities';
 
 const getClassNames = classNamesFunction<ICalloutContentStyleProps, ICalloutContentStyles>();
-const BORDER_WIDTH: number = 1;
+const BORDER_WIDTH = 1;
 const BEAK_ORIGIN_POSITION = { top: 0, left: 0 };
 // Microsoft Edge will overwrite inline styles if there is an animation pertaining to that style.
 // To help ensure that edge will respect the offscreen style opacity
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
index c3c7912172b47..d0a52f08d7946 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
@@ -14,7 +14,7 @@ const TEST_OPTIONS: IChoiceGroupOption[] = [
   { key: '2', text: '2' },
   { key: '3', text: '3' }
 ];
-const QUERY_SELECTOR: string = '.ms-ChoiceField-input';
+const QUERY_SELECTOR = '.ms-ChoiceField-input';
 
 describe('ChoiceGroup', () => {
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx
index 1322754b5bd7d..7b60397e17cc5 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.DragDrop.Example.tsx
@@ -13,7 +13,7 @@ import { createListItems } from '@uifabric/example-app-base';
 import './DetailsList.DragDrop.Example.scss';
 
 let _draggedItem: any = null;
-let _draggedIndex: number = -1;
+let _draggedIndex = -1;
 
 export class DetailsListDragDropExample extends React.Component<{}, {
   items: {}[];
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 24a041f7d1d8b..4066a07f1eab0 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -45,7 +45,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     options: [] as any[]
   };
 
-  private static Option: string = 'option';
+  private static Option = 'option';
 
   private _root: HTMLElement;
   private _host: HTMLDivElement;
diff --git a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
index 5153acc5a49ca..844e38048dfa9 100644
--- a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
+++ b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
@@ -33,7 +33,7 @@ export interface IFabricState {
 
 // We will track the last focus visibility state so that if we tear down and recreate
 // the Fabric component, we will use the last known value as the default.
-let _lastIsFocusVisible: boolean = false;
+let _lastIsFocusVisible = false;
 
 // Ensure that the HTML element has a dir specified. This helps to ensure RTL/LTR macros in css for all components will work.
 if (typeof (document) === 'object' && document.documentElement && !document.documentElement.getAttribute('dir')) {
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
index 1525357807954..9bae4145c9360 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
@@ -19,8 +19,8 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
 
   private _root: HTMLElement;
   private _previouslyFocusedElement: HTMLElement;
-  private _isInFocusStack: boolean = false;
-  private _isInClickStack: boolean = false;
+  private _isInFocusStack = false;
+  private _isInClickStack = false;
 
   public componentWillMount() {
     const { isClickableOutsideFocusTrap = false, forceFocusInsideTrap = true } = this.props;
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
index 880e791dec43d..b627b9fac3908 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
@@ -26,7 +26,7 @@ export default class BoxExample extends React.Component<React.HTMLAttributes<HTM
 
   public render() {
     const { isChecked } = this.state;
-    const className: string = 'shouldFocus input';
+    const className = 'shouldFocus input';
 
     return (
       <div>
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx
index 96e3ca77c12e4..d89b587609aa9 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx
@@ -29,7 +29,7 @@ export const ImageFitMap: { [key: number]: string } = {
   [ImageFit.none]: 'ms-Image-image--none ' + styles.imageIsNone
 };
 
-const KEY_PREFIX: string = 'fabricImage';
+const KEY_PREFIX = 'fabricImage';
 
 export class ImageBase extends BaseComponent<IImageProps, IImageState> {
   public static defaultProps = {
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
index 56292b2c6f85a..977f398e4bd18 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
@@ -21,10 +21,10 @@ import {
 } from './Nav.types';
 
 // The number pixels per indentation level for Nav links.
-const _indentationSize: number = 14;
+const _indentationSize = 14;
 
 // The number of pixels of left margin
-const _baseIndent: number = 3;
+const _baseIndent = 3;
 
 // global var used in _isLinkSelectedKey
 let _urlResolver: HTMLAnchorElement | undefined;
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Basic.Example.tsx
index d83192cc2717c..d5c7a03d2487e 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Basic.Example.tsx
@@ -8,9 +8,9 @@ export interface IProgressIndicatorBasicExampleState {
   percentComplete: number;
 }
 
-const INTERVAL_DELAY: number = 100;
-const INTERVAL_INCREMENT: number = .01;
-const RESTART_WAIT_TIME: number = 2000;
+const INTERVAL_DELAY = 100;
+const INTERVAL_INCREMENT = .01;
+const RESTART_WAIT_TIME = 2000;
 
 export class ProgressIndicatorBasicExample extends React.Component<{}, IProgressIndicatorBasicExampleState> {
 
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
index aa217308d399e..3016149f71a57 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
@@ -26,10 +26,10 @@ describe('SpinButton', () => {
   });
 
   it('should render a spinner with the default value on the input element', () => {
-    const exampleLabelValue: string = 'SpinButton';
-    const exampleMinValue: number = 2;
-    const exampleMaxValue: number = 22;
-    const exampleDefaultValue: string = '12';
+    const exampleLabelValue = 'SpinButton';
+    const exampleMinValue = 2;
+    const exampleMaxValue = 22;
+    const exampleDefaultValue = '12';
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <SpinButton
@@ -56,10 +56,10 @@ describe('SpinButton', () => {
   });
 
   it('should increment the value in the spin button via the up button', () => {
-    const exampleLabelValue: string = 'SpinButton';
-    const exampleMinValue: number = 2;
-    const exampleMaxValue: number = 22;
-    const exampleDefaultValue: string = '12';
+    const exampleLabelValue = 'SpinButton';
+    const exampleMinValue = 2;
+    const exampleMaxValue = 22;
+    const exampleDefaultValue = '12';
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <SpinButton
@@ -98,10 +98,10 @@ describe('SpinButton', () => {
   });
 
   it('should decrement the value in the spin button by the down button', () => {
-    const exampleLabelValue: string = 'SpinButton';
-    const exampleMinValue: number = 2;
-    const exampleMaxValue: number = 22;
-    const exampleDefaultValue: string = '12';
+    const exampleLabelValue = 'SpinButton';
+    const exampleMinValue = 2;
+    const exampleMaxValue = 22;
+    const exampleDefaultValue = '12';
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <SpinButton
@@ -140,10 +140,10 @@ describe('SpinButton', () => {
   });
 
   it('should increment the value in the spin button by the up arrow', () => {
-    const exampleLabelValue: string = 'SpinButton';
-    const exampleMinValue: number = 2;
-    const exampleMaxValue: number = 22;
-    const exampleDefaultValue: string = '12';
+    const exampleLabelValue = 'SpinButton';
+    const exampleMinValue = 2;
+    const exampleMaxValue = 22;
+    const exampleDefaultValue = '12';
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <SpinButton
@@ -175,10 +175,10 @@ describe('SpinButton', () => {
   });
 
   it('should decrement the value in the spin button by the down arrow', () => {
-    const exampleLabelValue: string = 'SpinButton';
-    const exampleMinValue: number = 2;
-    const exampleMaxValue: number = 22;
-    const exampleDefaultValue: string = '12';
+    const exampleLabelValue = 'SpinButton';
+    const exampleMinValue = 2;
+    const exampleMaxValue = 22;
+    const exampleDefaultValue = '12';
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <SpinButton
@@ -210,10 +210,10 @@ describe('SpinButton', () => {
   });
 
   it('should increment the value in the spin button by a step value of 2', () => {
-    const exampleLabelValue: string = 'SpinButton';
-    const exampleMinValue: number = 2;
-    const exampleMaxValue: number = 22;
-    const exampleDefaultValue: string = '12';
+    const exampleLabelValue = 'SpinButton';
+    const exampleMinValue = 2;
+    const exampleMaxValue = 22;
+    const exampleDefaultValue = '12';
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <SpinButton
@@ -246,10 +246,10 @@ describe('SpinButton', () => {
   });
 
   it('should decrement the value in the spin button by a step value of 2', () => {
-    const exampleLabelValue: string = 'SpinButton';
-    const exampleMinValue: number = 2;
-    const exampleMaxValue: number = 22;
-    const exampleDefaultValue: string = '12';
+    const exampleLabelValue = 'SpinButton';
+    const exampleMinValue = 2;
+    const exampleMaxValue = 22;
+    const exampleDefaultValue = '12';
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <SpinButton
@@ -282,11 +282,11 @@ describe('SpinButton', () => {
   });
 
   it('should set the value of the spin button by manual entry', () => {
-    const exampleLabelValue: string = 'SpinButton';
-    const exampleMinValue: number = 2;
-    const exampleMaxValue: number = 22;
-    const exampleDefaultValue: string = '12';
-    const exampleNewValue: string = '21';
+    const exampleLabelValue = 'SpinButton';
+    const exampleMinValue = 2;
+    const exampleMaxValue = 22;
+    const exampleDefaultValue = '12';
+    const exampleNewValue = '21';
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <SpinButton
@@ -309,11 +309,11 @@ describe('SpinButton', () => {
   });
 
   it('should reset the value of the spin button with invalid manual entry', () => {
-    const exampleLabelValue: string = 'SpinButton';
-    const exampleMinValue: number = 2;
-    const exampleMaxValue: number = 22;
-    const exampleDefaultValue: string = '12';
-    const exampleNewValue: string = 'garbage';
+    const exampleLabelValue = 'SpinButton';
+    const exampleMinValue = 2;
+    const exampleMaxValue = 22;
+    const exampleDefaultValue = '12';
+    const exampleNewValue = 'garbage';
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <SpinButton
@@ -336,11 +336,11 @@ describe('SpinButton', () => {
   });
 
   it('should revert to max value when input value is higher than the max of the spin button', () => {
-    const exampleLabelValue: string = 'SpinButton';
-    const exampleMinValue: number = 2;
-    const exampleMaxValue: number = 22;
-    const exampleDefaultValue: string = '12';
-    const exampleNewValue: string = '23';
+    const exampleLabelValue = 'SpinButton';
+    const exampleMinValue = 2;
+    const exampleMaxValue = 22;
+    const exampleDefaultValue = '12';
+    const exampleNewValue = '23';
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <SpinButton
@@ -363,11 +363,11 @@ describe('SpinButton', () => {
   });
 
   it('should revert existing value when input value is lower than the min of the spin button', () => {
-    const exampleLabelValue: string = 'SpinButton';
-    const exampleMinValue: number = 2;
-    const exampleMaxValue: number = 22;
-    const exampleDefaultValue: string = '12';
-    const exampleNewValue: string = '0';
+    const exampleLabelValue = 'SpinButton';
+    const exampleMinValue = 2;
+    const exampleMaxValue = 22;
+    const exampleDefaultValue = '12';
+    const exampleNewValue = '0';
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <SpinButton
@@ -390,12 +390,12 @@ describe('SpinButton', () => {
   });
 
   it('should use validator passed to the spin button (with valid input)', () => {
-    const errorMessage: string = 'The value is invalid';
-    const exampleLabelValue: string = 'SpinButton';
-    const exampleMinValue: number = 2;
-    const exampleMaxValue: number = 22;
-    const exampleDefaultValue: string = '12';
-    const exampleNewValue: string = '21';
+    const errorMessage = 'The value is invalid';
+    const exampleLabelValue = 'SpinButton';
+    const exampleMinValue = 2;
+    const exampleMaxValue = 22;
+    const exampleDefaultValue = '12';
+    const exampleNewValue = '21';
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <SpinButton
@@ -423,12 +423,12 @@ describe('SpinButton', () => {
   });
 
   it('should use validator passed to the spin button', () => {
-    const errorMessage: string = 'The value is invalid';
-    const exampleLabelValue: string = 'SpinButton';
-    const exampleMinValue: number = 2;
-    const exampleMaxValue: number = 22;
-    const exampleDefaultValue: string = '12';
-    const exampleNewValue: string = '100';
+    const errorMessage = 'The value is invalid';
+    const exampleLabelValue = 'SpinButton';
+    const exampleMinValue = 2;
+    const exampleMaxValue = 22;
+    const exampleDefaultValue = '12';
+    const exampleNewValue = '100';
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <SpinButton
@@ -456,11 +456,11 @@ describe('SpinButton', () => {
   });
 
   it('should have correct value after increment and using defaultValue', () => {
-    const exampleLabelValue: string = 'SpinButton';
-    const exampleMinValue: number = 2;
-    const exampleMaxValue: number = 22;
-    const exampleDefaultValue: string = '12';
-    const exampleStepValue: number = 2;
+    const exampleLabelValue = 'SpinButton';
+    const exampleMinValue = 2;
+    const exampleMaxValue = 22;
+    const exampleDefaultValue = '12';
+    const exampleStepValue = 2;
     const exampleNewValue: string = String(Number(exampleDefaultValue) + exampleStepValue);
 
     const renderedDOM: HTMLElement = renderIntoDocument(
@@ -486,11 +486,11 @@ describe('SpinButton', () => {
   });
 
   it('should have correct value after decrement and using defaultValue', () => {
-    const exampleLabelValue: string = 'SpinButton';
-    const exampleMinValue: number = 2;
-    const exampleMaxValue: number = 22;
-    const exampleDefaultValue: string = '12';
-    const exampleStepValue: number = 2;
+    const exampleLabelValue = 'SpinButton';
+    const exampleMinValue = 2;
+    const exampleMaxValue = 22;
+    const exampleDefaultValue = '12';
+    const exampleStepValue = 2;
     const exampleNewValue: string = String(Number(exampleDefaultValue) - exampleStepValue);
 
     const renderedDOM: HTMLElement = renderIntoDocument(
@@ -516,10 +516,10 @@ describe('SpinButton', () => {
   });
 
   it('should use min as defaultvalue if neither value nor defaultValue are passed', () => {
-    const exampleLabelValue: string = 'SpinButton';
-    const exampleMinValue: number = 2;
-    const exampleMaxValue: number = 22;
-    const exampleStepValue: number = 2;
+    const exampleLabelValue = 'SpinButton';
+    const exampleMinValue = 2;
+    const exampleMaxValue = 22;
+    const exampleStepValue = 2;
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <SpinButton
@@ -540,7 +540,7 @@ describe('SpinButton', () => {
   });
 
   it('should use 0 as defaultvalue if neither value, defaultValue nor min are passed', () => {
-    const exampleLabelValue: string = 'SpinButton';
+    const exampleLabelValue = 'SpinButton';
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <SpinButton
@@ -556,7 +556,7 @@ describe('SpinButton', () => {
   });
 
   it('should use the default onIncrement function when no value, defaultValue nor onIncrement function is passed', () => {
-    const exampleLabelValue: string = 'SpinButton';
+    const exampleLabelValue = 'SpinButton';
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <SpinButton
@@ -575,10 +575,10 @@ describe('SpinButton', () => {
   });
 
   it('should stop spinning if text field is focused while actively spinning', () => {
-    const exampleLabelValue: string = 'SpinButton';
-    const exampleMinValue: number = 2;
-    const exampleMaxValue: number = 22;
-    const exampleDefaultValue: string = '12';
+    const exampleLabelValue = 'SpinButton';
+    const exampleMinValue = 2;
+    const exampleMaxValue = 22;
+    const exampleDefaultValue = '12';
 
     function delay(millisecond: number): Promise<string> {
       return new Promise<string>((resolve) => setTimeout(resolve, millisecond));
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
index d60f2a6c4f972..ac1da301beaec 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
@@ -31,8 +31,8 @@ describe('TextField', () => {
   });
 
   it('should render label and value to input element', () => {
-    const exampleLabel: string = 'this is label';
-    const exampleValue: string = 'this is value';
+    const exampleLabel = 'this is label';
+    const exampleValue = 'this is value';
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <TextField
@@ -51,7 +51,7 @@ describe('TextField', () => {
   });
 
   it('should render prefix in input element', () => {
-    const examplePrefix: string = 'this is a prefix';
+    const examplePrefix = 'this is a prefix';
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <TextField
@@ -65,7 +65,7 @@ describe('TextField', () => {
   });
 
   it('should render suffix in input element', () => {
-    const exampleSuffix: string = 'this is a suffix';
+    const exampleSuffix = 'this is a suffix';
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <TextField
@@ -79,8 +79,8 @@ describe('TextField', () => {
   });
 
   it('should render both prefix and suffix in input element', () => {
-    const examplePrefix: string = 'this is a prefix';
-    const exampleSuffix: string = 'this is a suffix';
+    const examplePrefix = 'this is a prefix';
+    const exampleSuffix = 'this is a suffix';
 
     const renderedDOM: HTMLElement = renderIntoDocument(
       <TextField
@@ -133,7 +133,7 @@ describe('TextField', () => {
   });
 
   describe('error message', () => {
-    const errorMessage: string = 'The string is too long, should not exceed 3 characters.';
+    const errorMessage = 'The string is too long, should not exceed 3 characters.';
 
     function assertErrorMessage(renderedDOM: HTMLElement, expectedErrorMessage: string | boolean): void {
       const errorMessageDOM: HTMLElement =
diff --git a/packages/office-ui-fabric-react/tslint.json b/packages/office-ui-fabric-react/tslint.json
index c62ddc630d659..bd9e67217070b 100644
--- a/packages/office-ui-fabric-react/tslint.json
+++ b/packages/office-ui-fabric-react/tslint.json
@@ -12,9 +12,6 @@
     "typedef": [
       false
     ],
-    "no-inferrable-types": [
-      false
-    ],
     "no-unused-variable": false
   }
 }
\ No newline at end of file

From 99fc1d42078e4c3a2c6be3e4c32dcf2c19074c87 Mon Sep 17 00:00:00 2001
From: "David Wilson (VSNC)" <dawilson@microsoft.com>
Date: Thu, 22 Feb 2018 12:49:10 -0500
Subject: [PATCH 1432/1641] Nav: fix multiple invocations of onClick (#4057)
 (#4058)

* Nav: fix multiple invocations of onClick (#4057)

* Update Nav.base.tsx

* Update Nav.base.tsx
---
 .../master_2018-02-21-21-06.json              | 11 ++++++++
 .../src/components/Nav/Nav.base.tsx           |  3 +-
 .../src/components/Nav/Nav.test.tsx           | 28 ++++++++++++++++++-
 3 files changed, 40 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/master_2018-02-21-21-06.json

diff --git a/common/changes/office-ui-fabric-react/master_2018-02-21-21-06.json b/common/changes/office-ui-fabric-react/master_2018-02-21-21-06.json
new file mode 100644
index 0000000000000..a1150ef8a3397
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2018-02-21-21-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Nav: fix multiple invocations of onClick",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dawilson@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
index 977f398e4bd18..da2c0cb1cea39 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
@@ -171,6 +171,7 @@ export class NavBase extends BaseComponent<INavProps, INavState> implements INav
   }
 
   private _renderCompositeLink(link: INavLink, linkIndex: number, nestingLevel: number): React.ReactElement<{}> {
+    const divProps: React.HTMLProps<HTMLDivElement> = { ...getNativeProps(link, divProperties, ['onClick']) };
     const { getStyles, groups, theme } = this.props;
     const classNames = getClassNames(getStyles!, {
       theme: theme!,
@@ -183,7 +184,7 @@ export class NavBase extends BaseComponent<INavProps, INavState> implements INav
 
     return (
       <div
-        { ...getNativeProps(link, divProperties) }
+        { ...divProps }
         key={ link.key || linkIndex }
         className={ classNames.compositeLink }
       >
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.test.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.test.tsx
index 6159a9052325f..aec55d51ad990 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.test.tsx
@@ -1,7 +1,10 @@
 import * as React from 'react';
+
+import { mount } from 'enzyme';
 import * as renderer from 'react-test-renderer';
 
 import { Nav } from './Nav';
+import { NavBase } from './Nav.base';
 
 describe('Nav', () => {
   it('renders Nav correctly', () => {
@@ -20,4 +23,27 @@ describe('Nav', () => {
     const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
-});
\ No newline at end of file
+
+  it('calls onClick() correctly', () => {
+    const handler = jest.fn();
+    const nav = mount<NavBase>(
+      <NavBase
+        groups={ [
+          {
+            links: [
+              {
+                name: 'foo',
+                url: 'http://example.com',
+                onClick: handler
+              }
+            ]
+          }
+        ] }
+      />
+    );
+
+    const link = nav.find('a.ms-Button');
+    link.simulate('click');
+    expect(handler.mock.calls.length).toBe(1);
+  });
+});

From 43c6f7ca495a8d05cdfb1d54ce6df85eaa3b9ac3 Mon Sep 17 00:00:00 2001
From: Alex Henry <adhe223@g.uky.edu>
Date: Thu, 22 Feb 2018 12:06:44 -0800
Subject: [PATCH 1433/1641] ContextualMenu Custom Children Render (#4043)

* WIP code to support custom child rendering

* Move rendericon over

* Add the optional prop to override child rendering.  Also complete the moving over of ContextualMenuItemChildren

* separating the context menu utility functions from contextual menu

* adding unit tests for menu item children and menu utility

* Move files and change imports

* Add visual example to documentation

* Add test for the new property

* Fix all linting issues

* Fix testing issues

* add test for contextualMenuItemChildren

* fixing linting errors

* Small wording change

* Add npm change file

* Address some small comments

* Use JSXy sub components instead of functions

* Now need a full mount to test subcomponent logic. Update snaps

* Rename to be ContextualMenuItem instead of ContextualMenuItemChildren

* Missed some renamings

* Ran the snapshot command

* Destructure, alias, and default value the children renderer so we can remove the class level var

* Move bacl to functions in order to cut the huge snapshots down and not full mount

* Run snapshot update command

* Renames utilities

* Bump asset size

* Update CustomChildrenRender_2018-02-21-00-47.json

Small changelog update

* Update package.json

Remove extra whitespace my editor loves to add

* Add basic documentation of types
---
 ...CustomChildrenRender_2018-02-21-00-47.json |  11 +
 .../src/components/CommandBar/CommandBar.tsx  |   3 +-
 .../ContextualMenu/ContextualMenu.test.tsx    |  26 +
 .../ContextualMenu/ContextualMenu.tsx         | 102 +---
 .../ContextualMenu/ContextualMenu.types.ts    |  10 +
 .../ContextualMenuItem.test.tsx               | 142 +++++
 .../ContextualMenu/ContextualMenuItem.tsx     |  75 +++
 .../ContextualMenuItem.types.ts               |  32 ++
 .../ContextualMenu/ContextualMenuPage.tsx     |   8 +
 .../ContextualMenuItem.test.tsx.snap          | 541 ++++++++++++++++++
 .../ContextualMenu.CustomMenuItem.Example.tsx |  57 ++
 .../src/components/ContextualMenu/index.ts    |   2 +
 .../contextualMenuUtility.test.ts             |  96 ++++
 .../contextualMenu/contextualMenuUtility.ts   |  30 +
 .../src/utilities/contextualMenu/index.ts     |   1 +
 scripts/package.json                          |   4 +-
 16 files changed, 1066 insertions(+), 74 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/CustomChildrenRender_2018-02-21-00-47.json
 create mode 100644 packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.test.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.types.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/ContextualMenu/__snapshots__/ContextualMenuItem.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomMenuItem.Example.tsx
 create mode 100644 packages/office-ui-fabric-react/src/utilities/contextualMenu/contextualMenuUtility.test.ts
 create mode 100644 packages/office-ui-fabric-react/src/utilities/contextualMenu/contextualMenuUtility.ts
 create mode 100644 packages/office-ui-fabric-react/src/utilities/contextualMenu/index.ts

diff --git a/common/changes/office-ui-fabric-react/CustomChildrenRender_2018-02-21-00-47.json b/common/changes/office-ui-fabric-react/CustomChildrenRender_2018-02-21-00-47.json
new file mode 100644
index 0000000000000..7d1894f5481e7
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/CustomChildrenRender_2018-02-21-00-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "add optional custom rendering of items for ContextualMenu",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "alhenry@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 33f96ef5ce1e7..bf7a9c85599b8 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -11,7 +11,8 @@ import {
 } from '../../Utilities';
 import { ICommandBar, ICommandBarProps, ICommandBarItemProps } from './CommandBar.types';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
-import { ContextualMenu, IContextualMenuProps, IContextualMenuItem, hasSubmenu } from '../../ContextualMenu';
+import { ContextualMenu, IContextualMenuProps, IContextualMenuItem } from '../../ContextualMenu';
+import { hasSubmenu } from '../../utilities/contextualMenu';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import {
   Icon,
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
index 435a4f8d7f78d..3efa04c9d2991 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
@@ -611,6 +611,32 @@ describe('ContextualMenu', () => {
     expect(subMenuOpened).toEqual(true);
   });
 
+  it('calls the custom child renderer when the contextualMenuItemAs prop is provided', () => {
+    const items: IContextualMenuItem[] = [
+      {
+        name: 'TestText 1',
+        key: 'TestKey1',
+      },
+      {
+        name: 'TestText 2',
+        key: 'TestKey2',
+      }
+    ];
+    const customRenderer = jest.fn(() => null);
+
+    ReactTestUtils.renderIntoDocument<ContextualMenu>(
+      <ContextualMenu
+        items={ items }
+        contextualMenuItemAs={ customRenderer }
+      />
+    );
+
+    const menuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
+    ReactTestUtils.Simulate.click(menuItem);
+
+    expect(customRenderer).toHaveBeenCalledTimes(2);
+  });
+
   describe('canAnyMenuItemsCheck', () => {
     it('returns false when there are no checkable menu items', () => {
       const items: IContextualMenuItem[] = [
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 34f04a285937c..7d9fe69b402b1 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -28,6 +28,7 @@ import {
   css,
   shouldWrapFocus
 } from '../../Utilities';
+import { hasSubmenu, getIsChecked } from '../../utilities/contextualMenu';
 import { withResponsiveMode, ResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
 import { Callout } from '../../Callout';
 import {
@@ -37,6 +38,8 @@ import {
 import {
   VerticalDivider
 } from '../../Divider';
+import { ContextualMenuItem } from './ContextualMenuItem';
+import { IContextualMenuItemProps } from './ContextualMenuItem.types';
 
 export interface IContextualMenuState {
   expandedMenuItemKey?: string;
@@ -50,39 +53,10 @@ export interface IContextualMenuState {
   submenuDirection?: DirectionalHint;
 }
 
-export function hasSubmenu(item: IContextualMenuItem) {
-  return !!(item.subMenuProps || item.items);
-}
-
 export function getSubmenuItems(item: IContextualMenuItem) {
   return item.subMenuProps ? item.subMenuProps.items : item.items;
 }
 
-/**
- * Determines the effective checked state of a menu item.
- *
- * @param item {IContextualMenuItem} to get the check state of.
- * @returns {true} if the item is checked.
- * @returns {false} if the item is unchecked.
- * @returns {null} if the item is not checkable.
- */
-function getIsChecked(item: IContextualMenuItem): boolean | null {
-  if (item.canCheck) {
-    return !!(item.isChecked || item.checked);
-  }
-
-  if (typeof item.isChecked === 'boolean') {
-    return item.isChecked;
-  }
-
-  if (typeof item.checked === 'boolean') {
-    return item.checked;
-  }
-
-  // Item is not checkable.
-  return null;
-}
-
 /**
  * Returns true if a list of menu items can contain a checkbox
  */
@@ -487,13 +461,22 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   }
 
   private _renderHeaderMenuItem(item: IContextualMenuItem, classNames: IMenuItemClassNames, index: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
+    const { contextualMenuItemAs: ChildrenRenderer = ContextualMenuItem } = this.props;
+
     return (
       <div className={ this._classNames.header } style={ item.style } role='heading' aria-level={ this.props.title ? 2 : 1 }>
-        { this._renderMenuItemChildren(item, classNames, index, hasCheckmarks, hasIcons) }
+        <ChildrenRenderer
+          item={item}
+          classNames={classNames}
+          index={index}
+          onCheckmarkClick={hasCheckmarks? this._onItemClick : undefined}
+          hasIcons={hasIcons}
+        />
       </div>);
   }
 
   private _renderAnchorMenuItem(item: IContextualMenuItem, classNames: IMenuItemClassNames, index: number, focusableElementIndex: number, totalItemCount: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
+    const { contextualMenuItemAs: ChildrenRenderer = ContextualMenuItem } = this.props;
     return (
       <div>
         <a
@@ -508,7 +491,13 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
           style={ item.style }
           onClick={ this._onAnchorClick.bind(this, item) }
         >
-          { this._renderMenuItemChildren(item, classNames, index, hasCheckmarks, hasIcons) }
+          <ChildrenRenderer
+            item={item}
+            classNames={classNames}
+            index={index}
+            onCheckmarkClick={hasCheckmarks? this._onItemClick : undefined}
+            hasIcons={hasIcons}
+          />
         </a>
       </div>);
   }
@@ -522,6 +511,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     hasCheckmarks?: boolean,
     hasIcons?: boolean) {
     const { expandedMenuItemKey } = this.state;
+    const { contextualMenuItemAs: ChildrenRenderer = ContextualMenuItem } = this.props;
+
     let { subMenuId } = this.state;
     if (item.subMenuProps && item.subMenuProps.id) {
       subMenuId = item.subMenuProps.id;
@@ -567,8 +558,9 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       <button
         { ...getNativeProps(item, buttonProperties) }
         { ...itemButtonProperties }
-        children={ this._renderMenuItemChildren(item, classNames, index, hasCheckmarks!, hasIcons!) }
-      />
+      >
+        <ChildrenRenderer item={item} classNames={classNames} index={index} onCheckmarkClick={hasCheckmarks? this._onItemClick : undefined} hasIcons={hasIcons} />
+      </button>
     );
   }
 
@@ -608,6 +600,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     const isChecked: boolean | null | undefined = getIsChecked(item);
     const canCheck: boolean = isChecked !== null;
     const defaultRole = canCheck ? 'menuitemcheckbox' : 'menuitem';
+    const { contextualMenuItemAs: ChildrenRenderer = ContextualMenuItem } = this.props;
 
     const itemProps = {
       key: item.key,
@@ -624,10 +617,12 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     } as IContextualMenuItem;
     return React.createElement('button',
       getNativeProps(itemProps, buttonProperties),
-      this._renderMenuItemChildren(itemProps, classNames, index, hasCheckmarks, hasIcons));
+      <ChildrenRenderer item={item} classNames={classNames} index={index} onCheckmarkClick={hasCheckmarks? this._onItemClick : undefined} hasIcons={hasIcons} />,
+    );
   }
 
   private _renderSplitIconButton(item: IContextualMenuItem, classNames: IMenuItemClassNames, index: number) {
+    const { contextualMenuItemAs: ChildrenRenderer = ContextualMenuItem } = this.props;
     const itemProps = {
       onClick: this._onItemClick.bind(this, item),
       disabled: this._isItemDisabled(item),
@@ -645,7 +640,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
         onMouseDown: (ev: any) => this._onItemMouseDown(item, ev),
         onMouseMove: this._onItemMouseMove.bind(this, item)
       }),
-      this._renderMenuItemChildren(itemProps, classNames, index, false, false));
+      <ChildrenRenderer item={item} classNames={classNames} index={index} hasIcons={false} />
+    );
   }
 
   private _renderSplitDivider(item: IContextualMenuItem) {
@@ -653,35 +649,6 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     return <VerticalDivider getClassNames={ getDividerClassnames } />;
   }
 
-  private _renderMenuItemChildren(item: IContextualMenuItem, classNames: IMenuItemClassNames, index: number, hasCheckmarks: boolean, hasIcons: boolean) {
-    const isItemChecked: boolean | null | undefined = getIsChecked(item);
-    return (
-      <div className={ item.split ? classNames.linkContentMenu : classNames.linkContent }>
-        { (hasCheckmarks) ? (
-          <Icon
-            iconName={ isItemChecked === true ? 'CheckMark' : '' }
-            className={ classNames.checkmarkIcon }
-            onClick={ this._onItemClick.bind(this, item) }
-          />
-        ) : (null) }
-        { (hasIcons) ? (
-          this._renderIcon(item, classNames)
-        ) : (null) }
-        { item.name ? (
-          <span className={ classNames.label }>{ item.name }</span>
-        ) : null
-        }
-        { hasSubmenu(item) ? (
-          <Icon
-            iconName={ getRTL() ? 'ChevronLeft' : 'ChevronRight' }
-            { ...item.submenuIconProps }
-            className={ classNames.subMenuIcon }
-          />
-        ) : (null) }
-      </div>
-    );
-  }
-
   private _getIconProps(item: IContextualMenuItem): IIconProps {
     const iconProps: IIconProps = item.iconProps ? item.iconProps : {
       iconName: item.icon
@@ -689,13 +656,6 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     return iconProps;
   }
 
-  private _renderIcon(item: IContextualMenuItem, classNames: IMenuItemClassNames) {
-    // Only present to allow continued use of item.icon which is deprecated.
-    const iconProps = this._getIconProps(item);
-
-    return <Icon { ...iconProps } className={ classNames.icon } />;
-  }
-
   @autobind
   private _onKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
     if (ev.which === KeyCodes.escape ||
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
index 7e6ebb098f4cd..180a1aa61f411 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
@@ -15,6 +15,8 @@ import { IWithResponsiveModeState } from '../../utilities/decorators/withRespons
 import { IContextualMenuClassNames, IMenuItemClassNames } from './ContextualMenu.classNames';
 export { DirectionalHint } from '../../common/DirectionalHint';
 import { IVerticalDividerClassNames } from '../Divider/VerticalDivider.types';
+import { ContextualMenuItem } from './ContextualMenuItem';
+import { IContextualMenuItemProps } from './ContextualMenuItem.types';
 
 export enum ContextualMenuItemType {
   Normal = 0,
@@ -220,6 +222,14 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
   /** Method to call when trying to render a submenu. */
   onRenderSubMenu?: IRenderFunction<IContextualMenuProps>;
 
+  /**
+   * Method to override the render of the individual menu items
+   * @default ContextualMenuItem
+   */
+  contextualMenuItemAs?:
+    React.ComponentClass<IContextualMenuItemProps> |
+    React.StatelessComponent<IContextualMenuItemProps>;
+
   /**
    * Props to pass down to the FocusZone.
    * NOTE: the default FocusZoneDirection will be used unless a direction
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.test.tsx
new file mode 100644
index 0000000000000..76545c463f2c1
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.test.tsx
@@ -0,0 +1,142 @@
+jest.mock('../../utilities/contextualMenu');
+
+import * as React from 'react';
+import { shallow, ShallowWrapper } from 'enzyme';
+import { ContextualMenuItem } from './ContextualMenuItem';
+import { IContextualMenuItemProps } from './ContextualMenuItem.types';
+import { IContextualMenuItem } from './ContextualMenu.types';
+import { IMenuItemClassNames } from './ContextualMenu.classNames';
+import { hasSubmenu } from '../../utilities/contextualMenu';
+
+describe('ContextMenuItemChildren', () => {
+  describe('when a checkmark icon', () => {
+    let onCheckmarkClick: jest.Mock;
+    let menuItem: IContextualMenuItem;
+    let menuClassNames: IMenuItemClassNames;
+    let wrapper: ShallowWrapper<IContextualMenuItemProps, {}>;
+
+    beforeEach(() => {
+      menuItem = { key: '123' };
+      menuClassNames = getMenuItemClassNames();
+      onCheckmarkClick = jest.fn();
+
+      wrapper = shallow(
+        <ContextualMenuItem
+          item={ menuItem }
+          classNames={ menuClassNames }
+          index={ 1 }
+          hasIcons={ undefined }
+          onCheckmarkClick={ onCheckmarkClick }
+        />
+      );
+    });
+
+    it('renders the component with the checkmark', () => {
+      expect(wrapper).toMatchSnapshot();
+    });
+
+    describe('when the checkmark is clicked', () => {
+      let event: jest.Mock;
+      beforeEach(() => {
+        event = jest.fn();
+        wrapper.find('.checkmarkIcon').simulate('click', event);
+      });
+
+      it('invokes the onCheckmarkClick callback', () => {
+        expect(onCheckmarkClick).toHaveBeenCalledWith(menuItem, event);
+      });
+    });
+  });
+
+  describe('when it has icons', () => {
+    describe('when it has iconProps', () => {
+      let menuItem: IContextualMenuItem;
+      let menuClassNames: IMenuItemClassNames;
+      let wrapper: ShallowWrapper<IContextualMenuItemProps, {}>;
+
+      beforeEach(() => {
+        menuItem = { key: '123', icon: 'itemIcon', name: 'menuItem' };
+        menuClassNames = getMenuItemClassNames();
+
+        wrapper = shallow(
+          <ContextualMenuItem
+            item={ menuItem }
+            classNames={ menuClassNames }
+            index={ 1 }
+            hasIcons={ true }
+          />
+        );
+      });
+
+      it('renders the icon', () => {
+        expect(wrapper).toMatchSnapshot();
+      });
+    });
+
+    describe('when it doesnt have iconProps', () => {
+      let menuItem: IContextualMenuItem;
+      let menuClassNames: IMenuItemClassNames;
+      let wrapper: ShallowWrapper<IContextualMenuItemProps, {}>;
+
+      beforeEach(() => {
+        menuItem = { key: '123', iconProps: {} };
+        menuClassNames = getMenuItemClassNames();
+
+        wrapper = shallow(
+          <ContextualMenuItem
+            item={ menuItem }
+            classNames={ menuClassNames }
+            index={ 1 }
+            hasIcons={ true }
+          />
+        );
+      });
+
+      it('renders the icon with iconName', () => {
+        expect(wrapper).toMatchSnapshot();
+      });
+    });
+  });
+
+  describe('when it has a sub menu', () => {
+    let menuItem: IContextualMenuItem;
+    let menuClassNames: IMenuItemClassNames;
+    let wrapper: ShallowWrapper<IContextualMenuItemProps, {}>;
+
+    beforeEach(() => {
+      (hasSubmenu as jest.Mock).mockReturnValue(true);
+      menuItem = { key: '123', iconProps: {}, submenuIconProps: {} };
+      menuClassNames = getMenuItemClassNames();
+
+      wrapper = shallow(
+        <ContextualMenuItem
+          item={ menuItem }
+          classNames={ menuClassNames }
+          index={ 1 }
+          hasIcons={ true }
+        />
+      );
+    });
+
+    it('renders the menu icon', () => {
+      expect(wrapper).toMatchSnapshot();
+    });
+  });
+});
+
+function getMenuItemClassNames(): IMenuItemClassNames {
+  return {
+    item: 'item',
+    divider: '---',
+    root: 'root',
+    linkContent: 'linkContent',
+    icon: 'icon',
+    checkmarkIcon: 'checkmarkIcon',
+    subMenuIcon: 'subMenuIcon',
+    label: 'label',
+    splitContainer: 'splitContainer',
+    splitPrimary: 'splitPrimary',
+    splitMenu: 'splitMenu',
+    linkContentMenu: 'linkContentMenu',
+  };
+}
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.tsx
new file mode 100644
index 0000000000000..cd99d97ea4a10
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.tsx
@@ -0,0 +1,75 @@
+import * as React from 'react';
+import { hasSubmenu, getIsChecked } from '../../utilities/contextualMenu';
+import { IContextualMenuItem } from './ContextualMenu.types';
+import { IMenuItemClassNames } from './ContextualMenu.classNames';
+import { getRTL } from '../../Utilities';
+import { Icon, IIconProps } from '../../Icon';
+import { IContextualMenuItemProps } from './ContextualMenuItem.types';
+
+const renderItemIcon = ({ hasIcons, item, classNames }: IContextualMenuItemProps) => {
+  // Only present to allow continued use of item.icon which is deprecated.
+  const { iconProps, icon } = item;
+
+  if (!hasIcons) {
+    return null;
+  }
+
+  if (iconProps) {
+    return <Icon { ...iconProps } className={ classNames.icon } />;
+  }
+
+  return <Icon iconName={ icon } className={ classNames.icon } />;
+};
+
+const renderCheckMarkIcon = ({ onCheckmarkClick, item, classNames }: IContextualMenuItemProps) => {
+  const isItemChecked = getIsChecked(item);
+  if (onCheckmarkClick) {
+    const onClick = (e: React.MouseEvent<HTMLElement>) => onCheckmarkClick(item, e);
+
+    return (
+      <Icon
+        iconName={ isItemChecked ? 'CheckMark' : '' }
+        className={ classNames.checkmarkIcon }
+        onClick={ onClick }
+      />
+    );
+  }
+  return null;
+};
+
+const renderItemName = ({ item, classNames }: IContextualMenuItemProps) => {
+  if (item.name) {
+    return <span className={ classNames.label }>{ item.name }</span>;
+  }
+  return null;
+};
+
+const renderSubMenuIcon = ({ item, classNames }: IContextualMenuItemProps) => {
+  if (hasSubmenu(item)) {
+    return (
+      <Icon
+        iconName={ getRTL() ? 'ChevronLeft' : 'ChevronRight' }
+        { ...item.submenuIconProps }
+        className={ classNames.subMenuIcon }
+      />
+    );
+  }
+  return null;
+};
+
+export const ContextualMenuItem: React.StatelessComponent<IContextualMenuItemProps> = (props) => {
+  const { item, classNames } = props;
+
+  return (
+    <div
+      className={
+        item.split ? classNames.linkContentMenu : classNames.linkContent
+      }
+    >
+      { renderCheckMarkIcon(props) }
+      { renderItemIcon(props) }
+      { renderItemName(props) }
+      { renderSubMenuIcon(props) }
+    </div>
+  );
+};
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.types.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.types.ts
new file mode 100644
index 0000000000000..0aaa86b85a9a5
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.types.ts
@@ -0,0 +1,32 @@
+import { ContextualMenuItem } from './ContextualMenuItem';
+import { IContextualMenuItem } from './ContextualMenu.types';
+import { IMenuItemClassNames } from './ContextualMenu.classNames';
+
+export interface IContextualMenuItemProps
+  extends React.HTMLAttributes<IContextualMenuItemProps> {
+
+  /**
+   * The item to display
+   */
+  item: IContextualMenuItem;
+
+  /**
+   * Classnames for different aspects of a menu item
+   */
+  classNames: IMenuItemClassNames;
+
+  /**
+   * Index of the item
+   */
+  index: number;
+
+  /**
+   * If this item has icons
+   */
+  hasIcons: boolean | undefined;
+
+  /**
+   * Click handler for the checkmark
+   */
+  onCheckmarkClick?: ((item: IContextualMenuItem, ev: React.MouseEvent<HTMLElement>) => void);
+}
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
index 109736bdae362..36bf5a362a977 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
@@ -14,6 +14,7 @@ import { ContextualMenuCheckmarksExample } from './examples/ContextualMenu.Check
 import { ContextualMenuDirectionalExample } from './examples/ContextualMenu.Directional.Example';
 import { ContextualMenuCustomizationExample } from './examples/ContextualMenu.Customization.Example';
 import { ContextualMenuWithScrollBarExample } from './examples/ContextualMenu.ScrollBar.Example';
+import { ContextualMenuWithCustomMenuItemExample } from './examples/ContextualMenu.CustomMenuItem.Example';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { ContextualMenuStatus } from './ContextualMenu.checklist';
 
@@ -27,6 +28,7 @@ const ContextualMenuDirectionalExampleCode = require('!raw-loader!office-ui-fabr
 const ContextualMenuCustomizationExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx') as string;
 const ContextualMenuWithScrollBarExampleCode = require
   ('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.ScrollBar.Example.tsx') as string;
+const ContextualMenuWithCustomMenuItemExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomMenuItem.Example.tsx') as string;
 
 export class ContextualMenuPage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
@@ -90,6 +92,12 @@ export class ContextualMenuPage extends React.Component<IComponentDemoPageProps,
             >
               <ContextualMenuWithScrollBarExample />
             </ExampleCard>
+            <ExampleCard
+              title='ContextualMenu with custom rendered menu items'
+              code={ ContextualMenuWithCustomMenuItemExampleCode }
+            >
+              <ContextualMenuWithCustomMenuItemExample />
+            </ExampleCard>
 
           </div>
         }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/__snapshots__/ContextualMenuItem.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ContextualMenu/__snapshots__/ContextualMenuItem.test.tsx.snap
new file mode 100644
index 0000000000000..11c4226f3d2f8
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/__snapshots__/ContextualMenuItem.test.tsx.snap
@@ -0,0 +1,541 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ContextMenuItemChildren when a checkmark icon renders the component with the checkmark 1`] = `
+ShallowWrapper {
+  "length": 1,
+  Symbol(enzyme.__root__): [Circular],
+  Symbol(enzyme.__unrendered__): <Unknown
+    classNames={
+      Object {
+        "checkmarkIcon": "checkmarkIcon",
+        "divider": "---",
+        "icon": "icon",
+        "item": "item",
+        "label": "label",
+        "linkContent": "linkContent",
+        "linkContentMenu": "linkContentMenu",
+        "root": "root",
+        "splitContainer": "splitContainer",
+        "splitMenu": "splitMenu",
+        "splitPrimary": "splitPrimary",
+        "subMenuIcon": "subMenuIcon",
+      }
+    }
+    hasIcons={undefined}
+    index={1}
+    item={
+      Object {
+        "key": "123",
+      }
+    }
+    onCheckmarkClick={[Function]}
+  />,
+  Symbol(enzyme.__renderer__): Object {
+    "batchedUpdates": [Function],
+    "getNode": [Function],
+    "render": [Function],
+    "simulateEvent": [Function],
+    "unmount": [Function],
+  },
+  Symbol(enzyme.__node__): Object {
+    "instance": null,
+    "key": undefined,
+    "nodeType": "host",
+    "props": Object {
+      "children": Array [
+        <Icon
+          className="checkmarkIcon"
+          iconName=""
+          onClick={[Function]}
+        />,
+        null,
+        null,
+        null,
+      ],
+      "className": "linkContent",
+    },
+    "ref": null,
+    "rendered": Array [
+      Object {
+        "instance": null,
+        "key": undefined,
+        "nodeType": "class",
+        "props": Object {
+          "className": "checkmarkIcon",
+          "iconName": "",
+          "onClick": [Function],
+        },
+        "ref": null,
+        "rendered": null,
+        "type": [Function],
+      },
+      null,
+      null,
+      null,
+    ],
+    "type": "div",
+  },
+  Symbol(enzyme.__nodes__): Array [
+    Object {
+      "instance": null,
+      "key": undefined,
+      "nodeType": "host",
+      "props": Object {
+        "children": Array [
+          <Icon
+            className="checkmarkIcon"
+            iconName=""
+            onClick={[Function]}
+          />,
+          null,
+          null,
+          null,
+        ],
+        "className": "linkContent",
+      },
+      "ref": null,
+      "rendered": Array [
+        Object {
+          "instance": null,
+          "key": undefined,
+          "nodeType": "class",
+          "props": Object {
+            "className": "checkmarkIcon",
+            "iconName": "",
+            "onClick": [Function],
+          },
+          "ref": null,
+          "rendered": null,
+          "type": [Function],
+        },
+        null,
+        null,
+        null,
+      ],
+      "type": "div",
+    },
+  ],
+  Symbol(enzyme.__options__): Object {
+    "adapter": ReactSixteenAdapter {
+      "options": Object {
+        "enableComponentDidUpdateOnSetState": true,
+      },
+    },
+  },
+}
+`;
+
+exports[`ContextMenuItemChildren when it has a sub menu renders the menu icon 1`] = `
+ShallowWrapper {
+  "length": 1,
+  Symbol(enzyme.__root__): [Circular],
+  Symbol(enzyme.__unrendered__): <Unknown
+    classNames={
+      Object {
+        "checkmarkIcon": "checkmarkIcon",
+        "divider": "---",
+        "icon": "icon",
+        "item": "item",
+        "label": "label",
+        "linkContent": "linkContent",
+        "linkContentMenu": "linkContentMenu",
+        "root": "root",
+        "splitContainer": "splitContainer",
+        "splitMenu": "splitMenu",
+        "splitPrimary": "splitPrimary",
+        "subMenuIcon": "subMenuIcon",
+      }
+    }
+    hasIcons={true}
+    index={1}
+    item={
+      Object {
+        "iconProps": Object {},
+        "key": "123",
+        "submenuIconProps": Object {},
+      }
+    }
+  />,
+  Symbol(enzyme.__renderer__): Object {
+    "batchedUpdates": [Function],
+    "getNode": [Function],
+    "render": [Function],
+    "simulateEvent": [Function],
+    "unmount": [Function],
+  },
+  Symbol(enzyme.__node__): Object {
+    "instance": null,
+    "key": undefined,
+    "nodeType": "host",
+    "props": Object {
+      "children": Array [
+        null,
+        <Icon
+          className="icon"
+        />,
+        null,
+        <Icon
+          className="subMenuIcon"
+          iconName="ChevronRight"
+        />,
+      ],
+      "className": "linkContent",
+    },
+    "ref": null,
+    "rendered": Array [
+      null,
+      Object {
+        "instance": null,
+        "key": undefined,
+        "nodeType": "class",
+        "props": Object {
+          "className": "icon",
+        },
+        "ref": null,
+        "rendered": null,
+        "type": [Function],
+      },
+      null,
+      Object {
+        "instance": null,
+        "key": undefined,
+        "nodeType": "class",
+        "props": Object {
+          "className": "subMenuIcon",
+          "iconName": "ChevronRight",
+        },
+        "ref": null,
+        "rendered": null,
+        "type": [Function],
+      },
+    ],
+    "type": "div",
+  },
+  Symbol(enzyme.__nodes__): Array [
+    Object {
+      "instance": null,
+      "key": undefined,
+      "nodeType": "host",
+      "props": Object {
+        "children": Array [
+          null,
+          <Icon
+            className="icon"
+          />,
+          null,
+          <Icon
+            className="subMenuIcon"
+            iconName="ChevronRight"
+          />,
+        ],
+        "className": "linkContent",
+      },
+      "ref": null,
+      "rendered": Array [
+        null,
+        Object {
+          "instance": null,
+          "key": undefined,
+          "nodeType": "class",
+          "props": Object {
+            "className": "icon",
+          },
+          "ref": null,
+          "rendered": null,
+          "type": [Function],
+        },
+        null,
+        Object {
+          "instance": null,
+          "key": undefined,
+          "nodeType": "class",
+          "props": Object {
+            "className": "subMenuIcon",
+            "iconName": "ChevronRight",
+          },
+          "ref": null,
+          "rendered": null,
+          "type": [Function],
+        },
+      ],
+      "type": "div",
+    },
+  ],
+  Symbol(enzyme.__options__): Object {
+    "adapter": ReactSixteenAdapter {
+      "options": Object {
+        "enableComponentDidUpdateOnSetState": true,
+      },
+    },
+  },
+}
+`;
+
+exports[`ContextMenuItemChildren when it has icons when it doesnt have iconProps renders the icon with iconName 1`] = `
+ShallowWrapper {
+  "length": 1,
+  Symbol(enzyme.__root__): [Circular],
+  Symbol(enzyme.__unrendered__): <Unknown
+    classNames={
+      Object {
+        "checkmarkIcon": "checkmarkIcon",
+        "divider": "---",
+        "icon": "icon",
+        "item": "item",
+        "label": "label",
+        "linkContent": "linkContent",
+        "linkContentMenu": "linkContentMenu",
+        "root": "root",
+        "splitContainer": "splitContainer",
+        "splitMenu": "splitMenu",
+        "splitPrimary": "splitPrimary",
+        "subMenuIcon": "subMenuIcon",
+      }
+    }
+    hasIcons={true}
+    index={1}
+    item={
+      Object {
+        "iconProps": Object {},
+        "key": "123",
+      }
+    }
+  />,
+  Symbol(enzyme.__renderer__): Object {
+    "batchedUpdates": [Function],
+    "getNode": [Function],
+    "render": [Function],
+    "simulateEvent": [Function],
+    "unmount": [Function],
+  },
+  Symbol(enzyme.__node__): Object {
+    "instance": null,
+    "key": undefined,
+    "nodeType": "host",
+    "props": Object {
+      "children": Array [
+        null,
+        <Icon
+          className="icon"
+        />,
+        null,
+        null,
+      ],
+      "className": "linkContent",
+    },
+    "ref": null,
+    "rendered": Array [
+      null,
+      Object {
+        "instance": null,
+        "key": undefined,
+        "nodeType": "class",
+        "props": Object {
+          "className": "icon",
+        },
+        "ref": null,
+        "rendered": null,
+        "type": [Function],
+      },
+      null,
+      null,
+    ],
+    "type": "div",
+  },
+  Symbol(enzyme.__nodes__): Array [
+    Object {
+      "instance": null,
+      "key": undefined,
+      "nodeType": "host",
+      "props": Object {
+        "children": Array [
+          null,
+          <Icon
+            className="icon"
+          />,
+          null,
+          null,
+        ],
+        "className": "linkContent",
+      },
+      "ref": null,
+      "rendered": Array [
+        null,
+        Object {
+          "instance": null,
+          "key": undefined,
+          "nodeType": "class",
+          "props": Object {
+            "className": "icon",
+          },
+          "ref": null,
+          "rendered": null,
+          "type": [Function],
+        },
+        null,
+        null,
+      ],
+      "type": "div",
+    },
+  ],
+  Symbol(enzyme.__options__): Object {
+    "adapter": ReactSixteenAdapter {
+      "options": Object {
+        "enableComponentDidUpdateOnSetState": true,
+      },
+    },
+  },
+}
+`;
+
+exports[`ContextMenuItemChildren when it has icons when it has iconProps renders the icon 1`] = `
+ShallowWrapper {
+  "length": 1,
+  Symbol(enzyme.__root__): [Circular],
+  Symbol(enzyme.__unrendered__): <Unknown
+    classNames={
+      Object {
+        "checkmarkIcon": "checkmarkIcon",
+        "divider": "---",
+        "icon": "icon",
+        "item": "item",
+        "label": "label",
+        "linkContent": "linkContent",
+        "linkContentMenu": "linkContentMenu",
+        "root": "root",
+        "splitContainer": "splitContainer",
+        "splitMenu": "splitMenu",
+        "splitPrimary": "splitPrimary",
+        "subMenuIcon": "subMenuIcon",
+      }
+    }
+    hasIcons={true}
+    index={1}
+    item={
+      Object {
+        "icon": "itemIcon",
+        "key": "123",
+        "name": "menuItem",
+      }
+    }
+  />,
+  Symbol(enzyme.__renderer__): Object {
+    "batchedUpdates": [Function],
+    "getNode": [Function],
+    "render": [Function],
+    "simulateEvent": [Function],
+    "unmount": [Function],
+  },
+  Symbol(enzyme.__node__): Object {
+    "instance": null,
+    "key": undefined,
+    "nodeType": "host",
+    "props": Object {
+      "children": Array [
+        null,
+        <Icon
+          className="icon"
+          iconName="itemIcon"
+        />,
+        <span
+          className="label"
+        >
+          menuItem
+        </span>,
+        null,
+      ],
+      "className": "linkContent",
+    },
+    "ref": null,
+    "rendered": Array [
+      null,
+      Object {
+        "instance": null,
+        "key": undefined,
+        "nodeType": "class",
+        "props": Object {
+          "className": "icon",
+          "iconName": "itemIcon",
+        },
+        "ref": null,
+        "rendered": null,
+        "type": [Function],
+      },
+      Object {
+        "instance": null,
+        "key": undefined,
+        "nodeType": "host",
+        "props": Object {
+          "children": "menuItem",
+          "className": "label",
+        },
+        "ref": null,
+        "rendered": "menuItem",
+        "type": "span",
+      },
+      null,
+    ],
+    "type": "div",
+  },
+  Symbol(enzyme.__nodes__): Array [
+    Object {
+      "instance": null,
+      "key": undefined,
+      "nodeType": "host",
+      "props": Object {
+        "children": Array [
+          null,
+          <Icon
+            className="icon"
+            iconName="itemIcon"
+          />,
+          <span
+            className="label"
+          >
+            menuItem
+          </span>,
+          null,
+        ],
+        "className": "linkContent",
+      },
+      "ref": null,
+      "rendered": Array [
+        null,
+        Object {
+          "instance": null,
+          "key": undefined,
+          "nodeType": "class",
+          "props": Object {
+            "className": "icon",
+            "iconName": "itemIcon",
+          },
+          "ref": null,
+          "rendered": null,
+          "type": [Function],
+        },
+        Object {
+          "instance": null,
+          "key": undefined,
+          "nodeType": "host",
+          "props": Object {
+            "children": "menuItem",
+            "className": "label",
+          },
+          "ref": null,
+          "rendered": "menuItem",
+          "type": "span",
+        },
+        null,
+      ],
+      "type": "div",
+    },
+  ],
+  Symbol(enzyme.__options__): Object {
+    "adapter": ReactSixteenAdapter {
+      "options": Object {
+        "enableComponentDidUpdateOnSetState": true,
+      },
+    },
+  },
+}
+`;
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomMenuItem.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomMenuItem.Example.tsx
new file mode 100644
index 0000000000000..a0c9fa9cbcb15
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomMenuItem.Example.tsx
@@ -0,0 +1,57 @@
+import * as React from 'react';
+import { ContextualMenuItemType, IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { IContextualMenuItemProps } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
+import './ContextualMenuExample.scss';
+
+export class ContextualMenuWithCustomMenuItemExample extends React.Component {
+
+  constructor(props: {}) {
+    super(props);
+    this.state = {
+      showCallout: false
+    };
+  }
+
+  public render() {
+    return (
+      <div>
+        <DefaultButton
+          id='ContextualMenuButton1'
+          text='Click for ContextualMenu'
+          menuProps={ {
+            shouldFocusOnMount: true,
+            items: [
+              {
+                key: 'newItem',
+                name: 'New'
+              },
+              {
+                key: 'divider_1',
+                itemType: ContextualMenuItemType.Divider
+              },
+              {
+                key: 'rename',
+                name: 'Rename'
+              },
+              {
+                key: 'edit',
+                name: 'Edit'
+              },
+              {
+                key: 'properties',
+                name: 'Properties'
+              },
+              {
+                key: 'disabled',
+                name: 'Disabled item',
+                disabled: true
+              }
+            ],
+            contextualMenuItemAs: (props: IContextualMenuItemProps) => <div>Custom rendered {props.item.name}</div>
+          } }
+        />
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/index.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/index.ts
index 26cda857d3173..ee97fdce0f03e 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/index.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/index.ts
@@ -1,2 +1,4 @@
 export * from './ContextualMenu';
 export * from './ContextualMenu.types';
+export * from './ContextualMenuItem';
+export * from './ContextualMenuItem.types';
diff --git a/packages/office-ui-fabric-react/src/utilities/contextualMenu/contextualMenuUtility.test.ts b/packages/office-ui-fabric-react/src/utilities/contextualMenu/contextualMenuUtility.test.ts
new file mode 100644
index 0000000000000..6a1d579d3275d
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/utilities/contextualMenu/contextualMenuUtility.test.ts
@@ -0,0 +1,96 @@
+import { getIsChecked, hasSubmenu } from './contextualMenuUtility';
+import { IContextualMenuItem } from '../..';
+
+describe('getIsChecked', () => {
+  describe('when item can be checked', () => {
+    let menuItem: IContextualMenuItem;
+
+    beforeEach(() => {
+      menuItem = { key: '123', canCheck: true };
+    });
+
+    it('returns true when isChecked', () => {
+      menuItem.isChecked = true;
+      expect(getIsChecked(menuItem)).toBe(true);
+    });
+
+    it('returns true when checked', () => {
+      menuItem.checked = true;
+      expect(getIsChecked(menuItem)).toBe(true);
+    });
+  });
+
+  describe('when item isChecked', () => {
+    let menuItem: IContextualMenuItem;
+
+    beforeEach(() => {
+      menuItem = { key: '123', isChecked: true };
+    });
+
+    it('returns true', () => {
+      expect(getIsChecked(menuItem)).toBe(true);
+    });
+  });
+
+  describe('when item checked flag is true', () => {
+    let menuItem: IContextualMenuItem;
+
+    beforeEach(() => {
+      menuItem = { key: '123', checked: true };
+    });
+
+    it('returns true', () => {
+      expect(getIsChecked(menuItem)).toBe(true);
+    });
+  });
+
+  describe('when it is not checked', () => {
+    let menuItem: IContextualMenuItem;
+
+    beforeEach(() => {
+      menuItem = { key: '123' };
+    });
+
+    it('returns false', () => {
+      expect(getIsChecked(menuItem)).toBeFalsy();
+    });
+  });
+});
+
+describe('hasSubmenu', () => {
+  describe('when there is a submenu props', () => {
+    let menuItem: IContextualMenuItem;
+
+    beforeEach(() => {
+      menuItem = { key: '123', subMenuProps: { items: [] } };
+    });
+
+    it('returns true', () => {
+      expect(hasSubmenu(menuItem)).toBe(true);
+    });
+  });
+
+  describe('when there are items', () => {
+    let menuItem: IContextualMenuItem;
+
+    beforeEach(() => {
+      menuItem = { key: '123', items: [] };
+    });
+
+    it('returns true', () => {
+      expect(hasSubmenu(menuItem)).toBe(true);
+    });
+  });
+
+  describe('when there are no submenu items', () => {
+    let menuItem: IContextualMenuItem;
+
+    beforeEach(() => {
+      menuItem = { key: '123' };
+    });
+
+    it('returns false', () => {
+      expect(hasSubmenu(menuItem)).toBe(false);
+    });
+  });
+});
diff --git a/packages/office-ui-fabric-react/src/utilities/contextualMenu/contextualMenuUtility.ts b/packages/office-ui-fabric-react/src/utilities/contextualMenu/contextualMenuUtility.ts
new file mode 100644
index 0000000000000..e296244f73c73
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/utilities/contextualMenu/contextualMenuUtility.ts
@@ -0,0 +1,30 @@
+import { IContextualMenuItem } from '../..';
+
+/**
+ * Determines the effective checked state of a menu item.
+ *
+ * @param item {IContextualMenuItem} to get the check state of.
+ * @returns {true} if the item is checked.
+ * @returns {false} if the item is unchecked.
+ * @returns {null} if the item is not checkable.
+ */
+export function getIsChecked(item: IContextualMenuItem): boolean | null {
+  if (item.canCheck) {
+    return !!(item.isChecked || item.checked);
+  }
+
+  if (typeof item.isChecked === 'boolean') {
+    return item.isChecked;
+  }
+
+  if (typeof item.checked === 'boolean') {
+    return item.checked;
+  }
+
+  // Item is not checkable.
+  return null;
+}
+
+export function hasSubmenu(item: IContextualMenuItem) {
+  return !!(item.subMenuProps || item.items);
+}
diff --git a/packages/office-ui-fabric-react/src/utilities/contextualMenu/index.ts b/packages/office-ui-fabric-react/src/utilities/contextualMenu/index.ts
new file mode 100644
index 0000000000000..5ab11502d63a0
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/utilities/contextualMenu/index.ts
@@ -0,0 +1 @@
+export * from './contextualMenuUtility';
diff --git a/scripts/package.json b/scripts/package.json
index 1349d0e56e187..a1f94166c4b7f 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -49,7 +49,7 @@
   "bundlesize": [
     {
       "path": "../apps/test-bundle-button/dist/main.min.js",
-      "maxSize": "43.7 kB"
+      "maxSize": "44.5 kB"
     }
   ]
-}
\ No newline at end of file
+}

From 6d0c968d9bda5581da65e6c63138c243355dddfe Mon Sep 17 00:00:00 2001
From: Mark Polak <mark@thedutchies.com>
Date: Thu, 22 Feb 2018 23:31:30 +0100
Subject: [PATCH 1434/1641] Remove SelectionLayout (#4071)

* Remove SelectionLayout

* Add npm change file

* Update remove-SelectionLayout_2018-02-22-19-37.json

* Update remove-SelectionLayout_2018-02-22-19-37.json

* Correct typo
---
 ...move-SelectionLayout_2018-02-22-19-37.json | 11 ++++++++
 .../utilities/selection/SelectionLayout.ts    | 28 -------------------
 .../src/utilities/selection/SelectionZone.tsx |  8 +++---
 .../src/utilities/selection/index.ts          |  1 -
 .../src/utilities/selection/interfaces.ts     |  7 -----
 5 files changed, 15 insertions(+), 40 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/remove-SelectionLayout_2018-02-22-19-37.json
 delete mode 100644 packages/office-ui-fabric-react/src/utilities/selection/SelectionLayout.ts

diff --git a/common/changes/office-ui-fabric-react/remove-SelectionLayout_2018-02-22-19-37.json b/common/changes/office-ui-fabric-react/remove-SelectionLayout_2018-02-22-19-37.json
new file mode 100644
index 0000000000000..334374ea05a8e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/remove-SelectionLayout_2018-02-22-19-37.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SelectionZone: deprecating `layout` as it is no longer in use. Removing `SelectionLayout` as it is not required.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mark@thedutchies.com"
+}
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionLayout.ts b/packages/office-ui-fabric-react/src/utilities/selection/SelectionLayout.ts
deleted file mode 100644
index 24d8707c0155d..0000000000000
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionLayout.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-import {
-  ISelectionLayout,
-  SelectionDirection
-} from './interfaces';
-
-export class SelectionLayout implements ISelectionLayout {
-  private _direction: SelectionDirection;
-
-  constructor(direction: SelectionDirection) {
-    this._direction = direction;
-  }
-
-  public getItemIndexAbove(focusIndex: number, items: any[]): number {
-    return (this._direction === SelectionDirection.vertical) ? Math.max(0, focusIndex - 1) : focusIndex;
-  }
-
-  public getItemIndexBelow(focusIndex: number, items: any[]): number {
-    return (this._direction === SelectionDirection.vertical) ? Math.min(items.length - 1, focusIndex + 1) : focusIndex;
-  }
-
-  public getItemIndexLeft(focusIndex: number, items: any[]): number {
-    return (this._direction === SelectionDirection.vertical) ? focusIndex : Math.max(0, focusIndex - 1);
-  }
-
-  public getItemIndexRight(focusIndex: number, items: any[]): number {
-    return (this._direction === SelectionDirection.vertical) ? focusIndex : Math.min(items.length - 1, focusIndex + 1);
-  }
-}
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
index d75a8ab642185..a1f93b5c74180 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
@@ -10,10 +10,8 @@ import {
   getWindow,
   isElementTabbable
 } from '../../Utilities';
-import { SelectionLayout } from './SelectionLayout';
 import {
   ISelection,
-  ISelectionLayout,
   SelectionDirection,
   SelectionMode
 } from './interfaces';
@@ -42,7 +40,10 @@ const SELECTALL_TOGGLE_ALL_ATTRIBUTE_NAME = 'data-selection-all-toggle';
 export interface ISelectionZoneProps extends React.Props<SelectionZone> {
   componentRef?: () => void;
   selection: ISelection;
-  layout?: ISelectionLayout;
+  /**
+   * @deprecated No longer in use, focus is now managed by FocusZone
+   */
+  layout?: {};
   selectionMode?: SelectionMode;
   selectionPreservedOnEmptyClick?: boolean;
   enterModalOnTouch?: boolean;
@@ -53,7 +54,6 @@ export interface ISelectionZoneProps extends React.Props<SelectionZone> {
 
 export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   public static defaultProps = {
-    layout: new SelectionLayout(SelectionDirection.vertical),
     isMultiSelectEnabled: true,
     isSelectedOnFocus: true,
     selectionMode: SelectionMode.multiple
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/index.ts b/packages/office-ui-fabric-react/src/utilities/selection/index.ts
index c3ca5de5938f9..db1d88f010b13 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/index.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selection/index.ts
@@ -1,4 +1,3 @@
 export * from './interfaces';
 export * from './Selection';
-export * from './SelectionLayout';
 export * from './SelectionZone';
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/interfaces.ts b/packages/office-ui-fabric-react/src/utilities/selection/interfaces.ts
index 58434ad2ea950..10e9e004d4566 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/interfaces.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selection/interfaces.ts
@@ -58,13 +58,6 @@ export interface ISelection {
   toggleRangeSelected(fromIndex: number, count: number): void;
 }
 
-export interface ISelectionLayout {
-  getItemIndexAbove(index: number, items: any[]): number;
-  getItemIndexBelow(index: number, items: any[]): number;
-  getItemIndexLeft(index: number, items: any[]): number;
-  getItemIndexRight(index: number, items: any[]): number;
-}
-
 export enum SelectionDirection {
   horizontal = 0,
   vertical = 1

From ebe601051c081838ae9d029e1020f316258d148a Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Thu, 22 Feb 2018 16:33:52 -0800
Subject: [PATCH 1435/1641] Theming: first draft of variants (#3261)

* partial

* variants

* theming docu

* change files

* add comment

* move variants to a separate file

* fix hanging merge conflict

* revising inputBorder slot

* move variants to a separate package

* update readme

* rename tint to soft

* more debug code

* remove debug code

* remove bodyLink in favor of link

* remove type:none changefiles
---
 .../phkuo-variants_2017-10-28-02-04.json      |  11 ++
 .../phkuo-variants_2017-10-28-02-04.json      |  11 ++
 ghdocs/Theming.md                             |   3 +-
 .../src/common/_semanticSlots.scss            |   1 +
 .../src/components/TextField/TextField.scss   |   2 +-
 .../ThemeGenerator/ThemeGeneratorPage.tsx     |  30 +++-
 .../styling/src/interfaces/ISemanticColors.ts |  12 +-
 packages/styling/src/styles/theme.ts          |   1 +
 packages/variants/.npmignore                  |  22 +++
 packages/variants/.npmrc                      |   2 +
 packages/variants/LICENSE                     |  15 ++
 packages/variants/README.md                   |  11 ++
 packages/variants/jest.config.js              |   3 +
 packages/variants/package.json                |  30 ++++
 packages/variants/src/index.ts                |   4 +
 packages/variants/src/variants.ts             | 139 ++++++++++++++++++
 packages/variants/tsconfig.json               |  26 ++++
 packages/variants/tslint.json                 |   8 +
 packages/variants/webpack.config.js           |  20 +++
 rush.json                                     |   7 +-
 20 files changed, 346 insertions(+), 12 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/phkuo-variants_2017-10-28-02-04.json
 create mode 100644 common/changes/office-ui-fabric-react/phkuo-variants_2017-10-28-02-04.json
 create mode 100644 packages/variants/.npmignore
 create mode 100644 packages/variants/.npmrc
 create mode 100644 packages/variants/LICENSE
 create mode 100644 packages/variants/README.md
 create mode 100644 packages/variants/jest.config.js
 create mode 100644 packages/variants/package.json
 create mode 100644 packages/variants/src/index.ts
 create mode 100644 packages/variants/src/variants.ts
 create mode 100644 packages/variants/tsconfig.json
 create mode 100644 packages/variants/tslint.json
 create mode 100644 packages/variants/webpack.config.js

diff --git a/common/changes/@uifabric/styling/phkuo-variants_2017-10-28-02-04.json b/common/changes/@uifabric/styling/phkuo-variants_2017-10-28-02-04.json
new file mode 100644
index 0000000000000..406c8cc7d5db0
--- /dev/null
+++ b/common/changes/@uifabric/styling/phkuo-variants_2017-10-28-02-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "add preliminary support for variant theming, add bodyLink slot",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/phkuo-variants_2017-10-28-02-04.json b/common/changes/office-ui-fabric-react/phkuo-variants_2017-10-28-02-04.json
new file mode 100644
index 0000000000000..e7a766d64df98
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/phkuo-variants_2017-10-28-02-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "minor fixes to theming",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/ghdocs/Theming.md b/ghdocs/Theming.md
index 1c2b28edfd90f..e6f79bf369294 100644
--- a/ghdocs/Theming.md
+++ b/ghdocs/Theming.md
@@ -25,7 +25,8 @@ Customizing Fabric palette slots allows broad-stroke changes to the overall colo
 Semantic slots are documented in [ISemanticColors.ts](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/styling/src/interfaces/ISemanticColors.ts).
 These, on the other hand, are prescriptive slots, each slot having an intended use.
 This allows more targeted customizations.
-For example, you could change the light gray color of a disabled checkbox without affecting the light gray used by list item hover/selection state.
+For example, you could change the light gray color of a disabled checkbox without affecting the light gray background used by list item hover/selection state, even though they share the same color, because they use different slots.
+This wouldn't be possible with Fabric palette slots.
 We highly recommend using semantic slots wherever possible.
 
 
diff --git a/packages/office-ui-fabric-react/src/common/_semanticSlots.scss b/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
index cd4c3729fdedd..6c28970435c5f 100644
--- a/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
+++ b/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
@@ -20,6 +20,7 @@ $warningHighlightColor: "[theme:warningHighlight, default: #ffb900]";
 $successBackgroundColor: "[theme:successBackground, default: rgba(186,216,10,.2)]";
 
 /* Input controls */
+$inputBackgroundColor: "[theme:inputBackground, default: #ffffff]";
 $inputBorderColor: "[theme:inputBorder, default: #a6a6a6]";
 $inputBorderHoveredColor: "[theme:inputBorderHovered, default: #212121]";
 $inputBackgroundCheckedColor: "[theme:inputBackgroundChecked, default: #0078d7]";
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index d802bb1ebd22e..e605924784b16 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -10,7 +10,7 @@
 @import '../Label/LabelMixins.scss';
 
 // component slots
-$field-background-color: $bodyBackgroundColor;
+$field-background-color: $inputBackgroundColor;
 $field-background-disabled-color: $disabledBackgroundColor;
 
 $field-border-color: $inputBorderColor;
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
index e954aa2f30f21..cc84cd14a87e4 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
@@ -5,7 +5,10 @@ import {
   autobind
 } from 'office-ui-fabric-react/lib/Utilities';
 
-import { loadTheme } from 'office-ui-fabric-react/lib/Styling';
+import {
+  loadTheme,
+  createTheme
+} from 'office-ui-fabric-react/lib/Styling';
 import {
   IColor,
   getContrastRatio,
@@ -93,6 +96,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
       [this._fabricSlotWidget(FabricSlots.black),
       this._fabricSlotWidget(FabricSlots.neutralDark),
       this._fabricSlotWidget(FabricSlots.neutralPrimary),
+      this._fabricSlotWidget(FabricSlots.neutralPrimaryAlt),
       this._fabricSlotWidget(FabricSlots.neutralSecondary),
       this._fabricSlotWidget(FabricSlots.neutralTertiary)
       ];
@@ -436,6 +440,14 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
       }
     }
 
+    const themeAsJson = ThemeGenerator.getThemeAsJson(abridgedTheme);
+
+    // todo: need to start outputting the real ITheme object:
+    /* createTheme({
+      palette: ThemeGenerator.getThemeAsJson(abridgedTheme),
+      semanticColors: ThemeGenerator.getThemeAsJson(abridgedTheme)
+    }) */
+
     return (
       <div>
         <h2>Output</h2>
@@ -474,14 +486,20 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
     const themeAsJson: { [key: string]: string } = ThemeGenerator.getThemeAsJson(this.state.themeRules);
     console.log('New theme...', themeAsJson);
 
+    const finalTheme = loadTheme({
+      ...{ palette: themeAsJson },
+      isInverted: isDark(this.state.themeRules[BaseSlots[BaseSlots.backgroundColor]].color!)
+    });
+
     const root = document.querySelector('.App-content') as HTMLElement;
     if (root) {
-      root.style.backgroundColor = themeAsJson.backgroundColor;
-      root.style.color = themeAsJson.bodyText;
+      root.style.backgroundColor = finalTheme.semanticColors.bodyBackground;
+      root.style.color = finalTheme.semanticColors.bodyText;
     }
-    document.body.style.backgroundColor = themeAsJson.backgroundColor;
-    document.body.style.color = themeAsJson.bodyText;
-    console.log('Full theme... ', loadTheme({ palette: themeAsJson }));
+
+    document.body.style.backgroundColor = finalTheme.semanticColors.bodyBackground;
+    document.body.style.color = finalTheme.semanticColors.bodyText;
+    console.log('New theme:', finalTheme);
   }
 
   @autobind
diff --git a/packages/styling/src/interfaces/ISemanticColors.ts b/packages/styling/src/interfaces/ISemanticColors.ts
index 09e46f2fcd9ac..2574465261467 100644
--- a/packages/styling/src/interfaces/ISemanticColors.ts
+++ b/packages/styling/src/interfaces/ISemanticColors.ts
@@ -138,15 +138,21 @@ export interface ISemanticColors {
    * The border of a large input control in its resting, state; e.g. the box of dropdown.
    */
   inputBorder: string;
+
+  /** The border of a small input control in its resting unchecked state; e.g. the box of an unchecked checkbox.
+  *
+  */
+  smallInputBorder: string;
+
   /**
    * The border color of a large hovered input control, such as textbox.
    */
   inputBorderHovered: string;
 
   /**
-* The border of a small input control in its resting unchecked state; e.g. the box of an unchecked checkbox.
-*/
-  smallInputBorder: string;
+   * The background color of an input, e.g. textbox background.
+   */
+  inputBackground: string;
 
   /**
    * The background of a checked control; e.g. checked radio button's dot, checked toggle's background.
diff --git a/packages/styling/src/styles/theme.ts b/packages/styling/src/styles/theme.ts
index a71a910780a2d..2611df309824f 100644
--- a/packages/styling/src/styles/theme.ts
+++ b/packages/styling/src/styles/theme.ts
@@ -142,6 +142,7 @@ function _makeSemanticColorsFromPalette(p: IPalette, isInverted: boolean): ISema
 
     inputBorder: p.neutralTertiary,
     inputBorderHovered: p.neutralDark,
+    inputBackground: p.white,
     inputBackgroundChecked: p.themePrimary,
     inputBackgroundCheckedHovered: p.themeDarkAlt,
     inputForegroundChecked: p.white,
diff --git a/packages/variants/.npmignore b/packages/variants/.npmignore
new file mode 100644
index 0000000000000..b632939d809a6
--- /dev/null
+++ b/packages/variants/.npmignore
@@ -0,0 +1,22 @@
+*.config.js
+*.nuspec
+*.yml
+*.test.*
+.editorconfig
+.gitattributes
+.gitignore
+.vscode
+coverage
+dist/*.stats.html
+dist/demo*.*
+gulpfile.js
+index.html
+jsconfig.json
+karma.config.js
+node_modules
+src
+tsconfig.json
+tsd.json
+tslint.json
+typings
+webpack.config.js
diff --git a/packages/variants/.npmrc b/packages/variants/.npmrc
new file mode 100644
index 0000000000000..825c83e09df4d
--- /dev/null
+++ b/packages/variants/.npmrc
@@ -0,0 +1,2 @@
+registry=https://registry.npmjs.org/
+
diff --git a/packages/variants/LICENSE b/packages/variants/LICENSE
new file mode 100644
index 0000000000000..df603c06ed23c
--- /dev/null
+++ b/packages/variants/LICENSE
@@ -0,0 +1,15 @@
+Office UI Fabric React - variants
+
+Copyright (c) Microsoft Corporation
+
+All rights reserved.
+
+MIT License
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the ""Software""), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED *AS IS*, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
+Note: Usage of the fonts and icons referenced in Office UI Fabric is subject to the terms listed at http://aka.ms/fabric-assets-license
\ No newline at end of file
diff --git a/packages/variants/README.md b/packages/variants/README.md
new file mode 100644
index 0000000000000..66c7256d3bb34
--- /dev/null
+++ b/packages/variants/README.md
@@ -0,0 +1,11 @@
+# [variants](http://dev.office.com/fabric)
+
+Variants are themes based on another theme, subthemes which share the same colors as the original theme, but with those colors used in different places. A variant is still a full theme in and of itself.
+
+This project creates variants of a given theme, which are intended for use with the Customizer component in office-ui-fabric-react. These subthemes allow you to highlight or de-emphasize sections of the page with colors that still match the current theme.
+
+The available variants are:
+
+* Neutral - a soft neutral color is used as the background (light gray in the default theme), most other colors are changed very little or not at all
+* Soft - a soft shade of the primary color is used as the background (light blue in the default theme), most other colors are changed very little or not at all, but input controls will look different
+* Strong - a strong shade of the primary color is used as the background (blue in the default theme), almost all colors are changed
diff --git a/packages/variants/jest.config.js b/packages/variants/jest.config.js
new file mode 100644
index 0000000000000..a92c71220a900
--- /dev/null
+++ b/packages/variants/jest.config.js
@@ -0,0 +1,3 @@
+let { createConfig } = require('../../scripts/tasks/jest-resources');
+
+module.exports = createConfig();
diff --git a/packages/variants/package.json b/packages/variants/package.json
new file mode 100644
index 0000000000000..5661872e651df
--- /dev/null
+++ b/packages/variants/package.json
@@ -0,0 +1,30 @@
+{
+  "name": "@uifabric/variants",
+  "version": "5.11.2",
+  "description": "Office UI Fabric subtheme generator.",
+  "main": "lib/index.js",
+  "typings": "lib/index.d.ts",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/OfficeDev/office-ui-fabric-react"
+  },
+  "license": "MIT",
+  "scripts": {
+    "build": "node ../../scripts/build.js",
+    "clean": "node ../../scripts/clean.js",
+    "start-test": "node ../../scripts/start-test.js"
+  },
+  "disabledTasks": [
+    "copy",
+    "sass",
+    "karma"
+  ],
+  "devDependencies": {
+    "@types/jest": "21.1.8",
+    "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
+  },
+  "dependencies": {
+    "tslib": "^1.7.1",
+    "@uifabric/styling": ">=5.17.0 <6.0.0"
+  }
+}
\ No newline at end of file
diff --git a/packages/variants/src/index.ts b/packages/variants/src/index.ts
new file mode 100644
index 0000000000000..be17c8aeb847a
--- /dev/null
+++ b/packages/variants/src/index.ts
@@ -0,0 +1,4 @@
+export {
+  getSoftVariant,
+  getStrongVariant
+} from './variants';
diff --git a/packages/variants/src/variants.ts b/packages/variants/src/variants.ts
new file mode 100644
index 0000000000000..a645fdcbcee64
--- /dev/null
+++ b/packages/variants/src/variants.ts
@@ -0,0 +1,139 @@
+import {
+  IPalette,
+  ISemanticColors,
+  ITheme,
+  IPartialTheme
+} from '@uifabric/styling';
+import { createTheme } from '@uifabric/styling';
+
+/* Variants
+ * Variants are themes based off the current theme.
+ * Each variant is a subset of the current theme, rearranging slots to create a theme of a different style.
+ * Variants are meant to be applied to sections of a page, not the entire page.
+ * They can be used to highlight or de-emphasize sections of a page.
+ *
+ * Variants are still under development.
+ */
+
+/**
+ * A variant where the background a softer version of the primary color. Most other colors remain unchanged.
+ *
+ * @export
+ * @param {IPartialTheme} theme the theme for which to build a variant for
+ * @returns {ITheme} the variant theme
+ */
+export function getSoftVariant(theme: IPartialTheme): ITheme {
+  const fullTheme = createTheme(theme);
+  const p = fullTheme.palette;
+
+  // commented lines are unchanged, but left in for tracking purposes
+  // in a tint variant, most colors remain unchanged
+  const partialPalette: Partial<IPalette> = {
+    // theme
+    // themeDarker: '#004578',
+    // themeDark: '#005a9e',
+    // themeDarkAlt: '#106ebe',
+    // themePrimary: '#0078d7',
+    // themeSecondary: '#2b88d8',
+    // themeTertiary: '#71afe5',
+    // themeLight: '#c7e0f4',
+    // themeLighter: '#deecf9',
+    // themeLighterAlt: '#eff6fc',
+
+    // foregrounds
+    // black: '#000000',
+    // neutralDark: '#212121',
+    // neutralPrimary: '#333333',
+    // neutralPrimaryAlt: '#3c3c3c',
+    // neutralSecondary: '#666666',
+    // neutralTertiary: '#a6a6a6',
+
+    // backgrounds
+    // neutralTertiaryAlt: '#c8c8c8', // themeLighter?
+    // neutralQuaternary: '#d0d0d0',
+    // neutralQuaternaryAlt: '#dadada',
+    // neutralLight: '#eaeaea',
+    // neutralLighter: '#f4f4f4',
+    // neutralLighterAlt: '#f8f8f8',
+    white: p.themeLighterAlt
+  };
+
+  const partialSemantic: Partial<ISemanticColors> = {
+    bodyBackground: p.themeLighterAlt,
+
+    inputBorder: p.themeLighter,
+    // inputBorderHovered: p.neutralPrimary,
+    inputBackground: p.themeLighter,
+    // inputBackgroundChecked: p.themePrimary,
+    // inputBackgroundCheckedHovered: p.themeDarkAlt,
+    inputForegroundChecked: p.themeLighterAlt,
+    // inputFocusBorderAlt: p.themePrimary,
+  };
+
+  return createTheme({ ...theme, ...{ palette: partialPalette, semanticColors: partialSemantic } });
+}
+
+/**
+ * A variant where the background is a strong version of the primary color. All colors change.
+ * The background becomes shades of the primary color.
+ * The foreground/text becomes shades of the background color.
+ * The primary color becomes shades of the background.
+ *
+ * @export
+ * @param {IPartialTheme} theme the theme for which to build a variant for
+ * @returns {ITheme} the variant theme
+ */
+export function getStrongVariant(theme: IPartialTheme): ITheme {
+  const fullTheme = createTheme(theme);
+  const p = fullTheme.palette;
+
+  // dirty algorithm:
+  // in a tricolor theme, foreground doesn't get used?
+  // theme colors -> background shades
+  // foregrounds -> background shades
+  // backgrounds -> theme colors
+  const partialPalette: Partial<IPalette> = {
+    // theme
+    themeDarker: p.white,
+    themeDark: p.neutralLighterAlt,
+    themeDarkAlt: p.neutralLighterAlt,
+    themePrimary: p.white,
+    themeSecondary: p.neutralLighter,
+    themeTertiary: p.neutralLight,
+    themeLight: p.neutralQuaternaryAlt,
+    themeLighter: p.neutralQuaternary,
+    themeLighterAlt: p.neutralTertiaryAlt,
+
+    // foregrounds
+    black: p.neutralLighterAlt,
+    neutralDark: p.neutralLighter,
+    neutralPrimary: p.white,
+    neutralPrimaryAlt: p.neutralLight,
+    neutralSecondary: p.neutralQuaternaryAlt,
+    neutralTertiary: p.neutralQuaternary,
+
+    // backgrounds
+    neutralTertiaryAlt: p.themeLighterAlt,
+    neutralQuaternary: p.themeLighter,
+    neutralQuaternaryAlt: p.themeLight,
+    neutralLight: p.themeTertiary,
+    neutralLighter: p.themeSecondary,
+    neutralLighterAlt: p.themePrimary,
+    white: p.themeDarkAlt
+  };
+
+  const partialSemantic: Partial<ISemanticColors> = {
+    bodyBackground: p.themeDarkAlt,
+    bodyText: p.white,
+
+    inputBorder: p.themeDark,
+    // inputBorderHovered: p.neutralPrimary,
+    inputBackground: p.themeDark,
+    inputBackgroundChecked: p.white,
+    // inputBackgroundCheckedHovered: p.themeDarkAlt,
+    inputForegroundChecked: p.themeDark,
+    // inputFocusBorderAlt: p.themePrimary,
+  };
+
+  return createTheme({ ...theme, ...{ palette: partialPalette, semanticColors: partialSemantic } });
+}
\ No newline at end of file
diff --git a/packages/variants/tsconfig.json b/packages/variants/tsconfig.json
new file mode 100644
index 0000000000000..93c5fccb2af87
--- /dev/null
+++ b/packages/variants/tsconfig.json
@@ -0,0 +1,26 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "outDir": "lib",
+    "module": "commonjs",
+    "lib": [
+      "es2017",
+      "dom"
+    ],
+    "jsx": "react",
+    "declaration": true,
+    "sourceMap": true,
+    "experimentalDecorators": true,
+    "importHelpers": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "moduleResolution": "node",
+    "preserveConstEnums": true,
+    "types": [
+      "jest"
+    ]
+  },
+  "include": [
+    "src"
+  ]
+}
\ No newline at end of file
diff --git a/packages/variants/tslint.json b/packages/variants/tslint.json
new file mode 100644
index 0000000000000..009d06e3cf447
--- /dev/null
+++ b/packages/variants/tslint.json
@@ -0,0 +1,8 @@
+{
+  "extends": [
+    "office-ui-fabric-react-tslint"
+  ],
+  "rules": {
+    "prefer-const": true
+  }
+}
\ No newline at end of file
diff --git a/packages/variants/webpack.config.js b/packages/variants/webpack.config.js
new file mode 100644
index 0000000000000..7afd83dd05841
--- /dev/null
+++ b/packages/variants/webpack.config.js
@@ -0,0 +1,20 @@
+const path = require('path');
+const resources = require('../../scripts/tasks/webpack-resources');
+const webpack = resources.webpack;
+
+const BUNDLE_NAME = 'variants';
+
+module.exports = resources.createConfig(
+  BUNDLE_NAME,
+  true,
+  {
+    entry: {
+      [BUNDLE_NAME]: './lib/index.js'
+    },
+
+    output: {
+      libraryTarget: 'var',
+      library: 'Variants'
+    }
+  }
+);
diff --git a/rush.json b/rush.json
index bb4ca448d4cf5..32c629eca9d7b 100644
--- a/rush.json
+++ b/rush.json
@@ -48,6 +48,11 @@
         "@uifabric/example-app-base"
       ]
     },
+    {
+      "packageName": "@uifabric/variants",
+      "projectFolder": "packages/variants",
+      "versionPolicyName": "lockedMajor"
+    },
     {
       "packageName": "@uifabric/file-type-icons",
       "projectFolder": "packages/file-type-icons",
@@ -94,4 +99,4 @@
       "shouldPublish": false
     }
   ]
-}
+}
\ No newline at end of file

From 1de56b1d511e6a3d0d27e5bbe933e43c742a0840 Mon Sep 17 00:00:00 2001
From: chang47 <coralbue@gmail.com>
Date: Thu, 22 Feb 2018 18:49:54 -0800
Subject: [PATCH 1436/1641] Focus Zone: Allow Tab to Skip Selection (#4061)

* added return for focus zone when focus change fail

* add tab override for focus zone

* added support for skipping selection with tab

* add change files

* added tabbable focus zone example

* got rid of unnecessary return

* used member instead of passing varaables down

* changed tab field name; moved tab location

* removed duplicate component; fixed lint problems

* added actual tabbable example scss to fix build crash

* Adding FocusZoneTabbableElements enum

* add new input only mode that allows skipping of focus on tab for input elements

* cleaned things up and added better comments

* updated pr for everything except test

* added unit test

* optimized if statement; cleaned up test

* separated ampersand for if statement

* update all lint probelms
---
 .../focuszone-tabfix_2018-02-21-20-59.json    | 11 ++++
 .../ContextualMenu/ContextualMenu.tsx         |  4 +-
 .../components/FocusZone/FocusZone.test.tsx   | 62 ++++++++++++++++++-
 .../src/components/FocusZone/FocusZone.tsx    | 46 +++++++++-----
 .../components/FocusZone/FocusZone.types.ts   | 21 +++++++
 .../components/FocusZone/FocusZonePage.tsx    |  5 ++
 .../examples/FocusZone.Tabbable.Example.scss  | 11 ++++
 .../examples/FocusZone.Tabbable.Example.tsx   | 31 ++++++++++
 8 files changed, 170 insertions(+), 21 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/focuszone-tabfix_2018-02-21-20-59.json
 create mode 100644 packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Tabbable.Example.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Tabbable.Example.tsx

diff --git a/common/changes/office-ui-fabric-react/focuszone-tabfix_2018-02-21-20-59.json b/common/changes/office-ui-fabric-react/focuszone-tabfix_2018-02-21-20-59.json
new file mode 100644
index 0000000000000..2c4eb17bffdaf
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/focuszone-tabfix_2018-02-21-20-59.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Focus Zone: Add support for tab to skip selection elements",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chiechan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 7d9fe69b402b1..eb143facbc726 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { IContextualMenuProps, IContextualMenuItem, ContextualMenuItemType } from './ContextualMenu.types';
 import { DirectionalHint } from '../../common/DirectionalHint';
-import { FocusZone, FocusZoneDirection, IFocusZoneProps } from '../../FocusZone';
+import { FocusZone, FocusZoneDirection, IFocusZoneProps, FocusZoneTabbableElements } from '../../FocusZone';
 import {
   IMenuItemClassNames,
   IContextualMenuClassNames,
@@ -293,7 +293,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
                 {...this._adjustedFocusZoneProps }
                 className={ this._classNames.root }
                 isCircularNavigation={ true }
-                allowTabKey={ true }
+                handleTabKey={ FocusZoneTabbableElements.all }
               >
                 <ul
                   role='presentation'
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
index df4efe0a93dc1..6f684867186a9 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
@@ -7,7 +7,7 @@ import * as ReactTestUtils from 'react-dom/test-utils';
 import { KeyCodes } from '../../Utilities';
 
 import { FocusZone } from './FocusZone';
-import { FocusZoneDirection } from './FocusZone.types';
+import { FocusZoneDirection, FocusZoneTabbableElements } from './FocusZone.types';
 
 describe('FocusZone', () => {
   let lastFocusedElement: HTMLElement | undefined;
@@ -1048,7 +1048,7 @@ describe('FocusZone', () => {
     const tabDownListener = jest.fn();
     const component = ReactTestUtils.renderIntoDocument(
       <div { ...{ onFocusCapture: _onFocus, onKeyDown: tabDownListener } }>
-        <FocusZone {...{ allowTabKey: true, isCircularNavigation: true }}>
+        <FocusZone {...{ handleTabKey: FocusZoneTabbableElements.all, isCircularNavigation: true }}>
           <button className='a'>a</button>
           <button className='b'>b</button>
           <button className='c'>c</button>
@@ -1160,4 +1160,62 @@ describe('FocusZone', () => {
     const onKeyDownEvent = tabDownListener.mock.calls[0][0];
     expect(onKeyDownEvent.which).toBe(KeyCodes.tab);
   });
+
+  it('should stay in input box with arrow keys and exit with tab', () => {
+    const tabDownListener = jest.fn();
+    const component = ReactTestUtils.renderIntoDocument(
+      <div { ...{ onFocusCapture: _onFocus, onKeyDown: tabDownListener } }>
+        <FocusZone {...{ handleTabKey: FocusZoneTabbableElements.inputOnly, isCircularNavigation: false }}>
+          <input type='text' className='a' />
+          <button className='b'>b</button>
+        </FocusZone>
+      </div >
+    );
+
+    const focusZone = ReactDOM.findDOMNode(component as React.ReactInstance).firstChild as Element;
+
+    const inputA = focusZone.querySelector('.a') as HTMLElement;
+    const buttonB = focusZone.querySelector('.b') as HTMLElement;
+
+    setupElement(inputA, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 20,
+        right: 40
+      }
+    });
+
+    setupElement(buttonB, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 20,
+        right: 40
+      }
+    });
+
+    // InputA should be focused.
+    inputA.focus();
+    expect(lastFocusedElement).toBe(inputA);
+
+    // When we hit right/left on the arrow key, we don't want to be able to leave focus on an input
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.right });
+    expect(lastFocusedElement).toBe(inputA);
+
+    expect(inputA.tabIndex).toBe(0);
+    expect(buttonB.tabIndex).toBe(-1);
+
+    // Pressing tab will be the only way for us to exit the focus zone
+    ReactTestUtils.Simulate.keyDown(inputA, { which: KeyCodes.tab });
+    expect(lastFocusedElement).toBe(buttonB);
+    expect(inputA.tabIndex).toBe(-1);
+    expect(buttonB.tabIndex).toBe(0);
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 0ed756889a895..ebb576fa1663e 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import {
   FocusZoneDirection,
+  FocusZoneTabbableElements,
   IFocusZone,
   IFocusZoneProps
 } from './FocusZone.types';
@@ -63,10 +64,16 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   private _focusAlignment: IPoint;
   private _isInnerZone: boolean;
 
+  /** Used to allow us to move to next focusable element even when we're focusing on a input element when pressing tab */
+  private _processingTabKey: boolean;
+
   constructor(props: IFocusZoneProps) {
     super(props);
 
-    this._warnDeprecations({ rootProps: undefined });
+    this._warnDeprecations({
+      rootProps: undefined,
+      'allowTabKey': 'handleTabKey'
+    });
 
     this._id = getId('FocusZone');
 
@@ -74,6 +81,8 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       left: 0,
       top: 0
     };
+
+    this._processingTabKey = false;
   }
 
   public componentDidMount() {
@@ -361,21 +370,20 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
           return;
 
         case KeyCodes.tab:
-          if (this.props.allowTabKey) {
+          if (this.props.allowTabKey ||
+            this.props.handleTabKey === FocusZoneTabbableElements.all ||
+            (this.props.handleTabKey === FocusZoneTabbableElements.inputOnly &&
+              this._isElementInput(ev.target as HTMLElement))) {
+            let focusChanged = false;
+            this._processingTabKey = true;
             if (direction === FocusZoneDirection.vertical ||
               !this._shouldWrapFocus(this._activeElement as HTMLElement, NO_HORIZONTAL_WRAP)) {
-              if (ev.shiftKey) {
-                this._moveFocusUp();
-              } else {
-                this._moveFocusDown();
-              }
-              break;
+              focusChanged = ev.shiftKey ? this._moveFocusUp() : this._moveFocusDown();
             } else if (direction === FocusZoneDirection.horizontal || direction === FocusZoneDirection.bidirectional) {
-              if (ev.shiftKey) {
-                this._moveFocusLeft();
-              } else {
-                this._moveFocusRight();
-              }
+              focusChanged = ev.shiftKey ? this._moveFocusLeft() : this._moveFocusRight();
+            }
+            this._processingTabKey = false;
+            if (focusChanged) {
               break;
             }
           }
@@ -646,7 +654,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       return distance;
     },
       undefined /*ev*/,
-      (shouldWrap || !getRTL())
+      shouldWrap
     )) {
       this._setFocusAlignment(this._activeElement as HTMLElement, true, false);
       return true;
@@ -674,7 +682,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       return distance;
     },
       undefined /*ev*/,
-      (shouldWrap || getRTL())
+      shouldWrap
     )) {
       this._setFocusAlignment(this._activeElement as HTMLElement, true, false);
       return true;
@@ -787,7 +795,9 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   }
 
   private _shouldInputLoseFocus(element: HTMLInputElement, isForward?: boolean) {
-    if (element &&
+    // If a tab was used, we want to focus on the next element.
+    if (!this._processingTabKey &&
+      element &&
       element.type &&
       ALLOWED_INPUT_TYPES.indexOf(element.type.toLowerCase()) > -1) {
       const selectionStart = element.selectionStart;
@@ -799,9 +809,11 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       // 1. There is range selected.
       // 2. When selection start is larger than 0 and it is backward.
       // 3. when selection start is not the end of lenght and it is forward.
+      // 4. We press any of the arrow keys when our handleTabKey isn't none or undefined (only losing focus if we hit tab)
       if (isRangeSelected ||
         (selectionStart > 0 && !isForward) ||
-        (selectionStart !== inputValue.length && isForward)) {
+        (selectionStart !== inputValue.length && isForward) ||
+        !!this.props.handleTabKey) {
         return false;
       }
     }
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
index 64af0ab337413..ffd003fc2a46c 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
@@ -108,9 +108,18 @@ export interface IFocusZoneProps extends React.HTMLAttributes<HTMLElement | Focu
    * Allows tab key to be handled to tab through a list of items in the focus zone,
    * an unfortunate side effect is that users will not be able to tab out of the focus zone
    * and have to hit escape or some other key.
+   * @deprecated Use 'handleTabKey' instead.
+   *
    */
   allowTabKey?: boolean;
 
+  /**
+   * Allows tab key to be handled to tab through a list of items in the focus zone,
+   * an unfortunate side effect is that users will not be able to tab out of the focus zone
+   * and have to hit escape or some other key.
+   */
+  handleTabKey?: FocusZoneTabbableElements;
+
   /**
    * Whether the to check for data-no-horizontal-wrap or data-no-vertical-wrap attributes
    * when determining how to move focus
@@ -119,6 +128,18 @@ export interface IFocusZoneProps extends React.HTMLAttributes<HTMLElement | Focu
   checkForNoWrap?: boolean;
 }
 
+export const enum FocusZoneTabbableElements {
+
+  /** Tabbing is not allowed */
+  none = 0,
+
+  /** All tabbing action is allowed */
+  all = 1,
+
+  /** Tabbing is allowed only on input elements */
+  inputOnly = 2
+}
+
 export enum FocusZoneDirection {
   /** Only react to up/down arrows. */
   vertical = 0,
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZonePage.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZonePage.tsx
index 2c7608aab2f50..a227aaafaaeb4 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZonePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZonePage.tsx
@@ -8,10 +8,12 @@ import {
 import { FocusZonePhotosExample } from './examples/FocusZone.Photos.Example';
 import { FocusZoneListExample } from './examples/FocusZone.List.Example';
 import { FocusZoneDisabledExample } from './examples/FocusZone.Disabled.Example';
+import { FocusZoneTabbableExample } from './examples/FocusZone.Tabbable.Example';
 
 const FocusZonePhotosExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Photos.Example.tsx') as string;
 const FocusZoneListExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.List.Example.tsx') as string;
 const FocusZoneDisabledExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Disabled.Example.tsx') as string;
+const FocusZoneTabbableCode = require('!raw-loader!office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Tabbable.Example.tsx') as string;
 
 export class FocusZonePage extends React.Component<IComponentDemoPageProps, {}> {
   public render() {
@@ -30,6 +32,9 @@ export class FocusZonePage extends React.Component<IComponentDemoPageProps, {}>
             <ExampleCard title='Disabled FocusZone' code={ FocusZoneDisabledExampleCode }>
               <FocusZoneDisabledExample />
             </ExampleCard>
+            <ExampleCard title='Tabbable FocusZone' code={ FocusZoneTabbableCode }>
+              <FocusZoneTabbableExample />
+            </ExampleCard>
           </div>
         }
         propertiesTables={
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Tabbable.Example.scss b/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Tabbable.Example.scss
new file mode 100644
index 0000000000000..5dd6ad148d8a0
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Tabbable.Example.scss
@@ -0,0 +1,11 @@
+:global {
+  .ms-FocusZoneTabbableExample .ms-Row {
+    display: block;
+    margin: 5px;
+  }
+
+  .ms-FocusZoneTabbableExample-textField {
+    display: inline-block;
+    width: 300px;
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Tabbable.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Tabbable.Example.tsx
new file mode 100644
index 0000000000000..14d6d2308c0ce
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Tabbable.Example.tsx
@@ -0,0 +1,31 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+
+import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
+import { FocusZone, FocusZoneDirection, FocusZoneTabbableElements } from 'office-ui-fabric-react/lib/FocusZone';
+import { TextField } from 'office-ui-fabric-react/lib/TextField';
+import './FocusZone.Tabbable.Example.scss';
+
+export const FocusZoneTabbableExample = () => (
+  <div className='ms-FocusZoneTabbableExample'>
+    <div className='ms-Row'>
+      <FocusZone direction={ FocusZoneDirection.horizontal } handleTabKey={ FocusZoneTabbableElements.all } isCircularNavigation={ true }>
+        <span>Circular Tabbable FocusZone: </span>
+        <DefaultButton>Button 1</DefaultButton>
+        <DefaultButton>Button 2</DefaultButton>
+        <TextField value='FocusZone TextField' className='ms-FocusZoneTabbableExample-textField' />
+        <DefaultButton>Button 3</DefaultButton>
+      </FocusZone>
+    </div>
+    <div className='ms-Row'>
+      <FocusZone direction={ FocusZoneDirection.horizontal } handleTabKey={ FocusZoneTabbableElements.inputOnly } isCircularNavigation={ false }>
+        <span>Input Only FocusZone: </span>
+        <DefaultButton>Button 1</DefaultButton>
+        <DefaultButton>Button 2</DefaultButton>
+        <TextField value='FocusZone TextField' className='ms-FocusZoneTabbableExample-textField' />
+        <DefaultButton>Button 3</DefaultButton>
+      </FocusZone>
+    </div>
+  </div>
+);

From 2a657b0d163cc986fcbff1a4c348d7d83330c49c Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 23 Feb 2018 03:05:53 +0000
Subject: [PATCH 1437/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 .../phkuo-variants_2017-10-28-02-04.json      | 11 -----
 ...CustomChildrenRender_2018-02-21-00-47.json | 11 -----
 ...e-no-inferable-types_2018-02-22-07-17.json | 11 -----
 .../focuszone-tabfix_2018-02-21-20-59.json    | 11 -----
 .../master_2018-02-21-21-06.json              | 11 -----
 .../phkuo-variants_2017-10-28-02-04.json      | 11 -----
 ...move-SelectionLayout_2018-02-22-19-37.json | 11 -----
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/package.json             |  2 +-
 packages/file-type-icons/package.json         |  2 +-
 packages/icons/package.json                   |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 41 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 16 +++++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/CHANGELOG.json               | 14 +++++++
 packages/styling/CHANGELOG.md                 |  9 +++-
 packages/styling/package.json                 |  2 +-
 packages/variants/CHANGELOG.json              | 17 ++++++++
 packages/variants/CHANGELOG.md                |  9 ++++
 packages/variants/package.json                |  2 +-
 21 files changed, 113 insertions(+), 88 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/phkuo-variants_2017-10-28-02-04.json
 delete mode 100644 common/changes/office-ui-fabric-react/CustomChildrenRender_2018-02-21-00-47.json
 delete mode 100644 common/changes/office-ui-fabric-react/enable-no-inferable-types_2018-02-22-07-17.json
 delete mode 100644 common/changes/office-ui-fabric-react/focuszone-tabfix_2018-02-21-20-59.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2018-02-21-21-06.json
 delete mode 100644 common/changes/office-ui-fabric-react/phkuo-variants_2017-10-28-02-04.json
 delete mode 100644 common/changes/office-ui-fabric-react/remove-SelectionLayout_2018-02-22-19-37.json
 create mode 100644 packages/variants/CHANGELOG.json
 create mode 100644 packages/variants/CHANGELOG.md

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 3858e87d85a78..3f7a7cc0acb90 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.53.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.55.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/phkuo-variants_2017-10-28-02-04.json b/common/changes/@uifabric/styling/phkuo-variants_2017-10-28-02-04.json
deleted file mode 100644
index 406c8cc7d5db0..0000000000000
--- a/common/changes/@uifabric/styling/phkuo-variants_2017-10-28-02-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "add preliminary support for variant theming, add bodyLink slot",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/CustomChildrenRender_2018-02-21-00-47.json b/common/changes/office-ui-fabric-react/CustomChildrenRender_2018-02-21-00-47.json
deleted file mode 100644
index 7d1894f5481e7..0000000000000
--- a/common/changes/office-ui-fabric-react/CustomChildrenRender_2018-02-21-00-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "add optional custom rendering of items for ContextualMenu",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "alhenry@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/enable-no-inferable-types_2018-02-22-07-17.json b/common/changes/office-ui-fabric-react/enable-no-inferable-types_2018-02-22-07-17.json
deleted file mode 100644
index 074be2ab82375..0000000000000
--- a/common/changes/office-ui-fabric-react/enable-no-inferable-types_2018-02-22-07-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "office-ui-fabric-react",
-      "type": "none"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mark@thedutchies.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/focuszone-tabfix_2018-02-21-20-59.json b/common/changes/office-ui-fabric-react/focuszone-tabfix_2018-02-21-20-59.json
deleted file mode 100644
index 2c4eb17bffdaf..0000000000000
--- a/common/changes/office-ui-fabric-react/focuszone-tabfix_2018-02-21-20-59.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Focus Zone: Add support for tab to skip selection elements",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chiechan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2018-02-21-21-06.json b/common/changes/office-ui-fabric-react/master_2018-02-21-21-06.json
deleted file mode 100644
index a1150ef8a3397..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2018-02-21-21-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Nav: fix multiple invocations of onClick",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dawilson@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/phkuo-variants_2017-10-28-02-04.json b/common/changes/office-ui-fabric-react/phkuo-variants_2017-10-28-02-04.json
deleted file mode 100644
index e7a766d64df98..0000000000000
--- a/common/changes/office-ui-fabric-react/phkuo-variants_2017-10-28-02-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "minor fixes to theming",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/remove-SelectionLayout_2018-02-22-19-37.json b/common/changes/office-ui-fabric-react/remove-SelectionLayout_2018-02-22-19-37.json
deleted file mode 100644
index 334374ea05a8e..0000000000000
--- a/common/changes/office-ui-fabric-react/remove-SelectionLayout_2018-02-22-19-37.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SelectionZone: deprecating `layout` as it is no longer in use. Removing `SelectionLayout` as it is not required.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mark@thedutchies.com"
-}
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 1ef6fb7bef9cd..8dfa2ee5f2d46 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -32,7 +32,7 @@
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.18.1 <6.0.0",
+    "@uifabric/styling": ">=5.19.0 <6.0.0",
     "@uifabric/utilities": ">=5.13.0 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index ec613b80d0b5f..66fbf301485b0 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.53.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.55.0 <6.0.0",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/file-type-icons/package.json b/packages/file-type-icons/package.json
index 60702aedc0bc5..552fbdf8c9b41 100644
--- a/packages/file-type-icons/package.json
+++ b/packages/file-type-icons/package.json
@@ -26,7 +26,7 @@
     "react-dom": "^16.2.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.18.1 <6.0.0",
+    "@uifabric/styling": ">=5.19.0 <6.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/icons/package.json b/packages/icons/package.json
index c6ed8609ea0c5..77cd25c7bbd45 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -22,7 +22,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.18.1 <6.0.0",
+    "@uifabric/styling": ">=5.19.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 7fd27507b61c9..9c5ae8de9d4c3 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,47 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.55.0",
+      "tag": "office-ui-fabric-react_v5.55.0",
+      "date": "Fri, 23 Feb 2018 03:05:53 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Alex Henry <adhe223@g.uky.edu>",
+            "commit": "43c6f7ca495a8d05cdfb1d54ce6df85eaa3b9ac3",
+            "comment": "add optional custom rendering of items for ContextualMenu"
+          },
+          {
+            "author": "chang47 <coralbue@gmail.com>",
+            "commit": "1de56b1d511e6a3d0d27e5bbe933e43c742a0840",
+            "comment": "Focus Zone: Add support for tab to skip selection elements"
+          },
+          {
+            "author": "Mark Polak <mark@thedutchies.com>",
+            "commit": "6d0c968d9bda5581da65e6c63138c243355dddfe",
+            "comment": "SelectionZone: deprecating `layout` as it is no longer in use. Removing `SelectionLayout` as it is not required."
+          }
+        ],
+        "patch": [
+          {
+            "author": "David Wilson (VSNC) <dawilson@microsoft.com>",
+            "commit": "99fc1d42078e4c3a2c6be3e4c32dcf2c19074c87",
+            "comment": "Nav: fix multiple invocations of onClick"
+          },
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "ebe601051c081838ae9d029e1020f316258d148a",
+            "comment": "minor fixes to theming"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.18.1 <6.0.0` to `>=5.19.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.54.0",
       "tag": "office-ui-fabric-react_v5.54.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index d7c631914f724..25eb96113dfa3 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,20 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 22 Feb 2018 11:15:23 GMT and should not be manually modified.
+This log was last generated on Fri, 23 Feb 2018 03:05:53 GMT and should not be manually modified.
+
+## 5.55.0
+Fri, 23 Feb 2018 03:05:53 GMT
+
+### Minor changes
+
+- add optional custom rendering of items for ContextualMenu
+- Focus Zone: Add support for tab to skip selection elements
+- SelectionZone: deprecating `layout` as it is no longer in use. Removing `SelectionLayout` as it is not required.
+
+### Patches
+
+- Nav: fix multiple invocations of onClick
+- minor fixes to theming
 
 ## 5.54.0
 Thu, 22 Feb 2018 11:15:23 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 6c7a5c470327f..17babbd370d6e 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.54.0",
+  "version": "5.55.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -50,7 +50,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "@uifabric/merge-styles": ">=5.12.2 <6.0.0",
-    "@uifabric/styling": ">=5.18.1 <6.0.0",
+    "@uifabric/styling": ">=5.19.0 <6.0.0",
     "@uifabric/utilities": ">=5.13.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 2c96d38642bf6..1a2b043a6048f 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.19.0",
+      "tag": "@uifabric/styling_v5.19.0",
+      "date": "Fri, 23 Feb 2018 03:05:53 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "ebe601051c081838ae9d029e1020f316258d148a",
+            "comment": "add preliminary support for variant theming, add bodyLink slot"
+          }
+        ]
+      }
+    },
     {
       "version": "5.18.1",
       "tag": "@uifabric/styling_v5.18.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index ac1bb4683bc0f..446d471cb0ece 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Sat, 17 Feb 2018 21:29:00 GMT and should not be manually modified.
+This log was last generated on Fri, 23 Feb 2018 03:05:53 GMT and should not be manually modified.
+
+## 5.19.0
+Fri, 23 Feb 2018 03:05:53 GMT
+
+### Minor changes
+
+- add preliminary support for variant theming, add bodyLink slot
 
 ## 5.18.1
 Sat, 17 Feb 2018 21:29:00 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index d78eaa04db4c1..5aca7fad9b7d4 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.18.1",
+  "version": "5.19.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "repository": {
     "type": "git",
diff --git a/packages/variants/CHANGELOG.json b/packages/variants/CHANGELOG.json
new file mode 100644
index 0000000000000..09ebbc51c80bb
--- /dev/null
+++ b/packages/variants/CHANGELOG.json
@@ -0,0 +1,17 @@
+{
+  "name": "@uifabric/variants",
+  "entries": [
+    {
+      "version": "5.11.2",
+      "tag": "@uifabric/variants_v5.11.2",
+      "date": "Fri, 23 Feb 2018 03:05:53 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.17.0 <6.0.0` to `>=5.19.0 <6.0.0`"
+          }
+        ]
+      }
+    }
+  ]
+}
\ No newline at end of file
diff --git a/packages/variants/CHANGELOG.md b/packages/variants/CHANGELOG.md
new file mode 100644
index 0000000000000..f1e96b3ed3bc0
--- /dev/null
+++ b/packages/variants/CHANGELOG.md
@@ -0,0 +1,9 @@
+# Change Log - @uifabric/variants
+
+This log was last generated on Fri, 23 Feb 2018 03:05:53 GMT and should not be manually modified.
+
+## 5.11.2
+Fri, 23 Feb 2018 03:05:53 GMT
+
+*Initial release*
+
diff --git a/packages/variants/package.json b/packages/variants/package.json
index 5661872e651df..b4fe77e2f5b06 100644
--- a/packages/variants/package.json
+++ b/packages/variants/package.json
@@ -25,6 +25,6 @@
   },
   "dependencies": {
     "tslib": "^1.7.1",
-    "@uifabric/styling": ">=5.17.0 <6.0.0"
+    "@uifabric/styling": ">=5.19.0 <6.0.0"
   }
 }
\ No newline at end of file

From f803791c522390bd2f0ebaedf628f5dc1d679332 Mon Sep 17 00:00:00 2001
From: Mike Pateras <35780775+paterasMSFT@users.noreply.github.com>
Date: Fri, 23 Feb 2018 10:33:29 -0500
Subject: [PATCH 1438/1641] ComboBox button should have
 data-is-focusable="false" (#4070)

* Added property to set ComboBox's button's data-is-focusable attribute.

* Change file.

* Update ComboBoxButtonDataIsFocusable_2018-02-22-18-29.json

* Removed property. data-is-focusable will now always be false. Also modified .snap file to reflect new value.
---
 ...omboBoxButtonDataIsFocusable_2018-02-22-18-29.json | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.tsx              |  1 +
 .../ComboBox/__snapshots__/ComboBox.test.tsx.snap     |  2 +-
 3 files changed, 13 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/ComboBoxButtonDataIsFocusable_2018-02-22-18-29.json

diff --git a/common/changes/office-ui-fabric-react/ComboBoxButtonDataIsFocusable_2018-02-22-18-29.json b/common/changes/office-ui-fabric-react/ComboBoxButtonDataIsFocusable_2018-02-22-18-29.json
new file mode 100644
index 0000000000000..890f80c0e3806
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/ComboBoxButtonDataIsFocusable_2018-02-22-18-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Added property to set ComboBox's button's data-is-focusable attribute.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mipatera@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 9501383589374..694b280010a6a 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -347,6 +347,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
             styles={ this._getCaretButtonStyles() }
             role='presentation'
             aria-hidden={ isButtonAriaHidden }
+            data-is-focusable={false}
             tabIndex={ -1 }
             onClick={ this._onComboBoxClick }
             iconProps={ buttonIconProps }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
index 3230dce46f29d..88062f2cdcb1e 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
@@ -223,7 +223,7 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
             background-color: #eaeaea;
             color: #212121;
           }
-      data-is-focusable={true}
+      data-is-focusable={false}
       disabled={undefined}
       onClick={[Function]}
       role="presentation"

From d2c5b2408050c0d4e6e844fda09ec4549e4a81d1 Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Fri, 23 Feb 2018 11:09:12 -0800
Subject: [PATCH 1439/1641] [DetailsList] Add public focusIndex function
 (#3852)

* [Focus] Enable focus forceIntoFirstElement parameter

* Change file

* Fixed formatting

* Added DetailsList test and public api

* Fixed build errors
---
 ...-detailsListRowFocus_2018-01-31-23-40.json |  11 +
 .../DetailsList/DetailsList.test.tsx          | 114 +++++++++
 .../components/DetailsList/DetailsList.tsx    |  23 +-
 .../DetailsList/DetailsList.types.ts          |  10 +
 .../src/components/DetailsList/DetailsRow.tsx |   4 +-
 .../DetailsList/DetailsRowFields.tsx          |   1 -
 .../__snapshots__/DetailsList.test.tsx.snap   | 222 ++++++++++++++++++
 .../examples/DetailsList.Grouped.Example.scss |  18 ++
 .../examples/DetailsList.Grouped.Example.tsx  |  36 ++-
 .../src/components/List/List.tsx              |   4 +-
 10 files changed, 432 insertions(+), 11 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/magellan-detailsListRowFocus_2018-01-31-23-40.json
 create mode 100644 packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.test.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/DetailsList/__snapshots__/DetailsList.test.tsx.snap
 create mode 100644 packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.scss

diff --git a/common/changes/office-ui-fabric-react/magellan-detailsListRowFocus_2018-01-31-23-40.json b/common/changes/office-ui-fabric-react/magellan-detailsListRowFocus_2018-01-31-23-40.json
new file mode 100644
index 0000000000000..f40b21e935a3b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/magellan-detailsListRowFocus_2018-01-31-23-40.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "[Focus] Enable focus forceIntoFirstElement parameter",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.test.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.test.tsx
new file mode 100644
index 0000000000000..ff04576a4f4e8
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.test.tsx
@@ -0,0 +1,114 @@
+import * as React from 'react';
+import * as renderer from 'react-test-renderer';
+import * as ReactTestUtils from 'react-dom/test-utils';
+import { mount } from 'enzyme';
+
+import {
+  DetailsList
+} from './DetailsList';
+
+import {
+  IDetailsList,
+  IColumn
+} from './DetailsList.types';
+
+// Populate mock items for testing
+function mockItems(count: number): any {
+  const items = [];
+
+  for (let i = 0; i < count; i++) {
+    items.push({
+      key: i,
+      name: 'Item ' + i,
+      value: i
+    });
+  }
+
+  return items;
+}
+
+describe('DetailsList', () => {
+  it('renders List correctly', () => {
+    DetailsList.prototype.componentDidMount = jest.fn();
+
+    const component = renderer.create(
+      <DetailsList
+        items={ mockItems(5) }
+        // tslint:disable-next-line:jsx-no-lambda
+        onRenderRow={ () => null }
+        skipViewportMeasures={ true }
+        // tslint:disable-next-line:jsx-no-lambda
+        onShouldVirtualize={ () => false }
+      />
+    );
+    const tree = component.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
+  it('focuses row by index', () => {
+    jest.useFakeTimers();
+
+    let component: any;
+    const wrapper = mount(
+      <DetailsList
+        items={ mockItems(5) }
+        // tslint:disable-next-line:jsx-no-lambda
+        componentRef={ ref => component = ref }
+        skipViewportMeasures={ true }
+        // tslint:disable-next-line:jsx-no-lambda
+        onShouldVirtualize={ () => false }
+      />);
+
+    expect(component).toBeDefined();
+    (component as IDetailsList).focusIndex(2);
+    setTimeout(() => {
+      expect(document.activeElement.className.split(' ')).toContain('ms-DetailsRow');
+      expect(document.activeElement.textContent).toEqual('2');
+    }, 0);
+    jest.runOnlyPendingTimers();
+  });
+
+  it('focuses into row element', () => {
+    const onRenderColumn = (item: any, index: number, column: IColumn) => {
+      let value = (item && column && column.fieldName) ? item[column.fieldName] : '';
+      if (value === null || value === undefined) {
+        value = '';
+      }
+      console.log('Rendered column');
+      return (
+        <div className={ 'test-column' } data-is-focusable={ true } >
+          { value }
+        </div>
+      );
+    };
+
+    jest.useFakeTimers();
+
+    let component: any;
+    const wrapper = mount(
+      <DetailsList
+        items={ mockItems(5) }
+        // tslint:disable-next-line:jsx-no-lambda
+        componentRef={ ref => component = ref }
+        skipViewportMeasures={ true }
+        // tslint:disable-next-line:jsx-no-lambda
+        onShouldVirtualize={ () => false }
+        onRenderItemColumn={ onRenderColumn }
+      />);
+
+    expect(component).toBeDefined();
+    (component as IDetailsList).focusIndex(2);
+    setTimeout(() => {
+      expect(document.activeElement.className.split(' ')).toContain('ms-DetailsRow');
+      expect(document.activeElement.textContent).toEqual('2');
+    }, 0);
+    jest.runOnlyPendingTimers();
+
+    (component as IDetailsList).focusIndex(2, true);
+    setTimeout(() => {
+      expect(document.activeElement.className.split(' ')).toContain('test-column');
+      expect(document.activeElement.textContent).toEqual('2');
+    }, 0);
+    jest.runOnlyPendingTimers();
+  });
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index df241e22f95cf..7e0dc127b7b71 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -131,6 +131,23 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     this._groupedList && this._groupedList.scrollToIndex(index, measureItem);
   }
 
+  public focusIndex(
+    index: number,
+    forceIntoFirstElement: boolean = false,
+    measureItem?: (itemIndex: number) => number): void {
+
+    const item = this.props.items[index];
+    if (item) {
+      this.scrollToIndex(index, measureItem);
+
+      const itemKey = this._getItemKey(item, index);
+      const row = this._activeRows[itemKey];
+      if (row) {
+        this._setFocusToRow(row, forceIntoFirstElement);
+      }
+    }
+  }
+
   public componentWillUnmount() {
     if (this._dragDropHelper) {
       this._dragDropHelper.dispose();
@@ -537,12 +554,12 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     }
   }
 
-  private _setFocusToRow(row: DetailsRow) {
+  private _setFocusToRow(row: DetailsRow, forceIntoFirstElement: boolean = false) {
     if (this._selectionZone) {
       this._selectionZone.ignoreNextFocus();
     }
     this._async.setTimeout(() => {
-      row.focus();
+      row.focus(forceIntoFirstElement);
     }, 0);
   }
 
@@ -679,7 +696,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     let totalWidth = 0; // offset because we have one less inner padding.
     const availableWidth = viewportWidth - (outerPadding + rowCheckWidth + groupExpandWidth);
     const adjustedColumns: IColumn[] = newColumns.map((column, i) => {
-    const newColumn = assign(
+      const newColumn = assign(
         {},
         column,
         {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
index f370f567e8a30..9ae30253e1758 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
@@ -27,6 +27,16 @@ export interface IDetailsList extends IList {
    * call this to force a re-evaluation. Be aware that this can be an expensive operation and should be done sparingly.
    */
   forceUpdate: () => void;
+
+  /**
+   * Scroll to and focus the item at the given index. focusIndex will call scrollToIndex on the specified index.
+   *
+   * @param index Index of item to scroll to
+   * @param forceIntoFirstElement If true, focus will be set to the first focusable child element of the item rather
+   *  than the item itself.
+   * @param measureItem Optional callback to measure the height of an individual item
+   */
+  focusIndex: (index: number, forceIntoFirstElement?: boolean, measureItem?: (itemIndex: number) => number) => void;
 }
 
 export interface IDetailsListProps extends React.Props<DetailsList>, IWithViewportProps {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index 064c80759e8a4..05e097ffd328a 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -309,8 +309,8 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
     });
   }
 
-  public focus(): boolean {
-    return !!this._focusZone && this._focusZone.focus();
+  public focus(forceIntoFirstElement: boolean = false): boolean {
+    return !!this._focusZone && this._focusZone.focus(forceIntoFirstElement);
   }
 
   protected _onRenderCheck(props: IDetailsRowCheckProps) {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
index 1cf78c17c1931..70c8adc0cc08a 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRowFields.tsx
@@ -91,5 +91,4 @@ export class DetailsRowFields extends BaseComponent<IDetailsRowFieldsProps, IDet
 
     return value;
   }
-
 }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/__snapshots__/DetailsList.test.tsx.snap b/packages/office-ui-fabric-react/src/components/DetailsList/__snapshots__/DetailsList.test.tsx.snap
new file mode 100644
index 0000000000000..3781b2dbc69d2
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/__snapshots__/DetailsList.test.tsx.snap
@@ -0,0 +1,222 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`DetailsList renders List correctly 1`] = `
+<div
+  className="ms-Viewport"
+  style={
+    Object {
+      "minHeight": 1,
+      "minWidth": 1,
+    }
+  }
+>
+  <div
+    aria-label={undefined}
+    className="ms-DetailsList is-horizontalConstrained undefined"
+    data-automationid="DetailsList"
+    data-is-scrollable="false"
+  >
+    <div
+      aria-colcount={2}
+      aria-label={undefined}
+      aria-readonly="true"
+      aria-rowcount={6}
+      role="grid"
+    >
+      <div
+        onKeyDown={[Function]}
+        role="presentation"
+      >
+        <div
+          aria-describedby={undefined}
+          aria-label={undefined}
+          aria-labelledby={undefined}
+          className="ms-FocusZone ms-DetailsHeader"
+          data-automationid="DetailsHeader"
+          data-focuszone-id="FocusZone1"
+          onFocus={[Function]}
+          onKeyDown={[Function]}
+          onMouseDownCapture={[Function]}
+          onMouseMove={[Function]}
+          role="row"
+        >
+          <div
+            aria-colindex={0}
+            aria-labelledby="header0-check"
+            className="ms-DetailsHeader-cell ms-DetailsHeader-cellIsCheck"
+            onClick={[Function]}
+            role="columnheader"
+          >
+            <span
+              className=""
+            >
+              <div
+                aria-checked={undefined}
+                aria-describedby="header0-checkTooltip"
+                aria-label={undefined}
+                className="ms-DetailsRow-check ms-DetailsRow-check--isHeader undefined"
+                data-automationid="DetailsRowCheck"
+                data-is-focusable={true}
+                data-selection-toggle={true}
+                id="header0-check"
+                role="checkbox"
+              >
+                <div
+                  className="ms-Check"
+                >
+                  <i
+                    aria-hidden={true}
+                    className=
+                        ms-Check-circle
+                        undefined
+                        {
+                          display: inline-block;
+                        }
+                    data-icon-name="CircleRing"
+                    role="presentation"
+                  />
+                  <i
+                    aria-hidden={true}
+                    className=
+                        ms-Check-check
+                        undefined
+                        {
+                          display: inline-block;
+                        }
+                    data-icon-name="StatusCircleCheckmark"
+                    role="presentation"
+                  />
+                </div>
+              </div>
+            </span>
+          </div>
+          <div
+            aria-colindex={1}
+            aria-disabled={false}
+            aria-sort="none"
+            className="ms-DetailsHeader-cell is-actionable undefined"
+            data-automationid="ColumnsHeaderColumn"
+            data-item-key="key"
+            role="columnheader"
+            style={
+              Object {
+                "width": 116,
+              }
+            }
+          >
+            <span
+              className=""
+            >
+              <span
+                aria-describedby="header0-key-tooltip"
+                aria-haspopup={false}
+                aria-label={undefined}
+                aria-labelledby="header0-key-name "
+                className="ms-DetailsHeader-cellTitle"
+                data-is-focusable={true}
+                id="header0-key"
+                onClick={[Function]}
+                onContextMenu={[Function]}
+                role="button"
+              >
+                <span
+                  className="ms-DetailsHeader-cellName"
+                  id="header0-key-name"
+                >
+                  key
+                </span>
+              </span>
+            </span>
+          </div>
+          <div
+            aria-hidden={true}
+            className="ms-DetailsHeader-cellSizer"
+            data-is-focusable={false}
+            data-sizer-index={0}
+            onBlur={[Function]}
+            onClick={[Function]}
+            onDoubleClick={[Function]}
+            role="button"
+          />
+        </div>
+      </div>
+      <div
+        onKeyDown={[Function]}
+        role="presentation"
+      >
+        <div
+          aria-describedby={undefined}
+          aria-labelledby={undefined}
+          className="ms-FocusZone"
+          data-focuszone-id="FocusZone2"
+          onBlur={[Function]}
+          onFocus={[Function]}
+          onKeyDown={[Function]}
+          onMouseDownCapture={[Function]}
+          role="presentation"
+        >
+          <div
+            className="ms-SelectionZone"
+            onClick={[Function]}
+            onContextMenu={[Function]}
+            onDoubleClick={[Function]}
+            onFocusCapture={[Function]}
+            onKeyDown={[Function]}
+            onKeyDownCapture={[Function]}
+            onMouseDown={[Function]}
+            onMouseDownCapture={[Function]}
+            role="presentation"
+          >
+            <div
+              className="ms-List"
+              role="presentation"
+            >
+              <div
+                className="ms-List-surface"
+                role="presentation"
+              >
+                <div
+                  className="ms-List-page"
+                  role="presentation"
+                  style={Object {}}
+                >
+                  <div
+                    className="ms-List-cell"
+                    data-automationid="ListCell"
+                    data-list-index={0}
+                    role="presentation"
+                  />
+                  <div
+                    className="ms-List-cell"
+                    data-automationid="ListCell"
+                    data-list-index={1}
+                    role="presentation"
+                  />
+                  <div
+                    className="ms-List-cell"
+                    data-automationid="ListCell"
+                    data-list-index={2}
+                    role="presentation"
+                  />
+                  <div
+                    className="ms-List-cell"
+                    data-automationid="ListCell"
+                    data-list-index={3}
+                    role="presentation"
+                  />
+                  <div
+                    className="ms-List-cell"
+                    data-automationid="ListCell"
+                    data-list-index={4}
+                    role="presentation"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.scss b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.scss
new file mode 100644
index 0000000000000..45b51547ae802
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.scss
@@ -0,0 +1,18 @@
+@import '../../../common/common';
+
+:global {
+  .DetailsList-grouped-example {
+    .ms-DetailsList {
+      max-height: 500px;
+      overflow-y: scroll;
+
+      .ms-DetailsRow-cell {
+        padding: 0px;
+      }
+
+      .grouped-example-column {
+        padding: 11px 8px;
+      }
+    }
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
index 4bd594fa936f1..7ecbe0e9dd3d8 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
@@ -1,9 +1,14 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
+import {
+  BaseComponent,
+  autobind
+} from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
-import { DetailsList } from 'office-ui-fabric-react/lib/DetailsList';
+import { DetailsList, IColumn } from 'office-ui-fabric-react/lib/DetailsList';
+import './DetailsList.Grouped.Example.scss';
 
 const _columns = [
   {
@@ -50,9 +55,11 @@ const _items = [
   }
 ];
 
-export class DetailsListGroupedExample extends React.Component<{}, {
+export class DetailsListGroupedExample extends BaseComponent<{}, {
   items: {}[];
 }> {
+  private _root: DetailsList;
+
   constructor(props: {}) {
     super(props);
 
@@ -65,12 +72,13 @@ export class DetailsListGroupedExample extends React.Component<{}, {
     const { items } = this.state;
 
     return (
-      <Fabric className='foo'>
+      <Fabric className='DetailsList-grouped-example'>
         <DefaultButton
           onClick={ this._addItem }
           text='Add an item'
         />
         <DetailsList
+          componentRef={ this._resolveRef('_root') }
           items={ items }
           groups={ [
             {
@@ -89,7 +97,7 @@ export class DetailsListGroupedExample extends React.Component<{}, {
               key: 'groupblue2',
               name: 'By "blue"',
               startIndex: 2,
-              count: 3
+              count: items.length - 2
             }
           ] }
           columns={ _columns }
@@ -98,11 +106,13 @@ export class DetailsListGroupedExample extends React.Component<{}, {
           groupProps={ {
             showEmptyGroups: true
           } }
+          onRenderItemColumn={ this._onRenderColumn }
         />
       </Fabric>
     );
   }
 
+  @autobind
   private _addItem() {
     const items = this.state.items;
 
@@ -112,7 +122,25 @@ export class DetailsListGroupedExample extends React.Component<{}, {
         name: 'New item ' + items.length,
         color: 'blue'
       }])
+    }, () => {
+      this._root.focusIndex(items.length, true);
     });
   }
 
+  private _onRenderColumn(item: any, index: number, column: IColumn) {
+    let value = (item && column && column.fieldName) ? item[column.fieldName] : '';
+
+    if (value === null || value === undefined) {
+      value = '';
+    }
+
+    return (
+      <div
+        className={ 'grouped-example-column' }
+        data-is-focusable={ true }
+      >
+        { value }
+      </div>
+    );
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index e09da24fb1883..bbf4170f2f07a 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -266,7 +266,9 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     this._scrollElement = findScrollableParent(this._root) as HTMLElement;
 
     this._events.on(window, 'resize', this._onAsyncResize);
-    this._events.on(this._root, 'focus', this._onFocus, true);
+    if (this._root) {
+      this._events.on(this._root, 'focus', this._onFocus, true);
+    }
     if (this._scrollElement) {
       this._events.on(this._scrollElement, 'scroll', this._onScroll);
       this._events.on(this._scrollElement, 'scroll', this._onAsyncScroll);

From b2177a5c35ad305cc305d002c59a7f1a9b96f35e Mon Sep 17 00:00:00 2001
From: Jordan Janzen <jordancjanzen@gmail.com>
Date: Fri, 23 Feb 2018 11:18:06 -0800
Subject: [PATCH 1440/1641] Convert Check to mergeStyles (#3880)

* Separate types to types.ts file.
Start converting check to mergeStyles

* Convert bulk scss to mergeStyles. Needs to be reviewed, this is rough.

* Add comments for style types.

* Convert Check to mergeStyle pattern

* Add more props and types

* Fix most style conversions.

* Remove setUserSelect related lines. Rename rootIsChecked to just checked state.

* Remove setUserSelect related lines. Rename rootIsChecked to just checked state.

* Fix line-height

* Export types in index.

* npm run change output

* Fix import for Travis

* Move className logic to styles file.

* nit, remove _ in _sharedCircleCheck

* Combine checked conditionals into array.

* Make ICheckStyles required, remove checkHost

* Export base component

* Remove unused import

* Make icons jsx

* Remove uneeded const
---
 .../mergeStyles-Check_2018-02-03-01-48.json   |  11 ++
 .../src/components/Check/Check.base.tsx       |  43 ++++++
 .../src/components/Check/Check.styles.ts      | 142 ++++++++++++++++++
 .../src/components/Check/Check.tsx            |  76 ++--------
 .../src/components/Check/Check.types.ts       |  75 +++++++++
 .../src/components/Check/index.ts             |   4 +-
 6 files changed, 287 insertions(+), 64 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/mergeStyles-Check_2018-02-03-01-48.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Check/Check.base.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Check/Check.styles.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Check/Check.types.ts

diff --git a/common/changes/office-ui-fabric-react/mergeStyles-Check_2018-02-03-01-48.json b/common/changes/office-ui-fabric-react/mergeStyles-Check_2018-02-03-01-48.json
new file mode 100644
index 0000000000000..43bcbb50d623a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/mergeStyles-Check_2018-02-03-01-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Convert Check to mergeStyles",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-jojanz@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.base.tsx b/packages/office-ui-fabric-react/src/components/Check/Check.base.tsx
new file mode 100644
index 0000000000000..d0a679aaf1ae2
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.base.tsx
@@ -0,0 +1,43 @@
+import * as React from 'react';
+import {
+  BaseComponent,
+  classNamesFunction,
+  customizable,
+} from '@uifabric/utilities';
+import {
+  ICheckProps,
+  ICheckStyleProps,
+  ICheckStyles
+} from './Check.types';
+import { Icon } from '../../Icon';
+import { getStyles } from './Check.styles';
+
+const getClassNames = classNamesFunction<ICheckStyleProps, ICheckStyles>();
+
+@customizable('Check', ['theme'])
+export class CheckBase extends BaseComponent<ICheckProps, {}> {
+  public static defaultProps: ICheckProps = {
+    checked: false
+  };
+
+  public shouldComponentUpdate(newProps: ICheckProps) {
+    return this.props.checked !== newProps.checked;
+  }
+
+  public render(): JSX.Element {
+    const {
+      checked,
+      className,
+      theme
+    } = this.props;
+
+    const classNames = getClassNames(getStyles!, { theme: theme!, className, checked });
+
+    return (
+      <div className={ classNames.root } >
+        <Icon iconName='CircleRing' className={ classNames.circle } />
+        <Icon iconName='StatusCircleCheckmark' className={ classNames.check } />
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.styles.ts b/packages/office-ui-fabric-react/src/components/Check/Check.styles.ts
new file mode 100644
index 0000000000000..94e7c1af848b4
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.styles.ts
@@ -0,0 +1,142 @@
+import { ICheckStyleProps, ICheckStyles } from './Check.types';
+import {
+  getTheme,
+  HighContrastSelector,
+  IStyle,
+  ITheme,
+} from '@uifabric/styling';
+import { memoizeFunction } from '@uifabric/utilities';
+
+export const getStyles = (
+  props: ICheckStyleProps
+): ICheckStyles => {
+  const {
+    checkBoxHeight = '18px',
+    checked,
+    className,
+    theme,
+  } = props;
+
+  const { palette, semanticColors } = theme;
+
+  const sharedCircleCheck: IStyle = {
+    fontSize: checkBoxHeight,
+    position: 'absolute',
+    left: 0,
+    top: 0,
+    width: checkBoxHeight,
+    height: checkBoxHeight,
+    textAlign: 'center',
+    verticalAlign: 'middle'
+  };
+
+  return ({
+    root: [
+      'ms-Check',
+
+      {
+        // lineHeight currently needs to be a string to output without 'px'
+        lineHeight: '1',
+        width: checkBoxHeight,
+        height: checkBoxHeight,
+        verticalAlign: 'top',
+        position: 'relative',
+        userSelect: 'none',
+
+        selectors: {
+          ':before': {
+            content: '""',
+            position: 'absolute',
+            top: '1px',
+            right: '1px',
+            bottom: '1px',
+            left: '1px',
+            borderRadius: '50%',
+            opacity: 1,
+            background: semanticColors.bodyBackground,
+          },
+
+          /**
+           * TODO: Come back to this once .checkHost has been
+           * converted to mergeStyles
+           */
+          '.checkHost:hover &, .checkHost:focus &, &:hover, &:focus': {
+            opacity: 1
+          }
+        }
+      },
+
+      checked && [
+        'is-checked',
+        {
+          selectors: {
+            ':before': {
+              background: palette.themePrimary,
+              opacity: 1,
+              selectors: {
+                [HighContrastSelector]: {
+                  background: 'Window'
+                }
+              }
+            }
+          }
+        },
+      ],
+      className
+    ],
+
+    circle: [
+      'ms-Check-circle',
+      sharedCircleCheck,
+
+      {
+        color: palette.neutralTertiaryAlt,
+
+        selectors: {
+          [HighContrastSelector]: {
+            color: 'WindowText'
+          }
+        }
+      },
+
+      checked && {
+        color: palette.white
+      }
+    ],
+
+    check: [
+      'ms-Check-check',
+      sharedCircleCheck,
+
+      {
+        opacity: 0,
+        color: palette.neutralTertiaryAlt,
+        fontSize: '16px',
+        left: '.5px',
+
+        selectors: {
+          ':hover': {
+            opacity: 1
+          },
+
+          [HighContrastSelector]: {
+            MsHighContrastAdjust: 'none'
+          }
+        }
+      },
+
+      checked && {
+        opacity: 1,
+        color: palette.white,
+        fontWeight: 900,
+
+        selectors: {
+          [HighContrastSelector]: {
+            border: 'none',
+            color: 'WindowText'
+          }
+        }
+      }
+    ]
+  });
+};
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.tsx b/packages/office-ui-fabric-react/src/components/Check/Check.tsx
index 9f4357908ad39..5ad63f1c407b8 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.tsx
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.tsx
@@ -1,63 +1,13 @@
-import * as React from 'react';
-import { BaseComponent, css } from '../../Utilities';
-import { Icon } from '../../Icon';
-import * as stylesImport from './Check.scss';
-const styles: any = stylesImport;
-
-export interface ICheckProps extends React.Props<Check> {
-  /**
-   * Gets the component ref.
-   */
-  componentRef?: () => void;
-
-  /**
-   * Whether or not this menu item is currently checked.
-   * @defaultvalue false
-   */
-  checked?: boolean;
-  /**
-   * Deprecated at v0.65.1 and will be removed by v 1.0. Use 'checked' instead.
-   * @deprecated
-   */
-  isChecked?: boolean;
-
-  alwaysShowCheck?: boolean;
-}
-
-export class Check extends BaseComponent<ICheckProps, {}> {
-  public static defaultProps = {
-    isChecked: false
-  };
-
-  public shouldComponentUpdate(newProps: ICheckProps) {
-    return this.props.isChecked !== newProps.isChecked || this.props.checked !== newProps.checked;
-  }
-
-  public render() {
-    let { isChecked } = this.props;
-    const { checked } = this.props;
-
-    isChecked = isChecked || checked;
-
-    return (
-      <div
-        className={ css(
-          'ms-Check',
-          styles.root,
-          {
-            [`is-checked ${styles.rootIsChecked}`]: isChecked
-          }
-        ) }
-      >
-        { <Icon
-          className={ 'ms-Check-circle ' + styles.circle }
-          iconName={ 'CircleRing' }
-        /> }
-        { <Icon
-          className={ 'ms-Check-check ' + styles.check }
-          iconName={ 'StatusCircleCheckmark' }
-        /> }
-      </div>
-    );
-  }
-}
+import { styled } from '@uifabric/utilities';
+import {
+  ICheckProps,
+  ICheckStyleProps,
+  ICheckStyles
+} from './Check.types';
+import { CheckBase } from './Check.base';
+import { getStyles } from './Check.styles';
+
+export const Check = styled<ICheckProps, ICheckStyleProps, ICheckStyles>(
+  CheckBase,
+  getStyles
+);
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.types.ts b/packages/office-ui-fabric-react/src/components/Check/Check.types.ts
new file mode 100644
index 0000000000000..eaee9b82f93cc
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.types.ts
@@ -0,0 +1,75 @@
+import * as React from 'react';
+import { CheckBase } from './Check.base';
+import { IStyle, ITheme } from '@uifabric/styling';
+import { IStyleFunction } from '@uifabric/utilities';
+
+export interface ICheckProps extends React.Props<CheckBase> {
+  /**
+   * Gets the component ref.
+   */
+  componentRef?: (component: ICheckProps) => void;
+
+  /**
+   * Whether or not this menu item is currently checked.
+   * @defaultvalue false
+   */
+  checked?: boolean;
+
+  /**
+  * Call to provide customized styling that will layer on top of the variant rules
+  */
+  getStyles?: IStyleFunction<ICheckStyleProps, ICheckStyles>;
+
+  /**
+   * Flag to always show the check icon. Not currently working.
+   */
+  alwaysShowCheck?: boolean;
+
+  /**
+   * Theme provided by HOC.
+   */
+  theme?: ITheme;
+
+  /**
+   * Additional css class to apply to the Check
+   * @defaultvalue undefined
+   */
+  className?: string;
+}
+
+export interface ICheckStyleProps {
+  /**
+   * Accept theme prop.
+   */
+  theme: ITheme;
+
+  /**
+   * Accept custom classNames
+   */
+  className?: string;
+
+  /**
+   * Accept custom checkBox size in pixels.
+   * @defaultvalue '18px'
+   */
+  checkBoxHeight?: string;
+
+  checked?: boolean;
+}
+
+export interface ICheckStyles {
+  /**
+   * Style for the root element.
+   */
+  root: IStyle;
+
+  /**
+   * The 'check' icon styles.
+   */
+  check: IStyle;
+
+  /**
+   * The 'circle' icon styles.
+   */
+  circle: IStyle;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Check/index.ts b/packages/office-ui-fabric-react/src/components/Check/index.ts
index 96b6c5ff96424..8be72c0910ca8 100644
--- a/packages/office-ui-fabric-react/src/components/Check/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Check/index.ts
@@ -1 +1,3 @@
-export * from './Check';
\ No newline at end of file
+export * from './Check';
+export * from './Check.base';
+export * from './Check.types';

From c5029640480d565cc1774046f8003095f68a368b Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Fri, 23 Feb 2018 14:05:25 -0800
Subject: [PATCH 1441/1641] [ContextualMenu] Made disabled buttons focusable
 (#4074)

* Made disabled buttons focusable

* Change file

* Fixed test logic

* Added test failure

* Added isDisabled tests

* Fixed tslint in test

* Updated DetailsList snapshot

* Fix typo
---
 ...cusableDisabledItems_2018-02-22-23-48.json | 11 ++++
 .../ContextualMenu/ContextualMenu.test.tsx    | 63 +++++++++++++++++--
 .../ContextualMenu/ContextualMenu.tsx         | 44 ++++++++-----
 .../examples/ContextualMenu.Basic.Example.tsx | 15 +++--
 .../DetailsList/DetailsList.test.tsx          |  1 -
 .../__snapshots__/DetailsList.test.tsx.snap   | 59 ++++++++++++++++-
 scripts/tasks/webpack-resources.js            |  1 +
 7 files changed, 163 insertions(+), 31 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/magellan-focusableDisabledItems_2018-02-22-23-48.json

diff --git a/common/changes/office-ui-fabric-react/magellan-focusableDisabledItems_2018-02-22-23-48.json b/common/changes/office-ui-fabric-react/magellan-focusableDisabledItems_2018-02-22-23-48.json
new file mode 100644
index 0000000000000..43df507df1227
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/magellan-focusableDisabledItems_2018-02-22-23-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "[ContextualMenu] Disabled buttons are focusable",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
index 3efa04c9d2991..c9861234dc780 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
@@ -239,13 +239,22 @@ describe('ContextualMenu', () => {
     expect(document.querySelector('.SubMenuClass')).toBeDefined();
   });
 
-  it('applies disabled property when `disabled` is true', () => {
+  it('can focus on disabled items', () => {
     const items: IContextualMenuItem[] = [
       {
         name: 'TestText 1',
         key: 'TestKey1',
+      },
+      {
+        name: 'TestText 2',
+        key: 'TestKey2',
         disabled: true,
       },
+      {
+        name: 'TestText 3',
+        key: 'TestKey3',
+        isDisabled: true,
+      },
     ];
 
     ReactTestUtils.renderIntoDocument<ContextualMenu>(
@@ -254,17 +263,51 @@ describe('ContextualMenu', () => {
       />
     );
 
-    const menuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
+    const menuItems = document.querySelectorAll('button.ms-ContextualMenu-link') as NodeListOf<HTMLButtonElement>;
+    expect(menuItems.length).toEqual(3);
+
+    menuItems[0].focus();
+    expect(document.activeElement.textContent).toEqual('TestText 1');
+    expect(document.activeElement.className.split(' ')).not.toContain('is-disabled');
 
-    expect(menuItem.disabled).toBeTruthy();
+    menuItems[1].focus();
+    expect(document.activeElement.textContent).toEqual('TestText 2');
+    expect(document.activeElement.className.split(' ')).toContain('is-disabled');
+
+    menuItems[2].focus();
+    expect(document.activeElement.textContent).toEqual('TestText 3');
+    expect(document.activeElement.className.split(' ')).toContain('is-disabled');
   });
 
-  it('applies disabled property when deprecated property `isDisabled` is true', () => {
+  it('cannot click on disabled items', () => {
+    const itemsClicked = [
+      false,
+      false,
+      false
+    ];
     const items: IContextualMenuItem[] = [
       {
         name: 'TestText 1',
         key: 'TestKey1',
+        onClick: () => itemsClicked[0] = true
+      },
+      {
+        name: 'TestText 2',
+        key: 'TestKey2',
+        disabled: true,
+        onClick: () => {
+          itemsClicked[1] = true;
+          fail('Disabled item should not be clickable');
+        }
+      },
+      {
+        name: 'TestText 3',
+        key: 'TestKey3',
         isDisabled: true,
+        onClick: () => {
+          itemsClicked[2] = true;
+          fail('Disabled item should not be clickable');
+        }
       },
     ];
 
@@ -274,9 +317,17 @@ describe('ContextualMenu', () => {
       />
     );
 
-    const menuItem = document.querySelector('button.ms-ContextualMenu-link') as HTMLButtonElement;
+    const menuItems = document.querySelectorAll('button.ms-ContextualMenu-link') as NodeListOf<HTMLButtonElement>;
+    expect(menuItems.length).toEqual(3);
+
+    menuItems[0].click();
+    expect(itemsClicked[0]).toEqual(true);
+
+    menuItems[1].click();
+    expect(itemsClicked[1]).toEqual(false);
 
-    expect(menuItem.disabled).toBeTruthy();
+    menuItems[2].click();
+    expect(itemsClicked[2]).toEqual(false);
   });
 
   it('renders headers properly', () => {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index eb143facbc726..a9a6de851776d 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -290,7 +290,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
             { title && <div className={ this._classNames.title } role='heading' aria-level={ 1 }> { title } </div> }
             { (items && items.length) ? (
               <FocusZone
-                {...this._adjustedFocusZoneProps }
+                { ...this._adjustedFocusZoneProps }
                 className={ this._classNames.root }
                 isCircularNavigation={ true }
                 handleTabKey={ FocusZoneTabbableElements.all }
@@ -466,11 +466,11 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     return (
       <div className={ this._classNames.header } style={ item.style } role='heading' aria-level={ this.props.title ? 2 : 1 }>
         <ChildrenRenderer
-          item={item}
-          classNames={classNames}
-          index={index}
-          onCheckmarkClick={hasCheckmarks? this._onItemClick : undefined}
-          hasIcons={hasIcons}
+          item={ item }
+          classNames={ classNames }
+          index={ index }
+          onCheckmarkClick={ hasCheckmarks ? this._onItemClick : undefined }
+          hasIcons={ hasIcons }
         />
       </div>);
   }
@@ -492,11 +492,11 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
           onClick={ this._onAnchorClick.bind(this, item) }
         >
           <ChildrenRenderer
-            item={item}
-            classNames={classNames}
-            index={index}
-            onCheckmarkClick={hasCheckmarks? this._onItemClick : undefined}
-            hasIcons={hasIcons}
+            item={ item }
+            classNames={ classNames }
+            index={ index }
+            onCheckmarkClick={ hasCheckmarks ? this._onItemClick : undefined }
+            hasIcons={ hasIcons }
           />
         </a>
       </div>);
@@ -531,6 +531,10 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     const defaultRole = canCheck ? 'menuitemcheckbox' : 'menuitem';
     const itemHasSubmenu = hasSubmenu(item);
 
+    const buttonNativeProperties = getNativeProps(item, buttonProperties);
+    // Do not add the disabled attribute to the button so that it is focusable
+    delete (buttonNativeProperties as any).disabled;
+
     const itemButtonProperties = {
       className: classNames.root,
       onClick: this._onItemClick.bind(this, item),
@@ -539,7 +543,6 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       onMouseLeave: this._onMouseItemLeave.bind(this, item),
       onMouseDown: (ev: any) => this._onItemMouseDown(item, ev),
       onMouseMove: this._onItemMouseMove.bind(this, item),
-      disabled: this._isItemDisabled(item),
       href: item.href,
       title: item.title,
       'aria-label': ariaLabel,
@@ -556,10 +559,16 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
     return (
       <button
-        { ...getNativeProps(item, buttonProperties) }
+        { ...buttonNativeProperties }
         { ...itemButtonProperties }
       >
-        <ChildrenRenderer item={item} classNames={classNames} index={index} onCheckmarkClick={hasCheckmarks? this._onItemClick : undefined} hasIcons={hasIcons} />
+        <ChildrenRenderer
+          item={ item }
+          classNames={ classNames }
+          index={ index }
+          onCheckmarkClick={ hasCheckmarks ? this._onItemClick : undefined }
+          hasIcons={ hasIcons }
+        />
       </button>
     );
   }
@@ -617,7 +626,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     } as IContextualMenuItem;
     return React.createElement('button',
       getNativeProps(itemProps, buttonProperties),
-      <ChildrenRenderer item={item} classNames={classNames} index={index} onCheckmarkClick={hasCheckmarks? this._onItemClick : undefined} hasIcons={hasIcons} />,
+      <ChildrenRenderer item={ item } classNames={ classNames } index={ index } onCheckmarkClick={ hasCheckmarks ? this._onItemClick : undefined } hasIcons={ hasIcons } />,
     );
   }
 
@@ -640,7 +649,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
         onMouseDown: (ev: any) => this._onItemMouseDown(item, ev),
         onMouseMove: this._onItemMouseMove.bind(this, item)
       }),
-      <ChildrenRenderer item={item} classNames={classNames} index={index} hasIcons={false} />
+      <ChildrenRenderer item={ item } classNames={ classNames } index={ index } hasIcons={ false } />
     );
   }
 
@@ -821,6 +830,9 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   }
 
   private _executeItemClick(item: IContextualMenuItem, ev: React.MouseEvent<HTMLElement>) {
+    if (item.disabled || item.isDisabled) {
+      return;
+    }
     if (item.onClick) {
       item.onClick(ev, item);
     } else if (this.props.onItemClick) {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx
index 4fa1b5f774ef5..318cefb3872fd 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx
@@ -23,7 +23,8 @@ export class ContextualMenuBasicExample extends React.Component {
             items: [
               {
                 key: 'newItem',
-                name: 'New'
+                name: 'New',
+                onClick: () => console.log('New clicked')
               },
               {
                 key: 'divider_1',
@@ -31,20 +32,24 @@ export class ContextualMenuBasicExample extends React.Component {
               },
               {
                 key: 'rename',
-                name: 'Rename'
+                name: 'Rename',
+                onClick: () => console.log('Rename clicked')
               },
               {
                 key: 'edit',
-                name: 'Edit'
+                name: 'Edit',
+                onClick: () => console.log('Edit clicked')
               },
               {
                 key: 'properties',
-                name: 'Properties'
+                name: 'Properties',
+                onClick: () => console.log('Properties clicked')
               },
               {
                 key: 'disabled',
                 name: 'Disabled item',
-                disabled: true
+                disabled: true,
+                onClick: () => console.error('Disabled item should not be clickable.')
               }
             ]
           } }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.test.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.test.tsx
index ff04576a4f4e8..a02f86a9dc39c 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.test.tsx
@@ -74,7 +74,6 @@ describe('DetailsList', () => {
       if (value === null || value === undefined) {
         value = '';
       }
-      console.log('Rendered column');
       return (
         <div className={ 'test-column' } data-is-focusable={ true } >
           { value }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/__snapshots__/DetailsList.test.tsx.snap b/packages/office-ui-fabric-react/src/components/DetailsList/__snapshots__/DetailsList.test.tsx.snap
index 3781b2dbc69d2..d4d66656bceca 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/__snapshots__/DetailsList.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/__snapshots__/DetailsList.test.tsx.snap
@@ -62,16 +62,52 @@ exports[`DetailsList renders List correctly 1`] = `
                 role="checkbox"
               >
                 <div
-                  className="ms-Check"
+                  className=
+                      ms-Check
+                      {
+                        height: 18px;
+                        line-height: 1;
+                        position: relative;
+                        user-select: none;
+                        vertical-align: top;
+                        width: 18px;
+                      }
+                      &:before {
+                        background: #ffffff;
+                        border-radius: 50%;
+                        bottom: 1px;
+                        content: "";
+                        left: 1px;
+                        opacity: 1;
+                        position: absolute;
+                        right: 1px;
+                        top: 1px;
+                      }
+                      .checkHost:hover &, .checkHost:focus &, &:hover, &:focus {
+                        opacity: 1;
+                      }
                 >
                   <i
                     aria-hidden={true}
                     className=
                         ms-Check-circle
-                        undefined
                         {
                           display: inline-block;
                         }
+                        {
+                          color: #c8c8c8;
+                          font-size: 18px;
+                          height: 18px;
+                          left: 0px;
+                          position: absolute;
+                          text-align: center;
+                          top: 0px;
+                          vertical-align: middle;
+                          width: 18px;
+                        }
+                        @media screen and (-ms-high-contrast: active){& {
+                          color: WindowText;
+                        }
                     data-icon-name="CircleRing"
                     role="presentation"
                   />
@@ -79,10 +115,27 @@ exports[`DetailsList renders List correctly 1`] = `
                     aria-hidden={true}
                     className=
                         ms-Check-check
-                        undefined
                         {
                           display: inline-block;
                         }
+                        {
+                          color: #c8c8c8;
+                          font-size: 16px;
+                          height: 18px;
+                          left: .5px;
+                          opacity: 0;
+                          position: absolute;
+                          text-align: center;
+                          top: 0px;
+                          vertical-align: middle;
+                          width: 18px;
+                        }
+                        &:hover {
+                          opacity: 1;
+                        }
+                        @media screen and (-ms-high-contrast: active){& {
+                          -ms-high-contrast-adjust: none;
+                        }
                     data-icon-name="StatusCircleCheckmark"
                     role="presentation"
                   />
diff --git a/scripts/tasks/webpack-resources.js b/scripts/tasks/webpack-resources.js
index 91adf80278493..6bc227592c55e 100644
--- a/scripts/tasks/webpack-resources.js
+++ b/scripts/tasks/webpack-resources.js
@@ -74,6 +74,7 @@ module.exports = {
       {
         devServer: {
           inline: true,
+          host: '10.121.24.189',
           port: 4322,
         },
 

From bd4d47d624f37dceb935c6da3575e1faff30e344 Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Fri, 23 Feb 2018 14:37:27 -0800
Subject: [PATCH 1442/1641] ContextualMenu: Fix ContextualMenuUtility imports
 (#4085)

* fix utility import for amd imports

* add change file
---
 ...-contextualmenuutilityimport_2018-02-23-22-18.json | 11 +++++++++++
 .../src/components/ContextualMenu/ContextualMenu.tsx  |  2 +-
 .../components/ContextualMenu/ContextualMenuItem.tsx  |  2 +-
 3 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-contextualmenuutilityimport_2018-02-23-22-18.json

diff --git a/common/changes/office-ui-fabric-react/fix-contextualmenuutilityimport_2018-02-23-22-18.json b/common/changes/office-ui-fabric-react/fix-contextualmenuutilityimport_2018-02-23-22-18.json
new file mode 100644
index 0000000000000..a21189fe21fa4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-contextualmenuutilityimport_2018-02-23-22-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: Import ContextualMenuUtility/index directly instead of folder. ",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index a9a6de851776d..3ea38e9b16888 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -28,7 +28,7 @@ import {
   css,
   shouldWrapFocus
 } from '../../Utilities';
-import { hasSubmenu, getIsChecked } from '../../utilities/contextualMenu';
+import { hasSubmenu, getIsChecked } from '../../utilities/contextualMenu/index';
 import { withResponsiveMode, ResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
 import { Callout } from '../../Callout';
 import {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.tsx
index cd99d97ea4a10..e3e98c3f872ea 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { hasSubmenu, getIsChecked } from '../../utilities/contextualMenu';
+import { hasSubmenu, getIsChecked } from '../../utilities/contextualMenu/index';
 import { IContextualMenuItem } from './ContextualMenu.types';
 import { IMenuItemClassNames } from './ContextualMenu.classNames';
 import { getRTL } from '../../Utilities';

From 624950c9c0046020d596ee472b607b4333496799 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Fri, 23 Feb 2018 15:17:50 -0800
Subject: [PATCH 1443/1641] Added icons package screener test (#4082)

---
 apps/vr-tests/src/stories/Icon.stories.tsx | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/apps/vr-tests/src/stories/Icon.stories.tsx b/apps/vr-tests/src/stories/Icon.stories.tsx
index 07ae7372a7795..98c0d82dc3e00 100644
--- a/apps/vr-tests/src/stories/Icon.stories.tsx
+++ b/apps/vr-tests/src/stories/Icon.stories.tsx
@@ -4,8 +4,16 @@ import Screener, { Steps } from 'screener-storybook/src/screener';
 import { storiesOf } from '@storybook/react';
 import { FabricDecorator } from '../utilities';
 import { Icon, IconType, getIconClassName } from 'office-ui-fabric-react';
+import * as IconNames from '../../../../packages/icons/src/IconNames';
+
 import { TestImages } from '../common/TestImages';
 
+// Rendering allIcons tests that the icon package can initialize all icons from the cdn
+let allIcons: JSX.Element[] = [];
+for (let iconName in (IconNames as any)['IconNames']) {
+  allIcons.push(<Icon iconName={ iconName } />);
+}
+
 storiesOf('Icon', module)
   .addDecorator(FabricDecorator)
   .addDecorator(story => (
@@ -20,9 +28,7 @@ storiesOf('Icon', module)
   )).add('Root', () => (
     <div>
       <div>
-        <Icon iconName='CompassNW' />
-        <Icon iconName='Upload' />
-        <Icon iconName='Share' />
+        { allIcons }
       </div>
       <div>
         <Icon className={ getIconClassName('CompassNW') } />

From 0194f8aeb81cfd6b0a301034bf7a409cc6031568 Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Fri, 23 Feb 2018 17:15:14 -0800
Subject: [PATCH 1444/1641] [DetailsList] Fixed focus test (#4087)

* Mock test

* Change files
---
 ...DetailsListFocusTest_2018-02-24-00-36.json | 11 +++++++++++
 ...DetailsListFocusTest_2018-02-24-00-36.json | 11 +++++++++++
 ...DetailsListFocusTest_2018-02-24-00-36.json | 11 +++++++++++
 ...DetailsListFocusTest_2018-02-24-00-36.json | 11 +++++++++++
 ...DetailsListFocusTest_2018-02-24-00-36.json | 11 +++++++++++
 ...DetailsListFocusTest_2018-02-24-00-36.json | 11 +++++++++++
 ...DetailsListFocusTest_2018-02-24-00-36.json | 11 +++++++++++
 ...DetailsListFocusTest_2018-02-24-00-36.json | 11 +++++++++++
 .../DetailsList/DetailsList.test.tsx          | 19 ++++++++++++++-----
 9 files changed, 102 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
 create mode 100644 common/changes/@uifabric/experiments/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
 create mode 100644 common/changes/@uifabric/fabric-website/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
 create mode 100644 common/changes/@uifabric/file-type-icons/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
 create mode 100644 common/changes/@uifabric/icons/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
 create mode 100644 common/changes/@uifabric/styling/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
 create mode 100644 common/changes/@uifabric/variants/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
 create mode 100644 common/changes/office-ui-fabric-react/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json

diff --git a/common/changes/@uifabric/example-app-base/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json b/common/changes/@uifabric/example-app-base/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
new file mode 100644
index 0000000000000..7ef56cf8e12fd
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json b/common/changes/@uifabric/experiments/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
new file mode 100644
index 0000000000000..5260536241508
--- /dev/null
+++ b/common/changes/@uifabric/experiments/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/experiments",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json b/common/changes/@uifabric/fabric-website/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
new file mode 100644
index 0000000000000..71c75f3436166
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/file-type-icons/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json b/common/changes/@uifabric/file-type-icons/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
new file mode 100644
index 0000000000000..88e044fe064bf
--- /dev/null
+++ b/common/changes/@uifabric/file-type-icons/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/file-type-icons",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/file-type-icons",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json b/common/changes/@uifabric/icons/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
new file mode 100644
index 0000000000000..ee773e312980a
--- /dev/null
+++ b/common/changes/@uifabric/icons/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/icons",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/icons",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json b/common/changes/@uifabric/styling/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
new file mode 100644
index 0000000000000..e9c457b38d420
--- /dev/null
+++ b/common/changes/@uifabric/styling/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/variants/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json b/common/changes/@uifabric/variants/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
new file mode 100644
index 0000000000000..0b9da8cd27d93
--- /dev/null
+++ b/common/changes/@uifabric/variants/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/variants",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/variants",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json b/common/changes/office-ui-fabric-react/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
new file mode 100644
index 0000000000000..a4eeac94391bc
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "[DetailsList] Fixed test by mocking visiblity",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.test.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.test.tsx
index a02f86a9dc39c..0c4c88ed52644 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.test.tsx
@@ -62,8 +62,8 @@ describe('DetailsList', () => {
     expect(component).toBeDefined();
     (component as IDetailsList).focusIndex(2);
     setTimeout(() => {
-      expect(document.activeElement.className.split(' ')).toContain('ms-DetailsRow');
       expect(document.activeElement.textContent).toEqual('2');
+      expect(document.activeElement.className.split(' ')).toContain('ms-DetailsRow');
     }, 0);
     jest.runOnlyPendingTimers();
   });
@@ -96,17 +96,26 @@ describe('DetailsList', () => {
       />);
 
     expect(component).toBeDefined();
-    (component as IDetailsList).focusIndex(2);
+    (component as IDetailsList).focusIndex(3);
     setTimeout(() => {
+      expect(document.activeElement.textContent).toEqual('3');
       expect(document.activeElement.className.split(' ')).toContain('ms-DetailsRow');
-      expect(document.activeElement.textContent).toEqual('2');
     }, 0);
     jest.runOnlyPendingTimers();
 
-    (component as IDetailsList).focusIndex(2, true);
+    // Set element visibility manually as a test workaround
+    (component as IDetailsList).focusIndex(4);
     setTimeout(() => {
+      (document.activeElement.children[1] as any).isVisible = true;
+      (document.activeElement.children[1].children[0] as any).isVisible = true;
+      (document.activeElement.children[1].children[0].children[0] as any).isVisible = true;
+    }, 0);
+
+    jest.runOnlyPendingTimers();
+    (component as IDetailsList).focusIndex(4, true);
+    setTimeout(() => {
+      expect(document.activeElement.textContent).toEqual('4');
       expect(document.activeElement.className.split(' ')).toContain('test-column');
-      expect(document.activeElement.textContent).toEqual('2');
     }, 0);
     jest.runOnlyPendingTimers();
   });

From 2d9dcc64a4eabf85d7239454df963c6a533b1641 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 23 Feb 2018 18:21:35 -0800
Subject: [PATCH 1445/1641] Undoing terrible change.

---
 scripts/tasks/webpack-resources.js | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/scripts/tasks/webpack-resources.js b/scripts/tasks/webpack-resources.js
index 6bc227592c55e..49eff5d00ccbe 100644
--- a/scripts/tasks/webpack-resources.js
+++ b/scripts/tasks/webpack-resources.js
@@ -74,8 +74,7 @@ module.exports = {
       {
         devServer: {
           inline: true,
-          host: '10.121.24.189',
-          port: 4322,
+          port: 4322
         },
 
         resolveLoader: {
@@ -188,4 +187,4 @@ function getPlugins(
   }
 
   return plugins;
-}
\ No newline at end of file
+}

From b724a314b5ec76ac8673e11c53b4e8a025e0efd4 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 23 Feb 2018 18:58:09 -0800
Subject: [PATCH 1446/1641] Update CODEOWNERS

---
 .github/CODEOWNERS | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index ee5d7f936bcf9..f26199694bb68 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -15,11 +15,14 @@
 # users just like we do for commit author emails.
 # docs/  docs@example.com
 
+#### Core build stuff
+scripts/ @dzearing
+
 #### Apps
 # component-demo/
 # fabric-website/
 # ssr-tests/
-# test-bundle-button/
+# test-bundle-button/ @dzearing
 # todo-app/
 
 #### Packages
@@ -29,7 +32,7 @@ packages/file-type-icons/  @KatherineThayerMicrosoft @jahnp
 # packages/jest-serializer-merge-styles/
 # packages/merge-styles/
 # packages/office-ui-fabric-react-tslint/
-packages/styling/  @dzearing
+packages/styling/ @dzearing
 packages/styling/src/interfaces/ @phkuo
 packages/styling/src/styles/ @phkuo
 # packages/utilities/

From c5f5b4b4abf089fb415203a27c9ef9f5e8d62394 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 23 Feb 2018 19:45:21 -0800
Subject: [PATCH 1447/1641] Fixing ComboBox styling by reverting button
 classname move (#4088)

* reverting the order of a registration that is causing issues.

* Adding change file.

* fixing snaps
---
 .../undo-button-classname_2018-02-24-03-17.json       | 11 +++++++++++
 .../Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap |  2 +-
 .../src/components/Button/BaseButton.classNames.ts    |  4 ++--
 .../ComboBox/__snapshots__/ComboBox.test.tsx.snap     |  2 +-
 .../components/Nav/__snapshots__/Nav.test.tsx.snap    | 10 +++++-----
 .../Pivot/__snapshots__/Pivot.test.tsx.snap           |  6 +++---
 .../SpinButton/__snapshots__/SpinButton.test.tsx.snap |  4 ++--
 7 files changed, 25 insertions(+), 14 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/undo-button-classname_2018-02-24-03-17.json

diff --git a/common/changes/office-ui-fabric-react/undo-button-classname_2018-02-24-03-17.json b/common/changes/office-ui-fabric-react/undo-button-classname_2018-02-24-03-17.json
new file mode 100644
index 0000000000000..fee3aae26603b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/undo-button-classname_2018-02-24-03-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Button: reverting previous tweak to fix ComboBox dropdown selection styling.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
index 9ea260d7df8d6..b4f337bfab5ce 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
@@ -182,8 +182,8 @@ exports[`Breadcrumb renders breadcumb correctly 2`] = `
               aria-pressed={undefined}
               className=
                   ms-Button
-                  ms-Button--icon
                   ms-Breadcrumb-overflowButton
+                  ms-Button--icon
                   {
                     -moz-osx-font-smoothing: grayscale;
                     -webkit-font-smoothing: antialiased;
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
index 65da87a32c14c..688e667d0ef61 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
@@ -30,6 +30,7 @@ export const getBaseButtonClassNames = memoizeFunction((
     root: [
       'ms-Button',
       styles.root,
+      className,
       variantClassName,
       checked && [
         'is-checked',
@@ -71,8 +72,7 @@ export const getBaseButtonClassNames = memoizeFunction((
           ':hover': styles.rootCheckedHovered,
           ':active': styles.rootCheckedPressed
         }
-      },
-      className
+      }
     ],
     flexContainer: [
       'ms-Button-flexContainer',
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
index 88062f2cdcb1e..a6f5bdf79bb21 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
@@ -163,8 +163,8 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
       checked={false}
       className=
           ms-Button
-          ms-Button--icon
           ms-ComboBox-CaretDown-button
+          ms-Button--icon
           {
             -moz-osx-font-smoothing: grayscale;
             -webkit-font-smoothing: antialiased;
diff --git a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
index eedb9cc7b26a8..7434557381e4b 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
@@ -81,9 +81,9 @@ exports[`Nav renders Nav correctly 1`] = `
                 aria-pressed={undefined}
                 className=
                     ms-Button
+                    ms-Nav-link
                     ms-Button--action
                     ms-Button--command
-                    ms-Nav-link
                     {
                       -moz-osx-font-smoothing: grayscale;
                       -webkit-font-smoothing: antialiased;
@@ -128,6 +128,10 @@ exports[`Nav renders Nav correctly 1`] = `
                       top: 1px;
                       z-index: 1;
                     }
+                    .ms-Nav-compositeLink:hover & {
+                      background-color: #f8f8f8;
+                      color: #333333;
+                    }
                     &:hover {
                       color: #0078d7;
                     }
@@ -140,10 +144,6 @@ exports[`Nav renders Nav correctly 1`] = `
                     &:active .ms-Button-icon {
                       color: #004578;
                     }
-                    .ms-Nav-compositeLink:hover & {
-                      background-color: #f8f8f8;
-                      color: #333333;
-                    }
                 data-is-focusable={true}
                 disabled={undefined}
                 onClick={[Function]}
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap
index ed44a63d7761a..900e43e349f3e 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap
@@ -24,11 +24,11 @@ exports[`Pivot renders Pivot correctly 1`] = `
         aria-selected={true}
         className=
             ms-Button
-            ms-Button--action
-            ms-Button--command
             ms-Pivot-link
             is-selected
             undefined
+            ms-Button--action
+            ms-Button--command
             {
               -moz-osx-font-smoothing: grayscale;
               -webkit-font-smoothing: antialiased;
@@ -120,9 +120,9 @@ exports[`Pivot renders Pivot correctly 1`] = `
         aria-selected={false}
         className=
             ms-Button
+            ms-Pivot-link
             ms-Button--action
             ms-Button--command
-            ms-Pivot-link
             {
               -moz-osx-font-smoothing: grayscale;
               -webkit-font-smoothing: antialiased;
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
index d75698525e6eb..a0050221b1b21 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
@@ -154,8 +154,8 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
         checked={false}
         className=
             ms-Button
-            ms-Button--icon
             ms-UpButton
+            ms-Button--icon
             {
               -moz-osx-font-smoothing: grayscale;
               -webkit-font-smoothing: antialiased;
@@ -259,8 +259,8 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
         checked={false}
         className=
             ms-Button
-            ms-Button--icon
             ms-DownButton
+            ms-Button--icon
             {
               -moz-osx-font-smoothing: grayscale;
               -webkit-font-smoothing: antialiased;

From 38a629f83d0730e20ccd5743c571a3cc74ea9fcd Mon Sep 17 00:00:00 2001
From: Alex Henry <adhe223@g.uky.edu>
Date: Fri, 23 Feb 2018 20:41:52 -0800
Subject: [PATCH 1448/1641] Alhenry fix split button props (#4090)

* Copypasta error. Pass the pared down item to the child renderer, not the whole item.

* Changelog
---
 .../alhenry_fixSplitButtonProps_2018-02-24-03-41.json | 11 +++++++++++
 .../src/components/ContextualMenu/ContextualMenu.tsx  |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/alhenry_fixSplitButtonProps_2018-02-24-03-41.json

diff --git a/common/changes/office-ui-fabric-react/alhenry_fixSplitButtonProps_2018-02-24-03-41.json b/common/changes/office-ui-fabric-react/alhenry_fixSplitButtonProps_2018-02-24-03-41.json
new file mode 100644
index 0000000000000..05128c1b998b1
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/alhenry_fixSplitButtonProps_2018-02-24-03-41.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix SplitButton rendering issue in ContextualMenu",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "alhenry@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 3ea38e9b16888..8cb2cb50e310f 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -626,7 +626,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     } as IContextualMenuItem;
     return React.createElement('button',
       getNativeProps(itemProps, buttonProperties),
-      <ChildrenRenderer item={ item } classNames={ classNames } index={ index } onCheckmarkClick={ hasCheckmarks ? this._onItemClick : undefined } hasIcons={ hasIcons } />,
+      <ChildrenRenderer item={ itemProps } classNames={ classNames } index={ index } onCheckmarkClick={ hasCheckmarks ? this._onItemClick : undefined } hasIcons={ hasIcons } />,
     );
   }
 
@@ -649,7 +649,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
         onMouseDown: (ev: any) => this._onItemMouseDown(item, ev),
         onMouseMove: this._onItemMouseMove.bind(this, item)
       }),
-      <ChildrenRenderer item={ item } classNames={ classNames } index={ index } hasIcons={ false } />
+      <ChildrenRenderer item={ itemProps } classNames={ classNames } index={ index } hasIcons={ false } />
     );
   }
 

From 7c70a2479c59b9153c17a6ae75d433982c9819d5 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Sat, 24 Feb 2018 05:10:14 +0000
Subject: [PATCH 1449/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...uttonDataIsFocusable_2018-02-22-18-29.json | 11 -----
 ..._fixSplitButtonProps_2018-02-24-03-41.json | 11 -----
 ...ualmenuutilityimport_2018-02-23-22-18.json | 11 -----
 ...-detailsListRowFocus_2018-01-31-23-40.json | 11 -----
 ...DetailsListFocusTest_2018-02-24-00-36.json | 11 -----
 ...cusableDisabledItems_2018-02-22-23-48.json | 11 -----
 .../mergeStyles-Check_2018-02-03-01-48.json   | 11 -----
 ...ndo-button-classname_2018-02-24-03-17.json | 11 -----
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 49 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 16 +++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 17 files changed, 71 insertions(+), 96 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/ComboBoxButtonDataIsFocusable_2018-02-22-18-29.json
 delete mode 100644 common/changes/office-ui-fabric-react/alhenry_fixSplitButtonProps_2018-02-24-03-41.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-contextualmenuutilityimport_2018-02-23-22-18.json
 delete mode 100644 common/changes/office-ui-fabric-react/magellan-detailsListRowFocus_2018-01-31-23-40.json
 delete mode 100644 common/changes/office-ui-fabric-react/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
 delete mode 100644 common/changes/office-ui-fabric-react/magellan-focusableDisabledItems_2018-02-22-23-48.json
 delete mode 100644 common/changes/office-ui-fabric-react/mergeStyles-Check_2018-02-03-01-48.json
 delete mode 100644 common/changes/office-ui-fabric-react/undo-button-classname_2018-02-24-03-17.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 3f7a7cc0acb90..f325490486d5b 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.55.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.55.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 9cd01894365ad..140dd6b7305f6 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.54.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.55.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 0a740ebc5fe4d..eedcabee47323 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.54.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.55.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index df36fc5d31e79..f9e1ba758cd51 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.54.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.55.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 378bc51596a77..082a12c810039 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.54.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.55.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/office-ui-fabric-react/ComboBoxButtonDataIsFocusable_2018-02-22-18-29.json b/common/changes/office-ui-fabric-react/ComboBoxButtonDataIsFocusable_2018-02-22-18-29.json
deleted file mode 100644
index 890f80c0e3806..0000000000000
--- a/common/changes/office-ui-fabric-react/ComboBoxButtonDataIsFocusable_2018-02-22-18-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Added property to set ComboBox's button's data-is-focusable attribute.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mipatera@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/alhenry_fixSplitButtonProps_2018-02-24-03-41.json b/common/changes/office-ui-fabric-react/alhenry_fixSplitButtonProps_2018-02-24-03-41.json
deleted file mode 100644
index 05128c1b998b1..0000000000000
--- a/common/changes/office-ui-fabric-react/alhenry_fixSplitButtonProps_2018-02-24-03-41.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix SplitButton rendering issue in ContextualMenu",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "alhenry@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-contextualmenuutilityimport_2018-02-23-22-18.json b/common/changes/office-ui-fabric-react/fix-contextualmenuutilityimport_2018-02-23-22-18.json
deleted file mode 100644
index a21189fe21fa4..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-contextualmenuutilityimport_2018-02-23-22-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: Import ContextualMenuUtility/index directly instead of folder. ",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/magellan-detailsListRowFocus_2018-01-31-23-40.json b/common/changes/office-ui-fabric-react/magellan-detailsListRowFocus_2018-01-31-23-40.json
deleted file mode 100644
index f40b21e935a3b..0000000000000
--- a/common/changes/office-ui-fabric-react/magellan-detailsListRowFocus_2018-01-31-23-40.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "[Focus] Enable focus forceIntoFirstElement parameter",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json b/common/changes/office-ui-fabric-react/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
deleted file mode 100644
index a4eeac94391bc..0000000000000
--- a/common/changes/office-ui-fabric-react/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "[DetailsList] Fixed test by mocking visiblity",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/magellan-focusableDisabledItems_2018-02-22-23-48.json b/common/changes/office-ui-fabric-react/magellan-focusableDisabledItems_2018-02-22-23-48.json
deleted file mode 100644
index 43df507df1227..0000000000000
--- a/common/changes/office-ui-fabric-react/magellan-focusableDisabledItems_2018-02-22-23-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "[ContextualMenu] Disabled buttons are focusable",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/mergeStyles-Check_2018-02-03-01-48.json b/common/changes/office-ui-fabric-react/mergeStyles-Check_2018-02-03-01-48.json
deleted file mode 100644
index 43bcbb50d623a..0000000000000
--- a/common/changes/office-ui-fabric-react/mergeStyles-Check_2018-02-03-01-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Convert Check to mergeStyles",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-jojanz@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/undo-button-classname_2018-02-24-03-17.json b/common/changes/office-ui-fabric-react/undo-button-classname_2018-02-24-03-17.json
deleted file mode 100644
index fee3aae26603b..0000000000000
--- a/common/changes/office-ui-fabric-react/undo-button-classname_2018-02-24-03-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Button: reverting previous tweak to fix ComboBox dropdown selection styling.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 66fbf301485b0..2a4a89a2674ab 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.55.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.55.1 <6.0.0",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 9c5ae8de9d4c3..755b6a14acdfb 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,55 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.55.1",
+      "tag": "office-ui-fabric-react_v5.55.1",
+      "date": "Sat, 24 Feb 2018 05:10:13 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Alex Henry <adhe223@g.uky.edu>",
+            "commit": "38a629f83d0730e20ccd5743c571a3cc74ea9fcd",
+            "comment": "Fix SplitButton rendering issue in ContextualMenu"
+          },
+          {
+            "author": "Mike Pateras <35780775+paterasMSFT@users.noreply.github.com>",
+            "commit": "f803791c522390bd2f0ebaedf628f5dc1d679332",
+            "comment": "ComboBox: Added property to set ComboBox's button's data-is-focusable attribute."
+          },
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "bd4d47d624f37dceb935c6da3575e1faff30e344",
+            "comment": "ContextualMenu: Import ContextualMenuUtility/index directly instead of folder. "
+          },
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "d2c5b2408050c0d4e6e844fda09ec4549e4a81d1",
+            "comment": "[Focus] Enable focus forceIntoFirstElement parameter"
+          },
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "0194f8aeb81cfd6b0a301034bf7a409cc6031568",
+            "comment": "[DetailsList] Fixed test by mocking visiblity"
+          },
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "c5029640480d565cc1774046f8003095f68a368b",
+            "comment": "[ContextualMenu] Disabled buttons are focusable"
+          },
+          {
+            "author": "Jordan Janzen <jordancjanzen@gmail.com>",
+            "commit": "b2177a5c35ad305cc305d002c59a7f1a9b96f35e",
+            "comment": "Convert Check to mergeStyles"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "c5f5b4b4abf089fb415203a27c9ef9f5e8d62394",
+            "comment": "Button: reverting previous tweak to fix ComboBox dropdown selection styling."
+          }
+        ]
+      }
+    },
     {
       "version": "5.55.0",
       "tag": "office-ui-fabric-react_v5.55.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 25eb96113dfa3..c9f857a319342 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,20 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 23 Feb 2018 03:05:53 GMT and should not be manually modified.
+This log was last generated on Sat, 24 Feb 2018 05:10:14 GMT and should not be manually modified.
+
+## 5.55.1
+Sat, 24 Feb 2018 05:10:13 GMT
+
+### Patches
+
+- Fix SplitButton rendering issue in ContextualMenu
+- ComboBox: Added property to set ComboBox's button's data-is-focusable attribute.
+- ContextualMenu: Import ContextualMenuUtility/index directly instead of folder. 
+- [Focus] Enable focus forceIntoFirstElement parameter
+- [DetailsList] Fixed test by mocking visiblity
+- [ContextualMenu] Disabled buttons are focusable
+- Convert Check to mergeStyles
+- Button: reverting previous tweak to fix ComboBox dropdown selection styling.
 
 ## 5.55.0
 Fri, 23 Feb 2018 03:05:53 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 17babbd370d6e..cc8db91f8f094 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.55.0",
+  "version": "5.55.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 9b2f25a818c7db0e98b4dd9ece25e8506c619d31 Mon Sep 17 00:00:00 2001
From: Drew Brough <drew-brough@users.noreply.github.com>
Date: Mon, 26 Feb 2018 14:29:12 -0800
Subject: [PATCH 1450/1641] DatePicker: order of callbacks for onSelectDate and
 onAfterMenuDismiss (#4092)

* change the order of callbacks and dismissal to more closely match the order that command button handles its menu

* change file
---
 ...PickerCallbackOrderFix_2018-02-25-00-39.json | 11 +++++++++++
 .../src/components/DatePicker/DatePicker.tsx    | 17 ++++++++++++-----
 2 files changed, 23 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/dbrough-datePickerCallbackOrderFix_2018-02-25-00-39.json

diff --git a/common/changes/office-ui-fabric-react/dbrough-datePickerCallbackOrderFix_2018-02-25-00-39.json b/common/changes/office-ui-fabric-react/dbrough-datePickerCallbackOrderFix_2018-02-25-00-39.json
new file mode 100644
index 0000000000000..c2c83cd6b2254
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/dbrough-datePickerCallbackOrderFix_2018-02-25-00-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DatePicker calls onDateSelected then AfterMenuDismissed to follow the same pattern as BaseButton",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dbrough@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 13545cc6157f5..80d6ae4c814f3 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -290,14 +290,21 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
   private _onSelectDate(date: Date) {
     const { formatDate, onSelectDate } = this.props;
 
+    if (this.props.calendarProps && this.props.calendarProps.onSelectDate) {
+      this.props.calendarProps.onSelectDate(date);
+    }
+
     this.setState({
       selectedDate: date,
-      isDatePickerShown: false,
       formattedDate: formatDate && date ? formatDate(date) : '',
-    }, () => {
-      if (onSelectDate) {
-        onSelectDate(date);
-      }
+    });
+
+    if (onSelectDate) {
+      onSelectDate(date);
+    }
+
+    this.setState({
+      isDatePickerShown: false,
     });
   }
 

From 78519862e799fc260f428bf56c1fb3c4610b2ec5 Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Mon, 26 Feb 2018 17:28:15 -0800
Subject: [PATCH 1451/1641] [ColorRectangle, Sticky] Fixed null root refs
 (#4099)

* [ColorRectangle, Sticky] Fixed null root refs

* Change files

* Update Sticky.tsx

* Update magellan-fixNullRootRef_2018-02-26-22-26.json

* Update magellan-fixNullRootRef_2018-02-26-22-26.json
---
 .../magellan-fixNullRootRef_2018-02-26-22-26.json     | 11 +++++++++++
 .../src/components/ColorPicker/ColorRectangle.tsx     |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/magellan-fixNullRootRef_2018-02-26-22-26.json

diff --git a/common/changes/office-ui-fabric-react/magellan-fixNullRootRef_2018-02-26-22-26.json b/common/changes/office-ui-fabric-react/magellan-fixNullRootRef_2018-02-26-22-26.json
new file mode 100644
index 0000000000000..71f1f0af4d67a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/magellan-fixNullRootRef_2018-02-26-22-26.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ColorPicker: internal ref issue was fixed, which lets colors be picked a little better.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx
index 292182370cd44..3adb8739c99f3 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx
@@ -35,7 +35,7 @@ export class ColorRectangle extends BaseComponent<IColorRectangleProps, IColorPi
     minSize: 220
   };
 
-  private root: HTMLDivElement;
+  private _root: HTMLDivElement;
 
   constructor(props: IColorRectangleProps) {
     super(props);
@@ -87,7 +87,7 @@ export class ColorRectangle extends BaseComponent<IColorRectangleProps, IColorPi
   @autobind
   private _onMouseMove(ev: React.MouseEvent<HTMLElement>) {
     const { color, onSVChanged } = this.props;
-    const rectSize = this.root.getBoundingClientRect();
+    const rectSize = this._root.getBoundingClientRect();
 
     const sPercentage = (ev.clientX - rectSize.left) / rectSize.width;
     const vPercentage = (ev.clientY - rectSize.top) / rectSize.height;

From 9c89631feaccbcd36dc84c0da09cdcd4f8dfa965 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 27 Feb 2018 06:33:40 +0000
Subject: [PATCH 1452/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...ckerCallbackOrderFix_2018-02-25-00-39.json | 11 -----------
 ...ellan-fixNullRootRef_2018-02-26-22-26.json | 11 -----------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 11 files changed, 35 insertions(+), 30 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/dbrough-datePickerCallbackOrderFix_2018-02-25-00-39.json
 delete mode 100644 common/changes/office-ui-fabric-react/magellan-fixNullRootRef_2018-02-26-22-26.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index f325490486d5b..6ae43b5739d7e 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.55.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.55.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 140dd6b7305f6..4b95787b5190c 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.55.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.55.2 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index eedcabee47323..e8e6005cb6f53 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.55.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.55.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index f9e1ba758cd51..9e645d44446ad 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.55.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.55.2 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 082a12c810039..57286a7ad99c0 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.55.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.55.2 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/office-ui-fabric-react/dbrough-datePickerCallbackOrderFix_2018-02-25-00-39.json b/common/changes/office-ui-fabric-react/dbrough-datePickerCallbackOrderFix_2018-02-25-00-39.json
deleted file mode 100644
index c2c83cd6b2254..0000000000000
--- a/common/changes/office-ui-fabric-react/dbrough-datePickerCallbackOrderFix_2018-02-25-00-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DatePicker calls onDateSelected then AfterMenuDismissed to follow the same pattern as BaseButton",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dbrough@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/magellan-fixNullRootRef_2018-02-26-22-26.json b/common/changes/office-ui-fabric-react/magellan-fixNullRootRef_2018-02-26-22-26.json
deleted file mode 100644
index 71f1f0af4d67a..0000000000000
--- a/common/changes/office-ui-fabric-react/magellan-fixNullRootRef_2018-02-26-22-26.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ColorPicker: internal ref issue was fixed, which lets colors be picked a little better.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 2a4a89a2674ab..b80b6550f208a 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.55.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.55.2 <6.0.0",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 755b6a14acdfb..31c0a33d76f20 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.55.2",
+      "tag": "office-ui-fabric-react_v5.55.2",
+      "date": "Tue, 27 Feb 2018 06:33:39 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Drew Brough <drew-brough@users.noreply.github.com>",
+            "commit": "9b2f25a818c7db0e98b4dd9ece25e8506c619d31",
+            "comment": "DatePicker calls onDateSelected then AfterMenuDismissed to follow the same pattern as BaseButton"
+          },
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "78519862e799fc260f428bf56c1fb3c4610b2ec5",
+            "comment": "ColorPicker: internal ref issue was fixed, which lets colors be picked a little better."
+          }
+        ]
+      }
+    },
     {
       "version": "5.55.1",
       "tag": "office-ui-fabric-react_v5.55.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index c9f857a319342..f65d2d1de719e 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Sat, 24 Feb 2018 05:10:14 GMT and should not be manually modified.
+This log was last generated on Tue, 27 Feb 2018 06:33:39 GMT and should not be manually modified.
+
+## 5.55.2
+Tue, 27 Feb 2018 06:33:39 GMT
+
+### Patches
+
+- DatePicker calls onDateSelected then AfterMenuDismissed to follow the same pattern as BaseButton
+- ColorPicker: internal ref issue was fixed, which lets colors be picked a little better.
 
 ## 5.55.1
 Sat, 24 Feb 2018 05:10:13 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index cc8db91f8f094..66b2f34d8a970 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.55.1",
+  "version": "5.55.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 70704cae89b7495d67cd5779a194f48db00c757c Mon Sep 17 00:00:00 2001
From: Su Su <s@warmsea.net>
Date: Tue, 27 Feb 2018 23:29:14 +0800
Subject: [PATCH 1453/1641] Sticky (#4091)

* Fix #4073

* Add change file.
---
 .../Sticky_2018-02-24-15-18.json                      | 11 +++++++++++
 .../src/components/Sticky/Sticky.tsx                  |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/Sticky_2018-02-24-15-18.json

diff --git a/common/changes/office-ui-fabric-react/Sticky_2018-02-24-15-18.json b/common/changes/office-ui-fabric-react/Sticky_2018-02-24-15-18.json
new file mode 100644
index 0000000000000..dfd2b18bb0cfa
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/Sticky_2018-02-24-15-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix this.root undefined issue in Sticky component.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "s@warmsea.net"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
index 2c5934ccba9c2..a0980248e9a54 100644
--- a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
+++ b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
@@ -130,7 +130,7 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
     const isSticky = isStickyTop || isStickyBottom;
 
     return (
-      <div ref={ this._resolveRef('_root') }>
+      <div ref={ this._resolveRef('root') }>
         <div style={ { height: (isSticky ? placeholderHeight : 0) } } />
       </div>
     );

From 25ac4a751a664c59c596a8bb31203c9d707828ec Mon Sep 17 00:00:00 2001
From: Su Su <s@warmsea.net>
Date: Wed, 28 Feb 2018 00:26:29 +0800
Subject: [PATCH 1454/1641] Allow ScrollablePane to accept native properties.
 (#4095)

* Allow ScrollablePane to accept native properties

* Add change file.
---
 .../ScrollablePane_2018-02-26-14-25.json              | 11 +++++++++++
 .../components/ScrollablePane/ScrollablePane.base.tsx |  5 ++++-
 2 files changed, 15 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/ScrollablePane_2018-02-26-14-25.json

diff --git a/common/changes/office-ui-fabric-react/ScrollablePane_2018-02-26-14-25.json b/common/changes/office-ui-fabric-react/ScrollablePane_2018-02-26-14-25.json
new file mode 100644
index 0000000000000..b5062a0a40b8e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/ScrollablePane_2018-02-26-14-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Allow ScrollablePane to accept native properties.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "s@warmsea.net"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
index bc6f994b89434..d3eb3937ccfdf 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
@@ -7,7 +7,9 @@ import {
   autobind,
   BaseComponent,
   classNamesFunction,
-  customizable
+  customizable,
+  divProperties,
+  getNativeProps
 } from '../../Utilities';
 import {
   IScrollablePane,
@@ -90,6 +92,7 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
 
     return (
       <div
+        { ...getNativeProps(this.props, divProperties) }
         ref={ this._resolveRef('root') }
         className={ classNames.root }
         data-is-scrollable={ true }

From 835585d21bb8caa991e9c09ea38b10edcbd3fa75 Mon Sep 17 00:00:00 2001
From: Su Su <s@warmsea.net>
Date: Wed, 28 Feb 2018 00:26:47 +0800
Subject: [PATCH 1455/1641] Scrollable pane sort stickies (#4111)

* Make ScrollablePane._sortStickies change elements only when needed

* Add change file.
---
 ...blePane-sortStickies_2018-02-27-12-25.json | 11 ++++++++++
 .../ScrollablePane/ScrollablePane.base.tsx    | 21 ++++++++++++++-----
 2 files changed, 27 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/ScrollablePane-sortStickies_2018-02-27-12-25.json

diff --git a/common/changes/office-ui-fabric-react/ScrollablePane-sortStickies_2018-02-27-12-25.json b/common/changes/office-ui-fabric-react/ScrollablePane-sortStickies_2018-02-27-12-25.json
new file mode 100644
index 0000000000000..5e7f93f614198
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/ScrollablePane-sortStickies_2018-02-27-12-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Make ScrollablePane._sortStickies change elements only when needed.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "s@warmsea.net"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
index d3eb3937ccfdf..378dddb138667 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
@@ -220,12 +220,23 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
       const bOffset = this._calculateOffsetParent(b.root);
       return aOffset - bOffset;
     });
-    while (container.lastChild) {
-      container.removeChild(container.lastChild);
+    // Get number of elements that is already in order.
+    let elementsInOrder = 0;
+    while (elementsInOrder < container.children.length && elementsInOrder < stickyArr.length) {
+      if (container.children[elementsInOrder] === stickyArr[elementsInOrder].content) {
+        ++elementsInOrder;
+      } else {
+        break;
+      }
+    }
+    // Remove elements that is not in order if exist.
+    for (let i = container.children.length - 1; i >= elementsInOrder; --i) {
+      container.removeChild(container.children[i]);
+    }
+    // Append further elements if needed.
+    for (let i = elementsInOrder; i < stickyArr.length; ++i) {
+      container.appendChild(stickyArr[i].content);
     }
-    stickyArr.forEach((sticky) => {
-      container.appendChild(sticky.content);
-    });
   }
 
   private _calculateOffsetParent(ele: HTMLElement): number {

From c468751e4eb75df1fab7e320a559f8a28953bc70 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 27 Feb 2018 08:56:20 -0800
Subject: [PATCH 1456/1641] ComboBox: Fixed input overlap rendering issue
 (#4102)

* Shorted and centered input field

* Added change file

* Updated snapshot
---
 .../combobox-input-ht_2018-02-26-22-46.json   | 11 ++++++++++
 .../components/ComboBox/ComboBox.styles.ts    | 12 +++++------
 .../__snapshots__/ComboBox.test.tsx.snap      | 21 ++++++++-----------
 3 files changed, 25 insertions(+), 19 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/combobox-input-ht_2018-02-26-22-46.json

diff --git a/common/changes/office-ui-fabric-react/combobox-input-ht_2018-02-26-22-46.json b/common/changes/office-ui-fabric-react/combobox-input-ht_2018-02-26-22-46.json
new file mode 100644
index 0000000000000..45d0264b15b11
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/combobox-input-ht_2018-02-26-22-46.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Shortened and centered the input field to account for overlap that appears at some resolutions.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": ""
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index 98de0475a975b..0c0037c234294 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -214,11 +214,9 @@ export const getStyles = memoizeFunction((
     borderWidth: '2px',
     MsHighContrastAdjust: 'none',
     paddingLeft: '11px',
+    paddingTop: '0',
+    paddingBottom: '0',
     selectors: {
-      '.ms-ComboBox-Input': {
-        // ComboBoxHeight is 32, 28 accounts for the 2px borders
-        height: '28px'
-      },
       '.ms-ComboBox-CaretDown-button': {
         // Negative positioning to account for the 2px border
         right: '-2px',
@@ -237,9 +235,9 @@ export const getStyles = memoizeFunction((
         boxShadow: 'none',
         marginBottom: '10px',
         marginLeft: '0',
-        paddingTop: '0',
+        paddingTop: '1px', // The 1px padding centers the input field, avoiding overlap in the browser
+        paddingBottom: '1px',
         paddingRight: ComboxBoxCaretDownWidth,
-        paddingBottom: '0',
         paddingLeft: '12px',
         color: ComboBoxRootTextColor,
         position: 'relative',
@@ -316,7 +314,7 @@ export const getStyles = memoizeFunction((
     input: {
       boxSizing: 'border-box',
       width: '100%',
-      height: '30px',
+      height: '28px',
       borderStyle: 'none',
       outline: 'none',
       font: 'inherit',
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
index a6f5bdf79bb21..2531bea9cb933 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
@@ -28,10 +28,10 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
           margin-left: 0;
           outline: 0;
           overflow: hidden;
-          padding-bottom: 0;
+          padding-bottom: 1px;
           padding-left: 12px;
           padding-right: 32px;
-          padding-top: 0;
+          padding-top: 1px;
           position: relative;
           text-overflow: ellipsis;
           user-select: none;
@@ -53,10 +53,9 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
           border-color: Highlight;
           border-width: 2px;
           color: HighlightText;
+          padding-bottom: 0;
           padding-left: 11px;
-        }
-        @media screen and (-ms-high-contrast: active){&.is-open .ms-ComboBox-Input {
-          height: 28px;
+          padding-top: 0;
         }
         @media screen and (-ms-high-contrast: active){&.is-open .ms-ComboBox-CaretDown-button {
           right: -2px;
@@ -80,10 +79,9 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
           border-color: Highlight;
           border-width: 2px;
           color: HighlightText;
+          padding-bottom: 0;
           padding-left: 11px;
-        }
-        @media screen and (-ms-high-contrast: active){&:active .ms-ComboBox-Input {
-          height: 28px;
+          padding-top: 0;
         }
         @media screen and (-ms-high-contrast: active){&:active .ms-ComboBox-CaretDown-button {
           right: -2px;
@@ -98,10 +96,9 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
           border-color: Highlight;
           border-width: 2px;
           color: HighlightText;
+          padding-bottom: 0;
           padding-left: 11px;
-        }
-        @media screen and (-ms-high-contrast: active){&:focus .ms-ComboBox-Input {
-          height: 28px;
+          padding-top: 0;
         }
         @media screen and (-ms-high-contrast: active){&:focus .ms-ComboBox-CaretDown-button {
           right: -2px;
@@ -127,7 +124,7 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
             border-style: none;
             box-sizing: border-box;
             font: inherit;
-            height: 30px;
+            height: 28px;
             outline: none;
             padding-bottom: 0;
             padding-left: 0;

From ac43f523749423c2ee3cd9ad1f4ba868612c7241 Mon Sep 17 00:00:00 2001
From: natalieethell <yummyraspberries@gmail.com>
Date: Tue, 27 Feb 2018 12:23:17 -0800
Subject: [PATCH 1457/1641] Fix toggle colors (#4118)

* Toggle colors fix

* change request file
---
 .../fixToggleColors_2018-02-27-19-09.json             | 11 +++++++++++
 .../src/components/Toggle/Toggle.classNames.ts        |  8 ++++----
 2 files changed, 15 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fixToggleColors_2018-02-27-19-09.json

diff --git a/common/changes/office-ui-fabric-react/fixToggleColors_2018-02-27-19-09.json b/common/changes/office-ui-fabric-react/fixToggleColors_2018-02-27-19-09.json
new file mode 100644
index 0000000000000..003109e133772
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fixToggleColors_2018-02-27-19-09.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Toggle color fixes",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "naethell@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
index 922df3b113f30..5bc01a79fb4f3 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
@@ -27,15 +27,15 @@ export const getClassNames = memoizeFunction((
   const pillUncheckedBackground = semanticColors.bodyBackground;
   const pillCheckedBackground = semanticColors.inputBackgroundChecked;
   const pillCheckedHoveredBackground = semanticColors.inputBackgroundCheckedHovered;
-  const pillCheckedDisabledBackground = semanticColors.disabledText;
+  const pillCheckedDisabledBackground = semanticColors.disabledBodyText;
   const thumbBackground = semanticColors.inputBorderHovered;
   const thumbCheckedBackground = semanticColors.inputForegroundChecked;
-  const thumbDisabledBackground = semanticColors.disabledText;
+  const thumbDisabledBackground = semanticColors.disabledBodyText;
   const thumbCheckedDisabledBackground = semanticColors.disabledBackground;
   const pillBorderColor = semanticColors.smallInputBorder;
   const pillBorderHoveredColor = semanticColors.inputBorderHovered;
-  const pillBorderDisabledColor = semanticColors.disabledText;
-  const textDisabledColor = semanticColors.disabledBodyText;
+  const pillBorderDisabledColor = semanticColors.disabledBodyText;
+  const textDisabledColor = semanticColors.disabledText;
 
   styles = styles || {};
 

From f16ed136c3dd6a10421a4a80d2b789bbc4c3aacf Mon Sep 17 00:00:00 2001
From: Serkan Inci <serkan.inci@hotmail.com>
Date: Tue, 27 Feb 2018 17:34:20 -0500
Subject: [PATCH 1458/1641] Fixing direct references to @uifabric which breaks
 AMD (#4109)

* Fixing direct references to @uifabric which breaks AMD

* Adding config change

* Fixing reference to point an actual file.

* Adding config file

* Use ..\..\Utilities
---
 .../master_2018-02-27-10-02.json                      | 11 +++++++++++
 .../master_2018-02-27-10-47.json                      | 11 +++++++++++
 .../src/components/Check/Check.base.tsx               |  2 +-
 .../src/components/Check/Check.styles.ts              |  4 ++--
 .../src/components/Check/Check.tsx                    |  2 +-
 .../src/components/CommandBar/CommandBar.tsx          |  2 +-
 6 files changed, 27 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/master_2018-02-27-10-02.json
 create mode 100644 common/changes/office-ui-fabric-react/master_2018-02-27-10-47.json

diff --git a/common/changes/office-ui-fabric-react/master_2018-02-27-10-02.json b/common/changes/office-ui-fabric-react/master_2018-02-27-10-02.json
new file mode 100644
index 0000000000000..c4cfff2088ee2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2018-02-27-10-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixing direct references to @uifabric which breaks AMD",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "serkani@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2018-02-27-10-47.json b/common/changes/office-ui-fabric-react/master_2018-02-27-10-47.json
new file mode 100644
index 0000000000000..129f03946cc48
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2018-02-27-10-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixing reference of 'utilities/contextualMenu' to point an actual file.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "serkani@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.base.tsx b/packages/office-ui-fabric-react/src/components/Check/Check.base.tsx
index d0a679aaf1ae2..98086779c03fd 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.base.tsx
@@ -3,7 +3,7 @@ import {
   BaseComponent,
   classNamesFunction,
   customizable,
-} from '@uifabric/utilities';
+} from '../../Utilities';
 import {
   ICheckProps,
   ICheckStyleProps,
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.styles.ts b/packages/office-ui-fabric-react/src/components/Check/Check.styles.ts
index 94e7c1af848b4..5650abc8b2790 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.styles.ts
@@ -4,8 +4,8 @@ import {
   HighContrastSelector,
   IStyle,
   ITheme,
-} from '@uifabric/styling';
-import { memoizeFunction } from '@uifabric/utilities';
+} from '../../Styling';
+import { memoizeFunction } from '../../Utilities';
 
 export const getStyles = (
   props: ICheckStyleProps
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.tsx b/packages/office-ui-fabric-react/src/components/Check/Check.tsx
index 5ad63f1c407b8..fb9889e23e57d 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.tsx
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.tsx
@@ -1,4 +1,4 @@
-import { styled } from '@uifabric/utilities';
+import { styled } from '../../Utilities';
 import {
   ICheckProps,
   ICheckStyleProps,
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index bf7a9c85599b8..9d1c8f1b0cb10 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -12,7 +12,7 @@ import {
 import { ICommandBar, ICommandBarProps, ICommandBarItemProps } from './CommandBar.types';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { ContextualMenu, IContextualMenuProps, IContextualMenuItem } from '../../ContextualMenu';
-import { hasSubmenu } from '../../utilities/contextualMenu';
+import { hasSubmenu } from '../../utilities/contextualMenu/index';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import {
   Icon,

From 03a7a5c4f0b35470298f8b8b19a6933a526ebb46 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 27 Feb 2018 22:56:59 +0000
Subject: [PATCH 1459/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...blePane-sortStickies_2018-02-27-12-25.json | 11 -----
 .../ScrollablePane_2018-02-26-14-25.json      | 11 -----
 .../Sticky_2018-02-24-15-18.json              | 11 -----
 .../combobox-input-ht_2018-02-26-22-46.json   | 11 -----
 .../fixToggleColors_2018-02-27-19-09.json     | 11 -----
 .../master_2018-02-27-10-02.json              | 11 -----
 .../master_2018-02-27-10-47.json              | 11 -----
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 44 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 ++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 16 files changed, 65 insertions(+), 85 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/ScrollablePane-sortStickies_2018-02-27-12-25.json
 delete mode 100644 common/changes/office-ui-fabric-react/ScrollablePane_2018-02-26-14-25.json
 delete mode 100644 common/changes/office-ui-fabric-react/Sticky_2018-02-24-15-18.json
 delete mode 100644 common/changes/office-ui-fabric-react/combobox-input-ht_2018-02-26-22-46.json
 delete mode 100644 common/changes/office-ui-fabric-react/fixToggleColors_2018-02-27-19-09.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2018-02-27-10-02.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2018-02-27-10-47.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 6ae43b5739d7e..7a68b761ca92d 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.55.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.55.3 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 4b95787b5190c..b16ee95586db3 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.55.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.55.3 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index e8e6005cb6f53..04af02758e3d8 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.55.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.55.3 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 9e645d44446ad..27a434c2dd7c3 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.55.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.55.3 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 57286a7ad99c0..f24c95d50de48 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.55.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.55.3 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/office-ui-fabric-react/ScrollablePane-sortStickies_2018-02-27-12-25.json b/common/changes/office-ui-fabric-react/ScrollablePane-sortStickies_2018-02-27-12-25.json
deleted file mode 100644
index 5e7f93f614198..0000000000000
--- a/common/changes/office-ui-fabric-react/ScrollablePane-sortStickies_2018-02-27-12-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Make ScrollablePane._sortStickies change elements only when needed.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "s@warmsea.net"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/ScrollablePane_2018-02-26-14-25.json b/common/changes/office-ui-fabric-react/ScrollablePane_2018-02-26-14-25.json
deleted file mode 100644
index b5062a0a40b8e..0000000000000
--- a/common/changes/office-ui-fabric-react/ScrollablePane_2018-02-26-14-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Allow ScrollablePane to accept native properties.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "s@warmsea.net"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/Sticky_2018-02-24-15-18.json b/common/changes/office-ui-fabric-react/Sticky_2018-02-24-15-18.json
deleted file mode 100644
index dfd2b18bb0cfa..0000000000000
--- a/common/changes/office-ui-fabric-react/Sticky_2018-02-24-15-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix this.root undefined issue in Sticky component.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "s@warmsea.net"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/combobox-input-ht_2018-02-26-22-46.json b/common/changes/office-ui-fabric-react/combobox-input-ht_2018-02-26-22-46.json
deleted file mode 100644
index 45d0264b15b11..0000000000000
--- a/common/changes/office-ui-fabric-react/combobox-input-ht_2018-02-26-22-46.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Shortened and centered the input field to account for overlap that appears at some resolutions.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": ""
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fixToggleColors_2018-02-27-19-09.json b/common/changes/office-ui-fabric-react/fixToggleColors_2018-02-27-19-09.json
deleted file mode 100644
index 003109e133772..0000000000000
--- a/common/changes/office-ui-fabric-react/fixToggleColors_2018-02-27-19-09.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Toggle color fixes",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "naethell@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2018-02-27-10-02.json b/common/changes/office-ui-fabric-react/master_2018-02-27-10-02.json
deleted file mode 100644
index c4cfff2088ee2..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2018-02-27-10-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixing direct references to @uifabric which breaks AMD",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "serkani@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2018-02-27-10-47.json b/common/changes/office-ui-fabric-react/master_2018-02-27-10-47.json
deleted file mode 100644
index 129f03946cc48..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2018-02-27-10-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixing reference of 'utilities/contextualMenu' to point an actual file.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "serkani@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index b80b6550f208a..9be3e2a6eb346 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.55.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.55.3 <6.0.0",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 31c0a33d76f20..0205918b38a03 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,50 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.55.3",
+      "tag": "office-ui-fabric-react_v5.55.3",
+      "date": "Tue, 27 Feb 2018 22:56:59 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "c468751e4eb75df1fab7e320a559f8a28953bc70",
+            "comment": "ComboBox: Shortened and centered the input field to account for overlap that appears at some resolutions."
+          },
+          {
+            "author": "natalieethell <yummyraspberries@gmail.com>",
+            "commit": "ac43f523749423c2ee3cd9ad1f4ba868612c7241",
+            "comment": "Toggle color fixes"
+          },
+          {
+            "author": "Serkan Inci <serkan.inci@hotmail.com>",
+            "commit": "f16ed136c3dd6a10421a4a80d2b789bbc4c3aacf",
+            "comment": "Fixing direct references to @uifabric which breaks AMD"
+          },
+          {
+            "author": "Serkan Inci <serkan.inci@hotmail.com>",
+            "commit": "f16ed136c3dd6a10421a4a80d2b789bbc4c3aacf",
+            "comment": "Fixing reference of 'utilities/contextualMenu' to point an actual file."
+          },
+          {
+            "author": "Su Su <s@warmsea.net>",
+            "commit": "25ac4a751a664c59c596a8bb31203c9d707828ec",
+            "comment": "Allow ScrollablePane to accept native properties."
+          },
+          {
+            "author": "Su Su <s@warmsea.net>",
+            "commit": "835585d21bb8caa991e9c09ea38b10edcbd3fa75",
+            "comment": "Make ScrollablePane._sortStickies change elements only when needed."
+          },
+          {
+            "author": "Su Su <s@warmsea.net>",
+            "commit": "70704cae89b7495d67cd5779a194f48db00c757c",
+            "comment": "Fix this.root undefined issue in Sticky component."
+          }
+        ]
+      }
+    },
     {
       "version": "5.55.2",
       "tag": "office-ui-fabric-react_v5.55.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index f65d2d1de719e..f5c6e2aa6ee3f 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 27 Feb 2018 06:33:39 GMT and should not be manually modified.
+This log was last generated on Tue, 27 Feb 2018 22:56:59 GMT and should not be manually modified.
+
+## 5.55.3
+Tue, 27 Feb 2018 22:56:59 GMT
+
+### Patches
+
+- ComboBox: Shortened and centered the input field to account for overlap that appears at some resolutions.
+- Toggle color fixes
+- Fixing direct references to @uifabric which breaks AMD
+- Fixing reference of 'utilities/contextualMenu' to point an actual file.
+- Allow ScrollablePane to accept native properties.
+- Make ScrollablePane._sortStickies change elements only when needed.
+- Fix this.root undefined issue in Sticky component.
 
 ## 5.55.2
 Tue, 27 Feb 2018 06:33:39 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 66b2f34d8a970..3edf5b94319f9 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.55.2",
+  "version": "5.55.3",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 216f8e4d021b235926cb81dcbdbf7b6b95e5c5ac Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Tue, 27 Feb 2018 15:27:14 -0800
Subject: [PATCH 1460/1641] ContextualMenu: Update hover behavior around
 submenus (#4121)

* Fix hover behavior

* Update how focus is set on hover to be more flexible for contextualMenus

* Update setting focus only once per call

* Update comments and rush change

* Add comment for newly added function

* Remove unneeded check

* fix typo
---
 ...lMenuFixSubmenuHover_2018-02-27-20-46.json | 11 ++++
 .../ContextualMenu/ContextualMenu.tsx         | 65 ++++++++++++-------
 2 files changed, 53 insertions(+), 23 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-ContextualMenuFixSubmenuHover_2018-02-27-20-46.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-ContextualMenuFixSubmenuHover_2018-02-27-20-46.json b/common/changes/office-ui-fabric-react/jspurlin-ContextualMenuFixSubmenuHover_2018-02-27-20-46.json
new file mode 100644
index 0000000000000..7ee1aa1c06d9e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-ContextualMenuFixSubmenuHover_2018-02-27-20-46.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: Update Hover/Focus Behavior around expanding/collapsing Submenus",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 8cb2cb50e310f..12682830a5ebb 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -96,7 +96,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   private _target: HTMLElement | MouseEvent | IPoint | null;
   private _classNames: IContextualMenuClassNames;
   private _isScrollIdle: boolean;
-  private readonly _scrollIdleDelay: number = 250 /* ms */;
+  private readonly _navigationIdleDelay: number = 250 /* ms */;
   private _scrollIdleTimeoutId: number | undefined;
 
   private _adjustedFocusZoneProps: IFocusZoneProps;
@@ -734,7 +734,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       this._isScrollIdle = false;
     }
 
-    this._scrollIdleTimeoutId = this._async.setTimeout(() => { this._isScrollIdle = true; }, this._scrollIdleDelay);
+    this._scrollIdleTimeoutId = this._async.setTimeout(() => { this._isScrollIdle = true; }, this._navigationIdleDelay);
   }
 
   private _onItemMouseEnter(item: any, ev: React.MouseEvent<HTMLElement>) {
@@ -742,17 +742,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       return;
     }
 
-    const targetElement = ev.currentTarget as HTMLElement;
-
-    if (item.key !== this.state.expandedMenuItemKey) {
-      if (hasSubmenu(item)) {
-        this._enterTimerId = this._async.setTimeout(() => this._onItemSubMenuExpand(item, targetElement), 500);
-      } else {
-        this._enterTimerId = this._async.setTimeout(() => this._onSubMenuDismiss(ev), 500);
-      }
-    }
-
-    targetElement.focus();
+    this._updateFocusOnMouseEvent(item, ev);
   }
 
   private _onItemMouseMove(item: any, ev: React.MouseEvent<HTMLElement>) {
@@ -763,15 +753,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       return;
     }
 
-    if (item.key !== this.state.expandedMenuItemKey) {
-      if (hasSubmenu(item)) {
-        this._enterTimerId = this._async.setTimeout(() => this._onItemSubMenuExpand(item, targetElement), 500);
-      } else {
-        this._enterTimerId = this._async.setTimeout(() => this._onSubMenuDismiss(ev), 500);
-      }
-    }
-
-    targetElement.focus();
+    this._updateFocusOnMouseEvent(item, ev);
   }
 
   @autobind
@@ -785,7 +767,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       this._enterTimerId = undefined;
     }
 
-    if (item.key === this.state.expandedMenuItemKey && hasSubmenu(item)) {
+    if (this.state.expandedMenuItemKey !== undefined) {
       return;
     }
 
@@ -801,6 +783,43 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     }
   }
 
+  /**
+   * Handles updating focus when mouseEnter or mouseMove fire.
+   * As part of updating focus, This function will also update
+   * the expand/collapse state accordingly.
+   */
+  private _updateFocusOnMouseEvent(item: any, ev: React.MouseEvent<HTMLElement>) {
+    const targetElement = ev.currentTarget as HTMLElement;
+
+    if (item.key === this.state.expandedMenuItemKey) {
+      return;
+    }
+
+    if (this._enterTimerId !== undefined) {
+      this._async.clearTimeout(this._enterTimerId);
+      this._enterTimerId = undefined;
+    }
+
+    // If the menu is not expanded we can update focus without any delay
+    if (this.state.expandedMenuItemKey === undefined) {
+      targetElement.focus();
+    }
+
+    // Delay updating expanding/dismissing the submenu
+    // and only set focus if we have not already done so
+    if (hasSubmenu(item)) {
+      this._enterTimerId = this._async.setTimeout(() => {
+        targetElement.focus();
+        this._onItemSubMenuExpand(item, targetElement);
+      }, this._navigationIdleDelay);
+    } else {
+      this._enterTimerId = this._async.setTimeout(() => {
+        this._onSubMenuDismiss(ev);
+        targetElement.focus();
+      }, this._navigationIdleDelay);
+    }
+  }
+
   private _onItemMouseDown(item: IContextualMenuItem, ev: React.MouseEvent<HTMLElement>) {
     if (item.onMouseDown) {
       item.onMouseDown(item, ev);

From d00d49f4b69e2ec7b3313997a4d45adb1f520b34 Mon Sep 17 00:00:00 2001
From: Mike Wheaton <miwhea@microsoft.com>
Date: Tue, 27 Feb 2018 15:43:24 -0800
Subject: [PATCH 1461/1641] Persona: Prepare for conversion to merge-styles
 (#4115)

* Make changes to file structure and interfaces to prepare for conversion to merge-styles

* Add change file

* Remove PersonaBase from exports

* Export PersonaBase
---
 ...omponent-restructure_2018-02-27-17-42.json |  11 ++
 .../src/components/Persona/Persona.base.tsx   | 140 +++++++++++++++++
 .../src/components/Persona/Persona.styles.ts  |  27 ++++
 .../src/components/Persona/Persona.tsx        | 145 ++----------------
 .../src/components/Persona/Persona.types.ts   |  32 +++-
 .../src/components/Persona/index.ts           |   1 +
 6 files changed, 218 insertions(+), 138 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/miwhea-persona-styled-component-restructure_2018-02-27-17-42.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Persona/Persona.base.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Persona/Persona.styles.ts

diff --git a/common/changes/office-ui-fabric-react/miwhea-persona-styled-component-restructure_2018-02-27-17-42.json b/common/changes/office-ui-fabric-react/miwhea-persona-styled-component-restructure_2018-02-27-17-42.json
new file mode 100644
index 0000000000000..c430398c88bbf
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/miwhea-persona-styled-component-restructure_2018-02-27-17-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Prepare Persona for conversion to merge-styles",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mike@mikewheaton.ca"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.base.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.base.tsx
new file mode 100644
index 0000000000000..35ba6e3fd38a1
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.base.tsx
@@ -0,0 +1,140 @@
+import * as React from 'react';
+import {
+  BaseComponent,
+  autobind,
+  css,
+  divProperties,
+  getNativeProps,
+  IRenderFunction
+} from '../../Utilities';
+import { TooltipHost, TooltipOverflowMode, DirectionalHint } from '../../Tooltip';
+import { PersonaCoin } from './PersonaCoin';
+import {
+  IPersonaProps,
+  PersonaPresence as PersonaPresenceEnum,
+  PersonaSize
+} from './Persona.types';
+import {
+  PERSONA_PRESENCE,
+  PERSONA_SIZE
+} from './PersonaConsts';
+import * as stylesImport from './Persona.scss';
+const styles: any = stylesImport;
+
+export class PersonaBase extends BaseComponent<IPersonaProps, {}> {
+  public static defaultProps: IPersonaProps = {
+    primaryText: '',
+    size: PersonaSize.size48,
+    presence: PersonaPresenceEnum.none,
+    imageAlt: ''
+  };
+
+  constructor(props: IPersonaProps) {
+    super(props);
+  }
+
+  public render() {
+    const {
+      hidePersonaDetails,
+      onRenderPrimaryText,
+      onRenderSecondaryText,
+      onRenderTertiaryText,
+      onRenderOptionalText,
+    } = this.props;
+    const size = this.props.size as PersonaSize;
+
+    // These properties are to be explicitly passed into PersonaCoin because they are the only props directly used
+    const {
+      className,
+      coinProps,
+      coinSize,
+      imageUrl,
+      imageAlt,
+      imageInitials,
+      initialsColor,
+      presence,
+      primaryText,
+      imageShouldFadeIn,
+      imageShouldStartVisible,
+      showSecondaryText,
+      onPhotoLoadingStateChange,
+      onRenderCoin
+    } = this.props;
+
+    const personaCoinProps = {
+      coinProps,
+      coinSize,
+      imageUrl,
+      imageAlt,
+      imageInitials,
+      initialsColor,
+      presence,
+      primaryText,
+      imageShouldFadeIn,
+      imageShouldStartVisible,
+      size,
+      onPhotoLoadingStateChange,
+      onRenderCoin
+    };
+
+    const divProps = getNativeProps(this.props, divProperties);
+    const personaDetails = (
+      <div className={ css('ms-Persona-details', styles.details) }>
+        { this._renderElement(
+          this.props.primaryText,
+          css('ms-Persona-primaryText', styles.primaryText),
+          onRenderPrimaryText) }
+        { this._renderElement(
+          this.props.secondaryText,
+          css('ms-Persona-secondaryText', styles.secondaryText),
+          onRenderSecondaryText) }
+        { this._renderElement(
+          this.props.tertiaryText,
+          css('ms-Persona-tertiaryText', styles.tertiaryText),
+          onRenderTertiaryText) }
+        { this._renderElement(
+          this.props.optionalText,
+          css('ms-Persona-optionalText', styles.optionalText),
+          onRenderOptionalText) }
+        { this.props.children }
+      </div>
+    );
+
+    return (
+      <div
+        { ...divProps }
+        className={
+          css('ms-Persona',
+            styles.root,
+            className,
+            PERSONA_SIZE[size],
+            PERSONA_PRESENCE[presence as PersonaPresenceEnum],
+            showSecondaryText && styles.showSecondaryText
+          )
+        }
+        style={ coinSize ? { height: coinSize, minWidth: coinSize } : undefined }
+      >
+        <PersonaCoin { ...personaCoinProps } />
+        { (!hidePersonaDetails || (size === PersonaSize.size10 || size === PersonaSize.tiny)) && personaDetails }
+      </div>
+    );
+  }
+
+  @autobind
+  private _renderElement(text: string | undefined, className: string, render?: IRenderFunction<IPersonaProps>): JSX.Element {
+    return (
+      <div className={ className }>
+        { render
+          ? render(this.props)
+          : text && (<TooltipHost
+            content={ text }
+            overflowMode={ TooltipOverflowMode.Parent }
+            directionalHint={ DirectionalHint.topLeftEdge }
+          >
+            { text }
+          </TooltipHost>)
+        }
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.styles.ts b/packages/office-ui-fabric-react/src/components/Persona/Persona.styles.ts
new file mode 100644
index 0000000000000..6e552f2e6a87b
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.styles.ts
@@ -0,0 +1,27 @@
+import { IPersonaStyleProps, IPersonaStyles } from './Persona.types';
+import {
+  IStyle,
+  ITheme,
+} from '../../Styling';
+
+export const getStyles = (
+  props: IPersonaStyleProps
+): IPersonaStyles => {
+  const {
+    className,
+    theme,
+  } = props;
+
+  const { palette, semanticColors } = theme;
+
+  return ({
+    root: [
+      'ms-Persona',
+      {
+        // Insert css properties
+      }
+    ],
+
+    // Insert className styles
+  });
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
index 8842c67993ca2..89d1f91649fc8 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.tsx
@@ -1,140 +1,13 @@
-import * as React from 'react';
-import {
-  BaseComponent,
-  autobind,
-  css,
-  divProperties,
-  getNativeProps,
-  IRenderFunction
-} from '../../Utilities';
-import { TooltipHost, TooltipOverflowMode, DirectionalHint } from '../../Tooltip';
-import { PersonaCoin } from './PersonaCoin';
+import { styled } from '../../Utilities';
 import {
   IPersonaProps,
-  PersonaPresence as PersonaPresenceEnum,
-  PersonaSize
+  IPersonaStyleProps,
+  IPersonaStyles
 } from './Persona.types';
-import {
-  PERSONA_PRESENCE,
-  PERSONA_SIZE
-} from './PersonaConsts';
-import * as stylesImport from './Persona.scss';
-const styles: any = stylesImport;
-
-export class Persona extends BaseComponent<IPersonaProps, {}> {
-  public static defaultProps: IPersonaProps = {
-    primaryText: '',
-    size: PersonaSize.size48,
-    presence: PersonaPresenceEnum.none,
-    imageAlt: ''
-  };
-
-  constructor(props: IPersonaProps) {
-    super(props);
-  }
-
-  public render() {
-    const {
-      hidePersonaDetails,
-      onRenderPrimaryText,
-      onRenderSecondaryText,
-      onRenderTertiaryText,
-      onRenderOptionalText,
-    } = this.props;
-    const size = this.props.size as PersonaSize;
-
-    // These properties are to be explicitly passed into PersonaCoin because they are the only props directly used
-    const {
-      className,
-      coinProps,
-      coinSize,
-      imageUrl,
-      imageAlt,
-      imageInitials,
-      initialsColor,
-      presence,
-      primaryText,
-      imageShouldFadeIn,
-      imageShouldStartVisible,
-      showSecondaryText,
-      onPhotoLoadingStateChange,
-      onRenderCoin
-     } = this.props;
-
-    const personaCoinProps = {
-      coinProps,
-      coinSize,
-      imageUrl,
-      imageAlt,
-      imageInitials,
-      initialsColor,
-      presence,
-      primaryText,
-      imageShouldFadeIn,
-      imageShouldStartVisible,
-      size,
-      onPhotoLoadingStateChange,
-      onRenderCoin
-    };
-
-    const divProps = getNativeProps(this.props, divProperties);
-    const personaDetails = (
-      <div className={ css('ms-Persona-details', styles.details) }>
-        { this._renderElement(
-          this.props.primaryText,
-          css('ms-Persona-primaryText', styles.primaryText),
-          onRenderPrimaryText) }
-        { this._renderElement(
-          this.props.secondaryText,
-          css('ms-Persona-secondaryText', styles.secondaryText),
-          onRenderSecondaryText) }
-        { this._renderElement(
-          this.props.tertiaryText,
-          css('ms-Persona-tertiaryText', styles.tertiaryText),
-          onRenderTertiaryText) }
-        { this._renderElement(
-          this.props.optionalText,
-          css('ms-Persona-optionalText', styles.optionalText),
-          onRenderOptionalText) }
-        { this.props.children }
-      </div>
-    );
-
-    return (
-      <div
-        { ...divProps }
-        className={
-          css('ms-Persona',
-            styles.root,
-            className,
-            PERSONA_SIZE[size],
-            PERSONA_PRESENCE[presence as PersonaPresenceEnum],
-            showSecondaryText && styles.showSecondaryText
-          )
-        }
-        style={ coinSize ? { height: coinSize, minWidth: coinSize } : undefined }
-      >
-        <PersonaCoin { ...personaCoinProps } />
-        { (!hidePersonaDetails || (size === PersonaSize.size10 || size === PersonaSize.tiny)) && personaDetails }
-      </div>
-    );
-  }
+import { PersonaBase } from './Persona.base';
+import { getStyles } from './Persona.styles';
 
-  @autobind
-  private _renderElement(text: string | undefined, className: string, render?: IRenderFunction<IPersonaProps>): JSX.Element {
-    return (
-      <div className={ className }>
-        { render
-          ? render(this.props)
-          : text && (<TooltipHost
-            content={ text }
-            overflowMode={ TooltipOverflowMode.Parent }
-            directionalHint={ DirectionalHint.topLeftEdge }
-          >
-            { text }
-          </TooltipHost>)
-        }
-      </div>
-    );
-  }
-}
+export const Persona = styled<IPersonaProps, IPersonaStyleProps, IPersonaStyles>(
+  PersonaBase,
+  getStyles
+);
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts b/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts
index 78c8507daa729..eb0ee0d442acb 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts
@@ -1,13 +1,15 @@
 import * as React from 'react';
 import { IRenderFunction } from '../../Utilities';
-import { Persona } from './Persona';
+import { PersonaBase } from './Persona.base';
 import { ImageLoadState } from '../../Image';
+import { IStyle, ITheme } from '../../Styling';
+import { IStyleFunction } from '../../Utilities';
 
 export interface IPersona {
 
 }
 
-export interface IPersonaProps extends React.HTMLAttributes<Persona> {
+export interface IPersonaProps extends React.HTMLAttributes<PersonaBase> {
   /**
    * Optional callback to access the IPersona interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
@@ -139,6 +141,16 @@ export interface IPersonaProps extends React.HTMLAttributes<Persona> {
    * Optional HTML element props for Persona coin.
    */
   coinProps?: React.HTMLAttributes<HTMLDivElement>;
+
+  /**
+   * Call to provide customized styling that will layer on top of variant rules
+   */
+  getStyles?: IStyleFunction<IPersonaStyleProps, IPersonaStyles>;
+
+  /**
+   * Theme provided by HOC.
+   */
+  theme?: ITheme;
 }
 
 export enum PersonaSize {
@@ -224,3 +236,19 @@ export enum PersonaInitialsColor {
    */
   transparent = 15,
 }
+
+export interface IPersonaStyleProps {
+  /**
+   * Theme.
+   */
+  theme: ITheme;
+
+  /**
+   * Custom class name.
+   */
+  className?: string;
+}
+
+export interface IPersonaStyles {
+  root: IStyle;
+}
diff --git a/packages/office-ui-fabric-react/src/components/Persona/index.ts b/packages/office-ui-fabric-react/src/components/Persona/index.ts
index 02000b4bd6c32..26d2f1fddaa4e 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/index.ts
@@ -1,4 +1,5 @@
 export * from './Persona';
+export * from './Persona.base';
 export * from './Persona.types';
 export * from './PersonaConsts';
 export * from './PersonaCoin';

From 9c45eeb414025b84b4cb91555e6d42a2a14110f0 Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Tue, 27 Feb 2018 16:34:37 -0800
Subject: [PATCH 1462/1641] SplitButton: Fix SPACE/ENTER so that it executes
 the primary button (#4127)

* Fix splitButton. The downArrow issues still exists in this push

* add disabled functionality

* use the props.onClick instead of the buttonProps.onClick

* update the change to make buttons only execute on ENTER of the whole splitButton, the tabstop and expand command are unresolved and outside the scope of this change

* revret example change and rush change

* remove the as any  on the spread
---
 ...-SplitButtonFixClick_2018-02-27-23-14.json | 11 ++++++++++
 .../src/components/Button/BaseButton.tsx      | 22 ++++++++++++-------
 2 files changed, 25 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-SplitButtonFixClick_2018-02-27-23-14.json

diff --git a/common/changes/office-ui-fabric-react/jspurlin-SplitButtonFixClick_2018-02-27-23-14.json b/common/changes/office-ui-fabric-react/jspurlin-SplitButtonFixClick_2018-02-27-23-14.json
new file mode 100644
index 0000000000000..0bf3265b8a86f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-SplitButtonFixClick_2018-02-27-23-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SplitButton: ENTER/SPACE should execute the primary button when focus is on the whole splitButton",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 12e16ba182dcb..6bf90c3ba70a0 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -88,7 +88,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       variantClassName,
       theme,
       getClassNames
-         } = this.props;
+    } = this.props;
 
     const { menuProps } = this.state;
     // Button is disabled if the whole button (in case of splitbutton is disabled) or if the primary action is disabled
@@ -223,7 +223,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     } = props;
 
     const Content = (
-      <Tag {...buttonProps }>
+      <Tag { ...buttonProps }>
         <div className={ this._classNames.flexContainer } >
           { onRenderIcon(props, this._onRenderIcon) }
           { this._onRenderTextContents() }
@@ -251,12 +251,12 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   private _onRenderIcon(buttonProps?: IButtonProps, defaultRender?: IRenderFunction<IButtonProps>): JSX.Element | null {
     const {
       iconProps
-       } = this.props;
+    } = this.props;
 
     if (iconProps) {
       return (
         <Icon
-          {...iconProps}
+          { ...iconProps }
           className={ this._classNames.icon }
         />
       );
@@ -335,7 +335,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   @autobind
   private _onRenderDescription(props: IButtonProps) {
     const {
-    description
+      description
     } = this.props;
 
     // ms-Button-description is only shown when the button type is compound.
@@ -393,7 +393,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       <ContextualMenu
         id={ this._labelId + '-menu' }
         directionalHint={ DirectionalHint.bottomLeftEdge }
-        {...menuProps}
+        { ...menuProps }
         className={ 'ms-BaseButton-menuhost ' + menuProps.className }
         target={ this._isSplitButton ? this._splitButtonContainer : this._buttonElement }
         labelElementId={ this._labelId }
@@ -419,7 +419,9 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       styles = {},
       disabled,
       checked,
-      getSplitButtonClassNames
+      getSplitButtonClassNames,
+      onClick,
+      primaryDisabled
     } = this.props;
 
     const classNames = getSplitButtonClassNames ? getSplitButtonClassNames(
@@ -431,6 +433,8 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         !!this.state.menuProps,
         !!checked);
 
+    buttonProps = { ...buttonProps, onClick: undefined };
+
     return (
       <div
         role={ 'button' }
@@ -443,6 +447,8 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         className={ classNames && classNames.splitButtonContainer }
         onKeyDown={ this._onMenuKeyDown }
         ref={ this._resolveRef('_splitButtonContainer') }
+        data-is-focusable={ true }
+        onClick={ !disabled && !primaryDisabled ? onClick : undefined }
       >
         <span
           style={ { 'display': 'flex' } }
@@ -489,7 +495,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       'aria-expanded': this._isExpanded
     };
 
-    return <BaseButton {...splitButtonProps} onMouseDown={ this._onMouseDown } />;
+    return <BaseButton { ...splitButtonProps } onMouseDown={ this._onMouseDown } />;
 
   }
 

From 7bca7c0c026347a291702321fe1dba988e8f9806 Mon Sep 17 00:00:00 2001
From: Jordan Janzen <jordancjanzen@gmail.com>
Date: Tue, 27 Feb 2018 17:10:39 -0800
Subject: [PATCH 1463/1641] Dialog: Converting to mergeStyles part 1.2 - sub
 component file structure. (#4119)

* Round 1.2 on converting to mergeStyles.
- Move Dialog to DialogBase
- Create Dialog.styles
- Create new interfaces

* npm run change output

* Also convert subcomponents
- DialogContent convert to base + styled component.
- DialogFooter convert to base + styled component.
- Export new base components

* Change from using root since these are the root components.

* npm run change output
---
 ...Styles-Dialog-round1_2018-02-21-00-19.json |  11 ++
 ...Styles-Dialog-round1_2018-02-27-19-41.json |  11 ++
 .../components/Dialog/DialogContent.base.tsx  | 102 ++++++++++++++++
 .../components/Dialog/DialogContent.styles.ts |  28 +++++
 .../src/components/Dialog/DialogContent.tsx   | 113 ++----------------
 .../components/Dialog/DialogContent.types.ts  |  39 +++++-
 .../components/Dialog/DialogFooter.base.tsx   |  22 ++++
 .../components/Dialog/DialogFooter.styles.ts  |  28 +++++
 .../src/components/Dialog/DialogFooter.tsx    |  33 ++---
 .../components/Dialog/DialogFooter.types.ts   |  52 ++++++++
 .../src/components/Dialog/index.ts            |   5 +-
 11 files changed, 319 insertions(+), 125 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-21-00-19.json
 create mode 100644 common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-27-19-41.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Dialog/DialogContent.base.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Dialog/DialogContent.styles.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.base.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.styles.ts
 create mode 100644 packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.types.ts

diff --git a/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-21-00-19.json b/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-21-00-19.json
new file mode 100644
index 0000000000000..2f42ad25a4d29
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-21-00-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Convert Dialog to mergeStyles, part 1 - file structure",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-jojanz@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-27-19-41.json b/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-27-19-41.json
new file mode 100644
index 0000000000000..432979d1b7f38
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-27-19-41.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dialog: Converting to mergeStyles part 1.2 - sub component file structure. ",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-jojanz@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.base.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.base.tsx
new file mode 100644
index 0000000000000..f5e48022f320b
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.base.tsx
@@ -0,0 +1,102 @@
+import * as React from 'react';
+import {
+  BaseComponent,
+  css,
+} from '../../Utilities';
+import { IDialogContentProps, DialogType } from './DialogContent.types';
+import { IconButton } from '../../Button';
+import { DialogFooter } from './DialogFooter';
+import { withResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
+import * as stylesImport from './Dialog.scss';
+const styles: any = stylesImport;
+
+@withResponsiveMode
+export class DialogContentBase extends BaseComponent<IDialogContentProps, {}> {
+
+  public static defaultProps: IDialogContentProps = {
+    showCloseButton: false,
+    className: '',
+    topButtonsProps: [],
+    closeButtonAriaLabel: 'Close'
+  };
+
+  constructor(props: IDialogContentProps) {
+    super(props);
+  }
+
+  public render() {
+    const {
+      showCloseButton,
+      closeButtonAriaLabel,
+      onDismiss,
+      subTextId,
+      subText,
+      titleId,
+      title,
+      type
+    } = this.props;
+
+    const groupings = this._groupChildren();
+    let subTextContent;
+    if (subText) {
+      subTextContent = <p className={ css('ms-Dialog-subText', styles.subText) } id={ subTextId }>{ subText }</p>;
+    }
+
+    const contentClassName = css(this.props.className, {
+      ['ms-Dialog--lgHeader ' + styles.isLargeHeader]: type === DialogType.largeHeader,
+      ['ms-Dialog--close ' + styles.isClose]: type === DialogType.close,
+    });
+
+    return (
+      <div className={ css(contentClassName) }>
+        <div className={ css('ms-Dialog-header', styles.header) }>
+          <p className={ css('ms-Dialog-title', styles.title) } id={ titleId } role='heading'>{ title }</p>
+          <div className={ css('ms-Dialog-topButton', styles.topButton) }>
+            { this.props.topButtonsProps!.map((props) => (
+              <IconButton { ...props } />
+            )) }
+            { (type === DialogType.close || (showCloseButton && type !== DialogType.largeHeader)) &&
+              <IconButton
+                className={ css(
+                  'ms-Dialog-button ms-Dialog-button--close',
+                  styles.button
+                ) }
+                iconProps={ { iconName: 'Cancel' } }
+                ariaLabel={ closeButtonAriaLabel }
+                onClick={ onDismiss as any }
+              />
+            }
+          </div>
+        </div>
+        <div className={ css('ms-Dialog-inner', styles.inner) }>
+          <div className={ css('ms-Dialog-content', styles.content, this.props.className) }>
+            { subTextContent }
+            { groupings.contents }
+          </div>
+          { groupings.footers }
+        </div>
+      </div>
+    );
+  }
+
+  // @TODO - typing the footers as an array of DialogFooter is difficult because
+  // casing "child as DialogFooter" causes a problem because
+  // "Neither type 'ReactElement<any>' nor type 'DialogFooter' is assignable to the other."
+  private _groupChildren(): { footers: any[]; contents: any[]; } {
+
+    const groupings: { footers: any[]; contents: any[]; } = {
+      footers: [],
+      contents: []
+    };
+
+    React.Children.map(this.props.children, child => {
+      if (typeof child === 'object' && child !== null && child.type === DialogFooter) {
+        groupings.footers.push(child);
+      } else {
+        groupings.contents.push(child);
+      }
+    });
+
+    return groupings;
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.styles.ts b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.styles.ts
new file mode 100644
index 0000000000000..ae71671428f36
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.styles.ts
@@ -0,0 +1,28 @@
+import { IDialogContentStyleProps, IDialogContentStyles } from './DialogContent.types';
+import {
+  IStyle,
+  ITheme,
+} from '../../Styling';
+
+export const getStyles = (
+  props: IDialogContentStyleProps
+): IDialogContentStyles => {
+  const {
+    className,
+    theme,
+  } = props;
+
+  const { palette, semanticColors } = theme;
+
+  return ({
+    content: [
+      'ms-DialogContent',
+      {
+        // Insert css properties
+
+      }
+    ],
+
+    // Insert className styles
+  });
+};
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx
index 59aa872b81f14..69ce32c19d5cf 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.tsx
@@ -1,102 +1,13 @@
-import * as React from 'react';
+import { styled } from '../../Utilities';
 import {
-  BaseComponent,
-  css,
-} from '../../Utilities';
-import { IDialogContentProps, DialogType } from './DialogContent.types';
-import { IconButton } from '../../Button';
-import { DialogFooter } from './DialogFooter';
-import { withResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
-import * as stylesImport from './Dialog.scss';
-const styles: any = stylesImport;
-
-@withResponsiveMode
-export class DialogContent extends BaseComponent<IDialogContentProps, {}> {
-
-  public static defaultProps: IDialogContentProps = {
-    showCloseButton: false,
-    className: '',
-    topButtonsProps: [],
-    closeButtonAriaLabel: 'Close'
-  };
-
-  constructor(props: IDialogContentProps) {
-    super(props);
-  }
-
-  public render() {
-    const {
-      showCloseButton,
-      closeButtonAriaLabel,
-      onDismiss,
-      subTextId,
-      subText,
-      titleId,
-      title,
-      type
-    } = this.props;
-
-    const groupings = this._groupChildren();
-    let subTextContent;
-    if (subText) {
-      subTextContent = <p className={ css('ms-Dialog-subText', styles.subText) } id={ subTextId }>{ subText }</p>;
-    }
-
-    const contentClassName = css(this.props.className, {
-      ['ms-Dialog--lgHeader ' + styles.isLargeHeader]: type === DialogType.largeHeader,
-      ['ms-Dialog--close ' + styles.isClose]: type === DialogType.close,
-    });
-
-    return (
-      <div className={ css(contentClassName) }>
-        <div className={ css('ms-Dialog-header', styles.header) }>
-          <p className={ css('ms-Dialog-title', styles.title) } id={ titleId } role='heading'>{ title }</p>
-          <div className={ css('ms-Dialog-topButton', styles.topButton) }>
-            { this.props.topButtonsProps!.map((props) => (
-              <IconButton {...props} />
-            )) }
-            { (type === DialogType.close || (showCloseButton && type !== DialogType.largeHeader)) &&
-              <IconButton
-                className={ css(
-                  'ms-Dialog-button ms-Dialog-button--close',
-                  styles.button
-                ) }
-                iconProps={ { iconName: 'Cancel' } }
-                ariaLabel={ closeButtonAriaLabel }
-                onClick={ onDismiss as any }
-              />
-            }
-          </div>
-        </div>
-        <div className={ css('ms-Dialog-inner', styles.inner) }>
-          <div className={ css('ms-Dialog-content', styles.content, this.props.className) }>
-            { subTextContent }
-            { groupings.contents }
-          </div>
-          { groupings.footers }
-        </div>
-      </div>
-    );
-  }
-
-  // @TODO - typing the footers as an array of DialogFooter is difficult because
-  // casing "child as DialogFooter" causes a problem because
-  // "Neither type 'ReactElement<any>' nor type 'DialogFooter' is assignable to the other."
-  private _groupChildren(): { footers: any[]; contents: any[]; } {
-
-    const groupings: { footers: any[]; contents: any[]; } = {
-      footers: [],
-      contents: []
-    };
-
-    React.Children.map(this.props.children, child => {
-      if (typeof child === 'object' && child !== null && child.type === DialogFooter) {
-        groupings.footers.push(child);
-      } else {
-        groupings.contents.push(child);
-      }
-    });
-
-    return groupings;
-  }
-}
+  IDialogContentProps,
+  IDialogContentStyleProps,
+  IDialogContentStyles
+} from './DialogContent.types';
+import { DialogContentBase } from './DialogContent.base';
+import { getStyles } from './DialogContent.styles';
+
+export const DialogContent = styled<IDialogContentProps, IDialogContentStyleProps, IDialogContentStyles>(
+  DialogContentBase,
+  getStyles
+);
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.types.ts b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.types.ts
index c0e4799f7ede9..927151886a8d3 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.types.ts
@@ -1,19 +1,31 @@
 import * as React from 'react';
-import { DialogContent } from './DialogContent';
+import { DialogContentBase } from './DialogContent.base';
 import { IButtonProps } from '../Button/Button.types';
 import { ResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
+import { IStyle, ITheme } from '../../Styling';
+import { IStyleFunction } from '../../Utilities';
 
 export interface IDialogContent {
 
 }
 
-export interface IDialogContentProps extends React.Props<DialogContent> {
+export interface IDialogContentProps extends React.Props<DialogContentBase> {
   /**
   * Optional callback to access the IDialogContent interface. Use this instead of ref for accessing
   * the public methods and properties of the component.
   */
   componentRef?: (component: IDialogContent) => void;
 
+  /**
+   * Call to provide customized styling that will layer on top of the variant rules
+   */
+  getStyles?: IStyleFunction<IDialogContentStyleProps, IDialogContentStyles>;
+
+  /**
+   * Theme provided by HOC.
+   */
+  theme?: ITheme;
+
   /**
   * Show an 'x' close button in the upper-right corner
   */
@@ -80,3 +92,26 @@ export enum DialogType {
   /** Dialog with an 'x' close button in the upper-right corner */
   close = 2
 }
+
+export interface IDialogContentStyleProps {
+  /**
+   * Accept theme prop.
+   */
+  theme: ITheme;
+
+  /**
+   * Accept custom classNames
+   */
+  className?: string;
+
+  // Insert DialogContent style props below
+}
+
+export interface IDialogContentStyles {
+  /**
+   * Style for the root element.
+   */
+  content?: IStyle;
+
+  // Insert DialogContent classNames below
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.base.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.base.tsx
new file mode 100644
index 0000000000000..7583d6fb5a190
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.base.tsx
@@ -0,0 +1,22 @@
+import * as React from 'react';
+import { BaseComponent, css } from '../../Utilities';
+import * as stylesImport from './Dialog.scss';
+const styles: any = stylesImport;
+
+export class DialogFooterBase extends BaseComponent<any, any> {
+  public render() {
+    return (
+      <div className={ css('ms-Dialog-actions', styles.actions) }>
+        <div className={ css('ms-Dialog-actionsRight', styles.actionsRight) }>
+          { this._renderChildrenAsActions() }
+        </div>
+      </div>
+    );
+  }
+
+  private _renderChildrenAsActions() {
+    return React.Children.map(this.props.children, child =>
+      child && <span className={ css('ms-Dialog-action', styles.action) }>{ child }</span>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.styles.ts b/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.styles.ts
new file mode 100644
index 0000000000000..b7e339e359d90
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.styles.ts
@@ -0,0 +1,28 @@
+import { IDialogFooterStyleProps, IDialogFooterStyles } from './DialogFooter.types';
+import {
+  IStyle,
+  ITheme,
+} from '../../Styling';
+
+export const getStyles = (
+  props: IDialogFooterStyleProps
+): IDialogFooterStyles => {
+  const {
+    className,
+    theme,
+  } = props;
+
+  const { palette, semanticColors } = theme;
+
+  return ({
+    actions: [
+      'ms-Dialog-actions',
+      {
+        // Insert css properties
+
+      }
+    ],
+
+    // Insert className styles
+  });
+};
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.tsx
index ea5498de8b0a6..04d46577f184c 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.tsx
@@ -1,22 +1,13 @@
-import * as React from 'react';
-import { BaseComponent, css } from '../../Utilities';
-import * as stylesImport from './Dialog.scss';
-const styles: any = stylesImport;
+import { styled } from '../../Utilities';
+import {
+  IDialogFooterProps,
+  IDialogFooterStyleProps,
+  IDialogFooterStyles
+} from './DialogFooter.types';
+import { DialogFooterBase } from './DialogFooter.base';
+import { getStyles } from './DialogFooter.styles';
 
-export class DialogFooter extends BaseComponent<any, any> {
-  public render() {
-    return (
-      <div className={ css('ms-Dialog-actions', styles.actions) }>
-        <div className={ css('ms-Dialog-actionsRight', styles.actionsRight) }>
-          { this._renderChildrenAsActions() }
-        </div>
-      </div>
-    );
-  }
-
-  private _renderChildrenAsActions() {
-    return React.Children.map(this.props.children, child =>
-      child && <span className={ css('ms-Dialog-action', styles.action) }>{ child }</span>
-    );
-  }
-}
+export const DialogFooter = styled<IDialogFooterProps, IDialogFooterStyleProps, IDialogFooterStyles>(
+  DialogFooterBase,
+  getStyles
+);
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.types.ts b/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.types.ts
new file mode 100644
index 0000000000000..2882c8ac10a15
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.types.ts
@@ -0,0 +1,52 @@
+import * as React from 'react';
+import { DialogFooterBase } from './DialogFooter.base';
+import { IStyle, ITheme } from '../../Styling';
+import { IStyleFunction } from '../../Utilities';
+
+export interface IDialogFooterProps extends React.Props<DialogFooterBase> {
+  /**
+   * Gets the component ref.
+   */
+  componentRef?: (component: IDialogFooterProps) => void;
+
+  /**
+   * Call to provide customized styling that will layer on top of the variant rules
+   */
+  getStyles?: IStyleFunction<IDialogFooterStyleProps, IDialogFooterStyles>;
+
+  /**
+   * Theme provided by HOC.
+   */
+  theme?: ITheme;
+
+  /**
+   * Additional css class to apply to the DialogFooter
+   * @defaultvalue undefined
+   */
+  className?: string;
+
+  // Insert DialogFooter props below
+}
+
+export interface IDialogFooterStyleProps {
+  /**
+   * Accept theme prop.
+   */
+  theme: ITheme;
+
+  /**
+   * Accept custom classNames
+   */
+  className?: string;
+
+  // Insert DialogFooter style props below
+}
+
+export interface IDialogFooterStyles {
+  /**
+   * Style for the root element.
+   */
+  actions?: IStyle;
+
+  // Insert DialogFooter classNames below
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/index.ts b/packages/office-ui-fabric-react/src/components/Dialog/index.ts
index 565c09db9a331..ca9daf37d811c 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/index.ts
@@ -1,6 +1,9 @@
 export * from './Dialog';
 export * from './Dialog.base';
 export * from './DialogContent';
+export * from './DialogContent.base';
 export * from './DialogFooter';
+export * from './DialogFooter.base';
 export * from './Dialog.types';
-export * from './DialogContent.types';
\ No newline at end of file
+export * from './DialogContent.types';
+export * from './DialogFooter.types';
\ No newline at end of file

From 73aecd3ccd644dfe85cdc31d0291c51756336550 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 28 Feb 2018 11:15:46 +0000
Subject: [PATCH 1464/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...lMenuFixSubmenuHover_2018-02-27-20-46.json | 11 ------
 ...-SplitButtonFixClick_2018-02-27-23-14.json | 11 ------
 ...Styles-Dialog-round1_2018-02-21-00-19.json | 11 ------
 ...Styles-Dialog-round1_2018-02-27-19-41.json | 11 ------
 ...omponent-restructure_2018-02-27-17-42.json | 11 ------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 36 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 16 ++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 14 files changed, 58 insertions(+), 63 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-ContextualMenuFixSubmenuHover_2018-02-27-20-46.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-SplitButtonFixClick_2018-02-27-23-14.json
 delete mode 100644 common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-21-00-19.json
 delete mode 100644 common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-27-19-41.json
 delete mode 100644 common/changes/office-ui-fabric-react/miwhea-persona-styled-component-restructure_2018-02-27-17-42.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 7a68b761ca92d..de37e67427736 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.55.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.56.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index b16ee95586db3..8095a7860cb82 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.55.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.56.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 04af02758e3d8..bb0e5fddff471 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.55.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.56.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 27a434c2dd7c3..89e347c9b9ae7 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.55.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.56.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index f24c95d50de48..37efbcaeebfb2 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.55.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.56.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/office-ui-fabric-react/jspurlin-ContextualMenuFixSubmenuHover_2018-02-27-20-46.json b/common/changes/office-ui-fabric-react/jspurlin-ContextualMenuFixSubmenuHover_2018-02-27-20-46.json
deleted file mode 100644
index 7ee1aa1c06d9e..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-ContextualMenuFixSubmenuHover_2018-02-27-20-46.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: Update Hover/Focus Behavior around expanding/collapsing Submenus",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-SplitButtonFixClick_2018-02-27-23-14.json b/common/changes/office-ui-fabric-react/jspurlin-SplitButtonFixClick_2018-02-27-23-14.json
deleted file mode 100644
index 0bf3265b8a86f..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-SplitButtonFixClick_2018-02-27-23-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SplitButton: ENTER/SPACE should execute the primary button when focus is on the whole splitButton",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-21-00-19.json b/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-21-00-19.json
deleted file mode 100644
index 2f42ad25a4d29..0000000000000
--- a/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-21-00-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Convert Dialog to mergeStyles, part 1 - file structure",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-jojanz@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-27-19-41.json b/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-27-19-41.json
deleted file mode 100644
index 432979d1b7f38..0000000000000
--- a/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round1_2018-02-27-19-41.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dialog: Converting to mergeStyles part 1.2 - sub component file structure. ",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-jojanz@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/miwhea-persona-styled-component-restructure_2018-02-27-17-42.json b/common/changes/office-ui-fabric-react/miwhea-persona-styled-component-restructure_2018-02-27-17-42.json
deleted file mode 100644
index c430398c88bbf..0000000000000
--- a/common/changes/office-ui-fabric-react/miwhea-persona-styled-component-restructure_2018-02-27-17-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Prepare Persona for conversion to merge-styles",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mike@mikewheaton.ca"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 9be3e2a6eb346..60191dfc57cab 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.55.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.56.0 <6.0.0",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 0205918b38a03..d72c27056101a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,42 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.56.0",
+      "tag": "office-ui-fabric-react_v5.56.0",
+      "date": "Wed, 28 Feb 2018 11:15:45 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "216f8e4d021b235926cb81dcbdbf7b6b95e5c5ac",
+            "comment": "ContextualMenu: Update Hover/Focus Behavior around expanding/collapsing Submenus"
+          },
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "9c45eeb414025b84b4cb91555e6d42a2a14110f0",
+            "comment": "SplitButton: ENTER/SPACE should execute the primary button when focus is on the whole splitButton"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Jordan Janzen <jordancjanzen@gmail.com>",
+            "commit": "7bca7c0c026347a291702321fe1dba988e8f9806",
+            "comment": "Convert Dialog to mergeStyles, part 1 - file structure"
+          },
+          {
+            "author": "Jordan Janzen <jordancjanzen@gmail.com>",
+            "commit": "7bca7c0c026347a291702321fe1dba988e8f9806",
+            "comment": "Dialog: Converting to mergeStyles part 1.2 - sub component file structure. "
+          },
+          {
+            "author": "Mike Wheaton <miwhea@microsoft.com>",
+            "commit": "d00d49f4b69e2ec7b3313997a4d45adb1f520b34",
+            "comment": "Prepare Persona for conversion to merge-styles"
+          }
+        ]
+      }
+    },
     {
       "version": "5.55.3",
       "tag": "office-ui-fabric-react_v5.55.3",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index f5c6e2aa6ee3f..d90947c61d366 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,20 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 27 Feb 2018 22:56:59 GMT and should not be manually modified.
+This log was last generated on Wed, 28 Feb 2018 11:15:45 GMT and should not be manually modified.
+
+## 5.56.0
+Wed, 28 Feb 2018 11:15:45 GMT
+
+### Minor changes
+
+- Convert Dialog to mergeStyles, part 1 - file structure
+- Dialog: Converting to mergeStyles part 1.2 - sub component file structure. 
+- Prepare Persona for conversion to merge-styles
+
+### Patches
+
+- ContextualMenu: Update Hover/Focus Behavior around expanding/collapsing Submenus
+- SplitButton: ENTER/SPACE should execute the primary button when focus is on the whole splitButton
 
 ## 5.55.3
 Tue, 27 Feb 2018 22:56:59 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 3edf5b94319f9..fc5928ce50096 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.55.3",
+  "version": "5.56.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From badbe01c65d5d37fc81c372567d16a9e796ccbec Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Wed, 28 Feb 2018 08:37:18 -0800
Subject: [PATCH 1465/1641] CoachMarkStyles: Use ... instead of assign for IE
 compatibility" (#4130)

* don't use assign as it breaks ie

* add change file
---
 .../fix-coachmark-assign_2018-02-28-02-15.json        | 11 +++++++++++
 .../src/components/Coachmark/Coachmark.styles.ts      |  9 ++++++---
 2 files changed, 17 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-coachmark-assign_2018-02-28-02-15.json

diff --git a/common/changes/office-ui-fabric-react/fix-coachmark-assign_2018-02-28-02-15.json b/common/changes/office-ui-fabric-react/fix-coachmark-assign_2018-02-28-02-15.json
new file mode 100644
index 0000000000000..75f6393c43a7b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-coachmark-assign_2018-02-28-02-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "CoachMarkStyles: Use ... instead of assign for IE compatibility",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.styles.ts b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.styles.ts
index 58164a257efb8..f540190426e01 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.styles.ts
@@ -131,9 +131,12 @@ function continuousPulseStepFour(beaconColorTwo: string): IRawStyle {
 }
 
 function continuousPulseStepFive(beaconColorOne: string): IRawStyle {
-  return Object.assign(continuousPulseStepOne(beaconColorOne), {
-    opacity: '0'
-  });
+  return {
+    ...continuousPulseStepOne(beaconColorOne),
+    ...{
+      opacity: '0'
+    }
+  };
 }
 
 export const translateOne: string = keyframes({

From e9df9df2972e5b1fb90cb1c1499c5ceb65cffa7c Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Wed, 28 Feb 2018 10:37:59 -0800
Subject: [PATCH 1466/1641] GroupedList: Fixed chevron animation (#4123)

* GroupedList: Fix chevron animation

* Change file
---
 .../master_2018-02-27-21-34.json                      | 11 +++++++++++
 .../src/components/GroupedList/GroupHeader.scss       |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/master_2018-02-27-21-34.json

diff --git a/common/changes/office-ui-fabric-react/master_2018-02-27-21-34.json b/common/changes/office-ui-fabric-react/master_2018-02-27-21-34.json
new file mode 100644
index 0000000000000..1aee84591be51
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2018-02-27-21-34.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "GroupedList: Chevron css no longer uses ms-icon",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss
index 95d538e49e2fc..2ea4a621299e3 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss
@@ -73,7 +73,7 @@ $groupHeader-ease-in-back: cubic-bezier(0.600, -0.280, 0.735, 0.045);
   color: $ms-color-neutralSecondary;
   padding-top: 4px;
 
-  :global(.ms-Icon) {
+  :global(i) {
     transform: rotate(-180deg);
     transform-origin: 50% 50%;
     transition: transform .1s linear;

From 0ad60de8393214b064e8c98e458336f7c163bf86 Mon Sep 17 00:00:00 2001
From: Alex Bettadapur <alexbettadapur@gmail.com>
Date: Wed, 28 Feb 2018 10:39:45 -0800
Subject: [PATCH 1467/1641] AutoFill: Component should also listen to onInput,
 just like the other input components do (#4129)

* Autofill should use oninput

* Changefile

* Use both handlers

* Autofill

* Update comment

* Update tests and snapshots

* Update snapshots
---
 ...lebet-autofillOnInput_2018-02-27-23-57.json | 11 +++++++++++
 .../src/components/Autofill/Autofill.test.tsx  | 14 +++++++-------
 .../src/components/Autofill/Autofill.tsx       | 13 +++++++++++--
 .../src/components/ComboBox/ComboBox.test.tsx  | 18 +++++++++---------
 .../__snapshots__/ComboBox.test.tsx.snap       |  1 +
 .../src/components/pickers/BasePicker.test.tsx | 10 +++++-----
 .../__snapshots__/BasePicker.test.tsx.snap     |  2 ++
 7 files changed, 46 insertions(+), 23 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/alebet-autofillOnInput_2018-02-27-23-57.json

diff --git a/common/changes/office-ui-fabric-react/alebet-autofillOnInput_2018-02-27-23-57.json b/common/changes/office-ui-fabric-react/alebet-autofillOnInput_2018-02-27-23-57.json
new file mode 100644
index 0000000000000..eaf77f9c93381
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/alebet-autofillOnInput_2018-02-27-23-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix an issue on IE11 where Autofill would swallow some keystrokes if typing quickly enough",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "alebet@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.test.tsx b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.test.tsx
index c70c381eb2c75..ba4d319b9c480 100644
--- a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.test.tsx
@@ -41,7 +41,7 @@ describe('Autofill', () => {
       baseNode
     );
     autoFillInput.value = 'hel';
-    ReactTestUtils.Simulate.change(autoFillInput);
+    ReactTestUtils.Simulate.input(autoFillInput);
     ReactDOM.render(
       <Autofill
         ref={ (c) => autoFill = c! }
@@ -61,7 +61,7 @@ describe('Autofill', () => {
     };
 
     autoFillInput.value = 'hep';
-    ReactTestUtils.Simulate.change(autoFillInput);
+    ReactTestUtils.Simulate.input(autoFillInput);
     ReactDOM.render(
       <Autofill
         ref={ (c) => autoFill = c! }
@@ -70,12 +70,12 @@ describe('Autofill', () => {
       />,
       baseNode
     );
-    ReactTestUtils.Simulate.change(autoFillInput);
+    ReactTestUtils.Simulate.input(autoFillInput);
   });
 
   it('does not autofill if left or right arrow has been pressed', () => {
     autoFillInput.value = 'hel';
-    ReactTestUtils.Simulate.change(autoFillInput);
+    ReactTestUtils.Simulate.input(autoFillInput);
 
     ReactDOM.render(
       <Autofill
@@ -91,7 +91,7 @@ describe('Autofill', () => {
     // If we don't the change event will cause the current input value, 'hello', to be set.
     autoFillInput.value = 'hel';
 
-    ReactTestUtils.Simulate.change(autoFillInput);
+    ReactTestUtils.Simulate.input(autoFillInput);
 
     expect(autoFill.value).toBe('hel');
     expect(autoFill.inputElement.value).toBe('hel');
@@ -99,7 +99,7 @@ describe('Autofill', () => {
 
   it('will autofill if keyCode up or down is pressed', () => {
     autoFillInput.value = 'hel';
-    ReactTestUtils.Simulate.change(autoFillInput);
+    ReactTestUtils.Simulate.input(autoFillInput);
 
     ReactDOM.render(
       <Autofill
@@ -118,7 +118,7 @@ describe('Autofill', () => {
 
     ReactTestUtils.Simulate.keyDown(autoFillInput, { keyCode: KeyCodes.up, which: KeyCodes.up });
     autoFillInput.value = 'hel';
-    ReactTestUtils.Simulate.change(autoFillInput);
+    ReactTestUtils.Simulate.input(autoFillInput);
 
     ReactDOM.render(
       <Autofill
diff --git a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx
index b578d383131e5..2f682eb269969 100644
--- a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx
+++ b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx
@@ -123,7 +123,8 @@ export class Autofill extends BaseComponent<IAutofillProps, IAutofillState> impl
         autoComplete={ 'off' }
         onCompositionStart={ this._onCompositionStart }
         onCompositionEnd={ this._onCompositionEnd }
-        onChange={ this._onChange }
+        onChange={ this._onChanged }
+        onInput={ this._onInputChanged }
         onKeyDown={ this._onKeyDown }
         onClick={ this.props.onClick ? this.props.onClick : this._onClick }
         data-lpignore={ true }
@@ -199,13 +200,21 @@ export class Autofill extends BaseComponent<IAutofillProps, IAutofillState> impl
   }
 
   @autobind
-  private _onChange(ev: React.FormEvent<HTMLElement>) {
+  private _onInputChanged(ev: React.FormEvent<HTMLElement>) {
     const value: string = this._getCurrentInputValue(ev);
+
     // Right now typing does not have isComposing, once that has been fixed any should be removed.
     this._tryEnableAutofill(value, this._value, (ev.nativeEvent as any).isComposing);
     this._updateValue(value);
   }
 
+  @autobind
+  private _onChanged(): void {
+    // Swallow this event, we don't care about it
+    // We must provide it because React PropTypes marks it as required, but onInput serves the correct purpose
+    return;
+  }
+
   private _getCurrentInputValue(ev?: React.FormEvent<HTMLElement>): string {
     if (ev && ev.target && (ev.target as any).value) {
       return (ev.target as any).value;
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
index 53caf0245275f..7d13111c2878e 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
@@ -119,7 +119,7 @@ describe('ComboBox', () => {
       />);
     comboBoxRoot = wrapper.find('.ms-ComboBox');
     inputElement = comboBoxRoot.find('input');
-    inputElement.simulate('change', { target: { value: 'f' } });
+    inputElement.simulate('input', { target: { value: 'f' } });
     inputElement.simulate('keydown', { which: KeyCodes.enter });
     expect((comboBoxComponent as React.Component<any, any>).state.currentOptions.length).toEqual(DEFAULT_OPTIONS.length);
   });
@@ -141,7 +141,7 @@ describe('ComboBox', () => {
       />);
     comboBoxRoot = wrapper.find('.ms-ComboBox');
     inputElement = comboBoxRoot.find('input');
-    inputElement.simulate('change', { target: { value: 'f' } });
+    inputElement.simulate('input', { target: { value: 'f' } });
     inputElement.simulate('keydown', { which: KeyCodes.enter });
     const currentOptions = (comboBoxComponent as React.Component<any, any>).state.currentOptions;
     expect(currentOptions.length).toEqual(DEFAULT_OPTIONS.length + 1);
@@ -209,7 +209,7 @@ describe('ComboBox', () => {
         allowFreeform={ true }
       />);
 
-    wrapper.find('input').simulate('change', { target: { value: 'f' } });
+    wrapper.find('input').simulate('input', { target: { value: 'f' } });
     wrapper.update();
     expect(wrapper.find('input').props().value).toEqual('Foo');
   });
@@ -224,7 +224,7 @@ describe('ComboBox', () => {
         allowFreeform={ false }
       />);
 
-    wrapper.find('input').simulate('change', { target: { value: 'f' } });
+    wrapper.find('input').simulate('input', { target: { value: 'f' } });
     wrapper.update();
     expect(wrapper.find('input').props().value).toEqual('Foo');
   });
@@ -238,7 +238,7 @@ describe('ComboBox', () => {
         autoComplete='off'
         allowFreeform={ true }
       />);
-    wrapper.find('input').simulate('change', { target: { value: 'f' } });
+    wrapper.find('input').simulate('input', { target: { value: 'f' } });
     wrapper.update();
     expect(wrapper.find('input').props().value).toEqual('f');
   });
@@ -364,10 +364,10 @@ describe('ComboBox', () => {
       />);
     comboBoxRoot = wrapper.find('.ms-ComboBox');
     inputElement = comboBoxRoot.find('input');
-    inputElement.simulate('change', { target: { value: 't' } });
-    inputElement.simulate('change', { target: { value: 'e' } });
-    inputElement.simulate('change', { target: { value: 'x' } });
-    inputElement.simulate('change', { target: { value: 't' } });
+    inputElement.simulate('input', { target: { value: 't' } });
+    inputElement.simulate('input', { target: { value: 'e' } });
+    inputElement.simulate('input', { target: { value: 'x' } });
+    inputElement.simulate('input', { target: { value: 't' } });
     inputElement.simulate('keydown', { which: KeyCodes.enter });
     expect(executionCount).toEqual(1);
     expect(updatedOption).toEqual(initialOption);
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
index 2531bea9cb933..fb135d862487e 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
@@ -142,6 +142,7 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
       onCompositionEnd={[Function]}
       onCompositionStart={[Function]}
       onFocus={[Function]}
+      onInput={[Function]}
       onKeyDown={[Function]}
       onKeyUp={[Function]}
       readOnly={true}
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
index 87425792e1fbf..c984c30e5b123 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.test.tsx
@@ -82,7 +82,7 @@ describe('Pickers', () => {
       input.focus();
       input.value = 'bl';
 
-      ReactTestUtils.Simulate.change(input);
+      ReactTestUtils.Simulate.input(input);
 
       const suggestions = document.querySelector('.ms-Suggestions') as HTMLInputElement;
 
@@ -114,7 +114,7 @@ describe('Pickers', () => {
       let input = document.querySelector('.ms-BasePicker-input') as HTMLInputElement;
       input.focus();
       input.value = 'bl';
-      ReactTestUtils.Simulate.change(input);
+      ReactTestUtils.Simulate.input(input);
 
       const suggestionOptions = document.querySelectorAll('.ms-Suggestions-itemButton');
       ReactTestUtils.Simulate.click(suggestionOptions[0]);
@@ -191,7 +191,7 @@ describe('Pickers', () => {
       input.focus();
       input.value = 'bl';
 
-      ReactTestUtils.Simulate.change(input);
+      ReactTestUtils.Simulate.input(input);
 
       const suggestions = document.querySelector('.ms-Suggestions') as HTMLInputElement;
 
@@ -221,7 +221,7 @@ describe('Pickers', () => {
 
       input.focus();
       input.value = 'bl';
-      ReactTestUtils.Simulate.change(input);
+      ReactTestUtils.Simulate.input(input);
 
       const suggestionOptions = document.querySelectorAll('.ms-Suggestions-itemButton');
 
@@ -262,7 +262,7 @@ describe('Pickers', () => {
 
       input.focus();
       input.value = 'bl';
-      ReactTestUtils.Simulate.change(input);
+      ReactTestUtils.Simulate.input(input);
 
       const suggestionOptions = document.querySelectorAll('.ms-Suggestions-itemButton');
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
index f6694b3f2bc5e..2b6940311702f 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
@@ -56,6 +56,7 @@ exports[`Pickers BasePicker renders BasePicker correctly 1`] = `
           onCompositionEnd={[Function]}
           onCompositionStart={[Function]}
           onFocus={[Function]}
+          onInput={[Function]}
           onKeyDown={[Function]}
           role="combobox"
           value=""
@@ -122,6 +123,7 @@ exports[`Pickers TagPicker renders TagPicker correctly 1`] = `
           onCompositionEnd={[Function]}
           onCompositionStart={[Function]}
           onFocus={[Function]}
+          onInput={[Function]}
           onKeyDown={[Function]}
           role="combobox"
           value=""

From 8370f6f5c822189fbd84e13fb285df83b102a308 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Wed, 28 Feb 2018 15:03:55 -0800
Subject: [PATCH 1468/1641] Website: Left nav scroll improvements (#4132)

* Using absolute position instead of calc fixed top for nav (jitter)

* Loading component for style pages, too

* Rework of app-wrapper and better app-nav positioning

* extra null check

* Using vh in css for nav height

* Webpack config path that loads component pages

* Min height for app content

* Fixes for vh

* Added change file
---
 .../src/components/App/App.scss               | 16 +++++---------
 .../fabric-website/src/components/App/App.tsx | 10 ++++-----
 .../src/components/App/AppState.tsx           | 21 +++++++++++++++++--
 .../fabric-website/src/styles/_variables.scss |  1 +
 .../webpack.uhf.serve.config.js               | 12 ++++++-----
 .../left-nav-scrollfix_2018-02-28-18-49.json  | 11 ++++++++++
 6 files changed, 47 insertions(+), 24 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/left-nav-scrollfix_2018-02-28-18-49.json

diff --git a/apps/fabric-website/src/components/App/App.scss b/apps/fabric-website/src/components/App/App.scss
index 39a95b8a63796..247d3048affa8 100644
--- a/apps/fabric-website/src/components/App/App.scss
+++ b/apps/fabric-website/src/components/App/App.scss
@@ -4,18 +4,17 @@
 :global {
   // Element that wraps everything except for the header
   .App-wrapper {
-    display: flex;
-    flex-direction: column;
     margin: 0 auto;
     max-width: $App-maximumWidth;
+    position: relative;
   }
 
   // Nav is hidden off screen by default
   .App-nav {
     -webkit-overflow-scrolling: touch; // Improves scrolling performance
     overflow-y: auto;
-    position: fixed;
-    top: $Header-height;
+    max-height: 100vh;
+    height: 100vh; // fallback height if not set in JS style attribute
     width: $Nav-width;
     @include ms-float(left);
     z-index: 999; // This z-index needs to be high to prevent jittery scrolling in Edge.
@@ -24,11 +23,11 @@
   .App-content {
     @include contentPadding();
     background-color: $ms-color-neutralLighter;
-    flex-grow: 1;
     left: 0;
     overflow: hidden;
     position: relative;
     transition: all $ms-animation-duration-2 $ms-animation-ease-1;
+    min-height: calc(100vh - #{$Header-height-full-uhf});
 
     @include high-contrast {
       border-right: 1px solid WindowText;
@@ -46,19 +45,14 @@
       @include ms-padding-left($App-padding-left-lg);
     }
 
-    .App-wrapper {
-      flex-direction: row;
-    }
-
     .App-nav {
-      top: $Header-height*2;
+      top: 0;
       bottom: 0;
       overflow-y: auto;
       overflow-x: hidden;
     }
 
     .App-content {
-      flex-grow: unset;
       max-width: calc(100% - #{$Nav-width}); // IE needs max-width, it was ignoring width
       width: calc(100% - #{$Nav-width});
       @include ms-left($Nav-width);
diff --git a/apps/fabric-website/src/components/App/App.tsx b/apps/fabric-website/src/components/App/App.tsx
index 5611b0d616a57..e8f2ddcc33876 100644
--- a/apps/fabric-website/src/components/App/App.tsx
+++ b/apps/fabric-website/src/components/App/App.tsx
@@ -43,12 +43,10 @@ export class App extends React.Component<IAppProps, any> {
 
   public render() {
     let { navHeight } = this.state;
-    let appContentTop = this._appContentRect ? this._appContentRect.top : 100;
-    // Using appContentTop as a reference to match instead of 'unset' because it does not work in IE.
-    let navTop: string = this.state.isAttached ? '0' : appContentTop.toString();
+    let navPosition: 'fixed' | 'absolute' = this.state.isAttached ? 'fixed' : 'absolute';
     let navStyle = {
-      top: navTop,
-      height: navHeight
+      height: navHeight,
+      position: navPosition
     };
 
     return (
@@ -80,7 +78,7 @@ export class App extends React.Component<IAppProps, any> {
   @autobind
   private _handleNavPositioning() {
     let { isAttached, navHeight } = this.state;
-    this._appContentRect = this._appContent.getBoundingClientRect();
+    this._appContentRect = this._appContent && this._appContent.getBoundingClientRect();
     const viewPortHeight = window.innerHeight;
     isAttached = AttachedScrollUtility.shouldComponentAttach(isAttached, this._attachedScrollThreshold);
     navHeight = this._calculateNavHeight(viewPortHeight, this._appContentRect, navHeight);
diff --git a/apps/fabric-website/src/components/App/AppState.tsx b/apps/fabric-website/src/components/App/AppState.tsx
index 91d89f2426659..e7ab867cda10d 100644
--- a/apps/fabric-website/src/components/App/AppState.tsx
+++ b/apps/fabric-website/src/components/App/AppState.tsx
@@ -11,15 +11,23 @@ export interface IAppState {
 }
 
 // Giving the loading component a height so that the left nav loads in full screen and there is less flashing as the component page loads.
+const loadingPageHeight: string = 'calc(100vh - 100px)';
 const LoadingComponent = (props: any): JSX.Element => {
   return (
-    <div style={ { height: '1500px' } }>
+    <div style={ { height: loadingPageHeight } }>
       <ComponentPage>
         <PageHeader pageTitle={ props.title } backgroundColor='#038387' />
       </ComponentPage>
     </div>
   );
 };
+const StylesLoadingComponent = (props: any): JSX.Element => {
+  return (
+    <div style={ { height: loadingPageHeight } }>
+      <PageHeader pageTitle={ props.title } backgroundColor='#006f94' />
+    </div>
+  );
+};
 
 export const AppState: IAppState = {
   appTitle: 'Office UI Fabric',
@@ -49,47 +57,56 @@ export const AppState: IAppState = {
         {
           title: 'Animations',
           url: '#/styles/animations',
+          component: () => <StylesLoadingComponent title='Animations' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Styles/AnimationsPage/AnimationsPage').AnimationsPage))
         },
         {
           title: 'Brand icons',
           url: '#/styles/brand-icons',
+          component: () => <StylesLoadingComponent title='Brand icons' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Styles/BrandIconsPage/BrandIconsPage').BrandIconsPage))
         },
         {
           title: 'Colors',
           url: '#/styles/colors',
+          component: () => <StylesLoadingComponent title='Colors' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Styles/ColorsPage/ColorsPage').ColorsPage))
         },
         {
           title: 'Icons',
           url: '#/styles/icons',
+          component: () => <StylesLoadingComponent title='Icons' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Styles/IconsPage/IconsPage').IconsPage))
         },
         {
           title: 'Layout',
           url: '#/styles/layout',
+          component: () => <StylesLoadingComponent title='Layout' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Styles/LayoutPage/LayoutPage').LayoutPage))
         },
         {
           title: 'Localization',
           url: '#/styles/localization',
+          component: () => <StylesLoadingComponent title='Localization' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Styles/LocalizationPage/LocalizationPage').LocalizationPage))
         },
         {
-          title: 'Beta Theme Generator',
+          title: 'Beta theme generator',
           url: '#/styles/themeGenerator',
           isHiddenFromMainNav: true,
+          component: () => <StylesLoadingComponent title='Beta theme generator' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Styles/ThemeGeneratorToolPage/ThemeGeneratorToolPage').ThemeGeneratorToolPage))
         },
         {
           title: 'Typography',
           url: '#/styles/typography',
+          component: () => <StylesLoadingComponent title='Typography' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Styles/TypographyPage/TypographyPage').TypographyPage))
         },
         {
           title: 'Utilities',
           url: '#/styles/utilities',
+          component: () => <StylesLoadingComponent title='Utilities' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Styles/UtilitiesPage/UtilitiesPage').UtilitiesPage))
         }
       ]
diff --git a/apps/fabric-website/src/styles/_variables.scss b/apps/fabric-website/src/styles/_variables.scss
index bff860e6ce658..c1860a81bec57 100644
--- a/apps/fabric-website/src/styles/_variables.scss
+++ b/apps/fabric-website/src/styles/_variables.scss
@@ -59,6 +59,7 @@ $CodeBlock-toggleButtonHeight: 28px;
 
 $Header-backgroundColor: $ms-color-black;
 $Header-height: 50px;
+$Header-height-full-uhf: $Header-height*2;
 
 $Nav-width: 208px;
 
diff --git a/apps/fabric-website/webpack.uhf.serve.config.js b/apps/fabric-website/webpack.uhf.serve.config.js
index 4e0fa2d8a562c..a88cccf14be92 100644
--- a/apps/fabric-website/webpack.uhf.serve.config.js
+++ b/apps/fabric-website/webpack.uhf.serve.config.js
@@ -14,20 +14,22 @@ const version = require('./package.json').version;
 const isProduction = process.argv.indexOf('--production') > -1;
 const minFileNamePart = isProduction ? '.min' : '';
 const entryPointFilename = 'fabric-sitev5';
+const devServer = {
+  host: HOST_NAME,
+  disableHostCheck: true,
+  port: 4324
+}
 
 module.exports = resources.createServeConfig({
   entry: './src/root.tsx',
   output: {
     filename: entryPointFilename + '.js',
     path: path.join(__dirname, 'dist'),
-    publicPath: '/dist/',
+    publicPath: 'http://'+ HOST_NAME +':' + devServer.port + '/dist/',
     chunkFilename: `${entryPointFilename}-${version}-[name]${minFileNamePart}.js`
   },
 
-  devServer: {
-    host: HOST_NAME,
-    disableHostCheck: true
-  },
+  devServer: devServer,
 
   externals: {
     'react': 'React',
diff --git a/common/changes/@uifabric/fabric-website/left-nav-scrollfix_2018-02-28-18-49.json b/common/changes/@uifabric/fabric-website/left-nav-scrollfix_2018-02-28-18-49.json
new file mode 100644
index 0000000000000..654282c3aa91a
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/left-nav-scrollfix_2018-02-28-18-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Improved left nav scroll behavior and added fix to webpack so that we can load component pages from our local machines with the UHF.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From c3ffd9fb8ef675a0ef341feaef28797c23b9dcdd Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 28 Feb 2018 15:48:49 -0800
Subject: [PATCH 1469/1641] FocusZone: isDefaultPrevented is now respected
 (#4133)

* Moving isDefaultPrevented check out of the keydown block! Weird!

* Adding test.

* Adding change file.
---
 .../fix-focuszone_2018-02-28-19-08.json       | 11 +++++
 .../components/FocusZone/FocusZone.test.tsx   | 43 +++++++++++++++++++
 .../src/components/FocusZone/FocusZone.tsx    |  7 +--
 3 files changed, 58 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-focuszone_2018-02-28-19-08.json

diff --git a/common/changes/office-ui-fabric-react/fix-focuszone_2018-02-28-19-08.json b/common/changes/office-ui-fabric-react/fix-focuszone_2018-02-28-19-08.json
new file mode 100644
index 0000000000000..f4a6ce62ac0a0
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-focuszone_2018-02-28-19-08.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "FocusZone: isDefaultPrevented is now respected.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
index 6f684867186a9..b2d17481e63ef 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
@@ -144,6 +144,49 @@ describe('FocusZone', () => {
     expect(lastFocusedElement).toBe(buttonC);
   });
 
+  it('can ignore arrowing if default is prevented', () => {
+    const component = ReactTestUtils.renderIntoDocument(
+      <div { ...{ onFocusCapture: _onFocus } }>
+        <FocusZone direction={ FocusZoneDirection.vertical }>
+          <button className='a'>a</button>
+          <button className='b'>b</button>
+        </FocusZone>
+      </div>
+    );
+
+    const focusZone = ReactDOM.findDOMNode(component as React.ReactInstance).firstChild as Element;
+
+    const buttonA = focusZone.querySelector('.a') as HTMLElement;
+    const buttonB = focusZone.querySelector('.b') as HTMLElement;
+
+    // Assign bounding locations to buttons.
+    setupElement(buttonA, {
+      clientRect: {
+        top: 0,
+        bottom: 30,
+        left: 0,
+        right: 100
+      }
+    });
+
+    setupElement(buttonB, {
+      clientRect: {
+        top: 30,
+        bottom: 60,
+        left: 0,
+        right: 100
+      }
+    });
+
+    // Focus the first button.
+    ReactTestUtils.Simulate.focus(buttonA);
+    expect(lastFocusedElement).toBe(buttonA);
+
+    // Pressing down should go to b.
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down, isDefaultPrevented: () => true } as any);
+    expect(lastFocusedElement).toBe(buttonA);
+  });
+
   it('can use arrows horizontally', () => {
     const component = ReactTestUtils.renderIntoDocument(
       <div { ...{ onFocusCapture: _onFocus } }>
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index ebb576fa1663e..99b028c149f56 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -310,10 +310,11 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
     if (this.props.onKeyDown) {
       this.props.onKeyDown(ev);
+    }
 
-      if (ev.isDefaultPrevented()) {
-        return;
-      }
+    // If the default has been prevented, do not process keyboard events.
+    if (ev.isDefaultPrevented()) {
+      return;
     }
 
     if (

From 1e766db267dcc15e44b671952ade61151e93d331 Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Wed, 28 Feb 2018 15:56:59 -0800
Subject: [PATCH 1470/1641] Import Unstyled Component for Layer, Nav, Image,
 ScrollablePane, ResizeGroup,  and Rating (#4135)

* added base file import to index files

* rush change
---
 .../import-componentbases_2018-02-28-20-18.json       | 11 +++++++++++
 .../src/components/Image/index.ts                     |  1 +
 .../src/components/Layer/index.ts                     |  1 +
 .../src/components/Nav/index.ts                       |  1 +
 .../src/components/Rating/index.ts                    |  1 +
 .../src/components/ResizeGroup/index.ts               |  1 +
 .../src/components/ScrollablePane/index.ts            |  1 +
 7 files changed, 17 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/import-componentbases_2018-02-28-20-18.json

diff --git a/common/changes/office-ui-fabric-react/import-componentbases_2018-02-28-20-18.json b/common/changes/office-ui-fabric-react/import-componentbases_2018-02-28-20-18.json
new file mode 100644
index 0000000000000..e0445a06c4466
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/import-componentbases_2018-02-28-20-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added index import for base files in Layer, Nav, Image, ScrollablePane, ResizeGroup, and Rating components so unstyled component can be used.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Image/index.ts b/packages/office-ui-fabric-react/src/components/Image/index.ts
index 7ce5fb2695f75..bffd3cbd24a1a 100644
--- a/packages/office-ui-fabric-react/src/components/Image/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Image/index.ts
@@ -1,2 +1,3 @@
 export * from './Image';
+export * from './Image.base';
 export * from './Image.types';
diff --git a/packages/office-ui-fabric-react/src/components/Layer/index.ts b/packages/office-ui-fabric-react/src/components/Layer/index.ts
index f30c19d62bfd1..127b16899475f 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Layer/index.ts
@@ -1,3 +1,4 @@
 export * from './Layer';
+export * from './Layer.base';
 export * from './Layer.types';
 export * from './LayerHost';
diff --git a/packages/office-ui-fabric-react/src/components/Nav/index.ts b/packages/office-ui-fabric-react/src/components/Nav/index.ts
index b80f279c0d1f0..e9a8a31652a63 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Nav/index.ts
@@ -1,2 +1,3 @@
 export * from './Nav';
+export * from './Nav.base';
 export * from './Nav.types';
diff --git a/packages/office-ui-fabric-react/src/components/Rating/index.ts b/packages/office-ui-fabric-react/src/components/Rating/index.ts
index cb6acba281af4..0f3fc18b47341 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Rating/index.ts
@@ -1,2 +1,3 @@
 export * from './Rating';
+export * from './Rating.base';
 export * from './Rating.types';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/index.ts b/packages/office-ui-fabric-react/src/components/ResizeGroup/index.ts
index 40c9ea942c650..6384dae9307d6 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/index.ts
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/index.ts
@@ -1,2 +1,3 @@
 export * from './ResizeGroup';
+export * from './ResizeGroup.base';
 export * from './ResizeGroup.types';
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/index.ts b/packages/office-ui-fabric-react/src/components/ScrollablePane/index.ts
index cbbef7d04f0e7..de05800a56cc2 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/index.ts
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/index.ts
@@ -1,2 +1,3 @@
 export * from './ScrollablePane';
+export * from './ScrollablePane.base';
 export * from './ScrollablePane.types';

From fadba83e75ad6775a2c3423385b152fe0828ad08 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 1 Mar 2018 00:05:10 +0000
Subject: [PATCH 1471/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 19 ++++++++++++
 apps/fabric-website/CHANGELOG.md              |  9 +++++-
 apps/fabric-website/package.json              |  4 +--
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../left-nav-scrollfix_2018-02-28-18-49.json  | 11 -------
 ...DetailsListFocusTest_2018-02-24-00-36.json | 11 -------
 ...ebet-autofillOnInput_2018-02-27-23-57.json | 11 -------
 ...fix-coachmark-assign_2018-02-28-02-15.json | 11 -------
 .../fix-focuszone_2018-02-28-19-08.json       | 11 -------
 .../master_2018-02-27-21-34.json              | 11 -------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 29 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 12 +++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 17 files changed, 75 insertions(+), 76 deletions(-)
 delete mode 100644 common/changes/@uifabric/fabric-website/left-nav-scrollfix_2018-02-28-18-49.json
 delete mode 100644 common/changes/@uifabric/fabric-website/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
 delete mode 100644 common/changes/office-ui-fabric-react/alebet-autofillOnInput_2018-02-27-23-57.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-coachmark-assign_2018-02-28-02-15.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-focuszone_2018-02-28-19-08.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2018-02-27-21-34.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index b0107ed45ac45..3cc611bae3ba6 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.3.2",
+      "tag": "@uifabric/fabric-website_v5.3.2",
+      "date": "Thu, 01 Mar 2018 00:05:10 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "8370f6f5c822189fbd84e13fb285df83b102a308",
+            "comment": "Improved left nav scroll behavior and added fix to webpack so that we can load component pages from our local machines with the UHF."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.56.0 <6.0.0` to `>=5.56.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.3.1",
       "tag": "@uifabric/fabric-website_v5.3.1",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 660e664b42705..81b1f54c6e8ed 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Fri, 16 Feb 2018 11:23:29 GMT and should not be manually modified.
+This log was last generated on Thu, 01 Mar 2018 00:05:10 GMT and should not be manually modified.
+
+## 5.3.2
+Thu, 01 Mar 2018 00:05:10 GMT
+
+### Patches
+
+- Improved left nav scroll behavior and added fix to webpack so that we can load component pages from our local machines with the UHF.
 
 ## 5.3.1
 Fri, 16 Feb 2018 11:23:29 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index de37e67427736..1642af95fbe6f 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.3.1",
+  "version": "5.3.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.56.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.56.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 8095a7860cb82..d231e9c12f031 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.56.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.56.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index bb0e5fddff471..9df2fb30d024f 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.56.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.56.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 89e347c9b9ae7..ef599e0cd4803 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.56.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.56.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 37efbcaeebfb2..efe97ed80d6a6 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.56.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.56.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/@uifabric/fabric-website/left-nav-scrollfix_2018-02-28-18-49.json b/common/changes/@uifabric/fabric-website/left-nav-scrollfix_2018-02-28-18-49.json
deleted file mode 100644
index 654282c3aa91a..0000000000000
--- a/common/changes/@uifabric/fabric-website/left-nav-scrollfix_2018-02-28-18-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Improved left nav scroll behavior and added fix to webpack so that we can load component pages from our local machines with the UHF.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json b/common/changes/@uifabric/fabric-website/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
deleted file mode 100644
index 71c75f3436166..0000000000000
--- a/common/changes/@uifabric/fabric-website/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/alebet-autofillOnInput_2018-02-27-23-57.json b/common/changes/office-ui-fabric-react/alebet-autofillOnInput_2018-02-27-23-57.json
deleted file mode 100644
index eaf77f9c93381..0000000000000
--- a/common/changes/office-ui-fabric-react/alebet-autofillOnInput_2018-02-27-23-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix an issue on IE11 where Autofill would swallow some keystrokes if typing quickly enough",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "alebet@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-coachmark-assign_2018-02-28-02-15.json b/common/changes/office-ui-fabric-react/fix-coachmark-assign_2018-02-28-02-15.json
deleted file mode 100644
index 75f6393c43a7b..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-coachmark-assign_2018-02-28-02-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "CoachMarkStyles: Use ... instead of assign for IE compatibility",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-focuszone_2018-02-28-19-08.json b/common/changes/office-ui-fabric-react/fix-focuszone_2018-02-28-19-08.json
deleted file mode 100644
index f4a6ce62ac0a0..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-focuszone_2018-02-28-19-08.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "FocusZone: isDefaultPrevented is now respected.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2018-02-27-21-34.json b/common/changes/office-ui-fabric-react/master_2018-02-27-21-34.json
deleted file mode 100644
index 1aee84591be51..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2018-02-27-21-34.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "GroupedList: Chevron css no longer uses ms-icon",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 60191dfc57cab..de28ee3457b29 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.56.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.56.1 <6.0.0",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index d72c27056101a..f3a8dee56775f 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,35 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.56.1",
+      "tag": "office-ui-fabric-react_v5.56.1",
+      "date": "Thu, 01 Mar 2018 00:05:10 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Alex Bettadapur <alexbettadapur@gmail.com>",
+            "commit": "0ad60de8393214b064e8c98e458336f7c163bf86",
+            "comment": "Fix an issue on IE11 where Autofill would swallow some keystrokes if typing quickly enough"
+          },
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "badbe01c65d5d37fc81c372567d16a9e796ccbec",
+            "comment": "CoachMarkStyles: Use ... instead of assign for IE compatibility"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "c3ffd9fb8ef675a0ef341feaef28797c23b9dcdd",
+            "comment": "FocusZone: isDefaultPrevented is now respected."
+          },
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "e9df9df2972e5b1fb90cb1c1499c5ceb65cffa7c",
+            "comment": "GroupedList: Chevron css no longer uses ms-icon"
+          }
+        ]
+      }
+    },
     {
       "version": "5.56.0",
       "tag": "office-ui-fabric-react_v5.56.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index d90947c61d366..619a5f2602e08 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,16 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 28 Feb 2018 11:15:45 GMT and should not be manually modified.
+This log was last generated on Thu, 01 Mar 2018 00:05:10 GMT and should not be manually modified.
+
+## 5.56.1
+Thu, 01 Mar 2018 00:05:10 GMT
+
+### Patches
+
+- Fix an issue on IE11 where Autofill would swallow some keystrokes if typing quickly enough
+- CoachMarkStyles: Use ... instead of assign for IE compatibility
+- FocusZone: isDefaultPrevented is now respected.
+- GroupedList: Chevron css no longer uses ms-icon
 
 ## 5.56.0
 Wed, 28 Feb 2018 11:15:45 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index fc5928ce50096..d86d13c9643ba 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.56.0",
+  "version": "5.56.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 9b0294ad0bc1c2cfcd0b9d680f5a62e3bef6f27e Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Wed, 28 Feb 2018 17:10:12 -0800
Subject: [PATCH 1472/1641] ResizeGroup SCSS to MergeStyles Part 2: Style
 Conversion (#4072)

* convert scss to mergeStyles

* rush change

* updated snapshots

* update experiments snapshots

* temp fix for shallow test with decorator usage

* added shallowUntilTarget function to Utilities for use with decorated components

* cleanup

* moved shallowUntilTarget into fabrics common folder

* clean up imports

* remove scss

* added base to index

* shallowUntilTarget default shallow functionality

* removing base from index so styles are not optional

* moved measured styles to inline

* updated snapshots

* missing semicolon

* updated experiments snapshots
---
 ...izegroup-scss2ms-pt2_2018-02-22-21-19.json | 11 ++++
 .../__snapshots__/CommandBar.test.tsx.snap    | 15 ++++-
 .../src/common/shallowUntilTarget.ts          | 65 +++++++++++++++++++
 .../__snapshots__/Breadcrumb.test.tsx.snap    | 28 ++++++--
 .../ResizeGroup/ResizeGroup.base.tsx          | 22 +++++--
 .../components/ResizeGroup/ResizeGroup.scss   | 11 ----
 .../ResizeGroup/ResizeGroup.styles.ts         | 11 ++--
 .../ResizeGroup/ResizeGroup.test.tsx          | 10 +--
 .../__snapshots__/ResizeGroup.test.tsx.snap   | 15 ++++-
 9 files changed, 153 insertions(+), 35 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/resizegroup-scss2ms-pt2_2018-02-22-21-19.json
 create mode 100644 packages/office-ui-fabric-react/src/common/shallowUntilTarget.ts
 delete mode 100644 packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.scss

diff --git a/common/changes/office-ui-fabric-react/resizegroup-scss2ms-pt2_2018-02-22-21-19.json b/common/changes/office-ui-fabric-react/resizegroup-scss2ms-pt2_2018-02-22-21-19.json
new file mode 100644
index 0000000000000..6b0e4d9bb90cf
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/resizegroup-scss2ms-pt2_2018-02-22-21-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Converting ResizeGroup SCSS to MergeStyles step 2 - style converstion",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap b/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
index 75d5b04109162..fc2bf3471f617 100644
--- a/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
+++ b/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
@@ -2,10 +2,21 @@
 
 exports[`CommandBar renders commands correctly 1`] = `
 <div
-  className="ms-ResizeGroup TestClassName"
+  className=
+      ms-ResizeGroup
+      TestClassName
+      {
+        display: block;
+        position: relative;
+      }
 >
   <div
-    className=""
+    style={
+      Object {
+        "position": "fixed",
+        "visibility": "hidden",
+      }
+    }
   >
     <div
       className=
diff --git a/packages/office-ui-fabric-react/src/common/shallowUntilTarget.ts b/packages/office-ui-fabric-react/src/common/shallowUntilTarget.ts
new file mode 100644
index 0000000000000..ab7f089ef06a3
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/common/shallowUntilTarget.ts
@@ -0,0 +1,65 @@
+import { shallow, ShallowWrapper } from 'enzyme';
+
+/**
+ * Duplicated enzyme's ShallowRendererProps
+ *
+ * @internal
+ */
+export interface IShallowRendererProps {
+  lifecycleExperimental?: boolean;
+  disableLifecycleMethods?: boolean;
+}
+
+/**
+ * ShallowUntilTarget Interface
+ *
+ * @internal
+ */
+export interface IShallowUntilTarget {
+  maxTries: number;
+  shallowOptions: IShallowRendererProps;
+}
+
+/**
+ * An extention of enzyme's shallow function which will fail to work
+ * with decorated components and/or components using the styled() function.
+ * This function allows you to pass a 'target' component (e.g. ComponentBase)
+ * and keep running shallow on each child component till a match is found.
+ *
+ * @public
+ */
+export function shallowUntilTarget<P, S>(
+  componentInstance: React.ReactElement<P>,
+  TargetComponent: string,
+  options: IShallowUntilTarget = {
+    maxTries: 10,
+    shallowOptions: {}
+  }
+): ShallowWrapper {
+  const { maxTries, shallowOptions } = options;
+
+  let root = shallow<P, S>(componentInstance, shallowOptions);
+
+  if (typeof root.type() === 'string' || root.type().toString().includes(TargetComponent)) {
+    // Default shallow()
+    // If type() is a string then it's a DOM Node.
+    // If it were wrapped, it would be a React component.
+    return root;
+  }
+
+  for (let tries = 1; tries <= maxTries; tries++) {
+    // Check for target as a string to avoid conflicts
+    // with decoratored components name
+    if (root.type().toString().includes(TargetComponent)) {
+      // Now that we found the target component, render it.
+      return root.first().shallow(shallowOptions);
+    }
+    // Unwrap the next component in the hierarchy.
+    root = root.first().shallow(shallowOptions);
+  }
+
+  throw new Error(
+    `Could not find ${TargetComponent} in React instance: ${componentInstance};
+    gave up after ${maxTries} tries`
+  );
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
index b4f337bfab5ce..c8203ad83af05 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
@@ -2,10 +2,20 @@
 
 exports[`Breadcrumb renders breadcumb correctly 1`] = `
 <div
-  className="ms-ResizeGroup"
+  className=
+      ms-ResizeGroup
+      {
+        display: block;
+        position: relative;
+      }
 >
   <div
-    className=""
+    style={
+      Object {
+        "position": "fixed",
+        "visibility": "hidden",
+      }
+    }
   >
     <div
       aria-label={undefined}
@@ -146,10 +156,20 @@ exports[`Breadcrumb renders breadcumb correctly 1`] = `
 
 exports[`Breadcrumb renders breadcumb correctly 2`] = `
 <div
-  className="ms-ResizeGroup"
+  className=
+      ms-ResizeGroup
+      {
+        display: block;
+        position: relative;
+      }
 >
   <div
-    className=""
+    style={
+      Object {
+        "position": "fixed",
+        "visibility": "hidden",
+      }
+    }
   >
     <div
       aria-label={undefined}
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.base.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.base.tsx
index c51f005d893c7..e0cb64aa6f8e5 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.base.tsx
@@ -2,13 +2,18 @@ import * as React from 'react';
 import * as PropTypes from 'prop-types';
 import {
   BaseComponent,
+  classNamesFunction,
   css,
+  customizable,
   divProperties,
   getNativeProps,
   provideContext
 } from '../../Utilities';
-import { IResizeGroupProps } from './ResizeGroup.types';
-import * as styles from './ResizeGroup.scss';
+import {
+  IResizeGroupProps,
+  IResizeGroupStyles,
+  IResizeGroupStyleProps
+} from './ResizeGroup.types';
 
 const RESIZE_DELAY = 16;
 
@@ -284,6 +289,9 @@ const MeasuredContext = provideContext({
   return { isMeasured: true };
 });
 
+const getClassNames = classNamesFunction<IResizeGroupStyleProps, IResizeGroupStyles>();
+
+@customizable('ResizeGroup', ['theme'])
 export class ResizeGroupBase extends BaseComponent<IResizeGroupProps, IResizeGroupState> {
   private _nextResizeGroupStateProvider = getNextResizeGroupStateProvider();
   private _root: HTMLElement;
@@ -299,14 +307,18 @@ export class ResizeGroupBase extends BaseComponent<IResizeGroupProps, IResizeGro
   }
 
   public render() {
-    const { onRenderData, className } = this.props;
+    const { onRenderData, className, getStyles, theme } = this.props;
     const { dataToMeasure, renderedData } = this.state;
     const divProps = getNativeProps(this.props, divProperties, ['data']);
+    const classNames = getClassNames(getStyles!, { theme: theme!, className });
 
     return (
-      <div { ...divProps } className={ css('ms-ResizeGroup', className) } ref={ this._resolveRef('_root') }>
+      <div { ...divProps } className={ classNames.root } ref={ this._resolveRef('_root') }>
         { this._nextResizeGroupStateProvider.shouldRenderDataToMeasureInHiddenDiv(dataToMeasure) && (
-          <div className={ css(styles.measured) } ref={ this._resolveRef('_measured') }>
+          <div
+            style={ { position: 'fixed', visibility: 'hidden' } }
+            ref={ this._resolveRef('_measured') }
+          >
             <MeasuredContext>{ onRenderData(dataToMeasure) }</MeasuredContext>
           </div>
         ) }
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.scss b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.scss
deleted file mode 100644
index 01306c7f803c7..0000000000000
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.scss
+++ /dev/null
@@ -1,11 +0,0 @@
-@import '../../common/common';
-
-.root {
-  display: block;
-  position: relative;
-}
-
-.measured {
-  position: fixed;
-  visibility: hidden;
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.styles.ts b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.styles.ts
index c9414e6fbc4e9..c4457138bd593 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.styles.ts
@@ -18,11 +18,10 @@ export const getStyles = (
     root: [
       'ms-ResizeGroup',
       {
-        // Insert css properties
-
-      }
-    ],
-
-    // Insert className styles
+        display: 'block',
+        position: 'relative'
+      },
+      className
+    ]
   });
 };
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
index cb680a34f805b..8e04e842d4889 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.test.tsx
@@ -1,8 +1,8 @@
 import * as React from 'react';
-import { shallow } from 'enzyme';
+import { shallowUntilTarget } from '../../common/shallowUntilTarget';
 
 import { ResizeGroup } from './ResizeGroup';
-import { ResizeGroupBase, IResizeGroupState, getNextResizeGroupStateProvider, getMeasurementCache } from './ResizeGroup.base';
+import { IResizeGroupState, getNextResizeGroupStateProvider, getMeasurementCache } from './ResizeGroup.base';
 import { IResizeGroupProps } from './ResizeGroup.types';
 import * as sinon from 'sinon';
 import * as renderer from 'react-test-renderer';
@@ -45,13 +45,13 @@ describe('ResizeGroup', () => {
     const renderedDataId = 'onRenderDataId';
     const onRenderData = (data: any) => <div id={ renderedDataId }> Rendered data: { data.content }</div >;
 
-    const wrapper = shallow<IResizeGroupProps, IResizeGroupState>(
-      <ResizeGroupBase
+    const wrapper = shallowUntilTarget<IResizeGroupProps, IResizeGroupState>(
+      <ResizeGroup
         data={ initialData }
         onReduceData={ onReduceScalingData }
         onRenderData={ onRenderData }
       />
-    );
+      , 'ResizeGroupBase');
 
     expect(wrapper.containsMatchingElement(onRenderData(initialData))).toEqual(true);
   });
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/__snapshots__/ResizeGroup.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ResizeGroup/__snapshots__/ResizeGroup.test.tsx.snap
index 4cfbc5ed5880d..a52674c25e684 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/__snapshots__/ResizeGroup.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/__snapshots__/ResizeGroup.test.tsx.snap
@@ -2,10 +2,21 @@
 
 exports[`ResizeGroup renders the ResizeGroup correctly 1`] = `
 <div
-  className="ms-ResizeGroup TestClassName"
+  className=
+      ms-ResizeGroup
+      TestClassName
+      {
+        display: block;
+        position: relative;
+      }
 >
   <div
-    className=""
+    style={
+      Object {
+        "position": "fixed",
+        "visibility": "hidden",
+      }
+    }
   >
     <div
       id="onRenderDataId"

From b6527fb5181bc2f6c118533cfbdd04ffa4c3dee9 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 1 Mar 2018 11:12:54 +0000
Subject: [PATCH 1473/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...mport-componentbases_2018-02-28-20-18.json | 11 -----------
 ...izegroup-scss2ms-pt2_2018-02-22-21-19.json | 11 -----------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 11 files changed, 35 insertions(+), 30 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/import-componentbases_2018-02-28-20-18.json
 delete mode 100644 common/changes/office-ui-fabric-react/resizegroup-scss2ms-pt2_2018-02-22-21-19.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 1642af95fbe6f..f263385990efc 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.56.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.57.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index d231e9c12f031..05388d1653669 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.56.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.57.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 9df2fb30d024f..a66de073f8c48 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.56.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.57.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index ef599e0cd4803..8d761b14afed7 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.56.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.57.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index efe97ed80d6a6..f03cc39812a95 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.56.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.57.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.6.2",
diff --git a/common/changes/office-ui-fabric-react/import-componentbases_2018-02-28-20-18.json b/common/changes/office-ui-fabric-react/import-componentbases_2018-02-28-20-18.json
deleted file mode 100644
index e0445a06c4466..0000000000000
--- a/common/changes/office-ui-fabric-react/import-componentbases_2018-02-28-20-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added index import for base files in Layer, Nav, Image, ScrollablePane, ResizeGroup, and Rating components so unstyled component can be used.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/resizegroup-scss2ms-pt2_2018-02-22-21-19.json b/common/changes/office-ui-fabric-react/resizegroup-scss2ms-pt2_2018-02-22-21-19.json
deleted file mode 100644
index 6b0e4d9bb90cf..0000000000000
--- a/common/changes/office-ui-fabric-react/resizegroup-scss2ms-pt2_2018-02-22-21-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Converting ResizeGroup SCSS to MergeStyles step 2 - style converstion",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index de28ee3457b29..18823c4855427 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.56.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.57.0 <6.0.0",
     "@uifabric/icons": ">=5.4.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index f3a8dee56775f..d690a3d66526d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.57.0",
+      "tag": "office-ui-fabric-react_v5.57.0",
+      "date": "Thu, 01 Mar 2018 11:12:54 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "1e766db267dcc15e44b671952ade61151e93d331",
+            "comment": "Added index import for base files in Layer, Nav, Image, ScrollablePane, ResizeGroup, and Rating components so unstyled component can be used."
+          },
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "9b0294ad0bc1c2cfcd0b9d680f5a62e3bef6f27e",
+            "comment": "Converting ResizeGroup SCSS to MergeStyles step 2 - style converstion"
+          }
+        ]
+      }
+    },
     {
       "version": "5.56.1",
       "tag": "office-ui-fabric-react_v5.56.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 619a5f2602e08..e80c5de6b3d53 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 01 Mar 2018 00:05:10 GMT and should not be manually modified.
+This log was last generated on Thu, 01 Mar 2018 11:12:54 GMT and should not be manually modified.
+
+## 5.57.0
+Thu, 01 Mar 2018 11:12:54 GMT
+
+### Minor changes
+
+- Added index import for base files in Layer, Nav, Image, ScrollablePane, ResizeGroup, and Rating components so unstyled component can be used.
+- Converting ResizeGroup SCSS to MergeStyles step 2 - style converstion
 
 ## 5.56.1
 Thu, 01 Mar 2018 00:05:10 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index d86d13c9643ba..c016269128cae 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.56.1",
+  "version": "5.57.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 47663d07d856cf09d880f67b7221eebeda54461e Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Thu, 1 Mar 2018 09:13:44 -0800
Subject: [PATCH 1474/1641] Icons: Update package with FabMDL2v2.68 (#4086)

* Updated config, font, and src files

* Changed name of numbers for enum

* removing more third party icons

* added change file

* ShareiOS brought back, synced with cdn
---
 ...update-icons-package_2018-02-23-23-38.json |  11 +++
 packages/icons/config/fabric-icons-0.json     |   8 +-
 packages/icons/config/fabric-icons-1.json     |   8 +-
 packages/icons/config/fabric-icons-10.json    |  80 ++++++++--------
 packages/icons/config/fabric-icons-11.json    |  48 +++++-----
 packages/icons/config/fabric-icons-12.json    |  48 +++++-----
 packages/icons/config/fabric-icons-13.json    |  88 +++++++++---------
 packages/icons/config/fabric-icons-14.json    |  20 +++-
 packages/icons/config/fabric-icons-2.json     |   8 +-
 packages/icons/config/fabric-icons-3.json     |  32 +++----
 packages/icons/config/fabric-icons-4.json     |  32 +++----
 packages/icons/config/fabric-icons-5.json     |  24 ++---
 packages/icons/config/fabric-icons-6.json     |  16 ++--
 packages/icons/config/fabric-icons-7.json     |  48 +++++-----
 packages/icons/config/fabric-icons-8.json     |  80 ++++++++--------
 packages/icons/config/fabric-icons-9.json     |  80 ++++++++--------
 packages/icons/config/fabric-icons.json       |   8 ++
 .../icons/fonts/fabric-icons-0-2e092c7d.woff  | Bin 11648 -> 0 bytes
 .../icons/fonts/fabric-icons-0-6a62cc1b.woff  | Bin 0 -> 11660 bytes
 .../icons/fonts/fabric-icons-1-8143b877.woff  | Bin 0 -> 11236 bytes
 .../icons/fonts/fabric-icons-1-a86438ef.woff  | Bin 11900 -> 0 bytes
 .../icons/fonts/fabric-icons-10-380f2273.woff | Bin 0 -> 11228 bytes
 .../icons/fonts/fabric-icons-10-90d2dc10.woff | Bin 10640 -> 0 bytes
 .../icons/fonts/fabric-icons-11-18d2ffa4.woff | Bin 14500 -> 0 bytes
 .../icons/fonts/fabric-icons-11-2c5983e3.woff | Bin 0 -> 14108 bytes
 .../icons/fonts/fabric-icons-12-6c96597e.woff | Bin 14384 -> 0 bytes
 .../icons/fonts/fabric-icons-12-e5eef780.woff | Bin 0 -> 15100 bytes
 .../icons/fonts/fabric-icons-13-02c4bea1.woff | Bin 15084 -> 0 bytes
 .../icons/fonts/fabric-icons-13-be3ab2c9.woff | Bin 0 -> 12140 bytes
 .../icons/fonts/fabric-icons-14-36569c01.woff | Bin 2364 -> 0 bytes
 .../icons/fonts/fabric-icons-14-cf85ed5b.woff | Bin 0 -> 3048 bytes
 .../icons/fonts/fabric-icons-2-e2ae1f0c.woff  | Bin 12568 -> 0 bytes
 .../icons/fonts/fabric-icons-2-e49d4cfd.woff  | Bin 0 -> 13256 bytes
 .../icons/fonts/fabric-icons-3-39ed3795.woff  | Bin 0 -> 13972 bytes
 .../icons/fonts/fabric-icons-3-a13cb765.woff  | Bin 13976 -> 0 bytes
 .../icons/fonts/fabric-icons-4-0838b5e4.woff  | Bin 0 -> 15164 bytes
 .../icons/fonts/fabric-icons-4-97372384.woff  | Bin 15464 -> 0 bytes
 .../icons/fonts/fabric-icons-5-125dbde8.woff  | Bin 15340 -> 0 bytes
 .../icons/fonts/fabric-icons-5-5a61f6fb.woff  | Bin 0 -> 15468 bytes
 .../icons/fonts/fabric-icons-6-2e7e2914.woff  | Bin 11264 -> 0 bytes
 .../icons/fonts/fabric-icons-6-baae6235.woff  | Bin 0 -> 11216 bytes
 .../icons/fonts/fabric-icons-7-143895dd.woff  | Bin 13464 -> 0 bytes
 .../icons/fonts/fabric-icons-7-3ac670e6.woff  | Bin 0 -> 12856 bytes
 .../icons/fonts/fabric-icons-8-bd2a110b.woff  | Bin 13172 -> 0 bytes
 .../icons/fonts/fabric-icons-8-d0700068.woff  | Bin 0 -> 13124 bytes
 .../icons/fonts/fabric-icons-9-8ab77260.woff  | Bin 12344 -> 0 bytes
 .../icons/fonts/fabric-icons-9-938d7113.woff  | Bin 0 -> 11932 bytes
 .../icons/fonts/fabric-icons-a13498cf.woff    | Bin 0 -> 6784 bytes
 .../icons/fonts/fabric-icons-cf6d96bb.woff    | Bin 6524 -> 0 bytes
 packages/icons/src/IconNames.ts               |  36 +++++--
 packages/icons/src/fabric-icons-0.ts          |   4 +-
 packages/icons/src/fabric-icons-1.ts          |   6 +-
 packages/icons/src/fabric-icons-10.ts         |  22 +++--
 packages/icons/src/fabric-icons-11.ts         |  16 ++--
 packages/icons/src/fabric-icons-12.ts         |  18 ++--
 packages/icons/src/fabric-icons-13.ts         |  24 +++--
 packages/icons/src/fabric-icons-14.ts         |   9 +-
 packages/icons/src/fabric-icons-2.ts          |   6 +-
 packages/icons/src/fabric-icons-3.ts          |  12 +--
 packages/icons/src/fabric-icons-4.ts          |  13 +--
 packages/icons/src/fabric-icons-5.ts          |  10 +-
 packages/icons/src/fabric-icons-6.ts          |   7 +-
 packages/icons/src/fabric-icons-7.ts          |  20 ++--
 packages/icons/src/fabric-icons-8.ts          |  24 ++---
 packages/icons/src/fabric-icons-9.ts          |  24 ++---
 packages/icons/src/fabric-icons.ts            |   4 +-
 66 files changed, 482 insertions(+), 412 deletions(-)
 create mode 100644 common/changes/@uifabric/icons/update-icons-package_2018-02-23-23-38.json
 delete mode 100644 packages/icons/fonts/fabric-icons-0-2e092c7d.woff
 create mode 100644 packages/icons/fonts/fabric-icons-0-6a62cc1b.woff
 create mode 100644 packages/icons/fonts/fabric-icons-1-8143b877.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-1-a86438ef.woff
 create mode 100644 packages/icons/fonts/fabric-icons-10-380f2273.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-10-90d2dc10.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-11-18d2ffa4.woff
 create mode 100644 packages/icons/fonts/fabric-icons-11-2c5983e3.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-12-6c96597e.woff
 create mode 100644 packages/icons/fonts/fabric-icons-12-e5eef780.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-13-02c4bea1.woff
 create mode 100644 packages/icons/fonts/fabric-icons-13-be3ab2c9.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-14-36569c01.woff
 create mode 100644 packages/icons/fonts/fabric-icons-14-cf85ed5b.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-2-e2ae1f0c.woff
 create mode 100644 packages/icons/fonts/fabric-icons-2-e49d4cfd.woff
 create mode 100644 packages/icons/fonts/fabric-icons-3-39ed3795.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-3-a13cb765.woff
 create mode 100644 packages/icons/fonts/fabric-icons-4-0838b5e4.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-4-97372384.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-5-125dbde8.woff
 create mode 100644 packages/icons/fonts/fabric-icons-5-5a61f6fb.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-6-2e7e2914.woff
 create mode 100644 packages/icons/fonts/fabric-icons-6-baae6235.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-7-143895dd.woff
 create mode 100644 packages/icons/fonts/fabric-icons-7-3ac670e6.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-8-bd2a110b.woff
 create mode 100644 packages/icons/fonts/fabric-icons-8-d0700068.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-9-8ab77260.woff
 create mode 100644 packages/icons/fonts/fabric-icons-9-938d7113.woff
 create mode 100644 packages/icons/fonts/fabric-icons-a13498cf.woff
 delete mode 100644 packages/icons/fonts/fabric-icons-cf6d96bb.woff

diff --git a/common/changes/@uifabric/icons/update-icons-package_2018-02-23-23-38.json b/common/changes/@uifabric/icons/update-icons-package_2018-02-23-23-38.json
new file mode 100644
index 0000000000000..5dfbd59f949ca
--- /dev/null
+++ b/common/changes/@uifabric/icons/update-icons-package_2018-02-23-23-38.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/icons",
+      "comment": "Updating icons to FabMDL2v2.68 and adding 2 icons to the main partition.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/icons",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-0.json b/packages/icons/config/fabric-icons-0.json
index 2a824e10112ee..51795cb2fd3a9 100644
--- a/packages/icons/config/fabric-icons-0.json
+++ b/packages/icons/config/fabric-icons-0.json
@@ -72,6 +72,10 @@
 			"name": "Link",
 			"unicode": "E71B"
 		},
+		{
+			"name": "AllApps",
+			"unicode": "E71D"
+		},
 		{
 			"name": "Zoom",
 			"unicode": "E71E"
@@ -120,10 +124,6 @@
 			"name": "Lock",
 			"unicode": "E72E"
 		},
-		{
-			"name": "BlockedSite",
-			"unicode": "E72F"
-		},
 		{
 			"name": "ReportHacked",
 			"unicode": "E730"
diff --git a/packages/icons/config/fabric-icons-1.json b/packages/icons/config/fabric-icons-1.json
index 417ff4dac8a4c..ca55a72c01cb5 100644
--- a/packages/icons/config/fabric-icons-1.json
+++ b/packages/icons/config/fabric-icons-1.json
@@ -16,6 +16,10 @@
 			"name": "Highlight",
 			"unicode": "E7E6"
 		},
+		{
+			"name": "PowerButton",
+			"unicode": "E7E8"
+		},
 		{
 			"name": "Tab",
 			"unicode": "E7E9"
@@ -403,10 +407,6 @@
 		{
 			"name": "Group",
 			"unicode": "E902"
-		},
-		{
-			"name": "World",
-			"unicode": "E909"
 		}
 	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-10.json b/packages/icons/config/fabric-icons-10.json
index c05e8831b8bea..1835ff877c384 100644
--- a/packages/icons/config/fabric-icons-10.json
+++ b/packages/icons/config/fabric-icons-10.json
@@ -8,6 +8,46 @@
 		"maxSubsetSize": 100
 	},
 	"glyphs": [
+		{
+			"name": "FullWidthEdit",
+			"unicode": "F2FF"
+		},
+		{
+			"name": "Plug",
+			"unicode": "F300"
+		},
+		{
+			"name": "PlugSolid",
+			"unicode": "F301"
+		},
+		{
+			"name": "PlugConnected",
+			"unicode": "F302"
+		},
+		{
+			"name": "PlugDisconnected",
+			"unicode": "F303"
+		},
+		{
+			"name": "UnlockSolid",
+			"unicode": "F304"
+		},
+		{
+			"name": "Variable",
+			"unicode": "F305"
+		},
+		{
+			"name": "Parameter",
+			"unicode": "F306"
+		},
+		{
+			"name": "CommentUrgent",
+			"unicode": "F307"
+		},
+		{
+			"name": "Storyboard",
+			"unicode": "F308"
+		},
 		{
 			"name": "DiffInline",
 			"unicode": "F309"
@@ -367,46 +407,6 @@
 		{
 			"name": "ChevronUpEnd6",
 			"unicode": "F370"
-		},
-		{
-			"name": "ChevronLeftEnd6",
-			"unicode": "F371"
-		},
-		{
-			"name": "ChevronRightEnd6",
-			"unicode": "F372"
-		},
-		{
-			"name": "EgnyteLogo",
-			"unicode": "F373"
-		},
-		{
-			"name": "GoogleDriveLogoLeftGreen",
-			"unicode": "F374"
-		},
-		{
-			"name": "GoogleDriveLogoBottomBlue",
-			"unicode": "F375"
-		},
-		{
-			"name": "GoogleDriveLogoRightYellow",
-			"unicode": "F376"
-		},
-		{
-			"name": "ContextMenu",
-			"unicode": "F37C"
-		},
-		{
-			"name": "AzureAPIManagement",
-			"unicode": "F37F"
-		},
-		{
-			"name": "AzureServiceEndpoint",
-			"unicode": "F380"
-		},
-		{
-			"name": "VSTSLogo",
-			"unicode": "F381"
 		}
 	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-11.json b/packages/icons/config/fabric-icons-11.json
index 9067084096c1f..878361ae7d2d3 100644
--- a/packages/icons/config/fabric-icons-11.json
+++ b/packages/icons/config/fabric-icons-11.json
@@ -8,6 +8,30 @@
 		"maxSubsetSize": 100
 	},
 	"glyphs": [
+		{
+			"name": "ChevronLeftEnd6",
+			"unicode": "F371"
+		},
+		{
+			"name": "ChevronRightEnd6",
+			"unicode": "F372"
+		},
+		{
+			"name": "ContextMenu",
+			"unicode": "F37C"
+		},
+		{
+			"name": "AzureAPIManagement",
+			"unicode": "F37F"
+		},
+		{
+			"name": "AzureServiceEndpoint",
+			"unicode": "F380"
+		},
+		{
+			"name": "VSTSLogo",
+			"unicode": "F381"
+		},
 		{
 			"name": "VSTSAltLogo1",
 			"unicode": "F382"
@@ -383,30 +407,6 @@
 		{
 			"name": "ProjectLogoFill32",
 			"unicode": "F47F"
-		},
-		{
-			"name": "ProjectLogo16",
-			"unicode": "F480"
-		},
-		{
-			"name": "ProjectLogoFill16",
-			"unicode": "F481"
-		},
-		{
-			"name": "SwayLogo32",
-			"unicode": "F482"
-		},
-		{
-			"name": "SwayLogoFill32",
-			"unicode": "F483"
-		},
-		{
-			"name": "SwayLogo16",
-			"unicode": "F484"
-		},
-		{
-			"name": "SwayLogoFill16",
-			"unicode": "F485"
 		}
 	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-12.json b/packages/icons/config/fabric-icons-12.json
index 221828001e99c..8d0e1a4188a3a 100644
--- a/packages/icons/config/fabric-icons-12.json
+++ b/packages/icons/config/fabric-icons-12.json
@@ -8,6 +8,30 @@
 		"maxSubsetSize": 100
 	},
 	"glyphs": [
+		{
+			"name": "ProjectLogo16",
+			"unicode": "F480"
+		},
+		{
+			"name": "ProjectLogoFill16",
+			"unicode": "F481"
+		},
+		{
+			"name": "SwayLogo32",
+			"unicode": "F482"
+		},
+		{
+			"name": "SwayLogoFill32",
+			"unicode": "F483"
+		},
+		{
+			"name": "SwayLogo16",
+			"unicode": "F484"
+		},
+		{
+			"name": "SwayLogoFill16",
+			"unicode": "F485"
+		},
 		{
 			"name": "ClassNotebookLogo32",
 			"unicode": "F486"
@@ -383,30 +407,6 @@
 		{
 			"name": "Padding",
 			"unicode": "F518"
-		},
-		{
-			"name": "PaddingTop",
-			"unicode": "F519"
-		},
-		{
-			"name": "PaddingBottom",
-			"unicode": "F51A"
-		},
-		{
-			"name": "PaddingLeft",
-			"unicode": "F51B"
-		},
-		{
-			"name": "PaddingRight",
-			"unicode": "F51C"
-		},
-		{
-			"name": "NavigationFlipper",
-			"unicode": "F51D"
-		},
-		{
-			"name": "AlignJustify",
-			"unicode": "F51E"
 		}
 	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-13.json b/packages/icons/config/fabric-icons-13.json
index 73d02a787039a..701291daf516e 100644
--- a/packages/icons/config/fabric-icons-13.json
+++ b/packages/icons/config/fabric-icons-13.json
@@ -8,6 +8,30 @@
 		"maxSubsetSize": 100
 	},
 	"glyphs": [
+		{
+			"name": "PaddingTop",
+			"unicode": "F519"
+		},
+		{
+			"name": "PaddingBottom",
+			"unicode": "F51A"
+		},
+		{
+			"name": "PaddingLeft",
+			"unicode": "F51B"
+		},
+		{
+			"name": "PaddingRight",
+			"unicode": "F51C"
+		},
+		{
+			"name": "NavigationFlipper",
+			"unicode": "F51D"
+		},
+		{
+			"name": "AlignJustify",
+			"unicode": "F51E"
+		},
 		{
 			"name": "TextOverflow",
 			"unicode": "F51F"
@@ -244,22 +268,6 @@
 			"name": "VisualStudioIDELogo32",
 			"unicode": "F5D0"
 		},
-		{
-			"name": "ApacheIvyLogo32",
-			"unicode": "F5D1"
-		},
-		{
-			"name": "BitbucketLogo32",
-			"unicode": "F5D2"
-		},
-		{
-			"name": "LinuxLogo32",
-			"unicode": "F5D3"
-		},
-		{
-			"name": "GradleLogo32",
-			"unicode": "F5D4"
-		},
 		{
 			"name": "PasteAsText",
 			"unicode": "F5D5"
@@ -332,6 +340,10 @@
 			"name": "DropShapeSolid",
 			"unicode": "F63F"
 		},
+		{
+			"name": "RectangleShapeSolid",
+			"unicode": "F640"
+		},
 		{
 			"name": "InsertColumnsLeft",
 			"unicode": "F64A"
@@ -364,34 +376,6 @@
 			"name": "DeleteTable",
 			"unicode": "F651"
 		},
-		{
-			"name": "GitLogo",
-			"unicode": "F65D"
-		},
-		{
-			"name": "GitHubLogo",
-			"unicode": "F65E"
-		},
-		{
-			"name": "ApacheMavenLogo",
-			"unicode": "F65F"
-		},
-		{
-			"name": "NPMLogo",
-			"unicode": "F660"
-		},
-		{
-			"name": "GitFork",
-			"unicode": "F661"
-		},
-		{
-			"name": "SVNLogo",
-			"unicode": "F662"
-		},
-		{
-			"name": "JenkinsLogo",
-			"unicode": "F663"
-		},
 		{
 			"name": "VersionControlPush",
 			"unicode": "F664"
@@ -400,6 +384,14 @@
 			"name": "ExternalGit",
 			"unicode": "F665"
 		},
+		{
+			"name": "WhiteBoardApp16",
+			"unicode": "F673"
+		},
+		{
+			"name": "WhiteBoardApp32",
+			"unicode": "F674"
+		},
 		{
 			"name": "InsertSignatureLine",
 			"unicode": "F677"
@@ -407,6 +399,14 @@
 		{
 			"name": "ArrangeByFrom",
 			"unicode": "F678"
+		},
+		{
+			"name": "Phishing",
+			"unicode": "F679"
+		},
+		{
+			"name": "CreateMailRule",
+			"unicode": "F67A"
 		}
 	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-14.json b/packages/icons/config/fabric-icons-14.json
index 3040a07465fc4..357ec5a104070 100644
--- a/packages/icons/config/fabric-icons-14.json
+++ b/packages/icons/config/fabric-icons-14.json
@@ -9,12 +9,24 @@
 	},
 	"glyphs": [
 		{
-			"name": "Phishing",
-			"unicode": "F679"
+			"name": "PublishCourse",
+			"unicode": "F699"
 		},
 		{
-			"name": "CreateMailRule",
-			"unicode": "F67A"
+			"name": "DictionaryRemove",
+			"unicode": "F69A"
+		},
+		{
+			"name": "UserRemove",
+			"unicode": "F69B"
+		},
+		{
+			"name": "UserEvent",
+			"unicode": "F69C"
+		},
+		{
+			"name": "Encryption",
+			"unicode": "F69D"
 		}
 	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-2.json b/packages/icons/config/fabric-icons-2.json
index 8bd6865dcaadf..1a6e77aadb5d3 100644
--- a/packages/icons/config/fabric-icons-2.json
+++ b/packages/icons/config/fabric-icons-2.json
@@ -8,6 +8,10 @@
 		"maxSubsetSize": 100
 	},
 	"glyphs": [
+		{
+			"name": "World",
+			"unicode": "E909"
+		},
 		{
 			"name": "Comment",
 			"unicode": "E90A"
@@ -403,10 +407,6 @@
 		{
 			"name": "StoreLogoMed20",
 			"unicode": "EA04"
-		},
-		{
-			"name": "TimeSheet",
-			"unicode": "EA05"
 		}
 	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-3.json b/packages/icons/config/fabric-icons-3.json
index 588abc9f72e8e..89a9d0deffb54 100644
--- a/packages/icons/config/fabric-icons-3.json
+++ b/packages/icons/config/fabric-icons-3.json
@@ -8,6 +8,10 @@
 		"maxSubsetSize": 100
 	},
 	"glyphs": [
+		{
+			"name": "TimeSheet",
+			"unicode": "EA05"
+		},
 		{
 			"name": "TriangleSolid",
 			"unicode": "EA08"
@@ -88,6 +92,10 @@
 			"name": "Record2",
 			"unicode": "EA3F"
 		},
+		{
+			"name": "AllAppsMirrored",
+			"unicode": "EA40"
+		},
 		{
 			"name": "BookmarksMirrored",
 			"unicode": "EA41"
@@ -264,6 +272,10 @@
 			"name": "Weights",
 			"unicode": "EADB"
 		},
+		{
+			"name": "Trackers",
+			"unicode": "EADF"
+		},
 		{
 			"name": "AddNotes",
 			"unicode": "EAE3"
@@ -324,6 +336,10 @@
 			"name": "Lamp",
 			"unicode": "EB19"
 		},
+		{
+			"name": "Source",
+			"unicode": "EB1B"
+		},
 		{
 			"name": "MSNVideos",
 			"unicode": "EB1C"
@@ -391,22 +407,6 @@
 		{
 			"name": "Website",
 			"unicode": "EB41"
-		},
-		{
-			"name": "Drop",
-			"unicode": "EB42"
-		},
-		{
-			"name": "SkiResorts",
-			"unicode": "EB45"
-		},
-		{
-			"name": "Snowflake",
-			"unicode": "EB46"
-		},
-		{
-			"name": "BusSolid",
-			"unicode": "EB47"
 		}
 	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-4.json b/packages/icons/config/fabric-icons-4.json
index 91b09abaf0e77..b339294c83d10 100644
--- a/packages/icons/config/fabric-icons-4.json
+++ b/packages/icons/config/fabric-icons-4.json
@@ -8,6 +8,22 @@
 		"maxSubsetSize": 100
 	},
 	"glyphs": [
+		{
+			"name": "Drop",
+			"unicode": "EB42"
+		},
+		{
+			"name": "SkiResorts",
+			"unicode": "EB45"
+		},
+		{
+			"name": "Snowflake",
+			"unicode": "EB46"
+		},
+		{
+			"name": "BusSolid",
+			"unicode": "EB47"
+		},
 		{
 			"name": "FerrySolid",
 			"unicode": "EB48"
@@ -336,10 +352,6 @@
 			"name": "POI",
 			"unicode": "ECAF"
 		},
-		{
-			"name": "FacebookLogo",
-			"unicode": "ECB3"
-		},
 		{
 			"name": "AddTo",
 			"unicode": "ECC8"
@@ -376,10 +388,6 @@
 			"name": "FangBody",
 			"unicode": "ECEB"
 		},
-		{
-			"name": "Glimmer",
-			"unicode": "ECF4"
-		},
 		{
 			"name": "ChatInviteFriend",
 			"unicode": "ECFE"
@@ -399,14 +407,6 @@
 		{
 			"name": "SharepointLogoInverse",
 			"unicode": "ED18"
-		},
-		{
-			"name": "YammerLogo",
-			"unicode": "ED19"
-		},
-		{
-			"name": "Hide",
-			"unicode": "ED1A"
 		}
 	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-5.json b/packages/icons/config/fabric-icons-5.json
index 326804413f435..f4bfcf3d4790e 100644
--- a/packages/icons/config/fabric-icons-5.json
+++ b/packages/icons/config/fabric-icons-5.json
@@ -8,6 +8,14 @@
 		"maxSubsetSize": 100
 	},
 	"glyphs": [
+		{
+			"name": "YammerLogo",
+			"unicode": "ED19"
+		},
+		{
+			"name": "Hide",
+			"unicode": "ED1A"
+		},
 		{
 			"name": "Uneditable",
 			"unicode": "ED1D"
@@ -92,18 +100,10 @@
 			"name": "AdminYLogoInverse32",
 			"unicode": "ED73"
 		},
-		{
-			"name": "BoxLogo",
-			"unicode": "ED75"
-		},
 		{
 			"name": "DelveLogoInverse",
 			"unicode": "ED76"
 		},
-		{
-			"name": "DropboxLogo",
-			"unicode": "ED77"
-		},
 		{
 			"name": "ExchangeLogoInverse",
 			"unicode": "ED78"
@@ -116,10 +116,6 @@
 			"name": "OfficeVideoLogoInverse",
 			"unicode": "ED7A"
 		},
-		{
-			"name": "ParatureLogo",
-			"unicode": "ED7B"
-		},
 		{
 			"name": "SocialListeningLogo",
 			"unicode": "ED7C"
@@ -407,6 +403,10 @@
 		{
 			"name": "CaretDownSolid8",
 			"unicode": "EDDC"
+		},
+		{
+			"name": "ClearFormatting",
+			"unicode": "EDDD"
 		}
 	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-6.json b/packages/icons/config/fabric-icons-6.json
index 57c1f60d89a27..f39057b3ea81b 100644
--- a/packages/icons/config/fabric-icons-6.json
+++ b/packages/icons/config/fabric-icons-6.json
@@ -8,10 +8,6 @@
 		"maxSubsetSize": 100
 	},
 	"glyphs": [
-		{
-			"name": "ClearFormatting",
-			"unicode": "EDDD"
-		},
 		{
 			"name": "Superscript",
 			"unicode": "EDDE"
@@ -36,6 +32,10 @@
 			"name": "SingleBookmark",
 			"unicode": "EDFF"
 		},
+		{
+			"name": "SingleBookmarkSolid",
+			"unicode": "EE00"
+		},
 		{
 			"name": "DoubleChevronDown",
 			"unicode": "EE04"
@@ -48,10 +48,6 @@
 			"name": "ReplyAll",
 			"unicode": "EE0A"
 		},
-		{
-			"name": "GoogleDriveLogo",
-			"unicode": "EE0B"
-		},
 		{
 			"name": "WorkforceManagement",
 			"unicode": "EE0F"
@@ -120,6 +116,10 @@
 			"name": "WifiEthernet",
 			"unicode": "EE77"
 		},
+		{
+			"name": "TrackersMirrored",
+			"unicode": "EE92"
+		},
 		{
 			"name": "DateTimeMirrored",
 			"unicode": "EE93"
diff --git a/packages/icons/config/fabric-icons-7.json b/packages/icons/config/fabric-icons-7.json
index c702f4c62638a..96ff8fa1a767f 100644
--- a/packages/icons/config/fabric-icons-7.json
+++ b/packages/icons/config/fabric-icons-7.json
@@ -120,14 +120,6 @@
 			"name": "Hide2",
 			"unicode": "EF89"
 		},
-		{
-			"name": "iOSAppStoreLogo",
-			"unicode": "EF8A"
-		},
-		{
-			"name": "AndroidLogo",
-			"unicode": "EF8B"
-		},
 		{
 			"name": "Breadcrumb",
 			"unicode": "EF8C"
@@ -188,6 +180,10 @@
 			"name": "TextDocument",
 			"unicode": "F029"
 		},
+		{
+			"name": "TextDocumentShared",
+			"unicode": "F02B"
+		},
 		{
 			"name": "PageCheckedOut",
 			"unicode": "F02C"
@@ -212,6 +208,10 @@
 			"name": "EventDate",
 			"unicode": "F059"
 		},
+		{
+			"name": "ArrowUpRight",
+			"unicode": "F069"
+		},
 		{
 			"name": "CaretRight",
 			"unicode": "F06B"
@@ -352,6 +352,10 @@
 			"name": "PageCheckedin",
 			"unicode": "F104"
 		},
+		{
+			"name": "ReadOutLoud",
+			"unicode": "F112"
+		},
 		{
 			"name": "CaretBottomLeftSolid8",
 			"unicode": "F121"
@@ -381,32 +385,28 @@
 			"unicode": "F137"
 		},
 		{
-			"name": "Toll",
-			"unicode": "F160"
-		},
-		{
-			"name": "ExploreContentSingle",
-			"unicode": "F164"
+			"name": "StatusCircleRing",
+			"unicode": "F138"
 		},
 		{
-			"name": "CollapseContent",
-			"unicode": "F165"
+			"name": "StatusTriangleOuter",
+			"unicode": "F139"
 		},
 		{
-			"name": "CollapseContentSingle",
-			"unicode": "F166"
+			"name": "StatusTriangleInner",
+			"unicode": "F13A"
 		},
 		{
-			"name": "InfoSolid",
-			"unicode": "F167"
+			"name": "StatusTriangleExclamation",
+			"unicode": "F13B"
 		},
 		{
-			"name": "ProgressRingDots",
-			"unicode": "F16A"
+			"name": "StatusCircleExclamation",
+			"unicode": "F13C"
 		},
 		{
-			"name": "CaloriesAdd",
-			"unicode": "F172"
+			"name": "StatusCircleErrorX",
+			"unicode": "F13D"
 		}
 	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-8.json b/packages/icons/config/fabric-icons-8.json
index 021dbc41677a1..8b805e0eb11eb 100644
--- a/packages/icons/config/fabric-icons-8.json
+++ b/packages/icons/config/fabric-icons-8.json
@@ -8,6 +8,46 @@
 		"maxSubsetSize": 100
 	},
 	"glyphs": [
+		{
+			"name": "StatusCircleInfo",
+			"unicode": "F13F"
+		},
+		{
+			"name": "StatusCircleBlock2",
+			"unicode": "F141"
+		},
+		{
+			"name": "StatusCircleQuestionMark",
+			"unicode": "F142"
+		},
+		{
+			"name": "Toll",
+			"unicode": "F160"
+		},
+		{
+			"name": "ExploreContentSingle",
+			"unicode": "F164"
+		},
+		{
+			"name": "CollapseContent",
+			"unicode": "F165"
+		},
+		{
+			"name": "CollapseContentSingle",
+			"unicode": "F166"
+		},
+		{
+			"name": "InfoSolid",
+			"unicode": "F167"
+		},
+		{
+			"name": "ProgressRingDots",
+			"unicode": "F16A"
+		},
+		{
+			"name": "CaloriesAdd",
+			"unicode": "F172"
+		},
 		{
 			"name": "BranchFork",
 			"unicode": "F173"
@@ -367,46 +407,6 @@
 		{
 			"name": "BranchCompare",
 			"unicode": "F294"
-		},
-		{
-			"name": "BranchMerge",
-			"unicode": "F295"
-		},
-		{
-			"name": "BranchPullRequest",
-			"unicode": "F296"
-		},
-		{
-			"name": "BranchSearch",
-			"unicode": "F297"
-		},
-		{
-			"name": "BranchShelveset",
-			"unicode": "F298"
-		},
-		{
-			"name": "RawSource",
-			"unicode": "F299"
-		},
-		{
-			"name": "MergeDuplicate",
-			"unicode": "F29A"
-		},
-		{
-			"name": "RowsGroup",
-			"unicode": "F29B"
-		},
-		{
-			"name": "RowsChild",
-			"unicode": "F29C"
-		},
-		{
-			"name": "Deploy",
-			"unicode": "F29D"
-		},
-		{
-			"name": "Redeploy",
-			"unicode": "F29E"
 		}
 	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons-9.json b/packages/icons/config/fabric-icons-9.json
index 4f1f321b4a294..c29bfecb91505 100644
--- a/packages/icons/config/fabric-icons-9.json
+++ b/packages/icons/config/fabric-icons-9.json
@@ -8,6 +8,46 @@
 		"maxSubsetSize": 100
 	},
 	"glyphs": [
+		{
+			"name": "BranchMerge",
+			"unicode": "F295"
+		},
+		{
+			"name": "BranchPullRequest",
+			"unicode": "F296"
+		},
+		{
+			"name": "BranchSearch",
+			"unicode": "F297"
+		},
+		{
+			"name": "BranchShelveset",
+			"unicode": "F298"
+		},
+		{
+			"name": "RawSource",
+			"unicode": "F299"
+		},
+		{
+			"name": "MergeDuplicate",
+			"unicode": "F29A"
+		},
+		{
+			"name": "RowsGroup",
+			"unicode": "F29B"
+		},
+		{
+			"name": "RowsChild",
+			"unicode": "F29C"
+		},
+		{
+			"name": "Deploy",
+			"unicode": "F29D"
+		},
+		{
+			"name": "Redeploy",
+			"unicode": "F29E"
+		},
 		{
 			"name": "ServerEnviroment",
 			"unicode": "F29F"
@@ -367,46 +407,6 @@
 		{
 			"name": "FullWidth",
 			"unicode": "F2FE"
-		},
-		{
-			"name": "FullWidthEdit",
-			"unicode": "F2FF"
-		},
-		{
-			"name": "Plug",
-			"unicode": "F300"
-		},
-		{
-			"name": "PlugSolid",
-			"unicode": "F301"
-		},
-		{
-			"name": "PlugConnected",
-			"unicode": "F302"
-		},
-		{
-			"name": "PlugDisconnected",
-			"unicode": "F303"
-		},
-		{
-			"name": "UnlockSolid",
-			"unicode": "F304"
-		},
-		{
-			"name": "Variable",
-			"unicode": "F305"
-		},
-		{
-			"name": "Parameter",
-			"unicode": "F306"
-		},
-		{
-			"name": "CommentUrgent",
-			"unicode": "F307"
-		},
-		{
-			"name": "Storyboard",
-			"unicode": "F308"
 		}
 	]
 }
\ No newline at end of file
diff --git a/packages/icons/config/fabric-icons.json b/packages/icons/config/fabric-icons.json
index 1919619e0096d..8110a4b139aa1 100644
--- a/packages/icons/config/fabric-icons.json
+++ b/packages/icons/config/fabric-icons.json
@@ -56,6 +56,10 @@
 			"name": "Share",
 			"unicode": "E72D"
 		},
+		{
+			"name": "BlockedSite",
+			"unicode": "E72F"
+		},
 		{
 			"name": "FavoriteStar",
 			"unicode": "E734"
@@ -176,6 +180,10 @@
 			"name": "Embed",
 			"unicode": "ECCE"
 		},
+		{
+			"name": "Glimmer",
+			"unicode": "ECF4"
+		},
 		{
 			"name": "Ascending",
 			"unicode": "EDC0"
diff --git a/packages/icons/fonts/fabric-icons-0-2e092c7d.woff b/packages/icons/fonts/fabric-icons-0-2e092c7d.woff
deleted file mode 100644
index 92734d72845d0c83f0940b8de88857422b744575..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 11648
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

diff --git a/packages/icons/fonts/fabric-icons-0-6a62cc1b.woff b/packages/icons/fonts/fabric-icons-0-6a62cc1b.woff
new file mode 100644
index 0000000000000000000000000000000000000000..6613450850eaa991628737d39fc4f45a6e2f9e75
GIT binary patch
literal 11660
zcmZ8{b8u$O6Yd+^wr$(CosI2{ZF^(9v9Ymj?Z(E&wvC&we)s-!r|PLW&vUwarh4jh
zotkP7B}qvD2;h4#!~ziio7LF?pf%|KJ^lYfNsWmW000sH)}_B;M8D*SU}|sd^sU8y
z!vO#QlU){EpEh-OB?bUM-@k3XX8<kCDom|~lcoLld;D*H{cWrBo_iQ?Y3%at3l9IS
z{SVLpJWD$-i*F4Z03eeA07L*!lM04b=Ei0K0M$1D-|GW7Kf<Tkt-i%?E#sSGe1jYr
z1RBiB-qrJ4tNZ4f-<ZPviI!mJX!>nO4gJmk{s$xuA{%>S&+m1q7rr^+H;4g;prj7Q
z_U7N({r4Up0RWiSr0i=oCr1}o0D%7d+vdM~5PzuvHk_QzzkM0LDIn?_^Pb(eh@L=G
zBjc}r?x3L5pddHQDi$!XBKA;=p0UIc@}d5TiQ%y!Xh?Wr;=VvYPd_XyJYoVRfA1v7
zp_nve9WN%dQcw^G0Gk-b(-Sy3J1vLiggtt5<<AULptf?Phd?H9o;U|9E2SC%opOze
zE@I}Ll`eXUiXPVBFd-XGQGhU1NSzjw$YACUeV<Qy-n34=NxL+z+Vz)7Z~GPQKIrPs
zmq;)ji+=<=ucFIzWUu4Kz&X3D>#duFD=&+R(g<|ea+v0QLHQ5KDR*og{sA|YRsOGJ
zc9&@8GM+&m-AJcgPR6+@4Bqw$jvAMcY}Z)@r0$J^gg5?umX9H9(kW&bgCw)0)~+Kk
znmJ$NEP9?E7O7m(3Nv{Y19xz4<pXZf>pU{`1MV~Y-{zwbN5{|8KV#OXP~74>H}*tU
zS^Dx__-mcJs+`R-R^7nUgK5rM1<w{+>=)8BFU&s{iEQnMT8>-&t^aYZ)-5#^dP!9;
zD}5+SLZlyDh%nfS#puq2az6ZEVy^=Bbnur}3)20j@tc$C{`pmGV5@KHU80g6PhC(B
zxmYWe>T?ls3;w8E_tXsb4|0bH0Qf$)853x8Y9lKn?cuS$mA>;n&%l0=7-(bwpb{S{
z)f4z5p;vKG7=FZsyeX7Qn3p8SjaDo*GUp^*j(mZF0{*BZa6z{CDljE%7;Jji0q4#H
z`Y*~SV@vP!t8cGM*~_@EJFrBGmPQlEwUfU9hj@CC`SC)cbj4|IEWhZb`DEU215;?L
zi1naQXEiqSkS1?WNYnykFi9Vdzn*iN3s*d~2e_B_juPx@@FxwEg`#dL-T1}Iy*ATp
zhR?@PR)akmG~Shi$Pb&MdEVn92aFX9xmlv^+3}dK_bIvri|0*%K8a_AzR4v7Jme>R
zg}>R4^;U^IC~Vwg-bWbs2iFy(Tdpg^;2OOkhQ6DP06+ks0B8X0*B1cE6PV)z=c~Th
zex>`y;sa_tMxF^zZZ<GwW&!Q>OP*3}6Ad~6Tsp81#1bHZ4qaQ>6`gPQ{sI7<)2$*b
zXk9|~slxK96;Ku^hkwvq-&^#ysqa;rnx5CK7=1iC^RP!6|7*~`)%v)ZJWjl1OX;(u
z>r>loA<*;S_jOetC7eqt-l4TACSHh)>RzdscdDL;x}}hdHg)n(e3Q-j-nb&7FE8-R
z-DG}@T~!L&&0FpRWRXNuxeOP&YRV`_%Bjkpy_{QI0zrK~uraPhZIP_wf_%<J3E@vp
zOJRVal=w2c!VD?F+pCs*5z+F-JX)rz?*7!0hhnb#)9rzWQZ_yQv^!R+V*RgT&erCa
z5gv2UC~<IA&ZCjTrFO7Knql)7jBY;QI8+XwH{I=@=(3fczA4Bo4pge(hoa@Usu%mT
zv0AaVp<~+ph(x=jYBDT0zjVvNz})*|Z`8IZ!C4q0#+4V_uEow^^<OwMtjl{uW?^l+
zUSi2%$X+(HL@Q;OMSmR+wSlwBUlT5d?}hmXkm$44W-Le=yOKJ_Yd|o7{E$v8!VM|e
z*4PP#Ni5ngFQmbxAvK<x7^QB%B}i&*(uG}YmGN@3Pt+7!1$h!sP0Ke^k=gtj)q?Vn
zAnk-S{Mh@v_x++%Lb8L7;KF~KrTftI-#*c@V(>}aL@{@}SCHszN&Q76IB_Q0NkqW5
zp6Mt3an8+0SmHRtHHH<pimx|=Z%gcg7(|a7E>eb2F65WLoEgg{du4<)P)lp(n_Vwr
z;K4{H6g8LQYMBBtZ%vW_KBn(Xwi;(zgDENvE{*nrC^AVs&pS@G-*F2O0l1^C!rZoY
z$W~5kCsM{7aEO3*!2mT*pth1&+<f<Sbo-SFtHtV2r<b6%{&sYAcG_|E{${uT{FBop
zwfueildd*rlOXC`@MA6Y!}R3|$(3N$rKqFvJsU{~P4Di0aEpGcVzce2uDImkEv%y4
zZ>KhctgR9!$MCI4J$tshq{w=;+xGNyX`{2c!c^`FUSAT1am9;o=iQVv6F%lNL~T#K
zYyjqVXBa7>kfOk0j-Rn*y7jcOoPuMgaX+fqUG!OAs}=VR)U^plx6Q~>w2mtjGRNQ)
z+1MJQb$3((sS2VENj6_0Gz<$gI${7Oj1*y!Oek12NUtJXRZJUPu_#~@-BxX}MO*Fs
zy0zC&`?CKk!|m$4VX-P*V*O~!e)-Dr>fA2DL}y8ooucz(j7&(o=N&2m-#VJ0z?R9N
z*fs&*I0TESp`Wb2-qJF?yW8bxeP(zDfeXGFZ%bv5P~KA1#xHS+RvH0j0LPm0g1Hrf
z5(@P6Hfte#AtV{p2Gwc8%fM232*as@1czIf5MeN=%nRf+TuC^#mY~b!^PLZBS@#6^
zqbj&xqx10ZYIkLg!{Vh6`+G9<JZhg+c}t!jW(ki8LJq!p-iQf1Rn`i+X`ZA#c{iH8
z8|dUwu?Lmt8_KZ^=?Ya2Ox&vFctF^aYlAjg2xIcR$&8S*;f7R(3rR(ICMuEhyba3-
zH;phEbFa~wFU?ZJ(m)06n#Qw8&|ib)lh*LvD}63K!0XMzbRLVTfA^^D!;#(m3ZLDi
zS-PBxe$BWY!Y_84KMtqs8&(PhKV1yfIPp+OPY_55{N)!`?yF^@scDlNj<4E*Y%hcA
z_<lAC>i7kPhf$SytU3$0ou^o!o5A|6xYyq0>msQ}+RZSsbtGKXiLY*V6Mv3=S6QNz
z)<aVikq?m8`Too;`w6Ra7I>Ox@A>m1Z0w)Q{p=WoR{Q#o%MN6eV_+v4)>3bq2<3{B
z)kT+c3P&BM`d&m-38Ej65d4%MeVJ4j{Ii*x4_w`cdCH4DFF6jGt4vJo@y7b*VWj)l
z*@tpN|3z@V?lSUi1*1m0jD01Lx4A)vAYPki{mO-45Jk$NW)Rb3pAu$jNb*{SR6{D-
z^b)2zWm_Yl7DW&dVH#`<7Up@FTpXp3zMR4lgAp5IU}~Z^K^Qi*$ynN))i;eXi9MxD
zzr!%BeT5-D8Dey>qN6<aR@Z&py_^G-3{*Af)9f56{fw4Eivn~jLIkwe>1IA=Xv5YV
z{jnqSd{Bdix&W9bUph8OXWh&kM7q<W2H;#$Gkb8*4ZKwl_uuL(0TP)5Oh}{uLJf=N
z>prH@0)1BP;AqoR-+iJg)3|X9xdIxm7~NATP`_?=cZP@K{1A93<f>wiawn8a%A}#u
zU*M`}t1PGC==Hbe1**#1I#~4CDyWsUb#&N#3@8>Bza}gBD@a#Xl(Wy6vYM&Y7u=2m
zdLH_v0#J@BXVzJ(kFB(4k571BZ;4RVOXqU@d>nc}{A-&QJOv%y-OM!#dZoWwNjI}M
zb<y?ttH$#5)@QJ*Gt4&B<w65h+DjW6n3dTpC^xi!=(AUKT7Cqt3w}O_aODZK0hZ?0
z^x`Ru)pA(3=8gMe+lVsMpv_)7)Z$FXX;DME=-kHW+wmGai4zOGW~`{)_Ny%!V_ZZT
z8lmuX`0Gjt68OnHpVwRA>Eo*jHd>APd-|I}>z%##=`@m~4u3Q_rVdMJUg+&EUiUoU
zt36_z_5mAJFr9i##wYl><0OhhJr!1kZ;d9)>97kkt)a*8%mB*mHvf`$2<dmJMVvCz
z0H9&y6$Qxi%?k`7V%0K1UTV(vh$K9Fg`#+h8lgg>b1%j`g?vN<I{-IjxG4ypu0|Td
zFpEegKAH#gLkgkxlZhW^UndJBLx>TIAM@U1y@ejP6Wyaq8@=uJ<ULQzWhV7%y_>eB
zcV&}*(OkT>inX|IJ$|%X-$wrcqe8qoM$MJ8?Vo26w2W`w`?75!rN3MzxM70O9;oH9
z14+{XKY&mS`L{hCBhP;-kHUGhAehX=ry!_s;{Y)Op&X9Ox^FR)$;+xp;xNt|q|GC6
z$%GDFi3i_9fx3Eg9WA70l#=r9H9W{is(Vlv7dH?+5*I@Y!DvY_X_K|hQ?n|K>rb_J
zj<N~)Sx3|nCJ>BJ57$9q&je2!p;i;D3Jt2tu}|(c%U_A9qVGv%_`WY@{zK4E3n#no
z1}ocw{&9Y<!(Bs&{?PaJ#6A-1CK#>#C`90T%f)6qsFyI`O{u}RKJjxrF--arXtAT$
zza^Q9(Ik?>a$Wz!LQr`=aLPW^U@1b<XxuICEWTI?M`g<Bf*x1+;a7O-FEc~+zn#2=
zD@jBWAiX9sXm^FmTavHBfE*U@vi#6?8d@OPHTx=6ZWN`Es+|dbR+OdZ_%nj3z<@G!
zBCK^OugKtaqhf8c9K4zzs?qpB!yQf5*IN9|O848?*XFcfc;==5$!FL}pWjDgo?oZ>
z%a28fG^5)0gd6EE?B)Q^0yWdnwCT^;^*kckWg5Z)h^sHB5r4+ApLM<;&cb?{2o4Tb
z<3M~7g%(9bSqF%H1_}YGX~!-9Pb;M0_fmz?bS9ym3K>%BAd2t*udzovpO^lFKSaJ>
zczm)?^nCTdf7`D|ncIn~?s<o1%#lru^FK>CLMJk9Z`r_D;SAHu8YzSE2Syt2h!Y1S
z>^mfjDF*1|<07^x)XPBf#+`rsDaqUHZM#|++|q5kJ&Eh*sM1uYe_t9bd&S)PnwJZZ
zai9G6FmzYzxbggYr*xk6_TzE<Uk(zz-lOo*zjHKgg@qHhpPx?wuS=usZz@4%N{*F?
z5tJCISQ=ak(-!+Gk1wN+ANOx9lI~CaLcJezNJMrH{?`#q-5*CG_k?eA=BWn<sejT+
zXZ=zBLO#89yqfA{tR;R)H<2vQkW)yIj#j*XzPxpITt*Nm^~F<FqoyY0m101l^5{9n
zoD=$9M3-k}f|ae7fVtm>G5p=Ev1zqW6%^=W%n@`tXcn0{6@{`2%j~tML)78C$4J~k
zWDQG6lASZU^ppNg=QN1e#}gLjZZaivlZ%!{xUJWG3^AwCt(Y<y4YDQDRZR%wa&+R5
zO?i3ZWZz;-PXgb_^HFjc?7ou%;fnq|alyRT9PDo{0I$6K!ED)athF5}+79yBlvOES
zP&pwiRZ06%QE3sHvH)lZY*716!{R9zmdg2aRNS=7VMZ8YF^ZBH!CUM+NT86w0=(4|
zsE-$+RTmYc4*!N?Hh&PEG4Q*~9n;EeL0}2;zPg9{0`0A^VrfAtFRsCI_+a*?H`DxH
z6ilZNw!Q`7c?idyQg#~K{-MX}R;Po1B2A1BWh$cP*lB(IC387SKbrImo;T<P8JX;L
zt^AriMuvqK9P|fvY;+_b{N7E)7@1mcMqA#K)n;XazIx;cG$)gwf<$6oG8S>41XIlu
ziHv1an{du^U2q%0G6f|>>-JY4`fC!AHDxE-mt(Ybv}KZ?1ztAj-L8Eo^YE7HcIL3^
za9(j6<*hP)5yI%$@&w|_xTu^Jim>%B2-=KedMx-wkf3A+R3b<ikv&oJlLDnVs#V^Z
zHqt2W35&hp0RBx*2E{#Z;O{}**G_m_<SIp6&YUR*<YnP`UXScZ;Mm*}T{#39dH`(m
z+NG{{S8sF4m$swmy0gF0$z0H#UZt(YJrVcPM_iszOFxco4DIn+VmR*8yH87PMn}2h
ziEx0N+*hBfjP0tc9Zp&uM$44V`i#z!%f5sF(z?+)w9N?{mSfJ|@K#^P(hGs(`kMc5
zd%F44>qUFLjk@4i&Kb$xVDq#6<$61Uk6I2cw_fLU`&!qnro-NvW-FB>FRAA&P6m-q
zzxjzCt0u>T()H2xhU-`iP+BT42lVsk)7v0qNK9<#x5Nc7={pDRR|n#~-X0v&gxSe@
zu9HCdm5O7gRR`W{3;LH2>VJUNt(jxg@;<^4p!jCw?Bu&es2|g-+(q2Vo{BddzYiK7
zg+-aSNhd;X5eOv@(n6kC>23woy(4x@gI%AyU3u89vC=!xK2KGfTZ5Mjlk%&W3kEMN
zkIHfGKKWcBBE%tNP?0EiZs);WJ~dat0EP2Z;Z?>!Y-McIsZAg8k$~}z11+QjzF5eD
ztgi2v<FNu>HfgMzNYLl(_q4xfZR#W8`o>zvi*{{l__D_&aJ5;`uGBp^^<JIr*HIFA
zH%#e(ur66HDl5ncoD|RS)99JnP{Xd_m2*}_Us$m4NKf+qpUc<-J6wf-v*XQP@)aO&
z;2=+^=IFR=iMEFz1VQlgLqz0`;<@0Wr;Y<EJJd^I{^o7Q6BJEfApIaup!y{=8%;s!
z71>e3H4Q4Q8Nj2YVAP6TFVg)kK=b~zVIbA+QKQXW;&9QNl{8l0Y^<$k={vZ8L@tUx
zPXc%RPP5uPgZSA8hq?y-LP=L@PPY9Z8n^s4{967qCcK<jyB(SP+ZoxBLF;;0)N0A6
zaJ-wY3+U(EdFxPt*<Y&QV&HM}*Pq^%ZZw9Tl5Jp)8KyPl<nM$tIQ>SEz^HW$cU)RL
zVG$c65%v8U<)Uz_3Q@R?CKC0l2=;TNNE%j+nF(qXv2mFJ68>VfKu|JZfS2BzP1tg&
z8`MN6t}Orjy=1%dW~J_r<UA(#`u4cgdkU?v%{5-r$-ikAn1eKas02LW;q=z!X~+yP
ztYCS|HJ8;%1!77vV#|Mpxm>wzC91Ie(Y>qeLN}uY*dDssbWIu9R&i{9@ao-ma{#}v
zyVj*}MWFQ49EcvF@L8Wkn`Mk03_1?!U*(lBnXTmSj5&~-dF->?5_K;#QX7vCFSy+J
zU_U17FIpcDJ^x(ym=}q!o4j;2lUdFJrN-~a?!l2q!F`;ewmtf;myGG}4(~TR1eVU3
zT)#h$k3$Kb#!IXIw+_hPVkh1G!9^^hUn__a92Fu7DNLBHbn?=JWB#g8KAUnTW^k(r
z&H>x6k(rt?APL8%4<L(m?^OuGn5x<jW3E7?z{5_B5WPxHR~Z_cX8I!A1_f|f4>7JL
z1^6mNl-WnOgOq2ruNEI7LzN|U4uS04$NH<aodkymisrRcI6OK5_wLcl3OoI_Bthfp
ziH5V1_ct`6f6*AL9)5)yDxOp2W4Q)5&)w_qt}>7Jm6V)*)jq#&q0XtE0g3PF(i}hZ
z+)bvlc01M|H&+Lm-X5h8-Cglx&zBFv7q{9><%sJJ;vK6UklFWIZWLrHvl69iHTAkI
zrlZUmJTAK#>Pdbt*RPMfu>18&XItrHT3*A{N(343r$L%$QO&1YZ*w7Nd%|3K+<Qz*
ztE6xib@mojP18P}I9jSEiNasx8P-;vJrSNXjCGuiZ9doxo@8jm=MZwxteyrjLjDVG
z<dd61JJ2}LNW`Kj4z_DsLL$2@;0mn>nXsqqVB=P>7QRt!g=$m6K5!I)f$-i(`T<fI
zsC=kPi=3BtN5eBOb|-ajz90@}XJGuRuDlK!AzT@Ks^Y@M=S)`aQb-DpvaPBt)Hbux
zsgShcohCJvLn3ay@`Pybl?hP`Cf`GIGQeNVC@Sx=wf)^#V}Uh?i#`}JyHM0y5cwlP
zxCxRWSt3j{9rv-*4rvBdB~x2kr~*N$!d=Oz2Bv*Anl}d{ud}>Y(@i@=;i@8QOMoW(
zl8NT`#f6=g%tUVRN`CO0__dk$8AJfiXt;qxC-&9Oxa-xJTLjbBp0oW^_Ib#>o}r(G
zkyuE}?#&;hdwgvTmp_d}n;u&c)0?V|HUYOY4M72$4F`EpX*v~c#fMT?4OLW%^A(Pl
z4lB&pf2;I*B~k;vuA13;Uvh|QMl4o*AJmX8&>H5}MQo1kgGW9HHG~`KdXXpZ@PK?y
z%s`oD9J{47R#d7cS1?D-DRd<q=Bjtr=@cM+8{e(KB~K&2RpP|WJ!&y$k~QVX!s5o}
ztTxY26LV83A2kpzW+_(OhEBG(Ls$C?6-MbBUDVxI3RxxFEGzDCyaxnRG+L*E)BOXi
z*8M>8dE?IC^JIZQOq5A#iSKJ}qhF#bak8M-yCg`|mmnb}UHZfj91Nq`dc0i4l?Cl3
z?VCUpLKI`_O($<PL1OG9UsMV{)@SG}i`r4m830S}sM)3B;pM6W&Zy;UN6o0aNg3X|
z4`xYy{?Iy(i3+s&ExFe$w;=cr{dA@WH-@!6qS2zHqRf9X<RSJrzROMa)PauO<bOF-
zQ?85`8LB`KV?T4Tcm%>B>hreeLtXM0+44&B<};AIs!9rVtsxzjl`=pWAm8_UKtjP!
z6qprkGRJ<%$2hQ9Ei^D41jl1YOYDHR{hS3q5_v9P$d~0>e!@Uxi>TEX=@R#%50aj-
z4H7iLj(&WWbXBIq4@IyINFo}2<zEQ*VMCrH?vDrZ)8wPgHn?Tl+FBzGy{inC_d%hl
z&b|#W@F@E%WC&$>C#C6tD1kiH9Sd)A4zT|VUb5yj|8?^8)rlhD75MZ+BwZ_Z>uK4;
z-&f1>=!cO1QSDR7(N)|1fa$ufZi~R<Knb7w=g7ntWn{Jq)$$V8?O^EgTIS~3*dJe#
zDB@cQ7JL19<<v1nH45@wfQBgLYQF6Aj4#-pxDY#XNQH_%ghh4(9v)`EpbgMH4dJeS
zy$MH7_pa3RPdd^1Lbc9_DZ`{e^$uEf5K<lJy!?4a>Og#^K@&5{&MUJ$H0dlI`Z%Ff
zCHQ~?$`ficO)ILfq&66=@9QeDmnuIJGzSw(zj(OB%VPV=YLH6JFi6FNXq0F@r#I(F
z)+8DV&5%Xnu!aADN0HgK-8uf7p)lwS@?DeGyt~x&@Csi=5p%eoIUA`0gqa4SYGs=3
zrj>sF?J_XpHm7`Zv<I!ki|nSBgQA|clBtZZ@O&@X(9#(QUj4EN+Or1d`T4d_wcjkS
zKK+tvc1zp%4v|J>c9KL<ju4+_-9JHXsolkTfxgS(9&>{WVBPJqE}6eg<a)~%dtmt2
zc)jVSpf%=}Z&26X>2Oj%$<W21+s7JGcRVg%q+=1M$2O5E*(~1;IFPW{lJhHHO)we6
ze^{I0zSHUmyO{7lk6N}}^|iCUC_E%?8uq#6C~dZlvp>fT**MlJAAITQ^ZE_e<{#>+
zD-9pm2!!&^#^dmaFG^)bpe^NQ_RWiSkw<MyLB>MDulk#7O?@Hq*vGpQw;RTy<rP)r
z6x`Ex53&T2xWyF;me_v0olgO|hW+H0a9hqUa~BHFAkY?niT0^<(`1}pMxF>Ez^^Pz
z*GzKKzyT*If9FJsi3a_YR)ix>yl2`aE0UZeQz?>dPpnWJ_xGg%n`v0*8UwUzBt#7E
z&MPK{%lBZrMn0ti4UUucHDp2y@w~w<6xgekh<RBSzKWqXwHaqs*o0h@0*41te%h3u
znH($|uSm8j-Fy>Sty-qLKNLntkrw8Ya)p;Rl;RbJR<fjTna4_l(;p0ODstp1p2glw
zJT6v&U2k^=N~NGO=nN_bqDE;ef=0IErbcOY(?*9-2i^KYx12DEjn$eCb-SAC&a+c!
zamscl*l72|i_wu<BLa-O%mzU7X_=91=ky~?4#y{u&|X|`!*-ag2fYd>QVb{03ERxK
z<P!yrq?1SlPa|uq0=oQ8uIm@(7R1`SYU3C;;mYjh=fPq0jXt$4H<v9?i2=)O8{Oe*
zkLt&Plztf4cBoQr@)``EC-culf<h=H8Nm*L5kgsf)Cdz9?&yf?8rNfDfg!}gF>mUh
zIGD7Qh#<oFvLkIo<9##Wj~E_{U}dh5-V(~1&NnuVc9x_X+ft3<mTBAK<j1P!bV+*G
zNMO%uW9II+6){mHxG2h@BM&4W<T0k|XjbCRuxA6OYRDJZ5n^0|80nGznJppi;@VL0
z@+)JEb$>|t7e|-{Ns=Syi`(y?`Kd@n3A2xej*%v;sfuYUq(`cL7Gv)+;YV#dp#i1Y
zL)&3-;5L}68&NzFIfgwa9<vXbbZ?%>RQ-h6)LDRG`~WRk9YAOUF%=z++h;YqSg4Ey
zc89Rbs`hcP1n!z=$1fRgt_%Y@y(ZK1(}<gP?yarxJVLBFC-X0E*u$o6GQooeXB<sG
z((0D=I!hz;?!XK>xxN+G%l(3>-ZD+UA;Hpi;h(M%<r1qN+`FhujS+>+%?U*^46?2B
z7b=e`S1hh)IEuWkSLXByz)?XHqML~s$WE|ridRn$cBWVLluPE<*b<N6oKxMyTjb=;
zvbCrSv5Xz{{89k$Iql|N5suu=TW95jNv%vywyl63DB)+-=By@xNbP{+#%Di<13E=N
zp2G`9_BjonshE!j{?a&o5B`StmYw@7|0cD@I_BTMYjTpZMkDlv!{;G!JDhi#9Z-DN
zT740Mq`mHF9U2fgK3uYZgYxPzur*el)9HTU+upt|W7!zfp5kq_oO&Eq(6f;lHW%Hq
zSoM~aH-qR7!f55sGKpzDV~6~R<Okul+SGTEzlvVO`4PmaD`UN8QLum0-vl307ozGQ
z1MLLYzy!u1yN|*fH$k-Fdk00|zZtNP@+c_xe)RhAC1cL3Ks~nLgw}lK-&k8&T57Z9
zSbTN)HpyEwWW!p%Dd`>G)#f+)LM9*}HFdS}x%-PylC|5kUMl35l#e%I95|7=?)7Yj
zM$ZGT@NmNKVJ=p4%yG7Z7^~s~Xr?yGs*dLf;<TNg{<^efR#6L`^hv2)gtFpXX0U8C
z$!Vp_g^$@`D&T?~F_nG4yVX=CjNc=$m#O|-og{k&VuwqOU9li7XL`k^RSd@AeWA0)
z$wM)WU3-VkGq(QX^}7zk>KJMWRZhzfS0)T@+6z`C4yP{p1+63neL9qd_|Axf!m{xS
z+Zj8LwyVpkxOXicYa7*uKAS`^U`39DW!x6!sV`Q8h`(NDSghOd0rUhpzEVn4Ot{B_
zk_lb`keTr}Wmu>*X+Qu8XU#)p!*YV?gNoKnaR2^6J^KJzJqpZP(EMRgGpHJ!yqIK&
zwVZOu%Fx<WijApDIv5IvoN%3coqLHAIXca&Q+A3G`Me&srPl+KAo}MJ;SBHfp%HDu
zg2P)ID9In!I6(;whGO<ALkNUoGod=ZxPRQQq<C`cd2^UAXjhYznV6oe=O$gGWEDz2
zi&zY<7ZuC!21y4!0k8$fOpm4-B3Iicp2^Q3O02iFy+*y}QR%)M^0wSl@Vb>;kUT2x
zrly`}%FPYQMIF&I5=+v9@G({sftCE`2XOEtj5fvZ%BevQ{FeM=FHs{AyT)iN0*<-_
z`bR@-#H5Y9EHv?-&N8zw{l;VyWxzNcE)rwGHW+r2vk5b(41Sp3m1Mi)i`6EQ&BdcQ
zD&MyMO^XkgO<!&Ept=J@vd87Nz<K0EVcDfZo0-7vc9W5=%h!fewXQ3YR}3?Vw=yT_
zSB+xP8GIUf4{JLL`$Q4M#APvsc+S-fy!`pZz11xwY_0-Aoyyv~{r+zx9lv<W$si-k
zY(fG0x1s88f7v?$NH*vJ?&&DBNAxe~V{{N0>upqc2Z7x0V%DIPfEbh2+$=F~yNs^6
z1fhkg8PEU8O2_{Yvga&zNLy@ZPT_SqF(*-Dl3=?Fj^$^!TI*g2N#<f=j5{*zzo)t8
zp3xz>A6`tUU!NA6lcTIA=%)Fyz};QQ1vJ6JoM~Sv`N`cwOoh$zo2X((=J6y(za}aS
zF(Jm@pdGiFlFZ^1NA1a)ebXQQ8BCI&j$Q)74YKSAgw&Zf93wp2VPm0gV!^1oaC=Gv
zL-i)&2+9NF@0i;Z^$N%H0FlL1@#fJ48OEj3h4ZI6)W55-Ka)XM1HP-D6`icApZE+C
zX9qcY0f%RqJdLAIjlVrWFM+EsLkWg$zjCcm_}jf!Ci*X3_Kz^(7|tK@44-e%a?S}v
zPh_#LWDigS^yce$*XW5FDtvLw5^@tDUoxv-xE{A=)Nu{k%vAJBk_^qJbI&t~kLO{l
zx@%PC)`Vv0x|rmh<fmG&XwtJZ9d%lX<tpq9yF88Cnz#+=;W#5EFw$E)oc5FSXZdEf
zZ1PZS5YuE{BqC+-^?PX*ZoIJ)4rE<mZdcrAyapZi)~Cp%Mj0O+sNNi>-7fP9$(nI)
zBcXb12a-n=#(l@0Vr0n^uF{E$L}nC51qcIw{^eq4#>5x%RF^3dgF__1TWfjytyUj!
zjKNnles}hEwq#Y7+i5-AxB02(n2E5lCW%S7xrV~`uyncZznINWgu%C*K-hlLuC|ud
zk#wEZ{L#o_gXj-C3CcM{RcH*-jKU7L2j}EuNh(kgyHX=O6^>dL8NCou+gFaZ<)ids
z_Kaz5TqyavJal(o%uEh{QV%VVd0tBOQxJ6IXxo>!ZtK1cxcw}hlb?Kdq&#uUTk4a5
z14fS)=*G^&*a*8MhF7;%uSG(?Cq{~)$S8sO4nAJN7p2ZXgJ_a8daV5!b92K}x+T+M
z@>7^ivDeqh_`NnR{|uAilRrNNS2I9uL(Rl`Y9vPVuV+6vTM|xAQFeue8H$iDCp;2y
z93^W4ee2RZvrf51ilJB{9v5hM{RkQ6{4EPaASfNX9j@!&rh;paCRE%tSQ;dgHQzx5
zy!I*>BK1jXMz;y<P|{+9LsU7r<RNCYIGs5=;j1(@=<pbVg=JF@T#sf2#%!Tp+mX4H
zb^FjJSJG0JSkI`GRIu@3i`R=$<|THrBzUo)>L=OfFkOO?PMM8P6a6Ae;)Px=>W$hh
z9&Gd48BM&_5*%f@y<E3AL`0hql{Hzt_RpKt0JM8VLhYxp-WRFk#BNlAg)8*SuYs-5
z*=-jFf_Wp?nw{|-f3iVUD+yncNt!Hoj0&@iUPH*H!X2+LqHsl!D^zj6@F$QwkVmr8
z!Lfx@2wzKUl#}UeioNV>Q$_PdPb>rY!Vp%wjDu_zRpN)kq^wWIWD`IV>?uk}OG>(D
z3N{mi|CFH_KE<J2j!XH^Jd3+GnYfVNMo)MIVeTy6SW{?|6tg8%_OnSv-`}iv9CGw*
z!TIQ`prQ+Z(;4UUZn&H8vCqdhzBa5zOa>MA&iZt|ui;Vzmyq4>TAjiFv{tFBwOT95
zh1tvHsp6Uzy`B|l{4SxG{6c=5ayde$M{0F6)YbUc>f*om4(tkELP-X3y36D&{P_^3
zXNy&JVVgZT`=~lP)Dks?Bj<3H+uK>oJH075tAeEQMI@-@dH3BU_FsRPnURr^E|n_J
zu$#np@0S*&10p2y%GZ+-SY%HcO%t@Z3v=Kw4^D<KIzT7|#_#|6Y#RYUxW~r=VKV@r
z699t$#acAc9_a@_{1A?W#Z8nZHVVC2$+t7>gHM5h6b(Iv9D$^SEQMruLonI^u%+V|
ztAa@*MeAy?cgqENa+p$s5s|^6fq`+M%|PZea%Qjtm~;?GzXJmRm;eiaD_{(S6vP{p
z7*rCp4vZEo8tfjN8(bGW5P}kdAEE^k719cF2#OKP4k{E12-N}&4=oN|4Fe5h0^<*p
z0@DVw0P_xu3(F3x2pbK13>OYJ1rG^t0N(^Z0l$p^iXe_Kf+&cDj^vGuj_ibdh{B69
zgUXHSk6MQYiAIg4kJg1wkHL;nh>49Eig}MEh~<nmfDOR*#6HE*#o5Hg#}&lQ!hOZF
zz}v@9!@ne8CvYIBBxoa8B4j4?CcGx1B{CyQBPJ&f{J;5@Hs|gq9s+>I8YRI+s$r9f
z$O9-~L1F*PZL_*k3?3JHfC1ksgLN7z^?tb+P4;js8defJ4}*-$gaM~9NqR7UlBM_v
z8HqKk{7Jzm{ws?&%)MF)ruTV!Uj9+8_qmTF`=i5oxP1Yk<lX%I+nbLPWZ-(yv@!U{
z6`ZdRf3RNL*$v_OpcYJm$|wI0%x*1O4<u2D+%vB)=oV!clHtG;3{hX%wcG&LHnzXg
z^WpK)EcuQY_vRZ$Q7k3Vj^f2f<~6h+ULI8!RK%VmDq+#P{Q%mK5T!4ILqfoJn8+I<
zn5&RHd~#pFXmbBFf+x=l$xilOYjQ8DU}!qj*2lf#->Xd@Vnu~Z`?^2Wx!PCN>9Z@m
zXjB>$Q}QY!#8a*_pK+S2Z0*;SSY=9i)59{*yy0v=*i-M<q1KaJF2KAo@6JC5KT{Cj
z8nHU+bTf#HBMoS~lRlg4<WS`NNO}j>M}Bd)(oxwKiM6o3uu48zaoVnP>LDEAto=1P
zvfC-4>s*~%V)@H?Sn#ukRTqYLY=~|>GWA>>jh!+m>X)`SopY`Ef?9#RQ|fuC=#nhA
z<2Ab!Mw}r|=)AwViMU5hd`!7~jqPn1l!&%aAcaJRL;7i#h5}((aE8=6%_=;IJj2@D
z{z2GZU3i<*E*ta~>zwZ2Rf_nTe4@3O8Gj@R1bnIWG_^_@LzhWR$|4sP0IY^@-hbio
zabi&)qII_sBsE%o)6p%OKbk3}KB~tLE4OjZa;Q)%m?tS#(0OF4;E#03oh~4|M!u(5
z7&9N8pZ*K?AT~nu*dgQ>c7=s>zBVG+?hK7=po-+*^wOn}g)hWq<>v{4B?7Uerpq5{
z?Bk0wj9YVb(kOp{zrbvx+Ctx>`E2~VDp*Ik`bz@@;WfG33nQlL80bPsav+~-;Y37e
z&_F=XwAQ_CM_&W#R!$q`Xa<Qcs|7r;O+k@!Rc*Lr{Dj@)8r#m#+4BhViQ>VrpnJpm
zi#Cl?l3*0B^hYWDbF+0?6^OGN-;I7gS`dL)BKIh{IOQ&h1Z*6P$G$Am)>FPR{HYL}
zd3?Rj>>+?AU>d?XPOo*L5^_4jJlt&}FiLQxE$XX`Kbmu5f447D)@`;G|0c^JB}i5U
zam3<UxEnoYGgj3Ky#dinp;Kd<VNg*O{{(CAyrGm?>woyxHtz;}qGRTdVz^7$>&R~8
z)R0}{(VV~DsL0t!Rv12pez@9Br*!@0xq8q&z0>R5c~i5Z7Q{O3f<K>wYvHB^A$EV!
zMQE4-QdwL};oP-@nfTSC8J3hr*Xm0r#O`xDr*3^2qhM>Ok$~5ugP^C{BE|(JRIGEO
z@OgxD@r84?kQw*16P_`|I*D}9X;k{Q`HAH5<`~}0o%O$(Y5@rO@`pcw&mhJC&?JB|
zcmmh^@+a$}ekIFf|3t%z+?ZO-!n3KG=qu>X;p12lQGy)Wjk>OzNd&L=%$aOH2os?f
zB*4HyAw-TbR20of02@Nx-rF&=1gQt_2MnREF&7Z`0me*Lrl7g9U>w-lHmoq)W~-fw
pR`<yZBpV0g4g>KfVYs}LnaMgIAt51_*W_Wa07D?uxZef%{{YJ+H5LE>

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-1-8143b877.woff b/packages/icons/fonts/fabric-icons-1-8143b877.woff
new file mode 100644
index 0000000000000000000000000000000000000000..fe7c22bc320972ae5c51846a86aa62b694fe317f
GIT binary patch
literal 11236
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

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-1-a86438ef.woff b/packages/icons/fonts/fabric-icons-1-a86438ef.woff
deleted file mode 100644
index 5a7ffad2bd4a2d466eb4f9e72079d689eae3d69e..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 11900
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
V2n`Ljv?>jU1?UH({Qi}I{~yM8;XeQX

diff --git a/packages/icons/fonts/fabric-icons-10-380f2273.woff b/packages/icons/fonts/fabric-icons-10-380f2273.woff
new file mode 100644
index 0000000000000000000000000000000000000000..c99c4089837097cf61fbcc802fede21136cb674a
GIT binary patch
literal 11228
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

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-10-90d2dc10.woff b/packages/icons/fonts/fabric-icons-10-90d2dc10.woff
deleted file mode 100644
index 00dbeb3167aac8a9f694151dc6b3017cd1d17588..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 10640
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
NIDi2lE&k^P{6BhQDop?Y

diff --git a/packages/icons/fonts/fabric-icons-11-18d2ffa4.woff b/packages/icons/fonts/fabric-icons-11-18d2ffa4.woff
deleted file mode 100644
index 25023cd56faab0bf8e560bf818801f43b792809a..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 14500
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

diff --git a/packages/icons/fonts/fabric-icons-11-2c5983e3.woff b/packages/icons/fonts/fabric-icons-11-2c5983e3.woff
new file mode 100644
index 0000000000000000000000000000000000000000..44b19270a3f9f692d2fb8ffc46ece027c38a9a4d
GIT binary patch
literal 14108
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
AasU7T

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-12-6c96597e.woff b/packages/icons/fonts/fabric-icons-12-6c96597e.woff
deleted file mode 100644
index 7c86dbea9d017f2ee0450d93bee09c0e1c5c9bc3..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 14384
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
L2t@H;q22!hu{?)p

diff --git a/packages/icons/fonts/fabric-icons-12-e5eef780.woff b/packages/icons/fonts/fabric-icons-12-e5eef780.woff
new file mode 100644
index 0000000000000000000000000000000000000000..b6de8cc418d34005e321f54ef82432b49ed842d4
GIT binary patch
literal 15100
zcmZ8|b8sik_w^_C#<p!c8{4*R+u3Ae+qUg&Y}>Z&H_!L?-`iEE?%dP2F}J3AX1e;g
z$%%>rfB-**>jUuXKWnrA0Io*)@9O_Aa!T|}005Bi4=?@$eZC>@S|b|+`yVdy$M^oR
z^>xi<@J6oA1ONaq<PY~_0aQ?{P&KCZW;Q<@#gBjU6Q}W!eH3kG;PlfL1mlN;{U0C!
z*k;xqrav4B0Kgaq04Tyfjv;`Vn-~}a04$Y1F>L>VRC$`k{D=JE4t{*BACRz5F<_b7
zIJ*M?tUoTm<p&=x(x`gYc1AyOtUo+p;y+ZS_xRfwxc`jH_TPQr{eS>)529~tU}N&b
z{fq<h1OPz2#b?|o+1oie|KvscC+5F=5PT~DHtZcue%f;V0Pyz*^X^@DzuYs8^moII
zGJAW+dV9Gd7E=QP6tD!D^^C=hkoNRV4h@YBK|#O?5cCBA+xlQ&;Gy(zdZZk^-jJgJ
z)nVXWN(P3XiD^R8{MV1ZzNx=HCb%d#f;z|nW8f<dEV6$iFhV^8gLm4K$x_Oy-jR3O
zyUA9{s~(!S#*4{p%Aj7d_v-s$pW5H=?*J++`%?Ai!@d;s?{6n|#}=m+M|O}?&nwL<
zvMZ`9=qsixq$|ZMeOvs}OLrh*Yy;MQTmZnDfal?7>={Ey6AFEEef7bS-j&{qUU&aK
zpa@6=0H7QPBFQ~dC#FZXUjTN<iKH=@T!4!(%Y{lPDJ<*sj}*xQDJkr6k^h2Z;kAEa
z$RNn{o-O9RA>;(&7hQAD^qY5&Q_1V7w`*pR7!{>zCi`yg0?e<o%e2o|Lb+=;69ef*
z57lRrK1-;4D_QhMnOgIana5;l8$A5xOj^T~!RVVg`?)`|XEp%W(w<@5Jr$n#LE>Pf
zZMj>YNU66b8r47Z5oDDh&$<owr9jeyM#%0DSO|V2h5RmN$otluChNVjPJzNXW5CbC
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

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-13-02c4bea1.woff b/packages/icons/fonts/fabric-icons-13-02c4bea1.woff
deleted file mode 100644
index 19f7eb179058966ad7694d857ecf24048e849443..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 15084
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

diff --git a/packages/icons/fonts/fabric-icons-13-be3ab2c9.woff b/packages/icons/fonts/fabric-icons-13-be3ab2c9.woff
new file mode 100644
index 0000000000000000000000000000000000000000..53b550fb058dda9c436bfc2739155c8e6d8dc3c0
GIT binary patch
literal 12140
zcmZ8{b8si!^YtgTZQHi(WMkX5ZEtKl*=%gvHa50xym`LA|K6@Tb*E3AzV}ww%$=#8
zc2^J=2LJ(njKKx~|KF(F2>||!`rp<6Zwkr`%m4t8=npUX0|Nnl-#^B-h7Lbm%n!%_
z01)b#`}t{OHy1(x0J!l-^D_ddq1K>k%pA;Zf4IdT|K>-l`H_1RXKv{H6ALo<!@>R!
zkN_NW8&9(zZWaI_^8x^*%Y7Q2K`l%TO#lEY*&hwt57<9lX4ou#$R94`$H)EwDZ(`*
zh=r|-#}AkP<BR=Z8Z8or&BosNKi$cXKlvX{<=$m&4LyF=rT%Y!_&*>7>;uEv8QPlu
za6kJ4c>(~S-V(EJlpXAyT>t?3|Kd>p(|s!eHXWQye`4u(e*DNEEO>O?!FyyI8yJ4~
zaRvsa1O~dIS22Nr6tRYwb&viYCLQb>A0HYWgan5bB<u|UboW6+!@}#6^{6@qydow7
z{fPtXS2i&C$;>8Xzen~^LYwq}A>ts%E#WpKzD6V!s92Q;s+v_yiTfT_yfiY>g~|<J
ze-1K;5RyOQ`4ztKh_M_J9h`2^2)(0+p!5!GviHlZEHe}>fp;uUT_<(#Z{65q*8M;H
zb0#Rsz?Zd2bT{TvL<r7NB6#PJB3S2`{p=l51dmY?{QHnH-hD0xk1-m(`!GlHbdx9q
z+4}^2tup@V6>!@{a@!^LN9zvoMwyN#3GXI_ceY}r*t1UhlS2B_sQrlA{wMbjW&az6
z@A`ehV0B&+(~LnFWDj9n%gqfJbI)jB8zTgq)gf-T+A!O}+ECR=L+pkKBXFb%s*qg~
zy3TTOvP#7$r(_NEB1qE!S7Q!@L7yyydrRh{f1Re^i85`_&b~rdk09<G%M(9I|H=2P
z5u_=lfrWv_&}i>!??taiKp#*vBq9J%i3^e9k*yowBR?PrJM2u_7(yY)O_bwGEs_$E
za~dW?x=2O_dt4H*C|!IVkQ_P$GP7rgb#DYYiS$L^+%xm$)8kzBI_Be+T_QnErIyXH
zo4*JHe|DMi`AVd4&2DNayX2|%Y}#i9RcI}b@hDeoF*^I0Dr<{R(40+Ylr|K1Gw(1T
zCVyrNa4YW_!P`^iO&lT#LEcul^^K8vYob*PTZktA1M;lba9<82J7kRF@qmr!KUyr{
zYL2pR!)3bBEAJd6nl}#oESeeeE)(znn4kC^_HH}cQzi5$xA}nn5N_BPR9lc{zM%+(
zZSV>o@?kOz00IC5AOX<d-v9)U>?t2_AC<$5oA=y_Y*;CBS@I+)@-fn+q%qP!9f~9(
zQqm+C_d|4`3;>#v9W-?iAtAotO_)}}a$%!PU#(y4YW3yYQl+iVzq}r|l`Cm2f7@4^
z3ayTRevMBXm-HEvp7(q+-qRVf<Pm94@p4XA$DP;r{Ljapc^smI=1>V&N!P^0N|2G9
zpVI-`rvfxz%(sO%h1~(8?n4A`iH#Ax3gB0$aPTj7<YPqidqiTzz}@#9pY&|FcO6T$
z7YOgl9N3M@WG5;)H<zYxeyD}9iA=&!OY_f>>zMzfTZY4K+2{@_m|ziBZ&zREV1DhK
z)wbp<q@BUP4pj0097^m|>K5|vG!20y>C1pgmWNjzJ)HEQWAqpefF%Ed!i4_)AZj@~
z$U@1--lpu`2lC*>GBLW(oQ;Re<KP}6OhXDll4}6c7!yda7y$QCKi>w+c}wEsPWrtQ
z_DO@E50?>PB}X7gn#Y0oHTDlB0T{qu94dQ3nuXYbSO?Q9#q5wsIq&o|f%$I+KFUfb
zX{?;wvcE&6#3}~QDEz>i9^_yhvabf{97`}G*%9&VDLe;Yc?Qmy@BkN%NRbJ-N|O24
zauol-a@PqwAup(*LX?a}l0j2gO(ct+t(@8l32u2VKlo@?FiFATm<zOtcl2~|&*}`Z
zf6CQifGByEHxJQb-2HfM@owC~Ir@$1*yUmSI{S8;Zo}Vy&r1mzR7s1<r^E2+fmdOG
zjcx*m!v?x3bp^xR6l3W{+R9hCELA1?`?UJcL;sWEx>C1{fY(`aZ7^QM#{H$+bMgyM
zU>w;3w%XKRy;U-w&`%?@4ej+=wLLghv;zq2XkxI1aUGVIGWAtO6`L?XaD@7AvtCi2
zNMLqBH9*l6p77}QL6QSSYmQG|nuu!Jwmgpoq@tc4MTK7!Z&p1Yjb0w1r<E>JS3xt4
zimI+Ywa&wGm1pwKR^1m9-4|^~ZdgtO@ZQV=^F5v$^b4FPWt);*Qd1!}+l;D?-o?1`
zd6)6(pB42Fa<aD`NbQf5<Qwy!N0fLjQV`Q&98(=gbifhlS~USO#sa?$+`<QM7E@eF
z_><D#2LwCFEhqu9SKbiUDXA>f37Lk!E<}yu^isS4t{7Hj9-ZLdraad%4hed|K)>~o
ziqd@d>n>TAT6G~#<<TFg6}6OP9@AOe-e8Z|n$^*eKC@m735<bb;2055!`?vamwH(b
zj;W~_jvQqs^XZRDvJYH>{Z+8vQ^|ca;Bsx73PkX~Q-AH;5ys$2lJi`$3g@6&P=;6R
zA#p{Aad!MtW=BJY7>=-h0Ow{Eoe+=Y%<q|$9}Cglyg4UM3Jj4({fl%WN0?a3#LyM!
z`Wf)4g&ANtZKnUtC^%u)O=*GN5;=%$!3D;TbDQY3!yDwgAqKM~iH6t|fbtNUX&*tT
zSk5Ip;C9A(kjW>;;SfhDtfM)?Ss+p<9xk7zolcLjJRGjEs0bMe@Xq9;Ln!tG9w~eD
zdkYQ`*GB<2o32yjF+YNY8rA*7GH1V<QcOQZ9vZL!$PmYd`y<{PgbJ)DG7a@|fIbb@
z&bkMrLgU7S2_+8DB^6=?BE-T*jsg}T7hVhWV`M7!H^}#gJy{jVf6n9Eh)0*`li_UH
zb$1!C78W@F4*V*BY@xe=4)hz}j#4<xd&ol*2nwS#k7U}SJdv|Qkmbu9dM%8SrGTSK
zjCTT_k0+^z+0EZ87-hhx$mu0#mF!FBp8Hi!g{~`lzN-RLVX0mzB!!|G9c;Rp?;o$5
z+!)RAZS^3c1#aV-pt+AeQ}4{w9;1sWD2S+IXR0~ww|T<y1&j@IP#1mCAEy7$M`=+*
zfDY`agVIK_53&I0$tUK?5|(rE!$)}FCER36ywf4Cua+*fIOIi0?{_=Wya;-dU%pdj
zwqib~EAi0nWTd)Zt4-0eX8CV|K^2kT^I-yqI<<;KIbDCGLY&2gMYd*RVY)@&!k-(V
z)P24iUw!weV9IbNQM7-3m4|`zFa`R%0IL^a4BMCRg2s+343lvRk!vFYfdSi8fNNBV
zX*xtuRtW8c!83ujFYlL8v7><T1jk&BWv;bUG`T8oPtu~7HQ&;lO7d#4m8~6Hiz6LK
zL{4gKXlt%@xP_VJ#3Upie?StO-ny}6DA<v^gV6F@t=owTtU3c^f#Dc{G!jQ7Ks*iB
z&qPIzkG;<T4&kD0N0yO`N(<;W8^Ujx$=>FVh5g-rw?`Y+>T(FSHe1hG95WX&;_kVg
z_Z;udpD!gfmtFKN&Q}q1P78B=9L<w&!tSqfGv8M?QRe82_}-`HJk6a<9uK7v`E<T7
z-rBrPx$E4l7?&(M)(8S98+TpdX;D&-cKAc{qbR;I_*<KLni)AMIi@bgE?DimqYX9N
z?JrBd;zh0-2z-81yW4#J3lFE--EA#t&okXIvC_X9mZM8apWhg4EyMplGL${^#)k<Q
zj0&SGvI3A1$*Tiodi5|J14<blc|)UXOr$`oi>tD;nCT8#sou7Vp#fW@Bs<d5Gn~5E
z)MmOxRAo~5xM}uMEO?4Hbael+#WF`_f3JoboUSCr9;8P8?)aF3G%6N>=TNUaWGAz@
zp{$QY1|A^~fzOBG>p^S{FnWsxG=t2+n$uWEFiXW*LoOyw<#KhEG)=3YK9=9{u{X61
z#KW$$`dgk}qpa9{f670AJwq0@-m%?)_vHAAT)27TIn|`<&MOLKm>SxmNvV)FUi4q|
ziz_&CF0N`^Q$eG8cYa|l;U|YQqusYtiwUg)=@I`+$uN%}xx9MGL8)QDC|6a!?wDCY
zqE70UBH%fO=4T&<4m)OqvvGlRG0fV<x+{nJu+PL6@{Mwa%*W*9EO)orX$}ZZ=tO6G
z$l>3{qmecoHjL5P6&w}q0kLgGdEjl?Y6VkiaSRiO;S;H~Cn^g<hropENUmdw!bYXH
zNzDOfqXLFS)C4>;Lt@8vl;T*uuFRHU*j!rG=Uh-A2-T#N+iZHi;+OnlbotdivIHbu
z#*8V{WvWbBSymdcky_cj=^3>S93|O5bBH<;aZY_!AV&voEwWIt|2wzCd3(=zy)<-b
zh2gTtQf9&G^1$6r=f&f?3QlgTAFre&CFNG^vc>PPByZF6siJIp>-pHd+jHh(?b+u(
zM_}7Ld&Yy%insfog2DH2+3oiGsKjc=QuW~}{j1yb=Udy#W`$K<zd@6y`(@hjBxPP=
z+4s13d0Ry*Gh&*rq0@LJ=4fjKL+|-9l+}tA$JapIs%)4G*o5~8F<DJcLG^?FLbJss
z=x>RUzU&cjXED4dN5Df9Yd6)Cp!337;{%Us&N5zTlHLw_x#i*X)fFC%h(*Axlmds)
ztZm#zHKm<9{L4V8(g1=mjk`-$sk|hIofi;IgE>uMxyc5cM;okBW465+l!wCvi5ZD@
zA!yrZkhUpxI1%<G!7TV&Uu!TIIKo_*#%!KZO#uv5{_)6V<5)Nr;T$HI6yo7K5(vCd
zy~dwd=}bda<edgfcJs)x$D!@|@8=goQb~IT<O4>J`LNHq_2z$GG7|}TIVUXmm<%OP
zDR9`JZ;3v_e|Z!XEo8uKr(+dyTr`v@Adx*o*0=m$M?XG0_O0XQ4<oOyw(0V?#=(2u
zA*1&{VVS>2C$1Y_NVZLbB@S6So+(D%Pw$Fu**c#0L97}az<tpI{h~@AhQmX<Lb9BB
zLZBly$z&XQgJc#5_6ZT;K=*>v5N7iHUk(xSX-?ML3-5}&{qK)hESB?rjvMch839E6
z=u`dq_@R><pnzLxg3MUG<(Kz&@)i=ksMC=UTP8IczjR7s6bqAs2!1ot9Ul;!fV2$J
zyhu_MOK`Ig&PE@GEPRw^vO3P)P>IQSl)so&DE>(|^M-&34X32R)22M6GJJ!z2v_8w
z%X{K<xQ5+TNAb8UbJohaljEUg2PmzAraEJnfJXwBnNUEb(<d;jy7Ye0Yo6btxDSK~
zoCZan^&r;~Bio#5&gW1t8b~C}$ggQG+lqwi1jFo4@y*K?<pG95i!g4B;u0)4B|JDM
zhKe|+mX>rcT;ljiQ)O*%xD?B-f}Q;jMDTSZRN+5d<8(AK-StKH&6Zr<xS2#9>TY3L
z7?yz_PyKHtmxrvgdP(~8t0mH4L$PR{)AihWEsj?YL2B-=u{m-yg{r^u%f?##*vv>w
z0=!gcsx`Vu>^E}5yrfE%oytt!nTxDp{!Mt{#tDwNx;mxG(Zac^mg~mySJ!gusBG$}
zQgT`ywIrLFhH8D<`pPvLc$wGwFMxK?A`-l?>l1d2@%M(Ed~4K!bh^ySV}mzFzzYfP
z%bj~vA_jvE=DtD%hKGL_V7V*a$NMu7>%F?dyWYE((;z1B(miN4pHt8OA^7*QJX{+4
z7{w{(^>)LMtGBg5*A12+62}nz%iYdRGj6?V>n@2dGIp!9KYQNBV)^vuIJxn4xyLW*
zMSRG{b))6Ut)<!K{dIZt$t>$v=3y*jv-Gx;(0JKUe|$|T;U1byPd9C=MP?x?D;i{v
z6}NlB=X25fw+qaBmbQPp>lVrV0hLpNz{>6zZ5*mDM{PF!)_oZtOdMUn#ujr~5o1+;
zU&F~@(?w&^>eAEZhJUO1dk04~rVf{_XE0sSXZI6`@dM$;XBh>ToS;9AQZ9p@gj*uS
znEF^tYdE@7c)5b?qnm^9-ooaqsI>sqVX_-tnV28)GbPwB777)kP`ROkHnt1pO{B(d
z3HHhChU3XhHuI;+jJDkbejuCXLyi2r*)C_(1w}7unOX9GM3%2KI9_~39V|HQX|fH#
z?Upj_ILwyd9Um3f{DOy*LmjynA}5IB-4yP0(<Vjzh(Rg9W<LH}&!;0<3)i=}6Ddcg
z(qlOXdUuSTiP=mnmWX9zmJ;WF2AjLKWk~pQ5T~RRt;|xlMwK3lWhGlI%)lrgCfx|P
zJSbOX*)Y5=bBt8BxiMN4^{)N&ZHe7GG+SJOnP*IU(vQg2l~hvxp`|^@*A2`ZY7V?s
zrr%)aaiCrMG2+7e75X94gS1)2cr}0PGV4v(mc62NjZHpMcNvqUu4f<IAF9Xx*fQUl
zsYmq9*@1%=>eN~iHmnt68sYBkC8@hPC<m3pa?KNEC+Ow_@sUfTRf^Jgq8XH(-ZQ;=
zHq(ly@$FVS)*CJ^cN_5yUg^_xs&*0{{iS#HC_7n6-eyQ>!7sBuZNualc{6IfhO)OM
z@?BkFt|4#D*Ra=-xkmTX(P7?uN&&xA{&^RtX>$?fu88Q}XD!16du*CqX;&F;dOT@D
zu2W$%K&O+Q=%M7UhHKb|K&F+?(eapj{4;YHOG>(-PZaGOe0$+(j33EFd58BCzD}o&
zdwJd64?xUg7K#88@FV6FUIZm)hfm!-cHp`oq8Xzj^bR2(0yZrN+jK@nr14~@SGTN8
zZZ4)6A_x0rIb%Dg!nVSel#|D2zh&d*XO`xQ;4141S6!8}a?rF`++wLmS6ziwEf14(
zQtC291z*xdY*7Kn&{`vZ^6c>t*#3@QOx-A3(BpCnmqn7g9BtEWXj#GkdyG8P!>OGZ
z*Dwh=fp^AWijOM-rCdL3%O_w)iTm?)(3lkaLhzAr{$I?QgD^@NxVR&F)3?M!^mm9R
z7*fM326852{^{o(Vh$QlQBEY(vq3iy1-Rd!-MdncV7fR+(I<0aF8`2Te9kfhWZ(jm
z(9mRfatH;?gB_4$1yn4SJ~3_S2)-~SWw`Je1~4`Wlz|AS5TUuzg{#FI>_c>yIpQZU
zPX6Et@7JEC2kcG`IxrN=cHz!PjnmlTYeXb+1YecXOt`1s=%G+DWxAYt5R$^+(6iAX
zh(v}$<|^bqigqjBytpfl`~*x>+Vs#{+{nupr@(k7|Ku0RlPx!`ajO1;(#u{uc{Cyw
z!ac@g!>}REcW+f*S==hjLnqd?i9_D1Li;Fn0K@h^2UZV?DT)p+3A_Y?ddUvSdv9f9
zNH!q^*Und@p*adRqQlpL(?gchK%lE|>2tsg#nmX4bZ5BRZ0hMGw>?QW{WoO+#^W48
zbUmf$VL>yF2wO|Dhe)pV6<<SrweMlZ=L%{_bbret>p#h!m9Da;&Z^4#4FP9+_nBpg
z<7rO|>v%ygvjWE)?D7Y5xM+|!^_*9%2Oh?&7EuZLIMPP6G*mO?r@N!HZ}BP`x@ta$
zvqL!-_Nk{-)X)0fyknR4kI?Vdy}^R1z}_Pf3N_hDRYSW;xa7=GBw@gZia#<8`X#wl
zEPP)I`33zXW4T&-F}u5DA)k3BhvTsLc%f-gegU!%J}ieLrD}{)_dICZSt&uc%h_MO
zYTJQeiag!si?t*KJBtOcYwpK+1U5FUL?LAN)w1#aJVu(J=JbTc=Gx1#dRnW6zZ=eX
z@7nJQR_ER-P3B#0_5SD23Ri7**dqg|(+I>nM8fEaT?b4_)^vJ1oCPN)S}b5;86XHM
za?==PtqBp>l>s${0OySt_(s|rPqOXMERx<gIv<F3bW*}?lnmC>-ZC#Lsw>z4x>kJ`
zlelge^(mOMaT+>~hWbuBA?G?X-FX)YrK@f8hD+<svan3|P@j^L?%BUbzo9w)x};so
z<wXn4a3Cr2K!@tbBl|Zlf=3m4evW&Fo}H0Tq}gayqfcwMb+5JOUUZ+q<*h!x=r*58
zb1xgtLVB>ppRZv5lE{>V$&lif<j4>~|IK%x)YzJ`e;}QyH*r;Xr941{?X-c4Hj!-7
z86*eW_UcM__`y)32X2`IW5ScJxrgohul8!O@zS{08tRV+p_Z>J+B5T9U!$MJooxF#
zLqTp~?AM>7)Nby|6bawb34>NRs0;5@hTeY=xuQ!i$raP_7Yw9n73w<%ljM_x4Y424
zYAFG{j<l~xa`IIdA;7Mvg6+}j)&}TQs8@($-yU?}v(v*%;(G3IPpB)k3^(2$ykrQs
z2}Cgcgz)nQ*Jog?nlys1$+fZ8P*47uYA;FYMk3gU)z}N*#+^DM`)KH^=qKpW@guz#
za<dsi^WgkTI`a^IXa&3^{g3z-5s`7q-6MQs%1%z(y_#}DL*?Y|nQi)(`rFo7fBlc<
za(rFaH-o?5pRlU9KRE3pl)b*<R%4!Or>o=~%n-^*9aCq)bxgI)44C@<FzvFCi!O4v
zpTD{BzfC@N_`i<VVL!sOTwf12*G^r1w)hJ@Ci{ua)}|z@p=|dnaP=^wumI=rrY%@R
zW4^>B<55r>owFdRNhYGQ;lugE*K0i-9I#nr<}A{kv>3>;D79=3nLEg;-i~31S!1j%
z5>NNks{!dJN#rHEsa_U3PZer2f3M6_BCnv&kDQ@}Nr$R$-9o<B6v_X!%Og4vb>b`!
zdTNu0+$+uut?`*O2%|NWbvG=B5cZAVi#)j3Er-gUGl2QIU4s+ye~r0YwIQqUvfr#G
z^(D-~OXB7m!(OtS+;{Zx%bcw)UEXW7`^F*ofP2jjd>daj?7p9u!X5^3M5?lFK96u2
z<|psI7hR0vtEv!Q+`J4hLk0$k{p!6Eo)<_Kq`#IEWJHXOL*}Ah*W>%mN!a<9OfMyR
zE4u5u`xT;I(6f%B^{d83yktdUl&{c29u}dC!29~s@5@M_CZS<&U>qN(G?m5E#%R(N
zC8{r60@esIh)o+Y(jkD+sNRoE{Q`Fo+1IB=zrzMAdv)u;eQ$esc4Iw6!e~Z-;2foA
z!~aUhpFn$1fQg^aPF5y<L{dDKR@mqO+5^?Z5T?vA7BiCEn7ji3l!$w{8*_#Hi<qnr
zI$?ENlPSrz3XM=oZ$Em!oJ7zol>h5&^u}XQG(2f8!S<J~AkdLg3^bFXof(>4y&0E5
zS>MkurGudsjm1E;r4Qk&kv0q#S=miNbHnWMog>Svgqgxj)k<%2aq~VIwO&v1Ch*m9
z9JRije9b{iSyr*^BOQJ<y<1OTcqvd6YKvwMJj@RwPDeU4-MxYZPGv9dFhQvrs|VLk
zoD~nb!}Co33Gj3y4gTSCKzeCUv>|6u_`RD7i!(KsPdAEeAdjTnEFr0EPWZ?U#CoC<
z3xNT0Q|b8W%_8%$vC@+jc;BjpiPVbFN^#r83=73^zi4)zM9D6qI}f$+gR`9CXWUod
z;jl&CSF|cfPEHqg=6-njJ<-$0aZXucOFi$FiM{!8FLlfcr7n0Qcn0M`qh0XJJ$rpL
zFYG?p;Ux;wsGIQ?#xO~EU%~H5DVn?s@C7UMJSBcCv42MtJ3&|}Xs*Peh*Ma<bM}RB
zX589@_7;*fGgp+JcTh&O({i;sUl!*z-CNZEZnS=_hlN?M*z2gT`90INqO>AiTd?$a
z?1|c6N22IwQ;BNF3)~vy3|RZYs3R<LMMdGdBJeuu{PNnULvQF>ar!eXSRhtZ%9Hdf
zS}a`WYjV6ak+$sI;7a8kRol<g_c&2p%35b$Q$N=}%Sd6%SR@=+u4HYkL=MPHK}|~8
zv~=6lkN1{ZD3uS%5UKW4AcnVY(&c=0^W)>VNJ)#a0#O#Yc^P%e?Bu#4ze}oqc;mOr
zP+qd@m<uBr9o2T(Y42!91u;BR*r>I+>>7U&MQGM>S#lnTJw`yN#lcc9uYl>AS~7uN
z4V?SH*X^5kWt1P1fs^SkXou2N^`e>Rp?c706S@xa&yTOei_yFH(<qYYc)S7N6w;%*
zn|0YdtyD#v-Fgb4MY-=>I?}L_D#X84EK@f0HIuzjr%16FBz+UiD_&S9zDkMpen8#M
z!1$k}lSKqAOqe3BSWAuN%6xueaQ#OggRs$qD2^JcaVZif-T`O%K(XEBeP2PtdW-Y{
zhoqL1X!7@*G3y#S>%>O0R6Bt@){NOM%?3$2V0taRw&@Aiv~0JD4|U{-G3u%DC{PPo
z`-?&XXv%A9;iF1YTBP@t<KD9~sCt^rNh{vvD0k^}Na~WHBigWSJ}Thmv!UnOncBoV
zh*6c0Op)>Jjzci~ZX|bsN0t@SgVyZtzAbs%cQfwSX*T^hSaC50HQQuLV|L!=r#w-*
z=pnZL@6y96jwJ8v=t%kV3@1QBEcf}98&b||rT*`~`G>v?X5J;#OQQK<Oy0EC{?unP
zL(r6AIDIHjaF4Hg2^rHkfixHkw&}}G;+O~br~oH2dh^=bz|W0k6es&h<M*-2#2C;q
zn9Grk5rO1o3NSA4gk@0ZybYGTG}ML*HMCM~JeskcmL*-84EZ1u)4`fQDj+*#`hM{;
zxc@$?-^I+<UtZ0BiVVs<!NHH4)6$war{D4UDWNWgj2f)Xg@bLSR$PGgkOWC&i0=?1
zPXcJ~&`|uh+LF-c+{@E^N3G%(@cGOg6f@ZGV)LL6)SLBV>EWPRf(1(KucbGevvRke
z@*cKV-@YH=8ZU!}jV%_NW?}AV?;0o3{#4iogHjdLRW}BIid;OLXv!=|*A=^=HHn0&
zH6>qQ@xxm!rLZNP_ZDtNEL|9o=XiF)ukUvUQMq!9-tJdZ9tB2Qh>nRO$l~rb*VNl?
zWj9yEo@bR3cs$JU9LeVOnElHXd``&CCHaSDy;7Yaplj_7dvTx&XA(3Uc0Ulj?Y&PB
zrdT^$NoM9*NfULCSIDQ#Ny+I0=e#_f*!U*afIWVn@@I0AmQ26;Ttj81P(@UR@^_V{
zP?yPrZ^iF_;?H&OrDra9JW~${9#beQhQ^!WRb;v$I}b4nr49)6djsRrGV|2Ii{;1h
ziUYBd7~Baw9()b613Wvnw5am*{OuK8z6*0hmm4^%!f7io+`BwhVC_JssXY*Uf_&yy
zZ9lc1UJJDXkyeWmS85fv*sA$+*SQ}1)vY*oojlTDQrAxfw|VVcu~aSe2^BKC@#;8O
z>e;tXSYy!%3sgLZf#_2#mI^{d8kEP#q9K#!!39tawdjV`5CYHXaffEASDWAwZ0;gI
z-%7S^oIOYKJo9~VH90y(<yS9-1Px%4y8y7{61I&Y^F+mZ7vU)YkS_MzY$)l{?wr({
zmKe#IoVX0i;aXJAFbUbKbUmF7TR#Phq%?+uAsj;H?}MkRMF(fu-T)Y|o`sZVgPHY2
zhnu#c+o^E^>h%aEZD}Iby?ge}Z_NFWz4L3<91IasYx^{s3D3@XGqvm^uEdhkBr6CY
zl)at6_$~a+g@p$5o6C53+>aCeyx{w;VEgae9b5Y@2ODSW^P_!+&Za5eZP4S35YF@f
z`51&9;}3%w=kK>Up`wC>qvfd)J&*I||Kzv=BhD`$FQsaZD+bsxa|%Gl5hJ@uZy7)(
zExsc9Lf0$)-YtqRp1mpKkB7m+yLO)~ppm@zFn%_;9!q<(Rq7$g4G1D}pn4p!M#S)a
zc>7pl-X*tI!aFocd|da&w390z?bT?U<lJ?&26m2-30~}XYh*+HI*#7wx$^t-9*b>d
zs$QsUFi$n4?>naOor`_tNo=QTOc_>Yu79@SRNnSCg1zC!3EN*^o$bGs(x2cydvZ}r
zYbgTJhX(|@KeKQ5Bp_nq_k#Ngy?@pEYkt=VH5M4}jL}r3a1^*ZvpEAc<pf-BAMNZ^
zHGN;J_F&$uJpXo^z3%J~Ds6Rs1b$F%{QXu*2OkvajQtFJ0^S0bN>$p3MWYB3$QA;3
z?FWC1b&qayX}bYz*y1dvfwUmD3vah-Pnrhze+H-8b@W=d-p>l(s(Sb=8UCuG!O(Dz
zsf4O|A@b%JUUsg$sZgUD_u7dRUrMLnD};Io5pRUzw(f^^{mU?^A1XnyY#)#*bJRAB
z*jjHU`FAl}`UA;Ls*!AO5zW{abwWikA>XWQ6D;^2<r$o_bDa!!2Wrvr30ESpGA|x^
zPa-IZMfJZO94ik|>V6ZKK{#j;(`jX+^%s6S7t~;Wxsu@*-zX%+eQsEe)9G|2vwi77
zF`Q=zFnSbZQ9|XqxF93!Y0K(RmoSgvSy=;N$^1GZc2Z|$_8>apa>p6(eXI#s<~L~X
zSn-lv(A_T_izSa&@BIwv0f;5kVc%JkJWSSg$65L%MM->@L?)VQ$#*fAXjeRKJl{jO
z#f9~g4)Lv|mOncmoYD0}fh6K6q9C~N7!N@0S@*)^qRzw8qX3VqCLc1)nK-RiP4_`v
zNF?1=je_6f1WxNpRQ1d?fWY$W?f6!FHp>KAO{=6Ci^cIvVwb|HWtPgm70jE`yXnD!
zkv-W%P82w@T->ldp-GttNOsn@%EfnZLd8YWN9BFk<K8$OAwOcN5RVvMp+xoSCJ3w$
zjBBAR3og&FUoyw4pRJlbhkKplD@8k^DSb`oRcC8D<3?eVzS*)6NvzUG($)GM1u~O5
zRM%fo8S^}FhC7AhZzd0jh}b%sFddODb1lHLI$xRuO!pMHrRSqsiyQc~TPo!VGew&l
zgH-803Vul=V^zf?6BN|J@;<5D_EyRcMqxFJ2;y2X`N&QAn@XCbHk8!!J(;?>=d?4+
zdDPT}AY~WRxMI_zqxEe%ZQWK1LUI){bi8KnZ$YoGs$}x!QmWm29Q(y^_6J<@+uE#e
z+JPgJJNjc<NR7X+DCZT-2I6b$C>0}Zj}AMkoKO=k6Y|%_i4~d{ILeAE^G!;FuY7qK
z1O!fk-GcEIY6qzzD9YOJs-kk3*<-&ALD3jz@-UxNUfEVt+R9h>7Kx4&Wj1!PhkS~X
zH?jQ(_kT}0b;<vsaUaDjm-I)p<LO_1#XigYaJ;=SCHDWGJ-N8kcDpRM%+}4(S4}IL
z&R+J|kK($reWlaAPphufZ!Kw|ohOxbr1I>NNoBBcrxfKU{o@<)Z_m2Yp0Zse9qSt?
zb@5~RAAJ8j?<IHBd!5+VIfhu_Cx@zwI;}2iO^MAG-n0AGjr#=YthiAix2>0I+!pO4
z_H9GTj6+aYro7qCAMj%y+}v&HH4U&rMpA=5Nv)J}xHJ#x&j*3U*@wy?DjWYGiXBg>
zb=WE`70YYw4o=xXp$YE!ad9xIg=e9F+#F2}=xvx2v;CFNv2i7$k;}1(W%2n5i6mDT
z>=_P2F%_Wa)@&gP@o;GL>(|((E4w8zCW6dBAlN~$6>$`IY0*yOL5feP;KFi5yrn^Z
zBc3&Rmt=m>tSvGB-yVQH(NDRzU%;?pDg%`r8$%z1J@GSDG{fJLqoj|;|7!i$Sa<rb
zba#>}zYZF`#=lP$bAVcUB3JOrDZ6*bv-2sw)ClIo<x`f`)kE8@G_kNrz67}G$-gBa
z^2Fm&yz27%!}oToC>fog*Ymz%|Foy)lrVj2*PDGzz`+SBydLAaiVahHcPu0&?K|F)
zwJm!!L-fYEB=Q$wQ~X&JLIkx#n4awqu)&S3FjYP)uB;T)Y7+&o&^x7uOtX>X&G1Nk
zf^H~7H#=ddhbgR@O?XKZ4MAvUXDFZlGpbajRoiCW$4qnHEh~_R&oPcr8+J)U<8%+A
z%rSdiYrRTSl5@!V`y_9P#5|y5R=L^kS>*mttJ{`H$4ZKrd`<IT^*l4nK)MxI)Xx=N
z!iBl`6ia+H4P-j<6*^8zjAMk*LfwmymQpLN+nEr~8{4hGIT^8k&c~_p_Rd~1UDF@q
z4we(cUtn9+Xy<OYnvD0QuS;!YK<e*!bnL`6XwbLk>zSEBS*JHAE?kv$E4Zd&ZE~(+
zv5$|jbS0)!ft^P~*4ADdZhvw#*?wvP>$y+O(B@SN{yHC#DJXSVZ0{wcCLc3++?EMo
z&z<vWN~?{WocgB|csB%mI)!OQzNe3#gdCat`8_P2uYroe--Elz&O;B?ma0L3f8P+A
zOlyz->q|2*F)%RrDRysNETwt)W!1oL;=&TveqZ;2Bl^-QTikxT!@}ai8aT>>lOuuw
zg6m*e|F56zCvL|800bZQecfv#4zAJ*3SdM9hW_82OGX;QeE^UcLL+uW4#wZWxB(hy
z<90vIZ-a%Pl*8ai<~9NA3%vkCHbD(ScC{RXwQqs%o&n;ufCIJsF2G3??BdTFKZXv_
z0TcrEfQW&_f$V@DfDM4RK<GgtK+Ztjz)-<7z&^m$z+WJ&Ac`T4Alo5NpzxtopxU9n
zpgo{3U>sn%;V9uz;f>();V%$!5snav5#12qko=GpQOHq}QBhI-(B#nx(H+nmF+edS
zF;X!`G5N6oSnOC)Sf$wL*wWbTIHWj1IL$amxE{D$csh95c<cCt_)hrK1ONhf0$c(?
z0(pW6f=YsMf+s>j!YIN)!Ve-nqEw<CVrt@M5@M1dl3r3`(tI*tGL`@OEr0SXX}UVt
zI|BfYF-U}oP{t$?k_8aw0p0$WvnCaVXdDhye?6WxI?GgK%7bzds;r?H6pTbxE;=da
zaXofJqO>61M03$$5+X}x+0%j%+&3mKs0Za_bgzrHy!_)_uM2N`)+f7*Fxvur@%x2^
z_jhjv@PLh?8AH&|YZxDI-XQJP^IQCj0d=T&r7zxHsJ$ALZg7HNnHO#!;BE3w1pWSJ
zD1zRy8<~EN9ZWxkm!p&8InrGb&aHQ}q8M_5UHQw;j2lRPoIHw7i12-TWc;EJ+kTWm
z0dgNWyLkVfX(Db3pss`Sa7ldtBT0QTa2{N*M7vr0ElEAd{2^%&+n*2elh<3`gz|D%
zwzU(Kxf<7h(&kpVQ7BZ&re&3e38!6Vzhc$aSlVvLG0GJ3W`?97xx-j=SyLW1AT|=6
zFG0M}?=QXvzLMeJ8!*~ywbBWTBlM`d62F>iWsqciiF*1sh7&kjXeg|UM4DM%nZ=(i
z*sV9%wc(Dj)+ddQZFWm&I@acwnI_qf3LO73Ye8|34$^Eyq+E!iu#yKxCTNJ#IMtXg
zDi_E)q+FB=FH3XU->^!c#p+{)EclrkiMmI}MVHI|wZ0355Yi9`AQMZsOFQdSmBTL!
zN|)H6T7w0WrCXmrI1HWCg0(v9v_fsR%;~DGlE=;95w1Z`pAg66^P$vMQ!k|tSs^ki
zi&&BaFzdg2O~T@0#UMXMY3;y?t2S5D&@7ognJA<@sl*K_wzAK$DN)LqCdyaPxMwKg
z4!6skEh4%^d?cG0G9F)?{R?v^G=O*C#pe}tfd+TFF(BIM2#Khth~VAw)FP9HEyQN#
z<qCu*05Yef$scU!<%!jgUAK2oEq{f*L~o_oM%}0SYM5N(uO(kgPz8c}ODgw7i>^A!
zcE%?<lua>nAi&qF$D?If@7l4U{R`|`P914)0*)%Jo_%PYj3ndotNx1q3wn!VbSFP&
z-#yejk_*d><{e`aWd^Av-XKh2LLuyHt7Ya_Hr8HT7wW}GK{$Mg%#--iw3|3WcEdm%
z=2ek~w&JzEqg+tN$;}3%J0A+4aWMNBt@@=>@YyWmP?r(k2;Q}Zu#Y0{NY1J4{ef6n
zm&tbAyEK~wKS>qXF_TN-Ueu`7XjKd3CRh)d=3nb{y^5;1XJ}ieO@)jazoYlo1=s9n
z8b;noy8Gn)_N)eWRq1suwS}9_ik!_PxuFxt$LpOma+d^;wZpEN-5#fo+rO*Ify^_`
zxC=ShX0GaBA`h3H`1<KUmBlq=PMy2xzrVZHLK9PIT6|~(SiSG&RV=Tf<*fBp<8it*
z;k17>i*P^)6l>nfeH~+6eq)_4X2d@4hNTZOPazz37?i$meIdBN+lMuAX8zy#YX%7Z
z_JciyO(#SHP{jk&d1P<&=1<i|CL~E^Iig@hY)&s_;#gIU_ZD>J@UX24DS!{|Mc&lT
z{syh{$eC(73>Bi~$3w$H!bgnOmlsZt2N^`(+21uW2dV?@0}LXsGZql`0!EEiry)5q
zq3l>$HZ9Ow=l(bptsRgSh&K$x9tGe`L2-B`F_LsVfrEpstjj`S00x05|7%kJe_e)6
A9RL6T

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-14-36569c01.woff b/packages/icons/fonts/fabric-icons-14-36569c01.woff
deleted file mode 100644
index 5c3e6cd98e6c2535a6940be3f28d2351de3a8555..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 2364
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

diff --git a/packages/icons/fonts/fabric-icons-14-cf85ed5b.woff b/packages/icons/fonts/fabric-icons-14-cf85ed5b.woff
new file mode 100644
index 0000000000000000000000000000000000000000..40707ffe6cc239d6928e068f741724c82142fe7d
GIT binary patch
literal 3048
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

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-2-e2ae1f0c.woff b/packages/icons/fonts/fabric-icons-2-e2ae1f0c.woff
deleted file mode 100644
index b1651930ba8d4922d18090c050827dd8a60db4fb..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 12568
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
U&``_&6yR_G17NiHUkC9207730A^-pY

diff --git a/packages/icons/fonts/fabric-icons-2-e49d4cfd.woff b/packages/icons/fonts/fabric-icons-2-e49d4cfd.woff
new file mode 100644
index 0000000000000000000000000000000000000000..a24013220ab33d9114acc4920d05b463e6706f1a
GIT binary patch
literal 13256
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

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-3-39ed3795.woff b/packages/icons/fonts/fabric-icons-3-39ed3795.woff
new file mode 100644
index 0000000000000000000000000000000000000000..30dde7c3cf8ed3de70af11758ec6661c05a25927
GIT binary patch
literal 13972
zcmZ8{bC72}u=a0k+ctJ=?bx<$+qP|c$JnuL+uX73`R4uZ{p+Ucshob&-N`vg<y0r_
zCMPNi00R6JwqyYOf3>MQ0JsMAzo-9O<dl9f0RTY4KfL%4^jV}Fos4V@?0>lEAD99F
zAeLC?cq>M(&V&E}@WYSJPYs}kT7#-JwKuc*Y5&jf&5y3eNA6LqnSs-fEhy*@2mAj4
z3BWP4_W1DwiU<JE{`8|nngE^2X>MX*3;-}F|LFYm4`BO@nPD;iA%D2=9~tKdq=--u
zALcgB?mt}dk8JsaX`D~gIBPqjA3eq&e}KvV;D8YZZe!s7(=X%ZkBt8VLcl(-psj(8
z$q)DOGsY(X0O~C<>qg1m&dC`7VEyks{u?*pw*p|(-qGa8mJRYpj`+cXd)FPjd$y6j
z!FL}=KtM`BfD3vhBM3+lOR#D8X#6ngVBh%o(C8o}III9+uRox>4;mU4zE)k2+tL3O
zF%hUL7OY=MUmpN?7KGGu&z_o-q6s!Yg}5=>R3u0KZV7F17y~vbNZ5=_U_5BXG!Ryx
zU(0_1O;T(SKsPL?lOLC?kJpx@L`@8qM}OcS>Q8m|G`j<`<|uQLJ+AU~NmfjtRxWKg
zts(Y&Fl~G)hs?`Gp)NO6<|)FG;zmgyM9p+&iV2}LrJB(A%}#S_z}i)1z>9NYMv}GG
z571hhhIegD^SLmKC&4}7DC3yIns&(L-aJ5(b03!4z6+4^KEl~~rJ6&gag~S{b_l1+
zNTl;f`~{{+epUOc#Fr;xFs|$bBUj-v<1bI6!3<Fx-HgoYeFZN8atW`4fm{U#*~DF|
zApU?|dg#CnmTuAd4W^2FAK0`*s1naUzFX@s8vWxx)DezeKG*sfI%`7^EA=7h)cRO5
z+B5B5hERrZAnB7cF#^xI5ZS*({^TzT5CqinfyAhV0QyB@49-zebf)+kGsly-Zz^j>
zKf0Iq7jSLCeJudsXTD|)Ax$Xt&GprXMtfI#FM8em`+%Y#e^yBaE<}oZwoY7+?0^95
zuoLOuU<v^)q8t}$p_K5P(@-hWMKUtj;}ZWx$>MAO<d7kdnSEQVdqc=cq%ZpBo|!lA
z9;dR`F>lxG5;1Bj)ok{?{6!e}v&)RnS0cG<HWLHsB@fkSlRitRLMvH}N0~bF(b>mT
zX&Zck=4?8{w4vCWdHeZL*)tn}YkAKI-o6S?;t)wN@{ZiCPqfrq6Rm3KLKJxw$g^(a
zeL0ZykP(Xe12&@HXfeNw8Onh*r^!aItW%(H-Z=2HaAxqkRGi;qe&ToNyUl1%<?lzC
z%?I>{FoV9px`H&b4S6VR{a5(l5946~5C9ke34s3o1|Ya+mv}?zqpajSdod@9g6lQV
zYc-opG?4DFrJ7)EU>aB(IblW<`CCs9;vT`aKt+s5<nMJS0-$8(5%b4Vo8L>s8mzl3
zh~U<aHf(VkIxIGAEGVZ+E!sD(p0w&p_TImDCPy1!4_|tVo{y%o+<LyhpZT{DW3wrQ
z?^|8D_aX$scXk<CaluDCzE<`K?D@l`Db_EA-t!j!qP&bK2?_^55|0s)4az~Xa!Ze8
zGuKAnb9(CvsRRvcS*)bP$qK1pky1FBf>c}khmmtrAV#46rG0uuZ$T9oraj+ueJKfn
z(c|i@Zj`>@xN+<1@^i}%BFQk3U9d59Omz?*%zg<SMd8f*kOkF@%(yLqG{|7SWfdGY
zAOTa56DO7+GEMy5P>{nnFK(IuHmgbDJZ*7<jk|bJqKn}2l3#{OPZFBqIt|-JRccz+
zr>=2X=_uq(iZ-85vHB}*;DW_#&k?%NT?$oXijbE=@^G`wK!HZmFx`BJD7=q3hXa+`
z{7=J1r6x46;pma;1~6`ftMs6&(fc29kOFz};u|hB)?k#9n%|Ps5<2$WpgD`-NaBNr
zbsPynq%BiN=oZe>oWv1l^5HLWi148xqC%Md4(Y(3W<GOJP=BM}DzG{1N`@@Umch^L
z^8W@jbpJaIHiqWp@jd%hl*=@3I%iz3c-aK8<Ll^qJb81!cWmZ5?RR$x!LFN|qniuw
z*Z6Cp><qiqnyXEJd*Lw#0U{sc8mv}wUqeeo^i$~`Biq|vGCy?%3gl(^jYb}{$NMPd
zQC(N8qluWetABkP>8qn%DJQ+Dz;^r~CXrGHPPb%VYPrIh@~tlk=7>)T2cK9t%m-O`
zuO~bTR2;>EjCl<ABnt?m5Jau8kH~F$+C=HsL*Hfny=qvR%Yv4L%n?|aoK7ys>x*7x
zaG*I|RrAhUX;=H~I2r4uJ3Xeit=Iw;JsD?7XGPOwe^?tcwwJA^jI4u!gid!rS($fV
z_t8;zejK^P_`{y`C?g&gn}LFQ`B5AYEzAUL@>E@Ix*hzap3Y8t7cJRTy80%=3Qn(L
z-CuigWDj?}WRMFdrXi0>66{2Q#E68|@SsaR?Owhxk3)(8O@pf{aL!qB1Qfc6t`h}I
zyTsggJsF%uc?c=6Cz9n6`nT4%U<ymvXTHViIh0kc)=FpxR*gyWfORU`Kd9qM7&yA>
zluJ;`QZXdw68<K3(XExAmo_ph12GSmrOoWBbnf*T@3WX+nup)wD{T`!IV>)U*9Ea)
zVP}u6RYY$0Q821qbIYVlci-=xN?IK~*p55xLn?T&(uJRoVd&1dXE}?jfXjV%OhULT
z578cNhA56dJQvX$puaG?h|Jl9cU6ra&SjQ;Qyi(d`|?=_%j5$V>9)0Xx;z~4LbuU|
z3>fKulQ<d<%u{)ID5bJVYqF938W{fGU$;LvA)WHhlv4k+^5@G5ZZ1Vi?1e%tM|vcc
z=LahkuI?YZq3C2q{1S%sL*A{v5DNyq<W`JPZjAU6awqYVzOyU5o^@lB@cmMEC;1GM
zv9{eM$jXw=A6Ig)WpSmSvffYRjA8!O6CK1?!fO92(9gm^7oS?in00||E(B~P0K610
zr0n)Nzuny2l~yAq6b3ILbcVNtx9)Q=zGf59+uW#Tdl4Jq<a-L%PD{!Ai<h8yq8KC4
znNz2R!i`pt>Z_Ea6qT&z_433qP@OGWgMJLH25KeWZm`@DQ;F%JKst%rX7{}(@#!+j
z_wh5pqTT@xD{FW^nmjgo2?PI+7s8AXdrfC>j>qYEOql3?&-+J$zjVh)H!V9-d(8-0
z%(*Ae4Kqo-V3rdh-g1lBo+ctXF`j^~D4yw)o*Z!<H5L$ZQGFJ117hwjYt^8K`{XJd
z%<5CzXm-%t8uy|c<t*lzQ)Y}kQCA-q9O9Y(+G#*!cng#x?`z;^s5K%cacV`vDU4R_
z!D(ZE{1y11v%nnWznH~;`E^bq1#x`s7PC26zB2bwdyX<RKB?RzIZ@7FCyjfj4;q1R
z{e5%D`$Q(i&?kQEYr^<JO$8IB<i_UP<CZ-_@SUR#NKvRtyB@M(YcN8g&f^LhAVuOu
zSvsb7JPn|u0WIJZo#=T1sxqM~+0f63o81=|ZBv|alh)f;hue;}cA+;Shdqy#2-6M{
zwI;GoVJ#*L=ZV+8T_iDHQ>GuZOrs(h-PlaRpo9=YNUN_m(XF`ia6-SzhQzuHp9Dna
z-ECF#+gy%FIH#Pl&d#$k&#;0Co#1O~%BnNg7$AbclWv(M`$?PeVX0_BjLP@e60Go(
z%9>{HuaUjXE7LXOEe42I2(xEVa>}b9k~-l%id)<>@B&!_pjCO>pw<Qr1iS#2ki5@^
z@v@2Z5PFLdbr<58>Y3g^z1%QyC&jxOCEmnozl_*_O_l?>HxmIxhDk`|!$-0f&+@o2
zA!sGuzb&pMRFba&Q6Pwj0ecfl6H~3n_3yk>isKZs2hFHFU9NYIs;zbwQ%AOHOAh4g
z*lFQKc(<`+d~xu|EFw$Dxxt6k(8Mg9RiUU&-qG38N5d!2+ooJm+t7CjMe)~G8|dpe
zYK2vHJL3SEZFktj)i=jL4C<RSny7As$_O=F2hc^MkjL6i%(ev1n_O_0MZuox*9a$g
z>HNtYiJa+oGGEq6xXo2K7c51ThfpNr9l&iRj3?}kCSl!2wXQg5?)8$mVL)mn@&XGL
zg#qZiOKG~Cr^=FiD#d>l9pasVGTl`?)Qn!8@{@<$`i%P{9lWFXUxN@In`pv0_rerw
zVQjVP<{w~}b2GdLuW}dF6*qZlxLHM%2QR!$)9ZRS+hwYA6shqL0iziutlj6j+iTd*
zfoN$75rxykffGf(GW2L8J`^MxLlVFc2vLlXh>bi^=>K}Dy~P<Ad3%W)z}l1a6?)-_
zf<`n@_&Vq|kKVL^HF8aDC?G|p68|87+w{rkt(SO;TTjhSlDUpTJ&dY<XDXb$)X)b2
zzlwF`n{AGcmWlz8t2eMT9FzUXJMSo;_p2%Vy=Xay^N#X3(KP}w!<_mSkuM3Kpw+Ts
zgLOU##a{aAU~aJ~6w{ie*deEu_tS5|D=s5jTYn>ZI0qrA4T4SFKs;pkgAAp258d^u
z<AWAR?FlJMMBNdGm(xl_+zB7Kp4kZl^^kbmS?35>2Z^31*P7od*T{ktjR9dSF{ZLl
zM*d5Iw$CZzDJ7U#$myMml;9j^6qm~BW+YmMU_H1}S@>J!3$;dzhbAu12zC`KNJ$}@
z#Gygmca>CMA0GH^P_`Lqs{G1I3OOsWybtRULNtHF2sF4`0(}Nfg)K@C3`5bsPK<;V
zI#352@ggn?+=3LApAL%UK^#$G3&hmB+A0B-F<h(yCs{eRh)c4e(#9+8zT_Xw2W1{Q
zwqGLM5EbbR3!?rydw1=lb5XNd*WiRCIn@F+J{85KW?O!N-t*P9v%Z;l(meM^qN{IO
zM8|A<qyC_aStp7ss7u1L-;tKzwbATKu4Urd04mw~`*brmYvj<;u786F(Yl=DMt7x?
z=E6mFGQ~sZ8g7?QpiLNoRAn0iz5>nxC_M;JgD74SY2E$X2Yw&zLIJLLQ*z-G%7HrU
zTt2}nnxRz`AP#zi3Xe;1t%A8&Cyw=fxEk75RhNoNB_K*yA&sJ<UuV$ZMCjsQbsa2m
zkL?@?)Yh_##N&&I`?)UvS4^^eo{ucr_<Ek=Zsku@q>d7W1i@Vng)Hda^^3#HQh2?c
zAtpKFb%Q)eB?)`{!~yVP$=a#41%sms9pEcoH69VlzY{(1%R2ar^0Gz<zx2Thd7rVw
zFP)G0jT`o(+_`OMjn>bavp3s7yAD@Jz@(GVUra^CP(Wn`)SM+HvcUWd(m!!f{x2wX
ztN{I#IK1QWyr?1>lOj7=K|1<YJ$klhaZ#l700`Y5lE$&mR<Qs@@874P1Z1!4oNAln
z0ZZV4AZRLB<})QbV~SJP^p^&1%3d$@OtS~KCyuaRU_ALzNXdqg!DlyDSAmJ4gDFcW
zdRmjK=|B{d#8G459%kwxOt}T_av*jeg$IYKJ2$GDc;(mf6G$w@j~PK)_sy&A>{nG4
z+x7Jm&17~HeP-+3{qdJnwa&6R>X{8w^9^-np3^Lz<D3&pTa9&V?Q|v1`^t#??up$0
z0!kyco1vrHygio&k8%ZKpJ-x<zW=NpR*XN&q$?#IFccpxPG;;*R6Ax&QUY9&6<R4l
zC6MPS`$%ZUU;`n_(fk-!p`y^f+`v6XQLbR8;Sh+g4|JS}LN4`?z}PU~t>gEhSfT0;
z<ZX&UEU%taRDw7}|JBVGil|#hV_E>3ije|)SP&Vpx7hGDVZqu`wBryPut+Qhg38|q
zr4IJLj0fEr?qFMx%RE6bxH7yED%Ba>jc7t_^oE5_*tw!zD^wr>$dGYCa;04J-QV+`
zr4=daB!cI^F70Nf&kh>j8XCk-)J+XcJP)Pa+GTK7Z;}=eNJa2fafWzPA9_#otkqxc
zc-mDxEw?9NR2tatU-pC+isd$PgI!|>s%bXiU>LUWJ5X`WjG4Oo_7Y9#@;rgs4F!3{
zI5M8Y0(J_ArC`+UgpsI#Tv4$A1jHO7cPP0fTf#Z3bjq>yKhf5~YhZt#@UUEbDK3%O
zScjf}rT4TGUu`zD>o)FEGgf*oR^wYyq(vKKU&U}X^`%-FG}*1?FUi};Qa*%3EPrTn
zDflLVHFU&pA8>@5<28tt#g$r44zFn-ScFLhs%m6QpS+|!oh*lm@nBe|$O`Y7s_DCA
zQcYZP&xC`;=;piOK#gOSD#DO`vKLb$$mKt`h%Sv}Cd`s~66Xs{3vh8b4r7x{cZSwD
zbuvhdrDzS2-%*E9SnSWF>hm^KiiFTQn;Boy&s7mmk;LqOHS<c<b|^E^DCIIso}v*3
zlV)yMaacCpAves6Ma>&%CQ=b%nkB5mX73xLd;JQnJdEK`0BHWOKDz3~b5UxlwZDJQ
zw2!zUB!~%*Q~6~Y00b&hB~N-d2_FzfzilJizqCNseR~(}`^Yg&s%mDRZsluHR4s5C
z??*dwY+Q-RuOcEUn-SHS?*yx#Kw^timcBsY(~znTkl<W_mykTHI%Xyc&a)lm@-*Lv
z`(mG(?FBb*Di0~Y`EBfi39R|mh5YcblBqvjk~|SCf@n|7`47`Nv$b&KEkwj)joSqk
z&XCSHUWV6I?DP{ZB~c@-d#IKLBeG#6c{aBl%%@1Fu)hmj7lT$_ODaag8gL~{CNW88
z5_>{U%Z<53K^}gEF)1Mw1^0_9Q$)))->*d*pRo*;e<WW1rhc;Zw}DVbeySuyAhBLc
z$QpBY#@%rtzvt-0Z-Icbt{8)2ug^1Zt1q8V$<tu;anw-?<L{x$!ghp>$gs$$A@vXa
z^NPjhmdIDTmT@NC(uP8T0D8B6w)y43TQXAY=dMbdsi}1^N-O6!L!FwQ0;gIXpK(er
zZRzK_ENKiQs`bQSrnHTWZa0~ey)a=IHQyCmB}qbOp4H{-Xsc4ck-q?GEbjbbg(D?t
z>YlB%2}7^vYqMN^X`7`=TTW>&XPtf0oY^`UJvhh`H<fJaSb~LXt5rcY7oU}wdET6%
zWJ7i;5yDCr(#G0np#tt#PqmetY|gT`y^qNm-Wi{nWU;(n>Exw9Q+8;)F<in0D`o$U
zQ&!q0W2J7LFqdRYovx9Wm#URqb4=!$B_KgwWS}ir+Jfm`6c{DayyHD;u%?+h_Gg3H
zaATqX9KD`c6DV7e?pw1GFnB`9pG7r*(Pl)JrsQhYpy&bY!zHSRxJ%HrM1p3#=2W=>
z4Wrq(Vwk4m@%91r*w*%la`)&#&v~Md_L4&{<Qg!fnC{t|ougx2N-*ga289dU*WXVZ
ziHPHQ0->?MD`K<6$*Iw`30K9-SvGFN)=}x0xE43rgyp{rOoE$@f>o^FgDVB)XZpAb
z_eWkQfp>$}<A_f1Yw|`Yxs;aBN~|>}KNFW+0e}D<NmUA-LWY%1ou9y5sR%|KQ_mxh
zVY%7fdv2?#s5D>yZ}hdM=3cDXIhp67NG!|v0i|NY+dyaL)dnbI6g(6Eb55x7NoT$F
zcD`GKRVs5c1*Vy`Vo(RFsnD%&c{rky+X_XE-t+Zz>*w%t_o_@!*V*W!fti0}EM*T<
z%E_yzsj}YSye;K{X<KZ2<F%1_Vt7aWJ*h0HugtH()x^-|_$*?TC1MbDN|3xL2~gF6
zs2|AIJ9lhU=MR$6zJzRYmV`-WFPxGqK#uu&!zEhp#+O@3!u$&)6ZU+yFWnu)g?*N*
z0+t;cw_Y7@9zHA&$Y0&|T1g>5Kvcbc%H8mviqWF8FR=Rxq?z;7Eo13O0+K9W$?k0a
zIOxK}9i2riv}ey$j^4sN2crrXKG4JI_~Hqxz+VSX;R74we__YnG1h#8>2GGD8K-_)
zICwG#x4D(^YRcz5MEG&d*3B*&bSC`@ux>TtT%#f>FQQ@&qN*hmxJ0&EwyC-kFn^r8
zKquNeU2Ls5jVRcxVTb7(#_c8;+K=TNE2A-f<If}IFp$C~IPQZ5Ym1Q&@Mxm25WbSs
zr~YXlxt5q!|BQB4KWr1+%8P=A$|j&o6HKGriWf|v=hArVdJ#0wUdzldbSg_<K=FO(
z6lb>Z=cf2fU*E@vLz4=clAqij4dcy@!YQsXwTQPQ38D$0iY$Ea;^Leq3n|9gzvq_}
zXD<WfO#aOr3DHITBlE`S77K1}x>;0URTa;h?PX#te{A?qjNYLJe;E0<wL-lF(=M{c
z#1R=v!OB!aGhI9JTrgW9Ii+%^NV>{YzILa|&5IMq;|R2LP;?b;ytm<|f-Ok$Z=W<(
z1(!c7L%U{#oH^mIA`f)JIf96Om6dYBC{Kv!&RL%pl4~$|Lmw4)JsjhzVa@a9qRMUR
z6xk<a`h*Q!FQsRwgaxUwD&&Z3SORSv3KC|L<S`d|C`C9XUxK<C?`q*iPykR~!t~LA
z3R7~MQR-TQ(qOW0{wK==ag0v4x>2V3=Nj<yYQp<3UN{LL1?bs$j$sa*l(cJuQeO)z
z|L^+nQpAKWNV+sh{_JAt<pu19C|trFpsNoU6~74Sfg+*dJ)>qTD^@ViFw9Z^*+{X$
zwcdAQ^?#sHYlTeMdMP`XN*7!7i(CL&m;AS+V<bKxE|>g@q_QGOg8EpT6ehST@Rbuy
zAy%F0?aswT9y=?w7-sGbEVo}i$=NE2IcMXe_9doi#$*drm{ilUvY`ax%V4nJ*PSj|
z?8&LNtDUyFZVx%ak{uW>M_6<`^_V$M7%pl3pW0<}$N}%2(;{2*LyWAk-QPKiaf(*L
z*ju=8ZC?Mt2hz_<WZN{GuoQRUbz-}A+^)}F51vnW#P+$guvf6bj366o-hZo85yEAy
zg2L3bDqx%D_x(Cx<BP;|mK8BdId&a49pZ9dIt#kc&DLEFhr<*B%=f-Gt+dP9Sf}5f
zxOtU+R#HZOb5$RA#7&#8x>wM6Z6)+*biUZdR%KO0cH@qaHQV`lZg-Zov{3ZJX(lQR
z(#qIrtSSYC3rSDV%%C?;+|LUK(|x7DXwAED&$mBot8d<ag4{QCc_o#Eof?gKc{SZ5
zc=wpyhVX7#z{J($ayUHB-GHiSmN+3)*Hr8HnA4X$R>DvJ{=LlYCz;^uzX$(582RDg
zoaL;q?F+U^n20rtA(L?}LIadylOZAA2;@p;p9>0q83h-EL>!SY^qU^o_&9s91jJKl
zrl5hTfpk;?nUpD$SvNHX)EInhP+HPpWI2J#7+ph{Es>Y$mpyTe@sTE7EY}6zE==@q
z%=9=TWt2S^cLzyIuYmE{I0IBM>1-xKR2A`}px>w%75a$bb&&G9rZ_^<Ib$FAtO_;A
zri?is=HU#i4DzQ$n6U-^fqAbflERK77Qea)e$AZ^8eq!BOd1KRYLbc~@$MIJ7S_U%
z5QLAMw`eqqdb61LxFkFLNx;O~5`>l@v)=|^VlyydA+S*K<t(ADe#R^p8Q_l3g*vG;
zE4G~uBgd;CYQkBmuHL@?2^?h*{Eqd$+K(HYef_AOjrAwqYx6YK^t$$UY3ypFvbUtC
zL<~Z_qkPn6>{y&O(nMlycbfSBlqRQwd@~tqQGD$ho&Fkm`gqjqzPDeP^C{U>+H-n5
zm+kucN_DyJ_H<Ng<ntzSbRCj}OE~@Zy&t|;d$&y*RY+j-)w<x=lAaLrMo;%)2|=ae
zOT}&+xTZV+>T8ghvQU207V{8lK!3#?KlF{E#E2c}(D~y}u)xt)2IR1{QH!gsz*`aH
ziM%m(^VJT=z~#j+FDB;8Fa09+FqI|S{dU#9Y9N?}e_xdB(S~#zSg4cy*@wAp6!}}-
zEVu??{$M_okoUJ7XbIedyS(PF@RsoK3Q<ek6nX<)HnzgTtPG*l1m>bgChDmqA1eis
zUGbx+e|R89YQv2&2V!o})oSFyrb$(xe=SX>U{zko<7F@qWy(fiCqfL^lS<&*s#c<r
zOet7SFDONn-#J_+%vEPLS~{tF94zqm?Glg(P7$IX7@W5kTdFu&TgFYA(PbvHzP5Bd
z4+{=M-#x9e2+r;#cIa|74lu>88;?0HO%*Q($z*C0IT6@!psN*4B-@`}^0e6Kw3Kb_
zO-tHrfQo$y$yPUU3l5kX2@A>2=nG|XyOnk{c-~JxJ1V9Pn|>}E#tn;(ikqrd*Cr3m
z8SNTY{%C!6skYxiCmQLk2u-mnBQ#-fU*0#GVHgC3=F*&RwYeQll60gVr{|1mIiBTk
z^V916^)`aZGj9~^61O)YIQ**^H)VqpH3Y1O8?^_0tF&!pEFj&);jMrJ;YNz-!Q{vz
zzEegFM(J9n#=qlytHI!yy@8l4`MMJZbf*}}*TTd{wwM5T4(}!*M&`BIbXq$aFUZvP
zsd?LcY~&@fI#lWCtZ-7p3r*o*rId9W_gj*!Jw-scvA1|@3n=&+^>6k|HwO=WzZH~o
z=OTQZP)j#|Bhv>Mj4mM5fBELZ!pQ@>fy8H+tqAbH*Ajt%v=EI@t_R(#N|F2AW*l4}
z-MqfOygDdPMLzufdsf+RR!w=EFzPqYl8L<l@t1Kiarl>^j(lfqqXqCtXH0^&d}Zn&
zBcEPpiUVR-yr0bk?p5Nn#q<(=^<nn#C`9JPeni_q57$hLLUG(<6pHcAq2E2|L;>o0
z38&fgzq{x?y(3xL>1EjO4UY?1$Hh1zlw}#b3{kEz#fH=i!ng#ILk-7(PRTDmRjzms
zA#eT|#=rA^X{~JFRxj7c&%^r(9VbIZ3r6=iO@MH1-)fi~s%cnfHC0!H?APtPRrl<q
z-fzmm$Bb5a#ejkF)|+R`&=-hBbhSa{({@UoS}?4!2z=~YxP*fN((P-1QHkmo6Jiod
zv&o_a<Ru#Ke|63wvOJxytBi|G(Wy3ON%Reo)<mC#Sh=KTzqvYvYrLVTakzKfBDf9r
zYgXHoDUfYr-0Fh{hjZLC2<mTZg)d0<UNpMI4uxFQRb)Tke_{Hn&=<zY+UQFgO9v*R
ze%(lQqQo%xC_DS?YQSUIV-O?>d8Rk7^%Z64FmSzeR3V&+id0(bNEE2@FF~pHjF{KI
z0SRh#rXafQMc@ZuR|6ueG}8!f5_ZIS{qsLHi<;N3B?>ZUNS~pMLn-)Qjgh8!J>xi+
z%;~E2oOHusTg_Vc?B?IE!(ysa|6yc@Hod#me1lx>G#iaH^V%)IV8txBSd~-;P?%|N
zv#21GIh>VFFz3RGtF4@svYXDr*e!go_blIqJ!*&Rma3j6MW*Sc@+|~kv6}4#B)v=L
zbx+QqIdd7P+0{Nw`B0>FeVpEe;bdahcou`SwM{+jrK0ezyn9-Z`K&b@%Fk`fo7>G5
zkfB=yJTz{1pYu{^7LPp0;5>QO#A18pjuE>Qqt%^SHbn4De&8S*S4{SWYZ#L&3vL~t
zdPSm%5y%jHF=@t@(klyUd8|!`gq3)!Xu2bXX^<ajW2OB{x@X}oV;rZbMo!n5i=ifJ
z5!+o>Lhh7ljnevheM~w(Pu2NY*aJP}pONb6l-c(3q#rJmo8f%~!V~-MFm&=U3HkHq
zZ>6W3l418fYtqQy_k)s$DZAH?gvRbui}!vj)%AEes%VWE#jP_kFDGtU=~V32s<nI0
zZr?kfo%A<4-%lH4P>Gwy_D2f6?_;`=lJEDvKbxlu36E1gZ@iM_#~#rXxL*rHCJ8jt
zAA_Y^OFAVorIF)rQ)tdeGgEnVtlm~<>{nSI!-pt%ZC+^)uwn5^)R6unCg#0SR{ihu
zrSB&ur;GD(ZbBVOAKi8dCmQr2s>CJQF}WXZyD>!;g+n~!dSlQZdC-#x{u<@97xKvM
zr@iuCv(_Qk8dZT=NlV5IHU%RJT$Z+?5~sJTt+b?Lj;hkxN9l%i#AIN}w$PGdzo<8I
zyvQlcrapD>U@D8Pv|MNS=xcHnTI-6=1GdL)ZzrEsCpngjDU8k&4_Zdk*ONKENtIEJ
zf*8kAa>E-6O=Lz)ag&MVZ)aLAwgsIkq0MTL<R-Tr(JD$G5E(@3E14+7O1RI|kNeK@
z0EzB^*)i)iLq5+z6Rr9kh)UelzevDAMO-oa-Qta0vwQOfBPeJusQ1{oTz}Kvw@w66
zBGI&s_O;Jj-;dpB@%eonMn2w0sx??U^BfP{g!|va)T*}`a~%_;;%P6jdeX7~MYF)&
ziO;{_Ws6ReNO&@pu9j!hd^x;E@;^m=`f1mH#1X6gb>Dh{e5Rc$To|s^>J)j~YD`cg
z>iUj*P~tQ?<Qwgin33#B(jCENIbWOWc0N&%uUQqtq{b7IDBP#hFDedJ9O4DwL8Kd&
zts@8tSKe1H_|scCXZx4kI2S+92XNwSCw%F6imbnOdkZa``aD3{;#2QrKCwAwB_--(
z`R7BjCk#kPct3%iz1~-DhaUt!NI|k5<qHRTG9CApY(JOe$j|rmGzM(VQsfsuxUq?Y
zvRX?>Bn-rO4aiWQl94%N;XF%rbk=@lc+%VV1jxVr1M@_cicER0nw`LMyEHO^B4Zmu
zAx=niXs`q2iX7JVt>pLID(cyL-YKp;5gz}ngW&!ub=GVrmT-6S&qIaw^r8;hPSHh=
zZSPR)v5Vy8FUCb}Ka;`r&n1vVM)iD?!3FwBLQr2jFd5S4II~T@$O3sN3$mcBigqVG
z7qvd+8i!5b64gxv5@|H&ltBlr%(0YOk6WA-VKtHInC@YH*|4fK!>dl9@3q+pY2o`g
zS-;ugZ)SG?S7z7aX}MrrUwb~@K|Ac?+;xA27Hx8zx1aewt@pLd-lO5N-lQxyesf83
zSy}t(dQ*MhkvU#x-T8Sk&_e&f3inxfoiLUq+x7M&R}1=%pVN8zP^sqoCTomOuH*5X
zLw~Kfa;nnvIt7t7^V~G6^txvJz|(P~Je702Rv}vh)+ge;Yyf-lfY1Eq>kNON!(}ye
zwAWI|oPFK-C^2;8C6j}hL%U1KRmuE~9x+W;y!kemQTv8Syfr_j8!r9f%Be1FbhIK#
zN-L2qS{z2~MO=A;AG?rbKu>#{J<3m@i=QewF^=ND|G0_gr-fBp$9CiU;&fc#s}mcP
zoH5B91jkV1NxcJ^`YSLD#Z`x|X)cM+;*B_O8}ZBYYMHsf<?Ru}udDL*WLw7LsatJ(
zgVSVTfB8Z2c4MX0FL9^fAI>{C_DZLVB^3MXcCTu3{YCQFW}=c^wFU0UhPrGR#B#{A
z^%SrB<%Xe!=lQ;jl56*~WZus|V7n-$!`H{b$2crH<Pp5fZtg+iG&iP<{#r8rGwiUD
z)I$22C@;a~2A)P6HEzhl#ErWQgt8081BiNCeut>8@wDXz)Qg_%*DL_eesbLR9O$w(
z{dp+pa_1yng`tDNQ7Nxthsqftf@cDN63r&)?!$Wb7vr?p&RfXy9;Yopn<oKLC=Q8)
zrH@|cj;xrXC(X?hl;XPStt&RYbqUSueu+iBr#zj}Pc-C%Sw|DyNr`BPui|C=tXf9Q
zE~!Y2O4||>#pp#s+5OG^pRp*_!tVokM&|pbxDlbt^0K>3Jn&k!;dfy69vaaDe^)5w
zQ^kJx+Tgh}T!RtjS#Vk~P1k~*^BQ#4Lny9n7F#X(h;7Of7UH@fhPyHZ($`HYd|I-C
z)fI-pNycA7GGiAP{iY`(@N2)}k@q9}+<l8&7jvYR@i0jC<$1-F7t-JQfd9roRhSXb
zDn?}^^?>P57Y1ImSDO%kmOo9z<2E<uSk5OhOIqT^t|vwx9%x^{eO?~2Hb%zVRWqlv
zC?VlsG}BkgTJJnPbZS7bxnWCrS}o0~qmPPQli7)kh&tK8Axn4J_T6rCX?9mR-tOS)
zu#+x_%Pee=(=D89l@`---mPOtUGH3Qsw1hU8<oi(pKN@yNo&<NB4ubkCG()dd`M;T
z{6vQp)!MBcQ#zxi0BVf67>nh(w=;}Xa+2z)+;kJoyO%YQH<qqG`HrLXDV_NGhM}XG
zOuzA-qb3q5MQai1wDQ<*Tt|LRF+Tiyi8o`i_tm|oOcRQ;g!-WZ*3;wy7nS$Ql;2GZ
z--6WVh~pe_WBuOr7EN-u?0<4;xd9XKmMXTYz)Klu$4RJ?|9an4B4_I@DqHQeoaR{U
zQhAIv@~)zD>ZR?Z#{OR3j~kWJWK5yc=}ni?WGnVe=1VIpfXL!)<(xN@nVOhJA0RVb
zK2?GGYKxkx7EUFl&d(<%9yOEgG4l~k*v?4r-e@FFrEK(j+_e0g=$@Ep+?n55$bMOU
zxf|vrGcxNjoST#wrkK3P-(>e$PVoG`pIH4^S&Ys6n#@hjv~)S^^0*4T0XFh2weq&C
zm{!-wOj6RcSS%@xb=#P4K!%1vX_&XZs-L-w31LYC3(<Qr8LH*st+=P7kV{A#!-?zx
zy&q+5{R_SpHivzTXZp~0;Wg<CB4w6ac^2qAUQ@0BXZfI8;>M*N8cATh38LQYUYHg4
z2Wnz=cx$26D<|A)B*7_blbkb_+x?JkFllX)ew}mcgk>_lt_}aWR-M6TD*4n&g|#vL
zpAC&u>!Mbgk*$j9#O4qh+Exx-hKiF>UUHL1;~@8%bJz&(J-&maq7YxOOqHerDII9$
z$5bJjO0@1^$E!$p8yT~cl)ybu_lnPQp1y?kr8CKr)kcd^+rYPBi>CR~Cyb`e^cB?E
zXRxi==|!M`gr}!OzP{_}2}ScV*t1#;8`2J0^k%ryAv0f^v?7*|;tX-8ux?LMwf@8B
zF`wFN__eO~ptl>nq7MdnA=$E^mu4m&|A*s<Jl88H)=Lg`BhnC(EQqt!QQurPIbthw
z(dktiPTt-Zb2pzvv|PdA{rycQr4(`xve0-31b^ZTQ)Dri@DiMHn&;E6c8w8R$3rH!
z?bTbHwBfAeLV6SMuvC4&BiXzLQ_tTIbs-H#3Ov`obJyE^La{}yoQX<r8;sz^?n%kh
z?EBJX1|>ocvH!TAn*R85oZ%-$<<@Ui4<6hrGS-~zxgA*b$Rualj^x6m%Xyl_Inb~k
zpEihf2as4zD<A8$J{FKvr_?*6h5)@x*uv<B!FbeOkZVpU6T+(|GL7Dyv>Wtr7;Eud
zASPxG>a?^iB`HDPi|ubd7At2tXg9-g=!Gs2n#}Qcd=7bVdYCeQpuTTC%qXVzWf(Y>
ztu>5bmE@0UOnY~#td237S;|(%eJrV7vHWg`g`7{I*kn`Sbq@g!$HuU^qBsc(bkG(}
z<y|^*#r!gy9G_rn$m?M!^Yv04<}eZ-?9YdFDU*oy*QBPQNUsM2k~VuIR!ESu9)!Dl
zWMQI-%*9mg`^7>9q5l_hY)Uo{1i`rj?H^gY_8`tTraFfB=e#Hdc0;=^XTvuB7u?V_
zOL#Kg6>^3e{LH}tgh1+i@c#6%FE43`u#D_pX4q3pA<^WH(+l6Le0wM8tuxmRoi}Kq
z4rZO_2apcDoDZ`eYwj4PtO^QvWxo|*ElLh(wq(y6e2pNX{hqghO}h*Ume5B7=Pw`M
z;iWD^ZR_Jnk{Q<qc=vlFj+T>S^Y+V{8^k)-43EcOmoJ)+*RtYo_u^A4JUl%sPvN(?
zvQk^0y(Txc8t>;OjAq%Tq~gi`$%ge!;RxKcP`=MsguJZGRJO-9g0Byy3hwEI!OeB1
z9yw2C{<5Oty1HVcSY6NJZ-na}hcA1bt-X7@&hIeaQhtG2)g$guiWP&}fw#xsNfb(9
zD~O+@*#d*Z_b`>$dF)Hpkl(-g;NxO}82)ygkw<Z&982H8GD@hxq&e#9By`Qs?W7LB
zl#X{d!;eRbU6y0I)P*P<-&(=wWJlq}xhW`=Kxw9HC=e#}g-4<MoIt}dZI_k!2*CW=
zcd{Z{lJ+a`hVg&RGYFGMXW{_M7_zvzcUEaIqq?&0Q?oI)q;nM>9N~)%ihc5s)vLCS
zw?6_}ETjInC?w@PPUb_`wwbPEl*N!{n#>h_I!$c$1~b4yR5E_vY_>WslQMBn!wl`6
zaf(7aJnyVkFr^Zooqb)$RfS(x!n38AXm)!@qlX1zpy=e<+2+wXMf!+9YJzTjl-$w4
z%#@f}{d&}S7Z^Ax9W^wYies^y>h37Xl=N`0k(fm18pTOOm_Es-<hk$??6CX+>t+GG
zur#lIw7?GZv}M>3auLM|H(-nrB%OaF70kGqjVF>{p_Z%kxDdrDUSvEUD}j|I=2q=1
z<7M&te*bLJu?z{Uxxk;g{om1k<Gd^3TAPDFn5)kzXn?*1l47Ib5ok{N1a-yuQG}*S
z@R0CiA4-+W3pO_~J}(V@o`@N|-<)tPo`+e4;===X%ouj8>Ay9nRXIYuGueT5_P%xs
z`Y?^xNMhe;AdMl?GiOfsFmQEQOh|EKG`gb>i~7Hj8gnFNte4-or=~j@y}vLS+=>w|
zDlxY@7$6yW#~`ZINd2sUdrFc7s<%1Ja9(>B&R7SWiq<Mac>BHAMRLxU^J}D>C4@g=
zvp+;&qVrH@`b4iH1t`PWMGWlIg{M!og>=e0!(T_>M5h&2I0e55@QvrE|I3Fr*4Nk9
zq_}&#tx&rCVAI2D<-`=w|K16LBYe{=oh3$`>Vro=Hr5AL0C?y_|77O>kIk+=00{B*
zn*xFxgam|I9~eMa3XJ<-+mfOBa9{5z0L&Yfb`lO24mLxe8CW?w3ka)@k&OW}K;uHX
zLK;qf4qO!6lp!l3U=N^9ib=T)V8XCu6JG=>$62E_O}9k^QifxN6M+M1z-E|&2!_>%
zMFLyvhc3=zW&i-#ePHW<GWr1kbbu+~3P>Gj9vBr^AJ`SR8F(K=9>g7F5)>Ac3sfBp
z6-*c`7wiI@5S#~G8$1`hAAA=A9)c2r140%e9HJQ#8B!Rs3bGS&67mpA7HS{b9tIwU
z9>yG|6BZVZ7)}@N2!0(Q91$Jy1<4+19~m8)3pp319aRz48I1ug7wrR`76X7`is6b8
zim{2whgptQj@^pmipz)lfESMUf$xidLm*G!NC-|SPq<AaNDNHEL8?e5Np?q`Pk~5b
zPmxVAOR4*F?I22(_`mZYZsOk8I|2ZX)=z{9SHdLuEe)WU1}6XSoBu>7Q8?_Ve!ARi
zbQY<|l!xU)R9QpOC>V(>oOBXS<GO4HL}`IMiDtsXBt#ZW(x(L@xNnS}P!CGU=$;pC
zdHKh=o)=zrEKjx<p*98hqW236@9$o6;Qkv$GX|ia*D&5*Jb_xR=ePJ518Pul3ST^X
zQ2Vtg-QWa4QZHQIz&qrf2zvd`Pz1eYH&XrVyO_RmFGnZGbEJDh9NX_`MbYF0d$O0G
z88?u8IC&JE5Mc*)$oNGcHvK4r{N&znwsC$xZo+Q~pss`Ra7n!ZBT0QTaPFM1M0;5W
zElEAde8FiDJD(4-lh@l`gt9VMHgyw}x$4(dX>+SwC=@DW)6xpVgwxKmUoom{%xyR1
z7-e#KGeZ)PT%pW5EGZ8g5F3e3mmr?#_ZMFSU&-+AjTr59n(2ha;kwjaiC;~1Qb<xh
zL_Pf*!wDQMG!#}vLe0#tOrp=`Y*rg=T5!i$>yw7Z)_Wy19c%N;jFW6f1r9Y#nowM$
zgESlADHp;hEaU+Z3F^W$j<qI>N(IvPDHo-J%aR;+H!NakF?v|R3%(|X!fsKqQRUJ#
zR(Bx~zt#Eu$wbm^)6P0oWbn%Z)5SKZ)?k68>DK2D|AkCy!djknTB0^v<aAY6%Hn2l
z3)Z5iPl)32dQ)nts+H0QuMioQg)hkfnDpK~Ct-21qLCjXHFx1eRhp}5XqHT#jO9|E
zlw*hFTiNDV6)0s)5@r9;xMe8d4!294Eh0LHe<Yh4FdSc;ZH2lK>chM3;qwSMLxVfs
z=o9UB1cx_Jg!62BXp%|77Gg8;a0WmV0GUzJ<PSFXa>wY!tlQbEl)u7WqPJ4)pdL_t
zHBPSa)se3yr~tveC6#-iMOB_;JK+=klTI<UC&1Tjz@z=O-nDB@TLbJ;P90%q42~+P
zmi^Bv8A-}nvEhpT3woP<bT>cez%9fpf)mS><{e`aWd^AvPCry`LN4@cyJbc(8*4wd
z3-w~8APl}l>Pd8I+Eo-GyKx{E^QuT)Oa5BVK_)Qc<Yt4xjTeR2D2Q#0R_#(D=xml@
zsLPOd1n*j1&|4mNB<IxT{!pZ>%XlaDU6NIdkE9apn9;d#KXTM^w6X<q6Rd|!qsA&-
z_fKW)GqjE4rd&p?@6mhff=l)@4FgXE-F@;wdsZWxisU+{>cY+DpPbDknV}QN$LrlR
za_0p1wSQeRdp(XFw>7Iu0ZcPaxC=ShrY>q=LJyan_<HF;6~(n=j-7kx@!#F5A&IFp
zE#5TzEM9l>$`)5qGFEyjaX8%?a9WDZLhKOy#TvIVU&mON-&p6188Od$q3MH6QwaY$
z^h@8jzYyHs?LwP4GXH0<H3bBH`@;T%O(#SHP{je$xo2<m=1<i{BqT{>IiO&KZ%!{|
z;#gLW_ZD>JaI>!dmIEK$kGQFujR&oF&zWla7xJ5y4-X9s2_G>^PgXEJ4rCB{_h8T1
z45%Ko4={+l&QL(u3m7$AorYx3gtBE}-ZV#VovX4hT00~y5N#ZYIr7Juf@1efVj$^w
V0tW|MS(k>w01N_AV*hNw{|`D)-Sz+g

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-3-a13cb765.woff b/packages/icons/fonts/fabric-icons-3-a13cb765.woff
deleted file mode 100644
index 43e515991234bd7478881569c2af7cc7cfcbfb6d..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 13976
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
bo=Hrk9gmQZ5G(7lFqnWr5GtJS1Ni>{5gXGW

diff --git a/packages/icons/fonts/fabric-icons-4-0838b5e4.woff b/packages/icons/fonts/fabric-icons-4-0838b5e4.woff
new file mode 100644
index 0000000000000000000000000000000000000000..0cf7216ac7fff479ef0f8d111f6f8d5fe1276daf
GIT binary patch
literal 15164
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
T!Isx#p)df0K$O@&1^E8~+-w8y

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-4-97372384.woff b/packages/icons/fonts/fabric-icons-4-97372384.woff
deleted file mode 100644
index 142ed7e3d4d3f6471eb0a79018d1d5d63c01fe98..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 15464
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
G0RDd(B)Xpf

diff --git a/packages/icons/fonts/fabric-icons-5-125dbde8.woff b/packages/icons/fonts/fabric-icons-5-125dbde8.woff
deleted file mode 100644
index f1c985ca97aab410fb04146672f9fa4ef5358fea..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 15340
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

diff --git a/packages/icons/fonts/fabric-icons-5-5a61f6fb.woff b/packages/icons/fonts/fabric-icons-5-5a61f6fb.woff
new file mode 100644
index 0000000000000000000000000000000000000000..b207698c67dc1813a861601f55cf309230ce9207
GIT binary patch
literal 15468
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
LfKcInFTno?SaWoF

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-6-2e7e2914.woff b/packages/icons/fonts/fabric-icons-6-2e7e2914.woff
deleted file mode 100644
index fa1c0dca1b67721ca703fb82f11b15ff307b7ddf..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 11264
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
G0{%acgj_2C

diff --git a/packages/icons/fonts/fabric-icons-6-baae6235.woff b/packages/icons/fonts/fabric-icons-6-baae6235.woff
new file mode 100644
index 0000000000000000000000000000000000000000..72545c8c4baffe5dca6ba7b19ea46b39cd44565f
GIT binary patch
literal 11216
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
O!~_h2P~v<y;Qs@f(pb&_

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-7-143895dd.woff b/packages/icons/fonts/fabric-icons-7-143895dd.woff
deleted file mode 100644
index dd0b6e1881638226622f718fae9632350371c786..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 13464
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

diff --git a/packages/icons/fonts/fabric-icons-7-3ac670e6.woff b/packages/icons/fonts/fabric-icons-7-3ac670e6.woff
new file mode 100644
index 0000000000000000000000000000000000000000..5dcd9b6b8bcef11f93acf612c20d497aa242926c
GIT binary patch
literal 12856
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

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-8-bd2a110b.woff b/packages/icons/fonts/fabric-icons-8-bd2a110b.woff
deleted file mode 100644
index 3b6419e9a3ed699b488846d10f2b26b6fe45bac9..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 13172
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

diff --git a/packages/icons/fonts/fabric-icons-8-d0700068.woff b/packages/icons/fonts/fabric-icons-8-d0700068.woff
new file mode 100644
index 0000000000000000000000000000000000000000..51504ef64bab402846584c4047bb5cf11a35955e
GIT binary patch
literal 13124
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
F{{cD{2t)t?

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-9-8ab77260.woff b/packages/icons/fonts/fabric-icons-9-8ab77260.woff
deleted file mode 100644
index cf100875b14075407ee56c40e0fa926190e3ab1a..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 12344
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

diff --git a/packages/icons/fonts/fabric-icons-9-938d7113.woff b/packages/icons/fonts/fabric-icons-9-938d7113.woff
new file mode 100644
index 0000000000000000000000000000000000000000..8b95b2e4f73ea580f709c3a6ccb293cefb03ca7c
GIT binary patch
literal 11932
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
G;Qt52<mgcV

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-a13498cf.woff b/packages/icons/fonts/fabric-icons-a13498cf.woff
new file mode 100644
index 0000000000000000000000000000000000000000..83ca678700a53f6adb4b7b42f83f90dc8b54ea26
GIT binary patch
literal 6784
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
B!6yI!

literal 0
HcmV?d00001

diff --git a/packages/icons/fonts/fabric-icons-cf6d96bb.woff b/packages/icons/fonts/fabric-icons-cf6d96bb.woff
deleted file mode 100644
index 790840eadb124566dac8fdd57b8e4e450fa6a647..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 6524
zcmZ8`byQSe*!7(u2ZoUDknWU{R3rojknRrYlI}*3hM_@eK|ql1MkJJO7?AFej&FY7
zyWW4^v({ecJp1nFdCs|ioVD)0UaE3(00=-1a(@8#znS9#02j{wxB9<BRfC5g06?-x
zUI7VHJ~^LV3r8~-Bo~JS1pt714x!5{7M>n-$aNV~gPZ|&$ULOl+Qr5Z$qgan6Qow}
zK5r}D#>^d=i_(PTp#LA30HuwCk2R9(0{}dvj{M#~812;7%FGe~2!9|o$o_!PgMp=j
zEs{iXJII(A2}XPnCW@`2hc^HaAwvL$ga_p&4zGi=1yV<(hK$|*Lnmuvt)rPYvM&*`
z2S9@a9nb{2bTV_aLUMnRy)OX(a+{oTqT%A~?g0Q~OGwRsMd_Z@foc~wD`YMia&JHk
z5|iHTXSm)u7N%xTBO)OoX(1sWNGkYHPznXZtviMi2N?Uhhll%z`Y_R<(sW(HKu0$g
z78G}!T=EbBoYOO+=u%^cmv(g_yUJls{a44-)H>Ld99@p?XIB%(kOk_w9vLaHON5Sr
zu8p3y4ITH%KbP1J;=VTAX+ClPv&}zFoWCzA?BjI1bkux&p0j;8{xY8@DDdP4L5j=6
z+?H`>z7R{!)6gmMu>L2Og=eMh`rpLiW`xdGb)_*zyWZ{A(qh;#|LSJ@%ZHBBfXTbZ
zD?-VIfQ9oXDHN0?5>RD>C847d-CR1#F@INsAl>5gpRA`^>y3RuG2;YMjFO7}soq?t
zu=R$%4>9rtaK?BA&eWaso#df3%p^>bPWlzL73LN8mFIcPG@MQxP7F@$RrH=FoUbn0
zcMOu0dboP{Ud@Nfqv2tdU^$S?(bXuM(y!vJ*eNJX(D2s&8O-a30_Mxr!T^ALH^0p>
ztyoQMO?CT+y5_nLy1awCL9v+l0PvLxBh5R<D4`S9D-9iRXZ#V)A}vOr`+@y+T6FGi
zq!Qy46BBg1IC$!9(Q$BUL_f;-x)b@iIp)Z-NA8Bs@mv2+_tKl6{+>C-^6YHdIl_p7
zDQw)m!_0>pdevhgD>LP3AMGovZac^qdl>0Il^WZj-~ZB;9cgGAa=6Ul{qZLgE)$Wk
zJx9Q^taFfhT}wQ<pCO!JRrNF=PU*IuQ#*1pmbnt;%DC>l45Zv|LFj!!fgdzfB=y0D
zaKk~=YOxFE9x9tZ48D@h3cpiI2>Mr${1kcTIMi7o^G{{zg5)B~tUI*kGu&oT4MJgh
zgByNtIRJnFFn|eQJv{+<-Z^Qy*e)8gnUYTuSM-QEx~hmc-iB%`MRbM`re8gL_Ljz5
z4>b@=CX^Dr9dkMmL5d)gi!#`CU1Y?xh2BW@{a&&pb0j2yptjCw5^Q9h?2z+2S8UO&
z5j%iWdBQ9+)c@G($-NpC?3`{iznwQIk?@pr{<M1a1jqcV@~V%tXgQo9BC$!y{pJPy
zlKJ7=qXlAc!2J0ktkYlC5OyLD0d3Lo<I=(2NtYxFXmc=`Ppd-6y|Vri-gLrJ_`=sG
z&C-}S$IH;UN}7$lXmH(9mQ)BVlv&~+HO{o4FFnMYSyVkqsN%5bu!-y`EhCi)W6^LX
zU#@cJ!N6<xHQJxOfli~F8v?CgxH0|^Dy#mMVYYS?D`Tm7`ru~tQ|HVlh=mn~xxNHD
ziDpA+PUu>5Dq)qzZ7L!#dhn8;H<#LR4swSd>oeCTYfmu3@)&uNI|tLSS(>n|8f719
zzr6inc$tRbKUIw$I;Tk(Jv}vW|5cN6utdR8ke~izF0=PNyP$L>GkzRKF)!+L0Rg&6
zb0sQqJwVjC&IWiPP!rZq;lWY9>rD8crUoQj7XVi_+$4f-BVD@d;oeu3B{FIZI2lpj
zje`%FLhng|g253JQlIV2TxXHNm#0rSb?$kML-+sq3V;$<Xvvzv96SK~?u1KO)Y=pB
zh1Jl=;<5P$AMaf+LmqkFm)$q*v}3r8!y{7F&32s;-wRiJ=3d+)HhCPYs#otP&Kzi*
z4MePldm6l%NjV;addQk7`JRYpdx(!Yz5W@iyRXI*XxWYv$8MwldNwkAyd&J3?66C$
zkMgx(&n+}|e~-Q;<%p_6Aor&ODsgJ2ii<wW1$o`GNA=@%b~e)<QKHBh!E}4(d=&F!
zYf`E{I%ejG<(@ael+=_$(UQs!sZfDV8E7Z3vZDdRFx_6`tB(rAGfnU1j41jIv`-fL
zS>G0)y#;C6aqM*;q6%ld%i<-9TfR=fqfzm=$Zu_vCle&dwhk=+_RaHfR!qBmHKP5g
zuVC>2U(NqOtOu1O;6Ux;VY7c#Cj)3ifebPn-WEg1?n!kE+mAOQEud`S!RN*&E;Aou
zbIOK+a1?fDXLt9LrwSsacN;JMDcbFYej<+JkBEsYV^r94JqggSkSM^ld^e|~yMwJd
z{MTb5j6ybD<3?)pGGJb0oiRo2EioSP55)oy1#?z*ItB#=eHN2~kuZ*RO|~2<_0`R`
zN6sHYUHzNQ^XyT+D7<V7q5LPe%?aQ_tvV2`Dl1|NTZeV!$4blgK%P~=FS8*i*Req)
zar8-D_(u5KNb{4ri<hDkiVrQ)qeUHgfw5<VDra?@>mk8p9HmDWZ{~(Y4?q0KzhwFF
zRm0p&(^Cqq2;ZykMX8z`LiDffX&lIFgXrFjA{;#{0;gZ*xxhs4K<sMby};#2=92@v
zr@hSGzU22YDw<4C>_9ldsM*gPvMLw*4@zIbAEqanhn>gg!z?=J{m}+x&C6}%J@1U2
zNomo8#HvM?axg!Aev)+6|6o*Lr<l7{g{e9sYES!|br$oPv!Uz|6pS&Zt3sukyMOtR
z$jl`4SW{j1g5dq(!5v~?o4av0zueeax_CpovSBgrv5Y5e?`~&TIsWc@)}dL2&Q5*>
zs9LAEs^Qo8ydwi+X=_?xAYQjClcjrtMwf;5D~8ttY6OuxiGqS>N%*iVv)gB@k;-Jk
zDoaXiN6fNc72~E5dH&p0y%aj;aGnxZm3X)5Jg7!^26|S73wS1p*uRR^GWnIR;%MmG
zTutsWHZw3{0TQ=gD(w-@n4&H?8LY#&5**TilgU`;5sHThE0!6k%^IC^Oon-*fQ}2I
z3Fja|+?3f=ee1X4eJp9-YVy~(p=E57ibTg&+<G$lE-dPeJlXddMaoA((z(4kB(W_%
z$=>sy27_Z7HMm9UQZiHeFs7_L2@^tMQ2(gVH$uEfE!|=nYP#`lI@ShT*XGYw9l_f4
zDzZX7{2j{R?}51Gec7-5-zDWFS#oh?;(wq|QH?0*3|{aix-x(sqG*mZnQV#0<lvtI
zY-N{!%WI$iioheDCL)skXlNWo|Eb)deG?%{ZO>49llpoz8{h3uIL|XS_-GhWwbH#o
zs&cBcf~@pMB><BF8eY}H!&Mend6=Og-VDhe>HhLHD!_fP^_qHeackU#aBH0FK-$%c
z`j{`V{`rrSf=vy}13h>5THC}v*~N0n8H)K@b*Yr1bL~pSe*tsf53f0LRa~eNxI5lY
zrkA!7OH2&k!s^>S{0bkPlE+L=yW`{W?%sVeXeD_rno*u<FvArKU(a+cRWc*d-g0-W
zJ<9Sk<{tiu!-3^i7{G*{!V6JGu*dxjxw7Vsj|MZ3;gR1x<NGx}QfvqFgGDTvn-Aj!
zx|99O-%+N3-BBy#u63sMX!K??iAoj-kTxF=?%q9{AE4i?bW7Jv6ctG}al>~_n#2=}
z#G(kysR+RUF9rTVd<+|*=Eu}HDzU=N!c!l!tJ|)MPK9S-oY9_X^JG{by%_U~2p4mA
zw(U-!u{Q>rq%DUup;r%7sKA9+%}8K5LXNjZE#J%#pK9Hhg6_$#Rh{cK%lc8A=Ed=K
z_2%a~9+TeJtcsBC5m@&;{toRYL{t=SPIGLH&cylh_-j-1R9$8r@omt)`@wJV+IxRQ
zaq{&fbB~sMNAWB;53}Vg$17Xz{OIBLS2<Zr)TOp+<~TJ&I`hv$D|DLCmi-(C)}sq&
z!ynU@#gC224H^q--MU+Jg``kdE+S+%H5*)34YmX892cF(+UuR^v-LBZ649$=-J;IQ
zq3JI(wx8Sk-t=H|IX4~!KHXs$*o@dpTt8fSHFhkY^+dq4EAO;oz8Y#&eY%|AHG_gL
z4i$ZMgQ!qY7GfpuB(xq}4|*Q>q&ZVwlWa+ZAH?VuofUw;p#UMwmKPN5m?zLke7c>)
z)2}rg?_p^jaARyz`Gi3QhR7;lPkbReu8b3xaTH(RwW3)o3d`@;icJ~D90B7wSwx;m
zhS{!!pTY&M5bUyr^_e}zcHEY28A>Qs8fa68ABRa&EBZJ4*$3S{c4e)nfA3nt;5G-k
z3BO|8&)~j#yBBO}e+Clu1~5Kn53ju|<I@+l@?~pJ?a<Uz=bzuqGJL0QnXdQ9b|f#l
zyB68Yr3>2AxM|k^O!DcgIqUm80Da3qv5A?uM0uJjKh)YG={%)oucV4~rouyMLK8vZ
zsa=%)o<pA@ebo<cK*1+T#3>9Pi~<itp~?1SxKt9;#(y97(e`Q6(*9QKkVeemq$wJY
zNRxpL$52hqWwP|U`RSz_i^#hXKCN1Qx%!!!&yXS@&#V)#oT-~$0VKS5F}Cd)=qzo&
zg*D)0W@&#~KUVxD^E!CZ2FQ%kZDQa+>sqEOEogoV@bN;mx~RV__(pr1M}H)*z-bZL
z8BwjTFMbzv;1E=eCX=SN<a21j&{<j}_*t(lKjThkAOZT^*fyxtFD>XOQfy<g@7a4v
z+}-=v?DgMWFC7C>N7~c`z5c?zW&Yt}w8)3t)6nEr?gf^%@7@^gzc_~vlz!fA7@607
zDMzwQ>HHe<?^=Xge<;NEy^qT)L6n!l_=KY&R4^1FO3DqPi({k1g=3$+m$V1I7mL-N
zKf?7UAM+39nw_n#GA}O$mO1JpJB6&R|1iWdC(^rj#e`pRcy>Ofbk3hT%}%%|4OXlM
zUSzIz_<8TGD;fC<=39-eP*bj{abqF`Ngj{uF3jHz;1ORFiy*3Y^3b!CN@pHXW5GpA
zFUM(oimb{5m8BYfY$h?-cr_dZnQMr5?8ZEtq}@jLjm^$ftvp?qcpq-D<T)F=d)RCo
z__A|2s2n#_FOKs}cPcKX=dE^Z7#?SJE&UU)smiDPy;?4{P<vU=Vm&zHkgs=lT_`~5
zMPoGS_QO~;1v)ri3)^aWPDJ8D1;u`WBP6fFI{J5bKsRN4mT1FmzIfB7(OIh1zZabY
z{>0VLSh3yT&c`j|a2zXP<Y)0KD;r*4j}Raf=EW|(&YVh_k51b(`-3GY5Gb~(6W0|n
z8*^xuB&QDfy-^s3;bbU&v()A@p4;ZVA?<YYGeMPhS;&5-p|Dgc&~27w{*0xR6Yk*Q
z)mn*PF<I4$QX3{(QD~F2DI#h=E4%qSSgl)y@S8_p?Q3!_Rl4+3gcL*bcjK*<egd<$
zRy9`q#B25*F#E1IqvVS^DHH3?=ewXAFB@ELeUFoo;}H+lgv_xS>7(zx)-R{V*j^4j
z&Ak+uR1vb1E^!!iNu_E$S_;V#z}*mudlZ%Q<24?7PQS{%ubOq7dCYY8>=N~d;YYIG
zMm&>2QmLp&%T5m~#tmoe@cG5Y4p-Jf3*Z+@SRC#4c)B}5zMkwX<ucFF{IitPU?Mhr
zHjHK2936VO63cbJFdm053iC%xDXj)u1lJ*~y;$;l;`{b7QFY=tV(*DeqtDgcCmhnL
zU3wf~uj+hWJ*7zFX34&qpytI$<^@o!W9O5@No>i<*D~z$SI_@8nFocD%YUqFGOoi_
zZuN`Dk`r3P-jdOzk_|zp4{>7|kzsJ%R(r2ST$dQB72vr4CdnDoYrEaAVQKQsy%n!5
zZs2LlcfT1NJAW${*>Z8)YTIf_H!q_ktxQq@rR)U5C3ZJ7p^QBD3I+C=iC_U!ao%uw
zk%A&FscYQAbB&hXzb=Qyw?bMp^8U(}yG7=@8@0HALWR2mt$w(bSF~}{dl#>rBVlx&
zfjAOvzy>8g`T4p=jpw~!IOCDdKqAdv_vrk$=TI5p+Q{sE_#zg*g+A4<bOWi1$G@HT
zn>W?j@Fx*`Um-V=vx3t;CA!B)Qf%kZI^*xPvU>3HCj==r`4Wj(QrnzlT}o7xVKGro
z*oXVxkT;a*RkV;cNQ6z}_`dkEYe1jf64&tg)zd}!K3Gb<7Z+C@^u}1r?Exipj0|t$
z1x@oA{|0NQZ$!89f*gV2FFXDW;+2!s2O+1s<%T!UYF;s%=pmGeK5*H;nJKUtncu$t
zZL?;x?XiS9?5u|;_g29f%>2>yEAg#?YR<g`g--M}2S5E_=`24iKr>}SgLFDQZJIkv
ztd>HlxLB89l_03!pw`*j$$gl`MfowMt*`bLdKYpSvV@RkB(aok&QaBVS82j#Y^c}V
zG<V;+{!WsZM2gs$&6tyit=|52bA4jM+;-6EGFmkvZ=ImZBLB0~V_h)^Bca8qEjHZM
zY8e%Nq3;UGFD+gXF@rai)iii3CX((&Xz3EL*j#;{UHMmda9o*kJvwiq+Z^SbTPJ_Y
zD#JvEHy~j-Wup_cH=H)L`D;dC8{6TV)H#}`$Q?ocQpegyK|0)}8*WA%vUcW3oUa8R
zx#V~pRI_GLrzcQ`n;NV95nihQ9(^yd1P<39RwZatd&{cxQkPbr$JxoKKT)!CluP{Q
z6ImjiB7Ogdt+RcZ(|aKk@+MI-Y160GFdVwutiyqEx~wn|=h)9K)Gt7S88*_1`=6XO
zQvf9Lb0`=q0{{;L)JOvh$xoZ>4s-*kJ<|7?A)i3t3~~xGGBP+nUziVEMx2folb$ot
zcfgd+(iGFW3zg33D|8e(8V4t@=9RvnvTho_rm-Ec+Cm5PdU5`9=Kz2N=?)qK9zZ%M
z5>y5n0h53^!NK4*@C0}VMF=GlB?sja)gN^MjRZ{`%^1xWZ3i8O?t-3(UW0y(!HD66
z(S%8W>5KUrf(p@xctVCD*I1HRc1VM09qSRB0y_}92zv_q7Rn1XgeF7FppXB1Hq#o@
zj9$7S032tUj2*2(#vr2%Q0{<g{(D}psTxZuOcZ4Na-QpbIsxn7ve#_c{c(iCjDn(E
zitfY4LT2>vQ1N6N*#QRn_x#Gcp9iUK`FtT48mT0{2hI5f+j+hRe$IlIP6v^WpK0XI
zCnxXj{8Z6{7YoPDP#=!5{r$v44Vv~(X%2dIAPMS^;t0rkHDL!jZJ5%vm_K-xxed>x
z=L$mGReGY-BfLfysCvD%v;Bt=@mgf%j<_(6nHB*%e8@b(l%&jOX~T%xa3-KBym#y&
z?2}^l$8kysLY9d>rG*@a<x?^G1A{5u<2c@;H}r_?jmDHt0?BYV#_GcbY~*;wj}@kJ
z<XH2IHBa}r68>jSjF3f(X-rvtfNsp=_v0t+d4c8=X3|pC{PBK8OtDA-Bf+$bMU2H{
z_d^t4lJkS^hsRXhyE@XA8vP8qqG)6G_T<O<8l`7S0rZ_civvj_jT|iYg|8a~ZusS{
zY=!I>g$!`E$rnb<w;d409If*cGkhaLTc2I4`1K)TLwy{J(P;;=go4Z=F-f|z9B$QC
zQyQO@UD6IpUd_A}aXt~0C;ntY9zGdpWiIO#8y{PyTxEY2fgz(S70mP|!wJ6Erlmqt
z8k!-$$TklJDRV7M{N0Qg(TCdYwb>Chyw7d_Rso~ReEF)HB;%JHwS+&bfwoQwcla#5
zd1>^t3czo2=Q{$WB99~Z_fdZhM^3BZ8wba<)up9s+NEZEzgm;fpBL(^Dptv`at^Od
zb*h0DrM)S9kLdeUYct;MgT3WQFFI3PF9eOatOpjl+leXtT5EW8ElafcijO|iTj&=G
zesR$dELxBaD@Q?JUDwM`CZ86ZU9`$>pob()EUQEtY>#y#^O7~p^GRADoZFN#AL7`G
zog8->`c36D>l5I}q?VeKXQ6$~fwKzyp^QDo*%F=TtxnFSed;qMk9W04+>cl*!b58X
zxf@;)eleot)*N@FBZTA6iW5vDRez~QKCU#5zsn(Ck8dYB82lWCTdZ^`H$CPlhnG{=
z8&7srsB55hY~rdCnz?hb$m=CRC}9yM^pjKPP(5t#H*bHtxx^s#vF<B>HLAhfUB~mk
zZ%W%OSL5&AzL1w>s6gB1^Z2s<ama3{q7icmt&>Tw%09!mydwSz%h7E~HM2T!>#k|?
zL(UZkuXqgCdFn<>cAb#c+XYeW$&;n>+@%zi{vFJJ$7^tAk0kH;&GvCbr(5f3)tp8M
z|F}EVWG;pE2OYH67l&;$CK;fwMb%7hZ3vRYrw;9i<aCZke-0@@zq1L=_eZfR_9j{h
zlpT6F2JaeP3u8zX>7A-PZj&EAk?&7se!4<LX7uro;%&B?mfWp8;(6UUtLKU&|IfW(
z4TL=fLN}oqU0{IC9E`jR7P|^YYhsd86p>#Rq|r-b(^-^u6~kSh+jC#On3GXO?^};K
zsrj9V`rSKsw0<)}hEtN7nEV+Heyj=XRYn3zAHmuN!qNux9km<iBUs@5OxFbrna_=3
z3THu_1O=9CNt*stx)jd;W&A8x*ZXNJm~s>%?3=>N(0YlEjyAiX3?T*jK&;50CBXj!
DZ|o<e

diff --git a/packages/icons/src/IconNames.ts b/packages/icons/src/IconNames.ts
index d0bdf920b1958..aea5fedaec6e9 100644
--- a/packages/icons/src/IconNames.ts
+++ b/packages/icons/src/IconNames.ts
@@ -25,6 +25,7 @@ export const enum IconNames {
   Stop = 'Stop',
   Link = 'Link',
   Filter = 'Filter',
+  AllApps = 'AllApps',
   Zoom = 'Zoom',
   ZoomOut = 'ZoomOut',
   Microphone = 'Microphone',
@@ -124,6 +125,7 @@ export const enum IconNames {
   TurnRight = 'TurnRight',
   Ferry = 'Ferry',
   Highlight = 'Highlight',
+  PowerButton = 'PowerButton',
   Tab = 'Tab',
   Admin = 'Admin',
   TVMonitor = 'TVMonitor',
@@ -357,6 +359,7 @@ export const enum IconNames {
   CircleRing = 'CircleRing',
   CircleFill = 'CircleFill',
   Record2 = 'Record2',
+  AllAppsMirrored = 'AllAppsMirrored',
   BookmarksMirrored = 'BookmarksMirrored',
   BulletedListMirrored = 'BulletedListMirrored',
   CaretHollowMirrored = 'CaretHollowMirrored',
@@ -401,6 +404,7 @@ export const enum IconNames {
   Medical = 'Medical',
   Running = 'Running',
   Weights = 'Weights',
+  Trackers = 'Trackers',
   AddNotes = 'AddNotes',
   BarChart4 = 'BarChart4',
   CirclePlus = 'CirclePlus',
@@ -416,6 +420,7 @@ export const enum IconNames {
   StockDown = 'StockDown',
   StockUp = 'StockUp',
   Lamp = 'Lamp',
+  Source = 'Source',
   MSNVideos = 'MSNVideos',
   Cricket = 'Cricket',
   Golf = 'Golf',
@@ -646,6 +651,7 @@ export const enum IconNames {
   Export = 'Export',
   ExportMirrored = 'ExportMirrored',
   SingleBookmark = 'SingleBookmark',
+  SingleBookmarkSolid = 'SingleBookmarkSolid',
   DoubleChevronDown = 'DoubleChevronDown',
   FollowUser = 'FollowUser',
   ReplyAll = 'ReplyAll',
@@ -669,6 +675,7 @@ export const enum IconNames {
   GenericScan = 'GenericScan',
   AustralianRules = 'AustralianRules',
   WifiEthernet = 'WifiEthernet',
+  TrackersMirrored = 'TrackersMirrored',
   DateTimeMirrored = 'DateTimeMirrored',
   StopSolid = 'StopSolid',
   DoubleChevronUp12 = 'DoubleChevronUp12',
@@ -790,12 +797,14 @@ export const enum IconNames {
   ZipFolder = 'ZipFolder',
   SurveyQuestions = 'SurveyQuestions',
   TextDocument = 'TextDocument',
+  TextDocumentShared = 'TextDocumentShared',
   PageCheckedOut = 'PageCheckedOut',
   SaveAndClose = 'SaveAndClose',
   Script = 'Script',
   Archive = 'Archive',
   ActivityFeed = 'ActivityFeed',
   EventDate = 'EventDate',
+  ArrowUpRight = 'ArrowUpRight',
   CaretRight = 'CaretRight',
   SetAction = 'SetAction',
   CaretSolidLeft = 'CaretSolidLeft',
@@ -831,6 +840,7 @@ export const enum IconNames {
   CannedChat = 'CannedChat',
   SkypeForBusinessLogo = 'SkypeForBusinessLogo',
   PageCheckedin = 'PageCheckedin',
+  ReadOutLoud = 'ReadOutLoud',
   CaretBottomLeftSolid8 = 'CaretBottomLeftSolid8',
   CaretBottomRightSolid8 = 'CaretBottomRightSolid8',
   FolderHorizontal = 'FolderHorizontal',
@@ -838,7 +848,16 @@ export const enum IconNames {
   GiftboxOpen = 'GiftboxOpen',
   StatusCircleOuter = 'StatusCircleOuter',
   StatusCircleInner = 'StatusCircleInner',
+  StatusCircleRing = 'StatusCircleRing',
+  StatusTriangleOuter = 'StatusTriangleOuter',
+  StatusTriangleInner = 'StatusTriangleInner',
+  StatusTriangleExclamation = 'StatusTriangleExclamation',
+  StatusCircleExclamation = 'StatusCircleExclamation',
+  StatusCircleErrorX = 'StatusCircleErrorX',
   StatusCircleCheckmark = 'StatusCircleCheckmark',
+  StatusCircleInfo = 'StatusCircleInfo',
+  StatusCircleBlock2 = 'StatusCircleBlock2',
+  StatusCircleQuestionMark = 'StatusCircleQuestionMark',
   Toll = 'Toll',
   ExploreContentSingle = 'ExploreContentSingle',
   CollapseContent = 'CollapseContent',
@@ -1420,6 +1439,7 @@ export const enum IconNames {
   SquareShapeSolid = 'SquareShapeSolid',
   TriangleShapeSolid = 'TriangleShapeSolid',
   DropShapeSolid = 'DropShapeSolid',
+  RectangleShapeSolid = 'RectangleShapeSolid',
   InsertColumnsLeft = 'InsertColumnsLeft',
   InsertColumnsRight = 'InsertColumnsRight',
   InsertRowsAbove = 'InsertRowsAbove',
@@ -1428,17 +1448,17 @@ export const enum IconNames {
   DeleteRows = 'DeleteRows',
   DeleteRowsMirrored = 'DeleteRowsMirrored',
   DeleteTable = 'DeleteTable',
-  GitLogo = 'GitLogo',
-  GitHubLogo = 'GitHubLogo',
-  ApacheMavenLogo = 'ApacheMavenLogo',
-  NPMLogo = 'NPMLogo',
-  GitFork = 'GitFork',
-  SVNLogo = 'SVNLogo',
-  JenkinsLogo = 'JenkinsLogo',
   VersionControlPush = 'VersionControlPush',
   ExternalGit = 'ExternalGit',
+  WhiteBoardApp16 = 'WhiteBoardApp16',
+  WhiteBoardApp32 = 'WhiteBoardApp32',
   InsertSignatureLine = 'InsertSignatureLine',
   ArrangeByFrom = 'ArrangeByFrom',
   Phishing = 'Phishing',
-  CreateMailRule = 'CreateMailRule'
+  CreateMailRule = 'CreateMailRule',
+  PublishCourse = 'PublishCourse',
+  DictionaryRemove = 'DictionaryRemove',
+  UserRemove = 'UserRemove',
+  UserEvent = 'UserEvent',
+  Encryption = 'Encryption'
 }
diff --git a/packages/icons/src/fabric-icons-0.ts b/packages/icons/src/fabric-icons-0.ts
index fb8f3cbf228fd..16e2b1528f491 100644
--- a/packages/icons/src/fabric-icons-0.ts
+++ b/packages/icons/src/fabric-icons-0.ts
@@ -22,7 +22,7 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-0"`,
-      src: `url('${baseUrl}fabric-icons-0-2e092c7d.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-0-6a62cc1b.woff') format('woff')`,
     },
     icons: {
       'DecreaseIndentLegacy': '\uE290',
@@ -41,6 +41,7 @@ export function initializeIcons(
       'Shop': '\uE719',
       'Stop': '\uE71A',
       'Link': '\uE71B',
+      'AllApps': '\uE71D',
       'Zoom': '\uE71E',
       'ZoomOut': '\uE71F',
       'Microphone': '\uE720',
@@ -53,7 +54,6 @@ export function initializeIcons(
       'Back': '\uE72B',
       'Refresh': '\uE72C',
       'Lock': '\uE72E',
-      'BlockedSite': '\uE72F',
       'ReportHacked': '\uE730',
       'EMI': '\uE731',
       'MiniLink': '\uE732',
diff --git a/packages/icons/src/fabric-icons-1.ts b/packages/icons/src/fabric-icons-1.ts
index bfdc1140b9692..ff13dddbd1210 100644
--- a/packages/icons/src/fabric-icons-1.ts
+++ b/packages/icons/src/fabric-icons-1.ts
@@ -22,11 +22,12 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-1"`,
-      src: `url('${baseUrl}fabric-icons-1-a86438ef.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-1-8143b877.woff') format('woff')`,
     },
     icons: {
       'Ferry': '\uE7E3',
       'Highlight': '\uE7E6',
+      'PowerButton': '\uE7E8',
       'Tab': '\uE7E9',
       'Admin': '\uE7EF',
       'TVMonitor': '\uE7F4',
@@ -123,8 +124,7 @@ export function initializeIcons(
       'Preview': '\uE8FF',
       'News': '\uE900',
       'Chat': '\uE901',
-      'Group': '\uE902',
-      'World': '\uE909'
+      'Group': '\uE902'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons-10.ts b/packages/icons/src/fabric-icons-10.ts
index d8d8a94390439..e8f1210b0ad44 100644
--- a/packages/icons/src/fabric-icons-10.ts
+++ b/packages/icons/src/fabric-icons-10.ts
@@ -1,4 +1,4 @@
-// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+  // Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
 
 // tslint:disable:max-line-length
 
@@ -22,9 +22,19 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-10"`,
-      src: `url('${baseUrl}fabric-icons-10-90d2dc10.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-10-380f2273.woff') format('woff')`,
     },
     icons: {
+      'FullWidthEdit': '\uF2FF',
+      'Plug': '\uF300',
+      'PlugSolid': '\uF301',
+      'PlugConnected': '\uF302',
+      'PlugDisconnected': '\uF303',
+      'UnlockSolid': '\uF304',
+      'Variable': '\uF305',
+      'Parameter': '\uF306',
+      'CommentUrgent': '\uF307',
+      'Storyboard': '\uF308',
       'DiffInline': '\uF309',
       'DiffSideBySide': '\uF30A',
       'ImageDiff': '\uF30B',
@@ -114,13 +124,7 @@ export function initializeIcons(
       'DoubleChevronLeft8': '\uF36D',
       'DoubleChevronRight8': '\uF36E',
       'ChevronDownEnd6': '\uF36F',
-      'ChevronUpEnd6': '\uF370',
-      'ChevronLeftEnd6': '\uF371',
-      'ChevronRightEnd6': '\uF372',
-      'ContextMenu': '\uF37C',
-      'AzureAPIManagement': '\uF37F',
-      'AzureServiceEndpoint': '\uF380',
-      'VSTSLogo': '\uF381'
+      'ChevronUpEnd6': '\uF370'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons-11.ts b/packages/icons/src/fabric-icons-11.ts
index dbb06f2a9f6a4..918e5a3f998bc 100644
--- a/packages/icons/src/fabric-icons-11.ts
+++ b/packages/icons/src/fabric-icons-11.ts
@@ -22,9 +22,15 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-11"`,
-      src: `url('${baseUrl}fabric-icons-11-18d2ffa4.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-11-2c5983e3.woff') format('woff')`,
     },
     icons: {
+      'ChevronLeftEnd6': '\uF371',
+      'ChevronRightEnd6': '\uF372',
+      'ContextMenu': '\uF37C',
+      'AzureAPIManagement': '\uF37F',
+      'AzureServiceEndpoint': '\uF380',
+      'VSTSLogo': '\uF381',
       'VSTSAltLogo1': '\uF382',
       'VSTSAltLogo2': '\uF383',
       'FileTypeSolution': '\uF387',
@@ -118,13 +124,7 @@ export function initializeIcons(
       'NugetLogo': '\uF44C',
       'TFVCLogo': '\uF44D',
       'ProjectLogo32': '\uF47E',
-      'ProjectLogoFill32': '\uF47F',
-      'ProjectLogo16': '\uF480',
-      'ProjectLogoFill16': '\uF481',
-      'SwayLogo32': '\uF482',
-      'SwayLogoFill32': '\uF483',
-      'SwayLogo16': '\uF484',
-      'SwayLogoFill16': '\uF485'
+      'ProjectLogoFill32': '\uF47F'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons-12.ts b/packages/icons/src/fabric-icons-12.ts
index df412bbe53c58..fda8a8353f45c 100644
--- a/packages/icons/src/fabric-icons-12.ts
+++ b/packages/icons/src/fabric-icons-12.ts
@@ -1,4 +1,4 @@
-  // Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
 
 // tslint:disable:max-line-length
 
@@ -22,9 +22,15 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-12"`,
-      src: `url('${baseUrl}fabric-icons-12-6c96597e.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-12-e5eef780.woff') format('woff')`,
     },
     icons: {
+      'ProjectLogo16': '\uF480',
+      'ProjectLogoFill16': '\uF481',
+      'SwayLogo32': '\uF482',
+      'SwayLogoFill32': '\uF483',
+      'SwayLogo16': '\uF484',
+      'SwayLogoFill16': '\uF485',
       'ClassNotebookLogo32': '\uF486',
       'ClassNotebookLogoFill32': '\uF487',
       'ClassNotebookLogo16': '\uF488',
@@ -118,13 +124,7 @@ export function initializeIcons(
       'ChartYAngle': '\uF515',
       'Combobox': '\uF516',
       'LineSpacing': '\uF517',
-      'Padding': '\uF518',
-      'PaddingTop': '\uF519',
-      'PaddingBottom': '\uF51A',
-      'PaddingLeft': '\uF51B',
-      'PaddingRight': '\uF51C',
-      'NavigationFlipper': '\uF51D',
-      'AlignJustify': '\uF51E'
+      'Padding': '\uF518'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons-13.ts b/packages/icons/src/fabric-icons-13.ts
index 1fa7cbff67e92..9fdd4774a49d0 100644
--- a/packages/icons/src/fabric-icons-13.ts
+++ b/packages/icons/src/fabric-icons-13.ts
@@ -1,4 +1,4 @@
-// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+  // Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
 
 // tslint:disable:max-line-length
 
@@ -22,9 +22,15 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-13"`,
-      src: `url('${baseUrl}fabric-icons-13-02c4bea1.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-13-be3ab2c9.woff') format('woff')`,
     },
     icons: {
+      'PaddingTop': '\uF519',
+      'PaddingBottom': '\uF51A',
+      'PaddingLeft': '\uF51B',
+      'PaddingRight': '\uF51C',
+      'NavigationFlipper': '\uF51D',
+      'AlignJustify': '\uF51E',
       'TextOverflow': '\uF51F',
       'VisualsFolder': '\uF520',
       'VisualsStore': '\uF521',
@@ -102,6 +108,7 @@ export function initializeIcons(
       'SquareShapeSolid': '\uF63D',
       'TriangleShapeSolid': '\uF63E',
       'DropShapeSolid': '\uF63F',
+      'RectangleShapeSolid': '\uF640',
       'InsertColumnsLeft': '\uF64A',
       'InsertColumnsRight': '\uF64B',
       'InsertRowsAbove': '\uF64C',
@@ -110,17 +117,14 @@ export function initializeIcons(
       'DeleteRows': '\uF64F',
       'DeleteRowsMirrored': '\uF650',
       'DeleteTable': '\uF651',
-      'GitLogo': '\uF65D',
-      'GitHubLogo': '\uF65E',
-      'ApacheMavenLogo': '\uF65F',
-      'NPMLogo': '\uF660',
-      'GitFork': '\uF661',
-      'SVNLogo': '\uF662',
-      'JenkinsLogo': '\uF663',
       'VersionControlPush': '\uF664',
       'ExternalGit': '\uF665',
+      'WhiteBoardApp16': '\uF673',
+      'WhiteBoardApp32': '\uF674',
       'InsertSignatureLine': '\uF677',
-      'ArrangeByFrom': '\uF678'
+      'ArrangeByFrom': '\uF678',
+      'Phishing': '\uF679',
+      'CreateMailRule': '\uF67A'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons-14.ts b/packages/icons/src/fabric-icons-14.ts
index 1492454e350b1..640372908ed59 100644
--- a/packages/icons/src/fabric-icons-14.ts
+++ b/packages/icons/src/fabric-icons-14.ts
@@ -22,11 +22,14 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-14"`,
-      src: `url('${baseUrl}fabric-icons-14-36569c01.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-14-cf85ed5b.woff') format('woff')`,
     },
     icons: {
-      'Phishing': '\uF679',
-      'CreateMailRule': '\uF67A'
+      'PublishCourse': '\uF699',
+      'DictionaryRemove': '\uF69A',
+      'UserRemove': '\uF69B',
+      'UserEvent': '\uF69C',
+      'Encryption': '\uF69D'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons-2.ts b/packages/icons/src/fabric-icons-2.ts
index fbb527a9e888c..ebaa4a629a346 100644
--- a/packages/icons/src/fabric-icons-2.ts
+++ b/packages/icons/src/fabric-icons-2.ts
@@ -22,9 +22,10 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-2"`,
-      src: `url('${baseUrl}fabric-icons-2-e2ae1f0c.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-2-e49d4cfd.woff') format('woff')`,
     },
     icons: {
+      'World': '\uE909',
       'Comment': '\uE90A',
       'DockLeft': '\uE90C',
       'DockRight': '\uE90D',
@@ -123,8 +124,7 @@ export function initializeIcons(
       'HailDay': '\uEA00',
       'WorkFlow': '\uEA01',
       'HourGlass': '\uEA03',
-      'StoreLogoMed20': '\uEA04',
-      'TimeSheet': '\uEA05'
+      'StoreLogoMed20': '\uEA04'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons-3.ts b/packages/icons/src/fabric-icons-3.ts
index dd813f825c81a..747cad580019d 100644
--- a/packages/icons/src/fabric-icons-3.ts
+++ b/packages/icons/src/fabric-icons-3.ts
@@ -22,9 +22,10 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-3"`,
-      src: `url('${baseUrl}fabric-icons-3-a13cb765.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-3-39ed3795.woff') format('woff')`,
     },
     icons: {
+      'TimeSheet': '\uEA05',
       'TriangleSolid': '\uEA08',
       'VideoSolid': '\uEA0C',
       'RainShowersNight': '\uEA0F',
@@ -45,6 +46,7 @@ export function initializeIcons(
       'ErrorBadge': '\uEA39',
       'CircleFill': '\uEA3B',
       'Record2': '\uEA3F',
+      'AllAppsMirrored': '\uEA40',
       'BookmarksMirrored': '\uEA41',
       'BulletedListMirrored': '\uEA42',
       'CaretHollowMirrored': '\uEA45',
@@ -89,6 +91,7 @@ export function initializeIcons(
       'Medical': '\uEAD4',
       'Running': '\uEADA',
       'Weights': '\uEADB',
+      'Trackers': '\uEADF',
       'AddNotes': '\uEAE3',
       'BarChart4': '\uEAE7',
       'CirclePlus': '\uEAEE',
@@ -104,6 +107,7 @@ export function initializeIcons(
       'StockDown': '\uEB0F',
       'StockUp': '\uEB11',
       'Lamp': '\uEB19',
+      'Source': '\uEB1B',
       'MSNVideos': '\uEB1C',
       'Cricket': '\uEB1E',
       'Golf': '\uEB1F',
@@ -120,11 +124,7 @@ export function initializeIcons(
       'Tennis': '\uEB33',
       'Arrivals': '\uEB34',
       'Design': '\uEB3C',
-      'Website': '\uEB41',
-      'Drop': '\uEB42',
-      'SkiResorts': '\uEB45',
-      'Snowflake': '\uEB46',
-      'BusSolid': '\uEB47'
+      'Website': '\uEB41'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons-4.ts b/packages/icons/src/fabric-icons-4.ts
index 03c61f57769a5..323adbf9fac38 100644
--- a/packages/icons/src/fabric-icons-4.ts
+++ b/packages/icons/src/fabric-icons-4.ts
@@ -1,4 +1,4 @@
-// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+  // Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
 
 // tslint:disable:max-line-length
 
@@ -22,9 +22,13 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-4"`,
-      src: `url('${baseUrl}fabric-icons-4-97372384.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-4-0838b5e4.woff') format('woff')`,
     },
     icons: {
+      'Drop': '\uEB42',
+      'SkiResorts': '\uEB45',
+      'Snowflake': '\uEB46',
+      'BusSolid': '\uEB47',
       'FerrySolid': '\uEB48',
       'AirplaneSolid': '\uEB4C',
       'TrainSolid': '\uEB4D',
@@ -116,14 +120,11 @@ export function initializeIcons(
       'ProgressLoopOuter': '\uECDF',
       'Blocked2': '\uECE4',
       'FangBody': '\uECEB',
-      'Glimmer': '\uECF4',
       'ChatInviteFriend': '\uECFE',
       'Crown': '\uED01',
       'ScaleUp': '\uED09',
       'Feedback': '\uED15',
-      'SharepointLogoInverse': '\uED18',
-      'YammerLogo': '\uED19',
-      'Hide': '\uED1A'
+      'SharepointLogoInverse': '\uED18'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons-5.ts b/packages/icons/src/fabric-icons-5.ts
index 05c1144911ca7..c73575c2dc466 100644
--- a/packages/icons/src/fabric-icons-5.ts
+++ b/packages/icons/src/fabric-icons-5.ts
@@ -1,4 +1,4 @@
-// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+  // Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
 
 // tslint:disable:max-line-length
 
@@ -22,9 +22,11 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-5"`,
-      src: `url('${baseUrl}fabric-icons-5-125dbde8.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-5-5a61f6fb.woff') format('woff')`,
     },
     icons: {
+      'YammerLogo': '\uED19',
+      'Hide': '\uED1A',
       'Uneditable': '\uED1D',
       'ReturnToSession': '\uED24',
       'OpenFolderHorizontal': '\uED25',
@@ -50,7 +52,6 @@ export function initializeIcons(
       'ExchangeLogoInverse': '\uED78',
       'LyncLogo': '\uED79',
       'OfficeVideoLogoInverse': '\uED7A',
-      'ParatureLogo': '\uED7B',
       'SocialListeningLogo': '\uED7C',
       'VisioLogoInverse': '\uED7D',
       'Balloons': '\uED7E',
@@ -122,7 +123,8 @@ export function initializeIcons(
       'CaretLeftSolid8': '\uEDD9',
       'CaretRightSolid8': '\uEDDA',
       'CaretUpSolid8': '\uEDDB',
-      'CaretDownSolid8': '\uEDDC'
+      'CaretDownSolid8': '\uEDDC',
+      'ClearFormatting': '\uEDDD'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons-6.ts b/packages/icons/src/fabric-icons-6.ts
index 951a2ac5c22f1..baad66b695bd8 100644
--- a/packages/icons/src/fabric-icons-6.ts
+++ b/packages/icons/src/fabric-icons-6.ts
@@ -1,4 +1,4 @@
-// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+  // Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
 
 // tslint:disable:max-line-length
 
@@ -22,16 +22,16 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-6"`,
-      src: `url('${baseUrl}fabric-icons-6-2e7e2914.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-6-baae6235.woff') format('woff')`,
     },
     icons: {
-      'ClearFormatting': '\uEDDD',
       'Superscript': '\uEDDE',
       'Subscript': '\uEDDF',
       'Strikethrough': '\uEDE0',
       'Export': '\uEDE1',
       'ExportMirrored': '\uEDE2',
       'SingleBookmark': '\uEDFF',
+      'SingleBookmarkSolid': '\uEE00',
       'DoubleChevronDown': '\uEE04',
       'FollowUser': '\uEE05',
       'ReplyAll': '\uEE0A',
@@ -52,6 +52,7 @@ export function initializeIcons(
       'GenericScan': '\uEE6F',
       'AustralianRules': '\uEE70',
       'WifiEthernet': '\uEE77',
+      'TrackersMirrored': '\uEE92',
       'DateTimeMirrored': '\uEE93',
       'StopSolid': '\uEE95',
       'DoubleChevronUp12': '\uEE96',
diff --git a/packages/icons/src/fabric-icons-7.ts b/packages/icons/src/fabric-icons-7.ts
index ab89a59e387b0..1e24ac1333440 100644
--- a/packages/icons/src/fabric-icons-7.ts
+++ b/packages/icons/src/fabric-icons-7.ts
@@ -1,4 +1,4 @@
-// Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
+  // Your use of the content in the files referenced here is subject to the terms of the license at https://aka.ms/fabric-assets-license
 
 // tslint:disable:max-line-length
 
@@ -22,7 +22,7 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-7"`,
-      src: `url('${baseUrl}fabric-icons-7-143895dd.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-7-3ac670e6.woff') format('woff')`,
     },
     icons: {
       'LandscapeOrientation': '\uEF6B',
@@ -68,12 +68,14 @@ export function initializeIcons(
       'ZipFolder': '\uF012',
       'SurveyQuestions': '\uF01B',
       'TextDocument': '\uF029',
+      'TextDocumentShared': '\uF02B',
       'PageCheckedOut': '\uF02C',
       'SaveAndClose': '\uF038',
       'Script': '\uF03A',
       'Archive': '\uF03F',
       'ActivityFeed': '\uF056',
       'EventDate': '\uF059',
+      'ArrowUpRight': '\uF069',
       'CaretRight': '\uF06B',
       'SetAction': '\uF071',
       'CaretSolidLeft': '\uF08D',
@@ -109,6 +111,7 @@ export function initializeIcons(
       'CannedChat': '\uF0F2',
       'SkypeForBusinessLogo': '\uF0FC',
       'PageCheckedin': '\uF104',
+      'ReadOutLoud': '\uF112',
       'CaretBottomLeftSolid8': '\uF121',
       'CaretBottomRightSolid8': '\uF122',
       'FolderHorizontal': '\uF12B',
@@ -116,13 +119,12 @@ export function initializeIcons(
       'GiftboxOpen': '\uF133',
       'StatusCircleOuter': '\uF136',
       'StatusCircleInner': '\uF137',
-      'Toll': '\uF160',
-      'ExploreContentSingle': '\uF164',
-      'CollapseContent': '\uF165',
-      'CollapseContentSingle': '\uF166',
-      'InfoSolid': '\uF167',
-      'ProgressRingDots': '\uF16A',
-      'CaloriesAdd': '\uF172'
+      'StatusCircleRing': '\uF138',
+      'StatusTriangleOuter': '\uF139',
+      'StatusTriangleInner': '\uF13A',
+      'StatusTriangleExclamation': '\uF13B',
+      'StatusCircleExclamation': '\uF13C',
+      'StatusCircleErrorX': '\uF13D'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons-8.ts b/packages/icons/src/fabric-icons-8.ts
index 57325985ef742..6920797bd5fc0 100644
--- a/packages/icons/src/fabric-icons-8.ts
+++ b/packages/icons/src/fabric-icons-8.ts
@@ -22,9 +22,19 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-8"`,
-      src: `url('${baseUrl}fabric-icons-8-bd2a110b.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-8-d0700068.woff') format('woff')`,
     },
     icons: {
+      'StatusCircleInfo': '\uF13F',
+      'StatusCircleBlock2': '\uF141',
+      'StatusCircleQuestionMark': '\uF142',
+      'Toll': '\uF160',
+      'ExploreContentSingle': '\uF164',
+      'CollapseContent': '\uF165',
+      'CollapseContentSingle': '\uF166',
+      'InfoSolid': '\uF167',
+      'ProgressRingDots': '\uF16A',
+      'CaloriesAdd': '\uF172',
       'BranchFork': '\uF173',
       'MobileReport': '\uF18A',
       'HardDriveGroup': '\uF18F',
@@ -114,17 +124,7 @@ export function initializeIcons(
       'BranchFork2': '\uF291',
       'BranchLocked': '\uF292',
       'BranchCommit': '\uF293',
-      'BranchCompare': '\uF294',
-      'BranchMerge': '\uF295',
-      'BranchPullRequest': '\uF296',
-      'BranchSearch': '\uF297',
-      'BranchShelveset': '\uF298',
-      'RawSource': '\uF299',
-      'MergeDuplicate': '\uF29A',
-      'RowsGroup': '\uF29B',
-      'RowsChild': '\uF29C',
-      'Deploy': '\uF29D',
-      'Redeploy': '\uF29E'
+      'BranchCompare': '\uF294'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons-9.ts b/packages/icons/src/fabric-icons-9.ts
index 3dc4b6431a896..87b18f0e47a15 100644
--- a/packages/icons/src/fabric-icons-9.ts
+++ b/packages/icons/src/fabric-icons-9.ts
@@ -22,9 +22,19 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons-9"`,
-      src: `url('${baseUrl}fabric-icons-9-8ab77260.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-9-938d7113.woff') format('woff')`,
     },
     icons: {
+      'BranchMerge': '\uF295',
+      'BranchPullRequest': '\uF296',
+      'BranchSearch': '\uF297',
+      'BranchShelveset': '\uF298',
+      'RawSource': '\uF299',
+      'MergeDuplicate': '\uF29A',
+      'RowsGroup': '\uF29B',
+      'RowsChild': '\uF29C',
+      'Deploy': '\uF29D',
+      'Redeploy': '\uF29E',
       'ServerEnviroment': '\uF29F',
       'VisioDiagram': '\uF2A0',
       'HighlightMappedShapes': '\uF2A1',
@@ -114,17 +124,7 @@ export function initializeIcons(
       'PY': '\uF2F9',
       'CoffeeScript': '\uF2FA',
       'MarkDownLanguage': '\uF2FB',
-      'FullWidth': '\uF2FE',
-      'FullWidthEdit': '\uF2FF',
-      'Plug': '\uF300',
-      'PlugSolid': '\uF301',
-      'PlugConnected': '\uF302',
-      'PlugDisconnected': '\uF303',
-      'UnlockSolid': '\uF304',
-      'Variable': '\uF305',
-      'Parameter': '\uF306',
-      'CommentUrgent': '\uF307',
-      'Storyboard': '\uF308'
+      'FullWidth': '\uF2FE'
     }
   };
 
diff --git a/packages/icons/src/fabric-icons.ts b/packages/icons/src/fabric-icons.ts
index 02d7e4ed2f83e..3e5ae1f68fc35 100644
--- a/packages/icons/src/fabric-icons.ts
+++ b/packages/icons/src/fabric-icons.ts
@@ -22,7 +22,7 @@ export function initializeIcons(
     },
     fontFace: {
       fontFamily: `"FabricMDL2Icons"`,
-      src: `url('${baseUrl}fabric-icons-cf6d96bb.woff') format('woff')`,
+      src: `url('${baseUrl}fabric-icons-a13498cf.woff') format('woff')`,
     },
     icons: {
       'GlobalNavButton': '\uE700',
@@ -37,6 +37,7 @@ export function initializeIcons(
       'Filter': '\uE71C',
       'Search': '\uE721',
       'Share': '\uE72D',
+      'BlockedSite': '\uE72F',
       'FavoriteStar': '\uE734',
       'FavoriteStarFill': '\uE735',
       'CheckMark': '\uE73E',
@@ -67,6 +68,7 @@ export function initializeIcons(
       'HeartFill': '\uEB52',
       'Tiles': '\uECA5',
       'Embed': '\uECCE',
+      'Glimmer': '\uECF4',
       'Ascending': '\uEDC0',
       'Descending': '\uEDC1',
       'SortUp': '\uEE68',

From fdab0a0fac6e4740b0943a507ad8e31e80f645fd Mon Sep 17 00:00:00 2001
From: jijizz <liu_zhi8@hotmail.com>
Date: Thu, 1 Mar 2018 10:53:45 -0800
Subject: [PATCH 1475/1641] do not mount spinner unless we need it (#4139)

* do not mount spinner unless we need it

* change files
---
 .../zhiliu-fixSpinner_2018-02-28-22-55.json           | 11 +++++++++++
 .../src/components/GroupedList/GroupHeader.scss       | 11 -----------
 .../src/components/GroupedList/GroupHeader.tsx        | 10 ++--------
 3 files changed, 13 insertions(+), 19 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/zhiliu-fixSpinner_2018-02-28-22-55.json

diff --git a/common/changes/office-ui-fabric-react/zhiliu-fixSpinner_2018-02-28-22-55.json b/common/changes/office-ui-fabric-react/zhiliu-fixSpinner_2018-02-28-22-55.json
new file mode 100644
index 0000000000000..5113a04780d83
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/zhiliu-fixSpinner_2018-02-28-22-55.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "only mount spinner component when necessary",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "zhiliu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss
index 2ea4a621299e3..8cd93d87f595c 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.scss
@@ -84,17 +84,6 @@ $groupHeader-ease-in-back: cubic-bezier(0.600, -0.280, 0.735, 0.045);
   }
 }
 
-.loading {
-  visibility: hidden;
-  opacity: 0;
-  transition: visibility $ms-animation-duration-3, opacity $ms-animation-duration-3;
-
-  &.loadingIsVisible {
-    visibility: visible;
-    opacity: 1;
-  }
-}
-
 .dropIcon {
   position: absolute;
   @include ms-left(-26px);
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
index 8483aa18b4428..a705cab90dc2d 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
@@ -121,15 +121,9 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
             <span className={ styles.headerCount }>({ group.count }{ group.hasMoreData && '+' })</span>
           </div>
 
-          <div
-            className={ css(
-              'ms-GroupHeader-loading',
-              styles.loading,
-              isLoadingVisible && ('is-loading ' + styles.loadingIsVisible)
-            ) }
-          >
+          { isLoadingVisible && (
             <Spinner label={ loadingText } />
-          </div>
+          ) }
 
         </FocusZone>
       </div>

From 5c53827513582631bfd1660eecafdf45ca92b745 Mon Sep 17 00:00:00 2001
From: MaxLustig <maxslustig@gmail.com>
Date: Thu, 1 Mar 2018 11:13:53 -0800
Subject: [PATCH 1476/1641] Fix issues in scrollable pane (#4055)

* Fix infinite recursion in scrollable pane

* Rush change

* Fix root cause of infinite loop

* Fixed issue with sticky headers not being added to stickyAbove

* Remove ref for stickyContainer

* Fix bad rebase
---
 ...xlus-stickyContainer_2018-02-21-19-45.json | 11 ++++++
 .../ScrollablePane/ScrollablePane.base.tsx    | 38 +++----------------
 .../ScrollablePane/ScrollablePane.scss        | 32 ++++++++++++++++
 .../ScrollablePane/ScrollablePane.styles.ts   |  8 ----
 .../ScrollablePane/ScrollablePane.types.ts    |  6 +--
 .../src/components/Sticky/Sticky.tsx          |  4 +-
 6 files changed, 51 insertions(+), 48 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/maxlus-stickyContainer_2018-02-21-19-45.json
 create mode 100644 packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.scss

diff --git a/common/changes/office-ui-fabric-react/maxlus-stickyContainer_2018-02-21-19-45.json b/common/changes/office-ui-fabric-react/maxlus-stickyContainer_2018-02-21-19-45.json
new file mode 100644
index 0000000000000..4ac10a2b51382
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/maxlus-stickyContainer_2018-02-21-19-45.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix infinite recursion in scrollable pane",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "maxlus@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
index 378dddb138667..82f67a6892b58 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
@@ -32,7 +32,6 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
   };
 
   public root: HTMLElement;
-  public stickyContainer: HTMLElement;
   public stickyAbove: HTMLElement;
   public stickyBelow: HTMLElement;
   private _subscribers: Set<Function>;
@@ -63,22 +62,11 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
   public componentDidMount() {
     this._events.on(this.root, 'scroll', this.notifySubscribers);
     this._events.on(window, 'resize', this._onWindowResize);
-    this._async.setTimeout(() => {
-      this._resizeContainer();
-      if (this.stickyContainer.parentElement && this.root.parentElement) {
-        this.stickyContainer.parentElement.removeChild(this.stickyContainer);
-        this.root.parentElement.insertBefore(this.stickyContainer, this.root.nextSibling);
-        this.notifySubscribers();
-      }
-    }, 500);
   }
 
   public componentWillUnmount() {
     this._events.off(this.root);
     this._events.off(window);
-    if (this.stickyContainer.parentElement) {
-      this.stickyContainer.parentElement.removeChild(this.stickyContainer);
-    }
   }
 
   public render() {
@@ -95,13 +83,12 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
         { ...getNativeProps(this.props, divProperties) }
         ref={ this._resolveRef('root') }
         className={ classNames.root }
-        data-is-scrollable={ true }
       >
-        <div ref={ this._resolveRef('stickyContainer') } className={ classNames.stickyContainer }>
-          <div ref={ this._resolveRef('stickyAbove') } className={ classNames.stickyAbove } />
-          <div ref={ this._resolveRef('stickyBelow') } className={ classNames.stickyBelow } />
+        <div ref={ this._resolveRef('stickyAbove') } className={ classNames.stickyAbove } />
+        <div ref={ this._resolveRef('stickyBelow') } className={ classNames.stickyBelow } />
+        <div data-is-scrollable={ true }>
+          { this.props.children }
         </div>
-        { this.props.children }
       </div>
     );
   }
@@ -171,7 +158,6 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
           }
         }, 1);
       }
-      this.notifySubscribers();
       this._setPlaceholderHeights(stickyList);
     }
   }
@@ -186,26 +172,12 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
 
   private _onWindowResize() {
     this._async.setTimeout(() => {
-      this._resizeContainer();
       this.notifySubscribers();
       this._setPlaceholderHeights(this._stickyAbove);
       this._setPlaceholderHeights(this._stickyBelow);
     }, 5);
   }
 
-  private _resizeContainer() {
-    const { stickyContainer, root } = this;
-    const { borderTopWidth, borderLeftWidth } = getComputedStyle(root);
-    stickyContainer.style.height = root.clientHeight + 'px';
-    stickyContainer.style.width = root.clientWidth + 'px';
-    if (borderTopWidth) {
-      stickyContainer.style.top = root.offsetTop + parseInt(borderTopWidth, 10) + 'px';
-    }
-    if (borderLeftWidth) {
-      stickyContainer.style.left = root.offsetLeft + parseInt(borderLeftWidth, 10) + 'px';
-    }
-  }
-
   @autobind
   private _setPlaceholderHeights(stickies: Set<Sticky>) {
     stickies.forEach((sticky, idx) => {
@@ -249,4 +221,4 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
     }
     return offset;
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.scss b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.scss
new file mode 100644
index 0000000000000..51378c8ce9e20
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.scss
@@ -0,0 +1,32 @@
+@import '../../common/common';
+
+.root {
+  overflow-y: auto;
+  max-height: inherit;
+  height: inherit;
+  -webkit-overflow-scrolling: touch;
+}
+
+.stickyAbove,
+.stickyBelow {
+  position: absolute;
+  pointer-events: auto;
+  width: 100%;
+  z-index: 1;
+}
+
+.stickyAbove {
+  top: 0;
+
+  @include high-contrast {
+    border-bottom: 1px solid WindowText;
+  }
+}
+
+.stickyBelow {
+  bottom: 0;
+
+  @include high-contrast {
+    border-top: 1px solid WindowText;
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.styles.ts b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.styles.ts
index 814f6ff432b26..9c1c71f1b7a3d 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.styles.ts
@@ -33,14 +33,6 @@ export const getStyles = (
       },
       className
     ],
-    stickyContainer: [
-      {
-        overflow: 'hidden',
-        position: 'absolute',
-        pointerEvents: 'none',
-
-      }
-    ],
     stickyAbove: [
       {
         top: 0,
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts
index a048501a08ffb..3cec91bda207f 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts
@@ -53,10 +53,6 @@ export interface IScrollablePaneStyles {
    * Style set for the root element.
    */
   root: IStyle;
-  /**
-   * Style set for the stickyContainer element.
-   */
-  stickyContainer: IStyle;
   /**
    * Style set for the stickyAbove element.
    */
@@ -65,4 +61,4 @@ export interface IScrollablePaneStyles {
    * Style set for the stickyAbove element.
    */
   stickyBelow: IStyle;
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
index a0980248e9a54..be825b12e4bfa 100644
--- a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
+++ b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
@@ -145,8 +145,8 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
     const canStickyFooter = stickyPosition === StickyPositionType.Both || stickyPosition === StickyPositionType.Footer;
 
     this.setState({
-      isStickyTop: canStickyHeader && ((!isStickyTop && top <= headerBound.bottom) || (isStickyTop && bottom < headerBound.bottom)),
-      isStickyBottom: canStickyFooter && ((!isStickyBottom && bottom >= footerBound.top) || (isStickyBottom && top > footerBound.top))
+      isStickyTop: canStickyHeader && ((top <= headerBound.bottom) || (isStickyTop && bottom < headerBound.bottom)),
+      isStickyBottom: canStickyFooter && ((bottom >= footerBound.top) || (isStickyBottom && top > footerBound.top))
     });
   }
 

From 18ca9bf274d7985b27197c0ea64fb695615f6d98 Mon Sep 17 00:00:00 2001
From: natalieethell <yummyraspberries@gmail.com>
Date: Thu, 1 Mar 2018 11:22:29 -0800
Subject: [PATCH 1477/1641] Disabled link (#4141)

* preventDefault in onClick if disabled link

* added change request file

* else if on same line as closing brace of if
---
 .../disabledLink_2018-02-28-23-53.json                | 11 +++++++++++
 .../src/components/Link/Link.base.tsx                 |  6 ++++--
 2 files changed, 15 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/disabledLink_2018-02-28-23-53.json

diff --git a/common/changes/office-ui-fabric-react/disabledLink_2018-02-28-23-53.json b/common/changes/office-ui-fabric-react/disabledLink_2018-02-28-23-53.json
new file mode 100644
index 0000000000000..80ad0b48ce486
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/disabledLink_2018-02-28-23-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "make sure disabled links are non-navigable",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "naethell@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.base.tsx b/packages/office-ui-fabric-react/src/components/Link/Link.base.tsx
index 3ffdc565f1c1c..0da0938e619a8 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.base.tsx
@@ -67,9 +67,11 @@ export class LinkBase extends BaseComponent<ILinkProps, any> implements ILink {
 
   @autobind
   private _onClick(ev: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>) {
-    const { onClick } = this.props;
+    const { onClick, disabled } = this.props;
 
-    if (onClick) {
+    if (disabled) {
+      ev.preventDefault();
+    } else if (onClick) {
       onClick(ev);
     }
   }

From b345d5304dbafc8fa394f89e3633218226024a8a Mon Sep 17 00:00:00 2001
From: natalieethell <yummyraspberries@gmail.com>
Date: Thu, 1 Mar 2018 11:48:23 -0800
Subject: [PATCH 1478/1641] added More items aria label (#4075)

* added More items aria label

* change request file

* optional prop for overflow aria label

* changed to minor bump

* Update Breadcrumb.types.ts
---
 .../label-for-breadcrumb_2018-02-23-00-57.json        | 11 +++++++++++
 .../src/components/Breadcrumb/Breadcrumb.tsx          |  3 ++-
 .../src/components/Breadcrumb/Breadcrumb.types.ts     |  7 ++++++-
 3 files changed, 19 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/label-for-breadcrumb_2018-02-23-00-57.json

diff --git a/common/changes/office-ui-fabric-react/label-for-breadcrumb_2018-02-23-00-57.json b/common/changes/office-ui-fabric-react/label-for-breadcrumb_2018-02-23-00-57.json
new file mode 100644
index 0000000000000..ccc0161c03570
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/label-for-breadcrumb_2018-02-23-00-57.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "added More items aria label",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "naethell@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
index d0ad7d5f3328e..5e24eca4a8a32 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
@@ -68,7 +68,7 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
 
   @autobind
   private _onRenderBreadcrumb(data: IBreadCrumbData) {
-    const { className, ariaLabel, onRenderItem = this._onRenderItem } = data.props;
+    const { className, ariaLabel, onRenderItem = this._onRenderItem, overflowAriaLabel } = data.props;
     const { renderedOverflowItems, renderedItems } = data;
 
     const contextualItems = renderedOverflowItems.map(
@@ -95,6 +95,7 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
                   iconProps={ { iconName: 'More' } }
                   role='button'
                   aria-haspopup='true'
+                  ariaLabel={ overflowAriaLabel }
                   onRenderMenuIcon={ nullFunction }
                   menuProps={ {
                     items: contextualItems,
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.types.ts b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.types.ts
index 1af740dade522..8f86b53001adc 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.types.ts
@@ -44,6 +44,11 @@ export interface IBreadcrumbProps extends React.Props<Breadcrumb> {
    * Aria label to place on the navigation landmark for breadcrumb
    */
   ariaLabel?: string;
+
+  /**
+   * Optional name to use for aria label on overflow button.
+   */
+  overflowAriaLabel?: string;
 }
 
 export interface IBreadcrumbItem {
@@ -72,4 +77,4 @@ export interface IBreadcrumbItem {
    * If this breadcrumb item is the item the user is currently on, if set to true, aria-current="page" will be applied to this breadcrumb link
    */
   isCurrentItem?: boolean;
-}
\ No newline at end of file
+}

From b06da13ee4fc7b10baf57f21001c316aada8532a Mon Sep 17 00:00:00 2001
From: "Daniel A. White" <daniel@whitefamily.in>
Date: Thu, 1 Mar 2018 15:57:26 -0500
Subject: [PATCH 1479/1641] Fix #4146 indeterminate progress indicator overflow
  (#4149)

* adding overflow:hidden for progressindicator. fixes #4146

* adding change request

* Update fix-indeterminate-progress-indicator-overflow_2018-03-01-17-51.json
---
 ...-progress-indicator-overflow_2018-03-01-17-51.json | 11 +++++++++++
 .../ProgressIndicator/ProgressIndicator.scss          |  9 +--------
 2 files changed, 12 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-indeterminate-progress-indicator-overflow_2018-03-01-17-51.json

diff --git a/common/changes/office-ui-fabric-react/fix-indeterminate-progress-indicator-overflow_2018-03-01-17-51.json b/common/changes/office-ui-fabric-react/fix-indeterminate-progress-indicator-overflow_2018-03-01-17-51.json
new file mode 100644
index 0000000000000..e006f6dc01e19
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-indeterminate-progress-indicator-overflow_2018-03-01-17-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ProgressIndicator: adjusting css so that the gleam doesn't go outside the indicator boundary.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "daniel@whitefamily.in"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
index c0a002d3bb8e7..c44a4f88888d6 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.scss
@@ -1,17 +1,12 @@
 @import '../../common/common';
-
 // Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
-
 //
 // Office UI Fabric
 // --------------------------------------------------
 // ProgressIndicator Styles
-
-
 $ProgressIndicatorMarginBetweenText: 8px;
 $ProgressIndicatorButtonsWidth: 218px;
 $ProgressIndicatorTextHeight: 18px;
-
 .root {
   font-weight: $ms-font-weight-regular;
 }
@@ -34,6 +29,7 @@ $ProgressIndicatorTextHeight: 18px;
 
 .itemProgress {
   position: relative;
+  overflow: hidden;
   height: 2px;
   padding: $ProgressIndicatorMarginBetweenText 0;
 }
@@ -54,18 +50,15 @@ $ProgressIndicatorTextHeight: 18px;
   position: absolute;
   transition: width .3s ease;
   width: 0;
-
   &.indeterminate {
     position: absolute;
     min-width: 33%;
     background: linear-gradient(to right, transparent 0%, $ms-color-themePrimary 50%, transparent 100%);
     animation: indeterminateProgress 3s infinite;
   }
-
   @include high-contrast {
     background-color: WindowText;
   }
-
   @include RTL {
     &.indeterminate {
       animation: indeterminateProgressRTL 3s infinite;

From 2c32338a744d10802e4384424701a922850b7647 Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Thu, 1 Mar 2018 12:58:55 -0800
Subject: [PATCH 1480/1641] Callout: move animation inline to greatly improve
 perf (#4140)

* improve callout perf by making animation inline

* add change file

* use classname instead

* remove uneeded import{

* removing uneeded const

* fix lint

* remove uneeded expansion
---
 .../callout-improveperf_2018-02-28-23-05.json   | 11 +++++++++++
 .../components/Callout/CalloutContent.base.tsx  | 17 +++++++++++++++--
 .../components/Callout/CalloutContent.styles.ts | 12 +-----------
 3 files changed, 27 insertions(+), 13 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/callout-improveperf_2018-02-28-23-05.json

diff --git a/common/changes/office-ui-fabric-react/callout-improveperf_2018-02-28-23-05.json b/common/changes/office-ui-fabric-react/callout-improveperf_2018-02-28-23-05.json
new file mode 100644
index 0000000000000..af4a9c72463f9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/callout-improveperf_2018-02-28-23-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Callout: move animation inline to greatly improve perf",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
index 00e4865075070..599cf3a1333e4 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
@@ -17,7 +17,8 @@ import {
   focusFirstChild,
   getWindow,
   getDocument,
-  customizable
+  customizable,
+  css
 } from '../../Utilities';
 import {
   positionCallout,
@@ -29,6 +30,17 @@ import {
 } from '../../utilities/positioning';
 import { Popup } from '../../Popup';
 import { classNamesFunction } from '../../Utilities';
+import {
+  AnimationClassNames,
+  IRawStyle
+} from '../../Styling';
+
+const ANIMATIONS: { [key: number]: string | undefined; } = {
+  [RectangleEdge.top]: AnimationClassNames.slideUpIn10,
+  [RectangleEdge.bottom]: AnimationClassNames.slideDownIn10,
+  [RectangleEdge.left]: AnimationClassNames.slideLeftIn10,
+  [RectangleEdge.right]: AnimationClassNames.slideRightIn10,
+};
 
 const getClassNames = classNamesFunction<ICalloutContentStyleProps, ICalloutContentStyles>();
 const BORDER_WIDTH = 1;
@@ -163,13 +175,14 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
     );
 
     const overflowStyle: React.CSSProperties = overflowYHidden ? { overflowY: 'hidden' } : {};
+    // React.CSSProperties does not understand IRawStyle, so the inline animations will need to be cast as any for now.
     const content = (
       <div
         ref={ this._resolveRef('_hostElement') }
         className={ this._classNames.container }
       >
         <div
-          className={ this._classNames.root }
+          className={ css(this._classNames.root, positions && positions.targetEdge && ANIMATIONS[positions.targetEdge!]) }
           style={ positions ? positions.elementPosition : OFF_SCREEN_STYLE }
           tabIndex={ -1 } // Safari and Firefox on Mac OS requires this to back-stop click events so focus remains in the Callout.
           // See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.styles.ts b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.styles.ts
index c648133fe05fa..943b2cce7cf3e 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.styles.ts
@@ -1,6 +1,5 @@
 import {
   HighContrastSelector,
-  AnimationStyles,
   IRawStyle,
   focusClear
 } from '../../Styling';
@@ -12,13 +11,6 @@ import { ICalloutContentStyleProps, ICalloutContentStyles } from './Callout.type
 
 const BEAK_ORIGIN_POSITION = { top: 0, left: 0 };
 
-const ANIMATIONS: { [key: number]: IRawStyle; } = {
-  [RectangleEdge.top]: AnimationStyles.slideUpIn20,
-  [RectangleEdge.bottom]: AnimationStyles.slideDownIn20,
-  [RectangleEdge.left]: AnimationStyles.slideLeftIn20,
-  [RectangleEdge.right]: AnimationStyles.slideRightIn20,
-};
-
 function getBeakStyle(beakWidth?: number,
   beakStyle?: string): IRawStyle {
   let beakStyleWidth = beakWidth;
@@ -42,7 +34,6 @@ export const getStyles = (props: ICalloutContentStyleProps): ICalloutContentStyl
     overflowYHidden,
     calloutWidth,
     contentMaxHeight,
-    positions,
     beakWidth,
     backgroundColor,
     beakStyle
@@ -75,8 +66,7 @@ export const getStyles = (props: ICalloutContentStyleProps): ICalloutContentStyl
       },
       focusClear(),
       className,
-      positions && positions.targetEdge && ANIMATIONS[positions.targetEdge],
-      !!calloutWidth && { width: calloutWidth },
+      !!calloutWidth && { width: calloutWidth }
     ],
     beak: [
       'ms-Callout-beak',

From 175c8e4fed7be760c7866da14c17e27faa769a6e Mon Sep 17 00:00:00 2001
From: Joshua Rush <jdrush89@gmail.com>
Date: Thu, 1 Mar 2018 17:31:58 -0500
Subject: [PATCH 1481/1641] Allowing iconProps in nav link (#4124)

* Allowing iconProps in nav link

* Adding change request file
---
 ...Allow-Icon-Props-In-Nav-Link_2018-02-27-22-44.json | 11 +++++++++++
 .../src/components/Nav/Nav.base.tsx                   |  2 +-
 .../src/components/Nav/Nav.types.ts                   |  6 ++++++
 .../src/components/Nav/examples/Nav.Basic.Example.tsx |  7 +++++++
 4 files changed, 25 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/jdrush89-Allow-Icon-Props-In-Nav-Link_2018-02-27-22-44.json

diff --git a/common/changes/office-ui-fabric-react/jdrush89-Allow-Icon-Props-In-Nav-Link_2018-02-27-22-44.json b/common/changes/office-ui-fabric-react/jdrush89-Allow-Icon-Props-In-Nav-Link_2018-02-27-22-44.json
new file mode 100644
index 0000000000000..dd1e7862efba0
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jdrush89-Allow-Icon-Props-In-Nav-Link_2018-02-27-22-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Allowing Nav Links to specify iconProps",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jdrush89@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
index da2c0cb1cea39..09eca9d69f67f 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
@@ -158,7 +158,7 @@ export class NavBase extends BaseComponent<INavProps, INavState> implements INav
         className={ classNames.link }
         styles={ buttonStyles }
         href={ link.url || (link.forceAnchor ? 'javascript:' : undefined) }
-        iconProps={ { iconName: link.icon || '' } }
+        iconProps={ link.iconProps || { iconName: link.icon || '' } }
         description={ link.title || link.name }
         onClick={ link.onClick ? this._onNavButtonLinkClicked.bind(this, link) : this._onNavAnchorLinkClicked.bind(this, link) }
         title={ link.title || link.name }
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts b/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
index 872c17b669897..3ac5a5420b701 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
@@ -2,6 +2,7 @@ import * as React from 'react';
 import { NavBase } from './Nav.base';
 import { IStyle, ITheme } from '../../Styling';
 import { IRenderFunction, IStyleFunction } from '../../Utilities';
+import { IIconProps } from '../Icon/Icon.types';
 
 export interface INav {
   /**
@@ -159,6 +160,11 @@ export interface INavLink {
    */
   iconClassName?: string;
 
+  /**
+   * button icon props if applied
+   */
+  iconProps?: IIconProps;
+
   /**
    * Deprecated at v0.68.1 and will be removed at >= v1.0.0.
    * @deprecated
diff --git a/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.Basic.Example.tsx
index a54d521da4ce5..2815526478277 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/examples/Nav.Basic.Example.tsx
@@ -42,6 +42,13 @@ export class NavBasicExample extends React.Component<any, any> {
                     onClick: this._onClickHandler2,
                     icon: 'Edit',
                     key: 'key8'
+                  },
+                  {
+                    name: 'Delete',
+                    url: 'http://cnn.com',
+                    onClick: this._onClickHandler2,
+                    iconProps: { iconName: 'Delete' },
+                    key: 'key9'
                   }
                 ]
               }

From 252980d10c741136a39f526949d9e5247e654c2d Mon Sep 17 00:00:00 2001
From: Charles Simard-Lecours <charles.lecours@gmail.com>
Date: Thu, 1 Mar 2018 18:28:11 -0500
Subject: [PATCH 1482/1641] =?UTF-8?q?SearchBox=20component=20:=20Replaced?=
 =?UTF-8?q?=20labelText=20by=20placeholder.=20Deprecated=20l=E2=80=A6=20(#?=
 =?UTF-8?q?3998)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* SearchBox component : Replaced labelText by placeholder. Deprecated labelText.

* Changes requested by @erichdev

* Update SearchBox.base.tsx

* Update SearchBox.base.tsx

* Update SearchBox.base.tsx

* Update SearchBox.types.ts

* Fixed build

* Added change

* Updated Snapshots

* Update master_2018-02-16-04-00.json

* Update runchange_2018-02-21-18-04.json
---
 .../src/components/IconGrid/IconGrid.tsx      |  2 +-
 .../master_2018-02-16-04-00.json              | 11 ++++++++
 .../runchange_2018-02-21-18-04.json           | 11 ++++++++
 .../FloatingPeoplePicker.Basic.Example.tsx    |  2 +-
 .../examples/OverflowSet.Custom.Example.tsx   |  4 +--
 .../components/SearchBox/SearchBox.base.tsx   | 25 +++++++++++++------
 .../components/SearchBox/SearchBox.types.ts   | 13 +++++++---
 .../__snapshots__/SearchBox.test.tsx.snap     |  4 +--
 8 files changed, 55 insertions(+), 17 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/master_2018-02-16-04-00.json
 create mode 100644 common/changes/office-ui-fabric-react/runchange_2018-02-21-18-04.json

diff --git a/apps/fabric-website/src/components/IconGrid/IconGrid.tsx b/apps/fabric-website/src/components/IconGrid/IconGrid.tsx
index ece39ae5f5700..08879b64d9e0d 100644
--- a/apps/fabric-website/src/components/IconGrid/IconGrid.tsx
+++ b/apps/fabric-website/src/components/IconGrid/IconGrid.tsx
@@ -32,7 +32,7 @@ export class IconGrid extends React.Component<IIconGridProps, IIconGridState> {
 
     return (
       <div>
-        <SearchBox labelText='Search icons' value={ searchQuery } onChange={ this._onSearchQueryChanged.bind(this) } className={ styles.searchBox } />
+        <SearchBox placeholder='Search icons' value={ searchQuery } onChange={ this._onSearchQueryChanged.bind(this) } className={ styles.searchBox } />
         <ul className={ styles.grid }>
           { icons
             .filter(icon => icon.name.toLowerCase().indexOf(searchQuery.toLowerCase()) !== -1)
diff --git a/common/changes/office-ui-fabric-react/master_2018-02-16-04-00.json b/common/changes/office-ui-fabric-react/master_2018-02-16-04-00.json
new file mode 100644
index 0000000000000..43083b213497f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2018-02-16-04-00.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SearchBox: Deprecated `labelText` for `placeholder`.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "charles.lecours@gmail.com"
+}
diff --git a/common/changes/office-ui-fabric-react/runchange_2018-02-21-18-04.json b/common/changes/office-ui-fabric-react/runchange_2018-02-21-18-04.json
new file mode 100644
index 0000000000000..cb74305b64541
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/runchange_2018-02-21-18-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Searchbox: Removed non-localized default placeholder string.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "charles.lecours@gmail.com"
+}
diff --git a/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
index 6ec0079517a46..ef37a1aef7939 100644
--- a/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
+++ b/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
@@ -60,7 +60,7 @@ export class FloatingPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
       <div>
         <div className='ms-SearchBoxSmallExample' ref={ (ref: HTMLDivElement) => this._inputElement = ref }>
           <SearchBox
-            labelText={ 'Search a person' }
+            placeholder={ 'Search a person' }
             onChange={ this._onSearchChange }
             value={ this.state.searchValue }
           />
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx
index ce5992e638ca1..470d5d9501620 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Custom.Example.tsx
@@ -23,7 +23,7 @@ export class OverflowSetCustomExample extends BaseComponent<any, any> {
             onRender: (item: any) => {
               return (
                 <SearchBox
-                  labelText='Search'
+                  placeholder='Search'
                 />
               );
             }
@@ -141,4 +141,4 @@ export class OverflowSetCustomExample extends BaseComponent<any, any> {
       />
     );
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
index 31c52fd15213a..c227ebcb45609 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
@@ -24,10 +24,6 @@ export interface ISearchBoxState {
 
 @customizable('SearchBox', ['theme'])
 export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxState> {
-  public static defaultProps: ISearchBoxProps = {
-    labelText: 'Search',
-  };
-
   private _rootElement: HTMLElement;
   private _inputElement: HTMLInputElement;
   private _latestValue: string;
@@ -35,6 +31,10 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
   public constructor(props: ISearchBoxProps) {
     super(props);
 
+    this._warnDeprecations({
+      'labelText': 'placeholder'
+    });
+
     this._latestValue = props.value || '';
 
     this.state = {
@@ -54,8 +54,19 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
   }
 
   public render() {
-    const { labelText, className, disabled, underlined, getStyles, theme, clearButtonProps } = this.props;
+    const {
+      ariaLabel,
+      placeholder,
+      className,
+      disabled,
+      underlined,
+      getStyles,
+      labelText,
+      theme,
+      clearButtonProps
+    } = this.props;
     const { value, hasFocus, id } = this.state;
+    const placeholderValue = labelText === undefined ? placeholder : labelText;
 
     const classNames = getClassNames(getStyles!, {
       theme: theme!,
@@ -78,13 +89,13 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
         <input
           id={ id }
           className={ classNames.field }
-          placeholder={ labelText }
+          placeholder={ placeholderValue }
           onChange={ this._onInputChange }
           onInput={ this._onInputChange }
           onKeyDown={ this._onKeyDown }
           value={ value }
           disabled={ this.props.disabled }
-          aria-label={ this.props.ariaLabel ? this.props.ariaLabel : this.props.labelText }
+          aria-label={ ariaLabel ? ariaLabel : placeholder }
           ref={ this._resolveRef('_inputElement') }
         />
         { value!.length > 0 &&
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
index 0e0479b822713..3054f77998fad 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
@@ -18,8 +18,13 @@ export interface ISearchBoxProps extends React.InputHTMLAttributes<HTMLInputElem
   componentRef?: (component: ISearchBox) => void;
 
   /**
-  * Label text for the SearchBox.
-  * @default "Search"
+   * Placeholder for the search box.
+   */
+  placeholder?: string;
+
+  /**
+  * Deprecated. Use placeholder instead.
+  * @deprecated
   */
   labelText?: string;
 
@@ -66,7 +71,7 @@ export interface ISearchBoxProps extends React.InputHTMLAttributes<HTMLInputElem
 
   /**
    * The aria label of the SearchBox for the benefit of screen readers.
-   * @defaultvalue labelText
+   * @defaultvalue placeholder
    */
   ariaLabel?: string;
 
@@ -107,4 +112,4 @@ export interface ISearchBoxStyles {
   icon?: IStyle;
   field?: IStyle;
   clearButton?: IStyle;
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
index ca2d164525dc7..d6746105d91f8 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
@@ -70,7 +70,7 @@ exports[`SearchBox renders SearchBox correctly 1`] = `
     />
   </div>
   <input
-    aria-label="Search"
+    aria-label={undefined}
     className=
         ms-SearchBox-field
         {
@@ -110,7 +110,7 @@ exports[`SearchBox renders SearchBox correctly 1`] = `
     onChange={[Function]}
     onInput={[Function]}
     onKeyDown={[Function]}
-    placeholder="Search"
+    placeholder={undefined}
     value=""
   />
 </div>

From 7739825ca44396f4b6a74892e1b57552ea1e3c7a Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 1 Mar 2018 15:29:22 -0800
Subject: [PATCH 1483/1641] Fixing screener test.

---
 apps/vr-tests/src/stories/SearchBox.stories.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/apps/vr-tests/src/stories/SearchBox.stories.tsx b/apps/vr-tests/src/stories/SearchBox.stories.tsx
index 242d606fab3f6..9e44c3fd5f4aa 100644
--- a/apps/vr-tests/src/stories/SearchBox.stories.tsx
+++ b/apps/vr-tests/src/stories/SearchBox.stories.tsx
@@ -26,11 +26,11 @@ storiesOf('SearchBox', module)
   )).add('Root', () => (
     <Fabric style={ { display: 'flex' } }>
       <div className='testWrapper' style={ { padding: '10px', overflow: 'hidden', width: '300px' } }>
-        <SearchBox />
+        <SearchBox placeholder='Search' />
       </div>
     </Fabric>
   )).add('Full', () => (
     <Fabric className='testWrapper'>
-      <SearchBox />
+      <SearchBox placeholder='Search' />
     </Fabric>
   ));
\ No newline at end of file

From e9d88669c2ac8a92c3103f3a16ed1f9278ab9481 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 1 Mar 2018 15:39:11 -0800
Subject: [PATCH 1484/1641] Updating SearchBox examples to have the removed
 string in placeholder prop.

---
 package.json                                                  | 2 +-
 .../SearchBox/examples/SearchBox.Disabled.Example.tsx         | 2 ++
 .../SearchBox/examples/SearchBox.FullSize.Example.tsx         | 4 +++-
 .../components/SearchBox/examples/SearchBox.Small.Example.tsx | 1 +
 .../SearchBox/examples/SearchBox.Underlined.Example.tsx       | 1 +
 5 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/package.json b/package.json
index 728bc8ebcc2d9..85b7f65ee7098 100644
--- a/package.json
+++ b/package.json
@@ -30,4 +30,4 @@
   "devDependencies": {
     "@microsoft/rush": "4.1.0"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Disabled.Example.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Disabled.Example.tsx
index c37fd61d5e401..0bc20e5cd2df6 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Disabled.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Disabled.Example.tsx
@@ -9,12 +9,14 @@ export class SearchBoxDisabledExample extends React.Component<any, any> {
     return (
       <div className='ms-SearchBoxExample'>
         <SearchBox
+          placeholder='Search'
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
           disabled
         />
 
         <SearchBox
+          placeholder='Search'
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
           underlined={ true }
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.FullSize.Example.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.FullSize.Example.tsx
index 8e044a01cc86b..1d4683d080eba 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.FullSize.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.FullSize.Example.tsx
@@ -1,11 +1,13 @@
 import * as React from 'react';
 import { SearchBox } from 'office-ui-fabric-react/lib/SearchBox';
 
+// tslint:disable:jsx-no-lambda
+
 export class SearchBoxFullSizeExample extends React.Component<any, any> {
   public render() {
     return (
       <SearchBox
-        // tslint:disable:jsx-no-lambda
+        placeholder='Search'
         onFocus={ () => console.log('onFocus called') }
         onBlur={ () => console.log('onBlur called') }
         onChange={ () => console.log('onChange called') }
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Small.Example.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Small.Example.tsx
index 94c75240b32e9..c979689353ff0 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Small.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Small.Example.tsx
@@ -10,6 +10,7 @@ export class SearchBoxSmallExample extends React.Component<any, any> {
     return (
       <div className='ms-SearchBoxSmallExample'>
         <SearchBox
+          placeholder='Search'
           onEscape={ (ev) => {
             console.log('Custom onEscape Called');
           } }
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Underlined.Example.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Underlined.Example.tsx
index 25c1d9c6368de..45a9a321d4f04 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Underlined.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/examples/SearchBox.Underlined.Example.tsx
@@ -7,6 +7,7 @@ export class SearchBoxUnderlinedExample extends React.Component<any, any> {
   public render() {
     return (
       <SearchBox
+        placeholder='Search'
         onFocus={ () => console.log('onFocus called') }
         onBlur={ () => console.log('onBlur called') }
         underlined={ true }

From 77c1e54e140be51f9c7f252748bb5f868f957919 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Thu, 1 Mar 2018 20:30:27 -0800
Subject: [PATCH 1485/1641] Move fabric to TypeScript 2.7.2 (#4153)

* Rush generate

* First wave of fixes

* Make merge styles compile

* Fix fabric react for ts-2-7

* Fix todo-app

* Fix styles of classNamesFunctions

* Rush change
---
 apps/todo-app/package.json                    |    2 +-
 apps/todo-app/src/DataProvider.ts             |    2 +-
 apps/todo-app/src/components/TodoForm.tsx     |    2 +-
 apps/todo-app/src/components/TodoItem.tsx     |    4 +-
 apps/vr-tests/package.json                    |    2 +-
 ...chrisgo-ts-2-7-final_2018-03-01-21-36.json |   11 +
 ...chrisgo-ts-2-7-final_2018-03-01-21-36.json |   11 +
 ...chrisgo-ts-2-7-final_2018-03-01-21-36.json |   11 +
 ...chrisgo-ts-2-7-final_2018-03-01-21-36.json |   11 +
 common/config/rush/npm-shrinkwrap.json        | 1721 +++++++++--------
 .../ComponentPage/ComponentPage.tsx           |    2 +-
 packages/merge-styles/src/Stylesheet.ts       |   14 +-
 packages/merge-styles/src/concatStyleSets.ts  |    4 +-
 .../merge-styles/src/mergeStyleSets.test.ts   |    3 +-
 packages/merge-styles/src/mergeStyleSets.ts   |    8 +-
 .../PositioningContainer.styles.ts            |    4 +-
 .../ComponentStatus/ComponentStatusPage.tsx   |    4 +-
 .../ComponentStatus/ComponentStatusState.tsx  |    2 +-
 packages/utilities/src/classNamesFunction.ts  |    4 +-
 scripts/package.json                          |    4 +-
 20 files changed, 988 insertions(+), 838 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/chrisgo-ts-2-7-final_2018-03-01-21-36.json
 create mode 100644 common/changes/@uifabric/merge-styles/chrisgo-ts-2-7-final_2018-03-01-21-36.json
 create mode 100644 common/changes/@uifabric/utilities/chrisgo-ts-2-7-final_2018-03-01-21-36.json
 create mode 100644 common/changes/office-ui-fabric-react/chrisgo-ts-2-7-final_2018-03-01-21-36.json

diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 8d761b14afed7..7384926344b5e 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -22,7 +22,7 @@
     "office-ui-fabric-react": ">=5.57.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
-    "typescript": "2.6.2",
+    "typescript": "2.7.2",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/src/DataProvider.ts b/apps/todo-app/src/DataProvider.ts
index 630f1a4278f06..368a058c4c009 100644
--- a/apps/todo-app/src/DataProvider.ts
+++ b/apps/todo-app/src/DataProvider.ts
@@ -110,7 +110,7 @@ export default class DataProvider implements IDataProvider {
    */
   public toggleComplete(item: ITodoItem): Promise<ITodoItem[]> {
     // Create a new Item in which the PercentComplete value has been changed.
-    const newItem: ITodoItem = update(item, {
+    const newItem: ITodoItem = (update as any)(item, {
       isComplete: { $set: item.isComplete === true ? false : true }
     });
 
diff --git a/apps/todo-app/src/components/TodoForm.tsx b/apps/todo-app/src/components/TodoForm.tsx
index 72b714bc40964..2f99f5644c283 100644
--- a/apps/todo-app/src/components/TodoForm.tsx
+++ b/apps/todo-app/src/components/TodoForm.tsx
@@ -42,7 +42,7 @@ export interface ITodoFormState {
  * Button: https://fabricreact.azurewebsites.net/fabric-react/master/#/examples/button
  */
 export default class TodoForm extends BaseComponent<ITodoFormProps, ITodoFormState> {
-  private _textField: ITextField;
+  private _textField!: ITextField;
 
   constructor(props: ITodoFormProps) {
     super(props);
diff --git a/apps/todo-app/src/components/TodoItem.tsx b/apps/todo-app/src/components/TodoItem.tsx
index dbb215e6ab296..79e4ec8bcd066 100644
--- a/apps/todo-app/src/components/TodoItem.tsx
+++ b/apps/todo-app/src/components/TodoItem.tsx
@@ -20,8 +20,8 @@ import strings from './../strings';
 export default class TodoItem extends React.Component<ITodoItemProps, {}> {
   private static ANIMATION_TIMEOUT = 200;
 
-  private _animationTimeoutId: number;
-  private _rowItem: HTMLDivElement;
+  private _animationTimeoutId!: number;
+  private _rowItem!: HTMLDivElement;
 
   constructor(props: ITodoItemProps) {
     super(props);
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index f03cc39812a95..2b13d505a89a2 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -31,7 +31,7 @@
     "office-ui-fabric-react": ">=5.57.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
-    "typescript": "2.6.2",
+    "typescript": "2.7.2",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/chrisgo-ts-2-7-final_2018-03-01-21-36.json b/common/changes/@uifabric/example-app-base/chrisgo-ts-2-7-final_2018-03-01-21-36.json
new file mode 100644
index 0000000000000..dd03370d02f75
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/chrisgo-ts-2-7-final_2018-03-01-21-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Upgrade to TypeScript 2.7.2",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/chrisgo-ts-2-7-final_2018-03-01-21-36.json b/common/changes/@uifabric/merge-styles/chrisgo-ts-2-7-final_2018-03-01-21-36.json
new file mode 100644
index 0000000000000..a9a5759c862ea
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/chrisgo-ts-2-7-final_2018-03-01-21-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "Upgrade to TypeScript 2.7.2",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/chrisgo-ts-2-7-final_2018-03-01-21-36.json b/common/changes/@uifabric/utilities/chrisgo-ts-2-7-final_2018-03-01-21-36.json
new file mode 100644
index 0000000000000..d91ff7f2c881a
--- /dev/null
+++ b/common/changes/@uifabric/utilities/chrisgo-ts-2-7-final_2018-03-01-21-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Upgrade to TypeScript 2.7.2",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/chrisgo-ts-2-7-final_2018-03-01-21-36.json b/common/changes/office-ui-fabric-react/chrisgo-ts-2-7-final_2018-03-01-21-36.json
new file mode 100644
index 0000000000000..d102dbf71c88e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/chrisgo-ts-2-7-final_2018-03-01-21-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Upgrade to TypeScript 2.7.2",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 3e9de58cf5e67..bad9b61a44a68 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -35,16 +35,16 @@
       }
     },
     "@microsoft/load-themed-styles": {
-      "version": "1.7.29",
-      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.29.tgz",
-      "integrity": "sha1-KG8rZZsgFbC5VRcrdYsNvVvzalw="
+      "version": "1.7.35",
+      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.35.tgz",
+      "integrity": "sha1-R0hnGj9ENnN0vZ+i3mUIg5/DXG0="
     },
     "@microsoft/loader-load-themed-styles": {
-      "version": "1.7.10",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.7.10.tgz",
-      "integrity": "sha1-nvH6PAF2eZ1++f/QpWekYj1RY6g=",
+      "version": "1.7.16",
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.7.16.tgz",
+      "integrity": "sha1-D9UEsZp7iY+xfMQwS80OxviQzZA=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.29",
+        "@microsoft/load-themed-styles": "1.7.35",
         "loader-utils": "1.1.0"
       }
     },
@@ -75,7 +75,7 @@
       "requires": {
         "@types/argparse": "1.0.33",
         "@types/node": "6.0.88",
-        "argparse": "1.0.9",
+        "argparse": "1.0.10",
         "colors": "1.1.2"
       },
       "dependencies": {
@@ -88,18 +88,18 @@
     },
     "@rush-temp/build": {
       "version": "file:projects/build.tgz",
-      "integrity": "sha1-b/0rm0AlrCQ72dOpittRoaChESA=",
+      "integrity": "sha1-Ver5mhBaDTlt7Y5nDUvWPDdQhPI=",
       "requires": {
         "@microsoft/api-extractor": "4.3.7",
-        "@microsoft/load-themed-styles": "1.7.29",
-        "@microsoft/loader-load-themed-styles": "1.7.10",
+        "@microsoft/load-themed-styles": "1.7.35",
+        "@microsoft/loader-load-themed-styles": "1.7.16",
         "autoprefixer": "7.2.6",
-        "awesome-typescript-loader": "3.4.1",
+        "awesome-typescript-loader": "3.5.0",
         "bundlesize": "0.15.3",
         "chalk": "2.3.1",
         "command-line-args": "4.0.7",
         "cpx": "1.5.0",
-        "css-loader": "0.28.9",
+        "css-loader": "0.28.10",
         "github": "7.3.2",
         "glob": "7.1.2",
         "gzip-size": "3.0.0",
@@ -108,8 +108,8 @@
         "mustache": "2.3.0",
         "node-sass": "4.7.2",
         "open": "0.0.5",
-        "postcss": "6.0.17",
-        "postcss-loader": "2.1.0",
+        "postcss": "6.0.19",
+        "postcss-loader": "2.1.1",
         "postcss-modules": "0.8.0",
         "raf": "3.4.0",
         "raw-loader": "0.5.1",
@@ -118,19 +118,19 @@
         "style-loader": "0.19.1",
         "ts-jest": "21.2.4",
         "tslint": "5.9.1",
-        "tslint-microsoft-contrib": "5.0.2",
-        "typescript": "2.6.2",
+        "tslint-microsoft-contrib": "5.0.3",
+        "typescript": "2.7.2",
         "uglifyjs-webpack-plugin": "0.4.6",
         "webpack": "3.11.0",
-        "webpack-bundle-analyzer": "2.10.0",
-        "webpack-dev-server": "2.11.1",
+        "webpack-bundle-analyzer": "2.11.0",
+        "webpack-dev-server": "2.11.2",
         "webpack-notifier": "1.5.1",
         "yargs": "6.6.0"
       }
     },
     "@rush-temp/example-app-base": {
       "version": "file:projects/example-app-base.tgz",
-      "integrity": "sha1-LV6ExSpkKngD93QHjMXpAU1X2Ak=",
+      "integrity": "sha1-9dFwsZXpye1aVKCC4clouHgGnBE=",
       "requires": {
         "@types/es6-promise": "0.0.32",
         "@types/highlight.js": "9.12.2",
@@ -141,7 +141,7 @@
         "es6-promise": "4.2.4",
         "es6-weak-map": "2.0.2",
         "highlight.js": "9.12.0",
-        "office-ui-fabric-react": "5.49.2",
+        "office-ui-fabric-react": "5.56.0",
         "react": "16.2.0",
         "react-dom": "16.2.0",
         "tslib": "1.9.0"
@@ -149,9 +149,9 @@
     },
     "@rush-temp/experiments": {
       "version": "file:projects/experiments.tgz",
-      "integrity": "sha1-UaWwyEGM5mXZNeweA2POBGayJPg=",
+      "integrity": "sha1-DN9S5Fs/j/ZkpFT0xo2wzGt34+I=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.29",
+        "@microsoft/load-themed-styles": "1.7.35",
         "@types/enzyme": "3.1.5",
         "@types/enzyme-adapter-react-16": "1.0.1",
         "@types/es6-promise": "0.0.32",
@@ -167,20 +167,20 @@
         "enzyme": "3.3.0",
         "enzyme-adapter-react-16": "1.1.1",
         "es6-weak-map": "2.0.2",
-        "prop-types": "15.6.0",
+        "prop-types": "15.6.1",
         "react": "16.2.0",
         "react-dom": "16.2.0",
         "react-highlight": "0.10.0",
         "react-test-renderer": "16.2.0",
-        "sinon": "4.3.0",
+        "sinon": "4.4.2",
         "tslib": "1.9.0"
       }
     },
     "@rush-temp/fabric-website": {
       "version": "file:projects/fabric-website.tgz",
-      "integrity": "sha1-nGJiE4jMIhiQ48ra19peu7WL3FY=",
+      "integrity": "sha1-ZiTAxKp6omRHIlx54OVhUZsnloo=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.29",
+        "@microsoft/load-themed-styles": "1.7.35",
         "@types/es6-promise": "0.0.32",
         "@types/node": "8.0.26",
         "@types/prop-types": "15.5.2",
@@ -203,7 +203,7 @@
     },
     "@rush-temp/file-type-icons": {
       "version": "file:projects/file-type-icons.tgz",
-      "integrity": "sha1-WNiMlnuaua8SYuo1Moc5JiK60z4=",
+      "integrity": "sha1-4G9oT36P2AYqCpjXHfSm2Nlt2PI=",
       "requires": {
         "@types/react": "16.0.25",
         "@types/react-dom": "16.0.3",
@@ -214,21 +214,21 @@
     },
     "@rush-temp/icons": {
       "version": "file:projects/icons.tgz",
-      "integrity": "sha1-C9GkDWFFIVRO+gLcom+N2JnUGes=",
+      "integrity": "sha1-DnOJqyGa3UW80sWtP83EaHf3cGM=",
       "requires": {
         "tslib": "1.9.0"
       }
     },
     "@rush-temp/jest-serializer-merge-styles": {
       "version": "file:projects/jest-serializer-merge-styles.tgz",
-      "integrity": "sha1-+MCeidPU9OKloQmiGdGozBtl0t4=",
+      "integrity": "sha1-kit2DYaoDkGt01iWhFQnsRGFoTc=",
       "requires": {
         "@types/jest": "21.1.8"
       }
     },
     "@rush-temp/merge-styles": {
       "version": "file:projects/merge-styles.tgz",
-      "integrity": "sha1-3KNQc0lwQRpSzAXHg8p9tYmt61c=",
+      "integrity": "sha1-N4mnfc8Hv2i6QE1IvJxt4gi9AuY=",
       "requires": {
         "@types/jest": "21.1.8",
         "tslib": "1.9.0"
@@ -236,9 +236,9 @@
     },
     "@rush-temp/office-ui-fabric-react": {
       "version": "file:projects/office-ui-fabric-react.tgz",
-      "integrity": "sha1-MND9Li663/9tbmFYfmNQxhoGxxU=",
+      "integrity": "sha1-ADTTmStgRKaou3YbaCqOSn0awyU=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.29",
+        "@microsoft/load-themed-styles": "1.7.35",
         "@types/enzyme": "3.1.5",
         "@types/enzyme-adapter-react-16": "1.0.1",
         "@types/es6-promise": "0.0.32",
@@ -257,28 +257,28 @@
         "es6-weak-map": "2.0.2",
         "highlight.js": "9.12.0",
         "office-ui-fabric-core": "9.4.0",
-        "prop-types": "15.6.0",
+        "prop-types": "15.6.1",
         "react": "16.2.0",
         "react-dom": "16.2.0",
         "react-highlight": "0.10.0",
         "react-test-renderer": "16.2.0",
         "resemblejs": "2.2.6",
-        "sinon": "4.3.0",
+        "sinon": "4.4.2",
         "tslib": "1.9.0"
       }
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
       "version": "file:projects/office-ui-fabric-react-tslint.tgz",
-      "integrity": "sha1-wfJIcEzB9c1v+5eNV5c8kMoVfTQ=",
+      "integrity": "sha1-RqQY3nSg/9snfOzrcQNVR41UiP8=",
       "requires": {
-        "tslint-react": "3.5.0"
+        "tslint-react": "3.5.1"
       }
     },
     "@rush-temp/ssr-tests": {
       "version": "file:projects/ssr-tests.tgz",
-      "integrity": "sha1-Ww9vJarq435YVGT/pb2F5l94PXA=",
+      "integrity": "sha1-/RiZyyAIm4YIGMN/gmh0EFB/2Jw=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.29",
+        "@microsoft/load-themed-styles": "1.7.35",
         "@types/es6-promise": "0.0.32",
         "@types/mocha": "2.2.39",
         "@types/webpack-env": "1.13.0",
@@ -293,9 +293,9 @@
     },
     "@rush-temp/styling": {
       "version": "file:projects/styling.tgz",
-      "integrity": "sha1-SSb9aI6B3V9iwyZjAr7ZSmwsYN8=",
+      "integrity": "sha1-yooDPN6j4bEXiRcw/nKoruCTENM=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.29",
+        "@microsoft/load-themed-styles": "1.7.35",
         "@types/jest": "21.1.8",
         "@types/react": "16.0.25",
         "@types/webpack-env": "1.13.0",
@@ -308,7 +308,7 @@
     },
     "@rush-temp/test-bundle-button": {
       "version": "file:projects/test-bundle-button.tgz",
-      "integrity": "sha1-lN0tQocYh2OEZCa5P/K85OXzjkI=",
+      "integrity": "sha1-hHSH1ybHvJHL39pq1wIYc+s71lU=",
       "requires": {
         "@types/prop-types": "15.5.2",
         "@types/react": "16.0.25",
@@ -321,26 +321,26 @@
     },
     "@rush-temp/todo-app": {
       "version": "file:projects/todo-app.tgz",
-      "integrity": "sha1-nre4a9QdHlXZFhtK6PBPHVuM8Gc=",
+      "integrity": "sha1-TgRNk3WpedPAxOPIzAAWpZWU69I=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.29",
+        "@microsoft/load-themed-styles": "1.7.35",
         "@types/es6-promise": "0.0.32",
         "@types/react": "16.0.25",
         "@types/react-dom": "16.0.3",
         "@types/webpack-env": "1.13.0",
         "es6-promise": "4.2.4",
-        "immutability-helper": "2.6.4",
+        "immutability-helper": "2.6.5",
         "react": "16.2.0",
         "react-dom": "16.2.0",
         "tslib": "1.9.0",
-        "typescript": "2.6.2"
+        "typescript": "2.7.2"
       }
     },
     "@rush-temp/utilities": {
       "version": "file:projects/utilities.tgz",
-      "integrity": "sha1-GNjb2ebTodto0adRpvjnRiR8S9w=",
+      "integrity": "sha1-PEyJRbuw/Ha4QmT2cGhecacPKEs=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.29",
+        "@microsoft/load-themed-styles": "1.7.35",
         "@types/enzyme": "3.1.5",
         "@types/enzyme-adapter-react-16": "1.0.1",
         "@types/jest": "21.1.8",
@@ -350,35 +350,43 @@
         "@types/sinon": "2.2.2",
         "enzyme": "3.3.0",
         "enzyme-adapter-react-16": "1.1.1",
-        "prop-types": "15.6.0",
+        "prop-types": "15.6.1",
         "react": "16.2.0",
         "react-dom": "16.2.0",
-        "sinon": "4.3.0",
+        "sinon": "4.4.2",
+        "tslib": "1.9.0"
+      }
+    },
+    "@rush-temp/variants": {
+      "version": "file:projects/variants.tgz",
+      "integrity": "sha1-vxbJXzxQp+9DbiRutWD7vAQX7ew=",
+      "requires": {
+        "@types/jest": "21.1.8",
         "tslib": "1.9.0"
       }
     },
     "@rush-temp/vr-tests": {
       "version": "file:projects/vr-tests.tgz",
-      "integrity": "sha1-W2Vs4MI7qoJFVlZlraVkhB5t3jM=",
+      "integrity": "sha1-NzAoR+bMCugFFdIuBZSNjwY5yXM=",
       "requires": {
         "@storybook/addon-options": "3.2.3",
-        "@storybook/react": "3.3.13",
+        "@storybook/react": "3.3.14",
         "@types/react": "16.0.25",
         "@types/react-dom": "16.0.3",
         "@types/storybook__react": "3.0.5",
-        "awesome-typescript-loader": "3.4.1",
-        "css-loader": "0.28.9",
+        "awesome-typescript-loader": "3.5.0",
+        "css-loader": "0.28.10",
         "file-loader": "0.11.2",
-        "postcss-loader": "2.1.0",
+        "postcss-loader": "2.1.1",
         "raw-loader": "0.5.1",
         "react": "16.2.0",
         "react-dom": "16.2.0",
         "screener-runner": "0.6.19",
-        "screener-storybook": "0.11.1",
+        "screener-storybook": "0.11.3",
         "storybook-readme": "3.0.6",
         "style-loader": "0.19.1",
         "tslib": "1.9.0",
-        "typescript": "2.6.2"
+        "typescript": "2.7.2"
       }
     },
     "@sinonjs/formatio": {
@@ -390,26 +398,26 @@
       }
     },
     "@storybook/addon-actions": {
-      "version": "3.3.13",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-actions/-/addon-actions-3.3.13.tgz",
-      "integrity": "sha512-fceT2O3tXkeSHZJI/sh51FXpaBiWuGwjfFKDn8e4QAJrEeA4Ig59AQeoiWMMy1RdgPooUXuQvg7WKCvWj/IBWQ==",
+      "version": "3.3.14",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-actions/-/addon-actions-3.3.14.tgz",
+      "integrity": "sha512-MU+Sz80hlC3+VJW15yoa9y7mzsNechtd9X7WvugIB1Pg6AwY2IYNZoagy2dXwdBD6+sUTj1zWt0c7P7y5A/EAg==",
       "requires": {
         "deep-equal": "1.0.1",
         "global": "4.3.2",
-        "make-error": "1.3.3",
-        "prop-types": "15.6.0",
+        "make-error": "1.3.4",
+        "prop-types": "15.6.1",
         "react-inspector": "2.2.2",
         "uuid": "3.2.1"
       }
     },
     "@storybook/addon-links": {
-      "version": "3.3.13",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-links/-/addon-links-3.3.13.tgz",
-      "integrity": "sha512-9xfz46SV+0PrLPcP2UWR+ajGiK6fjH8SAiEaFIM9hAwY7Xe5DefpS0A49dRdZ2UPxTohuzGJAlS5J2MXCeWEUg==",
+      "version": "3.3.14",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-links/-/addon-links-3.3.14.tgz",
+      "integrity": "sha512-pD+/aOpGPcDQ/4h7UHA+nu3ye0w1KJ8GFz4MCX7a+38rYDUe1ePD5xmLT56zHCKqyKZgrrIoGZg/yEQjpQCJug==",
       "requires": {
-        "@storybook/components": "3.3.13",
+        "@storybook/components": "3.3.14",
         "global": "4.3.2",
-        "prop-types": "15.6.0"
+        "prop-types": "15.6.1"
       }
     },
     "@storybook/addon-options": {
@@ -417,42 +425,42 @@
       "resolved": "https://registry.npmjs.org/@storybook/addon-options/-/addon-options-3.2.3.tgz",
       "integrity": "sha1-6jdA0onUKc52fpaZvzpkfddBWS0=",
       "requires": {
-        "@storybook/addons": "3.3.13"
+        "@storybook/addons": "3.3.14"
       }
     },
     "@storybook/addons": {
-      "version": "3.3.13",
-      "resolved": "https://registry.npmjs.org/@storybook/addons/-/addons-3.3.13.tgz",
-      "integrity": "sha512-c7LNVMQbpvGdWiW6D9tONlM/DA6pIMJ0IkO9JT89Of1gLwFAJyKVQKGOYBzcKa1G0I0qzzmdXAc9lzCfmGYKMg=="
+      "version": "3.3.14",
+      "resolved": "https://registry.npmjs.org/@storybook/addons/-/addons-3.3.14.tgz",
+      "integrity": "sha512-cVSowQdWOr/XxWk60ykr4a+0gnpVnfWkJ0pIbGQUBcq6tvGrAoZ76Cq18lYS7NHNL2lwoEQT3wBs7w0UaJtOTA=="
     },
     "@storybook/channel-postmessage": {
-      "version": "3.3.13",
-      "resolved": "https://registry.npmjs.org/@storybook/channel-postmessage/-/channel-postmessage-3.3.13.tgz",
-      "integrity": "sha512-WiEN4wlL07eOq5aE0j60jECH6ppCKeyJqC+qqeRoDoRRY7OlJFpKXuZnhmV6TKGIDgvtsNBSCg6DhfytuQMGJw==",
+      "version": "3.3.14",
+      "resolved": "https://registry.npmjs.org/@storybook/channel-postmessage/-/channel-postmessage-3.3.14.tgz",
+      "integrity": "sha512-xFmc2F/OKqrrdMjrvJTfADOl3+fKxKCs4vNr8w26k8gBLDp/JuoSomnar7kR7PfX9mAAfVgVle8erUMkHc0Tsg==",
       "requires": {
-        "@storybook/channels": "3.3.13",
+        "@storybook/channels": "3.3.14",
         "global": "4.3.2",
         "json-stringify-safe": "5.0.1"
       }
     },
     "@storybook/channels": {
-      "version": "3.3.13",
-      "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-3.3.13.tgz",
-      "integrity": "sha512-e4eHNogqLpUxb/imixsQDt4sa/kOLKQb3EBatQ8DCzUpLdPgZJnJRElcMic/mjJ33Wowb/wtSi3dR44SDKz+ww=="
+      "version": "3.3.14",
+      "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-3.3.14.tgz",
+      "integrity": "sha512-qrd7WnQDmdX0uMGbTmRKlLL9R8mrVClsT2Idb1YsL7gbTE2X4QyOTt4ANFeCmvZ8LxqOmEv5glcBmfBRNjBPgQ=="
     },
     "@storybook/client-logger": {
-      "version": "3.3.13",
-      "resolved": "https://registry.npmjs.org/@storybook/client-logger/-/client-logger-3.3.13.tgz",
-      "integrity": "sha512-fFBy7C/5j5vkYCVNcMzLpkP4hppcmO4ixPGoHkMxD5HMseBa2wRnOWIFsWti9hhGTh6mEIV86VRTySN25mIKDg=="
+      "version": "3.3.14",
+      "resolved": "https://registry.npmjs.org/@storybook/client-logger/-/client-logger-3.3.14.tgz",
+      "integrity": "sha512-dKuASmwvZqriu63CsNlvvUWyQ9EuYqS6sXmdy5yhusycFl+LfhvMMNKzENxb91ZSAcE75wH39VZVdLZTxsH9Fw=="
     },
     "@storybook/components": {
-      "version": "3.3.13",
-      "resolved": "https://registry.npmjs.org/@storybook/components/-/components-3.3.13.tgz",
-      "integrity": "sha512-htNVEUfW//Xw9RfXtNExDnVEJaHVIA4U08tsfKHOaCkeA3urpPkSZD9+4SCLixw2IYodbolbFWphaqBk1yrQDw==",
+      "version": "3.3.14",
+      "resolved": "https://registry.npmjs.org/@storybook/components/-/components-3.3.14.tgz",
+      "integrity": "sha512-MCUx0JWk21jspFUb/dqaqBB1ZCBHhSIHlkBt438+oub4CRlTHl5q3tDffyDUzgdzMULi1xubtEH8f9pet87A8w==",
       "requires": {
         "glamor": "2.20.40",
-        "glamorous": "4.11.4",
-        "prop-types": "15.6.0"
+        "glamorous": "4.11.6",
+        "prop-types": "15.6.1"
       }
     },
     "@storybook/mantra-core": {
@@ -466,30 +474,39 @@
       }
     },
     "@storybook/node-logger": {
-      "version": "3.3.13",
-      "resolved": "https://registry.npmjs.org/@storybook/node-logger/-/node-logger-3.3.13.tgz",
-      "integrity": "sha512-kKiCudlOJOt64+nq3uw96NdjxSGHOU6DXEVGC4TkjU8Q8BEigWiKNmitQjuk7yCodKtjIl9SUMQ/y3PzqKVAkg==",
+      "version": "3.3.14",
+      "resolved": "https://registry.npmjs.org/@storybook/node-logger/-/node-logger-3.3.14.tgz",
+      "integrity": "sha512-MBVr0J//5ENuDqNT5LWKTbLF7rmUJk0BpBnuJJrIif1Z+AfNs1gJz7MeL5V/3GNnUx8jc6NzNWCvNFJUIvf0uw==",
       "requires": {
         "chalk": "2.3.1",
         "npmlog": "4.1.2"
       }
     },
+    "@storybook/podda": {
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/@storybook/podda/-/podda-1.2.3.tgz",
+      "integrity": "sha512-g7dsdsn50AhlGZ8iIDKdF8bi7Am++iFOq+QN+hNKz3FvgLuf8Dz+mpC/BFl90eE9bEYxXqXKeMf87399Ec5Qhw==",
+      "requires": {
+        "babel-runtime": "6.26.0",
+        "immutable": "3.8.2"
+      }
+    },
     "@storybook/react": {
-      "version": "3.3.13",
-      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-3.3.13.tgz",
-      "integrity": "sha512-h+WmeTqsylG+X9KMHfIAm1ZbVJMYbXdZuvTkPz0Nns7t9yrTWd877dtZIOKzTHhA4GUxgla2qPYy7dF2+vsJtA==",
-      "requires": {
-        "@storybook/addon-actions": "3.3.13",
-        "@storybook/addon-links": "3.3.13",
-        "@storybook/addons": "3.3.13",
-        "@storybook/channel-postmessage": "3.3.13",
-        "@storybook/client-logger": "3.3.13",
-        "@storybook/node-logger": "3.3.13",
-        "@storybook/ui": "3.3.13",
+      "version": "3.3.14",
+      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-3.3.14.tgz",
+      "integrity": "sha512-qeeEhP5JyqmZKKbNdkSIj2SqWN1Q4bqy8ed+b+CS3gPoSGPy7DscbSwykllXvaTO9NASYGjFHG9b6hohQSQurw==",
+      "requires": {
+        "@storybook/addon-actions": "3.3.14",
+        "@storybook/addon-links": "3.3.14",
+        "@storybook/addons": "3.3.14",
+        "@storybook/channel-postmessage": "3.3.14",
+        "@storybook/client-logger": "3.3.14",
+        "@storybook/node-logger": "3.3.14",
+        "@storybook/ui": "3.3.14",
         "airbnb-js-shims": "1.4.1",
         "autoprefixer": "7.2.6",
-        "babel-loader": "7.1.2",
-        "babel-plugin-react-docgen": "1.8.2",
+        "babel-loader": "7.1.3",
+        "babel-plugin-react-docgen": "1.8.3",
         "babel-plugin-transform-regenerator": "6.26.0",
         "babel-plugin-transform-runtime": "6.23.0",
         "babel-preset-env": "1.6.1",
@@ -504,13 +521,13 @@
         "common-tags": "1.7.2",
         "configstore": "3.1.1",
         "core-js": "2.5.3",
-        "css-loader": "0.28.9",
-        "dotenv-webpack": "1.5.4",
+        "css-loader": "0.28.10",
+        "dotenv-webpack": "1.5.5",
         "express": "4.16.2",
-        "file-loader": "1.1.6",
+        "file-loader": "1.1.10",
         "find-cache-dir": "1.0.0",
         "glamor": "2.20.40",
-        "glamorous": "4.11.4",
+        "glamorous": "4.11.6",
         "global": "4.3.2",
         "html-loader": "0.5.5",
         "html-webpack-plugin": "2.30.1",
@@ -521,73 +538,61 @@
         "markdown-loader": "2.0.2",
         "npmlog": "4.1.2",
         "postcss-flexbugs-fixes": "3.3.0",
-        "postcss-loader": "2.1.0",
-        "prop-types": "15.6.0",
+        "postcss-loader": "2.1.1",
+        "prop-types": "15.6.1",
         "qs": "6.5.1",
         "redux": "3.7.2",
         "request": "2.83.0",
         "serve-favicon": "2.4.5",
         "shelljs": "0.7.8",
         "style-loader": "0.19.1",
-        "uglifyjs-webpack-plugin": "1.1.8",
+        "uglifyjs-webpack-plugin": "1.2.2",
         "url-loader": "0.6.2",
         "util-deprecate": "1.0.2",
         "uuid": "3.2.1",
         "webpack": "3.11.0",
         "webpack-dev-middleware": "1.12.2",
-        "webpack-hot-middleware": "2.21.0"
+        "webpack-hot-middleware": "2.21.1"
       },
       "dependencies": {
         "file-loader": {
-          "version": "1.1.6",
-          "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-1.1.6.tgz",
-          "integrity": "sha512-873ztuL+/hfvXbLDJ262PGO6XjERnybJu2gW1/5j8HUfxSiFJI9Hj/DhZ50ZGRUxBvuNiazb/cM2rh9pqrxP6Q==",
+          "version": "1.1.10",
+          "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-1.1.10.tgz",
+          "integrity": "sha512-dNnT4yJgUPtGDg0+m03kQ0b/PZi3Y12EnqYuRPNCsbYkBZc6j+fwVWy40jWzZjn5kIzQ4BLIxzJimbwAYlnPGw==",
           "requires": {
             "loader-utils": "1.1.0",
-            "schema-utils": "0.3.0"
-          }
-        },
-        "schema-utils": {
-          "version": "0.3.0",
-          "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-0.3.0.tgz",
-          "integrity": "sha1-9YdyIs4+kx7a4DnxfrNxbnE3+M8=",
-          "requires": {
-            "ajv": "5.5.2"
+            "schema-utils": "0.4.5"
           }
         },
         "uglify-es": {
-          "version": "3.3.10",
-          "resolved": "https://registry.npmjs.org/uglify-es/-/uglify-es-3.3.10.tgz",
-          "integrity": "sha512-rPzPisCzW68Okj1zNrfa2dR9uEm43SevDmpR6FChoZABFk9dANGnzzBMgHYUXI3609//63fnVkyQ1SQmAMyjww==",
+          "version": "3.3.9",
+          "resolved": "https://registry.npmjs.org/uglify-es/-/uglify-es-3.3.9.tgz",
+          "integrity": "sha512-r+MU0rfv4L/0eeW3xZrd16t4NZfK8Ld4SWVglYBb7ez5uXFWHuVRs6xCTrf1yirs9a4j4Y27nn7SRfO6v67XsQ==",
           "requires": {
-            "commander": "2.14.1",
+            "commander": "2.13.0",
             "source-map": "0.6.1"
+          },
+          "dependencies": {
+            "commander": {
+              "version": "2.13.0",
+              "resolved": "https://registry.npmjs.org/commander/-/commander-2.13.0.tgz",
+              "integrity": "sha512-MVuS359B+YzaWqjCL/c+22gfryv+mCBPHAv3zyVI2GN8EY6IRP8VwtasXn8jyyhvvq84R4ImN1OKRtcbIasjYA=="
+            }
           }
         },
         "uglifyjs-webpack-plugin": {
-          "version": "1.1.8",
-          "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-1.1.8.tgz",
-          "integrity": "sha512-XG8/QmR1pyPeE1kj2aigo5kos8umefB31zW+PMvAAytHSB0T/vQvN6sqt8+Sh+y0b0A7zlmxNi2dzRnj0wcqGA==",
+          "version": "1.2.2",
+          "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-1.2.2.tgz",
+          "integrity": "sha512-CG/NvzXfemUAm5Y4Guh5eEaJYHtkG7kKNpXEJHp9QpxsFVB5/qKvYWoMaq4sa99ccZ0hM3MK8vQV9XPZB4357A==",
           "requires": {
-            "cacache": "10.0.2",
+            "cacache": "10.0.4",
             "find-cache-dir": "1.0.0",
-            "schema-utils": "0.4.3",
+            "schema-utils": "0.4.5",
             "serialize-javascript": "1.4.0",
             "source-map": "0.6.1",
-            "uglify-es": "3.3.10",
+            "uglify-es": "3.3.9",
             "webpack-sources": "1.1.0",
-            "worker-farm": "1.5.2"
-          },
-          "dependencies": {
-            "schema-utils": {
-              "version": "0.4.3",
-              "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-0.4.3.tgz",
-              "integrity": "sha512-sgv/iF/T4/SewJkaVpldKC4WjSkz0JsOh2eKtxCPpCO1oR05+7MOF+H476HVRbLArkgA7j5TRJJ4p2jdFkUGQQ==",
-              "requires": {
-                "ajv": "5.5.2",
-                "ajv-keywords": "2.1.1"
-              }
-            }
+            "worker-farm": "1.5.4"
           }
         }
       }
@@ -612,7 +617,7 @@
         "babel-runtime": "6.26.0",
         "create-react-class": "15.6.3",
         "hoist-non-react-statics": "1.2.0",
-        "prop-types": "15.6.0"
+        "prop-types": "15.6.1"
       }
     },
     "@storybook/react-stubber": {
@@ -624,12 +629,13 @@
       }
     },
     "@storybook/ui": {
-      "version": "3.3.13",
-      "resolved": "https://registry.npmjs.org/@storybook/ui/-/ui-3.3.13.tgz",
-      "integrity": "sha512-ecmu9l0Pr2PyZ6gWcK+AW0ZHNCQ1t1FkYm7JIYXWpAP0cBQ6EtvEoQLowzJ9GXw5s/s4hwdHmoxJ8j2SRuUulw==",
+      "version": "3.3.14",
+      "resolved": "https://registry.npmjs.org/@storybook/ui/-/ui-3.3.14.tgz",
+      "integrity": "sha512-aL5mqZ8WNW+bRGVaLuvCfxiLtKvorL9poXosgyc1jZurwi3Z05k7injkg16LuA1dE0wSib/mgHXjgzKXHN+Fhg==",
       "requires": {
-        "@storybook/components": "3.3.13",
+        "@storybook/components": "3.3.14",
         "@storybook/mantra-core": "1.7.2",
+        "@storybook/podda": "1.2.3",
         "@storybook/react-komposer": "2.0.3",
         "babel-runtime": "6.26.0",
         "deep-equal": "1.0.1",
@@ -641,13 +647,12 @@
         "lodash.debounce": "4.0.8",
         "lodash.pick": "4.4.0",
         "lodash.sortby": "4.7.0",
-        "podda": "1.2.2",
-        "prop-types": "15.6.0",
+        "prop-types": "15.6.1",
         "qs": "6.5.1",
-        "react-fuzzy": "0.5.1",
+        "react-fuzzy": "0.5.2",
         "react-icons": "2.2.7",
         "react-inspector": "2.2.2",
-        "react-modal": "3.1.13",
+        "react-modal": "3.3.1",
         "react-split-pane": "0.1.77",
         "react-treebeard": "2.1.0",
         "redux": "3.7.2"
@@ -782,37 +787,37 @@
       "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.4.2.tgz",
       "integrity": "sha512-JG0euHlQhcVsI9wCfKE/DYDoDjzQNcHDg2Wh1NeFeVPz/6L0s0D7Izw2ULkZgW1TCLFcNx0xdwN+SSnGjIlTkw==",
       "requires": {
-        "@uifabric/styling": "5.17.0",
+        "@uifabric/styling": "5.19.0",
         "tslib": "1.9.0"
       }
     },
     "@uifabric/merge-styles": {
-      "version": "5.11.2",
-      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.11.2.tgz",
-      "integrity": "sha512-Qipbhp1J+yyBSAEDCGWjuv2mdkIEwRFB9qr8kNCew/8t4TNt2V2O8GbMjIqj0ieCOyj8M11rlALOGThOY91z0w==",
+      "version": "5.12.2",
+      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.12.2.tgz",
+      "integrity": "sha512-PVUu9IIa6voT5YvZAfd3GJvHZpTyA6m3WCAqSjCvNScGJN1EdQ9YQjfJpC1FWsUNYcXIBQqLl7YiuAE+aCz99A==",
       "requires": {
         "tslib": "1.9.0"
       }
     },
     "@uifabric/styling": {
-      "version": "5.17.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.17.0.tgz",
-      "integrity": "sha512-FXw7GQEaGGkfEXnGJFSKgbk+uzlM+1PFYwb4BnxlscsXQe1sdmqCKYmY2XrAIdwywfQAZA3t6zshn/EjE+eS7g==",
+      "version": "5.19.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.19.0.tgz",
+      "integrity": "sha512-XZw+RFaw6RscwAvAO7+w4MXbLI0/lVqBcriU65EKYLvBXvMbYry3cY4AxobQ/5e0LdjXs8YPOFHOJHfTvw18Gg==",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.29",
-        "@uifabric/merge-styles": "5.11.2",
-        "@uifabric/utilities": "5.10.2",
+        "@microsoft/load-themed-styles": "1.7.35",
+        "@uifabric/merge-styles": "5.12.2",
+        "@uifabric/utilities": "5.13.0",
         "tslib": "1.9.0"
       }
     },
     "@uifabric/utilities": {
-      "version": "5.10.2",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.10.2.tgz",
-      "integrity": "sha512-mKJYVydBEekrBSDn8VDIafIWiqL82WnigdTSv2ooo3v4ClJc39zbV1NLWXC4T6RLSTZHIi/W4CTudtWOtdVcAA==",
+      "version": "5.13.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.13.0.tgz",
+      "integrity": "sha512-fgKKMs/tea/TTSvyWuBzDT/SpDLzeUp6/fNqrrK2iSM0CxSn8wfTQdAwL6WBVAsgR4TZvTU0RioJVM/Tg/H9QQ==",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.29",
-        "@uifabric/merge-styles": "5.11.2",
-        "prop-types": "15.6.0",
+        "@microsoft/load-themed-styles": "1.7.35",
+        "@uifabric/merge-styles": "5.12.2",
+        "prop-types": "15.6.1",
         "tslib": "1.9.0"
       }
     },
@@ -831,7 +836,7 @@
       "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.4.tgz",
       "integrity": "sha1-hiRnWMfdbSGmR0/whKR0DsBesh8=",
       "requires": {
-        "mime-types": "2.1.17",
+        "mime-types": "2.1.18",
         "negotiator": "0.6.1"
       }
     },
@@ -878,8 +883,8 @@
       "integrity": "sha512-b7S3d+DPRMwaDAs0cgKQTMLO/JG/iSehIlzEGvt2FpxIztRDDABEjWI73AfTxkSiK3/OsraPRYxVNAX3yhSNLw==",
       "requires": {
         "array-includes": "3.0.3",
-        "array.prototype.flatmap": "1.2.0",
-        "array.prototype.flatten": "1.2.0",
+        "array.prototype.flatmap": "1.2.1",
+        "array.prototype.flatten": "1.2.1",
         "es5-shim": "4.5.10",
         "es6-shim": "0.35.3",
         "function.prototype.name": "1.1.0",
@@ -897,15 +902,15 @@
       "integrity": "sha1-c7Xuyj+rZT49P5Qis0GtQiBdyWU=",
       "requires": {
         "co": "4.6.0",
-        "fast-deep-equal": "1.0.0",
+        "fast-deep-equal": "1.1.0",
         "fast-json-stable-stringify": "2.0.0",
         "json-schema-traverse": "0.3.1"
       }
     },
     "ajv-keywords": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-2.1.1.tgz",
-      "integrity": "sha1-YXmX/F9gV2iUxDX5QNgZ4TW4B2I="
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.1.0.tgz",
+      "integrity": "sha1-rCsnk5xUPpXSwG5/f1wnvkqlQ74="
     },
     "align-text": {
       "version": "0.1.4",
@@ -1061,9 +1066,9 @@
       }
     },
     "argparse": {
-      "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.9.tgz",
-      "integrity": "sha1-c9g7wmP4bpf4zE9rrhsOkKfSLIY=",
+      "version": "1.0.10",
+      "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz",
+      "integrity": "sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==",
       "requires": {
         "sprintf-js": "1.0.3"
       }
@@ -1154,9 +1159,9 @@
       "integrity": "sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg="
     },
     "array.prototype.flatmap": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/array.prototype.flatmap/-/array.prototype.flatmap-1.2.0.tgz",
-      "integrity": "sha512-Mks+PkOK0iOmxq0WtINn1rlPmFC8ZTdLq37MzgZG7ihF5eF+cT29H9MZ6TqbBvxGFLArGwuMxXl/DQjeNI3zeQ==",
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/array.prototype.flatmap/-/array.prototype.flatmap-1.2.1.tgz",
+      "integrity": "sha512-i18e2APdsiezkcqDyZor78Pbfjfds3S94dG6dgIV2ZASJaUf1N0dz2tGdrmwrmlZuNUgxH+wz6Z0zYVH2c5xzQ==",
       "requires": {
         "define-properties": "1.1.2",
         "es-abstract": "1.10.0",
@@ -1164,9 +1169,9 @@
       }
     },
     "array.prototype.flatten": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/array.prototype.flatten/-/array.prototype.flatten-1.2.0.tgz",
-      "integrity": "sha512-GfDeDMS9gFiKtJrtJVPljbUQowQoo5X+TTGjMTAxZL1qs4xq758+R1QxRS6dToM4YHk8Mf/L0INMHOsF9hmHGw==",
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/array.prototype.flatten/-/array.prototype.flatten-1.2.1.tgz",
+      "integrity": "sha512-3GhsA78XgK//wQKbhUe6L93kknekGlTRY0kvYcpuSi0aa9rVrMr/okeIIv/XSpN8fZ5iUM+bWifhf2/7CYKtIg==",
       "requires": {
         "define-properties": "1.1.2",
         "es-abstract": "1.10.0",
@@ -1189,9 +1194,9 @@
       "integrity": "sha1-2sh4dxPJlmhJ/IGAd36+nB3fO4Y="
     },
     "asn1.js": {
-      "version": "4.9.2",
-      "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-4.9.2.tgz",
-      "integrity": "sha512-b/OsSjvWEo8Pi8H0zsDd2P6Uqo2TK2pH8gNLSJtNLM2Db0v2QaAZ0pBQJXVjAn4gBuugeVDr7s63ZogpUIwWDg==",
+      "version": "4.10.1",
+      "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-4.10.1.tgz",
+      "integrity": "sha512-p32cOF5q0Zqs9uBiONKYLm6BClCoBCM5O9JfeUSlnQLBTxYdTK+pW+nXflm8UkKd2UYlEbYz5qEi0JuZR9ckSw==",
       "requires": {
         "bn.js": "4.11.8",
         "inherits": "2.0.3",
@@ -1270,26 +1275,25 @@
       "integrity": "sha512-Iq8TRIB+/9eQ8rbGhcP7ct5cYb/3qjNYAR2SnzLCEcwF6rvVOax8+9+fccgXk4bEhQGjOZd5TLhsksmAdsbGqQ==",
       "requires": {
         "browserslist": "2.11.3",
-        "caniuse-lite": "1.0.30000808",
+        "caniuse-lite": "1.0.30000810",
         "normalize-range": "0.1.2",
         "num2fraction": "1.2.2",
-        "postcss": "6.0.17",
+        "postcss": "6.0.19",
         "postcss-value-parser": "3.3.0"
       }
     },
     "awesome-typescript-loader": {
-      "version": "3.4.1",
-      "resolved": "https://registry.npmjs.org/awesome-typescript-loader/-/awesome-typescript-loader-3.4.1.tgz",
-      "integrity": "sha512-fYxBtN6s4Dm6vtsROWi8IQ4I+KcmwRWePAVvhI06mFcHbtHfZopOs4qGNu9LyCPEw403LDROKFA+NVV6ig5yNw==",
+      "version": "3.5.0",
+      "resolved": "https://registry.npmjs.org/awesome-typescript-loader/-/awesome-typescript-loader-3.5.0.tgz",
+      "integrity": "sha512-qzgm9SEvodVkSi9QY7Me1/rujg+YBNMjayNSAyzNghwTEez++gXoPCwMvpbHRG7wrOkDCiF6dquvv9ESmUBAuw==",
       "requires": {
-        "colors": "1.1.2",
+        "chalk": "2.3.1",
         "enhanced-resolve": "3.3.0",
         "loader-utils": "1.1.0",
         "lodash": "4.17.5",
-        "micromatch": "3.1.5",
+        "micromatch": "3.1.9",
         "mkdirp": "0.5.1",
-        "object-assign": "4.1.1",
-        "source-map-support": "0.4.18"
+        "source-map-support": "0.5.3"
       },
       "dependencies": {
         "lodash": {
@@ -1637,9 +1641,9 @@
       }
     },
     "babel-loader": {
-      "version": "7.1.2",
-      "resolved": "https://registry.npmjs.org/babel-loader/-/babel-loader-7.1.2.tgz",
-      "integrity": "sha512-jRwlFbINAeyDStqK6Dd5YuY0k5YuzQUvlz2ZamuXrXmxav3pNqe9vfJ402+2G+OmlJSXxCOpB6Uz0INM7RQe2A==",
+      "version": "7.1.3",
+      "resolved": "https://registry.npmjs.org/babel-loader/-/babel-loader-7.1.3.tgz",
+      "integrity": "sha512-PeN29YvOynPMvNk7QCzsHqxpmfXwKAC+uxkiSNFQsmXBBVltzEkVWmv/Ip3tx7yk149dQUwk497bTXNu+DZjLA==",
       "requires": {
         "find-cache-dir": "1.0.0",
         "loader-utils": "1.1.0",
@@ -1678,8 +1682,8 @@
       "integrity": "sha1-Z2DN2Xf0EdPhdbsGTyvDJ9mbK24=",
       "requires": {
         "find-up": "2.1.0",
-        "istanbul-lib-instrument": "1.9.1",
-        "test-exclude": "4.1.1"
+        "istanbul-lib-instrument": "1.9.2",
+        "test-exclude": "4.2.0"
       }
     },
     "babel-plugin-jest-hoist": {
@@ -1772,13 +1776,13 @@
       }
     },
     "babel-plugin-react-docgen": {
-      "version": "1.8.2",
-      "resolved": "https://registry.npmjs.org/babel-plugin-react-docgen/-/babel-plugin-react-docgen-1.8.2.tgz",
-      "integrity": "sha512-201wzLbDeeZri6p+KREqspsFA8rNV6SiVx65jiPC6lhM7TUTNcbEoacFHbB6ou8ONsQT3phTqLpd5Nl02mZaqw==",
+      "version": "1.8.3",
+      "resolved": "https://registry.npmjs.org/babel-plugin-react-docgen/-/babel-plugin-react-docgen-1.8.3.tgz",
+      "integrity": "sha512-yJVPObZu8HLQmOsiJATqBE/+6xZiF/b5SnWTxgV0nfELHjz5lWzIHgBzuAe5ael613+Hgf6VnRa98OVILZI07w==",
       "requires": {
         "babel-types": "6.26.0",
         "lodash": "4.17.5",
-        "react-docgen": "2.20.0"
+        "react-docgen": "2.20.1"
       },
       "dependencies": {
         "lodash": {
@@ -2370,7 +2374,7 @@
         "babel-plugin-transform-exponentiation-operator": "6.24.1",
         "babel-plugin-transform-regenerator": "6.26.0",
         "browserslist": "2.11.3",
-        "invariant": "2.2.2",
+        "invariant": "2.2.3",
         "semver": "5.5.0"
       }
     },
@@ -2515,6 +2519,19 @@
           "version": "4.17.5",
           "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
           "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
+        },
+        "source-map-support": {
+          "version": "0.4.18",
+          "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.4.18.tgz",
+          "integrity": "sha512-try0/JqxPLF9nOjvSta7tVondkP5dwgyLDjVoyMDlmjugT2lRZ1OfsrYTkCd2hkDnJTKRbO/Rl3orm8vlsUzbA==",
+          "requires": {
+            "source-map": "0.5.7"
+          }
         }
       }
     },
@@ -2565,7 +2582,7 @@
         "babylon": "6.18.0",
         "debug": "2.6.9",
         "globals": "9.18.0",
-        "invariant": "2.2.2",
+        "invariant": "2.2.3",
         "lodash": "4.17.5"
       },
       "dependencies": {
@@ -2616,12 +2633,22 @@
         "isobject": "3.0.1",
         "mixin-deep": "1.3.1",
         "pascalcase": "0.1.1"
+      },
+      "dependencies": {
+        "define-property": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/define-property/-/define-property-1.0.0.tgz",
+          "integrity": "sha1-dp66rz9KY6rTr56NMEybvnm/sOY=",
+          "requires": {
+            "is-descriptor": "1.0.2"
+          }
+        }
       }
     },
     "base64-js": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.2.1.tgz",
-      "integrity": "sha512-dwVUVIXsBZXwTuwnXI9RK8sBmgq09NDHzyR9SAph9eqk76gKK2JSQmZARC2zRC81JC2QTtxD0ARU5qTS25gIGw=="
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.2.3.tgz",
+      "integrity": "sha512-MsAhsUW1GxCdgYSO6tAfZrNapmUKk7mWx/k5mFY/A1gBtkaCaNapTg+FExCw1r9yeaZhqx/xPg43xgTFH6KL5w=="
     },
     "batch": {
       "version": "0.6.1",
@@ -2689,7 +2716,7 @@
         "on-finished": "2.3.0",
         "qs": "6.5.1",
         "raw-body": "2.3.2",
-        "type-is": "1.6.15"
+        "type-is": "1.6.16"
       }
     },
     "bonjour": {
@@ -2722,7 +2749,7 @@
       "resolved": "https://registry.npmjs.org/boom/-/boom-4.3.1.tgz",
       "integrity": "sha1-T4owBctKfjiJ90kDD9JbluAdLjE=",
       "requires": {
-        "hoek": "4.2.0"
+        "hoek": "4.2.1"
       }
     },
     "bowser": {
@@ -2740,9 +2767,9 @@
       }
     },
     "braces": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/braces/-/braces-2.3.0.tgz",
-      "integrity": "sha512-P4O8UQRdGiMLWSizsApmXVQDBS6KCt7dSexgLKBmH5Hr1CZq7vsnscFh8oR1sP1ab1Zj0uCHCEzZeV6SfUf3rA==",
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/braces/-/braces-2.3.1.tgz",
+      "integrity": "sha512-SO5lYHA3vO6gz66erVvedSCkp7AKWdv6VcQ2N4ysXfPxdAlxAMMAdwegGGcv1Bqwm7naF1hNdk5d6AAIEHV2nQ==",
       "requires": {
         "arr-flatten": "1.1.0",
         "array-unique": "0.3.2",
@@ -2750,11 +2777,30 @@
         "extend-shallow": "2.0.1",
         "fill-range": "4.0.0",
         "isobject": "3.0.1",
+        "kind-of": "6.0.2",
         "repeat-element": "1.1.2",
         "snapdragon": "0.8.1",
         "snapdragon-node": "2.1.1",
         "split-string": "3.1.0",
-        "to-regex": "3.0.1"
+        "to-regex": "3.0.2"
+      },
+      "dependencies": {
+        "define-property": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/define-property/-/define-property-1.0.0.tgz",
+          "integrity": "sha1-dp66rz9KY6rTr56NMEybvnm/sOY=",
+          "requires": {
+            "is-descriptor": "1.0.2"
+          }
+        },
+        "extend-shallow": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+          "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
+          "requires": {
+            "is-extendable": "0.1.1"
+          }
+        }
       }
     },
     "brcast": {
@@ -2856,8 +2902,8 @@
       "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.11.3.tgz",
       "integrity": "sha512-yWu5cXT7Av6mVwzWc8lMsJMHWn4xyjSuGYi4IozbVTLUOEYPSagUB8kiMDUHA1fS3zjr8nkxkn9jdvug4BBRmA==",
       "requires": {
-        "caniuse-lite": "1.0.30000808",
-        "electron-to-chromium": "1.3.33"
+        "caniuse-lite": "1.0.30000810",
+        "electron-to-chromium": "1.3.34"
       }
     },
     "bser": {
@@ -2873,7 +2919,7 @@
       "resolved": "https://registry.npmjs.org/buffer/-/buffer-4.9.1.tgz",
       "integrity": "sha1-bRu2AbB6TvztlwlBMgkwJ8lbwpg=",
       "requires": {
-        "base64-js": "1.2.1",
+        "base64-js": "1.2.3",
         "ieee754": "1.1.8",
         "isarray": "1.0.0"
       }
@@ -2937,23 +2983,30 @@
       "integrity": "sha1-0ygVQE1olpn4Wk6k+odV3ROpYEg="
     },
     "cacache": {
-      "version": "10.0.2",
-      "resolved": "https://registry.npmjs.org/cacache/-/cacache-10.0.2.tgz",
-      "integrity": "sha512-dljb7dk1jqO5ogE+dRpoR9tpHYv5xz9vPSNunh1+0wRuNdYxmzp9WmsyokgW/DUF1FDRVA/TMsmxt027R8djbQ==",
+      "version": "10.0.4",
+      "resolved": "https://registry.npmjs.org/cacache/-/cacache-10.0.4.tgz",
+      "integrity": "sha512-Dph0MzuH+rTQzGPNT9fAnrPmMmjKfST6trxJeK7NQuHRaVw24VzPRWTmg9MpcwOVQZO0E1FBICUlFeNaKPIfHA==",
       "requires": {
         "bluebird": "3.5.1",
         "chownr": "1.0.1",
         "glob": "7.1.2",
         "graceful-fs": "4.1.11",
         "lru-cache": "4.1.1",
-        "mississippi": "1.3.1",
+        "mississippi": "2.0.0",
         "mkdirp": "0.5.1",
         "move-concurrently": "1.0.1",
         "promise-inflight": "1.0.1",
         "rimraf": "2.6.2",
-        "ssri": "5.2.1",
+        "ssri": "5.2.4",
         "unique-filename": "1.1.0",
-        "y18n": "3.2.1"
+        "y18n": "4.0.0"
+      },
+      "dependencies": {
+        "y18n": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.0.tgz",
+          "integrity": "sha512-r9S/ZyXu/Xu9q1tYlpsLIsa3EeLXXk0VwlxqTcFRfg9EhMW+17kbt9G0NrgCmhGb5vT2hyhJZLfDGx+7+5Uj/w=="
+        }
       }
     },
     "cache-base": {
@@ -3013,7 +3066,7 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw=",
       "requires": {
         "browserslist": "1.7.7",
-        "caniuse-db": "1.0.30000808",
+        "caniuse-db": "1.0.30000810",
         "lodash.memoize": "4.1.2",
         "lodash.uniq": "4.5.0"
       },
@@ -3023,21 +3076,21 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000808",
-            "electron-to-chromium": "1.3.33"
+            "caniuse-db": "1.0.30000810",
+            "electron-to-chromium": "1.3.34"
           }
         }
       }
     },
     "caniuse-db": {
-      "version": "1.0.30000808",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000808.tgz",
-      "integrity": "sha1-MN/YMAnVcE8C3/s3clBo7RKjZrs="
+      "version": "1.0.30000810",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000810.tgz",
+      "integrity": "sha1-vSWDDEHvq2Qzmi44H0lnc0PIRQk="
     },
     "caniuse-lite": {
-      "version": "1.0.30000808",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000808.tgz",
-      "integrity": "sha512-vT0JLmHdvq1UVbYXioxCXHYdNw55tyvi+IUWyX0Zeh1OFQi2IllYtm38IJnSgHWCv/zUnX1hdhy3vMJvuTNSqw=="
+      "version": "1.0.30000810",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000810.tgz",
+      "integrity": "sha512-/0Q00Oie9C72P8zQHtFvzmkrMC3oOFUnMWjCy5F2+BE8lzICm91hQPhh0+XIsAFPKOe2Dh3pKgbRmU3EKxfldA=="
     },
     "case-sensitive-paths-webpack-plugin": {
       "version": "2.1.1",
@@ -3440,9 +3493,9 @@
       "integrity": "sha1-FopHAXVran9RoSzgyXv6KMCE7WM="
     },
     "combined-stream": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz",
-      "integrity": "sha1-k4NwpXtKUd6ix3wV1cX9+JUWQAk=",
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.6.tgz",
+      "integrity": "sha1-cj599ugBrFYTETp+RFqbactjKBg=",
       "requires": {
         "delayed-stream": "1.0.0"
       }
@@ -3481,21 +3534,21 @@
       "integrity": "sha1-E3kY1teCg/ffemt8WmPhQOaUJeY="
     },
     "compressible": {
-      "version": "2.0.12",
-      "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.12.tgz",
-      "integrity": "sha1-xZpcmdt2dn6YdlAOJx72OzSTvWY=",
+      "version": "2.0.13",
+      "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.13.tgz",
+      "integrity": "sha1-DRAgq5JLL9tNYnmHXH1tq6a6p6k=",
       "requires": {
-        "mime-db": "1.30.0"
+        "mime-db": "1.33.0"
       }
     },
     "compression": {
-      "version": "1.7.1",
-      "resolved": "https://registry.npmjs.org/compression/-/compression-1.7.1.tgz",
-      "integrity": "sha1-7/JgPvwuIs+G810uuTWJ+YdTc9s=",
+      "version": "1.7.2",
+      "resolved": "https://registry.npmjs.org/compression/-/compression-1.7.2.tgz",
+      "integrity": "sha1-qv+81qr4VLROuygDU9WtFlH1mmk=",
       "requires": {
         "accepts": "1.3.4",
         "bytes": "3.0.0",
-        "compressible": "2.0.12",
+        "compressible": "2.0.13",
         "debug": "2.6.9",
         "on-headers": "1.0.1",
         "safe-buffer": "5.1.1",
@@ -3524,7 +3577,7 @@
       "requires": {
         "dot-prop": "4.2.0",
         "graceful-fs": "4.1.11",
-        "make-dir": "1.1.0",
+        "make-dir": "1.2.0",
         "unique-string": "1.0.0",
         "write-file-atomic": "2.3.0",
         "xdg-basedir": "3.0.0"
@@ -3759,7 +3812,7 @@
           "resolved": "https://registry.npmjs.org/boom/-/boom-5.2.0.tgz",
           "integrity": "sha512-Z5BTk6ZRe4tXXQlkqftmsAUANpXmuwlsF5Oov8ThoMbQRzdGTA1ngYRW160GexgOgjsFOKJz0LYhoNi+2AMBUw==",
           "requires": {
-            "hoek": "4.2.0"
+            "hoek": "4.2.1"
           }
         }
       }
@@ -3779,7 +3832,7 @@
         "pbkdf2": "3.0.14",
         "public-encrypt": "4.0.0",
         "randombytes": "2.0.6",
-        "randomfill": "1.0.3"
+        "randomfill": "1.0.4"
       }
     },
     "crypto-random-string": {
@@ -3801,9 +3854,9 @@
       }
     },
     "css-loader": {
-      "version": "0.28.9",
-      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.9.tgz",
-      "integrity": "sha512-r3dgelMm/mkPz5Y7m9SeiGE46i2VsEU/OYbez+1llfxtv8b2y5/b5StaeEvPK3S5tlNQI+tDW/xDIhKJoZgDtw==",
+      "version": "0.28.10",
+      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.10.tgz",
+      "integrity": "sha512-X1IJteKnW9Llmrd+lJ0f7QZHh9Arf+11S7iRcoT2+riig3BK0QaCaOtubAulMK6Itbo08W6d3l8sW21r+Jhp5Q==",
       "requires": {
         "babel-code-frame": "6.26.0",
         "css-selector-tokenizer": "0.7.0",
@@ -4032,7 +4085,7 @@
           "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ=",
           "requires": {
             "browserslist": "1.7.7",
-            "caniuse-db": "1.0.30000808",
+            "caniuse-db": "1.0.30000810",
             "normalize-range": "0.1.2",
             "num2fraction": "1.2.2",
             "postcss": "5.2.18",
@@ -4044,8 +4097,8 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000808",
-            "electron-to-chromium": "1.3.33"
+            "caniuse-db": "1.0.30000810",
+            "electron-to-chromium": "1.3.34"
           }
         },
         "chalk": {
@@ -4145,7 +4198,7 @@
       "resolved": "https://registry.npmjs.org/d/-/d-1.0.0.tgz",
       "integrity": "sha1-dUu1v+VUUdpppYuU1F9MWwRi1Y8=",
       "requires": {
-        "es5-ext": "0.10.38"
+        "es5-ext": "0.10.39"
       }
     },
     "dashdash": {
@@ -4254,11 +4307,12 @@
       }
     },
     "define-property": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/define-property/-/define-property-1.0.0.tgz",
-      "integrity": "sha1-dp66rz9KY6rTr56NMEybvnm/sOY=",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/define-property/-/define-property-2.0.2.tgz",
+      "integrity": "sha512-jwK2UV4cnPpbcG7+VRARKTZPUWowwXA8bzH5NP6ud0oeAxyYPuGZUAC7hMugpCdz4BeSZl2Dl9k66CHJ/46ZYQ==",
       "requires": {
-        "is-descriptor": "1.0.2"
+        "is-descriptor": "1.0.2",
+        "isobject": "3.0.1"
       }
     },
     "defined": {
@@ -4448,16 +4502,16 @@
       }
     },
     "dotenv": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-4.0.0.tgz",
-      "integrity": "sha1-hk7xN5rO1Vzm+V3r7NzhefegzR0="
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-5.0.1.tgz",
+      "integrity": "sha512-4As8uPrjfwb7VXC+WnLCbXK7y+Ueb2B3zgNCePYfhxS1PYeaO1YTeplffTEcbfLhvFNGLAz90VvJs9yomG7bow=="
     },
     "dotenv-webpack": {
-      "version": "1.5.4",
-      "resolved": "https://registry.npmjs.org/dotenv-webpack/-/dotenv-webpack-1.5.4.tgz",
-      "integrity": "sha1-nJLkbkEqHPvGAhftM9adK7/dv58=",
+      "version": "1.5.5",
+      "resolved": "https://registry.npmjs.org/dotenv-webpack/-/dotenv-webpack-1.5.5.tgz",
+      "integrity": "sha1-NEEJTwTTBLYRnmtyUk5i+zJS9fI=",
       "requires": {
-        "dotenv": "4.0.0"
+        "dotenv": "5.0.1"
       }
     },
     "duplexer": {
@@ -4487,9 +4541,9 @@
       "integrity": "sha1-zIcsFoiArjxxiXYv1f/ACJbJUYo="
     },
     "electron-to-chromium": {
-      "version": "1.3.33",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.33.tgz",
-      "integrity": "sha1-vwBwPWKnxlI4E2V4w1LWxcBCpUU="
+      "version": "1.3.34",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.34.tgz",
+      "integrity": "sha1-2TSY9AORuwwWpgPYJBuZUUBBV+0="
     },
     "elliptic": {
       "version": "6.4.0",
@@ -4586,7 +4640,7 @@
         "lodash": "4.17.5",
         "object.assign": "4.1.0",
         "object.values": "1.0.4",
-        "prop-types": "15.6.0",
+        "prop-types": "15.6.1",
         "react-reconciler": "0.7.0",
         "react-test-renderer": "16.2.0"
       },
@@ -4605,7 +4659,7 @@
       "requires": {
         "lodash": "4.17.5",
         "object.assign": "4.1.0",
-        "prop-types": "15.6.0"
+        "prop-types": "15.6.1"
       },
       "dependencies": {
         "lodash": {
@@ -4616,9 +4670,9 @@
       }
     },
     "errno": {
-      "version": "0.1.6",
-      "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.6.tgz",
-      "integrity": "sha512-IsORQDpaaSwcDP4ZZnHxgE85werpo34VYn1Ud3mq+eUsF593faR8oCZNXrROVkpFu2TsbrNhHin0aUrTsQ9vNw==",
+      "version": "0.1.7",
+      "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.7.tgz",
+      "integrity": "sha512-MfrRBDWzIWifgq6tJj60gkAwtLNb6sQPlcFrSOflcP1aFmmruKQ2wRnze/8V6kgyz7H3FF8Npzv78mZ7XLLflg==",
       "requires": {
         "prr": "1.0.1"
       }
@@ -4654,9 +4708,9 @@
       }
     },
     "es5-ext": {
-      "version": "0.10.38",
-      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.38.tgz",
-      "integrity": "sha512-jCMyePo7AXbUESwbl8Qi01VSH2piY9s/a3rSU/5w/MlTIx8HPL1xn2InGN8ejt/xulcJgnTO7vqNtOAxzYd2Kg==",
+      "version": "0.10.39",
+      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.39.tgz",
+      "integrity": "sha512-AlaXZhPHl0po/uxMx1tyrlt1O86M6D5iVaDH8UgLfgek4kXTX6vzsRfJQWC2Ku+aG8pkw1XWzh9eTkwfVrsD5g==",
       "requires": {
         "es6-iterator": "2.0.3",
         "es6-symbol": "3.1.1"
@@ -4673,7 +4727,7 @@
       "integrity": "sha1-p96IkUGgWpSwhUQDstCg+/qY87c=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.38",
+        "es5-ext": "0.10.39",
         "es6-symbol": "3.1.1"
       }
     },
@@ -4683,7 +4737,7 @@
       "integrity": "sha1-kTbgUD3MBqMBaQ8LsU/042TpSfA=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.38",
+        "es5-ext": "0.10.39",
         "es6-iterator": "2.0.3",
         "es6-set": "0.1.5",
         "es6-symbol": "3.1.1",
@@ -4701,7 +4755,7 @@
       "integrity": "sha1-0rPsXU2ADO2BjbU40ol02wpzzLE=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.38",
+        "es5-ext": "0.10.39",
         "es6-iterator": "2.0.3",
         "es6-symbol": "3.1.1",
         "event-emitter": "0.3.5"
@@ -4718,7 +4772,7 @@
       "integrity": "sha1-vwDvT9q2uhtG7Le2KbTH7VcVzHc=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.38"
+        "es5-ext": "0.10.39"
       }
     },
     "es6-templates": {
@@ -4764,7 +4818,7 @@
       "integrity": "sha1-XjqzIlH/0VOKH45f+hNXdy+S2W8=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.38",
+        "es5-ext": "0.10.39",
         "es6-iterator": "2.0.3",
         "es6-symbol": "3.1.1"
       }
@@ -4780,14 +4834,15 @@
       "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ="
     },
     "escodegen": {
-      "version": "1.9.0",
-      "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-1.9.0.tgz",
-      "integrity": "sha512-v0MYvNQ32bzwoG2OSFzWAkuahDQHK92JBN0pTAALJ4RIxEZe766QJPDR8Hqy7XNUy5K3fnVL76OqYAdc4TZEIw==",
+      "version": "1.9.1",
+      "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-1.9.1.tgz",
+      "integrity": "sha512-6hTjO1NAWkHnDk3OqQ4YrCuwwmGHL9S3nPlzBOUG/R44rda3wLNrfvQ5fkSGjyhHFKM7ALPKcKGrwvCLe0lC7Q==",
       "requires": {
         "esprima": "3.1.3",
         "estraverse": "4.2.0",
         "esutils": "2.0.2",
-        "optionator": "0.8.2"
+        "optionator": "0.8.2",
+        "source-map": "0.6.1"
       },
       "dependencies": {
         "esprima": {
@@ -4804,7 +4859,7 @@
       "requires": {
         "es6-map": "0.1.5",
         "es6-weak-map": "2.0.2",
-        "esrecurse": "4.2.0",
+        "esrecurse": "4.2.1",
         "estraverse": "4.2.0"
       }
     },
@@ -4814,12 +4869,11 @@
       "integrity": "sha1-luO3DVd59q1JzQMmc9HDEnZ7pYE="
     },
     "esrecurse": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.2.0.tgz",
-      "integrity": "sha1-+pVo2Y04I/mkHZHpAtyrnqblsWM=",
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.2.1.tgz",
+      "integrity": "sha512-64RBB++fIOAXPw3P9cy89qfMlvZEXZkqqJkjqqXIvzP5ezRZjW+lPWjw35UX/3EhUPFYbg5ER4JYgDw4007/DQ==",
       "requires": {
-        "estraverse": "4.2.0",
-        "object-assign": "4.1.1"
+        "estraverse": "4.2.0"
       }
     },
     "estraverse": {
@@ -4843,7 +4897,7 @@
       "integrity": "sha1-34xp7vFkeSPHFXuc6DhAYQsCzDk=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.38"
+        "es5-ext": "0.10.39"
       }
     },
     "eventemitter3": {
@@ -4909,9 +4963,9 @@
         "define-property": "0.2.5",
         "extend-shallow": "2.0.1",
         "posix-character-classes": "0.1.1",
-        "regex-not": "1.0.0",
+        "regex-not": "1.0.2",
         "snapdragon": "0.8.1",
-        "to-regex": "3.0.1"
+        "to-regex": "3.0.2"
       },
       "dependencies": {
         "define-property": {
@@ -4922,6 +4976,14 @@
             "is-descriptor": "0.1.6"
           }
         },
+        "extend-shallow": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+          "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
+          "requires": {
+            "is-extendable": "0.1.1"
+          }
+        },
         "is-accessor-descriptor": {
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
@@ -5058,7 +5120,7 @@
         "on-finished": "2.3.0",
         "parseurl": "1.3.2",
         "path-to-regexp": "0.1.7",
-        "proxy-addr": "2.0.2",
+        "proxy-addr": "2.0.3",
         "qs": "6.5.1",
         "range-parser": "1.2.0",
         "safe-buffer": "5.1.1",
@@ -5066,7 +5128,7 @@
         "serve-static": "1.13.1",
         "setprototypeof": "1.1.0",
         "statuses": "1.3.1",
-        "type-is": "1.6.15",
+        "type-is": "1.6.16",
         "utils-merge": "1.0.1",
         "vary": "1.1.2"
       }
@@ -5077,11 +5139,22 @@
       "integrity": "sha1-p1Xqe8Gt/MWjHOfnYtuq3F5jZEQ="
     },
     "extend-shallow": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
-      "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-3.0.2.tgz",
+      "integrity": "sha1-Jqcarwc7OfshJxcnRhMcJwQCjbg=",
       "requires": {
-        "is-extendable": "0.1.1"
+        "assign-symbols": "1.0.0",
+        "is-extendable": "1.0.1"
+      },
+      "dependencies": {
+        "is-extendable": {
+          "version": "1.0.1",
+          "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-1.0.1.tgz",
+          "integrity": "sha512-arnXMxT1hhoKo9k1LZdmlNyJdDDfy2v0fXjFlmok4+i8ul/6WlbVge9bhM74OpNPQPMGUToDtz+KXa1PneJxOA==",
+          "requires": {
+            "is-plain-object": "2.0.4"
+          }
+        }
       }
     },
     "external-editor": {
@@ -5104,9 +5177,27 @@
         "expand-brackets": "2.1.4",
         "extend-shallow": "2.0.1",
         "fragment-cache": "0.2.1",
-        "regex-not": "1.0.0",
+        "regex-not": "1.0.2",
         "snapdragon": "0.8.1",
-        "to-regex": "3.0.1"
+        "to-regex": "3.0.2"
+      },
+      "dependencies": {
+        "define-property": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/define-property/-/define-property-1.0.0.tgz",
+          "integrity": "sha1-dp66rz9KY6rTr56NMEybvnm/sOY=",
+          "requires": {
+            "is-descriptor": "1.0.2"
+          }
+        },
+        "extend-shallow": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+          "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
+          "requires": {
+            "is-extendable": "0.1.1"
+          }
+        }
       }
     },
     "extsprintf": {
@@ -5115,9 +5206,9 @@
       "integrity": "sha1-lpGEQOMEGnpBT4xS48V06zw+HgU="
     },
     "fast-deep-equal": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-1.0.0.tgz",
-      "integrity": "sha1-liVqO8l1WV6zbYLpkp0GDYk0Of8="
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-1.1.0.tgz",
+      "integrity": "sha1-wFNHeBfIa1HaqFPIHgWbcz0CNhQ="
     },
     "fast-json-stable-stringify": {
       "version": "2.0.0",
@@ -5220,6 +5311,16 @@
         "is-number": "3.0.0",
         "repeat-string": "1.6.1",
         "to-regex-range": "2.1.1"
+      },
+      "dependencies": {
+        "extend-shallow": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+          "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
+          "requires": {
+            "is-extendable": "0.1.1"
+          }
+        }
       }
     },
     "finalhandler": {
@@ -5242,7 +5343,7 @@
       "integrity": "sha1-kojj6ePMN0hxfTnq3hfPcfww7m8=",
       "requires": {
         "commondir": "1.0.1",
-        "make-dir": "1.1.0",
+        "make-dir": "1.2.0",
         "pkg-dir": "2.0.0"
       }
     },
@@ -5334,13 +5435,13 @@
       "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE="
     },
     "form-data": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.3.1.tgz",
-      "integrity": "sha1-b7lPvXGIUwbXPRXMSX/kzE7NRL8=",
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.3.2.tgz",
+      "integrity": "sha1-SXBJi+YEwgwAXU9cI67NIda0kJk=",
       "requires": {
         "asynckit": "0.4.0",
-        "combined-stream": "1.0.5",
-        "mime-types": "2.1.17"
+        "combined-stream": "1.0.6",
+        "mime-types": "2.1.18"
       }
     },
     "forwarded": {
@@ -5556,7 +5657,7 @@
           "integrity": "sha1-NLkLqyqRGqNHVx2pDyK9NuzYqRk=",
           "requires": {
             "debug": "2.6.9",
-            "stream-consume": "0.1.0"
+            "stream-consume": "0.1.1"
           }
         }
       }
@@ -5595,14 +5696,14 @@
         "fbjs": "0.8.16",
         "inline-style-prefixer": "3.0.8",
         "object-assign": "4.1.1",
-        "prop-types": "15.6.0",
+        "prop-types": "15.6.1",
         "through": "2.3.8"
       }
     },
     "glamorous": {
-      "version": "4.11.4",
-      "resolved": "https://registry.npmjs.org/glamorous/-/glamorous-4.11.4.tgz",
-      "integrity": "sha512-H7e28mVL8IUGMD3yL6W3A/wtdZ7gM69xV6VMRe3ciI+5SgZxENiKDW49Tv14IhKeFVlUrBmhyAgzzUMMw4H0Cw==",
+      "version": "4.11.6",
+      "resolved": "https://registry.npmjs.org/glamorous/-/glamorous-4.11.6.tgz",
+      "integrity": "sha512-fR9jTVipC3Vb4Jps4aQFjxEuGPexo/J74ZUZIA8ZpgENljGUL+9SdKk0Ut1iZc23tLLtbi6wRmAqQG3thwzjAw==",
       "requires": {
         "brcast": "3.0.1",
         "fast-memoize": "2.3.0",
@@ -5865,7 +5966,7 @@
       "requires": {
         "boom": "4.3.1",
         "cryptiles": "3.1.2",
-        "hoek": "4.2.0",
+        "hoek": "4.2.1",
         "sntp": "2.1.0"
       }
     },
@@ -5890,9 +5991,9 @@
       }
     },
     "hoek": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/hoek/-/hoek-4.2.0.tgz",
-      "integrity": "sha512-v0XCLxICi9nPfYrS9RL8HbYnXi9obYAeLbSP00BmnZwCK9+Ih9WOjoZ8YoHCoav2csqn4FOz4Orldsy2dmDwmQ=="
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/hoek/-/hoek-4.2.1.tgz",
+      "integrity": "sha512-QLg82fGkfnJ/4iy1xZ81/9SIJiq1NGFUMGs6ParyjBZr6jW2Ufj/snDqTHixNlHdPNwN2RLVD0Pi3igeK9+JfA=="
     },
     "hoist-non-react-statics": {
       "version": "1.2.0",
@@ -5971,13 +6072,13 @@
         "ncname": "1.0.0",
         "param-case": "2.1.1",
         "relateurl": "0.2.7",
-        "uglify-js": "3.3.10"
+        "uglify-js": "3.3.12"
       },
       "dependencies": {
         "uglify-js": {
-          "version": "3.3.10",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.3.10.tgz",
-          "integrity": "sha512-dNib7aUDNZFJNTXFyq0CDmLRVOsnY1F+IQgt2FAOdZFx2+LvKVLbbIb/fL+BYKCv3YH3bPCE/6M/JaxChtQLHQ==",
+          "version": "3.3.12",
+          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.3.12.tgz",
+          "integrity": "sha512-4jxrTXlV0HaXTsNILfXW0eey7Qo8qHYM6ih5ZNh45erDWU2GHmKDmekwBTskDb12h+kdd2DBvdzqVb47YzNmTA==",
           "requires": {
             "commander": "2.14.1",
             "source-map": "0.6.1"
@@ -6241,7 +6342,7 @@
       "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-2.1.0.tgz",
       "integrity": "sha1-g/Cg7DeL8yRheLbCrZE28TWxyWI=",
       "requires": {
-        "postcss": "6.0.17"
+        "postcss": "6.0.19"
       }
     },
     "ieee754": {
@@ -6255,11 +6356,11 @@
       "integrity": "sha1-xg7taebY/bazEEofy8ocGS3FtQE="
     },
     "immutability-helper": {
-      "version": "2.6.4",
-      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.6.4.tgz",
-      "integrity": "sha512-jhFwZoBOOzfxKXGO86G0zrD0dHEUgAfFhDMOBRizonX2nUtWAG8vepjTVJkmJDoKV6XtPlm/21gNXcToBe0D/A==",
+      "version": "2.6.5",
+      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.6.5.tgz",
+      "integrity": "sha512-nRj5RN2em1O3NK25Zz0eBszg+kQ3mR5WgZp3wRajbyeu/Ii/eXhpwjB8JG4Hd78JUnuFVXSchWF5EZBI6F+vEA==",
       "requires": {
-        "invariant": "2.2.2"
+        "invariant": "2.2.3"
       }
     },
     "immutable": {
@@ -6385,9 +6486,9 @@
       "integrity": "sha1-ftGxQQxqDg94z5XTuEQMY/eLhhQ="
     },
     "invariant": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.2.tgz",
-      "integrity": "sha1-nh9WrArNtr8wMwbzOL47IErmA2A=",
+      "version": "2.2.3",
+      "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.3.tgz",
+      "integrity": "sha512-7Z5PPegwDTyjbaeCnV0efcyS6vdKAU51kpEmS7QFib3P4822l8ICYyMn7qvJnc+WzLoDsuI9gPMKbJ8pCu8XtA==",
       "requires": {
         "loose-envify": "1.3.1"
       }
@@ -6403,9 +6504,9 @@
       "integrity": "sha1-vd7XARQpCCjAoDnnLvJfWq7ENUo="
     },
     "ipaddr.js": {
-      "version": "1.5.2",
-      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.5.2.tgz",
-      "integrity": "sha1-1LUFvemUaYfM8PxY2QEP+WB+P6A="
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.6.0.tgz",
+      "integrity": "sha1-4/o1e3c9phnybpXwSdBVxyeW+Gs="
     },
     "is-absolute-url": {
       "version": "2.1.0",
@@ -6546,13 +6647,19 @@
         "is-extglob": "1.0.0"
       }
     },
+    "is-my-ip-valid": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-my-ip-valid/-/is-my-ip-valid-1.0.0.tgz",
+      "integrity": "sha512-gmh/eWXROncUzRnIa1Ubrt5b8ep/MGSnfAUI3aRp+sqTCs1tv1Isl8d8F6JmkN3dXKc3ehZMrtiPN9eL03NuaQ=="
+    },
     "is-my-json-valid": {
-      "version": "2.17.1",
-      "resolved": "https://registry.npmjs.org/is-my-json-valid/-/is-my-json-valid-2.17.1.tgz",
-      "integrity": "sha512-Q2khNw+oBlWuaYvEEHtKSw/pCxD2L5Rc1C+UQme9X6JdRDh7m5D7HkozA0qa3DUkQ6VzCnEm8mVIQPyIRkI5sQ==",
+      "version": "2.17.2",
+      "resolved": "https://registry.npmjs.org/is-my-json-valid/-/is-my-json-valid-2.17.2.tgz",
+      "integrity": "sha512-IBhBslgngMQN8DDSppmgDv7RNrlFotuuDsKcrCP3+HbFaVivIBU7u9oiiErw8sH4ynx3+gOGQ3q2otkgiSi6kg==",
       "requires": {
         "generate-function": "2.0.0",
         "generate-object-property": "1.2.0",
+        "is-my-ip-valid": "1.0.0",
         "jsonpointer": "4.0.1",
         "xtend": "4.0.1"
       }
@@ -6586,11 +6693,18 @@
       "integrity": "sha1-PkcprB9f3gJc19g6iW2rn09n2w8="
     },
     "is-odd": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-odd/-/is-odd-1.0.0.tgz",
-      "integrity": "sha1-O4qTLrAos3dcObsJ6RdnrM22kIg=",
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/is-odd/-/is-odd-2.0.0.tgz",
+      "integrity": "sha512-OTiixgpZAT1M4NHgS5IguFp/Vz2VI3U7Goh4/HA1adtwyLtSBrxYlcSYkhpAE07s4fKEcjrFxyvtQBND4vFQyQ==",
       "requires": {
-        "is-number": "3.0.0"
+        "is-number": "4.0.0"
+      },
+      "dependencies": {
+        "is-number": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/is-number/-/is-number-4.0.0.tgz",
+          "integrity": "sha512-rSklcAIlf1OmFdyAqbnWTLVelsQ58uvZ66S/ZyawjWqIviTWCjg2PzVGw8WUA+nNuPTqb4wgA+NszrJ+08LlgQ=="
+        }
       }
     },
     "is-path-cwd": {
@@ -6693,6 +6807,11 @@
       "resolved": "https://registry.npmjs.org/is-utf8/-/is-utf8-0.2.1.tgz",
       "integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI="
     },
+    "is-windows": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-1.0.2.tgz",
+      "integrity": "sha512-eXK1UInq2bPmjyX6e3VHIzMLobc4J94i4AWn+Hpq3OU5KkrRC96OAcR3PRJ/pGu6m8TRnBHP9dkXQVsT/COVIA=="
+    },
     "is-wsl": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-1.1.0.tgz",
@@ -6733,27 +6852,27 @@
       "integrity": "sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo="
     },
     "istanbul-api": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/istanbul-api/-/istanbul-api-1.2.1.tgz",
-      "integrity": "sha512-oFCwXvd65amgaPCzqrR+a2XjanS1MvpXN6l/MlMUTv6uiA1NOgGX+I0uyq8Lg3GDxsxPsaP1049krz3hIJ5+KA==",
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/istanbul-api/-/istanbul-api-1.2.2.tgz",
+      "integrity": "sha512-kH5YRdqdbs5hiH4/Rr1Q0cSAGgjh3jTtg8vu9NLebBAoK3adVO4jk81J+TYOkTr2+Q4NLeb1ACvmEt65iG/Vbw==",
       "requires": {
         "async": "2.6.0",
         "fileset": "2.0.3",
-        "istanbul-lib-coverage": "1.1.1",
+        "istanbul-lib-coverage": "1.1.2",
         "istanbul-lib-hook": "1.1.0",
-        "istanbul-lib-instrument": "1.9.1",
-        "istanbul-lib-report": "1.1.2",
-        "istanbul-lib-source-maps": "1.2.2",
-        "istanbul-reports": "1.1.3",
+        "istanbul-lib-instrument": "1.9.2",
+        "istanbul-lib-report": "1.1.3",
+        "istanbul-lib-source-maps": "1.2.3",
+        "istanbul-reports": "1.1.4",
         "js-yaml": "3.7.0",
         "mkdirp": "0.5.1",
         "once": "1.4.0"
       }
     },
     "istanbul-lib-coverage": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-1.1.1.tgz",
-      "integrity": "sha512-0+1vDkmzxqJIn5rcoEqapSB4DmPxE31EtI2dF2aCkV5esN9EWHxZ0dwgDClivMXJqE7zaYQxq30hj5L0nlTN5Q=="
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-1.1.2.tgz",
+      "integrity": "sha512-tZYA0v5A7qBSsOzcebJJ/z3lk3oSzH62puG78DbBA1+zupipX2CakDyiPV3pOb8He+jBwVimuwB0dTnh38hX0w=="
     },
     "istanbul-lib-hook": {
       "version": "1.1.0",
@@ -6764,25 +6883,25 @@
       }
     },
     "istanbul-lib-instrument": {
-      "version": "1.9.1",
-      "resolved": "https://registry.npmjs.org/istanbul-lib-instrument/-/istanbul-lib-instrument-1.9.1.tgz",
-      "integrity": "sha512-RQmXeQ7sphar7k7O1wTNzVczF9igKpaeGQAG9qR2L+BS4DCJNTI9nytRmIVYevwO0bbq+2CXvJmYDuz0gMrywA==",
+      "version": "1.9.2",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-instrument/-/istanbul-lib-instrument-1.9.2.tgz",
+      "integrity": "sha512-nz8t4HQ2206a/3AXi+NHFWEa844DMpPsgbcUteJbt1j8LX1xg56H9rOMnhvcvVvPbW60qAIyrSk44H8ZDqaSSA==",
       "requires": {
         "babel-generator": "6.26.1",
         "babel-template": "6.26.0",
         "babel-traverse": "6.26.0",
         "babel-types": "6.26.0",
         "babylon": "6.18.0",
-        "istanbul-lib-coverage": "1.1.1",
+        "istanbul-lib-coverage": "1.1.2",
         "semver": "5.5.0"
       }
     },
     "istanbul-lib-report": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/istanbul-lib-report/-/istanbul-lib-report-1.1.2.tgz",
-      "integrity": "sha512-UTv4VGx+HZivJQwAo1wnRwe1KTvFpfi/NYwN7DcsrdzMXwpRT/Yb6r4SBPoHWj4VuQPakR32g4PUUeyKkdDkBA==",
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-report/-/istanbul-lib-report-1.1.3.tgz",
+      "integrity": "sha512-D4jVbMDtT2dPmloPJS/rmeP626N5Pr3Rp+SovrPn1+zPChGHcggd/0sL29jnbm4oK9W0wHjCRsdch9oLd7cm6g==",
       "requires": {
-        "istanbul-lib-coverage": "1.1.1",
+        "istanbul-lib-coverage": "1.1.2",
         "mkdirp": "0.5.1",
         "path-parse": "1.0.5",
         "supports-color": "3.2.3"
@@ -6804,12 +6923,12 @@
       }
     },
     "istanbul-lib-source-maps": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/istanbul-lib-source-maps/-/istanbul-lib-source-maps-1.2.2.tgz",
-      "integrity": "sha512-8BfdqSfEdtip7/wo1RnrvLpHVEd8zMZEDmOFEnpC6dg0vXflHt9nvoAyQUzig2uMSXfF2OBEYBV3CVjIL9JvaQ==",
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-source-maps/-/istanbul-lib-source-maps-1.2.3.tgz",
+      "integrity": "sha512-fDa0hwU/5sDXwAklXgAoCJCOsFsBplVQ6WBldz5UwaqOzmDhUK4nfuR7/G//G2lERlblUNJB8P6e8cXq3a7MlA==",
       "requires": {
         "debug": "3.1.0",
-        "istanbul-lib-coverage": "1.1.1",
+        "istanbul-lib-coverage": "1.1.2",
         "mkdirp": "0.5.1",
         "rimraf": "2.6.2",
         "source-map": "0.5.7"
@@ -6831,9 +6950,9 @@
       }
     },
     "istanbul-reports": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/istanbul-reports/-/istanbul-reports-1.1.3.tgz",
-      "integrity": "sha512-ZEelkHh8hrZNI5xDaKwPMFwDsUf5wIEI2bXAFGp1e6deR2mnEKBPhLJEgr4ZBt8Gi6Mj38E/C8kcy9XLggVO2Q==",
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/istanbul-reports/-/istanbul-reports-1.1.4.tgz",
+      "integrity": "sha512-DfSTVOTkuO+kRmbO8Gk650Wqm1WRGr6lrdi2EwDK1vxpS71vdlLd613EpzOKdIFioB5f/scJTjeWBnvd1FWejg==",
       "requires": {
         "handlebars": "4.0.11"
       }
@@ -6910,10 +7029,10 @@
             "glob": "7.1.2",
             "graceful-fs": "4.1.11",
             "is-ci": "1.1.0",
-            "istanbul-api": "1.2.1",
-            "istanbul-lib-coverage": "1.1.1",
-            "istanbul-lib-instrument": "1.9.1",
-            "istanbul-lib-source-maps": "1.2.2",
+            "istanbul-api": "1.2.2",
+            "istanbul-lib-coverage": "1.1.2",
+            "istanbul-lib-instrument": "1.9.2",
+            "istanbul-lib-source-maps": "1.2.3",
             "jest-changed-files": "21.2.0",
             "jest-config": "21.2.1",
             "jest-environment-jsdom": "21.2.1",
@@ -6932,7 +7051,7 @@
             "string-length": "2.0.0",
             "strip-ansi": "4.0.0",
             "which": "1.3.0",
-            "worker-farm": "1.5.2",
+            "worker-farm": "1.5.4",
             "yargs": "9.0.1"
           }
         },
@@ -7070,7 +7189,7 @@
         "jest-docblock": "21.2.0",
         "micromatch": "2.3.11",
         "sane": "2.4.1",
-        "worker-farm": "1.5.2"
+        "worker-farm": "1.5.4"
       },
       "dependencies": {
         "arr-diff": {
@@ -7288,7 +7407,7 @@
         "jest-util": "21.2.1",
         "pify": "3.0.0",
         "throat": "4.1.0",
-        "worker-farm": "1.5.2"
+        "worker-farm": "1.5.4"
       }
     },
     "jest-runtime": {
@@ -7452,7 +7571,7 @@
       "resolved": "https://registry.npmjs.org/joi/-/joi-9.2.0.tgz",
       "integrity": "sha1-M4WseQGSEwy+Iw6ALsAskhW7/to=",
       "requires": {
-        "hoek": "4.2.0",
+        "hoek": "4.2.1",
         "isemail": "2.2.1",
         "items": "2.1.1",
         "moment": "2.20.1",
@@ -7474,7 +7593,7 @@
       "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.7.0.tgz",
       "integrity": "sha1-XJZ93YN6m/3KXy3oQlOr6KHAO4A=",
       "requires": {
-        "argparse": "1.0.9",
+        "argparse": "1.0.10",
         "esprima": "2.7.3"
       }
     },
@@ -7490,14 +7609,14 @@
         "content-type-parser": "1.0.2",
         "cssom": "0.3.2",
         "cssstyle": "0.2.37",
-        "escodegen": "1.9.0",
+        "escodegen": "1.9.1",
         "html-encoding-sniffer": "1.0.2",
         "nwmatcher": "1.4.3",
         "parse5": "1.5.1",
         "request": "2.83.0",
         "sax": "1.2.4",
         "symbol-tree": "3.2.2",
-        "tough-cookie": "2.3.3",
+        "tough-cookie": "2.3.4",
         "webidl-conversions": "4.0.2",
         "whatwg-encoding": "1.0.3",
         "whatwg-url": "4.8.0",
@@ -7877,17 +7996,17 @@
       "integrity": "sha1-WQTcU3w57G2+/q6QIycTX6hRHxI="
     },
     "make-dir": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-1.1.0.tgz",
-      "integrity": "sha512-0Pkui4wLJ7rxvmfUvs87skoEaxmu0hCUApF8nonzpl7q//FWp9zu8W61Scz4sd/kUiqDxvUhtoam2efDyiBzcA==",
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-1.2.0.tgz",
+      "integrity": "sha512-aNUAa4UMg/UougV25bbrU4ZaaKNjJ/3/xnvg/twpmKROPdKZPZ9wGgI0opdZzO8q/zUFawoUuixuOv33eZ61Iw==",
       "requires": {
         "pify": "3.0.0"
       }
     },
     "make-error": {
-      "version": "1.3.3",
-      "resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.3.tgz",
-      "integrity": "sha512-j3dZCri3cCd23wgPqK/0/KvTN8R+W6fXDqQe8BNLbTpONjbA8SPaRr+q0BQq9bx3Q/+g68/gDIh9FW3by702Tg=="
+      "version": "1.3.4",
+      "resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.4.tgz",
+      "integrity": "sha512-0Dab5btKVPhibSalc9QGXb559ED7G7iLjFXBaj9Wq8O3vorueR5K5jaE3hkG6ZQINyhA/JgG6Qk4qdFQjsYV6g=="
     },
     "makeerror": {
       "version": "1.0.11",
@@ -7921,13 +8040,13 @@
       "integrity": "sha512-v/ej7DflZbb6t//3Yu9vg0T+sun+Q9EoqggifeyABKfvFROqPwwwpv+hd1NKT2QxTRg6VCFk10IIJcMI13yCoQ==",
       "requires": {
         "loader-utils": "1.1.0",
-        "marked": "0.3.12"
+        "marked": "0.3.17"
       }
     },
     "marked": {
-      "version": "0.3.12",
-      "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.12.tgz",
-      "integrity": "sha512-k4NaW+vS7ytQn6MgJn3fYpQt20/mOgYM5Ft9BYMfQJDz2QT6yEeS9XJ8k2Nw8JTeWK/znPPW2n3UJGzyYEiMoA=="
+      "version": "0.3.17",
+      "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.17.tgz",
+      "integrity": "sha512-+AKbNsjZl6jFfLPwHhWmGTqE009wTKn3RTmn9K8oUKHrX/abPJjtcRtXpYB/FFrwPJRUA86LX/de3T0knkPCmQ=="
     },
     "math-expression-evaluator": {
       "version": "1.2.17",
@@ -7972,7 +8091,7 @@
       "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.4.1.tgz",
       "integrity": "sha1-OpoguEYlI+RHz7x+i7gO1me/xVI=",
       "requires": {
-        "errno": "0.1.6",
+        "errno": "0.1.7",
         "readable-stream": "2.3.4"
       }
     },
@@ -8087,23 +8206,23 @@
       "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4="
     },
     "micromatch": {
-      "version": "3.1.5",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-3.1.5.tgz",
-      "integrity": "sha512-ykttrLPQrz1PUJcXjwsTUjGoPJ64StIGNE2lGVD1c9CuguJ+L7/navsE8IcDNndOoCMvYV0qc/exfVbMHkUhvA==",
+      "version": "3.1.9",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-3.1.9.tgz",
+      "integrity": "sha512-SlIz6sv5UPaAVVFRKodKjCg48EbNoIhgetzfK/Cy0v5U52Z6zB136M8tp0UC9jM53LYbmIRihJszvvqpKkfm9g==",
       "requires": {
         "arr-diff": "4.0.0",
         "array-unique": "0.3.2",
-        "braces": "2.3.0",
-        "define-property": "1.0.0",
-        "extend-shallow": "2.0.1",
+        "braces": "2.3.1",
+        "define-property": "2.0.2",
+        "extend-shallow": "3.0.2",
         "extglob": "2.0.4",
         "fragment-cache": "0.2.1",
         "kind-of": "6.0.2",
-        "nanomatch": "1.2.7",
+        "nanomatch": "1.2.9",
         "object.pick": "1.3.0",
-        "regex-not": "1.0.0",
+        "regex-not": "1.0.2",
         "snapdragon": "0.8.1",
-        "to-regex": "3.0.1"
+        "to-regex": "3.0.2"
       }
     },
     "miller-rabin": {
@@ -8121,16 +8240,16 @@
       "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg=="
     },
     "mime-db": {
-      "version": "1.30.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.30.0.tgz",
-      "integrity": "sha1-dMZD2i3Z1qRTmZY0ZbJtXKfXHwE="
+      "version": "1.33.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.33.0.tgz",
+      "integrity": "sha512-BHJ/EKruNIqJf/QahvxwQZXKygOQ256myeN/Ew+THcAa5q+PjyTTMMeNQC4DZw5AwfvelsUrA6B67NKMqXDbzQ=="
     },
     "mime-types": {
-      "version": "2.1.17",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.17.tgz",
-      "integrity": "sha1-Cdejk/A+mVp5+K+Fe3Cp4KsWVXo=",
+      "version": "2.1.18",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.18.tgz",
+      "integrity": "sha512-lc/aahn+t4/SWV/qcmumYjymLsWfN3ELhpmVuUFjgsORruuZPVSwAQryq+HHGvO/SI2KVX26bx+En+zhM8g8hQ==",
       "requires": {
-        "mime-db": "1.30.0"
+        "mime-db": "1.33.0"
       }
     },
     "mimic-fn": {
@@ -8170,9 +8289,9 @@
       "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0="
     },
     "mississippi": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/mississippi/-/mississippi-1.3.1.tgz",
-      "integrity": "sha512-/6rB8YXFbAtsUVRphIRQqB0+9c7VaPHCjVtvto+JqwVxgz8Zz+I+f68/JgQ+Pb4VlZb2svA9OtdXnHHsZz7ltg==",
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/mississippi/-/mississippi-2.0.0.tgz",
+      "integrity": "sha512-zHo8v+otD1J10j/tC+VNoGK9keCuByhKovAvdn74dmxJl9+mWHnx6EMsDN4lgRoMI/eYo2nchAxniIbUPb5onw==",
       "requires": {
         "concat-stream": "1.6.0",
         "duplexify": "3.5.3",
@@ -8180,7 +8299,7 @@
         "flush-write-stream": "1.0.2",
         "from2": "2.3.0",
         "parallel-transform": "1.1.0",
-        "pump": "1.0.3",
+        "pump": "2.0.1",
         "pumpify": "1.4.0",
         "stream-each": "1.2.2",
         "through2": "2.0.3"
@@ -8350,33 +8469,27 @@
       "integrity": "sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s="
     },
     "nan": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/nan/-/nan-2.8.0.tgz",
-      "integrity": "sha1-7XFfP+neArV6XmJS2QqWZ14fCFo="
+      "version": "2.9.2",
+      "resolved": "https://registry.npmjs.org/nan/-/nan-2.9.2.tgz",
+      "integrity": "sha512-ltW65co7f3PQWBDbqVvaU1WtFJUsNW7sWWm4HINhbMQIyVyzIeyZ8toX5TC5eeooE6piZoaEh4cZkueSKG3KYw=="
     },
     "nanomatch": {
-      "version": "1.2.7",
-      "resolved": "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.7.tgz",
-      "integrity": "sha512-/5ldsnyurvEw7wNpxLFgjVvBLMta43niEYOy0CJ4ntcYSbx6bugRUTQeFb4BR/WanEL1o3aQgHuVLHQaB6tOqg==",
+      "version": "1.2.9",
+      "resolved": "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.9.tgz",
+      "integrity": "sha512-n8R9bS8yQ6eSXaV6jHUpKzD8gLsin02w1HSFiegwrs9E098Ylhw5jdyKPaYqvHknHaSCKTPp7C8dGCQ0q9koXA==",
       "requires": {
         "arr-diff": "4.0.0",
         "array-unique": "0.3.2",
-        "define-property": "1.0.0",
-        "extend-shallow": "2.0.1",
+        "define-property": "2.0.2",
+        "extend-shallow": "3.0.2",
         "fragment-cache": "0.2.1",
-        "is-odd": "1.0.0",
-        "kind-of": "5.1.0",
+        "is-odd": "2.0.0",
+        "is-windows": "1.0.2",
+        "kind-of": "6.0.2",
         "object.pick": "1.3.0",
-        "regex-not": "1.0.0",
+        "regex-not": "1.0.2",
         "snapdragon": "0.8.1",
-        "to-regex": "3.0.1"
-      },
-      "dependencies": {
-        "kind-of": {
-          "version": "5.1.0",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
-          "integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw=="
-        }
+        "to-regex": "3.0.2"
       }
     },
     "natural-compare": {
@@ -8408,6 +8521,11 @@
       "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.1.tgz",
       "integrity": "sha1-KzJxhOiZIQEXeyhWP7XnECrNDKk="
     },
+    "neo-async": {
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/neo-async/-/neo-async-2.5.0.tgz",
+      "integrity": "sha512-nJmSswG4As/MkRq7QZFuH/sf/yuv8ODdMZrY4Bedjp77a5MK4A6s7YbBB64c9u79EBUOfXUXBvArmvzTD0X+6g=="
+    },
     "netrc": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/netrc/-/netrc-0.1.4.tgz",
@@ -8427,9 +8545,9 @@
       }
     },
     "nise": {
-      "version": "1.2.5",
-      "resolved": "https://registry.npmjs.org/nise/-/nise-1.2.5.tgz",
-      "integrity": "sha512-Es4hGuq3lpip5PckrB+Qpuma282M0UJANJ+jxAgI+0wWTL9X6MtNv+M385JgqsAE8hv6NvD3lv8CQtXgEnvlpQ==",
+      "version": "1.2.7",
+      "resolved": "https://registry.npmjs.org/nise/-/nise-1.2.7.tgz",
+      "integrity": "sha512-8LqP1pFLB1v5QU8KlT2WqWzhMRJ3o9LwnZHz+VCbVB8rTsRTFCjtOYv/BatcmLOWp21NedTrErVGinfxe6XYtA==",
       "requires": {
         "@sinonjs/formatio": "2.0.0",
         "just-extend": "1.1.27",
@@ -8495,7 +8613,7 @@
         "mkdirp": "0.5.1",
         "nopt": "3.0.6",
         "npmlog": "4.1.2",
-        "osenv": "0.1.4",
+        "osenv": "0.1.5",
         "request": "2.83.0",
         "rimraf": "2.6.2",
         "semver": "5.3.0",
@@ -8573,7 +8691,7 @@
         "lodash.mergewith": "4.6.1",
         "meow": "3.7.0",
         "mkdirp": "0.5.1",
-        "nan": "2.8.0",
+        "nan": "2.9.2",
         "node-gyp": "3.6.2",
         "npmlog": "4.1.2",
         "request": "2.79.0",
@@ -8645,8 +8763,8 @@
           "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE=",
           "requires": {
             "asynckit": "0.4.0",
-            "combined-stream": "1.0.5",
-            "mime-types": "2.1.17"
+            "combined-stream": "1.0.6",
+            "mime-types": "2.1.18"
           }
         },
         "har-validator": {
@@ -8656,7 +8774,7 @@
           "requires": {
             "chalk": "1.1.3",
             "commander": "2.14.1",
-            "is-my-json-valid": "2.17.1",
+            "is-my-json-valid": "2.17.2",
             "pinkie-promise": "2.0.1"
           }
         },
@@ -8699,7 +8817,7 @@
             "aws-sign2": "0.6.0",
             "aws4": "1.6.0",
             "caseless": "0.11.0",
-            "combined-stream": "1.0.5",
+            "combined-stream": "1.0.6",
             "extend": "3.0.1",
             "forever-agent": "0.6.1",
             "form-data": "2.1.4",
@@ -8709,11 +8827,11 @@
             "is-typedarray": "1.0.0",
             "isstream": "0.1.2",
             "json-stringify-safe": "5.0.1",
-            "mime-types": "2.1.17",
+            "mime-types": "2.1.18",
             "oauth-sign": "0.8.2",
             "qs": "6.3.2",
             "stringstream": "0.0.5",
-            "tough-cookie": "2.3.3",
+            "tough-cookie": "2.3.4",
             "tunnel-agent": "0.4.3",
             "uuid": "3.2.1"
           }
@@ -8770,7 +8888,7 @@
         "hosted-git-info": "2.5.0",
         "is-builtin-module": "1.0.0",
         "semver": "5.5.0",
-        "validate-npm-package-license": "3.0.1"
+        "validate-npm-package-license": "3.0.3"
       }
     },
     "normalize-path": {
@@ -9003,16 +9121,16 @@
       "integrity": "sha1-z1dU/7D63H0ewKVoxnNxxw8ranE="
     },
     "office-ui-fabric-react": {
-      "version": "5.49.2",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.49.2.tgz",
-      "integrity": "sha512-A9M0viSXkJu4VRcoRrpWEN81Bz9p2QSjEEM1L9HhZLla0qnGcajOsePvMHuJIiCsf53zfpCHE/LAOvl32GqAVw==",
+      "version": "5.56.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.56.0.tgz",
+      "integrity": "sha512-sTVFSjqeUDQVGSekeTdSfyn/2BZNGqK0TfHDnpNnsYgrimKv7JsXoiln/yGus+rPkSGONhD5eNZVU02uOBygMw==",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.29",
+        "@microsoft/load-themed-styles": "1.7.35",
         "@uifabric/icons": "5.4.2",
-        "@uifabric/merge-styles": "5.11.2",
-        "@uifabric/styling": "5.17.0",
-        "@uifabric/utilities": "5.10.2",
-        "prop-types": "15.6.0",
+        "@uifabric/merge-styles": "5.12.2",
+        "@uifabric/styling": "5.19.0",
+        "@uifabric/utilities": "5.13.0",
+        "prop-types": "15.6.1",
         "tslib": "1.9.0"
       }
     },
@@ -9180,9 +9298,9 @@
       "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ="
     },
     "osenv": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.4.tgz",
-      "integrity": "sha1-Qv5tWVPfBsgGS+bxdsPQWqqjRkQ=",
+      "version": "0.1.5",
+      "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.5.tgz",
+      "integrity": "sha512-0CWcCECdMVc2Rw3U5w9ZjqX6ga6ubk1xDVKxtBQPK7wis/0F2r9T6k4ydGYhecl7YUBxBVxhL5oisPsNxAPe2g==",
       "requires": {
         "os-homedir": "1.0.2",
         "os-tmpdir": "1.0.2"
@@ -9252,7 +9370,7 @@
       "resolved": "https://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.0.tgz",
       "integrity": "sha1-N8T5t+06tlx0gXtfJICTf7+XxxI=",
       "requires": {
-        "asn1.js": "4.9.2",
+        "asn1.js": "4.10.1",
         "browserify-aes": "1.1.1",
         "create-hash": "1.1.3",
         "evp_bytestokey": "1.0.3",
@@ -9391,15 +9509,6 @@
         "find-up": "2.1.0"
       }
     },
-    "podda": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/podda/-/podda-1.2.2.tgz",
-      "integrity": "sha1-FbDtvTNK3hRYEzQ/Xs+cEKcc9QA=",
-      "requires": {
-        "babel-runtime": "6.26.0",
-        "immutable": "3.8.2"
-      }
-    },
     "portfinder": {
       "version": "1.0.13",
       "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.13.tgz",
@@ -9423,9 +9532,9 @@
       "integrity": "sha1-AerA/jta9xoqbAL+q7jB/vfgDqs="
     },
     "postcss": {
-      "version": "6.0.17",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.17.tgz",
-      "integrity": "sha512-Bl1nybsSzWYbP8O4gAVD8JIjZIul9hLNOPTGBIlVmZNUnNAGL+W0cpYWzVwfImZOwumct4c1SDvSbncVWKtXUw==",
+      "version": "6.0.19",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.19.tgz",
+      "integrity": "sha512-f13HRz0HtVwVaEuW6J6cOUCBLFtymhgyLPV7t4QEk2UD3twRI9IluDcQNdzQdBpiixkXj2OmzejhhTbSbDxNTg==",
       "requires": {
         "chalk": "2.3.1",
         "source-map": "0.6.1",
@@ -10011,7 +10120,7 @@
       "resolved": "https://registry.npmjs.org/postcss-flexbugs-fixes/-/postcss-flexbugs-fixes-3.3.0.tgz",
       "integrity": "sha512-15JauG6a2hu2XZHdB9BaOwCLrI9oyK2UB8kt1ToTGdP1Pd3BQ/TJI9tNiTALntll25/66xMLUIyUPA9w/3BLtg==",
       "requires": {
-        "postcss": "6.0.17"
+        "postcss": "6.0.19"
       }
     },
     "postcss-load-config": {
@@ -10044,14 +10153,14 @@
       }
     },
     "postcss-loader": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-2.1.0.tgz",
-      "integrity": "sha512-S/dKzpDwGFmP9g8eyCu9sUIV+/+3UooeTpYlsKf23qKDdrhHuA4pTSfytVu0rEJ0iDqUavXrgtOPq5KhNyNMOw==",
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-2.1.1.tgz",
+      "integrity": "sha512-f0J/DWE/hyO9/LH0WHpXkny/ZZ238sSaG3p1SRBtVZnFWUtD7GXIEgHoBg8cnAeRbmEvUxHQptY46zWfwNYj/w==",
       "requires": {
         "loader-utils": "1.1.0",
-        "postcss": "6.0.17",
+        "postcss": "6.0.19",
         "postcss-load-config": "1.2.0",
-        "schema-utils": "0.4.3"
+        "schema-utils": "0.4.5"
       }
     },
     "postcss-merge-idents": {
@@ -10204,8 +10313,8 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000808",
-            "electron-to-chromium": "1.3.33"
+            "caniuse-db": "1.0.30000810",
+            "electron-to-chromium": "1.3.34"
           }
         },
         "chalk": {
@@ -10531,7 +10640,7 @@
       "requires": {
         "css-modules-loader-core": "1.1.0",
         "generic-names": "1.0.3",
-        "postcss": "6.0.17",
+        "postcss": "6.0.19",
         "string-hash": "1.1.3"
       }
     },
@@ -10540,7 +10649,7 @@
       "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-1.2.0.tgz",
       "integrity": "sha1-ZhQOzs447wa/DT41XWm/WdFB6oU=",
       "requires": {
-        "postcss": "6.0.17"
+        "postcss": "6.0.19"
       }
     },
     "postcss-modules-local-by-default": {
@@ -10549,7 +10658,7 @@
       "integrity": "sha1-99gMOYxaOT+nlkRmvRlQCn1hwGk=",
       "requires": {
         "css-selector-tokenizer": "0.7.0",
-        "postcss": "6.0.17"
+        "postcss": "6.0.19"
       }
     },
     "postcss-modules-scope": {
@@ -10558,7 +10667,7 @@
       "integrity": "sha1-1upkmUx5+XtipytCb75gVqGUu5A=",
       "requires": {
         "css-selector-tokenizer": "0.7.0",
-        "postcss": "6.0.17"
+        "postcss": "6.0.19"
       }
     },
     "postcss-modules-values": {
@@ -10567,7 +10676,7 @@
       "integrity": "sha1-7P+p1+GSUYOJ9CrQ6D9yrsRW6iA=",
       "requires": {
         "icss-replace-symbols": "1.1.0",
-        "postcss": "6.0.17"
+        "postcss": "6.0.19"
       }
     },
     "postcss-normalize-charset": {
@@ -11278,9 +11387,9 @@
       }
     },
     "prop-types": {
-      "version": "15.6.0",
-      "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.6.0.tgz",
-      "integrity": "sha1-zq8IMCL8RrSjX2nhPvda7Q1jmFY=",
+      "version": "15.6.1",
+      "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.6.1.tgz",
+      "integrity": "sha512-4ec7bY1Y66LymSUOH/zARVYObB23AT2h8cf6e/O6ZALB/N0sqZFEx7rq6EYPX2MkOdKORuooI/H5k9TlR4q7kQ==",
       "requires": {
         "fbjs": "0.8.16",
         "loose-envify": "1.3.1",
@@ -11288,12 +11397,12 @@
       }
     },
     "proxy-addr": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.2.tgz",
-      "integrity": "sha1-ZXFQT0e7mI7IGAJT+F3X4UlSvew=",
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.3.tgz",
+      "integrity": "sha512-jQTChiCJteusULxjBp8+jftSQE5Obdl3k4cnmLA6WXtK6XFuWRnvVL7aCiBqaLPM8c4ph0S4tKna8XvmIwEnXQ==",
       "requires": {
         "forwarded": "0.1.2",
-        "ipaddr.js": "1.5.2"
+        "ipaddr.js": "1.6.0"
       }
     },
     "prr": {
@@ -11319,9 +11428,9 @@
       }
     },
     "pump": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/pump/-/pump-1.0.3.tgz",
-      "integrity": "sha512-8k0JupWme55+9tCVE+FS5ULT3K6AbgqrGa58lTT49RpyfwwcGedHqaC5LlQNdEAumn/wFsu6aPwkuPMioy8kqw==",
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/pump/-/pump-2.0.1.tgz",
+      "integrity": "sha512-ruPMNRkN3MHP1cWJc9OWr+T/xDP0jhXYCLfJcBuX54hhfIBnaQmAUMfDcG4DM5UMWByBbJY69QSphm3jtDKIkA==",
       "requires": {
         "end-of-stream": "1.4.1",
         "once": "1.4.0"
@@ -11335,17 +11444,6 @@
         "duplexify": "3.5.3",
         "inherits": "2.0.3",
         "pump": "2.0.1"
-      },
-      "dependencies": {
-        "pump": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/pump/-/pump-2.0.1.tgz",
-          "integrity": "sha512-ruPMNRkN3MHP1cWJc9OWr+T/xDP0jhXYCLfJcBuX54hhfIBnaQmAUMfDcG4DM5UMWByBbJY69QSphm3jtDKIkA==",
-          "requires": {
-            "end-of-stream": "1.4.1",
-            "once": "1.4.0"
-          }
-        }
       }
     },
     "punycode": {
@@ -11395,7 +11493,7 @@
         "array-find": "1.0.0",
         "exenv": "1.2.2",
         "inline-style-prefixer": "2.0.5",
-        "prop-types": "15.6.0"
+        "prop-types": "15.6.1"
       },
       "dependencies": {
         "inline-style-prefixer": {
@@ -11459,9 +11557,9 @@
       }
     },
     "randomfill": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/randomfill/-/randomfill-1.0.3.tgz",
-      "integrity": "sha512-YL6GrhrWoic0Eq8rXVbMptH7dAxCs0J+mh5Y0euNekPPYaxEmdVGim6GdoxoRzKW2yJoU8tueifS7mYxvcFDEQ==",
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/randomfill/-/randomfill-1.0.4.tgz",
+      "integrity": "sha512-87lcbR8+MhcWcUiQ+9e+Rwx8MyR2P7qnt15ynUlbm3TU/fjbgz4GsvfSUDTemtCCtVCqb4ZcEFlyPNTh9bBTLw==",
       "requires": {
         "randombytes": "2.0.6",
         "safe-buffer": "5.1.1"
@@ -11496,13 +11594,13 @@
         "fbjs": "0.8.16",
         "loose-envify": "1.3.1",
         "object-assign": "4.1.1",
-        "prop-types": "15.6.0"
+        "prop-types": "15.6.1"
       }
     },
     "react-docgen": {
-      "version": "2.20.0",
-      "resolved": "https://registry.npmjs.org/react-docgen/-/react-docgen-2.20.0.tgz",
-      "integrity": "sha512-+fW1dthCr/cqrAreHTMk2Luzdb3I7xJishC/g4k+vIWiPj4/jM6Ij67WvUjXqio0/TRh7AQtRDYRwqNyinN0LA==",
+      "version": "2.20.1",
+      "resolved": "https://registry.npmjs.org/react-docgen/-/react-docgen-2.20.1.tgz",
+      "integrity": "sha512-NYmD8nDPMWpIpqWqhSZjQ3P5iQml55IMkDG0ZInyWP7JD2ljaNhrxNWZnXPrOezUu6bYlcZUCxjw19s7zhE2uw==",
       "requires": {
         "async": "2.6.0",
         "babel-runtime": "6.26.0",
@@ -11528,18 +11626,18 @@
         "fbjs": "0.8.16",
         "loose-envify": "1.3.1",
         "object-assign": "4.1.1",
-        "prop-types": "15.6.0"
+        "prop-types": "15.6.1"
       }
     },
     "react-fuzzy": {
-      "version": "0.5.1",
-      "resolved": "https://registry.npmjs.org/react-fuzzy/-/react-fuzzy-0.5.1.tgz",
-      "integrity": "sha512-m2QClpw+Z51m6oEpfznVr7CQ9zdUGQ7vvidv05+drt0c3UMkpOWqmB0fQhYJYP/5QNh7ojyMCgu99cxvFaya6Q==",
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/react-fuzzy/-/react-fuzzy-0.5.2.tgz",
+      "integrity": "sha512-qIZZxaCheb/HhcBi5fABbiCFg85+K5r1TCps1D4uaL0LAMMD/1zm/x1/kNR130Tx7nnY9V7mbFyY0DquPYeLAw==",
       "requires": {
         "babel-runtime": "6.26.0",
         "classnames": "2.2.5",
         "fuse.js": "3.2.0",
-        "prop-types": "15.6.0"
+        "prop-types": "15.6.1"
       }
     },
     "react-highlight": {
@@ -11561,7 +11659,7 @@
             "fbjs": "0.8.16",
             "loose-envify": "1.3.1",
             "object-assign": "4.1.1",
-            "prop-types": "15.6.0"
+            "prop-types": "15.6.1"
           }
         },
         "react-dom": {
@@ -11572,7 +11670,7 @@
             "fbjs": "0.8.16",
             "loose-envify": "1.3.1",
             "object-assign": "4.1.1",
-            "prop-types": "15.6.0"
+            "prop-types": "15.6.1"
           }
         }
       }
@@ -11608,12 +11706,12 @@
       }
     },
     "react-modal": {
-      "version": "3.1.13",
-      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.1.13.tgz",
-      "integrity": "sha512-YSNoLKd/zgfILPwx6Uio2f6JNX7UqPvWO7vGKXXpFcsDaj+z97FVxJo82dMsbca4SSitu0A9Q+Xq750CPQUAYA==",
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.3.1.tgz",
+      "integrity": "sha512-d1A8xXIvW+YVKwRMrFY5qneuC5FSa4OnOE78hgqfz+MYLb1Ai/B3D3Dzx1Zrw4ZD5rS16SKiPe5rl4UZt+AjpQ==",
       "requires": {
         "exenv": "1.2.2",
-        "prop-types": "15.6.0",
+        "prop-types": "15.6.1",
         "warning": "3.0.0"
       }
     },
@@ -11625,7 +11723,7 @@
         "fbjs": "0.8.16",
         "loose-envify": "1.3.1",
         "object-assign": "4.1.1",
-        "prop-types": "15.6.0"
+        "prop-types": "15.6.1"
       }
     },
     "react-remarkable": {
@@ -11642,7 +11740,7 @@
       "integrity": "sha512-xq0PPsbkNI9xEd6yTrGPr7hzf6XfIgnsxuUEdRJELq+kLPHMsO3ymFCjhiYP35wlDPn9W46+rHDsJd7LFYteMw==",
       "requires": {
         "inline-style-prefixer": "3.0.8",
-        "prop-types": "15.6.0",
+        "prop-types": "15.6.1",
         "react-style-proptype": "3.2.0"
       }
     },
@@ -11651,7 +11749,7 @@
       "resolved": "https://registry.npmjs.org/react-style-proptype/-/react-style-proptype-3.2.0.tgz",
       "integrity": "sha512-Mafmkzj3oNmLSJNOlH+WWWyGIdzVLhPj+d12fDxQMQdwDQ5sMX7vQKOLpry4U+zRWieTCx448AyRKK0NLWuXmg==",
       "requires": {
-        "prop-types": "15.6.0"
+        "prop-types": "15.6.1"
       }
     },
     "react-test-renderer": {
@@ -11661,7 +11759,7 @@
       "requires": {
         "fbjs": "0.8.16",
         "object-assign": "4.1.1",
-        "prop-types": "15.6.0"
+        "prop-types": "15.6.1"
       }
     },
     "react-transition-group": {
@@ -11672,7 +11770,7 @@
         "chain-function": "1.0.0",
         "dom-helpers": "3.3.1",
         "loose-envify": "1.3.1",
-        "prop-types": "15.6.0",
+        "prop-types": "15.6.1",
         "warning": "3.0.0"
       }
     },
@@ -11683,7 +11781,7 @@
       "requires": {
         "babel-runtime": "6.26.0",
         "deep-equal": "1.0.1",
-        "prop-types": "15.6.0",
+        "prop-types": "15.6.1",
         "radium": "0.19.6",
         "shallowequal": "0.2.2",
         "velocity-react": "1.3.3"
@@ -11841,11 +11939,12 @@
       }
     },
     "regex-not": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/regex-not/-/regex-not-1.0.0.tgz",
-      "integrity": "sha1-Qvg+OXcWIt+CawKvF2Ul1qXxV/k=",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/regex-not/-/regex-not-1.0.2.tgz",
+      "integrity": "sha512-J6SDjUgDxQj5NusnOtdFxDwN/+HWykR8GELwctJ7mdqhcyy1xEc4SRFHUXvxTp661YaVKAjfRLZ9cCqS6tn32A==",
       "requires": {
-        "extend-shallow": "2.0.1"
+        "extend-shallow": "3.0.2",
+        "safe-regex": "1.1.0"
       }
     },
     "regexpu-core": {
@@ -11898,11 +11997,6 @@
           "version": "1.7.0",
           "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.7.0.tgz",
           "integrity": "sha1-a7rwh3UA02vjTsqlhODbn+8DUgk="
-        },
-        "underscore.string": {
-          "version": "2.4.0",
-          "resolved": "https://registry.npmjs.org/underscore.string/-/underscore.string-2.4.0.tgz",
-          "integrity": "sha1-jN2PusTi0uoefi6Al8QvRCKA+Fs="
         }
       }
     },
@@ -12004,23 +12098,23 @@
         "aws-sign2": "0.7.0",
         "aws4": "1.6.0",
         "caseless": "0.12.0",
-        "combined-stream": "1.0.5",
+        "combined-stream": "1.0.6",
         "extend": "3.0.1",
         "forever-agent": "0.6.1",
-        "form-data": "2.3.1",
+        "form-data": "2.3.2",
         "har-validator": "5.0.3",
         "hawk": "6.0.2",
         "http-signature": "1.2.0",
         "is-typedarray": "1.0.0",
         "isstream": "0.1.2",
         "json-stringify-safe": "5.0.1",
-        "mime-types": "2.1.17",
+        "mime-types": "2.1.18",
         "oauth-sign": "0.8.2",
         "performance-now": "2.1.0",
         "qs": "6.5.1",
         "safe-buffer": "5.1.1",
         "stringstream": "0.0.5",
-        "tough-cookie": "2.3.3",
+        "tough-cookie": "2.3.4",
         "tunnel-agent": "0.6.0",
         "uuid": "3.2.1"
       }
@@ -12179,6 +12273,14 @@
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.1.tgz",
       "integrity": "sha512-kKvNJn6Mm93gAczWVJg7wH+wGYWNrDHdWvpUmHyEsgCtIwwo3bqPtV4tR5tuPaUhTOo/kvhVwd8XwwOllGYkbg=="
     },
+    "safe-regex": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/safe-regex/-/safe-regex-1.1.0.tgz",
+      "integrity": "sha1-QKNmnzsHfR6UPURinhV91IAjvy4=",
+      "requires": {
+        "ret": "0.1.15"
+      }
+    },
     "samsam": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/samsam/-/samsam-1.3.0.tgz",
@@ -12371,12 +12473,24 @@
       "integrity": "sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw=="
     },
     "schema-utils": {
-      "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-0.4.3.tgz",
-      "integrity": "sha512-sgv/iF/T4/SewJkaVpldKC4WjSkz0JsOh2eKtxCPpCO1oR05+7MOF+H476HVRbLArkgA7j5TRJJ4p2jdFkUGQQ==",
+      "version": "0.4.5",
+      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-0.4.5.tgz",
+      "integrity": "sha512-yYrjb9TX2k/J1Y5UNy3KYdZq10xhYcF8nMpAW6o3hy6Q8WSIEf9lJHG/ePnOBfziPM3fvQwfOwa13U/Fh8qTfA==",
       "requires": {
-        "ajv": "5.5.2",
-        "ajv-keywords": "2.1.1"
+        "ajv": "6.2.0",
+        "ajv-keywords": "3.1.0"
+      },
+      "dependencies": {
+        "ajv": {
+          "version": "6.2.0",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.2.0.tgz",
+          "integrity": "sha1-r6wpW7qgFSRJ5SJ0LkVHwa6TKNI=",
+          "requires": {
+            "fast-deep-equal": "1.1.0",
+            "fast-json-stable-stringify": "2.0.0",
+            "json-schema-traverse": "0.3.1"
+          }
+        }
       }
     },
     "screener-runner": {
@@ -12463,7 +12577,7 @@
           "requires": {
             "accepts": "1.3.4",
             "bytes": "2.3.0",
-            "compressible": "2.0.12",
+            "compressible": "2.0.13",
             "debug": "2.2.0",
             "on-headers": "1.0.1",
             "vary": "1.1.2"
@@ -12491,8 +12605,8 @@
           "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE=",
           "requires": {
             "asynckit": "0.4.0",
-            "combined-stream": "1.0.5",
-            "mime-types": "2.1.17"
+            "combined-stream": "1.0.6",
+            "mime-types": "2.1.18"
           }
         },
         "har-validator": {
@@ -12502,7 +12616,7 @@
           "requires": {
             "chalk": "1.1.3",
             "commander": "2.9.0",
-            "is-my-json-valid": "2.17.1",
+            "is-my-json-valid": "2.17.2",
             "pinkie-promise": "2.0.1"
           }
         },
@@ -12560,7 +12674,7 @@
             "aws-sign2": "0.6.0",
             "aws4": "1.6.0",
             "caseless": "0.11.0",
-            "combined-stream": "1.0.5",
+            "combined-stream": "1.0.6",
             "extend": "3.0.1",
             "forever-agent": "0.6.1",
             "form-data": "2.1.4",
@@ -12570,12 +12684,12 @@
             "is-typedarray": "1.0.0",
             "isstream": "0.1.2",
             "json-stringify-safe": "5.0.1",
-            "mime-types": "2.1.17",
+            "mime-types": "2.1.18",
             "node-uuid": "1.4.8",
             "oauth-sign": "0.8.2",
             "qs": "6.3.2",
             "stringstream": "0.0.5",
-            "tough-cookie": "2.3.3",
+            "tough-cookie": "2.3.4",
             "tunnel-agent": "0.4.3"
           }
         },
@@ -12600,9 +12714,9 @@
       }
     },
     "screener-storybook": {
-      "version": "0.11.1",
-      "resolved": "https://registry.npmjs.org/screener-storybook/-/screener-storybook-0.11.1.tgz",
-      "integrity": "sha1-hIk6qwuWyBI7tmjz9o5pm+vSwK0=",
+      "version": "0.11.3",
+      "resolved": "https://registry.npmjs.org/screener-storybook/-/screener-storybook-0.11.3.tgz",
+      "integrity": "sha1-21arkALnjhJOUsvPk7TlettPjLY=",
       "requires": {
         "bluebird": "3.4.7",
         "colors": "1.1.2",
@@ -12611,12 +12725,12 @@
         "joi": "10.0.6",
         "jsdom": "9.8.3",
         "lodash": "4.17.5",
-        "prop-types": "15.6.0",
+        "prop-types": "15.6.1",
         "react": "15.6.2",
         "react-dom": "15.4.2",
         "request": "2.81.0",
         "requestretry": "1.12.3",
-        "screener-runner": "0.8.1"
+        "screener-runner": "0.8.2"
       },
       "dependencies": {
         "acorn": {
@@ -12708,7 +12822,7 @@
           "requires": {
             "accepts": "1.3.4",
             "bytes": "2.3.0",
-            "compressible": "2.0.12",
+            "compressible": "2.0.13",
             "debug": "2.2.0",
             "on-headers": "1.0.1",
             "vary": "1.1.2"
@@ -12736,8 +12850,8 @@
           "integrity": "sha1-M8GDrPGTJ27KqYFDpp6Uv+4XUNE=",
           "requires": {
             "asynckit": "0.4.0",
-            "combined-stream": "1.0.5",
-            "mime-types": "2.1.17"
+            "combined-stream": "1.0.6",
+            "mime-types": "2.1.18"
           }
         },
         "har-schema": {
@@ -12787,7 +12901,7 @@
           "resolved": "https://registry.npmjs.org/joi/-/joi-10.0.6.tgz",
           "integrity": "sha1-26y78wtNu50o72cW2CxFgLsEwJY=",
           "requires": {
-            "hoek": "4.2.0",
+            "hoek": "4.2.1",
             "isemail": "2.2.1",
             "items": "2.1.1",
             "topo": "2.0.2"
@@ -12805,7 +12919,7 @@
             "content-type-parser": "1.0.2",
             "cssom": "0.3.2",
             "cssstyle": "0.2.37",
-            "escodegen": "1.9.0",
+            "escodegen": "1.9.1",
             "html-encoding-sniffer": "1.0.2",
             "iconv-lite": "0.4.19",
             "nwmatcher": "1.4.3",
@@ -12813,7 +12927,7 @@
             "request": "2.81.0",
             "sax": "1.2.4",
             "symbol-tree": "3.2.2",
-            "tough-cookie": "2.3.3",
+            "tough-cookie": "2.3.4",
             "webidl-conversions": "3.0.1",
             "whatwg-encoding": "1.0.3",
             "whatwg-url": "3.1.0",
@@ -12865,7 +12979,7 @@
             "fbjs": "0.8.16",
             "loose-envify": "1.3.1",
             "object-assign": "4.1.1",
-            "prop-types": "15.6.0"
+            "prop-types": "15.6.1"
           }
         },
         "react-dom": {
@@ -12886,7 +13000,7 @@
             "aws-sign2": "0.6.0",
             "aws4": "1.6.0",
             "caseless": "0.12.0",
-            "combined-stream": "1.0.5",
+            "combined-stream": "1.0.6",
             "extend": "3.0.1",
             "forever-agent": "0.6.1",
             "form-data": "2.1.4",
@@ -12896,21 +13010,21 @@
             "is-typedarray": "1.0.0",
             "isstream": "0.1.2",
             "json-stringify-safe": "5.0.1",
-            "mime-types": "2.1.17",
+            "mime-types": "2.1.18",
             "oauth-sign": "0.8.2",
             "performance-now": "0.2.0",
             "qs": "6.4.0",
             "safe-buffer": "5.1.1",
             "stringstream": "0.0.5",
-            "tough-cookie": "2.3.3",
+            "tough-cookie": "2.3.4",
             "tunnel-agent": "0.6.0",
             "uuid": "3.2.1"
           }
         },
         "screener-runner": {
-          "version": "0.8.1",
-          "resolved": "https://registry.npmjs.org/screener-runner/-/screener-runner-0.8.1.tgz",
-          "integrity": "sha1-EGUqCcftTH88ABSKX4HglNv3CnU=",
+          "version": "0.8.2",
+          "resolved": "https://registry.npmjs.org/screener-runner/-/screener-runner-0.8.2.tgz",
+          "integrity": "sha1-6s1x1kjguLZLTc6BA/E2uElTUFc=",
           "requires": {
             "bluebird": "3.4.7",
             "colors": "1.1.2",
@@ -12938,7 +13052,7 @@
               "requires": {
                 "chalk": "1.1.3",
                 "commander": "2.9.0",
-                "is-my-json-valid": "2.17.1",
+                "is-my-json-valid": "2.17.2",
                 "pinkie-promise": "2.0.1"
               }
             },
@@ -12947,7 +13061,7 @@
               "resolved": "https://registry.npmjs.org/joi/-/joi-9.2.0.tgz",
               "integrity": "sha1-M4WseQGSEwy+Iw6ALsAskhW7/to=",
               "requires": {
-                "hoek": "4.2.0",
+                "hoek": "4.2.1",
                 "isemail": "2.2.1",
                 "items": "2.1.1",
                 "moment": "2.20.1",
@@ -12972,7 +13086,7 @@
                 "aws-sign2": "0.6.0",
                 "aws4": "1.6.0",
                 "caseless": "0.11.0",
-                "combined-stream": "1.0.5",
+                "combined-stream": "1.0.6",
                 "extend": "3.0.1",
                 "forever-agent": "0.6.1",
                 "form-data": "2.1.4",
@@ -12982,12 +13096,12 @@
                 "is-typedarray": "1.0.0",
                 "isstream": "0.1.2",
                 "json-stringify-safe": "5.0.1",
-                "mime-types": "2.1.17",
+                "mime-types": "2.1.18",
                 "node-uuid": "1.4.8",
                 "oauth-sign": "0.8.2",
                 "qs": "6.3.2",
                 "stringstream": "0.0.5",
-                "tough-cookie": "2.3.3",
+                "tough-cookie": "2.3.4",
                 "tunnel-agent": "0.4.3"
               }
             },
@@ -13125,7 +13239,7 @@
         "debug": "2.6.9",
         "escape-html": "1.0.3",
         "http-errors": "1.6.2",
-        "mime-types": "2.1.17",
+        "mime-types": "2.1.18",
         "parseurl": "1.3.2"
       }
     },
@@ -13167,6 +13281,16 @@
         "is-extendable": "0.1.1",
         "is-plain-object": "2.0.4",
         "split-string": "3.1.0"
+      },
+      "dependencies": {
+        "extend-shallow": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+          "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
+          "requires": {
+            "is-extendable": "0.1.1"
+          }
+        }
       }
     },
     "setimmediate": {
@@ -13267,15 +13391,15 @@
       "integrity": "sha1-tf3AjxKH6hF4Yo5BXiUTK3NkbG0="
     },
     "sinon": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/sinon/-/sinon-4.3.0.tgz",
-      "integrity": "sha512-pmf05hFgEZUS52AGJcsVjOjqAyJW2yo14cOwVYvzCyw7+inv06YXkLyW75WG6X6p951lzkoKh51L2sNbR9CDvw==",
+      "version": "4.4.2",
+      "resolved": "https://registry.npmjs.org/sinon/-/sinon-4.4.2.tgz",
+      "integrity": "sha512-cpOHpnRyY3Dk9dTHBYMfVBB0HUCSKIpxW07X6OGW2NiYPovs4AkcL8Q8MzecbAROjbfRA9esJCmlZgikxDz7DA==",
       "requires": {
         "@sinonjs/formatio": "2.0.0",
         "diff": "3.4.0",
         "lodash.get": "4.4.2",
         "lolex": "2.3.2",
-        "nise": "1.2.5",
+        "nise": "1.2.7",
         "supports-color": "5.2.0",
         "type-detect": "4.0.8"
       }
@@ -13308,6 +13432,14 @@
             "is-descriptor": "0.1.6"
           }
         },
+        "extend-shallow": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+          "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
+          "requires": {
+            "is-extendable": "0.1.1"
+          }
+        },
         "is-accessor-descriptor": {
           "version": "0.1.6",
           "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
@@ -13374,6 +13506,16 @@
         "define-property": "1.0.0",
         "isobject": "3.0.1",
         "snapdragon-util": "3.0.1"
+      },
+      "dependencies": {
+        "define-property": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/define-property/-/define-property-1.0.0.tgz",
+          "integrity": "sha1-dp66rz9KY6rTr56NMEybvnm/sOY=",
+          "requires": {
+            "is-descriptor": "1.0.2"
+          }
+        }
       }
     },
     "snapdragon-util": {
@@ -13399,7 +13541,7 @@
       "resolved": "https://registry.npmjs.org/sntp/-/sntp-2.1.0.tgz",
       "integrity": "sha512-FL1b58BDrqS3A11lJ0zEdnJ3UOKqVxawAkF3k7F0CVN7VQ34aZrV+G8BZ1WC9ZL7NyrwsW0oviwsWDgRuVYtJg==",
       "requires": {
-        "hoek": "4.2.0"
+        "hoek": "4.2.1"
       }
     },
     "sockjs": {
@@ -13488,18 +13630,11 @@
       }
     },
     "source-map-support": {
-      "version": "0.4.18",
-      "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.4.18.tgz",
-      "integrity": "sha512-try0/JqxPLF9nOjvSta7tVondkP5dwgyLDjVoyMDlmjugT2lRZ1OfsrYTkCd2hkDnJTKRbO/Rl3orm8vlsUzbA==",
+      "version": "0.5.3",
+      "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.3.tgz",
+      "integrity": "sha512-eKkTgWYeBOQqFGXRfKabMFdnWepo51vWqEdoeikaEPFiJC7MCU5j2h4+6Q8npkZTeLGbSyecZvRxiSoWl3rh+w==",
       "requires": {
-        "source-map": "0.5.7"
-      },
-      "dependencies": {
-        "source-map": {
-          "version": "0.5.7",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
-          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
-        }
+        "source-map": "0.6.1"
       }
     },
     "source-map-url": {
@@ -13508,22 +13643,32 @@
       "integrity": "sha1-PpNdfd1zYxuXZZlW1VEo6HtQhKM="
     },
     "spdx-correct": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-1.0.2.tgz",
-      "integrity": "sha1-SzBz2TP/UfORLwOsVRlJikFQ20A=",
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-3.0.0.tgz",
+      "integrity": "sha512-N19o9z5cEyc8yQQPukRCZ9EUmb4HUpnrmaL/fxS2pBo2jbfcFRVuFZ/oFC+vZz0MNNk0h80iMn5/S6qGZOL5+g==",
       "requires": {
-        "spdx-license-ids": "1.2.2"
+        "spdx-expression-parse": "3.0.0",
+        "spdx-license-ids": "3.0.0"
       }
     },
+    "spdx-exceptions": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/spdx-exceptions/-/spdx-exceptions-2.1.0.tgz",
+      "integrity": "sha512-4K1NsmrlCU1JJgUrtgEeTVyfx8VaYea9J9LvARxhbHtVtohPs/gFGG5yy49beySjlIMhhXZ4QqujIZEfS4l6Cg=="
+    },
     "spdx-expression-parse": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-1.0.4.tgz",
-      "integrity": "sha1-m98vIOH0DtRH++JzJmGR/O1RYmw="
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-3.0.0.tgz",
+      "integrity": "sha512-Yg6D3XpRD4kkOmTpdgbUiEJFKghJH03fiC1OPll5h/0sO6neh2jqRDVHOQ4o/LMea0tgCkbMgea5ip/e+MkWyg==",
+      "requires": {
+        "spdx-exceptions": "2.1.0",
+        "spdx-license-ids": "3.0.0"
+      }
     },
     "spdx-license-ids": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-1.2.2.tgz",
-      "integrity": "sha1-yd96NCRZSt5r0RkA1ZZpbcBrrFc="
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.0.tgz",
+      "integrity": "sha512-2+EPwgbnmOIl8HjGBXXMd9NAu02vLjOO1nWw4kmeRDFyHn+M/ETfHxQUK0oXg8ctgVnl9t3rosNVsZ1jG61nDA=="
     },
     "spdy": {
       "version": "3.4.7",
@@ -13558,25 +13703,6 @@
       "integrity": "sha512-NzNVhJDYpwceVVii8/Hu6DKfD2G+NrQHlS/V/qgv763EYudVwEcMQNxd2lh+0VrUByXN/oJkl5grOhYWvQUYiw==",
       "requires": {
         "extend-shallow": "3.0.2"
-      },
-      "dependencies": {
-        "extend-shallow": {
-          "version": "3.0.2",
-          "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-3.0.2.tgz",
-          "integrity": "sha1-Jqcarwc7OfshJxcnRhMcJwQCjbg=",
-          "requires": {
-            "assign-symbols": "1.0.0",
-            "is-extendable": "1.0.1"
-          }
-        },
-        "is-extendable": {
-          "version": "1.0.1",
-          "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-1.0.1.tgz",
-          "integrity": "sha512-arnXMxT1hhoKo9k1LZdmlNyJdDDfy2v0fXjFlmok4+i8ul/6WlbVge9bhM74OpNPQPMGUToDtz+KXa1PneJxOA==",
-          "requires": {
-            "is-plain-object": "2.0.4"
-          }
-        }
       }
     },
     "sprintf-js": {
@@ -13596,9 +13722,9 @@
       }
     },
     "ssri": {
-      "version": "5.2.1",
-      "resolved": "https://registry.npmjs.org/ssri/-/ssri-5.2.1.tgz",
-      "integrity": "sha512-y4PjOWlAuxt+yAcXitQYOnOzZpKaH3+f/qGV3OWxbyC2noC9FA9GNC9uILnVdV7jruA1aDKr4OKz3ZDBcVZwFQ==",
+      "version": "5.2.4",
+      "resolved": "https://registry.npmjs.org/ssri/-/ssri-5.2.4.tgz",
+      "integrity": "sha512-UnEAgMZa15973iH7cUi0AHjJn1ACDIkaMyZILoqwN6yzt+4P81I8tBc5Hl+qwi5auMplZtPQsHrPBR5vJLcQtQ==",
       "requires": {
         "safe-buffer": "5.1.1"
       }
@@ -13696,7 +13822,7 @@
       "resolved": "https://registry.npmjs.org/storybook-readme/-/storybook-readme-3.0.6.tgz",
       "integrity": "sha1-R1oUpbOdx6hcQjQxJTor8fWxx4Y=",
       "requires": {
-        "prop-types": "15.6.0",
+        "prop-types": "15.6.1",
         "react-remarkable": "1.1.3",
         "string-raw": "1.0.1"
       }
@@ -13711,9 +13837,9 @@
       }
     },
     "stream-consume": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/stream-consume/-/stream-consume-0.1.0.tgz",
-      "integrity": "sha1-pB6tGm1ggc63n2WwYZAbbY89HQ8="
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/stream-consume/-/stream-consume-0.1.1.tgz",
+      "integrity": "sha512-tNa3hzgkjEP7XbCkbRXe1jpg+ievoa0O4SCFlMOYEscGSS4JJsckGL8swUyAa/ApGU3Ae4t6Honor4HhL+tRyg=="
     },
     "stream-each": {
       "version": "1.2.2",
@@ -13950,9 +14076,9 @@
       }
     },
     "test-exclude": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/test-exclude/-/test-exclude-4.1.1.tgz",
-      "integrity": "sha512-35+Asrsk3XHJDBgf/VRFexPgh3UyETv8IAn/LRTiZjVy6rjPVqdEk8dJcJYBzl1w0XCJM48lvTy8SfEsCWS4nA==",
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/test-exclude/-/test-exclude-4.2.0.tgz",
+      "integrity": "sha512-8hMFzjxbPv6xSlwGhXSvOMJ/vTy3bkng+2pxmf6E1z6VF7I9nIyNfvHtaw+NBPgvz647gADBbMSbwLfZYppT/w==",
       "requires": {
         "arrify": "1.0.1",
         "micromatch": "2.3.11",
@@ -14204,74 +14330,14 @@
       }
     },
     "to-regex": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/to-regex/-/to-regex-3.0.1.tgz",
-      "integrity": "sha1-FTWL7kosg712N3uh3ASdDxiDeq4=",
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/to-regex/-/to-regex-3.0.2.tgz",
+      "integrity": "sha512-FWtleNAtZ/Ki2qtqej2CXTOayOH9bHDQF+Q48VpWyDXjbYxA4Yz8iDB31zXOBUlOHHKidDbqGVrTUvQMPmBGBw==",
       "requires": {
-        "define-property": "0.2.5",
-        "extend-shallow": "2.0.1",
-        "regex-not": "1.0.0"
-      },
-      "dependencies": {
-        "define-property": {
-          "version": "0.2.5",
-          "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
-          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY=",
-          "requires": {
-            "is-descriptor": "0.1.6"
-          }
-        },
-        "is-accessor-descriptor": {
-          "version": "0.1.6",
-          "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
-          "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
-          "requires": {
-            "kind-of": "3.2.2"
-          },
-          "dependencies": {
-            "kind-of": {
-              "version": "3.2.2",
-              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-              "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
-              "requires": {
-                "is-buffer": "1.1.6"
-              }
-            }
-          }
-        },
-        "is-data-descriptor": {
-          "version": "0.1.4",
-          "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
-          "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
-          "requires": {
-            "kind-of": "3.2.2"
-          },
-          "dependencies": {
-            "kind-of": {
-              "version": "3.2.2",
-              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-              "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
-              "requires": {
-                "is-buffer": "1.1.6"
-              }
-            }
-          }
-        },
-        "is-descriptor": {
-          "version": "0.1.6",
-          "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
-          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg==",
-          "requires": {
-            "is-accessor-descriptor": "0.1.6",
-            "is-data-descriptor": "0.1.4",
-            "kind-of": "5.1.0"
-          }
-        },
-        "kind-of": {
-          "version": "5.1.0",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
-          "integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw=="
-        }
+        "define-property": "2.0.2",
+        "extend-shallow": "3.0.2",
+        "regex-not": "1.0.2",
+        "safe-regex": "1.1.0"
       }
     },
     "to-regex-range": {
@@ -14288,7 +14354,7 @@
       "resolved": "https://registry.npmjs.org/topo/-/topo-2.0.2.tgz",
       "integrity": "sha1-zVYVdSU5BXwNwEkaYhw7xvvh0YI=",
       "requires": {
-        "hoek": "4.2.0"
+        "hoek": "4.2.1"
       }
     },
     "toposort": {
@@ -14315,9 +14381,9 @@
       }
     },
     "tough-cookie": {
-      "version": "2.3.3",
-      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.3.tgz",
-      "integrity": "sha1-C2GKVWW23qkL80JdBNVe3EdadWE=",
+      "version": "2.3.4",
+      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.3.4.tgz",
+      "integrity": "sha512-TZ6TTfI5NtZnuyy/Kecv+CnoROnyXn2DN97LontgQpCwsX2XyLYCC0ENhYkehSOwAp8rTQKc/NUIF7BkQ5rKLA==",
       "requires": {
         "punycode": "1.4.1"
       }
@@ -14419,14 +14485,6 @@
             "graceful-fs": "4.1.11"
           }
         },
-        "source-map-support": {
-          "version": "0.5.3",
-          "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.3.tgz",
-          "integrity": "sha512-eKkTgWYeBOQqFGXRfKabMFdnWepo51vWqEdoeikaEPFiJC7MCU5j2h4+6Q8npkZTeLGbSyecZvRxiSoWl3rh+w==",
-          "requires": {
-            "source-map": "0.6.1"
-          }
-        },
         "strip-ansi": {
           "version": "4.0.0",
           "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
@@ -14485,29 +14543,29 @@
         "resolve": "1.5.0",
         "semver": "5.5.0",
         "tslib": "1.9.0",
-        "tsutils": "2.21.1"
+        "tsutils": "2.21.2"
       }
     },
     "tslint-microsoft-contrib": {
-      "version": "5.0.2",
-      "resolved": "https://registry.npmjs.org/tslint-microsoft-contrib/-/tslint-microsoft-contrib-5.0.2.tgz",
-      "integrity": "sha1-7MKnl/d3oS8AZpRM7AyBqefFnuk=",
+      "version": "5.0.3",
+      "resolved": "https://registry.npmjs.org/tslint-microsoft-contrib/-/tslint-microsoft-contrib-5.0.3.tgz",
+      "integrity": "sha512-5AnfTGlfpUzpRHLmoojPBKFTTmbjnwgdaTHMdllausa4GBPya5u36i9ddrTX4PhetGZvd4JUYIpAmgHqVnsctg==",
       "requires": {
-        "tsutils": "2.21.1"
+        "tsutils": "2.21.2"
       }
     },
     "tslint-react": {
-      "version": "3.5.0",
-      "resolved": "https://registry.npmjs.org/tslint-react/-/tslint-react-3.5.0.tgz",
-      "integrity": "sha512-/530IQLogPjCMC1oVnn7pxw2g9gVN84SEgRF5BV9/BTc6mRXi0qoDfXvQsqejqvBBTxw39ntA1V1STP+xXwsnw==",
+      "version": "3.5.1",
+      "resolved": "https://registry.npmjs.org/tslint-react/-/tslint-react-3.5.1.tgz",
+      "integrity": "sha512-ndS/iOOGrasATcf5YU3JxoIwPGVykjrKhzmlVsRdT1xzl/RbNg9n627rtAGbCjkQepyiaQYgxWQT5G/qUpQCaA==",
       "requires": {
-        "tsutils": "2.21.1"
+        "tsutils": "2.21.2"
       }
     },
     "tsutils": {
-      "version": "2.21.1",
-      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.21.1.tgz",
-      "integrity": "sha512-heMkdeQ9iUc90ynfiNo5Y+GXrEEGy86KMvnSTfHO+Q40AuNQ1lZGXcv58fuU9XTUxI0V7YIN9xPN+CO9b1Gn3w==",
+      "version": "2.21.2",
+      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.21.2.tgz",
+      "integrity": "sha512-iaIuyjIUeFLdD39MYdzqBuY7Zv6+uGxSwRH4mf+HuzsnznjFz0R2tGrAe0/JvtNh91WrN8UN/DZRFTZNDuVekA==",
       "requires": {
         "tslib": "1.9.0"
       }
@@ -14539,12 +14597,12 @@
       "integrity": "sha512-0fr/mIH1dlO+x7TlcMy+bIDqKPsw/70tVyeHW787goQjhmqaZe10uwLujubK9q9Lg6Fiho1KUKDYz0Z7k7g5/g=="
     },
     "type-is": {
-      "version": "1.6.15",
-      "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.15.tgz",
-      "integrity": "sha1-yrEPtJCeRByChC6v4a1kbIGARBA=",
+      "version": "1.6.16",
+      "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.16.tgz",
+      "integrity": "sha512-HRkVv/5qY2G6I8iab9cI7v1bOIdhm94dVjQCPFElW9W+3GeDOSHmy2EBYe4VTApuzolPcmgFTN3ftVJRKR2J9Q==",
       "requires": {
         "media-typer": "0.3.0",
-        "mime-types": "2.1.17"
+        "mime-types": "2.1.18"
       }
     },
     "typedarray": {
@@ -14553,9 +14611,9 @@
       "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
     },
     "typescript": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.6.2.tgz",
-      "integrity": "sha1-PFtv1/beCRQmkCfwPAlGdY92c6Q="
+      "version": "2.7.2",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.7.2.tgz",
+      "integrity": "sha512-p5TCYZDAO0m4G344hD+wx/LATebLWZNkkh2asWUFqSsD2OrDNhbAHuSjobrmsUmdzjJjEeZVU9g1h3O6vpstnw=="
     },
     "typical": {
       "version": "2.6.1",
@@ -14631,20 +14689,15 @@
         }
       }
     },
-    "ultron": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.1.1.tgz",
-      "integrity": "sha512-UIEXBNeYmKptWH6z8ZnqTeS8fV74zG0/eRU9VGkpzz+LIJNs8W/zM/L+7ctCkRrgbNnnR0xxw4bKOr0cW0N0Og=="
-    },
     "underscore": {
       "version": "1.4.4",
       "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.4.4.tgz",
       "integrity": "sha1-YaajIBBiKvoHljvzJSA88SI51gQ="
     },
     "underscore.string": {
-      "version": "2.3.3",
-      "resolved": "https://registry.npmjs.org/underscore.string/-/underscore.string-2.3.3.tgz",
-      "integrity": "sha1-ccCL9rQosRM/N+ePo6Icgvcymw0="
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/underscore.string/-/underscore.string-2.4.0.tgz",
+      "integrity": "sha1-jN2PusTi0uoefi6Al8QvRCKA+Fs="
     },
     "union-value": {
       "version": "1.0.0",
@@ -14657,6 +14710,14 @@
         "set-value": "0.4.3"
       },
       "dependencies": {
+        "extend-shallow": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
+          "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=",
+          "requires": {
+            "is-extendable": "0.1.1"
+          }
+        },
         "set-value": {
           "version": "0.4.3",
           "resolved": "https://registry.npmjs.org/set-value/-/set-value-0.4.3.tgz",
@@ -14759,20 +14820,9 @@
       }
     },
     "upath": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/upath/-/upath-1.0.0.tgz",
-      "integrity": "sha1-tHBrlGHKhHOt+JEz0jVonKF/NlY=",
-      "requires": {
-        "lodash": "3.10.1",
-        "underscore.string": "2.3.3"
-      },
-      "dependencies": {
-        "lodash": {
-          "version": "3.10.1",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-3.10.1.tgz",
-          "integrity": "sha1-W/Rejkm6QYnhfUgnid/RW9FAt7Y="
-        }
-      }
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/upath/-/upath-1.0.4.tgz",
+      "integrity": "sha512-d4SJySNBXDaQp+DPrziv3xGS6w3d2Xt69FijJr86zMPBy23JEloMCEOUBBzuN7xCtjLCnmB9tI/z7SBCahHBOw=="
     },
     "upper-case": {
       "version": "1.1.3",
@@ -14943,12 +14993,12 @@
       "integrity": "sha512-jZnMwlb9Iku/O3smGWvZhauCf6cvvpKi4BKRiliS3cxnI+Gz9j5MEpTz2UFuXiKPJocb7gnsLHwiS05ige5BEA=="
     },
     "validate-npm-package-license": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.1.tgz",
-      "integrity": "sha1-KAS6vnEq0zeUWaz74kdGqywwP7w=",
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.3.tgz",
+      "integrity": "sha512-63ZOUnL4SIXj4L0NixR3L1lcjO38crAbgrTpl28t8jjrfuiOBL5Iygm+60qPs/KsZGzPNg6Smnc/oY16QTjF0g==",
       "requires": {
-        "spdx-correct": "1.0.2",
-        "spdx-expression-parse": "1.0.4"
+        "spdx-correct": "3.0.0",
+        "spdx-expression-parse": "3.0.0"
       }
     },
     "validator": {
@@ -14972,7 +15022,7 @@
       "integrity": "sha1-1tRyds/Ivip1Yjh5sgFArFjBuCs=",
       "requires": {
         "lodash": "3.10.1",
-        "prop-types": "15.6.0",
+        "prop-types": "15.6.1",
         "react-transition-group": "1.2.1",
         "velocity-animate": "1.5.1"
       },
@@ -15040,13 +15090,74 @@
       }
     },
     "watchpack": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.4.0.tgz",
-      "integrity": "sha1-ShRyvLuVK9Cpu0A2gB+VTfs5+qw=",
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.5.0.tgz",
+      "integrity": "sha512-RSlipNQB1u48cq0wH/BNfCu1tD/cJ8ydFIkNYhp9o+3d+8unClkIovpW5qpFPgmL9OE48wfAnlZydXByWP82AA==",
       "requires": {
-        "async": "2.6.0",
-        "chokidar": "1.7.0",
-        "graceful-fs": "4.1.11"
+        "chokidar": "2.0.2",
+        "graceful-fs": "4.1.11",
+        "neo-async": "2.5.0"
+      },
+      "dependencies": {
+        "anymatch": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-2.0.0.tgz",
+          "integrity": "sha512-5teOsQWABXHHBFP9y3skS5P3d/WfWXpv3FUpy+LorMrNYaT9pI4oLMQX7jzQ2KklNpGpWHzdCXTDT2Y3XGlZBw==",
+          "requires": {
+            "micromatch": "3.1.9",
+            "normalize-path": "2.1.1"
+          }
+        },
+        "chokidar": {
+          "version": "2.0.2",
+          "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-2.0.2.tgz",
+          "integrity": "sha512-l32Hw3wqB0L2kGVmSbK/a+xXLDrUEsc84pSgMkmwygHvD7ubRsP/vxxHa5BtB6oix1XLLVCHyYMsckRXxThmZw==",
+          "requires": {
+            "anymatch": "2.0.0",
+            "async-each": "1.0.1",
+            "braces": "2.3.1",
+            "glob-parent": "3.1.0",
+            "inherits": "2.0.3",
+            "is-binary-path": "1.0.1",
+            "is-glob": "4.0.0",
+            "normalize-path": "2.1.1",
+            "path-is-absolute": "1.0.1",
+            "readdirp": "2.1.0",
+            "upath": "1.0.4"
+          }
+        },
+        "glob-parent": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-3.1.0.tgz",
+          "integrity": "sha1-nmr2KZ2NO9K9QEMIMr0RPfkGxa4=",
+          "requires": {
+            "is-glob": "3.1.0",
+            "path-dirname": "1.0.2"
+          },
+          "dependencies": {
+            "is-glob": {
+              "version": "3.1.0",
+              "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz",
+              "integrity": "sha1-e6WuJCF4BKxwcHuWkiVnSGzD6Eo=",
+              "requires": {
+                "is-extglob": "2.1.1"
+              }
+            }
+          }
+        },
+        "is-extglob": {
+          "version": "2.1.1",
+          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
+          "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI="
+        },
+        "is-glob": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.0.tgz",
+          "integrity": "sha1-lSHHaEXMJhCoUgPd8ICpWML/q8A=",
+          "requires": {
+            "is-extglob": "2.1.1"
+          }
+        }
       }
     },
     "wbuf": {
@@ -15067,9 +15178,9 @@
       "resolved": "https://registry.npmjs.org/webpack/-/webpack-3.11.0.tgz",
       "integrity": "sha512-3kOFejWqj5ISpJk4Qj/V7w98h9Vl52wak3CLiw/cDOfbVTq7FeoZ0SdoHHY9PYlHr50ZS42OfvzE2vB4nncKQg==",
       "requires": {
-        "acorn": "5.4.1",
+        "acorn": "5.5.0",
         "acorn-dynamic-import": "2.0.2",
-        "ajv": "6.1.1",
+        "ajv": "6.2.0",
         "ajv-keywords": "3.1.0",
         "async": "2.6.0",
         "enhanced-resolve": "3.4.1",
@@ -15086,31 +15197,26 @@
         "supports-color": "4.5.0",
         "tapable": "0.2.8",
         "uglifyjs-webpack-plugin": "0.4.6",
-        "watchpack": "1.4.0",
+        "watchpack": "1.5.0",
         "webpack-sources": "1.1.0",
         "yargs": "8.0.2"
       },
       "dependencies": {
         "acorn": {
-          "version": "5.4.1",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.4.1.tgz",
-          "integrity": "sha512-XLmq3H/BVvW6/GbxKryGxWORz1ebilSsUDlyC27bXhWGWAZWkGwS6FLHjOlwFXNFoWFQEO/Df4u0YYd0K3BQgQ=="
+          "version": "5.5.0",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.5.0.tgz",
+          "integrity": "sha512-arn53F07VXmls4o4pUhSzBa4fvaagPRe7AVZ8l7NHxFWUie2DsuFSBMMNAkgzRlOhEhzAnxeKyaWVzOH4xqp/g=="
         },
         "ajv": {
-          "version": "6.1.1",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.1.1.tgz",
-          "integrity": "sha1-l41Zf7wrfQ5aXD3esUmmgvKr+g4=",
+          "version": "6.2.0",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.2.0.tgz",
+          "integrity": "sha1-r6wpW7qgFSRJ5SJ0LkVHwa6TKNI=",
           "requires": {
-            "fast-deep-equal": "1.0.0",
+            "fast-deep-equal": "1.1.0",
             "fast-json-stable-stringify": "2.0.0",
             "json-schema-traverse": "0.3.1"
           }
         },
-        "ajv-keywords": {
-          "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.1.0.tgz",
-          "integrity": "sha1-rCsnk5xUPpXSwG5/f1wnvkqlQ74="
-        },
         "enhanced-resolve": {
           "version": "3.4.1",
           "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.4.1.tgz",
@@ -15163,11 +15269,11 @@
       }
     },
     "webpack-bundle-analyzer": {
-      "version": "2.10.0",
-      "resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.10.0.tgz",
-      "integrity": "sha512-eA/9F/ZLFlVXfCLYqefHFbelJ3JcvyeFdmpAG6Vu3iJNcisj3KWNPqu00lCqK9caeaesipVrGb9alUSi2lEvAg==",
+      "version": "2.11.0",
+      "resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.11.0.tgz",
+      "integrity": "sha512-GGz//de6DHqKIBN75vRPUqwTUobgYCzygS+ei/Z5wRpKYEZ+HO2e8Pd6CbQewGfofjRHoCFqL10pi2lu+/fqDg==",
       "requires": {
-        "acorn": "5.4.1",
+        "acorn": "5.5.0",
         "bfj-node4": "5.2.1",
         "chalk": "2.3.1",
         "commander": "2.14.1",
@@ -15178,13 +15284,13 @@
         "lodash": "4.17.5",
         "mkdirp": "0.5.1",
         "opener": "1.4.3",
-        "ws": "4.0.0"
+        "ws": "4.1.0"
       },
       "dependencies": {
         "acorn": {
-          "version": "5.4.1",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.4.1.tgz",
-          "integrity": "sha512-XLmq3H/BVvW6/GbxKryGxWORz1ebilSsUDlyC27bXhWGWAZWkGwS6FLHjOlwFXNFoWFQEO/Df4u0YYd0K3BQgQ=="
+          "version": "5.5.0",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.5.0.tgz",
+          "integrity": "sha512-arn53F07VXmls4o4pUhSzBa4fvaagPRe7AVZ8l7NHxFWUie2DsuFSBMMNAkgzRlOhEhzAnxeKyaWVzOH4xqp/g=="
         },
         "gzip-size": {
           "version": "4.1.0",
@@ -15215,15 +15321,15 @@
       }
     },
     "webpack-dev-server": {
-      "version": "2.11.1",
-      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.11.1.tgz",
-      "integrity": "sha512-ombhu5KsO/85sVshIDTyQ5HF3xjZR3N0sf5Ao6h3vFwpNyzInEzA1GV3QPVjTMLTNckp8PjfG1PFGznzBwS5lg==",
+      "version": "2.11.2",
+      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.11.2.tgz",
+      "integrity": "sha512-zrPoX97bx47vZiAXfDrkw8pe9QjJ+lunQl3dypojyWwWr1M5I2h0VSrMPfTjopHQPRNn+NqfjcMmhoLcUJe2gA==",
       "requires": {
         "ansi-html": "0.0.7",
         "array-includes": "3.0.3",
         "bonjour": "3.5.0",
-        "chokidar": "2.0.1",
-        "compression": "1.7.1",
+        "chokidar": "2.0.2",
+        "compression": "1.7.2",
         "connect-history-api-fallback": "1.5.0",
         "debug": "3.1.0",
         "del": "3.0.0",
@@ -15253,18 +15359,18 @@
           "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-2.0.0.tgz",
           "integrity": "sha512-5teOsQWABXHHBFP9y3skS5P3d/WfWXpv3FUpy+LorMrNYaT9pI4oLMQX7jzQ2KklNpGpWHzdCXTDT2Y3XGlZBw==",
           "requires": {
-            "micromatch": "3.1.5",
+            "micromatch": "3.1.9",
             "normalize-path": "2.1.1"
           }
         },
         "chokidar": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-2.0.1.tgz",
-          "integrity": "sha512-rv5iP8ENhpqvDWr677rAXcB+SMoPQ1urd4ch79+PhM4lQwbATdJUQK69t0lJIKNB+VXpqxt5V1gvqs59XEPKnw==",
+          "version": "2.0.2",
+          "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-2.0.2.tgz",
+          "integrity": "sha512-l32Hw3wqB0L2kGVmSbK/a+xXLDrUEsc84pSgMkmwygHvD7ubRsP/vxxHa5BtB6oix1XLLVCHyYMsckRXxThmZw==",
           "requires": {
             "anymatch": "2.0.0",
             "async-each": "1.0.1",
-            "braces": "2.3.0",
+            "braces": "2.3.1",
             "glob-parent": "3.1.0",
             "inherits": "2.0.3",
             "is-binary-path": "1.0.1",
@@ -15272,7 +15378,7 @@
             "normalize-path": "2.1.1",
             "path-is-absolute": "1.0.1",
             "readdirp": "2.1.0",
-            "upath": "1.0.0"
+            "upath": "1.0.4"
           }
         },
         "debug": {
@@ -15326,9 +15432,9 @@
       }
     },
     "webpack-hot-middleware": {
-      "version": "2.21.0",
-      "resolved": "https://registry.npmjs.org/webpack-hot-middleware/-/webpack-hot-middleware-2.21.0.tgz",
-      "integrity": "sha512-P6xiOLy10QlSVSO7GanU9PLxN6zLLQ7RG16MPTvmFwf2KUG7jMp6m+fmdgsR7xoaVVLA7OlX3YO6JjoZEKjCuA==",
+      "version": "2.21.1",
+      "resolved": "https://registry.npmjs.org/webpack-hot-middleware/-/webpack-hot-middleware-2.21.1.tgz",
+      "integrity": "sha512-HaxZpATbq/bpuduum2i79pgE1vpSFfV2BVUyYi4lhocTJ5xpofWuYCCmd0c6eoJjY8szCuM5TsQk3M59Z9jpwA==",
       "requires": {
         "ansi-html": "0.0.7",
         "html-entities": "1.2.1",
@@ -15460,11 +15566,11 @@
       "integrity": "sha1-o9XabNXAvAAI03I0u68b7WMFkQc="
     },
     "worker-farm": {
-      "version": "1.5.2",
-      "resolved": "https://registry.npmjs.org/worker-farm/-/worker-farm-1.5.2.tgz",
-      "integrity": "sha512-XxiQ9kZN5n6mmnW+mFJ+wXjNNI/Nx4DIdaAKLX1Bn6LYBWlN/zaBhu34DQYPZ1AJobQuu67S2OfDdNSVULvXkQ==",
+      "version": "1.5.4",
+      "resolved": "https://registry.npmjs.org/worker-farm/-/worker-farm-1.5.4.tgz",
+      "integrity": "sha512-ITyClEvcfv0ozqJl1vmWFWhvI+OIrkbInYqkEPE50wFPXj8J9Gd3FYf8+CkZJXJJsQBYe+2DvmoK9Zhx5w8W+w==",
       "requires": {
-        "errno": "0.1.6",
+        "errno": "0.1.7",
         "xtend": "4.0.1"
       }
     },
@@ -15550,13 +15656,12 @@
       }
     },
     "ws": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-4.0.0.tgz",
-      "integrity": "sha512-QYslsH44bH8O7/W2815u5DpnCpXWpEK44FmaHffNwgJI4JMaSZONgPBTOfrxJ29mXKbXak+LsJ2uAkDTYq2ptQ==",
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-4.1.0.tgz",
+      "integrity": "sha512-ZGh/8kF9rrRNffkLFV4AzhvooEclrOH0xaugmqGsIfFgOE/pIz4fMc4Ef+5HSQqTEug2S9JZIWDR47duDSLfaA==",
       "requires": {
         "async-limiter": "1.0.0",
-        "safe-buffer": "5.1.1",
-        "ultron": "1.1.1"
+        "safe-buffer": "5.1.1"
       }
     },
     "xdg-basedir": {
diff --git a/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx b/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
index 8461dfeb7d4fa..22666689d3fc2 100644
--- a/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
+++ b/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
@@ -28,7 +28,7 @@ export interface IComponentPageProps {
   areBadgesVisible?: boolean;
   className?: string;
   componentStatus?: JSX.Element;
-  otherSections?: [IComponentPageSection];
+  otherSections?: IComponentPageSection[];
 }
 
 export class ComponentPage extends React.Component<IComponentPageProps, {}> {
diff --git a/packages/merge-styles/src/Stylesheet.ts b/packages/merge-styles/src/Stylesheet.ts
index 594a4acd03a14..20cda8757e20f 100644
--- a/packages/merge-styles/src/Stylesheet.ts
+++ b/packages/merge-styles/src/Stylesheet.ts
@@ -50,16 +50,16 @@ let _stylesheet: Stylesheet;
  * @public
  */
 export class Stylesheet {
-  private _styleElement: HTMLStyleElement;
-  private _rules: string[];
+  private _styleElement!: HTMLStyleElement;
+  private _rules!: string[];
   private _config: IStyleSheetConfig;
-  private _rulesToInsert: string[];
-  private _timerId: number;
-  private _counter: number;
-  private _keyToClassName: { [key: string]: string };
+  private _rulesToInsert!: string[];
+  private _timerId!: number;
+  private _counter!: number;
+  private _keyToClassName!: { [key: string]: string };
 
   // tslint:disable-next-line:no-any
-  private _classNameToArgs: { [key: string]: { args: any, rules: string[] } };
+  private _classNameToArgs!: { [key: string]: { args: any, rules: string[] } };
 
   /**
    * Gets the singleton instance.
diff --git a/packages/merge-styles/src/concatStyleSets.ts b/packages/merge-styles/src/concatStyleSets.ts
index 6068fa557682e..98b314a88176c 100644
--- a/packages/merge-styles/src/concatStyleSets.ts
+++ b/packages/merge-styles/src/concatStyleSets.ts
@@ -6,7 +6,7 @@ export function concatStyleSets<T extends object>(
   ...args: (T | false | null | undefined)[]
 ): T {
   // tslint:disable-next-line:no-any
-  const mergedSet: T = {} as any;
+  const mergedSet = {} as any;
 
   for (const currentSet of args) {
     if (currentSet) {
@@ -28,5 +28,5 @@ export function concatStyleSets<T extends object>(
     }
   }
 
-  return mergedSet;
+  return mergedSet as T;
 }
\ No newline at end of file
diff --git a/packages/merge-styles/src/mergeStyleSets.test.ts b/packages/merge-styles/src/mergeStyleSets.test.ts
index de2a4368c86f6..43201a9c25e84 100644
--- a/packages/merge-styles/src/mergeStyleSets.test.ts
+++ b/packages/merge-styles/src/mergeStyleSets.test.ts
@@ -18,8 +18,9 @@ describe('mergeStyleSets', () => {
   });
 
   it('can merge style sets', () => {
+    const empty: { c?: string } = {};
     const result: { root: string, a: string, b: string } = mergeStyleSets(
-      {},
+      empty,
       {
         root: { background: 'red' },
         a: { background: 'green' }
diff --git a/packages/merge-styles/src/mergeStyleSets.ts b/packages/merge-styles/src/mergeStyleSets.ts
index ad617684f4442..a5980e8d3dced 100644
--- a/packages/merge-styles/src/mergeStyleSets.ts
+++ b/packages/merge-styles/src/mergeStyleSets.ts
@@ -9,9 +9,9 @@ import { styleToRegistration, applyRegistration } from './styleToClassName';
  *
  * @public
  */
-export function mergeStyleSets<T>(
-  ...cssSets: ({[P in keyof T]?: IStyle } | null | undefined)[]
-): T {
+export function mergeStyleSets<K extends string>(
+  ...cssSets: ({[P in K]?: IStyle } | null | undefined)[]
+): {[P in K]: string} {
   // tslint:disable-next-line:no-any
   const classNameSet: any = {};
   const classMap: { [key: string]: string } = {};
@@ -49,5 +49,5 @@ export function mergeStyleSets<T>(
     }
   }
 
-  return classNameSet as T;
+  return classNameSet;
 }
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.styles.ts b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.styles.ts
index 210f64e66ae09..70ecb5b24b100 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.styles.ts
@@ -17,8 +17,8 @@ export interface IPositioningContainerNames {
   container: string;
   main: string;
   overFlowYHidden: string;
-  beak: string;
-  beakCurtain: string;
+  beak?: string;
+  beakCurtain?: string;
 }
 
 // @TODO Remove this tslint disable statement after the styles are converted
diff --git a/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusPage.tsx b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusPage.tsx
index 20d894d9a14e1..f8711dae7a53b 100644
--- a/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusPage.tsx
+++ b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusPage.tsx
@@ -8,7 +8,7 @@ import './ComponentStatusPage.scss';
 
 export class ComponentStatusPage extends React.Component<{}, {}> {
   public render() {
-    const sections: [IComponentPageSection] = [{ title: 'Badges', section: this._renderStatusesInfo() }, { title: 'Status', section: this._renderComponents() }];
+    const sections: IComponentPageSection[] = [{ title: 'Badges', section: this._renderStatusesInfo() }, { title: 'Status', section: this._renderComponents() }];
 
     return (
       <ComponentPage
@@ -48,7 +48,7 @@ export class ComponentStatusPage extends React.Component<{}, {}> {
       <tr key={ componentName + '-key' }>
         <th className='componentCells'><h3>{ componentName } </h3> </th>
         <td className='componentBadgeCell'><ComponentStatus
-          {...component}
+          { ...component }
         /></td>
       </tr >
     );
diff --git a/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusState.tsx b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusState.tsx
index eaa20549e9edf..9ab588dd6f1c6 100644
--- a/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusState.tsx
+++ b/packages/office-ui-fabric-react/src/demo/ComponentStatus/ComponentStatusState.tsx
@@ -10,7 +10,7 @@ export interface InformationLink {
   renderedText: string;
 }
 
-export const ComponentStatusInfoState: [IComponentStatusInfoState] = [
+export const ComponentStatusInfoState: IComponentStatusInfoState[] = [
   {
     name: 'Keyboard Accessibility Support',
     description: 'Components should be fully usable with the keyboard.',
diff --git a/packages/utilities/src/classNamesFunction.ts b/packages/utilities/src/classNamesFunction.ts
index e77a42777208e..a973855d255d5 100644
--- a/packages/utilities/src/classNamesFunction.ts
+++ b/packages/utilities/src/classNamesFunction.ts
@@ -1,4 +1,4 @@
-import { mergeStyleSets } from '@uifabric/merge-styles/lib/index';
+import { mergeStyleSets, IStyle } from '@uifabric/merge-styles/lib/index';
 import { IClassNames } from './IClassNames';
 import { IStyleFunction } from './IStyleFunction';
 
@@ -6,7 +6,7 @@ import { IStyleFunction } from './IStyleFunction';
  * Creates a getClassNames function which calls getStyles given the props, and injects them
  * into mergeStyleSets.
  */
-export function classNamesFunction<TStyleProps extends {}, TStyles extends {}>(): (
+export function classNamesFunction<TStyleProps extends {}, TStyles extends {[P in keyof TStyles]: IStyle}>(): (
   getStyles?: IStyleFunction<TStyleProps, TStyles>,
   styleProps?: TStyleProps
 ) => IClassNames<TStyles> {
diff --git a/scripts/package.json b/scripts/package.json
index a1f94166c4b7f..e5eb9584408b1 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -38,7 +38,7 @@
     "style-loader": "^0.19.0",
     "tslint": "^5.7.0",
     "tslint-microsoft-contrib": "^5.0.1",
-    "typescript": "2.6.2",
+    "typescript": "2.7.2",
     "uglifyjs-webpack-plugin": "^0.4.6",
     "webpack": "^3.7.1",
     "webpack-bundle-analyzer": "^2.9.0",
@@ -52,4 +52,4 @@
       "maxSize": "44.5 kB"
     }
   ]
-}
+}
\ No newline at end of file

From 73809a7f38db63f24b8c44b7464e4578f1de4004 Mon Sep 17 00:00:00 2001
From: natalieethell <yummyraspberries@gmail.com>
Date: Thu, 1 Mar 2018 20:33:45 -0800
Subject: [PATCH 1486/1641] Aria selected (#4161)

* do not include aria-selected if selectionMode is SelectionMode.none

* change file

* Update aria-selected_2018-03-02-01-49.json
---
 .../aria-selected_2018-03-02-01-49.json               | 11 +++++++++++
 .../src/components/DetailsList/DetailsRow.tsx         |  3 ++-
 2 files changed, 13 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/aria-selected_2018-03-02-01-49.json

diff --git a/common/changes/office-ui-fabric-react/aria-selected_2018-03-02-01-49.json b/common/changes/office-ui-fabric-react/aria-selected_2018-03-02-01-49.json
new file mode 100644
index 0000000000000..a2574c21d8025
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/aria-selected_2018-03-02-01-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: only adding `aria-selected` when `selectionMode` is set to `none`.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "naethell@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index 05e097ffd328a..a64dafd6a7a6e 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -198,6 +198,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
     const canSelect = selection.canSelectItem!(item);
     const isContentUnselectable = selectionMode === SelectionMode.multiple;
     const showCheckbox = selectionMode !== SelectionMode.none && checkboxVisibility !== CheckboxVisibility.hidden;
+    const ariaSelected = (selectionMode === SelectionMode.none) ? undefined : isSelected;
 
     return (
       <FocusZone
@@ -229,7 +230,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
         draggable={ isDraggable }
         data-automationid='DetailsRow'
         style={ { minWidth: viewport ? viewport.width : 0 } }
-        aria-selected={ isSelected }
+        aria-selected={ ariaSelected }
         allowFocusRoot={ true }
       >
         { showCheckbox && (

From eaeab40bb9326368c3c2a69d2430b69a27062962 Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Thu, 1 Mar 2018 20:36:39 -0800
Subject: [PATCH 1487/1641] Addressing Issue #4143 - is-selected missing on
 ms-Nav-link (#4158)

* added is-selected and is-expanded classes to compositelink style sets

* rush change
---
 .../nav-isselected-4143_2018-03-01-23-30.json         | 11 +++++++++++
 .../src/components/Nav/Nav.styles.ts                  |  4 +++-
 2 files changed, 14 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/nav-isselected-4143_2018-03-01-23-30.json

diff --git a/common/changes/office-ui-fabric-react/nav-isselected-4143_2018-03-01-23-30.json b/common/changes/office-ui-fabric-react/nav-isselected-4143_2018-03-01-23-30.json
new file mode 100644
index 0000000000000..4c5e4f1d518ef
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/nav-isselected-4143_2018-03-01-23-30.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added is-selected and is-expanded semantic classes to compositelink style sets",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.styles.ts b/packages/office-ui-fabric-react/src/components/Nav/Nav.styles.ts
index 816a978de43bd..eced66f8129c4 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.styles.ts
@@ -75,7 +75,9 @@ export const getStyles = (
         position: 'relative',
         color: semanticColors.bodyText,
         backgroundColor: semanticColors.bodyBackground,
-      }
+      },
+      isExpanded && 'is-expanded',
+      isSelected && 'is-selected'
     ],
     link: [
       'ms-Nav-link',

From 8efbccec0c8826aa19b59d683d0bf29bd628dbf2 Mon Sep 17 00:00:00 2001
From: natalieethell <yummyraspberries@gmail.com>
Date: Thu, 1 Mar 2018 21:06:19 -0800
Subject: [PATCH 1488/1641] add check for when this.suggestionElement may be
 undefined (#4157)

* add check for when this.suggestionElement may be undefined

* change file

* Update suggestionElement_2018-03-02-01-56.json
---
 .../suggestionElement_2018-03-02-01-56.json           | 11 +++++++++++
 .../src/components/pickers/BasePicker.tsx             |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/suggestionElement_2018-03-02-01-56.json

diff --git a/common/changes/office-ui-fabric-react/suggestionElement_2018-03-02-01-56.json b/common/changes/office-ui-fabric-react/suggestionElement_2018-03-02-01-56.json
new file mode 100644
index 0000000000000..e20dad7e99ead
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/suggestionElement_2018-03-02-01-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "BasePicker: check for null reference before checking value of `this.suggestionElement`.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "naethell@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index eb76ad0991b95..f1427cb13114d 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -457,7 +457,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
       case KeyCodes.tab:
       case KeyCodes.enter:
-        if (this.suggestionElement.hasSuggestedActionSelected()) {
+        if (this.suggestionElement && this.suggestionElement.hasSuggestedActionSelected()) {
           this.suggestionElement.executeSelectedAction();
         } else if (!ev.shiftKey && this.suggestionStore.hasSelectedSuggestion() && this.state.suggestionsVisible) {
           this.completeSuggestion();

From d4f91e9dd14f11e9a98561d0090fa1d0853ecd20 Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Thu, 1 Mar 2018 21:31:46 -0800
Subject: [PATCH 1489/1641] CommandBar: Fixed null commandItemWidths (#4136)

* CommandBar: Fixed null commandItemWidths

* added async measure

* Change file

* Update magellan-commandItemWidthNull_2018-02-28-21-58.json
---
 ...agellan-commandItemWidthNull_2018-02-28-21-58.json | 11 +++++++++++
 .../src/components/CommandBar/CommandBar.tsx          |  7 ++++++-
 2 files changed, 17 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/magellan-commandItemWidthNull_2018-02-28-21-58.json

diff --git a/common/changes/office-ui-fabric-react/magellan-commandItemWidthNull_2018-02-28-21-58.json b/common/changes/office-ui-fabric-react/magellan-commandItemWidthNull_2018-02-28-21-58.json
new file mode 100644
index 0000000000000..f693b6625c9d8
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/magellan-commandItemWidthNull_2018-02-28-21-58.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "CommandBar: Fixed case where commandItemWidths would be null",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 9d1c8f1b0cb10..32a28d9298558 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -355,9 +355,14 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
       availableWidth -= this._overflowWidth;
     }
 
+    if (!this._commandItemWidths) {
+      this._asyncMeasure();
+      return;
+    }
+
     for (let i = 0; i < renderedItems.length; i++) {
       const item = renderedItems[i];
-      const itemWidth = this._commandItemWidths![item.key];
+      const itemWidth = this._commandItemWidths[item.key];
 
       if ((consumedWidth + itemWidth) >= availableWidth) {
         if (i > 0 && !isOverflowVisible && (availableWidth - consumedWidth) < OVERFLOW_WIDTH) {

From 55231a8018313d0d46e2fb718fd4487d1d41eb5f Mon Sep 17 00:00:00 2001
From: Joshua Rush <jdrush89@gmail.com>
Date: Fri, 2 Mar 2018 00:34:04 -0500
Subject: [PATCH 1490/1641] Allow Elements as Callout targets (#4134)

* Allow Elements as Callout targets

* Adding change request file

* Changing param type of getWindow rootElement

* Changing target proptype for ContextualMenu to Element
---
 ...ts-As-Callout-Targets_2018-02-28-19-13.json | 11 +++++++++++
 .../src/components/Callout/Callout.test.tsx    |  2 +-
 .../src/components/Callout/Callout.types.ts    |  4 ++--
 .../components/Callout/CalloutContent.base.tsx | 12 ++++++------
 .../ContextualMenu/ContextualMenu.tsx          | 12 ++++++------
 .../ContextualMenu/ContextualMenu.types.ts     |  8 ++++----
 .../src/utilities/positioning/positioning.ts   | 18 +++++++++---------
 .../utilities/positioning/positioning.types.ts |  2 +-
 packages/utilities/src/dom.ts                  |  2 +-
 9 files changed, 41 insertions(+), 30 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jdrush89-Allow-The-Use-Of-Elements-As-Callout-Targets_2018-02-28-19-13.json

diff --git a/common/changes/office-ui-fabric-react/jdrush89-Allow-The-Use-Of-Elements-As-Callout-Targets_2018-02-28-19-13.json b/common/changes/office-ui-fabric-react/jdrush89-Allow-The-Use-Of-Elements-As-Callout-Targets_2018-02-28-19-13.json
new file mode 100644
index 0000000000000..5eb2d3ec1c5ea
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jdrush89-Allow-The-Use-Of-Elements-As-Callout-Targets_2018-02-28-19-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Allowing use of Elements as target prop for Callouts and ContextualMenus",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jdrush89@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx b/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
index f0807c4504e37..6e677f78e71ac 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
@@ -84,7 +84,7 @@ describe('Callout', () => {
     expect(threwException).toEqual(false);
   });
 
-  it('target HTMLElements does not throw exception', () => {
+  it('target Elements does not throw exception', () => {
     const targetElement = document.createElement('div');
     document.body.appendChild(targetElement);
     let threwException = false;
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts b/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
index 82c5f6f83e73f..21a210184f528 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
@@ -23,10 +23,10 @@ export interface ICalloutProps {
 
   /**
    * The target that the Callout should try to position itself based on.
-   * It can be either an HTMLElement a querySelector string of a valid HTMLElement
+   * It can be either an Element a querySelector string of a valid Element
    * or a MouseEvent. If MouseEvent is given then the origin point of the event will be used.
    */
-  target?: HTMLElement | string | MouseEvent | IPoint | null;
+  target?: Element | string | MouseEvent | IPoint | null;
 
   /**
    * How the element should be positioned
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
index 599cf3a1333e4..089d962c3184e 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
@@ -77,7 +77,7 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
   private _bounds: IRectangle;
   private _maxHeight: number | undefined;
   private _positionAttempts: number;
-  private _target: HTMLElement | MouseEvent | IPoint | null;
+  private _target: Element | MouseEvent | IPoint | null;
   private _setHeightOffsetTimer: number;
 
   constructor(props: ICalloutProps) {
@@ -384,17 +384,17 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
     return true;
   }
 
-  private _setTargetWindowAndElement(target: HTMLElement | string | MouseEvent | IPoint | null): void {
+  private _setTargetWindowAndElement(target: Element | string | MouseEvent | IPoint | null): void {
     if (target) {
       if (typeof target === 'string') {
         const currentDoc: Document = getDocument()!;
-        this._target = currentDoc ? currentDoc.querySelector(target) as HTMLElement : null;
+        this._target = currentDoc ? currentDoc.querySelector(target) as Element : null;
         this._targetWindow = getWindow()!;
       } else if ((target as MouseEvent).stopPropagation) {
         this._targetWindow = getWindow((target as MouseEvent).toElement as HTMLElement)!;
         this._target = target;
-      } else if ((target as HTMLElement).getBoundingClientRect) {
-        const targetElement: HTMLElement = target as HTMLElement;
+      } else if ((target as Element).getBoundingClientRect) {
+        const targetElement: Element = target as Element;
         this._targetWindow = getWindow(targetElement)!;
         this._target = target;
         // HTMLImgElements can have x and y values. The check for it being a point must go last.
@@ -428,7 +428,7 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
     }
   }
 
-  private _getTarget(props: ICalloutProps = this.props): HTMLElement | string | MouseEvent | IPoint | null {
+  private _getTarget(props: ICalloutProps = this.props): Element | string | MouseEvent | IPoint | null {
     const { useTargetPoint, targetPoint, target } = props;
     return useTargetPoint ? targetPoint! : target!;
   }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 12682830a5ebb..37fb495cd1b4b 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -45,8 +45,8 @@ export interface IContextualMenuState {
   expandedMenuItemKey?: string;
   dismissedMenuItemKey?: string;
   contextualMenuItems?: IContextualMenuItem[];
-  contextualMenuTarget?: HTMLElement;
-  submenuTarget?: HTMLElement;
+  contextualMenuTarget?: Element;
+  submenuTarget?: Element;
   positions?: any;
   slideDirectionalClassName?: string;
   subMenuId?: string;
@@ -93,7 +93,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   private _isFocusingPreviousElement: boolean;
   private _enterTimerId: number | undefined;
   private _targetWindow: Window;
-  private _target: HTMLElement | MouseEvent | IPoint | null;
+  private _target: Element | MouseEvent | IPoint | null;
   private _classNames: IContextualMenuClassNames;
   private _isScrollIdle: boolean;
   private readonly _navigationIdleDelay: number = 250 /* ms */;
@@ -945,11 +945,11 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     }
   }
 
-  private _setTargetWindowAndElement(target: HTMLElement | string | MouseEvent | IPoint): void {
+  private _setTargetWindowAndElement(target: Element | string | MouseEvent | IPoint): void {
     if (target) {
       if (typeof target === 'string') {
         const currentDoc: Document = getDocument()!;
-        this._target = currentDoc ? currentDoc.querySelector(target) as HTMLElement : null;
+        this._target = currentDoc ? currentDoc.querySelector(target) as Element : null;
         this._targetWindow = getWindow()!;
       } else if ((target as MouseEvent).stopPropagation) {
         this._targetWindow = getWindow((target as MouseEvent).toElement as HTMLElement)!;
@@ -958,7 +958,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
         this._targetWindow = getWindow()!;
         this._target = target;
       } else {
-        const targetElement: HTMLElement = target as HTMLElement;
+        const targetElement: Element = target as Element;
         this._targetWindow = getWindow(targetElement)!;
         this._target = target;
       }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
index 180a1aa61f411..5036434553dc9 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
@@ -38,10 +38,10 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
 
   /**
    * The target that the ContextualMenu should try to position itself based on.
-   * It can be either an HTMLElement a querySelector string of a valid HTMLElement
+   * It can be either an Element a querySelector string of a valid Element
    * or a MouseEvent. If MouseEvent is given then the origin point of the event will be used.
    */
-  target?: HTMLElement | string | MouseEvent | IPoint | null;
+  target?: Element | string | MouseEvent | IPoint | null;
 
   /**
    * How the element should be positioned
@@ -227,8 +227,8 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
    * @default ContextualMenuItem
    */
   contextualMenuItemAs?:
-    React.ComponentClass<IContextualMenuItemProps> |
-    React.StatelessComponent<IContextualMenuItemProps>;
+  React.ComponentClass<IContextualMenuItemProps> |
+  React.StatelessComponent<IContextualMenuItemProps>;
 
   /**
    * Props to pass down to the FocusZone.
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts b/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts
index f477ae46fdaf8..e2bd20e71a83d 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning/positioning.ts
@@ -421,7 +421,7 @@ export namespace positioningFunctions {
   ): IPartialIRectangle {
     const returnValue: IPartialIRectangle = {};
 
-    const hostRect: Rectangle = _getRectangleFromHTMLElement(hostElement);
+    const hostRect: Rectangle = _getRectangleFromElement(hostElement);
     const elementEdge = targetEdge * -1;
     const elementEdgeString = RectangleEdge[elementEdge];
     const returnEdge = alignmentEdge ? alignmentEdge : _getFlankingEdges(targetEdge).positiveEdge;
@@ -566,7 +566,7 @@ export namespace positioningFunctions {
     return beakPositon;
   }
 
-  export function _getRectangleFromHTMLElement(element: HTMLElement): Rectangle {
+  export function _getRectangleFromElement(element: Element): Rectangle {
     const clientRect: ClientRect = element.getBoundingClientRect();
 
     return new Rectangle(clientRect.left, clientRect.right, clientRect.top, clientRect.bottom);
@@ -576,14 +576,14 @@ export namespace positioningFunctions {
     return new Rectangle(rect.left, rect.right, rect.top, rect.bottom);
   }
 
-  export function _getTargetRect(bounds: Rectangle, target: HTMLElement | MouseEvent | IPoint | undefined) {
+  export function _getTargetRect(bounds: Rectangle, target: Element | MouseEvent | IPoint | undefined) {
     let targetRectangle: Rectangle;
     if (target) {
       if ((target as MouseEvent).preventDefault) {
         const ev = target as MouseEvent;
         targetRectangle = new Rectangle(ev.clientX, ev.clientX, ev.clientY, ev.clientY);
-      } else if ((target as HTMLElement).getBoundingClientRect) {
-        targetRectangle = _getRectangleFromHTMLElement(target as HTMLElement);
+      } else if ((target as Element).getBoundingClientRect) {
+        targetRectangle = _getRectangleFromElement(target as Element);
         // HTMLImgElements can have x and y values. The check for it being a point must go last.
       } else {
         const point: IPoint = target as IPoint;
@@ -646,7 +646,7 @@ export namespace positioningFunctions {
       boundingRect,
       props.coverTarget);
     const positionedElement: IElementPosition = _positionElementWithinBounds(
-      _getRectangleFromHTMLElement(elementToPosition),
+      _getRectangleFromElement(elementToPosition),
       targetRect,
       boundingRect,
       positionData,
@@ -762,9 +762,9 @@ export function positionCallout(props: IPositionProps,
  * of the target given.
  * If no bounds are provided then the window is treated as the bounds.
  */
-export function getMaxHeight(target: HTMLElement | MouseEvent | IPoint, targetEdge: DirectionalHint, gapSpace: number = 0, bounds?: IRectangle) {
+export function getMaxHeight(target: Element | MouseEvent | IPoint, targetEdge: DirectionalHint, gapSpace: number = 0, bounds?: IRectangle) {
   const mouseTarget: MouseEvent = target as MouseEvent;
-  const elementTarget: HTMLElement = target as HTMLElement;
+  const elementTarget: Element = target as Element;
   const pointTarget: IPoint = target as IPoint;
   let targetRect: Rectangle;
   const boundingRectangle = bounds ?
@@ -776,7 +776,7 @@ export function getMaxHeight(target: HTMLElement | MouseEvent | IPoint, targetEd
   } else if (pointTarget.x !== undefined && pointTarget.y !== undefined) {
     targetRect = new Rectangle(pointTarget.x, pointTarget.x, pointTarget.y, pointTarget.y);
   } else {
-    targetRect = positioningFunctions._getRectangleFromHTMLElement(elementTarget);
+    targetRect = positioningFunctions._getRectangleFromElement(elementTarget);
   }
 
   return positioningFunctions._getMaxHeightFromTargetRectangle(targetRect, targetEdge, gapSpace, boundingRectangle);
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning/positioning.types.ts b/packages/office-ui-fabric-react/src/utilities/positioning/positioning.types.ts
index 247ad444ce729..831c57988c324 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning/positioning.types.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning/positioning.types.ts
@@ -17,7 +17,7 @@ export enum Position {
   end = 3
 }
 export interface IPositionProps {
-  target?: HTMLElement | MouseEvent | IPoint;
+  target?: Element | MouseEvent | IPoint;
   /** how the element should be positioned */
   directionalHint?: DirectionalHint;
   /**
diff --git a/packages/utilities/src/dom.ts b/packages/utilities/src/dom.ts
index d3250d1bbcbc0..b1091c89562e5 100644
--- a/packages/utilities/src/dom.ts
+++ b/packages/utilities/src/dom.ts
@@ -151,7 +151,7 @@ export function setSSR(isEnabled: boolean): void {
  *
  * @public
  */
-export function getWindow(rootElement?: HTMLElement): Window | undefined {
+export function getWindow(rootElement?: Element): Window | undefined {
   if (_isSSR || typeof window === 'undefined') {
     return undefined;
   } else {

From 4efa90a5cc8410929ff80406da1b249f73c41fe0 Mon Sep 17 00:00:00 2001
From: Mykhailo Bratukha <bratukha.m@gmail.com>
Date: Fri, 2 Mar 2018 06:34:58 +0100
Subject: [PATCH 1491/1641] BasePicker: Fix not used onBlur callback of
 inputProps (#4000) (#4131)

---
 .../src/components/pickers/BasePicker.tsx                      | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index f1427cb13114d..c3d5619d66945 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -441,6 +441,9 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   @autobind
   protected onInputBlur(ev: React.FocusEvent<HTMLInputElement | Autofill>) {
     this.setState({ isFocused: false });
+    if (this.props.inputProps && this.props.inputProps.onBlur) {
+      this.props.inputProps.onBlur(ev as React.FocusEvent<HTMLInputElement>);
+    }
   }
 
   @autobind

From 76e5ccc8a699c7bcf632a3dc9516621f42c9e157 Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Thu, 1 Mar 2018 21:36:26 -0800
Subject: [PATCH 1492/1641] Fix documentcard theming (#4155)

* make document card respect theme

* adding change file

* use better button color
---
 .../fix-documentcard-theming_2018-03-01-22-47.json    | 11 +++++++++++
 .../src/components/DocumentCard/DocumentCard.scss     |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-documentcard-theming_2018-03-01-22-47.json

diff --git a/common/changes/office-ui-fabric-react/fix-documentcard-theming_2018-03-01-22-47.json b/common/changes/office-ui-fabric-react/fix-documentcard-theming_2018-03-01-22-47.json
new file mode 100644
index 0000000000000..674af69334532
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-documentcard-theming_2018-03-01-22-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DocumentCard: Change it to use set theme",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.scss b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.scss
index ed04bdd8bdb51..f04b8bc98f117 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.scss
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.scss
@@ -103,7 +103,7 @@ $ms-DocumentCardActions-verticalPadding: 4px;
 
   :global(.ms-Button:hover) {
     :global(.ms-Button-icon) {
-      color: #1174c3;
+      color: $buttonTextColor;
       cursor: pointer;
     }
   }
@@ -162,7 +162,7 @@ $ms-DocumentCardActivity-personaTextGutter: 8px;
     top: -1px;
     right: -1px;
     bottom: -1px;
-    border: 2px solid #fafafa; // Match the background of the card
+    border: 2px solid $ms-color-white; // Match the background of the card
     border-radius: 50%;
   }
 }

From 9459022e4b48041b9e236b5f69a0fdf6f1cee505 Mon Sep 17 00:00:00 2001
From: Rohit Jindal <rohit.jindal@flipkart.com>
Date: Fri, 2 Mar 2018 13:00:38 +0530
Subject: [PATCH 1493/1641] Dropdown: Custom render options for multiselect -
 Bug fix #3571  (#3589)

* #3571 onRenderOption fix for Dropdown multiselect Mode

* Fixed Dropdown mutliselect onRenderOption #3571

* Fixed review comments

* Added change file to PR

* Update bugFix3571_2018-02-21-04-00.json
---
 .../bugFix3571_2018-02-21-04-00.json                  | 11 +++++++++++
 .../src/components/Dropdown/Dropdown.tsx              | 11 +++++++++--
 2 files changed, 20 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/bugFix3571_2018-02-21-04-00.json

diff --git a/common/changes/office-ui-fabric-react/bugFix3571_2018-02-21-04-00.json b/common/changes/office-ui-fabric-react/bugFix3571_2018-02-21-04-00.json
new file mode 100644
index 0000000000000..0a90657821fdc
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/bugFix3571_2018-02-21-04-00.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: Fixed custom render option in multi select.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jindal.rohit018@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 4066a07f1eab0..440bc78991b73 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -518,6 +518,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
               onMouseMove: this._onItemMouseMove.bind(this, item)
             } }
             label={ item.text }
+            onRenderLabel={ this._onRenderLabel.bind(this, item) }
             className={ css(
               'ms-ColumnManagementPanel-checkbox',
               styles.dropdownCheckbox,
@@ -536,8 +537,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
               checkboxCheckedHovered: checkboxStyles.checkboxChecked,
               textHovered: checkboxStyles.text
             } }
-          >{ onRenderOption(item, this._onRenderOption) }
-          </Checkbox>
+          />
         )
     );
   }
@@ -548,6 +548,13 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     return <span className={ css('ms-Dropdown-optionText', styles.optionText) }>{ item.text }</span>;
   }
 
+  // Render custom label for drop down item
+  @autobind
+  private _onRenderLabel(item: IDropdownOption) {
+    const { onRenderOption = this._onRenderOption } = this.props;
+    return onRenderOption(item, this._onRenderOption);
+  }
+
   @autobind
   private _onPositioned() {
     this._focusZone.focus();

From 1340339d7c62eeb1b526f08d9edbd7fe44b398f3 Mon Sep 17 00:00:00 2001
From: amyngu <31973030+amyngu@users.noreply.github.com>
Date: Thu, 1 Mar 2018 23:46:49 -0800
Subject: [PATCH 1494/1641] BaseExtendedPicker: Create contextmenu for
 renderedItem, fix auto focus (#3954)

* add some fixes

* create contextual menu item wrapper - convert results to promise in example

* add editing item margin, and fix on suggestionSelected focus

* add change file

* fix tslint issues
---
 ...-extendedPickerFixes_2018-02-12-22-44.json | 11 ++++
 .../ExtendedPicker/BaseExtendedPicker.tsx     |  3 +-
 .../ExtendedPeoplePicker.Basic.Example.tsx    | 13 ++--
 .../FloatingPicker/BaseFloatingPicker.tsx     | 34 +++++-----
 .../BaseFloatingPicker.types.ts               |  2 +-
 .../SelectedPeopleList/Items/EditingItem.scss |  5 ++
 .../SelectedPeopleList/Items/EditingItem.tsx  |  4 +-
 .../Items/ExtendedSelectedItem.tsx            | 25 +-------
 .../Items/SelectedItemWithContextMenu.tsx     | 63 +++++++++++++++++++
 .../SelectedPeopleList/SelectedPeopleList.tsx | 57 +++++++++++------
 10 files changed, 148 insertions(+), 69 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/amyngu-extendedPickerFixes_2018-02-12-22-44.json
 create mode 100644 packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/SelectedItemWithContextMenu.tsx

diff --git a/common/changes/@uifabric/experiments/amyngu-extendedPickerFixes_2018-02-12-22-44.json b/common/changes/@uifabric/experiments/amyngu-extendedPickerFixes_2018-02-12-22-44.json
new file mode 100644
index 0000000000000..5e73f2205e2cf
--- /dev/null
+++ b/common/changes/@uifabric/experiments/amyngu-extendedPickerFixes_2018-02-12-22-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "BaseExtendedPicker: Create component to wrap the rendered item, so users get contextual menu if certain props are present, get rid of loading state, fix autofocus on input after suggestion selection",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "amyngu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
index fda64e3fdbe45..3430f31ece89e 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
@@ -248,10 +248,11 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
     this.input.clear();
 
     this.floatingPicker.hidePicker();
+    this.focus();
   }
 
   @autobind
   protected _onSelectedItemsChanged(): void {
-    this.input.focus();
+    this.focus();
   }
 }
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
index 36cdd40ed5eb9..cd13f19e5e7a2 100644
--- a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
@@ -164,15 +164,15 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
   }
 
   @autobind
-  private _onFilterChanged(filterText: string, currentPersonas: IPersonaProps[], limitResults?: number): IPersonaProps[] {
+  private _onFilterChanged(filterText: string, currentPersonas: IPersonaProps[], limitResults?: number): Promise<IPersonaProps[]> | null {
     if (filterText) {
       let filteredPersonas: IPersonaProps[] = this._filterPersonasByText(filterText);
 
       filteredPersonas = this._removeDuplicates(filteredPersonas, currentPersonas);
       filteredPersonas = limitResults ? filteredPersonas.splice(0, limitResults) : filteredPersonas;
-      return filteredPersonas;
+      return this._convertResultsToPromise(filteredPersonas);
     } else {
-      return [];
+      return this._convertResultsToPromise([]);
     }
   }
 
@@ -180,7 +180,7 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
   private _returnMostRecentlyUsed(currentPersonas: IPersonaProps[]): IPersonaProps[] | Promise<IPersonaProps[]> {
     let { mostRecentlyUsed } = this.state;
     mostRecentlyUsed = this._removeDuplicates(mostRecentlyUsed, this._picker.items);
-    return mostRecentlyUsed;
+    return this._convertResultsToPromise(mostRecentlyUsed);
   }
 
   private _onCopyItems(items: IExtendedPersonaProps[]): string {
@@ -225,6 +225,11 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
     return persona.primaryText as string;
   }
 
+  private _convertResultsToPromise(results: IPersonaProps[]): Promise<IPersonaProps[]> {
+    // tslint:disable-next-line:no-any
+    return new Promise<IPersonaProps[]>((resolve: any, reject: any) => setTimeout(() => resolve(results), 150));
+  }
+
   @autobind
   private _validateInput(input: string): boolean {
     if (input.indexOf('@') !== -1) {
diff --git a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
index d682d8dc5dd57..b30e4fd5bd6e5 100644
--- a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
+++ b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
@@ -88,7 +88,6 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
       } else {
         this.updateValue(queryString);
       }
-
     }
   }
 
@@ -103,10 +102,13 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
       suggestionsVisible: true,
     });
 
-    if (this.state.queryString === '') {
-      this.updateSuggestionWithZeroState();
-    } else {
-      this.updateValue(this.state.queryString);
+    if (this.suggestionStore.suggestions.length === 0
+      || this.props.inputElement && this.props.inputElement.textContent !== this.state.queryString) {
+      if (this.state.queryString === '') {
+        this.updateSuggestionWithZeroState();
+      } else {
+        this.updateValue(this.state.queryString);
+      }
     }
   }
 
@@ -255,18 +257,9 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
         this.suggestionStore.updateSuggestions(suggestionsArray, 0);
       }
     } else if (suggestionsPromiseLike && suggestionsPromiseLike.then) {
-      if (!this.loadingTimer) {
-        this.loadingTimer = this._async.setTimeout(
-          () =>
-            this.setState({
-              suggestionsLoading: true
-            }),
-          500
-        );
-      }
-
-      // Clear suggestions
-      this.suggestionStore.updateSuggestions([]);
+      this.setState({
+        suggestionsLoading: true
+      });
 
       if (updatedValue !== undefined) {
         this.setState({
@@ -289,6 +282,7 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
           } else {
             this.suggestionStore.updateSuggestions(newSuggestions);
             this.setState({
+              suggestionsVisible: newSuggestions.length > 0,
               suggestionsLoading: false
             });
           }
@@ -483,9 +477,11 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
   }
 
   private _onResolveSuggestions(updatedValue: string): void {
-    let suggestions: T[] | PromiseLike<T[]> = this.props.onResolveSuggestions(updatedValue, this.props.selectedItems);
+    let suggestions: T[] | PromiseLike<T[]> | null = this.props.onResolveSuggestions(updatedValue, this.props.selectedItems);
 
-    this.updateSuggestionsList(suggestions, updatedValue);
+    if (suggestions !== null) {
+      this.updateSuggestionsList(suggestions, updatedValue);
+    }
   }
 
   @autobind
diff --git a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts
index 7261231864356..e12e929569c8d 100644
--- a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts
+++ b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts
@@ -46,7 +46,7 @@ export interface IBaseFloatingPickerProps<T> extends React.Props<any> {
    * Returns the already selected items so the resolver can filter them out.
    * If used in conjunction with resolveDelay this will ony kick off after the delay throttle.
    */
-  onResolveSuggestions: (filter: string, selectedItems?: T[]) => T[] | PromiseLike<T[]>;
+  onResolveSuggestions: (filter: string, selectedItems?: T[]) => T[] | PromiseLike<T[]> | null;
 
   /**
    * A callback for when the input has been changed
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.scss b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.scss
index b2332b1861a07..c2b4d2dbd7240 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.scss
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.scss
@@ -1,8 +1,13 @@
 .editingInput {
   border: 0px;
   outline: none;
+  width: 100%;
 
   &::-ms-clear {
     display: none;
   }
+}
+
+.editingContainer {
+  margin: 4px;
 }
\ No newline at end of file
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx
index 6678b842fa3bd..34b7a3230df6a 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx
@@ -1,7 +1,7 @@
 /* tslint:disable */
 import * as React from 'react';
 /* tslint:enable */
-import { BaseComponent, KeyCodes, autobind, getId, getNativeProps, inputProperties } from '../../../../Utilities';
+import { BaseComponent, KeyCodes, autobind, getId, getNativeProps, inputProperties, css } from '../../../../Utilities';
 import { FloatingPeoplePicker, IBaseFloatingPickerProps } from '../../../../FloatingPicker';
 import { ISelectedPeopleItemProps } from '../SelectedPeopleList';
 import { IExtendedPersonaProps } from '../SelectedPeopleList';
@@ -49,7 +49,7 @@ export class EditingItem extends BaseComponent<IEditingSelectedPeopleItemProps,
     const itemId = getId();
     const nativeProps = getNativeProps(this.props, inputProperties);
     return (
-      <div aria-labelledby={ 'editingItemPersona-' + itemId } className={ 'ms-EditingItem' }>
+      <div aria-labelledby={ 'editingItemPersona-' + itemId } className={ css('ms-EditingItem', styles.editingContainer) }>
         <input
           { ...nativeProps}
           ref={ this._resolveInputRef }
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx
index ca5d180fc8b64..5e0828ea315a3 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx
@@ -1,11 +1,10 @@
 /* tslint:disable */
 import * as React from 'react';
 /* tslint:enable */
-import { BaseComponent, autobind, css, getId } from '../../../../Utilities';
+import { BaseComponent, css, getId } from '../../../../Utilities';
 import { Persona, PersonaSize } from 'office-ui-fabric-react/lib/Persona';
 import { ISelectedPeopleItemProps } from '../SelectedPeopleList';
 import { IconButton } from 'office-ui-fabric-react/lib/Button';
-import { ContextualMenu, DirectionalHint } from 'office-ui-fabric-react/lib/ContextualMenu';
 import * as stylesImport from './ExtendedSelectedItem.scss';
 // tslint:disable-next-line:no-any
 const styles: any = stylesImport;
@@ -46,7 +45,6 @@ export class ExtendedSelectedItem extends BaseComponent<ISelectedPeopleItemProps
         data-selection-index={ index }
         role={ 'listitem' }
         aria-labelledby={ 'selectedItemPersona-' + itemId }
-        onContextMenu={ this._onClick }
       >
         <div hidden={ !item.canExpand || onExpandItem === undefined }>
           <IconButton
@@ -75,16 +73,6 @@ export class ExtendedSelectedItem extends BaseComponent<ISelectedPeopleItemProps
             ariaLabel={ removeButtonAriaLabel }
           />
         </div >
-        { this.state.contextualMenuVisible ? (
-          <ContextualMenu
-            items={ this.props.menuItems }
-            shouldFocusOnMount={ true }
-            target={ this.persona }
-            onDismiss={ this._onCloseContextualMenu }
-            directionalHint={ DirectionalHint.bottomAutoEdge }
-          />)
-          : null
-        }
       </div >);
   }
 
@@ -97,15 +85,4 @@ export class ExtendedSelectedItem extends BaseComponent<ISelectedPeopleItemProps
       }
     };
   }
-
-  @autobind
-  private _onClick(ev: React.MouseEvent<HTMLElement>): void {
-    ev.preventDefault();
-    this.setState({ contextualMenuVisible: true });
-  }
-
-  @autobind
-  private _onCloseContextualMenu(ev: Event): void {
-    this.setState({ contextualMenuVisible: false });
-  }
 }
\ No newline at end of file
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/SelectedItemWithContextMenu.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/SelectedItemWithContextMenu.tsx
new file mode 100644
index 0000000000000..7ace81e2f45ab
--- /dev/null
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/SelectedItemWithContextMenu.tsx
@@ -0,0 +1,63 @@
+/* tslint:disable */
+import * as React from 'react';
+/* tslint:enable */
+import { BaseComponent, autobind } from '../../../../Utilities';
+import { IExtendedPersonaProps } from '../SelectedPeopleList';
+import { ContextualMenu, DirectionalHint } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { IBaseProps } from 'office-ui-fabric-react/lib/Utilities';
+
+export interface IPeoplePickerItemState {
+  contextualMenuVisible: boolean;
+}
+
+export interface ISelectedItemWithContextMenuProps extends IBaseProps {
+  renderedItem: JSX.Element;
+  beginEditing?: (item: IExtendedPersonaProps) => void;
+  menuItems: IContextualMenuItem[];
+  item: IExtendedPersonaProps;
+}
+
+export class SelectedItemWithContextMenu extends BaseComponent<ISelectedItemWithContextMenuProps, IPeoplePickerItemState> {
+  protected itemElement: HTMLElement;
+
+  constructor(props: ISelectedItemWithContextMenuProps) {
+    super(props);
+    this.state = { contextualMenuVisible: false };
+  }
+
+  public render(): JSX.Element {
+    return (
+      <div
+        ref={ this._resolveRef('itemElement') }
+        onContextMenu={ this._onClick }
+      >
+        { this.props.renderedItem }
+        { this.state.contextualMenuVisible ? (
+          <ContextualMenu
+            items={ this.props.menuItems }
+            shouldFocusOnMount={ true }
+            target={ this.itemElement }
+            onDismiss={ this._onCloseContextualMenu }
+            directionalHint={ DirectionalHint.bottomLeftEdge }
+          />)
+          : null
+        }
+      </div >);
+  }
+
+  @autobind
+  private _onClick(ev: React.MouseEvent<HTMLElement>): void {
+    ev.preventDefault();
+    if (this.props.beginEditing && !this.props.item.isValid) {
+      this.props.beginEditing(this.props.item);
+    } else {
+      this.setState({ contextualMenuVisible: true });
+    }
+  }
+
+  @autobind
+  private _onCloseContextualMenu(ev: Event): void {
+    this.setState({ contextualMenuVisible: false });
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
index 28a951de54aa6..3c854dbad16b3 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
@@ -5,6 +5,7 @@ import { BaseSelectedItemsList } from '../BaseSelectedItemsList';
 import { IBaseSelectedItemsListProps, ISelectedItemProps } from '../BaseSelectedItemsList.types';
 import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
 import { ExtendedSelectedItem } from './Items/ExtendedSelectedItem';
+import { SelectedItemWithContextMenu } from './Items/SelectedItemWithContextMenu';
 import { autobind, IRenderFunction } from '../../../Utilities';
 import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
 import { IBaseFloatingPickerProps } from '../../../FloatingPicker';
@@ -20,7 +21,6 @@ export interface IExtendedPersonaProps extends IPersonaProps {
 
 export interface ISelectedPeopleItemProps extends ISelectedItemProps<IExtendedPersonaProps> {
   onExpandItem?: () => void;
-  menuItems: IContextualMenuItem[];
   renderPersonaCoin?: IRenderFunction<IPersonaProps>;
   renderPrimaryText?: IRenderFunction<IPersonaProps>;
 }
@@ -93,10 +93,28 @@ export class SelectedPeopleList extends BasePeopleSelectedItemsList {
       );
     } else {
       let onRenderItem = this.props.onRenderItem as (props: ISelectedPeopleItemProps) => JSX.Element;
-      return onRenderItem({ ...props });
+      let renderedItem = onRenderItem(props);
+      return (
+        props.menuItems.length > 0 ?
+          (
+            <SelectedItemWithContextMenu
+              renderedItem={ renderedItem }
+              beginEditing={ this._beginEditing }
+              menuItems={ this._createMenuItems(props.item) }
+              item={ props.item }
+            />
+          )
+          : renderedItem
+      );
     }
   }
 
+  @autobind
+  private _beginEditing(item: IExtendedPersonaProps): void {
+    item.isEditing = true;
+    this.forceUpdate();
+  }
+
   @autobind
   // tslint:disable-next-line:no-any
   private _completeEditing(oldItem: any, newItem: any): void {
@@ -111,35 +129,38 @@ export class SelectedPeopleList extends BasePeopleSelectedItemsList {
     if (this.props.editMenuItemText && this.props.getEditingItemText) {
       menuItems.push({
         key: 'Edit',
-        name: this.props.editMenuItemText ? this.props.editMenuItemText : 'Edit',
+        name: this.props.editMenuItemText,
         onClick: (ev: React.MouseEvent<HTMLElement>, menuItem: IContextualMenuItem) => {
-          (menuItem.data as IExtendedPersonaProps).isEditing = true;
-          this.forceUpdate();
+          this._beginEditing(menuItem.data);
         },
         data: item,
       });
     }
 
-    menuItems.push(
-      {
-        key: 'Remove',
-        name: this.props.removeMenuItemText ? this.props.removeMenuItemText : 'Remove',
-        onClick: (ev: React.MouseEvent<HTMLElement>, menuItem: IContextualMenuItem) => {
-          this.removeItem(menuItem.data as ISelectedItemProps<IExtendedPersonaProps>);
-        },
-        data: item,
-      },
-      {
+    if (this.props.removeMenuItemText) {
+      menuItems.push(
+        {
+          key: 'Remove',
+          name: this.props.removeMenuItemText,
+          onClick: (ev: React.MouseEvent<HTMLElement>, menuItem: IContextualMenuItem) => {
+            this.removeItem(menuItem.data as ISelectedItemProps<IExtendedPersonaProps>);
+          },
+          data: item,
+        });
+    }
+
+    if (this.props.copyMenuItemText) {
+      menuItems.push({
         key: 'Copy',
-        name: this.props.copyMenuItemText ? this.props.copyMenuItemText : 'Copy',
+        name: this.props.copyMenuItemText,
         onClick: (ev: React.MouseEvent<HTMLElement>, menuItem: IContextualMenuItem) => {
           if (this.props.onCopyItems) {
             (this.copyItems as (items: IExtendedPersonaProps[]) => void)([menuItem.data] as IExtendedPersonaProps[]);
           }
         },
         data: item,
-      },
-    );
+      });
+    }
 
     return menuItems;
   }

From 902382b6fc9e42fd97b517629fa85ad189e2183a Mon Sep 17 00:00:00 2001
From: dzearing <dzearing@hotmail.com>
Date: Thu, 1 Mar 2018 23:49:29 -0800
Subject: [PATCH 1495/1641] Updating tsconfig in button bundle.

---
 apps/test-bundle-button/tsconfig.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/test-bundle-button/tsconfig.json b/apps/test-bundle-button/tsconfig.json
index 39d960a137572..ae0d33a8e9be2 100644
--- a/apps/test-bundle-button/tsconfig.json
+++ b/apps/test-bundle-button/tsconfig.json
@@ -11,7 +11,7 @@
     "importHelpers": true,
     "forceConsistentCasingInFileNames": true,
     "moduleResolution": "node",
-    "preserveConstEnums": true,
+    "preserveConstEnums": false,
     "types": [
       "webpack-env"
     ],

From 44ca7b84a94649581e68a693971891fb1a834720 Mon Sep 17 00:00:00 2001
From: Kelsey Young <kelseyyoung4@gmail.com>
Date: Thu, 1 Mar 2018 23:51:04 -0800
Subject: [PATCH 1496/1641] Initial set of Keytips work in experiments (#4062)

* Adding files to experiments

* Fix most tslint errors

* Fix initial tslint errors

* Fix other tslint errors

* Fix last compiling issues

* Add keysequence files

* Add pages to example app

* Removed IKeySequence files in packages/utilities
- Made key sequences in KeytipLayer optional again
- Add utility constants, refactored code
- Moved IKeySequence to string code from KeytipManager to IKeytipSequence, also moved tests

* First pass of writing processInput

* Update KeytipLayer Example to use data attribute
- Manually add Keytip through manager after mount for experiments

* Add Keytipsequencestarts with tests

* Add matched and partially matched nodes tests

* Add keysequenceStarts with tests and partial and exact node matched tests

* Add more tests to keysquences

* Add initial processInput tests

* Add initial processInput tests

* Clean up unused imports

* Add partial nodes tests

* Show/hide methods for the tree nodes

* Add hasChildrenNodes prop and a test for it

* Moved function to comply with tslint

* Get keytip to show on starting sequence in example
- Keytips will now hide on scroll

* Refactor KeySequences to use strings instead of KeyCodes
- Introduce idea of modifier key codes
- Split processInput with processTransitionInput

* disable and enable keytipmode correctly

* Add more items to KeytipLayer example
- Remove ID and KeytipTarget from Keytip props

* Fix unit tests

* Fix exit points for keys

* Exit when scrolled and enter keytipmode again

* Add exit sequences

* Fix broken unit tests

* Add modifier to example

* Fix hierarchy bugs

* Add more examples  keytips demo

* Add get execture func

* Make processInput consume only one key

* Change goback to return

* Add overflowsetSequence props

* Documentation and refactoring

* Unregister keytip functionality
- Register and unregister utility functions
- removeNode tests for KeytipTree

* Remove IKeytipTranstionSequence, transition keys can only be one key now

* Add comments algorithm

* Change addNode to receive keytipProps

* Remove duplicate identifiers

* Allow for multiple modifier keys
- Extract transition key out into own files and tests

* Fix import errors by moving KeytipManager and Tree to utilities/keytip
- Remove visible from the state of the Keytip

* Show keytip right away if its parent is currentKeytip

* Add tests for overflow node adding

* Delete keytiptree tests from wrong directory

* Re-add tests to overflowset sequence for add node

* Fix go back and clean current Sequence array

* registerKeytip update functionality
- Removed visible property from KeytipTreeNode

* Updated KeytipLayer demo

* Add test for keytiplink process input

* Added logic for keytiplink in remove and added unit test

* Add tests for matching disabled nodes

* Make content required on IKeytipProps
- Add element to onExecute and onReturn functions
- Update KeytipLayer example to click buttons
- Removed index.ts files for utils to avoid import issues

* Remove outdated comments

* Remove outdated comment

* Comments and small refactoring

* Add refactoring changes for ketip and keytipcontent

* Add tests

* Very basic layer test

* Added examples for Keytip page
- Added some documentation and Dos/Donts

* Remove unused keytipstate

* Remove unused files

* Small fixes

* Fix Keytip language example

* Make KeyCodes a const enum again
- Move and rename ModifierKeyCodes to Keytip.types to prevent errors in testing

* Add rush change files

* Add offset default prop and test UI for offset

* Improve code with Fabric array utils
- Use reduce or map where applicable
---
 .../features-keytips2_2018-02-21-21-49.json   |  11 +
 .../features-keytips2_2018-02-21-21-49.json   |  11 +
 packages/experiments/src/Keytip.ts            |   1 +
 packages/experiments/src/KeytipLayer.ts       |   1 +
 packages/experiments/src/Utilities.ts         |   2 +-
 .../src/components/Keytip/Keytip.styles.ts    |  52 ++
 .../src/components/Keytip/Keytip.tsx          |  46 ++
 .../src/components/Keytip/Keytip.types.ts     | 156 +++++
 .../components/Keytip/KeytipContent.base.tsx  |  42 ++
 .../components/Keytip/KeytipContent.test.tsx  |  33 +
 .../src/components/Keytip/KeytipContent.tsx   |   9 +
 .../src/components/Keytip/KeytipPage.tsx      |  68 ++
 .../__snapshots__/KeytipContent.test.tsx.snap |  90 +++
 .../Keytip/examples/Keytip.Basic.Example.tsx  |  58 ++
 .../examples/Keytip.Disabled.Example.tsx      |  50 ++
 .../examples/Keytip.Language.Example.tsx      |  47 ++
 .../src/components/Keytip/index.ts            |   2 +
 .../components/KeytipLayer/KeytipLayer.tsx    | 248 +++++++
 .../KeytipLayer/KeytipLayer.types.ts          |  53 ++
 .../KeytipLayer/KeytipLayerPage.tsx           |  53 ++
 .../examples/KeytipLayer.Basic.Example.tsx    | 237 +++++++
 .../src/components/KeytipLayer/index.ts       |   2 +
 .../experiments/src/demo/AppDefinition.tsx    |  12 +
 .../keysequence/IKeySequence.test.ts          | 157 +++++
 .../src/utilities/keysequence/IKeySequence.ts |  83 +++
 .../keysequence/IKeytipTransitionKey.test.ts  |  59 ++
 .../keysequence/IKeytipTransitionKey.ts       |  58 ++
 .../utilities/keytip/KeytipManager.test.tsx   | 326 +++++++++
 .../src/utilities/keytip/KeytipManager.ts     | 267 +++++++
 .../src/utilities/keytip/KeytipTree.test.tsx  | 652 ++++++++++++++++++
 .../src/utilities/keytip/KeytipTree.ts        | 294 ++++++++
 .../src/utilities/keytip/KeytipUtils.ts       |  60 ++
 packages/utilities/src/KeyCodes.ts            | 103 ++-
 scripts/tasks/jest-mock.js                    | 104 ++-
 scripts/tasks/jest-resources.js               |   2 +-
 35 files changed, 3425 insertions(+), 24 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/features-keytips2_2018-02-21-21-49.json
 create mode 100644 common/changes/@uifabric/utilities/features-keytips2_2018-02-21-21-49.json
 create mode 100644 packages/experiments/src/Keytip.ts
 create mode 100644 packages/experiments/src/KeytipLayer.ts
 create mode 100644 packages/experiments/src/components/Keytip/Keytip.styles.ts
 create mode 100644 packages/experiments/src/components/Keytip/Keytip.tsx
 create mode 100644 packages/experiments/src/components/Keytip/Keytip.types.ts
 create mode 100644 packages/experiments/src/components/Keytip/KeytipContent.base.tsx
 create mode 100644 packages/experiments/src/components/Keytip/KeytipContent.test.tsx
 create mode 100644 packages/experiments/src/components/Keytip/KeytipContent.tsx
 create mode 100644 packages/experiments/src/components/Keytip/KeytipPage.tsx
 create mode 100644 packages/experiments/src/components/Keytip/__snapshots__/KeytipContent.test.tsx.snap
 create mode 100644 packages/experiments/src/components/Keytip/examples/Keytip.Basic.Example.tsx
 create mode 100644 packages/experiments/src/components/Keytip/examples/Keytip.Disabled.Example.tsx
 create mode 100644 packages/experiments/src/components/Keytip/examples/Keytip.Language.Example.tsx
 create mode 100644 packages/experiments/src/components/Keytip/index.ts
 create mode 100644 packages/experiments/src/components/KeytipLayer/KeytipLayer.tsx
 create mode 100644 packages/experiments/src/components/KeytipLayer/KeytipLayer.types.ts
 create mode 100644 packages/experiments/src/components/KeytipLayer/KeytipLayerPage.tsx
 create mode 100644 packages/experiments/src/components/KeytipLayer/examples/KeytipLayer.Basic.Example.tsx
 create mode 100644 packages/experiments/src/components/KeytipLayer/index.ts
 create mode 100644 packages/experiments/src/utilities/keysequence/IKeySequence.test.ts
 create mode 100644 packages/experiments/src/utilities/keysequence/IKeySequence.ts
 create mode 100644 packages/experiments/src/utilities/keysequence/IKeytipTransitionKey.test.ts
 create mode 100644 packages/experiments/src/utilities/keysequence/IKeytipTransitionKey.ts
 create mode 100644 packages/experiments/src/utilities/keytip/KeytipManager.test.tsx
 create mode 100644 packages/experiments/src/utilities/keytip/KeytipManager.ts
 create mode 100644 packages/experiments/src/utilities/keytip/KeytipTree.test.tsx
 create mode 100644 packages/experiments/src/utilities/keytip/KeytipTree.ts
 create mode 100644 packages/experiments/src/utilities/keytip/KeytipUtils.ts

diff --git a/common/changes/@uifabric/experiments/features-keytips2_2018-02-21-21-49.json b/common/changes/@uifabric/experiments/features-keytips2_2018-02-21-21-49.json
new file mode 100644
index 0000000000000..b923866b6efd0
--- /dev/null
+++ b/common/changes/@uifabric/experiments/features-keytips2_2018-02-21-21-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Add initial set of Keytip work",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "keyou@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/features-keytips2_2018-02-21-21-49.json b/common/changes/@uifabric/utilities/features-keytips2_2018-02-21-21-49.json
new file mode 100644
index 0000000000000..2dbeac11bd2a3
--- /dev/null
+++ b/common/changes/@uifabric/utilities/features-keytips2_2018-02-21-21-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Update KeyCodes enum to include all key codes",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "keyou@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/Keytip.ts b/packages/experiments/src/Keytip.ts
new file mode 100644
index 0000000000000..0e3d31cfbafad
--- /dev/null
+++ b/packages/experiments/src/Keytip.ts
@@ -0,0 +1 @@
+export * from './components/Keytip/index';
\ No newline at end of file
diff --git a/packages/experiments/src/KeytipLayer.ts b/packages/experiments/src/KeytipLayer.ts
new file mode 100644
index 0000000000000..39e83ed745652
--- /dev/null
+++ b/packages/experiments/src/KeytipLayer.ts
@@ -0,0 +1 @@
+export * from './components/KeytipLayer/index';
\ No newline at end of file
diff --git a/packages/experiments/src/Utilities.ts b/packages/experiments/src/Utilities.ts
index 4661a875ed729..cce14ea6abb0f 100644
--- a/packages/experiments/src/Utilities.ts
+++ b/packages/experiments/src/Utilities.ts
@@ -1 +1 @@
-export * from 'office-ui-fabric-react/lib/Utilities';
+export * from 'office-ui-fabric-react/lib/Utilities';
\ No newline at end of file
diff --git a/packages/experiments/src/components/Keytip/Keytip.styles.ts b/packages/experiments/src/components/Keytip/Keytip.styles.ts
new file mode 100644
index 0000000000000..95630b3c7a7b5
--- /dev/null
+++ b/packages/experiments/src/components/Keytip/Keytip.styles.ts
@@ -0,0 +1,52 @@
+import { IKeytipStyleProps, IKeytipStyles } from './Keytip.types';
+import { ICalloutContentStyleProps, ICalloutContentStyles } from 'office-ui-fabric-react/lib/Callout';
+
+export const getStyles = (props: IKeytipStyleProps): IKeytipStyles => {
+  const { theme, disabled, visible } = props;
+  return {
+    container: [
+      {
+        backgroundColor: theme.palette.neutralDark
+      },
+      disabled && {
+        opacity: 0.5,
+      },
+      !visible && {
+        visibility: 'hidden'
+      }
+    ],
+    root: [{
+      textAlign: 'center',
+      paddingLeft: 3,
+      paddingRight: 3,
+      backgroundColor: theme.palette.neutralDark,
+      color: theme.palette.neutralLight,
+      minWidth: 11,
+      lineHeight: 17,
+      height: 17,
+      display: 'inline-block'
+    },
+    disabled && {
+      color: '#b1b1b1'
+    }]
+  };
+};
+
+export const getCalloutStyles = (props: ICalloutContentStyleProps): ICalloutContentStyles => {
+  return {
+    container: [
+    ],
+    root: [{
+      border: 'none',
+      boxShadow: 'none'
+    }],
+    beak: [
+    ],
+    beakCurtain: [
+    ],
+    calloutMain: [{
+      backgroundColor: 'transparent'
+    }
+    ]
+  };
+};
\ No newline at end of file
diff --git a/packages/experiments/src/components/Keytip/Keytip.tsx b/packages/experiments/src/components/Keytip/Keytip.tsx
new file mode 100644
index 0000000000000..4d99c15fefd76
--- /dev/null
+++ b/packages/experiments/src/components/Keytip/Keytip.tsx
@@ -0,0 +1,46 @@
+import * as React from 'react';
+import { BaseComponent } from '../../Utilities';
+import { Callout } from 'office-ui-fabric-react/lib/Callout';
+import { DirectionalHint } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { IKeytip, IKeytipProps } from './Keytip.types';
+import { KeytipContent } from './KeytipContent';
+import { getCalloutStyles } from './Keytip.styles';
+import { constructKeytipTargetFromSequences } from '../../utilities/keytip/KeytipUtils';
+
+/**
+ * A callout corresponding to another Fabric component to describe a key sequence that will activate that component
+ *
+ * @export
+ * @class Keytip
+ * @extends {BaseComponent<IKeytipProps, {}}>}
+ */
+export class Keytip extends BaseComponent<IKeytipProps, {}> implements IKeytip {
+
+  // tslint:disable-next-line:no-any
+  constructor(props: IKeytipProps, context: any) {
+    super(props, context);
+  }
+
+  public render(): JSX.Element {
+    const {
+      calloutProps,
+      keySequences,
+      offset = 0 // Default value for gap is 0
+    } = this.props;
+
+    return (
+      <Callout
+        { ...calloutProps }
+        gapSpace={ offset }
+        isBeakVisible={ false }
+        doNotLayer={ true }
+        directionalHint={ DirectionalHint.bottomCenter }
+        target={ constructKeytipTargetFromSequences(keySequences) }
+        getStyles={ getCalloutStyles }
+        preventDismissOnScroll={ true }
+      >
+        <KeytipContent {...this.props} />
+      </Callout>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Keytip/Keytip.types.ts b/packages/experiments/src/components/Keytip/Keytip.types.ts
new file mode 100644
index 0000000000000..9f5c4094c8595
--- /dev/null
+++ b/packages/experiments/src/components/Keytip/Keytip.types.ts
@@ -0,0 +1,156 @@
+import { ICalloutProps } from 'office-ui-fabric-react/lib/Callout';
+import { IStyle, ITheme } from '../../Styling';
+import { IStyleFunction } from '../../Utilities';
+import { IKeySequence } from '../../utilities/keysequence/IKeySequence';
+
+export interface IKeytip {
+}
+
+export interface IKeytipProps {
+  /**
+   * Optional callback to access the Keytip component. Use this instead of ref for accessing
+   * the public methods and properties of the component.
+   */
+  componentRef?: (component: IKeytip) => void;
+
+  /**
+   * Content to put inside the keytip
+   *
+   * @type {string}
+   */
+  content: string;
+
+  /**
+   * Theme for the component
+   *
+   * @type {ITheme}
+   */
+  theme?: ITheme;
+
+  /**
+   * T/F if the corresponding control is disabled
+   *
+   * @type {boolean}
+   */
+  disabled?: boolean;
+
+  /**
+   * T/F if the keytip is visible
+   *
+   * @type {boolean}
+   */
+  visible?: boolean;
+
+  /**
+   * Function to call when this keytip is activated
+   * 'el' is the DOM element that the keytip is attached to
+   *
+   * @type {(HTMLElement) => void}
+   */
+  onExecute?: (el: HTMLElement) => void;
+
+  /**
+   * Function to call when the keytip is returned to
+   * 'el' is the DOM element that the keytip is attached to
+   *
+   * @type {(HTMLElement) => void}
+   */
+  onReturn?: (el: HTMLElement) => void;
+
+  /**
+   * Array of KeySequences which is the full key sequence to trigger this keytip
+   * Should not include initial 'start' key sequence
+   *
+   * @type {IKeySequence[]}
+   */
+  keySequences: IKeySequence[];
+
+  /**
+   * KeySequence of overflow set which will trigger the keytip.
+   *
+   * @type {IKeySequence}
+   */
+  overflowSetSequence?: IKeySequence;
+
+  /**
+   * ICalloutProps to pass to the callout element
+   *
+   * @type {string}
+   */
+  calloutProps?: ICalloutProps;
+
+  /**
+   * Optional styles for the component.
+   *
+   * @type {IStyleFunction<IKeytipStyleProps, IKeytipStyles>}
+   */
+  getStyles?: IStyleFunction<IKeytipStyleProps, IKeytipStyles>;
+
+  /**
+   * Offset distance in px between the target element and the positioning of the keytip.this keytip
+   *
+   * @type {number}
+   * @default 0
+   */
+  offset?: number;
+
+  /**
+   * Whether or not this node has children nodes or not. Should be used for menus/overflow components, that have
+   * their children registered after the initial rendering of the DOM.
+   *
+   * @type {boolean}
+   */
+  hasChildrenNodes?: boolean;
+}
+
+/**
+ * Props to style Keytip component
+ */
+export interface IKeytipStyleProps {
+
+  /**
+   * The theme for the keytip.
+   *
+   * @type {ITheme}
+   */
+  theme: ITheme;
+
+  /**
+   * Whether the keytip is disabled or not.
+   *
+   * @type {boolean}
+   */
+  disabled?: boolean;
+
+  /**
+   * T/F if the keytip is visible
+   *
+   * @type {boolean}
+   */
+  visible?: boolean;
+}
+
+export interface IKeytipStyles {
+
+  /**
+   * Style for the div container surrounding the keytip content.
+   *
+   * @type {IStyle}
+   */
+  container: IStyle;
+
+  /**
+   * Style for the keytip content element.
+   *
+   * @type {IStyle}
+   */
+  root: IStyle;
+}
+
+export enum KeytipTransitionModifier {
+  shift = 16,
+  ctrl = 17,
+  alt = 18,
+  leftWindow = 91,
+  rightWindow = 92
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Keytip/KeytipContent.base.tsx b/packages/experiments/src/components/Keytip/KeytipContent.base.tsx
new file mode 100644
index 0000000000000..2068168345c58
--- /dev/null
+++ b/packages/experiments/src/components/Keytip/KeytipContent.base.tsx
@@ -0,0 +1,42 @@
+import * as React from 'react';
+import { BaseComponent, classNamesFunction, customizable } from '../../Utilities';
+import { convertSequencesToKeytipID } from '../../utilities/keysequence/IKeySequence';
+import { IKeytipProps, IKeytipStyleProps, IKeytipStyles } from './Keytip.types';
+
+/**
+ * A component corresponding the the content rendered inside the callout of the keytip component.
+ *
+ * @export
+ * @class KeytipContent
+ * @extends {BaseComponent<IKeytipProps>}
+ */
+@customizable('KeytipContent', ['theme'])
+export class KeytipContentBase extends BaseComponent<IKeytipProps, {}> {
+
+  public render(): JSX.Element {
+    let {
+      content,
+      getStyles,
+      theme,
+      disabled,
+      keySequences,
+      visible
+      } = this.props;
+
+    const getClassNames = classNamesFunction<IKeytipStyleProps, IKeytipStyles>();
+    let classNames = getClassNames(
+      getStyles!,
+      {
+        theme: theme!,
+        disabled,
+        visible
+      }
+    );
+
+    return (
+      <div className={ classNames.container } >
+        <span id={ convertSequencesToKeytipID(keySequences) } className={ classNames.root }>{ content }</span>
+      </div >
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Keytip/KeytipContent.test.tsx b/packages/experiments/src/components/Keytip/KeytipContent.test.tsx
new file mode 100644
index 0000000000000..5edcb5e58c62c
--- /dev/null
+++ b/packages/experiments/src/components/Keytip/KeytipContent.test.tsx
@@ -0,0 +1,33 @@
+import * as React from 'react';
+import * as renderer from 'react-test-renderer';
+import { IKeySequence } from '../../utilities/keysequence/IKeySequence';
+import { KeytipContent } from './KeytipContent';
+
+const sequence: IKeySequence[] = [{ keys: ['a'] }];
+const keyCont = 'A';
+
+describe('Keytip', () => {
+  it('renders visible Keytip correctly', () => {
+    const componentContent = renderer.create(<KeytipContent visible={ true } content={ keyCont } keySequences={ sequence } />);
+    let tree = componentContent.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
+  it('renders visible disabled Keytip correctly', () => {
+    const componentContent = renderer.create(
+      <KeytipContent
+        visible={ true }
+        disabled={ true }
+        content={ keyCont }
+        keySequences={ sequence }
+      />);
+    let tree = componentContent.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+
+  it('renders invisible Keytip correctly', () => {
+    const componentContent = renderer.create(<KeytipContent visible={ false } content={ keyCont } keySequences={ sequence } />);
+    let tree = componentContent.toJSON();
+    expect(tree).toMatchSnapshot();
+  });
+});
\ No newline at end of file
diff --git a/packages/experiments/src/components/Keytip/KeytipContent.tsx b/packages/experiments/src/components/Keytip/KeytipContent.tsx
new file mode 100644
index 0000000000000..9e83cf7ddd0e2
--- /dev/null
+++ b/packages/experiments/src/components/Keytip/KeytipContent.tsx
@@ -0,0 +1,9 @@
+import { styled } from '../../Utilities';
+import { IKeytipProps, IKeytipStyleProps, IKeytipStyles } from './Keytip.types';
+import { KeytipContentBase } from './KeytipContent.base';
+import { getStyles } from './Keytip.styles';
+
+export const KeytipContent = styled<IKeytipProps, IKeytipStyleProps, IKeytipStyles>(
+  KeytipContentBase,
+  getStyles
+);
\ No newline at end of file
diff --git a/packages/experiments/src/components/Keytip/KeytipPage.tsx b/packages/experiments/src/components/Keytip/KeytipPage.tsx
new file mode 100644
index 0000000000000..0e2c14c866702
--- /dev/null
+++ b/packages/experiments/src/components/Keytip/KeytipPage.tsx
@@ -0,0 +1,68 @@
+import * as React from 'react';
+import {
+  ExampleCard,
+  IComponentDemoPageProps,
+  ComponentPage
+} from '@uifabric/example-app-base';
+import { KeytipBasicExample } from './examples/Keytip.Basic.Example';
+import { KeytipDisabledExample } from './examples/Keytip.Disabled.Example';
+import { KeytipLanguageExample } from './examples/Keytip.Language.Example';
+import { KeytipLayer } from '../../KeytipLayer';
+
+export class KeytipPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render(): JSX.Element {
+    return (
+      <div>
+        <ComponentPage
+          title='Keytip'
+          componentName='Keytip'
+          exampleCards={
+            <div>
+              <ExampleCard title='Basic Keytip'>
+                <KeytipBasicExample />
+              </ExampleCard>
+              <ExampleCard title='Disabled Keytip'>
+                <KeytipDisabledExample />
+              </ExampleCard>
+              <ExampleCard title='Keytip Languages'>
+                <KeytipLanguageExample />
+              </ExampleCard>
+            </div>
+          }
+          overview={
+            <div>
+              <p>A Keytip is a small popup near a component that indicates a key sequence that will trigger that component. These are not
+                to be confused with keyboard shortcuts; they are instead key sequences to traverse through UI components. Technically, a
+                Keytip is a wrapper around a Callout where the target element is discovered through a 'data-ktp-id' attribute on that
+                element.
+              </p>
+
+              <p>The key sequence for a Keytip must be any combination of alphanumeric characters (A-Z, 0-9). No modifiers (Alt, Shift,
+                Ctrl) can be used for these sequences.</p>
+            </div>
+          }
+          bestPractices={
+            <div />
+          }
+          dos={
+            <div>
+              <ul>
+                <li>The content in the Keytip should only be the alphanumeric letters that will trigger this Keytip</li>
+              </ul>
+            </div>
+          }
+          donts={
+            <div>
+              <ul>
+                <li>Don't add Keytips directly into your app. They should be added with the registerKeytip helper through another
+                  component</li>
+              </ul>
+            </div>
+          }
+          isHeaderVisible={ this.props.isHeaderVisible }
+        />
+        <KeytipLayer id={ 'test-id' } />
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Keytip/__snapshots__/KeytipContent.test.tsx.snap b/packages/experiments/src/components/Keytip/__snapshots__/KeytipContent.test.tsx.snap
new file mode 100644
index 0000000000000..ba8fca629a859
--- /dev/null
+++ b/packages/experiments/src/components/Keytip/__snapshots__/KeytipContent.test.tsx.snap
@@ -0,0 +1,90 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Keytip renders invisible Keytip correctly 1`] = `
+<div
+  className=
+
+      {
+        background-color: #212121;
+        visibility: hidden;
+      }
+>
+  <span
+    className=
+
+        {
+          background-color: #212121;
+          color: #eaeaea;
+          display: inline-block;
+          height: 17px;
+          line-height: 17px;
+          min-width: 11px;
+          padding-left: 3px;
+          padding-right: 3px;
+          text-align: center;
+        }
+    id="ktp-a"
+  >
+    A
+  </span>
+</div>
+`;
+
+exports[`Keytip renders visible Keytip correctly 1`] = `
+<div
+  className=
+
+      {
+        background-color: #212121;
+      }
+>
+  <span
+    className=
+
+        {
+          background-color: #212121;
+          color: #eaeaea;
+          display: inline-block;
+          height: 17px;
+          line-height: 17px;
+          min-width: 11px;
+          padding-left: 3px;
+          padding-right: 3px;
+          text-align: center;
+        }
+    id="ktp-a"
+  >
+    A
+  </span>
+</div>
+`;
+
+exports[`Keytip renders visible disabled Keytip correctly 1`] = `
+<div
+  className=
+
+      {
+        background-color: #212121;
+        opacity: 0.5;
+      }
+>
+  <span
+    className=
+
+        {
+          background-color: #212121;
+          color: #b1b1b1;
+          display: inline-block;
+          height: 17px;
+          line-height: 17px;
+          min-width: 11px;
+          padding-left: 3px;
+          padding-right: 3px;
+          text-align: center;
+        }
+    id="ktp-a"
+  >
+    A
+  </span>
+</div>
+`;
diff --git a/packages/experiments/src/components/Keytip/examples/Keytip.Basic.Example.tsx b/packages/experiments/src/components/Keytip/examples/Keytip.Basic.Example.tsx
new file mode 100644
index 0000000000000..6695d48a76ba6
--- /dev/null
+++ b/packages/experiments/src/components/Keytip/examples/Keytip.Basic.Example.tsx
@@ -0,0 +1,58 @@
+import * as React from 'react';
+import { IKeytipProps, Keytip } from '../../Keytip';
+import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
+import { convertSequencesToKeytipID } from '../../../utilities/keysequence/IKeySequence';
+
+export interface IKeytipExampleState {
+  keytipVisible: boolean;
+}
+
+export interface IKeytipMap {
+  [componentKeytipId: string]: IKeytipProps;
+}
+
+export function onKeytipButtonClick(): void {
+  this.setState((previousState: IKeytipExampleState) => {
+    let currentKeytipVisible = !previousState.keytipVisible;
+    return { keytipVisible: currentKeytipVisible };
+  });
+}
+
+export class KeytipBasicExample extends React.Component<{}, IKeytipExampleState> {
+  private keytipMap: IKeytipMap = {};
+
+  constructor(props: {}) {
+    super(props);
+
+    this.state = {
+      keytipVisible: false,
+    };
+
+    // Setup keytips
+    this.keytipMap.Keytip1 = {
+      content: 'A',
+      keySequences: [{ keys: ['a'] }],
+    } as IKeytipProps;
+  }
+
+  /* tslint:disable:jsx-ban-props */
+  public render(): JSX.Element {
+    let btnClick = onKeytipButtonClick.bind(this);
+
+    return (
+      <div>
+        <DefaultButton
+          text='Click to toggle keytip'
+          data-ktp-id={ convertSequencesToKeytipID(this.keytipMap.Keytip1.keySequences) }
+          onClick={ btnClick }
+        />
+        <Keytip
+          content={ this.keytipMap.Keytip1.content }
+          offset={ -8 }
+          keySequences={ this.keytipMap.Keytip1.keySequences }
+          visible={ this.state.keytipVisible }
+        />
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Keytip/examples/Keytip.Disabled.Example.tsx b/packages/experiments/src/components/Keytip/examples/Keytip.Disabled.Example.tsx
new file mode 100644
index 0000000000000..71a3fd77aded8
--- /dev/null
+++ b/packages/experiments/src/components/Keytip/examples/Keytip.Disabled.Example.tsx
@@ -0,0 +1,50 @@
+import * as React from 'react';
+import { IKeytipProps, Keytip } from '../../Keytip';
+import { convertSequencesToKeytipID } from '../../../utilities/keysequence/IKeySequence';
+import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
+import { IKeytipExampleState, onKeytipButtonClick } from './Keytip.Basic.Example';
+
+export interface IKeytipMap {
+  [componentKeytipId: string]: IKeytipProps;
+}
+
+export class KeytipDisabledExample extends React.Component<{}, IKeytipExampleState> {
+  private keytipMap: IKeytipMap = {};
+
+  constructor(props: {}) {
+    super(props);
+
+    this.state = {
+      keytipVisible: false
+    };
+
+    // Setup keytips
+    this.keytipMap.Keytip1 = {
+      content: 'B',
+      keySequences: [{ keys: ['b'] }],
+      disabled: true
+    } as IKeytipProps;
+  }
+
+  /* tslint:disable:jsx-ban-props */
+  public render(): JSX.Element {
+    let btnClick = onKeytipButtonClick.bind(this);
+    return (
+      <div>
+        <p>A disabled keytip will be displayed when keytips are enabled, but the component will not
+          be activated when its keys are pressed</p>
+        <DefaultButton
+          text='Click to toggle keytip'
+          data-ktp-id={ convertSequencesToKeytipID(this.keytipMap.Keytip1.keySequences) }
+          onClick={ btnClick }
+        />
+        <Keytip
+          content={ this.keytipMap.Keytip1.content }
+          keySequences={ this.keytipMap.Keytip1.keySequences }
+          visible={ this.state.keytipVisible }
+          disabled={ this.keytipMap.Keytip1.disabled }
+        />
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Keytip/examples/Keytip.Language.Example.tsx b/packages/experiments/src/components/Keytip/examples/Keytip.Language.Example.tsx
new file mode 100644
index 0000000000000..e7baab3f1e9b9
--- /dev/null
+++ b/packages/experiments/src/components/Keytip/examples/Keytip.Language.Example.tsx
@@ -0,0 +1,47 @@
+import * as React from 'react';
+import { IKeytipProps, Keytip } from '../../Keytip';
+import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
+import { convertSequencesToKeytipID } from '../../../utilities/keysequence/IKeySequence';
+import { IKeytipExampleState, onKeytipButtonClick } from './Keytip.Basic.Example';
+
+export interface IKeytipMap {
+  [componentKeytipId: string]: IKeytipProps;
+}
+
+export class KeytipLanguageExample extends React.Component<{}, IKeytipExampleState> {
+  private keytipMap: IKeytipMap = {};
+
+  constructor(props: {}) {
+    super(props);
+
+    this.state = {
+      keytipVisible: false,
+    };
+
+    // Setup keytips
+    this.keytipMap.Keytip1 = {
+      content: 'ы ñ خ',
+      keySequences: [{ keys: ['c'] }],
+    } as IKeytipProps;
+  }
+
+  /* tslint:disable:jsx-ban-props */
+  public render(): JSX.Element {
+    let btnClick = onKeytipButtonClick.bind(this);
+    return (
+      <div>
+        <p>Keytips can support displaying and processing keys for any unicode language</p>
+        <DefaultButton
+          text='Click to toggle keytip'
+          data-ktp-id={ convertSequencesToKeytipID(this.keytipMap.Keytip1.keySequences) }
+          onClick={ btnClick }
+        />
+        <Keytip
+          content={ this.keytipMap.Keytip1.content }
+          keySequences={ this.keytipMap.Keytip1.keySequences }
+          visible={ this.state.keytipVisible }
+        />
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Keytip/index.ts b/packages/experiments/src/components/Keytip/index.ts
new file mode 100644
index 0000000000000..e1a7019416b87
--- /dev/null
+++ b/packages/experiments/src/components/Keytip/index.ts
@@ -0,0 +1,2 @@
+export * from './Keytip';
+export * from './Keytip.types';
\ No newline at end of file
diff --git a/packages/experiments/src/components/KeytipLayer/KeytipLayer.tsx b/packages/experiments/src/components/KeytipLayer/KeytipLayer.tsx
new file mode 100644
index 0000000000000..806b112832552
--- /dev/null
+++ b/packages/experiments/src/components/KeytipLayer/KeytipLayer.tsx
@@ -0,0 +1,248 @@
+import * as React from 'react';
+import { IKeytipLayerProps } from './KeytipLayer.types';
+import { Keytip, IKeytipProps, KeytipTransitionModifier } from '../Keytip';
+import {
+  autobind,
+  BaseComponent
+} from '../../Utilities';
+import { Layer } from 'office-ui-fabric-react/lib/Layer';
+import { KeyCodes, findIndex } from '../../Utilities';
+import { convertSequencesToKeytipID, fullKeySequencesAreEqual } from '../../utilities/keysequence/IKeySequence';
+import { IKeytipTransitionKey } from '../../utilities/keysequence/IKeytipTransitionKey';
+import { KeytipManager } from '../../utilities/keytip/KeytipManager';
+import { ktpFullPrefix, ktpSeparator } from '../../utilities/keytip/KeytipUtils';
+
+export interface IKeytipLayerState {
+  inKeytipMode: boolean;
+  keytips: IKeytipProps[];
+}
+
+const defaultStartSequence: IKeytipTransitionKey = {
+  key: 'Meta', modifierKeys: [KeytipTransitionModifier.alt]
+};
+
+const defaultExitSequence: IKeytipTransitionKey = {
+  key: 'Meta', modifierKeys: [KeytipTransitionModifier.alt]
+};
+
+const defaultReturnSequence: IKeytipTransitionKey = {
+  key: 'Escape'
+};
+
+/**
+ * A layer that holds all keytip items
+ *
+ * @export
+ * @class KeytipLayer
+ * @extends {BaseComponent<IKeytipLayerProps>}
+ */
+export class KeytipLayer extends BaseComponent<IKeytipLayerProps, IKeytipLayerState> {
+  public static defaultProps: IKeytipLayerProps = {
+    keytipStartSequences: [defaultStartSequence],
+    keytipExitSequences: [defaultExitSequence],
+    keytipReturnSequences: [defaultReturnSequence],
+    id: ktpFullPrefix + 'Alt' + ktpSeparator + 'Meta'
+  };
+
+  private _keytipManager: KeytipManager = KeytipManager.getInstance();
+
+  // tslint:disable-next-line:no-any
+  constructor(props: IKeytipLayerProps, context: any) {
+    super(props, context);
+
+    this.state = {
+      inKeytipMode: false,
+      keytips: []
+    };
+
+    this._keytipManager.init(this);
+  }
+
+  /**
+   * Register a keytip in this layer
+   *
+   * @param keytipProps - IKeytipProps to add to this layer
+   */
+  public registerKeytip(keytipProps: IKeytipProps): void {
+    this.setState(this.addKeytip(keytipProps));
+  }
+
+  /**
+   * Unregister a keytip in this layer
+   *
+   * @param keytipProps - IKeytipProps to remove from this layer
+   */
+  public unregisterKeytip(keytipProps: IKeytipProps): void {
+    this.setState(this.removeKeytip(keytipProps));
+  }
+
+  /**
+   * Add or update a keytip to this layer by modifying this layer's state
+   *
+   * @param keytipProps - Keytip to add or update in the layer
+   * @returns Function to call with setState
+   */
+  public addKeytip(keytipProps: IKeytipProps): {} {
+    return (previousState: IKeytipLayerState) => {
+      let previousKeytips: IKeytipProps[] = previousState.keytips;
+
+      // Try to find keytipProps in previousKeytips to update
+      let keytipToUpdateIndex = findIndex(previousKeytips, (previousKeytip: IKeytipProps) => {
+        return fullKeySequencesAreEqual(keytipProps.keySequences, previousKeytip.keySequences);
+      });
+
+      let currentKeytips = [...previousState.keytips];
+      if (keytipToUpdateIndex >= 0) {
+        // Replace the keytip props
+        currentKeytips.splice(keytipToUpdateIndex, 1, keytipProps);
+      } else {
+        // Add the new keytip props
+        currentKeytips.push(keytipProps);
+      }
+      return { ...previousState, keytips: currentKeytips };
+    };
+  }
+
+  /**
+   * Removes a keytip from this layer's state
+   *
+   * @param keytipToRemove - IKeytipProps of the keytip to remove
+   * @returns Function to call with setState
+   */
+  public removeKeytip(keytipToRemove: IKeytipProps): {} {
+    return (previousState: IKeytipLayerState) => {
+      let currentKeytips = previousState.keytips;
+      // Filter out keytips that don't equal the one to remove
+      let filteredKeytips: IKeytipProps[] = currentKeytips.filter((currentKeytip: IKeytipProps) => {
+        return !fullKeySequencesAreEqual(currentKeytip.keySequences, keytipToRemove.keySequences);
+      });
+      return { ...previousState, keytips: filteredKeytips };
+    };
+  }
+
+  /**
+   * Sets the visibility of the keytips in this layer
+   *
+   * @param ids - Keytip IDs that should have their visibility updated
+   * @param visible - T/F if the specified Keytips will be visible or not
+   */
+  public setKeytipVisibility(ids: string[], visible: boolean): void {
+    this.setState((previousState: IKeytipLayerState, currentProps: IKeytipLayerState) => {
+      let currentKeytips: IKeytipProps[] = [...previousState.keytips];
+      for (let keytip of currentKeytips) {
+        let keytipId = convertSequencesToKeytipID(keytip.keySequences);
+        if (ids.indexOf(keytipId) >= 0) {
+          keytip.visible = visible;
+        }
+      }
+      return { ...previousState, keytips: currentKeytips };
+    });
+  }
+
+  public render(): JSX.Element {
+    const {
+      id
+    } = this.props;
+
+    const {
+      keytips
+    } = this.state;
+
+    return (
+      <Layer id={ id }>
+        { keytips && keytips.map((keytipProps: IKeytipProps, index: number) => {
+          return <Keytip key={ index } { ...keytipProps } />;
+        }) }
+      </Layer>
+    );
+  }
+
+  public componentDidMount(): void {
+    this._events.on(window, 'mousedown', this._onDismiss);
+    this._events.on(window, 'resize', this._onDismiss);
+    this._events.on(window, 'keydown', this._onKeyDown, true /* useCapture */);
+    this._events.on(window, 'keypress', this._onKeyPress, true /* useCapture */);
+
+    // Add handler to remove Keytips when we scroll the page
+    window.addEventListener('scroll', (): void => {
+      if (this.state.inKeytipMode) {
+        this._keytipManager.exitKeytipMode();
+      }
+    }, { capture: true });
+  }
+
+  /**
+   * Exits keytip mode for this layer
+   */
+  public exitKeytipMode(): void {
+    if (this.props.onExitKeytipMode) {
+      this.props.onExitKeytipMode();
+    }
+    this.setState({ inKeytipMode: false });
+  }
+
+  /**
+   * Enters keytip mode for this layer
+   */
+  public enterKeytipMode(): void {
+    if (this.props.onEnterKeytipMode) {
+      this.props.onEnterKeytipMode();
+    }
+    this.setState({ inKeytipMode: true });
+  }
+
+  @autobind
+  private _onDismiss(ev?: React.MouseEvent<HTMLElement>): void {
+    // if we are in keytip mode, then exit keytip mode
+    if (this.state.inKeytipMode) {
+      this._keytipManager.exitKeytipMode();
+    }
+  }
+
+  @autobind
+  private _onKeyDown(ev: React.KeyboardEvent<HTMLElement>): void {
+    switch (ev.which) {
+      case KeyCodes.alt:
+        // ALT puts focus in the browser bar, so it should not be used as a key for keytips.
+        // It can be used as a modifier
+        break;
+      case KeyCodes.tab:
+      case KeyCodes.enter:
+      case KeyCodes.space:
+        this._keytipManager.exitKeytipMode();
+        break;
+      default:
+        let transitionKey: IKeytipTransitionKey = { key: ev.key };
+        transitionKey.modifierKeys = this._getModifierKey(ev);
+        this._keytipManager.processTransitionInput(transitionKey);
+        break;
+    }
+  }
+
+  /**
+   * Gets the ModifierKeyCodes based on the keyboard event
+   *
+   * @param ev - React.KeyboardEvent
+   * @returns List of ModifierKeyCodes that were pressed
+   */
+  private _getModifierKey(ev: React.KeyboardEvent<HTMLElement>): KeytipTransitionModifier[] | undefined {
+    let modifierKeys = [];
+    if (ev.altKey) {
+      modifierKeys.push(KeytipTransitionModifier.alt);
+    }
+    if (ev.ctrlKey) {
+      modifierKeys.push(KeytipTransitionModifier.ctrl);
+    }
+    if (ev.shiftKey) {
+      modifierKeys.push(KeytipTransitionModifier.shift);
+    }
+    // TODO: include windows key or option for MAC
+    return modifierKeys.length ? modifierKeys : undefined;
+  }
+
+  @autobind
+  private _onKeyPress(ev: React.KeyboardEvent<HTMLElement>): void {
+    // Call processInput
+    this._keytipManager.processInput(ev.key);
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/KeytipLayer/KeytipLayer.types.ts b/packages/experiments/src/components/KeytipLayer/KeytipLayer.types.ts
new file mode 100644
index 0000000000000..c060857d2b8a0
--- /dev/null
+++ b/packages/experiments/src/components/KeytipLayer/KeytipLayer.types.ts
@@ -0,0 +1,53 @@
+import * as React from 'react';
+import { IKeytipTransitionKey } from '../../utilities/keysequence/IKeytipTransitionKey';
+import { KeytipLayer } from './KeytipLayer';
+
+export interface IKeytipLayerProps extends React.Props<KeytipLayer> {
+  /**
+   * Optional callback to access the KeytipLayer component. Use this instead of ref for accessing
+   * the public methods and properties of the component.
+   */
+  componentRef?: (component: KeytipLayer) => void;
+
+  /**
+   * The DOM ID to use as the hostId for the child keytips
+   *
+   * @type {string}
+   */
+  id: string;
+
+  /**
+  * List of key sequences that will start keytips mode
+  *
+  * @type {KeySequence}
+  */
+  keytipStartSequences?: IKeytipTransitionKey[];
+
+  /**
+   * List of key sequences that execute the return functionality in keytips (going back to the previous level of keytips)
+   *
+   * @type {KeySequence}
+   */
+  keytipReturnSequences?: IKeytipTransitionKey[];
+
+  /**
+   * List of key sequences that will exit keytips mode
+   *
+   * @type {KeySequence}
+   */
+  keytipExitSequences?: IKeytipTransitionKey[];
+
+  /**
+   * Callback function triggered when keytip mode is exited
+   *
+   * @type {() => void}
+   */
+  onExitKeytipMode?: () => void;
+
+  /**
+   * Callback function triggered when keytip mode is entered
+   *
+   * @type {() => void)}
+   */
+  onEnterKeytipMode?: () => void;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/KeytipLayer/KeytipLayerPage.tsx b/packages/experiments/src/components/KeytipLayer/KeytipLayerPage.tsx
new file mode 100644
index 0000000000000..e053c602bdd29
--- /dev/null
+++ b/packages/experiments/src/components/KeytipLayer/KeytipLayerPage.tsx
@@ -0,0 +1,53 @@
+import * as React from 'react';
+import {
+  ExampleCard,
+  IComponentDemoPageProps,
+  ComponentPage
+} from '@uifabric/example-app-base';
+import { KeytipLayerBasicExample } from './examples/KeytipLayer.Basic.Example';
+
+export class KeytipLayerPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render(): JSX.Element {
+    return (
+      <ComponentPage
+        title='Keytip Layer'
+        componentName='KeytipLayer'
+        exampleCards={
+          <div>
+            <ExampleCard title='KeytipLayer Basic'>
+              <KeytipLayerBasicExample />
+            </ExampleCard>
+          </div>
+        }
+        overview={
+          <div>
+            <p>A KeytipLayer is the component to add to your app to enable Keytips. It can be added anywhere in your document, but must
+              only be added once. Use the registerKeytip utility helper to add a Keytip to your app through the component render() function
+              it belongs to.</p>
+            <p>Key sequences can be defined to enter and exit Keytip mode. These sequences can be any keys along with modifiers (Alt, Shift
+              Ctrl, etc). The enter and exit sequences default to Alt-Win. There is also a sequence to 'return' up a level of keytips, this
+              defaults to 'Esc'.</p>
+          </div>
+        }
+        bestPractices={
+          <div />
+        }
+        dos={
+          <div>
+            <ul>
+              <li>Keytip sequences can be duplicated as long as none of their siblings have the same sequence</li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul>
+              <li>Don't create more than 1 KeytipLayer per app. This will cause issues with the key listeners</li>
+            </ul>
+          </div>
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }
+      />
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/KeytipLayer/examples/KeytipLayer.Basic.Example.tsx b/packages/experiments/src/components/KeytipLayer/examples/KeytipLayer.Basic.Example.tsx
new file mode 100644
index 0000000000000..ad1ba8cb4b812
--- /dev/null
+++ b/packages/experiments/src/components/KeytipLayer/examples/KeytipLayer.Basic.Example.tsx
@@ -0,0 +1,237 @@
+import * as React from 'react';
+import { convertSequencesToKeytipID } from '../../../utilities/keysequence/IKeySequence';
+import { IKeytipTransitionKey } from '../../../utilities/keysequence/IKeytipTransitionKey';
+import { registerKeytip, addKeytipSequence } from '../../../utilities/keytip/KeytipUtils';
+import { KeytipLayer } from '../KeytipLayer';
+import { IKeytipProps, KeytipTransitionModifier } from '../../Keytip';
+import { DefaultButton, ActionButton } from 'office-ui-fabric-react/lib/Button';
+import { CommandBar } from 'office-ui-fabric-react/lib/CommandBar';
+import { Modal } from 'office-ui-fabric-react/lib/Modal';
+import { MessageBar, MessageBarType } from 'office-ui-fabric-react/lib/MessageBar';
+import { autobind } from '../../../Utilities';
+
+export interface IKeytipLayerBasicExampleState {
+  showModal: boolean;
+  showMessageBar: boolean;
+}
+
+export interface IKeytipMap {
+  [componentKeytipId: string]: IKeytipProps;
+}
+
+export class KeytipLayerBasicExample extends React.Component<{}, IKeytipLayerBasicExampleState> {
+
+  private startingKeySequence: IKeytipTransitionKey = { key: 'Meta', modifierKeys: [KeytipTransitionModifier.alt] };
+  private keytipMap: IKeytipMap = {};
+
+  constructor(props: {}) {
+    super(props);
+
+    // Setup state
+    this.state = {
+      showModal: false,
+      showMessageBar: false
+    };
+
+    // Setup keytips
+    this.keytipMap.Pivot1Keytip = {
+      content: 'A',
+      keySequences: [{ keys: ['a'] }]
+    } as IKeytipProps;
+
+    this.keytipMap.Pivot2Keytip = {
+      content: 'B',
+      keySequences: [{ keys: ['b'] }]
+    } as IKeytipProps;
+
+    this.keytipMap.Button1Pivot1Keytip = {
+      content: '1B',
+      keySequences: addKeytipSequence(this.keytipMap.Pivot1Keytip.keySequences, { keys: ['1', 'b'] }),
+      onExecute: (el: HTMLElement) => {
+        el.click();
+      }
+    } as IKeytipProps;
+
+    this.keytipMap.Button2Pivot1Keytip = {
+      content: '1A',
+      keySequences: addKeytipSequence(this.keytipMap.Pivot1Keytip.keySequences, { keys: ['1', 'a'] }),
+      onExecute: (el: HTMLElement) => {
+        el.click();
+      }
+    } as IKeytipProps;
+
+    this.keytipMap.Button3Pivot1Keytip = {
+      content: 'M',
+      keySequences: addKeytipSequence(this.keytipMap.Pivot1Keytip.keySequences, { keys: ['m'] }),
+      onExecute: (el: HTMLElement) => {
+        el.click();
+      }
+    } as IKeytipProps;
+
+    this.keytipMap.CommandButton1Pivot2Keytip = {
+      content: '2',
+      keySequences: addKeytipSequence(this.keytipMap.Pivot2Keytip.keySequences, { keys: ['2'] }),
+      onExecute: (el: HTMLElement) => {
+        el.click();
+      }
+    } as IKeytipProps;
+
+    this.keytipMap.CommandButton2Pivot2Keytip = {
+      content: 'Y',
+      keySequences: addKeytipSequence(this.keytipMap.Pivot2Keytip.keySequences, { keys: ['y'] }),
+      onExecute: (el: HTMLElement) => {
+        el.click();
+      }
+    } as IKeytipProps;
+
+    this.keytipMap.CommandButton3Pivot2Keytip = {
+      content: 'LK',
+      keySequences: addKeytipSequence(this.keytipMap.Pivot2Keytip.keySequences, { keys: ['l', 'k'] }),
+      onExecute: (el: HTMLElement) => {
+        el.click();
+      }
+    } as IKeytipProps;
+  }
+
+  /* tslint:disable:jsx-ban-props jsx-no-lambda */
+  public render(): JSX.Element {
+    let divStyle = {
+      width: '50%',
+      display: 'inline-block',
+      verticalAlign: 'top'
+    };
+
+    return (
+      <div>
+        <p>Press Alt-Win to enable keytips, Esc to return up a level, and Alt-Win to exit keytip mode</p>
+        <div>
+          <div style={ divStyle }>
+            <div>
+              <ActionButton
+                data-ktp-id={ convertSequencesToKeytipID(this.keytipMap.Pivot1Keytip.keySequences) }
+                text='Mock Pivot 1'
+              />
+            </div>
+            <div>
+              <DefaultButton
+                data-ktp-id={ convertSequencesToKeytipID(this.keytipMap.Button1Pivot1Keytip.keySequences) }
+                text='Test Button 1'
+                onClick={ () => { alert('Button 1'); } }
+              />
+              <DefaultButton
+                data-ktp-id={ convertSequencesToKeytipID(this.keytipMap.Button2Pivot1Keytip.keySequences) }
+                text='Test Button 2'
+                onClick={ () => { alert('Button 2'); } }
+              />
+              <DefaultButton
+                data-ktp-id={ convertSequencesToKeytipID(this.keytipMap.Button3Pivot1Keytip.keySequences) }
+                text='Test Button 3'
+                onClick={ () => { alert('Button 3'); } }
+              />
+            </div>
+          </div>
+          <div style={ divStyle }>
+            <div>
+              <ActionButton
+                data-ktp-id={ convertSequencesToKeytipID(this.keytipMap.Pivot2Keytip.keySequences) }
+                text='Mock Pivot 2'
+              />
+            </div>
+            <CommandBar
+              items={
+                [
+                  {
+                    key: 'commandBarItem1',
+                    name: 'New',
+                    icon: 'Add',
+                    onClick: this._showModal,
+                    ['data-ktp-id']: convertSequencesToKeytipID(this.keytipMap.CommandButton1Pivot2Keytip.keySequences)
+                  },
+                  {
+                    key: 'commandBarItem2',
+                    name: 'Upload',
+                    icon: 'Upload',
+                    onClick: this._showMessageBar,
+                    ['data-ktp-id']: convertSequencesToKeytipID(this.keytipMap.CommandButton2Pivot2Keytip.keySequences)
+                  }
+                ]
+              }
+              farItems={
+                [
+                  {
+                    key: 'farItem1',
+                    name: 'SubMenu',
+                    icon: 'SortLines',
+                    ['data-ktp-id']: convertSequencesToKeytipID(this.keytipMap.CommandButton3Pivot2Keytip.keySequences),
+                    subMenuProps: {
+                      items: [
+                        {
+                          key: 'emailMessage',
+                          name: 'Email message',
+                          icon: 'Mail',
+                        },
+                        {
+                          key: 'calendarEvent',
+                          name: 'Calendar event',
+                          icon: 'Calendar'
+                        }
+                      ],
+                    },
+                  }
+                ]
+              }
+            />
+          </div>
+        </div>
+        { this.state.showMessageBar &&
+          <MessageBar messageBarType={ MessageBarType.success }>
+            Success Uploading
+          </MessageBar>
+        }
+        <Modal
+          isOpen={ this.state.showModal }
+          onDismiss={ this._hideModal }
+          isBlocking={ false }
+        >
+          <h2>Hello this is a Modal</h2>
+        </Modal>
+        <KeytipLayer
+          keytipStartSequences={ [this.startingKeySequence] }
+          keytipExitSequences={ [this.startingKeySequence] }
+          id={ 'test-id' }
+        />
+      </div>
+    );
+  }
+
+  public componentDidMount(): void {
+    // Manually add keytips to the KeytipManager for now
+    // This should really be done in each component
+    for (let component of Object.keys(this.keytipMap)) {
+      registerKeytip(this.keytipMap[component]);
+    }
+  }
+
+  @autobind
+  private _showModal(): void {
+    this.setState({ showModal: true });
+  }
+
+  @autobind
+  private _hideModal(): void {
+    this.setState({ showModal: false });
+  }
+
+  @autobind
+  private _showMessageBar(): void {
+    this.setState({ showMessageBar: true });
+
+    // Hide the MessageBar after 2 seconds
+    setTimeout(this._hideMessageBar, 2000);
+  }
+
+  @autobind
+  private _hideMessageBar(): void {
+    this.setState({ showMessageBar: false });
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/KeytipLayer/index.ts b/packages/experiments/src/components/KeytipLayer/index.ts
new file mode 100644
index 0000000000000..d05637efc9388
--- /dev/null
+++ b/packages/experiments/src/components/KeytipLayer/index.ts
@@ -0,0 +1,2 @@
+export * from './KeytipLayer';
+export * from './KeytipLayer.types';
\ No newline at end of file
diff --git a/packages/experiments/src/demo/AppDefinition.tsx b/packages/experiments/src/demo/AppDefinition.tsx
index b009e29266e79..dbac4ab092ff0 100644
--- a/packages/experiments/src/demo/AppDefinition.tsx
+++ b/packages/experiments/src/demo/AppDefinition.tsx
@@ -34,6 +34,18 @@ export const AppDefinition: IAppDefinition = {
           name: 'FileTypeIcon',
           url: '#/examples/filetypeicon'
         },
+        {
+          component: require<any>('../components/Keytip/KeytipPage').KeytipPage,
+          key: 'Keytip',
+          name: 'Keytip',
+          url: '#/examples/keytip'
+        },
+        {
+          component: require<any>('../components/KeytipLayer/KeytipLayerPage').KeytipLayerPage,
+          key: 'KeytipLayer',
+          name: 'KeytipLayer',
+          url: '#/examples/keytipLayer'
+        },
         {
           component: require<any>('../components/LayoutGroup/LayoutGroupPage').LayoutGroupPage,
           key: 'LayoutGroup',
diff --git a/packages/experiments/src/utilities/keysequence/IKeySequence.test.ts b/packages/experiments/src/utilities/keysequence/IKeySequence.test.ts
new file mode 100644
index 0000000000000..0e1c057e9d82a
--- /dev/null
+++ b/packages/experiments/src/utilities/keysequence/IKeySequence.test.ts
@@ -0,0 +1,157 @@
+import {
+  IKeySequence,
+  keySequencesAreEqual,
+  keySequenceStartsWith,
+  keySequencesContain,
+  convertSequencesToKeytipID,
+  fullKeySequencesAreEqual
+} from './IKeySequence';
+import { ktpFullPrefix, ktpSeparator } from '../keytip/KeytipUtils';
+
+describe('IKeySequence', () => {
+
+  describe('keySequencesAreEqual', () => {
+    it('empty key', () => {
+      let seq1: IKeySequence = { keys: ['a'] };
+      let seq2: IKeySequence = { keys: [] };
+      expect(keySequencesAreEqual(seq1, seq2)).toEqual(false);
+    });
+
+    it('single key', () => {
+      let seq1: IKeySequence = { keys: ['a'] };
+      let seq2: IKeySequence = { keys: ['a'] };
+      let seq3: IKeySequence = { keys: ['b'] };
+      expect(keySequencesAreEqual(seq1, seq2)).toEqual(true);
+      expect(keySequencesAreEqual(seq1, seq3)).toEqual(false);
+    });
+
+    it('multiple keys', () => {
+      let seq1: IKeySequence = { keys: ['a', 'b'] };
+      let seq2: IKeySequence = { keys: ['a', 'b'] };
+      let seq3: IKeySequence = { keys: ['b', 'a'] };
+      expect(keySequencesAreEqual(seq1, seq2)).toEqual(true);
+      expect(keySequencesAreEqual(seq1, seq3)).toEqual(false);
+    });
+
+    it('should be false when sequences are different length', () => {
+      let seq1: IKeySequence = { keys: ['a'] };
+      let seq2: IKeySequence = { keys: ['a', 'b'] };
+      expect(keySequencesAreEqual(seq1, seq2)).toEqual(false);
+    });
+  });
+
+  describe('keySequencesContain', () => {
+    it('empty sequences', () => {
+      let seq1: IKeySequence = { keys: ['a'] };
+      let sequences: IKeySequence[] = [{ keys: [] }];
+      expect(keySequencesContain(sequences, seq1)).toEqual(false);
+    });
+
+    it('empty key sequence', () => {
+      let seq1: IKeySequence = { keys: [] };
+      let sequences: IKeySequence[] = [{ keys: ['a'] }, { keys: ['b'] }];
+      expect(keySequencesContain(sequences, seq1)).toEqual(false);
+    });
+
+    it('single key', () => {
+      let seq1: IKeySequence = { keys: ['a'] };
+      let sequences: IKeySequence[] = [{ keys: ['a'] }, { keys: ['b'] }];
+      let sequences2: IKeySequence[] = [{ keys: ['a', 'b'] }];
+      expect(keySequencesContain(sequences, seq1)).toEqual(true);
+      expect(keySequencesContain(sequences2, seq1)).toEqual(false);
+    });
+
+    it('multiple keys', () => {
+      let seq1: IKeySequence = { keys: ['a', 'b'] };
+      let sequences: IKeySequence[] = [{ keys: ['a'] }, { keys: ['b'] }];
+      let sequences2: IKeySequence[] = [{ keys: ['a', 'b'] }, { keys: ['c', 'd'] }];
+      expect(keySequencesContain(sequences, seq1)).toEqual(false);
+      expect(keySequencesContain(sequences2, seq1)).toEqual(true);
+    });
+  });
+
+  describe('keySequencesStartsWith', () => {
+    it('false when the key sequence for seq1 is zero ', () => {
+      let seq1: IKeySequence = { keys: [] };
+      let seq2: IKeySequence = { keys: ['b'] };
+      expect(keySequenceStartsWith(seq1, seq2)).toEqual(false);
+    });
+
+    it('false when the key sequence for seq2 is zero ', () => {
+      let seq1: IKeySequence = { keys: ['a'] };
+      let seq2: IKeySequence = { keys: [] };
+      expect(keySequenceStartsWith(seq1, seq2)).toEqual(false);
+    });
+
+    it('false when sequence start is different', () => {
+      let seq1: IKeySequence = { keys: ['a'] };
+      let seq2: IKeySequence = { keys: ['b'] };
+      expect(keySequenceStartsWith(seq1, seq2)).toEqual(false);
+    });
+
+    it('true when sequences are equal', () => {
+      let seq1: IKeySequence = { keys: ['a'] };
+      let seq2: IKeySequence = { keys: ['a'] };
+      expect(keySequenceStartsWith(seq1, seq2)).toEqual(true);
+    });
+
+    it('true when sequence1 is a subset of sequence 2', () => {
+      let seq1: IKeySequence = { keys: ['a'] };
+      let seq2: IKeySequence = { keys: ['a', 'b'] };
+      expect(keySequenceStartsWith(seq1, seq2)).toEqual(true);
+    });
+
+    it('true when sequence2 is a subset of sequence 1', () => {
+      let seq1: IKeySequence = { keys: ['a', 'b'] };
+      let seq2: IKeySequence = { keys: ['a'] };
+      expect(keySequenceStartsWith(seq1, seq2)).toEqual(true);
+    });
+  });
+
+  describe('convertSequencesToKeytipID', () => {
+    it('for one singular key sequence', () => {
+      let keySequence: IKeySequence[] = [{ keys: ['a'] }];
+      let keytipID = convertSequencesToKeytipID(keySequence);
+      expect(keytipID).toEqual(ktpFullPrefix + 'a');
+    });
+
+    it('for one complex key sequence', () => {
+      let complexKeySequence: IKeySequence[] = [{ keys: ['a', 'd'] }];
+      let keytipID = convertSequencesToKeytipID(complexKeySequence);
+      expect(keytipID).toEqual(ktpFullPrefix + 'a' + ktpSeparator + 'd');
+    });
+
+    it('for multiple singular key sequences', () => {
+      let keySequences: IKeySequence[] = [{ keys: ['a'] }, { keys: ['c'] }];
+      let keytipID = convertSequencesToKeytipID(keySequences);
+      expect(keytipID).toEqual(ktpFullPrefix + 'a' + ktpSeparator + 'c');
+    });
+
+    it('for multiple complex key sequences', () => {
+      let complexKeySequences: IKeySequence[] = [{ keys: ['a', 'n'] }, { keys: ['c', 'b'] }];
+      let keytipID = convertSequencesToKeytipID(complexKeySequences);
+      expect(keytipID).toEqual(ktpFullPrefix + 'a' +
+        ktpSeparator + 'n' + ktpSeparator +
+        'c' + ktpSeparator + 'b');
+    });
+  });
+
+  describe('fullKeySequencesAreEqual', () => {
+    it('different lengths should not be equal', () => {
+      let keySequences1: IKeySequence[] = [{ keys: ['a', 'n'] }, { keys: ['c', 'b'] }];
+      let keySequences2: IKeySequence[] = [{ keys: ['a', 'n'] }];
+      expect(fullKeySequencesAreEqual(keySequences1, keySequences2)).toEqual(false);
+    });
+
+    it('should correctly be equal', () => {
+      let keySequences1: IKeySequence[] = [{ keys: ['a', 'n'] }, { keys: ['c', 'b'] }];
+      let keySequences2: IKeySequence[] = [{ keys: ['a', 'n'] }, { keys: ['c', 'b'] }];
+      let keySequences3: IKeySequence[] = [{ keys: ['n', 'a'] }, { keys: ['c', 'b'] }];
+      let keySequences4: IKeySequence[] = [{ keys: ['a'] }, { keys: ['c', 'b'] }];
+
+      expect(fullKeySequencesAreEqual(keySequences1, keySequences2)).toEqual(true);
+      expect(fullKeySequencesAreEqual(keySequences1, keySequences3)).toEqual(false);
+      expect(fullKeySequencesAreEqual(keySequences1, keySequences4)).toEqual(false);
+    });
+  });
+});
\ No newline at end of file
diff --git a/packages/experiments/src/utilities/keysequence/IKeySequence.ts b/packages/experiments/src/utilities/keysequence/IKeySequence.ts
new file mode 100644
index 0000000000000..f7f6e7a57731e
--- /dev/null
+++ b/packages/experiments/src/utilities/keysequence/IKeySequence.ts
@@ -0,0 +1,83 @@
+import { ktpPrefix, ktpSeparator } from '../keytip/KeytipUtils';
+import { find } from '../../Utilities';
+
+export interface IKeySequence {
+  keys: string[];
+}
+
+/**
+ * Tests for equality between two IKeySequences
+ *
+ * @param seq1 - First IKeySequence
+ * @param seq2 - Second IKeySequence
+ * @returns {boolean} T/F if the two sequences are equal
+ */
+export function keySequencesAreEqual(seq1: IKeySequence, seq2: IKeySequence): boolean {
+  let keyCodes1 = seq1.keys.join();
+  let keyCodes2 = seq2.keys.join();
+  return keyCodes1 === keyCodes2;
+}
+
+/**
+ * Tests for equality between two arrays of IKeySequence
+ *
+ * @param seq1 - First IKeySequence[]
+ * @param seq2 - Second IKeySequence[]
+ * @returns {boolean} T/F if the sequences are equal
+ */
+export function fullKeySequencesAreEqual(seq1: IKeySequence[], seq2: IKeySequence[]): boolean {
+  if (seq1.length !== seq2.length) {
+    return false;
+  }
+
+  for (let i = 0; i < seq1.length; i++) {
+    if (!keySequencesAreEqual(seq1[i], seq2[i])) {
+      return false;
+    }
+  }
+
+  return true;
+}
+
+/**
+ * Tests if 'seq' is present in 'sequences'
+ *
+ * @param sequences - Array of IKeySequence
+ * @param seq - IKeySequence to check for in 'sequences'
+ * @returns {boolean} T/F if 'sequences' contains 'seq'
+ */
+export function keySequencesContain(sequences: IKeySequence[], seq: IKeySequence): boolean {
+  return !!find(sequences, (sequence: IKeySequence) => {
+    return keySequencesAreEqual(sequence, seq);
+  });
+}
+
+/**
+ * Method returns true if the key squence of the object with minimum length is in the other key sequence.
+ * If the minium length is zero, then it will default to false.
+ *
+ * @param seq1 - First IKeySequence
+ * @param seq2 - Second IKeySequence
+ * @returns {boolean} T/F if seq1 starts with seq2, or vice versa
+ */
+export function keySequenceStartsWith(seq1: IKeySequence, seq2: IKeySequence): boolean {
+  let keyCodes1 = seq1.keys.join();
+  let keyCodes2 = seq2.keys.join();
+  if (keyCodes1.length === 0 || keyCodes2.length === 0) {
+    return false;
+  }
+  return keyCodes1.indexOf(keyCodes2) === 0 || keyCodes2.indexOf(keyCodes1) === 0;
+}
+
+/**
+ * Converts a whole set of KeySequences into one keytip ID, which will be the ID for the last keytip sequence specified
+ * keySequences should not include the initial keytip 'start' sequence
+ *
+ * @param keySequences - Full path of IKeySequences for one keytip
+ * @returns {string} String to use for the keytip ID
+ */
+export function convertSequencesToKeytipID(keySequences: IKeySequence[]): string {
+  return keySequences.reduce((prevValue: string, keySequence: IKeySequence): string => {
+    return prevValue + ktpSeparator + keySequence.keys.join(ktpSeparator);
+  }, ktpPrefix);
+}
\ No newline at end of file
diff --git a/packages/experiments/src/utilities/keysequence/IKeytipTransitionKey.test.ts b/packages/experiments/src/utilities/keysequence/IKeytipTransitionKey.test.ts
new file mode 100644
index 0000000000000..0024e7ae23188
--- /dev/null
+++ b/packages/experiments/src/utilities/keysequence/IKeytipTransitionKey.test.ts
@@ -0,0 +1,59 @@
+import { IKeytipTransitionKey, transitionKeysAreEqual, transitionKeysContain } from './IKeytipTransitionKey';
+import { KeytipTransitionModifier } from '../../Keytip';
+
+describe('IKeytipTransitionKey', () => {
+
+  describe('transitionKeysAreEqual', () => {
+    it('key only equality', () => {
+      let key1: IKeytipTransitionKey = { key: 'a' };
+      let key2: IKeytipTransitionKey = { key: 'b' };
+      let key3: IKeytipTransitionKey = { key: 'a' };
+
+      expect(transitionKeysAreEqual(key1, key2)).toEqual(false);
+      expect(transitionKeysAreEqual(key1, key3)).toEqual(true);
+    });
+
+    it('key and modifier equality', () => {
+      let key1: IKeytipTransitionKey = { key: 'a', modifierKeys: [KeytipTransitionModifier.alt] };
+      let key2: IKeytipTransitionKey = { key: 'a' };
+      let key3: IKeytipTransitionKey = { key: 'a', modifierKeys: [KeytipTransitionModifier.ctrl] };
+      let key4: IKeytipTransitionKey = { key: 'a', modifierKeys: [KeytipTransitionModifier.alt, KeytipTransitionModifier.shift] };
+      let key5: IKeytipTransitionKey = { key: 'a', modifierKeys: [KeytipTransitionModifier.shift, KeytipTransitionModifier.alt] };
+
+      expect(transitionKeysAreEqual(key1, key2)).toEqual(false);
+      expect(transitionKeysAreEqual(key1, key3)).toEqual(false);
+      expect(transitionKeysAreEqual(key1, key4)).toEqual(false);
+      // Order doesn't matter
+      expect(transitionKeysAreEqual(key4, key5)).toEqual(true);
+    });
+  });
+
+  describe('transitionKeySequencesContain', () => {
+    it('key only', () => {
+      let key1: IKeytipTransitionKey = { key: 'a' };
+
+      let keys1: IKeytipTransitionKey[] = [{ key: 'a' }];
+      let keys2: IKeytipTransitionKey[] = [{ key: 'a' }, { key: 'b' }];
+      let keys3: IKeytipTransitionKey[] = [{ key: 'c' }, { key: 'b' }];
+
+      expect(transitionKeysContain(keys1, key1)).toEqual(true);
+      expect(transitionKeysContain(keys2, key1)).toEqual(true);
+      expect(transitionKeysContain(keys3, key1)).toEqual(false);
+    });
+
+    it('key and modifier', () => {
+      let key1: IKeytipTransitionKey = { key: 'a', modifierKeys: [KeytipTransitionModifier.alt] };
+
+      let keys1: IKeytipTransitionKey[] = [{ key: 'a', modifierKeys: [KeytipTransitionModifier.alt] }];
+      let keys2: IKeytipTransitionKey[] = [{ key: 'b', modifierKeys: [KeytipTransitionModifier.alt] }];
+      let keys3: IKeytipTransitionKey[] = [
+        { key: 'a', modifierKeys: [KeytipTransitionModifier.alt, KeytipTransitionModifier.ctrl] },
+        { key: 'a', modifierKeys: [KeytipTransitionModifier.alt] }
+      ];
+
+      expect(transitionKeysContain(keys1, key1)).toEqual(true);
+      expect(transitionKeysContain(keys2, key1)).toEqual(false);
+      expect(transitionKeysContain(keys3, key1)).toEqual(true);
+    });
+  });
+});
\ No newline at end of file
diff --git a/packages/experiments/src/utilities/keysequence/IKeytipTransitionKey.ts b/packages/experiments/src/utilities/keysequence/IKeytipTransitionKey.ts
new file mode 100644
index 0000000000000..9c02307f9a6e7
--- /dev/null
+++ b/packages/experiments/src/utilities/keysequence/IKeytipTransitionKey.ts
@@ -0,0 +1,58 @@
+import { KeytipTransitionModifier } from '../../Keytip';
+import { find } from '../../Utilities';
+
+export interface IKeytipTransitionKey {
+  key: string;
+  modifierKeys?: KeytipTransitionModifier[];
+}
+
+/**
+ * Tests for equality between two IKeytipTransitionKeys
+ *
+ * @param key1 - First IKeytipTransitionKey
+ * @param key2 - Second IKeytipTransitionKey
+ * @returns {boolean} T/F if the transition keys are equal
+ */
+export function transitionKeysAreEqual(key1: IKeytipTransitionKey, key2: IKeytipTransitionKey): boolean {
+  if (key1.key !== key2.key) {
+    return false;
+  }
+
+  let mod1 = key1.modifierKeys;
+  let mod2 = key2.modifierKeys;
+
+  if ((!mod1 && mod2) || (mod1 && !mod2)) {
+    // Not equal if one modifier is defined and the other isn't
+    return false;
+  }
+
+  if (mod1 && mod2) {
+    if (mod1.length !== mod2.length) {
+      return false;
+    }
+
+    // Sort both arrays
+    mod1 = mod1.sort();
+    mod2 = mod2.sort();
+    for (let i = 0; i < mod1.length; i++) {
+      if (mod1[i] !== mod2[i]) {
+        return false;
+      }
+    }
+  }
+
+  return true;
+}
+
+/**
+ * Tests if 'key' is present in 'keys'
+ *
+ * @param keys - Array of IKeytipTransitionKey
+ * @param key - IKeytipTransitionKey to find in 'keys'
+ * @returns {boolean} T/F if 'keys' contains 'key'
+ */
+export function transitionKeysContain(keys: IKeytipTransitionKey[], key: IKeytipTransitionKey): boolean {
+  return !!find(keys, (transitionKey: IKeytipTransitionKey) => {
+    return transitionKeysAreEqual(transitionKey, key);
+  });
+}
\ No newline at end of file
diff --git a/packages/experiments/src/utilities/keytip/KeytipManager.test.tsx b/packages/experiments/src/utilities/keytip/KeytipManager.test.tsx
new file mode 100644
index 0000000000000..210b8921341a7
--- /dev/null
+++ b/packages/experiments/src/utilities/keytip/KeytipManager.test.tsx
@@ -0,0 +1,326 @@
+import * as React from 'react';
+
+import { KeytipManager } from './KeytipManager';
+import { IKeySequence, convertSequencesToKeytipID } from '../../utilities/keysequence/IKeySequence';
+import { IKeytipTransitionKey } from '../../utilities/keysequence/IKeytipTransitionKey';
+import { KeytipTree, IKeytipTreeNode } from './KeytipTree';
+import { KeytipLayer } from '../../KeytipLayer';
+import { IKeytipProps, KeytipTransitionModifier } from '../../Keytip';
+import { ktpSeparator, ktpFullPrefix } from '../../utilities/keytip/KeytipUtils';
+import { mount, ReactWrapper } from 'enzyme';
+
+const keytipStartSequences: IKeytipTransitionKey[] = [{ key: 'Meta', modifierKeys: [KeytipTransitionModifier.alt] }];
+const keytipExitSequences: IKeytipTransitionKey[] = [{ key: 'Meta', modifierKeys: [KeytipTransitionModifier.alt] }];
+const keytipReturnSequences: IKeytipTransitionKey[] = [{ key: 'Escape' }];
+const layerID = 'my-layer-id';
+const keytipIdB = ktpFullPrefix + 'b';
+const keytipIdC = ktpFullPrefix + 'c';
+const keytipIdE1 = ktpFullPrefix + 'e' + ktpSeparator + '1';
+const keytipIdE2 = ktpFullPrefix + 'e' + ktpSeparator + '2';
+const keytipOverflowIdM = ktpFullPrefix + 'o' + ktpSeparator + 'm';
+
+describe('KeytipManager', () => {
+  const keytipManager = KeytipManager.getInstance();
+  const onEnterKeytipMode: jest.Mock = jest.fn();
+  const onExitKeytipMode: jest.Mock = jest.fn();
+
+  let defaultKeytipLayer: ReactWrapper;
+
+  beforeEach(() => {
+    // Create layer
+    defaultKeytipLayer = mount(
+      <KeytipLayer
+        id={ layerID }
+        keytipStartSequences={ keytipStartSequences }
+        keytipReturnSequences={ keytipReturnSequences }
+        keytipExitSequences={ keytipExitSequences }
+        onEnterKeytipMode={ onEnterKeytipMode }
+        onExitKeytipMode={ onExitKeytipMode }
+      />
+    );
+  });
+
+  describe('getAriaDescribedBy', () => {
+
+    it('returns just the layer ID when an empty sequence is passed in', () => {
+      let keySequence: IKeySequence[] = [];
+      let ariaDescribedBy = keytipManager.getAriaDescribedBy(keySequence);
+      expect(ariaDescribedBy).toEqual(layerID);
+    });
+
+    it('for one singular key sequence', () => {
+      let keySequence: IKeySequence[] = [{ keys: ['b'] }];
+      let ariaDescribedBy = keytipManager.getAriaDescribedBy(keySequence);
+      expect(ariaDescribedBy).toEqual(layerID + ' ' + convertSequencesToKeytipID(keySequence));
+    });
+
+    it('for one complex key sequence', () => {
+      let keySequence: IKeySequence[] = [{ keys: ['b', 'c'] }];
+      let ariaDescribedBy = keytipManager.getAriaDescribedBy(keySequence);
+      expect(ariaDescribedBy).toEqual(layerID + ' ' + convertSequencesToKeytipID(keySequence));
+    });
+
+    it('for multiple singular key sequences', () => {
+      let keySequences: IKeySequence[] = [{ keys: ['b'] }, { keys: ['c'] }];
+      let ariaDescribedBy = keytipManager.getAriaDescribedBy(keySequences);
+      expect(ariaDescribedBy).toEqual(layerID +
+        ' ' + convertSequencesToKeytipID([keySequences[0]]) +
+        ' ' + convertSequencesToKeytipID(keySequences));
+    });
+
+    it('for multiple complex key sequences', () => {
+      let keySequences: IKeySequence[] = [{ keys: ['a', 'n'] }, { keys: ['c', 'b'] }];
+      let ariaDescribedBy = keytipManager.getAriaDescribedBy(keySequences);
+      expect(ariaDescribedBy).toEqual(layerID +
+        ' ' + convertSequencesToKeytipID([keySequences[0]]) +
+        ' ' + convertSequencesToKeytipID(keySequences));
+    });
+  });
+
+  describe('processInput tests', () => {
+
+    beforeEach(() => {
+      keytipManager.keytipTree = populateTreeMap(keytipManager.keytipTree, layerID);
+    });
+
+    // On Exit keytip mode
+    it('Call on exit keytip mode when we process alt + left win ', () => {
+      keytipManager.keytipTree.currentKeytip = keytipManager.keytipTree.root;
+      keytipManager.processTransitionInput({ key: 'Meta', modifierKeys: [KeytipTransitionModifier.alt] });
+      expect(onExitKeytipMode).toBeCalled();
+    });
+
+    // On Enter keytip mode
+    it('Call on enter keytip mode when we process alt + left win', () => {
+      keytipManager.processTransitionInput({ key: 'Meta', modifierKeys: [KeytipTransitionModifier.alt] });
+      expect(onEnterKeytipMode).toBeCalled();
+    });
+
+    // Return Tests
+    it('Should call on exit keytip mode because we are going back in the root', () => {
+      keytipManager.keytipTree.currentKeytip = keytipManager.keytipTree.root;
+      keytipManager.processTransitionInput({ key: 'Escape' });
+      expect(onExitKeytipMode).toBeCalled();
+    });
+
+    it('C`s Return func should be invoked and Current keytip pointer should return to equal root node', () => {
+      const onReturnC: jest.Mock = jest.fn();
+      keytipManager.keytipTree.currentKeytip = { ...keytipManager.keytipTree.nodeMap[keytipIdC], onReturn: onReturnC };
+      keytipManager.processTransitionInput({ key: 'Escape' });
+      expect(keytipManager.keytipTree.currentKeytip).toEqual(keytipManager.keytipTree.root);
+      expect(onReturnC).toBeCalled();
+    });
+
+    // Processing keys tests
+    it('Processing a leaf node should execute it`s onExecute func and trigger onExitKeytipMode', () => {
+      const onExecuteC: jest.Mock = jest.fn();
+      keytipManager.keytipTree.nodeMap[keytipIdC] = { ...keytipManager.keytipTree.nodeMap[keytipIdC], onExecute: onExecuteC };
+      keytipManager.keytipTree.currentKeytip = keytipManager.keytipTree.root;
+      keytipManager.processInput('c');
+      expect(onExecuteC).toBeCalled();
+      expect(onExitKeytipMode).toBeCalled();
+      expect(keytipManager.currentSequence.keys.length).toEqual(0);
+    });
+
+    it('Processing a node with two keys should save sequence and wait for second key', () => {
+      const onExecuteE2: jest.Mock = jest.fn();
+      keytipManager.keytipTree.nodeMap[keytipIdE2] = { ...keytipManager.keytipTree.nodeMap[keytipIdE2], onExecute: onExecuteE2 };
+      keytipManager.keytipTree.currentKeytip = keytipManager.keytipTree.root;
+      keytipManager.processInput('e');
+      // We are still waiting for second key
+      expect(keytipManager.currentSequence.keys.length).toEqual(1);
+      keytipManager.processInput('2');
+      expect(onExecuteE2).toBeCalled();
+      expect(keytipManager.currentSequence.keys.length).toEqual(0);
+      expect(onExitKeytipMode).toBeCalled();
+    });
+
+    it('Processing a node with two keys should wait for second key and if not leaf make children visible', () => {
+      const onExecuteE1: jest.Mock = jest.fn();
+      keytipManager.keytipTree.nodeMap[keytipIdE1] = { ...keytipManager.keytipTree.nodeMap[keytipIdE1], onExecute: onExecuteE1 };
+      keytipManager.keytipTree.currentKeytip = keytipManager.keytipTree.root;
+      keytipManager.processInput('e');
+      // We are still waiting for second key
+      expect(keytipManager.currentSequence.keys.length).toEqual(1);
+      keytipManager.processInput('1');
+      expect(onExecuteE1).toBeCalled();
+      // There is no more buffer in the sequence
+      expect(keytipManager.currentSequence.keys.length).toEqual(0);
+      // Children keytips should be visible
+      let childrenKeytips = getKeytips(defaultKeytipLayer, keytipManager.keytipTree.currentKeytip.children);
+      for (let childrenKeytip of childrenKeytips) {
+        expect(childrenKeytip.visible).toEqual(true);
+      }
+      // We haven't exited keytip mode (current keytip is not undefined and is set to the matched keytip)
+      expect(keytipManager.keytipTree.currentKeytip).toEqual(keytipManager.keytipTree.nodeMap[keytipIdE1]);
+    });
+
+    it('Processing a node which is not leaf but its children are not in the DOM', () => {
+      const onExecuteB: jest.Mock = jest.fn();
+      keytipManager.keytipTree.nodeMap[keytipIdB] = { ...keytipManager.keytipTree.nodeMap[keytipIdB], onExecute: onExecuteB };
+      keytipManager.keytipTree.currentKeytip = keytipManager.keytipTree.root;
+      keytipManager.processInput('b');
+      // Node B' on execute should be called
+      expect(onExecuteB).toBeCalled();
+      // There is no more buffer in the sequence
+      expect(keytipManager.currentSequence.keys.length).toEqual(0);
+      // We haven't exited keytip mode (current keytip is not undefined and is set to the matched keytip)
+      expect(keytipManager.keytipTree.currentKeytip).toEqual(keytipManager.keytipTree.nodeMap[keytipIdB]);
+    });
+
+    it('Processing a node with with a keytipLink should make currentKeytip its link', () => {
+      const onExecuteOM: jest.Mock = jest.fn();
+      let nodeOverflowM = keytipManager.keytipTree.nodeMap[keytipOverflowIdM];
+      nodeOverflowM.onExecute = onExecuteOM;
+      keytipManager.keytipTree.currentKeytip = keytipManager.keytipTree.root;
+      keytipManager.processInput('m');
+      // Expect overflow m node's execute func to be
+      expect(onExecuteOM).toBeCalled();
+    });
+  });
+
+  describe('registerKeytip', () => {
+
+    it('should automatically show Keytip when currentKeytip is its parent', () => {
+      // Create keytip b
+      const keytipSequenceB: IKeySequence[] = [{ keys: ['b'] }];
+      const keytipBProps: IKeytipProps = {
+        keySequences: keytipSequenceB,
+        content: 'B'
+      };
+      keytipManager.registerKeytip(keytipBProps);
+
+      // Set currentKeytip to 'b'
+      keytipManager.keytipTree.currentKeytip = keytipManager.keytipTree.nodeMap[keytipIdB];
+
+      // Add a node 'g' who's parent is 'b'
+      const keytipSequenceG: IKeySequence[] = [{ keys: ['b'] }, { keys: ['g'] }];
+      const keytipIdG = ktpFullPrefix + 'b' + ktpSeparator + 'g';
+      const keytipGProps: IKeytipProps = {
+        keySequences: keytipSequenceG,
+        content: 'G'
+      };
+      keytipManager.registerKeytip(keytipGProps);
+
+      // G should now be visible in the layer
+      let keytipG = getKeytips(defaultKeytipLayer, [keytipIdG]);
+      expect(keytipG).toHaveLength(1);
+      expect(keytipG[0].visible).toEqual(true);
+    });
+
+    it('should update the keytip if it has the same key sequence', () => {
+      // Create keytip b
+      const keytipSequenceB: IKeySequence[] = [{ keys: ['b'] }];
+      const keytipBProps: IKeytipProps = {
+        keySequences: keytipSequenceB,
+        content: 'B',
+        disabled: false
+      };
+      keytipManager.registerKeytip(keytipBProps);
+
+      let keytipB = getKeytips(defaultKeytipLayer, [keytipIdB]);
+      let keytipNodeB = keytipManager.keytipTree.nodeMap[keytipIdB];
+      expect(keytipB).toHaveLength(1);
+      expect(keytipB[0].disabled).toEqual(false);
+      expect(keytipB[0].content).toEqual('B');
+      expect(keytipNodeB.disabled).toEqual(false);
+
+      // Change some properties
+      keytipBProps.disabled = true;
+      keytipBProps.content = 'BEE';
+
+      // Re-register
+      keytipManager.registerKeytip(keytipBProps);
+
+      keytipB = getKeytips(defaultKeytipLayer, [keytipIdB]);
+      keytipNodeB = keytipManager.keytipTree.nodeMap[keytipIdB];
+      expect(keytipB).toHaveLength(1);
+      expect(keytipB[0].disabled).toEqual(true);
+      expect(keytipB[0].content).toEqual('BEE');
+      expect(keytipNodeB.disabled).toEqual(true);
+    });
+  });
+});
+
+function getKeytips(keytipLayer: ReactWrapper, keytipIDs?: string[]): IKeytipProps[] {
+  let currentKeytips: IKeytipProps[] = keytipLayer.state('keytips');
+  if (keytipIDs) {
+    return currentKeytips.filter((currentKeytip: IKeytipProps) => {
+      return keytipIDs.indexOf(convertSequencesToKeytipID(currentKeytip.keySequences)) !== -1;
+    });
+  } else {
+    return currentKeytips;
+  }
+}
+
+function populateTreeMap(keytipTree: KeytipTree, rootId: string): KeytipTree {
+  /**
+   *   Tree should end up looking like:
+   *
+   *            a
+   *     /     /   |   \   \   \
+   *     b   c    e1   e2   o   m
+   *             / \        |
+   *            d   f       m
+   *
+   */
+
+  const keytipSequenceB: IKeySequence = { keys: ['b'] };
+  // Node C
+  const keytipSequenceC: IKeySequence = { keys: ['c'] };
+
+  // Node D
+  const keytipIdD = ktpFullPrefix + 'e' + ktpSeparator + '1' + ktpSeparator + 'd';
+  const keytipSequenceD: IKeySequence = { keys: ['d'] };
+
+  // Node F
+  const keytipIdF = ktpFullPrefix + 'e' + ktpSeparator + '1' + ktpSeparator + 'f';
+  const keytipSequenceF: IKeySequence = { keys: ['f'] };
+
+  // Node E1
+  const keytipSequenceE1: IKeySequence = { keys: ['e', '1'] };
+
+  // Node E2
+  const keytipSequenceE2: IKeySequence = { keys: ['e', '2'] };
+
+  // Node O
+  const keytipIdO = ktpFullPrefix + 'o';
+  const keytipOverflowSeq: IKeySequence = { keys: ['o'] };
+
+  // Node M
+  const keytipIdM = ktpFullPrefix + 'm';
+  const keytipSeqM: IKeySequence = { keys: ['m'] };
+
+  let nodeB = createTreeNode(keytipIdB, rootId, [], keytipSequenceB, true /* hasChildrenNodes*/);
+  let nodeC = createTreeNode(keytipIdC, rootId, [], keytipSequenceC);
+  let nodeE1 = createTreeNode(keytipIdE1, rootId, [keytipIdD, keytipIdF], keytipSequenceE1);
+  let nodeE2 = createTreeNode(keytipIdE2, rootId, [keytipIdD, keytipIdF], keytipSequenceE2);
+  let nodeD = createTreeNode(keytipIdD, keytipIdE1, [], keytipSequenceD);
+  let nodeF = createTreeNode(keytipIdF, keytipIdE1, [], keytipSequenceF);
+  let nodeO = createTreeNode(keytipIdO, rootId, [keytipOverflowIdM], keytipOverflowSeq, true);
+  let nodeOM = createTreeNode(keytipOverflowIdM, keytipIdO, [], keytipSeqM);
+  let nodeM = createTreeNode(keytipIdM, rootId, [], keytipSeqM);
+  nodeM.keytipLink = nodeOM;
+  keytipTree.nodeMap[rootId].children.push(keytipIdB, keytipIdC, keytipIdE1, keytipIdE2, keytipIdO, keytipIdM);
+  keytipTree.nodeMap[keytipIdB] = nodeB;
+  keytipTree.nodeMap[keytipIdC] = nodeC;
+  keytipTree.nodeMap[keytipIdE1] = nodeE1;
+  keytipTree.nodeMap[keytipIdE2] = nodeE2;
+  keytipTree.nodeMap[keytipIdD] = nodeD;
+  keytipTree.nodeMap[keytipIdF] = nodeF;
+  keytipTree.nodeMap[keytipIdO] = nodeO;
+  keytipTree.nodeMap[keytipOverflowIdM] = nodeOM;
+  keytipTree.nodeMap[keytipIdM] = nodeM;
+  return keytipTree;
+}
+
+function createTreeNode(id: string, parentId: string, childrenIds: string[],
+  sequence: IKeySequence, hasChildren?: boolean): IKeytipTreeNode {
+  return {
+    id,
+    parent: parentId,
+    children: childrenIds,
+    keytipSequence: sequence,
+    hasChildrenNodes: hasChildren
+  };
+}
\ No newline at end of file
diff --git a/packages/experiments/src/utilities/keytip/KeytipManager.ts b/packages/experiments/src/utilities/keytip/KeytipManager.ts
new file mode 100644
index 0000000000000..74d804118d371
--- /dev/null
+++ b/packages/experiments/src/utilities/keytip/KeytipManager.ts
@@ -0,0 +1,267 @@
+import { KeytipLayer } from '../../KeytipLayer';
+import { KeytipTree, IKeytipTreeNode } from './KeytipTree';
+import { IKeytipProps } from '../../Keytip';
+import {
+  IKeySequence,
+  convertSequencesToKeytipID,
+} from '../../utilities/keysequence/IKeySequence';
+import {
+  transitionKeysContain,
+  IKeytipTransitionKey
+} from '../../utilities/keysequence/IKeytipTransitionKey';
+import { constructKeytipTargetFromId } from '../../utilities/keytip/KeytipUtils';
+
+export class KeytipManager {
+  private static _instance: KeytipManager = new KeytipManager();
+
+  public keytipTree: KeytipTree;
+  public currentSequence: IKeySequence;
+
+  private _layer: KeytipLayer;
+  private _enableSequences: IKeytipTransitionKey[];
+  private _exitSequences: IKeytipTransitionKey[];
+  private _returnSequences: IKeytipTransitionKey[];
+
+  /**
+   * Static function to get singleton KeytipManager instance
+   *
+   * @returns {KeytipManager} Singleton KeytipManager instance
+   */
+  public static getInstance(): KeytipManager {
+    return this._instance;
+  }
+
+  /**
+   * Sets the _layer property and creates a KeytipTree
+   * Should be called from the KeytipLayer constructor
+   *
+   * @param layer - KeytipLayer object
+   */
+  public init(layer: KeytipLayer): void {
+    this._layer = layer;
+    this.currentSequence = { keys: [] };
+    this._enableSequences = this._layer.props.keytipStartSequences!;
+    this._exitSequences = this._layer.props.keytipExitSequences!;
+    this._returnSequences = this._layer.props.keytipReturnSequences!;
+    // Create the KeytipTree
+    this.keytipTree = new KeytipTree(this._layer.props.id);
+  }
+
+  /**
+   * Gets the aria-describedby property for a set of keySequences
+   * keySequences should not include the initial keytip 'start' sequence
+   *
+   * @param keySequences - Full path of IKeySequences for one keytip
+   * @returns {string} String to use for the aria-describedby property for the element with this Keytip
+   */
+  public getAriaDescribedBy(keySequences: IKeySequence[]): string {
+    let describedby = this._layer.props.id;
+    if (!keySequences.length) {
+      // Return just the layer ID
+      return describedby;
+    }
+
+    return keySequences.reduce((prevValue: string, keySequence: IKeySequence, currentIndex: number): string => {
+      return prevValue + ' ' + convertSequencesToKeytipID(keySequences.slice(0, currentIndex + 1));
+    }, describedby);
+  }
+
+  /**
+   * Registers a keytip
+   * TODO: should this return an any? or something else
+   *
+   * @param keytipProps - Keytip to register
+   * @returns {any} Object containing the aria-describedby and data-ktp-id DOM properties
+   */
+  // tslint:disable-next-line:no-any
+  public registerKeytip(keytipProps: IKeytipProps): any {
+    // Set 'visible' property to true in keytipProps if currentKeytip is this keytips parent
+    if (this._isCurrentKeytipParent(keytipProps)) {
+      keytipProps.visible = true;
+    }
+
+    // Set the 'keytips' property in _layer
+    this._layer.registerKeytip(keytipProps);
+    this.keytipTree.addNode(keytipProps);
+
+    // Construct aria-describedby and data-ktp-id attributes and return
+    let ariaDescribedBy = this.getAriaDescribedBy(keytipProps.keySequences);
+    let ktpId = convertSequencesToKeytipID(keytipProps.keySequences);
+
+    return {
+      'aria-describedby': ariaDescribedBy,
+      'data-ktp-id': ktpId
+    };
+  }
+
+  /**
+   * Unregisters a keytip
+   *
+   * @param keytipToRemove - IKeytipProps of the keytip to remove
+   */
+  public unregisterKeytip(keytipToRemove: IKeytipProps): void {
+    this._layer.unregisterKeytip(keytipToRemove);
+    this.keytipTree.removeNode(keytipToRemove.keySequences);
+  }
+
+  /**
+   * Method that makes visible keytips currently in the DOM given a list of IDs.
+   *
+   * @param ids: list of Ids to show.
+   */
+  public showKeytips(ids: string[]): void {
+    this._changeKeytipVisibility(ids, true /*visible*/);
+  }
+
+  /**
+   * Method that hides keytips from the DOM given a list of IDs.
+   * If a list is not passed in, than it will hide all the currently registered keytips.
+   *
+   * @param ids: optional list of Ids to hide.
+   */
+  public hideKeytips(ids?: string[]): void {
+    // We can either hide keytips from the supplied array of ids, or all keytips.
+    let keysToHide = ids ? ids : Object.keys(this.keytipTree.nodeMap);
+    this._changeKeytipVisibility(keysToHide, false /* visible */);
+  }
+
+  public getLayerId(): string {
+    return this._layer.props.id;
+  }
+
+  public exitKeytipMode(): void {
+    this.hideKeytips();
+    this.keytipTree.currentKeytip = undefined;
+    this._layer.exitKeytipMode();
+  }
+
+  public enterKeytipMode(): void {
+    this._layer.enterKeytipMode();
+  }
+
+  /**
+   * Processes an IKeytipTransitionKey entered by the user
+   *
+   * @param transitionKey - IKeytipTransitionKey received by the layer to process
+   */
+  public processTransitionInput(transitionKey: IKeytipTransitionKey): void {
+    if (transitionKeysContain(this._exitSequences, transitionKey) && this.keytipTree.currentKeytip) {
+      // If key sequence is in 'exit sequences', exit keytip mode
+      this.exitKeytipMode();
+    } else if (transitionKeysContain(this._returnSequences, transitionKey)) {
+      // If key sequence is in return sequences, move currentKeytip to parent (or if currentKeytip is the root, exit)
+      if (this.keytipTree.currentKeytip) {
+        if (this.keytipTree.currentKeytip.id === this.keytipTree.root.id) {
+          // We are at the root, exit keytip mode
+          this.exitKeytipMode();
+        } else {
+          // If this keytip has a onReturn prop, we execute the func.
+          if (this.keytipTree.currentKeytip.onReturn) {
+            let domEl = this._getKeytipDOMElement(this.keytipTree.currentKeytip.id);
+            this.keytipTree.currentKeytip.onReturn(domEl);
+          }
+
+          // Clean currentSequence array
+          this.currentSequence.keys = [];
+          // Return pointer to its parent
+          this.keytipTree.currentKeytip = this.keytipTree.nodeMap[this.keytipTree.currentKeytip.parent!];
+          // Hide all keytips
+          this.hideKeytips();
+          // Show children keytips of the new currentKeytip
+          this.showKeytips(this.keytipTree.currentKeytip.children);
+        }
+      }
+    } else if (transitionKeysContain(this._enableSequences, transitionKey) && !this.keytipTree.currentKeytip) {
+      // If key sequence is in 'entry sequences' and currentKeytip is null, set currentKeytip to root
+      this.keytipTree.currentKeytip = this.keytipTree.root;
+      this.hideKeytips();
+      // Show children of root
+      this.showKeytips(this.keytipTree.currentKeytip.children);
+      // Trigger onEnter callback
+      this.enterKeytipMode();
+    }
+  }
+
+  /**
+   * Processes inputs from the document listener and traverse the keytip tree
+   *
+   * @param key - Key pressed by the user
+   */
+  public processInput(key: string): void {
+    // Concat the input key with the current sequence
+    let currentSequence: IKeySequence = { keys: [...this.currentSequence.keys, ...[key]] };
+
+    // currentKeytip must be defined, otherwise we haven't entered keytip mode yet
+    if (this.keytipTree.currentKeytip) {
+      let node = this.keytipTree.getExactMatchedNode(currentSequence, this.keytipTree.currentKeytip);
+      if (node) {
+        // If this is a persisted keytip, then we use its keytipLink
+        this.keytipTree.currentKeytip = node.keytipLink ? node.keytipLink : node;
+
+        // Execute this node's onExecute if defined
+        if (this.keytipTree.currentKeytip.onExecute) {
+          let domEl = this._getKeytipDOMElement(this.keytipTree.currentKeytip.id);
+          this.keytipTree.currentKeytip.onExecute(domEl);
+        }
+
+        // To exit keytipMode after executing keytip we should check if currentKeytip has no children and
+        // if the node doesn't have children nodes.
+        if (this.keytipTree.currentKeytip.children.length === 0 && !this.keytipTree.currentKeytip.hasChildrenNodes) {
+          this.exitKeytipMode();
+        } else {
+          // Show all children keytips
+          this.hideKeytips();
+          this.showKeytips(this.keytipTree.currentKeytip.children);
+        }
+
+        // Clear currentSequence
+        this.currentSequence = { keys: [] };
+        return;
+      }
+
+      let partialNodes = this.keytipTree.getPartiallyMatchedNodes(currentSequence, this.keytipTree.currentKeytip);
+      if (partialNodes.length > 0) {
+        // We found nodes that partially match the sequence, so we show only those.
+        this.hideKeytips();
+        let ids = partialNodes.map((partialNode: IKeytipTreeNode) => { return partialNode.id; });
+        this.showKeytips(ids);
+        // Save currentSequence
+        this.currentSequence = currentSequence;
+      }
+    }
+  }
+
+  private _changeKeytipVisibility(ids: string[], visible: boolean): void {
+    // Change visibility in layer
+    this._layer.setKeytipVisibility(ids, visible);
+  }
+
+  /**
+   * Tests if the currentKeytip in this.keytipTree is the parent of 'keytipProps'
+   *
+   * @param keytipProps - Keytip to test the parent for
+   * @returns {boolean} T/F if the currentKeytip is this keytipProps' parent
+   */
+  private _isCurrentKeytipParent(keytipProps: IKeytipProps): boolean {
+    if (this.keytipTree.currentKeytip) {
+      let fullSequence = [...keytipProps.keySequences];
+      // Take off the last sequence to calculate the parent ID
+      fullSequence.pop();
+      // Parent ID is the root if there aren't any more sequences
+      let parentID = fullSequence.length === 0 ? this.keytipTree.root.id : convertSequencesToKeytipID(fullSequence);
+      return this.keytipTree.currentKeytip.id === parentID;
+    }
+    return false;
+  }
+
+  /**
+   * Gets the DOM element for the specified keytip
+   *
+   * @param keytipId - ID of the keytip to query for
+   * @return {HTMLElement} DOM element of the keytip
+   */
+  private _getKeytipDOMElement(keytipId: string): HTMLElement {
+    let dataKeytipId = constructKeytipTargetFromId(keytipId);
+    return document.querySelector(dataKeytipId) as HTMLElement;
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/utilities/keytip/KeytipTree.test.tsx b/packages/experiments/src/utilities/keytip/KeytipTree.test.tsx
new file mode 100644
index 0000000000000..3fa2d92a72578
--- /dev/null
+++ b/packages/experiments/src/utilities/keytip/KeytipTree.test.tsx
@@ -0,0 +1,652 @@
+import * as React from 'react';
+
+import * as ReactTestUtils from 'react-dom/test-utils';
+import { IKeytipProps, KeytipTransitionModifier } from '../../Keytip';
+import { KeytipTree, IKeytipTreeNode } from './KeytipTree';
+import { KeytipLayer } from '../../KeytipLayer';
+import { KeytipManager } from './KeytipManager';
+import { IKeySequence } from '../../utilities/keysequence/IKeySequence';
+import { IKeytipTransitionKey } from '../../utilities/keysequence/IKeytipTransitionKey';
+import { ktpSeparator, ktpFullPrefix } from '../../utilities/keytip/KeytipUtils';
+
+describe('KeytipTree', () => {
+  const layerID = 'my-layer-id';
+  const keytipStartSequences: IKeytipTransitionKey[] = [{ key: 'Meta', modifierKeys: [KeytipTransitionModifier.alt] }];
+  const keytipExitSequences: IKeytipTransitionKey[] = [{ key: 'Meta', modifierKeys: [KeytipTransitionModifier.alt] }];
+  const keytipReturnSequences: IKeytipTransitionKey[] = [{ key: 'Escape' }];
+  const keytipManager = KeytipManager.getInstance();
+
+  beforeEach(() => {
+    // Create layer
+    ReactTestUtils.renderIntoDocument<KeytipLayer>(
+      <KeytipLayer
+        id={ layerID }
+        keytipStartSequences={ keytipStartSequences }
+        keytipReturnSequences={ keytipReturnSequences }
+        keytipExitSequences={ keytipExitSequences }
+      />
+    );
+  });
+
+  it('constructor creates a root node', () => {
+    let keytipTree = keytipManager.keytipTree;
+
+    // Tree root ID should be the layer's ID
+    expect(keytipTree.root.id).toEqual(layerID);
+    // Tree root should not have any children
+    expect(keytipTree.root.children).toHaveLength(0);
+
+    // Only the root should be specified in the nodeMap
+    expect(keytipTree.nodeMap[layerID]).toBeDefined();
+    expect(Object.keys(keytipTree.nodeMap)).toHaveLength(1);
+  });
+
+  describe('addNode', () => {
+    it('directly under root works correctly', () => {
+      let keytipTree = keytipManager.keytipTree;
+
+      // TreeNode C, will be child of root
+      const keytipIdC = ktpFullPrefix + 'c';
+      const sampleKeySequence: IKeySequence[] = [{ keys: ['c'] }];
+
+      keytipTree.addNode(createKeytipProps(sampleKeySequence));
+
+      // Test C has been added to root's children
+      expect(keytipTree.root.children).toHaveLength(1);
+      expect(keytipTree.root.children).toContain(keytipIdC);
+
+      // Test C was added to nodeMap
+      expect(Object.keys(keytipTree.nodeMap)).toHaveLength(2);
+      let keytipNodeC = keytipTree.nodeMap[keytipIdC];
+      expect(keytipNodeC).toBeDefined();
+
+      // Test TreeNode C properties
+      expect(keytipNodeC.id).toEqual(keytipIdC);
+      expect(keytipNodeC.children).toHaveLength(0);
+      expect(keytipNodeC.parent).toEqual(layerID);
+    });
+
+    it('two levels from root', () => {
+      let keytipTree = keytipManager.keytipTree;
+
+      // Parent
+      const keytipIdC = ktpFullPrefix + 'c';
+      const keytipSequenceC: IKeySequence[] = [{ keys: ['c'] }];
+
+      const keytipIdB = ktpFullPrefix + 'c' + ktpSeparator + 'b';
+      const keytipSequenceB: IKeySequence[] = [{ keys: ['c'] }, { keys: ['b'] }];
+
+      keytipTree.addNode(createKeytipProps(keytipSequenceC));
+      keytipTree.addNode(createKeytipProps(keytipSequenceB));
+
+      // Test B was added to C's children
+      expect(keytipTree.nodeMap[keytipIdC].children).toHaveLength(1);
+      expect(keytipTree.nodeMap[keytipIdC].children).toContain(keytipIdB);
+
+      // Test B was added to nodeMap
+      let keytipNodeB = keytipTree.nodeMap[keytipIdB];
+      expect(keytipNodeB).toBeDefined();
+
+      // Test TreeNode B properties
+      expect(keytipNodeB.id).toEqual(keytipIdB);
+      expect(keytipNodeB.children).toHaveLength(0);
+      expect(keytipNodeB.parent).toEqual(keytipIdC);
+    });
+
+    it('add a child node before its parent', () => {
+      let keytipTree = keytipManager.keytipTree;
+
+      // Parent
+      const keytipIdC = ktpFullPrefix + 'c';
+      const keytipSequenceC: IKeySequence[] = [{ keys: ['c'] }];
+
+      // Child
+      const keytipIdB = ktpFullPrefix + 'c' + ktpSeparator + 'b';
+      const keytipSequenceB: IKeySequence[] = [{ keys: ['c'] }, { keys: ['b'] }];
+
+      keytipTree.addNode(createKeytipProps(keytipSequenceB));
+
+      // Test B was added to nodeMap
+      let keytipNodeB = keytipTree.nodeMap[keytipIdB];
+      expect(keytipNodeB).toBeDefined();
+
+      // Test B has C set as parent
+      expect(keytipNodeB.parent).toEqual(keytipIdC);
+
+      // Test root still has no children
+      expect(keytipTree.root.children).toHaveLength(0);
+
+      // Test C is added to nodeMap
+      let keytipNodeC = keytipTree.nodeMap[keytipIdC];
+      expect(keytipNodeC).toBeDefined();
+
+      // Test C has no parent
+      expect(keytipNodeC.parent).toBeFalsy();
+
+      // Test C has B as its child
+      expect(keytipTree.nodeMap[keytipIdC].children).toHaveLength(1);
+      expect(keytipTree.nodeMap[keytipIdC].children).toContain(keytipIdB);
+
+      // Add parent
+      keytipTree.addNode(createKeytipProps(keytipSequenceC));
+
+      keytipNodeC = keytipTree.nodeMap[keytipIdC];
+      expect(keytipNodeC).toBeDefined();
+
+      // Test C has B as its child
+      expect(keytipTree.nodeMap[keytipIdC].children).toHaveLength(1);
+      expect(keytipTree.nodeMap[keytipIdC].children).toContain(keytipIdB);
+
+      // Test root has C as its child
+      expect(keytipTree.root.children).toHaveLength(1);
+      expect(keytipTree.root.children).toContain(keytipIdC);
+    });
+
+    it('creates a correct Tree when many nodes are added out of order', () => {
+      /**
+       *   Tree should end up looking like:
+       *
+       *            a
+       *          /   \
+       *         c     e
+       *        /     / \
+       *       b     d   f
+       *
+       * Nodes will be added in order: F, C, B, D, E
+       */
+
+      let keytipTree = keytipManager.keytipTree;
+
+      // Node B
+      const keytipIdB = ktpFullPrefix + 'c' + ktpSeparator + 'b';
+      const keytipSequenceB: IKeySequence[] = [{ keys: ['c'] }, { keys: ['b'] }];
+
+      // Node C
+      const keytipIdC = ktpFullPrefix + 'c';
+      const keytipSequenceC: IKeySequence[] = [{ keys: ['c'] }];
+
+      // Node D
+      const keytipIdD = ktpFullPrefix + 'e' + ktpSeparator + 'd';
+      const keytipSequenceD: IKeySequence[] = [{ keys: ['e'] }, { keys: ['d'] }];
+
+      // Node E
+      const keytipIdE = ktpFullPrefix + 'e';
+      const keytipSequenceE: IKeySequence[] = [{ keys: ['e'] }];
+
+      // Node F
+      const keytipIdF = ktpFullPrefix + 'e' + ktpSeparator + 'f';
+      const keytipSequenceF: IKeySequence[] = [{ keys: ['e'] }, { keys: ['f'] }];
+
+      keytipTree.addNode(createKeytipProps(keytipSequenceF));
+      keytipTree.addNode(createKeytipProps(keytipSequenceC));
+      keytipTree.addNode(createKeytipProps(keytipSequenceB));
+      keytipTree.addNode(createKeytipProps(keytipSequenceD));
+      keytipTree.addNode(createKeytipProps(keytipSequenceE));
+
+      // Test all nodes are in the nodeMap
+      let keytipNodeB = keytipTree.nodeMap[keytipIdB];
+      expect(keytipNodeB).toBeDefined();
+      let keytipNodeC = keytipTree.nodeMap[keytipIdC];
+      expect(keytipNodeC).toBeDefined();
+      let keytipNodeD = keytipTree.nodeMap[keytipIdD];
+      expect(keytipNodeD).toBeDefined();
+      let keytipNodeE = keytipTree.nodeMap[keytipIdE];
+      expect(keytipNodeE).toBeDefined();
+      let keytipNodeF = keytipTree.nodeMap[keytipIdF];
+      expect(keytipNodeF).toBeDefined();
+
+      // Test each node's parent and children
+      expect(keytipNodeB.parent).toEqual(keytipIdC);
+      expect(keytipNodeB.children).toHaveLength(0);
+
+      expect(keytipNodeC.parent).toEqual(layerID);
+      expect(keytipNodeC.children).toHaveLength(1);
+      expect(keytipNodeC.children).toContain(keytipIdB);
+
+      expect(keytipNodeD.parent).toEqual(keytipIdE);
+      expect(keytipNodeD.children).toHaveLength(0);
+
+      expect(keytipNodeE.parent).toEqual(layerID);
+      expect(keytipNodeE.children).toHaveLength(2);
+      expect(keytipNodeE.children).toContain(keytipIdD);
+      expect(keytipNodeE.children).toContain(keytipIdF);
+
+      expect(keytipNodeF.parent).toEqual(keytipIdE);
+      expect(keytipNodeF.children).toHaveLength(0);
+
+      // Test root's children
+      expect(keytipTree.root.children).toHaveLength(2);
+      expect(keytipTree.root.children).toContain(keytipIdC);
+      expect(keytipTree.root.children).toContain(keytipIdE);
+    });
+
+    it('add a node with overflowsetSequence when overflow node already has been created', () => {
+      let rootId = 'a';
+      let keytipTree = new KeytipTree(rootId);
+      /**
+       *   Tree should end up looking like: Where O is overflow menu and d is inside
+       *
+       *              a
+       *          /   |
+       *          o  d
+       *          |
+       *          d
+       *
+       */
+
+      const keytipIdO = ktpFullPrefix + 'o';
+      const overflowSequence: IKeySequence = { keys: ['o'] };
+      keytipTree.addNode({ keySequences: [overflowSequence], content: '' });
+
+      const keytipPersistedIdD = ktpFullPrefix + 'd';
+      const keytipOverflowIdD = ktpFullPrefix + 'o' + ktpSeparator + 'd';
+      const keytipSequenceD: IKeySequence[] = [{ keys: ['d'] }];
+      let keytipProps = createKeytipProps(keytipSequenceD, overflowSequence);
+
+      // Add d node with an overflow sequence
+      keytipTree.addNode(keytipProps);
+
+      // Root should have overflow keytip node and persisted keytip node.
+      expect(keytipTree.root.children).toHaveLength(2);
+
+      // Test nodes are in the node map
+      let keytipOverflowNode = keytipTree.nodeMap[keytipIdO];
+      expect(keytipOverflowNode).toBeDefined();
+      let keytipPersistedD = keytipTree.nodeMap[keytipPersistedIdD];
+      expect(keytipPersistedD).toBeDefined();
+      let keytipOverflowD = keytipTree.nodeMap[keytipOverflowIdD];
+      expect(keytipOverflowD).toBeDefined();
+
+      // Test hierarchy
+      expect(keytipOverflowNode.parent).toEqual(rootId);
+      expect(keytipPersistedD.parent).toEqual(rootId);
+      expect(keytipOverflowD.parent).toEqual(keytipIdO);
+
+      // Persisted keytip keytip link should be the node in the overflow
+      expect(keytipPersistedD.keytipLink).toEqual(keytipOverflowD);
+    });
+
+    it('add a node with overflowsetSequence when overflow node has not been created', () => {
+      let rootId = 'a';
+      let keytipTree = new KeytipTree(rootId);
+      /**
+       *   Tree should end up looking like: Where O is overflow menu and d is inside
+       *
+       *              a
+       *          /   |
+       *          o  d
+       *          |
+       *          d
+       *
+       */
+
+      const keytipIdO = ktpFullPrefix + 'o';
+      const overflowSequence: IKeySequence = { keys: ['o'] };
+
+      const keytipPersistedIdD = ktpFullPrefix + 'd';
+      const keytipOverflowIdD = ktpFullPrefix + 'o' + ktpSeparator + 'd';
+      const keytipSequenceD: IKeySequence[] = [{ keys: ['d'] }];
+      let keytipProps = createKeytipProps(keytipSequenceD, overflowSequence);
+
+      // Add d node with an overflow sequence
+      keytipTree.addNode(keytipProps);
+
+      // Root should have overflow keytip node and persisted keytip node.
+      expect(keytipTree.root.children).toHaveLength(2);
+
+      // Test nodes are in the node map
+      let keytipOverflowNode = keytipTree.nodeMap[keytipIdO];
+      expect(keytipOverflowNode).toBeDefined();
+      let keytipPersistedD = keytipTree.nodeMap[keytipPersistedIdD];
+      expect(keytipPersistedD).toBeDefined();
+      let keytipOverflowD = keytipTree.nodeMap[keytipOverflowIdD];
+      expect(keytipOverflowD).toBeDefined();
+
+      // Test hierarchy
+      expect(keytipOverflowNode.parent).toEqual(rootId);
+      expect(keytipPersistedD.parent).toEqual(rootId);
+      expect(keytipOverflowD.parent).toEqual(keytipIdO);
+
+      // Persisted keytip keytip link should be the node in the overflow
+      expect(keytipPersistedD.keytipLink).toEqual(keytipOverflowD);
+    });
+  });
+
+  describe('removeNode', () => {
+    it('removes a child node of root and has no children', () => {
+      let keytipTree = keytipManager.keytipTree;
+
+      // Node C
+      const keytipIdC = ktpFullPrefix + 'c';
+      const keytipSequenceC: IKeySequence[] = [{ keys: ['c'] }];
+
+      keytipTree.addNode(createKeytipProps(keytipSequenceC));
+
+      // Remove C from the tree
+      keytipTree.removeNode(keytipSequenceC);
+
+      // Verify that C is not in the node map
+      expect(keytipTree.nodeMap[keytipIdC]).toBeUndefined();
+
+      // Verify that root has no children
+      expect(keytipTree.root.children).toHaveLength(0);
+    });
+
+    it('removes multiple nodes in order correctly', () => {
+      let keytipTree = keytipManager.keytipTree;
+
+      // Node C
+      const keytipIdC = ktpFullPrefix + 'c';
+      const keytipSequenceC: IKeySequence[] = [{ keys: ['c'] }];
+
+      // Node B
+      const keytipIdB = ktpFullPrefix + 'c' + ktpSeparator + 'b';
+      const keytipSequenceB: IKeySequence[] = [{ keys: ['c'] }, { keys: ['b'] }];
+
+      keytipTree.addNode(createKeytipProps(keytipSequenceC));
+      keytipTree.addNode(createKeytipProps(keytipSequenceB));
+
+      // Remove B
+      keytipTree.removeNode(keytipSequenceB);
+
+      // Verify that B is not in the node map
+      expect(keytipTree.nodeMap[keytipIdB]).toBeUndefined();
+
+      // Verify C has no children
+      let nodeC = keytipTree.nodeMap[keytipIdC];
+      expect(nodeC.children).toHaveLength(0);
+
+      // Remove C
+      keytipTree.removeNode(keytipSequenceC);
+
+      // Verify that C is not in the node map
+      expect(keytipTree.nodeMap[keytipIdC]).toBeUndefined();
+
+      // Verify that root has no children
+      expect(keytipTree.root.children).toHaveLength(0);
+    });
+
+    it('removes children as well when a parent is removed', () => {
+      let keytipTree = keytipManager.keytipTree;
+
+      // Node C
+      const keytipIdC = ktpFullPrefix + 'c';
+      const keytipSequenceC: IKeySequence[] = [{ keys: ['c'] }];
+
+      // Node B
+      const keytipIdB = ktpFullPrefix + 'c' + ktpSeparator + 'b';
+      const keytipSequenceB: IKeySequence[] = [{ keys: ['c'] }, { keys: ['b'] }];
+
+      keytipTree.addNode(createKeytipProps(keytipSequenceC));
+      keytipTree.addNode(createKeytipProps(keytipSequenceB));
+
+      // Remove C
+      keytipTree.removeNode(keytipSequenceC);
+
+      // Verify that C is not in the node map
+      expect(keytipTree.nodeMap[keytipIdC]).toBeUndefined();
+      // Verify that B is not in the node map
+      expect(keytipTree.nodeMap[keytipIdB]).toBeUndefined();
+
+      // Verify that root has no children
+      expect(keytipTree.root.children).toHaveLength(0);
+    });
+
+    it('Removing persisted keytip also removes overflow link node', () => {
+      let rootId = 'a';
+      let keytipTree = new KeytipTree(rootId);
+      /**
+       *   Tree should end up looking like: Where O is overflow menu and d is inside
+       *
+       *              a
+       *          /   |
+       *          o  d
+       *          |
+       *          d
+       *
+       */
+
+      const keytipIdO = ktpFullPrefix + 'o';
+      const overflowSequence: IKeySequence = { keys: ['o'] };
+      keytipTree.addNode({ keySequences: [overflowSequence], content: '' });
+
+      const keytipSequenceD: IKeySequence[] = [{ keys: ['d'] }];
+      let keytipProps = createKeytipProps(keytipSequenceD, overflowSequence);
+
+      // Add d node with an overflow sequence
+      keytipTree.addNode(keytipProps);
+
+      keytipTree.removeNode(keytipSequenceD);
+      expect(keytipTree.nodeMap[rootId].children).toHaveLength(1);
+      // Removing persisted d, should also remove o's children.
+      expect(keytipTree.nodeMap[keytipIdO].children).toHaveLength(0);
+    });
+  });
+
+  describe('getExactlyMatchedNodes', () => {
+    it('get matched node tests ', () => {
+      let keytipTree = new KeytipTree('id1');
+
+      /**
+       *   Tree should end up looking like:
+       *
+       *              a
+       *          /   |   \
+       *         c    e1   e2
+       *              / \
+       *             d   f
+       *
+       */
+
+      // Node C
+      const keytipIdC = ktpFullPrefix + 'c';
+      const keytipSequenceC: IKeySequence = { keys: ['c'] };
+
+      // Node D
+      const keytipIdD = ktpFullPrefix + 'e' + ktpSeparator + '1' + ktpSeparator + 'd';
+      const keytipSequenceD: IKeySequence = { keys: ['d'] };
+
+      // Node F
+      const keytipIdF = ktpFullPrefix + 'e' + ktpSeparator + '1' + ktpSeparator + 'f';
+      const keytipSequenceF: IKeySequence = { keys: ['f'] };
+
+      // Node E1
+      const keytipIdE1 = ktpFullPrefix + 'e' + ktpSeparator + '1';
+      const keytipSequenceE1: IKeySequence = { keys: ['e', '1'] };
+
+      // Node E2
+      const keytipIdE2 = ktpFullPrefix + 'e' + ktpSeparator + '2';
+      const keytipSequenceE2: IKeySequence = { keys: ['e', '2'] };
+
+      // Node A
+      const keytipIdA = ktpFullPrefix + 'a';
+      const keytipSequenceA: IKeySequence = { keys: ['a'] };
+
+      let nodeA = createTreeNode(keytipIdA, '', [keytipIdC, keytipIdE1, keytipIdE2], keytipSequenceA);
+      let nodeC = createTreeNode(keytipIdC, keytipIdA, [], keytipSequenceC);
+      let nodeE1 = createTreeNode(keytipIdE1, keytipIdA, [keytipIdD, keytipIdF], keytipSequenceE1);
+      let nodeE2 = createTreeNode(keytipIdE2, keytipIdA, [keytipIdD, keytipIdF], keytipSequenceE2);
+      let nodeD = createTreeNode(keytipIdD, keytipIdE1, [], keytipSequenceD);
+      let nodeF = createTreeNode(keytipIdF, keytipIdE1, [], keytipSequenceF);
+
+      keytipTree.nodeMap[keytipIdA] = nodeA;
+      keytipTree.nodeMap[keytipIdC] = nodeC;
+      keytipTree.nodeMap[keytipIdE1] = nodeE1;
+      keytipTree.nodeMap[keytipIdE2] = nodeE2;
+      keytipTree.nodeMap[keytipIdD] = nodeD;
+      keytipTree.nodeMap[keytipIdF] = nodeF;
+
+      // node should be undefined because it is not a child of node A.
+      let matchedNode1 = keytipTree.getExactMatchedNode({ keys: ['n'] }, nodeA);
+      expect(matchedNode1).toBeUndefined();
+
+      // node should be equal to node c due to keysequnce.
+      let matchedNode2 = keytipTree.getExactMatchedNode({ keys: ['c'] }, nodeA);
+      expect(matchedNode2).toEqual(nodeC);
+    });
+
+    it('should be undefined is matched node is disabled ', () => {
+      let keytipTree = new KeytipTree('id1');
+
+      /**
+       *   Tree should end up looking like:
+       *
+       *              a
+       *          /   |   \
+       *         c    e1   e2
+
+       *
+       */
+
+      // Node C
+      const keytipIdC = ktpFullPrefix + 'c';
+      const keytipSequenceC: IKeySequence = { keys: ['c'] };
+
+      // Node E1
+      const keytipIdE1 = ktpFullPrefix + 'e' + ktpSeparator + '1';
+      const keytipSequenceE1: IKeySequence = { keys: ['e', '1'] };
+
+      // Node E2
+      const keytipIdE2 = ktpFullPrefix + 'e' + ktpSeparator + '2';
+      const keytipSequenceE2: IKeySequence = { keys: ['e', '2'] };
+
+      // Node A
+      const keytipIdA = ktpFullPrefix + 'a';
+      const keytipSequenceA: IKeySequence = { keys: ['a'] };
+
+      let nodeA = createTreeNode(keytipIdA, '', [keytipIdC, keytipIdE1, keytipIdE2], keytipSequenceA);
+      let nodeC = createTreeNode(keytipIdC, keytipIdA, [], keytipSequenceC);
+      nodeC.disabled = true;
+      let nodeE1 = createTreeNode(keytipIdE1, keytipIdA, [], keytipSequenceE1);
+      let nodeE2 = createTreeNode(keytipIdE2, keytipIdA, [], keytipSequenceE2);
+
+      keytipTree.nodeMap[keytipIdA] = nodeA;
+      keytipTree.nodeMap[keytipIdC] = nodeC;
+      keytipTree.nodeMap[keytipIdE1] = nodeE1;
+      keytipTree.nodeMap[keytipIdE2] = nodeE2;
+
+      // node should be undefined because it is disabled.
+      let matchedNode1 = keytipTree.getExactMatchedNode({ keys: ['c'] }, nodeA);
+      expect(matchedNode1).toBeUndefined();
+    });
+  });
+
+  describe('getPartiallyMatchedNodes', () => {
+    it('get partially matched node tests ', () => {
+      let keytipTree = new KeytipTree('id1');
+
+      /**
+       *   Tree should end up looking like:
+       *
+       *              a
+       *             |   \
+       *            e1   e2
+       *              / \
+       *             d   f
+       *
+       */
+
+      // Node D
+      const keytipIdD = ktpFullPrefix + 'e' + ktpSeparator + '1' + ktpSeparator + 'd';
+      const keytipSequenceD: IKeySequence = { keys: ['d'] };
+
+      // Node F
+      const keytipIdF = ktpFullPrefix + 'e' + ktpSeparator + '1' + ktpSeparator + 'f';
+      const keytipSequenceF: IKeySequence = { keys: ['f'] };
+
+      // Node E1
+      const keytipIdE1 = ktpFullPrefix + 'e' + ktpSeparator + '1';
+      const keytipSequenceE1: IKeySequence = { keys: ['e', '1'] };
+
+      // Node E2
+      const keytipIdE2 = ktpFullPrefix + 'e' + ktpSeparator + '2';
+      const keytipSequenceE2: IKeySequence = { keys: ['e', '2'] };
+
+      // Node A
+      const keytipIdA = ktpFullPrefix + 'a';
+      const keytipSequenceA: IKeySequence = { keys: ['a'] };
+
+      let nodeA = createTreeNode(keytipIdA, '', [keytipIdE1, keytipIdE2], keytipSequenceA);
+      let nodeE1 = createTreeNode(keytipIdE1, keytipIdA, [keytipIdD, keytipIdF], keytipSequenceE1);
+      let nodeE2 = createTreeNode(keytipIdE2, keytipIdA, [keytipIdD, keytipIdF], keytipSequenceE2);
+      let nodeD = createTreeNode(keytipIdD, keytipIdE1, [], keytipSequenceD);
+      let nodeF = createTreeNode(keytipIdF, keytipIdE1, [], keytipSequenceF);
+
+      keytipTree.nodeMap[keytipIdA] = nodeA;
+      keytipTree.nodeMap[keytipIdE1] = nodeE1;
+      keytipTree.nodeMap[keytipIdE2] = nodeE2;
+      keytipTree.nodeMap[keytipIdD] = nodeD;
+      keytipTree.nodeMap[keytipIdF] = nodeF;
+
+      // nodes array should be empty.
+      let matchedNodes1 = keytipTree.getPartiallyMatchedNodes({ keys: ['n'] }, nodeA);
+      expect(matchedNodes1.length).toEqual(0);
+
+      // nodes array should be empty.
+      let matchedNodes2 = keytipTree.getPartiallyMatchedNodes({ keys: [] }, nodeA);
+      expect(matchedNodes2.length).toEqual(0);
+
+      // nodes array should be equal to 2.
+      let matchedNodes3 = keytipTree.getPartiallyMatchedNodes({ keys: ['e'] }, nodeA);
+      expect(matchedNodes3.length).toEqual(2);
+    });
+
+    it('get partially matched nodes that are not disabled ', () => {
+      let keytipTree = new KeytipTree('id1');
+
+      /**
+       *   Tree should end up looking like:
+       *
+       *              a
+       *             |   \
+       *            e1   e2
+       *              / \
+       *             d   f
+       *
+       */
+
+      // Node E1
+      const keytipIdE1 = ktpFullPrefix + 'e' + ktpSeparator + '1';
+      const keytipSequenceE1: IKeySequence = { keys: ['e', '1'] };
+
+      // Node E2
+      const keytipIdE2 = ktpFullPrefix + 'e' + ktpSeparator + '2';
+      const keytipSequenceE2: IKeySequence = { keys: ['e', '2'] };
+
+      // Node A
+      const keytipIdA = ktpFullPrefix + 'a';
+      const keytipSequenceA: IKeySequence = { keys: ['a'] };
+
+      let nodeA = createTreeNode(keytipIdA, '', [keytipIdE1, keytipIdE2], keytipSequenceA);
+      let nodeE1 = createTreeNode(keytipIdE1, keytipIdA, [], keytipSequenceE1);
+      let nodeE2 = createTreeNode(keytipIdE2, keytipIdA, [], keytipSequenceE2);
+      nodeE2.disabled = true;
+
+      keytipTree.nodeMap[keytipIdA] = nodeA;
+      keytipTree.nodeMap[keytipIdE1] = nodeE1;
+      keytipTree.nodeMap[keytipIdE2] = nodeE2;
+
+      // nodes array should equal 1, for node e2 is disabled.
+      let matchedNodes = keytipTree.getPartiallyMatchedNodes({ keys: ['e'] }, nodeA);
+      expect(matchedNodes.length).toEqual(1);
+    });
+  });
+});
+
+function createKeytipProps(keySequences: IKeySequence[], overflowSequence?: IKeySequence): IKeytipProps {
+  return {
+    keySequences,
+    overflowSetSequence: overflowSequence,
+    // Just add empty content since it's required, but not needed for tests
+    content: ''
+  };
+}
+
+function createTreeNode(id: string, parentId: string, childrenIds: string[], sequence: IKeySequence): IKeytipTreeNode {
+  return {
+    id,
+    parent: parentId,
+    children: childrenIds,
+    keytipSequence: sequence
+  };
+}
\ No newline at end of file
diff --git a/packages/experiments/src/utilities/keytip/KeytipTree.ts b/packages/experiments/src/utilities/keytip/KeytipTree.ts
new file mode 100644
index 0000000000000..232f00d4e388e
--- /dev/null
+++ b/packages/experiments/src/utilities/keytip/KeytipTree.ts
@@ -0,0 +1,294 @@
+import {
+  IKeySequence,
+  keySequencesAreEqual,
+  keySequenceStartsWith,
+  convertSequencesToKeytipID
+} from '../../utilities/keysequence/IKeySequence';
+import { IKeytipProps } from 'src/Keytip';
+import { find } from '../../Utilities';
+
+export interface IKeytipTreeNode {
+  /**
+   * ID of the <Keytip> DOM element. Needed to locate the correct keytip in the KeytipLayer's 'keytip' state array
+   */
+  id: string;
+
+  /**
+   * KeySequence that invokes this KeytipTreeNode's onExecute function
+   */
+  keytipSequence: IKeySequence;
+
+  /**
+   * Control's execute function for when keytip is invoked, passed from the component to the Manager in the IKeytipProps
+   */
+  onExecute?: (el: HTMLElement) => void;
+
+  /**
+   * Function to execute when we return to this keytip
+   */
+  onReturn?: (el: HTMLElement) => void;
+
+  /**
+   * List of keytip IDs that should become visible when this keytip is pressed, can be empty
+   */
+  children: string[];
+
+  /**
+   * Parent keytip ID
+   */
+  parent: string;
+
+  /**
+   * Whether or not this node has children nodes or not. Should be used for menus/overflow components, that have
+   * their children registered after the initial rendering of the DOM.
+   */
+  hasChildrenNodes?: boolean;
+
+  /**
+   * T/F if this keytip's component is currently disabled
+   */
+  disabled?: boolean;
+
+  /**
+   * Link to another keytip node if this is a persisted keytip
+   */
+  keytipLink?: IKeytipTreeNode;
+}
+
+export interface IKeytipTreeNodeMap {
+  [nodeId: string]: IKeytipTreeNode;
+}
+
+export class KeytipTree {
+  public currentKeytip?: IKeytipTreeNode;
+  public currentSequence: IKeySequence;
+  public root: IKeytipTreeNode;
+  public nodeMap: IKeytipTreeNodeMap = {};
+
+  /**
+   * KeytipTree constructor
+   *
+   * @param rootId - Layer ID to create the root node of the tree
+   */
+  constructor(rootId: string) {
+
+    // Root has no keytipSequence, we instead check _enableSequences to handle multiple entry points
+    this.root = {
+      id: rootId,
+      children: [],
+      parent: '',
+      keytipSequence: { keys: [] },
+      hasChildrenNodes: true
+    };
+    this.currentSequence = { keys: [] };
+    this.nodeMap[this.root.id] = this.root;
+  }
+
+  /**
+   * Add a keytip node to this KeytipTree
+   *
+   * @param keytipProps - Keytip to add to the Tree
+   */
+  public addNode(keytipProps: IKeytipProps): void {
+    let fullSequence = [...keytipProps.keySequences];
+    let nodeID = convertSequencesToKeytipID(fullSequence);
+    // This keytip's sequence is the last one defined
+    let keytipSequence = fullSequence.pop();
+    // Parent ID is the root if there aren't any more sequences
+    let parentID = fullSequence.length === 0 ? this.root.id : convertSequencesToKeytipID(fullSequence);
+
+    let overflowNode = undefined;
+    // Account for overflowSetSequence
+    if (keytipProps.overflowSetSequence && keytipSequence) {
+      let overflowParentNode = this._getOrCreateOverflowNode(keytipProps.overflowSetSequence, parentID, fullSequence);
+      let overflowNodeID = convertSequencesToKeytipID([...fullSequence, keytipProps.overflowSetSequence, keytipSequence]);
+      overflowNode = this.nodeMap[overflowNodeID];
+
+      // Create or update the persisted keytip
+      if (overflowNode) {
+        overflowNode.keytipSequence = keytipSequence;
+        overflowNode.onExecute = keytipProps.onExecute;
+        overflowNode.hasChildrenNodes = keytipProps.hasChildrenNodes;
+        overflowNode.parent = overflowParentNode.id;
+        overflowNode.disabled = keytipProps.disabled;
+      } else {
+        overflowNode = this._createNode(overflowNodeID, keytipSequence, overflowParentNode.id, [], keytipProps.hasChildrenNodes);
+        this.nodeMap[overflowNodeID] = overflowNode;
+      }
+      overflowParentNode.children.push(overflowNodeID);
+    }
+
+    // See if node already exists
+    let node = this.nodeMap[nodeID];
+    if (node) {
+      // If node exists, it was added when one of its children was added or is now being updated
+      // Update values
+      node.keytipSequence = keytipSequence!;
+      node.onExecute = keytipProps.onExecute;
+      node.onReturn = keytipProps.onReturn;
+      node.hasChildrenNodes = keytipProps.hasChildrenNodes;
+      node.keytipLink = overflowNode;
+      node.parent = parentID;
+      node.disabled = keytipProps.disabled;
+    } else {
+      // If node doesn't exist, add node
+      node = this._createNode(nodeID, keytipSequence!, parentID, [], keytipProps.hasChildrenNodes,
+        keytipProps.onExecute, keytipProps.onReturn, keytipProps.disabled);
+      node.keytipLink = overflowNode;
+      this.nodeMap[nodeID] = node;
+    }
+
+    // Get parent node given its id.
+    let parent = this._getOrCreateParentNode(parentID);
+
+    // Add node to parent's children if not already added
+    if (parent.children.indexOf(nodeID) === -1) {
+      parent.children.push(nodeID);
+    }
+  }
+
+  /**
+   * Removes a node from the KeytipTree
+   * Will also remove all of the node's children from the Tree
+   *
+   * @param sequence - full IKeySequence of the node to remove
+   */
+  public removeNode(sequence: IKeySequence[]): void {
+    let fullSequence = [...sequence];
+    let nodeID = convertSequencesToKeytipID(fullSequence);
+    // Take off the last sequence to calculate the parent ID
+    fullSequence.pop();
+    // Parent ID is the root if there aren't any more sequences
+    let parentID = fullSequence.length === 0 ? this.root.id : convertSequencesToKeytipID(fullSequence);
+
+    let parent = this.nodeMap[parentID];
+    if (parent) {
+      // Remove node from its parent's children
+      parent.children.splice(parent.children.indexOf(nodeID), 1);
+    }
+
+    let node = this.nodeMap[nodeID];
+    if (node) {
+      // Remove all the node's children from the nodeMap
+      let children = node.children;
+      for (let child of children) {
+        delete this.nodeMap[child];
+      }
+
+      // If node has an overflowLink, delete that node too.
+      let overflowLink = node.keytipLink;
+      if (overflowLink) {
+        let parentOverflow = this.nodeMap[overflowLink.parent];
+        parentOverflow.children.splice(parentOverflow.children.indexOf(overflowLink.id, 1));
+        delete this.nodeMap[overflowLink.id];
+      }
+
+      // Remove the node from the nodeMap
+      delete this.nodeMap[nodeID];
+    }
+  }
+
+  /**
+   * Searches the currentKeytip's children to exactly match a sequence
+   *
+   * @param keySequence - IKeySequence to match
+   * @param currentKeytip - The keytip who's children will try to match
+   * @returns {IKeytipTreeNode | undefined} The node that exactly matched the keySequence, or undefined if none matched
+   */
+  public getExactMatchedNode(keySequence: IKeySequence, currentKeytip: IKeytipTreeNode): IKeytipTreeNode | undefined {
+    let possibleNodes = this._getNodes(currentKeytip.children);
+
+    return find(possibleNodes, (node: IKeytipTreeNode) => {
+      return keySequencesAreEqual(node.keytipSequence, keySequence) && !node.disabled;
+    });
+  }
+
+  /**
+   * Searches the currentKeytip's children to find nodes that start with the given sequence
+   *
+   * @param keySequence - IKeySequence to partially match
+   * @param currentKeytip - The keytip who's children will try to partially match
+   * @returns {IKeytipTreeNode[]} List of tree nodes that partially match the given sequence
+   */
+  public getPartiallyMatchedNodes(keySequence: IKeySequence, currentKeytip: IKeytipTreeNode): IKeytipTreeNode[] {
+    let possibleNodes = this._getNodes(currentKeytip.children);
+
+    return possibleNodes.filter((node: IKeytipTreeNode) => {
+      return keySequenceStartsWith(node.keytipSequence, keySequence) && !node.disabled;
+    });
+  }
+
+  /**
+   * Retrieves or creates a parent node based on an ID
+   *
+   * @param parentId - ID of the parent node
+   * @returns {IKeytipTreeNode} Node retrieved or created from the given parent ID
+   */
+  private _getOrCreateParentNode(parentId: string): IKeytipTreeNode {
+    let parent = this.nodeMap[parentId];
+    if (!parent) {
+      // If parent doesn't exist, create parent with ID and children only
+      parent = this._createNode(parentId, { keys: [] }, '' /* parentId */, [] /* childrenIds */, true /*hasChildren */);
+      this.nodeMap[parentId] = parent;
+    }
+    return parent;
+  }
+
+  private _createNode(
+    id: string,
+    sequence: IKeySequence,
+    parentId: string,
+    children: string[],
+    hasChildrenNodes?: boolean,
+    onExecute?: (el: HTMLElement) => void,
+    onReturn?: (el: HTMLElement) => void,
+    disabled?: boolean): IKeytipTreeNode {
+    return {
+      id,
+      keytipSequence: sequence,
+      parent: parentId,
+      children,
+      onExecute,
+      onReturn,
+      hasChildrenNodes,
+      disabled
+    };
+  }
+
+  /**
+   * Gets all nodes from their IDs
+   *
+   * @param ids List of keytip IDs
+   * @returns {IKeytipTreeNode[]} Array of nodes that match the given IDs
+   */
+  private _getNodes(ids: string[]): IKeytipTreeNode[] {
+    return ids.map((id: string): IKeytipTreeNode => {
+      return this.nodeMap[id];
+    });
+  }
+
+  /**
+   * Retrieves or creates an overflow node
+   *
+   * @param overflowSequence - Single key sequence for the overflow item
+   * @param parentId - ID of the parent keytip
+   * @param parentSequence - Full IKeySequence[] of the parent
+   * @returns {IKeytipTreeNode} - Node for this overflow item
+   */
+  private _getOrCreateOverflowNode(overflowSequence: IKeySequence, parentId: string, parentSequence: IKeySequence[]): IKeytipTreeNode {
+    let fullOverflowSequence = [...parentSequence, ...[overflowSequence]];
+    let overflowNodeId = convertSequencesToKeytipID(fullOverflowSequence);
+
+    let node = this.nodeMap[overflowNodeId];
+
+    // if overflow node has not been added, we create it
+    if (!node) {
+      node = this._createNode(overflowNodeId, overflowSequence, parentId, [], true);
+      this.nodeMap[overflowNodeId] = node;
+      let parent = this._getOrCreateParentNode(parentId);
+      parent.children.push(overflowNodeId);
+    }
+
+    return node;
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/utilities/keytip/KeytipUtils.ts b/packages/experiments/src/utilities/keytip/KeytipUtils.ts
new file mode 100644
index 0000000000000..141746cf7c62e
--- /dev/null
+++ b/packages/experiments/src/utilities/keytip/KeytipUtils.ts
@@ -0,0 +1,60 @@
+import { IKeySequence, convertSequencesToKeytipID } from '../keysequence/IKeySequence';
+import { IKeytipProps } from '../../Keytip';
+import { KeytipManager } from './KeytipManager';
+
+// Constants
+export const ktpPrefix = 'ktp';
+export const ktpSeparator = '-';
+export const ktpFullPrefix = ktpPrefix + ktpSeparator;
+export const dataKtpId = 'data-ktp-id';
+
+/**
+ * Adds an IKeySequence to a list of sequences
+ * Returns a new array of IKeySequence
+ *
+ * @param sequences - Array of sequences to append to
+ * @param seq1 - IKeySequence to append
+ */
+export function addKeytipSequence(sequences: IKeySequence[], seq1: IKeySequence): IKeySequence[] {
+  return [...sequences, { keys: [...seq1.keys] }];
+}
+
+/**
+ * Utility funciton to register a keytip in the KeytipManager
+ *
+ * @param keytipProps - Keytip to register
+ * @returns - any {} containing the aria-describedby and data-ktp-id to add to the relevant element
+ */
+// tslint:disable-next-line:no-any
+export function registerKeytip(keytipProps: IKeytipProps): any {
+  let ktpMgr = KeytipManager.getInstance();
+  return ktpMgr.registerKeytip(keytipProps);
+}
+
+/**
+ * Utility funciton to unregister a keytip in the KeytipManager
+ *
+ * @param keytipProps - Keytip to unregister
+ */
+export function unregisterKeytip(keytipProps: IKeytipProps): void {
+  let ktpMgr = KeytipManager.getInstance();
+  ktpMgr.unregisterKeytip(keytipProps);
+}
+
+/**
+ * Constructs the data-ktp-id attribute selector from a full key sequence
+ *
+ * @param keySequences - Full IKeySequence for a Keytip
+ */
+export function constructKeytipTargetFromSequences(keySequences: IKeySequence[]): string {
+  return '[' + dataKtpId + '="' + convertSequencesToKeytipID(keySequences) + '"]';
+}
+
+/**
+ * Constructs the data-ktp-id attribute selector from a keytip ID
+ *
+ * @param keytipId - ID of the Keytip
+ */
+export function constructKeytipTargetFromId(keytipId: string): string {
+  return '[' + dataKtpId + '="' + keytipId + '"]';
+}
\ No newline at end of file
diff --git a/packages/utilities/src/KeyCodes.ts b/packages/utilities/src/KeyCodes.ts
index 1c84163588a27..08cbbd19d3297 100644
--- a/packages/utilities/src/KeyCodes.ts
+++ b/packages/utilities/src/KeyCodes.ts
@@ -4,22 +4,103 @@
  * @public
  */
 export const enum KeyCodes {
-  a = 65,
-  c = 67,
   backspace = 8,
-  comma = 188,
-  del = 46,
-  down = 40,
-  end = 35,
+  tab = 9,
   enter = 13,
+  shift = 16,
+  ctrl = 17,
+  alt = 18,
+  pauseBreak = 19,
+  capslock = 20,
   escape = 27,
+  space = 32,
+  pageUp = 33,
+  pageDown = 34,
+  end = 35,
   home = 36,
   left = 37,
-  pageDown = 34,
-  pageUp = 33,
+  up = 38,
   right = 39,
+  down = 40,
+  insert = 45,
+  del = 46,
+  zero = 48,
+  one = 49,
+  two = 50,
+  three = 51,
+  four = 52,
+  five = 53,
+  six = 54,
+  seven = 55,
+  eight = 56,
+  nine = 57,
+  a = 65,
+  b = 66,
+  c = 67,
+  d = 68,
+  e = 69,
+  f = 70,
+  g = 71,
+  h = 72,
+  i = 73,
+  j = 74,
+  k = 75,
+  l = 76,
+  m = 77,
+  n = 78,
+  o = 79,
+  p = 80,
+  q = 81,
+  r = 82,
+  s = 83,
+  t = 84,
+  u = 85,
+  v = 86,
+  w = 87,
+  x = 88,
+  y = 89,
+  z = 90,
+  leftWindow = 91,
+  rightWindow = 92,
+  select = 93,
+  zero_numpad = 96,
+  one_numpad = 97,
+  two_numpad = 98,
+  three_numpad = 99,
+  four_numpad = 100,
+  five_numpad = 101,
+  six_numpad = 102,
+  seven_numpad = 103,
+  eight_numpad = 104,
+  nine_numpad = 105,
+  multiply = 106,
+  add = 107,
+  subtract = 109,
+  decimalPoint = 110,
+  divide = 111,
+  f1 = 112,
+  f2 = 113,
+  f3 = 114,
+  f4 = 115,
+  f5 = 116,
+  f6 = 117,
+  f7 = 118,
+  f8 = 119,
+  f9 = 120,
+  f10 = 121,
+  f11 = 122,
+  f12 = 123,
+  numlock = 144,
+  scrollLock = 145,
   semicolon = 186,
-  space = 32,
-  tab = 9,
-  up = 38
+  equalSign = 187,
+  comma = 188,
+  dash = 189,
+  period = 190,
+  forwardSlash = 191,
+  graveAccent = 192,
+  openBracket = 219,
+  backSlash = 220,
+  closeBracket = 221,
+  singleQuote = 222
 }
\ No newline at end of file
diff --git a/scripts/tasks/jest-mock.js b/scripts/tasks/jest-mock.js
index dce535c5c08d4..2c5ba89b2d1a6 100644
--- a/scripts/tasks/jest-mock.js
+++ b/scripts/tasks/jest-mock.js
@@ -1,23 +1,105 @@
 const KeyCodes = {
-  a: 65,
   backspace: 8,
-  comma: 188,
-  del: 46,
-  down: 40,
-  end: 35,
+  tab: 9,
   enter: 13,
+  shift: 16,
+  ctrl: 17,
+  alt: 18,
+  pauseBreak: 19,
+  capslock: 20,
   escape: 27,
+  space: 32,
+  pageUp: 33,
+  pageDown: 34,
+  end: 35,
   home: 36,
   left: 37,
-  pageDown: 34,
-  pageUp: 33,
+  up: 38,
   right: 39,
+  down: 40,
+  insert: 45,
+  del: 46,
+  zero: 48,
+  one: 49,
+  two: 50,
+  three: 51,
+  four: 52,
+  five: 53,
+  six: 54,
+  seven: 55,
+  eight: 56,
+  nine: 57,
+  a: 65,
+  b: 66,
+  c: 67,
+  d: 68,
+  e: 69,
+  f: 70,
+  g: 71,
+  h: 72,
+  i: 73,
+  j: 74,
+  k: 75,
+  l: 76,
+  m: 77,
+  n: 78,
+  o: 79,
+  p: 80,
+  q: 81,
+  r: 82,
+  s: 83,
+  t: 84,
+  u: 85,
+  v: 86,
+  w: 87,
+  x: 88,
+  y: 89,
+  z: 90,
+  leftWindow: 91,
+  rightWindow: 92,
+  select: 93,
+  zero_numpad: 96,
+  one_numpad: 97,
+  two_numpad: 98,
+  three_numpad: 99,
+  four_numpad: 100,
+  five_numpad: 101,
+  six_numpad: 102,
+  seven_numpad: 103,
+  eight_numpad: 104,
+  nine_numpad: 105,
+  multiply: 106,
+  add: 107,
+  subtract: 109,
+  decimalPoint: 110,
+  divide: 111,
+  f1: 112,
+  f2: 113,
+  f3: 114,
+  f4: 115,
+  f5: 116,
+  f6: 117,
+  f7: 118,
+  f8: 119,
+  f9: 120,
+  f10: 121,
+  f11: 122,
+  f12: 123,
+  numlock: 144,
+  scrollLock: 145,
   semicolon: 186,
-  space: 32,
-  tab: 9,
-  up: 38,
+  equalSign: 187,
+  comma: 188,
+  dash: 189,
+  period: 190,
+  forwardSlash: 191,
+  graveAccent: 192,
+  openBracket: 219,
+  backSlash: 220,
+  closeBracket: 221,
+  singleQuote: 222
 };
 
 module.exports = {
   KeyCodes
-};
+};
\ No newline at end of file
diff --git a/scripts/tasks/jest-resources.js b/scripts/tasks/jest-resources.js
index bd08e5432b443..6dbee44865c50 100644
--- a/scripts/tasks/jest-resources.js
+++ b/scripts/tasks/jest-resources.js
@@ -51,4 +51,4 @@ const styleMockPath =
         }
 
       }, customConfig)
-  };
+  };
\ No newline at end of file

From 41e80543717c00b1f5ed95b289e4185ee0469c04 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Thu, 1 Mar 2018 23:55:13 -0800
Subject: [PATCH 1497/1641] ChoiceGroup: Flex layout for image and icon options
 (#4137)

* Flex container for options with images or icons

* Edge case layout bugs

* Added change file

* Updated snapshot

* Attempt to fix diff

* Attempt to fix diff 2

* Reverted tsx changes for flex to improve diff

* Committing wrapper without indentation
---
 .../choicegroup-flex_2018-02-28-22-03.json    |  11 ++
 .../components/ChoiceGroup/ChoiceGroup.scss   |   9 +-
 .../components/ChoiceGroup/ChoiceGroup.tsx    |   6 +
 .../__snapshots__/ChoiceGroup.test.tsx.snap   | 162 +++++++++---------
 4 files changed, 108 insertions(+), 80 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/choicegroup-flex_2018-02-28-22-03.json

diff --git a/common/changes/office-ui-fabric-react/choicegroup-flex_2018-02-28-22-03.json b/common/changes/office-ui-fabric-react/choicegroup-flex_2018-02-28-22-03.json
new file mode 100644
index 0000000000000..11f0756578b6d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/choicegroup-flex_2018-02-28-22-03.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ChoiceGroup: Flex layout for icon and image fields.  Fixed some image field bugs.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
index 30e4ed7aa50b5..62bc6086d1d6e 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.scss
@@ -42,6 +42,12 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
   display: block;
 }
 
+.optionsContainIconOrImage {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+}
+
 .choiceField {
   display: flex;
   align-items: center;
@@ -194,6 +200,7 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
   @include ms-margin(0, 4px, 4px, 0);
   @include ms-padding-left(0px);
   @include ms-bgColor-neutralLighter;
+  height: 100%;
 
   $radioButtonSpacing: 3px;
   $radioButtonInnerSize: 5px;
@@ -201,7 +208,7 @@ $ms-choiceField-transition-timing: cubic-bezier(.4, 0, .23, 1);
   .fieldIsImage, .fieldIsIcon {
 
     display: inline-block;
-    box-sizing: border-box;
+    box-sizing: content-box;
     cursor: pointer;
     padding-top: 22px;
     margin: 0;
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
index 1d1094e1e1b2a..bef72017ca34c 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
@@ -75,6 +75,11 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
           { this.props.label && (
             <Label className={ className } required={ required } id={ this._id + '-label' }>{ label }</Label>
           ) }
+          <div
+            className={ css('ms-ChoiceFieldGroup-flexContainer', options!.some(
+              option => Boolean(option.iconProps || option.imageSrc)
+            ) && styles.optionsContainIconOrImage) }
+          >
 
           { options!.map((option: IChoiceGroupOption) => {
             const {
@@ -125,6 +130,7 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
               </div>
             );
           }) }
+          </div>
         </div>
       </div>
     );
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/__snapshots__/ChoiceGroup.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ChoiceGroup/__snapshots__/ChoiceGroup.test.tsx.snap
index b972e02a5a0de..63255faa94ada 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/__snapshots__/ChoiceGroup.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/__snapshots__/ChoiceGroup.test.tsx.snap
@@ -11,100 +11,104 @@ exports[`ChoiceGroup renders ChoiceGroup correctly 1`] = `
     role="radiogroup"
   >
     <div
-      className="ms-ChoiceField"
+      className="ms-ChoiceFieldGroup-flexContainer"
     >
       <div
-        className="ms-ChoiceField-wrapper"
+        className="ms-ChoiceField"
       >
-        <input
-          aria-labelledby="ChoiceGroup0-1"
-          checked={false}
-          className="ms-ChoiceField-input"
-          data-automation-id="auto1"
-          disabled={undefined}
-          id="ChoiceGroup0-1"
-          name="ChoiceGroup0"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          required={true}
-          type="radio"
-        />
-        <label
-          className="ms-ChoiceField-field"
-          htmlFor="ChoiceGroup0-1"
+        <div
+          className="ms-ChoiceField-wrapper"
         >
-          <span
-            className="ms-Label"
-            id="ChoiceGroupLabel1-1"
+          <input
+            aria-labelledby="ChoiceGroup0-1"
+            checked={false}
+            className="ms-ChoiceField-input"
+            data-automation-id="auto1"
+            disabled={undefined}
+            id="ChoiceGroup0-1"
+            name="ChoiceGroup0"
+            onBlur={[Function]}
+            onChange={[Function]}
+            onFocus={[Function]}
+            required={true}
+            type="radio"
+          />
+          <label
+            className="ms-ChoiceField-field"
+            htmlFor="ChoiceGroup0-1"
           >
-            1
-          </span>
-        </label>
+            <span
+              className="ms-Label"
+              id="ChoiceGroupLabel1-1"
+            >
+              1
+            </span>
+          </label>
+        </div>
       </div>
-    </div>
-    <div
-      className="ms-ChoiceField"
-    >
       <div
-        className="ms-ChoiceField-wrapper"
+        className="ms-ChoiceField"
       >
-        <input
-          aria-labelledby="ChoiceGroup0-2"
-          checked={false}
-          className="ms-ChoiceField-input"
-          disabled={undefined}
-          id="ChoiceGroup0-2"
-          name="ChoiceGroup0"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          required={true}
-          type="radio"
-        />
-        <label
-          className="ms-ChoiceField-field"
-          htmlFor="ChoiceGroup0-2"
+        <div
+          className="ms-ChoiceField-wrapper"
         >
-          <span
-            className="ms-Label"
-            id="ChoiceGroupLabel1-2"
+          <input
+            aria-labelledby="ChoiceGroup0-2"
+            checked={false}
+            className="ms-ChoiceField-input"
+            disabled={undefined}
+            id="ChoiceGroup0-2"
+            name="ChoiceGroup0"
+            onBlur={[Function]}
+            onChange={[Function]}
+            onFocus={[Function]}
+            required={true}
+            type="radio"
+          />
+          <label
+            className="ms-ChoiceField-field"
+            htmlFor="ChoiceGroup0-2"
           >
-            2
-          </span>
-        </label>
+            <span
+              className="ms-Label"
+              id="ChoiceGroupLabel1-2"
+            >
+              2
+            </span>
+          </label>
+        </div>
       </div>
-    </div>
-    <div
-      className="ms-ChoiceField"
-    >
       <div
-        className="ms-ChoiceField-wrapper"
+        className="ms-ChoiceField"
       >
-        <input
-          aria-labelledby="ChoiceGroup0-3"
-          checked={false}
-          className="ms-ChoiceField-input"
-          disabled={undefined}
-          id="ChoiceGroup0-3"
-          name="ChoiceGroup0"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          required={true}
-          type="radio"
-        />
-        <label
-          className="ms-ChoiceField-field"
-          htmlFor="ChoiceGroup0-3"
+        <div
+          className="ms-ChoiceField-wrapper"
         >
-          <span
-            className="ms-Label"
-            id="ChoiceGroupLabel1-3"
+          <input
+            aria-labelledby="ChoiceGroup0-3"
+            checked={false}
+            className="ms-ChoiceField-input"
+            disabled={undefined}
+            id="ChoiceGroup0-3"
+            name="ChoiceGroup0"
+            onBlur={[Function]}
+            onChange={[Function]}
+            onFocus={[Function]}
+            required={true}
+            type="radio"
+          />
+          <label
+            className="ms-ChoiceField-field"
+            htmlFor="ChoiceGroup0-3"
           >
-            3
-          </span>
-        </label>
+            <span
+              className="ms-Label"
+              id="ChoiceGroupLabel1-3"
+            >
+              3
+            </span>
+          </label>
+        </div>
       </div>
     </div>
   </div>

From 897b00027fadae6dcceb3ecb1b324e70cb1202f6 Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Thu, 1 Mar 2018 23:56:55 -0800
Subject: [PATCH 1498/1641] [SpinButton] Consistent styles to Button and
 TextField (#4098)

* [SpinButton] Consistent styles to Button and TextField

* Collapsed padding properties

* Update snapshot

* Change file
---
 ...ttonConsistentStyles_2018-02-27-22-22.json | 11 ++++
 .../SpinButton/SpinButton.styles.ts           | 61 ++++++++-----------
 .../__snapshots__/SpinButton.test.tsx.snap    | 27 ++++----
 3 files changed, 49 insertions(+), 50 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/magellan-spinButtonConsistentStyles_2018-02-27-22-22.json

diff --git a/common/changes/office-ui-fabric-react/magellan-spinButtonConsistentStyles_2018-02-27-22-22.json b/common/changes/office-ui-fabric-react/magellan-spinButtonConsistentStyles_2018-02-27-22-22.json
new file mode 100644
index 0000000000000..fe54983db3851
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/magellan-spinButtonConsistentStyles_2018-02-27-22-22.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "SpinButton: Updated styling to be consistent with Button and TextField",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
index 3bcf63e9f2a39..cca82ee58e199 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
@@ -36,12 +36,16 @@ export const getArrowButtonStyles = memoizeFunction((
   customSpecificArrowStyles?: Partial<IButtonStyles>,
 ): IButtonStyles => {
 
-  const { palette } = theme;
+  const {
+    semanticColors
+  } = theme;
 
-  const ArrowButtonTextColor = palette.neutralPrimary;
-  const ArrowButtonTextColorPressed = palette.white;
-  const ArrowButtonBackgroundHovered = palette.neutralLight;
-  const ArrowButtonBackgroundPressed = palette.themePrimary;
+  const ArrowButtonTextColor = semanticColors.buttonText;
+  const ArrowButtonTextColorHovered = semanticColors.buttonTextHovered;
+  const ArrowButtonTextColorPressed = semanticColors.buttonTextChecked;
+
+  const ArrowButtonBackgroundHovered = semanticColors.buttonBackgroundHovered;
+  const ArrowButtonBackgroundPressed = semanticColors.buttonBackgroundChecked;
 
   const defaultArrowButtonStyles: IButtonStyles = {
     root: {
@@ -49,17 +53,15 @@ export const getArrowButtonStyles = memoizeFunction((
       display: 'block',
       height: '50%',
       width: '14px',
-      paddingTop: '0',
-      paddingRight: '0',
-      paddingBottom: '0',
-      paddingLeft: '0',
+      padding: '0',
       backgroundColor: 'transparent',
       textAlign: 'center',
       cursor: 'default',
       color: ArrowButtonTextColor
     },
     rootHovered: {
-      backgroundColor: ArrowButtonBackgroundHovered
+      backgroundColor: ArrowButtonBackgroundHovered,
+      color: ArrowButtonTextColorHovered
     },
     rootChecked: {
       backgroundColor: ArrowButtonBackgroundPressed,
@@ -121,12 +123,12 @@ export const getStyles = memoizeFunction((
 ): ISpinButtonStyles => {
   const { fonts, palette, semanticColors } = theme;
 
-  const SpinButtonRootBorderColor = palette.neutralTertiaryAlt;
-  const SpinButtonRootBorderColorHovered = palette.neutralSecondary;
-  const SpinButtonRootBorderColorFocused = palette.themePrimary;
+  const SpinButtonRootBorderColor = semanticColors.inputBorder;
+  const SpinButtonRootBorderColorHovered = semanticColors.inputBorderHovered;
+  const SpinButtonRootBorderColorFocused = semanticColors.inputFocusBorderAlt;
 
-  const SpinButtonTextColorDisabled = palette.neutralTertiaryAlt;
-  const SpinButtonInputTextColor = palette.neutralPrimary;
+  const SpinButtonTextColorDisabled = semanticColors.disabledText;
+  const SpinButtonInputTextColor = semanticColors.bodyText;
   const SpinButtonInputTextColorSelected = palette.white;
   const SpinButtonInputBackgroundColorSelected = palette.themePrimary;
 
@@ -138,10 +140,7 @@ export const getStyles = memoizeFunction((
       fontSize: FontSizes.medium,
       width: '100%',
       minWidth: '86px',
-      paddingTop: '2px',
-      paddingRight: '2px',
-      paddingBottom: '2px',
-      paddingLeft: '2px',
+      padding: '2px',
     },
     labelWrapper: {
       display: 'inline-flex'
@@ -161,11 +160,7 @@ export const getStyles = memoizeFunction((
       marginTop: '10px'
     },
     icon: {
-      paddingTop: '2px',
-      paddingRight: '5px',
-      paddingBottom: '2px',
-      paddingLeft: '5px',
-
+      padding: '2px 5px',
       fontSize: '20px'
     },
     iconDisabled: {
@@ -173,10 +168,7 @@ export const getStyles = memoizeFunction((
     },
     label: {
       pointerEvents: 'none',
-      paddingTop: '2px',
-      paddingRight: '0',
-      paddingBottom: '2px',
-      paddingLeft: '0',
+      padding: '2px 0',
     },
     labelDisabled: {
       cursor: 'default',
@@ -189,7 +181,8 @@ export const getStyles = memoizeFunction((
     },
     spinButtonWrapper: {
       display: 'flex',
-      height: '26px',
+      boxSizing: 'border-box',
+      height: '32px',
       minWidth: '86px',
       borderWidth: '1px',
       borderStyle: 'solid',
@@ -228,10 +221,7 @@ export const getStyles = memoizeFunction((
       fontSize: FontSizes.medium,
       color: SpinButtonInputTextColor,
       height: '100%',
-      paddingTop: '3px',
-      paddingRight: '3px',
-      paddingBottom: '4px',
-      paddingLeft: '4px',
+      padding: '0 12px',
       outline: '0',
       textOverflow: 'ellipsis',
       display: 'block',
@@ -261,10 +251,7 @@ export const getStyles = memoizeFunction((
       float: 'left',
       height: '100%',
       cursor: 'default',
-      paddingTop: '0',
-      paddingRight: '0',
-      paddingBottom: '0',
-      paddingLeft: '0',
+      padding: '0',
       boxSizing: 'border-box'
     },
     arrowButtonsContainerDisabled: _getDisabledStyles(theme),
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
index a0050221b1b21..00e7e210848b5 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
@@ -57,15 +57,16 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
     className=
 
         {
-          border-color: #c8c8c8;
+          border-color: #a6a6a6;
           border-style: solid;
           border-width: 1px;
+          box-sizing: border-box;
           display: flex;
-          height: 26px;
+          height: 32px;
           min-width: 86px;
         }
         &:hover {
-          border-color: #666666;
+          border-color: #212121;
           outline: 2px dashed transparent;
         }
         @media screen and (-ms-high-contrast: active){&:hover {
@@ -98,10 +99,10 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
             min-width: 72px;
             outline: 0;
             overflow: hidden;
-            padding-bottom: 4px;
-            padding-left: 4px;
-            padding-right: 3px;
-            padding-top: 3px;
+            padding-bottom: 0;
+            padding-left: 12px;
+            padding-right: 12px;
+            padding-top: 0;
             text-overflow: ellipsis;
             user-select: text;
             width: calc(100% - 14px);
@@ -198,11 +199,11 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
             }
             &:hover {
               background-color: #eaeaea;
-              color: #004578;
+              color: #000000;
             }
             &:active {
-              background-color: #0078d7;
-              color: #ffffff;
+              background-color: #c8c8c8;
+              color: #212121;
             }
             @media screen and (-ms-high-contrast: active){&:active {
               background-color: Highlight;
@@ -303,11 +304,11 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
             }
             &:hover {
               background-color: #eaeaea;
-              color: #004578;
+              color: #000000;
             }
             &:active {
-              background-color: #0078d7;
-              color: #ffffff;
+              background-color: #c8c8c8;
+              color: #212121;
             }
             @media screen and (-ms-high-contrast: active){&:active {
               background-color: Highlight;

From b9db9ec2d60e5409aff459010a79052ac8202c66 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 2 Mar 2018 03:25:35 -0800
Subject: [PATCH 1499/1641] Applying package updates.

---
 ...chrisgo-ts-2-7-final_2018-03-01-21-36.json |  11 --
 ...DetailsListFocusTest_2018-02-24-00-36.json |  11 --
 ...-extendedPickerFixes_2018-02-12-22-44.json |  11 --
 .../features-keytips2_2018-02-21-21-49.json   |  11 --
 ...DetailsListFocusTest_2018-02-24-00-36.json |  11 --
 ...DetailsListFocusTest_2018-02-24-00-36.json |  11 --
 ...update-icons-package_2018-02-23-23-38.json |  11 --
 ...chrisgo-ts-2-7-final_2018-03-01-21-36.json |  11 --
 ...chrisgo-ts-2-7-final_2018-03-01-21-36.json |  11 --
 .../features-keytips2_2018-02-21-21-49.json   |  11 --
 .../aria-selected_2018-03-02-01-49.json       |  11 --
 .../bugFix3571_2018-02-21-04-00.json          |  11 --
 .../callout-improveperf_2018-02-28-23-05.json |  11 --
 .../choicegroup-flex_2018-02-28-22-03.json    |  11 --
 ...chrisgo-ts-2-7-final_2018-03-01-21-36.json |  11 --
 .../disabledLink_2018-02-28-23-53.json        |  11 --
 ...documentcard-theming_2018-03-01-22-47.json |  11 --
 ...s-indicator-overflow_2018-03-01-17-51.json |  11 --
 ...on-Props-In-Nav-Link_2018-02-27-22-44.json |  11 --
 ...s-As-Callout-Targets_2018-02-28-19-13.json |  11 --
 ...label-for-breadcrumb_2018-02-23-00-57.json |  11 --
 ...commandItemWidthNull_2018-02-28-21-58.json |  11 --
 ...ttonConsistentStyles_2018-02-27-22-22.json |  11 --
 .../master_2018-02-16-04-00.json              |  11 --
 ...xlus-stickyContainer_2018-02-21-19-45.json |  11 --
 .../nav-isselected-4143_2018-03-01-23-30.json |  11 --
 .../runchange_2018-02-21-18-04.json           |  11 --
 .../suggestionElement_2018-03-02-01-56.json   |  11 --
 .../zhiliu-fixSpinner_2018-02-28-22-55.json   |  11 --
 packages/example-app-base/CHANGELOG.json      |  19 +++
 packages/example-app-base/CHANGELOG.md        |   9 +-
 packages/example-app-base/package.json        |   4 +-
 packages/experiments/CHANGELOG.json           |  32 +++++
 packages/experiments/CHANGELOG.md             |  13 +-
 packages/experiments/package.json             |   8 +-
 packages/icons/CHANGELOG.json                 |  14 ++
 packages/icons/CHANGELOG.md                   |   9 +-
 packages/icons/package.json                   |   2 +-
 .../jest-serializer-merge-styles/package.json |   2 +-
 packages/merge-styles/CHANGELOG.json          |  14 ++
 packages/merge-styles/CHANGELOG.md            |   9 +-
 packages/merge-styles/package.json            |   2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 120 ++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  30 ++++-
 packages/office-ui-fabric-react/package.json  |  10 +-
 packages/styling/package.json                 |   4 +-
 packages/utilities/CHANGELOG.json             |  24 ++++
 packages/utilities/CHANGELOG.md               |  10 +-
 packages/utilities/package.json               |   4 +-
 scripts/package.json                          |   2 +-
 50 files changed, 316 insertions(+), 344 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/chrisgo-ts-2-7-final_2018-03-01-21-36.json
 delete mode 100644 common/changes/@uifabric/example-app-base/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
 delete mode 100644 common/changes/@uifabric/experiments/amyngu-extendedPickerFixes_2018-02-12-22-44.json
 delete mode 100644 common/changes/@uifabric/experiments/features-keytips2_2018-02-21-21-49.json
 delete mode 100644 common/changes/@uifabric/experiments/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
 delete mode 100644 common/changes/@uifabric/icons/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
 delete mode 100644 common/changes/@uifabric/icons/update-icons-package_2018-02-23-23-38.json
 delete mode 100644 common/changes/@uifabric/merge-styles/chrisgo-ts-2-7-final_2018-03-01-21-36.json
 delete mode 100644 common/changes/@uifabric/utilities/chrisgo-ts-2-7-final_2018-03-01-21-36.json
 delete mode 100644 common/changes/@uifabric/utilities/features-keytips2_2018-02-21-21-49.json
 delete mode 100644 common/changes/office-ui-fabric-react/aria-selected_2018-03-02-01-49.json
 delete mode 100644 common/changes/office-ui-fabric-react/bugFix3571_2018-02-21-04-00.json
 delete mode 100644 common/changes/office-ui-fabric-react/callout-improveperf_2018-02-28-23-05.json
 delete mode 100644 common/changes/office-ui-fabric-react/choicegroup-flex_2018-02-28-22-03.json
 delete mode 100644 common/changes/office-ui-fabric-react/chrisgo-ts-2-7-final_2018-03-01-21-36.json
 delete mode 100644 common/changes/office-ui-fabric-react/disabledLink_2018-02-28-23-53.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-documentcard-theming_2018-03-01-22-47.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-indeterminate-progress-indicator-overflow_2018-03-01-17-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/jdrush89-Allow-Icon-Props-In-Nav-Link_2018-02-27-22-44.json
 delete mode 100644 common/changes/office-ui-fabric-react/jdrush89-Allow-The-Use-Of-Elements-As-Callout-Targets_2018-02-28-19-13.json
 delete mode 100644 common/changes/office-ui-fabric-react/label-for-breadcrumb_2018-02-23-00-57.json
 delete mode 100644 common/changes/office-ui-fabric-react/magellan-commandItemWidthNull_2018-02-28-21-58.json
 delete mode 100644 common/changes/office-ui-fabric-react/magellan-spinButtonConsistentStyles_2018-02-27-22-22.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2018-02-16-04-00.json
 delete mode 100644 common/changes/office-ui-fabric-react/maxlus-stickyContainer_2018-02-21-19-45.json
 delete mode 100644 common/changes/office-ui-fabric-react/nav-isselected-4143_2018-03-01-23-30.json
 delete mode 100644 common/changes/office-ui-fabric-react/runchange_2018-02-21-18-04.json
 delete mode 100644 common/changes/office-ui-fabric-react/suggestionElement_2018-03-02-01-56.json
 delete mode 100644 common/changes/office-ui-fabric-react/zhiliu-fixSpinner_2018-02-28-22-55.json

diff --git a/common/changes/@uifabric/example-app-base/chrisgo-ts-2-7-final_2018-03-01-21-36.json b/common/changes/@uifabric/example-app-base/chrisgo-ts-2-7-final_2018-03-01-21-36.json
deleted file mode 100644
index dd03370d02f75..0000000000000
--- a/common/changes/@uifabric/example-app-base/chrisgo-ts-2-7-final_2018-03-01-21-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Upgrade to TypeScript 2.7.2",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json b/common/changes/@uifabric/example-app-base/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
deleted file mode 100644
index 7ef56cf8e12fd..0000000000000
--- a/common/changes/@uifabric/example-app-base/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/amyngu-extendedPickerFixes_2018-02-12-22-44.json b/common/changes/@uifabric/experiments/amyngu-extendedPickerFixes_2018-02-12-22-44.json
deleted file mode 100644
index 5e73f2205e2cf..0000000000000
--- a/common/changes/@uifabric/experiments/amyngu-extendedPickerFixes_2018-02-12-22-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "BaseExtendedPicker: Create component to wrap the rendered item, so users get contextual menu if certain props are present, get rid of loading state, fix autofocus on input after suggestion selection",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "amyngu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/features-keytips2_2018-02-21-21-49.json b/common/changes/@uifabric/experiments/features-keytips2_2018-02-21-21-49.json
deleted file mode 100644
index b923866b6efd0..0000000000000
--- a/common/changes/@uifabric/experiments/features-keytips2_2018-02-21-21-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Add initial set of Keytip work",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "keyou@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json b/common/changes/@uifabric/experiments/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
deleted file mode 100644
index 5260536241508..0000000000000
--- a/common/changes/@uifabric/experiments/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/experiments",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json b/common/changes/@uifabric/icons/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
deleted file mode 100644
index ee773e312980a..0000000000000
--- a/common/changes/@uifabric/icons/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/icons",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/icons",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/update-icons-package_2018-02-23-23-38.json b/common/changes/@uifabric/icons/update-icons-package_2018-02-23-23-38.json
deleted file mode 100644
index 5dfbd59f949ca..0000000000000
--- a/common/changes/@uifabric/icons/update-icons-package_2018-02-23-23-38.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/icons",
-      "comment": "Updating icons to FabMDL2v2.68 and adding 2 icons to the main partition.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/icons",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/chrisgo-ts-2-7-final_2018-03-01-21-36.json b/common/changes/@uifabric/merge-styles/chrisgo-ts-2-7-final_2018-03-01-21-36.json
deleted file mode 100644
index a9a5759c862ea..0000000000000
--- a/common/changes/@uifabric/merge-styles/chrisgo-ts-2-7-final_2018-03-01-21-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "Upgrade to TypeScript 2.7.2",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/chrisgo-ts-2-7-final_2018-03-01-21-36.json b/common/changes/@uifabric/utilities/chrisgo-ts-2-7-final_2018-03-01-21-36.json
deleted file mode 100644
index d91ff7f2c881a..0000000000000
--- a/common/changes/@uifabric/utilities/chrisgo-ts-2-7-final_2018-03-01-21-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Upgrade to TypeScript 2.7.2",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/features-keytips2_2018-02-21-21-49.json b/common/changes/@uifabric/utilities/features-keytips2_2018-02-21-21-49.json
deleted file mode 100644
index 2dbeac11bd2a3..0000000000000
--- a/common/changes/@uifabric/utilities/features-keytips2_2018-02-21-21-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Update KeyCodes enum to include all key codes",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "keyou@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/aria-selected_2018-03-02-01-49.json b/common/changes/office-ui-fabric-react/aria-selected_2018-03-02-01-49.json
deleted file mode 100644
index a2574c21d8025..0000000000000
--- a/common/changes/office-ui-fabric-react/aria-selected_2018-03-02-01-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: only adding `aria-selected` when `selectionMode` is set to `none`.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "naethell@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/bugFix3571_2018-02-21-04-00.json b/common/changes/office-ui-fabric-react/bugFix3571_2018-02-21-04-00.json
deleted file mode 100644
index 0a90657821fdc..0000000000000
--- a/common/changes/office-ui-fabric-react/bugFix3571_2018-02-21-04-00.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: Fixed custom render option in multi select.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jindal.rohit018@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/callout-improveperf_2018-02-28-23-05.json b/common/changes/office-ui-fabric-react/callout-improveperf_2018-02-28-23-05.json
deleted file mode 100644
index af4a9c72463f9..0000000000000
--- a/common/changes/office-ui-fabric-react/callout-improveperf_2018-02-28-23-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Callout: move animation inline to greatly improve perf",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/choicegroup-flex_2018-02-28-22-03.json b/common/changes/office-ui-fabric-react/choicegroup-flex_2018-02-28-22-03.json
deleted file mode 100644
index 11f0756578b6d..0000000000000
--- a/common/changes/office-ui-fabric-react/choicegroup-flex_2018-02-28-22-03.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ChoiceGroup: Flex layout for icon and image fields.  Fixed some image field bugs.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/chrisgo-ts-2-7-final_2018-03-01-21-36.json b/common/changes/office-ui-fabric-react/chrisgo-ts-2-7-final_2018-03-01-21-36.json
deleted file mode 100644
index d102dbf71c88e..0000000000000
--- a/common/changes/office-ui-fabric-react/chrisgo-ts-2-7-final_2018-03-01-21-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Upgrade to TypeScript 2.7.2",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/disabledLink_2018-02-28-23-53.json b/common/changes/office-ui-fabric-react/disabledLink_2018-02-28-23-53.json
deleted file mode 100644
index 80ad0b48ce486..0000000000000
--- a/common/changes/office-ui-fabric-react/disabledLink_2018-02-28-23-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "make sure disabled links are non-navigable",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "naethell@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-documentcard-theming_2018-03-01-22-47.json b/common/changes/office-ui-fabric-react/fix-documentcard-theming_2018-03-01-22-47.json
deleted file mode 100644
index 674af69334532..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-documentcard-theming_2018-03-01-22-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DocumentCard: Change it to use set theme",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-indeterminate-progress-indicator-overflow_2018-03-01-17-51.json b/common/changes/office-ui-fabric-react/fix-indeterminate-progress-indicator-overflow_2018-03-01-17-51.json
deleted file mode 100644
index e006f6dc01e19..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-indeterminate-progress-indicator-overflow_2018-03-01-17-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ProgressIndicator: adjusting css so that the gleam doesn't go outside the indicator boundary.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "daniel@whitefamily.in"
-}
diff --git a/common/changes/office-ui-fabric-react/jdrush89-Allow-Icon-Props-In-Nav-Link_2018-02-27-22-44.json b/common/changes/office-ui-fabric-react/jdrush89-Allow-Icon-Props-In-Nav-Link_2018-02-27-22-44.json
deleted file mode 100644
index dd1e7862efba0..0000000000000
--- a/common/changes/office-ui-fabric-react/jdrush89-Allow-Icon-Props-In-Nav-Link_2018-02-27-22-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Allowing Nav Links to specify iconProps",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jdrush89@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jdrush89-Allow-The-Use-Of-Elements-As-Callout-Targets_2018-02-28-19-13.json b/common/changes/office-ui-fabric-react/jdrush89-Allow-The-Use-Of-Elements-As-Callout-Targets_2018-02-28-19-13.json
deleted file mode 100644
index 5eb2d3ec1c5ea..0000000000000
--- a/common/changes/office-ui-fabric-react/jdrush89-Allow-The-Use-Of-Elements-As-Callout-Targets_2018-02-28-19-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Allowing use of Elements as target prop for Callouts and ContextualMenus",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jdrush89@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/label-for-breadcrumb_2018-02-23-00-57.json b/common/changes/office-ui-fabric-react/label-for-breadcrumb_2018-02-23-00-57.json
deleted file mode 100644
index ccc0161c03570..0000000000000
--- a/common/changes/office-ui-fabric-react/label-for-breadcrumb_2018-02-23-00-57.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "added More items aria label",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "naethell@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/magellan-commandItemWidthNull_2018-02-28-21-58.json b/common/changes/office-ui-fabric-react/magellan-commandItemWidthNull_2018-02-28-21-58.json
deleted file mode 100644
index f693b6625c9d8..0000000000000
--- a/common/changes/office-ui-fabric-react/magellan-commandItemWidthNull_2018-02-28-21-58.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "CommandBar: Fixed case where commandItemWidths would be null",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/magellan-spinButtonConsistentStyles_2018-02-27-22-22.json b/common/changes/office-ui-fabric-react/magellan-spinButtonConsistentStyles_2018-02-27-22-22.json
deleted file mode 100644
index fe54983db3851..0000000000000
--- a/common/changes/office-ui-fabric-react/magellan-spinButtonConsistentStyles_2018-02-27-22-22.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SpinButton: Updated styling to be consistent with Button and TextField",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2018-02-16-04-00.json b/common/changes/office-ui-fabric-react/master_2018-02-16-04-00.json
deleted file mode 100644
index 43083b213497f..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2018-02-16-04-00.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "SearchBox: Deprecated `labelText` for `placeholder`.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "charles.lecours@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/maxlus-stickyContainer_2018-02-21-19-45.json b/common/changes/office-ui-fabric-react/maxlus-stickyContainer_2018-02-21-19-45.json
deleted file mode 100644
index 4ac10a2b51382..0000000000000
--- a/common/changes/office-ui-fabric-react/maxlus-stickyContainer_2018-02-21-19-45.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix infinite recursion in scrollable pane",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "maxlus@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/nav-isselected-4143_2018-03-01-23-30.json b/common/changes/office-ui-fabric-react/nav-isselected-4143_2018-03-01-23-30.json
deleted file mode 100644
index 4c5e4f1d518ef..0000000000000
--- a/common/changes/office-ui-fabric-react/nav-isselected-4143_2018-03-01-23-30.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added is-selected and is-expanded semantic classes to compositelink style sets",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/runchange_2018-02-21-18-04.json b/common/changes/office-ui-fabric-react/runchange_2018-02-21-18-04.json
deleted file mode 100644
index cb74305b64541..0000000000000
--- a/common/changes/office-ui-fabric-react/runchange_2018-02-21-18-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Searchbox: Removed non-localized default placeholder string.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "charles.lecours@gmail.com"
-}
diff --git a/common/changes/office-ui-fabric-react/suggestionElement_2018-03-02-01-56.json b/common/changes/office-ui-fabric-react/suggestionElement_2018-03-02-01-56.json
deleted file mode 100644
index e20dad7e99ead..0000000000000
--- a/common/changes/office-ui-fabric-react/suggestionElement_2018-03-02-01-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "BasePicker: check for null reference before checking value of `this.suggestionElement`.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "naethell@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/zhiliu-fixSpinner_2018-02-28-22-55.json b/common/changes/office-ui-fabric-react/zhiliu-fixSpinner_2018-02-28-22-55.json
deleted file mode 100644
index 5113a04780d83..0000000000000
--- a/common/changes/office-ui-fabric-react/zhiliu-fixSpinner_2018-02-28-22-55.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "only mount spinner component when necessary",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "zhiliu@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 6f879184f3424..5396b1ccc87c6 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "5.3.0",
+      "tag": "@uifabric/example-app-base_v5.3.0",
+      "date": "Fri, 02 Mar 2018 11:25:35 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "77c1e54e140be51f9c7f252748bb5f868f957919",
+            "comment": "Upgrade to TypeScript 2.7.2"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.13.0 <6.0.0` to `>=5.14.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.2.2",
       "tag": "@uifabric/example-app-base_v5.2.2",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index 2b1fa84e4bf2b..f876906e5f52d 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Wed, 21 Feb 2018 11:12:11 GMT and should not be manually modified.
+This log was last generated on Fri, 02 Mar 2018 11:25:35 GMT and should not be manually modified.
+
+## 5.3.0
+Fri, 02 Mar 2018 11:25:35 GMT
+
+### Minor changes
+
+- Upgrade to TypeScript 2.7.2
 
 ## 5.2.2
 Wed, 21 Feb 2018 11:12:11 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 8dfa2ee5f2d46..a97a175e8cbbb 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "5.2.2",
+  "version": "5.3.0",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.19.0 <6.0.0",
-    "@uifabric/utilities": ">=5.13.0 <6.0.0",
+    "@uifabric/utilities": ">=5.14.0 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index d48808c830e14..6864e96a04e2e 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,38 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.22.0",
+      "tag": "@uifabric/experiments_v5.22.0",
+      "date": "Fri, 02 Mar 2018 11:25:35 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "amyngu <31973030+amyngu@users.noreply.github.com>",
+            "commit": "1340339d7c62eeb1b526f08d9edbd7fe44b398f3",
+            "comment": "BaseExtendedPicker: Create component to wrap the rendered item, so users get contextual menu if certain props are present, get rid of loading state, fix autofocus on input after suggestion selection"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Kelsey Young <kelseyyoung4@gmail.com>",
+            "commit": "44ca7b84a94649581e68a693971891fb1a834720",
+            "comment": "Add initial set of Keytip work"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.57.0 <6.0.0` to `>=5.58.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/icons\" from `>=5.4.2 <6.0.0` to `>=5.5.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=5.2.2 <6.0.0` to `>=5.3.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.21.0",
       "tag": "@uifabric/experiments_v5.21.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index b41f09002fd09..2ea4d1e610514 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Fri, 16 Feb 2018 11:23:29 GMT and should not be manually modified.
+This log was last generated on Fri, 02 Mar 2018 11:25:35 GMT and should not be manually modified.
+
+## 5.22.0
+Fri, 02 Mar 2018 11:25:35 GMT
+
+### Minor changes
+
+- BaseExtendedPicker: Create component to wrap the rendered item, so users get contextual menu if certain props are present, get rid of loading state, fix autofocus on input after suggestion selection
+
+### Patches
+
+- Add initial set of Keytip work
 
 ## 5.21.0
 Fri, 16 Feb 2018 11:23:28 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 18823c4855427..cbcae44e5902a 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.21.0",
+  "version": "5.22.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/enzyme": "3.1.5",
     "@types/enzyme-adapter-react-16": "1.0.1",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=5.2.2 <6.0.0",
+    "@uifabric/example-app-base": ">=5.3.0 <6.0.0",
     "@uifabric/file-type-icons": ">=0.3.0 <1.0.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.1.0 <6.0.0",
     "es6-weak-map": "^2.0.2",
@@ -44,8 +44,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.57.0 <6.0.0",
-    "@uifabric/icons": ">=5.4.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.58.0 <6.0.0",
+    "@uifabric/icons": ">=5.5.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/icons/CHANGELOG.json b/packages/icons/CHANGELOG.json
index 9853429310c50..192377f302b87 100644
--- a/packages/icons/CHANGELOG.json
+++ b/packages/icons/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/icons",
   "entries": [
+    {
+      "version": "5.5.0",
+      "tag": "@uifabric/icons_v5.5.0",
+      "date": "Fri, 02 Mar 2018 11:25:35 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "47663d07d856cf09d880f67b7221eebeda54461e",
+            "comment": "Updating icons to FabMDL2v2.68 and adding 2 icons to the main partition."
+          }
+        ]
+      }
+    },
     {
       "version": "5.4.2",
       "tag": "@uifabric/icons_v5.4.2",
diff --git a/packages/icons/CHANGELOG.md b/packages/icons/CHANGELOG.md
index dd9cdf3e8ef04..a2e2666bca9f1 100644
--- a/packages/icons/CHANGELOG.md
+++ b/packages/icons/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/icons
 
-This log was last generated on Thu, 01 Feb 2018 11:23:17 GMT and should not be manually modified.
+This log was last generated on Fri, 02 Mar 2018 11:25:35 GMT and should not be manually modified.
+
+## 5.5.0
+Fri, 02 Mar 2018 11:25:35 GMT
+
+### Minor changes
+
+- Updating icons to FabMDL2v2.68 and adding 2 icons to the main partition.
 
 ## 5.4.2
 Thu, 01 Feb 2018 11:23:17 GMT
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 77cd25c7bbd45..765b2b3e1e43c 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/icons",
-  "version": "5.4.2",
+  "version": "5.5.0",
   "description": "Office UI Fabric icon set.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/jest-serializer-merge-styles/package.json b/packages/jest-serializer-merge-styles/package.json
index 923a8c0de1160..035167d377f1d 100644
--- a/packages/jest-serializer-merge-styles/package.json
+++ b/packages/jest-serializer-merge-styles/package.json
@@ -24,6 +24,6 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/merge-styles": ">=5.12.2 <6.0.0"
+    "@uifabric/merge-styles": ">=5.13.0 <6.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index 40961ce315edd..cceb41e4a2c84 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.13.0",
+      "tag": "@uifabric/merge-styles_v5.13.0",
+      "date": "Fri, 02 Mar 2018 11:25:35 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "77c1e54e140be51f9c7f252748bb5f868f957919",
+            "comment": "Upgrade to TypeScript 2.7.2"
+          }
+        ]
+      }
+    },
     {
       "version": "5.12.2",
       "tag": "@uifabric/merge-styles_v5.12.2",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index 360e0937b2fff..57e1c2f1a72fc 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Wed, 21 Feb 2018 11:12:11 GMT and should not be manually modified.
+This log was last generated on Fri, 02 Mar 2018 11:25:35 GMT and should not be manually modified.
+
+## 5.13.0
+Fri, 02 Mar 2018 11:25:35 GMT
+
+### Minor changes
+
+- Upgrade to TypeScript 2.7.2
 
 ## 5.12.2
 Wed, 21 Feb 2018 11:12:11 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index e33db84fbf4e5..9f043ff386328 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.12.2",
+  "version": "5.13.0",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index d690a3d66526d..6e0bfbdcb59ef 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,126 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.58.0",
+      "tag": "office-ui-fabric-react_v5.58.0",
+      "date": "Fri, 02 Mar 2018 11:25:35 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "natalieethell <yummyraspberries@gmail.com>",
+            "commit": "73809a7f38db63f24b8c44b7464e4578f1de4004",
+            "comment": "DetailsList: only adding `aria-selected` when `selectionMode` is set to `none`."
+          },
+          {
+            "author": "Rohit Jindal <rohit.jindal@flipkart.com>",
+            "commit": "9459022e4b48041b9e236b5f69a0fdf6f1cee505",
+            "comment": "Dropdown: Fixed custom render option in multi select."
+          },
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "2c32338a744d10802e4384424701a922850b7647",
+            "comment": "Callout: move animation inline to greatly improve perf"
+          },
+          {
+            "author": "natalieethell <yummyraspberries@gmail.com>",
+            "commit": "18ca9bf274d7985b27197c0ea64fb695615f6d98",
+            "comment": "make sure disabled links are non-navigable"
+          },
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "76e5ccc8a699c7bcf632a3dc9516621f42c9e157",
+            "comment": "DocumentCard: Change it to use set theme"
+          },
+          {
+            "author": "Daniel A. White <daniel@whitefamily.in>",
+            "commit": "b06da13ee4fc7b10baf57f21001c316aada8532a",
+            "comment": "ProgressIndicator: adjusting css so that the gleam doesn't go outside the indicator boundary."
+          },
+          {
+            "author": "Joshua Rush <jdrush89@gmail.com>",
+            "commit": "55231a8018313d0d46e2fb718fd4487d1d41eb5f",
+            "comment": "Allowing use of Elements as target prop for Callouts and ContextualMenus"
+          },
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "d4f91e9dd14f11e9a98561d0090fa1d0853ecd20",
+            "comment": "CommandBar: Fixed case where commandItemWidths would be null"
+          },
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "897b00027fadae6dcceb3ecb1b324e70cb1202f6",
+            "comment": "SpinButton: Updated styling to be consistent with Button and TextField"
+          },
+          {
+            "author": "Charles Simard-Lecours <charles.lecours@gmail.com>",
+            "commit": "252980d10c741136a39f526949d9e5247e654c2d",
+            "comment": "SearchBox: Deprecated `labelText` for `placeholder`."
+          },
+          {
+            "author": "MaxLustig <maxslustig@gmail.com>",
+            "commit": "5c53827513582631bfd1660eecafdf45ca92b745",
+            "comment": "Fix infinite recursion in scrollable pane"
+          },
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "eaeab40bb9326368c3c2a69d2430b69a27062962",
+            "comment": "Added is-selected and is-expanded semantic classes to compositelink style sets"
+          },
+          {
+            "author": "Charles Simard-Lecours <charles.lecours@gmail.com>",
+            "commit": "252980d10c741136a39f526949d9e5247e654c2d",
+            "comment": "Searchbox: Removed non-localized default placeholder string."
+          },
+          {
+            "author": "natalieethell <yummyraspberries@gmail.com>",
+            "commit": "8efbccec0c8826aa19b59d683d0bf29bd628dbf2",
+            "comment": "BasePicker: check for null reference before checking value of `this.suggestionElement`."
+          },
+          {
+            "author": "jijizz <liu_zhi8@hotmail.com>",
+            "commit": "fdab0a0fac6e4740b0943a507ad8e31e80f645fd",
+            "comment": "only mount spinner component when necessary"
+          }
+        ],
+        "minor": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "41e80543717c00b1f5ed95b289e4185ee0469c04",
+            "comment": "ChoiceGroup: Flex layout for icon and image fields.  Fixed some image field bugs."
+          },
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "77c1e54e140be51f9c7f252748bb5f868f957919",
+            "comment": "Upgrade to TypeScript 2.7.2"
+          },
+          {
+            "author": "Joshua Rush <jdrush89@gmail.com>",
+            "commit": "175c8e4fed7be760c7866da14c17e27faa769a6e",
+            "comment": "Allowing Nav Links to specify iconProps"
+          },
+          {
+            "author": "natalieethell <yummyraspberries@gmail.com>",
+            "commit": "b345d5304dbafc8fa394f89e3633218226024a8a",
+            "comment": "added More items aria label"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/icons\" from `>=5.4.2 <6.0.0` to `>=5.5.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.12.2 <6.0.0` to `>=5.13.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.13.0 <6.0.0` to `>=5.14.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=5.2.2 <6.0.0` to `>=5.3.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.57.0",
       "tag": "office-ui-fabric-react_v5.57.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index e80c5de6b3d53..a63a88104b532 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,34 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 01 Mar 2018 11:12:54 GMT and should not be manually modified.
+This log was last generated on Fri, 02 Mar 2018 11:25:35 GMT and should not be manually modified.
+
+## 5.58.0
+Fri, 02 Mar 2018 11:25:35 GMT
+
+### Minor changes
+
+- ChoiceGroup: Flex layout for icon and image fields.  Fixed some image field bugs.
+- Upgrade to TypeScript 2.7.2
+- Allowing Nav Links to specify iconProps
+- added More items aria label
+
+### Patches
+
+- DetailsList: only adding `aria-selected` when `selectionMode` is set to `none`.
+- Dropdown: Fixed custom render option in multi select.
+- Callout: move animation inline to greatly improve perf
+- make sure disabled links are non-navigable
+- DocumentCard: Change it to use set theme
+- ProgressIndicator: adjusting css so that the gleam doesn't go outside the indicator boundary.
+- Allowing use of Elements as target prop for Callouts and ContextualMenus
+- CommandBar: Fixed case where commandItemWidths would be null
+- SpinButton: Updated styling to be consistent with Button and TextField
+- SearchBox: Deprecated `labelText` for `placeholder`.
+- Fix infinite recursion in scrollable pane
+- Added is-selected and is-expanded semantic classes to compositelink style sets
+- Searchbox: Removed non-localized default placeholder string.
+- BasePicker: check for null reference before checking value of `this.suggestionElement`.
+- only mount spinner component when necessary
 
 ## 5.57.0
 Thu, 01 Mar 2018 11:12:54 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index c016269128cae..d937ff80f04fa 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.57.0",
+  "version": "5.58.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -30,7 +30,7 @@
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.1.0 <6.0.0",
-    "@uifabric/example-app-base": ">=5.2.2 <6.0.0",
+    "@uifabric/example-app-base": ">=5.3.0 <6.0.0",
     "enzyme": "^3.2.0",
     "enzyme-adapter-react-16": "^1.1.0",
     "es6-promise": "^4.1.0",
@@ -48,10 +48,10 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/icons": ">=5.4.2 <6.0.0",
-    "@uifabric/merge-styles": ">=5.12.2 <6.0.0",
+    "@uifabric/icons": ">=5.5.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "@uifabric/styling": ">=5.19.0 <6.0.0",
-    "@uifabric/utilities": ">=5.13.0 <6.0.0",
+    "@uifabric/utilities": ">=5.14.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 5aca7fad9b7d4..8979350605206 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -27,8 +27,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.13.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.12.2 <6.0.0",
+    "@uifabric/utilities": ">=5.14.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index d1b70242fc3b4..413cfc1f91841 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.14.0",
+      "tag": "@uifabric/utilities_v5.14.0",
+      "date": "Fri, 02 Mar 2018 11:25:35 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "77c1e54e140be51f9c7f252748bb5f868f957919",
+            "comment": "Upgrade to TypeScript 2.7.2"
+          },
+          {
+            "author": "Kelsey Young <kelseyyoung4@gmail.com>",
+            "commit": "44ca7b84a94649581e68a693971891fb1a834720",
+            "comment": "Update KeyCodes enum to include all key codes"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.12.2 <6.0.0` to `>=5.13.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.13.0",
       "tag": "@uifabric/utilities_v5.13.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 14bb654343f52..e552bc5a1bd05 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Thu, 22 Feb 2018 11:15:23 GMT and should not be manually modified.
+This log was last generated on Fri, 02 Mar 2018 11:25:35 GMT and should not be manually modified.
+
+## 5.14.0
+Fri, 02 Mar 2018 11:25:35 GMT
+
+### Minor changes
+
+- Upgrade to TypeScript 2.7.2
+- Update KeyCodes enum to include all key codes
 
 ## 5.13.0
 Thu, 22 Feb 2018 11:15:23 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index c8bbebccfdb07..93daa60c82aee 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.13.0",
+  "version": "5.14.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -36,7 +36,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/merge-styles": ">=5.12.2 <6.0.0",
+    "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/scripts/package.json b/scripts/package.json
index e5eb9584408b1..f7295689d65fb 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -11,7 +11,7 @@
     "@microsoft/api-extractor": "^4.2.6",
     "@microsoft/load-themed-styles": "^1.7.13",
     "@microsoft/loader-load-themed-styles": "^1.6.0",
-    "@uifabric/merge-styles": ">=5.12.2 <6.0.0",
+    "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "autoprefixer": "^7.1.5",
     "awesome-typescript-loader": "^3.2.3",
     "bundlesize": "^0.15.2",

From 5e24983e16790428d43d3c8252f361bc32c7f99f Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Fri, 2 Mar 2018 10:15:07 -0800
Subject: [PATCH 1500/1641] Image SCSS to MergeStyles Part 2: Style Conversion
 (#4151)

* convert scss to mergestyles

* update snapshots

* rush change

* missing semicolon

* update experiments snapshots

* cleanup
---
 .../image-scss2ms-pt2_2018-03-01-20-29.json   |  11 +
 .../image-scss2ms-pt2_2018-03-01-20-29.json   |  11 +
 .../__snapshots__/ActivityItem.test.tsx.snap  | 216 ++++++++++++++++--
 .../__snapshots__/DocumentCard.test.tsx.snap  |  24 +-
 .../__snapshots__/Facepile.test.tsx.snap      |  72 +++++-
 .../src/components/Image/Image.base.tsx       |  91 ++++----
 .../src/components/Image/Image.scss           |  80 -------
 .../src/components/Image/Image.styles.ts      | 104 ++++++++-
 .../src/components/Image/Image.types.ts       |  64 +++++-
 .../Image/__snapshots__/Image.test.tsx.snap   |  16 +-
 .../__snapshots__/Persona.test.tsx.snap       |  48 +++-
 11 files changed, 575 insertions(+), 162 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/image-scss2ms-pt2_2018-03-01-20-29.json
 create mode 100644 common/changes/office-ui-fabric-react/image-scss2ms-pt2_2018-03-01-20-29.json
 delete mode 100644 packages/office-ui-fabric-react/src/components/Image/Image.scss

diff --git a/common/changes/@uifabric/experiments/image-scss2ms-pt2_2018-03-01-20-29.json b/common/changes/@uifabric/experiments/image-scss2ms-pt2_2018-03-01-20-29.json
new file mode 100644
index 0000000000000..114fdecfb5805
--- /dev/null
+++ b/common/changes/@uifabric/experiments/image-scss2ms-pt2_2018-03-01-20-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Converting Image SCSS to MergeStyles step 2 - style conversion (snapshots updated)",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/image-scss2ms-pt2_2018-03-01-20-29.json b/common/changes/office-ui-fabric-react/image-scss2ms-pt2_2018-03-01-20-29.json
new file mode 100644
index 0000000000000..6618a41fbc7a2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/image-scss2ms-pt2_2018-03-01-20-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Converting Image SCSS to MergeStyles step 2 - style conversion",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap
index e861f56071077..66f878bbda3b8 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap
@@ -82,7 +82,12 @@ exports[`ActivityItem renders compact with a single persona correctly 1`] = `
             </span>
           </div>
           <div
-            className="ms-Image ms-Persona-image"
+            className=
+                ms-Image
+                ms-Persona-image
+                {
+                  overflow: hidden;
+                }
             style={
               Object {
                 "height": undefined,
@@ -92,7 +97,22 @@ exports[`ActivityItem renders compact with a single persona correctly 1`] = `
           >
             <img
               alt=""
-              className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+              className=
+                  ms-Image-image
+                  ms-Image-image--cover
+                  ms-Image-image--portrait
+                  is-notLoaded
+                  is-fadeIn
+                  {
+                    display: block;
+                    height: auto;
+                    left: 50%;
+                    opacity: 0;
+                    position: relative;
+                    top: 50%;
+                    transform: translate(-50%,-50%);
+                    width: 100%;
+                  }
               onError={[Function]}
               onLoad={[Function]}
               role={undefined}
@@ -293,7 +313,12 @@ exports[`ActivityItem renders compact with multiple personas correctly 1`] = `
             </span>
           </div>
           <div
-            className="ms-Image ms-Persona-image"
+            className=
+                ms-Image
+                ms-Persona-image
+                {
+                  overflow: hidden;
+                }
             style={
               Object {
                 "height": undefined,
@@ -303,7 +328,22 @@ exports[`ActivityItem renders compact with multiple personas correctly 1`] = `
           >
             <img
               alt=""
-              className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+              className=
+                  ms-Image-image
+                  ms-Image-image--cover
+                  ms-Image-image--portrait
+                  is-notLoaded
+                  is-fadeIn
+                  {
+                    display: block;
+                    height: auto;
+                    left: 50%;
+                    opacity: 0;
+                    position: relative;
+                    top: 50%;
+                    transform: translate(-50%,-50%);
+                    width: 100%;
+                  }
               onError={[Function]}
               onLoad={[Function]}
               role={undefined}
@@ -329,7 +369,12 @@ exports[`ActivityItem renders compact with multiple personas correctly 1`] = `
           style={undefined}
         >
           <div
-            className="ms-Image ms-Persona-image"
+            className=
+                ms-Image
+                ms-Persona-image
+                {
+                  overflow: hidden;
+                }
             style={
               Object {
                 "height": undefined,
@@ -339,7 +384,22 @@ exports[`ActivityItem renders compact with multiple personas correctly 1`] = `
           >
             <img
               alt=""
-              className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+              className=
+                  ms-Image-image
+                  ms-Image-image--cover
+                  ms-Image-image--portrait
+                  is-notLoaded
+                  is-fadeIn
+                  {
+                    display: block;
+                    height: auto;
+                    left: 50%;
+                    opacity: 0;
+                    position: relative;
+                    top: 50%;
+                    transform: translate(-50%,-50%);
+                    width: 100%;
+                  }
               onError={[Function]}
               onLoad={[Function]}
               role={undefined}
@@ -378,7 +438,12 @@ exports[`ActivityItem renders compact with multiple personas correctly 1`] = `
             </span>
           </div>
           <div
-            className="ms-Image ms-Persona-image"
+            className=
+                ms-Image
+                ms-Persona-image
+                {
+                  overflow: hidden;
+                }
             style={
               Object {
                 "height": undefined,
@@ -388,7 +453,22 @@ exports[`ActivityItem renders compact with multiple personas correctly 1`] = `
           >
             <img
               alt=""
-              className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+              className=
+                  ms-Image-image
+                  ms-Image-image--cover
+                  ms-Image-image--portrait
+                  is-notLoaded
+                  is-fadeIn
+                  {
+                    display: block;
+                    height: auto;
+                    left: 50%;
+                    opacity: 0;
+                    position: relative;
+                    top: 50%;
+                    transform: translate(-50%,-50%);
+                    width: 100%;
+                  }
               onError={[Function]}
               onLoad={[Function]}
               role={undefined}
@@ -491,7 +571,12 @@ exports[`ActivityItem renders with a single persona correctly 1`] = `
             </span>
           </div>
           <div
-            className="ms-Image ms-Persona-image"
+            className=
+                ms-Image
+                ms-Persona-image
+                {
+                  overflow: hidden;
+                }
             style={
               Object {
                 "height": 32,
@@ -501,7 +586,22 @@ exports[`ActivityItem renders with a single persona correctly 1`] = `
           >
             <img
               alt=""
-              className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+              className=
+                  ms-Image-image
+                  ms-Image-image--cover
+                  ms-Image-image--portrait
+                  is-notLoaded
+                  is-fadeIn
+                  {
+                    display: block;
+                    height: auto;
+                    left: 50%;
+                    opacity: 0;
+                    position: relative;
+                    top: 50%;
+                    transform: translate(-50%,-50%);
+                    width: 100%;
+                  }
               onError={[Function]}
               onLoad={[Function]}
               role={undefined}
@@ -715,7 +815,12 @@ exports[`ActivityItem renders with multiple personas correctly 1`] = `
             </span>
           </div>
           <div
-            className="ms-Image ms-Persona-image"
+            className=
+                ms-Image
+                ms-Persona-image
+                {
+                  overflow: hidden;
+                }
             style={
               Object {
                 "height": undefined,
@@ -725,7 +830,22 @@ exports[`ActivityItem renders with multiple personas correctly 1`] = `
           >
             <img
               alt=""
-              className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+              className=
+                  ms-Image-image
+                  ms-Image-image--cover
+                  ms-Image-image--portrait
+                  is-notLoaded
+                  is-fadeIn
+                  {
+                    display: block;
+                    height: auto;
+                    left: 50%;
+                    opacity: 0;
+                    position: relative;
+                    top: 50%;
+                    transform: translate(-50%,-50%);
+                    width: 100%;
+                  }
               onError={[Function]}
               onLoad={[Function]}
               role={undefined}
@@ -744,7 +864,12 @@ exports[`ActivityItem renders with multiple personas correctly 1`] = `
           style={undefined}
         >
           <div
-            className="ms-Image ms-Persona-image"
+            className=
+                ms-Image
+                ms-Persona-image
+                {
+                  overflow: hidden;
+                }
             style={
               Object {
                 "height": undefined,
@@ -754,7 +879,22 @@ exports[`ActivityItem renders with multiple personas correctly 1`] = `
           >
             <img
               alt=""
-              className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+              className=
+                  ms-Image-image
+                  ms-Image-image--cover
+                  ms-Image-image--portrait
+                  is-notLoaded
+                  is-fadeIn
+                  {
+                    display: block;
+                    height: auto;
+                    left: 50%;
+                    opacity: 0;
+                    position: relative;
+                    top: 50%;
+                    transform: translate(-50%,-50%);
+                    width: 100%;
+                  }
               onError={[Function]}
               onLoad={[Function]}
               role={undefined}
@@ -786,7 +926,12 @@ exports[`ActivityItem renders with multiple personas correctly 1`] = `
             </span>
           </div>
           <div
-            className="ms-Image ms-Persona-image"
+            className=
+                ms-Image
+                ms-Persona-image
+                {
+                  overflow: hidden;
+                }
             style={
               Object {
                 "height": undefined,
@@ -796,7 +941,22 @@ exports[`ActivityItem renders with multiple personas correctly 1`] = `
           >
             <img
               alt=""
-              className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+              className=
+                  ms-Image-image
+                  ms-Image-image--cover
+                  ms-Image-image--portrait
+                  is-notLoaded
+                  is-fadeIn
+                  {
+                    display: block;
+                    height: auto;
+                    left: 50%;
+                    opacity: 0;
+                    position: relative;
+                    top: 50%;
+                    transform: translate(-50%,-50%);
+                    width: 100%;
+                  }
               onError={[Function]}
               onLoad={[Function]}
               role={undefined}
@@ -815,7 +975,12 @@ exports[`ActivityItem renders with multiple personas correctly 1`] = `
           style={undefined}
         >
           <div
-            className="ms-Image ms-Persona-image"
+            className=
+                ms-Image
+                ms-Persona-image
+                {
+                  overflow: hidden;
+                }
             style={
               Object {
                 "height": undefined,
@@ -825,7 +990,22 @@ exports[`ActivityItem renders with multiple personas correctly 1`] = `
           >
             <img
               alt=""
-              className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+              className=
+                  ms-Image-image
+                  ms-Image-image--cover
+                  ms-Image-image--portrait
+                  is-notLoaded
+                  is-fadeIn
+                  {
+                    display: block;
+                    height: auto;
+                    left: 50%;
+                    opacity: 0;
+                    position: relative;
+                    top: 50%;
+                    transform: translate(-50%,-50%);
+                    width: 100%;
+                  }
               onError={[Function]}
               onLoad={[Function]}
               role={undefined}
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap b/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap
index d68c9fef76266..8c8c86ebb0c8c 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/__snapshots__/DocumentCard.test.tsx.snap
@@ -58,7 +58,12 @@ exports[`DocumentCard renders DocumentCard correctly 1`] = `
               />
             </div>
             <div
-              className="ms-Image ms-Persona-image"
+              className=
+                  ms-Image
+                  ms-Persona-image
+                  {
+                    overflow: hidden;
+                  }
               style={
                 Object {
                   "height": 32,
@@ -68,7 +73,22 @@ exports[`DocumentCard renders DocumentCard correctly 1`] = `
             >
               <img
                 alt=""
-                className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+                className=
+                    ms-Image-image
+                    ms-Image-image--cover
+                    ms-Image-image--portrait
+                    is-notLoaded
+                    is-fadeIn
+                    {
+                      display: block;
+                      height: auto;
+                      left: 50%;
+                      opacity: 0;
+                      position: relative;
+                      top: 50%;
+                      transform: translate(-50%,-50%);
+                      width: 100%;
+                    }
                 onError={[Function]}
                 onLoad={[Function]}
                 role={undefined}
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
index 8169b99dca04c..f247cc1b3709e 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
@@ -35,7 +35,12 @@ exports[`Facepile renders Facepile correctly 1`] = `
             style={undefined}
           >
             <div
-              className="ms-Image ms-Persona-image"
+              className=
+                  ms-Image
+                  ms-Persona-image
+                  {
+                    overflow: hidden;
+                  }
               style={
                 Object {
                   "height": 32,
@@ -45,7 +50,22 @@ exports[`Facepile renders Facepile correctly 1`] = `
             >
               <img
                 alt=""
-                className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+                className=
+                    ms-Image-image
+                    ms-Image-image--cover
+                    ms-Image-image--portrait
+                    is-notLoaded
+                    is-fadeIn
+                    {
+                      display: block;
+                      height: auto;
+                      left: 50%;
+                      opacity: 0;
+                      position: relative;
+                      top: 50%;
+                      transform: translate(-50%,-50%);
+                      width: 100%;
+                    }
                 onError={[Function]}
                 onLoad={[Function]}
                 role={undefined}
@@ -73,7 +93,12 @@ exports[`Facepile renders Facepile correctly 1`] = `
             style={undefined}
           >
             <div
-              className="ms-Image ms-Persona-image"
+              className=
+                  ms-Image
+                  ms-Persona-image
+                  {
+                    overflow: hidden;
+                  }
               style={
                 Object {
                   "height": 32,
@@ -83,7 +108,22 @@ exports[`Facepile renders Facepile correctly 1`] = `
             >
               <img
                 alt=""
-                className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+                className=
+                    ms-Image-image
+                    ms-Image-image--cover
+                    ms-Image-image--portrait
+                    is-notLoaded
+                    is-fadeIn
+                    {
+                      display: block;
+                      height: auto;
+                      left: 50%;
+                      opacity: 0;
+                      position: relative;
+                      top: 50%;
+                      transform: translate(-50%,-50%);
+                      width: 100%;
+                    }
                 onError={[Function]}
                 onLoad={[Function]}
                 role={undefined}
@@ -181,7 +221,12 @@ exports[`Facepile renders Facepile correctly 1`] = `
                 </span>
               </div>
               <div
-                className="ms-Image ms-Persona-image"
+                className=
+                    ms-Image
+                    ms-Persona-image
+                    {
+                      overflow: hidden;
+                    }
                 style={
                   Object {
                     "height": 32,
@@ -191,7 +236,22 @@ exports[`Facepile renders Facepile correctly 1`] = `
               >
                 <img
                   alt=""
-                  className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+                  className=
+                      ms-Image-image
+                      ms-Image-image--cover
+                      ms-Image-image--portrait
+                      is-notLoaded
+                      is-fadeIn
+                      {
+                        display: block;
+                        height: auto;
+                        left: 50%;
+                        opacity: 0;
+                        position: relative;
+                        top: 50%;
+                        transform: translate(-50%,-50%);
+                        width: 100%;
+                      }
                   onError={[Function]}
                   onLoad={[Function]}
                   role={undefined}
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx
index d89b587609aa9..ce2ebe0699bc5 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx
@@ -4,33 +4,29 @@ import * as React from 'react';
 import {
   autobind,
   BaseComponent,
-  css,
+  classNamesFunction,
+  customizable,
   getNativeProps,
   imageProperties
 } from '../../Utilities';
-import { IImageProps, ImageFit, ImageLoadState, ImageCoverStyle } from './Image.types';
-import { AnimationClassNames } from '../../Styling';
-import * as stylesImport from './Image.scss';
-const styles: any = stylesImport;
+import {
+  IImageProps,
+  IImageStyles,
+  IImageStyleProps,
+  ImageCoverStyle,
+  ImageFit,
+  ImageLoadState
+} from './Image.types';
+
+const getClassNames = classNamesFunction<IImageStyleProps, IImageStyles>();
 
 export interface IImageState {
   loadState?: ImageLoadState;
 }
 
-export const CoverStyleMap: { [key: number]: string } = {
-  [ImageCoverStyle.landscape]: 'ms-Image-image--landscape ' + styles.imageIsLandscape,
-  [ImageCoverStyle.portrait]: 'ms-Image-image--portrait ' + styles.imageIsPortrait
-};
-
-export const ImageFitMap: { [key: number]: string } = {
-  [ImageFit.center]: 'ms-Image-image--center ' + styles.imageIsCenter,
-  [ImageFit.contain]: 'ms-Image-image--contain ' + styles.imageIsContain,
-  [ImageFit.cover]: 'ms-Image-image--cover ' + styles.imageIsCover,
-  [ImageFit.none]: 'ms-Image-image--none ' + styles.imageIsNone
-};
-
 const KEY_PREFIX = 'fabricImage';
 
+@customizable('Image', ['theme'])
 export class ImageBase extends BaseComponent<IImageProps, IImageState> {
   public static defaultProps = {
     shouldFadeIn: true
@@ -73,22 +69,46 @@ export class ImageBase extends BaseComponent<IImageProps, IImageState> {
 
   public render() {
     const imageProps = getNativeProps(this.props, imageProperties, ['width', 'height']);
-    const { src, alt, width, height, shouldFadeIn, shouldStartVisible, className, imageFit, role, maximizeFrame } = this.props;
+    const {
+      src,
+      alt,
+      width,
+      height,
+      shouldFadeIn,
+      shouldStartVisible,
+      className,
+      imageFit,
+      role,
+      maximizeFrame,
+      getStyles,
+      theme
+    } = this.props;
     const { loadState } = this.state;
     const coverStyle = this.props.coverStyle !== undefined ? this.props.coverStyle : this._coverStyle;
-    const loaded = loadState === ImageLoadState.loaded || (loadState === ImageLoadState.notLoaded && this.props.shouldStartVisible);
+    const classNames = getClassNames(getStyles!,
+      {
+        theme: theme!,
+        className,
+        width,
+        height,
+        maximizeFrame,
+        shouldFadeIn,
+        shouldStartVisible,
+        isLoaded: loadState === ImageLoadState.loaded || (loadState === ImageLoadState.notLoaded && this.props.shouldStartVisible),
+        isLandscape: coverStyle === ImageCoverStyle.landscape,
+        isCenter: imageFit === ImageFit.center,
+        isContain: imageFit === ImageFit.contain,
+        isCover: imageFit === ImageFit.cover,
+        isNone: imageFit === ImageFit.none,
+        isError: loadState === ImageLoadState.error,
+        isNotImageFit: imageFit === undefined
+      }
+    );
 
     // If image dimensions aren't specified, the natural size of the image is used.
     return (
       <div
-        className={ css(
-          'ms-Image',
-          styles.root,
-          className,
-          {
-            ['ms-Image--maximizeFrame ' + styles.rootIsMaximizeFrame]: maximizeFrame
-          })
-        }
+        className={ classNames.root }
         style={ { width: width, height: height } }
         ref={ this._resolveRef('_frameElement') }
       >
@@ -97,22 +117,7 @@ export class ImageBase extends BaseComponent<IImageProps, IImageState> {
           onLoad={ this._onImageLoaded }
           onError={ this._onImageError }
           key={ KEY_PREFIX + this.props.src || '' }
-          className={
-            css(
-              'ms-Image-image',
-              styles.image,
-              CoverStyleMap[coverStyle],
-              (imageFit !== undefined) && ImageFitMap[imageFit],
-              !loaded && 'is-notLoaded',
-              loaded && 'is-loaded ' + styles.imageIsLoaded,
-              shouldFadeIn && 'is-fadeIn',
-              loadState === ImageLoadState.error && 'is-error',
-              loaded && shouldFadeIn && !shouldStartVisible && AnimationClassNames.fadeIn400,
-              {
-                ['ms-Image-image--scaleWidth ' + styles.imageIsScaleWidth]: (imageFit === undefined && !!width && !height),
-                ['ms-Image-image--scaleHeight ' + styles.imageIsScaleHeight]: (imageFit === undefined && !width && !!height),
-                ['ms-Image-image--scaleWidthHeight ' + styles.imageIsScaleWidthHeight]: (imageFit === undefined && !!width && !!height)
-              }) }
+          className={ classNames.image }
           ref={ this._resolveRef('_imageElement') }
           src={ src }
           alt={ alt }
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.scss b/packages/office-ui-fabric-react/src/components/Image/Image.scss
deleted file mode 100644
index 12d4f2fd0e159..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Image/Image.scss
+++ /dev/null
@@ -1,80 +0,0 @@
-@import '../../common/common';
-
-.root {
-  overflow: hidden;
-}
-
-// Modifier: The image frame should fill its parent element.
-.rootIsMaximizeFrame {
-  height: 100%;
-  width: 100%;
-}
-
-.image {
-  display: block;
-  opacity: 0;
-
-  &.imageIsLoaded {
-    opacity: 1;
-  }
-}
-
-.imageIsCenter,
-.imageIsContain,
-.imageIsCover {
-  position: relative;
-  @include ms-left(50%);
-  top: 50%;
-  // transform-translateX mixin is not used here because a transateY is also required.
-  @include LTR {
-    transform: translate(-50%,-50%);
-  }
-  @include RTL {
-    transform: translate(50%,-50%);
-  }
-}
-
-.imageIsContain {
-  &.imageIsLandscape {
-    width: 100%;
-    height: auto;
-  }
-
-  &.imageIsPortrait {
-    height: 100%;
-    width: auto;
-  }
-}
-
-.imageIsCover {
-  &.imageIsLandscape {
-    height: 100%;
-    width: auto;
-  }
-
-  &.imageIsPortrait {
-    width: 100%;
-    height: auto;
-  }
-}
-
-.imageIsNone {
-  height: auto;
-  width: auto;
-}
-
-/** This is identical to the default behavior. */
-.imageIsScaleWidthHeight {
-  height: 100%;
-  width: 100%;
-}
-
-.imageIsScaleWidth {
-  height: auto;
-  width: 100%;
-}
-
-.imageIsScaleHeight {
-  height: 100%;
-  width: auto;
-}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.styles.ts b/packages/office-ui-fabric-react/src/components/Image/Image.styles.ts
index 251d2f01f1266..89b1bb12dcedb 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.styles.ts
@@ -1,5 +1,6 @@
 import { IImageStyleProps, IImageStyles } from './Image.types';
 import {
+  AnimationClassNames,
   IStyle,
   ITheme,
 } from '../../Styling';
@@ -10,19 +11,112 @@ export const getStyles = (
   const {
     className,
     theme,
+    width,
+    height,
+    maximizeFrame,
+    isLoaded,
+    shouldFadeIn,
+    shouldStartVisible,
+    isLandscape,
+    isCenter,
+    isContain,
+    isCover,
+    isNone,
+    isError,
+    isNotImageFit
   } = props;
 
   const { palette, semanticColors } = theme;
 
+  const ImageFitStyles: IStyle = {
+    position: 'relative',
+    left: '50%',
+    top: '50%',
+    transform: 'translate(-50%,-50%)' // @todo test RTL renders transform: translate(50%,-50%);
+  };
+
   return ({
     root: [
       'ms-Image',
       {
-        // Insert css properties
-
-      }
+        overflow: 'hidden'
+      },
+      maximizeFrame && [
+        'ms-Image--maximizeFrame',
+        {
+          height: '100%',
+          width: '100%'
+        }
+      ],
+      className
     ],
-
-    // Insert className styles
+    image: [
+      'ms-Image-image',
+      {
+        display: 'block',
+        opacity: 0
+      },
+      isLoaded && [
+        'is-loaded',
+        {
+          opacity: 1
+        }
+      ],
+      isCenter && [
+        'ms-Image-image--center',
+        ImageFitStyles
+      ],
+      isContain && [
+        'ms-Image-image--contain',
+        isLandscape && {
+          width: '100%',
+          height: 'auto'
+        },
+        !isLandscape && {
+          width: 'auto',
+          height: '100%'
+        },
+        ImageFitStyles
+      ],
+      isCover && [
+        'ms-Image-image--cover',
+        isLandscape && {
+          width: 'auto',
+          height: '100%'
+        },
+        !isLandscape && {
+          width: '100%',
+          height: 'auto'
+        },
+        ImageFitStyles
+      ],
+      isNone && [
+        'ms-Image-image--none',
+        {
+          width: 'auto',
+          height: 'auto'
+        }
+      ],
+      isNotImageFit && [
+        !!width && !height && {
+          height: 'auto',
+          width: '100%'
+        },
+        !width && !!height && {
+          height: '100%',
+          width: 'auto'
+        },
+        !!width && !!height && {
+          height: '100%',
+          width: '100%'
+        }
+      ],
+      isLoaded && shouldFadeIn && !shouldStartVisible && AnimationClassNames.fadeIn400,
+      isLandscape && 'ms-Image-image--landscape',
+      !isLandscape && 'ms-Image-image--portrait',
+      !isLoaded && 'is-notLoaded',
+      shouldFadeIn && 'is-fadeIn',
+      isError && 'is-error'
+    ]
   });
 };
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.types.ts b/packages/office-ui-fabric-react/src/components/Image/Image.types.ts
index 41cc5f4dcd4a3..35d08b2eed47c 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.types.ts
@@ -155,11 +155,71 @@ export interface IImageStyleProps {
    * Accept custom classNames
    */
   className?: string;
+
+  /**
+   * If true, the image frame will expand to fill its parent container.
+   */
+  maximizeFrame?: boolean;
+
+  /**
+   * If true, the image is loaded
+   */
+  isLoaded?: boolean;
+
+  /**
+   * If true, fades the image in when loaded.
+   * @defaultvalue true
+   */
+  shouldFadeIn?: boolean;
+
+  /**
+   * If true, the image starts as visible and is hidden on error. Otherwise, the image is hidden until
+   * it is successfully loaded. This disables shouldFadeIn.
+   * @defaultvalue false;
+   */
+  shouldStartVisible?: boolean;
+
+  /**
+   * If true the image is coverStyle landscape instead of portrait
+   */
+  isLandscape?: boolean;
+
+  /**
+   * ImageFit booleans for center, cover, contain, none
+   */
+  isCenter?: boolean;
+  isContain?: boolean;
+  isCover?: boolean;
+  isNone?: boolean;
+
+  /**
+   * if true image load is in error
+   */
+  isError?: boolean;
+
+  /**
+   * if true, imageFit is undefined
+   */
+  isNotImageFit?: boolean;
+
+  /**
+   * Image width valye
+   */
+  width?: number | string;
+
+  /**
+   * Image height valye
+   */
+  height?: number | string;
 }
 
 export interface IImageStyles {
   /**
-   * Style for the root element.
+   * Style set for the root div element.
+   */
+  root: IStyle;
+  /**
+   * Style set for the img element.
    */
-  root?: IStyle;
+  image: IStyle;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Image/__snapshots__/Image.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Image/__snapshots__/Image.test.tsx.snap
index ed49ec98faf18..61c24e9ba032f 100644
--- a/packages/office-ui-fabric-react/src/components/Image/__snapshots__/Image.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Image/__snapshots__/Image.test.tsx.snap
@@ -2,7 +2,11 @@
 
 exports[`Image renders Image correctly 1`] = `
 <div
-  className="ms-Image"
+  className=
+      ms-Image
+      {
+        overflow: hidden;
+      }
   style={
     Object {
       "height": undefined,
@@ -12,7 +16,15 @@ exports[`Image renders Image correctly 1`] = `
 >
   <img
     alt={undefined}
-    className="ms-Image-image ms-Image-image--portrait undefined is-notLoaded is-fadeIn"
+    className=
+        ms-Image-image
+        ms-Image-image--portrait
+        is-notLoaded
+        is-fadeIn
+        {
+          display: block;
+          opacity: 0;
+        }
     onError={[Function]}
     onLoad={[Function]}
     role={undefined}
diff --git a/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap
index 13ec48d656f4c..0353479d3e09e 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Persona/__snapshots__/Persona.test.tsx.snap
@@ -15,7 +15,12 @@ exports[`Persona renders Persona correctly with image 1`] = `
       style={undefined}
     >
       <div
-        className="ms-Image ms-Persona-image"
+        className=
+            ms-Image
+            ms-Persona-image
+            {
+              overflow: hidden;
+            }
         style={
           Object {
             "height": 48,
@@ -25,7 +30,22 @@ exports[`Persona renders Persona correctly with image 1`] = `
       >
         <img
           alt=""
-          className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+          className=
+              ms-Image-image
+              ms-Image-image--cover
+              ms-Image-image--portrait
+              is-notLoaded
+              is-fadeIn
+              {
+                display: block;
+                height: auto;
+                left: 50%;
+                opacity: 0;
+                position: relative;
+                top: 50%;
+                transform: translate(-50%,-50%);
+                width: 100%;
+              }
           onError={[Function]}
           onLoad={[Function]}
           role={undefined}
@@ -92,7 +112,12 @@ exports[`Persona renders Persona correctly with initials 1`] = `
         </span>
       </div>
       <div
-        className="ms-Image ms-Persona-image"
+        className=
+            ms-Image
+            ms-Persona-image
+            {
+              overflow: hidden;
+            }
         style={
           Object {
             "height": 48,
@@ -102,7 +127,22 @@ exports[`Persona renders Persona correctly with initials 1`] = `
       >
         <img
           alt=""
-          className="ms-Image-image ms-Image-image--portrait undefined ms-Image-image--cover undefined is-notLoaded is-fadeIn"
+          className=
+              ms-Image-image
+              ms-Image-image--cover
+              ms-Image-image--portrait
+              is-notLoaded
+              is-fadeIn
+              {
+                display: block;
+                height: auto;
+                left: 50%;
+                opacity: 0;
+                position: relative;
+                top: 50%;
+                transform: translate(-50%,-50%);
+                width: 100%;
+              }
           onError={[Function]}
           onLoad={[Function]}
           role={undefined}

From 3187cfe4123dd2ecc48ff125d658d485b71249db Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 2 Mar 2018 12:56:47 -0800
Subject: [PATCH 1501/1641] Update package.json

---
 scripts/package.json | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/scripts/package.json b/scripts/package.json
index f7295689d65fb..ff4b4d6ca700c 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -49,7 +49,7 @@
   "bundlesize": [
     {
       "path": "../apps/test-bundle-button/dist/main.min.js",
-      "maxSize": "44.5 kB"
+      "maxSize": "44.6 kB"
     }
   ]
-}
\ No newline at end of file
+}

From 6060a321343aab06548b3c5441b9d9fe62507242 Mon Sep 17 00:00:00 2001
From: Aditi Mandal <aditima@microsoft.com>
Date: Fri, 2 Mar 2018 13:15:10 -0800
Subject: [PATCH 1502/1641]  Fix issue 3608: DetailsList horizontal scroll
 (#4164)

* Fix issue 3608: DetailsList horizontal scroll

* add change file
---
 .../aditima-header-sizer_2018-03-02-18-27.json        | 11 +++++++++++
 .../src/components/DetailsList/DetailsHeader.scss     | 10 +++++++++-
 2 files changed, 20 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/aditima-header-sizer_2018-03-02-18-27.json

diff --git a/common/changes/office-ui-fabric-react/aditima-header-sizer_2018-03-02-18-27.json b/common/changes/office-ui-fabric-react/aditima-header-sizer_2018-03-02-18-27.json
new file mode 100644
index 0000000000000..f26650072e00d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/aditima-header-sizer_2018-03-02-18-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix issue 3608: DetailsList horizontal scroll due to cellSizer",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "aditima@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
index ccdd8a6f77e35..6ee10c6f42cd2 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.scss
@@ -85,7 +85,6 @@ $isPaddedMargin: 24px;
   cursor: ew-resize;
   bottom: 0;
   top: 0;
-  margin: 0 -8px;
   overflow: hidden;
   height: inherit;
   background: transparent;
@@ -115,6 +114,15 @@ $isPaddedMargin: 24px;
   }
 }
 
+.cellSizerStart {
+  margin: 0 -8px;
+}
+
+.cellSizerEnd {
+  margin: 0;
+  @include margin-left(-16px);
+}
+
 .collapseButton {
   text-align: center;
   transform: rotate(-180deg);

From 132efd3b7ee5853a2c47d5ac7663853caedf28e1 Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Fri, 2 Mar 2018 13:16:30 -0800
Subject: [PATCH 1503/1641] Addressing Issue #4147 - Nav Buttons have invalid
 `aria-describedby` value (#4159)

* Switched ActionButton prop in Nav from description to ariaDescription

* rush change
---
 .../nav-ariadescribedby-4147_2018-03-02-00-43.json    | 11 +++++++++++
 .../src/components/Nav/Nav.base.tsx                   |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/nav-ariadescribedby-4147_2018-03-02-00-43.json

diff --git a/common/changes/office-ui-fabric-react/nav-ariadescribedby-4147_2018-03-02-00-43.json b/common/changes/office-ui-fabric-react/nav-ariadescribedby-4147_2018-03-02-00-43.json
new file mode 100644
index 0000000000000..8ab8544c7868c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/nav-ariadescribedby-4147_2018-03-02-00-43.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixed aria-describedby bug causing it not to render properly",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
index 09eca9d69f67f..831c408bac821 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
@@ -159,7 +159,7 @@ export class NavBase extends BaseComponent<INavProps, INavState> implements INav
         styles={ buttonStyles }
         href={ link.url || (link.forceAnchor ? 'javascript:' : undefined) }
         iconProps={ link.iconProps || { iconName: link.icon || '' } }
-        description={ link.title || link.name }
+        ariaDescription={ link.title || link.name }
         onClick={ link.onClick ? this._onNavButtonLinkClicked.bind(this, link) : this._onNavAnchorLinkClicked.bind(this, link) }
         title={ link.title || link.name }
         target={ link.target }

From 172b7c5c54a0f50b305d7eff4d77f62e861daae0 Mon Sep 17 00:00:00 2001
From: Su Su <s@warmsea.net>
Date: Mon, 5 Mar 2018 04:49:09 +0800
Subject: [PATCH 1504/1641] Nav: wire a link to expand/collapse behavior if it
 has no URL but has children (#4171)

* Wire a link to expand/collapse if it has no URL but has children

* Add change file.

* Update Nav_2018-03-03-08-32.json
---
 .../office-ui-fabric-react/Nav_2018-03-03-08-32.json  | 11 +++++++++++
 .../src/components/Nav/Nav.base.tsx                   |  6 ++++++
 2 files changed, 17 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/Nav_2018-03-03-08-32.json

diff --git a/common/changes/office-ui-fabric-react/Nav_2018-03-03-08-32.json b/common/changes/office-ui-fabric-react/Nav_2018-03-03-08-32.json
new file mode 100644
index 0000000000000..756a4f897a740
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/Nav_2018-03-03-08-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Nav: Wire nav link to expand/collapse behavior if it has no URL but has children.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "s@warmsea.net"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
index 831c408bac821..75ba494ceb838 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
@@ -305,6 +305,9 @@ export class NavBase extends BaseComponent<INavProps, INavState> implements INav
     if (this.props.onLinkClick) {
       this.props.onLinkClick(ev, link);
     }
+    if (!link.url && link.links && link.links.length > 0) {
+      this._onLinkExpandClicked(link, ev);
+    }
 
     this.setState({ selectedKey: link.key });
   }
@@ -313,6 +316,9 @@ export class NavBase extends BaseComponent<INavProps, INavState> implements INav
     if (link.onClick) {
       link.onClick(ev, link);
     }
+    if (!link.url && link.links && link.links.length > 0) {
+      this._onLinkExpandClicked(link, ev);
+    }
 
     this.setState({ selectedKey: link.key });
   }

From eb4764aa3943195315138df089e27e7e261c664b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Samuel=20Timb=C3=B3?= <samuelmtimbo@gmail.com>
Date: Sun, 4 Mar 2018 22:06:43 -0800
Subject: [PATCH 1505/1641] Use correct _list ref string (#4168)

* Use correct _list ref string

* Update users-samuelmtimbo-fixlistresize_2018-03-03-00-16.json
---
 ...s-samuelmtimbo-fixlistresize_2018-03-03-00-16.json | 11 +++++++++++
 .../src/components/GroupedList/GroupedListSection.tsx |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-samuelmtimbo-fixlistresize_2018-03-03-00-16.json

diff --git a/common/changes/office-ui-fabric-react/users-samuelmtimbo-fixlistresize_2018-03-03-00-16.json b/common/changes/office-ui-fabric-react/users-samuelmtimbo-fixlistresize_2018-03-03-00-16.json
new file mode 100644
index 0000000000000..49694ab8ff1d3
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-samuelmtimbo-fixlistresize_2018-03-03-00-16.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "GroupedListSection: Changed the list ref name from `list` to `_list`",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "samuelmtimbo@gmail.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
index 2974a2a3d8d20..3ce273b486904 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
@@ -322,7 +322,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
       <List
         items={ items }
         onRenderCell={ this._onRenderGroupCell(onRenderCell, groupNestingDepth) }
-        ref={ this._resolveRef('list') }
+        ref={ this._resolveRef('_list') }
         renderCount={ Math.min(count, renderCount) }
         startIndex={ startIndex }
         onShouldVirtualize={ onShouldVirtualize }

From 28af7a3ed0e56fdddfb5b2ccb26c83543e6b049f Mon Sep 17 00:00:00 2001
From: Mark Polak <mark@thedutchies.com>
Date: Mon, 5 Mar 2018 08:34:02 +0100
Subject: [PATCH 1506/1641] No unused variable (#4173)

* Revert "Move fabric to TypeScript 2.7.2 (#4153)"

This reverts commit 77c1e54e140be51f9c7f252748bb5f868f957919.

* Revert "Revert "Move fabric to TypeScript 2.7.2 (#4153)""

This reverts commit 573ff2e5193a2068588f616b6c926356e3e9dd24.

* No unused variable

* Add npm change file

* Enable rule
---
 .../no-unused-variable_2018-03-04-15-44.json  |  11 +
 .../package.json                              |   2 +-
 .../ActivityItem/ActivityItem.classNames.ts   |   4 +-
 .../components/ActivityItem/ActivityItem.tsx  |   3 +-
 .../Button/BaseButton.classNames.ts           |   1 -
 .../src/components/Button/BaseButton.tsx      |   6 +-
 .../src/components/Button/ButtonPage.tsx      |   3 +-
 .../src/components/Button/ButtonThemes.ts     |   1 -
 .../Button/examples/Button.Anchor.Example.tsx |   3 -
 .../Button/examples/Button.Icon.Example.tsx   |   1 -
 .../examples/Button.Primary.Example.tsx       |   1 -
 .../examples/Button.ScreenReader.Example.tsx  |   1 -
 .../Button/examples/Button.Swap.Example.tsx   |   1 -
 .../src/components/Calendar/Calendar.tsx      |   3 +-
 .../src/components/Calendar/CalendarDay.tsx   |   3 +-
 .../src/components/Callout/Callout.test.tsx   |   2 -
 .../src/components/Callout/Callout.types.ts   |   3 -
 .../Callout/CalloutContent.base.tsx           |   3 +-
 .../Callout/CalloutContent.styles.ts          |   6 -
 .../src/components/Check/Check.styles.ts      |   3 -
 .../src/components/Checkbox/Checkbox.tsx      |   9 +-
 .../examples/Checkbox.Basic.Example.tsx       |  12 +-
 .../ChoiceGroup/ChoiceGroup.test.tsx          |  11 +-
 .../src/components/Coachmark/Beak/Beak.tsx    |   5 +-
 .../components/Coachmark/Beak/Beak.types.ts   |   1 -
 .../src/components/Coachmark/Coachmark.tsx    |   1 -
 .../components/Coachmark/Coachmark.types.ts   |   2 +-
 .../PositioningContainer.tsx                  |   5 -
 .../PositioningContainer.types.ts             |   7 +-
 .../examples/Coachmark.Basic.Example.tsx      |   4 +-
 .../components/ComboBox/ComboBox.styles.ts    |   1 -
 .../src/components/ComboBox/ComboBox.test.tsx |   1 -
 .../src/components/ComboBox/ComboBox.tsx      |  17 +-
 .../ComboBox/VirtualizedComboBox.tsx          |   6 +-
 .../examples/ComboBox.Basic.Example.tsx       |   3 +-
 .../ContextualMenu.classNames.ts              |   5 -
 .../ContextualMenu/ContextualMenu.test.tsx    |   3 +-
 .../ContextualMenu/ContextualMenu.tsx         |   8 +-
 .../ContextualMenu/ContextualMenu.types.ts    |   1 -
 .../ContextualMenu/ContextualMenuItem.tsx     |   2 +-
 .../ContextualMenuItem.types.ts               |   1 -
 .../ContextualMenu/ContextualMenuPage.tsx     |   3 +-
 .../ContextualMenu.CustomMenuItem.Example.tsx |   4 +-
 .../ContextualMenu.Customization.Example.tsx  | 326 +++++++++---------
 ...alMenu.CustomizationWithNoWrap.Example.tsx |   4 +-
 .../ContextualMenu.Directional.Example.tsx    |   1 -
 .../ContextualMenu.ScrollBar.Example.tsx      |   2 +-
 .../src/components/DatePicker/DatePicker.tsx  |   5 +-
 .../DetailsList/DetailsList.test.tsx          |   5 +-
 .../components/DetailsList/DetailsList.tsx    |   3 -
 .../src/components/DetailsList/DetailsRow.tsx |   3 -
 .../src/components/Dialog/Dialog.styles.ts    |  11 -
 .../components/Dialog/DialogContent.styles.ts |  10 -
 .../components/Dialog/DialogFooter.styles.ts  |  11 -
 .../src/components/Dropdown/Dropdown.test.tsx |   2 +-
 .../src/components/Dropdown/Dropdown.tsx      |   3 +-
 .../examples/Dropdown.Error.Example.tsx       |   8 +-
 .../components/Fabric/Fabric.classNames.ts    |   1 -
 .../src/components/Facepile/Facepile.test.tsx |   2 +-
 .../src/components/Facepile/Facepile.tsx      |  14 +-
 .../components/FocusZone/FocusZone.test.tsx   |   6 +-
 .../src/components/FocusZone/FocusZone.tsx    |   1 -
 .../GroupedList/GroupedListSection.tsx        |   6 +-
 .../examples/GroupedList.Custom.Example.tsx   |  10 +-
 .../components/HoverCard/ExpandingCard.tsx    |   5 -
 .../src/components/HoverCard/HoverCard.tsx    |   1 -
 .../src/components/Icon/Icon.tsx              |  12 +-
 .../src/components/Icon/Icon.types.ts         |   1 -
 .../src/components/Image/Image.styles.ts      |   4 -
 .../src/components/Image/Image.test.tsx       |   6 +-
 .../src/components/Image/Image.types.ts       |   1 -
 .../src/components/Label/Label.classNames.ts  |  56 +--
 .../src/components/Layer/Layer.base.tsx       |   3 -
 .../src/components/Layer/Layer.styles.ts      |   7 -
 .../src/components/List/List.tsx              |   6 -
 .../List/examples/List.Grid.Example.tsx       |   2 -
 .../src/components/Nav/Nav.base.tsx           |  11 -
 .../src/components/Nav/Nav.styles.ts          |   4 +-
 .../src/components/Nav/Nav.types.ts           |   1 -
 .../components/OverflowSet/OverflowSet.tsx    |   1 -
 .../examples/OverflowSet.Vertical.Example.tsx |   6 +-
 .../src/components/Overlay/Overlay.styles.ts  |   8 +-
 .../src/components/Overlay/Overlay.types.ts   |   1 -
 .../src/components/Panel/Panel.tsx            |   2 +-
 .../examples/Panel.ExtraLarge.Example.tsx     |   1 -
 .../Panel/examples/Panel.Large.Example.tsx    |   1 -
 .../src/components/Persona/Persona.styles.ts  |  11 -
 .../src/components/Persona/Persona.test.tsx   |   1 -
 .../src/components/Persona/PersonaCoin.tsx    |  10 +-
 .../src/components/Persona/PersonaConsts.ts   |   1 -
 .../Persona.CustomCoinRender.Example.tsx      |   1 -
 ...rogressIndicator.Indeterminate.Example.tsx |   5 +-
 .../src/components/Rating/Rating.styles.ts    |   2 +-
 .../src/components/Rating/Rating.test.tsx     |  10 -
 .../src/components/Rating/Rating.tsx          |   1 +
 .../ResizeGroup/ResizeGroup.base.tsx          |   1 -
 .../ResizeGroup/ResizeGroup.styles.ts         |   7 -
 .../ScrollablePane/ScrollablePane.styles.ts   |  10 +-
 .../components/SearchBox/SearchBox.base.tsx   |   2 -
 .../components/SearchBox/SearchBox.styles.tsx |   6 +-
 .../components/SearchBox/SearchBox.test.tsx   |   3 -
 .../src/components/SearchBox/SearchBox.tsx    |   1 +
 .../SpinButton/SpinButton.styles.ts           |   2 +-
 .../components/SpinButton/SpinButton.test.tsx |   2 -
 .../ColorPickerGridCell.styles.ts             |   8 +-
 .../SwatchColorPicker/ColorPickerGridCell.tsx |   3 +-
 .../ColorPickerGridCell.types.ts              |   1 -
 .../SwatchColorPicker.base.tsx                |  10 +-
 .../SwatchColorPicker.styles.ts               |   7 +-
 .../SwatchColorPicker.test.tsx                |   1 -
 .../SwatchColorPicker/SwatchColorPicker.tsx   |   7 +-
 .../TeachingBubble/TeachingBubble.tsx         |   4 +-
 .../TeachingBubble/TeachingBubbleContent.tsx  |  11 +-
 .../src/components/Theme/ThemePage.tsx        |   2 +-
 .../ThemeGenerator/ThemeGeneratorPage.tsx     |  11 +-
 .../src/components/pickers/BasePicker.tsx     |   2 +-
 .../SelectedItemWithMenu.tsx                  |   2 +-
 .../pickers/Suggestions/Suggestions.tsx       |   7 +-
 .../src/utilities/dateMath/DateMath.ts        |   3 -
 .../src/utilities/grid/Grid.tsx               |   2 +-
 .../src/utilities/positioning.test.ts         |   4 -
 .../src/utilities/selection/Selection.ts      |   3 -
 .../selection/SelectionZone.test.tsx          |   4 -
 .../src/utilities/selection/SelectionZone.tsx |   1 -
 packages/office-ui-fabric-react/tslint.json   |   3 +-
 125 files changed, 297 insertions(+), 622 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/no-unused-variable_2018-03-04-15-44.json

diff --git a/common/changes/office-ui-fabric-react/no-unused-variable_2018-03-04-15-44.json b/common/changes/office-ui-fabric-react/no-unused-variable_2018-03-04-15-44.json
new file mode 100644
index 0000000000000..d6dda19a3d7a1
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/no-unused-variable_2018-03-04-15-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Removes unused variables",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react-tslint/package.json b/packages/office-ui-fabric-react-tslint/package.json
index 492c95ba21a0a..32c0dbc598ef0 100644
--- a/packages/office-ui-fabric-react-tslint/package.json
+++ b/packages/office-ui-fabric-react-tslint/package.json
@@ -10,4 +10,4 @@
   "devDependencies": {
     "tslint-react": "^3.2.0"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.classNames.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.classNames.ts
index 1311037925a36..12d62e960a6d0 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.classNames.ts
@@ -1,7 +1,5 @@
 import {
-  mergeStyles,
-  ITheme,
-  getTheme
+  mergeStyles
 } from '../../Styling';
 import {
   memoizeFunction
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
index 814a480422d6f..887f243b75f54 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
@@ -4,7 +4,6 @@ import * as React from 'react';
 
 import { autobind, BaseComponent } from '../../Utilities';
 import { IActivityItemProps, IActivityItemStyles } from './ActivityItem.types';
-import { mergeStyles } from '../../Styling';
 import { IActivityItemClassNames, getClassNames } from './ActivityItem.classNames';
 import { getStyles } from './ActivityItem.styles';
 import { PersonaSize, PersonaCoin, IPersonaProps } from '../../Persona';
@@ -114,7 +113,7 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
       activityPersonas.filter((person, index) => index < personaLimit).forEach((person, index) => {
         personaList.push(
           <PersonaCoin
-            {...person}
+            { ...person }
             // tslint:disable-next-line:no-string-literal
             key={ person['key'] ? person['key'] : index }
             className={ this._classNames.activityPersona }
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
index 688e667d0ef61..bd2dcc9e56bbe 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.classNames.ts
@@ -1,7 +1,6 @@
 import { memoizeFunction } from '../../Utilities';
 import { mergeStyleSets } from '../../Styling';
 import { IButtonStyles } from './Button.types';
-import { getStyles } from './BaseButton.styles';
 
 export interface IButtonClassNames {
   root?: string;
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 6bf90c3ba70a0..13e42a812473c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -10,7 +10,7 @@ import {
   getNativeProps,
   KeyCodes
 } from '../../Utilities';
-import { Icon, IIconProps } from '../../Icon';
+import { Icon } from '../../Icon';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { ContextualMenu, IContextualMenuProps } from '../../ContextualMenu';
 import { IButtonProps, IButton } from './Button.types';
@@ -102,14 +102,14 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       menuIconProps && menuIconProps.className,
       isPrimaryButtonDisabled!,
       checked!,
-      !!this.state.menuProps,
+      !!menuProps,
       this.props.split) : getBaseButtonClassNames(styles!, className!,
         variantClassName!,
         iconProps && iconProps.className,
         menuIconProps && menuIconProps.className,
         isPrimaryButtonDisabled!,
         checked!,
-        !!this.state.menuProps,
+        !!menuProps,
         this.props.split);
 
     const { _ariaDescriptionId, _labelId, _descriptionId } = this;
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
index 0cdcf9100cfc6..5760dfede8dc9 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
@@ -7,7 +7,6 @@ import {
 } from '@uifabric/example-app-base';
 import { ButtonStatus } from './Button.checklist';
 import { ButtonDefaultExample } from './examples/Button.Default.Example';
-import { ButtonCommandExample } from './examples/Button.Command.Example';
 import { ButtonContextualMenuExample } from './examples/Button.ContextualMenu.Example';
 import { ButtonCompoundExample } from './examples/Button.Compound.Example';
 import { ButtonActionExample } from './examples/Button.Action.Example';
@@ -178,7 +177,7 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
         isHeaderVisible={ this.props.isHeaderVisible }
         componentStatus={
           <ComponentStatus
-            {...ButtonStatus}
+            { ...ButtonStatus }
           />
         }
       />
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts b/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
index 8ffc2d20125e2..aa0fa868ef6a4 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
@@ -7,7 +7,6 @@ export function standardStyles(theme: ITheme): IButtonStyles {
   const buttonBackground = s.buttonBackground;
   const buttonBackgroundChecked = s.buttonBackgroundChecked;
   const buttonBackgroundHovered = s.buttonBackgroundHovered;
-  const buttonBackgroundCheckedHovered = s.buttonBackgroundCheckedHovered;
 
   const buttonText = s.buttonText;
   const buttonTextHovered = s.buttonTextHovered;
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
index adbd686f9f493..09a462ec6a688 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Anchor.Example.tsx
@@ -9,9 +9,6 @@ import {
   IButtonProps,
   DefaultButton
 } from 'office-ui-fabric-react/lib/Button';
-import {
-  Label
-} from 'office-ui-fabric-react/lib/Label';
 
 export class ButtonAnchorExample extends React.Component<IButtonProps> {
   public render() {
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx
index 74b9d3be7d68e..bcd33745f2ad7 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Icon.Example.tsx
@@ -6,7 +6,6 @@ import {
   IButtonBasicExampleStyles
 } from './Button.Basic.Example.styles';
 import { IconButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
-import { Label } from 'office-ui-fabric-react/lib/Label';
 
 export class ButtonIconExample extends React.Component<IButtonProps> {
   public render() {
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
index 7962b3cd33805..fcc150fa3fd13 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Primary.Example.tsx
@@ -6,7 +6,6 @@ import {
   IButtonBasicExampleStyles
 } from './Button.Basic.Example.styles';
 import { PrimaryButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
-import { Label } from 'office-ui-fabric-react/lib/Label';
 
 export class ButtonPrimaryExample extends React.Component<IButtonProps> {
   public render() {
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx
index b0fc2ef829ce3..ceccbf0b51c1d 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.ScreenReader.Example.tsx
@@ -6,7 +6,6 @@ import {
   IButtonBasicExampleStyles
 } from './Button.Basic.Example.styles';
 import { PrimaryButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
-import { Label } from 'office-ui-fabric-react/lib/Label';
 
 export class ButtonScreenReaderExample extends React.Component<IButtonProps, {}> {
   public render() {
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
index a48b773f1dd60..8632716a9eb40 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
@@ -10,7 +10,6 @@ import {
   autobind
 } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton, PrimaryButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
-import { Label } from 'office-ui-fabric-react/lib/Label';
 
 export interface IButtonSwapExampleState {
   isPrimary: boolean;
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index 97a7fe703569e..7ef744d31917d 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -71,7 +71,6 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     workWeekDays: defaultWorkWeekDays
   };
 
-  private _root: HTMLElement;
   private _dayPicker: ICalendarDay;
   private _monthPicker: ICalendarMonth;
 
@@ -131,7 +130,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     const overlayedWithButton = showMonthPickerAsOverlay && showGoToToday;
 
     return (
-      <div className={ css(rootClass, styles.root) } ref={ this._resolveRef('_root') } role='application'>
+      <div className={ css(rootClass, styles.root) } role='application'>
         <div
           className={ css(
             'ms-DatePicker-picker ms-DatePicker-picker--opened ms-DatePicker-picker--focused',
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index a368a2564d5f8..728cb130cc7d8 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -9,7 +9,7 @@ import {
   getRTLSafeKeyCode
 } from '../../Utilities';
 import { ICalendarStrings, ICalendarIconStrings, ICalendarFormatDateCallbacks } from './Calendar.types';
-import { DayOfWeek, MonthOfYear, FirstWeekOfYear, DateRangeType } from '../../utilities/dateValues/DateValues';
+import { DayOfWeek, FirstWeekOfYear, DateRangeType } from '../../utilities/dateValues/DateValues';
 import { FocusZone } from '../../FocusZone';
 import { Icon } from '../../Icon';
 import {
@@ -25,7 +25,6 @@ import {
   getMonthStart,
   getMonthEnd
 } from '../../utilities/dateMath/DateMath';
-import TimeConstants from '../../utilities/dateValues/TimeConstants';
 
 import * as stylesImport from './Calendar.scss';
 const styles: any = stylesImport;
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx b/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
index 6e677f78e71ac..1bec31bb20b44 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.test.tsx
@@ -35,7 +35,6 @@ describe('Callout', () => {
   it('target id strings does not throw exception', () => {
 
     let threwException = false;
-    let exception;
     try {
       ReactTestUtils.renderIntoDocument<HTMLDivElement>(
         <div>
@@ -51,7 +50,6 @@ describe('Callout', () => {
         </div>
       );
     } catch (e) {
-      exception = e;
       threwException = true;
     }
 
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts b/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
index 21a210184f528..b238fa93c4152 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
@@ -1,7 +1,4 @@
-import * as React from 'react';
-import { Callout } from './Callout';
 import { IStyle, ITheme } from '../../Styling';
-import { CalloutContent } from './CalloutContent';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import {
   IPoint,
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
index 089d962c3184e..fe2192f173840 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
@@ -31,8 +31,7 @@ import {
 import { Popup } from '../../Popup';
 import { classNamesFunction } from '../../Utilities';
 import {
-  AnimationClassNames,
-  IRawStyle
+  AnimationClassNames
 } from '../../Styling';
 
 const ANIMATIONS: { [key: number]: string | undefined; } = {
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.styles.ts b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.styles.ts
index 943b2cce7cf3e..1c6721e6ca3c5 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.styles.ts
@@ -3,14 +3,8 @@ import {
   IRawStyle,
   focusClear
 } from '../../Styling';
-import {
-  ICalloutPositionedInfo,
-  RectangleEdge
-} from '../../utilities/positioning';
 import { ICalloutContentStyleProps, ICalloutContentStyles } from './Callout.types';
 
-const BEAK_ORIGIN_POSITION = { top: 0, left: 0 };
-
 function getBeakStyle(beakWidth?: number,
   beakStyle?: string): IRawStyle {
   let beakStyleWidth = beakWidth;
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.styles.ts b/packages/office-ui-fabric-react/src/components/Check/Check.styles.ts
index 5650abc8b2790..6cae0b2316206 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.styles.ts
@@ -1,11 +1,8 @@
 import { ICheckStyleProps, ICheckStyles } from './Check.types';
 import {
-  getTheme,
   HighContrastSelector,
   IStyle,
-  ITheme,
 } from '../../Styling';
-import { memoizeFunction } from '../../Utilities';
 
 export const getStyles = (
   props: ICheckStyleProps
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
index 8a398c119e228..f31a90d0b12bf 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
@@ -2,21 +2,16 @@ import * as React from 'react';
 import {
   BaseComponent,
   autobind,
-  getId,
-  memoize
+  getId
 } from '../../Utilities';
 import { Icon } from '../../Icon';
 import {
   ICheckbox,
   ICheckboxProps,
-  ICheckboxStyles
 } from './Checkbox.types';
 import {
   customizable
 } from '../../Utilities';
-import {
-  mergeStyles
-} from '../../Styling';
 import {
   ICheckboxClassNames,
   getClassNames
@@ -125,7 +120,7 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
       >
         <label className={ this._classNames.label } htmlFor={ this._id } >
           <div className={ this._classNames.checkbox }>
-            <Icon iconName='CheckMark' {...checkmarkIconProps} className={ this._classNames.checkmark } />
+            <Icon iconName='CheckMark' { ...checkmarkIconProps } className={ this._classNames.checkmark } />
           </div>
           { onRenderLabel(this.props, this._onRenderLabel) }
         </label>
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
index 306611a78ffe3..b92e108a7b1c1 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.Basic.Example.tsx
@@ -1,9 +1,5 @@
 import * as React from 'react';
-import {
-  Checkbox,
-  ICheckboxStyles,
-  ICheckboxProps
-} from 'office-ui-fabric-react/lib/Checkbox';
+import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 
 export interface ICheckboxBasicExampleState {
   isChecked: boolean;
@@ -13,16 +9,10 @@ export class CheckboxBasicExample extends React.Component<{}, ICheckboxBasicExam
   constructor(props: {}) {
     super(props);
 
-    this.state = {
-      isChecked: false
-    };
-
     this._onCheckboxChange = this._onCheckboxChange.bind(this);
   }
 
   public render() {
-    const { isChecked } = this.state;
-
     return (
       <div>
         <Checkbox
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
index d0a52f08d7946..0e635f4f66c38 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.test.tsx
@@ -35,7 +35,6 @@ describe('ChoiceGroup', () => {
       { key: '2', text: '2' },
       { key: '3', text: '3' }
     ];
-    let exception;
     let threwException = false;
     let choiceGroup;
     try {
@@ -47,7 +46,6 @@ describe('ChoiceGroup', () => {
         />
       );
     } catch (e) {
-      exception = e;
       threwException = true;
     }
     expect(threwException).toEqual(false);
@@ -84,7 +82,6 @@ describe('ChoiceGroup', () => {
       { key: '2', text: '2' },
       { key: '3', text: '3' }
     ];
-    let exception;
     let threwException = false;
     let choiceGroup;
     try {
@@ -96,7 +93,6 @@ describe('ChoiceGroup', () => {
         />
       );
     } catch (e) {
-      exception = e;
       threwException = true;
     }
     expect(threwException).toEqual(false);
@@ -115,7 +111,6 @@ describe('ChoiceGroup', () => {
       { key: '2', text: '2' },
       { key: '3', text: '3' }
     ];
-    let exception;
     let threwException = false;
     let choiceGroup;
     try {
@@ -128,7 +123,6 @@ describe('ChoiceGroup', () => {
         />
       );
     } catch (e) {
-      exception = e;
       threwException = true;
     }
     expect(threwException).toEqual(false);
@@ -185,10 +179,7 @@ describe('ChoiceGroup', () => {
   });
 
   it('extra <input> attributes appear in dom if specified', () => {
-    let _selectedItem;
-    const onChange = (ev: React.FormEvent<HTMLElement | HTMLInputElement>, item: IChoiceGroupOption | undefined): void => {
-      _selectedItem = item;
-    };
+    const onChange = (ev: React.FormEvent<HTMLElement | HTMLInputElement>, item: IChoiceGroupOption | undefined): void => undefined;
 
     const choiceGroup = ReactTestUtils.renderIntoDocument<ChoiceGroup>(
       <ChoiceGroup
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.tsx b/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.tsx
index 110771aa50b5f..066d7ad9c25d7 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.tsx
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.tsx
@@ -6,7 +6,6 @@ import {
 } from '../../../Utilities';
 import { IBeakProps } from './Beak.types';
 import { getStyles, IBeakStyles } from './Beak.styles';
-import { getComboBoxOptionClassNames } from 'src/components/ComboBox/ComboBox.classNames';
 import { IBeakStylesProps } from './Beak.types';
 
 export interface IBeakState {
@@ -29,8 +28,8 @@ export class Beak extends BaseComponent<IBeakProps, IBeakState> {
 
     const getClassNames = classNamesFunction<IBeakStylesProps, IBeakStyles>();
     const classNames = getClassNames(getStyles, {
-      left: this.props.left,
-      top: this.props.top,
+      left,
+      top,
       height: height + 'px',
       width: width + 'px'
     });
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.types.ts b/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.types.ts
index c1e19763100fb..487e5246e2e6e 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.types.ts
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import { Beak } from './Beak';
-import { IPositionInfo } from '../PositioningContainer/PositioningContainer.types';
 
 export interface IBeak { }
 
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.tsx b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.tsx
index 1fa1f79354b10..d56719486ccb0 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.tsx
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.tsx
@@ -82,7 +82,6 @@ export class Coachmark extends BaseComponent<ICoachmarkTypes, ICoachmarkState> {
    */
   private _entityInnerHostElement: HTMLElement;
   private _translateAnimationContainer: HTMLElement;
-  private _entityHost: HTMLElement;
   private _positioningContainer: PositioningContainer;
 
   constructor(props: ICoachmarkTypes) {
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.types.ts b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.types.ts
index 08cd9fc1a453a..feac3f0d16193 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.types.ts
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { Coachmark } from './Coachmark';
 import { ICoachmarkStyles, ICoachmarkStyleProps } from './Coachmark.styles';
 import { IPositioningContainerTypes } from './PositioningContainer/PositioningContainer.types';
-import { IPoint, IStyleFunction } from '../../Utilities';
+import { IStyleFunction } from '../../Utilities';
 
 export interface ICoachmark {
 }
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.tsx b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.tsx
index 802c0e6e6a811..e0288146067cc 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.tsx
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.tsx
@@ -21,7 +21,6 @@ import {
 } from '../../../Utilities';
 
 import {
-  getRelativePositions,
   IPositionProps,
   getMaxHeight,
   ICalloutPositon,
@@ -30,10 +29,6 @@ import {
   RectangleEdge
 } from 'office-ui-fabric-react/lib/utilities/positioning';
 
-import {
-  IPositionInfo
-} from './PositioningContainer.types';
-
 import { AnimationClassNames, mergeStyles } from '../../../Styling';
 
 const OFF_SCREEN_STYLE = { opacity: 0 };
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.types.ts b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.types.ts
index 605d2f81b629f..cd95dd470a953 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.types.ts
@@ -5,12 +5,7 @@ import {
   IPoint,
   IRectangle
 } from '../../../Utilities';
-import {
-  getRelativePositions,
-  IPositionProps,
-  getMaxHeight,
-  ICalloutPositon
-} from 'office-ui-fabric-react/lib/utilities/positioning';
+import { ICalloutPositon } from 'office-ui-fabric-react/lib/utilities/positioning';
 
 export interface IPositioningContainer {
 }
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx
index 13950e6a7d0eb..bb57e2d0a0cd4 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx
@@ -3,11 +3,9 @@ import { Coachmark } from '../Coachmark';
 import { TeachingBubbleContent } from 'office-ui-fabric-react/lib/TeachingBubble';
 import { ICalloutProps } from 'office-ui-fabric-react/lib/Callout';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
-import { IStyle, DefaultPalette } from '../../../Styling';
+import { IStyle } from '../../../Styling';
 import {
   BaseComponent,
-  assign,
-  autobind,
   classNamesFunction
 } from 'office-ui-fabric-react/lib/Utilities';
 
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index 0c0037c234294..99044b7079c7d 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -63,7 +63,6 @@ export const getOptionStyles = memoizeFunction((
   const ComboBoxOptionTextColorSelected = palette.black;
   const ComboBoxOptionTextColorDisabled = semanticColors.disabledText;
   const ComboBoxOptionBackgroundDisabled = semanticColors.bodyBackground;
-  const ComboBoxOptionBorderColorFocused = palette.neutralSecondary;
 
   const optionStyles: IComboBoxOptionStyles = {
     root: [
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
index 7d13111c2878e..c329c255558fe 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.test.tsx
@@ -45,7 +45,6 @@ describe('ComboBox', () => {
         label='testgroup'
         options={ DEFAULT_OPTIONS }
       />);
-    const comboBoxRoot = wrapper.find('.ms-ComboBox');
 
     expectMissing(wrapper, '.ms-ComboBox.is-disabled');
     expectOne(wrapper, '[data-is-interactable=true]');
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 694b280010a6a..5a7d0e8d1ae03 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -19,15 +19,12 @@ import {
   customizable,
   css
 } from '../../Utilities';
-import { SelectableOptionMenuItemType, ISelectableOption } from '../../utilities/selectableOption/SelectableOption.types';
+import { SelectableOptionMenuItemType } from '../../utilities/selectableOption/SelectableOption.types';
 import {
   getStyles,
   getOptionStyles,
   getCaretDownButtonStyles
 } from './ComboBox.styles';
-import {
-  IComboBoxStyles,
-} from './ComboBox.types';
 import {
   IComboBoxClassNames,
   getClassNames,
@@ -267,14 +264,13 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       onRenderItem = this._onRenderItem,
       onRenderOption = this._onRenderOption,
       allowFreeform,
-      autoComplete,
       buttonIconProps,
       isButtonAriaHidden = true,
       styles: customStyles,
       theme,
       title
     } = this.props;
-    const { isOpen, selectedIndex, focused, suggestedDisplayValue } = this.state;
+    const { isOpen, focused, suggestedDisplayValue } = this.state;
     this._currentVisibleValue = this._getVisibleValue();
 
     const divProps = getNativeProps(this.props, divProperties);
@@ -347,7 +343,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
             styles={ this._getCaretButtonStyles() }
             role='presentation'
             aria-hidden={ isButtonAriaHidden }
-            data-is-focusable={false}
+            data-is-focusable={ false }
             tabIndex={ -1 }
             onClick={ this._onComboBoxClick }
             iconProps={ buttonIconProps }
@@ -1229,11 +1225,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * @param searchDirection - the direction to search
    */
   private _setPendingInfoFromIndexAndDirection(index: number, searchDirection: SearchDirection) {
-    const {
-      isOpen,
-      selectedIndex,
-      currentOptions
-    } = this.state;
+    const { currentOptions } = this.state;
 
     index = this._getNextSelectableIndex(index, searchDirection);
     if (this._indexWithinBounds(currentOptions, index)) {
@@ -1264,7 +1256,6 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     } = this.props;
     const {
       isOpen,
-      currentPendingValueValidIndex,
       currentOptions,
       currentPendingValueValidIndexOnHover
     } = this.state;
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx
index 64929fc3ada78..c48cb455546b2 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx
@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { autobind, BaseComponent, customizable } from '../../Utilities';
+import { autobind, BaseComponent } from '../../Utilities';
 import { ComboBox } from './ComboBox';
 import { IComboBoxProps, IComboBox } from './ComboBox.types';
 import { List } from '../../List';
-import { SelectableOptionMenuItemType, ISelectableOption } from '../../utilities/selectableOption/SelectableOption.types';
+import { ISelectableOption } from '../../utilities/selectableOption/SelectableOption.types';
 
 export class VirtualizedComboBox extends BaseComponent<IComboBoxProps, {}> implements IComboBox {
   /** The combo box element */
@@ -29,7 +29,7 @@ export class VirtualizedComboBox extends BaseComponent<IComboBoxProps, {}> imple
   public render(): JSX.Element {
     return (
       <ComboBox
-        {...this.props}
+        { ...this.props }
         componentRef={ this._resolveRef('_comboBox') }
         onRenderList={ this._onRenderList }
         onScrollToItem={ this._onScrollToItem }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
index ea1c7d5a71fb2..d1cb4b9ac5bcc 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import {
   ComboBox,
-  IComboBoxProps,
   IComboBoxOption,
   VirtualizedComboBox
 } from 'office-ui-fabric-react/lib/ComboBox';
@@ -81,7 +80,7 @@ export class ComboBoxBasicExample extends React.Component<{}, {
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
           onMenuOpen={ () => console.log('ComboBox menu opened') }
-          // tslint:enable:jsx-no-lambda
+        // tslint:enable:jsx-no-lambda
         />
 
         <PrimaryButton
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
index 9909db6f527bf..d568a25ea8df2 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
@@ -1,6 +1,5 @@
 import { memoizeFunction } from '../../Utilities';
 import { ITheme, mergeStyleSets } from '../../Styling';
-import { IContextualMenuStyles, IMenuItemStyles } from './ContextualMenu.types';
 import { getStyles as getContextualMenuStyles, getMenuItemStyles } from './ContextualMenu.styles';
 import { IVerticalDividerClassNames } from '../Divider/VerticalDivider.types';
 import { getDividerClassNames } from '../Divider/VerticalDivider.classNames';
@@ -29,8 +28,6 @@ export interface IMenuItemClassNames {
 }
 
 export const getSplitButtonVerticalDividerClassNames = memoizeFunction((theme: ITheme): IVerticalDividerClassNames => {
-  const { semanticColors } = theme;
-  const ContextualMenuDividerColor = semanticColors.bodyDivider;
   return mergeStyleSets(getDividerClassNames(theme), {
     divider: {
       height: 16,
@@ -86,8 +83,6 @@ export const getItemClassNames = memoizeFunction((
   subMenuClassName?: string,
 ): IMenuItemClassNames => {
 
-  const { semanticColors } = theme;
-  const ContextualMenuIconColor = semanticColors.menuIcon;
   const styles = getMenuItemStyles(theme);
 
   return mergeStyleSets({
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
index c9861234dc780..b459509464b6a 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
@@ -11,7 +11,6 @@ import { FocusZoneDirection } from '../../FocusZone';
 import { ContextualMenu, canAnyMenuItemsCheck } from './ContextualMenu';
 import { IContextualMenuItem, ContextualMenuItemType } from './ContextualMenu.types';
 import { LayerBase as Layer } from '../Layer/Layer.base';
-import { mount } from 'enzyme';
 
 describe('ContextualMenu', () => {
 
@@ -408,7 +407,7 @@ describe('ContextualMenu', () => {
       }
     ];
 
-    const foo = ReactTestUtils.renderIntoDocument<ContextualMenu>(
+    ReactTestUtils.renderIntoDocument<ContextualMenu>(
       <ContextualMenu
         items={ items }
       />
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 37fb495cd1b4b..486c476b21bad 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -31,15 +31,11 @@ import {
 import { hasSubmenu, getIsChecked } from '../../utilities/contextualMenu/index';
 import { withResponsiveMode, ResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
 import { Callout } from '../../Callout';
-import {
-  Icon,
-  IIconProps
-} from '../../Icon';
+import { IIconProps } from '../../Icon';
 import {
   VerticalDivider
 } from '../../Divider';
 import { ContextualMenuItem } from './ContextualMenuItem';
-import { IContextualMenuItemProps } from './ContextualMenuItem.types';
 
 export interface IContextualMenuState {
   expandedMenuItemKey?: string;
@@ -187,7 +183,6 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       coverTarget,
       ariaLabel,
       doNotLayer,
-      arrowDirection,
       target,
       bounds,
       useTargetWidth,
@@ -195,7 +190,6 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       directionalHintFixed,
       shouldFocusOnMount,
       title,
-      styles: customStyles,
       theme,
       calloutProps,
       onRenderSubMenu = this._onRenderSubMenu,
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
index 5036434553dc9..e68d91bf281f2 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
@@ -15,7 +15,6 @@ import { IWithResponsiveModeState } from '../../utilities/decorators/withRespons
 import { IContextualMenuClassNames, IMenuItemClassNames } from './ContextualMenu.classNames';
 export { DirectionalHint } from '../../common/DirectionalHint';
 import { IVerticalDividerClassNames } from '../Divider/VerticalDivider.types';
-import { ContextualMenuItem } from './ContextualMenuItem';
 import { IContextualMenuItemProps } from './ContextualMenuItem.types';
 
 export enum ContextualMenuItemType {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.tsx
index e3e98c3f872ea..667d14bae1540 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.tsx
@@ -3,7 +3,7 @@ import { hasSubmenu, getIsChecked } from '../../utilities/contextualMenu/index';
 import { IContextualMenuItem } from './ContextualMenu.types';
 import { IMenuItemClassNames } from './ContextualMenu.classNames';
 import { getRTL } from '../../Utilities';
-import { Icon, IIconProps } from '../../Icon';
+import { Icon } from '../../Icon';
 import { IContextualMenuItemProps } from './ContextualMenuItem.types';
 
 const renderItemIcon = ({ hasIcons, item, classNames }: IContextualMenuItemProps) => {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.types.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.types.ts
index 0aaa86b85a9a5..189a54047b7d5 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.types.ts
@@ -1,4 +1,3 @@
-import { ContextualMenuItem } from './ContextualMenuItem';
 import { IContextualMenuItem } from './ContextualMenu.types';
 import { IMenuItemClassNames } from './ContextualMenu.classNames';
 
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
index 36bf5a362a977..eee454bb403db 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
@@ -22,7 +22,6 @@ const ContextualMenuBasicExampleCode = require('!raw-loader!office-ui-fabric-rea
 const ContextualMenuIconExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.Example.tsx') as string;
 const ContextualMenuSectionExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx') as string;
 const ContextualMenuSubmenuExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Submenu.Example.tsx') as string;
-const ContextualMenuCustomizationWithNoWrapExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomizationWithNoWrap.Example.tsx') as string;
 const ContextualMenuCheckmarksExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx') as string;
 const ContextualMenuDirectionalExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx') as string;
 const ContextualMenuCustomizationExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx') as string;
@@ -148,7 +147,7 @@ export class ContextualMenuPage extends React.Component<IComponentDemoPageProps,
         isHeaderVisible={ this.props.isHeaderVisible }
         componentStatus={
           <ComponentStatus
-            {...ContextualMenuStatus}
+            { ...ContextualMenuStatus }
           />
         }
       />
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomMenuItem.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomMenuItem.Example.tsx
index a0c9fa9cbcb15..583e6a1b07f03 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomMenuItem.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomMenuItem.Example.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { ContextualMenuItemType, IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
 import { IContextualMenuItemProps } from 'office-ui-fabric-react/lib/ContextualMenu';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import './ContextualMenuExample.scss';
@@ -48,7 +48,7 @@ export class ContextualMenuWithCustomMenuItemExample extends React.Component {
                 disabled: true
               }
             ],
-            contextualMenuItemAs: (props: IContextualMenuItemProps) => <div>Custom rendered {props.item.name}</div>
+            contextualMenuItemAs: (props: IContextualMenuItemProps) => <div>Custom rendered { props.item.name }</div>
           } }
         />
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
index cdf6e3742ce65..f67e9544e921c 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { DirectionalHint, ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
-import { DefaultButton, IconButton, IButton } from 'office-ui-fabric-react/lib/Button';
+import { DefaultButton, IconButton } from 'office-ui-fabric-react/lib/Button';
 import { FocusZoneDirection } from 'office-ui-fabric-react/lib/FocusZone';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import './ContextualMenuExample.scss';
@@ -17,169 +17,169 @@ export class ContextualMenuCustomizationExample extends React.Component<{}, {}>
             directionalHint: DirectionalHint.bottomLeftEdge,
             className: 'ms-ContextualMenu-customizationExample',
             items:
-            [
-              {
-                key: 'newItem',
-                name: 'New'
-              },
-              {
-                key: 'upload',
-                name: 'Upload'
-              },
-              {
-                key: 'divider_1',
-                itemType: ContextualMenuItemType.Divider
-              },
-              {
-                key: 'charm',
-                name: 'Charm',
-                className: 'Charm-List',
-                subMenuProps: {
-                  arrowDirection: FocusZoneDirection.bidirectional,
-                  items: [
-                    {
-                      key: 'none',
-                      name: 'None'
-                    },
-                    {
-                      key: 'bulb',
-                      name: 'Lightbulb',
-                      onRender: this._renderCharmMenuItem,
-                      className: 'ms-ContextualMenu-customizationExample-item'
-                    },
-                    {
-                      key: 'run',
-                      name: 'Running',
-                      onRender: this._renderCharmMenuItem,
-                      className: 'ms-ContextualMenu-customizationExample-item'
-                    },
-                    {
-                      key: 'plane',
-                      name: 'Airplane',
-                      onRender: this._renderCharmMenuItem,
-                      className: 'ms-ContextualMenu-customizationExample-item'
-                    },
-                    {
-                      key: 'page',
-                      name: 'Page',
-                      onRender: this._renderCharmMenuItem,
-                      className: 'ms-ContextualMenu-customizationExample-item'
-                    },
-                    {
-                      key: 'cake',
-                      name: 'Cake',
-                      onRender: this._renderCharmMenuItem,
-                      className: 'ms-ContextualMenu-customizationExample-item'
-                    },
-                    {
-                      key: 'soccer',
-                      name: 'Soccer',
-                      onRender: this._renderCharmMenuItem,
-                      className: 'ms-ContextualMenu-customizationExample-item'
-                    },
-                    {
-                      key: 'home',
-                      name: 'Home',
-                      onRender: this._renderCharmMenuItem,
-                      className: 'ms-ContextualMenu-customizationExample-item'
-                    },
-                    {
-                      key: 'emoji',
-                      name: 'Emoji2',
-                      onRender: this._renderCharmMenuItem,
-                      className: 'ms-ContextualMenu-customizationExample-item'
-                    },
-                    {
-                      key: 'work',
-                      name: 'Work',
-                      onRender: this._renderCharmMenuItem,
-                      className: 'ms-ContextualMenu-customizationExample-item'
-                    },
-                    {
-                      key: 'coffee',
-                      name: 'Coffee',
-                      onRender: this._renderCharmMenuItem,
-                      className: 'ms-ContextualMenu-customizationExample-item'
-                    },
-                    {
-                      key: 'people',
-                      name: 'People',
-                      onRender: this._renderCharmMenuItem,
-                      className: 'ms-ContextualMenu-customizationExample-item'
-                    },
-                    {
-                      key: 'stopwatch',
-                      name: 'Stopwatch',
-                      onRender: this._renderCharmMenuItem,
-                      className: 'ms-ContextualMenu-customizationExample-item'
-                    },
-                    {
-                      key: 'music',
-                      name: 'MusicInCollectionFill',
-                      onRender: this._renderCharmMenuItem,
-                      className: 'ms-ContextualMenu-customizationExample-item'
-                    },
-                    {
-                      key: 'lock',
-                      name: 'Lock',
-                      onRender: this._renderCharmMenuItem,
-                      className: 'ms-ContextualMenu-customizationExample-item'
-                    }
-                  ]
+              [
+                {
+                  key: 'newItem',
+                  name: 'New'
                 },
-              },
-              {
-                key: 'categories',
-                name: 'Categorize',
-                subMenuProps: {
-                  items: [
-                    {
-                      key: 'categories',
-                      name: 'categories',
-                      categoryList: [
-                        {
-                          name: 'Personal',
-                          color: 'yellow'
-                        },
-                        {
-                          name: 'Work',
-                          color: 'green'
-                        },
-                        {
-                          name: 'Birthday',
-                          color: 'blue'
-                        },
-                        {
-                          name: 'Spam',
-                          color: 'grey'
-                        },
-                        {
-                          name: 'Urgent',
-                          color: 'red'
-                        },
-                        {
-                          name: 'Hobbies',
-                          color: 'black'
-                        },
-                      ],
-                      onRender: this._renderCategoriesList
-                    },
-                    {
-                      key: 'divider_1',
-                      itemType: ContextualMenuItemType.Divider
-                    },
-                    {
-                      key: 'clear',
-                      name: 'Clear categories'
-                    },
-                    {
-                      key: 'manage',
-                      name: 'Manage categories'
-                    }
-                  ]
+                {
+                  key: 'upload',
+                  name: 'Upload'
                 },
-              }
-            ]
+                {
+                  key: 'divider_1',
+                  itemType: ContextualMenuItemType.Divider
+                },
+                {
+                  key: 'charm',
+                  name: 'Charm',
+                  className: 'Charm-List',
+                  subMenuProps: {
+                    arrowDirection: FocusZoneDirection.bidirectional,
+                    items: [
+                      {
+                        key: 'none',
+                        name: 'None'
+                      },
+                      {
+                        key: 'bulb',
+                        name: 'Lightbulb',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'run',
+                        name: 'Running',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'plane',
+                        name: 'Airplane',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'page',
+                        name: 'Page',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'cake',
+                        name: 'Cake',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'soccer',
+                        name: 'Soccer',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'home',
+                        name: 'Home',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'emoji',
+                        name: 'Emoji2',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'work',
+                        name: 'Work',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'coffee',
+                        name: 'Coffee',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'people',
+                        name: 'People',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'stopwatch',
+                        name: 'Stopwatch',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'music',
+                        name: 'MusicInCollectionFill',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      },
+                      {
+                        key: 'lock',
+                        name: 'Lock',
+                        onRender: this._renderCharmMenuItem,
+                        className: 'ms-ContextualMenu-customizationExample-item'
+                      }
+                    ]
+                  },
+                },
+                {
+                  key: 'categories',
+                  name: 'Categorize',
+                  subMenuProps: {
+                    items: [
+                      {
+                        key: 'categories',
+                        name: 'categories',
+                        categoryList: [
+                          {
+                            name: 'Personal',
+                            color: 'yellow'
+                          },
+                          {
+                            name: 'Work',
+                            color: 'green'
+                          },
+                          {
+                            name: 'Birthday',
+                            color: 'blue'
+                          },
+                          {
+                            name: 'Spam',
+                            color: 'grey'
+                          },
+                          {
+                            name: 'Urgent',
+                            color: 'red'
+                          },
+                          {
+                            name: 'Hobbies',
+                            color: 'black'
+                          },
+                        ],
+                        onRender: this._renderCategoriesList
+                      },
+                      {
+                        key: 'divider_1',
+                        itemType: ContextualMenuItemType.Divider
+                      },
+                      {
+                        key: 'clear',
+                        name: 'Clear categories'
+                      },
+                      {
+                        key: 'manage',
+                        name: 'Manage categories'
+                      }
+                    ]
+                  },
+                }
+              ]
           }
         }
 
@@ -204,7 +204,7 @@ export class ContextualMenuCustomizationExample extends React.Component<{}, {}>
       <ul className='ms-ContextualMenu-customizationExample-categoriesList'>
         <li className='ms-ContextualMenu-item'>
           { item.categoryList.map((category: any) =>
-            <button className='ms-ContextualMenu-link' role='menuitem' key={category.name}>
+            <button className='ms-ContextualMenu-link' role='menuitem' key={ category.name }>
               <div>
                 <span
                   className='ms-ContextualMenu-icon ms-ContextualMenu-customizationExample-categorySwatch'
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomizationWithNoWrap.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomizationWithNoWrap.Example.tsx
index b5f6f22705843..491d1dbf4f7cf 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomizationWithNoWrap.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomizationWithNoWrap.Example.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { DirectionalHint, ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
-import { DefaultButton, IconButton, IButton } from 'office-ui-fabric-react/lib/Button';
+import { DefaultButton, IconButton } from 'office-ui-fabric-react/lib/Button';
 import { FocusZoneDirection } from 'office-ui-fabric-react/lib/FocusZone';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import './ContextualMenuExample.scss';
@@ -200,7 +200,7 @@ export class ContextualMenuCustomizationWithNoWrapExample extends React.Componen
   private _renderCharmMenuItem(item: any, dismissMenu: () => void) {
     return (
       <IconButton
-        {...item}
+        { ...item }
         iconProps={ { iconName: item.name } }
         className='ms-ContextualMenu-customizationExample-icon ms-ContextualMenu-link'
         data-is-focusable={ true }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
index e9b43c7f85ad7..f1c7ce29df70f 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
@@ -3,7 +3,6 @@ import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { DirectionalHint, ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
 import { Dropdown, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
-import { TextField } from 'office-ui-fabric-react/lib/TextField';
 import { autobind, getRTL } from 'office-ui-fabric-react/lib/Utilities';
 import './ContextualMenuExample.scss';
 import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.ScrollBar.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.ScrollBar.Example.tsx
index 177d82852559b..c78318860195d 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.ScrollBar.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.ScrollBar.Example.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { DirectionalHint, ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
+import { DirectionalHint } from 'office-ui-fabric-react/lib/ContextualMenu';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import './ContextualMenuExample.scss';
 
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 80d6ae4c814f3..8cedfbe0b5223 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -121,12 +121,10 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     dateTimeFormatter: undefined
   };
 
-  private _root: HTMLElement;
   private _calendar: ICalendar;
   private _datePickerDiv: HTMLDivElement;
   private _textField: ITextField;
   private _preventFocusOpeningPicker: boolean;
-  private _focusOnSelectedDateOnUpdate: boolean;
 
   constructor(props: IDatePickerProps) {
     super(props);
@@ -207,7 +205,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     const { isDatePickerShown, formattedDate, selectedDate, errorMessage } = this.state;
 
     return (
-      <div className={ css('ms-DatePicker', styles.root, className) } ref={ this._resolveRef('_root') }>
+      <div className={ css('ms-DatePicker', styles.root, className) }>
         { label && (
           <Label required={ isRequired }>{ label }</Label>
         ) }
@@ -397,7 +395,6 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
   private _showDatePickerPopup() {
     if (!this.state.isDatePickerShown) {
       this._preventFocusOpeningPicker = true;
-      this._focusOnSelectedDateOnUpdate = true;
       this.setState({
         isDatePickerShown: true,
         errorMessage: ''
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.test.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.test.tsx
index 0c4c88ed52644..8293ee25684f1 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.test.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import * as renderer from 'react-test-renderer';
-import * as ReactTestUtils from 'react-dom/test-utils';
 import { mount } from 'enzyme';
 
 import {
@@ -49,7 +48,7 @@ describe('DetailsList', () => {
     jest.useFakeTimers();
 
     let component: any;
-    const wrapper = mount(
+    mount(
       <DetailsList
         items={ mockItems(5) }
         // tslint:disable-next-line:jsx-no-lambda
@@ -84,7 +83,7 @@ describe('DetailsList', () => {
     jest.useFakeTimers();
 
     let component: any;
-    const wrapper = mount(
+    mount(
       <DetailsList
         items={ mockItems(5) }
         // tslint:disable-next-line:jsx-no-lambda
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 7e0dc127b7b71..73103e877da0c 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -869,7 +869,6 @@ export function buildColumns(
 
   if (items && items.length) {
     const firstItem = items[0];
-    let isFirstColumn = true;
 
     for (const propName in firstItem) {
       if (firstItem.hasOwnProperty(propName)) {
@@ -889,8 +888,6 @@ export function buildColumns(
           onColumnClick: onColumnClick,
           isGrouped: groupedColumnKey === propName
         });
-
-        isFirstColumn = false;
       }
     }
   }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index a64dafd6a7a6e..38ba946ced076 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -77,7 +77,6 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
   private _root: HTMLElement | undefined;
   private _cellMeasurer: HTMLElement;
   private _focusZone: IFocusZone;
-  private _hasSetFocus: boolean;
   private _droppingClassNames: string;
   private _hasMounted: boolean;
   private _dragDropSubscription: IDisposable;
@@ -92,8 +91,6 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
       groupNestingDepth: props.groupNestingDepth
     };
 
-    this._hasSetFocus = false;
-
     this._droppingClassNames = '';
 
     this._updateDroppingState = this._updateDroppingState.bind(this);
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.styles.ts b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.styles.ts
index c5536f6e55f5f..9e56e1011cae4 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.styles.ts
@@ -1,25 +1,14 @@
 import { IDialogStyleProps, IDialogStyles } from './Dialog.types';
-import {
-  IStyle,
-  ITheme,
-} from '../../Styling';
 
 export const getStyles = (
   props: IDialogStyleProps
 ): IDialogStyles => {
-  const {
-    className,
-    theme,
-  } = props;
-
-  const { palette, semanticColors } = theme;
 
   return ({
     root: [
       'ms-Dialog',
       {
         // Insert css properties
-
       }
     ],
 
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.styles.ts b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.styles.ts
index ae71671428f36..45bb22f518319 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.styles.ts
@@ -1,18 +1,8 @@
 import { IDialogContentStyleProps, IDialogContentStyles } from './DialogContent.types';
-import {
-  IStyle,
-  ITheme,
-} from '../../Styling';
 
 export const getStyles = (
   props: IDialogContentStyleProps
 ): IDialogContentStyles => {
-  const {
-    className,
-    theme,
-  } = props;
-
-  const { palette, semanticColors } = theme;
 
   return ({
     content: [
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.styles.ts b/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.styles.ts
index b7e339e359d90..c530d830a6579 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.styles.ts
@@ -1,19 +1,8 @@
 import { IDialogFooterStyleProps, IDialogFooterStyles } from './DialogFooter.types';
-import {
-  IStyle,
-  ITheme,
-} from '../../Styling';
 
 export const getStyles = (
   props: IDialogFooterStyleProps
 ): IDialogFooterStyles => {
-  const {
-    className,
-    theme,
-  } = props;
-
-  const { palette, semanticColors } = theme;
-
   return ({
     actions: [
       'ms-Dialog-actions',
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
index 9b54c8982a152..6c94d7c894e3a 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.test.tsx
@@ -4,7 +4,7 @@ import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
 import * as ReactTestUtils from 'react-dom/test-utils';
 import * as renderer from 'react-test-renderer';
-import { mount, shallow } from 'enzyme';
+import { shallow } from 'enzyme';
 
 import {
   KeyCodes,
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 440bc78991b73..0e09aeebe1c00 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -47,7 +47,6 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
 
   private static Option = 'option';
 
-  private _root: HTMLElement;
   private _host: HTMLDivElement;
   private _focusZone: FocusZone;
   private _dropDown: HTMLDivElement;
@@ -150,7 +149,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     }
 
     return (
-      <div ref={ this._resolveRef('_root') } className={ css('ms-Dropdown-container') }>
+      <div className={ css('ms-Dropdown-container') }>
         { label && (
           <Label className={ css('ms-Dropdown-label') } id={ id + '-label' } htmlFor={ id } ref={ this._resolveRef('_dropdownLabel') } required={ required }>{ label }</Label>
         ) }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Error.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Error.Example.tsx
index dcaca7dab6dcf..1801d9b39959c 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Error.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Error.Example.tsx
@@ -1,12 +1,9 @@
 import * as React from 'react';
-import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
-import { Dropdown, IDropdown, DropdownMenuItemType, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
-import { autobind, BaseComponent } from '../../../Utilities';
+import { Dropdown } from 'office-ui-fabric-react/lib/Dropdown';
+import { BaseComponent } from '../../../Utilities';
 import './Dropdown.Basic.Example.scss';
 
 export class DropdownErrorExample extends BaseComponent<{}, {}> {
-  private _basicDropdown: IDropdown;
-
   constructor(props: {}) {
     super(props);
   }
@@ -28,7 +25,6 @@ export class DropdownErrorExample extends BaseComponent<{}, {}> {
               { key: 'E', text: 'Option e' },
             ]
           }
-          componentRef={ this._resolveRef('_basicDropdown') }
           errorMessage='Error message'
         />
       </div>
diff --git a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.classNames.ts b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.classNames.ts
index d9aa02390c9a7..a3990ad9d7db3 100644
--- a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.classNames.ts
@@ -4,7 +4,6 @@ import {
 } from '../../Utilities';
 import {
   ITheme,
-  IStyle,
   mergeStyles
 } from '../../Styling';
 
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
index 82163d85e52c7..628414b8fa98b 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
 import * as renderer from 'react-test-renderer';
-import { mount, shallow, ReactWrapper } from 'enzyme';
+import { mount, shallow } from 'enzyme';
 import { setRTL } from '../../Utilities';
 import { Facepile } from './Facepile';
 import { IFacepilePersona, OverflowButtonType } from './Facepile.types';
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
index f6ab0ce814278..2270fc6e2b400 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
@@ -46,10 +46,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
 
   }
   public render(): JSX.Element {
-    let {
-      overflowButtonProps,
-      overflowButtonType,
-    } = this.props;
+    let { overflowButtonProps } = this.props;
     const {
       chevronButtonProps,
       maxDisplayablePersonas,
@@ -62,7 +59,6 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
     // Added for deprecating chevronButtonProps.  Can remove after v1.0
     if (chevronButtonProps && !overflowButtonProps) {
       overflowButtonProps = chevronButtonProps;
-      overflowButtonType = OverflowButtonType.downArrow;
     }
 
     return (
@@ -112,7 +108,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
         initialsColor={ persona.initialsColor }
         primaryText={ persona.personaName }
         size={ personaSize }
-        {...(getPersonaProps ? getPersonaProps(persona) : null) }
+        { ...(getPersonaProps ? getPersonaProps(persona) : null) }
       />
     );
   }
@@ -175,7 +171,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
 
     return (
       <FacepileButton
-        { ...overflowButtonProps}
+        { ...overflowButtonProps }
         ariaDescription={ personaNames }
         className={ css('ms-Facepile-descriptiveOverflowButton', 'ms-Facepile-itemButton', styles.descriptiveOverflowButton, styles.itemButton) }
       >
@@ -195,7 +191,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
 
     return (
       <FacepileButton
-        {...overflowButtonProps}
+        { ...overflowButtonProps }
         className={ css('ms-Facepile-overflowButton', 'ms-Facepile-itemButton', styles.overflowButton, styles.itemButton) }
       >
         <PersonaCoin
@@ -212,7 +208,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
 
     return (
       <FacepileButton
-        {...addButtonProps}
+        { ...addButtonProps }
         className={ css('ms-Facepile-addButton', 'ms-Facepile-itemButton', styles.itemButton, styles.addButton) }
       >
         <PersonaCoin
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
index b2d17481e63ef..9ba0a6cc8551e 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
@@ -11,7 +11,6 @@ import { FocusZoneDirection, FocusZoneTabbableElements } from './FocusZone.types
 
 describe('FocusZone', () => {
   let lastFocusedElement: HTMLElement | undefined;
-  let tabKeyHit: number;
   function _onFocus(ev: any) {
     lastFocusedElement = ev.target;
   }
@@ -44,7 +43,6 @@ describe('FocusZone', () => {
 
   beforeEach(() => {
     lastFocusedElement = undefined;
-    tabKeyHit = 0;
   });
 
   it('can use arrows vertically', () => {
@@ -1091,7 +1089,7 @@ describe('FocusZone', () => {
     const tabDownListener = jest.fn();
     const component = ReactTestUtils.renderIntoDocument(
       <div { ...{ onFocusCapture: _onFocus, onKeyDown: tabDownListener } }>
-        <FocusZone {...{ handleTabKey: FocusZoneTabbableElements.all, isCircularNavigation: true }}>
+        <FocusZone { ...{ handleTabKey: FocusZoneTabbableElements.all, isCircularNavigation: true } }>
           <button className='a'>a</button>
           <button className='b'>b</button>
           <button className='c'>c</button>
@@ -1208,7 +1206,7 @@ describe('FocusZone', () => {
     const tabDownListener = jest.fn();
     const component = ReactTestUtils.renderIntoDocument(
       <div { ...{ onFocusCapture: _onFocus, onKeyDown: tabDownListener } }>
-        <FocusZone {...{ handleTabKey: FocusZoneTabbableElements.inputOnly, isCircularNavigation: false }}>
+        <FocusZone { ...{ handleTabKey: FocusZoneTabbableElements.inputOnly, isCircularNavigation: false } }>
           <input type='text' className='a' />
           <button className='b'>b</button>
         </FocusZone>
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 99b028c149f56..8047034318a58 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -20,7 +20,6 @@ import {
   getParent,
   getPreviousElement,
   getRTL,
-  getWindow,
   isElementFocusZone,
   isElementFocusSubZone,
   isElementTabbable,
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
index 3ce273b486904..e50e4fa1810ce 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
@@ -36,7 +36,7 @@ import {
 import { assign, css } from '../../Utilities';
 import { IViewport } from '../../utilities/decorators/withViewport';
 import * as stylesImport from './GroupedList.scss';
-import { IList, IListProps } from '../List/index';
+import { IListProps } from '../List/index';
 
 const styles: any = stylesImport;
 
@@ -127,9 +127,6 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
   private _root: HTMLElement;
   private _list: List;
 
-  private _subGroups: {
-    [key: string]: GroupedListSection;
-  };
   private _dragDropSubscription: IDisposable;
 
   constructor(props: IGroupedListSectionProps) {
@@ -137,7 +134,6 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
 
     const { selection, group } = props;
 
-    this._subGroups = {};
     this.state = {
       isDropping: false,
       isSelected: (selection && group) ? selection.isRangeSelected(group.startIndex, group.count) : false
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx
index 0d715d1af9ea0..ab54727668f33 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/examples/GroupedList.Custom.Example.tsx
@@ -4,7 +4,7 @@ import {
   IGroup,
   IGroupDividerProps
 } from 'office-ui-fabric-react/lib/components/GroupedList/index';
-import { css, autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { css } from 'office-ui-fabric-react/lib/Utilities';
 import { Link } from 'office-ui-fabric-react/lib/Link';
 import { createListItems, createGroups } from '@uifabric/example-app-base';
 import { FontClassNames } from '../../../Styling';
@@ -14,8 +14,6 @@ let _items: any[];
 let _groups: IGroup[];
 
 export class GroupedListCustomExample extends React.Component {
-  private _groupedList: GroupedList;
-
   constructor(props: {}) {
     super(props);
 
@@ -26,7 +24,6 @@ export class GroupedListCustomExample extends React.Component {
   public render() {
     return (
       <GroupedList
-        ref={ this._createGroupedListRef }
         items={ _items }
         onRenderCell={ this._onRenderCell }
         groupProps={
@@ -40,11 +37,6 @@ export class GroupedListCustomExample extends React.Component {
     );
   }
 
-  @autobind
-  private _createGroupedListRef(groupedList: GroupedList) {
-    this._groupedList = groupedList;
-  }
-
   private _onRenderCell(nestingDepth: number, item: any, itemIndex: number) {
     return (
       <div data-selection-index={ itemIndex }>
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
index fe3be1880b014..49cda04fc7e26 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
@@ -110,11 +110,6 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
     }
   }
 
-  @autobind
-  private _onDismiss(ev: MouseEvent): void {
-    this.props.onLeave && this.props.onLeave(ev);
-  }
-
   @autobind
   private _onRenderCompactCard(): JSX.Element {
     return (
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
index 463ddd1806dcc..7eaafff26e288 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
@@ -18,7 +18,6 @@ import { IHoverCardProps, IHoverCardStyles } from './HoverCard.types';
 import { ExpandingCard } from './ExpandingCard';
 import { ExpandingCardMode, OpenCardMode } from './ExpandingCard.types';
 import { getStyles } from './HoverCard.styles';
-import { FocusTrapZone } from 'office-ui-fabric-react/lib/FocusTrapZone';
 
 export interface IHoverCardState {
   isHoverCardVisible: boolean;
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
index c85f56289bd8f..278e099688bf6 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.tsx
@@ -10,7 +10,7 @@ import {
   htmlElementProperties,
   BaseComponent
 } from '../../Utilities';
-import { getIcon, IIconRecord } from '../../Styling';
+import { getIcon } from '../../Styling';
 import { getClassNames } from './Icon.classNames';
 
 export interface IIconState {
@@ -27,12 +27,12 @@ export class Icon extends BaseComponent<IIconProps, IIconState> {
 
   public render() {
     const {
-    ariaLabel,
+      ariaLabel,
       className,
       styles,
       iconName,
       imageErrorAs,
-   } = this.props;
+    } = this.props;
     const classNames = getClassNames(
       styles
     );
@@ -55,7 +55,7 @@ export class Icon extends BaseComponent<IIconProps, IIconState> {
       const ImageType = imageLoadError && imageErrorAs || Image;
       return (
         <div
-          {...containerProps}
+          { ...containerProps }
           className={
             css(
               containerClassName,
@@ -68,7 +68,7 @@ export class Icon extends BaseComponent<IIconProps, IIconState> {
     } else if (typeof iconName === 'string' && iconName.length === 0) {
       return (
         <i
-          {...containerProps}
+          { ...containerProps }
           { ...getNativeProps(this.props, htmlElementProperties) }
           className={
             css(
@@ -88,7 +88,7 @@ export class Icon extends BaseComponent<IIconProps, IIconState> {
 
       return (
         <i
-          {...containerProps}
+          { ...containerProps }
           { ...getNativeProps(this.props, htmlElementProperties) }
           className={
             css(
diff --git a/packages/office-ui-fabric-react/src/components/Icon/Icon.types.ts b/packages/office-ui-fabric-react/src/components/Icon/Icon.types.ts
index 378e791046a08..b91d92aa3fb18 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/Icon.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Icon/Icon.types.ts
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { IImageProps } from '../Image/Image.types';
 import { IStyle } from '../../Styling';
-import { Icon } from './Icon';
 import { IBaseProps } from '../../Utilities';
 
 // Please keep alphabetized
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.styles.ts b/packages/office-ui-fabric-react/src/components/Image/Image.styles.ts
index 89b1bb12dcedb..6c7b4bb62b0a2 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.styles.ts
@@ -2,7 +2,6 @@ import { IImageStyleProps, IImageStyles } from './Image.types';
 import {
   AnimationClassNames,
   IStyle,
-  ITheme,
 } from '../../Styling';
 
 export const getStyles = (
@@ -10,7 +9,6 @@ export const getStyles = (
 ): IImageStyles => {
   const {
     className,
-    theme,
     width,
     height,
     maximizeFrame,
@@ -26,8 +24,6 @@ export const getStyles = (
     isNotImageFit
   } = props;
 
-  const { palette, semanticColors } = theme;
-
   const ImageFitStyles: IStyle = {
     position: 'relative',
     left: '50%',
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
index dd3e8c6482a88..5c68075f7286a 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.test.tsx
@@ -1,15 +1,13 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
-
-import * as ReactDOM from 'react-dom';
 import * as ReactTestUtils from 'react-dom/test-utils';
 import * as renderer from 'react-test-renderer';
-import { shallow, mount, ReactWrapper } from 'enzyme';
+import { mount } from 'enzyme';
 
 import { Image } from './Image';
 import { ImageBase } from './Image.base';
-import { ImageFit, ImageLoadState } from './Image.types';
+import { ImageFit } from './Image.types';
 
 /* tslint:disable:no-unused-variable */
 const testImage1x1 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQImWP4DwQACfsD/eNV8pwAAAAASUVORK5CYII=';
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.types.ts b/packages/office-ui-fabric-react/src/components/Image/Image.types.ts
index 35d08b2eed47c..0485e37793803 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.types.ts
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { ImageBase } from './Image.base';
 import { IStyle, ITheme } from '../../Styling';
 import { IStyleFunction } from '../../Utilities';
 
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.classNames.ts b/packages/office-ui-fabric-react/src/components/Label/Label.classNames.ts
index f7d06737a6d7e..94cda8ca16d24 100644
--- a/packages/office-ui-fabric-react/src/components/Label/Label.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Label/Label.classNames.ts
@@ -1,5 +1,5 @@
 import { memoizeFunction } from '../../Utilities';
-import { ITheme, FontSizes, mergeStyleSets, HighContrastSelector } from '../../Styling';
+import { ITheme, mergeStyleSets, HighContrastSelector } from '../../Styling';
 
 export interface ILabelClassNames {
   root: string;
@@ -8,34 +8,34 @@ export interface ILabelClassNames {
 export const getLabelClassNames = memoizeFunction((theme: ITheme, className: string | undefined, disabled: boolean, required: boolean): ILabelClassNames => {
   return mergeStyleSets({
     root:
-    ['ms-Label',
-      {
-        color: theme.semanticColors.bodyText,
-        boxSizing: 'border-box',
-        boxShadow: 'none',
-        margin: 0,
-        display: 'block',
-        padding: '5px 0',
-        wordWrap: 'break-word',
-        overflowWrap: 'break-word',
-      },
-      disabled && {
-        color: theme.semanticColors.disabledBodyText,
-        selectors: {
-          [HighContrastSelector]: {
-            color: 'GrayText'
+      ['ms-Label',
+        {
+          color: theme.semanticColors.bodyText,
+          boxSizing: 'border-box',
+          boxShadow: 'none',
+          margin: 0,
+          display: 'block',
+          padding: '5px 0',
+          wordWrap: 'break-word',
+          overflowWrap: 'break-word',
+        },
+        disabled && {
+          color: theme.semanticColors.disabledBodyText,
+          selectors: {
+            [HighContrastSelector]: {
+              color: 'GrayText'
+            }
           }
-        }
-      },
-      required && {
-        selectors: {
-          '::after': {
-            content: `' *'`,
-            color: theme.semanticColors.errorText,
-            paddingRight: 12
+        },
+        required && {
+          selectors: {
+            '::after': {
+              content: `' *'`,
+              color: theme.semanticColors.errorText,
+              paddingRight: 12
+            }
           }
-        }
-      },
-      className]
+        },
+        className]
   });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.base.tsx b/packages/office-ui-fabric-react/src/components/Layer/Layer.base.tsx
index c37fc26bde052..5b103565134f2 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/Layer.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.base.tsx
@@ -10,10 +10,8 @@ import {
   ILayerStyles,
 } from './Layer.types';
 import {
-  css,
   BaseComponent,
   classNamesFunction,
-  customizable,
   getDocument,
   setVirtualParent
 } from '../../Utilities';
@@ -23,7 +21,6 @@ let _defaultHostSelector: string | undefined;
 
 const getClassNames = classNamesFunction<ILayerStyleProps, ILayerStyles>();
 
-// @customizable('Layer', ['theme'])
 export class LayerBase extends BaseComponent<ILayerProps, {}> {
 
   public static defaultProps: ILayerProps = {
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.styles.ts b/packages/office-ui-fabric-react/src/components/Layer/Layer.styles.ts
index 47ba53723ec2b..e8b53479bb77f 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/Layer.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.styles.ts
@@ -1,20 +1,13 @@
 import { ILayerStyleProps, ILayerStyles } from './Layer.types';
-import {
-  IStyle,
-  ITheme,
-} from '../../Styling';
 
 export const getStyles = (
   props: ILayerStyleProps
 ): ILayerStyles => {
   const {
     className,
-    theme,
     isNotHost
   } = props;
 
-  // const { palette, semanticColors } = theme;
-
   return ({
     root: [
       'ms-Layer',
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index bbf4170f2f07a..607d2d006d82c 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -103,7 +103,6 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   };
   private _focusedIndex: number;
   private _scrollElement: HTMLElement;
-  private _scrollingToIndex: number;
   private _hasCompletedFirstRender: boolean;
 
   // surface rect relative to window
@@ -174,7 +173,6 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     this._cachedPageHeights = {};
     this._estimatedPageHeight = 0;
     this._focusedIndex = -1;
-    this._scrollingToIndex = -1;
     this._pageCache = {};
   }
 
@@ -643,10 +641,6 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   }
 
   private _updatePageMeasurements(pages: IPage[]) {
-    const renderedIndexes: {
-      [index: number]: IPage;
-    } = {};
-
     let heightChanged = false;
 
     // when not in virtualize mode, we render all the items without page measurement
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx b/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx
index 46a1b2e75cc17..2b9b9f5bac47a 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx
@@ -13,7 +13,6 @@ const ROWS_PER_PAGE = 3;
 const MAX_ROW_HEIGHT = 250;
 
 export class ListGridExample extends React.Component<IListGridExampleProps> {
-  private _positions: any;
   private _columnCount: number;
   private _columnWidth: number;
   private _rowHeight: number;
@@ -21,7 +20,6 @@ export class ListGridExample extends React.Component<IListGridExampleProps> {
   constructor(props: IListGridExampleProps) {
     super(props);
 
-    this._positions = {};
     this._getItemCountForPage = this._getItemCountForPage.bind(this);
     this._getPageHeight = this._getPageHeight.bind(this);
   }
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
index 75ba494ceb838..9f3171067c707 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
@@ -49,8 +49,6 @@ export class NavBase extends BaseComponent<INavProps, INavState> implements INav
     groups: null
   };
 
-  private _hasExpandButton: boolean;
-
   constructor(props: INavProps) {
     super(props);
 
@@ -67,7 +65,6 @@ export class NavBase extends BaseComponent<INavProps, INavState> implements INav
         }
       }
     }
-    this._hasExpandButton = false;
   }
 
   public componentWillReceiveProps(newProps: INavProps) {
@@ -99,14 +96,6 @@ export class NavBase extends BaseComponent<INavProps, INavState> implements INav
       return null;
     }
 
-    // When groups[x].name is specified or any of the links have children, the expand/collapse
-    // chevron button is shown and different padding is needed. _hasExpandButton marks this condition.
-    this._hasExpandButton = groups.some((group: INavLinkGroup) => {
-      return group ? !!group.name || (group.links && group.links.some((link: INavLink) => {
-        return !!(link && link.links && link.links.length);
-      })) : false;
-    });
-
     const groupElements: React.ReactElement<{}>[] = groups.map(this._renderGroup);
 
     const classNames = getClassNames(getStyles!, { theme: theme!, className, isOnTop, groups });
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.styles.ts b/packages/office-ui-fabric-react/src/components/Nav/Nav.styles.ts
index eced66f8129c4..cc80fb46bebd1 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.styles.ts
@@ -5,9 +5,7 @@ import {
   DefaultFontStyles,
   getFocusStyle,
   FontSizes,
-  FontWeights,
-  IStyle,
-  ITheme,
+  FontWeights
 } from '../../Styling';
 
 export const buttonStyles: IButtonStyles = {
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts b/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
index 3ac5a5420b701..d499f4bb52041 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { NavBase } from './Nav.base';
 import { IStyle, ITheme } from '../../Styling';
 import { IRenderFunction, IStyleFunction } from '../../Utilities';
 import { IIconProps } from '../Icon/Icon.types';
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
index c9355322dede0..c2199b343799c 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
@@ -19,7 +19,6 @@ export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> implements
     const {
       items,
       overflowItems,
-      onRenderOverflowButton,
       className,
       focusZoneProps,
       vertical = false,
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Vertical.Example.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Vertical.Example.tsx
index e46f7ec8d6610..a8d6b8571bf4e 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Vertical.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/examples/OverflowSet.Vertical.Example.tsx
@@ -1,8 +1,7 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
-import { BaseComponent, css } from 'office-ui-fabric-react/lib/Utilities';
-import { IconButton } from 'office-ui-fabric-react/lib/Button';
+import { BaseComponent } from 'office-ui-fabric-react/lib/Utilities';
 import { CommandBarButton } from 'office-ui-fabric-react/lib/Button';
 import { TooltipHost } from 'office-ui-fabric-react/lib/Tooltip';
 import { DirectionalHint } from 'office-ui-fabric-react/lib/common/DirectionalHint';
@@ -10,9 +9,8 @@ import {
   IOverflowSetItemProps,
   OverflowSet
 } from 'office-ui-fabric-react/lib/OverflowSet';
-
+/* tslint:disable-next-line:no-unused-variable */
 import * as stylesImport from './OverflowSet.Example.scss';
-const styles: any = stylesImport;
 
 export class OverflowSetVerticalExample extends BaseComponent<any, any> {
 
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.styles.ts b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.styles.ts
index 377847ff2ff1e..4ef125c30226c 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.styles.ts
@@ -1,9 +1,5 @@
 import { IOverlayStyleProps, IOverlayStyles } from './Overlay.types';
-import {
-  IStyle,
-  ITheme,
-  HighContrastSelector,
-} from '../../Styling';
+import { HighContrastSelector } from '../../Styling';
 
 export const getStyles = (
   props: IOverlayStyleProps
@@ -15,7 +11,7 @@ export const getStyles = (
     isDark,
   } = props;
 
-  const { palette, semanticColors } = theme;
+  const { palette } = theme;
 
   return ({
     root: [
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.types.ts b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.types.ts
index 2710d2ee4bb21..c6e2810e8ea10 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.types.ts
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { OverlayBase } from './Overlay.base';
 import { IStyle, ITheme } from '../../Styling';
 import { IStyleFunction } from '../../Utilities';
 
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
index 64fdf8039a0d4..baee354cc6acd 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
@@ -15,7 +15,7 @@ import { Layer } from '../Layer/Layer';
 import { Overlay } from '../../Overlay';
 import { Popup } from '../../Popup';
 import { IconButton } from '../../Button';
-import { AnimationClassNames, getTheme, FontSizes, IconFontSizes } from '../../Styling';
+import { AnimationClassNames, getTheme, IconFontSizes } from '../../Styling';
 import * as stylesImport from './Panel.scss';
 const styles: any = stylesImport;
 const theme = getTheme();
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.ExtraLarge.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.ExtraLarge.Example.tsx
index 2ee4be0df9c0e..9269f6e81f9c1 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.ExtraLarge.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.ExtraLarge.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Large.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Large.Example.tsx
index ca15fbdc56500..8f1b57da41804 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Large.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Large.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.styles.ts b/packages/office-ui-fabric-react/src/components/Persona/Persona.styles.ts
index 6e552f2e6a87b..61b84a0b2a2b5 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.styles.ts
@@ -1,19 +1,8 @@
 import { IPersonaStyleProps, IPersonaStyles } from './Persona.types';
-import {
-  IStyle,
-  ITheme,
-} from '../../Styling';
 
 export const getStyles = (
   props: IPersonaStyleProps
 ): IPersonaStyles => {
-  const {
-    className,
-    theme,
-  } = props;
-
-  const { palette, semanticColors } = theme;
-
   return ({
     root: [
       'ms-Persona',
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
index bfc66bd2eecf6..cd67d25d91603 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.test.tsx
@@ -3,7 +3,6 @@ import * as React from 'react';
 import * as renderer from 'react-test-renderer';
 import { setRTL } from '../../Utilities';
 import { Persona } from './Persona';
-import { PersonaInitialsColor } from './Persona.types';
 import { mount, ReactWrapper } from 'enzyme';
 
 const testImage1x1 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQImWP4DwQACfsD/eNV8pwAAAAASUVORK5CYII=';
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
index c3f2e9eff31a2..c767d943e33c5 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
@@ -12,7 +12,6 @@ import { PersonaPresence } from './PersonaPresence';
 import {
   IPersonaProps,
   PersonaPresence as PersonaPresenceEnum,
-  PersonaInitialsColor,
   PersonaSize
 } from './Persona.types';
 import {
@@ -72,14 +71,9 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
       coinProps,
       coinSize,
       imageUrl,
-      imageAlt,
-      initialsColor,
-      primaryText,
-      imageShouldFadeIn,
       onRenderCoin = this._onRenderCoin,
       onRenderInitials = this._onRenderInitials,
-      imageShouldStartVisible
-     } = this.props;
+    } = this.props;
 
     const size = this.props.size as PersonaSize;
     const divProps = getNativeProps(this.props, divProperties);
@@ -146,7 +140,7 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
 
     const size = this.props.size as PersonaSize;
 
-    return(
+    return (
       <Image
         className={ css('ms-Persona-image', styles.image) }
         imageFit={ ImageFit.cover }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts b/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
index d7aa2355f4ed6..e2df04104471b 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaConsts.ts
@@ -1,5 +1,4 @@
 import {
-  PersonaInitialsColor,
   PersonaPresence,
   PersonaSize
 } from './Persona.types';
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomCoinRender.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomCoinRender.Example.tsx
index 3eb019c58f4b2..ce4f245383207 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomCoinRender.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomCoinRender.Example.tsx
@@ -6,7 +6,6 @@ import {
   PersonaSize,
   PersonaPresence
 } from 'office-ui-fabric-react/lib/Persona';
-import { Icon } from 'office-ui-fabric-react/lib/Icon';
 import { TestImages } from '../../../common/TestImages';
 import './PersonaExample.scss';
 import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Indeterminate.Example.tsx b/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Indeterminate.Example.tsx
index 84408eaf4605c..77538f2d15eaf 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Indeterminate.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/examples/ProgressIndicator.Indeterminate.Example.tsx
@@ -1,8 +1,5 @@
 import * as React from 'react';
-import {
-  ProgressIndicator
-} from 'office-ui-fabric-react/lib/ProgressIndicator';
-import { Async } from 'office-ui-fabric-react/lib/Utilities';
+import { ProgressIndicator } from 'office-ui-fabric-react/lib/ProgressIndicator';
 
 export class ProgressIndicatorIndeterminateExample extends React.Component<{}, {}> {
   constructor(props: {}) {
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.styles.ts b/packages/office-ui-fabric-react/src/components/Rating/Rating.styles.ts
index d4b106e3bd988..d9e0861c57ab0 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.styles.ts
@@ -3,7 +3,7 @@ import {
   hiddenContentStyle,
   HighContrastSelector,
 } from '../../Styling';
-import { RatingSize, IRatingStyleProps, IRatingStyles } from './Rating.types';
+import { IRatingStyleProps, IRatingStyles } from './Rating.types';
 
 export function getStyles(props: IRatingStyleProps): IRatingStyles {
   const {
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx b/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
index df7e19f8bb00b..e4256622a2983 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.test.tsx
@@ -18,7 +18,6 @@ describe('Rating', () => {
   });
 
   it('Can change rating.', () => {
-    let exception;
     let threwException = false;
     let rating;
     try {
@@ -29,7 +28,6 @@ describe('Rating', () => {
         />
       );
     } catch (e) {
-      exception = e;
       threwException = true;
     }
     expect(threwException).toEqual(false);
@@ -60,7 +58,6 @@ describe('Rating', () => {
   });
 
   it('Clamps input rating to allowed range.', () => {
-    let exception;
     let threwException = false;
     let rating;
     try {
@@ -71,7 +68,6 @@ describe('Rating', () => {
         />
       );
     } catch (e) {
-      exception = e;
       threwException = true;
     }
     expect(threwException).toEqual(false);
@@ -96,7 +92,6 @@ describe('Rating', () => {
   });
 
   it('Half star is displayed when 2.5 value is passed.', () => {
-    let exception;
     let threwException = false;
     let rating;
     try {
@@ -107,7 +102,6 @@ describe('Rating', () => {
         />
       );
     } catch (e) {
-      exception = e;
       threwException = true;
     }
     expect(threwException).toEqual(false);
@@ -130,7 +124,6 @@ describe('Rating', () => {
   });
 
   it('When rating is disabled cannot change rating', () => {
-    let exception;
     let threwException = false;
     let choiceGroup;
     try {
@@ -141,7 +134,6 @@ describe('Rating', () => {
         />
       );
     } catch (e) {
-      exception = e;
       threwException = true;
     }
     expect(threwException).toEqual(false);
@@ -157,7 +149,6 @@ describe('Rating', () => {
   });
 
   it('When rating is readonly cannot change rating', () => {
-    let exception;
     let threwException = false;
     let choiceGroup;
     try {
@@ -169,7 +160,6 @@ describe('Rating', () => {
         />
       );
     } catch (e) {
-      exception = e;
       threwException = true;
 
     }
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx b/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
index 3699b845ccf1d..dec302bd0e019 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.tsx
@@ -1,6 +1,7 @@
 import {
   styled
 } from '../../Utilities';
+// tslint:disable-next-line:no-unused-variable
 import { IRatingProps } from './Rating.types';
 import { getStyles } from './Rating.styles';
 import { RatingBase } from './Rating.base';
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.base.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.base.tsx
index e0cb64aa6f8e5..5e3db278b0373 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.base.tsx
@@ -3,7 +3,6 @@ import * as PropTypes from 'prop-types';
 import {
   BaseComponent,
   classNamesFunction,
-  css,
   customizable,
   divProperties,
   getNativeProps,
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.styles.ts b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.styles.ts
index c4457138bd593..a91a6ecf123f4 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.styles.ts
@@ -1,19 +1,12 @@
 import { IResizeGroupStyleProps, IResizeGroupStyles } from './ResizeGroup.types';
-import {
-  IStyle,
-  ITheme,
-} from '../../Styling';
 
 export const getStyles = (
   props: IResizeGroupStyleProps
 ): IResizeGroupStyles => {
   const {
     className,
-    theme,
   } = props;
 
-  const { palette, semanticColors } = theme;
-
   return ({
     root: [
       'ms-ResizeGroup',
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.styles.ts b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.styles.ts
index 9c1c71f1b7a3d..b89f518d1728c 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.styles.ts
@@ -1,19 +1,13 @@
 import { IScrollablePaneStyleProps, IScrollablePaneStyles } from './ScrollablePane.types';
 import {
   HighContrastSelector,
-  IStyle,
-  ITheme
+  IStyle
 } from '../../Styling';
 
 export const getStyles = (
   props: IScrollablePaneStyleProps
 ): IScrollablePaneStyles => {
-  const {
-    className,
-    theme,
-  } = props;
-
-  const { palette, semanticColors } = theme;
+  const { className } = props;
 
   const AboveAndBelowStyles: IStyle = {
     position: 'absolute',
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
index c227ebcb45609..51fbeb97f084a 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
@@ -12,8 +12,6 @@ import {
 import { IconButton } from '../../Button';
 import { Icon } from '../../Icon';
 
-import { FocusZone } from '../../FocusZone';
-
 const getClassNames = classNamesFunction<ISearchBoxStyleProps, ISearchBoxStyles>();
 
 export interface ISearchBoxState {
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx
index 9299f4f6bcb45..0a26b34ca8be1 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.styles.tsx
@@ -1,13 +1,9 @@
 import {
-  FontSizes,
   HighContrastSelector,
-  ScreenWidthMaxMedium,
-  ScreenWidthMaxSmall,
   AnimationVariables,
   normalize
 } from '../../Styling';
-import { SearchBoxBase } from './SearchBox.base';
-import { ISearchBoxProps, ISearchBoxStyleProps, ISearchBoxStyles } from './SearchBox.types';
+import { ISearchBoxStyleProps, ISearchBoxStyles } from './SearchBox.types';
 
 export function getStyles(props: ISearchBoxStyleProps): ISearchBoxStyles {
   const { theme, underlined, disabled, hasFocus, className, hasInput } = props;
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.test.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.test.tsx
index 05bde0d95edb3..e3ceb42150d54 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.test.tsx
@@ -1,7 +1,4 @@
-import { Promise } from 'es6-promise';
 import * as React from 'react';
-import * as ReactDOM from 'react-dom';
-import * as ReactTestUtils from 'react-dom/test-utils';
 import * as renderer from 'react-test-renderer';
 import { mount } from 'enzyme';
 import { SearchBox } from './SearchBox';
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
index 45ac52526fb2e..9aa88d92d513e 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.tsx
@@ -1,5 +1,6 @@
 import { styled } from '../../Utilities';
 import { SearchBoxBase } from './SearchBox.base';
+// tslint:disable-next-line:no-unused-variable
 import { ISearchBoxProps } from './SearchBox.types';
 import { getStyles } from './SearchBox.styles';
 
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
index cca82ee58e199..2d969b4b8345c 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
@@ -121,7 +121,7 @@ export const getStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: Partial<ISpinButtonStyles>
 ): ISpinButtonStyles => {
-  const { fonts, palette, semanticColors } = theme;
+  const { palette, semanticColors } = theme;
 
   const SpinButtonRootBorderColor = semanticColors.inputBorder;
   const SpinButtonRootBorderColorHovered = semanticColors.inputBorderHovered;
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
index 3016149f71a57..c7b3ee3d1763f 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.test.tsx
@@ -630,8 +630,6 @@ describe('SpinButton', () => {
       />
     );
 
-    // Assert on the input element.
-    const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
     const buttonDOM: Element = renderedDOM.getElementsByClassName('ms-UpButton')[0];
 
     ReactTestUtils.Simulate.mouseDown(buttonDOM,
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.styles.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.styles.ts
index 643fa8b18d70a..52a197c9b7df6 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.styles.ts
@@ -1,8 +1,4 @@
-import {
-  IRawStyle,
-  getFocusStyle,
-  HighContrastSelector,
-} from '../../Styling';
+import { IRawStyle, HighContrastSelector } from '../../Styling';
 import { IColorPickerGridCellStyleProps, IColorPickerGridCellStyles } from './ColorPickerGridCell.types';
 
 const ACTIVE_BORDER_COLOR = '#969696';
@@ -28,7 +24,7 @@ export const getStyles = (props: IColorPickerGridCellStyleProps): IColorPickerGr
     isWhite
   } = props;
 
-  const { semanticColors, fonts } = theme;
+  const { semanticColors } = theme;
   return {
     colorCell: [
       {
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.tsx
index b9c0d47e8598e..6aede2a65e56c 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.tsx
@@ -1,9 +1,8 @@
-import * as React from 'react';
 import {
-  IStyleFunction,
   styled
 } from '../../Utilities';
 import { ColorPickerGridCellBase } from './ColorPickerGridCell.base';
+// tslint:disable-next-line:no-unused-variable
 import { IColorPickerGridCellProps } from './ColorPickerGridCell.types';
 import { getStyles } from './ColorPickerGridCell.styles';
 
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.types.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.types.ts
index 5f38daeb05f1e..0ba24c2f0cfd2 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.types.ts
@@ -1,6 +1,5 @@
 import { IStyle, ITheme } from '../../Styling';
 import { IStyleFunction } from '../../Utilities';
-import { IGridCellProps } from '../../utilities/grid/GridCell.types';
 
 export interface IColorPickerGridCellProps {
   /**
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
index 63ceba7e78b9e..8e15267274dbe 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
@@ -6,10 +6,8 @@ import {
   classNamesFunction,
   customizable,
   findIndex,
-  htmlElementProperties,
   KeyCodes,
-  getId,
-  getNativeProps
+  getId
 } from '../../Utilities';
 import {
   ISwatchColorPicker,
@@ -20,7 +18,6 @@ import {
 import { Grid } from '../../utilities/grid/Grid';
 import { IColorCellProps } from './ColorPickerGridCell.types';
 import { ColorPickerGridCell } from './ColorPickerGridCell';
-import { mergeStyleSets } from '../../Styling';
 
 export interface ISwatchColorPickerState {
   selectedIndex?: number;
@@ -95,7 +92,6 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
       shouldFocusCircularNavigate,
       className,
       doNotContainWithinFocusZone,
-      disabled,
       getStyles,
     } = this.props;
 
@@ -153,10 +149,6 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
     return selectedIndex >= 0 ? selectedIndex : undefined;
   }
 
-  private _isSelected(index: number): boolean {
-    return this.state.selectedIndex !== undefined && (this.state.selectedIndex === index);
-  }
-
   /**
    * Render a color cell
    * @param item - The item to render
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.styles.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.styles.ts
index 08a3c546af9fb..e92a869d37aea 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.styles.ts
@@ -2,12 +2,7 @@
 import { ISwatchColorPickerStyleProps, ISwatchColorPickerStyles } from './SwatchColorPicker.types';
 
 export const getStyles = (props: ISwatchColorPickerStyleProps): ISwatchColorPickerStyles => {
-  const {
-    theme,
-    className,
-  } = props;
-
-  const { semanticColors, fonts } = theme;
+  const { className } = props;
 
   return {
     root: {
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
index 3f12d71e3e33e..c53a847113d19 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.test.tsx
@@ -2,7 +2,6 @@
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
-import * as ReactTestUtils from 'react-dom/test-utils';
 import * as renderer from 'react-test-renderer';
 import { mount } from 'enzyme';
 import { SwatchColorPickerBase } from './SwatchColorPicker.base';
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
index 26b58d029ebe3..ac4c76b3f5348 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.tsx
@@ -1,9 +1,6 @@
-import * as React from 'react';
-import {
-  IStyleFunction,
-  styled
-} from '../../Utilities';
+import { styled } from '../../Utilities';
 import { SwatchColorPickerBase } from './SwatchColorPicker.base';
+// tslint:disable-next-line:no-unused-variable
 import { ISwatchColorPickerProps } from './SwatchColorPicker.types';
 import { getStyles } from './SwatchColorPicker.styles';
 
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
index 5dc95774d2a89..8bd786aca93be 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
@@ -47,7 +47,7 @@ export class TeachingBubble extends BaseComponent<ITeachingBubbleProps, ITeachin
     };
   }
 
-  public render() {
+  public render(): JSX.Element {
     const { calloutProps: setCalloutProps, targetElement, onDismiss } = this.props;
     const calloutProps = { ...this._defaultCalloutProps, ...setCalloutProps };
 
@@ -56,7 +56,7 @@ export class TeachingBubble extends BaseComponent<ITeachingBubbleProps, ITeachin
         ref={ this._resolveRef('_callout') }
         target={ targetElement }
         onDismiss={ onDismiss }
-        {...calloutProps}
+        { ...calloutProps }
         className={ css('ms-TeachingBubble', styles.root, this.props.isWide ? styles.wideCallout : null, calloutProps ? calloutProps.className : undefined) }
       >
         <TeachingBubbleContent { ...this.props } />
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubbleContent.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubbleContent.tsx
index 147d72089a179..79fb4ae674373 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubbleContent.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubbleContent.tsx
@@ -1,11 +1,7 @@
 /* tslint:disable:no-unused-variable */
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
-import {
-  BaseComponent,
-  css,
-  getId
-} from '../../Utilities';
+import { BaseComponent, css } from '../../Utilities';
 import { ITeachingBubbleProps } from './TeachingBubble.types';
 import { ITeachingBubbleState } from './TeachingBubble';
 import { PrimaryButton, DefaultButton, IconButton } from '../../Button';
@@ -25,14 +21,9 @@ export class TeachingBubbleContent extends BaseComponent<ITeachingBubbleProps, I
     }
   };
 
-  // Specify any private variables
-  private _id: string;
-
-  // Constructor
   constructor(props: ITeachingBubbleProps) {
     super(props);
 
-    this._id = getId('TeachingBubble');
     this.state = {
     };
   }
diff --git a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
index 72501cbdbb86a..2f3dcf4f309b8 100644
--- a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
@@ -5,7 +5,7 @@ import { defaultTheme } from './defaultTheme';
 import { Callout } from 'office-ui-fabric-react/lib/Callout';
 import { DetailsList, DetailsListLayoutMode as LayoutMode } from 'office-ui-fabric-react/lib/DetailsList';
 import { SelectionMode } from 'office-ui-fabric-react/lib/Selection';
-import { ColorPicker, IColorPickerProps } from 'office-ui-fabric-react/lib/ColorPicker';
+import { ColorPicker } from 'office-ui-fabric-react/lib/ColorPicker';
 import { autobind } from '../../Utilities';
 import './ThemePage.scss';
 const ThemeCodeExample = require('!raw-loader!office-ui-fabric-react/src/components/Theme/examples/ThemeCode.Example.tsx');
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
index cc84cd14a87e4..4023244f96872 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
@@ -6,8 +6,7 @@ import {
 } from 'office-ui-fabric-react/lib/Utilities';
 
 import {
-  loadTheme,
-  createTheme
+  loadTheme
 } from 'office-ui-fabric-react/lib/Styling';
 import {
   IColor,
@@ -440,14 +439,6 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
       }
     }
 
-    const themeAsJson = ThemeGenerator.getThemeAsJson(abridgedTheme);
-
-    // todo: need to start outputting the real ITheme object:
-    /* createTheme({
-      palette: ThemeGenerator.getThemeAsJson(abridgedTheme),
-      semanticColors: ThemeGenerator.getThemeAsJson(abridgedTheme)
-    }) */
-
     return (
       <div>
         <h2>Output</h2>
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index c3d5619d66945..66aaaf334a57c 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -10,7 +10,7 @@ import { Callout, DirectionalHint } from '../../Callout';
 import { Selection, SelectionZone, SelectionMode } from '../../utilities/selection/index';
 import { Suggestions } from './Suggestions/Suggestions';
 import { ISuggestionsProps } from './Suggestions/Suggestions.types';
-import { SuggestionsController, ISuggestionModel } from './Suggestions/SuggestionsController';
+import { SuggestionsController } from './Suggestions/SuggestionsController';
 import { IBasePicker, IBasePickerProps, ValidationState } from './BasePicker.types';
 import { Autofill } from '../Autofill/Autofill';
 import { IPickerItemProps } from './PickerItem.types';
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
index 51ef8626b1a7e..aec95c5743a6a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
@@ -58,7 +58,7 @@ export class SelectedItemWithMenu extends BaseComponent<IPeoplePickerItemWithMen
             <ContextualMenu
               items={ item.menuItems! }
               shouldFocusOnMount={ true }
-              target={ this.refs.ellipsisRef }
+              target={ this._ellipsisRef }
               onDismiss={ this._onCloseContextualMenu }
               directionalHint={ DirectionalHint.bottomAutoEdge }
             />)
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index ad51629beef19..b24ac5dcb575e 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -82,8 +82,6 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
   public render() {
     const {
       forceResolveText,
-      createGenericItem,
-      showForceResolve,
       mostRecentlyUsedHeaderText,
       searchForMoreText,
       className,
@@ -137,7 +135,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
               styles.actionButton,
               {
                 ['is-selected ' + styles.buttonSelected]:
-                this.state.selectedActionType === SuggestionActionType.forceResolve
+                  this.state.selectedActionType === SuggestionActionType.forceResolve
               }) }
             onClick={ this._forceResolve }
           >
@@ -160,7 +158,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
               styles.actionButton,
               {
                 ['is-selected ' + styles.buttonSelected]:
-                this.state.selectedActionType === SuggestionActionType.searchMore
+                  this.state.selectedActionType === SuggestionActionType.searchMore
               }) }
             iconProps={ { iconName: 'Search' } }
             onClick={ this._getMoreResults }
@@ -283,7 +281,6 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
   }
 
   public focusAboveSuggestions(): void {
-    const newSelectedActionType = null;
     if (this._forceResolveButton) {
       this.setState({ selectedActionType: SuggestionActionType.forceResolve });
     } else if (this._searchForMoreButton) {
diff --git a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
index 4e44342cd51bc..7f797273c78cf 100644
--- a/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
+++ b/packages/office-ui-fabric-react/src/utilities/dateMath/DateMath.ts
@@ -314,14 +314,11 @@ function getDatePartHashValue(date: Date) {
 */
 function getWeekOfYearFullDays(date: Date, firstDayOfWeek: DayOfWeek, numberOfFullDays: number) {
   const dayOfYear = getDayOfYear(date) - 1;
-  const dateWeekDay = date.getDay();
   let num = (date.getDay()) - (dayOfYear % TimeConstants.DaysInOneWeek);
 
   const lastDayOfPrevYear = new Date(date.getFullYear() - 1, MonthOfYear.December, 31);
   const daysInYear = getDayOfYear(lastDayOfPrevYear) - 1;
 
-  const adjustedWeekDay = adjustWeekDay(firstDayOfWeek, dateWeekDay);
-
   let num2 = ((firstDayOfWeek - num) + (2 * TimeConstants.DaysInOneWeek)) % TimeConstants.DaysInOneWeek;
   if ((num2 !== 0) && (num2 >= numberOfFullDays)) {
     num2 -= TimeConstants.DaysInOneWeek;
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx b/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
index 503908da33ba2..335f88b11d05d 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.tsx
@@ -1,8 +1,8 @@
-import * as React from 'react';
 import {
   styled
 } from '../../Utilities';
 import { GridBase } from './Grid.base';
+// tslint:disable-next-line:no-unused-variable
 import { IGridProps } from './Grid.types';
 import { getStyles } from './Grid.styles';
 
diff --git a/packages/office-ui-fabric-react/src/utilities/positioning.test.ts b/packages/office-ui-fabric-react/src/utilities/positioning.test.ts
index 73c07cab98251..7cb5696286fb9 100644
--- a/packages/office-ui-fabric-react/src/utilities/positioning.test.ts
+++ b/packages/office-ui-fabric-react/src/utilities/positioning.test.ts
@@ -13,10 +13,6 @@ interface ITestValues {
   beakWidth: number;
 }
 
-function stringifyResults(expected: any, actual: any) {
-  return 'expected was: ' + JSON.stringify(expected) + ' actual was: ' + JSON.stringify(actual);
-}
-
 function positionCalloutTest(testValues: ITestValues, alignment: DirectionalHint, validate: ITestValidation) {
   const { callout, target, bounds, beakWidth } = testValues;
   const gap: number = positioningFunctions._calculateActualBeakWidthInPixels(beakWidth) / 2;
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts b/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
index cea9eb6076125..ca3bba566df62 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selection/Selection.ts
@@ -309,7 +309,6 @@ export class Selection implements ISelection {
     this.setChangeEvents(false);
 
     const isExempt = this._exemptedIndices[index];
-    let hasChanged = false;
     const canSelect = !this._unselectableIndices[index];
 
     if (canSelect) {
@@ -323,7 +322,6 @@ export class Selection implements ISelection {
         (isSelected && this._isAllSelected) ||
         (!isSelected && !this._isAllSelected)
       )) {
-        hasChanged = true;
         delete this._exemptedIndices[index];
         this._exemptedCount--;
       }
@@ -333,7 +331,6 @@ export class Selection implements ISelection {
         (isSelected && !this._isAllSelected) ||
         (!isSelected && this._isAllSelected)
       )) {
-        hasChanged = true;
         this._exemptedIndices[index] = true;
         this._exemptedCount++;
       }
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
index 42dfb6d0c2007..6ca9e43284457 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.test.tsx
@@ -19,9 +19,7 @@ let _surface0: Element;
 let _invoke0: Element;
 let _toggle0: Element;
 let _surface1: Element;
-let _invoke1: Element;
 let _toggle1: Element;
-let _invoke2: Element;
 let _toggle2: Element;
 let _surface3: Element;
 
@@ -66,9 +64,7 @@ function _initializeSelection(selectionMode = SelectionMode.multiple) {
   _invoke0 = _componentElement.querySelector('#invoke0')!;
   _toggle0 = _componentElement.querySelector('#toggle0')!;
   _surface1 = _componentElement.querySelector('#surface1')!;
-  _invoke1 = _componentElement.querySelector('#invoke1')!;
   _toggle1 = _componentElement.querySelector('#toggle1')!;
-  _invoke2 = _componentElement.querySelector('#invoke2')!;
   _toggle2 = _componentElement.querySelector('#toggle2')!;
   _surface3 = _componentElement.querySelector('#surface3')!;
 
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
index a1f93b5c74180..4c475d3c14df3 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
@@ -12,7 +12,6 @@ import {
 } from '../../Utilities';
 import {
   ISelection,
-  SelectionDirection,
   SelectionMode
 } from './interfaces';
 
diff --git a/packages/office-ui-fabric-react/tslint.json b/packages/office-ui-fabric-react/tslint.json
index bd9e67217070b..9dcefdf589368 100644
--- a/packages/office-ui-fabric-react/tslint.json
+++ b/packages/office-ui-fabric-react/tslint.json
@@ -11,7 +11,6 @@
     "no-any": false,
     "typedef": [
       false
-    ],
-    "no-unused-variable": false
+    ]
   }
 }
\ No newline at end of file

From fb5f9757d367fc836c71bdca85a4ea794aca476f Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 5 Mar 2018 11:16:58 +0000
Subject: [PATCH 1507/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../image-scss2ms-pt2_2018-03-01-20-29.json   | 11 -----
 .../Nav_2018-03-03-08-32.json                 | 11 -----
 ...aditima-header-sizer_2018-03-02-18-27.json | 11 -----
 .../image-scss2ms-pt2_2018-03-01-20-29.json   | 11 -----
 ...ariadescribedby-4147_2018-03-02-00-43.json | 11 -----
 .../no-unused-variable_2018-03-04-15-44.json  | 11 -----
 ...mtimbo-fixlistresize_2018-03-03-00-16.json | 11 -----
 packages/experiments/CHANGELOG.json           | 19 +++++++++
 packages/experiments/CHANGELOG.md             |  9 +++-
 packages/experiments/package.json             |  4 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 41 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 17 +++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 18 files changed, 92 insertions(+), 87 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/image-scss2ms-pt2_2018-03-01-20-29.json
 delete mode 100644 common/changes/office-ui-fabric-react/Nav_2018-03-03-08-32.json
 delete mode 100644 common/changes/office-ui-fabric-react/aditima-header-sizer_2018-03-02-18-27.json
 delete mode 100644 common/changes/office-ui-fabric-react/image-scss2ms-pt2_2018-03-01-20-29.json
 delete mode 100644 common/changes/office-ui-fabric-react/nav-ariadescribedby-4147_2018-03-02-00-43.json
 delete mode 100644 common/changes/office-ui-fabric-react/no-unused-variable_2018-03-04-15-44.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-samuelmtimbo-fixlistresize_2018-03-03-00-16.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index f263385990efc..46d2866ed0bfb 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.57.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.59.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 05388d1653669..d847f085b5567 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.57.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.59.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index a66de073f8c48..f3efd0c4a375c 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.57.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.59.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 7384926344b5e..e345a06ed3eb3 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.57.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.59.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 2b13d505a89a2..fc1c1581db76d 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.57.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.59.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/common/changes/@uifabric/experiments/image-scss2ms-pt2_2018-03-01-20-29.json b/common/changes/@uifabric/experiments/image-scss2ms-pt2_2018-03-01-20-29.json
deleted file mode 100644
index 114fdecfb5805..0000000000000
--- a/common/changes/@uifabric/experiments/image-scss2ms-pt2_2018-03-01-20-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Converting Image SCSS to MergeStyles step 2 - style conversion (snapshots updated)",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/Nav_2018-03-03-08-32.json b/common/changes/office-ui-fabric-react/Nav_2018-03-03-08-32.json
deleted file mode 100644
index 756a4f897a740..0000000000000
--- a/common/changes/office-ui-fabric-react/Nav_2018-03-03-08-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Nav: Wire nav link to expand/collapse behavior if it has no URL but has children.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "s@warmsea.net"
-}
diff --git a/common/changes/office-ui-fabric-react/aditima-header-sizer_2018-03-02-18-27.json b/common/changes/office-ui-fabric-react/aditima-header-sizer_2018-03-02-18-27.json
deleted file mode 100644
index f26650072e00d..0000000000000
--- a/common/changes/office-ui-fabric-react/aditima-header-sizer_2018-03-02-18-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix issue 3608: DetailsList horizontal scroll due to cellSizer",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "aditima@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/image-scss2ms-pt2_2018-03-01-20-29.json b/common/changes/office-ui-fabric-react/image-scss2ms-pt2_2018-03-01-20-29.json
deleted file mode 100644
index 6618a41fbc7a2..0000000000000
--- a/common/changes/office-ui-fabric-react/image-scss2ms-pt2_2018-03-01-20-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Converting Image SCSS to MergeStyles step 2 - style conversion",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/nav-ariadescribedby-4147_2018-03-02-00-43.json b/common/changes/office-ui-fabric-react/nav-ariadescribedby-4147_2018-03-02-00-43.json
deleted file mode 100644
index 8ab8544c7868c..0000000000000
--- a/common/changes/office-ui-fabric-react/nav-ariadescribedby-4147_2018-03-02-00-43.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixed aria-describedby bug causing it not to render properly",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/no-unused-variable_2018-03-04-15-44.json b/common/changes/office-ui-fabric-react/no-unused-variable_2018-03-04-15-44.json
deleted file mode 100644
index d6dda19a3d7a1..0000000000000
--- a/common/changes/office-ui-fabric-react/no-unused-variable_2018-03-04-15-44.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Removes unused variables",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mark@thedutchies.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-samuelmtimbo-fixlistresize_2018-03-03-00-16.json b/common/changes/office-ui-fabric-react/users-samuelmtimbo-fixlistresize_2018-03-03-00-16.json
deleted file mode 100644
index 49694ab8ff1d3..0000000000000
--- a/common/changes/office-ui-fabric-react/users-samuelmtimbo-fixlistresize_2018-03-03-00-16.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "GroupedListSection: Changed the list ref name from `list` to `_list`",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "samuelmtimbo@gmail.com"
-}
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 6864e96a04e2e..d91b52f518540 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.23.0",
+      "tag": "@uifabric/experiments_v5.23.0",
+      "date": "Mon, 05 Mar 2018 11:16:58 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "5e24983e16790428d43d3c8252f361bc32c7f99f",
+            "comment": "Converting Image SCSS to MergeStyles step 2 - style conversion (snapshots updated)"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.58.0 <6.0.0` to `>=5.59.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.22.0",
       "tag": "@uifabric/experiments_v5.22.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 2ea4d1e610514..0d83850f7d53f 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Fri, 02 Mar 2018 11:25:35 GMT and should not be manually modified.
+This log was last generated on Mon, 05 Mar 2018 11:16:58 GMT and should not be manually modified.
+
+## 5.23.0
+Mon, 05 Mar 2018 11:16:58 GMT
+
+### Minor changes
+
+- Converting Image SCSS to MergeStyles step 2 - style conversion (snapshots updated)
 
 ## 5.22.0
 Fri, 02 Mar 2018 11:25:35 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index cbcae44e5902a..b004308756291 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.22.0",
+  "version": "5.23.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.58.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.59.0 <6.0.0",
     "@uifabric/icons": ">=5.5.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 6e0bfbdcb59ef..86f70214bbacc 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,47 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.59.0",
+      "tag": "office-ui-fabric-react_v5.59.0",
+      "date": "Mon, 05 Mar 2018 11:16:58 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Aditi Mandal <aditima@microsoft.com>",
+            "commit": "6060a321343aab06548b3c5441b9d9fe62507242",
+            "comment": "Fix issue 3608: DetailsList horizontal scroll due to cellSizer"
+          },
+          {
+            "author": "Su Su <s@warmsea.net>",
+            "commit": "172b7c5c54a0f50b305d7eff4d77f62e861daae0",
+            "comment": "Nav: Wire nav link to expand/collapse behavior if it has no URL but has children."
+          },
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "132efd3b7ee5853a2c47d5ac7663853caedf28e1",
+            "comment": "Fixed aria-describedby bug causing it not to render properly"
+          },
+          {
+            "author": "Mark Polak <mark@thedutchies.com>",
+            "commit": "28af7a3ed0e56fdddfb5b2ccb26c83543e6b049f",
+            "comment": "Removes unused variables"
+          },
+          {
+            "author": "Samuel Timbó <samuelmtimbo@gmail.com>",
+            "commit": "eb4764aa3943195315138df089e27e7e261c664b",
+            "comment": "GroupedListSection: Changed the list ref name from `list` to `_list`"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "5e24983e16790428d43d3c8252f361bc32c7f99f",
+            "comment": "Converting Image SCSS to MergeStyles step 2 - style conversion"
+          }
+        ]
+      }
+    },
     {
       "version": "5.58.0",
       "tag": "office-ui-fabric-react_v5.58.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index a63a88104b532..a7e609493a9bf 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,21 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 02 Mar 2018 11:25:35 GMT and should not be manually modified.
+This log was last generated on Mon, 05 Mar 2018 11:16:58 GMT and should not be manually modified.
+
+## 5.59.0
+Mon, 05 Mar 2018 11:16:58 GMT
+
+### Minor changes
+
+- Converting Image SCSS to MergeStyles step 2 - style conversion
+
+### Patches
+
+- Fix issue 3608: DetailsList horizontal scroll due to cellSizer
+- Nav: Wire nav link to expand/collapse behavior if it has no URL but has children.
+- Fixed aria-describedby bug causing it not to render properly
+- Removes unused variables
+- GroupedListSection: Changed the list ref name from `list` to `_list`
 
 ## 5.58.0
 Fri, 02 Mar 2018 11:25:35 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index d937ff80f04fa..d85e2a22d522d 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.58.0",
+  "version": "5.59.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From caad61fa2976154001c279b61ea0f597752f1115 Mon Sep 17 00:00:00 2001
From: Kelsey Young <kelseyyoung4@gmail.com>
Date: Mon, 5 Mar 2018 15:27:28 -0800
Subject: [PATCH 1508/1641] Add Keytip and KeytipLayer to experiments export
 (#4184)

* Add Keytips to src export to consume for testing

* Add exports for keytip utilities

* Add rush change file
---
 ...keytips-to-experiment-export_2018-03-05-23-11.json | 11 +++++++++++
 packages/experiments/src/Keytip.ts                    |  4 +++-
 packages/experiments/src/index.ts                     |  4 +++-
 .../experiments/src/utilities/keysequence/index.ts    |  2 ++
 packages/experiments/src/utilities/keytip/index.ts    |  3 +++
 5 files changed, 22 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/keyou-add-keytips-to-experiment-export_2018-03-05-23-11.json
 create mode 100644 packages/experiments/src/utilities/keysequence/index.ts
 create mode 100644 packages/experiments/src/utilities/keytip/index.ts

diff --git a/common/changes/@uifabric/experiments/keyou-add-keytips-to-experiment-export_2018-03-05-23-11.json b/common/changes/@uifabric/experiments/keyou-add-keytips-to-experiment-export_2018-03-05-23-11.json
new file mode 100644
index 0000000000000..fb80aad9828cf
--- /dev/null
+++ b/common/changes/@uifabric/experiments/keyou-add-keytips-to-experiment-export_2018-03-05-23-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Add Keytip and KeytipLayer to experiments export",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "keyou@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/Keytip.ts b/packages/experiments/src/Keytip.ts
index 0e3d31cfbafad..a1243d8c2ad1a 100644
--- a/packages/experiments/src/Keytip.ts
+++ b/packages/experiments/src/Keytip.ts
@@ -1 +1,3 @@
-export * from './components/Keytip/index';
\ No newline at end of file
+export * from './components/Keytip/index';
+export * from './utilities/keytip/index';
+export * from './utilities/keysequence/index';
\ No newline at end of file
diff --git a/packages/experiments/src/index.ts b/packages/experiments/src/index.ts
index 584e8cffa5718..1d10ae9a7d8af 100644
--- a/packages/experiments/src/index.ts
+++ b/packages/experiments/src/index.ts
@@ -6,4 +6,6 @@ export { TilesList } from './TilesList';
 export { CommandBar as ExperimentCommandBar } from './CommandBar';
 export { FloatingPeoplePicker } from './FloatingPicker';
 export { SelectedPeopleList } from './SelectedItemsList';
-export { ExtendedPeoplePicker } from './ExtendedPicker';
\ No newline at end of file
+export { ExtendedPeoplePicker } from './ExtendedPicker';
+export { Keytip } from './Keytip';
+export { KeytipLayer } from './KeytipLayer';
\ No newline at end of file
diff --git a/packages/experiments/src/utilities/keysequence/index.ts b/packages/experiments/src/utilities/keysequence/index.ts
new file mode 100644
index 0000000000000..ce0536414968a
--- /dev/null
+++ b/packages/experiments/src/utilities/keysequence/index.ts
@@ -0,0 +1,2 @@
+export * from './IKeySequence';
+export * from './IKeytipTransitionKey';
\ No newline at end of file
diff --git a/packages/experiments/src/utilities/keytip/index.ts b/packages/experiments/src/utilities/keytip/index.ts
new file mode 100644
index 0000000000000..2b45a08035998
--- /dev/null
+++ b/packages/experiments/src/utilities/keytip/index.ts
@@ -0,0 +1,3 @@
+export * from './KeytipManager';
+export * from './KeytipTree';
+export * from './KeytipUtils';
\ No newline at end of file

From 8a4dc859a5f8016b630220775caa98691ddf5345 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Mon, 5 Mar 2018 17:06:11 -0800
Subject: [PATCH 1509/1641] Website fix: Remove PureComponent (#4186)

* Replaced PureComponent with Component

* Added change file
---
 .../remove-pureComponent_2018-03-06-00-33.json        | 11 +++++++++++
 .../remove-pureComponent_2018-03-06-00-33.json        | 11 +++++++++++
 .../src/components/StaticList/StaticList.tsx          |  2 +-
 packages/utilities/src/Context.tsx                    |  2 +-
 4 files changed, 24 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/remove-pureComponent_2018-03-06-00-33.json
 create mode 100644 common/changes/@uifabric/utilities/remove-pureComponent_2018-03-06-00-33.json

diff --git a/common/changes/@uifabric/experiments/remove-pureComponent_2018-03-06-00-33.json b/common/changes/@uifabric/experiments/remove-pureComponent_2018-03-06-00-33.json
new file mode 100644
index 0000000000000..4d4f969aa52cf
--- /dev/null
+++ b/common/changes/@uifabric/experiments/remove-pureComponent_2018-03-06-00-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Replaced PureComponent with Component to appease website's UHF react version.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/remove-pureComponent_2018-03-06-00-33.json b/common/changes/@uifabric/utilities/remove-pureComponent_2018-03-06-00-33.json
new file mode 100644
index 0000000000000..127152bb92834
--- /dev/null
+++ b/common/changes/@uifabric/utilities/remove-pureComponent_2018-03-06-00-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Replaced PureComponent with Component to appease website's UHF react version.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/StaticList/StaticList.tsx b/packages/experiments/src/components/StaticList/StaticList.tsx
index 3c6ca4f5938e9..d82897bdf2d84 100644
--- a/packages/experiments/src/components/StaticList/StaticList.tsx
+++ b/packages/experiments/src/components/StaticList/StaticList.tsx
@@ -5,7 +5,7 @@ import { IStaticListProps } from './StaticList.types';
 
 import * as stylesImport from './StaticList.scss';
 
-export class StaticList<TItem extends IObjectWithKey> extends React.PureComponent<IStaticListProps<TItem>> {
+export class StaticList<TItem extends IObjectWithKey> extends React.Component<IStaticListProps<TItem>> {
   public render(): JSX.Element {
     const {
       className,
diff --git a/packages/utilities/src/Context.tsx b/packages/utilities/src/Context.tsx
index d0361465a0a8c..f145cae8c7b56 100644
--- a/packages/utilities/src/Context.tsx
+++ b/packages/utilities/src/Context.tsx
@@ -6,7 +6,7 @@ export function provideContext<TContext, TProps>(
   contextTypes: PropTypes.ValidationMap<TContext>,
   mapPropsToContext: (props: TProps) => TContext
 ): React.ComponentType<TProps & React.Props<{}>> {
-  class Provider extends React.PureComponent<TProps> {
+  class Provider extends React.Component<TProps> {
     public static readonly childContextTypes: PropTypes.ValidationMap<TContext> = contextTypes;
 
     public getChildContext(): TContext {

From 68b0c8b7ae1c1ef5a9932ea786f37df71ce06e7b Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Mon, 5 Mar 2018 17:07:52 -0800
Subject: [PATCH 1510/1641] Addressing Issue #4174 - 5.59.0 crashing in
 <ImageBase> (#4185)

* commented out @customizable decorator in Image.base

* rush change
---
 .../image-decorator-fix_2018-03-06-00-27.json         | 11 +++++++++++
 .../src/components/Image/Image.base.tsx               |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/image-decorator-fix_2018-03-06-00-27.json

diff --git a/common/changes/office-ui-fabric-react/image-decorator-fix_2018-03-06-00-27.json b/common/changes/office-ui-fabric-react/image-decorator-fix_2018-03-06-00-27.json
new file mode 100644
index 0000000000000..cd92675be617c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/image-decorator-fix_2018-03-06-00-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Temporarily commented out @customizable decorator in Image component to restore usage of static functions and variables.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx
index ce2ebe0699bc5..1fe6bc5970c17 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx
@@ -5,7 +5,7 @@ import {
   autobind,
   BaseComponent,
   classNamesFunction,
-  customizable,
+  // customizable,
   getNativeProps,
   imageProperties
 } from '../../Utilities';
@@ -26,7 +26,7 @@ export interface IImageState {
 
 const KEY_PREFIX = 'fabricImage';
 
-@customizable('Image', ['theme'])
+// @customizable('Image', ['theme'])
 export class ImageBase extends BaseComponent<IImageProps, IImageState> {
   public static defaultProps = {
     shouldFadeIn: true

From 20dcbacbe51ea62308ebc3650940ced9d4e03b20 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 5 Mar 2018 18:06:59 -0800
Subject: [PATCH 1511/1641] Applying package updates.

---
 ...to-experiment-export_2018-03-05-23-11.json | 11 ---------
 ...remove-pureComponent_2018-03-06-00-33.json | 11 ---------
 ...remove-pureComponent_2018-03-06-00-33.json | 11 ---------
 .../image-decorator-fix_2018-03-06-00-27.json | 11 ---------
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/CHANGELOG.json           | 24 +++++++++++++++++++
 packages/experiments/CHANGELOG.md             | 10 +++++++-
 packages/experiments/package.json             |  4 ++--
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 +++++++++++
 packages/utilities/CHANGELOG.md               |  9 ++++++-
 packages/utilities/package.json               |  2 +-
 15 files changed, 89 insertions(+), 54 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/keyou-add-keytips-to-experiment-export_2018-03-05-23-11.json
 delete mode 100644 common/changes/@uifabric/experiments/remove-pureComponent_2018-03-06-00-33.json
 delete mode 100644 common/changes/@uifabric/utilities/remove-pureComponent_2018-03-06-00-33.json
 delete mode 100644 common/changes/office-ui-fabric-react/image-decorator-fix_2018-03-06-00-27.json

diff --git a/common/changes/@uifabric/experiments/keyou-add-keytips-to-experiment-export_2018-03-05-23-11.json b/common/changes/@uifabric/experiments/keyou-add-keytips-to-experiment-export_2018-03-05-23-11.json
deleted file mode 100644
index fb80aad9828cf..0000000000000
--- a/common/changes/@uifabric/experiments/keyou-add-keytips-to-experiment-export_2018-03-05-23-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Add Keytip and KeytipLayer to experiments export",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "keyou@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/remove-pureComponent_2018-03-06-00-33.json b/common/changes/@uifabric/experiments/remove-pureComponent_2018-03-06-00-33.json
deleted file mode 100644
index 4d4f969aa52cf..0000000000000
--- a/common/changes/@uifabric/experiments/remove-pureComponent_2018-03-06-00-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Replaced PureComponent with Component to appease website's UHF react version.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/remove-pureComponent_2018-03-06-00-33.json b/common/changes/@uifabric/utilities/remove-pureComponent_2018-03-06-00-33.json
deleted file mode 100644
index 127152bb92834..0000000000000
--- a/common/changes/@uifabric/utilities/remove-pureComponent_2018-03-06-00-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Replaced PureComponent with Component to appease website's UHF react version.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/image-decorator-fix_2018-03-06-00-27.json b/common/changes/office-ui-fabric-react/image-decorator-fix_2018-03-06-00-27.json
deleted file mode 100644
index cd92675be617c..0000000000000
--- a/common/changes/office-ui-fabric-react/image-decorator-fix_2018-03-06-00-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Temporarily commented out @customizable decorator in Image component to restore usage of static functions and variables.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index a97a175e8cbbb..931477d473350 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.19.0 <6.0.0",
-    "@uifabric/utilities": ">=5.14.0 <6.0.0",
+    "@uifabric/utilities": ">=5.14.1 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index d91b52f518540..125314548389c 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.23.1",
+      "tag": "@uifabric/experiments_v5.23.1",
+      "date": "Tue, 06 Mar 2018 02:06:59 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Kelsey Young <kelseyyoung4@gmail.com>",
+            "commit": "caad61fa2976154001c279b61ea0f597752f1115",
+            "comment": "Add Keytip and KeytipLayer to experiments export"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "8a4dc859a5f8016b630220775caa98691ddf5345",
+            "comment": "Replaced PureComponent with Component to appease website's UHF react version."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.59.0 <6.0.0` to `>=5.59.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.23.0",
       "tag": "@uifabric/experiments_v5.23.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 0d83850f7d53f..6b1d5d2109874 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Mon, 05 Mar 2018 11:16:58 GMT and should not be manually modified.
+This log was last generated on Tue, 06 Mar 2018 02:06:59 GMT and should not be manually modified.
+
+## 5.23.1
+Tue, 06 Mar 2018 02:06:59 GMT
+
+### Patches
+
+- Add Keytip and KeytipLayer to experiments export
+- Replaced PureComponent with Component to appease website's UHF react version.
 
 ## 5.23.0
 Mon, 05 Mar 2018 11:16:58 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index b004308756291..e5b156e3b80e8 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.23.0",
+  "version": "5.23.1",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.59.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.59.1 <6.0.0",
     "@uifabric/icons": ">=5.5.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 86f70214bbacc..71f4efa860d4a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.59.1",
+      "tag": "office-ui-fabric-react_v5.59.1",
+      "date": "Tue, 06 Mar 2018 02:06:59 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "68b0c8b7ae1c1ef5a9932ea786f37df71ce06e7b",
+            "comment": "Temporarily commented out @customizable decorator in Image component to restore usage of static functions and variables."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.14.0 <6.0.0` to `>=5.14.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.59.0",
       "tag": "office-ui-fabric-react_v5.59.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index a7e609493a9bf..ff31c3a901ece 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 05 Mar 2018 11:16:58 GMT and should not be manually modified.
+This log was last generated on Tue, 06 Mar 2018 02:06:59 GMT and should not be manually modified.
+
+## 5.59.1
+Tue, 06 Mar 2018 02:06:59 GMT
+
+### Patches
+
+- Temporarily commented out @customizable decorator in Image component to restore usage of static functions and variables.
 
 ## 5.59.0
 Mon, 05 Mar 2018 11:16:58 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index d85e2a22d522d..b30f26c503526 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.59.0",
+  "version": "5.59.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -51,7 +51,7 @@
     "@uifabric/icons": ">=5.5.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "@uifabric/styling": ">=5.19.0 <6.0.0",
-    "@uifabric/utilities": ">=5.14.0 <6.0.0",
+    "@uifabric/utilities": ">=5.14.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 8979350605206..49171b0e2aea7 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.14.0 <6.0.0",
+    "@uifabric/utilities": ">=5.14.1 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 413cfc1f91841..d2b731859f3c7 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.14.1",
+      "tag": "@uifabric/utilities_v5.14.1",
+      "date": "Tue, 06 Mar 2018 02:06:59 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "8a4dc859a5f8016b630220775caa98691ddf5345",
+            "comment": "Replaced PureComponent with Component to appease website's UHF react version."
+          }
+        ]
+      }
+    },
     {
       "version": "5.14.0",
       "tag": "@uifabric/utilities_v5.14.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index e552bc5a1bd05..3ee25ec70b16e 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Fri, 02 Mar 2018 11:25:35 GMT and should not be manually modified.
+This log was last generated on Tue, 06 Mar 2018 02:06:59 GMT and should not be manually modified.
+
+## 5.14.1
+Tue, 06 Mar 2018 02:06:59 GMT
+
+### Patches
+
+- Replaced PureComponent with Component to appease website's UHF react version.
 
 ## 5.14.0
 Fri, 02 Mar 2018 11:25:35 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 93daa60c82aee..1cc4de46bd65f 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.14.0",
+  "version": "5.14.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 0ccc7bd7d7323c677a8c7ec4f2d1885ba653cbac Mon Sep 17 00:00:00 2001
From: FalseLobster <aliciakds88@gmail.com>
Date: Mon, 5 Mar 2018 21:28:18 -0800
Subject: [PATCH 1512/1641] Facepile conditionally rendering aria-describedby
 (#4183)

* Fix Facepile aria description

* Adding changefile
---
 .../FirstBug_2018-03-05-22-47.json                    | 11 +++++++++++
 .../src/components/Facepile/Facepile.tsx              |  3 ++-
 .../Facepile/__snapshots__/Facepile.test.tsx.snap     |  2 +-
 .../Facepile/examples/Facepile.Basic.Example.tsx      |  2 +-
 4 files changed, 15 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/FirstBug_2018-03-05-22-47.json

diff --git a/common/changes/office-ui-fabric-react/FirstBug_2018-03-05-22-47.json b/common/changes/office-ui-fabric-react/FirstBug_2018-03-05-22-47.json
new file mode 100644
index 0000000000000..e7556ba101c95
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/FirstBug_2018-03-05-22-47.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Facepile: Conditionally apply `aria-describedby` only when `ariaDescription` is provided",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "adrum@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
index 2270fc6e2b400..042e96e63df26 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
@@ -48,6 +48,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
   public render(): JSX.Element {
     let { overflowButtonProps } = this.props;
     const {
+      ariaDescription,
       chevronButtonProps,
       maxDisplayablePersonas,
       className,
@@ -69,7 +70,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
           { showAddButton ? this._getAddNewElement() : null }
           { this.onRenderAriaDescription() }
           <FocusZone
-            ariaDescribedBy={ this._ariaDescriptionId }
+            ariaDescribedBy={ ariaDescription && this._ariaDescriptionId }
             role='listbox'
             className={ css('ms-Facepile-members', styles.members) }
             direction={ FocusZoneDirection.horizontal }
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
index f247cc1b3709e..c1be4d56cbdd8 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
@@ -8,7 +8,7 @@ exports[`Facepile renders Facepile correctly 1`] = `
     className="ms-Facepile-itemContainer"
   >
     <div
-      aria-describedby="id__0"
+      aria-describedby={undefined}
       aria-labelledby={undefined}
       className="ms-FocusZone ms-Facepile-members"
       data-focuszone-id="FocusZone1"
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
index 23744c0c47153..1796e3f08da4a 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
@@ -43,7 +43,7 @@ export class FacepileBasicExample extends React.Component<{}, IFacepileBasicExam
 
     return (
       <div className={ 'ms-FacepileExample' }>
-        <Facepile {...facepileProps} />
+        <Facepile { ...facepileProps } />
         <div className={ 'control' }>
           <Slider
             label='Number of Personas:'

From 4368015261d01c1287ded8fb360ac126908a1813 Mon Sep 17 00:00:00 2001
From: Andrew <jabbrass@zoho.com>
Date: Mon, 5 Mar 2018 22:44:19 -0800
Subject: [PATCH 1513/1641] [Pickers] Add async debounce option to BasePicker
 (#4163)

---
 .../basepicker-async-debounce_2018-03-02-17-42.json  | 11 +++++++++++
 .../src/components/pickers/BasePicker.tsx            | 12 ++++++++++--
 .../src/components/pickers/BasePicker.types.ts       |  7 +++++++
 .../examples/PeoplePicker.Types.Example.tsx          |  7 +++++++
 4 files changed, 35 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/basepicker-async-debounce_2018-03-02-17-42.json

diff --git a/common/changes/office-ui-fabric-react/basepicker-async-debounce_2018-03-02-17-42.json b/common/changes/office-ui-fabric-react/basepicker-async-debounce_2018-03-02-17-42.json
new file mode 100644
index 0000000000000..217fc2af92134
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/basepicker-async-debounce_2018-03-02-17-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add async debounce option to BasePicker",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jabrassi@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 66aaaf334a57c..241d0f9f61f2c 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -74,6 +74,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   public componentDidMount() {
     this.selection.setItems(this.state.items);
+    this._onResolveSuggestions = this._async.debounce(this._onResolveSuggestions, this.props.resolveDelay);
   }
 
   public componentWillReceiveProps(newProps: P) {
@@ -313,8 +314,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   }
 
   protected updateValue(updatedValue: string) {
-    const suggestions: T[] | PromiseLike<T[]> = this.props.onResolveSuggestions(updatedValue, this.state.items);
-    this.updateSuggestionsList(suggestions, updatedValue);
+    this._onResolveSuggestions(updatedValue);
   }
 
   protected updateSuggestionsList(suggestions: T[] | PromiseLike<T[]>, updatedValue?: string) {
@@ -683,6 +683,14 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     this.onChange(items);
   }
 
+  private _onResolveSuggestions(updatedValue: string): void {
+    const suggestions: T[] | PromiseLike<T[]> | null = this.props.onResolveSuggestions(updatedValue, this.state.items);
+
+    if (suggestions !== null) {
+      this.updateSuggestionsList(suggestions, updatedValue);
+    }
+  }
+
   private _onValidateInput() {
     if (this.props.onValidateInput && (this.props.onValidateInput as any)(this.input.value) !== ValidationState.invalid && this.props.createGenericItem) {
       const itemToConvert = this.props.createGenericItem(this.input.value, this.props.onValidateInput(this.input.value));
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts
index d8841b5265c0f..de2cb6acb91cb 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts
@@ -33,8 +33,15 @@ export interface IBasePickerProps<T> extends React.Props<any> {
   /**
    * A callback for what should happen when a person types text into the input.
    * Returns the already selected items so the resolver can filter them out.
+   * If used in conjunction with resolveDelay this will ony kick off after the delay throttle.
    */
   onResolveSuggestions: (filter: string, selectedItems?: T[]) => T[] | PromiseLike<T[]>;
+  /**
+   * The delay time in ms before resolving suggestions, which is kicked off when input has been cahnged.
+   * e.g. If a second input change happens within the resolveDelay time, the timer will start over.
+   * Only until after the timer completes will onResolveSuggestions be called.
+   */
+  resolveDelay?: number;
   /**
    * A callback for what should happen when a user clicks the input.
    */
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index 9e0ee4a011c86..c6057aa9bdece 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -151,6 +151,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
           'aria-label': 'People Picker'
         } }
         componentRef={ this._resolveRef('_picker') }
+        resolveDelay={ 300 }
       />
     );
   }
@@ -174,6 +175,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
         } }
         componentRef={ this._resolveRef('_picker') }
         onInputChange={ this._onInputChange }
+        resolveDelay={ 300 }
       />
     );
   }
@@ -194,6 +196,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
           'aria-label': 'People Picker'
         } }
         componentRef={ this._resolveRef('_picker') }
+        resolveDelay={ 300 }
       />
     );
   }
@@ -216,6 +219,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
           'aria-label': 'People Picker'
         } }
         componentRef={ this._resolveRef('_picker') }
+        resolveDelay={ 300 }
       />
     );
   }
@@ -238,6 +242,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
           'aria-label': 'People Picker'
         } }
         componentRef={ this._resolveRef('_picker') }
+        resolveDelay={ 300 }
       />
     );
   }
@@ -260,6 +265,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
           'aria-label': 'People Picker'
         } }
         componentRef={ this._resolveRef('_picker') }
+        resolveDelay={ 300 }
       />
     );
   }
@@ -287,6 +293,7 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
             onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called')
           } }
           componentRef={ this._resolveRef('_picker') }
+          resolveDelay={ 300 }
         />
         <label> Click to Add a person </label>
         { controlledItems.map((item, index) => <div key={ index }>

From 25e736fb4506e1021274c420283338e499388477 Mon Sep 17 00:00:00 2001
From: Mark Polak <mark@thedutchies.com>
Date: Tue, 6 Mar 2018 07:45:29 +0100
Subject: [PATCH 1514/1641] Polyfill react create ref (#4182)

* Initial implementation of React.createRef polyfill

* Updates based on feedback

* Updates to components with refs

* Fix Type

* Fix lint

* Revert to original Experiment

* Fix typing

* Add typedef to docs

* Add change files

* Remove empty change files
---
 apps/todo-app/src/components/TodoForm.tsx     | 17 ++++---
 ...fill-react-createRef_2018-03-05-22-18.json | 11 +++++
 ghdocs/BESTPRACTICES.md                       |  8 ++--
 .../src/components/Highlight/Highlight.tsx    |  9 ++--
 .../components/CommandBar/CommandBar.base.tsx | 20 ++++----
 .../ExtendedPicker/BaseExtendedPicker.tsx     |  2 +-
 .../FloatingPicker/BaseFloatingPicker.tsx     | 40 +++++++++-------
 .../BaseFloatingPicker.types.ts               |  4 +-
 .../SelectedPeopleList/Items/EditingItem.tsx  | 30 ++++++++----
 .../Items/ExtendedSelectedItem.tsx            |  6 +--
 .../VirtualizedList/VirtualizedList.tsx       |  8 ++--
 .../src/components/Autofill/Autofill.test.tsx | 10 ++--
 .../src/components/Autofill/Autofill.tsx      | 40 +++++++++-------
 .../src/components/Autofill/Autofill.types.ts |  2 +-
 .../src/components/Button/BaseButton.tsx      | 17 +++----
 .../src/components/Calendar/Calendar.tsx      | 23 ++++-----
 .../src/components/ComboBox/ComboBox.tsx      |  6 ++-
 .../src/components/CommandBar/CommandBar.tsx  | 47 +++++++++++--------
 packages/utilities/src/createRef.test.ts      | 26 ++++++++++
 packages/utilities/src/createRef.ts           | 13 +++++
 packages/utilities/src/index.ts               |  1 +
 21 files changed, 219 insertions(+), 121 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/polyfill-react-createRef_2018-03-05-22-18.json
 create mode 100644 packages/utilities/src/createRef.test.ts
 create mode 100644 packages/utilities/src/createRef.ts

diff --git a/apps/todo-app/src/components/TodoForm.tsx b/apps/todo-app/src/components/TodoForm.tsx
index 2f99f5644c283..e1cfc05dddb08 100644
--- a/apps/todo-app/src/components/TodoForm.tsx
+++ b/apps/todo-app/src/components/TodoForm.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { autobind, BaseComponent, IBaseProps } from 'office-ui-fabric-react/lib/Utilities';
+import { autobind, BaseComponent, IBaseProps, createRef, RefObject } from 'office-ui-fabric-react/lib/Utilities';
 import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
 import { TextField, ITextField } from 'office-ui-fabric-react/lib/TextField';
 import * as stylesImport from './Todo.scss';
@@ -42,7 +42,7 @@ export interface ITodoFormState {
  * Button: https://fabricreact.azurewebsites.net/fabric-react/master/#/examples/button
  */
 export default class TodoForm extends BaseComponent<ITodoFormProps, ITodoFormState> {
-  private _textField!: ITextField;
+  private _textField: RefObject<ITextField> = createRef<ITextField>();
 
   constructor(props: ITodoFormProps) {
     super(props);
@@ -62,7 +62,7 @@ export default class TodoForm extends BaseComponent<ITodoFormProps, ITodoFormSta
         <TextField
           className={ styles.textField }
           value={ this.state.inputValue }
-          componentRef={ this._resolveRef('_textField') }
+          componentRef={ this._textField }
           placeholder={ strings.inputBoxPlaceholder }
           onBeforeChange={ this._onBeforeTextFieldChange }
           autoComplete='off'
@@ -82,18 +82,23 @@ export default class TodoForm extends BaseComponent<ITodoFormProps, ITodoFormSta
   private _onSubmit(event: React.FormEvent<HTMLElement>): void {
     event.preventDefault();
 
-    if (!this._getTitleErrorMessage(this._textField.value || '')) {
+    const { value: textField } = this._textField;
+    if (!textField) {
+      return;
+    }
+
+    if (!this._getTitleErrorMessage(textField.value || '')) {
       this.setState({
         inputValue: ''
       } as ITodoFormState);
 
-      this.props.onSubmit(this._textField.value || '');
+      this.props.onSubmit(textField.value || '');
     } else {
       this.setState({
         errorMessage: this._getTitleErrorMessage(this.state.inputValue)
       } as ITodoFormState);
 
-      this._textField.focus();
+      textField.focus();
     }
   }
 
diff --git a/common/changes/@uifabric/utilities/polyfill-react-createRef_2018-03-05-22-18.json b/common/changes/@uifabric/utilities/polyfill-react-createRef_2018-03-05-22-18.json
new file mode 100644
index 0000000000000..8a98757068a6d
--- /dev/null
+++ b/common/changes/@uifabric/utilities/polyfill-react-createRef_2018-03-05-22-18.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Adds createRef polyfil to prepare for object refs.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/ghdocs/BESTPRACTICES.md b/ghdocs/BESTPRACTICES.md
index 203dd70c0aed6..65ebc5fd24ec6 100644
--- a/ghdocs/BESTPRACTICES.md
+++ b/ghdocs/BESTPRACTICES.md
@@ -172,13 +172,15 @@ public render() {
 }
 ```
 
-Best, use _resolveRef in BaseComponent:
+Best, use createRef:
 ```typescript
+import { createRef, RefObject } from 'office-ui-fabric-react/lib/Utilities';
+
 class Foo extends BaseComponent<...> {
-  private _root: HTMLElement;
+  private _root: RefObject<HTMLElement> = createRef<HTMLElement>();
 
   public render() {
-    return <div ref={ this._resolveRef('_root') } />;
+    return <div ref={ _root } />;
   }
 }
 ```
diff --git a/packages/example-app-base/src/components/Highlight/Highlight.tsx b/packages/example-app-base/src/components/Highlight/Highlight.tsx
index bec5eb68d3d58..7e5e981c98a06 100644
--- a/packages/example-app-base/src/components/Highlight/Highlight.tsx
+++ b/packages/example-app-base/src/components/Highlight/Highlight.tsx
@@ -2,6 +2,7 @@ import * as React from 'react';
 import { registerLanguage, highlightBlock } from 'highlight.js';
 import * as javascript from 'highlight.js/lib/languages/javascript';
 import { BaseComponent } from 'office-ui-fabric-react/lib/Utilities';
+import { RefObject, createRef } from '@uifabric/utilities/lib/createRef';
 
 registerLanguage('javascript', javascript);
 
@@ -10,13 +11,13 @@ export interface IHighlightProps extends React.HTMLAttributes<HTMLDivElement> {
 }
 
 export class Highlight extends BaseComponent<IHighlightProps, {}> {
-  private _codeElement: HTMLElement;
+  private _codeElement: RefObject<HTMLElement> = createRef<HTMLElement>();
 
   public render(): JSX.Element {
     return (
       <pre>
         <code
-          ref={ this._resolveRef('_codeElement') }
+          ref={ this._codeElement }
           className='javascript'
         >
           { this.props.children }
@@ -30,6 +31,8 @@ export class Highlight extends BaseComponent<IHighlightProps, {}> {
   }
 
   public componentDidMount(): void {
-    highlightBlock(this._codeElement);
+    if (this._codeElement.value) {
+      highlightBlock(this._codeElement.value);
+    }
   }
 }
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.base.tsx b/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
index 150dfbf4ed8f3..ea07b896abe91 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
@@ -17,7 +17,9 @@ import { OverflowSet, IOverflowSet } from 'office-ui-fabric-react/lib/OverflowSe
 import { ResizeGroup, IResizeGroup } from 'office-ui-fabric-react/lib/ResizeGroup';
 import { TooltipHost } from 'office-ui-fabric-react/lib/Tooltip';
 import {
-  classNamesFunction
+  classNamesFunction,
+  createRef,
+  RefObject
 } from '../../Utilities';
 
 const getClassNames = classNamesFunction<ICommandBarStyleProps, ICommandBarStyles>();
@@ -54,8 +56,8 @@ export class CommandBarBase extends BaseComponent<ICommandBarProps, {}> implemen
     elipisisIconProps: { iconName: 'More' }
   };
 
-  private _overflowSet: IOverflowSet;
-  private _resizeGroup: IResizeGroup;
+  private _overflowSet: RefObject<IOverflowSet> = createRef<IOverflowSet>();
+  private _resizeGroup: RefObject<IResizeGroup> = createRef<IResizeGroup>();
   private _classNames: {[key in keyof ICommandBarStyles]: string };
 
   public render(): JSX.Element {
@@ -88,7 +90,7 @@ export class CommandBarBase extends BaseComponent<ICommandBarProps, {}> implemen
 
     return (
       <ResizeGroup
-        componentRef={ this._resolveRef('_resizeGroup') }
+        componentRef={ this._resizeGroup }
         className={ className }
         data={ commandBardata }
         onReduceData={ onReduceData }
@@ -100,7 +102,7 @@ export class CommandBarBase extends BaseComponent<ICommandBarProps, {}> implemen
 
               {/*Primary Items*/ }
               <OverflowSet
-                componentRef={ this._resolveRef('_overflowSet') }
+                componentRef={ this._overflowSet }
                 className={ css(this._classNames.primarySet) }
                 items={ data.primaryItems }
                 overflowItems={ data.overflowItems.length ? data.overflowItems : undefined }
@@ -134,11 +136,13 @@ export class CommandBarBase extends BaseComponent<ICommandBarProps, {}> implemen
   }
 
   public focus(): void {
-    this._overflowSet.focus();
+    const { value: overflowSet } = this._overflowSet;
+
+    overflowSet && overflowSet.focus();
   }
 
   public remeasure(): void {
-    this._resizeGroup.remeasure();
+    this._resizeGroup.value && this._resizeGroup.value.remeasure();
   }
 
   private _computeCacheKey(primaryItems: ICommandBarItemProps[], farItems: ICommandBarItemProps[], overflow: boolean): string {
@@ -235,6 +239,6 @@ export class CommandBarBase extends BaseComponent<ICommandBarProps, {}> implemen
   @autobind
   private _onRenderButton(props: ICommandBarItemProps): JSX.Element {
     // tslint:disable-next-line:no-any
-    return <CommandBarButton {...props as any} />;
+    return <CommandBarButton { ...props as any } />;
   }
 }
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
index 3430f31ece89e..1c3b5246809db 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
@@ -73,7 +73,7 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
     this.focusZone.focus();
   }
 
-  public get inputElement(): HTMLInputElement {
+  public get inputElement(): HTMLInputElement | null {
     return this.input.inputElement;
   }
 
diff --git a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
index b30e4fd5bd6e5..5767a8170ce64 100644
--- a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
+++ b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
@@ -4,7 +4,9 @@ import {
   KeyCodes,
   autobind,
   css,
-  getRTL
+  getRTL,
+  createRef,
+  RefObject
 } from '../../Utilities';
 import { Callout, DirectionalHint } from 'office-ui-fabric-react/lib/Callout';
 import { Suggestions, ISuggestionsProps, SuggestionsController, IBasePickerSuggestionsProps, ISuggestionModel }
@@ -30,12 +32,12 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
   implements IBaseFloatingPicker {
   protected selection: Selection;
 
-  protected root: HTMLElement;
-  protected suggestionElement: Suggestions<T>;
+  protected root: RefObject<HTMLDivElement> = createRef<HTMLDivElement>();
+  protected suggestionElement: RefObject<Suggestions<T>> = createRef<Suggestions<T>>();
 
   protected suggestionStore: SuggestionsController<T>;
   protected SuggestionOfProperType: new (props: ISuggestionsProps<T>) => Suggestions<T> =
-  Suggestions as new (props: ISuggestionsProps<T>) => Suggestions<T>;
+    Suggestions as new (props: ISuggestionsProps<T>) => Suggestions<T>;
   protected loadingTimer: number | undefined;
   // tslint:disable-next-line:no-any
   protected currentPromise: PromiseLike<any>;
@@ -154,7 +156,7 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
     let { className } = this.props;
     return (
       <div
-        ref={ this._resolveRef('root') }
+        ref={ this.root }
         className={ css('ms-BasePicker', className ? className : '') }
       >
         { this.renderSuggestions() }
@@ -187,7 +189,7 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
           onSuggestionClick={ this.onSuggestionClick }
           onSuggestionRemove={ this.onSuggestionRemove }
           suggestions={ this.suggestionStore.getSuggestions() }
-          ref={ this._resolveRef('suggestionElement') }
+          ref={ this.suggestionElement }
           onGetMoreResults={ this.onGetMoreResults }
           moreSuggestionsAvailable={ this.state.moreSuggestionsAvailable }
           isLoading={ this.state.suggestionsLoading }
@@ -195,7 +197,7 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
           isMostRecentlyUsedVisible={ this.state.isMostRecentlyUsedVisible }
           isResultsFooterVisible={ this.state.isResultsFooterVisible }
           refocusSuggestions={ this.refocusSuggestions }
-          {...this.props.pickerSuggestionsProps as IBasePickerSuggestionsProps}
+          { ...this.props.pickerSuggestionsProps as IBasePickerSuggestionsProps }
         />
       </Callout>
     ) : null;
@@ -324,7 +326,7 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
     ev: React.MouseEvent<HTMLElement>,
     item: T,
     index: number
-    ): void {
+  ): void {
     this.onChange(item);
   }
 
@@ -333,7 +335,7 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
     ev: React.MouseEvent<HTMLElement>,
     item: T,
     index: number
-    ): void {
+  ): void {
     if (this.props.onRemoveSuggestion) {
       (this.props.onRemoveSuggestion as ((item: T) => void))(item);
     }
@@ -348,6 +350,7 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
       return;
     }
     let keyCode = ev.which;
+    let { value: suggestionElement } = this.suggestionElement;
     switch (keyCode) {
       case KeyCodes.escape:
         this.setState({ suggestionsVisible: false });
@@ -357,8 +360,8 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
 
       case KeyCodes.tab:
       case KeyCodes.enter:
-        if (this.suggestionElement.hasSuggestedActionSelected()) {
-          this.suggestionElement.executeSelectedAction();
+        if (suggestionElement && suggestionElement.hasSuggestedActionSelected()) {
+          suggestionElement.executeSelectedAction();
         } else if (!ev.shiftKey &&
           !ev.ctrlKey &&
           this.suggestionStore.hasSelectedSuggestion()) {
@@ -386,16 +389,16 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
         break;
 
       case KeyCodes.up:
-        if (this.suggestionElement.tryHandleKeyDown(keyCode, this.suggestionStore.currentIndex)) {
+        if (suggestionElement && suggestionElement.tryHandleKeyDown(keyCode, this.suggestionStore.currentIndex)) {
           ev.preventDefault();
           ev.stopPropagation();
         } else {
-          if (this.suggestionElement.hasSuggestedAction() &&
+          if (suggestionElement && suggestionElement.hasSuggestedAction() &&
             this.suggestionStore.currentIndex === 0
           ) {
             ev.preventDefault();
             ev.stopPropagation();
-            this.suggestionElement.focusAboveSuggestions();
+            suggestionElement.focusAboveSuggestions();
             this.suggestionStore.deselectAllSuggestions();
             this.forceUpdate();
           } else {
@@ -409,18 +412,19 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
         break;
 
       case KeyCodes.down:
-        if (this.suggestionElement.tryHandleKeyDown(keyCode, this.suggestionStore.currentIndex)) {
+        if (suggestionElement && suggestionElement.tryHandleKeyDown(keyCode, this.suggestionStore.currentIndex)) {
           ev.preventDefault();
           ev.stopPropagation();
         } else {
           if (
-            this.suggestionElement.hasSuggestedAction() &&
+            suggestionElement &&
+            suggestionElement.hasSuggestedAction() &&
             this.suggestionStore.currentIndex + 1 ===
             this.suggestionStore.suggestions.length
           ) {
             ev.preventDefault();
             ev.stopPropagation();
-            this.suggestionElement.focusBelowSuggestions();
+            suggestionElement.focusBelowSuggestions();
             this.suggestionStore.deselectAllSuggestions();
             this.forceUpdate();
           } else {
@@ -496,7 +500,7 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
       ) => ISuggestionModel<T>))(
         this.state.queryString,
         (this.props.onValidateInput as ((input: string) => boolean))(this.state.queryString)
-        );
+      );
       this.suggestionStore.createGenericSuggestion(itemToConvert);
       this.completeSuggestion();
     }
diff --git a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts
index e12e929569c8d..3d960290cb61c 100644
--- a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts
+++ b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.types.ts
@@ -21,7 +21,7 @@ export interface IBaseFloatingPicker {
 // displaying persona's than type T could either be of Persona or Ipersona props
 // tslint:disable-next-line:no-any
 export interface IBaseFloatingPickerProps<T> extends React.Props<any> {
-  componentRef?: (component?: IBaseFloatingPicker) => void;
+  componentRef?: (component?: IBaseFloatingPicker | null) => void;
 
   /** The suggestions controller */
   suggestionsController: SuggestionsController<T>;
@@ -34,7 +34,7 @@ export interface IBaseFloatingPickerProps<T> extends React.Props<any> {
   /**
    * The input element to listen on events
    */
-  inputElement?: HTMLElement;
+  inputElement?: HTMLElement | null;
 
   /**
    * Function that specifies how an individual suggestion item will appear.
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx
index 34b7a3230df6a..c88b0d72ea96f 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx
@@ -1,7 +1,17 @@
 /* tslint:disable */
 import * as React from 'react';
 /* tslint:enable */
-import { BaseComponent, KeyCodes, autobind, getId, getNativeProps, inputProperties, css } from '../../../../Utilities';
+import {
+  BaseComponent,
+  KeyCodes,
+  autobind,
+  getId,
+  getNativeProps,
+  inputProperties,
+  css,
+  createRef,
+  RefObject
+} from '../../../../Utilities';
 import { FloatingPeoplePicker, IBaseFloatingPickerProps } from '../../../../FloatingPicker';
 import { ISelectedPeopleItemProps } from '../SelectedPeopleList';
 import { IExtendedPersonaProps } from '../SelectedPeopleList';
@@ -23,7 +33,7 @@ export interface IEditingSelectedPeopleItemProps extends ISelectedPeopleItemProp
 
 export class EditingItem extends BaseComponent<IEditingSelectedPeopleItemProps, IPeoplePickerItemState> {
   private _editingInput: HTMLInputElement;
-  private _editingFloatingPicker: FloatingPeoplePicker;
+  private _editingFloatingPicker: RefObject<FloatingPeoplePicker> = createRef<FloatingPeoplePicker>();
   private _onRenderFloatingPicker: (props: IBaseFloatingPickerProps<IExtendedPersonaProps>) => JSX.Element;
   private _floatingPickerProps: IBaseFloatingPickerProps<IExtendedPersonaProps>;
 
@@ -39,7 +49,7 @@ export class EditingItem extends BaseComponent<IEditingSelectedPeopleItemProps,
   public componentDidMount(): void {
     let getEditingItemText = this.props.getEditingItemText as (item: IExtendedPersonaProps) => string;
     let itemText = getEditingItemText(this.props.item);
-    this._editingFloatingPicker.onQueryStringChanged(itemText);
+    this._editingFloatingPicker.value && this._editingFloatingPicker.value.onQueryStringChanged(itemText);
     this._editingInput.value = itemText;
     this._editingInput.focus();
   }
@@ -51,7 +61,7 @@ export class EditingItem extends BaseComponent<IEditingSelectedPeopleItemProps,
     return (
       <div aria-labelledby={ 'editingItemPersona-' + itemId } className={ css('ms-EditingItem', styles.editingContainer) }>
         <input
-          { ...nativeProps}
+          { ...nativeProps }
           ref={ this._resolveInputRef }
           autoCapitalize={ 'off' }
           autoComplete={ 'off' }
@@ -71,7 +81,7 @@ export class EditingItem extends BaseComponent<IEditingSelectedPeopleItemProps,
   private _renderEditingSuggestions(): JSX.Element {
     let onRenderFloatingPicker = this._onRenderFloatingPicker;
     return (onRenderFloatingPicker({
-      componentRef: this._resolveRef('_editingFloatingPicker'),
+      componentRef: this._editingFloatingPicker,
       onChange: this._onSuggestionSelected,
       inputElement: this._editingInput,
       selectedItems: [],
@@ -88,13 +98,15 @@ export class EditingItem extends BaseComponent<IEditingSelectedPeopleItemProps,
 
   @autobind
   private _onInputClick(): void {
-    this._editingFloatingPicker.showPicker();
+    this._editingFloatingPicker.value && this._editingFloatingPicker.value.showPicker();
   }
 
   @autobind
   private _onInputBlur(ev: React.FocusEvent<HTMLElement>): void {
-    if (ev.relatedTarget === null || (ev.relatedTarget as HTMLElement).className.indexOf('ms-SearchMore-button') === -1) {
-      this._editingFloatingPicker.forceResolveSuggestion();
+    if (this._editingFloatingPicker.value &&
+      (ev.relatedTarget === null || (ev.relatedTarget as HTMLElement).className.indexOf('ms-SearchMore-button') === -1)
+    ) {
+      this._editingFloatingPicker.value.forceResolveSuggestion();
     }
   }
 
@@ -107,7 +119,7 @@ export class EditingItem extends BaseComponent<IEditingSelectedPeopleItemProps,
         this.props.onRemoveItem();
       }
     } else {
-      this._editingFloatingPicker.onQueryStringChanged(value);
+      this._editingFloatingPicker.value && this._editingFloatingPicker.value.onQueryStringChanged(value);
     }
   }
 
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx
index 5e0828ea315a3..e14a427f8850d 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx
@@ -1,7 +1,7 @@
 /* tslint:disable */
 import * as React from 'react';
 /* tslint:enable */
-import { BaseComponent, css, getId } from '../../../../Utilities';
+import { BaseComponent, css, getId, createRef, RefObject } from '../../../../Utilities';
 import { Persona, PersonaSize } from 'office-ui-fabric-react/lib/Persona';
 import { ISelectedPeopleItemProps } from '../SelectedPeopleList';
 import { IconButton } from 'office-ui-fabric-react/lib/Button';
@@ -14,7 +14,7 @@ export interface IPeoplePickerItemState {
 }
 
 export class ExtendedSelectedItem extends BaseComponent<ISelectedPeopleItemProps, IPeoplePickerItemState> {
-  protected persona: HTMLElement;
+  protected persona: RefObject<HTMLDivElement> = createRef<HTMLDivElement>();
 
   constructor(props: ISelectedPeopleItemProps) {
     super(props);
@@ -33,7 +33,7 @@ export class ExtendedSelectedItem extends BaseComponent<ISelectedPeopleItemProps
     const itemId = getId();
     return (
       <div
-        ref={ this._resolveRef('persona') }
+        ref={ this.persona }
         className={ css(
           'ms-PickerPersona-container',
           styles.personaContainer,
diff --git a/packages/experiments/src/components/VirtualizedList/VirtualizedList.tsx b/packages/experiments/src/components/VirtualizedList/VirtualizedList.tsx
index 79184324579f9..070e148e556ba 100644
--- a/packages/experiments/src/components/VirtualizedList/VirtualizedList.tsx
+++ b/packages/experiments/src/components/VirtualizedList/VirtualizedList.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { IVirtualizedListProps } from './VirtualizedList.types';
 import { IScrollContainerContext, ScrollContainerContextTypes } from '../../utilities/scrolling/ScrollContainer';
 import { IObjectWithKey } from 'office-ui-fabric-react/lib/Selection';
-import { BaseComponent, getParent, css, autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { BaseComponent, getParent, css, autobind, createRef, RefObject } from 'office-ui-fabric-react/lib/Utilities';
 
 interface IRange {
   /** Start of range */
@@ -26,7 +26,7 @@ export class VirtualizedList<TItem extends IObjectWithKey> extends BaseComponent
   public static contextTypes: typeof ScrollContainerContextTypes = ScrollContainerContextTypes;
   public context: IScrollContainerContext;
 
-  private _root: HTMLElement;
+  private _root: RefObject<HTMLDivElement> = createRef<HTMLDivElement>();
 
   private _spacerElements: { [key: string]: HTMLElement } = {};
 
@@ -80,7 +80,7 @@ export class VirtualizedList<TItem extends IObjectWithKey> extends BaseComponent
     return (
       <div
         className={ css('ms-VirtualizedList', className) }
-        ref={ this._resolveRef('_root') }
+        ref={ this._root }
       >
         { items }
       </div>
@@ -213,7 +213,7 @@ export class VirtualizedList<TItem extends IObjectWithKey> extends BaseComponent
   private _onFocus(ev: React.FocusEvent<HTMLDivElement>): void {
     let target = ev.target as HTMLElement;
 
-    while (target !== this._root) {
+    while (target !== this._root.value) {
       let indexString = target.getAttribute('data-selection-index');
 
       if (indexString) {
diff --git a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.test.tsx b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.test.tsx
index ba4d319b9c480..3ec42dccafdec 100644
--- a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.test.tsx
@@ -48,7 +48,7 @@ describe('Autofill', () => {
         onInputValueChange={ onInputValueChange }
         suggestedDisplayValue='hello'
       />, baseNode);
-    expect(autoFill.inputElement.value).toBe('hello');
+    expect(autoFill.inputElement && autoFill.inputElement.value).toBe('hello');
 
   });
 
@@ -56,7 +56,7 @@ describe('Autofill', () => {
     const onInputValueChange = (text: string | undefined): void => {
       expect(text).toBe('hep');
       expect(autoFill.value).toBe('hep');
-      expect(autoFill.inputElement.value).toBe('hep');
+      expect(autoFill.inputElement && autoFill.inputElement.value).toBe('hep');
       done();
     };
 
@@ -94,7 +94,7 @@ describe('Autofill', () => {
     ReactTestUtils.Simulate.input(autoFillInput);
 
     expect(autoFill.value).toBe('hel');
-    expect(autoFill.inputElement.value).toBe('hel');
+    expect(autoFill.inputElement && autoFill.inputElement.value).toBe('hel');
   });
 
   it('will autofill if keyCode up or down is pressed', () => {
@@ -110,7 +110,7 @@ describe('Autofill', () => {
     );
 
     expect(autoFill.value).toBe('hel');
-    expect(autoFill.inputElement.value).toBe('hel');
+    expect(autoFill.inputElement && autoFill.inputElement.value).toBe('hel');
 
     ReactTestUtils.Simulate.keyDown(autoFillInput, { keyCode: KeyCodes.left, which: KeyCodes.left });
 
@@ -129,6 +129,6 @@ describe('Autofill', () => {
     );
 
     expect(autoFill.value).toBe('hel');
-    expect(autoFill.inputElement.value).toBe('hello');
+    expect(autoFill.inputElement && autoFill.inputElement.value).toBe('hello');
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx
index 2f682eb269969..4e98a6cf270ee 100644
--- a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx
+++ b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx
@@ -5,7 +5,8 @@ import {
   KeyCodes,
   autobind,
   getNativeProps,
-  inputProperties
+  inputProperties,
+  createRef
 } from '../../Utilities';
 
 export interface IAutofillState {
@@ -21,7 +22,7 @@ export class Autofill extends BaseComponent<IAutofillProps, IAutofillState> impl
     enableAutofillOnKeyPress: [KeyCodes.down, KeyCodes.up]
   };
 
-  private _inputElement: HTMLInputElement;
+  private _inputElement = createRef<HTMLInputElement>();
   private _autoFillEnabled = true;
   private _value: string;
 
@@ -34,8 +35,8 @@ export class Autofill extends BaseComponent<IAutofillProps, IAutofillState> impl
   }
 
   public get cursorLocation(): number {
-    if (this._inputElement) {
-      const inputElement = this._inputElement;
+    if (this._inputElement.value) {
+      const inputElement = this._inputElement.value;
       if (inputElement.selectionDirection !== SELECTION_FORWARD) {
         return inputElement.selectionEnd;
       } else {
@@ -47,7 +48,7 @@ export class Autofill extends BaseComponent<IAutofillProps, IAutofillState> impl
   }
 
   public get isValueSelected(): boolean {
-    return this.inputElement.selectionStart !== this.inputElement.selectionEnd;
+    return Boolean(this.inputElement && (this.inputElement.selectionStart !== this.inputElement.selectionEnd));
   }
 
   public get value(): string {
@@ -55,15 +56,15 @@ export class Autofill extends BaseComponent<IAutofillProps, IAutofillState> impl
   }
 
   public get selectionStart(): number {
-    return this._inputElement ? this._inputElement.selectionStart : -1;
+    return this._inputElement.value ? this._inputElement.value.selectionStart : -1;
   }
 
   public get selectionEnd(): number {
-    return this._inputElement ? this._inputElement.selectionEnd : -1;
+    return this._inputElement.value ? this._inputElement.value.selectionEnd : -1;
   }
 
-  public get inputElement(): HTMLInputElement {
-    return this._inputElement;
+  public get inputElement(): HTMLInputElement | null {
+    return this._inputElement.value;
   }
 
   public componentWillReceiveProps(nextProps: IAutofillProps) {
@@ -95,14 +96,14 @@ export class Autofill extends BaseComponent<IAutofillProps, IAutofillState> impl
         shouldSelectFullRange = shouldSelectFullInputValueInComponentDidUpdate();
       }
 
-      if (shouldSelectFullRange) {
-        this._inputElement.setSelectionRange(0, suggestedDisplayValue.length, SELECTION_BACKWARD);
+      if (shouldSelectFullRange && this._inputElement.value) {
+        this._inputElement.value.setSelectionRange(0, suggestedDisplayValue.length, SELECTION_BACKWARD);
       } else {
         while (differenceIndex < value.length && value[differenceIndex].toLocaleLowerCase() === suggestedDisplayValue[differenceIndex].toLocaleLowerCase()) {
           differenceIndex++;
         }
-        if (differenceIndex > 0) {
-          this._inputElement.setSelectionRange(differenceIndex, suggestedDisplayValue.length, SELECTION_BACKWARD);
+        if (differenceIndex > 0 && this._inputElement.value) {
+          this._inputElement.value.setSelectionRange(differenceIndex, suggestedDisplayValue.length, SELECTION_BACKWARD);
         }
       }
     }
@@ -117,7 +118,7 @@ export class Autofill extends BaseComponent<IAutofillProps, IAutofillState> impl
     return (
       <input
         { ...nativeProps }
-        ref={ this._resolveRef('_inputElement') }
+        ref={ this._inputElement }
         value={ displayValue }
         autoCapitalize={ 'off' }
         autoComplete={ 'off' }
@@ -133,13 +134,13 @@ export class Autofill extends BaseComponent<IAutofillProps, IAutofillState> impl
   }
 
   public focus() {
-    this._inputElement.focus();
+    this._inputElement.value && this._inputElement.value.focus();
   }
 
   public clear() {
     this._autoFillEnabled = true;
     this._updateValue('');
-    this._inputElement.setSelectionRange(0, 0);
+    this._inputElement.value && this._inputElement.value.setSelectionRange(0, 0);
   }
 
   // Composition events are used when the character/text requires several keystrokes to be completed.
@@ -218,8 +219,10 @@ export class Autofill extends BaseComponent<IAutofillProps, IAutofillState> impl
   private _getCurrentInputValue(ev?: React.FormEvent<HTMLElement>): string {
     if (ev && ev.target && (ev.target as any).value) {
       return (ev.target as any).value;
+    } else if (this.inputElement && this.inputElement.value) {
+      return this.inputElement.value;
     } else {
-      return this._inputElement.value;
+      return '';
     }
   }
 
@@ -237,7 +240,8 @@ export class Autofill extends BaseComponent<IAutofillProps, IAutofillState> impl
   private _tryEnableAutofill(newValue: string, oldValue: string, isComposing?: boolean, isComposed?: boolean) {
     if (!isComposing
       && newValue
-      && this._inputElement.selectionStart === newValue.length
+      && this._inputElement.value
+      && this._inputElement.value.selectionStart === newValue.length
       && !this._autoFillEnabled
       && (newValue.length > oldValue.length || isComposed)) {
       this._autoFillEnabled = true;
diff --git a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.types.ts b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.types.ts
index eede0c7114c05..e1d976c987d23 100644
--- a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.types.ts
@@ -29,7 +29,7 @@ export interface IAutofill {
   /**
    * The current input element.
    */
-  inputElement: HTMLInputElement;
+  inputElement: HTMLInputElement | null;
   /**
    * Focus the input element.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 13e42a812473c..7ff26e87999ad 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -8,7 +8,8 @@ import {
   buttonProperties,
   getId,
   getNativeProps,
-  KeyCodes
+  KeyCodes,
+  createRef
 } from '../../Utilities';
 import { Icon } from '../../Icon';
 import { DirectionalHint } from '../../common/DirectionalHint';
@@ -43,8 +44,8 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     split: false,
   };
 
-  private _buttonElement: HTMLElement;
-  private _splitButtonContainer: HTMLElement;
+  private _buttonElement = createRef<HTMLElement>();
+  private _splitButtonContainer = createRef<HTMLDivElement>();
   private _labelId: string;
   private _descriptionId: string;
   private _ariaDescriptionId: string;
@@ -158,7 +159,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       nativeProps,
       {
         className: this._classNames.root,
-        ref: this._resolveRef('_buttonElement'),
+        ref: this._buttonElement,
         'disabled': isPrimaryButtonDisabled,
         'aria-label': ariaLabel,
         'aria-labelledby': ariaLabelledBy,
@@ -200,8 +201,8 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   }
 
   public focus(): void {
-    if (this._buttonElement) {
-      this._buttonElement.focus();
+    if (this._buttonElement.value) {
+      this._buttonElement.value.focus();
     }
   }
 
@@ -395,7 +396,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         directionalHint={ DirectionalHint.bottomLeftEdge }
         { ...menuProps }
         className={ 'ms-BaseButton-menuhost ' + menuProps.className }
-        target={ this._isSplitButton ? this._splitButtonContainer : this._buttonElement }
+        target={ this._isSplitButton ? this._splitButtonContainer.value : this._buttonElement.value }
         labelElementId={ this._labelId }
         onDismiss={ onDismiss }
       />
@@ -446,7 +447,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         aria-describedby={ buttonProps.ariaDescription }
         className={ classNames && classNames.splitButtonContainer }
         onKeyDown={ this._onMenuKeyDown }
-        ref={ this._resolveRef('_splitButtonContainer') }
+        ref={ this._splitButtonContainer }
         data-is-focusable={ true }
         onClick={ !disabled && !primaryDisabled ? onClick : undefined }
       >
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index 7ef744d31917d..e60db6597e661 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -8,7 +8,8 @@ import {
   autobind,
   css,
   BaseComponent,
-  KeyCodes
+  KeyCodes,
+  createRef
 } from '../../Utilities';
 import * as stylesImport from './Calendar.scss';
 const styles: any = stylesImport;
@@ -71,8 +72,8 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     workWeekDays: defaultWorkWeekDays
   };
 
-  private _dayPicker: ICalendarDay;
-  private _monthPicker: ICalendarMonth;
+  private _dayPicker = createRef<ICalendarDay>();
+  private _monthPicker = createRef<ICalendarMonth>();
 
   private _focusOnUpdate: boolean;
 
@@ -112,10 +113,10 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
   public componentDidUpdate() {
     if (this._focusOnUpdate) {
       // if the day picker is shown, focus on it
-      if (this._dayPicker) {
-        this._dayPicker.focus();
-      } else if (this._monthPicker) {
-        this._monthPicker.focus();
+      if (this._dayPicker.value) {
+        this._dayPicker.value.focus();
+      } else if (this._monthPicker.value) {
+        this._monthPicker.value.focus();
       }
       this._focusOnUpdate = false;
     }
@@ -166,7 +167,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   minDate={ minDate }
                   maxDate={ maxDate }
                   workWeekDays={ this.props.workWeekDays }
-                  componentRef={ this._resolveRef('_dayPicker') }
+                  componentRef={ this._dayPicker }
                 />
                 }
 
@@ -181,7 +182,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
                   dateTimeFormatter={ this.props.dateTimeFormatter! }
                   minDate={ minDate }
                   maxDate={ maxDate }
-                  componentRef={ this._resolveRef('_monthPicker') }
+                  componentRef={ this._monthPicker }
                 /> }
 
                 { showGoToToday &&
@@ -204,8 +205,8 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
   }
 
   public focus() {
-    if (this._dayPicker) {
-      this._dayPicker.focus();
+    if (this._dayPicker.value) {
+      this._dayPicker.value.focus();
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 5a7d0e8d1ae03..a04e83213471e 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -726,7 +726,9 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    */
   @autobind
   private _select() {
-    this._comboBox.inputElement.select();
+    if (this._comboBox.inputElement) {
+      this._comboBox.inputElement.select();
+    }
 
     if (!this.state.focused) {
       this.setState({ focused: true });
@@ -823,7 +825,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
           (autoComplete && pendingOptionText.indexOf(currentPendingValue.toLocaleLowerCase()) === 0 &&
             (this._comboBox.isValueSelected &&
               currentPendingValue.length + (this._comboBox.selectionEnd - this._comboBox.selectionStart) === pendingOptionText.length) ||
-            (this._comboBox.inputElement.value.toLocaleLowerCase() === pendingOptionText)
+            (this._comboBox.inputElement && this._comboBox.inputElement.value.toLocaleLowerCase() === pendingOptionText)
           )) {
           this._setSelectedIndex(currentPendingValueValidIndex);
           this._clearPendingInfo();
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 32a28d9298558..c33eb4feb7c31 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -21,6 +21,8 @@ import {
 import { FontClassNames } from '../../Styling';
 import { TooltipHost } from '../../Tooltip';
 import * as stylesImport from './CommandBar.scss';
+import { createRef } from '../../Utilities';
+
 const styles: any = stylesImport;
 
 const OVERFLOW_KEY = 'overflow';
@@ -47,12 +49,12 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
     [key: string]: React.ReactInstance;
   };
 
-  private _searchSurface: HTMLElement;
-  private _commandSurface: HTMLElement;
-  private _commandBarRegion: HTMLElement;
-  private _farCommandSurface: HTMLElement;
-  private _focusZone: FocusZone;
-  private _overflow: HTMLElement;
+  private _searchSurface = createRef<HTMLDivElement>();
+  private _commandSurface = createRef<HTMLDivElement>();
+  private _commandBarRegion = createRef<HTMLDivElement>();
+  private _farCommandSurface = createRef<HTMLDivElement>();
+  private _focusZone = createRef<FocusZone>();
+  private _overflow = createRef<HTMLDivElement>();
 
   private _id: string;
   private _overflowWidth: number;
@@ -91,7 +93,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
 
     if (isSearchBoxVisible) {
       searchBox = (
-        <div className={ css('ms-CommandBarSearch', styles.search) } ref={ this._resolveRef('_searchSurface') }>
+        <div className={ css('ms-CommandBarSearch', styles.search) } ref={ this._searchSurface }>
           <input className={ css('ms-CommandBarSearch-input', styles.searchInput) } type='text' placeholder={ searchPlaceholderText } />
           <div
             className={ css(
@@ -118,14 +120,14 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
     let posInSet = 1;
 
     return (
-      <div className={ css('ms-CommandBar', styles.root, className) } ref={ this._resolveRef('_commandBarRegion') }>
+      <div className={ css('ms-CommandBar', styles.root, className) } ref={ this._commandBarRegion }>
         { searchBox }
-        <FocusZone ref={ this._resolveRef('_focusZone') } className={ styles.container } direction={ FocusZoneDirection.horizontal } role='menubar' >
-          <div className={ css('ms-CommandBar-primaryCommands', styles.primaryCommands) } ref={ this._resolveRef('_commandSurface') }>
+        <FocusZone ref={ this._focusZone } className={ styles.container } direction={ FocusZoneDirection.horizontal } role='menubar' >
+          <div className={ css('ms-CommandBar-primaryCommands', styles.primaryCommands) } ref={ this._commandSurface }>
             { renderedItems!.map(item => (
               this._renderItemInCommandBar(item, posInSet++, setSize, expandedMenuItemKey!)
             )).concat((renderedOverflowItems && renderedOverflowItems.length) ? [
-              <div className={ css('ms-CommandBarItem', styles.item) } key={ OVERFLOW_KEY } ref={ this._resolveRef('_overflow') }>
+              <div className={ css('ms-CommandBarItem', styles.item) } key={ OVERFLOW_KEY } ref={ this._overflow }>
                 <button
                   type='button'
                   id={ this._id + OVERFLOW_KEY }
@@ -146,7 +148,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
               </div>
             ] : []) }
           </div>
-          <div className={ css('ms-CommandBar-sideCommands', styles.sideCommands) } ref={ this._resolveRef('_farCommandSurface') }>
+          <div className={ css('ms-CommandBar-sideCommands', styles.sideCommands) } ref={ this._farCommandSurface }>
             { renderedFarItems!.map(item => (
               this._renderItemInCommandBar(item, posInSet++, setSize, expandedMenuItemKey!, true)
             )) }
@@ -168,7 +170,8 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
   }
 
   public focus() {
-    this._focusZone.focus();
+    const { value: focusZone } = this._focusZone;
+    focusZone && focusZone.focus();
   }
 
   private _renderItemInCommandBar(item: ICommandBarItemProps, posInSet: number, setSize: number, expandedMenuItemKey: string, isFarItem?: boolean) {
@@ -308,7 +311,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
 
   private _updateItemMeasurements() {
     // the generated width for overflow is 35 in chrome, 38 in IE, but the actual value is 41.5
-    if (this._overflow || (this.props.overflowItems && this.props.overflowItems.length)) {
+    if (this._overflow.value || (this.props.overflowItems && this.props.overflowItems.length)) {
       this._overflowWidth = OVERFLOW_WIDTH;
     } else {
       this._overflowWidth = 0;
@@ -333,15 +336,19 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
 
   private _updateRenderedItems() {
     const { items, overflowItems } = this.props;
-    const commandSurface = this._commandSurface;
-    const farCommandSurface = this._farCommandSurface;
-    const commandBarRegion = this._commandBarRegion;
-    const searchSurface = this._searchSurface;
+    const commandSurface = this._commandSurface.value;
+    const farCommandSurface = this._farCommandSurface.value;
+    const commandBarRegion = this._commandBarRegion.value;
+    const searchSurface = this._searchSurface.value;
     const renderedItems = [...items];
     let renderedOverflowItems = overflowItems;
     let consumedWidth = 0;
     const isOverflowVisible = overflowItems && overflowItems.length;
 
+    if (!commandSurface || !commandBarRegion) {
+      return;
+    }
+
     const style = window.getComputedStyle(commandSurface);
     let availableWidth = commandBarRegion.clientWidth - parseInt(style.marginLeft!, 10) - parseInt(style.marginRight!, 10);
     if (searchSurface) {
@@ -424,7 +431,9 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
 
   @autobind
   private _onContextMenuDismiss(ev?: any) {
-    if (!ev || !ev.relatedTarget || !this._commandSurface.contains(ev.relatedTarget as HTMLElement)) {
+    const { value: commandSurface } = this._commandSurface;
+
+    if (!ev || !ev.relatedTarget || commandSurface && !commandSurface.contains(ev.relatedTarget as HTMLElement)) {
       const { contextualMenuProps } = this.state;
 
       if (contextualMenuProps && contextualMenuProps.onDismiss) {
diff --git a/packages/utilities/src/createRef.test.ts b/packages/utilities/src/createRef.test.ts
new file mode 100644
index 0000000000000..ba1c9130c8b44
--- /dev/null
+++ b/packages/utilities/src/createRef.test.ts
@@ -0,0 +1,26 @@
+import * as React from 'react';
+import { createRef } from './createRef';
+
+describe('createRef', () => {
+  it('to have a value prop that is null on creation', () => {
+    expect(createRef().value).toEqual(null);
+  });
+
+  it('when called with ReactElement it sets the value to the passed component', () => {
+    const component = React.createElement('span');
+    const refObject = createRef<React.ReactElement<{}>>();
+
+    refObject(component);
+
+    expect(refObject.value).toBe(component);
+  });
+
+  it('when called with HTMLElement it sets the value to the passed element', () => {
+    const component = document.createElement('span');
+    const refObject = createRef();
+
+    refObject(component);
+
+    expect(refObject.value).toBe(component);
+  });
+});
diff --git a/packages/utilities/src/createRef.ts b/packages/utilities/src/createRef.ts
new file mode 100644
index 0000000000000..0f145b9ed9439
--- /dev/null
+++ b/packages/utilities/src/createRef.ts
@@ -0,0 +1,13 @@
+export type RefObject<T> = {
+  (component: T): void;
+  value: T | null;
+};
+
+export function createRef<T>(): RefObject<T> {
+  const refObject = ((element: T | null): void => {
+    refObject.value = element;
+  }) as RefObject<T>;
+  refObject.value = null;
+
+  return refObject;
+}
\ No newline at end of file
diff --git a/packages/utilities/src/index.ts b/packages/utilities/src/index.ts
index ef210f20ebc26..379179411280e 100644
--- a/packages/utilities/src/index.ts
+++ b/packages/utilities/src/index.ts
@@ -39,3 +39,4 @@ export * from './scroll';
 export * from './string';
 export * from './styled';
 export * from './warn';
+export * from './createRef';
\ No newline at end of file

From 26435dda20a7dfaff7c9917b9a5b8c82aedb77d0 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 6 Mar 2018 11:13:37 +0000
Subject: [PATCH 1515/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...fill-react-createRef_2018-03-05-22-18.json | 11 --------
 .../FirstBug_2018-03-05-22-47.json            | 11 --------
 ...icker-async-debounce_2018-03-02-17-42.json | 11 --------
 packages/example-app-base/package.json        |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 26 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 13 +++++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 ++++++++++
 packages/utilities/CHANGELOG.md               |  9 ++++++-
 packages/utilities/package.json               |  2 +-
 16 files changed, 70 insertions(+), 45 deletions(-)
 delete mode 100644 common/changes/@uifabric/utilities/polyfill-react-createRef_2018-03-05-22-18.json
 delete mode 100644 common/changes/office-ui-fabric-react/FirstBug_2018-03-05-22-47.json
 delete mode 100644 common/changes/office-ui-fabric-react/basepicker-async-debounce_2018-03-02-17-42.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 46d2866ed0bfb..a278d02cbb529 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.59.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.60.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index d847f085b5567..224dfd2fb50ce 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.59.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.60.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index f3efd0c4a375c..574722c55e3ca 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.59.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.60.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index e345a06ed3eb3..0196eefd35c4a 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.59.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.60.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index fc1c1581db76d..5f839b8015cf2 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.59.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.60.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/common/changes/@uifabric/utilities/polyfill-react-createRef_2018-03-05-22-18.json b/common/changes/@uifabric/utilities/polyfill-react-createRef_2018-03-05-22-18.json
deleted file mode 100644
index 8a98757068a6d..0000000000000
--- a/common/changes/@uifabric/utilities/polyfill-react-createRef_2018-03-05-22-18.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Adds createRef polyfil to prepare for object refs.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "mark@thedutchies.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/FirstBug_2018-03-05-22-47.json b/common/changes/office-ui-fabric-react/FirstBug_2018-03-05-22-47.json
deleted file mode 100644
index e7556ba101c95..0000000000000
--- a/common/changes/office-ui-fabric-react/FirstBug_2018-03-05-22-47.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Facepile: Conditionally apply `aria-describedby` only when `ariaDescription` is provided",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "adrum@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/basepicker-async-debounce_2018-03-02-17-42.json b/common/changes/office-ui-fabric-react/basepicker-async-debounce_2018-03-02-17-42.json
deleted file mode 100644
index 217fc2af92134..0000000000000
--- a/common/changes/office-ui-fabric-react/basepicker-async-debounce_2018-03-02-17-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add async debounce option to BasePicker",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jabrassi@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 931477d473350..8f5fa8f7dc0ad 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.19.0 <6.0.0",
-    "@uifabric/utilities": ">=5.14.1 <6.0.0",
+    "@uifabric/utilities": ">=5.15.0 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 71f4efa860d4a..29642012158a0 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.60.0",
+      "tag": "office-ui-fabric-react_v5.60.0",
+      "date": "Tue, 06 Mar 2018 11:13:36 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Andrew <jabbrass@zoho.com>",
+            "commit": "4368015261d01c1287ded8fb360ac126908a1813",
+            "comment": "Add async debounce option to BasePicker"
+          }
+        ],
+        "patch": [
+          {
+            "author": "FalseLobster <aliciakds88@gmail.com>",
+            "commit": "0ccc7bd7d7323c677a8c7ec4f2d1885ba653cbac",
+            "comment": "Facepile: Conditionally apply `aria-describedby` only when `ariaDescription` is provided"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.14.1 <6.0.0` to `>=5.15.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.59.1",
       "tag": "office-ui-fabric-react_v5.59.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index ff31c3a901ece..e074d900f30f2 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 06 Mar 2018 02:06:59 GMT and should not be manually modified.
+This log was last generated on Tue, 06 Mar 2018 11:13:36 GMT and should not be manually modified.
+
+## 5.60.0
+Tue, 06 Mar 2018 11:13:36 GMT
+
+### Minor changes
+
+- Add async debounce option to BasePicker
+
+### Patches
+
+- Facepile: Conditionally apply `aria-describedby` only when `ariaDescription` is provided
 
 ## 5.59.1
 Tue, 06 Mar 2018 02:06:59 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index b30f26c503526..c026424cc95db 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.59.1",
+  "version": "5.60.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -51,7 +51,7 @@
     "@uifabric/icons": ">=5.5.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "@uifabric/styling": ">=5.19.0 <6.0.0",
-    "@uifabric/utilities": ">=5.14.1 <6.0.0",
+    "@uifabric/utilities": ">=5.15.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 49171b0e2aea7..b9d56b5ddac51 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.14.1 <6.0.0",
+    "@uifabric/utilities": ">=5.15.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index d2b731859f3c7..9cadabe23e252 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.15.0",
+      "tag": "@uifabric/utilities_v5.15.0",
+      "date": "Tue, 06 Mar 2018 11:13:36 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Mark Polak <mark@thedutchies.com>",
+            "commit": "25e736fb4506e1021274c420283338e499388477",
+            "comment": "Adds createRef polyfil to prepare for object refs."
+          }
+        ]
+      }
+    },
     {
       "version": "5.14.1",
       "tag": "@uifabric/utilities_v5.14.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 3ee25ec70b16e..9d4a554deb1c2 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Tue, 06 Mar 2018 02:06:59 GMT and should not be manually modified.
+This log was last generated on Tue, 06 Mar 2018 11:13:36 GMT and should not be manually modified.
+
+## 5.15.0
+Tue, 06 Mar 2018 11:13:36 GMT
+
+### Minor changes
+
+- Adds createRef polyfil to prepare for object refs.
 
 ## 5.14.1
 Tue, 06 Mar 2018 02:06:59 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 1cc4de46bd65f..7ae153f8df525 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.14.1",
+  "version": "5.15.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 1b57c33b6ad1e00bdd844461fff3ba3f1acb94cc Mon Sep 17 00:00:00 2001
From: amyngu <31973030+amyngu@users.noreply.github.com>
Date: Tue, 6 Mar 2018 12:50:33 -0800
Subject: [PATCH 1516/1641] Add clear input for BaseExtendedPicker (#4192)

* add clear input

* add change file

* fix tslint error
---
 .../amyngu-clearInput_2018-03-06-18-05.json           | 11 +++++++++++
 .../components/ExtendedPicker/BaseExtendedPicker.tsx  |  4 ++++
 2 files changed, 15 insertions(+)
 create mode 100644 common/changes/@uifabric/experiments/amyngu-clearInput_2018-03-06-18-05.json

diff --git a/common/changes/@uifabric/experiments/amyngu-clearInput_2018-03-06-18-05.json b/common/changes/@uifabric/experiments/amyngu-clearInput_2018-03-06-18-05.json
new file mode 100644
index 0000000000000..8a038a5d362fa
--- /dev/null
+++ b/common/changes/@uifabric/experiments/amyngu-clearInput_2018-03-06-18-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "add clearInput on BaseExtendedPicker",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "amyngu@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
index 1c3b5246809db..8268e739d052a 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
@@ -73,6 +73,10 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
     this.focusZone.focus();
   }
 
+  public clearInput(): void {
+    this.input.clear();
+  }
+
   public get inputElement(): HTMLInputElement | null {
     return this.input.inputElement;
   }

From 52a113ea0f91c4591a8c951c9233046320cdeddc Mon Sep 17 00:00:00 2001
From: Jordan Janzen <jordancjanzen@gmail.com>
Date: Tue, 6 Mar 2018 13:17:45 -0800
Subject: [PATCH 1517/1641] ContextualMenuSample: Use DefaultButton instead of
 html button (#4194)

* Use DefaultButton instead of html button

* npm run change output
---
 ...ix-ContextMenu-sample-styles_2018-03-06-19-11.json | 11 +++++++++++
 ...ix-ContextMenu-sample-styles_2018-03-06-19-11.json | 11 +++++++++++
 ...ix-ContextMenu-sample-styles_2018-03-06-19-11.json | 11 +++++++++++
 ...ix-ContextMenu-sample-styles_2018-03-06-19-11.json | 11 +++++++++++
 ...ix-ContextMenu-sample-styles_2018-03-06-19-11.json | 11 +++++++++++
 ...ix-ContextMenu-sample-styles_2018-03-06-19-11.json | 11 +++++++++++
 .../examples/ContextualMenu.Customization.Example.tsx |  4 ++--
 ...ContextualMenu.CustomizationWithNoWrap.Example.tsx |  4 ++--
 .../examples/ContextualMenuExample.scss               |  5 ++++-
 9 files changed, 74 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
 create mode 100644 common/changes/@uifabric/experiments/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
 create mode 100644 common/changes/@uifabric/fabric-website/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
 create mode 100644 common/changes/@uifabric/styling/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
 create mode 100644 common/changes/@uifabric/utilities/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
 create mode 100644 common/changes/office-ui-fabric-react/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json

diff --git a/common/changes/@uifabric/example-app-base/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json b/common/changes/@uifabric/example-app-base/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
new file mode 100644
index 0000000000000..d14999673285a
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/example-app-base",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "v-jojanz@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json b/common/changes/@uifabric/experiments/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
new file mode 100644
index 0000000000000..1d3101bee4768
--- /dev/null
+++ b/common/changes/@uifabric/experiments/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/experiments",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "v-jojanz@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json b/common/changes/@uifabric/fabric-website/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
new file mode 100644
index 0000000000000..8f4224c4cc65b
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "v-jojanz@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json b/common/changes/@uifabric/styling/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
new file mode 100644
index 0000000000000..e660e9b6e93e4
--- /dev/null
+++ b/common/changes/@uifabric/styling/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/styling",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "v-jojanz@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json b/common/changes/@uifabric/utilities/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
new file mode 100644
index 0000000000000..8693c0e083bae
--- /dev/null
+++ b/common/changes/@uifabric/utilities/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/utilities",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "v-jojanz@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json b/common/changes/office-ui-fabric-react/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
new file mode 100644
index 0000000000000..a3769d4c93081
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix ContextualMenu customization sample",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-jojanz@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
index f67e9544e921c..e3cbc91b48f10 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
@@ -204,7 +204,7 @@ export class ContextualMenuCustomizationExample extends React.Component<{}, {}>
       <ul className='ms-ContextualMenu-customizationExample-categoriesList'>
         <li className='ms-ContextualMenu-item'>
           { item.categoryList.map((category: any) =>
-            <button className='ms-ContextualMenu-link' role='menuitem' key={ category.name }>
+            <DefaultButton className='ms-ContextualMenu-link ms-ContextualMenu-customizationExample-button' role='menuitem' key={ category.name }>
               <div>
                 <span
                   className='ms-ContextualMenu-icon ms-ContextualMenu-customizationExample-categorySwatch'
@@ -214,7 +214,7 @@ export class ContextualMenuCustomizationExample extends React.Component<{}, {}>
                   { category.name }
                 </span>
               </div>
-            </button>
+            </DefaultButton>
           ) }
         </li>
       </ul>
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomizationWithNoWrap.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomizationWithNoWrap.Example.tsx
index 491d1dbf4f7cf..1b9713903eb46 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomizationWithNoWrap.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomizationWithNoWrap.Example.tsx
@@ -215,7 +215,7 @@ export class ContextualMenuCustomizationWithNoWrapExample extends React.Componen
       <ul className='ms-ContextualMenu-customizationExample-categoriesList'>
         <li className='ms-ContextualMenu-item'>
           { item.categoryList.map((category: any) =>
-            <button key={ category.name } className='ms-ContextualMenu-link' role='menuitem'>
+            <DefaultButton key={ category.name } className='ms-ContextualMenu-link ms-ContextualMenu-customizationExample-button' role='menuitem'>
               <div>
                 <span
                   className='ms-ContextualMenu-icon ms-ContextualMenu-customizationExample-categorySwatch'
@@ -225,7 +225,7 @@ export class ContextualMenuCustomizationWithNoWrapExample extends React.Componen
                   { category.name }
                 </span>
               </div>
-            </button>
+            </DefaultButton>
           ) }
         </li>
       </ul>
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenuExample.scss b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenuExample.scss
index 83e08bc27f6d4..10e6739218cce 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenuExample.scss
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenuExample.scss
@@ -47,7 +47,6 @@
   }
 
   .ms-ContextualMenu-customizationExample-categorySwatch {
-    margin: 6px 8px;
     width: 24px;
     height: 24px;
     vertical-align: top;
@@ -68,4 +67,8 @@
       height: auto;
     }
   }
+
+  .ms-ContextualMenu-customizationExample-button {
+    max-width: 50%;
+  }
 }

From eee7b8801c94dcefe050211f244bba81afffe402 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 6 Mar 2018 15:55:48 -0800
Subject: [PATCH 1518/1641] TeachingBubble: Updated animation (#4165)

* Initial bounce test

* Opacity test

* Forced opacity delay

* got rid of plateau

* bringing back comments

* Added animation css to teaching bubble

* cleaned up animation code in teaching bubble

* Cleaning up css

* Removed unused import

* Added change file
---
 ...hingbubble-animation_2018-03-02-21-53.json | 11 ++++
 .../TeachingBubble/TeachingBubble.scss        | 53 +++++++++++++++++++
 2 files changed, 64 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/teachingbubble-animation_2018-03-02-21-53.json

diff --git a/common/changes/office-ui-fabric-react/teachingbubble-animation_2018-03-02-21-53.json b/common/changes/office-ui-fabric-react/teachingbubble-animation_2018-03-02-21-53.json
new file mode 100644
index 0000000000000..b17a48f5b8277
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/teachingbubble-animation_2018-03-02-21-53.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "TeachingBubble: New animation for bounce with fade in.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.scss b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.scss
index 54c4ce0011edf..113d36a6e24d0 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.scss
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.scss
@@ -7,11 +7,64 @@
 // --------------------------------------------------
 // Teaching Bubble styles
 
+@keyframes bounceAnimation {
+  0% { transform: matrix3d(0.5, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  1.7% { transform: matrix3d(0.658, 0, 0, 0, 0, 0.703, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  2.35% { transform: matrix3d(0.725, 0, 0, 0, 0, 0.8, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  3.4% { transform: matrix3d(0.83, 0, 0, 0, 0, 0.946, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  4.7% { transform: matrix3d(0.942, 0, 0, 0, 0, 1.084, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  5.11% { transform: matrix3d(0.971, 0, 0, 0, 0, 1.113, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  6.81% { transform: matrix3d(1.062, 0, 0, 0, 0, 1.166, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  7.06% { transform: matrix3d(1.07, 0, 0, 0, 0, 1.165, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  8.76% { transform: matrix3d(1.104, 0, 0, 0, 0, 1.12, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  9.36% { transform: matrix3d(1.106, 0, 0, 0, 0, 1.094, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  10.66% { transform: matrix3d(1.098, 0, 0, 0, 0, 1.035, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  12.16% { transform: matrix3d(1.075, 0, 0, 0, 0, 0.98, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  12.61% { transform: matrix3d(1.067, 0, 0, 0, 0, 0.969, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  14.51% { transform: matrix3d(1.031, 0, 0, 0, 0, 0.948, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  14.96% { transform: matrix3d(1.024, 0, 0, 0, 0, 0.949, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  17.77% { transform: matrix3d(0.99, 0, 0, 0, 0, 0.981, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  18.37% { transform: matrix3d(0.986, 0, 0, 0, 0, 0.989, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  20.52% { transform: matrix3d(0.98, 0, 0, 0, 0, 1.011, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  22.22% { transform: matrix3d(0.983, 0, 0, 0, 0, 1.016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  26.08% { transform: matrix3d(0.996, 0, 0, 0, 0, 1.003, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  29.93% { transform: matrix3d(1.003, 0, 0, 0, 0, 0.995, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  31.63% { transform: matrix3d(1.004, 0, 0, 0, 0, 0.996, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  37.64% { transform: matrix3d(1.001, 0, 0, 0, 0, 1.002, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  42.74% { transform: matrix3d(0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  45.35% { transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  49.9% { transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  50% { transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  52.15% { transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  54.3% { transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  56.46% { transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  58.61% { transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  64.16% { transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  69.72% { transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  80.83% { transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  91.99% { transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+  100% { transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
+}
+
+@keyframes opacityFadeIn {
+  0% {
+    opacity: 0;
+    animation-timing-function: $ms-animation-ease-2;
+  }
+  26.26% { opacity: 1; }
+  100% { opacity: 1; }
+}
+
 .root {
   display: block;
   max-width: 364px;
   border: 0;
   box-shadow: none !important;
+
+  animation-name: (bounceAnimation, opacityFadeIn);
+  animation-duration: 2000ms;
+  animation-timing-function: linear;
+  animation-fill-mode: both;
 }
 
 .bodyContent {

From 6a806b174dac9bdc44ae90bac12a5119a0b440e6 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 6 Mar 2018 23:31:58 -0800
Subject: [PATCH 1519/1641] Update tslint.json

---
 packages/office-ui-fabric-react/tslint.json | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/tslint.json b/packages/office-ui-fabric-react/tslint.json
index 9dcefdf589368..7d6cf89d5c8c0 100644
--- a/packages/office-ui-fabric-react/tslint.json
+++ b/packages/office-ui-fabric-react/tslint.json
@@ -8,9 +8,10 @@
       false,
       140
     ],
+    "no-unused-variable": false,
     "no-any": false,
     "typedef": [
       false
     ]
   }
-}
\ No newline at end of file
+}

From dfe67eaf43e3d135075cfd9feea5acd40466c88e Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Wed, 7 Mar 2018 03:02:41 -0800
Subject: [PATCH 1520/1641] Persona - Separated SCSS for Persona and
 PersonaCoin into Two Files (#4200)

* seperated out Persona and PersonaCoin components' SCSS

* rush change

* cleanup comment
---
 .../persona-splitscss_2018-03-07-00-00.json   |  11 +
 .../src/components/Persona/Persona.scss       | 136 ------------
 .../src/components/Persona/PersonaCoin.scss   | 207 ++++++++++++++++++
 .../src/components/Persona/PersonaCoin.tsx    |  28 ++-
 4 files changed, 241 insertions(+), 141 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/persona-splitscss_2018-03-07-00-00.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.scss

diff --git a/common/changes/office-ui-fabric-react/persona-splitscss_2018-03-07-00-00.json b/common/changes/office-ui-fabric-react/persona-splitscss_2018-03-07-00-00.json
new file mode 100644
index 0000000000000..31b2b3cae3401
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/persona-splitscss_2018-03-07-00-00.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Seperated the SCSS for Persona and Persona Coin components due to bloat when imported twice.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
index bd2911c3c36ff..24f15f0e191a9 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.scss
@@ -63,18 +63,6 @@ $ms-Persona-presenceBorder: 2px;
   }
 }
 
-.imageArea {
-  position: relative;
-  text-align: center;
-  flex: 0 0 auto;
-  height: $ms-Persona-size48;
-  width: $ms-Persona-size48;
-
-  .image {
-    border: 0px;
-  }
-}
-
 //= Note: The doughboy placeholder is being deprecated.
 // The initials color block (.ms-Persona-initials) will be used going forward
 // as a fallback when the persona does not have an image.
@@ -88,39 +76,6 @@ $ms-Persona-presenceBorder: 2px;
   z-index: $ms-zIndex-middle;
 }
 
-.initials {
-  border-radius: 50%;
-  color: $ms-color-white;
-  font-size: $ms-font-size-l;
-  font-weight: $ms-font-weight-regular;
-  line-height: 46px;
-  height: $ms-Persona-size48;
-
-  @include high-contrast {
-    border: 1px solid WindowText;
-    -ms-high-contrast-adjust: none;
-    color: WindowText;
-    box-sizing: border-box;
-    // Using important to override all of the more specific initialsIsColor rules
-    background-color: Window !important;
-  }
-}
-
-.image {
-  @include ms-margin-right(10px);
-  position: absolute;
-  top: 0;
-  @include ms-left(0);
-  width: 100%;
-  height: 100%;
-  border-radius: 50%;
-  perspective: 1px;
-}
-
-.image[src=""] {
-  display: none;
-}
-
 .presence {
   background-color: $ms-color-presence-available;
   position: absolute;
@@ -202,12 +157,6 @@ $ms-Persona-presenceBorder: 2px;
 }
 
 .rootIsSize10 {
-  .imageArea {
-    overflow: visible;
-    background: transparent;
-    height: 0;
-    width: 0;
-  }
 
   .presence {
     @include ms-right(auto);
@@ -241,14 +190,6 @@ $ms-Persona-presenceBorder: 2px;
   }
 }
 
-.size10NoPresenceIcon {
-  font-size: 10px;
-  position: absolute;
-  top: 5px;
-  @include ms-right(auto);
-  @include ms-left(0);
-}
-
 //== Modifier: Size 10 Persona with read only state
 //
 // This variant includes a semicolon, and is
@@ -270,23 +211,12 @@ $ms-Persona-presenceBorder: 2px;
 }
 
 .rootIsSize16 {
-  .imageArea,
-  .image {
-    height: $ms-Persona-size16;
-    width: $ms-Persona-size16;
-  }
 
   .placeholder {
     font-size: 18px;
     top: 4px;
   }
 
-  .initials {
-    font-size: $ms-font-size-xs;
-    height: $ms-Persona-size16;
-    line-height: $ms-Persona-size16;
-  }
-
   .presence {
     height: $ms-Persona-presenceSize6;
     width: $ms-Persona-presenceSize6;
@@ -315,23 +245,12 @@ $ms-Persona-presenceBorder: 2px;
 }
 
 .rootIsSize24 {
-  .imageArea,
-  .image {
-    height: $ms-Persona-size24;
-    width: $ms-Persona-size24;
-  }
 
   .placeholder {
     font-size: 18px;
     top: 4px;
   }
 
-  .initials {
-    font-size: $ms-font-size-xs;
-    height: $ms-Persona-size24;
-    line-height: $ms-Persona-size24;
-  }
-
   .presence {
     height: $ms-Persona-presenceSize8;
     width: $ms-Persona-presenceSize8;
@@ -378,23 +297,12 @@ $ms-Persona-presenceBorder: 2px;
 }
 
 .rootIsSize28 {
-  .imageArea,
-  .image {
-    height: $ms-Persona-size28;
-    width: $ms-Persona-size28;
-  }
 
   .placeholder {
     font-size: 18px;
     top: 4px;
   }
 
-  .initials {
-    font-size: $ms-font-size-xs;
-    height: $ms-Persona-size28;
-    line-height: $ms-Persona-size28;
-  }
-
   .presence {
     height: $ms-Persona-presenceSize8;
     width: $ms-Persona-presenceSize8;
@@ -442,23 +350,12 @@ $ms-Persona-presenceBorder: 2px;
 }
 
 .rootIsSize32 {
-  .imageArea,
-  .image {
-    height: $ms-Persona-size32;
-    width: $ms-Persona-size32;
-  }
 
   .placeholder {
     font-size: 28px;
     top: 6px;
   }
 
-  .initials {
-    font-size: $ms-font-size-m;
-    height: $ms-Persona-size32;
-    line-height: $ms-Persona-size32;
-  }
-
   .presence {
     height: $ms-Persona-presenceSize8;
     width: $ms-Persona-presenceSize8;
@@ -496,23 +393,12 @@ $ms-Persona-presenceBorder: 2px;
 }
 
 .rootIsSize40 {
-  .imageArea,
-  .image {
-    height: $ms-Persona-size40;
-    width: $ms-Persona-size40;
-  }
 
   .placeholder {
     font-size: 38px;
     top: 5px;
   }
 
-  .initials {
-    font-size: $ms-font-size-m;
-    height: $ms-Persona-size40;
-    line-height: $ms-Persona-size40;
-  }
-
   .primaryText {
     font-size: $ms-font-size-m;
   }
@@ -527,23 +413,12 @@ $ms-Persona-presenceBorder: 2px;
 }
 
 .rootIsSize72 {
-  .imageArea,
-  .image {
-    height: $ms-Persona-size72;
-    width: $ms-Persona-size72;
-  }
 
   .placeholder {
     font-size: 67px;
     top: 10px;
   }
 
-  .initials {
-    font-size: $ms-font-size-xxl;
-    height: $ms-Persona-size72;
-    line-height: 70px;
-  }
-
   .presence {
     height: $ms-Persona-presenceSize20;
     width: $ms-Persona-presenceSize20;
@@ -576,23 +451,12 @@ $ms-Persona-presenceBorder: 2px;
 }
 
 .rootIsSize100 {
-  .imageArea,
-  .image {
-    height: $ms-Persona-size100;
-    width: $ms-Persona-size100;
-  }
 
   .placeholder {
     font-size: 95px;
     top: 12px;
   }
 
-  .initials {
-    font-size: $ms-font-size-su;
-    height: $ms-Persona-size100;
-    line-height: 96px;
-  }
-
   .presence {
     height: $ms-Persona-presenceSize28;
     width: $ms-Persona-presenceSize28;
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.scss b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.scss
new file mode 100644
index 0000000000000..132c5af27cec1
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.scss
@@ -0,0 +1,207 @@
+@import '../../common/common';
+
+// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
+
+//
+// Office UI Fabric
+// --------------------------------------------------
+// Persona Coin styles
+
+// Persona Sizes
+$ms-Persona-size10:  20px;
+$ms-Persona-size16:  16px;
+$ms-Persona-size24:  24px;
+$ms-Persona-size28:  28px;
+$ms-Persona-size32:  32px;
+$ms-Persona-size40:  40px;
+$ms-Persona-size48:  48px;
+$ms-Persona-size72:  72px;
+$ms-Persona-size100: 100px;
+
+.imageArea {
+  position: relative;
+  text-align: center;
+  flex: 0 0 auto;
+  height: $ms-Persona-size48;
+  width: $ms-Persona-size48;
+
+  .image {
+    border: 0px;
+  }
+}
+
+.initials {
+  border-radius: 50%;
+  color: $ms-color-white;
+  font-size: $ms-font-size-l;
+  font-weight: $ms-font-weight-regular;
+  line-height: 46px;
+  height: $ms-Persona-size48;
+
+  @include high-contrast {
+    border: 1px solid WindowText;
+    -ms-high-contrast-adjust: none;
+    color: WindowText;
+    box-sizing: border-box;
+    // Using important to override all of the more specific initialsIsColor rules
+    background-color: Window !important;
+  }
+}
+
+.image {
+  @include ms-margin-right(10px);
+  position: absolute;
+  top: 0;
+  @include ms-left(0);
+  width: 100%;
+  height: 100%;
+  border-radius: 50%;
+  perspective: 1px;
+}
+
+.image[src=""] {
+  display: none;
+}
+
+//== Modifier: Size 10 Persona
+
+.rootIsSize10 {
+  .imageArea {
+    overflow: visible;
+    background: transparent;
+    height: 0;
+    width: 0;
+  }
+
+}
+
+.size10NoPresenceIcon {
+  font-size: 10px;
+  position: absolute;
+  top: 5px;
+  @include ms-right(auto);
+  @include ms-left(0);
+}
+
+//== Modifier: Size 16 Persona
+
+.rootIsSize16 {
+  .imageArea,
+  .image {
+    height: $ms-Persona-size16;
+    width: $ms-Persona-size16;
+  }
+
+  .initials {
+    font-size: $ms-font-size-xs;
+    height: $ms-Persona-size16;
+    line-height: $ms-Persona-size16;
+  }
+
+}
+
+//== Modifier: Size 24 Persona
+
+.rootIsSize24 {
+  .imageArea,
+  .image {
+    height: $ms-Persona-size24;
+    width: $ms-Persona-size24;
+  }
+
+  .initials {
+    font-size: $ms-font-size-xs;
+    height: $ms-Persona-size24;
+    line-height: $ms-Persona-size24;
+  }
+
+}
+
+//== Modifier: Size 28 Persona
+
+.rootIsSize28 {
+  .imageArea,
+  .image {
+    height: $ms-Persona-size28;
+    width: $ms-Persona-size28;
+  }
+
+  .initials {
+    font-size: $ms-font-size-xs;
+    height: $ms-Persona-size28;
+    line-height: $ms-Persona-size28;
+  }
+
+}
+
+
+//== Modifier: Size 32 Persona
+
+.rootIsSize32 {
+  .imageArea,
+  .image {
+    height: $ms-Persona-size32;
+    width: $ms-Persona-size32;
+  }
+
+  .initials {
+    font-size: $ms-font-size-m;
+    height: $ms-Persona-size32;
+    line-height: $ms-Persona-size32;
+  }
+
+}
+
+
+//== Modifier: Size 40 Persona
+
+.rootIsSize40 {
+  .imageArea,
+  .image {
+    height: $ms-Persona-size40;
+    width: $ms-Persona-size40;
+  }
+
+  .initials {
+    font-size: $ms-font-size-m;
+    height: $ms-Persona-size40;
+    line-height: $ms-Persona-size40;
+  }
+
+}
+
+
+//== Modifier: Size 72 Persona
+
+.rootIsSize72 {
+  .imageArea,
+  .image {
+    height: $ms-Persona-size72;
+    width: $ms-Persona-size72;
+  }
+
+  .initials {
+    font-size: $ms-font-size-xxl;
+    height: $ms-Persona-size72;
+    line-height: 70px;
+  }
+
+}
+
+
+//== Modifier: Size 100 Persona
+
+.rootIsSize100 {
+  .imageArea,
+  .image {
+    height: $ms-Persona-size100;
+    width: $ms-Persona-size100;
+  }
+
+  .initials {
+    font-size: $ms-font-size-su;
+    height: $ms-Persona-size100;
+    line-height: 96px;
+  }
+
+}
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
index c767d943e33c5..d53682bb98268 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
@@ -14,13 +14,10 @@ import {
   PersonaPresence as PersonaPresenceEnum,
   PersonaSize
 } from './Persona.types';
-import {
-  PERSONA_SIZE
-} from './PersonaConsts';
 import {
   Icon
 } from '../../Icon';
-import * as stylesImport from './Persona.scss';
+import * as stylesImport from './PersonaCoin.scss';
 const styles: any = stylesImport;
 
 const SIZE_TO_PIXELS: { [key: number]: number } = {
@@ -44,6 +41,27 @@ const SIZE_TO_PIXELS: { [key: number]: number } = {
 import { mergeStyles } from '../../Styling';
 import { initialsColorPropToColorCode } from './PersonaInitialsColor';
 
+export const PERSONACOIN_SIZE: { [key: number]: string } = {
+  // All non-numerically named sizes are deprecated, use the numerically named classes below
+  [PersonaSize.tiny]: 'ms-Persona--tiny ' + styles.rootIsSize10,
+  [PersonaSize.extraExtraSmall]: 'ms-Persona--xxs ' + styles.rootIsSize24,
+  [PersonaSize.extraSmall]: 'ms-Persona--xs ' + styles.rootIsSize28,
+  [PersonaSize.small]: 'ms-Persona--sm ' + styles.rootIsSize40,
+  [PersonaSize.regular]: '',
+  [PersonaSize.large]: 'ms-Persona--lg ' + styles.rootIsSize72,
+  [PersonaSize.extraLarge]: 'ms-Persona--xl ' + styles.rootIsSize100,
+
+  [PersonaSize.size10]: 'ms-Persona--size10 ' + styles.rootIsSize10,
+  [PersonaSize.size16]: 'ms-Persona--size16 ' + styles.rootIsSize16,
+  [PersonaSize.size24]: 'ms-Persona--size24 ' + styles.rootIsSize24,
+  [PersonaSize.size28]: 'ms-Persona--size28 ' + styles.rootIsSize28,
+  [PersonaSize.size32]: 'ms-Persona--size32 ' + styles.rootIsSize32,
+  [PersonaSize.size40]: 'ms-Persona--size40 ' + styles.rootIsSize40,
+  [PersonaSize.size48]: 'ms-Persona--size48 ' + styles.rootIsSize48,
+  [PersonaSize.size72]: 'ms-Persona--size72 ' + styles.rootIsSize72,
+  [PersonaSize.size100]: 'ms-Persona--size100 ' + styles.rootIsSize100
+};
+
 export interface IPersonaState {
   isImageLoaded?: boolean;
   isImageError?: boolean;
@@ -82,7 +100,7 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
     return (
       <div
         { ...divProps }
-        className={ css('ms-Persona-coin', PERSONA_SIZE[size], coinProps && coinProps.className) }
+        className={ css('ms-Persona-coin', PERSONACOIN_SIZE[size], coinProps && coinProps.className) }
       >
         { (size !== PersonaSize.size10 && size !== PersonaSize.tiny) ? (
           <div

From 8765a5a71c9796fc35a4c68db5da558b190b321d Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 7 Mar 2018 11:16:51 +0000
Subject: [PATCH 1521/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../amyngu-clearInput_2018-03-06-18-05.json   | 11 -----------
 ...xtMenu-sample-styles_2018-03-06-19-11.json | 11 -----------
 ...xtMenu-sample-styles_2018-03-06-19-11.json | 11 -----------
 ...hingbubble-animation_2018-03-02-21-53.json | 11 -----------
 packages/experiments/CHANGELOG.json           | 19 +++++++++++++++++++
 packages/experiments/CHANGELOG.md             |  9 ++++++++-
 packages/experiments/package.json             |  4 ++--
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 10 +++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 15 files changed, 63 insertions(+), 54 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/amyngu-clearInput_2018-03-06-18-05.json
 delete mode 100644 common/changes/@uifabric/experiments/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
 delete mode 100644 common/changes/office-ui-fabric-react/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
 delete mode 100644 common/changes/office-ui-fabric-react/teachingbubble-animation_2018-03-02-21-53.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index a278d02cbb529..c2c8707d7d90b 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.60.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.60.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 224dfd2fb50ce..6a2aa0ee68e92 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.60.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.60.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 574722c55e3ca..7b3e7423f4821 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.60.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.60.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 0196eefd35c4a..2fa286f59f930 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.60.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.60.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 5f839b8015cf2..a13bc52363710 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.60.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.60.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/common/changes/@uifabric/experiments/amyngu-clearInput_2018-03-06-18-05.json b/common/changes/@uifabric/experiments/amyngu-clearInput_2018-03-06-18-05.json
deleted file mode 100644
index 8a038a5d362fa..0000000000000
--- a/common/changes/@uifabric/experiments/amyngu-clearInput_2018-03-06-18-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "add clearInput on BaseExtendedPicker",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "amyngu@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json b/common/changes/@uifabric/experiments/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
deleted file mode 100644
index 1d3101bee4768..0000000000000
--- a/common/changes/@uifabric/experiments/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/experiments",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "v-jojanz@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json b/common/changes/office-ui-fabric-react/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
deleted file mode 100644
index a3769d4c93081..0000000000000
--- a/common/changes/office-ui-fabric-react/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix ContextualMenu customization sample",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-jojanz@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/teachingbubble-animation_2018-03-02-21-53.json b/common/changes/office-ui-fabric-react/teachingbubble-animation_2018-03-02-21-53.json
deleted file mode 100644
index b17a48f5b8277..0000000000000
--- a/common/changes/office-ui-fabric-react/teachingbubble-animation_2018-03-02-21-53.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "TeachingBubble: New animation for bounce with fade in.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 125314548389c..3c998dbe026f3 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.24.0",
+      "tag": "@uifabric/experiments_v5.24.0",
+      "date": "Wed, 07 Mar 2018 11:16:50 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "amyngu <31973030+amyngu@users.noreply.github.com>",
+            "commit": "1b57c33b6ad1e00bdd844461fff3ba3f1acb94cc",
+            "comment": "add clearInput on BaseExtendedPicker"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.59.1 <6.0.0` to `>=5.60.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.23.1",
       "tag": "@uifabric/experiments_v5.23.1",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 6b1d5d2109874..fd5b2c3eb5ada 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Tue, 06 Mar 2018 02:06:59 GMT and should not be manually modified.
+This log was last generated on Wed, 07 Mar 2018 11:16:50 GMT and should not be manually modified.
+
+## 5.24.0
+Wed, 07 Mar 2018 11:16:50 GMT
+
+### Minor changes
+
+- add clearInput on BaseExtendedPicker
 
 ## 5.23.1
 Tue, 06 Mar 2018 02:06:59 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index e5b156e3b80e8..b7afa0024d5ea 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.23.1",
+  "version": "5.24.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.59.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.60.1 <6.0.0",
     "@uifabric/icons": ">=5.5.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 29642012158a0..9164125754b8a 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.60.1",
+      "tag": "office-ui-fabric-react_v5.60.1",
+      "date": "Wed, 07 Mar 2018 11:16:50 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jordan Janzen <jordancjanzen@gmail.com>",
+            "commit": "52a113ea0f91c4591a8c951c9233046320cdeddc",
+            "comment": "Fix ContextualMenu customization sample"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "eee7b8801c94dcefe050211f244bba81afffe402",
+            "comment": "TeachingBubble: New animation for bounce with fade in."
+          }
+        ]
+      }
+    },
     {
       "version": "5.60.0",
       "tag": "office-ui-fabric-react_v5.60.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index e074d900f30f2..145f4b125f73c 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 06 Mar 2018 11:13:36 GMT and should not be manually modified.
+This log was last generated on Wed, 07 Mar 2018 11:16:50 GMT and should not be manually modified.
+
+## 5.60.1
+Wed, 07 Mar 2018 11:16:50 GMT
+
+### Patches
+
+- Fix ContextualMenu customization sample
+- TeachingBubble: New animation for bounce with fade in.
 
 ## 5.60.0
 Tue, 06 Mar 2018 11:13:36 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index c026424cc95db..bed1945d409cb 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.60.0",
+  "version": "5.60.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From ddc5731a85effd6082a93fe3458528224674a70c Mon Sep 17 00:00:00 2001
From: Kelsey Young <kelseyyoung4@gmail.com>
Date: Wed, 7 Mar 2018 14:35:49 -0800
Subject: [PATCH 1522/1641] Fix non-relative import in experiments (#4193)

* Add Keytips to src export to consume for testing

* Add exports for keytip utilities

* Add rush change file

* Fix import from src in KeytipTree, was auto-imported
---
 ...keytips-to-experiment-export_2018-03-05-23-11.json | 11 +++++++++++
 .../experiments/src/utilities/keytip/KeytipTree.ts    |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/experiments/keyou-add-keytips-to-experiment-export_2018-03-05-23-11.json

diff --git a/common/changes/@uifabric/experiments/keyou-add-keytips-to-experiment-export_2018-03-05-23-11.json b/common/changes/@uifabric/experiments/keyou-add-keytips-to-experiment-export_2018-03-05-23-11.json
new file mode 100644
index 0000000000000..fb80aad9828cf
--- /dev/null
+++ b/common/changes/@uifabric/experiments/keyou-add-keytips-to-experiment-export_2018-03-05-23-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Add Keytip and KeytipLayer to experiments export",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "keyou@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/utilities/keytip/KeytipTree.ts b/packages/experiments/src/utilities/keytip/KeytipTree.ts
index 232f00d4e388e..064e96fded598 100644
--- a/packages/experiments/src/utilities/keytip/KeytipTree.ts
+++ b/packages/experiments/src/utilities/keytip/KeytipTree.ts
@@ -4,7 +4,7 @@ import {
   keySequenceStartsWith,
   convertSequencesToKeytipID
 } from '../../utilities/keysequence/IKeySequence';
-import { IKeytipProps } from 'src/Keytip';
+import { IKeytipProps } from '../../Keytip';
 import { find } from '../../Utilities';
 
 export interface IKeytipTreeNode {

From 2cf6fefa3c6aa497e2e6e1e748b4bf57abc1b480 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Wed, 7 Mar 2018 15:20:09 -0800
Subject: [PATCH 1523/1641] MessageBar: Dismiss button and overflow button aria
 labels (#4166)

* Added overflowButtonAriaLabel

* Updated examples to include aria labels for buttons

* One more dismiss button label

* Added change file
---
 .../messagebar-aria_2018-03-02-23-40.json             | 11 +++++++++++
 .../src/components/MessageBar/MessageBar.tsx          |  2 +-
 .../src/components/MessageBar/MessageBar.types.ts     |  5 +++++
 .../MessageBar/examples/MessageBar.Basic.Example.tsx  |  4 ++++
 4 files changed, 21 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/messagebar-aria_2018-03-02-23-40.json

diff --git a/common/changes/office-ui-fabric-react/messagebar-aria_2018-03-02-23-40.json b/common/changes/office-ui-fabric-react/messagebar-aria_2018-03-02-23-40.json
new file mode 100644
index 0000000000000..6f01725162887
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/messagebar-aria_2018-03-02-23-40.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "MessageBar: Aria label for truncated text overflow button and added aria labels for buttons in examples.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
index b87480c68fd7f..ee806b0537517 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
@@ -114,7 +114,7 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
             className={ css('ms-MessageBar-expand', styles.expand) }
             onClick={ this._onClick }
             iconProps={ { iconName: this.state.expandSingleLine ? 'DoubleChevronUp' : 'DoubleChevronDown' } }
-            ariaLabel={ this.props.dismissButtonAriaLabel }
+            ariaLabel={ this.props.overflowButtonAriaLabel }
           />
         </div>
       );
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts
index 3fb450e9eeed3..43922025a3822 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts
@@ -54,6 +54,11 @@ export interface IMessageBarProps extends React.HTMLAttributes<HTMLElement> {
   * @defaultvalue false
   */
   truncated?: boolean;
+
+  /**
+  * Aria label on overflow button if truncated is defined.
+  */
+  overflowButtonAriaLabel?: string;
 }
 
 export enum MessageBarType {
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx
index 1082a2ad73524..e484f8ac25c88 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/examples/MessageBar.Basic.Example.tsx
@@ -20,6 +20,7 @@ export const MessageBarBasicExample = () => (
       messageBarType={ MessageBarType.error }
       isMultiline={ false }
       onDismiss={ log('test') }
+      dismissButtonAriaLabel='Close'
     >
       Error lorem ipsum dolor sit amet, a elit sem interdum consectetur adipiscing elit. <Link href='www.bing.com'>Visit our website.</Link>
     </MessageBar>
@@ -29,7 +30,9 @@ export const MessageBarBasicExample = () => (
       messageBarType={ MessageBarType.blocked }
       isMultiline={ false }
       onDismiss={ log('test') }
+      dismissButtonAriaLabel='Close'
       truncated={ true }
+      overflowButtonAriaLabel='Overflow'
     >
       Blocked lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi luctus, purus a lobortis tristique, odio augue pharetra metus, ac placerat nunc mi nec dui. Vestibulum aliquam et nunc semper scelerisque. Curabitur vitae orci nec quam condimentum porttitor et sed lacus. Vivamus ac efficitur leo. Cras faucibus mauris libero, ac placerat erat euismod et. Donec pulvinar commodo odio sit amet faucibus. In hac habitasse platea dictumst. Duis eu ante commodo, condimentum nibh pellentesque, laoreet enim. Fusce massa lorem, ultrices eu mi a, fermentum suscipit magna. Integer porta purus pulvinar, hendrerit felis eget, condimentum mauris. <Link href='www.bing.com'>Visit our website.</Link>
     </MessageBar>
@@ -65,6 +68,7 @@ export const MessageBarBasicExample = () => (
     <Label>Warning MessageBar - defaults to multiline, with dismiss and action buttons</Label>
     <MessageBar
       onDismiss={ log('test') }
+      dismissButtonAriaLabel='Close'
       messageBarType={ MessageBarType.warning }
       ariaLabel='Aria help text here'
       actions={

From 48ad19d4b13e248d91a70fd59960e85a00753d96 Mon Sep 17 00:00:00 2001
From: manueldosal <manuel_dosal32@hotmail.com>
Date: Wed, 7 Mar 2018 15:54:07 -0800
Subject: [PATCH 1524/1641] Adding onPendingValueChanged callback (#4105)

* Adding onPendingValueSet callback

* Adding rush change file

* Creating two props for preview and revert preview

* Fixing some spaces

* Changed description

* Adding currentPendingValue back to address free form

* Going back to onPendingValueChanged

* Adding some comments

* Renaming variable to sendUndefinedPendingValue

* Reducing the logic to only send one callback

* Simplifying logic

* Changing the comment description

* Fixing newPendingIndex condition
---
 ...ingValueSet_Callback_2018-02-27-01-11.json | 11 +++++
 .../src/components/ComboBox/ComboBox.tsx      | 47 ++++++++++++++++++-
 .../src/components/ComboBox/ComboBox.types.ts |  5 ++
 .../examples/ComboBox.Basic.Example.tsx       | 30 ++++++------
 4 files changed, 78 insertions(+), 15 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/ComboBox_Add_onPendingValueSet_Callback_2018-02-27-01-11.json

diff --git a/common/changes/office-ui-fabric-react/ComboBox_Add_onPendingValueSet_Callback_2018-02-27-01-11.json b/common/changes/office-ui-fabric-react/ComboBox_Add_onPendingValueSet_Callback_2018-02-27-01-11.json
new file mode 100644
index 0000000000000..80e16872b9bf2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/ComboBox_Add_onPendingValueSet_Callback_2018-02-27-01-11.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox adding onPendingValueChanged callback prop to run when pending value is changed",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "madosal@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index a04e83213471e..eeb67596e1afc 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -122,6 +122,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
   private _isScrollIdle: boolean;
 
+  private _hasPendingValue: boolean;
+
   private readonly _scrollIdleDelay: number = 250 /* ms */;
 
   private _scrollIdleTimeoutId: number | undefined;
@@ -233,6 +235,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       this._select();
     }
 
+    this._notifyPendingValueChanged(prevState);
+
     if (isOpen && !prevState.isOpen && onMenuOpen) {
       onMenuOpen();
     }
@@ -688,7 +692,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * @param searchDirection - the direction to search along the options from the given index
    */
   private _setSelectedIndex(index: number, searchDirection: SearchDirection = SearchDirection.none) {
-    const { onChanged } = this.props;
+    const { onChanged, onPendingValueChanged } = this.props;
     const { selectedIndex, currentOptions } = this.state;
 
     // Find the next selectable index, if searchDirection is none
@@ -709,6 +713,12 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         selectedIndex: index
       });
 
+      // If ComboBox value is changed, revert preview first
+      if (this._hasPendingValue && onPendingValueChanged) {
+        onPendingValueChanged();
+        this._hasPendingValue = false;
+      }
+
       // Did the creator give us an onChanged callback?
       if (onChanged) {
         onChanged(option, index);
@@ -1235,6 +1245,41 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     }
   }
 
+  private _notifyPendingValueChanged(prevState: IComboBoxState) {
+    const { onPendingValueChanged } = this.props;
+
+    if (!onPendingValueChanged) {
+      return;
+    }
+
+    const {
+      currentPendingValue,
+      currentOptions,
+      currentPendingValueValidIndex,
+      currentPendingValueValidIndexOnHover
+    } = this.state;
+
+    let newPendingIndex: number | undefined = undefined;
+    let newPendingValue: string | undefined = undefined;
+
+    if (currentPendingValueValidIndexOnHover !== prevState.currentPendingValueValidIndexOnHover && this._indexWithinBounds(currentOptions, currentPendingValueValidIndexOnHover)) {
+      // Set new pending index if hover index was changed
+      newPendingIndex = currentPendingValueValidIndexOnHover;
+    } else if (currentPendingValueValidIndex !== prevState.currentPendingValueValidIndex && this._indexWithinBounds(currentOptions, currentPendingValueValidIndex)) {
+      // Set new pending index if currentPendingValueValidIndex was changed
+      newPendingIndex = currentPendingValueValidIndex;
+    } else if (currentPendingValue !== prevState.currentPendingValue && currentPendingValue !== '') {
+      // Set pendingValue in the case it was changed and no index was changed
+      newPendingValue = currentPendingValue;
+    }
+
+    // Notify when there is a new pending index/value. Also, if there is a pending value, it needs to send undefined.
+    if (newPendingIndex !== undefined || newPendingValue || this._hasPendingValue) {
+      onPendingValueChanged(newPendingIndex ? currentOptions[newPendingIndex] : undefined, newPendingIndex, newPendingValue);
+      this._hasPendingValue = newPendingIndex !== undefined || newPendingValue !== undefined;
+    }
+  }
+
   /**
    * Sets the isOpen state and updates focusInputAfterClose
    */
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
index d8380bf22bd0d..4a8d53820f8b4 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
@@ -48,6 +48,11 @@ export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox>
    */
   onChanged?: (option?: IComboBoxOption, index?: number, value?: string) => void;
 
+  /**
+   * Callback issued when the user changes the pending value in ComboBox
+   */
+  onPendingValueChanged?: (option?: IComboBoxOption, index?: number, value?: string) => void;
+
   /**
    * Function that gets invoked when the ComboBox menu is launched
    */
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
index d1cb4b9ac5bcc..808f65d3b456a 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
@@ -19,20 +19,20 @@ export class ComboBoxBasicExample extends React.Component<{}, {
   value?: string;
 }> {
   private _testOptions =
-    [{ key: 'Header', text: 'Theme Fonts', itemType: SelectableOptionMenuItemType.Header },
-    { key: 'A', text: 'Arial Black' },
-    { key: 'B', text: 'Times New Roman' },
-    { key: 'C', text: 'Comic Sans MS' },
-    { key: 'divider_2', text: '-', itemType: SelectableOptionMenuItemType.Divider },
-    { key: 'Header1', text: 'Other Options', itemType: SelectableOptionMenuItemType.Header },
-    { key: 'D', text: 'Option d' },
-    { key: 'E', text: 'Option e' },
-    { key: 'F', text: 'Option f' },
-    { key: 'G', text: 'Option g' },
-    { key: 'H', text: 'Option h' },
-    { key: 'I', text: 'Option i' },
-    { key: 'J', text: 'Option j', disabled: true },
-    ];
+  [{ key: 'Header', text: 'Theme Fonts', itemType: SelectableOptionMenuItemType.Header },
+  { key: 'A', text: 'Arial Black' },
+  { key: 'B', text: 'Times New Roman' },
+  { key: 'C', text: 'Comic Sans MS' },
+  { key: 'divider_2', text: '-', itemType: SelectableOptionMenuItemType.Divider },
+  { key: 'Header1', text: 'Other Options', itemType: SelectableOptionMenuItemType.Header },
+  { key: 'D', text: 'Option d' },
+  { key: 'E', text: 'Option e' },
+  { key: 'F', text: 'Option f' },
+  { key: 'G', text: 'Option g' },
+  { key: 'H', text: 'Option h' },
+  { key: 'I', text: 'Option i' },
+  { key: 'J', text: 'Option j', disabled: true },
+  ];
 
   private _fontMapping: { [key: string]: string } = {
     ['Arial Black']: '"Arial Black", "Arial Black_MSFontService", sans-serif',
@@ -80,6 +80,7 @@ export class ComboBoxBasicExample extends React.Component<{}, {
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
           onMenuOpen={ () => console.log('ComboBox menu opened') }
+          onPendingValueChanged={ (option, pendingIndex, pendingValue) => console.log('Preview value was changed. Pending index: ' + pendingIndex + '. Pending value: ' + pendingValue) }
         // tslint:enable:jsx-no-lambda
         />
 
@@ -132,6 +133,7 @@ export class ComboBoxBasicExample extends React.Component<{}, {
           onFocus={ () => console.log('onFocus called') }
           onBlur={ () => console.log('onBlur called') }
           onMenuOpen={ () => console.log('ComboBox menu opened') }
+          onPendingValueChanged={ (option, pendingIndex, pendingValue) => console.log('Preview value was changed. Pending index: ' + pendingIndex + '. Pending value: ' + pendingValue) }
         // tslint:enable:jsx-no-lambda
         />
 

From 61c7a055825c41f828c416e5370212804f71d05c Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Wed, 7 Mar 2018 16:49:37 -0800
Subject: [PATCH 1525/1641] Addressing Issue #3988 - Customizable Decorator
 conflicting with Static class Functions (#4208)

* Added a hoistStatics function to customizable decorator

* added @customizable decorator to Image and Layer

* rush change

* cleanup test code
---
 ...ustomizable-hoisting_2018-03-07-21-58.json | 11 +++++++++++
 ...ustomizable-hoisting_2018-03-07-21-58.json | 11 +++++++++++
 .../src/components/Image/Image.base.tsx       |  4 ++--
 .../src/components/Layer/Layer.base.tsx       |  2 ++
 packages/utilities/src/customizable.tsx       | 19 ++++++++++++++++---
 5 files changed, 42 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/customizable-hoisting_2018-03-07-21-58.json
 create mode 100644 common/changes/office-ui-fabric-react/customizable-hoisting_2018-03-07-21-58.json

diff --git a/common/changes/@uifabric/utilities/customizable-hoisting_2018-03-07-21-58.json b/common/changes/@uifabric/utilities/customizable-hoisting_2018-03-07-21-58.json
new file mode 100644
index 0000000000000..1103fda8a75cb
--- /dev/null
+++ b/common/changes/@uifabric/utilities/customizable-hoisting_2018-03-07-21-58.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Added hoistStatics function to @customizable decorator so static methods work properly",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/customizable-hoisting_2018-03-07-21-58.json b/common/changes/office-ui-fabric-react/customizable-hoisting_2018-03-07-21-58.json
new file mode 100644
index 0000000000000..7af05007afefa
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/customizable-hoisting_2018-03-07-21-58.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added the @customizable decorator to Image and Layer to enable theme functionality",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx
index 1fe6bc5970c17..ce2ebe0699bc5 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx
@@ -5,7 +5,7 @@ import {
   autobind,
   BaseComponent,
   classNamesFunction,
-  // customizable,
+  customizable,
   getNativeProps,
   imageProperties
 } from '../../Utilities';
@@ -26,7 +26,7 @@ export interface IImageState {
 
 const KEY_PREFIX = 'fabricImage';
 
-// @customizable('Image', ['theme'])
+@customizable('Image', ['theme'])
 export class ImageBase extends BaseComponent<IImageProps, IImageState> {
   public static defaultProps = {
     shouldFadeIn: true
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.base.tsx b/packages/office-ui-fabric-react/src/components/Layer/Layer.base.tsx
index 5b103565134f2..f241acbd41139 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/Layer.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.base.tsx
@@ -12,6 +12,7 @@ import {
 import {
   BaseComponent,
   classNamesFunction,
+  customizable,
   getDocument,
   setVirtualParent
 } from '../../Utilities';
@@ -21,6 +22,7 @@ let _defaultHostSelector: string | undefined;
 
 const getClassNames = classNamesFunction<ILayerStyleProps, ILayerStyles>();
 
+@customizable('Layer', ['theme'])
 export class LayerBase extends BaseComponent<ILayerProps, {}> {
 
   public static defaultProps: ILayerProps = {
diff --git a/packages/utilities/src/customizable.tsx b/packages/utilities/src/customizable.tsx
index 962bde6e14252..a3a99e57167b5 100644
--- a/packages/utilities/src/customizable.tsx
+++ b/packages/utilities/src/customizable.tsx
@@ -14,14 +14,14 @@ export function customizable(
     ComposedComponent: (new (props: P, ...args: any[]) => React.Component<P, S>)
     // tslint:disable-next-line:no-any
   ): any {
-    return class ComponentWithInjectedProps extends React.Component<P, {}> {
+    const resultClass = class ComponentWithInjectedProps extends React.Component<P, {}> {
       public static displayName: string = 'Customized' + scope;
 
       public static contextTypes: {
         customizations: PropTypes.Requireable<{}>;
       } = {
-        customizations: PropTypes.object
-      };
+          customizations: PropTypes.object
+        };
 
       // tslint:disable-next-line:no-any
       constructor(props: P, context: any) {
@@ -52,5 +52,18 @@ export function customizable(
       }
 
     };
+
+    return hoistStatics(ComposedComponent, resultClass);
   };
 }
+
+function hoistStatics<TSource, TDest>(source: TSource, dest: TDest): TDest {
+  for (const name in source) {
+    if (source.hasOwnProperty(name)) {
+      // tslint:disable-next-line:no-any
+      (dest as any)[name] = source[name];
+    }
+  }
+
+  return dest;
+}
\ No newline at end of file

From ddbc143933a849629f6b26d13e3c8e1cb85c3b35 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Wed, 7 Mar 2018 19:14:50 -0800
Subject: [PATCH 1526/1641] Fix typo in merge styles readme (#4203)

---
 packages/merge-styles/README.md | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/merge-styles/README.md b/packages/merge-styles/README.md
index cfab2d1d51b85..e76ef60d0f5c8 100644
--- a/packages/merge-styles/README.md
+++ b/packages/merge-styles/README.md
@@ -204,11 +204,12 @@ To register a selector globally, wrap it in a `:global()` wrapper:
 ```tsx
 {
   selectors: {
-    ':global(button): {
+    ':global(button)': {
       overflow: 'visible'
     }
   }
 }
+```
 
 ### Media queries
 

From 896424f02213b0d7fef1923649bbe3641d095e1a Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 8 Mar 2018 03:27:24 -0800
Subject: [PATCH 1527/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...to-experiment-export_2018-03-05-23-11.json | 11 ------
 ...ustomizable-hoisting_2018-03-07-21-58.json | 11 ------
 ...xtMenu-sample-styles_2018-03-06-19-11.json | 11 ------
 ...ingValueSet_Callback_2018-02-27-01-11.json | 11 ------
 ...ustomizable-hoisting_2018-03-07-21-58.json | 11 ------
 .../messagebar-aria_2018-03-02-23-40.json     | 11 ------
 .../persona-splitscss_2018-03-07-00-00.json   | 11 ------
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/CHANGELOG.json           | 19 ++++++++++
 packages/experiments/CHANGELOG.md             |  9 ++++-
 packages/experiments/package.json             |  4 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 36 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 +++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 ++++++++
 packages/utilities/CHANGELOG.md               |  9 ++++-
 packages/utilities/package.json               |  2 +-
 23 files changed, 111 insertions(+), 92 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/keyou-add-keytips-to-experiment-export_2018-03-05-23-11.json
 delete mode 100644 common/changes/@uifabric/utilities/customizable-hoisting_2018-03-07-21-58.json
 delete mode 100644 common/changes/@uifabric/utilities/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
 delete mode 100644 common/changes/office-ui-fabric-react/ComboBox_Add_onPendingValueSet_Callback_2018-02-27-01-11.json
 delete mode 100644 common/changes/office-ui-fabric-react/customizable-hoisting_2018-03-07-21-58.json
 delete mode 100644 common/changes/office-ui-fabric-react/messagebar-aria_2018-03-02-23-40.json
 delete mode 100644 common/changes/office-ui-fabric-react/persona-splitscss_2018-03-07-00-00.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index c2c8707d7d90b..0dacc2f588e6c 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.60.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.61.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 6a2aa0ee68e92..a0363f175d4ec 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.60.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.61.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 7b3e7423f4821..d4f9787a3c980 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.60.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.61.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 2fa286f59f930..130dac5e95e08 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.60.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.61.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index a13bc52363710..cd66dbdf8abfd 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.60.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.61.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/common/changes/@uifabric/experiments/keyou-add-keytips-to-experiment-export_2018-03-05-23-11.json b/common/changes/@uifabric/experiments/keyou-add-keytips-to-experiment-export_2018-03-05-23-11.json
deleted file mode 100644
index fb80aad9828cf..0000000000000
--- a/common/changes/@uifabric/experiments/keyou-add-keytips-to-experiment-export_2018-03-05-23-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Add Keytip and KeytipLayer to experiments export",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "keyou@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/customizable-hoisting_2018-03-07-21-58.json b/common/changes/@uifabric/utilities/customizable-hoisting_2018-03-07-21-58.json
deleted file mode 100644
index 1103fda8a75cb..0000000000000
--- a/common/changes/@uifabric/utilities/customizable-hoisting_2018-03-07-21-58.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Added hoistStatics function to @customizable decorator so static methods work properly",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json b/common/changes/@uifabric/utilities/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
deleted file mode 100644
index 8693c0e083bae..0000000000000
--- a/common/changes/@uifabric/utilities/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/utilities",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "v-jojanz@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/ComboBox_Add_onPendingValueSet_Callback_2018-02-27-01-11.json b/common/changes/office-ui-fabric-react/ComboBox_Add_onPendingValueSet_Callback_2018-02-27-01-11.json
deleted file mode 100644
index 80e16872b9bf2..0000000000000
--- a/common/changes/office-ui-fabric-react/ComboBox_Add_onPendingValueSet_Callback_2018-02-27-01-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox adding onPendingValueChanged callback prop to run when pending value is changed",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "madosal@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/customizable-hoisting_2018-03-07-21-58.json b/common/changes/office-ui-fabric-react/customizable-hoisting_2018-03-07-21-58.json
deleted file mode 100644
index 7af05007afefa..0000000000000
--- a/common/changes/office-ui-fabric-react/customizable-hoisting_2018-03-07-21-58.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added the @customizable decorator to Image and Layer to enable theme functionality",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/messagebar-aria_2018-03-02-23-40.json b/common/changes/office-ui-fabric-react/messagebar-aria_2018-03-02-23-40.json
deleted file mode 100644
index 6f01725162887..0000000000000
--- a/common/changes/office-ui-fabric-react/messagebar-aria_2018-03-02-23-40.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "MessageBar: Aria label for truncated text overflow button and added aria labels for buttons in examples.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/persona-splitscss_2018-03-07-00-00.json b/common/changes/office-ui-fabric-react/persona-splitscss_2018-03-07-00-00.json
deleted file mode 100644
index 31b2b3cae3401..0000000000000
--- a/common/changes/office-ui-fabric-react/persona-splitscss_2018-03-07-00-00.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Seperated the SCSS for Persona and Persona Coin components due to bloat when imported twice.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 8f5fa8f7dc0ad..12980e35d4d9d 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.19.0 <6.0.0",
-    "@uifabric/utilities": ">=5.15.0 <6.0.0",
+    "@uifabric/utilities": ">=5.16.0 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 3c998dbe026f3..a17ada17345b2 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.24.1",
+      "tag": "@uifabric/experiments_v5.24.1",
+      "date": "Thu, 08 Mar 2018 11:27:23 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Kelsey Young <kelseyyoung4@gmail.com>",
+            "commit": "ddc5731a85effd6082a93fe3458528224674a70c",
+            "comment": "Add Keytip and KeytipLayer to experiments export"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.60.1 <6.0.0` to `>=5.61.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.24.0",
       "tag": "@uifabric/experiments_v5.24.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index fd5b2c3eb5ada..9ef1e0e186919 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Wed, 07 Mar 2018 11:16:50 GMT and should not be manually modified.
+This log was last generated on Thu, 08 Mar 2018 11:27:23 GMT and should not be manually modified.
+
+## 5.24.1
+Thu, 08 Mar 2018 11:27:23 GMT
+
+### Patches
+
+- Add Keytip and KeytipLayer to experiments export
 
 ## 5.24.0
 Wed, 07 Mar 2018 11:16:50 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index b7afa0024d5ea..a046dc881be8d 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.24.0",
+  "version": "5.24.1",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.60.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.61.0 <6.0.0",
     "@uifabric/icons": ">=5.5.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 9164125754b8a..29978166a242d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,42 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.61.0",
+      "tag": "office-ui-fabric-react_v5.61.0",
+      "date": "Thu, 08 Mar 2018 11:27:24 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "manueldosal <manuel_dosal32@hotmail.com>",
+            "commit": "48ad19d4b13e248d91a70fd59960e85a00753d96",
+            "comment": "ComboBox adding onPendingValueChanged callback prop to run when pending value is changed"
+          },
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "dfe67eaf43e3d135075cfd9feea5acd40466c88e",
+            "comment": "Seperated the SCSS for Persona and Persona Coin components due to bloat when imported twice."
+          }
+        ],
+        "minor": [
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "61c7a055825c41f828c416e5370212804f71d05c",
+            "comment": "Added the @customizable decorator to Image and Layer to enable theme functionality"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "2cf6fefa3c6aa497e2e6e1e748b4bf57abc1b480",
+            "comment": "MessageBar: Aria label for truncated text overflow button and added aria labels for buttons in examples."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.15.0 <6.0.0` to `>=5.16.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.60.1",
       "tag": "office-ui-fabric-react_v5.60.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 145f4b125f73c..9f4b7d223bd22 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 07 Mar 2018 11:16:50 GMT and should not be manually modified.
+This log was last generated on Thu, 08 Mar 2018 11:27:24 GMT and should not be manually modified.
+
+## 5.61.0
+Thu, 08 Mar 2018 11:27:24 GMT
+
+### Minor changes
+
+- Added the @customizable decorator to Image and Layer to enable theme functionality
+- MessageBar: Aria label for truncated text overflow button and added aria labels for buttons in examples.
+
+### Patches
+
+- ComboBox adding onPendingValueChanged callback prop to run when pending value is changed
+- Seperated the SCSS for Persona and Persona Coin components due to bloat when imported twice.
 
 ## 5.60.1
 Wed, 07 Mar 2018 11:16:50 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index bed1945d409cb..29148d0e43ff8 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.60.1",
+  "version": "5.61.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -51,7 +51,7 @@
     "@uifabric/icons": ">=5.5.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "@uifabric/styling": ">=5.19.0 <6.0.0",
-    "@uifabric/utilities": ">=5.15.0 <6.0.0",
+    "@uifabric/utilities": ">=5.16.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index b9d56b5ddac51..c18e10215de2f 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.15.0 <6.0.0",
+    "@uifabric/utilities": ">=5.16.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 9cadabe23e252..36aaafd5e1db7 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.16.0",
+      "tag": "@uifabric/utilities_v5.16.0",
+      "date": "Thu, 08 Mar 2018 11:27:24 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "61c7a055825c41f828c416e5370212804f71d05c",
+            "comment": "Added hoistStatics function to @customizable decorator so static methods work properly"
+          }
+        ]
+      }
+    },
     {
       "version": "5.15.0",
       "tag": "@uifabric/utilities_v5.15.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 9d4a554deb1c2..cb04c0cf51214 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Tue, 06 Mar 2018 11:13:36 GMT and should not be manually modified.
+This log was last generated on Thu, 08 Mar 2018 11:27:24 GMT and should not be manually modified.
+
+## 5.16.0
+Thu, 08 Mar 2018 11:27:24 GMT
+
+### Minor changes
+
+- Added hoistStatics function to @customizable decorator so static methods work properly
 
 ## 5.15.0
 Tue, 06 Mar 2018 11:13:36 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 7ae153f8df525..2dc44f51c3257 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.15.0",
+  "version": "5.16.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From b410f6b9a328dd4ad24cbaa739156c23880e44e4 Mon Sep 17 00:00:00 2001
From: Jordan Janzen <jordancjanzen@gmail.com>
Date: Thu, 8 Mar 2018 08:36:16 -0800
Subject: [PATCH 1528/1641] Dialog: Converting to mergeStyles part 2 - style
 conversion (#4160)

* Convert scss to styles.ts (no classNames yet)

* Use getStyles in base component.

* Add base component class names

* Make styles required.

* Separate DialogContent styles and types

* Move DialogContent className logic to styles file.

* Organize props

* Split DialogFooter styles and types

* Comment and deprecate some props

* Support isMultiline prop and clean up

* private _className method

* npm run change output

* Update snapshot

* Simplify styles conditionals

* Delete sass file

* Add fallbacks for className checks.

* Simplify stylesets with no styles

* Move default width variables to style props.

* better className fallbacks

* nit

* Fix font weight.

* Add className to footer and fix type issues.

* Fix more type errors

* Add hoistStatics function to @withResponsiveMode decorator

* npm run change output
---
 ...Styles-Dialog-round2_2018-03-08-01-38.json |  11 ++
 ...Styles-Dialog-round2_2018-03-08-01-38.json |  11 ++
 ...Styles-Dialog-round2_2018-03-02-01-05.json |  11 ++
 .../src/components/Dialog/Dialog.base.tsx     |  41 +++--
 .../src/components/Dialog/Dialog.scss         | 150 ------------------
 .../src/components/Dialog/Dialog.styles.ts    |  30 +++-
 .../src/components/Dialog/Dialog.types.ts     |  33 +++-
 .../components/Dialog/DialogContent.base.tsx  |  51 +++---
 .../components/Dialog/DialogContent.styles.ts | 127 ++++++++++++++-
 .../components/Dialog/DialogContent.types.ts  |  27 +++-
 .../components/Dialog/DialogFooter.base.tsx   |  38 ++++-
 .../components/Dialog/DialogFooter.styles.ts  |  38 ++++-
 .../components/Dialog/DialogFooter.types.ts   |  20 +--
 .../Dialog/__snapshots__/Dialog.test.tsx.snap |  71 ++++++++-
 .../decorators/withResponsiveMode.tsx         |  15 +-
 15 files changed, 445 insertions(+), 229 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/mergeStyles-Dialog-round2_2018-03-08-01-38.json
 create mode 100644 common/changes/@uifabric/utilities/mergeStyles-Dialog-round2_2018-03-08-01-38.json
 create mode 100644 common/changes/office-ui-fabric-react/mergeStyles-Dialog-round2_2018-03-02-01-05.json
 delete mode 100644 packages/office-ui-fabric-react/src/components/Dialog/Dialog.scss

diff --git a/common/changes/@uifabric/fabric-website/mergeStyles-Dialog-round2_2018-03-08-01-38.json b/common/changes/@uifabric/fabric-website/mergeStyles-Dialog-round2_2018-03-08-01-38.json
new file mode 100644
index 0000000000000..8f4224c4cc65b
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/mergeStyles-Dialog-round2_2018-03-08-01-38.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "@uifabric/fabric-website",
+      "type": "none"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "v-jojanz@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/mergeStyles-Dialog-round2_2018-03-08-01-38.json b/common/changes/@uifabric/utilities/mergeStyles-Dialog-round2_2018-03-08-01-38.json
new file mode 100644
index 0000000000000..46b0ccfc46b68
--- /dev/null
+++ b/common/changes/@uifabric/utilities/mergeStyles-Dialog-round2_2018-03-08-01-38.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Add hoistStatics function to withResponsiveMode decorator.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "v-jojanz@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round2_2018-03-02-01-05.json b/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round2_2018-03-02-01-05.json
new file mode 100644
index 0000000000000..8105d557df85b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round2_2018-03-02-01-05.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dialog: convert to mergeStyles part 2.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-jojanz@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.base.tsx b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.base.tsx
index dc8434d5d3f6d..54e5220ea7ddb 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.base.tsx
@@ -1,15 +1,20 @@
 import * as React from 'react';
 import {
   BaseComponent,
-  css,
+  classNamesFunction,
+  customizable,
   getId
 } from '../../Utilities';
-import { IDialogProps } from './Dialog.types';
+import {
+  IDialogProps,
+  IDialogStyleProps,
+  IDialogStyles,
+} from './Dialog.types';
 import { DialogType, IDialogContentProps } from './DialogContent.types';
 import { Modal, IModalProps } from '../../Modal';
 import { withResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
-import * as stylesImport from './Dialog.scss';
-const styles: any = stylesImport;
+
+const getClassNames = classNamesFunction<IDialogStyleProps, IDialogStyles>();
 
 import { DialogContent } from './DialogContent';
 
@@ -26,6 +31,7 @@ const DefaultDialogContentProps: IDialogContentProps = {
   topButtonsProps: [],
 };
 
+@customizable('Dialog', ['theme'])
 @withResponsiveMode
 export class DialogBase extends BaseComponent<IDialogProps, {}> {
   public static defaultProps: IDialogProps = {
@@ -62,26 +68,28 @@ export class DialogBase extends BaseComponent<IDialogProps, {}> {
 
   public render() {
     const {
+      className,
+      containerClassName,
+      contentClassName,
       elementToFocusOnDismiss,
       firstFocusableSelector,
       forceFocusInsideTrap,
+      getStyles,
+      hidden,
       ignoreExternalFocusing,
       isBlocking,
       isClickableOutsideFocusTrap,
       isDarkOverlay,
       isOpen,
-      className,
       onDismiss,
       onDismissed,
       onLayerDidMount,
       responsiveMode,
       subText,
+      theme,
       title,
-      type,
-      contentClassName,
       topButtonsProps,
-      containerClassName,
-      hidden
+      type,
     } = this.props;
 
     const modalProps = {
@@ -91,9 +99,16 @@ export class DialogBase extends BaseComponent<IDialogProps, {}> {
 
     const dialogContentProps: IDialogContentProps = {
       ...DefaultDialogContentProps,
-      ...this.props.dialogContentProps
+      ...this.props.dialogContentProps,
     };
 
+    const classNames = getClassNames(getStyles!, {
+      theme: theme!,
+      className: className || modalProps!.className,
+      containerClassName: containerClassName || modalProps!.containerClassName,
+      hidden,
+    });
+
     return (
       <Modal
         elementToFocusOnDismiss={ elementToFocusOnDismiss }
@@ -108,8 +123,8 @@ export class DialogBase extends BaseComponent<IDialogProps, {}> {
         isDarkOverlay={ isDarkOverlay !== undefined ? isDarkOverlay : modalProps!.isDarkOverlay }
         isBlocking={ isBlocking !== undefined ? isBlocking : modalProps!.isBlocking }
         isOpen={ isOpen !== undefined ? isOpen : !hidden }
-        className={ css('ms-Dialog', className ? className : modalProps!.className) }
-        containerClassName={ css(styles.main, containerClassName ? containerClassName : modalProps!.containerClassName) }
+        className={ classNames.root }
+        containerClassName={ classNames.main }
         onDismiss={ onDismiss ? onDismiss : modalProps!.onDismiss }
         subtitleAriaId={ this._getSubTextId() }
         titleAriaId={ this._getTitleTextId() }
@@ -123,7 +138,7 @@ export class DialogBase extends BaseComponent<IDialogProps, {}> {
           topButtonsProps={ topButtonsProps ? topButtonsProps : dialogContentProps!.topButtonsProps }
           type={ type !== undefined ? type : dialogContentProps!.type }
           onDismiss={ onDismiss ? onDismiss : dialogContentProps!.onDismiss }
-          className={ css(contentClassName ? contentClassName : dialogContentProps!.className) }
+          className={ contentClassName || dialogContentProps!.className }
           { ...dialogContentProps }
         >
           { this.props.children }
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.scss b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.scss
deleted file mode 100644
index aaebc582a2d50..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.scss
+++ /dev/null
@@ -1,150 +0,0 @@
-@import '../../common/common';
-
-// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
-
-//
-// Office UI Fabric
-// --------------------------------------------------
-// Dialog styles
-
-$Dialog-lgHeader-backgroundColor: $ms-color-themePrimary;
-$Dialog-default-min-width: 288px;
-$Dialog-default-max-width: 340px;
-
-// State: The dialog is open
-.isOpen {
-  display: flex;
-}
-
-// The actual dialog element
-.main {
-  width: $Dialog-default-min-width;
-}
-
-// Close button, hidden by default
-.button.isClose {
-  :global(.ms-Icon.ms-Icon--Cancel) {
-    color: $ms-color-neutralSecondary;
-    font-size: 16px;
-  }
-}
-
-.inner {
-  padding: 0 28px 20px;
-}
-
-.header {
-  position: relative;
-  width: 100%;
-  box-sizing: border-box;
-}
-
-.title {
-  margin: 0;
-  @include ms-font-xl;
-  color: $ms-color-neutralPrimary;
-  @include ms-padding(20px, 36px, 20px, 28px);
-}
-
-.topButton {
-  display: flex;
-  flex-direction: row;
-  flex-wrap: nowrap;
-  position: absolute;
-  top: 0;
-  @include ms-right(0);
-  @include ms-padding(12px, 12px, 0, 0);
-  > * {
-    flex: 0 0 auto;
-  }
-}
-
-.content {
-  position: relative;
-  width: 100%;
-
-  // Add margin bottom between compound buttons
-  :global(.ms-Button.ms-Button--compound) {
-    margin-bottom: 20px;
-
-    &:last-child {
-      margin-bottom: 0;
-    }
-  }
-}
-
-.subText {
-  margin: 0 0 20px 0;
-  padding-top: 8px;
-  @include ms-font-s;
-  color: $ms-color-neutralPrimary;
-  font-weight: $ms-font-weight-semilight;
-  line-height: 1.5;
-  word-wrap: break-word;
-}
-
-.actions {
-  position: relative;
-  width: 100%;
-  min-height:  24px;
-  line-height: 24px;
-  margin: 20px 0 0;
-  font-size: 0;
-
-  :global(.ms-Button) {
-    line-height: normal;
-  }
-}
-
-// Negative margin to needed to compensate for symmetric
-// padding between action elements.
-.actionsRight {
-  @include ms-text-align(right);
-  @include ms-margin-right(-4px);
-  font-size: 0;
-
-  // Reset spacing for first button
-  .action {
-    margin: 0px 4px;
-  }
-}
-
-//= Modifier: Multiline button dialog
-//
-.isMultiline {
-  .title {
-    font-size: $ms-font-size-xxl;
-  }
-
-  .inner {
-    padding: 0 20px 20px;
-  }
-}
-
-//= Modifier: Large header dialog
-//
-.isLargeHeader {
-  .header {
-    background-color: $Dialog-lgHeader-backgroundColor;
-  }
-
-  .title {
-    @include ms-font-xxl;
-    color: $ms-color-white;
-    padding: 26px 28px 28px;
-    margin-bottom: 8px;
-  }
-
-  .subText {
-    font-size: $ms-font-size-m;
-  }
-}
-
-@media (min-width: $ms-screen-min-md) {
-  // Allow wider dialog on larger screens
-  .main {
-    width: auto;
-    min-width: $Dialog-default-min-width;
-    max-width: $Dialog-default-max-width;
-  }
-}
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.styles.ts b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.styles.ts
index 9e56e1011cae4..990aa517aace8 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.styles.ts
@@ -1,17 +1,39 @@
 import { IDialogStyleProps, IDialogStyles } from './Dialog.types';
+import {
+  ScreenWidthMinMedium,
+} from '../../Styling';
 
 export const getStyles = (
   props: IDialogStyleProps
 ): IDialogStyles => {
+  const {
+    className,
+    containerClassName,
+    dialogDefaultMinWidth = '288px',
+    dialogDefaultMaxWidth = '340px',
+    hidden,
+  } = props;
 
   return ({
     root: [
       'ms-Dialog',
-      {
-        // Insert css properties
-      }
+      className,
     ],
 
-    // Insert className styles
+    main: [
+      {
+        width: dialogDefaultMinWidth,
+
+        selectors: {
+          [`@media (min-width: ${ScreenWidthMinMedium}px)`]: {
+            width: 'auto',
+            maxWidth: dialogDefaultMaxWidth,
+            minWidth: dialogDefaultMinWidth,
+          }
+        }
+      },
+      !hidden && { display: 'flex' },
+      containerClassName,
+    ]
   });
 };
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.types.ts b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.types.ts
index 5a8a95acb6e7b..2803f1d35407f 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.types.ts
@@ -157,7 +157,35 @@ export interface IDialogStyleProps {
    */
   className?: string;
 
-  // Insert Dialog style props below
+  /**
+  * Optional override for container class
+  * @deprecated Pass through via modalProps.className instead
+  */
+  containerClassName?: string;
+
+  /**
+  * Optional override content class
+  * @deprecated Pass through via dialogContentProps instead as className
+  */
+  contentClassName?: string;
+
+  /**
+  * Whether the dialog is hidden.
+  * @default false
+  */
+  hidden?: boolean;
+
+  /**
+   * Default min-width for the dialog box.
+   * @defaultvalue '288px'
+   */
+  dialogDefaultMinWidth?: string;
+
+  /**
+   * Default max-width for the dialog box.
+   * @defaultvalue '340px'
+   */
+  dialogDefaultMaxWidth?: string;
 }
 
 export interface IDialogStyles {
@@ -165,6 +193,5 @@ export interface IDialogStyles {
    * Style for the root element.
    */
   root: IStyle;
-
-  // Insert Dialog classNames below
+  main: IStyle;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.base.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.base.tsx
index f5e48022f320b..a956ee6dec949 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.base.tsx
@@ -1,15 +1,22 @@
 import * as React from 'react';
 import {
   BaseComponent,
-  css,
+  classNamesFunction,
+  customizable,
 } from '../../Utilities';
-import { IDialogContentProps, DialogType } from './DialogContent.types';
+import {
+  DialogType,
+  IDialogContentProps,
+  IDialogContentStyleProps,
+  IDialogContentStyles,
+} from './DialogContent.types';
 import { IconButton } from '../../Button';
 import { DialogFooter } from './DialogFooter';
 import { withResponsiveMode } from '../../utilities/decorators/withResponsiveMode';
-import * as stylesImport from './Dialog.scss';
-const styles: any = stylesImport;
 
+const getClassNames = classNamesFunction<IDialogContentStyleProps, IDialogContentStyles>();
+
+@customizable('DialogContent', ['theme'])
 @withResponsiveMode
 export class DialogContentBase extends BaseComponent<IDialogContentProps, {}> {
 
@@ -27,40 +34,42 @@ export class DialogContentBase extends BaseComponent<IDialogContentProps, {}> {
   public render() {
     const {
       showCloseButton,
+      className,
       closeButtonAriaLabel,
       onDismiss,
       subTextId,
       subText,
       titleId,
       title,
-      type
+      type,
+      getStyles,
+      theme,
     } = this.props;
 
+    const classNames = getClassNames(getStyles!, {
+      theme: theme!,
+      className,
+      isLargeHeader: type === DialogType.largeHeader,
+      isClose: type === DialogType.close,
+    });
+
     const groupings = this._groupChildren();
     let subTextContent;
     if (subText) {
-      subTextContent = <p className={ css('ms-Dialog-subText', styles.subText) } id={ subTextId }>{ subText }</p>;
+      subTextContent = <p className={ classNames.subText } id={ subTextId }>{ subText }</p>;
     }
 
-    const contentClassName = css(this.props.className, {
-      ['ms-Dialog--lgHeader ' + styles.isLargeHeader]: type === DialogType.largeHeader,
-      ['ms-Dialog--close ' + styles.isClose]: type === DialogType.close,
-    });
-
     return (
-      <div className={ css(contentClassName) }>
-        <div className={ css('ms-Dialog-header', styles.header) }>
-          <p className={ css('ms-Dialog-title', styles.title) } id={ titleId } role='heading'>{ title }</p>
-          <div className={ css('ms-Dialog-topButton', styles.topButton) }>
+      <div className={ classNames.content }>
+        <div className={ classNames.header }>
+          <p className={ classNames.title } id={ titleId } role='heading'>{ title }</p>
+          <div className={ classNames.topButton }>
             { this.props.topButtonsProps!.map((props) => (
               <IconButton { ...props } />
             )) }
             { (type === DialogType.close || (showCloseButton && type !== DialogType.largeHeader)) &&
               <IconButton
-                className={ css(
-                  'ms-Dialog-button ms-Dialog-button--close',
-                  styles.button
-                ) }
+                className={ classNames.button }
                 iconProps={ { iconName: 'Cancel' } }
                 ariaLabel={ closeButtonAriaLabel }
                 onClick={ onDismiss as any }
@@ -68,8 +77,8 @@ export class DialogContentBase extends BaseComponent<IDialogContentProps, {}> {
             }
           </div>
         </div>
-        <div className={ css('ms-Dialog-inner', styles.inner) }>
-          <div className={ css('ms-Dialog-content', styles.content, this.props.className) }>
+        <div className={ classNames.inner }>
+          <div className={ classNames.innerContent }>
             { subTextContent }
             { groupings.contents }
           </div>
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.styles.ts b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.styles.ts
index 45bb22f518319..c010c92d73c57 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.styles.ts
@@ -1,18 +1,137 @@
-import { IDialogContentStyleProps, IDialogContentStyles } from './DialogContent.types';
+import {
+  IDialogContentStyleProps,
+  IDialogContentStyles,
+} from './DialogContent.types';
+import {
+  FontWeights,
+} from '../../Styling';
 
 export const getStyles = (
   props: IDialogContentStyleProps
 ): IDialogContentStyles => {
+  const {
+    className,
+    theme,
+    isLargeHeader,
+    isClose,
+    hidden,
+    isMultiline,
+  } = props;
+
+  const { palette, fonts } = theme;
 
   return ({
     content: [
-      'ms-DialogContent',
+      isLargeHeader && 'ms-Dialog-lgHeader',
+      isClose && 'ms-Dialog--close',
+      className
+    ],
+
+    subText: [
+      'ms-Dialog-subText',
+      isLargeHeader ? fonts.medium : fonts.small,
+      {
+        margin: '0 0 20px 0',
+        paddingTop: '8px',
+        color: palette.neutralPrimary,
+        lineHeight: '1.5',
+        wordWrap: 'break-word',
+        fontWeight: FontWeights.semilight,
+      },
+    ],
+
+    header: [
+      'ms-Dialog-header',
       {
-        // Insert css properties
+        position: 'relative',
+        width: '100%',
+        boxSizing: 'border-box',
+      },
+      isLargeHeader && [
+        'ms-Dialog--lgHeader',
+        {
+          backgroundColor: palette.themePrimary,
+        }
+      ],
+      isClose && 'ms-Dialog--close',
+    ],
+
+    button: [
+      'ms-Dialog-button',
+      'ms-Dialog-button--close',
+      hidden && {
+        selectors: {
+          '.ms-Icon.ms-Icon--Cancel': {
+            color: palette.neutralSecondary,
+            fontSize: '16px',
+          }
+        }
+      }
+    ],
 
+    inner: [
+      'ms-Dialog-inner',
+      {
+        padding: isMultiline ? '0 20px 20px' : '0 28px 20px',
       }
     ],
 
-    // Insert className styles
+    innerContent: [
+      'ms-Dialog-content',
+      {
+        position: 'relative',
+        width: '100%',
+
+        selectors: {
+          '.ms-Button.ms-Button--compount': {
+            marginBottom: '20px',
+
+            selectors: {
+              '&:last-child': {
+                marginBottom: '0',
+              }
+            }
+          }
+        }
+      },
+      className
+    ],
+
+    title: [
+      'ms-Dialog-title',
+      {
+        color: palette.neutralPrimary,
+        margin: '0',
+        padding: '20px 36px 20px 28px',
+      },
+      fonts.xLarge,
+      isLargeHeader && [
+        {
+          color: palette.white,
+          marginBottom: '8px',
+          padding: '26px 28px 28px',
+        },
+        fonts.xxLarge
+      ],
+      isMultiline && fonts.xxLarge,
+    ],
+
+    topButton: [
+      {
+        display: 'flex',
+        flexDirection: 'row',
+        flexWrap: 'nowrap',
+        position: 'absolute',
+        top: '0',
+        right: '0',
+        padding: '12px 12px 0 0',
+
+        selectors: {
+          '> *': {
+            flex: '0 0 auto',
+          }
+        }
+      }
+    ],
   });
 };
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.types.ts b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.types.ts
index 927151886a8d3..9aba2f5ced9a8 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.types.ts
@@ -26,6 +26,11 @@ export interface IDialogContentProps extends React.Props<DialogContentBase> {
    */
   theme?: ITheme;
 
+  /**
+   * Is inside a multiline wrapper
+   */
+  isMultiline?: boolean;
+
   /**
   * Show an 'x' close button in the upper-right corner
   */
@@ -104,14 +109,26 @@ export interface IDialogContentStyleProps {
    */
   className?: string;
 
-  // Insert DialogContent style props below
+  isLargeHeader?: boolean;
+  isClose?: boolean;
+  hidden?: boolean;
+
+  /**
+   * Is inside a multiline wrapper
+   */
+  isMultiline?: boolean;
 }
 
 export interface IDialogContentStyles {
   /**
-   * Style for the root element.
+   * Style for the content element.
    */
-  content?: IStyle;
-
-  // Insert DialogContent classNames below
+  content: IStyle;
+  subText: IStyle;
+  header: IStyle;
+  button: IStyle;
+  inner: IStyle;
+  innerContent: IStyle;
+  title: IStyle;
+  topButton: IStyle;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.base.tsx b/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.base.tsx
index 7583d6fb5a190..ca9db4ff5bafa 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.base.tsx
@@ -1,13 +1,37 @@
 import * as React from 'react';
-import { BaseComponent, css } from '../../Utilities';
-import * as stylesImport from './Dialog.scss';
-const styles: any = stylesImport;
+import {
+  IDialogFooterProps,
+  IDialogFooterStyleProps,
+  IDialogFooterStyles,
+} from './DialogFooter.types';
+import {
+  BaseComponent,
+  classNamesFunction,
+  customizable,
+  IClassNames
+} from '../../Utilities';
+
+const getClassNames = classNamesFunction<IDialogFooterStyleProps, IDialogFooterStyles>();
+
+@customizable('DialogFooter', ['theme'])
+export class DialogFooterBase extends BaseComponent<IDialogFooterProps, {}> {
+  private _classNames: IClassNames<IDialogFooterStyles>;
 
-export class DialogFooterBase extends BaseComponent<any, any> {
   public render() {
+    const {
+      className,
+      getStyles,
+      theme
+    } = this.props;
+
+    this._classNames = getClassNames(getStyles!, {
+      theme: theme!,
+      className
+    });
+
     return (
-      <div className={ css('ms-Dialog-actions', styles.actions) }>
-        <div className={ css('ms-Dialog-actionsRight', styles.actionsRight) }>
+      <div className={ this._classNames.actions }>
+        <div className={ this._classNames.actionsRight }>
           { this._renderChildrenAsActions() }
         </div>
       </div>
@@ -16,7 +40,7 @@ export class DialogFooterBase extends BaseComponent<any, any> {
 
   private _renderChildrenAsActions() {
     return React.Children.map(this.props.children, child =>
-      child && <span className={ css('ms-Dialog-action', styles.action) }>{ child }</span>
+      child && <span className={ this._classNames.action }>{ child }</span>
     );
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.styles.ts b/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.styles.ts
index c530d830a6579..f8277cd04c6ba 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.styles.ts
@@ -3,15 +3,47 @@ import { IDialogFooterStyleProps, IDialogFooterStyles } from './DialogFooter.typ
 export const getStyles = (
   props: IDialogFooterStyleProps
 ): IDialogFooterStyles => {
+  const {
+    className,
+  } = props;
+
   return ({
     actions: [
       'ms-Dialog-actions',
       {
-        // Insert css properties
+        position: 'relative',
+        width: '100%',
+        minHeight: '24px',
+        lineHeight: '24px',
+        margin: '20px 0 0',
+        fontSize: '0',
 
-      }
+        selectors: {
+          '.ms-Button': {
+            lineHeight: 'normal',
+          }
+        }
+      },
+      className
+    ],
+
+    action: [
+      'ms-Dialog-action',
     ],
 
-    // Insert className styles
+    actionsRight: [
+      'ms-Dialog-actionsRight',
+      {
+        textAlign: 'right',
+        marginRight: '-4px',
+        fontSize: '0',
+
+        selectors: {
+          '$action': {
+            margin: '0 4px',
+          }
+        }
+      }
+    ]
   });
 };
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.types.ts b/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.types.ts
index 2882c8ac10a15..47fa490d10f58 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.types.ts
@@ -20,12 +20,9 @@ export interface IDialogFooterProps extends React.Props<DialogFooterBase> {
   theme?: ITheme;
 
   /**
-   * Additional css class to apply to the DialogFooter
-   * @defaultvalue undefined
-   */
+  * Optional override class name
+  */
   className?: string;
-
-  // Insert DialogFooter props below
 }
 
 export interface IDialogFooterStyleProps {
@@ -35,18 +32,17 @@ export interface IDialogFooterStyleProps {
   theme: ITheme;
 
   /**
-   * Accept custom classNames
-   */
+  * Optional override class name
+  */
   className?: string;
-
-  // Insert DialogFooter style props below
 }
 
 export interface IDialogFooterStyles {
   /**
-   * Style for the root element.
+   * Style for the actions element.
    */
-  actions?: IStyle;
+  actions: IStyle;
 
-  // Insert DialogFooter classNames below
+  actionsRight: IStyle;
+  action: IStyle;
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/__snapshots__/Dialog.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Dialog/__snapshots__/Dialog.test.tsx.snap
index fdd5a77567304..1d89aeb736a69 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/__snapshots__/Dialog.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Dialog/__snapshots__/Dialog.test.tsx.snap
@@ -2,25 +2,84 @@
 
 exports[`Dialog renders Dialog correctly 1`] = `
 <div
-  className=""
+  className=
+
+
 >
   <div
-    className="ms-Dialog-header"
+    className=
+        ms-Dialog-header
+        {
+          box-sizing: border-box;
+          position: relative;
+          width: 100%;
+        }
   >
     <p
-      className="ms-Dialog-title"
+      className=
+          ms-Dialog-title
+          {
+            -moz-osx-font-smoothing: grayscale;
+            -webkit-font-smoothing: antialiased;
+            color: #333333;
+            font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+            font-size: 21px;
+            font-weight: 100;
+            margin-bottom: 0;
+            margin-left: 0;
+            margin-right: 0;
+            margin-top: 0;
+            padding-bottom: 20px;
+            padding-left: 28px;
+            padding-right: 36px;
+            padding-top: 20px;
+          }
       id={undefined}
       role="heading"
     />
     <div
-      className="ms-Dialog-topButton"
+      className=
+
+          {
+            display: flex;
+            flex-direction: row;
+            flex-wrap: nowrap;
+            padding-bottom: 0;
+            padding-left: 0;
+            padding-right: 12px;
+            padding-top: 12px;
+            position: absolute;
+            right: 0;
+            top: 0;
+          }
+          & > * {
+            flex: 0 0 auto;
+          }
     />
   </div>
   <div
-    className="ms-Dialog-inner"
+    className=
+        ms-Dialog-inner
+        {
+          padding-bottom: 20px;
+          padding-left: 28px;
+          padding-right: 28px;
+          padding-top: 0;
+        }
   >
     <div
-      className="ms-Dialog-content"
+      className=
+          ms-Dialog-content
+          {
+            position: relative;
+            width: 100%;
+          }
+          & .ms-Button.ms-Button--compount {
+            margin-bottom: 20px;
+          }
+          &:last-child {
+            margin-bottom: 0;
+          }
     />
   </div>
 </div>
diff --git a/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx b/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx
index c192b013b4d83..73671d6be4c4e 100644
--- a/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx
@@ -35,7 +35,7 @@ export function setResponsiveMode(responsiveMode: ResponsiveMode | undefined) {
 
 export function withResponsiveMode<TProps extends { responsiveMode?: ResponsiveMode }, TState>(ComposedComponent: (new (props: TProps, ...args: any[]) => React.Component<TProps, TState>)): any {
 
-  return class WithResponsiveMode extends BaseDecorator<TProps, IWithResponsiveModeState> {
+  const resultClass = class WithResponsiveMode extends BaseDecorator<TProps, IWithResponsiveModeState> {
 
     constructor(props: TProps) {
       super(props);
@@ -96,5 +96,18 @@ export function withResponsiveMode<TProps extends { responsiveMode?: ResponsiveM
 
       return responsiveMode;
     }
+
   };
+  return hoistStatics(ComposedComponent, resultClass);
+}
+
+function hoistStatics<TSource, TDest>(source: TSource, dest: TDest): TDest {
+  for (const name in source) {
+    if (source.hasOwnProperty(name)) {
+      // tslint:disable-next-line:no-any
+      (dest as any)[name] = source[name];
+    }
+  }
+
+  return dest;
 }

From e67bcbe68c55f057a10c3c51d923554bae81524d Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Thu, 8 Mar 2018 09:45:57 -0800
Subject: [PATCH 1529/1641] Website: Fix in page nav / left nav display bug
 (#4199)

* Match a url that has navigated to a location in page

* Modified page paths

* Removed baseRoute and added comment

* Repurposing pageroute utility

* Revert "Repurposing pageroute utility"

This reverts commit 8a086bba26deb0098c465bbe3713a47a7c7ae254.

* Repurposing pageroute utility

* Code cleanup

* Added change file

* Removed spaces

* Counting hashes

* Semicolons
---
 .../fabric-website/src/components/Nav/Nav.tsx | 21 +++++++------------
 .../src/components/PageHeader/PageHeader.tsx  | 15 ++++++++-----
 .../fabric-website/src/utilities/pageroute.ts | 10 ++++++---
 .../in-page-nav-bug_2018-03-06-23-06.json     | 11 ++++++++++
 4 files changed, 36 insertions(+), 21 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/in-page-nav-bug_2018-03-06-23-06.json

diff --git a/apps/fabric-website/src/components/Nav/Nav.tsx b/apps/fabric-website/src/components/Nav/Nav.tsx
index 1ca61b4a5c929..df836511d6eab 100644
--- a/apps/fabric-website/src/components/Nav/Nav.tsx
+++ b/apps/fabric-website/src/components/Nav/Nav.tsx
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { css } from 'office-ui-fabric-react/lib/Utilities';
 import { FocusZone } from 'office-ui-fabric-react/lib/FocusZone';
+import { getPathMinusLastHash } from '../../utilities/pageroute';
 import * as stylesImport from './Nav.module.scss';
 const styles: any = stylesImport;
 import {
@@ -69,7 +70,7 @@ export class Nav extends React.Component<INavProps, INavState> {
     const links: React.ReactElement<{}>[] = pages
       .filter(page => !page.hasOwnProperty('isHiddenFromMainNav'))
       .map(
-      (page: INavPage, linkIndex: number) => this._renderLink(page, linkIndex)
+        (page: INavPage, linkIndex: number) => this._renderLink(page, linkIndex)
       );
 
     return (
@@ -91,25 +92,19 @@ function _isPageActive(page: INavPage): boolean {
   }
   _urlResolver.href = page.url || '';
   const target: string = _urlResolver.href;
+  let path = location.href;
 
   if (location.protocol + '//' + location.host + location.pathname === target) {
     return true;
   }
 
-  if (location.href === target) {
-    return true;
+  const hashCount = path.split('#').length - 1;
+  if (hashCount > 1) {
+    path = getPathMinusLastHash(path);
   }
 
-  if (location.hash) {
-    // Match the hash to the url.
-    if (location.hash === page.url) {
-      return true;
-    }
-
-    // Match a rebased url. (e.g. #foo becomes http://hostname/foo)
-    _urlResolver.href = location.hash.substring(1);
-
-    return _urlResolver.href === target;
+  if (path === target) {
+    return true;
   }
 
   return false;
diff --git a/apps/fabric-website/src/components/PageHeader/PageHeader.tsx b/apps/fabric-website/src/components/PageHeader/PageHeader.tsx
index 51833d676efc5..bafc2d4ce182d 100644
--- a/apps/fabric-website/src/components/PageHeader/PageHeader.tsx
+++ b/apps/fabric-website/src/components/PageHeader/PageHeader.tsx
@@ -2,8 +2,8 @@ import * as React from 'react';
 import { css, BaseComponent, IBaseProps } from 'office-ui-fabric-react/lib/Utilities';
 import * as stylesImport from './PageHeader.module.scss';
 const styles: any = stylesImport;
-import { getPageRouteFromState } from '../../utilities/pageroute';
 import AttachedScrollUtility from '../../utilities/AttachedScrollUtility';
+import { getPathMinusLastHash } from '../../utilities/pageroute';
 import { PageHeaderLink } from '../../components/PageHeaderLink/PageHeaderLink';
 import { FocusZone } from 'office-ui-fabric-react/lib/FocusZone';
 
@@ -84,9 +84,6 @@ export class PageHeader extends BaseComponent<IPageHeaderProps, IPageHeaderState
   public render() {
     let { pageTitle, links, backgroundColor, backgroundImage } = this.props;
     let { isAttached } = this.state;
-    let baseRoute: string = getPageRouteFromState(
-      this.props.pageTitle
-    );
     let inPageNav;
     let backgroundStyle = {
       bottom: this.state.headerBottom,
@@ -102,7 +99,7 @@ export class PageHeader extends BaseComponent<IPageHeaderProps, IPageHeaderState
             <ul>
               { links.map((link, linkIndex) => (
                 <li key={ linkIndex }>
-                  <PageHeaderLink href={ baseRoute + '#' + link.location } text={ link.text } />
+                  <PageHeaderLink href={ this._getPagePath(link) } text={ link.text } />
                 </li>
               )) }
             </ul>
@@ -143,4 +140,12 @@ export class PageHeader extends BaseComponent<IPageHeaderProps, IPageHeaderState
       headerTop: headerTop
     });
   }
+
+  private _getPagePath(link): string {
+    let path = location.hash;
+    // This makes sure that location hash changes don't append
+    path = getPathMinusLastHash(path);
+
+    return path + '#' + link.location;
+  }
 }
diff --git a/apps/fabric-website/src/utilities/pageroute.ts b/apps/fabric-website/src/utilities/pageroute.ts
index 62c04a1498bfd..1e19957463ec6 100644
--- a/apps/fabric-website/src/utilities/pageroute.ts
+++ b/apps/fabric-website/src/utilities/pageroute.ts
@@ -1,7 +1,11 @@
 
 /*
-  Retreive the route URL for a page in a group from the the AppState
+  Retreive the route URL for a page without the string after the last hash.
 */
-export function getPageRouteFromState(pageName: string): string {
-  return '';
+export function getPathMinusLastHash(path: string): string {
+  const hashIndex = path.lastIndexOf('#');
+  if (hashIndex > 0) {
+    path = path.substr(0, hashIndex);
+  }
+  return path;
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/in-page-nav-bug_2018-03-06-23-06.json b/common/changes/@uifabric/fabric-website/in-page-nav-bug_2018-03-06-23-06.json
new file mode 100644
index 0000000000000..f6ee0714b2759
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/in-page-nav-bug_2018-03-06-23-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Fixed in page nav so that the left nav links will display properly.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From a4a17ef0a30d1c37629b9200236dfd82bd80ce54 Mon Sep 17 00:00:00 2001
From: Trevor Gau <trevorsg@gmail.com>
Date: Thu, 8 Mar 2018 17:14:52 -0500
Subject: [PATCH 1530/1641] Remove HC style override on ms-Link buttons.
 (#3991)

---
 .../master_2018-03-06-15-27.json                      | 11 +++++++++++
 .../src/components/Link/Link.styles.ts                |  7 +------
 .../components/Link/__snapshots__/Link.test.tsx.snap  |  6 ------
 3 files changed, 12 insertions(+), 12 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/master_2018-03-06-15-27.json

diff --git a/common/changes/office-ui-fabric-react/master_2018-03-06-15-27.json b/common/changes/office-ui-fabric-react/master_2018-03-06-15-27.json
new file mode 100644
index 0000000000000..1ada35e7692f5
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2018-03-06-15-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixes #3985 by removing HC style override on ms-Link buttons.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "trgau@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.styles.ts b/packages/office-ui-fabric-react/src/components/Link/Link.styles.ts
index 30464420d5d68..92f84c115f270 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.styles.ts
@@ -29,12 +29,7 @@ export const getStyles = (props: ILinkStyleProps): ILinkStyles => {
         overflow: 'inherit',
         padding: 0,
         textAlign: 'left',
-        textOverflow: 'inherit',
-        selectors: {
-          [HighContrastSelector]: {
-            color: 'Highlight'
-          }
-        }
+        textOverflow: 'inherit'
       },
       !isButton && {
         textDecoration: 'none'
diff --git a/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap
index 22b0992c34d45..12fddf196c581 100644
--- a/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap
@@ -119,9 +119,6 @@ exports[`Link renders Link with no href as a button 1`] = `
         top: 1px;
         z-index: 1;
       }
-      @media screen and (-ms-high-contrast: active){& {
-        color: Highlight;
-      }
       &:active, &:hover, &:active:hover {
         color: #004578;
       }
@@ -213,9 +210,6 @@ exports[`Link renders disabled Link with no href as a button correctly 1`] = `
         top: 1px;
         z-index: 1;
       }
-      @media screen and (-ms-high-contrast: active){& {
-        color: Highlight;
-      }
       &:link, &:visited {
         pointer-events: none;
       }

From 6d2d87f10bdd69a46a879d2ce6fb09f983d309bd Mon Sep 17 00:00:00 2001
From: Cyrus Balsara <cyrusb@microsoft.com>
Date: Thu, 8 Mar 2018 15:04:35 -0800
Subject: [PATCH 1531/1641] Allow DetailsRow to have a custom renderer (#4216)

* Allow DetailsRow to have a custom formatter

* npm run change

* Code review changes
---
 .../cyrusb-customrowrenderer_2018-03-08-19-51.json    | 11 +++++++++++
 .../src/components/DetailsList/DetailsRow.tsx         | 10 ++++++----
 2 files changed, 17 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/cyrusb-customrowrenderer_2018-03-08-19-51.json

diff --git a/common/changes/office-ui-fabric-react/cyrusb-customrowrenderer_2018-03-08-19-51.json b/common/changes/office-ui-fabric-react/cyrusb-customrowrenderer_2018-03-08-19-51.json
new file mode 100644
index 0000000000000..8e593a48914fe
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/cyrusb-customrowrenderer_2018-03-08-19-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Allow DetailsRow to have a custom renderer",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "cyrusb"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index 38ba946ced076..5e6d32e574003 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -13,7 +13,7 @@ import {
 import { IColumn, CheckboxVisibility } from './DetailsList.types';
 import { DetailsRowCheck, IDetailsRowCheckProps } from './DetailsRowCheck';
 import { GroupSpacer } from '../GroupedList/GroupSpacer';
-import { DetailsRowFields } from './DetailsRowFields';
+import { DetailsRowFields, IDetailsRowFieldsProps } from './DetailsRowFields';
 import { FocusZone, FocusZoneDirection, IFocusZone } from '../../FocusZone';
 import { ISelection, SelectionMode, SELECTION_CHANGE } from '../../utilities/selection/interfaces';
 import { CollapseAllVisibility } from '../../GroupedList';
@@ -52,6 +52,7 @@ export interface IDetailsRowProps extends React.Props<DetailsRow> {
   getRowAriaDescribedBy?: (item: any) => string;
   checkButtonAriaLabel?: string;
   checkboxCellClassName?: string;
+  rowFieldsAs?: React.StatelessComponent<IDetailsRowFieldsProps> | React.ComponentClass<IDetailsRowFieldsProps>;
   className?: string;
 }
 
@@ -184,6 +185,8 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
       getRowAriaDescribedBy,
       checkButtonAriaLabel,
       checkboxCellClassName,
+      /** Alias rowFieldsAs as RowFields and default to DetailsRowFields if rowFieldsAs does not exist */
+      rowFieldsAs: RowFields = DetailsRowFields,
       selection,
     } = this.props;
     const { columnMeasureInfo, isDropping, groupNestingDepth } = this.state;
@@ -249,7 +252,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
         { GroupSpacer({ count: groupNestingDepth! - (this.props.collapseAllVisibility === CollapseAllVisibility.hidden ? 1 : 0) }) }
 
         { item && (
-          <DetailsRowFields
+          <RowFields
             columns={ columns }
             item={ item }
             itemIndex={ itemIndex }
@@ -257,14 +260,13 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
             onRenderItemColumn={ onRenderItemColumn }
           />
         ) }
-
         { columnMeasureInfo && (
           <span
             role='presentation'
             className={ css('ms-DetailsRow-cellMeasurer ms-DetailsRow-cell', styles.cellMeasurer, styles.cell) }
             ref={ this._resolveRef('_cellMeasurer') }
           >
-            <DetailsRowFields
+            <RowFields
               columns={ [columnMeasureInfo.column] }
               item={ item }
               itemIndex={ itemIndex }

From 173888978a9de3743ae9aa72875bdbb0b494d4ae Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 9 Mar 2018 11:13:58 +0000
Subject: [PATCH 1532/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 19 ++++++++++++
 apps/fabric-website/CHANGELOG.md              |  9 +++++-
 apps/fabric-website/package.json              |  4 +--
 ...xtMenu-sample-styles_2018-03-06-19-11.json | 11 -------
 .../in-page-nav-bug_2018-03-06-23-06.json     | 11 -------
 ...Styles-Dialog-round2_2018-03-08-01-38.json | 11 -------
 ...Styles-Dialog-round2_2018-03-08-01-38.json | 11 -------
 ...sb-customrowrenderer_2018-03-08-19-51.json | 11 -------
 .../master_2018-03-06-15-27.json              | 11 -------
 ...Styles-Dialog-round2_2018-03-02-01-05.json | 11 -------
 packages/example-app-base/package.json        |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 31 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 14 ++++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 +++++++++
 packages/utilities/CHANGELOG.md               |  9 +++++-
 packages/utilities/package.json               |  2 +-
 18 files changed, 100 insertions(+), 87 deletions(-)
 delete mode 100644 common/changes/@uifabric/fabric-website/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
 delete mode 100644 common/changes/@uifabric/fabric-website/in-page-nav-bug_2018-03-06-23-06.json
 delete mode 100644 common/changes/@uifabric/fabric-website/mergeStyles-Dialog-round2_2018-03-08-01-38.json
 delete mode 100644 common/changes/@uifabric/utilities/mergeStyles-Dialog-round2_2018-03-08-01-38.json
 delete mode 100644 common/changes/office-ui-fabric-react/cyrusb-customrowrenderer_2018-03-08-19-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2018-03-06-15-27.json
 delete mode 100644 common/changes/office-ui-fabric-react/mergeStyles-Dialog-round2_2018-03-02-01-05.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 3cc611bae3ba6..4a9450389a750 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.3.3",
+      "tag": "@uifabric/fabric-website_v5.3.3",
+      "date": "Fri, 09 Mar 2018 11:13:58 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "e67bcbe68c55f057a10c3c51d923554bae81524d",
+            "comment": "Fixed in page nav so that the left nav links will display properly."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.61.0 <6.0.0` to `>=5.62.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.3.2",
       "tag": "@uifabric/fabric-website_v5.3.2",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 81b1f54c6e8ed..26d280f3446c9 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Thu, 01 Mar 2018 00:05:10 GMT and should not be manually modified.
+This log was last generated on Fri, 09 Mar 2018 11:13:58 GMT and should not be manually modified.
+
+## 5.3.3
+Fri, 09 Mar 2018 11:13:58 GMT
+
+### Patches
+
+- Fixed in page nav so that the left nav links will display properly.
 
 ## 5.3.2
 Thu, 01 Mar 2018 00:05:10 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 0dacc2f588e6c..54e1cb9eac983 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.3.2",
+  "version": "5.3.3",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.61.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.62.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json b/common/changes/@uifabric/fabric-website/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
deleted file mode 100644
index 8f4224c4cc65b..0000000000000
--- a/common/changes/@uifabric/fabric-website/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "v-jojanz@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/in-page-nav-bug_2018-03-06-23-06.json b/common/changes/@uifabric/fabric-website/in-page-nav-bug_2018-03-06-23-06.json
deleted file mode 100644
index f6ee0714b2759..0000000000000
--- a/common/changes/@uifabric/fabric-website/in-page-nav-bug_2018-03-06-23-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Fixed in page nav so that the left nav links will display properly.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/mergeStyles-Dialog-round2_2018-03-08-01-38.json b/common/changes/@uifabric/fabric-website/mergeStyles-Dialog-round2_2018-03-08-01-38.json
deleted file mode 100644
index 8f4224c4cc65b..0000000000000
--- a/common/changes/@uifabric/fabric-website/mergeStyles-Dialog-round2_2018-03-08-01-38.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/fabric-website",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "v-jojanz@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/mergeStyles-Dialog-round2_2018-03-08-01-38.json b/common/changes/@uifabric/utilities/mergeStyles-Dialog-round2_2018-03-08-01-38.json
deleted file mode 100644
index 46b0ccfc46b68..0000000000000
--- a/common/changes/@uifabric/utilities/mergeStyles-Dialog-round2_2018-03-08-01-38.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Add hoistStatics function to withResponsiveMode decorator.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "v-jojanz@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/cyrusb-customrowrenderer_2018-03-08-19-51.json b/common/changes/office-ui-fabric-react/cyrusb-customrowrenderer_2018-03-08-19-51.json
deleted file mode 100644
index 8e593a48914fe..0000000000000
--- a/common/changes/office-ui-fabric-react/cyrusb-customrowrenderer_2018-03-08-19-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Allow DetailsRow to have a custom renderer",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "cyrusb"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2018-03-06-15-27.json b/common/changes/office-ui-fabric-react/master_2018-03-06-15-27.json
deleted file mode 100644
index 1ada35e7692f5..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2018-03-06-15-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixes #3985 by removing HC style override on ms-Link buttons.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "trgau@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round2_2018-03-02-01-05.json b/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round2_2018-03-02-01-05.json
deleted file mode 100644
index 8105d557df85b..0000000000000
--- a/common/changes/office-ui-fabric-react/mergeStyles-Dialog-round2_2018-03-02-01-05.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dialog: convert to mergeStyles part 2.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-jojanz@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 12980e35d4d9d..ecb68dbff201c 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.19.0 <6.0.0",
-    "@uifabric/utilities": ">=5.16.0 <6.0.0",
+    "@uifabric/utilities": ">=5.17.0 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 29978166a242d..58e61e20502e8 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,37 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.62.0",
+      "tag": "office-ui-fabric-react_v5.62.0",
+      "date": "Fri, 09 Mar 2018 11:13:58 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Cyrus Balsara <cyrusb@microsoft.com>",
+            "commit": "6d2d87f10bdd69a46a879d2ce6fb09f983d309bd",
+            "comment": "Allow DetailsRow to have a custom renderer"
+          },
+          {
+            "author": "Jordan Janzen <jordancjanzen@gmail.com>",
+            "commit": "b410f6b9a328dd4ad24cbaa739156c23880e44e4",
+            "comment": "Dialog: convert to mergeStyles part 2."
+          }
+        ],
+        "patch": [
+          {
+            "author": "Trevor Gau <trevorsg@gmail.com>",
+            "commit": "a4a17ef0a30d1c37629b9200236dfd82bd80ce54",
+            "comment": "Fixes #3985 by removing HC style override on ms-Link buttons."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.16.0 <6.0.0` to `>=5.17.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.61.0",
       "tag": "office-ui-fabric-react_v5.61.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 9f4b7d223bd22..a7e78a1db4159 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,18 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 08 Mar 2018 11:27:24 GMT and should not be manually modified.
+This log was last generated on Fri, 09 Mar 2018 11:13:58 GMT and should not be manually modified.
+
+## 5.62.0
+Fri, 09 Mar 2018 11:13:58 GMT
+
+### Minor changes
+
+- Allow DetailsRow to have a custom renderer
+- Dialog: convert to mergeStyles part 2.
+
+### Patches
+
+- Fixes #3985 by removing HC style override on ms-Link buttons.
 
 ## 5.61.0
 Thu, 08 Mar 2018 11:27:24 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 29148d0e43ff8..52dbbce0bb3a3 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.61.0",
+  "version": "5.62.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -51,7 +51,7 @@
     "@uifabric/icons": ">=5.5.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "@uifabric/styling": ">=5.19.0 <6.0.0",
-    "@uifabric/utilities": ">=5.16.0 <6.0.0",
+    "@uifabric/utilities": ">=5.17.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index c18e10215de2f..aa1caad9c0f06 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.16.0 <6.0.0",
+    "@uifabric/utilities": ">=5.17.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 36aaafd5e1db7..6b48ffde913b6 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.17.0",
+      "tag": "@uifabric/utilities_v5.17.0",
+      "date": "Fri, 09 Mar 2018 11:13:58 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Jordan Janzen <jordancjanzen@gmail.com>",
+            "commit": "b410f6b9a328dd4ad24cbaa739156c23880e44e4",
+            "comment": "Add hoistStatics function to withResponsiveMode decorator."
+          }
+        ]
+      }
+    },
     {
       "version": "5.16.0",
       "tag": "@uifabric/utilities_v5.16.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index cb04c0cf51214..9b4e5c998b4a1 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Thu, 08 Mar 2018 11:27:24 GMT and should not be manually modified.
+This log was last generated on Fri, 09 Mar 2018 11:13:58 GMT and should not be manually modified.
+
+## 5.17.0
+Fri, 09 Mar 2018 11:13:58 GMT
+
+### Minor changes
+
+- Add hoistStatics function to withResponsiveMode decorator.
 
 ## 5.16.0
 Thu, 08 Mar 2018 11:27:24 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 2dc44f51c3257..f501ea51e086e 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.16.0",
+  "version": "5.17.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 4fc956a30e82d90fe405def0f9434ffdb0d407ab Mon Sep 17 00:00:00 2001
From: jspurlin <jspurlin@microsoft.com>
Date: Fri, 9 Mar 2018 06:48:46 -0800
Subject: [PATCH 1533/1641] Foucs: Fix getPreviousElement parent traversal
 (#4220)

* Update the focus logic so that it will attempt to traverse a potential child match's parent when looking to set focus

* Rush change

* Update the test to check for the actual problem and update getPreviousElement to fully fix the problem

* bump the maxSize by .1kb (since my change is 39b it puts it over the 44.6 threshold)
---
 ...ocusZoneTraversalFix_2018-03-08-16-48.json | 11 +++
 ...ocusZoneTraversalFix_2018-03-08-16-48.json | 11 +++
 .../FocusTrapZone/FocusTrapZone.test.tsx      | 90 +++++++++++++++++++
 packages/utilities/src/focus.ts               | 36 ++++++--
 scripts/package.json                          |  4 +-
 5 files changed, 144 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/jspurlin-FocusZoneTraversalFix_2018-03-08-16-48.json
 create mode 100644 common/changes/office-ui-fabric-react/jspurlin-FocusZoneTraversalFix_2018-03-08-16-48.json

diff --git a/common/changes/@uifabric/utilities/jspurlin-FocusZoneTraversalFix_2018-03-08-16-48.json b/common/changes/@uifabric/utilities/jspurlin-FocusZoneTraversalFix_2018-03-08-16-48.json
new file mode 100644
index 0000000000000..6fcfec519d225
--- /dev/null
+++ b/common/changes/@uifabric/utilities/jspurlin-FocusZoneTraversalFix_2018-03-08-16-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Focus: Update getPreviousElement to traverse a potential childMatch's parent siblings  (which was previously being skipped)",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-FocusZoneTraversalFix_2018-03-08-16-48.json b/common/changes/office-ui-fabric-react/jspurlin-FocusZoneTraversalFix_2018-03-08-16-48.json
new file mode 100644
index 0000000000000..fbc659da1854d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jspurlin-FocusZoneTraversalFix_2018-03-08-16-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add unit test to catch focus regression being fixed by this PR",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jspurlin@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.test.tsx
index 3d99c4000e8db..d23d8fc60e7e1 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.test.tsx
@@ -149,4 +149,94 @@ describe('FocusTrapZone', () => {
     ReactTestUtils.Simulate.keyDown(buttonD, { which: KeyCodes.tab });
     expect(lastFocusedElement).toBe(buttonA);
   });
+
+  it('can tab across a FocusZone with different button structures', () => {
+    const component = ReactTestUtils.renderIntoDocument(
+      <div { ...{ onFocusCapture: _onFocus } }>
+        <FocusTrapZone forceFocusInsideTrap={ false }>
+          <div data-is-visible={ true }>
+            <button className='x'>x</button>
+          </div>
+          <FocusZone direction={ FocusZoneDirection.horizontal } data-is-visible={ true }>
+            <div data-is-visible={ true }>
+              <button className='a'>a</button>
+            </div>
+            <div data-is-visible={ true }>
+              <div data-is-visible={ true }>
+                <button className='b'>b</button>
+                <button className='c'>c</button>
+                <button className='d'>d</button>
+              </div>
+            </div>
+          </FocusZone>
+        </FocusTrapZone>
+      </div>
+    );
+
+    const focusTrapZone = ReactDOM.findDOMNode(component as React.ReactInstance) as Element;
+
+    const buttonX = focusTrapZone.querySelector('.x') as HTMLElement;
+    const buttonA = focusTrapZone.querySelector('.a') as HTMLElement;
+    const buttonB = focusTrapZone.querySelector('.b') as HTMLElement;
+    const buttonC = focusTrapZone.querySelector('.c') as HTMLElement;
+    const buttonD = focusTrapZone.querySelector('.d') as HTMLElement;
+
+    // Assign bounding locations to buttons.
+    setupElement(buttonX, {
+      clientRect: {
+        top: 0,
+        bottom: 30,
+        left: 0,
+        right: 30
+      }
+    });
+
+    setupElement(buttonA, {
+      clientRect: {
+        top: 0,
+        bottom: 30,
+        left: 0,
+        right: 30
+      }
+    });
+
+    setupElement(buttonB, {
+      clientRect: {
+        top: 0,
+        bottom: 30,
+        left: 30,
+        right: 60
+      }
+    });
+
+    setupElement(buttonC, {
+      clientRect: {
+        top: 0,
+        bottom: 30,
+        left: 60,
+        right: 90
+      }
+    });
+
+    setupElement(buttonD, {
+      clientRect: {
+        top: 30,
+        bottom: 60,
+        left: 0,
+        right: 30
+      }
+    });
+
+    // Focus the first button.
+    ReactTestUtils.Simulate.focus(buttonX);
+    expect(lastFocusedElement).toBe(buttonX);
+
+    // Pressing shift + tab should go to a.
+    ReactTestUtils.Simulate.keyDown(buttonX, { which: KeyCodes.tab, shiftKey: true });
+    expect(lastFocusedElement).toBe(buttonA);
+
+    // Pressing tab should go to x.
+    ReactTestUtils.Simulate.keyDown(buttonA, { which: KeyCodes.tab });
+    expect(lastFocusedElement).toBe(buttonX);
+  });
 });
diff --git a/packages/utilities/src/focus.ts b/packages/utilities/src/focus.ts
index 73a0d6f8992e0..c2dc853c6932c 100644
--- a/packages/utilities/src/focus.ts
+++ b/packages/utilities/src/focus.ts
@@ -102,11 +102,32 @@ export function getPreviousElement(
     if (childMatch) {
       if ((tabbable && (isElementTabbable(childMatch, true))) || !tabbable) {
         return childMatch;
-      } else {
-        // Check previous sibling of the child match.
-        const childMatchSiblingMatch = getPreviousElement(
+      }
+
+      const childMatchSiblingMatch = getPreviousElement(
+        rootElement,
+        childMatch.previousElementSibling as HTMLElement,
+        true,
+        true,
+        true,
+        includeElementsInFocusZones,
+        allowFocusRoot,
+        tabbable
+      );
+      if (childMatchSiblingMatch) {
+        return childMatchSiblingMatch;
+      }
+
+      let childMatchParent = childMatch.parentElement;
+
+      // At this point if we have not found any potential matches
+      // start looking at the rest of the subtree under the currentParent.
+      // NOTE: We do not want to recurse here because doing so could
+      // cause elements to get skipped.
+      while (childMatchParent && childMatchParent !== currentElement) {
+        const childMatchParentMatch = getPreviousElement(
           rootElement,
-          childMatch.previousElementSibling as HTMLElement,
+          childMatchParent.previousElementSibling as HTMLElement,
           true,
           true,
           true,
@@ -114,9 +135,12 @@ export function getPreviousElement(
           allowFocusRoot,
           tabbable
         );
-        if (childMatchSiblingMatch) {
-          return childMatchSiblingMatch;
+
+        if (childMatchParentMatch) {
+          return childMatchParentMatch;
         }
+
+        childMatchParent = childMatchParent.parentElement;
       }
     }
   }
diff --git a/scripts/package.json b/scripts/package.json
index ff4b4d6ca700c..56b592bc62b67 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -49,7 +49,7 @@
   "bundlesize": [
     {
       "path": "../apps/test-bundle-button/dist/main.min.js",
-      "maxSize": "44.6 kB"
+      "maxSize": "44.7 kB"
     }
   ]
-}
+}
\ No newline at end of file

From 23dd1877e4fdf06b2ff7fcd24d8bdb4e6ab997d7 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 9 Mar 2018 15:07:28 +0000
Subject: [PATCH 1534/1641] Applying package updates.

---
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...ocusZoneTraversalFix_2018-03-08-16-48.json | 11 -----------
 ...ocusZoneTraversalFix_2018-03-08-16-48.json | 11 -----------
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++++-
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 ++++++++++++++
 packages/utilities/CHANGELOG.md               |  9 ++++++++-
 packages/utilities/package.json               |  2 +-
 15 files changed, 59 insertions(+), 34 deletions(-)
 delete mode 100644 common/changes/@uifabric/utilities/jspurlin-FocusZoneTraversalFix_2018-03-08-16-48.json
 delete mode 100644 common/changes/office-ui-fabric-react/jspurlin-FocusZoneTraversalFix_2018-03-08-16-48.json

diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index a0363f175d4ec..98dcf08cb1f89 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.61.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.62.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index d4f9787a3c980..2bcaac9d9e273 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.61.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.62.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 130dac5e95e08..1637c45a2ed5a 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.61.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.62.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index cd66dbdf8abfd..5216fc90f989b 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.61.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.62.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/common/changes/@uifabric/utilities/jspurlin-FocusZoneTraversalFix_2018-03-08-16-48.json b/common/changes/@uifabric/utilities/jspurlin-FocusZoneTraversalFix_2018-03-08-16-48.json
deleted file mode 100644
index 6fcfec519d225..0000000000000
--- a/common/changes/@uifabric/utilities/jspurlin-FocusZoneTraversalFix_2018-03-08-16-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Focus: Update getPreviousElement to traverse a potential childMatch's parent siblings  (which was previously being skipped)",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jspurlin-FocusZoneTraversalFix_2018-03-08-16-48.json b/common/changes/office-ui-fabric-react/jspurlin-FocusZoneTraversalFix_2018-03-08-16-48.json
deleted file mode 100644
index fbc659da1854d..0000000000000
--- a/common/changes/office-ui-fabric-react/jspurlin-FocusZoneTraversalFix_2018-03-08-16-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add unit test to catch focus regression being fixed by this PR",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jspurlin@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index ecb68dbff201c..45314c6072ea1 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.19.0 <6.0.0",
-    "@uifabric/utilities": ">=5.17.0 <6.0.0",
+    "@uifabric/utilities": ">=5.17.1 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index a046dc881be8d..300b631f54e39 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.61.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.62.1 <6.0.0",
     "@uifabric/icons": ">=5.5.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 58e61e20502e8..e0c7a76e76857 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.62.1",
+      "tag": "office-ui-fabric-react_v5.62.1",
+      "date": "Fri, 09 Mar 2018 15:07:28 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "4fc956a30e82d90fe405def0f9434ffdb0d407ab",
+            "comment": "Add unit test to catch focus regression being fixed by this PR"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.17.0 <6.0.0` to `>=5.17.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.62.0",
       "tag": "office-ui-fabric-react_v5.62.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index a7e78a1db4159..aaabb31e78573 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 09 Mar 2018 11:13:58 GMT and should not be manually modified.
+This log was last generated on Fri, 09 Mar 2018 15:07:28 GMT and should not be manually modified.
+
+## 5.62.1
+Fri, 09 Mar 2018 15:07:28 GMT
+
+### Patches
+
+- Add unit test to catch focus regression being fixed by this PR
 
 ## 5.62.0
 Fri, 09 Mar 2018 11:13:58 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 52dbbce0bb3a3..c734c0567ea2d 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.62.0",
+  "version": "5.62.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -51,7 +51,7 @@
     "@uifabric/icons": ">=5.5.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "@uifabric/styling": ">=5.19.0 <6.0.0",
-    "@uifabric/utilities": ">=5.17.0 <6.0.0",
+    "@uifabric/utilities": ">=5.17.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index aa1caad9c0f06..0795556f43025 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -27,7 +27,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.17.0 <6.0.0",
+    "@uifabric/utilities": ">=5.17.1 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 6b48ffde913b6..5260e5a1ebe0a 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.17.1",
+      "tag": "@uifabric/utilities_v5.17.1",
+      "date": "Fri, 09 Mar 2018 15:07:28 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "jspurlin <jspurlin@microsoft.com>",
+            "commit": "4fc956a30e82d90fe405def0f9434ffdb0d407ab",
+            "comment": "Focus: Update getPreviousElement to traverse a potential childMatch's parent siblings  (which was previously being skipped)"
+          }
+        ]
+      }
+    },
     {
       "version": "5.17.0",
       "tag": "@uifabric/utilities_v5.17.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 9b4e5c998b4a1..bc0b20cafbf29 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Fri, 09 Mar 2018 11:13:58 GMT and should not be manually modified.
+This log was last generated on Fri, 09 Mar 2018 15:07:28 GMT and should not be manually modified.
+
+## 5.17.1
+Fri, 09 Mar 2018 15:07:28 GMT
+
+### Patches
+
+- Focus: Update getPreviousElement to traverse a potential childMatch's parent siblings  (which was previously being skipped)
 
 ## 5.17.0
 Fri, 09 Mar 2018 11:13:58 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index f501ea51e086e..20c37a898ad64 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.17.0",
+  "version": "5.17.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 374759cd95dc57a079b7a76120b008bcd791b173 Mon Sep 17 00:00:00 2001
From: manueldosal <manuel_dosal32@hotmail.com>
Date: Fri, 9 Mar 2018 07:25:01 -0800
Subject: [PATCH 1535/1641] SwatchColorPickerBase: Run onCellFocused in
 componentWillUnmount and _onCellClick (#4212)

* Run onCellFocused when color picker will unmount or when a color was selected

* Adding rush change file
---
 ...unt_And_Select_Color_2018-03-08-01-45.json | 11 +++++++++
 .../SwatchColorPicker.base.tsx                | 23 ++++++++++++++++++-
 2 files changed, 33 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/Run_onCellFocused_Before_Unmount_And_Select_Color_2018-03-08-01-45.json

diff --git a/common/changes/office-ui-fabric-react/Run_onCellFocused_Before_Unmount_And_Select_Color_2018-03-08-01-45.json b/common/changes/office-ui-fabric-react/Run_onCellFocused_Before_Unmount_And_Select_Color_2018-03-08-01-45.json
new file mode 100644
index 0000000000000..6dc28ab1ec213
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/Run_onCellFocused_Before_Unmount_And_Select_Color_2018-03-08-01-45.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Run onCellFocused before unmount and before select color",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "madosal@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
index 8e15267274dbe..55b6d77c10274 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
@@ -35,6 +35,7 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
   } as ISwatchColorPickerProps;
 
   private _id: string;
+  private _cellFocused: boolean;
 
   private navigationIdleTimeoutId: number | undefined;
   private isNavigationIdle: boolean;
@@ -83,6 +84,13 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
     }
   }
 
+  public componentWillUnmount() {
+    if (this.props.onCellFocused && this._cellFocused) {
+      this._cellFocused = false;
+      this.props.onCellFocused();
+    }
+  }
+
   public render() {
     const {
       colorCells,
@@ -134,6 +142,7 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
   @autobind
   private _onSwatchColorPickerBlur() {
     if (this.props.onCellFocused) {
+      this._cellFocused = false;
       this.props.onCellFocused();
     }
   }
@@ -323,7 +332,13 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
   private _onGridCellFocused(item?: IColorCellProps): void {
     const { onCellFocused } = this.props;
     if (onCellFocused) {
-      return item ? onCellFocused(item.id, item.color) : onCellFocused();
+      if (item) {
+        this._cellFocused = true;
+        return onCellFocused(item.id, item.color);
+      } else {
+        this._cellFocused = false;
+        return onCellFocused();
+      }
     }
   }
 
@@ -342,6 +357,12 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
     // If we have a valid index and it is not already
     // selected, select it
     if (index >= 0 && index !== this.state.selectedIndex) {
+
+      if (this.props.onCellFocused && this._cellFocused) {
+        this._cellFocused = false;
+        this.props.onCellFocused();
+      }
+
       if (this.props.onColorChanged) {
         this.props.onColorChanged(item.id, item.color);
       }

From c567289d866c901aad41f4eba9aa1aa92c82aed6 Mon Sep 17 00:00:00 2001
From: amyngu <31973030+amyngu@users.noreply.github.com>
Date: Fri, 9 Mar 2018 10:53:27 -0800
Subject: [PATCH 1536/1641] Add tests for BaseExtendedPicker,
 BaseFloatingPicker, BaseSelectedItemsList (#4219)

* add floating picker tests

* edit tests for floating picker

* add more tests
---
 .../BaseExtendedPicker.tests.tsx              | 174 ++++++++++++++++++
 .../BaseFloatingPicker.test.tsx               | 117 ++++++++++++
 .../BaseFloatingPicker.test.tsx.snap          |   7 +
 .../BaseSelectedItemsList.test.tsx            |  71 +++++++
 .../BaseSelectedItemsList.test.tsx.snap       |   3 +
 .../pickers/Suggestions/Suggestions.tsx       |   6 +-
 6 files changed, 375 insertions(+), 3 deletions(-)
 create mode 100644 packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tests.tsx
 create mode 100644 packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.test.tsx
 create mode 100644 packages/experiments/src/components/FloatingPicker/__snapshots__/BaseFloatingPicker.test.tsx.snap
 create mode 100644 packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.test.tsx
 create mode 100644 packages/experiments/src/components/SelectedItemsList/__snapshots__/BaseSelectedItemsList.test.tsx.snap

diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tests.tsx b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tests.tsx
new file mode 100644
index 0000000000000..8dcd1eefb9bfe
--- /dev/null
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tests.tsx
@@ -0,0 +1,174 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+import * as ReactTestUtils from 'react-dom/test-utils';
+/* tslint:enable:no-unused-variable */
+import * as renderer from 'react-test-renderer';
+
+import { IBaseExtendedPickerProps } from './BaseExtendedPicker.types';
+import { BaseExtendedPicker } from './BaseExtendedPicker';
+import { SuggestionsController } from 'office-ui-fabric-react/lib/Pickers';
+import { IBaseFloatingPickerProps, BaseFloatingPicker } from '../FloatingPicker';
+import { IBaseSelectedItemsListProps, ISelectedItemProps, BaseSelectedItemsList } from '../SelectedItemsList';
+import { KeyCodes } from '../../Utilities';
+
+function onResolveSuggestions(text: string): ISimple[] {
+  return [
+    'black',
+    'blue',
+    'brown',
+    'cyan',
+    'green',
+    'magenta',
+    'mauve',
+    'orange',
+    'pink',
+    'purple',
+    'red',
+    'rose',
+    'violet',
+    'white',
+    'yellow'
+  ].filter((tag: string) => tag.toLowerCase().indexOf(text.toLowerCase()) === 0).map(((item: string) => ({ key: item, name: item })));
+}
+
+const BasePickerWithType = BaseFloatingPicker as new (props: IBaseFloatingPickerProps<ISimple>)
+  => BaseFloatingPicker<ISimple, IBaseFloatingPickerProps<ISimple>>;
+
+const BaseSelectedItemsListWithType = BaseSelectedItemsList as new (props: IBaseSelectedItemsListProps<ISimple>)
+  => BaseSelectedItemsList<ISimple, IBaseSelectedItemsListProps<ISimple>>;
+
+const basicSuggestionRenderer = (props: ISimple) => {
+  return <div> { props.name } </div>;
+};
+
+const basicItemRenderer = (props: ISelectedItemProps<ISimple>) => {
+  return <div> { props.name } </div>;
+};
+
+const basicRenderFloatingPicker = (props: IBaseFloatingPickerProps<ISimple>) => {
+  return <BasePickerWithType {...props} />;
+};
+
+const basicRenderSelectedItemsList = (props: IBaseSelectedItemsListProps<ISimple>) => {
+  return <BaseSelectedItemsListWithType />;
+};
+
+const floatingPickerProps = {
+  onResolveSuggestions: onResolveSuggestions,
+  onRenderSuggestionsItem: basicSuggestionRenderer,
+  suggestionsController: new SuggestionsController<ISimple>()
+};
+
+const selectedItemsListProps: IBaseSelectedItemsListProps<ISimple> = {
+  onRenderItem: basicItemRenderer
+};
+
+export interface ISimple {
+  key: string;
+  name: string;
+}
+
+export type TypedBaseExtendedPicker = BaseExtendedPicker<ISimple, IBaseExtendedPickerProps<ISimple>>;
+
+describe('Pickers', () => {
+  describe('BasePicker', () => {
+    const BaseExtendedPickerWithType = BaseExtendedPicker as new (props: IBaseExtendedPickerProps<ISimple>)
+      => BaseExtendedPicker<ISimple, IBaseExtendedPickerProps<ISimple>>;
+
+    it('renders BaseExtendedPicker correctly', () => {
+      const component = renderer.create(
+        <BaseExtendedPickerWithType
+          floatingPickerProps={ floatingPickerProps }
+          selectedItemsListProps={ selectedItemsListProps }
+          onRenderSelectedItems={ basicRenderSelectedItemsList }
+          onRenderFloatingPicker={ basicRenderFloatingPicker }
+        />
+      );
+      let tree = component.toJSON();
+      expect(tree).toMatchSnapshot();
+    });
+
+    it('force resolves to the first suggestion', () => {
+      let root = document.createElement('div');
+      document.body.appendChild(root);
+
+      let picker: TypedBaseExtendedPicker = ReactDOM.render(
+        <BaseExtendedPickerWithType
+          floatingPickerProps={ floatingPickerProps }
+          selectedItemsListProps={ selectedItemsListProps }
+          onRenderSelectedItems={ basicRenderSelectedItemsList }
+          onRenderFloatingPicker={ basicRenderFloatingPicker }
+        />,
+        root
+      ) as TypedBaseExtendedPicker;
+
+      if (picker.inputElement) {
+        picker.inputElement.value = 'bl';
+      }
+
+      expect(picker.floatingPicker.suggestions.length).toBe(2);
+      expect(picker.floatingPicker.suggestions[0].name).toBe('black');
+
+      // Force resolve to the first suggestions
+      picker.floatingPicker.forceResolveSuggestion();
+      expect(picker.items.length).toBe(1);
+      expect(picker.items[0].name).toBe('black');
+
+      ReactDOM.unmountComponentAtNode(root);
+    });
+
+    it('Can hide and show picker', () => {
+      let root = document.createElement('div');
+      document.body.appendChild(root);
+
+      let picker: TypedBaseExtendedPicker = ReactDOM.render(
+        <BaseExtendedPickerWithType
+          floatingPickerProps={ floatingPickerProps }
+          selectedItemsListProps={ selectedItemsListProps }
+          onRenderSelectedItems={ basicRenderSelectedItemsList }
+          onRenderFloatingPicker={ basicRenderFloatingPicker }
+        />,
+        root
+      ) as TypedBaseExtendedPicker;
+
+      if (picker.inputElement) {
+        picker.inputElement.value = 'bl';
+      }
+
+      expect(picker.floatingPicker.isSuggestionsShown).toBeTruthy();
+      picker.floatingPicker.hidePicker();
+      expect(picker.floatingPicker.isSuggestionsShown).toBeFalsy();
+      picker.floatingPicker.showPicker();
+      expect(picker.floatingPicker.isSuggestionsShown).toBeTruthy();
+
+      ReactDOM.unmountComponentAtNode(root);
+    });
+
+    it('Completes the suggestion', () => {
+      let root = document.createElement('div');
+      document.body.appendChild(root);
+
+      let picker: TypedBaseExtendedPicker = ReactDOM.render(
+        <BaseExtendedPickerWithType
+          floatingPickerProps={ floatingPickerProps }
+          selectedItemsListProps={ selectedItemsListProps }
+          onRenderSelectedItems={ basicRenderSelectedItemsList }
+          onRenderFloatingPicker={ basicRenderFloatingPicker }
+        />,
+        root
+      ) as TypedBaseExtendedPicker;
+
+      if (picker.inputElement) {
+        picker.inputElement.value = 'bl';
+        ReactTestUtils.Simulate.keyDown(picker.inputElement, { which: KeyCodes.down });
+      }
+
+      picker.floatingPicker.completeSuggestion();
+      expect(picker.selectedItemsList.items.length).toBe(1);
+      expect(picker.selectedItemsList.items[0].name).toBe('blue');
+
+      ReactDOM.unmountComponentAtNode(root);
+    });
+  });
+});
diff --git a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.test.tsx b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.test.tsx
new file mode 100644
index 0000000000000..fa1dad84dfc0d
--- /dev/null
+++ b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.test.tsx
@@ -0,0 +1,117 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+/* tslint:enable:no-unused-variable */
+import * as renderer from 'react-test-renderer';
+
+import { IBaseFloatingPickerProps } from './BaseFloatingPicker.types';
+import { BaseFloatingPicker } from './BaseFloatingPicker';
+import { SuggestionsController } from 'office-ui-fabric-react/lib/Pickers';
+
+function onResolveSuggestions(text: string): ISimple[] {
+  return [
+    'black',
+    'blue',
+    'brown',
+    'cyan',
+    'green',
+    'magenta',
+    'mauve',
+    'orange',
+    'pink',
+    'purple',
+    'red',
+    'rose',
+    'violet',
+    'white',
+    'yellow'
+  ].filter((tag: string) => tag.toLowerCase().indexOf(text.toLowerCase()) === 0).map((item: string) => ({ key: item, name: item }));
+}
+
+function onZeroQuerySuggestion(): ISimple[] {
+  return [
+    'black',
+    'blue',
+    'brown',
+    'cyan'].map((item: string) => ({ key: item, name: item }));
+}
+
+const basicSuggestionRenderer = (props: ISimple) => {
+  return <div key={ props.key } > { props.name } </div>;
+};
+
+export interface ISimple {
+  key: string;
+  name: string;
+}
+
+export type TypedBaseFloatingPicker = BaseFloatingPicker<ISimple, IBaseFloatingPickerProps<ISimple>>;
+
+describe('Pickers', () => {
+  describe('BasePicker', () => {
+    const BaseFloatingPickerWithType = BaseFloatingPicker as new (props: IBaseFloatingPickerProps<ISimple>)
+      => BaseFloatingPicker<ISimple, IBaseFloatingPickerProps<ISimple>>;
+
+    it('renders BaseFloatingPicker correctly', () => {
+      const component = renderer.create(
+        <BaseFloatingPickerWithType
+          onResolveSuggestions={ onResolveSuggestions }
+          onRenderSuggestionsItem={ basicSuggestionRenderer }
+          suggestionsController={ new SuggestionsController() }
+        />
+      );
+      let tree = component.toJSON();
+      expect(tree).toMatchSnapshot();
+    });
+
+    it('shows zero query options on empty input', () => {
+      let root = document.createElement('div');
+      let input = document.createElement('input');
+      document.body.appendChild(input);
+      document.body.appendChild(root);
+
+      let picker: TypedBaseFloatingPicker = ReactDOM.render(
+        <BaseFloatingPickerWithType
+          onResolveSuggestions={ onResolveSuggestions }
+          onRenderSuggestionsItem={ basicSuggestionRenderer }
+          suggestionsController={ new SuggestionsController() }
+          onZeroQuerySuggestion={ onZeroQuerySuggestion }
+          inputElement={ input }
+        />,
+        root
+      ) as TypedBaseFloatingPicker;
+
+      picker.onQueryStringChanged('a');
+
+      // Change input to be empty string
+      picker.onQueryStringChanged('');
+
+      expect(picker.suggestions.length).toEqual(4);
+
+      ReactDOM.unmountComponentAtNode(root);
+    });
+
+    it('updates suggestions on query string changed', () => {
+      let root = document.createElement('div');
+      let input = document.createElement('input');
+      document.body.appendChild(input);
+      document.body.appendChild(root);
+
+      let picker: TypedBaseFloatingPicker = ReactDOM.render(
+        <BaseFloatingPickerWithType
+          onResolveSuggestions={ onResolveSuggestions }
+          onRenderSuggestionsItem={ basicSuggestionRenderer }
+          suggestionsController={ new SuggestionsController() }
+          inputElement={ input }
+        />,
+        root
+      ) as TypedBaseFloatingPicker;
+
+      picker.onQueryStringChanged('b');
+
+      expect(picker.suggestions.length).toEqual(3);
+
+      ReactDOM.unmountComponentAtNode(root);
+    });
+  });
+});
diff --git a/packages/experiments/src/components/FloatingPicker/__snapshots__/BaseFloatingPicker.test.tsx.snap b/packages/experiments/src/components/FloatingPicker/__snapshots__/BaseFloatingPicker.test.tsx.snap
new file mode 100644
index 0000000000000..46955019814ea
--- /dev/null
+++ b/packages/experiments/src/components/FloatingPicker/__snapshots__/BaseFloatingPicker.test.tsx.snap
@@ -0,0 +1,7 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Pickers BasePicker renders BaseFloatingPicker correctly 1`] = `
+<div
+  className="ms-BasePicker"
+/>
+`;
diff --git a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.test.tsx b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.test.tsx
new file mode 100644
index 0000000000000..f725e47c0a009
--- /dev/null
+++ b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.test.tsx
@@ -0,0 +1,71 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+/* tslint:enable:no-unused-variable */
+import * as renderer from 'react-test-renderer';
+
+import { IBaseSelectedItemsListProps, ISelectedItemProps } from './BaseSelectedItemsList.types';
+import { BaseSelectedItemsList } from './BaseSelectedItemsList';
+
+export interface ISimple {
+  key: string;
+  name: string;
+}
+
+const basicItemRenderer = (props: ISelectedItemProps<ISimple>) => {
+  return <div key={ props.key }> { props.name } </div>;
+};
+
+export type TypedBaseSelectedItemsList = BaseSelectedItemsList<ISimple, IBaseSelectedItemsListProps<ISimple>>;
+
+describe('SelectedItemsList', () => {
+  describe('BaseSelectedItemsList', () => {
+    const BaseSelectedItemsListWithType = BaseSelectedItemsList as new (props: IBaseSelectedItemsListProps<ISimple>)
+      => BaseSelectedItemsList<ISimple, IBaseSelectedItemsListProps<ISimple>>;
+
+    it('renders BaseSelectedItemsList correctly', () => {
+      const component = renderer.create(
+        <BaseSelectedItemsListWithType
+        />
+      );
+      let tree = component.toJSON();
+      expect(tree).toMatchSnapshot();
+    });
+
+    it('can remove items', () => {
+      const root = document.createElement('div');
+
+      const onChange = (items: ISimple[] | undefined): void => {
+        expect(items!.length).toBe(1);
+        expect(items![0].name).toBe('b');
+      };
+
+      const itemsList: TypedBaseSelectedItemsList = ReactDOM.render(
+        <BaseSelectedItemsListWithType
+          onRenderItem={ basicItemRenderer }
+          selectedItems={ [{ key: '1', name: 'a' }, { key: '2', name: 'b' }] }
+          onChange={ onChange }
+        />,
+        root
+      ) as TypedBaseSelectedItemsList;
+
+      expect(itemsList.items.length).toEqual(2);
+      itemsList.removeItemAt(0);
+    });
+
+    it('can add items', () => {
+      const root = document.createElement('div');
+      const itemsList: TypedBaseSelectedItemsList = ReactDOM.render(
+        <BaseSelectedItemsListWithType
+          onRenderItem={ basicItemRenderer }
+        />,
+        root
+      ) as TypedBaseSelectedItemsList;
+
+      let items: ISimple[] = [{ key: '1', name: 'a' }, { key: '2', name: 'b' }];
+      itemsList.addItems(items);
+
+      expect(itemsList.items.length).toEqual(2);
+    });
+  });
+});
diff --git a/packages/experiments/src/components/SelectedItemsList/__snapshots__/BaseSelectedItemsList.test.tsx.snap b/packages/experiments/src/components/SelectedItemsList/__snapshots__/BaseSelectedItemsList.test.tsx.snap
new file mode 100644
index 0000000000000..46c04acc82f53
--- /dev/null
+++ b/packages/experiments/src/components/SelectedItemsList/__snapshots__/BaseSelectedItemsList.test.tsx.snap
@@ -0,0 +1,3 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`SelectedItemsList BaseSelectedItemsList renders BaseSelectedItemsList correctly 1`] = `null`;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index b24ac5dcb575e..d39d62bce8d7d 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -135,7 +135,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
               styles.actionButton,
               {
                 ['is-selected ' + styles.buttonSelected]:
-                  this.state.selectedActionType === SuggestionActionType.forceResolve
+                this.state.selectedActionType === SuggestionActionType.forceResolve
               }) }
             onClick={ this._forceResolve }
           >
@@ -158,7 +158,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
               styles.actionButton,
               {
                 ['is-selected ' + styles.buttonSelected]:
-                  this.state.selectedActionType === SuggestionActionType.searchMore
+                this.state.selectedActionType === SuggestionActionType.searchMore
               }) }
             iconProps={ { iconName: 'Search' } }
             onClick={ this._getMoreResults }
@@ -304,7 +304,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
 
   // TODO get the element to scroll into view properly regardless of direction.
   public scrollSelected() {
-    if (this._selectedElement) {
+    if (this._selectedElement && this._selectedElement.scrollIntoView !== undefined) {
       this._selectedElement.scrollIntoView(false);
     }
   }

From 2480bbe4e1f498a7ebd086c0b406eb7706bc3c20 Mon Sep 17 00:00:00 2001
From: Alex Henry <adhe223@g.uky.edu>
Date: Fri, 9 Mar 2018 12:28:55 -0800
Subject: [PATCH 1537/1641] Add a rel option for Contextual Menu Items (#4224)

* Add a rel option for menu items and default to safe rel if target is _blank

* Update wording

* Add cahnge log

* Add comment about security
---
 .../addRelProp_2018-03-09-19-29.json          | 11 +++
 .../ContextualMenu/ContextualMenu.test.tsx    | 91 +++++++++++++++++++
 .../ContextualMenu/ContextualMenu.tsx         |  7 ++
 .../ContextualMenu/ContextualMenu.types.ts    |  5 +
 .../examples/ContextualMenu.Basic.Example.tsx | 11 +++
 5 files changed, 125 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/addRelProp_2018-03-09-19-29.json

diff --git a/common/changes/office-ui-fabric-react/addRelProp_2018-03-09-19-29.json b/common/changes/office-ui-fabric-react/addRelProp_2018-03-09-19-29.json
new file mode 100644
index 0000000000000..f66600b8c6381
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/addRelProp_2018-03-09-19-29.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add rel option for Contextual Menu Items",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "alhenry@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
index b459509464b6a..e4d912aa78495 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.test.tsx
@@ -418,6 +418,97 @@ describe('ContextualMenu', () => {
 
   });
 
+  describe('with links', () => {
+    const testUrl = 'http://test.com';
+    let items: IContextualMenuItem[];
+    let menuItems: NodeListOf<Element>;
+    let linkNoTarget: Element;
+    let linkBlankTarget: Element;
+    let linkBlankTargetAndRel: Element;
+    let linkSelfTarget: Element;
+    let linkNoTargetAndRel: Element;
+
+    beforeEach(() => {
+      items = [
+        {
+          name: 'TestText 1',
+          key: 'TestKey1',
+          href: testUrl
+        },
+        {
+          name: 'TestText 2',
+          key: 'TestKey2',
+          href: testUrl,
+          target: '_blank'
+        },
+        {
+          name: 'TestText 3',
+          key: 'TestKey3',
+          href: testUrl,
+          target: '_blank',
+          rel: 'test'
+        },
+        {
+          name: 'TestText 4',
+          key: 'TestKey4',
+          href: testUrl,
+          target: '_self',
+        },
+        {
+          name: 'TestText 5',
+          key: 'TestKey5',
+          href: testUrl,
+          rel: 'test'
+        },
+      ];
+
+      ReactTestUtils.renderIntoDocument<ContextualMenu>(
+        <ContextualMenu
+          items={ items }
+        />
+      );
+
+      menuItems = document.querySelectorAll('li a');
+      linkNoTarget = menuItems[0];
+      linkBlankTarget = menuItems[1];
+      linkBlankTargetAndRel = menuItems[2];
+      linkSelfTarget = menuItems[3];
+      linkNoTargetAndRel = menuItems[4];
+    });
+
+    it('should render an anchor with the passed href', () => {
+      expect(linkNoTarget.getAttribute('href')).toEqual(testUrl);
+    });
+
+    describe('with target passed', () => {
+      it('should render with the specified target', () => {
+        expect(linkSelfTarget.getAttribute('target')).toEqual('_self');
+      });
+
+      it('should not default the rel if the target is not _blank', () => {
+        expect(linkSelfTarget.getAttribute('rel')).toBeNull();
+      });
+
+      describe('when the target is _blank and there is no rel specified', () => {
+        it('should default a rel to prevent clickjacking', () => {
+          expect(linkBlankTarget.getAttribute('rel')).toEqual('nofollow noopener noreferrer');
+        });
+      });
+
+      describe('when the target is _blank and there is a rel specified', () => {
+        it('should use the specified rel', () => {
+          expect(linkBlankTargetAndRel.getAttribute('rel')).toEqual('test');
+        });
+      });
+    });
+
+    describe('with rel passed', () => {
+      it('should add the specified rel', () => {
+        expect(linkNoTargetAndRel.getAttribute('rel')).toEqual('test');
+      });
+    });
+  });
+
   it('does not return a value if no items are given', () => {
     ReactTestUtils.renderIntoDocument<ContextualMenu>(
       <ContextualMenu
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 486c476b21bad..7ee3a403044c8 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -471,12 +471,19 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
   private _renderAnchorMenuItem(item: IContextualMenuItem, classNames: IMenuItemClassNames, index: number, focusableElementIndex: number, totalItemCount: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
     const { contextualMenuItemAs: ChildrenRenderer = ContextualMenuItem } = this.props;
+
+    let anchorRel = item.rel;
+    if (item.target && item.target.toLowerCase() === '_blank') {
+      anchorRel = anchorRel ? anchorRel : 'nofollow noopener noreferrer';  // Safe default to prevent tabjacking
+    }
+
     return (
       <div>
         <a
           { ...getNativeProps(item, anchorProperties) }
           href={ item.href }
           target={ item.target }
+          rel={ anchorRel }
           className={ classNames.root }
           role='menuitem'
           aria-posinset={ focusableElementIndex + 1 }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
index e68d91bf281f2..296c38f94c69e 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
@@ -334,6 +334,11 @@ export interface IContextualMenuItem {
    */
   target?: string;
 
+  /**
+   * An optional rel when using href. If target is _blank rel is defaulted to a value to prevent clickjacking.
+   */
+  rel?: string;
+
   /**
    * Deprecated at v.80.0 and will be removed by v 1.0. Use 'subMenuProps' instead.
    * @deprecated
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx
index 318cefb3872fd..11eb5e116fa9e 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx
@@ -45,6 +45,17 @@ export class ContextualMenuBasicExample extends React.Component {
                 name: 'Properties',
                 onClick: () => console.log('Properties clicked')
               },
+              {
+                key: 'linkNoTarget',
+                name: 'Link same window',
+                href: 'http://bing.com'
+              },
+              {
+                key: 'linkWithTarget',
+                name: 'Link new window',
+                href: 'http://bing.com',
+                target: '_blank'
+              },
               {
                 key: 'disabled',
                 name: 'Disabled item',

From 494d1258ce23505c8e5a4d1565ff5a2451048162 Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Fri, 9 Mar 2018 16:31:11 -0800
Subject: [PATCH 1538/1641] Add hoistStatics Function to Utilities Package 
 (#4218)

* Added hoistStatics function to Utilities package for decorator fix

* rush change

* better import syntax
---
 .../utilities/master_2018-03-09-00-06.json    | 11 ++++++++++
 .../master_2018-03-09-00-06.json              | 11 ++++++++++
 .../decorators/withResponsiveMode.tsx         | 13 +-----------
 packages/utilities/src/customizable.tsx       | 16 ++++----------
 packages/utilities/src/hoistStatics.ts        | 21 +++++++++++++++++++
 packages/utilities/src/index.ts               |  1 +
 6 files changed, 49 insertions(+), 24 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/master_2018-03-09-00-06.json
 create mode 100644 common/changes/office-ui-fabric-react/master_2018-03-09-00-06.json
 create mode 100644 packages/utilities/src/hoistStatics.ts

diff --git a/common/changes/@uifabric/utilities/master_2018-03-09-00-06.json b/common/changes/@uifabric/utilities/master_2018-03-09-00-06.json
new file mode 100644
index 0000000000000..7ed34983dd680
--- /dev/null
+++ b/common/changes/@uifabric/utilities/master_2018-03-09-00-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "added hoistStatics function for use with decorators to fix broken statics issue, and added the fuction to the customizable decorator",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2018-03-09-00-06.json b/common/changes/office-ui-fabric-react/master_2018-03-09-00-06.json
new file mode 100644
index 0000000000000..c9eaba727642e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2018-03-09-00-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "importing hoistStatics from Utilities for withResponsiveMode decorator",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx b/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx
index 73671d6be4c4e..9196a7431f13b 100644
--- a/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/decorators/withResponsiveMode.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { BaseDecorator } from './BaseDecorator';
-import { getWindow } from '../../Utilities';
+import { getWindow, hoistStatics } from '../../Utilities';
 
 export interface IWithResponsiveModeState {
   responsiveMode?: ResponsiveMode;
@@ -100,14 +100,3 @@ export function withResponsiveMode<TProps extends { responsiveMode?: ResponsiveM
   };
   return hoistStatics(ComposedComponent, resultClass);
 }
-
-function hoistStatics<TSource, TDest>(source: TSource, dest: TDest): TDest {
-  for (const name in source) {
-    if (source.hasOwnProperty(name)) {
-      // tslint:disable-next-line:no-any
-      (dest as any)[name] = source[name];
-    }
-  }
-
-  return dest;
-}
diff --git a/packages/utilities/src/customizable.tsx b/packages/utilities/src/customizable.tsx
index a3a99e57167b5..cc4c36585ba73 100644
--- a/packages/utilities/src/customizable.tsx
+++ b/packages/utilities/src/customizable.tsx
@@ -1,6 +1,9 @@
 import * as React from 'react';
 import * as PropTypes from 'prop-types';
-import { Customizations } from './Customizations';
+import {
+  Customizations,
+  hoistStatics
+} from './';
 
 export function customizable(
   scope: string,
@@ -56,14 +59,3 @@ export function customizable(
     return hoistStatics(ComposedComponent, resultClass);
   };
 }
-
-function hoistStatics<TSource, TDest>(source: TSource, dest: TDest): TDest {
-  for (const name in source) {
-    if (source.hasOwnProperty(name)) {
-      // tslint:disable-next-line:no-any
-      (dest as any)[name] = source[name];
-    }
-  }
-
-  return dest;
-}
\ No newline at end of file
diff --git a/packages/utilities/src/hoistStatics.ts b/packages/utilities/src/hoistStatics.ts
new file mode 100644
index 0000000000000..42b5d3ada01d8
--- /dev/null
+++ b/packages/utilities/src/hoistStatics.ts
@@ -0,0 +1,21 @@
+/**
+ * Allows you to hoist static functions in components.
+ * Created for the purpose of fixing broken static functions in classes
+ * that utilize decorators.
+ *
+ * @public
+ * @param source - The object where the methods are hoisted from.
+ * @param dest - The object to hoist the methods onto.
+ * @returns The dest object with methods added
+ */
+
+export function hoistStatics<TSource, TDest>(source: TSource, dest: TDest): TDest {
+  for (const name in source) {
+    if (source.hasOwnProperty(name)) {
+      // tslint:disable-next-line:no-any
+      (dest as any)[name] = source[name];
+    }
+  }
+
+  return dest;
+}
\ No newline at end of file
diff --git a/packages/utilities/src/index.ts b/packages/utilities/src/index.ts
index 379179411280e..f4df49c0063b7 100644
--- a/packages/utilities/src/index.ts
+++ b/packages/utilities/src/index.ts
@@ -26,6 +26,7 @@ export * from './customizable';
 export * from './dom';
 export * from './focus';
 export * from './hoist';
+export * from './hoistStatics';
 export * from './initials';
 export * from './language';
 export * from './math';

From bc0d12b6c5952b22f079e9e09ec31654726f9a37 Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Fri, 9 Mar 2018 17:27:51 -0800
Subject: [PATCH 1539/1641] Fix variants version (#4213)

* fix version

* fix version

* fix version to match policy
---
 .../phkuo-fixVariantsVersion_2018-03-08-02-36.json    | 11 +++++++++++
 packages/variants/package.json                        |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/variants/phkuo-fixVariantsVersion_2018-03-08-02-36.json

diff --git a/common/changes/@uifabric/variants/phkuo-fixVariantsVersion_2018-03-08-02-36.json b/common/changes/@uifabric/variants/phkuo-fixVariantsVersion_2018-03-08-02-36.json
new file mode 100644
index 0000000000000..75d271686afca
--- /dev/null
+++ b/common/changes/@uifabric/variants/phkuo-fixVariantsVersion_2018-03-08-02-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/variants",
+      "comment": "fix version for variants package",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/variants",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/variants/package.json b/packages/variants/package.json
index b4fe77e2f5b06..1684392c30834 100644
--- a/packages/variants/package.json
+++ b/packages/variants/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/variants",
-  "version": "5.11.2",
+  "version": "5.0.0",
   "description": "Office UI Fabric subtheme generator.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 9076096e7fc955b21ea01665d2b513034ac3c651 Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Fri, 9 Mar 2018 21:09:53 -0800
Subject: [PATCH 1540/1641] Variants project: improve readme (#4233)

* update variants readme

* changefile

* address feedback
---
 .../phkuo-variantsReadme_2018-03-10-01-12.json  |  11 +++++++++++
 packages/variants/README.md                     |  12 ++++++++----
 packages/variants/example.png                   | Bin 0 -> 35309 bytes
 3 files changed, 19 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/@uifabric/variants/phkuo-variantsReadme_2018-03-10-01-12.json
 create mode 100644 packages/variants/example.png

diff --git a/common/changes/@uifabric/variants/phkuo-variantsReadme_2018-03-10-01-12.json b/common/changes/@uifabric/variants/phkuo-variantsReadme_2018-03-10-01-12.json
new file mode 100644
index 0000000000000..86ea4d03cf7ee
--- /dev/null
+++ b/common/changes/@uifabric/variants/phkuo-variantsReadme_2018-03-10-01-12.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/variants",
+      "comment": "update readme",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/variants",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/variants/README.md b/packages/variants/README.md
index 66c7256d3bb34..34d0d5cc173f6 100644
--- a/packages/variants/README.md
+++ b/packages/variants/README.md
@@ -1,11 +1,15 @@
 # [variants](http://dev.office.com/fabric)
 
-Variants are themes based on another theme, subthemes which share the same colors as the original theme, but with those colors used in different places. A variant is still a full theme in and of itself.
+Variants are [themes](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/Theming.md) generated from an existing theme, as opposed to [from raw colors](https://developer.microsoft.com/en-us/fabric#/styles/themegenerator). A variant will share the same colors as the original theme it was generated from, but will use those colors differently. For example, the background color and text color might be swapped. Variants can be used to highlight or de-emphasize portions of the page.
 
-This project creates variants of a given theme, which are intended for use with the Customizer component in office-ui-fabric-react. These subthemes allow you to highlight or de-emphasize sections of the page with colors that still match the current theme.
+This project provides helper functions to create variants of a given theme, which are intended for use with the [Customizer](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/utilities/src/Customizer.tsx) component. Each function takes in an [IPartialTheme](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/styling/src/interfaces/ITheme.ts) and returns an [ITheme](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/styling/src/interfaces/ITheme.ts).
 
 The available variants are:
 
-* Neutral - a soft neutral color is used as the background (light gray in the default theme), most other colors are changed very little or not at all
-* Soft - a soft shade of the primary color is used as the background (light blue in the default theme), most other colors are changed very little or not at all, but input controls will look different
+* Neutral (not yet implemented) - a soft neutral color is used as the background (light gray in the default theme), most other colors are changed very little or not at all
+* Soft - a soft shade of the primary color is used as the background (light blue in the default theme), most other colors are changed very little or not at all, but input controls look different
 * Strong - a strong shade of the primary color is used as the background (blue in the default theme), almost all colors are changed
+
+Example of normal, soft, and strong variants:
+
+![example of variants](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/variants/example.png)
\ No newline at end of file
diff --git a/packages/variants/example.png b/packages/variants/example.png
new file mode 100644
index 0000000000000000000000000000000000000000..6ddd3f0c6297b81f1d23c1cad16685e34bb69e3c
GIT binary patch
literal 35309
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

literal 0
HcmV?d00001


From aa9c51c996715398e2b8a722db66b00806743e45 Mon Sep 17 00:00:00 2001
From: MaxLustig <maxslustig@gmail.com>
Date: Sat, 10 Mar 2018 14:37:35 -0800
Subject: [PATCH 1541/1641] Add ability to get and set scroll position on
 ScrollablePane (#4230)

* Add ability to get and set scroll position on ScrollablePane

* Rush change
---
 .../maxlus-scrollIntoView_2018-03-09-22-19.json      | 11 +++++++++++
 .../ScrollablePane/ScrollablePane.base.tsx           | 12 ++++++++++++
 .../ScrollablePane/ScrollablePane.types.ts           |  7 +++++++
 3 files changed, 30 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/maxlus-scrollIntoView_2018-03-09-22-19.json

diff --git a/common/changes/office-ui-fabric-react/maxlus-scrollIntoView_2018-03-09-22-19.json b/common/changes/office-ui-fabric-react/maxlus-scrollIntoView_2018-03-09-22-19.json
new file mode 100644
index 0000000000000..a305211e6b750
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/maxlus-scrollIntoView_2018-03-09-22-19.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add ability to get and set scroll position on ScrollablePane",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "maxlus@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
index 82f67a6892b58..79f32b9657e1c 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
@@ -69,6 +69,13 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
     this._events.off(window);
   }
 
+  public componentDidUpdate(prevProps: IScrollablePaneProps) {
+    const initialScrollPosition = this.props.initialScrollPosition;
+    if (initialScrollPosition && prevProps.initialScrollPosition !== initialScrollPosition) {
+      this.root.scrollTop = initialScrollPosition;
+    }
+  }
+
   public render() {
     const { className, theme, getStyles } = this.props;
     const classNames = getClassNames(getStyles!,
@@ -144,6 +151,11 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
     }
   }
 
+  @autobind
+  public getScrollPosition(): number {
+    return this.root.scrollTop;
+  }
+
   private _addSticky(sticky: Sticky, stickyList: Set<Sticky>, container: HTMLElement, addStickyToContainer: () => void) {
     if (!stickyList.has(sticky)) {
       stickyList.add(sticky);
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts
index 3cec91bda207f..b1b432bb068ff 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts
@@ -6,6 +6,8 @@ import { IStyleFunction } from '../../Utilities';
 export interface IScrollablePane {
   /** Triggers a layout update for the pane. */
   forceLayoutUpdate(): void;
+  /** Gets the current scroll position of the scrollable pane */
+  getScrollPosition(): number;
 }
 
 export interface IScrollablePaneProps extends React.HTMLAttributes<HTMLElement | ScrollablePaneBase> {
@@ -31,6 +33,11 @@ export interface IScrollablePaneProps extends React.HTMLAttributes<HTMLElement |
    * @defaultvalue undefined
    */
   className?: string;
+
+  /**
+   * Sets the initial scroll position of the ScrollablePane
+   */
+  initialScrollPosition?: number;
 }
 
 export interface IScrollablePaneStyleProps {

From 672bcf4e5062bdefb6965d19f0cd67d92f8dbceb Mon Sep 17 00:00:00 2001
From: Josh Goldberg <joshuakgoldberg@outlook.com>
Date: Sat, 10 Mar 2018 15:02:28 -0800
Subject: [PATCH 1542/1641] Made DetailsList's onColumnClick's args
 non-optional (#4226)

* Made DetailsList's onColumnClick's args non-optional

Fixes #4080.

* Added Rush changes
---
 ...details-list-on-column-click_2018-03-09-20-51.json | 11 +++++++++++
 .../src/components/DetailsList/DetailsList.types.ts   |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/non-optional-details-list-on-column-click_2018-03-09-20-51.json

diff --git a/common/changes/office-ui-fabric-react/non-optional-details-list-on-column-click_2018-03-09-20-51.json b/common/changes/office-ui-fabric-react/non-optional-details-list-on-column-click_2018-03-09-20-51.json
new file mode 100644
index 0000000000000..39abd3f9d3c1d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/non-optional-details-list-on-column-click_2018-03-09-20-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Made DetailsList's onColumnClick's args non-optional",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jogol@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
index 9ae30253e1758..4d5bddf037f5e 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
@@ -329,7 +329,7 @@ export interface IColumn {
   /**
    * If provided, will be executed when the user clicks on the column header.
    */
-  onColumnClick?: (ev?: React.MouseEvent<HTMLElement>, column?: IColumn) => any;
+  onColumnClick?: (ev: React.MouseEvent<HTMLElement>, column: IColumn) => any;
 
   /**
    * If provided, will be executed when the user accesses the contextmenu on a column header.

From 16609b308f3c92430851cd61cfdb3640d8960444 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 10 Mar 2018 15:12:26 -0800
Subject: [PATCH 1543/1641] Bumping rush, adjusting config. (#4235)

---
 package.json |  2 +-
 rush.json    | 39 ++++++++++++++++++++++++++++-----------
 2 files changed, 29 insertions(+), 12 deletions(-)

diff --git a/package.json b/package.json
index 85b7f65ee7098..7ce5f0b04aa3b 100644
--- a/package.json
+++ b/package.json
@@ -28,6 +28,6 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@microsoft/rush": "4.1.0"
+    "@microsoft/rush": "4.3.0"
   }
 }
diff --git a/rush.json b/rush.json
index 32c629eca9d7b..9e5da8c53945d 100644
--- a/rush.json
+++ b/rush.json
@@ -1,6 +1,6 @@
 {
   "npmVersion": "5.3.0",
-  "rushVersion": "4.1.0",
+  "rushVersion": "4.3.0",
   "repository": {
     "url": "https://github.com/OfficeDev/office-ui-fabric-react.git"
   },
@@ -9,27 +9,32 @@
     {
       "packageName": "office-ui-fabric-react",
       "projectFolder": "packages/office-ui-fabric-react",
-      "versionPolicyName": "lockedMajor"
+      "versionPolicyName": "lockedMajor",
+      "shouldPublish": true
     },
     {
       "packageName": "@uifabric/experiments",
       "projectFolder": "packages/experiments",
-      "versionPolicyName": "lockedMajor"
+      "versionPolicyName": "lockedMajor",
+      "shouldPublish": true
     },
     {
       "packageName": "@uifabric/merge-styles",
       "projectFolder": "packages/merge-styles",
-      "versionPolicyName": "lockedMajor"
+      "versionPolicyName": "lockedMajor",
+      "shouldPublish": true
     },
     {
       "packageName": "@uifabric/jest-serializer-merge-styles",
       "projectFolder": "packages/jest-serializer-merge-styles",
-      "versionPolicyName": "lockedMajor"
+      "versionPolicyName": "lockedMajor",
+      "shouldPublish": true
     },
     {
       "packageName": "@uifabric/utilities",
       "projectFolder": "packages/utilities",
-      "versionPolicyName": "lockedMajor"
+      "versionPolicyName": "lockedMajor",
+      "shouldPublish": true
     },
     {
       "packageName": "@uifabric/example-app-base",
@@ -37,7 +42,8 @@
       "versionPolicyName": "lockedMajor",
       "cyclicDependencyProjects": [
         "office-ui-fabric-react"
-      ]
+      ],
+      "shouldPublish": true
     },
     {
       "packageName": "@uifabric/styling",
@@ -46,56 +52,67 @@
       "cyclicDependencyProjects": [
         "office-ui-fabric-react",
         "@uifabric/example-app-base"
-      ]
+      ],
+      "shouldPublish": true
     },
     {
       "packageName": "@uifabric/variants",
       "projectFolder": "packages/variants",
-      "versionPolicyName": "lockedMajor"
+      "versionPolicyName": "lockedMajor",
+      "shouldPublish": true
     },
     {
       "packageName": "@uifabric/file-type-icons",
       "projectFolder": "packages/file-type-icons",
+      "versionPolicyName": "lockedMajor",
       "shouldPublish": true
     },
     {
       "packageName": "@uifabric/icons",
       "projectFolder": "packages/icons",
-      "versionPolicyName": "lockedMajor"
+      "versionPolicyName": "lockedMajor",
+      "shouldPublish": true
     },
     {
       "packageName": "@uifabric/build",
       "projectFolder": "scripts",
+      "versionPolicyName": "lockedMajor",
       "shouldPublish": false
     },
     {
       "packageName": "ssr-tests",
       "projectFolder": "apps/ssr-tests",
+      "versionPolicyName": "lockedMajor",
       "shouldPublish": false
     },
     {
       "packageName": "vr-tests",
       "projectFolder": "apps/vr-tests",
+      "versionPolicyName": "lockedMajor",
       "shouldPublish": false
     },
     {
       "packageName": "todo-app",
       "projectFolder": "apps/todo-app",
+      "versionPolicyName": "lockedMajor",
       "shouldPublish": false
     },
     {
       "packageName": "@uifabric/fabric-website",
       "projectFolder": "apps/fabric-website",
-      "versionPolicyName": "lockedMajor"
+      "versionPolicyName": "lockedMajor",
+      "shouldPublish": true
     },
     {
       "packageName": "test-bundle-button",
       "projectFolder": "apps/test-bundle-button",
+      "versionPolicyName": "lockedMajor",
       "shouldPublish": false
     },
     {
       "packageName": "office-ui-fabric-react-tslint",
       "projectFolder": "packages/office-ui-fabric-react-tslint",
+      "versionPolicyName": "lockedMajor",
       "shouldPublish": false
     }
   ]

From 327e1e350ab4bb9909d449e66b7ec9ef8ca879e4 Mon Sep 17 00:00:00 2001
From: Matt Lind <matthewtlind@hotmail.com>
Date: Sat, 10 Mar 2018 15:13:51 -0800
Subject: [PATCH 1544/1641] Facepile overflow personas (#4096)

* Facepile overflow personas

* tests

* snapshot update

* cr comments

* snapshot fix

* build fix

* Fixing typo "overlow"

* Update malind-facepileOverflow_2018-02-26-15-58.json

* Update Facepile.test.tsx
---
 ...ind-facepileOverflow_2018-02-26-15-58.json |  11 ++
 .../src/components/Facepile/Facepile.scss     |   2 -
 .../src/components/Facepile/Facepile.test.tsx |  40 ++++++-
 .../src/components/Facepile/Facepile.tsx      | 100 +++++++++++-------
 .../src/components/Facepile/Facepile.types.ts |   8 +-
 .../__snapshots__/Facepile.test.tsx.snap      |   2 +-
 .../examples/Facepile.Basic.Example.tsx       |   1 +
 .../examples/Facepile.Overflow.Example.tsx    |   4 +-
 8 files changed, 123 insertions(+), 45 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/malind-facepileOverflow_2018-02-26-15-58.json

diff --git a/common/changes/office-ui-fabric-react/malind-facepileOverflow_2018-02-26-15-58.json b/common/changes/office-ui-fabric-react/malind-facepileOverflow_2018-02-26-15-58.json
new file mode 100644
index 0000000000000..319e334560e75
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/malind-facepileOverflow_2018-02-26-15-58.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Facepile: Added `overflowPersonas` option to better control what personas go into the overflow personas vs show up as a persona coin. Also adjusted Facepile back to showing a Persona control if there is only one persona to be shown with no overflow.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "malind@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.scss b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.scss
index a0e41b21c675a..e02c5a99ab5dd 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.scss
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.scss
@@ -17,8 +17,6 @@ $spacingAroundItemButton: 2px;
 
 .members {
   display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
   overflow: hidden;
   margin: -1 * $spacingAroundItemButton;
 
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
index 628414b8fa98b..8127da0ffca43 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.test.tsx
@@ -8,6 +8,7 @@ import { setRTL } from '../../Utilities';
 import { Facepile } from './Facepile';
 import { IFacepilePersona, OverflowButtonType } from './Facepile.types';
 import { PersonaSize } from '../../Persona';
+import { Persona } from '../../Persona';
 import { PersonaCoin } from '../../PersonaCoin';
 import { TestImages } from '../../common/TestImages';
 import { findNodes, expectOne, expectMissing } from '../../common/testUtilities';
@@ -191,4 +192,41 @@ describe('Facepile', () => {
     });
   });
 
-});
\ No newline at end of file
+  it('renders Persona control if exactly one persona is sent in props', () => {
+    let wrapper = shallow(
+      <Facepile
+        personas={ facepilePersonas.slice(0, 1) }
+        overflowPersonas={ [] }
+      />);
+
+    expect(wrapper.find(PersonaCoin).length).toEqual(0);
+    expect(wrapper.find(Persona).length).toEqual(1);
+
+    wrapper = shallow(
+      <Facepile
+        personas={ facepilePersonas.slice(0, 1) }
+      />);
+
+    expect(wrapper.find(PersonaCoin).length).toEqual(0);
+    expect(wrapper.find(Persona).length).toEqual(1);
+  });
+
+  it('renders Persona control if exactly one persona is sent in props', () => {
+    let wrapper = shallow(
+      <Facepile
+        personas={ facepilePersonas.slice(0, 1) }
+        overflowPersonas={ [] }
+      />);
+
+    expect(wrapper.find(PersonaCoin).length).toEqual(0);
+    expect(wrapper.find(Persona).length).toEqual(1);
+
+    wrapper = shallow(
+      <Facepile
+        personas={ facepilePersonas.slice(0, 1) }
+      />);
+
+    expect(wrapper.find(PersonaCoin).length).toEqual(0);
+    expect(wrapper.find(Persona).length).toEqual(1);
+  });
+});
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
index 042e96e63df26..2f230e6a77e02 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
@@ -22,6 +22,9 @@ import {
 import {
   Icon
 } from '../../Icon';
+import {
+  Persona
+} from '../../Persona';
 import {
   PersonaCoin,
   PersonaSize,
@@ -34,17 +37,20 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
   public static defaultProps: IFacepileProps = {
     maxDisplayablePersonas: 5,
     personas: [],
+    overflowPersonas: [],
     personaSize: PersonaSize.size32
   };
 
   private _ariaDescriptionId: string;
+  private _id: string;
 
   constructor(props: IFacepileProps) {
     super(props);
 
+    this._id = getId('Facepile');
     this._ariaDescriptionId = getId();
-
   }
+
   public render(): JSX.Element {
     let { overflowButtonProps } = this.props;
     const {
@@ -53,38 +59,35 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
       maxDisplayablePersonas,
       className,
       personas,
+      overflowPersonas,
       showAddButton
     } = this.props;
-    const numPersonasToShow: number = Math.min(personas.length, maxDisplayablePersonas as number);
+
+    const numPersonasToShow: number = Math.min(personas.length, maxDisplayablePersonas || personas.length);
 
     // Added for deprecating chevronButtonProps.  Can remove after v1.0
     if (chevronButtonProps && !overflowButtonProps) {
       overflowButtonProps = chevronButtonProps;
     }
 
+    const hasOverflowPersonas = overflowPersonas && overflowPersonas.length > 0;
+    const personasPrimary: IFacepilePersona[] = hasOverflowPersonas ? personas : personas.slice(0, numPersonasToShow);
+    const personasOverflow: IFacepilePersona[] = (hasOverflowPersonas ? overflowPersonas : personas.slice(numPersonasToShow)) || [];
+
     return (
-      <div className={ css('ms-Facepile', styles.root, className) }>
-        <div
-          className={ css('ms-Facepile-itemContainer', styles.itemContainer) }
-        >
+      <div className={ css('ms-Facepile', styles.root, className) } >
+        { this.onRenderAriaDescription() }
+        <div className={ css('ms-Facepile-itemContainer', styles.itemContainer) } >
           { showAddButton ? this._getAddNewElement() : null }
-          { this.onRenderAriaDescription() }
           <FocusZone
             ariaDescribedBy={ ariaDescription && this._ariaDescriptionId }
             role='listbox'
             className={ css('ms-Facepile-members', styles.members) }
             direction={ FocusZoneDirection.horizontal }
           >
-            {
-              personas.slice(0, numPersonasToShow).map((persona: IFacepilePersona, index: number) => {
-                const personaControl: JSX.Element = this._getPersonaControl(persona);
-                return persona.onClick ?
-                  this._getElementWithOnClickEvent(personaControl, persona, index) :
-                  this._getElementWithoutOnClickEvent(personaControl, persona, index);
-              })
-            }
+            { this._onRenderVisiblePersonas(personasPrimary, personasOverflow.length === 0 && personas.length === 1) }
           </FocusZone>
-          { overflowButtonProps ? this._getOverflowElement(numPersonasToShow) : null }
+          { overflowButtonProps ? this._getOverflowElement(personasOverflow) : null }
         </div>
       </div>
     );
@@ -100,7 +103,30 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
     );
   }
 
+  private _onRenderVisiblePersonas(personas: IFacepilePersona[], singlePersona: boolean) {
+    return personas.map((persona: IFacepilePersona, index: number) => {
+      const personaControl: JSX.Element = singlePersona ? this._getPersonaControl(persona) : this._getPersonaCoinControl(persona);
+      return persona.onClick ?
+        this._getElementWithOnClickEvent(personaControl, persona, index) :
+        this._getElementWithoutOnClickEvent(personaControl, persona, index);
+    });
+  }
+
   private _getPersonaControl(persona: IFacepilePersona): JSX.Element {
+    const { getPersonaProps, personaSize } = this.props;
+    return (
+      <Persona
+        imageInitials={ persona.imageInitials }
+        imageUrl={ persona.imageUrl }
+        initialsColor={ persona.initialsColor }
+        primaryText={ persona.personaName }
+        size={ personaSize }
+        {...(getPersonaProps ? getPersonaProps(persona) : null) }
+      />
+    );
+  }
+
+  private _getPersonaCoinControl(persona: IFacepilePersona): JSX.Element {
     const { getPersonaProps, personaSize } = this.props;
     return (
       <PersonaCoin
@@ -118,14 +144,8 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
     return (
       <FacepileButton
         { ...getNativeProps(persona, buttonProperties) }
-        key={ (!!persona.imageUrl ? 'i' : '') + index }
-        data-is-focusable={ true }
-        role='option'
-        className={ css('ms-Facepile-itemButton ms-Facepile-person', styles.itemButton) }
-        title={ persona.personaName }
+        {...this._getElementProps(persona, index) }
         onClick={ this._onPersonaClick.bind(this, persona) }
-        onMouseMove={ this._onPersonaMouseMove.bind(this, persona) }
-        onMouseOut={ this._onPersonaMouseOut.bind(this, persona) }
       >
         { personaControl }
       </FacepileButton>
@@ -135,24 +155,30 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
   private _getElementWithoutOnClickEvent(personaControl: JSX.Element, persona: IFacepilePersona, index: number): JSX.Element {
     return (
       <div
-        { ...getNativeProps(persona, divProperties) }
-        key={ (!!persona.imageUrl ? 'i' : '') + index }
-        data-is-focusable={ true }
-        role='option'
-        className={ css('ms-Facepile-itemButton ms-Facepile-person', styles.itemButton) }
-        title={ persona.personaName }
-        onMouseMove={ this._onPersonaMouseMove.bind(this, persona) }
-        onMouseOut={ this._onPersonaMouseOut.bind(this, persona) }
+        { ...getNativeProps(persona, buttonProperties) }
+        {...this._getElementProps(persona, index) }
       >
         { personaControl }
       </div>
     );
   }
 
-  private _getOverflowElement(numPersonasToShow: number): JSX.Element | null {
+  private _getElementProps(persona: IFacepilePersona, index: number) {
+    return {
+      key: (!!persona.imageUrl ? 'i' : '') + index,
+      'data-is-focusable': true,
+      role: 'option',
+      className: css('ms-Facepile-itemButton ms-Facepile-person', styles.itemButton),
+      title: persona.personaName,
+      onMouseMove: this._onPersonaMouseMove.bind(this, persona),
+      onMouseOut: this._onPersonaMouseOut.bind(this, persona)
+    };
+  }
+
+  private _getOverflowElement(personasOverflow: IFacepilePersona[]): JSX.Element | null {
     switch (this.props.overflowButtonType) {
       case OverflowButtonType.descriptive:
-        return this._getDescriptiveOverflowElement(numPersonasToShow);
+        return this._getDescriptiveOverflowElement(personasOverflow);
       case OverflowButtonType.downArrow:
         return this._getIconElement('ChevronDown');
       case OverflowButtonType.more:
@@ -162,13 +188,13 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
     }
   }
 
-  private _getDescriptiveOverflowElement(numPersonasToShow: number): JSX.Element | null {
+  private _getDescriptiveOverflowElement(personasOverflow: IFacepilePersona[]): JSX.Element | null {
     const { overflowButtonProps, personas, personaSize } = this.props;
-    const numPersonasNotPictured: number = personas.length - numPersonasToShow;
 
-    if (!overflowButtonProps || numPersonasNotPictured < 1) { return null; }
+    if (!personasOverflow || personasOverflow.length < 1) { return null; }
 
-    const personaNames: string = personas.slice(numPersonasToShow).map((p: IFacepilePersona) => p.personaName).join(', ');
+    const personaNames: string = personasOverflow.map((p: IFacepilePersona) => p.personaName).join(', ');
+    const numPersonasNotPictured: number = Math.max(personasOverflow.length, 0);
 
     return (
       <FacepileButton
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.types.ts b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.types.ts
index 13e68697179ff..2b1ee1f35d51f 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.types.ts
@@ -19,11 +19,15 @@ export interface IFacepileProps extends React.Props<Facepile> {
   componentRef?: (component: IFacepile) => void;
 
   /**
-   * Array of IPersonaProps that define each Persona. Note that the size
-   * is fixed at PersonaSize.size32 regardless of what is specified.
+   * Array of IPersonaProps that define each Persona.
    */
   personas: IFacepilePersona[];
 
+  /**
+   * Personas to place in the overflow
+   */
+  overflowPersonas?: IFacepilePersona[];
+
   /** Maximum number of personas to show */
   maxDisplayablePersonas?: number;
 
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
index c1be4d56cbdd8..8bdfa8825b719 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
@@ -11,7 +11,7 @@ exports[`Facepile renders Facepile correctly 1`] = `
       aria-describedby={undefined}
       aria-labelledby={undefined}
       className="ms-FocusZone ms-Facepile-members"
-      data-focuszone-id="FocusZone1"
+      data-focuszone-id="FocusZone2"
       onFocus={[Function]}
       onKeyDown={[Function]}
       onMouseDownCapture={[Function]}
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
index 1796e3f08da4a..553cdb6180bf4 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
@@ -33,6 +33,7 @@ export class FacepileBasicExample extends React.Component<{}, IFacepileBasicExam
     const facepileProps: IFacepileProps = {
       personaSize: personaSize,
       personas: facepilePersonas.slice(0, numberOfFaces),
+      overflowPersonas: facepilePersonas.slice(numberOfFaces),
       getPersonaProps: (persona: IFacepilePersona) => {
         return {
           imageShouldFadeIn: this.state.imagesFadeIn
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx
index 292f63c3bb5ae..7275e2cc966bf 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx
@@ -49,8 +49,8 @@ export class FacepileOverflowExample extends React.Component<{}, IFacepileOverfl
         <div className={ 'control' }>
           <Slider
             label='Number of Personas:'
-            min={ 0 }
-            max={ 6 }
+            min={ 1 }
+            max={ 5 }
             step={ 1 }
             showValue={ true }
             value={ this.state.displayedPersonas }

From a318dd2747b39b510187fbfc8a15067c897b4a91 Mon Sep 17 00:00:00 2001
From: Mark Polak <mark@thedutchies.com>
Date: Sun, 11 Mar 2018 00:34:28 +0100
Subject: [PATCH 1545/1641] Prefer inferred types for createRef (#4189)

* Prefer inferred types for createRef

* Disable conflicting rule
---
 apps/todo-app/src/components/TodoForm.tsx                  | 4 ++--
 ghdocs/BESTPRACTICES.md                                    | 4 ++--
 .../src/components/Highlight/Highlight.tsx                 | 4 ++--
 .../src/components/CommandBar/CommandBar.base.tsx          | 7 +++----
 .../src/components/FloatingPicker/BaseFloatingPicker.tsx   | 7 +++----
 .../SelectedPeopleList/Items/EditingItem.tsx               | 5 ++---
 .../SelectedPeopleList/Items/ExtendedSelectedItem.tsx      | 4 ++--
 .../src/components/VirtualizedList/VirtualizedList.tsx     | 4 ++--
 packages/office-ui-fabric-react-tslint/tslint.json         | 3 +--
 packages/utilities/src/DelayedRender.tsx                   | 1 -
 10 files changed, 19 insertions(+), 24 deletions(-)

diff --git a/apps/todo-app/src/components/TodoForm.tsx b/apps/todo-app/src/components/TodoForm.tsx
index e1cfc05dddb08..f2c71d9439c07 100644
--- a/apps/todo-app/src/components/TodoForm.tsx
+++ b/apps/todo-app/src/components/TodoForm.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { autobind, BaseComponent, IBaseProps, createRef, RefObject } from 'office-ui-fabric-react/lib/Utilities';
+import { autobind, BaseComponent, IBaseProps, createRef } from 'office-ui-fabric-react/lib/Utilities';
 import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
 import { TextField, ITextField } from 'office-ui-fabric-react/lib/TextField';
 import * as stylesImport from './Todo.scss';
@@ -42,7 +42,7 @@ export interface ITodoFormState {
  * Button: https://fabricreact.azurewebsites.net/fabric-react/master/#/examples/button
  */
 export default class TodoForm extends BaseComponent<ITodoFormProps, ITodoFormState> {
-  private _textField: RefObject<ITextField> = createRef<ITextField>();
+  private _textField = createRef<ITextField>();
 
   constructor(props: ITodoFormProps) {
     super(props);
diff --git a/ghdocs/BESTPRACTICES.md b/ghdocs/BESTPRACTICES.md
index 65ebc5fd24ec6..3867d7b849df8 100644
--- a/ghdocs/BESTPRACTICES.md
+++ b/ghdocs/BESTPRACTICES.md
@@ -174,10 +174,10 @@ public render() {
 
 Best, use createRef:
 ```typescript
-import { createRef, RefObject } from 'office-ui-fabric-react/lib/Utilities';
+import { createRef } from 'office-ui-fabric-react/lib/Utilities';
 
 class Foo extends BaseComponent<...> {
-  private _root: RefObject<HTMLElement> = createRef<HTMLElement>();
+  private _root = createRef<HTMLElement>();
 
   public render() {
     return <div ref={ _root } />;
diff --git a/packages/example-app-base/src/components/Highlight/Highlight.tsx b/packages/example-app-base/src/components/Highlight/Highlight.tsx
index 7e5e981c98a06..c11c2a5993fd4 100644
--- a/packages/example-app-base/src/components/Highlight/Highlight.tsx
+++ b/packages/example-app-base/src/components/Highlight/Highlight.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { registerLanguage, highlightBlock } from 'highlight.js';
 import * as javascript from 'highlight.js/lib/languages/javascript';
 import { BaseComponent } from 'office-ui-fabric-react/lib/Utilities';
-import { RefObject, createRef } from '@uifabric/utilities/lib/createRef';
+import { createRef } from '@uifabric/utilities/lib/createRef';
 
 registerLanguage('javascript', javascript);
 
@@ -11,7 +11,7 @@ export interface IHighlightProps extends React.HTMLAttributes<HTMLDivElement> {
 }
 
 export class Highlight extends BaseComponent<IHighlightProps, {}> {
-  private _codeElement: RefObject<HTMLElement> = createRef<HTMLElement>();
+  private _codeElement = createRef<HTMLElement>();
 
   public render(): JSX.Element {
     return (
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.base.tsx b/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
index ea07b896abe91..ebebfacc0fa62 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
@@ -18,8 +18,7 @@ import { ResizeGroup, IResizeGroup } from 'office-ui-fabric-react/lib/ResizeGrou
 import { TooltipHost } from 'office-ui-fabric-react/lib/Tooltip';
 import {
   classNamesFunction,
-  createRef,
-  RefObject
+  createRef
 } from '../../Utilities';
 
 const getClassNames = classNamesFunction<ICommandBarStyleProps, ICommandBarStyles>();
@@ -56,8 +55,8 @@ export class CommandBarBase extends BaseComponent<ICommandBarProps, {}> implemen
     elipisisIconProps: { iconName: 'More' }
   };
 
-  private _overflowSet: RefObject<IOverflowSet> = createRef<IOverflowSet>();
-  private _resizeGroup: RefObject<IResizeGroup> = createRef<IResizeGroup>();
+  private _overflowSet = createRef<IOverflowSet>();
+  private _resizeGroup = createRef<IResizeGroup>();
   private _classNames: {[key in keyof ICommandBarStyles]: string };
 
   public render(): JSX.Element {
diff --git a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
index 5767a8170ce64..e7457593e83e8 100644
--- a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
+++ b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
@@ -5,8 +5,7 @@ import {
   autobind,
   css,
   getRTL,
-  createRef,
-  RefObject
+  createRef
 } from '../../Utilities';
 import { Callout, DirectionalHint } from 'office-ui-fabric-react/lib/Callout';
 import { Suggestions, ISuggestionsProps, SuggestionsController, IBasePickerSuggestionsProps, ISuggestionModel }
@@ -32,8 +31,8 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
   implements IBaseFloatingPicker {
   protected selection: Selection;
 
-  protected root: RefObject<HTMLDivElement> = createRef<HTMLDivElement>();
-  protected suggestionElement: RefObject<Suggestions<T>> = createRef<Suggestions<T>>();
+  protected root = createRef<HTMLDivElement>();
+  protected suggestionElement = createRef<Suggestions<T>>();
 
   protected suggestionStore: SuggestionsController<T>;
   protected SuggestionOfProperType: new (props: ISuggestionsProps<T>) => Suggestions<T> =
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx
index c88b0d72ea96f..77b3c9fe43d6b 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx
@@ -9,8 +9,7 @@ import {
   getNativeProps,
   inputProperties,
   css,
-  createRef,
-  RefObject
+  createRef
 } from '../../../../Utilities';
 import { FloatingPeoplePicker, IBaseFloatingPickerProps } from '../../../../FloatingPicker';
 import { ISelectedPeopleItemProps } from '../SelectedPeopleList';
@@ -33,7 +32,7 @@ export interface IEditingSelectedPeopleItemProps extends ISelectedPeopleItemProp
 
 export class EditingItem extends BaseComponent<IEditingSelectedPeopleItemProps, IPeoplePickerItemState> {
   private _editingInput: HTMLInputElement;
-  private _editingFloatingPicker: RefObject<FloatingPeoplePicker> = createRef<FloatingPeoplePicker>();
+  private _editingFloatingPicker = createRef<FloatingPeoplePicker>();
   private _onRenderFloatingPicker: (props: IBaseFloatingPickerProps<IExtendedPersonaProps>) => JSX.Element;
   private _floatingPickerProps: IBaseFloatingPickerProps<IExtendedPersonaProps>;
 
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx
index e14a427f8850d..296b6cf76819b 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/ExtendedSelectedItem.tsx
@@ -1,7 +1,7 @@
 /* tslint:disable */
 import * as React from 'react';
 /* tslint:enable */
-import { BaseComponent, css, getId, createRef, RefObject } from '../../../../Utilities';
+import { BaseComponent, css, getId, createRef } from '../../../../Utilities';
 import { Persona, PersonaSize } from 'office-ui-fabric-react/lib/Persona';
 import { ISelectedPeopleItemProps } from '../SelectedPeopleList';
 import { IconButton } from 'office-ui-fabric-react/lib/Button';
@@ -14,7 +14,7 @@ export interface IPeoplePickerItemState {
 }
 
 export class ExtendedSelectedItem extends BaseComponent<ISelectedPeopleItemProps, IPeoplePickerItemState> {
-  protected persona: RefObject<HTMLDivElement> = createRef<HTMLDivElement>();
+  protected persona = createRef<HTMLDivElement>();
 
   constructor(props: ISelectedPeopleItemProps) {
     super(props);
diff --git a/packages/experiments/src/components/VirtualizedList/VirtualizedList.tsx b/packages/experiments/src/components/VirtualizedList/VirtualizedList.tsx
index 070e148e556ba..75d6c43b68243 100644
--- a/packages/experiments/src/components/VirtualizedList/VirtualizedList.tsx
+++ b/packages/experiments/src/components/VirtualizedList/VirtualizedList.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { IVirtualizedListProps } from './VirtualizedList.types';
 import { IScrollContainerContext, ScrollContainerContextTypes } from '../../utilities/scrolling/ScrollContainer';
 import { IObjectWithKey } from 'office-ui-fabric-react/lib/Selection';
-import { BaseComponent, getParent, css, autobind, createRef, RefObject } from 'office-ui-fabric-react/lib/Utilities';
+import { BaseComponent, getParent, css, autobind, createRef } from 'office-ui-fabric-react/lib/Utilities';
 
 interface IRange {
   /** Start of range */
@@ -26,7 +26,7 @@ export class VirtualizedList<TItem extends IObjectWithKey> extends BaseComponent
   public static contextTypes: typeof ScrollContainerContextTypes = ScrollContainerContextTypes;
   public context: IScrollContainerContext;
 
-  private _root: RefObject<HTMLDivElement> = createRef<HTMLDivElement>();
+  private _root = createRef<HTMLDivElement>();
 
   private _spacerElements: { [key: string]: HTMLElement } = {};
 
diff --git a/packages/office-ui-fabric-react-tslint/tslint.json b/packages/office-ui-fabric-react-tslint/tslint.json
index 0fcb71bed6ed9..0300b096b8ab9 100644
--- a/packages/office-ui-fabric-react-tslint/tslint.json
+++ b/packages/office-ui-fabric-react-tslint/tslint.json
@@ -50,8 +50,7 @@
       "call-signature",
       "parameter",
       "arrow-parameter",
-      "property-declaration",
-      "member-variable-declaration"
+      "property-declaration"
     ],
     "prefer-const": true,
     "quotemark": [
diff --git a/packages/utilities/src/DelayedRender.tsx b/packages/utilities/src/DelayedRender.tsx
index cef9fa5b35bea..5d3f74d003fd3 100644
--- a/packages/utilities/src/DelayedRender.tsx
+++ b/packages/utilities/src/DelayedRender.tsx
@@ -32,7 +32,6 @@ export interface IDelayedRenderState {
  * @public
  */
 export class DelayedRender extends React.Component<IDelayedRenderProps, IDelayedRenderState> {
-  // tslint:disable-next-line:typedef
   public static defaultProps = {
     delay: 0
   };

From 04e68a84dcf2226cec62010260ea26d955174305 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 10 Mar 2018 22:46:13 -0800
Subject: [PATCH 1546/1641] Delete
 hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json

---
 ...ix-ContextMenu-sample-styles_2018-03-06-19-11.json | 11 -----------
 1 file changed, 11 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json

diff --git a/common/changes/@uifabric/example-app-base/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json b/common/changes/@uifabric/example-app-base/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
deleted file mode 100644
index d14999673285a..0000000000000
--- a/common/changes/@uifabric/example-app-base/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/example-app-base",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "v-jojanz@microsoft.com"
-}
\ No newline at end of file

From 30da06106cb4e2ecc2fdb15a4a17b088ccc4fa03 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 10 Mar 2018 22:46:25 -0800
Subject: [PATCH 1547/1641] Delete
 magellan-fixDetailsListFocusTest_2018-02-24-00-36.json

---
 ...llan-fixDetailsListFocusTest_2018-02-24-00-36.json | 11 -----------
 1 file changed, 11 deletions(-)
 delete mode 100644 common/changes/@uifabric/file-type-icons/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json

diff --git a/common/changes/@uifabric/file-type-icons/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json b/common/changes/@uifabric/file-type-icons/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
deleted file mode 100644
index 88e044fe064bf..0000000000000
--- a/common/changes/@uifabric/file-type-icons/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/file-type-icons",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/file-type-icons",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file

From 5c8f14ad285aa19687fe5e611261275db1ed95a9 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 10 Mar 2018 22:46:37 -0800
Subject: [PATCH 1548/1641] Delete
 hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json

---
 ...ix-ContextMenu-sample-styles_2018-03-06-19-11.json | 11 -----------
 1 file changed, 11 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json

diff --git a/common/changes/@uifabric/styling/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json b/common/changes/@uifabric/styling/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
deleted file mode 100644
index e660e9b6e93e4..0000000000000
--- a/common/changes/@uifabric/styling/hotfix-ContextMenu-sample-styles_2018-03-06-19-11.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "v-jojanz@microsoft.com"
-}
\ No newline at end of file

From ead15bdb0e5fde12a79e84ec09f215613efc3db4 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 10 Mar 2018 22:46:55 -0800
Subject: [PATCH 1549/1641] Delete
 magellan-fixDetailsListFocusTest_2018-02-24-00-36.json

---
 ...llan-fixDetailsListFocusTest_2018-02-24-00-36.json | 11 -----------
 1 file changed, 11 deletions(-)
 delete mode 100644 common/changes/@uifabric/styling/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json

diff --git a/common/changes/@uifabric/styling/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json b/common/changes/@uifabric/styling/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
deleted file mode 100644
index e9c457b38d420..0000000000000
--- a/common/changes/@uifabric/styling/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/styling",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file

From 2d0f16840fe10fa05be94ba56d5a290c2740731c Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 10 Mar 2018 22:47:16 -0800
Subject: [PATCH 1550/1641] Delete
 magellan-fixDetailsListFocusTest_2018-02-24-00-36.json

---
 ...llan-fixDetailsListFocusTest_2018-02-24-00-36.json | 11 -----------
 1 file changed, 11 deletions(-)
 delete mode 100644 common/changes/@uifabric/variants/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json

diff --git a/common/changes/@uifabric/variants/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json b/common/changes/@uifabric/variants/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
deleted file mode 100644
index 0b9da8cd27d93..0000000000000
--- a/common/changes/@uifabric/variants/magellan-fixDetailsListFocusTest_2018-02-24-00-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "@uifabric/variants",
-      "type": "none"
-    }
-  ],
-  "packageName": "@uifabric/variants",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file

From fa97fa979c83ce8b9c67ca0dbb51ffe49e20b1b4 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 10 Mar 2018 22:48:35 -0800
Subject: [PATCH 1551/1641] Update
 non-optional-details-list-on-column-click_2018-03-09-20-51.json

---
 ...ptional-details-list-on-column-click_2018-03-09-20-51.json | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/common/changes/office-ui-fabric-react/non-optional-details-list-on-column-click_2018-03-09-20-51.json b/common/changes/office-ui-fabric-react/non-optional-details-list-on-column-click_2018-03-09-20-51.json
index 39abd3f9d3c1d..c843eeff1966a 100644
--- a/common/changes/office-ui-fabric-react/non-optional-details-list-on-column-click_2018-03-09-20-51.json
+++ b/common/changes/office-ui-fabric-react/non-optional-details-list-on-column-click_2018-03-09-20-51.json
@@ -2,10 +2,10 @@
   "changes": [
     {
       "packageName": "office-ui-fabric-react",
-      "comment": "Made DetailsList's onColumnClick's args non-optional",
+      "comment": "DetailsList: IColumn `onColumnClick` callback args marked non-optional.",
       "type": "minor"
     }
   ],
   "packageName": "office-ui-fabric-react",
   "email": "jogol@microsoft.com"
-}
\ No newline at end of file
+}

From a3841913dd420f50f9a04cdd56676aa9f4f0fd89 Mon Sep 17 00:00:00 2001
From: Christian Gonzalez <christianjordangonzalez@gmail.com>
Date: Sat, 10 Mar 2018 22:52:05 -0800
Subject: [PATCH 1552/1641] Try to use the system Segoe UI by default instead
 of downloading a web font (#4206)

* By default, use the system segoe-ui

* Fix it more consistently

* Rush change

* Snapshot updates

* Make it work for IE and Edge as well.

* Update snapshots

* Add some snapshots for the before state of createFontStyles

* Refactor #1

* Update default font styles

* Another refactor

* Remove unused import

* Update snapshot
---
 ...-system-font-default_2018-03-07-19-33.json |  11 +
 .../__snapshots__/CommandBar.test.tsx.snap    |   4 +-
 .../__snapshots__/ActivityItem.test.tsx.snap  |  18 +-
 .../__snapshots__/Breadcrumb.test.tsx.snap    |   2 +-
 .../Button/__snapshots__/Button.test.tsx.snap |  12 +-
 .../__snapshots__/ColorPicker.test.tsx.snap   |   2 +-
 .../__snapshots__/ComboBox.test.tsx.snap      |   4 +-
 .../Dialog/__snapshots__/Dialog.test.tsx.snap |   2 +-
 .../__snapshots__/Facepile.test.tsx.snap      |   2 +-
 .../Nav/__snapshots__/Nav.test.tsx.snap       |   2 +-
 .../Pivot/__snapshots__/Pivot.test.tsx.snap   |   4 +-
 .../__snapshots__/SearchBox.test.tsx.snap     |   2 +-
 .../__snapshots__/SpinButton.test.tsx.snap    |   4 +-
 .../SwatchColorPicker.test.tsx.snap           |  24 +-
 packages/styling/package.json                 |   3 +-
 .../styling/src/styles/DefaultFontStyles.ts   |  19 +-
 .../styles/__snapshots__/fonts.test.ts.snap   | 247 ++++++++++++++++++
 packages/styling/src/styles/fonts.test.ts     |  15 ++
 packages/styling/src/styles/fonts.ts          |  59 +++--
 19 files changed, 367 insertions(+), 69 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/chrisgo-system-font-default_2018-03-07-19-33.json
 create mode 100644 packages/styling/src/styles/__snapshots__/fonts.test.ts.snap
 create mode 100644 packages/styling/src/styles/fonts.test.ts

diff --git a/common/changes/@uifabric/styling/chrisgo-system-font-default_2018-03-07-19-33.json b/common/changes/@uifabric/styling/chrisgo-system-font-default_2018-03-07-19-33.json
new file mode 100644
index 0000000000000..a96f71246a551
--- /dev/null
+++ b/common/changes/@uifabric/styling/chrisgo-system-font-default_2018-03-07-19-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "By default, try to use the system font before downloading a web font",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "christianjordangonzalez@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap b/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
index fc2bf3471f617..31a3fe9326de1 100644
--- a/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
+++ b/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
@@ -70,7 +70,7 @@ exports[`CommandBar renders commands correctly 1`] = `
                   color: #333333;
                   cursor: pointer;
                   display: inline-block;
-                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
                   font-size: 14px;
                   font-weight: 400;
                   height: 100%;
@@ -171,7 +171,7 @@ exports[`CommandBar renders commands correctly 1`] = `
                   color: #333333;
                   cursor: pointer;
                   display: inline-block;
-                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
                   font-size: 14px;
                   font-weight: 400;
                   height: 100%;
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap
index 66f878bbda3b8..286b79f76ca97 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap
@@ -11,7 +11,7 @@ exports[`ActivityItem renders compact with a single persona correctly 1`] = `
         box-sizing: border-box;
         color: #666666;
         display: flex;
-        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
         font-size: 12px;
         font-weight: 400;
         justify-content: flex-start;
@@ -163,7 +163,7 @@ exports[`ActivityItem renders compact with an icon correctly 1`] = `
         box-sizing: border-box;
         color: #666666;
         display: flex;
-        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
         font-size: 12px;
         font-weight: 400;
         justify-content: flex-start;
@@ -242,7 +242,7 @@ exports[`ActivityItem renders compact with multiple personas correctly 1`] = `
         box-sizing: border-box;
         color: #666666;
         display: flex;
-        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
         font-size: 12px;
         font-weight: 400;
         justify-content: flex-start;
@@ -519,7 +519,7 @@ exports[`ActivityItem renders with a single persona correctly 1`] = `
         box-sizing: border-box;
         color: #666666;
         display: flex;
-        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
         font-size: 12px;
         font-weight: 400;
         justify-content: flex-start;
@@ -651,7 +651,7 @@ exports[`ActivityItem renders with a single persona correctly 1`] = `
             -moz-osx-font-smoothing: grayscale;
             -webkit-font-smoothing: antialiased;
             color: #666666;
-            font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+            font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
             font-size: 10px;
             font-weight: 400;
           }
@@ -673,7 +673,7 @@ exports[`ActivityItem renders with an icon correctly 1`] = `
         box-sizing: border-box;
         color: #666666;
         display: flex;
-        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
         font-size: 12px;
         font-weight: 400;
         justify-content: flex-start;
@@ -741,7 +741,7 @@ exports[`ActivityItem renders with an icon correctly 1`] = `
             -moz-osx-font-smoothing: grayscale;
             -webkit-font-smoothing: antialiased;
             color: #666666;
-            font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+            font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
             font-size: 10px;
             font-weight: 400;
           }
@@ -763,7 +763,7 @@ exports[`ActivityItem renders with multiple personas correctly 1`] = `
         box-sizing: border-box;
         color: #666666;
         display: flex;
-        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
         font-size: 12px;
         font-weight: 400;
         justify-content: flex-start;
@@ -1055,7 +1055,7 @@ exports[`ActivityItem renders with multiple personas correctly 1`] = `
             -moz-osx-font-smoothing: grayscale;
             -webkit-font-smoothing: antialiased;
             color: #666666;
-            font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+            font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
             font-size: 10px;
             font-weight: 400;
           }
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
index c8203ad83af05..bb6e270d861e7 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
@@ -213,7 +213,7 @@ exports[`Breadcrumb renders breadcumb correctly 2`] = `
                     box-sizing: border-box;
                     cursor: pointer;
                     display: inline-block;
-                    font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                    font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
                     font-size: 14px;
                     font-weight: 400;
                     height: 32px;
diff --git a/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
index c2803b1370a6b..442ee99480d23 100644
--- a/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
@@ -20,7 +20,7 @@ exports[`Button renders ActionButton correctly 1`] = `
         color: #333333;
         cursor: pointer;
         display: inline-block;
-        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
         font-size: 14px;
         font-weight: 400;
         height: 40px;
@@ -124,7 +124,7 @@ exports[`Button renders CommandBarButton correctly 1`] = `
         color: #333333;
         cursor: pointer;
         display: inline-block;
-        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
         font-size: 14px;
         font-weight: 400;
         min-width: 40px;
@@ -270,7 +270,7 @@ exports[`Button renders CompoundButton correctly 1`] = `
         color: #333333;
         cursor: pointer;
         display: inline-block;
-        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
         font-size: 14px;
         font-weight: 400;
         height: auto;
@@ -366,7 +366,7 @@ exports[`Button renders CompoundButton correctly 1`] = `
               -moz-osx-font-smoothing: grayscale;
               -webkit-font-smoothing: antialiased;
               color: #666666;
-              font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+              font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
               font-size: 12px;
               font-weight: 400;
               line-height: 100%;
@@ -399,7 +399,7 @@ exports[`Button renders DefaultButton correctly 1`] = `
         color: #333333;
         cursor: pointer;
         display: inline-block;
-        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
         font-size: 14px;
         font-weight: 400;
         height: 32px;
@@ -497,7 +497,7 @@ exports[`Button renders IconButton correctly 1`] = `
         box-sizing: border-box;
         cursor: pointer;
         display: inline-block;
-        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
         font-size: 14px;
         font-weight: 400;
         height: 32px;
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/__snapshots__/ColorPicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ColorPicker/__snapshots__/ColorPicker.test.tsx.snap
index 0776b8f363c6d..004797c12984c 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/__snapshots__/ColorPicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/__snapshots__/ColorPicker.test.tsx.snap
@@ -85,7 +85,7 @@ exports[`ColorPicker renders ColorPicker correctly 1`] = `
               {
                 -moz-osx-font-smoothing: grayscale;
                 -webkit-font-smoothing: antialiased;
-                font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
                 font-size: 12px;
                 font-weight: 400;
               }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
index fb135d862487e..330abb513c2b7 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
@@ -20,7 +20,7 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
           color: #333333;
           cursor: text;
           display: block;
-          font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+          font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
           font-size: 14px;
           font-weight: 400;
           height: 32px;
@@ -173,7 +173,7 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
             color: #666666;
             cursor: default;
             display: inline-block;
-            font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+            font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
             font-size: 12px;
             font-weight: 400;
             height: 32px;
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/__snapshots__/Dialog.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Dialog/__snapshots__/Dialog.test.tsx.snap
index 1d89aeb736a69..5735242152970 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/__snapshots__/Dialog.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Dialog/__snapshots__/Dialog.test.tsx.snap
@@ -22,7 +22,7 @@ exports[`Dialog renders Dialog correctly 1`] = `
             -moz-osx-font-smoothing: grayscale;
             -webkit-font-smoothing: antialiased;
             color: #333333;
-            font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+            font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
             font-size: 21px;
             font-weight: 100;
             margin-bottom: 0;
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
index 8bdfa8825b719..fcbd96a681aec 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
@@ -150,7 +150,7 @@ exports[`Facepile renders Facepile correctly 1`] = `
               box-sizing: border-box;
               cursor: pointer;
               display: inline-block;
-              font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+              font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
               font-size: 14px;
               font-weight: 400;
               outline: transparent;
diff --git a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
index 7434557381e4b..3da206e72ab4f 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
@@ -94,7 +94,7 @@ exports[`Nav renders Nav correctly 1`] = `
                       color: #333333;
                       cursor: pointer;
                       display: block;
-                      font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                      font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
                       font-size: 14px;
                       font-weight: 400;
                       height: 36px;
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap
index 900e43e349f3e..264a0b9749676 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap
@@ -39,7 +39,7 @@ exports[`Pivot renders Pivot correctly 1`] = `
               color: #333333;
               cursor: pointer;
               display: inline-block;
-              font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+              font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
               font-size: 14px;
               font-weight: 400;
               height: 40px;
@@ -133,7 +133,7 @@ exports[`Pivot renders Pivot correctly 1`] = `
               color: #333333;
               cursor: pointer;
               display: inline-block;
-              font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+              font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
               font-size: 14px;
               font-weight: 400;
               height: 40px;
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
index d6746105d91f8..a440cb5d7a379 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
@@ -15,7 +15,7 @@ exports[`SearchBox renders SearchBox correctly 1`] = `
         display: flex;
         flex-direction: row;
         flex-wrap: nowrap;
-        font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+        font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
         font-size: 14px;
         font-weight: 400;
         height: 32px;
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
index 00e7e210848b5..8ce88ee3d736a 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
@@ -167,7 +167,7 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
               color: #333333;
               cursor: default;
               display: block;
-              font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+              font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
               font-size: 14px;
               font-weight: 400;
               height: 50%;
@@ -272,7 +272,7 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
               color: #333333;
               cursor: default;
               display: block;
-              font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+              font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
               font-size: 14px;
               font-weight: 400;
               height: 50%;
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
index a633d7740fa85..836f6122dc63b 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
@@ -71,7 +71,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   color: #333333;
                   cursor: pointer;
                   display: inline-block;
-                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
                   font-size: 14px;
                   font-weight: 400;
                   height: 40px;
@@ -256,7 +256,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   color: #333333;
                   cursor: pointer;
                   display: inline-block;
-                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
                   font-size: 14px;
                   font-weight: 400;
                   height: 40px;
@@ -441,7 +441,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   color: #333333;
                   cursor: pointer;
                   display: inline-block;
-                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
                   font-size: 14px;
                   font-weight: 400;
                   height: 40px;
@@ -626,7 +626,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   color: #333333;
                   cursor: pointer;
                   display: inline-block;
-                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
                   font-size: 14px;
                   font-weight: 400;
                   height: 40px;
@@ -815,7 +815,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   color: #333333;
                   cursor: pointer;
                   display: inline-block;
-                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
                   font-size: 14px;
                   font-weight: 400;
                   height: 40px;
@@ -1000,7 +1000,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   color: #333333;
                   cursor: pointer;
                   display: inline-block;
-                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
                   font-size: 14px;
                   font-weight: 400;
                   height: 40px;
@@ -1185,7 +1185,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   color: #333333;
                   cursor: pointer;
                   display: inline-block;
-                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
                   font-size: 14px;
                   font-weight: 400;
                   height: 40px;
@@ -1370,7 +1370,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   color: #333333;
                   cursor: pointer;
                   display: inline-block;
-                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
                   font-size: 14px;
                   font-weight: 400;
                   height: 40px;
@@ -1559,7 +1559,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   color: #333333;
                   cursor: pointer;
                   display: inline-block;
-                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
                   font-size: 14px;
                   font-weight: 400;
                   height: 40px;
@@ -1744,7 +1744,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   color: #333333;
                   cursor: pointer;
                   display: inline-block;
-                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
                   font-size: 14px;
                   font-weight: 400;
                   height: 40px;
@@ -1929,7 +1929,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   color: #333333;
                   cursor: pointer;
                   display: inline-block;
-                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
                   font-size: 14px;
                   font-weight: 400;
                   height: 40px;
@@ -2114,7 +2114,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   color: #333333;
                   cursor: pointer;
                   display: inline-block;
-                  font-family: 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
+                  font-family: 'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif;
                   font-size: 14px;
                   font-weight: 400;
                   height: 40px;
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 0795556f43025..73965a07b12c0 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -13,7 +13,8 @@
     "build": "node ../../scripts/build.js",
     "clean": "node ../../scripts/clean.js",
     "start": "node ../../scripts/start.js",
-    "start-test": "node ../../scripts/start-test.js"
+    "start-test": "node ../../scripts/start-test.js",
+    "update-snapshots": "node ../../scripts/build.js jest -u"
   },
   "devDependencies": {
     "@types/webpack-env": "1.13.0",
diff --git a/packages/styling/src/styles/DefaultFontStyles.ts b/packages/styling/src/styles/DefaultFontStyles.ts
index 6e086a503ac93..cea5135d3e0a9 100644
--- a/packages/styling/src/styles/DefaultFontStyles.ts
+++ b/packages/styling/src/styles/DefaultFontStyles.ts
@@ -18,13 +18,17 @@ export const DefaultFontStyles: IFontStyles = createFontStyles(getLanguage());
 function _registerFontFace(
   fontFamily: string,
   url: string,
-  fontWeight?: IFontWeight
+  fontWeight?: IFontWeight,
+  localFontName?: string
 ): void {
   fontFamily = `'${fontFamily}'`;
 
+  const localFontSrc = localFontName !== undefined ? `local('${localFontName}'),` : '';
+
   fontFace({
     fontFamily,
     src:
+      localFontSrc +
       `url('${url}.woff2') format('woff2'),` +
       `url('${url}.woff') format('woff')`,
     fontWeight,
@@ -36,14 +40,15 @@ function _registerFontFaceSet(
   baseUrl: string,
   fontFamily: string,
   cdnFolder: string,
-  cdnFontName: string = 'segoeui'
+  cdnFontName: string = 'segoeui',
+  localFontName?: string
 ): void {
   const urlBase = `${baseUrl}/${cdnFolder}/${cdnFontName}`;
 
-  _registerFontFace(fontFamily, urlBase + '-light', FontWeights.light);
-  _registerFontFace(fontFamily, urlBase + '-semilight', FontWeights.semilight);
-  _registerFontFace(fontFamily, urlBase + '-regular', FontWeights.regular);
-  _registerFontFace(fontFamily, urlBase + '-semibold', FontWeights.semibold);
+  _registerFontFace(fontFamily, urlBase + '-light', FontWeights.light, localFontName && localFontName + ' Light');
+  _registerFontFace(fontFamily, urlBase + '-semilight', FontWeights.semilight, localFontName && localFontName + ' SemiLight');
+  _registerFontFace(fontFamily, urlBase + '-regular', FontWeights.regular, localFontName);
+  _registerFontFace(fontFamily, urlBase + '-semibold', FontWeights.semibold, localFontName && localFontName + ' SemiBold');
 }
 
 export function registerDefaultFontFaces(baseUrl: string): void {
@@ -58,7 +63,7 @@ export function registerDefaultFontFaces(baseUrl: string): void {
     _registerFontFaceSet(fontUrl, LocalizedFontNames.Greek, 'segoeui-greek');
     _registerFontFaceSet(fontUrl, LocalizedFontNames.Hebrew, 'segoeui-hebrew');
     _registerFontFaceSet(fontUrl, LocalizedFontNames.Vietnamese, 'segoeui-vietnamese');
-    _registerFontFaceSet(fontUrl, LocalizedFontNames.WestEuropean, 'segoeui-westeuropean');
+    _registerFontFaceSet(fontUrl, LocalizedFontNames.WestEuropean, 'segoeui-westeuropean', 'segoeui', 'Segoe UI');
     _registerFontFaceSet(fontUrl, LocalizedFontFamilies.Selawik, 'selawik', 'selawik');
 
     // Leelawadee UI (Thai) does not have a 'light' weight, so we override
diff --git a/packages/styling/src/styles/__snapshots__/fonts.test.ts.snap b/packages/styling/src/styles/__snapshots__/fonts.test.ts.snap
new file mode 100644
index 0000000000000..15a77d38d6077
--- /dev/null
+++ b/packages/styling/src/styles/__snapshots__/fonts.test.ts.snap
@@ -0,0 +1,247 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`fonts tests creates the correct font styles for ar 1`] = `
+Object {
+  "large": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Segoe UI Web (Arabic)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "17px",
+    "fontWeight": 300,
+  },
+  "medium": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Segoe UI Web (Arabic)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "14px",
+    "fontWeight": 400,
+  },
+  "mediumPlus": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Segoe UI Web (Arabic)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "15px",
+    "fontWeight": 400,
+  },
+  "mega": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Segoe UI Web (Arabic)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "72px",
+    "fontWeight": 100,
+  },
+  "small": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Segoe UI Web (Arabic)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "12px",
+    "fontWeight": 400,
+  },
+  "smallPlus": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Segoe UI Web (Arabic)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "13px",
+    "fontWeight": 400,
+  },
+  "superLarge": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Segoe UI Web (Arabic)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "42px",
+    "fontWeight": 100,
+  },
+  "tiny": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Segoe UI Web (Arabic)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "10px",
+    "fontWeight": 600,
+  },
+  "xLarge": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Segoe UI Web (Arabic)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "21px",
+    "fontWeight": 100,
+  },
+  "xSmall": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Segoe UI Web (Arabic)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "11px",
+    "fontWeight": 400,
+  },
+  "xxLarge": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Segoe UI Web (Arabic)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "28px",
+    "fontWeight": 100,
+  },
+}
+`;
+
+exports[`fonts tests creates the correct font styles for en 1`] = `
+Object {
+  "large": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "17px",
+    "fontWeight": 300,
+  },
+  "medium": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "14px",
+    "fontWeight": 400,
+  },
+  "mediumPlus": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "15px",
+    "fontWeight": 400,
+  },
+  "mega": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "72px",
+    "fontWeight": 100,
+  },
+  "small": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "12px",
+    "fontWeight": 400,
+  },
+  "smallPlus": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "13px",
+    "fontWeight": 400,
+  },
+  "superLarge": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "42px",
+    "fontWeight": 100,
+  },
+  "tiny": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "10px",
+    "fontWeight": 600,
+  },
+  "xLarge": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "21px",
+    "fontWeight": 100,
+  },
+  "xSmall": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "11px",
+    "fontWeight": 400,
+  },
+  "xxLarge": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "28px",
+    "fontWeight": 100,
+  },
+}
+`;
+
+exports[`fonts tests creates the correct font styles for ja 1`] = `
+Object {
+  "large": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Yu Gothic UI', 'Meiryo UI', Meiryo, 'MS Pgothic', Osaka, 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "17px",
+    "fontWeight": 300,
+  },
+  "medium": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Yu Gothic UI', 'Meiryo UI', Meiryo, 'MS Pgothic', Osaka, 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "14px",
+    "fontWeight": 400,
+  },
+  "mediumPlus": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Yu Gothic UI', 'Meiryo UI', Meiryo, 'MS Pgothic', Osaka, 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "15px",
+    "fontWeight": 400,
+  },
+  "mega": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Yu Gothic UI', 'Meiryo UI', Meiryo, 'MS Pgothic', Osaka, 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "72px",
+    "fontWeight": 100,
+  },
+  "small": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Yu Gothic UI', 'Meiryo UI', Meiryo, 'MS Pgothic', Osaka, 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "12px",
+    "fontWeight": 400,
+  },
+  "smallPlus": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Yu Gothic UI', 'Meiryo UI', Meiryo, 'MS Pgothic', Osaka, 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "13px",
+    "fontWeight": 400,
+  },
+  "superLarge": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Yu Gothic UI', 'Meiryo UI', Meiryo, 'MS Pgothic', Osaka, 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "42px",
+    "fontWeight": 100,
+  },
+  "tiny": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Yu Gothic UI', 'Meiryo UI', Meiryo, 'MS Pgothic', Osaka, 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "10px",
+    "fontWeight": 600,
+  },
+  "xLarge": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Yu Gothic UI', 'Meiryo UI', Meiryo, 'MS Pgothic', Osaka, 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "21px",
+    "fontWeight": 100,
+  },
+  "xSmall": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Yu Gothic UI', 'Meiryo UI', Meiryo, 'MS Pgothic', Osaka, 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "11px",
+    "fontWeight": 400,
+  },
+  "xxLarge": Object {
+    "MozOsxFontSmoothing": "grayscale",
+    "WebkitFontSmoothing": "antialiased",
+    "fontFamily": "'Yu Gothic UI', 'Meiryo UI', Meiryo, 'MS Pgothic', Osaka, 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+    "fontSize": "28px",
+    "fontWeight": 100,
+  },
+}
+`;
diff --git a/packages/styling/src/styles/fonts.test.ts b/packages/styling/src/styles/fonts.test.ts
new file mode 100644
index 0000000000000..b2794ae4b0796
--- /dev/null
+++ b/packages/styling/src/styles/fonts.test.ts
@@ -0,0 +1,15 @@
+import { createFontStyles } from './fonts';
+
+describe('fonts tests', () => {
+  it('creates the correct font styles for en', () => {
+    expect(createFontStyles('en')).toMatchSnapshot();
+  });
+
+  it('creates the correct font styles for ar', () => {
+    expect(createFontStyles('ar')).toMatchSnapshot();
+  });
+
+  it('creates the correct font styles for ja', () => {
+    expect(createFontStyles('ja')).toMatchSnapshot();
+  });
+});
\ No newline at end of file
diff --git a/packages/styling/src/styles/fonts.ts b/packages/styling/src/styles/fonts.ts
index 8f796040dc7ec..25194c5aa90c7 100644
--- a/packages/styling/src/styles/fonts.ts
+++ b/packages/styling/src/styles/fonts.ts
@@ -40,6 +40,10 @@ export namespace LocalizedFontFamilies {
   export const WestEuropean = `'${LocalizedFontNames.WestEuropean}'`;
 }
 
+// By default, we favor system fonts for the default.
+// All localized fonts use a web font and never use the system font.
+const defaultFontFamily = `'Segoe UI', '${LocalizedFontNames.WestEuropean}'`;
+
 // Mapping of language prefix to to font family.
 const LanguageToFontMap = {
   'ar': LocalizedFontFamilies.Arabic,
@@ -101,39 +105,54 @@ export namespace IconFontSizes {
   export const large = '20px';
 }
 
+function _fontFamilyWithFallbacks(fontFamily: string): string {
+  return `${fontFamily}, ${FontFamilyFallbacks}`;
+}
+
 export function createFontStyles(localeCode: string | null): IFontStyles {
-  return {
-    tiny: _createFont(FontSizes.mini, FontWeights.semibold, localeCode),
-    xSmall: _createFont(FontSizes.xSmall, FontWeights.regular, localeCode),
-    small: _createFont(FontSizes.small, FontWeights.regular, localeCode),
-    smallPlus: _createFont(FontSizes.smallPlus, FontWeights.regular, localeCode),
-    medium: _createFont(FontSizes.medium, FontWeights.regular, localeCode),
-    mediumPlus: _createFont(FontSizes.mediumPlus, FontWeights.regular, localeCode),
-    large: _createFont(FontSizes.large, FontWeights.semilight, localeCode),
-    xLarge: _createFont(FontSizes.xLarge, FontWeights.light, localeCode),
-    xxLarge: _createFont(FontSizes.xxLarge, FontWeights.light, localeCode),
-    superLarge: _createFont(FontSizes.superLarge, FontWeights.light, localeCode),
-    mega: _createFont(FontSizes.mega, FontWeights.light, localeCode)
+  const localizedFont = _getLocalizedFontFamily(localeCode);
+  let fontFamilyWithFallback = _fontFamilyWithFallbacks(localizedFont);
+  let semilightFontFamilyWithFallback = fontFamilyWithFallback;
+
+  // Chrome has a bug where it does not render Segoe UI Semilight correctly, so we force the webfont to be used in that case
+  if (localizedFont === defaultFontFamily) {
+    semilightFontFamilyWithFallback = _fontFamilyWithFallbacks(LocalizedFontFamilies.WestEuropean);
+  }
+
+  const fontStyles = {
+    tiny: _createFont(FontSizes.mini, FontWeights.semibold, fontFamilyWithFallback),
+    xSmall: _createFont(FontSizes.xSmall, FontWeights.regular, fontFamilyWithFallback),
+    small: _createFont(FontSizes.small, FontWeights.regular, fontFamilyWithFallback),
+    smallPlus: _createFont(FontSizes.smallPlus, FontWeights.regular, fontFamilyWithFallback),
+    medium: _createFont(FontSizes.medium, FontWeights.regular, fontFamilyWithFallback),
+    mediumPlus: _createFont(FontSizes.mediumPlus, FontWeights.regular, fontFamilyWithFallback),
+    large: _createFont(FontSizes.large, FontWeights.semilight, semilightFontFamilyWithFallback),
+    xLarge: _createFont(FontSizes.xLarge, FontWeights.light, fontFamilyWithFallback),
+    xxLarge: _createFont(FontSizes.xxLarge, FontWeights.light, fontFamilyWithFallback),
+    superLarge: _createFont(FontSizes.superLarge, FontWeights.light, fontFamilyWithFallback),
+    mega: _createFont(FontSizes.mega, FontWeights.light, fontFamilyWithFallback)
   };
-}
 
-function _getFontFamily(language: string | null): string {
-  let fontFamily = LocalizedFontFamilies.WestEuropean;
+  return fontStyles;
+}
 
+/**
+ * If there is a localized font for this language, return that. Returns undefined if there is no localized font for that language.
+ */
+function _getLocalizedFontFamily(language: string | null): string {
   for (let lang in LanguageToFontMap) {
     if (LanguageToFontMap.hasOwnProperty(lang) && language && lang.indexOf(language) === 0) {
       // tslint:disable-next-line:no-any
-      fontFamily = (LanguageToFontMap as any)[lang];
-      break;
+      return (LanguageToFontMap as any)[lang];
     }
   }
 
-  return `${fontFamily}, ${FontFamilyFallbacks}`;
+  return defaultFontFamily;
 }
 
-function _createFont(size: string, weight: IFontWeight, localeCode: string | null): IRawStyle {
+function _createFont(size: string, weight: IFontWeight, fontFamily: string): IRawStyle {
   return {
-    fontFamily: _getFontFamily(localeCode),
+    fontFamily: fontFamily,
     MozOsxFontSmoothing: 'grayscale',
     WebkitFontSmoothing: 'antialiased',
     fontSize: size,

From 25c21f30d3db5303e3e4fe8bc79da829504cc1eb Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 10 Mar 2018 22:52:35 -0800
Subject: [PATCH 1553/1641] Update package.json

---
 scripts/package.json | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/scripts/package.json b/scripts/package.json
index 56b592bc62b67..d022cfbbeb145 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -49,7 +49,7 @@
   "bundlesize": [
     {
       "path": "../apps/test-bundle-button/dist/main.min.js",
-      "maxSize": "44.7 kB"
+      "maxSize": "44.8 kB"
     }
   ]
-}
\ No newline at end of file
+}

From feb4db4410cdd49d5df8a50fcef138fbcd324dc2 Mon Sep 17 00:00:00 2001
From: erichdev <a.erich@gmail.com>
Date: Sat, 10 Mar 2018 22:54:32 -0800
Subject: [PATCH 1554/1641] Styled: Add display name to styled wrapper (#4202)

* Add display name to returned function

* Add change file

* Set to name if displayName is undefined
---
 .../styledDisplayName_2018-03-07-00-54.json          | 11 +++++++++++
 packages/utilities/src/styled.tsx                    | 12 ++++++++++--
 2 files changed, 21 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/styledDisplayName_2018-03-07-00-54.json

diff --git a/common/changes/@uifabric/utilities/styledDisplayName_2018-03-07-00-54.json b/common/changes/@uifabric/utilities/styledDisplayName_2018-03-07-00-54.json
new file mode 100644
index 0000000000000..2ff42449232f1
--- /dev/null
+++ b/common/changes/@uifabric/utilities/styledDisplayName_2018-03-07-00-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Styled: Add display name to styled wrapper",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "erabelle@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/src/styled.tsx b/packages/utilities/src/styled.tsx
index ea65583e4cedc..db5e525ee0061 100644
--- a/packages/utilities/src/styled.tsx
+++ b/packages/utilities/src/styled.tsx
@@ -9,6 +9,11 @@ export interface IPropsWithStyles<TStyleProps, TStyles> {
   };
 }
 
+interface IWrappedComponent<P> {
+  (props: P): JSX.Element;
+  displayName: string;
+}
+
 /**
  * The styled HOC wrapper allows you to create a functional wrapper around a given component which will resolve
  * getStyles functional props, and mix customized props passed in using concatStyleSets. Example:
@@ -29,7 +34,7 @@ export function styled<TComponentProps extends IPropsWithStyles<TStyleProps, TSt
   getProps?: (props: TComponentProps) => Partial<TComponentProps>
 ): (props: TComponentProps) => JSX.Element {
 
-  return (componentProps: TComponentProps) => {
+  const Wrapped = ((componentProps: TComponentProps) => {
     const getStyles = (
       styleProps: TStyleProps
     ) => concatStyleSets(
@@ -45,5 +50,8 @@ export function styled<TComponentProps extends IPropsWithStyles<TStyleProps, TSt
         getStyles={ getStyles }
       />
     );
-  };
+  }) as IWrappedComponent<TComponentProps>;
+
+  Wrapped.displayName = `Styled${Component.displayName || Component.name}`;
+  return Wrapped;
 }

From 699fa697ae829e756108ce2b6725084d27e93f7e Mon Sep 17 00:00:00 2001
From: Spencer Lynn <sllynn8907@gmail.com>
Date: Sat, 10 Mar 2018 23:02:47 -0800
Subject: [PATCH 1555/1641] FocusTrapZone does not correctly trap focus when
 last child is FocusZone (#4172)

* When a FocusTrapZone has a FocusZone as a last child, focus escapes the trap zone when tabbing through. When calculating last tabbable element, consider the tabbable argument when navigating inside focus zones.

* Adding change files.

* Addressing comments.
---
 ...last-child-focuszone_2018-03-04-09-07.json | 11 +++
 ...last-child-focuszone_2018-03-04-09-07.json | 11 +++
 .../FocusTrapZone/FocusTrapZone.test.tsx      | 71 +++++++++++++++++++
 packages/utilities/src/focus.ts               | 17 ++---
 4 files changed, 102 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/focustrapzone-last-child-focuszone_2018-03-04-09-07.json
 create mode 100644 common/changes/office-ui-fabric-react/focustrapzone-last-child-focuszone_2018-03-04-09-07.json

diff --git a/common/changes/@uifabric/utilities/focustrapzone-last-child-focuszone_2018-03-04-09-07.json b/common/changes/@uifabric/utilities/focustrapzone-last-child-focuszone_2018-03-04-09-07.json
new file mode 100644
index 0000000000000..277dafdd7ae50
--- /dev/null
+++ b/common/changes/@uifabric/utilities/focustrapzone-last-child-focuszone_2018-03-04-09-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Focus utility getPreviousElement did not correctly consider the tabbable argument when considering the current node. This can affect how FocusZones are processed, since only one element in a zone will have tab index set. This, in turn, affects how FocusTrapZone traps focus, since getPreviousElement is used during trapping focus.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "sllynn8907@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/focustrapzone-last-child-focuszone_2018-03-04-09-07.json b/common/changes/office-ui-fabric-react/focustrapzone-last-child-focuszone_2018-03-04-09-07.json
new file mode 100644
index 0000000000000..7b6d929407403
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/focustrapzone-last-child-focuszone_2018-03-04-09-07.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Updating a test to ensure that focus is trapped in a FocusTrapZone when it has a FocusZone as the last element",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "sllynn8907@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.test.tsx
index d23d8fc60e7e1..9599f02be4c3d 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.test.tsx
@@ -239,4 +239,75 @@ describe('FocusTrapZone', () => {
     ReactTestUtils.Simulate.keyDown(buttonA, { which: KeyCodes.tab });
     expect(lastFocusedElement).toBe(buttonX);
   });
+
+  it('can tab across FocusZones with different button structures', () => {
+    const component = ReactTestUtils.renderIntoDocument(
+      <div { ...{ onFocusCapture: _onFocus } }>
+        <FocusTrapZone forceFocusInsideTrap={ false }>
+          <button className='a'>a</button>
+          <FocusZone direction={ FocusZoneDirection.horizontal } data-is-visible={ true }>
+            <button className='d'>d</button>
+            <button className='e'>e</button>
+            <button className='f'>f</button>
+          </FocusZone>
+        </FocusTrapZone>
+      </div>
+    );
+
+    const focusTrapZone = ReactDOM.findDOMNode(component as React.ReactInstance) as Element;
+
+    const buttonA = focusTrapZone.querySelector('.a') as HTMLElement;
+    const buttonD = focusTrapZone.querySelector('.d') as HTMLElement;
+    const buttonE = focusTrapZone.querySelector('.e') as HTMLElement;
+    const buttonF = focusTrapZone.querySelector('.f') as HTMLElement;
+
+    // Assign bounding locations to buttons.
+    setupElement(buttonA, {
+      clientRect: {
+        top: 0,
+        bottom: 30,
+        left: 0,
+        right: 30
+      }
+    });
+
+    setupElement(buttonD, {
+      clientRect: {
+        top: 30,
+        bottom: 60,
+        left: 0,
+        right: 30
+      }
+    });
+
+    setupElement(buttonE, {
+      clientRect: {
+        top: 30,
+        bottom: 60,
+        left: 30,
+        right: 60
+      }
+    });
+
+    setupElement(buttonF, {
+      clientRect: {
+        top: 30,
+        bottom: 60,
+        left: 60,
+        right: 90
+      }
+    });
+
+    // Focus the first button.
+    ReactTestUtils.Simulate.focus(buttonD);
+    expect(lastFocusedElement).toBe(buttonD);
+
+    // Pressing tab should go to a.
+    ReactTestUtils.Simulate.keyDown(buttonD, { which: KeyCodes.tab });
+    expect(lastFocusedElement).toBe(buttonA);
+
+    // Pressing shift + tab should go to a.
+    ReactTestUtils.Simulate.keyDown(buttonA, { which: KeyCodes.tab, shiftKey: true });
+    expect(lastFocusedElement).toBe(buttonD);
+  });
 });
diff --git a/packages/utilities/src/focus.ts b/packages/utilities/src/focus.ts
index c2dc853c6932c..e3f47ce9bd641 100644
--- a/packages/utilities/src/focus.ts
+++ b/packages/utilities/src/focus.ts
@@ -77,7 +77,7 @@ export function getPreviousElement(
   traverseChildren?: boolean,
   includeElementsInFocusZones?: boolean,
   allowFocusRoot?: boolean,
-  tabbable?: boolean): HTMLElement | null {
+  elementShouldBeTabbable?: boolean): HTMLElement | null {
 
   if (!currentElement ||
     (!allowFocusRoot && currentElement === rootElement)) {
@@ -97,10 +97,10 @@ export function getPreviousElement(
       true,
       includeElementsInFocusZones,
       allowFocusRoot,
-      tabbable);
+      elementShouldBeTabbable);
 
     if (childMatch) {
-      if ((tabbable && (isElementTabbable(childMatch, true))) || !tabbable) {
+      if ((elementShouldBeTabbable && isElementTabbable(childMatch, true)) || !elementShouldBeTabbable) {
         return childMatch;
       }
 
@@ -112,7 +112,7 @@ export function getPreviousElement(
         true,
         includeElementsInFocusZones,
         allowFocusRoot,
-        tabbable
+        elementShouldBeTabbable
       );
       if (childMatchSiblingMatch) {
         return childMatchSiblingMatch;
@@ -133,7 +133,7 @@ export function getPreviousElement(
           true,
           includeElementsInFocusZones,
           allowFocusRoot,
-          tabbable
+          elementShouldBeTabbable
         );
 
         if (childMatchParentMatch) {
@@ -146,7 +146,8 @@ export function getPreviousElement(
   }
 
   // Check the current node, if it's not the first traversal.
-  if (checkNode && isCurrentElementVisible && isElementTabbable(currentElement)) {
+  if (checkNode && isCurrentElementVisible &&
+    ((elementShouldBeTabbable && isElementTabbable(currentElement, true)) || !elementShouldBeTabbable)) {
     return currentElement;
   }
 
@@ -159,7 +160,7 @@ export function getPreviousElement(
     true,
     includeElementsInFocusZones,
     allowFocusRoot,
-    tabbable);
+    elementShouldBeTabbable);
 
   if (siblingMatch) {
     return siblingMatch;
@@ -168,7 +169,7 @@ export function getPreviousElement(
   // Check its parent.
   if (!suppressParentTraversal) {
     return getPreviousElement(rootElement, currentElement.parentElement, true, false, false, includeElementsInFocusZones,
-      allowFocusRoot, tabbable);
+      allowFocusRoot, elementShouldBeTabbable);
   }
 
   return null;

From 8fefccb51072642d80de8370c550a3c49d49e45a Mon Sep 17 00:00:00 2001
From: Vitalie Braga <vitaliebraga@gmail.com>
Date: Sat, 10 Mar 2018 23:42:37 -0800
Subject: [PATCH 1556/1641] Add Shimmer component (#4187)

* Adds basic skeleton of Shimmer Component to office-ui-fabric-react.

* Register the Shimmer component in the library.

* Adds basic skeleton of Shimmer Component to office-ui-fabric-react.

* Register the Shimmer component in the library.

* Starting to implement mergeStyles to  create examples of component.

* Introduces the svg plus styles a little.

* Adds css background-size to mergeStyles.api and adds basic shimmer animation.

* Splits Shimmer into the main host and shapes inside.

* Adds rectangle shape to shimmer.

* Changes the logic to exposure of the shapes of shimmer only internaly.

* Adds ability to to add different elements to the shimmer line.

* Refactors the naming of some interfaces and forces a more strict type check.

* Moves the function bo get the borderAlignStyles to Shimmer.base.tsx

* Adds wrapper around the shimmer to position it absolute for fadeOut animation.

* Creates two basic examples for shimmer page.

* Sets a list with hovercards to demonstrate Shimmer Application.

* Small changes in the logic of calculating the borders.

* Change log plus remove mergeStyleAPI change for a different PR

* Cleans TSLint errors.

* Cleans unused import.

* Moves the shimmer component to experiments folder.

* Adjusts all imports to make it run in experiments.

* Adds Change log plus cleans the code a little.

* Corrects all typescript linting errors.

* Fixes another tslint error

* Removes unnecessary circle state.
---
 ...ibr-ShimmerComponent_2018-03-06-18-42.json |  11 ++
 packages/experiments/src/Shimmer.ts           |   1 +
 .../src/components/Shimmer/Shimmer.base.tsx   | 139 ++++++++++++++++++
 .../src/components/Shimmer/Shimmer.styles.ts  |  79 ++++++++++
 .../src/components/Shimmer/Shimmer.tsx        |   9 ++
 .../src/components/Shimmer/Shimmer.types.ts   | 135 +++++++++++++++++
 .../ShimmerCircle/ShimmerCircle.base.tsx      |  43 ++++++
 .../ShimmerCircle/ShimmerCircle.styles.ts     |  74 ++++++++++
 .../Shimmer/ShimmerCircle/ShimmerCircle.tsx   |  10 ++
 .../src/components/Shimmer/ShimmerPage.tsx    |  81 ++++++++++
 .../ShimmerRectangle.base.tsx                 |  32 ++++
 .../ShimmerRectangle.styles.ts                |  82 +++++++++++
 .../ShimmerRectangle/ShimmerRectangle.tsx     |  10 ++
 .../examples/Shimmer.Application.Example.tsx  | 113 ++++++++++++++
 .../examples/Shimmer.Basic.Example.tsx        |  82 +++++++++++
 .../Shimmer/examples/Shimmer.Example.scss     |  17 +++
 .../examples/Shimmer.LoadData.Example.tsx     |  42 ++++++
 .../src/components/Shimmer/index.ts           |   2 +
 .../experiments/src/demo/AppDefinition.tsx    |   6 +
 packages/experiments/src/index.ts             |   3 +-
 20 files changed, 970 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/experiments/v-vibr-ShimmerComponent_2018-03-06-18-42.json
 create mode 100644 packages/experiments/src/Shimmer.ts
 create mode 100644 packages/experiments/src/components/Shimmer/Shimmer.base.tsx
 create mode 100644 packages/experiments/src/components/Shimmer/Shimmer.styles.ts
 create mode 100644 packages/experiments/src/components/Shimmer/Shimmer.tsx
 create mode 100644 packages/experiments/src/components/Shimmer/Shimmer.types.ts
 create mode 100644 packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.base.tsx
 create mode 100644 packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.styles.ts
 create mode 100644 packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.tsx
 create mode 100644 packages/experiments/src/components/Shimmer/ShimmerPage.tsx
 create mode 100644 packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.base.tsx
 create mode 100644 packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.styles.ts
 create mode 100644 packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.tsx
 create mode 100644 packages/experiments/src/components/Shimmer/examples/Shimmer.Application.Example.tsx
 create mode 100644 packages/experiments/src/components/Shimmer/examples/Shimmer.Basic.Example.tsx
 create mode 100644 packages/experiments/src/components/Shimmer/examples/Shimmer.Example.scss
 create mode 100644 packages/experiments/src/components/Shimmer/examples/Shimmer.LoadData.Example.tsx
 create mode 100644 packages/experiments/src/components/Shimmer/index.ts

diff --git a/common/changes/@uifabric/experiments/v-vibr-ShimmerComponent_2018-03-06-18-42.json b/common/changes/@uifabric/experiments/v-vibr-ShimmerComponent_2018-03-06-18-42.json
new file mode 100644
index 0000000000000..463a9790d75ce
--- /dev/null
+++ b/common/changes/@uifabric/experiments/v-vibr-ShimmerComponent_2018-03-06-18-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Adds a new Shimmer Component to experiments package.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "v-vibr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/Shimmer.ts b/packages/experiments/src/Shimmer.ts
new file mode 100644
index 0000000000000..aa038dd0c57a2
--- /dev/null
+++ b/packages/experiments/src/Shimmer.ts
@@ -0,0 +1 @@
+export * from './components/Shimmer/index';
\ No newline at end of file
diff --git a/packages/experiments/src/components/Shimmer/Shimmer.base.tsx b/packages/experiments/src/components/Shimmer/Shimmer.base.tsx
new file mode 100644
index 0000000000000..70ce162d2824e
--- /dev/null
+++ b/packages/experiments/src/components/Shimmer/Shimmer.base.tsx
@@ -0,0 +1,139 @@
+import * as React from 'react';
+import {
+  BaseComponent,
+  classNamesFunction,
+} from '../../Utilities';
+import {
+  IShimmerProps,
+  IShimmerStyleProps,
+  IShimmerStyles,
+  ShimmerElementType,
+  ICircle,
+  ILine,
+  IGap,
+  ShimmerElementVerticalAlign,
+} from './Shimmer.types';
+import {
+  DefaultPalette,
+  IStyleSet
+} from '../../Styling';
+import { ShimmerRectangle } from './ShimmerRectangle/ShimmerRectangle';
+import { ShimmerCircle } from './ShimmerCircle/ShimmerCircle';
+
+const getClassNames = classNamesFunction<IShimmerStyleProps, IShimmerStyles>();
+
+export class ShimmerBase extends BaseComponent<IShimmerProps, {}> {
+  public static defaultProps: IShimmerProps = {
+    width: 100,
+    isDataLoaded: false
+  };
+  private _classNames: {[key in keyof IShimmerStyles]: string};
+  constructor(props: IShimmerProps) {
+    super(props);
+  }
+
+  public render(): JSX.Element {
+    const { getStyles, width, lineElements, children, isDataLoaded } = this.props;
+    const maxHeight: number | undefined = lineElements ? this._findMaxHeight(lineElements) : undefined;
+    this._classNames = getClassNames(getStyles!, { width, maxHeight, isDataLoaded });
+
+    const elements: JSX.Element[] | JSX.Element = lineElements ?
+      lineElements.map((elem: ICircle | ILine | IGap, index: number): JSX.Element => {
+        switch (elem.type) {
+          case ShimmerElementType.CIRCLE:
+            return (
+              <ShimmerCircle
+                key={ index }
+                { ...elem }
+                borderAlignStyle={ this._getBorderAlignStyles(maxHeight, elem) }
+              />
+            );
+          case ShimmerElementType.GAP:
+            const gapWidth = elem.width ? elem.width + '%' : '1%';
+            return (
+              <div
+                key={ index }
+                // tslint:disable-next-line:jsx-ban-props
+                style={ {
+                  width: gapWidth,
+                  height: maxHeight + 'px',
+                  backgroundColor: `${DefaultPalette.white}`
+                } }
+              />
+            );
+          case ShimmerElementType.RECTANGLE:
+            return (
+              <ShimmerRectangle
+                key={ index }
+                { ...elem }
+                borderAlignStyle={ this._getBorderAlignStyles(maxHeight, elem) }
+              />
+            );
+        }
+      }) :
+      <ShimmerRectangle />;
+
+    return (
+      <div className={ this._classNames.root }>
+        <div className={ this._classNames.shimmerWrapper }>
+          { elements }
+        </div>
+        <div className={ this._classNames.dataWrapper }>
+          { !!isDataLoaded ?
+            !!children ? children : null
+            : null }
+        </div>
+      </div>
+    );
+  }
+
+  private _findMaxHeight(items: Array<ICircle | IGap | ILine>): number {
+    const maxHeight = items.reduce((acc: number, next: ICircle | IGap | ILine): number => {
+      return next.height ?
+        next.height > acc ? next.height : acc
+        : acc;
+    }, 0);
+    return maxHeight;
+  }
+
+  private _getBorderAlignStyles(maxHeight: number | undefined, elem: ICircle | IGap | ILine): IStyleSet | undefined {
+    let height: number | undefined;
+    switch (elem.type) {
+      case ShimmerElementType.RECTANGLE:
+        height = !!elem.height ? elem.height : 16;
+        break;
+      case ShimmerElementType.CIRCLE:
+        height = !!elem.height ? elem.height : 24;
+        break;
+    }
+    console.log(height);
+    const dif: number | undefined = maxHeight && height ?
+      maxHeight - height > 0 ?
+        maxHeight - height : undefined
+      : undefined;
+
+    let borderStyle: IStyleSet | undefined;
+    const hasVerticalAlign: boolean = elem.verticalAlign ? true : false;
+
+    if (elem.verticalAlign === ShimmerElementVerticalAlign.CENTER || !hasVerticalAlign) {
+      borderStyle = {
+        alignSelf: 'center',
+        borderBottom: `${dif ? dif / 2 : 0}px solid ${DefaultPalette.white}`,
+        borderTop: `${dif ? dif / 2 : 0}px solid ${DefaultPalette.white}`
+      };
+    } else if (elem.verticalAlign === ShimmerElementVerticalAlign.TOP && hasVerticalAlign) {
+      borderStyle = {
+        alignSelf: 'top',
+        borderBottom: `${dif ? dif : 0}px solid ${DefaultPalette.white}`,
+        borderTop: `0px solid ${DefaultPalette.white}`
+      };
+    } else if (elem.verticalAlign === ShimmerElementVerticalAlign.BOTTOM && hasVerticalAlign) {
+      borderStyle = {
+        alignSelf: 'bottom',
+        borderBottom: `0px solid ${DefaultPalette.white}`,
+        borderTop: `${dif ? dif : 0}px solid ${DefaultPalette.white}`
+      };
+    }
+    return borderStyle;
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Shimmer/Shimmer.styles.ts b/packages/experiments/src/components/Shimmer/Shimmer.styles.ts
new file mode 100644
index 0000000000000..ef1f852e36b7a
--- /dev/null
+++ b/packages/experiments/src/components/Shimmer/Shimmer.styles.ts
@@ -0,0 +1,79 @@
+import { IShimmerStyleProps, IShimmerStyles } from './Shimmer.types';
+import {
+  keyframes,
+  DefaultPalette
+} from '../../Styling';
+
+export function getStyles(props: IShimmerStyleProps): IShimmerStyles {
+  const {
+    width,
+    maxHeight,
+    isDataLoaded
+  } = props;
+
+  const shimmerAnimation: string = keyframes({
+    '0%': {
+      backgroundPosition: '-900%'
+    },
+    '100%': {
+      backgroundPosition: '1000%'
+    }
+  });
+
+  return {
+    root: [
+      'ms-Shimmer-container',
+      {
+        position: 'relative',
+        margin: '10px',
+        boxSizing: 'content-box',
+        minHeight: maxHeight ? `${maxHeight}px` : '16px'
+      }
+    ],
+    shimmerWrapper: [
+      'ms-Shimmer-shimmerWrapper',
+      {
+        display: 'flex',
+        position: 'absolute',
+        top: '0',
+        alignItems: 'center',
+        alignContent: 'space-between',
+        width: `${width}%`,
+        height: 'auto',
+        boxSizing: 'border-box',
+        background: `${DefaultPalette.neutralLighter}
+                    linear-gradient(
+                      to right,
+                      ${DefaultPalette.neutralLighter} 0%,
+                      ${DefaultPalette.neutralLight} 50%,
+                      ${DefaultPalette.neutralLighter} 100%)
+                    0 0 / 90% 100%
+                    no-repeat
+                    content-box`,
+        animationDuration: '2s',
+        animationTimingFunction: 'ease-in-out',
+        animationDirection: 'normal',
+        animationIterationCount: 'infinite',
+        animationName: shimmerAnimation,
+        transition: 'opacity 200ms, visibility 200ms'
+      },
+      isDataLoaded && {
+        opacity: '0',
+        visibility: 'hidden'
+      }
+    ],
+    dataWrapper: [
+      'ms-Shimmer-dataWrapper',
+      {
+        opacity: '0',
+        lineHeight: '1',
+        background: 'none',
+        border: 'none',
+        transition: 'opacity 200ms'
+      },
+      isDataLoaded && {
+        opacity: '1'
+      }
+    ]
+  };
+}
diff --git a/packages/experiments/src/components/Shimmer/Shimmer.tsx b/packages/experiments/src/components/Shimmer/Shimmer.tsx
new file mode 100644
index 0000000000000..5f1ca7a546d2b
--- /dev/null
+++ b/packages/experiments/src/components/Shimmer/Shimmer.tsx
@@ -0,0 +1,9 @@
+import { styled } from '../../Utilities';
+import { IShimmerProps, IShimmerStyleProps, IShimmerStyles } from './Shimmer.types';
+import { getStyles } from './Shimmer.styles';
+import { ShimmerBase } from './Shimmer.base';
+
+export const Shimmer = styled<IShimmerProps, IShimmerStyleProps, IShimmerStyles>(
+  ShimmerBase,
+  getStyles
+);
diff --git a/packages/experiments/src/components/Shimmer/Shimmer.types.ts b/packages/experiments/src/components/Shimmer/Shimmer.types.ts
new file mode 100644
index 0000000000000..e5fe6b32ca4b9
--- /dev/null
+++ b/packages/experiments/src/components/Shimmer/Shimmer.types.ts
@@ -0,0 +1,135 @@
+import * as React from 'react';
+import {
+  IStyle
+} from '../../Styling';
+import { IStyleFunction } from '../../Utilities';
+
+export interface IShimmer {
+
+}
+
+/**
+ * Shimmer component props.
+ */
+export interface IShimmerProps extends React.AllHTMLAttributes<HTMLElement> {
+  /**
+   * Optional callback to access the IShimmer interface. Use this instead of ref for accessing
+   * the public methods and properties of the component.
+   */
+  componentRef?: (component: IShimmer) => void;
+
+  /**
+   * Sets the width of the shimmer wave container in percentages.
+   * @default 100%
+   */
+  width?: number;
+
+  /**
+   * Controls when the shimmer is swapped with actual data through an animated transition.
+   * @default false
+   */
+  isDataLoaded?: boolean;
+
+  /**
+   * Elements to render in one line of the Shimmer.
+   */
+  lineElements?: Array<ICircle | IGap | ILine>;
+
+  /**
+   * Call to provide customized styling that will layer on top of the variant rules.
+   */
+  getStyles?: IStyleFunction<IShimmerStyleProps, IShimmerStyles>;
+}
+
+export interface IShimmerElement {
+  /**
+   * Required for every element you intend to use.
+   */
+  type: ShimmerElementType;
+
+  /**
+   * The hight of the element (ICircle, ILine, IGap).
+   * Read more details for each specific element.
+   */
+  height?: number;
+
+  /**
+   * The width of the element (ICircle, ILine, IGap).
+   * Read more details for each specific element.
+   */
+  width?: number;
+
+  /**
+   * The vertical alignemt of the element (ICircle, ILine, IGap).
+   * @default center
+   */
+  verticalAlign?: ShimmerElementVerticalAlign;
+}
+
+export interface ILine extends IShimmerElement {
+  /**
+   * Sets the height of the rectangle.
+   * The value will represent the height in pixels.
+   * @default 16
+   */
+  height?: number;
+
+  /**
+   * If not provided the line will the take the remaining space to fill the shimmer container.
+   * The value provided will represent the width as '%' relative to the shimmer container.
+   */
+  width?: number;
+}
+
+export interface ICircle extends IShimmerElement {
+  /**
+   * Sets the height of the circle.
+   * The value will represent the height in pixels.
+   * @default 24
+   */
+  height?: number;
+
+  /**
+   * Width of the circle element if provided will be ignored.
+   * The value will be set equal to the height of the circle for scale ratio reasons.
+   */
+  width?: number;
+}
+
+export interface IGap extends IShimmerElement {
+  /**
+   * Height for gap element will be ignored and set equal to the heighest element on the line.
+   */
+  height?: number;
+
+  /**
+   * Sets the width relative to the shimmer container width for responsiveness reasons.
+   * The value will be calculated as '%' relative the to shimmer container.
+   * @default 1%
+   */
+  width?: number;
+}
+
+export interface IShimmerStyleProps {
+  width?: number;
+  maxHeight?: number;
+  isDataLoaded?: boolean;
+}
+
+export interface IShimmerStyles {
+  root?: IStyle;
+  shimmerWrapper?: IStyle;
+  dataWrapper?: IStyle;
+}
+
+export const enum ShimmerElementType {
+  RECTANGLE = 'line',
+  CIRCLE = 'circle',
+  GAP = 'gap'
+}
+
+export const enum ShimmerElementVerticalAlign {
+  CENTER = 'center',
+  BOTTOM = 'bottom',
+  TOP = 'top'
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.base.tsx b/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.base.tsx
new file mode 100644
index 0000000000000..b5c88d108ca59
--- /dev/null
+++ b/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.base.tsx
@@ -0,0 +1,43 @@
+import * as React from 'react';
+import {
+  BaseComponent,
+  classNamesFunction,
+} from '../../../Utilities';
+import {
+  IShimmerCircleProps,
+  IShimmerCircleStyleProps,
+  IShimmerCircleStyles
+} from './ShimmerCircle.styles';
+
+const getClassNames = classNamesFunction<IShimmerCircleStyleProps, IShimmerCircleStyles>();
+
+export class ShimmerCircleBase extends BaseComponent<IShimmerCircleProps, {}> {
+  public static defaultProps: IShimmerCircleProps = {
+    height: 24
+  };
+  private _classNames: {[key in keyof IShimmerCircleStyles]: string};
+  constructor(props: IShimmerCircleProps) {
+    super(props);
+  }
+
+  public render(): JSX.Element {
+    const { height, getStyles, borderAlignStyle } = this.props;
+    this._classNames = getClassNames(getStyles!, { height, borderAlignStyle });
+
+    return (
+      <div className={ this._classNames.root }>
+        <svg
+          viewBox='0 0 10 10'
+          width={ height }
+          height={ height }
+          className={ this._classNames.svg }
+        >
+          <path
+            // tslint:disable-next-line:max-line-length
+            d='M0,0 L10,0 L10,10 L0,10 L0,0 Z M0,5 C0,7.76142375 2.23857625,10 5,10 C7.76142375,10 10,7.76142375 10,5 C10,2.23857625 7.76142375,2.22044605e-16 5,0 C2.23857625,-2.22044605e-16 0,2.23857625 0,5 L0,5 Z'
+          />
+        </svg>
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.styles.ts b/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.styles.ts
new file mode 100644
index 0000000000000..f3947ce7061e9
--- /dev/null
+++ b/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.styles.ts
@@ -0,0 +1,74 @@
+import * as React from 'react';
+import {
+  IStyle,
+  DefaultPalette,
+  IStyleSet
+} from '../../../Styling';
+import { IStyleFunction } from '../../../Utilities';
+
+export interface IShimmerCircle {
+
+}
+
+/**
+ * ShimmerCircle component props.
+ */
+export interface IShimmerCircleProps extends React.AllHTMLAttributes<HTMLElement> {
+  /**
+   * Optional callback to access the IShimmerCircle interface. Use this instead of ref for accessing
+   * the public methods and properties of the component.
+   */
+  componentRef?: (component: IShimmerCircle) => void;
+
+  /**
+   * Sets the height of the circle.
+   * @default 24px
+   */
+  height?: number;
+
+  /**
+   * Used to
+   */
+  borderAlignStyle?: IStyleSet;
+
+  /**
+   * Call to provide customized styling that will layer on top of the variant rules.
+   */
+  getStyles?: IStyleFunction<IShimmerCircleStyleProps, IShimmerCircleStyles>;
+}
+
+export interface IShimmerCircleStyleProps {
+  height?: number;
+  borderAlignStyle?: IStyleSet;
+}
+
+export interface IShimmerCircleStyles {
+  root?: IStyle;
+  svg?: IStyle;
+}
+
+export function getStyles(props: IShimmerCircleStyleProps): IShimmerCircleStyles {
+  const {
+    height,
+    borderAlignStyle
+  } = props;
+
+  const styles: IStyleSet = !!borderAlignStyle ? borderAlignStyle : {};
+
+  return {
+    root: [
+      'ms-ShimmerCircle-wrapper',
+      {
+        width: `${height}px`,
+        height: `${height}px`,
+      },
+      styles
+    ],
+    svg: [
+      'ms-ShimmerCircle-svg',
+      {
+        fill: `${DefaultPalette.white}`
+      }
+    ]
+  };
+}
diff --git a/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.tsx b/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.tsx
new file mode 100644
index 0000000000000..594bb1b89f052
--- /dev/null
+++ b/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.tsx
@@ -0,0 +1,10 @@
+import {
+  styled
+} from '../../../Utilities';
+import { getStyles, IShimmerCircleProps, IShimmerCircleStyleProps, IShimmerCircleStyles } from './ShimmerCircle.styles';
+import { ShimmerCircleBase } from './ShimmerCircle.base';
+
+export const ShimmerCircle = styled<IShimmerCircleProps, IShimmerCircleStyleProps, IShimmerCircleStyles>(
+  ShimmerCircleBase,
+  getStyles
+);
diff --git a/packages/experiments/src/components/Shimmer/ShimmerPage.tsx b/packages/experiments/src/components/Shimmer/ShimmerPage.tsx
new file mode 100644
index 0000000000000..db429abc2c0f4
--- /dev/null
+++ b/packages/experiments/src/components/Shimmer/ShimmerPage.tsx
@@ -0,0 +1,81 @@
+import * as React from 'react';
+import {
+  ExampleCard,
+  ComponentPage,
+  IComponentDemoPageProps,
+  PropertiesTableSet
+} from '@uifabric/example-app-base';
+import { ShimmerBasicExample } from './examples/Shimmer.Basic.Example';
+import { ShimmerLoadDataExample } from './examples/Shimmer.LoadData.Example';
+
+const ShimmerBasicExampleCode = require('!raw-loader!experiments/src/components/Shimmer/examples/Shimmer.Basic.Example.tsx') as string;
+// tslint:disable-next-line:max-line-length
+const ShimmerLoadDataExampleCode = require('!raw-loader!experiments/src/components/Shimmer/examples/Shimmer.LoadData.Example.tsx') as string;
+
+export class ShimmerPage extends React.Component<IComponentDemoPageProps, {}> {
+  public render(): JSX.Element {
+    return (
+      <ComponentPage
+        title='Shimmer'
+        componentName='ShimmerExample'
+        exampleCards={
+          <div>
+            <ExampleCard
+              title='Basic Shimmer'
+              code={ ShimmerBasicExampleCode }
+            >
+              <ShimmerBasicExample />
+            </ExampleCard>
+            <ExampleCard
+              title='Enabling Data Shimmer'
+              code={ ShimmerLoadDataExampleCode }
+            >
+              <ShimmerLoadDataExample />
+            </ExampleCard>
+          </div>
+        }
+        propertiesTables={
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!experiments/src/components/Shimmer/Shimmer.types.ts')
+            ] }
+          />
+        }
+        overview={
+          <div>
+            <p>
+              Shimmer is a temporary animation placeholder for the upcoming data from an API call
+            </p>
+          </div>
+        }
+        bestPractices={
+          <div />
+        }
+        dos={
+          <div>
+            <ul>
+              <li>
+                When construncting a shimmer line using different elements like Circle, Rectangle or Gap, best if providing widths for each
+                of them to experience a better layout looking as close as possible to real data it is replacing.
+              </li>
+              <li>
+                Try avoiding multiple shimmer lines of different widths. Each shimmer line is it's own animation and it is dependent on the
+                width you provide. So for a better visual animation keep the widths consistent.
+              </li>
+            </ul>
+          </div>
+        }
+        donts={
+          <div>
+            <ul>
+              <li>
+                Thinking... )
+              </li>
+            </ul>
+          </div>
+        }
+        isHeaderVisible={ this.props.isHeaderVisible }
+      />
+    );
+  }
+}
diff --git a/packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.base.tsx b/packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.base.tsx
new file mode 100644
index 0000000000000..961f6674860d0
--- /dev/null
+++ b/packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.base.tsx
@@ -0,0 +1,32 @@
+import * as React from 'react';
+import {
+  BaseComponent,
+  classNamesFunction,
+} from '../../../Utilities';
+import { IShimmerRectangleProps, IShimmerRectangleStyleProps, IShimmerRectangleStyles } from './ShimmerRectangle.styles';
+import { ShimmerElementVerticalAlign } from 'experiments/lib/Shimmer';
+
+const getClassNames = classNamesFunction<IShimmerRectangleStyleProps, IShimmerRectangleStyles>();
+
+export class ShimmerRectangleBase extends BaseComponent<IShimmerRectangleProps, {}> {
+  public static defaultProps: IShimmerRectangleProps = {
+    height: 16,
+    verticalAlign: ShimmerElementVerticalAlign.CENTER,
+    width: 100
+  };
+  private _classNames: {[key in keyof IShimmerRectangleStyles]: string};
+
+  constructor(props: IShimmerRectangleProps) {
+    super(props);
+  }
+
+  public render(): JSX.Element {
+    const { height, getStyles, width, borderAlignStyle } = this.props;
+
+    this._classNames = getClassNames(getStyles!, { height, width, borderAlignStyle });
+
+    return (
+      <div className={ this._classNames.root } />
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.styles.ts b/packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.styles.ts
new file mode 100644
index 0000000000000..19c7059c1e1d9
--- /dev/null
+++ b/packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.styles.ts
@@ -0,0 +1,82 @@
+import * as React from 'react';
+import {
+  IStyle,
+  IStyleSet
+} from '../../../Styling';
+import { IStyleFunction } from '../../../Utilities';
+
+export interface IShimmerRectangle {
+
+}
+
+/**
+ * ShimmerRectangle component props.
+ */
+export interface IShimmerRectangleProps extends React.AllHTMLAttributes<HTMLElement> {
+  /**
+   * Optional callback to access the IShimmerRectangle interface. Use this instead of ref for accessing
+   * the public methods and properties of the component.
+   */
+  componentRef?: (component: IShimmerRectangle) => void;
+
+  /**
+   * Sets the height of the rectangle.
+   * @default 16px
+   */
+  height?: number;
+
+  /**
+   * Sets width of the elemnts.
+   * @default 100%
+   */
+  width?: number;
+
+  /**
+   * @default center
+   */
+  verticalAlign?: string;
+
+  /**
+   * Sets custom styling of the rectangle.
+   */
+  borderAlignStyle?: IStyleSet;
+
+  /**
+   * Call to provide customized styling that will layer on top of the variant rules.
+   */
+  getStyles?: IStyleFunction<IShimmerRectangleStyleProps, IShimmerRectangleStyles>;
+}
+
+export interface IShimmerRectangleStyleProps {
+  height?: number;
+  verticalAlign?: string;
+  width?: number;
+  borderAlignStyle?: IStyleSet;
+}
+
+export interface IShimmerRectangleStyles {
+  root?: IStyle;
+}
+
+export function getStyles(props: IShimmerRectangleStyleProps): IShimmerRectangleStyles {
+  const {
+    height,
+    width,
+    borderAlignStyle
+  } = props;
+
+  const styles: IStyleSet = !!borderAlignStyle ? borderAlignStyle : {};
+
+  return {
+    root: [
+      'ms-ShimmerRectangle-line',
+      {
+        color: 'transparent',
+        width: `${width}%`,
+        height: `${height}px`,
+        boxSizing: 'content-box',
+      },
+      styles
+    ]
+  };
+}
diff --git a/packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.tsx b/packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.tsx
new file mode 100644
index 0000000000000..50b4947ae84c7
--- /dev/null
+++ b/packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.tsx
@@ -0,0 +1,10 @@
+import {
+  styled
+} from '../../../Utilities';
+import { getStyles, IShimmerRectangleProps, IShimmerRectangleStyleProps, IShimmerRectangleStyles } from './ShimmerRectangle.styles';
+import { ShimmerRectangleBase } from './ShimmerRectangle.base';
+
+export const ShimmerRectangle = styled<IShimmerRectangleProps, IShimmerRectangleStyleProps, IShimmerRectangleStyles>(
+  ShimmerRectangleBase,
+  getStyles
+);
diff --git a/packages/experiments/src/components/Shimmer/examples/Shimmer.Application.Example.tsx b/packages/experiments/src/components/Shimmer/examples/Shimmer.Application.Example.tsx
new file mode 100644
index 0000000000000..6eddf4414c785
--- /dev/null
+++ b/packages/experiments/src/components/Shimmer/examples/Shimmer.Application.Example.tsx
@@ -0,0 +1,113 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+import { BaseComponent } from 'office-ui-fabric-react/lib/Utilities';
+import {
+  HoverCard,
+  IExpandingCardProps
+} from 'office-ui-fabric-react/lib/HoverCard';
+import { DetailsList, buildColumns, IColumn } from 'office-ui-fabric-react/lib/DetailsList';
+import { autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { createListItems } from '@uifabric/example-app-base';
+import './Shimmer.Example.scss';
+
+export interface IItem {
+  [index: string]: string | number;
+  thumbnail: string;
+  key: string;
+  name: string;
+  description: string;
+  color: string;
+  shape: string;
+  location: string;
+  width: number;
+  height: number;
+}
+
+let _items: IItem[];
+
+export interface IShimmerApplicationExampleState {
+  items?: IItem[];
+  columns?: IColumn[];
+}
+
+export class ShimmerApplicationExample extends BaseComponent<{}, IShimmerApplicationExampleState> {
+
+  constructor(props: {}) {
+    super(props);
+
+    _items = _items || createListItems(10);
+
+    this.state = {
+      items: _items,
+      columns: _buildColumns()
+    };
+  }
+
+  public render(): JSX.Element {
+    const { items, columns } = this.state;
+
+    return (
+      <div>
+        <p> Hover over location of a row item to see the card </p>
+        <DetailsList
+          setKey='hoverSet'
+          items={ items! }
+          columns={ columns }
+          onRenderItemColumn={ this._onRenderItemColumn }
+        />
+      </div>
+    );
+  }
+
+  @autobind
+  private _onRenderItemColumn(item: IItem, index: number, column: IColumn): JSX.Element | string | number {
+    const expandingCardProps: IExpandingCardProps = {
+      onRenderCompactCard: this._onRenderCompactCard,
+      onRenderExpandedCard: this._onRenderExpandedCard,
+      renderData: item
+    };
+
+    if (column.key === 'key') {
+      return (
+        <HoverCard id='myID1' expandingCardProps={ expandingCardProps } instantOpenOnClick={ true }>
+          <div className='HoverCard-item'>
+            { item.key }
+          </div>
+        </HoverCard>
+      );
+    }
+
+    return item[column.key];
+  }
+
+  @autobind
+  private _onRenderCompactCard(item: IItem): JSX.Element {
+    return (
+      <div className='hoverCardExample-compactCard'>
+        <a target='_blank' href={ `http://wikipedia.org/wiki/${item.location}` }>
+          { item.location }
+        </a>
+      </div>
+    );
+  }
+
+  @autobind
+  private _onRenderExpandedCard(item: IItem): JSX.Element {
+    const { items, columns } = this.state;
+    return (
+      <div className='hoverCardExample-expandedCard'>
+        { item.description }
+        <DetailsList
+          setKey='expandedCardSet'
+          items={ items! }
+          columns={ columns }
+        />
+      </div>
+    );
+  }
+}
+
+function _buildColumns(): IColumn[] {
+  return buildColumns(_items).filter((column: IColumn) => column.name === 'location' || column.name === 'key');
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Shimmer/examples/Shimmer.Basic.Example.tsx b/packages/experiments/src/components/Shimmer/examples/Shimmer.Basic.Example.tsx
new file mode 100644
index 0000000000000..72f53f5c1bdd9
--- /dev/null
+++ b/packages/experiments/src/components/Shimmer/examples/Shimmer.Basic.Example.tsx
@@ -0,0 +1,82 @@
+import * as React from 'react';
+import {
+  Shimmer,
+  ShimmerElementType as ElemType,
+  ShimmerElementVerticalAlign as ElemVerticalAlign
+} from 'experiments/lib/Shimmer';
+
+export class ShimmerBasicExample extends React.Component<{}, {}> {
+
+  constructor(props: {}) {
+    super(props);
+  }
+
+  public render(): JSX.Element {
+
+    return (
+      // tslint:disable-next-line:jsx-ban-props
+      <div style={ { padding: '2px' } }>
+        Generic Shimmer with no elements provided.
+        <Shimmer />
+        <Shimmer
+          width={ 75 }
+        />
+        <Shimmer
+          width={ 50 }
+        />
+        Custom Shimmer with elements provided.
+        <Shimmer
+          lineElements={ [
+            { type: ElemType.CIRCLE, height: 24 },
+            { type: ElemType.GAP, width: 2 },
+            { type: ElemType.RECTANGLE, height: 16 },
+          ] }
+        />
+        Notice how the same elements change relative to the shimmer width provided.
+        <Shimmer
+          lineElements={ [
+            { type: ElemType.CIRCLE, height: 24 },
+            { type: ElemType.GAP, width: 2 },
+            { type: ElemType.RECTANGLE, height: 16, width: 20 },
+            { type: ElemType.GAP, width: 5 },
+            { type: ElemType.RECTANGLE, height: 16, width: 20 },
+            { type: ElemType.GAP, width: 10 },
+            { type: ElemType.RECTANGLE, height: 16, width: 15 },
+            { type: ElemType.GAP, width: 10 },
+            { type: ElemType.RECTANGLE, height: 16 }
+          ] }
+        />
+        <Shimmer
+          width={ 70 }
+          lineElements={ [
+            { type: ElemType.CIRCLE, height: 24 },
+            { type: ElemType.GAP, width: 2 },
+            { type: ElemType.RECTANGLE, height: 16, width: 20 },
+            { type: ElemType.GAP, width: 5 },
+            { type: ElemType.RECTANGLE, height: 16, width: 20 },
+            { type: ElemType.GAP, width: 10 },
+            { type: ElemType.RECTANGLE, height: 16, width: 15 },
+            { type: ElemType.GAP, width: 10 },
+            { type: ElemType.RECTANGLE, height: 16 }
+          ] }
+        />
+        Variations of vertical alignment for Circles and Rectangles.
+        <Shimmer
+          lineElements={ [
+            { type: ElemType.CIRCLE, height: 24 },
+            { type: ElemType.GAP, width: 2 },
+            { type: ElemType.CIRCLE, height: 15, verticalAlign: ElemVerticalAlign.TOP },
+            { type: ElemType.GAP, width: 2 },
+            { type: ElemType.RECTANGLE, verticalAlign: ElemVerticalAlign.BOTTOM, width: 20 },
+            { type: ElemType.GAP, width: 2 },
+            { type: ElemType.RECTANGLE, height: 5, verticalAlign: ElemVerticalAlign.TOP, width: 20 },
+            { type: ElemType.GAP, width: 2 },
+            { type: ElemType.RECTANGLE, height: 16, width: 15 },
+            { type: ElemType.GAP, width: 2 },
+            { type: ElemType.RECTANGLE, height: 10, verticalAlign: ElemVerticalAlign.BOTTOM }
+          ] }
+        />
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Shimmer/examples/Shimmer.Example.scss b/packages/experiments/src/components/Shimmer/examples/Shimmer.Example.scss
new file mode 100644
index 0000000000000..501e970ec958c
--- /dev/null
+++ b/packages/experiments/src/components/Shimmer/examples/Shimmer.Example.scss
@@ -0,0 +1,17 @@
+:global {
+  .hoverCardExample-compactCard {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
+  }
+
+  .hoverCardExample-expandedCard {
+    padding: 16px 24px;
+  }
+
+  .HoverCard-item:hover {
+    text-decoration: underline;
+    cursor: pointer;
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Shimmer/examples/Shimmer.LoadData.Example.tsx b/packages/experiments/src/components/Shimmer/examples/Shimmer.LoadData.Example.tsx
new file mode 100644
index 0000000000000..b0db227a6fded
--- /dev/null
+++ b/packages/experiments/src/components/Shimmer/examples/Shimmer.LoadData.Example.tsx
@@ -0,0 +1,42 @@
+import * as React from 'react';
+import { Shimmer } from 'experiments/lib/Shimmer';
+import { Toggle } from 'office-ui-fabric-react/lib/Toggle';
+
+export interface IShimmerLoadDataExample {
+  isDataLoaded?: boolean;
+}
+
+export class ShimmerLoadDataExample extends React.Component<{}, IShimmerLoadDataExample> {
+
+  constructor(props: {}) {
+    super(props);
+    this.state = {
+      isDataLoaded: false
+    };
+  }
+
+  public render(): JSX.Element {
+    const {
+      isDataLoaded: dataLoaded,
+    } = this.state;
+
+    return (
+      // tslint:disable-next-line:jsx-ban-props
+      <div style={ { padding: '2px' } }>
+        <Shimmer
+          isDataLoaded={ dataLoaded }
+        >
+          <div>Data Loaded Data Loaded Data Loaded Data Loaded Data Loaded Data Loaded Data Loaded</div>
+        </Shimmer>
+        <Toggle
+          label='Load data switch'
+          checked={ dataLoaded }
+          // tslint:disable-next-line:jsx-no-lambda
+          onChanged={ (isDataLoaded: boolean) => this.setState({ isDataLoaded }) }
+          onText='Loaded'
+          offText='Loading...'
+        />
+      </div>
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Shimmer/index.ts b/packages/experiments/src/components/Shimmer/index.ts
new file mode 100644
index 0000000000000..ff79f4663bead
--- /dev/null
+++ b/packages/experiments/src/components/Shimmer/index.ts
@@ -0,0 +1,2 @@
+export * from './Shimmer';
+export * from './Shimmer.types';
\ No newline at end of file
diff --git a/packages/experiments/src/demo/AppDefinition.tsx b/packages/experiments/src/demo/AppDefinition.tsx
index dbac4ab092ff0..4452a2655f980 100644
--- a/packages/experiments/src/demo/AppDefinition.tsx
+++ b/packages/experiments/src/demo/AppDefinition.tsx
@@ -70,6 +70,12 @@ export const AppDefinition: IAppDefinition = {
           name: 'TilesList',
           url: '#/examples/tileslist'
         },
+        {
+          component: require<any>('../components/Shimmer/ShimmerPage').ShimmerPage,
+          key: 'Shimmer',
+          name: 'Shimmer',
+          url: '#/examples/shimmer'
+        },
         {
           component: require<any>('../components/FloatingPicker/PeoplePicker/FloatingPeoplePickerPage').FloatingPeoplePickerPage,
           key: 'FloatingPeoplePicker',
diff --git a/packages/experiments/src/index.ts b/packages/experiments/src/index.ts
index 1d10ae9a7d8af..d5163bf4ed8cb 100644
--- a/packages/experiments/src/index.ts
+++ b/packages/experiments/src/index.ts
@@ -8,4 +8,5 @@ export { FloatingPeoplePicker } from './FloatingPicker';
 export { SelectedPeopleList } from './SelectedItemsList';
 export { ExtendedPeoplePicker } from './ExtendedPicker';
 export { Keytip } from './Keytip';
-export { KeytipLayer } from './KeytipLayer';
\ No newline at end of file
+export { KeytipLayer } from './KeytipLayer';
+export { Shimmer } from './Shimmer';
\ No newline at end of file

From 76a874fe31f68d88b31b738a4d600df0129924d8 Mon Sep 17 00:00:00 2001
From: Hlynur Tryggvason <hlynur.tryggvason@officeatwork.com>
Date: Sun, 11 Mar 2018 08:45:17 +0100
Subject: [PATCH 1557/1641] [TextField] onChange fix for IE when using
 multiline with placeholder (#3883)

---
 .../master_2018-02-22-16-54.json               | 11 +++++++++++
 .../components/TextField/TextField.test.tsx    | 18 ++++++++++++++++++
 .../src/components/TextField/TextField.tsx     |  4 +++-
 3 files changed, 32 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/master_2018-02-22-16-54.json

diff --git a/common/changes/office-ui-fabric-react/master_2018-02-22-16-54.json b/common/changes/office-ui-fabric-react/master_2018-02-22-16-54.json
new file mode 100644
index 0000000000000..b79e2875c4008
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/master_2018-02-22-16-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "[TextField] onChange fix for IE when using multiline with placeholder",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "hlynur.tryggvason@officeatwork.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
index ac1da301beaec..02710758b5a48 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.test.tsx
@@ -425,6 +425,24 @@ describe('TextField', () => {
     expect(callCount).toEqual(2);
   });
 
+  it('should not call onChanged when initial value is undefined and input change is an empty string', () => {
+    let callCount = 0;
+    const onChangedSpy = (value: string) => { callCount++; };
+
+    const renderedDOM: HTMLElement = renderIntoDocument(
+      <TextField
+        onChanged={ onChangedSpy }
+      />
+    );
+
+    expect(callCount).toEqual(0);
+    const inputDOM: HTMLInputElement = renderedDOM.getElementsByTagName('input')[0];
+
+    ReactTestUtils.Simulate.input(inputDOM, mockEvent(''));
+    ReactTestUtils.Simulate.change(inputDOM, mockEvent(''));
+    expect(callCount).toEqual(0);
+  });
+
   it('should select a range of text', () => {
     let textField: TextField | undefined;
     const initialValue = 'initial value';
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index 2183281ec7a2d..8962b4c61e680 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -73,8 +73,10 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
     this._id = getId('TextField');
     this._descriptionId = getId('TextFieldDescription');
 
+    this._latestValue = props.value || props.defaultValue || '';
+
     this.state = {
-      value: props.value || props.defaultValue || '',
+      value: this._latestValue,
       isFocused: false,
       errorMessage: ''
     };

From 7251c2dc69071e97fccbeb18971736f4e65cf301 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sun, 11 Mar 2018 13:54:29 -0700
Subject: [PATCH 1558/1641] ComboBox and ChoiceGroup: no more margins. (#4236)

* Fixing extraneous margins and paddings which create major inconsistency in combobox and spinbutton.

* Updating snaps.

* Adding change
---
 .../fix-css_2018-03-11-07-30.json                     | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.styles.ts        |  1 -
 .../ComboBox/__snapshots__/ComboBox.test.tsx.snap     |  1 -
 .../src/components/SpinButton/SpinButton.styles.ts    |  3 +--
 .../SpinButton/__snapshots__/SpinButton.test.tsx.snap |  4 ----
 5 files changed, 12 insertions(+), 8 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/fix-css_2018-03-11-07-30.json

diff --git a/common/changes/office-ui-fabric-react/fix-css_2018-03-11-07-30.json b/common/changes/office-ui-fabric-react/fix-css_2018-03-11-07-30.json
new file mode 100644
index 0000000000000..2c62e576776e0
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/fix-css_2018-03-11-07-30.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComoboBox and SpinButton: Removing excess margins and padding to make them consistent with TextField.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index 99044b7079c7d..1d357dc9ecd08 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -232,7 +232,6 @@ export const getStyles = memoizeFunction((
       fonts.medium,
       {
         boxShadow: 'none',
-        marginBottom: '10px',
         marginLeft: '0',
         paddingTop: '1px', // The 1px padding centers the input field, avoiding overlap in the browser
         paddingBottom: '1px',
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
index 330abb513c2b7..4410b1e5c5388 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
@@ -24,7 +24,6 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
           font-size: 14px;
           font-weight: 400;
           height: 32px;
-          margin-bottom: 10px;
           margin-left: 0;
           outline: 0;
           overflow: hidden;
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
index 2d969b4b8345c..b1540d651c2ab 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.styles.ts
@@ -139,8 +139,7 @@ export const getStyles = memoizeFunction((
       outline: 'none',
       fontSize: FontSizes.medium,
       width: '100%',
-      minWidth: '86px',
-      padding: '2px',
+      minWidth: '86px'
     },
     labelWrapper: {
       display: 'inline-flex'
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
index 8ce88ee3d736a..3b37ceae167ca 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
@@ -8,10 +8,6 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
         font-size: 14px;
         min-width: 86px;
         outline: none;
-        padding-bottom: 2px;
-        padding-left: 2px;
-        padding-right: 2px;
-        padding-top: 2px;
         width: 100%;
       }
 >

From ef1626107446404822245853e8c6a440c687c4a8 Mon Sep 17 00:00:00 2001
From: Mark Polak <mark@thedutchies.com>
Date: Mon, 12 Mar 2018 00:31:59 +0100
Subject: [PATCH 1559/1641] Some more create ref (#4237)

* Some more create ref

* A few more

* A few more

* A couple extra
---
 .../BaseExtendedPicker.tests.tsx              |   2 +-
 .../ExtendedPeoplePicker.Basic.Example.tsx    |  11 +-
 .../Items/SelectedItemWithContextMenu.tsx     |   8 +-
 .../Callout/CalloutContent.base.tsx           |  30 +++---
 .../src/components/Checkbox/Checkbox.tsx      |  15 ++-
 .../components/ChoiceGroup/ChoiceGroup.tsx    | 102 +++++++++---------
 .../src/components/Coachmark/Coachmark.tsx    |  37 ++++---
 .../components/Coachmark/Coachmark.types.ts   |   2 +-
 .../PositioningContainer.tsx                  |  27 +++--
 .../examples/Coachmark.Basic.Example.tsx      |   9 +-
 .../components/ColorPicker/ColorRectangle.tsx |  14 ++-
 .../components/ColorPicker/ColorSlider.tsx    |  13 ++-
 .../ComboBox/VirtualizedComboBox.tsx          |  20 ++--
 .../src/components/DatePicker/DatePicker.tsx  |  29 ++---
 .../components/DetailsList/DetailsHeader.tsx  |  16 +--
 .../src/components/DetailsList/DetailsRow.tsx |   9 +-
 16 files changed, 190 insertions(+), 154 deletions(-)

diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tests.tsx b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tests.tsx
index 8dcd1eefb9bfe..2e87311114a5a 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tests.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tests.tsx
@@ -47,7 +47,7 @@ const basicItemRenderer = (props: ISelectedItemProps<ISimple>) => {
 };
 
 const basicRenderFloatingPicker = (props: IBaseFloatingPickerProps<ISimple>) => {
-  return <BasePickerWithType {...props} />;
+  return <BasePickerWithType { ...props } />;
 };
 
 const basicRenderSelectedItemsList = (props: IBaseSelectedItemsListProps<ISimple>) => {
diff --git a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
index cd13f19e5e7a2..f54deb5ca5a35 100644
--- a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
@@ -117,11 +117,11 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
   }
 
   private _onRenderFloatingPicker(props: IBaseFloatingPickerProps<IPersonaProps>): JSX.Element {
-    return (<FloatingPeoplePicker {...props} />);
+    return (<FloatingPeoplePicker { ...props } />);
   }
 
   private _onRenderSelectedItems(props: IBaseSelectedItemsListProps<IExtendedPersonaProps>): JSX.Element {
-    return (<SelectedPeopleList {...props} />);
+    return (<SelectedPeopleList { ...props } />);
   }
 
   private _getEditingItemText(item: IExtendedPersonaProps): string {
@@ -198,8 +198,11 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
 
   @autobind
   private _shouldShowForceResolve(): boolean {
-    return this._validateInput(this._picker.floatingPicker.inputText)
-      && this._picker.floatingPicker.suggestions.length === 0;
+    return Boolean(
+      this._picker.floatingPicker &&
+      this._validateInput(this._picker.floatingPicker.inputText) &&
+      this._picker.floatingPicker.suggestions.length === 0
+    );
   }
 
   private _listContainsPersona(persona: IPersonaProps, personas: IPersonaProps[]): boolean {
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/SelectedItemWithContextMenu.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/SelectedItemWithContextMenu.tsx
index 7ace81e2f45ab..5abc76f2f865a 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/SelectedItemWithContextMenu.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/SelectedItemWithContextMenu.tsx
@@ -1,7 +1,7 @@
 /* tslint:disable */
 import * as React from 'react';
 /* tslint:enable */
-import { BaseComponent, autobind } from '../../../../Utilities';
+import { BaseComponent, autobind, createRef, RefObject } from '../../../../Utilities';
 import { IExtendedPersonaProps } from '../SelectedPeopleList';
 import { ContextualMenu, DirectionalHint } from 'office-ui-fabric-react/lib/ContextualMenu';
 import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
@@ -19,7 +19,7 @@ export interface ISelectedItemWithContextMenuProps extends IBaseProps {
 }
 
 export class SelectedItemWithContextMenu extends BaseComponent<ISelectedItemWithContextMenuProps, IPeoplePickerItemState> {
-  protected itemElement: HTMLElement;
+  protected itemElement: RefObject<HTMLDivElement> = createRef<HTMLDivElement>();
 
   constructor(props: ISelectedItemWithContextMenuProps) {
     super(props);
@@ -29,7 +29,7 @@ export class SelectedItemWithContextMenu extends BaseComponent<ISelectedItemWith
   public render(): JSX.Element {
     return (
       <div
-        ref={ this._resolveRef('itemElement') }
+        ref={ this.itemElement }
         onContextMenu={ this._onClick }
       >
         { this.props.renderedItem }
@@ -37,7 +37,7 @@ export class SelectedItemWithContextMenu extends BaseComponent<ISelectedItemWith
           <ContextualMenu
             items={ this.props.menuItems }
             shouldFocusOnMount={ true }
-            target={ this.itemElement }
+            target={ this.itemElement.value }
             onDismiss={ this._onCloseContextualMenu }
             directionalHint={ DirectionalHint.bottomLeftEdge }
           />)
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
index fe2192f173840..1277b102253bf 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
@@ -18,7 +18,8 @@ import {
   getWindow,
   getDocument,
   customizable,
-  css
+  css,
+  createRef
 } from '../../Utilities';
 import {
   positionCallout,
@@ -70,8 +71,8 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
 
   private _classNames: {[key in keyof ICalloutContentStyles]: string };
   private _didSetInitialFocus: boolean;
-  private _hostElement: HTMLDivElement;
-  private _calloutElement: HTMLDivElement;
+  private _hostElement = createRef<HTMLDivElement>();
+  private _calloutElement = createRef<HTMLDivElement>();
   private _targetWindow: Window;
   private _bounds: IRectangle;
   private _maxHeight: number | undefined;
@@ -177,7 +178,7 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
     // React.CSSProperties does not understand IRawStyle, so the inline animations will need to be cast as any for now.
     const content = (
       <div
-        ref={ this._resolveRef('_hostElement') }
+        ref={ this._hostElement }
         className={ this._classNames.container }
       >
         <div
@@ -185,7 +186,7 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
           style={ positions ? positions.elementPosition : OFF_SCREEN_STYLE }
           tabIndex={ -1 } // Safari and Firefox on Mac OS requires this to back-stop click events so focus remains in the Callout.
           // See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus
-          ref={ this._resolveRef('_calloutElement') }
+          ref={ this._calloutElement }
         >
 
           { beakVisible && (
@@ -233,7 +234,7 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
 
   protected _dismissOnLostFocus(ev: Event) {
     const target = ev.target as HTMLElement;
-    const clickedOutsideCallout = this._hostElement && !elementContains(this._hostElement, target);
+    const clickedOutsideCallout = this._hostElement.value && !elementContains(this._hostElement.value, target);
 
     if (
       (!this._target && clickedOutsideCallout) ||
@@ -247,9 +248,9 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
 
   @autobind
   protected _setInitialFocus() {
-    if (this.props.setInitialFocus && !this._didSetInitialFocus && this.state.positions) {
+    if (this.props.setInitialFocus && !this._didSetInitialFocus && this.state.positions && this._calloutElement.value) {
       this._didSetInitialFocus = true;
-      focusFirstChild(this._calloutElement);
+      focusFirstChild(this._calloutElement.value);
     }
   }
 
@@ -294,8 +295,8 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
 
   private _updatePosition() {
     const { positions } = this.state;
-    const hostElement: HTMLElement = this._hostElement;
-    const calloutElement: HTMLElement = this._calloutElement;
+    const hostElement: HTMLElement | null = this._hostElement.value;
+    const calloutElement: HTMLElement | null = this._calloutElement.value;
 
     if (hostElement && calloutElement) {
       let currentProps: IPositionProps | undefined;
@@ -407,9 +408,14 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
   }
 
   private _setHeightOffsetEveryFrame(): void {
-    if (this._calloutElement && this.props.finalHeight) {
+    if (this._calloutElement.value && this.props.finalHeight) {
       this._setHeightOffsetTimer = this._async.requestAnimationFrame(() => {
-        const calloutMainElem = this._calloutElement.lastChild as HTMLElement;
+        const calloutMainElem = this._calloutElement.value && this._calloutElement.value.lastChild as HTMLElement;
+
+        if (!calloutMainElem) {
+          return;
+        }
+
         const cardScrollHeight: number = calloutMainElem.scrollHeight;
         const cardCurrHeight: number = calloutMainElem.offsetHeight;
         const scrollDiff: number = cardScrollHeight - cardCurrHeight;
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
index f31a90d0b12bf..f466a7a4b0668 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
@@ -2,16 +2,15 @@ import * as React from 'react';
 import {
   BaseComponent,
   autobind,
-  getId
+  getId,
+  createRef,
+  customizable
 } from '../../Utilities';
 import { Icon } from '../../Icon';
 import {
   ICheckbox,
   ICheckboxProps,
 } from './Checkbox.types';
-import {
-  customizable
-} from '../../Utilities';
 import {
   ICheckboxClassNames,
   getClassNames
@@ -29,7 +28,7 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
     boxSide: 'start'
   };
 
-  private _checkBox: HTMLInputElement;
+  private _checkBox = createRef<HTMLInputElement>();
   private _id: string;
   private _classNames: ICheckboxClassNames;
 
@@ -101,7 +100,7 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
         { ...(checked !== undefined && { checked }) }
         { ...(defaultChecked !== undefined && { defaultChecked }) }
         disabled={ disabled }
-        ref={ this._resolveRef('_checkBox') }
+        ref={ this._checkBox }
         name={ name }
         id={ this._id }
         role='checkbox'
@@ -133,8 +132,8 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
   }
 
   public focus(): void {
-    if (this._checkBox) {
-      this._checkBox.focus();
+    if (this._checkBox.value) {
+      this._checkBox.value.focus();
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
index bef72017ca34c..76ef8785d77b1 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
@@ -9,7 +9,8 @@ import {
   css,
   getId,
   getNativeProps,
-  inputProperties
+  inputProperties,
+  createRef
 } from '../../Utilities';
 import * as stylesImport from './ChoiceGroup.scss';
 const styles: any = stylesImport;
@@ -28,7 +29,7 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
 
   private _id: string;
   private _labelId: string;
-  private _inputElement: HTMLInputElement | null;
+  private _inputElement = createRef<HTMLInputElement>();
 
   constructor(props: IChoiceGroupProps, ) {
     super(props);
@@ -80,56 +81,55 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
               option => Boolean(option.iconProps || option.imageSrc)
             ) && styles.optionsContainIconOrImage) }
           >
+            { options!.map((option: IChoiceGroupOption) => {
+              const {
+                onRenderField = this._onRenderField,
+                onRenderLabel = this._onRenderLabel
+              } = option;
 
-          { options!.map((option: IChoiceGroupOption) => {
-            const {
-              onRenderField = this._onRenderField,
-              onRenderLabel = this._onRenderLabel
-            } = option;
+              // Merge internal props into option
+              assign(option, {
+                checked: option.key === keyChecked,
+                disabled: option.disabled || this.props.disabled,
+                id: `${this._id}-${option.key}`,
+                labelId: `${this._labelId}-${option.key}`,
+                onRenderLabel
+              });
 
-            // Merge internal props into option
-            assign(option, {
-              checked: option.key === keyChecked,
-              disabled: option.disabled || this.props.disabled,
-              id: `${this._id}-${option.key}`,
-              labelId: `${this._labelId}-${option.key}`,
-              onRenderLabel
-            });
-
-            return (
-              <div
-                key={ option.key }
-                className={ css('ms-ChoiceField', styles.choiceField, {
-                  ['ms-ChoiceField--image ' + styles.choiceFieldIsImage]: !!option.imageSrc,
-                  ['ms-ChoiceField--icon ' + styles.choiceFieldIsIcon]: !!option.iconProps,
-                  ['is-inFocus ' + styles.choiceFieldIsInFocus]: option.key === keyFocused
-                })
-                }
-              >
-                <div className={ css('ms-ChoiceField-wrapper', styles.choiceFieldWrapper) }>
-                  <input
-                    ref={ this._resolveRef('_inputElement') }
-                    id={ option.id }
-                    className={ css('ms-ChoiceField-input', styles.input, {
-                      ['ms-ChoiceField--image ' + styles.inputHasImage]: !!option.imageSrc,
-                      ['ms-ChoiceField--icon ' + styles.inputHasIcon]: !!option.iconProps
-                    }) }
-                    type='radio'
-                    name={ this.props.name || this._id }
-                    disabled={ option.disabled || this.props.disabled }
-                    checked={ option.key === keyChecked }
-                    required={ required }
-                    onChange={ this._onChange.bind(this, option) }
-                    onFocus={ this._onFocus.bind(this, option) }
-                    onBlur={ this._onBlur.bind(this, option) }
-                    aria-labelledby={ option.id }
-                    { ...getNativeProps(option, inputProperties) }
-                  />
-                  { onRenderField(option, this._onRenderField) }
+              return (
+                <div
+                  key={ option.key }
+                  className={ css('ms-ChoiceField', styles.choiceField, {
+                    ['ms-ChoiceField--image ' + styles.choiceFieldIsImage]: !!option.imageSrc,
+                    ['ms-ChoiceField--icon ' + styles.choiceFieldIsIcon]: !!option.iconProps,
+                    ['is-inFocus ' + styles.choiceFieldIsInFocus]: option.key === keyFocused
+                  })
+                  }
+                >
+                  <div className={ css('ms-ChoiceField-wrapper', styles.choiceFieldWrapper) }>
+                    <input
+                      ref={ this._inputElement }
+                      id={ option.id }
+                      className={ css('ms-ChoiceField-input', styles.input, {
+                        ['ms-ChoiceField--image ' + styles.inputHasImage]: !!option.imageSrc,
+                        ['ms-ChoiceField--icon ' + styles.inputHasIcon]: !!option.iconProps
+                      }) }
+                      type='radio'
+                      name={ this.props.name || this._id }
+                      disabled={ option.disabled || this.props.disabled }
+                      checked={ option.key === keyChecked }
+                      required={ required }
+                      onChange={ this._onChange.bind(this, option) }
+                      onFocus={ this._onFocus.bind(this, option) }
+                      onBlur={ this._onBlur.bind(this, option) }
+                      aria-labelledby={ option.id }
+                      { ...getNativeProps(option, inputProperties) }
+                    />
+                    { onRenderField(option, this._onRenderField) }
+                  </div>
                 </div>
-              </div>
-            );
-          }) }
+              );
+            }) }
           </div>
         </div>
       </div>
@@ -137,8 +137,8 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
   }
 
   public focus() {
-    if (this._inputElement) {
-      this._inputElement.focus();
+    if (this._inputElement.value) {
+      this._inputElement.value.focus();
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.tsx b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.tsx
index d56719486ccb0..651275a1eaefb 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.tsx
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.tsx
@@ -1,6 +1,6 @@
 // Utilities
 import * as React from 'react';
-import { BaseComponent, classNamesFunction, autobind } from '../../Utilities';
+import { BaseComponent, classNamesFunction, autobind, createRef } from '../../Utilities';
 import { DefaultPalette } from '../../Styling';
 
 // Component Dependencies
@@ -80,9 +80,9 @@ export class Coachmark extends BaseComponent<ICoachmarkTypes, ICoachmarkState> {
    * The cached HTMLElement reference to the Entity Inner Host
    * element.
    */
-  private _entityInnerHostElement: HTMLElement;
-  private _translateAnimationContainer: HTMLElement;
-  private _positioningContainer: PositioningContainer;
+  private _entityInnerHostElement = createRef<HTMLDivElement>();
+  private _translateAnimationContainer = createRef<HTMLDivElement>();
+  private _positioningContainer = createRef<PositioningContainer>();
 
   constructor(props: ICoachmarkTypes) {
     super(props);
@@ -130,18 +130,18 @@ export class Coachmark extends BaseComponent<ICoachmarkTypes, ICoachmarkState> {
       <PositioningContainer
         target={ target }
         offsetFromTarget={ beakHeight }
-        componentRef={ this._resolveRef('_positioningContainer') }
+        componentRef={ this._positioningContainer }
       >
         <div className={ classNames.root }>
           <div className={ classNames.pulsingBeacon } />
           <div
             className={ classNames.translateAnimationContainer }
-            ref={ this._resolveRef('_translateAnimationContainer') }
+            ref={ this._translateAnimationContainer }
           >
             <div className={ classNames.scaleAnimationLayer }>
               <div className={ classNames.rotateAnimationLayer }>
                 {
-                  this._positioningContainer && <Beak
+                  this._positioningContainer.value && <Beak
                     width={ beakWidth }
                     height={ beakHeight }
                     left={ this.state.beakLeft }
@@ -151,13 +151,12 @@ export class Coachmark extends BaseComponent<ICoachmarkTypes, ICoachmarkState> {
                 <FocusZone>
                   <div
                     className={ classNames.entityHost }
-                    ref={ this._resolveRef('_entityHost') }
                     data-is-focusable={ true }
                     onFocus={ this._onFocusHandler }
                   >
                     <div
                       className={ classNames.entityInnerHost }
-                      ref={ this._resolveRef('_entityInnerHostElement') }
+                      ref={ this._entityInnerHostElement }
                     >
                       { children }
                     </div>
@@ -180,7 +179,7 @@ export class Coachmark extends BaseComponent<ICoachmarkTypes, ICoachmarkState> {
 
   public componentDidMount(): void {
     this._async.requestAnimationFrame(((): void => {
-      if ((this.state.entityInnerHostRect.width + this.state.entityInnerHostRect.width) === 0) {
+      if (this._entityInnerHostElement.value && (this.state.entityInnerHostRect.width + this.state.entityInnerHostRect.width) === 0) {
 
         // @TODO Eventually we need to add the various directions
         const beakLeft = (this.props.width! / 2) - (this.props.beakWidth! / 2);
@@ -189,8 +188,8 @@ export class Coachmark extends BaseComponent<ICoachmarkTypes, ICoachmarkState> {
         this.setState({
           isMeasuring: false,
           entityInnerHostRect: {
-            width: this._entityInnerHostElement.offsetWidth,
-            height: this._entityInnerHostElement.offsetHeight
+            width: this._entityInnerHostElement.value.offsetWidth,
+            height: this._entityInnerHostElement.value.offsetHeight
           },
           beakLeft: beakLeft + 'px',
           beakTop: beakTop + 'px'
@@ -217,13 +216,13 @@ export class Coachmark extends BaseComponent<ICoachmarkTypes, ICoachmarkState> {
       collapsed: false
     });
 
-    this._translateAnimationContainer.addEventListener('animationstart', (): void => {
+    this._translateAnimationContainer.value && this._translateAnimationContainer.value.addEventListener('animationstart', (): void => {
       if (this.props.onAnimationOpenStart) {
         this.props.onAnimationOpenStart();
       }
     });
 
-    this._translateAnimationContainer.addEventListener('animationend', (): void => {
+    this._translateAnimationContainer.value && this._translateAnimationContainer.value.addEventListener('animationend', (): void => {
       if (this.props.onAnimationOpenEnd) {
         this.props.onAnimationOpenEnd();
       }
@@ -244,9 +243,11 @@ export class Coachmark extends BaseComponent<ICoachmarkTypes, ICoachmarkState> {
     let targetElementRect: ClientRect;
 
     // Take the initial measure out of the initial render to prevent
-    // an unnessecary render.
+    // an unnecessary render.
     this._async.setTimeout(() => {
-      targetElementRect = this._entityInnerHostElement.getBoundingClientRect();
+      if (this._entityInnerHostElement.value) {
+        targetElementRect = this._entityInnerHostElement.value.getBoundingClientRect();
+      }
 
       // When the window resizes we want to async
       // get the bounding client rectangle.
@@ -259,7 +260,9 @@ export class Coachmark extends BaseComponent<ICoachmarkTypes, ICoachmarkState> {
         });
 
         timeoutIds.push(this._async.setTimeout((): void => {
-          targetElementRect = this._entityInnerHostElement.getBoundingClientRect();
+          if (this._entityInnerHostElement.value) {
+            targetElementRect = this._entityInnerHostElement.value.getBoundingClientRect();
+          }
         }, 100));
       });
     }, 10);
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.types.ts b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.types.ts
index feac3f0d16193..5b836fa39ea09 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.types.ts
@@ -18,7 +18,7 @@ export interface ICoachmarkTypes extends React.Props<Coachmark> {
   /**
    * The target that the TeachingBubble should try to position itself based on.
    */
-  target: HTMLElement;
+  target: HTMLElement | null;
 
   positioningContainerProps?: IPositioningContainerTypes;
 
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.tsx b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.tsx
index e0288146067cc..cbdb092e02ba7 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.tsx
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.tsx
@@ -17,7 +17,8 @@ import {
   elementContains,
   focusFirstChild,
   getWindow,
-  getDocument
+  getDocument,
+  createRef
 } from '../../../Utilities';
 
 import {
@@ -71,10 +72,10 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
   /**
    * The primary positioned div.
    */
-  private _positionedHost: HTMLDivElement;
+  private _positionedHost = createRef<HTMLDivElement>();
 
   // @TODO rename to reflect the name of this class
-  private _contentHost: HTMLDivElement;
+  private _contentHost = createRef<HTMLDivElement>();
 
   /**
    * Stores an instance of Window, used to check
@@ -164,7 +165,7 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
       && (positioningContainerMaxHeight! > getContentMaxHeight) ? getContentMaxHeight : positioningContainerMaxHeight!;
     const content = (
       <div
-        ref={ this._resolveRef('_positionedHost') }
+        ref={ this._positionedHost }
         className={ css('ms-PositioningContainer', styles.container) }
       >
         <div
@@ -180,7 +181,7 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
           style={ positions ? positions.elementPosition : OFF_SCREEN_STYLE }
           tabIndex={ -1 } // Safari and Firefox on Mac OS requires this to back-stop click events so focus remains in the Callout.
           // See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus
-          ref={ this._resolveRef('_contentHost') }
+          ref={ this._contentHost }
         >
           { children }
           { // @TODO apply to the content container
@@ -215,7 +216,7 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
 
   protected _dismissOnLostFocus(ev: Event): void {
     const target = ev.target as HTMLElement;
-    const clickedOutsideCallout = this._positionedHost && !elementContains(this._positionedHost, target);
+    const clickedOutsideCallout = this._positionedHost.value && !elementContains(this._positionedHost.value, target);
 
     if (
       (!this._target && clickedOutsideCallout) ||
@@ -229,9 +230,9 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
 
   @autobind
   protected _setInitialFocus(): void {
-    if (this.props.setInitialFocus && !this._didSetInitialFocus && this.state.positions) {
+    if (this._contentHost.value && this.props.setInitialFocus && !this._didSetInitialFocus && this.state.positions) {
       this._didSetInitialFocus = true;
-      focusFirstChild(this._contentHost);
+      focusFirstChild(this._contentHost.value);
     }
   }
 
@@ -267,8 +268,8 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
       onPositioned
     } = this.props;
 
-    const hostElement: HTMLElement = this._positionedHost;
-    const positioningContainerElement: HTMLElement = this._contentHost;
+    const hostElement = this._positionedHost.value;
+    const positioningContainerElement = this._contentHost.value;
 
     if (hostElement && positioningContainerElement) {
       let currentProps: IPositionProps | undefined;
@@ -388,7 +389,11 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
   private _setHeightOffsetEveryFrame(): void {
     if (this._contentHost && this.props.finalHeight) {
       this._setHeightOffsetTimer = this._async.requestAnimationFrame(() => {
-        const positioningContainerMainElem = this._contentHost.lastChild as HTMLElement;
+        if (!this._contentHost.value) {
+          return;
+        }
+
+        const positioningContainerMainElem = this._contentHost.value.lastChild as HTMLElement;
         const cardScrollHeight: number = positioningContainerMainElem.scrollHeight;
         const cardCurrHeight: number = positioningContainerMainElem.offsetHeight;
         const scrollDiff: number = cardScrollHeight - cardCurrHeight;
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx
index bb57e2d0a0cd4..34cf5c556d171 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/examples/Coachmark.Basic.Example.tsx
@@ -6,7 +6,8 @@ import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { IStyle } from '../../../Styling';
 import {
   BaseComponent,
-  classNamesFunction
+  classNamesFunction,
+  createRef
 } from 'office-ui-fabric-react/lib/Utilities';
 
 export interface ICoachmarkBasicExampleState {
@@ -28,7 +29,7 @@ export interface ICoachmarkBasicExampleStyles {
 }
 
 export class CoachmarkBasicExample extends BaseComponent<{}, ICoachmarkBasicExampleState> {
-  private _targetButton: HTMLElement;
+  private _targetButton = createRef<HTMLDivElement>();
 
   public constructor(props: {}) {
     super(props);
@@ -63,7 +64,7 @@ export class CoachmarkBasicExample extends BaseComponent<{}, ICoachmarkBasicExam
       <div className={ classNames.root }>
         <div
           className={ classNames.buttonContainer }
-          ref={ this._resolveRef('_targetButton') }
+          ref={ this._targetButton }
         >
           <DefaultButton
             onClick={ this._onShowMenuClicked }
@@ -72,7 +73,7 @@ export class CoachmarkBasicExample extends BaseComponent<{}, ICoachmarkBasicExam
         </div>
         { isVisible && (
           <Coachmark
-            target={ this._targetButton }
+            target={ this._targetButton.value }
           >
             <TeachingBubbleContent
               headline='Example Title'
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx
index 3adb8739c99f3..89faa3b7c9e17 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx
@@ -3,7 +3,8 @@ import {
   BaseComponent,
   assign,
   autobind,
-  css
+  css,
+  createRef
 } from '../../Utilities';
 import {
   IColor,
@@ -35,7 +36,7 @@ export class ColorRectangle extends BaseComponent<IColorRectangleProps, IColorPi
     minSize: 220
   };
 
-  private _root: HTMLDivElement;
+  private _root = createRef<HTMLDivElement>();
 
   constructor(props: IColorRectangleProps) {
     super(props);
@@ -68,7 +69,7 @@ export class ColorRectangle extends BaseComponent<IColorRectangleProps, IColorPi
     const { color, fullColorString } = this.state;
 
     return (
-      <div ref={ this._resolveRef('_root') } className={ css('ms-ColorPicker-colorRect', styles.colorRect) } style={ { minWidth: minSize, minHeight: minSize, backgroundColor: fullColorString } } onMouseDown={ this._onMouseDown }>
+      <div ref={ this._root } className={ css('ms-ColorPicker-colorRect', styles.colorRect) } style={ { minWidth: minSize, minHeight: minSize, backgroundColor: fullColorString } } onMouseDown={ this._onMouseDown }>
         <div className={ css('ms-ColorPicker-light', styles.light) } />
         <div className={ css('ms-ColorPicker-dark', styles.dark) } />
         <div className={ css('ms-ColorPicker-thumb', styles.thumb) } style={ { left: color!.s + '%', top: (MAX_COLOR_VALUE - color!.v) + '%', backgroundColor: color!.str } } />
@@ -87,7 +88,12 @@ export class ColorRectangle extends BaseComponent<IColorRectangleProps, IColorPi
   @autobind
   private _onMouseMove(ev: React.MouseEvent<HTMLElement>) {
     const { color, onSVChanged } = this.props;
-    const rectSize = this._root.getBoundingClientRect();
+
+    if (!this._root.value) {
+      return;
+    }
+
+    const rectSize = this._root.value.getBoundingClientRect();
 
     const sPercentage = (ev.clientX - rectSize.left) / rectSize.width;
     const vPercentage = (ev.clientY - rectSize.top) / rectSize.height;
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
index e2a96508f88d4..5c74c41296b04 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
@@ -2,7 +2,8 @@ import * as React from 'react';
 import {
   BaseComponent,
   autobind,
-  css
+  css,
+  createRef
 } from '../../Utilities';
 import * as stylesImport from './ColorPicker.scss';
 const styles: any = stylesImport;
@@ -34,7 +35,7 @@ export class ColorSlider extends BaseComponent<IColorSliderProps, IColorSliderSt
     value: 0
   };
 
-  private _root: HTMLElement;
+  private _root = createRef<HTMLDivElement>();
 
   constructor(props: IColorSliderProps) {
     super(props);
@@ -62,7 +63,7 @@ export class ColorSlider extends BaseComponent<IColorSliderProps, IColorSliderSt
 
     return (
       <div
-        ref={ this._resolveRef('_root') }
+        ref={ this._root }
         className={ css(
           'ms-ColorPicker-slider',
           styles.slider,
@@ -87,8 +88,12 @@ export class ColorSlider extends BaseComponent<IColorSliderProps, IColorSliderSt
 
   @autobind
   private _onMouseMove(ev: React.MouseEvent<HTMLElement>) {
+    if (!this._root.value) {
+      return;
+    }
+
     const { onChanged, minValue, maxValue } = this.props;
-    const rectSize = this._root.getBoundingClientRect();
+    const rectSize = this._root.value.getBoundingClientRect();
 
     const currentPercentage = (ev.clientX - rectSize.left) / rectSize.width;
     const newValue = Math.min(maxValue!, Math.max(minValue!, currentPercentage * maxValue!));
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx
index c48cb455546b2..210f51d51d1db 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { autobind, BaseComponent } from '../../Utilities';
+import { autobind, BaseComponent, createRef } from '../../Utilities';
 import { ComboBox } from './ComboBox';
 import { IComboBoxProps, IComboBox } from './ComboBox.types';
 import { List } from '../../List';
@@ -7,19 +7,19 @@ import { ISelectableOption } from '../../utilities/selectableOption/SelectableOp
 
 export class VirtualizedComboBox extends BaseComponent<IComboBoxProps, {}> implements IComboBox {
   /** The combo box element */
-  private _comboBox: ComboBox;
+  private _comboBox = createRef<IComboBox>();
   /** The virtualized list element */
-  private _list: List;
+  private _list = createRef<List>();
 
   public dismissMenu(): void {
-    if (this._comboBox) {
-      return this._comboBox.dismissMenu();
+    if (this._comboBox.value) {
+      return this._comboBox.value.dismissMenu();
     }
   }
 
   public focus() {
-    if (this._comboBox) {
-      this._comboBox.focus();
+    if (this._comboBox.value) {
+      this._comboBox.value.focus();
       return true;
     }
 
@@ -30,7 +30,7 @@ export class VirtualizedComboBox extends BaseComponent<IComboBoxProps, {}> imple
     return (
       <ComboBox
         { ...this.props }
-        componentRef={ this._resolveRef('_comboBox') }
+        componentRef={ this._comboBox }
         onRenderList={ this._onRenderList }
         onScrollToItem={ this._onScrollToItem }
       />
@@ -46,7 +46,7 @@ export class VirtualizedComboBox extends BaseComponent<IComboBoxProps, {}> imple
     // Render virtualized list
     return (
       <List
-        componentRef={ this._resolveRef('_list') }
+        componentRef={ this._list }
         role='listbox'
         items={ props.options }
         onRenderCell={ onRenderItem ? (item: ISelectableOption) => onRenderItem(item) : () => null }
@@ -57,6 +57,6 @@ export class VirtualizedComboBox extends BaseComponent<IComboBoxProps, {}> imple
   @autobind
   protected _onScrollToItem(itemIndex: number): void {
     // We are using the List component, call scrollToIndex
-    this._list.scrollToIndex(itemIndex);
+    this._list.value && this._list.value.scrollToIndex(itemIndex);
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 8cedfbe0b5223..8a4010c10bcaa 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -17,7 +17,8 @@ import {
   autobind,
   BaseComponent,
   KeyCodes,
-  css
+  css,
+  createRef
 } from '../../Utilities';
 import { compareDates, compareDatePart } from '../../utilities/dateMath/DateMath';
 import * as stylesImport from './DatePicker.scss';
@@ -121,9 +122,9 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     dateTimeFormatter: undefined
   };
 
-  private _calendar: ICalendar;
-  private _datePickerDiv: HTMLDivElement;
-  private _textField: ITextField;
+  private _calendar = createRef<ICalendar>();
+  private _datePickerDiv = createRef<HTMLDivElement>();
+  private _textField = createRef<ITextField>();
   private _preventFocusOpeningPicker: boolean;
 
   constructor(props: IDatePickerProps) {
@@ -209,7 +210,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
         { label && (
           <Label required={ isRequired }>{ label }</Label>
         ) }
-        <div ref={ this._resolveRef('_datePickerDiv') }>
+        <div ref={ this._datePickerDiv }>
           <TextField
             className={ styles.textField }
             ariaLabel={ ariaLabel }
@@ -236,7 +237,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
             } }
             readOnly={ !allowTextInput }
             value={ formattedDate }
-            componentRef={ this._resolveRef('_textField') }
+            componentRef={ this._textField }
             role={ allowTextInput ? 'combobox' : 'menu' }
           />
         </div>
@@ -248,7 +249,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
             className={ css('ms-DatePicker-callout') }
             gapSpace={ 0 }
             doNotLayer={ false }
-            target={ this._datePickerDiv }
+            target={ this._datePickerDiv.value }
             directionalHint={ DirectionalHint.bottomLeftEdge }
             onDismiss={ this._calendarDismissed }
             onPositioned={ this._onCalloutPositioned }
@@ -270,7 +271,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
               dateTimeFormatter={ this.props.dateTimeFormatter }
               minDate={ minDate }
               maxDate={ maxDate }
-              componentRef={ this._resolveRef('_calendar') }
+              componentRef={ this._calendar }
             />
           </Callout>
         ) }
@@ -279,8 +280,8 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
   }
 
   public focus(): void {
-    if (this._textField) {
-      this._textField.focus();
+    if (this._textField.value) {
+      this._textField.value.focus();
     }
   }
 
@@ -308,7 +309,9 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
 
   @autobind
   private _onCalloutPositioned() {
-    this._calendar.focus();
+    if (this._calendar.value) {
+      this._calendar.value.focus();
+    }
   }
 
   @autobind
@@ -421,8 +424,8 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     this._preventFocusOpeningPicker = true;
     this._dismissDatePickerPopup();
 
-    if (this._textField) {
-      this._textField.focus();
+    if (this._textField.value) {
+      this._textField.value.focus();
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index f1bd5d7749ab9..c873d087ae8bc 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -7,7 +7,8 @@ import {
   getRTL,
   getId,
   KeyCodes,
-  IRenderFunction
+  IRenderFunction,
+  createRef
 } from '../../Utilities';
 import { IColumn, DetailsListLayoutMode, ColumnActionsMode } from './DetailsList.types';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
@@ -82,7 +83,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
     collapseAllVisibility: CollapseAllVisibility.visible
   };
 
-  private _root: FocusZone;
+  private _root = createRef<FocusZone>();
 
   private _id: string;
 
@@ -102,10 +103,13 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
 
   public componentDidMount() {
     const { selection } = this.props;
+    const rootElement = this._root.value;
 
-    this._events.on(selection, SELECTION_CHANGE, this._onSelectionChanged);
+    if (!rootElement) {
+      return;
+    }
 
-    const rootElement = ReactDOM.findDOMNode(this._root);
+    this._events.on(selection, SELECTION_CHANGE, this._onSelectionChanged);
 
     // We need to use native on this to avoid MarqueeSelection from handling the event before us.
     this._events.on(rootElement, 'mousedown', this._onRootMouseDown);
@@ -142,7 +146,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
           (selectAllVisibility === SelectAllVisibility.hidden) && ('is-selectAllHidden ' + styles.rootIsSelectAllHidden),
           (!!columnResizeDetails && isSizing) && 'is-resizingColumn'
         ) }
-        ref={ this._resolveRef('_root') }
+        ref={ this._root }
         onMouseMove={ this._onRootMouseMove }
         data-automationid='DetailsHeader'
         direction={ FocusZoneDirection.horizontal }
@@ -326,7 +330,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
 
   /** Set focus to the active thing in the focus area. */
   public focus(): boolean {
-    return this._root.focus();
+    return Boolean(this._root.value && this._root.value.focus());
   }
 
   private _renderColumnSizer(columnIndex: number) {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index 5e6d32e574003..67c4b30c56a75 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -8,7 +8,8 @@ import {
   css,
   shallowCompare,
   getNativeProps,
-  divProperties
+  divProperties,
+  createRef
 } from '../../Utilities';
 import { IColumn, CheckboxVisibility } from './DetailsList.types';
 import { DetailsRowCheck, IDetailsRowCheckProps } from './DetailsRowCheck';
@@ -77,7 +78,7 @@ const DEFAULT_DROPPING_CSS_CLASS = 'is-dropping';
 export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState> {
   private _root: HTMLElement | undefined;
   private _cellMeasurer: HTMLElement;
-  private _focusZone: IFocusZone;
+  private _focusZone = createRef<IFocusZone>();
   private _droppingClassNames: string;
   private _hasMounted: boolean;
   private _dragDropSubscription: IDisposable;
@@ -205,7 +206,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
         { ...getNativeProps(this.props, divProperties) }
         direction={ FocusZoneDirection.horizontal }
         ref={ this._onRootRef }
-        componentRef={ this._resolveRef('_focusZone') }
+        componentRef={ this._focusZone }
         role='row'
         aria-label={ ariaLabel }
         ariaDescribedBy={ ariaDescribedBy }
@@ -310,7 +311,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
   }
 
   public focus(forceIntoFirstElement: boolean = false): boolean {
-    return !!this._focusZone && this._focusZone.focus(forceIntoFirstElement);
+    return !!this._focusZone.value && this._focusZone.value.focus(forceIntoFirstElement);
   }
 
   protected _onRenderCheck(props: IDetailsRowCheckProps) {

From 3dbf37f57f62f30f758e986005c80b6f035edc63 Mon Sep 17 00:00:00 2001
From: dzearing <dzearing@hotmail.com>
Date: Sun, 11 Mar 2018 22:49:07 -0700
Subject: [PATCH 1560/1641] Adjusting release notes script.

---
 scripts/updateReleaseNotes.js | 49 ++++++++++++++++++++++++++++++++---
 1 file changed, 46 insertions(+), 3 deletions(-)

diff --git a/scripts/updateReleaseNotes.js b/scripts/updateReleaseNotes.js
index d89bfa30a35a2..c562af350f58c 100644
--- a/scripts/updateReleaseNotes.js
+++ b/scripts/updateReleaseNotes.js
@@ -94,14 +94,54 @@ function getChangeComments(title, commentsArray) {
   var comments = '';
   if (commentsArray) {
     comments = "# " + title + (EOL + EOL);
-    commentsArray.forEach(function (comment) {
-      comments += "- " + comment.comment + EOL;
+    commentsArray.forEach(async (comment) => {
+      var searchResult;
+
+      comments += `- ${comment.comment}`;
+      if (comment.commit) {
+        comments += ` ([commit](https://github.com/${REPO_DETAILS.owner}/${REPO_DETAILS.repo}/commit/${comment.commit})`;
+        searchResult = await getPullRequest(comment.commit);
+
+        if (searchResult) {
+          comments += ` by [${searchResult.author}](${searchResult.authorUrl}), pr [#${searchResult.number}](${searchResult.url})`;
+        }
+
+        comments += `)`;
+      }
+      comments += EOL;
     });
     comments += EOL;
   }
   return comments;
 };
 
+function getPullRequest(commitHash) {
+  return new Promise((resolve, reject) => {
+
+    github.search.issues({ q: commitHash }, (response, result) => {
+      if (result && result.items && result.items.length >= 1) {
+        var item = result.items.find(
+          item => item.repository_url === `https://api.github.com/repos/${REPO_DETAILS.owner}/${REPO_DETAILS.repo}`
+        );
+
+        if (item) {
+          resolve({
+            number: item.number,
+            url: item.html_url,
+            author: item.user.login,
+            authorUrl: item.user.html_url
+          });
+
+          return;
+        }
+      }
+
+      resolve(null);
+    });
+
+  });
+}
+
 /**
  * Builds a map of changelog tags to entries defined in CHANGELOG.json files.
  */
@@ -112,7 +152,6 @@ function getChangelogTagMap() {
     let changelog = JSON.parse(result.content);
     changelog.entries.forEach(entry => {
       entry.name = changelog.name;
-      entry.body = getMarkdownForEntry(entry);
       map.set(entry.tag, entry);
     });
   });
@@ -197,6 +236,8 @@ function updateReleaseNotes(shouldPatchChangelog) {
           console.log(`Creating release notes for ${entry.name} ${entry.version}`);
           count++;
 
+          releaseDetails.body = getMarkdownForEntry(entry);
+
           if (SHOULD_APPLY) {
             github.repos.createRelease(releaseDetails, (err, cb) => {
               if (err) {
@@ -212,6 +253,8 @@ function updateReleaseNotes(shouldPatchChangelog) {
 
           if (SHOULD_APPLY) {
             releaseDetails.id = releases.get(tag).id;
+            releaseDetails.body = getMarkdownForEntry(entry);
+
             github.repos.editRelease(releaseDetails, (err, cb) => {
               if (err) {
                 throw new Error(`Failed to commit release notes for ${entry.name} ${entry.version}.${EOL}${err}`);

From 1024409245521c09fd1479dc5a788efbd94b42bb Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Mon, 12 Mar 2018 06:29:20 +0000
Subject: [PATCH 1561/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/CHANGELOG.json                 | 17 +++++
 apps/ssr-tests/CHANGELOG.md                   |  9 +++
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/CHANGELOG.json        | 17 +++++
 apps/test-bundle-button/CHANGELOG.md          |  9 +++
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/CHANGELOG.json                  | 17 +++++
 apps/todo-app/CHANGELOG.md                    |  9 +++
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/CHANGELOG.json                  | 17 +++++
 apps/vr-tests/CHANGELOG.md                    |  9 +++
 apps/vr-tests/package.json                    |  2 +-
 ...ibr-ShimmerComponent_2018-03-06-18-42.json | 11 ----
 ...-system-font-default_2018-03-07-19-33.json | 11 ----
 ...last-child-focuszone_2018-03-04-09-07.json | 11 ----
 .../utilities/master_2018-03-09-00-06.json    | 11 ----
 .../styledDisplayName_2018-03-07-00-54.json   | 11 ----
 ...o-fixVariantsVersion_2018-03-08-02-36.json | 11 ----
 ...phkuo-variantsReadme_2018-03-10-01-12.json | 11 ----
 ...unt_And_Select_Color_2018-03-08-01-45.json | 11 ----
 .../addRelProp_2018-03-09-19-29.json          | 11 ----
 .../fix-css_2018-03-11-07-30.json             | 11 ----
 ...last-child-focuszone_2018-03-04-09-07.json | 11 ----
 ...ind-facepileOverflow_2018-02-26-15-58.json | 11 ----
 .../master_2018-02-22-16-54.json              | 11 ----
 .../master_2018-03-09-00-06.json              | 11 ----
 ...axlus-scrollIntoView_2018-03-09-22-19.json | 11 ----
 ...list-on-column-click_2018-03-09-20-51.json | 11 ----
 packages/example-app-base/package.json        |  4 +-
 packages/experiments/CHANGELOG.json           | 19 ++++++
 packages/experiments/CHANGELOG.md             |  9 ++-
 packages/experiments/package.json             |  4 +-
 packages/file-type-icons/package.json         |  2 +-
 packages/icons/package.json                   |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 64 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 20 +++++-
 packages/office-ui-fabric-react/package.json  |  6 +-
 packages/styling/CHANGELOG.json               | 19 ++++++
 packages/styling/CHANGELOG.md                 |  9 ++-
 packages/styling/package.json                 |  4 +-
 packages/utilities/CHANGELOG.json             | 26 ++++++++
 packages/utilities/CHANGELOG.md               | 14 +++-
 packages/utilities/package.json               |  2 +-
 packages/variants/CHANGELOG.json              | 24 +++++++
 packages/variants/CHANGELOG.md                | 10 ++-
 packages/variants/package.json                |  4 +-
 47 files changed, 332 insertions(+), 200 deletions(-)
 create mode 100644 apps/ssr-tests/CHANGELOG.json
 create mode 100644 apps/ssr-tests/CHANGELOG.md
 create mode 100644 apps/test-bundle-button/CHANGELOG.json
 create mode 100644 apps/test-bundle-button/CHANGELOG.md
 create mode 100644 apps/todo-app/CHANGELOG.json
 create mode 100644 apps/todo-app/CHANGELOG.md
 create mode 100644 apps/vr-tests/CHANGELOG.json
 create mode 100644 apps/vr-tests/CHANGELOG.md
 delete mode 100644 common/changes/@uifabric/experiments/v-vibr-ShimmerComponent_2018-03-06-18-42.json
 delete mode 100644 common/changes/@uifabric/styling/chrisgo-system-font-default_2018-03-07-19-33.json
 delete mode 100644 common/changes/@uifabric/utilities/focustrapzone-last-child-focuszone_2018-03-04-09-07.json
 delete mode 100644 common/changes/@uifabric/utilities/master_2018-03-09-00-06.json
 delete mode 100644 common/changes/@uifabric/utilities/styledDisplayName_2018-03-07-00-54.json
 delete mode 100644 common/changes/@uifabric/variants/phkuo-fixVariantsVersion_2018-03-08-02-36.json
 delete mode 100644 common/changes/@uifabric/variants/phkuo-variantsReadme_2018-03-10-01-12.json
 delete mode 100644 common/changes/office-ui-fabric-react/Run_onCellFocused_Before_Unmount_And_Select_Color_2018-03-08-01-45.json
 delete mode 100644 common/changes/office-ui-fabric-react/addRelProp_2018-03-09-19-29.json
 delete mode 100644 common/changes/office-ui-fabric-react/fix-css_2018-03-11-07-30.json
 delete mode 100644 common/changes/office-ui-fabric-react/focustrapzone-last-child-focuszone_2018-03-04-09-07.json
 delete mode 100644 common/changes/office-ui-fabric-react/malind-facepileOverflow_2018-02-26-15-58.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2018-02-22-16-54.json
 delete mode 100644 common/changes/office-ui-fabric-react/master_2018-03-09-00-06.json
 delete mode 100644 common/changes/office-ui-fabric-react/maxlus-scrollIntoView_2018-03-09-22-19.json
 delete mode 100644 common/changes/office-ui-fabric-react/non-optional-details-list-on-column-click_2018-03-09-20-51.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 54e1cb9eac983..d434349458272 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.62.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.63.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/CHANGELOG.json b/apps/ssr-tests/CHANGELOG.json
new file mode 100644
index 0000000000000..a7493db923324
--- /dev/null
+++ b/apps/ssr-tests/CHANGELOG.json
@@ -0,0 +1,17 @@
+{
+  "name": "ssr-tests",
+  "entries": [
+    {
+      "version": "5.0.1",
+      "tag": "ssr-tests_v5.0.1",
+      "date": "Mon, 12 Mar 2018 06:29:20 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.62.1 <6.0.0` to `>=5.63.0 <6.0.0`"
+          }
+        ]
+      }
+    }
+  ]
+}
\ No newline at end of file
diff --git a/apps/ssr-tests/CHANGELOG.md b/apps/ssr-tests/CHANGELOG.md
new file mode 100644
index 0000000000000..00e6e7475291d
--- /dev/null
+++ b/apps/ssr-tests/CHANGELOG.md
@@ -0,0 +1,9 @@
+# Change Log - ssr-tests
+
+This log was last generated on Mon, 12 Mar 2018 06:29:20 GMT and should not be manually modified.
+
+## 5.0.1
+Mon, 12 Mar 2018 06:29:20 GMT
+
+*Initial release*
+
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 98dcf08cb1f89..ea04e6f7bb74d 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.62.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.63.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/CHANGELOG.json b/apps/test-bundle-button/CHANGELOG.json
new file mode 100644
index 0000000000000..685744c0f8f93
--- /dev/null
+++ b/apps/test-bundle-button/CHANGELOG.json
@@ -0,0 +1,17 @@
+{
+  "name": "test-bundle-button",
+  "entries": [
+    {
+      "version": "5.0.1",
+      "tag": "test-bundle-button_v5.0.1",
+      "date": "Mon, 12 Mar 2018 06:29:20 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.62.1 <6.0.0` to `>=5.63.0 <6.0.0`"
+          }
+        ]
+      }
+    }
+  ]
+}
\ No newline at end of file
diff --git a/apps/test-bundle-button/CHANGELOG.md b/apps/test-bundle-button/CHANGELOG.md
new file mode 100644
index 0000000000000..00ae70f82d049
--- /dev/null
+++ b/apps/test-bundle-button/CHANGELOG.md
@@ -0,0 +1,9 @@
+# Change Log - test-bundle-button
+
+This log was last generated on Mon, 12 Mar 2018 06:29:20 GMT and should not be manually modified.
+
+## 5.0.1
+Mon, 12 Mar 2018 06:29:20 GMT
+
+*Initial release*
+
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 2bcaac9d9e273..7faab6749a3bb 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.62.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.63.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/CHANGELOG.json b/apps/todo-app/CHANGELOG.json
new file mode 100644
index 0000000000000..a74c6bfd883d1
--- /dev/null
+++ b/apps/todo-app/CHANGELOG.json
@@ -0,0 +1,17 @@
+{
+  "name": "todo-app",
+  "entries": [
+    {
+      "version": "5.0.1",
+      "tag": "todo-app_v5.0.1",
+      "date": "Mon, 12 Mar 2018 06:29:20 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.62.1 <6.0.0` to `>=5.63.0 <6.0.0`"
+          }
+        ]
+      }
+    }
+  ]
+}
\ No newline at end of file
diff --git a/apps/todo-app/CHANGELOG.md b/apps/todo-app/CHANGELOG.md
new file mode 100644
index 0000000000000..9248491dc4d8d
--- /dev/null
+++ b/apps/todo-app/CHANGELOG.md
@@ -0,0 +1,9 @@
+# Change Log - todo-app
+
+This log was last generated on Mon, 12 Mar 2018 06:29:20 GMT and should not be manually modified.
+
+## 5.0.1
+Mon, 12 Mar 2018 06:29:20 GMT
+
+*Initial release*
+
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 1637c45a2ed5a..3a6c4879e2227 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.62.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.63.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/apps/vr-tests/CHANGELOG.json b/apps/vr-tests/CHANGELOG.json
new file mode 100644
index 0000000000000..235caca4618d0
--- /dev/null
+++ b/apps/vr-tests/CHANGELOG.json
@@ -0,0 +1,17 @@
+{
+  "name": "vr-tests",
+  "entries": [
+    {
+      "version": "5.0.1",
+      "tag": "vr-tests_v5.0.1",
+      "date": "Mon, 12 Mar 2018 06:29:20 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.62.1 <6.0.0` to `>=5.63.0 <6.0.0`"
+          }
+        ]
+      }
+    }
+  ]
+}
\ No newline at end of file
diff --git a/apps/vr-tests/CHANGELOG.md b/apps/vr-tests/CHANGELOG.md
new file mode 100644
index 0000000000000..e0559aaa4ce10
--- /dev/null
+++ b/apps/vr-tests/CHANGELOG.md
@@ -0,0 +1,9 @@
+# Change Log - vr-tests
+
+This log was last generated on Mon, 12 Mar 2018 06:29:20 GMT and should not be manually modified.
+
+## 5.0.1
+Mon, 12 Mar 2018 06:29:20 GMT
+
+*Initial release*
+
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 5216fc90f989b..3197628e7cba0 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.62.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.63.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/common/changes/@uifabric/experiments/v-vibr-ShimmerComponent_2018-03-06-18-42.json b/common/changes/@uifabric/experiments/v-vibr-ShimmerComponent_2018-03-06-18-42.json
deleted file mode 100644
index 463a9790d75ce..0000000000000
--- a/common/changes/@uifabric/experiments/v-vibr-ShimmerComponent_2018-03-06-18-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Adds a new Shimmer Component to experiments package.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "v-vibr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/chrisgo-system-font-default_2018-03-07-19-33.json b/common/changes/@uifabric/styling/chrisgo-system-font-default_2018-03-07-19-33.json
deleted file mode 100644
index a96f71246a551..0000000000000
--- a/common/changes/@uifabric/styling/chrisgo-system-font-default_2018-03-07-19-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "By default, try to use the system font before downloading a web font",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "christianjordangonzalez@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/focustrapzone-last-child-focuszone_2018-03-04-09-07.json b/common/changes/@uifabric/utilities/focustrapzone-last-child-focuszone_2018-03-04-09-07.json
deleted file mode 100644
index 277dafdd7ae50..0000000000000
--- a/common/changes/@uifabric/utilities/focustrapzone-last-child-focuszone_2018-03-04-09-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Focus utility getPreviousElement did not correctly consider the tabbable argument when considering the current node. This can affect how FocusZones are processed, since only one element in a zone will have tab index set. This, in turn, affects how FocusTrapZone traps focus, since getPreviousElement is used during trapping focus.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "sllynn8907@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/master_2018-03-09-00-06.json b/common/changes/@uifabric/utilities/master_2018-03-09-00-06.json
deleted file mode 100644
index 7ed34983dd680..0000000000000
--- a/common/changes/@uifabric/utilities/master_2018-03-09-00-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "added hoistStatics function for use with decorators to fix broken statics issue, and added the fuction to the customizable decorator",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/styledDisplayName_2018-03-07-00-54.json b/common/changes/@uifabric/utilities/styledDisplayName_2018-03-07-00-54.json
deleted file mode 100644
index 2ff42449232f1..0000000000000
--- a/common/changes/@uifabric/utilities/styledDisplayName_2018-03-07-00-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Styled: Add display name to styled wrapper",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "erabelle@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/variants/phkuo-fixVariantsVersion_2018-03-08-02-36.json b/common/changes/@uifabric/variants/phkuo-fixVariantsVersion_2018-03-08-02-36.json
deleted file mode 100644
index 75d271686afca..0000000000000
--- a/common/changes/@uifabric/variants/phkuo-fixVariantsVersion_2018-03-08-02-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/variants",
-      "comment": "fix version for variants package",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/variants",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/variants/phkuo-variantsReadme_2018-03-10-01-12.json b/common/changes/@uifabric/variants/phkuo-variantsReadme_2018-03-10-01-12.json
deleted file mode 100644
index 86ea4d03cf7ee..0000000000000
--- a/common/changes/@uifabric/variants/phkuo-variantsReadme_2018-03-10-01-12.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/variants",
-      "comment": "update readme",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/variants",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/Run_onCellFocused_Before_Unmount_And_Select_Color_2018-03-08-01-45.json b/common/changes/office-ui-fabric-react/Run_onCellFocused_Before_Unmount_And_Select_Color_2018-03-08-01-45.json
deleted file mode 100644
index 6dc28ab1ec213..0000000000000
--- a/common/changes/office-ui-fabric-react/Run_onCellFocused_Before_Unmount_And_Select_Color_2018-03-08-01-45.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Run onCellFocused before unmount and before select color",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "madosal@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/addRelProp_2018-03-09-19-29.json b/common/changes/office-ui-fabric-react/addRelProp_2018-03-09-19-29.json
deleted file mode 100644
index f66600b8c6381..0000000000000
--- a/common/changes/office-ui-fabric-react/addRelProp_2018-03-09-19-29.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add rel option for Contextual Menu Items",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "alhenry@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/fix-css_2018-03-11-07-30.json b/common/changes/office-ui-fabric-react/fix-css_2018-03-11-07-30.json
deleted file mode 100644
index 2c62e576776e0..0000000000000
--- a/common/changes/office-ui-fabric-react/fix-css_2018-03-11-07-30.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComoboBox and SpinButton: Removing excess margins and padding to make them consistent with TextField.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/focustrapzone-last-child-focuszone_2018-03-04-09-07.json b/common/changes/office-ui-fabric-react/focustrapzone-last-child-focuszone_2018-03-04-09-07.json
deleted file mode 100644
index 7b6d929407403..0000000000000
--- a/common/changes/office-ui-fabric-react/focustrapzone-last-child-focuszone_2018-03-04-09-07.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Updating a test to ensure that focus is trapped in a FocusTrapZone when it has a FocusZone as the last element",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "sllynn8907@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/malind-facepileOverflow_2018-02-26-15-58.json b/common/changes/office-ui-fabric-react/malind-facepileOverflow_2018-02-26-15-58.json
deleted file mode 100644
index 319e334560e75..0000000000000
--- a/common/changes/office-ui-fabric-react/malind-facepileOverflow_2018-02-26-15-58.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Facepile: Added `overflowPersonas` option to better control what personas go into the overflow personas vs show up as a persona coin. Also adjusted Facepile back to showing a Persona control if there is only one persona to be shown with no overflow.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "malind@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/master_2018-02-22-16-54.json b/common/changes/office-ui-fabric-react/master_2018-02-22-16-54.json
deleted file mode 100644
index b79e2875c4008..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2018-02-22-16-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "[TextField] onChange fix for IE when using multiline with placeholder",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "hlynur.tryggvason@officeatwork.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/master_2018-03-09-00-06.json b/common/changes/office-ui-fabric-react/master_2018-03-09-00-06.json
deleted file mode 100644
index c9eaba727642e..0000000000000
--- a/common/changes/office-ui-fabric-react/master_2018-03-09-00-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "importing hoistStatics from Utilities for withResponsiveMode decorator",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/maxlus-scrollIntoView_2018-03-09-22-19.json b/common/changes/office-ui-fabric-react/maxlus-scrollIntoView_2018-03-09-22-19.json
deleted file mode 100644
index a305211e6b750..0000000000000
--- a/common/changes/office-ui-fabric-react/maxlus-scrollIntoView_2018-03-09-22-19.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add ability to get and set scroll position on ScrollablePane",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "maxlus@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/non-optional-details-list-on-column-click_2018-03-09-20-51.json b/common/changes/office-ui-fabric-react/non-optional-details-list-on-column-click_2018-03-09-20-51.json
deleted file mode 100644
index c843eeff1966a..0000000000000
--- a/common/changes/office-ui-fabric-react/non-optional-details-list-on-column-click_2018-03-09-20-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: IColumn `onColumnClick` callback args marked non-optional.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jogol@microsoft.com"
-}
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 45314c6072ea1..6cd2811d022ef 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -32,8 +32,8 @@
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.19.0 <6.0.0",
-    "@uifabric/utilities": ">=5.17.1 <6.0.0",
+    "@uifabric/styling": ">=5.19.1 <6.0.0",
+    "@uifabric/utilities": ">=5.18.0 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index a17ada17345b2..7e959a5634a09 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.25.0",
+      "tag": "@uifabric/experiments_v5.25.0",
+      "date": "Mon, 12 Mar 2018 06:29:20 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Vitalie Braga <vitaliebraga@gmail.com>",
+            "commit": "8fefccb51072642d80de8370c550a3c49d49e45a",
+            "comment": "Adds a new Shimmer Component to experiments package."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.62.1 <6.0.0` to `>=5.63.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.24.1",
       "tag": "@uifabric/experiments_v5.24.1",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 9ef1e0e186919..77aa23e42001e 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Thu, 08 Mar 2018 11:27:23 GMT and should not be manually modified.
+This log was last generated on Mon, 12 Mar 2018 06:29:20 GMT and should not be manually modified.
+
+## 5.25.0
+Mon, 12 Mar 2018 06:29:20 GMT
+
+### Minor changes
+
+- Adds a new Shimmer Component to experiments package.
 
 ## 5.24.1
 Thu, 08 Mar 2018 11:27:23 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 300b631f54e39..787a0bb3a5ef1 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.24.1",
+  "version": "5.25.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.62.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.63.0 <6.0.0",
     "@uifabric/icons": ">=5.5.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/file-type-icons/package.json b/packages/file-type-icons/package.json
index 552fbdf8c9b41..08ee2e300ab7c 100644
--- a/packages/file-type-icons/package.json
+++ b/packages/file-type-icons/package.json
@@ -26,7 +26,7 @@
     "react-dom": "^16.2.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.19.0 <6.0.0",
+    "@uifabric/styling": ">=5.19.1 <6.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 765b2b3e1e43c..3164827a8382a 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -22,7 +22,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.19.0 <6.0.0",
+    "@uifabric/styling": ">=5.19.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index e0c7a76e76857..e666bcbba577b 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,70 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.63.0",
+      "tag": "office-ui-fabric-react_v5.63.0",
+      "date": "Mon, 12 Mar 2018 06:29:20 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Alex Henry <adhe223@g.uky.edu>",
+            "commit": "2480bbe4e1f498a7ebd086c0b406eb7706bc3c20",
+            "comment": "Add rel option for Contextual Menu Items"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "7251c2dc69071e97fccbeb18971736f4e65cf301",
+            "comment": "ComoboBox and SpinButton: Removing excess margins and padding to make them consistent with TextField."
+          },
+          {
+            "author": "Matt Lind <matthewtlind@hotmail.com>",
+            "commit": "327e1e350ab4bb9909d449e66b7ec9ef8ca879e4",
+            "comment": "Facepile: Added `overflowPersonas` option to better control what personas go into the overflow personas vs show up as a persona coin. Also adjusted Facepile back to showing a Persona control if there is only one persona to be shown with no overflow."
+          },
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "494d1258ce23505c8e5a4d1565ff5a2451048162",
+            "comment": "importing hoistStatics from Utilities for withResponsiveMode decorator"
+          },
+          {
+            "author": "MaxLustig <maxslustig@gmail.com>",
+            "commit": "aa9c51c996715398e2b8a722db66b00806743e45",
+            "comment": "Add ability to get and set scroll position on ScrollablePane"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "fa97fa979c83ce8b9c67ca0dbb51ffe49e20b1b4",
+            "comment": "DetailsList: IColumn `onColumnClick` callback args marked non-optional."
+          }
+        ],
+        "patch": [
+          {
+            "author": "Spencer Lynn <sllynn8907@gmail.com>",
+            "commit": "699fa697ae829e756108ce2b6725084d27e93f7e",
+            "comment": "Updating a test to ensure that focus is trapped in a FocusTrapZone when it has a FocusZone as the last element"
+          },
+          {
+            "author": "Hlynur Tryggvason <hlynur.tryggvason@officeatwork.com>",
+            "commit": "76a874fe31f68d88b31b738a4d600df0129924d8",
+            "comment": "[TextField] onChange fix for IE when using multiline with placeholder"
+          },
+          {
+            "author": "manueldosal <manuel_dosal32@hotmail.com>",
+            "commit": "374759cd95dc57a079b7a76120b008bcd791b173",
+            "comment": "Run onCellFocused before unmount and before select color"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.19.0 <6.0.0` to `>=5.19.1 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.17.1 <6.0.0` to `>=5.18.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.62.1",
       "tag": "office-ui-fabric-react_v5.62.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index aaabb31e78573..ffafebbe4013f 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,24 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 09 Mar 2018 15:07:28 GMT and should not be manually modified.
+This log was last generated on Mon, 12 Mar 2018 06:29:20 GMT and should not be manually modified.
+
+## 5.63.0
+Mon, 12 Mar 2018 06:29:20 GMT
+
+### Minor changes
+
+- Add rel option for Contextual Menu Items
+- ComoboBox and SpinButton: Removing excess margins and padding to make them consistent with TextField.
+- Facepile: Added `overflowPersonas` option to better control what personas go into the overflow personas vs show up as a persona coin. Also adjusted Facepile back to showing a Persona control if there is only one persona to be shown with no overflow.
+- importing hoistStatics from Utilities for withResponsiveMode decorator
+- Add ability to get and set scroll position on ScrollablePane
+- DetailsList: IColumn `onColumnClick` callback args marked non-optional.
+
+### Patches
+
+- Updating a test to ensure that focus is trapped in a FocusTrapZone when it has a FocusZone as the last element
+- [TextField] onChange fix for IE when using multiline with placeholder
+- Run onCellFocused before unmount and before select color
 
 ## 5.62.1
 Fri, 09 Mar 2018 15:07:28 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index c734c0567ea2d..034a972cecf8c 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.62.1",
+  "version": "5.63.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -50,8 +50,8 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/icons": ">=5.5.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
-    "@uifabric/styling": ">=5.19.0 <6.0.0",
-    "@uifabric/utilities": ">=5.17.1 <6.0.0",
+    "@uifabric/styling": ">=5.19.1 <6.0.0",
+    "@uifabric/utilities": ">=5.18.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 1a2b043a6048f..8d9af4459486f 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.19.1",
+      "tag": "@uifabric/styling_v5.19.1",
+      "date": "Mon, 12 Mar 2018 06:29:20 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Christian Gonzalez <christianjordangonzalez@gmail.com>",
+            "commit": "a3841913dd420f50f9a04cdd56676aa9f4f0fd89",
+            "comment": "By default, try to use the system font before downloading a web font"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.17.1 <6.0.0` to `>=5.18.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.19.0",
       "tag": "@uifabric/styling_v5.19.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 446d471cb0ece..02849f835b9bb 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Fri, 23 Feb 2018 03:05:53 GMT and should not be manually modified.
+This log was last generated on Mon, 12 Mar 2018 06:29:20 GMT and should not be manually modified.
+
+## 5.19.1
+Mon, 12 Mar 2018 06:29:20 GMT
+
+### Patches
+
+- By default, try to use the system font before downloading a web font
 
 ## 5.19.0
 Fri, 23 Feb 2018 03:05:53 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 73965a07b12c0..c7f9e61e5611c 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.19.0",
+  "version": "5.19.1",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "repository": {
     "type": "git",
@@ -28,7 +28,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.17.1 <6.0.0",
+    "@uifabric/utilities": ">=5.18.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 5260e5a1ebe0a..d68b13a26783f 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.18.0",
+      "tag": "@uifabric/utilities_v5.18.0",
+      "date": "Mon, 12 Mar 2018 06:29:20 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Spencer Lynn <sllynn8907@gmail.com>",
+            "commit": "699fa697ae829e756108ce2b6725084d27e93f7e",
+            "comment": "Focus utility getPreviousElement did not correctly consider the tabbable argument when considering the current node. This can affect how FocusZones are processed, since only one element in a zone will have tab index set. This, in turn, affects how FocusTrapZone traps focus, since getPreviousElement is used during trapping focus."
+          },
+          {
+            "author": "erichdev <a.erich@gmail.com>",
+            "commit": "feb4db4410cdd49d5df8a50fcef138fbcd324dc2",
+            "comment": "Styled: Add display name to styled wrapper"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "494d1258ce23505c8e5a4d1565ff5a2451048162",
+            "comment": "added hoistStatics function for use with decorators to fix broken statics issue, and added the fuction to the customizable decorator"
+          }
+        ]
+      }
+    },
     {
       "version": "5.17.1",
       "tag": "@uifabric/utilities_v5.17.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index bc0b20cafbf29..e645b02366ece 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,18 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Fri, 09 Mar 2018 15:07:28 GMT and should not be manually modified.
+This log was last generated on Mon, 12 Mar 2018 06:29:20 GMT and should not be manually modified.
+
+## 5.18.0
+Mon, 12 Mar 2018 06:29:20 GMT
+
+### Minor changes
+
+- added hoistStatics function for use with decorators to fix broken statics issue, and added the fuction to the customizable decorator
+
+### Patches
+
+- Focus utility getPreviousElement did not correctly consider the tabbable argument when considering the current node. This can affect how FocusZones are processed, since only one element in a zone will have tab index set. This, in turn, affects how FocusTrapZone traps focus, since getPreviousElement is used during trapping focus.
+- Styled: Add display name to styled wrapper
 
 ## 5.17.1
 Fri, 09 Mar 2018 15:07:28 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 20c37a898ad64..e5b1c459fe0af 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.17.1",
+  "version": "5.18.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/variants/CHANGELOG.json b/packages/variants/CHANGELOG.json
index 09ebbc51c80bb..1f3737022dee6 100644
--- a/packages/variants/CHANGELOG.json
+++ b/packages/variants/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "@uifabric/variants",
   "entries": [
+    {
+      "version": "5.0.1",
+      "tag": "@uifabric/variants_v5.0.1",
+      "date": "Mon, 12 Mar 2018 06:29:20 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "bc0d12b6c5952b22f079e9e09ec31654726f9a37",
+            "comment": "fix version for variants package"
+          },
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "9076096e7fc955b21ea01665d2b513034ac3c651",
+            "comment": "update readme"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.19.0 <6.0.0` to `>=5.19.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.11.2",
       "tag": "@uifabric/variants_v5.11.2",
diff --git a/packages/variants/CHANGELOG.md b/packages/variants/CHANGELOG.md
index f1e96b3ed3bc0..ddcfe7f1be397 100644
--- a/packages/variants/CHANGELOG.md
+++ b/packages/variants/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - @uifabric/variants
 
-This log was last generated on Fri, 23 Feb 2018 03:05:53 GMT and should not be manually modified.
+This log was last generated on Mon, 12 Mar 2018 06:29:20 GMT and should not be manually modified.
+
+## 5.0.1
+Mon, 12 Mar 2018 06:29:20 GMT
+
+### Patches
+
+- fix version for variants package
+- update readme
 
 ## 5.11.2
 Fri, 23 Feb 2018 03:05:53 GMT
diff --git a/packages/variants/package.json b/packages/variants/package.json
index 1684392c30834..b17703c5d1081 100644
--- a/packages/variants/package.json
+++ b/packages/variants/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/variants",
-  "version": "5.0.0",
+  "version": "5.0.1",
   "description": "Office UI Fabric subtheme generator.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -25,6 +25,6 @@
   },
   "dependencies": {
     "tslib": "^1.7.1",
-    "@uifabric/styling": ">=5.19.0 <6.0.0"
+    "@uifabric/styling": ">=5.19.1 <6.0.0"
   }
 }
\ No newline at end of file

From f7311f3d9ce57ca7692d931b91695e15a1bd5e4a Mon Sep 17 00:00:00 2001
From: dzearing <dzearing@hotmail.com>
Date: Mon, 12 Mar 2018 00:34:47 -0700
Subject: [PATCH 1562/1641] Updating release notes script again.

---
 scripts/updateReleaseNotes.js | 22 ++++++++++++----------
 1 file changed, 12 insertions(+), 10 deletions(-)

diff --git a/scripts/updateReleaseNotes.js b/scripts/updateReleaseNotes.js
index c562af350f58c..e3c3e3abdf22d 100644
--- a/scripts/updateReleaseNotes.js
+++ b/scripts/updateReleaseNotes.js
@@ -68,13 +68,13 @@ function forEachFileRecursive(folder, fileName, cb) {
 /**
  * Build up the markdown from the entry description.
  */
-function getMarkdownForEntry(entry) {
+async function getMarkdownForEntry(entry) {
   let markdown = '';
   let comments = '';
 
-  comments += getChangeComments('Breaking changes', entry.comments.major);
-  comments += getChangeComments('Minor changes', entry.comments.minor);
-  comments += getChangeComments('Patches', entry.comments.patch);
+  comments += await getChangeComments('Breaking changes', entry.comments.major);
+  comments += await getChangeComments('Minor changes', entry.comments.minor);
+  comments += await getChangeComments('Patches', entry.comments.patch);
 
   if (!comments) {
     markdown += '*Changes not tracked*' +
@@ -90,11 +90,13 @@ function getMarkdownForEntry(entry) {
 /**
  * From a comment array, conditionally returns a section of markdown.
  */
-function getChangeComments(title, commentsArray) {
+async function getChangeComments(title, commentsArray) {
   var comments = '';
   if (commentsArray) {
     comments = "# " + title + (EOL + EOL);
-    commentsArray.forEach(async (comment) => {
+
+    for (let i = 0; i < commentsArray.length; i++) {
+      var comment = commentsArray[i];
       var searchResult;
 
       comments += `- ${comment.comment}`;
@@ -109,7 +111,7 @@ function getChangeComments(title, commentsArray) {
         comments += `)`;
       }
       comments += EOL;
-    });
+    }
     comments += EOL;
   }
   return comments;
@@ -219,7 +221,7 @@ function updateReleaseNotes(shouldPatchChangelog) {
   getReleases((releases) => {
     let count = 0;
 
-    publishedTags.forEach(tag => {
+    publishedTags.forEach(async tag => {
       let entry = changelogEntries.get(tag);
       let hasBeenReleased = releases.has(tag);
 
@@ -236,7 +238,7 @@ function updateReleaseNotes(shouldPatchChangelog) {
           console.log(`Creating release notes for ${entry.name} ${entry.version}`);
           count++;
 
-          releaseDetails.body = getMarkdownForEntry(entry);
+          releaseDetails.body = await getMarkdownForEntry(entry);
 
           if (SHOULD_APPLY) {
             github.repos.createRelease(releaseDetails, (err, cb) => {
@@ -253,7 +255,7 @@ function updateReleaseNotes(shouldPatchChangelog) {
 
           if (SHOULD_APPLY) {
             releaseDetails.id = releases.get(tag).id;
-            releaseDetails.body = getMarkdownForEntry(entry);
+            releaseDetails.body = await getMarkdownForEntry(entry);
 
             github.repos.editRelease(releaseDetails, (err, cb) => {
               if (err) {

From 6bce81a5497dcf09595e6e6bb04591595a887cce Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Mon, 12 Mar 2018 13:37:18 -0700
Subject: [PATCH 1563/1641] Pickers Accessibility: fix activedescendant so it
 no longer has sug--1 if nothing is selected. (#4238)

* fix active descendant in pickers showing sug--1

* adding change file

* update snapshot
---
 ...pickers-fix-activedescendant_2018-03-12-18-09.json | 11 +++++++++++
 .../src/components/pickers/BasePicker.tsx             |  3 ++-
 .../pickers/__snapshots__/BasePicker.test.tsx.snap    |  4 ++--
 3 files changed, 15 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/pickers-fix-activedescendant_2018-03-12-18-09.json

diff --git a/common/changes/office-ui-fabric-react/pickers-fix-activedescendant_2018-03-12-18-09.json b/common/changes/office-ui-fabric-react/pickers-fix-activedescendant_2018-03-12-18-09.json
new file mode 100644
index 0000000000000..704daf3de6b01
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/pickers-fix-activedescendant_2018-03-12-18-09.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Pickers: Fix aria bug where activedescendant would be sug--1",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 241d0f9f61f2c..5d45d58d2286d 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -176,6 +176,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     const currentIndex = this.suggestionStore.currentIndex;
     const selectedSuggestion = currentIndex > -1 ? this.suggestionStore.getSuggestionAtIndex(this.suggestionStore.currentIndex) : undefined;
     const selectedSuggestionAlert = selectedSuggestion ? selectedSuggestion.ariaLabel : undefined;
+    const activeDescendant = currentIndex > -1 ? 'sug-' + currentIndex : undefined;
 
     return (
       <div
@@ -202,7 +203,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
                 onBlur={ this.onInputBlur }
                 onInputValueChange={ this.onInputChange }
                 suggestedDisplayValue={ suggestedDisplayValue }
-                aria-activedescendant={ 'sug-' + this.suggestionStore.currentIndex }
+                aria-activedescendant={ activeDescendant }
                 aria-owns='suggestion-list'
                 aria-expanded={ !!this.state.suggestionsVisible }
                 aria-haspopup='true'
diff --git a/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
index 2b6940311702f..6ed2487d4f220 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/pickers/__snapshots__/BasePicker.test.tsx.snap
@@ -40,7 +40,7 @@ exports[`Pickers BasePicker renders BasePicker correctly 1`] = `
         role="list"
       >
         <input
-          aria-activedescendant="sug--1"
+          aria-activedescendant={undefined}
           aria-controls="selected-suggestion-alert"
           aria-expanded={false}
           aria-haspopup="true"
@@ -107,7 +107,7 @@ exports[`Pickers TagPicker renders TagPicker correctly 1`] = `
         role="list"
       >
         <input
-          aria-activedescendant="sug--1"
+          aria-activedescendant={undefined}
           aria-controls="selected-suggestion-alert"
           aria-expanded={false}
           aria-haspopup="true"

From 7a6c2bda4918fb262600609f2169a337c2613328 Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Mon, 12 Mar 2018 14:24:28 -0700
Subject: [PATCH 1564/1641] Addressing Issue #4176 - Datepicker add is-open css
 class (#4239)

* Added is-open class to DatePicker root element based on state isDatePickerShown

* rush change

* fix jsx syntax
---
 .../datepicker-isopen-4176_2018-03-12-18-20.json      | 11 +++++++++++
 .../src/components/DatePicker/DatePicker.tsx          |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/datepicker-isopen-4176_2018-03-12-18-20.json

diff --git a/common/changes/office-ui-fabric-react/datepicker-isopen-4176_2018-03-12-18-20.json b/common/changes/office-ui-fabric-react/datepicker-isopen-4176_2018-03-12-18-20.json
new file mode 100644
index 0000000000000..4f6969b0f6757
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/datepicker-isopen-4176_2018-03-12-18-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added an is-open class to the DatePicker root element to indicate when the datepicker is being shown based on the IDatePickerState.isDatePickerShown state property.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 8a4010c10bcaa..26c65aa91dd0a 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -206,7 +206,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     const { isDatePickerShown, formattedDate, selectedDate, errorMessage } = this.state;
 
     return (
-      <div className={ css('ms-DatePicker', styles.root, className) }>
+      <div className={ css('ms-DatePicker', styles.root, isDatePickerShown && 'is-open', className) }>
         { label && (
           <Label required={ isRequired }>{ label }</Label>
         ) }

From a1271228d199722b34c61b903e7ef4c0e4cba744 Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Mon, 12 Mar 2018 15:24:39 -0700
Subject: [PATCH 1565/1641] Addressing Issue #531 - Documentation: Components
 should indicate if they take native props (#4215)

added functionality for 'allows native props' to ComponentPage component and applied to Fabric components
---
 ...entation-nativeprops_2018-03-08-19-35.json | 11 ++++++
 .../ComponentPage/ComponentPage.tsx           | 35 +++++++++++++++++++
 .../src/components/Button/ButtonPage.tsx      | 15 ++++----
 .../ChoiceGroup/ChoiceGroupPage.tsx           |  4 ++-
 .../src/components/ComboBox/ComboBoxPage.tsx  |  3 +-
 .../src/components/Dropdown/DropdownPage.tsx  |  3 +-
 .../FocusTrapZone/FocusTrapZonePage.tsx       |  1 +
 .../components/FocusZone/FocusZonePage.tsx    |  1 +
 .../components/HoverCard/HoverCardPage.tsx    |  3 +-
 .../src/components/Icon/IconPage.tsx          |  3 +-
 .../src/components/Image/ImagePage.tsx        |  4 ++-
 .../src/components/Label/LabelPage.tsx        |  3 +-
 .../src/components/Link/LinkPage.tsx          |  4 ++-
 .../src/components/List/ListPage.tsx          |  3 +-
 .../src/components/Overlay/OverlayPage.tsx    |  3 +-
 .../src/components/Persona/PersonaPage.tsx    |  3 +-
 .../src/components/Pivot/PivotPage.tsx        |  6 ++--
 .../ResizeGroup/ResizeGroupPage.tsx           |  4 ++-
 .../ScrollablePane/ScrollablePanePage.tsx     | 19 ++++++----
 .../components/TextField/TextFieldPage.tsx    |  4 ++-
 .../src/components/Toggle/TogglePage.tsx      |  4 ++-
 .../src/components/Tooltip/TooltipPage.tsx    |  3 +-
 22 files changed, 107 insertions(+), 32 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/documentation-nativeprops_2018-03-08-19-35.json

diff --git a/common/changes/office-ui-fabric-react/documentation-nativeprops_2018-03-08-19-35.json b/common/changes/office-ui-fabric-react/documentation-nativeprops_2018-03-08-19-35.json
new file mode 100644
index 0000000000000..cab121b2f4ee9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/documentation-nativeprops_2018-03-08-19-35.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added documentation for components that allow native props",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx b/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
index 22666689d3fc2..133752d29f0fd 100644
--- a/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
+++ b/packages/example-app-base/src/components/ComponentPage/ComponentPage.tsx
@@ -6,6 +6,7 @@ import {
 import {
   Link
 } from 'office-ui-fabric-react/lib/Link';
+import { MessageBar } from 'office-ui-fabric-react/lib/MessageBar';
 import './ComponentPage.scss';
 
 export interface IComponentPageSection {
@@ -29,6 +30,8 @@ export interface IComponentPageProps {
   className?: string;
   componentStatus?: JSX.Element;
   otherSections?: IComponentPageSection[];
+  allowNativeProps?: boolean | string;
+  nativePropsElement?: string | string[] | undefined;
 }
 
 export class ComponentPage extends React.Component<IComponentPageProps, {}> {
@@ -148,11 +151,43 @@ export class ComponentPage extends React.Component<IComponentPageProps, {}> {
     }
   }
 
+  private _getNativePropsInfo(): JSX.Element | undefined {
+    if (this.props.allowNativeProps) {
+      let elementString: string | string[] | JSX.Element = this.props.nativePropsElement || 'div',
+        componentString: JSX.Element | undefined;
+      if (typeof elementString === 'object' && elementString.length > 1) {
+        const elementArr = elementString.slice();
+        for (let _i = 0; _i < elementArr.length; _i++) {
+          if (_i === 0) {
+            elementString = <><code>{ '<' }{ elementArr[_i] }{ '>' }</code></>;
+          } else {
+            elementString = <>{ elementString } and <code>{ '<' }{ elementArr[_i] }{ '>' }</code></>;
+          }
+        }
+        elementString = <>{ elementString } tags</>;
+      } else {
+        elementString = <><code>{ '<' }{ elementString }{ '>' }</code> tag</>;
+      }
+
+      if (typeof this.props.allowNativeProps === 'string') {
+        componentString = <> <code>{ this.props.allowNativeProps }</code></>;
+      }
+
+      return (
+        <MessageBar>
+          <strong>Native Props Allowed{ componentString }</strong> - all HTML attributes native to the { elementString },
+          including all aria and custom data attributes, can be applied as native props on{ componentString || <> this component</> }.
+        </MessageBar>
+      );
+    }
+  }
+
   private _getPropertiesTable(): JSX.Element | undefined {
     if (this.props.propertiesTables) {
       return (
         <div className='ComponentPage-implementationSection'>
           <h2 className='ComponentPage-subHeading' id='Implementation'>Implementation</h2>
+          { this._getNativePropsInfo() }
           { this.props.propertiesTables }
         </div>
       );
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
index 5760dfede8dc9..37e2643a4a00c 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonPage.tsx
@@ -125,15 +125,14 @@ export class ButtonPage extends React.Component<IComponentDemoPageProps, IButton
             </ExampleCard>
           </div>
         }
+        allowNativeProps={ true }
+        nativePropsElement={ ['a', 'button'] }
         propertiesTables={
-          <div>
-            <PropertiesTableSet
-              sources={ [
-                require<string>('!raw-loader!office-ui-fabric-react/src/components/Button/Button.types.ts')
-              ] }
-            />
-            <p>Besides the above properties, the <code>Button</code> component accepts all properties that the React <code>button</code> and <code>a</code> components accept.</p>
-          </div>
+          <PropertiesTableSet
+            sources={ [
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Button/Button.types.ts')
+            ] }
+          />
         }
         overview={
           <div>
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx
index 808512db08e76..d1c26163ae121 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroupPage.tsx
@@ -39,6 +39,8 @@ export class ChoiceGroupPage extends React.Component<IComponentDemoPageProps, {}
             </ExampleCard>
           </div>
         }
+        allowNativeProps={ true }
+        nativePropsElement={ 'input' }
         propertiesTables={
           <PropertiesTableSet
             sources={ [
@@ -88,7 +90,7 @@ export class ChoiceGroupPage extends React.Component<IComponentDemoPageProps, {}
         isHeaderVisible={ this.props.isHeaderVisible }
         componentStatus={
           <ComponentStatus
-            {...ChoiceGroupStatus}
+            { ...ChoiceGroupStatus }
           />
         }
       />
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
index 6beae488d6529..5ef42f2043090 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBoxPage.tsx
@@ -29,6 +29,7 @@ export class ComboBoxPage extends React.Component<IComponentDemoPageProps, {}> {
             </ExampleCard>
           </div>
         }
+        allowNativeProps={ true }
         propertiesTables={
           <PropertiesTableSet
             sources={ [
@@ -61,7 +62,7 @@ export class ComboBoxPage extends React.Component<IComponentDemoPageProps, {}> {
         isHeaderVisible={ this.props.isHeaderVisible }
         componentStatus={
           <ComponentStatus
-            {...ComboBoxStatus}
+            { ...ComboBoxStatus }
           />
         }
       />
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
index 0dccfe5466652..f7ffc94d031b4 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/DropdownPage.tsx
@@ -45,6 +45,7 @@ export class DropdownPage extends React.Component<IComponentDemoPageProps, {}> {
           </div>
 
         }
+        allowNativeProps={ true }
         propertiesTables={
           <PropertiesTableSet
             sources={ [
@@ -78,7 +79,7 @@ export class DropdownPage extends React.Component<IComponentDemoPageProps, {}> {
         isHeaderVisible={ this.props.isHeaderVisible }
         componentStatus={
           <ComponentStatus
-            {...DropdownStatus}
+            { ...DropdownStatus }
           />
         }
       />
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZonePage.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZonePage.tsx
index 912c9654d96bf..3eaa6ec90c340 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZonePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZonePage.tsx
@@ -42,6 +42,7 @@ export class FocusTrapZonePage extends React.Component<IComponentDemoPageProps,
             </ExampleCard>
           </div>
         }
+        allowNativeProps={ true }
         propertiesTables={
           <PropertiesTableSet
             sources={ [
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZonePage.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZonePage.tsx
index a227aaafaaeb4..7443be6a2b82c 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZonePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZonePage.tsx
@@ -37,6 +37,7 @@ export class FocusZonePage extends React.Component<IComponentDemoPageProps, {}>
             </ExampleCard>
           </div>
         }
+        allowNativeProps={ true }
         propertiesTables={
           <PropertiesTableSet
             sources={ [
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx
index 16bc5b48902a5..20eff65a39632 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCardPage.tsx
@@ -32,6 +32,7 @@ export class HoverCardPage extends React.Component<IComponentDemoPageProps, any>
             </ExampleCard>
           </LayerHost>
         }
+        allowNativeProps={ true }
         propertiesTables={
           <PropertiesTableSet
             sources={ [
@@ -47,7 +48,7 @@ export class HoverCardPage extends React.Component<IComponentDemoPageProps, any>
         }
         componentStatus={
           <ComponentStatus
-            {...HoverCardStatus}
+            { ...HoverCardStatus }
           />
         }
         isHeaderVisible={ this.props.isHeaderVisible }
diff --git a/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx b/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx
index 0dda3185b9725..c107523257b8e 100644
--- a/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Icon/IconPage.tsx
@@ -39,6 +39,7 @@ export class IconPage extends React.Component<IComponentDemoPageProps, {}> {
             </ExampleCard>
           </div>
         }
+        allowNativeProps={ true }
         propertiesTables={
           <PropertiesTableSet
             sources={ [
@@ -75,7 +76,7 @@ export class IconPage extends React.Component<IComponentDemoPageProps, {}> {
         isHeaderVisible={ this.props.isHeaderVisible }
         componentStatus={
           <ComponentStatus
-            {...IconStatus}
+            { ...IconStatus }
           />
         }
       />
diff --git a/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx b/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx
index ce9968bd82a4d..d09b82965ceb2 100644
--- a/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/ImagePage.tsx
@@ -50,6 +50,8 @@ export class ImagePage extends React.Component<IComponentDemoPageProps, {}> {
             </ExampleCard>
           </div>
         }
+        allowNativeProps={ true }
+        nativePropsElement={ 'img' }
         propertiesTables={
           <PropertiesTableSet
             sources={ [
@@ -89,7 +91,7 @@ export class ImagePage extends React.Component<IComponentDemoPageProps, {}> {
         isHeaderVisible={ this.props.isHeaderVisible }
         componentStatus={
           <ComponentStatus
-            {...ImageStatus}
+            { ...ImageStatus }
           />
         }
       />
diff --git a/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx b/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx
index 69a28a5b819d3..0a4a56da9b28e 100644
--- a/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Label/LabelPage.tsx
@@ -22,6 +22,7 @@ export class LabelPage extends React.Component<IComponentDemoPageProps, any> {
             <LabelBasicExample />
           </ExampleCard>
         }
+        allowNativeProps={ true }
         propertiesTables={
           <PropertiesTableSet
             sources={ [
@@ -59,7 +60,7 @@ export class LabelPage extends React.Component<IComponentDemoPageProps, any> {
         isHeaderVisible={ this.props.isHeaderVisible }
         componentStatus={
           <ComponentStatus
-            {...LabelStatus}
+            { ...LabelStatus }
           />
         }
       />
diff --git a/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx b/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx
index 0e15bcab62e26..86e45618b070b 100644
--- a/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Link/LinkPage.tsx
@@ -22,6 +22,8 @@ export class LinkPage extends React.Component<IComponentDemoPageProps, {}> {
             <LinkBasicExample />
           </ExampleCard>
         }
+        allowNativeProps={ true }
+        nativePropsElement={ ['a', 'button'] }
         propertiesTables={
           <PropertiesTableSet
             sources={ [
@@ -65,7 +67,7 @@ export class LinkPage extends React.Component<IComponentDemoPageProps, {}> {
         isHeaderVisible={ this.props.isHeaderVisible }
         componentStatus={
           <ComponentStatus
-            {...LinkStatus}
+            { ...LinkStatus }
           />
         }
       />
diff --git a/packages/office-ui-fabric-react/src/components/List/ListPage.tsx b/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
index 6f8a186ce1951..8f9ba43d51e08 100644
--- a/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/ListPage.tsx
@@ -48,6 +48,7 @@ export class ListPage extends React.Component<IComponentDemoPageProps, {}> {
             </ExampleCard>
           </div>
         }
+        allowNativeProps={ true }
         propertiesTables={
           <PropertiesTableSet
             sources={ [
@@ -71,7 +72,7 @@ export class ListPage extends React.Component<IComponentDemoPageProps, {}> {
         isHeaderVisible={ this.props.isHeaderVisible }
         componentStatus={
           <ComponentStatus
-            {...ListStatus}
+            { ...ListStatus }
           />
         }
       />
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx b/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx
index 56c21085b6fd0..56b3d0c1ffaf6 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Overlay/OverlayPage.tsx
@@ -29,6 +29,7 @@ export class OverlayPage extends React.Component<IComponentDemoPageProps, {}> {
             </ExampleCard>
           </div>
         }
+        allowNativeProps={ true }
         propertiesTables={
           <PropertiesTableSet
             sources={ [
@@ -64,7 +65,7 @@ export class OverlayPage extends React.Component<IComponentDemoPageProps, {}> {
         isHeaderVisible={ this.props.isHeaderVisible }
         componentStatus={
           <ComponentStatus
-            {...OverlayStatus}
+            { ...OverlayStatus }
           />
         }
       />
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
index bcadebf3bbf87..b318f55c8012a 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaPage.tsx
@@ -44,6 +44,7 @@ export class PersonaPage extends React.Component<IComponentDemoPageProps, {}> {
             </ExampleCard>
           </div>
         }
+        allowNativeProps={ true }
         propertiesTables={
           <PropertiesTableSet
             sources={ [
@@ -81,7 +82,7 @@ export class PersonaPage extends React.Component<IComponentDemoPageProps, {}> {
         isHeaderVisible={ this.props.isHeaderVisible }
         componentStatus={
           <ComponentStatus
-            {...PersonaStatus}
+            { ...PersonaStatus }
           />
         }
       />
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx b/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx
index cd09643857ae1..37c8c6a06ad37 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/PivotPage.tsx
@@ -69,10 +69,12 @@ export class PivotPage extends React.Component<IComponentDemoPageProps, {}> {
             </ExampleCard>
           </div>
         }
+        allowNativeProps={ 'PivotItem' }
         propertiesTables={
           <PropertiesTableSet
             sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Pivot/Pivot.types.ts')
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Pivot/Pivot.types.ts'),
+              require<string>('!raw-loader!office-ui-fabric-react/src/components/Pivot/PivotItem.types.ts')
             ] }
           />
         }
@@ -118,7 +120,7 @@ export class PivotPage extends React.Component<IComponentDemoPageProps, {}> {
         isHeaderVisible={ this.props.isHeaderVisible }
         componentStatus={
           <ComponentStatus
-            {...PivotStatus}
+            { ...PivotStatus }
           />
         }
       />
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
index 3a0e3ba50ddea..060046c5fad27 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
@@ -10,6 +10,7 @@ import { ResizeGroupOverflowSetExample } from './examples/ResizeGroup.OverflowSe
 import { FlexBoxResizeGroupExample } from './examples/ResizeGroup.FlexBox.Example';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { ResizeGroupStatus } from './ResizeGroup.checklist';
+import { MessageBar } from '../../MessageBar';
 
 const ResizeGroupBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx') as string;
 
@@ -31,6 +32,7 @@ export class ResizeGroupPage extends React.Component<IComponentDemoPageProps, an
             </ExampleCard>
           </LayerHost>
         }
+        allowNativeProps={ true }
         propertiesTables={
           <PropertiesTableSet
             sources={ [
@@ -103,7 +105,7 @@ export class ResizeGroupPage extends React.Component<IComponentDemoPageProps, an
         isHeaderVisible={ this.props.isHeaderVisible }
         componentStatus={
           <ComponentStatus
-            {...ResizeGroupStatus}
+            { ...ResizeGroupStatus }
           />
         }
       />
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
index badfb5bbd4124..6029411f7fbc1 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
@@ -9,6 +9,7 @@ import { ScrollablePaneDefaultExample } from './examples/ScrollablePane.Default.
 import { ScrollablePaneDetailsListExample } from './examples/ScrollablePane.DetailsList.Example';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { ScrollablePaneStatus } from './ScrollablePane.checklist';
+import { MessageBar } from '../../MessageBar';
 
 const ScrollablePaneDefaultExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx') as string;
 
@@ -30,13 +31,17 @@ export class ScrollablePanePage extends React.Component<IComponentDemoPageProps,
             </ExampleCard>
           </div>
         }
+        allowNativeProps={ true }
+        nativePropsElement={ ['a', 'button'] }
         propertiesTables={
-          <PropertiesTableSet
-            sources={ [
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts'),
-              require<string>('!raw-loader!office-ui-fabric-react/src/components/Sticky/Sticky.types.ts')
-            ] }
-          />
+          <div>
+            <PropertiesTableSet
+              sources={ [
+                require<string>('!raw-loader!office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts'),
+                require<string>('!raw-loader!office-ui-fabric-react/src/components/Sticky/Sticky.types.ts')
+              ] }
+            />
+          </div>
         }
         overview={
           <div>
@@ -67,7 +72,7 @@ export class ScrollablePanePage extends React.Component<IComponentDemoPageProps,
         isHeaderVisible={ this.props.isHeaderVisible }
         componentStatus={
           <ComponentStatus
-            {...ScrollablePaneStatus}
+            { ...ScrollablePaneStatus }
           />
         }
       />
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
index 68251f037c2ab..15ebbbd00d519 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextFieldPage.tsx
@@ -119,6 +119,8 @@ export class TextFieldPage extends React.Component<IComponentDemoPageProps, {}>
             </ExampleCard>
           </div>
         }
+        allowNativeProps={ true }
+        nativePropsElement={ ['input', 'textarea'] }
         propertiesTables={
           <PropertiesTableSet
             sources={ [
@@ -168,7 +170,7 @@ export class TextFieldPage extends React.Component<IComponentDemoPageProps, {}>
         isHeaderVisible={ this.props.isHeaderVisible }
         componentStatus={
           <ComponentStatus
-            {...TextFieldStatus}
+            { ...TextFieldStatus }
           />
         }
       />
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
index 7172e73c5c6ea..2373ebbf3031b 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/TogglePage.tsx
@@ -36,6 +36,8 @@ export class TogglePage extends React.Component<IComponentDemoPageProps, {}> {
             </ExampleCard>
           </div>
         }
+        allowNativeProps={ true }
+        nativePropsElement={ 'input' }
         propertiesTables={
           <PropertiesTableSet
             sources={ [
@@ -84,7 +86,7 @@ export class TogglePage extends React.Component<IComponentDemoPageProps, {}> {
         isHeaderVisible={ this.props.isHeaderVisible }
         componentStatus={
           <ComponentStatus
-            {...ToggleStatus}
+            { ...ToggleStatus }
           />
         }
       />
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.tsx
index 35937c34431b8..a70b8579a4f0f 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipPage.tsx
@@ -40,6 +40,7 @@ export class TooltipPage extends React.Component<IComponentDemoPageProps, any> {
             </ExampleCard>
           </LayerHost>
         }
+        allowNativeProps={ true }
         propertiesTables={
           <PropertiesTableSet
             sources={ [
@@ -56,7 +57,7 @@ export class TooltipPage extends React.Component<IComponentDemoPageProps, any> {
         isHeaderVisible={ this.props.isHeaderVisible }
         componentStatus={
           <ComponentStatus
-            {...TooltipStatus}
+            { ...TooltipStatus }
           />
         }
       />

From 46aa0027f3b7c0bacd3f94a459be2220e307a10b Mon Sep 17 00:00:00 2001
From: bigbadcapers <caperez@microsoft.com>
Date: Mon, 12 Mar 2018 18:10:49 -0700
Subject: [PATCH 1566/1641] adding carlos perez to owners of file-type-icons
 (#4244)

---
 .github/CODEOWNERS | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index f26199694bb68..aeed91ebf7028 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -27,7 +27,7 @@ scripts/ @dzearing
 
 #### Packages
 # packages/example-app-base/
-packages/file-type-icons/  @KatherineThayerMicrosoft @jahnp
+packages/file-type-icons/  @KatherineThayerMicrosoft @jahnp @bigbadcapers
 # packages/icons/
 # packages/jest-serializer-merge-styles/
 # packages/merge-styles/

From 298ac062041a2323afb25027867b70f12870aa8f Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Mon, 12 Mar 2018 18:26:17 -0700
Subject: [PATCH 1567/1641] Customizable: fix import so it works with AMD
 (#4246)

* fix import to customizable so it doesn't break amd

* adding change file
---
 .../customizable-fix-imprt_2018-03-13-01-14.json      | 11 +++++++++++
 packages/utilities/src/customizable.tsx               |  4 +++-
 2 files changed, 14 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/@uifabric/utilities/customizable-fix-imprt_2018-03-13-01-14.json

diff --git a/common/changes/@uifabric/utilities/customizable-fix-imprt_2018-03-13-01-14.json b/common/changes/@uifabric/utilities/customizable-fix-imprt_2018-03-13-01-14.json
new file mode 100644
index 0000000000000..53c40fd6f853c
--- /dev/null
+++ b/common/changes/@uifabric/utilities/customizable-fix-imprt_2018-03-13-01-14.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Customizable: Fix hoist/customizations import so it doesn't break amd",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/utilities/src/customizable.tsx b/packages/utilities/src/customizable.tsx
index cc4c36585ba73..a4a036b8e178a 100644
--- a/packages/utilities/src/customizable.tsx
+++ b/packages/utilities/src/customizable.tsx
@@ -2,8 +2,10 @@ import * as React from 'react';
 import * as PropTypes from 'prop-types';
 import {
   Customizations,
+} from './Customizations';
+import {
   hoistStatics
-} from './';
+} from './hoistStatics';
 
 export function customizable(
   scope: string,

From a8fe4f8358c01b5a3c3db0b8b94bea7f55281e20 Mon Sep 17 00:00:00 2001
From: KatherineThayerMicrosoft <kathayer@microsoft.com>
Date: Mon, 12 Mar 2018 18:39:26 -0700
Subject: [PATCH 1568/1641] File type icons: Update icon mapping (#4243)

* Update file type icon mapping

* Fix tslint errors

* Add change file
---
 ...kathayer-updateicons_2018-03-12-22-39.json | 11 +++
 .../file-type-icons/src/FileTypeIconMap.ts    | 17 +++--
 .../src/getFileTypeIconProps.ts               | 46 +++++--------
 .../src/initializeFileTypeIcons.tsx           | 67 ++++++-------------
 4 files changed, 59 insertions(+), 82 deletions(-)
 create mode 100644 common/changes/@uifabric/file-type-icons/kathayer-updateicons_2018-03-12-22-39.json

diff --git a/common/changes/@uifabric/file-type-icons/kathayer-updateicons_2018-03-12-22-39.json b/common/changes/@uifabric/file-type-icons/kathayer-updateicons_2018-03-12-22-39.json
new file mode 100644
index 0000000000000..6e5ad1143dded
--- /dev/null
+++ b/common/changes/@uifabric/file-type-icons/kathayer-updateicons_2018-03-12-22-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/file-type-icons",
+      "comment": "Update file type icon mappings",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/file-type-icons",
+  "email": "kathayer@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/file-type-icons/src/FileTypeIconMap.ts b/packages/file-type-icons/src/FileTypeIconMap.ts
index f6afa3259c8b1..c747a95e71c26 100644
--- a/packages/file-type-icons/src/FileTypeIconMap.ts
+++ b/packages/file-type-icons/src/FileTypeIconMap.ts
@@ -28,7 +28,7 @@ export const FileTypeIconMap: { [key: string]: { extensions?: string[] } } = {
       'profile', 'ps1', 'pss', 'pt', 'py', 'pyw', 'r', 'rake', 'rb', 'rbx', 'rc', 'rdf', 're', 'reg',
       'rest', 'resw', 'resx', 'rhtml', 'rjs', 'rprofile', 'rpy', 'rss', 'rst', 'ruby', 'rxml', 's',
       'sass', 'scala', 'scm', 'sconscript', 'sconstruct', 'script', 'scss', 'sgml', 'sh', 'sh',
-      'shtml', 'sml', 'svn-base', 'sql', 'sql', 'sty', 'tcl', 'tex', 'textile', 'tld', 'tli',
+      'shtml', 'sml', 'svn-base', 'swift', 'sql', 'sty', 'tcl', 'tex', 'textile', 'tld', 'tli',
       'tmpl', 'tpl', 'vb', 'vi', 'vim', 'vmg', 'webpart', 'wsp', 'wsdl', 'xhtml', 'xoml', 'xsd',
       'xslt', 'yaml', 'yaws', 'yml', 'zsh'
     ]
@@ -49,14 +49,11 @@ export const FileTypeIconMap: { [key: string]: { extensions?: string[] } } = {
   'model': {
     extensions: [
       '3ds', '3mf', 'blend', 'cool', 'dae', 'df', 'dwfx', 'dwg', 'dxf', 'fbx', 'glb', 'gltf', 'holo',
-      'layout', 'max', 'off', 'ply', 'skp', 'stp', 'stl', 't', 'thl', 'x'
+      'layout', 'max', 'mtl', 'obj', 'off', 'ply', 'skp', 'stp', 'stl', 't', 'thl', 'x'
     ]
   },
   'mpp': { extensions: ['mpp'] },
   'mpt': { extensions: ['mpt'] },
-  'odp': { extensions: ['odp'] },
-  'ods': { extensions: ['ods'] },
-  'odt': { extensions: ['odt'] },
   'one': { extensions: ['one', 'onepkg'] }, // this is a format for exported single-file notebook pages
   'onetoc': { extensions: ['ms-one-stub', 'onetoc', 'onetoc2'] }, // this icon represents a complete, logical notebook.
   'pdf': { extensions: ['pdf'] },
@@ -70,9 +67,11 @@ export const FileTypeIconMap: { [key: string]: { extensions?: string[] } } = {
   'potx': { extensions: ['pot', 'potm', 'potx'] },
   'ppsx': { extensions: ['pps', 'ppsm', 'ppsx'] },
   'pptx': { extensions: ['ppt', 'pptm', 'pptx'] },
+  'presentation': { extensions: ['odp', 'gslides', 'key'] },
   'pub': { extensions: ['pub'] },
   'spo': { extensions: ['aspx'] },
-  'rtf': { extensions: ['epub', 'rtf', 'wri'] },
+  'spreadsheet': { extensions: ['ods', 'gsheet', 'numbers'] },
+  'rtf': { extensions: ['epub', 'gdoc', 'odt', 'rtf', 'wri', 'pages'] },
   'sharedfolder': {},
   'sysfile': {
     extensions: [
@@ -82,7 +81,11 @@ export const FileTypeIconMap: { [key: string]: { extensions?: string[] } } = {
     ]
   },
   'txt': { extensions: ['dif', 'diff', 'readme', 'out', 'plist', 'properties', 'text', 'txt'] },
-  'vector': { extensions: ['ai', 'dgn', 'pd', 'emf', 'eps', 'indd', 'indt', 'ps', 'svg', 'svgz', 'wmf', 'oxps', 'xps', 'xd', 'sketch'] },
+  'vector': {
+    extensions: [
+      'ai', 'dgn', 'gdraw', 'pd', 'emf', 'eps', 'indd', 'indt', 'ps', 'svg', 'svgz', 'wmf', 'oxps', 'xps', 'xd', 'sketch'
+    ]
+  },
   'video': {
     extensions: ['3gp', 'asf', 'avi', 'dvr-ms', 'flv', 'm1v', 'm4v', 'mkv', 'mod', 'mov',
       'mm4p', 'mp2', 'mp2v', 'mp4', ' mpa', 'mpe', 'mpeg', 'mpg', 'mpv', 'mpv2', 'mts', 'ogg', 'qt',
diff --git a/packages/file-type-icons/src/getFileTypeIconProps.ts b/packages/file-type-icons/src/getFileTypeIconProps.ts
index 831b4cf0a5201..8a7b7307c1eb5 100644
--- a/packages/file-type-icons/src/getFileTypeIconProps.ts
+++ b/packages/file-type-icons/src/getFileTypeIconProps.ts
@@ -105,36 +105,24 @@ function _getFileTypeIconSuffix(size: FileTypeIconSize, imageFileType: ImageFile
   let devicePixelRatio: number = window.devicePixelRatio;
   let devicePixelRatioSuffix = ''; // Default is 1x
 
-  if (size !== 64) {
-    // SVGs scale well, so you can generally use the default image.
-    // 1.5x is a special case where SVGs need a different image.
-    if (imageFileType === 'svg' && 1 < devicePixelRatio && devicePixelRatio <= 1.5) {
-      // Currently missing 1.5x SVGs at sizes 20 and 40, snap to 1x for now
-      if (size !== 20 && size !== 40) {
-        devicePixelRatioSuffix = '_1.5x';
-      }
-    } else if (imageFileType === 'png') {
-      // To look good, PNGs should use a different image for higher device pixel ratios
-      if (1 < devicePixelRatio && devicePixelRatio <= 1.5) {
-        // Currently missing 1.5x icons for size 20, snap to 2x for now
-        devicePixelRatioSuffix = (size === 20) ? '_2x' : '_1.5x';
-      } else if (1.5 < devicePixelRatio && devicePixelRatio <= 2) {
-        devicePixelRatioSuffix = '_2x';
-      } else if (2 < devicePixelRatio && devicePixelRatio <= 3) {
-        devicePixelRatioSuffix = '_3x';
-      } else if (3 < devicePixelRatio) {
-        devicePixelRatioSuffix = '_4x';
-      }
+  // SVGs scale well, so you can generally use the default image.
+  // 1.5x is a special case where SVGs need a different image.
+  if (imageFileType === 'svg' && 1 < devicePixelRatio && devicePixelRatio <= 1.5) {
+    // Currently missing 1.5x SVGs at size 20, snap to 1x for now
+    if (size !== 20) {
+      devicePixelRatioSuffix = '_1.5x';
     }
-  } else {
-    // Currently we have a more limited set of image files for size 64.
-    // For SVGs, we only have the default 1x. For PNGs, we have 1x, 1.5x, and 2x.
-    if (imageFileType === 'png') {
-      if (1 < devicePixelRatio && devicePixelRatio <= 1.5) {
-        devicePixelRatioSuffix = '_1.5x';
-      } else if (1.5 < devicePixelRatio) {
-        devicePixelRatioSuffix = '_2x';
-      }
+  } else if (imageFileType === 'png') {
+    // To look good, PNGs should use a different image for higher device pixel ratios
+    if (1 < devicePixelRatio && devicePixelRatio <= 1.5) {
+      // Currently missing 1.5x icons for size 20, snap to 2x for now
+      devicePixelRatioSuffix = (size === 20) ? '_2x' : '_1.5x';
+    } else if (1.5 < devicePixelRatio && devicePixelRatio <= 2) {
+      devicePixelRatioSuffix = '_2x';
+    } else if (2 < devicePixelRatio && devicePixelRatio <= 3) {
+      devicePixelRatioSuffix = '_3x';
+    } else if (3 < devicePixelRatio) {
+      devicePixelRatioSuffix = '_4x';
     }
   }
 
diff --git a/packages/file-type-icons/src/initializeFileTypeIcons.tsx b/packages/file-type-icons/src/initializeFileTypeIcons.tsx
index 6cac0f4b1f8e0..2854caee2aa3a 100644
--- a/packages/file-type-icons/src/initializeFileTypeIcons.tsx
+++ b/packages/file-type-icons/src/initializeFileTypeIcons.tsx
@@ -6,15 +6,18 @@ const PNG_SUFFIX = '_png';
 const SVG_SUFFIX = '_svg';
 
 const DEFAULT_BASE_URL = 'https://spoprod-a.akamaihd.net/files/fabric/assets/item-types/';
-const ICON_SIZES: number[] = [16, 20, 32, 40, 48, 96];
+const ICON_SIZES: number[] = [16, 20, 32, 40, 48, 64, 96];
+
+// Due to CDN cache, images updated in place may take up to a year to appear for some users
+// (though most users will see them within a week). To force immediate refresh, append a
+// unique string to the end of the URL. The CDN uses the URL as the cache key, so passing a
+// new URL will cause the CDN to create a new cache key.
+const REFRESH_STRING = '?refresh1';
 
 export function initializeFileTypeIcons(baseUrl: string = DEFAULT_BASE_URL, options?: Partial<IIconOptions>): void {
   ICON_SIZES.forEach((size: number) => {
     _initializeIcons(baseUrl, size, options);
   });
-  // Currently we have a more limited set of image files for size 64.
-  // When we have the full set, add 64 to ICON_SIZES and remove _initializeSize64Icons.
-  _initializeSize64Icons(baseUrl, options);
 }
 
 function _initializeIcons(baseUrl: string, size: number, options?: Partial<IIconOptions>): void {
@@ -22,64 +25,36 @@ function _initializeIcons(baseUrl: string, size: number, options?: Partial<IIcon
   const fileTypeIcons: { [key: string]: JSX.Element } = {};
 
   iconTypes.forEach((type: string) => {
-    fileTypeIcons[type + size + PNG_SUFFIX] = <img src={ baseUrl + size + '/' + type + '.png' } />;
-    fileTypeIcons[type + size + SVG_SUFFIX] = <img src={ baseUrl + size + '/' + type + '.svg' } />;
+    fileTypeIcons[type + size + PNG_SUFFIX] = (
+      <img src={ baseUrl + size + '/' + type + '.png' + REFRESH_STRING } />
+    );
+    fileTypeIcons[type + size + SVG_SUFFIX] = (
+      <img src={ baseUrl + size + '/' + type + '.svg' + REFRESH_STRING } />
+    );
 
     // For high resolution screens, register additional versions
     // Apply height=100% and width=100% to force image to fit into containing element
 
     // SVGs scale well, so you can generally use the default image.
     // 1.5x is a special case where both SVGs and PNGs need a different image.
-    // Remove if statements when missing image files for sizes 20 and 40 are provided.
+    // Remove if statements when missing image files for 20_1.5x are provided.
     if (size !== 20) {
       fileTypeIcons[type + size + '_1.5x' + PNG_SUFFIX] = (
-        <img src={ baseUrl + size + '_1.5x/' + type + '.png' } height='100%' width='100%' />
+        <img src={ baseUrl + size + '_1.5x/' + type + '.png' + REFRESH_STRING } height='100%' width='100%' />
+      );
+      fileTypeIcons[type + size + '_1.5x' + SVG_SUFFIX] = (
+        <img src={ baseUrl + size + '_1.5x/' + type + '.svg' + REFRESH_STRING } height='100%' width='100%' />
       );
-      if (size !== 40) {
-        fileTypeIcons[type + size + '_1.5x' + SVG_SUFFIX] = (
-          <img src={ baseUrl + size + '_1.5x/' + type + '.svg' } height='100%' width='100%' />
-        );
-      }
     }
 
     fileTypeIcons[type + size + '_2x' + PNG_SUFFIX] = (
-      <img src={ baseUrl + size + '_2x/' + type + '.png' } height='100%' width='100%' />
+      <img src={ baseUrl + size + '_2x/' + type + '.png' + REFRESH_STRING } height='100%' width='100%' />
     );
     fileTypeIcons[type + size + '_3x' + PNG_SUFFIX] = (
-      <img src={ baseUrl + size + '_3x/' + type + '.png' } height='100%' width='100%' />
+      <img src={ baseUrl + size + '_3x/' + type + '.png' + REFRESH_STRING } height='100%' width='100%' />
     );
     fileTypeIcons[type + size + '_4x' + PNG_SUFFIX] = (
-      <img src={ baseUrl + size + '_4x/' + type + '.png' } height='100%' width='100%' />
-    );
-  });
-
-  registerIcons({
-    fontFace: {},
-    style: {
-      width: size,
-      height: size,
-      overflow: 'hidden'
-    },
-    icons: fileTypeIcons
-  }, options);
-}
-
-function _initializeSize64Icons(baseUrl: string, options?: Partial<IIconOptions>): void {
-  const iconTypes: string[] = Object.keys(FileTypeIconMap);
-  const fileTypeIcons: { [key: string]: JSX.Element } = {};
-  const size = 64;
-
-  iconTypes.forEach((type: string) => {
-    fileTypeIcons[type + size + PNG_SUFFIX] = <img src={ baseUrl + size + '/' + type + '.png' } />;
-    fileTypeIcons[type + size + SVG_SUFFIX] = <img src={ baseUrl + size + '/' + type + '.svg' } />;
-
-    // For high resolution screens, register additional versions.
-    // Size 64 only has PNGs for 1.5x and 2x.
-    fileTypeIcons[type + size + '_1.5x' + PNG_SUFFIX] = (
-      <img src={ baseUrl + size + '_1.5x/' + type + '.png' } height='100%' width='100%' />
-    );
-    fileTypeIcons[type + size + '_2x' + PNG_SUFFIX] = (
-      <img src={ baseUrl + size + '_2x/' + type + '.png' } height='100%' width='100%' />
+      <img src={ baseUrl + size + '_4x/' + type + '.png' + REFRESH_STRING } height='100%' width='100%' />
     );
   });
 

From c4aac24a48a6b27c6b7459ac42014c8683d5104b Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 13 Mar 2018 10:17:38 +0000
Subject: [PATCH 1569/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...kathayer-updateicons_2018-03-12-22-39.json | 11 -------
 ...stomizable-fix-imprt_2018-03-13-01-14.json | 11 -------
 ...tepicker-isopen-4176_2018-03-12-18-20.json | 11 -------
 ...entation-nativeprops_2018-03-08-19-35.json | 11 -------
 ...fix-activedescendant_2018-03-12-18-09.json | 11 -------
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/package.json             |  4 +--
 packages/file-type-icons/CHANGELOG.json       | 14 +++++++++
 packages/file-type-icons/CHANGELOG.md         |  9 +++++-
 packages/file-type-icons/package.json         |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 31 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 14 ++++++++-
 packages/office-ui-fabric-react/package.json  |  4 +--
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 +++++++++
 packages/utilities/CHANGELOG.md               |  9 +++++-
 packages/utilities/package.json               |  2 +-
 22 files changed, 101 insertions(+), 71 deletions(-)
 delete mode 100644 common/changes/@uifabric/file-type-icons/kathayer-updateicons_2018-03-12-22-39.json
 delete mode 100644 common/changes/@uifabric/utilities/customizable-fix-imprt_2018-03-13-01-14.json
 delete mode 100644 common/changes/office-ui-fabric-react/datepicker-isopen-4176_2018-03-12-18-20.json
 delete mode 100644 common/changes/office-ui-fabric-react/documentation-nativeprops_2018-03-08-19-35.json
 delete mode 100644 common/changes/office-ui-fabric-react/pickers-fix-activedescendant_2018-03-12-18-09.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index d434349458272..40cc5ace78f69 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.63.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index ea04e6f7bb74d..b303dd0204c39 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.63.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 7faab6749a3bb..6aa1b0955b413 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.63.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 3a6c4879e2227..f13179241960a 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.63.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 3197628e7cba0..54a227867065f 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.63.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/common/changes/@uifabric/file-type-icons/kathayer-updateicons_2018-03-12-22-39.json b/common/changes/@uifabric/file-type-icons/kathayer-updateicons_2018-03-12-22-39.json
deleted file mode 100644
index 6e5ad1143dded..0000000000000
--- a/common/changes/@uifabric/file-type-icons/kathayer-updateicons_2018-03-12-22-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/file-type-icons",
-      "comment": "Update file type icon mappings",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/file-type-icons",
-  "email": "kathayer@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/customizable-fix-imprt_2018-03-13-01-14.json b/common/changes/@uifabric/utilities/customizable-fix-imprt_2018-03-13-01-14.json
deleted file mode 100644
index 53c40fd6f853c..0000000000000
--- a/common/changes/@uifabric/utilities/customizable-fix-imprt_2018-03-13-01-14.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Customizable: Fix hoist/customizations import so it doesn't break amd",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/datepicker-isopen-4176_2018-03-12-18-20.json b/common/changes/office-ui-fabric-react/datepicker-isopen-4176_2018-03-12-18-20.json
deleted file mode 100644
index 4f6969b0f6757..0000000000000
--- a/common/changes/office-ui-fabric-react/datepicker-isopen-4176_2018-03-12-18-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added an is-open class to the DatePicker root element to indicate when the datepicker is being shown based on the IDatePickerState.isDatePickerShown state property.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/documentation-nativeprops_2018-03-08-19-35.json b/common/changes/office-ui-fabric-react/documentation-nativeprops_2018-03-08-19-35.json
deleted file mode 100644
index cab121b2f4ee9..0000000000000
--- a/common/changes/office-ui-fabric-react/documentation-nativeprops_2018-03-08-19-35.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added documentation for components that allow native props",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/pickers-fix-activedescendant_2018-03-12-18-09.json b/common/changes/office-ui-fabric-react/pickers-fix-activedescendant_2018-03-12-18-09.json
deleted file mode 100644
index 704daf3de6b01..0000000000000
--- a/common/changes/office-ui-fabric-react/pickers-fix-activedescendant_2018-03-12-18-09.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Pickers: Fix aria bug where activedescendant would be sug--1",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 6cd2811d022ef..b9142bfcaade0 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.19.1 <6.0.0",
-    "@uifabric/utilities": ">=5.18.0 <6.0.0",
+    "@uifabric/utilities": ">=5.18.1 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 787a0bb3a5ef1..8d07916923446 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -30,7 +30,7 @@
     "@types/enzyme-adapter-react-16": "1.0.1",
     "@types/webpack-env": "1.13.0",
     "@uifabric/example-app-base": ">=5.3.0 <6.0.0",
-    "@uifabric/file-type-icons": ">=0.3.0 <1.0.0",
+    "@uifabric/file-type-icons": ">=0.4.0 <1.0.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.1.0 <6.0.0",
     "es6-weak-map": "^2.0.2",
     "enzyme": "^3.2.0",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.63.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.0 <6.0.0",
     "@uifabric/icons": ">=5.5.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/file-type-icons/CHANGELOG.json b/packages/file-type-icons/CHANGELOG.json
index 2c7d865154efa..bc32b0793e25f 100644
--- a/packages/file-type-icons/CHANGELOG.json
+++ b/packages/file-type-icons/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/file-type-icons",
   "entries": [
+    {
+      "version": "0.4.0",
+      "tag": "@uifabric/file-type-icons_v0.4.0",
+      "date": "Tue, 13 Mar 2018 10:17:37 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "KatherineThayerMicrosoft <kathayer@microsoft.com>",
+            "commit": "a8fe4f8358c01b5a3c3db0b8b94bea7f55281e20",
+            "comment": "Update file type icon mappings"
+          }
+        ]
+      }
+    },
     {
       "version": "0.3.0",
       "tag": "@uifabric/file-type-icons_v0.3.0",
diff --git a/packages/file-type-icons/CHANGELOG.md b/packages/file-type-icons/CHANGELOG.md
index 93eaac50b83ab..871c12efae36e 100644
--- a/packages/file-type-icons/CHANGELOG.md
+++ b/packages/file-type-icons/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/file-type-icons
 
-This log was last generated on Fri, 12 Jan 2018 20:03:22 GMT and should not be manually modified.
+This log was last generated on Tue, 13 Mar 2018 10:17:37 GMT and should not be manually modified.
+
+## 0.4.0
+Tue, 13 Mar 2018 10:17:37 GMT
+
+### Minor changes
+
+- Update file type icon mappings
 
 ## 0.3.0
 Fri, 12 Jan 2018 20:03:21 GMT
diff --git a/packages/file-type-icons/package.json b/packages/file-type-icons/package.json
index 08ee2e300ab7c..d625723ac1746 100644
--- a/packages/file-type-icons/package.json
+++ b/packages/file-type-icons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/file-type-icons",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "description": "Office UI Fabric file type icon set.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index e666bcbba577b..8a386d46efdc4 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,37 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.64.0",
+      "tag": "office-ui-fabric-react_v5.64.0",
+      "date": "Tue, 13 Mar 2018 10:17:37 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "7a6c2bda4918fb262600609f2169a337c2613328",
+            "comment": "Added an is-open class to the DatePicker root element to indicate when the datepicker is being shown based on the IDatePickerState.isDatePickerShown state property."
+          },
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "a1271228d199722b34c61b903e7ef4c0e4cba744",
+            "comment": "Added documentation for components that allow native props"
+          }
+        ],
+        "patch": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "6bce81a5497dcf09595e6e6bb04591595a887cce",
+            "comment": "Pickers: Fix aria bug where activedescendant would be sug--1"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.18.0 <6.0.0` to `>=5.18.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.63.0",
       "tag": "office-ui-fabric-react_v5.63.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index ffafebbe4013f..789c4e24bb9d8 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,18 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 12 Mar 2018 06:29:20 GMT and should not be manually modified.
+This log was last generated on Tue, 13 Mar 2018 10:17:37 GMT and should not be manually modified.
+
+## 5.64.0
+Tue, 13 Mar 2018 10:17:37 GMT
+
+### Minor changes
+
+- Added an is-open class to the DatePicker root element to indicate when the datepicker is being shown based on the IDatePickerState.isDatePickerShown state property.
+- Added documentation for components that allow native props
+
+### Patches
+
+- Pickers: Fix aria bug where activedescendant would be sug--1
 
 ## 5.63.0
 Mon, 12 Mar 2018 06:29:20 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 034a972cecf8c..0a70f76184991 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.63.0",
+  "version": "5.64.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -51,7 +51,7 @@
     "@uifabric/icons": ">=5.5.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "@uifabric/styling": ">=5.19.1 <6.0.0",
-    "@uifabric/utilities": ">=5.18.0 <6.0.0",
+    "@uifabric/utilities": ">=5.18.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index c7f9e61e5611c..c4ef313064762 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -28,7 +28,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.18.0 <6.0.0",
+    "@uifabric/utilities": ">=5.18.1 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index d68b13a26783f..593c8f56ff631 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.18.1",
+      "tag": "@uifabric/utilities_v5.18.1",
+      "date": "Tue, 13 Mar 2018 10:17:37 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "298ac062041a2323afb25027867b70f12870aa8f",
+            "comment": "Customizable: Fix hoist/customizations import so it doesn't break amd"
+          }
+        ]
+      }
+    },
     {
       "version": "5.18.0",
       "tag": "@uifabric/utilities_v5.18.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index e645b02366ece..f8e37e9b30258 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Mon, 12 Mar 2018 06:29:20 GMT and should not be manually modified.
+This log was last generated on Tue, 13 Mar 2018 10:17:37 GMT and should not be manually modified.
+
+## 5.18.1
+Tue, 13 Mar 2018 10:17:37 GMT
+
+### Patches
+
+- Customizable: Fix hoist/customizations import so it doesn't break amd
 
 ## 5.18.0
 Mon, 12 Mar 2018 06:29:20 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index e5b1c459fe0af..3e932851eef11 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.18.0",
+  "version": "5.18.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From f973b9c00982af3a844f34c6e11aa0644fb2d0a6 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 13 Mar 2018 11:35:33 -0700
Subject: [PATCH 1570/1641] File type icons - adding npmrc. (#4252)

* Adding npm config files.

* Adding change files.
---
 .../file-type-icons_2018-03-13-18-33.json     | 11 +++++++
 .../file-type-icons_2018-03-13-18-33.json     | 11 +++++++
 packages/file-type-icons/.npmignore           | 29 +++++++++++++++++++
 packages/file-type-icons/.npmrc               |  2 ++
 packages/icons/.npmignore                     | 29 +++++++++++++++++++
 packages/icons/.npmrc                         |  2 ++
 6 files changed, 84 insertions(+)
 create mode 100644 common/changes/@uifabric/file-type-icons/file-type-icons_2018-03-13-18-33.json
 create mode 100644 common/changes/@uifabric/icons/file-type-icons_2018-03-13-18-33.json
 create mode 100644 packages/file-type-icons/.npmignore
 create mode 100644 packages/file-type-icons/.npmrc
 create mode 100644 packages/icons/.npmignore
 create mode 100644 packages/icons/.npmrc

diff --git a/common/changes/@uifabric/file-type-icons/file-type-icons_2018-03-13-18-33.json b/common/changes/@uifabric/file-type-icons/file-type-icons_2018-03-13-18-33.json
new file mode 100644
index 0000000000000..4dd3ba95f4eac
--- /dev/null
+++ b/common/changes/@uifabric/file-type-icons/file-type-icons_2018-03-13-18-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/file-type-icons",
+      "comment": "Adjusting npmrc to ensure we have pu",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/file-type-icons",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/file-type-icons_2018-03-13-18-33.json b/common/changes/@uifabric/icons/file-type-icons_2018-03-13-18-33.json
new file mode 100644
index 0000000000000..92095034f466b
--- /dev/null
+++ b/common/changes/@uifabric/icons/file-type-icons_2018-03-13-18-33.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/icons",
+      "comment": "Adjusting npmrc to ensure we have published to the correct registry.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/icons",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/file-type-icons/.npmignore b/packages/file-type-icons/.npmignore
new file mode 100644
index 0000000000000..bc156d511e38c
--- /dev/null
+++ b/packages/file-type-icons/.npmignore
@@ -0,0 +1,29 @@
+*.config.js
+*.nuspec
+*.yml
+*.test.*
+.editorconfig
+.gitattributes
+.gitignore
+.vscode
+coverage
+temp
+images
+results
+*.build.log
+dist/*.stats.html
+dist/demo*.*
+gulpfile.js
+index.html
+jsconfig.json
+karma.config.js
+node_modules
+src/**/*
+!src/**/*.types.ts
+!src/**/examples/*.tsx
+tsconfig.json
+tsd.json
+tslint.json
+typings
+webpack.config.js
+fabric-test*
\ No newline at end of file
diff --git a/packages/file-type-icons/.npmrc b/packages/file-type-icons/.npmrc
new file mode 100644
index 0000000000000..825c83e09df4d
--- /dev/null
+++ b/packages/file-type-icons/.npmrc
@@ -0,0 +1,2 @@
+registry=https://registry.npmjs.org/
+
diff --git a/packages/icons/.npmignore b/packages/icons/.npmignore
new file mode 100644
index 0000000000000..bc156d511e38c
--- /dev/null
+++ b/packages/icons/.npmignore
@@ -0,0 +1,29 @@
+*.config.js
+*.nuspec
+*.yml
+*.test.*
+.editorconfig
+.gitattributes
+.gitignore
+.vscode
+coverage
+temp
+images
+results
+*.build.log
+dist/*.stats.html
+dist/demo*.*
+gulpfile.js
+index.html
+jsconfig.json
+karma.config.js
+node_modules
+src/**/*
+!src/**/*.types.ts
+!src/**/examples/*.tsx
+tsconfig.json
+tsd.json
+tslint.json
+typings
+webpack.config.js
+fabric-test*
\ No newline at end of file
diff --git a/packages/icons/.npmrc b/packages/icons/.npmrc
new file mode 100644
index 0000000000000..825c83e09df4d
--- /dev/null
+++ b/packages/icons/.npmrc
@@ -0,0 +1,2 @@
+registry=https://registry.npmjs.org/
+

From 0904a98019ac935ed975f6188624cc68df477a25 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 13 Mar 2018 12:24:21 -0700
Subject: [PATCH 1571/1641] Website: Hide left nav on mobile (#4253)

* Don't display the left nav in mobile

* Breakpoint fix

* Added change file
---
 .../fabric-website/src/components/Nav/Nav.module.scss |  6 ++++++
 .../left-nav-mobile_2018-03-13-18-48.json             | 11 +++++++++++
 2 files changed, 17 insertions(+)
 create mode 100644 common/changes/@uifabric/fabric-website/left-nav-mobile_2018-03-13-18-48.json

diff --git a/apps/fabric-website/src/components/Nav/Nav.module.scss b/apps/fabric-website/src/components/Nav/Nav.module.scss
index f6aa96b879caf..24ec50dcca26c 100644
--- a/apps/fabric-website/src/components/Nav/Nav.module.scss
+++ b/apps/fabric-website/src/components/Nav/Nav.module.scss
@@ -96,3 +96,9 @@ $nav-group-header-height: 40px;
     }
   }
 }
+
+@media only screen and (max-width: $uhf-screen-max-mobile) {
+  .nav {
+    display: none;
+  }
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/left-nav-mobile_2018-03-13-18-48.json b/common/changes/@uifabric/fabric-website/left-nav-mobile_2018-03-13-18-48.json
new file mode 100644
index 0000000000000..ecafd7d5f4139
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/left-nav-mobile_2018-03-13-18-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Hide left nav on mobile.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From 5ff64cbb9cfcfe3bd0cdfa4bcfb6d75ff453d2e8 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 13 Mar 2018 20:00:06 +0000
Subject: [PATCH 1572/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json                 | 14 ++++++++++++++
 apps/fabric-website/CHANGELOG.md                   |  9 ++++++++-
 apps/fabric-website/package.json                   |  2 +-
 .../left-nav-mobile_2018-03-13-18-48.json          | 11 -----------
 .../file-type-icons_2018-03-13-18-33.json          | 11 -----------
 .../icons/file-type-icons_2018-03-13-18-33.json    | 11 -----------
 packages/experiments/package.json                  |  4 ++--
 packages/file-type-icons/CHANGELOG.json            | 14 ++++++++++++++
 packages/file-type-icons/CHANGELOG.md              |  9 ++++++++-
 packages/file-type-icons/package.json              |  2 +-
 packages/icons/CHANGELOG.json                      | 14 ++++++++++++++
 packages/icons/CHANGELOG.md                        |  9 ++++++++-
 packages/icons/package.json                        |  2 +-
 packages/office-ui-fabric-react/package.json       |  2 +-
 14 files changed, 72 insertions(+), 42 deletions(-)
 delete mode 100644 common/changes/@uifabric/fabric-website/left-nav-mobile_2018-03-13-18-48.json
 delete mode 100644 common/changes/@uifabric/file-type-icons/file-type-icons_2018-03-13-18-33.json
 delete mode 100644 common/changes/@uifabric/icons/file-type-icons_2018-03-13-18-33.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 4a9450389a750..08c9d57862534 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.3.4",
+      "tag": "@uifabric/fabric-website_v5.3.4",
+      "date": "Tue, 13 Mar 2018 20:00:06 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "0904a98019ac935ed975f6188624cc68df477a25",
+            "comment": "Hide left nav on mobile."
+          }
+        ]
+      }
+    },
     {
       "version": "5.3.3",
       "tag": "@uifabric/fabric-website_v5.3.3",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 26d280f3446c9..ced01d6c12318 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Fri, 09 Mar 2018 11:13:58 GMT and should not be manually modified.
+This log was last generated on Tue, 13 Mar 2018 20:00:06 GMT and should not be manually modified.
+
+## 5.3.4
+Tue, 13 Mar 2018 20:00:06 GMT
+
+### Patches
+
+- Hide left nav on mobile.
 
 ## 5.3.3
 Fri, 09 Mar 2018 11:13:58 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 40cc5ace78f69..d3b272d1cef12 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.3.3",
+  "version": "5.3.4",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/common/changes/@uifabric/fabric-website/left-nav-mobile_2018-03-13-18-48.json b/common/changes/@uifabric/fabric-website/left-nav-mobile_2018-03-13-18-48.json
deleted file mode 100644
index ecafd7d5f4139..0000000000000
--- a/common/changes/@uifabric/fabric-website/left-nav-mobile_2018-03-13-18-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Hide left nav on mobile.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/file-type-icons/file-type-icons_2018-03-13-18-33.json b/common/changes/@uifabric/file-type-icons/file-type-icons_2018-03-13-18-33.json
deleted file mode 100644
index 4dd3ba95f4eac..0000000000000
--- a/common/changes/@uifabric/file-type-icons/file-type-icons_2018-03-13-18-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/file-type-icons",
-      "comment": "Adjusting npmrc to ensure we have pu",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/file-type-icons",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/file-type-icons_2018-03-13-18-33.json b/common/changes/@uifabric/icons/file-type-icons_2018-03-13-18-33.json
deleted file mode 100644
index 92095034f466b..0000000000000
--- a/common/changes/@uifabric/icons/file-type-icons_2018-03-13-18-33.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/icons",
-      "comment": "Adjusting npmrc to ensure we have published to the correct registry.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/icons",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 8d07916923446..bd8783721e023 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -30,7 +30,7 @@
     "@types/enzyme-adapter-react-16": "1.0.1",
     "@types/webpack-env": "1.13.0",
     "@uifabric/example-app-base": ">=5.3.0 <6.0.0",
-    "@uifabric/file-type-icons": ">=0.4.0 <1.0.0",
+    "@uifabric/file-type-icons": ">=0.5.0 <1.0.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.1.0 <6.0.0",
     "es6-weak-map": "^2.0.2",
     "enzyme": "^3.2.0",
@@ -45,7 +45,7 @@
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
     "office-ui-fabric-react": ">=5.64.0 <6.0.0",
-    "@uifabric/icons": ">=5.5.0 <6.0.0",
+    "@uifabric/icons": ">=5.6.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/file-type-icons/CHANGELOG.json b/packages/file-type-icons/CHANGELOG.json
index bc32b0793e25f..3d0e4af5dbb6c 100644
--- a/packages/file-type-icons/CHANGELOG.json
+++ b/packages/file-type-icons/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/file-type-icons",
   "entries": [
+    {
+      "version": "0.5.0",
+      "tag": "@uifabric/file-type-icons_v0.5.0",
+      "date": "Tue, 13 Mar 2018 20:00:06 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "f973b9c00982af3a844f34c6e11aa0644fb2d0a6",
+            "comment": "Adjusting npmrc to ensure we have pu"
+          }
+        ]
+      }
+    },
     {
       "version": "0.4.0",
       "tag": "@uifabric/file-type-icons_v0.4.0",
diff --git a/packages/file-type-icons/CHANGELOG.md b/packages/file-type-icons/CHANGELOG.md
index 871c12efae36e..151753557eee9 100644
--- a/packages/file-type-icons/CHANGELOG.md
+++ b/packages/file-type-icons/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/file-type-icons
 
-This log was last generated on Tue, 13 Mar 2018 10:17:37 GMT and should not be manually modified.
+This log was last generated on Tue, 13 Mar 2018 20:00:06 GMT and should not be manually modified.
+
+## 0.5.0
+Tue, 13 Mar 2018 20:00:06 GMT
+
+### Minor changes
+
+- Adjusting npmrc to ensure we have pu
 
 ## 0.4.0
 Tue, 13 Mar 2018 10:17:37 GMT
diff --git a/packages/file-type-icons/package.json b/packages/file-type-icons/package.json
index d625723ac1746..1fa3df1587e5c 100644
--- a/packages/file-type-icons/package.json
+++ b/packages/file-type-icons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/file-type-icons",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "description": "Office UI Fabric file type icon set.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/icons/CHANGELOG.json b/packages/icons/CHANGELOG.json
index 192377f302b87..547fdc0982b67 100644
--- a/packages/icons/CHANGELOG.json
+++ b/packages/icons/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/icons",
   "entries": [
+    {
+      "version": "5.6.0",
+      "tag": "@uifabric/icons_v5.6.0",
+      "date": "Tue, 13 Mar 2018 20:00:06 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "f973b9c00982af3a844f34c6e11aa0644fb2d0a6",
+            "comment": "Adjusting npmrc to ensure we have published to the correct registry."
+          }
+        ]
+      }
+    },
     {
       "version": "5.5.0",
       "tag": "@uifabric/icons_v5.5.0",
diff --git a/packages/icons/CHANGELOG.md b/packages/icons/CHANGELOG.md
index a2e2666bca9f1..3143c43a41e9d 100644
--- a/packages/icons/CHANGELOG.md
+++ b/packages/icons/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/icons
 
-This log was last generated on Fri, 02 Mar 2018 11:25:35 GMT and should not be manually modified.
+This log was last generated on Tue, 13 Mar 2018 20:00:06 GMT and should not be manually modified.
+
+## 5.6.0
+Tue, 13 Mar 2018 20:00:06 GMT
+
+### Minor changes
+
+- Adjusting npmrc to ensure we have published to the correct registry.
 
 ## 5.5.0
 Fri, 02 Mar 2018 11:25:35 GMT
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 3164827a8382a..c24ff97ae781f 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/icons",
-  "version": "5.5.0",
+  "version": "5.6.0",
   "description": "Office UI Fabric icon set.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 0a70f76184991..72aa558717908 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -48,7 +48,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/icons": ">=5.5.0 <6.0.0",
+    "@uifabric/icons": ">=5.6.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "@uifabric/styling": ">=5.19.1 <6.0.0",
     "@uifabric/utilities": ">=5.18.1 <6.0.0",

From b8b61b108fb4184199d4a2b9cf3642f8d096e8f3 Mon Sep 17 00:00:00 2001
From: Mark Polak <mark@thedutchies.com>
Date: Tue, 13 Mar 2018 21:06:45 +0100
Subject: [PATCH 1573/1641] Update createRef documentation (#4247)

* Update createRef documentation

* Update BESTPRACTICES.md

* Update BESTPRACTICES.md
---
 ghdocs/BESTPRACTICES.md | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/ghdocs/BESTPRACTICES.md b/ghdocs/BESTPRACTICES.md
index 3867d7b849df8..9b8481f5b30cc 100644
--- a/ghdocs/BESTPRACTICES.md
+++ b/ghdocs/BESTPRACTICES.md
@@ -173,14 +173,26 @@ public render() {
 ```
 
 Best, use createRef:
+
+The `createRef` function in `lib/Utilities` is a polyfill for [React.createRef](https://github.com/facebook/react/pull/11555). (When Fabric switches over to React 16, we'll use React.createRef instead)
+
+`createRef` creates a reference object that has the following type `{ value: T | null }`, where T is the element to reference (either a dom node or a react component). You set the reference by passing the reference object as the `ref` prop. You can then subsequently access the reference through the `.value` property on the reference object elsewhere in your code.
+
 ```typescript
 import { createRef } from 'office-ui-fabric-react/lib/Utilities';
 
 class Foo extends BaseComponent<...> {
-  private _root = createRef<HTMLElement>();
+  // Create the reference object that will be used for setting and accessing the reference
+  private _root = createRef<HTMLButtonElement>();
 
   public render() {
-    return <div ref={ _root } />;
+    // Set the reference by passing the reference object as the ref prop
+    return <button ref={ _root } onClick={this._onClick} />;
+  }
+  
+  private _onClick() {
+    // Access the reference through the .value property on the reference object
+    this._root.value.focus();
   }
 }
 ```

From 20d3b5f8cadc5051a1a002d2af6e90d015aa2191 Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Tue, 13 Mar 2018 13:12:08 -0700
Subject: [PATCH 1574/1641] Variants: add example to readme (#4245)

* add an example

* changefile
---
 ...hkuo-variantsExample_2018-03-13-01-13.json | 11 ++++++++
 packages/variants/README.md                   | 25 +++++++++++++------
 2 files changed, 29 insertions(+), 7 deletions(-)
 create mode 100644 common/changes/@uifabric/variants/phkuo-variantsExample_2018-03-13-01-13.json

diff --git a/common/changes/@uifabric/variants/phkuo-variantsExample_2018-03-13-01-13.json b/common/changes/@uifabric/variants/phkuo-variantsExample_2018-03-13-01-13.json
new file mode 100644
index 0000000000000..2bad32a878474
--- /dev/null
+++ b/common/changes/@uifabric/variants/phkuo-variantsExample_2018-03-13-01-13.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/variants",
+      "comment": "add a usage example to the readme",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/variants",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/variants/README.md b/packages/variants/README.md
index 34d0d5cc173f6..c9f76c4e3d4bb 100644
--- a/packages/variants/README.md
+++ b/packages/variants/README.md
@@ -2,14 +2,25 @@
 
 Variants are [themes](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/ghdocs/Theming.md) generated from an existing theme, as opposed to [from raw colors](https://developer.microsoft.com/en-us/fabric#/styles/themegenerator). A variant will share the same colors as the original theme it was generated from, but will use those colors differently. For example, the background color and text color might be swapped. Variants can be used to highlight or de-emphasize portions of the page.
 
-This project provides helper functions to create variants of a given theme, which are intended for use with the [Customizer](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/utilities/src/Customizer.tsx) component. Each function takes in an [IPartialTheme](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/styling/src/interfaces/ITheme.ts) and returns an [ITheme](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/styling/src/interfaces/ITheme.ts).
+Example of normal, soft, and strong variants:
 
-The available variants are:
+![example of variants](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/variants/example.png)
 
-* Neutral (not yet implemented) - a soft neutral color is used as the background (light gray in the default theme), most other colors are changed very little or not at all
-* Soft - a soft shade of the primary color is used as the background (light blue in the default theme), most other colors are changed very little or not at all, but input controls look different
-* Strong - a strong shade of the primary color is used as the background (blue in the default theme), almost all colors are changed
+This project provides helper functions to create variants of a given theme, which can be used with the [Customizer](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/utilities/src/Customizer.tsx) component to theme a specific portion of the page. Each function takes in an [IPartialTheme](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/styling/src/interfaces/ITheme.ts) and returns an [ITheme](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/styling/src/interfaces/ITheme.ts).
 
-Example of normal, soft, and strong variants:
+The following example uses [getTheme()](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/styling/src/styles/theme.ts) to grab the current global theme, then creates a strong variant of the that theme, and applies that strong variant to the components wrapped by Customizer.
+
+```
+<Customizer settings={ { theme: getStrongVariant(getTheme()) } }>
+  <components... />
+</Customizer>
+```
+
+The available variants are:
 
-![example of variants](https://github.com/OfficeDev/office-ui-fabric-react/blob/master/packages/variants/example.png)
\ No newline at end of file
+* ``` getNeutralVariant(theme: IPartialTheme): ITheme ```
+  * Neutral - a soft neutral color is used as the background (light gray in the default theme), most other colors are changed very little or not at all
+* ``` getSoftVariant(theme: IPartialTheme): ITheme ```
+  * Soft - a soft shade of the primary color is used as the background (light blue in the default theme), most other colors are changed very little or not at all, but input controls look different
+* ``` getStrongVariant(theme: IPartialTheme): ITheme ```
+  * Strong - a strong shade of the primary color is used as the background (blue in the default theme), almost all colors are changed

From 8b1625290f6a775f6c64b30617a2593576aacb34 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 13 Mar 2018 14:51:21 -0700
Subject: [PATCH 1575/1641] Theme generator: show in the website main nav
 (#4251)

* Unhide theme generator

* Syncing theme gen page style to other pages

* No dash in urls

* Added references to the theme generator page

* Unhide from main nav, link edits

* Removed comma

* Added change files

* removed pageStyles, wasn't doing much

* Fixing brand-icons url
---
 .../src/components/App/AppState.tsx           |   7 +-
 .../src/pages/ResourcesPage/ResourcesPage.tsx |   6 +
 .../pages/Styles/ColorsPage/ColorsPage.tsx    |   2 +-
 .../ThemeGeneratorToolPage.tsx                |  30 ++++-
 ...show-theme-generator_2018-03-13-16-46.json |  11 ++
 ...show-theme-generator_2018-03-13-16-46.json |  11 ++
 .../ThemeGenerator/ThemeGeneratorPage.scss    | 111 +++++++++---------
 .../ThemeGenerator/ThemeGeneratorPage.tsx     |  22 ++--
 .../src/demo/AppDefinition.tsx                |   4 +-
 9 files changed, 130 insertions(+), 74 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/show-theme-generator_2018-03-13-16-46.json
 create mode 100644 common/changes/office-ui-fabric-react/show-theme-generator_2018-03-13-16-46.json

diff --git a/apps/fabric-website/src/components/App/AppState.tsx b/apps/fabric-website/src/components/App/AppState.tsx
index e7ab867cda10d..e27d0c9e6c9bc 100644
--- a/apps/fabric-website/src/components/App/AppState.tsx
+++ b/apps/fabric-website/src/components/App/AppState.tsx
@@ -91,10 +91,9 @@ export const AppState: IAppState = {
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Styles/LocalizationPage/LocalizationPage').LocalizationPage))
         },
         {
-          title: 'Beta theme generator',
-          url: '#/styles/themeGenerator',
-          isHiddenFromMainNav: true,
-          component: () => <StylesLoadingComponent title='Beta theme generator' />,
+          title: 'Theme generator',
+          url: '#/styles/themegenerator',
+          component: () => <StylesLoadingComponent title='Theme generator' />,
           getComponent: cb => require.ensure([], (require) => cb(require<any>('../../pages/Styles/ThemeGeneratorToolPage/ThemeGeneratorToolPage').ThemeGeneratorToolPage))
         },
         {
diff --git a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
index a898a09daa306..3a3629c0ff2d8 100644
--- a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
+++ b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
@@ -59,6 +59,12 @@ export class ResourcesPage extends React.Component<any, any> {
                   <li><a className={ styles.relatedLink } href='https://static2.sharepointonline.com/files/fabric/fabric-website/files/segoeui_fabricmdl2_icon_fonts.zip'>Segoe UI and Fabric MDL2 icon font</a></li>
                   <li><a className={ styles.relatedLink } href='https://microsoft.sharepoint.com/teams/OfficeUIFabric97/SitePages/Fabric%20MDL2%20Icons.aspx'>Segoe UI and Fabric MDL2 icon font (Microsoft employees)</a></li>
                 </ul>
+
+                <h3>Theme generator</h3>
+                <p>This tool helps you easily create all the shades and slots for a custom theme.</p>
+                <ul>
+                  <li><a className={ styles.relatedLink } href='#/styles/themegenerator'>Theme generator</a></li>
+                </ul>
               </div>
             </div>
           </div>
diff --git a/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx b/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
index e92d5cfaa5d8d..62125bd95e092 100644
--- a/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/ColorsPage/ColorsPage.tsx
@@ -38,7 +38,7 @@ export class ColorsPage extends React.Component<any, any> {
         />
         <div className={ css(pageStyles.u_maxTextWidth, styles.overview) }>
           <h2 id='Overview'>Overview</h2>
-          <p>Fabric includes 9 theme colors and 11 neutral colors. Each has helper classes for text, background, border, and hover states. When selecting colors, refer to the <a className={ styles.colorsPageLink } href={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/files/coloraccessibility_29sep2016.pdf' }>color accessibility guidance (PDF)</a> to ensure that your text can be ready by everyone.</p>
+          <p>Fabric includes 9 theme colors and 11 neutral colors. Each has helper classes for text, background, border, and hover states. When selecting colors, refer to the <a className={ styles.colorsPageLink } href={ 'https://static2.sharepointonline.com/files/fabric/fabric-website/files/coloraccessibility_29sep2016.pdf' }>color accessibility guidance (PDF)</a> to ensure that your text can be ready by everyone. If you need to customize your theme, see the <a className={ styles.colorsPageLink } href={ '#/styles/themegenerator' }>Theme generator</a>.</p>
         </div>
         <h2 id='implementation'>Implementation</h2>
         <p>Colors can be applied to text, backgrounds, or borders using the following class name conventions:</p>
diff --git a/apps/fabric-website/src/pages/Styles/ThemeGeneratorToolPage/ThemeGeneratorToolPage.tsx b/apps/fabric-website/src/pages/Styles/ThemeGeneratorToolPage/ThemeGeneratorToolPage.tsx
index 54a960c3bd44c..e69897d0ad143 100644
--- a/apps/fabric-website/src/pages/Styles/ThemeGeneratorToolPage/ThemeGeneratorToolPage.tsx
+++ b/apps/fabric-website/src/pages/Styles/ThemeGeneratorToolPage/ThemeGeneratorToolPage.tsx
@@ -1,15 +1,41 @@
 import * as React from 'react';
 import { PageHeader } from '../../../components/PageHeader/PageHeader';
-
 import { ThemeGeneratorPage } from 'office-ui-fabric-react/lib/components/ThemeGenerator/ThemeGeneratorPage';
+const pageStyles: any = require('../../PageStyles.module.scss');
 
 export class ThemeGeneratorToolPage extends React.Component<any, any> {
   public render() {
     return (
-      <div>
+      <div
+        className={ pageStyles.basePage }
+      >
         <PageHeader
           pageTitle='Theme Generator'
           backgroundColor='#006f94'
+          links={
+            [
+              {
+                'text': 'Overview',
+                'location': 'Overview'
+              },
+              {
+                'text': 'Output',
+                'location': 'Output'
+              },
+              {
+                'text': 'Fabric palette',
+                'location': 'Fabric palette'
+              },
+              {
+                'text': 'Samples',
+                'location': 'Samples'
+              },
+              {
+                'text': 'Accessibility',
+                'location': 'Accessibility'
+              }
+            ]
+          }
         />
 
         <ThemeGeneratorPage />
diff --git a/common/changes/@uifabric/fabric-website/show-theme-generator_2018-03-13-16-46.json b/common/changes/@uifabric/fabric-website/show-theme-generator_2018-03-13-16-46.json
new file mode 100644
index 0000000000000..6d09ac7e6bd66
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/show-theme-generator_2018-03-13-16-46.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Theme generator: exposing to the website.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/show-theme-generator_2018-03-13-16-46.json b/common/changes/office-ui-fabric-react/show-theme-generator_2018-03-13-16-46.json
new file mode 100644
index 0000000000000..ab7550c52fe22
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/show-theme-generator_2018-03-13-16-46.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Theme generator: exposing to the website.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.scss b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.scss
index a03b7501d462b..f6fe372072610 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.scss
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.scss
@@ -1,70 +1,73 @@
 @import '../../common/common';
 :global {
-
-.ms-themer {
-  padding: 12px;
-  h2, h3, h4 {
-    color: $ms-color-black;
+  .overview .themeGeneratorPageLink {
+    color: $ms-color-themePrimary;
   }
-}
-.ms-themer h3 {
-  margin: 0;
-}
 
-.ms-themer-paletteSlot {
-  text-align: center;
-  padding: 16px;
-}
+  .ms-themer {
+    padding: 12px;
+    h2, h3, h4 {
+      color: $ms-color-black;
+    }
+  }
+  .ms-themer h3 {
+    margin: 0;
+  }
 
-.ms-themer-swatch {
-  display: inline-block;
-  flex-shrink: 0;
-  height: 36px;
-  width: 36px;
-  margin: 4px;
-}
+  .ms-themer-paletteSlot {
+    text-align: center;
+    padding: 16px;
+  }
 
-.ms-themer-swatchBg {
-  padding: 4px;
-  font-size: 0;
   .ms-themer-swatch {
-    height: 28px;
-    width: 28px;
-    margin: 2px;
+    display: inline-block;
+    flex-shrink: 0;
+    height: 36px;
+    width: 36px;
+    margin: 4px;
   }
-}
 
-.ms-themer-example {
-  padding: 20px;
-  max-width: 40%;
-}
+  .ms-themer-swatchBg {
+    padding: 4px;
+    font-size: 0;
+    .ms-themer-swatch {
+      height: 28px;
+      width: 28px;
+      margin: 2px;
+    }
+  }
 
-.ms-themer-fabricPalette-root {
-  display: flex;
-  > div {
-    padding-left: 20px;
+  .ms-themer-example {
+    padding: 20px;
+    max-width: 40%;
   }
-}
 
-.ms-themer-accessibilityTable td {
-  padding: 4px;
-  text-align: center;
-}
+  .ms-themer-fabricPalette-root {
+    display: flex;
+    > div {
+      padding-left: 20px;
+    }
+  }
+
+  .ms-themer-accessibilityTable td {
+    padding: 4px;
+    text-align: center;
+  }
 
-.ms-themer-slot {
-  display: flex;
-  align-items: center;
-  overflow: auto;
-}
+  .ms-themer-slot {
+    display: flex;
+    align-items: center;
+    overflow: auto;
+  }
 
-.ms-themer-output-root {
-  display: flex;
-  textarea {
-    height: 400px;
-    width: 280px;
-    margin-right: 28px;
-    background-color: white;
-    color: #333;
+  .ms-themer-output-root {
+    display: flex;
+    textarea {
+      height: 400px;
+      width: 280px;
+      margin-right: 28px;
+      background-color: white;
+      color: #333;
+    }
   }
-}
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
index 4023244f96872..2f30f2ad6dd9c 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
@@ -110,13 +110,13 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
 
     return (
       <div className='ms-themer'>
-        <p>
-          This tool helps you easily create all the shades and slots for a custom theme.
-          The theme can be used by Fabric React's styling package, see the <a href='https://github.com/OfficeDev/office-ui-fabric-react/tree/master/packages/styling'>documentation</a>.
+        <div className='overview'>
+          <h2 id='Overview'>Overview</h2>
+          <p>This tool helps you easily create all the shades and slots for a custom theme.
+          The theme can be used by Fabric React's styling package, see the <a className={ 'themeGeneratorPageLink' } href='https://github.com/OfficeDev/office-ui-fabric-react/tree/master/packages/styling'>documentation</a>.
           <br />
-          As you modify one of the three base colors, the theme will update automatically based on predefined rules. You can modify each individual slot below as well.
-        </p>
-
+            As you modify one of the three base colors, the theme will update automatically based on predefined rules. You can modify each individual slot below as well.</p>
+        </div>
         {/* Hello! You've found hidden functionality for generating a theme from an image. This uses Microsoft's
           * Cognitive Vision API, documented here:
           * https://docs.microsoft.com/en-us/azure/cognitive-services/computer-vision/quickstarts/javascript
@@ -161,7 +161,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
         { this._outputSection() }
         <br />
 
-        <h2>Fabric Palette</h2>
+        <h2 id='Fabric palette'>Fabric palette</h2>
         <p>The original Fabric palette slots. These are raw colors with no prescriptive uses. Each one is a shade or tint of a base color.</p>
         <div className={ 'ms-themer-fabricPalette-root' }>
           <div>{ fabricThemeSlots }</div>
@@ -176,7 +176,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
         </div>
         <br />
 
-        <h3>Samples</h3>
+        <h2 id='Samples'>Samples</h2>
         { <div style={ { display: 'flex', flexDirection: 'row' } }>
           <div className='ms-themer-example'>
             <TextFieldBasicExample />
@@ -196,7 +196,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
                 }] }
               label='Pick one'
               required={ true }
-            />,
+            />
             <ChoiceGroup
               options={ [
                 {
@@ -221,7 +221,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
           </div>
         </div> }
 
-        <h3>Accessibility</h3>
+        <h2 id='Accessibility'>Accessibility</h2>
         <p>Each pair of colors below should produce legible text and have a minimum contrast ratio of 4.5.</p>
         <table className='ms-themer-accessibilityTable'>
           <thead>
@@ -441,7 +441,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
 
     return (
       <div>
-        <h2>Output</h2>
+        <h2 id='Output'>Output</h2>
         <div className={ 'ms-themer-output-root' }>
           <div>
             <h3>JSON</h3>
diff --git a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
index 31b1229fc9fcb..c4d075aaf7ad8 100644
--- a/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
+++ b/packages/office-ui-fabric-react/src/demo/AppDefinition.tsx
@@ -359,8 +359,8 @@ export const AppDefinition: IAppDefinition = {
         {
           component: require<any>('../components/ThemeGenerator/ThemeGeneratorPage').ThemeGeneratorPage,
           key: 'Theme Generator',
-          name: 'Beta Theme Generator',
-          url: '#examples/themeGenerator'
+          name: 'Theme Generator',
+          url: '#examples/themegenerator'
         },
         {
           component: require<any>('./ComponentStatus/ComponentStatusPage').ComponentStatusPage,

From ddcb9545c528740248fb97f72b85f859c2522bcd Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 14 Mar 2018 03:28:27 -0700
Subject: [PATCH 1576/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 19 +++++++++++++++++++
 apps/fabric-website/CHANGELOG.md              |  9 ++++++++-
 apps/fabric-website/package.json              |  4 ++--
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...show-theme-generator_2018-03-13-16-46.json | 11 -----------
 ...hkuo-variantsExample_2018-03-13-01-13.json | 11 -----------
 ...show-theme-generator_2018-03-13-16-46.json | 11 -----------
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 packages/variants/CHANGELOG.json              | 14 ++++++++++++++
 packages/variants/CHANGELOG.md                |  9 ++++++++-
 packages/variants/package.json                |  2 +-
 17 files changed, 80 insertions(+), 45 deletions(-)
 delete mode 100644 common/changes/@uifabric/fabric-website/show-theme-generator_2018-03-13-16-46.json
 delete mode 100644 common/changes/@uifabric/variants/phkuo-variantsExample_2018-03-13-01-13.json
 delete mode 100644 common/changes/office-ui-fabric-react/show-theme-generator_2018-03-13-16-46.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 08c9d57862534..6a04f853aa244 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.4.0",
+      "tag": "@uifabric/fabric-website_v5.4.0",
+      "date": "Wed, 14 Mar 2018 10:28:26 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "8b1625290f6a775f6c64b30617a2593576aacb34",
+            "comment": "Theme generator: exposing to the website."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.64.0 <6.0.0` to `>=5.64.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.3.4",
       "tag": "@uifabric/fabric-website_v5.3.4",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index ced01d6c12318..251c264c012b0 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Tue, 13 Mar 2018 20:00:06 GMT and should not be manually modified.
+This log was last generated on Wed, 14 Mar 2018 10:28:26 GMT and should not be manually modified.
+
+## 5.4.0
+Wed, 14 Mar 2018 10:28:26 GMT
+
+### Minor changes
+
+- Theme generator: exposing to the website.
 
 ## 5.3.4
 Tue, 13 Mar 2018 20:00:06 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index d3b272d1cef12..99adca8d2b328 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.3.4",
+  "version": "5.4.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.64.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index b303dd0204c39..5398f314a2b39 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.64.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.1 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 6aa1b0955b413..7482257567002 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.64.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.1 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index f13179241960a..397b7db0b99e8 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.64.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 54a227867065f..f3da06e18e29b 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.64.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.1 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/common/changes/@uifabric/fabric-website/show-theme-generator_2018-03-13-16-46.json b/common/changes/@uifabric/fabric-website/show-theme-generator_2018-03-13-16-46.json
deleted file mode 100644
index 6d09ac7e6bd66..0000000000000
--- a/common/changes/@uifabric/fabric-website/show-theme-generator_2018-03-13-16-46.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Theme generator: exposing to the website.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/variants/phkuo-variantsExample_2018-03-13-01-13.json b/common/changes/@uifabric/variants/phkuo-variantsExample_2018-03-13-01-13.json
deleted file mode 100644
index 2bad32a878474..0000000000000
--- a/common/changes/@uifabric/variants/phkuo-variantsExample_2018-03-13-01-13.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/variants",
-      "comment": "add a usage example to the readme",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/variants",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/show-theme-generator_2018-03-13-16-46.json b/common/changes/office-ui-fabric-react/show-theme-generator_2018-03-13-16-46.json
deleted file mode 100644
index ab7550c52fe22..0000000000000
--- a/common/changes/office-ui-fabric-react/show-theme-generator_2018-03-13-16-46.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Theme generator: exposing to the website.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index bd8783721e023..03b5461e4fe55 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.64.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.1 <6.0.0",
     "@uifabric/icons": ">=5.6.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 8a386d46efdc4..e0c9b31426c18 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.64.1",
+      "tag": "office-ui-fabric-react_v5.64.1",
+      "date": "Wed, 14 Mar 2018 10:28:26 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "8b1625290f6a775f6c64b30617a2593576aacb34",
+            "comment": "Theme generator: exposing to the website."
+          }
+        ]
+      }
+    },
     {
       "version": "5.64.0",
       "tag": "office-ui-fabric-react_v5.64.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 789c4e24bb9d8..60b4b7bb4272e 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 13 Mar 2018 10:17:37 GMT and should not be manually modified.
+This log was last generated on Wed, 14 Mar 2018 10:28:26 GMT and should not be manually modified.
+
+## 5.64.1
+Wed, 14 Mar 2018 10:28:26 GMT
+
+### Patches
+
+- Theme generator: exposing to the website.
 
 ## 5.64.0
 Tue, 13 Mar 2018 10:17:37 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 72aa558717908..3717140dbee97 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.64.0",
+  "version": "5.64.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/variants/CHANGELOG.json b/packages/variants/CHANGELOG.json
index 1f3737022dee6..4cdd64ec5aad8 100644
--- a/packages/variants/CHANGELOG.json
+++ b/packages/variants/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/variants",
   "entries": [
+    {
+      "version": "5.0.2",
+      "tag": "@uifabric/variants_v5.0.2",
+      "date": "Wed, 14 Mar 2018 10:28:26 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "20d3b5f8cadc5051a1a002d2af6e90d015aa2191",
+            "comment": "add a usage example to the readme"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.1",
       "tag": "@uifabric/variants_v5.0.1",
diff --git a/packages/variants/CHANGELOG.md b/packages/variants/CHANGELOG.md
index ddcfe7f1be397..d6d478b04032e 100644
--- a/packages/variants/CHANGELOG.md
+++ b/packages/variants/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/variants
 
-This log was last generated on Mon, 12 Mar 2018 06:29:20 GMT and should not be manually modified.
+This log was last generated on Wed, 14 Mar 2018 10:28:26 GMT and should not be manually modified.
+
+## 5.0.2
+Wed, 14 Mar 2018 10:28:26 GMT
+
+### Patches
+
+- add a usage example to the readme
 
 ## 5.0.1
 Mon, 12 Mar 2018 06:29:20 GMT
diff --git a/packages/variants/package.json b/packages/variants/package.json
index b17703c5d1081..036fd326e0a1b 100644
--- a/packages/variants/package.json
+++ b/packages/variants/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/variants",
-  "version": "5.0.1",
+  "version": "5.0.2",
   "description": "Office UI Fabric subtheme generator.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From a67bf81ee71ed32eb459acdc2b32a37e0b382dff Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Wed, 14 Mar 2018 12:13:44 -0700
Subject: [PATCH 1577/1641] Update STYLING.md

---
 ghdocs/STYLING.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ghdocs/STYLING.md b/ghdocs/STYLING.md
index dd870c2d1085a..9777f8c931d52 100644
--- a/ghdocs/STYLING.md
+++ b/ghdocs/STYLING.md
@@ -71,7 +71,7 @@ class Comp extends React.Component {
 
 A component should consist of these files:
 
-* `ComponentName.props.ts` - The interfaces for the component. We separate these out for documentation reasons.
+* `ComponentName.types.ts` - The interfaces for the component. We separate these out for documentation reasons.
 * `ComponentName.base.tsx` - The unstyled component. This renders DOM structure and conrtains logic, MINUS styling opinions.
 * `ComponentName.styles.ts` - Exports a `getStyles` function for the component which takes in `IComponentNameStyleProps` and returns `IComponentNameStyles`.
 

From d1b3d356374e2c5887566df9f6e7645c932529bd Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Wed, 14 Mar 2018 16:01:10 -0700
Subject: [PATCH 1578/1641] Addressing Issue #4209 -
 [Accessibility][ChoiceGroup] Provide field for aria label on
 IChoiceGroupOption (#4274)

* targeted aria-labelledby to labelId instead of id
---
 ...hoicegroup-voiceoverfix-4209_2018-03-14-21-48.json | 11 +++++++++++
 .../src/components/ChoiceGroup/ChoiceGroup.tsx        |  2 +-
 .../__snapshots__/ChoiceGroup.test.tsx.snap           |  6 +++---
 3 files changed, 15 insertions(+), 4 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/choicegroup-voiceoverfix-4209_2018-03-14-21-48.json

diff --git a/common/changes/office-ui-fabric-react/choicegroup-voiceoverfix-4209_2018-03-14-21-48.json b/common/changes/office-ui-fabric-react/choicegroup-voiceoverfix-4209_2018-03-14-21-48.json
new file mode 100644
index 0000000000000..0a46c45dcdb6c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/choicegroup-voiceoverfix-4209_2018-03-14-21-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Targeted the aria-labelledby on ChoiceGroup's input field to the span tag inside the span tag inside label ( option.labelId ) instead of thelabel itself ( option.id ). ",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
index 76ef8785d77b1..ecc83d3b3cf3e 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.tsx
@@ -122,7 +122,7 @@ export class ChoiceGroup extends BaseComponent<IChoiceGroupProps, IChoiceGroupSt
                       onChange={ this._onChange.bind(this, option) }
                       onFocus={ this._onFocus.bind(this, option) }
                       onBlur={ this._onBlur.bind(this, option) }
-                      aria-labelledby={ option.id }
+                      aria-labelledby={ option.labelId }
                       { ...getNativeProps(option, inputProperties) }
                     />
                     { onRenderField(option, this._onRenderField) }
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/__snapshots__/ChoiceGroup.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ChoiceGroup/__snapshots__/ChoiceGroup.test.tsx.snap
index 63255faa94ada..9eaa246cf399c 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/__snapshots__/ChoiceGroup.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/__snapshots__/ChoiceGroup.test.tsx.snap
@@ -20,7 +20,7 @@ exports[`ChoiceGroup renders ChoiceGroup correctly 1`] = `
           className="ms-ChoiceField-wrapper"
         >
           <input
-            aria-labelledby="ChoiceGroup0-1"
+            aria-labelledby="ChoiceGroupLabel1-1"
             checked={false}
             className="ms-ChoiceField-input"
             data-automation-id="auto1"
@@ -53,7 +53,7 @@ exports[`ChoiceGroup renders ChoiceGroup correctly 1`] = `
           className="ms-ChoiceField-wrapper"
         >
           <input
-            aria-labelledby="ChoiceGroup0-2"
+            aria-labelledby="ChoiceGroupLabel1-2"
             checked={false}
             className="ms-ChoiceField-input"
             disabled={undefined}
@@ -85,7 +85,7 @@ exports[`ChoiceGroup renders ChoiceGroup correctly 1`] = `
           className="ms-ChoiceField-wrapper"
         >
           <input
-            aria-labelledby="ChoiceGroup0-3"
+            aria-labelledby="ChoiceGroupLabel1-3"
             checked={false}
             className="ms-ChoiceField-input"
             disabled={undefined}

From 3cd823b02aadb1e66f9b6221d4d32bafbe895386 Mon Sep 17 00:00:00 2001
From: Jon Schectman <joschect@microsoft.com>
Date: Wed, 14 Mar 2018 19:18:21 -0700
Subject: [PATCH 1579/1641] =?UTF-8?q?Revert=20"FocusTrapZone=20does=20not?=
 =?UTF-8?q?=20correctly=20trap=20focus=20when=20last=20child=20i=E2=80=A6?=
 =?UTF-8?q?=20(#4280)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Revert "FocusTrapZone does not correctly trap focus when last child is FocusZone (#4172)"

This reverts commit 699fa697ae829e756108ce2b6725084d27e93f7e.

* revert focus changes
---
 .../revert-focus_2018-03-15-01-48.json        | 11 +++
 .../revert-focus_2018-03-15-01-48.json        | 11 +++
 .../FocusTrapZone/FocusTrapZone.test.tsx      | 71 -------------------
 packages/utilities/src/focus.ts               | 17 +++--
 4 files changed, 30 insertions(+), 80 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/revert-focus_2018-03-15-01-48.json
 create mode 100644 common/changes/office-ui-fabric-react/revert-focus_2018-03-15-01-48.json

diff --git a/common/changes/@uifabric/utilities/revert-focus_2018-03-15-01-48.json b/common/changes/@uifabric/utilities/revert-focus_2018-03-15-01-48.json
new file mode 100644
index 0000000000000..107515493457f
--- /dev/null
+++ b/common/changes/@uifabric/utilities/revert-focus_2018-03-15-01-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Revert focus changes",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/revert-focus_2018-03-15-01-48.json b/common/changes/office-ui-fabric-react/revert-focus_2018-03-15-01-48.json
new file mode 100644
index 0000000000000..193d037d8668f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/revert-focus_2018-03-15-01-48.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "",
+      "packageName": "office-ui-fabric-react",
+      "type": "none"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "joschect@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.test.tsx
index 9599f02be4c3d..d23d8fc60e7e1 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.test.tsx
@@ -239,75 +239,4 @@ describe('FocusTrapZone', () => {
     ReactTestUtils.Simulate.keyDown(buttonA, { which: KeyCodes.tab });
     expect(lastFocusedElement).toBe(buttonX);
   });
-
-  it('can tab across FocusZones with different button structures', () => {
-    const component = ReactTestUtils.renderIntoDocument(
-      <div { ...{ onFocusCapture: _onFocus } }>
-        <FocusTrapZone forceFocusInsideTrap={ false }>
-          <button className='a'>a</button>
-          <FocusZone direction={ FocusZoneDirection.horizontal } data-is-visible={ true }>
-            <button className='d'>d</button>
-            <button className='e'>e</button>
-            <button className='f'>f</button>
-          </FocusZone>
-        </FocusTrapZone>
-      </div>
-    );
-
-    const focusTrapZone = ReactDOM.findDOMNode(component as React.ReactInstance) as Element;
-
-    const buttonA = focusTrapZone.querySelector('.a') as HTMLElement;
-    const buttonD = focusTrapZone.querySelector('.d') as HTMLElement;
-    const buttonE = focusTrapZone.querySelector('.e') as HTMLElement;
-    const buttonF = focusTrapZone.querySelector('.f') as HTMLElement;
-
-    // Assign bounding locations to buttons.
-    setupElement(buttonA, {
-      clientRect: {
-        top: 0,
-        bottom: 30,
-        left: 0,
-        right: 30
-      }
-    });
-
-    setupElement(buttonD, {
-      clientRect: {
-        top: 30,
-        bottom: 60,
-        left: 0,
-        right: 30
-      }
-    });
-
-    setupElement(buttonE, {
-      clientRect: {
-        top: 30,
-        bottom: 60,
-        left: 30,
-        right: 60
-      }
-    });
-
-    setupElement(buttonF, {
-      clientRect: {
-        top: 30,
-        bottom: 60,
-        left: 60,
-        right: 90
-      }
-    });
-
-    // Focus the first button.
-    ReactTestUtils.Simulate.focus(buttonD);
-    expect(lastFocusedElement).toBe(buttonD);
-
-    // Pressing tab should go to a.
-    ReactTestUtils.Simulate.keyDown(buttonD, { which: KeyCodes.tab });
-    expect(lastFocusedElement).toBe(buttonA);
-
-    // Pressing shift + tab should go to a.
-    ReactTestUtils.Simulate.keyDown(buttonA, { which: KeyCodes.tab, shiftKey: true });
-    expect(lastFocusedElement).toBe(buttonD);
-  });
 });
diff --git a/packages/utilities/src/focus.ts b/packages/utilities/src/focus.ts
index e3f47ce9bd641..c2dc853c6932c 100644
--- a/packages/utilities/src/focus.ts
+++ b/packages/utilities/src/focus.ts
@@ -77,7 +77,7 @@ export function getPreviousElement(
   traverseChildren?: boolean,
   includeElementsInFocusZones?: boolean,
   allowFocusRoot?: boolean,
-  elementShouldBeTabbable?: boolean): HTMLElement | null {
+  tabbable?: boolean): HTMLElement | null {
 
   if (!currentElement ||
     (!allowFocusRoot && currentElement === rootElement)) {
@@ -97,10 +97,10 @@ export function getPreviousElement(
       true,
       includeElementsInFocusZones,
       allowFocusRoot,
-      elementShouldBeTabbable);
+      tabbable);
 
     if (childMatch) {
-      if ((elementShouldBeTabbable && isElementTabbable(childMatch, true)) || !elementShouldBeTabbable) {
+      if ((tabbable && (isElementTabbable(childMatch, true))) || !tabbable) {
         return childMatch;
       }
 
@@ -112,7 +112,7 @@ export function getPreviousElement(
         true,
         includeElementsInFocusZones,
         allowFocusRoot,
-        elementShouldBeTabbable
+        tabbable
       );
       if (childMatchSiblingMatch) {
         return childMatchSiblingMatch;
@@ -133,7 +133,7 @@ export function getPreviousElement(
           true,
           includeElementsInFocusZones,
           allowFocusRoot,
-          elementShouldBeTabbable
+          tabbable
         );
 
         if (childMatchParentMatch) {
@@ -146,8 +146,7 @@ export function getPreviousElement(
   }
 
   // Check the current node, if it's not the first traversal.
-  if (checkNode && isCurrentElementVisible &&
-    ((elementShouldBeTabbable && isElementTabbable(currentElement, true)) || !elementShouldBeTabbable)) {
+  if (checkNode && isCurrentElementVisible && isElementTabbable(currentElement)) {
     return currentElement;
   }
 
@@ -160,7 +159,7 @@ export function getPreviousElement(
     true,
     includeElementsInFocusZones,
     allowFocusRoot,
-    elementShouldBeTabbable);
+    tabbable);
 
   if (siblingMatch) {
     return siblingMatch;
@@ -169,7 +168,7 @@ export function getPreviousElement(
   // Check its parent.
   if (!suppressParentTraversal) {
     return getPreviousElement(rootElement, currentElement.parentElement, true, false, false, includeElementsInFocusZones,
-      allowFocusRoot, elementShouldBeTabbable);
+      allowFocusRoot, tabbable);
   }
 
   return null;

From cc6a468e5acfa0b69571595a0000ad8fe84c0821 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 15 Mar 2018 02:42:28 +0000
Subject: [PATCH 1580/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../revert-focus_2018-03-15-01-48.json        | 11 -----------
 ...up-voiceoverfix-4209_2018-03-14-21-48.json | 11 -----------
 .../revert-focus_2018-03-15-01-48.json        | 11 -----------
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 19 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  |  9 ++++++++-
 packages/office-ui-fabric-react/package.json  |  4 ++--
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 ++++++++++++++
 packages/utilities/CHANGELOG.md               |  9 ++++++++-
 packages/utilities/package.json               |  2 +-
 17 files changed, 60 insertions(+), 46 deletions(-)
 delete mode 100644 common/changes/@uifabric/utilities/revert-focus_2018-03-15-01-48.json
 delete mode 100644 common/changes/office-ui-fabric-react/choicegroup-voiceoverfix-4209_2018-03-14-21-48.json
 delete mode 100644 common/changes/office-ui-fabric-react/revert-focus_2018-03-15-01-48.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 99adca8d2b328..d81039d3dbe33 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.64.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 5398f314a2b39..1f4f89cb6a87c 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.64.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.2 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 7482257567002..8db7e264f1961 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.64.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.2 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 397b7db0b99e8..d2ce1385c6cda 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.64.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.2 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index f3da06e18e29b..04a171bd735b5 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.64.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.2 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/common/changes/@uifabric/utilities/revert-focus_2018-03-15-01-48.json b/common/changes/@uifabric/utilities/revert-focus_2018-03-15-01-48.json
deleted file mode 100644
index 107515493457f..0000000000000
--- a/common/changes/@uifabric/utilities/revert-focus_2018-03-15-01-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Revert focus changes",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/choicegroup-voiceoverfix-4209_2018-03-14-21-48.json b/common/changes/office-ui-fabric-react/choicegroup-voiceoverfix-4209_2018-03-14-21-48.json
deleted file mode 100644
index 0a46c45dcdb6c..0000000000000
--- a/common/changes/office-ui-fabric-react/choicegroup-voiceoverfix-4209_2018-03-14-21-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Targeted the aria-labelledby on ChoiceGroup's input field to the span tag inside the span tag inside label ( option.labelId ) instead of thelabel itself ( option.id ). ",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/revert-focus_2018-03-15-01-48.json b/common/changes/office-ui-fabric-react/revert-focus_2018-03-15-01-48.json
deleted file mode 100644
index 193d037d8668f..0000000000000
--- a/common/changes/office-ui-fabric-react/revert-focus_2018-03-15-01-48.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "comment": "",
-      "packageName": "office-ui-fabric-react",
-      "type": "none"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "joschect@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index b9142bfcaade0..dd2ecde9867a2 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.19.1 <6.0.0",
-    "@uifabric/utilities": ">=5.18.1 <6.0.0",
+    "@uifabric/utilities": ">=5.18.2 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 03b5461e4fe55..fcf569ce5bd8c 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.64.1 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.2 <6.0.0",
     "@uifabric/icons": ">=5.6.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index e0c9b31426c18..c78fb0eb888c4 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.64.2",
+      "tag": "office-ui-fabric-react_v5.64.2",
+      "date": "Thu, 15 Mar 2018 02:42:27 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "d1b3d356374e2c5887566df9f6e7645c932529bd",
+            "comment": "Targeted the aria-labelledby on ChoiceGroup's input field to the span tag inside the span tag inside label ( option.labelId ) instead of thelabel itself ( option.id ). "
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.18.1 <6.0.0` to `>=5.18.2 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.64.1",
       "tag": "office-ui-fabric-react_v5.64.1",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 60b4b7bb4272e..d5d832319d24f 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 14 Mar 2018 10:28:26 GMT and should not be manually modified.
+This log was last generated on Thu, 15 Mar 2018 02:42:27 GMT and should not be manually modified.
+
+## 5.64.2
+Thu, 15 Mar 2018 02:42:27 GMT
+
+### Patches
+
+- Targeted the aria-labelledby on ChoiceGroup's input field to the span tag inside the span tag inside label ( option.labelId ) instead of thelabel itself ( option.id ). 
 
 ## 5.64.1
 Wed, 14 Mar 2018 10:28:26 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 3717140dbee97..b6096b394030d 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.64.1",
+  "version": "5.64.2",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -51,7 +51,7 @@
     "@uifabric/icons": ">=5.6.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "@uifabric/styling": ">=5.19.1 <6.0.0",
-    "@uifabric/utilities": ">=5.18.1 <6.0.0",
+    "@uifabric/utilities": ">=5.18.2 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index c4ef313064762..bbd9ca0d6eb16 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -28,7 +28,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.18.1 <6.0.0",
+    "@uifabric/utilities": ">=5.18.2 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 593c8f56ff631..df3b5f3dfd80b 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.18.2",
+      "tag": "@uifabric/utilities_v5.18.2",
+      "date": "Thu, 15 Mar 2018 02:42:27 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Jon Schectman <joschect@microsoft.com>",
+            "commit": "3cd823b02aadb1e66f9b6221d4d32bafbe895386",
+            "comment": "Revert focus changes"
+          }
+        ]
+      }
+    },
     {
       "version": "5.18.1",
       "tag": "@uifabric/utilities_v5.18.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index f8e37e9b30258..ce8163fa50382 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Tue, 13 Mar 2018 10:17:37 GMT and should not be manually modified.
+This log was last generated on Thu, 15 Mar 2018 02:42:27 GMT and should not be manually modified.
+
+## 5.18.2
+Thu, 15 Mar 2018 02:42:27 GMT
+
+### Patches
+
+- Revert focus changes
 
 ## 5.18.1
 Tue, 13 Mar 2018 10:17:37 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 3e932851eef11..2a0cc6a337bda 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.18.1",
+  "version": "5.18.2",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From fe61a19cfe9890247cbb58a90789e932769210c0 Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Wed, 14 Mar 2018 20:08:51 -0700
Subject: [PATCH 1581/1641] TextField: Enabled scroll and resize when disabled
 (#4275)

* Enable scrolling and resize on multiline disabled textfield

* Change file
---
 ...gellan-enableTextfieldScroll_2018-03-14-22-27.json | 11 +++++++++++
 .../src/components/TextField/TextField.scss           |  6 ------
 .../examples/TextField.Multiline.Example.tsx          |  2 ++
 3 files changed, 13 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/magellan-enableTextfieldScroll_2018-03-14-22-27.json

diff --git a/common/changes/office-ui-fabric-react/magellan-enableTextfieldScroll_2018-03-14-22-27.json b/common/changes/office-ui-fabric-react/magellan-enableTextfieldScroll_2018-03-14-22-27.json
new file mode 100644
index 0000000000000..594bfc13201cc
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/magellan-enableTextfieldScroll_2018-03-14-22-27.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "TextField: Enabled scrolling and resize when disabled",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
index e605924784b16..8a940db798450 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.scss
@@ -77,8 +77,6 @@ $field-error-color: $errorTextColor;
   .rootIsDisabled & {
     background-color: $field-background-disabled-color;
     border-color: $field-border-disabled-color;
-    pointer-events: none;
-    cursor: default;
   }
 
   &:hover,
@@ -104,8 +102,6 @@ $field-error-color: $errorTextColor;
   :global(.field) {
     background-color: $field-background-disabled-color;
     border-color: $field-border-disabled-color;
-    pointer-events: none;
-    cursor: default;
   }
 }
 
@@ -148,8 +144,6 @@ $field-error-color: $errorTextColor;
   &[disabled] {
     background-color: transparent;
     border-color: transparent;
-    pointer-events: none;
-    cursor: default;
   }
 
   .field {
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Multiline.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Multiline.Example.tsx
index b15fe8d8929ee..480dabd284aa0 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Multiline.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Multiline.Example.tsx
@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
 import './TextField.Examples.scss';
+import { lorem } from '@uifabric/example-app-base';
 
 export class TextFieldMultilineExample extends React.Component<any, any> {
   public render() {
@@ -16,6 +17,7 @@ export class TextFieldMultilineExample extends React.Component<any, any> {
           multiline
           rows={ 4 }
           disabled={ true }
+          value={ lorem(100) }
         />
         <TextField
           label='Required'

From a5531dade6aa73766281416e187e32661ab67bd1 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 15 Mar 2018 10:37:10 +0000
Subject: [PATCH 1582/1641] Applying package updates.

---
 apps/fabric-website/package.json                   |  2 +-
 apps/ssr-tests/package.json                        |  2 +-
 apps/test-bundle-button/package.json               |  2 +-
 apps/todo-app/package.json                         |  2 +-
 apps/vr-tests/package.json                         |  2 +-
 ...lan-enableTextfieldScroll_2018-03-14-22-27.json | 11 -----------
 packages/experiments/package.json                  |  2 +-
 packages/office-ui-fabric-react/CHANGELOG.json     | 14 ++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md       |  9 ++++++++-
 packages/office-ui-fabric-react/package.json       |  2 +-
 10 files changed, 29 insertions(+), 19 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/magellan-enableTextfieldScroll_2018-03-14-22-27.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index d81039d3dbe33..831e3c845ebe2 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.64.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.3 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 1f4f89cb6a87c..2d14e8a95200a 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.64.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.3 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 8db7e264f1961..40d2365aa19f0 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.64.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.3 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index d2ce1385c6cda..49b3155b3d942 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.64.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.3 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 04a171bd735b5..0a56de76ce057 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.64.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.3 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/common/changes/office-ui-fabric-react/magellan-enableTextfieldScroll_2018-03-14-22-27.json b/common/changes/office-ui-fabric-react/magellan-enableTextfieldScroll_2018-03-14-22-27.json
deleted file mode 100644
index 594bfc13201cc..0000000000000
--- a/common/changes/office-ui-fabric-react/magellan-enableTextfieldScroll_2018-03-14-22-27.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "TextField: Enabled scrolling and resize when disabled",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index fcf569ce5bd8c..a709e423813d6 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.64.2 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.3 <6.0.0",
     "@uifabric/icons": ">=5.6.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index c78fb0eb888c4..ecb059145ad4f 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.64.3",
+      "tag": "office-ui-fabric-react_v5.64.3",
+      "date": "Thu, 15 Mar 2018 10:37:10 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "fe61a19cfe9890247cbb58a90789e932769210c0",
+            "comment": "TextField: Enabled scrolling and resize when disabled"
+          }
+        ]
+      }
+    },
     {
       "version": "5.64.2",
       "tag": "office-ui-fabric-react_v5.64.2",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index d5d832319d24f..5712a78cd422e 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 15 Mar 2018 02:42:27 GMT and should not be manually modified.
+This log was last generated on Thu, 15 Mar 2018 10:37:10 GMT and should not be manually modified.
+
+## 5.64.3
+Thu, 15 Mar 2018 10:37:10 GMT
+
+### Patches
+
+- TextField: Enabled scrolling and resize when disabled
 
 ## 5.64.2
 Thu, 15 Mar 2018 02:42:27 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index b6096b394030d..867769315403c 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.64.2",
+  "version": "5.64.3",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 552fef5879cc776b66aa09135dbbeacfb6e7d578 Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Thu, 15 Mar 2018 09:16:06 -0700
Subject: [PATCH 1583/1641] Basebutton description props (#4284)

* Fixed onRenderDescription to pull from passed in props rather than this.props

* Change file
---
 ...basebutton-description-props_2018-03-15-14-54.json | 11 +++++++++++
 .../src/components/Button/BaseButton.tsx              |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/basebutton-description-props_2018-03-15-14-54.json

diff --git a/common/changes/office-ui-fabric-react/basebutton-description-props_2018-03-15-14-54.json b/common/changes/office-ui-fabric-react/basebutton-description-props_2018-03-15-14-54.json
new file mode 100644
index 0000000000000..efd3b5ba2a758
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/basebutton-description-props_2018-03-15-14-54.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Button: fixed bug causes by onRenderDescription pulling from this.props instead of passed in props",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 7ff26e87999ad..e1f346217eaf1 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -337,7 +337,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   private _onRenderDescription(props: IButtonProps) {
     const {
       description
-    } = this.props;
+    } = props;
 
     // ms-Button-description is only shown when the button type is compound.
     // In other cases it will not be displayed.

From 1b072de8cd4ccd26a51d38b8cb6d4a151d570aab Mon Sep 17 00:00:00 2001
From: dmarcey <demarcey@microsoft.com>
Date: Thu, 15 Mar 2018 12:51:22 -0400
Subject: [PATCH 1584/1641] Added ability for anchor menu items to have sub
 menus. (#4198)

* Added ability for anchor menu items to have sub menus.
Added prop for subMenuHoverDelay.

* Added change file.

* Update users-demarcey-anchorMenuItems_2018-03-06-21-28.json

* PR feedback.

* Fixing name of example state interface.

* PR feedback, reducing duplication.
---
 ...rcey-anchorMenuItems_2018-03-06-21-28.json | 11 ++++++
 .../ContextualMenu/ContextualMenu.tsx         | 38 ++++++++++++++-----
 .../ContextualMenu/ContextualMenu.types.ts    | 15 ++++++--
 .../ContextualMenu.Submenu.Example.tsx        | 24 +++++++++++-
 4 files changed, 73 insertions(+), 15 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-demarcey-anchorMenuItems_2018-03-06-21-28.json

diff --git a/common/changes/office-ui-fabric-react/users-demarcey-anchorMenuItems_2018-03-06-21-28.json b/common/changes/office-ui-fabric-react/users-demarcey-anchorMenuItems_2018-03-06-21-28.json
new file mode 100644
index 0000000000000..93a460742b19c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-demarcey-anchorMenuItems_2018-03-06-21-28.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ContextualMenu: Allow anchor menu items to have sub menus. Added prop for sub menu hover delay.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "demarcey@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 7ee3a403044c8..855c6e3f44f97 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -470,6 +470,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   }
 
   private _renderAnchorMenuItem(item: IContextualMenuItem, classNames: IMenuItemClassNames, index: number, focusableElementIndex: number, totalItemCount: number, hasCheckmarks: boolean, hasIcons: boolean): React.ReactNode {
+    const { expandedMenuItemKey } = this.state;
     const { contextualMenuItemAs: ChildrenRenderer = ContextualMenuItem } = this.props;
 
     let anchorRel = item.rel;
@@ -477,6 +478,9 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       anchorRel = anchorRel ? anchorRel : 'nofollow noopener noreferrer';  // Safe default to prevent tabjacking
     }
 
+    const subMenuId = this._getSubMenuId(item);
+    const itemHasSubmenu = hasSubmenu(item);
+
     return (
       <div>
         <a
@@ -486,11 +490,17 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
           rel={ anchorRel }
           className={ classNames.root }
           role='menuitem'
+          aria-owns={ item.key === expandedMenuItemKey ? subMenuId : null }
+          aria-haspopup={ itemHasSubmenu || null }
+          aria-expanded={ itemHasSubmenu ? item.key === expandedMenuItemKey : null }
           aria-posinset={ focusableElementIndex + 1 }
           aria-setsize={ totalItemCount }
           aria-disabled={ this._isItemDisabled(item) }
           style={ item.style }
           onClick={ this._onAnchorClick.bind(this, item) }
+          onMouseEnter={ this._onItemMouseEnter.bind(this, item) }
+          onMouseLeave={ this._onMouseItemLeave.bind(this, item) }
+          onKeyDown={ itemHasSubmenu ? this._onItemKeyDown.bind(this, item) : null }
         >
           <ChildrenRenderer
             item={ item }
@@ -514,11 +524,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     const { expandedMenuItemKey } = this.state;
     const { contextualMenuItemAs: ChildrenRenderer = ContextualMenuItem } = this.props;
 
-    let { subMenuId } = this.state;
-    if (item.subMenuProps && item.subMenuProps.id) {
-      subMenuId = item.subMenuProps.id;
-    }
-
+    const subMenuId = this._getSubMenuId(item);
     let ariaLabel = '';
 
     if (item.ariaLabel) {
@@ -791,6 +797,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
    */
   private _updateFocusOnMouseEvent(item: any, ev: React.MouseEvent<HTMLElement>) {
     const targetElement = ev.currentTarget as HTMLElement;
+    const { subMenuHoverDelay: timeoutDuration = this._navigationIdleDelay } = this.props;
 
     if (item.key === this.state.expandedMenuItemKey) {
       return;
@@ -812,12 +819,12 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       this._enterTimerId = this._async.setTimeout(() => {
         targetElement.focus();
         this._onItemSubMenuExpand(item, targetElement);
-      }, this._navigationIdleDelay);
+      }, timeoutDuration);
     } else {
       this._enterTimerId = this._async.setTimeout(() => {
         this._onSubMenuDismiss(ev);
         targetElement.focus();
-      }, this._navigationIdleDelay);
+      }, timeoutDuration);
     }
   }
 
@@ -853,13 +860,14 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     if (item.disabled || item.isDisabled) {
       return;
     }
+    let dismiss = false;
     if (item.onClick) {
-      item.onClick(ev, item);
+      dismiss = !!item.onClick(ev, item);
     } else if (this.props.onItemClick) {
-      this.props.onItemClick(ev, item);
+      dismiss = !!this.props.onItemClick(ev, item);
     }
 
-    !ev.defaultPrevented && this.dismiss(ev, true);
+    (dismiss || !ev.defaultPrevented) && this.dismiss(ev, true);
   }
 
   private _onItemKeyDown(item: any, ev: KeyboardEvent) {
@@ -971,4 +979,14 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   private _isItemDisabled(item: IContextualMenuItem): boolean {
     return !!(item.isDisabled || item.disabled);
   }
+
+  private _getSubMenuId(item: IContextualMenuItem): string | undefined {
+    let { subMenuId } = this.state;
+
+    if (item.subMenuProps && item.subMenuProps.id) {
+      subMenuId = item.subMenuProps.id;
+    }
+
+    return subMenuId;
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
index 296c38f94c69e..116b282f54e00 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
@@ -135,9 +135,10 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
 
   /**
    * Click handler which is invoked if onClick is not passed for individual contextual
-   * menu item
+   * menu item.
+   * Returning true will dismiss the menu even if ev.preventDefault() was called.
    */
-  onItemClick?: (ev?: React.MouseEvent<HTMLElement>, item?: IContextualMenuItem) => void;
+  onItemClick?: (ev?: React.MouseEvent<HTMLElement>, item?: IContextualMenuItem) => boolean | void;
 
   /**
    * CSS class to apply to the context menu.
@@ -221,6 +222,11 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
   /** Method to call when trying to render a submenu. */
   onRenderSubMenu?: IRenderFunction<IContextualMenuProps>;
 
+  /**
+   * Delay (in milliseconds) to wait before expanding / dismissing a submenu on mouseEnter or mouseLeave
+  */
+  subMenuHoverDelay?: number;
+
   /**
    * Method to override the render of the individual menu items
    * @default ContextualMenuItem
@@ -320,9 +326,10 @@ export interface IContextualMenuItem {
   data?: any;
 
   /**
-   * Callback issued when the menu item is invoked. If ev.preventDefault() is called in onClick, click will not close menu
+   * Callback issued when the menu item is invoked. If ev.preventDefault() is called in onClick, click will not close menu.
+   * Returning true will dismiss the menu even if ev.preventDefault() was called.
    */
-  onClick?: (ev?: React.MouseEvent<HTMLElement>, item?: IContextualMenuItem) => void;
+  onClick?: (ev?: React.MouseEvent<HTMLElement>, item?: IContextualMenuItem) => boolean | void;
 
   /**
    * An optional URL to navigate to upon selection
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Submenu.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Submenu.Example.tsx
index 5fc9baa0101fa..1a3171c052837 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Submenu.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Submenu.Example.tsx
@@ -1,17 +1,32 @@
 import * as React from 'react';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
+import { TextField } from 'office-ui-fabric-react/lib/TextField';
 import './ContextualMenuExample.scss';
 
-export class ContextualMenuSubmenuExample extends React.Component<any, any> {
+export interface IContextualMenuSubmenuExampleState {
+  hoverDelay: number;
+}
+
+export class ContextualMenuSubmenuExample extends React.Component<any, IContextualMenuSubmenuExampleState> {
+
+  constructor(props: any) {
+    super(props);
+
+    this.state = {
+      hoverDelay: 250
+    };
+  }
 
   public render() {
     return (
       <div>
+        <TextField value={ String(this.state.hoverDelay) } onChanged={ this._onHoverDelayChanged } />
         <DefaultButton
           id='ContextualMenuButton2'
           text='Click for ContextualMenu'
           menuProps={ {
             shouldFocusOnMount: true,
+            subMenuHoverDelay: this.state.hoverDelay,
             items: [
               {
                 key: 'newItem',
@@ -29,6 +44,7 @@ export class ContextualMenuSubmenuExample extends React.Component<any, any> {
                     }
                   ],
                 },
+                href: 'https://bing.com',
                 name: 'New'
               },
               {
@@ -72,4 +88,10 @@ export class ContextualMenuSubmenuExample extends React.Component<any, any> {
       </div>
     );
   }
+
+  private _onHoverDelayChanged = (newValue: string) => {
+    this.setState({
+      hoverDelay: +newValue
+    });
+  }
 }

From 544bcab92e62a340e80cd2fdd13e784fad3c006b Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 15 Mar 2018 09:51:41 -0700
Subject: [PATCH 1585/1641] Update package.json

---
 scripts/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/scripts/package.json b/scripts/package.json
index d022cfbbeb145..2f249ee3e8b65 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -49,7 +49,7 @@
   "bundlesize": [
     {
       "path": "../apps/test-bundle-button/dist/main.min.js",
-      "maxSize": "44.8 kB"
+      "maxSize": "45.0 kB"
     }
   ]
 }

From adf51e2212bebeffb2d33078dba4972bcfb40e9f Mon Sep 17 00:00:00 2001
From: Lambert Wang <lambert.ww@gmail.com>
Date: Thu, 15 Mar 2018 11:38:52 -0700
Subject: [PATCH 1586/1641] Pickers: Allow onItemSelected to return null
 (#4276)

* Pickers: Allow onItemSelected to return null

* Change file

* Missing semicolon
---
 ...llan-nullPickersItem_2018-03-14-23-46.json | 11 +++++
 .../src/components/pickers/BasePicker.tsx     |  7 ++-
 .../components/pickers/BasePicker.types.ts    |  5 +-
 .../examples/TagPicker.Basic.Example.tsx      | 47 +++++++++++++++++--
 4 files changed, 64 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/magellan-nullPickersItem_2018-03-14-23-46.json

diff --git a/common/changes/office-ui-fabric-react/magellan-nullPickersItem_2018-03-14-23-46.json b/common/changes/office-ui-fabric-react/magellan-nullPickersItem_2018-03-14-23-46.json
new file mode 100644
index 0000000000000..f84444314565c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/magellan-nullPickersItem_2018-03-14-23-46.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Pickers: Allow onItemSelected to return null",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "law@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 5d45d58d2286d..9351ba8ac6769 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -596,7 +596,12 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   @autobind
   protected addItem(item: T) {
-    const processedItem: T | PromiseLike<T> = this.props.onItemSelected ? (this.props.onItemSelected as any)(item) : item;
+    const processedItem: T | PromiseLike<T> | null =
+      this.props.onItemSelected ? (this.props.onItemSelected as any)(item) : item;
+
+    if (processedItem === null) {
+      return;
+    }
 
     const processedItemObject: T = processedItem as T;
     const processedItemPromiseLike: PromiseLike<T> = processedItem as PromiseLike<T>;
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts
index de2cb6acb91cb..50fa5c174c9a7 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts
@@ -119,9 +119,10 @@ export interface IBasePickerProps<T> extends React.Props<any> {
    */
   removeButtonAriaLabel?: string;
   /**
-   * A callback to process a selection after the user selects something from the picker.
+   * A callback to process a selection after the user selects something from the picker. If the callback returns null,
+   * the item will not be added to the picker.
    */
-  onItemSelected?: (selectedItem?: T) => T | PromiseLike<T>;
+  onItemSelected?: (selectedItem?: T) => T | PromiseLike<T> | null;
   /**
    * The items that the base picker should currently display as selected. If this is provided then the picker will act as a controlled component.
    */
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
index 798c45a35ce54..9a92e82bbd00f 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
@@ -1,5 +1,8 @@
 import * as React from 'react';
-import { autobind } from '../../../Utilities';
+import {
+  autobind,
+  BaseComponent
+} from '../../../Utilities';
 import { TagPicker } from 'office-ui-fabric-react/lib/components/pickers/TagPicker/TagPicker';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { ITagPickerDemoPageState } from 'office-ui-fabric-react/lib/components/pickers/examples/ITagPickerDemoPageState';
@@ -24,7 +27,9 @@ const _testTags = [
   'yellow'
 ].map(item => ({ key: item, name: item }));
 
-export class TagPickerBasicExample extends React.Component<{}, ITagPickerDemoPageState> {
+export class TagPickerBasicExample extends BaseComponent<{}, ITagPickerDemoPageState> {
+  private _picker: TagPicker;
+
   constructor(props: {}) {
     super(props);
     this.state = {
@@ -41,6 +46,7 @@ export class TagPickerBasicExample extends React.Component<{}, ITagPickerDemoPag
           checked={ this.state.isPickerDisabled }
           onChange={ this._onDisabledButtonClick }
         />
+        Filter items in suggestions: This picker will filter added items from the search suggestions.
         <TagPicker
           onResolveSuggestions={ this._onFilterChanged }
           getTextFromItem={ this._getTextFromItem }
@@ -58,6 +64,27 @@ export class TagPickerBasicExample extends React.Component<{}, ITagPickerDemoPag
             'aria-label': 'Tag Picker'
           } }
         />
+        <br />
+        Filter items on selected: This picker will show already-added suggestions but will not add duplicate tags.
+        <TagPicker
+          componentRef={ this._resolveRef('_picker') }
+          onResolveSuggestions={ this._onFilterChangedNoFilter }
+          onItemSelected={ this._onItemSelected }
+          getTextFromItem={ this._getTextFromItem }
+          pickerSuggestionsProps={
+            {
+              suggestionsHeaderText: 'Suggested Tags',
+              noResultsFoundText: 'No Color Tags Found'
+            }
+          }
+          itemLimit={ 2 }
+          disabled={ this.state.isPickerDisabled }
+          inputProps={ {
+            onBlur: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onBlur called'),
+            onFocus: (ev: React.FocusEvent<HTMLInputElement>) => console.log('onFocus called'),
+            'aria-label': 'Tag Picker'
+          } }
+        />
       </div>
     );
   }
@@ -75,7 +102,21 @@ export class TagPickerBasicExample extends React.Component<{}, ITagPickerDemoPag
 
   @autobind
   private _onFilterChanged(filterText: string, tagList: { key: string, name: string }[]) {
-    return filterText ? _testTags.filter(tag => tag.name.toLowerCase().indexOf(filterText.toLowerCase()) === 0).filter(item => !this._listContainsDocument(item, tagList)) : [];
+    return filterText ? _testTags.filter(tag => tag.name.toLowerCase().indexOf(filterText.toLowerCase()) === 0)
+      .filter(tag => !this._listContainsDocument(tag, tagList)) : [];
+  }
+
+  @autobind
+  private _onFilterChangedNoFilter(filterText: string, tagList: { key: string, name: string }[]) {
+    return filterText ? _testTags.filter(tag => tag.name.toLowerCase().indexOf(filterText.toLowerCase()) === 0) : [];
+  }
+
+  @autobind
+  private _onItemSelected(item: any) {
+    if (this._listContainsDocument(item, this._picker.items)) {
+      return null;
+    }
+    return item;
   }
 
   private _listContainsDocument(tag: { key: string, name: string }, tagList: { key: string, name: string }[]) {

From 4e5441d6542b2f4f7ac6097f5b6a6a5839282410 Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Thu, 15 Mar 2018 13:41:05 -0700
Subject: [PATCH 1587/1641] Addressing Issue #4077 - DetailsList
 "data-selection-disabled" doesn't work (#4286)

* Added _isSelectionDisabled check in SelectionZone's _onMouseDown

* rush change
---
 ...lslist-dataselectionfix-4077_2018-03-15-17-58.json | 11 +++++++++++
 .../examples/DetailsList.CustomColumns.Example.tsx    |  2 +-
 .../src/utilities/selection/SelectionZone.tsx         |  5 +++++
 3 files changed, 17 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/detailslist-dataselectionfix-4077_2018-03-15-17-58.json

diff --git a/common/changes/office-ui-fabric-react/detailslist-dataselectionfix-4077_2018-03-15-17-58.json b/common/changes/office-ui-fabric-react/detailslist-dataselectionfix-4077_2018-03-15-17-58.json
new file mode 100644
index 0000000000000..077f693e0967d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/detailslist-dataselectionfix-4077_2018-03-15-17-58.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Added _isSelectionDisabled check in SelectionZone's onMouseDown event handler",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
index ad411d2bca048..0589376a17908 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
@@ -117,7 +117,7 @@ function _renderItemColumn(item: any, index: number, column: IColumn) {
       return <Link href='#'>{ fieldContent }</Link>;
 
     case 'color':
-      return <span data-selection-disabled={ true } style={ { color: fieldContent } }>{ fieldContent }</span>;
+      return <span data-selection-disabled={ true } style={ { color: fieldContent, height: '100%', display: 'block' } }>{ fieldContent }</span>;
 
     default:
       return <span>{ fieldContent }</span>;
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
index 4c475d3c14df3..e350b7466eb59 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
@@ -180,6 +180,11 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     let target = ev.target as HTMLElement;
     const itemRoot = this._findItemRoot(target);
 
+    // No-op if selection is disabled
+    if (this._isSelectionDisabled(target)) {
+      return;
+    }
+
     while (target !== this._root) {
       if (this._hasAttribute(target, SELECTALL_TOGGLE_ALL_ATTRIBUTE_NAME)) {
         break;

From 25a4bd19fcda505fa3c18116e0aca52bc521e17d Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 15 Mar 2018 20:31:07 -0700
Subject: [PATCH 1588/1641] BaseButton: removing autobind usage (#4279)

* Removing autobind usage as a test in Button.

* Adding change.
---
 .../button-autobind_2018-03-15-01-06.json     | 11 +++++
 .../src/components/Button/BaseButton.tsx      | 40 ++++++-------------
 .../Button/examples/Button.Swap.Example.tsx   |  9 +----
 3 files changed, 26 insertions(+), 34 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/button-autobind_2018-03-15-01-06.json

diff --git a/common/changes/office-ui-fabric-react/button-autobind_2018-03-15-01-06.json b/common/changes/office-ui-fabric-react/button-autobind_2018-03-15-01-06.json
new file mode 100644
index 0000000000000..82ea44d554065
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/button-autobind_2018-03-15-01-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "BaseButton: removing autobind usage.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index e1f346217eaf1..4e7728c775e24 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -4,7 +4,6 @@ import {
   IRenderFunction,
   anchorProperties,
   assign,
-  autobind,
   buttonProperties,
   getId,
   getNativeProps,
@@ -248,8 +247,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     return Content;
   }
 
-  @autobind
-  private _onRenderIcon(buttonProps?: IButtonProps, defaultRender?: IRenderFunction<IButtonProps>): JSX.Element | null {
+  private _onRenderIcon = (buttonProps?: IButtonProps, defaultRender?: IRenderFunction<IButtonProps>): JSX.Element | null => {
     const {
       iconProps
     } = this.props;
@@ -265,8 +263,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     return null;
   }
 
-  @autobind
-  private _onRenderTextContents(): JSX.Element | (JSX.Element | null)[] {
+  private _onRenderTextContents = (): JSX.Element | (JSX.Element | null)[] => {
     const {
       text,
       children,
@@ -291,8 +288,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     ]);
   }
 
-  @autobind
-  private _onRenderText(): JSX.Element | null {
+  private _onRenderText = (): JSX.Element | null => {
     let {
       text
     } = this.props;
@@ -320,8 +316,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     return null;
   }
 
-  @autobind
-  private _onRenderChildren(): JSX.Element | null {
+  private _onRenderChildren = (): JSX.Element | null => {
     const { children } = this.props;
 
     // If children is just a string, either it or the text will be rendered via onRenderLabel
@@ -333,8 +328,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     return children as any;
   }
 
-  @autobind
-  private _onRenderDescription(props: IButtonProps) {
+  private _onRenderDescription = (props: IButtonProps) => {
     const {
       description
     } = props;
@@ -354,8 +348,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       );
   }
 
-  @autobind
-  private _onRenderAriaDescription() {
+  private _onRenderAriaDescription = () => {
     const {
       ariaDescription
     } = this.props;
@@ -369,8 +362,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       );
   }
 
-  @autobind
-  private _onRenderMenuIcon(props: IButtonProps): JSX.Element | null {
+  private _onRenderMenuIcon = (props: IButtonProps): JSX.Element | null => {
     const {
       menuIconProps
     } = this.props;
@@ -386,8 +378,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     );
   }
 
-  @autobind
-  private _onRenderMenu(menuProps: IContextualMenuProps): JSX.Element {
+  private _onRenderMenu = (menuProps: IContextualMenuProps): JSX.Element => {
     const { onDismiss = this._dismissMenu } = menuProps;
 
     return (
@@ -403,13 +394,11 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     );
   }
 
-  @autobind
-  private _dismissMenu(): void {
+  private _dismissMenu = (): void => {
     this.setState({ menuProps: null });
   }
 
-  @autobind
-  private _onToggleMenu(): void {
+  private _onToggleMenu = (): void => {
     const { menuProps } = this.props;
     const currentMenuProps = this.state.menuProps;
     this.setState({ menuProps: currentMenuProps ? null : menuProps });
@@ -500,8 +489,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
 
   }
 
-  @autobind
-  private _onMouseDown(ev: React.MouseEvent<BaseButton>) {
+  private _onMouseDown = (ev: React.MouseEvent<BaseButton>) => {
     if (this.props.onMouseDown) {
       this.props.onMouseDown(ev);
     }
@@ -509,8 +497,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     ev.preventDefault();
   }
 
-  @autobind
-  private _onMenuKeyDown(ev: React.KeyboardEvent<HTMLDivElement | HTMLAnchorElement | HTMLButtonElement>) {
+  private _onMenuKeyDown = (ev: React.KeyboardEvent<HTMLDivElement | HTMLAnchorElement | HTMLButtonElement>) => {
     if (this.props.onKeyDown) {
       this.props.onKeyDown(ev);
     }
@@ -529,8 +516,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     }
   }
 
-  @autobind
-  private _onMenuClick(ev: React.MouseEvent<HTMLAnchorElement>) {
+  private _onMenuClick = (ev: React.MouseEvent<HTMLAnchorElement>) => {
     const { onMenuClick } = this.props;
     if (onMenuClick) {
       onMenuClick(ev, this);
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
index 8632716a9eb40..e91de6bf13f39 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Swap.Example.tsx
@@ -6,9 +6,6 @@ import {
   IButtonBasicExampleStyleProps,
   IButtonBasicExampleStyles
 } from './Button.Basic.Example.styles';
-import {
-  autobind
-} from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton, PrimaryButton, IButtonProps } from 'office-ui-fabric-react/lib/Button';
 
 export interface IButtonSwapExampleState {
@@ -79,13 +76,11 @@ export class ButtonSwapExample extends React.Component<IButtonProps, IButtonSwap
     );
   }
 
-  @autobind
-  private _setButtonRef(ref: any): void {
+  private _setButtonRef = (ref: any): void => {
     this.buttonRef = ReactDOM.findDOMNode(ref) as HTMLElement;
   }
 
-  @autobind
-  private _onClick(): void {
+  private _onClick = (): void => {
     // change the button type on click
     this.setState({ isPrimary: !this.state.isPrimary });
   }

From 8fcd8e334afcbe3fc7f23fa2f983e2ee7a3926ee Mon Sep 17 00:00:00 2001
From: dmarcey <demarcey@microsoft.com>
Date: Thu, 15 Mar 2018 23:45:32 -0400
Subject: [PATCH 1589/1641] Add LinkBase to exports. (#4256)

* Add LinkBase to exports.

* Added change file.
---
 ...sers-demarcey-linkBaseExport_2018-03-13-19-59.json | 11 +++++++++++
 .../src/components/Link/index.ts                      |  1 +
 2 files changed, 12 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/users-demarcey-linkBaseExport_2018-03-13-19-59.json

diff --git a/common/changes/office-ui-fabric-react/users-demarcey-linkBaseExport_2018-03-13-19-59.json b/common/changes/office-ui-fabric-react/users-demarcey-linkBaseExport_2018-03-13-19-59.json
new file mode 100644
index 0000000000000..47575aae87794
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-demarcey-linkBaseExport_2018-03-13-19-59.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Export LinkBase from OfficeFabric/Link/index.ts",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "demarcey@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Link/index.ts b/packages/office-ui-fabric-react/src/components/Link/index.ts
index cf4cc744d66af..7dc121c5d4115 100644
--- a/packages/office-ui-fabric-react/src/components/Link/index.ts
+++ b/packages/office-ui-fabric-react/src/components/Link/index.ts
@@ -1,2 +1,3 @@
 export * from './Link';
+export * from './Link.base';
 export * from './Link.types';

From a72e2b07b931ce113460b28035db2330b2e48cc8 Mon Sep 17 00:00:00 2001
From: Shiran Pasternak <shiranpasternak@gmail.com>
Date: Thu, 15 Mar 2018 23:48:41 -0400
Subject: [PATCH 1590/1641] Nav component sets aria-label on <nav> element
 (#4266)

The aria-label was set on the nested <ul> element. Per [WAI guidelines][1]
the aria-label should be set on the element having the "navigation" role.
This is especially important when multiple navigation landmarks exist in the
DOM tree.

[1]: https://www.w3.org/WAI/GL/wiki/Using_ARIA_landmarks_to_identify_regions_of_a_page
---
 .../nav-element-aria-label_2018-03-14-01-34.json      | 11 +++++++++++
 .../src/components/Nav/Nav.base.tsx                   |  3 ++-
 .../src/components/Nav/Nav.test.tsx                   | 10 ++++++++++
 .../components/Nav/__snapshots__/Nav.test.tsx.snap    |  2 +-
 4 files changed, 24 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/nav-element-aria-label_2018-03-14-01-34.json

diff --git a/common/changes/office-ui-fabric-react/nav-element-aria-label_2018-03-14-01-34.json b/common/changes/office-ui-fabric-react/nav-element-aria-label_2018-03-14-01-34.json
new file mode 100644
index 0000000000000..50989e13a2b15
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/nav-element-aria-label_2018-03-14-01-34.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Nav component sets aria-label on nested element with role=navigation",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "shiran.pasternak@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
index 9f3171067c707..6e2e593873acc 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
@@ -105,6 +105,7 @@ export class NavBase extends BaseComponent<INavProps, INavState> implements INav
         <nav
           role='navigation'
           className={ classNames.root }
+          aria-label={ this.props.ariaLabel }
         >
           { groupElements }
         </nav>
@@ -218,7 +219,7 @@ export class NavBase extends BaseComponent<INavProps, INavState> implements INav
     const classNames = getClassNames(getStyles!, { theme: theme!, groups });
 
     return (
-      <ul role='list' aria-label={ this.props.ariaLabel } className={ classNames.navItems }>
+      <ul role='list' className={ classNames.navItems }>
         { linkElements }
       </ul>
     );
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.test.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.test.tsx
index aec55d51ad990..840514ee5b64a 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.test.tsx
@@ -46,4 +46,14 @@ describe('Nav', () => {
     link.simulate('click');
     expect(handler.mock.calls.length).toBe(1);
   });
+
+  it('sets ARIA label on the nav element', () => {
+    const label = 'The navigation label';
+    const nav = mount<NavBase>(
+      <Nav
+        ariaLabel={ label }
+        groups={ [] }
+      />);
+    expect(nav.find('[role="navigation"]').prop('aria-label')).toEqual(label);
+  });
 });
diff --git a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
index 3da206e72ab4f..ee83f7a180de5 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
@@ -12,6 +12,7 @@ exports[`Nav renders Nav correctly 1`] = `
   role="presentation"
 >
   <nav
+    aria-label={undefined}
     className=
         ms-Nav
         {
@@ -40,7 +41,6 @@ exports[`Nav renders Nav correctly 1`] = `
             }
       >
         <ul
-          aria-label={undefined}
           className=
               ms-Nav-navItems
               {

From abadb7f7b64913012e37e754d73cb8de517a237e Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 16 Mar 2018 03:28:04 -0700
Subject: [PATCH 1591/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...on-description-props_2018-03-15-14-54.json | 11 -----
 .../button-autobind_2018-03-15-01-06.json     | 11 -----
 ...ataselectionfix-4077_2018-03-15-17-58.json | 11 -----
 ...llan-nullPickersItem_2018-03-14-23-46.json | 11 -----
 ...v-element-aria-label_2018-03-14-01-34.json | 11 -----
 ...rcey-anchorMenuItems_2018-03-06-21-28.json | 11 -----
 ...arcey-linkBaseExport_2018-03-13-19-59.json | 11 -----
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 44 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 ++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 16 files changed, 65 insertions(+), 85 deletions(-)
 delete mode 100644 common/changes/office-ui-fabric-react/basebutton-description-props_2018-03-15-14-54.json
 delete mode 100644 common/changes/office-ui-fabric-react/button-autobind_2018-03-15-01-06.json
 delete mode 100644 common/changes/office-ui-fabric-react/detailslist-dataselectionfix-4077_2018-03-15-17-58.json
 delete mode 100644 common/changes/office-ui-fabric-react/magellan-nullPickersItem_2018-03-14-23-46.json
 delete mode 100644 common/changes/office-ui-fabric-react/nav-element-aria-label_2018-03-14-01-34.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-demarcey-anchorMenuItems_2018-03-06-21-28.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-demarcey-linkBaseExport_2018-03-13-19-59.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 831e3c845ebe2..4e7eb5418afb4 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.64.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.4 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 2d14e8a95200a..5224163ba7e04 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.64.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.4 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 40d2365aa19f0..1d852cc4510f3 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.64.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.4 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 49b3155b3d942..5d0a313af7647 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.64.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.4 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 0a56de76ce057..282922e17bba1 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.64.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.4 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/common/changes/office-ui-fabric-react/basebutton-description-props_2018-03-15-14-54.json b/common/changes/office-ui-fabric-react/basebutton-description-props_2018-03-15-14-54.json
deleted file mode 100644
index efd3b5ba2a758..0000000000000
--- a/common/changes/office-ui-fabric-react/basebutton-description-props_2018-03-15-14-54.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Button: fixed bug causes by onRenderDescription pulling from this.props instead of passed in props",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/button-autobind_2018-03-15-01-06.json b/common/changes/office-ui-fabric-react/button-autobind_2018-03-15-01-06.json
deleted file mode 100644
index 82ea44d554065..0000000000000
--- a/common/changes/office-ui-fabric-react/button-autobind_2018-03-15-01-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "BaseButton: removing autobind usage.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/detailslist-dataselectionfix-4077_2018-03-15-17-58.json b/common/changes/office-ui-fabric-react/detailslist-dataselectionfix-4077_2018-03-15-17-58.json
deleted file mode 100644
index 077f693e0967d..0000000000000
--- a/common/changes/office-ui-fabric-react/detailslist-dataselectionfix-4077_2018-03-15-17-58.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Added _isSelectionDisabled check in SelectionZone's onMouseDown event handler",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/magellan-nullPickersItem_2018-03-14-23-46.json b/common/changes/office-ui-fabric-react/magellan-nullPickersItem_2018-03-14-23-46.json
deleted file mode 100644
index f84444314565c..0000000000000
--- a/common/changes/office-ui-fabric-react/magellan-nullPickersItem_2018-03-14-23-46.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Pickers: Allow onItemSelected to return null",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "law@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/nav-element-aria-label_2018-03-14-01-34.json b/common/changes/office-ui-fabric-react/nav-element-aria-label_2018-03-14-01-34.json
deleted file mode 100644
index 50989e13a2b15..0000000000000
--- a/common/changes/office-ui-fabric-react/nav-element-aria-label_2018-03-14-01-34.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Nav component sets aria-label on nested element with role=navigation",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "shiran.pasternak@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-demarcey-anchorMenuItems_2018-03-06-21-28.json b/common/changes/office-ui-fabric-react/users-demarcey-anchorMenuItems_2018-03-06-21-28.json
deleted file mode 100644
index 93a460742b19c..0000000000000
--- a/common/changes/office-ui-fabric-react/users-demarcey-anchorMenuItems_2018-03-06-21-28.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ContextualMenu: Allow anchor menu items to have sub menus. Added prop for sub menu hover delay.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "demarcey@microsoft.com"
-}
diff --git a/common/changes/office-ui-fabric-react/users-demarcey-linkBaseExport_2018-03-13-19-59.json b/common/changes/office-ui-fabric-react/users-demarcey-linkBaseExport_2018-03-13-19-59.json
deleted file mode 100644
index 47575aae87794..0000000000000
--- a/common/changes/office-ui-fabric-react/users-demarcey-linkBaseExport_2018-03-13-19-59.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Export LinkBase from OfficeFabric/Link/index.ts",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "demarcey@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index a709e423813d6..93c349c18b13b 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.64.3 <6.0.0",
+    "office-ui-fabric-react": ">=5.64.4 <6.0.0",
     "@uifabric/icons": ">=5.6.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index ecb059145ad4f..9c3d69710270d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,50 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.64.4",
+      "tag": "office-ui-fabric-react_v5.64.4",
+      "date": "Fri, 16 Mar 2018 10:28:03 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "552fef5879cc776b66aa09135dbbeacfb6e7d578",
+            "comment": "Button: fixed bug causes by onRenderDescription pulling from this.props instead of passed in props"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "25a4bd19fcda505fa3c18116e0aca52bc521e17d",
+            "comment": "BaseButton: removing autobind usage."
+          },
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "4e5441d6542b2f4f7ac6097f5b6a6a5839282410",
+            "comment": "Added _isSelectionDisabled check in SelectionZone's onMouseDown event handler"
+          },
+          {
+            "author": "Lambert Wang <lambert.ww@gmail.com>",
+            "commit": "adf51e2212bebeffb2d33078dba4972bcfb40e9f",
+            "comment": "Pickers: Allow onItemSelected to return null"
+          },
+          {
+            "author": "Shiran Pasternak <shiranpasternak@gmail.com>",
+            "commit": "a72e2b07b931ce113460b28035db2330b2e48cc8",
+            "comment": "Nav component sets aria-label on nested element with role=navigation"
+          },
+          {
+            "author": "dmarcey <demarcey@microsoft.com>",
+            "commit": "1b072de8cd4ccd26a51d38b8cb6d4a151d570aab",
+            "comment": "ContextualMenu: Allow anchor menu items to have sub menus. Added prop for sub menu hover delay."
+          },
+          {
+            "author": "dmarcey <demarcey@microsoft.com>",
+            "commit": "8fcd8e334afcbe3fc7f23fa2f983e2ee7a3926ee",
+            "comment": "Export LinkBase from OfficeFabric/Link/index.ts"
+          }
+        ]
+      }
+    },
     {
       "version": "5.64.3",
       "tag": "office-ui-fabric-react_v5.64.3",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 5712a78cd422e..49152d2d37216 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 15 Mar 2018 10:37:10 GMT and should not be manually modified.
+This log was last generated on Fri, 16 Mar 2018 10:28:03 GMT and should not be manually modified.
+
+## 5.64.4
+Fri, 16 Mar 2018 10:28:03 GMT
+
+### Patches
+
+- Button: fixed bug causes by onRenderDescription pulling from this.props instead of passed in props
+- BaseButton: removing autobind usage.
+- Added _isSelectionDisabled check in SelectionZone's onMouseDown event handler
+- Pickers: Allow onItemSelected to return null
+- Nav component sets aria-label on nested element with role=navigation
+- ContextualMenu: Allow anchor menu items to have sub menus. Added prop for sub menu hover delay.
+- Export LinkBase from OfficeFabric/Link/index.ts
 
 ## 5.64.3
 Thu, 15 Mar 2018 10:37:10 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 867769315403c..0c31295ba30d7 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.64.3",
+  "version": "5.64.4",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From b4f58e498bc0885180f67f1fc9d3eb742e3704f6 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Fri, 16 Mar 2018 10:13:10 -0700
Subject: [PATCH 1592/1641] Button: Focus in high contrast mode fix (#4221)

* Adding high contrast to getFocusStyle

* Removing extra border for split button in high contrast

* CommandBar button has its own focus style in hc mode

* Added change files

* Switching button high contrast fix from styling to button

* From let to const

* Button style refactor

* Using color param for focus

* Passing high contrast style obj to getFocusStyle

* highContrastStyle

* Updated snapshots

* Semicolons

* Update experiements snapshots

* Removed unused imports
---
 .../button-focus-hc_2018-03-08-19-39.json     | 11 +++
 .../button-focus-hc_2018-03-08-19-39.json     | 11 +++
 .../__snapshots__/CommandBar.test.tsx.snap    | 22 +++++
 .../__snapshots__/Breadcrumb.test.tsx.snap    |  8 ++
 .../components/Button/BaseButton.styles.ts    | 10 +-
 .../src/components/Button/ButtonThemes.ts     | 16 +++-
 .../CommandBarButton.styles.ts                | 33 +++++--
 .../Button/SplitButton/SplitButton.styles.ts  | 10 +-
 .../Button/__snapshots__/Button.test.tsx.snap | 43 +++++++++
 .../examples/Button.Split.Example.styles.ts   | 10 +-
 .../__snapshots__/ComboBox.test.tsx.snap      |  8 ++
 .../__snapshots__/Facepile.test.tsx.snap      |  8 ++
 .../Nav/__snapshots__/Nav.test.tsx.snap       |  8 ++
 .../Pivot/__snapshots__/Pivot.test.tsx.snap   | 16 ++++
 .../__snapshots__/SpinButton.test.tsx.snap    | 16 ++++
 .../SwatchColorPicker.test.tsx.snap           | 96 +++++++++++++++++++
 packages/styling/src/styles/getFocusStyle.ts  | 10 +-
 17 files changed, 322 insertions(+), 14 deletions(-)
 create mode 100644 common/changes/@uifabric/styling/button-focus-hc_2018-03-08-19-39.json
 create mode 100644 common/changes/office-ui-fabric-react/button-focus-hc_2018-03-08-19-39.json

diff --git a/common/changes/@uifabric/styling/button-focus-hc_2018-03-08-19-39.json b/common/changes/@uifabric/styling/button-focus-hc_2018-03-08-19-39.json
new file mode 100644
index 0000000000000..2fad2370e107a
--- /dev/null
+++ b/common/changes/@uifabric/styling/button-focus-hc_2018-03-08-19-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "High contrast mode for focus styling.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/button-focus-hc_2018-03-08-19-39.json b/common/changes/office-ui-fabric-react/button-focus-hc_2018-03-08-19-39.json
new file mode 100644
index 0000000000000..a902df6b876d6
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/button-focus-hc_2018-03-08-19-39.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Button: High contrast mode focus bug fixes.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap b/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
index 31a3fe9326de1..7c7eab154bbbc 100644
--- a/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
+++ b/packages/experiments/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
@@ -100,6 +100,17 @@ exports[`CommandBar renders commands correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
+                @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+                  border: none;
+                  bottom: 4px;
+                  left: 4px;
+                  outline-color: ButtonText;
+                  right: 4px;
+                  top: 4px;
+                }
+                @media screen and (-ms-high-contrast: active){& {
+                  border: none;
+                }
                 &:hover {
                   background-color: #eaeaea;
                   color: #212121;
@@ -201,6 +212,17 @@ exports[`CommandBar renders commands correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
+                @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+                  border: none;
+                  bottom: 4px;
+                  left: 4px;
+                  outline-color: ButtonText;
+                  right: 4px;
+                  top: 4px;
+                }
+                @media screen and (-ms-high-contrast: active){& {
+                  border: none;
+                }
                 &:hover {
                   background-color: #eaeaea;
                   color: #212121;
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
index bb6e270d861e7..3fa5170fcb9d3 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
@@ -243,6 +243,14 @@ exports[`Breadcrumb renders breadcumb correctly 2`] = `
                     top: 0px;
                     z-index: 1;
                   }
+                  @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+                    border: none;
+                    bottom: -2px;
+                    left: -2px;
+                    outline-color: ButtonText;
+                    right: -2px;
+                    top: -2px;
+                  }
                   &:hover {
                     color: #004578;
                   }
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
index 0d8c57082c3a3..734dc7b6e51f2 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.styles.ts
@@ -35,10 +35,18 @@ export const getStyles = memoizeFunction((
   const border = semanticColors.buttonBorder;
   const disabledBackground = semanticColors.disabledBackground;
   const disabledText = semanticColors.disabledText;
+  const buttonHighContrastFocus = {
+    left: -2,
+    top: -2,
+    bottom: -2,
+    right: -2,
+    border: 'none',
+    outlineColor: 'ButtonText'
+  };
 
   return {
     root: [
-      getFocusStyle(theme, -1),
+      getFocusStyle(theme, -1, 'relative', buttonHighContrastFocus),
       theme.fonts.medium,
       {
         boxSizing: 'border-box',
diff --git a/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts b/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
index aa0fa868ef6a4..f1a79c4b0a2af 100644
--- a/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/ButtonThemes.ts
@@ -45,7 +45,13 @@ export function standardStyles(theme: ITheme): IButtonStyles {
     },
 
     // Split button styles
-    splitButtonContainer: {},
+    splitButtonContainer: {
+      selectors: {
+        [HighContrastSelector]: {
+          border: 'none'
+        }
+      }
+    },
 
     splitButtonMenuButton: {
       color: theme.palette.white,
@@ -152,7 +158,13 @@ export function primaryStyles(theme: ITheme): IButtonStyles {
     },
 
     // Split button styles
-    splitButtonContainer: {},
+    splitButtonContainer: {
+      selectors: {
+        [HighContrastSelector]: {
+          border: 'none'
+        }
+      }
+    },
 
     splitButtonDivider: {
       backgroundColor: theme.palette.themeLighter
diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts
index d76227886d637..425a61d4636a2 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts
@@ -1,7 +1,10 @@
 import { IButtonStyles } from '../Button.types';
 import {
   ITheme,
-  concatStyleSets
+  concatStyleSets,
+  getFocusStyle,
+  HighContrastSelector,
+  IRawStyle
 } from '../../../Styling';
 import { memoizeFunction } from '../../../Utilities';
 import {
@@ -19,13 +22,29 @@ export const getStyles = memoizeFunction((
 ): IButtonStyles => {
   const baseButtonStyles: IButtonStyles = getBaseButtonStyles(theme);
   const baseSplitButtonStyles: IButtonStyles = getSplitButtonStyles(theme);
+  const commandButtonHighContrastFocus = {
+    left: 4,
+    top: 4,
+    bottom: 4,
+    right: 4,
+    border: 'none'
+  };
+
   const commandButtonStyles: IButtonStyles = {
-    root: {
-      minWidth: '40px',
-      backgroundColor: theme.palette.neutralLighter,
-      color: theme.palette.neutralPrimary,
-      padding: '0 4px'
-    },
+    root: [
+      getFocusStyle(theme, -1, 'relative', commandButtonHighContrastFocus),
+      {
+        minWidth: '40px',
+        backgroundColor: theme.palette.neutralLighter,
+        color: theme.palette.neutralPrimary,
+        padding: '0 4px',
+        selectors: {
+          [HighContrastSelector]: {
+            border: 'none'
+          }
+        }
+      }
+    ],
 
     rootHovered: {
       backgroundColor: theme.palette.neutralLight,
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
index 7c37163660a57..5ad66a78c19cf 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
@@ -10,6 +10,14 @@ export const getStyles = memoizeFunction((
   theme: ITheme,
   customStyles?: IButtonStyles
 ): IButtonStyles => {
+  const buttonHighContrastFocus = {
+    left: -2,
+    top: -2,
+    bottom: -2,
+    right: -2,
+    border: 'none'
+  };
+
   const splitButtonStyles: IButtonStyles = {
     splitButtonContainer: {
       position: 'relative',
@@ -21,7 +29,7 @@ export const getStyles = memoizeFunction((
       border: '1px solid'
     },
     splitButtonMenuButton: [
-      getFocusStyle(theme, -1),
+      getFocusStyle(theme, -1, 'relative', buttonHighContrastFocus),
       {
         padding: 6,
         height: 'auto',
diff --git a/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
index 442ee99480d23..8a0af870bee1d 100644
--- a/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
@@ -49,6 +49,14 @@ exports[`Button renders ActionButton correctly 1`] = `
         top: 0px;
         z-index: 1;
       }
+      @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+        border: none;
+        bottom: -2px;
+        left: -2px;
+        outline-color: ButtonText;
+        right: -2px;
+        top: -2px;
+      }
       &:hover {
         color: #0078d7;
       }
@@ -153,6 +161,17 @@ exports[`Button renders CommandBarButton correctly 1`] = `
         top: 0px;
         z-index: 1;
       }
+      @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+        border: none;
+        bottom: 4px;
+        left: 4px;
+        outline-color: ButtonText;
+        right: 4px;
+        top: 4px;
+      }
+      @media screen and (-ms-high-contrast: active){& {
+        border: none;
+      }
       &:hover {
         background-color: #eaeaea;
         color: #212121;
@@ -301,6 +320,14 @@ exports[`Button renders CompoundButton correctly 1`] = `
         top: 0px;
         z-index: 1;
       }
+      @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+        border: none;
+        bottom: -2px;
+        left: -2px;
+        outline-color: ButtonText;
+        right: -2px;
+        top: -2px;
+      }
       &:hover {
         background-color: #eaeaea;
         color: #000000;
@@ -429,6 +456,14 @@ exports[`Button renders DefaultButton correctly 1`] = `
         top: 0px;
         z-index: 1;
       }
+      @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+        border: none;
+        bottom: -2px;
+        left: -2px;
+        outline-color: ButtonText;
+        right: -2px;
+        top: -2px;
+      }
       &:hover {
         background-color: #eaeaea;
         color: #000000;
@@ -527,6 +562,14 @@ exports[`Button renders IconButton correctly 1`] = `
         top: 0px;
         z-index: 1;
       }
+      @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+        border: none;
+        bottom: -2px;
+        left: -2px;
+        outline-color: ButtonText;
+        right: -2px;
+        top: -2px;
+      }
       &:hover {
         color: #004578;
       }
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.styles.ts b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.styles.ts
index 569bcc1691d05..fc896c31d99b7 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.styles.ts
@@ -1,10 +1,18 @@
 import { memoizeFunction } from 'office-ui-fabric-react/lib/Utilities';
 import { IButtonStyles } from 'office-ui-fabric-react/lib/Button';
+import { HighContrastSelector } from '../../../Styling';
 
 export const getCustomSplitButtonStyles = memoizeFunction((): IButtonStyles => {
   return {
     splitButtonMenuButton: { backgroundColor: 'white', width: '10px' },
     splitButtonMenuIcon: { fontSize: '7px' },
-    splitButtonDivider: { borderLeft: '1px solid #c8c8c8', right: 12 }
+    splitButtonDivider: { borderLeft: '1px solid #c8c8c8', right: 12 },
+    splitButtonContainer: {
+      selectors: {
+        [HighContrastSelector]: {
+          border: 'none'
+        }
+      }
+    }
   };
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
index 4410b1e5c5388..41acff49c0654 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
@@ -205,6 +205,14 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
             top: 0px;
             z-index: 1;
           }
+          @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+            border: none;
+            bottom: -2px;
+            left: -2px;
+            outline-color: ButtonText;
+            right: -2px;
+            top: -2px;
+          }
           @media screen and (-ms-high-contrast: active){& {
             -ms-high-contrast-adjust: none;
             background-color: ButtonFace;
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
index fcbd96a681aec..29b5a31e94631 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
@@ -178,6 +178,14 @@ exports[`Facepile renders Facepile correctly 1`] = `
               top: 0px;
               z-index: 1;
             }
+            @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+              border: none;
+              bottom: -2px;
+              left: -2px;
+              outline-color: ButtonText;
+              right: -2px;
+              top: -2px;
+            }
         data="75%"
         data-is-focusable={true}
         disabled={undefined}
diff --git a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
index ee83f7a180de5..b789af9710a0f 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
@@ -128,6 +128,14 @@ exports[`Nav renders Nav correctly 1`] = `
                       top: 1px;
                       z-index: 1;
                     }
+                    @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+                      border: none;
+                      bottom: -2px;
+                      left: -2px;
+                      outline-color: ButtonText;
+                      right: -2px;
+                      top: -2px;
+                    }
                     .ms-Nav-compositeLink:hover & {
                       background-color: #f8f8f8;
                       color: #333333;
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap
index 264a0b9749676..2efa30e7a0b54 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap
@@ -68,6 +68,14 @@ exports[`Pivot renders Pivot correctly 1`] = `
               top: 0px;
               z-index: 1;
             }
+            @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+              border: none;
+              bottom: -2px;
+              left: -2px;
+              outline-color: ButtonText;
+              right: -2px;
+              top: -2px;
+            }
             &:hover {
               color: #0078d7;
             }
@@ -162,6 +170,14 @@ exports[`Pivot renders Pivot correctly 1`] = `
               top: 0px;
               z-index: 1;
             }
+            @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+              border: none;
+              bottom: -2px;
+              left: -2px;
+              outline-color: ButtonText;
+              right: -2px;
+              top: -2px;
+            }
             &:hover {
               color: #0078d7;
             }
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
index 3b37ceae167ca..1b6d2f9f6eae5 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
@@ -193,6 +193,14 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
               top: 0px;
               z-index: 1;
             }
+            @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+              border: none;
+              bottom: -2px;
+              left: -2px;
+              outline-color: ButtonText;
+              right: -2px;
+              top: -2px;
+            }
             &:hover {
               background-color: #eaeaea;
               color: #000000;
@@ -298,6 +306,14 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
               top: 0px;
               z-index: 1;
             }
+            @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+              border: none;
+              bottom: -2px;
+              left: -2px;
+              outline-color: ButtonText;
+              right: -2px;
+              top: -2px;
+            }
             &:hover {
               background-color: #eaeaea;
               color: #000000;
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
index 836f6122dc63b..3a77aa7460b20 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
@@ -101,6 +101,14 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
+                @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+                  border: none;
+                  bottom: -2px;
+                  left: -2px;
+                  outline-color: ButtonText;
+                  right: -2px;
+                  top: -2px;
+                }
                 @media screen and (-ms-high-contrast: active){& {
                   border: none;
                 }
@@ -286,6 +294,14 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
+                @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+                  border: none;
+                  bottom: -2px;
+                  left: -2px;
+                  outline-color: ButtonText;
+                  right: -2px;
+                  top: -2px;
+                }
                 @media screen and (-ms-high-contrast: active){& {
                   border: none;
                 }
@@ -471,6 +487,14 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
+                @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+                  border: none;
+                  bottom: -2px;
+                  left: -2px;
+                  outline-color: ButtonText;
+                  right: -2px;
+                  top: -2px;
+                }
                 @media screen and (-ms-high-contrast: active){& {
                   border: none;
                 }
@@ -656,6 +680,14 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
+                @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+                  border: none;
+                  bottom: -2px;
+                  left: -2px;
+                  outline-color: ButtonText;
+                  right: -2px;
+                  top: -2px;
+                }
                 @media screen and (-ms-high-contrast: active){& {
                   border: none;
                 }
@@ -845,6 +877,14 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
+                @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+                  border: none;
+                  bottom: -2px;
+                  left: -2px;
+                  outline-color: ButtonText;
+                  right: -2px;
+                  top: -2px;
+                }
                 @media screen and (-ms-high-contrast: active){& {
                   border: none;
                 }
@@ -1030,6 +1070,14 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
+                @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+                  border: none;
+                  bottom: -2px;
+                  left: -2px;
+                  outline-color: ButtonText;
+                  right: -2px;
+                  top: -2px;
+                }
                 @media screen and (-ms-high-contrast: active){& {
                   border: none;
                 }
@@ -1215,6 +1263,14 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
+                @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+                  border: none;
+                  bottom: -2px;
+                  left: -2px;
+                  outline-color: ButtonText;
+                  right: -2px;
+                  top: -2px;
+                }
                 @media screen and (-ms-high-contrast: active){& {
                   border: none;
                 }
@@ -1400,6 +1456,14 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
+                @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+                  border: none;
+                  bottom: -2px;
+                  left: -2px;
+                  outline-color: ButtonText;
+                  right: -2px;
+                  top: -2px;
+                }
                 @media screen and (-ms-high-contrast: active){& {
                   border: none;
                 }
@@ -1589,6 +1653,14 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
+                @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+                  border: none;
+                  bottom: -2px;
+                  left: -2px;
+                  outline-color: ButtonText;
+                  right: -2px;
+                  top: -2px;
+                }
                 @media screen and (-ms-high-contrast: active){& {
                   border: none;
                 }
@@ -1774,6 +1846,14 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
+                @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+                  border: none;
+                  bottom: -2px;
+                  left: -2px;
+                  outline-color: ButtonText;
+                  right: -2px;
+                  top: -2px;
+                }
                 @media screen and (-ms-high-contrast: active){& {
                   border: none;
                 }
@@ -1959,6 +2039,14 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
+                @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+                  border: none;
+                  bottom: -2px;
+                  left: -2px;
+                  outline-color: ButtonText;
+                  right: -2px;
+                  top: -2px;
+                }
                 @media screen and (-ms-high-contrast: active){& {
                   border: none;
                 }
@@ -2144,6 +2232,14 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   top: 0px;
                   z-index: 1;
                 }
+                @media screen and (-ms-high-contrast: active){.ms-Fabric.is-focusVisible &:focus:after {
+                  border: none;
+                  bottom: -2px;
+                  left: -2px;
+                  outline-color: ButtonText;
+                  right: -2px;
+                  top: -2px;
+                }
                 @media screen and (-ms-high-contrast: active){& {
                   border: none;
                 }
diff --git a/packages/styling/src/styles/getFocusStyle.ts b/packages/styling/src/styles/getFocusStyle.ts
index 5d69bce7e2b13..372f2f08d2c90 100644
--- a/packages/styling/src/styles/getFocusStyle.ts
+++ b/packages/styling/src/styles/getFocusStyle.ts
@@ -1,5 +1,6 @@
 import { IRawStyle } from '@uifabric/merge-styles/lib/index';
 import { ITheme } from '../interfaces/index';
+import { HighContrastSelector } from './CommonStyles';
 
 /**
  * Generates a focus style which can be used to define an :after focus border.
@@ -9,12 +10,14 @@ import { ITheme } from '../interfaces/index';
  * @param color - The color for the border.
  * @param position - The positioning applied to the container. Must
  * be 'relative' or 'absolute' so that the focus border can live around it.
+ * @param highContrastStyle - Style for high contrast mode.
  * @returns The style object.
  */
 export function getFocusStyle(
   theme: ITheme,
   inset: number = 0,
-  position: 'relative' | 'absolute' = 'relative'
+  position: 'relative' | 'absolute' = 'relative',
+  highContrastStyle: IRawStyle | undefined = undefined
 ): IRawStyle {
   return {
     outline: 'transparent',
@@ -35,7 +38,10 @@ export function getFocusStyle(
         right: inset + 1,
         border: '1px solid ' + theme.palette.white,
         outline: '1px solid ' + theme.palette.neutralSecondary,
-        zIndex: 1
+        zIndex: 1,
+        selectors: {
+          [HighContrastSelector]: highContrastStyle
+        }
       }
 
     }

From e3a40d52e73af6e5a0062452e550f1b066c851c2 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Fri, 16 Mar 2018 10:48:06 -0700
Subject: [PATCH 1593/1641] Color: Changing themePrimary / Communication Blue
 (#4297)

* Switched 0078d7 to 0078d4

* Updated snapshots

* Added change files
---
 .../src/data/colors-accent.json               |  2 +-
 .../fabric-website/src/data/colors-theme.json |  2 +-
 .../fabric-website/src/styles/_variables.scss |  2 +-
 .../themePrimary-change_2018-03-16-17-25.json | 11 +++++++++
 .../themePrimary-change_2018-03-16-17-25.json | 11 +++++++++
 .../themePrimary-change_2018-03-16-17-25.json | 11 +++++++++
 .../themePrimary-change_2018-03-16-17-25.json | 11 +++++++++
 .../themePrimary-change_2018-03-16-17-25.json | 11 +++++++++
 ghdocs/Theming.md                             |  2 +-
 .../src/common/_themeOverrides.scss           |  4 ++--
 .../src/common/_semanticSlots.scss            |  8 +++----
 .../src/common/_themeOverrides.scss           |  4 ++--
 .../__snapshots__/ActivityItem.test.tsx.snap  |  6 ++---
 .../__snapshots__/Breadcrumb.test.tsx.snap    |  2 +-
 .../Button/__snapshots__/Button.test.tsx.snap |  6 ++---
 .../__snapshots__/ComboBox.test.tsx.snap      |  6 ++---
 .../Link/__snapshots__/Link.test.tsx.snap     | 12 +++++-----
 .../Nav/__snapshots__/Nav.test.tsx.snap       |  4 ++--
 .../Pivot/__snapshots__/Pivot.test.tsx.snap   |  8 +++----
 .../__snapshots__/SearchBox.test.tsx.snap     |  2 +-
 .../__snapshots__/SpinButton.test.tsx.snap    |  2 +-
 .../SwatchColorPicker.test.tsx.snap           | 24 +++++++++----------
 .../src/components/Theme/defaultTheme.ts      |  4 ++--
 .../ThemeGenerator/ThemeGeneratorPage.tsx     |  2 +-
 .../ThemeGenerator/ThemeRulesStandard.ts      |  2 +-
 packages/styling/src/styles/DefaultPalette.ts |  6 ++---
 packages/variants/src/variants.ts             |  2 +-
 27 files changed, 111 insertions(+), 56 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/themePrimary-change_2018-03-16-17-25.json
 create mode 100644 common/changes/@uifabric/fabric-website/themePrimary-change_2018-03-16-17-25.json
 create mode 100644 common/changes/@uifabric/styling/themePrimary-change_2018-03-16-17-25.json
 create mode 100644 common/changes/@uifabric/variants/themePrimary-change_2018-03-16-17-25.json
 create mode 100644 common/changes/office-ui-fabric-react/themePrimary-change_2018-03-16-17-25.json

diff --git a/apps/fabric-website/src/data/colors-accent.json b/apps/fabric-website/src/data/colors-accent.json
index 0595f346bd861..605500b8dd88f 100644
--- a/apps/fabric-website/src/data/colors-accent.json
+++ b/apps/fabric-website/src/data/colors-accent.json
@@ -104,7 +104,7 @@
       },
       {
         "name": "blue",
-        "value": "#0078d7",
+        "value": "#0078d4",
         "labelColorClass": "ms-fontColor-white"
       },
       {
diff --git a/apps/fabric-website/src/data/colors-theme.json b/apps/fabric-website/src/data/colors-theme.json
index 63f2dca5836bf..0d12bc12a4053 100644
--- a/apps/fabric-website/src/data/colors-theme.json
+++ b/apps/fabric-website/src/data/colors-theme.json
@@ -16,7 +16,7 @@
   },
   {
     "name": "themePrimary",
-    "value": "#0078d7",
+    "value": "#0078d4",
     "labelColorClass": "ms-fontColor-white"
   },
   {
diff --git a/apps/fabric-website/src/styles/_variables.scss b/apps/fabric-website/src/styles/_variables.scss
index c1860a81bec57..8fbf649680c79 100644
--- a/apps/fabric-website/src/styles/_variables.scss
+++ b/apps/fabric-website/src/styles/_variables.scss
@@ -4,7 +4,7 @@
 // Colors (all taken from the MDL2 palette)
 $color-home-darker: #004e8c;
 $color-home-dark: #0063b1;
-$color-home-medium: #0078d7;
+$color-home-medium: #0078d4;
 $color-home-light: #3a96dd;
 $color-home-lighter: #b3dbf2;
 
diff --git a/common/changes/@uifabric/example-app-base/themePrimary-change_2018-03-16-17-25.json b/common/changes/@uifabric/example-app-base/themePrimary-change_2018-03-16-17-25.json
new file mode 100644
index 0000000000000..ed155fa4fd8bf
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/themePrimary-change_2018-03-16-17-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "ThemePrimary: Updating this color along with an Office branding update.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/themePrimary-change_2018-03-16-17-25.json b/common/changes/@uifabric/fabric-website/themePrimary-change_2018-03-16-17-25.json
new file mode 100644
index 0000000000000..8ec9e026f4860
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/themePrimary-change_2018-03-16-17-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "ThemePrimary: Updating this color along with an Office branding update.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/themePrimary-change_2018-03-16-17-25.json b/common/changes/@uifabric/styling/themePrimary-change_2018-03-16-17-25.json
new file mode 100644
index 0000000000000..4d463fc84d81c
--- /dev/null
+++ b/common/changes/@uifabric/styling/themePrimary-change_2018-03-16-17-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "ThemePrimary: Updating this color along with an Office branding update.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/variants/themePrimary-change_2018-03-16-17-25.json b/common/changes/@uifabric/variants/themePrimary-change_2018-03-16-17-25.json
new file mode 100644
index 0000000000000..fb9e9ff4c062a
--- /dev/null
+++ b/common/changes/@uifabric/variants/themePrimary-change_2018-03-16-17-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/variants",
+      "comment": "ThemePrimary: Updating this color along with an Office branding update.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/variants",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/themePrimary-change_2018-03-16-17-25.json b/common/changes/office-ui-fabric-react/themePrimary-change_2018-03-16-17-25.json
new file mode 100644
index 0000000000000..29b04286ac6e2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/themePrimary-change_2018-03-16-17-25.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ThemePrimary: Updating this color along with an Office branding update.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file
diff --git a/ghdocs/Theming.md b/ghdocs/Theming.md
index e6f79bf369294..fc082b73d0201 100644
--- a/ghdocs/Theming.md
+++ b/ghdocs/Theming.md
@@ -10,7 +10,7 @@ Theming is a mechanism by which a consistent look and feel can be applied to all
 
 ## What's in a theme?
 A theme is defined by a simple collection of variables (which we call slots) with string values.
-For example, `themePrimary` by default is `"#0078d7"`, but it could easily be `"rgba(0, 120, 215)"`.
+For example, `themePrimary` by default is `"#0078d4"`, but it could easily be `"rgba(0, 120, 212)"`.
 
 
 ## What are theme slots?
diff --git a/packages/example-app-base/src/common/_themeOverrides.scss b/packages/example-app-base/src/common/_themeOverrides.scss
index f0ba2adfce387..a29ca32537a88 100644
--- a/packages/example-app-base/src/common/_themeOverrides.scss
+++ b/packages/example-app-base/src/common/_themeOverrides.scss
@@ -2,7 +2,7 @@
 $ms-color-themeDarker: "[theme:themeDarker, default: #004578]";
 $ms-color-themeDark: "[theme:themeDark, default: #005a9e]";
 $ms-color-themeDarkAlt: "[theme:themeDarkAlt, default: #106ebe]";
-$ms-color-themePrimary: "[theme:themePrimary, default: #0078d7]";
+$ms-color-themePrimary: "[theme:themePrimary, default: #0078d4]";
 $ms-color-themeSecondary: "[theme:themeSecondary, default: #2b88d8]";
 $ms-color-themeTertiary: "[theme:themeTertiary, default: #71afe5]";
 $ms-color-themeLight: "[theme:themeLight, default: #c7e0f4]";
@@ -38,7 +38,7 @@ $ms-color-purple: "[theme:purple, default: #5c2d91]";
 $ms-color-purpleLight: "[theme:purpleLight, default: #b4a0ff]";
 $ms-color-blueDark: "[theme:blueDark, default: #002050]";
 $ms-color-blueMid: "[theme:blueMid, default: #00188f]";
-$ms-color-blue: "[theme:blue, default: #0078d7]";
+$ms-color-blue: "[theme:blue, default: #0078d4]";
 $ms-color-blueLight: "[theme:blueLight, default: #00bcf2]";
 $ms-color-tealDark: "[theme:tealDark, default: #004b50]";
 $ms-color-teal: "[theme:teal, default: #008272]";
diff --git a/packages/office-ui-fabric-react/src/common/_semanticSlots.scss b/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
index 6c28970435c5f..30636a3504872 100644
--- a/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
+++ b/packages/office-ui-fabric-react/src/common/_semanticSlots.scss
@@ -23,10 +23,10 @@ $successBackgroundColor: "[theme:successBackground, default: rgba(186,216,10,.2)
 $inputBackgroundColor: "[theme:inputBackground, default: #ffffff]";
 $inputBorderColor: "[theme:inputBorder, default: #a6a6a6]";
 $inputBorderHoveredColor: "[theme:inputBorderHovered, default: #212121]";
-$inputBackgroundCheckedColor: "[theme:inputBackgroundChecked, default: #0078d7]";
+$inputBackgroundCheckedColor: "[theme:inputBackgroundChecked, default: #0078d4]";
 $inputBackgroundCheckedHoveredColor: "[theme:inputBackgroundCheckedHovered, default: #106ebe]";
 $inputForegroundCheckedColor: "[theme:inputForegroundChecked, default: #ffffff]";
-$inputFocusBorderAltColor: "[theme:inputFocusBorderAlt, default: #0078d7]";
+$inputFocusBorderAltColor: "[theme:inputFocusBorderAlt, default: #0078d4]";
 $smallInputBorderColor: "[theme:inputBorder, default: #666666]";
 $inputPlaceholderTextColor: "[theme:inputPlaceholderText, default: #666666]";
 
@@ -44,8 +44,8 @@ $buttonTextCheckedHoveredColor: "[theme:buttonTextCheckedHovered, default: #0000
 /* Menus */
 $menuItemBackgroundHoveredColor: "[theme:menuItemBackgroundHovered, default: #f8f8f8]";
 $menuItemBackgroundCheckedColor: "[theme:menuItemBackgroundChecked, default: #eaeaea]";
-$menuIconColor: "[theme:menuIcon, default: #0078d7]";
-$menuHeaderColor: "[theme:menuHeader, default: #0078d7]";
+$menuIconColor: "[theme:menuIcon, default: #0078d4]";
+$menuHeaderColor: "[theme:menuHeader, default: #0078d4]";
 
 /* Lists */
 $listBackgroundColor: "[theme:listBackground, default: #ffffff]";
diff --git a/packages/office-ui-fabric-react/src/common/_themeOverrides.scss b/packages/office-ui-fabric-react/src/common/_themeOverrides.scss
index c4526a6867539..b2751d5578eeb 100644
--- a/packages/office-ui-fabric-react/src/common/_themeOverrides.scss
+++ b/packages/office-ui-fabric-react/src/common/_themeOverrides.scss
@@ -1,7 +1,7 @@
 $ms-color-themeDarker: "[theme:themeDarker, default: #004578]";
 $ms-color-themeDark: "[theme:themeDark, default: #005a9e]";
 $ms-color-themeDarkAlt: "[theme:themeDarkAlt, default: #106ebe]";
-$ms-color-themePrimary: "[theme:themePrimary, default: #0078d7]";
+$ms-color-themePrimary: "[theme:themePrimary, default: #0078d4]";
 $ms-color-themeSecondary: "[theme:themeSecondary, default: #2b88d8]";
 $ms-color-themeTertiary: "[theme:themeTertiary, default: #71afe5]";
 $ms-color-themeLight: "[theme:themeLight, default: #c7e0f4]";
@@ -40,7 +40,7 @@ $ms-color-purple: "[theme:purple, default: #5c2d91]";
 $ms-color-purpleLight: "[theme:purpleLight, default: #b4a0ff]";
 $ms-color-blueDark: "[theme:blueDark, default: #002050]";
 $ms-color-blueMid: "[theme:blueMid, default: #00188f]";
-$ms-color-blue: "[theme:blue, default: #0078d7]";
+$ms-color-blue: "[theme:blue, default: #0078d4]";
 $ms-color-blueLight: "[theme:blueLight, default: #00bcf2]";
 $ms-color-tealDark: "[theme:tealDark, default: #004b50]";
 $ms-color-teal: "[theme:teal, default: #008272]";
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap
index 286b79f76ca97..10a242fb6db7b 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/__snapshots__/ActivityItem.test.tsx.snap
@@ -23,7 +23,7 @@ exports[`ActivityItem renders compact with a single persona correctly 1`] = `
     className=
         ms-ActivityItem-activityTypeIcon
         {
-          color: #0078d7;
+          color: #0078d4;
           font-size: 13px;
           height: 16px;
           line-height: 13px;
@@ -175,7 +175,7 @@ exports[`ActivityItem renders compact with an icon correctly 1`] = `
     className=
         ms-ActivityItem-activityTypeIcon
         {
-          color: #0078d7;
+          color: #0078d4;
           font-size: 13px;
           height: 16px;
           line-height: 13px;
@@ -254,7 +254,7 @@ exports[`ActivityItem renders compact with multiple personas correctly 1`] = `
     className=
         ms-ActivityItem-activityTypeIcon
         {
-          color: #0078d7;
+          color: #0078d4;
           font-size: 13px;
           height: 16px;
           line-height: 13px;
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
index 3fa5170fcb9d3..f97b2ed9aaa1c 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/__snapshots__/Breadcrumb.test.tsx.snap
@@ -255,7 +255,7 @@ exports[`Breadcrumb renders breadcumb correctly 2`] = `
                     color: #004578;
                   }
                   &:active {
-                    color: #0078d7;
+                    color: #0078d4;
                   }
               data-is-focusable={true}
               disabled={undefined}
diff --git a/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
index 8a0af870bee1d..3ab6ab56d0c6f 100644
--- a/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Button/__snapshots__/Button.test.tsx.snap
@@ -58,10 +58,10 @@ exports[`Button renders ActionButton correctly 1`] = `
         top: -2px;
       }
       &:hover {
-        color: #0078d7;
+        color: #0078d4;
       }
       &:hover .ms-Button-icon {
-        color: #0078d7;
+        color: #0078d4;
       }
       &:active {
         color: #000000;
@@ -574,7 +574,7 @@ exports[`Button renders IconButton correctly 1`] = `
         color: #004578;
       }
       &:active {
-        color: #0078d7;
+        color: #0078d4;
       }
   data-is-focusable={true}
   disabled={undefined}
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
index 41acff49c0654..4021026e6c9e7 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
@@ -44,7 +44,7 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
           display: none;
         }
         &.is-open {
-          border-color: #0078d7;
+          border-color: #0078d4;
         }
         @media screen and (-ms-high-contrast: active){&.is-open {
           -ms-high-contrast-adjust: none;
@@ -70,7 +70,7 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
           color: HighlightText;
         }
         &:active {
-          border-color: #0078d7;
+          border-color: #0078d4;
         }
         @media screen and (-ms-high-contrast: active){&:active {
           -ms-high-contrast-adjust: none;
@@ -87,7 +87,7 @@ exports[`ComboBox Renders ComboBox correctly 1`] = `
           top: -2px;
         }
         &:focus {
-          border-color: #0078d7;
+          border-color: #0078d4;
         }
         @media screen and (-ms-high-contrast: active){&:focus {
           -ms-high-contrast-adjust: none;
diff --git a/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap
index 12fddf196c581..3868767f4aacb 100644
--- a/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Link/__snapshots__/Link.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`Link renders Link correctly 1`] = `
   className=
       ms-Link
       {
-        color: #0078d7;
+        color: #0078d4;
         outline: transparent;
         position: relative;
         text-decoration: none;
@@ -29,7 +29,7 @@ exports[`Link renders Link correctly 1`] = `
         color: #004578;
       }
       &:focus {
-        color: #0078d7;
+        color: #0078d4;
       }
   href="#"
   onClick={[Function]}
@@ -46,7 +46,7 @@ exports[`Link renders Link with a custom class name 1`] = `
       ms-Link
       customClassName
       {
-        color: #0078d7;
+        color: #0078d4;
         outline: transparent;
         position: relative;
         text-decoration: none;
@@ -69,7 +69,7 @@ exports[`Link renders Link with a custom class name 1`] = `
         color: #004578;
       }
       &:focus {
-        color: #0078d7;
+        color: #0078d4;
       }
   href="#"
   onClick={[Function]}
@@ -87,7 +87,7 @@ exports[`Link renders Link with no href as a button 1`] = `
       {
         background: none;
         border: none;
-        color: #0078d7;
+        color: #0078d4;
         cursor: pointer;
         display: inline;
         font-size: inherit;
@@ -123,7 +123,7 @@ exports[`Link renders Link with no href as a button 1`] = `
         color: #004578;
       }
       &:focus {
-        color: #0078d7;
+        color: #0078d4;
       }
   onClick={[Function]}
 >
diff --git a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
index b789af9710a0f..b1e5e6fd2fb61 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Nav/__snapshots__/Nav.test.tsx.snap
@@ -141,10 +141,10 @@ exports[`Nav renders Nav correctly 1`] = `
                       color: #333333;
                     }
                     &:hover {
-                      color: #0078d7;
+                      color: #0078d4;
                     }
                     &:hover .ms-Button-icon {
-                      color: #0078d7;
+                      color: #0078d4;
                     }
                     &:active {
                       color: #000000;
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap
index 2efa30e7a0b54..225f07e583fc7 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Pivot/__snapshots__/Pivot.test.tsx.snap
@@ -77,10 +77,10 @@ exports[`Pivot renders Pivot correctly 1`] = `
               top: -2px;
             }
             &:hover {
-              color: #0078d7;
+              color: #0078d4;
             }
             &:hover .ms-Button-icon {
-              color: #0078d7;
+              color: #0078d4;
             }
             &:active {
               color: #000000;
@@ -179,10 +179,10 @@ exports[`Pivot renders Pivot correctly 1`] = `
               top: -2px;
             }
             &:hover {
-              color: #0078d7;
+              color: #0078d4;
             }
             &:hover .ms-Button-icon {
-              color: #0078d7;
+              color: #0078d4;
             }
             &:active {
               color: #000000;
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
index a440cb5d7a379..d6ceb51608a28 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/__snapshots__/SearchBox.test.tsx.snap
@@ -43,7 +43,7 @@ exports[`SearchBox renders SearchBox correctly 1`] = `
     className=
         ms-SearchBox-iconContainer
         {
-          color: #0078d7;
+          color: #0078d4;
           display: flex;
           flex-direction: column;
           flex-shrink: 0;
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
index 1b6d2f9f6eae5..5195dc0f5eaa6 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
@@ -104,7 +104,7 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
             width: calc(100% - 14px);
           }
           &::selection {
-            background-color: #0078d7;
+            background-color: #0078d4;
             color: #ffffff;
           }
           @media screen and (-ms-high-contrast: active){&::selection {
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
index 3a77aa7460b20..0a55445b0bccb 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/__snapshots__/SwatchColorPicker.test.tsx.snap
@@ -179,7 +179,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   border-radius: 100%;
                 }
                 &:hover {
-                  color: #0078d7;
+                  color: #0078d4;
                 }
                 &:active {
                   color: #000000;
@@ -372,7 +372,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   border-radius: 100%;
                 }
                 &:hover {
-                  color: #0078d7;
+                  color: #0078d4;
                 }
                 &:active {
                   color: #000000;
@@ -565,7 +565,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   border-radius: 100%;
                 }
                 &:hover {
-                  color: #0078d7;
+                  color: #0078d4;
                 }
                 &:active {
                   color: #000000;
@@ -758,7 +758,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   border-radius: 100%;
                 }
                 &:hover {
-                  color: #0078d7;
+                  color: #0078d4;
                 }
                 &:active {
                   color: #000000;
@@ -955,7 +955,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   border-radius: 100%;
                 }
                 &:hover {
-                  color: #0078d7;
+                  color: #0078d4;
                 }
                 &:active {
                   color: #000000;
@@ -1148,7 +1148,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   border-radius: 100%;
                 }
                 &:hover {
-                  color: #0078d7;
+                  color: #0078d4;
                 }
                 &:active {
                   color: #000000;
@@ -1341,7 +1341,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   border-radius: 100%;
                 }
                 &:hover {
-                  color: #0078d7;
+                  color: #0078d4;
                 }
                 &:active {
                   color: #000000;
@@ -1534,7 +1534,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   border-radius: 100%;
                 }
                 &:hover {
-                  color: #0078d7;
+                  color: #0078d4;
                 }
                 &:active {
                   color: #000000;
@@ -1731,7 +1731,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   border-radius: 100%;
                 }
                 &:hover {
-                  color: #0078d7;
+                  color: #0078d4;
                 }
                 &:active {
                   color: #000000;
@@ -1924,7 +1924,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   border-radius: 100%;
                 }
                 &:hover {
-                  color: #0078d7;
+                  color: #0078d4;
                 }
                 &:active {
                   color: #000000;
@@ -2117,7 +2117,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   border-radius: 100%;
                 }
                 &:hover {
-                  color: #0078d7;
+                  color: #0078d4;
                 }
                 &:active {
                   color: #000000;
@@ -2310,7 +2310,7 @@ exports[`SwatchColorPicker renders SwatchColorPicker correctly 1`] = `
                   border-radius: 100%;
                 }
                 &:hover {
-                  color: #0078d7;
+                  color: #0078d4;
                 }
                 &:active {
                   color: #000000;
diff --git a/packages/office-ui-fabric-react/src/components/Theme/defaultTheme.ts b/packages/office-ui-fabric-react/src/components/Theme/defaultTheme.ts
index 761d697edf3ab..4e696df67c9c9 100644
--- a/packages/office-ui-fabric-react/src/components/Theme/defaultTheme.ts
+++ b/packages/office-ui-fabric-react/src/components/Theme/defaultTheme.ts
@@ -2,7 +2,7 @@ export const defaultTheme = {
   themeDarker: '#004578',
   themeDark: '#005a9e',
   themeDarkAlt: '#106ebe',
-  themePrimary: '#0078d7',
+  themePrimary: '#0078d4',
   themeSecondary: '#2b88d8',
   themeTertiary: '#71afe5',
   themeLight: '#c7e0f4',
@@ -25,7 +25,7 @@ export const defaultTheme = {
   alertBackground: '#deecf9',
   black: '#000000',
   blackTranslucent40: 'rgba(0,0,0,.4)',
-  blue: '#0078d7',
+  blue: '#0078d4',
   blueDark: '#002050',
   blueLight: '#00bcf2',
   blueMid: '#00188f',
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
index 2f30f2ad6dd9c..8ceb7ec121975 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
@@ -284,7 +284,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
         // todo: could use more logic based on isInverted and isBg
         switch (color.toLowerCase()) {
           case 'black': return '#1f1f1f';
-          case 'blue': return '#0078d7';
+          case 'blue': return '#0078d4';
           case 'brown': return '#754d12';
           case 'gray':
           case 'grey': return isBg ? '#444' : '#ccc';
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
index be99ff5655af2..cbe3ffdcaa4d7 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeRulesStandard.ts
@@ -95,7 +95,7 @@ export function themeRulesStandardCreator() {
   });
 
   // set default colors for the base colors
-  slotRules[BaseSlots[BaseSlots.primaryColor]].color = getColorFromString('#0078d7');
+  slotRules[BaseSlots[BaseSlots.primaryColor]].color = getColorFromString('#0078d4');
   slotRules[BaseSlots[BaseSlots.backgroundColor]].color = getColorFromString('#fff');
   slotRules[BaseSlots[BaseSlots.foregroundColor]].color = getColorFromString('#333');
 
diff --git a/packages/styling/src/styles/DefaultPalette.ts b/packages/styling/src/styles/DefaultPalette.ts
index 1a7fd7802cf6a..f0f277e8f6e78 100644
--- a/packages/styling/src/styles/DefaultPalette.ts
+++ b/packages/styling/src/styles/DefaultPalette.ts
@@ -5,7 +5,7 @@ export const DefaultPalette: IPalette = {
   themeDarker: '#004578',
   themeDark: '#005a9e',
   themeDarkAlt: '#106ebe',
-  themePrimary: '#0078d7',
+  themePrimary: '#0078d4',
   themeSecondary: '#2b88d8',
   themeTertiary: '#71afe5',
   themeLight: '#c7e0f4',
@@ -24,7 +24,7 @@ export const DefaultPalette: IPalette = {
   neutralLight: '#eaeaea',
   neutralLighter: '#f4f4f4',
   neutralLighterAlt: '#f8f8f8',
-  accent: '#0078d7',
+  accent: '#0078d4',
   white: '#ffffff',
   whiteTranslucent40: 'rgba(255,255,255,.4)',
   yellow: '#ffb900',
@@ -42,7 +42,7 @@ export const DefaultPalette: IPalette = {
   purpleLight: '#b4a0ff',
   blueDark: '#002050',
   blueMid: '#00188f',
-  blue: '#0078d7',
+  blue: '#0078d4',
   blueLight: '#00bcf2',
   tealDark: '#004b50',
   teal: '#008272',
diff --git a/packages/variants/src/variants.ts b/packages/variants/src/variants.ts
index a645fdcbcee64..4116875e4488a 100644
--- a/packages/variants/src/variants.ts
+++ b/packages/variants/src/variants.ts
@@ -33,7 +33,7 @@ export function getSoftVariant(theme: IPartialTheme): ITheme {
     // themeDarker: '#004578',
     // themeDark: '#005a9e',
     // themeDarkAlt: '#106ebe',
-    // themePrimary: '#0078d7',
+    // themePrimary: '#0078d4',
     // themeSecondary: '#2b88d8',
     // themeTertiary: '#71afe5',
     // themeLight: '#c7e0f4',

From 9e7719f9f2ef616342d0b95873f79eec852665d7 Mon Sep 17 00:00:00 2001
From: Aditi Mandal <aditima@microsoft.com>
Date: Fri, 16 Mar 2018 12:12:15 -0700
Subject: [PATCH 1594/1641] DetailsList: scrollbars show up unnecessarily on
 IE11 (#4291)

* Fix issue 3608: DetailsList horizontal scroll

* DetailsList: scrollbars show up unnecessarily on IE11
* add change file
---
 ...tima-ie11-detailslist-scroll_2018-03-15-23-43.json | 11 +++++++++++
 .../src/components/DetailsList/DetailsList.scss       |  1 -
 2 files changed, 11 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/aditima-ie11-detailslist-scroll_2018-03-15-23-43.json

diff --git a/common/changes/office-ui-fabric-react/aditima-ie11-detailslist-scroll_2018-03-15-23-43.json b/common/changes/office-ui-fabric-react/aditima-ie11-detailslist-scroll_2018-03-15-23-43.json
new file mode 100644
index 0000000000000..a749b95cba370
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/aditima-ie11-detailslist-scroll_2018-03-15-23-43.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: scrollbars show up unnecessarily on IE11",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "aditima@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.scss b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.scss
index 549eafd42f27c..11cde63a353d5 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.scss
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.scss
@@ -12,7 +12,6 @@ $detailsList-text-color: $listTextColor;
 
 .focusZone {
   display: inline-block;
-  vertical-align: top;
   min-width: 100%;
   min-height: 1px;
 }

From 51fa6d3504561fe2ae84f1888785f47473dd0cc1 Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Fri, 16 Mar 2018 16:53:50 -0700
Subject: [PATCH 1595/1641] Variants: fix imports (#4301)

* fix imports

* changefile
---
 .../phkuo-fixVariantsImport_2018-03-16-22-09.json     | 11 +++++++++++
 packages/variants/src/variants.ts                     |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/@uifabric/variants/phkuo-fixVariantsImport_2018-03-16-22-09.json

diff --git a/common/changes/@uifabric/variants/phkuo-fixVariantsImport_2018-03-16-22-09.json b/common/changes/@uifabric/variants/phkuo-fixVariantsImport_2018-03-16-22-09.json
new file mode 100644
index 0000000000000..93545c0157da3
--- /dev/null
+++ b/common/changes/@uifabric/variants/phkuo-fixVariantsImport_2018-03-16-22-09.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/variants",
+      "comment": "fix imports so it works with amd",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/variants",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/variants/src/variants.ts b/packages/variants/src/variants.ts
index 4116875e4488a..cef156459c5d1 100644
--- a/packages/variants/src/variants.ts
+++ b/packages/variants/src/variants.ts
@@ -3,8 +3,8 @@ import {
   ISemanticColors,
   ITheme,
   IPartialTheme
-} from '@uifabric/styling';
-import { createTheme } from '@uifabric/styling';
+} from '@uifabric/styling/lib/index';
+import { createTheme } from '@uifabric/styling/lib/index';
 
 /* Variants
  * Variants are themes based off the current theme.

From 882c389076125182e5703ad5eb64ae178546f6c4 Mon Sep 17 00:00:00 2001
From: Mark Polak <mark@thedutchies.com>
Date: Sat, 17 Mar 2018 20:09:49 +0100
Subject: [PATCH 1596/1641] Retire @autobind (#4304)

* Retire autobind

* Add  change files
---
 .../fabric-website/src/components/App/App.tsx |  4 +-
 apps/todo-app/src/components/TodoForm.tsx     |  5 +-
 apps/todo-app/src/components/TodoTabs.tsx     |  5 +-
 .../retire-autobind_2018-03-17-15-50.json     | 11 +++
 .../retire-autobind_2018-03-17-15-50.json     | 11 +++
 .../retire-autobind_2018-03-17-15-50.json     | 11 +++
 .../retire-autobind_2018-03-17-15-50.json     | 11 +++
 .../retire-autobind_2018-03-17-15-50.json     | 11 +++
 .../retire-autobind_2018-03-17-15-50.json     | 11 +++
 ghdocs/BESTPRACTICES.md                       | 30 ++++++--
 .../src/components/App/App.tsx                | 10 +--
 .../components/CommandBar/CommandBar.base.tsx | 13 +---
 .../ExtendedPicker/BaseExtendedPicker.tsx     | 28 +++----
 .../FloatingPicker/BaseFloatingPicker.tsx     | 29 +++----
 .../experiments/src/components/Form/Form.tsx  | 18 ++---
 .../Form/inputs/checkbox/FormCheckBox.tsx     |  8 +-
 .../Form/inputs/datePicker/FormDatePicker.tsx |  7 +-
 .../Form/inputs/dropdown/FormDropdown.tsx     |  8 +-
 .../Form/inputs/textInput/FormTextInput.tsx   |  8 +-
 .../components/KeytipLayer/KeytipLayer.tsx    | 10 +--
 .../components/LayoutGroup/LayoutGroup.tsx    |  4 +-
 .../BaseSelectedItemsList.tsx                 | 30 +++-----
 .../SelectedPeopleList/Items/EditingItem.tsx  | 21 ++---
 .../Items/SelectedItemWithContextMenu.tsx     |  8 +-
 .../SelectedPeopleList/SelectedPeopleList.tsx | 18 ++---
 .../experiments/src/components/Tile/Tile.tsx  |  5 +-
 .../src/components/TilesList/TilesList.tsx    | 21 ++---
 .../VirtualizedList/VirtualizedList.tsx       |  5 +-
 .../utilities/scrolling/ScrollContainer.tsx   | 11 +--
 .../components/ActivityItem/ActivityItem.tsx  | 17 ++---
 .../src/components/Autofill/Autofill.tsx      | 22 ++----
 .../src/components/Breadcrumb/Breadcrumb.tsx  | 13 +---
 .../src/components/Calendar/Calendar.tsx      | 28 ++-----
 .../src/components/Calendar/CalendarDay.tsx   | 30 +++-----
 .../src/components/Calendar/CalendarMonth.tsx | 25 ++----
 .../Callout/CalloutContent.base.tsx           | 10 +--
 .../src/components/Checkbox/Checkbox.tsx      | 13 +---
 .../src/components/Coachmark/Coachmark.tsx    |  8 +-
 .../PositioningContainer.tsx                  | 10 +--
 .../components/ColorPicker/ColorPicker.tsx    | 16 ++--
 .../components/ColorPicker/ColorRectangle.tsx | 10 +--
 .../components/ColorPicker/ColorSlider.tsx    | 10 +--
 .../src/components/ComboBox/ComboBox.tsx      | 76 +++++++------------
 .../ComboBox/VirtualizedComboBox.tsx          |  8 +-
 .../src/components/CommandBar/CommandBar.tsx  |  7 +-
 .../ContextualMenu/ContextualMenu.tsx         | 22 ++----
 .../src/components/DatePicker/DatePicker.tsx  | 37 +++------
 .../components/DetailsList/DetailsHeader.tsx  | 26 ++-----
 .../components/DetailsList/DetailsList.tsx    | 12 +--
 .../src/components/DetailsList/DetailsRow.tsx |  4 +-
 .../components/DocumentCard/DocumentCard.tsx  | 10 +--
 .../DocumentCard/DocumentCardPreview.tsx      |  4 +-
 .../DocumentCard/DocumentCardTitle.tsx        |  4 +-
 .../src/components/Dropdown/Dropdown.tsx      | 58 +++++---------
 .../FocusTrapZone/FocusTrapZone.tsx           |  4 +-
 .../src/components/FocusZone/FocusZone.tsx    | 10 +--
 .../components/GroupedList/GroupHeader.tsx    | 10 +--
 .../components/GroupedList/GroupShowAll.tsx   |  4 +-
 .../components/GroupedList/GroupedList.tsx    | 20 ++---
 .../GroupedList/GroupedListSection.tsx        | 21 ++---
 .../components/HoverCard/ExpandingCard.tsx    | 16 ++--
 .../src/components/HoverCard/HoverCard.tsx    | 19 ++---
 .../src/components/Image/Image.base.tsx       |  7 +-
 .../src/components/Link/Link.base.tsx         |  4 +-
 .../src/components/List/List.tsx              |  6 +-
 .../MarqueeSelection/MarqueeSelection.tsx     | 10 +--
 .../src/components/MessageBar/MessageBar.tsx  |  4 +-
 .../src/components/Nav/Nav.base.tsx           |  7 +-
 .../components/OverflowSet/OverflowSet.tsx    |  7 +-
 .../src/components/Panel/Panel.tsx            | 24 ++----
 .../src/components/Persona/Persona.base.tsx   |  4 +-
 .../src/components/Persona/PersonaCoin.tsx    | 10 +--
 .../components/Persona/PersonaPresence.tsx    |  8 +-
 .../src/components/Pivot/Pivot.tsx            | 16 ++--
 .../src/components/Popup/Popup.tsx            |  6 +-
 .../ScrollablePane/ScrollablePane.base.tsx    | 28 +++----
 .../components/SearchBox/SearchBox.base.tsx   | 16 ++--
 .../src/components/Slider/Slider.tsx          | 16 ++--
 .../src/components/SpinButton/SpinButton.tsx  | 32 +++-----
 .../src/components/Sticky/Sticky.tsx          |  9 +--
 .../ColorPickerGridCell.base.tsx              | 23 +++---
 .../SwatchColorPicker.base.tsx                | 32 +++-----
 .../src/components/Theme/ThemePage.tsx        |  4 +-
 .../ThemeGenerator/ThemeGeneratorPage.tsx     | 38 +++-------
 .../src/components/Toggle/Toggle.tsx          |  6 +-
 .../src/components/Tooltip/TooltipHost.tsx    | 20 ++---
 .../src/components/pickers/BasePicker.tsx     | 46 ++++-------
 .../SelectedItemWithMenu.tsx                  |  8 +-
 .../pickers/Suggestions/Suggestions.tsx       | 26 +++----
 .../Suggestions/SuggestionsController.ts      | 12 +--
 .../src/utilities/grid/GridCell.tsx           | 16 ++--
 .../src/utilities/selection/SelectionZone.tsx | 31 +++-----
 packages/utilities/src/autobind.ts            |  1 +
 93 files changed, 519 insertions(+), 914 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/retire-autobind_2018-03-17-15-50.json
 create mode 100644 common/changes/@uifabric/experiments/retire-autobind_2018-03-17-15-50.json
 create mode 100644 common/changes/@uifabric/fabric-website/retire-autobind_2018-03-17-15-50.json
 create mode 100644 common/changes/@uifabric/utilities/retire-autobind_2018-03-17-15-50.json
 create mode 100644 common/changes/office-ui-fabric-react/retire-autobind_2018-03-17-15-50.json
 create mode 100644 common/changes/todo-app/retire-autobind_2018-03-17-15-50.json

diff --git a/apps/fabric-website/src/components/App/App.tsx b/apps/fabric-website/src/components/App/App.tsx
index e8f2ddcc33876..38b5c98c5e03a 100644
--- a/apps/fabric-website/src/components/App/App.tsx
+++ b/apps/fabric-website/src/components/App/App.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import './App.scss';
 import { AppState } from './AppState';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import AttachedScrollUtility from '../../utilities/AttachedScrollUtility';
 import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
 import { Nav } from '../Nav/Nav';
@@ -75,8 +74,7 @@ export class App extends React.Component<IAppProps, any> {
     );
   }
 
-  @autobind
-  private _handleNavPositioning() {
+  private _handleNavPositioning = () => {
     let { isAttached, navHeight } = this.state;
     this._appContentRect = this._appContent && this._appContent.getBoundingClientRect();
     const viewPortHeight = window.innerHeight;
diff --git a/apps/todo-app/src/components/TodoForm.tsx b/apps/todo-app/src/components/TodoForm.tsx
index f2c71d9439c07..c381a5fd8980a 100644
--- a/apps/todo-app/src/components/TodoForm.tsx
+++ b/apps/todo-app/src/components/TodoForm.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { autobind, BaseComponent, IBaseProps, createRef } from 'office-ui-fabric-react/lib/Utilities';
+import { BaseComponent, IBaseProps, createRef } from 'office-ui-fabric-react/lib/Utilities';
 import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
 import { TextField, ITextField } from 'office-ui-fabric-react/lib/TextField';
 import * as stylesImport from './Todo.scss';
@@ -78,8 +78,7 @@ export default class TodoForm extends BaseComponent<ITodoFormProps, ITodoFormSta
     );
   }
 
-  @autobind
-  private _onSubmit(event: React.FormEvent<HTMLElement>): void {
+  private _onSubmit = (event: React.FormEvent<HTMLElement>): void => {
     event.preventDefault();
 
     const { value: textField } = this._textField;
diff --git a/apps/todo-app/src/components/TodoTabs.tsx b/apps/todo-app/src/components/TodoTabs.tsx
index 1905304763535..62ba76a273e82 100644
--- a/apps/todo-app/src/components/TodoTabs.tsx
+++ b/apps/todo-app/src/components/TodoTabs.tsx
@@ -7,7 +7,7 @@ import {
 } from 'office-ui-fabric-react/lib/Pivot';
 import { FocusZone, FocusZoneDirection } from 'office-ui-fabric-react/lib/FocusZone';
 import { List } from 'office-ui-fabric-react/lib/List';
-import { KeyCodes, autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { KeyCodes } from 'office-ui-fabric-react/lib/Utilities';
 import TodoItem from './TodoItem';
 import { ITodoItem, ITodoItemProps, ITodoTabsProps } from '../types/index';
 
@@ -73,8 +73,7 @@ export default class TodoTabs extends React.Component<ITodoTabsProps, {}> {
     );
   }
 
-  @autobind
-  private _isInnerZoneKeystroke(ev: React.KeyboardEvent<HTMLElement>): boolean {
+  private _isInnerZoneKeystroke = (ev: React.KeyboardEvent<HTMLElement>): boolean => {
     return ev.which === KeyCodes.right;
   }
 
diff --git a/common/changes/@uifabric/example-app-base/retire-autobind_2018-03-17-15-50.json b/common/changes/@uifabric/example-app-base/retire-autobind_2018-03-17-15-50.json
new file mode 100644
index 0000000000000..16c3ecf1205f3
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/retire-autobind_2018-03-17-15-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Use arrow function properties instead of @autobind",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/retire-autobind_2018-03-17-15-50.json b/common/changes/@uifabric/experiments/retire-autobind_2018-03-17-15-50.json
new file mode 100644
index 0000000000000..8913998ae14af
--- /dev/null
+++ b/common/changes/@uifabric/experiments/retire-autobind_2018-03-17-15-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Use arrow function properties instead of @autobind",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/retire-autobind_2018-03-17-15-50.json b/common/changes/@uifabric/fabric-website/retire-autobind_2018-03-17-15-50.json
new file mode 100644
index 0000000000000..ee8ddbad80039
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/retire-autobind_2018-03-17-15-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Use arrow function properties instead of @autobind",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/retire-autobind_2018-03-17-15-50.json b/common/changes/@uifabric/utilities/retire-autobind_2018-03-17-15-50.json
new file mode 100644
index 0000000000000..6ee10a304e094
--- /dev/null
+++ b/common/changes/@uifabric/utilities/retire-autobind_2018-03-17-15-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Use arrow function properties instead of @autobind",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/retire-autobind_2018-03-17-15-50.json b/common/changes/office-ui-fabric-react/retire-autobind_2018-03-17-15-50.json
new file mode 100644
index 0000000000000..071c5ddd6dee2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/retire-autobind_2018-03-17-15-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Use arrow function properties instead of @autobind",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/common/changes/todo-app/retire-autobind_2018-03-17-15-50.json b/common/changes/todo-app/retire-autobind_2018-03-17-15-50.json
new file mode 100644
index 0000000000000..e00f2578a18d7
--- /dev/null
+++ b/common/changes/todo-app/retire-autobind_2018-03-17-15-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "todo-app",
+      "comment": "Use arrow function properties instead of @autobind",
+      "type": "patch"
+    }
+  ],
+  "packageName": "todo-app",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/ghdocs/BESTPRACTICES.md b/ghdocs/BESTPRACTICES.md
index 9b8481f5b30cc..5991e007a5e69 100644
--- a/ghdocs/BESTPRACTICES.md
+++ b/ghdocs/BESTPRACTICES.md
@@ -123,21 +123,38 @@ BAD:
 GOOD:
 `onRenderItem: IRenderFunction<IItemProps>`
 
-## Use @autobind. Avoid ALL binds in templates
+## Use arrow function properties to avoid ALL binds in templates
 
-The autobind decorator simplifies making event callbacks "bound" to the instance. It's easy to use:
+When we use bind in a template, it means that the function is recreated every time, which is an anti-pattern.
 
+BAD:
 ```typescript
 class Foo {
 
-  @autobind
   public _onClick(ev: React.MouseEvent) {
   }
 
+  render() {
+    <button onClick={this._onClick.bind(this)}>Click me</button
+  }
+
 }
 ```
 
-When we use bind in a template, it means that the function is recreated every time, which is an anti-pattern.
+Instead we can use an arrow function property as it will always be bound to the component.
+
+GOOD:
+```typescript
+class Foo {
+
+  public _onClick = (ev: React.MouseEvent) => {
+  }
+
+  render() {
+    <button onClick={this._onClick}>Click me</button
+  }
+}
+```
 
 ## For gathering refs, avoid string refs, use resolve functions
 
@@ -189,7 +206,7 @@ class Foo extends BaseComponent<...> {
     // Set the reference by passing the reference object as the ref prop
     return <button ref={ _root } onClick={this._onClick} />;
   }
-  
+
   private _onClick() {
     // Access the reference through the .value property on the reference object
     this._root.value.focus();
@@ -270,8 +287,7 @@ class ItemComponent extends React.Component<...> {
     );
   }
 
-  @autobind
-  _onClick(ev: MouseEvent) {
+  _onClick = (ev: MouseEvent) => {
 
   }
 }
diff --git a/packages/example-app-base/src/components/App/App.tsx b/packages/example-app-base/src/components/App/App.tsx
index 2f11e46d48f18..fa0b274eb093e 100644
--- a/packages/example-app-base/src/components/App/App.tsx
+++ b/packages/example-app-base/src/components/App/App.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import {
   css
 } from 'office-ui-fabric-react/lib/Utilities';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 import { Nav } from 'office-ui-fabric-react/lib/Nav';
@@ -108,19 +107,16 @@ export class App extends React.Component<IAppProps, IAppState> {
     );
   }
 
-  @autobind
-  private _onIsMenuVisibleChanged(isMenuVisible: boolean): void {
+  private _onIsMenuVisibleChanged = (isMenuVisible: boolean): void => {
     this.setState({ isMenuVisible });
   }
 
-  @autobind
-  private _onLinkClick(): void {
+  private _onLinkClick = (): void => {
     this.setState({ isMenuVisible: false });
   }
 
-  @autobind
   // tslint:disable-next-line:no-any
-  private _onRenderLink(link: INavLink): any {
+  private _onRenderLink = (link: INavLink): any => {
     return (
       [
         <span key={ 1 } className='Nav-linkText'>{ link.name }</span>,
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.base.tsx b/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
index ebebfacc0fa62..ed460e5a82c22 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
+++ b/packages/experiments/src/components/CommandBar/CommandBar.base.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import {
   BaseComponent,
   css,
-  autobind,
   customizable
 } from 'office-ui-fabric-react/lib/Utilities';
 import {
@@ -157,8 +156,7 @@ export class CommandBarBase extends BaseComponent<ICommandBarProps, {}> implemen
     return [primaryKey, farKey, overflowKey].join(' ');
   }
 
-  @autobind
-  private _onReduceData(data: ICommandBarData): ICommandBarData | undefined {
+  private _onReduceData = (data: ICommandBarData): ICommandBarData | undefined => {
     const { endAligned, onDataReduced } = this.props;
     let { primaryItems, overflowItems, cacheKey, farItems } = data;
 
@@ -182,8 +180,7 @@ export class CommandBarBase extends BaseComponent<ICommandBarProps, {}> implemen
     return undefined;
   }
 
-  @autobind
-  private _onGrowData(data: ICommandBarData): ICommandBarData | undefined {
+  private _onGrowData = (data: ICommandBarData): ICommandBarData | undefined => {
     const { endAligned, onDataGrown } = this.props;
     let { primaryItems, overflowItems, cacheKey, minimumOverflowItems, farItems } = data;
     const movedItem = overflowItems[0];
@@ -207,8 +204,7 @@ export class CommandBarBase extends BaseComponent<ICommandBarProps, {}> implemen
     return undefined;
   }
 
-  @autobind
-  private _onRenderItems(item: ICommandBarItemProps): JSX.Element | React.ReactNode {
+  private _onRenderItems = (item: ICommandBarItemProps): JSX.Element | React.ReactNode => {
     let { buttonStyles } = this.props;
 
     if (item.onRender) {
@@ -235,8 +231,7 @@ export class CommandBarBase extends BaseComponent<ICommandBarProps, {}> implemen
     return this._onRenderButton(commandButtonProps);
   }
 
-  @autobind
-  private _onRenderButton(props: ICommandBarItemProps): JSX.Element {
+  private _onRenderButton = (props: ICommandBarItemProps): JSX.Element => {
     // tslint:disable-next-line:no-any
     return <CommandBarButton { ...props as any } />;
   }
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
index 8268e739d052a..a58c0b6ebdda6 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import {
   BaseComponent,
   KeyCodes,
-  autobind,
   css,
 } from '../../Utilities';
 import {
@@ -133,8 +132,7 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
     );
   }
 
-  @autobind
-  protected onSelectionChange(): void {
+  protected onSelectionChange = (): void => {
     this.forceUpdate();
   }
 
@@ -179,13 +177,11 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
     }
   }
 
-  @autobind
-  protected onInputChange(value: string): void {
+  protected onInputChange = (value: string): void => {
     this.floatingPicker.onQueryStringChanged(value);
   }
 
-  @autobind
-  protected onInputFocus(ev: React.FocusEvent<HTMLInputElement | Autofill>): void {
+  protected onInputFocus = (ev: React.FocusEvent<HTMLInputElement | Autofill>): void => {
     this.selectedItemsList.unselectAll();
     this.floatingPicker.showPicker();
 
@@ -196,8 +192,7 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
 
   // This is protected because we may expect the backspace key to work differently in a different kind of picker.
   // This lets the subclass override it and provide it's own onBackspace. For an example see the BasePickerListBelow
-  @autobind
-  protected onBackspace(ev: React.KeyboardEvent<HTMLElement>): void {
+  protected onBackspace = (ev: React.KeyboardEvent<HTMLElement>): void => {
     if (ev.which !== KeyCodes.backspace) {
       return;
     }
@@ -209,14 +204,12 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
     }
   }
 
-  @autobind
-  protected onCopy(ev: React.ClipboardEvent<HTMLElement>): void {
+  protected onCopy = (ev: React.ClipboardEvent<HTMLElement>): void => {
     // Pass it down into the selected items list
     this.selectedItemsList.onCopy(ev);
   }
 
-  @autobind
-  protected onPaste(ev: React.ClipboardEvent<Autofill | HTMLInputElement>): void {
+  protected onPaste = (ev: React.ClipboardEvent<Autofill | HTMLInputElement>): void => {
     if (this.props.onPaste) {
       let inputText = ev.clipboardData.getData('Text');
       ev.preventDefault();
@@ -224,8 +217,7 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
     }
   }
 
-  @autobind
-  protected _isFocusZoneInnerKeystroke(ev: React.KeyboardEvent<HTMLElement>): boolean {
+  protected _isFocusZoneInnerKeystroke = (ev: React.KeyboardEvent<HTMLElement>): boolean => {
     // If suggestions are shown let up/down keys control them, otherwise allow them through to control the focusZone.
     if (this.floatingPicker.isSuggestionsShown) {
       switch (ev.which) {
@@ -243,8 +235,7 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
     return false;
   }
 
-  @autobind
-  protected _onSuggestionSelected(item: T): void {
+  protected _onSuggestionSelected = (item: T): void => {
     this.selectedItemsList.addItems([item]);
     if (this.props.onItemSelected) {
       this.props.onItemSelected(item);
@@ -255,8 +246,7 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
     this.focus();
   }
 
-  @autobind
-  protected _onSelectedItemsChanged(): void {
+  protected _onSelectedItemsChanged = (): void => {
     this.focus();
   }
 }
\ No newline at end of file
diff --git a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
index e7457593e83e8..41f131f8399a9 100644
--- a/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
+++ b/packages/experiments/src/components/FloatingPicker/BaseFloatingPicker.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import {
   BaseComponent,
   KeyCodes,
-  autobind,
   css,
   getRTL,
   createRef
@@ -127,8 +126,7 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
     this._unbindFromInputElement();
   }
 
-  @autobind
-  public dismissSuggestions(): void {
+  public dismissSuggestions = (): void => {
     this.setState({ suggestionsVisible: false });
   }
 
@@ -138,8 +136,7 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
     }
   }
 
-  @autobind
-  public refocusSuggestions(keyCode: KeyCodes): void {
+  public refocusSuggestions = (keyCode: KeyCodes): void => {
     if (this.suggestionStore.suggestions && this.suggestionStore.suggestions.length > 0) {
       if (keyCode === KeyCodes.up) {
         this.suggestionStore.setSelectedSuggestion(
@@ -320,29 +317,26 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
     }
   }
 
-  @autobind
-  protected onSuggestionClick(
+  protected onSuggestionClick = (
     ev: React.MouseEvent<HTMLElement>,
     item: T,
     index: number
-  ): void {
+  ): void => {
     this.onChange(item);
   }
 
-  @autobind
-  protected onSuggestionRemove(
+  protected onSuggestionRemove = (
     ev: React.MouseEvent<HTMLElement>,
     item: T,
     index: number
-  ): void {
+  ): void => {
     if (this.props.onRemoveSuggestion) {
       (this.props.onRemoveSuggestion as ((item: T) => void))(item);
     }
     this.suggestionStore.removeSuggestion(index);
   }
 
-  @autobind
-  protected onKeyDown(ev: MouseEvent): void {
+  protected onKeyDown = (ev: MouseEvent): void => {
     if (!this.state.suggestionsVisible ||
       (this.props.inputElement &&
         !(this.props.inputElement as HTMLElement).contains(ev.target as HTMLElement))) {
@@ -438,8 +432,7 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
     }
   }
 
-  @autobind
-  protected onGetMoreResults(): void {
+  protected onGetMoreResults = (): void => {
     this.setState(
       {
         isSearching: true
@@ -487,8 +480,7 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
     }
   }
 
-  @autobind
-  private _onValidateInput(): void {
+  private _onValidateInput = (): void => {
     if (
       this.props.onValidateInput &&
       this.props.createGenericItem
@@ -505,8 +497,7 @@ export class BaseFloatingPicker<T, P extends IBaseFloatingPickerProps<T>> extend
     }
   }
 
-  @autobind
-  private _showForceResolve(): boolean {
+  private _showForceResolve = (): boolean => {
     return this.props.showForceResolve ? this.props.showForceResolve() : false;
   }
 
diff --git a/packages/experiments/src/components/Form/Form.tsx b/packages/experiments/src/components/Form/Form.tsx
index ea9b3c8f7badc..21dc6a6ec8995 100644
--- a/packages/experiments/src/components/Form/Form.tsx
+++ b/packages/experiments/src/components/Form/Form.tsx
@@ -9,7 +9,6 @@ import { GenericFormInput } from './FormBaseInput';
 
 // Utilities
 import {
-  autobind,
   BaseComponent,
   getNativeProps,
   divProperties
@@ -106,7 +105,7 @@ export class Form extends BaseComponent<IFormProps, IFormState> {
     let nativeProps = getNativeProps(this.props, divProperties);
     return (
       <form
-        {...nativeProps}
+        { ...nativeProps }
         onSubmit={ this._onSubmit }
       >
         { this.props.children }
@@ -177,8 +176,7 @@ export class Form extends BaseComponent<IFormProps, IFormState> {
    * When the form is submitted. This will validate the form and call the appropriate submit callback
    * @param event The form event
    */
-  @autobind
-  private _onSubmit(event: React.FormEvent<HTMLElement>): void {
+  private _onSubmit = (event: React.FormEvent<HTMLElement>): void => {
     event.preventDefault();
     if (this._pristine) {
       this._pristine = false;
@@ -201,8 +199,7 @@ export class Form extends BaseComponent<IFormProps, IFormState> {
    * Register an input with the form
    * @param input The input to register
    */
-  @autobind
-  private _mountInput(input: GenericFormInput): void {
+  private _mountInput = (input: GenericFormInput): void => {
     if (this._mountedInputs.indexOf(input) === -1) {
       this._mountedInputs.push(input);
       this.setState((prevState: IFormState) => {
@@ -212,8 +209,7 @@ export class Form extends BaseComponent<IFormProps, IFormState> {
     }
   }
 
-  @autobind
-  private _submitValue(input: GenericFormInput): void {
+  private _submitValue = (input: GenericFormInput): void => {
     let validationResult: IFormValidationResult = this._validateComponent(input);
     this.setState((prevState: IFormState) => {
       prevState.validationResults[input.props.inputKey] = validationResult;
@@ -231,8 +227,7 @@ export class Form extends BaseComponent<IFormProps, IFormState> {
    * Unregister an input with the form
    * @param input The input to unregister
    */
-  @autobind
-  private _unmountInput(input: GenericFormInput): void {
+  private _unmountInput = (input: GenericFormInput): void => {
     let currentIndex: number = this._mountedInputs.indexOf(input);
     if (currentIndex > -1) {
       this._mountedInputs.splice(currentIndex, 1);
@@ -243,8 +238,7 @@ export class Form extends BaseComponent<IFormProps, IFormState> {
     }
   }
 
-  @autobind
-  private _isFormValid(validationResults: { [key: string]: IFormValidationResult } = this.state.validationResults): boolean {
+  private _isFormValid = (validationResults: { [key: string]: IFormValidationResult } = this.state.validationResults): boolean => {
     for (let key in validationResults) {
       if (!validationResults[key].isValid) {
         return false;
diff --git a/packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.tsx b/packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.tsx
index 8fda99d34b8ee..d79e9c750c69b 100644
--- a/packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.tsx
+++ b/packages/experiments/src/components/Form/inputs/checkbox/FormCheckBox.tsx
@@ -6,9 +6,6 @@ import { IFormCheckBoxProps } from './FormCheckBox.types';
 import { FormBaseInput, IFormBaseInputState } from '../../FormBaseInput';
 import { IFormContext } from '../../Form';
 
-// Utilities
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
-
 /**
  * Checkbox input for the Form. Displays a boolean value as a checkbox
  */
@@ -31,7 +28,7 @@ export class FormCheckBox extends FormBaseInput<boolean, IFormCheckBoxProps, IFo
   public render(): JSX.Element {
     return (
       <Checkbox
-        {...this.props.checkboxProps}
+        { ...this.props.checkboxProps }
         key={ this.props.inputKey }
         onChange={ this._onChange }
         checked={ this.state.currentValue }
@@ -39,8 +36,7 @@ export class FormCheckBox extends FormBaseInput<boolean, IFormCheckBoxProps, IFo
     );
   }
 
-  @autobind
-  private _onChange(event: React.FormEvent<HTMLElement>, isChecked: boolean): void {
+  private _onChange = (event: React.FormEvent<HTMLElement>, isChecked: boolean): void => {
     this.setValue(isChecked);
   }
 
diff --git a/packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.tsx b/packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.tsx
index a130f680a3e59..453bb389739d1 100644
--- a/packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.tsx
+++ b/packages/experiments/src/components/Form/inputs/datePicker/FormDatePicker.tsx
@@ -13,7 +13,7 @@ import { FormBaseInput, IFormBaseInputState } from '../../FormBaseInput';
 import { IFormContext } from '../../Form';
 
 // Utilities
-import { autobind, css } from 'office-ui-fabric-react/lib/Utilities';
+import { css } from 'office-ui-fabric-react/lib/Utilities';
 
 /**
  * DatePicker input for Form
@@ -38,7 +38,7 @@ export class FormDatePicker extends FormBaseInput<Date, IFormDatePickerProps, IF
     return (
       <div className={ css('form-date-picker', DatePickerStyles.formDatePicker) }>
         <DatePicker
-          {...this.props.datePickerProps}
+          { ...this.props.datePickerProps }
           // These props cannot be overridden
           key={ this.props.inputKey }
           value={ this.state.currentValue }
@@ -58,8 +58,7 @@ export class FormDatePicker extends FormBaseInput<Date, IFormDatePickerProps, IF
     );
   }
 
-  @autobind
-  private _onDateChanged(date: Date): void {
+  private _onDateChanged = (date: Date): void => {
     this.setValue(date);
   }
 
diff --git a/packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.tsx b/packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.tsx
index 9d18a9edc5943..918f7b0984578 100644
--- a/packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.tsx
+++ b/packages/experiments/src/components/Form/inputs/dropdown/FormDropdown.tsx
@@ -6,9 +6,6 @@ import { Dropdown, IDropdownOption, IDropdownProps } from 'office-ui-fabric-reac
 import { FormBaseInput, IFormBaseInputState } from '../../FormBaseInput';
 import { IFormContext } from '../../Form';
 
-// Utilities
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
-
 /**
  * Dropdown input for Form
  */
@@ -35,7 +32,7 @@ export class FormDropdown extends FormBaseInput<number | string, IFormDropdownPr
   public render(): JSX.Element {
     return (
       <Dropdown
-        {...this.props.dropdownProps}
+        { ...this.props.dropdownProps }
 
         // These props cannot be overridden
         key={ this.props.inputKey }
@@ -45,8 +42,7 @@ export class FormDropdown extends FormBaseInput<number | string, IFormDropdownPr
     );
   }
 
-  @autobind
-  private _onChanged(option: IDropdownOption): void {
+  private _onChanged = (option: IDropdownOption): void => {
     this.setValue(option.key);
   }
 
diff --git a/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.tsx b/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.tsx
index f9230e3cab7bf..c237493ea88da 100644
--- a/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.tsx
+++ b/packages/experiments/src/components/Form/inputs/textInput/FormTextInput.tsx
@@ -6,9 +6,6 @@ import { FormBaseInput, IFormBaseInputState } from '../../FormBaseInput';
 import { IFormContext } from '../../Form';
 import { TextField, ITextFieldProps } from 'office-ui-fabric-react/lib/TextField';
 
-// Utilities
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
-
 /**
  * TextBox input for the Form.
  */
@@ -38,7 +35,7 @@ export class FormTextInput extends FormBaseInput<string, IFormTextInputProps, IF
   public render(): JSX.Element {
     return (
       <TextField
-        {...this.props.textFieldProps}
+        { ...this.props.textFieldProps }
         key={ this.props.inputKey }
         value={ this.state.currentValue }
         onBeforeChange={ this._onChange }
@@ -47,8 +44,7 @@ export class FormTextInput extends FormBaseInput<string, IFormTextInputProps, IF
     );
   }
 
-  @autobind
-  private _onChange(value: string): void {
+  private _onChange = (value: string): void => {
     this.setValue(value);
   }
 
diff --git a/packages/experiments/src/components/KeytipLayer/KeytipLayer.tsx b/packages/experiments/src/components/KeytipLayer/KeytipLayer.tsx
index 806b112832552..19a1f657d123d 100644
--- a/packages/experiments/src/components/KeytipLayer/KeytipLayer.tsx
+++ b/packages/experiments/src/components/KeytipLayer/KeytipLayer.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import { IKeytipLayerProps } from './KeytipLayer.types';
 import { Keytip, IKeytipProps, KeytipTransitionModifier } from '../Keytip';
 import {
-  autobind,
   BaseComponent
 } from '../../Utilities';
 import { Layer } from 'office-ui-fabric-react/lib/Layer';
@@ -191,16 +190,14 @@ export class KeytipLayer extends BaseComponent<IKeytipLayerProps, IKeytipLayerSt
     this.setState({ inKeytipMode: true });
   }
 
-  @autobind
-  private _onDismiss(ev?: React.MouseEvent<HTMLElement>): void {
+  private _onDismiss = (ev?: React.MouseEvent<HTMLElement>): void => {
     // if we are in keytip mode, then exit keytip mode
     if (this.state.inKeytipMode) {
       this._keytipManager.exitKeytipMode();
     }
   }
 
-  @autobind
-  private _onKeyDown(ev: React.KeyboardEvent<HTMLElement>): void {
+  private _onKeyDown = (ev: React.KeyboardEvent<HTMLElement>): void => {
     switch (ev.which) {
       case KeyCodes.alt:
         // ALT puts focus in the browser bar, so it should not be used as a key for keytips.
@@ -240,8 +237,7 @@ export class KeytipLayer extends BaseComponent<IKeytipLayerProps, IKeytipLayerSt
     return modifierKeys.length ? modifierKeys : undefined;
   }
 
-  @autobind
-  private _onKeyPress(ev: React.KeyboardEvent<HTMLElement>): void {
+  private _onKeyPress = (ev: React.KeyboardEvent<HTMLElement>): void => {
     // Call processInput
     this._keytipManager.processInput(ev.key);
   }
diff --git a/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx b/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx
index f2ffe14b5ee9a..8c68604746cd3 100644
--- a/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx
+++ b/packages/experiments/src/components/LayoutGroup/LayoutGroup.tsx
@@ -3,7 +3,6 @@ import * as React from 'react';
 import { ILayoutGroupProps } from './LayoutGroup.types';
 import { IRawStyle, mergeStyles } from 'office-ui-fabric-react/lib/Styling';
 import {
-  autobind,
   getNativeProps,
   divProperties
 } from 'office-ui-fabric-react/lib/Utilities';
@@ -76,8 +75,7 @@ export class LayoutGroup extends React.Component<ILayoutGroupProps, {}> {
     );
   }
 
-  @autobind
-  private _getJustify(justify: string | undefined): string {
+  private _getJustify = (justify: string | undefined): string => {
     if (justify === 'end') {
       return 'flex-end';
     } else if (justify === 'center') {
diff --git a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx
index b288ae1690b02..f3116a45f136e 100644
--- a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.tsx
@@ -1,8 +1,7 @@
 import * as React from 'react';
 import {
   BaseComponent,
-  KeyCodes,
-  autobind,
+  KeyCodes
 } from '../../Utilities';
 import { Selection } from 'office-ui-fabric-react/lib/Selection';
 
@@ -44,8 +43,7 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
     return this.state.items;
   }
 
-  @autobind
-  public addItems(items: T[]): void {
+  public addItems = (items: T[]): void => {
     // tslint:disable-next-line:no-any
     let processedItems: T[] | PromiseLike<T[]> = this.props.onItemSelected ? (this.props.onItemSelected as any)(items) : items;
 
@@ -64,8 +62,7 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
     this.setState({ suggestedDisplayValue: '' });
   }
 
-  @autobind
-  public removeItemAt(index: number): void {
+  public removeItemAt = (index: number): void => {
     let { items } = this.state;
     // tslint:disable-next-line:no-any
     if (index > -1) {
@@ -74,8 +71,7 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
     }
   }
 
-  @autobind
-  public onCopy(ev: React.ClipboardEvent<HTMLElement>): void {
+  public onCopy = (ev: React.ClipboardEvent<HTMLElement>): void => {
     if (this.props.onCopyItems && this.selection.getSelectedCount() > 0) {
       let selectedItems: T[] = this.selection.getSelection() as T[];
       this.copyItems(selectedItems);
@@ -113,8 +109,7 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
     return this.renderItems();
   }
 
-  @autobind
-  protected renderItems(): JSX.Element[] {
+  protected renderItems = (): JSX.Element[] => {
     let { removeButtonAriaLabel } = this.props;
     let onRenderItem = this.props.onRenderItem as (props: ISelectedItemProps<T>) => JSX.Element;
 
@@ -132,8 +127,7 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
     }));
   }
 
-  @autobind
-  protected onSelectionChanged(): void {
+  protected onSelectionChanged = (): void => {
     this.forceUpdate();
   }
 
@@ -143,8 +137,7 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
     }
   }
 
-  @autobind
-  protected onKeyDown(ev: React.KeyboardEvent<HTMLElement>): void {
+  protected onKeyDown = (ev: React.KeyboardEvent<HTMLElement>): void => {
     switch (ev.which) {
       case KeyCodes.backspace:
         ev.stopPropagation();
@@ -156,8 +149,7 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
     }
   }
 
-  @autobind
-  protected onItemChange(changedItem: T, index: number): void {
+  protected onItemChange = (changedItem: T, index: number): void => {
     let { items } = this.state;
 
     if (index >= 0) {
@@ -168,8 +160,7 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
     }
   }
 
-  @autobind
-  protected removeItem(item: ISelectedItemProps<T>): void {
+  protected removeItem = (item: ISelectedItemProps<T>): void => {
     let { items } = this.state;
     let index: number = items.indexOf(item);
 
@@ -179,9 +170,8 @@ export class BaseSelectedItemsList<T, P extends IBaseSelectedItemsListProps<T>>
     }
   }
 
-  @autobind
   // tslint:disable-next-line:no-any
-  protected removeItems(itemsToRemove: any[]): void {
+  protected removeItems = (itemsToRemove: any[]): void => {
     let { items } = this.state;
     // tslint:disable-next-line:no-any
     let newItems: T[] = items.filter((item: any) => itemsToRemove.indexOf(item) === -1);
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx
index 77b3c9fe43d6b..3b85c9b304318 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/EditingItem.tsx
@@ -4,7 +4,6 @@ import * as React from 'react';
 import {
   BaseComponent,
   KeyCodes,
-  autobind,
   getId,
   getNativeProps,
   inputProperties,
@@ -44,7 +43,6 @@ export class EditingItem extends BaseComponent<IEditingSelectedPeopleItemProps,
     this._floatingPickerProps = this.props.floatingPickerProps as IBaseFloatingPickerProps<IExtendedPersonaProps>;
   }
 
-  @autobind
   public componentDidMount(): void {
     let getEditingItemText = this.props.getEditingItemText as (item: IExtendedPersonaProps) => string;
     let itemText = getEditingItemText(this.props.item);
@@ -53,7 +51,6 @@ export class EditingItem extends BaseComponent<IEditingSelectedPeopleItemProps,
     this._editingInput.focus();
   }
 
-  @autobind
   public render(): JSX.Element {
     const itemId = getId();
     const nativeProps = getNativeProps(this.props, inputProperties);
@@ -76,8 +73,7 @@ export class EditingItem extends BaseComponent<IEditingSelectedPeopleItemProps,
       </div>);
   }
 
-  @autobind
-  private _renderEditingSuggestions(): JSX.Element {
+  private _renderEditingSuggestions = (): JSX.Element => {
     let onRenderFloatingPicker = this._onRenderFloatingPicker;
     return (onRenderFloatingPicker({
       componentRef: this._editingFloatingPicker,
@@ -88,20 +84,17 @@ export class EditingItem extends BaseComponent<IEditingSelectedPeopleItemProps,
     }));
   }
 
-  @autobind
-  private _resolveInputRef(ref: HTMLInputElement): void {
+  private _resolveInputRef = (ref: HTMLInputElement): void => {
     this._editingInput = ref;
 
     this.forceUpdate(() => { this._editingInput.focus(); });
   }
 
-  @autobind
-  private _onInputClick(): void {
+  private _onInputClick = (): void => {
     this._editingFloatingPicker.value && this._editingFloatingPicker.value.showPicker();
   }
 
-  @autobind
-  private _onInputBlur(ev: React.FocusEvent<HTMLElement>): void {
+  private _onInputBlur = (ev: React.FocusEvent<HTMLElement>): void => {
     if (this._editingFloatingPicker.value &&
       (ev.relatedTarget === null || (ev.relatedTarget as HTMLElement).className.indexOf('ms-SearchMore-button') === -1)
     ) {
@@ -109,8 +102,7 @@ export class EditingItem extends BaseComponent<IEditingSelectedPeopleItemProps,
     }
   }
 
-  @autobind
-  private _onInputChange(ev: React.FormEvent<HTMLElement>): void {
+  private _onInputChange = (ev: React.FormEvent<HTMLElement>): void => {
     let value: string = (ev.target as HTMLInputElement).value;
 
     if (value === '') {
@@ -128,8 +120,7 @@ export class EditingItem extends BaseComponent<IEditingSelectedPeopleItemProps,
     }
   }
 
-  @autobind
-  private _onSuggestionSelected(item: IExtendedPersonaProps): void {
+  private _onSuggestionSelected = (item: IExtendedPersonaProps): void => {
     this.props.onEditingComplete(this.props.item, item);
   }
 }
\ No newline at end of file
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/SelectedItemWithContextMenu.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/SelectedItemWithContextMenu.tsx
index 5abc76f2f865a..76d64899af892 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/SelectedItemWithContextMenu.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/Items/SelectedItemWithContextMenu.tsx
@@ -1,7 +1,7 @@
 /* tslint:disable */
 import * as React from 'react';
 /* tslint:enable */
-import { BaseComponent, autobind, createRef, RefObject } from '../../../../Utilities';
+import { BaseComponent, createRef, RefObject } from '../../../../Utilities';
 import { IExtendedPersonaProps } from '../SelectedPeopleList';
 import { ContextualMenu, DirectionalHint } from 'office-ui-fabric-react/lib/ContextualMenu';
 import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
@@ -46,8 +46,7 @@ export class SelectedItemWithContextMenu extends BaseComponent<ISelectedItemWith
       </div >);
   }
 
-  @autobind
-  private _onClick(ev: React.MouseEvent<HTMLElement>): void {
+  private _onClick = (ev: React.MouseEvent<HTMLElement>): void => {
     ev.preventDefault();
     if (this.props.beginEditing && !this.props.item.isValid) {
       this.props.beginEditing(this.props.item);
@@ -56,8 +55,7 @@ export class SelectedItemWithContextMenu extends BaseComponent<ISelectedItemWith
     }
   }
 
-  @autobind
-  private _onCloseContextualMenu(ev: Event): void {
+  private _onCloseContextualMenu = (ev: Event): void => {
     this.setState({ contextualMenuVisible: false });
   }
 }
\ No newline at end of file
diff --git a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
index 3c854dbad16b3..c667611f15cc2 100644
--- a/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/SelectedPeopleList/SelectedPeopleList.tsx
@@ -6,7 +6,7 @@ import { IBaseSelectedItemsListProps, ISelectedItemProps } from '../BaseSelected
 import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
 import { ExtendedSelectedItem } from './Items/ExtendedSelectedItem';
 import { SelectedItemWithContextMenu } from './Items/SelectedItemWithContextMenu';
-import { autobind, IRenderFunction } from '../../../Utilities';
+import { IRenderFunction } from '../../../Utilities';
 import { IContextualMenuItem } from 'office-ui-fabric-react/lib/ContextualMenu';
 import { IBaseFloatingPickerProps } from '../../../FloatingPicker';
 import { EditingItem } from './Items/EditingItem';
@@ -45,11 +45,10 @@ export class SelectedPeopleList extends BasePeopleSelectedItemsList {
 
   // tslint:disable-next-line:no-any
   public static defaultProps: any = {
-    onRenderItem: (props: ISelectedPeopleItemProps) => <ExtendedSelectedItem {...props} />,
+    onRenderItem: (props: ISelectedPeopleItemProps) => <ExtendedSelectedItem { ...props } />,
   };
 
-  @autobind
-  public replaceItem(itemToReplace: IExtendedPersonaProps, itemsToReplaceWith: IExtendedPersonaProps[]): void {
+  public replaceItem = (itemToReplace: IExtendedPersonaProps, itemsToReplaceWith: IExtendedPersonaProps[]): void => {
     let { items } = this.state;
     let index: number = items.indexOf(itemToReplace);
     if (index > -1) {
@@ -58,8 +57,7 @@ export class SelectedPeopleList extends BasePeopleSelectedItemsList {
     }
   }
 
-  @autobind
-  protected renderItems(): JSX.Element[] {
+  protected renderItems = (): JSX.Element[] => {
     let { items } = this.state;
     // tslint:disable-next-line:no-any
     return items.map((item: any, index: number) => this._renderItem(item, index));
@@ -84,7 +82,7 @@ export class SelectedPeopleList extends BasePeopleSelectedItemsList {
     if ((item as IExtendedPersonaProps).isEditing) {
       return (
         <EditingItem
-          {...props}
+          { ...props }
           onRenderFloatingPicker={ this.props.onRenderFloatingPicker }
           floatingPickerProps={ this.props.floatingPickerProps }
           onEditingComplete={ this._completeEditing }
@@ -109,15 +107,13 @@ export class SelectedPeopleList extends BasePeopleSelectedItemsList {
     }
   }
 
-  @autobind
-  private _beginEditing(item: IExtendedPersonaProps): void {
+  private _beginEditing = (item: IExtendedPersonaProps): void => {
     item.isEditing = true;
     this.forceUpdate();
   }
 
-  @autobind
   // tslint:disable-next-line:no-any
-  private _completeEditing(oldItem: any, newItem: any): void {
+  private _completeEditing = (oldItem: any, newItem: any): void => {
     oldItem.isEditing = false;
     this.replaceItem(oldItem, newItem);
   }
diff --git a/packages/experiments/src/components/Tile/Tile.tsx b/packages/experiments/src/components/Tile/Tile.tsx
index 7ec440385048b..1a18e013a8ed8 100644
--- a/packages/experiments/src/components/Tile/Tile.tsx
+++ b/packages/experiments/src/components/Tile/Tile.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 import { ITileProps, TileSize } from './Tile.types';
 import { Check } from 'office-ui-fabric-react/lib/Check';
 import { SELECTION_CHANGE } from 'office-ui-fabric-react/lib/Selection';
-import { ISize, css, BaseComponent, autobind, getId } from '../../Utilities';
+import { ISize, css, BaseComponent, getId } from '../../Utilities';
 import * as TileStylesModule from './Tile.scss';
 import * as SignalStylesModule from '../signals/Signal.scss';
 import * as CheckStylesModule from 'office-ui-fabric-react/lib/components/Check/Check.scss';
@@ -360,8 +360,7 @@ export class Tile extends BaseComponent<ITileProps, ITileState> {
     );
   }
 
-  @autobind
-  private _onSelectionChange(): void {
+  private _onSelectionChange = (): void => {
     const {
       selection,
       selectionIndex = -1
diff --git a/packages/experiments/src/components/TilesList/TilesList.tsx b/packages/experiments/src/components/TilesList/TilesList.tsx
index 13dfac23629ef..2903d2adf8b1b 100644
--- a/packages/experiments/src/components/TilesList/TilesList.tsx
+++ b/packages/experiments/src/components/TilesList/TilesList.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 import { ITilesListProps, ITilesGridItem, ITilesGridSegment, TilesGridMode, ITileSize } from './TilesList.types';
 import { List, IPageProps } from 'office-ui-fabric-react/lib/List';
 import { FocusZone, FocusZoneDirection } from 'office-ui-fabric-react/lib/FocusZone';
-import { autobind, css, IRenderFunction, IRectangle } from 'office-ui-fabric-react/lib/Utilities';
+import { css, IRenderFunction, IRectangle } from 'office-ui-fabric-react/lib/Utilities';
 import * as TilesListStylesModule from './TilesList.scss';
 
 // tslint:disable-next-line:no-any
@@ -167,8 +167,7 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
     );
   }
 
-  @autobind
-  private _onRenderPage(pageProps: IPageProps, defaultRender?: IRenderFunction<IPageProps>): JSX.Element {
+  private _onRenderPage = (pageProps: IPageProps, defaultRender?: IRenderFunction<IPageProps>): JSX.Element => {
     const {
       page,
       className: pageClassName,
@@ -288,11 +287,10 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
     );
   }
 
-  @autobind
-  private _getPageSpecification(startIndex: number, bounds: IRectangle): {
+  private _getPageSpecification = (startIndex: number, bounds: IRectangle): {
     itemCount: number;
     data: IPageData<TItem>;
-  } {
+  } => {
     if (this._pageSpecificationCache) {
       if (this._pageSpecificationCache.width !== bounds.width) {
         this._pageSpecificationCache = undefined;
@@ -428,22 +426,19 @@ export class TilesList<TItem> extends React.Component<ITilesListProps<TItem>, IT
     return pageSpecification;
   }
 
-  @autobind
-  private _onGetCellClassName(): string {
+  private _onGetCellClassName = (): string => {
     return TilesListStyles.listCell;
   }
 
-  @autobind
-  private _onGetPageClassName(): string {
+  private _onGetPageClassName = (): string => {
     return TilesListStyles.listPage;
   }
 
-  @autobind
-  private _onGetCellStyle(item: ITileCell<TItem>, currentRow?: IRowData): React.CSSProperties {
+  private _onGetCellStyle = (item: ITileCell<TItem>, currentRow?: IRowData): React.CSSProperties => {
     const {
       grid: {
         mode: gridMode,
-      maxScaleFactor
+        maxScaleFactor
       },
       grid
     } = item;
diff --git a/packages/experiments/src/components/VirtualizedList/VirtualizedList.tsx b/packages/experiments/src/components/VirtualizedList/VirtualizedList.tsx
index 75d6c43b68243..15817e321616c 100644
--- a/packages/experiments/src/components/VirtualizedList/VirtualizedList.tsx
+++ b/packages/experiments/src/components/VirtualizedList/VirtualizedList.tsx
@@ -2,7 +2,7 @@ import * as React from 'react';
 import { IVirtualizedListProps } from './VirtualizedList.types';
 import { IScrollContainerContext, ScrollContainerContextTypes } from '../../utilities/scrolling/ScrollContainer';
 import { IObjectWithKey } from 'office-ui-fabric-react/lib/Selection';
-import { BaseComponent, getParent, css, autobind, createRef } from 'office-ui-fabric-react/lib/Utilities';
+import { BaseComponent, getParent, css, createRef } from 'office-ui-fabric-react/lib/Utilities';
 
 interface IRange {
   /** Start of range */
@@ -193,8 +193,7 @@ export class VirtualizedList<TItem extends IObjectWithKey> extends BaseComponent
     return <ItemTag ref={ this._spacerRef.bind(this, key) } key={ key } style={ { height: spacerHeight } } />;
   }
 
-  @autobind
-  private _spacerRef(key: string, ref: HTMLElement): void {
+  private _spacerRef = (key: string, ref: HTMLElement): void => {
     if (ref) {
       this._spacerElements[key] = ref;
     } else {
diff --git a/packages/experiments/src/utilities/scrolling/ScrollContainer.tsx b/packages/experiments/src/utilities/scrolling/ScrollContainer.tsx
index 7f780b625f21f..362a5e167b629 100644
--- a/packages/experiments/src/utilities/scrolling/ScrollContainer.tsx
+++ b/packages/experiments/src/utilities/scrolling/ScrollContainer.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import * as PropTypes from 'prop-types';
 import { IScrollContainerProps } from './ScrollContainer.types';
-import { BaseComponent, autobind, css } from 'office-ui-fabric-react/lib/Utilities';
+import { BaseComponent, css } from 'office-ui-fabric-react/lib/Utilities';
 
 import * as ScrollContainerStyles from './ScrollContainer.scss';
 
@@ -79,16 +79,14 @@ export class ScrollContainer extends BaseComponent<IScrollContainerProps> implem
     }
   }
 
-  @autobind
-  private _resolveRoot(element: HTMLDivElement): void {
+  private _resolveRoot = (element: HTMLDivElement): void => {
     if (element) {
       this._root = element;
       this._init();
     }
   }
 
-  @autobind
-  private _onIntersection(entries: IntersectionObserverEntry[], observer: IntersectionObserver): void {
+  private _onIntersection = (entries: IntersectionObserverEntry[], observer: IntersectionObserver): void => {
     for (const entry of entries) {
       // tslint:disable-next-line:no-any
       if ((entry as any).isIntersecting || entry.intersectionRatio > 0) {
@@ -142,8 +140,7 @@ export class ScrollContainer extends BaseComponent<IScrollContainerProps> implem
     }
   }
 
-  @autobind
-  private _onScroll(): void {
+  private _onScroll = (): void => {
     const scrollTop = this._root.scrollTop;
 
     for (const callback of this._callbacks) {
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
index 887f243b75f54..70259d77f39ec 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
@@ -2,7 +2,7 @@
 import * as React from 'react';
 /* tslint:enable */
 
-import { autobind, BaseComponent } from '../../Utilities';
+import { BaseComponent } from '../../Utilities';
 import { IActivityItemProps, IActivityItemStyles } from './ActivityItem.types';
 import { IActivityItemClassNames, getClassNames } from './ActivityItem.classNames';
 import { getStyles } from './ActivityItem.styles';
@@ -52,8 +52,7 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
     );
   }
 
-  @autobind
-  private _onRenderIcon(props: IActivityItemProps): JSX.Element | React.ReactNode | null {
+  private _onRenderIcon = (props: IActivityItemProps): JSX.Element | React.ReactNode | null => {
     if (props.activityPersonas) {
       return this._onRenderPersonaArray(props);
     } else {
@@ -61,8 +60,7 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
     }
   }
 
-  @autobind
-  private _onRenderActivityDescription(props: IActivityItemProps): JSX.Element | null {
+  private _onRenderActivityDescription = (props: IActivityItemProps): JSX.Element | null => {
     const activityDescription = props.activityDescription || props.activityDescriptionText;
 
     if (activityDescription) {
@@ -72,8 +70,7 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
     return null;
   }
 
-  @autobind
-  private _onRenderComments(props: IActivityItemProps): JSX.Element | null {
+  private _onRenderComments = (props: IActivityItemProps): JSX.Element | null => {
     const comments = props.comments || props.commentText;
 
     if (!props.isCompact && comments) {
@@ -83,8 +80,7 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
     return null;
   }
 
-  @autobind
-  private _onRenderTimeStamp(props: IActivityItemProps): JSX.Element | null {
+  private _onRenderTimeStamp = (props: IActivityItemProps): JSX.Element | null => {
     if (!props.isCompact && props.timeStamp) {
       return (<div className={ this._classNames.timeStamp }>{ props.timeStamp }</div>);
     }
@@ -93,8 +89,7 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
   }
 
   // If activityPersonas is an array of persona props, build the persona cluster element.
-  @autobind
-  private _onRenderPersonaArray(props: IActivityItemProps): JSX.Element | null {
+  private _onRenderPersonaArray = (props: IActivityItemProps): JSX.Element | null => {
     let personaElement: JSX.Element | null = null;
     const activityPersonas = props.activityPersonas as Array<IPersonaProps & { key?: string | number }>;
     if (activityPersonas[0].imageUrl || activityPersonas[0].imageInitials) {
diff --git a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx
index 4e98a6cf270ee..d5386e0f0005a 100644
--- a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx
+++ b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.tsx
@@ -3,7 +3,6 @@ import { IAutofillProps, IAutofill } from './Autofill.types';
 import {
   BaseComponent,
   KeyCodes,
-  autobind,
   getNativeProps,
   inputProperties,
   createRef
@@ -146,31 +145,27 @@ export class Autofill extends BaseComponent<IAutofillProps, IAutofillState> impl
   // Composition events are used when the character/text requires several keystrokes to be completed.
   // Some examples of this are mobile text input and langauges like Japanese or Arabic.
   // Find out more at https://developer.mozilla.org/en-US/docs/Web/Events/compositionstart
-  @autobind
-  private _onCompositionStart(ev: React.CompositionEvent<HTMLInputElement>) {
+  private _onCompositionStart = (ev: React.CompositionEvent<HTMLInputElement>) => {
     this._autoFillEnabled = false;
   }
 
   // Composition events are used when the character/text requires several keystrokes to be completed.
   // Some examples of this are mobile text input and langauges like Japanese or Arabic.
   // Find out more at https://developer.mozilla.org/en-US/docs/Web/Events/compositionstart
-  @autobind
-  private _onCompositionEnd(ev: React.CompositionEvent<HTMLInputElement>) {
+  private _onCompositionEnd = (ev: React.CompositionEvent<HTMLInputElement>) => {
     const inputValue = this._getCurrentInputValue();
     this._tryEnableAutofill(inputValue, this.value, false, true);
     // Due to timing, this needs to be async, otherwise no text will be selected.
     this._async.setTimeout(() => this._updateValue(inputValue), 0);
   }
 
-  @autobind
-  private _onClick() {
+  private _onClick = () => {
     if (this._value && this._value !== '' && this._autoFillEnabled) {
       this._autoFillEnabled = false;
     }
   }
 
-  @autobind
-  private _onKeyDown(ev: React.KeyboardEvent<HTMLInputElement>) {
+  private _onKeyDown = (ev: React.KeyboardEvent<HTMLInputElement>) => {
     if (this.props.onKeyDown) {
       this.props.onKeyDown(ev);
     }
@@ -200,8 +195,7 @@ export class Autofill extends BaseComponent<IAutofillProps, IAutofillState> impl
     }
   }
 
-  @autobind
-  private _onInputChanged(ev: React.FormEvent<HTMLElement>) {
+  private _onInputChanged = (ev: React.FormEvent<HTMLElement>) => {
     const value: string = this._getCurrentInputValue(ev);
 
     // Right now typing does not have isComposing, once that has been fixed any should be removed.
@@ -209,8 +203,7 @@ export class Autofill extends BaseComponent<IAutofillProps, IAutofillState> impl
     this._updateValue(value);
   }
 
-  @autobind
-  private _onChanged(): void {
+  private _onChanged = (): void => {
     // Swallow this event, we don't care about it
     // We must provide it because React PropTypes marks it as required, but onInput serves the correct purpose
     return;
@@ -258,8 +251,7 @@ export class Autofill extends BaseComponent<IAutofillProps, IAutofillState> impl
    * Updates the current input value as well as getting a new display value.
    * @param newValue The new value from the input
    */
-  @autobind
-  private _updateValue(newValue: string) {
+  private _updateValue = (newValue: string) => {
     this._value = this.props.onInputChange ? this.props.onInputChange(newValue) : newValue;
     this.setState({
       displayValue: this._getDisplayValue(this._value, this.props.suggestedDisplayValue)
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
index 5e24eca4a8a32..7d036ce63f6e5 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import {
   BaseComponent,
-  autobind,
   css,
   getRTL
 } from '../../Utilities';
@@ -53,8 +52,7 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
     );
   }
 
-  @autobind
-  private _onReduceData(data: IBreadCrumbData): IBreadCrumbData | undefined {
+  private _onReduceData = (data: IBreadCrumbData): IBreadCrumbData | undefined => {
     let { renderedItems, renderedOverflowItems } = data;
     const movedItem = renderedItems[0];
     renderedItems = renderedItems.slice(1);
@@ -66,8 +64,7 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
     }
   }
 
-  @autobind
-  private _onRenderBreadcrumb(data: IBreadCrumbData) {
+  private _onRenderBreadcrumb = (data: IBreadCrumbData) => {
     const { className, ariaLabel, onRenderItem = this._onRenderItem, overflowAriaLabel } = data.props;
     const { renderedOverflowItems, renderedItems } = data;
 
@@ -124,8 +121,7 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
     );
   }
 
-  @autobind
-  private _onRenderItem(item: IBreadcrumbItem) {
+  private _onRenderItem = (item: IBreadcrumbItem) => {
     if (item.onClick || item.href) {
       return (
         <Link
@@ -156,8 +152,7 @@ export class Breadcrumb extends BaseComponent<IBreadcrumbProps, any> {
     }
   }
 
-  @autobind
-  private _onBreadcrumbClicked(item: IBreadcrumbItem, ev: React.MouseEvent<HTMLElement>) {
+  private _onBreadcrumbClicked = (item: IBreadcrumbItem, ev: React.MouseEvent<HTMLElement>) => {
     if (item.onClick) {
       item.onClick(ev, item);
     }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
index e60db6597e661..6d999bf54e92f 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.tsx
@@ -5,7 +5,6 @@ import { CalendarDay, ICalendarDay } from './CalendarDay';
 import { CalendarMonth, ICalendarMonth } from './CalendarMonth';
 import { compareDates, getDateRangeArray } from '../../utilities/dateMath/DateMath';
 import {
-  autobind,
   css,
   BaseComponent,
   KeyCodes,
@@ -210,16 +209,13 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     }
   }
 
-  @autobind
-  private _navigateDay(date: Date) {
+  private _navigateDay = (date: Date): void => {
     this.setState({
       navigatedDate: date
     });
   }
 
-  @autobind
-  private _onNavigateDate(date: Date, focusOnNavigatedDay: boolean) {
-
+  private _onNavigateDate = (date: Date, focusOnNavigatedDay: boolean): void => {
     if (this.props.isDayPickerVisible || (!this.props.isDayPickerVisible && !focusOnNavigatedDay)) {
       this._navigateDay(date);
       this._focusOnUpdate = focusOnNavigatedDay;
@@ -229,8 +225,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     }
   }
 
-  @autobind
-  private _onSelectDate(date: Date, selectedDateRangeArray?: Date[]) {
+  private _onSelectDate = (date: Date, selectedDateRangeArray?: Date[]): void => {
     const { onSelectDate } = this.props;
 
     this.setState({
@@ -242,8 +237,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     }
   }
 
-  @autobind
-  private _onHeaderSelect(focus: boolean) {
+  private _onHeaderSelect = (focus: boolean): void => {
     this.setState({
       isDayPickerVisible: !this.state.isDayPickerVisible,
       isMonthPickerVisible: !this.state.isMonthPickerVisible
@@ -254,19 +248,15 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     }
   }
 
-  @autobind
-  private _onGotoToday() {
-
+  private _onGotoToday = (): void => {
     const { dateRangeType, firstDayOfWeek, today, workWeekDays } = this.props;
 
     const dates = getDateRangeArray(today!, dateRangeType!, firstDayOfWeek!, workWeekDays!);
 
     this._onSelectDate(today!, dates);
-
   }
 
-  @autobind
-  private _onGotoTodayKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+  private _onGotoTodayKeyDown = (ev: React.KeyboardEvent<HTMLElement>): void => {
     if (ev.which === KeyCodes.enter || ev.which === KeyCodes.space) {
       ev.preventDefault();
       this._onGotoToday();
@@ -279,8 +269,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     }
   }
 
-  @autobind
-  private _onDatePickerPopupKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+  private _onDatePickerPopupKeyDown = (ev: React.KeyboardEvent<HTMLElement>): void => {
     switch (ev.which) {
       case KeyCodes.enter:
         ev.preventDefault();
@@ -299,8 +288,7 @@ export class Calendar extends BaseComponent<ICalendarProps, ICalendarState> impl
     }
   }
 
-  @autobind
-  private _handleEscKey(ev: React.KeyboardEvent<HTMLElement>) {
+  private _handleEscKey = (ev: React.KeyboardEvent<HTMLElement>): void => {
     if (this.props.onDismiss) {
       this.props.onDismiss();
     }
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
index 728cb130cc7d8..7907ad60de58e 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarDay.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import {
   BaseComponent,
   KeyCodes,
-  autobind,
   css,
   getId,
   getRTL,
@@ -403,23 +402,20 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
     }
   }
 
-  @autobind
-  private _onKeyDown(callback: () => void, ev: React.KeyboardEvent<HTMLElement>) {
+  private _onKeyDown = (callback: () => void, ev: React.KeyboardEvent<HTMLElement>): void => {
     if (ev.which === KeyCodes.enter || ev.which === KeyCodes.space) {
       callback();
     }
   }
 
-  @autobind
-  private _onDayKeyDown(originalDate: Date, weekIndex: number, dayIndex: number)
-    : (ev: React.KeyboardEvent<HTMLElement>) => void {
+  private _onDayKeyDown = (originalDate: Date, weekIndex: number, dayIndex: number)
+    : (ev: React.KeyboardEvent<HTMLElement>) => void => {
     return (ev: React.KeyboardEvent<HTMLElement>): void => {
       this._navigateMonthEdge(ev, originalDate, weekIndex, dayIndex);
     };
   }
 
-  @autobind
-  private _onSelectDate(selectedDate: Date) {
+  private _onSelectDate = (selectedDate: Date): void => {
     const {
       onSelectDate,
       dateRangeType,
@@ -451,39 +447,33 @@ export class CalendarDay extends BaseComponent<ICalendarDayProps, ICalendarDaySt
     }
   }
 
-  @autobind
-  private _onSelectNextMonth() {
+  private _onSelectNextMonth = (): void => {
     this.props.onNavigateDate(addMonths(this.props.navigatedDate, 1), false);
   }
 
-  @autobind
-  private _onSelectPrevMonth() {
+  private _onSelectPrevMonth = (): void => {
     this.props.onNavigateDate(addMonths(this.props.navigatedDate, -1), false);
   }
 
-  @autobind
-  private _onHeaderSelect() {
+  private _onHeaderSelect = (): void => {
     const { onHeaderSelect } = this.props;
     if (onHeaderSelect) {
       onHeaderSelect(true);
     }
   }
 
-  @autobind
-  private _onHeaderKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+  private _onHeaderKeyDown = (ev: React.KeyboardEvent<HTMLElement>): void => {
     const { onHeaderSelect } = this.props;
     if (onHeaderSelect && (ev.which === KeyCodes.enter || ev.which === KeyCodes.space)) {
       onHeaderSelect(true);
     }
   }
 
-  @autobind
-  private _onPrevMonthKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+  private _onPrevMonthKeyDown = (ev: React.KeyboardEvent<HTMLElement>): void => {
     this._onKeyDown(this._onSelectPrevMonth, ev);
   }
 
-  @autobind
-  private _onNextMonthKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+  private _onNextMonthKeyDown = (ev: React.KeyboardEvent<HTMLElement>): void => {
     this._onKeyDown(this._onSelectNextMonth, ev);
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
index 44e48726bd984..c8058f76f7898 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
+++ b/packages/office-ui-fabric-react/src/components/Calendar/CalendarMonth.tsx
@@ -4,7 +4,6 @@ import {
   KeyCodes,
   css,
   getRTL,
-  autobind
 } from '../../Utilities';
 import { ICalendarStrings, ICalendarIconStrings, ICalendarFormatDateCallbacks } from './Calendar.types';
 import { FocusZone } from '../../FocusZone';
@@ -162,37 +161,31 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
     return today.getFullYear() === year && today.getMonth() === month;
   }
 
-  @autobind
-  private _onKeyDown(callback: () => void, ev: React.KeyboardEvent<HTMLElement>) {
+  private _onKeyDown = (callback: () => void, ev: React.KeyboardEvent<HTMLElement>): void => {
     if (ev.which === KeyCodes.enter || ev.which === KeyCodes.space) {
       callback();
     }
   }
 
-  @autobind
-  private _onSelectNextYear() {
+  private _onSelectNextYear = (): void => {
     const { navigatedDate, onNavigateDate } = this.props;
     onNavigateDate(addYears(navigatedDate, 1), false);
   }
 
-  @autobind
-  private _onSelectNextYearKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+  private _onSelectNextYearKeyDown = (ev: React.KeyboardEvent<HTMLElement>): void => {
     this._onKeyDown(this._onSelectNextYear, ev);
   }
 
-  @autobind
-  private _onSelectPrevYear() {
+  private _onSelectPrevYear = (): void => {
     const { navigatedDate, onNavigateDate } = this.props;
     onNavigateDate(addYears(navigatedDate, -1), false);
   }
 
-  @autobind
-  private _onSelectPrevYearKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+  private _onSelectPrevYearKeyDown = (ev: React.KeyboardEvent<HTMLElement>): void => {
     this._onKeyDown(this._onSelectPrevYear, ev);
   }
 
-  @autobind
-  private _onSelectMonth(newMonth: number) {
+  private _onSelectMonth = (newMonth: number): void => {
     const { navigatedDate, onNavigateDate, onHeaderSelect } = this.props;
 
     // If header is clickable the calendars are overlayed, switch back to day picker when month is clicked
@@ -202,16 +195,14 @@ export class CalendarMonth extends BaseComponent<ICalendarMonthProps, {}> {
     onNavigateDate(setMonth(navigatedDate, newMonth), true);
   }
 
-  @autobind
-  private _onHeaderSelect() {
+  private _onHeaderSelect = (): void => {
     const { onHeaderSelect } = this.props;
     if (onHeaderSelect) {
       onHeaderSelect(true);
     }
   }
 
-  @autobind
-  private _onHeaderKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+  private _onHeaderKeyDown = (ev: React.KeyboardEvent<HTMLElement>): void => {
     const { onHeaderSelect } = this.props;
     if (onHeaderSelect && (ev.which === KeyCodes.enter || ev.which === KeyCodes.space)) {
       onHeaderSelect(true);
diff --git a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
index 1277b102253bf..b69501b1a3bbe 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/CalloutContent.base.tsx
@@ -12,7 +12,6 @@ import {
   IPoint,
   IRectangle,
   assign,
-  autobind,
   elementContains,
   focusFirstChild,
   getWindow,
@@ -216,8 +215,7 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
     return content;
   }
 
-  @autobind
-  public dismiss(ev?: Event | React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) {
+  public dismiss = (ev?: Event | React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>): void => {
     const { onDismiss } = this.props;
 
     if (onDismiss) {
@@ -246,16 +244,14 @@ export class CalloutContentBase extends BaseComponent<ICalloutProps, ICalloutSta
     }
   }
 
-  @autobind
-  protected _setInitialFocus() {
+  protected _setInitialFocus = (): void => {
     if (this.props.setInitialFocus && !this._didSetInitialFocus && this.state.positions && this._calloutElement.value) {
       this._didSetInitialFocus = true;
       focusFirstChild(this._calloutElement.value);
     }
   }
 
-  @autobind
-  protected _onComponentDidMount() {
+  protected _onComponentDidMount = (): void => {
     // This is added so the callout will dismiss when the window is scrolled
     // but not when something inside the callout is scrolled. The delay seems
     // to be required to avoid React firing an async focus event in IE from
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
index f466a7a4b0668..30d0fdcea818c 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import {
   BaseComponent,
-  autobind,
   getId,
   createRef,
   customizable
@@ -137,8 +136,7 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
     }
   }
 
-  @autobind
-  private _onFocus(ev: React.FocusEvent<HTMLInputElement>): void {
+  private _onFocus = (ev: React.FocusEvent<HTMLInputElement>): void => {
     const { inputProps } = this.props;
 
     if (inputProps && inputProps.onFocus) {
@@ -146,8 +144,7 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
     }
   }
 
-  @autobind
-  private _onBlur(ev: React.FocusEvent<HTMLInputElement>): void {
+  private _onBlur = (ev: React.FocusEvent<HTMLInputElement>): void => {
     const { inputProps } = this.props;
 
     if (inputProps && inputProps.onBlur) {
@@ -155,8 +152,7 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
     }
   }
 
-  @autobind
-  private _onClick(ev: React.FormEvent<HTMLButtonElement>) {
+  private _onClick = (ev: React.FormEvent<HTMLButtonElement>): void => {
     const { disabled, onChange } = this.props;
     const { isChecked } = this.state;
     ev.preventDefault();
@@ -173,8 +169,7 @@ export class Checkbox extends BaseComponent<ICheckboxProps, ICheckboxState> impl
     }
   }
 
-  @autobind
-  private _onRenderLabel(props: ICheckboxProps) {
+  private _onRenderLabel = (props: ICheckboxProps): JSX.Element | null => {
     const { label } = props;
 
     return label ? (
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.tsx b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.tsx
index 651275a1eaefb..5af5a82d6b56c 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.tsx
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.tsx
@@ -1,6 +1,6 @@
 // Utilities
 import * as React from 'react';
-import { BaseComponent, classNamesFunction, autobind, createRef } from '../../Utilities';
+import { BaseComponent, classNamesFunction, createRef } from '../../Utilities';
 import { DefaultPalette } from '../../Styling';
 
 // Component Dependencies
@@ -205,13 +205,11 @@ export class Coachmark extends BaseComponent<ICoachmarkTypes, ICoachmarkState> {
     }));
   }
 
-  @autobind
-  private _onFocusHandler(): void {
+  private _onFocusHandler = (): void => {
     this._openCoachmark();
   }
 
-  @autobind
-  private _openCoachmark(): void {
+  private _openCoachmark = (): void => {
     this.setState({
       collapsed: false
     });
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.tsx b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.tsx
index cbdb092e02ba7..37ca7b4635482 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.tsx
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.tsx
@@ -12,7 +12,6 @@ import {
   IPoint,
   IRectangle,
   assign,
-  autobind,
   css,
   elementContains,
   focusFirstChild,
@@ -198,8 +197,7 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
     );
   }
 
-  @autobind
-  public dismiss(ev?: Event | React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>): void {
+  public dismiss = (ev?: Event | React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>): void => {
     const { onDismiss } = this.props;
 
     if (onDismiss) {
@@ -228,16 +226,14 @@ export class PositioningContainer extends BaseComponent<IPositioningContainerTyp
     }
   }
 
-  @autobind
-  protected _setInitialFocus(): void {
+  protected _setInitialFocus = (): void => {
     if (this._contentHost.value && this.props.setInitialFocus && !this._didSetInitialFocus && this.state.positions) {
       this._didSetInitialFocus = true;
       focusFirstChild(this._contentHost.value);
     }
   }
 
-  @autobind
-  protected _onComponentDidMount(): void {
+  protected _onComponentDidMount = (): void => {
     // This is added so the positioningContainer will dismiss when the window is scrolled
     // but not when something inside the positioningContainer is scrolled. The delay seems
     // to be required to avoid React firing an async focus event in IE from
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
index f0d3a4b871ee5..291607e1e8e5b 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorPicker.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import {
   BaseComponent,
-  autobind,
   css
 } from '../../Utilities';
 import { IColorPickerProps } from './ColorPicker.types';
@@ -146,28 +145,23 @@ export class ColorPicker extends BaseComponent<IColorPickerProps, IColorPickerSt
     );
   }
 
-  @autobind
-  private _onSVChanged(s: number, v: number) {
+  private _onSVChanged = (s: number, v: number): void => {
     this._updateColor(updateSV(this.state.color, s, v));
   }
 
-  @autobind
-  private _onHChanged(h: number) {
+  private _onHChanged = (h: number): void => {
     this._updateColor(updateH(this.state.color, h));
   }
 
-  @autobind
-  private _onAChanged(a: number) {
+  private _onAChanged = (a: number): void => {
     this._updateColor(updateA(this.state.color, a));
   }
 
-  @autobind
-  private _onHexChanged() {
+  private _onHexChanged = (): void => {
     this._updateColor(getColorFromString('#' + this.hexText.value));
   }
 
-  @autobind
-  private _onRGBAChanged() {
+  private _onRGBAChanged = (): void => {
     this._updateColor(getColorFromRGBA({
       r: Number(this.rText.value),
       g: Number(this.gText.value),
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx
index 89faa3b7c9e17..2a40276926f1b 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorRectangle.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import {
   BaseComponent,
   assign,
-  autobind,
   css,
   createRef
 } from '../../Utilities';
@@ -77,16 +76,14 @@ export class ColorRectangle extends BaseComponent<IColorRectangleProps, IColorPi
     );
   }
 
-  @autobind
-  private _onMouseDown(ev: React.MouseEvent<HTMLElement>) {
+  private _onMouseDown = (ev: React.MouseEvent<HTMLElement>): void => {
     this._events.on(window, 'mousemove', this._onMouseMove, true);
     this._events.on(window, 'mouseup', this._onMouseUp, true);
 
     this._onMouseMove(ev);
   }
 
-  @autobind
-  private _onMouseMove(ev: React.MouseEvent<HTMLElement>) {
+  private _onMouseMove = (ev: React.MouseEvent<HTMLElement>): void => {
     const { color, onSVChanged } = this.props;
 
     if (!this._root.value) {
@@ -118,8 +115,7 @@ export class ColorRectangle extends BaseComponent<IColorRectangleProps, IColorPi
     ev.stopPropagation();
   }
 
-  @autobind
-  private _onMouseUp(ev: React.MouseEvent<HTMLElement>) {
+  private _onMouseUp = (ev: React.MouseEvent<HTMLElement>): void => {
     this._events.off();
 
     this.setState({
diff --git a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
index 5c74c41296b04..73b4ca591adc5 100644
--- a/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
+++ b/packages/office-ui-fabric-react/src/components/ColorPicker/ColorSlider.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import {
   BaseComponent,
-  autobind,
   css,
   createRef
 } from '../../Utilities';
@@ -78,16 +77,14 @@ export class ColorSlider extends BaseComponent<IColorSliderProps, IColorSliderSt
     );
   }
 
-  @autobind
-  private _onMouseDown(ev: React.MouseEvent<HTMLElement>) {
+  private _onMouseDown = (ev: React.MouseEvent<HTMLElement>): void => {
     this._events.on(window, 'mousemove', this._onMouseMove, true);
     this._events.on(window, 'mouseup', this._onMouseUp, true);
 
     this._onMouseMove(ev);
   }
 
-  @autobind
-  private _onMouseMove(ev: React.MouseEvent<HTMLElement>) {
+  private _onMouseMove = (ev: React.MouseEvent<HTMLElement>): void => {
     if (!this._root.value) {
       return;
     }
@@ -111,8 +108,7 @@ export class ColorSlider extends BaseComponent<IColorSliderProps, IColorSliderSt
     ev.stopPropagation();
   }
 
-  @autobind
-  private _onMouseUp(ev: React.MouseEvent<HTMLElement>) {
+  private _onMouseUp = (ev: React.MouseEvent<HTMLElement>): void => {
     this._events.off();
 
     this.setState({
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index eeb67596e1afc..94db32efdd8bf 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -9,7 +9,6 @@ import {
 } from '../../Button';
 import { Autofill } from '../Autofill/Autofill';
 import {
-  autobind,
   BaseComponent,
   divProperties,
   findIndex,
@@ -266,7 +265,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       onRenderContainer = this._onRenderContainer,
       onRenderList = this._onRenderList,
       onRenderItem = this._onRenderItem,
-      onRenderOption = this._onRenderOption,
+      onRenderOption = this._onRenderOptionContent,
       allowFreeform,
       buttonIconProps,
       isButtonAriaHidden = true,
@@ -381,8 +380,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   /**
    * Set focus on the input
    */
-  @autobind
-  public focus(shouldOpenOnFocus?: boolean) {
+  public focus = (shouldOpenOnFocus?: boolean): void => {
     if (this._comboBox) {
       this._comboBox.focus();
       if (shouldOpenOnFocus) {
@@ -396,8 +394,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   /**
    * Close menu callout if it is open
    */
-  @autobind
-  public dismissMenu(): void {
+  public dismissMenu = (): void => {
     const { isOpen } = this.state;
     isOpen && this.setState({ isOpen: false });
   }
@@ -409,8 +406,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    *  in to the auto fill's componentWillReceiveProps
    * @returns {string} - the updated value to set, if needed
    */
-  @autobind
-  private _onUpdateValueInAutofillWillReceiveProps(): string | null {
+  private _onUpdateValueInAutofillWillReceiveProps = (): string | null => {
     if (this._comboBox === null || this._comboBox === undefined) {
       return null;
     }
@@ -430,8 +426,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * @returns {boolean} - should the full value of the input be selected?
    * True if the defaultVisibleValue equals the suggestedDisplayValue, false otherwise
    */
-  @autobind
-  private _onShouldSelectFullInputValueInAutofillComponentDidUpdate(): boolean {
+  private _onShouldSelectFullInputValueInAutofillComponentDidUpdate = (): boolean => {
     return this._currentVisibleValue === this.state.suggestedDisplayValue;
   }
 
@@ -440,8 +435,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * to show to the user based off of the current props and state
    * @returns {string} the value to pass to the input
    */
-  @autobind
-  private _getVisibleValue(): string | undefined {
+  private _getVisibleValue = (): string | undefined => {
     const {
       value,
       allowFreeform,
@@ -518,8 +512,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * Handler for typing changes on the input
    * @param updatedValue - the newly changed value
    */
-  @autobind
-  private _onInputChange(updatedValue: string) {
+  private _onInputChange = (updatedValue: string): void => {
     if (this.props.disabled) {
       this._handleInputWhenDisabled(null /* event */);
       return;
@@ -734,8 +727,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * Focus (and select) the content of the input
    * and set the focused state
    */
-  @autobind
-  private _select() {
+  private _select = (): void => {
     if (this._comboBox.inputElement) {
       this._comboBox.inputElement.select();
     }
@@ -750,8 +742,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * if they need to be passed in the first time. This only does work if an onResolveOptions
    * callback was passed in
    */
-  @autobind
-  private _onResolveOptions() {
+  private _onResolveOptions = (): void => {
     if (this.props.onResolveOptions) {
 
       // get the options
@@ -783,8 +774,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * OnBlur handler. Set the focused state to false
    * and submit any pending value
    */
-  @autobind
-  private _onBlur(event: React.FocusEvent<HTMLInputElement>) {
+  private _onBlur = (event: React.FocusEvent<HTMLInputElement>): void => {
 
     // Do nothing if the blur is coming from something
     // inside the comboBox root or the comboBox menu since
@@ -869,8 +859,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   }
 
   // Render Callout container and pass in list
-  @autobind
-  private _onRenderContainer(props: IComboBoxProps): JSX.Element {
+  private _onRenderContainer = (props: IComboBoxProps): JSX.Element => {
     const {
       onRenderList,
       calloutProps,
@@ -906,8 +895,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   }
 
   // Render List of items
-  @autobind
-  private _onRenderList(props: IComboBoxProps): JSX.Element {
+  private _onRenderList = (props: IComboBoxProps): JSX.Element => {
     const {
       onRenderItem,
       options
@@ -927,8 +915,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   }
 
   // Render items
-  @autobind
-  private _onRenderItem(item: IComboBoxOption): JSX.Element | null {
+  private _onRenderItem = (item: IComboBoxOption): JSX.Element | null => {
     switch (item.itemType) {
       case SelectableOptionMenuItemType.Divider:
         return this._renderSeparator(item);
@@ -940,8 +927,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   }
 
   // Default _onRenderLowerContent function returns nothing
-  @autobind
-  private _onRenderLowerContent(): null {
+  private _onRenderLowerContent = (): null => {
     return null;
   }
 
@@ -962,18 +948,16 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   }
 
   private _renderHeader(item: IComboBoxOption): JSX.Element {
-    const { onRenderOption = this._onRenderOption } = this.props;
+    const { onRenderOption = this._onRenderOptionContent } = this.props;
 
     return (
       <div key={ item.key } className={ this._classNames.header } role='heading'>
-        { onRenderOption(item, this._onRenderOption) }
+        { onRenderOption(item, this._onRenderOptionContent) }
       </div>);
   }
 
-  // Render menu item
-  @autobind
-  private _renderOption(item: IComboBoxOption): JSX.Element {
-    const { onRenderOption = this._onRenderOption } = this.props;
+  private _renderOption = (item: IComboBoxOption): JSX.Element => {
+    const { onRenderOption = this._onRenderOptionContent } = this.props;
     const id = this._id;
     const isSelected: boolean = this._isOptionSelected(item.index);
     const rootClassNames = getComboBoxOptionClassNames(this._getCurrentOptionStyles(item)).root;
@@ -995,7 +979,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         ariaLabel={ item.text }
         disabled={ item.disabled }
       > { <span ref={ this._resolveRef(isSelected ? '_selectedElement' : '') }>
-        { onRenderOption(item, this._onRenderOption) }
+        { onRenderOption(item, this._onRenderOptionContent) }
       </span>
         }
       </CommandButton>
@@ -1054,8 +1038,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * Scroll handler for the callout to make sure the mouse events
    * for updating focus are not interacting during scroll
    */
-  @autobind
-  private _onScroll() {
+  private _onScroll = () => {
     if (!this._isScrollIdle && this._scrollIdleTimeoutId !== undefined) {
       this._async.clearTimeout(this._scrollIdleTimeoutId);
       this._scrollIdleTimeoutId = undefined;
@@ -1112,9 +1095,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     }
   }
 
-  // Render content of item
-  @autobind
-  private _onRenderOption(item: IComboBoxOption): JSX.Element {
+  private _onRenderOptionContent = (item: IComboBoxOption): JSX.Element => {
     const optionClassNames = getComboBoxOptionClassNames(this._getCurrentOptionStyles(item));
     return <span className={ optionClassNames.optionText }>{ item.text }</span>;
   }
@@ -1136,8 +1117,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   /**
    * Handles dismissing (cancelling) the menu
    */
-  @autobind
-  private _onDismiss() {
+  private _onDismiss = (): void => {
 
     // reset the selected index
     // to the last valud state
@@ -1294,8 +1274,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * Handle keydown on the input
    * @param ev - The keyboard event that was fired
    */
-  @autobind
-  private _onInputKeyDown(ev: React.KeyboardEvent<HTMLElement | Autofill>) {
+  private _onInputKeyDown = (ev: React.KeyboardEvent<HTMLElement | Autofill>): void => {
     const {
       disabled,
       allowFreeform,
@@ -1456,8 +1435,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * Handle keyup on the input
    * @param ev - the keyboard event that was fired
    */
-  @autobind
-  private _onInputKeyUp(ev: React.KeyboardEvent<HTMLElement | Autofill>) {
+  private _onInputKeyUp = (ev: React.KeyboardEvent<HTMLElement | Autofill>): void => {
     const {
       disabled,
       allowFreeform,
@@ -1549,8 +1527,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * and the input when not allowing freeform. This
    * toggles the expand/collapse state of the comboBox (if enbled)
    */
-  @autobind
-  private _onComboBoxClick() {
+  private _onComboBoxClick = (): void => {
     const { disabled } = this.props;
     const { isOpen } = this.state;
 
@@ -1562,8 +1539,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   /**
    * Click handler for the autofill.
    */
-  @autobind
-  private _onAutofillClick() {
+  private _onAutofillClick = (): void => {
     if (this.props.allowFreeform) {
       this.focus(this.state.isOpen);
     } else {
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx
index 210f51d51d1db..0674d552c7261 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/VirtualizedComboBox.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { autobind, BaseComponent, createRef } from '../../Utilities';
+import { BaseComponent, createRef } from '../../Utilities';
 import { ComboBox } from './ComboBox';
 import { IComboBoxProps, IComboBox } from './ComboBox.types';
 import { List } from '../../List';
@@ -37,8 +37,7 @@ export class VirtualizedComboBox extends BaseComponent<IComboBoxProps, {}> imple
     );
   }
 
-  @autobind
-  protected _onRenderList(props: IComboBoxProps): JSX.Element {
+  protected _onRenderList = (props: IComboBoxProps): JSX.Element => {
     const {
       onRenderItem
     } = props;
@@ -54,8 +53,7 @@ export class VirtualizedComboBox extends BaseComponent<IComboBoxProps, {}> imple
     );
   }
 
-  @autobind
-  protected _onScrollToItem(itemIndex: number): void {
+  protected _onScrollToItem = (itemIndex: number): void => {
     // We are using the List component, call scrollToIndex
     this._list.value && this._list.value.scrollToIndex(itemIndex);
   }
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index c33eb4feb7c31..2a4996e855bcd 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import {
   BaseComponent,
-  autobind,
   buttonProperties,
   anchorProperties,
   css,
@@ -415,8 +414,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
     };
   }
 
-  @autobind
-  private _onOverflowClick(ev: React.MouseEvent<HTMLButtonElement>) {
+  private _onOverflowClick = (ev: React.MouseEvent<HTMLButtonElement>) => {
     if (this.state.expandedMenuItemKey === OVERFLOW_KEY) {
       this._onContextMenuDismiss();
     } else {
@@ -429,8 +427,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
     }
   }
 
-  @autobind
-  private _onContextMenuDismiss(ev?: any) {
+  private _onContextMenuDismiss = (ev?: any) => {
     const { value: commandSurface } = this._commandSurface;
 
     if (!ev || !ev.relatedTarget || commandSurface && !commandSurface.contains(ev.relatedTarget as HTMLElement)) {
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 855c6e3f44f97..49009fea857be 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -18,7 +18,6 @@ import {
   assign,
   getId,
   getRTL,
-  autobind,
   KeyCodes,
   getDocument,
   getWindow,
@@ -115,8 +114,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     this._isScrollIdle = true;
   }
 
-  @autobind
-  public dismiss(ev?: any, dismissAll?: boolean) {
+  public dismiss = (ev?: any, dismissAll?: boolean) => {
     const { onDismiss } = this.props;
 
     if (onDismiss) {
@@ -672,8 +670,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     return iconProps;
   }
 
-  @autobind
-  private _onKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+  private _onKeyDown = (ev: React.KeyboardEvent<HTMLElement>) => {
     if (ev.which === KeyCodes.escape ||
       ev.altKey ||
       ev.metaKey ||
@@ -689,8 +686,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   /**
    * Checks if the submenu should be closed
    */
-  @autobind
-  private _shouldCloseSubMenu(ev: React.KeyboardEvent<HTMLElement>): boolean {
+  private _shouldCloseSubMenu = (ev: React.KeyboardEvent<HTMLElement>): boolean => {
     const submenuCloseKey = getRTL() ? KeyCodes.right : KeyCodes.left;
 
     if (ev.which !== submenuCloseKey || !this.props.isSubMenu) {
@@ -701,8 +697,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       (!!this._adjustedFocusZoneProps.checkForNoWrap && !shouldWrapFocus(ev.target as HTMLElement, 'data-no-horizontal-wrap'));
   }
 
-  @autobind
-  private _onMenuKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+  private _onMenuKeyDown = (ev: React.KeyboardEvent<HTMLElement>) => {
     if (ev.which === KeyCodes.escape || ev.altKey || ev.metaKey) {
       this._isFocusingPreviousElement = true;
       ev.preventDefault();
@@ -732,8 +727,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
    * Scroll handler for the callout to make sure the mouse events
    * for updating focus are not interacting during scroll
    */
-  @autobind
-  private _onScroll() {
+  private _onScroll = (): void => {
     if (!this._isScrollIdle && this._scrollIdleTimeoutId !== undefined) {
       this._async.clearTimeout(this._scrollIdleTimeoutId);
       this._scrollIdleTimeoutId = undefined;
@@ -763,8 +757,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     this._updateFocusOnMouseEvent(item, ev);
   }
 
-  @autobind
-  private _onMouseItemLeave(item: any, ev: React.MouseEvent<HTMLElement>) {
+  private _onMouseItemLeave = (item: any, ev: React.MouseEvent<HTMLElement>): void => {
     if (!this._isScrollIdle) {
       return;
     }
@@ -941,8 +934,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     }
   }
 
-  @autobind
-  private _onSubMenuDismiss(ev?: any, dismissAll?: boolean) {
+  private _onSubMenuDismiss = (ev?: any, dismissAll?: boolean): void => {
     if (dismissAll) {
       this.dismiss(ev, dismissAll);
     } else {
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
index 26c65aa91dd0a..1241004c36f47 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.tsx
@@ -14,7 +14,6 @@ import { DirectionalHint } from '../../common/DirectionalHint';
 import { TextField, ITextField } from '../../TextField';
 import { Label } from '../../Label';
 import {
-  autobind,
   BaseComponent,
   KeyCodes,
   css,
@@ -285,8 +284,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     }
   }
 
-  @autobind
-  private _onSelectDate(date: Date) {
+  private _onSelectDate = (date: Date): void => {
     const { formatDate, onSelectDate } = this.props;
 
     if (this.props.calendarProps && this.props.calendarProps.onSelectDate) {
@@ -307,15 +305,13 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     });
   }
 
-  @autobind
-  private _onCalloutPositioned() {
+  private _onCalloutPositioned = (): void => {
     if (this._calendar.value) {
       this._calendar.value.focus();
     }
   }
 
-  @autobind
-  private _onTextFieldFocus(ev: React.FocusEvent<HTMLElement>) {
+  private _onTextFieldFocus = (ev: React.FocusEvent<HTMLElement>): void => {
     if (this.props.disableAutoFocus) {
       return;
     }
@@ -329,13 +325,11 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     }
   }
 
-  @autobind
-  private _onTextFieldBlur(ev: React.FocusEvent<HTMLElement>) {
+  private _onTextFieldBlur = (ev: React.FocusEvent<HTMLElement>): void => {
     this._validateTextInput();
   }
 
-  @autobind
-  private _onTextFieldChanged(newValue: string) {
+  private _onTextFieldChanged = (newValue: string): void => {
     if (this.props.allowTextInput) {
       if (this.state.isDatePickerShown) {
         this._dismissDatePickerPopup();
@@ -350,8 +344,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     }
   }
 
-  @autobind
-  private _onTextFieldKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+  private _onTextFieldKeyDown = (ev: React.KeyboardEvent<HTMLElement>): void => {
     switch (ev.which) {
       case KeyCodes.enter:
         ev.preventDefault();
@@ -376,8 +369,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     }
   }
 
-  @autobind
-  private _onTextFieldClick(ev: React.MouseEvent<HTMLElement>) {
+  private _onTextFieldClick = (ev: React.MouseEvent<HTMLElement>): void => {
     if (!this.state.isDatePickerShown && !this.props.disabled) {
       this._showDatePickerPopup();
     } else {
@@ -389,8 +381,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     }
   }
 
-  @autobind
-  private _onIconClick(ev: React.MouseEvent<HTMLElement>) {
+  private _onIconClick = (ev: React.MouseEvent<HTMLElement>): void => {
     ev.stopPropagation();
     this._onTextFieldClick(ev);
   }
@@ -405,8 +396,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     }
   }
 
-  @autobind
-  private _dismissDatePickerPopup() {
+  private _dismissDatePickerPopup = (): void => {
     if (this.state.isDatePickerShown) {
       this.setState({
         isDatePickerShown: false
@@ -419,8 +409,7 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
   /**
    * Callback for closing the calendar callout
    */
-  @autobind
-  private _calendarDismissed() {
+  private _calendarDismissed = (): void => {
     this._preventFocusOpeningPicker = true;
     this._dismissDatePickerPopup();
 
@@ -429,13 +418,11 @@ export class DatePicker extends BaseComponent<IDatePickerProps, IDatePickerState
     }
   }
 
-  @autobind
-  private _handleEscKey(ev: React.KeyboardEvent<HTMLElement>) {
+  private _handleEscKey = (ev: React.KeyboardEvent<HTMLElement>): void => {
     this._calendarDismissed();
   }
 
-  @autobind
-  private _validateTextInput() {
+  private _validateTextInput = (): void => {
     const { isRequired, allowTextInput, strings, parseDateFromString, onSelectDate, formatDate, minDate, maxDate } = this.props;
     const inputValue = this.state.formattedDate;
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index c873d087ae8bc..1b1d4c438c6c3 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import {
   BaseComponent,
-  autobind,
   css,
   getRTL,
   getId,
@@ -359,8 +358,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
     );
   }
 
-  @autobind
-  private _onRenderColumnHeaderTooltip(tooltipHostProps: ITooltipHostProps, defaultRender?: IRenderFunction<ITooltipHostProps>) {
+  private _onRenderColumnHeaderTooltip = (tooltipHostProps: ITooltipHostProps, defaultRender?: IRenderFunction<ITooltipHostProps>): JSX.Element => {
     return (
       <span className={ tooltipHostProps.hostClassName }>
         { tooltipHostProps.children }
@@ -386,16 +384,13 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
   /**
    * Called when the select all toggle is clicked.
    */
-
-  @autobind
-  private _onSelectAllClicked() {
+  private _onSelectAllClicked = (): void => {
     const { selection } = this.props;
 
     selection.toggleAllSelected();
   }
 
-  @autobind
-  private _onRootMouseDown(ev: MouseEvent) {
+  private _onRootMouseDown = (ev: MouseEvent): void => {
     const columnIndexAttr = (ev.target as HTMLElement).getAttribute('data-sizer-index');
     const columnIndex = Number(columnIndexAttr);
     const { columns } = this.props;
@@ -417,8 +412,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
     ev.stopPropagation();
   }
 
-  @autobind
-  private _onRootMouseMove(ev: React.MouseEvent<HTMLElement>) {
+  private _onRootMouseMove = (ev: React.MouseEvent<HTMLElement>): void => {
     const { columnResizeDetails, isSizing } = this.state;
 
     if (columnResizeDetails && !isSizing && ev.clientX !== columnResizeDetails.originX) {
@@ -426,8 +420,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
     }
   }
 
-  @autobind
-  private _onRootKeyDown(ev: KeyboardEvent) {
+  private _onRootKeyDown = (ev: KeyboardEvent): void => {
     const { columnResizeDetails, isSizing } = this.state;
     const { columns, onColumnResized } = this.props;
 
@@ -496,8 +489,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
    * @private
    * @param {React.MouseEvent} ev (mouse move event)
    */
-  @autobind
-  private _onSizerMouseMove(ev: React.MouseEvent<HTMLElement>) {
+  private _onSizerMouseMove = (ev: React.MouseEvent<HTMLElement>): void => {
     const {
       // use buttons property here since ev.button in some edge case is not upding well during the move.
       // but firefox doesn't support it, so we set the default value when it is not defined.
@@ -534,8 +526,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
 
   }
 
-  @autobind
-  private _onSizerBlur(ev: React.FocusEvent<HTMLElement>) {
+  private _onSizerBlur = (ev: React.FocusEvent<HTMLElement>): void => {
     const { columnResizeDetails } = this.state;
 
     if (columnResizeDetails) {
@@ -554,8 +545,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
    * @private
    * @param {React.MouseEvent} ev (mouse up event)
    */
-  @autobind
-  private _onSizerMouseUp(ev: React.MouseEvent<HTMLElement>) {
+  private _onSizerMouseUp = (ev: React.MouseEvent<HTMLElement>): void => {
     const { columns, onColumnIsSizingChanged } = this.props;
     const { columnResizeDetails } = this.state;
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 73103e877da0c..32c98e5385ed0 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -6,7 +6,6 @@ import {
   BaseComponent,
   KeyCodes,
   assign,
-  autobind,
   css,
   elementContains,
   getRTLSafeKeyCode,
@@ -420,19 +419,16 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     this._forceListUpdates();
   }
 
-  @autobind
-  protected _onRenderRow(props: IDetailsRowProps, defaultRender?: any) {
+  protected _onRenderRow = (props: IDetailsRowProps, defaultRender?: any): JSX.Element => {
     return <DetailsRow { ...props } />;
   }
 
-  @autobind
-  private _onRenderDetailsHeader(detailsHeaderProps: IDetailsHeaderProps, defaultRender?: IRenderFunction<IDetailsHeaderProps>) {
+  private _onRenderDetailsHeader = (detailsHeaderProps: IDetailsHeaderProps, defaultRender?: IRenderFunction<IDetailsHeaderProps>): JSX.Element => {
     return <DetailsHeader { ...detailsHeaderProps } />;
   }
 
-  @autobind
-  private _onRenderListCell(nestingDepth: number)
-    : (item: any, itemIndex: number) => React.ReactNode {
+  private _onRenderListCell = (nestingDepth: number)
+    : (item: any, itemIndex: number) => React.ReactNode => {
     return (item: any, itemIndex: number): React.ReactNode => {
       return this._onRenderCell(nestingDepth, item, itemIndex as number);
     };
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index 67c4b30c56a75..9b79de71b1a45 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -4,7 +4,6 @@ import {
   BaseComponent,
   IDisposable,
   assign,
-  autobind,
   css,
   shallowCompare,
   getNativeProps,
@@ -343,8 +342,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
     selection.toggleIndexSelected(this.props.itemIndex);
   }
 
-  @autobind
-  private _onRootRef(focusZone: FocusZone) {
+  private _onRootRef = (focusZone: FocusZone): void => {
     if (focusZone) {
       // Need to resolve the actual DOM node, not the component. The element itself will be used for drag/drop and focusing.
       this._root = ReactDOM.findDOMNode(focusZone) as HTMLElement;
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx
index f04eaa7838f4a..045fb0fd3a660 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.tsx
@@ -3,7 +3,6 @@ import { IDocumentCardProps, DocumentCardType } from './DocumentCard.types';
 import {
   BaseComponent,
   KeyCodes,
-  autobind,
   css
 } from '../../Utilities';
 import * as stylesImport from './DocumentCard.scss';
@@ -62,20 +61,17 @@ export class DocumentCard extends BaseComponent<IDocumentCardProps, any> {
     );
   }
 
-  @autobind
-  private _onClick(ev: React.MouseEvent<HTMLElement>): void {
+  private _onClick = (ev: React.MouseEvent<HTMLElement>): void => {
     this._onAction(ev);
   }
 
-  @autobind
-  private _onKeyDown(ev: React.KeyboardEvent<HTMLElement>): void {
+  private _onKeyDown = (ev: React.KeyboardEvent<HTMLElement>): void => {
     if (ev.which === KeyCodes.enter || ev.which === KeyCodes.space) {
       this._onAction(ev);
     }
   }
 
-  @autobind
-  private _onAction(ev: React.SyntheticEvent<HTMLElement>): void {
+  private _onAction = (ev: React.SyntheticEvent<HTMLElement>): void => {
     const { onClick, onClickHref } = this.props;
 
     if (onClick) {
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx
index cf725198238f5..36e1c3dd3214d 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx
@@ -4,7 +4,6 @@ import { Image } from '../../Image';
 import { Icon } from '../../Icon';
 import {
   BaseComponent,
-  autobind,
   css
 } from '../../Utilities';
 import * as stylesImport from './DocumentCard.scss';
@@ -79,8 +78,7 @@ export class DocumentCardPreview extends BaseComponent<IDocumentCardPreviewProps
     );
   }
 
-  @autobind
-  private _renderPreviewList(previewImages: IDocumentCardPreviewImage[]): React.ReactElement<React.HTMLAttributes<HTMLDivElement>> {
+  private _renderPreviewList = (previewImages: IDocumentCardPreviewImage[]): React.ReactElement<React.HTMLAttributes<HTMLDivElement>> => {
     const { getOverflowDocumentCountText } = this.props;
 
     // Determine how many documents we won't be showing
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx
index 0a970d3eed25e..089480f93466e 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx
@@ -4,7 +4,6 @@ import * as React from 'react';
 
 import {
   BaseComponent,
-  autobind,
   css
 } from '../../Utilities';
 import { IDocumentCardTitleProps } from './DocumentCard.types';
@@ -82,8 +81,7 @@ export class DocumentCardTitle extends BaseComponent<IDocumentCardTitleProps, ID
     return documentCardTitle;
   }
 
-  @autobind
-  private _startTruncation(props: IDocumentCardTitleProps) {
+  private _startTruncation = (props: IDocumentCardTitleProps): void => {
     const originalTitle = props.title;
     this._isTruncated = false;
 
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 0e09aeebe1c00..4e2487ea5aa6d 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -13,7 +13,6 @@ import { IWithResponsiveModeState } from '../../utilities/decorators/withRespons
 import {
   BaseComponent,
   KeyCodes,
-  autobind,
   css,
   findIndex,
   getId,
@@ -322,8 +321,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   // Render text in dropdown input
-  @autobind
-  private _onRenderTitle(item: IDropdownOption[]): JSX.Element {
+  private _onRenderTitle = (item: IDropdownOption[]): JSX.Element => {
     const { multiSelectDelimiter = ', ' } = this.props;
 
     const displayTxt = item.map(i => i.text).join(multiSelectDelimiter);
@@ -331,8 +329,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   // Render placeHolder text in dropdown input
-  @autobind
-  private _onRenderPlaceHolder(props: IDropdownProps): JSX.Element | null {
+  private _onRenderPlaceHolder = (props: IDropdownProps): JSX.Element | null => {
     if (!props.placeHolder) {
       return null;
     }
@@ -340,8 +337,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   // Render Callout or Panel container and pass in list
-  @autobind
-  private _onRenderContainer(props: IDropdownProps): JSX.Element {
+  private _onRenderContainer = (props: IDropdownProps): JSX.Element => {
     const {
       onRenderList = this._onRenderList,
       responsiveMode,
@@ -387,16 +383,14 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   // Render Caret Down Icon
-  @autobind
-  private _onRenderCaretDown(props: IDropdownProps): JSX.Element {
+  private _onRenderCaretDown = (props: IDropdownProps): JSX.Element => {
     return (
       <Icon className={ css('ms-Dropdown-caretDown', styles.caretDown) } iconName='ChevronDown' />
     );
   }
 
   // Render List of items
-  @autobind
-  private _onRenderList(props: IDropdownProps): JSX.Element {
+  private _onRenderList = (props: IDropdownProps): JSX.Element => {
     const {
       onRenderItem = this._onRenderItem
     } = this.props;
@@ -427,8 +421,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   // Render items
-  @autobind
-  private _onRenderItem(item: IDropdownOption): JSX.Element | null {
+  private _onRenderItem = (item: IDropdownOption): JSX.Element | null => {
     switch (item.itemType) {
       case SelectableOptionMenuItemType.Divider:
         return this._renderSeparator(item);
@@ -467,8 +460,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   // Render menu item
-  @autobind
-  private _renderOption(item: IDropdownOption): JSX.Element {
+  private _renderOption = (item: IDropdownOption): JSX.Element => {
     const { onRenderOption = this._onRenderOption } = this.props;
     const { selectedIndices = [] } = this.state;
     const id = this._id;
@@ -542,25 +534,21 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   // Render content of item (i.e. text/icon inside of button)
-  @autobind
-  private _onRenderOption(item: IDropdownOption): JSX.Element {
+  private _onRenderOption = (item: IDropdownOption): JSX.Element => {
     return <span className={ css('ms-Dropdown-optionText', styles.optionText) }>{ item.text }</span>;
   }
 
   // Render custom label for drop down item
-  @autobind
-  private _onRenderLabel(item: IDropdownOption) {
+  private _onRenderLabel = (item: IDropdownOption): JSX.Element | null => {
     const { onRenderOption = this._onRenderOption } = this.props;
     return onRenderOption(item, this._onRenderOption);
   }
 
-  @autobind
-  private _onPositioned() {
+  private _onPositioned = (): void => {
     this._focusZone.focus();
   }
 
-  @autobind
-  private _onItemClick(item: IDropdownOption): () => void {
+  private _onItemClick = (item: IDropdownOption): () => void => {
     return (): void => {
       if (!item.disabled) {
         this.setSelectedIndex(item.index!);
@@ -578,8 +566,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
    * Scroll handler for the callout to make sure the mouse events
    * for updating focus are not interacting during scroll
    */
-  @autobind
-  private _onScroll() {
+  private _onScroll = (): void => {
     if (!this._isScrollIdle && this._scrollIdleTimeoutId !== undefined) {
       this._async.clearTimeout(this._scrollIdleTimeoutId);
       this._scrollIdleTimeoutId = undefined;
@@ -609,8 +596,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     targetElement.focus();
   }
 
-  @autobind
-  private _onMouseItemLeave(item: any, ev: React.MouseEvent<HTMLElement>) {
+  private _onMouseItemLeave = (item: any, ev: React.MouseEvent<HTMLElement>): void => {
     if (!this._isScrollIdle) {
       return;
     }
@@ -627,8 +613,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     }
   }
 
-  @autobind
-  private _onDismiss() {
+  private _onDismiss = (): void => {
     this.setState({ isOpen: false });
     this._dropDown.focus();
   }
@@ -684,8 +669,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     }));
   }
 
-  @autobind
-  private _onDropdownBlur(ev: React.FocusEvent<HTMLDivElement>) {
+  private _onDropdownBlur = (ev: React.FocusEvent<HTMLDivElement>): void => {
     if (this.state.isOpen) {
       // Do not onBlur when the callout is opened
       return;
@@ -695,8 +679,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     }
   }
 
-  @autobind
-  private _onDropdownKeyDown(ev: React.KeyboardEvent<HTMLDivElement>) {
+  private _onDropdownKeyDown = (ev: React.KeyboardEvent<HTMLDivElement>): void => {
     if (this.props.onKeyDown) {
       this.props.onKeyDown(ev);
       if (ev.preventDefault) {
@@ -772,8 +755,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     }
   }
 
-  @autobind
-  private _onDropdownKeyUp(ev: React.KeyboardEvent<HTMLDivElement>) {
+  private _onDropdownKeyUp = (ev: React.KeyboardEvent<HTMLDivElement>): void => {
     if (this.props.onKeyUp) {
       this.props.onKeyUp(ev);
       if (ev.preventDefault) {
@@ -795,8 +777,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     ev.preventDefault();
   }
 
-  @autobind
-  private _onZoneKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+  private _onZoneKeyDown = (ev: React.KeyboardEvent<HTMLElement>): void => {
     let elementToFocus;
 
     switch (ev.which) {
@@ -847,8 +828,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     ev.preventDefault();
   }
 
-  @autobind
-  private _onDropdownClick(ev: React.MouseEvent<HTMLDivElement>) {
+  private _onDropdownClick = (ev: React.MouseEvent<HTMLDivElement>): void => {
     if (this.props.onClick) {
       this.props.onClick(ev);
       if (ev.preventDefault) {
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
index 9bae4145c9360..15c5f8ddab83a 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import {
   BaseComponent,
   KeyCodes,
-  autobind,
   elementContains,
   getNativeProps,
   divProperties,
@@ -117,8 +116,7 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
     }
   }
 
-  @autobind
-  private _onKeyboardHandler(ev: React.KeyboardEvent<HTMLElement>) {
+  private _onKeyboardHandler = (ev: React.KeyboardEvent<HTMLElement>): void => {
     if (ev.which !== KeyCodes.tab) {
       return;
     }
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 8047034318a58..58ac0603cead9 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -9,7 +9,6 @@ import {
   BaseComponent,
   EventGroup,
   KeyCodes,
-  autobind,
   css,
   divProperties,
   elementContains,
@@ -206,8 +205,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     return false;
   }
 
-  @autobind
-  private _onFocus(ev: React.FocusEvent<HTMLElement>) {
+  private _onFocus = (ev: React.FocusEvent<HTMLElement>): void => {
     const { onActiveElementChanged } = this.props;
 
     if (this._isImmediateDescendantOfZone(ev.target as HTMLElement)) {
@@ -238,8 +236,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     }
   }
 
-  @autobind
-  private _onMouseDown(ev: React.MouseEvent<HTMLElement>) {
+  private _onMouseDown = (ev: React.MouseEvent<HTMLElement>): void => {
     const { disabled } = this.props;
 
     if (disabled) {
@@ -293,8 +290,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   /**
    * Handle the keystrokes.
    */
-  @autobind
-  private _onKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+  private _onKeyDown = (ev: React.KeyboardEvent<HTMLElement>): boolean | undefined => {
     const { direction, disabled, isInnerZoneKeystroke } = this.props;
 
     if (disabled) {
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
index a705cab90dc2d..f30a12023f958 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupHeader.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import {
   BaseComponent,
-  autobind,
   css
 } from '../../Utilities';
 import { IGroupDividerProps } from './GroupedList.types';
@@ -130,8 +129,7 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
     );
   }
 
-  @autobind
-  private _onToggleCollapse(ev: React.MouseEvent<HTMLElement>) {
+  private _onToggleCollapse = (ev: React.MouseEvent<HTMLElement>): void => {
     const { group, onToggleCollapse, isGroupLoading } = this.props;
     const { isCollapsed } = this.state;
 
@@ -150,8 +148,7 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
     ev.preventDefault();
   }
 
-  @autobind
-  private _onToggleSelectGroupClick(ev: React.MouseEvent<HTMLElement>) {
+  private _onToggleSelectGroupClick = (ev: React.MouseEvent<HTMLElement>): void => {
     const { onToggleSelectGroup, group } = this.props;
 
     if (onToggleSelectGroup) {
@@ -162,8 +159,7 @@ export class GroupHeader extends BaseComponent<IGroupDividerProps, IGroupHeaderS
     ev.stopPropagation();
   }
 
-  @autobind
-  private _onHeaderClick() {
+  private _onHeaderClick = (): void => {
     const { group, onGroupHeaderClick, onToggleSelectGroup } = this.props;
 
     if (onGroupHeaderClick) {
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupShowAll.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupShowAll.tsx
index 3480dd5a106e2..9b2e68a480f39 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupShowAll.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupShowAll.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import {
   BaseComponent,
-  autobind,
   css
 } from '../../Utilities';
 import { Link } from '../../Link';
@@ -37,8 +36,7 @@ export class GroupShowAll extends BaseComponent<IGroupDividerProps, {}> {
     return null;
   }
 
-  @autobind
-  private _onSummarizeClick(ev: React.MouseEvent<HTMLElement>) {
+  private _onSummarizeClick = (ev: React.MouseEvent<HTMLElement>): void => {
     this.props.onToggleSummarize!(this.props.group!);
 
     ev.stopPropagation();
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
index 26f914eb1d8b4..b3c96e75b00dc 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import {
   BaseComponent,
   IRectangle,
-  autobind,
   assign,
   css
 } from '../../Utilities';
@@ -80,7 +79,7 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
     }
   }
 
-  public render() {
+  public render(): JSX.Element {
     const {
       className,
       usePageCache,
@@ -139,8 +138,7 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
     }
   }
 
-  @autobind
-  private _renderGroup(group: any, groupIndex: number) {
+  private _renderGroup = (group: any, groupIndex: number): JSX.Element | null => {
     const {
       dragDropEvents,
       dragDropHelper,
@@ -220,8 +218,7 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
     return level;
   }
 
-  @autobind
-  private _onToggleCollapse(group: IGroup) {
+  private _onToggleCollapse = (group: IGroup): void => {
     const { groupProps } = this.props;
     const onToggleCollapse = groupProps && groupProps.headerProps && groupProps.headerProps.onToggleCollapse;
 
@@ -236,8 +233,7 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
     }
   }
 
-  @autobind
-  private _onToggleSelectGroup(group: IGroup) {
+  private _onToggleSelectGroup = (group: IGroup): void => {
     if (group) {
       this.props.selection!.toggleRangeSelected(group.startIndex, group.count);
     }
@@ -265,8 +261,7 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
     }
   }
 
-  @autobind
-  private _onToggleSummarize(group: IGroup) {
+  private _onToggleSummarize = (group: IGroup): void => {
     const { groupProps } = this.props;
     const onToggleSummarize = groupProps && groupProps.showAllProps && groupProps.showAllProps.onToggleSummarize;
 
@@ -281,10 +276,9 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
     }
   }
 
-  @autobind
-  private _getPageSpecification(itemIndex: number, visibleRect: IRectangle): {
+  private _getPageSpecification = (itemIndex: number, visibleRect: IRectangle): {
     key?: string;
-  } {
+  } => {
     const groups = this.state.groups;
     const pageGroup = groups && groups[itemIndex];
     return {
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
index e50e4fa1810ce..a0719c4a7e38e 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
@@ -13,8 +13,7 @@ import {
 import {
   BaseComponent,
   IRenderFunction,
-  IDisposable,
-  autobind
+  IDisposable
 } from '../../Utilities';
 
 import {
@@ -271,18 +270,15 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
     }
   }
 
-  @autobind
-  private _onRenderGroupHeader(props: IGroupDividerProps) {
+  private _onRenderGroupHeader = (props: IGroupDividerProps): JSX.Element => {
     return <GroupHeader { ...props } />;
   }
 
-  @autobind
-  private _onRenderGroupShowAll(props: IGroupDividerProps) {
+  private _onRenderGroupShowAll = (props: IGroupDividerProps): JSX.Element => {
     return <GroupShowAll { ...props } />;
   }
 
-  @autobind
-  private _onRenderGroupFooter(props: IGroupDividerProps) {
+  private _onRenderGroupFooter = (props: IGroupDividerProps): JSX.Element => {
     return <GroupFooter { ...props } />;
   }
 
@@ -327,8 +323,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
     );
   }
 
-  @autobind
-  private _renderSubGroup(subGroup: any, subGroupIndex: number) {
+  private _renderSubGroup = (subGroup: any, subGroupIndex: number): JSX.Element | null => {
     const {
       dragDropEvents,
       dragDropHelper,
@@ -389,8 +384,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
   /**
    * collect all the data we need to enable drag/drop for a group
    */
-  @autobind
-  private _getGroupDragDropOptions(): IDragDropOptions {
+  private _getGroupDragDropOptions = (): IDragDropOptions => {
     const { group, groupIndex, dragDropEvents, eventsToRegister } = this.props;
     const options = {
       eventMap: eventsToRegister,
@@ -410,8 +404,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
    * @param {boolean} newValue (new isDropping state value)
    * @param {DragEvent} event (the event trigger dropping state change which can be dragenter, dragleave etc)
    */
-  @autobind
-  private _updateDroppingState(newIsDropping: boolean, event: DragEvent) {
+  private _updateDroppingState = (newIsDropping: boolean, event: DragEvent): void => {
     const { isDropping } = this.state;
     const { dragDropEvents } = this.props;
 
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
index 49cda04fc7e26..4a90d59729646 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
@@ -6,8 +6,7 @@ import {
   getNativeProps,
   divProperties,
   customizable,
-  KeyCodes,
-  autobind
+  KeyCodes
 } from '../../Utilities';
 import { IExpandingCardProps, IExpandingCardStyles, ExpandingCardMode } from './ExpandingCard.types';
 import { Callout, ICallout } from '../../Callout';
@@ -103,15 +102,13 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
     );
   }
 
-  @autobind
-  private _onKeyDown(ev: React.KeyboardEvent<HTMLElement>): void {
+  private _onKeyDown = (ev: React.KeyboardEvent<HTMLElement>): void => {
     if (ev.which === KeyCodes.escape) {
       this.props.onLeave && this.props.onLeave(ev);
     }
   }
 
-  @autobind
-  private _onRenderCompactCard(): JSX.Element {
+  private _onRenderCompactCard = (): JSX.Element => {
     return (
       <div className={ mergeStyles(this._styles.compactCard, { height: this.props.compactCardHeight + 'px' }) as string }>
         { this.props.onRenderCompactCard!(this.props.renderData) }
@@ -119,8 +116,7 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
     );
   }
 
-  @autobind
-  private _onRenderExpandedCard(): JSX.Element {
+  private _onRenderExpandedCard = (): JSX.Element => {
     // firstFrameRendered helps in initially setting height of expanded card to 1px, even if
     // mode prop is set to ExpandingCardMode.expanded on first render. This is to make sure transition animation takes place.
     !this.state.firstFrameRendered && this._async.requestAnimationFrame(() => {
@@ -144,9 +140,7 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
     );
   }
 
-  @autobind
-  // tslint:disable-next-line:no-unused-variable
-  private _checkNeedsScroll(): void {
+  private _checkNeedsScroll = (): void => {
     if (this._expandedElem) {
       this._async.requestAnimationFrame(() => {
         if (this._expandedElem.scrollHeight >= this.props.expandedCardHeight!) {
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
index 7eaafff26e288..fd03220d9fd85 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
@@ -3,7 +3,6 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import {
   BaseComponent,
-  autobind,
   divProperties,
   getNativeProps,
   getId,
@@ -66,7 +65,7 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
       this._events.on(target, 'blur', this._cardDismiss);
     }
     if (this.props.instantOpenOnClick) {
-      this._events.on(target, 'click', this._instantOpenExpanded);
+      this._events.on(target, 'click', this._instantOpenAsExpanded);
     } else {
       this._events.on(target, 'mousedown', this._cardDismiss);
       this._events.on(target, 'keydown', this._cardDismiss);
@@ -146,8 +145,7 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
   }
 
   // Show HoverCard
-  @autobind
-  private _cardOpen(ev: MouseEvent) {
+  private _cardOpen = (ev: MouseEvent): void => {
     if (ev.type === 'keydown' && !(ev.which === KeyCodes.c)) {
       return;
     }
@@ -159,8 +157,7 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
     this._executeCardOpen(ev);
   }
 
-  @autobind
-  private _executeCardOpen(ev: MouseEvent) {
+  private _executeCardOpen = (ev: MouseEvent): void => {
     this._async.clearTimeout(this._openTimerId);
     this._openTimerId = this._async.setTimeout(() => {
       this.setState((prevState: IHoverCardState) => {
@@ -176,8 +173,7 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
   }
 
   // Hide HoverCard
-  @autobind
-  private _cardDismiss(ev: MouseEvent) {
+  private _cardDismiss = (ev: MouseEvent) => {
     if (ev.type === 'keydown' && (ev.which !== KeyCodes.escape)) {
       return;
     }
@@ -188,8 +184,7 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
     }
   }
 
-  @autobind
-  private _executeCardDimiss() {
+  private _executeCardDimiss = (): void => {
     this._async.clearTimeout(this._openTimerId);
     this._async.clearTimeout(this._dismissTimerId);
     this._dismissTimerId = this._async.setTimeout(() => {
@@ -201,9 +196,7 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
     }, this.props.cardDismissDelay!);
   }
 
-  // Instant Open the card in Expanded mode
-  @autobind
-  private _instantOpenExpanded(ev: React.MouseEvent<HTMLDivElement>) {
+  private _instantOpenAsExpanded = (ev: React.MouseEvent<HTMLDivElement>): void => {
     this._async.clearTimeout(this._dismissTimerId);
 
     this.setState((prevState: IHoverCardState) => {
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx
index ce2ebe0699bc5..707b3452794fd 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx
@@ -2,7 +2,6 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import {
-  autobind,
   BaseComponent,
   classNamesFunction,
   customizable,
@@ -127,8 +126,7 @@ export class ImageBase extends BaseComponent<IImageProps, IImageState> {
     );
   }
 
-  @autobind
-  private _onImageLoaded(ev: React.SyntheticEvent<HTMLImageElement>): void {
+  private _onImageLoaded = (ev: React.SyntheticEvent<HTMLImageElement>): void => {
     const { src, onLoad } = this.props;
     if (onLoad) {
       onLoad(ev);
@@ -192,8 +190,7 @@ export class ImageBase extends BaseComponent<IImageProps, IImageState> {
     }
   }
 
-  @autobind
-  private _onImageError(ev: React.SyntheticEvent<HTMLImageElement>) {
+  private _onImageError = (ev: React.SyntheticEvent<HTMLImageElement>): void => {
     if (this.props.onError) {
       this.props.onError(ev);
     }
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.base.tsx b/packages/office-ui-fabric-react/src/components/Link/Link.base.tsx
index 0da0938e619a8..95eeb01fe927f 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.base.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import {
   anchorProperties,
-  autobind,
   BaseComponent,
   buttonProperties,
   classNamesFunction,
@@ -65,8 +64,7 @@ export class LinkBase extends BaseComponent<ILinkProps, any> implements ILink {
     }
   }
 
-  @autobind
-  private _onClick(ev: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>) {
+  private _onClick = (ev: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>) => {
     const { onClick, disabled } = this.props;
 
     if (disabled) {
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index 607d2d006d82c..8db9e856ee8de 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -8,8 +8,7 @@ import {
   getParent,
   divProperties,
   getNativeProps,
-  IRenderFunction,
-  autobind
+  IRenderFunction
 } from '../../Utilities';
 import { IList, IListProps, IPage, IPageProps } from './List.types';
 
@@ -424,8 +423,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     };
   }
 
-  @autobind
-  private _onRenderPage(pageProps: IPageProps, defaultRender?: IRenderFunction<IPageProps>): any {
+  private _onRenderPage = (pageProps: IPageProps, defaultRender?: IRenderFunction<IPageProps>): any => {
     const {
       onRenderCell,
       role
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
index 4ba53eb325c61..f3049b6ee9dd3 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
@@ -6,7 +6,6 @@ import {
   BaseComponent,
   IPoint,
   IRectangle,
-  autobind,
   css,
   findScrollableParent,
   getDistanceBetweenPoints,
@@ -152,8 +151,7 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
     return false;
   }
 
-  @autobind
-  private _onMouseDown(ev: MouseEvent) {
+  private _onMouseDown = (ev: MouseEvent): void => {
     const { isEnabled, onShouldStartSelection } = this.props;
 
     // Ensure the mousedown is within the boundaries of the target. If not, it may have been a click on a scrollbar.
@@ -182,8 +180,7 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
     }
   }
 
-  @autobind
-  private _onTouchStart(ev: TouchEvent) {
+  private _onTouchStart = (ev: TouchEvent): void => {
     this._isTouch = true;
 
     this._async.setTimeout(() => {
@@ -191,8 +188,7 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
     }, 0);
   }
 
-  @autobind
-  private _onPointerDown(ev: PointerEvent) {
+  private _onPointerDown = (ev: PointerEvent): void => {
     if (ev.pointerType === 'touch') {
       this._isTouch = true;
 
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
index ee806b0537517..ef3ae6c881567 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.tsx
@@ -3,7 +3,6 @@ import {
   BaseComponent,
   DelayedRender,
   css,
-  autobind,
   getId
 } from '../../Utilities';
 import { IconButton } from '../../Button';
@@ -206,8 +205,7 @@ export class MessageBar extends BaseComponent<IMessageBarProps, IMessageBarState
     return 'polite';
   }
 
-  @autobind
-  private _onClick(ev: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>) {
+  private _onClick = (ev: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>) => {
     this.setState({ expandSingleLine: !this.state.expandSingleLine });
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx b/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
index 6e2e593873acc..1501432da5fcc 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.base.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import {
-  autobind,
   BaseComponent,
   classNamesFunction,
   customizable,
@@ -117,8 +116,7 @@ export class NavBase extends BaseComponent<INavProps, INavState> implements INav
     return this.state.selectedKey;
   }
 
-  @autobind
-  private _onRenderLink(link: INavLink) {
+  private _onRenderLink = (link: INavLink): JSX.Element => {
     const { getStyles, groups, theme } = this.props;
     const classNames = getClassNames(getStyles!, { theme: theme!, groups });
     return (<div className={ classNames.linkText }>{ link.name }</div>);
@@ -225,8 +223,7 @@ export class NavBase extends BaseComponent<INavProps, INavState> implements INav
     );
   }
 
-  @autobind
-  private _renderGroup(group: INavLinkGroup, groupIndex: number): React.ReactElement<{}> {
+  private _renderGroup = (group: INavLinkGroup, groupIndex: number): React.ReactElement<{}> => {
     const { getStyles, groups, theme } = this.props;
     const classNames = getClassNames(getStyles!, {
       theme: theme!,
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
index c2199b343799c..350d3b3c57fb5 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import {
   css,
-  autobind,
   BaseComponent
 } from '../../Utilities';
 import { mergeStyles } from '../../Styling';
@@ -50,8 +49,7 @@ export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> implements
     }
   }
 
-  @autobind
-  private _onRenderItems(items: IOverflowSetItemProps[]): JSX.Element[] {
+  private _onRenderItems = (items: IOverflowSetItemProps[]): JSX.Element[] => {
     return items.map((item, i) => {
       const wrapperDivProps: React.HTMLProps<HTMLDivElement> = { className: css('ms-OverflowSet-item', styles.item) };
 
@@ -63,8 +61,7 @@ export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> implements
     });
   }
 
-  @autobind
-  private _onRenderOverflowButtonWrapper(items: any[]): JSX.Element {
+  private _onRenderOverflowButtonWrapper = (items: any[]): JSX.Element => {
     const wrapperDivProps: React.HTMLProps<HTMLDivElement> = { className: css('ms-OverflowSet-overflowButton', styles.item) };
     return (
       <div { ...wrapperDivProps }>
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
index baee354cc6acd..789959bdd1fdb 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
@@ -4,7 +4,6 @@ import * as React from 'react';
 
 import {
   BaseComponent,
-  autobind,
   css,
   getId,
   getRTL
@@ -202,8 +201,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
     }
   }
 
-  @autobind
-  public dismiss() {
+  public dismiss = (): void => {
     if (this.state.isOpen) {
       this.setState({
         isOpen: false,
@@ -218,8 +216,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
     }
   }
 
-  @autobind
-  private _onRenderNavigation(props: IPanelProps): JSX.Element | null {
+  private _onRenderNavigation = (props: IPanelProps): JSX.Element | null => {
     const {
       closeButtonAriaLabel,
       hasCloseButton
@@ -253,8 +250,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
     return null;
   }
 
-  @autobind
-  private _onRenderHeader(props: IPanelProps): JSX.Element | null {
+  private _onRenderHeader = (props: IPanelProps): JSX.Element | null => {
     const {
       headerText,
       componentId,
@@ -273,8 +269,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
     return null;
   }
 
-  @autobind
-  private _onRenderBody(props: IPanelProps): JSX.Element {
+  private _onRenderBody = (props: IPanelProps): JSX.Element => {
     const contentClass = css(
       'ms-Panel-content',
       styles.content,
@@ -288,8 +283,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
     );
   }
 
-  @autobind
-  private _onRenderFooter(props: IPanelProps): JSX.Element | null {
+  private _onRenderFooter = (props: IPanelProps): JSX.Element | null => {
     const { isFooterSticky } = this.state;
     const { onRenderFooterContent = null } = this.props;
     if (onRenderFooterContent) {
@@ -304,7 +298,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
     return null;
   }
 
-  private _updateFooterPosition() {
+  private _updateFooterPosition(): void {
     const _content = this._content;
     if (_content) {
       const height = _content.clientHeight;
@@ -316,13 +310,11 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
     }
   }
 
-  @autobind
-  private _onPanelClick() {
+  private _onPanelClick = (): void => {
     this.dismiss();
   }
 
-  @autobind
-  private _onTransitionComplete() {
+  private _onTransitionComplete = (): void => {
     this.setState({
       isAnimating: false
     });
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.base.tsx b/packages/office-ui-fabric-react/src/components/Persona/Persona.base.tsx
index 35ba6e3fd38a1..c64e7ecf63620 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.base.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import {
   BaseComponent,
-  autobind,
   css,
   divProperties,
   getNativeProps,
@@ -120,8 +119,7 @@ export class PersonaBase extends BaseComponent<IPersonaProps, {}> {
     );
   }
 
-  @autobind
-  private _renderElement(text: string | undefined, className: string, render?: IRenderFunction<IPersonaProps>): JSX.Element {
+  private _renderElement = (text: string | undefined, className: string, render?: IRenderFunction<IPersonaProps>): JSX.Element => {
     return (
       <div className={ className }>
         { render
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
index d53682bb98268..a2a4fc2d716bb 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaCoin.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import {
-  autobind,
   css,
   divProperties,
   getInitials,
@@ -146,8 +145,7 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
     );
   }
 
-  @autobind
-  private _onRenderCoin(props: IPersonaProps): JSX.Element | null {
+  private _onRenderCoin = (props: IPersonaProps): JSX.Element | null => {
     const {
       coinSize,
       imageUrl,
@@ -173,8 +171,7 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
     );
   }
 
-  @autobind
-  private _onRenderInitials(props: IPersonaProps): JSX.Element {
+  private _onRenderInitials = (props: IPersonaProps): JSX.Element => {
     let { imageInitials } = props;
     const { primaryText } = props;
 
@@ -189,8 +186,7 @@ export class PersonaCoin extends React.Component<IPersonaProps, IPersonaState> {
     );
   }
 
-  @autobind
-  private _onPhotoLoadingStateChange(loadState: ImageLoadState) {
+  private _onPhotoLoadingStateChange = (loadState: ImageLoadState) => {
     this.setState({
       isImageLoaded: loadState === ImageLoadState.loaded,
       isImageError: loadState === ImageLoadState.error
diff --git a/packages/office-ui-fabric-react/src/components/Persona/PersonaPresence.tsx b/packages/office-ui-fabric-react/src/components/Persona/PersonaPresence.tsx
index 4e37187e95313..cbc4adc36ab51 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/PersonaPresence.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/PersonaPresence.tsx
@@ -1,8 +1,5 @@
 import * as React from 'react';
-import {
-  autobind,
-  css
-} from '../../Utilities';
+import { css } from '../../Utilities';
 import { Icon } from '../../Icon';
 import {
   IPersonaProps,
@@ -45,8 +42,7 @@ export class PersonaPresence extends React.Component<IPersonaProps, {}> {
     );
   }
 
-  @autobind
-  private _determineIcon(): string | undefined {
+  private _determineIcon = (): string | undefined => {
     const { presence } = this.props;
 
     if (presence !== PersonaPresenceEnum.none) {
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
index 728d2cca54ec5..e96dcae184dac 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.tsx
@@ -3,8 +3,7 @@ import {
   BaseComponent,
   KeyCodes,
   css,
-  getId,
-  autobind
+  getId
 } from '../../Utilities';
 import { CommandButton } from '../../Button';
 import { IPivotProps } from './Pivot.types';
@@ -66,7 +65,7 @@ export class Pivot extends BaseComponent<IPivotProps, IPivotState> {
       selectedTabId: this._keyToTabIds[selectedKey!],
     } as IPivotState;
 
-    this._renderLink = this._renderLink.bind(this);
+    this._renderPivotLink = this._renderPivotLink.bind(this);
   }
 
   public componentWillReceiveProps(nextProps: IPivotProps) {
@@ -111,17 +110,13 @@ export class Pivot extends BaseComponent<IPivotProps, IPivotState> {
             { ['ms-Pivot--tabs ' + styles.rootIsTabs]: this.props.linkFormat === PivotLinkFormat.tabs }) }
           role='tablist'
         >
-          { this.state.links.map(this._renderLink) }
+          { this.state.links.map(this._renderPivotLink) }
         </ul>
       </FocusZone>
     );
   }
 
-  /**
-   * Renders a pivot link
-   */
-  @autobind
-  private _renderLink(link: IPivotItemProps) {
+  private _renderPivotLink = (link: IPivotItemProps): JSX.Element => {
     const { itemKey } = link;
     const tabId = this._keyToTabIds[itemKey as string];
     const { onRenderItemLink } = link;
@@ -156,8 +151,7 @@ export class Pivot extends BaseComponent<IPivotProps, IPivotState> {
     );
   }
 
-  @autobind
-  private _renderLinkContent(link: IPivotItemProps): JSX.Element {
+  private _renderLinkContent = (link: IPivotItemProps): JSX.Element => {
     const { itemCount, itemIcon, linkText } = link;
 
     return (
diff --git a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
index fbce41b190d11..38c299c98d72e 100644
--- a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
+++ b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
@@ -5,8 +5,7 @@ import {
   divProperties,
   doesElementContainFocus,
   getDocument,
-  getNativeProps,
-  autobind
+  getNativeProps
 } from '../../Utilities';
 import { IPopupProps } from './Popup.types';
 
@@ -76,8 +75,7 @@ export class Popup extends BaseComponent<IPopupProps, {}> {
     );
   }
 
-  @autobind
-  private _onKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+  private _onKeyDown = (ev: React.KeyboardEvent<HTMLElement>): void => {
     switch (ev.which) {
       case KeyCodes.escape:
 
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
index 79f32b9657e1c..d0426e55b0806 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
@@ -4,7 +4,6 @@ import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
 import * as PropTypes from 'prop-types';
 import {
-  autobind,
   BaseComponent,
   classNamesFunction,
   customizable,
@@ -104,42 +103,35 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
     this._onWindowResize();
   }
 
-  @autobind
-  public subscribe(handler: (headerBound: ClientRect, footerBound: ClientRect) => void) {
+  public subscribe = (handler: (headerBound: ClientRect, footerBound: ClientRect) => void): void => {
     this._subscribers.add(handler);
   }
 
-  @autobind
-  public unsubscribe(handler: (headerBound: ClientRect, footerBound: ClientRect) => void) {
+  public unsubscribe = (handler: (headerBound: ClientRect, footerBound: ClientRect) => void): void => {
     this._subscribers.delete(handler);
   }
 
-  @autobind
-  public addStickyHeader(sticky: Sticky) {
+  public addStickyHeader = (sticky: Sticky): void => {
     this._addSticky(sticky, this._stickyAbove, this.stickyAbove, () => {
       this.stickyAbove.appendChild(sticky.content);
     });
   }
 
-  @autobind
-  public addStickyFooter(sticky: Sticky) {
+  public addStickyFooter = (sticky: Sticky): void => {
     this._addSticky(sticky, this._stickyBelow, this.stickyBelow, () => {
       this.stickyBelow.insertBefore(sticky.content, this.stickyBelow.firstChild);
     });
   }
 
-  @autobind
-  public removeStickyHeader(sticky: Sticky) {
+  public removeStickyHeader = (sticky: Sticky): void => {
     this._removeSticky(sticky, this._stickyAbove, this.stickyAbove);
   }
 
-  @autobind
-  public removeStickyFooter(sticky: Sticky) {
+  public removeStickyFooter = (sticky: Sticky): void => {
     this._removeSticky(sticky, this._stickyBelow, this.stickyBelow);
   }
 
-  @autobind
-  public notifySubscribers(sort?: boolean): void {
+  public notifySubscribers = (sort?: boolean): void => {
     this._subscribers.forEach((handle) => {
       handle(this.stickyAbove.getBoundingClientRect(), this.stickyBelow.getBoundingClientRect());
     });
@@ -151,8 +143,7 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
     }
   }
 
-  @autobind
-  public getScrollPosition(): number {
+  public getScrollPosition = (): number => {
     return this.root.scrollTop;
   }
 
@@ -190,8 +181,7 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
     }, 5);
   }
 
-  @autobind
-  private _setPlaceholderHeights(stickies: Set<Sticky>) {
+  private _setPlaceholderHeights = (stickies: Set<Sticky>): void => {
     stickies.forEach((sticky, idx) => {
       sticky.setPlaceholderHeight(sticky.content.clientHeight);
     });
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
index 51fbeb97f084a..ce1f9e48726f7 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import { ISearchBoxProps, ISearchBoxStyleProps, ISearchBoxStyles } from './SearchBox.types';
 import {
   BaseComponent,
-  autobind,
   getId,
   KeyCodes,
   customizable,
@@ -134,8 +133,7 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
     }
   }
 
-  @autobind
-  private _onFocusCapture(ev: React.FocusEvent<HTMLElement>) {
+  private _onFocusCapture = (ev: React.FocusEvent<HTMLElement>) => {
     this.setState({
       hasFocus: true
     });
@@ -147,8 +145,7 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
     }
   }
 
-  @autobind
-  private _onClearClick(ev: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>) {
+  private _onClearClick = (ev: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>) => {
     const { clearButtonProps } = this.props;
 
     if (clearButtonProps && clearButtonProps.onClick) {
@@ -160,8 +157,7 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
     }
   }
 
-  @autobind
-  private _onKeyDown(ev: React.KeyboardEvent<HTMLInputElement>) {
+  private _onKeyDown = (ev: React.KeyboardEvent<HTMLInputElement>) => {
 
     switch (ev.which) {
 
@@ -191,8 +187,7 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
     ev.stopPropagation();
   }
 
-  @autobind
-  private _onBlur(ev: React.FocusEvent<HTMLInputElement>) {
+  private _onBlur = (ev: React.FocusEvent<HTMLInputElement>) => {
     this._events.off(this._rootElement, 'blur');
     this.setState({
       hasFocus: false
@@ -203,8 +198,7 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
     }
   }
 
-  @autobind
-  private _onInputChange(ev: React.ChangeEvent<HTMLInputElement>) {
+  private _onInputChange = (ev: React.ChangeEvent<HTMLInputElement>) => {
     const value = ev.target.value;
 
     if (value === this._latestValue) {
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
index b4303db6412e4..7b5263a715f98 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import {
   BaseComponent,
   KeyCodes,
-  autobind,
   css,
   getId,
   getRTL,
@@ -160,8 +159,7 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     return this.state.value;
   }
 
-  @autobind
-  private _getAriaValueText(value: number | undefined): string | void {
+  private _getAriaValueText = (value: number | undefined): string | void => {
     if (this.props.ariaValueText && value !== undefined) {
       return this.props.ariaValueText(value);
     }
@@ -174,8 +172,7 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     };
   }
 
-  @autobind
-  private _onMouseDownOrTouchStart(event: MouseEvent | TouchEvent): void {
+  private _onMouseDownOrTouchStart = (event: MouseEvent | TouchEvent): void => {
     if (event.type === 'mousedown') {
       this._events.on(window, 'mousemove', this._onMouseMoveOrTouchMove, true);
       this._events.on(window, 'mouseup', this._onMouseUpOrTouchEnd, true);
@@ -186,8 +183,7 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     this._onMouseMoveOrTouchMove(event, true);
   }
 
-  @autobind
-  private _onMouseMoveOrTouchMove(event: MouseEvent | TouchEvent, suppressEventCancelation?: boolean): void {
+  private _onMouseMoveOrTouchMove = (event: MouseEvent | TouchEvent, suppressEventCancelation?: boolean): void => {
     const { max, min, step } = this.props;
     const steps: number = (max! - min!) / step!;
     const sliderPositionRect: ClientRect = this._sliderLine.getBoundingClientRect();
@@ -258,8 +254,7 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     });
   }
 
-  @autobind
-  private _onMouseUpOrTouchEnd(): void {
+  private _onMouseUpOrTouchEnd = (): void => {
     // Synchronize the renderedValue to the actual value.
     this.setState({
       renderedValue: this.state.value
@@ -268,8 +263,7 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     this._events.off();
   }
 
-  @autobind
-  private _onKeyDown(event: KeyboardEvent): void {
+  private _onKeyDown = (event: KeyboardEvent): void => {
     let value: number | undefined = this.state.value;
     const { max, min, step } = this.props;
 
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index 8057bb0474ef0..2d191fb380f69 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -6,7 +6,6 @@ import {
   BaseComponent,
   getId,
   KeyCodes,
-  autobind,
   customizable,
   calculatePrecision,
   precisionRound
@@ -265,8 +264,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
     }
   }
 
-  @autobind
-  private _onFocus(ev: React.FocusEvent<HTMLInputElement>) {
+  private _onFocus = (ev: React.FocusEvent<HTMLInputElement>): void => {
     if (this._spinningByMouse || this.state.keyboardSpinDirection !== KeyboardSpinDirection.notSpinning) {
       this._stop();
     }
@@ -280,8 +278,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
     }
   }
 
-  @autobind
-  private _onBlur(ev: React.FocusEvent<HTMLInputElement>): void {
+  private _onBlur = (ev: React.FocusEvent<HTMLInputElement>): void => {
     this._validate(ev);
     this.setState({ isFocused: false });
     if (this.props.onBlur) {
@@ -340,8 +337,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
    * in the input (not when changed via the buttons)
    * @param event - the event that fired
    */
-  @autobind
-  private _validate(event: React.FocusEvent<HTMLInputElement>) {
+  private _validate = (event: React.FocusEvent<HTMLInputElement>): void => {
     const element: HTMLInputElement = event.target as HTMLInputElement;
     const value: string = element.value;
     if (this.state.value) {
@@ -358,8 +354,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
    * without this our value will never change (and validation will not have the correct number)
    * @param event - the event that was fired
    */
-  @autobind
-  private _onInputChange(event: React.FormEvent<HTMLInputElement | HTMLTextAreaElement>): void {
+  private _onInputChange = (event: React.FormEvent<HTMLInputElement | HTMLTextAreaElement>): void => {
     const element: HTMLInputElement = event.target as HTMLInputElement;
     const value: string = element.value;
 
@@ -374,8 +369,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
    * when spinning in response to a mouseDown
    * @param stepFunction - function to use to step by
    */
-  @autobind
-  private _updateValue(shouldSpin: boolean, stepDelay: number, stepFunction: (value: string) => string | void) {
+  private _updateValue = (shouldSpin: boolean, stepDelay: number, stepFunction: (value: string) => string | void): void => {
     const newValue: string | void = stepFunction(this.state.value);
     if (newValue) {
       this._lastValidValue = newValue;
@@ -394,8 +388,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
   /**
    * Stop spinning (clear any currently pending update and set spinning to false)
    */
-  @autobind
-  private _stop() {
+  private _stop = (): void => {
     if (this._currentStepFunctionHandle >= 0) {
       this._async.clearTimeout(this._currentStepFunctionHandle);
       this._currentStepFunctionHandle = -1;
@@ -412,8 +405,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
    * the value when up or down arrow are depressed
    * @param event - the keyboardEvent that was fired
    */
-  @autobind
-  private _handleKeyDown(event: React.KeyboardEvent<HTMLElement>) {
+  private _handleKeyDown = (event: React.KeyboardEvent<HTMLElement>): void => {
     if (this.props.disabled) {
       this._stop();
 
@@ -457,22 +449,18 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
    * if the up or down arrow fired this event
    * @param event stop spinning if we
    */
-  @autobind
-  private _handleKeyUp(event: React.KeyboardEvent<HTMLElement>) {
-
+  private _handleKeyUp = (event: React.KeyboardEvent<HTMLElement>): void => {
     if (this.props.disabled || event.which === KeyCodes.up || event.which === KeyCodes.down) {
       this._stop();
       return;
     }
   }
 
-  @autobind
-  private _onIncrementMouseDown() {
+  private _onIncrementMouseDown = (): void => {
     this._updateValue(true /* shouldSpin */, this._initialStepDelay, this._onIncrement!);
   }
 
-  @autobind
-  private _onDecrementMouseDown() {
+  private _onDecrementMouseDown = (): void => {
     this._updateValue(true /* shouldSpin */, this._initialStepDelay, this._onDecrement!);
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
index be825b12e4bfa..76e69f40d396f 100644
--- a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
+++ b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
@@ -4,10 +4,7 @@ import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
 
 import * as PropTypes from 'prop-types';
-import {
-  BaseComponent,
-  autobind
-} from '../../Utilities';
+import { BaseComponent } from '../../Utilities';
 import { IStickyProps, StickyPositionType } from './Sticky.types';
 
 export interface IStickyState {
@@ -52,7 +49,6 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
     };
   }
 
-  @autobind
   public componentDidMount() {
     if (!this.context.scrollablePane) {
       throw new TypeError('Expected Sticky to be mounted within ScrollablePane');
@@ -136,8 +132,7 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
     );
   }
 
-  @autobind
-  private _onScrollEvent(headerBound: ClientRect, footerBound: ClientRect) {
+  private _onScrollEvent = (headerBound: ClientRect, footerBound: ClientRect) => {
     const { top, bottom } = this.root.getBoundingClientRect();
     const { isStickyTop, isStickyBottom } = this.state;
     const { stickyPosition } = this.props;
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.base.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.base.tsx
index c412598f6e82d..6bd4af289bac7 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/ColorPickerGridCell.base.tsx
@@ -1,8 +1,5 @@
 import * as React from 'react';
-import {
-  autobind,
-  customizable
-} from '../../Utilities';
+import { customizable } from '../../Utilities';
 import {
   IColorCellProps,
   IColorPickerGridCellProps,
@@ -93,8 +90,7 @@ export class ColorPickerGridCellBase extends React.Component<IColorPickerGridCel
  * Render the core of a color cell
  * @returns {JSX.Element} - Element representing the core of the item
  */
-  @autobind
-  private _onRenderColorOption(colorOption: IColorCellProps): JSX.Element {
+  private _onRenderColorOption = (colorOption: IColorCellProps): JSX.Element => {
     // Build an SVG for the cell with the given shape and color properties
     return (
       <svg className={ this._classNames.svg } viewBox='0 0 20 20' fill={ getColorFromString(colorOption.color as string)!.str } >
@@ -107,11 +103,11 @@ export class ColorPickerGridCellBase extends React.Component<IColorPickerGridCel
     );
   }
 
- /**
-  * Validate if the cell's color is white or not to apply whiteCell style
-  * @param inputColor - The color of the current cell
-  * @returns - Whether the cell's color is white or not.
-  */
+  /**
+   * Validate if the cell's color is white or not to apply whiteCell style
+   * @param inputColor - The color of the current cell
+   * @returns - Whether the cell's color is white or not.
+   */
   private _isWhiteCell(inputColor: string | undefined): boolean {
     return inputColor!.toLocaleLowerCase() === '#ffffff';
   }
@@ -119,8 +115,7 @@ export class ColorPickerGridCellBase extends React.Component<IColorPickerGridCel
   /**
    * Method to override the getClassNames func in a button.
    */
-  @autobind
-  private _getClassNames(
+  private _getClassNames = (
     theme: ITheme,
     className: string,
     variantClassName: string,
@@ -129,7 +124,7 @@ export class ColorPickerGridCellBase extends React.Component<IColorPickerGridCel
     disabled: boolean,
     checked: boolean,
     expanded: boolean,
-    isSplit: boolean | undefined): IButtonClassNames {
+    isSplit: boolean | undefined): IButtonClassNames => {
     const styles = getActionButtonStyles(theme);
     return mergeStyleSets(this._classNames as {}, {
       root: [
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
index 55b6d77c10274..c4f7b0d55e540 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.base.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import {
   Async,
-  autobind,
   BaseComponent,
   classNamesFunction,
   customizable,
@@ -139,8 +138,7 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
    * When the whole swatchColorPicker is blurred,
    * make sure to clear the pending focused stated
    */
-  @autobind
-  private _onSwatchColorPickerBlur() {
+  private _onSwatchColorPickerBlur = (): void => {
     if (this.props.onCellFocused) {
       this._cellFocused = false;
       this.props.onCellFocused();
@@ -163,8 +161,7 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
    * @param item - The item to render
    * @returns {JSX.Element} - Element representing the item
    */
-  @autobind
-  private _renderOption(item: IColorCellProps): JSX.Element {
+  private _renderOption = (item: IColorCellProps): JSX.Element => {
     const id = this._id;
 
     return (
@@ -192,8 +189,7 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
   /**
    * Callback passed to the GridCell that will manage triggering the onCellHovered callback for mouseEnter
    */
-  @autobind
-  private _onMouseEnter(ev: React.MouseEvent<HTMLButtonElement>): boolean {
+  private _onMouseEnter = (ev: React.MouseEvent<HTMLButtonElement>): boolean => {
 
     if (!this.props.focusOnHover) {
       if (!this.isNavigationIdle || this.props.disabled) {
@@ -213,8 +209,7 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
   /**
    * Callback passed to the GridCell that will manage Hover/Focus updates
    */
-  @autobind
-  private _onMouseMove(ev: React.MouseEvent<HTMLButtonElement>): boolean {
+  private _onMouseMove = (ev: React.MouseEvent<HTMLButtonElement>): boolean => {
 
     if (!this.props.focusOnHover) {
       if (!this.isNavigationIdle || this.props.disabled) {
@@ -238,9 +233,7 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
   /**
    * Callback passed to the GridCell that will manage Hover/Focus updates
    */
-  @autobind
-  private _onMouseLeave(ev: React.MouseEvent<HTMLButtonElement>): void {
-
+  private _onMouseLeave = (ev: React.MouseEvent<HTMLButtonElement>): void => {
     const parentSelector = this.props.mouseLeaveParentSelector;
 
     if (!this.props.focusOnHover ||
@@ -275,16 +268,14 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
   /**
    * Callback to make sure we don't update the hovered element during mouse wheel
    */
-  @autobind
-  private _onWheel(): void {
+  private _onWheel = (): void => {
     this.setNavigationTimeout();
   }
 
   /**
    * Callback that
    */
-  @autobind
-  private _onKeyDown(ev: React.KeyboardEvent<HTMLButtonElement>): void {
+  private _onKeyDown = (ev: React.KeyboardEvent<HTMLButtonElement>): void => {
     if (
       ev.which === KeyCodes.up ||
       ev.which === KeyCodes.down ||
@@ -316,8 +307,7 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
    * Callback passed to the GridCell class that will trigger the onCellHovered callback of the SwatchColorPicker
    * NOTE: This will not be triggered if shouldFocusOnHover === true
    */
-  @autobind
-  private _onGridCellHovered(item?: IColorCellProps): void {
+  private _onGridCellHovered = (item?: IColorCellProps): void => {
     const { onCellHovered } = this.props;
 
     if (onCellHovered) {
@@ -328,8 +318,7 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
   /**
    * Callback passed to the GridCell class that will trigger the onCellFocus callback of the SwatchColorPicker
    */
-  @autobind
-  private _onGridCellFocused(item?: IColorCellProps): void {
+  private _onGridCellFocused = (item?: IColorCellProps): void => {
     const { onCellFocused } = this.props;
     if (onCellFocused) {
       if (item) {
@@ -346,8 +335,7 @@ export class SwatchColorPickerBase extends BaseComponent<ISwatchColorPickerProps
    * Handle the click on a cell
    * @param item - The cell that the click was fired against
    */
-  @autobind
-  private _onCellClick(item: IColorCellProps) {
+  private _onCellClick = (item: IColorCellProps): void => {
     if (this.props.disabled) {
       return;
     }
diff --git a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
index 2f3dcf4f309b8..fea63772c11c8 100644
--- a/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/Theme/ThemePage.tsx
@@ -6,7 +6,6 @@ import { Callout } from 'office-ui-fabric-react/lib/Callout';
 import { DetailsList, DetailsListLayoutMode as LayoutMode } from 'office-ui-fabric-react/lib/DetailsList';
 import { SelectionMode } from 'office-ui-fabric-react/lib/Selection';
 import { ColorPicker } from 'office-ui-fabric-react/lib/ColorPicker';
-import { autobind } from '../../Utilities';
 import './ThemePage.scss';
 const ThemeCodeExample = require('!raw-loader!office-ui-fabric-react/src/components/Theme/examples/ThemeCode.Example.tsx');
 
@@ -112,8 +111,7 @@ export class ThemePage extends React.Component<IComponentDemoPageProps, {
     );
   }
 
-  @autobind
-  private _createDetailsListRef(component: DetailsList) {
+  private _createDetailsListRef = (component: DetailsList) => {
     this._list = component;
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
index 8ceb7ec121975..e34aeb73d0600 100644
--- a/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ThemeGenerator/ThemeGeneratorPage.tsx
@@ -1,9 +1,6 @@
 import * as React from 'react';
 import './ThemeGeneratorPage.scss';
-import {
-  BaseComponent,
-  autobind
-} from 'office-ui-fabric-react/lib/Utilities';
+import { BaseComponent } from 'office-ui-fabric-react/lib/Utilities';
 
 import {
   loadTheme
@@ -237,9 +234,8 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
     );
   }
 
-  @autobind
   /* tslint:disable:no-unused-variable */
-  private _makeThemeFromImg() {
+  private _makeThemeFromImg = (): void => {
     /* tslint:enable:no-unused-variable */
     this._imgUrl = (document.getElementById('imageUrl') as HTMLInputElement).value;
     (document.getElementById('imagePreview') as HTMLImageElement).src = this._imgUrl;
@@ -266,8 +262,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
     }
   }
 
-  @autobind
-  private _cognitiveVisionCallback(e: any) {
+  private _cognitiveVisionCallback = (e: any): void => {
     const xhr = e.target;
     if (xhr.status === 200) {
       const response = JSON.parse(xhr.response);
@@ -341,13 +336,11 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
     }
   }
 
-  @autobind
-  private _colorPickerOnDismiss() {
+  private _colorPickerOnDismiss = (): void => {
     this.setState({ colorPickerVisible: false });
   }
 
-  @autobind
-  private _semanticSlotRuleChanged(slotRule: IThemeSlotRule, color: string) {
+  private _semanticSlotRuleChanged = (slotRule: IThemeSlotRule, color: string): void => {
     if (this._semanticSlotColorChangeTimeout) {
       clearTimeout(this._semanticSlotColorChangeTimeout);
     }
@@ -361,8 +354,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
     // but high enough that quick changes don't get bogged down by a million changes inbetween
   }
 
-  @autobind
-  private _onSwatchClick(slotRule: IThemeSlotRule, ev: React.MouseEvent<HTMLElement>) {
+  private _onSwatchClick = (slotRule: IThemeSlotRule, ev: React.MouseEvent<HTMLElement>): void => {
     const { colorPickerSlotRule, colorPickerElement } = this.state;
 
     if (colorPickerSlotRule !== null && colorPickerSlotRule !== undefined && !!colorPickerElement && colorPickerSlotRule === slotRule && colorPickerElement === ev.target) { // same one, close it
@@ -372,8 +364,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
     }
   }
 
-  @autobind
-  private _slotWidget(slotRule: IThemeSlotRule) {
+  private _slotWidget = (slotRule: IThemeSlotRule): JSX.Element => {
     return (
       <div key={ slotRule.name } className='ms-themer-slot'>
         { this._colorSquareSwatchWidget(slotRule) }
@@ -387,8 +378,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
     );
   }
 
-  @autobind
-  private _fabricSlotWidget(fabricSlot: FabricSlots) {
+  private _fabricSlotWidget = (fabricSlot: FabricSlots): JSX.Element => {
     return this._slotWidget(this.state.themeRules[FabricSlots[fabricSlot]]);
   }
 
@@ -403,8 +393,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
     );
   }
 
-  @autobind
-  private _accessibilityRow(foreground: FabricSlots, background: FabricSlots) {
+  private _accessibilityRow = (foreground: FabricSlots, background: FabricSlots): JSX.Element => {
     const themeRules = this.state.themeRules;
     const bgc: IColor = themeRules[FabricSlots[background]].color!;
     const fgc: IColor = themeRules[FabricSlots[foreground]].color!;
@@ -425,8 +414,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
     );
   }
 
-  @autobind
-  private _outputSection() {
+  private _outputSection = (): JSX.Element => {
     const themeRules = this.state.themeRules;
 
     // strip out the unnecessary shade slots from the final output theme
@@ -472,8 +460,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
     );
   }
 
-  @autobind
-  private _makeNewTheme() {
+  private _makeNewTheme = (): void => {
     const themeAsJson: { [key: string]: string } = ThemeGenerator.getThemeAsJson(this.state.themeRules);
     console.log('New theme...', themeAsJson);
 
@@ -493,8 +480,7 @@ export class ThemeGeneratorPage extends BaseComponent<{}, IThemeGeneratorPageSta
     console.log('New theme:', finalTheme);
   }
 
-  @autobind
-  private _baseColorSlotPicker(baseSlot: BaseSlots, title: string) {
+  private _baseColorSlotPicker = (baseSlot: BaseSlots, title: string): JSX.Element => {
     let colorChangeTimeout: number;
 
     function _onColorChanged(newColor: string) {
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
index 13ad62e49a8fd..fb56aeb620a8b 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import {
   BaseComponent,
-  autobind,
   getId,
   inputProperties,
   getNativeProps
@@ -71,7 +70,7 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
       offText,
       onAriaLabel,
       onText
-      } = this.props;
+    } = this.props;
     const { isChecked } = this.state;
     const stateText = isChecked ? onText : offText;
     const ariaLabel = isChecked ? onAriaLabel : offAriaLabel;
@@ -122,8 +121,7 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
     }
   }
 
-  @autobind
-  private _onClick(ev: React.MouseEvent<HTMLElement>) {
+  private _onClick = (ev: React.MouseEvent<HTMLElement>) => {
     const { disabled, checked, onChanged, onClick } = this.props;
     const { isChecked } = this.state;
 
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
index 549019c510b50..bec443549ccce 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
@@ -3,7 +3,6 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import {
   BaseComponent,
-  autobind,
   css,
   divProperties,
   getNativeProps,
@@ -66,9 +65,9 @@ export class TooltipHost extends BaseComponent<ITooltipHostProps, ITooltipHostSt
         ) }
         ref={ this._resolveRef('_tooltipHost') }
         { ...{ onFocusCapture: this._onTooltipMouseEnter } }
-        { ...{ onBlurCapture: this._onTooltipMouseLeave } }
+        { ...{ onBlurCapture: this._hideTooltip } }
         onMouseEnter={ this._onTooltipMouseEnter }
-        onMouseLeave={ this._onTooltipMouseLeave }
+        onMouseLeave={ this._hideTooltip }
         aria-describedby={ setAriaDescribedBy && isTooltipVisible && content ? tooltipId : undefined }
       >
         { children }
@@ -80,7 +79,7 @@ export class TooltipHost extends BaseComponent<ITooltipHostProps, ITooltipHostSt
             targetElement={ this._getTargetElement() }
             directionalHint={ directionalHint }
             directionalHintForRTL={ directionalHintForRTL }
-            calloutProps={ assign(calloutProps, { onDismiss: this._onTooltipCallOutDismiss }) }
+            calloutProps={ assign(calloutProps, { onDismiss: this._hideTooltip }) }
             { ...getNativeProps(this.props, divProperties) }
             { ...tooltipProps }
           />
@@ -108,8 +107,7 @@ export class TooltipHost extends BaseComponent<ITooltipHostProps, ITooltipHostSt
   }
 
   // Show Tooltip
-  @autobind
-  private _onTooltipMouseEnter(ev: any) {
+  private _onTooltipMouseEnter = (ev: any): void => {
     const { overflowMode } = this.props;
 
     if (overflowMode !== undefined) {
@@ -122,15 +120,7 @@ export class TooltipHost extends BaseComponent<ITooltipHostProps, ITooltipHostSt
     this._toggleTooltip(true);
   }
 
-  // Hide Tooltip
-  @autobind
-  private _onTooltipMouseLeave(ev: any) {
-    this._toggleTooltip(false);
-  }
-
-  // Hide Tooltip
-  @autobind
-  private _onTooltipCallOutDismiss() {
+  private _hideTooltip = (): void => {
     this._toggleTooltip(false);
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 9351ba8ac6769..0be5a92fd6469 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import {
   BaseComponent,
   KeyCodes,
-  autobind,
   css
 } from '../../Utilities';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
@@ -119,8 +118,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     }
   }
 
-  @autobind
-  public dismissSuggestions(ev?: any) {
+  public dismissSuggestions = (ev?: any): void => {
     const selectItemFunction = () => {
       if (this.props.onDismiss) {
         this.props.onDismiss(
@@ -153,8 +151,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     }
   }
 
-  @autobind
-  public refocusSuggestions(keyCode: KeyCodes) {
+  public refocusSuggestions = (keyCode: KeyCodes): void => {
     this.resetFocus();
     if (this.suggestionStore.suggestions && this.suggestionStore.suggestions.length > 0) {
       if (keyCode === KeyCodes.up) {
@@ -394,8 +391,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     }
   }
 
-  @autobind
-  protected onInputChange(value: string) {
+  protected onInputChange = (value: string): void => {
     this.updateValue(value);
     this.setState({
       moreSuggestionsAvailable: true,
@@ -403,22 +399,19 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     });
   }
 
-  @autobind
-  protected onSuggestionClick(ev: React.MouseEvent<HTMLElement>, item: any, index: number) {
+  protected onSuggestionClick = (ev: React.MouseEvent<HTMLElement>, item: any, index: number): void => {
     this.addItemByIndex(index);
     this.setState({ suggestionsVisible: false });
   }
 
-  @autobind
-  protected onSuggestionRemove(ev: React.MouseEvent<HTMLElement>, item: IPersonaProps, index: number) {
+  protected onSuggestionRemove = (ev: React.MouseEvent<HTMLElement>, item: IPersonaProps, index: number): void => {
     if (this.props.onRemoveSuggestion) {
       (this.props.onRemoveSuggestion as any)(item);
     }
     this.suggestionStore.removeSuggestion(index);
   }
 
-  @autobind
-  protected onInputFocus(ev: React.FocusEvent<HTMLInputElement | Autofill>) {
+  protected onInputFocus = (ev: React.FocusEvent<HTMLInputElement | Autofill>): void => {
     this.setState({ isFocused: true });
     this.selection.setAllSelected(false);
     if (this.input && this.input.value === '' && this.props.onEmptyInputFocus) {
@@ -439,16 +432,14 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     }
   }
 
-  @autobind
-  protected onInputBlur(ev: React.FocusEvent<HTMLInputElement | Autofill>) {
+  protected onInputBlur = (ev: React.FocusEvent<HTMLInputElement | Autofill>): void => {
     this.setState({ isFocused: false });
     if (this.props.inputProps && this.props.inputProps.onBlur) {
       this.props.inputProps.onBlur(ev as React.FocusEvent<HTMLInputElement>);
     }
   }
 
-  @autobind
-  protected onKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+  protected onKeyDown = (ev: React.KeyboardEvent<HTMLElement>): void => {
     const keyCode = ev.which;
     switch (keyCode) {
       case KeyCodes.escape:
@@ -543,8 +534,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     }
   }
 
-  @autobind
-  protected onItemChange(changedItem: T, index: number) {
+  protected onItemChange = (changedItem: T, index: number): void => {
     const { items } = this.state;
 
     if (index >= 0) {
@@ -555,8 +545,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     }
   }
 
-  @autobind
-  protected onGetMoreResults() {
+  protected onGetMoreResults = (): void => {
     this.setState({
       isSearching: true
     }, () => {
@@ -585,8 +574,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     });
   }
 
-  @autobind
-  protected addItemByIndex(index: number): void {
+  protected addItemByIndex = (index: number): void => {
     this.addItem(this.suggestionStore.getSuggestionAtIndex(index).item);
     if (this.input) {
       this.input.clear();
@@ -594,8 +582,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     this.updateValue('');
   }
 
-  @autobind
-  protected addItem(item: T) {
+  protected addItem = (item: T): void => {
     const processedItem: T | PromiseLike<T> | null =
       this.props.onItemSelected ? (this.props.onItemSelected as any)(item) : item;
 
@@ -618,8 +605,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     this.setState({ suggestedDisplayValue: '' });
   }
 
-  @autobind
-  protected removeItem(item: IPickerItemProps<T>) {
+  protected removeItem = (item: IPickerItemProps<T>): void => {
     const { items } = this.state;
     const index: number = items.indexOf(item);
 
@@ -629,8 +615,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     }
   }
 
-  @autobind
-  protected removeItems(itemsToRemove: any[]) {
+  protected removeItems = (itemsToRemove: any[]): void => {
     const { items } = this.state;
     const newItems: T[] = items.filter((item: any) => itemsToRemove.indexOf(item) === -1);
     const firstItemToRemove = itemsToRemove[0];
@@ -651,8 +636,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     }
   }
 
-  @autobind
-  protected _isFocusZoneInnerKeystroke(ev: React.KeyboardEvent<HTMLElement>): boolean {
+  protected _isFocusZoneInnerKeystroke = (ev: React.KeyboardEvent<HTMLElement>): boolean => {
     // If suggestions are shown const up/down keys control them, otherwise allow them through to control the focusZone.
     if (this.state.suggestionsVisible) {
       switch (ev.which) {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
index aec95c5743a6a..a49ac00f9020e 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
@@ -1,7 +1,7 @@
 /* tslint:disable */
 import * as React from 'react';
 /* tslint:enable */
-import { BaseComponent, autobind, css } from '../../../../Utilities';
+import { BaseComponent, css } from '../../../../Utilities';
 import { IPeoplePickerItemWithMenuProps } from './PeoplePickerItem.types';
 import { Persona, PersonaPresence } from '../../../../Persona';
 import { ContextualMenu, DirectionalHint } from '../../../../ContextualMenu';
@@ -68,13 +68,11 @@ export class SelectedItemWithMenu extends BaseComponent<IPeoplePickerItemWithMen
     );
   }
 
-  @autobind
-  private _onContextualMenu(ev?: any) {
+  private _onContextualMenu = (ev?: any): void => {
     this.setState({ contextualMenuVisible: true });
   }
 
-  @autobind
-  private _onCloseContextualMenu(ev: Event) {
+  private _onCloseContextualMenu = (ev: Event) => {
     this.setState({ contextualMenuVisible: false });
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index d39d62bce8d7d..e652f40b14dac 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import {
   BaseComponent,
   css,
-  autobind,
   KeyCodes
 } from '../../../Utilities';
 import { CommandButton, IconButton, IButton } from '../../../Button';
@@ -135,7 +134,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
               styles.actionButton,
               {
                 ['is-selected ' + styles.buttonSelected]:
-                this.state.selectedActionType === SuggestionActionType.forceResolve
+                  this.state.selectedActionType === SuggestionActionType.forceResolve
               }) }
             onClick={ this._forceResolve }
           >
@@ -158,7 +157,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
               styles.actionButton,
               {
                 ['is-selected ' + styles.buttonSelected]:
-                this.state.selectedActionType === SuggestionActionType.searchMore
+                  this.state.selectedActionType === SuggestionActionType.searchMore
               }) }
             iconProps={ { iconName: 'Search' } }
             onClick={ this._getMoreResults }
@@ -193,8 +192,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
   /**
    * Returns true if the event was handled, false otherwise
    */
-  @autobind
-  public tryHandleKeyDown(keyCode: number, currentSuggestionIndex: number): boolean {
+  public tryHandleKeyDown = (keyCode: number, currentSuggestionIndex: number): boolean => {
     let isEventHandled = false;
     let newSelectedActionType = null;
     const currentSelectedAction = this.state.selectedActionType;
@@ -352,41 +350,35 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
       </div>);
   }
 
-  @autobind
-  private _getMoreResults() {
+  private _getMoreResults = (): void => {
     if (this.props.onGetMoreResults) {
       this.props.onGetMoreResults();
     }
   }
 
-  @autobind
-  private _forceResolve() {
+  private _forceResolve = (): void => {
     if (this.props.createGenericItem) {
       this.props.createGenericItem();
     }
   }
 
-  @autobind
-  private _shouldShowForceResolve() {
+  private _shouldShowForceResolve = (): boolean => {
     return this.props.showForceResolve ? this.props.showForceResolve() : false;
   }
 
-  @autobind
-  private _onClickTypedSuggestionsItem(item: T, index: number): (ev: React.MouseEvent<HTMLElement>) => void {
+  private _onClickTypedSuggestionsItem = (item: T, index: number): (ev: React.MouseEvent<HTMLElement>) => void => {
     return (ev: React.MouseEvent<HTMLElement>): void => {
       this.props.onSuggestionClick(ev, item, index);
     };
   }
 
-  @autobind
-  private _refocusOnSuggestions(keyCode: number): void {
+  private _refocusOnSuggestions = (keyCode: number): void => {
     if (typeof this.props.refocusSuggestions === 'function') {
       this.props.refocusSuggestions(keyCode);
     }
   }
 
-  @autobind
-  private _onRemoveTypedSuggestionsItem(item: T, index: number): (ev: React.MouseEvent<HTMLElement>) => void {
+  private _onRemoveTypedSuggestionsItem = (item: T, index: number): (ev: React.MouseEvent<HTMLElement>) => void => {
     return (ev: React.MouseEvent<HTMLElement>): void => {
       const onSuggestionRemove = this.props.onSuggestionRemove!;
       onSuggestionRemove(ev, item, index);
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
index 4b4e47c92db52..140543d2b997a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/SuggestionsController.ts
@@ -1,5 +1,3 @@
-import { autobind } from '../../../Utilities';
-
 export interface ISuggestionModel<T> {
   item: T;
   selected: boolean;
@@ -119,17 +117,15 @@ export class SuggestionsController<T> {
     }
   }
 
-  @autobind
-  private _isSuggestionModel(
+  private _isSuggestionModel = (
     value: ISuggestionModel<T> | T
-    ): value is ISuggestionModel<T> {
+  ): value is ISuggestionModel<T> => {
     return (<ISuggestionModel<T>>value).item !== undefined;
   }
 
-  @autobind
-  private _ensureSuggestionModel(
+  private _ensureSuggestionModel = (
     suggestion: ISuggestionModel<T> | T
-    ): ISuggestionModel<T> {
+  ): ISuggestionModel<T> => {
     if (this._isSuggestionModel(suggestion)) {
       return suggestion as ISuggestionModel<T>;
     } else {
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx b/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx
index b5e8ac9a4a94f..8b9dd4f93b685 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/grid/GridCell.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import {
-  autobind,
   css,
   getId,
 } from '../../Utilities';
@@ -58,8 +57,7 @@ export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P,
     );
   }
 
-  @autobind
-  private _onClick() {
+  private _onClick = (): void => {
     const {
       onClick,
       disabled,
@@ -71,8 +69,7 @@ export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P,
     }
   }
 
-  @autobind
-  private _onMouseEnter(ev: React.MouseEvent<HTMLButtonElement>) {
+  private _onMouseEnter = (ev: React.MouseEvent<HTMLButtonElement>): void => {
     const {
       onHover,
       disabled,
@@ -87,8 +84,7 @@ export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P,
     }
   }
 
-  @autobind
-  private _onMouseMove(ev: React.MouseEvent<HTMLButtonElement>) {
+  private _onMouseMove = (ev: React.MouseEvent<HTMLButtonElement>): void => {
     const {
       onHover,
       disabled,
@@ -103,8 +99,7 @@ export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P,
     }
   }
 
-  @autobind
-  private _onMouseLeave(ev: React.MouseEvent<HTMLButtonElement>) {
+  private _onMouseLeave = (ev: React.MouseEvent<HTMLButtonElement>): void => {
     const {
       onHover,
       disabled,
@@ -118,8 +113,7 @@ export class GridCell<T, P extends IGridCellProps<T>> extends React.Component<P,
     }
   }
 
-  @autobind
-  private _onFocus() {
+  private _onFocus = (): void => {
     const {
       onFocus,
       disabled,
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
index e350b7466eb59..19205f859dea9 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import {
   BaseComponent,
   KeyCodes,
-  autobind,
   elementContains,
   findScrollableParent,
   getParent,
@@ -107,13 +106,11 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
    * been called on an element, so we need a flag to store the idea that we will bypass the "next"
    * focus event that occurs. This method does that.
    */
-  @autobind
-  public ignoreNextFocus() {
+  public ignoreNextFocus = (): void => {
     this._handleNextFocus(false);
   }
 
-  @autobind
-  private _onMouseDownCapture(ev: any) {
+  private _onMouseDownCapture = (ev: any): void => {
     if (document.activeElement !== ev.target && !elementContains(document.activeElement as HTMLElement, ev.target)) {
       this.ignoreNextFocus();
       return;
@@ -140,8 +137,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
    * as long as the focus did not originate from a mouse down/touch event. For those cases, we handle them
    * specially.
    */
-  @autobind
-  private _onFocus(ev: React.FocusEvent<HTMLElement>) {
+  private _onFocus = (ev: React.FocusEvent<HTMLElement>): void => {
     const target = ev.target as HTMLElement;
     const { selection } = this.props;
     const isToggleModifierPressed = this._isCtrlPressed || this._isMetaPressed;
@@ -173,8 +169,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     this._handleNextFocus(false);
   }
 
-  @autobind
-  private _onMouseDown(ev: React.MouseEvent<HTMLElement>) {
+  private _onMouseDown = (ev: React.MouseEvent<HTMLElement>): void => {
     this._updateModifiers(ev);
 
     let target = ev.target as HTMLElement;
@@ -203,13 +198,11 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     }
   }
 
-  @autobind
-  private _onTouchStartCapture(ev: React.TouchEvent<HTMLElement>) {
+  private _onTouchStartCapture = (ev: React.TouchEvent<HTMLElement>): void => {
     this._setIsTouch(true);
   }
 
-  @autobind
-  private _onClick(ev: React.MouseEvent<HTMLElement>) {
+  private _onClick = (ev: React.MouseEvent<HTMLElement>): void => {
     this._updateModifiers(ev);
 
     let target = ev.target as HTMLElement;
@@ -247,8 +240,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     }
   }
 
-  @autobind
-  private _onContextMenu(ev: React.MouseEvent<HTMLElement>) {
+  private _onContextMenu = (ev: React.MouseEvent<HTMLElement>): void => {
     const target = ev.target as HTMLElement;
 
     const { onItemContextMenu, selection } = this.props;
@@ -284,8 +276,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
    * In multi selection, if you double click within an item's root (but not within the invoke element or input elements),
    * we should execute the invoke handler.
    */
-  @autobind
-  private _onDoubleClick(ev: React.MouseEvent<HTMLElement>) {
+  private _onDoubleClick = (ev: React.MouseEvent<HTMLElement>): void => {
     let target = ev.target as HTMLElement;
 
     if (this._isSelectionDisabled(target)) {
@@ -317,15 +308,13 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     }
   }
 
-  @autobind
-  private _onKeyDownCapture(ev: React.KeyboardEvent<HTMLElement>) {
+  private _onKeyDownCapture = (ev: React.KeyboardEvent<HTMLElement>): void => {
     this._updateModifiers(ev);
 
     this._handleNextFocus(true);
   }
 
-  @autobind
-  private _onKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
+  private _onKeyDown = (ev: React.KeyboardEvent<HTMLElement>): boolean | undefined => {
     this._updateModifiers(ev);
 
     let target = ev.target as HTMLElement;
diff --git a/packages/utilities/src/autobind.ts b/packages/utilities/src/autobind.ts
index 834ed03d62168..c57aa87cde410 100644
--- a/packages/utilities/src/autobind.ts
+++ b/packages/utilities/src/autobind.ts
@@ -1,6 +1,7 @@
 /**
  * Autobind is a utility for binding methods in a class. This simplifies tagging methods as being "bound" to the this pointer
  * so that they can be used in scenarios that simply require a function callback.
+ * @deprecated This has been deprecated in favor of using arrow function properties
  */
 // tslint:disable-next-line:no-any
 export function autobind<T extends Function>(target: any, key: string, descriptor: TypedPropertyDescriptor<T>): {

From d1f053c5961ec173f64cdb503a3e278e35823eba Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 19 Mar 2018 10:51:41 -0700
Subject: [PATCH 1597/1641] Applying package updates. (#4308)

---
 apps/fabric-website/CHANGELOG.json            | 26 ++++++++++++
 apps/fabric-website/CHANGELOG.md              | 13 +++++-
 apps/fabric-website/package.json              |  4 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/CHANGELOG.json                  | 19 +++++++++
 apps/todo-app/CHANGELOG.md                    |  9 +++-
 apps/todo-app/package.json                    |  4 +-
 apps/vr-tests/package.json                    |  2 +-
 .../retire-autobind_2018-03-17-15-50.json     | 11 -----
 .../themePrimary-change_2018-03-16-17-25.json | 11 -----
 .../retire-autobind_2018-03-17-15-50.json     | 11 -----
 .../retire-autobind_2018-03-17-15-50.json     | 11 -----
 .../themePrimary-change_2018-03-16-17-25.json | 11 -----
 .../button-focus-hc_2018-03-08-19-39.json     | 11 -----
 .../themePrimary-change_2018-03-16-17-25.json | 11 -----
 .../retire-autobind_2018-03-17-15-50.json     | 11 -----
 ...uo-fixVariantsImport_2018-03-16-22-09.json | 11 -----
 .../themePrimary-change_2018-03-16-17-25.json | 11 -----
 ...1-detailslist-scroll_2018-03-15-23-43.json | 11 -----
 .../button-focus-hc_2018-03-08-19-39.json     | 11 -----
 .../retire-autobind_2018-03-17-15-50.json     | 11 -----
 .../themePrimary-change_2018-03-16-17-25.json | 11 -----
 .../retire-autobind_2018-03-17-15-50.json     | 11 -----
 packages/example-app-base/CHANGELOG.json      | 29 +++++++++++++
 packages/example-app-base/CHANGELOG.md        | 13 +++++-
 packages/example-app-base/package.json        |  6 +--
 packages/experiments/CHANGELOG.json           | 22 ++++++++++
 packages/experiments/CHANGELOG.md             |  9 +++-
 packages/experiments/package.json             |  6 +--
 packages/file-type-icons/package.json         |  2 +-
 packages/icons/package.json                   |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 42 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 ++++++-
 packages/office-ui-fabric-react/package.json  |  8 ++--
 packages/styling/CHANGELOG.json               | 26 ++++++++++++
 packages/styling/CHANGELOG.md                 | 13 +++++-
 packages/styling/package.json                 |  4 +-
 packages/utilities/CHANGELOG.json             | 14 +++++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  2 +-
 packages/variants/CHANGELOG.json              | 26 ++++++++++++
 packages/variants/CHANGELOG.md                | 13 +++++-
 packages/variants/package.json                |  4 +-
 44 files changed, 314 insertions(+), 197 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/retire-autobind_2018-03-17-15-50.json
 delete mode 100644 common/changes/@uifabric/example-app-base/themePrimary-change_2018-03-16-17-25.json
 delete mode 100644 common/changes/@uifabric/experiments/retire-autobind_2018-03-17-15-50.json
 delete mode 100644 common/changes/@uifabric/fabric-website/retire-autobind_2018-03-17-15-50.json
 delete mode 100644 common/changes/@uifabric/fabric-website/themePrimary-change_2018-03-16-17-25.json
 delete mode 100644 common/changes/@uifabric/styling/button-focus-hc_2018-03-08-19-39.json
 delete mode 100644 common/changes/@uifabric/styling/themePrimary-change_2018-03-16-17-25.json
 delete mode 100644 common/changes/@uifabric/utilities/retire-autobind_2018-03-17-15-50.json
 delete mode 100644 common/changes/@uifabric/variants/phkuo-fixVariantsImport_2018-03-16-22-09.json
 delete mode 100644 common/changes/@uifabric/variants/themePrimary-change_2018-03-16-17-25.json
 delete mode 100644 common/changes/office-ui-fabric-react/aditima-ie11-detailslist-scroll_2018-03-15-23-43.json
 delete mode 100644 common/changes/office-ui-fabric-react/button-focus-hc_2018-03-08-19-39.json
 delete mode 100644 common/changes/office-ui-fabric-react/retire-autobind_2018-03-17-15-50.json
 delete mode 100644 common/changes/office-ui-fabric-react/themePrimary-change_2018-03-16-17-25.json
 delete mode 100644 common/changes/todo-app/retire-autobind_2018-03-17-15-50.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 6a04f853aa244..5a3923c868a56 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.5.0",
+      "tag": "@uifabric/fabric-website_v5.5.0",
+      "date": "Mon, 19 Mar 2018 10:27:55 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Mark Polak <mark@thedutchies.com>",
+            "commit": "882c389076125182e5703ad5eb64ae178546f6c4",
+            "comment": "Use arrow function properties instead of @autobind"
+          }
+        ],
+        "minor": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "e3a40d52e73af6e5a0062452e550f1b066c851c2",
+            "comment": "ThemePrimary: Updating this color along with an Office branding update."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.64.4 <6.0.0` to `>=5.65.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.4.0",
       "tag": "@uifabric/fabric-website_v5.4.0",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index 251c264c012b0..b9cb6f046f7e2 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Wed, 14 Mar 2018 10:28:26 GMT and should not be manually modified.
+This log was last generated on Mon, 19 Mar 2018 10:27:55 GMT and should not be manually modified.
+
+## 5.5.0
+Mon, 19 Mar 2018 10:27:55 GMT
+
+### Minor changes
+
+- ThemePrimary: Updating this color along with an Office branding update.
+
+### Patches
+
+- Use arrow function properties instead of @autobind
 
 ## 5.4.0
 Wed, 14 Mar 2018 10:28:26 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 4e7eb5418afb4..caabb11597760 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.4.0",
+  "version": "5.5.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.64.4 <6.0.0",
+    "office-ui-fabric-react": ">=5.65.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 5224163ba7e04..8e7c88f964d52 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.64.4 <6.0.0",
+    "office-ui-fabric-react": ">=5.65.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 1d852cc4510f3..d7b8ad475f673 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.64.4 <6.0.0",
+    "office-ui-fabric-react": ">=5.65.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/CHANGELOG.json b/apps/todo-app/CHANGELOG.json
index a74c6bfd883d1..1c12579b862ce 100644
--- a/apps/todo-app/CHANGELOG.json
+++ b/apps/todo-app/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "todo-app",
   "entries": [
+    {
+      "version": "5.0.2",
+      "tag": "todo-app_v5.0.2",
+      "date": "Mon, 19 Mar 2018 10:27:55 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Mark Polak <mark@thedutchies.com>",
+            "commit": "882c389076125182e5703ad5eb64ae178546f6c4",
+            "comment": "Use arrow function properties instead of @autobind"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.64.4 <6.0.0` to `>=5.65.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.1",
       "tag": "todo-app_v5.0.1",
diff --git a/apps/todo-app/CHANGELOG.md b/apps/todo-app/CHANGELOG.md
index 9248491dc4d8d..50f4691284cbf 100644
--- a/apps/todo-app/CHANGELOG.md
+++ b/apps/todo-app/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - todo-app
 
-This log was last generated on Mon, 12 Mar 2018 06:29:20 GMT and should not be manually modified.
+This log was last generated on Mon, 19 Mar 2018 10:27:55 GMT and should not be manually modified.
+
+## 5.0.2
+Mon, 19 Mar 2018 10:27:55 GMT
+
+### Patches
+
+- Use arrow function properties instead of @autobind
 
 ## 5.0.1
 Mon, 12 Mar 2018 06:29:20 GMT
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 5d0a313af7647..50b7b9d6d541d 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -1,7 +1,7 @@
 {
   "name": "todo-app",
   "description": "Sample todo app using office-ui-fabric-react.",
-  "version": "5.0.1",
+  "version": "5.0.2",
   "private": true,
   "scripts": {
     "build": "node ../../scripts/build.js",
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.64.4 <6.0.0",
+    "office-ui-fabric-react": ">=5.65.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 282922e17bba1..65015cd1b64db 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.64.4 <6.0.0",
+    "office-ui-fabric-react": ">=5.65.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/common/changes/@uifabric/example-app-base/retire-autobind_2018-03-17-15-50.json b/common/changes/@uifabric/example-app-base/retire-autobind_2018-03-17-15-50.json
deleted file mode 100644
index 16c3ecf1205f3..0000000000000
--- a/common/changes/@uifabric/example-app-base/retire-autobind_2018-03-17-15-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Use arrow function properties instead of @autobind",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "mark@thedutchies.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/example-app-base/themePrimary-change_2018-03-16-17-25.json b/common/changes/@uifabric/example-app-base/themePrimary-change_2018-03-16-17-25.json
deleted file mode 100644
index ed155fa4fd8bf..0000000000000
--- a/common/changes/@uifabric/example-app-base/themePrimary-change_2018-03-16-17-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "ThemePrimary: Updating this color along with an Office branding update.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/retire-autobind_2018-03-17-15-50.json b/common/changes/@uifabric/experiments/retire-autobind_2018-03-17-15-50.json
deleted file mode 100644
index 8913998ae14af..0000000000000
--- a/common/changes/@uifabric/experiments/retire-autobind_2018-03-17-15-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Use arrow function properties instead of @autobind",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "mark@thedutchies.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/retire-autobind_2018-03-17-15-50.json b/common/changes/@uifabric/fabric-website/retire-autobind_2018-03-17-15-50.json
deleted file mode 100644
index ee8ddbad80039..0000000000000
--- a/common/changes/@uifabric/fabric-website/retire-autobind_2018-03-17-15-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Use arrow function properties instead of @autobind",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "mark@thedutchies.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/fabric-website/themePrimary-change_2018-03-16-17-25.json b/common/changes/@uifabric/fabric-website/themePrimary-change_2018-03-16-17-25.json
deleted file mode 100644
index 8ec9e026f4860..0000000000000
--- a/common/changes/@uifabric/fabric-website/themePrimary-change_2018-03-16-17-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "ThemePrimary: Updating this color along with an Office branding update.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/button-focus-hc_2018-03-08-19-39.json b/common/changes/@uifabric/styling/button-focus-hc_2018-03-08-19-39.json
deleted file mode 100644
index 2fad2370e107a..0000000000000
--- a/common/changes/@uifabric/styling/button-focus-hc_2018-03-08-19-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "High contrast mode for focus styling.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/themePrimary-change_2018-03-16-17-25.json b/common/changes/@uifabric/styling/themePrimary-change_2018-03-16-17-25.json
deleted file mode 100644
index 4d463fc84d81c..0000000000000
--- a/common/changes/@uifabric/styling/themePrimary-change_2018-03-16-17-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "ThemePrimary: Updating this color along with an Office branding update.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/retire-autobind_2018-03-17-15-50.json b/common/changes/@uifabric/utilities/retire-autobind_2018-03-17-15-50.json
deleted file mode 100644
index 6ee10a304e094..0000000000000
--- a/common/changes/@uifabric/utilities/retire-autobind_2018-03-17-15-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Use arrow function properties instead of @autobind",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "mark@thedutchies.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/variants/phkuo-fixVariantsImport_2018-03-16-22-09.json b/common/changes/@uifabric/variants/phkuo-fixVariantsImport_2018-03-16-22-09.json
deleted file mode 100644
index 93545c0157da3..0000000000000
--- a/common/changes/@uifabric/variants/phkuo-fixVariantsImport_2018-03-16-22-09.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/variants",
-      "comment": "fix imports so it works with amd",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/variants",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/variants/themePrimary-change_2018-03-16-17-25.json b/common/changes/@uifabric/variants/themePrimary-change_2018-03-16-17-25.json
deleted file mode 100644
index fb9e9ff4c062a..0000000000000
--- a/common/changes/@uifabric/variants/themePrimary-change_2018-03-16-17-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/variants",
-      "comment": "ThemePrimary: Updating this color along with an Office branding update.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/variants",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/aditima-ie11-detailslist-scroll_2018-03-15-23-43.json b/common/changes/office-ui-fabric-react/aditima-ie11-detailslist-scroll_2018-03-15-23-43.json
deleted file mode 100644
index a749b95cba370..0000000000000
--- a/common/changes/office-ui-fabric-react/aditima-ie11-detailslist-scroll_2018-03-15-23-43.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: scrollbars show up unnecessarily on IE11",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "aditima@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/button-focus-hc_2018-03-08-19-39.json b/common/changes/office-ui-fabric-react/button-focus-hc_2018-03-08-19-39.json
deleted file mode 100644
index a902df6b876d6..0000000000000
--- a/common/changes/office-ui-fabric-react/button-focus-hc_2018-03-08-19-39.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Button: High contrast mode focus bug fixes.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/retire-autobind_2018-03-17-15-50.json b/common/changes/office-ui-fabric-react/retire-autobind_2018-03-17-15-50.json
deleted file mode 100644
index 071c5ddd6dee2..0000000000000
--- a/common/changes/office-ui-fabric-react/retire-autobind_2018-03-17-15-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Use arrow function properties instead of @autobind",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mark@thedutchies.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/themePrimary-change_2018-03-16-17-25.json b/common/changes/office-ui-fabric-react/themePrimary-change_2018-03-16-17-25.json
deleted file mode 100644
index 29b04286ac6e2..0000000000000
--- a/common/changes/office-ui-fabric-react/themePrimary-change_2018-03-16-17-25.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ThemePrimary: Updating this color along with an Office branding update.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/todo-app/retire-autobind_2018-03-17-15-50.json b/common/changes/todo-app/retire-autobind_2018-03-17-15-50.json
deleted file mode 100644
index e00f2578a18d7..0000000000000
--- a/common/changes/todo-app/retire-autobind_2018-03-17-15-50.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "todo-app",
-      "comment": "Use arrow function properties instead of @autobind",
-      "type": "patch"
-    }
-  ],
-  "packageName": "todo-app",
-  "email": "mark@thedutchies.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 5396b1ccc87c6..2089221166800 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,35 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "5.4.0",
+      "tag": "@uifabric/example-app-base_v5.4.0",
+      "date": "Mon, 19 Mar 2018 10:27:55 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Mark Polak <mark@thedutchies.com>",
+            "commit": "882c389076125182e5703ad5eb64ae178546f6c4",
+            "comment": "Use arrow function properties instead of @autobind"
+          }
+        ],
+        "minor": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "e3a40d52e73af6e5a0062452e550f1b066c851c2",
+            "comment": "ThemePrimary: Updating this color along with an Office branding update."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.19.1 <6.0.0` to `>=5.20.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.18.2 <6.0.0` to `>=5.18.3 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.3.0",
       "tag": "@uifabric/example-app-base_v5.3.0",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index f876906e5f52d..ce37baebd60f1 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Fri, 02 Mar 2018 11:25:35 GMT and should not be manually modified.
+This log was last generated on Mon, 19 Mar 2018 10:27:55 GMT and should not be manually modified.
+
+## 5.4.0
+Mon, 19 Mar 2018 10:27:55 GMT
+
+### Minor changes
+
+- ThemePrimary: Updating this color along with an Office branding update.
+
+### Patches
+
+- Use arrow function properties instead of @autobind
 
 ## 5.3.0
 Fri, 02 Mar 2018 11:25:35 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index dd2ecde9867a2..716a581356217 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "5.3.0",
+  "version": "5.4.0",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -32,8 +32,8 @@
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.19.1 <6.0.0",
-    "@uifabric/utilities": ">=5.18.2 <6.0.0",
+    "@uifabric/styling": ">=5.20.0 <6.0.0",
+    "@uifabric/utilities": ">=5.18.3 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index 7e959a5634a09..f6b07623ce839 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.25.1",
+      "tag": "@uifabric/experiments_v5.25.1",
+      "date": "Mon, 19 Mar 2018 10:27:55 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Mark Polak <mark@thedutchies.com>",
+            "commit": "882c389076125182e5703ad5eb64ae178546f6c4",
+            "comment": "Use arrow function properties instead of @autobind"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.64.4 <6.0.0` to `>=5.65.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=5.3.0 <6.0.0` to `>=5.4.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.25.0",
       "tag": "@uifabric/experiments_v5.25.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 77aa23e42001e..8eebdbeb2c1e8 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Mon, 12 Mar 2018 06:29:20 GMT and should not be manually modified.
+This log was last generated on Mon, 19 Mar 2018 10:27:55 GMT and should not be manually modified.
+
+## 5.25.1
+Mon, 19 Mar 2018 10:27:55 GMT
+
+### Patches
+
+- Use arrow function properties instead of @autobind
 
 ## 5.25.0
 Mon, 12 Mar 2018 06:29:20 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 93c349c18b13b..37a7e8d65045b 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.25.0",
+  "version": "5.25.1",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -29,7 +29,7 @@
     "@types/enzyme": "3.1.5",
     "@types/enzyme-adapter-react-16": "1.0.1",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=5.3.0 <6.0.0",
+    "@uifabric/example-app-base": ">=5.4.0 <6.0.0",
     "@uifabric/file-type-icons": ">=0.5.0 <1.0.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.1.0 <6.0.0",
     "es6-weak-map": "^2.0.2",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.64.4 <6.0.0",
+    "office-ui-fabric-react": ">=5.65.0 <6.0.0",
     "@uifabric/icons": ">=5.6.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/file-type-icons/package.json b/packages/file-type-icons/package.json
index 1fa3df1587e5c..af9890badeca7 100644
--- a/packages/file-type-icons/package.json
+++ b/packages/file-type-icons/package.json
@@ -26,7 +26,7 @@
     "react-dom": "^16.2.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.19.1 <6.0.0",
+    "@uifabric/styling": ">=5.20.0 <6.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/icons/package.json b/packages/icons/package.json
index c24ff97ae781f..79e78da8e7f72 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -22,7 +22,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.19.1 <6.0.0",
+    "@uifabric/styling": ">=5.20.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 9c3d69710270d..a5acd8d8e0810 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,48 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.65.0",
+      "tag": "office-ui-fabric-react_v5.65.0",
+      "date": "Mon, 19 Mar 2018 10:27:55 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Aditi Mandal <aditima@microsoft.com>",
+            "commit": "9e7719f9f2ef616342d0b95873f79eec852665d7",
+            "comment": "DetailsList: scrollbars show up unnecessarily on IE11"
+          },
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "b4f58e498bc0885180f67f1fc9d3eb742e3704f6",
+            "comment": "Button: High contrast mode focus bug fixes."
+          },
+          {
+            "author": "Mark Polak <mark@thedutchies.com>",
+            "commit": "882c389076125182e5703ad5eb64ae178546f6c4",
+            "comment": "Use arrow function properties instead of @autobind"
+          }
+        ],
+        "minor": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "e3a40d52e73af6e5a0062452e550f1b066c851c2",
+            "comment": "ThemePrimary: Updating this color along with an Office branding update."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.19.1 <6.0.0` to `>=5.20.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.18.2 <6.0.0` to `>=5.18.3 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=5.3.0 <6.0.0` to `>=5.4.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.64.4",
       "tag": "office-ui-fabric-react_v5.64.4",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 49152d2d37216..8a0ba9c36f3e7 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 16 Mar 2018 10:28:03 GMT and should not be manually modified.
+This log was last generated on Mon, 19 Mar 2018 10:27:55 GMT and should not be manually modified.
+
+## 5.65.0
+Mon, 19 Mar 2018 10:27:55 GMT
+
+### Minor changes
+
+- ThemePrimary: Updating this color along with an Office branding update.
+
+### Patches
+
+- DetailsList: scrollbars show up unnecessarily on IE11
+- Button: High contrast mode focus bug fixes.
+- Use arrow function properties instead of @autobind
 
 ## 5.64.4
 Fri, 16 Mar 2018 10:28:03 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 0c31295ba30d7..e6dd094c22dde 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.64.4",
+  "version": "5.65.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -30,7 +30,7 @@
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.1.0 <6.0.0",
-    "@uifabric/example-app-base": ">=5.3.0 <6.0.0",
+    "@uifabric/example-app-base": ">=5.4.0 <6.0.0",
     "enzyme": "^3.2.0",
     "enzyme-adapter-react-16": "^1.1.0",
     "es6-promise": "^4.1.0",
@@ -50,8 +50,8 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "@uifabric/icons": ">=5.6.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
-    "@uifabric/styling": ">=5.19.1 <6.0.0",
-    "@uifabric/utilities": ">=5.18.2 <6.0.0",
+    "@uifabric/styling": ">=5.20.0 <6.0.0",
+    "@uifabric/utilities": ">=5.18.3 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index 8d9af4459486f..b6c1229136fbb 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.20.0",
+      "tag": "@uifabric/styling_v5.20.0",
+      "date": "Mon, 19 Mar 2018 10:27:55 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "b4f58e498bc0885180f67f1fc9d3eb742e3704f6",
+            "comment": "High contrast mode for focus styling."
+          }
+        ],
+        "minor": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "e3a40d52e73af6e5a0062452e550f1b066c851c2",
+            "comment": "ThemePrimary: Updating this color along with an Office branding update."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.18.2 <6.0.0` to `>=5.18.3 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.19.1",
       "tag": "@uifabric/styling_v5.19.1",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index 02849f835b9bb..f0ef450387a84 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Mon, 12 Mar 2018 06:29:20 GMT and should not be manually modified.
+This log was last generated on Mon, 19 Mar 2018 10:27:55 GMT and should not be manually modified.
+
+## 5.20.0
+Mon, 19 Mar 2018 10:27:55 GMT
+
+### Minor changes
+
+- ThemePrimary: Updating this color along with an Office branding update.
+
+### Patches
+
+- High contrast mode for focus styling.
 
 ## 5.19.1
 Mon, 12 Mar 2018 06:29:20 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index bbd9ca0d6eb16..b3d86ec5b4a22 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.19.1",
+  "version": "5.20.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "repository": {
     "type": "git",
@@ -28,7 +28,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.18.2 <6.0.0",
+    "@uifabric/utilities": ">=5.18.3 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index df3b5f3dfd80b..1ee45e1d887b6 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.18.3",
+      "tag": "@uifabric/utilities_v5.18.3",
+      "date": "Mon, 19 Mar 2018 10:27:55 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Mark Polak <mark@thedutchies.com>",
+            "commit": "882c389076125182e5703ad5eb64ae178546f6c4",
+            "comment": "Use arrow function properties instead of @autobind"
+          }
+        ]
+      }
+    },
     {
       "version": "5.18.2",
       "tag": "@uifabric/utilities_v5.18.2",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index ce8163fa50382..fc31bff95f75c 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Thu, 15 Mar 2018 02:42:27 GMT and should not be manually modified.
+This log was last generated on Mon, 19 Mar 2018 10:27:55 GMT and should not be manually modified.
+
+## 5.18.3
+Mon, 19 Mar 2018 10:27:55 GMT
+
+### Patches
+
+- Use arrow function properties instead of @autobind
 
 ## 5.18.2
 Thu, 15 Mar 2018 02:42:27 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 2a0cc6a337bda..2b35daccae5d8 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.18.2",
+  "version": "5.18.3",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/variants/CHANGELOG.json b/packages/variants/CHANGELOG.json
index 4cdd64ec5aad8..900098f40f808 100644
--- a/packages/variants/CHANGELOG.json
+++ b/packages/variants/CHANGELOG.json
@@ -1,6 +1,32 @@
 {
   "name": "@uifabric/variants",
   "entries": [
+    {
+      "version": "5.1.0",
+      "tag": "@uifabric/variants_v5.1.0",
+      "date": "Mon, 19 Mar 2018 10:27:55 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "51fa6d3504561fe2ae84f1888785f47473dd0cc1",
+            "comment": "fix imports so it works with amd"
+          }
+        ],
+        "minor": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "e3a40d52e73af6e5a0062452e550f1b066c851c2",
+            "comment": "ThemePrimary: Updating this color along with an Office branding update."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.19.1 <6.0.0` to `>=5.20.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.0.2",
       "tag": "@uifabric/variants_v5.0.2",
diff --git a/packages/variants/CHANGELOG.md b/packages/variants/CHANGELOG.md
index d6d478b04032e..96f9c2849ada5 100644
--- a/packages/variants/CHANGELOG.md
+++ b/packages/variants/CHANGELOG.md
@@ -1,6 +1,17 @@
 # Change Log - @uifabric/variants
 
-This log was last generated on Wed, 14 Mar 2018 10:28:26 GMT and should not be manually modified.
+This log was last generated on Mon, 19 Mar 2018 10:27:55 GMT and should not be manually modified.
+
+## 5.1.0
+Mon, 19 Mar 2018 10:27:55 GMT
+
+### Minor changes
+
+- ThemePrimary: Updating this color along with an Office branding update.
+
+### Patches
+
+- fix imports so it works with amd
 
 ## 5.0.2
 Wed, 14 Mar 2018 10:28:26 GMT
diff --git a/packages/variants/package.json b/packages/variants/package.json
index 036fd326e0a1b..c1ee532511fd0 100644
--- a/packages/variants/package.json
+++ b/packages/variants/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/variants",
-  "version": "5.0.2",
+  "version": "5.1.0",
   "description": "Office UI Fabric subtheme generator.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -25,6 +25,6 @@
   },
   "dependencies": {
     "tslib": "^1.7.1",
-    "@uifabric/styling": ">=5.19.1 <6.0.0"
+    "@uifabric/styling": ">=5.20.0 <6.0.0"
   }
 }
\ No newline at end of file

From 6584622b79095d209da984561d933cca9ed2acdc Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Mon, 19 Mar 2018 10:52:45 -0700
Subject: [PATCH 1598/1641] Update rush.json

---
 rush.json | 20 +++++++-------------
 1 file changed, 7 insertions(+), 13 deletions(-)

diff --git a/rush.json b/rush.json
index 9e5da8c53945d..30f63f4c361f6 100644
--- a/rush.json
+++ b/rush.json
@@ -67,6 +67,12 @@
       "versionPolicyName": "lockedMajor",
       "shouldPublish": true
     },
+    {
+      "packageName": "@uifabric/fabric-website",
+      "projectFolder": "apps/fabric-website",
+      "versionPolicyName": "lockedMajor",
+      "shouldPublish": true
+    },
     {
       "packageName": "@uifabric/icons",
       "projectFolder": "packages/icons",
@@ -76,44 +82,32 @@
     {
       "packageName": "@uifabric/build",
       "projectFolder": "scripts",
-      "versionPolicyName": "lockedMajor",
       "shouldPublish": false
     },
     {
       "packageName": "ssr-tests",
       "projectFolder": "apps/ssr-tests",
-      "versionPolicyName": "lockedMajor",
       "shouldPublish": false
     },
     {
       "packageName": "vr-tests",
       "projectFolder": "apps/vr-tests",
-      "versionPolicyName": "lockedMajor",
       "shouldPublish": false
     },
     {
       "packageName": "todo-app",
       "projectFolder": "apps/todo-app",
-      "versionPolicyName": "lockedMajor",
       "shouldPublish": false
     },
-    {
-      "packageName": "@uifabric/fabric-website",
-      "projectFolder": "apps/fabric-website",
-      "versionPolicyName": "lockedMajor",
-      "shouldPublish": true
-    },
     {
       "packageName": "test-bundle-button",
       "projectFolder": "apps/test-bundle-button",
-      "versionPolicyName": "lockedMajor",
       "shouldPublish": false
     },
     {
       "packageName": "office-ui-fabric-react-tslint",
       "projectFolder": "packages/office-ui-fabric-react-tslint",
-      "versionPolicyName": "lockedMajor",
       "shouldPublish": false
     }
   ]
-}
\ No newline at end of file
+}

From a62fa5e181ff7d5f4d5828dedd5700f579ef5892 Mon Sep 17 00:00:00 2001
From: John Lorenz <jcl47@duke.edu>
Date: Mon, 19 Mar 2018 12:14:02 -0700
Subject: [PATCH 1599/1641] removing Johanna from Fabric codeowners, adding
 Sathish (#4312)

---
 .github/CODEOWNERS | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index aeed91ebf7028..c294b67e9f2ec 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -45,14 +45,14 @@ common/_themeOverrides.scss @phkuo
 common/_common.scss @phkuo
 
 ### Utilities
-dateMath/     @johannao76 lorejoh12@gmail.com jolore@microsoft.com
-dateValues/   @johannao76 lorejoh12@gmail.com jolore@microsoft.com
+dateMath/     @lorejoh12 @sathi23
+dateValues/   @lorejoh12 @sathi23
 
 ## Components
 # ActivityItem/
 # Breadcrumb/
 # Button/
-Calendar/   @johannao76 lorejoh12@gmail.com jolore@microsoft.com
+Calendar/   @lorejoh12 @sathi23
 Callout/  @joschect
 # Check/
 # Checkbox/
@@ -61,7 +61,7 @@ Callout/  @joschect
 # ComboBox/
 CommandBar/   @micahgodbolt
 ContextualMenu/  @joschect
-DatePicker/   @johannao76 lorejoh12@gmail.com jolore@microsoft.com
+DatePicker/   @lorejoh12 @sathi23
 # DetailsList/
 # Dialog/
 DocumentCard/ @yiminwu @mikewheaton

From 73dc88723ad46cf3bdbd90a05fffb9377e9b6d75 Mon Sep 17 00:00:00 2001
From: dmarcey <demarcey@microsoft.com>
Date: Mon, 19 Mar 2018 16:51:59 -0400
Subject: [PATCH 1600/1641] Users/demarcey/cm icon hc (#4311)

* Fix ContextualMenuItem Icon High Contrast colors.

* Added change file.

* Turned " into '.
---
 ...users-demarcey-cmIconHC_2018-03-19-19-04.json | 11 +++++++++++
 .../ContextualMenu/ContextualMenu.styles.ts      | 16 +++++++++++++++-
 2 files changed, 26 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-demarcey-cmIconHC_2018-03-19-19-04.json

diff --git a/common/changes/office-ui-fabric-react/users-demarcey-cmIconHC_2018-03-19-19-04.json b/common/changes/office-ui-fabric-react/users-demarcey-cmIconHC_2018-03-19-19-04.json
new file mode 100644
index 0000000000000..09b8d96dc30b7
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-demarcey-cmIconHC_2018-03-19-19-04.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fixed bug with HC colors in icons in menus.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "demarcey@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
index 07c886c7a8292..1a2b87105d7a1 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
@@ -130,7 +130,21 @@ export const getMenuItemStyles = memoizeFunction((
       color: semanticColors.menuIcon,
       selectors: {
         [HighContrastSelector]: {
-          color: 'HighlightText',
+          color: 'inherit',
+        },
+        ['$root:hover &']: {
+          selectors: {
+            [HighContrastSelector]: {
+              color: 'HighlightText'
+            }
+          }
+        },
+        ['$root:focus &']: {
+          selectors: {
+            [HighContrastSelector]: {
+              color: 'HighlightText'
+            }
+          }
         }
       }
     },

From 1d69b5db81dca397760cf22bfc2d73c297bdf666 Mon Sep 17 00:00:00 2001
From: petdun2519 <peterdunlop2519@gmail.com>
Date: Mon, 19 Mar 2018 13:59:32 -0700
Subject: [PATCH 1601/1641] =?UTF-8?q?transitioning=20title=20attribute=20t?=
 =?UTF-8?q?o=20render=20as=20tooltip,=20and=20adding=20readon=E2=80=A6=20(?=
 =?UTF-8?q?#4261)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* transitioning title attribute to render as tooltip, and adding readonly state for command bar items

* more changes

* small changes

* fixing merge issues

* fixed merge issue

* pr feedback

* added white space

* fixed tests and ts lint errors
---
 ...oltipCommandBarItems_2018-03-13-21-28.json | 11 ++++++++
 .../src/components/CommandBar/CommandBar.scss |  9 +++++++
 .../src/components/CommandBar/CommandBar.tsx  | 26 ++++++++++++++++++-
 .../__snapshots__/CommandBar.test.tsx.snap    |  2 ++
 .../ContextualMenu/ContextualMenu.types.ts    |  6 +++++
 5 files changed, 53 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-petdun-addReadonlyStateAndTooltipCommandBarItems_2018-03-13-21-28.json

diff --git a/common/changes/office-ui-fabric-react/users-petdun-addReadonlyStateAndTooltipCommandBarItems_2018-03-13-21-28.json b/common/changes/office-ui-fabric-react/users-petdun-addReadonlyStateAndTooltipCommandBarItems_2018-03-13-21-28.json
new file mode 100644
index 0000000000000..07220e45deeee
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-petdun-addReadonlyStateAndTooltipCommandBarItems_2018-03-13-21-28.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "CommandBar changed the title attribute to render as tooltip and added readonly state (visitable by keyboard, functionally disabled)",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "peterdunlop2519@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss
index b7866ce88a0c8..2f4f6d4a9c1f4 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.scss
@@ -172,6 +172,15 @@ $SearchBox-sidePadding: 8px; // padding in input on left and right sides without
   &.itemLinkIsExpanded:hover {
     background-color: $ms-color-neutralQuaternary;
   }
+  
+  &.inactive {
+    color: $ms-color-neutralTertiaryAlt;
+    cursor: default;
+    pointer-events: none;
+    .itemIcon {
+      color: $ms-color-neutralTertiaryAlt;
+    }
+  }
 }
 
 .itemIcon {
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 2a4996e855bcd..3dcd96e194c23 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -187,8 +187,16 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
     const className = css(
       isLink ? ('ms-CommandBarItem-link ' + styles.itemLink) : ('ms-CommandBarItem-text ' + styles.itemText),
       !item.name && ('ms-CommandBarItem--noName ' + styles.itemLinkIsNoName),
-      (expandedMenuItemKey === item.key) && ('is-expanded ' + styles.itemLinkIsExpanded)
+      (expandedMenuItemKey === item.key) && ('is-expanded ' + styles.itemLinkIsExpanded),
+      item.inactive ? styles.inactive : ''
     );
+
+    let tooltipContent = '';
+
+    if (item.title) {
+        tooltipContent = item.title;
+    }
+
     const hasIcon = !!item.icon || !!item.iconProps;
     const isNameVisible = !!item.name && !item.iconOnly;
     const ariaLabel = item.ariaLabel || (item.iconOnly ? item.name : undefined);
@@ -200,6 +208,8 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
           { ...getNativeProps(item, buttonProperties) }
           id={ this._id + item.key }
           className={ className }
+          title={''}
+          aria-disabled={item.inactive}
           onClick={ this._onItemClick(item) }
           data-command-key={ itemKey }
           aria-haspopup={ hasSubmenu(item) }
@@ -229,6 +239,8 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
           { ...getNativeProps(item, anchorProperties.concat(['disabled'])) }
           id={ this._id + item.key }
           className={ className }
+          title={''}
+          aria-disabled={item.inactive}
           href={ item.disabled ? undefined : item.href }
           data-command-key={ itemKey }
           aria-haspopup={ hasSubmenu(item) }
@@ -254,6 +266,8 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
           { ...getNativeProps(item, divProperties.concat(['disabled'])) }
           id={ this._id + item.key }
           className={ className }
+          title={''}
+          aria-disabled={item.inactive}
           data-command-key={ itemKey }
           aria-haspopup={ hasSubmenu(item) }
           aria-label={ ariaLabel }
@@ -280,6 +294,12 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
           { command }
         </TooltipHost>
       );
+    } else if (tooltipContent) {
+      command = (
+        <TooltipHost content={ tooltipContent }>
+          { command }
+        </TooltipHost>
+      );
     }
 
     return (
@@ -398,6 +418,10 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
 
   private _onItemClick(item: IContextualMenuItem): (ev: React.MouseEvent<HTMLButtonElement>) => void {
     return (ev: React.MouseEvent<HTMLButtonElement>): void => {
+      if (item.inactive) {
+        return;
+      }
+
       if (item.key === this.state.expandedMenuItemKey || !hasSubmenu(item)) {
         this._onContextMenuDismiss();
       } else {
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap b/packages/office-ui-fabric-react/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
index 89282c08b05c9..cdfa05f114431 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/__snapshots__/CommandBar.test.tsx.snap
@@ -21,6 +21,7 @@ exports[`CommandBar renders CommandBar correctly 1`] = `
         className="ms-CommandBarItem"
       >
         <button
+          aria-disabled={undefined}
           aria-expanded={false}
           aria-haspopup={true}
           aria-label={undefined}
@@ -32,6 +33,7 @@ exports[`CommandBar renders CommandBar correctly 1`] = `
           name="TestText 1"
           onClick={[Function]}
           role="menuitem"
+          title=""
         >
           <span
             className="ms-CommandBarItem-commandText"
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
index 116b282f54e00..fd8ef9bc01a7e 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
@@ -446,6 +446,12 @@ export interface IContextualMenuItem {
    * Any additional properties to use when custom rendering menu items.
    */
   [propertyName: string]: any;
+
+  /**
+   * Optional prop to make an item readonly which is disabled but visitable by keyboard, will apply aria-readonly and some styling. Not supported by all components
+   */
+  inactive?: boolean;
+
 }
 
 export interface IContextualMenuSection extends React.Props<ContextualMenu> {

From ff76e427cc92a203779d6c227f002ef18fce720a Mon Sep 17 00:00:00 2001
From: Micah Godbolt <micahgodbolt@gmail.com>
Date: Mon, 19 Mar 2018 14:36:21 -0700
Subject: [PATCH 1602/1641] Added public openMenu method and cleaned up
 open/close functions (#4241)

* Added public openMenu method and cleaned up open/close functions

* Change file

* Update BaseButton.tsx
---
 .../button-openMenu_2018-03-12-20-15.json         | 11 +++++++++++
 .../src/components/Button/BaseButton.tsx          | 15 ++++++++++++---
 .../src/components/Button/Button.types.ts         |  5 +++++
 3 files changed, 28 insertions(+), 3 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/button-openMenu_2018-03-12-20-15.json

diff --git a/common/changes/office-ui-fabric-react/button-openMenu_2018-03-12-20-15.json b/common/changes/office-ui-fabric-react/button-openMenu_2018-03-12-20-15.json
new file mode 100644
index 0000000000000..8e25ab13d4e06
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/button-openMenu_2018-03-12-20-15.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Button: Added public openMenu method and cleaned up open/close functions",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mgodbolt@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 4e7728c775e24..4d94e15a69314 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -206,7 +206,11 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   }
 
   public dismissMenu(): void {
-    this.setState({ menuProps: null });
+    this._dismissMenu();
+  }
+
+  public openMenu(): void {
+    this._openMenu();
   }
 
   private _onRenderContent(tag: any, buttonProps: IButtonProps): JSX.Element {
@@ -398,10 +402,15 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     this.setState({ menuProps: null });
   }
 
+  private _openMenu = (): void => {
+    if (this.props.menuProps) {
+      this.setState({ menuProps: this.props.menuProps });
+    }
+  }
+
   private _onToggleMenu = (): void => {
-    const { menuProps } = this.props;
     const currentMenuProps = this.state.menuProps;
-    this.setState({ menuProps: currentMenuProps ? null : menuProps });
+    currentMenuProps ? this._dismissMenu() : this._openMenu();
   }
 
   private _onRenderSplitButtonContent(tag: any, buttonProps: IButtonProps): JSX.Element {
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.types.ts b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
index 223f1db8cd110..f0ceaad542dd6 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
@@ -18,6 +18,11 @@ export interface IButton {
    * If there is a menu associated with this button and it is visible, this will dismiss the menu
    */
   dismissMenu: () => void;
+
+  /**
+   * If there is a menu associated with this button and it is visible, this will open the menu
+   */
+  openMenu: () => void;
 }
 
 export interface IButtonProps extends React.AllHTMLAttributes<HTMLAnchorElement | HTMLButtonElement | HTMLDivElement | BaseButton | Button> {

From da374c8f7e9391968ca7c2aaefe85817018e37af Mon Sep 17 00:00:00 2001
From: SayaliS <sayalis@microsoft.com>
Date: Mon, 19 Mar 2018 15:29:14 -0700
Subject: [PATCH 1603/1641] Have optional callback in focusZoneProps to
 determine if scenario owner wants the input element to lose the focus on
 arrow key  (#4290)

* Test

* Scenario determines if to loose focus or not

* update

* PR comment

* Add returns

* Add test

* update test

* Update change log

* Increase bundle maxsize
---
 ...sayali-arrowFocusFix_2018-03-15-21-28.json | 11 +++++
 ...sayali-arrowFocusFix_2018-03-16-22-02.json | 11 +++++
 .../components/FocusZone/FocusZone.test.tsx   | 47 ++++++++++++++++++-
 .../src/components/FocusZone/FocusZone.tsx    | 11 +++--
 .../components/FocusZone/FocusZone.types.ts   |  7 +++
 scripts/package.json                          |  4 +-
 6 files changed, 85 insertions(+), 6 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/sayali-arrowFocusFix_2018-03-15-21-28.json
 create mode 100644 common/changes/office-ui-fabric-react/sayali-arrowFocusFix_2018-03-16-22-02.json

diff --git a/common/changes/office-ui-fabric-react/sayali-arrowFocusFix_2018-03-15-21-28.json b/common/changes/office-ui-fabric-react/sayali-arrowFocusFix_2018-03-15-21-28.json
new file mode 100644
index 0000000000000..fb4834655a5ff
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/sayali-arrowFocusFix_2018-03-15-21-28.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add shouldInputLoseFocusOnArrowKey callback for scenario to determine if input should loose focus when arrow key is present when Tabbing is enabled on All elements or Input elements",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "sayalis@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/sayali-arrowFocusFix_2018-03-16-22-02.json b/common/changes/office-ui-fabric-react/sayali-arrowFocusFix_2018-03-16-22-02.json
new file mode 100644
index 0000000000000..dc4d3300975b9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/sayali-arrowFocusFix_2018-03-16-22-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "FocusZone: adding `shouldInputLoseFocusOnArrowKey` optional callback for scenarios where user press an arrow key on an input element and want it to loose focus when FocusZone disables moving focus away in case when FocusZoneTabbableElements is set to All or none",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "sayalis@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
index 9ba0a6cc8551e..d5972db64ea2c 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.test.tsx
@@ -1259,4 +1259,49 @@ describe('FocusZone', () => {
     expect(inputA.tabIndex).toBe(-1);
     expect(buttonB.tabIndex).toBe(0);
   });
-});
+
+  it('focus should leave input box when arrow keys are pressed when tabbing is supported but shouldInputLoseFocusOnArrowKey callback method return true', () => {
+    const tabDownListener = jest.fn();
+    const component = ReactTestUtils.renderIntoDocument(
+      <div { ...{ onFocusCapture: _onFocus, onKeyDown: tabDownListener } }>
+        <FocusZone { ...{ handleTabKey: FocusZoneTabbableElements.all, isCircularNavigation: false, shouldInputLoseFocusOnArrowKey: (element) => { return true; } } }>
+          <input type='text' className='a' />
+          <button className='b'>b</button>
+        </FocusZone>
+      </div >
+    );
+
+    const focusZone = ReactDOM.findDOMNode(component as React.ReactInstance).firstChild as Element;
+
+    const inputA = focusZone.querySelector('.a') as HTMLElement;
+    const buttonB = focusZone.querySelector('.b') as HTMLElement;
+
+    setupElement(inputA, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 20,
+        right: 40
+      }
+    });
+
+    setupElement(buttonB, {
+      clientRect: {
+        top: 0,
+        bottom: 20,
+        left: 20,
+        right: 40
+      }
+    });
+
+    // InputA should be focused.
+    inputA.focus();
+    expect(lastFocusedElement).toBe(inputA);
+
+    // Pressing arrow down, input should loose the focus and the button should get the focus
+    ReactTestUtils.Simulate.keyDown(focusZone, { which: KeyCodes.down });
+    expect(lastFocusedElement).toBe(buttonB);
+    expect(inputA.tabIndex).toBe(-1);
+    expect(buttonB.tabIndex).toBe(0);
+  });
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index 58ac0603cead9..a39a4707ecac6 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -804,12 +804,17 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       // We shouldn't lose focus in the following cases:
       // 1. There is range selected.
       // 2. When selection start is larger than 0 and it is backward.
-      // 3. when selection start is not the end of lenght and it is forward.
+      // 3. when selection start is not the end of length and it is forward.
       // 4. We press any of the arrow keys when our handleTabKey isn't none or undefined (only losing focus if we hit tab)
-      if (isRangeSelected ||
+      // and if shouldInputLoseFocusOnArrowKey is defined, if scenario prefers to not loose the focus which is determined by calling the
+      // callback shouldInputLoseFocusOnArrowKey
+      if (
+        isRangeSelected ||
         (selectionStart > 0 && !isForward) ||
         (selectionStart !== inputValue.length && isForward) ||
-        !!this.props.handleTabKey) {
+        (!!this.props.handleTabKey && !(this.props.shouldInputLoseFocusOnArrowKey
+          && this.props.shouldInputLoseFocusOnArrowKey(element)))
+      ) {
         return false;
       }
     }
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
index ffd003fc2a46c..234842b5d71f1 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
@@ -120,6 +120,13 @@ export interface IFocusZoneProps extends React.HTMLAttributes<HTMLElement | Focu
    */
   handleTabKey?: FocusZoneTabbableElements;
 
+  /**
+   * A callback method to determine if the input element should lose focus on arrow keys
+   *  @param {HTMLInputElement} inputElement The input element which is to loose focus.
+   *  @returns True if input element should loose focus or false otherwise.
+   */
+  shouldInputLoseFocusOnArrowKey?: (inputElement: HTMLInputElement) => boolean;
+
   /**
    * Whether the to check for data-no-horizontal-wrap or data-no-vertical-wrap attributes
    * when determining how to move focus
diff --git a/scripts/package.json b/scripts/package.json
index 2f249ee3e8b65..3f826323130d7 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -49,7 +49,7 @@
   "bundlesize": [
     {
       "path": "../apps/test-bundle-button/dist/main.min.js",
-      "maxSize": "45.0 kB"
+      "maxSize": "45.5 kB"
     }
   ]
-}
+}
\ No newline at end of file

From 40bb5ea68260317f46edafd1759a2415658f0302 Mon Sep 17 00:00:00 2001
From: Alicia Drummond <aliciakds88@gmail.com>
Date: Mon, 19 Mar 2018 18:07:53 -0700
Subject: [PATCH 1604/1641] [Spinner] Replace scss styling with javascript
 styling (#4318)

* Javascript styling for Spinner

* rush change

* Removing Spinner.scss

* Examples no longer use inline-block, native props are forwarded to root
---
 .../Spinner_2018-03-19-21-45.json             | 11 +++
 .../src/components/Spinner/Spinner.base.tsx   | 67 +++++++++++++++
 .../src/components/Spinner/Spinner.scss       | 68 ----------------
 .../src/components/Spinner/Spinner.styles.tsx | 81 +++++++++++++++++++
 .../src/components/Spinner/Spinner.tsx        | 52 ++----------
 .../src/components/Spinner/Spinner.types.ts   | 27 ++++++-
 .../examples/Spinner.Basic.Example.scss       |  4 +-
 7 files changed, 195 insertions(+), 115 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/Spinner_2018-03-19-21-45.json
 create mode 100644 packages/office-ui-fabric-react/src/components/Spinner/Spinner.base.tsx
 delete mode 100644 packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss
 create mode 100644 packages/office-ui-fabric-react/src/components/Spinner/Spinner.styles.tsx

diff --git a/common/changes/office-ui-fabric-react/Spinner_2018-03-19-21-45.json b/common/changes/office-ui-fabric-react/Spinner_2018-03-19-21-45.json
new file mode 100644
index 0000000000000..9a2b005c1a7fa
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/Spinner_2018-03-19-21-45.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Javascript styling for Spinner",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "adrum@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.base.tsx b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.base.tsx
new file mode 100644
index 0000000000000..3e32f6e5dfa8c
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.base.tsx
@@ -0,0 +1,67 @@
+import * as React from 'react';
+import { ISpinnerProps, ISpinnerStyleProps, ISpinnerStyles, SpinnerType, SpinnerSize } from './Spinner.types';
+import {
+  BaseComponent,
+  customizable,
+  classNamesFunction,
+  DelayedRender,
+  getNativeProps,
+  divProperties
+} from '../../Utilities';
+
+const getClassNames = classNamesFunction<ISpinnerStyleProps, ISpinnerStyles>();
+
+@customizable('Spinner', ['theme'])
+export class SpinnerBase extends BaseComponent<ISpinnerProps, any> {
+
+  public static defaultProps: ISpinnerProps = {
+    size: SpinnerSize.medium,
+    ariaLive: 'polite'
+  };
+
+  public render() {
+    const {
+      type,
+      size,
+      ariaLabel,
+      ariaLive,
+      getStyles,
+      label,
+      theme,
+      className
+    } = this.props;
+    const statusMessage = ariaLabel || label;
+    const nativeProps = getNativeProps(this.props, divProperties, ['size']);
+
+    // SpinnerType is deprecated. If someone is still using this property, rather than putting the SpinnerType into the ISpinnerStyleProps,
+    // we'll map SpinnerType to its equivalent SpinnerSize and pass that in. Once SpinnerType finally goes away we should delete this.
+    let styleSize = size;
+    if (styleSize === undefined && type !== undefined) {
+      styleSize = type === SpinnerType.large ? SpinnerSize.large : SpinnerSize.medium;
+    }
+
+    const classNames = getClassNames(getStyles!, {
+      theme: theme!,
+      size: styleSize,
+      className
+    });
+
+    return (
+      <div { ...nativeProps } className={ classNames.root }>
+        <div className={ classNames.circle } />
+        {
+          label && <div className={ classNames.label }>{ label }</div>
+        }
+        {
+          statusMessage &&
+          <div role='status' aria-live={ ariaLive }>
+            <DelayedRender>
+              <div className={ classNames.screenReaderText }>{ statusMessage }</div>
+            </DelayedRender>
+          </div>
+        }
+      </div>
+    );
+  }
+
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss
deleted file mode 100644
index e5a2b7581fd87..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.scss
+++ /dev/null
@@ -1,68 +0,0 @@
-@import '../../common/common';
-
-// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
-
-//
-// Office UI Fabric
-// --------------------------------------------------
-// Spinner styles
-
-$spin-duration: 1.3s;
-$borderSize: 1.5px;
-
-@keyframes spinAnimation {
-  0% {
-    transform: rotateZ(0deg);
-  }
-  100% {
-    transform: rotateZ(360deg);
-  }
-}
-
-.root {
-  > .circle {
-    margin: auto;
-    box-sizing: border-box;
-    border-radius: 50%;
-    width: 100%;
-    height: 100%;
-    border: $borderSize solid $ms-color-themeLight;
-    border-top-color: $ms-color-themePrimary;
-    animation: spinAnimation $spin-duration infinite cubic-bezier(.53,.21,.29,.67);
-    &.circleIsXSmall {
-      width: 12px;
-      height: 12px;
-    }
-    &.circleIsSmall {
-      width: 16px;
-      height: 16px;
-    }
-    &.circleIsTypeMedium,
-    &.circleIsMedium {
-      width: 20px;
-      height: 20px;
-    }
-    &.circleIsTypeLarge,
-    &.circleIsLarge {
-      width: 28px;
-      height: 28px;
-    }
-  }
-  .label {
-      color: $ms-color-themePrimary;
-      margin-top: 10px;
-      text-align: center;
-  }
-
-  .screenReaderOnly {
-    @include ms-screenReaderOnly;
-  }
-}
-
-@include high-contrast {
-  .root {
-    > .circle {
-        border-top-color: Highlight;
-    }
-  }
-}
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.styles.tsx b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.styles.tsx
new file mode 100644
index 0000000000000..7a3474e498d41
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.styles.tsx
@@ -0,0 +1,81 @@
+import { ISpinnerStyleProps, ISpinnerStyles, SpinnerSize, SpinnerType } from './Spinner.types';
+import { IRawStyle, hiddenContentStyle, keyframes, HighContrastSelector } from '../../Styling';
+
+const spinAnimation: string = keyframes({
+  '0%': {
+    transform: 'rotateZ(0deg)'
+  },
+  '100%': {
+    transform: 'rotateZ(360deg)'
+  }
+});
+
+export const getStyles = (props: ISpinnerStyleProps): ISpinnerStyles => {
+  const { theme, size, className } = props;
+  const { palette } = theme;
+
+  return {
+    root: [
+      'ms-Spinner',
+      className
+    ],
+    circle: [
+      'ms-Spinner-circle',
+      {
+        margin: 'auto',
+        boxSizing: 'border-box',
+        borderRadius: '50%',
+        width: '100%',
+        height: '100%',
+        border: '1.5px solid ' + palette.themeLight,
+        borderTopColor: palette.themePrimary,
+        animationName: spinAnimation,
+        animationDuration: '1.3s',
+        animationIterationCount: 'infinite',
+        animationTimingFunction: 'cubic-bezier(.53,.21,.29,.67)',
+        selectors: {
+          [HighContrastSelector]: {
+            borderTopColor: 'Highlight'
+          }
+        },
+      },
+      size === SpinnerSize.xSmall && [
+        'ms-Spinner--xSmall',
+        {
+          width: 12,
+          height: 12
+        }
+      ],
+      size === SpinnerSize.small && [
+        'ms-Spinner--small',
+        {
+          width: 16,
+          height: 16
+        }
+      ],
+      size === SpinnerSize.medium && [
+        'ms-Spinner--medium',
+        {
+          width: 20,
+          height: 20
+        }
+      ],
+      size === SpinnerSize.large && [
+        'ms-Spinner--large',
+        {
+          width: 28,
+          height: 28
+        }
+      ]
+    ],
+    label: [
+      'ms-Spinner-label',
+      {
+        color: palette.themePrimary,
+        marginTop: 10,
+        textAlign: 'center'
+      }
+    ],
+    screenReaderText: hiddenContentStyle
+  };
+};
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx
index 292534cd0efb5..8061900cebccc 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx
+++ b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.tsx
@@ -1,45 +1,9 @@
-import * as React from 'react';
-import { BaseComponent, css, DelayedRender } from '../../Utilities';
-import { ISpinnerProps, SpinnerType, SpinnerSize } from './Spinner.types';
-import * as stylesImport from './Spinner.scss';
-const styles: any = stylesImport;
+import { styled } from '../../Utilities';
+import { SpinnerBase } from './Spinner.base';
+import { ISpinnerProps } from './Spinner.types';
+import { getStyles } from './Spinner.styles';
 
-export class Spinner extends BaseComponent<ISpinnerProps, any> {
-  public static defaultProps: ISpinnerProps = {
-    size: SpinnerSize.medium,
-    ariaLive: 'polite'
-  };
-
-  public render() {
-    const { type, size, label, className, ariaLive, ariaLabel } = this.props; // TODO remove deprecated type property at >= 2.0.0
-    const statusMessage = ariaLabel || label;
-
-    return (
-      <div className={ css('ms-Spinner', styles.root, className) }>
-        <div
-          className={ css('ms-Spinner-circle', styles.circle,
-            {
-              ['ms-Spinner--xSmall ' + styles.circleIsXSmall]: size === SpinnerSize.xSmall,
-              ['ms-Spinner--small ' + styles.circleIsSmall]: size === SpinnerSize.small,
-              ['ms-Spinner--medium ' + styles.circleIsMedium]: size === SpinnerSize.medium,
-              ['ms-Spinner--large ' + styles.circleIsLarge]: size === SpinnerSize.large,
-              ['ms-Spinner--normal ' + styles.circleIsTypeMedium]: type === SpinnerType.normal, // TODO remove deprecated value at >= 2.0.0
-              ['ms-Spinner--large ' + styles.circleIsTypeLarge]: type === SpinnerType.large // TODO remove deprecated value at >= 2.0.0
-            })
-          }
-        />
-        {
-          label && <div className={ css('ms-Spinner-label', styles.label) }>{ label }</div>
-        }
-        {
-          statusMessage &&
-          <div role='status' aria-live={ ariaLive }>
-            <DelayedRender>
-              <div className={ styles.screenReaderOnly }>{ statusMessage }</div>
-            </DelayedRender>
-          </div>
-        }
-      </div>
-    );
-  }
-}
\ No newline at end of file
+export const Spinner = styled(
+  SpinnerBase,
+  getStyles
+);
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.types.ts b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.types.ts
index 998e7a387f247..a0ed502efd891 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.types.ts
@@ -1,11 +1,13 @@
 import * as React from 'react';
 import { Spinner } from './Spinner';
+import { ITheme, IStyle, IRawStyle } from '../../Styling';
+import { IStyleFunction } from '../../Utilities';
 
 export interface ISpinner {
 
 }
 
-export interface ISpinnerProps extends React.Props<Spinner> {
+export interface ISpinnerProps extends React.HTMLAttributes<HTMLElement> {
   /**
    * Optional callback to access the ISpinner interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
@@ -45,6 +47,16 @@ export interface ISpinnerProps extends React.Props<Spinner> {
    * Alternative status label for screen reader
    */
   ariaLabel?: string;
+
+  /**
+   * Theme (provided through customization.)
+   */
+  theme?: ITheme;
+
+  /**
+   * Call to provide customized styling that will layer on top of the variant rules.
+   */
+  getStyles?: IStyleFunction<ISpinnerStyleProps, ISpinnerStyles>;
 }
 
 export enum SpinnerSize {
@@ -84,3 +96,16 @@ export enum SpinnerType {
    */
   large = 1
 }
+
+export interface ISpinnerStyleProps {
+  theme: ITheme;
+  size?: SpinnerSize;
+  className?: string;
+}
+
+export interface ISpinnerStyles {
+  root?: IStyle;
+  circle?: IStyle;
+  label?: IStyle;
+  screenReaderText?: IStyle;
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/examples/Spinner.Basic.Example.scss b/packages/office-ui-fabric-react/src/components/Spinner/examples/Spinner.Basic.Example.scss
index fe6296704b7f1..46ec5fc996a2c 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/examples/Spinner.Basic.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/Spinner/examples/Spinner.Basic.Example.scss
@@ -1,6 +1,6 @@
 :global {
-  .ms-BasicSpinnersExample .ms-Spinner {
-    display: inline-block;
+  .ms-BasicSpinnersExample {
     margin: 10px 0;
+    width: 300px;
   }
 }

From e007c5cefb753e97f14fd6f4bc328e98cebea94c Mon Sep 17 00:00:00 2001
From: Mark Polak <mark@thedutchies.com>
Date: Tue, 20 Mar 2018 02:23:08 +0100
Subject: [PATCH 1605/1641] Remove unused variables (#4310)

---
 .../CommandBarButton/CommandBarButton.styles.ts       |  3 +--
 .../src/components/DetailsList/DetailsHeader.tsx      |  1 -
 .../src/components/Facepile/Facepile.tsx              | 11 ++++-------
 .../Facepile/__snapshots__/Facepile.test.tsx.snap     |  2 +-
 .../src/components/Link/Link.styles.ts                |  3 +--
 .../src/components/ResizeGroup/ResizeGroupPage.tsx    |  1 -
 .../components/ScrollablePane/ScrollablePanePage.tsx  |  1 -
 7 files changed, 7 insertions(+), 15 deletions(-)

diff --git a/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts
index 425a61d4636a2..214efba884882 100644
--- a/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/CommandBarButton/CommandBarButton.styles.ts
@@ -3,8 +3,7 @@ import {
   ITheme,
   concatStyleSets,
   getFocusStyle,
-  HighContrastSelector,
-  IRawStyle
+  HighContrastSelector
 } from '../../../Styling';
 import { memoizeFunction } from '../../../Utilities';
 import {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index 1b1d4c438c6c3..7be923b8e6a53 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import * as ReactDOM from 'react-dom';
 import {
   BaseComponent,
   css,
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
index 2f230e6a77e02..7ce346b1d1b27 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.tsx
@@ -3,7 +3,6 @@ import {
   BaseComponent,
   buttonProperties,
   css,
-  divProperties,
   getId,
   getNativeProps
 } from '../../Utilities';
@@ -42,12 +41,10 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
   };
 
   private _ariaDescriptionId: string;
-  private _id: string;
 
   constructor(props: IFacepileProps) {
     super(props);
 
-    this._id = getId('Facepile');
     this._ariaDescriptionId = getId();
   }
 
@@ -121,7 +118,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
         initialsColor={ persona.initialsColor }
         primaryText={ persona.personaName }
         size={ personaSize }
-        {...(getPersonaProps ? getPersonaProps(persona) : null) }
+        { ...(getPersonaProps ? getPersonaProps(persona) : null) }
       />
     );
   }
@@ -144,7 +141,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
     return (
       <FacepileButton
         { ...getNativeProps(persona, buttonProperties) }
-        {...this._getElementProps(persona, index) }
+        { ...this._getElementProps(persona, index) }
         onClick={ this._onPersonaClick.bind(this, persona) }
       >
         { personaControl }
@@ -156,7 +153,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
     return (
       <div
         { ...getNativeProps(persona, buttonProperties) }
-        {...this._getElementProps(persona, index) }
+        { ...this._getElementProps(persona, index) }
       >
         { personaControl }
       </div>
@@ -189,7 +186,7 @@ export class Facepile extends BaseComponent<IFacepileProps, {}> {
   }
 
   private _getDescriptiveOverflowElement(personasOverflow: IFacepilePersona[]): JSX.Element | null {
-    const { overflowButtonProps, personas, personaSize } = this.props;
+    const { overflowButtonProps, personaSize } = this.props;
 
     if (!personasOverflow || personasOverflow.length < 1) { return null; }
 
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
index 29b5a31e94631..1ece2b465d1fc 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Facepile/__snapshots__/Facepile.test.tsx.snap
@@ -11,7 +11,7 @@ exports[`Facepile renders Facepile correctly 1`] = `
       aria-describedby={undefined}
       aria-labelledby={undefined}
       className="ms-FocusZone ms-Facepile-members"
-      data-focuszone-id="FocusZone2"
+      data-focuszone-id="FocusZone1"
       onFocus={[Function]}
       onKeyDown={[Function]}
       onMouseDownCapture={[Function]}
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.styles.ts b/packages/office-ui-fabric-react/src/components/Link/Link.styles.ts
index 92f84c115f270..d65d3d032e86f 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.styles.ts
@@ -1,6 +1,5 @@
 import {
-  getFocusStyle,
-  HighContrastSelector
+  getFocusStyle
 } from '../../Styling';
 import {
   ILinkStyleProps,
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
index 060046c5fad27..b7fa1d5d97d6d 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroupPage.tsx
@@ -10,7 +10,6 @@ import { ResizeGroupOverflowSetExample } from './examples/ResizeGroup.OverflowSe
 import { FlexBoxResizeGroupExample } from './examples/ResizeGroup.FlexBox.Example';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { ResizeGroupStatus } from './ResizeGroup.checklist';
-import { MessageBar } from '../../MessageBar';
 
 const ResizeGroupBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx') as string;
 
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
index 6029411f7fbc1..86abb63498a32 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePanePage.tsx
@@ -9,7 +9,6 @@ import { ScrollablePaneDefaultExample } from './examples/ScrollablePane.Default.
 import { ScrollablePaneDetailsListExample } from './examples/ScrollablePane.DetailsList.Example';
 import { ComponentStatus } from '../../demo/ComponentStatus/ComponentStatus';
 import { ScrollablePaneStatus } from './ScrollablePane.checklist';
-import { MessageBar } from '../../MessageBar';
 
 const ScrollablePaneDefaultExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ScrollablePane/examples/ScrollablePane.Default.Example.tsx') as string;
 

From 856989f01186c078741a64fb3bf7c6371b6439bd Mon Sep 17 00:00:00 2001
From: Mark Polak <mark@thedutchies.com>
Date: Tue, 20 Mar 2018 05:44:08 +0100
Subject: [PATCH 1606/1641] Finish create ref migration (#4303)

* Replace refs with createRef

* A few more createRef

* More createRef

* Marquee createRef

* Almost done! :)

* Almost done!

* Add npm change

* Use componentRef for setting a ref to a FocusZone

* One more ref -> componentRef
---
 ...-createRef-migration_2018-03-17-07-22.json |  11 ++
 ...-createRef-migration_2018-03-17-07-22.json |  11 ++
 .../BaseExtendedPicker.tests.tsx              |  22 ++--
 .../ExtendedPicker/BaseExtendedPicker.tsx     |  92 ++++++++++------
 .../ExtendedPeoplePicker.Basic.Example.tsx    |  12 +-
 .../src/components/ComboBox/ComboBox.tsx      |  88 ++++++++-------
 .../src/components/CommandBar/CommandBar.tsx  |   2 +-
 .../components/DetailsList/DetailsHeader.tsx  |   2 +-
 .../components/DetailsList/DetailsList.tsx    |  54 ++++-----
 .../src/components/DetailsList/DetailsRow.tsx |   8 +-
 .../examples/DetailsList.Grouped.Example.tsx  |  11 +-
 .../DocumentCard/DocumentCardTitle.tsx        |  22 ++--
 .../src/components/Dropdown/Dropdown.tsx      |  59 ++++++----
 .../examples/Dropdown.Basic.Example.tsx       |  10 +-
 .../src/components/Fabric/Fabric.tsx          |   7 +-
 .../FocusTrapZone/FocusTrapZone.tsx           |  31 ++++--
 .../src/components/FocusZone/FocusZone.tsx    |  81 +++++++-------
 .../components/GroupedList/GroupedList.tsx    |  17 +--
 .../GroupedList/GroupedListSection.tsx        |  27 ++---
 .../components/HoverCard/ExpandingCard.tsx    |  15 +--
 .../src/components/HoverCard/HoverCard.tsx    |  16 +--
 .../src/components/Image/Image.base.tsx       |  22 ++--
 .../src/components/Layer/Layer.base.tsx       |  24 ++--
 .../src/components/Link/Link.base.tsx         |  13 ++-
 .../src/components/List/List.tsx              |  35 +++---
 .../MarqueeSelection/MarqueeSelection.tsx     |  27 ++---
 .../src/components/Modal/Modal.tsx            |  11 +-
 .../components/OverflowSet/OverflowSet.tsx    |  11 +-
 .../src/components/Panel/Panel.tsx            |   9 +-
 .../src/components/Popup/Popup.tsx            |  22 ++--
 .../ResizeGroup/ResizeGroup.base.tsx          |  21 ++--
 .../ScrollablePane/ScrollablePane.base.tsx    |  86 ++++++++++-----
 .../components/SearchBox/SearchBox.base.tsx   |  23 ++--
 .../src/components/Slider/Slider.tsx          |  21 ++--
 .../src/components/SpinButton/SpinButton.tsx  |  18 ++-
 .../src/components/Sticky/Sticky.tsx          |  46 +++++---
 .../TeachingBubble/TeachingBubble.tsx         |   1 -
 .../src/components/TextField/TextField.tsx    |  37 ++++---
 .../src/components/Toggle/Toggle.tsx          |  11 +-
 .../src/components/Tooltip/TooltipHost.tsx    |  19 ++--
 .../src/components/pickers/BasePicker.tsx     | 103 ++++++++++--------
 .../SelectedItemWithMenu.tsx                  |   8 +-
 .../pickers/Suggestions/Suggestions.tsx       |  45 ++++----
 .../src/utilities/decorators/withViewport.tsx |   9 +-
 .../src/utilities/selection/SelectionZone.tsx |  31 +++---
 packages/utilities/src/BaseComponent.ts       |   1 +
 packages/utilities/src/dom.ts                 |   4 +-
 packages/utilities/src/scroll.ts              |   2 +-
 48 files changed, 731 insertions(+), 527 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/finish-createRef-migration_2018-03-17-07-22.json
 create mode 100644 common/changes/office-ui-fabric-react/finish-createRef-migration_2018-03-17-07-22.json

diff --git a/common/changes/@uifabric/utilities/finish-createRef-migration_2018-03-17-07-22.json b/common/changes/@uifabric/utilities/finish-createRef-migration_2018-03-17-07-22.json
new file mode 100644
index 0000000000000..f6218f2035198
--- /dev/null
+++ b/common/changes/@uifabric/utilities/finish-createRef-migration_2018-03-17-07-22.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Make helper functions getWindow and getDocument accept `null`.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/finish-createRef-migration_2018-03-17-07-22.json b/common/changes/office-ui-fabric-react/finish-createRef-migration_2018-03-17-07-22.json
new file mode 100644
index 0000000000000..6c18f847eef5e
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/finish-createRef-migration_2018-03-17-07-22.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Updates refs to use createRef object references",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tests.tsx b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tests.tsx
index 2e87311114a5a..d59adc02c871e 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tests.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tests.tsx
@@ -107,11 +107,11 @@ describe('Pickers', () => {
         picker.inputElement.value = 'bl';
       }
 
-      expect(picker.floatingPicker.suggestions.length).toBe(2);
-      expect(picker.floatingPicker.suggestions[0].name).toBe('black');
+      expect(picker.floatingPicker.value && picker.floatingPicker.value.suggestions.length).toBe(2);
+      expect(picker.floatingPicker.value && picker.floatingPicker.value.suggestions[0].name).toBe('black');
 
       // Force resolve to the first suggestions
-      picker.floatingPicker.forceResolveSuggestion();
+      picker.floatingPicker.value && picker.floatingPicker.value.forceResolveSuggestion();
       expect(picker.items.length).toBe(1);
       expect(picker.items[0].name).toBe('black');
 
@@ -136,11 +136,11 @@ describe('Pickers', () => {
         picker.inputElement.value = 'bl';
       }
 
-      expect(picker.floatingPicker.isSuggestionsShown).toBeTruthy();
-      picker.floatingPicker.hidePicker();
-      expect(picker.floatingPicker.isSuggestionsShown).toBeFalsy();
-      picker.floatingPicker.showPicker();
-      expect(picker.floatingPicker.isSuggestionsShown).toBeTruthy();
+      expect(picker.floatingPicker.value && picker.floatingPicker.value.isSuggestionsShown).toBeTruthy();
+      picker.floatingPicker.value && picker.floatingPicker.value.hidePicker();
+      expect(picker.floatingPicker.value && picker.floatingPicker.value.isSuggestionsShown).toBeFalsy();
+      picker.floatingPicker.value && picker.floatingPicker.value.showPicker();
+      expect(picker.floatingPicker.value && picker.floatingPicker.value.isSuggestionsShown).toBeTruthy();
 
       ReactDOM.unmountComponentAtNode(root);
     });
@@ -164,9 +164,9 @@ describe('Pickers', () => {
         ReactTestUtils.Simulate.keyDown(picker.inputElement, { which: KeyCodes.down });
       }
 
-      picker.floatingPicker.completeSuggestion();
-      expect(picker.selectedItemsList.items.length).toBe(1);
-      expect(picker.selectedItemsList.items[0].name).toBe('blue');
+      picker.floatingPicker.value && picker.floatingPicker.value.completeSuggestion();
+      expect(picker.selectedItemsList.value && picker.selectedItemsList.value.items.length).toBe(1);
+      expect(picker.selectedItemsList.value && picker.selectedItemsList.value.items[0].name).toBe('blue');
 
       ReactDOM.unmountComponentAtNode(root);
     });
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
index a58c0b6ebdda6..c79b4b8e99a6a 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.tsx
@@ -3,6 +3,7 @@ import {
   BaseComponent,
   KeyCodes,
   css,
+  createRef
 } from '../../Utilities';
 import {
   FocusZone,
@@ -32,12 +33,12 @@ export interface IBaseExtendedPickerState {
 
 export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extends BaseComponent<P, IBaseExtendedPickerState>
   implements IBaseExtendedPicker<T> {
-  public floatingPicker: BaseFloatingPicker<T, IBaseFloatingPickerProps<T>>;
-  public selectedItemsList: BaseSelectedItemsList<T, IBaseSelectedItemsListProps<T>>;
+  public floatingPicker = createRef<BaseFloatingPicker<T, IBaseFloatingPickerProps<T>>>();
+  public selectedItemsList = createRef<BaseSelectedItemsList<T, IBaseSelectedItemsListProps<T>>>();
 
-  protected root: HTMLElement;
-  protected input: Autofill;
-  protected focusZone: FocusZone;
+  protected root = createRef<HTMLDivElement>();
+  protected input = createRef<Autofill>();
+  protected focusZone = createRef<FocusZone>();
   protected selection: Selection;
   protected floatingPickerProps: IBaseFloatingPickerProps<T>;
   protected selectedItemsListProps: IBaseSelectedItemsListProps<T>;
@@ -61,7 +62,7 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
 
   // tslint:disable-next-line:no-any
   public get items(): any {
-    return this.selectedItemsList ? this.selectedItemsList.items : [];
+    return this.selectedItemsList.value ? this.selectedItemsList.value.items : [];
   }
 
   public componentDidMount(): void {
@@ -69,15 +70,19 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
   }
 
   public focus(): void {
-    this.focusZone.focus();
+    if (this.focusZone.value) {
+      this.focusZone.value.focus();
+    }
   }
 
   public clearInput(): void {
-    this.input.clear();
+    if (this.input.value) {
+      this.input.value.clear();
+    }
   }
 
   public get inputElement(): HTMLInputElement | null {
-    return this.input.inputElement;
+    return this.input.value && this.input.value.inputElement;
   }
 
   public render(): JSX.Element {
@@ -90,13 +95,13 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
 
     return (
       <div
-        ref={ this._resolveRef('root') }
+        ref={ this.root }
         className={ css(
           'ms-BasePicker',
           className ? className : '') }
       >
         <FocusZone
-          ref={ this._resolveRef('focusZone') }
+          componentRef={ this.focusZone }
           direction={ FocusZoneDirection.bidirectional }
           isInnerZoneKeystroke={ this._isFocusZoneInnerKeystroke }
           onKeyDown={ this.onBackspace }
@@ -109,7 +114,7 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
               { this.canAddItems() && (<Autofill
                 { ...inputProps as IInputProps }
                 className={ css('ms-BasePicker-input', styles.pickerInput) }
-                ref={ this._resolveRef('input') }
+                ref={ this.input }
                 onFocus={ this.onInputFocus }
                 onInputValueChange={ this.onInputChange }
                 suggestedDisplayValue={ suggestedDisplayValue }
@@ -145,10 +150,10 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
   protected renderSuggestions(): JSX.Element {
     let onRenderFloatingPicker = this.props.onRenderFloatingPicker;
     return (onRenderFloatingPicker({
-      componentRef: this._resolveRef('floatingPicker'),
+      componentRef: this.floatingPicker,
       onChange: this._onSuggestionSelected,
-      inputElement: this.input ? this.input.inputElement : undefined,
-      selectedItems: this.selectedItemsList ? this.selectedItemsList.items : [],
+      inputElement: this.input.value ? this.input.value.inputElement : undefined,
+      selectedItems: this.selectedItemsList.value ? this.selectedItemsList.value.items : [],
       ...this.floatingPickerProps
     }));
   }
@@ -156,7 +161,7 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
   protected renderSelectedItemsList(): JSX.Element {
     let onRenderSelectedItems = this.props.onRenderSelectedItems;
     return (onRenderSelectedItems({
-      componentRef: this._resolveRef('selectedItemsList'),
+      componentRef: this.selectedItemsList,
       ...this.selectedItemsListProps
     }));
   }
@@ -164,26 +169,36 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
   protected resetFocus(index?: number): void {
     let { items } = this.state;
 
-    if (items.length && index! >= 0) {
-      let newEl: HTMLElement = this.root.querySelectorAll('[data-selection-index]')[Math.min(index!, items.length - 1)] as HTMLElement;
-      if (newEl) {
-        this.focusZone.focusElement(newEl);
+    if (items.length && index! >= 0 && this.root.value) {
+      let newEl: HTMLElement = this.root.value
+        .querySelectorAll('[data-selection-index]')[Math.min(index!, items.length - 1)] as HTMLElement;
+      if (newEl && this.focusZone.value) {
+        this.focusZone.value.focusElement(newEl);
       }
     } else if (!this.canAddItems()) {
       (items[items.length - 1] as IPickerItemProps<T>).selected = true;
       this.resetFocus(items.length - 1);
     } else {
-      this.input.focus();
+      if (this.input.value) {
+        this.input.value.focus();
+      }
     }
   }
 
   protected onInputChange = (value: string): void => {
-    this.floatingPicker.onQueryStringChanged(value);
+    if (this.floatingPicker.value) {
+      this.floatingPicker.value.onQueryStringChanged(value);
+    }
   }
 
   protected onInputFocus = (ev: React.FocusEvent<HTMLInputElement | Autofill>): void => {
-    this.selectedItemsList.unselectAll();
-    this.floatingPicker.showPicker();
+    if (this.selectedItemsList.value) {
+      this.selectedItemsList.value.unselectAll();
+    }
+
+    if (this.floatingPicker.value) {
+      this.floatingPicker.value.showPicker();
+    }
 
     if (this.props.inputProps && this.props.inputProps.onFocus) {
       this.props.inputProps.onFocus(ev as React.FocusEvent<HTMLInputElement>);
@@ -196,17 +211,19 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
     if (ev.which !== KeyCodes.backspace) {
       return;
     }
-    if (this.state.items.length && !this.input || !this.input.isValueSelected) {
-      if ((this.input as Autofill).cursorLocation === 0) {
-        this.selectedItemsList.removeItemAt(this.items.length - 1);
+    if ((this.state.items.length && !this.input.value) || (this.input.value && !this.input.value.isValueSelected)) {
+      if (this.selectedItemsList.value && (this.input.value as Autofill).cursorLocation === 0) {
+        this.selectedItemsList.value.removeItemAt(this.items.length - 1);
         this._onSelectedItemsChanged();
       }
     }
   }
 
   protected onCopy = (ev: React.ClipboardEvent<HTMLElement>): void => {
-    // Pass it down into the selected items list
-    this.selectedItemsList.onCopy(ev);
+    if (this.selectedItemsList.value) {
+      // Pass it down into the selected items list
+      this.selectedItemsList.value.onCopy(ev);
+    }
   }
 
   protected onPaste = (ev: React.ClipboardEvent<Autofill | HTMLInputElement>): void => {
@@ -219,7 +236,7 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
 
   protected _isFocusZoneInnerKeystroke = (ev: React.KeyboardEvent<HTMLElement>): boolean => {
     // If suggestions are shown let up/down keys control them, otherwise allow them through to control the focusZone.
-    if (this.floatingPicker.isSuggestionsShown) {
+    if (this.floatingPicker.value && this.floatingPicker.value.isSuggestionsShown) {
       switch (ev.which) {
         case KeyCodes.up:
         case KeyCodes.down:
@@ -236,13 +253,22 @@ export class BaseExtendedPicker<T, P extends IBaseExtendedPickerProps<T>> extend
   }
 
   protected _onSuggestionSelected = (item: T): void => {
-    this.selectedItemsList.addItems([item]);
+    if (this.selectedItemsList.value) {
+      this.selectedItemsList.value.addItems([item]);
+    }
+
     if (this.props.onItemSelected) {
       this.props.onItemSelected(item);
     }
-    this.input.clear();
 
-    this.floatingPicker.hidePicker();
+    if (this.input.value) {
+      this.input.value.clear();
+    }
+
+    if (this.floatingPicker.value) {
+      this.floatingPicker.value.hidePicker();
+    }
+
     this.focus();
   }
 
diff --git a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
index f54deb5ca5a35..fbbcb15c8eed0 100644
--- a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
@@ -142,8 +142,10 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
 
   @autobind
   private _onExpandItem(item: IExtendedPersonaProps): void {
-    // tslint:disable-next-line:no-any
-    (this._picker.selectedItemsList as SelectedPeopleList).replaceItem(item, this._getExpandedGroupItems(item as any));
+    if (this._picker.selectedItemsList.value) {
+      // tslint:disable-next-line:no-any
+      (this._picker.selectedItemsList.value as SelectedPeopleList).replaceItem(item, this._getExpandedGroupItems(item as any));
+    }
   }
 
   @autobind
@@ -199,9 +201,9 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
   @autobind
   private _shouldShowForceResolve(): boolean {
     return Boolean(
-      this._picker.floatingPicker &&
-      this._validateInput(this._picker.floatingPicker.inputText) &&
-      this._picker.floatingPicker.suggestions.length === 0
+      this._picker.floatingPicker.value &&
+      this._validateInput(this._picker.floatingPicker.value.inputText) &&
+      this._picker.floatingPicker.value.suggestions.length === 0
     );
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 94db32efdd8bf..f3dd413faee6e 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -16,7 +16,8 @@ import {
   getNativeProps,
   KeyCodes,
   customizable,
-  css
+  css,
+  createRef
 } from '../../Utilities';
 import { SelectableOptionMenuItemType } from '../../utilities/selectableOption/SelectableOption.types';
 import {
@@ -85,19 +86,19 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     buttonIconProps: { iconName: 'ChevronDown' }
   };
 
-  private _root: HTMLElement;
+  private _root = createRef<HTMLDivElement>();
 
   // The input aspect of the comboBox
-  private _comboBox: Autofill;
+  private _comboBox = createRef<Autofill>();
 
   // The wrapping div of the input and button
-  private _comboBoxWrapper: HTMLDivElement;
+  private _comboBoxWrapper = createRef<HTMLDivElement>();
 
   // The callout element
-  private _comboBoxMenu: HTMLElement;
+  private _comboBoxMenu = createRef<HTMLDivElement>();
 
   // The menu item element that is currently selected
-  private _selectedElement: HTMLElement;
+  private _selectedElement = createRef<HTMLSpanElement>();
 
   // The base id for the comboBox
   private _id: string;
@@ -166,7 +167,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
   public componentDidMount() {
     // hook up resolving the options if needed on focus
-    this._events.on(this._comboBoxWrapper, 'focus', this._onResolveOptions, true);
+    this._events.on(this._comboBoxWrapper.value, 'focus', this._onResolveOptions, true);
   }
 
   public componentWillReceiveProps(newProps: IComboBoxProps) {
@@ -215,7 +216,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         !isOpen &&
         this._focusInputAfterClose &&
         focused &&
-        document.activeElement !== this._comboBox.inputElement)) {
+        this._comboBox.value &&
+        document.activeElement !== this._comboBox.value.inputElement)) {
       this.focus();
     }
 
@@ -249,7 +251,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     super.componentWillUnmount();
 
     // remove the eventHanlder that was added in componentDidMount
-    this._events.off(this._comboBoxWrapper);
+    this._events.off(this._comboBoxWrapper.value);
   }
 
   // Primary Render
@@ -302,18 +304,18 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       );
 
     return (
-      <div { ...divProps } ref={ this._resolveRef('_root') } className={ this._classNames.container }>
+      <div { ...divProps } ref={ this._root } className={ this._classNames.container }>
         { label && (
           <Label id={ id + '-label' } disabled={ disabled } required={ required } htmlFor={ id + '-input' } className={ this._classNames.label }>{ label }</Label>
         ) }
         <div
-          ref={ this._resolveRef('_comboBoxWrapper') }
+          ref={ this._comboBoxWrapper }
           id={ id + 'wrapper' }
           className={ this._classNames.root }
         >
           <Autofill
             data-is-interactable={ !disabled }
-            ref={ this._resolveRef('_comboBox') }
+            ref={ this._comboBox }
             id={ id + '-input' }
             className={ this._classNames.input }
             type='text'
@@ -381,8 +383,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * Set focus on the input
    */
   public focus = (shouldOpenOnFocus?: boolean): void => {
-    if (this._comboBox) {
-      this._comboBox.focus();
+    if (this._comboBox.value) {
+      this._comboBox.value.focus();
       if (shouldOpenOnFocus) {
         this.setState({
           isOpen: true
@@ -407,15 +409,21 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * @returns {string} - the updated value to set, if needed
    */
   private _onUpdateValueInAutofillWillReceiveProps = (): string | null => {
-    if (this._comboBox === null || this._comboBox === undefined) {
+    const comboBox = this._comboBox.value;
+
+    if (!comboBox) {
       return null;
     }
 
-    if (this._currentVisibleValue && this._currentVisibleValue !== '' && this._comboBox.value !== this._currentVisibleValue) {
+    if (comboBox.value === null || comboBox.value === undefined) {
+      return null;
+    }
+
+    if (this._currentVisibleValue && this._currentVisibleValue !== '' && comboBox.value !== this._currentVisibleValue) {
       return this._currentVisibleValue;
     }
 
-    return this._comboBox.value;
+    return comboBox.value;
   }
 
   /**
@@ -728,8 +736,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * and set the focused state
    */
   private _select = (): void => {
-    if (this._comboBox.inputElement) {
-      this._comboBox.inputElement.select();
+    if (this._comboBox.value && this._comboBox.value.inputElement) {
+      this._comboBox.value.inputElement.select();
     }
 
     if (!this.state.focused) {
@@ -780,8 +788,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     // inside the comboBox root or the comboBox menu since
     // it we are not really bluring from the whole comboBox
     if (event.relatedTarget &&
-      (this._root && this._root.contains(event.relatedTarget as HTMLElement) ||
-        this._comboBoxMenu && this._comboBoxMenu.contains(event.relatedTarget as HTMLElement))) {
+      (this._root.value && this._root.value.contains(event.relatedTarget as HTMLElement) ||
+        this._comboBoxMenu.value && this._comboBoxMenu.value.contains(event.relatedTarget as HTMLElement))) {
       event.preventDefault();
       event.stopPropagation();
       return;
@@ -823,9 +831,9 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         // the live value in the underlying input matches the pending option; update the state
         if (currentPendingValue.toLocaleLowerCase() === pendingOptionText ||
           (autoComplete && pendingOptionText.indexOf(currentPendingValue.toLocaleLowerCase()) === 0 &&
-            (this._comboBox.isValueSelected &&
-              currentPendingValue.length + (this._comboBox.selectionEnd - this._comboBox.selectionStart) === pendingOptionText.length) ||
-            (this._comboBox.inputElement && this._comboBox.inputElement.value.toLocaleLowerCase() === pendingOptionText)
+            (this._comboBox.value && this._comboBox.value.isValueSelected &&
+              currentPendingValue.length + (this._comboBox.value.selectionEnd - this._comboBox.value.selectionStart) === pendingOptionText.length) ||
+            (this._comboBox.value && this._comboBox.value.inputElement && this._comboBox.value.inputElement.value.toLocaleLowerCase() === pendingOptionText)
           )) {
           this._setSelectedIndex(currentPendingValueValidIndex);
           this._clearPendingInfo();
@@ -877,16 +885,16 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         directionalHintFixed={ true }
         { ...calloutProps }
         className={ css(this._classNames.callout, calloutProps ? calloutProps.className : undefined) }
-        target={ this._comboBoxWrapper }
+        target={ this._comboBoxWrapper.value }
         onDismiss={ this._onDismiss }
         onScroll={ this._onScroll }
         setInitialFocus={ false }
         calloutWidth={
-          useComboBoxAsMenuWidth ?
-            this._comboBoxWrapper.clientWidth + 2
+          useComboBoxAsMenuWidth && this._comboBoxWrapper.value ?
+            this._comboBoxWrapper.value.clientWidth + 2
             : dropdownWidth }
       >
-        <div className={ this._classNames.optionsContainerWrapper } ref={ this._resolveRef('_comboBoxMenu') }>
+        <div className={ this._classNames.optionsContainerWrapper } ref={ this._comboBoxMenu }>
           { (onRenderList as any)({ ...props }, this._onRenderList) }
         </div>
         { onRenderLowerContent(this.props, this._onRenderLowerContent) }
@@ -975,10 +983,10 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         onMouseMove={ this._onOptionMouseMove.bind(this, item.index) }
         onMouseLeave={ this._onOptionMouseLeave }
         role='option'
-        aria-selected={ isSelected ? 'true' : 'false' }
+        aria-selected={ isSelected ? true : false }
         ariaLabel={ item.text }
         disabled={ item.disabled }
-      > { <span ref={ this._resolveRef(isSelected ? '_selectedElement' : '') }>
+      > { <span ref={ this._selectedElement }>
         { onRenderOption(item, this._onRenderOptionContent) }
       </span>
         }
@@ -1067,16 +1075,16 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     if (onScrollToItem) {
       // Use the custom scroll handler
       onScrollToItem((currentPendingValueValidIndex >= 0 || currentPendingValue !== '') ? currentPendingValueValidIndex : selectedIndex);
-    } else if (this._selectedElement && this._selectedElement.offsetParent) {
+    } else if (this._selectedElement.value && this._selectedElement.value.offsetParent) {
       // We are using refs, scroll the ref into view
       if (scrollSelectedToTop) {
-        this._selectedElement.offsetParent.scrollIntoView(true);
+        this._selectedElement.value.offsetParent.scrollIntoView(true);
       } else {
         let alignToTop = true;
 
-        if (this._comboBoxMenu.offsetParent) {
-          const scrollableParentRect = this._comboBoxMenu.offsetParent.getBoundingClientRect();
-          const selectedElementRect = this._selectedElement.offsetParent.getBoundingClientRect();
+        if (this._comboBoxMenu.value && this._comboBoxMenu.value.offsetParent) {
+          const scrollableParentRect = this._comboBoxMenu.value.offsetParent.getBoundingClientRect();
+          const selectedElementRect = this._selectedElement.value.offsetParent.getBoundingClientRect();
 
           // If we are completely in view then we do not need to scroll
           if (scrollableParentRect.top <= selectedElementRect.top &&
@@ -1090,7 +1098,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
           }
         }
 
-        this._selectedElement.offsetParent.scrollIntoView(alignToTop);
+        this._selectedElement.value.offsetParent.scrollIntoView(alignToTop);
       }
     }
   }
@@ -1126,8 +1134,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     // close the menu and focus the input
     this.setState({ isOpen: false });
 
-    if (this._focusInputAfterClose) {
-      this._comboBox.focus();
+    if (this._comboBox.value && this._focusInputAfterClose) {
+      this._comboBox.value.focus();
     }
   }
 
@@ -1156,7 +1164,9 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       selectedIndex,
       currentOptions
     } = this.state;
-    this._comboBox.clear();
+    if (this._comboBox.value) {
+      this._comboBox.value.clear();
+    }
     this._clearPendingInfo();
 
     if (selectedIndex > 0 && selectedIndex < currentOptions.length) {
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 3dcd96e194c23..6a93fbfc340b1 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -121,7 +121,7 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
     return (
       <div className={ css('ms-CommandBar', styles.root, className) } ref={ this._commandBarRegion }>
         { searchBox }
-        <FocusZone ref={ this._focusZone } className={ styles.container } direction={ FocusZoneDirection.horizontal } role='menubar' >
+        <FocusZone componentRef={ this._focusZone } className={ styles.container } direction={ FocusZoneDirection.horizontal } role='menubar' >
           <div className={ css('ms-CommandBar-primaryCommands', styles.primaryCommands) } ref={ this._commandSurface }>
             { renderedItems!.map(item => (
               this._renderItemInCommandBar(item, posInSet++, setSize, expandedMenuItemKey!)
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index 7be923b8e6a53..66fac2d89edb4 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -144,7 +144,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
           (selectAllVisibility === SelectAllVisibility.hidden) && ('is-selectAllHidden ' + styles.rootIsSelectAllHidden),
           (!!columnResizeDetails && isSizing) && 'is-resizingColumn'
         ) }
-        ref={ this._root }
+        componentRef={ this._root }
         onMouseMove={ this._onRootMouseMove }
         data-automationid='DetailsHeader'
         direction={ FocusZoneDirection.horizontal }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 32c98e5385ed0..8e7d9b27ca8d1 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -9,7 +9,8 @@ import {
   css,
   elementContains,
   getRTLSafeKeyCode,
-  IRenderFunction
+  IRenderFunction,
+  createRef
 } from '../../Utilities';
 import {
   CheckboxVisibility,
@@ -70,13 +71,12 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   };
 
   // References
-  // tslint:disable-next-line:no-unused-variable
-  private _root: HTMLElement;
-  private _header: IDetailsHeader;
-  private _groupedList: GroupedList;
-  private _list: List;
-  private _focusZone: FocusZone;
-  private _selectionZone: SelectionZone;
+  private _root = createRef<HTMLDivElement>();
+  private _header = createRef<IDetailsHeader>();
+  private _groupedList = createRef<GroupedList>();
+  private _list = createRef<List>();
+  private _focusZone = createRef<FocusZone>();
+  private _selectionZone = createRef<SelectionZone>();
 
   private _selection: ISelection;
   private _activeRows: { [key: string]: DetailsRow };
@@ -126,8 +126,8 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   }
 
   public scrollToIndex(index: number, measureItem?: (itemIndex: number) => number): void {
-    this._list && this._list.scrollToIndex(index, measureItem);
-    this._groupedList && this._groupedList.scrollToIndex(index, measureItem);
+    this._list.value && this._list.value.scrollToIndex(index, measureItem);
+    this._groupedList.value && this._groupedList.value.scrollToIndex(index, measureItem);
   }
 
   public focusIndex(
@@ -169,7 +169,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       this.props.items !== prevProps.items &&
       this.props.items.length > 0 &&
       this.state.focusedItemIndex !== -1 &&
-      !elementContains(this._root, document.activeElement as HTMLElement, false)
+      !elementContains(this._root.value, document.activeElement as HTMLElement, false)
     ) {
       // Item set has changed and previously-focused item is gone.
       // Set focus to item at index of previously-focused item if it is in range,
@@ -316,7 +316,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
       // If shouldApplyApplicationRole is true, role application will be applied to make arrow keys work
       // with JAWS.
       <div
-        ref={ this._resolveRef('_root') }
+        ref={ this._root }
         className={ css(
           'ms-DetailsList',
           styles.root,
@@ -339,7 +339,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
         >
           <div onKeyDown={ this._onHeaderKeyDown } role='presentation'>
             { isHeaderVisible && onRenderDetailsHeader({
-              componentRef: this._resolveRef('_header'),
+              componentRef: this._header,
               selectionMode: selectionMode!,
               layoutMode: layoutMode!,
               selection: selection,
@@ -361,7 +361,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
           </div>
           <div onKeyDown={ this._onContentKeyDown } role='presentation'>
             <FocusZone
-              ref={ this._resolveRef('_focusZone') }
+              componentRef={ this._focusZone }
               className={ styles.focusZone }
               direction={ FocusZoneDirection.vertical }
               isInnerZoneKeystroke={ isRightArrow }
@@ -369,7 +369,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
               onBlur={ this._onBlur }
             >
               <SelectionZone
-                ref={ this._resolveRef('_selectionZone') }
+                ref={ this._selectionZone }
                 selection={ selection }
                 selectionPreservedOnEmptyClick={ selectionPreservedOnEmptyClick }
                 selectionMode={ selectionMode }
@@ -379,7 +379,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
               >
                 { groups ? (
                   <GroupedList
-                    ref={ this._resolveRef('_groupedList') }
+                    ref={ this._groupedList }
                     groups={ groups }
                     groupProps={ groupProps }
                     items={ items }
@@ -396,7 +396,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
                   />
                 ) : (
                     <List
-                      ref={ this._resolveRef('_list') }
+                      ref={ this._list }
                       role='presentation'
                       items={ items }
                       onRenderCell={ this._onRenderListCell(0) }
@@ -500,7 +500,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
 
   private _onHeaderKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
     if (ev.which === KeyCodes.down) {
-      if (this._focusZone && this._focusZone.focus()) {
+      if (this._focusZone.value && this._focusZone.value.focus()) {
         ev.preventDefault();
         ev.stopPropagation();
       }
@@ -509,7 +509,7 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
 
   private _onContentKeyDown(ev: React.KeyboardEvent<HTMLElement>) {
     if (ev.which === KeyCodes.up && !ev.altKey) {
-      if (this._header && this._header.focus()) {
+      if (this._header.value && this._header.value.focus()) {
         ev.preventDefault();
         ev.stopPropagation();
       }
@@ -551,8 +551,8 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
   }
 
   private _setFocusToRow(row: DetailsRow, forceIntoFirstElement: boolean = false) {
-    if (this._selectionZone) {
-      this._selectionZone.ignoreNextFocus();
+    if (this._selectionZone.value) {
+      this._selectionZone.value.ignoreNextFocus();
     }
     this._async.setTimeout(() => {
       row.focus(forceIntoFirstElement);
@@ -575,19 +575,19 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
     this.setState({
       isCollapsed: collapsed
     });
-    if (this._groupedList) {
-      this._groupedList.toggleCollapseAll(collapsed);
+    if (this._groupedList.value) {
+      this._groupedList.value.toggleCollapseAll(collapsed);
     }
   }
 
   private _forceListUpdates() {
     this._pendingForceUpdate = false;
 
-    if (this._groupedList) {
-      this._groupedList.forceUpdate();
+    if (this._groupedList.value) {
+      this._groupedList.value.forceUpdate();
     }
-    if (this._list) {
-      this._list.forceUpdate();
+    if (this._list.value) {
+      this._list.value.forceUpdate();
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
index 9b79de71b1a45..460310a79a087 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsRow.tsx
@@ -76,7 +76,7 @@ const DEFAULT_DROPPING_CSS_CLASS = 'is-dropping';
 
 export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState> {
   private _root: HTMLElement | undefined;
-  private _cellMeasurer: HTMLElement;
+  private _cellMeasurer = createRef<HTMLSpanElement>();
   private _focusZone = createRef<IFocusZone>();
   private _droppingClassNames: string;
   private _hasMounted: boolean;
@@ -132,8 +132,8 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
       }
     }
 
-    if (columnMeasureInfo && columnMeasureInfo.index >= 0) {
-      const newWidth = this._cellMeasurer.getBoundingClientRect().width;
+    if (columnMeasureInfo && columnMeasureInfo.index >= 0 && this._cellMeasurer.value) {
+      const newWidth = this._cellMeasurer.value.getBoundingClientRect().width;
 
       columnMeasureInfo.onMeasureDone(newWidth);
 
@@ -264,7 +264,7 @@ export class DetailsRow extends BaseComponent<IDetailsRowProps, IDetailsRowState
           <span
             role='presentation'
             className={ css('ms-DetailsRow-cellMeasurer ms-DetailsRow-cell', styles.cellMeasurer, styles.cell) }
-            ref={ this._resolveRef('_cellMeasurer') }
+            ref={ this._cellMeasurer }
           >
             <RowFields
               columns={ [columnMeasureInfo.column] }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
index 7ecbe0e9dd3d8..0917f5b4ceb7d 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
@@ -3,7 +3,8 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import {
   BaseComponent,
-  autobind
+  autobind,
+  createRef
 } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
@@ -58,7 +59,7 @@ const _items = [
 export class DetailsListGroupedExample extends BaseComponent<{}, {
   items: {}[];
 }> {
-  private _root: DetailsList;
+  private _root = createRef<DetailsList>();
 
   constructor(props: {}) {
     super(props);
@@ -78,7 +79,7 @@ export class DetailsListGroupedExample extends BaseComponent<{}, {
           text='Add an item'
         />
         <DetailsList
-          componentRef={ this._resolveRef('_root') }
+          componentRef={ this._root }
           items={ items }
           groups={ [
             {
@@ -123,7 +124,9 @@ export class DetailsListGroupedExample extends BaseComponent<{}, {
         color: 'blue'
       }])
     }, () => {
-      this._root.focusIndex(items.length, true);
+      if (this._root.value) {
+        this._root.value.focusIndex(items.length, true);
+      }
     });
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx
index 089480f93466e..cdc913066fd40 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx
@@ -4,7 +4,8 @@ import * as React from 'react';
 
 import {
   BaseComponent,
-  css
+  css,
+  createRef
 } from '../../Utilities';
 import { IDocumentCardTitleProps } from './DocumentCard.types';
 import * as stylesImport from './DocumentCard.scss';
@@ -22,7 +23,7 @@ const TRUNCATION_FIRST_PIECE_LONGER_BY = 10;
 const TRUNCATION_VERTICAL_OVERFLOW_THRESHOLD = 5;
 
 export class DocumentCardTitle extends BaseComponent<IDocumentCardTitleProps, IDocumentCardTitleState> {
-  private _titleElement: HTMLDivElement;
+  private _titleElement = createRef<HTMLDivElement>();
   private _scrollTimerId: number;
   private _truncatedTitleAtWidth: number;
   private _isTruncated: boolean;
@@ -70,11 +71,11 @@ export class DocumentCardTitle extends BaseComponent<IDocumentCardTitleProps, ID
     let documentCardTitle;
     if (shouldTruncate && this._isTruncated) {
       documentCardTitle = (
-        <div className={ css('ms-DocumentCardTitle', styles.title) } ref={ this._resolveRef('_titleElement') } title={ title }>{ truncatedTitleFirstPiece }&hellip;{ truncatedTitleSecondPiece }</div>
+        <div className={ css('ms-DocumentCardTitle', styles.title) } ref={ this._titleElement } title={ title }>{ truncatedTitleFirstPiece }&hellip;{ truncatedTitleSecondPiece }</div>
       );
     } else {
       documentCardTitle = (
-        <div className={ css('ms-DocumentCardTitle', styles.title) } ref={ this._resolveRef('_titleElement') } title={ title }>{ title }</div>
+        <div className={ css('ms-DocumentCardTitle', styles.title) } ref={ this._titleElement } title={ title }>{ title }</div>
       );
     }
 
@@ -106,7 +107,9 @@ export class DocumentCardTitle extends BaseComponent<IDocumentCardTitleProps, ID
     }
 
     // Save the width we just started truncation at, so that later we will only update truncation if necessary
-    this._truncatedTitleAtWidth = this._titleElement.clientWidth;
+    if (this._titleElement.value) {
+      this._truncatedTitleAtWidth = this._titleElement.value.clientWidth;
+    }
 
   }
 
@@ -127,13 +130,18 @@ export class DocumentCardTitle extends BaseComponent<IDocumentCardTitleProps, ID
   }
 
   private _doesTitleOverflow(): boolean {
-    const titleElement = this._titleElement;
+    const titleElement = this._titleElement.value;
+
+    if (!titleElement) {
+      return false;
+    }
+
     return titleElement.scrollHeight > titleElement.clientHeight + TRUNCATION_VERTICAL_OVERFLOW_THRESHOLD || titleElement.scrollWidth > titleElement.clientWidth;
   }
 
   private _updateTruncation() {
     // Only update truncation if the title's size has changed since the last time we truncated
-    if (this._titleElement.clientWidth !== this._truncatedTitleAtWidth) {
+    if (this._titleElement.value && (this._titleElement.value.clientWidth !== this._truncatedTitleAtWidth)) {
       // Throttle truncation so that it doesn't happen during a window resize
       clearTimeout(this._scrollTimerId);
       this._scrollTimerId = this._async.setTimeout(this._startTruncation.bind(this, this.props), 250);
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 4e2487ea5aa6d..1150437bae3a7 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -19,7 +19,8 @@ import {
   getNativeProps,
   divProperties,
   getFirstFocusable,
-  getLastFocusable
+  getLastFocusable,
+  createRef
 } from '../../Utilities';
 import { SelectableOptionMenuItemType } from '../../utilities/selectableOption/SelectableOption.types';
 import * as stylesImport from './Dropdown.scss';
@@ -46,11 +47,10 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
 
   private static Option = 'option';
 
-  private _host: HTMLDivElement;
-  private _focusZone: FocusZone;
-  private _dropDown: HTMLDivElement;
-  // tslint:disable-next-line:no-unused-variable
-  private _dropdownLabel: HTMLElement;
+  private _host = createRef<HTMLDivElement>();
+  private _focusZone = createRef<FocusZone>();
+  private _dropDown = createRef<HTMLDivElement>();
+  private _dropdownLabel = createRef<Label>();
   private _id: string;
   private _isScrollIdle: boolean;
   private readonly _scrollIdleDelay: number = 250 /* ms */;
@@ -111,7 +111,9 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
 
   public componentDidUpdate(prevProps: IDropdownProps, prevState: IDropdownState) {
     if (prevState.isOpen === true && this.state.isOpen === false) {
-      this._dropDown.focus();
+      if (this._dropDown.value) {
+        this._dropDown.value.focus();
+      }
 
       if (this.props.onDismiss) {
         this.props.onDismiss();
@@ -150,11 +152,11 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
     return (
       <div className={ css('ms-Dropdown-container') }>
         { label && (
-          <Label className={ css('ms-Dropdown-label') } id={ id + '-label' } htmlFor={ id } ref={ this._resolveRef('_dropdownLabel') } required={ required }>{ label }</Label>
+          <Label className={ css('ms-Dropdown-label') } id={ id + '-label' } htmlFor={ id } ref={ this._dropdownLabel } required={ required }>{ label }</Label>
         ) }
         <div
           data-is-focusable={ !disabled }
-          ref={ this._resolveRef('_dropDown') }
+          ref={ this._dropDown }
           id={ id }
           tabIndex={ disabled ? -1 : 0 }
           aria-expanded={ isOpen ? 'true' : 'false' }
@@ -219,8 +221,8 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   public focus(shouldOpenOnFocus?: boolean) {
-    if (this._dropDown && this._dropDown.tabIndex !== -1) {
-      this._dropDown.focus();
+    if (this._dropDown.value && this._dropDown.value.tabIndex !== -1) {
+      this._dropDown.value.focus();
       if (shouldOpenOnFocus) {
         this.setState({
           isOpen: true
@@ -370,11 +372,11 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
             directionalHint={ DirectionalHint.bottomLeftEdge }
             { ...calloutProps }
             className={ css('ms-Dropdown-callout', styles.callout, calloutProps ? calloutProps.className : undefined) }
-            target={ this._dropDown }
+            target={ this._dropDown.value }
             onDismiss={ this._onDismiss }
             onScroll={ this._onScroll }
             onPositioned={ this._onPositioned }
-            calloutWidth={ dropdownWidth || this._dropDown.clientWidth }
+            calloutWidth={ dropdownWidth || (this._dropDown.value ? this._dropDown.value.clientWidth : 0) }
           >
             { onRenderList(props, this._onRenderList) }
           </Callout>
@@ -402,11 +404,11 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
       <div
         className={ styles.listWrapper }
         onKeyDown={ this._onZoneKeyDown }
-        ref={ this._resolveRef('_host') }
+        ref={ this._host }
         tabIndex={ 0 }
       >
         <FocusZone
-          ref={ this._resolveRef('_focusZone') }
+          ref={ this._focusZone }
           direction={ FocusZoneDirection.vertical }
           defaultActiveElement={ selectedIndices[0] !== undefined ? `#${id}-list${selectedIndices[0]}` : undefined }
           id={ id + '-list' }
@@ -545,7 +547,9 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   private _onPositioned = (): void => {
-    this._focusZone.focus();
+    if (this._focusZone.value) {
+      this._focusZone.value.focus();
+    }
   }
 
   private _onItemClick = (item: IDropdownOption): () => void => {
@@ -606,16 +610,21 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
      * Edge and IE expose a setActive() function for focusable divs that
      * sets the page focus but does not scroll the parent element.
      */
-    if ((this._host as any).setActive) {
-      (this._host as any).setActive();
-    } else {
-      this._host.focus();
+    if (this._host.value) {
+      if ((this._host.value as any).setActive) {
+        (this._host.value as any).setActive();
+      } else {
+        this._host.value.focus();
+      }
     }
   }
 
   private _onDismiss = (): void => {
     this.setState({ isOpen: false });
-    this._dropDown.focus();
+
+    if (this._dropDown.value) {
+      this._dropDown.value.focus();
+    }
   }
 
   // Get all selected indexes for multi-select mode
@@ -786,7 +795,9 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
         if (ev.altKey || ev.metaKey) {
           this.setState({ isOpen: false });
         } else {
-          elementToFocus = getLastFocusable(this._host, (this._host.lastChild as HTMLElement), true);
+          if (this._host.value) {
+            elementToFocus = getLastFocusable(this._host.value, (this._host.value.lastChild as HTMLElement), true);
+          }
         }
         break;
 
@@ -799,7 +810,9 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
         break;
 
       case KeyCodes.down:
-        elementToFocus = getFirstFocusable(this._host, (this._host.firstChild as HTMLElement), true);
+        if (this._host.value) {
+          elementToFocus = getFirstFocusable(this._host.value, (this._host.value.firstChild as HTMLElement), true);
+        }
         break;
 
       case KeyCodes.escape:
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
index 79d6f1d99a8a5..f60f4c7eaee3f 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
@@ -1,14 +1,14 @@
 import * as React from 'react';
 import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
 import { Dropdown, IDropdown, DropdownMenuItemType, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
-import { autobind, BaseComponent } from '../../../Utilities';
+import { autobind, BaseComponent, createRef } from '../../../Utilities';
 import './Dropdown.Basic.Example.scss';
 
 export class DropdownBasicExample extends BaseComponent<{}, {
   selectedItem?: { key: string | number | undefined },
   selectedItems: string[]
 }> {
-  private _basicDropdown: IDropdown;
+  private _basicDropdown = createRef<IDropdown>();
 
   constructor(props: {}) {
     super(props);
@@ -47,7 +47,7 @@ export class DropdownBasicExample extends BaseComponent<{}, {
           }
           onFocus={ this._log('onFocus called') }
           onBlur={ this._log('onBlur called') }
-          componentRef={ this._resolveRef('_basicDropdown') }
+          componentRef={ this._basicDropdown }
         />
         <PrimaryButton
           text='Set focus'
@@ -197,8 +197,8 @@ export class DropdownBasicExample extends BaseComponent<{}, {
 
   @autobind
   private _onSetFocusButtonClicked() {
-    if (this._basicDropdown) {
-      this._basicDropdown.focus(true);
+    if (this._basicDropdown.value) {
+      this._basicDropdown.value.focus(true);
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
index 844e38048dfa9..8e77d0041f280 100644
--- a/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
+++ b/packages/office-ui-fabric-react/src/components/Fabric/Fabric.tsx
@@ -4,7 +4,8 @@ import {
   KeyCodes,
   customizable,
   getNativeProps,
-  divProperties
+  divProperties,
+  createRef
 } from '../../Utilities';
 import {
   ITheme
@@ -43,7 +44,7 @@ if (typeof (document) === 'object' && document.documentElement && !document.docu
 @customizable('Fabric', ['theme'])
 export class Fabric extends BaseComponent<IFabricProps, IFabricState> {
   // tslint:disable-next-line:no-unused-variable
-  private _root: HTMLElement;
+  private _root = createRef<HTMLDivElement>();
 
   constructor(props: IFabricProps) {
     super(props);
@@ -73,7 +74,7 @@ export class Fabric extends BaseComponent<IFabricProps, IFabricState> {
       <div
         { ...divProps }
         className={ classNames.root }
-        ref={ this._resolveRef('_root') }
+        ref={ this._root }
       />
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
index 15c5f8ddab83a..b0183d782b8e8 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
@@ -7,7 +7,8 @@ import {
   divProperties,
   getFirstFocusable,
   getLastTabbable,
-  getNextElement
+  getNextElement,
+  createRef
 } from '../../Utilities';
 import { IFocusTrapZone, IFocusTrapZoneProps } from './FocusTrapZone.types';
 
@@ -16,7 +17,7 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
   private static _focusStack: FocusTrapZone[] = [];
   private static _clickStack: FocusTrapZone[] = [];
 
-  private _root: HTMLElement;
+  private _root = createRef<HTMLDivElement>();
   private _previouslyFocusedElement: HTMLElement;
   private _isInFocusStack = false;
   private _isInClickStack = false;
@@ -37,7 +38,7 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
     const { isClickableOutsideFocusTrap = false, forceFocusInsideTrap = true, elementToFocusOnDismiss, disableFirstFocus = false } = this.props;
 
     this._previouslyFocusedElement = elementToFocusOnDismiss ? elementToFocusOnDismiss : document.activeElement as HTMLElement;
-    if (!elementContains(this._root, this._previouslyFocusedElement) && !disableFirstFocus) {
+    if (!elementContains(this._root.value, this._previouslyFocusedElement) && !disableFirstFocus) {
       this.focus();
     }
 
@@ -86,7 +87,7 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
       <div
         { ...divProps }
         className={ className }
-        ref={ this._resolveRef('_root') }
+        ref={ this._root }
         aria-labelledby={ ariaLabelledBy }
         onKeyDown={ this._onKeyboardHandler }
       >
@@ -106,10 +107,12 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
 
     let _firstFocusableChild;
 
-    if (focusSelector) {
-      _firstFocusableChild = this._root.querySelector('.' + focusSelector);
-    } else {
-      _firstFocusableChild = getNextElement(this._root, this._root.firstChild as HTMLElement, true, false, false, true);
+    if (this._root.value) {
+      if (focusSelector) {
+        _firstFocusableChild = this._root.value.querySelector('.' + focusSelector);
+      } else {
+        _firstFocusableChild = getNextElement(this._root.value, this._root.value.firstChild as HTMLElement, true, false, false, true);
+      }
     }
     if (_firstFocusableChild) {
       (_firstFocusableChild as any).focus();
@@ -121,8 +124,12 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
       return;
     }
 
-    const _firstFocusableChild = getFirstFocusable(this._root, this._root.firstChild as HTMLElement, true);
-    const _lastFocusableChild = getLastTabbable(this._root, this._root.lastChild as HTMLElement, true);
+    if (!this._root.value) {
+      return;
+    }
+
+    const _firstFocusableChild = getFirstFocusable(this._root.value, this._root.value.firstChild as HTMLElement, true);
+    const _lastFocusableChild = getLastTabbable(this._root.value, this._root.value.lastChild as HTMLElement, true);
 
     if (ev.shiftKey && _firstFocusableChild === ev.target) {
       _lastFocusableChild!.focus();
@@ -139,7 +146,7 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
     if (FocusTrapZone._focusStack.length && this === FocusTrapZone._focusStack[FocusTrapZone._focusStack.length - 1]) {
       const focusedElement = document.activeElement as HTMLElement;
 
-      if (!elementContains(this._root, focusedElement)) {
+      if (!elementContains(this._root.value, focusedElement)) {
         this.focus();
         ev.preventDefault();
         ev.stopPropagation();
@@ -151,7 +158,7 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
     if (FocusTrapZone._clickStack.length && this === FocusTrapZone._clickStack[FocusTrapZone._clickStack.length - 1]) {
       const clickedElement = ev.target as HTMLElement;
 
-      if (clickedElement && !elementContains(this._root, clickedElement)) {
+      if (clickedElement && !elementContains(this._root.value, clickedElement)) {
         this.focus();
         ev.preventDefault();
         ev.stopPropagation();
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
index a39a4707ecac6..87258f4196e0d 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.tsx
@@ -22,7 +22,8 @@ import {
   isElementFocusZone,
   isElementFocusSubZone,
   isElementTabbable,
-  shouldWrapFocus
+  shouldWrapFocus,
+  createRef
 } from '../../Utilities';
 
 const IS_FOCUSABLE_ATTRIBUTE = 'data-is-focusable';
@@ -53,7 +54,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     direction: FocusZoneDirection.bidirectional
   };
 
-  private _root: HTMLElement;
+  private _root = createRef<HTMLElement>();
   private _id: string;
   /** The most recently focused child element. */
   private _activeElement: HTMLElement | null;
@@ -85,10 +86,10 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
 
   public componentDidMount() {
     _allInstances[this._id] = this;
-    if (this._root) {
-      const windowElement = this._root.ownerDocument.defaultView;
+    if (this._root.value) {
+      const windowElement = this._root.value.ownerDocument.defaultView;
 
-      let parentElement = getParent(this._root, ALLOW_VIRTUAL_ELEMENTS);
+      let parentElement = getParent(this._root.value, ALLOW_VIRTUAL_ELEMENTS);
 
       while (
         parentElement &&
@@ -136,7 +137,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
         ...rootProps
         }
         className={ css('ms-FocusZone', className) }
-        ref={ this._resolveRef('_root') }
+        ref={ this._root }
         data-focuszone-id={ this._id }
         aria-labelledby={ ariaLabelledBy }
         aria-describedby={ ariaDescribedBy }
@@ -155,25 +156,25 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
    * @returns True if focus could be set to an active element, false if no operation was taken.
    */
   public focus(forceIntoFirstElement: boolean = false): boolean {
-    if (this._root) {
-      if (!forceIntoFirstElement && this._root.getAttribute(IS_FOCUSABLE_ATTRIBUTE) === 'true' && this._isInnerZone) {
-        const ownerZoneElement = this._getOwnerZone(this._root);
+    if (this._root.value) {
+      if (!forceIntoFirstElement && this._root.value.getAttribute(IS_FOCUSABLE_ATTRIBUTE) === 'true' && this._isInnerZone) {
+        const ownerZoneElement = this._getOwnerZone(this._root.value) as HTMLElement;
 
-        if (ownerZoneElement !== this._root) {
+        if (ownerZoneElement !== this._root.value) {
           const ownerZone = _allInstances[ownerZoneElement.getAttribute(FOCUSZONE_ID_ATTRIBUTE) as string];
 
-          return !!ownerZone && ownerZone.focusElement(this._root);
+          return !!ownerZone && ownerZone.focusElement(this._root.value);
         }
 
         return false;
-      } else if (!forceIntoFirstElement && this._activeElement && elementContains(this._root, this._activeElement)
+      } else if (!forceIntoFirstElement && this._activeElement && elementContains(this._root.value, this._activeElement)
         && isElementTabbable(this._activeElement)) {
         this._activeElement.focus();
         return true;
       } else {
-        const firstChild = this._root.firstChild as HTMLElement;
+        const firstChild = this._root.value.firstChild as HTMLElement;
 
-        return this.focusElement(getNextElement(this._root, firstChild, true) as HTMLElement);
+        return this.focusElement(getNextElement(this._root.value, firstChild, true) as HTMLElement);
       }
     }
     return false;
@@ -214,7 +215,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     } else {
       let parentElement = ev.target as HTMLElement;
 
-      while (parentElement && parentElement !== this._root) {
+      while (parentElement && parentElement !== this._root.value) {
         if (isElementTabbable(parentElement) && this._isImmediateDescendantOfZone(parentElement)) {
           this._activeElement = parentElement;
           break;
@@ -246,7 +247,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     let target = ev.target as HTMLElement;
     const path = [];
 
-    while (target && target !== this._root) {
+    while (target && target !== this._root.value) {
       path.push(target);
       target = getParent(target, ALLOW_VIRTUAL_ELEMENTS) as HTMLElement;
     }
@@ -297,7 +298,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       return;
     }
 
-    if (document.activeElement === this._root && this._isInnerZone) {
+    if (document.activeElement === this._root.value && this._isInnerZone) {
       // If this element has focus, it is being controlled by a parent.
       // Ignore the keystroke.
       return;
@@ -391,8 +392,8 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
             !this._shouldInputLoseFocus(ev.target as HTMLInputElement, false)) {
             return false;
           }
-          const firstChild = this._root.firstChild as HTMLElement;
-          if (this.focusElement(getNextElement(this._root, firstChild, true) as HTMLElement)) {
+          const firstChild = this._root.value && this._root.value.firstChild as HTMLElement | null;
+          if (this._root.value && firstChild && this.focusElement(getNextElement(this._root.value, firstChild, true) as HTMLElement)) {
             break;
           }
           return;
@@ -404,8 +405,8 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
             return false;
           }
 
-          const lastChild = this._root.lastChild as HTMLElement;
-          if (this.focusElement(getPreviousElement(this._root, lastChild, true, true, true) as HTMLElement)) {
+          const lastChild = this._root.value && this._root.value.lastChild as HTMLElement | null;
+          if (this._root.value && this.focusElement(getPreviousElement(this._root.value, lastChild, true, true, true) as HTMLElement)) {
             break;
           }
           return;
@@ -429,7 +430,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
    * Walk up the dom try to find a focusable element.
    */
   private _tryInvokeClickForFocusable(target: HTMLElement): boolean {
-    if (target === this._root) {
+    if (target === this._root.value) {
       return false;
     }
 
@@ -448,7 +449,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       }
 
       target = getParent(target, ALLOW_VIRTUAL_ELEMENTS) as HTMLElement;
-    } while (target !== this._root);
+    } while (target !== this._root.value);
 
     return false;
   }
@@ -456,14 +457,18 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   /**
    * Traverse to find first child zone.
    */
-  private _getFirstInnerZone(rootElement?: HTMLElement): FocusZone | null {
-    rootElement = rootElement || this._activeElement || this._root;
+  private _getFirstInnerZone(rootElement?: HTMLElement | null): FocusZone | null {
+    rootElement = rootElement || this._activeElement || this._root.value;
+
+    if (!rootElement) {
+      return null;
+    }
 
     if (isElementFocusZone(rootElement)) {
       return _allInstances[rootElement.getAttribute(FOCUSZONE_ID_ATTRIBUTE) as string];
     }
 
-    let child: HTMLElement = rootElement.firstElementChild as HTMLElement;
+    let child = rootElement.firstElementChild as HTMLElement | null;
 
     while (child) {
       if (isElementFocusZone(child)) {
@@ -475,7 +480,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
         return match;
       }
 
-      child = child.nextElementSibling as HTMLElement;
+      child = child.nextElementSibling as HTMLElement | null;
     }
 
     return null;
@@ -493,7 +498,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     let changedFocus = false;
     const isBidirectional = this.props.direction === FocusZoneDirection.bidirectional;
 
-    if (!element) {
+    if (!element || !this._root.value) {
       return false;
     }
 
@@ -506,7 +511,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
     const activeRect = isBidirectional ? element.getBoundingClientRect() : null;
 
     do {
-      element = (isForward ? getNextElement(this._root, element) : getPreviousElement(this._root, element)) as HTMLElement;
+      element = (isForward ? getNextElement(this._root.value, element) : getPreviousElement(this._root.value, element)) as HTMLElement;
 
       if (isBidirectional) {
         if (element) {
@@ -540,9 +545,9 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       this.focusElement(candidateElement);
     } else if (this.props.isCircularNavigation && useDefaultWrap) {
       if (isForward) {
-        return this.focusElement(getNextElement(this._root, this._root.firstElementChild as HTMLElement, true) as HTMLElement);
+        return this.focusElement(getNextElement(this._root.value, this._root.value.firstElementChild as HTMLElement, true) as HTMLElement);
       } else {
-        return this.focusElement(getPreviousElement(this._root, this._root.lastElementChild as HTMLElement, true, true, true) as HTMLElement);
+        return this.focusElement(getPreviousElement(this._root.value, this._root.value.lastElementChild as HTMLElement, true, true, true) as HTMLElement);
       }
     }
 
@@ -710,13 +715,13 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
   }
 
   private _isImmediateDescendantOfZone(element?: HTMLElement): boolean {
-    return this._getOwnerZone(element) === this._root;
+    return this._getOwnerZone(element) === this._root.value;
   }
 
-  private _getOwnerZone(element?: HTMLElement): HTMLElement {
+  private _getOwnerZone(element?: HTMLElement): HTMLElement | null {
     let parentElement = getParent(element as HTMLElement, ALLOW_VIRTUAL_ELEMENTS);
 
-    while (parentElement && parentElement !== this._root && parentElement !== document.body) {
+    while (parentElement && parentElement !== this._root.value && parentElement !== document.body) {
       if (isElementFocusZone(parentElement)) {
         return parentElement;
       }
@@ -724,13 +729,13 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       parentElement = getParent(parentElement, ALLOW_VIRTUAL_ELEMENTS);
     }
 
-    return this._root;
+    return this._root.value;
   }
 
   private _updateTabIndexes(element?: HTMLElement) {
-    if (!element) {
+    if (!element && this._root.value) {
       this._defaultFocusElement = null;
-      element = this._root;
+      element = this._root.value;
       if (this._activeElement && !elementContains(element, this._activeElement)) {
         this._activeElement = null;
       }
@@ -742,7 +747,7 @@ export class FocusZone extends BaseComponent<IFocusZoneProps, {}> implements IFo
       this._activeElement = null;
     }
 
-    const childNodes = element.children;
+    const childNodes = element && element.children;
 
     for (let childIndex = 0; childNodes && childIndex < childNodes.length; childIndex++) {
       const child = childNodes[childIndex] as HTMLElement;
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
index b3c96e75b00dc..b42da1572c0e1 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.tsx
@@ -3,7 +3,8 @@ import {
   BaseComponent,
   IRectangle,
   assign,
-  css
+  css,
+  createRef
 } from '../../Utilities';
 import {
   IGroupedList,
@@ -39,7 +40,7 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
     [key: string]: React.ReactInstance,
   };
 
-  private _list: List;
+  private _list = createRef<List>();
 
   private _isSomeGroupExpanded: boolean;
 
@@ -55,7 +56,9 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
   }
 
   public scrollToIndex(index: number, measureItem?: (itemIndex: number) => number): void {
-    this._list && this._list.scrollToIndex(index, measureItem);
+    if (this._list.value) {
+      this._list.value.scrollToIndex(index, measureItem);
+    }
   }
 
   public componentWillReceiveProps(newProps: IGroupedListProps) {
@@ -99,7 +102,7 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
         { !groups ?
           this._renderGroup(null, 0) : (
             <List
-              ref={ this._resolveRef('_list') }
+              ref={ this._list }
               items={ groups }
               onRenderCell={ this._renderGroup }
               getItemCountForPage={ this._returnOne }
@@ -244,11 +247,11 @@ export class GroupedList extends BaseComponent<IGroupedListProps, IGroupedListSt
 
     const groupCount = groups ? groups.length : 1;
 
-    if (this._list) {
-      this._list.forceUpdate();
+    if (this._list.value) {
+      this._list.value.forceUpdate();
 
       for (let i = 0; i < groupCount; i++) {
-        const group = this._list.refs['group_' + String(i)] as GroupedListSection;
+        const group = this._list.value.refs['group_' + String(i)] as GroupedListSection;
         if (group) {
           group.forceListUpdate();
         }
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
index a0719c4a7e38e..26a4f75f7cb40 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedListSection.tsx
@@ -13,7 +13,8 @@ import {
 import {
   BaseComponent,
   IRenderFunction,
-  IDisposable
+  IDisposable,
+  createRef
 } from '../../Utilities';
 
 import {
@@ -123,8 +124,8 @@ export interface IGroupedListSectionState {
 const DEFAULT_DROPPING_CSS_CLASS = 'is-dropping';
 
 export class GroupedListSection extends BaseComponent<IGroupedListSectionProps, IGroupedListSectionState> {
-  private _root: HTMLElement;
-  private _list: List;
+  private _root = createRef<HTMLDivElement>();
+  private _list = createRef<List>();
 
   private _dragDropSubscription: IDisposable;
 
@@ -142,8 +143,8 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
   public componentDidMount() {
     const { dragDropHelper, selection } = this.props;
 
-    if (dragDropHelper) {
-      this._dragDropSubscription = dragDropHelper.subscribe(this._root, this._events, this._getGroupDragDropOptions());
+    if (dragDropHelper && this._root.value) {
+      this._dragDropSubscription = dragDropHelper.subscribe(this._root.value, this._events, this._getGroupDragDropOptions());
     }
 
     if (selection) {
@@ -166,8 +167,8 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
         delete this._dragDropSubscription;
       }
 
-      if (this.props.dragDropHelper) {
-        this._dragDropSubscription = this.props.dragDropHelper.subscribe(this._root, this._events, this._getGroupDragDropOptions());
+      if (this.props.dragDropHelper && this._root.value) {
+        this._dragDropSubscription = this.props.dragDropHelper.subscribe(this._root.value, this._events, this._getGroupDragDropOptions());
       }
     }
   }
@@ -207,7 +208,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
 
     return (
       <div
-        ref={ this._resolveRef('_root') }
+        ref={ this._root }
         className={ css('ms-GroupedList-group', styles.group, this._getDroppingClassName()) }
         role='presentation'
       >
@@ -219,7 +220,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
               hasNestedGroups ?
                 (
                   <List
-                    ref={ this._resolveRef('_list') }
+                    ref={ this._list }
                     items={ group!.children }
                     onRenderCell={ this._renderSubGroup }
                     getItemCountForPage={ this._returnOne }
@@ -247,14 +248,14 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
   public forceListUpdate() {
     const { group } = this.props;
 
-    if (this._list) {
-      this._list.forceUpdate();
+    if (this._list.value) {
+      this._list.value.forceUpdate();
 
       if (group && group.children && group.children.length > 0) {
         const subGroupCount = group.children.length;
 
         for (let i = 0; i < subGroupCount; i++) {
-          const subGroup = this._list.refs['subGroup_' + String(i)] as GroupedListSection;
+          const subGroup = this._list.value.refs['subGroup_' + String(i)] as GroupedListSection;
 
           if (subGroup) {
             subGroup.forceListUpdate();
@@ -314,7 +315,7 @@ export class GroupedListSection extends BaseComponent<IGroupedListSectionProps,
       <List
         items={ items }
         onRenderCell={ this._onRenderGroupCell(onRenderCell, groupNestingDepth) }
-        ref={ this._resolveRef('_list') }
+        ref={ this._list }
         renderCount={ Math.min(count, renderCount) }
         startIndex={ startIndex }
         onShouldVirtualize={ onShouldVirtualize }
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
index 4a90d59729646..05e07d1c3bff1 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.tsx
@@ -6,7 +6,8 @@ import {
   getNativeProps,
   divProperties,
   customizable,
-  KeyCodes
+  KeyCodes,
+  createRef
 } from '../../Utilities';
 import { IExpandingCardProps, IExpandingCardStyles, ExpandingCardMode } from './ExpandingCard.types';
 import { Callout, ICallout } from '../../Callout';
@@ -32,8 +33,8 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
 
   private _styles: IExpandingCardStyles;
   // tslint:disable-next-line:no-unused-variable
-  private _callout: ICallout;
-  private _expandedElem: HTMLDivElement;
+  private _callout = createRef<ICallout>();
+  private _expandedElem = createRef<HTMLDivElement>();
 
   constructor(props: IExpandingCardProps) {
     super(props);
@@ -78,7 +79,7 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
     return (
       <Callout
         { ...getNativeProps(this.props, divProperties) }
-        componentRef={ this._resolveRef('_callout') }
+        componentRef={ this._callout }
         className={ mergeStyles(
           AnimationStyles.scaleUpIn100,
           this._styles.root
@@ -131,7 +132,7 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
           this._styles.expandedCard,
           this.props.mode === ExpandingCardMode.expanded && this.state.firstFrameRendered && { height: this.props.expandedCardHeight + 'px' }
         ) }
-        ref={ this._resolveRef('_expandedElem') }
+        ref={ this._expandedElem }
       >
         <div className={ mergeStyles(this.state.needsScroll && this._styles.expandedCardScroll) }>
           { this.props.onRenderExpandedCard && this.props.onRenderExpandedCard(this.props.renderData) }
@@ -141,9 +142,9 @@ export class ExpandingCard extends BaseComponent<IExpandingCardProps, IExpanding
   }
 
   private _checkNeedsScroll = (): void => {
-    if (this._expandedElem) {
+    if (this._expandedElem.value) {
       this._async.requestAnimationFrame(() => {
-        if (this._expandedElem.scrollHeight >= this.props.expandedCardHeight!) {
+        if (this._expandedElem.value && this._expandedElem.value.scrollHeight >= this.props.expandedCardHeight!) {
           this.setState({
             needsScroll: true
           });
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
index fd03220d9fd85..871f3a2cfa8d4 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.tsx
@@ -7,7 +7,8 @@ import {
   getNativeProps,
   getId,
   KeyCodes,
-  getDocument
+  getDocument,
+  createRef
 } from '../../Utilities';
 import {
   mergeStyles
@@ -33,9 +34,8 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
   };
 
   // The wrapping div that gets the hover events
-  private _hoverCard: HTMLElement;
-  // tslint:disable-next-line:no-unused-variable
-  private _expandingCard: ExpandingCard;
+  private _hoverCard = createRef<HTMLDivElement>();
+  private _expandingCard = createRef<ExpandingCard>();
   private _dismissTimerId: number;
   private _openTimerId: number;
   private _currentMouseTarget: EventTarget;
@@ -107,13 +107,13 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
     return (
       <div
         className={ mergeStyles(this._styles.host) }
-        ref={ this._resolveRef('_hoverCard') }
+        ref={ this._hoverCard }
         aria-describedby={ setAriaDescribedBy && isHoverCardVisible ? hoverCardId : undefined }
       >
         { children }
         { isHoverCardVisible &&
           <ExpandingCard
-            componentRef={ this._resolveRef('_expandingCard') }
+            componentRef={ this._expandingCard }
             { ...getNativeProps(this.props, divProperties) }
             id={ hoverCardId }
             trapFocus={ !!this.props.trapFocus }
@@ -129,7 +129,7 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
     );
   }
 
-  private _getTargetElement(): HTMLElement {
+  private _getTargetElement(): HTMLElement | undefined {
     const { target } = this.props;
 
     switch (typeof target) {
@@ -140,7 +140,7 @@ export class HoverCard extends BaseComponent<IHoverCardProps, IHoverCardState> {
         return target as HTMLElement;
 
       default:
-        return this._hoverCard;
+        return this._hoverCard.value ? this._hoverCard.value : undefined;
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx b/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx
index 707b3452794fd..5d13ac2caf02a 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.base.tsx
@@ -6,7 +6,8 @@ import {
   classNamesFunction,
   customizable,
   getNativeProps,
-  imageProperties
+  imageProperties,
+  createRef
 } from '../../Utilities';
 import {
   IImageProps,
@@ -37,8 +38,8 @@ export class ImageBase extends BaseComponent<IImageProps, IImageState> {
   // check the rendered element. The value here only takes effect when
   // shouldStartVisible is true.
   private _coverStyle: ImageCoverStyle = ImageCoverStyle.portrait;
-  private _imageElement: HTMLImageElement;
-  private _frameElement: HTMLDivElement;
+  private _imageElement = createRef<HTMLImageElement>();
+  private _frameElement = createRef<HTMLDivElement>();
 
   constructor(props: IImageProps) {
     super(props);
@@ -109,7 +110,7 @@ export class ImageBase extends BaseComponent<IImageProps, IImageState> {
       <div
         className={ classNames.root }
         style={ { width: width, height: height } }
-        ref={ this._resolveRef('_frameElement') }
+        ref={ this._frameElement }
       >
         <img
           { ...imageProps }
@@ -117,7 +118,7 @@ export class ImageBase extends BaseComponent<IImageProps, IImageState> {
           onError={ this._onImageError }
           key={ KEY_PREFIX + this.props.src || '' }
           className={ classNames.image }
-          ref={ this._resolveRef('_imageElement') }
+          ref={ this._imageElement }
           src={ src }
           alt={ alt }
           role={ role }
@@ -150,8 +151,8 @@ export class ImageBase extends BaseComponent<IImageProps, IImageState> {
       // .complete, because .complete will also be set to true if the image breaks. However,
       // for some browsers, SVG images do not have a naturalWidth or naturalHeight, so fall back
       // to checking .complete for these images.
-      const isLoaded: boolean = src && this._imageElement && (this._imageElement.naturalWidth > 0 && this._imageElement.naturalHeight > 0) ||
-        (this._imageElement.complete && ImageBase._svgRegex.test(src!));
+      const isLoaded: boolean = this._imageElement.value ? src && (this._imageElement.value.naturalWidth > 0 && this._imageElement.value.naturalHeight > 0) ||
+        (this._imageElement.value.complete && ImageBase._svgRegex.test(src!)) : false;
 
       if (isLoaded) {
         this._computeCoverStyle(this.props);
@@ -168,18 +169,19 @@ export class ImageBase extends BaseComponent<IImageProps, IImageState> {
     // Do not compute cover style if it was already specified in props
     if ((imageFit === ImageFit.cover || imageFit === ImageFit.contain) &&
       this.props.coverStyle === undefined &&
-      this._imageElement) {
+      this._imageElement.value &&
+      this._frameElement.value) {
       // Determine the desired ratio using the width and height props.
       // If those props aren't available, measure measure the frame.
       let desiredRatio;
       if (!!width && !!height) {
         desiredRatio = (width as number) / (height as number);
       } else {
-        desiredRatio = this._frameElement.clientWidth / this._frameElement.clientHeight;
+        desiredRatio = this._frameElement.value.clientWidth / this._frameElement.value.clientHeight;
       }
 
       // Examine the source image to determine its original ratio.
-      const naturalRatio = this._imageElement.naturalWidth / this._imageElement.naturalHeight;
+      const naturalRatio = this._imageElement.value.naturalWidth / this._imageElement.value.naturalHeight;
 
       // Should we crop from the top or the sides?
       if (naturalRatio > desiredRatio) {
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.base.tsx b/packages/office-ui-fabric-react/src/components/Layer/Layer.base.tsx
index f241acbd41139..260af0b334ea6 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/Layer.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.base.tsx
@@ -14,7 +14,8 @@ import {
   classNamesFunction,
   customizable,
   getDocument,
-  setVirtualParent
+  setVirtualParent,
+  createRef
 } from '../../Utilities';
 
 const _layersByHostId: { [hostId: string]: LayerBase[] } = {};
@@ -30,7 +31,7 @@ export class LayerBase extends BaseComponent<ILayerProps, {}> {
     onLayerWillUnmount: () => undefined
   };
 
-  private _rootElement: HTMLElement;
+  private _rootElement = createRef<HTMLDivElement>();
   private _host: Node;
   private _layerElement: HTMLElement | undefined;
   private _hasMounted: boolean;
@@ -107,13 +108,18 @@ export class LayerBase extends BaseComponent<ILayerProps, {}> {
       this._host = host;
 
       if (!this._layerElement) {
-        const doc = getDocument(this._rootElement) as Document;
+        const rootElement = this._rootElement.value;
+        const doc = getDocument(rootElement);
+
+        if (!doc || !rootElement) {
+          return;
+        }
 
         this._layerElement = doc.createElement('div');
         this._layerElement.className = classNames.root;
 
         host.appendChild(this._layerElement);
-        setVirtualParent(this._layerElement, this._rootElement);
+        setVirtualParent(this._layerElement, rootElement);
       }
 
       // Using this 'unstable' method allows us to retain the React context across the layer projection.
@@ -144,7 +150,7 @@ export class LayerBase extends BaseComponent<ILayerProps, {}> {
     return (
       <span
         className='ms-Layer'
-        ref={ this._resolveRef('_rootElement') }
+        ref={ this._rootElement }
       />
     );
   }
@@ -163,9 +169,13 @@ export class LayerBase extends BaseComponent<ILayerProps, {}> {
     }
   }
 
-  private _getHost(): Node {
+  private _getHost(): Node | undefined {
     const { hostId } = this.props;
-    const doc = getDocument(this._rootElement) as Document;
+    const doc = getDocument(this._rootElement.value);
+
+    if (!doc) {
+      return undefined;
+    }
 
     if (hostId) {
       return doc.getElementById(hostId) as Node;
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.base.tsx b/packages/office-ui-fabric-react/src/components/Link/Link.base.tsx
index 95eeb01fe927f..255adf0716bb4 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.base.tsx
@@ -5,7 +5,8 @@ import {
   buttonProperties,
   classNamesFunction,
   customizable,
-  getNativeProps
+  getNativeProps,
+  createRef
 } from '../../Utilities';
 import {
   ILink,
@@ -18,7 +19,7 @@ const getClassNames = classNamesFunction<ILinkStyleProps, ILinkStyles>();
 
 @customizable('Link', ['theme', 'getStyles'])
 export class LinkBase extends BaseComponent<ILinkProps, any> implements ILink {
-  private _link: HTMLElement;
+  private _link = createRef<HTMLAnchorElement | HTMLButtonElement | null>();
 
   public render() {
     const { disabled, children, className, href, theme, getStyles } = this.props;
@@ -35,7 +36,7 @@ export class LinkBase extends BaseComponent<ILinkProps, any> implements ILink {
         { ...getNativeProps(this.props, anchorProperties) }
         className={ classNames.root }
         onClick={ this._onClick }
-        ref={ this._resolveRef('_link') }
+        ref={ this._link }
         target={ this.props.target }
         aria-disabled={ disabled }
       >
@@ -48,7 +49,7 @@ export class LinkBase extends BaseComponent<ILinkProps, any> implements ILink {
         { ...getNativeProps(this.props, buttonProperties) }
         className={ classNames.root }
         onClick={ this._onClick }
-        ref={ this._resolveRef('_link') }
+        ref={ this._link }
         aria-disabled={ disabled }
       >
         { children }
@@ -59,8 +60,8 @@ export class LinkBase extends BaseComponent<ILinkProps, any> implements ILink {
   }
 
   public focus() {
-    if (this._link) {
-      this._link.focus();
+    if (this._link.value) {
+      this._link.value.focus();
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/List/List.tsx b/packages/office-ui-fabric-react/src/components/List/List.tsx
index 8db9e856ee8de..9e8a2749e7cab 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/List.tsx
@@ -8,7 +8,8 @@ import {
   getParent,
   divProperties,
   getNativeProps,
-  IRenderFunction
+  IRenderFunction,
+  createRef
 } from '../../Utilities';
 import { IList, IListProps, IPage, IPageProps } from './List.types';
 
@@ -89,8 +90,8 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     [key: string]: React.ReactInstance,
   };
 
-  private _root: HTMLElement;
-  private _surface: HTMLElement;
+  private _root = createRef<HTMLDivElement>();
+  private _surface = createRef<HTMLDivElement>();
 
   private _estimatedPageHeight: number;
   private _totalEstimates: number;
@@ -260,11 +261,11 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
 
     this._updatePages();
     this._measureVersion++;
-    this._scrollElement = findScrollableParent(this._root) as HTMLElement;
+    this._scrollElement = findScrollableParent(this._root.value) as HTMLElement;
 
     this._events.on(window, 'resize', this._onAsyncResize);
-    if (this._root) {
-      this._events.on(this._root, 'focus', this._onFocus, true);
+    if (this._root.value) {
+      this._events.on(this._root.value, 'focus', this._onFocus, true);
     }
     if (this._scrollElement) {
       this._events.on(this._scrollElement, 'scroll', this._onScroll);
@@ -344,12 +345,12 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
 
     return (
       <div
-        ref={ this._resolveRef('_root') }
+        ref={ this._root }
         { ...divProps }
         role={ (role === undefined) ? 'list' : role }
         className={ css('ms-List', className) }
       >
-        <div ref={ this._resolveRef('_surface') } className={ css('ms-List-surface') } role='presentation'>
+        <div ref={ this._surface } className={ css('ms-List-surface') } role='presentation'>
           { pageElements }
         </div>
       </div>
@@ -475,7 +476,7 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
   private _onFocus(ev: any) {
     let target = ev.target as HTMLElement;
 
-    while (target !== this._surface) {
+    while (target !== this._surface.value) {
       const indexString = target.getAttribute('data-list-index');
 
       if (indexString) {
@@ -926,13 +927,15 @@ export class List extends BaseComponent<IListProps, IListState> implements IList
     // This needs to be called to recalculate when new pages should be loaded.
     // We check to see how far we've scrolled and if it's further than a third of a page we run it again.
     if (
-      forceUpdate ||
-      !pages ||
-      !this._surfaceRect ||
-      !scrollHeight ||
-      scrollHeight !== this._scrollHeight ||
-      Math.abs(this._scrollTop - scrollTop) > this._estimatedPageHeight / 3) {
-      surfaceRect = this._surfaceRect = _measureSurfaceRect(this._surface);
+      this._surface.value &&
+      (forceUpdate ||
+        !pages ||
+        !this._surfaceRect ||
+        !scrollHeight ||
+        scrollHeight !== this._scrollHeight ||
+        Math.abs(this._scrollTop - scrollTop) > this._estimatedPageHeight / 3)
+    ) {
+      surfaceRect = this._surfaceRect = _measureSurfaceRect(this._surface.value);
       this._scrollTop = scrollTop;
     }
 
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
index f3049b6ee9dd3..1a5abcb5578c1 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.tsx
@@ -9,7 +9,8 @@ import {
   css,
   findScrollableParent,
   getDistanceBetweenPoints,
-  getRTL
+  getRTL,
+  createRef
 } from '../../Utilities';
 
 import { IMarqueeSelectionProps } from './MarqueeSelection.types';
@@ -37,7 +38,7 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
     isEnabled: true
   };
 
-  private _root: HTMLDivElement;
+  private _root = createRef<HTMLDivElement>();
   private _dragOrigin: IPoint | undefined;
   private _rootRect: IRectangle;
   private _lastMouseEvent: MouseEvent | undefined;
@@ -59,11 +60,11 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
   }
 
   public componentDidMount() {
-    this._scrollableParent = findScrollableParent(this._root) as HTMLElement;
+    this._scrollableParent = findScrollableParent(this._root.value) as HTMLElement;
     this._scrollableSurface = (this._scrollableParent === window as any) ? document.body : this._scrollableParent;
     // When scroll events come from window, we need to read scrollTop values from the body.
 
-    const hitTarget = this.props.isDraggingConstrainedToRoot ? this._root : this._scrollableSurface;
+    const hitTarget = this.props.isDraggingConstrainedToRoot ? this._root.value : this._scrollableSurface;
 
     this._events.on(
       hitTarget,
@@ -99,7 +100,7 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
           styles.root,
           rootProps && rootProps.className
         ) }
-        ref={ this._resolveRef('_root') }
+        ref={ this._root }
       >
         { children }
         { dragRect && (<div className={ css('ms-MarqueeSelection-dragMask', styles.dragMask) } />) }
@@ -164,16 +165,16 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
     }
 
     if (!this._isTouch && isEnabled && !this._isDragStartInSelection(ev) && (!onShouldStartSelection || onShouldStartSelection(ev))) {
-      if (this._scrollableSurface && ev.button === 0) {
+      if (this._scrollableSurface && ev.button === 0 && this._root.value) {
         this._selectedIndicies = {};
         this._preservedIndicies = undefined;
         this._events.on(window, 'mousemove', this._onAsyncMouseMove);
         this._events.on(this._scrollableParent, 'scroll', this._onAsyncMouseMove);
         this._events.on(window, 'click', this._onMouseUp, true);
 
-        this._autoScroll = new AutoScroll(this._root);
+        this._autoScroll = new AutoScroll(this._root.value);
         this._scrollTop = this._scrollableSurface.scrollTop;
-        this._rootRect = this._root.getBoundingClientRect();
+        this._rootRect = this._root.value.getBoundingClientRect();
 
         this._onMouseMove(ev);
       }
@@ -302,11 +303,11 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
    */
   private _isDragStartInSelection(ev: MouseEvent): boolean {
     const selection = this.props.selection;
-    if (selection && selection.getSelectedCount() === 0) {
+    if (!this._root.value || (selection && selection.getSelectedCount() === 0)) {
       return false;
     }
 
-    const allElements = this._root.querySelectorAll('[data-selection-index]');
+    const allElements = this._root.value.querySelectorAll('[data-selection-index]');
     for (let i = 0; i < allElements.length; i++) {
       const element = allElements[i];
       const index = Number(element.getAttribute('data-selection-index'));
@@ -324,7 +325,7 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
   private _isInSelectionToggle(ev: MouseEvent): boolean {
     let element: HTMLElement | null = ev.target as HTMLElement;
 
-    while (element && element !== this._root) {
+    while (element && element !== this._root.value) {
       if (element.getAttribute('data-selection-toggle') === 'true') {
         return true;
       }
@@ -337,12 +338,12 @@ export class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMar
 
   private _evaluateSelection(dragRect: IRectangle, rootRect: IRectangle) {
     // Break early if we don't need to evaluate.
-    if (!dragRect) {
+    if (!dragRect || !this._root.value) {
       return;
     }
 
     const { selection } = this.props;
-    const allElements = this._root.querySelectorAll('[data-selection-index]');
+    const allElements = this._root.value.querySelectorAll('[data-selection-index]');
 
     if (!this._itemRectCache) {
       this._itemRectCache = {};
diff --git a/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx b/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
index edcb7b28c59cd..99cdb11f5a5ac 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
+++ b/packages/office-ui-fabric-react/src/components/Modal/Modal.tsx
@@ -2,7 +2,8 @@ import * as React from 'react';
 import {
   BaseComponent,
   css,
-  getId
+  getId,
+  createRef
 } from '../../Utilities';
 import { FocusTrapZone, IFocusTrapZone } from '../FocusTrapZone/index';
 import { IModalProps, IModal } from './Modal.types';
@@ -34,7 +35,7 @@ export class Modal extends BaseComponent<IModalProps, IDialogState> implements I
   };
 
   private _onModalCloseTimer: number;
-  private _focusTrapZone: IFocusTrapZone | undefined;
+  private _focusTrapZone = createRef<IFocusTrapZone>();
 
   constructor(props: IModalProps) {
     super(props);
@@ -122,7 +123,7 @@ export class Modal extends BaseComponent<IModalProps, IDialogState> implements I
             <div className={ modalClassName }>
               <Overlay isDarkThemed={ isDarkOverlay } onClick={ isBlocking ? undefined : (onDismiss as any) } />
               <FocusTrapZone
-                componentRef={this._resolveRef('_focusTrapZone')}
+                componentRef={ this._focusTrapZone }
                 className={ css('ms-Dialog-main', styles.main, this.props.containerClassName) }
                 elementToFocusOnDismiss={ elementToFocusOnDismiss }
                 isClickableOutsideFocusTrap={ isClickableOutsideFocusTrap ? isClickableOutsideFocusTrap : !isBlocking }
@@ -141,7 +142,9 @@ export class Modal extends BaseComponent<IModalProps, IDialogState> implements I
   }
 
   public focus() {
-    this._focusTrapZone && this._focusTrapZone.focus();
+    if (this._focusTrapZone.value) {
+      this._focusTrapZone.value.focus();
+    }
   }
 
   // Watch for completed animations and set the state
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
index 350d3b3c57fb5..aed2fe8a340f9 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.tsx
@@ -1,7 +1,8 @@
 import * as React from 'react';
 import {
   css,
-  BaseComponent
+  BaseComponent,
+  createRef
 } from '../../Utilities';
 import { mergeStyles } from '../../Styling';
 import { IOverflowSet, IOverflowSetProps, IOverflowSetItemProps } from './OverflowSet.types';
@@ -12,7 +13,7 @@ const styles: any = stylesImport;
 
 export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> implements IOverflowSet {
 
-  private _focusZone: FocusZone;
+  private _focusZone = createRef<FocusZone>();
 
   public render() {
     const {
@@ -27,7 +28,7 @@ export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> implements
     return (
       <FocusZone
         { ...focusZoneProps }
-        componentRef={ this._resolveRef('_focusZone') }
+        componentRef={ this._focusZone }
         className={ mergeStyles(
           'ms-OverflowSet',
           styles.root,
@@ -44,8 +45,8 @@ export class OverflowSet extends BaseComponent<IOverflowSetProps, {}> implements
   }
 
   public focus() {
-    if (this._focusZone) {
-      this._focusZone.focus();
+    if (this._focusZone.value) {
+      this._focusZone.value.focus();
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
index 789959bdd1fdb..f92ad0e198c54 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.tsx
@@ -6,7 +6,8 @@ import {
   BaseComponent,
   css,
   getId,
-  getRTL
+  getRTL,
+  createRef
 } from '../../Utilities';
 import { FocusTrapZone } from '../FocusTrapZone/index';
 import { IPanel, IPanelProps, PanelType } from './Panel.types';
@@ -36,7 +37,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
     type: PanelType.smallFixedFar,
   };
 
-  private _content: HTMLElement;
+  private _content = createRef<HTMLDivElement>();
 
   constructor(props: IPanelProps) {
     super(props);
@@ -277,7 +278,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
     );
 
     return (
-      <div ref={ this._resolveRef('_content') } className={ contentClass } >
+      <div ref={ this._content } className={ contentClass } >
         { props.children }
       </div>
     );
@@ -299,7 +300,7 @@ export class Panel extends BaseComponent<IPanelProps, IPanelState> implements IP
   }
 
   private _updateFooterPosition(): void {
-    const _content = this._content;
+    const _content = this._content.value;
     if (_content) {
       const height = _content.clientHeight;
       const innerHeight = _content.scrollHeight;
diff --git a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
index 38c299c98d72e..37826a6b12e22 100644
--- a/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
+++ b/packages/office-ui-fabric-react/src/components/Popup/Popup.tsx
@@ -5,7 +5,8 @@ import {
   divProperties,
   doesElementContainFocus,
   getDocument,
-  getNativeProps
+  getNativeProps,
+  createRef
 } from '../../Utilities';
 import { IPopupProps } from './Popup.types';
 
@@ -18,7 +19,7 @@ export class Popup extends BaseComponent<IPopupProps, {}> {
     shouldRestoreFocus: true
   };
 
-  public _root: HTMLDivElement;
+  public _root = createRef<HTMLDivElement>();
 
   private _originalFocusedElement: HTMLElement;
   private _containsFocus: boolean;
@@ -28,9 +29,14 @@ export class Popup extends BaseComponent<IPopupProps, {}> {
   }
 
   public componentDidMount(): void {
-    this._events.on(this._root, 'focus', this._onFocus, true);
-    this._events.on(this._root, 'blur', this._onBlur, true);
-    if (doesElementContainFocus(this._root)) {
+    if (!this._root.value) {
+      return;
+    }
+
+    this._events.on(this._root.value, 'focus', this._onFocus, true);
+    this._events.on(this._root.value, 'blur', this._onBlur, true);
+
+    if (doesElementContainFocus(this._root.value)) {
       this._containsFocus = true;
     }
   }
@@ -54,13 +60,13 @@ export class Popup extends BaseComponent<IPopupProps, {}> {
     const { role, className, ariaLabel, ariaLabelledBy, ariaDescribedBy, style } = this.props;
 
     let needsVerticalScrollBar = false;
-    if (this._root && this._root.firstElementChild) {
-      needsVerticalScrollBar = this._root.firstElementChild.clientHeight > this._root.clientHeight;
+    if (this._root.value && this._root.value.firstElementChild) {
+      needsVerticalScrollBar = this._root.value.firstElementChild.clientHeight > this._root.value.clientHeight;
     }
 
     return (
       <div
-        ref={ this._resolveRef('_root') }
+        ref={ this._root }
         { ...getNativeProps(this.props, divProperties) }
         className={ className }
         role={ role }
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.base.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.base.tsx
index 5e3db278b0373..f0790dc988d2e 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.base.tsx
@@ -6,7 +6,8 @@ import {
   customizable,
   divProperties,
   getNativeProps,
-  provideContext
+  provideContext,
+  createRef
 } from '../../Utilities';
 import {
   IResizeGroupProps,
@@ -293,8 +294,8 @@ const getClassNames = classNamesFunction<IResizeGroupStyleProps, IResizeGroupSty
 @customizable('ResizeGroup', ['theme'])
 export class ResizeGroupBase extends BaseComponent<IResizeGroupProps, IResizeGroupState> {
   private _nextResizeGroupStateProvider = getNextResizeGroupStateProvider();
-  private _root: HTMLElement;
-  private _measured: HTMLElement;
+  private _root = createRef<HTMLDivElement>();
+  private _measured = createRef<HTMLDivElement>();
 
   constructor(props: IResizeGroupProps) {
     super(props);
@@ -312,11 +313,11 @@ export class ResizeGroupBase extends BaseComponent<IResizeGroupProps, IResizeGro
     const classNames = getClassNames(getStyles!, { theme: theme!, className });
 
     return (
-      <div { ...divProps } className={ classNames.root } ref={ this._resolveRef('_root') }>
+      <div { ...divProps } className={ classNames.root } ref={ this._root }>
         { this._nextResizeGroupStateProvider.shouldRenderDataToMeasureInHiddenDiv(dataToMeasure) && (
           <div
             style={ { position: 'fixed', visibility: 'hidden' } }
-            ref={ this._resolveRef('_measured') }
+            ref={ this._measured }
           >
             <MeasuredContext>{ onRenderData(dataToMeasure) }</MeasuredContext>
           </div>
@@ -350,7 +351,7 @@ export class ResizeGroupBase extends BaseComponent<IResizeGroupProps, IResizeGro
   }
 
   public remeasure(): void {
-    if (this._root) {
+    if (this._root.value) {
       this.setState({ measureContainer: true });
     }
   }
@@ -358,12 +359,12 @@ export class ResizeGroupBase extends BaseComponent<IResizeGroupProps, IResizeGro
   private _afterComponentRendered() {
     this._async.requestAnimationFrame(() => {
       let containerWidth = undefined;
-      if (this.state.measureContainer) {
-        containerWidth = this._root.getBoundingClientRect().width;
+      if (this.state.measureContainer && this._root.value) {
+        containerWidth = this._root.value.getBoundingClientRect().width;
       }
       const nextState = this._nextResizeGroupStateProvider.getNextState(this.props,
         this.state,
-        () => this._measured.scrollWidth,
+        () => this._measured.value ? this._measured.value.scrollWidth : 0,
         containerWidth);
 
       if (nextState) {
@@ -373,7 +374,7 @@ export class ResizeGroupBase extends BaseComponent<IResizeGroupProps, IResizeGro
   }
 
   private _onResize() {
-    if (this._root) {
+    if (this._root.value) {
       this.setState({ measureContainer: true });
     }
   }
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
index d0426e55b0806..8ac7bcd7eb578 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.base.tsx
@@ -8,7 +8,8 @@ import {
   classNamesFunction,
   customizable,
   divProperties,
-  getNativeProps
+  getNativeProps,
+  createRef
 } from '../../Utilities';
 import {
   IScrollablePane,
@@ -30,9 +31,9 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
     scrollablePane: PropTypes.object
   };
 
-  public root: HTMLElement;
-  public stickyAbove: HTMLElement;
-  public stickyBelow: HTMLElement;
+  private _root = createRef<HTMLDivElement>();
+  private _stickyAboveRef = createRef<HTMLDivElement>();
+  private _stickyBelowRef = createRef<HTMLDivElement>();
   private _subscribers: Set<Function>;
   private _stickyAbove: Set<Sticky>;
   private _stickyBelow: Set<Sticky>;
@@ -44,6 +45,18 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
     this._stickyBelow = new Set<Sticky>();
   }
 
+  public get root(): HTMLDivElement | null {
+    return this._root.value;
+  }
+
+  public get stickyAbove(): HTMLDivElement | null {
+    return this._stickyAboveRef.value;
+  }
+
+  public get stickyBelow(): HTMLDivElement | null {
+    return this._stickyBelowRef.value;
+  }
+
   public getChildContext() {
     return {
       scrollablePane: {
@@ -59,19 +72,19 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
   }
 
   public componentDidMount() {
-    this._events.on(this.root, 'scroll', this.notifySubscribers);
+    this._events.on(this._root.value, 'scroll', this.notifySubscribers);
     this._events.on(window, 'resize', this._onWindowResize);
   }
 
   public componentWillUnmount() {
-    this._events.off(this.root);
+    this._events.off(this._root.value);
     this._events.off(window);
   }
 
   public componentDidUpdate(prevProps: IScrollablePaneProps) {
     const initialScrollPosition = this.props.initialScrollPosition;
-    if (initialScrollPosition && prevProps.initialScrollPosition !== initialScrollPosition) {
-      this.root.scrollTop = initialScrollPosition;
+    if (this._root.value && initialScrollPosition && prevProps.initialScrollPosition !== initialScrollPosition) {
+      this._root.value.scrollTop = initialScrollPosition;
     }
   }
 
@@ -87,11 +100,11 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
     return (
       <div
         { ...getNativeProps(this.props, divProperties) }
-        ref={ this._resolveRef('root') }
+        ref={ this._root }
         className={ classNames.root }
       >
-        <div ref={ this._resolveRef('stickyAbove') } className={ classNames.stickyAbove } />
-        <div ref={ this._resolveRef('stickyBelow') } className={ classNames.stickyBelow } />
+        <div ref={ this._stickyAboveRef } className={ classNames.stickyAbove } />
+        <div ref={ this._stickyBelowRef } className={ classNames.stickyBelow } />
         <div data-is-scrollable={ true }>
           { this.props.children }
         </div>
@@ -112,42 +125,52 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
   }
 
   public addStickyHeader = (sticky: Sticky): void => {
-    this._addSticky(sticky, this._stickyAbove, this.stickyAbove, () => {
-      this.stickyAbove.appendChild(sticky.content);
+    this._addSticky(sticky, this._stickyAbove, () => {
+      if (this._stickyAboveRef.value) {
+        this._stickyAboveRef.value.appendChild(sticky.content);
+      }
     });
   }
 
   public addStickyFooter = (sticky: Sticky): void => {
-    this._addSticky(sticky, this._stickyBelow, this.stickyBelow, () => {
-      this.stickyBelow.insertBefore(sticky.content, this.stickyBelow.firstChild);
+    this._addSticky(sticky, this._stickyBelow, () => {
+      if (this._stickyBelowRef.value) {
+        this._stickyBelowRef.value.insertBefore(sticky.content, this._stickyBelowRef.value.firstChild);
+      }
     });
   }
 
   public removeStickyHeader = (sticky: Sticky): void => {
-    this._removeSticky(sticky, this._stickyAbove, this.stickyAbove);
+    this._removeSticky(sticky, this._stickyAbove, this._stickyAboveRef.value);
   }
 
   public removeStickyFooter = (sticky: Sticky): void => {
-    this._removeSticky(sticky, this._stickyBelow, this.stickyBelow);
+    this._removeSticky(sticky, this._stickyBelow, this._stickyBelowRef.value);
   }
 
   public notifySubscribers = (sort?: boolean): void => {
     this._subscribers.forEach((handle) => {
-      handle(this.stickyAbove.getBoundingClientRect(), this.stickyBelow.getBoundingClientRect());
+      if (this._stickyAboveRef.value && this._stickyBelowRef.value) {
+        handle(this._stickyAboveRef.value.getBoundingClientRect(), this._stickyBelowRef.value.getBoundingClientRect());
+      }
     });
     if (this._stickyAbove.size > 1) {
-      this._sortStickies(this._stickyAbove, this.stickyAbove);
+      this._sortStickies(this._stickyAbove, this._stickyAboveRef.value);
     }
     if (this._stickyBelow.size > 1) {
-      this._sortStickies(this._stickyBelow, this.stickyBelow);
+      this._sortStickies(this._stickyBelow, this._stickyBelowRef.value);
     }
   }
 
   public getScrollPosition = (): number => {
-    return this.root.scrollTop;
+    if (this._root.value) {
+      return this._root.value.scrollTop;
+    }
+
+    return 0;
   }
 
-  private _addSticky(sticky: Sticky, stickyList: Set<Sticky>, container: HTMLElement, addStickyToContainer: () => void) {
+  private _addSticky(sticky: Sticky, stickyList: Set<Sticky>, addStickyToContainer: () => void) {
     if (!stickyList.has(sticky)) {
       stickyList.add(sticky);
       addStickyToContainer();
@@ -165,8 +188,8 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
     }
   }
 
-  private _removeSticky(sticky: Sticky, stickyList: Set<Sticky>, container: HTMLElement) {
-    if (stickyList.has(sticky)) {
+  private _removeSticky(sticky: Sticky, stickyList: Set<Sticky>, container: HTMLElement | null) {
+    if (container && stickyList.has(sticky)) {
       sticky.content.removeEventListener('transitionend',
         this._setPlaceholderHeights.bind(null, stickyList, container));
       stickyList.delete(sticky);
@@ -187,11 +210,16 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
     });
   }
 
-  private _sortStickies(stickyList: Set<Sticky>, container: HTMLElement): void {
+  private _sortStickies(stickyList: Set<Sticky>, container: HTMLElement | null): void {
+    // No sorting needed if there is no container
+    if (!container) {
+      return;
+    }
+
     let stickyArr = Array.from(stickyList);
     stickyArr = stickyArr.sort((a, b) => {
-      const aOffset = this._calculateOffsetParent(a.root);
-      const bOffset = this._calculateOffsetParent(b.root);
+      const aOffset = this._calculateOffsetParent(a.root.value);
+      const bOffset = this._calculateOffsetParent(b.root.value);
       return aOffset - bOffset;
     });
     // Get number of elements that is already in order.
@@ -213,9 +241,9 @@ export class ScrollablePaneBase extends BaseComponent<IScrollablePaneProps, {}>
     }
   }
 
-  private _calculateOffsetParent(ele: HTMLElement): number {
+  private _calculateOffsetParent(ele: HTMLElement | null): number {
     let offset = 0;
-    while (ele.offsetParent !== this.root.offsetParent) {
+    while (ele && this._root.value && ele.offsetParent !== this._root.value.offsetParent) {
       offset += ele.offsetTop;
       if (ele.parentElement) {
         ele = ele.parentElement;
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
index ce1f9e48726f7..c5370db822a19 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
@@ -5,7 +5,8 @@ import {
   getId,
   KeyCodes,
   customizable,
-  classNamesFunction
+  classNamesFunction,
+  createRef
 } from '../../Utilities';
 
 import { IconButton } from '../../Button';
@@ -21,8 +22,8 @@ export interface ISearchBoxState {
 
 @customizable('SearchBox', ['theme'])
 export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxState> {
-  private _rootElement: HTMLElement;
-  private _inputElement: HTMLInputElement;
+  private _rootElement = createRef<HTMLDivElement>();
+  private _inputElement = createRef<HTMLInputElement>();
   private _latestValue: string;
 
   public constructor(props: ISearchBoxProps) {
@@ -76,7 +77,7 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
 
     return (
       <div
-        ref={ this._resolveRef('_rootElement') }
+        ref={ this._rootElement }
         className={ classNames.root }
         onFocusCapture={ this._onFocusCapture }
       >
@@ -93,7 +94,7 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
           value={ value }
           disabled={ this.props.disabled }
           aria-label={ ariaLabel ? ariaLabel : placeholder }
-          ref={ this._resolveRef('_inputElement') }
+          ref={ this._inputElement }
         />
         { value!.length > 0 &&
           <div className={ classNames.clearButton }>
@@ -113,8 +114,8 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
    * Sets focus to the search box input field
    */
   public focus() {
-    if (this._inputElement) {
-      this._inputElement.focus();
+    if (this._inputElement.value) {
+      this._inputElement.value.focus();
     }
   }
 
@@ -129,7 +130,7 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
       ev.stopPropagation();
       ev.preventDefault();
 
-      this._inputElement.focus();
+      this.focus();
     }
   }
 
@@ -138,7 +139,7 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
       hasFocus: true
     });
 
-    this._events.on(this._rootElement, 'blur', this._onBlur, true);
+    this._events.on(this._rootElement.value, 'blur', this._onBlur, true);
 
     if (this.props.onFocus) {
       this.props.onFocus(ev as React.FocusEvent<HTMLInputElement>);
@@ -187,8 +188,8 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
     ev.stopPropagation();
   }
 
-  private _onBlur = (ev: React.FocusEvent<HTMLInputElement>) => {
-    this._events.off(this._rootElement, 'blur');
+  private _onBlur = (ev: React.FocusEvent<HTMLInputElement>): void => {
+    this._events.off(this._rootElement.value, 'blur');
     this.setState({
       hasFocus: false
     });
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
index 7b5263a715f98..9343ac04da28a 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.tsx
@@ -5,7 +5,8 @@ import {
   css,
   getId,
   getRTL,
-  getRTLSafeKeyCode
+  getRTLSafeKeyCode,
+  createRef
 } from '../../Utilities';
 import { ISliderProps, ISlider } from './Slider.types';
 import { Label } from '../../Label';
@@ -33,8 +34,8 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     buttonProps: {}
   };
 
-  private _sliderLine: HTMLDivElement;
-  private _thumb: HTMLSpanElement;
+  private _sliderLine = createRef<HTMLDivElement>();
+  private _thumb = createRef<HTMLSpanElement>();
   private _id: string;
 
   constructor(props: ISliderProps) {
@@ -126,11 +127,11 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
             role='slider'
           >
             <div
-              ref={ this._resolveRef('_sliderLine') }
+              ref={ this._sliderLine }
               className={ css('ms-Slider-line', styles.line) }
             >
               <span
-                ref={ this._resolveRef('_thumb') }
+                ref={ this._thumb }
                 className={ css('ms-Slider-thumb', styles.thumb) }
                 style={ this._getThumbStyle(vertical, thumbOffsetPercent) }
               />
@@ -150,8 +151,8 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
     ) as React.ReactElement<{}>;
   }
   public focus(): void {
-    if (this._thumb) {
-      this._thumb.focus();
+    if (this._thumb.value) {
+      this._thumb.value.focus();
     }
   }
 
@@ -184,9 +185,13 @@ export class Slider extends BaseComponent<ISliderProps, ISliderState> implements
   }
 
   private _onMouseMoveOrTouchMove = (event: MouseEvent | TouchEvent, suppressEventCancelation?: boolean): void => {
+    if (!this._sliderLine.value) {
+      return;
+    }
+
     const { max, min, step } = this.props;
     const steps: number = (max! - min!) / step!;
-    const sliderPositionRect: ClientRect = this._sliderLine.getBoundingClientRect();
+    const sliderPositionRect: ClientRect = this._sliderLine.value.getBoundingClientRect();
     const sliderLength: number = !this.props.vertical ? sliderPositionRect.width : sliderPositionRect.height;
     const stepLength: number = sliderLength / steps;
     let currentSteps: number | undefined;
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index 2d191fb380f69..f73fbec1ec491 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -8,7 +8,8 @@ import {
   KeyCodes,
   customizable,
   calculatePrecision,
-  precisionRound
+  precisionRound,
+  createRef
 } from '../../Utilities';
 import {
   ISpinButton,
@@ -62,7 +63,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
     decrementButtonIcon: { iconName: 'ChevronDownSmall' }
   };
 
-  private _input: HTMLInputElement;
+  private _input = createRef<HTMLInputElement>();
   private _inputId: string;
   private _labelId: string;
   private _lastValidValue: string;
@@ -205,7 +206,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
             aria-valuemin={ min && String(min) }
             aria-valuemax={ max && String(max) }
             onBlur={ this._onBlur }
-            ref={ this._resolveRef('_input') }
+            ref={ this._input }
             onFocus={ this._onFocus }
             onKeyDown={ this._handleKeyDown }
             onKeyUp={ this._handleKeyUp }
@@ -259,17 +260,22 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
   }
 
   public focus(): void {
-    if (this._input) {
-      this._input.focus();
+    if (this._input.value) {
+      this._input.value.focus();
     }
   }
 
   private _onFocus = (ev: React.FocusEvent<HTMLInputElement>): void => {
+    // We can't set focus on a non-existing element
+    if (!this._input.value) {
+      return;
+    }
+
     if (this._spinningByMouse || this.state.keyboardSpinDirection !== KeyboardSpinDirection.notSpinning) {
       this._stop();
     }
 
-    this._input.select();
+    this._input.value.select();
 
     this.setState({ isFocused: true });
 
diff --git a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
index 76e69f40d396f..6b08abea6d4ea 100644
--- a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
+++ b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.tsx
@@ -4,7 +4,7 @@ import * as ReactDOM from 'react-dom';
 /* tslint:enable:no-unused-variable */
 
 import * as PropTypes from 'prop-types';
-import { BaseComponent } from '../../Utilities';
+import { BaseComponent, createRef } from '../../Utilities';
 import { IStickyProps, StickyPositionType } from './Sticky.types';
 
 export interface IStickyState {
@@ -39,7 +39,7 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
   };
 
   public content: HTMLElement;
-  public root: HTMLElement;
+  public root = createRef<HTMLDivElement>();
 
   constructor(props: IStickyProps) {
     super(props);
@@ -49,7 +49,7 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
     };
   }
 
-  public componentDidMount() {
+  public componentDidMount(): void {
     if (!this.context.scrollablePane) {
       throw new TypeError('Expected Sticky to be mounted within ScrollablePane');
     }
@@ -58,11 +58,13 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
     this.content = document.createElement('div');
     this.content.style.background = this.props.stickyBackgroundColor || this._getBackground();
     ReactDOM.render(<div>{ this.props.children }</div>, this.content);
-    this.root.appendChild(this.content);
+    if (this.root.value) {
+      this.root.value.appendChild(this.content);
+    }
     this.context.scrollablePane.notifySubscribers(true);
   }
 
-  public componentWillUnmount() {
+  public componentWillUnmount(): void {
     const { isStickyTop, isStickyBottom } = this.state;
     const { scrollablePane } = this.context;
     if (isStickyTop) {
@@ -78,7 +80,7 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
     scrollablePane.unsubscribe(this._onScrollEvent);
   }
 
-  public componentDidUpdate(prevProps: IStickyProps, prevState: IStickyState) {
+  public componentDidUpdate(prevProps: IStickyProps, prevState: IStickyState): void {
     const { isStickyTop, isStickyBottom } = this.state;
     const { scrollablePane } = this.context;
 
@@ -107,7 +109,7 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
     }
   }
 
-  public shouldComponentUpdate(nextProps: IStickyProps, nextState: IStickyState) {
+  public shouldComponentUpdate(nextProps: IStickyProps, nextState: IStickyState): boolean {
     const { isStickyTop, isStickyBottom, placeholderHeight } = this.state;
     return isStickyTop !== nextState.isStickyTop ||
       isStickyBottom !== nextState.isStickyBottom ||
@@ -115,25 +117,29 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
       this.props.children !== nextProps.children;
   }
 
-  public setPlaceholderHeight(height: number) {
+  public setPlaceholderHeight(height: number): void {
     this.setState({
       placeholderHeight: height
     });
   }
 
-  public render() {
+  public render(): JSX.Element {
     const { isStickyTop, isStickyBottom, placeholderHeight } = this.state;
     const isSticky = isStickyTop || isStickyBottom;
 
     return (
-      <div ref={ this._resolveRef('root') }>
+      <div ref={ this.root }>
         <div style={ { height: (isSticky ? placeholderHeight : 0) } } />
       </div>
     );
   }
 
-  private _onScrollEvent = (headerBound: ClientRect, footerBound: ClientRect) => {
-    const { top, bottom } = this.root.getBoundingClientRect();
+  private _onScrollEvent = (headerBound: ClientRect, footerBound: ClientRect): void => {
+    if (!this.root.value) {
+      return;
+    }
+
+    const { top, bottom } = this.root.value.getBoundingClientRect();
     const { isStickyTop, isStickyBottom } = this.state;
     const { stickyPosition } = this.props;
     const canStickyHeader = stickyPosition === StickyPositionType.Both || stickyPosition === StickyPositionType.Header;
@@ -145,15 +151,18 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
     });
   }
 
-  private _setSticky(callback: () => void) {
+  private _setSticky(callback: () => void): void {
     if (this.content.parentElement) {
       this.content.parentElement.removeChild(this.content);
     }
     callback();
   }
 
-  private _resetSticky(callback: () => void) {
-    this.root.appendChild(this.content);
+  private _resetSticky(callback: () => void): void {
+    if (this.root.value) {
+      this.root.value.appendChild(this.content);
+    }
+
     setTimeout(() => {
       if (this.props.stickyClassName) {
         this.content.children[0].classList.remove(this.props.stickyClassName);
@@ -164,7 +173,12 @@ export class Sticky extends BaseComponent<IStickyProps, IStickyState> {
 
   // Gets background of nearest parent element that has a declared background-color attribute
   private _getBackground(): string | null {
-    let curr = this.root;
+    if (!this.root.value) {
+      return null;
+    }
+
+    let curr: HTMLElement = this.root.value;
+
     while (window.getComputedStyle(curr).getPropertyValue('background-color') === 'rgba(0, 0, 0, 0)' ||
       window.getComputedStyle(curr).getPropertyValue('background-color') === 'transparent') {
       if (curr.tagName === 'HTML') {
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
index 8bd786aca93be..ceb246fb4f421 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.tsx
@@ -53,7 +53,6 @@ export class TeachingBubble extends BaseComponent<ITeachingBubbleProps, ITeachin
 
     return (
       <Callout
-        ref={ this._resolveRef('_callout') }
         target={ targetElement }
         onDismiss={ onDismiss }
         { ...calloutProps }
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index 8962b4c61e680..4b48d7192b0f8 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -9,7 +9,8 @@ import {
   css,
   getNativeProps,
   inputProperties,
-  textAreaProperties
+  textAreaProperties,
+  createRef
 } from '../../Utilities';
 import * as stylesImport from './TextField.scss';
 const styles: any = stylesImport;
@@ -55,7 +56,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
   private _latestValue: string | undefined;
   private _latestValidateValue: string | undefined;
   private _isDescriptionAvailable: boolean;
-  private _textElement: HTMLTextAreaElement;
+  private _textElement = createRef<HTMLTextAreaElement | HTMLInputElement | null>();
 
   public constructor(props: ITextFieldProps) {
     super(props);
@@ -213,8 +214,8 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
    * Sets focus on the text field
    */
   public focus() {
-    if (this._textElement) {
-      this._textElement.focus();
+    if (this._textElement.value) {
+      this._textElement.value.focus();
     }
   }
 
@@ -222,8 +223,8 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
    * Selects the text field
    */
   public select() {
-    if (this._textElement) {
-      this._textElement.select();
+    if (this._textElement.value) {
+      this._textElement.value.select();
     }
   }
 
@@ -231,8 +232,8 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
    * Sets the selection start of the text field to a specified value
    */
   public setSelectionStart(value: number) {
-    if (this._textElement) {
-      this._textElement.selectionStart = value;
+    if (this._textElement.value) {
+      this._textElement.value.selectionStart = value;
     }
   }
 
@@ -240,8 +241,8 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
    * Sets the selection end of the text field to a specified value
    */
   public setSelectionEnd(value: number) {
-    if (this._textElement) {
-      this._textElement.selectionEnd = value;
+    if (this._textElement.value) {
+      this._textElement.value.selectionEnd = value;
     }
   }
 
@@ -249,14 +250,14 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
    * Gets the selection start of the text field
    */
   public get selectionStart(): number {
-    return this._textElement ? this._textElement.selectionStart : -1;
+    return this._textElement.value ? this._textElement.value.selectionStart : -1;
   }
 
   /**
    * Gets the selection end of the text field
    */
   public get selectionEnd(): number {
-    return this._textElement ? this._textElement.selectionEnd : -1;
+    return this._textElement.value ? this._textElement.value.selectionEnd : -1;
   }
 
   /**
@@ -265,8 +266,8 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
    * @param end Index of the end of the selection.
    */
   public setSelectionRange(start: number, end: number) {
-    if (this._textElement) {
-      this._textElement.setSelectionRange(start, end);
+    if (this._textElement.value) {
+      this._textElement.value.setSelectionRange(start, end);
     }
   }
 
@@ -355,7 +356,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
       <textarea
         id={ this._id }
         { ...textAreaProps }
-        ref={ this._resolveRef('_textElement') }
+        ref={ this._textElement }
         value={ this.state.value }
         onInput={ this._onInputChange }
         onChange={ this._onInputChange }
@@ -377,7 +378,7 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
         type={ 'text' }
         id={ this._id }
         { ...inputProps }
-        ref={ this._resolveRef('_textElement') }
+        ref={ this._textElement }
         value={ this.state.value }
         onInput={ this._onInputChange }
         onChange={ this._onInputChange }
@@ -464,8 +465,8 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
   }
 
   private _adjustInputHeight(): void {
-    if (this._textElement && this.props.autoAdjustHeight && this.props.multiline) {
-      const textField = this._textElement as HTMLElement;
+    if (this._textElement.value && this.props.autoAdjustHeight && this.props.multiline) {
+      const textField = this._textElement.value;
       textField.style.height = '';
       const scrollHeight = textField.scrollHeight + 2; // +2 to avoid vertical scroll bars
       textField.style.height = scrollHeight + 'px';
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
index fb56aeb620a8b..c1b30f5339098 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.tsx
@@ -3,7 +3,8 @@ import {
   BaseComponent,
   getId,
   inputProperties,
-  getNativeProps
+  getNativeProps,
+  createRef
 } from '../../Utilities';
 import {
   IToggleProps,
@@ -23,7 +24,7 @@ export interface IToggleState {
 export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements IToggle {
 
   private _id: string;
-  private _toggleButton: HTMLButtonElement;
+  private _toggleButton = createRef<HTMLButtonElement>();
 
   constructor(props: IToggleProps) {
     super(props);
@@ -97,7 +98,7 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
             disabled={ disabled }
             id={ this._id }
             type='button'
-            ref={ this._resolveRef('_toggleButton') }
+            ref={ this._toggleButton }
             aria-disabled={ disabled }
             aria-pressed={ isChecked }
             aria-label={ ariaLabel ? ariaLabel : label }
@@ -116,8 +117,8 @@ export class Toggle extends BaseComponent<IToggleProps, IToggleState> implements
   }
 
   public focus() {
-    if (this._toggleButton) {
-      this._toggleButton.focus();
+    if (this._toggleButton.value) {
+      this._toggleButton.value.focus();
     }
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
index bec443549ccce..18fe6edfc3e5f 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
@@ -8,7 +8,8 @@ import {
   getNativeProps,
   getId,
   assign,
-  hasOverflow
+  hasOverflow,
+  createRef
 } from '../../Utilities';
 import { ITooltipHostProps, TooltipOverflowMode } from './TooltipHost.types';
 import { Tooltip } from './Tooltip';
@@ -27,7 +28,7 @@ export class TooltipHost extends BaseComponent<ITooltipHostProps, ITooltipHostSt
   };
 
   // The wrapping div that gets the hover events
-  private _tooltipHost: HTMLElement;
+  private _tooltipHost = createRef<HTMLDivElement>();
 
   // Constructor
   constructor(props: ITooltipHostProps) {
@@ -63,7 +64,7 @@ export class TooltipHost extends BaseComponent<ITooltipHostProps, ITooltipHostSt
           hostClassName,
           overflowMode !== undefined && styles.hostOverflow
         ) }
-        ref={ this._resolveRef('_tooltipHost') }
+        ref={ this._tooltipHost }
         { ...{ onFocusCapture: this._onTooltipMouseEnter } }
         { ...{ onBlurCapture: this._hideTooltip } }
         onMouseEnter={ this._onTooltipMouseEnter }
@@ -88,7 +89,11 @@ export class TooltipHost extends BaseComponent<ITooltipHostProps, ITooltipHostSt
     );
   }
 
-  private _getTargetElement(): HTMLElement {
+  private _getTargetElement(): HTMLElement | undefined {
+    if (!this._tooltipHost.value) {
+      return undefined;
+    }
+
     const { overflowMode } = this.props;
 
     // Select target element based on overflow mode. For parent mode, you want to position the tooltip relative
@@ -96,14 +101,14 @@ export class TooltipHost extends BaseComponent<ITooltipHostProps, ITooltipHostSt
     if (overflowMode !== undefined) {
       switch (overflowMode) {
         case TooltipOverflowMode.Parent:
-          return this._tooltipHost.parentElement!;
+          return this._tooltipHost.value.parentElement!;
 
         case TooltipOverflowMode.Self:
-          return this._tooltipHost;
+          return this._tooltipHost.value;
       }
     }
 
-    return this._tooltipHost;
+    return this._tooltipHost.value;
   }
 
   // Show Tooltip
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
index 0be5a92fd6469..7964e17a87384 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.tsx
@@ -2,7 +2,8 @@ import * as React from 'react';
 import {
   BaseComponent,
   KeyCodes,
-  css
+  css,
+  createRef
 } from '../../Utilities';
 import { FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { Callout, DirectionalHint } from '../../Callout';
@@ -33,10 +34,10 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   protected selection: Selection;
 
-  protected root: HTMLElement;
-  protected input: Autofill;
-  protected focusZone: FocusZone;
-  protected suggestionElement: Suggestions<T>;
+  protected root = createRef<HTMLDivElement>();
+  protected input = createRef<Autofill>();
+  protected focusZone = createRef<FocusZone>();
+  protected suggestionElement = createRef<Suggestions<T>>();
 
   protected suggestionStore: SuggestionsController<T>;
   protected SuggestionOfProperType = Suggestions as new (props: ISuggestionsProps<T>) => Suggestions<T>;
@@ -109,12 +110,14 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   }
 
   public focus() {
-    this.focusZone.focus();
+    if (this.focusZone.value) {
+      this.focusZone.value.focus();
+    }
   }
 
   public focusInput() {
-    if (this.input) {
-      this.input.focus();
+    if (this.input.value) {
+      this.input.value.focus();
     }
   }
 
@@ -144,10 +147,10 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   }
 
   public completeSuggestion() {
-    if (this.suggestionStore.hasSelectedSuggestion()) {
+    if (this.suggestionStore.hasSelectedSuggestion() && this.input.value) {
       this.addItem(this.suggestionStore.currentSuggestion!.item);
       this.updateValue('');
-      this.input.clear();
+      this.input.value.clear();
     }
   }
 
@@ -177,14 +180,14 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
     return (
       <div
-        ref={ this._resolveRef('root') }
+        ref={ this.root }
         className={ css(
           'ms-BasePicker',
           className ? className : '') }
         onKeyDown={ this.onKeyDown }
       >
         <FocusZone
-          ref={ this._resolveRef('focusZone') }
+          componentRef={ this.focusZone }
           direction={ FocusZoneDirection.bidirectional }
           isInnerZoneKeystroke={ this._isFocusZoneInnerKeystroke }
         >
@@ -195,7 +198,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
               { this.canAddItems() && (<Autofill
                 { ...inputProps as any }
                 className={ css('ms-BasePicker-input', styles.pickerInput) }
-                ref={ this._resolveRef('input') }
+                ref={ this.input }
                 onFocus={ this.onInputFocus }
                 onBlur={ this.onInputBlur }
                 onInputValueChange={ this.onInputChange }
@@ -231,7 +234,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
       <Callout
         isBeakVisible={ false }
         gapSpace={ 5 }
-        target={ this.input.inputElement }
+        target={ this.input.value ? this.input.value.inputElement : undefined }
         onDismiss={ this.dismissSuggestions }
         directionalHint={ DirectionalHint.bottomLeftEdge }
         directionalHintForRTL={ DirectionalHint.bottomRightEdge }
@@ -241,7 +244,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
           onSuggestionClick={ this.onSuggestionClick }
           onSuggestionRemove={ this.onSuggestionRemove }
           suggestions={ this.suggestionStore.getSuggestions() }
-          ref={ this._resolveRef('suggestionElement') }
+          ref={ this.suggestionElement }
           onGetMoreResults={ this.onGetMoreResults }
           moreSuggestionsAvailable={ this.state.moreSuggestionsAvailable }
           isLoading={ this.state.suggestionsLoading }
@@ -276,21 +279,23 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     const { items } = this.state;
 
     if (items.length && index! >= 0) {
-      const newEl: HTMLElement = this.root.querySelectorAll('[data-selection-index]')[Math.min(index!, items.length - 1)] as HTMLElement;
-      if (newEl) {
-        this.focusZone.focusElement(newEl);
+      const newEl: HTMLElement | null = this.root.value && this.root.value.querySelectorAll('[data-selection-index]')[Math.min(index!, items.length - 1)] as HTMLElement | null;
+      if (newEl && this.focusZone.value) {
+        this.focusZone.value.focusElement(newEl);
       }
     } else if (!this.canAddItems()) {
       (items[items.length - 1] as IPickerItemProps<T>).selected = true;
       this.resetFocus(items.length - 1);
     } else {
-      this.input.focus();
+      if (this.input.value) {
+        this.input.value.focus();
+      }
     }
   }
 
   protected onSuggestionSelect() {
     if (this.suggestionStore.currentSuggestion) {
-      const currentValue: string = this.input.value;
+      const currentValue: string = this.input.value ? this.input.value.value : '';
       const itemValue: string = this._getTextFromItem(this.suggestionStore.currentSuggestion.item, currentValue);
       this.setState({ suggestedDisplayValue: itemValue });
     }
@@ -341,11 +346,11 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
       if (updatedValue !== undefined) {
         this.setState({
-          suggestionsVisible: this.input && this.input.value !== '' && this.input.inputElement === document.activeElement
+          suggestionsVisible: this.input.value ? (this.input.value.value !== '' && this.input.value.inputElement === document.activeElement) : false
         });
       } else {
         this.setState({
-          suggestionsVisible: this.input && this.input.inputElement === document.activeElement
+          suggestionsVisible: this.input.value ? this.input.value.inputElement === document.activeElement : false
         });
       }
 
@@ -381,7 +386,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     this.setState({
       suggestionsLoading: false,
       suggestedDisplayValue: itemValue,
-      suggestionsVisible: this.input && this.input.value !== '' && this.input.inputElement === document.activeElement
+      suggestionsVisible: this.input.value ? (this.input.value.value !== '' && this.input.value.inputElement === document.activeElement) : false
     });
   }
 
@@ -414,14 +419,14 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   protected onInputFocus = (ev: React.FocusEvent<HTMLInputElement | Autofill>): void => {
     this.setState({ isFocused: true });
     this.selection.setAllSelected(false);
-    if (this.input && this.input.value === '' && this.props.onEmptyInputFocus) {
+    if (this.input.value && this.input.value.value === '' && this.props.onEmptyInputFocus) {
       this.onEmptyInputFocus();
       this.setState({
         isMostRecentlyUsedVisible: true,
         moreSuggestionsAvailable: false,
         suggestionsVisible: true
       });
-    } else if (this.input && this.input.value) {
+    } else if (this.input.value && this.input.value.value) {
       this.setState({
         isMostRecentlyUsedVisible: false,
         suggestionsVisible: true
@@ -452,8 +457,8 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
       case KeyCodes.tab:
       case KeyCodes.enter:
-        if (this.suggestionElement && this.suggestionElement.hasSuggestedActionSelected()) {
-          this.suggestionElement.executeSelectedAction();
+        if (this.suggestionElement.value && this.suggestionElement.value.hasSuggestedActionSelected()) {
+          this.suggestionElement.value.executeSelectedAction();
         } else if (!ev.shiftKey && this.suggestionStore.hasSelectedSuggestion() && this.state.suggestionsVisible) {
           this.completeSuggestion();
           ev.preventDefault();
@@ -473,7 +478,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
       case KeyCodes.del:
         if (!this.props.disabled) {
-          if (this.input && ev.target === this.input.inputElement && this.state.suggestionsVisible && this.suggestionStore.currentIndex !== -1) {
+          if (this.input.value && ev.target === this.input.value.inputElement && this.state.suggestionsVisible && this.suggestionStore.currentIndex !== -1) {
             if (this.props.onRemoveSuggestion) {
               (this.props.onRemoveSuggestion as any)(this.suggestionStore.currentSuggestion!.item);
             }
@@ -487,15 +492,15 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
         break;
 
       case KeyCodes.up:
-        if (ev.target === this.input.inputElement && this.state.suggestionsVisible) {
-          if (this.suggestionElement.tryHandleKeyDown(keyCode, this.suggestionStore.currentIndex)) {
+        if (this.input.value && ev.target === this.input.value.inputElement && this.state.suggestionsVisible) {
+          if (this.suggestionElement.value && this.suggestionElement.value.tryHandleKeyDown(keyCode, this.suggestionStore.currentIndex)) {
             ev.preventDefault();
             ev.stopPropagation();
           } else {
-            if (this.suggestionElement.hasSuggestedAction() && this.suggestionStore.currentIndex === 0) {
+            if (this.suggestionElement.value && this.suggestionElement.value.hasSuggestedAction() && this.suggestionStore.currentIndex === 0) {
               ev.preventDefault();
               ev.stopPropagation();
-              this.suggestionElement.focusAboveSuggestions();
+              this.suggestionElement.value.focusAboveSuggestions();
               this.suggestionStore.deselectAllSuggestions();
               this.forceUpdate();
             } else {
@@ -510,15 +515,15 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
         break;
 
       case KeyCodes.down:
-        if (ev.target === this.input.inputElement && this.state.suggestionsVisible) {
-          if (this.suggestionElement.tryHandleKeyDown(keyCode, this.suggestionStore.currentIndex)) {
+        if (this.input.value && ev.target === this.input.value.inputElement && this.state.suggestionsVisible) {
+          if (this.suggestionElement.value && this.suggestionElement.value.tryHandleKeyDown(keyCode, this.suggestionStore.currentIndex)) {
             ev.preventDefault();
             ev.stopPropagation();
           } else {
-            if (this.suggestionElement.hasSuggestedAction() && (this.suggestionStore.currentIndex + 1) === this.suggestionStore.suggestions.length) {
+            if (this.suggestionElement.value && this.suggestionElement.value.hasSuggestedAction() && (this.suggestionStore.currentIndex + 1) === this.suggestionStore.suggestions.length) {
               ev.preventDefault();
               ev.stopPropagation();
-              this.suggestionElement.focusBelowSuggestions();
+              this.suggestionElement.value.focusBelowSuggestions();
               this.suggestionStore.deselectAllSuggestions();
               this.forceUpdate();
             } else {
@@ -549,8 +554,8 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
     this.setState({
       isSearching: true
     }, () => {
-      if (this.props.onGetMoreResults) {
-        const suggestions: T[] | PromiseLike<T[]> = (this.props.onGetMoreResults as any)(this.input.value, this.state.items);
+      if (this.props.onGetMoreResults && this.input.value) {
+        const suggestions: T[] | PromiseLike<T[]> = (this.props.onGetMoreResults as any)(this.input.value.value, this.state.items);
         const suggestionsArray: T[] = suggestions as T[];
         const suggestionsPromiseLike: PromiseLike<T[]> = suggestions as PromiseLike<T[]>;
 
@@ -566,7 +571,11 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
       } else {
         this.setState({ isSearching: false });
       }
-      this.input.focus();
+
+      if (this.input.value) {
+        this.input.value.focus();
+      }
+
       this.setState({
         moreSuggestionsAvailable: false,
         isResultsFooterVisible: true
@@ -576,8 +585,8 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
 
   protected addItemByIndex = (index: number): void => {
     this.addItem(this.suggestionStore.getSuggestionAtIndex(index).item);
-    if (this.input) {
-      this.input.clear();
+    if (this.input.value) {
+      this.input.value.clear();
     }
     this.updateValue('');
   }
@@ -627,7 +636,7 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   // This is protected because we may expect the backspace key to work differently in a different kind of picker.
   // This lets the subclass override it and provide it's own onBackspace. For an example see the BasePickerListBelow
   protected onBackspace(ev: React.KeyboardEvent<HTMLElement>) {
-    if (this.state.items.length && !this.input || (!this.input.isValueSelected && this.input.cursorLocation === 0)) {
+    if (this.state.items.length && !this.input.value || this.input.value && (!this.input.value.isValueSelected && this.input.value.cursorLocation === 0)) {
       if (this.selection.getSelectedCount() > 0) {
         this.removeItems(this.selection.getSelection());
       } else {
@@ -682,8 +691,8 @@ export class BasePicker<T, P extends IBasePickerProps<T>> extends BaseComponent<
   }
 
   private _onValidateInput() {
-    if (this.props.onValidateInput && (this.props.onValidateInput as any)(this.input.value) !== ValidationState.invalid && this.props.createGenericItem) {
-      const itemToConvert = this.props.createGenericItem(this.input.value, this.props.onValidateInput(this.input.value));
+    if (this.props.onValidateInput && this.input.value && (this.props.onValidateInput as any)(this.input.value.value) !== ValidationState.invalid && this.props.createGenericItem) {
+      const itemToConvert = this.props.createGenericItem(this.input.value.value, this.props.onValidateInput(this.input.value.value));
       this.suggestionStore.createGenericSuggestion(itemToConvert);
       this.completeSuggestion();
     }
@@ -710,7 +719,7 @@ export class BasePickerListBelow<T, P extends IBasePickerProps<T>> extends BaseP
     return (
       <div>
         <div
-          ref={ this._resolveRef('root') }
+          ref={ this.root }
           className={ css('ms-BasePicker', className ? className : '') }
           onKeyDown={ this.onKeyDown }
         >
@@ -722,7 +731,7 @@ export class BasePickerListBelow<T, P extends IBasePickerProps<T>> extends BaseP
               <Autofill
                 { ...inputProps as any }
                 className={ css('ms-BasePicker-input', styles.pickerInput) }
-                ref={ this._resolveRef('input') }
+                ref={ this.input }
                 onFocus={ this.onInputFocus }
                 onBlur={ this.onInputBlur }
                 onInputValueChange={ this.onInputChange }
@@ -741,7 +750,7 @@ export class BasePickerListBelow<T, P extends IBasePickerProps<T>> extends BaseP
         </div>
         { this.renderSuggestions() }
         <FocusZone
-          ref={ this._resolveRef('focusZone') }
+          componentRef={ this.focusZone }
           className='ms-BasePicker-selectedItems'
           isCircularNavigation={ true }
           direction={ FocusZoneDirection.bidirectional }
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
index a49ac00f9020e..6a928a6039e63 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/PeoplePickerItems/SelectedItemWithMenu.tsx
@@ -1,7 +1,7 @@
 /* tslint:disable */
 import * as React from 'react';
 /* tslint:enable */
-import { BaseComponent, css } from '../../../../Utilities';
+import { BaseComponent, css, createRef } from '../../../../Utilities';
 import { IPeoplePickerItemWithMenuProps } from './PeoplePickerItem.types';
 import { Persona, PersonaPresence } from '../../../../Persona';
 import { ContextualMenu, DirectionalHint } from '../../../../ContextualMenu';
@@ -19,7 +19,7 @@ export class SelectedItemWithMenu extends BaseComponent<IPeoplePickerItemWithMen
     [key: string]: any,
   };
 
-  private _ellipsisRef: HTMLElement;
+  private _ellipsisRef = createRef<HTMLDivElement>();
 
   constructor(props: IPeoplePickerItemWithMenuProps) {
     super(props);
@@ -41,7 +41,7 @@ export class SelectedItemWithMenu extends BaseComponent<IPeoplePickerItemWithMen
               presence={ item.presence !== undefined ? item.presence : PersonaPresence.none }
             />
           </div>
-          <div ref={ this._resolveRef('_ellipsisRef') } className={ css('ms-PickerItem-content', styles.itemContent) }>
+          <div ref={ this._ellipsisRef } className={ css('ms-PickerItem-content', styles.itemContent) }>
             <IconButton
               iconProps={ { iconName: 'More' } }
               onClick={ this._onContextualMenu }
@@ -58,7 +58,7 @@ export class SelectedItemWithMenu extends BaseComponent<IPeoplePickerItemWithMen
             <ContextualMenu
               items={ item.menuItems! }
               shouldFocusOnMount={ true }
-              target={ this._ellipsisRef }
+              target={ this._ellipsisRef.value }
               onDismiss={ this._onCloseContextualMenu }
               directionalHint={ DirectionalHint.bottomAutoEdge }
             />)
diff --git a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
index e652f40b14dac..45c8dd296a50e 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/Suggestions/Suggestions.tsx
@@ -2,7 +2,8 @@ import * as React from 'react';
 import {
   BaseComponent,
   css,
-  KeyCodes
+  KeyCodes,
+  createRef
 } from '../../../Utilities';
 import { CommandButton, IconButton, IButton } from '../../../Button';
 import { Spinner } from '../../../Spinner';
@@ -62,9 +63,9 @@ export class SuggestionsItem<T> extends BaseComponent<ISuggestionItemProps<T>, {
 
 export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggestionsState> {
 
-  protected _forceResolveButton: IButton;
-  protected _searchForMoreButton: IButton;
-  protected _selectedElement: HTMLDivElement;
+  protected _forceResolveButton = createRef<IButton>();
+  protected _searchForMoreButton = createRef<IButton>();
+  protected _selectedElement = createRef<HTMLDivElement>();
   private SuggestionsItemOfProperType = SuggestionsItem as new (props: ISuggestionItemProps<T>) => SuggestionsItem<T>;
 
   constructor(suggestionsProps: ISuggestionsProps<T>) {
@@ -128,7 +129,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
           </div>) : (null) }
         { forceResolveText && this._shouldShowForceResolve() && (
           <CommandButton
-            componentRef={ this._resolveRef('_forceResolveButton') }
+            componentRef={ this._forceResolveButton }
             className={ css(
               'ms-forceResolve-button',
               styles.actionButton,
@@ -152,7 +153,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
         }
         { searchForMoreText && moreSuggestionsAvailable && (
           <CommandButton
-            componentRef={ this._resolveRef('_searchForMoreButton') }
+            componentRef={ this._searchForMoreButton }
             className={ css('ms-SearchMore-button',
               styles.actionButton,
               {
@@ -203,14 +204,14 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
           if (suggestionLength > 0) {
             this._refocusOnSuggestions(keyCode);
             newSelectedActionType = SuggestionActionType.none;
-          } else if (this._searchForMoreButton) {
+          } else if (this._searchForMoreButton.value) {
             newSelectedActionType = SuggestionActionType.searchMore;
           } else {
             newSelectedActionType = SuggestionActionType.forceResolve;
           }
           break;
         case SuggestionActionType.searchMore:
-          if (this._forceResolveButton) {
+          if (this._forceResolveButton.value) {
             newSelectedActionType = SuggestionActionType.forceResolve;
           } else if (suggestionLength > 0) {
             this._refocusOnSuggestions(keyCode);
@@ -220,7 +221,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
           }
           break;
         case SuggestionActionType.none:
-          if (currentSuggestionIndex === -1 && this._forceResolveButton) {
+          if (currentSuggestionIndex === -1 && this._forceResolveButton.value) {
             newSelectedActionType = SuggestionActionType.forceResolve;
           }
           break;
@@ -228,7 +229,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
     } else if (keyCode === KeyCodes.up) {
       switch (currentSelectedAction) {
         case SuggestionActionType.forceResolve:
-          if (this._searchForMoreButton) {
+          if (this._searchForMoreButton.value) {
             newSelectedActionType = SuggestionActionType.searchMore;
           } else if (suggestionLength > 0) {
             this._refocusOnSuggestions(keyCode);
@@ -239,12 +240,12 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
           if (suggestionLength > 0) {
             this._refocusOnSuggestions(keyCode);
             newSelectedActionType = SuggestionActionType.none;
-          } else if (this._forceResolveButton) {
+          } else if (this._forceResolveButton.value) {
             newSelectedActionType = SuggestionActionType.forceResolve;
           }
           break;
         case SuggestionActionType.none:
-          if (currentSuggestionIndex === -1 && this._searchForMoreButton) {
+          if (currentSuggestionIndex === -1 && this._searchForMoreButton.value) {
             newSelectedActionType = SuggestionActionType.searchMore;
           }
           break;
@@ -260,7 +261,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
   }
 
   public hasSuggestedAction(): boolean {
-    return this._searchForMoreButton !== undefined || this._forceResolveButton !== undefined;
+    return this._searchForMoreButton.value !== undefined || this._forceResolveButton.value !== undefined;
   }
 
   public hasSuggestedActionSelected(): boolean {
@@ -279,31 +280,31 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
   }
 
   public focusAboveSuggestions(): void {
-    if (this._forceResolveButton) {
+    if (this._forceResolveButton.value) {
       this.setState({ selectedActionType: SuggestionActionType.forceResolve });
-    } else if (this._searchForMoreButton) {
+    } else if (this._searchForMoreButton.value) {
       this.setState({ selectedActionType: SuggestionActionType.searchMore });
     }
   }
 
   public focusBelowSuggestions(): void {
-    if (this._searchForMoreButton) {
+    if (this._searchForMoreButton.value) {
       this.setState({ selectedActionType: SuggestionActionType.searchMore });
-    } else if (this._forceResolveButton) {
+    } else if (this._forceResolveButton.value) {
       this.setState({ selectedActionType: SuggestionActionType.forceResolve });
     }
   }
 
   public focusSearchForMoreButton() {
-    if (this._searchForMoreButton) {
-      this._searchForMoreButton.focus();
+    if (this._searchForMoreButton.value) {
+      this._searchForMoreButton.value.focus();
     }
   }
 
   // TODO get the element to scroll into view properly regardless of direction.
   public scrollSelected() {
-    if (this._selectedElement && this._selectedElement.scrollIntoView !== undefined) {
-      this._selectedElement.scrollIntoView(false);
+    if (this._selectedElement.value && this._selectedElement.value.scrollIntoView !== undefined) {
+      this._selectedElement.value.scrollIntoView(false);
     }
   }
 
@@ -330,7 +331,7 @@ export class Suggestions<T> extends BaseComponent<ISuggestionsProps<T>, ISuggest
       >
         { suggestions.map((suggestion, index) =>
           <div
-            ref={ this._resolveRef(suggestion.selected ? '_selectedElement' : '') }
+            ref={ this._selectedElement }
             // tslint:disable-next-line:no-string-literal
             key={ (suggestion.item as any)['key'] ? (suggestion.item as any)['key'] : index }
             id={ 'sug-' + index }
diff --git a/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx b/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx
index 146431253953f..f7c2137e4a12c 100644
--- a/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/decorators/withViewport.tsx
@@ -2,7 +2,8 @@ import * as React from 'react';
 import { BaseDecorator } from './BaseDecorator';
 import {
   findScrollableParent,
-  getRect
+  getRect,
+  createRef
 } from '../../Utilities';
 
 export interface IViewport {
@@ -24,7 +25,7 @@ const MAX_RESIZE_ATTEMPTS = 3;
 export function withViewport<TProps extends { viewport?: IViewport }, TState>(ComposedComponent: (new (props: TProps, ...args: any[]) => React.Component<TProps, TState>)): any {
 
   return class WithViewportComponent extends BaseDecorator<TProps, IWithViewportState> {
-    private _root: HTMLDivElement;
+    private _root = createRef<HTMLDivElement>();
     private _resizeAttempts: number;
 
     constructor(props: TProps) {
@@ -68,7 +69,7 @@ export function withViewport<TProps extends { viewport?: IViewport }, TState>(Co
       const isViewportVisible = skipViewportMeasures || (viewport!.width > 0 && viewport!.height > 0);
 
       return (
-        <div className='ms-Viewport' ref={ this._resolveRef('_root') } style={ { minWidth: 1, minHeight: 1 } }>
+        <div className='ms-Viewport' ref={ this._root } style={ { minWidth: 1, minHeight: 1 } }>
           { isViewportVisible && (
             <ComposedComponent ref={ this._updateComposedComponentRef } viewport={ viewport } { ...this.props as any } />
           ) }
@@ -87,7 +88,7 @@ export function withViewport<TProps extends { viewport?: IViewport }, TState>(Co
     /* Note: using lambda here because decorators don't seem to work in decorators. */
     private _updateViewport = (withForceUpdate?: boolean) => {
       const { viewport } = this.state;
-      const viewportElement = this._root;
+      const viewportElement = this._root.value;
       const scrollElement = findScrollableParent(viewportElement);
       const scrollRect = getRect(scrollElement);
       const clientRect = getRect(viewportElement);
diff --git a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
index 19205f859dea9..6108ee2016be8 100644
--- a/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
+++ b/packages/office-ui-fabric-react/src/utilities/selection/SelectionZone.tsx
@@ -7,7 +7,8 @@ import {
   getParent,
   getDocument,
   getWindow,
-  isElementTabbable
+  isElementTabbable,
+  createRef
 } from '../../Utilities';
 import {
   ISelection,
@@ -57,7 +58,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     selectionMode: SelectionMode.multiple
   };
 
-  private _root: HTMLDivElement;
+  private _root = createRef<HTMLDivElement>();
   private _isCtrlPressed: boolean;
   private _isShiftPressed: boolean;
   private _isMetaPressed: boolean;
@@ -67,8 +68,8 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   private _isTouchTimeoutId: number | undefined;
 
   public componentDidMount() {
-    const win = getWindow(this._root);
-    const scrollElement = findScrollableParent(this._root);
+    const win = getWindow(this._root.value);
+    const scrollElement = findScrollableParent(this._root.value);
 
     // Track the latest modifier keys globally.
     this._events.on(win, 'keydown, keyup', this._updateModifiers, true);
@@ -81,7 +82,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     return (
       <div
         className='ms-SelectionZone'
-        ref={ this._resolveRef('_root') }
+        ref={ this._root }
         onKeyDown={ this._onKeyDown }
         onMouseDown={ this._onMouseDown }
         onKeyDownCapture={ this._onKeyDownCapture }
@@ -116,13 +117,13 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
       return;
     }
 
-    if (!elementContains(ev.target, this._root)) {
+    if (!elementContains(ev.target, this._root.value)) {
       return;
     }
 
     let target = ev.target as HTMLElement;
 
-    while (target !== this._root) {
+    while (target !== this._root.value) {
       if (this._hasAttribute(target, SELECTION_INVOKE_ATTRIBUTE_NAME)) {
         this.ignoreNextFocus();
         break;
@@ -180,7 +181,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
       return;
     }
 
-    while (target !== this._root) {
+    while (target !== this._root.value) {
       if (this._hasAttribute(target, SELECTALL_TOGGLE_ALL_ATTRIBUTE_NAME)) {
         break;
       } else if (itemRoot) {
@@ -213,7 +214,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
       return;
     }
 
-    while (target !== this._root) {
+    while (target !== this._root.value) {
       if (this._hasAttribute(target, SELECTALL_TOGGLE_ALL_ATTRIBUTE_NAME)) {
         this._onToggleAllClick(ev);
         break;
@@ -262,7 +263,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   }
 
   private _isSelectionDisabled(target: HTMLElement): boolean {
-    while (target !== this._root) {
+    while (target !== this._root.value) {
       if (this._hasAttribute(target, SELECTION_DISABLED_ATTRIBUTE_NAME)) {
         return true;
       }
@@ -291,7 +292,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     if (itemRoot && onItemInvoked && selectionMode !== SelectionMode.none && !this._isInputElement(target)) {
       const index = this._getItemIndex(itemRoot);
 
-      while (target !== this._root) {
+      while (target !== this._root.value) {
         if (
           this._hasAttribute(target, SELECTION_TOGGLE_ATTRIBUTE_NAME) ||
           this._hasAttribute(target, SELECTION_INVOKE_ATTRIBUTE_NAME)) {
@@ -357,7 +358,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
     if (itemRoot) {
       const index = this._getItemIndex(itemRoot);
 
-      while (target !== this._root) {
+      while (target !== this._root.value) {
         if (this._hasAttribute(target, SELECTION_TOGGLE_ATTRIBUTE_NAME)) {
           // For toggle elements, assuming they are rendered as buttons, they will generate a click event,
           // so we can no-op for any keydowns in this case.
@@ -504,7 +505,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   private _findItemRoot(target: HTMLElement): HTMLElement | undefined {
     const { selection } = this.props;
 
-    while (target !== this._root) {
+    while (target !== this._root.value) {
       const indexValue = target.getAttribute(SELECTION_INDEX_ATTRIBUTE_NAME);
       const index = Number(indexValue);
 
@@ -515,7 +516,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
       target = getParent(target) as HTMLElement;
     }
 
-    if (target === this._root) {
+    if (target === this._root.value) {
       return undefined;
     }
 
@@ -529,7 +530,7 @@ export class SelectionZone extends BaseComponent<ISelectionZoneProps, {}> {
   private _hasAttribute(element: HTMLElement, attributeName: string): boolean {
     let isToggle = false;
 
-    while (!isToggle && element !== this._root) {
+    while (!isToggle && element !== this._root.value) {
       isToggle = element.getAttribute(attributeName) === 'true';
       element = getParent(element) as HTMLElement;
     }
diff --git a/packages/utilities/src/BaseComponent.ts b/packages/utilities/src/BaseComponent.ts
index 0cfa0445e3cd0..6fec71b826bac 100644
--- a/packages/utilities/src/BaseComponent.ts
+++ b/packages/utilities/src/BaseComponent.ts
@@ -153,6 +153,7 @@ export class BaseComponent<P extends IBaseProps = {}, S = {}> extends React.Comp
    * Helper to return a memoized ref resolver function.
    * @param refName - Name of the member to assign the ref to.
    * @returns A function instance keyed from the given refname.
+   * @deprecated Use `createRef` from `@uifabric/utilities`
    */
   protected _resolveRef(refName: string): (ref: React.ReactNode) => React.ReactNode {
     if (!this.__resolves) {
diff --git a/packages/utilities/src/dom.ts b/packages/utilities/src/dom.ts
index b1091c89562e5..253ee641b2347 100644
--- a/packages/utilities/src/dom.ts
+++ b/packages/utilities/src/dom.ts
@@ -151,7 +151,7 @@ export function setSSR(isEnabled: boolean): void {
  *
  * @public
  */
-export function getWindow(rootElement?: Element): Window | undefined {
+export function getWindow(rootElement?: Element | null): Window | undefined {
   if (_isSSR || typeof window === 'undefined') {
     return undefined;
   } else {
@@ -170,7 +170,7 @@ export function getWindow(rootElement?: Element): Window | undefined {
  *
  * @public
  */
-export function getDocument(rootElement?: HTMLElement): Document | undefined {
+export function getDocument(rootElement?: HTMLElement | null): Document | undefined {
   if (_isSSR || typeof document === 'undefined') {
     return undefined;
   } else {
diff --git a/packages/utilities/src/scroll.ts b/packages/utilities/src/scroll.ts
index 81312d8e97477..1a36047b3d4b9 100644
--- a/packages/utilities/src/scroll.ts
+++ b/packages/utilities/src/scroll.ts
@@ -75,7 +75,7 @@ export function getScrollbarWidth(): number {
  *
  * @public
  */
-export function findScrollableParent(startingElement: HTMLElement): HTMLElement | null {
+export function findScrollableParent(startingElement: HTMLElement | null): HTMLElement | null {
   let el: HTMLElement | null = startingElement;
 
   // First do a quick scan for the scrollable attribute.

From afd92f730395e561b36cb0cef36a28a5b5997968 Mon Sep 17 00:00:00 2001
From: Vitalie Braga <vitaliebraga@gmail.com>
Date: Mon, 19 Mar 2018 21:59:09 -0700
Subject: [PATCH 1607/1641] ShimmerComponent new props (#4254)

* Adds basic skeleton of Shimmer Component to office-ui-fabric-react.

* Register the Shimmer component in the library.

* Adds basic skeleton of Shimmer Component to office-ui-fabric-react.

* Register the Shimmer component in the library.

* Starting to implement mergeStyles to  create examples of component.

* Introduces the svg plus styles a little.

* Adds css background-size to mergeStyles.api and adds basic shimmer animation.

* Splits Shimmer into the main host and shapes inside.

* Adds rectangle shape to shimmer.

* Changes the logic to exposure of the shapes of shimmer only internaly.

* Adds ability to to add different elements to the shimmer line.

* Refactors the naming of some interfaces and forces a more strict type check.

* Moves the function bo get the borderAlignStyles to Shimmer.base.tsx

* Adds wrapper around the shimmer to position it absolute for fadeOut animation.

* Creates two basic examples for shimmer page.

* Sets a list with hovercards to demonstrate Shimmer Application.

* Small changes in the logic of calculating the borders.

* Change log plus remove mergeStyleAPI change for a different PR

* Cleans TSLint errors.

* Cleans unused import.

* Moves the shimmer component to experiments folder.

* Adjusts all imports to make it run in experiments.

* Adds Change log plus cleans the code a little.

* Corrects all typescript linting errors.

* Fixes another tslint error

* Removes unnecessary circle state.

* Small fix for importing.

* Sets up a scrolling list simulating data loading when scrolling using Shimmer while waiting.

* Introduces more props to Shimmer.

* Enables back simulation of asynchronus loading of data for example page.

* Adds shimmer to DetailsList advanced example.

* Fixes some names and styles.

* Moved ShimmerRectangle Interfaces in a different folder.

* Moves ShimmerCircle Interfaces to a different file.

* Reevaluates some of the language for the documentation.

* Changes the ShimmerRectangle name to ShimmerLine for better semantics and avoid  collision with an already existing IRectangle interface.

* Extracts a value to a constant.

* Changes the logic of calculating the maxHeight and extracting height defaults for circle and line into one source.

* Changes the name for isDetailsList prop.

* Renames Shimmer prop from isListMissingItem to isBaseStyle to give it more general sense.

* Cleans up the code a little.

* Styles left margin only for the Shimmer Application Example.

* Change log commit.
---
 ...ibr-ShimmerComponent_2018-03-06-18-42.json |  11 ++
 .../v-vibr-Shimmer_2018-03-13-19-06.json      |  11 ++
 .../src/components/Shimmer/Shimmer.base.tsx   |  80 +++++++-----
 .../src/components/Shimmer/Shimmer.styles.ts  |  20 ++-
 .../src/components/Shimmer/Shimmer.types.ts   |  63 ++++++----
 .../ShimmerCircle/ShimmerCircle.base.tsx      |   6 +-
 .../ShimmerCircle/ShimmerCircle.styles.ts     |  54 ++------
 .../Shimmer/ShimmerCircle/ShimmerCircle.tsx   |   7 +-
 .../ShimmerCircle/ShimmerCircle.types.ts      |  47 +++++++
 .../Shimmer/ShimmerLine/ShimmerLine.base.tsx  |  34 ++++++
 .../Shimmer/ShimmerLine/ShimmerLine.styles.ts |  30 +++++
 .../Shimmer/ShimmerLine/ShimmerLine.tsx       |  15 +++
 .../Shimmer/ShimmerLine/ShimmerLine.types.ts  |  66 ++++++++++
 .../src/components/Shimmer/ShimmerPage.tsx    |  13 +-
 .../ShimmerRectangle.base.tsx                 |  32 -----
 .../ShimmerRectangle.styles.ts                |  82 -------------
 .../ShimmerRectangle/ShimmerRectangle.tsx     |  10 --
 .../examples/Shimmer.Application.Example.tsx  | 115 ++++++++++++++++--
 .../examples/Shimmer.Basic.Example.tsx        |  60 ++++-----
 .../Shimmer/examples/Shimmer.Example.scss     |   4 +
 20 files changed, 486 insertions(+), 274 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/v-vibr-ShimmerComponent_2018-03-06-18-42.json
 create mode 100644 common/changes/@uifabric/experiments/v-vibr-Shimmer_2018-03-13-19-06.json
 create mode 100644 packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.types.ts
 create mode 100644 packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.base.tsx
 create mode 100644 packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.styles.ts
 create mode 100644 packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.tsx
 create mode 100644 packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.types.ts
 delete mode 100644 packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.base.tsx
 delete mode 100644 packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.styles.ts
 delete mode 100644 packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.tsx

diff --git a/common/changes/@uifabric/experiments/v-vibr-ShimmerComponent_2018-03-06-18-42.json b/common/changes/@uifabric/experiments/v-vibr-ShimmerComponent_2018-03-06-18-42.json
new file mode 100644
index 0000000000000..463a9790d75ce
--- /dev/null
+++ b/common/changes/@uifabric/experiments/v-vibr-ShimmerComponent_2018-03-06-18-42.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Adds a new Shimmer Component to experiments package.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "v-vibr@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/v-vibr-Shimmer_2018-03-13-19-06.json b/common/changes/@uifabric/experiments/v-vibr-Shimmer_2018-03-13-19-06.json
new file mode 100644
index 0000000000000..54306e0a14cff
--- /dev/null
+++ b/common/changes/@uifabric/experiments/v-vibr-Shimmer_2018-03-13-19-06.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Changes in the props and naming.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "v-vibr@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Shimmer/Shimmer.base.tsx b/packages/experiments/src/components/Shimmer/Shimmer.base.tsx
index 70ce162d2824e..4d7c4b60eea86 100644
--- a/packages/experiments/src/components/Shimmer/Shimmer.base.tsx
+++ b/packages/experiments/src/components/Shimmer/Shimmer.base.tsx
@@ -17,15 +17,19 @@ import {
   DefaultPalette,
   IStyleSet
 } from '../../Styling';
-import { ShimmerRectangle } from './ShimmerRectangle/ShimmerRectangle';
+import { ShimmerLine } from './ShimmerLine/ShimmerLine';
 import { ShimmerCircle } from './ShimmerCircle/ShimmerCircle';
 
+const LINE_DEFAULT_HEIGHT = 16;
+const CIRCLE_DEFAULT_HEIGHT = 24;
+
 const getClassNames = classNamesFunction<IShimmerStyleProps, IShimmerStyles>();
 
 export class ShimmerBase extends BaseComponent<IShimmerProps, {}> {
   public static defaultProps: IShimmerProps = {
     width: 100,
-    isDataLoaded: false
+    isDataLoaded: false,
+    isBaseStyle: false
   };
   private _classNames: {[key in keyof IShimmerStyles]: string};
   constructor(props: IShimmerProps) {
@@ -33,14 +37,17 @@ export class ShimmerBase extends BaseComponent<IShimmerProps, {}> {
   }
 
   public render(): JSX.Element {
-    const { getStyles, width, lineElements, children, isDataLoaded } = this.props;
+    const { getStyles, width, lineElements, children, isDataLoaded, isBaseStyle } = this.props;
     const maxHeight: number | undefined = lineElements ? this._findMaxHeight(lineElements) : undefined;
-    this._classNames = getClassNames(getStyles!, { width, maxHeight, isDataLoaded });
+    this._classNames = getClassNames(getStyles!, { width, maxHeight, isDataLoaded, isBaseStyle });
 
     const elements: JSX.Element[] | JSX.Element = lineElements ?
       lineElements.map((elem: ICircle | ILine | IGap, index: number): JSX.Element => {
         switch (elem.type) {
           case ShimmerElementType.CIRCLE:
+            if (!elem.height) {
+              elem.height = CIRCLE_DEFAULT_HEIGHT;
+            }
             return (
               <ShimmerCircle
                 key={ index }
@@ -49,7 +56,9 @@ export class ShimmerBase extends BaseComponent<IShimmerProps, {}> {
               />
             );
           case ShimmerElementType.GAP:
-            const gapWidth = elem.width ? elem.width + '%' : '1%';
+            const gapWidth = elem.widthInPercentage || elem.widthInPixel ?
+              elem.widthInPercentage ? elem.widthInPercentage + '%' : elem.widthInPixel + 'px'
+              : '5px';
             return (
               <div
                 key={ index }
@@ -61,34 +70,55 @@ export class ShimmerBase extends BaseComponent<IShimmerProps, {}> {
                 } }
               />
             );
-          case ShimmerElementType.RECTANGLE:
+          case ShimmerElementType.LINE:
+            if (!elem.height) {
+              elem.height = LINE_DEFAULT_HEIGHT;
+            }
             return (
-              <ShimmerRectangle
+              <ShimmerLine
                 key={ index }
                 { ...elem }
                 borderAlignStyle={ this._getBorderAlignStyles(maxHeight, elem) }
               />
             );
         }
-      }) :
-      <ShimmerRectangle />;
+      }) : (
+        <ShimmerLine
+          height={ LINE_DEFAULT_HEIGHT }
+        />
+      );
 
     return (
       <div className={ this._classNames.root }>
         <div className={ this._classNames.shimmerWrapper }>
-          { elements }
-        </div>
-        <div className={ this._classNames.dataWrapper }>
-          { !!isDataLoaded ?
-            !!children ? children : null
-            : null }
+          { !!isBaseStyle ? children : elements }
         </div>
+
+        { !!isDataLoaded &&
+          <div className={ this._classNames.dataWrapper }>
+            { !!children ? children : null }
+          </div>
+        }
       </div>
     );
   }
 
   private _findMaxHeight(items: Array<ICircle | IGap | ILine>): number {
-    const maxHeight = items.reduce((acc: number, next: ICircle | IGap | ILine): number => {
+    const itemsDefaulted: Array<ICircle | IGap | ILine> = items.map((item: ICircle | IGap | ILine): ICircle | IGap | ILine => {
+      switch (item.type) {
+        case ShimmerElementType.CIRCLE:
+          if (!item.height) {
+            item.height = CIRCLE_DEFAULT_HEIGHT;
+          }
+        case ShimmerElementType.LINE:
+          if (!item.height) {
+            item.height = LINE_DEFAULT_HEIGHT;
+          }
+      }
+      return item;
+    });
+
+    const maxHeight = itemsDefaulted.reduce((acc: number, next: ICircle | IGap | ILine): number => {
       return next.height ?
         next.height > acc ? next.height : acc
         : acc;
@@ -97,19 +127,11 @@ export class ShimmerBase extends BaseComponent<IShimmerProps, {}> {
   }
 
   private _getBorderAlignStyles(maxHeight: number | undefined, elem: ICircle | IGap | ILine): IStyleSet | undefined {
-    let height: number | undefined;
-    switch (elem.type) {
-      case ShimmerElementType.RECTANGLE:
-        height = !!elem.height ? elem.height : 16;
-        break;
-      case ShimmerElementType.CIRCLE:
-        height = !!elem.height ? elem.height : 24;
-        break;
-    }
-    console.log(height);
-    const dif: number | undefined = maxHeight && height ?
-      maxHeight - height > 0 ?
-        maxHeight - height : undefined
+    const elemHeight: number | undefined = elem.height;
+
+    const dif: number | undefined = maxHeight && elemHeight ?
+      maxHeight - elemHeight > 0 ?
+        maxHeight - elemHeight : undefined
       : undefined;
 
     let borderStyle: IStyleSet | undefined;
diff --git a/packages/experiments/src/components/Shimmer/Shimmer.styles.ts b/packages/experiments/src/components/Shimmer/Shimmer.styles.ts
index ef1f852e36b7a..78dd50cdf8fd2 100644
--- a/packages/experiments/src/components/Shimmer/Shimmer.styles.ts
+++ b/packages/experiments/src/components/Shimmer/Shimmer.styles.ts
@@ -8,15 +8,18 @@ export function getStyles(props: IShimmerStyleProps): IShimmerStyles {
   const {
     width,
     maxHeight,
-    isDataLoaded
+    isDataLoaded,
+    isBaseStyle
   } = props;
 
+  const BACKGROUND_OFF_SCREEN_POSITION = '1000%';
+
   const shimmerAnimation: string = keyframes({
     '0%': {
-      backgroundPosition: '-900%'
+      backgroundPosition: `-${BACKGROUND_OFF_SCREEN_POSITION}`
     },
     '100%': {
-      backgroundPosition: '1000%'
+      backgroundPosition: BACKGROUND_OFF_SCREEN_POSITION
     }
   });
 
@@ -26,8 +29,15 @@ export function getStyles(props: IShimmerStyleProps): IShimmerStyles {
       {
         position: 'relative',
         margin: '10px',
+        width: 'auto',
         boxSizing: 'content-box',
         minHeight: maxHeight ? `${maxHeight}px` : '16px'
+      },
+      isBaseStyle && {
+        margin: '0',
+        minHeight: 'inherit',
+        display: 'flex',
+        alignItems: 'center'
       }
     ],
     shimmerWrapper: [
@@ -60,6 +70,10 @@ export function getStyles(props: IShimmerStyleProps): IShimmerStyles {
       isDataLoaded && {
         opacity: '0',
         visibility: 'hidden'
+      },
+      isBaseStyle && {
+        position: 'static',
+        width: 'auto'
       }
     ],
     dataWrapper: [
diff --git a/packages/experiments/src/components/Shimmer/Shimmer.types.ts b/packages/experiments/src/components/Shimmer/Shimmer.types.ts
index e5fe6b32ca4b9..2a221f9ff398f 100644
--- a/packages/experiments/src/components/Shimmer/Shimmer.types.ts
+++ b/packages/experiments/src/components/Shimmer/Shimmer.types.ts
@@ -19,7 +19,7 @@ export interface IShimmerProps extends React.AllHTMLAttributes<HTMLElement> {
   componentRef?: (component: IShimmer) => void;
 
   /**
-   * Sets the width of the shimmer wave container in percentages.
+   * Sets the width of the shimmer wave wrapper in percentages.
    * @default 100%
    */
   width?: number;
@@ -30,6 +30,12 @@ export interface IShimmerProps extends React.AllHTMLAttributes<HTMLElement> {
    */
   isDataLoaded?: boolean;
 
+  /**
+   * Provide when Shimmer is intended to be used when using 'onRenderMissingItem' optional callback of the DetailsList Fabric Component.
+   * @default false
+   */
+  isBaseStyle?: boolean;
+
   /**
    * Elements to render in one line of the Shimmer.
    */
@@ -48,19 +54,25 @@ export interface IShimmerElement {
   type: ShimmerElementType;
 
   /**
-   * The hight of the element (ICircle, ILine, IGap).
+   * The hight of the element in pixels (ICircle, ILine).
    * Read more details for each specific element.
    */
   height?: number;
 
   /**
-   * The width of the element (ICircle, ILine, IGap).
+   * The width of the element in pixels (ILine, IGap).
    * Read more details for each specific element.
    */
-  width?: number;
+  widthInPixel?: number;
 
   /**
-   * The vertical alignemt of the element (ICircle, ILine, IGap).
+   * The width of the element in pixels (ILine, IGap).
+   * Read more details for each specific element.
+   */
+  widthInPercentage?: number;
+
+  /**
+   * The vertical alignemt of the element (ICircle, ILine).
    * @default center
    */
   verticalAlign?: ShimmerElementVerticalAlign;
@@ -68,52 +80,49 @@ export interface IShimmerElement {
 
 export interface ILine extends IShimmerElement {
   /**
-   * Sets the height of the rectangle.
-   * The value will represent the height in pixels.
-   * @default 16
+   * Sets the height of the shimmer line in pixels.
+   * @default 16px
    */
   height?: number;
 
   /**
-   * If not provided the line will the take the remaining space to fill the shimmer container.
-   * The value provided will represent the width as '%' relative to the shimmer container.
+   * The value provided will represent the width as '%' relative to the shimmer wrapper.
    */
-  width?: number;
-}
+  widthInPercentage?: number;
 
-export interface ICircle extends IShimmerElement {
   /**
-   * Sets the height of the circle.
-   * The value will represent the height in pixels.
-   * @default 24
+   * Sets the width of the Line to an exact value in pixels.
+   * @default 50px
    */
-  height?: number;
+  widthInPixel?: number;
+}
 
+export interface ICircle extends IShimmerElement {
   /**
-   * Width of the circle element if provided will be ignored.
-   * The value will be set equal to the height of the circle for scale ratio reasons.
+   * Sets the height of the shimmer circle in pixels.
+   * @default 24px
    */
-  width?: number;
+  height?: number;
 }
 
 export interface IGap extends IShimmerElement {
   /**
-   * Height for gap element will be ignored and set equal to the heighest element on the line.
+   * The value will be calculated as '%' relative the to shimmer wrapper.
    */
-  height?: number;
+  widthInPercentage?: number;
 
   /**
-   * Sets the width relative to the shimmer container width for responsiveness reasons.
-   * The value will be calculated as '%' relative the to shimmer container.
-   * @default 1%
+   * Sets the width of the Gap to an exact value in pixels.
+   * @default 5px
    */
-  width?: number;
+  widthInPixel?: number;
 }
 
 export interface IShimmerStyleProps {
   width?: number;
   maxHeight?: number;
   isDataLoaded?: boolean;
+  isBaseStyle?: boolean;
 }
 
 export interface IShimmerStyles {
@@ -123,7 +132,7 @@ export interface IShimmerStyles {
 }
 
 export const enum ShimmerElementType {
-  RECTANGLE = 'line',
+  LINE = 'line',
   CIRCLE = 'circle',
   GAP = 'gap'
 }
diff --git a/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.base.tsx b/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.base.tsx
index b5c88d108ca59..3c045acd15f1b 100644
--- a/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.base.tsx
+++ b/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.base.tsx
@@ -7,15 +7,13 @@ import {
   IShimmerCircleProps,
   IShimmerCircleStyleProps,
   IShimmerCircleStyles
-} from './ShimmerCircle.styles';
+} from './ShimmerCircle.types';
 
 const getClassNames = classNamesFunction<IShimmerCircleStyleProps, IShimmerCircleStyles>();
 
 export class ShimmerCircleBase extends BaseComponent<IShimmerCircleProps, {}> {
-  public static defaultProps: IShimmerCircleProps = {
-    height: 24
-  };
   private _classNames: {[key in keyof IShimmerCircleStyles]: string};
+
   constructor(props: IShimmerCircleProps) {
     super(props);
   }
diff --git a/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.styles.ts b/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.styles.ts
index f3947ce7061e9..9f8677cd3a8c8 100644
--- a/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.styles.ts
+++ b/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.styles.ts
@@ -1,51 +1,11 @@
-import * as React from 'react';
 import {
-  IStyle,
-  DefaultPalette,
-  IStyleSet
-} from '../../../Styling';
-import { IStyleFunction } from '../../../Utilities';
-
-export interface IShimmerCircle {
-
-}
-
-/**
- * ShimmerCircle component props.
- */
-export interface IShimmerCircleProps extends React.AllHTMLAttributes<HTMLElement> {
-  /**
-   * Optional callback to access the IShimmerCircle interface. Use this instead of ref for accessing
-   * the public methods and properties of the component.
-   */
-  componentRef?: (component: IShimmerCircle) => void;
-
-  /**
-   * Sets the height of the circle.
-   * @default 24px
-   */
-  height?: number;
-
-  /**
-   * Used to
-   */
-  borderAlignStyle?: IStyleSet;
-
-  /**
-   * Call to provide customized styling that will layer on top of the variant rules.
-   */
-  getStyles?: IStyleFunction<IShimmerCircleStyleProps, IShimmerCircleStyles>;
-}
-
-export interface IShimmerCircleStyleProps {
-  height?: number;
-  borderAlignStyle?: IStyleSet;
-}
-
-export interface IShimmerCircleStyles {
-  root?: IStyle;
-  svg?: IStyle;
-}
+  IShimmerCircleStyleProps,
+  IShimmerCircleStyles
+} from './ShimmerCircle.types';
+import {
+  IStyleSet,
+  DefaultPalette
+} from 'office-ui-fabric-react';
 
 export function getStyles(props: IShimmerCircleStyleProps): IShimmerCircleStyles {
   const {
diff --git a/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.tsx b/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.tsx
index 594bb1b89f052..63b114832079d 100644
--- a/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.tsx
+++ b/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.tsx
@@ -1,7 +1,12 @@
 import {
   styled
 } from '../../../Utilities';
-import { getStyles, IShimmerCircleProps, IShimmerCircleStyleProps, IShimmerCircleStyles } from './ShimmerCircle.styles';
+import { getStyles } from './ShimmerCircle.styles';
+import {
+  IShimmerCircleProps,
+  IShimmerCircleStyleProps,
+  IShimmerCircleStyles
+} from './ShimmerCircle.types';
 import { ShimmerCircleBase } from './ShimmerCircle.base';
 
 export const ShimmerCircle = styled<IShimmerCircleProps, IShimmerCircleStyleProps, IShimmerCircleStyles>(
diff --git a/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.types.ts b/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.types.ts
new file mode 100644
index 0000000000000..4f5511464fd16
--- /dev/null
+++ b/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.types.ts
@@ -0,0 +1,47 @@
+import * as React from 'react';
+import {
+  IStyle,
+  IStyleSet
+} from '../../../Styling';
+import { IStyleFunction } from '../../../Utilities';
+
+export interface IShimmerCircle {
+
+}
+
+/**
+ * ShimmerCircle component props.
+ */
+export interface IShimmerCircleProps extends React.AllHTMLAttributes<HTMLElement> {
+  /**
+   * Optional callback to access the IShimmerCircle interface. Use this instead of ref for accessing
+   * the public methods and properties of the component.
+   */
+  componentRef?: (component: IShimmerCircle) => void;
+
+  /**
+   * Sets the height of the circle.
+   * @default 24px
+   */
+  height?: number;
+
+  /**
+   * Used to
+   */
+  borderAlignStyle?: IStyleSet;
+
+  /**
+   * Call to provide customized styling that will layer on top of the variant rules.
+   */
+  getStyles?: IStyleFunction<IShimmerCircleStyleProps, IShimmerCircleStyles>;
+}
+
+export interface IShimmerCircleStyleProps {
+  height?: number;
+  borderAlignStyle?: IStyleSet;
+}
+
+export interface IShimmerCircleStyles {
+  root?: IStyle;
+  svg?: IStyle;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.base.tsx b/packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.base.tsx
new file mode 100644
index 0000000000000..2f708b8fac860
--- /dev/null
+++ b/packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.base.tsx
@@ -0,0 +1,34 @@
+import * as React from 'react';
+import {
+  BaseComponent,
+  classNamesFunction,
+} from '../../../Utilities';
+import {
+  IShimmerLineProps,
+  IShimmerLineStyleProps,
+  IShimmerLineStyles
+} from './ShimmerLine.types';
+import { ShimmerElementVerticalAlign } from 'experiments/lib/Shimmer';
+
+const getClassNames = classNamesFunction<IShimmerLineStyleProps, IShimmerLineStyles>();
+
+export class ShimmerLineBase extends BaseComponent<IShimmerLineProps, {}> {
+  public static defaultProps: IShimmerLineProps = {
+    verticalAlign: ShimmerElementVerticalAlign.CENTER,
+  };
+  private _classNames: {[key in keyof IShimmerLineStyles]: string};
+
+  constructor(props: IShimmerLineProps) {
+    super(props);
+  }
+
+  public render(): JSX.Element {
+    const { height, getStyles, widthInPercentage, widthInPixel, borderAlignStyle } = this.props;
+
+    this._classNames = getClassNames(getStyles!, { height, widthInPixel, widthInPercentage, borderAlignStyle });
+
+    return (
+      <div className={ this._classNames.root } />
+    );
+  }
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.styles.ts b/packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.styles.ts
new file mode 100644
index 0000000000000..b5bcb4095e0de
--- /dev/null
+++ b/packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.styles.ts
@@ -0,0 +1,30 @@
+import {
+  IShimmerLineStyleProps,
+  IShimmerLineStyles
+} from './ShimmerLine.types';
+import { IStyleSet } from 'office-ui-fabric-react';
+
+export function getStyles(props: IShimmerLineStyleProps): IShimmerLineStyles {
+  const {
+    height,
+    widthInPercentage,
+    widthInPixel,
+    borderAlignStyle
+  } = props;
+
+  const styles: IStyleSet = !!borderAlignStyle ? borderAlignStyle : {};
+  const ACTUAL_WIDTH = widthInPercentage ? widthInPercentage + '%' : widthInPixel ? widthInPixel + 'px' : '100%';
+
+  return {
+    root: [
+      'ms-ShimmerLine-line',
+      {
+        color: 'transparent',
+        width: ACTUAL_WIDTH,
+        height: `${height}px`,
+        boxSizing: 'content-box',
+      },
+      styles
+    ]
+  };
+}
diff --git a/packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.tsx b/packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.tsx
new file mode 100644
index 0000000000000..af52b5638fb8f
--- /dev/null
+++ b/packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.tsx
@@ -0,0 +1,15 @@
+import {
+  styled
+} from '../../../Utilities';
+import {
+  IShimmerLineProps,
+  IShimmerLineStyleProps,
+  IShimmerLineStyles
+} from './ShimmerLine.types';
+import { ShimmerLineBase } from './ShimmerLine.base';
+import { getStyles } from './ShimmerLine.styles';
+
+export const ShimmerLine = styled<IShimmerLineProps, IShimmerLineStyleProps, IShimmerLineStyles>(
+  ShimmerLineBase,
+  getStyles
+);
diff --git a/packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.types.ts b/packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.types.ts
new file mode 100644
index 0000000000000..976743a51c757
--- /dev/null
+++ b/packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.types.ts
@@ -0,0 +1,66 @@
+import * as React from 'react';
+import {
+  IStyle,
+  IStyleSet
+} from '../../../Styling';
+import { IStyleFunction } from '../../../Utilities';
+
+export interface IShimmerLine {
+
+}
+
+/**
+ * ShimmerLine component props.
+ */
+export interface IShimmerLineProps extends React.AllHTMLAttributes<HTMLElement> {
+  /**
+   * Optional callback to access the IShimmerLine interface. Use this instead of ref for accessing
+   * the public methods and properties of the component.
+   */
+  componentRef?: (component: IShimmerLine) => void;
+
+  /**
+   * Sets the height of the rectangle.
+   * @default 16px
+   */
+  height?: number;
+
+  /**
+   * Sets width of the element in percentages.
+   * @default 100%
+   */
+  widthInPercentage?: number;
+
+  /**
+   * Sets width of the element in pixels.
+   * @default 50px
+   */
+  widthInPixel?: number;
+
+  /**
+   * @default center
+   */
+  verticalAlign?: string;
+
+  /**
+   * Sets custom styling of the rectangle.
+   */
+  borderAlignStyle?: IStyleSet;
+
+  /**
+   * Call to provide customized styling that will layer on top of the variant rules.
+   */
+  getStyles?: IStyleFunction<IShimmerLineStyleProps, IShimmerLineStyles>;
+}
+
+export interface IShimmerLineStyleProps {
+  height?: number;
+  verticalAlign?: string;
+  widthInPercentage?: number;
+  widthInPixel?: number;
+  borderAlignStyle?: IStyleSet;
+}
+
+export interface IShimmerLineStyles {
+  root?: IStyle;
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Shimmer/ShimmerPage.tsx b/packages/experiments/src/components/Shimmer/ShimmerPage.tsx
index db429abc2c0f4..71ee42a8c6cc6 100644
--- a/packages/experiments/src/components/Shimmer/ShimmerPage.tsx
+++ b/packages/experiments/src/components/Shimmer/ShimmerPage.tsx
@@ -7,10 +7,13 @@ import {
 } from '@uifabric/example-app-base';
 import { ShimmerBasicExample } from './examples/Shimmer.Basic.Example';
 import { ShimmerLoadDataExample } from './examples/Shimmer.LoadData.Example';
+import { ShimmerApplicationExample } from 'experiments/lib/components/Shimmer/examples/Shimmer.Application.Example';
 
 const ShimmerBasicExampleCode = require('!raw-loader!experiments/src/components/Shimmer/examples/Shimmer.Basic.Example.tsx') as string;
 // tslint:disable-next-line:max-line-length
 const ShimmerLoadDataExampleCode = require('!raw-loader!experiments/src/components/Shimmer/examples/Shimmer.LoadData.Example.tsx') as string;
+// tslint:disable-next-line:max-line-length
+const ShimmerApplicationExampleCode = require('!raw-loader!experiments/src/components/Shimmer/examples/Shimmer.Application.Example.tsx') as string;
 
 export class ShimmerPage extends React.Component<IComponentDemoPageProps, {}> {
   public render(): JSX.Element {
@@ -32,6 +35,12 @@ export class ShimmerPage extends React.Component<IComponentDemoPageProps, {}> {
             >
               <ShimmerLoadDataExample />
             </ExampleCard>
+            <ExampleCard
+              title='Details List with 1000 items loading in async way.'
+              code={ ShimmerApplicationExampleCode }
+            >
+              <ShimmerApplicationExample />
+            </ExampleCard>
           </div>
         }
         propertiesTables={
@@ -55,7 +64,7 @@ export class ShimmerPage extends React.Component<IComponentDemoPageProps, {}> {
           <div>
             <ul>
               <li>
-                When construncting a shimmer line using different elements like Circle, Rectangle or Gap, best if providing widths for each
+                When construncting a shimmer line using different elements like Circle, Line or Gap, best if providing widths for each
                 of them to experience a better layout looking as close as possible to real data it is replacing.
               </li>
               <li>
@@ -69,7 +78,7 @@ export class ShimmerPage extends React.Component<IComponentDemoPageProps, {}> {
           <div>
             <ul>
               <li>
-                Thinking... )
+                Do not try using on the same element both types of widths. It will always default to just one of them.
               </li>
             </ul>
           </div>
diff --git a/packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.base.tsx b/packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.base.tsx
deleted file mode 100644
index 961f6674860d0..0000000000000
--- a/packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.base.tsx
+++ /dev/null
@@ -1,32 +0,0 @@
-import * as React from 'react';
-import {
-  BaseComponent,
-  classNamesFunction,
-} from '../../../Utilities';
-import { IShimmerRectangleProps, IShimmerRectangleStyleProps, IShimmerRectangleStyles } from './ShimmerRectangle.styles';
-import { ShimmerElementVerticalAlign } from 'experiments/lib/Shimmer';
-
-const getClassNames = classNamesFunction<IShimmerRectangleStyleProps, IShimmerRectangleStyles>();
-
-export class ShimmerRectangleBase extends BaseComponent<IShimmerRectangleProps, {}> {
-  public static defaultProps: IShimmerRectangleProps = {
-    height: 16,
-    verticalAlign: ShimmerElementVerticalAlign.CENTER,
-    width: 100
-  };
-  private _classNames: {[key in keyof IShimmerRectangleStyles]: string};
-
-  constructor(props: IShimmerRectangleProps) {
-    super(props);
-  }
-
-  public render(): JSX.Element {
-    const { height, getStyles, width, borderAlignStyle } = this.props;
-
-    this._classNames = getClassNames(getStyles!, { height, width, borderAlignStyle });
-
-    return (
-      <div className={ this._classNames.root } />
-    );
-  }
-}
\ No newline at end of file
diff --git a/packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.styles.ts b/packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.styles.ts
deleted file mode 100644
index 19c7059c1e1d9..0000000000000
--- a/packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.styles.ts
+++ /dev/null
@@ -1,82 +0,0 @@
-import * as React from 'react';
-import {
-  IStyle,
-  IStyleSet
-} from '../../../Styling';
-import { IStyleFunction } from '../../../Utilities';
-
-export interface IShimmerRectangle {
-
-}
-
-/**
- * ShimmerRectangle component props.
- */
-export interface IShimmerRectangleProps extends React.AllHTMLAttributes<HTMLElement> {
-  /**
-   * Optional callback to access the IShimmerRectangle interface. Use this instead of ref for accessing
-   * the public methods and properties of the component.
-   */
-  componentRef?: (component: IShimmerRectangle) => void;
-
-  /**
-   * Sets the height of the rectangle.
-   * @default 16px
-   */
-  height?: number;
-
-  /**
-   * Sets width of the elemnts.
-   * @default 100%
-   */
-  width?: number;
-
-  /**
-   * @default center
-   */
-  verticalAlign?: string;
-
-  /**
-   * Sets custom styling of the rectangle.
-   */
-  borderAlignStyle?: IStyleSet;
-
-  /**
-   * Call to provide customized styling that will layer on top of the variant rules.
-   */
-  getStyles?: IStyleFunction<IShimmerRectangleStyleProps, IShimmerRectangleStyles>;
-}
-
-export interface IShimmerRectangleStyleProps {
-  height?: number;
-  verticalAlign?: string;
-  width?: number;
-  borderAlignStyle?: IStyleSet;
-}
-
-export interface IShimmerRectangleStyles {
-  root?: IStyle;
-}
-
-export function getStyles(props: IShimmerRectangleStyleProps): IShimmerRectangleStyles {
-  const {
-    height,
-    width,
-    borderAlignStyle
-  } = props;
-
-  const styles: IStyleSet = !!borderAlignStyle ? borderAlignStyle : {};
-
-  return {
-    root: [
-      'ms-ShimmerRectangle-line',
-      {
-        color: 'transparent',
-        width: `${width}%`,
-        height: `${height}px`,
-        boxSizing: 'content-box',
-      },
-      styles
-    ]
-  };
-}
diff --git a/packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.tsx b/packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.tsx
deleted file mode 100644
index 50b4947ae84c7..0000000000000
--- a/packages/experiments/src/components/Shimmer/ShimmerRectangle/ShimmerRectangle.tsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import {
-  styled
-} from '../../../Utilities';
-import { getStyles, IShimmerRectangleProps, IShimmerRectangleStyleProps, IShimmerRectangleStyles } from './ShimmerRectangle.styles';
-import { ShimmerRectangleBase } from './ShimmerRectangle.base';
-
-export const ShimmerRectangle = styled<IShimmerRectangleProps, IShimmerRectangleStyleProps, IShimmerRectangleStyles>(
-  ShimmerRectangleBase,
-  getStyles
-);
diff --git a/packages/experiments/src/components/Shimmer/examples/Shimmer.Application.Example.tsx b/packages/experiments/src/components/Shimmer/examples/Shimmer.Application.Example.tsx
index 6eddf4414c785..a92bc7e53d414 100644
--- a/packages/experiments/src/components/Shimmer/examples/Shimmer.Application.Example.tsx
+++ b/packages/experiments/src/components/Shimmer/examples/Shimmer.Application.Example.tsx
@@ -6,10 +6,17 @@ import {
   HoverCard,
   IExpandingCardProps
 } from 'office-ui-fabric-react/lib/HoverCard';
-import { DetailsList, buildColumns, IColumn } from 'office-ui-fabric-react/lib/DetailsList';
 import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { createListItems } from '@uifabric/example-app-base';
 import './Shimmer.Example.scss';
+import {
+  Shimmer,
+} from 'experiments/lib/Shimmer';
+import { IColumn, DetailsList, buildColumns } from 'office-ui-fabric-react';
+
+const PAGING_DELAY = 3000;
+const ITEMS_COUNT = 1000;
+const PAGING_SIZE = 10;
 
 export interface IItem {
   [index: string]: string | number;
@@ -24,7 +31,38 @@ export interface IItem {
   height: number;
 }
 
-let _items: IItem[];
+export interface IShimmerElem {
+  [index: string]: HTMLElement;
+}
+
+// tslint:disable-next-line:no-any
+let _items: any[];
+
+const fileIcons: { name: string; }[] = [
+  { 'name': 'accdb' },
+  { 'name': 'csv' },
+  { 'name': 'docx' },
+  { 'name': 'dotx' },
+  { 'name': 'mpp' },
+  { 'name': 'mpt' },
+  { 'name': 'odp' },
+  { 'name': 'ods' },
+  { 'name': 'odt' },
+  { 'name': 'one' },
+  { 'name': 'onepkg' },
+  { 'name': 'onetoc' },
+  { 'name': 'potx' },
+  { 'name': 'ppsx' },
+  { 'name': 'pptx' },
+  { 'name': 'pub' },
+  { 'name': 'vsdx' },
+  { 'name': 'vssx' },
+  { 'name': 'vstx' },
+  { 'name': 'xls' },
+  { 'name': 'xlsx' },
+  { 'name': 'xltx' },
+  { 'name': 'xsn' }
+];
 
 export interface IShimmerApplicationExampleState {
   items?: IItem[];
@@ -32,14 +70,21 @@ export interface IShimmerApplicationExampleState {
 }
 
 export class ShimmerApplicationExample extends BaseComponent<{}, IShimmerApplicationExampleState> {
+  private _isFetchingItems: boolean;
 
   constructor(props: {}) {
     super(props);
 
-    _items = _items || createListItems(10);
+    if (!_items) {
+      _items = createListItems(ITEMS_COUNT);
+      _items.map((item: IItem) => {
+        const randomFileType = this._randomFileIcon();
+        item.thumbnail = randomFileType.url;
+      });
+    }
 
     this.state = {
-      items: _items,
+      items: _items.slice(0, PAGING_SIZE).concat(new Array(ITEMS_COUNT - PAGING_SIZE)),
       columns: _buildColumns()
     };
   }
@@ -48,18 +93,47 @@ export class ShimmerApplicationExample extends BaseComponent<{}, IShimmerApplica
     const { items, columns } = this.state;
 
     return (
-      <div>
+      <div className='shimmerExample-application'>
         <p> Hover over location of a row item to see the card </p>
         <DetailsList
-          setKey='hoverSet'
+          setKey='items'
           items={ items! }
           columns={ columns }
           onRenderItemColumn={ this._onRenderItemColumn }
+          onRenderMissingItem={ this._onRenderMissingItem }
         />
       </div>
     );
   }
 
+  @autobind
+  private _onRenderMissingItem(index: number): JSX.Element {
+    this._onDataMiss(index as number);
+    return (
+      <Shimmer />
+    );
+  }
+
+  private _onDataMiss(index: number): void {
+    index = Math.floor(index / PAGING_SIZE) * PAGING_SIZE;
+
+    if (!this._isFetchingItems) {
+
+      this._isFetchingItems = true;
+
+      setTimeout(() => {
+        this._isFetchingItems = false;
+        // tslint:disable-next-line:no-any
+        const itemsCopy = ([] as any[]).concat(this.state.items);
+        itemsCopy.splice.apply(itemsCopy, [index, PAGING_SIZE].concat(_items.slice(index, index + PAGING_SIZE)));
+
+        this.setState({
+          items: itemsCopy
+        });
+      }, PAGING_DELAY);
+    }
+  }
+
   @autobind
   private _onRenderItemColumn(item: IItem, index: number, column: IColumn): JSX.Element | string | number {
     const expandingCardProps: IExpandingCardProps = {
@@ -78,6 +152,14 @@ export class ShimmerApplicationExample extends BaseComponent<{}, IShimmerApplica
       );
     }
 
+    if (column.key === 'thumbnail') {
+      return (
+        <img
+          src={ item.thumbnail }
+        />
+      );
+    }
+
     return item[column.key];
   }
 
@@ -106,8 +188,27 @@ export class ShimmerApplicationExample extends BaseComponent<{}, IShimmerApplica
       </div>
     );
   }
+
+  private _randomFileIcon(): { docType: string; url: string; } {
+    const docType: string = fileIcons[Math.floor(Math.random() * fileIcons.length) + 0].name;
+    return {
+      docType,
+      url: `https://static2.sharepointonline.com/files/fabric/assets/brand-icons/document/svg/${docType}_16x1.svg`
+    };
+  }
 }
 
 function _buildColumns(): IColumn[] {
-  return buildColumns(_items).filter((column: IColumn) => column.name === 'location' || column.name === 'key');
+  const columns: IColumn[] = buildColumns(_items);
+
+  columns.forEach((column: IColumn) => {
+    if (column.key === 'thumbnail') {
+      column.name = 'FileType';
+      column.minWidth = 16;
+      column.maxWidth = 16;
+      column.isIconOnly = true;
+      column.iconName = 'Page';
+    }
+  });
+  return columns;
 }
\ No newline at end of file
diff --git a/packages/experiments/src/components/Shimmer/examples/Shimmer.Basic.Example.tsx b/packages/experiments/src/components/Shimmer/examples/Shimmer.Basic.Example.tsx
index 72f53f5c1bdd9..2b93b32869906 100644
--- a/packages/experiments/src/components/Shimmer/examples/Shimmer.Basic.Example.tsx
+++ b/packages/experiments/src/components/Shimmer/examples/Shimmer.Basic.Example.tsx
@@ -27,53 +27,53 @@ export class ShimmerBasicExample extends React.Component<{}, {}> {
         Custom Shimmer with elements provided.
         <Shimmer
           lineElements={ [
-            { type: ElemType.CIRCLE, height: 24 },
-            { type: ElemType.GAP, width: 2 },
-            { type: ElemType.RECTANGLE, height: 16 },
+            { type: ElemType.CIRCLE },
+            { type: ElemType.GAP, widthInPercentage: 2 },
+            { type: ElemType.LINE },
           ] }
         />
         Notice how the same elements change relative to the shimmer width provided.
         <Shimmer
           lineElements={ [
             { type: ElemType.CIRCLE, height: 24 },
-            { type: ElemType.GAP, width: 2 },
-            { type: ElemType.RECTANGLE, height: 16, width: 20 },
-            { type: ElemType.GAP, width: 5 },
-            { type: ElemType.RECTANGLE, height: 16, width: 20 },
-            { type: ElemType.GAP, width: 10 },
-            { type: ElemType.RECTANGLE, height: 16, width: 15 },
-            { type: ElemType.GAP, width: 10 },
-            { type: ElemType.RECTANGLE, height: 16 }
+            { type: ElemType.GAP, widthInPercentage: 2 },
+            { type: ElemType.LINE, height: 16, widthInPercentage: 20 },
+            { type: ElemType.GAP, widthInPercentage: 5 },
+            { type: ElemType.LINE, height: 16, widthInPercentage: 20 },
+            { type: ElemType.GAP, widthInPercentage: 10 },
+            { type: ElemType.LINE, height: 16, widthInPercentage: 15 },
+            { type: ElemType.GAP, widthInPercentage: 10 },
+            { type: ElemType.LINE, height: 16 }
           ] }
         />
         <Shimmer
           width={ 70 }
           lineElements={ [
             { type: ElemType.CIRCLE, height: 24 },
-            { type: ElemType.GAP, width: 2 },
-            { type: ElemType.RECTANGLE, height: 16, width: 20 },
-            { type: ElemType.GAP, width: 5 },
-            { type: ElemType.RECTANGLE, height: 16, width: 20 },
-            { type: ElemType.GAP, width: 10 },
-            { type: ElemType.RECTANGLE, height: 16, width: 15 },
-            { type: ElemType.GAP, width: 10 },
-            { type: ElemType.RECTANGLE, height: 16 }
+            { type: ElemType.GAP, widthInPercentage: 2 },
+            { type: ElemType.LINE, height: 16, widthInPercentage: 20 },
+            { type: ElemType.GAP, widthInPercentage: 5 },
+            { type: ElemType.LINE, height: 16, widthInPercentage: 20 },
+            { type: ElemType.GAP, widthInPercentage: 10 },
+            { type: ElemType.LINE, height: 16, widthInPercentage: 15 },
+            { type: ElemType.GAP, widthInPercentage: 10 },
+            { type: ElemType.LINE, height: 16 }
           ] }
         />
-        Variations of vertical alignment for Circles and Rectangles.
+        Variations of vertical alignment for Circles and Lines.
         <Shimmer
           lineElements={ [
-            { type: ElemType.CIRCLE, height: 24 },
-            { type: ElemType.GAP, width: 2 },
+            { type: ElemType.CIRCLE },
+            { type: ElemType.GAP, widthInPercentage: 2 },
             { type: ElemType.CIRCLE, height: 15, verticalAlign: ElemVerticalAlign.TOP },
-            { type: ElemType.GAP, width: 2 },
-            { type: ElemType.RECTANGLE, verticalAlign: ElemVerticalAlign.BOTTOM, width: 20 },
-            { type: ElemType.GAP, width: 2 },
-            { type: ElemType.RECTANGLE, height: 5, verticalAlign: ElemVerticalAlign.TOP, width: 20 },
-            { type: ElemType.GAP, width: 2 },
-            { type: ElemType.RECTANGLE, height: 16, width: 15 },
-            { type: ElemType.GAP, width: 2 },
-            { type: ElemType.RECTANGLE, height: 10, verticalAlign: ElemVerticalAlign.BOTTOM }
+            { type: ElemType.GAP, widthInPercentage: 2 },
+            { type: ElemType.LINE, verticalAlign: ElemVerticalAlign.BOTTOM, widthInPercentage: 20 },
+            { type: ElemType.GAP, widthInPercentage: 2 },
+            { type: ElemType.LINE, height: 5, verticalAlign: ElemVerticalAlign.TOP, widthInPercentage: 20 },
+            { type: ElemType.GAP, widthInPercentage: 2 },
+            { type: ElemType.LINE, height: 16, widthInPercentage: 15 },
+            { type: ElemType.GAP, widthInPercentage: 2 },
+            { type: ElemType.LINE, height: 10, verticalAlign: ElemVerticalAlign.BOTTOM }
           ] }
         />
       </div>
diff --git a/packages/experiments/src/components/Shimmer/examples/Shimmer.Example.scss b/packages/experiments/src/components/Shimmer/examples/Shimmer.Example.scss
index 501e970ec958c..8238a266957eb 100644
--- a/packages/experiments/src/components/Shimmer/examples/Shimmer.Example.scss
+++ b/packages/experiments/src/components/Shimmer/examples/Shimmer.Example.scss
@@ -14,4 +14,8 @@
     text-decoration: underline;
     cursor: pointer;
   }
+
+  .shimmerExample-application .ms-Shimmer-container{
+    margin-left: 42px;
+  }
 }
\ No newline at end of file

From 1a10afc7c1cd230f9057d0f3b1e332633b4e7e4a Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Tue, 20 Mar 2018 10:27:38 +0000
Subject: [PATCH 1608/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...ibr-ShimmerComponent_2018-03-06-18-42.json | 11 ----
 .../v-vibr-Shimmer_2018-03-13-19-06.json      | 11 ----
 ...-createRef-migration_2018-03-17-07-22.json | 11 ----
 .../Spinner_2018-03-19-21-45.json             | 11 ----
 .../button-openMenu_2018-03-12-20-15.json     | 11 ----
 ...-createRef-migration_2018-03-17-07-22.json | 11 ----
 ...sayali-arrowFocusFix_2018-03-15-21-28.json | 11 ----
 ...sayali-arrowFocusFix_2018-03-16-22-02.json | 11 ----
 ...rs-demarcey-cmIconHC_2018-03-19-19-04.json | 11 ----
 ...oltipCommandBarItems_2018-03-13-21-28.json | 11 ----
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/CHANGELOG.json           | 24 +++++++++
 packages/experiments/CHANGELOG.md             | 10 +++-
 packages/experiments/package.json             |  4 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 51 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 18 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 +++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  2 +-
 26 files changed, 135 insertions(+), 125 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/v-vibr-ShimmerComponent_2018-03-06-18-42.json
 delete mode 100644 common/changes/@uifabric/experiments/v-vibr-Shimmer_2018-03-13-19-06.json
 delete mode 100644 common/changes/@uifabric/utilities/finish-createRef-migration_2018-03-17-07-22.json
 delete mode 100644 common/changes/office-ui-fabric-react/Spinner_2018-03-19-21-45.json
 delete mode 100644 common/changes/office-ui-fabric-react/button-openMenu_2018-03-12-20-15.json
 delete mode 100644 common/changes/office-ui-fabric-react/finish-createRef-migration_2018-03-17-07-22.json
 delete mode 100644 common/changes/office-ui-fabric-react/sayali-arrowFocusFix_2018-03-15-21-28.json
 delete mode 100644 common/changes/office-ui-fabric-react/sayali-arrowFocusFix_2018-03-16-22-02.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-demarcey-cmIconHC_2018-03-19-19-04.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-petdun-addReadonlyStateAndTooltipCommandBarItems_2018-03-13-21-28.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index caabb11597760..d3fca2ae407f3 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.65.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.66.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 8e7c88f964d52..fdeb9e41c0732 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.65.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.66.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index d7b8ad475f673..f9b47759049c9 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.65.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.66.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 50b7b9d6d541d..b6f715ecddf43 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.65.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.66.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index 65015cd1b64db..dc44753b94ac3 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.65.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.66.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/common/changes/@uifabric/experiments/v-vibr-ShimmerComponent_2018-03-06-18-42.json b/common/changes/@uifabric/experiments/v-vibr-ShimmerComponent_2018-03-06-18-42.json
deleted file mode 100644
index 463a9790d75ce..0000000000000
--- a/common/changes/@uifabric/experiments/v-vibr-ShimmerComponent_2018-03-06-18-42.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Adds a new Shimmer Component to experiments package.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "v-vibr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/v-vibr-Shimmer_2018-03-13-19-06.json b/common/changes/@uifabric/experiments/v-vibr-Shimmer_2018-03-13-19-06.json
deleted file mode 100644
index 54306e0a14cff..0000000000000
--- a/common/changes/@uifabric/experiments/v-vibr-Shimmer_2018-03-13-19-06.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Changes in the props and naming.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "v-vibr@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/finish-createRef-migration_2018-03-17-07-22.json b/common/changes/@uifabric/utilities/finish-createRef-migration_2018-03-17-07-22.json
deleted file mode 100644
index f6218f2035198..0000000000000
--- a/common/changes/@uifabric/utilities/finish-createRef-migration_2018-03-17-07-22.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Make helper functions getWindow and getDocument accept `null`.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "mark@thedutchies.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/Spinner_2018-03-19-21-45.json b/common/changes/office-ui-fabric-react/Spinner_2018-03-19-21-45.json
deleted file mode 100644
index 9a2b005c1a7fa..0000000000000
--- a/common/changes/office-ui-fabric-react/Spinner_2018-03-19-21-45.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Javascript styling for Spinner",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "adrum@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/button-openMenu_2018-03-12-20-15.json b/common/changes/office-ui-fabric-react/button-openMenu_2018-03-12-20-15.json
deleted file mode 100644
index 8e25ab13d4e06..0000000000000
--- a/common/changes/office-ui-fabric-react/button-openMenu_2018-03-12-20-15.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Button: Added public openMenu method and cleaned up open/close functions",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mgodbolt@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/finish-createRef-migration_2018-03-17-07-22.json b/common/changes/office-ui-fabric-react/finish-createRef-migration_2018-03-17-07-22.json
deleted file mode 100644
index 6c18f847eef5e..0000000000000
--- a/common/changes/office-ui-fabric-react/finish-createRef-migration_2018-03-17-07-22.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Updates refs to use createRef object references",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mark@thedutchies.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/sayali-arrowFocusFix_2018-03-15-21-28.json b/common/changes/office-ui-fabric-react/sayali-arrowFocusFix_2018-03-15-21-28.json
deleted file mode 100644
index fb4834655a5ff..0000000000000
--- a/common/changes/office-ui-fabric-react/sayali-arrowFocusFix_2018-03-15-21-28.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add shouldInputLoseFocusOnArrowKey callback for scenario to determine if input should loose focus when arrow key is present when Tabbing is enabled on All elements or Input elements",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "sayalis@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/sayali-arrowFocusFix_2018-03-16-22-02.json b/common/changes/office-ui-fabric-react/sayali-arrowFocusFix_2018-03-16-22-02.json
deleted file mode 100644
index dc4d3300975b9..0000000000000
--- a/common/changes/office-ui-fabric-react/sayali-arrowFocusFix_2018-03-16-22-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "FocusZone: adding `shouldInputLoseFocusOnArrowKey` optional callback for scenarios where user press an arrow key on an input element and want it to loose focus when FocusZone disables moving focus away in case when FocusZoneTabbableElements is set to All or none",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "sayalis@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-demarcey-cmIconHC_2018-03-19-19-04.json b/common/changes/office-ui-fabric-react/users-demarcey-cmIconHC_2018-03-19-19-04.json
deleted file mode 100644
index 09b8d96dc30b7..0000000000000
--- a/common/changes/office-ui-fabric-react/users-demarcey-cmIconHC_2018-03-19-19-04.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fixed bug with HC colors in icons in menus.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "demarcey@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-petdun-addReadonlyStateAndTooltipCommandBarItems_2018-03-13-21-28.json b/common/changes/office-ui-fabric-react/users-petdun-addReadonlyStateAndTooltipCommandBarItems_2018-03-13-21-28.json
deleted file mode 100644
index 07220e45deeee..0000000000000
--- a/common/changes/office-ui-fabric-react/users-petdun-addReadonlyStateAndTooltipCommandBarItems_2018-03-13-21-28.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "CommandBar changed the title attribute to render as tooltip and added readonly state (visitable by keyboard, functionally disabled)",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "peterdunlop2519@gmail.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 716a581356217..4f8b949194903 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.20.0 <6.0.0",
-    "@uifabric/utilities": ">=5.18.3 <6.0.0",
+    "@uifabric/utilities": ">=5.19.0 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index f6b07623ce839..c9e4dd3d020f8 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.26.0",
+      "tag": "@uifabric/experiments_v5.26.0",
+      "date": "Tue, 20 Mar 2018 10:27:37 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Vitalie Braga <vitaliebraga@gmail.com>",
+            "commit": "afd92f730395e561b36cb0cef36a28a5b5997968",
+            "comment": "Changes in the props and naming."
+          },
+          {
+            "author": "Vitalie Braga <vitaliebraga@gmail.com>",
+            "commit": "afd92f730395e561b36cb0cef36a28a5b5997968",
+            "comment": "Adds a new Shimmer Component to experiments package."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.65.0 <6.0.0` to `>=5.66.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.25.1",
       "tag": "@uifabric/experiments_v5.25.1",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 8eebdbeb2c1e8..b8b6db6bdf945 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Mon, 19 Mar 2018 10:27:55 GMT and should not be manually modified.
+This log was last generated on Tue, 20 Mar 2018 10:27:37 GMT and should not be manually modified.
+
+## 5.26.0
+Tue, 20 Mar 2018 10:27:37 GMT
+
+### Minor changes
+
+- Changes in the props and naming.
+- Adds a new Shimmer Component to experiments package.
 
 ## 5.25.1
 Mon, 19 Mar 2018 10:27:55 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 37a7e8d65045b..91a39ea2ddaac 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.25.1",
+  "version": "5.26.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.65.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.66.0 <6.0.0",
     "@uifabric/icons": ">=5.6.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index a5acd8d8e0810..78c1da926c20b 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,57 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.66.0",
+      "tag": "office-ui-fabric-react_v5.66.0",
+      "date": "Tue, 20 Mar 2018 10:27:37 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Micah Godbolt <micahgodbolt@gmail.com>",
+            "commit": "ff76e427cc92a203779d6c227f002ef18fce720a",
+            "comment": "Button: Added public openMenu method and cleaned up open/close functions"
+          },
+          {
+            "author": "Mark Polak <mark@thedutchies.com>",
+            "commit": "856989f01186c078741a64fb3bf7c6371b6439bd",
+            "comment": "Updates refs to use createRef object references"
+          },
+          {
+            "author": "Alicia Drummond <aliciakds88@gmail.com>",
+            "commit": "40bb5ea68260317f46edafd1759a2415658f0302",
+            "comment": "Javascript styling for Spinner"
+          },
+          {
+            "author": "petdun2519 <peterdunlop2519@gmail.com>",
+            "commit": "1d69b5db81dca397760cf22bfc2d73c297bdf666",
+            "comment": "CommandBar changed the title attribute to render as tooltip and added readonly state (visitable by keyboard, functionally disabled)"
+          }
+        ],
+        "patch": [
+          {
+            "author": "SayaliS <sayalis@microsoft.com>",
+            "commit": "da374c8f7e9391968ca7c2aaefe85817018e37af",
+            "comment": "Add shouldInputLoseFocusOnArrowKey callback for scenario to determine if input should loose focus when arrow key is present when Tabbing is enabled on All elements or Input elements"
+          },
+          {
+            "author": "SayaliS <sayalis@microsoft.com>",
+            "commit": "da374c8f7e9391968ca7c2aaefe85817018e37af",
+            "comment": "FocusZone: adding `shouldInputLoseFocusOnArrowKey` optional callback for scenarios where user press an arrow key on an input element and want it to loose focus when FocusZone disables moving focus away in case when FocusZoneTabbableElements is set to All or none"
+          },
+          {
+            "author": "dmarcey <demarcey@microsoft.com>",
+            "commit": "73dc88723ad46cf3bdbd90a05fffb9377e9b6d75",
+            "comment": "Fixed bug with HC colors in icons in menus."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.18.3 <6.0.0` to `>=5.19.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.65.0",
       "tag": "office-ui-fabric-react_v5.65.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 8a0ba9c36f3e7..1cf785f2b6f8d 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,22 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Mon, 19 Mar 2018 10:27:55 GMT and should not be manually modified.
+This log was last generated on Tue, 20 Mar 2018 10:27:37 GMT and should not be manually modified.
+
+## 5.66.0
+Tue, 20 Mar 2018 10:27:37 GMT
+
+### Minor changes
+
+- Button: Added public openMenu method and cleaned up open/close functions
+- Updates refs to use createRef object references
+- Javascript styling for Spinner
+- CommandBar changed the title attribute to render as tooltip and added readonly state (visitable by keyboard, functionally disabled)
+
+### Patches
+
+- Add shouldInputLoseFocusOnArrowKey callback for scenario to determine if input should loose focus when arrow key is present when Tabbing is enabled on All elements or Input elements
+- FocusZone: adding `shouldInputLoseFocusOnArrowKey` optional callback for scenarios where user press an arrow key on an input element and want it to loose focus when FocusZone disables moving focus away in case when FocusZoneTabbableElements is set to All or none
+- Fixed bug with HC colors in icons in menus.
 
 ## 5.65.0
 Mon, 19 Mar 2018 10:27:55 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index e6dd094c22dde..3d5a0f07210be 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.65.0",
+  "version": "5.66.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -51,7 +51,7 @@
     "@uifabric/icons": ">=5.6.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "@uifabric/styling": ">=5.20.0 <6.0.0",
-    "@uifabric/utilities": ">=5.18.3 <6.0.0",
+    "@uifabric/utilities": ">=5.19.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index b3d86ec5b4a22..889504a742634 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -28,7 +28,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.18.3 <6.0.0",
+    "@uifabric/utilities": ">=5.19.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 1ee45e1d887b6..d801e504171f4 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.19.0",
+      "tag": "@uifabric/utilities_v5.19.0",
+      "date": "Tue, 20 Mar 2018 10:27:37 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Mark Polak <mark@thedutchies.com>",
+            "commit": "856989f01186c078741a64fb3bf7c6371b6439bd",
+            "comment": "Make helper functions getWindow and getDocument accept `null`."
+          }
+        ]
+      }
+    },
     {
       "version": "5.18.3",
       "tag": "@uifabric/utilities_v5.18.3",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index fc31bff95f75c..182123c8378b9 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Mon, 19 Mar 2018 10:27:55 GMT and should not be manually modified.
+This log was last generated on Tue, 20 Mar 2018 10:27:37 GMT and should not be manually modified.
+
+## 5.19.0
+Tue, 20 Mar 2018 10:27:37 GMT
+
+### Minor changes
+
+- Make helper functions getWindow and getDocument accept `null`.
 
 ## 5.18.3
 Mon, 19 Mar 2018 10:27:55 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 2b35daccae5d8..ad5737c966f40 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.18.3",
+  "version": "5.19.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 376e93ead5c3695822614770711daa2579dd9246 Mon Sep 17 00:00:00 2001
From: priyank <priyank.bhadja91@gmail.com>
Date: Tue, 20 Mar 2018 21:40:53 +0530
Subject: [PATCH 1609/1641] Fixing accessibility issue: #4295 (#4296)

* Fixing accessibility issue: #4295

Promise based TextField error message is not read by firefox + NVDA

* Addressing PR comment

* Adding change request file
---
 .../patch-1_2018-03-17-10-31.json                     | 11 +++++++++++
 .../src/components/TextField/TextField.tsx            |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/patch-1_2018-03-17-10-31.json

diff --git a/common/changes/office-ui-fabric-react/patch-1_2018-03-17-10-31.json b/common/changes/office-ui-fabric-react/patch-1_2018-03-17-10-31.json
new file mode 100644
index 0000000000000..c597dd62bd5d4
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/patch-1_2018-03-17-10-31.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "TextField: Fixing issue with promise based error message not being announced by firefox + NVDA",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "prbhad@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
index 4b48d7192b0f8..4c31be7c2893b 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.tsx
@@ -194,12 +194,12 @@ export class TextField extends BaseComponent<ITextFieldProps, ITextFieldState> i
           <span id={ this._descriptionId }>
             { description && <span className={ css('ms-TextField-description', styles.description) }>{ description }</span> }
             { errorMessage &&
-              <div>
+              <div aria-live='assertive'>
                 <DelayedRender>
                   <p
                     className={ css('ms-TextField-errorMessage', AnimationClassNames.slideDownIn20, styles.errorMessage) }
                   >
-                    <span aria-live='assertive' className={ styles.errorText } data-automation-id='error-message'>{ errorMessage }</span>
+                    <span className={ styles.errorText } data-automation-id='error-message'>{ errorMessage }</span>
                   </p>
                 </DelayedRender>
               </div>

From 2527a28766718529e7f6ab3d4ead88d6bedd4c05 Mon Sep 17 00:00:00 2001
From: Joshua Rush <jdrush89@gmail.com>
Date: Tue, 20 Mar 2018 15:23:48 -0400
Subject: [PATCH 1610/1641] Changing toggle styles to use flex box (#4313)

* Changing toggle styles to use flex box

* Adding change request file

* Updating toggle snapshot

* Fixing style for disabled and checked toggle

* Adding comment

* Removing comment
---
 ...yling-To-Use-Flexbox_2018-03-19-19-21.json | 11 +++++++++++
 .../components/Toggle/Toggle.classNames.ts    | 19 ++++++++-----------
 .../Toggle/__snapshots__/Toggle.test.tsx.snap | 10 ++++++----
 3 files changed, 25 insertions(+), 15 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/jdrush89-Change-Toggle-Styling-To-Use-Flexbox_2018-03-19-19-21.json

diff --git a/common/changes/office-ui-fabric-react/jdrush89-Change-Toggle-Styling-To-Use-Flexbox_2018-03-19-19-21.json b/common/changes/office-ui-fabric-react/jdrush89-Change-Toggle-Styling-To-Use-Flexbox_2018-03-19-19-21.json
new file mode 100644
index 0000000000000..9f343b9df1645
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/jdrush89-Change-Toggle-Styling-To-Use-Flexbox_2018-03-19-19-21.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Toggle: Updating to use flexbox positioning",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "jdrush89@gmail.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
index 5bc01a79fb4f3..3349b47242544 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.classNames.ts
@@ -79,9 +79,7 @@ export const getClassNames = memoizeFunction((
       getFocusStyle(theme, -3),
       {
         fontSize: '20px',
-        lineHeight: '1em',
         boxSizing: 'border-box',
-        position: 'relative',
         width: '2.2em',
         height: '1em',
         borderRadius: '1em',
@@ -91,6 +89,9 @@ export const getClassNames = memoizeFunction((
         background: pillUncheckedBackground,
         borderColor: pillBorderColor,
         cursor: 'pointer',
+        display: 'flex',
+        alignItems: 'center',
+        padding: '0 .2em'
       },
       styles.pill,
       !disabled && [
@@ -108,7 +109,8 @@ export const getClassNames = memoizeFunction((
         checked && [
           {
             background: pillCheckedBackground,
-            borderColor: 'transparent'
+            borderColor: 'transparent',
+            justifyContent: 'flex-end'
           },
           styles.pillChecked,
           {
@@ -143,7 +145,8 @@ export const getClassNames = memoizeFunction((
         checked && [
           {
             backgroundColor: pillCheckedDisabledBackground,
-            borderColor: 'transparent'
+            borderColor: 'transparent',
+            justifyContent: 'flex-end'
           },
           styles.pillCheckedDisabled
         ],
@@ -156,22 +159,18 @@ export const getClassNames = memoizeFunction((
         width: '.5em',
         height: '.5em',
         borderRadius: '.5em',
-        position: 'absolute',
-        top: '.18em',
         transition: 'all 0.1s ease',
         backgroundColor: thumbBackground,
         /* Border is added to handle high contrast mode for Firefox */
         borderColor: 'transparent',
         borderWidth: '.28em',
         borderStyle: 'solid',
-        boxSizing: 'border-box',
-        left: '.2em'
+        boxSizing: 'border-box'
       },
       styles.thumb,
       !disabled && checked && [
         {
           backgroundColor: thumbCheckedBackground,
-          left: '1.4em',
           selectors: {
             [HighContrastSelector]: {
               backgroundColor: 'Window',
@@ -185,14 +184,12 @@ export const getClassNames = memoizeFunction((
         !checked && [
           {
             backgroundColor: thumbDisabledBackground,
-            left: '.2em',
           },
           styles.thumbDisabled
         ],
         checked && [
           {
             backgroundColor: thumbCheckedDisabledBackground,
-            left: '1.4em'
           },
           styles.thumbCheckedDisabled
         ]
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap b/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap
index f46f8708b1855..9a28d78b4182e 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/Toggle/__snapshots__/Toggle.test.tsx.snap
@@ -48,6 +48,7 @@ exports[`Toggle renders toggle correctly 1`] = `
       className=
           ms-Toggle-background
           {
+            align-items: center;
             background: #ffffff;
             border-color: #666666;
             border-radius: 1em;
@@ -55,10 +56,14 @@ exports[`Toggle renders toggle correctly 1`] = `
             border-width: 1px;
             box-sizing: border-box;
             cursor: pointer;
+            display: flex;
             font-size: 20px;
             height: 1em;
-            line-height: 1em;
             outline: transparent;
+            padding-bottom: 0;
+            padding-left: .2em;
+            padding-right: .2em;
+            padding-top: 0;
             position: relative;
             transition: all 0.1s ease;
             width: 2.2em;
@@ -98,9 +103,6 @@ exports[`Toggle renders toggle correctly 1`] = `
               border-width: .28em;
               box-sizing: border-box;
               height: .5em;
-              left: .2em;
-              position: absolute;
-              top: .18em;
               transition: all 0.1s ease;
               width: .5em;
             }

From d1feb088557c62359dc5f6a55b0b460dc8c63fd1 Mon Sep 17 00:00:00 2001
From: SayaliS <sayalis@microsoft.com>
Date: Tue, 20 Mar 2018 12:39:10 -0700
Subject: [PATCH 1611/1641] Add search hasFocus() public api that returns a
 flag indicating whether the SearchBox has focus or not (#4316)

* Add hasFocus public api to Search box

* Add change log

* Minor

* Fix comment

* Remove the patch change log
---
 ...lis-makeSearchHasFocusPublic_2018-03-19-21-32.json | 11 +++++++++++
 .../src/components/SearchBox/SearchBox.base.tsx       |  7 +++++++
 .../src/components/SearchBox/SearchBox.types.ts       |  5 +++++
 3 files changed, 23 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/sayalis-makeSearchHasFocusPublic_2018-03-19-21-32.json

diff --git a/common/changes/office-ui-fabric-react/sayalis-makeSearchHasFocusPublic_2018-03-19-21-32.json b/common/changes/office-ui-fabric-react/sayalis-makeSearchHasFocusPublic_2018-03-19-21-32.json
new file mode 100644
index 0000000000000..bf64cac2d2b91
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/sayalis-makeSearchHasFocusPublic_2018-03-19-21-32.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add `hasFocus` api in `SearchBox` that returns a flag indicating whether `SearchBox` has focus or not.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "sayalis@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
index c5370db822a19..96fc26fc14935 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.base.tsx
@@ -119,6 +119,13 @@ export class SearchBoxBase extends BaseComponent<ISearchBoxProps, ISearchBoxStat
     }
   }
 
+  /**
+   * Returns whether or not the SearchBox has focus
+   */
+  public hasFocus(): boolean {
+    return !!this.state.hasFocus;
+  }
+
   private _onClear(ev: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement> | React.KeyboardEvent<HTMLElement>) {
     this.props.onClear && this.props.onClear(ev);
     if (!ev.defaultPrevented) {
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
index 3054f77998fad..2aa62dea9593a 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
@@ -8,6 +8,11 @@ export interface ISearchBox {
    * Sets focus inside the search input box.
    */
   focus(): void;
+
+  /**
+   * Returns whether or not the SearchBox has focus
+   */
+  hasFocus(): boolean;
 }
 
 export interface ISearchBoxProps extends React.InputHTMLAttributes<HTMLInputElement> {

From 3bfe9498f8cfa0cccc1129d10bd49744c8a152f5 Mon Sep 17 00:00:00 2001
From: Brian Garland <brian@efelle.com>
Date: Tue, 20 Mar 2018 12:56:23 -0700
Subject: [PATCH 1612/1641] Addressing Issue #4231 - CommandBar Items with href
 should also support OnClick behavior (#4314)

Reordered the logic so an anchor tag can have an onclick function if desired
---
 ...mandbar-onclick-4231_2018-03-19-19-26.json | 11 +++++++
 .../src/components/CommandBar/CommandBar.tsx  | 31 ++++++++++---------
 2 files changed, 27 insertions(+), 15 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/commandbar-onclick-4231_2018-03-19-19-26.json

diff --git a/common/changes/office-ui-fabric-react/commandbar-onclick-4231_2018-03-19-19-26.json b/common/changes/office-ui-fabric-react/commandbar-onclick-4231_2018-03-19-19-26.json
new file mode 100644
index 0000000000000..37cf70127ce8d
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/commandbar-onclick-4231_2018-03-19-19-26.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Reordered the logic in CommandBar that decides to render an anchor or button tag so that the anchor tag can have both an href and onclick attribute.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "v-brgarl@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
index 6a93fbfc340b1..000ff7d787639 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.tsx
@@ -202,18 +202,19 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
     const ariaLabel = item.ariaLabel || (item.iconOnly ? item.name : undefined);
 
     let command: React.ReactNode;
-    if (isLink) {
+    if (item.href) {
+      // Allow the disabled property on anchor elements for commandbar
       command = (
-        <button
-          { ...getNativeProps(item, buttonProperties) }
+        <a
+          { ...getNativeProps(item, anchorProperties.concat(['disabled'])) }
           id={ this._id + item.key }
           className={ className }
+          href={ item.disabled ? undefined : item.href }
+          onClick={ item.onClick }
           title={''}
           aria-disabled={item.inactive}
-          onClick={ this._onItemClick(item) }
           data-command-key={ itemKey }
           aria-haspopup={ hasSubmenu(item) }
-          aria-expanded={ hasSubmenu(item) ? expandedMenuItemKey === item.key : undefined }
           role='menuitem'
           aria-label={ ariaLabel }
           aria-setsize={ setSize }
@@ -227,23 +228,20 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
               { item.name }
             </span>
           ) }
-          { hasSubmenu(item) ? (
-            <Icon className={ css('ms-CommandBarItem-chevronDown', styles.itemChevronDown) } iconName='ChevronDown' />
-          ) : (null) }
-        </button>
+        </a>
       );
-    } else if (item.href) {
-      // Allow the disabled property on anchor elements for commandbar
+    } else if (isLink) {
       command = (
-        <a
-          { ...getNativeProps(item, anchorProperties.concat(['disabled'])) }
+        <button
+          { ...getNativeProps(item, buttonProperties) }
           id={ this._id + item.key }
           className={ className }
+          onClick={ this._onItemClick(item) }
           title={''}
           aria-disabled={item.inactive}
-          href={ item.disabled ? undefined : item.href }
           data-command-key={ itemKey }
           aria-haspopup={ hasSubmenu(item) }
+          aria-expanded={ hasSubmenu(item) ? expandedMenuItemKey === item.key : undefined }
           role='menuitem'
           aria-label={ ariaLabel }
           aria-setsize={ setSize }
@@ -257,7 +255,10 @@ export class CommandBar extends BaseComponent<ICommandBarProps, ICommandBarState
               { item.name }
             </span>
           ) }
-        </a>
+          { hasSubmenu(item) ? (
+            <Icon className={ css('ms-CommandBarItem-chevronDown', styles.itemChevronDown) } iconName='ChevronDown' />
+          ) : (null) }
+        </button>
       );
     } else {
       // Allow the disabled property on div elements for commandbar

From 5fbbac6c535b5db98eaf8167f4ecd8fe2b882990 Mon Sep 17 00:00:00 2001
From: lynamemi <lynam.emily@gmail.com>
Date: Tue, 20 Mar 2018 14:07:18 -0700
Subject: [PATCH 1613/1641] Website: Update OfficeUIFabric Toolkit links to
 v4.0.0 (#4324)

* Updated toolkit links

* Added change file
---
 CONTRIBUTING.md                                       |  8 ++++----
 .../src/pages/ResourcesPage/ResourcesPage.tsx         |  2 +-
 .../update-toolkit_2018-03-20-20-17.json              | 11 +++++++++++
 3 files changed, 16 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/@uifabric/fabric-website/update-toolkit_2018-03-20-20-17.json

diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index f94d307d14381..255d47afb7f6b 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -9,7 +9,7 @@ We have two main buckets for our new and existing components, Experimental and F
 ### Design
 
 #### Does the component already exist?
-Before making the decision to design a new component, check to see if the pattern already exists within any current Microsoft design system including our [Adobe XD Toolkit](https://static2.sharepointonline.com/files/fabric/fabric-website/files/officeuifabric.zip). If you are a Microsoft employee please check the internal version of the [Adobe XD Toolkit (Microsoft Employees)](https://microsoft.sharepoint.com/teams/OfficeUIFabric97) or if you have more in depth questions regarding any Microsoft design system, please visit our internal Microsoft [Teams channel](https://teams.microsoft.com/l/channel/19%3a73a5dbc26c9a4d8d91264611995bbdbb%40thread.skype/Fabric%2520Design?groupId=ffe264f2-14d0-48b5-9384-64f808b81294&tenantId=72f988bf-86f1-41af-91ab-2d7cd011db47).
+Before making the decision to design a new component, check to see if the pattern already exists within any current Microsoft design system including our [Adobe XD Toolkit](https://static2.sharepointonline.com/files/fabric/fabric-website/files/officeuifabric_v4.0.0.zip). If you are a Microsoft employee please check the internal version of the [Adobe XD Toolkit (Microsoft Employees)](https://microsoft.sharepoint.com/teams/OfficeUIFabric97) or if you have more in depth questions regarding any Microsoft design system, please visit our internal Microsoft [Teams channel](https://teams.microsoft.com/l/channel/19%3a73a5dbc26c9a4d8d91264611995bbdbb%40thread.skype/Fabric%2520Design?groupId=ffe264f2-14d0-48b5-9384-64f808b81294&tenantId=72f988bf-86f1-41af-91ab-2d7cd011db47).
 
 #### Is the proposed component a variant of an existing component?
 If the new component pattern you are proposing already exists, but varies slightly, then please consider creating a variant of the existing pattern. For example, if you were to create a new button that does 1 new thing for our exisiting button then we would suggest creating a variant off the original button, but containing the one additional feature.
@@ -21,7 +21,7 @@ If it’s a new component request, does it add value at a broad level or is it a
 If the new component contains Microsoft Intellectual Property, it should be considered Internal and therefore all discussions around the component should __only__ happen internally or within our [Fabric Design Teams channel](https://teams.microsoft.com/l/channel/19%3a73a5dbc26c9a4d8d91264611995bbdbb%40thread.skype/Fabric%2520Design?groupId=ffe264f2-14d0-48b5-9384-64f808b81294&tenantId=72f988bf-86f1-41af-91ab-2d7cd011db47). If the component does not contain Microsoft Intellectual Property then this component can be discussed directly on GitHub in our [issues section](https://github.com/OfficeDev/office-ui-fabric-react/issues).
 
 #### Create
-Create a new component pattern or leverage an existing component and create a variant. Use our [Adobe XD Toolkit](https://static2.sharepointonline.com/files/fabric/fabric-website/files/officeuifabric.zip) as a model for how we document component patterns in Fabric. ​We require that all components have detailed usage guidelines for developers and designers who want to integrate this pattern into their respective product/project. Component should be genericized before submission as much as possible leaving out product specific colors/customizations etc.
+Create a new component pattern or leverage an existing component and create a variant. Use our [Adobe XD Toolkit](https://static2.sharepointonline.com/files/fabric/fabric-website/files/officeuifabric_v4.0.0.zip) as a model for how we document component patterns in Fabric. ​We require that all components have detailed usage guidelines for developers and designers who want to integrate this pattern into their respective product/project. Component should be genericized before submission as much as possible leaving out product specific colors/customizations etc.
 
 #### Review and Socialize​
 Ask for design feedback within the Fabric community through our [Fabric Design Teams channel](https://teams.microsoft.com/l/channel/19%3a73a5dbc26c9a4d8d91264611995bbdbb%40thread.skype/Fabric%2520Design?groupId=ffe264f2-14d0-48b5-9384-64f808b81294&tenantId=72f988bf-86f1-41af-91ab-2d7cd011db47). Or, schedule review with the HVC product team for review.
@@ -38,10 +38,10 @@ If the component has no Microsoft Intellectual Property then it belongs in our p
 ### How we categorize components within the project.
 
 #### Experimental components
-Experimental components are any new components and or do not currently exist within our [Adobe XD Toolkit](https://static2.sharepointonline.com/files/fabric/fabric-website/files/officeuifabric.zip). By Default, our `create-component` script will place the component folder and files in packages/experiments. new components stay in the experimental phase until a Fabric team member approves the migrations from Experimental to Fundamental. Experimental components are developed in the experiments project located in the `<root of project>packages/experiments` folder. We also view any components that were created as a prototype or proof of concept to be an experiment.
+Experimental components are any new components and or do not currently exist within our [Adobe XD Toolkit](https://static2.sharepointonline.com/files/fabric/fabric-website/files/officeuifabric_v4.0.0.zip). By Default, our `create-component` script will place the component folder and files in packages/experiments. new components stay in the experimental phase until a Fabric team member approves the migrations from Experimental to Fundamental. Experimental components are developed in the experiments project located in the `<root of project>packages/experiments` folder. We also view any components that were created as a prototype or proof of concept to be an experiment.
 
 #### Fundamental components
-Fundamental components are the official React representation of our [Adobe XD Toolkit](https://static2.sharepointonline.com/files/fabric/fabric-website/files/officeuifabric.zip) and receive higher priority in respect to stabilization, bug fixes, accessibility, and general design resourcing. Components __cannot__ be immediately added as a Fundamental type component as it will need a period of stabilization and potential API changes. A good portion of the components are currently integrated within some of our major products such as OneDrive and SharePoint. Fundamental components are developed in the office-ui-fabric-react project and within our `<root of project>/packages/office-ui-fabric-react` folder.
+Fundamental components are the official React representation of our [Adobe XD Toolkit](https://static2.sharepointonline.com/files/fabric/fabric-website/files/officeuifabric_v4.0.0.zip) and receive higher priority in respect to stabilization, bug fixes, accessibility, and general design resourcing. Components __cannot__ be immediately added as a Fundamental type component as it will need a period of stabilization and potential API changes. A good portion of the components are currently integrated within some of our major products such as OneDrive and SharePoint. Fundamental components are developed in the office-ui-fabric-react project and within our `<root of project>/packages/office-ui-fabric-react` folder.
 
 ### Getting started coding your component
 
diff --git a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
index 3a3629c0ff2d8..faa5314fbc18f 100644
--- a/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
+++ b/apps/fabric-website/src/pages/ResourcesPage/ResourcesPage.tsx
@@ -44,7 +44,7 @@ export class ResourcesPage extends React.Component<any, any> {
                 <h3>Fabric Design Toolkit</h3>
                 <p>The Fabric design toolkit is built with Adobe XD and provides controls and layout templates that enable you to create seamless, beautiful Office experiences.</p>
                 <ul>
-                  <li><a className={ styles.relatedLink } href='https://static2.sharepointonline.com/files/fabric/fabric-website/files/officeuifabric.zip'>Adobe XD Toolkit</a></li>
+                  <li><a className={ styles.relatedLink } href='https://static2.sharepointonline.com/files/fabric/fabric-website/files/officeuifabric_v4.0.0.zip'>Adobe XD Toolkit</a></li>
                   <li><a className={ styles.relatedLink } href='https://microsoft.sharepoint.com/teams/OfficeUIFabric97'>Adobe XD Toolkit (Microsoft employees)</a></li>
                 </ul>
 
diff --git a/common/changes/@uifabric/fabric-website/update-toolkit_2018-03-20-20-17.json b/common/changes/@uifabric/fabric-website/update-toolkit_2018-03-20-20-17.json
new file mode 100644
index 0000000000000..bd75a3a065486
--- /dev/null
+++ b/common/changes/@uifabric/fabric-website/update-toolkit_2018-03-20-20-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/fabric-website",
+      "comment": "Updated OfficeUIFabric Toolkit link to v4.0.0.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/fabric-website",
+  "email": "lynam.emily@gmail.com"
+}
\ No newline at end of file

From d50399a80ffde20e5981c3c9a0f5e080016b342d Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Tue, 20 Mar 2018 23:00:50 -0700
Subject: [PATCH 1614/1641] DetailsList: headers now resize again. (#4325)

* Fixing a bug introduced by the DetailsHaeder.

* Fix for detailsheader resizing.

* Adding change files.

* Fixing build error.

* Removing unnecessary null.

* Fixing import?
---
 .../detailsheader-fix_2018-03-21-00-31.json   |  11 +
 .../detailsheader-fix_2018-03-21-00-31.json   |  11 +
 .../DetailsList/DetailsHeader.test.tsx        |  89 +++++++
 .../components/DetailsList/DetailsHeader.tsx  |  21 +-
 .../__snapshots__/DetailsHeader.test.tsx.snap | 217 ++++++++++++++++++
 packages/utilities/src/EventGroup.ts          |   5 +-
 6 files changed, 342 insertions(+), 12 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/detailsheader-fix_2018-03-21-00-31.json
 create mode 100644 common/changes/office-ui-fabric-react/detailsheader-fix_2018-03-21-00-31.json
 create mode 100644 packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.test.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/DetailsList/__snapshots__/DetailsHeader.test.tsx.snap

diff --git a/common/changes/@uifabric/utilities/detailsheader-fix_2018-03-21-00-31.json b/common/changes/@uifabric/utilities/detailsheader-fix_2018-03-21-00-31.json
new file mode 100644
index 0000000000000..0549f5c0b1130
--- /dev/null
+++ b/common/changes/@uifabric/utilities/detailsheader-fix_2018-03-21-00-31.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "EventGroup.raise: event args are now correctly mixed into the event object.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/detailsheader-fix_2018-03-21-00-31.json b/common/changes/office-ui-fabric-react/detailsheader-fix_2018-03-21-00-31.json
new file mode 100644
index 0000000000000..076b42db5092a
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/detailsheader-fix_2018-03-21-00-31.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: headers now resize correctly and respect maxWidth.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.test.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.test.tsx
new file mode 100644
index 0000000000000..de79f7f7e6add
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.test.tsx
@@ -0,0 +1,89 @@
+import * as React from 'react';
+import { DetailsHeader } from './DetailsHeader';
+import { DetailsListLayoutMode, IColumn } from './DetailsList.types';
+import { Selection, SelectionMode } from '../../utilities/selection/index';
+import { EventGroup, createRef } from '../../Utilities';
+import { mount } from 'enzyme';
+import * as renderer from 'react-test-renderer';
+
+const _items: {}[] = [];
+const _selection = new Selection();
+const _columns: IColumn[] = [
+  { key: 'a', name: 'a', fieldName: 'a', minWidth: 200, maxWidth: 400, calculatedWidth: 200, isResizable: true },
+  { key: 'b', name: 'b', fieldName: 'a', minWidth: 200, maxWidth: 400, calculatedWidth: 200, isResizable: true }
+];
+
+_selection.setItems(_items);
+
+describe('DetailsHeader', () => {
+
+  it('can render', () => {
+    const component = renderer.create(
+      <DetailsHeader
+        selection={ _selection }
+        selectionMode={ SelectionMode.multiple }
+        layoutMode={ DetailsListLayoutMode.fixedColumns }
+        columns={ _columns }
+      />
+    );
+    expect(component.toJSON()).toMatchSnapshot();
+  });
+
+  it('can resize columns', () => {
+    let lastResize = { size: -1, index: -1 };
+
+    const onColumnResized = (
+      column: IColumn,
+      size: number,
+      index: number
+    ): { size: number; index: number; } => lastResize = { size, index };
+    const headerRef = createRef<any>();
+
+    const columns = [];
+    const wrapper = mount(
+      <DetailsHeader
+        componentRef={ headerRef }
+        selection={ _selection }
+        selectionMode={ SelectionMode.multiple }
+        layoutMode={ DetailsListLayoutMode.fixedColumns }
+        columns={ _columns }
+        onColumnResized={ onColumnResized }
+      />
+    );
+
+    const rootElement = wrapper.getDOMNode();
+    const sizerElement = wrapper.find('[data-sizer-index=0]').getDOMNode();
+    const header: any = headerRef.value;
+
+    // Trigger a mousedown, which validates that the ref to focuszone is hooking up events.
+    EventGroup.raise(
+      sizerElement,
+      'mousedown',
+      {
+        clientX: 0,
+        button: 0
+      },
+      true
+    );
+
+    // Validate we go into resize mode.
+    expect(sizerElement.classList.contains('is-resizing')).toBe(true);
+    expect(!!wrapper.state().isSizing).toBe(false);
+
+    // Mouse move 1 pixel to the right to get into sizing mode.
+    wrapper.simulate('mousemove', { clientX: 1 });
+    expect(!!wrapper.state().isSizing).toBe(true);
+
+    // The header is 200; move mouse 100 to the right, the header should be 300.
+    header._onSizerMouseMove({ clientX: 100 });
+    expect(lastResize).toEqual({ index: 0, size: 300 });
+
+    // Mouse move 300 pixels to the right (should be capped at 400px width
+    header._onSizerMouseMove({ clientX: 300 });
+    expect(lastResize).toEqual({ index: 0, size: 400 });
+
+    // Complete sizing.
+    header._onSizerMouseUp();
+    expect(!!wrapper.state().isSizing).toBe(false);
+  });
+});
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index 66fac2d89edb4..90fc0e3968904 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { findDOMNode } from 'react-dom';
 import {
   BaseComponent,
   css,
@@ -9,7 +10,7 @@ import {
   createRef
 } from '../../Utilities';
 import { IColumn, DetailsListLayoutMode, ColumnActionsMode } from './DetailsList.types';
-import { FocusZone, FocusZoneDirection } from '../../FocusZone';
+import { IFocusZone, FocusZone, FocusZoneDirection } from '../../FocusZone';
 import { Icon } from '../../Icon';
 import { Layer } from '../../Layer';
 import { GroupSpacer } from '../GroupedList/GroupSpacer';
@@ -28,7 +29,7 @@ const INNER_PADDING = 16;
 const ISPADDED_WIDTH = 24;
 
 export interface IDetailsHeader {
-  focus(): boolean;
+  focus: () => boolean;
 }
 
 export interface IDetailsHeaderProps extends React.Props<DetailsHeader> {
@@ -81,7 +82,7 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
     collapseAllVisibility: CollapseAllVisibility.visible
   };
 
-  private _root = createRef<FocusZone>();
+  private _root = createRef<IFocusZone>();
 
   private _id: string;
 
@@ -101,11 +102,8 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
 
   public componentDidMount() {
     const { selection } = this.props;
-    const rootElement = this._root.value;
-
-    if (!rootElement) {
-      return;
-    }
+    const focusZone = this._root.value;
+    const rootElement = findDOMNode(focusZone as any);
 
     this._events.on(selection, SELECTION_CHANGE, this._onSelectionChanged);
 
@@ -516,9 +514,12 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
         movement = -movement;
       }
 
+      const column = columns[columnResizeDetails!.columnIndex];
+      const requestedSize = columnResizeDetails!.columnMinWidth + movement;
+
       onColumnResized(
-        columns[columnResizeDetails!.columnIndex],
-        columnResizeDetails!.columnMinWidth + movement,
+        column,
+        !!column.maxWidth ? Math.min(column.maxWidth, requestedSize) : requestedSize,
         columnResizeDetails!.columnIndex
       );
     }
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/__snapshots__/DetailsHeader.test.tsx.snap b/packages/office-ui-fabric-react/src/components/DetailsList/__snapshots__/DetailsHeader.test.tsx.snap
new file mode 100644
index 0000000000000..311fa3eb38b37
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/__snapshots__/DetailsHeader.test.tsx.snap
@@ -0,0 +1,217 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`DetailsHeader can render 1`] = `
+<div
+  aria-describedby={undefined}
+  aria-label={undefined}
+  aria-labelledby={undefined}
+  className="ms-FocusZone ms-DetailsHeader"
+  data-automationid="DetailsHeader"
+  data-focuszone-id="FocusZone1"
+  onFocus={[Function]}
+  onKeyDown={[Function]}
+  onMouseDownCapture={[Function]}
+  onMouseMove={[Function]}
+  role="row"
+>
+  <div
+    aria-colindex={0}
+    aria-labelledby="header0-check"
+    className="ms-DetailsHeader-cell ms-DetailsHeader-cellIsCheck"
+    onClick={[Function]}
+    role="columnheader"
+  >
+    <span
+      className=""
+    >
+      <div
+        aria-checked={undefined}
+        aria-describedby="header0-checkTooltip"
+        aria-label={undefined}
+        className="ms-DetailsRow-check ms-DetailsRow-check--isHeader undefined"
+        data-automationid="DetailsRowCheck"
+        data-is-focusable={true}
+        data-selection-toggle={true}
+        id="header0-check"
+        role="checkbox"
+      >
+        <div
+          className=
+              ms-Check
+              {
+                height: 18px;
+                line-height: 1;
+                position: relative;
+                user-select: none;
+                vertical-align: top;
+                width: 18px;
+              }
+              &:before {
+                background: #ffffff;
+                border-radius: 50%;
+                bottom: 1px;
+                content: "";
+                left: 1px;
+                opacity: 1;
+                position: absolute;
+                right: 1px;
+                top: 1px;
+              }
+              .checkHost:hover &, .checkHost:focus &, &:hover, &:focus {
+                opacity: 1;
+              }
+        >
+          <i
+            aria-hidden={true}
+            className=
+                ms-Check-circle
+                {
+                  display: inline-block;
+                }
+                {
+                  color: #c8c8c8;
+                  font-size: 18px;
+                  height: 18px;
+                  left: 0px;
+                  position: absolute;
+                  text-align: center;
+                  top: 0px;
+                  vertical-align: middle;
+                  width: 18px;
+                }
+                @media screen and (-ms-high-contrast: active){& {
+                  color: WindowText;
+                }
+            data-icon-name="CircleRing"
+            role="presentation"
+          />
+          <i
+            aria-hidden={true}
+            className=
+                ms-Check-check
+                {
+                  display: inline-block;
+                }
+                {
+                  color: #c8c8c8;
+                  font-size: 16px;
+                  height: 18px;
+                  left: .5px;
+                  opacity: 0;
+                  position: absolute;
+                  text-align: center;
+                  top: 0px;
+                  vertical-align: middle;
+                  width: 18px;
+                }
+                &:hover {
+                  opacity: 1;
+                }
+                @media screen and (-ms-high-contrast: active){& {
+                  -ms-high-contrast-adjust: none;
+                }
+            data-icon-name="StatusCircleCheckmark"
+            role="presentation"
+          />
+        </div>
+      </div>
+    </span>
+  </div>
+  <div
+    aria-colindex={1}
+    aria-disabled={false}
+    aria-sort="none"
+    className="ms-DetailsHeader-cell is-actionable undefined"
+    data-automationid="ColumnsHeaderColumn"
+    data-item-key="a"
+    role="columnheader"
+    style={
+      Object {
+        "width": 216,
+      }
+    }
+  >
+    <span
+      className=""
+    >
+      <span
+        aria-describedby="header0-a-tooltip"
+        aria-haspopup={false}
+        aria-label={undefined}
+        aria-labelledby="header0-a-name "
+        className="ms-DetailsHeader-cellTitle"
+        data-is-focusable={true}
+        id="header0-a"
+        onClick={[Function]}
+        onContextMenu={[Function]}
+        role="button"
+      >
+        <span
+          className="ms-DetailsHeader-cellName"
+          id="header0-a-name"
+        >
+          a
+        </span>
+      </span>
+    </span>
+  </div>
+  <div
+    aria-hidden={true}
+    className="ms-DetailsHeader-cellSizer"
+    data-is-focusable={false}
+    data-sizer-index={0}
+    onBlur={[Function]}
+    onClick={[Function]}
+    onDoubleClick={[Function]}
+    role="button"
+  />
+  <div
+    aria-colindex={2}
+    aria-disabled={false}
+    aria-sort="none"
+    className="ms-DetailsHeader-cell is-actionable undefined"
+    data-automationid="ColumnsHeaderColumn"
+    data-item-key="b"
+    role="columnheader"
+    style={
+      Object {
+        "width": 216,
+      }
+    }
+  >
+    <span
+      className=""
+    >
+      <span
+        aria-describedby="header0-b-tooltip"
+        aria-haspopup={false}
+        aria-label={undefined}
+        aria-labelledby="header0-b-name "
+        className="ms-DetailsHeader-cellTitle"
+        data-is-focusable={true}
+        id="header0-b"
+        onClick={[Function]}
+        onContextMenu={[Function]}
+        role="button"
+      >
+        <span
+          className="ms-DetailsHeader-cellName"
+          id="header0-b-name"
+        >
+          b
+        </span>
+      </span>
+    </span>
+  </div>
+  <div
+    aria-hidden={true}
+    className="ms-DetailsHeader-cellSizer"
+    data-is-focusable={false}
+    data-sizer-index={1}
+    onBlur={[Function]}
+    onClick={[Function]}
+    onDoubleClick={[Function]}
+    role="button"
+  />
+</div>
+`;
diff --git a/packages/utilities/src/EventGroup.ts b/packages/utilities/src/EventGroup.ts
index cb8847aece11a..d86af7d05f260 100644
--- a/packages/utilities/src/EventGroup.ts
+++ b/packages/utilities/src/EventGroup.ts
@@ -85,8 +85,9 @@ export class EventGroup {
         let ev = document.createEvent('HTMLEvents');
 
         ev.initEvent(eventName, bubbleEvent || false, true);
-        // tslint:disable-next-line:no-any
-        (ev as any)['args'] = eventArgs;
+
+        Object.assign(ev, eventArgs);
+
         retVal = target.dispatchEvent(ev);
         // tslint:disable-next-line:no-any
       } else if ((document as any)['createEventObject']) { // IE8

From e7b158ebf6b584435a70593cfff210833292ae91 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Wed, 21 Mar 2018 10:18:30 +0000
Subject: [PATCH 1615/1641] Applying package updates.

---
 apps/fabric-website/CHANGELOG.json            | 19 +++++++++
 apps/fabric-website/CHANGELOG.md              |  9 +++-
 apps/fabric-website/package.json              |  4 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../update-toolkit_2018-03-20-20-17.json      | 11 -----
 .../detailsheader-fix_2018-03-21-00-31.json   | 11 -----
 ...mandbar-onclick-4231_2018-03-19-19-26.json | 11 -----
 .../detailsheader-fix_2018-03-21-00-31.json   | 11 -----
 ...yling-To-Use-Flexbox_2018-03-19-19-21.json | 11 -----
 .../patch-1_2018-03-17-10-31.json             | 11 -----
 ...SearchHasFocusPublic_2018-03-19-21-32.json | 11 -----
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 41 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 16 +++++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 +++++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  2 +-
 23 files changed, 117 insertions(+), 92 deletions(-)
 delete mode 100644 common/changes/@uifabric/fabric-website/update-toolkit_2018-03-20-20-17.json
 delete mode 100644 common/changes/@uifabric/utilities/detailsheader-fix_2018-03-21-00-31.json
 delete mode 100644 common/changes/office-ui-fabric-react/commandbar-onclick-4231_2018-03-19-19-26.json
 delete mode 100644 common/changes/office-ui-fabric-react/detailsheader-fix_2018-03-21-00-31.json
 delete mode 100644 common/changes/office-ui-fabric-react/jdrush89-Change-Toggle-Styling-To-Use-Flexbox_2018-03-19-19-21.json
 delete mode 100644 common/changes/office-ui-fabric-react/patch-1_2018-03-17-10-31.json
 delete mode 100644 common/changes/office-ui-fabric-react/sayalis-makeSearchHasFocusPublic_2018-03-19-21-32.json

diff --git a/apps/fabric-website/CHANGELOG.json b/apps/fabric-website/CHANGELOG.json
index 5a3923c868a56..8f555cf5ef13f 100644
--- a/apps/fabric-website/CHANGELOG.json
+++ b/apps/fabric-website/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/fabric-website",
   "entries": [
+    {
+      "version": "5.5.1",
+      "tag": "@uifabric/fabric-website_v5.5.1",
+      "date": "Wed, 21 Mar 2018 10:18:29 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "lynamemi <lynam.emily@gmail.com>",
+            "commit": "5fbbac6c535b5db98eaf8167f4ecd8fe2b882990",
+            "comment": "Updated OfficeUIFabric Toolkit link to v4.0.0."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.66.0 <6.0.0` to `>=5.67.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.5.0",
       "tag": "@uifabric/fabric-website_v5.5.0",
diff --git a/apps/fabric-website/CHANGELOG.md b/apps/fabric-website/CHANGELOG.md
index b9cb6f046f7e2..c385f0d33db7f 100644
--- a/apps/fabric-website/CHANGELOG.md
+++ b/apps/fabric-website/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/fabric-website
 
-This log was last generated on Mon, 19 Mar 2018 10:27:55 GMT and should not be manually modified.
+This log was last generated on Wed, 21 Mar 2018 10:18:29 GMT and should not be manually modified.
+
+## 5.5.1
+Wed, 21 Mar 2018 10:18:29 GMT
+
+### Patches
+
+- Updated OfficeUIFabric Toolkit link to v4.0.0.
 
 ## 5.5.0
 Mon, 19 Mar 2018 10:27:55 GMT
diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index d3fca2ae407f3..6a05dd86898be 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/fabric-website",
-  "version": "5.5.0",
+  "version": "5.5.1",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.66.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.67.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index fdeb9e41c0732..6e194e11bcf35 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.66.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.67.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index f9b47759049c9..9b0fc80a4735c 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.66.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.67.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index b6f715ecddf43..08a10d7a676f7 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.66.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.67.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index dc44753b94ac3..b3edf8f9408f5 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.66.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.67.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/common/changes/@uifabric/fabric-website/update-toolkit_2018-03-20-20-17.json b/common/changes/@uifabric/fabric-website/update-toolkit_2018-03-20-20-17.json
deleted file mode 100644
index bd75a3a065486..0000000000000
--- a/common/changes/@uifabric/fabric-website/update-toolkit_2018-03-20-20-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/fabric-website",
-      "comment": "Updated OfficeUIFabric Toolkit link to v4.0.0.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/fabric-website",
-  "email": "lynam.emily@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/detailsheader-fix_2018-03-21-00-31.json b/common/changes/@uifabric/utilities/detailsheader-fix_2018-03-21-00-31.json
deleted file mode 100644
index 0549f5c0b1130..0000000000000
--- a/common/changes/@uifabric/utilities/detailsheader-fix_2018-03-21-00-31.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "EventGroup.raise: event args are now correctly mixed into the event object.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/commandbar-onclick-4231_2018-03-19-19-26.json b/common/changes/office-ui-fabric-react/commandbar-onclick-4231_2018-03-19-19-26.json
deleted file mode 100644
index 37cf70127ce8d..0000000000000
--- a/common/changes/office-ui-fabric-react/commandbar-onclick-4231_2018-03-19-19-26.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Reordered the logic in CommandBar that decides to render an anchor or button tag so that the anchor tag can have both an href and onclick attribute.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "v-brgarl@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/detailsheader-fix_2018-03-21-00-31.json b/common/changes/office-ui-fabric-react/detailsheader-fix_2018-03-21-00-31.json
deleted file mode 100644
index 076b42db5092a..0000000000000
--- a/common/changes/office-ui-fabric-react/detailsheader-fix_2018-03-21-00-31.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: headers now resize correctly and respect maxWidth.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/jdrush89-Change-Toggle-Styling-To-Use-Flexbox_2018-03-19-19-21.json b/common/changes/office-ui-fabric-react/jdrush89-Change-Toggle-Styling-To-Use-Flexbox_2018-03-19-19-21.json
deleted file mode 100644
index 9f343b9df1645..0000000000000
--- a/common/changes/office-ui-fabric-react/jdrush89-Change-Toggle-Styling-To-Use-Flexbox_2018-03-19-19-21.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Toggle: Updating to use flexbox positioning",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "jdrush89@gmail.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/patch-1_2018-03-17-10-31.json b/common/changes/office-ui-fabric-react/patch-1_2018-03-17-10-31.json
deleted file mode 100644
index c597dd62bd5d4..0000000000000
--- a/common/changes/office-ui-fabric-react/patch-1_2018-03-17-10-31.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "TextField: Fixing issue with promise based error message not being announced by firefox + NVDA",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "prbhad@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/sayalis-makeSearchHasFocusPublic_2018-03-19-21-32.json b/common/changes/office-ui-fabric-react/sayalis-makeSearchHasFocusPublic_2018-03-19-21-32.json
deleted file mode 100644
index bf64cac2d2b91..0000000000000
--- a/common/changes/office-ui-fabric-react/sayalis-makeSearchHasFocusPublic_2018-03-19-21-32.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add `hasFocus` api in `SearchBox` that returns a flag indicating whether `SearchBox` has focus or not.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "sayalis@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 4f8b949194903..c3944353e2fd2 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.20.0 <6.0.0",
-    "@uifabric/utilities": ">=5.19.0 <6.0.0",
+    "@uifabric/utilities": ">=5.19.1 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 91a39ea2ddaac..2a2a390f066dc 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.66.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.67.0 <6.0.0",
     "@uifabric/icons": ">=5.6.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 78c1da926c20b..d00d2c89b0b01 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,47 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.67.0",
+      "tag": "office-ui-fabric-react_v5.67.0",
+      "date": "Wed, 21 Mar 2018 10:18:30 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Brian Garland <brian@efelle.com>",
+            "commit": "3bfe9498f8cfa0cccc1129d10bd49744c8a152f5",
+            "comment": "Reordered the logic in CommandBar that decides to render an anchor or button tag so that the anchor tag can have both an href and onclick attribute."
+          },
+          {
+            "author": "SayaliS <sayalis@microsoft.com>",
+            "commit": "d1feb088557c62359dc5f6a55b0b460dc8c63fd1",
+            "comment": "Add `hasFocus` api in `SearchBox` that returns a flag indicating whether `SearchBox` has focus or not."
+          }
+        ],
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "d50399a80ffde20e5981c3c9a0f5e080016b342d",
+            "comment": "DetailsList: headers now resize correctly and respect maxWidth."
+          },
+          {
+            "author": "Joshua Rush <jdrush89@gmail.com>",
+            "commit": "2527a28766718529e7f6ab3d4ead88d6bedd4c05",
+            "comment": "Toggle: Updating to use flexbox positioning"
+          },
+          {
+            "author": "priyank <priyank.bhadja91@gmail.com>",
+            "commit": "376e93ead5c3695822614770711daa2579dd9246",
+            "comment": "TextField: Fixing issue with promise based error message not being announced by firefox + NVDA"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.19.0 <6.0.0` to `>=5.19.1 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.66.0",
       "tag": "office-ui-fabric-react_v5.66.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 1cf785f2b6f8d..94a573b84ea41 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,20 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Tue, 20 Mar 2018 10:27:37 GMT and should not be manually modified.
+This log was last generated on Wed, 21 Mar 2018 10:18:30 GMT and should not be manually modified.
+
+## 5.67.0
+Wed, 21 Mar 2018 10:18:30 GMT
+
+### Minor changes
+
+- Reordered the logic in CommandBar that decides to render an anchor or button tag so that the anchor tag can have both an href and onclick attribute.
+- Add `hasFocus` api in `SearchBox` that returns a flag indicating whether `SearchBox` has focus or not.
+
+### Patches
+
+- DetailsList: headers now resize correctly and respect maxWidth.
+- Toggle: Updating to use flexbox positioning
+- TextField: Fixing issue with promise based error message not being announced by firefox + NVDA
 
 ## 5.66.0
 Tue, 20 Mar 2018 10:27:37 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 3d5a0f07210be..ef843d6f174c4 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.66.0",
+  "version": "5.67.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -51,7 +51,7 @@
     "@uifabric/icons": ">=5.6.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "@uifabric/styling": ">=5.20.0 <6.0.0",
-    "@uifabric/utilities": ">=5.19.0 <6.0.0",
+    "@uifabric/utilities": ">=5.19.1 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 889504a742634..9820cb4d0c043 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -28,7 +28,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.19.0 <6.0.0",
+    "@uifabric/utilities": ">=5.19.1 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index d801e504171f4..0ee4243650175 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.19.1",
+      "tag": "@uifabric/utilities_v5.19.1",
+      "date": "Wed, 21 Mar 2018 10:18:29 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "d50399a80ffde20e5981c3c9a0f5e080016b342d",
+            "comment": "EventGroup.raise: event args are now correctly mixed into the event object."
+          }
+        ]
+      }
+    },
     {
       "version": "5.19.0",
       "tag": "@uifabric/utilities_v5.19.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 182123c8378b9..f36a9efe5a8b2 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Tue, 20 Mar 2018 10:27:37 GMT and should not be manually modified.
+This log was last generated on Wed, 21 Mar 2018 10:18:30 GMT and should not be manually modified.
+
+## 5.19.1
+Wed, 21 Mar 2018 10:18:29 GMT
+
+### Patches
+
+- EventGroup.raise: event args are now correctly mixed into the event object.
 
 ## 5.19.0
 Tue, 20 Mar 2018 10:27:37 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index ad5737c966f40..c993ce5885512 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.19.0",
+  "version": "5.19.1",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From 5ebf43e6c339d783900a58055f4c9e8b3ac5a124 Mon Sep 17 00:00:00 2001
From: priyank <priyank.bhadja91@gmail.com>
Date: Thu, 22 Mar 2018 03:30:27 +0530
Subject: [PATCH 1616/1641] Removing empty callout when tooltip content is
 empty (#4326)

* Removing empty callout when tooltip content is empty

* adding change file
---
 ...d-HideTooltipForEmptyMessage_2018-03-21-05-49.json | 11 +++++++++++
 .../src/components/Tooltip/TooltipHost.tsx            |  4 +++-
 2 files changed, 14 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/users-prbhad-HideTooltipForEmptyMessage_2018-03-21-05-49.json

diff --git a/common/changes/office-ui-fabric-react/users-prbhad-HideTooltipForEmptyMessage_2018-03-21-05-49.json b/common/changes/office-ui-fabric-react/users-prbhad-HideTooltipForEmptyMessage_2018-03-21-05-49.json
new file mode 100644
index 0000000000000..98265100b884c
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/users-prbhad-HideTooltipForEmptyMessage_2018-03-21-05-49.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Removing empty callout when tooltip content is empty",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "prbhad@microsoft.com"
+}
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
index 18fe6edfc3e5f..9d7ff403f01ba 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.tsx
@@ -56,6 +56,8 @@ export class TooltipHost extends BaseComponent<ITooltipHostProps, ITooltipHostSt
     } = this.props;
     const { isTooltipVisible } = this.state;
     const tooltipId = id || getId('tooltip');
+    const isContentPresent = !!(content || (tooltipProps && tooltipProps.onRenderContent && tooltipProps.onRenderContent()));
+    const showTooltip = isTooltipVisible && isContentPresent;
 
     return (
       <div
@@ -72,7 +74,7 @@ export class TooltipHost extends BaseComponent<ITooltipHostProps, ITooltipHostSt
         aria-describedby={ setAriaDescribedBy && isTooltipVisible && content ? tooltipId : undefined }
       >
         { children }
-        { isTooltipVisible && (
+        { showTooltip && (
           <Tooltip
             id={ tooltipId }
             delay={ delay }

From d4159b20c9b143248cf52d1f3cdda24fd2e1caae Mon Sep 17 00:00:00 2001
From: inateeg <inateeg@microsoft.com>
Date: Wed, 21 Mar 2018 15:01:03 -0700
Subject: [PATCH 1617/1641] Add DocumentCardLogo and DocumentCardStatus for
 supporting conversation activity card (#4299)

* Add DocumentCardLogo

* add changes file

* add changes file

* update

* update on title to support secondary title used as text preview

* update

* update

* remove focusZone fix that is not relevant to this change

* removed unintentional changed files

* update

* change file

* update
---
 .../inateeg-0302card_2018-03-21-20-56.json    | 11 ++++
 common/last-install.flag                      |  0
 common/npm-local/last-install.flag            |  0
 .../components/DocumentCard/DocumentCard.scss | 29 ++++++++-
 .../DocumentCard/DocumentCard.types.ts        | 46 +++++++++++++
 .../DocumentCard/DocumentCardLogo.tsx         | 18 +++++
 .../DocumentCard/DocumentCardPage.tsx         |  5 +-
 .../DocumentCard/DocumentCardPreview.tsx      |  5 +-
 .../DocumentCard/DocumentCardStatus.tsx       | 34 ++++++++++
 .../DocumentCard/DocumentCardTitle.tsx        | 34 ++++++----
 .../examples/DocumentCard.Compact.Example.tsx | 28 ++++++++
 .../DocumentCard.Complete.Example.tsx         | 65 ++++++++++++++++++-
 .../examples/DocumentCard.Example.scss        |  8 +++
 .../src/components/DocumentCard/index.ts      |  2 +
 14 files changed, 268 insertions(+), 17 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/inateeg-0302card_2018-03-21-20-56.json
 create mode 100644 common/last-install.flag
 create mode 100644 common/npm-local/last-install.flag
 create mode 100644 packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardLogo.tsx
 create mode 100644 packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardStatus.tsx

diff --git a/common/changes/office-ui-fabric-react/inateeg-0302card_2018-03-21-20-56.json b/common/changes/office-ui-fabric-react/inateeg-0302card_2018-03-21-20-56.json
new file mode 100644
index 0000000000000..c5587144f9f9f
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/inateeg-0302card_2018-03-21-20-56.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": ",",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "inateeg@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/last-install.flag b/common/last-install.flag
new file mode 100644
index 0000000000000..e69de29bb2d1d
diff --git a/common/npm-local/last-install.flag b/common/npm-local/last-install.flag
new file mode 100644
index 0000000000000..e69de29bb2d1d
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.scss b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.scss
index f04b8bc98f117..67bc5368b99ca 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.scss
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.scss
@@ -274,7 +274,6 @@ $ms-DocumentCardActivity-personaTextGutter: 8px;
   font-size: $ms-font-size-s;
 }
 
-
 /** Title **/
 $DocumentCard-title-lineHeight: 21px;
 .title {
@@ -286,4 +285,30 @@ $DocumentCard-title-lineHeight: 21px;
   line-height: $DocumentCard-title-lineHeight;
   overflow: hidden;
   word-wrap: break-word;
-}
\ No newline at end of file
+}
+
+.secondaryTitle {
+  padding: 8px 16px;
+  display: block;
+  @include ms-font-m;
+  color: $ms-color-neutralSecondary;
+  line-height: 18px;
+  overflow: hidden;
+  word-wrap: break-word;
+  height: 45px;
+}
+
+.logo {
+  font-size: 32px;
+  color: $ms-color-themePrimary;
+  display: block;
+  @include ms-padding(16px, 16px, 0, 16px);
+}
+
+.status {
+  @include ms-margin(8px, 16px, 8px, 16px);
+  @include ms-font-m;
+  color: $ms-color-neutralPrimary;
+  background-color: $ms-color-neutralLighter;
+  height: 32px;
+}
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.types.ts b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.types.ts
index 8c6cc15d49aa1..3aaa585623568 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.types.ts
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.types.ts
@@ -5,6 +5,8 @@ import { DocumentCardPreview } from './DocumentCardPreview';
 import { DocumentCardLocation } from './DocumentCardLocation';
 import { DocumentCardActivity } from './DocumentCardActivity';
 import { DocumentCardActions } from './DocumentCardActions';
+import { DocumentCardLogo } from './DocumentCardLogo';
+import { DocumentCardStatus } from './DocumentCardStatus';
 import { PersonaInitialsColor } from '../../Persona';
 import { ImageFit } from '../../Image';
 import { IButtonProps } from '../../Button';
@@ -144,6 +146,12 @@ export interface IDocumentCardPreviewImage {
    * If provided, icon will be rendered instead of image.
    */
   previewIconProps?: IIconProps;
+
+  /**
+   * The props for the preview icon container classname.
+   * If provided, icon container classname will be used..
+   */
+  previewIconContainerClass?: string;
 }
 
 export interface IDocumentCardTitleProps extends React.Props<DocumentCardTitle> {
@@ -162,6 +170,12 @@ export interface IDocumentCardTitleProps extends React.Props<DocumentCardTitle>
    * @defaultvalue true
    */
   shouldTruncate?: boolean;
+
+  /**
+   * Whether show as title as secondary title style such as smaller font and lighter color.
+   * @defaultvalue false
+   */
+  showAsSecondaryTitle?: boolean;
 }
 
 export interface IDocumentCardLocationProps extends React.Props<DocumentCardLocation> {
@@ -247,3 +261,35 @@ export interface IDocumentCardActionsProps extends React.Props<DocumentCardActio
    */
   views?: Number;
 }
+
+export interface IDocumentCardLogoProps extends React.Props<DocumentCardLogo> {
+  /**
+   * Gets the component ref.
+   */
+  componentRef?: () => void;
+  /**
+   * Describes DocumentCard Logo badge.
+   */
+  logoIcon: string;
+
+  /**
+   * Describe Logo name, optional.
+   */
+  logoName?: string;
+}
+
+export interface IDocumentCardStatusProps extends React.Props<DocumentCardStatus> {
+  /**
+   * Gets the component ref.
+   */
+  componentRef?: () => void;
+  /**
+   * Describes DocumentCard status icon.
+   */
+  statusIcon?: string;
+
+  /**
+   * Describe status information. Required field.
+   */
+  status: string;
+}
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardLogo.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardLogo.tsx
new file mode 100644
index 0000000000000..2824683bcd295
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardLogo.tsx
@@ -0,0 +1,18 @@
+import * as React from 'react';
+import { BaseComponent, css } from '../../Utilities';
+import { IDocumentCardLogoProps } from './DocumentCard.types';
+import { Icon } from '../../Icon';
+import * as stylesImport from './DocumentCard.scss';
+const styles: any = stylesImport;
+
+export class DocumentCardLogo extends BaseComponent<IDocumentCardLogoProps, any> {
+  public render() {
+    const { logoIcon } = this.props;
+
+    return (
+      <div className={ css('ms-DocumentCardLogo', styles.logo) }>
+        <Icon iconName={ logoIcon } />
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx
index 0a875ffa7f05e..11dd49b7b1862 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPage.tsx
@@ -33,6 +33,9 @@ export class DocumentCardPage extends React.Component<IComponentDemoPageProps, {
               <p>
                 This example shows a couple of optional abilities, including being able to have a card represent multiple items, being able to expose up to three relevant commands, and showing the number of views in the bottom right corner.
               </p>
+              <p>
+                Also show a card with Logo, text preview and status that is used for Conversation card.
+              </p>
               <DocumentCardCompleteExample />
             </ExampleCard>
             <ExampleCard title='DocumentCard with compact layout ' code={ DocumentCardCompactExampleCode }>
@@ -80,7 +83,7 @@ export class DocumentCardPage extends React.Component<IComponentDemoPageProps, {
         isHeaderVisible={ this.props.isHeaderVisible }
         componentStatus={
           <ComponentStatus
-            {...DocumentCardStatus}
+            { ...DocumentCardStatus }
           />
         }
       />
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx
index 36e1c3dd3214d..704d3fed94dd9 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardPreview.tsx
@@ -44,11 +44,12 @@ export class DocumentCardPreview extends BaseComponent<IDocumentCardPreviewProps
   }
 
   private _renderPreviewImage(previewImage: IDocumentCardPreviewImage): React.ReactElement<React.HTMLAttributes<HTMLDivElement>> {
-    const { width, height, imageFit, previewIconProps } = previewImage;
+    const { width, height, imageFit, previewIconProps, previewIconContainerClass } = previewImage;
+    const iconContainerClass = previewIconContainerClass ? previewIconContainerClass : 'ms-DocumentCardPreview-iconContainer';
 
     if (previewIconProps) {
       return (
-        <div className={ css('ms-DocumentCardPreview-iconContainer', styles.previewIconContainer) } style={ { width: width, height: height } } >
+        <div className={ css(iconContainerClass, styles.previewIconContainer) } style={ { width: width, height: height } } >
           <Icon { ...previewIconProps } />
         </div>
       );
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardStatus.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardStatus.tsx
new file mode 100644
index 0000000000000..127222419f41f
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardStatus.tsx
@@ -0,0 +1,34 @@
+/* tslint:disable:no-unused-variable */
+import * as React from 'react';
+/* tslint:enable:no-unused-variable */
+
+import {
+  BaseComponent,
+  autobind,
+  css
+} from '../../Utilities';
+import { IDocumentCardStatusProps } from './DocumentCard.types';
+import * as stylesImport from './DocumentCard.scss';
+import { Icon } from '../../Icon';
+const styles: any = stylesImport;
+
+export class DocumentCardStatus extends BaseComponent<IDocumentCardStatusProps, any> {
+  constructor(props: IDocumentCardStatusProps) {
+    super(props);
+  }
+
+  public render() {
+    const { statusIcon, status } = this.props;
+    const iconProps = {
+      iconName: statusIcon, styles: {
+        root: { padding: '8px' }
+      }
+    };
+    return (
+      <div className={ css('ms-DocumentCardStatus', styles.status) }>
+        { statusIcon && <Icon { ...iconProps } /> }
+        { status }
+      </div>
+    );
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx
index cdc913066fd40..05891cd4f58a5 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCardTitle.tsx
@@ -9,6 +9,7 @@ import {
 } from '../../Utilities';
 import { IDocumentCardTitleProps } from './DocumentCard.types';
 import * as stylesImport from './DocumentCard.scss';
+
 const styles: any = stylesImport;
 
 export interface IDocumentCardTitleState {
@@ -19,6 +20,10 @@ export interface IDocumentCardTitleState {
 const TRUNCATION_SEPARATOR = '&hellip;';
 const TRUNCATION_MINIMUM_LENGTH = 40; // This is the length we know can fit into the min width of DocumentCard.
 const TRUNCATION_MAXIMUM_LENGTH = 90 - TRUNCATION_SEPARATOR.length;
+
+// This is the length we know can fit into the min width 2 lines of DocumentCard.
+const TRUNCATION_MINI_LENGTH_SECONDARY = 80;
+const TRUNCATION_MAX_LENGTH_SECONDARY = 130 - TRUNCATION_SEPARATOR.length;
 const TRUNCATION_FIRST_PIECE_LONGER_BY = 10;
 const TRUNCATION_VERTICAL_OVERFLOW_THRESHOLD = 5;
 
@@ -38,8 +43,9 @@ export class DocumentCardTitle extends BaseComponent<IDocumentCardTitleProps, ID
   }
 
   public componentDidMount() {
-    const { title, shouldTruncate } = this.props;
-    if (shouldTruncate && title && title.length > TRUNCATION_MINIMUM_LENGTH) {
+    const { title, shouldTruncate, showAsSecondaryTitle } = this.props;
+    const miniLength = showAsSecondaryTitle ? TRUNCATION_MINI_LENGTH_SECONDARY : TRUNCATION_MINIMUM_LENGTH;
+    if (shouldTruncate && title && title.length > miniLength) {
       if (this._doesTitleOverflow()) {
         this._startTruncation(this.props);
       }
@@ -51,7 +57,8 @@ export class DocumentCardTitle extends BaseComponent<IDocumentCardTitleProps, ID
     this._events.off(window, 'resize');
     this._isTruncated = false;
 
-    if (newProps.shouldTruncate && newProps.title && newProps.title.length > TRUNCATION_MINIMUM_LENGTH) {
+    const miniLength = newProps.showAsSecondaryTitle ? TRUNCATION_MINI_LENGTH_SECONDARY : TRUNCATION_MINIMUM_LENGTH;
+    if (newProps.shouldTruncate && newProps.title && newProps.title.length > miniLength) {
       this._startTruncation(newProps);
       this._events.on(window, 'resize', this._updateTruncation);
     }
@@ -65,37 +72,42 @@ export class DocumentCardTitle extends BaseComponent<IDocumentCardTitleProps, ID
   }
 
   public render() {
-    const { title, shouldTruncate } = this.props;
+    const { title, shouldTruncate, showAsSecondaryTitle } = this.props;
     const { truncatedTitleFirstPiece, truncatedTitleSecondPiece } = this.state;
 
     let documentCardTitle;
     if (shouldTruncate && this._isTruncated) {
       documentCardTitle = (
-        <div className={ css('ms-DocumentCardTitle', styles.title) } ref={ this._titleElement } title={ title }>{ truncatedTitleFirstPiece }&hellip;{ truncatedTitleSecondPiece }</div>
+        <div className={ css('ms-DocumentCardTitle', showAsSecondaryTitle ? styles.secondaryTitle : styles.title) } ref={ this._resolveRef('_titleElement') } title={ title }>
+          { truncatedTitleFirstPiece }&hellip;{ truncatedTitleSecondPiece }
+        </div>
       );
     } else {
       documentCardTitle = (
-        <div className={ css('ms-DocumentCardTitle', styles.title) } ref={ this._titleElement } title={ title }>{ title }</div>
+        <div className={ css('ms-DocumentCardTitle', showAsSecondaryTitle ? styles.secondaryTitle : styles.title) } ref={ this._resolveRef('_titleElement') } title={ title }>
+          { title }
+        </div>
       );
     }
-
     return documentCardTitle;
   }
 
   private _startTruncation = (props: IDocumentCardTitleProps): void => {
     const originalTitle = props.title;
     this._isTruncated = false;
+    const miniLength = props.showAsSecondaryTitle ? TRUNCATION_MINI_LENGTH_SECONDARY : TRUNCATION_MINIMUM_LENGTH;
+    const maxLength = props.showAsSecondaryTitle ? TRUNCATION_MAX_LENGTH_SECONDARY : TRUNCATION_MAXIMUM_LENGTH;
 
     // If the title is really short, there's no need to truncate it
-    if (originalTitle && originalTitle.length >= TRUNCATION_MINIMUM_LENGTH) {
+    if (originalTitle && originalTitle.length >= miniLength) {
 
       // Break the text into two pieces for assembly later
-      if (originalTitle.length > TRUNCATION_MAXIMUM_LENGTH) {
+      if (originalTitle.length > maxLength) {
         // The text is really long, so we can take a chunk out of the middle so the two pieces combine for the maximum length
         this._isTruncated = true;
         this.setState({
-          truncatedTitleFirstPiece: originalTitle.slice(0, TRUNCATION_MAXIMUM_LENGTH / 2 + TRUNCATION_FIRST_PIECE_LONGER_BY),
-          truncatedTitleSecondPiece: originalTitle.slice(originalTitle.length - (TRUNCATION_MAXIMUM_LENGTH / 2 - TRUNCATION_FIRST_PIECE_LONGER_BY))
+          truncatedTitleFirstPiece: originalTitle.slice(0, maxLength / 2 + TRUNCATION_FIRST_PIECE_LONGER_BY),
+          truncatedTitleSecondPiece: originalTitle.slice(originalTitle.length - (maxLength / 2 - TRUNCATION_FIRST_PIECE_LONGER_BY))
         });
       } else {
         // The text is not so long, so we'll just break it into two pieces
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Compact.Example.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Compact.Example.tsx
index 2645db4b70d70..dd04ff54c3fac 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Compact.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Compact.Example.tsx
@@ -54,6 +54,16 @@ export class DocumentCardCompactExample extends React.Component<any, any> {
       ]
     };
 
+    const previewOutlookUsingIcon: IDocumentCardPreviewProps = {
+      previewImages: [
+        {
+          previewIconProps: { iconName: 'OutlookLogo', styles: { root: { fontSize: 42, color: '#0078d7' } } },
+          previewIconContainerClass: 'ms-DocumentCardPreview-iconContainer2',
+          width: 144
+        }
+      ]
+    };
+
     return (
       <div>
         <DocumentCard type={ DocumentCardType.compact } onClickHref='http://bing.com'>
@@ -109,6 +119,24 @@ export class DocumentCardCompactExample extends React.Component<any, any> {
             />
           </div>
         </DocumentCard>
+        <p />
+        <DocumentCard type={ DocumentCardType.compact } onClickHref='http://bing.com'>
+          <DocumentCardPreview { ...previewOutlookUsingIcon } />
+          <div className='ms-DocumentCard-details'>
+            <DocumentCardTitle
+              title='Conversation about anual report from SharePoint conference'
+              shouldTruncate={ true }
+            />
+            <DocumentCardActivity
+              activity='Sent a few minutes ago'
+              people={
+                [
+                  { name: 'Kat Larrson', profileImageSrc: TestImages.personaFemale }
+                ]
+              }
+            />
+          </div>
+        </DocumentCard>
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx
index 73b2356cb87f6..494caa0a604a9 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Complete.Example.tsx
@@ -6,7 +6,10 @@ import {
   DocumentCardLocation,
   DocumentCardPreview,
   DocumentCardTitle,
-  IDocumentCardPreviewProps
+  DocumentCardLogo,
+  DocumentCardStatus,
+  IDocumentCardPreviewProps,
+  IDocumentCardLogoProps
 } from 'office-ui-fabric-react/lib/DocumentCard';
 import { ImageFit } from 'office-ui-fabric-react/lib/Image';
 import { TestImages } from '../../../common/TestImages';
@@ -84,6 +87,10 @@ export class DocumentCardCompleteExample extends React.Component<any, any> {
       ]
     };
 
+    const logoProps: IDocumentCardLogoProps = {
+      logoIcon: 'OutlookLogo'
+    };
+
     return (
       <div>
         <DocumentCard
@@ -137,6 +144,62 @@ export class DocumentCardCompleteExample extends React.Component<any, any> {
             views={ 432 }
           />
         </DocumentCard>
+        <p />Card Logo, Text Preview CardStatus are used on below examples.<p />
+        <DocumentCard onClickHref='http://bing.com'>
+          <DocumentCardLogo { ...logoProps } />
+          <div className='ms-ConversationTile-TitlePreviewArea' >
+            <DocumentCardTitle title='Conversation about anual report a very long long name, Title should be truncated on the long name.' shouldTruncate={ true } />
+            <DocumentCardTitle title='This is the email content preview, please feel free to give feedback. SharePoint Site Acitivity add conversation card! This is the last.' shouldTruncate={ true } showAsSecondaryTitle={ true } />
+            <DocumentCardStatus statusIcon='attach' status=' 3 Attachments' />
+          </div>
+          <DocumentCardActivity
+            activity='Sent March 13, 2018'
+            people={
+              [
+                { name: 'Annie Lindqvist', profileImageSrc: TestImages.personaFemale },
+                { name: 'Roko Kolar', profileImageSrc: '', initials: 'JH' },
+                { name: 'Greta Lundberg', profileImageSrc: TestImages.personaFemale }
+              ]
+            }
+          />
+        </DocumentCard>
+        <p />
+        <DocumentCard onClickHref='http://bing.com'>
+          <DocumentCardLogo { ...logoProps } />
+          <div className='ms-ConversationTile-TitlePreviewArea' >
+            <DocumentCardTitle title='Conversation about anual Report' />
+            <DocumentCardTitle title='This is the email content preview, help.' showAsSecondaryTitle={ true } />
+            <DocumentCardStatus statusIcon='attach' status=' 3 Attachments' />
+          </div>
+          <DocumentCardActivity
+            activity='Sent March 13, 2018'
+            people={
+              [
+                { name: 'Annie Lindqvist', profileImageSrc: TestImages.personaFemale },
+                { name: 'Roko Kolar', profileImageSrc: '', initials: 'JH' },
+                { name: 'Greta Lundberg', profileImageSrc: TestImages.personaFemale }
+              ]
+            }
+          />
+        </DocumentCard>
+        <p />
+        <DocumentCard onClickHref='http://bing.com'>
+          <DocumentCardLogo { ...logoProps } />
+          <div className='ms-ConversationTile-TitlePreviewArea' >
+            <DocumentCardTitle title='Conversation about anual report' shouldTruncate={ true } />
+            <DocumentCardTitle title='This is the email content preview, please feel free to give!' shouldTruncate={ true } showAsSecondaryTitle={ true } />
+          </div>
+          <DocumentCardActivity
+            activity='Sent March 13, 2018'
+            people={
+              [
+                { name: 'Annie Lindqvist', profileImageSrc: TestImages.personaFemale },
+                { name: 'Roko Kolar', profileImageSrc: '', initials: 'JH' },
+                { name: 'Greta Lundberg', profileImageSrc: TestImages.personaFemale }
+              ]
+            }
+          />
+        </DocumentCard>
         <p />
         <DocumentCard onClickHref='http://bing.com'>
           <DocumentCardPreview { ...previewPropsUsingIcon } />
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Example.scss b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Example.scss
index f150ec2e88415..8e7118a890d0a 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Example.scss
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/examples/DocumentCard.Example.scss
@@ -4,4 +4,12 @@
   .ms-DocumentCardPreview-iconContainer {
     background-color: $ms-color-themePrimary;
   }
+
+  .ms-DocumentCardPreview-iconContainer2 {
+    background-color: $ms-color-neutralLighterAlt;
+  }
+
+  .ms-ConversationTile-TitlePreviewArea {
+    height: 182px;
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/index.ts b/packages/office-ui-fabric-react/src/components/DocumentCard/index.ts
index c8b71737fb487..88e75b458727e 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/index.ts
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/index.ts
@@ -5,3 +5,5 @@ export * from './DocumentCardActivity';
 export * from './DocumentCardLocation';
 export * from './DocumentCardPreview';
 export * from './DocumentCardTitle';
+export * from './DocumentCardLogo';
+export * from './DocumentCardStatus';

From c5245a51bd4f740399d6d9dbd98f2c51ef6f0a59 Mon Sep 17 00:00:00 2001
From: Mark Polak <mark@thedutchies.com>
Date: Wed, 21 Mar 2018 23:02:15 +0100
Subject: [PATCH 1618/1641] A few more autobind removals (#4327)

* A few more autobind removals

* Npm change files
---
 ...re-autobind-removals_2018-03-21-07-02.json | 11 ++++
 ...re-autobind-removals_2018-03-21-07-02.json | 11 ++++
 .../ExtendedPeoplePicker.Basic.Example.tsx    | 28 ++++------
 .../FloatingPeoplePicker.Basic.Example.tsx    | 21 +++-----
 .../Form/examples/Form.Autosave.Example.tsx   |  4 +-
 .../Form/examples/Form.Basic.Example.tsx      |  4 +-
 .../Form/examples/Form.Validation.Example.tsx |  4 +-
 .../examples/KeytipLayer.Basic.Example.tsx    | 13 ++---
 .../SelectedPeopleList.Basic.Example.tsx      | 17 +++---
 .../examples/Shimmer.Application.Example.tsx  | 13 ++---
 .../Tile/examples/Tile.Document.Example.tsx   |  5 +-
 .../Tile/examples/Tile.Folder.Example.tsx     |  5 +-
 .../Tile/examples/Tile.Media.Example.tsx      |  5 +-
 .../examples/TilesList.Document.Example.tsx   | 16 ++----
 .../examples/TilesList.Media.Example.tsx      | 16 ++----
 .../VirtualizedList.Basic.Example.tsx         |  4 +-
 .../VirtualizedList.Basic.Example2.tsx        |  4 +-
 .../examples/Signals.Basic.Example.tsx        |  8 ++-
 .../examples/Breadcrumb.Basic.Example.tsx     |  6 +--
 .../examples/Breadcrumb.Static.Example.tsx    |  7 +--
 .../examples/Callout.Directional.Example.tsx  | 19 +++----
 .../Checkbox.ImplementationExamples.tsx       |  4 +-
 .../examples/ChoiceGroup.Basic.Example.tsx    |  4 +-
 .../examples/ChoiceGroup.Custom.Example.tsx   |  5 +-
 .../examples/ComboBox.Basic.Example.tsx       | 47 +++++++----------
 .../CommandBar.Customization.Example.tsx      | 11 ++--
 .../ContextualMenu.Customization.Example.tsx  |  4 +-
 ...alMenu.CustomizationWithNoWrap.Example.tsx |  4 +-
 .../ContextualMenu.Directional.Example.tsx    | 14 ++---
 .../examples/DatePicker.Basic.Example.tsx     |  4 +-
 .../examples/DatePicker.Format.Example.tsx    | 13 ++---
 .../examples/DatePicker.Input.Example.tsx     |  7 +--
 .../DatePicker.WeekNumbers.Example.tsx        |  4 +-
 .../examples/DetailsList.Advanced.Example.tsx | 52 +++++++------------
 .../examples/DetailsList.Basic.Example.tsx    |  4 +-
 .../examples/DetailsList.Compact.Example.tsx  |  4 +-
 .../DetailsList.CustomColumns.Example.tsx     |  4 +-
 .../DetailsList.CustomRows.Example.tsx        | 10 ++--
 .../DetailsList.Documents.Example.tsx         | 16 ++----
 .../examples/DetailsList.Grouped.Example.tsx  |  4 +-
 .../DetailsList.NavigatingFocus.Example.tsx   |  4 +-
 .../Dialog/examples/Dialog.Basic.Example.tsx  |  7 +--
 .../examples/Dialog.Blocking.Example.tsx      |  7 +--
 .../examples/Dialog.LargeHeader.Example.tsx   |  7 +--
 .../examples/Dropdown.Basic.Example.tsx       | 13 ++---
 .../examples/Facepile.Basic.Example.tsx       | 10 ++--
 .../examples/Facepile.Overflow.Example.tsx    |  9 ++--
 .../FocusTrapZone.Box.Click.Example.tsx       | 13 ++---
 .../examples/FocusTrapZone.Box.Example.tsx    | 13 ++---
 ...pZone.Box.FocusOnCustomElement.Example.tsx | 13 ++---
 .../examples/FocusTrapZone.Nested.Example.tsx | 13 ++---
 .../examples/HoverCard.Basic.Example.tsx      | 10 ++--
 .../examples/HoverCard.Target.Example.tsx     | 10 ++--
 .../Layer/examples/Layer.Basic.Example.tsx    |  3 +-
 .../Layer/examples/Layer.Hosted.Example.tsx   | 10 ++--
 .../List/examples/List.Grid.Example.tsx       |  4 +-
 .../List/examples/List.Scrolling.Example.tsx  |  9 ++--
 .../MarqueeSelection.Basic.Example.tsx        |  4 +-
 .../Modal/examples/Modal.Basic.Example.tsx    |  7 +--
 .../Overlay/examples/Overlay.Dark.Example.tsx |  7 +--
 .../examples/Overlay.Light.Example.tsx        |  7 +--
 .../Panel/examples/Panel.Custom.Example.tsx   |  7 +--
 .../Panel/examples/Panel.Footer.Example.tsx   |  4 +-
 .../Panel.HiddenOnDismiss.Example.tsx         |  7 +--
 .../examples/Panel.LargeFixed.Example.tsx     |  7 +--
 .../examples/Panel.LightDismiss.Example.tsx   |  7 +--
 .../Panel.LightDismissCustom.Example.tsx      | 16 ++----
 .../Panel/examples/Panel.Medium.Example.tsx   |  4 +-
 .../Panel/examples/Panel.NonModal.Example.tsx |  4 +-
 .../examples/Panel.SmallRight.Example.tsx     | 10 ++--
 .../examples/Persona.Basic.Example.tsx        |  4 +-
 .../Persona.CustomCoinRender.Example.tsx      |  4 +-
 .../examples/Persona.CustomRender.Example.tsx |  4 +-
 .../Pivot/examples/Pivot.Separate.Example.tsx |  7 +--
 .../Rating/examples/Rating.Basic.Example.tsx  | 13 ++---
 .../ResizeGroup.OverflowSet.Example.tsx       | 20 +++----
 .../TextField.CustomRender.Example.tsx        | 10 ++--
 .../examples/TextField.Icon.Example.tsx       |  4 +-
 .../examples/PeoplePicker.Types.Example.tsx   | 39 +++++---------
 .../examples/Picker.CustomResult.Example.tsx  |  4 +-
 .../examples/TagPicker.Basic.Example.tsx      | 13 ++---
 81 files changed, 271 insertions(+), 533 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/more-autobind-removals_2018-03-21-07-02.json
 create mode 100644 common/changes/office-ui-fabric-react/more-autobind-removals_2018-03-21-07-02.json

diff --git a/common/changes/@uifabric/experiments/more-autobind-removals_2018-03-21-07-02.json b/common/changes/@uifabric/experiments/more-autobind-removals_2018-03-21-07-02.json
new file mode 100644
index 0000000000000..20aa33def94c4
--- /dev/null
+++ b/common/changes/@uifabric/experiments/more-autobind-removals_2018-03-21-07-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Removes @autobind for arrow functions",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/more-autobind-removals_2018-03-21-07-02.json b/common/changes/office-ui-fabric-react/more-autobind-removals_2018-03-21-07-02.json
new file mode 100644
index 0000000000000..cec3163890775
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/more-autobind-removals_2018-03-21-07-02.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Removes @autobind from examples",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
index fbbcb15c8eed0..b0d1ee5e0d6a4 100644
--- a/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
+++ b/packages/experiments/src/components/ExtendedPicker/examples/ExtendedPeoplePicker.Basic.Example.tsx
@@ -3,8 +3,7 @@ import * as React from 'react';
 /* tslint:enable */
 import {
   BaseComponent,
-  assign,
-  autobind
+  assign
 } from 'office-ui-fabric-react/lib/Utilities';
 import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
 import { IBasePickerSuggestionsProps, SuggestionsController } from 'office-ui-fabric-react/lib/Pickers';
@@ -128,28 +127,24 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
     return item.primaryText as string;
   }
 
-  @autobind
-  private _setComponentRef(component: ExtendedPeoplePicker): void {
+  private _setComponentRef = (component: ExtendedPeoplePicker): void => {
     this._picker = component;
   }
 
-  @autobind
-  private _onSetFocusButtonClicked(): void {
+  private _onSetFocusButtonClicked = (): void => {
     if (this._picker) {
       this._picker.focus();
     }
   }
 
-  @autobind
-  private _onExpandItem(item: IExtendedPersonaProps): void {
+  private _onExpandItem = (item: IExtendedPersonaProps): void => {
     if (this._picker.selectedItemsList.value) {
       // tslint:disable-next-line:no-any
       (this._picker.selectedItemsList.value as SelectedPeopleList).replaceItem(item, this._getExpandedGroupItems(item as any));
     }
   }
 
-  @autobind
-  private _onRemoveSuggestion(item: IPersonaProps): void {
+  private _onRemoveSuggestion = (item: IPersonaProps): void => {
     let { peopleList, mostRecentlyUsed: mruState } = this.state;
     let indexPeopleList: number = peopleList.indexOf(item);
     let indexMostRecentlyUsed: number = mruState.indexOf(item);
@@ -165,8 +160,8 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
     }
   }
 
-  @autobind
-  private _onFilterChanged(filterText: string, currentPersonas: IPersonaProps[], limitResults?: number): Promise<IPersonaProps[]> | null {
+  private _onFilterChanged = (filterText: string, currentPersonas: IPersonaProps[], limitResults?: number):
+    Promise<IPersonaProps[]> | null => {
     if (filterText) {
       let filteredPersonas: IPersonaProps[] = this._filterPersonasByText(filterText);
 
@@ -178,8 +173,7 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
     }
   }
 
-  @autobind
-  private _returnMostRecentlyUsed(currentPersonas: IPersonaProps[]): IPersonaProps[] | Promise<IPersonaProps[]> {
+  private _returnMostRecentlyUsed = (currentPersonas: IPersonaProps[]): IPersonaProps[] | Promise<IPersonaProps[]> => {
     let { mostRecentlyUsed } = this.state;
     mostRecentlyUsed = this._removeDuplicates(mostRecentlyUsed, this._picker.items);
     return this._convertResultsToPromise(mostRecentlyUsed);
@@ -198,8 +192,7 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
     return copyText;
   }
 
-  @autobind
-  private _shouldShowForceResolve(): boolean {
+  private _shouldShowForceResolve = (): boolean => {
     return Boolean(
       this._picker.floatingPicker.value &&
       this._validateInput(this._picker.floatingPicker.value.inputText) &&
@@ -235,8 +228,7 @@ export class ExtendedPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
     return new Promise<IPersonaProps[]>((resolve: any, reject: any) => setTimeout(() => resolve(results), 150));
   }
 
-  @autobind
-  private _validateInput(input: string): boolean {
+  private _validateInput = (input: string): boolean => {
     if (input.indexOf('@') !== -1) {
       return true;
     } else if (input.length > 1) {
diff --git a/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx b/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
index ef37a1aef7939..e7cfe25a6a434 100644
--- a/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
+++ b/packages/experiments/src/components/FloatingPicker/PeoplePicker/examples/FloatingPeoplePicker.Basic.Example.tsx
@@ -3,8 +3,7 @@ import * as React from 'react';
 /* tslint:enable */
 import {
   BaseComponent,
-  assign,
-  autobind
+  assign
 } from 'office-ui-fabric-react/lib/Utilities';
 import { IPersonaProps } from 'office-ui-fabric-react/lib/Persona';
 import { IBasePickerSuggestionsProps, SuggestionsController } from 'office-ui-fabric-react/lib/Pickers';
@@ -88,27 +87,23 @@ export class FloatingPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
     );
   }
 
-  @autobind
-  private _setComponentRef(component: IBaseFloatingPicker): void {
+  private _setComponentRef = (component: IBaseFloatingPicker): void => {
     this._picker = component;
   }
 
-  @autobind
-  private _onSearchChange(newValue: string): void {
+  private _onSearchChange = (newValue: string): void => {
     if (newValue !== this.state.searchValue) {
       this.setState({ searchValue: newValue });
       this._picker.onQueryStringChanged(newValue);
     }
   }
 
-  @autobind
-  private _onPickerChange(selectedSuggestion: IPersonaProps): void {
+  private _onPickerChange = (selectedSuggestion: IPersonaProps): void => {
     this.setState({ searchValue: selectedSuggestion.primaryText ? selectedSuggestion.primaryText : '' });
     this._picker.hidePicker();
   }
 
-  @autobind
-  private _onRemoveSuggestion(item: IPersonaProps): void {
+  private _onRemoveSuggestion = (item: IPersonaProps): void => {
     let { peopleList, mostRecentlyUsed: mruState } = this.state;
     let indexPeopleList: number = peopleList.indexOf(item);
     let indexMostRecentlyUsed: number = mruState.indexOf(item);
@@ -124,8 +119,7 @@ export class FloatingPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
     }
   }
 
-  @autobind
-  private _onFilterChanged(filterText: string, currentPersonas: IPersonaProps[], limitResults?: number): IPersonaProps[] {
+  private _onFilterChanged = (filterText: string, currentPersonas: IPersonaProps[], limitResults?: number): IPersonaProps[] => {
     if (filterText) {
       let filteredPersonas: IPersonaProps[] = this._filterPersonasByText(filterText);
 
@@ -160,8 +154,7 @@ export class FloatingPeoplePickerTypesExample extends BaseComponent<{}, IPeopleP
     return personas.filter((persona: IPersonaProps) => !this._listContainsPersona(persona, possibleDupes));
   }
 
-  @autobind
-  private _validateInput(input: string): boolean {
+  private _validateInput = (input: string): boolean => {
     if (input.indexOf('@') !== -1) {
       return true;
     } else if (input.length > 1) {
diff --git a/packages/experiments/src/components/Form/examples/Form.Autosave.Example.tsx b/packages/experiments/src/components/Form/examples/Form.Autosave.Example.tsx
index 219ba13c0555c..5c0b7d7fc8fc6 100644
--- a/packages/experiments/src/components/Form/examples/Form.Autosave.Example.tsx
+++ b/packages/experiments/src/components/Form/examples/Form.Autosave.Example.tsx
@@ -1,6 +1,5 @@
 /* tslint:disable:no-any */
 import * as React from 'react';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { Form, FormDatePicker, FormTextInput, Validators } from '../../Form';
 
 export interface IFormAutosaveExampleState {
@@ -53,8 +52,7 @@ export class FormAutosaveExample extends React.Component<{}, IFormAutosaveExampl
     );
   }
 
-  @autobind
-  private _onUpdate(key: string, value: any): void {
+  private _onUpdate = (key: string, value: any): void => {
     let newFormResults = this.state && this.state.formResults ? { ...this.state.formResults } : {};
     newFormResults[key] = value;
     this.setState({ formResults: newFormResults });
diff --git a/packages/experiments/src/components/Form/examples/Form.Basic.Example.tsx b/packages/experiments/src/components/Form/examples/Form.Basic.Example.tsx
index dc29ede547986..20440295e792b 100644
--- a/packages/experiments/src/components/Form/examples/Form.Basic.Example.tsx
+++ b/packages/experiments/src/components/Form/examples/Form.Basic.Example.tsx
@@ -1,7 +1,6 @@
 /* tslint:disable:no-any */
 import * as React from 'react';
 import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { Form, FormTextInput } from '../../Form';
 
 export interface IFormBasicExampleState {
@@ -28,8 +27,7 @@ export class FormBasicExample extends React.Component<{}, IFormBasicExampleState
     );
   }
 
-  @autobind
-  private _onSubmit(values: { [key: string]: any }): void {
+  private _onSubmit = (values: { [key: string]: any }): void => {
     this.setState({ formResults: values });
   }
 }
\ No newline at end of file
diff --git a/packages/experiments/src/components/Form/examples/Form.Validation.Example.tsx b/packages/experiments/src/components/Form/examples/Form.Validation.Example.tsx
index 420826ac69438..f4217c9a915cf 100644
--- a/packages/experiments/src/components/Form/examples/Form.Validation.Example.tsx
+++ b/packages/experiments/src/components/Form/examples/Form.Validation.Example.tsx
@@ -1,6 +1,5 @@
 /* tslint:disable:no-any */
 import * as React from 'react';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { Form, FormConditionalSubmitButton, FormDatePicker, FormTextInput, Validators } from '../../Form';
 
 export interface IFormValidationExampleState {
@@ -54,8 +53,7 @@ export class FormValidationExample extends React.Component<{}, IFormValidationEx
     );
   }
 
-  @autobind
-  private _onSubmit(values: { [key: string]: any }): void {
+  private _onSubmit = (values: { [key: string]: any }): void => {
     this.setState({ formResults: values });
   }
 }
\ No newline at end of file
diff --git a/packages/experiments/src/components/KeytipLayer/examples/KeytipLayer.Basic.Example.tsx b/packages/experiments/src/components/KeytipLayer/examples/KeytipLayer.Basic.Example.tsx
index ad1ba8cb4b812..8cc5d16a91b8b 100644
--- a/packages/experiments/src/components/KeytipLayer/examples/KeytipLayer.Basic.Example.tsx
+++ b/packages/experiments/src/components/KeytipLayer/examples/KeytipLayer.Basic.Example.tsx
@@ -8,7 +8,6 @@ import { DefaultButton, ActionButton } from 'office-ui-fabric-react/lib/Button';
 import { CommandBar } from 'office-ui-fabric-react/lib/CommandBar';
 import { Modal } from 'office-ui-fabric-react/lib/Modal';
 import { MessageBar, MessageBarType } from 'office-ui-fabric-react/lib/MessageBar';
-import { autobind } from '../../../Utilities';
 
 export interface IKeytipLayerBasicExampleState {
   showModal: boolean;
@@ -212,26 +211,22 @@ export class KeytipLayerBasicExample extends React.Component<{}, IKeytipLayerBas
     }
   }
 
-  @autobind
-  private _showModal(): void {
+  private _showModal = (): void => {
     this.setState({ showModal: true });
   }
 
-  @autobind
-  private _hideModal(): void {
+  private _hideModal = (): void => {
     this.setState({ showModal: false });
   }
 
-  @autobind
-  private _showMessageBar(): void {
+  private _showMessageBar = (): void => {
     this.setState({ showMessageBar: true });
 
     // Hide the MessageBar after 2 seconds
     setTimeout(this._hideMessageBar, 2000);
   }
 
-  @autobind
-  private _hideMessageBar(): void {
+  private _hideMessageBar = (): void => {
     this.setState({ showMessageBar: false });
   }
 }
\ No newline at end of file
diff --git a/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx b/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
index 245f2b544db3e..ff3c2f2134716 100644
--- a/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
+++ b/packages/experiments/src/components/SelectedItemsList/examples/SelectedPeopleList.Basic.Example.tsx
@@ -2,8 +2,7 @@
 import * as React from 'react';
 /* tslint:enable */
 import {
-  BaseComponent,
-  autobind
+  BaseComponent
 } from 'office-ui-fabric-react/lib/Utilities';
 import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
 import { people, groupOne, groupTwo } from '../../ExtendedPicker';
@@ -51,11 +50,10 @@ export class PeopleSelectedItemsListExample extends BaseComponent<{}, {}> {
     );
   }
 
-  @autobind
-  private _onRenderItem(props: ISelectedPeopleItemProps): JSX.Element {
+  private _onRenderItem = (props: ISelectedPeopleItemProps): JSX.Element => {
     return (
       <ExtendedSelectedItem
-        {...props}
+        { ...props }
         renderPersonaCoin={ this._renderPersonaElement }
       />
     );
@@ -70,13 +68,11 @@ export class PeopleSelectedItemsListExample extends BaseComponent<{}, {}> {
     );
   }
 
-  @autobind
-  private _setComponentRef(component: SelectedPeopleList): void {
+  private _setComponentRef = (component: SelectedPeopleList): void => {
     this._selectionList = component;
   }
 
-  @autobind
-  private _onAddItemButtonClicked(): void {
+  private _onAddItemButtonClicked = (): void => {
     if (this._selectionList) {
       if (!this.index) {
         this.index = 0;
@@ -86,8 +82,7 @@ export class PeopleSelectedItemsListExample extends BaseComponent<{}, {}> {
     }
   }
 
-  @autobind
-  private _onExpandItem(item: IExtendedPersonaProps): void {
+  private _onExpandItem = (item: IExtendedPersonaProps): void => {
     // tslint:disable-next-line:no-any
     this._selectionList.replaceItem(item, this._getExpandedGroupItems(item as any));
   }
diff --git a/packages/experiments/src/components/Shimmer/examples/Shimmer.Application.Example.tsx b/packages/experiments/src/components/Shimmer/examples/Shimmer.Application.Example.tsx
index a92bc7e53d414..02b6d3d1fca69 100644
--- a/packages/experiments/src/components/Shimmer/examples/Shimmer.Application.Example.tsx
+++ b/packages/experiments/src/components/Shimmer/examples/Shimmer.Application.Example.tsx
@@ -6,7 +6,6 @@ import {
   HoverCard,
   IExpandingCardProps
 } from 'office-ui-fabric-react/lib/HoverCard';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { createListItems } from '@uifabric/example-app-base';
 import './Shimmer.Example.scss';
 import {
@@ -106,8 +105,7 @@ export class ShimmerApplicationExample extends BaseComponent<{}, IShimmerApplica
     );
   }
 
-  @autobind
-  private _onRenderMissingItem(index: number): JSX.Element {
+  private _onRenderMissingItem = (index: number): JSX.Element => {
     this._onDataMiss(index as number);
     return (
       <Shimmer />
@@ -134,8 +132,7 @@ export class ShimmerApplicationExample extends BaseComponent<{}, IShimmerApplica
     }
   }
 
-  @autobind
-  private _onRenderItemColumn(item: IItem, index: number, column: IColumn): JSX.Element | string | number {
+  private _onRenderItemColumn = (item: IItem, index: number, column: IColumn): JSX.Element | string | number => {
     const expandingCardProps: IExpandingCardProps = {
       onRenderCompactCard: this._onRenderCompactCard,
       onRenderExpandedCard: this._onRenderExpandedCard,
@@ -163,8 +160,7 @@ export class ShimmerApplicationExample extends BaseComponent<{}, IShimmerApplica
     return item[column.key];
   }
 
-  @autobind
-  private _onRenderCompactCard(item: IItem): JSX.Element {
+  private _onRenderCompactCard = (item: IItem): JSX.Element => {
     return (
       <div className='hoverCardExample-compactCard'>
         <a target='_blank' href={ `http://wikipedia.org/wiki/${item.location}` }>
@@ -174,8 +170,7 @@ export class ShimmerApplicationExample extends BaseComponent<{}, IShimmerApplica
     );
   }
 
-  @autobind
-  private _onRenderExpandedCard(item: IItem): JSX.Element {
+  private _onRenderExpandedCard = (item: IItem): JSX.Element => {
     const { items, columns } = this.state;
     return (
       <div className='hoverCardExample-expandedCard'>
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
index f9a142959dafa..8cb61b5eddfc5 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Document.Example.tsx
@@ -10,7 +10,7 @@ import {
   SharedSignal
 } from '../../signals/Signals';
 import { lorem } from '@uifabric/example-app-base';
-import { css, autobind, ISize, fitContentToBounds } from '../../../Utilities';
+import { css, ISize, fitContentToBounds } from '../../../Utilities';
 import * as TileExampleStylesModule from './Tile.Example.scss';
 
 // tslint:disable-next-line:no-any
@@ -218,8 +218,7 @@ export class TileDocumentExample extends React.Component<{}, ITileDocumentExampl
     );
   }
 
-  @autobind
-  private _onImagesLoadedChanged(event: React.FormEvent<HTMLInputElement>, checked: boolean): void {
+  private _onImagesLoadedChanged = (event: React.FormEvent<HTMLInputElement>, checked: boolean): void => {
     this.setState({
       imagesLoaded: checked
     });
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
index 88c90306f4a25..2901cb977a474 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Folder.Example.tsx
@@ -11,7 +11,7 @@ import {
 import { FolderCover, getFolderCoverLayout, renderFolderCoverWithLayout } from '../../FolderCover/FolderCover';
 import { FolderCoverType } from '../../FolderCover/FolderCover.types';
 import { lorem } from '@uifabric/example-app-base';
-import { css, autobind, ISize, fitContentToBounds } from '../../../Utilities';
+import { css, ISize, fitContentToBounds } from '../../../Utilities';
 import * as TileExampleStylesModule from './Tile.Example.scss';
 
 // tslint:disable-next-line:no-any
@@ -197,8 +197,7 @@ export class TileFolderExample extends React.Component<{}, ITileFolderExampleSta
     );
   }
 
-  @autobind
-  private _onIsLargeChanged(event: React.FormEvent<HTMLInputElement>, checked: boolean): void {
+  private _onIsLargeChanged = (event: React.FormEvent<HTMLInputElement>, checked: boolean): void => {
     this.setState({
       size: checked ? 'large' : 'small'
     });
diff --git a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
index 0f39cb993ee3c..7c7b079189777 100644
--- a/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
+++ b/packages/experiments/src/components/Tile/examples/Tile.Media.Example.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 import { Tile, getTileLayout, renderTileWithLayout } from '../Tile';
 import { Icon } from 'office-ui-fabric-react/lib/Icon';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
-import { css, autobind, ISize, fitContentToBounds } from '../../../Utilities';
+import { css, ISize, fitContentToBounds } from '../../../Utilities';
 import {
   SignalField,
   Signal,
@@ -220,8 +220,7 @@ export class TileMediaExample extends React.Component<{}, ITileMediaExampleState
     );
   }
 
-  @autobind
-  private _onImagesLoadedChanged(event: React.FormEvent<HTMLInputElement>, checked: boolean): void {
+  private _onImagesLoadedChanged = (event: React.FormEvent<HTMLInputElement>, checked: boolean): void => {
     this.setState({
       imagesLoaded: checked
     });
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
index 4c33dbdf5952b..db7ccc2fc8287 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Document.Example.tsx
@@ -9,7 +9,6 @@ import { Tile } from '../../../Tile';
 import { Toggle } from 'office-ui-fabric-react/lib/Toggle';
 import { Selection, SelectionZone } from 'office-ui-fabric-react/lib/Selection';
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { AnimationClassNames } from 'office-ui-fabric-react/lib/Styling';
 import { IExampleGroup, IExampleItem, createGroup, createDocumentItems, getTileCells } from './ExampleHelpers';
 
@@ -91,28 +90,24 @@ export class TilesListDocumentExample extends React.Component<{}, ITilesListDocu
     );
   }
 
-  @autobind
-  private _onToggleIsModalSelection(checked: boolean): void {
+  private _onToggleIsModalSelection = (checked: boolean): void => {
     this._selection.setModal(checked);
   }
 
-  @autobind
-  private _onSelectionChange(): void {
+  private _onSelectionChange = (): void => {
     this.setState({
       isModalSelection: this._selection.isModal()
     });
   }
 
-  @autobind
-  private _onItemInvoked(item: IExampleItem, index: number, event: Event): void {
+  private _onItemInvoked = (item: IExampleItem, index: number, event: Event): void => {
     event.stopPropagation();
     event.preventDefault();
 
     alert(`Invoked item '${item.name}'`);
   }
 
-  @autobind
-  private _onRenderDocumentCell(item: IExampleItem): JSX.Element {
+  private _onRenderDocumentCell = (item: IExampleItem): JSX.Element => {
     return (
       <Tile
         role='listitem'
@@ -144,8 +139,7 @@ export class TilesListDocumentExample extends React.Component<{}, ITilesListDocu
     );
   }
 
-  @autobind
-  private _onRenderHeader(item: IExampleItem): JSX.Element {
+  private _onRenderHeader = (item: IExampleItem): JSX.Element => {
     return (
       <div role='presentation'>
         <h3>{ item.name }</h3>
diff --git a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
index ed4e5fa348a98..149ae4ddcebab 100644
--- a/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
+++ b/packages/experiments/src/components/TilesList/examples/TilesList.Media.Example.tsx
@@ -10,7 +10,6 @@ import { Tile, getTileLayout, renderTileWithLayout } from '../../../Tile';
 import { Toggle } from 'office-ui-fabric-react/lib/Toggle';
 import { Selection, SelectionZone } from 'office-ui-fabric-react/lib/Selection';
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { AnimationClassNames } from 'office-ui-fabric-react/lib/Styling';
 import { IExampleGroup, IExampleItem, createGroup, createMediaItems, getTileCells } from './ExampleHelpers';
 import * as TilesListExampleStylesModule from './TilesList.Example.scss';
@@ -96,28 +95,24 @@ export class TilesListMediaExample extends React.Component<{}, ITilesListMediaEx
     );
   }
 
-  @autobind
-  private _onToggleIsModalSelection(checked: boolean): void {
+  private _onToggleIsModalSelection = (checked: boolean): void => {
     this._selection.setModal(checked);
   }
 
-  @autobind
-  private _onSelectionChange(): void {
+  private _onSelectionChange = (): void => {
     this.setState({
       isModalSelection: this._selection.isModal()
     });
   }
 
-  @autobind
-  private _onItemInvoked(item: IExampleItem, index: number, event: Event): void {
+  private _onItemInvoked = (item: IExampleItem, index: number, event: Event): void => {
     event.stopPropagation();
     event.preventDefault();
 
     alert(`Invoked item '${item.name}'`);
   }
 
-  @autobind
-  private _onRenderMediaCell(item: IExampleItem, finalSize: ITileSize): JSX.Element {
+  private _onRenderMediaCell = (item: IExampleItem, finalSize: ITileSize): JSX.Element => {
     const tile = (
       <Tile
         role='listitem'
@@ -153,8 +148,7 @@ export class TilesListMediaExample extends React.Component<{}, ITilesListMediaEx
     });
   }
 
-  @autobind
-  private _onRenderHeader(item: IExampleItem): JSX.Element {
+  private _onRenderHeader = (item: IExampleItem): JSX.Element => {
     return (
       <div role='presentation'>
         <h3>{ item.name }</h3>
diff --git a/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example.tsx b/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example.tsx
index 70deb9a7f971d..cfc525d1f66c6 100644
--- a/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example.tsx
+++ b/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { VirtualizedList } from '../VirtualizedList';
 import { ScrollContainer } from '../../../utilities/scrolling/ScrollContainer';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 
 import * as VirtualizedListExampleStylesModule from './VirtualizedList.Example.scss';
 
@@ -44,8 +43,7 @@ export class VirtualizedListBasicExample extends React.Component {
     );
   }
 
-  @autobind
-  private _renderItem(item: IItem, itemIndex: number): JSX.Element {
+  private _renderItem = (item: IItem, itemIndex: number): JSX.Element => {
     return (
       // tslint:disable-next-line:jsx-ban-props
       <div key={ item.key } style={ { height: 30 } }>
diff --git a/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example2.tsx b/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example2.tsx
index 5fb15cec4bb13..5e0bf6313e00f 100644
--- a/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example2.tsx
+++ b/packages/experiments/src/components/VirtualizedList/examples/VirtualizedList.Basic.Example2.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { VirtualizedList } from '../VirtualizedList';
 import { ScrollContainer } from '../../../utilities/scrolling/ScrollContainer';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 
 import * as VirtualizedListExampleStylesModule from './VirtualizedList.Example.scss';
 
@@ -53,8 +52,7 @@ export class VirtualizedListBasicExample2 extends React.Component {
     );
   }
 
-  @autobind
-  private _renderItem(item: IItem, itemIndex: number): JSX.Element {
+  private _renderItem = (item: IItem, itemIndex: number): JSX.Element => {
     return (
       // tslint:disable-next-line:jsx-ban-props
       <div key={ item.key } style={ { height: 30, border: '1px solid blue' } }>
diff --git a/packages/experiments/src/components/signals/examples/Signals.Basic.Example.tsx b/packages/experiments/src/components/signals/examples/Signals.Basic.Example.tsx
index 341cdf34eb2e0..a5d15caf67807 100644
--- a/packages/experiments/src/components/signals/examples/Signals.Basic.Example.tsx
+++ b/packages/experiments/src/components/signals/examples/Signals.Basic.Example.tsx
@@ -19,7 +19,7 @@ import {
   SharedSignal
 } from '../Signals';
 import { ChoiceGroup, IChoiceGroupOption, Checkbox } from 'office-ui-fabric-react';
-import { css, autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { css } from 'office-ui-fabric-react/lib/Utilities';
 import { lorem } from '@uifabric/example-app-base';
 import * as SignalStylesModule from '../Signal.scss';
 import * as SignalsExampleStylesModule from './Signals.Example.scss';
@@ -179,15 +179,13 @@ export class SignalsBasicExample extends React.Component<{}, ISignalsBasicExampl
     );
   }
 
-  @autobind
-  private _onFontSizeChoiceChanged(option: IChoiceGroupOption): void {
+  private _onFontSizeChoiceChanged = (option: IChoiceGroupOption): void => {
     this.setState({
       fontSize: option.key as ISignalsBasicExampleState['fontSize']
     });
   }
 
-  @autobind
-  private _onIsDarkChanged(ev: React.FormEvent<HTMLElement>, checked: boolean): void {
+  private _onIsDarkChanged = (ev: React.FormEvent<HTMLElement>, checked: boolean): void => {
     this.setState({
       isDark: checked
     });
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
index 0d576a60d4965..34addea857b8d 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Basic.Example.tsx
@@ -4,9 +4,6 @@ import * as React from 'react';
 import {
   Breadcrumb, IBreadcrumbItem
 } from 'office-ui-fabric-react/lib/Breadcrumb';
-import {
-  autobind
-} from '../../../Utilities';
 import { Label } from 'office-ui-fabric-react/lib/Label';
 import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
 const exampleStyles: any = exampleStylesImport;
@@ -49,8 +46,7 @@ export class BreadcrumbBasicExample extends React.Component<any, any> {
     );
   }
 
-  @autobind
-  private _onBreadcrumbItemClicked(ev: React.MouseEvent<HTMLElement>, item: IBreadcrumbItem) {
+  private _onBreadcrumbItemClicked = (ev: React.MouseEvent<HTMLElement>, item: IBreadcrumbItem) => {
     console.log(`Breadcrumb item with key "${item.key}" has been clicked.`);
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx
index 75b9fedd67e34..fc283ec4f333f 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/examples/Breadcrumb.Static.Example.tsx
@@ -5,10 +5,6 @@ import {
   Breadcrumb, IBreadcrumbItem
 } from 'office-ui-fabric-react/lib/Breadcrumb';
 
-import {
-  autobind
-} from '../../../Utilities';
-
 export class BreadcrumbStaticExample extends React.Component {
 
   public render() {
@@ -32,8 +28,7 @@ export class BreadcrumbStaticExample extends React.Component {
     );
   }
 
-  @autobind
-  private _onBreadcrumbItemClicked(ev: React.MouseEvent<HTMLElement>, item: IBreadcrumbItem) {
+  private _onBreadcrumbItemClicked = (ev: React.MouseEvent<HTMLElement>, item: IBreadcrumbItem) => {
     console.log(`Breadcrumb item with key "${item.key}" has been clicked.`);
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
index 925e5fd74701d..d919a218c3383 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Callout/examples/Callout.Directional.Example.tsx
@@ -4,7 +4,6 @@ import { Callout, DirectionalHint } from 'office-ui-fabric-react/lib/Callout';
 import { Dropdown, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { Slider } from 'office-ui-fabric-react/lib/Slider';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import './CalloutExample.scss';
 
 import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
@@ -117,44 +116,38 @@ export class CalloutDirectionalExample extends React.Component<{}, ICalloutDirec
     );
   }
 
-  @autobind
-  private _onCalloutDismiss() {
+  private _onCalloutDismiss = (): void => {
     this.setState({
       isCalloutVisible: false
     });
   }
 
-  @autobind
-  private _onShowMenuClicked() {
+  private _onShowMenuClicked = (): void => {
     this.setState({
       isCalloutVisible: !this.state.isCalloutVisible
     });
   }
 
-  @autobind
-  private _onShowBeakChange(ev: React.FormEvent<HTMLElement>, isVisible: boolean) {
+  private _onShowBeakChange = (ev: React.FormEvent<HTMLElement>, isVisible: boolean): void => {
     this.setState({
       isBeakVisible: isVisible,
       beakWidth: 10
     });
   }
 
-  @autobind
-  private _onDirectionalChanged(option: IDropdownOption) {
+  private _onDirectionalChanged = (option: IDropdownOption): void => {
     this.setState({
       directionalHint: option.key as number
     });
   }
 
-  @autobind
-  private _onGapSlider(value: number) {
+  private _onGapSlider = (value: number): void => {
     this.setState({
       gapSpace: value
     });
   }
 
-  @autobind
-  private _onBeakWidthSlider(value: number) {
+  private _onBeakWidthSlider = (value: number): void => {
     this.setState({
       beakWidth: value
     });
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.ImplementationExamples.tsx b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.ImplementationExamples.tsx
index 93e339a65b57c..16c81e39d6bf7 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.ImplementationExamples.tsx
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/examples/Checkbox.ImplementationExamples.tsx
@@ -8,7 +8,6 @@ import {
   Persona,
   PersonaSize
 } from 'office-ui-fabric-react/lib/Persona';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 
 export interface ICheckboxBasicExampleState {
   isChecked: boolean;
@@ -96,8 +95,7 @@ export class CheckboxImplementationExamples extends React.Component<{}, ICheckbo
     console.log(`The option has been changed to ${isChecked}.`);
   }
 
-  @autobind
-  private _onControlledCheckboxChange(ev: React.FormEvent<HTMLElement>, checked: boolean): void {
+  private _onControlledCheckboxChange = (ev: React.FormEvent<HTMLElement>, checked: boolean): void => {
     this.setState({ isChecked: checked! });
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Basic.Example.tsx
index 352a99dbc65fd..ea881152daceb 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Basic.Example.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import { ChoiceGroup, IChoiceGroupOption } from 'office-ui-fabric-react/lib/ChoiceGroup';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 
 /**
  * Interface for ChoiceGroupBasicExample state.
@@ -52,8 +51,7 @@ export class ChoiceGroupBasicExample extends React.Component<{}, IChoiceGroupBas
     );
   }
 
-  @autobind
-  private _onChange(ev: React.FormEvent<HTMLInputElement>, option: any) {
+  private _onChange = (ev: React.FormEvent<HTMLInputElement>, option: any): void => {
     console.dir(option);
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Custom.Example.tsx
index a4a5d2d22092d..d9059902d3b42 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/examples/ChoiceGroup.Custom.Example.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { ChoiceGroup } from 'office-ui-fabric-react/lib/ChoiceGroup';
-import { autobind, css } from 'office-ui-fabric-react/lib/Utilities';
+import { css } from 'office-ui-fabric-react/lib/Utilities';
 import { Dropdown } from 'office-ui-fabric-react/lib/Dropdown';
 
 import * as stylesImport from './ChoiceGroup.Custom.Example.scss';
@@ -60,8 +60,7 @@ export class ChoiceGroupCustomExample extends React.Component {
     );
   }
 
-  @autobind
-  private _onChange(ev: React.FormEvent<HTMLInputElement>, option: any) {
+  private _onChange = (ev: React.FormEvent<HTMLInputElement>, option: any): void => {
     console.dir(option);
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
index 808f65d3b456a..118e160b76f93 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
@@ -6,8 +6,7 @@ import {
 } from 'office-ui-fabric-react/lib/ComboBox';
 import './ComboBox.Basic.Example.scss';
 import {
-  assign,
-  autobind
+  assign
 } from 'office-ui-fabric-react/lib/Utilities';
 import { SelectableOptionMenuItemType } from 'office-ui-fabric-react/lib/utilities/selectableOption/SelectableOption.types';
 import { IComboBox } from '../ComboBox.types';
@@ -19,20 +18,20 @@ export class ComboBoxBasicExample extends React.Component<{}, {
   value?: string;
 }> {
   private _testOptions =
-  [{ key: 'Header', text: 'Theme Fonts', itemType: SelectableOptionMenuItemType.Header },
-  { key: 'A', text: 'Arial Black' },
-  { key: 'B', text: 'Times New Roman' },
-  { key: 'C', text: 'Comic Sans MS' },
-  { key: 'divider_2', text: '-', itemType: SelectableOptionMenuItemType.Divider },
-  { key: 'Header1', text: 'Other Options', itemType: SelectableOptionMenuItemType.Header },
-  { key: 'D', text: 'Option d' },
-  { key: 'E', text: 'Option e' },
-  { key: 'F', text: 'Option f' },
-  { key: 'G', text: 'Option g' },
-  { key: 'H', text: 'Option h' },
-  { key: 'I', text: 'Option i' },
-  { key: 'J', text: 'Option j', disabled: true },
-  ];
+    [{ key: 'Header', text: 'Theme Fonts', itemType: SelectableOptionMenuItemType.Header },
+    { key: 'A', text: 'Arial Black' },
+    { key: 'B', text: 'Times New Roman' },
+    { key: 'C', text: 'Comic Sans MS' },
+    { key: 'divider_2', text: '-', itemType: SelectableOptionMenuItemType.Divider },
+    { key: 'Header1', text: 'Other Options', itemType: SelectableOptionMenuItemType.Header },
+    { key: 'D', text: 'Option d' },
+    { key: 'E', text: 'Option e' },
+    { key: 'F', text: 'Option f' },
+    { key: 'G', text: 'Option g' },
+    { key: 'H', text: 'Option h' },
+    { key: 'I', text: 'Option i' },
+    { key: 'J', text: 'Option j', disabled: true },
+    ];
 
   private _fontMapping: { [key: string]: string } = {
     ['Arial Black']: '"Arial Black", "Arial Black_MSFontService", sans-serif',
@@ -232,8 +231,7 @@ export class ComboBoxBasicExample extends React.Component<{}, {
   }
 
   // Render content of item
-  @autobind
-  private _onRenderFontOption(item: IComboBoxOption): JSX.Element {
+  private _onRenderFontOption = (item: IComboBoxOption): JSX.Element => {
 
     if (item.itemType === SelectableOptionMenuItemType.Header ||
       item.itemType === SelectableOptionMenuItemType.Divider) {
@@ -258,9 +256,7 @@ export class ComboBoxBasicExample extends React.Component<{}, {
     return <span className={ 'ms-ComboBox-optionText' } style={ { fontFamily: fontFamily && fontFamily } }>{ item.text }</span>;
   }
 
-  @autobind
-  private _getOptions(currentOptions: IComboBoxOption[]): IComboBoxOption[] {
-
+  private _getOptions = (currentOptions: IComboBoxOption[]): IComboBoxOption[] => {
     if (this.state.options.length > 0) {
       return this.state.options;
     }
@@ -291,8 +287,7 @@ export class ComboBoxBasicExample extends React.Component<{}, {
     return newOptions;
   }
 
-  @autobind
-  private _onChanged(option: IComboBoxOption, index: number, value: string) {
+  private _onChanged = (option: IComboBoxOption, index: number, value: string): void => {
     if (option !== undefined) {
       this.setState({
         selectedOptionKey: option.key,
@@ -314,13 +309,11 @@ export class ComboBoxBasicExample extends React.Component<{}, {
     }
   }
 
-  @autobind
-  private _basicComboBoxOnClick(): void {
+  private _basicComboBoxOnClick = (): void => {
     this._basicCombobox.focus(true);
   }
 
-  @autobind
-  private _basicComboBoxComponentRef(component: IComboBox) {
+  private _basicComboBoxComponentRef = (component: IComboBox) => {
     this._basicCombobox = component;
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
index e5ef9fbfd6e37..0567f01908c54 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/examples/CommandBar.Customization.Example.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { CommandButton } from 'office-ui-fabric-react/lib/Button';
 import { CommandBar } from 'office-ui-fabric-react/lib/CommandBar';
-import { css, autobind, } from 'office-ui-fabric-react/lib/Utilities';
+import { css } from 'office-ui-fabric-react/lib/Utilities';
 import * as styles from './CommandBar.Example.scss';
 import { IContextualMenuItem } from '../../ContextualMenu';
 
@@ -53,8 +53,7 @@ export class CommandBarCustomizationExample extends React.Component<{}, ISplitDr
     );
   }
 
-  @autobind
-  private _renderSplitButtonMenuItem(item: IContextualMenuItem) {
+  private _renderSplitButtonMenuItem = (item: IContextualMenuItem) => {
     const darkerBG = this.state.isContextMenuShown && styles.darkerBG;
 
     const dropDownButtonClass = css(
@@ -95,14 +94,12 @@ export class CommandBarCustomizationExample extends React.Component<{}, ISplitDr
     );
   }
 
-  @autobind
-  private _onClickChevron(ev: any) {
+  private _onClickChevron = (ev: any): void => {
     ev.stopPropagation();
     this._toggleDropDownMenuShown(ev);
   }
 
-  @autobind
-  private _toggleDropDownMenuShown(ev: any) {
+  private _toggleDropDownMenuShown = (ev: any): void => {
     this.setState({
       isContextMenuShown: !this.state.isContextMenuShown
     });
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
index e3cbc91b48f10..68773429a0d2f 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Customization.Example.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import { DirectionalHint, ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
 import { DefaultButton, IconButton } from 'office-ui-fabric-react/lib/Button';
 import { FocusZoneDirection } from 'office-ui-fabric-react/lib/FocusZone';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import './ContextualMenuExample.scss';
 
 export class ContextualMenuCustomizationExample extends React.Component<{}, {}> {
@@ -187,8 +186,7 @@ export class ContextualMenuCustomizationExample extends React.Component<{}, {}>
     );
   }
 
-  @autobind
-  private _renderCharmMenuItem(item: any, dismissMenu: () => void) {
+  private _renderCharmMenuItem = (item: any, dismissMenu: () => void): JSX.Element => {
     return (
       <IconButton
         iconProps={ { iconName: item.name } }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomizationWithNoWrap.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomizationWithNoWrap.Example.tsx
index 1b9713903eb46..d41009e19f630 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomizationWithNoWrap.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.CustomizationWithNoWrap.Example.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import { DirectionalHint, ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
 import { DefaultButton, IconButton } from 'office-ui-fabric-react/lib/Button';
 import { FocusZoneDirection } from 'office-ui-fabric-react/lib/FocusZone';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import './ContextualMenuExample.scss';
 
 export class ContextualMenuCustomizationWithNoWrapExample extends React.Component<{}, {}> {
@@ -196,8 +195,7 @@ export class ContextualMenuCustomizationWithNoWrapExample extends React.Componen
     );
   }
 
-  @autobind
-  private _renderCharmMenuItem(item: any, dismissMenu: () => void) {
+  private _renderCharmMenuItem = (item: any, dismissMenu: () => void): JSX.Element => {
     return (
       <IconButton
         { ...item }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
index f1c7ce29df70f..648b0603fec52 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Directional.Example.tsx
@@ -3,7 +3,7 @@ import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
 import { DirectionalHint, ContextualMenuItemType } from 'office-ui-fabric-react/lib/ContextualMenu';
 import { Dropdown, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
-import { autobind, getRTL } from 'office-ui-fabric-react/lib/Utilities';
+import { getRTL } from 'office-ui-fabric-react/lib/Utilities';
 import './ContextualMenuExample.scss';
 import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
 const exampleStyles: any = exampleStylesImport;
@@ -133,29 +133,25 @@ export class ContextualMenuDirectionalExample extends React.Component<{}, IConte
     );
   }
 
-  @autobind
-  private _onShowBeakChange(ev: React.FormEvent<HTMLElement>, isVisible: boolean) {
+  private _onShowBeakChange = (ev: React.FormEvent<HTMLElement>, isVisible: boolean): void => {
     this.setState({
       isBeakVisible: isVisible
     });
   }
 
-  @autobind
-  private _onUseRtlHintChange(ev: React.FormEvent<HTMLElement>, isVisible: boolean) {
+  private _onUseRtlHintChange = (ev: React.FormEvent<HTMLElement>, isVisible: boolean): void => {
     this.setState({
       useDirectionalHintForRtl: isVisible
     });
   }
 
-  @autobind
-  private _onDirectionalChanged(option: IDropdownOption) {
+  private _onDirectionalChanged = (option: IDropdownOption): void => {
     this.setState({
       directionalHint: option.key as number
     });
   }
 
-  @autobind
-  private _onDirectionalRtlChanged(option: IDropdownOption) {
+  private _onDirectionalRtlChanged = (option: IDropdownOption): void => {
     this.setState({
       directionalHintForRTL: option.key as number
     });
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx
index 2376899485f21..bd227563e07b3 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Basic.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from '../../../Utilities';
 import { Dropdown, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
 import { DatePicker, DayOfWeek, IDatePickerStrings } from 'office-ui-fabric-react/lib/DatePicker';
 
@@ -126,8 +125,7 @@ export class DatePickerBasicExample extends React.Component<{}, IDatePickerBasic
     );
   }
 
-  @autobind
-  private _onDropdownChanged(option: IDropdownOption) {
+  private _onDropdownChanged = (option: IDropdownOption): void => {
     this.setState({
       firstDayOfWeek: (DayOfWeek as any)[option.key]
     });
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Format.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Format.Example.tsx
index 1750d9fe5a87f..dc5214e4c6e8c 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Format.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Format.Example.tsx
@@ -5,7 +5,6 @@ import {
   DayOfWeek,
   IDatePickerStrings
 } from 'office-ui-fabric-react/lib/DatePicker';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 
 const DayPickerStrings: IDatePickerStrings = {
   months: [
@@ -110,18 +109,15 @@ export class DatePickerFormatExample extends React.Component<
     );
   }
 
-  @autobind
-  private _onSelectDate(date: Date | null | undefined): void {
+  private _onSelectDate = (date: Date | null | undefined): void => {
     this.setState({ value: date });
   }
 
-  @autobind
-  private _onClick(): void {
+  private _onClick = (): void => {
     this.setState({ value: null });
   }
 
-  @autobind
-  private _onFormatDate(date: Date): string {
+  private _onFormatDate = (date: Date): string => {
     return (
       date.getDate() +
       '/' +
@@ -131,8 +127,7 @@ export class DatePickerFormatExample extends React.Component<
     );
   }
 
-  @autobind
-  private _onParseDateFromString(value: string): Date {
+  private _onParseDateFromString = (value: string): Date => {
     const date = this.state.value || new Date();
     const values = (value || '').trim().split('/');
     const day =
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx
index 616074044dece..96c3c405341eb 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.Input.Example.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { DatePicker, DayOfWeek, IDatePickerStrings } from 'office-ui-fabric-react/lib/DatePicker';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 
 const DayPickerStrings: IDatePickerStrings = {
   months: [
@@ -102,13 +101,11 @@ export class DatePickerInputExample extends React.Component<{}, IDatePickerInput
     );
   }
 
-  @autobind
-  private _onSelectDate(date: Date | null | undefined): void {
+  private _onSelectDate = (date: Date | null | undefined): void => {
     this.setState({ value: date });
   }
 
-  @autobind
-  private _onClick(): void {
+  private _onClick = (): void => {
     this.setState({ value: null });
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.WeekNumbers.Example.tsx b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.WeekNumbers.Example.tsx
index 7708fb68cc06c..faf76a96af85f 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.WeekNumbers.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/examples/DatePicker.WeekNumbers.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from '../../../Utilities';
 import { Dropdown, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
 import { DatePicker, DayOfWeek, IDatePickerStrings } from 'office-ui-fabric-react/lib/DatePicker';
 
@@ -119,8 +118,7 @@ export class DatePickerWeekNumbersExample extends React.Component<{}, IDatePicke
     );
   }
 
-  @autobind
-  private _onDropdownChanged(option: IDropdownOption) {
+  private _onDropdownChanged = (option: IDropdownOption) => {
     this.setState({
       firstDayOfWeek: (DayOfWeek as any)[option.key]
     });
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
index 276b11a3d3611..1359126a4b178 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Advanced.Example.tsx
@@ -8,7 +8,6 @@ import {
   DirectionalHint,
   ContextualMenu,
 } from 'office-ui-fabric-react/lib/ContextualMenu';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import {
   CheckboxVisibility,
   ColumnActionsMode,
@@ -164,14 +163,12 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
     }
   }
 
-  @autobind
-  private _onRenderMissingItem(index: number): null {
+  private _onRenderMissingItem = (index: number): null => {
     this._onDataMiss(index as number);
     return null;
   }
 
-  @autobind
-  private _onToggleLazyLoad() {
+  private _onToggleLazyLoad = (): void => {
     let { isLazyLoaded } = this.state;
 
     isLazyLoaded = !isLazyLoaded;
@@ -182,8 +179,7 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
     });
   }
 
-  @autobind
-  private _onToggleResizing() {
+  private _onToggleResizing = (): void => {
     const { items, sortedColumnKey, isSortedDescending } = this.state;
     let { canResizeColumns } = this.state;
 
@@ -195,29 +191,25 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
     });
   }
 
-  @autobind
-  private _onLayoutChanged(ev: React.MouseEvent<HTMLElement>, menuItem: IContextualMenuItem) {
+  private _onLayoutChanged = (ev: React.MouseEvent<HTMLElement>, menuItem: IContextualMenuItem): void => {
     this.setState({
       layoutMode: menuItem.data
     });
   }
 
-  @autobind
-  private _onConstrainModeChanged(ev: React.MouseEvent<HTMLElement>, menuItem: IContextualMenuItem) {
+  private _onConstrainModeChanged = (ev: React.MouseEvent<HTMLElement>, menuItem: IContextualMenuItem): void => {
     this.setState({
       constrainMode: menuItem.data
     });
   }
 
-  @autobind
-  private _onSelectionChanged(ev: React.MouseEvent<HTMLElement>, menuItem: IContextualMenuItem) {
+  private _onSelectionChanged = (ev: React.MouseEvent<HTMLElement>, menuItem: IContextualMenuItem): void => {
     this.setState({
       selectionMode: menuItem.data
     });
   }
 
-  @autobind
-  private _onItemLimitChanged(value: string) {
+  private _onItemLimitChanged = (value: string): void => {
     let newValue = parseInt(value, 10);
     if (isNaN(newValue)) {
       newValue = DEFAULT_ITEM_LIMIT;
@@ -227,7 +219,7 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
     });
   }
 
-  private _getCommandItems(): IContextualMenuItem[] {
+  private _getCommandItems = (): IContextualMenuItem[] => {
     const {
       canResizeColumns,
       checkboxVisibility,
@@ -437,21 +429,19 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
     };
   }
 
-  @autobind
-  private _onItemInvoked(item: any, index: number) {
+  private _onItemInvoked = (item: any, index: number): void => {
     console.log('Item invoked', item, index);
   }
 
-  @autobind
-  private _onItemContextMenu(item: any, index: number, ev: MouseEvent) {
+  private _onItemContextMenu = (item: any, index: number, ev: MouseEvent): boolean => {
     if ((ev.target as HTMLElement).nodeName === 'A') {
       return true;
     }
     console.log('Item context menu invoked', item, index);
+    return false;
   }
 
-  @autobind
-  private _onColumnClick(ev: React.MouseEvent<HTMLElement>, column: IColumn) {
+  private _onColumnClick = (ev: React.MouseEvent<HTMLElement>, column: IColumn) => {
     if (column.columnActionsMode !== ColumnActionsMode.disabled) {
       this.setState({
         contextualMenuProps: this._getContextualMenuProps(ev, column)
@@ -459,8 +449,7 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
     }
   }
 
-  @autobind
-  private _onColumnContextMenu(column: IColumn, ev: React.MouseEvent<HTMLElement>) {
+  private _onColumnContextMenu = (column: IColumn, ev: React.MouseEvent<HTMLElement>) => {
     if (column.columnActionsMode !== ColumnActionsMode.disabled) {
       this.setState({
         contextualMenuProps: this._getContextualMenuProps(ev, column)
@@ -468,15 +457,13 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
     }
   }
 
-  @autobind
-  private _onContextualMenuDismissed() {
+  private _onContextualMenuDismissed = () => {
     this.setState({
       contextualMenuProps: undefined
     });
   }
 
-  @autobind
-  private _onSortColumn(key: string, isSortedDescending: boolean) {
+  private _onSortColumn = (key: string, isSortedDescending: boolean) => {
     const sortedItems = _items.slice(0).sort((a: any, b: any) => (isSortedDescending ? a[key] < b[key] : a[key] > b[key]) ? 1 : -1);
 
     this.setState({
@@ -495,8 +482,7 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
     });
   }
 
-  @autobind
-  private _onGroupByColumn(column: IColumn) {
+  private _onGroupByColumn = (column: IColumn) => {
     const { key, isGrouped } = column;
     const { sortedColumnKey, isSortedDescending, groups, items, columns } = this.state;
 
@@ -578,15 +564,13 @@ export class DetailsListAdvancedExample extends React.Component<{}, IDetailsList
     return leafKey;
   }
 
-  @autobind
-  private _onAddRow() {
+  private _onAddRow = () => {
     this.setState({
       items: createListItems(1).concat(this.state.items)
     });
   }
 
-  @autobind
-  private _onDeleteRow() {
+  private _onDeleteRow = () => {
     this.setState({
       items: this.state.items!.slice(1)
     });
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
index 593a874f99882..5d4ce186686a8 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Basic.Example.tsx
@@ -9,7 +9,6 @@ import {
   IColumn
 } from 'office-ui-fabric-react/lib/DetailsList';
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 
 const _items: any[] = [];
 
@@ -104,8 +103,7 @@ export class DetailsListBasicExample extends React.Component<{}, {
     }
   }
 
-  @autobind
-  private _onChanged(text: any): void {
+  private _onChanged = (text: any): void => {
     this.setState({ items: text ? _items.filter(i => i.name.toLowerCase().indexOf(text) > -1) : _items });
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Compact.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Compact.Example.tsx
index b47e35d658b9a..a35388a1e229b 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Compact.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Compact.Example.tsx
@@ -8,7 +8,6 @@ import {
   Selection
 } from 'office-ui-fabric-react/lib/DetailsList';
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 
 const _items: {
   key: number,
@@ -104,8 +103,7 @@ export class DetailsListCompactExample extends React.Component<{}, {
     }
   }
 
-  @autobind
-  private _onChanged(text: any): void {
+  private _onChanged = (text: any): void => {
     this.setState({ items: text ? _items.filter(i => i.name.toLowerCase().indexOf(text) > -1) : _items });
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
index 0589376a17908..8eb95497aa6c0 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomColumns.Example.tsx
@@ -2,7 +2,6 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import { createListItems } from '@uifabric/example-app-base';
-import { autobind } from '../../../Utilities';
 import { Link } from 'office-ui-fabric-react/lib/Link';
 import { Image, ImageFit } from 'office-ui-fabric-react/lib/Image';
 import {
@@ -47,8 +46,7 @@ export class DetailsListCustomColumnsExample extends React.Component<{}, IDetail
     );
   }
 
-  @autobind
-  private _onColumnClick(event: React.MouseEvent<HTMLElement>, column: IColumn) {
+  private _onColumnClick = (event: React.MouseEvent<HTMLElement>, column: IColumn): void => {
     const { columns } = this.state;
     let { sortedItems } = this.state;
     let isSortedDescending = column.isSortedDescending;
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomRows.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomRows.Example.tsx
index bd5e31de70b88..c1481847de2ff 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomRows.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.CustomRows.Example.tsx
@@ -2,7 +2,7 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import { DetailsList, DetailsRow, IDetailsRowProps, IDetailsRowCheckProps } from 'office-ui-fabric-react/lib/DetailsList';
-import { autobind, css } from 'office-ui-fabric-react/lib/Utilities';
+import { css } from 'office-ui-fabric-react/lib/Utilities';
 import { createListItems } from '@uifabric/example-app-base';
 import './DetailsListExample.scss';
 
@@ -26,19 +26,17 @@ export class DetailsListCustomRowsExample extends React.Component {
     );
   }
 
-  @autobind
-  private _onRenderRow(props: IDetailsRowProps) {
+  private _onRenderRow = (props: IDetailsRowProps): JSX.Element => {
     return (
       <DetailsRow
-        { ...props}
+        { ...props }
         onRenderCheck={ this._onRenderCheck }
         aria-busy={ false }
       />
     );
   }
 
-  @autobind
-  private _onRenderCheck(props: IDetailsRowCheckProps) {
+  private _onRenderCheck = (props: IDetailsRowCheckProps): JSX.Element => {
     return (
       <div
         className={ css(
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
index 3be99fc94d1d3..472e8ca474fef 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Documents.Example.tsx
@@ -10,7 +10,6 @@ import {
   SelectionMode,
   IColumn
 } from 'office-ui-fabric-react/lib/DetailsList';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
 import { lorem } from '@uifabric/example-app-base';
 import './DetailsListExample.scss';
@@ -252,18 +251,15 @@ export class DetailsListDocumentsExample extends React.Component<any, IDetailsLi
     }
   }
 
-  @autobind
-  private _onChangeCompactMode(checked: boolean): void {
+  private _onChangeCompactMode = (checked: boolean): void => {
     this.setState({ isCompactMode: checked });
   }
 
-  @autobind
-  private _onChangeModalSelection(checked: boolean): void {
+  private _onChangeModalSelection = (checked: boolean): void => {
     this.setState({ isModalSelection: checked });
   }
 
-  @autobind
-  private _onChangeText(text: any): void {
+  private _onChangeText = (text: any): void => {
     this.setState({ items: text ? _items.filter(i => i.name.toLowerCase().indexOf(text) > -1) : _items });
   }
 
@@ -309,8 +305,7 @@ export class DetailsListDocumentsExample extends React.Component<any, IDetailsLi
     }
   }
 
-  @autobind
-  private _onColumnClick(ev: React.MouseEvent<HTMLElement>, column: IColumn) {
+  private _onColumnClick = (ev: React.MouseEvent<HTMLElement>, column: IColumn): void => {
     const { columns, items } = this.state;
     let newItems: IDocument[] = items.slice();
     const newColumns: IColumn[] = columns.slice();
@@ -333,8 +328,7 @@ export class DetailsListDocumentsExample extends React.Component<any, IDetailsLi
     });
   }
 
-  @autobind
-  private _sortItems(items: IDocument[], sortBy: string, descending = false): IDocument[] {
+  private _sortItems = (items: IDocument[], sortBy: string, descending = false): IDocument[] => {
     if (descending) {
       return items.sort((a: IDocument, b: IDocument) => {
         if (a[sortBy] < b[sortBy]) {
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
index 0917f5b4ceb7d..1c8be6f3723d2 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.Grouped.Example.tsx
@@ -3,7 +3,6 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import {
   BaseComponent,
-  autobind,
   createRef
 } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
@@ -113,8 +112,7 @@ export class DetailsListGroupedExample extends BaseComponent<{}, {
     );
   }
 
-  @autobind
-  private _addItem() {
+  private _addItem = (): void => {
     const items = this.state.items;
 
     this.setState({
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
index 31c2d894bf518..c1b19c2ef52e2 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/examples/DetailsList.NavigatingFocus.Example.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { DetailsList, IColumn } from 'office-ui-fabric-react/lib/DetailsList';
 import { Link } from 'office-ui-fabric-react/lib/Link';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import './DetailsListExample.scss';
 
 export interface IDetailsListNavigatingFocusExampleState {
@@ -46,8 +45,7 @@ export class DetailsListNavigatingFocusExample extends React.Component<{}, IDeta
     );
   }
 
-  @autobind
-  private _navigate(name: string): () => void {
+  private _navigate = (name: string): () => void => {
     return (): void => {
       this.setState({
         items: generateItems(name + '/'),
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
index 4dad0e5867f87..bfd77580fa4d5 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Basic.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from '../../../Utilities';
 import { Dialog, DialogType, DialogFooter } from 'office-ui-fabric-react/lib/Dialog';
 import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import './Dialog.Basic.Example.scss';
@@ -52,13 +51,11 @@ export class DialogBasicExample extends React.Component<{}, {
     );
   }
 
-  @autobind
-  private _showDialog() {
+  private _showDialog = (): void => {
     this.setState({ hideDialog: false });
   }
 
-  @autobind
-  private _closeDialog() {
+  private _closeDialog = (): void => {
     this.setState({ hideDialog: true });
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx
index 1fbcb41fd0552..7bad603a4d346 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.Blocking.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from '../../../Utilities';
 import { Dialog, DialogType, DialogFooter } from 'office-ui-fabric-react/lib/Dialog';
 import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
 
@@ -44,13 +43,11 @@ export class DialogBlockingExample extends React.Component<{}, {
     );
   }
 
-  @autobind
-  private _showDialog() {
+  private _showDialog = (): void => {
     this.setState({ hideDialog: false });
   }
 
-  @autobind
-  private _closeDialog() {
+  private _closeDialog = (): void => {
     this.setState({ hideDialog: true });
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.LargeHeader.Example.tsx b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.LargeHeader.Example.tsx
index f9981e84b0bf9..04a49a2107f1f 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.LargeHeader.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dialog/examples/Dialog.LargeHeader.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from '../../../Utilities';
 import { Dialog, DialogType, DialogFooter } from 'office-ui-fabric-react/lib/Dialog';
 import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { ChoiceGroup } from 'office-ui-fabric-react/lib/ChoiceGroup';
@@ -64,13 +63,11 @@ export class DialogLargeHeaderExample extends React.Component<{}, {
     );
   }
 
-  @autobind
-  private _showDialog() {
+  private _showDialog = (): void => {
     this.setState({ hideDialog: false });
   }
 
-  @autobind
-  private _closeDialog() {
+  private _closeDialog = (): void => {
     this.setState({ hideDialog: true });
   }
 
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
index f60f4c7eaee3f..100ec54223750 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/examples/Dropdown.Basic.Example.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { PrimaryButton } from 'office-ui-fabric-react/lib/Button';
 import { Dropdown, IDropdown, DropdownMenuItemType, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
-import { autobind, BaseComponent, createRef } from '../../../Utilities';
+import { BaseComponent, createRef } from '../../../Utilities';
 import './Dropdown.Basic.Example.scss';
 
 export class DropdownBasicExample extends BaseComponent<{}, {
@@ -163,14 +163,12 @@ export class DropdownBasicExample extends BaseComponent<{}, {
     );
   }
 
-  @autobind
-  public changeState(item: IDropdownOption) {
+  public changeState = (item: IDropdownOption): void => {
     console.log('here is the things updating...' + item.key + ' ' + item.text + ' ' + item.selected);
     this.setState({ selectedItem: item });
   }
 
-  @autobind
-  public onChangeMultiSelect(item: IDropdownOption) {
+  public onChangeMultiSelect = (item: IDropdownOption): void => {
     const updatedSelectedItem = this.state.selectedItems ? this.copyArray(this.state.selectedItems) : [];
     if (item.selected) {
       // add the option if it's checked
@@ -187,7 +185,7 @@ export class DropdownBasicExample extends BaseComponent<{}, {
     });
   }
 
-  public copyArray(array: any[]): any[] {
+  public copyArray = (array: any[]): any[] => {
     const newArray: any[] = [];
     for (let i = 0; i < array.length; i++) {
       newArray[i] = array[i];
@@ -195,8 +193,7 @@ export class DropdownBasicExample extends BaseComponent<{}, {
     return newArray;
   }
 
-  @autobind
-  private _onSetFocusButtonClicked() {
+  private _onSetFocusButtonClicked = (): void => {
     if (this._basicDropdown.value) {
       this._basicDropdown.value.focus(true);
     }
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
index 553cdb6180bf4..691190302c099 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Basic.Example.tsx
@@ -4,7 +4,6 @@ import { Dropdown, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
 import { Facepile, IFacepilePersona, IFacepileProps } from 'office-ui-fabric-react/lib/Facepile';
 import { PersonaSize } from 'office-ui-fabric-react/lib/Persona';
 import { Slider } from 'office-ui-fabric-react/lib/Slider';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { facepilePersonas } from './FacepileExampleData';
 import './Facepile.Examples.scss';
 import * as exampleStylesImport from '../../../common/_exampleStyles.scss';
@@ -80,24 +79,21 @@ export class FacepileBasicExample extends React.Component<{}, IFacepileBasicExam
     );
   }
 
-  @autobind
-  private _onChangeFadeIn(ev: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean): void {
+  private _onChangeFadeIn = (ev: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean): void => {
     this.setState((prevState: IFacepileBasicExampleState): IFacepileBasicExampleState => {
       prevState.imagesFadeIn = checked!;
       return prevState;
     });
   }
 
-  @autobind
-  private _onChangePersonaNumber(value: number): void {
+  private _onChangePersonaNumber = (value: number): void => {
     this.setState((prevState: IFacepileBasicExampleState): IFacepileBasicExampleState => {
       prevState.numberOfFaces = value;
       return prevState;
     });
   }
 
-  @autobind
-  private _onChangePersonaSize(value: IDropdownOption): void {
+  private _onChangePersonaSize = (value: IDropdownOption): void => {
     this.setState((prevState: IFacepileBasicExampleState): IFacepileBasicExampleState => {
       prevState.personaSize = value.key as PersonaSize;
       return prevState;
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx
index 7275e2cc966bf..4b5ee203e29e4 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Facepile/examples/Facepile.Overflow.Example.tsx
@@ -6,7 +6,6 @@ import {
 } from 'office-ui-fabric-react/lib/Facepile';
 import { Dropdown, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
 import { Slider } from 'office-ui-fabric-react/lib/Slider';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { facepilePersonas } from './FacepileExampleData';
 import './Facepile.Examples.scss';
 
@@ -45,7 +44,7 @@ export class FacepileOverflowExample extends React.Component<{}, IFacepileOverfl
 
     return (
       <div className={ 'ms-FacepileExample' }>
-        <Facepile {...facepileProps} />
+        <Facepile { ...facepileProps } />
         <div className={ 'control' }>
           <Slider
             label='Number of Personas:'
@@ -75,16 +74,14 @@ export class FacepileOverflowExample extends React.Component<{}, IFacepileOverfl
     );
   }
 
-  @autobind
-  private _onChangePersonaNumber(value: number): void {
+  private _onChangePersonaNumber = (value: number): void => {
     this.setState((prevState: IFacepileOverflowExampleState): IFacepileOverflowExampleState => {
       prevState.displayedPersonas = value;
       return prevState;
     });
   }
 
-  @autobind
-  private _onChangeType(value: IDropdownOption): void {
+  private _onChangeType = (value: IDropdownOption): void => {
     this.setState((prevState: IFacepileOverflowExampleState): IFacepileOverflowExampleState => {
       prevState.overflowButtonType = value.key as OverflowButtonType;
       return prevState;
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
index b4407acb7c392..c235864294499 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Click.Example.tsx
@@ -2,7 +2,6 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
-import { autobind } from '../../../Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { FocusTrapZone } from 'office-ui-fabric-react/lib/FocusTrapZone';
 import { Link } from 'office-ui-fabric-react/lib/Link';
@@ -85,29 +84,25 @@ export default class BoxNoClickExample extends React.Component<React.HTMLAttribu
     );
   }
 
-  @autobind
-  private _onButtonClickHandler() {
+  private _onButtonClickHandler = (): void => {
     this.setState({
       isToggled: true
     });
   }
 
-  @autobind
-  private _onExitButtonClickHandler() {
+  private _onExitButtonClickHandler = (): void => {
     this.setState({
       isToggled: false
     });
   }
 
-  @autobind
-  private _onFocusTrapZoneToggleChanged(isToggled: boolean) {
+  private _onFocusTrapZoneToggleChanged = (isToggled: boolean): void => {
     this.setState({
       isToggled: isToggled
     }, () => this._toggle.focus());
   }
 
-  @autobind
-  private _setRef(toggle: IToggle): void {
+  private _setRef = (toggle: IToggle): void => {
     this._toggle = toggle;
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
index 0b6f3a9430ea9..6f3531818f087 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.Example.tsx
@@ -2,7 +2,6 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
-import { autobind } from '../../../Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { FocusTrapZone } from 'office-ui-fabric-react/lib/FocusTrapZone';
 import { Link } from 'office-ui-fabric-react/lib/Link';
@@ -85,29 +84,25 @@ export default class BoxExample extends React.Component<React.HTMLAttributes<HTM
     );
   }
 
-  @autobind
-  private _onButtonClickHandler() {
+  private _onButtonClickHandler = (): void => {
     this.setState({
       isChecked: true
     });
   }
 
-  @autobind
-  private _onExitButtonClickHandler() {
+  private _onExitButtonClickHandler = (): void => {
     this.setState({
       isChecked: false
     });
   }
 
-  @autobind
-  private _onFocusTrapZoneToggleChanged(isChecked: boolean) {
+  private _onFocusTrapZoneToggleChanged = (isChecked: boolean): void => {
     this.setState({
       isChecked: isChecked
     }, () => this._toggle.focus());
   }
 
-  @autobind
-  private _setRef(toggle: IToggle): void {
+  private _setRef = (toggle: IToggle): void => {
     this._toggle = toggle;
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
index b627b9fac3908..0eee480b8cb7a 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Box.FocusOnCustomElement.Example.tsx
@@ -2,7 +2,6 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
-import { autobind } from '../../../Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { FocusTrapZone } from 'office-ui-fabric-react/lib/FocusTrapZone';
 import { Link } from 'office-ui-fabric-react/lib/Link';
@@ -85,29 +84,25 @@ export default class BoxExample extends React.Component<React.HTMLAttributes<HTM
     );
   }
 
-  @autobind
-  private _onButtonClickHandler() {
+  private _onButtonClickHandler = (): void => {
     this.setState({
       isChecked: true
     });
   }
 
-  @autobind
-  private _onExitButtonClickHandler() {
+  private _onExitButtonClickHandler = (): void => {
     this.setState({
       isChecked: false
     });
   }
 
-  @autobind
-  private _onFocusTrapZoneToggleChanged(isChecked: boolean) {
+  private _onFocusTrapZoneToggleChanged = (isChecked: boolean): void => {
     this.setState({
       isChecked: isChecked
     }, () => this._toggle.focus());
   }
 
-  @autobind
-  private _setRef(toggle: IToggle): void {
+  private _setRef = (toggle: IToggle): void => {
     this._toggle = toggle;
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx
index efa8515f81155..4c726df79e49e 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/examples/FocusTrapZone.Nested.Example.tsx
@@ -7,7 +7,6 @@ import * as React from 'react';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { FocusTrapZone } from 'office-ui-fabric-react/lib/FocusTrapZone';
 import { Toggle } from 'office-ui-fabric-react/lib/Toggle';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import './FocusTrapZone.Box.Example.scss';
 
 interface IFocusTrapComponentProps {
@@ -53,13 +52,11 @@ class FocusTrapComponent extends React.Component<IFocusTrapComponentProps, IFocu
     return contents;
   }
 
-  @autobind
-  private _onStringButtonClicked() {
+  private _onStringButtonClicked = (): void => {
     console.log(this.props.name);
   }
 
-  @autobind
-  private _onFocusTrapZoneToggleChanged(isChecked: boolean) {
+  private _onFocusTrapZoneToggleChanged = (isChecked: boolean): void => {
     this.props.setIsActive(this.props.name, isChecked);
   }
 
@@ -100,14 +97,12 @@ export default class FocusTrapZoneNestedExample extends React.Component<{}, IFoc
     );
   }
 
-  @autobind
-  private _setIsActive(name: string, isActive: boolean): void {
+  private _setIsActive = (name: string, isActive: boolean): void => {
     this.state.stateMap[name] = isActive;
     this.forceUpdate();
   }
 
-  @autobind
-  private _randomize(): void {
+  private _randomize = (): void => {
     NAMES.forEach((name) => {
       this.state.stateMap[name] = Math.random() >= .5;
     });
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx
index 3e539dc9a96e7..2968e13027b82 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Basic.Example.tsx
@@ -7,7 +7,6 @@ import {
   IExpandingCardProps
 } from 'office-ui-fabric-react/lib/HoverCard';
 import { DetailsList, buildColumns, IColumn } from 'office-ui-fabric-react/lib/DetailsList';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { createListItems } from '@uifabric/example-app-base';
 import './HoverCard.Example.scss';
 
@@ -47,8 +46,7 @@ export class HoverCardBasicExample extends BaseComponent<{}, IHoverCardExampleSt
     );
   }
 
-  @autobind
-  private _onRenderItemColumn(item: any, index: number, column: IColumn) {
+  private _onRenderItemColumn = (item: any, index: number, column: IColumn): JSX.Element => {
     const expandingCardProps: IExpandingCardProps = {
       onRenderCompactCard: this._onRenderCompactCard,
       onRenderExpandedCard: this._onRenderExpandedCard,
@@ -68,8 +66,7 @@ export class HoverCardBasicExample extends BaseComponent<{}, IHoverCardExampleSt
     return item[column.key];
   }
 
-  @autobind
-  private _onRenderCompactCard(item: any): JSX.Element {
+  private _onRenderCompactCard = (item: any): JSX.Element => {
     return (
       <div className='hoverCardExample-compactCard'>
         <a target='_blank' href={ `http://wikipedia.org/wiki/${item.location}` }>
@@ -79,8 +76,7 @@ export class HoverCardBasicExample extends BaseComponent<{}, IHoverCardExampleSt
     );
   }
 
-  @autobind
-  private _onRenderExpandedCard(item: any): JSX.Element {
+  private _onRenderExpandedCard = (item: any): JSX.Element => {
     const { items, columns } = this.state;
     return (
       <div className='hoverCardExample-expandedCard'>
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
index 920820c64e102..671e238b8d6c9 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/examples/HoverCard.Target.Example.tsx
@@ -9,7 +9,6 @@ import {
 } from 'office-ui-fabric-react/lib/HoverCard';
 import { DetailsList, buildColumns, IColumn } from 'office-ui-fabric-react/lib/DetailsList';
 import { DirectionalHint } from 'office-ui-fabric-react/lib/common/DirectionalHint';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { createListItems } from '@uifabric/example-app-base';
 import './HoverCard.Example.scss';
 
@@ -95,8 +94,7 @@ export class HoverCardTargetExample extends BaseComponent<{}, IHoverCardExampleS
     );
   }
 
-  @autobind
-  private _onRenderItemColumn(item: any, index: number, column: IColumn) {
+  private _onRenderItemColumn = (item: any, index: number, column: IColumn): JSX.Element => {
     const expandingCardProps: IExpandingCardProps = {
       onRenderCompactCard: this._onRenderCompactCard,
       onRenderExpandedCard: this._onRenderExpandedCard,
@@ -119,8 +117,7 @@ export class HoverCardTargetExample extends BaseComponent<{}, IHoverCardExampleS
     return item[column.key];
   }
 
-  @autobind
-  private _onRenderCompactCard(item: any): JSX.Element {
+  private _onRenderCompactCard = (item: any): JSX.Element => {
     return (
       <div className='hoverCardExample-compactCard'>
         <a target='_blank' href={ `http://wikipedia.org/wiki/${item.location}` }>
@@ -130,8 +127,7 @@ export class HoverCardTargetExample extends BaseComponent<{}, IHoverCardExampleS
     );
   }
 
-  @autobind
-  private _onRenderExpandedCard(item: any): JSX.Element {
+  private _onRenderExpandedCard = (item: any): JSX.Element => {
     const { items, columns } = this.state;
     return (
       <div className='hoverCardExample-expandedCard'>
diff --git a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
index 3a0c18741663c..535c03f86259a 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Basic.Example.tsx
@@ -2,7 +2,7 @@ import * as React from 'react'; // tslint:disable-line:no-unused-variable
 import * as PropTypes from 'prop-types';
 import './Layer.Example.scss';
 import '../../../common/_exampleStyles.scss';
-import { autobind, BaseComponent } from '../../../Utilities';
+import { BaseComponent } from '../../../Utilities';
 import { Checkbox } from '../../../Checkbox';
 import { Layer } from '../Layer';
 import { AnimationClassNames } from '../../../Styling';
@@ -87,7 +87,6 @@ export class LayerBasicExample extends BaseComponent<{}, {
     );
   }
 
-  @autobind
   private _onChange(ev: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean): void {
     this.setState({ showLayer: checked });
   }
diff --git a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
index e166d97068141..3844df5772229 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Layer/examples/Layer.Hosted.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from '../../../Utilities';
 import { Checkbox } from '../../../Checkbox';
 import { Layer } from '../Layer';
 import { LayerHost } from '../LayerHost';
@@ -98,18 +97,15 @@ export class LayerHostedExample extends React.Component<{}, {
     };
   }
 
-  @autobind
-  private _onChangeCheckbox(ev: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean): void {
+  private _onChangeCheckbox = (ev: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean): void => {
     this.setState({ showLayer: checked });
   }
 
-  @autobind
-  private _onChangeCheckboxNoId(ev: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean): void {
+  private _onChangeCheckboxNoId = (ev: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean): void => {
     this.setState({ showLayerNoId: checked });
   }
 
-  @autobind
-  private _onChangeToggle(checked: boolean): void {
+  private _onChangeToggle = (checked: boolean): void => {
     this.setState({ showHost: checked });
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx b/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx
index 2b9b9f5bac47a..0d735d05bca59 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Grid.Example.tsx
@@ -3,7 +3,6 @@ import { FocusZone } from 'office-ui-fabric-react/lib/FocusZone';
 import { List } from 'office-ui-fabric-react/lib/List';
 import './List.Grid.Example.scss';
 import { IRectangle } from '../../../Utilities';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 
 export interface IListGridExampleProps {
   items: any[];
@@ -53,8 +52,7 @@ export class ListGridExample extends React.Component<IListGridExampleProps> {
     return this._rowHeight * ROWS_PER_PAGE;
   }
 
-  @autobind
-  private _onRenderCell(item: any, index: number | undefined): JSX.Element {
+  private _onRenderCell = (item: any, index: number | undefined): JSX.Element => {
     return (
       <div
         className='ms-ListGridExample-tile'
diff --git a/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx b/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx
index aabde8d0484f1..4aba32df140f0 100644
--- a/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/List/examples/List.Scrolling.Example.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import {
-  css,
-  autobind
+  css
 } from 'office-ui-fabric-react/lib/Utilities';
 import {
   FocusZone,
@@ -77,8 +76,7 @@ export class ListScrollingExample extends React.Component<IListScrollingExampleP
     return h;
   }
 
-  @autobind
-  private _onChangeText(value: any): void {
+  private _onChangeText = (value: any): void => {
     this._scroll(parseInt(value, 10) || 0);
   }
 
@@ -114,8 +112,7 @@ export class ListScrollingExample extends React.Component<IListScrollingExampleP
     });
   }
 
-  @autobind
-  private _resolveList(list: List) {
+  private _resolveList = (list: List): void => {
     this._list = list;
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
index 562246634a092..4396c07dabcf4 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/examples/MarqueeSelection.Basic.Example.tsx
@@ -3,7 +3,6 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
 import {
-  autobind,
   css,
   createArray
 } from 'office-ui-fabric-react/lib/Utilities';
@@ -97,8 +96,7 @@ export class MarqueeSelectionBasicExample extends React.Component<{}, IMarqueeSe
     };
   }
 
-  @autobind
-  private _onChange(ev: React.FormEvent<HTMLElement | HTMLInputElement>, isMarqueeEnabled: boolean | undefined): void {
+  private _onChange = (ev: React.FormEvent<HTMLElement | HTMLInputElement>, isMarqueeEnabled: boolean | undefined): void => {
     this.setState({ isMarqueeEnabled: isMarqueeEnabled! });
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Modal/examples/Modal.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Modal/examples/Modal.Basic.Example.tsx
index 518747a0028d7..89520fea9692b 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/examples/Modal.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Modal/examples/Modal.Basic.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from '../../../Utilities';
 import { Modal } from 'office-ui-fabric-react/lib/Modal';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import './Modal.Basic.Example.scss';
@@ -44,13 +43,11 @@ export class ModalBasicExample extends React.Component<{}, {
     );
   }
 
-  @autobind
-  private _showModal() {
+  private _showModal = (): void => {
     this.setState({ showModal: true });
   }
 
-  @autobind
-  private _closeModal() {
+  private _closeModal = (): void => {
     this.setState({ showModal: false });
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Dark.Example.tsx b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Dark.Example.tsx
index 5e232b15d8f3c..cba3b6f29748b 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Dark.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Dark.Example.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import {
-  autobind,
   IStyleFunction,
   classNamesFunction
 } from '../../../Utilities';
@@ -48,13 +47,11 @@ export class OverlayDarkExample extends React.Component<{}, {
     );
   }
 
-  @autobind
-  private _setVisibilityFalse(): void {
+  private _setVisibilityFalse = (): void => {
     this.setState({ isOverlayVisible: false });
   }
 
-  @autobind
-  private _toggleOverlay(): void {
+  private _toggleOverlay = (): void => {
     this.setState({ isOverlayVisible: !this.state.isOverlayVisible });
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Light.Example.tsx b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Light.Example.tsx
index b563f5cba3af6..f44d9952d98f1 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Light.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Overlay/examples/Overlay.Light.Example.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import {
-  autobind,
   IStyleFunction,
   classNamesFunction
 } from '../../../Utilities';
@@ -45,13 +44,11 @@ export class OverlayLightExample extends React.Component<{}, {
     );
   }
 
-  @autobind
-  private _setVisibilityFalse(): void {
+  private _setVisibilityFalse = (): void => {
     this.setState({ isOverlayVisible: false });
   }
 
-  @autobind
-  private _toggleOverlay(): void {
+  private _toggleOverlay = (): void => {
     this.setState({ isOverlayVisible: !this.state.isOverlayVisible });
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Custom.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Custom.Example.tsx
index 11134b820cde5..8a71586012434 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Custom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Custom.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from '../../../Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
@@ -35,13 +34,11 @@ export class PanelCustomExample extends React.Component<{}, {
     );
   }
 
-  @autobind
-  private _showPanel() {
+  private _showPanel = (): void => {
     this.setState({ showPanel: true });
   }
 
-  @autobind
-  private _closePanel() {
+  private _closePanel = (): void => {
     this.setState({ showPanel: false });
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Footer.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Footer.Example.tsx
index bd23e00a20d59..ebae074445ab2 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Footer.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Footer.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
@@ -39,8 +38,7 @@ export class PanelFooterExample extends React.Component<{}, {
     this.setState({ showPanel: false });
   }
 
-  @autobind
-  private _onRenderFooterContent(): JSX.Element {
+  private _onRenderFooterContent = (): JSX.Element => {
     return (
       <div>
         <PrimaryButton
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.HiddenOnDismiss.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.HiddenOnDismiss.Example.tsx
index 6302196dd1889..e9f81fc3b292c 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.HiddenOnDismiss.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.HiddenOnDismiss.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel } from 'office-ui-fabric-react/lib/Panel';
 
@@ -32,13 +31,11 @@ export class PanelHiddenOnDismissExample extends React.Component<{}, {
     );
   }
 
-  @autobind
-  private _showPanel(): void {
+  private _showPanel = (): void => {
     this.setState({ showPanel: true });
   }
 
-  @autobind
-  private _hidePanel(): void {
+  private _hidePanel = (): void => {
     this.setState({ showPanel: false });
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LargeFixed.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LargeFixed.Example.tsx
index a4029f3ace070..afa1b898d6f7f 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LargeFixed.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LargeFixed.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from '../../../Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
@@ -34,13 +33,11 @@ export class PanelLargeFixedExample extends React.Component<{}, {
     );
   }
 
-  @autobind
-  private _showPanel() {
+  private _showPanel = (): void => {
     this.setState({ showPanel: true });
   }
 
-  @autobind
-  private _closePanel() {
+  private _closePanel = (): void => {
     this.setState({ showPanel: false });
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismiss.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismiss.Example.tsx
index cb7279fa95dee..2c23cb51c7162 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismiss.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismiss.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel } from 'office-ui-fabric-react/lib/Panel';
 
@@ -32,13 +31,11 @@ export class PanelLightDismissExample extends React.Component<{}, {
     );
   }
 
-  @autobind
-  private _showPanel(): void {
+  private _showPanel = (): void => {
     this.setState({ showPanel: true });
   }
 
-  @autobind
-  private _hidePanel(): void {
+  private _hidePanel = (): void => {
     this.setState({ showPanel: false });
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismissCustom.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismissCustom.Example.tsx
index c0782acbc4ce1..0ecb89095af43 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismissCustom.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.LightDismissCustom.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { Dialog, DialogType, DialogFooter } from 'office-ui-fabric-react/lib/Dialog';
 import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel } from 'office-ui-fabric-react/lib/Panel';
@@ -55,28 +54,23 @@ export class PanelLightDismissCustomExample extends React.Component<{}, {
     );
   }
 
-  @autobind
-  private _showPanel(): void {
+  private _showPanel = (): void => {
     this.setState({ showPanel: true });
   }
 
-  @autobind
-  private _hidePanel(): void {
+  private _hidePanel = (): void => {
     this.setState({ showPanel: false });
   }
 
-  @autobind
-  private _showDialog() {
+  private _showDialog = (): void => {
     this.setState({ hideDialog: false });
   }
 
-  @autobind
-  private _closeDialog() {
+  private _closeDialog = (): void => {
     this.setState({ hideDialog: true });
   }
 
-  @autobind
-  private _closeDialogAndHidePanel() {
+  private _closeDialogAndHidePanel = (): void => {
     this._hidePanel();
     this._closeDialog();
   }
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Medium.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Medium.Example.tsx
index 0e3eb9b6e64e9..68c5573a2ca41 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Medium.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.Medium.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
@@ -32,8 +31,7 @@ export class PanelMediumExample extends React.Component<{}, {
     );
   }
 
-  @autobind
-  private _setShowPanel(showPanel: boolean): () => void {
+  private _setShowPanel = (showPanel: boolean): () => void => {
     return (): void => {
       this.setState({ showPanel });
     };
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.NonModal.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.NonModal.Example.tsx
index b9ed464d5b1c6..23fa0bec46f29 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.NonModal.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.NonModal.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
 
@@ -33,8 +32,7 @@ export class PanelNonModalExample extends React.Component<{}, {
     );
   }
 
-  @autobind
-  private _setShowPanel(showPanel: boolean): () => void {
+  private _setShowPanel = (showPanel: boolean): () => void => {
     return (): void => {
       this.setState({ showPanel });
     };
diff --git a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallRight.Example.tsx b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallRight.Example.tsx
index 0f0edec132091..c51e9dbacd31e 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallRight.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Panel/examples/Panel.SmallRight.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { PrimaryButton, DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { ChoiceGroup } from 'office-ui-fabric-react/lib/ChoiceGroup';
 import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
@@ -62,13 +61,11 @@ export class PanelSmallRightExample extends React.Component<{}, {
     );
   }
 
-  @autobind
-  private _onClosePanel(): void {
+  private _onClosePanel = (): void => {
     this.setState({ showPanel: false });
   }
 
-  @autobind
-  private _onRenderFooterContent(): JSX.Element {
+  private _onRenderFooterContent = (): JSX.Element => {
     return (
       <div>
         <PrimaryButton
@@ -86,8 +83,7 @@ export class PanelSmallRightExample extends React.Component<{}, {
     );
   }
 
-  @autobind
-  private _onShowPanel(): void {
+  private _onShowPanel = (): void => {
     this.setState({ showPanel: true });
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
index 6fa37608e63e8..b7cdd24779170 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.Basic.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import {
   Persona,
   PersonaSize,
@@ -111,8 +110,7 @@ export class PersonaBasicExample extends React.Component<{}, {
     );
   }
 
-  @autobind
-  private _onChange(ev: React.FormEvent<HTMLElement | HTMLInputElement> | undefined, checked: boolean | undefined): void {
+  private _onChange = (ev: React.FormEvent<HTMLElement | HTMLInputElement> | undefined, checked: boolean | undefined): void => {
     this.setState({ renderPersonaDetails: checked });
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomCoinRender.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomCoinRender.Example.tsx
index ce4f245383207..9aaf14c66b3ed 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomCoinRender.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomCoinRender.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import {
   IPersonaProps,
   Persona,
@@ -37,8 +36,7 @@ export class PersonaCustomCoinRenderExample extends React.Component {
     );
   }
 
-  @autobind
-  private _onRenderCoin(props: IPersonaProps): JSX.Element {
+  private _onRenderCoin = (props: IPersonaProps): JSX.Element => {
     const {
       coinSize,
       imageUrl,
diff --git a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx
index b99926597cf89..dacf8cc58ee08 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Persona/examples/Persona.CustomRender.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import {
   IPersonaProps,
   Persona,
@@ -37,8 +36,7 @@ export class PersonaCustomRenderExample extends React.Component {
     );
   }
 
-  @autobind
-  private _onRenderSecondaryText(props: IPersonaProps): JSX.Element {
+  private _onRenderSecondaryText = (props: IPersonaProps): JSX.Element => {
     return (
       <div>
         <Icon iconName={ 'Suitcase' } className={ 'ms-JobIconExample' } />
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.Separate.Example.tsx b/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.Separate.Example.tsx
index dca3616205a32..7a8bdbf4b0c1f 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.Separate.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Pivot/examples/Pivot.Separate.Example.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import { Pivot, PivotItem } from 'office-ui-fabric-react/lib/Pivot';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 
 export class PivotSeparateExample extends React.Component<any, any> {
   public state = { selectedKey: 'rectangleRed' };
@@ -32,15 +31,13 @@ export class PivotSeparateExample extends React.Component<any, any> {
     );
   }
 
-  @autobind
-  private _handleLinkClick(item: PivotItem): void {
+  private _handleLinkClick = (item: PivotItem): void => {
     this.setState({
       selectedKey: item.props.itemKey
     });
   }
 
-  @autobind
-  private _getTabId(itemKey: string): string {
+  private _getTabId = (itemKey: string): string => {
     return `ShapeColorPivot_${itemKey}`;
   }
 }
diff --git a/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx
index 7c433b38283a4..495322f8fe22c 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Rating/examples/Rating.Basic.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import {
   Rating,
   RatingSize
@@ -119,29 +118,25 @@ export class RatingBasicExample extends React.Component<{}, {
     );
   }
 
-  @autobind
-  private _onLargeStarChanged(rating: number) {
+  private _onLargeStarChanged = (rating: number): void => {
     this.setState({
       largeStarRating: rating
     });
   }
 
-  @autobind
-  private _onSmallStarChanged(rating: number) {
+  private _onSmallStarChanged = (rating: number): void => {
     this.setState({
       smallStarRating: rating
     });
   }
 
-  @autobind
-  private _onTenStarChanged(rating: number) {
+  private _onTenStarChanged = (rating: number): void => {
     this.setState({
       tenStarRating: rating
     });
   }
 
-  @autobind
-  private _onThemedStarChanged(rating: number) {
+  private _onThemedStarChanged = (rating: number): void => {
     this.setState({
       themedStarRating: rating
     });
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
index 196ab527f905e..4fff978345fb7 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/examples/ResizeGroup.OverflowSet.Example.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { BaseComponent, autobind } from 'office-ui-fabric-react/lib/Utilities';
+import { BaseComponent } from 'office-ui-fabric-react/lib/Utilities';
 import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
 import { ResizeGroup } from 'office-ui-fabric-react/lib/ResizeGroup';
 import { OverflowSet } from '../../OverflowSet';
@@ -131,8 +131,7 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<{}, IResizeGrou
     );
   }
 
-  @autobind
-  private _onReduceData(currentData: any): any {
+  private _onReduceData = (currentData: any): any => {
     if (currentData.primary.length === 0) {
       return undefined;
     }
@@ -147,8 +146,7 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<{}, IResizeGrou
     return { primary, overflow, cacheKey };
   }
 
-  @autobind
-  private _onGrowData(currentData: any): any {
+  private _onGrowData = (currentData: any): any => {
     if (currentData.overflow.length === 0) {
       return undefined;
     }
@@ -163,23 +161,19 @@ export class ResizeGroupOverflowSetExample extends BaseComponent<{}, IResizeGrou
     return { primary, overflow, cacheKey };
   }
 
-  @autobind
-  private _onCachingEnabledChanged(_: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean) {
+  private _onCachingEnabledChanged = (_: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean): void => {
     this.setState({ cachingEnabled: checked });
   }
 
-  @autobind
-  private _onGrowDataEnabledChanged(_: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean) {
+  private _onGrowDataEnabledChanged = (_: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean): void => {
     this.setState({ onGrowDataEnabled: checked });
   }
 
-  @autobind
-  private _onButtonsCheckedChanged(_: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean) {
+  private _onButtonsCheckedChanged = (_: React.FormEvent<HTMLElement | HTMLInputElement>, checked: boolean): void => {
     this.setState({ buttonsChecked: checked });
   }
 
-  @autobind
-  private _onNumberOfItemsChanged(option: IDropdownOption) {
+  private _onNumberOfItemsChanged = (option: IDropdownOption): void => {
     this.setState({ numberOfItems: parseInt(option.text, 10) });
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx
index 818f76a8c9b48..8337417c498d0 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.CustomRender.Example.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import { TextField, ITextFieldProps } from 'office-ui-fabric-react/lib/TextField';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import { IconButton } from 'office-ui-fabric-react/lib/Button';
 import { Callout } from 'office-ui-fabric-react/lib/Callout';
 import './TextField.Examples.scss';
@@ -27,8 +26,7 @@ export class TextFieldCustomRenderExample extends React.Component<{}, {
     );
   }
 
-  @autobind
-  private _onRenderLabel(props: ITextFieldProps): JSX.Element {
+  private _onRenderLabel = (props: ITextFieldProps): JSX.Element => {
 
     const { isCalloutVisible } = this.state;
     return (
@@ -56,15 +54,13 @@ export class TextFieldCustomRenderExample extends React.Component<{}, {
 
   }
 
-  @autobind
-  private _onClick(): void {
+  private _onClick = (): void => {
     this.setState({
       isCalloutVisible: !this.state.isCalloutVisible
     });
   }
 
-  @autobind
-  private _onDismiss() {
+  private _onDismiss = (): void => {
     this.setState({
       isCalloutVisible: false
     });
diff --git a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Icon.Example.tsx b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Icon.Example.tsx
index ec8da214e51e3..e886d1d56aa40 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Icon.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/TextField/examples/TextField.Icon.Example.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
-import { autobind } from 'office-ui-fabric-react/lib/Utilities';
 import './TextField.Examples.scss';
 
 export class TextFieldIconExample extends React.Component<any, any> {
@@ -16,8 +15,7 @@ export class TextFieldIconExample extends React.Component<any, any> {
     );
   }
 
-  @autobind
-  private _onChanged(text: string) {
+  private _onChanged = (text: string): void => {
     console.log(text);
   }
 }
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
index c6057aa9bdece..67b7a34a4754b 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/PeoplePicker/examples/PeoplePicker.Types.Example.tsx
@@ -3,8 +3,7 @@ import * as React from 'react';
 /* tslint:enable */
 import {
   BaseComponent,
-  assign,
-  autobind
+  assign
 } from 'office-ui-fabric-react/lib/Utilities';
 import { Dropdown, IDropdownOption } from 'office-ui-fabric-react/lib/Dropdown';
 import { Toggle } from 'office-ui-fabric-react/lib/Toggle';
@@ -313,27 +312,23 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     );
   }
 
-  @autobind
-  private _onItemsChange(items: any[]) {
+  private _onItemsChange = (items: any[]): void => {
     this.setState({
       currentSelectedItems: items
     });
   }
 
-  @autobind
-  private _onSetFocusButtonClicked() {
+  private _onSetFocusButtonClicked = (): void => {
     if (this._picker) {
       this._picker.focusInput();
     }
   }
 
-  @autobind
-  private _renderFooterText(): JSX.Element {
+  private _renderFooterText = (): JSX.Element => {
     return <div>No additional results</div>;
   }
 
-  @autobind
-  private _onRemoveSuggestion(item: IPersonaProps): void {
+  private _onRemoveSuggestion = (item: IPersonaProps): void => {
     const { peopleList, mostRecentlyUsed: mruState } = this.state;
     const indexPeopleList: number = peopleList.indexOf(item);
     const indexMostRecentlyUsed: number = mruState.indexOf(item);
@@ -349,15 +344,13 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     }
   }
 
-  @autobind
-  private _onItemSelected(item: IPersonaProps) {
+  private _onItemSelected = (item: IPersonaProps): Promise<IPersonaProps> => {
     const processedItem = Object.assign({}, item);
     processedItem.primaryText = `${item.primaryText} (selected)`;
     return new Promise<IPersonaProps>((resolve, reject) => setTimeout(() => resolve(processedItem), 250));
   }
 
-  @autobind
-  private _onFilterChanged(filterText: string, currentPersonas: IPersonaProps[], limitResults?: number) {
+  private _onFilterChanged = (filterText: string, currentPersonas: IPersonaProps[], limitResults?: number): IPersonaProps[] | Promise<IPersonaProps[]> => {
     if (filterText) {
       let filteredPersonas: IPersonaProps[] = this._filterPersonasByText(filterText);
 
@@ -369,23 +362,20 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     }
   }
 
-  @autobind
-  private _returnMostRecentlyUsed(currentPersonas: IPersonaProps[]): IPersonaProps[] | Promise<IPersonaProps[]> {
+  private _returnMostRecentlyUsed = (currentPersonas: IPersonaProps[]): IPersonaProps[] | Promise<IPersonaProps[]> => {
     let { mostRecentlyUsed } = this.state;
     mostRecentlyUsed = this._removeDuplicates(mostRecentlyUsed, currentPersonas);
     return this._filterPromise(mostRecentlyUsed);
   }
 
-  @autobind
-  private _returnMostRecentlyUsedWithLimit(currentPersonas: IPersonaProps[]): IPersonaProps[] | Promise<IPersonaProps[]> {
+  private _returnMostRecentlyUsedWithLimit = (currentPersonas: IPersonaProps[]): IPersonaProps[] | Promise<IPersonaProps[]> => {
     let { mostRecentlyUsed } = this.state;
     mostRecentlyUsed = this._removeDuplicates(mostRecentlyUsed, currentPersonas);
     mostRecentlyUsed = mostRecentlyUsed.splice(0, 3);
     return this._filterPromise(mostRecentlyUsed);
   }
 
-  @autobind
-  private _onFilterChangedWithLimit(filterText: string, currentPersonas: IPersonaProps[]): IPersonaProps[] | Promise<IPersonaProps[]> {
+  private _onFilterChangedWithLimit = (filterText: string, currentPersonas: IPersonaProps[]): IPersonaProps[] | Promise<IPersonaProps[]> => {
     return this._onFilterChanged(filterText, currentPersonas, 3);
   }
 
@@ -420,18 +410,15 @@ export class PeoplePickerTypesExample extends BaseComponent<any, IPeoplePickerEx
     return personas.filter(persona => !this._listContainsPersona(persona, possibleDupes));
   }
 
-  @autobind
-  private _toggleDelayResultsChange(toggleState: boolean) {
+  private _toggleDelayResultsChange = (toggleState: boolean): void => {
     this.setState({ delayResults: toggleState });
   }
 
-  @autobind
-  private _dropDownSelected(option: IDropdownOption) {
+  private _dropDownSelected = (option: IDropdownOption): void => {
     this.setState({ currentPicker: option.key });
   }
 
-  @autobind
-  private _validateInput(input: string) {
+  private _validateInput = (input: string): ValidationState => {
     if (input.indexOf('@') !== -1) {
       return ValidationState.valid;
     } else if (input.length > 1) {
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
index 99795d8ac93cd..5fc74fd7b6acc 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/Picker.CustomResult.Example.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { autobind } from '../../../Utilities';
 import {
   IDocumentCardActionsProps,
   IDocumentCardPreviewProps,
@@ -377,8 +376,7 @@ export class PickerCustomResultExample extends React.Component<{}, IPeoplePicker
     return props.documentTitleProps.title;
   }
 
-  @autobind
-  private _onDisabledButtonClick(): void {
+  private _onDisabledButtonClick = (): void => {
     this.setState({
       isPickerDisabled: !this.state.isPickerDisabled
     });
diff --git a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
index 9a92e82bbd00f..3b6c4172fa035 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/pickers/examples/TagPicker.Basic.Example.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import {
-  autobind,
   BaseComponent
 } from '../../../Utilities';
 import { TagPicker } from 'office-ui-fabric-react/lib/components/pickers/TagPicker/TagPicker';
@@ -93,26 +92,22 @@ export class TagPickerBasicExample extends BaseComponent<{}, ITagPickerDemoPageS
     return item.name;
   }
 
-  @autobind
-  private _onDisabledButtonClick(): void {
+  private _onDisabledButtonClick = (): void => {
     this.setState({
       isPickerDisabled: !this.state.isPickerDisabled
     });
   }
 
-  @autobind
-  private _onFilterChanged(filterText: string, tagList: { key: string, name: string }[]) {
+  private _onFilterChanged = (filterText: string, tagList: { key: string, name: string }[]): { key: string, name: string }[] => {
     return filterText ? _testTags.filter(tag => tag.name.toLowerCase().indexOf(filterText.toLowerCase()) === 0)
       .filter(tag => !this._listContainsDocument(tag, tagList)) : [];
   }
 
-  @autobind
-  private _onFilterChangedNoFilter(filterText: string, tagList: { key: string, name: string }[]) {
+  private _onFilterChangedNoFilter = (filterText: string, tagList: { key: string, name: string }[]): { key: string, name: string }[] => {
     return filterText ? _testTags.filter(tag => tag.name.toLowerCase().indexOf(filterText.toLowerCase()) === 0) : [];
   }
 
-  @autobind
-  private _onItemSelected(item: any) {
+  private _onItemSelected = (item: { key: string, name: string }): { key: string, name: string } | null => {
     if (this._listContainsDocument(item, this._picker.items)) {
       return null;
     }

From b07d07440fbce5e907a5cd18c06e037547ab2616 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Wed, 21 Mar 2018 15:04:47 -0700
Subject: [PATCH 1619/1641] Add compact timestamp style for ActivityItem
 component (#4334)

* Provide compact style for Activity timestamp

* Update change output
---
 .../activity-compact_2018-03-21-15-01.json    | 11 +++++
 .../ActivityItem/ActivityItem.classNames.ts   |  5 ++-
 .../ActivityItem/ActivityItem.styles.ts       |  8 +++-
 .../components/ActivityItem/ActivityItem.tsx  | 40 ++++++++++---------
 .../ActivityItem/ActivityItem.types.ts        |  8 +++-
 .../examples/ActivityItem.Compact.Example.tsx |  9 +++--
 6 files changed, 55 insertions(+), 26 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/activity-compact_2018-03-21-15-01.json

diff --git a/common/changes/office-ui-fabric-react/activity-compact_2018-03-21-15-01.json b/common/changes/office-ui-fabric-react/activity-compact_2018-03-21-15-01.json
new file mode 100644
index 0000000000000..287ebebf124f6
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/activity-compact_2018-03-21-15-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Provide compact timestamp style for ActivityItem",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "tmichon@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.classNames.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.classNames.ts
index 12d62e960a6d0..4bc5f7842f2c6 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.classNames.ts
@@ -59,6 +59,9 @@ export const getClassNames = memoizeFunction((
 
     activityText: mergeStyles('ms-ActivityItem-activityText', styles.activityText),
     commentText: mergeStyles('ms-ActivityItem-commentText', styles.commentText),
-    timeStamp: mergeStyles('ms-ActivityItem-timeStamp', styles.timeStamp)
+    timeStamp: mergeStyles(
+      'ms-ActivityItem-timeStamp',
+      styles.timeStamp,
+      isCompact && styles.isCompactTimeStamp)
   };
 });
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
index fd6951300fd3a..4833241cd5c22 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.styles.ts
@@ -127,7 +127,13 @@ export const getStyles = memoizeFunction((
         fontWeight: 400,
         color: theme.palette.neutralSecondary
       }
-    ]
+    ],
+
+    isCompactTimeStamp: {
+      display: 'inline-block',
+      paddingLeft: '0.3em', // One space character
+      fontSize: '1em'
+    }
   };
 
   return concatStyleSets(ActivityItemStyles, customStyles);
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
index 70259d77f39ec..35a656fccf66f 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.tsx
@@ -9,9 +9,6 @@ import { getStyles } from './ActivityItem.styles';
 import { PersonaSize, PersonaCoin, IPersonaProps } from '../../Persona';
 
 export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
-  private _classNames: IActivityItemClassNames;
-  private _styles: IActivityItemStyles;
-
   constructor(props: IActivityItemProps) {
     super(props);
   }
@@ -25,24 +22,18 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
       styles: customStyles
     } = this.props;
 
-    this._styles = getStyles(undefined, customStyles);
-    this._classNames = getClassNames(
-      this._styles,
-      this.props.className!,
-      this.props.activityPersonas!,
-      this.props.isCompact!
-    );
+    const classNames = this._getClassNames(this.props);
 
     return (
-      <div className={ this._classNames.root } style={ this.props.style } >
+      <div className={ classNames.root } style={ this.props.style } >
 
         { (this.props.activityPersonas || this.props.activityIcon || this.props.onRenderIcon) &&
-          <div className={ this._classNames.activityTypeIcon }>
+          <div className={ classNames.activityTypeIcon }>
             { onRenderIcon(this.props) }
           </div>
         }
 
-        <div className={ this._classNames.activityContent }>
+        <div className={ classNames.activityContent }>
           { onRenderActivityDescription(this.props, this._onRenderActivityDescription) }
           { onRenderComments(this.props, this._onRenderComments) }
           { onRenderTimeStamp(this.props, this._onRenderTimeStamp) }
@@ -61,28 +52,34 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
   }
 
   private _onRenderActivityDescription = (props: IActivityItemProps): JSX.Element | null => {
+    const classNames = this._getClassNames(props);
+
     const activityDescription = props.activityDescription || props.activityDescriptionText;
 
     if (activityDescription) {
-      return (<span className={ this._classNames.activityText }>{ activityDescription }</span>);
+      return (<span className={ classNames.activityText }>{ activityDescription }</span>);
     }
 
     return null;
   }
 
   private _onRenderComments = (props: IActivityItemProps): JSX.Element | null => {
+    const classNames = this._getClassNames(props);
+
     const comments = props.comments || props.commentText;
 
     if (!props.isCompact && comments) {
-      return (<div className={ this._classNames.commentText }>{ comments }</div>);
+      return (<div className={ classNames.commentText }>{ comments }</div>);
     }
 
     return null;
   }
 
   private _onRenderTimeStamp = (props: IActivityItemProps): JSX.Element | null => {
+    const classNames = this._getClassNames(props);
+
     if (!props.isCompact && props.timeStamp) {
-      return (<div className={ this._classNames.timeStamp }>{ props.timeStamp }</div>);
+      return (<div className={ classNames.timeStamp }>{ props.timeStamp }</div>);
     }
 
     return null;
@@ -90,6 +87,8 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
 
   // If activityPersonas is an array of persona props, build the persona cluster element.
   private _onRenderPersonaArray = (props: IActivityItemProps): JSX.Element | null => {
+    const classNames = this._getClassNames(props);
+
     let personaElement: JSX.Element | null = null;
     const activityPersonas = props.activityPersonas as Array<IPersonaProps & { key?: string | number }>;
     if (activityPersonas[0].imageUrl || activityPersonas[0].imageInitials) {
@@ -111,15 +110,18 @@ export class ActivityItem extends BaseComponent<IActivityItemProps, {}> {
             { ...person }
             // tslint:disable-next-line:no-string-literal
             key={ person['key'] ? person['key'] : index }
-            className={ this._classNames.activityPersona }
+            className={ classNames.activityPersona }
             size={ showSize16Personas ? PersonaSize.size16 : PersonaSize.size32 }
             style={ style }
           />
         );
       });
-      personaElement = <div className={ this._classNames.personaContainer }>{ personaList }</div>;
+      personaElement = <div className={ classNames.personaContainer }>{ personaList }</div>;
     }
     return personaElement;
   }
 
-}
\ No newline at end of file
+  private _getClassNames(props: IActivityItemProps): IActivityItemClassNames {
+    return getClassNames(getStyles(undefined, props.styles), props.className!, props.activityPersonas!, props.isCompact!);
+  }
+}
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.types.ts b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.types.ts
index 8a054fe144979..ac4bd18861bf0 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/ActivityItem.types.ts
@@ -148,4 +148,10 @@ export interface IActivityItemStyles {
    * Styles applied to the timestamp at the end of each activity item.
    */
   timeStamp?: IStyle;
-}
\ No newline at end of file
+
+  /**
+   * Styles applied to the timestamp in compact mode.
+   * This can occur if a host overrides the render behavior to force the timestamp to render.
+   */
+  isCompactTimeStamp?: IStyle;
+}
diff --git a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Compact.Example.tsx b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Compact.Example.tsx
index 56a68c5f440d6..c364014cbc3da 100644
--- a/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Compact.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ActivityItem/examples/ActivityItem.Compact.Example.tsx
@@ -3,6 +3,7 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import { css, classNamesFunction } from '../../../Utilities';
 import { ActivityItem } from '../ActivityItem';
+import { IActivityItemProps } from '../ActivityItem.types';
 import {
   getStyles,
   IActivityItemExampleStyleProps,
@@ -16,7 +17,7 @@ export class ActivityItemCompactExample extends React.Component<React.Props<Acti
     const getClassNames = classNamesFunction<IActivityItemExampleStyleProps, IActivityItemExampleStyles>();
     const classNames = getClassNames(getStyles);
 
-    const activityItemExamples = [
+    const activityItemExamples: Partial<IActivityItemProps & React.Props<{}>>[] = [
       {
         key: 1,
         activityDescription: [
@@ -58,7 +59,7 @@ export class ActivityItemCompactExample extends React.Component<React.Props<Acti
           <span key={ 1 } className={ css(classNames.nameText) }>Sabrina De Luca</span>,
           <span key={ 2 }> added this file</span>
         ],
-        activityIcon: React.createElement(Icon, { iconName: 'Add' }),
+        activityIcon: <Icon iconName={ 'Add' } />,
         isCompact: true
       },
       {
@@ -67,7 +68,7 @@ export class ActivityItemCompactExample extends React.Component<React.Props<Acti
           <span key={ 1 } className={ css(classNames.nameText) }>Chuan Rojumanong</span>,
           <span key={ 2 }> shared this file</span>
         ],
-        activityIcon: React.createElement(Icon, { iconName: 'Share' }),
+        activityIcon: <Icon iconName={ 'Share' } />,
         isCompact: true
       }
     ];
@@ -76,7 +77,7 @@ export class ActivityItemCompactExample extends React.Component<React.Props<Acti
     activityItemExamples.forEach((item) => {
       const props = item;
       activityExampleList.push(
-        <ActivityItem {...props} key={ item.key } className={ css(classNames.exampleRoot) } />
+        <ActivityItem { ...props } key={ item.key } className={ css(classNames.exampleRoot) } />
       );
     });
 

From 7987ad64a756b1f3cf9d4fd4dd2dd8999c2f271a Mon Sep 17 00:00:00 2001
From: Philip Kuo <phkuo@microsoft.com>
Date: Wed, 21 Mar 2018 17:06:52 -0700
Subject: [PATCH 1620/1641] Variants: add neutral variant (#4337)

* add neutral variant

* changefile and export and cleanup
---
 ...uo-addNeutralVariant_2018-03-21-23-26.json | 11 ++++
 packages/variants/src/index.ts                |  1 +
 packages/variants/src/variants.ts             | 51 +++++++++++++++++++
 3 files changed, 63 insertions(+)
 create mode 100644 common/changes/@uifabric/variants/phkuo-addNeutralVariant_2018-03-21-23-26.json

diff --git a/common/changes/@uifabric/variants/phkuo-addNeutralVariant_2018-03-21-23-26.json b/common/changes/@uifabric/variants/phkuo-addNeutralVariant_2018-03-21-23-26.json
new file mode 100644
index 0000000000000..f358ecb206774
--- /dev/null
+++ b/common/changes/@uifabric/variants/phkuo-addNeutralVariant_2018-03-21-23-26.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/variants",
+      "comment": "add neutral variant",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/variants",
+  "email": "phkuo@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/variants/src/index.ts b/packages/variants/src/index.ts
index be17c8aeb847a..5606690f86708 100644
--- a/packages/variants/src/index.ts
+++ b/packages/variants/src/index.ts
@@ -1,4 +1,5 @@
 export {
+  getNeutralVariant,
   getSoftVariant,
   getStrongVariant
 } from './variants';
diff --git a/packages/variants/src/variants.ts b/packages/variants/src/variants.ts
index cef156459c5d1..b1c9478b3c68a 100644
--- a/packages/variants/src/variants.ts
+++ b/packages/variants/src/variants.ts
@@ -6,6 +6,57 @@ import {
 } from '@uifabric/styling/lib/index';
 import { createTheme } from '@uifabric/styling/lib/index';
 
+/**
+ * A variant where the background soft shade of the neutral color. Most other colors remain unchanged.
+ *
+ * @export
+ * @param {IPartialTheme} theme the theme for which to build a variant for
+ * @returns {ITheme} the variant theme
+ */
+export function getNeutralVariant(theme: IPartialTheme): ITheme {
+  const fullTheme = createTheme(theme);
+  const p = fullTheme.palette;
+
+  // commented lines are unchanged, but left in for tracking purposes
+  // in a tint variant, most colors remain unchanged
+  const partialPalette: Partial<IPalette> = {
+    // theme
+    // themeDarker: '#004578',
+    // themeDark: '#005a9e',
+    // themeDarkAlt: '#106ebe',
+    // themePrimary: '#0078d4',
+    // themeSecondary: '#2b88d8',
+    // themeTertiary: '#71afe5',
+    // themeLight: '#c7e0f4',
+    // themeLighter: '#deecf9',
+    // themeLighterAlt: '#eff6fc',
+
+    // foregrounds
+    // black: '#000000',
+    // neutralDark: '#212121',
+    // neutralPrimary: '#333333',
+    // neutralPrimaryAlt: '#3c3c3c',
+    // neutralSecondary: '#666666',
+    // neutralTertiary: '#a6a6a6',
+
+    // backgrounds
+    // neutralTertiaryAlt: '#c8c8c8',
+    // neutralQuaternary: '#d0d0d0',
+    // neutralQuaternaryAlt: '#dadada',
+    neutralLight: p.neutralQuaternaryAlt,
+    neutralLighter: p.neutralLight,
+    neutralLighterAlt: p.neutralLight,
+    white: p.neutralLighter
+    // squish the backgrounds a bit
+  };
+
+  const partialSemantic: Partial<ISemanticColors> = {
+    bodyBackground: p.neutralLighter
+  };
+
+  return createTheme({ ...theme, ...{ palette: partialPalette, semanticColors: partialSemantic } });
+}
+
 /* Variants
  * Variants are themes based off the current theme.
  * Each variant is a subset of the current theme, rearranging slots to create a theme of a different style.

From 9cad804d53c85ade2cb2f91c1aecdbd7f615d0ff Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Thu, 22 Mar 2018 10:14:03 +0000
Subject: [PATCH 1621/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 ...re-autobind-removals_2018-03-21-07-02.json | 11 -------
 ...uo-addNeutralVariant_2018-03-21-23-26.json | 11 -------
 .../activity-compact_2018-03-21-15-01.json    | 11 -------
 .../inateeg-0302card_2018-03-21-20-56.json    | 11 -------
 ...re-autobind-removals_2018-03-21-07-02.json | 11 -------
 ...oltipForEmptyMessage_2018-03-21-05-49.json | 11 -------
 packages/experiments/CHANGELOG.json           | 19 ++++++++++++
 packages/experiments/CHANGELOG.md             |  9 +++++-
 packages/experiments/package.json             |  4 +--
 .../office-ui-fabric-react/CHANGELOG.json     | 31 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 15 ++++++++-
 packages/office-ui-fabric-react/package.json  |  2 +-
 packages/variants/CHANGELOG.json              | 14 +++++++++
 packages/variants/CHANGELOG.md                |  9 +++++-
 packages/variants/package.json                |  2 +-
 20 files changed, 103 insertions(+), 78 deletions(-)
 delete mode 100644 common/changes/@uifabric/experiments/more-autobind-removals_2018-03-21-07-02.json
 delete mode 100644 common/changes/@uifabric/variants/phkuo-addNeutralVariant_2018-03-21-23-26.json
 delete mode 100644 common/changes/office-ui-fabric-react/activity-compact_2018-03-21-15-01.json
 delete mode 100644 common/changes/office-ui-fabric-react/inateeg-0302card_2018-03-21-20-56.json
 delete mode 100644 common/changes/office-ui-fabric-react/more-autobind-removals_2018-03-21-07-02.json
 delete mode 100644 common/changes/office-ui-fabric-react/users-prbhad-HideTooltipForEmptyMessage_2018-03-21-05-49.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 6a05dd86898be..0912c7ab892eb 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.67.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.68.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 6e194e11bcf35..892c655e254fd 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.67.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.68.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 9b0fc80a4735c..683f927b0aeed 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.67.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.68.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 08a10d7a676f7..937466d7173f8 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.67.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.68.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index b3edf8f9408f5..cb7a2351e74c9 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.67.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.68.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/common/changes/@uifabric/experiments/more-autobind-removals_2018-03-21-07-02.json b/common/changes/@uifabric/experiments/more-autobind-removals_2018-03-21-07-02.json
deleted file mode 100644
index 20aa33def94c4..0000000000000
--- a/common/changes/@uifabric/experiments/more-autobind-removals_2018-03-21-07-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Removes @autobind for arrow functions",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "mark@thedutchies.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/variants/phkuo-addNeutralVariant_2018-03-21-23-26.json b/common/changes/@uifabric/variants/phkuo-addNeutralVariant_2018-03-21-23-26.json
deleted file mode 100644
index f358ecb206774..0000000000000
--- a/common/changes/@uifabric/variants/phkuo-addNeutralVariant_2018-03-21-23-26.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/variants",
-      "comment": "add neutral variant",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/variants",
-  "email": "phkuo@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/activity-compact_2018-03-21-15-01.json b/common/changes/office-ui-fabric-react/activity-compact_2018-03-21-15-01.json
deleted file mode 100644
index 287ebebf124f6..0000000000000
--- a/common/changes/office-ui-fabric-react/activity-compact_2018-03-21-15-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Provide compact timestamp style for ActivityItem",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "tmichon@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/inateeg-0302card_2018-03-21-20-56.json b/common/changes/office-ui-fabric-react/inateeg-0302card_2018-03-21-20-56.json
deleted file mode 100644
index c5587144f9f9f..0000000000000
--- a/common/changes/office-ui-fabric-react/inateeg-0302card_2018-03-21-20-56.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": ",",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "inateeg@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/more-autobind-removals_2018-03-21-07-02.json b/common/changes/office-ui-fabric-react/more-autobind-removals_2018-03-21-07-02.json
deleted file mode 100644
index cec3163890775..0000000000000
--- a/common/changes/office-ui-fabric-react/more-autobind-removals_2018-03-21-07-02.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Removes @autobind from examples",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mark@thedutchies.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/users-prbhad-HideTooltipForEmptyMessage_2018-03-21-05-49.json b/common/changes/office-ui-fabric-react/users-prbhad-HideTooltipForEmptyMessage_2018-03-21-05-49.json
deleted file mode 100644
index 98265100b884c..0000000000000
--- a/common/changes/office-ui-fabric-react/users-prbhad-HideTooltipForEmptyMessage_2018-03-21-05-49.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Removing empty callout when tooltip content is empty",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "prbhad@microsoft.com"
-}
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index c9e4dd3d020f8..bd7629aed1fcf 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.26.1",
+      "tag": "@uifabric/experiments_v5.26.1",
+      "date": "Thu, 22 Mar 2018 10:14:03 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Mark Polak <mark@thedutchies.com>",
+            "commit": "c5245a51bd4f740399d6d9dbd98f2c51ef6f0a59",
+            "comment": "Removes @autobind for arrow functions"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.67.0 <6.0.0` to `>=5.68.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.26.0",
       "tag": "@uifabric/experiments_v5.26.0",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index b8b6db6bdf945..8e554ffb85dd5 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Tue, 20 Mar 2018 10:27:37 GMT and should not be manually modified.
+This log was last generated on Thu, 22 Mar 2018 10:14:03 GMT and should not be manually modified.
+
+## 5.26.1
+Thu, 22 Mar 2018 10:14:03 GMT
+
+### Patches
+
+- Removes @autobind for arrow functions
 
 ## 5.26.0
 Tue, 20 Mar 2018 10:27:37 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 2a2a390f066dc..87abc1acfb195 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.26.0",
+  "version": "5.26.1",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.67.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.68.0 <6.0.0",
     "@uifabric/icons": ">=5.6.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index d00d2c89b0b01..3e902f0096c39 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,37 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.68.0",
+      "tag": "office-ui-fabric-react_v5.68.0",
+      "date": "Thu, 22 Mar 2018 10:14:03 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "b07d07440fbce5e907a5cd18c06e037547ab2616",
+            "comment": "Provide compact timestamp style for ActivityItem"
+          },
+          {
+            "author": "Mark Polak <mark@thedutchies.com>",
+            "commit": "c5245a51bd4f740399d6d9dbd98f2c51ef6f0a59",
+            "comment": "Removes @autobind from examples"
+          },
+          {
+            "author": "priyank <priyank.bhadja91@gmail.com>",
+            "commit": "5ebf43e6c339d783900a58055f4c9e8b3ac5a124",
+            "comment": "Removing empty callout when tooltip content is empty"
+          }
+        ],
+        "minor": [
+          {
+            "author": "inateeg <inateeg@microsoft.com>",
+            "commit": "d4159b20c9b143248cf52d1f3cdda24fd2e1caae",
+            "comment": ","
+          }
+        ]
+      }
+    },
     {
       "version": "5.67.0",
       "tag": "office-ui-fabric-react_v5.67.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 94a573b84ea41..0d8845e607fd2 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,19 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Wed, 21 Mar 2018 10:18:30 GMT and should not be manually modified.
+This log was last generated on Thu, 22 Mar 2018 10:14:03 GMT and should not be manually modified.
+
+## 5.68.0
+Thu, 22 Mar 2018 10:14:03 GMT
+
+### Minor changes
+
+- ,
+
+### Patches
+
+- Provide compact timestamp style for ActivityItem
+- Removes @autobind from examples
+- Removing empty callout when tooltip content is empty
 
 ## 5.67.0
 Wed, 21 Mar 2018 10:18:30 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index ef843d6f174c4..123846fc4b7bb 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.67.0",
+  "version": "5.68.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
diff --git a/packages/variants/CHANGELOG.json b/packages/variants/CHANGELOG.json
index 900098f40f808..990ac10774e44 100644
--- a/packages/variants/CHANGELOG.json
+++ b/packages/variants/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/variants",
   "entries": [
+    {
+      "version": "5.2.0",
+      "tag": "@uifabric/variants_v5.2.0",
+      "date": "Thu, 22 Mar 2018 10:14:03 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Philip Kuo <phkuo@microsoft.com>",
+            "commit": "7987ad64a756b1f3cf9d4fd4dd2dd8999c2f271a",
+            "comment": "add neutral variant"
+          }
+        ]
+      }
+    },
     {
       "version": "5.1.0",
       "tag": "@uifabric/variants_v5.1.0",
diff --git a/packages/variants/CHANGELOG.md b/packages/variants/CHANGELOG.md
index 96f9c2849ada5..a3f94dababef8 100644
--- a/packages/variants/CHANGELOG.md
+++ b/packages/variants/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/variants
 
-This log was last generated on Mon, 19 Mar 2018 10:27:55 GMT and should not be manually modified.
+This log was last generated on Thu, 22 Mar 2018 10:14:03 GMT and should not be manually modified.
+
+## 5.2.0
+Thu, 22 Mar 2018 10:14:03 GMT
+
+### Minor changes
+
+- add neutral variant
 
 ## 5.1.0
 Mon, 19 Mar 2018 10:27:55 GMT
diff --git a/packages/variants/package.json b/packages/variants/package.json
index c1ee532511fd0..25a7aac3a3bea 100644
--- a/packages/variants/package.json
+++ b/packages/variants/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/variants",
-  "version": "5.1.0",
+  "version": "5.2.0",
   "description": "Office UI Fabric subtheme generator.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From b152150b7222ff499f2f552ce3117e0d27eb1e23 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marius=20Tenn=C3=B8e?= <mariust@outlook.com>
Date: Thu, 22 Mar 2018 17:49:00 +0100
Subject: [PATCH 1622/1641] Introduced focusAsync for cheaper element focusing,
 and made FocusTrapZone utilize it (#4306)

* Introduced focusAsync for cheaper element focusing, and made FocusTrapZone utilize it

* Added change files

* Changed to minor change types
---
 .../mariust-focusAsync_2018-03-19-15-01.json  | 11 ++++
 .../mariust-focusAsync_2018-03-19-15-01.json  | 11 ++++
 .../FocusTrapZone/FocusTrapZone.test.tsx      | 51 ++++++++++++++-----
 .../FocusTrapZone/FocusTrapZone.tsx           |  9 ++--
 packages/utilities/src/focus.test.tsx         | 42 ++++++++++++++-
 packages/utilities/src/focus.ts               | 30 ++++++++++-
 6 files changed, 134 insertions(+), 20 deletions(-)
 create mode 100644 common/changes/@uifabric/utilities/mariust-focusAsync_2018-03-19-15-01.json
 create mode 100644 common/changes/office-ui-fabric-react/mariust-focusAsync_2018-03-19-15-01.json

diff --git a/common/changes/@uifabric/utilities/mariust-focusAsync_2018-03-19-15-01.json b/common/changes/@uifabric/utilities/mariust-focusAsync_2018-03-19-15-01.json
new file mode 100644
index 0000000000000..fb9d82a2f365d
--- /dev/null
+++ b/common/changes/@uifabric/utilities/mariust-focusAsync_2018-03-19-15-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Introduced focusAsync for cheaper element focusing",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "mariust@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/mariust-focusAsync_2018-03-19-15-01.json b/common/changes/office-ui-fabric-react/mariust-focusAsync_2018-03-19-15-01.json
new file mode 100644
index 0000000000000..6c14a3b283149
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/mariust-focusAsync_2018-03-19-15-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Introduced focusAsync for cheaper element focusing, and made FocusTrapZone utilize it",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mariust@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.test.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.test.tsx
index d23d8fc60e7e1..2fac102b5b5a3 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.test.tsx
@@ -9,6 +9,13 @@ import { KeyCodes } from '../../Utilities';
 import { FocusZone, FocusZoneDirection } from '../FocusZone';
 import { FocusTrapZone } from './FocusTrapZone';
 
+// rAF does not exist in node - let's mock it
+window.requestAnimationFrame = (callback: FrameRequestCallback) => {
+  return window.setTimeout(callback, 16);
+};
+
+jest.useFakeTimers();
+
 describe('FocusTrapZone', () => {
   let lastFocusedElement: HTMLElement | undefined;
   function _onFocus(ev: any) {
@@ -139,15 +146,23 @@ describe('FocusTrapZone', () => {
 
     // Focus the first button.
     ReactTestUtils.Simulate.focus(buttonA);
-    expect(lastFocusedElement).toBe(buttonA);
+    window.requestAnimationFrame(() => {
+      expect(lastFocusedElement).toBe(buttonA);
+
+      // Pressing shift + tab should go to d.
+      ReactTestUtils.Simulate.keyDown(buttonA, { which: KeyCodes.tab, shiftKey: true });
+      window.requestAnimationFrame(() => {
+        expect(lastFocusedElement).toBe(buttonD);
 
-    // Pressing shift + tab should go to d.
-    ReactTestUtils.Simulate.keyDown(buttonA, { which: KeyCodes.tab, shiftKey: true });
-    expect(lastFocusedElement).toBe(buttonD);
+        // Pressing tab should go to a.
+        ReactTestUtils.Simulate.keyDown(buttonD, { which: KeyCodes.tab });
+        window.requestAnimationFrame(() => {
+          expect(lastFocusedElement).toBe(buttonA);
+        });
+      });
+    });
 
-    // Pressing tab should go to a.
-    ReactTestUtils.Simulate.keyDown(buttonD, { which: KeyCodes.tab });
-    expect(lastFocusedElement).toBe(buttonA);
+    jest.runAllTimers();
   });
 
   it('can tab across a FocusZone with different button structures', () => {
@@ -229,14 +244,22 @@ describe('FocusTrapZone', () => {
 
     // Focus the first button.
     ReactTestUtils.Simulate.focus(buttonX);
-    expect(lastFocusedElement).toBe(buttonX);
+    window.requestAnimationFrame(() => {
+      expect(lastFocusedElement).toBe(buttonX);
+
+      // Pressing shift + tab should go to a.
+      ReactTestUtils.Simulate.keyDown(buttonX, { which: KeyCodes.tab, shiftKey: true });
+      window.requestAnimationFrame(() => {
+        expect(lastFocusedElement).toBe(buttonA);
 
-    // Pressing shift + tab should go to a.
-    ReactTestUtils.Simulate.keyDown(buttonX, { which: KeyCodes.tab, shiftKey: true });
-    expect(lastFocusedElement).toBe(buttonA);
+        // Pressing tab should go to x.
+        ReactTestUtils.Simulate.keyDown(buttonA, { which: KeyCodes.tab });
+        window.requestAnimationFrame(() => {
+          expect(lastFocusedElement).toBe(buttonX);
+        });
+      });
+    });
 
-    // Pressing tab should go to x.
-    ReactTestUtils.Simulate.keyDown(buttonA, { which: KeyCodes.tab });
-    expect(lastFocusedElement).toBe(buttonX);
+    jest.runAllTimers();
   });
 });
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
index b0183d782b8e8..eb4710d22809e 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.tsx
@@ -8,6 +8,7 @@ import {
   getFirstFocusable,
   getLastTabbable,
   getNextElement,
+  focusAsync,
   createRef
 } from '../../Utilities';
 import { IFocusTrapZone, IFocusTrapZoneProps } from './FocusTrapZone.types';
@@ -75,7 +76,7 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
     }
 
     if (!ignoreExternalFocusing && this._previouslyFocusedElement && typeof this._previouslyFocusedElement.focus === 'function') {
-      this._previouslyFocusedElement.focus();
+      focusAsync(this._previouslyFocusedElement);
     }
   }
 
@@ -115,7 +116,7 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
       }
     }
     if (_firstFocusableChild) {
-      (_firstFocusableChild as any).focus();
+      focusAsync(_firstFocusableChild);
     }
   }
 
@@ -132,11 +133,11 @@ export class FocusTrapZone extends BaseComponent<IFocusTrapZoneProps, {}> implem
     const _lastFocusableChild = getLastTabbable(this._root.value, this._root.value.lastChild as HTMLElement, true);
 
     if (ev.shiftKey && _firstFocusableChild === ev.target) {
-      _lastFocusableChild!.focus();
+      focusAsync(_lastFocusableChild);
       ev.preventDefault();
       ev.stopPropagation();
     } else if (!ev.shiftKey && _lastFocusableChild === ev.target) {
-      _firstFocusableChild!.focus();
+      focusAsync(_firstFocusableChild);
       ev.preventDefault();
       ev.stopPropagation();
     }
diff --git a/packages/utilities/src/focus.test.tsx b/packages/utilities/src/focus.test.tsx
index 67505802abb8b..c695af22f99aa 100644
--- a/packages/utilities/src/focus.test.tsx
+++ b/packages/utilities/src/focus.test.tsx
@@ -3,7 +3,7 @@ import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 import * as ReactDOM from 'react-dom';
 import * as ReactTestUtils from 'react-dom/test-utils';
-import { isElementVisible, isElementTabbable } from './focus';
+import { isElementVisible, isElementTabbable, focusAsync } from './focus';
 
 let _hiddenElement: HTMLElement | undefined;
 let _visibleElement: HTMLElement | undefined;
@@ -121,4 +121,44 @@ describe('isElementTabbable', () => {
     expect(isElementTabbable(button)).toEqual(false);
   });
 
+});
+
+describe('focusAsync', () => {
+  // rAF does not exist in node - let's mock it
+  window.requestAnimationFrame = (callback: FrameRequestCallback) => {
+    return window.setTimeout(callback, 16);
+  };
+
+  jest.useFakeTimers();
+
+  it('focuses on an item on the next frame', () => {
+    const component = renderIntoDocument(
+      <div>
+        <button className='a'>a</button>
+        <button className='b'>b</button>
+        <button className='c'>c</button>
+      </div>
+    );
+
+    const container = ReactDOM.findDOMNode(component as React.ReactInstance) as Element;
+
+    const buttonA = container.querySelector('.a') as HTMLElement;
+    const buttonB = container.querySelector('.b') as HTMLElement;
+    const buttonC = container.querySelector('.c') as HTMLElement;
+
+    // Focus the first button.
+    focusAsync(buttonA);
+    window.requestAnimationFrame(() => {
+      expect(container.ownerDocument.activeElement).toBe(buttonA);
+
+      // Focus the second button, then the third before the next frame
+      focusAsync(buttonB);
+      focusAsync(buttonC);
+      window.requestAnimationFrame(() => {
+        expect(container.ownerDocument.activeElement).toBe(buttonC);
+      });
+    });
+
+    jest.runAllTimers();
+  });
 });
\ No newline at end of file
diff --git a/packages/utilities/src/focus.ts b/packages/utilities/src/focus.ts
index c2dc853c6932c..906678bc24c7f 100644
--- a/packages/utilities/src/focus.ts
+++ b/packages/utilities/src/focus.ts
@@ -58,7 +58,7 @@ export function focusFirstChild(
   let element: HTMLElement | null = getNextElement(rootElement, rootElement, true, false, false, true);
 
   if (element) {
-    element.focus();
+    focusAsync(element);
     return true;
   }
   return false;
@@ -351,3 +351,31 @@ export function shouldWrapFocus(element: HTMLElement, noWrapDataAttribute: 'data
 
   return elementContainsAttribute(element, noWrapDataAttribute) === 'true' ? false : true;
 }
+
+let targetToFocusOnNextRepaint: HTMLElement | null | undefined = undefined;
+
+/**
+ * Sets focus to an element asynchronously. The focus will be set at the next browser repaint,
+ * meaning it won't cause any extra recalculations. If more than one focusAsync is called during one frame,
+ * only the latest called focusAsync element will actually be focused
+ * @param element The element to focus
+ */
+export function focusAsync(element: HTMLElement | undefined | null): void {
+  if (element) {
+    // An element was already queued to be focused, so replace that one with the new element
+    if (targetToFocusOnNextRepaint) {
+      targetToFocusOnNextRepaint = element;
+      return;
+    }
+
+    targetToFocusOnNextRepaint = element;
+
+    // element.focus() is a no-op if the element is no longer in the DOM, meaning this is always safe
+    element.ownerDocument.defaultView.requestAnimationFrame(() => {
+      targetToFocusOnNextRepaint && targetToFocusOnNextRepaint.focus();
+
+      // We are done focusing for this frame, so reset the queued focus element
+      targetToFocusOnNextRepaint = undefined;
+    });
+  }
+}

From 76bb72a2271c4cc0632777403fefda38c660f6bd Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 22 Mar 2018 10:39:03 -0700
Subject: [PATCH 1623/1641] Dropdown: should use (#4342)

* fixing an issue with keydown.

* Adding change file.
---
 .../dropdown_2018-03-22-17-22.json                    | 11 +++++++++++
 .../src/components/Dropdown/Dropdown.tsx              |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/dropdown_2018-03-22-17-22.json

diff --git a/common/changes/office-ui-fabric-react/dropdown_2018-03-22-17-22.json b/common/changes/office-ui-fabric-react/dropdown_2018-03-22-17-22.json
new file mode 100644
index 0000000000000..296d816854ad9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/dropdown_2018-03-22-17-22.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Dropdown: onKeydown should check for defaultPrevented, not preventDefault.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 1150437bae3a7..44733cd04ad06 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -691,7 +691,7 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   private _onDropdownKeyDown = (ev: React.KeyboardEvent<HTMLDivElement>): void => {
     if (this.props.onKeyDown) {
       this.props.onKeyDown(ev);
-      if (ev.preventDefault) {
+      if (ev.defaultPrevented) {
         return;
       }
     }

From f639a03366c3e156d3b7b338da50e2fee7c55f5d Mon Sep 17 00:00:00 2001
From: racbatch <37089629+racbatch@users.noreply.github.com>
Date: Thu, 22 Mar 2018 14:06:59 -0700
Subject: [PATCH 1624/1641] Remove extra tooltip in dropdown (#4272)

* Remove redundant tooltip

* Add change file
---
 .../racbatch-feature_2018-03-14-18-51.json            | 11 +++++++++++
 .../src/components/Dropdown/Dropdown.tsx              |  1 -
 2 files changed, 11 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/racbatch-feature_2018-03-14-18-51.json

diff --git a/common/changes/office-ui-fabric-react/racbatch-feature_2018-03-14-18-51.json b/common/changes/office-ui-fabric-react/racbatch-feature_2018-03-14-18-51.json
new file mode 100644
index 0000000000000..7e570fa6551cc
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/racbatch-feature_2018-03-14-18-51.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Remove the redundant tooltip in a Dropdown command button",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "racbatch@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 44733cd04ad06..380dd22a0c7d3 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -492,7 +492,6 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
             role='option'
             aria-selected={ isItemSelected ? 'true' : 'false' }
             ariaLabel={ item.ariaLabel || item.text }
-            title={ item.text }
           >
             { onRenderOption(item, this._onRenderOption) }
           </CommandButton>

From 4293e416922981422628c31f175359fcfc6eca4b Mon Sep 17 00:00:00 2001
From: Aditi Mandal <aditima@microsoft.com>
Date: Thu, 22 Mar 2018 16:13:17 -0700
Subject: [PATCH 1625/1641]  DetailsList: reset focusedItemIndex after setKey
 changes to fix scrolling after folder navigation (#4336)

* DetailsList: reset focusedItemIndex after setKey changes to fix scrolling after folder navigation

* add change file

* adding a test to cover the scenario

* updating test and fixing a bug
---
 ...ma-initialFocusIndex_2018-03-21-23-20.json | 11 ++++++
 .../DetailsList/DetailsList.test.tsx          | 37 +++++++++++++++++++
 .../components/DetailsList/DetailsList.tsx    |  4 ++
 3 files changed, 52 insertions(+)
 create mode 100644 common/changes/office-ui-fabric-react/aditima-initialFocusIndex_2018-03-21-23-20.json

diff --git a/common/changes/office-ui-fabric-react/aditima-initialFocusIndex_2018-03-21-23-20.json b/common/changes/office-ui-fabric-react/aditima-initialFocusIndex_2018-03-21-23-20.json
new file mode 100644
index 0000000000000..426b79650a700
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/aditima-initialFocusIndex_2018-03-21-23-20.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsList: reset focusedItemIndex after setKey changes to fix scrolling after folder navigation",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "aditima@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.test.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.test.tsx
index 8293ee25684f1..ff097734f9645 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.test.tsx
@@ -118,4 +118,41 @@ describe('DetailsList', () => {
     }, 0);
     jest.runOnlyPendingTimers();
   });
+
+  it('reset focusedItemIndex when setKey updates', () => {
+    jest.useFakeTimers();
+
+    let component: any;
+    const detailsList = mount(
+      <DetailsList
+        items={ mockItems(5) }
+        setKey={ 'key1' }
+        initialFocusedIndex={ 0 }
+        // tslint:disable-next-line:jsx-no-lambda
+        componentRef={ ref => component = ref }
+        skipViewportMeasures={ true }
+        // tslint:disable-next-line:jsx-no-lambda
+        onShouldVirtualize={ () => false }
+      />);
+
+    expect(component).toBeDefined();
+    component.setState({ focusedItemIndex: 3 });
+    setTimeout(() => {
+      expect(component.state.focusedItemIndex).toEqual(3);
+    }, 0);
+    jest.runOnlyPendingTimers();
+
+    // update props to new setKey
+    const newProps = { items: mockItems(7), setKey: 'set2', initialFocusedIndex: 0 };
+    detailsList.setProps(newProps);
+    detailsList.update();
+
+    // verify that focusedItemIndex is reset to 0 and 0th row is focused
+    setTimeout(() => {
+      expect(component.state.focusedItemIndex).toEqual(0);
+      expect(document.activeElement.textContent).toEqual('0');
+      expect(document.activeElement.className.split(' ')).toContain('ms-DetailsRow');
+    }, 0);
+    jest.runOnlyPendingTimers();
+  });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
index 8e7d9b27ca8d1..e3cbb0439d44a 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.tsx
@@ -210,6 +210,10 @@ export class DetailsList extends BaseComponent<IDetailsListProps, IDetailsListSt
 
     if (shouldResetSelection) {
       this._initialFocusedIndex = newProps.initialFocusedIndex;
+      // reset focusedItemIndex when setKey changes
+      this.setState({
+        focusedItemIndex: (this._initialFocusedIndex !== undefined) ? this._initialFocusedIndex : -1
+      });
     }
 
     if (newProps.items !== items) {

From 09072228d65bb12f2adf389da670f53a20f5f8c9 Mon Sep 17 00:00:00 2001
From: Josh Chang <coralbue@gmail.com>
Date: Thu, 22 Mar 2018 17:52:06 -0700
Subject: [PATCH 1626/1641] Removing ability to focus with keyboarding on menu
 buttons for split buttons and and spin boxes (#4222)

* made spin button and base button menu option un-focusable

* added spin button test

* added split button contextual menu change

* got rid of un-needed code

* added change files

* added abillitiy to not focus on primary button for split button, but only on the container

* enter on focus on split button trigger primary action

* added split button style for disabled

* prevent opening submenu if item is disabled

* tighten restrictions on opening split buttons to open with alt + down

* refactored button name and fixed test

* updated bundle size

* changed on menu item click to bw able to take in a keyboard event

* updated package json

* fixed weird tabbing

* changed way we structured the focus

* added stop propagation

* changed split button container key down to work with other buttons now

* update bundle size

* added correct split button container styles

* removed unnecessary attribute

* fixed focusing on menu button when primary button is disabled

* added change to focus

* added aria hidden

* fixed span location and moved TODO

* added support to focus on whole container in split button for contextual menus

* added comment

* fixed styling issues with buttons
---
 .../focus2_2018-03-09-17-45.json              | 11 ++++
 .../src/components/Button/BaseButton.tsx      | 60 ++++++++++++++++---
 .../src/components/Button/Button.test.tsx     |  5 +-
 .../Button/SplitButton/SplitButton.styles.ts  | 25 ++++----
 .../Button/examples/Button.Split.Example.tsx  | 27 +++++++++
 .../ContextualMenu.classNames.ts              |  9 ++-
 .../ContextualMenu/ContextualMenu.styles.ts   | 15 ++---
 .../ContextualMenu/ContextualMenu.tsx         | 46 +++++++++++---
 .../ContextualMenu/ContextualMenu.types.ts    |  4 +-
 .../ContextualMenu.Checkmarks.Example.tsx     | 32 +++++++++-
 .../examples/FocusZone.Tabbable.Example.tsx   | 26 +++++++-
 .../src/components/SpinButton/SpinButton.tsx  |  2 +
 .../__snapshots__/SpinButton.test.tsx.snap    |  4 +-
 13 files changed, 221 insertions(+), 45 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/focus2_2018-03-09-17-45.json

diff --git a/common/changes/office-ui-fabric-react/focus2_2018-03-09-17-45.json b/common/changes/office-ui-fabric-react/focus2_2018-03-09-17-45.json
new file mode 100644
index 0000000000000..6a9d7581ea581
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/focus2_2018-03-09-17-45.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Removed focusability on buttons for split buttons and spin buttons",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "chiechan@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
index 4d94e15a69314..0237c56493ecc 100644
--- a/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/BaseButton.tsx
@@ -163,7 +163,7 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         'aria-label': ariaLabel,
         'aria-labelledby': ariaLabelledBy,
         'aria-describedby': ariaDescribedBy,
-        'data-is-focusable': ((this.props as any)['data-is-focusable'] === false || disabled) ? false : true,
+        'data-is-focusable': ((this.props as any)['data-is-focusable'] === false || disabled || this._isSplitButton) ? false : true,
         'aria-pressed': checked
       }
     );
@@ -200,7 +200,9 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   }
 
   public focus(): void {
-    if (this._buttonElement.value) {
+    if (this._isSplitButton && this._splitButtonContainer.value) {
+      this._splitButtonContainer.value.focus();
+    } else if (this._buttonElement.value) {
       this._buttonElement.value.focus();
     }
   }
@@ -409,6 +411,10 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
   }
 
   private _onToggleMenu = (): void => {
+    if (this._splitButtonContainer.value) {
+      this._splitButtonContainer.value.focus();
+    }
+    const { menuProps } = this.props;
     const currentMenuProps = this.state.menuProps;
     currentMenuProps ? this._dismissMenu() : this._openMenu();
   }
@@ -432,7 +438,14 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         !!this.state.menuProps,
         !!checked);
 
-    buttonProps = { ...buttonProps, onClick: undefined };
+    assign(
+      buttonProps,
+      {
+        onClick: undefined,
+        tabIndex: -1,
+        'data-is-focusable': false
+      }
+    );
 
     return (
       <div
@@ -444,10 +457,11 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
         aria-pressed={ this.props.checked }
         aria-describedby={ buttonProps.ariaDescription }
         className={ classNames && classNames.splitButtonContainer }
-        onKeyDown={ this._onMenuKeyDown }
+        onKeyDown={ this._onSplitButtonContainerKeyDown }
         ref={ this._splitButtonContainer }
         data-is-focusable={ true }
         onClick={ !disabled && !primaryDisabled ? onClick : undefined }
+        tabIndex={ !disabled ? 0 : undefined }
       >
         <span
           style={ { 'display': 'flex' } }
@@ -491,11 +505,10 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
       'iconProps': menuIconProps,
       'ariaLabel': splitButtonAriaLabel,
       'aria-haspopup': true,
-      'aria-expanded': this._isExpanded
+      'aria-expanded': this._isExpanded,
+      'data-is-focusable': false
     };
-
-    return <BaseButton { ...splitButtonProps } onMouseDown={ this._onMouseDown } />;
-
+    return <BaseButton {...splitButtonProps} onMouseDown={ this._onMouseDown } tabIndex={ -1 } />;
   }
 
   private _onMouseDown = (ev: React.MouseEvent<BaseButton>) => {
@@ -506,7 +519,23 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
     ev.preventDefault();
   }
 
+  private _onSplitButtonContainerKeyDown = (ev: React.KeyboardEvent<HTMLDivElement>) => {
+    if (ev.which === KeyCodes.enter) {
+      if (this._buttonElement.value) {
+        this._buttonElement.value.click();
+        ev.preventDefault();
+        ev.stopPropagation();
+      }
+    } else {
+      this._onMenuKeyDown(ev);
+    }
+  }
+
   private _onMenuKeyDown = (ev: React.KeyboardEvent<HTMLDivElement | HTMLAnchorElement | HTMLButtonElement>) => {
+    if (this.props.disabled) {
+      return;
+    }
+
     if (this.props.onKeyDown) {
       this.props.onKeyDown(ev);
     }
@@ -518,13 +547,26 @@ export class BaseButton extends BaseComponent<IBaseButtonProps, IBaseButtonState
 
     if (!ev.defaultPrevented &&
       this.props.menuTriggerKeyCode !== null &&
-      ev.which === (this.props.menuTriggerKeyCode === undefined ? KeyCodes.down : this.props.menuTriggerKeyCode)) {
+      this._isValidMenuOpenKey(ev)) {
       this._onToggleMenu();
       ev.preventDefault();
       ev.stopPropagation();
     }
   }
 
+  /**
+   * Returns if the user hits a valid keyboard key to open the menu
+   * @param ev - the keyboard event
+   * @returns True if user clicks on custom trigger key if enabled or alt + down arrow if not. False otherwise.
+   */
+  private _isValidMenuOpenKey(ev: React.KeyboardEvent<HTMLDivElement | HTMLAnchorElement | HTMLButtonElement>): boolean {
+    if (this.props.menuTriggerKeyCode) {
+      return ev.which === this.props.menuTriggerKeyCode;
+    } else {
+      return ev.which === KeyCodes.down && (ev.altKey || ev.metaKey);
+    }
+  }
+
   private _onMenuClick = (ev: React.MouseEvent<HTMLAnchorElement>) => {
     const { onMenuClick } = this.props;
     if (onMenuClick) {
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
index df1c3edab4bbb..9908bc87ff259 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.test.tsx
@@ -491,7 +491,7 @@ describe('Button', () => {
         expect(didClick).toEqual(true);
       });
 
-      it('Pressing down on SplitButton triggers menu', () => {
+      it('Pressing alt + down on SplitButton triggers menu', () => {
         const renderedDOM: HTMLElement = renderIntoDocument(
           <DefaultButton
             data-automation-id='test'
@@ -519,7 +519,8 @@ describe('Button', () => {
 
         ReactTestUtils.Simulate.keyDown(menuButtonElement,
           {
-            which: KeyCodes.down
+            which: KeyCodes.down,
+            altKey: true
           });
         expect(renderedDOM.getAttribute('aria-expanded')).toEqual('true');
       });
diff --git a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
index 5ad66a78c19cf..c596d1ee0fde6 100644
--- a/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/SplitButton/SplitButton.styles.ts
@@ -19,22 +19,21 @@ export const getStyles = memoizeFunction((
   };
 
   const splitButtonStyles: IButtonStyles = {
-    splitButtonContainer: {
-      position: 'relative',
-      display: 'inline-block',
-      border: '1px solid transparent'
-    },
+    splitButtonContainer: [
+      getFocusStyle(theme, 0, 'relative', buttonHighContrastFocus),
+      {
+        display: 'inline-block'
+      }
+    ],
     splitButtonContainerFocused: {
       outline: 'none!important',
-      border: '1px solid'
     },
-    splitButtonMenuButton: [
-      getFocusStyle(theme, -1, 'relative', buttonHighContrastFocus),
+    splitButtonMenuButton:
       {
         padding: 6,
         height: 'auto',
         boxSizing: 'border-box',
-        border: '1px solid transparent',
+        border: 0,
         borderRadius: 0,
         outline: 'transparent',
         userSelect: 'none',
@@ -45,8 +44,7 @@ export const getStyles = memoizeFunction((
         verticalAlign: 'top',
         width: 32,
         marginLeft: -1
-      }
-    ],
+      },
 
     splitButtonDivider: {
       position: 'absolute',
@@ -72,6 +70,11 @@ export const getStyles = memoizeFunction((
       justifyContent: 'center',
       alignItems: 'center'
     },
+
+    splitButtonContainerDisabled: {
+      outline: 'none',
+      border: 'none'
+    }
   };
 
   return concatStyleSets(splitButtonStyles, customStyles)!;
diff --git a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
index 36049fc90a03c..3ab322885eda6 100644
--- a/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/Button/examples/Button.Split.Example.tsx
@@ -105,6 +105,33 @@ export class ButtonSplitExample extends React.Component<IButtonProps> {
             } }
           />
         </div>
+        <div>
+          <Label>Button Disabled</Label>
+          <DefaultButton
+            primary
+            data-automation-id='test'
+            disabled={ true }
+            checked={ checked }
+            text='Create account'
+            onClick={ alertClicked }
+            split={ true }
+            style={ { height: '35px' } }
+            menuProps={ {
+              items: [
+                {
+                  key: 'emailMessage',
+                  name: 'Email message',
+                  icon: 'Mail'
+                },
+                {
+                  key: 'calendarEvent',
+                  name: 'Calendar event',
+                  icon: 'Calendar'
+                }
+              ]
+            } }
+          />
+        </div>
       </div>
     );
   }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
index d568a25ea8df2..0bd0d9a741f38 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
@@ -198,6 +198,13 @@ export const getItemClassNames = memoizeFunction((
       'ms-ContextualMenu-itemText',
       styles.label
     ],
-    splitContainer: styles.splitButtonFlexContainer,
+    splitContainer: [
+      styles.splitButtonFlexContainer,
+      !disabled && !checked && [{
+        selectors: {
+          '.ms-Fabric.is-focusVisible &:focus, .ms-Fabric.is-focusVisible &:focus:hover': styles.rootFocused,
+        }
+      }]
+    ],
   });
 });
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
index 1a2b87105d7a1..25db1e745942f 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
@@ -168,13 +168,14 @@ export const getMenuItemStyles = memoizeFunction((
       flexShrink: '0',
       fontSize: FontSizes.mini
     },
-    splitButtonFlexContainer: {
-      display: 'flex',
-      height: ContextualMenuItemHeight,
-      flexWrap: 'nowrap',
-      justifyContent: 'center',
-      alignItems: 'center'
-    },
+    splitButtonFlexContainer: [
+      getFocusStyle(theme), {
+        display: 'flex',
+        height: ContextualMenuItemHeight,
+        flexWrap: 'nowrap',
+        justifyContent: 'center',
+        alignItems: 'center',
+      }],
     splitButtonSeparator: {}
   };
 
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
index 49009fea857be..4f531f196a895 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.tsx
@@ -94,6 +94,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   private readonly _navigationIdleDelay: number = 250 /* ms */;
   private _scrollIdleTimeoutId: number | undefined;
 
+  private _splitButtonContainers: Map<string, HTMLDivElement>;
+
   private _adjustedFocusZoneProps: IFocusZoneProps;
 
   constructor(props: IContextualMenuProps) {
@@ -139,6 +141,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
   // Invoked once, only on the client (not on the server), immediately after the initial rendering occurs.
   public componentDidMount() {
     this._events.on(this._targetWindow, 'resize', this.dismiss);
+    this._splitButtonContainers = new Map();
     if (this.props.onMenuOpened) {
       this.props.onMenuOpened(this.props);
     }
@@ -589,23 +592,32 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
     return (
       <div
+        ref={ (el: HTMLDivElement) =>
+          this._splitButtonContainers.set(item.key, el)
+        }
+        role={ 'button' }
         aria-labelledby={ item.ariaLabel }
+        className={ classNames.splitContainer }
         aria-disabled={ this._isItemDisabled(item) }
         aria-haspopup={ true }
         aria-describedby={ item.ariaDescription }
         aria-checked={ item.isChecked || item.checked }
         aria-posinset={ focusableElementIndex + 1 }
         aria-setsize={ totalItemCount }
+        onKeyDown={ this._onSplitContainerItemKeyDown.bind(this, item) }
+        onClick={ this._executeItemClick.bind(this, item) }
+        tabIndex={ 0 }
+        data-is-focusable={ true }
       >
         <span
           aria-hidden={ true }
-          className={ classNames.splitContainer }
+          style={ { display: 'flex', height: '100%' } }
         >
           { this._renderSplitPrimaryButton(item, classNames, index, hasCheckmarks!, hasIcons!) }
           { this._renderSplitDivider(item) }
           { this._renderSplitIconButton(item, classNames, index) }
         </span>
-      </div>
+      </div >
     );
   }
 
@@ -618,7 +630,6 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
     const itemProps = {
       key: item.key,
-      onClick: this._executeItemClick.bind(this, item),
       disabled: this._isItemDisabled(item) || item.primaryDisabled,
       name: item.name,
       className: classNames.splitPrimary,
@@ -627,7 +638,8 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       isChecked: item.isChecked,
       checked: item.checked,
       icon: item.icon,
-      iconProps: item.iconProps
+      iconProps: item.iconProps,
+      'data-is-focusable': false
     } as IContextualMenuItem;
     return React.createElement('button',
       getNativeProps(itemProps, buttonProperties),
@@ -635,6 +647,16 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     );
   }
 
+  private _onSplitContainerItemKeyDown(item: any, ev: React.KeyboardEvent<HTMLElement>) {
+    if (ev.which === KeyCodes.enter) {
+      this._executeItemClick(item, ev);
+      ev.preventDefault();
+      ev.stopPropagation();
+    } else {
+      this._onItemKeyDown(item, ev);
+    }
+  }
+
   private _renderSplitIconButton(item: IContextualMenuItem, classNames: IMenuItemClassNames, index: number) {
     const { contextualMenuItemAs: ChildrenRenderer = ContextualMenuItem } = this.props;
     const itemProps = {
@@ -648,11 +670,11 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
 
     return React.createElement('button',
       assign({}, getNativeProps(itemProps, buttonProperties), {
-        onKeyDown: this._onItemKeyDown.bind(this, item),
         onMouseEnter: this._onItemMouseEnter.bind(this, item),
         onMouseLeave: this._onMouseItemLeave.bind(this, item),
         onMouseDown: (ev: any) => this._onItemMouseDown(item, ev),
-        onMouseMove: this._onItemMouseMove.bind(this, item)
+        onMouseMove: this._onItemMouseMove.bind(this, item),
+        'data-is-focusable': false
       }),
       <ChildrenRenderer item={ itemProps } classNames={ classNames } index={ index } hasIcons={ false } />
     );
@@ -849,7 +871,7 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     ev.stopPropagation();
   }
 
-  private _executeItemClick(item: IContextualMenuItem, ev: React.MouseEvent<HTMLElement>) {
+  private _executeItemClick(item: IContextualMenuItem, ev: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) {
     if (item.disabled || item.isDisabled) {
       return;
     }
@@ -863,10 +885,10 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
     (dismiss || !ev.defaultPrevented) && this.dismiss(ev, true);
   }
 
-  private _onItemKeyDown(item: any, ev: KeyboardEvent) {
+  private _onItemKeyDown(item: any, ev: React.KeyboardEvent<HTMLElement>) {
     const openKey = getRTL() ? KeyCodes.left : KeyCodes.right;
 
-    if (ev.which === openKey) {
+    if (ev.which === openKey && !item.disabled) {
       this._onItemSubMenuExpand(item, ev.currentTarget as HTMLElement);
       ev.preventDefault();
     }
@@ -878,6 +900,12 @@ export class ContextualMenu extends BaseComponent<IContextualMenuProps, IContext
       if (this.state.expandedMenuItemKey) {
         this._onSubMenuDismiss();
       }
+
+      // focus the container so when we close the menu, we focus on the split button container.
+      const el = this._splitButtonContainers.get(item.key);
+      if (el) {
+        el.focus();
+      }
       this.setState({
         expandedMenuItemKey: item.key,
         submenuTarget: target
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
index fd8ef9bc01a7e..a8aeef1bbeb9d 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
@@ -138,7 +138,7 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
    * menu item.
    * Returning true will dismiss the menu even if ev.preventDefault() was called.
    */
-  onItemClick?: (ev?: React.MouseEvent<HTMLElement>, item?: IContextualMenuItem) => boolean | void;
+  onItemClick?: (ev?: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>, item?: IContextualMenuItem) => boolean | void;
 
   /**
    * CSS class to apply to the context menu.
@@ -329,7 +329,7 @@ export interface IContextualMenuItem {
    * Callback issued when the menu item is invoked. If ev.preventDefault() is called in onClick, click will not close menu.
    * Returning true will dismiss the menu even if ev.preventDefault() was called.
    */
-  onClick?: (ev?: React.MouseEvent<HTMLElement>, item?: IContextualMenuItem) => boolean | void;
+  onClick?: (ev?: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>, item?: IContextualMenuItem) => boolean | void;
 
   /**
    * An optional URL to navigate to upon selection
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
index 3e9d34033dc2a..cda9329015042 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx
@@ -7,7 +7,7 @@ export interface IContextualMenuMultiselectExampleState {
   selection?: { [key: string]: boolean };
 }
 
-const keys: string[] = ['newItem', 'share', 'mobile', 'enablePrint', 'enableMusic', 'newSub', 'emailMessage', 'calendarEvent'];
+const keys: string[] = ['newItem', 'share', 'mobile', 'enablePrint', 'enableMusic', 'newSub', 'emailMessage', 'calendarEvent', 'disabledNewSub', 'disabledEmailMessage', 'disabledCalendarEvent'];
 
 export class ContextualMenuCheckmarksExample extends React.Component<{}, IContextualMenuMultiselectExampleState> {
 
@@ -102,6 +102,36 @@ export class ContextualMenuCheckmarksExample extends React.Component<{}, IContex
                   split: true,
                   onClick: this._onToggleSelect,
                 },
+                {
+                  key: keys[8],
+                  iconProps: {
+                    iconName: 'MusicInCollectionFill'
+                  },
+                  subMenuProps: {
+                    items: [
+                      {
+                        key: keys[6],
+                        name: 'Email message',
+                        canCheck: true,
+                        isChecked: selection![keys[9]],
+                        onClick: this._onToggleSelect
+                      },
+                      {
+                        key: keys[7],
+                        name: 'Calendar event',
+                        canCheck: true,
+                        isChecked: selection![keys[10]],
+                        onClick: this._onToggleSelect
+                      }
+                    ],
+                  },
+                  name: 'Split Button',
+                  canCheck: true,
+                  isChecked: selection![keys[8]],
+                  split: true,
+                  onClick: this._onToggleSelect,
+                  disabled: true
+                },
               ]
           }
         }
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Tabbable.Example.tsx b/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Tabbable.Example.tsx
index 14d6d2308c0ce..2fb2a8a02e843 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Tabbable.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/examples/FocusZone.Tabbable.Example.tsx
@@ -2,11 +2,15 @@
 import * as React from 'react';
 /* tslint:enable:no-unused-variable */
 
-import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
+import { DefaultButton, BaseButton } from 'office-ui-fabric-react/lib/Button';
 import { FocusZone, FocusZoneDirection, FocusZoneTabbableElements } from 'office-ui-fabric-react/lib/FocusZone';
 import { TextField } from 'office-ui-fabric-react/lib/TextField';
 import './FocusZone.Tabbable.Example.scss';
 
+const alertClicked = (): void => {
+  alert('Clicked');
+};
+
 export const FocusZoneTabbableExample = () => (
   <div className='ms-FocusZoneTabbableExample'>
     <div className='ms-Row'>
@@ -16,6 +20,26 @@ export const FocusZoneTabbableExample = () => (
         <DefaultButton>Button 2</DefaultButton>
         <TextField value='FocusZone TextField' className='ms-FocusZoneTabbableExample-textField' />
         <DefaultButton>Button 3</DefaultButton>
+        <DefaultButton
+          text='Create account'
+          split={ true }
+          onClick={ alertClicked }
+          splitButtonAriaLabel={ 'See 2 sample options' }
+          menuProps={ {
+            items: [
+              {
+                key: 'emailMessage',
+                name: 'Email message',
+                icon: 'Mail'
+              },
+              {
+                key: 'calendarEvent',
+                name: 'Calendar event',
+                icon: 'Calendar'
+              }
+            ]
+          } }
+        />
       </FocusZone>
     </div>
     <div className='ms-Row'>
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
index f73fbec1ec491..433bc0b8e3316 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.tsx
@@ -227,6 +227,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
               onMouseUp={ this._stop }
               tabIndex={ -1 }
               ariaLabel={ incrementButtonAriaLabel }
+              data-is-focusable={ false }
             />
             <IconButton
               styles={ getArrowButtonStyles(theme!, false, customDownArrowButtonStyles) }
@@ -239,6 +240,7 @@ export class SpinButton extends BaseComponent<ISpinButtonProps, ISpinButtonState
               onMouseUp={ this._stop }
               tabIndex={ -1 }
               ariaLabel={ decrementButtonAriaLabel }
+              data-is-focusable={ false }
             />
           </span>
         </div>
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
index 5195dc0f5eaa6..2e4db82ba4d66 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/__snapshots__/SpinButton.test.tsx.snap
@@ -213,7 +213,7 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
               background-color: Highlight;
               color: HighlightText;
             }
-        data-is-focusable={true}
+        data-is-focusable={false}
         disabled={undefined}
         onMouseDown={[Function]}
         onMouseLeave={[Function]}
@@ -326,7 +326,7 @@ exports[`SpinButton renders SpinButton correctly 1`] = `
               background-color: Highlight;
               color: HighlightText;
             }
-        data-is-focusable={true}
+        data-is-focusable={false}
         disabled={undefined}
         onMouseDown={[Function]}
         onMouseLeave={[Function]}

From dd4b6142206b9884fbfc8c7aa6566930b2cf46df Mon Sep 17 00:00:00 2001
From: Stanley Yao <stanley.yao@microsoft.com>
Date: Thu, 22 Mar 2018 18:13:08 -0700
Subject: [PATCH 1627/1641] Add multiSelect capability for ComboBox (#3906)

* Add multiSelect for ComboBox

* Unbreak a unit test

* rush change

* bug fixes

* Merge from upstream and resolve local build issues

* Fix merge styles

* Fix pending background

* Unbreak unit test cases

* Fix the merge

* Add controled multi-select in the example page to make sure onChanged cb works

* Remove trailing white spaces

* Fix bug: enter key will not trigger onChanged

* Dummy change to trigger another build

* refactor

* Fix some minor bugs
---
 .../stanleyy-fillin_2018-02-07-00-36.json     |  11 +
 .../components/ComboBox/ComboBox.styles.ts    |   5 +-
 .../src/components/ComboBox/ComboBox.tsx      | 383 ++++++++++++------
 .../src/components/ComboBox/ComboBox.types.ts |   5 +
 .../examples/ComboBox.Basic.Example.tsx       | 129 +++++-
 .../src/components/Dropdown/Dropdown.tsx      |   5 +-
 .../SelectableDroppableText.types.ts          |   4 +-
 7 files changed, 392 insertions(+), 150 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/stanleyy-fillin_2018-02-07-00-36.json

diff --git a/common/changes/office-ui-fabric-react/stanleyy-fillin_2018-02-07-00-36.json b/common/changes/office-ui-fabric-react/stanleyy-fillin_2018-02-07-00-36.json
new file mode 100644
index 0000000000000..3930100a40a96
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/stanleyy-fillin_2018-02-07-00-36.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add multiSelect capability for ComboBox",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "stanleyy@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
index 1d357dc9ecd08..1361c542ad94f 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.styles.ts
@@ -53,7 +53,8 @@ const getListOptionHighContrastStyles = memoizeFunction((theme: ITheme): IRawSty
 export const getOptionStyles = memoizeFunction((
   theme: ITheme,
   customStylesForAllOptions?: Partial<IComboBoxOptionStyles>,
-  customOptionStylesForCurrentOption?: Partial<IComboBoxOptionStyles>
+  customOptionStylesForCurrentOption?: Partial<IComboBoxOptionStyles>,
+  isPending?: boolean
 ): Partial<IComboBoxOptionStyles> => {
 
   const { semanticColors, palette } = theme;
@@ -67,7 +68,7 @@ export const getOptionStyles = memoizeFunction((
   const optionStyles: IComboBoxOptionStyles = {
     root: [
       {
-        backgroundColor: 'transparent',
+        backgroundColor: isPending ? ComboBoxOptionBackgroundHovered : 'transparent',
         boxSizing: 'border-box',
         cursor: 'pointer',
         display: 'block',
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index f3dd413faee6e..61e21df8e95b9 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -3,6 +3,7 @@ import { IComboBoxOption, IComboBoxProps } from './ComboBox.types';
 import { DirectionalHint } from '../../common/DirectionalHint';
 import { Callout } from '../../Callout';
 import { Label } from '../../Label';
+import { Checkbox } from '../../Checkbox';
 import {
   CommandButton,
   IconButton
@@ -36,8 +37,8 @@ export interface IComboBoxState {
   // The open state
   isOpen?: boolean;
 
-  // The currently selected index (-1 if no index is selected)
-  selectedIndex: number;
+  // The currently selected indices
+  selectedIndices?: number[];
 
   // The focused state of the comboBox
   focused?: boolean;
@@ -143,19 +144,20 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       'defaultSelectedKey': 'selectedKey',
       'value': 'defaultSelectedKey',
       'selectedKey': 'value',
-      'dropdownWidth': 'useComboBoxAsMenuWidth'
+      'dropdownWidth': 'useComboBoxAsMenuWidth',
     });
 
     this._id = props.id || getId('ComboBox');
 
-    const selectedKey = props.defaultSelectedKey !== undefined ? props.defaultSelectedKey : props.selectedKey;
+    const selectedKeys: (string | number)[] = this._getSelectedKeys(props.defaultSelectedKey, props.selectedKey);
+
     this._isScrollIdle = true;
 
-    const index: number = this._getSelectedIndex(props.options, selectedKey);
+    const initialSelectedIndices: number[] = this._getSelectedIndices(props.options, selectedKeys);
 
     this.state = {
       isOpen: false,
-      selectedIndex: index,
+      selectedIndices: initialSelectedIndices,
       focused: false,
       suggestedDisplayValue: '',
       currentOptions: this.props.options,
@@ -176,11 +178,11 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     if (newProps.selectedKey !== this.props.selectedKey ||
       newProps.value !== this.props.value ||
       newProps.options !== this.props.options) {
-
-      const index: number = this._getSelectedIndex(newProps.options, newProps.selectedKey);
+      const selectedKeys: string[] | number[] = this._getSelectedKeys(undefined, newProps.selectedKey);
+      const indices: number[] = this._getSelectedIndices(newProps.options, selectedKeys);
 
       this.setState({
-        selectedIndex: index,
+        selectedIndices: indices,
         currentOptions: newProps.options
       });
     }
@@ -196,7 +198,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     const {
       isOpen,
       focused,
-      selectedIndex,
+      selectedIndices,
       currentPendingValueValidIndex
     } = this.state;
 
@@ -230,7 +232,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     // we need to set selection
     if (this._focusInputAfterClose && (prevState.isOpen && !isOpen ||
       (focused &&
-        ((!isOpen && prevState.selectedIndex !== selectedIndex) ||
+        ((!isOpen && !this.props.multiSelect && prevState.selectedIndices && selectedIndices && prevState.selectedIndices[0] !== selectedIndices[0]) ||
           !allowFreeform || value !== prevProps.value)
       ))) {
       this._select();
@@ -275,7 +277,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       theme,
       title
     } = this.props;
-    const { isOpen, focused, suggestedDisplayValue } = this.state;
+    const { isOpen, selectedIndices, focused, suggestedDisplayValue } = this.state;
     this._currentVisibleValue = this._getVisibleValue();
 
     const divProps = getNativeProps(this.props, divProperties);
@@ -344,8 +346,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
             title={ title }
           />
           <IconButton
-            className={ 'ms-ComboBox-CaretDown-button' }
-            styles={ this._getCaretButtonStyles() }
+            className={'ms-ComboBox-CaretDown-button'}
+            styles={this._getCaretButtonStyles()}
             role='presentation'
             aria-hidden={ isButtonAriaHidden }
             data-is-focusable={ false }
@@ -357,7 +359,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
           />
         </div>
 
-        { isOpen && (
+        {isOpen && (
           (onRenderContainer as any)({
             ...this.props,
             onRenderList,
@@ -366,13 +368,13 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
             options: this.state.currentOptions.map((item, index) => ({ ...item, index: index }))
           },
             this._onRenderContainer)
-        ) }
+        )}
         {
           errorMessage &&
           <div
-            className={ this._classNames.errorMessage }
+            className={this._classNames.errorMessage}
           >
-            { errorMessage }
+            {errorMessage}
           </div>
         }
       </div>
@@ -450,12 +452,13 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       autoComplete
     } = this.props;
     const {
-      selectedIndex,
+      selectedIndices,
       currentPendingValueValidIndex,
       currentOptions,
       currentPendingValue,
       suggestedDisplayValue,
-      isOpen
+      isOpen,
+      focused
     } = this.state;
 
     const currentPendingIndexValid = this._indexWithinBounds(currentOptions, currentPendingValueValidIndex);
@@ -466,41 +469,63 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       return value;
     }
 
-    let index = selectedIndex;
+    // Values to display in the BaseAutoFill area
+    const displayValues = [];
 
-    if (allowFreeform) {
-      // If we are allowing freeform and autocomplete is also true
-      // and we've got a pending value that matches an option, remember
-      // the matched option's index
-      if (autoComplete === 'on' && currentPendingIndexValid) {
-        index = currentPendingValueValidIndex;
+    if (this.props.multiSelect) {
+      // MUlti-select
+      if (focused) {
+        let index = -1;
+        if (autoComplete === 'on' && currentPendingIndexValid) {
+          index = currentPendingValueValidIndex;
+        }
+        displayValues.push(currentPendingValue !== '' ? currentPendingValue : (this._indexWithinBounds(currentOptions, index) ? currentOptions[index].text : ''));
+      } else {
+        for (let idx = 0; selectedIndices && (idx < selectedIndices.length); idx ++) {
+          const index: number = selectedIndices[idx];
+          displayValues.push(this._indexWithinBounds(currentOptions, index) ? currentOptions[index].text : suggestedDisplayValue);
+        }
       }
-
-      // Since we are allowing freeform, if there is currently a nonempty pending value, use that
-      // otherwise use the index determined above (falling back to '' if we did not get a valid index)
-      return currentPendingValue !== '' ? currentPendingValue : (this._indexWithinBounds(currentOptions, index) ? currentOptions[index].text : '');
-
     } else {
-
-      // If we are not allowing freeform and have a
-      // valid index that matches the pending value,
-      // we know we will need some version of the pending value
-      if (currentPendingIndexValid) {
-
-        // If autoComplete is on, return the
-        // raw pending value, otherwise remember
+      // Single-select
+      let index: number = this._getFirstSelectedIndex();
+      if (allowFreeform) {
+        // If we are allowing freeform and autocomplete is also true
+        // and we've got a pending value that matches an option, remember
         // the matched option's index
-        if (autoComplete === 'on') {
-          return currentPendingValue;
+        if (autoComplete === 'on' && currentPendingIndexValid) {
+          index = currentPendingValueValidIndex;
         }
 
-        index = currentPendingValueValidIndex;
+        // Since we are allowing freeform, if there is currently a nonempty pending value, use that
+        // otherwise use the index determined above (falling back to '' if we did not get a valid index)
+        displayValues.push(currentPendingValue !== '' ? currentPendingValue : (this._indexWithinBounds(currentOptions, index) ? currentOptions[index].text : ''));
+      } else {
+        // If we are not allowing freeform and have a
+        // valid index that matches the pending value,
+        // we know we will need some version of the pending value
+        if (currentPendingIndexValid && autoComplete === 'on') {
+          // If autoComplete is on, return the
+          // raw pending value, otherwise remember
+          // the matched option's index
+          index = currentPendingValueValidIndex;
+          displayValues.push(currentPendingValue);
+        } else {
+          displayValues.push(this._indexWithinBounds(currentOptions, index) ? currentOptions[index].text : suggestedDisplayValue);
+        }
       }
+    }
 
-      // If we have a valid index then return the text value of that option,
-      // otherwise return the suggestedDisplayValue
-      return this._indexWithinBounds(currentOptions, index) ? currentOptions[index].text : suggestedDisplayValue;
+    // If we have a valid index then return the text value of that option,
+    // otherwise return the suggestedDisplayValue
+    let displayString = '';
+    for (let idx = 0; idx < displayValues.length; idx++) {
+      if (idx > 0) {
+        displayString += ', ';
+      }
+      displayString += displayValues[idx];
     }
+    return displayString;
   }
 
   /**
@@ -591,7 +616,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       currentPendingValue,
       currentPendingValueValidIndex,
       currentOptions,
-      selectedIndex
+      selectedIndices
     } = this.state;
 
     if (this.props.autoComplete === 'on') {
@@ -637,7 +662,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     // If we get here, either autoComplete is on or we did not find a match with autoComplete on.
     // Remember we are not allowing freeform, so at this point, if we have a pending valid value index
     // use that; otherwise use the selectedIndex
-    const index = currentPendingValueValidIndex >= 0 ? currentPendingValueValidIndex : selectedIndex;
+    const index = currentPendingValueValidIndex >= 0 ? currentPendingValueValidIndex : this._getFirstSelectedIndex();
 
     // Since we are not allowing freeform, we need to
     // set both the pending and suggested values/index
@@ -646,6 +671,10 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     this._setPendingInfoFromIndex(index);
   }
 
+  private _getFirstSelectedIndex(): number {
+    return (this.state.selectedIndices && this.state.selectedIndices.length > 0) ? this.state.selectedIndices[0] : -1;
+  }
+
   /**
    * Walk along the options starting at the index, stepping by the delta (positive or negative)
    * looking for the next valid selectable index (e.g. skipping headings and dividers)
@@ -694,7 +723,12 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    */
   private _setSelectedIndex(index: number, searchDirection: SearchDirection = SearchDirection.none) {
     const { onChanged, onPendingValueChanged } = this.props;
-    const { selectedIndex, currentOptions } = this.state;
+    const { currentOptions } = this.state;
+    let { selectedIndices } = this.state;
+
+    if (!selectedIndices) {
+      selectedIndices = [];
+    }
 
     // Find the next selectable index, if searchDirection is none
     // we will get our starting index back
@@ -706,12 +740,25 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
     // Are we at a new index? If so, update the state, otherwise
     // there is nothing to do
-    if (index !== selectedIndex) {
+    if (this.props.multiSelect || selectedIndices.length < 1 || (selectedIndices.length === 1 && selectedIndices[0] !== index)) {
       const option: IComboBoxOption = currentOptions[index];
+      if (!option) {
+        return;
+      }
+      if (this.props.multiSelect) {
+        option.selected = !option.selected;
+        if (option.selected && selectedIndices.indexOf(index) < 0) {
+          selectedIndices.push(index);
+        } else if (!option.selected && selectedIndices.indexOf(index) >= 0) {
+          selectedIndices = selectedIndices.filter((value: number) => value !== index);
+        }
+      } else {
+        selectedIndices[0] = index;
+      }
 
       // Set the selected option
       this.setState({
-        selectedIndex: index
+        selectedIndices: selectedIndices
       });
 
       // If ComboBox value is changed, revert preview first
@@ -797,7 +844,9 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
     if (this.state.focused) {
       this.setState({ focused: false });
-      this._submitPendingValue();
+      if (!this.props.multiSelect) {
+        this._submitPendingValue();
+      }
     }
   }
 
@@ -816,6 +865,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       currentOptions,
       currentPendingValueValidIndexOnHover
     } = this.state;
+    let { selectedIndices } = this.state;
 
     // If we allow freeform and we have a pending value, we
     // need to handle that
@@ -847,10 +897,15 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         // If we are not controlled, create a new option
         const newOption: IComboBoxOption = { key: currentPendingValue, text: currentPendingValue };
         const newOptions: IComboBoxOption[] = [...currentOptions, newOption];
-
+        if (selectedIndices) {
+          if (!this.props.multiSelect) {
+            selectedIndices = [];
+          }
+          selectedIndices.push(newOptions.length - 1);
+        }
         this.setState({
           currentOptions: newOptions,
-          selectedIndex: newOptions.length - 1
+          selectedIndices: selectedIndices
         });
       }
     } else if (currentPendingValueValidIndex >= 0) {
@@ -878,11 +933,11 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
     return (
       <Callout
-        isBeakVisible={ false }
-        gapSpace={ 0 }
-        doNotLayer={ false }
-        directionalHint={ DirectionalHint.bottomLeftEdge }
-        directionalHintFixed={ true }
+        isBeakVisible={false}
+        gapSpace={0}
+        doNotLayer={false}
+        directionalHint={DirectionalHint.bottomLeftEdge}
+        directionalHintFixed={true}
         { ...calloutProps }
         className={ css(this._classNames.callout, calloutProps ? calloutProps.className : undefined) }
         target={ this._comboBoxWrapper.value }
@@ -897,7 +952,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         <div className={ this._classNames.optionsContainerWrapper } ref={ this._comboBoxMenu }>
           { (onRenderList as any)({ ...props }, this._onRenderList) }
         </div>
-        { onRenderLowerContent(this.props, this._onRenderLowerContent) }
+        {onRenderLowerContent(this.props, this._onRenderLowerContent)}
       </Callout>
     );
   }
@@ -912,12 +967,12 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     const id = this._id;
     return (
       <div
-        id={ id + '-list' }
-        className={ this._classNames.optionsContainer }
-        aria-labelledby={ id + '-label' }
+        id={id + '-list'}
+        className={this._classNames.optionsContainer}
+        aria-labelledby={id + '-label'}
         role='listbox'
       >
-        { options.map((item) => (onRenderItem as any)(item, this._onRenderItem)) }
+        {options.map((item) => (onRenderItem as any)(item, this._onRenderItem))}
       </div>
     );
   }
@@ -947,8 +1002,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       return (
         <div
           role='separator'
-          key={ key }
-          className={ this._classNames.divider }
+          key={key}
+          className={this._classNames.divider}
         />
       );
     }
@@ -968,29 +1023,48 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     const { onRenderOption = this._onRenderOptionContent } = this.props;
     const id = this._id;
     const isSelected: boolean = this._isOptionSelected(item.index);
-    const rootClassNames = getComboBoxOptionClassNames(this._getCurrentOptionStyles(item)).root;
+    const optionStyles = this._getCurrentOptionStyles(item);
 
     return (
-      <CommandButton
-        id={ id + '-list' + item.index }
-        key={ item.key }
-        data-index={ item.index }
-        className={ rootClassNames }
-        styles={ this._getCurrentOptionStyles(item) }
-        checked={ isSelected }
-        onClick={ this._onItemClick(item.index) }
-        onMouseEnter={ this._onOptionMouseEnter.bind(this, item.index) }
-        onMouseMove={ this._onOptionMouseMove.bind(this, item.index) }
-        onMouseLeave={ this._onOptionMouseLeave }
-        role='option'
-        aria-selected={ isSelected ? true : false }
-        ariaLabel={ item.text }
-        disabled={ item.disabled }
-      > { <span ref={ this._selectedElement }>
-        { onRenderOption(item, this._onRenderOptionContent) }
-      </span>
-        }
-      </CommandButton>
+      !this.props.multiSelect ? (
+        <CommandButton
+          id={ id + '-list' + item.index }
+          key={ item.key }
+          data-index={ item.index }
+          styles={ optionStyles }
+          checked={ isSelected }
+          className={ 'ms-ComboBox-option' }
+          onClick={ this._onItemClick(item.index) }
+          onMouseEnter={ this._onOptionMouseEnter.bind(this, item.index) }
+          onMouseMove={ this._onOptionMouseMove.bind(this, item.index) }
+          onMouseLeave={ this._onOptionMouseLeave }
+          role='option'
+          aria-selected={ isSelected ? 'true' : 'false'}
+          ariaLabel= {item.text }
+          disabled={ item.disabled }
+        > { <span ref={ this._selectedElement }>
+          { onRenderOption(item, this._onRenderOptionContent) }
+        </span>
+          }
+        </CommandButton>
+      ) : (
+        <Checkbox
+          id={id + '-list' + item.index}
+          ref={'option' + item.index}
+          key={item.key}
+          data-index={item.index}
+          styles={optionStyles}
+          className={'ms-ComboBox-option'}
+          data-is-focusable={true}
+          onChange={this._onItemClick(item.index!)}
+          label={item.text}
+          role='option'
+          aria-selected={ isSelected ? 'true' : 'false' }
+          checked={isSelected}
+        >
+          {onRenderOption(item, this._onRenderOptionContent)}
+        </Checkbox>
+      )
     );
   }
 
@@ -1017,7 +1091,15 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       return false;
     }
 
-    return this._getPendingSelectedIndex(true /* includePendingValue */) === index;
+    if (!this.props.multiSelect && this._getPendingSelectedIndex(true /* includePendingValue */) === index) {
+      return true;
+    }
+
+    let idxOfSelectedIndex = -1;
+    if ((index !== undefined) && this.state.selectedIndices) {
+      idxOfSelectedIndex = this.state.selectedIndices.indexOf(index);
+    }
+    return (idxOfSelectedIndex >= 0);
   }
 
   /**
@@ -1030,7 +1112,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
       currentPendingValueValidIndexOnHover,
       currentPendingValueValidIndex,
       currentPendingValue,
-      selectedIndex
+      selectedIndices
     } = this.state;
 
     return (
@@ -1038,7 +1120,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
         currentPendingValueValidIndexOnHover :
         (currentPendingValueValidIndex >= 0 || (includeCurrentPendingValue && currentPendingValue !== '')) ?
           currentPendingValueValidIndex :
-          selectedIndex
+          this.props.multiSelect ? 0 : this._getFirstSelectedIndex()
     );
   }
 
@@ -1069,12 +1151,12 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     const {
       currentPendingValueValidIndex,
       currentPendingValue,
-      selectedIndex
+      selectedIndices
     } = this.state;
 
     if (onScrollToItem) {
       // Use the custom scroll handler
-      onScrollToItem((currentPendingValueValidIndex >= 0 || currentPendingValue !== '') ? currentPendingValueValidIndex : selectedIndex);
+      onScrollToItem((currentPendingValueValidIndex >= 0 || currentPendingValue !== '') ? currentPendingValueValidIndex : this._getFirstSelectedIndex());
     } else if (this._selectedElement.value && this._selectedElement.value.offsetParent) {
       // We are using refs, scroll the ref into view
       if (scrollSelectedToTop) {
@@ -1105,7 +1187,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
   private _onRenderOptionContent = (item: IComboBoxOption): JSX.Element => {
     const optionClassNames = getComboBoxOptionClassNames(this._getCurrentOptionStyles(item));
-    return <span className={ optionClassNames.optionText }>{ item.text }</span>;
+    return <span className={optionClassNames.optionText}>{item.text}</span>;
   }
 
   /**
@@ -1116,9 +1198,12 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   private _onItemClick(index: number | undefined): () => void {
     return (): void => {
       this._setSelectedIndex(index as number);
-      this.setState({
-        isOpen: false
-      });
+      if (!this.props.multiSelect) {
+        // only close the callout when it's in single-select mode
+        this.setState({
+          isOpen: false
+        });
+      }
     };
   }
 
@@ -1142,15 +1227,22 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
   /**
    * Get the index of the option that is marked as selected
    * @param options - the comboBox options
-   * @param selectedKey - the known selected key to find
+   * @param selectedKeys - the known selected key to find
    * @returns { number } - the index of the selected option, -1 if not found
    */
-  private _getSelectedIndex(options: IComboBoxOption[] | undefined, selectedKey: string | number | undefined): number {
-    if (options === undefined || selectedKey === undefined) {
-      return -1;
+  private _getSelectedIndices(options: IComboBoxOption[] | undefined, selectedKeys: (string | number | undefined)[]): number[] {
+    const selectedIndices: any[] = [];
+    if (options === undefined || selectedKeys === undefined) {
+      return selectedIndices;
     }
 
-    return findIndex(options, (option => (option.selected || option.key === selectedKey)));
+    for (const selectedKey of selectedKeys) {
+      const index = findIndex(options, (option => (option.selected || option.key === selectedKey)));
+      if (index > -1) {
+        selectedIndices.push(index);
+      }
+    }
+    return selectedIndices;
   }
 
   /**
@@ -1161,7 +1253,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    */
   private _resetSelectedIndex() {
     const {
-      selectedIndex,
+      selectedIndices,
       currentOptions
     } = this.state;
     if (this._comboBox.value) {
@@ -1169,6 +1261,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     }
     this._clearPendingInfo();
 
+    const selectedIndex: number = this._getFirstSelectedIndex();
     if (selectedIndex > 0 && selectedIndex < currentOptions.length) {
       this.setState({
         suggestedDisplayValue: currentOptions[selectedIndex].text
@@ -1227,7 +1320,10 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * @param searchDirection - the direction to search
    */
   private _setPendingInfoFromIndexAndDirection(index: number, searchDirection: SearchDirection) {
-    const { currentOptions } = this.state;
+    const {
+      isOpen,
+      currentOptions
+    } = this.state;
 
     index = this._getNextSelectableIndex(index, searchDirection);
     if (this._indexWithinBounds(currentOptions, index)) {
@@ -1293,7 +1389,8 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     const {
       isOpen,
       currentOptions,
-      currentPendingValueValidIndexOnHover
+      currentPendingValueValidIndexOnHover,
+      selectedIndices
     } = this.state;
 
     if (disabled) {
@@ -1305,34 +1402,36 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
 
     switch (ev.which) {
       case KeyCodes.enter:
-        // On enter submit the pending value
         this._submitPendingValue();
-
-        // if we are open or
-        // if we are not allowing freeform or
-        // our we have no pending value
-        // and no valid pending index
-        // flip the open state
-        if ((isOpen ||
-          ((!allowFreeform ||
-            this.state.currentPendingValue === undefined ||
-            this.state.currentPendingValue === null ||
-            this.state.currentPendingValue.length <= 0) &&
-            this.state.currentPendingValueValidIndex < 0))) {
+        if (this.props.multiSelect && isOpen) {
           this.setState({
-            isOpen: !isOpen
+            currentPendingValueValidIndex: index
           });
-        }
-
-        // Allow TAB to propigate
-        if (ev.which as number === KeyCodes.tab) {
-          return;
+        } else {
+          // On enter submit the pending value
+          if ((isOpen ||
+            ((!allowFreeform ||
+              this.state.currentPendingValue === undefined ||
+              this.state.currentPendingValue === null ||
+              this.state.currentPendingValue.length <= 0) &&
+              this.state.currentPendingValueValidIndex < 0))) {
+            // if we are open or
+            // if we are not allowing freeform or
+            // our we have no pending value
+            // and no valid pending index
+            // flip the open state
+            this.setState({
+              isOpen: !isOpen
+            });
+          }
         }
         break;
 
       case KeyCodes.tab:
         // On enter submit the pending value
-        this._submitPendingValue();
+        if (!this.props.multiSelect) {
+          this._submitPendingValue();
+        }
 
         // If we are not allowing freeform
         // or the comboBox is open, flip the open state
@@ -1574,7 +1673,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     const { comboBoxOptionStyles: customStylesForAllOptions } = this.props;
     const { styles: customStylesForCurrentOption } = item;
 
-    return getOptionStyles(this.props.theme!, customStylesForAllOptions, customStylesForCurrentOption);
+    return getOptionStyles(this.props.theme!, customStylesForAllOptions, customStylesForCurrentOption, this._isPendingOption(item));
   }
 
   /**
@@ -1582,7 +1681,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
    * @returns the id of the current focused combo item, otherwise the id of the currently selected element, null otherwise
    */
   private _getAriaActiveDescentValue(): string | null {
-    let descendantText = (this.state.isOpen && (this.state.selectedIndex as number) >= 0 ? (this._id + '-list' + this.state.selectedIndex) : null);
+    let descendantText = (this.state.isOpen && this.state.selectedIndices && this.state.selectedIndices.length >= 0 ? (this._id + '-list' + this.state.selectedIndices[0]) : null);
     if (this.state.isOpen && this.state.focused && this.state.currentPendingValueValidIndex !== -1) {
       descendantText = (this._id + '-list' + this.state.currentPendingValueValidIndex);
     }
@@ -1598,4 +1697,36 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     const autoComplete = !this.props.disabled && this.props.autoComplete === 'on';
     return autoComplete ? (this.props.allowFreeform ? 'inline' : 'both') : 'none';
   }
+
+  private _isPendingOption(item: IComboBoxOption): boolean {
+    return item && item.index === this.state.currentPendingValueValidIndex;
+  }
+
+  private _getSelectedKeys(
+    defaultSelectedKey: string | number | string[] | number[] | undefined,
+    selectedKey: string | number | string[] | number[] | undefined
+  ): string[] | number[] {
+
+    let retKeys: string[] | number[] = [];
+
+    if (defaultSelectedKey) {
+      if (defaultSelectedKey instanceof Array) {
+        retKeys = defaultSelectedKey;
+      } else if (typeof defaultSelectedKey === 'string') {
+        retKeys = [defaultSelectedKey as string];
+      } else if (typeof defaultSelectedKey === 'number') {
+        retKeys = [defaultSelectedKey as number];
+      }
+    } else if (selectedKey) {
+      if (selectedKey instanceof Array) {
+        retKeys = selectedKey;
+      } else if (typeof selectedKey === 'string') {
+        retKeys = [selectedKey as string];
+      } else if (typeof selectedKey === 'number') {
+        retKeys = [selectedKey as number];
+      }
+    }
+
+    return retKeys;
+  }
 }
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
index 4a8d53820f8b4..f42806a614f70 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
@@ -154,6 +154,11 @@ export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox>
    */
   useComboBoxAsMenuWidth?: boolean;
 
+  /**
+   * Optional mode indicates if multi-choice selections is allowed.  Default to false
+   */
+  multiSelect?: boolean;
+
   /**
    * Sets the 'aria-hidden' attribute on the ComboBox's button element instructing screen readers how to handle the element. This element is hidden by default because all functionality is handled by the input element and the arrow button is only meant to be decorative.
    * @default true
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
index 118e160b76f93..ffe90d3376b96 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
@@ -12,10 +12,34 @@ import { SelectableOptionMenuItemType } from 'office-ui-fabric-react/lib/utiliti
 import { IComboBox } from '../ComboBox.types';
 import { PrimaryButton } from '../../../Button';
 
+const INITIAL_OPTIONS =
+[
+  { key: 'Header', text: 'Theme Fonts', itemType: SelectableOptionMenuItemType.Header },
+  { key: 'A', text: 'Arial Black', fontFamily: '"Arial Black", "Arial Black_MSFontService", sans-serif' },
+  { key: 'B', text: 'Time New Roman', fontFamily: '"Times New Roman", "Times New Roman_MSFontService", serif' },
+  { key: 'C', text: 'Comic Sans MS', fontFamily: '"Comic Sans MS", "Comic Sans MS_MSFontService", fantasy' },
+  { key: 'C1', text: 'Calibri', fontFamily: 'Calibri, Calibri_MSFontService, sans-serif' },
+  { key: 'divider_2', text: '-', itemType: SelectableOptionMenuItemType.Divider },
+  { key: 'Header1', text: 'Other Options', itemType: SelectableOptionMenuItemType.Header },
+  { key: 'D', text: 'Option d' },
+  { key: 'E', text: 'Option e' },
+  { key: 'F', text: 'Option f' },
+  { key: 'G', text: 'Option g' },
+  { key: 'H', text: 'Option h' },
+  { key: 'I', text: 'Option i' },
+  { key: 'J', text: 'Option j' }
+];
+
 export class ComboBoxBasicExample extends React.Component<{}, {
+  // For controled single select
   options: IComboBoxOption[];
   selectedOptionKey?: string | number;
   value?: string;
+
+  // For controled multi select
+  optionsMulti: IComboBoxOption[];
+  selectedOptionKeys?: string[];
+  valueMulti?: string;
 }> {
   private _testOptions =
     [{ key: 'Header', text: 'Theme Fonts', itemType: SelectableOptionMenuItemType.Header },
@@ -47,6 +71,7 @@ export class ComboBoxBasicExample extends React.Component<{}, {
     super(props);
     this.state = {
       options: [],
+      optionsMulti: [],
       selectedOptionKey: undefined,
       value: 'Calibri'
     };
@@ -61,6 +86,7 @@ export class ComboBoxBasicExample extends React.Component<{}, {
 
   public render() {
     const { options, selectedOptionKey, value } = this.state;
+    const { optionsMulti, selectedOptionKeys, valueMulti } = this.state;
 
     return (
       <div className='ms-ComboBoxBasicExample'>
@@ -88,6 +114,23 @@ export class ComboBoxBasicExample extends React.Component<{}, {
           onClick={ this._basicComboBoxOnClick }
         />
 
+        <ComboBox
+          multiSelect
+          defaultSelectedKey={ ['C', 'E'] }
+          label='Basic uncontrolled multi select example (allowFreeform: T, AutoComplete: T):'
+          id='Basicdrop11'
+          ariaLabel='Basic ComboBox example'
+          allowFreeform={ true }
+          autoComplete='on'
+          options={ this._testOptions }
+          onRenderOption={ this._onRenderFontOption }
+          // tslint:disable:jsx-no-lambda
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
+          onMenuOpen={ () => console.log('ComboBox menu opened') }
+          // tslint:enable:jsx-no-lambda
+        />
+
         <ComboBox
           defaultSelectedKey='C'
           label='Basic uncontrolled example (allowFreeform: T, AutoComplete: F):'
@@ -225,6 +268,25 @@ export class ComboBoxBasicExample extends React.Component<{}, {
           // tslint:enable:jsx-no-lambda
           />
         }
+
+        <ComboBox
+          multiSelect
+          selectedKey={ this.state.selectedOptionKeys }
+          label='Basic controlled ComboBox multi-select example:'
+          id='Basicdrop5'
+          ariaLabel='Basic controlled ComboBox multi-select example'
+          allowFreeform={ true }
+          autoComplete='on'
+          options={ optionsMulti }
+          onChanged={ this._onChangedMulti }
+          onResolveOptions={ this._getOptionsMulti }
+          onRenderOption={ this._onRenderFontOption }
+          // tslint:disable:jsx-no-lambda
+          onFocus={ () => console.log('onFocus called') }
+          onBlur={ () => console.log('onBlur called') }
+          onMenuOpen={ () => console.log('ComboBox menu opened') }
+          // tslint:enable:jsx-no-lambda
+        />
       </div>
 
     );
@@ -261,30 +323,28 @@ export class ComboBoxBasicExample extends React.Component<{}, {
       return this.state.options;
     }
 
-    const newOptions =
-      [
-        { key: 'Header', text: 'Theme Fonts', itemType: SelectableOptionMenuItemType.Header },
-        { key: 'A', text: 'Arial Black', fontFamily: '"Arial Black", "Arial Black_MSFontService", sans-serif' },
-        { key: 'B', text: 'Time New Roman', fontFamily: '"Times New Roman", "Times New Roman_MSFontService", serif' },
-        { key: 'C', text: 'Comic Sans MS', fontFamily: '"Comic Sans MS", "Comic Sans MS_MSFontService", fantasy' },
-        { key: 'C1', text: 'Calibri', fontFamily: 'Calibri, Calibri_MSFontService, sans-serif' },
-        { key: 'divider_2', text: '-', itemType: SelectableOptionMenuItemType.Divider },
-        { key: 'Header1', text: 'Other Options', itemType: SelectableOptionMenuItemType.Header },
-        { key: 'D', text: 'Option d' },
-        { key: 'E', text: 'Option e' },
-        { key: 'F', text: 'Option f' },
-        { key: 'G', text: 'Option g' },
-        { key: 'H', text: 'Option h' },
-        { key: 'I', text: 'Option i' },
-        { key: 'J', text: 'Option j' }
-      ];
     this.setState({
-      options: newOptions,
+      options: INITIAL_OPTIONS,
       selectedOptionKey: 'C1',
       value: undefined
     });
 
-    return newOptions;
+    return INITIAL_OPTIONS;
+  }
+
+  private _getOptionsMulti(currentOptions: IComboBoxOption[]): IComboBoxOption[] {
+
+    if (this.state.options.length > 0) {
+      return this.state.optionsMulti;
+    }
+
+    this.setState({
+      optionsMulti: INITIAL_OPTIONS,
+      selectedOptionKeys: [ 'C1' ],
+      value: undefined
+    });
+
+    return INITIAL_OPTIONS;
   }
 
   private _onChanged = (option: IComboBoxOption, index: number, value: string): void => {
@@ -309,6 +369,37 @@ export class ComboBoxBasicExample extends React.Component<{}, {
     }
   }
 
+  private _onChangedMulti = (option: IComboBoxOption, index: number, value: string) => {
+    if (option !== undefined) {
+      // User selected/de-selected an existing option
+      this.setState({
+        selectedOptionKeys: this._updateSelectedOptionKeys(this.state.selectedOptionKeys || [], option),
+        valueMulti: undefined
+      });
+    } else if (value !== undefined) {
+      // User typed a freeform option
+      const newOption: IComboBoxOption = { key: value, text: value };
+      const updatedSelectedKeys: string[] = this.state.selectedOptionKeys ? [...this.state.selectedOptionKeys, newOption.key as string] : [newOption.key as string];
+      this.setState({
+        optionsMulti: [...this.state.optionsMulti, newOption],
+        selectedOptionKeys: updatedSelectedKeys,
+        valueMulti: undefined
+      });
+    }
+  }
+
+  private _updateSelectedOptionKeys = (selectedKeys: string[], option: IComboBoxOption): string[] => {
+    if (selectedKeys && option) {
+      const index = selectedKeys.indexOf(option.key as string);
+      if (option.selected && index < 0) {
+        selectedKeys.push(option.key as string);
+      } else {
+        selectedKeys.splice(index, 1);
+      }
+    }
+    return selectedKeys;
+  }
+
   private _basicComboBoxOnClick = (): void => {
     this._basicCombobox.focus(true);
   }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
index 380dd22a0c7d3..b4e9161767a97 100644
--- a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.tsx
@@ -627,7 +627,10 @@ export class Dropdown extends BaseComponent<IDropdownInternalProps, IDropdownSta
   }
 
   // Get all selected indexes for multi-select mode
-  private _getSelectedIndexes(options: IDropdownOption[], selectedKey: string | number | string[] | number[] | undefined): number[] {
+  private _getSelectedIndexes(
+    options: IDropdownOption[],
+    selectedKey: string | number | string[] | number[] | undefined
+  ): number[] {
     if (selectedKey === undefined) {
       if (this.props.multiSelect) {
         return this._getAllSelectedIndices(options);
diff --git a/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.types.ts b/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.types.ts
index 0a8e359c88a9c..7fc413898ed32 100644
--- a/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.types.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.types.ts
@@ -33,13 +33,13 @@ export interface ISelectableDroppableTextProps<T> extends React.HTMLAttributes<T
   /**
    * The key that will be initially used to set a selected item.
    */
-  defaultSelectedKey?: string | number;
+  defaultSelectedKey?: string | number | string[] | number[];
 
   /**
    * The key of the selected item. If you provide this, you must maintain selection
    * state by observing onChange events and passing a new value in when changed.
    */
-  selectedKey?: string | number;
+  selectedKey?: string | number | string[] | number[];
 
   /**
    * Collection of options for this ISelectableDroppableText

From 3cf84de0d272905f8010ad2b1584441b28b3e576 Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Fri, 23 Mar 2018 01:29:22 +0000
Subject: [PATCH 1628/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../mariust-focusAsync_2018-03-19-15-01.json  | 11 -----
 ...ma-initialFocusIndex_2018-03-21-23-20.json | 11 -----
 .../dropdown_2018-03-22-17-22.json            | 11 -----
 .../focus2_2018-03-09-17-45.json              | 11 -----
 .../mariust-focusAsync_2018-03-19-15-01.json  | 11 -----
 .../racbatch-feature_2018-03-14-18-51.json    | 11 -----
 .../stanleyy-fillin_2018-02-07-00-36.json     | 11 -----
 packages/example-app-base/package.json        |  2 +-
 packages/experiments/package.json             |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 46 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 17 ++++++-
 packages/office-ui-fabric-react/package.json  |  4 +-
 packages/styling/package.json                 |  2 +-
 packages/utilities/CHANGELOG.json             | 14 ++++++
 packages/utilities/CHANGELOG.md               |  9 +++-
 packages/utilities/package.json               |  2 +-
 21 files changed, 95 insertions(+), 90 deletions(-)
 delete mode 100644 common/changes/@uifabric/utilities/mariust-focusAsync_2018-03-19-15-01.json
 delete mode 100644 common/changes/office-ui-fabric-react/aditima-initialFocusIndex_2018-03-21-23-20.json
 delete mode 100644 common/changes/office-ui-fabric-react/dropdown_2018-03-22-17-22.json
 delete mode 100644 common/changes/office-ui-fabric-react/focus2_2018-03-09-17-45.json
 delete mode 100644 common/changes/office-ui-fabric-react/mariust-focusAsync_2018-03-19-15-01.json
 delete mode 100644 common/changes/office-ui-fabric-react/racbatch-feature_2018-03-14-18-51.json
 delete mode 100644 common/changes/office-ui-fabric-react/stanleyy-fillin_2018-02-07-00-36.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 0912c7ab892eb..8890af7bcd6fb 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.68.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.69.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 892c655e254fd..01f526c98bc28 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.68.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.69.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 683f927b0aeed..980d69d34ae7d 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.68.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.69.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index 937466d7173f8..cc0c94086caec 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.68.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.69.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index cb7a2351e74c9..baba6bf0bda34 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.68.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.69.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/common/changes/@uifabric/utilities/mariust-focusAsync_2018-03-19-15-01.json b/common/changes/@uifabric/utilities/mariust-focusAsync_2018-03-19-15-01.json
deleted file mode 100644
index fb9d82a2f365d..0000000000000
--- a/common/changes/@uifabric/utilities/mariust-focusAsync_2018-03-19-15-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Introduced focusAsync for cheaper element focusing",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "mariust@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/aditima-initialFocusIndex_2018-03-21-23-20.json b/common/changes/office-ui-fabric-react/aditima-initialFocusIndex_2018-03-21-23-20.json
deleted file mode 100644
index 426b79650a700..0000000000000
--- a/common/changes/office-ui-fabric-react/aditima-initialFocusIndex_2018-03-21-23-20.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsList: reset focusedItemIndex after setKey changes to fix scrolling after folder navigation",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "aditima@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/dropdown_2018-03-22-17-22.json b/common/changes/office-ui-fabric-react/dropdown_2018-03-22-17-22.json
deleted file mode 100644
index 296d816854ad9..0000000000000
--- a/common/changes/office-ui-fabric-react/dropdown_2018-03-22-17-22.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Dropdown: onKeydown should check for defaultPrevented, not preventDefault.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/focus2_2018-03-09-17-45.json b/common/changes/office-ui-fabric-react/focus2_2018-03-09-17-45.json
deleted file mode 100644
index 6a9d7581ea581..0000000000000
--- a/common/changes/office-ui-fabric-react/focus2_2018-03-09-17-45.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Removed focusability on buttons for split buttons and spin buttons",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "chiechan@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/mariust-focusAsync_2018-03-19-15-01.json b/common/changes/office-ui-fabric-react/mariust-focusAsync_2018-03-19-15-01.json
deleted file mode 100644
index 6c14a3b283149..0000000000000
--- a/common/changes/office-ui-fabric-react/mariust-focusAsync_2018-03-19-15-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Introduced focusAsync for cheaper element focusing, and made FocusTrapZone utilize it",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mariust@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/racbatch-feature_2018-03-14-18-51.json b/common/changes/office-ui-fabric-react/racbatch-feature_2018-03-14-18-51.json
deleted file mode 100644
index 7e570fa6551cc..0000000000000
--- a/common/changes/office-ui-fabric-react/racbatch-feature_2018-03-14-18-51.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Remove the redundant tooltip in a Dropdown command button",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "racbatch@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/stanleyy-fillin_2018-02-07-00-36.json b/common/changes/office-ui-fabric-react/stanleyy-fillin_2018-02-07-00-36.json
deleted file mode 100644
index 3930100a40a96..0000000000000
--- a/common/changes/office-ui-fabric-react/stanleyy-fillin_2018-02-07-00-36.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Add multiSelect capability for ComboBox",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "stanleyy@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index c3944353e2fd2..905ce4a6572db 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@uifabric/styling": ">=5.20.0 <6.0.0",
-    "@uifabric/utilities": ">=5.19.1 <6.0.0",
+    "@uifabric/utilities": ">=5.20.0 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 87abc1acfb195..03f621b938c56 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.68.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.69.0 <6.0.0",
     "@uifabric/icons": ">=5.6.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 3e902f0096c39..2dfcae310db8e 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,52 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.69.0",
+      "tag": "office-ui-fabric-react_v5.69.0",
+      "date": "Fri, 23 Mar 2018 01:29:21 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Aditi Mandal <aditima@microsoft.com>",
+            "commit": "4293e416922981422628c31f175359fcfc6eca4b",
+            "comment": "DetailsList: reset focusedItemIndex after setKey changes to fix scrolling after folder navigation"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "76bb72a2271c4cc0632777403fefda38c660f6bd",
+            "comment": "Dropdown: onKeydown should check for defaultPrevented, not preventDefault."
+          },
+          {
+            "author": "Josh Chang <coralbue@gmail.com>",
+            "commit": "09072228d65bb12f2adf389da670f53a20f5f8c9",
+            "comment": "Removed focusability on buttons for split buttons and spin buttons"
+          },
+          {
+            "author": "racbatch <37089629+racbatch@users.noreply.github.com>",
+            "commit": "f639a03366c3e156d3b7b338da50e2fee7c55f5d",
+            "comment": "Remove the redundant tooltip in a Dropdown command button"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Marius Tennøe <mariust@outlook.com>",
+            "commit": "b152150b7222ff499f2f552ce3117e0d27eb1e23",
+            "comment": "Introduced focusAsync for cheaper element focusing, and made FocusTrapZone utilize it"
+          },
+          {
+            "author": "Stanley Yao <stanley.yao@microsoft.com>",
+            "commit": "dd4b6142206b9884fbfc8c7aa6566930b2cf46df",
+            "comment": "Add multiSelect capability for ComboBox"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.19.1 <6.0.0` to `>=5.20.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.68.0",
       "tag": "office-ui-fabric-react_v5.68.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 0d8845e607fd2..3bbfa843243ab 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,21 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Thu, 22 Mar 2018 10:14:03 GMT and should not be manually modified.
+This log was last generated on Fri, 23 Mar 2018 01:29:21 GMT and should not be manually modified.
+
+## 5.69.0
+Fri, 23 Mar 2018 01:29:21 GMT
+
+### Minor changes
+
+- Introduced focusAsync for cheaper element focusing, and made FocusTrapZone utilize it
+- Add multiSelect capability for ComboBox
+
+### Patches
+
+- DetailsList: reset focusedItemIndex after setKey changes to fix scrolling after folder navigation
+- Dropdown: onKeydown should check for defaultPrevented, not preventDefault.
+- Removed focusability on buttons for split buttons and spin buttons
+- Remove the redundant tooltip in a Dropdown command button
 
 ## 5.68.0
 Thu, 22 Mar 2018 10:14:03 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 123846fc4b7bb..face60267270b 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.68.0",
+  "version": "5.69.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -51,7 +51,7 @@
     "@uifabric/icons": ">=5.6.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "@uifabric/styling": ">=5.20.0 <6.0.0",
-    "@uifabric/utilities": ">=5.19.1 <6.0.0",
+    "@uifabric/utilities": ">=5.20.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 9820cb4d0c043..4957aac4bf5cb 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -28,7 +28,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.19.1 <6.0.0",
+    "@uifabric/utilities": ">=5.20.0 <6.0.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "tslib": "^1.7.1"
   }
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 0ee4243650175..8a1e0b3a7f0da 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.20.0",
+      "tag": "@uifabric/utilities_v5.20.0",
+      "date": "Fri, 23 Mar 2018 01:29:21 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Marius Tennøe <mariust@outlook.com>",
+            "commit": "b152150b7222ff499f2f552ce3117e0d27eb1e23",
+            "comment": "Introduced focusAsync for cheaper element focusing"
+          }
+        ]
+      }
+    },
     {
       "version": "5.19.1",
       "tag": "@uifabric/utilities_v5.19.1",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index f36a9efe5a8b2..736615eb62f69 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Wed, 21 Mar 2018 10:18:30 GMT and should not be manually modified.
+This log was last generated on Fri, 23 Mar 2018 01:29:21 GMT and should not be manually modified.
+
+## 5.20.0
+Fri, 23 Mar 2018 01:29:21 GMT
+
+### Minor changes
+
+- Introduced focusAsync for cheaper element focusing
 
 ## 5.19.1
 Wed, 21 Mar 2018 10:18:29 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index c993ce5885512..dcf488b63db50 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.19.1",
+  "version": "5.20.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",

From a511d86a7ba845ff7f8cec6ec53a373c1afeac3a Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 22 Mar 2018 18:42:05 -0700
Subject: [PATCH 1629/1641] Update .npmignore

---
 packages/office-ui-fabric-react/.npmignore | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/office-ui-fabric-react/.npmignore b/packages/office-ui-fabric-react/.npmignore
index bc156d511e38c..be924ccb83d16 100644
--- a/packages/office-ui-fabric-react/.npmignore
+++ b/packages/office-ui-fabric-react/.npmignore
@@ -12,6 +12,7 @@ images
 results
 *.build.log
 dist/*.stats.html
+dist/*.stats.json
 dist/demo*.*
 gulpfile.js
 index.html
@@ -26,4 +27,4 @@ tsd.json
 tslint.json
 typings
 webpack.config.js
-fabric-test*
\ No newline at end of file
+fabric-test*

From 6f12f1eaee6fe24773512ada7f5f52a2523ae6ff Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Thu, 22 Mar 2018 18:42:24 -0700
Subject: [PATCH 1630/1641] Update .npmignore

---
 packages/experiments/.npmignore | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/experiments/.npmignore b/packages/experiments/.npmignore
index 1ac203702d64d..8e3e77dd7bf6c 100644
--- a/packages/experiments/.npmignore
+++ b/packages/experiments/.npmignore
@@ -12,6 +12,7 @@ images
 results
 *.build.log
 dist/*.stats.html
+dist/*.stats.json
 dist/demo*.*
 gulpfile.js
 index.html
@@ -27,4 +28,4 @@ tslint.json
 typings
 webpack.config.js
 fabric-test*
-visualtests
\ No newline at end of file
+visualtests

From a0e09698ae1443623e202087360986f65a613559 Mon Sep 17 00:00:00 2001
From: Mark Polak <mark@thedutchies.com>
Date: Fri, 23 Mar 2018 21:40:10 +0100
Subject: [PATCH 1631/1641] Make sure componentRef types match base component
 type (#4330)

* Fix types for componentRef

* Add npm change files
---
 ...pes-match-BaseComponent-type_2018-03-21-08-31.json | 11 +++++++++++
 ...pes-match-BaseComponent-type_2018-03-21-08-31.json | 11 +++++++++++
 ...pes-match-BaseComponent-type_2018-03-21-08-31.json | 11 +++++++++++
 .../src/components/CommandBar/CommandBar.types.ts     |  2 +-
 .../ExtendedPicker/BaseExtendedPicker.types.ts        |  2 +-
 .../experiments/src/components/Form/Form.types.ts     |  5 ++++-
 .../experiments/src/components/Keytip/Keytip.types.ts |  2 +-
 .../src/components/KeytipLayer/KeytipLayer.types.ts   |  2 +-
 .../SelectedItemsList/BaseSelectedItemsList.types.ts  |  2 +-
 .../src/components/Shimmer/Shimmer.types.ts           |  2 +-
 .../Shimmer/ShimmerCircle/ShimmerCircle.types.ts      |  2 +-
 .../Shimmer/ShimmerLine/ShimmerLine.types.ts          |  2 +-
 .../src/components/TilesList/TilesList.types.ts       |  2 +-
 .../src/components/Autofill/Autofill.types.ts         |  2 +-
 .../src/components/Breadcrumb/Breadcrumb.types.ts     |  2 +-
 .../src/components/Button/Button.types.ts             |  2 +-
 .../src/components/Calendar/Calendar.types.ts         |  2 +-
 .../src/components/Callout/Callout.types.ts           |  2 +-
 .../src/components/Check/Check.types.ts               |  2 +-
 .../src/components/Checkbox/Checkbox.types.ts         |  2 +-
 .../src/components/ChoiceGroup/ChoiceGroup.types.ts   |  2 +-
 .../src/components/Coachmark/Beak/Beak.types.ts       |  2 +-
 .../src/components/Coachmark/Coachmark.types.ts       |  2 +-
 .../PositioningContainer.types.ts                     |  2 +-
 .../src/components/ComboBox/ComboBox.types.ts         |  2 +-
 .../src/components/CommandBar/CommandBar.types.ts     |  2 +-
 .../components/ContextualMenu/ContextualMenu.types.ts |  2 +-
 .../src/components/DatePicker/DatePicker.types.ts     |  2 +-
 .../src/components/DetailsList/DetailsHeader.tsx      |  2 +-
 .../src/components/DetailsList/DetailsList.types.ts   |  2 +-
 .../src/components/Dialog/Dialog.types.ts             |  2 +-
 .../src/components/Dialog/DialogContent.types.ts      |  2 +-
 .../src/components/Dialog/DialogFooter.types.ts       |  2 +-
 .../src/components/DocumentCard/DocumentCard.types.ts |  2 +-
 .../src/components/Facepile/Facepile.types.ts         |  2 +-
 .../components/FocusTrapZone/FocusTrapZone.types.ts   |  2 +-
 .../src/components/FocusZone/FocusZone.types.ts       |  2 +-
 .../src/components/GroupedList/GroupedList.types.ts   |  2 +-
 .../src/components/HoverCard/ExpandingCard.types.ts   |  2 +-
 .../src/components/HoverCard/HoverCard.types.ts       |  2 +-
 .../src/components/Image/Image.types.ts               |  2 +-
 .../src/components/Label/Label.types.ts               |  2 +-
 .../src/components/Layer/Layer.types.ts               |  2 +-
 .../src/components/Layer/LayerHost.types.ts           |  2 +-
 .../src/components/Link/Link.types.ts                 |  2 +-
 .../src/components/List/List.types.ts                 |  2 +-
 .../MarqueeSelection/MarqueeSelection.types.ts        |  2 +-
 .../src/components/MessageBar/MessageBar.types.ts     |  2 +-
 .../src/components/Modal/Modal.types.ts               |  2 +-
 .../src/components/Nav/Nav.types.ts                   |  2 +-
 .../src/components/OverflowSet/OverflowSet.types.ts   |  2 +-
 .../src/components/Overlay/Overlay.types.ts           |  2 +-
 .../src/components/Panel/Panel.types.ts               |  2 +-
 .../src/components/Persona/Persona.types.ts           |  2 +-
 .../src/components/Pivot/Pivot.types.ts               |  2 +-
 .../src/components/Popup/Popup.types.ts               |  2 +-
 .../ProgressIndicator/ProgressIndicator.types.ts      |  2 +-
 .../src/components/Rating/Rating.types.ts             |  2 +-
 .../src/components/ResizeGroup/ResizeGroup.types.ts   |  2 +-
 .../components/ScrollablePane/ScrollablePane.types.ts |  2 +-
 .../src/components/SearchBox/SearchBox.types.ts       |  2 +-
 .../src/components/Slider/Slider.test.tsx             |  2 +-
 .../src/components/Slider/Slider.types.ts             |  2 +-
 .../src/components/SpinButton/SpinButton.types.ts     |  2 +-
 .../src/components/Spinner/Spinner.types.ts           |  2 +-
 .../src/components/Sticky/Sticky.types.ts             |  2 +-
 .../SwatchColorPicker/SwatchColorPicker.types.ts      |  2 +-
 .../components/TeachingBubble/TeachingBubble.types.ts |  2 +-
 .../src/components/TextField/TextField.types.ts       |  2 +-
 .../src/components/Toggle/Toggle.types.ts             |  2 +-
 .../src/components/Tooltip/Tooltip.types.ts           |  2 +-
 .../src/components/Tooltip/TooltipHost.types.ts       |  2 +-
 .../src/components/pickers/BasePicker.types.ts        |  2 +-
 .../src/utilities/grid/Grid.types.ts                  |  2 +-
 .../selectableOption/SelectableDroppableText.types.ts |  2 +-
 packages/utilities/src/createRef.ts                   |  2 +-
 76 files changed, 109 insertions(+), 73 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
 create mode 100644 common/changes/@uifabric/utilities/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
 create mode 100644 common/changes/office-ui-fabric-react/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json

diff --git a/common/changes/@uifabric/experiments/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json b/common/changes/@uifabric/experiments/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
new file mode 100644
index 0000000000000..110fc80a26052
--- /dev/null
+++ b/common/changes/@uifabric/experiments/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Update componentRef types",
+      "type": "patch"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json b/common/changes/@uifabric/utilities/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
new file mode 100644
index 0000000000000..44f253f09522b
--- /dev/null
+++ b/common/changes/@uifabric/utilities/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Update createRef type",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json b/common/changes/office-ui-fabric-react/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
new file mode 100644
index 0000000000000..39fa5bda11fe9
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Update componentRef types",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "mark@thedutchies.com"
+}
\ No newline at end of file
diff --git a/packages/experiments/src/components/CommandBar/CommandBar.types.ts b/packages/experiments/src/components/CommandBar/CommandBar.types.ts
index 9231023f6e94b..de60ed112a184 100644
--- a/packages/experiments/src/components/CommandBar/CommandBar.types.ts
+++ b/packages/experiments/src/components/CommandBar/CommandBar.types.ts
@@ -24,7 +24,7 @@ export interface ICommandBarProps extends React.HTMLAttributes<HTMLDivElement> {
    * Optional callback to access the ICommandBar interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ICommandBar) => void;
+  componentRef?: (component: ICommandBar | null) => void;
 
   /**
    * Items to render
diff --git a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts
index df410ca4b822b..74b779422d1ea 100644
--- a/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts
+++ b/packages/experiments/src/components/ExtendedPicker/BaseExtendedPicker.types.ts
@@ -17,7 +17,7 @@ export interface IBaseExtendedPicker<T> {
 // and searched for by the people picker. For example, if the picker is
 // displaying persona's than type T could either be of Persona or Ipersona props
 export interface IBaseExtendedPickerProps<T> {
-  componentRef?: (component?: IBaseExtendedPicker<T>) => void;
+  componentRef?: (component?: IBaseExtendedPicker<T> | null) => void;
 
   /**
    * Header/title element for the picker
diff --git a/packages/experiments/src/components/Form/Form.types.ts b/packages/experiments/src/components/Form/Form.types.ts
index ae181f468c8cf..6a531b5be8bef 100644
--- a/packages/experiments/src/components/Form/Form.types.ts
+++ b/packages/experiments/src/components/Form/Form.types.ts
@@ -1,11 +1,14 @@
 /* tslint:disable:no-any */
 import * as React from 'react';
 
+export interface IForm {
+}
+
 /**
  * The props for Form
  */
 export interface IFormProps extends React.AllHTMLAttributes<HTMLFormElement> {
-  componentRef?: (component: any) => void;
+  componentRef?: (component: IForm | null) => void;
 
   /** The submit handler. Passes back results keyed by the names of the inputs */
   onSubmit?: (results: { [key: string]: any }) => void;
diff --git a/packages/experiments/src/components/Keytip/Keytip.types.ts b/packages/experiments/src/components/Keytip/Keytip.types.ts
index 9f5c4094c8595..5c9d5fadd2b95 100644
--- a/packages/experiments/src/components/Keytip/Keytip.types.ts
+++ b/packages/experiments/src/components/Keytip/Keytip.types.ts
@@ -11,7 +11,7 @@ export interface IKeytipProps {
    * Optional callback to access the Keytip component. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IKeytip) => void;
+  componentRef?: (component: IKeytip | null) => void;
 
   /**
    * Content to put inside the keytip
diff --git a/packages/experiments/src/components/KeytipLayer/KeytipLayer.types.ts b/packages/experiments/src/components/KeytipLayer/KeytipLayer.types.ts
index c060857d2b8a0..807972d320c9c 100644
--- a/packages/experiments/src/components/KeytipLayer/KeytipLayer.types.ts
+++ b/packages/experiments/src/components/KeytipLayer/KeytipLayer.types.ts
@@ -7,7 +7,7 @@ export interface IKeytipLayerProps extends React.Props<KeytipLayer> {
    * Optional callback to access the KeytipLayer component. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: KeytipLayer) => void;
+  componentRef?: (component: KeytipLayer | null) => void;
 
   /**
    * The DOM ID to use as the hostId for the child keytips
diff --git a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.types.ts b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.types.ts
index b0f82dfbaefe9..c737bdf20e423 100644
--- a/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.types.ts
+++ b/packages/experiments/src/components/SelectedItemsList/BaseSelectedItemsList.types.ts
@@ -17,7 +17,7 @@ export interface ISelectedItemProps<T> extends IPickerItemProps<T> {
 // For example, if the picker is displaying persona's than type T could either be of Persona or Ipersona props
 // tslint:disable-next-line:no-any
 export interface IBaseSelectedItemsListProps<T> extends React.Props<any> {
-  componentRef?: (component?: IBaseSelectedItemsList<T>) => void;
+  componentRef?: (component?: IBaseSelectedItemsList<T> | null) => void;
 
   /**
    * The selection
diff --git a/packages/experiments/src/components/Shimmer/Shimmer.types.ts b/packages/experiments/src/components/Shimmer/Shimmer.types.ts
index 2a221f9ff398f..8b8d01f8380a9 100644
--- a/packages/experiments/src/components/Shimmer/Shimmer.types.ts
+++ b/packages/experiments/src/components/Shimmer/Shimmer.types.ts
@@ -16,7 +16,7 @@ export interface IShimmerProps extends React.AllHTMLAttributes<HTMLElement> {
    * Optional callback to access the IShimmer interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IShimmer) => void;
+  componentRef?: (component: IShimmer | null) => void;
 
   /**
    * Sets the width of the shimmer wave wrapper in percentages.
diff --git a/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.types.ts b/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.types.ts
index 4f5511464fd16..75b4dc9e80477 100644
--- a/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.types.ts
+++ b/packages/experiments/src/components/Shimmer/ShimmerCircle/ShimmerCircle.types.ts
@@ -17,7 +17,7 @@ export interface IShimmerCircleProps extends React.AllHTMLAttributes<HTMLElement
    * Optional callback to access the IShimmerCircle interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IShimmerCircle) => void;
+  componentRef?: (component: IShimmerCircle | null) => void;
 
   /**
    * Sets the height of the circle.
diff --git a/packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.types.ts b/packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.types.ts
index 976743a51c757..12306c1f21f45 100644
--- a/packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.types.ts
+++ b/packages/experiments/src/components/Shimmer/ShimmerLine/ShimmerLine.types.ts
@@ -17,7 +17,7 @@ export interface IShimmerLineProps extends React.AllHTMLAttributes<HTMLElement>
    * Optional callback to access the IShimmerLine interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IShimmerLine) => void;
+  componentRef?: (component: IShimmerLine | null) => void;
 
   /**
    * Sets the height of the rectangle.
diff --git a/packages/experiments/src/components/TilesList/TilesList.types.ts b/packages/experiments/src/components/TilesList/TilesList.types.ts
index 43636b91c24cf..d61e6d3ebcb0f 100644
--- a/packages/experiments/src/components/TilesList/TilesList.types.ts
+++ b/packages/experiments/src/components/TilesList/TilesList.types.ts
@@ -107,7 +107,7 @@ export interface ITilesListProps<TItem> extends IBaseProps, React.Props<TilesLis
   /**
    * Component ref for the focus zone within the list. Use this to control auto-focus.
    */
-  focusZoneComponentRef?: (focusZone: IFocusZone) => void;
+  focusZoneComponentRef?: (focusZone: IFocusZone | null) => void;
   /**
    * Callback for when the active element within the list's FocusZone changes.
    */
diff --git a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.types.ts b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.types.ts
index e1d976c987d23..aa5e655e96f4b 100644
--- a/packages/office-ui-fabric-react/src/components/Autofill/Autofill.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Autofill/Autofill.types.ts
@@ -45,7 +45,7 @@ export interface IAutofillProps extends
   /**
    * Gets the compoonent ref.
    */
-  componentRef?: (componentRef?: IAutofill) => void;
+  componentRef?: (componentRef?: IAutofill | null) => void;
 
   /**
    * The suggested autofill value that will display.
diff --git a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.types.ts b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.types.ts
index 8f86b53001adc..2fc3bfa3c8c51 100644
--- a/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Breadcrumb/Breadcrumb.types.ts
@@ -13,7 +13,7 @@ export interface IBreadcrumbProps extends React.Props<Breadcrumb> {
    * Optional callback to access the IBreadcrumb interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IBreadcrumb) => void;
+  componentRef?: (component: IBreadcrumb | null) => void;
 
   /**
    * Collection of breadcrumbs to render
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.types.ts b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
index f0ceaad542dd6..ecabfd26030d1 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
@@ -30,7 +30,7 @@ export interface IButtonProps extends React.AllHTMLAttributes<HTMLAnchorElement
    * Optional callback to access the IButton interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IButton) => void;
+  componentRef?: (component: IButton | null) => void;
 
   /**
    * If provided, this component will be rendered as an anchor.
diff --git a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.types.ts b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.types.ts
index a833fe1adc7a9..e3f731dcea3fb 100644
--- a/packages/office-ui-fabric-react/src/components/Calendar/Calendar.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Calendar/Calendar.types.ts
@@ -14,7 +14,7 @@ export interface ICalendarProps extends React.Props<Calendar> {
    * Optional callback to access the ICalendar interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ICalendar) => void;
+  componentRef?: (component: ICalendar | null) => void;
 
   /**
   * Callback issued when a date is selected
diff --git a/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts b/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
index b238fa93c4152..80cf8f12fca3b 100644
--- a/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Callout/Callout.types.ts
@@ -16,7 +16,7 @@ export interface ICalloutProps {
    * Optional callback to access the ICallout interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ICallout) => void;
+  componentRef?: (component: ICallout | null) => void;
 
   /**
    * The target that the Callout should try to position itself based on.
diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.types.ts b/packages/office-ui-fabric-react/src/components/Check/Check.types.ts
index eaee9b82f93cc..a4f350943605a 100644
--- a/packages/office-ui-fabric-react/src/components/Check/Check.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.types.ts
@@ -7,7 +7,7 @@ export interface ICheckProps extends React.Props<CheckBase> {
   /**
    * Gets the component ref.
    */
-  componentRef?: (component: ICheckProps) => void;
+  componentRef?: (component: ICheckProps | null) => void;
 
   /**
    * Whether or not this menu item is currently checked.
diff --git a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.types.ts b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.types.ts
index 2a9398d9e36c2..0cfcf54f9eeda 100644
--- a/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Checkbox/Checkbox.types.ts
@@ -23,7 +23,7 @@ export interface ICheckboxProps extends React.ButtonHTMLAttributes<HTMLElement |
    * Optional callback to access the ICheckbox interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ICheckbox) => void;
+  componentRef?: (component: ICheckbox | null) => void;
 
   /**
    * Additional class name to provide on the root element, in addition to the ms-Checkbox class.
diff --git a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.types.ts b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.types.ts
index c33df4544c589..b6555eba09455 100644
--- a/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ChoiceGroup/ChoiceGroup.types.ts
@@ -11,7 +11,7 @@ export interface IChoiceGroupProps extends React.InputHTMLAttributes<HTMLElement
    * Optional callback to access the IChoiceGroup interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IChoiceGroup) => void;
+  componentRef?: (component: IChoiceGroup | null) => void;
 
   /**
    * The options for the choice group.
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.types.ts b/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.types.ts
index 487e5246e2e6e..ae4db0cb36c42 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/Beak/Beak.types.ts
@@ -7,7 +7,7 @@ export interface IBeakProps extends React.Props<Beak> {
   /**
   * All props for your component are to be defined here.
   */
-  componentRef?: (component: IBeak) => void;
+  componentRef?: (component: IBeak | null) => void;
 
   /**
    * Beak width.
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.types.ts b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.types.ts
index 5b836fa39ea09..ebecf59fe72e5 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/Coachmark.types.ts
@@ -8,7 +8,7 @@ export interface ICoachmark {
 }
 
 export interface ICoachmarkTypes extends React.Props<Coachmark> {
-  componentRef?: (component: ICoachmark) => void;
+  componentRef?: (component: ICoachmark | null) => void;
 
   /**
    * Get styles method.
diff --git a/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.types.ts b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.types.ts
index cd95dd470a953..693b311e77c52 100644
--- a/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Coachmark/PositioningContainer/PositioningContainer.types.ts
@@ -21,7 +21,7 @@ export interface IPositioningContainerTypes extends React.Props<PositioningConta
   /**
   * All props for your component are to be defined here.
   */
-  componentRef?: (component: IPositioningContainer) => void;
+  componentRef?: (component: IPositioningContainer | null) => void;
   /**
    * The target that the positioningContainer should try to position itself based on.
    * It can be either an HTMLElement a querySelector string of a valid HTMLElement
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
index f42806a614f70..f73bd90d5a2dc 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.types.ts
@@ -33,7 +33,7 @@ export interface IComboBoxProps extends ISelectableDroppableTextProps<IComboBox>
    * Optional callback to access the IComboBox interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IComboBox) => void;
+  componentRef?: (component: IComboBox | null) => void;
 
   /**
    * Collection of options for this ComboBox
diff --git a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.types.ts b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.types.ts
index fb74b38ee7ad4..216e55194332c 100644
--- a/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.types.ts
+++ b/packages/office-ui-fabric-react/src/components/CommandBar/CommandBar.types.ts
@@ -13,7 +13,7 @@ export interface ICommandBarProps extends React.HTMLAttributes<HTMLDivElement> {
    * Optional callback to access the ICommandBar interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ICommandBar) => void;
+  componentRef?: (component: ICommandBar | null) => void;
 
   /**
    * Whether or not the search box is visible
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
index a8aeef1bbeb9d..550192d5354e7 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
@@ -33,7 +33,7 @@ export interface IContextualMenuProps extends React.Props<ContextualMenu>, IWith
    * Optional callback to access the IContextualMenu interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IContextualMenu) => void;
+  componentRef?: (component: IContextualMenu | null) => void;
 
   /**
    * The target that the ContextualMenu should try to position itself based on.
diff --git a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
index 590ec481a33a4..e9f3528982bc4 100644
--- a/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
+++ b/packages/office-ui-fabric-react/src/components/DatePicker/DatePicker.types.ts
@@ -14,7 +14,7 @@ export interface IDatePickerProps extends React.Props<DatePicker> {
    * Optional callback to access the IDatePicker interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IDatePicker) => void;
+  componentRef?: (component: IDatePicker | null) => void;
 
   /**
    * Pass calendar props to calendar component
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index 90fc0e3968904..c6bd6b1a8cd8c 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -33,7 +33,7 @@ export interface IDetailsHeader {
 }
 
 export interface IDetailsHeaderProps extends React.Props<DetailsHeader> {
-  componentRef?: (component: IDetailsHeader) => void;
+  componentRef?: (component: IDetailsHeader | null) => void;
   columns: IColumn[];
   selection: ISelection;
   selectionMode: SelectionMode;
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
index 4d5bddf037f5e..f92a5a6caba83 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsList.types.ts
@@ -44,7 +44,7 @@ export interface IDetailsListProps extends React.Props<DetailsList>, IWithViewpo
    * Optional callback to access the IDetailsList interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IDetailsList) => void;
+  componentRef?: (component: IDetailsList | null) => void;
 
   /** A key that uniquely identifies the given items. If provided, the selection will be reset when the key changes. */
   setKey?: string;
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.types.ts b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.types.ts
index 2803f1d35407f..839156f1344b7 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/Dialog.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/Dialog.types.ts
@@ -18,7 +18,7 @@ export interface IDialogProps extends React.Props<DialogBase>, IWithResponsiveMo
    * Optional callback to access the IDialog interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IDialog) => void;
+  componentRef?: (component: IDialog | null) => void;
 
   /**
    * Call to provide customized styling that will layer on top of the variant rules
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.types.ts b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.types.ts
index 9aba2f5ced9a8..f1ec888b68723 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogContent.types.ts
@@ -14,7 +14,7 @@ export interface IDialogContentProps extends React.Props<DialogContentBase> {
   * Optional callback to access the IDialogContent interface. Use this instead of ref for accessing
   * the public methods and properties of the component.
   */
-  componentRef?: (component: IDialogContent) => void;
+  componentRef?: (component: IDialogContent | null) => void;
 
   /**
    * Call to provide customized styling that will layer on top of the variant rules
diff --git a/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.types.ts b/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.types.ts
index 47fa490d10f58..6d84a52601090 100644
--- a/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Dialog/DialogFooter.types.ts
@@ -7,7 +7,7 @@ export interface IDialogFooterProps extends React.Props<DialogFooterBase> {
   /**
    * Gets the component ref.
    */
-  componentRef?: (component: IDialogFooterProps) => void;
+  componentRef?: (component: IDialogFooterProps | null) => void;
 
   /**
    * Call to provide customized styling that will layer on top of the variant rules
diff --git a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.types.ts b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.types.ts
index 3aaa585623568..7a2631780b8da 100644
--- a/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.types.ts
+++ b/packages/office-ui-fabric-react/src/components/DocumentCard/DocumentCard.types.ts
@@ -21,7 +21,7 @@ export interface IDocumentCardProps extends React.Props<DocumentCard> {
    * Optional callback to access the IDocumentCard interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IDocumentCard) => void;
+  componentRef?: (component: IDocumentCard | null) => void;
 
   /**
   * The type of DocumentCard to display.
diff --git a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.types.ts b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.types.ts
index 2b1ee1f35d51f..aa926f86c8e2e 100644
--- a/packages/office-ui-fabric-react/src/components/Facepile/Facepile.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Facepile/Facepile.types.ts
@@ -16,7 +16,7 @@ export interface IFacepileProps extends React.Props<Facepile> {
    * Optional callback to access the IFacepile interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IFacepile) => void;
+  componentRef?: (component: IFacepile | null) => void;
 
   /**
    * Array of IPersonaProps that define each Persona.
diff --git a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.types.ts b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.types.ts
index 59c0a35a08d89..4c9037b08a054 100644
--- a/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.types.ts
+++ b/packages/office-ui-fabric-react/src/components/FocusTrapZone/FocusTrapZone.types.ts
@@ -12,7 +12,7 @@ export interface IFocusTrapZoneProps extends React.HTMLAttributes<HTMLDivElement
    * Optional callback to access the IFocusTrapZone interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IFocusTrapZone) => void;
+  componentRef?: (component: IFocusTrapZone | null) => void;
 
   /**
    * Sets the HTMLElement to focus on when exiting the FocusTrapZone.
diff --git a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
index 234842b5d71f1..0dc97c0307d82 100644
--- a/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
+++ b/packages/office-ui-fabric-react/src/components/FocusZone/FocusZone.types.ts
@@ -30,7 +30,7 @@ export interface IFocusZoneProps extends React.HTMLAttributes<HTMLElement | Focu
    * Optional callback to access the IFocusZone interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IFocusZone) => void;
+  componentRef?: (component: IFocusZone | null) => void;
 
   /**
    * Additional class name to provide on the root element, in addition to the ms-FocusZone class.
diff --git a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.types.ts b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.types.ts
index 2b6584e452f67..5311a003dd7cb 100644
--- a/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.types.ts
+++ b/packages/office-ui-fabric-react/src/components/GroupedList/GroupedList.types.ts
@@ -42,7 +42,7 @@ export interface IGroupedListProps extends React.Props<GroupedList> {
    * Optional callback to access the IGroupedList interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component?: IGroupedList) => void;
+  componentRef?: (component?: IGroupedList | null) => void;
 
   /** Optional class name to add to the root element. */
   className?: string;
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.types.ts b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.types.ts
index 70961503288e3..ad877018050c4 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.types.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/ExpandingCard.types.ts
@@ -16,7 +16,7 @@ export interface IExpandingCardProps extends React.HTMLAttributes<HTMLDivElement
    * Optional callback to access the IExpandingCard interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IExpandingCard) => void;
+  componentRef?: (component: IExpandingCard | null) => void;
 
   /**
    *  Item to be returned with onRender functions
diff --git a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.types.ts b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.types.ts
index 74bd1b29fdd85..1c5a70cfdea05 100644
--- a/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.types.ts
+++ b/packages/office-ui-fabric-react/src/components/HoverCard/HoverCard.types.ts
@@ -15,7 +15,7 @@ export interface IHoverCardProps extends React.HTMLAttributes<HTMLDivElement | H
    * Optional callback to access the IHoverCardHost interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IHoverCard) => void;
+  componentRef?: (component: IHoverCard | null) => void;
 
   /**
    * Additional properties to pass through for HoverCard, reference detail properties in IHoverCardProps
diff --git a/packages/office-ui-fabric-react/src/components/Image/Image.types.ts b/packages/office-ui-fabric-react/src/components/Image/Image.types.ts
index 0485e37793803..46b85dbb7dcff 100644
--- a/packages/office-ui-fabric-react/src/components/Image/Image.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Image/Image.types.ts
@@ -11,7 +11,7 @@ export interface IImageProps extends React.ImgHTMLAttributes<HTMLImageElement> {
    * Optional callback to access the ICheckbox interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IImage) => void;
+  componentRef?: (component: IImage | null) => void;
 
   /**
    * Call to provide customized styling that will layer on top of the variant rules
diff --git a/packages/office-ui-fabric-react/src/components/Label/Label.types.ts b/packages/office-ui-fabric-react/src/components/Label/Label.types.ts
index 8e16ec7be7cd0..6df484a69cb70 100644
--- a/packages/office-ui-fabric-react/src/components/Label/Label.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Label/Label.types.ts
@@ -12,7 +12,7 @@ export interface ILabelProps extends React.LabelHTMLAttributes<HTMLLabelElement>
    * Optional callback to access the ILabel interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ILabel) => void;
+  componentRef?: (component: ILabel | null) => void;
 
   /**
    * Whether the associated form field is required or not
diff --git a/packages/office-ui-fabric-react/src/components/Layer/Layer.types.ts b/packages/office-ui-fabric-react/src/components/Layer/Layer.types.ts
index 7b4151727ecdf..ee5559b26a7d9 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/Layer.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Layer/Layer.types.ts
@@ -12,7 +12,7 @@ export interface ILayerProps extends React.HTMLAttributes<HTMLDivElement | Layer
    * Optional callback to access the ILayer interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ILayer) => void;
+  componentRef?: (component: ILayer | null) => void;
 
   /**
    * Call to provide customized styling that will layer on top of the variant rules
diff --git a/packages/office-ui-fabric-react/src/components/Layer/LayerHost.types.ts b/packages/office-ui-fabric-react/src/components/Layer/LayerHost.types.ts
index 2b87417a7e269..470bf0f5d33d2 100644
--- a/packages/office-ui-fabric-react/src/components/Layer/LayerHost.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Layer/LayerHost.types.ts
@@ -9,7 +9,7 @@ export interface ILayerHostProps extends React.HTMLAttributes<HTMLElement> {
    * Optional callback to access the ILayerHost interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ILayerHost) => void;
+  componentRef?: (component: ILayerHost | null) => void;
 
   /**
    * Defines the id for the layer host that Layers can target (using the hostId property.)
diff --git a/packages/office-ui-fabric-react/src/components/Link/Link.types.ts b/packages/office-ui-fabric-react/src/components/Link/Link.types.ts
index 9ada1d9d5aedf..b71ef6d36018d 100644
--- a/packages/office-ui-fabric-react/src/components/Link/Link.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Link/Link.types.ts
@@ -19,7 +19,7 @@ export interface ILinkProps extends React.AllHTMLAttributes<HTMLAnchorElement |
    * Optional callback to access the ILink interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ILink) => void;
+  componentRef?: (component: ILink | null) => void;
 
   /**
    * Whether the link is disabled
diff --git a/packages/office-ui-fabric-react/src/components/List/List.types.ts b/packages/office-ui-fabric-react/src/components/List/List.types.ts
index 2bc6e4cdd3053..315f2b60123f6 100644
--- a/packages/office-ui-fabric-react/src/components/List/List.types.ts
+++ b/packages/office-ui-fabric-react/src/components/List/List.types.ts
@@ -21,7 +21,7 @@ export interface IListProps extends React.HTMLAttributes<List | HTMLDivElement>
    * Optional callback to access the IList interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IList) => void;
+  componentRef?: (component: IList | null) => void;
 
   /** Optional classname to append to root list. */
   className?: string;
diff --git a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.types.ts b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.types.ts
index 858ca0aeaecec..74a4508db6291 100644
--- a/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.types.ts
+++ b/packages/office-ui-fabric-react/src/components/MarqueeSelection/MarqueeSelection.types.ts
@@ -11,7 +11,7 @@ export interface IMarqueeSelectionProps extends React.Props<MarqueeSelection> {
    * Optional callback to access the IMarqueeSelection interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IMarqueeSelection) => void;
+  componentRef?: (component: IMarqueeSelection | null) => void;
 
   /**
    * The selection object to interact with when updating selection changes.
diff --git a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts
index 43922025a3822..67007e0bf7965 100644
--- a/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts
+++ b/packages/office-ui-fabric-react/src/components/MessageBar/MessageBar.types.ts
@@ -10,7 +10,7 @@ export interface IMessageBarProps extends React.HTMLAttributes<HTMLElement> {
    * Optional callback to access the IMessageBar interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IMessageBar) => void;
+  componentRef?: (component: IMessageBar | null) => void;
 
   /**
    * The type of MessageBar to render.
diff --git a/packages/office-ui-fabric-react/src/components/Modal/Modal.types.ts b/packages/office-ui-fabric-react/src/components/Modal/Modal.types.ts
index 8aa8059196d66..b4a8475c20f5b 100644
--- a/packages/office-ui-fabric-react/src/components/Modal/Modal.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Modal/Modal.types.ts
@@ -15,7 +15,7 @@ export interface IModalProps extends React.Props<Modal>, IWithResponsiveModeStat
    * Optional callback to access the IDialog interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IModal) => void;
+  componentRef?: (component: IModal | null) => void;
 
   /**
   * Whether the dialog is displayed.
diff --git a/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts b/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
index d499f4bb52041..ff4b7897c4b51 100644
--- a/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Nav/Nav.types.ts
@@ -18,7 +18,7 @@ export interface INavProps {
    * Optional callback to access the INav interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: INav) => void;
+  componentRef?: (component: INav | null) => void;
 
   /**
    * Call to provide customized styling that will layer on top of the variant rules
diff --git a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.types.ts b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.types.ts
index 8a1ba3d6d5baa..3930f92d1cf03 100644
--- a/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.types.ts
+++ b/packages/office-ui-fabric-react/src/components/OverflowSet/OverflowSet.types.ts
@@ -14,7 +14,7 @@ export interface IOverflowSetProps extends React.Props<OverflowSet> {
   /**
    * Gets the component ref.
    */
-  componentRef?: (ref?: IOverflowSet) => void;
+  componentRef?: (ref?: IOverflowSet | null) => void;
 
   /**
    * Class name
diff --git a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.types.ts b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.types.ts
index c6e2810e8ea10..7358f03982faa 100644
--- a/packages/office-ui-fabric-react/src/components/Overlay/Overlay.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Overlay/Overlay.types.ts
@@ -10,7 +10,7 @@ export interface IOverlayProps extends React.HTMLAttributes<HTMLElement> {
   /**
    * Gets the component ref.
    */
-  componentRef?: (component: IOverlayProps) => void;
+  componentRef?: (component: IOverlayProps | null) => void;
 
   /**
    * Call to provide customized styling that will layer on top of the variant rules
diff --git a/packages/office-ui-fabric-react/src/components/Panel/Panel.types.ts b/packages/office-ui-fabric-react/src/components/Panel/Panel.types.ts
index 1e6acd0c9f70f..5cc96d583a753 100644
--- a/packages/office-ui-fabric-react/src/components/Panel/Panel.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Panel/Panel.types.ts
@@ -20,7 +20,7 @@ export interface IPanelProps extends React.Props<Panel> {
    * Optional callback to access the IPanel interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IPanel) => void;
+  componentRef?: (component: IPanel | null) => void;
 
   /**
   * Whether the panel is displayed.
diff --git a/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts b/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts
index eb0ee0d442acb..07c061f76b081 100644
--- a/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Persona/Persona.types.ts
@@ -14,7 +14,7 @@ export interface IPersonaProps extends React.HTMLAttributes<PersonaBase> {
    * Optional callback to access the IPersona interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IPersona) => void;
+  componentRef?: (component: IPersona | null) => void;
 
   /**
    * Primary text to display, usually the name of the person.
diff --git a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.types.ts b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.types.ts
index df53f832a8337..372f5d52085b9 100644
--- a/packages/office-ui-fabric-react/src/components/Pivot/Pivot.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Pivot/Pivot.types.ts
@@ -12,7 +12,7 @@ export interface IPivotProps extends React.Props<Pivot> {
    * Optional callback to access the IPivot interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IPivot) => void;
+  componentRef?: (component: IPivot | null) => void;
 
   /**
    * The index of the pivot item initially selected.
diff --git a/packages/office-ui-fabric-react/src/components/Popup/Popup.types.ts b/packages/office-ui-fabric-react/src/components/Popup/Popup.types.ts
index 03a92f97f4ece..d49339eb57e6a 100644
--- a/packages/office-ui-fabric-react/src/components/Popup/Popup.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Popup/Popup.types.ts
@@ -12,7 +12,7 @@ export interface IPopupProps extends React.HTMLAttributes<Popup> {
    * Optional callback to access the IPopup interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IPopup) => void;
+  componentRef?: (component: IPopup | null) => void;
 
   /**
    * Aria role for popup
diff --git a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.types.ts b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.types.ts
index e920ff538f387..b1bb692efdecd 100644
--- a/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ProgressIndicator/ProgressIndicator.types.ts
@@ -7,7 +7,7 @@ export interface IProgressIndicatorProps {
    * Optional callback to access the IProgressIndicator interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IProgressIndicator) => void;
+  componentRef?: (component: IProgressIndicator | null) => void;
 
   /**
    * Class name to apply to the root in addition to ms-ProgressIndicator.
diff --git a/packages/office-ui-fabric-react/src/components/Rating/Rating.types.ts b/packages/office-ui-fabric-react/src/components/Rating/Rating.types.ts
index 675e210a5d105..aef9d0b35cda5 100644
--- a/packages/office-ui-fabric-react/src/components/Rating/Rating.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Rating/Rating.types.ts
@@ -17,7 +17,7 @@ export interface IRatingProps extends React.AllHTMLAttributes<HTMLElement> {
    * Optional callback to access the IRating interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IRating) => void;
+  componentRef?: (component: IRating | null) => void;
 
   /**
    * Selected rating, has to be an integer between min and max
diff --git a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.types.ts b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.types.ts
index c65d6d3418748..28602a1328143 100644
--- a/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ResizeGroup/ResizeGroup.types.ts
@@ -15,7 +15,7 @@ export interface IResizeGroupProps extends React.HTMLAttributes<ResizeGroupBase
    * Optional callback to access the IResizeGroup interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IResizeGroup) => void;
+  componentRef?: (component: IResizeGroup | null) => void;
 
   /**
    * Call to provide customized styling that will layer on top of the variant rules
diff --git a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts
index b1b432bb068ff..41d1eb7a20d76 100644
--- a/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ScrollablePane/ScrollablePane.types.ts
@@ -16,7 +16,7 @@ export interface IScrollablePaneProps extends React.HTMLAttributes<HTMLElement |
    * Optional callback to access the IScrollablePane interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IScrollablePane) => void;
+  componentRef?: (component: IScrollablePane | null) => void;
 
   /**
    * Call to provide customized styling that will layer on top of the variant rules
diff --git a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
index 2aa62dea9593a..c64d819f77706 100644
--- a/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SearchBox/SearchBox.types.ts
@@ -20,7 +20,7 @@ export interface ISearchBoxProps extends React.InputHTMLAttributes<HTMLInputElem
    * Optional callback to access the ISearchBox interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ISearchBox) => void;
+  componentRef?: (component: ISearchBox | null) => void;
 
   /**
    * Placeholder for the search box.
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx b/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
index 147ad56e7e29e..917e50e507dd3 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.test.tsx
@@ -86,7 +86,7 @@ describe('Slider', () => {
   });
 
   it('can read the current value', () => {
-    let slider: ISlider | undefined;
+    let slider: ISlider | null;
 
     ReactTestUtils.renderIntoDocument(
       // tslint:disable-next-line:jsx-no-lambda
diff --git a/packages/office-ui-fabric-react/src/components/Slider/Slider.types.ts b/packages/office-ui-fabric-react/src/components/Slider/Slider.types.ts
index 2f3001ef0a82b..c87a716ba15f0 100644
--- a/packages/office-ui-fabric-react/src/components/Slider/Slider.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Slider/Slider.types.ts
@@ -11,7 +11,7 @@ export interface ISliderProps {
    * Optional callback to access the ISlider interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ISlider) => void;
+  componentRef?: (component: ISlider | null) => void;
 
   /**
    * Description label of the Slider
diff --git a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts
index 9320fccd84435..96bd3fa147e37 100644
--- a/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SpinButton/SpinButton.types.ts
@@ -24,7 +24,7 @@ export interface ISpinButtonProps {
   /**
    * Gets the component ref.
    */
-  componentRef?: (component?: ISpinButton) => void;
+  componentRef?: (component?: ISpinButton | null) => void;
 
   /**
    * The initial value of the SpinButton. Use this if you intend for the SpinButton to be an uncontrolled component.
diff --git a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.types.ts b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.types.ts
index a0ed502efd891..109022603e717 100644
--- a/packages/office-ui-fabric-react/src/components/Spinner/Spinner.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Spinner/Spinner.types.ts
@@ -12,7 +12,7 @@ export interface ISpinnerProps extends React.HTMLAttributes<HTMLElement> {
    * Optional callback to access the ISpinner interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ISpinner) => void;
+  componentRef?: (component: ISpinner | null) => void;
 
   /**
    * Deprecated and will be removed at >= 2.0.0. Use SpinnerSize instead.
diff --git a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.types.ts b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.types.ts
index bad51e69235b4..4a48232673168 100644
--- a/packages/office-ui-fabric-react/src/components/Sticky/Sticky.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Sticky/Sticky.types.ts
@@ -5,7 +5,7 @@ export interface IStickyProps extends React.Props<Sticky> {
   /**
    * Gets ref to component interface.
    */
-  componentRef?: (component: IStickyProps) => void;
+  componentRef?: (component: IStickyProps | null) => void;
 
   /**
    * Class name to apply to the sticky element if component is sticky.
diff --git a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts
index b624363d295fb..3a3238ec3f96d 100644
--- a/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts
+++ b/packages/office-ui-fabric-react/src/components/SwatchColorPicker/SwatchColorPicker.types.ts
@@ -8,7 +8,7 @@ export interface ISwatchColorPickerProps {
   /**
    * Gets the component ref.
    */
-  componentRef?: (componentRef?: ISwatchColorPicker) => void;
+  componentRef?: (componentRef?: ISwatchColorPicker | null) => void;
 
   /**
    * the number of columns for the swatch color picker
diff --git a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.types.ts b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.types.ts
index 927dbbd597b0f..fd1bb9855a0bc 100644
--- a/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.types.ts
+++ b/packages/office-ui-fabric-react/src/components/TeachingBubble/TeachingBubble.types.ts
@@ -19,7 +19,7 @@ export interface ITeachingBubbleProps extends React.Props<TeachingBubble | Teach
    * Optional callback to access the ISlider interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ITeachingBubble) => void;
+  componentRef?: (component: ITeachingBubble | null) => void;
 
   /**
    * Properties to pass through for Callout, reference detail properties in ICalloutProps
diff --git a/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts b/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts
index 7f32537bc68d4..44494d0ac8b52 100644
--- a/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts
+++ b/packages/office-ui-fabric-react/src/components/TextField/TextField.types.ts
@@ -40,7 +40,7 @@ export interface ITextFieldProps extends React.AllHTMLAttributes<HTMLInputElemen
    * Optional callback to access the ITextField interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ITextField) => void;
+  componentRef?: (component: ITextField | null) => void;
 
   /**
    * Whether or not the textfield is a multiline textfield.
diff --git a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.types.ts b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.types.ts
index 41a3d7fe3745e..7b7b25e121f44 100644
--- a/packages/office-ui-fabric-react/src/components/Toggle/Toggle.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Toggle/Toggle.types.ts
@@ -14,7 +14,7 @@ export interface IToggleProps extends React.HTMLAttributes<HTMLElement | Toggle>
    * Optional callback to access the IToggle interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: IToggle) => void;
+  componentRef?: (component: IToggle | null) => void;
 
   /**
    * A label for the toggle.
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.types.ts b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.types.ts
index ad7f40feeab7c..fe7a97f8ebfec 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/Tooltip.types.ts
@@ -16,7 +16,7 @@ export interface ITooltipProps extends React.HTMLAttributes<HTMLDivElement | Too
    * Optional callback to access the ITooltip interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ITooltip) => void;
+  componentRef?: (component: ITooltip | null) => void;
 
   /**
    * Properties to pass through for Callout, reference detail properties in ICalloutProps
diff --git a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.types.ts b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.types.ts
index 27c7c51a1810b..3328db2accac0 100644
--- a/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Tooltip/TooltipHost.types.ts
@@ -24,7 +24,7 @@ export interface ITooltipHostProps extends React.HTMLAttributes<HTMLDivElement |
    * Optional callback to access the ITooltipHost interface. Use this instead of ref for accessing
    * the public methods and properties of the component.
    */
-  componentRef?: (component: ITooltipHost) => void;
+  componentRef?: (component: ITooltipHost | null) => void;
 
   /**
    * Additional properties to pass through for Callout, reference detail properties in ICalloutProps
diff --git a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts
index 50fa5c174c9a7..5c5d3439a901a 100644
--- a/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts
+++ b/packages/office-ui-fabric-react/src/components/pickers/BasePicker.types.ts
@@ -20,7 +20,7 @@ export interface IBasePicker<T> {
 // and searched for by the people picker. For example, if the picker is
 // displaying persona's than type T could either be of Persona or Ipersona props
 export interface IBasePickerProps<T> extends React.Props<any> {
-  componentRef?: (component?: IBasePicker<T>) => void;
+  componentRef?: (component?: IBasePicker<T> | null) => void;
 
   /**
    * Function that specifies how the selected item will appear.
diff --git a/packages/office-ui-fabric-react/src/utilities/grid/Grid.types.ts b/packages/office-ui-fabric-react/src/utilities/grid/Grid.types.ts
index 23168738afa55..be3cf01487a81 100644
--- a/packages/office-ui-fabric-react/src/utilities/grid/Grid.types.ts
+++ b/packages/office-ui-fabric-react/src/utilities/grid/Grid.types.ts
@@ -7,7 +7,7 @@ export interface IGridProps {
   /**
    * Gets the component ref.
    */
-  componentRef?: (componentRef?: IGrid) => void;
+  componentRef?: (componentRef?: IGrid | null) => void;
 
   /**
    * The items to turn into a grid
diff --git a/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.types.ts b/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.types.ts
index 7fc413898ed32..3716d194542c3 100644
--- a/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.types.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.types.ts
@@ -8,7 +8,7 @@ export interface ISelectableDroppableTextProps<T> extends React.HTMLAttributes<T
   * Optional callback to access the ISelectableDroppableText interface. Use this instead of ref for accessing
   * the public methods and properties of the component.
   */
-  componentRef?: (component: T) => void;
+  componentRef?: (component: T | null) => void;
 
   /**
    * Descriptive label for the ISelectableDroppableText
diff --git a/packages/utilities/src/createRef.ts b/packages/utilities/src/createRef.ts
index 0f145b9ed9439..b08cd78f3290e 100644
--- a/packages/utilities/src/createRef.ts
+++ b/packages/utilities/src/createRef.ts
@@ -1,5 +1,5 @@
 export type RefObject<T> = {
-  (component: T): void;
+  (component: T | null): void;
   value: T | null;
 };
 

From e81f0d8f3f90ab68048069380459fc7a89d49ae4 Mon Sep 17 00:00:00 2001
From: Thomas Michon <thomas@michon.com>
Date: Fri, 23 Mar 2018 14:09:02 -0700
Subject: [PATCH 1632/1641] Add missing icons to Signal and minor visual
 updates (#4343)

* Add missing Signal icons

* Update change output

* Add SignalField mode parameter to control spacing
---
 .../experiments/signals_2018-03-22-21-03.json | 11 +++
 .../src/components/signals/SignalField.scss   | 12 ++-
 .../src/components/signals/SignalField.tsx    |  9 ++-
 .../src/components/signals/Signals.scss       | 80 ++++++++++++++++++-
 .../src/components/signals/Signals.tsx        | 53 +++++++++---
 .../src/components/signals/SignalsPage.tsx    | 12 ++-
 .../examples/SignalField.Basic.Example.tsx    | 42 ++++++++++
 .../examples/Signals.Basic.Example.tsx        | 17 +++-
 8 files changed, 217 insertions(+), 19 deletions(-)
 create mode 100644 common/changes/@uifabric/experiments/signals_2018-03-22-21-03.json
 create mode 100644 packages/experiments/src/components/signals/examples/SignalField.Basic.Example.tsx

diff --git a/common/changes/@uifabric/experiments/signals_2018-03-22-21-03.json b/common/changes/@uifabric/experiments/signals_2018-03-22-21-03.json
new file mode 100644
index 0000000000000..95f7eb77288c3
--- /dev/null
+++ b/common/changes/@uifabric/experiments/signals_2018-03-22-21-03.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Add missing icons to Signals and fix colors",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "tmichon@microsoft.com"
+}
diff --git a/packages/experiments/src/components/signals/SignalField.scss b/packages/experiments/src/components/signals/SignalField.scss
index 717124fa13d1a..900627e612a12 100644
--- a/packages/experiments/src/components/signals/SignalField.scss
+++ b/packages/experiments/src/components/signals/SignalField.scss
@@ -2,7 +2,16 @@
 @import '~office-ui-fabric-react/src/common/common';
 
 .signalField {
-  display: inline-flex;
+  &,
+  &.compact {
+    display: inline-flex;
+  }
+
+  &.wide {
+    display: flex;
+    vertical-align: top;
+  }
+
   max-width: 100%;
   flex-direction: row nowrap;
 }
@@ -12,4 +21,5 @@
   overflow: hidden;
   white-space: nowrap;
   text-align: left;
+  flex: 1;
 }
diff --git a/packages/experiments/src/components/signals/SignalField.tsx b/packages/experiments/src/components/signals/SignalField.tsx
index fb76709b289ae..57ad06bfb639e 100644
--- a/packages/experiments/src/components/signals/SignalField.tsx
+++ b/packages/experiments/src/components/signals/SignalField.tsx
@@ -6,7 +6,10 @@ import * as SignalFieldStylesModule from './SignalField.scss';
 // tslint:disable-next-line:no-any
 const SignalFieldStyles: any = SignalFieldStylesModule;
 
+export type SignalFieldMode = 'wide' | 'compact';
+
 export interface ISignalFieldProps extends React.HTMLAttributes<HTMLSpanElement> {
+  signalsFieldMode?: SignalFieldMode;
   before?: React.ReactNode | React.ReactNode[];
   after?: React.ReactNode | React.ReactNode[];
 }
@@ -21,12 +24,16 @@ export const SignalField: React.StatelessComponent<ISignalFieldProps> = (props:
     before,
     after,
     className,
+    signalsFieldMode = 'compact',
     ...spanProps
   } = props;
   return (
     <span
       { ...spanProps }
-      className={ css(SignalFieldStyles.signalField, className) }
+      className={ css(SignalFieldStyles.signalField, {
+        [SignalFieldStyles.wide]: signalsFieldMode === 'wide',
+        [SignalFieldStyles.compact]: signalsFieldMode === 'compact'
+      }, className) }
     >
       { props.before }
       <span className={ SignalFieldStyles.signalFieldValue }>
diff --git a/packages/experiments/src/components/signals/Signals.scss b/packages/experiments/src/components/signals/Signals.scss
index 20d2b12bbe6ac..27e26f55227a2 100644
--- a/packages/experiments/src/components/signals/Signals.scss
+++ b/packages/experiments/src/components/signals/Signals.scss
@@ -26,7 +26,7 @@ settings used by the parent control.
   bottom: 100%;
   @include right(-0.15em);
   font-size: 0.66em;
-  margin-bottom: -0.8em;
+  margin-bottom: -0.9em;
 }
 
 .comments {
@@ -49,11 +49,11 @@ settings used by the parent control.
 }
 
 .trending {
-  color: #006257;
+  color: $ms-color-green;
 }
 
 .blocked {
-  color: #a80000;
+  color: $ms-color-redDark;
 }
 
 .warning {
@@ -62,10 +62,38 @@ settings used by the parent control.
 
 .shared {
   color: $ms-color-neutralSecondary;
+
+  .selected & {
+    color: $ms-color-black;
+  }
+}
+
+.lock {
+  color: $ms-color-neutralSecondary;
+
+  .selected & {
+    color: $ms-color-black;
+  }
 }
 
 .missingMetadata {
-  color: $ms-color-themeDarker;
+  color: #cf3902;
+}
+
+.youCheckedOut {
+  color: $ms-color-redDark;
+}
+
+.someoneCheckedOut {
+  color: $ms-color-neutralSecondary;
+
+  .selected & {
+    color: $ms-color-black;
+  }
+}
+
+.awaitingApproval {
+  color: #ad3100;
 }
 
 .mention {
@@ -78,10 +106,54 @@ settings used by the parent control.
   }
 }
 
+.unseenEdit {
+  color: $ms-color-themePrimary;
+
+  .selected & {
+    color: $ms-color-themeDark;
+  }
+}
+
+.unseenReply {
+  color: $ms-color-themePrimary;
+
+  .selected & {
+    color: $ms-color-themeDark;
+  }
+}
+
+i.unseenReply {
+  top: 0.25em;
+}
+
+.emailed {
+  color: $ms-color-themePrimary;
+
+  .selected & {
+    color: $ms-color-themeDark;
+  }
+}
+
+i.emailed {
+  top: 0.25em;
+}
+
 .malwareDetected {
   color: $ms-color-redDark;
 }
 
+.readOnly {
+  color: $ms-color-neutralSecondary;
+
+  .selected & {
+    color: $ms-color-black;
+  }
+}
+
 .external {
   color: $ms-color-neutralSecondary;
+
+  .selected & {
+    color: $ms-color-black;
+  }
 }
diff --git a/packages/experiments/src/components/signals/Signals.tsx b/packages/experiments/src/components/signals/Signals.tsx
index 5b7622957e6a1..26844a2d5599d 100644
--- a/packages/experiments/src/components/signals/Signals.tsx
+++ b/packages/experiments/src/components/signals/Signals.tsx
@@ -19,7 +19,7 @@ export const YouCheckedOutSignal: Signal = (props: ISignalProps): JSX.Element =>
     <Icon
       ariaLabel={ props.ariaLabel }
       className={ css(SignalStyles.signal, SignalsStyles.youCheckedOutl) }
-      iconName=''
+      iconName='checkedoutbyyou12'
     /> // TODO get correct icon
   );
 };
@@ -29,7 +29,7 @@ export const BlockedSignal: Signal = (props: ISignalProps): JSX.Element => {
     <Icon
       ariaLabel={ props.ariaLabel }
       className={ css(SignalStyles.signal, SignalsStyles.blocked) }
-      iconName='blocked2'
+      iconName='blocked12'
     />
   );
 };
@@ -49,7 +49,7 @@ export const WarningSignal: Signal = (props: ISignalProps): JSX.Element => {
     <Icon
       ariaLabel={ props.ariaLabel }
       className={ css(SignalStyles.signal, SignalsStyles.warning) }
-      iconName='warning'
+      iconName='warning12'
     />
   );
 };
@@ -59,8 +59,8 @@ export const AwaitingApprovalSignal: Signal = (props: ISignalProps): JSX.Element
     <Icon
       ariaLabel={ props.ariaLabel }
       className={ css(SignalStyles.signal, SignalsStyles.awaitingApproval) }
-      iconName='documentmanagement'
-    /> // TODO get correct icon
+      iconName='clock'
+    />
   );
 };
 
@@ -79,8 +79,18 @@ export const SomeoneCheckedOutSignal: Signal = (props: ISignalProps): JSX.Elemen
     <Icon
       ariaLabel={ props.ariaLabel }
       className={ css(SignalStyles.signal, SignalsStyles.someoneCheckedOut) }
-      iconName='navigateforward'
-    /> // TODO get correct icon
+      iconName='checkedoutbyother12'
+    />
+  );
+};
+
+export const RecordSignal: Signal = (props: ISignalProps): JSX.Element => {
+  return (
+    <Icon
+      ariaLabel={ props.ariaLabel }
+      className={ css(SignalStyles.signal, SignalsStyles.record) }
+      iconName='lock'
+    />
   );
 };
 
@@ -166,13 +176,26 @@ export const CommentsSignal: Signal = (props: ISignalProps): JSX.Element => {
   );
 };
 
+/**
+ * Renders a signal for a number of comments.
+ */
+export const UnseenReplySignal: Signal = (props: ISignalProps): JSX.Element => {
+  return (
+    <Icon
+      ariaLabel={ props.ariaLabel }
+      className={ css(SignalStyles.signal, SignalsStyles.unseenReply) }
+      iconName='commentprevious'
+    />
+  );
+};
+
 export const UnseenEditSignal: Signal = (props: ISignalProps): JSX.Element => {
   return (
     <Icon
       ariaLabel={ props.ariaLabel }
       className={ css(SignalStyles.signal, SignalsStyles.unseenEdit) }
       iconName='edit'
-    /> // TODO get correct icon
+    />
   );
 };
 
@@ -181,8 +204,18 @@ export const ReadOnlySignal: Signal = (props: ISignalProps): JSX.Element => {
     <Icon
       ariaLabel={ props.ariaLabel }
       className={ css(SignalStyles.signal, SignalsStyles.readOnly) }
-      iconName=''
-    /> // TODO get correct icon
+      iconName='uneditablesolid12'
+    />
+  );
+};
+
+export const EmailedSignal: Signal = (props: ISignalProps): JSX.Element => {
+  return (
+    <Icon
+      ariaLabel={ props.ariaLabel }
+      className={ css(SignalStyles.signal, SignalsStyles.emailed) }
+      iconName='mail'
+    />
   );
 };
 
diff --git a/packages/experiments/src/components/signals/SignalsPage.tsx b/packages/experiments/src/components/signals/SignalsPage.tsx
index 4576ae6cd4933..16421d0744363 100644
--- a/packages/experiments/src/components/signals/SignalsPage.tsx
+++ b/packages/experiments/src/components/signals/SignalsPage.tsx
@@ -7,6 +7,11 @@ import {
 } from '@uifabric/example-app-base';
 
 /* tslint:disable:max-line-length */
+import { SignalFieldBasicExample } from './examples/SignalField.Basic.Example';
+const SignalFieldBasicExampleCode = require(
+  '!raw-loader!experiments/src/components/signals/examples/SignalField.Basic.Example.tsx'
+) as string;
+
 import { SignalsBasicExample } from './examples/Signals.Basic.Example';
 const SignalsBasicExampleCode = require(
   '!raw-loader!experiments/src/components/signals/examples/Signals.Basic.Example.tsx'
@@ -17,10 +22,13 @@ export class SignalsPage extends React.Component<IComponentDemoPageProps, {}> {
     return (
       <ComponentPage
         title='Signals'
-        componentName='SignalsBasicExample'
+        componentName='SignalField'
         exampleCards={
           <div>
-            <ExampleCard title='Basic signals usage' isOptIn={ true } code={ SignalsBasicExampleCode }>
+            <ExampleCard title='Controlling Signal alignment' isOptIn={ true } code={ SignalFieldBasicExampleCode }>
+              <SignalFieldBasicExample />
+            </ExampleCard>
+            <ExampleCard title='All Signal types' isOptIn={ true } code={ SignalsBasicExampleCode }>
               <SignalsBasicExample />
             </ExampleCard>
           </div>
diff --git a/packages/experiments/src/components/signals/examples/SignalField.Basic.Example.tsx b/packages/experiments/src/components/signals/examples/SignalField.Basic.Example.tsx
new file mode 100644
index 0000000000000..b95326532bc73
--- /dev/null
+++ b/packages/experiments/src/components/signals/examples/SignalField.Basic.Example.tsx
@@ -0,0 +1,42 @@
+
+import * as React from 'react';
+import { SignalField, SignalFieldMode } from '../SignalField';
+import { YouCheckedOutSignal, AwaitingApprovalSignal } from '../Signals';
+import { lorem } from '@uifabric/example-app-base';
+import { Checkbox } from 'office-ui-fabric-react/lib/Checkbox';
+
+export interface ISignalFieldBasicExampleState {
+  mode: SignalFieldMode;
+}
+
+const text = lorem(4);
+
+export class SignalFieldBasicExample extends React.Component<{}, ISignalFieldBasicExampleState> {
+  constructor(props: {}) {
+    super(props);
+
+    this.state = {
+      mode: 'compact'
+    };
+  }
+
+  public render(): JSX.Element {
+    return (
+      <div>
+        <Checkbox label='Wide?' onChange={ this._onModeChange } checked={ this.state.mode === 'wide' } />
+        <SignalField
+          signalsFieldMode={ this.state.mode }
+          before={ [<YouCheckedOutSignal key='a' />] }
+          after={ [<AwaitingApprovalSignal key='b' />] }
+        >{ text }
+        </SignalField>
+      </div>
+    );
+  }
+
+  private _onModeChange = (event: React.MouseEvent<HTMLElement>, checked?: boolean | undefined): void => {
+    this.setState({
+      mode: checked ? 'wide' : 'compact'
+    });
+  }
+}
diff --git a/packages/experiments/src/components/signals/examples/Signals.Basic.Example.tsx b/packages/experiments/src/components/signals/examples/Signals.Basic.Example.tsx
index a5d15caf67807..5aa99f070a536 100644
--- a/packages/experiments/src/components/signals/examples/Signals.Basic.Example.tsx
+++ b/packages/experiments/src/components/signals/examples/Signals.Basic.Example.tsx
@@ -14,9 +14,12 @@ import {
   LiveEditSignal,
   MentionSignal,
   CommentsSignal,
+  UnseenReplySignal,
   UnseenEditSignal,
   ReadOnlySignal,
-  SharedSignal
+  SharedSignal,
+  EmailedSignal,
+  RecordSignal
 } from '../Signals';
 import { ChoiceGroup, IChoiceGroupOption, Checkbox } from 'office-ui-fabric-react';
 import { css } from 'office-ui-fabric-react/lib/Utilities';
@@ -162,10 +165,22 @@ export class SignalsBasicExample extends React.Component<{}, ISignalsBasicExampl
             name='Comments (count)'
             signal={ <CommentsSignal>2</CommentsSignal> }
           />
+          <SignalExample
+            name='Unseen reply'
+            signal={ <UnseenReplySignal /> }
+          />
           <SignalExample
             name='Unseen edit'
             signal={ <UnseenEditSignal /> }
           />
+          <SignalExample
+            name='Emailed'
+            signal={ <EmailedSignal /> }
+          />
+          <SignalExample
+            name='Record'
+            signal={ <RecordSignal /> }
+          />
           <SignalExample
             name='Read-only'
             signal={ <ReadOnlySignal /> }

From 7e3911a8378407a5a57a56a493ed066539aee02d Mon Sep 17 00:00:00 2001
From: Stanley Yao <stanley.yao@microsoft.com>
Date: Fri, 23 Mar 2018 14:40:17 -0700
Subject: [PATCH 1633/1641] Stanleyy/fillin (#4351)

* Add multiSelect for ComboBox

* Unbreak a unit test

* rush change

* bug fixes

* Merge from upstream and resolve local build issues

* Fix merge styles

* Fix pending background

* Unbreak unit test cases

* Fix the merge

* Add controled multi-select in the example page to make sure onChanged cb works

* Remove trailing white spaces

* Fix bug: enter key will not trigger onChanged

* Dummy change to trigger another build

* refactor

* Fix some minor bugs

* Update some comments for ComboBox

* Minor bug fixes to the example page

* rush change

* Delete the old rush change file

* Remove a trailing space
---
 .../stanleyy-fillin_2018-03-23-20-45.json             | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.tsx              |  7 +++++++
 .../ComboBox/examples/ComboBox.Basic.Example.tsx      |  8 +++++---
 .../selectableOption/SelectableDroppableText.types.ts |  4 ++--
 4 files changed, 25 insertions(+), 5 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/stanleyy-fillin_2018-03-23-20-45.json

diff --git a/common/changes/office-ui-fabric-react/stanleyy-fillin_2018-03-23-20-45.json b/common/changes/office-ui-fabric-react/stanleyy-fillin_2018-03-23-20-45.json
new file mode 100644
index 0000000000000..0b24d5ac7f85b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/stanleyy-fillin_2018-03-23-20-45.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "ComboBox: Add some code comments. Minor bug fixes to the example page.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "stanleyy@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index 61e21df8e95b9..e396c56c9199d 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -1702,6 +1702,13 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
     return item && item.index === this.state.currentPendingValueValidIndex;
   }
 
+  /**
+   * Given default selected key(s) and selected key(s), return the selected keys(s).
+   * When default selected key(s) are available, they take precedence and return them instead of selected key(s).
+   *
+   * @returns No matter what specific types the input parameters are, always return an array of
+   *  either strings or numbers instead of premitive type.  This normlization makes caller's logic easier.
+   */
   private _getSelectedKeys(
     defaultSelectedKey: string | number | string[] | number[] | undefined,
     selectedKey: string | number | string[] | number[] | undefined
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
index ffe90d3376b96..ad451151d4f40 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/examples/ComboBox.Basic.Example.tsx
@@ -73,7 +73,8 @@ export class ComboBoxBasicExample extends React.Component<{}, {
       options: [],
       optionsMulti: [],
       selectedOptionKey: undefined,
-      value: 'Calibri'
+      value: 'Calibri',
+      valueMulti: 'Calibri'
     };
 
     for (let i = 0; i < 1000; i++) {
@@ -278,6 +279,7 @@ export class ComboBoxBasicExample extends React.Component<{}, {
           allowFreeform={ true }
           autoComplete='on'
           options={ optionsMulti }
+          value={ valueMulti }
           onChanged={ this._onChangedMulti }
           onResolveOptions={ this._getOptionsMulti }
           onRenderOption={ this._onRenderFontOption }
@@ -332,7 +334,7 @@ export class ComboBoxBasicExample extends React.Component<{}, {
     return INITIAL_OPTIONS;
   }
 
-  private _getOptionsMulti(currentOptions: IComboBoxOption[]): IComboBoxOption[] {
+  private _getOptionsMulti = (currentOptions: IComboBoxOption[]): IComboBoxOption[] => {
 
     if (this.state.options.length > 0) {
       return this.state.optionsMulti;
@@ -341,7 +343,7 @@ export class ComboBoxBasicExample extends React.Component<{}, {
     this.setState({
       optionsMulti: INITIAL_OPTIONS,
       selectedOptionKeys: [ 'C1' ],
-      value: undefined
+      valueMulti: undefined
     });
 
     return INITIAL_OPTIONS;
diff --git a/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.types.ts b/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.types.ts
index 3716d194542c3..161a64b56631d 100644
--- a/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.types.ts
+++ b/packages/office-ui-fabric-react/src/utilities/selectableOption/SelectableDroppableText.types.ts
@@ -31,12 +31,12 @@ export interface ISelectableDroppableTextProps<T> extends React.HTMLAttributes<T
   className?: string;
 
   /**
-   * The key that will be initially used to set a selected item.
+   * The key(s) that will be initially used to set a selected item.
    */
   defaultSelectedKey?: string | number | string[] | number[];
 
   /**
-   * The key of the selected item. If you provide this, you must maintain selection
+   * The key(s) of the selected item. If you provide this, you must maintain selection
    * state by observing onChange events and passing a new value in when changed.
    */
   selectedKey?: string | number | string[] | number[];

From 2d181fe55d79ca12d233d5644cabc64cb6379b4c Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 23 Mar 2018 15:15:08 -0700
Subject: [PATCH 1634/1641] Removing unneeded scss.

---
 .../src/components/Check/Check.scss           | 98 -------------------
 1 file changed, 98 deletions(-)
 delete mode 100644 packages/office-ui-fabric-react/src/components/Check/Check.scss

diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.scss b/packages/office-ui-fabric-react/src/components/Check/Check.scss
deleted file mode 100644
index f9c79db42036c..0000000000000
--- a/packages/office-ui-fabric-react/src/components/Check/Check.scss
+++ /dev/null
@@ -1,98 +0,0 @@
-@import '../../common/common';
-
-// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
-
-//
-// Office UI Fabric
-// --------------------------------------------------
-// Check styles
-
-$checkBoxHeight: 18px;
-
-.root {
-  line-height: 1;
-  width: $checkBoxHeight;
-  height: $checkBoxHeight;
-  vertical-align: top;
-  position: relative;
-
-  @include ms-user-select(none);
-
-  &:before {
-    content: '';
-    position: absolute;
-    left: 1px;
-    right: 1px;
-    bottom: 1px;
-    top: 1px;
-    border-radius: 50%;
-    opacity: 1;
-    background: $bodyBackgroundColor;
-  }
-
-  &.rootIsChecked:before {
-    background: $ms-color-themePrimary;
-    opacity: 1;
-    @include high-contrast {
-      background: Window;
-    }
-  }
-
-  .check {
-    opacity: 0;
-  }
-
-  .checkHost:hover &,
-  .checkHost:focus &,
-  &:hover,
-  &:focus,
-  &.rootIsChecked {
-    .check {
-      opacity: 1;
-    }
-  }
-}
-
-.circle,
-.check {
-  font-size: $checkBoxHeight;
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: $checkBoxHeight;
-  height: $checkBoxHeight;
-  text-align: center;
-  vertical-align: middle;
-}
-
-.circle {
-  color: $ms-color-neutralTertiaryAlt;
-
-  @include high-contrast {
-    color: WindowText;
-  }
-}
-
-.rootIsChecked .circle {
-  color: $ms-color-white;
-}
-
-.check {
-  color: $ms-color-neutralTertiaryAlt;
-  font-size: 16px;
-  left: .5px;
-
-  @include high-contrast {
-    -ms-high-contrast-adjust: none;
-  }
-}
-
-.rootIsChecked .check {
-  color: $ms-color-white;
-  font-weight: 900;
-
-  @include high-contrast {
-    border: none;
-    color: WindowText;
-  }
-}

From 31ba8a6a806e930fe87c3bc421097d9ad1c254d7 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 23 Mar 2018 15:28:50 -0700
Subject: [PATCH 1635/1641] Revert "Removing unneeded scss."

This reverts commit 2d181fe55d79ca12d233d5644cabc64cb6379b4c.
---
 .../src/components/Check/Check.scss           | 98 +++++++++++++++++++
 1 file changed, 98 insertions(+)
 create mode 100644 packages/office-ui-fabric-react/src/components/Check/Check.scss

diff --git a/packages/office-ui-fabric-react/src/components/Check/Check.scss b/packages/office-ui-fabric-react/src/components/Check/Check.scss
new file mode 100644
index 0000000000000..f9c79db42036c
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/Check/Check.scss
@@ -0,0 +1,98 @@
+@import '../../common/common';
+
+// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
+
+//
+// Office UI Fabric
+// --------------------------------------------------
+// Check styles
+
+$checkBoxHeight: 18px;
+
+.root {
+  line-height: 1;
+  width: $checkBoxHeight;
+  height: $checkBoxHeight;
+  vertical-align: top;
+  position: relative;
+
+  @include ms-user-select(none);
+
+  &:before {
+    content: '';
+    position: absolute;
+    left: 1px;
+    right: 1px;
+    bottom: 1px;
+    top: 1px;
+    border-radius: 50%;
+    opacity: 1;
+    background: $bodyBackgroundColor;
+  }
+
+  &.rootIsChecked:before {
+    background: $ms-color-themePrimary;
+    opacity: 1;
+    @include high-contrast {
+      background: Window;
+    }
+  }
+
+  .check {
+    opacity: 0;
+  }
+
+  .checkHost:hover &,
+  .checkHost:focus &,
+  &:hover,
+  &:focus,
+  &.rootIsChecked {
+    .check {
+      opacity: 1;
+    }
+  }
+}
+
+.circle,
+.check {
+  font-size: $checkBoxHeight;
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: $checkBoxHeight;
+  height: $checkBoxHeight;
+  text-align: center;
+  vertical-align: middle;
+}
+
+.circle {
+  color: $ms-color-neutralTertiaryAlt;
+
+  @include high-contrast {
+    color: WindowText;
+  }
+}
+
+.rootIsChecked .circle {
+  color: $ms-color-white;
+}
+
+.check {
+  color: $ms-color-neutralTertiaryAlt;
+  font-size: 16px;
+  left: .5px;
+
+  @include high-contrast {
+    -ms-high-contrast-adjust: none;
+  }
+}
+
+.rootIsChecked .check {
+  color: $ms-color-white;
+  font-weight: 900;
+
+  @include high-contrast {
+    border: none;
+    color: WindowText;
+  }
+}

From b163a65955903b05e4ba58f5ea2b040a971a6a57 Mon Sep 17 00:00:00 2001
From: Kelsey Young <kelseyyoung4@gmail.com>
Date: Fri, 23 Mar 2018 16:36:35 -0700
Subject: [PATCH 1636/1641] Fix bug in combo box where _selectedElement ref
 wasn't being set conditionally (#4350)

* Fix bug in combo box where _selectedElement ref wasn't being set conditionally

* Add rush change file

* Use undefined instead of an empty string for the ref
---
 ...ix-combobox-scrolling-to-end_2018-03-23-19-17.json | 11 +++++++++++
 .../src/components/ComboBox/ComboBox.tsx              |  2 +-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 common/changes/office-ui-fabric-react/keyou-fix-combobox-scrolling-to-end_2018-03-23-19-17.json

diff --git a/common/changes/office-ui-fabric-react/keyou-fix-combobox-scrolling-to-end_2018-03-23-19-17.json b/common/changes/office-ui-fabric-react/keyou-fix-combobox-scrolling-to-end_2018-03-23-19-17.json
new file mode 100644
index 0000000000000..a91ada3c211a8
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/keyou-fix-combobox-scrolling-to-end_2018-03-23-19-17.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Fix bug in combo box where _selectedElement ref wasn't being set conditionally",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "keyou@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
index e396c56c9199d..329d91cab6c29 100644
--- a/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
+++ b/packages/office-ui-fabric-react/src/components/ComboBox/ComboBox.tsx
@@ -1042,7 +1042,7 @@ export class ComboBox extends BaseComponent<IComboBoxProps, IComboBoxState> {
           aria-selected={ isSelected ? 'true' : 'false'}
           ariaLabel= {item.text }
           disabled={ item.disabled }
-        > { <span ref={ this._selectedElement }>
+        > { <span ref={ isSelected ? this._selectedElement : undefined }>
           { onRenderOption(item, this._onRenderOptionContent) }
         </span>
           }

From 8023b1d8536056b13d5029049f0b9f671ec09b32 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Fri, 23 Mar 2018 17:10:17 -0700
Subject: [PATCH 1637/1641] DetailsHeader: reverting maxWidth behavior to
 previous. (#4352)

* Reverting DetailsHeader maxWidth handling to previous behavior.

* Adding change file.
---
 .../detailsheader_2018-03-23-21-41.json               | 11 +++++++++++
 .../src/components/DetailsList/DetailsHeader.test.tsx |  4 ++--
 .../src/components/DetailsList/DetailsHeader.tsx      |  7 ++-----
 3 files changed, 15 insertions(+), 7 deletions(-)
 create mode 100644 common/changes/office-ui-fabric-react/detailsheader_2018-03-23-21-41.json

diff --git a/common/changes/office-ui-fabric-react/detailsheader_2018-03-23-21-41.json b/common/changes/office-ui-fabric-react/detailsheader_2018-03-23-21-41.json
new file mode 100644
index 0000000000000..5e6e92f01e3a8
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/detailsheader_2018-03-23-21-41.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "DetailsHeader: reverting how maxWidth is handled to previous behavior.",
+      "type": "patch"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.test.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.test.tsx
index de79f7f7e6add..9b3d8d847061e 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.test.tsx
@@ -78,9 +78,9 @@ describe('DetailsHeader', () => {
     header._onSizerMouseMove({ clientX: 100 });
     expect(lastResize).toEqual({ index: 0, size: 300 });
 
-    // Mouse move 300 pixels to the right (should be capped at 400px width
+    // Mouse move 300 pixels to the right, should be 500.
     header._onSizerMouseMove({ clientX: 300 });
-    expect(lastResize).toEqual({ index: 0, size: 400 });
+    expect(lastResize).toEqual({ index: 0, size: 500 });
 
     // Complete sizing.
     header._onSizerMouseUp();
diff --git a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
index c6bd6b1a8cd8c..445fde7394f44 100644
--- a/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
+++ b/packages/office-ui-fabric-react/src/components/DetailsList/DetailsHeader.tsx
@@ -514,12 +514,9 @@ export class DetailsHeader extends BaseComponent<IDetailsHeaderProps, IDetailsHe
         movement = -movement;
       }
 
-      const column = columns[columnResizeDetails!.columnIndex];
-      const requestedSize = columnResizeDetails!.columnMinWidth + movement;
-
       onColumnResized(
-        column,
-        !!column.maxWidth ? Math.min(column.maxWidth, requestedSize) : requestedSize,
+        columns[columnResizeDetails!.columnIndex],
+        columnResizeDetails!.columnMinWidth + movement,
         columnResizeDetails!.columnIndex
       );
     }

From 38089072c6e7f877d572cd2248b8d67adfefb963 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 24 Mar 2018 15:55:11 -0700
Subject: [PATCH 1638/1641] Integrating Webpack 4 (#4320)

* Updating to webpack 4.1.1 and ts-loader.

* Adding change files.

* fix

* removing unneeded things.

* removing unneeded var.

* fix

* Reverting ts-loader for now
---
 apps/ssr-tests/package.json                   |    2 +-
 apps/ssr-tests/test/test.js                   |    2 -
 apps/test-bundle-button/webpack.config.js     |    4 +-
 .../webpack-4_2018-03-20-01-01.json           |   11 +
 .../webpack-4_2018-03-20-01-01.json           |   11 +
 .../webpack-4_2018-03-20-01-01.json           |   11 +
 .../icons/webpack-4_2018-03-20-01-01.json     |   11 +
 .../webpack-4_2018-03-20-01-01.json           |   11 +
 .../styling/webpack-4_2018-03-20-01-01.json   |   11 +
 .../utilities/webpack-4_2018-03-20-01-01.json |   11 +
 .../variants/webpack-4_2018-03-20-01-01.json  |   11 +
 .../webpack-4_2018-03-20-01-01.json           |   11 +
 common/config/rush/npm-shrinkwrap.json        | 4091 ++++++++++++-----
 common/config/rush/pinned-versions.json       |    4 +-
 packages/example-app-base/package.json        |    4 +-
 packages/experiments/package.json             |    4 +-
 packages/file-type-icons/package.json         |    4 +-
 packages/icons/package.json                   |    4 +-
 packages/merge-styles/package.json            |    4 +-
 packages/office-ui-fabric-react/package.json  |    5 +-
 packages/styling/package.json                 |    4 +-
 packages/utilities/package.json               |    4 +-
 packages/variants/package.json                |    4 +-
 scripts/package.json                          |   18 +-
 scripts/tasks/ts.js                           |    2 +-
 scripts/tasks/webpack-resources.js            |   60 +-
 26 files changed, 3179 insertions(+), 1140 deletions(-)
 create mode 100644 common/changes/@uifabric/example-app-base/webpack-4_2018-03-20-01-01.json
 create mode 100644 common/changes/@uifabric/experiments/webpack-4_2018-03-20-01-01.json
 create mode 100644 common/changes/@uifabric/file-type-icons/webpack-4_2018-03-20-01-01.json
 create mode 100644 common/changes/@uifabric/icons/webpack-4_2018-03-20-01-01.json
 create mode 100644 common/changes/@uifabric/merge-styles/webpack-4_2018-03-20-01-01.json
 create mode 100644 common/changes/@uifabric/styling/webpack-4_2018-03-20-01-01.json
 create mode 100644 common/changes/@uifabric/utilities/webpack-4_2018-03-20-01-01.json
 create mode 100644 common/changes/@uifabric/variants/webpack-4_2018-03-20-01-01.json
 create mode 100644 common/changes/office-ui-fabric-react/webpack-4_2018-03-20-01-01.json

diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 01f526c98bc28..532eed4dd3b6a 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -25,7 +25,7 @@
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
-    "webpack": "^3.7.1"
+    "webpack": "^4.1.1"
   },
   "dependencies": {
     "es6-promise": "^4.1.0",
diff --git a/apps/ssr-tests/test/test.js b/apps/ssr-tests/test/test.js
index 5a876a4a0931a..8e9983b46bb93 100644
--- a/apps/ssr-tests/test/test.js
+++ b/apps/ssr-tests/test/test.js
@@ -1,7 +1,6 @@
 'use strict';
 
 import { initializeIcons } from 'office-ui-fabric-react/lib/Icons';
-
 initializeIcons('dist/');
 
 // Configure load-themed-styles to avoid registering styles.
@@ -34,7 +33,6 @@ describe('Fabric components', () => {
   }
 });
 
-
 function testRender(componentName, component) {
   it(`${componentName} can render in a server environment`, (done) => {
     let elem = React.createElement(component);
diff --git a/apps/test-bundle-button/webpack.config.js b/apps/test-bundle-button/webpack.config.js
index 8882a7943b28a..7a123344a7b06 100644
--- a/apps/test-bundle-button/webpack.config.js
+++ b/apps/test-bundle-button/webpack.config.js
@@ -7,7 +7,9 @@ module.exports = resources.createConfig(
   PACKAGE_NAME,
   true,
   {
-    entry: './lib/index.js',
+    entry: {
+      [PACKAGE_NAME]: './lib/index.js',
+    },
 
     externals: {
       'react': 'React',
diff --git a/common/changes/@uifabric/example-app-base/webpack-4_2018-03-20-01-01.json b/common/changes/@uifabric/example-app-base/webpack-4_2018-03-20-01-01.json
new file mode 100644
index 0000000000000..93634b7a6b11a
--- /dev/null
+++ b/common/changes/@uifabric/example-app-base/webpack-4_2018-03-20-01-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/example-app-base",
+      "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/example-app-base",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/webpack-4_2018-03-20-01-01.json b/common/changes/@uifabric/experiments/webpack-4_2018-03-20-01-01.json
new file mode 100644
index 0000000000000..58b294799c1b6
--- /dev/null
+++ b/common/changes/@uifabric/experiments/webpack-4_2018-03-20-01-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/experiments",
+      "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/experiments",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/file-type-icons/webpack-4_2018-03-20-01-01.json b/common/changes/@uifabric/file-type-icons/webpack-4_2018-03-20-01-01.json
new file mode 100644
index 0000000000000..ce67c7d68883a
--- /dev/null
+++ b/common/changes/@uifabric/file-type-icons/webpack-4_2018-03-20-01-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/file-type-icons",
+      "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/file-type-icons",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/webpack-4_2018-03-20-01-01.json b/common/changes/@uifabric/icons/webpack-4_2018-03-20-01-01.json
new file mode 100644
index 0000000000000..a21fe7182eec1
--- /dev/null
+++ b/common/changes/@uifabric/icons/webpack-4_2018-03-20-01-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/icons",
+      "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/icons",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/webpack-4_2018-03-20-01-01.json b/common/changes/@uifabric/merge-styles/webpack-4_2018-03-20-01-01.json
new file mode 100644
index 0000000000000..2d25d0412e8fd
--- /dev/null
+++ b/common/changes/@uifabric/merge-styles/webpack-4_2018-03-20-01-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/merge-styles",
+      "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/merge-styles",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/webpack-4_2018-03-20-01-01.json b/common/changes/@uifabric/styling/webpack-4_2018-03-20-01-01.json
new file mode 100644
index 0000000000000..9beb2b6288986
--- /dev/null
+++ b/common/changes/@uifabric/styling/webpack-4_2018-03-20-01-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/styling",
+      "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/styling",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/webpack-4_2018-03-20-01-01.json b/common/changes/@uifabric/utilities/webpack-4_2018-03-20-01-01.json
new file mode 100644
index 0000000000000..7c142c58f2b4f
--- /dev/null
+++ b/common/changes/@uifabric/utilities/webpack-4_2018-03-20-01-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/utilities",
+      "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/utilities",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/@uifabric/variants/webpack-4_2018-03-20-01-01.json b/common/changes/@uifabric/variants/webpack-4_2018-03-20-01-01.json
new file mode 100644
index 0000000000000..f23584c6677c5
--- /dev/null
+++ b/common/changes/@uifabric/variants/webpack-4_2018-03-20-01-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "@uifabric/variants",
+      "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl",
+      "type": "minor"
+    }
+  ],
+  "packageName": "@uifabric/variants",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/webpack-4_2018-03-20-01-01.json b/common/changes/office-ui-fabric-react/webpack-4_2018-03-20-01-01.json
new file mode 100644
index 0000000000000..de156a4aa02a2
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/webpack-4_2018-03-20-01-01.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` flags on all applicable packages.",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "dzearing@microsoft.com"
+}
\ No newline at end of file
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index bad9b61a44a68..bd5039fd10d98 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -35,16 +35,16 @@
       }
     },
     "@microsoft/load-themed-styles": {
-      "version": "1.7.35",
-      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.35.tgz",
-      "integrity": "sha1-R0hnGj9ENnN0vZ+i3mUIg5/DXG0="
+      "version": "1.7.45",
+      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.45.tgz",
+      "integrity": "sha1-HlSdcoWg7MjJwSCj4c7EXq9Naxo="
     },
     "@microsoft/loader-load-themed-styles": {
-      "version": "1.7.16",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.7.16.tgz",
-      "integrity": "sha1-D9UEsZp7iY+xfMQwS80OxviQzZA=",
+      "version": "1.7.26",
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.7.26.tgz",
+      "integrity": "sha1-cJz/TcjnGXFJSolr7xweNn9wH+4=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.35",
+        "@microsoft/load-themed-styles": "1.7.45",
         "loader-utils": "1.1.0"
       }
     },
@@ -88,49 +88,107 @@
     },
     "@rush-temp/build": {
       "version": "file:projects/build.tgz",
-      "integrity": "sha1-Ver5mhBaDTlt7Y5nDUvWPDdQhPI=",
+      "integrity": "sha1-wgwnYK3aqBoZq2/68SzBfhndTTA=",
       "requires": {
         "@microsoft/api-extractor": "4.3.7",
-        "@microsoft/load-themed-styles": "1.7.35",
-        "@microsoft/loader-load-themed-styles": "1.7.16",
+        "@microsoft/load-themed-styles": "1.7.45",
+        "@microsoft/loader-load-themed-styles": "1.7.26",
         "autoprefixer": "7.2.6",
-        "awesome-typescript-loader": "3.5.0",
+        "awesome-typescript-loader": "4.0.1",
         "bundlesize": "0.15.3",
-        "chalk": "2.3.1",
+        "chalk": "2.3.2",
         "command-line-args": "4.0.7",
         "cpx": "1.5.0",
-        "css-loader": "0.28.10",
+        "css-loader": "0.28.11",
         "github": "7.3.2",
         "glob": "7.1.2",
         "gzip-size": "3.0.0",
         "jest": "21.2.1",
         "json-loader": "0.5.7",
         "mustache": "2.3.0",
-        "node-sass": "4.7.2",
+        "node-sass": "4.8.3",
         "open": "0.0.5",
-        "postcss": "6.0.19",
-        "postcss-loader": "2.1.1",
+        "postcss": "6.0.21",
+        "postcss-loader": "2.1.3",
         "postcss-modules": "0.8.0",
         "raf": "3.4.0",
         "raw-loader": "0.5.1",
-        "sass-loader": "6.0.6",
+        "sass-loader": "6.0.7",
         "source-map-loader": "0.2.3",
         "style-loader": "0.19.1",
         "ts-jest": "21.2.4",
         "tslint": "5.9.1",
         "tslint-microsoft-contrib": "5.0.3",
         "typescript": "2.7.2",
-        "uglifyjs-webpack-plugin": "0.4.6",
-        "webpack": "3.11.0",
-        "webpack-bundle-analyzer": "2.11.0",
-        "webpack-dev-server": "2.11.2",
-        "webpack-notifier": "1.5.1",
+        "webpack": "4.2.0",
+        "webpack-bundle-analyzer": "2.11.1",
+        "webpack-cli": "2.0.13",
+        "webpack-dev-server": "3.1.1",
+        "webpack-notifier": "1.6.0",
         "yargs": "6.6.0"
+      },
+      "dependencies": {
+        "acorn": {
+          "version": "5.5.3",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.5.3.tgz",
+          "integrity": "sha512-jd5MkIUlbbmb07nXH0DT3y7rDVtkzDi4XZOUVWAer8ajmF/DTSSbl5oNFyDOl/OXA33Bl79+ypHhl2pN20VeOQ=="
+        },
+        "ajv": {
+          "version": "6.3.0",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.3.0.tgz",
+          "integrity": "sha1-FlCkERTvAFdMrBC4Ay2PTBSBLac=",
+          "requires": {
+            "fast-deep-equal": "1.1.0",
+            "fast-json-stable-stringify": "2.0.0",
+            "json-schema-traverse": "0.3.1"
+          }
+        },
+        "enhanced-resolve": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-4.0.0.tgz",
+          "integrity": "sha512-jox/62b2GofV1qTUQTMPEJSDIGycS43evqYzD/KVtEb9OCoki9cnacUPxCrZa7JfPzZSYOCZhu9O9luaMxAX8g==",
+          "requires": {
+            "graceful-fs": "4.1.11",
+            "memory-fs": "0.4.1",
+            "tapable": "1.0.0"
+          }
+        },
+        "tapable": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-1.0.0.tgz",
+          "integrity": "sha512-dQRhbNQkRnaqauC7WqSJ21EEksgT0fYZX2lqXzGkpo8JNig9zGZTYoMGvyI2nWmXlE2VSVXVDu7wLVGu/mQEsg=="
+        },
+        "webpack": {
+          "version": "4.2.0",
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-4.2.0.tgz",
+          "integrity": "sha512-O/KmJ2MYoSfsZzq3//RyyYICYTb1gPAuYSIoD4XbxWFqkDrZCkF8BIAwPuFjA8SFqTcsIL3gTS7hiTZaUN2Tjw==",
+          "requires": {
+            "acorn": "5.5.3",
+            "acorn-dynamic-import": "3.0.0",
+            "ajv": "6.3.0",
+            "ajv-keywords": "3.1.0",
+            "chrome-trace-event": "0.1.2",
+            "enhanced-resolve": "4.0.0",
+            "eslint-scope": "3.7.1",
+            "loader-runner": "2.3.0",
+            "loader-utils": "1.1.0",
+            "memory-fs": "0.4.1",
+            "micromatch": "3.1.10",
+            "mkdirp": "0.5.1",
+            "neo-async": "2.5.0",
+            "node-libs-browser": "2.1.0",
+            "schema-utils": "0.4.5",
+            "tapable": "1.0.0",
+            "uglifyjs-webpack-plugin": "1.2.4",
+            "watchpack": "1.5.0",
+            "webpack-sources": "1.1.0"
+          }
+        }
       }
     },
     "@rush-temp/example-app-base": {
       "version": "file:projects/example-app-base.tgz",
-      "integrity": "sha1-9dFwsZXpye1aVKCC4clouHgGnBE=",
+      "integrity": "sha1-qYZQRj+VLq8/PWZ3P6JRpD1bx4I=",
       "requires": {
         "@types/es6-promise": "0.0.32",
         "@types/highlight.js": "9.12.2",
@@ -141,7 +199,7 @@
         "es6-promise": "4.2.4",
         "es6-weak-map": "2.0.2",
         "highlight.js": "9.12.0",
-        "office-ui-fabric-react": "5.56.0",
+        "office-ui-fabric-react": "5.69.0",
         "react": "16.2.0",
         "react-dom": "16.2.0",
         "tslib": "1.9.0"
@@ -149,9 +207,9 @@
     },
     "@rush-temp/experiments": {
       "version": "file:projects/experiments.tgz",
-      "integrity": "sha1-DN9S5Fs/j/ZkpFT0xo2wzGt34+I=",
+      "integrity": "sha1-zyOzTiJ5YsFwZ00iLSww0iph4X8=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.35",
+        "@microsoft/load-themed-styles": "1.7.45",
         "@types/enzyme": "3.1.5",
         "@types/enzyme-adapter-react-16": "1.0.1",
         "@types/es6-promise": "0.0.32",
@@ -172,15 +230,15 @@
         "react-dom": "16.2.0",
         "react-highlight": "0.10.0",
         "react-test-renderer": "16.2.0",
-        "sinon": "4.4.2",
+        "sinon": "4.4.8",
         "tslib": "1.9.0"
       }
     },
     "@rush-temp/fabric-website": {
       "version": "file:projects/fabric-website.tgz",
-      "integrity": "sha1-ZiTAxKp6omRHIlx54OVhUZsnloo=",
+      "integrity": "sha1-mkT2ZpaqlyR6lvRg4J6G56KRVKI=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.35",
+        "@microsoft/load-themed-styles": "1.7.45",
         "@types/es6-promise": "0.0.32",
         "@types/node": "8.0.26",
         "@types/prop-types": "15.5.2",
@@ -193,7 +251,7 @@
         "es6-weak-map": "2.0.2",
         "highlight.js": "9.12.0",
         "json-loader": "0.5.7",
-        "office-ui-fabric-core": "9.4.0",
+        "office-ui-fabric-core": "9.6.0",
         "react": "16.2.0",
         "react-dom": "16.2.0",
         "react-highlight": "0.10.0",
@@ -203,7 +261,7 @@
     },
     "@rush-temp/file-type-icons": {
       "version": "file:projects/file-type-icons.tgz",
-      "integrity": "sha1-4G9oT36P2AYqCpjXHfSm2Nlt2PI=",
+      "integrity": "sha1-Y1O/QMmpV8V1rPmUiyN4UZfcD90=",
       "requires": {
         "@types/react": "16.0.25",
         "@types/react-dom": "16.0.3",
@@ -214,21 +272,21 @@
     },
     "@rush-temp/icons": {
       "version": "file:projects/icons.tgz",
-      "integrity": "sha1-DnOJqyGa3UW80sWtP83EaHf3cGM=",
+      "integrity": "sha1-/2btbHqP+ggGK1q1Yb593fDPwRM=",
       "requires": {
         "tslib": "1.9.0"
       }
     },
     "@rush-temp/jest-serializer-merge-styles": {
       "version": "file:projects/jest-serializer-merge-styles.tgz",
-      "integrity": "sha1-kit2DYaoDkGt01iWhFQnsRGFoTc=",
+      "integrity": "sha1-W64IPf+x4NoEhFEZ4ct2MFwL8SA=",
       "requires": {
         "@types/jest": "21.1.8"
       }
     },
     "@rush-temp/merge-styles": {
       "version": "file:projects/merge-styles.tgz",
-      "integrity": "sha1-N4mnfc8Hv2i6QE1IvJxt4gi9AuY=",
+      "integrity": "sha1-cAHy+AQzUaVYj7PHcFbfIeHnrO4=",
       "requires": {
         "@types/jest": "21.1.8",
         "tslib": "1.9.0"
@@ -236,9 +294,9 @@
     },
     "@rush-temp/office-ui-fabric-react": {
       "version": "file:projects/office-ui-fabric-react.tgz",
-      "integrity": "sha1-ADTTmStgRKaou3YbaCqOSn0awyU=",
+      "integrity": "sha1-d/FaNKh7mwofn/6kAUhdU6ubH20=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.35",
+        "@microsoft/load-themed-styles": "1.7.45",
         "@types/enzyme": "3.1.5",
         "@types/enzyme-adapter-react-16": "1.0.1",
         "@types/es6-promise": "0.0.32",
@@ -256,29 +314,29 @@
         "es6-promise": "4.2.4",
         "es6-weak-map": "2.0.2",
         "highlight.js": "9.12.0",
-        "office-ui-fabric-core": "9.4.0",
+        "office-ui-fabric-core": "9.6.0",
         "prop-types": "15.6.1",
         "react": "16.2.0",
         "react-dom": "16.2.0",
         "react-highlight": "0.10.0",
         "react-test-renderer": "16.2.0",
         "resemblejs": "2.2.6",
-        "sinon": "4.4.2",
+        "sinon": "4.4.8",
         "tslib": "1.9.0"
       }
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
       "version": "file:projects/office-ui-fabric-react-tslint.tgz",
-      "integrity": "sha1-RqQY3nSg/9snfOzrcQNVR41UiP8=",
+      "integrity": "sha1-gizhjteVUw3ShXwHcH8yvhIscqc=",
       "requires": {
         "tslint-react": "3.5.1"
       }
     },
     "@rush-temp/ssr-tests": {
       "version": "file:projects/ssr-tests.tgz",
-      "integrity": "sha1-/RiZyyAIm4YIGMN/gmh0EFB/2Jw=",
+      "integrity": "sha1-bsUsrox3gqvybQ5RM0Oe0e34g4A=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.35",
+        "@microsoft/load-themed-styles": "1.7.45",
         "@types/es6-promise": "0.0.32",
         "@types/mocha": "2.2.39",
         "@types/webpack-env": "1.13.0",
@@ -288,14 +346,72 @@
         "react": "16.2.0",
         "react-dom": "16.2.0",
         "tslib": "1.9.0",
-        "webpack": "3.11.0"
+        "webpack": "4.2.0"
+      },
+      "dependencies": {
+        "acorn": {
+          "version": "5.5.3",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.5.3.tgz",
+          "integrity": "sha512-jd5MkIUlbbmb07nXH0DT3y7rDVtkzDi4XZOUVWAer8ajmF/DTSSbl5oNFyDOl/OXA33Bl79+ypHhl2pN20VeOQ=="
+        },
+        "ajv": {
+          "version": "6.3.0",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.3.0.tgz",
+          "integrity": "sha1-FlCkERTvAFdMrBC4Ay2PTBSBLac=",
+          "requires": {
+            "fast-deep-equal": "1.1.0",
+            "fast-json-stable-stringify": "2.0.0",
+            "json-schema-traverse": "0.3.1"
+          }
+        },
+        "enhanced-resolve": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-4.0.0.tgz",
+          "integrity": "sha512-jox/62b2GofV1qTUQTMPEJSDIGycS43evqYzD/KVtEb9OCoki9cnacUPxCrZa7JfPzZSYOCZhu9O9luaMxAX8g==",
+          "requires": {
+            "graceful-fs": "4.1.11",
+            "memory-fs": "0.4.1",
+            "tapable": "1.0.0"
+          }
+        },
+        "tapable": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-1.0.0.tgz",
+          "integrity": "sha512-dQRhbNQkRnaqauC7WqSJ21EEksgT0fYZX2lqXzGkpo8JNig9zGZTYoMGvyI2nWmXlE2VSVXVDu7wLVGu/mQEsg=="
+        },
+        "webpack": {
+          "version": "4.2.0",
+          "resolved": "https://registry.npmjs.org/webpack/-/webpack-4.2.0.tgz",
+          "integrity": "sha512-O/KmJ2MYoSfsZzq3//RyyYICYTb1gPAuYSIoD4XbxWFqkDrZCkF8BIAwPuFjA8SFqTcsIL3gTS7hiTZaUN2Tjw==",
+          "requires": {
+            "acorn": "5.5.3",
+            "acorn-dynamic-import": "3.0.0",
+            "ajv": "6.3.0",
+            "ajv-keywords": "3.1.0",
+            "chrome-trace-event": "0.1.2",
+            "enhanced-resolve": "4.0.0",
+            "eslint-scope": "3.7.1",
+            "loader-runner": "2.3.0",
+            "loader-utils": "1.1.0",
+            "memory-fs": "0.4.1",
+            "micromatch": "3.1.10",
+            "mkdirp": "0.5.1",
+            "neo-async": "2.5.0",
+            "node-libs-browser": "2.1.0",
+            "schema-utils": "0.4.5",
+            "tapable": "1.0.0",
+            "uglifyjs-webpack-plugin": "1.2.4",
+            "watchpack": "1.5.0",
+            "webpack-sources": "1.1.0"
+          }
+        }
       }
     },
     "@rush-temp/styling": {
       "version": "file:projects/styling.tgz",
-      "integrity": "sha1-yooDPN6j4bEXiRcw/nKoruCTENM=",
+      "integrity": "sha1-Vasx0FoVOvlV87LmX+fqMtA0Xv0=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.35",
+        "@microsoft/load-themed-styles": "1.7.45",
         "@types/jest": "21.1.8",
         "@types/react": "16.0.25",
         "@types/webpack-env": "1.13.0",
@@ -308,7 +424,7 @@
     },
     "@rush-temp/test-bundle-button": {
       "version": "file:projects/test-bundle-button.tgz",
-      "integrity": "sha1-hHSH1ybHvJHL39pq1wIYc+s71lU=",
+      "integrity": "sha1-M454bpbqEeK+5gB+DKCyFRyAf+E=",
       "requires": {
         "@types/prop-types": "15.5.2",
         "@types/react": "16.0.25",
@@ -321,15 +437,15 @@
     },
     "@rush-temp/todo-app": {
       "version": "file:projects/todo-app.tgz",
-      "integrity": "sha1-TgRNk3WpedPAxOPIzAAWpZWU69I=",
+      "integrity": "sha1-heuPr0wLdItgH7nQe1W8qilWEG0=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.35",
+        "@microsoft/load-themed-styles": "1.7.45",
         "@types/es6-promise": "0.0.32",
         "@types/react": "16.0.25",
         "@types/react-dom": "16.0.3",
         "@types/webpack-env": "1.13.0",
         "es6-promise": "4.2.4",
-        "immutability-helper": "2.6.5",
+        "immutability-helper": "2.6.6",
         "react": "16.2.0",
         "react-dom": "16.2.0",
         "tslib": "1.9.0",
@@ -338,9 +454,9 @@
     },
     "@rush-temp/utilities": {
       "version": "file:projects/utilities.tgz",
-      "integrity": "sha1-PEyJRbuw/Ha4QmT2cGhecacPKEs=",
+      "integrity": "sha1-gq+TrBQAwtPx2YrnqPR4+y3IHt0=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.35",
+        "@microsoft/load-themed-styles": "1.7.45",
         "@types/enzyme": "3.1.5",
         "@types/enzyme-adapter-react-16": "1.0.1",
         "@types/jest": "21.1.8",
@@ -353,13 +469,13 @@
         "prop-types": "15.6.1",
         "react": "16.2.0",
         "react-dom": "16.2.0",
-        "sinon": "4.4.2",
+        "sinon": "4.4.8",
         "tslib": "1.9.0"
       }
     },
     "@rush-temp/variants": {
       "version": "file:projects/variants.tgz",
-      "integrity": "sha1-vxbJXzxQp+9DbiRutWD7vAQX7ew=",
+      "integrity": "sha1-vq/Fgs1jci3SQRI+xjBSOVhIH2A=",
       "requires": {
         "@types/jest": "21.1.8",
         "tslib": "1.9.0"
@@ -367,40 +483,66 @@
     },
     "@rush-temp/vr-tests": {
       "version": "file:projects/vr-tests.tgz",
-      "integrity": "sha1-NzAoR+bMCugFFdIuBZSNjwY5yXM=",
+      "integrity": "sha1-zvzwF8Jw05XWzEHPOej1ls48MFE=",
       "requires": {
         "@storybook/addon-options": "3.2.3",
-        "@storybook/react": "3.3.14",
+        "@storybook/react": "3.3.15",
         "@types/react": "16.0.25",
         "@types/react-dom": "16.0.3",
         "@types/storybook__react": "3.0.5",
         "awesome-typescript-loader": "3.5.0",
-        "css-loader": "0.28.10",
+        "css-loader": "0.28.11",
         "file-loader": "0.11.2",
-        "postcss-loader": "2.1.1",
+        "postcss-loader": "2.1.3",
         "raw-loader": "0.5.1",
         "react": "16.2.0",
         "react-dom": "16.2.0",
         "screener-runner": "0.6.19",
-        "screener-storybook": "0.11.3",
+        "screener-storybook": "0.11.5",
         "storybook-readme": "3.0.6",
         "style-loader": "0.19.1",
         "tslib": "1.9.0",
         "typescript": "2.7.2"
+      },
+      "dependencies": {
+        "awesome-typescript-loader": {
+          "version": "3.5.0",
+          "resolved": "https://registry.npmjs.org/awesome-typescript-loader/-/awesome-typescript-loader-3.5.0.tgz",
+          "integrity": "sha512-qzgm9SEvodVkSi9QY7Me1/rujg+YBNMjayNSAyzNghwTEez++gXoPCwMvpbHRG7wrOkDCiF6dquvv9ESmUBAuw==",
+          "requires": {
+            "chalk": "2.3.2",
+            "enhanced-resolve": "3.3.0",
+            "loader-utils": "1.1.0",
+            "lodash": "4.17.5",
+            "micromatch": "3.1.10",
+            "mkdirp": "0.5.1",
+            "source-map-support": "0.5.4"
+          }
+        },
+        "lodash": {
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
+        }
       }
     },
+    "@sindresorhus/is": {
+      "version": "0.7.0",
+      "resolved": "https://registry.npmjs.org/@sindresorhus/is/-/is-0.7.0.tgz",
+      "integrity": "sha512-ONhaKPIufzzrlNbqtWFFd+jlnemX6lJAgq9ZeiZtS7I1PIf/la7CW4m83rTXRnVnsMbW2k56pGYu7AUFJD9Pow=="
+    },
     "@sinonjs/formatio": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/@sinonjs/formatio/-/formatio-2.0.0.tgz",
+      "resolved": "http://registry.npmjs.org/@sinonjs/formatio/-/formatio-2.0.0.tgz",
       "integrity": "sha512-ls6CAMA6/5gG+O/IdsBcblvnd8qcO/l1TYoNeAzp3wcISOxlPXQEus0mLcdwazEkWjaBdaJ3TaxmNgCLWwvWzg==",
       "requires": {
         "samsam": "1.3.0"
       }
     },
     "@storybook/addon-actions": {
-      "version": "3.3.14",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-actions/-/addon-actions-3.3.14.tgz",
-      "integrity": "sha512-MU+Sz80hlC3+VJW15yoa9y7mzsNechtd9X7WvugIB1Pg6AwY2IYNZoagy2dXwdBD6+sUTj1zWt0c7P7y5A/EAg==",
+      "version": "3.3.15",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-actions/-/addon-actions-3.3.15.tgz",
+      "integrity": "sha512-oo2ShFrBihswIEdVlt3Sl/b9Cxp5mYN8XhNni9NZC1vgPFwKeOm790zc3+N8cPDoiV++OVb699ujmG1sVNGkhA==",
       "requires": {
         "deep-equal": "1.0.1",
         "global": "4.3.2",
@@ -411,11 +553,11 @@
       }
     },
     "@storybook/addon-links": {
-      "version": "3.3.14",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-links/-/addon-links-3.3.14.tgz",
-      "integrity": "sha512-pD+/aOpGPcDQ/4h7UHA+nu3ye0w1KJ8GFz4MCX7a+38rYDUe1ePD5xmLT56zHCKqyKZgrrIoGZg/yEQjpQCJug==",
+      "version": "3.3.15",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-links/-/addon-links-3.3.15.tgz",
+      "integrity": "sha512-driTEMoB2UV+1p1/NsHlT3Lcuk9ZHkKHcsUeduVSgEZ0mMJJqvYrTHoA5hN+9DTuhwiP26B8AEUPe2fzCiMrLw==",
       "requires": {
-        "@storybook/components": "3.3.14",
+        "@storybook/components": "3.3.15",
         "global": "4.3.2",
         "prop-types": "15.6.1"
       }
@@ -425,41 +567,41 @@
       "resolved": "https://registry.npmjs.org/@storybook/addon-options/-/addon-options-3.2.3.tgz",
       "integrity": "sha1-6jdA0onUKc52fpaZvzpkfddBWS0=",
       "requires": {
-        "@storybook/addons": "3.3.14"
+        "@storybook/addons": "3.3.15"
       }
     },
     "@storybook/addons": {
-      "version": "3.3.14",
-      "resolved": "https://registry.npmjs.org/@storybook/addons/-/addons-3.3.14.tgz",
-      "integrity": "sha512-cVSowQdWOr/XxWk60ykr4a+0gnpVnfWkJ0pIbGQUBcq6tvGrAoZ76Cq18lYS7NHNL2lwoEQT3wBs7w0UaJtOTA=="
+      "version": "3.3.15",
+      "resolved": "https://registry.npmjs.org/@storybook/addons/-/addons-3.3.15.tgz",
+      "integrity": "sha512-zObDm/l45Ay/XnLzQ0UDkRVVL4RBve3y6I9eB8mxItTusSHFb0KlbF9Xz4amZ1Eef7cBsOpXBoEyvyKFUck5SQ=="
     },
     "@storybook/channel-postmessage": {
-      "version": "3.3.14",
-      "resolved": "https://registry.npmjs.org/@storybook/channel-postmessage/-/channel-postmessage-3.3.14.tgz",
-      "integrity": "sha512-xFmc2F/OKqrrdMjrvJTfADOl3+fKxKCs4vNr8w26k8gBLDp/JuoSomnar7kR7PfX9mAAfVgVle8erUMkHc0Tsg==",
+      "version": "3.3.15",
+      "resolved": "https://registry.npmjs.org/@storybook/channel-postmessage/-/channel-postmessage-3.3.15.tgz",
+      "integrity": "sha512-nQKO6gJzHbYyZDaUjMlIfPZNsZlgBoGnZCpn6idi/JWWe417mOxT0Cv6FUJQ0zWHz/E6Wjrn7/ms3MLV7aOpDA==",
       "requires": {
-        "@storybook/channels": "3.3.14",
+        "@storybook/channels": "3.3.15",
         "global": "4.3.2",
         "json-stringify-safe": "5.0.1"
       }
     },
     "@storybook/channels": {
-      "version": "3.3.14",
-      "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-3.3.14.tgz",
-      "integrity": "sha512-qrd7WnQDmdX0uMGbTmRKlLL9R8mrVClsT2Idb1YsL7gbTE2X4QyOTt4ANFeCmvZ8LxqOmEv5glcBmfBRNjBPgQ=="
+      "version": "3.3.15",
+      "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-3.3.15.tgz",
+      "integrity": "sha512-iIkmkNAILaGie1zGBLFQlv+1PM1SRSaqM+IEgCpq3JHd4ACWSw9k3kGQsxeahcyM0c8+gONHjOK88Hp6qoZr4Q=="
     },
     "@storybook/client-logger": {
-      "version": "3.3.14",
-      "resolved": "https://registry.npmjs.org/@storybook/client-logger/-/client-logger-3.3.14.tgz",
-      "integrity": "sha512-dKuASmwvZqriu63CsNlvvUWyQ9EuYqS6sXmdy5yhusycFl+LfhvMMNKzENxb91ZSAcE75wH39VZVdLZTxsH9Fw=="
+      "version": "3.3.15",
+      "resolved": "https://registry.npmjs.org/@storybook/client-logger/-/client-logger-3.3.15.tgz",
+      "integrity": "sha512-+UWvVSr3KrnDUa1JXv8cdirzcM9jrjcthgWajmvU6TlBnzvSqF6oHLeDTGOcNPp4zGg12kSCAjB3dnNdVEkZOw=="
     },
     "@storybook/components": {
-      "version": "3.3.14",
-      "resolved": "https://registry.npmjs.org/@storybook/components/-/components-3.3.14.tgz",
-      "integrity": "sha512-MCUx0JWk21jspFUb/dqaqBB1ZCBHhSIHlkBt438+oub4CRlTHl5q3tDffyDUzgdzMULi1xubtEH8f9pet87A8w==",
+      "version": "3.3.15",
+      "resolved": "https://registry.npmjs.org/@storybook/components/-/components-3.3.15.tgz",
+      "integrity": "sha512-WgDh/gUPo18Buaf3JguXQx97tBehZzaXLcav3TBA37n20mOhprgADqpIu1tgmMKx3RVqMk57TtD0pNQuISqt0Q==",
       "requires": {
         "glamor": "2.20.40",
-        "glamorous": "4.11.6",
+        "glamorous": "4.12.1",
         "prop-types": "15.6.1"
       }
     },
@@ -474,11 +616,11 @@
       }
     },
     "@storybook/node-logger": {
-      "version": "3.3.14",
-      "resolved": "https://registry.npmjs.org/@storybook/node-logger/-/node-logger-3.3.14.tgz",
-      "integrity": "sha512-MBVr0J//5ENuDqNT5LWKTbLF7rmUJk0BpBnuJJrIif1Z+AfNs1gJz7MeL5V/3GNnUx8jc6NzNWCvNFJUIvf0uw==",
+      "version": "3.3.15",
+      "resolved": "https://registry.npmjs.org/@storybook/node-logger/-/node-logger-3.3.15.tgz",
+      "integrity": "sha512-7d9lQptj2N7WIR4FXUWXRmSIjDS05xXFhvjoC4wMHnTxNQUOnJsVbiInj2E1qinYU3YWZIU/mD0Y5n5vyEq7QA==",
       "requires": {
-        "chalk": "2.3.1",
+        "chalk": "2.3.2",
         "npmlog": "4.1.2"
       }
     },
@@ -492,20 +634,20 @@
       }
     },
     "@storybook/react": {
-      "version": "3.3.14",
-      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-3.3.14.tgz",
-      "integrity": "sha512-qeeEhP5JyqmZKKbNdkSIj2SqWN1Q4bqy8ed+b+CS3gPoSGPy7DscbSwykllXvaTO9NASYGjFHG9b6hohQSQurw==",
-      "requires": {
-        "@storybook/addon-actions": "3.3.14",
-        "@storybook/addon-links": "3.3.14",
-        "@storybook/addons": "3.3.14",
-        "@storybook/channel-postmessage": "3.3.14",
-        "@storybook/client-logger": "3.3.14",
-        "@storybook/node-logger": "3.3.14",
-        "@storybook/ui": "3.3.14",
+      "version": "3.3.15",
+      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-3.3.15.tgz",
+      "integrity": "sha512-9ZNOU8eNeBiIaDEng5nSE1udvYRNmLmv+xVtaCTslDfRxtGxm3UufyFg3nMjLbiiSTUHLAURiu5CKS/NJOc8pw==",
+      "requires": {
+        "@storybook/addon-actions": "3.3.15",
+        "@storybook/addon-links": "3.3.15",
+        "@storybook/addons": "3.3.15",
+        "@storybook/channel-postmessage": "3.3.15",
+        "@storybook/client-logger": "3.3.15",
+        "@storybook/node-logger": "3.3.15",
+        "@storybook/ui": "3.3.15",
         "airbnb-js-shims": "1.4.1",
         "autoprefixer": "7.2.6",
-        "babel-loader": "7.1.3",
+        "babel-loader": "7.1.4",
         "babel-plugin-react-docgen": "1.8.3",
         "babel-plugin-transform-regenerator": "6.26.0",
         "babel-plugin-transform-runtime": "6.23.0",
@@ -515,19 +657,19 @@
         "babel-preset-react-app": "3.1.1",
         "babel-preset-stage-0": "6.24.1",
         "babel-runtime": "6.26.0",
-        "case-sensitive-paths-webpack-plugin": "2.1.1",
-        "chalk": "2.3.1",
-        "commander": "2.14.1",
+        "case-sensitive-paths-webpack-plugin": "2.1.2",
+        "chalk": "2.3.2",
+        "commander": "2.15.1",
         "common-tags": "1.7.2",
         "configstore": "3.1.1",
         "core-js": "2.5.3",
-        "css-loader": "0.28.10",
+        "css-loader": "0.28.11",
         "dotenv-webpack": "1.5.5",
-        "express": "4.16.2",
-        "file-loader": "1.1.10",
+        "express": "4.16.3",
+        "file-loader": "1.1.11",
         "find-cache-dir": "1.0.0",
         "glamor": "2.20.40",
-        "glamorous": "4.11.6",
+        "glamorous": "4.12.1",
         "global": "4.3.2",
         "html-loader": "0.5.5",
         "html-webpack-plugin": "2.30.1",
@@ -538,61 +680,52 @@
         "markdown-loader": "2.0.2",
         "npmlog": "4.1.2",
         "postcss-flexbugs-fixes": "3.3.0",
-        "postcss-loader": "2.1.1",
+        "postcss-loader": "2.1.3",
         "prop-types": "15.6.1",
         "qs": "6.5.1",
         "redux": "3.7.2",
-        "request": "2.83.0",
+        "request": "2.85.0",
         "serve-favicon": "2.4.5",
         "shelljs": "0.7.8",
         "style-loader": "0.19.1",
-        "uglifyjs-webpack-plugin": "1.2.2",
+        "uglifyjs-webpack-plugin": "1.2.4",
         "url-loader": "0.6.2",
         "util-deprecate": "1.0.2",
         "uuid": "3.2.1",
-        "webpack": "3.11.0",
+        "webpack": "3.10.0",
         "webpack-dev-middleware": "1.12.2",
-        "webpack-hot-middleware": "2.21.1"
+        "webpack-hot-middleware": "2.21.2"
       },
       "dependencies": {
         "file-loader": {
-          "version": "1.1.10",
-          "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-1.1.10.tgz",
-          "integrity": "sha512-dNnT4yJgUPtGDg0+m03kQ0b/PZi3Y12EnqYuRPNCsbYkBZc6j+fwVWy40jWzZjn5kIzQ4BLIxzJimbwAYlnPGw==",
+          "version": "1.1.11",
+          "resolved": "https://registry.npmjs.org/file-loader/-/file-loader-1.1.11.tgz",
+          "integrity": "sha512-TGR4HU7HUsGg6GCOPJnFk06RhWgEWFLAGWiT6rcD+GRC2keU3s9RGJ+b3Z6/U73jwwNb2gKLJ7YCrp+jvU4ALg==",
           "requires": {
             "loader-utils": "1.1.0",
             "schema-utils": "0.4.5"
           }
         },
-        "uglify-es": {
-          "version": "3.3.9",
-          "resolved": "https://registry.npmjs.org/uglify-es/-/uglify-es-3.3.9.tgz",
-          "integrity": "sha512-r+MU0rfv4L/0eeW3xZrd16t4NZfK8Ld4SWVglYBb7ez5uXFWHuVRs6xCTrf1yirs9a4j4Y27nn7SRfO6v67XsQ==",
+        "shelljs": {
+          "version": "0.7.8",
+          "resolved": "https://registry.npmjs.org/shelljs/-/shelljs-0.7.8.tgz",
+          "integrity": "sha1-3svPh0sNHl+3LhSxZKloMEjprLM=",
           "requires": {
-            "commander": "2.13.0",
-            "source-map": "0.6.1"
-          },
-          "dependencies": {
-            "commander": {
-              "version": "2.13.0",
-              "resolved": "https://registry.npmjs.org/commander/-/commander-2.13.0.tgz",
-              "integrity": "sha512-MVuS359B+YzaWqjCL/c+22gfryv+mCBPHAv3zyVI2GN8EY6IRP8VwtasXn8jyyhvvq84R4ImN1OKRtcbIasjYA=="
-            }
+            "glob": "7.1.2",
+            "interpret": "1.1.0",
+            "rechoir": "0.6.2"
           }
         },
-        "uglifyjs-webpack-plugin": {
-          "version": "1.2.2",
-          "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-1.2.2.tgz",
-          "integrity": "sha512-CG/NvzXfemUAm5Y4Guh5eEaJYHtkG7kKNpXEJHp9QpxsFVB5/qKvYWoMaq4sa99ccZ0hM3MK8vQV9XPZB4357A==",
+        "webpack-dev-middleware": {
+          "version": "1.12.2",
+          "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-1.12.2.tgz",
+          "integrity": "sha512-FCrqPy1yy/sN6U/SaEZcHKRXGlqU0DUaEBL45jkUYoB8foVb6wCnbIJ1HKIx+qUFTW+3JpVcCJCxZ8VATL4e+A==",
           "requires": {
-            "cacache": "10.0.4",
-            "find-cache-dir": "1.0.0",
-            "schema-utils": "0.4.5",
-            "serialize-javascript": "1.4.0",
-            "source-map": "0.6.1",
-            "uglify-es": "3.3.9",
-            "webpack-sources": "1.1.0",
-            "worker-farm": "1.5.4"
+            "memory-fs": "0.4.1",
+            "mime": "1.6.0",
+            "path-is-absolute": "1.0.1",
+            "range-parser": "1.2.0",
+            "time-stamp": "2.0.0"
           }
         }
       }
@@ -629,11 +762,11 @@
       }
     },
     "@storybook/ui": {
-      "version": "3.3.14",
-      "resolved": "https://registry.npmjs.org/@storybook/ui/-/ui-3.3.14.tgz",
-      "integrity": "sha512-aL5mqZ8WNW+bRGVaLuvCfxiLtKvorL9poXosgyc1jZurwi3Z05k7injkg16LuA1dE0wSib/mgHXjgzKXHN+Fhg==",
+      "version": "3.3.15",
+      "resolved": "https://registry.npmjs.org/@storybook/ui/-/ui-3.3.15.tgz",
+      "integrity": "sha512-p9r7BzmHg9Rmy6zXAsHiUXFYiLot+3MblTfcuU1F7Rc7l3zoZmA6RjIH2TO8DpqYLZiMB+hSFBcLSXfSYKjpdg==",
       "requires": {
-        "@storybook/components": "3.3.14",
+        "@storybook/components": "3.3.15",
         "@storybook/mantra-core": "1.7.2",
         "@storybook/podda": "1.2.3",
         "@storybook/react-komposer": "2.0.3",
@@ -643,7 +776,7 @@
         "fuse.js": "3.2.0",
         "global": "4.3.2",
         "json-stringify-safe": "5.0.1",
-        "keycode": "2.1.9",
+        "keycode": "2.2.0",
         "lodash.debounce": "4.0.8",
         "lodash.pick": "4.4.0",
         "lodash.sortby": "4.7.0",
@@ -652,7 +785,7 @@
         "react-fuzzy": "0.5.2",
         "react-icons": "2.2.7",
         "react-inspector": "2.2.2",
-        "react-modal": "3.3.1",
+        "react-modal": "3.3.2",
         "react-split-pane": "0.1.77",
         "react-treebeard": "2.1.0",
         "redux": "3.7.2"
@@ -783,40 +916,40 @@
       "integrity": "sha1-LrHQCl5Ow/pYx2r94S4YK2bcXBw="
     },
     "@uifabric/icons": {
-      "version": "5.4.2",
-      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.4.2.tgz",
-      "integrity": "sha512-JG0euHlQhcVsI9wCfKE/DYDoDjzQNcHDg2Wh1NeFeVPz/6L0s0D7Izw2ULkZgW1TCLFcNx0xdwN+SSnGjIlTkw==",
+      "version": "5.6.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.6.0.tgz",
+      "integrity": "sha512-yF7px9hFI6Pif/cvA1WLVNlXrdFU4ap9ivng17JTJ8Lt709NyuSyhvrrFiGhRnBlRhkBmOGoJHrgtT494TKLYQ==",
       "requires": {
-        "@uifabric/styling": "5.19.0",
+        "@uifabric/styling": "5.20.0",
         "tslib": "1.9.0"
       }
     },
     "@uifabric/merge-styles": {
-      "version": "5.12.2",
-      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.12.2.tgz",
-      "integrity": "sha512-PVUu9IIa6voT5YvZAfd3GJvHZpTyA6m3WCAqSjCvNScGJN1EdQ9YQjfJpC1FWsUNYcXIBQqLl7YiuAE+aCz99A==",
+      "version": "5.13.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.13.0.tgz",
+      "integrity": "sha512-F45U4pVJbXYmP4pSXdSGa7uq9JhsaYovuA1COb7wXCgv4NWIRqdofTLGFF6rvVddK4hXxWN55ANo2DZUCU+CgA==",
       "requires": {
         "tslib": "1.9.0"
       }
     },
     "@uifabric/styling": {
-      "version": "5.19.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.19.0.tgz",
-      "integrity": "sha512-XZw+RFaw6RscwAvAO7+w4MXbLI0/lVqBcriU65EKYLvBXvMbYry3cY4AxobQ/5e0LdjXs8YPOFHOJHfTvw18Gg==",
+      "version": "5.20.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.20.0.tgz",
+      "integrity": "sha512-kyb2zzW7731jWNM5IGOGOrtWV0Vm0Gricie7XO3Jy2/pc0JfYOJa2blqhr2MSVscEg5lIkqG3SI2+OJO2obYKQ==",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.35",
-        "@uifabric/merge-styles": "5.12.2",
-        "@uifabric/utilities": "5.13.0",
+        "@microsoft/load-themed-styles": "1.7.45",
+        "@uifabric/merge-styles": "5.13.0",
+        "@uifabric/utilities": "5.20.0",
         "tslib": "1.9.0"
       }
     },
     "@uifabric/utilities": {
-      "version": "5.13.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.13.0.tgz",
-      "integrity": "sha512-fgKKMs/tea/TTSvyWuBzDT/SpDLzeUp6/fNqrrK2iSM0CxSn8wfTQdAwL6WBVAsgR4TZvTU0RioJVM/Tg/H9QQ==",
+      "version": "5.20.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.20.0.tgz",
+      "integrity": "sha512-RbLVifLd4tfbG45FH9YPe6SRmJxu02X7nB7279LFJvGB0H9p4/rF2SAnVk4tbia7AnS5DYGFe2ILUyVlD/PQ5g==",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.35",
-        "@uifabric/merge-styles": "5.12.2",
+        "@microsoft/load-themed-styles": "1.7.45",
+        "@uifabric/merge-styles": "5.13.0",
         "prop-types": "15.6.1",
         "tslib": "1.9.0"
       }
@@ -832,9 +965,9 @@
       "integrity": "sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q=="
     },
     "accepts": {
-      "version": "1.3.4",
-      "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.4.tgz",
-      "integrity": "sha1-hiRnWMfdbSGmR0/whKR0DsBesh8=",
+      "version": "1.3.5",
+      "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.5.tgz",
+      "integrity": "sha1-63d99gEXI6OxTopywIBcjoZ0a9I=",
       "requires": {
         "mime-types": "2.1.18",
         "negotiator": "0.6.1"
@@ -846,11 +979,18 @@
       "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c="
     },
     "acorn-dynamic-import": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/acorn-dynamic-import/-/acorn-dynamic-import-2.0.2.tgz",
-      "integrity": "sha1-x1K9IQvvZ5UBtsbLf8hPj0cVjMQ=",
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/acorn-dynamic-import/-/acorn-dynamic-import-3.0.0.tgz",
+      "integrity": "sha512-zVWV8Z8lislJoOKKqdNMOB+s6+XV5WERty8MnKBeFgwA+19XJjJHs2RP5dzM57FftIs+jQnRToLiWazKr6sSWg==",
       "requires": {
-        "acorn": "4.0.13"
+        "acorn": "5.5.3"
+      },
+      "dependencies": {
+        "acorn": {
+          "version": "5.5.3",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.5.3.tgz",
+          "integrity": "sha512-jd5MkIUlbbmb07nXH0DT3y7rDVtkzDi4XZOUVWAer8ajmF/DTSSbl5oNFyDOl/OXA33Bl79+ypHhl2pN20VeOQ=="
+        }
       }
     },
     "acorn-globals": {
@@ -958,13 +1098,18 @@
       "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
     },
     "ansi-styles": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
-      "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug==",
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
+      "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
       "requires": {
         "color-convert": "1.9.1"
       }
     },
+    "any-observable": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/any-observable/-/any-observable-0.2.0.tgz",
+      "integrity": "sha1-xnhwBYADV5AJCD9UrAq6+1wz0kI="
+    },
     "anymatch": {
       "version": "1.3.2",
       "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-1.3.2.tgz",
@@ -1062,7 +1207,7 @@
       "integrity": "sha1-u13KOCu5TwXhUZQ3PRb9O6HKEQ0=",
       "requires": {
         "delegates": "1.0.0",
-        "readable-stream": "2.3.4"
+        "readable-stream": "2.3.5"
       }
     },
     "argparse": {
@@ -1096,6 +1241,11 @@
         "typical": "2.6.1"
       }
     },
+    "array-differ": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/array-differ/-/array-differ-1.0.0.tgz",
+      "integrity": "sha1-7/UuN1gknTO+QCuLuOVkuytdQDE="
+    },
     "array-equal": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/array-equal/-/array-equal-1.0.0.tgz",
@@ -1127,7 +1277,7 @@
       "integrity": "sha1-GEtI9i2S10UrsxsyMWXH+L0CJm0=",
       "requires": {
         "define-properties": "1.1.2",
-        "es-abstract": "1.10.0"
+        "es-abstract": "1.11.0"
       }
     },
     "array-map": {
@@ -1164,7 +1314,7 @@
       "integrity": "sha512-i18e2APdsiezkcqDyZor78Pbfjfds3S94dG6dgIV2ZASJaUf1N0dz2tGdrmwrmlZuNUgxH+wz6Z0zYVH2c5xzQ==",
       "requires": {
         "define-properties": "1.1.2",
-        "es-abstract": "1.10.0",
+        "es-abstract": "1.11.0",
         "function-bind": "1.1.1"
       }
     },
@@ -1174,7 +1324,7 @@
       "integrity": "sha512-3GhsA78XgK//wQKbhUe6L93kknekGlTRY0kvYcpuSi0aa9rVrMr/okeIIv/XSpN8fZ5iUM+bWifhf2/7CYKtIg==",
       "requires": {
         "define-properties": "1.1.2",
-        "es-abstract": "1.10.0",
+        "es-abstract": "1.11.0",
         "function-bind": "1.1.1"
       }
     },
@@ -1222,9 +1372,9 @@
       "integrity": "sha1-WWZ/QfrdTyDMvCu5a41Pf3jsA2c="
     },
     "ast-types": {
-      "version": "0.10.1",
-      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.10.1.tgz",
-      "integrity": "sha512-UY7+9DPzlJ9VM8eY0b2TUZcZvF+1pO0hzMtAyjBYKhOmnvRlqYNYnWdtsMj0V16CGaMlpL0G1jnLbLo4AyotuQ=="
+      "version": "0.11.3",
+      "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.11.3.tgz",
+      "integrity": "sha512-XA5o5dsNw8MhyW0Q7MWXJWc4oOzZKbdsEJq45h7c8q/d9DwWZ5F2ugUc1PuMLPGsUnphCt/cNDHu8JeBbxf1qA=="
     },
     "astral-regex": {
       "version": "1.0.0",
@@ -1275,25 +1425,25 @@
       "integrity": "sha512-Iq8TRIB+/9eQ8rbGhcP7ct5cYb/3qjNYAR2SnzLCEcwF6rvVOax8+9+fccgXk4bEhQGjOZd5TLhsksmAdsbGqQ==",
       "requires": {
         "browserslist": "2.11.3",
-        "caniuse-lite": "1.0.30000810",
+        "caniuse-lite": "1.0.30000819",
         "normalize-range": "0.1.2",
         "num2fraction": "1.2.2",
-        "postcss": "6.0.19",
+        "postcss": "6.0.21",
         "postcss-value-parser": "3.3.0"
       }
     },
     "awesome-typescript-loader": {
-      "version": "3.5.0",
-      "resolved": "https://registry.npmjs.org/awesome-typescript-loader/-/awesome-typescript-loader-3.5.0.tgz",
-      "integrity": "sha512-qzgm9SEvodVkSi9QY7Me1/rujg+YBNMjayNSAyzNghwTEez++gXoPCwMvpbHRG7wrOkDCiF6dquvv9ESmUBAuw==",
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/awesome-typescript-loader/-/awesome-typescript-loader-4.0.1.tgz",
+      "integrity": "sha512-lx6JJXtuNXyrK1DBx/+w6fbnbcfavMz0a2zszZ89yQ/NAAUE6GzIAtfQ2mkD96piClCoxLpbNpTkVi/H8FJn7w==",
       "requires": {
-        "chalk": "2.3.1",
+        "chalk": "2.3.2",
         "enhanced-resolve": "3.3.0",
         "loader-utils": "1.1.0",
         "lodash": "4.17.5",
-        "micromatch": "3.1.9",
+        "micromatch": "3.1.10",
         "mkdirp": "0.5.1",
-        "source-map-support": "0.5.3"
+        "source-map-support": "0.5.4"
       },
       "dependencies": {
         "lodash": {
@@ -1641,9 +1791,9 @@
       }
     },
     "babel-loader": {
-      "version": "7.1.3",
-      "resolved": "https://registry.npmjs.org/babel-loader/-/babel-loader-7.1.3.tgz",
-      "integrity": "sha512-PeN29YvOynPMvNk7QCzsHqxpmfXwKAC+uxkiSNFQsmXBBVltzEkVWmv/Ip3tx7yk149dQUwk497bTXNu+DZjLA==",
+      "version": "7.1.4",
+      "resolved": "https://registry.npmjs.org/babel-loader/-/babel-loader-7.1.4.tgz",
+      "integrity": "sha512-/hbyEvPzBJuGpk9o80R0ZyTej6heEOr59GoEUtn8qFKbnx4cJm9FWES6J/iv644sYgrtVw9JJQkjaLW/bqb5gw==",
       "requires": {
         "find-cache-dir": "1.0.0",
         "loader-utils": "1.1.0",
@@ -1682,8 +1832,8 @@
       "integrity": "sha1-Z2DN2Xf0EdPhdbsGTyvDJ9mbK24=",
       "requires": {
         "find-up": "2.1.0",
-        "istanbul-lib-instrument": "1.9.2",
-        "test-exclude": "4.2.0"
+        "istanbul-lib-instrument": "1.10.1",
+        "test-exclude": "4.2.1"
       }
     },
     "babel-plugin-jest-hoist": {
@@ -2374,10 +2524,41 @@
         "babel-plugin-transform-exponentiation-operator": "6.24.1",
         "babel-plugin-transform-regenerator": "6.26.0",
         "browserslist": "2.11.3",
-        "invariant": "2.2.3",
+        "invariant": "2.2.4",
         "semver": "5.5.0"
       }
     },
+    "babel-preset-es2015": {
+      "version": "6.24.1",
+      "resolved": "https://registry.npmjs.org/babel-preset-es2015/-/babel-preset-es2015-6.24.1.tgz",
+      "integrity": "sha1-1EBQ1rwsn+6nAqrzjXJ6AhBTiTk=",
+      "requires": {
+        "babel-plugin-check-es2015-constants": "6.22.0",
+        "babel-plugin-transform-es2015-arrow-functions": "6.22.0",
+        "babel-plugin-transform-es2015-block-scoped-functions": "6.22.0",
+        "babel-plugin-transform-es2015-block-scoping": "6.26.0",
+        "babel-plugin-transform-es2015-classes": "6.24.1",
+        "babel-plugin-transform-es2015-computed-properties": "6.24.1",
+        "babel-plugin-transform-es2015-destructuring": "6.23.0",
+        "babel-plugin-transform-es2015-duplicate-keys": "6.24.1",
+        "babel-plugin-transform-es2015-for-of": "6.23.0",
+        "babel-plugin-transform-es2015-function-name": "6.24.1",
+        "babel-plugin-transform-es2015-literals": "6.22.0",
+        "babel-plugin-transform-es2015-modules-amd": "6.24.1",
+        "babel-plugin-transform-es2015-modules-commonjs": "6.26.0",
+        "babel-plugin-transform-es2015-modules-systemjs": "6.24.1",
+        "babel-plugin-transform-es2015-modules-umd": "6.24.1",
+        "babel-plugin-transform-es2015-object-super": "6.24.1",
+        "babel-plugin-transform-es2015-parameters": "6.24.1",
+        "babel-plugin-transform-es2015-shorthand-properties": "6.24.1",
+        "babel-plugin-transform-es2015-spread": "6.22.0",
+        "babel-plugin-transform-es2015-sticky-regex": "6.24.1",
+        "babel-plugin-transform-es2015-template-literals": "6.22.0",
+        "babel-plugin-transform-es2015-typeof-symbol": "6.23.0",
+        "babel-plugin-transform-es2015-unicode-regex": "6.24.1",
+        "babel-plugin-transform-regenerator": "6.26.0"
+      }
+    },
     "babel-preset-flow": {
       "version": "6.23.0",
       "resolved": "https://registry.npmjs.org/babel-preset-flow/-/babel-preset-flow-6.23.0.tgz",
@@ -2582,7 +2763,7 @@
         "babylon": "6.18.0",
         "debug": "2.6.9",
         "globals": "9.18.0",
-        "invariant": "2.2.3",
+        "invariant": "2.2.4",
         "lodash": "4.17.5"
       },
       "dependencies": {
@@ -2656,9 +2837,9 @@
       "integrity": "sha1-3DQxT05nkxgJP8dgJyUl+UvyXBY="
     },
     "bfj-node4": {
-      "version": "5.2.1",
-      "resolved": "https://registry.npmjs.org/bfj-node4/-/bfj-node4-5.2.1.tgz",
-      "integrity": "sha512-w+OTPD/R0AvDVR/sy/uVUVeoCpEgUoYj9/1P2zB6mR1yx7F/ADzLX4nlvZ/91WWzGgdZnuLxWP/J89D7ZDt0DA==",
+      "version": "5.3.1",
+      "resolved": "https://registry.npmjs.org/bfj-node4/-/bfj-node4-5.3.1.tgz",
+      "integrity": "sha512-SOmOsowQWfXc7ybFARsK3C4MCOWzERaOMV/Fl3Tgjs+5dJWyzo3oa127jL44eMbQiAN17J7SvAs2TRxEScTUmg==",
       "requires": {
         "bluebird": "3.5.1",
         "check-types": "7.3.0",
@@ -2684,6 +2865,11 @@
       "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.11.0.tgz",
       "integrity": "sha1-RqoXUftqL5PuXmibsQh9SxTGwgU="
     },
+    "binaryextensions": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/binaryextensions/-/binaryextensions-2.1.1.tgz",
+      "integrity": "sha512-XBaoWE9RW8pPdPQNibZsW2zh8TW6gcarXp1FZPwT8Uop8ScSNldJEWf2k9l3HeTqdrEwsOsFcq74RiJECW34yA=="
+    },
     "block-stream": {
       "version": "0.0.9",
       "resolved": "https://registry.npmjs.org/block-stream/-/block-stream-0.0.9.tgz",
@@ -2753,9 +2939,9 @@
       }
     },
     "bowser": {
-      "version": "1.9.2",
-      "resolved": "https://registry.npmjs.org/bowser/-/bowser-1.9.2.tgz",
-      "integrity": "sha512-fuiANC1Bqbqa/S4gmvfCt7bGBmNELMsGZj4Wg3PrP6esP66Ttoj1JSlzFlXtHyduMv07kDNmDsX6VsMWT/MLGg=="
+      "version": "1.9.3",
+      "resolved": "https://registry.npmjs.org/bowser/-/bowser-1.9.3.tgz",
+      "integrity": "sha512-/gp96UlcFw5DbV2KQPCqTqi0Mb9gZRyDAHiDsGEH+4B/KOQjeoE5lM1PxlVX8DQDvfEfitmC1rW2Oy8fk/XBDg=="
     },
     "brace-expansion": {
       "version": "1.1.11",
@@ -2779,7 +2965,7 @@
         "isobject": "3.0.1",
         "kind-of": "6.0.2",
         "repeat-element": "1.1.2",
-        "snapdragon": "0.8.1",
+        "snapdragon": "0.8.2",
         "snapdragon-node": "2.1.1",
         "split-string": "3.1.0",
         "to-regex": "3.0.2"
@@ -2902,8 +3088,8 @@
       "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.11.3.tgz",
       "integrity": "sha512-yWu5cXT7Av6mVwzWc8lMsJMHWn4xyjSuGYi4IozbVTLUOEYPSagUB8kiMDUHA1fS3zjr8nkxkn9jdvug4BBRmA==",
       "requires": {
-        "caniuse-lite": "1.0.30000810",
-        "electron-to-chromium": "1.3.34"
+        "caniuse-lite": "1.0.30000819",
+        "electron-to-chromium": "1.3.40"
       }
     },
     "bser": {
@@ -2920,10 +3106,15 @@
       "integrity": "sha1-bRu2AbB6TvztlwlBMgkwJ8lbwpg=",
       "requires": {
         "base64-js": "1.2.3",
-        "ieee754": "1.1.8",
+        "ieee754": "1.1.11",
         "isarray": "1.0.0"
       }
     },
+    "buffer-from": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.0.0.tgz",
+      "integrity": "sha512-83apNb8KK0Se60UE1+4Ukbe3HbfELJ6UlI4ldtOGs7So4KD26orJM8hIY9lxdzP+UpItH1Yh/Y8GUvNFWFFRxA=="
+    },
     "buffer-indexof": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/buffer-indexof/-/buffer-indexof-1.1.1.tgz",
@@ -2956,8 +3147,8 @@
       "requires": {
         "axios": "0.16.2",
         "bytes": "3.0.0",
-        "ci-env": "1.5.2",
-        "commander": "2.14.1",
+        "ci-env": "1.6.0",
+        "commander": "2.15.1",
         "github-build": "1.2.0",
         "glob": "7.1.2",
         "gzip-size": "4.1.0",
@@ -2991,13 +3182,13 @@
         "chownr": "1.0.1",
         "glob": "7.1.2",
         "graceful-fs": "4.1.11",
-        "lru-cache": "4.1.1",
+        "lru-cache": "4.1.2",
         "mississippi": "2.0.0",
         "mkdirp": "0.5.1",
         "move-concurrently": "1.0.1",
         "promise-inflight": "1.0.1",
         "rimraf": "2.6.2",
-        "ssri": "5.2.4",
+        "ssri": "5.3.0",
         "unique-filename": "1.1.0",
         "y18n": "4.0.0"
       },
@@ -3025,6 +3216,60 @@
         "unset-value": "1.0.0"
       }
     },
+    "cacheable-request": {
+      "version": "2.1.4",
+      "resolved": "https://registry.npmjs.org/cacheable-request/-/cacheable-request-2.1.4.tgz",
+      "integrity": "sha1-DYCIAbY0KtM8kd+dC0TcCbkeXD0=",
+      "requires": {
+        "clone-response": "1.0.2",
+        "get-stream": "3.0.0",
+        "http-cache-semantics": "3.8.1",
+        "keyv": "3.0.0",
+        "lowercase-keys": "1.0.0",
+        "normalize-url": "2.0.1",
+        "responselike": "1.0.2"
+      },
+      "dependencies": {
+        "lowercase-keys": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.0.tgz",
+          "integrity": "sha1-TjNms55/VFfjXxMkvfb4jQv8cwY="
+        },
+        "normalize-url": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/normalize-url/-/normalize-url-2.0.1.tgz",
+          "integrity": "sha512-D6MUW4K/VzoJ4rJ01JFKxDrtY1v9wrgzCX5f2qj/lzH1m/lW6MhUZFKerVsnyjOhOsYzI9Kqqak+10l4LvLpMw==",
+          "requires": {
+            "prepend-http": "2.0.0",
+            "query-string": "5.1.1",
+            "sort-keys": "2.0.0"
+          }
+        },
+        "prepend-http": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/prepend-http/-/prepend-http-2.0.0.tgz",
+          "integrity": "sha1-6SQ0v6XqjBn0HN/UAddBo8gZ2Jc="
+        },
+        "query-string": {
+          "version": "5.1.1",
+          "resolved": "https://registry.npmjs.org/query-string/-/query-string-5.1.1.tgz",
+          "integrity": "sha512-gjWOsm2SoGlgLEdAGt7a6slVOk9mGiXmPFMqrEhLQ68rhQuBnpfs3+EmlvqKyxnCo9/PPlF+9MtY02S1aFg+Jw==",
+          "requires": {
+            "decode-uri-component": "0.2.0",
+            "object-assign": "4.1.1",
+            "strict-uri-encode": "1.1.0"
+          }
+        },
+        "sort-keys": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/sort-keys/-/sort-keys-2.0.0.tgz",
+          "integrity": "sha1-ZYU1WEhh7JfXMNbPQYIuH1ZoQSg=",
+          "requires": {
+            "is-plain-obj": "1.1.0"
+          }
+        }
+      }
+    },
     "callsites": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/callsites/-/callsites-2.0.0.tgz",
@@ -3066,7 +3311,7 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw=",
       "requires": {
         "browserslist": "1.7.7",
-        "caniuse-db": "1.0.30000810",
+        "caniuse-db": "1.0.30000819",
         "lodash.memoize": "4.1.2",
         "lodash.uniq": "4.5.0"
       },
@@ -3076,26 +3321,26 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000810",
-            "electron-to-chromium": "1.3.34"
+            "caniuse-db": "1.0.30000819",
+            "electron-to-chromium": "1.3.40"
           }
         }
       }
     },
     "caniuse-db": {
-      "version": "1.0.30000810",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000810.tgz",
-      "integrity": "sha1-vSWDDEHvq2Qzmi44H0lnc0PIRQk="
+      "version": "1.0.30000819",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000819.tgz",
+      "integrity": "sha1-w7fdVZ5ebWPV3Kpiusa9BMdhlwk="
     },
     "caniuse-lite": {
-      "version": "1.0.30000810",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000810.tgz",
-      "integrity": "sha512-/0Q00Oie9C72P8zQHtFvzmkrMC3oOFUnMWjCy5F2+BE8lzICm91hQPhh0+XIsAFPKOe2Dh3pKgbRmU3EKxfldA=="
+      "version": "1.0.30000819",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000819.tgz",
+      "integrity": "sha512-9i1d8eiKA6dLvsMrVrXOTP9/1sd9iIv4iC/UbPbIa9iQd9Gcnozi2sQ0d69TiQY9l7Alt7YIWISOBwyGSM6H0Q=="
     },
     "case-sensitive-paths-webpack-plugin": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/case-sensitive-paths-webpack-plugin/-/case-sensitive-paths-webpack-plugin-2.1.1.tgz",
-      "integrity": "sha1-PSnO2MHxJL9vU4Rvs/WJRzH9yQk="
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/case-sensitive-paths-webpack-plugin/-/case-sensitive-paths-webpack-plugin-2.1.2.tgz",
+      "integrity": "sha512-oEZgAFfEvKtjSRCu6VgYkuGxwrWXMnQzyBmlLPP7r6PWQVtHxP5Z5N6XsuJvtoVax78am/r7lr46bwo3IVEBOg=="
     },
     "caseless": {
       "version": "0.12.0",
@@ -3109,13 +3354,6 @@
       "requires": {
         "align-text": "0.1.4",
         "lazy-cache": "1.0.4"
-      },
-      "dependencies": {
-        "lazy-cache": {
-          "version": "1.0.4",
-          "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-1.0.4.tgz",
-          "integrity": "sha1-odePw6UEdMuAhF07O24dpJpEbo4="
-        }
       }
     },
     "chain-function": {
@@ -3132,13 +3370,13 @@
       }
     },
     "chalk": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.3.1.tgz",
-      "integrity": "sha512-QUU4ofkDoMIVO7hcx1iPTISs88wsO8jA92RQIm4JAwZvFGGAV2hSAA1NX7oVj2Ej2Q6NDTcRDjPTFrMCRZoJ6g==",
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.3.2.tgz",
+      "integrity": "sha512-ZM4j2/ld/YZDc3Ma8PgN7gyAk+kHMMMyzLNryCPGhWrsfAuDVeuid5bpRFTDgMH9JBK2lA4dyyAkkZYF/WcqDQ==",
       "requires": {
-        "ansi-styles": "3.2.0",
+        "ansi-styles": "3.2.1",
         "escape-string-regexp": "1.0.5",
-        "supports-color": "5.2.0"
+        "supports-color": "5.3.0"
       }
     },
     "chardet": {
@@ -3194,15 +3432,20 @@
       "resolved": "https://registry.npmjs.org/chownr/-/chownr-1.0.1.tgz",
       "integrity": "sha1-4qdQQqlVGQi+vSW4Uj1fl2nXkYE="
     },
+    "chrome-trace-event": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/chrome-trace-event/-/chrome-trace-event-0.1.2.tgz",
+      "integrity": "sha1-kPNohdU0WlBiEzLwcXtZWIPV2YI="
+    },
     "ci-env": {
-      "version": "1.5.2",
-      "resolved": "https://registry.npmjs.org/ci-env/-/ci-env-1.5.2.tgz",
-      "integrity": "sha512-6NSB3PSw6L7w9vqmlTveD1JpaOhngFYRqhFKNPtSLpx8kpu/3BZwf84Sz8+hsmDzaD+ITuuiNdN6ya5c2DhHWg=="
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/ci-env/-/ci-env-1.6.0.tgz",
+      "integrity": "sha512-4lKYVgGOfPu5KUpCQpsxWQ3b0rVog/HtGPhhhkmqaYfmgVSqRjWJSOelVPCQBupggNVqPsXnwNNfl+jvA0lJcQ=="
     },
     "ci-info": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-1.1.2.tgz",
-      "integrity": "sha512-uTGIPNx/nSpBdsF6xnseRXLLtfr9VLqkz8ZqHXr3Y7b6SftyRxBGjwMtJj1OhNbmlc1wZzLNAlAcvyIiE8a6ZA=="
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-1.1.3.tgz",
+      "integrity": "sha512-SK/846h/Rcy8q9Z9CAwGBLfCJ6EkjJWdpelWDufQpqVDYq2Wnnv8zlSO6AMQap02jvhVruKKpEtQOufo3pFhLg=="
     },
     "cipher-base": {
       "version": "1.0.4",
@@ -3323,9 +3566,9 @@
       "integrity": "sha1-+zgB1FNGdknvNgPH1hoCvRKb3m0="
     },
     "clean-css": {
-      "version": "4.1.9",
-      "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.9.tgz",
-      "integrity": "sha1-Nc7ornaHpJuYA09w3gDE7dOCYwE=",
+      "version": "4.1.11",
+      "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.11.tgz",
+      "integrity": "sha1-Ls3xRaujj1R0DybO/Q/z4D4SXWo=",
       "requires": {
         "source-map": "0.5.7"
       },
@@ -3345,6 +3588,55 @@
         "restore-cursor": "2.0.0"
       }
     },
+    "cli-spinners": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/cli-spinners/-/cli-spinners-0.1.2.tgz",
+      "integrity": "sha1-u3ZNiOGF+54eaiofGXcjGPYF4xw="
+    },
+    "cli-table": {
+      "version": "0.3.1",
+      "resolved": "https://registry.npmjs.org/cli-table/-/cli-table-0.3.1.tgz",
+      "integrity": "sha1-9TsFJmqLGguTSz0IIebi3FkUriM=",
+      "requires": {
+        "colors": "1.0.3"
+      },
+      "dependencies": {
+        "colors": {
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/colors/-/colors-1.0.3.tgz",
+          "integrity": "sha1-BDP0TYCWgP3rYO0mDxsMJi6CpAs="
+        }
+      }
+    },
+    "cli-truncate": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/cli-truncate/-/cli-truncate-0.2.1.tgz",
+      "integrity": "sha1-nxXPuwcFAFNpIWxiasfQWrkN1XQ=",
+      "requires": {
+        "slice-ansi": "0.0.4",
+        "string-width": "1.0.2"
+      },
+      "dependencies": {
+        "is-fullwidth-code-point": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
+          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
+          "requires": {
+            "number-is-nan": "1.0.1"
+          }
+        },
+        "string-width": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
+          "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
+          "requires": {
+            "code-point-at": "1.1.0",
+            "is-fullwidth-code-point": "1.0.0",
+            "strip-ansi": "3.0.1"
+          }
+        }
+      }
+    },
     "cli-width": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-2.2.0.tgz",
@@ -3381,19 +3673,24 @@
       }
     },
     "clone": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.3.tgz",
-      "integrity": "sha1-KY1+IjFmD0DAA8LtMUDezz9TCF8="
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/clone/-/clone-1.0.4.tgz",
+      "integrity": "sha1-2jCcwmPfFZlMaIypAheco8fNfH4="
+    },
+    "clone-buffer": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/clone-buffer/-/clone-buffer-1.0.0.tgz",
+      "integrity": "sha1-4+JbIHrE5wGvch4staFnksrD3Fg="
     },
     "clone-deep": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-0.3.0.tgz",
-      "integrity": "sha1-NIxhrpzb4O3+BT2R/0zFIdeQ7eg=",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-2.0.2.tgz",
+      "integrity": "sha512-SZegPTKjCgpQH63E+eN6mVEEPdQBOUzjyJm5Pora4lrwWRFS8I0QAxV/KD6vV/i0WuijHZWQC1fMsPEdxfdVCQ==",
       "requires": {
         "for-own": "1.0.0",
         "is-plain-object": "2.0.4",
-        "kind-of": "3.2.2",
-        "shallow-clone": "0.1.2"
+        "kind-of": "6.0.2",
+        "shallow-clone": "1.0.0"
       },
       "dependencies": {
         "for-own": {
@@ -3403,17 +3700,32 @@
           "requires": {
             "for-in": "1.0.2"
           }
-        },
-        "kind-of": {
-          "version": "3.2.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
-          "requires": {
-            "is-buffer": "1.1.6"
-          }
         }
       }
     },
+    "clone-response": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/clone-response/-/clone-response-1.0.2.tgz",
+      "integrity": "sha1-0dyXOSAxTfZ/vrlCI7TuNQI56Ws=",
+      "requires": {
+        "mimic-response": "1.0.0"
+      }
+    },
+    "clone-stats": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-0.0.1.tgz",
+      "integrity": "sha1-uI+UqCzzi4eR1YBG6kAprYjKmdE="
+    },
+    "cloneable-readable": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/cloneable-readable/-/cloneable-readable-1.1.2.tgz",
+      "integrity": "sha512-Bq6+4t+lbM8vhTs/Bef5c5AdEMtapp/iFb6+s4/Hh9MVTt8OLKH7ZOOZSCT+Ys7hsHvqv0GuMPJ1lnQJVHvxpg==",
+      "requires": {
+        "inherits": "2.0.3",
+        "process-nextick-args": "2.0.0",
+        "readable-stream": "2.3.5"
+      }
+    },
     "co": {
       "version": "4.6.0",
       "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
@@ -3446,7 +3758,7 @@
       "resolved": "https://registry.npmjs.org/color/-/color-0.11.4.tgz",
       "integrity": "sha1-bXtcdPtl6EHNSHkq0e1eB7kE12Q=",
       "requires": {
-        "clone": "1.0.3",
+        "clone": "1.0.4",
         "color-convert": "1.9.1",
         "color-string": "0.3.0"
       }
@@ -3511,9 +3823,9 @@
       }
     },
     "commander": {
-      "version": "2.14.1",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-2.14.1.tgz",
-      "integrity": "sha512-+YR16o3rK53SmWHU3rEM3tPAh2rwb1yPcQX5irVn7mb0gXbwuCCrnkbV5+PBfETdfg1vui07nM6PCG1zndcjQw=="
+      "version": "2.15.1",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-2.15.1.tgz",
+      "integrity": "sha512-VlfT9F3V0v+jr4yxPc5gg9s62/fIVWsd2Bk2iD435um1NlGMYdVCq+MjcXnhYq2icNOizHr1kK+5TI6H0Hy0ag=="
     },
     "common-tags": {
       "version": "1.7.2",
@@ -3528,6 +3840,11 @@
       "resolved": "https://registry.npmjs.org/commondir/-/commondir-1.0.1.tgz",
       "integrity": "sha1-3dgA2gxmEnOTzKWVDqloo6rxJTs="
     },
+    "compare-versions": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/compare-versions/-/compare-versions-3.1.0.tgz",
+      "integrity": "sha512-4hAxDSBypT/yp2ySFD346So6Ragw5xmBn/e/agIGl3bZr6DLUqnoRZPusxKrXdYRZpgexO9daejmIenlq/wrIQ=="
+    },
     "component-emitter": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/component-emitter/-/component-emitter-1.2.1.tgz",
@@ -3543,10 +3860,10 @@
     },
     "compression": {
       "version": "1.7.2",
-      "resolved": "https://registry.npmjs.org/compression/-/compression-1.7.2.tgz",
+      "resolved": "http://registry.npmjs.org/compression/-/compression-1.7.2.tgz",
       "integrity": "sha1-qv+81qr4VLROuygDU9WtFlH1mmk=",
       "requires": {
-        "accepts": "1.3.4",
+        "accepts": "1.3.5",
         "bytes": "3.0.0",
         "compressible": "2.0.13",
         "debug": "2.6.9",
@@ -3561,12 +3878,13 @@
       "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s="
     },
     "concat-stream": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.0.tgz",
-      "integrity": "sha1-CqxmL9Ur54lk1VMvaUeE5wEQrPc=",
+      "version": "1.6.2",
+      "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.2.tgz",
+      "integrity": "sha512-27HBghJxjiZtIk3Ycvn/4kbJk/1uZuJFfuPEns6LaEvpvG1f0hTea8lilrouyo9mVc2GWdcEZ8OLoGmSADlrCw==",
       "requires": {
+        "buffer-from": "1.0.0",
         "inherits": "2.0.3",
-        "readable-stream": "2.3.4",
+        "readable-stream": "2.3.5",
         "typedarray": "0.0.6"
       }
     },
@@ -3619,6 +3937,11 @@
           "resolved": "https://registry.npmjs.org/ms/-/ms-0.7.1.tgz",
           "integrity": "sha1-nNE8A62/8ltl7/3nzoZO6VIBcJg="
         },
+        "statuses": {
+          "version": "1.3.1",
+          "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.3.1.tgz",
+          "integrity": "sha1-+vUbnrdKrvOzrPStX2Gr8ky3uT4="
+        },
         "utils-merge": {
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.0.tgz",
@@ -3740,7 +4063,7 @@
         "glob2base": "0.0.12",
         "minimatch": "3.0.4",
         "mkdirp": "0.5.1",
-        "resolve": "1.5.0",
+        "resolve": "1.6.0",
         "safe-buffer": "5.1.1",
         "shell-quote": "1.6.1",
         "subarg": "1.0.0"
@@ -3763,7 +4086,7 @@
         "cipher-base": "1.0.4",
         "inherits": "2.0.3",
         "ripemd160": "2.0.1",
-        "sha.js": "2.4.10"
+        "sha.js": "2.4.11"
       }
     },
     "create-hmac": {
@@ -3776,7 +4099,7 @@
         "inherits": "2.0.3",
         "ripemd160": "2.0.1",
         "safe-buffer": "5.1.1",
-        "sha.js": "2.4.10"
+        "sha.js": "2.4.11"
       }
     },
     "create-react-class": {
@@ -3794,7 +4117,7 @@
       "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-5.1.0.tgz",
       "integrity": "sha1-6L0O/uWPz/b4+UUQoKVUu/ojVEk=",
       "requires": {
-        "lru-cache": "4.1.1",
+        "lru-cache": "4.1.2",
         "shebang-command": "1.2.0",
         "which": "1.3.0"
       }
@@ -3854,9 +4177,9 @@
       }
     },
     "css-loader": {
-      "version": "0.28.10",
-      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.10.tgz",
-      "integrity": "sha512-X1IJteKnW9Llmrd+lJ0f7QZHh9Arf+11S7iRcoT2+riig3BK0QaCaOtubAulMK6Itbo08W6d3l8sW21r+Jhp5Q==",
+      "version": "0.28.11",
+      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.11.tgz",
+      "integrity": "sha512-wovHgjAx8ZIMGSL8pTys7edA1ClmzxHeY6n/d97gg5odgsxEgKjULPR0viqyC+FWMCL9sfqoC/QCUBo62tLvPg==",
       "requires": {
         "babel-code-frame": "6.26.0",
         "css-selector-tokenizer": "0.7.0",
@@ -4085,7 +4408,7 @@
           "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ=",
           "requires": {
             "browserslist": "1.7.7",
-            "caniuse-db": "1.0.30000810",
+            "caniuse-db": "1.0.30000819",
             "normalize-range": "0.1.2",
             "num2fraction": "1.2.2",
             "postcss": "5.2.18",
@@ -4097,8 +4420,8 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000810",
-            "electron-to-chromium": "1.3.34"
+            "caniuse-db": "1.0.30000819",
+            "electron-to-chromium": "1.3.40"
           }
         },
         "chalk": {
@@ -4198,9 +4521,14 @@
       "resolved": "https://registry.npmjs.org/d/-/d-1.0.0.tgz",
       "integrity": "sha1-dUu1v+VUUdpppYuU1F9MWwRi1Y8=",
       "requires": {
-        "es5-ext": "0.10.39"
+        "es5-ext": "0.10.41"
       }
     },
+    "dargs": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/dargs/-/dargs-5.1.0.tgz",
+      "integrity": "sha1-7H6lDHhWTNNsnV7Bj2Yyn63ieCk="
+    },
     "dashdash": {
       "version": "1.14.1",
       "resolved": "https://registry.npmjs.org/dashdash/-/dashdash-1.14.1.tgz",
@@ -4209,11 +4537,21 @@
         "assert-plus": "1.0.0"
       }
     },
+    "date-fns": {
+      "version": "1.29.0",
+      "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-1.29.0.tgz",
+      "integrity": "sha512-lbTXWZ6M20cWH8N9S6afb0SBm6tMk+uUg6z3MqHPKE9atmsY3kJkTm8vKe93izJ2B2+q5MV990sM2CHgtAZaOw=="
+    },
     "date-now": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/date-now/-/date-now-0.1.4.tgz",
       "integrity": "sha1-6vQ5/U1ISK105cx9vvIAZyueNFs="
     },
+    "dateformat": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/dateformat/-/dateformat-3.0.3.tgz",
+      "integrity": "sha512-jyCETtSl3VMZMWeRo7iY1FL19ges1t55hMo5yaam4Jrsm5EPL89UQkoQRyiI+Yf4k8r2ZpdngkV8hr1lIdjb3Q=="
+    },
     "debug": {
       "version": "2.6.9",
       "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
@@ -4232,6 +4570,14 @@
       "resolved": "https://registry.npmjs.org/decode-uri-component/-/decode-uri-component-0.2.0.tgz",
       "integrity": "sha1-6zkTMzRYd1y4TNGh+uBiEGu4dUU="
     },
+    "decompress-response": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/decompress-response/-/decompress-response-3.3.0.tgz",
+      "integrity": "sha1-gKTdMjdIOEv6JICDYirt7Jgq3/M=",
+      "requires": {
+        "mimic-response": "1.0.0"
+      }
+    },
     "decompress-zip": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/decompress-zip/-/decompress-zip-0.3.0.tgz",
@@ -4274,6 +4620,11 @@
       "resolved": "https://registry.npmjs.org/deep-equal/-/deep-equal-1.0.1.tgz",
       "integrity": "sha1-9dJgKStmDghO/0zbyfCK0yR0SLU="
     },
+    "deep-extend": {
+      "version": "0.4.2",
+      "resolved": "https://registry.npmjs.org/deep-extend/-/deep-extend-0.4.2.tgz",
+      "integrity": "sha1-SLaZwn4zS/ifEIkr5DL25MfTSn8="
+    },
     "deep-is": {
       "version": "0.1.3",
       "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz",
@@ -4327,7 +4678,7 @@
       "requires": {
         "globby": "6.1.0",
         "is-path-cwd": "1.0.0",
-        "is-path-in-cwd": "1.0.0",
+        "is-path-in-cwd": "1.0.1",
         "p-map": "1.2.0",
         "pify": "3.0.0",
         "rimraf": "2.6.2"
@@ -4362,6 +4713,11 @@
       "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.0.4.tgz",
       "integrity": "sha1-l4hXRCxEdJ5CBmE+N5RiBYJqvYA="
     },
+    "detect-conflict": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/detect-conflict/-/detect-conflict-1.0.1.tgz",
+      "integrity": "sha1-CIZXpmqWHAUBnbfEIwiDsca0F24="
+    },
     "detect-indent": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/detect-indent/-/detect-indent-4.0.0.tgz",
@@ -4376,9 +4732,9 @@
       "integrity": "sha1-ogM8CcyOFY03dI+951B4Mr1s4Sc="
     },
     "diff": {
-      "version": "3.4.0",
-      "resolved": "https://registry.npmjs.org/diff/-/diff-3.4.0.tgz",
-      "integrity": "sha512-QpVuMTEoJMF7cKzi6bvWhRulU1fZqZnvyVQgNhPaxxuTYwyjn/j1v9falseQ/uXWwPnO56RBfwtg4h/EQXmucA=="
+      "version": "3.5.0",
+      "resolved": "https://registry.npmjs.org/diff/-/diff-3.5.0.tgz",
+      "integrity": "sha512-A46qtFgd+g7pDZinpnwiRJtxbC1hpgf0uzP3iG89scHk0AUC7A1TGxf5OiiOUv/JMZR8GOt8hL900hV0bOy5xA=="
     },
     "diffie-hellman": {
       "version": "5.0.2",
@@ -4519,17 +4875,27 @@
       "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz",
       "integrity": "sha1-rOb/gIwc5mtX0ev5eXessCM0z8E="
     },
+    "duplexer3": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/duplexer3/-/duplexer3-0.1.4.tgz",
+      "integrity": "sha1-7gHdHKwO08vH/b6jfcCo8c4ALOI="
+    },
     "duplexify": {
-      "version": "3.5.3",
-      "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-3.5.3.tgz",
-      "integrity": "sha512-g8ID9OroF9hKt2POf8YLayy+9594PzmM3scI00/uBXocX3TWNgoB67hjzkFe9ITAbQOne/lLdBxHXvYUM4ZgGA==",
+      "version": "3.5.4",
+      "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-3.5.4.tgz",
+      "integrity": "sha512-JzYSLYMhoVVBe8+mbHQ4KgpvHpm0DZpJuL8PY93Vyv1fW7jYJ90LoXa1di/CVbJM+TgMs91rbDapE/RNIfnJsA==",
       "requires": {
         "end-of-stream": "1.4.1",
         "inherits": "2.0.3",
-        "readable-stream": "2.3.4",
+        "readable-stream": "2.3.5",
         "stream-shift": "1.0.0"
       }
     },
+    "editions": {
+      "version": "1.3.4",
+      "resolved": "https://registry.npmjs.org/editions/-/editions-1.3.4.tgz",
+      "integrity": "sha512-gzao+mxnYDzIysXKMQi/+M1mjy/rjestjg6OPoYTtI+3Izp23oiGZitsl9lPDPiTGXbcSIk1iJWhliSaglxnUg=="
+    },
     "ee-first": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
@@ -4541,9 +4907,14 @@
       "integrity": "sha1-zIcsFoiArjxxiXYv1f/ACJbJUYo="
     },
     "electron-to-chromium": {
-      "version": "1.3.34",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.34.tgz",
-      "integrity": "sha1-2TSY9AORuwwWpgPYJBuZUUBBV+0="
+      "version": "1.3.40",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.40.tgz",
+      "integrity": "sha1-H71tl779crim+SHcONIkE9L2/d8="
+    },
+    "elegant-spinner": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/elegant-spinner/-/elegant-spinner-1.0.1.tgz",
+      "integrity": "sha1-2wQ1IcldfjA/2PNFvtwzSc+wcp4="
     },
     "elliptic": {
       "version": "6.4.0",
@@ -4677,8 +5048,17 @@
         "prr": "1.0.1"
       }
     },
-    "error-ex": {
-      "version": "1.3.1",
+    "error": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/error/-/error-7.0.2.tgz",
+      "integrity": "sha1-pfdf/02ZJhJt2sDqXcOOaJFTywI=",
+      "requires": {
+        "string-template": "0.2.1",
+        "xtend": "4.0.1"
+      }
+    },
+    "error-ex": {
+      "version": "1.3.1",
       "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.1.tgz",
       "integrity": "sha1-+FWobOYa3E6GIcPNoh56dhLDqNw=",
       "requires": {
@@ -4686,9 +5066,9 @@
       }
     },
     "es-abstract": {
-      "version": "1.10.0",
-      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.10.0.tgz",
-      "integrity": "sha512-/uh/DhdqIOSkAWifU+8nG78vlQxdLckUdI/sPgy0VhuXi2qJ7T8czBmqIYtLQVpCIFYafChnsRsB5pyb1JdmCQ==",
+      "version": "1.11.0",
+      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.11.0.tgz",
+      "integrity": "sha512-ZnQrE/lXTTQ39ulXZ+J1DTFazV9qBy61x2bY071B+qGco8Z8q1QddsLdt/EF8Ai9hcWH72dWS0kFqXLxOxqslA==",
       "requires": {
         "es-to-primitive": "1.1.1",
         "function-bind": "1.1.1",
@@ -4708,12 +5088,13 @@
       }
     },
     "es5-ext": {
-      "version": "0.10.39",
-      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.39.tgz",
-      "integrity": "sha512-AlaXZhPHl0po/uxMx1tyrlt1O86M6D5iVaDH8UgLfgek4kXTX6vzsRfJQWC2Ku+aG8pkw1XWzh9eTkwfVrsD5g==",
+      "version": "0.10.41",
+      "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.41.tgz",
+      "integrity": "sha512-MYK02wXfwTMie5TEJWPolgOsXEmz7wKCQaGzgmRjZOoV6VLG8I5dSv2bn6AOClXhK64gnSQTQ9W9MKvx87J4gw==",
       "requires": {
         "es6-iterator": "2.0.3",
-        "es6-symbol": "3.1.1"
+        "es6-symbol": "3.1.1",
+        "next-tick": "1.0.0"
       }
     },
     "es5-shim": {
@@ -4727,7 +5108,7 @@
       "integrity": "sha1-p96IkUGgWpSwhUQDstCg+/qY87c=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.39",
+        "es5-ext": "0.10.41",
         "es6-symbol": "3.1.1"
       }
     },
@@ -4737,7 +5118,7 @@
       "integrity": "sha1-kTbgUD3MBqMBaQ8LsU/042TpSfA=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.39",
+        "es5-ext": "0.10.41",
         "es6-iterator": "2.0.3",
         "es6-set": "0.1.5",
         "es6-symbol": "3.1.1",
@@ -4755,7 +5136,7 @@
       "integrity": "sha1-0rPsXU2ADO2BjbU40ol02wpzzLE=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.39",
+        "es5-ext": "0.10.41",
         "es6-iterator": "2.0.3",
         "es6-symbol": "3.1.1",
         "event-emitter": "0.3.5"
@@ -4772,7 +5153,7 @@
       "integrity": "sha1-vwDvT9q2uhtG7Le2KbTH7VcVzHc=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.39"
+        "es5-ext": "0.10.41"
       }
     },
     "es6-templates": {
@@ -4818,7 +5199,7 @@
       "integrity": "sha1-XjqzIlH/0VOKH45f+hNXdy+S2W8=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.39",
+        "es5-ext": "0.10.41",
         "es6-iterator": "2.0.3",
         "es6-symbol": "3.1.1"
       }
@@ -4863,6 +5244,15 @@
         "estraverse": "4.2.0"
       }
     },
+    "eslint-scope": {
+      "version": "3.7.1",
+      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-3.7.1.tgz",
+      "integrity": "sha1-PWPD7f2gLgbgGkUq2IyqzHzctug=",
+      "requires": {
+        "esrecurse": "4.2.1",
+        "estraverse": "4.2.0"
+      }
+    },
     "esprima": {
       "version": "2.7.3",
       "resolved": "https://registry.npmjs.org/esprima/-/esprima-2.7.3.tgz",
@@ -4897,7 +5287,7 @@
       "integrity": "sha1-34xp7vFkeSPHFXuc6DhAYQsCzDk=",
       "requires": {
         "d": "1.0.0",
-        "es5-ext": "0.10.39"
+        "es5-ext": "0.10.41"
       }
     },
     "eventemitter3": {
@@ -4954,6 +5344,11 @@
       "resolved": "https://registry.npmjs.org/exenv/-/exenv-1.2.2.tgz",
       "integrity": "sha1-KueOhdmJQVhnCwPUe+wfA72Ru50="
     },
+    "exit-hook": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/exit-hook/-/exit-hook-1.1.1.tgz",
+      "integrity": "sha1-8FyiM7SMBdVP/wd2XfhQfpXAL/g="
+    },
     "expand-brackets": {
       "version": "2.1.4",
       "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-2.1.4.tgz",
@@ -4964,7 +5359,7 @@
         "extend-shallow": "2.0.1",
         "posix-character-classes": "0.1.1",
         "regex-not": "1.0.2",
-        "snapdragon": "0.8.1",
+        "snapdragon": "0.8.2",
         "to-regex": "3.0.2"
       },
       "dependencies": {
@@ -5083,12 +5478,20 @@
         }
       }
     },
+    "expand-tilde": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/expand-tilde/-/expand-tilde-2.0.2.tgz",
+      "integrity": "sha1-l+gBqgUt8CRU3kawK/YhZCzchQI=",
+      "requires": {
+        "homedir-polyfill": "1.0.1"
+      }
+    },
     "expect": {
       "version": "21.2.1",
       "resolved": "https://registry.npmjs.org/expect/-/expect-21.2.1.tgz",
       "integrity": "sha512-orfQQqFRTX0jH7znRIGi8ZMR8kTNpXklTTz8+HGTpmTKZo3Occ6JNB5FXMb8cRuiiC/GyDqsr30zUa66ACYlYw==",
       "requires": {
-        "ansi-styles": "3.2.0",
+        "ansi-styles": "3.2.1",
         "jest-diff": "21.2.1",
         "jest-get-type": "21.2.0",
         "jest-matcher-utils": "21.2.1",
@@ -5097,11 +5500,11 @@
       }
     },
     "express": {
-      "version": "4.16.2",
-      "resolved": "https://registry.npmjs.org/express/-/express-4.16.2.tgz",
-      "integrity": "sha1-41xt/i1kt9ygpc1PIXgb4ymeB2w=",
+      "version": "4.16.3",
+      "resolved": "https://registry.npmjs.org/express/-/express-4.16.3.tgz",
+      "integrity": "sha1-avilAjUNsyRuzEvs9rWjTSL37VM=",
       "requires": {
-        "accepts": "1.3.4",
+        "accepts": "1.3.5",
         "array-flatten": "1.1.1",
         "body-parser": "1.18.2",
         "content-disposition": "0.5.2",
@@ -5113,7 +5516,7 @@
         "encodeurl": "1.0.2",
         "escape-html": "1.0.3",
         "etag": "1.8.1",
-        "finalhandler": "1.1.0",
+        "finalhandler": "1.1.1",
         "fresh": "0.5.2",
         "merge-descriptors": "1.0.1",
         "methods": "1.1.2",
@@ -5124,10 +5527,10 @@
         "qs": "6.5.1",
         "range-parser": "1.2.0",
         "safe-buffer": "5.1.1",
-        "send": "0.16.1",
-        "serve-static": "1.13.1",
+        "send": "0.16.2",
+        "serve-static": "1.13.2",
         "setprototypeof": "1.1.0",
-        "statuses": "1.3.1",
+        "statuses": "1.4.0",
         "type-is": "1.6.16",
         "utils-merge": "1.0.1",
         "vary": "1.1.2"
@@ -5178,7 +5581,7 @@
         "extend-shallow": "2.0.1",
         "fragment-cache": "0.2.1",
         "regex-not": "1.0.2",
-        "snapdragon": "0.8.1",
+        "snapdragon": "0.8.2",
         "to-regex": "3.0.2"
       },
       "dependencies": {
@@ -5221,9 +5624,9 @@
       "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc="
     },
     "fast-memoize": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/fast-memoize/-/fast-memoize-2.3.0.tgz",
-      "integrity": "sha512-wH36QD7q17IXIq3WDEQTb+eehTzpCXXdGRAYw4jQdVmMWdBZc5ysRhV/5nZx67KBNgFt1H1XwLgDiYxQL3uXJw=="
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/fast-memoize/-/fast-memoize-2.3.2.tgz",
+      "integrity": "sha512-h2avnhux4p3tXTA9xR7ntnQSFQdY4hAkyNj8wDXlVT2Die38JxVCInnrieuktdxzRevRWa3dBjN+SbQe1os0GQ=="
     },
     "fastparse": {
       "version": "1.1.1",
@@ -5298,9 +5701,9 @@
       }
     },
     "filesize": {
-      "version": "3.6.0",
-      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.6.0.tgz",
-      "integrity": "sha512-g5OWtoZWcPI56js1DFhIEqyG9tnu/7sG3foHwgS9KGYFMfsYguI3E+PRVCmtmE96VajQIEMRU2OhN+ME589Gdw=="
+      "version": "3.6.1",
+      "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.6.1.tgz",
+      "integrity": "sha512-7KjR1vv6qnicaPMi1iiTcI85CyYwRO/PSFCu6SvqL8jN2Wjt/NIYQTFtFs7fSDCYOstUkEWIQGFUg5YZQfjlcg=="
     },
     "fill-range": {
       "version": "4.0.0",
@@ -5324,16 +5727,16 @@
       }
     },
     "finalhandler": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.0.tgz",
-      "integrity": "sha1-zgtoVbRYU+eRsvzGgARtiCU91/U=",
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.1.tgz",
+      "integrity": "sha512-Y1GUDo39ez4aHAw7MysnUD5JzYX+WaIj8I57kO3aEPT1fFRL4sr7mjei97FgnwhAyyzRYmQZaTHb2+9uZ1dPtg==",
       "requires": {
         "debug": "2.6.9",
         "encodeurl": "1.0.2",
         "escape-html": "1.0.3",
         "on-finished": "2.3.0",
         "parseurl": "1.3.2",
-        "statuses": "1.3.1",
+        "statuses": "1.4.0",
         "unpipe": "1.0.0"
       }
     },
@@ -5379,18 +5782,31 @@
         "locate-path": "2.0.0"
       }
     },
+    "first-chunk-stream": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/first-chunk-stream/-/first-chunk-stream-2.0.0.tgz",
+      "integrity": "sha1-G97NuOCDwGZLkZRVgVd6Q6nzHXA=",
+      "requires": {
+        "readable-stream": "2.3.5"
+      }
+    },
     "flatten": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz",
       "integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I="
     },
+    "flow-parser": {
+      "version": "0.68.0",
+      "resolved": "https://registry.npmjs.org/flow-parser/-/flow-parser-0.68.0.tgz",
+      "integrity": "sha1-nMlmIKEC4xajFLa81WIFzqzoYtg="
+    },
     "flush-write-stream": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/flush-write-stream/-/flush-write-stream-1.0.2.tgz",
-      "integrity": "sha1-yBuQ2HRnZvGmCaRoCZRsRd2K5Bc=",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/flush-write-stream/-/flush-write-stream-1.0.3.tgz",
+      "integrity": "sha512-calZMC10u0FMUqoiunI2AiGIIUtUIvifNwkHhNupZH4cbNnW1Itkoh/Nf5HFYmDrwWPjrUxpkZT0KhuCq0jmGw==",
       "requires": {
         "inherits": "2.0.3",
-        "readable-stream": "2.3.4"
+        "readable-stream": "2.3.5"
       }
     },
     "follow-redirects": {
@@ -5468,7 +5884,7 @@
       "integrity": "sha1-i/tVAr3kpNNs/e6gB/zKIdfjgq8=",
       "requires": {
         "inherits": "2.0.3",
-        "readable-stream": "2.3.4"
+        "readable-stream": "2.3.5"
       }
     },
     "fs-extra": {
@@ -5491,7 +5907,7 @@
         "graceful-fs": "4.1.11",
         "iferr": "0.1.5",
         "imurmurhash": "0.1.4",
-        "readable-stream": "2.3.4"
+        "readable-stream": "2.3.5"
       }
     },
     "fs.realpath": {
@@ -5640,6 +6056,54 @@
         "assert-plus": "1.0.0"
       }
     },
+    "gh-got": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/gh-got/-/gh-got-6.0.0.tgz",
+      "integrity": "sha512-F/mS+fsWQMo1zfgG9MD8KWvTWPPzzhuVwY++fhQ5Ggd+0P+CAMHtzMZhNxG+TqGfHDChJKsbh6otfMGqO2AKBw==",
+      "requires": {
+        "got": "7.1.0",
+        "is-plain-obj": "1.1.0"
+      },
+      "dependencies": {
+        "got": {
+          "version": "7.1.0",
+          "resolved": "https://registry.npmjs.org/got/-/got-7.1.0.tgz",
+          "integrity": "sha512-Y5WMo7xKKq1muPsxD+KmrR8DH5auG7fBdDVueZwETwV6VytKyU9OX/ddpq2/1hp1vIPvVb4T81dKQz3BivkNLw==",
+          "requires": {
+            "decompress-response": "3.3.0",
+            "duplexer3": "0.1.4",
+            "get-stream": "3.0.0",
+            "is-plain-obj": "1.1.0",
+            "is-retry-allowed": "1.1.0",
+            "is-stream": "1.1.0",
+            "isurl": "1.0.0",
+            "lowercase-keys": "1.0.1",
+            "p-cancelable": "0.3.0",
+            "p-timeout": "1.2.1",
+            "safe-buffer": "5.1.1",
+            "timed-out": "4.0.1",
+            "url-parse-lax": "1.0.0",
+            "url-to-options": "1.0.1"
+          }
+        },
+        "p-timeout": {
+          "version": "1.2.1",
+          "resolved": "https://registry.npmjs.org/p-timeout/-/p-timeout-1.2.1.tgz",
+          "integrity": "sha1-XrOzU7f86Z8QGhA4iAuwVOu+o4Y=",
+          "requires": {
+            "p-finally": "1.0.0"
+          }
+        },
+        "url-parse-lax": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/url-parse-lax/-/url-parse-lax-1.0.0.tgz",
+          "integrity": "sha1-evjzA2Rem9eaJy56FKxovAYJ2nM=",
+          "requires": {
+            "prepend-http": "1.0.4"
+          }
+        }
+      }
+    },
     "github": {
       "version": "7.3.2",
       "resolved": "https://registry.npmjs.org/github/-/github-7.3.2.tgz",
@@ -5688,6 +6152,14 @@
         }
       }
     },
+    "github-username": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/github-username/-/github-username-4.1.0.tgz",
+      "integrity": "sha1-y+KABBiDIG2kISrp5LXxacML9Bc=",
+      "requires": {
+        "gh-got": "6.0.0"
+      }
+    },
     "glamor": {
       "version": "2.20.40",
       "resolved": "https://registry.npmjs.org/glamor/-/glamor-2.20.40.tgz",
@@ -5701,12 +6173,12 @@
       }
     },
     "glamorous": {
-      "version": "4.11.6",
-      "resolved": "https://registry.npmjs.org/glamorous/-/glamorous-4.11.6.tgz",
-      "integrity": "sha512-fR9jTVipC3Vb4Jps4aQFjxEuGPexo/J74ZUZIA8ZpgENljGUL+9SdKk0Ut1iZc23tLLtbi6wRmAqQG3thwzjAw==",
+      "version": "4.12.1",
+      "resolved": "https://registry.npmjs.org/glamorous/-/glamorous-4.12.1.tgz",
+      "integrity": "sha512-AeM3uk81SadSOGo4Dr5yZDW6CPa9DEDfx/5aBQRnLHhoisgk3mTSa7u1V00KEkE2U92zFznju6+Scl+Aef5EEw==",
       "requires": {
         "brcast": "3.0.1",
-        "fast-memoize": "2.3.0",
+        "fast-memoize": "2.3.2",
         "html-tag-names": "1.1.2",
         "is-function": "1.0.1",
         "is-plain-object": "2.0.4",
@@ -5727,6 +6199,30 @@
         "path-is-absolute": "1.0.1"
       }
     },
+    "glob-all": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/glob-all/-/glob-all-3.1.0.tgz",
+      "integrity": "sha1-iRPd+17hrHgSZWJBsD1SF8ZLAqs=",
+      "requires": {
+        "glob": "7.1.2",
+        "yargs": "1.2.6"
+      },
+      "dependencies": {
+        "minimist": {
+          "version": "0.1.0",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.1.0.tgz",
+          "integrity": "sha1-md9lelJXTCHJBXSX33QnkLK0wN4="
+        },
+        "yargs": {
+          "version": "1.2.6",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-1.2.6.tgz",
+          "integrity": "sha1-nHtKgv1dWVsr8Xq23MQxNUMv40s=",
+          "requires": {
+            "minimist": "0.1.0"
+          }
+        }
+      }
+    },
     "glob-base": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/glob-base/-/glob-base-0.3.0.tgz",
@@ -5768,6 +6264,28 @@
         }
       }
     },
+    "global-modules": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-1.0.0.tgz",
+      "integrity": "sha512-sKzpEkf11GpOFuw0Zzjzmt4B4UZwjOcG757PPvrfhxcLFbq0wpsgpOqxpxtxFiCG4DtG93M6XRVbF2oGdev7bg==",
+      "requires": {
+        "global-prefix": "1.0.2",
+        "is-windows": "1.0.2",
+        "resolve-dir": "1.0.1"
+      }
+    },
+    "global-prefix": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-1.0.2.tgz",
+      "integrity": "sha1-2/dDxsFJklk8ZVVoy2btMsASLr4=",
+      "requires": {
+        "expand-tilde": "2.0.2",
+        "homedir-polyfill": "1.0.1",
+        "ini": "1.3.5",
+        "is-windows": "1.0.2",
+        "which": "1.3.0"
+      }
+    },
     "globals": {
       "version": "9.18.0",
       "resolved": "https://registry.npmjs.org/globals/-/globals-9.18.0.tgz",
@@ -5809,6 +6327,37 @@
         }
       }
     },
+    "got": {
+      "version": "8.3.0",
+      "resolved": "https://registry.npmjs.org/got/-/got-8.3.0.tgz",
+      "integrity": "sha512-kBNy/S2CGwrYgDSec5KTWGKUvupwkkTVAjIsVFF2shXO13xpZdFP4d4kxa//CLX2tN/rV0aYwK8vY6UKWGn2vQ==",
+      "requires": {
+        "@sindresorhus/is": "0.7.0",
+        "cacheable-request": "2.1.4",
+        "decompress-response": "3.3.0",
+        "duplexer3": "0.1.4",
+        "get-stream": "3.0.0",
+        "into-stream": "3.1.0",
+        "is-retry-allowed": "1.1.0",
+        "isurl": "1.0.0",
+        "lowercase-keys": "1.0.1",
+        "mimic-response": "1.0.0",
+        "p-cancelable": "0.4.0",
+        "p-timeout": "2.0.1",
+        "pify": "3.0.0",
+        "safe-buffer": "5.1.1",
+        "timed-out": "4.0.1",
+        "url-parse-lax": "3.0.0",
+        "url-to-options": "1.0.1"
+      },
+      "dependencies": {
+        "p-cancelable": {
+          "version": "0.4.0",
+          "resolved": "https://registry.npmjs.org/p-cancelable/-/p-cancelable-0.4.0.tgz",
+          "integrity": "sha512-/AodqPe1y/GYbhSlnMjxukLGQfQIgsmjSy2CXCNB96kg4ozKvmlovuHEKICToOO/yS3LLWgrWI1dFtFfrePS1g=="
+        }
+      }
+    },
     "graceful-fs": {
       "version": "4.1.11",
       "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz",
@@ -5819,6 +6368,21 @@
       "resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz",
       "integrity": "sha1-TK+tdrxi8C+gObL5Tpo906ORpyU="
     },
+    "grouped-queue": {
+      "version": "0.3.3",
+      "resolved": "https://registry.npmjs.org/grouped-queue/-/grouped-queue-0.3.3.tgz",
+      "integrity": "sha1-wWfSpTGcWg4JZO9qJbfC34mWyFw=",
+      "requires": {
+        "lodash": "4.17.5"
+      },
+      "dependencies": {
+        "lodash": {
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
+        }
+      }
+    },
     "growl": {
       "version": "1.9.2",
       "resolved": "https://registry.npmjs.org/growl/-/growl-1.9.2.tgz",
@@ -5849,8 +6413,7 @@
       "requires": {
         "async": "1.5.2",
         "optimist": "0.6.1",
-        "source-map": "0.4.4",
-        "uglify-js": "2.8.29"
+        "source-map": "0.4.4"
       },
       "dependencies": {
         "async": {
@@ -5898,16 +6461,34 @@
         "ansi-regex": "2.1.1"
       }
     },
+    "has-color": {
+      "version": "0.1.7",
+      "resolved": "https://registry.npmjs.org/has-color/-/has-color-0.1.7.tgz",
+      "integrity": "sha1-ZxRKUmDDT8PMpnfQQdr1L+e3iy8="
+    },
     "has-flag": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
       "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0="
     },
+    "has-symbol-support-x": {
+      "version": "1.4.2",
+      "resolved": "https://registry.npmjs.org/has-symbol-support-x/-/has-symbol-support-x-1.4.2.tgz",
+      "integrity": "sha512-3ToOva++HaW+eCpgqZrCfN51IPB+7bJNVT6CUATzueB5Heb8o6Nam0V3HG5dlDvZU1Gn5QLcbahiKw/XVk5JJw=="
+    },
     "has-symbols": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.0.0.tgz",
       "integrity": "sha1-uhqPGvKg/DllD1yFA2dwQSIGO0Q="
     },
+    "has-to-string-tag-x": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/has-to-string-tag-x/-/has-to-string-tag-x-1.4.1.tgz",
+      "integrity": "sha512-vdbKfmw+3LoOYVr+mtxHaX5a96+0f3DljYd8JOqvOLsf5mw2Otda2qCDT9qRqLAhrjyQ0h7ual5nOiASpsGNFw==",
+      "requires": {
+        "has-symbol-support-x": "1.4.2"
+      }
+    },
     "has-unicode": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz",
@@ -6009,10 +6590,18 @@
         "os-tmpdir": "1.0.2"
       }
     },
+    "homedir-polyfill": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/homedir-polyfill/-/homedir-polyfill-1.0.1.tgz",
+      "integrity": "sha1-TCu8inWJmP7r9e1oWA921GdotLw=",
+      "requires": {
+        "parse-passwd": "1.0.0"
+      }
+    },
     "hosted-git-info": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.5.0.tgz",
-      "integrity": "sha512-pNgbURSuab90KbTqvRPsseaTxOJCZBD0a7t+haSN33piP9cCM4l0CqdzAif2hUqm716UovKB2ROmiabGAKVXyg=="
+      "version": "2.6.0",
+      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.6.0.tgz",
+      "integrity": "sha512-lIbgIIQA3lz5XaB6vxakj6sDHADJiZadYEJB+FgA+C4nubM1NwcuvUr9EJPmnH1skZqpqUzWborWo8EIUi0Sdw=="
     },
     "hpack.js": {
       "version": "2.1.6",
@@ -6020,9 +6609,9 @@
       "integrity": "sha1-h3dMCUnlE/QuhFdbPEVoH63ioLI=",
       "requires": {
         "inherits": "2.0.3",
-        "obuf": "1.1.1",
-        "readable-stream": "2.3.4",
-        "wbuf": "1.7.2"
+        "obuf": "1.1.2",
+        "readable-stream": "2.3.5",
+        "wbuf": "1.7.3"
       }
     },
     "html-comment-regex": {
@@ -6055,32 +6644,32 @@
       "requires": {
         "es6-templates": "0.2.3",
         "fastparse": "1.1.1",
-        "html-minifier": "3.5.9",
+        "html-minifier": "3.5.12",
         "loader-utils": "1.1.0",
         "object-assign": "4.1.1"
       }
     },
     "html-minifier": {
-      "version": "3.5.9",
-      "resolved": "https://registry.npmjs.org/html-minifier/-/html-minifier-3.5.9.tgz",
-      "integrity": "sha512-EZqO91XJwkj8BeLx9C12sKB/AHoTANaZax39vEOP9f/X/9jgJ3r1O2+neabuHqpz5kJO71TapP9JrtCY39su1A==",
+      "version": "3.5.12",
+      "resolved": "https://registry.npmjs.org/html-minifier/-/html-minifier-3.5.12.tgz",
+      "integrity": "sha512-+N778qLf0RWBscD0TPGoYdeGNDZ0s76/0pQhY1/409EOudcENkm9IbSkk37RDyPdg/09GVHTKotU4ya93RF1Gg==",
       "requires": {
         "camel-case": "3.0.0",
-        "clean-css": "4.1.9",
-        "commander": "2.14.1",
+        "clean-css": "4.1.11",
+        "commander": "2.15.1",
         "he": "1.1.1",
         "ncname": "1.0.0",
         "param-case": "2.1.1",
         "relateurl": "0.2.7",
-        "uglify-js": "3.3.12"
+        "uglify-js": "3.3.16"
       },
       "dependencies": {
         "uglify-js": {
-          "version": "3.3.12",
-          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.3.12.tgz",
-          "integrity": "sha512-4jxrTXlV0HaXTsNILfXW0eey7Qo8qHYM6ih5ZNh45erDWU2GHmKDmekwBTskDb12h+kdd2DBvdzqVb47YzNmTA==",
+          "version": "3.3.16",
+          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.3.16.tgz",
+          "integrity": "sha512-FMh5SRqJRGhv9BbaTffENIpDDQIoPDR8DBraunGORGhySArsXlw9++CN+BWzPBLpoI4RcSnpfGPnilTxWL3Vvg==",
           "requires": {
-            "commander": "2.14.1",
+            "commander": "2.15.1",
             "source-map": "0.6.1"
           }
         }
@@ -6097,7 +6686,7 @@
       "integrity": "sha1-f5xCG36pHsRg9WUn1430hO51N9U=",
       "requires": {
         "bluebird": "3.5.1",
-        "html-minifier": "3.5.9",
+        "html-minifier": "3.5.12",
         "loader-utils": "0.2.17",
         "lodash": "4.17.5",
         "pretty-error": "2.1.1",
@@ -6132,9 +6721,14 @@
         "domutils": "1.5.1",
         "entities": "1.1.1",
         "inherits": "2.0.3",
-        "readable-stream": "2.3.4"
+        "readable-stream": "2.3.5"
       }
     },
+    "http-cache-semantics": {
+      "version": "3.8.1",
+      "resolved": "https://registry.npmjs.org/http-cache-semantics/-/http-cache-semantics-3.8.1.tgz",
+      "integrity": "sha512-5ai2iksyV8ZXmnZhHH4rWPoxxistEexSi5936zIQ1bnNTW5VnA85B6P/VpXiRM017IgRvb2kKo1a//y+0wSp3w=="
+    },
     "http-deceiver": {
       "version": "1.2.7",
       "resolved": "https://registry.npmjs.org/http-deceiver/-/http-deceiver-1.2.7.tgz",
@@ -6148,7 +6742,7 @@
         "depd": "1.1.1",
         "inherits": "2.0.3",
         "setprototypeof": "1.0.3",
-        "statuses": "1.3.1"
+        "statuses": "1.4.0"
       },
       "dependencies": {
         "depd": {
@@ -6164,9 +6758,9 @@
       }
     },
     "http-parser-js": {
-      "version": "0.4.10",
-      "resolved": "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.4.10.tgz",
-      "integrity": "sha1-ksnBN0w1CF912zWexWzCV8u5P6Q="
+      "version": "0.4.11",
+      "resolved": "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.4.11.tgz",
+      "integrity": "sha512-QCR5O2AjjMW8Mo4HyI1ctFcv+O99j/0g367V3YoVnrNw5hkDvAWZD0lWGcc+F4yN3V55USPCVix4efb75HxFfA=="
     },
     "http-proxy": {
       "version": "1.16.2",
@@ -6304,7 +6898,7 @@
       "requires": {
         "assert-plus": "1.0.0",
         "jsprim": "1.4.1",
-        "sshpk": "1.13.1"
+        "sshpk": "1.14.1"
       }
     },
     "https-browserify": {
@@ -6342,13 +6936,13 @@
       "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-2.1.0.tgz",
       "integrity": "sha1-g/Cg7DeL8yRheLbCrZE28TWxyWI=",
       "requires": {
-        "postcss": "6.0.19"
+        "postcss": "6.0.21"
       }
     },
     "ieee754": {
-      "version": "1.1.8",
-      "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.8.tgz",
-      "integrity": "sha1-vjPUCsEO8ZJnAfbwii2G+/0a0+Q="
+      "version": "1.1.11",
+      "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.11.tgz",
+      "integrity": "sha512-VhDzCKN7K8ufStx/CLj5/PDTMgph+qwN5Pkd5i0sGnVwk56zJ0lkT8Qzi1xqWLS0Wp29DgDtNeS7v8/wMoZeHg=="
     },
     "iferr": {
       "version": "0.1.5",
@@ -6356,11 +6950,11 @@
       "integrity": "sha1-xg7taebY/bazEEofy8ocGS3FtQE="
     },
     "immutability-helper": {
-      "version": "2.6.5",
-      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.6.5.tgz",
-      "integrity": "sha512-nRj5RN2em1O3NK25Zz0eBszg+kQ3mR5WgZp3wRajbyeu/Ii/eXhpwjB8JG4Hd78JUnuFVXSchWF5EZBI6F+vEA==",
+      "version": "2.6.6",
+      "resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-2.6.6.tgz",
+      "integrity": "sha512-CdLyZ9QuiWGk884SKhRvi8xjtB2PYMCBwa6fc8wZ5QltrdFEhwGz0upikzvjxjrDbsGs7qhgIUIMvI2YFywihA==",
       "requires": {
-        "invariant": "2.2.3"
+        "invariant": "2.2.4"
       }
     },
     "immutable": {
@@ -6419,12 +7013,17 @@
       "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
       "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4="
     },
+    "ini": {
+      "version": "1.3.5",
+      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.5.tgz",
+      "integrity": "sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw=="
+    },
     "inline-style-prefixer": {
       "version": "3.0.8",
       "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-3.0.8.tgz",
       "integrity": "sha1-hVG45bTVcyROZqNLBPfTIHaitTQ=",
       "requires": {
-        "bowser": "1.9.2",
+        "bowser": "1.9.3",
         "css-in-js-utils": "2.0.0"
       }
     },
@@ -6485,10 +7084,19 @@
       "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.1.0.tgz",
       "integrity": "sha1-ftGxQQxqDg94z5XTuEQMY/eLhhQ="
     },
+    "into-stream": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/into-stream/-/into-stream-3.1.0.tgz",
+      "integrity": "sha1-lvsKk2wSur1v8XUqF9BWFqvQlMY=",
+      "requires": {
+        "from2": "2.3.0",
+        "p-is-promise": "1.1.0"
+      }
+    },
     "invariant": {
-      "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.3.tgz",
-      "integrity": "sha512-7Z5PPegwDTyjbaeCnV0efcyS6vdKAU51kpEmS7QFib3P4822l8ICYyMn7qvJnc+WzLoDsuI9gPMKbJ8pCu8XtA==",
+      "version": "2.2.4",
+      "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz",
+      "integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==",
       "requires": {
         "loose-envify": "1.3.1"
       }
@@ -6562,7 +7170,7 @@
       "resolved": "https://registry.npmjs.org/is-ci/-/is-ci-1.1.0.tgz",
       "integrity": "sha512-c7TnwxLePuqIlxHgr7xtxzycJPegNHFuIrBkwbf8hc58//+Op1CqFkyS+xnIMkwn9UsJIwc174BIjkyBmSpjKg==",
       "requires": {
-        "ci-info": "1.1.2"
+        "ci-info": "1.1.3"
       }
     },
     "is-data-descriptor": {
@@ -6692,6 +7300,26 @@
       "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-1.0.1.tgz",
       "integrity": "sha1-PkcprB9f3gJc19g6iW2rn09n2w8="
     },
+    "is-object": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/is-object/-/is-object-1.0.1.tgz",
+      "integrity": "sha1-iVJojF7C/9awPsyF52ngKQMINHA="
+    },
+    "is-observable": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/is-observable/-/is-observable-0.2.0.tgz",
+      "integrity": "sha1-s2ExHYPG5dcmyr9eJQsCNxBvWuI=",
+      "requires": {
+        "symbol-observable": "0.2.4"
+      },
+      "dependencies": {
+        "symbol-observable": {
+          "version": "0.2.4",
+          "resolved": "https://registry.npmjs.org/symbol-observable/-/symbol-observable-0.2.4.tgz",
+          "integrity": "sha1-lag9smGG1q9+ehjb2XYKL4bQj0A="
+        }
+      }
+    },
     "is-odd": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/is-odd/-/is-odd-2.0.0.tgz",
@@ -6713,9 +7341,9 @@
       "integrity": "sha1-0iXsIxMuie3Tj9p2dHLmLmXxEG0="
     },
     "is-path-in-cwd": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-1.0.0.tgz",
-      "integrity": "sha1-ZHdYK4IU1gI0YJRWcAO+ip6sBNw=",
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-1.0.1.tgz",
+      "integrity": "sha512-FjV1RTW48E7CWM7eE/J2NJvAEEVektecDBVBE5Hh3nM1Jd0kvhHtX68Pr3xsDf857xt3Y4AkwVULK1Vku62aaQ==",
       "requires": {
         "is-path-inside": "1.0.1"
       }
@@ -6769,6 +7397,19 @@
         "has": "1.0.1"
       }
     },
+    "is-retry-allowed": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/is-retry-allowed/-/is-retry-allowed-1.1.0.tgz",
+      "integrity": "sha1-EaBgVotnM5REAz0BJaYaINVk+zQ="
+    },
+    "is-scoped": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/is-scoped/-/is-scoped-1.0.0.tgz",
+      "integrity": "sha1-RJypgpnnEwOCViieyytUDcQ3yzA=",
+      "requires": {
+        "scoped-regex": "1.0.0"
+      }
+    },
     "is-stream": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz",
@@ -6852,56 +7493,84 @@
       "integrity": "sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo="
     },
     "istanbul-api": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/istanbul-api/-/istanbul-api-1.2.2.tgz",
-      "integrity": "sha512-kH5YRdqdbs5hiH4/Rr1Q0cSAGgjh3jTtg8vu9NLebBAoK3adVO4jk81J+TYOkTr2+Q4NLeb1ACvmEt65iG/Vbw==",
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/istanbul-api/-/istanbul-api-1.3.1.tgz",
+      "integrity": "sha512-duj6AlLcsWNwUpfyfHt0nWIeRiZpuShnP40YTxOGQgtaN8fd6JYSxsvxUphTDy8V5MfDXo4s/xVCIIvVCO808g==",
       "requires": {
         "async": "2.6.0",
+        "compare-versions": "3.1.0",
         "fileset": "2.0.3",
-        "istanbul-lib-coverage": "1.1.2",
-        "istanbul-lib-hook": "1.1.0",
-        "istanbul-lib-instrument": "1.9.2",
-        "istanbul-lib-report": "1.1.3",
-        "istanbul-lib-source-maps": "1.2.3",
-        "istanbul-reports": "1.1.4",
+        "istanbul-lib-coverage": "1.2.0",
+        "istanbul-lib-hook": "1.2.0",
+        "istanbul-lib-instrument": "1.10.1",
+        "istanbul-lib-report": "1.1.4",
+        "istanbul-lib-source-maps": "1.2.4",
+        "istanbul-reports": "1.3.0",
         "js-yaml": "3.7.0",
         "mkdirp": "0.5.1",
         "once": "1.4.0"
+      },
+      "dependencies": {
+        "debug": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
+          "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
+          "requires": {
+            "ms": "2.0.0"
+          }
+        },
+        "istanbul-lib-source-maps": {
+          "version": "1.2.4",
+          "resolved": "https://registry.npmjs.org/istanbul-lib-source-maps/-/istanbul-lib-source-maps-1.2.4.tgz",
+          "integrity": "sha512-UzuK0g1wyQijiaYQxj/CdNycFhAd2TLtO2obKQMTZrZ1jzEMRY3rvpASEKkaxbRR6brvdovfA03znPa/pXcejg==",
+          "requires": {
+            "debug": "3.1.0",
+            "istanbul-lib-coverage": "1.2.0",
+            "mkdirp": "0.5.1",
+            "rimraf": "2.6.2",
+            "source-map": "0.5.7"
+          }
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
+        }
       }
     },
     "istanbul-lib-coverage": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-1.1.2.tgz",
-      "integrity": "sha512-tZYA0v5A7qBSsOzcebJJ/z3lk3oSzH62puG78DbBA1+zupipX2CakDyiPV3pOb8He+jBwVimuwB0dTnh38hX0w=="
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-1.2.0.tgz",
+      "integrity": "sha512-GvgM/uXRwm+gLlvkWHTjDAvwynZkL9ns15calTrmhGgowlwJBbWMYzWbKqE2DT6JDP1AFXKa+Zi0EkqNCUqY0A=="
     },
     "istanbul-lib-hook": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/istanbul-lib-hook/-/istanbul-lib-hook-1.1.0.tgz",
-      "integrity": "sha512-U3qEgwVDUerZ0bt8cfl3dSP3S6opBoOtk3ROO5f2EfBr/SRiD9FQqzwaZBqFORu8W7O0EXpai+k7kxHK13beRg==",
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-hook/-/istanbul-lib-hook-1.2.0.tgz",
+      "integrity": "sha512-p3En6/oGkFQV55Up8ZPC2oLxvgSxD8CzA0yBrhRZSh3pfv3OFj9aSGVC0yoerAi/O4u7jUVnOGVX1eVFM+0tmQ==",
       "requires": {
         "append-transform": "0.4.0"
       }
     },
     "istanbul-lib-instrument": {
-      "version": "1.9.2",
-      "resolved": "https://registry.npmjs.org/istanbul-lib-instrument/-/istanbul-lib-instrument-1.9.2.tgz",
-      "integrity": "sha512-nz8t4HQ2206a/3AXi+NHFWEa844DMpPsgbcUteJbt1j8LX1xg56H9rOMnhvcvVvPbW60qAIyrSk44H8ZDqaSSA==",
+      "version": "1.10.1",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-instrument/-/istanbul-lib-instrument-1.10.1.tgz",
+      "integrity": "sha512-1dYuzkOCbuR5GRJqySuZdsmsNKPL3PTuyPevQfoCXJePT9C8y1ga75neU+Tuy9+yS3G/dgx8wgOmp2KLpgdoeQ==",
       "requires": {
         "babel-generator": "6.26.1",
         "babel-template": "6.26.0",
         "babel-traverse": "6.26.0",
         "babel-types": "6.26.0",
         "babylon": "6.18.0",
-        "istanbul-lib-coverage": "1.1.2",
+        "istanbul-lib-coverage": "1.2.0",
         "semver": "5.5.0"
       }
     },
     "istanbul-lib-report": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/istanbul-lib-report/-/istanbul-lib-report-1.1.3.tgz",
-      "integrity": "sha512-D4jVbMDtT2dPmloPJS/rmeP626N5Pr3Rp+SovrPn1+zPChGHcggd/0sL29jnbm4oK9W0wHjCRsdch9oLd7cm6g==",
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-report/-/istanbul-lib-report-1.1.4.tgz",
+      "integrity": "sha512-Azqvq5tT0U09nrncK3q82e/Zjkxa4tkFZv7E6VcqP0QCPn6oNljDPfrZEC/umNXds2t7b8sRJfs6Kmpzt8m2kA==",
       "requires": {
-        "istanbul-lib-coverage": "1.1.2",
+        "istanbul-lib-coverage": "1.2.0",
         "mkdirp": "0.5.1",
         "path-parse": "1.0.5",
         "supports-color": "3.2.3"
@@ -6928,7 +7597,7 @@
       "integrity": "sha512-fDa0hwU/5sDXwAklXgAoCJCOsFsBplVQ6WBldz5UwaqOzmDhUK4nfuR7/G//G2lERlblUNJB8P6e8cXq3a7MlA==",
       "requires": {
         "debug": "3.1.0",
-        "istanbul-lib-coverage": "1.1.2",
+        "istanbul-lib-coverage": "1.2.0",
         "mkdirp": "0.5.1",
         "rimraf": "2.6.2",
         "source-map": "0.5.7"
@@ -6950,13 +7619,32 @@
       }
     },
     "istanbul-reports": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/istanbul-reports/-/istanbul-reports-1.1.4.tgz",
-      "integrity": "sha512-DfSTVOTkuO+kRmbO8Gk650Wqm1WRGr6lrdi2EwDK1vxpS71vdlLd613EpzOKdIFioB5f/scJTjeWBnvd1FWejg==",
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/istanbul-reports/-/istanbul-reports-1.3.0.tgz",
+      "integrity": "sha512-y2Z2IMqE1gefWUaVjrBm0mSKvUkaBy9Vqz8iwr/r40Y9hBbIteH5wqHG/9DLTfJ9xUnUT2j7A3+VVJ6EaYBllA==",
       "requires": {
         "handlebars": "4.0.11"
       }
     },
+    "istextorbinary": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/istextorbinary/-/istextorbinary-2.2.1.tgz",
+      "integrity": "sha512-TS+hoFl8Z5FAFMK38nhBkdLt44CclNRgDHWeMgsV8ko3nDlr/9UI2Sf839sW7enijf8oKsZYXRvM8g0it9Zmcw==",
+      "requires": {
+        "binaryextensions": "2.1.1",
+        "editions": "1.3.4",
+        "textextensions": "2.2.0"
+      }
+    },
+    "isurl": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/isurl/-/isurl-1.0.0.tgz",
+      "integrity": "sha512-1P/yWsxPlDtn7QeRD+ULKQPaIaN6yF368GZ2vDfv0AL0NwpStafjWCDDdn0k8wgFMWpVAqG7oJhxHnlud42i9w==",
+      "requires": {
+        "has-to-string-tag-x": "1.4.1",
+        "is-object": "1.0.1"
+      }
+    },
     "items": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/items/-/items-2.1.1.tgz",
@@ -7025,13 +7713,13 @@
           "integrity": "sha512-T1BzrbFxDIW/LLYQqVfo94y/hhaj1NzVQkZgBumAC+sxbjMROI7VkihOdxNR758iYbQykL2ZOWUBurFgkQrzdg==",
           "requires": {
             "ansi-escapes": "3.0.0",
-            "chalk": "2.3.1",
+            "chalk": "2.3.2",
             "glob": "7.1.2",
             "graceful-fs": "4.1.11",
             "is-ci": "1.1.0",
-            "istanbul-api": "1.2.2",
-            "istanbul-lib-coverage": "1.1.2",
-            "istanbul-lib-instrument": "1.9.2",
+            "istanbul-api": "1.3.1",
+            "istanbul-lib-coverage": "1.2.0",
+            "istanbul-lib-instrument": "1.10.1",
             "istanbul-lib-source-maps": "1.2.3",
             "jest-changed-files": "21.2.0",
             "jest-config": "21.2.1",
@@ -7051,7 +7739,7 @@
             "string-length": "2.0.0",
             "strip-ansi": "4.0.0",
             "which": "1.3.0",
-            "worker-farm": "1.5.4",
+            "worker-farm": "1.6.0",
             "yargs": "9.0.1"
           }
         },
@@ -7126,7 +7814,7 @@
       "resolved": "https://registry.npmjs.org/jest-config/-/jest-config-21.2.1.tgz",
       "integrity": "sha512-fJru5HtlD/5l2o25eY9xT0doK3t2dlglrqoGpbktduyoI0T5CwuB++2YfoNZCrgZipTwPuAGonYv0q7+8yDc/A==",
       "requires": {
-        "chalk": "2.3.1",
+        "chalk": "2.3.2",
         "glob": "7.1.2",
         "jest-environment-jsdom": "21.2.1",
         "jest-environment-node": "21.2.1",
@@ -7144,8 +7832,8 @@
       "resolved": "https://registry.npmjs.org/jest-diff/-/jest-diff-21.2.1.tgz",
       "integrity": "sha512-E5fu6r7PvvPr5qAWE1RaUwIh/k6Zx/3OOkZ4rk5dBJkEWRrUuSgbMt2EO8IUTPTd6DOqU3LW6uTIwX5FRvXoFA==",
       "requires": {
-        "chalk": "2.3.1",
-        "diff": "3.4.0",
+        "chalk": "2.3.2",
+        "diff": "3.5.0",
         "jest-get-type": "21.2.0",
         "pretty-format": "21.2.1"
       }
@@ -7188,8 +7876,8 @@
         "graceful-fs": "4.1.11",
         "jest-docblock": "21.2.0",
         "micromatch": "2.3.11",
-        "sane": "2.4.1",
-        "worker-farm": "1.5.4"
+        "sane": "2.5.0",
+        "worker-farm": "1.6.0"
       },
       "dependencies": {
         "arr-diff": {
@@ -7266,7 +7954,7 @@
       "resolved": "https://registry.npmjs.org/jest-jasmine2/-/jest-jasmine2-21.2.1.tgz",
       "integrity": "sha512-lw8FXXIEekD+jYNlStfgNsUHpfMWhWWCgHV7n0B7mA/vendH7vBFs8xybjQsDzJSduptBZJHqQX9SMssya9+3A==",
       "requires": {
-        "chalk": "2.3.1",
+        "chalk": "2.3.2",
         "expect": "21.2.1",
         "graceful-fs": "4.1.11",
         "jest-diff": "21.2.1",
@@ -7281,7 +7969,7 @@
       "resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-21.2.1.tgz",
       "integrity": "sha512-kn56My+sekD43dwQPrXBl9Zn9tAqwoy25xxe7/iY4u+mG8P3ALj5IK7MLHZ4Mi3xW7uWVCjGY8cm4PqgbsqMCg==",
       "requires": {
-        "chalk": "2.3.1",
+        "chalk": "2.3.2",
         "jest-get-type": "21.2.0",
         "pretty-format": "21.2.1"
       }
@@ -7291,7 +7979,7 @@
       "resolved": "https://registry.npmjs.org/jest-message-util/-/jest-message-util-21.2.1.tgz",
       "integrity": "sha512-EbC1X2n0t9IdeMECJn2BOg7buOGivCvVNjqKMXTzQOu7uIfLml+keUfCALDh8o4rbtndIeyGU8/BKfoTr/LVDQ==",
       "requires": {
-        "chalk": "2.3.1",
+        "chalk": "2.3.2",
         "micromatch": "2.3.11",
         "slash": "1.0.0"
       },
@@ -7381,7 +8069,7 @@
       "integrity": "sha512-vefQ/Lr+VdNvHUZFQXWtOqHX3HEdOc2MtSahBO89qXywEbUxGPB9ZLP9+BHinkxb60UT2Q/tTDOS6rYc6Mwigw==",
       "requires": {
         "browser-resolve": "1.11.2",
-        "chalk": "2.3.1",
+        "chalk": "2.3.2",
         "is-builtin-module": "1.0.0"
       }
     },
@@ -7407,7 +8095,7 @@
         "jest-util": "21.2.1",
         "pify": "3.0.0",
         "throat": "4.1.0",
-        "worker-farm": "1.5.4"
+        "worker-farm": "1.6.0"
       }
     },
     "jest-runtime": {
@@ -7418,7 +8106,7 @@
         "babel-core": "6.26.0",
         "babel-jest": "21.2.0",
         "babel-plugin-istanbul": "4.1.5",
-        "chalk": "2.3.1",
+        "chalk": "2.3.2",
         "convert-source-map": "1.5.1",
         "graceful-fs": "4.1.11",
         "jest-config": "21.2.1",
@@ -7528,7 +8216,7 @@
       "resolved": "https://registry.npmjs.org/jest-snapshot/-/jest-snapshot-21.2.1.tgz",
       "integrity": "sha512-bpaeBnDpdqaRTzN8tWg0DqOTo2DvD3StOemxn67CUd1p1Po+BUpvePAp44jdJ7Pxcjfg+42o4NHw1SxdCA2rvg==",
       "requires": {
-        "chalk": "2.3.1",
+        "chalk": "2.3.2",
         "jest-diff": "21.2.1",
         "jest-matcher-utils": "21.2.1",
         "mkdirp": "0.5.1",
@@ -7542,7 +8230,7 @@
       "integrity": "sha512-r20W91rmHY3fnCoO7aOAlyfC51x2yeV3xF+prGsJAUsYhKeV670ZB8NO88Lwm7ASu8SdH0S+U+eFf498kjhA4g==",
       "requires": {
         "callsites": "2.0.0",
-        "chalk": "2.3.1",
+        "chalk": "2.3.2",
         "graceful-fs": "4.1.11",
         "jest-message-util": "21.2.1",
         "jest-mock": "21.2.0",
@@ -7555,7 +8243,7 @@
       "resolved": "https://registry.npmjs.org/jest-validate/-/jest-validate-21.2.1.tgz",
       "integrity": "sha512-k4HLI1rZQjlU+EC682RlQ6oZvLrE5SCh3brseQc24vbZTxzT/k/3urar5QMCVgjadmSO7lECeGdc6YxnM3yEGg==",
       "requires": {
-        "chalk": "2.3.1",
+        "chalk": "2.3.2",
         "jest-get-type": "21.2.0",
         "leven": "2.1.0",
         "pretty-format": "21.2.1"
@@ -7574,7 +8262,7 @@
         "hoek": "4.2.1",
         "isemail": "2.2.1",
         "items": "2.1.1",
-        "moment": "2.20.1",
+        "moment": "2.21.0",
         "topo": "2.0.2"
       }
     },
@@ -7597,88 +8285,204 @@
         "esprima": "2.7.3"
       }
     },
-    "jsdom": {
-      "version": "9.12.0",
-      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-9.12.0.tgz",
-      "integrity": "sha1-6MVG//ywbADUgzyoRBD+1/igl9Q=",
-      "requires": {
-        "abab": "1.0.4",
-        "acorn": "4.0.13",
-        "acorn-globals": "3.1.0",
-        "array-equal": "1.0.0",
-        "content-type-parser": "1.0.2",
-        "cssom": "0.3.2",
-        "cssstyle": "0.2.37",
-        "escodegen": "1.9.1",
-        "html-encoding-sniffer": "1.0.2",
-        "nwmatcher": "1.4.3",
-        "parse5": "1.5.1",
-        "request": "2.83.0",
-        "sax": "1.2.4",
-        "symbol-tree": "3.2.2",
-        "tough-cookie": "2.3.4",
-        "webidl-conversions": "4.0.2",
-        "whatwg-encoding": "1.0.3",
-        "whatwg-url": "4.8.0",
-        "xml-name-validator": "2.0.1"
-      }
-    },
-    "jsesc": {
+    "jscodeshift": {
       "version": "0.5.0",
-      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
-      "integrity": "sha1-597mbjXW/Bb3EP6R1c9p9w8IkR0="
-    },
-    "json-loader": {
-      "version": "0.5.7",
-      "resolved": "https://registry.npmjs.org/json-loader/-/json-loader-0.5.7.tgz",
-      "integrity": "sha512-QLPs8Dj7lnf3e3QYS1zkCo+4ZwqOiF9d/nZnYozTISxXWCfNs9yuky5rJw4/W34s7POaNlbZmQGaB5NiXCbP4w=="
-    },
-    "json-schema": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz",
-      "integrity": "sha1-tIDIkuWaLwWVTOcnvT8qTogvnhM="
-    },
-    "json-schema-traverse": {
-      "version": "0.3.1",
-      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.3.1.tgz",
-      "integrity": "sha1-NJptRMU6Ud6JtAgFxdXlm0F9M0A="
-    },
-    "json-stable-stringify": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz",
-      "integrity": "sha1-mnWdOcXy/1A/1TAGRu1EX4jE+a8=",
-      "requires": {
-        "jsonify": "0.0.0"
-      }
-    },
-    "json-stringify-safe": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz",
-      "integrity": "sha1-Epai1Y/UXxmg9s4B1lcB4sc1tus="
-    },
-    "json3": {
-      "version": "3.3.2",
-      "resolved": "https://registry.npmjs.org/json3/-/json3-3.3.2.tgz",
-      "integrity": "sha1-PAQ0dD35Pi9cQq7nsZvLSDV19OE="
-    },
-    "json5": {
-      "version": "0.5.1",
-      "resolved": "https://registry.npmjs.org/json5/-/json5-0.5.1.tgz",
-      "integrity": "sha1-Hq3nrMASA0rYTiOWdn6tn6VJWCE="
-    },
-    "jsonfile": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz",
-      "integrity": "sha1-NzaitCi4e72gzIO1P6PWM6NcKug=",
+      "resolved": "https://registry.npmjs.org/jscodeshift/-/jscodeshift-0.5.0.tgz",
+      "integrity": "sha512-JAcQINNMFpdzzpKJN8k5xXjF3XDuckB1/48uScSzcnNyK199iWEc9AxKL9OoX5144M2w5zEx9Qs4/E/eBZZUlw==",
       "requires": {
-        "graceful-fs": "4.1.11"
-      }
-    },
-    "jsonify": {
-      "version": "0.0.0",
-      "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz",
-      "integrity": "sha1-LHS27kHZPKUbe1qu6PUDYx0lKnM="
-    },
+        "babel-plugin-transform-flow-strip-types": "6.22.0",
+        "babel-preset-es2015": "6.24.1",
+        "babel-preset-stage-1": "6.24.1",
+        "babel-register": "6.26.0",
+        "babylon": "7.0.0-beta.42",
+        "colors": "1.1.2",
+        "flow-parser": "0.68.0",
+        "lodash": "4.15.0",
+        "micromatch": "2.3.11",
+        "neo-async": "2.5.0",
+        "node-dir": "0.1.8",
+        "nomnom": "1.8.1",
+        "recast": "0.14.7",
+        "temp": "0.8.3",
+        "write-file-atomic": "1.3.4"
+      },
+      "dependencies": {
+        "arr-diff": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
+          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8=",
+          "requires": {
+            "arr-flatten": "1.1.0"
+          }
+        },
+        "array-unique": {
+          "version": "0.2.1",
+          "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
+          "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM="
+        },
+        "babylon": {
+          "version": "7.0.0-beta.42",
+          "resolved": "https://registry.npmjs.org/babylon/-/babylon-7.0.0-beta.42.tgz",
+          "integrity": "sha512-h6E/OkkvcBw/JimbL0p8dIaxrcuQn3QmIYGC/GtJlRYif5LTKBYPHXYwqluJpfS/kOXoz0go+9mkmOVC0M+zWw=="
+        },
+        "braces": {
+          "version": "1.8.5",
+          "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
+          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc=",
+          "requires": {
+            "expand-range": "1.8.2",
+            "preserve": "0.2.0",
+            "repeat-element": "1.1.2"
+          }
+        },
+        "expand-brackets": {
+          "version": "0.1.5",
+          "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
+          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s=",
+          "requires": {
+            "is-posix-bracket": "0.1.1"
+          }
+        },
+        "extglob": {
+          "version": "0.3.2",
+          "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
+          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE=",
+          "requires": {
+            "is-extglob": "1.0.0"
+          }
+        },
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+          "requires": {
+            "is-buffer": "1.1.6"
+          }
+        },
+        "micromatch": {
+          "version": "2.3.11",
+          "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
+          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU=",
+          "requires": {
+            "arr-diff": "2.0.0",
+            "array-unique": "0.2.1",
+            "braces": "1.8.5",
+            "expand-brackets": "0.1.5",
+            "extglob": "0.3.2",
+            "filename-regex": "2.0.1",
+            "is-extglob": "1.0.0",
+            "is-glob": "2.0.1",
+            "kind-of": "3.2.2",
+            "normalize-path": "2.1.1",
+            "object.omit": "2.0.1",
+            "parse-glob": "3.0.4",
+            "regex-cache": "0.4.4"
+          }
+        },
+        "write-file-atomic": {
+          "version": "1.3.4",
+          "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-1.3.4.tgz",
+          "integrity": "sha1-+Aek8LHZ6ROuekgRLmzDrxmRtF8=",
+          "requires": {
+            "graceful-fs": "4.1.11",
+            "imurmurhash": "0.1.4",
+            "slide": "1.1.6"
+          }
+        }
+      }
+    },
+    "jsdom": {
+      "version": "9.12.0",
+      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-9.12.0.tgz",
+      "integrity": "sha1-6MVG//ywbADUgzyoRBD+1/igl9Q=",
+      "requires": {
+        "abab": "1.0.4",
+        "acorn": "4.0.13",
+        "acorn-globals": "3.1.0",
+        "array-equal": "1.0.0",
+        "content-type-parser": "1.0.2",
+        "cssom": "0.3.2",
+        "cssstyle": "0.2.37",
+        "escodegen": "1.9.1",
+        "html-encoding-sniffer": "1.0.2",
+        "nwmatcher": "1.4.4",
+        "parse5": "1.5.1",
+        "request": "2.85.0",
+        "sax": "1.2.4",
+        "symbol-tree": "3.2.2",
+        "tough-cookie": "2.3.4",
+        "webidl-conversions": "4.0.2",
+        "whatwg-encoding": "1.0.3",
+        "whatwg-url": "4.8.0",
+        "xml-name-validator": "2.0.1"
+      }
+    },
+    "jsesc": {
+      "version": "0.5.0",
+      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
+      "integrity": "sha1-597mbjXW/Bb3EP6R1c9p9w8IkR0="
+    },
+    "json-buffer": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/json-buffer/-/json-buffer-3.0.0.tgz",
+      "integrity": "sha1-Wx85evx11ne96Lz8Dkfh+aPZqJg="
+    },
+    "json-loader": {
+      "version": "0.5.7",
+      "resolved": "https://registry.npmjs.org/json-loader/-/json-loader-0.5.7.tgz",
+      "integrity": "sha512-QLPs8Dj7lnf3e3QYS1zkCo+4ZwqOiF9d/nZnYozTISxXWCfNs9yuky5rJw4/W34s7POaNlbZmQGaB5NiXCbP4w=="
+    },
+    "json-parse-better-errors": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/json-parse-better-errors/-/json-parse-better-errors-1.0.1.tgz",
+      "integrity": "sha512-xyQpxeWWMKyJps9CuGJYeng6ssI5bpqS9ltQpdVQ90t4ql6NdnxFKh95JcRt2cun/DjMVNrdjniLPuMA69xmCw=="
+    },
+    "json-schema": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz",
+      "integrity": "sha1-tIDIkuWaLwWVTOcnvT8qTogvnhM="
+    },
+    "json-schema-traverse": {
+      "version": "0.3.1",
+      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.3.1.tgz",
+      "integrity": "sha1-NJptRMU6Ud6JtAgFxdXlm0F9M0A="
+    },
+    "json-stable-stringify": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/json-stable-stringify/-/json-stable-stringify-1.0.1.tgz",
+      "integrity": "sha1-mnWdOcXy/1A/1TAGRu1EX4jE+a8=",
+      "requires": {
+        "jsonify": "0.0.0"
+      }
+    },
+    "json-stringify-safe": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz",
+      "integrity": "sha1-Epai1Y/UXxmg9s4B1lcB4sc1tus="
+    },
+    "json3": {
+      "version": "3.3.2",
+      "resolved": "https://registry.npmjs.org/json3/-/json3-3.3.2.tgz",
+      "integrity": "sha1-PAQ0dD35Pi9cQq7nsZvLSDV19OE="
+    },
+    "json5": {
+      "version": "0.5.1",
+      "resolved": "https://registry.npmjs.org/json5/-/json5-0.5.1.tgz",
+      "integrity": "sha1-Hq3nrMASA0rYTiOWdn6tn6VJWCE="
+    },
+    "jsonfile": {
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz",
+      "integrity": "sha1-NzaitCi4e72gzIO1P6PWM6NcKug=",
+      "requires": {
+        "graceful-fs": "4.1.11"
+      }
+    },
+    "jsonify": {
+      "version": "0.0.0",
+      "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz",
+      "integrity": "sha1-LHS27kHZPKUbe1qu6PUDYx0lKnM="
+    },
     "jsonpointer": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/jsonpointer/-/jsonpointer-4.0.1.tgz",
@@ -7701,9 +8505,17 @@
       "integrity": "sha512-mJVp13Ix6gFo3SBAy9U/kL+oeZqzlYYYLQBwXVBlVzIsZwBqGREnOro24oC/8s8aox+rJhtZ2DiQof++IrkA+g=="
     },
     "keycode": {
-      "version": "2.1.9",
-      "resolved": "https://registry.npmjs.org/keycode/-/keycode-2.1.9.tgz",
-      "integrity": "sha1-lkojxU5IiUBbSGGlyfBIDUUUHfo="
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/keycode/-/keycode-2.2.0.tgz",
+      "integrity": "sha1-PQr1bce4uOXLqNCpfxByBO7CKwQ="
+    },
+    "keyv": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/keyv/-/keyv-3.0.0.tgz",
+      "integrity": "sha512-eguHnq22OE3uVoSYG0LVWNP+4ppamWr9+zWBe1bsNcovIMy6huUJFPgy4mGwCd/rnl3vOLGW1MTlu4c57CT1xA==",
+      "requires": {
+        "json-buffer": "3.0.0"
+      }
     },
     "killable": {
       "version": "1.0.0",
@@ -7724,12 +8536,9 @@
       }
     },
     "lazy-cache": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-2.0.2.tgz",
-      "integrity": "sha1-uRkKT5EzVGlIQIWfio9whNiCImQ=",
-      "requires": {
-        "set-getter": "0.1.0"
-      }
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-1.0.4.tgz",
+      "integrity": "sha1-odePw6UEdMuAhF07O24dpJpEbo4="
     },
     "lcid": {
       "version": "1.0.0",
@@ -7753,6 +8562,203 @@
         "type-check": "0.3.2"
       }
     },
+    "listr": {
+      "version": "0.13.0",
+      "resolved": "https://registry.npmjs.org/listr/-/listr-0.13.0.tgz",
+      "integrity": "sha1-ILsLowuuZg7oTMBQPfS+PVYjiH0=",
+      "requires": {
+        "chalk": "1.1.3",
+        "cli-truncate": "0.2.1",
+        "figures": "1.7.0",
+        "indent-string": "2.1.0",
+        "is-observable": "0.2.0",
+        "is-promise": "2.1.0",
+        "is-stream": "1.1.0",
+        "listr-silent-renderer": "1.1.1",
+        "listr-update-renderer": "0.4.0",
+        "listr-verbose-renderer": "0.4.1",
+        "log-symbols": "1.0.2",
+        "log-update": "1.0.2",
+        "ora": "0.2.3",
+        "p-map": "1.2.0",
+        "rxjs": "5.5.7",
+        "stream-to-observable": "0.2.0",
+        "strip-ansi": "3.0.1"
+      },
+      "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          }
+        },
+        "figures": {
+          "version": "1.7.0",
+          "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz",
+          "integrity": "sha1-y+Hjr/zxzUS4DK3+0o3Hk6lwHS4=",
+          "requires": {
+            "escape-string-regexp": "1.0.5",
+            "object-assign": "4.1.1"
+          }
+        },
+        "log-symbols": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-1.0.2.tgz",
+          "integrity": "sha1-N2/3tY6jCGoPCfrMdGF+ylAeGhg=",
+          "requires": {
+            "chalk": "1.1.3"
+          }
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+        }
+      }
+    },
+    "listr-silent-renderer": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/listr-silent-renderer/-/listr-silent-renderer-1.1.1.tgz",
+      "integrity": "sha1-kktaN1cVN3C/Go4/v3S4u/P5JC4="
+    },
+    "listr-update-renderer": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/listr-update-renderer/-/listr-update-renderer-0.4.0.tgz",
+      "integrity": "sha1-NE2YDaLKLosUW6MFkI8yrj9MyKc=",
+      "requires": {
+        "chalk": "1.1.3",
+        "cli-truncate": "0.2.1",
+        "elegant-spinner": "1.0.1",
+        "figures": "1.7.0",
+        "indent-string": "3.2.0",
+        "log-symbols": "1.0.2",
+        "log-update": "1.0.2",
+        "strip-ansi": "3.0.1"
+      },
+      "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          }
+        },
+        "figures": {
+          "version": "1.7.0",
+          "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz",
+          "integrity": "sha1-y+Hjr/zxzUS4DK3+0o3Hk6lwHS4=",
+          "requires": {
+            "escape-string-regexp": "1.0.5",
+            "object-assign": "4.1.1"
+          }
+        },
+        "indent-string": {
+          "version": "3.2.0",
+          "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-3.2.0.tgz",
+          "integrity": "sha1-Sl/W0nzDMvN+VBmlBNu4NxBckok="
+        },
+        "log-symbols": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-1.0.2.tgz",
+          "integrity": "sha1-N2/3tY6jCGoPCfrMdGF+ylAeGhg=",
+          "requires": {
+            "chalk": "1.1.3"
+          }
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+        }
+      }
+    },
+    "listr-verbose-renderer": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/listr-verbose-renderer/-/listr-verbose-renderer-0.4.1.tgz",
+      "integrity": "sha1-ggb0z21S3cWCfl/RSYng6WWTOjU=",
+      "requires": {
+        "chalk": "1.1.3",
+        "cli-cursor": "1.0.2",
+        "date-fns": "1.29.0",
+        "figures": "1.7.0"
+      },
+      "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          }
+        },
+        "cli-cursor": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-1.0.2.tgz",
+          "integrity": "sha1-ZNo/fValRBLll5S9Ytw1KV6PKYc=",
+          "requires": {
+            "restore-cursor": "1.0.1"
+          }
+        },
+        "figures": {
+          "version": "1.7.0",
+          "resolved": "https://registry.npmjs.org/figures/-/figures-1.7.0.tgz",
+          "integrity": "sha1-y+Hjr/zxzUS4DK3+0o3Hk6lwHS4=",
+          "requires": {
+            "escape-string-regexp": "1.0.5",
+            "object-assign": "4.1.1"
+          }
+        },
+        "onetime": {
+          "version": "1.1.0",
+          "resolved": "http://registry.npmjs.org/onetime/-/onetime-1.1.0.tgz",
+          "integrity": "sha1-ofeDj4MUxRbwXs78vEzP4EtO14k="
+        },
+        "restore-cursor": {
+          "version": "1.0.1",
+          "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-1.0.1.tgz",
+          "integrity": "sha1-NGYfRohjJ/7SmRR5FSJS35LapUE=",
+          "requires": {
+            "exit-hook": "1.1.1",
+            "onetime": "1.1.0"
+          }
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+        }
+      }
+    },
     "load-json-file": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-2.0.0.tgz",
@@ -7806,9 +8812,9 @@
       "integrity": "sha1-MWI5HY8BQKoiz49rPDTWt/Y9Oqk="
     },
     "lodash-es": {
-      "version": "4.17.5",
-      "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.5.tgz",
-      "integrity": "sha512-Ez3ONp3TK9gX1HYKp6IhetcVybD+2F+Yp6GS9dfH8ue6EOCEzQtQEh4K0FYWBP9qLv+lzeQAYXw+3ySfxyZqkw=="
+      "version": "4.17.7",
+      "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.7.tgz",
+      "integrity": "sha512-jzqTi3vk4J5Dxq43cNjB0ekfCjPLHixoY2Sc0WHTo+0r928taLqe/VCt02vY5uQBvg0rdXgL3xWkK4X0MCmZcw=="
     },
     "lodash._baseassign": {
       "version": "3.2.0",
@@ -7944,11 +8950,57 @@
       "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz",
       "integrity": "sha1-0CJTc662Uq3BvILklFM5qEJ1R3M="
     },
+    "log-symbols": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-2.2.0.tgz",
+      "integrity": "sha512-VeIAFslyIerEJLXHziedo2basKbMKtTw3vfn5IzG0XTjhAVEJyNHnL2p7vc+wBDSdQuUpNw3M2u6xb9QsAY5Eg==",
+      "requires": {
+        "chalk": "2.3.2"
+      }
+    },
+    "log-update": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/log-update/-/log-update-1.0.2.tgz",
+      "integrity": "sha1-GZKfZMQJPS0ucHWh2tivWcKWuNE=",
+      "requires": {
+        "ansi-escapes": "1.4.0",
+        "cli-cursor": "1.0.2"
+      },
+      "dependencies": {
+        "cli-cursor": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-1.0.2.tgz",
+          "integrity": "sha1-ZNo/fValRBLll5S9Ytw1KV6PKYc=",
+          "requires": {
+            "restore-cursor": "1.0.1"
+          }
+        },
+        "onetime": {
+          "version": "1.1.0",
+          "resolved": "http://registry.npmjs.org/onetime/-/onetime-1.1.0.tgz",
+          "integrity": "sha1-ofeDj4MUxRbwXs78vEzP4EtO14k="
+        },
+        "restore-cursor": {
+          "version": "1.0.1",
+          "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-1.0.1.tgz",
+          "integrity": "sha1-NGYfRohjJ/7SmRR5FSJS35LapUE=",
+          "requires": {
+            "exit-hook": "1.1.1",
+            "onetime": "1.1.0"
+          }
+        }
+      }
+    },
     "loglevel": {
       "version": "1.6.1",
       "resolved": "https://registry.npmjs.org/loglevel/-/loglevel-1.6.1.tgz",
       "integrity": "sha1-4PyVEztu8nbNyIh82vJKpvFW+Po="
     },
+    "loglevelnext": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/loglevelnext/-/loglevelnext-1.0.3.tgz",
+      "integrity": "sha512-OCxd/b78TijTB4b6zVqLbMrxhebyvdZKwqpL0VHUZ0pYhavXaPD4l6Xrr4n5xqTYWiqtb0i7ikSoJY/myQ/Org=="
+    },
     "lolex": {
       "version": "2.3.2",
       "resolved": "https://registry.npmjs.org/lolex/-/lolex-2.3.2.tgz",
@@ -7981,10 +9033,15 @@
       "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-1.1.4.tgz",
       "integrity": "sha1-miyr0bno4K6ZOkv31YdcOcQujqw="
     },
+    "lowercase-keys": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.1.tgz",
+      "integrity": "sha512-G2Lj61tXDnVFFOi8VZds+SoQjtQC3dgokKdDG2mTm1tx4m50NUHBOZSBwQQHyy0V12A0JTG4icfZQH+xPyh8VA=="
+    },
     "lru-cache": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.1.tgz",
-      "integrity": "sha512-q4spe4KTfsAS1SUHLO0wz8Qiyf1+vMIAgpRYioFYDMNqKfHQbg+AVDH3i4fvpl71/P1L0dBl+fQi+P37UYf0ew==",
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.2.tgz",
+      "integrity": "sha512-wgeVXhrDwAWnIF/yZARsFnMBtdFXOg1b8RIrhilp+0iDYN4mdQcNZElDZ0e4B64BhaxeQ5zN7PMyvu7we1kPeQ==",
       "requires": {
         "pseudomap": "1.0.2",
         "yallist": "2.1.2"
@@ -8040,13 +9097,13 @@
       "integrity": "sha512-v/ej7DflZbb6t//3Yu9vg0T+sun+Q9EoqggifeyABKfvFROqPwwwpv+hd1NKT2QxTRg6VCFk10IIJcMI13yCoQ==",
       "requires": {
         "loader-utils": "1.1.0",
-        "marked": "0.3.17"
+        "marked": "0.3.18"
       }
     },
     "marked": {
-      "version": "0.3.17",
-      "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.17.tgz",
-      "integrity": "sha512-+AKbNsjZl6jFfLPwHhWmGTqE009wTKn3RTmn9K8oUKHrX/abPJjtcRtXpYB/FFrwPJRUA86LX/de3T0knkPCmQ=="
+      "version": "0.3.18",
+      "resolved": "https://registry.npmjs.org/marked/-/marked-0.3.18.tgz",
+      "integrity": "sha512-49i2QYhfULqaXzNZpxC808PisuCTGT2fgG0zrzdCI9N3rIfAWfW0nggvbXr6zvpynZdOG5+9xNxdzP0kwZnERw=="
     },
     "math-expression-evaluator": {
       "version": "1.2.17",
@@ -8086,13 +9143,70 @@
         "mimic-fn": "1.2.0"
       }
     },
+    "mem-fs": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/mem-fs/-/mem-fs-1.1.3.tgz",
+      "integrity": "sha1-uK6NLj/Lb10/kWXBLUVRoGXZicw=",
+      "requires": {
+        "through2": "2.0.3",
+        "vinyl": "1.2.0",
+        "vinyl-file": "2.0.0"
+      }
+    },
+    "mem-fs-editor": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/mem-fs-editor/-/mem-fs-editor-3.0.2.tgz",
+      "integrity": "sha1-3Qpuryu4prN3QAZ6pUnrUwEFr58=",
+      "requires": {
+        "commondir": "1.0.1",
+        "deep-extend": "0.4.2",
+        "ejs": "2.5.7",
+        "glob": "7.1.2",
+        "globby": "6.1.0",
+        "mkdirp": "0.5.1",
+        "multimatch": "2.1.0",
+        "rimraf": "2.6.2",
+        "through2": "2.0.3",
+        "vinyl": "2.1.0"
+      },
+      "dependencies": {
+        "clone": {
+          "version": "2.1.2",
+          "resolved": "https://registry.npmjs.org/clone/-/clone-2.1.2.tgz",
+          "integrity": "sha1-G39Ln1kfHo+DZwQBYANFoCiHQ18="
+        },
+        "clone-stats": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/clone-stats/-/clone-stats-1.0.0.tgz",
+          "integrity": "sha1-s3gt/4u1R04Yuba/D9/ngvh3doA="
+        },
+        "replace-ext": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-1.0.0.tgz",
+          "integrity": "sha1-3mMSg3P8v3w8z6TeWkgMRaZ5WOs="
+        },
+        "vinyl": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-2.1.0.tgz",
+          "integrity": "sha1-Ah+cLPlR1rk5lDyJ617lrdT9kkw=",
+          "requires": {
+            "clone": "2.1.2",
+            "clone-buffer": "1.0.0",
+            "clone-stats": "1.0.0",
+            "cloneable-readable": "1.1.2",
+            "remove-trailing-separator": "1.1.0",
+            "replace-ext": "1.0.0"
+          }
+        }
+      }
+    },
     "memory-fs": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.4.1.tgz",
       "integrity": "sha1-OpoguEYlI+RHz7x+i7gO1me/xVI=",
       "requires": {
         "errno": "0.1.7",
-        "readable-stream": "2.3.4"
+        "readable-stream": "2.3.5"
       }
     },
     "meow": {
@@ -8206,9 +9320,9 @@
       "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4="
     },
     "micromatch": {
-      "version": "3.1.9",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-3.1.9.tgz",
-      "integrity": "sha512-SlIz6sv5UPaAVVFRKodKjCg48EbNoIhgetzfK/Cy0v5U52Z6zB136M8tp0UC9jM53LYbmIRihJszvvqpKkfm9g==",
+      "version": "3.1.10",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-3.1.10.tgz",
+      "integrity": "sha512-MWikgl9n9M3w+bpsY3He8L+w9eF9338xRl8IAO5viDizwSzziFEyUzo2xrrloB64ADbTf8uA8vRqqttDTOmccg==",
       "requires": {
         "arr-diff": "4.0.0",
         "array-unique": "0.3.2",
@@ -8221,7 +9335,7 @@
         "nanomatch": "1.2.9",
         "object.pick": "1.3.0",
         "regex-not": "1.0.2",
-        "snapdragon": "0.8.1",
+        "snapdragon": "0.8.2",
         "to-regex": "3.0.2"
       }
     },
@@ -8257,6 +9371,11 @@
       "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-1.2.0.tgz",
       "integrity": "sha512-jf84uxzwiuiIVKiOLpfYk7N46TSy8ubTonmneY9vrpHNAnp0QBt2BxWV9dO3/j+BoVAb+a5G6YDPW3M5HOdMWQ=="
     },
+    "mimic-response": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/mimic-response/-/mimic-response-1.0.0.tgz",
+      "integrity": "sha1-3z02Uqc/3ta5sLJBRub9BSNTRY4="
+    },
     "min-document": {
       "version": "2.19.0",
       "resolved": "https://registry.npmjs.org/min-document/-/min-document-2.19.0.tgz",
@@ -8293,10 +9412,10 @@
       "resolved": "https://registry.npmjs.org/mississippi/-/mississippi-2.0.0.tgz",
       "integrity": "sha512-zHo8v+otD1J10j/tC+VNoGK9keCuByhKovAvdn74dmxJl9+mWHnx6EMsDN4lgRoMI/eYo2nchAxniIbUPb5onw==",
       "requires": {
-        "concat-stream": "1.6.0",
-        "duplexify": "3.5.3",
+        "concat-stream": "1.6.2",
+        "duplexify": "3.5.4",
         "end-of-stream": "1.4.1",
-        "flush-write-stream": "1.0.2",
+        "flush-write-stream": "1.0.3",
         "from2": "2.3.0",
         "parallel-transform": "1.1.0",
         "pump": "2.0.1",
@@ -8422,9 +9541,9 @@
       }
     },
     "moment": {
-      "version": "2.20.1",
-      "resolved": "https://registry.npmjs.org/moment/-/moment-2.20.1.tgz",
-      "integrity": "sha512-Yh9y73JRljxW5QxN08Fner68eFLxM5ynNOAw2LbIB1YAGeQzZT8QFSUvkAz609Zf+IHhhaUxqZK8dG3W/+HEvg=="
+      "version": "2.21.0",
+      "resolved": "https://registry.npmjs.org/moment/-/moment-2.21.0.tgz",
+      "integrity": "sha512-TCZ36BjURTeFTM/CwRcViQlfkMvL1/vFISuNLO5GkcVm1+QHfbSiNqZuWeMFjj1/3+uAjXswgRk30j1kkLYJBQ=="
     },
     "move-concurrently": {
       "version": "1.0.1",
@@ -8458,6 +9577,17 @@
       "resolved": "https://registry.npmjs.org/multicast-dns-service-types/-/multicast-dns-service-types-1.1.0.tgz",
       "integrity": "sha1-iZ8R2WhuXgXLkbNdXw5jt3PPyQE="
     },
+    "multimatch": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/multimatch/-/multimatch-2.1.0.tgz",
+      "integrity": "sha1-nHkGoi+0wCkZ4vX3UWG0zb1LKis=",
+      "requires": {
+        "array-differ": "1.0.0",
+        "array-union": "1.0.2",
+        "arrify": "1.0.1",
+        "minimatch": "3.0.4"
+      }
+    },
     "mustache": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/mustache/-/mustache-2.3.0.tgz",
@@ -8469,9 +9599,9 @@
       "integrity": "sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s="
     },
     "nan": {
-      "version": "2.9.2",
-      "resolved": "https://registry.npmjs.org/nan/-/nan-2.9.2.tgz",
-      "integrity": "sha512-ltW65co7f3PQWBDbqVvaU1WtFJUsNW7sWWm4HINhbMQIyVyzIeyZ8toX5TC5eeooE6piZoaEh4cZkueSKG3KYw=="
+      "version": "2.10.0",
+      "resolved": "https://registry.npmjs.org/nan/-/nan-2.10.0.tgz",
+      "integrity": "sha512-bAdJv7fBLhWC+/Bls0Oza+mvTaNQtP+1RyhhhvD95pgUJz6XM5IzgmxOkItJ9tkoCiplvAnXI1tNmmUD/eScyA=="
     },
     "nanomatch": {
       "version": "1.2.9",
@@ -8488,7 +9618,7 @@
         "kind-of": "6.0.2",
         "object.pick": "1.3.0",
         "regex-not": "1.0.2",
-        "snapdragon": "0.8.1",
+        "snapdragon": "0.8.2",
         "to-regex": "3.0.2"
       }
     },
@@ -8506,14 +9636,35 @@
       }
     },
     "nearley": {
-      "version": "2.11.1",
-      "resolved": "https://registry.npmjs.org/nearley/-/nearley-2.11.1.tgz",
-      "integrity": "sha512-1azpqq1JvHKZNPEixS1jNEXf4kDilhFtr8AIZIGjP8N0TcAcUhKgi354niI5pM4JoOsMQ+H6vzCYWQa95LQjcw==",
+      "version": "2.13.0",
+      "resolved": "https://registry.npmjs.org/nearley/-/nearley-2.13.0.tgz",
+      "integrity": "sha512-ioYYogSaZhFlCpRizQgY3UT3G1qFXmHGY/5ozoFE3dMfiCRAeJfh+IPE3/eh9gCZvqLhPCWb4bLt7Bqzo+1mLQ==",
       "requires": {
         "nomnom": "1.6.2",
         "railroad-diagrams": "1.0.0",
         "randexp": "0.4.6",
         "semver": "5.5.0"
+      },
+      "dependencies": {
+        "colors": {
+          "version": "0.5.1",
+          "resolved": "https://registry.npmjs.org/colors/-/colors-0.5.1.tgz",
+          "integrity": "sha1-fQAj6usVTo7p/Oddy5I9DtFmd3Q="
+        },
+        "nomnom": {
+          "version": "1.6.2",
+          "resolved": "https://registry.npmjs.org/nomnom/-/nomnom-1.6.2.tgz",
+          "integrity": "sha1-hKZqJgF0QI/Ft3oY+IjszET7aXE=",
+          "requires": {
+            "colors": "0.5.1",
+            "underscore": "1.4.4"
+          }
+        },
+        "underscore": {
+          "version": "1.4.4",
+          "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.4.4.tgz",
+          "integrity": "sha1-YaajIBBiKvoHljvzJSA88SI51gQ="
+        }
       }
     },
     "negotiator": {
@@ -8531,6 +9682,11 @@
       "resolved": "https://registry.npmjs.org/netrc/-/netrc-0.1.4.tgz",
       "integrity": "sha1-a+lPysqNd63gqWcNxGCRTJRHJEQ="
     },
+    "next-tick": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/next-tick/-/next-tick-1.0.0.tgz",
+      "integrity": "sha1-yobR/ogoFpsBICCOPchCS524NCw="
+    },
     "ngrok": {
       "version": "2.2.26",
       "resolved": "https://registry.npmjs.org/ngrok/-/ngrok-2.2.26.tgz",
@@ -8540,14 +9696,19 @@
         "async": "2.6.0",
         "decompress-zip": "0.3.0",
         "lock": "0.1.4",
-        "request": "2.83.0",
+        "request": "2.85.0",
         "uuid": "3.2.1"
       }
     },
+    "nice-try": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.4.tgz",
+      "integrity": "sha512-2NpiFHqC87y/zFke0fC0spBXL3bBsoh/p5H1EFhshxjCR5+0g2d6BiXbUFz9v1sAcxsk2htp2eQnNIci2dIYcA=="
+    },
     "nise": {
-      "version": "1.2.7",
-      "resolved": "https://registry.npmjs.org/nise/-/nise-1.2.7.tgz",
-      "integrity": "sha512-8LqP1pFLB1v5QU8KlT2WqWzhMRJ3o9LwnZHz+VCbVB8rTsRTFCjtOYv/BatcmLOWp21NedTrErVGinfxe6XYtA==",
+      "version": "1.3.2",
+      "resolved": "https://registry.npmjs.org/nise/-/nise-1.3.2.tgz",
+      "integrity": "sha512-KPKb+wvETBiwb4eTwtR/OsA2+iijXP+VnlSFYJo3EHjm2yjek1NWxHOUQat3i7xNLm1Bm18UA5j5Wor0yO2GtA==",
       "requires": {
         "@sinonjs/formatio": "2.0.0",
         "just-extend": "1.1.27",
@@ -8580,12 +9741,9 @@
       }
     },
     "node-dir": {
-      "version": "0.1.17",
-      "resolved": "https://registry.npmjs.org/node-dir/-/node-dir-0.1.17.tgz",
-      "integrity": "sha1-X1Zl2TNRM1yqvvjxxVRRbPXx5OU=",
-      "requires": {
-        "minimatch": "3.0.4"
-      }
+      "version": "0.1.8",
+      "resolved": "https://registry.npmjs.org/node-dir/-/node-dir-0.1.8.tgz",
+      "integrity": "sha1-VfuN62mQcHB/tn+RpGDwRIKUx30="
     },
     "node-fetch": {
       "version": "1.6.3",
@@ -8614,7 +9772,7 @@
         "nopt": "3.0.6",
         "npmlog": "4.1.2",
         "osenv": "0.1.5",
-        "request": "2.83.0",
+        "request": "2.85.0",
         "rimraf": "2.6.2",
         "semver": "5.3.0",
         "tar": "2.2.1",
@@ -8652,9 +9810,9 @@
         "process": "0.11.10",
         "punycode": "1.4.1",
         "querystring-es3": "0.2.1",
-        "readable-stream": "2.3.4",
+        "readable-stream": "2.3.5",
         "stream-browserify": "2.0.1",
-        "stream-http": "2.8.0",
+        "stream-http": "2.8.1",
         "string_decoder": "1.0.3",
         "timers-browserify": "2.0.6",
         "tty-browserify": "0.0.0",
@@ -8675,9 +9833,9 @@
       }
     },
     "node-sass": {
-      "version": "4.7.2",
-      "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.7.2.tgz",
-      "integrity": "sha512-CaV+wLqZ7//Jdom5aUFCpGNoECd7BbNhjuwdsX/LkXBrHl8eb1Wjw4HvWqcFvhr5KuNgAk8i/myf/MQ1YYeroA==",
+      "version": "4.8.3",
+      "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.8.3.tgz",
+      "integrity": "sha512-tfFWhUsCk/Y19zarDcPo5xpj+IW3qCfOjVdHtYeG6S1CKbQOh1zqylnQK6cV3z9k80yxAnFX9Y+a9+XysDhhfg==",
       "requires": {
         "async-foreach": "0.1.3",
         "chalk": "1.1.3",
@@ -8691,7 +9849,7 @@
         "lodash.mergewith": "4.6.1",
         "meow": "3.7.0",
         "mkdirp": "0.5.1",
-        "nan": "2.9.2",
+        "nan": "2.10.0",
         "node-gyp": "3.6.2",
         "npmlog": "4.1.2",
         "request": "2.79.0",
@@ -8745,7 +9903,7 @@
           "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-3.0.1.tgz",
           "integrity": "sha1-ElYDfsufDF9549bvE14wdwGEuYI=",
           "requires": {
-            "lru-cache": "4.1.1",
+            "lru-cache": "4.1.2",
             "which": "1.3.0"
           }
         },
@@ -8773,7 +9931,7 @@
           "integrity": "sha1-zcvAgYgmWtEZtqWnyKtw7s+10n0=",
           "requires": {
             "chalk": "1.1.3",
-            "commander": "2.14.1",
+            "commander": "2.15.1",
             "is-my-json-valid": "2.17.2",
             "pinkie-promise": "2.0.1"
           }
@@ -8801,7 +9959,7 @@
           "requires": {
             "assert-plus": "0.2.0",
             "jsprim": "1.4.1",
-            "sshpk": "1.13.1"
+            "sshpk": "1.14.1"
           }
         },
         "qs": {
@@ -8857,18 +10015,33 @@
       }
     },
     "nomnom": {
-      "version": "1.6.2",
-      "resolved": "https://registry.npmjs.org/nomnom/-/nomnom-1.6.2.tgz",
-      "integrity": "sha1-hKZqJgF0QI/Ft3oY+IjszET7aXE=",
+      "version": "1.8.1",
+      "resolved": "https://registry.npmjs.org/nomnom/-/nomnom-1.8.1.tgz",
+      "integrity": "sha1-IVH3Ikcrp55Qp2/BJbuMjy5Nwqc=",
       "requires": {
-        "colors": "0.5.1",
-        "underscore": "1.4.4"
+        "chalk": "0.4.0",
+        "underscore": "1.6.0"
       },
       "dependencies": {
-        "colors": {
-          "version": "0.5.1",
-          "resolved": "https://registry.npmjs.org/colors/-/colors-0.5.1.tgz",
-          "integrity": "sha1-fQAj6usVTo7p/Oddy5I9DtFmd3Q="
+        "ansi-styles": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-1.0.0.tgz",
+          "integrity": "sha1-yxAt8cVvUSPquLZ817mAJ6AnkXg="
+        },
+        "chalk": {
+          "version": "0.4.0",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-0.4.0.tgz",
+          "integrity": "sha1-UZmj3c0MHv4jvAjBsCewYXbgxk8=",
+          "requires": {
+            "ansi-styles": "1.0.0",
+            "has-color": "0.1.7",
+            "strip-ansi": "0.1.1"
+          }
+        },
+        "strip-ansi": {
+          "version": "0.1.1",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-0.1.1.tgz",
+          "integrity": "sha1-OeipjQRNFQZgq+SmgIrPcLt7yZE="
         }
       }
     },
@@ -8885,7 +10058,7 @@
       "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.4.0.tgz",
       "integrity": "sha512-9jjUFbTPfEy3R/ad/2oNbKtW9Hgovl5O1FvFWKkKblNXoN/Oou6+9+KKohPK13Yc3/TyunyWhJp6gvRNR/PPAw==",
       "requires": {
-        "hosted-git-info": "2.5.0",
+        "hosted-git-info": "2.6.0",
         "is-builtin-module": "1.0.0",
         "semver": "5.5.0",
         "validate-npm-package-license": "3.0.3"
@@ -8953,9 +10126,9 @@
       "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0="
     },
     "nwmatcher": {
-      "version": "1.4.3",
-      "resolved": "https://registry.npmjs.org/nwmatcher/-/nwmatcher-1.4.3.tgz",
-      "integrity": "sha512-IKdSTiDWCarf2JTS5e9e2+5tPZGdkRJ79XjYV0pzK8Q9BpsFyBq1RGKxzs7Q8UBushGw7m6TzVKz6fcY99iSWw=="
+      "version": "1.4.4",
+      "resolved": "https://registry.npmjs.org/nwmatcher/-/nwmatcher-1.4.4.tgz",
+      "integrity": "sha512-3iuY4N5dhgMpCUrOVnuAdGrgxVqV2cJpM+XNccjR2DKOB1RUP0aA+wGXEiNziG/UKboFyGBIoKOaNlJxx8bciQ=="
     },
     "oauth-sign": {
       "version": "0.8.2",
@@ -9068,7 +10241,7 @@
       "integrity": "sha1-G/mk3SKI9bM/Opk9JXZh8F0WGl8=",
       "requires": {
         "define-properties": "1.1.2",
-        "es-abstract": "1.10.0",
+        "es-abstract": "1.11.0",
         "function-bind": "1.1.1",
         "has": "1.0.1"
       }
@@ -9079,7 +10252,7 @@
       "integrity": "sha1-h1jIRvW0B62rDyNuCYbxSwUcqhY=",
       "requires": {
         "define-properties": "1.1.2",
-        "es-abstract": "1.10.0"
+        "es-abstract": "1.11.0"
       }
     },
     "object.omit": {
@@ -9105,31 +10278,31 @@
       "integrity": "sha1-5STaCbT2b/Bd9FdUbscqyZ8TBpo=",
       "requires": {
         "define-properties": "1.1.2",
-        "es-abstract": "1.10.0",
+        "es-abstract": "1.11.0",
         "function-bind": "1.1.1",
         "has": "1.0.1"
       }
     },
     "obuf": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/obuf/-/obuf-1.1.1.tgz",
-      "integrity": "sha1-EEEktsYCxnlogaBCVB0220OlJk4="
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/obuf/-/obuf-1.1.2.tgz",
+      "integrity": "sha512-PX1wu0AmAdPqOL1mWhqmlOd8kOIZQwGZw6rh7uby9fTc5lhaOWFLX3I6R1hrF9k3zUY40e6igsLGkDXK92LJNg=="
     },
     "office-ui-fabric-core": {
-      "version": "9.4.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-9.4.0.tgz",
-      "integrity": "sha1-z1dU/7D63H0ewKVoxnNxxw8ranE="
+      "version": "9.6.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-core/-/office-ui-fabric-core-9.6.0.tgz",
+      "integrity": "sha1-KhZgU8ye+wlWUGPn/Td8yKywNBw="
     },
     "office-ui-fabric-react": {
-      "version": "5.56.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.56.0.tgz",
-      "integrity": "sha512-sTVFSjqeUDQVGSekeTdSfyn/2BZNGqK0TfHDnpNnsYgrimKv7JsXoiln/yGus+rPkSGONhD5eNZVU02uOBygMw==",
-      "requires": {
-        "@microsoft/load-themed-styles": "1.7.35",
-        "@uifabric/icons": "5.4.2",
-        "@uifabric/merge-styles": "5.12.2",
-        "@uifabric/styling": "5.19.0",
-        "@uifabric/utilities": "5.13.0",
+      "version": "5.69.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.69.0.tgz",
+      "integrity": "sha512-q2JhTQeHE2DItbCZwLE6wfGxTeywOVfVZsSZuOvZWhoEaRmawzsybF2GBbkpYM5VVoipNJzlSiUJfOeui+/4bQ==",
+      "requires": {
+        "@microsoft/load-themed-styles": "1.7.45",
+        "@uifabric/icons": "5.6.0",
+        "@uifabric/merge-styles": "5.13.0",
+        "@uifabric/styling": "5.20.0",
+        "@uifabric/utilities": "5.20.0",
         "prop-types": "15.6.1",
         "tslib": "1.9.0"
       }
@@ -9253,6 +10426,63 @@
         }
       }
     },
+    "ora": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/ora/-/ora-0.2.3.tgz",
+      "integrity": "sha1-N1J9Igrc1Tw5tzVx11QVbV22V6Q=",
+      "requires": {
+        "chalk": "1.1.3",
+        "cli-cursor": "1.0.2",
+        "cli-spinners": "0.1.2",
+        "object-assign": "4.1.1"
+      },
+      "dependencies": {
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4="
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "requires": {
+            "ansi-styles": "2.2.1",
+            "escape-string-regexp": "1.0.5",
+            "has-ansi": "2.0.0",
+            "strip-ansi": "3.0.1",
+            "supports-color": "2.0.0"
+          }
+        },
+        "cli-cursor": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-1.0.2.tgz",
+          "integrity": "sha1-ZNo/fValRBLll5S9Ytw1KV6PKYc=",
+          "requires": {
+            "restore-cursor": "1.0.1"
+          }
+        },
+        "onetime": {
+          "version": "1.1.0",
+          "resolved": "http://registry.npmjs.org/onetime/-/onetime-1.1.0.tgz",
+          "integrity": "sha1-ofeDj4MUxRbwXs78vEzP4EtO14k="
+        },
+        "restore-cursor": {
+          "version": "1.0.1",
+          "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-1.0.1.tgz",
+          "integrity": "sha1-NGYfRohjJ/7SmRR5FSJS35LapUE=",
+          "requires": {
+            "exit-hook": "1.1.1",
+            "onetime": "1.1.0"
+          }
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
+        }
+      }
+    },
     "original": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/original/-/original-1.0.0.tgz",
@@ -9311,11 +10541,29 @@
       "resolved": "https://registry.npmjs.org/p-cancelable/-/p-cancelable-0.3.0.tgz",
       "integrity": "sha512-RVbZPLso8+jFeq1MfNvgXtCRED2raz/dKpacfTNxsx6pLEpEomM7gah6VeHSYV3+vo0OAi4MkArtQcWWXuQoyw=="
     },
+    "p-each-series": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/p-each-series/-/p-each-series-1.0.0.tgz",
+      "integrity": "sha1-kw89Et0fUOdDRFeiLNbwSsatf3E=",
+      "requires": {
+        "p-reduce": "1.0.0"
+      }
+    },
     "p-finally": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/p-finally/-/p-finally-1.0.0.tgz",
       "integrity": "sha1-P7z7FbiZpEEjs0ttzBi3JDNqLK4="
     },
+    "p-is-promise": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/p-is-promise/-/p-is-promise-1.1.0.tgz",
+      "integrity": "sha1-nJRWmJ6fZYgBewQ01WCXZ1w9oF4="
+    },
+    "p-lazy": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/p-lazy/-/p-lazy-1.0.0.tgz",
+      "integrity": "sha1-7FPIAvLuOsKPFmzILQsrAt4nqDU="
+    },
     "p-limit": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-1.2.0.tgz",
@@ -9337,6 +10585,19 @@
       "resolved": "https://registry.npmjs.org/p-map/-/p-map-1.2.0.tgz",
       "integrity": "sha512-r6zKACMNhjPJMTl8KcFH4li//gkrXWfbD6feV8l6doRHlzljFWGJ2AP6iKaCJXyZmAUMOPtvbW7EXkbWO/pLEA=="
     },
+    "p-reduce": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/p-reduce/-/p-reduce-1.0.0.tgz",
+      "integrity": "sha1-GMKw3ZNqRpClKfgjH1ig/bakffo="
+    },
+    "p-timeout": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/p-timeout/-/p-timeout-2.0.1.tgz",
+      "integrity": "sha512-88em58dDVB/KzPEx1X0N3LwFfYZPyDc4B6eF38M1rk9VTZMbxXXgjugz8mmwpS9Ox4BDZ+t6t3QP5+/gazweIA==",
+      "requires": {
+        "p-finally": "1.0.0"
+      }
+    },
     "p-try": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/p-try/-/p-try-1.0.0.tgz",
@@ -9354,7 +10615,7 @@
       "requires": {
         "cyclist": "0.2.2",
         "inherits": "2.0.3",
-        "readable-stream": "2.3.4"
+        "readable-stream": "2.3.5"
       }
     },
     "param-case": {
@@ -9396,6 +10657,11 @@
         "error-ex": "1.3.1"
       }
     },
+    "parse-passwd": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/parse-passwd/-/parse-passwd-1.0.0.tgz",
+      "integrity": "sha1-bVuTSkVpk7I9N/QKOC1vFmao5cY="
+    },
     "parse5": {
       "version": "1.5.1",
       "resolved": "https://registry.npmjs.org/parse5/-/parse5-1.5.1.tgz",
@@ -9475,7 +10741,7 @@
         "create-hmac": "1.1.6",
         "ripemd160": "2.0.1",
         "safe-buffer": "5.1.1",
-        "sha.js": "2.4.10"
+        "sha.js": "2.4.11"
       }
     },
     "performance-now": {
@@ -9532,13 +10798,13 @@
       "integrity": "sha1-AerA/jta9xoqbAL+q7jB/vfgDqs="
     },
     "postcss": {
-      "version": "6.0.19",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.19.tgz",
-      "integrity": "sha512-f13HRz0HtVwVaEuW6J6cOUCBLFtymhgyLPV7t4QEk2UD3twRI9IluDcQNdzQdBpiixkXj2OmzejhhTbSbDxNTg==",
+      "version": "6.0.21",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.21.tgz",
+      "integrity": "sha512-y/bKfbQz2Nn/QBC08bwvYUxEFOVGfPIUOTsJ2CK5inzlXW9SdYR1x4pEsG9blRAF/PX+wRNdOah+gx/hv4q7dw==",
       "requires": {
-        "chalk": "2.3.1",
+        "chalk": "2.3.2",
         "source-map": "0.6.1",
-        "supports-color": "5.2.0"
+        "supports-color": "5.3.0"
       }
     },
     "postcss-calc": {
@@ -10120,7 +11386,7 @@
       "resolved": "https://registry.npmjs.org/postcss-flexbugs-fixes/-/postcss-flexbugs-fixes-3.3.0.tgz",
       "integrity": "sha512-15JauG6a2hu2XZHdB9BaOwCLrI9oyK2UB8kt1ToTGdP1Pd3BQ/TJI9tNiTALntll25/66xMLUIyUPA9w/3BLtg==",
       "requires": {
-        "postcss": "6.0.19"
+        "postcss": "6.0.21"
       }
     },
     "postcss-load-config": {
@@ -10153,12 +11419,12 @@
       }
     },
     "postcss-loader": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-2.1.1.tgz",
-      "integrity": "sha512-f0J/DWE/hyO9/LH0WHpXkny/ZZ238sSaG3p1SRBtVZnFWUtD7GXIEgHoBg8cnAeRbmEvUxHQptY46zWfwNYj/w==",
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/postcss-loader/-/postcss-loader-2.1.3.tgz",
+      "integrity": "sha512-RuBcNE8rjCkIB0IsbmkGFRmQJTeQJfCI88E0VTarPNTvaNSv9OFv1DvTwgtAN/qlzyiELsmmmtX/tEzKp/cdug==",
       "requires": {
         "loader-utils": "1.1.0",
-        "postcss": "6.0.19",
+        "postcss": "6.0.21",
         "postcss-load-config": "1.2.0",
         "schema-utils": "0.4.5"
       }
@@ -10313,8 +11579,8 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000810",
-            "electron-to-chromium": "1.3.34"
+            "caniuse-db": "1.0.30000819",
+            "electron-to-chromium": "1.3.40"
           }
         },
         "chalk": {
@@ -10640,7 +11906,7 @@
       "requires": {
         "css-modules-loader-core": "1.1.0",
         "generic-names": "1.0.3",
-        "postcss": "6.0.19",
+        "postcss": "6.0.21",
         "string-hash": "1.1.3"
       }
     },
@@ -10649,7 +11915,7 @@
       "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-1.2.0.tgz",
       "integrity": "sha1-ZhQOzs447wa/DT41XWm/WdFB6oU=",
       "requires": {
-        "postcss": "6.0.19"
+        "postcss": "6.0.21"
       }
     },
     "postcss-modules-local-by-default": {
@@ -10658,7 +11924,7 @@
       "integrity": "sha1-99gMOYxaOT+nlkRmvRlQCn1hwGk=",
       "requires": {
         "css-selector-tokenizer": "0.7.0",
-        "postcss": "6.0.19"
+        "postcss": "6.0.21"
       }
     },
     "postcss-modules-scope": {
@@ -10667,7 +11933,7 @@
       "integrity": "sha1-1upkmUx5+XtipytCb75gVqGUu5A=",
       "requires": {
         "css-selector-tokenizer": "0.7.0",
-        "postcss": "6.0.19"
+        "postcss": "6.0.21"
       }
     },
     "postcss-modules-values": {
@@ -10676,7 +11942,7 @@
       "integrity": "sha1-7P+p1+GSUYOJ9CrQ6D9yrsRW6iA=",
       "requires": {
         "icss-replace-symbols": "1.1.0",
-        "postcss": "6.0.19"
+        "postcss": "6.0.21"
       }
     },
     "postcss-normalize-charset": {
@@ -11290,6 +12556,16 @@
       "resolved": "https://registry.npmjs.org/preserve/-/preserve-0.2.0.tgz",
       "integrity": "sha1-gV7R9uvGWSb4ZbMQwHE7yzMVzks="
     },
+    "prettier": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-1.11.1.tgz",
+      "integrity": "sha512-T/KD65Ot0PB97xTrG8afQ46x3oiVhnfGjGESSI9NWYcG92+OUPZKkwHqGWXH2t9jK1crnQjubECW0FuOth+hxw=="
+    },
+    "pretty-bytes": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/pretty-bytes/-/pretty-bytes-4.0.2.tgz",
+      "integrity": "sha1-sr+C5zUNZcbDOqlaqlpPYyf2HNk="
+    },
     "pretty-error": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/pretty-error/-/pretty-error-2.1.1.tgz",
@@ -11305,7 +12581,7 @@
       "integrity": "sha512-ZdWPGYAnYfcVP8yKA3zFjCn8s4/17TeYH28MXuC8vTp0o21eXjbFGcOAXZEaDaOFJjc3h2qa7HQNHNshhvoh2A==",
       "requires": {
         "ansi-regex": "3.0.0",
-        "ansi-styles": "3.2.0"
+        "ansi-styles": "3.2.1"
       },
       "dependencies": {
         "ansi-regex": {
@@ -11328,7 +12604,7 @@
           "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.1.0.tgz",
           "integrity": "sha512-LUHGS/dge4ujbXMJrnihYMcL4AoOweGnw9Tp3kQuqy1Kx5c1qKjqvMJZ6nVJPMWJtKCTN72ZogH3oeSO9g9rXQ==",
           "requires": {
-            "ansi-styles": "3.2.0",
+            "ansi-styles": "3.2.1",
             "escape-string-regexp": "1.0.5",
             "supports-color": "4.5.0"
           }
@@ -11382,7 +12658,7 @@
       "integrity": "sha512-7p/K2f6dI+dM8yjRQEGrTQs5hTQixUAdOGpMEA3+pVxpX5oHKRSKAXyLw9Q9HUWDTdwtoo39dSHGQtN90HcEwQ==",
       "requires": {
         "define-properties": "1.1.2",
-        "es-abstract": "1.10.0",
+        "es-abstract": "1.11.0",
         "function-bind": "1.1.1"
       }
     },
@@ -11441,7 +12717,7 @@
       "resolved": "https://registry.npmjs.org/pumpify/-/pumpify-1.4.0.tgz",
       "integrity": "sha512-2kmNR9ry+Pf45opRVirpNuIFotsxUGLaYqxIwuR77AYrYRMuFCz9eryHBS52L360O+NcR383CL4QYlMKPq4zYA==",
       "requires": {
-        "duplexify": "3.5.3",
+        "duplexify": "3.5.4",
         "inherits": "2.0.3",
         "pump": "2.0.1"
       }
@@ -11501,7 +12777,7 @@
           "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-2.0.5.tgz",
           "integrity": "sha1-wVPH6I/YT+9cYC6VqBaLJ3BnH+c=",
           "requires": {
-            "bowser": "1.9.2",
+            "bowser": "1.9.3",
             "hyphenate-style-name": "1.0.2"
           }
         }
@@ -11605,16 +12881,46 @@
         "async": "2.6.0",
         "babel-runtime": "6.26.0",
         "babylon": "5.8.38",
-        "commander": "2.14.1",
+        "commander": "2.15.1",
         "doctrine": "2.1.0",
         "node-dir": "0.1.17",
         "recast": "0.12.9"
       },
       "dependencies": {
+        "ast-types": {
+          "version": "0.10.1",
+          "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.10.1.tgz",
+          "integrity": "sha512-UY7+9DPzlJ9VM8eY0b2TUZcZvF+1pO0hzMtAyjBYKhOmnvRlqYNYnWdtsMj0V16CGaMlpL0G1jnLbLo4AyotuQ=="
+        },
         "babylon": {
           "version": "5.8.38",
           "resolved": "https://registry.npmjs.org/babylon/-/babylon-5.8.38.tgz",
           "integrity": "sha1-7JsSCxG/bM1Bc6GL8hfmC3mFn/0="
+        },
+        "esprima": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.0.tgz",
+          "integrity": "sha512-oftTcaMu/EGrEIu904mWteKIv8vMuOgGYo7EhVJJN00R/EED9DCua/xxHRdYnKtcECzVg7xOWhflvJMnqcFZjw=="
+        },
+        "node-dir": {
+          "version": "0.1.17",
+          "resolved": "https://registry.npmjs.org/node-dir/-/node-dir-0.1.17.tgz",
+          "integrity": "sha1-X1Zl2TNRM1yqvvjxxVRRbPXx5OU=",
+          "requires": {
+            "minimatch": "3.0.4"
+          }
+        },
+        "recast": {
+          "version": "0.12.9",
+          "resolved": "https://registry.npmjs.org/recast/-/recast-0.12.9.tgz",
+          "integrity": "sha512-y7ANxCWmMW8xLOaiopiRDlyjQ9ajKRENBH+2wjntIbk3A6ZR1+BLQttkmSHMY7Arl+AAZFwJ10grg2T6f1WI8A==",
+          "requires": {
+            "ast-types": "0.10.1",
+            "core-js": "2.5.3",
+            "esprima": "4.0.0",
+            "private": "0.1.8",
+            "source-map": "0.6.1"
+          }
         }
       }
     },
@@ -11706,9 +13012,9 @@
       }
     },
     "react-modal": {
-      "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.3.1.tgz",
-      "integrity": "sha512-d1A8xXIvW+YVKwRMrFY5qneuC5FSa4OnOE78hgqfz+MYLb1Ai/B3D3Dzx1Zrw4ZD5rS16SKiPe5rl4UZt+AjpQ==",
+      "version": "3.3.2",
+      "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.3.2.tgz",
+      "integrity": "sha512-DLrmPG9PyXWSNA2ve1LttnNRE9Umy3u3awFeK+72dLOksLM+EoTg8Z2h/i/DV3O8ZGvnEhacjAVXdZuRDGvaag==",
       "requires": {
         "exenv": "1.2.2",
         "prop-types": "15.6.1",
@@ -11741,13 +13047,13 @@
       "requires": {
         "inline-style-prefixer": "3.0.8",
         "prop-types": "15.6.1",
-        "react-style-proptype": "3.2.0"
+        "react-style-proptype": "3.2.1"
       }
     },
     "react-style-proptype": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/react-style-proptype/-/react-style-proptype-3.2.0.tgz",
-      "integrity": "sha512-Mafmkzj3oNmLSJNOlH+WWWyGIdzVLhPj+d12fDxQMQdwDQ5sMX7vQKOLpry4U+zRWieTCx448AyRKK0NLWuXmg==",
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/react-style-proptype/-/react-style-proptype-3.2.1.tgz",
+      "integrity": "sha512-Z02QsgmdZ4wYNxJsHhNGGZsIF8+MO93fYmdPaC+ljdqX3rq8tl/fSMXOGBbofGJNzq5W/2LFcONllmV6vzyYHA==",
       "requires": {
         "prop-types": "15.6.1"
       }
@@ -11787,6 +13093,15 @@
         "velocity-react": "1.3.3"
       }
     },
+    "read-chunk": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/read-chunk/-/read-chunk-2.1.0.tgz",
+      "integrity": "sha1-agTAkoAF7Z1C4aasVgDhnLx/9lU=",
+      "requires": {
+        "pify": "3.0.0",
+        "safe-buffer": "5.1.1"
+      }
+    },
     "read-pkg": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-2.0.0.tgz",
@@ -11807,9 +13122,9 @@
       }
     },
     "readable-stream": {
-      "version": "2.3.4",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.4.tgz",
-      "integrity": "sha512-vuYxeWYM+fde14+rajzqgeohAI7YoJcHE7kXDAc4Nk0EbuKnJfqtY9YtRkLo/tqkuF7MsBQRhPnPeyjYITp3ZQ==",
+      "version": "2.3.5",
+      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.5.tgz",
+      "integrity": "sha512-tK0yDhrkygt/knjowCUiWP9YdV7c5R+8cR0r/kt9ZhBU906Fs6RpQJCEilamRJj1Nx2rWI6LkW9gKqjTkshhEw==",
       "requires": {
         "core-util-is": "1.0.2",
         "inherits": "2.0.3",
@@ -11827,17 +13142,16 @@
       "requires": {
         "graceful-fs": "4.1.11",
         "minimatch": "3.0.4",
-        "readable-stream": "2.3.4",
+        "readable-stream": "2.3.5",
         "set-immediate-shim": "1.0.1"
       }
     },
     "recast": {
-      "version": "0.12.9",
-      "resolved": "https://registry.npmjs.org/recast/-/recast-0.12.9.tgz",
-      "integrity": "sha512-y7ANxCWmMW8xLOaiopiRDlyjQ9ajKRENBH+2wjntIbk3A6ZR1+BLQttkmSHMY7Arl+AAZFwJ10grg2T6f1WI8A==",
+      "version": "0.14.7",
+      "resolved": "https://registry.npmjs.org/recast/-/recast-0.14.7.tgz",
+      "integrity": "sha512-/nwm9pkrcWagN40JeJhkPaRxiHXBRkXyRh/hgU088Z/v+qCy+zIHHY6bC6o7NaKAxPqtE6nD8zBH1LfU0/Wx6A==",
       "requires": {
-        "ast-types": "0.10.1",
-        "core-js": "2.5.3",
+        "ast-types": "0.11.3",
         "esprima": "4.0.0",
         "private": "0.1.8",
         "source-map": "0.6.1"
@@ -11855,7 +13169,7 @@
       "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz",
       "integrity": "sha1-hSBLVNuoLVdC4oyWdW70OvUOM4Q=",
       "requires": {
-        "resolve": "1.5.0"
+        "resolve": "1.6.0"
       }
     },
     "redent": {
@@ -11905,9 +13219,16 @@
       "integrity": "sha512-pNqnf9q1hI5HHZRBkj3bAngGZW/JMCmexDlOxw4XagXY2o1327nHH54LoTjiPJ0gizoqPDRqWyX/00g0hD6w+A==",
       "requires": {
         "lodash": "4.15.0",
-        "lodash-es": "4.17.5",
+        "lodash-es": "4.17.7",
         "loose-envify": "1.3.1",
         "symbol-observable": "1.2.0"
+      },
+      "dependencies": {
+        "symbol-observable": {
+          "version": "1.2.0",
+          "resolved": "https://registry.npmjs.org/symbol-observable/-/symbol-observable-1.2.0.tgz",
+          "integrity": "sha512-e900nM8RRtGhlV36KGEU9k65K3mPb1WV70OdjfxlG2EAuM1noi/E/BaW/uMhL7bPEssK8QV57vN3esixjUvcXQ=="
+        }
       }
     },
     "regenerate": {
@@ -12090,10 +13411,15 @@
         "is-finite": "1.0.2"
       }
     },
+    "replace-ext": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-0.0.1.tgz",
+      "integrity": "sha1-KbvZIHinOfC8zitO5B6DeVNSKSQ="
+    },
     "request": {
-      "version": "2.83.0",
-      "resolved": "https://registry.npmjs.org/request/-/request-2.83.0.tgz",
-      "integrity": "sha512-lR3gD69osqm6EYLk9wB/G1W/laGWjzH90t1vEa2xuxHD5KUrSzp9pUSfTm+YC5Nxt2T8nMPEvKlhbQayU7bgFw==",
+      "version": "2.85.0",
+      "resolved": "https://registry.npmjs.org/request/-/request-2.85.0.tgz",
+      "integrity": "sha512-8H7Ehijd4js+s6wuVPLjwORxD4zeuyjYugprdOXlPSqaApmL/QOy+EB/beICHVCHkGMKNh5rvihb5ov+IDw4mg==",
       "requires": {
         "aws-sign2": "0.7.0",
         "aws4": "1.6.0",
@@ -12144,7 +13470,7 @@
       "requires": {
         "extend": "3.0.1",
         "lodash": "4.15.0",
-        "request": "2.83.0",
+        "request": "2.85.0",
         "when": "3.7.8"
       }
     },
@@ -12174,9 +13500,9 @@
       "integrity": "sha512-o4sxCTSwTxx5hBFXYn5rsgMuLQT8kufJ5vzKYcRwWhCWERKN4dqZwiMx7+nRrcXouWmiFGD9A486yS4Z1a2PQQ=="
     },
     "resolve": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.5.0.tgz",
-      "integrity": "sha512-hgoSGrc3pjzAPHNBg+KnFcK2HwlHTs/YrAGUr6qgTVUZmXv1UEXXl0bZNBKMA9fud6lRYFdPGz0xXxycPzmmiw==",
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.6.0.tgz",
+      "integrity": "sha512-mw7JQNu5ExIkcw4LPih0owX/TZXjD/ZUF/ZQ/pDnkw3ZKhDcZZw5klmBlj6gVMwjQ3Pz5Jgu7F3d0jcDVuEWdw==",
       "requires": {
         "path-parse": "1.0.5"
       }
@@ -12189,6 +13515,15 @@
         "resolve-from": "3.0.0"
       }
     },
+    "resolve-dir": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/resolve-dir/-/resolve-dir-1.0.1.tgz",
+      "integrity": "sha1-eaQGRMNivoLybv/nOcm7U4IEb0M=",
+      "requires": {
+        "expand-tilde": "2.0.2",
+        "global-modules": "1.0.0"
+      }
+    },
     "resolve-from": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-3.0.0.tgz",
@@ -12199,6 +13534,14 @@
       "resolved": "https://registry.npmjs.org/resolve-url/-/resolve-url-0.2.1.tgz",
       "integrity": "sha1-LGN/53yJOv0qZj/iGqkIAGjiBSo="
     },
+    "responselike": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/responselike/-/responselike-1.0.2.tgz",
+      "integrity": "sha1-kYcg7ztjHFZCvgaPFa3lpG9Loec=",
+      "requires": {
+        "lowercase-keys": "1.0.1"
+      }
+    },
     "restore-cursor": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-2.0.0.tgz",
@@ -12244,7 +13587,7 @@
       "integrity": "sha1-gbIw6i/MYGbInjRy3nlChdmwPZE=",
       "requires": {
         "lodash.flattendeep": "4.4.0",
-        "nearley": "2.11.1"
+        "nearley": "2.13.0"
       }
     },
     "run-async": {
@@ -12268,6 +13611,27 @@
       "resolved": "https://registry.npmjs.org/rx/-/rx-4.1.0.tgz",
       "integrity": "sha1-pfE/957zt0D+MKqAP7CfmIBdR4I="
     },
+    "rx-lite": {
+      "version": "4.0.8",
+      "resolved": "https://registry.npmjs.org/rx-lite/-/rx-lite-4.0.8.tgz",
+      "integrity": "sha1-Cx4Rr4vESDbwSmQH6S2kJGe3lEQ="
+    },
+    "rx-lite-aggregates": {
+      "version": "4.0.8",
+      "resolved": "https://registry.npmjs.org/rx-lite-aggregates/-/rx-lite-aggregates-4.0.8.tgz",
+      "integrity": "sha1-dTuHqJoRyVRnxKwWJsTvxOBcZ74=",
+      "requires": {
+        "rx-lite": "4.0.8"
+      }
+    },
+    "rxjs": {
+      "version": "5.5.7",
+      "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-5.5.7.tgz",
+      "integrity": "sha512-Hxo2ac8gRQjwjtKgukMIwBRbq5+KAeEV5hXM4obYBOAghev41bDQWgFH4svYiU9UnQ5kNww2LgfyBdevCd2HXA==",
+      "requires": {
+        "symbol-observable": "1.0.1"
+      }
+    },
     "safe-buffer": {
       "version": "5.1.1",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.1.tgz",
@@ -12287,19 +13651,28 @@
       "integrity": "sha512-1HwIYD/8UlOtFS3QO3w7ey+SdSDFE4HRNLZoZRYVQefrOY3l17epswImeB1ijgJFQJodIaHcwkp3r/myBjFVbg=="
     },
     "sane": {
-      "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/sane/-/sane-2.4.1.tgz",
-      "integrity": "sha512-fW9svvNd81XzHDZyis9/tEY1bZikDGryy8Hi1BErPyNPYv47CdLseUN+tI5FBHWXEENRtj1SWtX/jBnggLaP0w==",
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/sane/-/sane-2.5.0.tgz",
+      "integrity": "sha512-glfKd7YH4UCrh/7dD+UESsr8ylKWRE7UQPoXuz28FgmcF0ViJQhCTCCZHICRKxf8G8O1KdLEn20dcICK54c7ew==",
       "requires": {
-        "anymatch": "1.3.2",
+        "anymatch": "2.0.0",
         "exec-sh": "0.2.1",
         "fb-watchman": "2.0.0",
-        "minimatch": "3.0.4",
+        "micromatch": "3.1.10",
         "minimist": "1.2.0",
         "walker": "1.0.7",
         "watch": "0.18.0"
       },
       "dependencies": {
+        "anymatch": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-2.0.0.tgz",
+          "integrity": "sha512-5teOsQWABXHHBFP9y3skS5P3d/WfWXpv3FUpy+LorMrNYaT9pI4oLMQX7jzQ2KklNpGpWHzdCXTDT2Y3XGlZBw==",
+          "requires": {
+            "micromatch": "3.1.10",
+            "normalize-path": "2.1.1"
+          }
+        },
         "minimist": {
           "version": "1.2.0",
           "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
@@ -12456,14 +13829,14 @@
       }
     },
     "sass-loader": {
-      "version": "6.0.6",
-      "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-6.0.6.tgz",
-      "integrity": "sha512-c3/Zc+iW+qqDip6kXPYLEgsAu2lf4xz0EZDplB7EmSUMda12U1sGJPetH55B/j9eu0bTtKzKlNPWWyYC7wFNyQ==",
+      "version": "6.0.7",
+      "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-6.0.7.tgz",
+      "integrity": "sha512-JoiyD00Yo1o61OJsoP2s2kb19L1/Y2p3QFcCdWdF6oomBGKVYuZyqHWemRBfQ2uGYsk+CH3eCguXNfpjzlcpaA==",
       "requires": {
-        "async": "2.6.0",
-        "clone-deep": "0.3.0",
+        "clone-deep": "2.0.2",
         "loader-utils": "1.1.0",
         "lodash.tail": "4.1.1",
+        "neo-async": "2.5.0",
         "pify": "3.0.0"
       }
     },
@@ -12477,14 +13850,14 @@
       "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-0.4.5.tgz",
       "integrity": "sha512-yYrjb9TX2k/J1Y5UNy3KYdZq10xhYcF8nMpAW6o3hy6Q8WSIEf9lJHG/ePnOBfziPM3fvQwfOwa13U/Fh8qTfA==",
       "requires": {
-        "ajv": "6.2.0",
+        "ajv": "6.3.0",
         "ajv-keywords": "3.1.0"
       },
       "dependencies": {
         "ajv": {
-          "version": "6.2.0",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.2.0.tgz",
-          "integrity": "sha1-r6wpW7qgFSRJ5SJ0LkVHwa6TKNI=",
+          "version": "6.3.0",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.3.0.tgz",
+          "integrity": "sha1-FlCkERTvAFdMrBC4Ay2PTBSBLac=",
           "requires": {
             "fast-deep-equal": "1.1.0",
             "fast-json-stable-stringify": "2.0.0",
@@ -12493,6 +13866,11 @@
         }
       }
     },
+    "scoped-regex": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/scoped-regex/-/scoped-regex-1.0.0.tgz",
+      "integrity": "sha1-o0a7Gs1CB65wvXwMfKnlZra63bg="
+    },
     "screener-runner": {
       "version": "0.6.19",
       "resolved": "https://registry.npmjs.org/screener-runner/-/screener-runner-0.6.19.tgz",
@@ -12572,10 +13950,10 @@
         },
         "compression": {
           "version": "1.6.2",
-          "resolved": "https://registry.npmjs.org/compression/-/compression-1.6.2.tgz",
+          "resolved": "http://registry.npmjs.org/compression/-/compression-1.6.2.tgz",
           "integrity": "sha1-zOsSHsydCcUtetDDNQ6pPd1AK8M=",
           "requires": {
-            "accepts": "1.3.4",
+            "accepts": "1.3.5",
             "bytes": "2.3.0",
             "compressible": "2.0.13",
             "debug": "2.2.0",
@@ -12643,7 +14021,7 @@
           "requires": {
             "assert-plus": "0.2.0",
             "jsprim": "1.4.1",
-            "sshpk": "1.13.1"
+            "sshpk": "1.14.1"
           }
         },
         "lodash": {
@@ -12714,9 +14092,9 @@
       }
     },
     "screener-storybook": {
-      "version": "0.11.3",
-      "resolved": "https://registry.npmjs.org/screener-storybook/-/screener-storybook-0.11.3.tgz",
-      "integrity": "sha1-21arkALnjhJOUsvPk7TlettPjLY=",
+      "version": "0.11.5",
+      "resolved": "https://registry.npmjs.org/screener-storybook/-/screener-storybook-0.11.5.tgz",
+      "integrity": "sha1-AeT31Pjt8qMwxMysVPxj4Y/zGEM=",
       "requires": {
         "bluebird": "3.4.7",
         "colors": "1.1.2",
@@ -12817,10 +14195,10 @@
         },
         "compression": {
           "version": "1.6.2",
-          "resolved": "https://registry.npmjs.org/compression/-/compression-1.6.2.tgz",
+          "resolved": "http://registry.npmjs.org/compression/-/compression-1.6.2.tgz",
           "integrity": "sha1-zOsSHsydCcUtetDDNQ6pPd1AK8M=",
           "requires": {
-            "accepts": "1.3.4",
+            "accepts": "1.3.5",
             "bytes": "2.3.0",
             "compressible": "2.0.13",
             "debug": "2.2.0",
@@ -12893,7 +14271,7 @@
           "requires": {
             "assert-plus": "0.2.0",
             "jsprim": "1.4.1",
-            "sshpk": "1.13.1"
+            "sshpk": "1.14.1"
           }
         },
         "joi": {
@@ -12922,7 +14300,7 @@
             "escodegen": "1.9.1",
             "html-encoding-sniffer": "1.0.2",
             "iconv-lite": "0.4.19",
-            "nwmatcher": "1.4.3",
+            "nwmatcher": "1.4.4",
             "parse5": "1.5.1",
             "request": "2.81.0",
             "sax": "1.2.4",
@@ -13064,7 +14442,7 @@
                 "hoek": "4.2.1",
                 "isemail": "2.2.1",
                 "items": "2.1.1",
-                "moment": "2.20.1",
+                "moment": "2.21.0",
                 "topo": "2.0.2"
               }
             },
@@ -13186,9 +14564,9 @@
       "integrity": "sha512-4SJ3dm0WAwWy/NVeioZh5AntkdJoWKxHxcmyP622fOkgHa4z3R0TdBJICINyaSDE6uNwVc8gZr+ZinwZAH4xIA=="
     },
     "send": {
-      "version": "0.16.1",
-      "resolved": "https://registry.npmjs.org/send/-/send-0.16.1.tgz",
-      "integrity": "sha512-ElCLJdJIKPk6ux/Hocwhk7NFHpI3pVm/IZOYWqUmoxcgeyM+MpxHHKhb8QmlJDX1pU6WrgaHBkVNm73Sv7uc2A==",
+      "version": "0.16.2",
+      "resolved": "https://registry.npmjs.org/send/-/send-0.16.2.tgz",
+      "integrity": "sha512-E64YFPUssFHEFBvpbbjr44NCLtI1AohxQ8ZSiJjQLskAdKuriYEP6VyGEsRDH8ScozGpkaX1BGvhanqCwkcEZw==",
       "requires": {
         "debug": "2.6.9",
         "depd": "1.1.2",
@@ -13202,7 +14580,7 @@
         "ms": "2.0.0",
         "on-finished": "2.3.0",
         "range-parser": "1.2.0",
-        "statuses": "1.3.1"
+        "statuses": "1.4.0"
       },
       "dependencies": {
         "mime": {
@@ -13234,7 +14612,7 @@
       "resolved": "https://registry.npmjs.org/serve-index/-/serve-index-1.9.1.tgz",
       "integrity": "sha1-03aNabHn2C5c4FD/9bRTvqEqkjk=",
       "requires": {
-        "accepts": "1.3.4",
+        "accepts": "1.3.5",
         "batch": "0.6.1",
         "debug": "2.6.9",
         "escape-html": "1.0.3",
@@ -13244,14 +14622,14 @@
       }
     },
     "serve-static": {
-      "version": "1.13.1",
-      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.13.1.tgz",
-      "integrity": "sha512-hSMUZrsPa/I09VYFJwa627JJkNs0NrfL1Uzuup+GqHfToR2KcsXFymXSV90hoyw3M+msjFuQly+YzIH/q0MGlQ==",
+      "version": "1.13.2",
+      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.13.2.tgz",
+      "integrity": "sha512-p/tdJrO4U387R9oMjb1oj7qSMaMfmOyd4j9hOFoxZe2baQszgHcSWjuya/CiT5kgZZKRudHNOA0pYXOl8rQ5nw==",
       "requires": {
         "encodeurl": "1.0.2",
         "escape-html": "1.0.3",
         "parseurl": "1.3.2",
-        "send": "0.16.1"
+        "send": "0.16.2"
       }
     },
     "set-blocking": {
@@ -13259,14 +14637,6 @@
       "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
       "integrity": "sha1-BF+XgtARrppoA93TgrJDkrPYkPc="
     },
-    "set-getter": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/set-getter/-/set-getter-0.1.0.tgz",
-      "integrity": "sha1-12nBgsnVpR9AkUXy+6guXoboA3Y=",
-      "requires": {
-        "to-object-path": "0.3.0"
-      }
-    },
     "set-immediate-shim": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/set-immediate-shim/-/set-immediate-shim-1.0.1.tgz",
@@ -13304,37 +14674,28 @@
       "integrity": "sha512-BvE/TwpZX4FXExxOxZyRGQQv651MSwmWKZGqvmPcRIjDqWub67kTKuIMx43cZZrS/cBBzwBcNDWoFxt2XEFIpQ=="
     },
     "sha.js": {
-      "version": "2.4.10",
-      "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.10.tgz",
-      "integrity": "sha512-vnwmrFDlOExK4Nm16J2KMWHLrp14lBrjxMxBJpu++EnsuBmpiYaM/MEs46Vxxm/4FvdP5yTwuCTO9it5FSjrqA==",
+      "version": "2.4.11",
+      "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.11.tgz",
+      "integrity": "sha512-QMEp5B7cftE7APOjk5Y6xgrbWu+WkLVQwk8JNjZ8nKRciZaByEW6MubieAiToS7+dwvrjGhH8jRXz3MVd0AYqQ==",
       "requires": {
         "inherits": "2.0.3",
         "safe-buffer": "5.1.1"
       }
     },
     "shallow-clone": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/shallow-clone/-/shallow-clone-0.1.2.tgz",
-      "integrity": "sha1-WQnodLp3EG1zrEFM/sH/yofZcGA=",
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/shallow-clone/-/shallow-clone-1.0.0.tgz",
+      "integrity": "sha512-oeXreoKR/SyNJtRJMAKPDSvd28OqEwG4eR/xc856cRGBII7gX9lvAqDxusPm0846z/w/hWYjI1NpKwJ00NHzRA==",
       "requires": {
         "is-extendable": "0.1.1",
-        "kind-of": "2.0.1",
-        "lazy-cache": "0.2.7",
+        "kind-of": "5.1.0",
         "mixin-object": "2.0.1"
       },
       "dependencies": {
         "kind-of": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-2.0.1.tgz",
-          "integrity": "sha1-AY7HpM5+OobLkUG+UZ0kyPqpgbU=",
-          "requires": {
-            "is-buffer": "1.1.6"
-          }
-        },
-        "lazy-cache": {
-          "version": "0.2.7",
-          "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-0.2.7.tgz",
-          "integrity": "sha1-f+3fLctu23fRHvHRF6tf/fCrG2U="
+          "version": "5.1.0",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
+          "integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw=="
         }
       }
     },
@@ -13371,9 +14732,9 @@
       }
     },
     "shelljs": {
-      "version": "0.7.8",
-      "resolved": "https://registry.npmjs.org/shelljs/-/shelljs-0.7.8.tgz",
-      "integrity": "sha1-3svPh0sNHl+3LhSxZKloMEjprLM=",
+      "version": "0.8.1",
+      "resolved": "https://registry.npmjs.org/shelljs/-/shelljs-0.8.1.tgz",
+      "integrity": "sha512-YA/iYtZpzFe5HyWVGrb02FjPxc4EMCfpoU/Phg9fQoyMC72u9598OUBrsU8IrtwAKG0tO8IYaqbaLIw+k3IRGA==",
       "requires": {
         "glob": "7.1.2",
         "interpret": "1.1.0",
@@ -13391,16 +14752,16 @@
       "integrity": "sha1-tf3AjxKH6hF4Yo5BXiUTK3NkbG0="
     },
     "sinon": {
-      "version": "4.4.2",
-      "resolved": "https://registry.npmjs.org/sinon/-/sinon-4.4.2.tgz",
-      "integrity": "sha512-cpOHpnRyY3Dk9dTHBYMfVBB0HUCSKIpxW07X6OGW2NiYPovs4AkcL8Q8MzecbAROjbfRA9esJCmlZgikxDz7DA==",
+      "version": "4.4.8",
+      "resolved": "https://registry.npmjs.org/sinon/-/sinon-4.4.8.tgz",
+      "integrity": "sha512-EWZf/D5BN/BbDFPmwY2abw6wgELVmk361self+lcwEmVw0WWUxURp2S/YoDB2WG/xurFVzKQglMARweYRWM6Hw==",
       "requires": {
         "@sinonjs/formatio": "2.0.0",
-        "diff": "3.4.0",
+        "diff": "3.5.0",
         "lodash.get": "4.4.2",
         "lolex": "2.3.2",
-        "nise": "1.2.7",
-        "supports-color": "5.2.0",
+        "nise": "1.3.2",
+        "supports-color": "5.3.0",
         "type-detect": "4.0.8"
       }
     },
@@ -13409,10 +14770,20 @@
       "resolved": "https://registry.npmjs.org/slash/-/slash-1.0.0.tgz",
       "integrity": "sha1-xB8vbDn8FtHNF61LXYlhFK5HDVU="
     },
+    "slice-ansi": {
+      "version": "0.0.4",
+      "resolved": "https://registry.npmjs.org/slice-ansi/-/slice-ansi-0.0.4.tgz",
+      "integrity": "sha1-7b+JA/ZvfOL46v1s7tZeJkyDGzU="
+    },
+    "slide": {
+      "version": "1.1.6",
+      "resolved": "https://registry.npmjs.org/slide/-/slide-1.1.6.tgz",
+      "integrity": "sha1-VusCfWW00tzmyy4tMsTUr8nh1wc="
+    },
     "snapdragon": {
-      "version": "0.8.1",
-      "resolved": "https://registry.npmjs.org/snapdragon/-/snapdragon-0.8.1.tgz",
-      "integrity": "sha1-4StUh/re0+PeoKyR6UAL91tAE3A=",
+      "version": "0.8.2",
+      "resolved": "https://registry.npmjs.org/snapdragon/-/snapdragon-0.8.2.tgz",
+      "integrity": "sha512-FtyOnWN/wCHTVXOMwvSv26d+ko5vWlIDD6zoUJ7LW8vh+ZBC8QdljveRP+crNrtBwioEUWy/4dMtbBjA4ioNlg==",
       "requires": {
         "base": "0.11.2",
         "debug": "2.6.9",
@@ -13421,7 +14792,7 @@
         "map-cache": "0.2.2",
         "source-map": "0.5.7",
         "source-map-resolve": "0.5.1",
-        "use": "2.0.2"
+        "use": "3.1.0"
       },
       "dependencies": {
         "define-property": {
@@ -13630,9 +15001,9 @@
       }
     },
     "source-map-support": {
-      "version": "0.5.3",
-      "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.3.tgz",
-      "integrity": "sha512-eKkTgWYeBOQqFGXRfKabMFdnWepo51vWqEdoeikaEPFiJC7MCU5j2h4+6Q8npkZTeLGbSyecZvRxiSoWl3rh+w==",
+      "version": "0.5.4",
+      "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.4.tgz",
+      "integrity": "sha512-PETSPG6BjY1AHs2t64vS2aqAgu6dMIMXJULWFBGbh2Gr8nVLbCFDo6i/RMMvviIQ2h1Z8+5gQhVKSn2je9nmdg==",
       "requires": {
         "source-map": "0.6.1"
       }
@@ -13680,21 +15051,21 @@
         "http-deceiver": "1.2.7",
         "safe-buffer": "5.1.1",
         "select-hose": "2.0.0",
-        "spdy-transport": "2.0.20"
+        "spdy-transport": "2.1.0"
       }
     },
     "spdy-transport": {
-      "version": "2.0.20",
-      "resolved": "https://registry.npmjs.org/spdy-transport/-/spdy-transport-2.0.20.tgz",
-      "integrity": "sha1-c15yBUxIayNU/onnAiVgBKOazk0=",
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/spdy-transport/-/spdy-transport-2.1.0.tgz",
+      "integrity": "sha512-bpUeGpZcmZ692rrTiqf9/2EUakI6/kXX1Rpe0ib/DyOzbiexVfXkw6GnvI9hVGvIwVaUhkaBojjCZwLNRGQg1g==",
       "requires": {
         "debug": "2.6.9",
         "detect-node": "2.0.3",
         "hpack.js": "2.1.6",
-        "obuf": "1.1.1",
-        "readable-stream": "2.3.4",
+        "obuf": "1.1.2",
+        "readable-stream": "2.3.5",
         "safe-buffer": "5.1.1",
-        "wbuf": "1.7.2"
+        "wbuf": "1.7.3"
       }
     },
     "split-string": {
@@ -13711,9 +15082,9 @@
       "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw="
     },
     "sshpk": {
-      "version": "1.13.1",
-      "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.13.1.tgz",
-      "integrity": "sha1-US322mKHFEMW3EwY/hzx2UBzm+M=",
+      "version": "1.14.1",
+      "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.14.1.tgz",
+      "integrity": "sha1-Ew9Zde3a2WPx1W+SuaxsUfqfg+s=",
       "requires": {
         "asn1": "0.2.3",
         "assert-plus": "1.0.0",
@@ -13722,9 +15093,9 @@
       }
     },
     "ssri": {
-      "version": "5.2.4",
-      "resolved": "https://registry.npmjs.org/ssri/-/ssri-5.2.4.tgz",
-      "integrity": "sha512-UnEAgMZa15973iH7cUi0AHjJn1ACDIkaMyZILoqwN6yzt+4P81I8tBc5Hl+qwi5auMplZtPQsHrPBR5vJLcQtQ==",
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/ssri/-/ssri-5.3.0.tgz",
+      "integrity": "sha512-XRSIPqLij52MtgoQavH/x/dU1qVKtWUAAZeOHsR9c2Ddi4XerFy3mc1alf+dLJKl9EUIm/Ht+EowFkTUOA6GAQ==",
       "requires": {
         "safe-buffer": "5.1.1"
       }
@@ -13800,16 +15171,16 @@
       }
     },
     "statuses": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.3.1.tgz",
-      "integrity": "sha1-+vUbnrdKrvOzrPStX2Gr8ky3uT4="
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.4.0.tgz",
+      "integrity": "sha512-zhSCtt8v2NDrRlPQpCNtw/heZLtfUDqxBM1udqikb/Hbk52LK4nQSwr10u77iopCW5LsyHpuXS0GnEc48mLeew=="
     },
     "stdout-stream": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/stdout-stream/-/stdout-stream-1.4.0.tgz",
       "integrity": "sha1-osfIWH5U2UJ+qe2zrD8s1SLfN4s=",
       "requires": {
-        "readable-stream": "2.3.4"
+        "readable-stream": "2.3.5"
       }
     },
     "stealthy-require": {
@@ -13833,7 +15204,7 @@
       "integrity": "sha1-ZiZu5fm9uZQKTkUUyvtDu3Hlyds=",
       "requires": {
         "inherits": "2.0.3",
-        "readable-stream": "2.3.4"
+        "readable-stream": "2.3.5"
       }
     },
     "stream-consume": {
@@ -13851,13 +15222,13 @@
       }
     },
     "stream-http": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/stream-http/-/stream-http-2.8.0.tgz",
-      "integrity": "sha512-sZOFxI/5xw058XIRHl4dU3dZ+TTOIGJR78Dvo0oEAejIt4ou27k+3ne1zYmCV+v7UucbxIFQuOgnkTVHh8YPnw==",
+      "version": "2.8.1",
+      "resolved": "https://registry.npmjs.org/stream-http/-/stream-http-2.8.1.tgz",
+      "integrity": "sha512-cQ0jo17BLca2r0GfRdZKYAGLU6JRoIWxqSOakUMuKOT6MOK7AAlE856L33QuDmAy/eeOrhLee3dZKX0Uadu93A==",
       "requires": {
         "builtin-status-codes": "3.0.0",
         "inherits": "2.0.3",
-        "readable-stream": "2.3.4",
+        "readable-stream": "2.3.5",
         "to-arraybuffer": "1.0.1",
         "xtend": "4.0.1"
       }
@@ -13867,6 +15238,14 @@
       "resolved": "https://registry.npmjs.org/stream-shift/-/stream-shift-1.0.0.tgz",
       "integrity": "sha1-1cdSgl5TZ+eG944Y5EXqIjoVWVI="
     },
+    "stream-to-observable": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/stream-to-observable/-/stream-to-observable-0.2.0.tgz",
+      "integrity": "sha1-WdbqOT2HwsDdrBCqDVYbxrpvDhA=",
+      "requires": {
+        "any-observable": "0.2.0"
+      }
+    },
     "strict-uri-encode": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz",
@@ -13914,6 +15293,11 @@
       "resolved": "https://registry.npmjs.org/string-raw/-/string-raw-1.0.1.tgz",
       "integrity": "sha1-Ab4mZaHPosV1IMkQaY9sonakxyY="
     },
+    "string-template": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/string-template/-/string-template-0.2.1.tgz",
+      "integrity": "sha1-QpMuWYo1LQH8IuwzZ9nYTuxsmt0="
+    },
     "string-width": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
@@ -13944,7 +15328,7 @@
       "integrity": "sha1-86rvfBcZ8XDF6rHDK/eA2W4h8vA=",
       "requires": {
         "define-properties": "1.1.2",
-        "es-abstract": "1.10.0",
+        "es-abstract": "1.11.0",
         "function-bind": "1.1.1"
       }
     },
@@ -13954,7 +15338,7 @@
       "integrity": "sha1-W8+tOfRkm7LQMSkuGbzwtRDUskI=",
       "requires": {
         "define-properties": "1.1.2",
-        "es-abstract": "1.10.0",
+        "es-abstract": "1.11.0",
         "function-bind": "1.1.1"
       }
     },
@@ -13976,6 +15360,25 @@
       "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
       "integrity": "sha1-IzTBjpx1n3vdVv3vfprj1YjmjtM="
     },
+    "strip-bom-stream": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/strip-bom-stream/-/strip-bom-stream-2.0.0.tgz",
+      "integrity": "sha1-+H217yYT9paKpUWr/h7HKLaoKco=",
+      "requires": {
+        "first-chunk-stream": "2.0.0",
+        "strip-bom": "2.0.0"
+      },
+      "dependencies": {
+        "strip-bom": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4=",
+          "requires": {
+            "is-utf8": "0.2.1"
+          }
+        }
+      }
+    },
     "strip-eof": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz",
@@ -14024,9 +15427,9 @@
       }
     },
     "supports-color": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.2.0.tgz",
-      "integrity": "sha512-F39vS48la4YvTZUPVeTqsjsFNrvcMwrV3RLZINsmHo+7djCvuUzSIeXOnZ5hmjef4bajL1dNccN+tg5XAliO5Q==",
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.3.0.tgz",
+      "integrity": "sha512-0aP01LLIskjKs3lq52EC0aGBAJhLq7B2Rd8HC/DR/PtNNpcLilNmHC12O+hu0usQpo7wtHNRqtrhBwtDb0+dNg==",
       "requires": {
         "has-flag": "3.0.0"
       }
@@ -14051,9 +15454,9 @@
       }
     },
     "symbol-observable": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/symbol-observable/-/symbol-observable-1.2.0.tgz",
-      "integrity": "sha512-e900nM8RRtGhlV36KGEU9k65K3mPb1WV70OdjfxlG2EAuM1noi/E/BaW/uMhL7bPEssK8QV57vN3esixjUvcXQ=="
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/symbol-observable/-/symbol-observable-1.0.1.tgz",
+      "integrity": "sha1-g0D8RwLDEi310iKI+IKD9RPT/dQ="
     },
     "symbol-tree": {
       "version": "3.2.2",
@@ -14075,57 +15478,34 @@
         "inherits": "2.0.3"
       }
     },
+    "temp": {
+      "version": "0.8.3",
+      "resolved": "https://registry.npmjs.org/temp/-/temp-0.8.3.tgz",
+      "integrity": "sha1-4Ma8TSa5AxJEEOT+2BEDAU38H1k=",
+      "requires": {
+        "os-tmpdir": "1.0.2",
+        "rimraf": "2.2.8"
+      },
+      "dependencies": {
+        "rimraf": {
+          "version": "2.2.8",
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.2.8.tgz",
+          "integrity": "sha1-5Dm+Kq7jJzIZUnMPmaiSnk/FBYI="
+        }
+      }
+    },
     "test-exclude": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/test-exclude/-/test-exclude-4.2.0.tgz",
-      "integrity": "sha512-8hMFzjxbPv6xSlwGhXSvOMJ/vTy3bkng+2pxmf6E1z6VF7I9nIyNfvHtaw+NBPgvz647gADBbMSbwLfZYppT/w==",
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/test-exclude/-/test-exclude-4.2.1.tgz",
+      "integrity": "sha512-qpqlP/8Zl+sosLxBcVKl9vYy26T9NPalxSzzCP/OY6K7j938ui2oKgo+kRZYfxAeIpLqpbVnsHq1tyV70E4lWQ==",
       "requires": {
         "arrify": "1.0.1",
-        "micromatch": "2.3.11",
+        "micromatch": "3.1.10",
         "object-assign": "4.1.1",
         "read-pkg-up": "1.0.1",
         "require-main-filename": "1.0.1"
       },
       "dependencies": {
-        "arr-diff": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
-          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8=",
-          "requires": {
-            "arr-flatten": "1.1.0"
-          }
-        },
-        "array-unique": {
-          "version": "0.2.1",
-          "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
-          "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM="
-        },
-        "braces": {
-          "version": "1.8.5",
-          "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
-          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc=",
-          "requires": {
-            "expand-range": "1.8.2",
-            "preserve": "0.2.0",
-            "repeat-element": "1.1.2"
-          }
-        },
-        "expand-brackets": {
-          "version": "0.1.5",
-          "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
-          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s=",
-          "requires": {
-            "is-posix-bracket": "0.1.1"
-          }
-        },
-        "extglob": {
-          "version": "0.3.2",
-          "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
-          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE=",
-          "requires": {
-            "is-extglob": "1.0.0"
-          }
-        },
         "find-up": {
           "version": "1.1.2",
           "resolved": "https://registry.npmjs.org/find-up/-/find-up-1.1.2.tgz",
@@ -14135,14 +15515,6 @@
             "pinkie-promise": "2.0.1"
           }
         },
-        "kind-of": {
-          "version": "3.2.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
-          "requires": {
-            "is-buffer": "1.1.6"
-          }
-        },
         "load-json-file": {
           "version": "1.1.0",
           "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
@@ -14155,26 +15527,6 @@
             "strip-bom": "2.0.0"
           }
         },
-        "micromatch": {
-          "version": "2.3.11",
-          "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
-          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU=",
-          "requires": {
-            "arr-diff": "2.0.0",
-            "array-unique": "0.2.1",
-            "braces": "1.8.5",
-            "expand-brackets": "0.1.5",
-            "extglob": "0.3.2",
-            "filename-regex": "2.0.1",
-            "is-extglob": "1.0.0",
-            "is-glob": "2.0.1",
-            "kind-of": "3.2.2",
-            "normalize-path": "2.1.1",
-            "object.omit": "2.0.1",
-            "parse-glob": "3.0.4",
-            "regex-cache": "0.4.4"
-          }
-        },
         "path-exists": {
           "version": "2.1.0",
           "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-2.1.0.tgz",
@@ -14251,6 +15603,16 @@
       "resolved": "https://registry.npmjs.org/text-encoding/-/text-encoding-0.6.4.tgz",
       "integrity": "sha1-45mpgiV6J22uQou5KEXLcb3CbRk="
     },
+    "text-table": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz",
+      "integrity": "sha1-f17oI66AUgfACvLfSoTsP8+lcLQ="
+    },
+    "textextensions": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/textextensions/-/textextensions-2.2.0.tgz",
+      "integrity": "sha512-j5EMxnryTvKxwH2Cq+Pb43tsf6sdEgw6Pdwxk83mPaq0ToeFJt6WE4J3s5BqY7vmjlLgkgXvhtXUxo80FyBhCA=="
+    },
     "throat": {
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/throat/-/throat-4.1.0.tgz",
@@ -14266,7 +15628,7 @@
       "resolved": "https://registry.npmjs.org/through2/-/through2-2.0.3.tgz",
       "integrity": "sha1-AARWmzfHx0ujnEPzzteNGtlBQL4=",
       "requires": {
-        "readable-stream": "2.3.4",
+        "readable-stream": "2.3.5",
         "xtend": "4.0.1"
       }
     },
@@ -14280,6 +15642,11 @@
       "resolved": "https://registry.npmjs.org/time-stamp/-/time-stamp-2.0.0.tgz",
       "integrity": "sha1-lcakRTDhW6jW9KPsuMOj+sRto1c="
     },
+    "timed-out": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-4.0.1.tgz",
+      "integrity": "sha1-8y6srFoXW+ol1/q1Zas+2HQe9W8="
+    },
     "timers-browserify": {
       "version": "2.0.6",
       "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.6.tgz",
@@ -14448,7 +15815,7 @@
         "fs-extra": "4.0.3",
         "jest-config": "21.2.1",
         "pkg-dir": "2.0.0",
-        "source-map-support": "0.5.3",
+        "source-map-support": "0.5.4",
         "yargs": "10.1.2"
       },
       "dependencies": {
@@ -14534,16 +15901,16 @@
       "requires": {
         "babel-code-frame": "6.26.0",
         "builtin-modules": "1.1.1",
-        "chalk": "2.3.1",
-        "commander": "2.14.1",
-        "diff": "3.4.0",
+        "chalk": "2.3.2",
+        "commander": "2.15.1",
+        "diff": "3.5.0",
         "glob": "7.1.2",
         "js-yaml": "3.7.0",
         "minimatch": "3.0.4",
-        "resolve": "1.5.0",
+        "resolve": "1.6.0",
         "semver": "5.5.0",
         "tslib": "1.9.0",
-        "tsutils": "2.21.2"
+        "tsutils": "2.22.2"
       }
     },
     "tslint-microsoft-contrib": {
@@ -14551,7 +15918,7 @@
       "resolved": "https://registry.npmjs.org/tslint-microsoft-contrib/-/tslint-microsoft-contrib-5.0.3.tgz",
       "integrity": "sha512-5AnfTGlfpUzpRHLmoojPBKFTTmbjnwgdaTHMdllausa4GBPya5u36i9ddrTX4PhetGZvd4JUYIpAmgHqVnsctg==",
       "requires": {
-        "tsutils": "2.21.2"
+        "tsutils": "2.22.2"
       }
     },
     "tslint-react": {
@@ -14559,13 +15926,13 @@
       "resolved": "https://registry.npmjs.org/tslint-react/-/tslint-react-3.5.1.tgz",
       "integrity": "sha512-ndS/iOOGrasATcf5YU3JxoIwPGVykjrKhzmlVsRdT1xzl/RbNg9n627rtAGbCjkQepyiaQYgxWQT5G/qUpQCaA==",
       "requires": {
-        "tsutils": "2.21.2"
+        "tsutils": "2.22.2"
       }
     },
     "tsutils": {
-      "version": "2.21.2",
-      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.21.2.tgz",
-      "integrity": "sha512-iaIuyjIUeFLdD39MYdzqBuY7Zv6+uGxSwRH4mf+HuzsnznjFz0R2tGrAe0/JvtNh91WrN8UN/DZRFTZNDuVekA==",
+      "version": "2.22.2",
+      "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.22.2.tgz",
+      "integrity": "sha512-u06FUSulCJ+Y8a2ftuqZN6kIGqdP2yJjUPEngXqmdPND4UQfb04igcotH+dw+IFr417yP6muCLE8/5/Qlfnx0w==",
       "requires": {
         "tslib": "1.9.0"
       }
@@ -14625,74 +15992,41 @@
       "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.17.tgz",
       "integrity": "sha512-uRdSdu1oA1rncCQL7sCj8vSyZkgtL7faaw9Tc9rZ3mGgraQ7+Pdx7w5mnOSF3gw9ZNG6oc+KXfkon3bKuROm0g=="
     },
-    "uglify-js": {
-      "version": "2.8.29",
-      "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.8.29.tgz",
-      "integrity": "sha1-KcVzMUgFe7Th913zW3qcty5qWd0=",
+    "uglify-es": {
+      "version": "3.3.9",
+      "resolved": "https://registry.npmjs.org/uglify-es/-/uglify-es-3.3.9.tgz",
+      "integrity": "sha512-r+MU0rfv4L/0eeW3xZrd16t4NZfK8Ld4SWVglYBb7ez5uXFWHuVRs6xCTrf1yirs9a4j4Y27nn7SRfO6v67XsQ==",
       "requires": {
-        "source-map": "0.5.7",
-        "yargs": "3.10.0"
+        "commander": "2.13.0",
+        "source-map": "0.6.1"
       },
       "dependencies": {
-        "camelcase": {
-          "version": "1.2.1",
-          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
-          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
-        },
-        "cliui": {
-          "version": "2.1.0",
-          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
-          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE=",
-          "requires": {
-            "center-align": "0.1.3",
-            "right-align": "0.1.3",
-            "wordwrap": "0.0.2"
-          }
-        },
-        "source-map": {
-          "version": "0.5.7",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
-          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
-        },
-        "wordwrap": {
-          "version": "0.0.2",
-          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
-          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
-        },
-        "yargs": {
-          "version": "3.10.0",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
-          "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E=",
-          "requires": {
-            "camelcase": "1.2.1",
-            "cliui": "2.1.0",
-            "decamelize": "1.2.0",
-            "window-size": "0.1.0"
-          }
+        "commander": {
+          "version": "2.13.0",
+          "resolved": "https://registry.npmjs.org/commander/-/commander-2.13.0.tgz",
+          "integrity": "sha512-MVuS359B+YzaWqjCL/c+22gfryv+mCBPHAv3zyVI2GN8EY6IRP8VwtasXn8jyyhvvq84R4ImN1OKRtcbIasjYA=="
         }
       }
     },
     "uglifyjs-webpack-plugin": {
-      "version": "0.4.6",
-      "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-0.4.6.tgz",
-      "integrity": "sha1-uVH0q7a9YX5m9j64kUmOORdj4wk=",
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-1.2.4.tgz",
+      "integrity": "sha512-z0IbjpW8b3O/OVn+TTZN4pI29RN1zktFBXLIzzfZ+++cUtZ1ERSlLWgpE/5OERuEUs1ijVQnpYAkSlpoVmQmSQ==",
       "requires": {
-        "source-map": "0.5.7",
-        "uglify-js": "2.8.29",
-        "webpack-sources": "1.1.0"
-      },
-      "dependencies": {
-        "source-map": {
-          "version": "0.5.7",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
-          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
-        }
+        "cacache": "10.0.4",
+        "find-cache-dir": "1.0.0",
+        "schema-utils": "0.4.5",
+        "serialize-javascript": "1.4.0",
+        "source-map": "0.6.1",
+        "uglify-es": "3.3.9",
+        "webpack-sources": "1.1.0",
+        "worker-farm": "1.6.0"
       }
     },
     "underscore": {
-      "version": "1.4.4",
-      "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.4.4.tgz",
-      "integrity": "sha1-YaajIBBiKvoHljvzJSA88SI51gQ="
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.6.0.tgz",
+      "integrity": "sha1-izixDKze9jM3uLJOT/htRa6lKag="
     },
     "underscore.string": {
       "version": "2.4.0",
@@ -14819,6 +16153,11 @@
         }
       }
     },
+    "untildify": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/untildify/-/untildify-3.0.2.tgz",
+      "integrity": "sha1-fx8wIFWz/qDz6B3HjrNnZstl4/E="
+    },
     "upath": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/upath/-/upath-1.0.4.tgz",
@@ -14850,6 +16189,11 @@
         }
       }
     },
+    "url-join": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/url-join/-/url-join-4.0.0.tgz",
+      "integrity": "sha1-TTNA6AfTdzvamZH4MFrNzCpmXSo="
+    },
     "url-loader": {
       "version": "0.6.2",
       "resolved": "https://registry.npmjs.org/url-loader/-/url-loader-0.6.2.tgz",
@@ -14886,77 +16230,34 @@
         }
       }
     },
-    "use": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/use/-/use-2.0.2.tgz",
-      "integrity": "sha1-riig1y+TvyJCKhii43mZMRLeyOg=",
+    "url-parse-lax": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/url-parse-lax/-/url-parse-lax-3.0.0.tgz",
+      "integrity": "sha1-FrXK/Afb42dsGxmZF3gj1lA6yww=",
       "requires": {
-        "define-property": "0.2.5",
-        "isobject": "3.0.1",
-        "lazy-cache": "2.0.2"
+        "prepend-http": "2.0.0"
       },
       "dependencies": {
-        "define-property": {
-          "version": "0.2.5",
-          "resolved": "https://registry.npmjs.org/define-property/-/define-property-0.2.5.tgz",
-          "integrity": "sha1-w1se+RjsPJkPmlvFe+BKrOxcgRY=",
-          "requires": {
-            "is-descriptor": "0.1.6"
-          }
-        },
-        "is-accessor-descriptor": {
-          "version": "0.1.6",
-          "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
-          "integrity": "sha1-qeEss66Nh2cn7u84Q/igiXtcmNY=",
-          "requires": {
-            "kind-of": "3.2.2"
-          },
-          "dependencies": {
-            "kind-of": {
-              "version": "3.2.2",
-              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-              "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
-              "requires": {
-                "is-buffer": "1.1.6"
-              }
-            }
-          }
-        },
-        "is-data-descriptor": {
-          "version": "0.1.4",
-          "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
-          "integrity": "sha1-C17mSDiOLIYCgueT8YVv7D8wG1Y=",
-          "requires": {
-            "kind-of": "3.2.2"
-          },
-          "dependencies": {
-            "kind-of": {
-              "version": "3.2.2",
-              "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
-              "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
-              "requires": {
-                "is-buffer": "1.1.6"
-              }
-            }
-          }
-        },
-        "is-descriptor": {
-          "version": "0.1.6",
-          "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz",
-          "integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg==",
-          "requires": {
-            "is-accessor-descriptor": "0.1.6",
-            "is-data-descriptor": "0.1.4",
-            "kind-of": "5.1.0"
-          }
-        },
-        "kind-of": {
-          "version": "5.1.0",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
-          "integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw=="
+        "prepend-http": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/prepend-http/-/prepend-http-2.0.0.tgz",
+          "integrity": "sha1-6SQ0v6XqjBn0HN/UAddBo8gZ2Jc="
         }
       }
     },
+    "url-to-options": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/url-to-options/-/url-to-options-1.0.1.tgz",
+      "integrity": "sha1-FQWgOiiaSMvXpDTvuu7FBV9WM6k="
+    },
+    "use": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/use/-/use-3.1.0.tgz",
+      "integrity": "sha512-6UJEQM/L+mzC3ZJNM56Q4DFGLX/evKGRg15UJHGB9X5j5Z3AFbgZvjUh2yq/UJUY4U5dh7Fal++XbNg1uzpRAw==",
+      "requires": {
+        "kind-of": "6.0.2"
+      }
+    },
     "util": {
       "version": "0.10.3",
       "resolved": "https://registry.npmjs.org/util/-/util-0.10.3.tgz",
@@ -14992,6 +16293,11 @@
       "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.2.1.tgz",
       "integrity": "sha512-jZnMwlb9Iku/O3smGWvZhauCf6cvvpKi4BKRiliS3cxnI+Gz9j5MEpTz2UFuXiKPJocb7gnsLHwiS05ige5BEA=="
     },
+    "v8-compile-cache": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/v8-compile-cache/-/v8-compile-cache-1.1.2.tgz",
+      "integrity": "sha512-ejdrifsIydN1XDH7EuR2hn8ZrkRKUYF7tUcBjBy/lhrCvs2K+zRlbW9UHc0IQ9RsYFZJFqJrieoIHfkCa0DBRA=="
+    },
     "validate-npm-package-license": {
       "version": "3.0.3",
       "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.3.tgz",
@@ -15049,6 +16355,44 @@
         "extsprintf": "1.3.0"
       }
     },
+    "vinyl": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/vinyl/-/vinyl-1.2.0.tgz",
+      "integrity": "sha1-XIgDbPVl5d8FVYv8kR+GVt8hiIQ=",
+      "requires": {
+        "clone": "1.0.4",
+        "clone-stats": "0.0.1",
+        "replace-ext": "0.0.1"
+      }
+    },
+    "vinyl-file": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/vinyl-file/-/vinyl-file-2.0.0.tgz",
+      "integrity": "sha1-p+v1/779obfRjRQPyweyI++2dRo=",
+      "requires": {
+        "graceful-fs": "4.1.11",
+        "pify": "2.3.0",
+        "pinkie-promise": "2.0.1",
+        "strip-bom": "2.0.0",
+        "strip-bom-stream": "2.0.0",
+        "vinyl": "1.2.0"
+      },
+      "dependencies": {
+        "pify": {
+          "version": "2.3.0",
+          "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+          "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw="
+        },
+        "strip-bom": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-2.0.0.tgz",
+          "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4=",
+          "requires": {
+            "is-utf8": "0.2.1"
+          }
+        }
+      }
+    },
     "vm-browserify": {
       "version": "0.0.4",
       "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-0.0.4.tgz",
@@ -15094,7 +16438,7 @@
       "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.5.0.tgz",
       "integrity": "sha512-RSlipNQB1u48cq0wH/BNfCu1tD/cJ8ydFIkNYhp9o+3d+8unClkIovpW5qpFPgmL9OE48wfAnlZydXByWP82AA==",
       "requires": {
-        "chokidar": "2.0.2",
+        "chokidar": "2.0.3",
         "graceful-fs": "4.1.11",
         "neo-async": "2.5.0"
       },
@@ -15104,14 +16448,14 @@
           "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-2.0.0.tgz",
           "integrity": "sha512-5teOsQWABXHHBFP9y3skS5P3d/WfWXpv3FUpy+LorMrNYaT9pI4oLMQX7jzQ2KklNpGpWHzdCXTDT2Y3XGlZBw==",
           "requires": {
-            "micromatch": "3.1.9",
+            "micromatch": "3.1.10",
             "normalize-path": "2.1.1"
           }
         },
         "chokidar": {
-          "version": "2.0.2",
-          "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-2.0.2.tgz",
-          "integrity": "sha512-l32Hw3wqB0L2kGVmSbK/a+xXLDrUEsc84pSgMkmwygHvD7ubRsP/vxxHa5BtB6oix1XLLVCHyYMsckRXxThmZw==",
+          "version": "2.0.3",
+          "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-2.0.3.tgz",
+          "integrity": "sha512-zW8iXYZtXMx4kux/nuZVXjkLP+CyIK5Al5FHnj1OgTKGZfp4Oy6/ymtMSKFv3GD8DviEmUPmJg9eFdJ/JzudMg==",
           "requires": {
             "anymatch": "2.0.0",
             "async-each": "1.0.1",
@@ -15161,9 +16505,9 @@
       }
     },
     "wbuf": {
-      "version": "1.7.2",
-      "resolved": "https://registry.npmjs.org/wbuf/-/wbuf-1.7.2.tgz",
-      "integrity": "sha1-1pe5nx9ZUS3ydRvkJ2nBWAtYAf4=",
+      "version": "1.7.3",
+      "resolved": "https://registry.npmjs.org/wbuf/-/wbuf-1.7.3.tgz",
+      "integrity": "sha512-O84QOnr0icsbFGLS0O3bI5FswxzRr8/gHwWkDlQFskhSPryQXvrTMxjxGP4+iWYoauLoBvfDpkrOauZ+0iZpDA==",
       "requires": {
         "minimalistic-assert": "1.0.0"
       }
@@ -15174,14 +16518,14 @@
       "integrity": "sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg=="
     },
     "webpack": {
-      "version": "3.11.0",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-3.11.0.tgz",
-      "integrity": "sha512-3kOFejWqj5ISpJk4Qj/V7w98h9Vl52wak3CLiw/cDOfbVTq7FeoZ0SdoHHY9PYlHr50ZS42OfvzE2vB4nncKQg==",
+      "version": "3.10.0",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-3.10.0.tgz",
+      "integrity": "sha512-fxxKXoicjdXNUMY7LIdY89tkJJJ0m1Oo8PQutZ5rLgWbV5QVKI15Cn7+/IHnRTd3vfKfiwBx6SBqlorAuNA8LA==",
       "requires": {
-        "acorn": "5.5.0",
+        "acorn": "5.5.3",
         "acorn-dynamic-import": "2.0.2",
-        "ajv": "6.2.0",
-        "ajv-keywords": "3.1.0",
+        "ajv": "5.5.2",
+        "ajv-keywords": "2.1.1",
         "async": "2.6.0",
         "enhanced-resolve": "3.4.1",
         "escope": "3.6.0",
@@ -15202,138 +16546,523 @@
         "yargs": "8.0.2"
       },
       "dependencies": {
-        "acorn": {
-          "version": "5.5.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.5.0.tgz",
-          "integrity": "sha512-arn53F07VXmls4o4pUhSzBa4fvaagPRe7AVZ8l7NHxFWUie2DsuFSBMMNAkgzRlOhEhzAnxeKyaWVzOH4xqp/g=="
+        "acorn": {
+          "version": "5.5.3",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.5.3.tgz",
+          "integrity": "sha512-jd5MkIUlbbmb07nXH0DT3y7rDVtkzDi4XZOUVWAer8ajmF/DTSSbl5oNFyDOl/OXA33Bl79+ypHhl2pN20VeOQ=="
+        },
+        "acorn-dynamic-import": {
+          "version": "2.0.2",
+          "resolved": "https://registry.npmjs.org/acorn-dynamic-import/-/acorn-dynamic-import-2.0.2.tgz",
+          "integrity": "sha1-x1K9IQvvZ5UBtsbLf8hPj0cVjMQ=",
+          "requires": {
+            "acorn": "4.0.13"
+          },
+          "dependencies": {
+            "acorn": {
+              "version": "4.0.13",
+              "resolved": "https://registry.npmjs.org/acorn/-/acorn-4.0.13.tgz",
+              "integrity": "sha1-EFSVrlNh1pe9GVyCUZLhrX8lN4c="
+            }
+          }
+        },
+        "ajv-keywords": {
+          "version": "2.1.1",
+          "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-2.1.1.tgz",
+          "integrity": "sha1-YXmX/F9gV2iUxDX5QNgZ4TW4B2I="
+        },
+        "camelcase": {
+          "version": "1.2.1",
+          "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
+          "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk="
+        },
+        "cliui": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
+          "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE=",
+          "requires": {
+            "center-align": "0.1.3",
+            "right-align": "0.1.3",
+            "wordwrap": "0.0.2"
+          }
+        },
+        "enhanced-resolve": {
+          "version": "3.4.1",
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.4.1.tgz",
+          "integrity": "sha1-BCHjOf1xQZs9oT0Smzl5BAIwR24=",
+          "requires": {
+            "graceful-fs": "4.1.11",
+            "memory-fs": "0.4.1",
+            "object-assign": "4.1.1",
+            "tapable": "0.2.8"
+          }
+        },
+        "has-flag": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
+          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
+        },
+        "is-fullwidth-code-point": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
+          "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
+          "requires": {
+            "number-is-nan": "1.0.1"
+          }
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
+        },
+        "supports-color": {
+          "version": "4.5.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.5.0.tgz",
+          "integrity": "sha1-vnoN5ITexcXN34s9WRJQRJEvY1s=",
+          "requires": {
+            "has-flag": "2.0.0"
+          }
+        },
+        "uglify-js": {
+          "version": "2.8.29",
+          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.8.29.tgz",
+          "integrity": "sha1-KcVzMUgFe7Th913zW3qcty5qWd0=",
+          "requires": {
+            "source-map": "0.5.7",
+            "yargs": "3.10.0"
+          },
+          "dependencies": {
+            "yargs": {
+              "version": "3.10.0",
+              "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
+              "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E=",
+              "requires": {
+                "camelcase": "1.2.1",
+                "cliui": "2.1.0",
+                "decamelize": "1.2.0",
+                "window-size": "0.1.0"
+              }
+            }
+          }
+        },
+        "uglifyjs-webpack-plugin": {
+          "version": "0.4.6",
+          "resolved": "https://registry.npmjs.org/uglifyjs-webpack-plugin/-/uglifyjs-webpack-plugin-0.4.6.tgz",
+          "integrity": "sha1-uVH0q7a9YX5m9j64kUmOORdj4wk=",
+          "requires": {
+            "source-map": "0.5.7",
+            "uglify-js": "2.8.29",
+            "webpack-sources": "1.1.0"
+          }
+        },
+        "wordwrap": {
+          "version": "0.0.2",
+          "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
+          "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8="
+        },
+        "yargs": {
+          "version": "8.0.2",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-8.0.2.tgz",
+          "integrity": "sha1-YpmpBVsc78lp/355wdkY3Osiw2A=",
+          "requires": {
+            "camelcase": "4.1.0",
+            "cliui": "3.2.0",
+            "decamelize": "1.2.0",
+            "get-caller-file": "1.0.2",
+            "os-locale": "2.1.0",
+            "read-pkg-up": "2.0.0",
+            "require-directory": "2.1.1",
+            "require-main-filename": "1.0.1",
+            "set-blocking": "2.0.0",
+            "string-width": "2.1.1",
+            "which-module": "2.0.0",
+            "y18n": "3.2.1",
+            "yargs-parser": "7.0.0"
+          },
+          "dependencies": {
+            "camelcase": {
+              "version": "4.1.0",
+              "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
+              "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0="
+            },
+            "cliui": {
+              "version": "3.2.0",
+              "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
+              "integrity": "sha1-EgYBU3qRbSmUD5NNo7SNWFo5IT0=",
+              "requires": {
+                "string-width": "1.0.2",
+                "strip-ansi": "3.0.1",
+                "wrap-ansi": "2.1.0"
+              },
+              "dependencies": {
+                "string-width": {
+                  "version": "1.0.2",
+                  "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
+                  "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
+                  "requires": {
+                    "code-point-at": "1.1.0",
+                    "is-fullwidth-code-point": "1.0.0",
+                    "strip-ansi": "3.0.1"
+                  }
+                }
+              }
+            }
+          }
+        }
+      }
+    },
+    "webpack-addons": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/webpack-addons/-/webpack-addons-1.1.5.tgz",
+      "integrity": "sha512-MGO0nVniCLFAQz1qv22zM02QPjcpAoJdy7ED0i3Zy7SY1IecgXCm460ib7H/Wq7e9oL5VL6S2BxaObxwIcag0g==",
+      "requires": {
+        "jscodeshift": "0.4.1"
+      },
+      "dependencies": {
+        "arr-diff": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-2.0.0.tgz",
+          "integrity": "sha1-jzuCf5Vai9ZpaX5KQlasPOrjVs8=",
+          "requires": {
+            "arr-flatten": "1.1.0"
+          }
+        },
+        "array-unique": {
+          "version": "0.2.1",
+          "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.2.1.tgz",
+          "integrity": "sha1-odl8yvy8JiXMcPrc6zalDFiwGlM="
+        },
+        "ast-types": {
+          "version": "0.10.1",
+          "resolved": "https://registry.npmjs.org/ast-types/-/ast-types-0.10.1.tgz",
+          "integrity": "sha512-UY7+9DPzlJ9VM8eY0b2TUZcZvF+1pO0hzMtAyjBYKhOmnvRlqYNYnWdtsMj0V16CGaMlpL0G1jnLbLo4AyotuQ=="
+        },
+        "async": {
+          "version": "1.5.2",
+          "resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz",
+          "integrity": "sha1-7GphrlZIDAw8skHJVhjiCJL5Zyo="
+        },
+        "braces": {
+          "version": "1.8.5",
+          "resolved": "https://registry.npmjs.org/braces/-/braces-1.8.5.tgz",
+          "integrity": "sha1-uneWLhLf+WnWt2cR6RS3N4V79qc=",
+          "requires": {
+            "expand-range": "1.8.2",
+            "preserve": "0.2.0",
+            "repeat-element": "1.1.2"
+          }
+        },
+        "esprima": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.0.tgz",
+          "integrity": "sha512-oftTcaMu/EGrEIu904mWteKIv8vMuOgGYo7EhVJJN00R/EED9DCua/xxHRdYnKtcECzVg7xOWhflvJMnqcFZjw=="
+        },
+        "expand-brackets": {
+          "version": "0.1.5",
+          "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-0.1.5.tgz",
+          "integrity": "sha1-3wcoTjQqgHzXM6xa9yQR5YHRF3s=",
+          "requires": {
+            "is-posix-bracket": "0.1.1"
+          }
+        },
+        "extglob": {
+          "version": "0.3.2",
+          "resolved": "https://registry.npmjs.org/extglob/-/extglob-0.3.2.tgz",
+          "integrity": "sha1-Lhj/PS9JqydlzskCPwEdqo2DSaE=",
+          "requires": {
+            "is-extglob": "1.0.0"
+          }
+        },
+        "jscodeshift": {
+          "version": "0.4.1",
+          "resolved": "https://registry.npmjs.org/jscodeshift/-/jscodeshift-0.4.1.tgz",
+          "integrity": "sha512-iOX6If+hsw0q99V3n31t4f5VlD1TQZddH08xbT65ZqA7T4Vkx68emrDZMUOLVvCEAJ6NpAk7DECe3fjC/t52AQ==",
+          "requires": {
+            "async": "1.5.2",
+            "babel-plugin-transform-flow-strip-types": "6.22.0",
+            "babel-preset-es2015": "6.24.1",
+            "babel-preset-stage-1": "6.24.1",
+            "babel-register": "6.26.0",
+            "babylon": "6.18.0",
+            "colors": "1.1.2",
+            "flow-parser": "0.68.0",
+            "lodash": "4.15.0",
+            "micromatch": "2.3.11",
+            "node-dir": "0.1.8",
+            "nomnom": "1.8.1",
+            "recast": "0.12.9",
+            "temp": "0.8.3",
+            "write-file-atomic": "1.3.4"
+          }
+        },
+        "kind-of": {
+          "version": "3.2.2",
+          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+          "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+          "requires": {
+            "is-buffer": "1.1.6"
+          }
+        },
+        "micromatch": {
+          "version": "2.3.11",
+          "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-2.3.11.tgz",
+          "integrity": "sha1-hmd8l9FyCzY0MdBNDRUpO9OMFWU=",
+          "requires": {
+            "arr-diff": "2.0.0",
+            "array-unique": "0.2.1",
+            "braces": "1.8.5",
+            "expand-brackets": "0.1.5",
+            "extglob": "0.3.2",
+            "filename-regex": "2.0.1",
+            "is-extglob": "1.0.0",
+            "is-glob": "2.0.1",
+            "kind-of": "3.2.2",
+            "normalize-path": "2.1.1",
+            "object.omit": "2.0.1",
+            "parse-glob": "3.0.4",
+            "regex-cache": "0.4.4"
+          }
+        },
+        "recast": {
+          "version": "0.12.9",
+          "resolved": "https://registry.npmjs.org/recast/-/recast-0.12.9.tgz",
+          "integrity": "sha512-y7ANxCWmMW8xLOaiopiRDlyjQ9ajKRENBH+2wjntIbk3A6ZR1+BLQttkmSHMY7Arl+AAZFwJ10grg2T6f1WI8A==",
+          "requires": {
+            "ast-types": "0.10.1",
+            "core-js": "2.5.3",
+            "esprima": "4.0.0",
+            "private": "0.1.8",
+            "source-map": "0.6.1"
+          }
+        },
+        "write-file-atomic": {
+          "version": "1.3.4",
+          "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-1.3.4.tgz",
+          "integrity": "sha1-+Aek8LHZ6ROuekgRLmzDrxmRtF8=",
+          "requires": {
+            "graceful-fs": "4.1.11",
+            "imurmurhash": "0.1.4",
+            "slide": "1.1.6"
+          }
+        }
+      }
+    },
+    "webpack-bundle-analyzer": {
+      "version": "2.11.1",
+      "resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.11.1.tgz",
+      "integrity": "sha512-VKUVkVMc6TWVXmF1OxsBXoiRjYiDRA4XT0KqtbLMDK+891VX7FCuklYwzldND8J2upUcHHnuXYNTP+4mSFi4Kg==",
+      "requires": {
+        "acorn": "5.5.3",
+        "bfj-node4": "5.3.1",
+        "chalk": "2.3.2",
+        "commander": "2.15.1",
+        "ejs": "2.5.7",
+        "express": "4.16.3",
+        "filesize": "3.6.1",
+        "gzip-size": "4.1.0",
+        "lodash": "4.17.5",
+        "mkdirp": "0.5.1",
+        "opener": "1.4.3",
+        "ws": "4.1.0"
+      },
+      "dependencies": {
+        "acorn": {
+          "version": "5.5.3",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.5.3.tgz",
+          "integrity": "sha512-jd5MkIUlbbmb07nXH0DT3y7rDVtkzDi4XZOUVWAer8ajmF/DTSSbl5oNFyDOl/OXA33Bl79+ypHhl2pN20VeOQ=="
+        },
+        "gzip-size": {
+          "version": "4.1.0",
+          "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-4.1.0.tgz",
+          "integrity": "sha1-iuCWJX6r59acRb4rZ8RIEk/7UXw=",
+          "requires": {
+            "duplexer": "0.1.1",
+            "pify": "3.0.0"
+          }
+        },
+        "lodash": {
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
+        }
+      }
+    },
+    "webpack-cli": {
+      "version": "2.0.13",
+      "resolved": "https://registry.npmjs.org/webpack-cli/-/webpack-cli-2.0.13.tgz",
+      "integrity": "sha512-0lnOi3yla8FsZVuMsbfnNRB/8DlfuDugKdekC+4ykydZG0+UOidMi5J5LLWN4c0VJ8PqC19yMXXkYyCq78OuqA==",
+      "requires": {
+        "chalk": "2.3.2",
+        "cross-spawn": "6.0.5",
+        "diff": "3.5.0",
+        "enhanced-resolve": "4.0.0",
+        "glob-all": "3.1.0",
+        "global-modules": "1.0.0",
+        "got": "8.3.0",
+        "inquirer": "5.1.0",
+        "interpret": "1.1.0",
+        "jscodeshift": "0.5.0",
+        "listr": "0.13.0",
+        "loader-utils": "1.1.0",
+        "lodash": "4.17.5",
+        "log-symbols": "2.2.0",
+        "mkdirp": "0.5.1",
+        "p-each-series": "1.0.0",
+        "p-lazy": "1.0.0",
+        "prettier": "1.11.1",
+        "resolve-cwd": "2.0.0",
+        "supports-color": "5.3.0",
+        "v8-compile-cache": "1.1.2",
+        "webpack-addons": "1.1.5",
+        "yargs": "11.0.0",
+        "yeoman-environment": "2.0.5",
+        "yeoman-generator": "2.0.3"
+      },
+      "dependencies": {
+        "ansi-escapes": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-3.0.0.tgz",
+          "integrity": "sha512-O/klc27mWNUigtv0F8NJWbLF00OcegQalkqKURWdosW08YZKi4m6CnSUSvIZG1otNJbTWhN01Hhz389DW7mvDQ=="
         },
-        "ajv": {
-          "version": "6.2.0",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.2.0.tgz",
-          "integrity": "sha1-r6wpW7qgFSRJ5SJ0LkVHwa6TKNI=",
+        "ansi-regex": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg="
+        },
+        "cliui": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-4.0.0.tgz",
+          "integrity": "sha512-nY3W5Gu2racvdDk//ELReY+dHjb9PlIcVDFXP72nVIhq2Gy3LuVXYwJoPVudwQnv1shtohpgkdCKT2YaKY0CKw==",
           "requires": {
-            "fast-deep-equal": "1.1.0",
-            "fast-json-stable-stringify": "2.0.0",
-            "json-schema-traverse": "0.3.1"
+            "string-width": "2.1.1",
+            "strip-ansi": "4.0.0",
+            "wrap-ansi": "2.1.0"
+          }
+        },
+        "cross-spawn": {
+          "version": "6.0.5",
+          "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz",
+          "integrity": "sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==",
+          "requires": {
+            "nice-try": "1.0.4",
+            "path-key": "2.0.1",
+            "semver": "5.5.0",
+            "shebang-command": "1.2.0",
+            "which": "1.3.0"
           }
         },
         "enhanced-resolve": {
-          "version": "3.4.1",
-          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.4.1.tgz",
-          "integrity": "sha1-BCHjOf1xQZs9oT0Smzl5BAIwR24=",
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-4.0.0.tgz",
+          "integrity": "sha512-jox/62b2GofV1qTUQTMPEJSDIGycS43evqYzD/KVtEb9OCoki9cnacUPxCrZa7JfPzZSYOCZhu9O9luaMxAX8g==",
           "requires": {
             "graceful-fs": "4.1.11",
             "memory-fs": "0.4.1",
-            "object-assign": "4.1.1",
-            "tapable": "0.2.8"
+            "tapable": "1.0.0"
           }
         },
-        "has-flag": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
-          "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
+        "inquirer": {
+          "version": "5.1.0",
+          "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-5.1.0.tgz",
+          "integrity": "sha512-kn7N70US1MSZHZHSGJLiZ7iCwwncc7b0gc68YtlX29OjI3Mp0tSVV+snVXpZ1G+ONS3Ac9zd1m6hve2ibLDYfA==",
+          "requires": {
+            "ansi-escapes": "3.0.0",
+            "chalk": "2.3.2",
+            "cli-cursor": "2.1.0",
+            "cli-width": "2.2.0",
+            "external-editor": "2.1.0",
+            "figures": "2.0.0",
+            "lodash": "4.17.5",
+            "mute-stream": "0.0.7",
+            "run-async": "2.3.0",
+            "rxjs": "5.5.7",
+            "string-width": "2.1.1",
+            "strip-ansi": "4.0.0",
+            "through": "2.3.8"
+          }
         },
-        "source-map": {
-          "version": "0.5.7",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
-          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
+        "lodash": {
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
         },
-        "supports-color": {
-          "version": "4.5.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.5.0.tgz",
-          "integrity": "sha1-vnoN5ITexcXN34s9WRJQRJEvY1s=",
+        "strip-ansi": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
           "requires": {
-            "has-flag": "2.0.0"
+            "ansi-regex": "3.0.0"
           }
         },
+        "tapable": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/tapable/-/tapable-1.0.0.tgz",
+          "integrity": "sha512-dQRhbNQkRnaqauC7WqSJ21EEksgT0fYZX2lqXzGkpo8JNig9zGZTYoMGvyI2nWmXlE2VSVXVDu7wLVGu/mQEsg=="
+        },
         "yargs": {
-          "version": "8.0.2",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-8.0.2.tgz",
-          "integrity": "sha1-YpmpBVsc78lp/355wdkY3Osiw2A=",
+          "version": "11.0.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-11.0.0.tgz",
+          "integrity": "sha512-Rjp+lMYQOWtgqojx1dEWorjCofi1YN7AoFvYV7b1gx/7dAAeuI4kN5SZiEvr0ZmsZTOpDRcCqrpI10L31tFkBw==",
           "requires": {
-            "camelcase": "4.1.0",
-            "cliui": "3.2.0",
+            "cliui": "4.0.0",
             "decamelize": "1.2.0",
+            "find-up": "2.1.0",
             "get-caller-file": "1.0.2",
             "os-locale": "2.1.0",
-            "read-pkg-up": "2.0.0",
             "require-directory": "2.1.1",
             "require-main-filename": "1.0.1",
             "set-blocking": "2.0.0",
             "string-width": "2.1.1",
             "which-module": "2.0.0",
             "y18n": "3.2.1",
-            "yargs-parser": "7.0.0"
+            "yargs-parser": "9.0.2"
           }
-        }
-      }
-    },
-    "webpack-bundle-analyzer": {
-      "version": "2.11.0",
-      "resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.11.0.tgz",
-      "integrity": "sha512-GGz//de6DHqKIBN75vRPUqwTUobgYCzygS+ei/Z5wRpKYEZ+HO2e8Pd6CbQewGfofjRHoCFqL10pi2lu+/fqDg==",
-      "requires": {
-        "acorn": "5.5.0",
-        "bfj-node4": "5.2.1",
-        "chalk": "2.3.1",
-        "commander": "2.14.1",
-        "ejs": "2.5.7",
-        "express": "4.16.2",
-        "filesize": "3.6.0",
-        "gzip-size": "4.1.0",
-        "lodash": "4.17.5",
-        "mkdirp": "0.5.1",
-        "opener": "1.4.3",
-        "ws": "4.1.0"
-      },
-      "dependencies": {
-        "acorn": {
-          "version": "5.5.0",
-          "resolved": "https://registry.npmjs.org/acorn/-/acorn-5.5.0.tgz",
-          "integrity": "sha512-arn53F07VXmls4o4pUhSzBa4fvaagPRe7AVZ8l7NHxFWUie2DsuFSBMMNAkgzRlOhEhzAnxeKyaWVzOH4xqp/g=="
         },
-        "gzip-size": {
-          "version": "4.1.0",
-          "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-4.1.0.tgz",
-          "integrity": "sha1-iuCWJX6r59acRb4rZ8RIEk/7UXw=",
+        "yargs-parser": {
+          "version": "9.0.2",
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-9.0.2.tgz",
+          "integrity": "sha1-nM9qQ0YP5O1Aqbto9I1DuKaMwHc=",
           "requires": {
-            "duplexer": "0.1.1",
-            "pify": "3.0.0"
+            "camelcase": "4.1.0"
           }
-        },
-        "lodash": {
-          "version": "4.17.5",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
-          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
         }
       }
     },
     "webpack-dev-middleware": {
-      "version": "1.12.2",
-      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-1.12.2.tgz",
-      "integrity": "sha512-FCrqPy1yy/sN6U/SaEZcHKRXGlqU0DUaEBL45jkUYoB8foVb6wCnbIJ1HKIx+qUFTW+3JpVcCJCxZ8VATL4e+A==",
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-3.0.1.tgz",
+      "integrity": "sha512-JCturcEZNGA0KHEpOJVRTC/VVazTcPfpR9c1Au6NO9a+jxCRchMi87Qe7y3JeOzc0v5eMMKpuGBnPdN52NA+CQ==",
       "requires": {
+        "loud-rejection": "1.6.0",
         "memory-fs": "0.4.1",
-        "mime": "1.6.0",
+        "mime": "2.2.0",
         "path-is-absolute": "1.0.1",
         "range-parser": "1.2.0",
-        "time-stamp": "2.0.0"
+        "url-join": "4.0.0",
+        "webpack-log": "1.1.2"
+      },
+      "dependencies": {
+        "mime": {
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/mime/-/mime-2.2.0.tgz",
+          "integrity": "sha512-0Qz9uF1ATtl8RKJG4VRfOymh7PyEor6NbrI/61lRfuRe4vx9SNATrvAeTj2EWVRKjEQGskrzWkJBBY5NbaVHIA=="
+        }
       }
     },
     "webpack-dev-server": {
-      "version": "2.11.2",
-      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.11.2.tgz",
-      "integrity": "sha512-zrPoX97bx47vZiAXfDrkw8pe9QjJ+lunQl3dypojyWwWr1M5I2h0VSrMPfTjopHQPRNn+NqfjcMmhoLcUJe2gA==",
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-3.1.1.tgz",
+      "integrity": "sha512-u5lz6REb3+KklgSIytUIOrmWgnpgFmfj/+I+GBXurhEoCsHXpG9twk4NO3bsu72GC9YtxIsiavjfRdhmNt0A/A==",
       "requires": {
         "ansi-html": "0.0.7",
         "array-includes": "3.0.3",
         "bonjour": "3.5.0",
-        "chokidar": "2.0.2",
+        "chokidar": "2.0.3",
         "compression": "1.7.2",
         "connect-history-api-fallback": "1.5.0",
         "debug": "3.1.0",
         "del": "3.0.0",
-        "express": "4.16.2",
+        "express": "4.16.3",
         "html-entities": "1.2.1",
         "http-proxy-middleware": "0.17.4",
         "import-local": "1.0.0",
@@ -15341,7 +17070,7 @@
         "ip": "1.1.5",
         "killable": "1.0.0",
         "loglevel": "1.6.1",
-        "opn": "5.2.0",
+        "opn": "5.3.0",
         "portfinder": "1.0.13",
         "selfsigned": "1.10.2",
         "serve-index": "1.9.1",
@@ -15349,9 +17078,10 @@
         "sockjs-client": "1.1.4",
         "spdy": "3.4.7",
         "strip-ansi": "3.0.1",
-        "supports-color": "5.2.0",
-        "webpack-dev-middleware": "1.12.2",
-        "yargs": "6.6.0"
+        "supports-color": "5.3.0",
+        "webpack-dev-middleware": "3.0.1",
+        "webpack-log": "1.1.2",
+        "yargs": "9.0.1"
       },
       "dependencies": {
         "anymatch": {
@@ -15359,14 +17089,14 @@
           "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-2.0.0.tgz",
           "integrity": "sha512-5teOsQWABXHHBFP9y3skS5P3d/WfWXpv3FUpy+LorMrNYaT9pI4oLMQX7jzQ2KklNpGpWHzdCXTDT2Y3XGlZBw==",
           "requires": {
-            "micromatch": "3.1.9",
+            "micromatch": "3.1.10",
             "normalize-path": "2.1.1"
           }
         },
         "chokidar": {
-          "version": "2.0.2",
-          "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-2.0.2.tgz",
-          "integrity": "sha512-l32Hw3wqB0L2kGVmSbK/a+xXLDrUEsc84pSgMkmwygHvD7ubRsP/vxxHa5BtB6oix1XLLVCHyYMsckRXxThmZw==",
+          "version": "2.0.3",
+          "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-2.0.3.tgz",
+          "integrity": "sha512-zW8iXYZtXMx4kux/nuZVXjkLP+CyIK5Al5FHnj1OgTKGZfp4Oy6/ymtMSKFv3GD8DviEmUPmJg9eFdJ/JzudMg==",
           "requires": {
             "anymatch": "2.0.0",
             "async-each": "1.0.1",
@@ -15422,19 +17152,39 @@
           }
         },
         "opn": {
-          "version": "5.2.0",
-          "resolved": "https://registry.npmjs.org/opn/-/opn-5.2.0.tgz",
-          "integrity": "sha512-Jd/GpzPyHF4P2/aNOVmS3lfMSWV9J7cOhCG1s08XCEAsPkB7lp6ddiU0J7XzyQRDUh8BqJ7PchfINjR8jyofRQ==",
+          "version": "5.3.0",
+          "resolved": "https://registry.npmjs.org/opn/-/opn-5.3.0.tgz",
+          "integrity": "sha512-bYJHo/LOmoTd+pfiYhfZDnf9zekVJrY+cnS2a5F2x+w5ppvTqObojTP7WiFG+kVZs9Inw+qQ/lw7TroWwhdd2g==",
           "requires": {
             "is-wsl": "1.1.0"
           }
+        },
+        "yargs": {
+          "version": "9.0.1",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-9.0.1.tgz",
+          "integrity": "sha1-UqzCP+7Kw0BCB47njAwAf1CF20w=",
+          "requires": {
+            "camelcase": "4.1.0",
+            "cliui": "3.2.0",
+            "decamelize": "1.2.0",
+            "get-caller-file": "1.0.2",
+            "os-locale": "2.1.0",
+            "read-pkg-up": "2.0.0",
+            "require-directory": "2.1.1",
+            "require-main-filename": "1.0.1",
+            "set-blocking": "2.0.0",
+            "string-width": "2.1.1",
+            "which-module": "2.0.0",
+            "y18n": "3.2.1",
+            "yargs-parser": "7.0.0"
+          }
         }
       }
     },
     "webpack-hot-middleware": {
-      "version": "2.21.1",
-      "resolved": "https://registry.npmjs.org/webpack-hot-middleware/-/webpack-hot-middleware-2.21.1.tgz",
-      "integrity": "sha512-HaxZpATbq/bpuduum2i79pgE1vpSFfV2BVUyYi4lhocTJ5xpofWuYCCmd0c6eoJjY8szCuM5TsQk3M59Z9jpwA==",
+      "version": "2.21.2",
+      "resolved": "https://registry.npmjs.org/webpack-hot-middleware/-/webpack-hot-middleware-2.21.2.tgz",
+      "integrity": "sha512-N5c80o31E0COFJV8HRjiX3hJetDOwQ2Ajt5TTORKA9diOimhFtmaZKSfO3pQKMeQngb7I4TUnNDroJiUzPFhKQ==",
       "requires": {
         "ansi-html": "0.0.7",
         "html-entities": "1.2.1",
@@ -15442,10 +17192,21 @@
         "strip-ansi": "3.0.1"
       }
     },
+    "webpack-log": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/webpack-log/-/webpack-log-1.1.2.tgz",
+      "integrity": "sha512-B53SD4N4BHpZdUwZcj4st2QT7gVfqZtqHDruC1N+K2sciq0Rt/3F1Dx6RlylVkcrToMLTaiaeT48k9Lq4iDVDA==",
+      "requires": {
+        "chalk": "2.3.2",
+        "log-symbols": "2.2.0",
+        "loglevelnext": "1.0.3",
+        "uuid": "3.2.1"
+      }
+    },
     "webpack-notifier": {
-      "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/webpack-notifier/-/webpack-notifier-1.5.1.tgz",
-      "integrity": "sha1-z19rmhcR+Alpu8T3vRXUDqexh2E=",
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/webpack-notifier/-/webpack-notifier-1.6.0.tgz",
+      "integrity": "sha1-/6yOVf+MRpdSuMG7sBGhbxCYbgI=",
       "requires": {
         "node-notifier": "5.2.1",
         "object-assign": "4.1.1",
@@ -15466,7 +17227,7 @@
       "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.7.0.tgz",
       "integrity": "sha1-DK+dLXVdk67gSdS90NP+LMoqJOs=",
       "requires": {
-        "http-parser-js": "0.4.10",
+        "http-parser-js": "0.4.11",
         "websocket-extensions": "0.1.3"
       }
     },
@@ -15566,12 +17327,11 @@
       "integrity": "sha1-o9XabNXAvAAI03I0u68b7WMFkQc="
     },
     "worker-farm": {
-      "version": "1.5.4",
-      "resolved": "https://registry.npmjs.org/worker-farm/-/worker-farm-1.5.4.tgz",
-      "integrity": "sha512-ITyClEvcfv0ozqJl1vmWFWhvI+OIrkbInYqkEPE50wFPXj8J9Gd3FYf8+CkZJXJJsQBYe+2DvmoK9Zhx5w8W+w==",
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/worker-farm/-/worker-farm-1.6.0.tgz",
+      "integrity": "sha512-6w+3tHbM87WnSWnENBUvA2pxJPLhQUg5LKwUQHq3r+XPhIM+Gh2R5ycbwPCyuGbNg+lPgdcnQUhuC02kJCvffQ==",
       "requires": {
-        "errno": "0.1.7",
-        "xtend": "4.0.1"
+        "errno": "0.1.7"
       }
     },
     "wrap-ansi": {
@@ -15625,10 +17385,10 @@
       "requires": {
         "chalk": "1.1.3",
         "debug": "2.6.9",
-        "filesize": "3.6.0",
+        "filesize": "3.6.1",
         "lodash": "4.15.0",
         "mkdirp": "0.5.1",
-        "moment": "2.20.1"
+        "moment": "2.21.0"
       },
       "dependencies": {
         "ansi-styles": {
@@ -15839,12 +17599,185 @@
         "camelcase": "4.1.0"
       }
     },
+    "yeoman-environment": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/yeoman-environment/-/yeoman-environment-2.0.5.tgz",
+      "integrity": "sha512-6/W7/B54OPHJXob0n0+pmkwFsirC8cokuQkPSmT/D0lCcSxkKtg/BA6ZnjUBIwjuGqmw3DTrT4en++htaUju5g==",
+      "requires": {
+        "chalk": "2.3.2",
+        "debug": "3.1.0",
+        "diff": "3.5.0",
+        "escape-string-regexp": "1.0.5",
+        "globby": "6.1.0",
+        "grouped-queue": "0.3.3",
+        "inquirer": "3.3.0",
+        "is-scoped": "1.0.0",
+        "lodash": "4.17.5",
+        "log-symbols": "2.2.0",
+        "mem-fs": "1.1.3",
+        "text-table": "0.2.0",
+        "untildify": "3.0.2"
+      },
+      "dependencies": {
+        "ansi-escapes": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-3.0.0.tgz",
+          "integrity": "sha512-O/klc27mWNUigtv0F8NJWbLF00OcegQalkqKURWdosW08YZKi4m6CnSUSvIZG1otNJbTWhN01Hhz389DW7mvDQ=="
+        },
+        "ansi-regex": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg="
+        },
+        "debug": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
+          "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
+          "requires": {
+            "ms": "2.0.0"
+          }
+        },
+        "inquirer": {
+          "version": "3.3.0",
+          "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-3.3.0.tgz",
+          "integrity": "sha512-h+xtnyk4EwKvFWHrUYsWErEVR+igKtLdchu+o0Z1RL7VU/jVMFbYir2bp6bAj8efFNxWqHX0dIss6fJQ+/+qeQ==",
+          "requires": {
+            "ansi-escapes": "3.0.0",
+            "chalk": "2.3.2",
+            "cli-cursor": "2.1.0",
+            "cli-width": "2.2.0",
+            "external-editor": "2.1.0",
+            "figures": "2.0.0",
+            "lodash": "4.17.5",
+            "mute-stream": "0.0.7",
+            "run-async": "2.3.0",
+            "rx-lite": "4.0.8",
+            "rx-lite-aggregates": "4.0.8",
+            "string-width": "2.1.1",
+            "strip-ansi": "4.0.0",
+            "through": "2.3.8"
+          }
+        },
+        "lodash": {
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
+          "requires": {
+            "ansi-regex": "3.0.0"
+          }
+        }
+      }
+    },
+    "yeoman-generator": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/yeoman-generator/-/yeoman-generator-2.0.3.tgz",
+      "integrity": "sha512-mODmrZ26a94djmGZZuIiomSGlN4wULdou29ZwcySupb2e9FdvoCl7Ps2FqHFjEHio3kOl/iBeaNqrnx3C3NwWg==",
+      "requires": {
+        "async": "2.6.0",
+        "chalk": "2.3.2",
+        "cli-table": "0.3.1",
+        "cross-spawn": "5.1.0",
+        "dargs": "5.1.0",
+        "dateformat": "3.0.3",
+        "debug": "3.1.0",
+        "detect-conflict": "1.0.1",
+        "error": "7.0.2",
+        "find-up": "2.1.0",
+        "github-username": "4.1.0",
+        "istextorbinary": "2.2.1",
+        "lodash": "4.17.5",
+        "make-dir": "1.2.0",
+        "mem-fs-editor": "3.0.2",
+        "minimist": "1.2.0",
+        "pretty-bytes": "4.0.2",
+        "read-chunk": "2.1.0",
+        "read-pkg-up": "3.0.0",
+        "rimraf": "2.6.2",
+        "run-async": "2.3.0",
+        "shelljs": "0.8.1",
+        "text-table": "0.2.0",
+        "through2": "2.0.3",
+        "yeoman-environment": "2.0.5"
+      },
+      "dependencies": {
+        "debug": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
+          "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
+          "requires": {
+            "ms": "2.0.0"
+          }
+        },
+        "load-json-file": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-4.0.0.tgz",
+          "integrity": "sha1-L19Fq5HjMhYjT9U62rZo607AmTs=",
+          "requires": {
+            "graceful-fs": "4.1.11",
+            "parse-json": "4.0.0",
+            "pify": "3.0.0",
+            "strip-bom": "3.0.0"
+          }
+        },
+        "lodash": {
+          "version": "4.17.5",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.5.tgz",
+          "integrity": "sha512-svL3uiZf1RwhH+cWrfZn3A4+U58wbP0tGVTLQPbjplZxZ8ROD9VLuNgsRniTlLe7OlSqR79RUehXgpBW/s0IQw=="
+        },
+        "minimist": {
+          "version": "1.2.0",
+          "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
+          "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
+        },
+        "parse-json": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-4.0.0.tgz",
+          "integrity": "sha1-vjX1Qlvh9/bHRxhPmKeIy5lHfuA=",
+          "requires": {
+            "error-ex": "1.3.1",
+            "json-parse-better-errors": "1.0.1"
+          }
+        },
+        "path-type": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/path-type/-/path-type-3.0.0.tgz",
+          "integrity": "sha512-T2ZUsdZFHgA3u4e5PfPbjd7HDDpxPnQb5jN0SrDsjNSuVXHJqtwTnWqG0B1jZrgmJ/7lj1EmVIByWt1gxGkWvg==",
+          "requires": {
+            "pify": "3.0.0"
+          }
+        },
+        "read-pkg": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-3.0.0.tgz",
+          "integrity": "sha1-nLxoaXj+5l0WwA4rGcI3/Pbjg4k=",
+          "requires": {
+            "load-json-file": "4.0.0",
+            "normalize-package-data": "2.4.0",
+            "path-type": "3.0.0"
+          }
+        },
+        "read-pkg-up": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-3.0.0.tgz",
+          "integrity": "sha1-PtSWaF26D4/hGNBpHcUfSh/5bwc=",
+          "requires": {
+            "find-up": "2.1.0",
+            "read-pkg": "3.0.0"
+          }
+        }
+      }
+    },
     "z-schema": {
       "version": "3.18.4",
       "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-3.18.4.tgz",
       "integrity": "sha512-DUOKC/IhbkdLKKiV89gw9DUauTV8U/8yJl1sjf6MtDmzevLKOF2duNJ495S3MFVjqZarr+qNGCPbkg4mu4PpLw==",
       "requires": {
-        "commander": "2.14.1",
+        "commander": "2.15.1",
         "lodash.get": "4.4.2",
         "lodash.isequal": "4.5.0",
         "validator": "8.2.0"
diff --git a/common/config/rush/pinned-versions.json b/common/config/rush/pinned-versions.json
index 9e26dfeeb6e64..41e366f21ccc3 100644
--- a/common/config/rush/pinned-versions.json
+++ b/common/config/rush/pinned-versions.json
@@ -1 +1,3 @@
-{}
\ No newline at end of file
+{
+  "webpack": "3.10.0"
+}
\ No newline at end of file
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 905ce4a6572db..65a18a2e82033 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -3,7 +3,9 @@
   "version": "5.4.0",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
-  "typings": "lib/index.d.ts",
+  "module": "lib-es2015/index.js",
+  "typings": "lib-es2015/index.d.ts",
+  "sideEffects": false,
   "repository": {
     "type": "git",
     "url": "https://github.com/OfficeDev/office-ui-fabric-react"
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 03f621b938c56..2e87388f59ae7 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -3,7 +3,9 @@
   "version": "5.26.1",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
-  "typings": "lib/index.d.ts",
+  "module": "lib-es2015/index.js",
+  "typings": "lib-es2015/index.d.ts",
+  "sideEffects": false,
   "repository": {
     "type": "git",
     "url": "https://github.com/OfficeDev/office-ui-fabric-react"
diff --git a/packages/file-type-icons/package.json b/packages/file-type-icons/package.json
index af9890badeca7..bcbf7e3f64e79 100644
--- a/packages/file-type-icons/package.json
+++ b/packages/file-type-icons/package.json
@@ -3,7 +3,9 @@
   "version": "0.5.0",
   "description": "Office UI Fabric file type icon set.",
   "main": "lib/index.js",
-  "typings": "lib/index.d.ts",
+  "module": "lib-es2015/index.js",
+  "typings": "lib-es2015/index.d.ts",
+  "sideEffects": false,
   "repository": {
     "type": "git",
     "url": "https://github.com/OfficeDev/office-ui-fabric-react"
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 79e78da8e7f72..d5bd3fa8acfa9 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -3,7 +3,9 @@
   "version": "5.6.0",
   "description": "Office UI Fabric icon set.",
   "main": "lib/index.js",
-  "typings": "lib/index.d.ts",
+  "module": "lib-es2015/index.js",
+  "typings": "lib-es2015/index.d.ts",
+  "sideEffects": false,
   "repository": {
     "type": "git",
     "url": "https://github.com/OfficeDev/office-ui-fabric-react"
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index 9f043ff386328..63a56a9f8061a 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -3,7 +3,9 @@
   "version": "5.13.0",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
-  "typings": "lib/index.d.ts",
+  "module": "lib-es2015/index.js",
+  "typings": "lib-es2015/index.d.ts",
+  "sideEffects": false,
   "repository": {
     "type": "git",
     "url": "https://github.com/OfficeDev/office-ui-fabric-react"
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index face60267270b..180b187ed9835 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -3,12 +3,13 @@
   "version": "5.69.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
-  "typings": "lib/index.d.ts",
+  "module": "lib-es2015/index.js",
+  "typings": "lib-es2015/index.d.ts",
+  "sideEffects": false,
   "repository": {
     "type": "git",
     "url": "https://github.com/OfficeDev/office-ui-fabric-react"
   },
-  "sideEffects": false,
   "license": "MIT",
   "scripts": {
     "build": "node ../../scripts/build.js",
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 4957aac4bf5cb..1caf7c7b40571 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -8,7 +8,9 @@
   },
   "license": "MIT",
   "main": "lib/index.js",
-  "typings": "lib/index.d.ts",
+  "module": "lib-es2015/index.js",
+  "typings": "lib-es2015/index.d.ts",
+  "sideEffects": false,
   "scripts": {
     "build": "node ../../scripts/build.js",
     "clean": "node ../../scripts/clean.js",
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index dcf488b63db50..3a3f4d9d6d563 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -3,7 +3,9 @@
   "version": "5.20.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
-  "typings": "lib/index.d.ts",
+  "module": "lib-es2015/index.js",
+  "typings": "lib-es2015/index.d.ts",
+  "sideEffects": false,
   "repository": {
     "type": "git",
     "url": "https://github.com/OfficeDev/office-ui-fabric-react"
diff --git a/packages/variants/package.json b/packages/variants/package.json
index 25a7aac3a3bea..909d5b5d2d5a0 100644
--- a/packages/variants/package.json
+++ b/packages/variants/package.json
@@ -3,7 +3,9 @@
   "version": "5.2.0",
   "description": "Office UI Fabric subtheme generator.",
   "main": "lib/index.js",
-  "typings": "lib/index.d.ts",
+  "module": "lib-es2015/index.js",
+  "typings": "lib-es2015/index.d.ts",
+  "sideEffects": false,
   "repository": {
     "type": "git",
     "url": "https://github.com/OfficeDev/office-ui-fabric-react"
diff --git a/scripts/package.json b/scripts/package.json
index 3f826323130d7..45efaee927136 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -13,7 +13,7 @@
     "@microsoft/loader-load-themed-styles": "^1.6.0",
     "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
     "autoprefixer": "^7.1.5",
-    "awesome-typescript-loader": "^3.2.3",
+    "awesome-typescript-loader": "^4.0.1",
     "bundlesize": "^0.15.2",
     "chalk": "^2.1.0",
     "command-line-args": "^4.0.7",
@@ -22,9 +22,8 @@
     "github": "^7.0.0",
     "glob": "^7.1.2",
     "gzip-size": "^3.0.0",
-    "json-loader": "^0.5.7",
     "jest": "^21.2.0",
-    "ts-jest": "^21.1.2",
+    "json-loader": "^0.5.7",
     "mustache": "^2.3.0",
     "node-sass": "^4.5.3",
     "open": "^0.0.5",
@@ -36,19 +35,20 @@
     "sass-loader": "^6.0.6",
     "source-map-loader": "^0.2.1",
     "style-loader": "^0.19.0",
+    "ts-jest": "^21.1.2",
     "tslint": "^5.7.0",
     "tslint-microsoft-contrib": "^5.0.1",
     "typescript": "2.7.2",
-    "uglifyjs-webpack-plugin": "^0.4.6",
-    "webpack": "^3.7.1",
-    "webpack-bundle-analyzer": "^2.9.0",
-    "webpack-dev-server": "^2.7.1",
-    "webpack-notifier": "^1.5.0",
+    "webpack": "^4.1.1",
+    "webpack-bundle-analyzer": "^2.11.1",
+    "webpack-cli": "^2.0.12",
+    "webpack-dev-server": "^3.1.1",
+    "webpack-notifier": "^1.6.0",
     "yargs": "^6.5.0"
   },
   "bundlesize": [
     {
-      "path": "../apps/test-bundle-button/dist/main.min.js",
+      "path": "../apps/test-bundle-button/dist/test-bundle-button.min.js",
       "maxSize": "45.5 kB"
     }
   ]
diff --git a/scripts/tasks/ts.js b/scripts/tasks/ts.js
index 57508c4d68d9a..4730eeb2e9489 100644
--- a/scripts/tasks/ts.js
+++ b/scripts/tasks/ts.js
@@ -7,9 +7,9 @@ module.exports = function (options) {
   const extraParams = '--pretty' + (options.isProduction ? ` --inlineSources --sourceRoot ${path.relative(libPath, srcPath)}` : '');
 
   execSync(typescriptPath + ' -outDir lib -t es5 -m commonjs ' + extraParams);
+  execSync(typescriptPath + ' -outDir lib-es2015 -t es5 -m es2015 ' + extraParams);
 
   if (options.isProduction) {
     execSync(typescriptPath + ' -outDir lib-amd -t es5 -m amd ' + extraParams);
-    execSync(typescriptPath + ' -outDir lib-es2015 -t es5 -m es2015 ' + extraParams);
   }
 };
\ No newline at end of file
diff --git a/scripts/tasks/webpack-resources.js b/scripts/tasks/webpack-resources.js
index 49eff5d00ccbe..9277de93e5892 100644
--- a/scripts/tasks/webpack-resources.js
+++ b/scripts/tasks/webpack-resources.js
@@ -2,6 +2,9 @@ const webpack = require('webpack');
 const path = require('path');
 const merge = require('./merge');
 
+const webpackVersion = require('webpack/package.json').version;
+console.log(`Webpack version: ${webpackVersion}`);
+
 module.exports = {
   webpack,
 
@@ -16,33 +19,28 @@ module.exports = {
 
     const module = {
       noParse: [/autoit.js/],
-      loaders: [
+      rules: [
         {
           test: /\.js$/,
-          loader: 'source-map-loader',
+          use: 'source-map-loader',
           enforce: 'pre'
-        },
-        {
-          test: /\.json$/,
-          loader: 'json-loader'
         }
       ]
     };
 
-    const stats = 'errors-only';
     const devtool = 'source-map';
     const configs = [];
 
     if (!onlyProduction) {
       configs.push(merge(
         {
+          mode: 'development',
           output: {
             filename: `[name].js`,
             path: path.resolve(process.cwd(), 'dist')
           },
           resolveLoader,
           module,
-          stats,
           devtool,
           plugins: getPlugins(packageName, false)
         },
@@ -52,13 +50,14 @@ module.exports = {
 
     if (isProduction) {
       configs.push(merge({
+        mode: 'production',
         output: {
           filename: `[name].min.js`,
           path: path.resolve(process.cwd(), 'dist')
         },
+
         resolveLoader,
         module,
-        stats,
         devtool,
         plugins: getPlugins(packageName, true)
       }, customConfig));
@@ -77,13 +76,14 @@ module.exports = {
           port: 4322
         },
 
+        mode: 'development',
+
         resolveLoader: {
           modules: [
             path.resolve(__dirname, '../node_modules'),
             path.resolve(process.cwd(), 'node_modules')
           ]
         },
-
         resolve: {
           extensions: ['.ts', '.tsx', '.js']
         },
@@ -91,21 +91,14 @@ module.exports = {
         devtool: 'source-map',
 
         module: {
-          loaders: [
-            {
-              test: [/\.json$/],
-              enforce: 'pre',
-              loader: 'json-loader',
-              exclude: [
-                /node_modules/
-              ]
-            },
+          rules: [
             {
               test: [/\.tsx?$/],
-              loader: 'awesome-typescript-loader',
+              use: 'awesome-typescript-loader',
               exclude: [
                 /node_modules/,
-                /\.scss.ts$/
+                /\.scss.ts$/,
+                /\.test.tsx?$/
               ]
             },
             {
@@ -116,10 +109,10 @@ module.exports = {
               ],
               use: [
                 {
-                  loader: "@microsoft/loader-load-themed-styles", // creates style nodes from JS strings
+                  loader: '@microsoft/loader-load-themed-styles', // creates style nodes from JS strings
                 },
                 {
-                  loader: "css-loader", // translates CSS into CommonJS
+                  loader: 'css-loader', // translates CSS into CommonJS
                   options: {
                     modules: true,
                     importLoaders: 2,
@@ -129,7 +122,6 @@ module.exports = {
                 },
                 {
                   loader: 'postcss-loader',
-
                   options: {
                     plugins: function () {
                       return [
@@ -139,7 +131,7 @@ module.exports = {
                   }
                 },
                 {
-                  loader: 'sass-loader',
+                  loader: 'sass-loader'
                 }
               ]
             }
@@ -147,7 +139,11 @@ module.exports = {
         },
 
         plugins: [
-          new WebpackNotifierPlugin()
+          new WebpackNotifierPlugin(),
+          new webpack.WatchIgnorePlugin([
+            /\.js$/,
+            /\.d\.ts$/
+          ])
         ]
       },
       customConfig
@@ -160,21 +156,13 @@ function getPlugins(
   bundleName,
   isProduction
 ) {
-  const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
   const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
+
   const plugins = [];
 
   if (isProduction) {
+
     plugins.push(
-      new webpack.DefinePlugin({
-        'process.env.NODE_ENV': JSON.stringify('production')
-      }),
-      new UglifyJsPlugin({
-        uglifyOptions: {
-          compress: true,
-          warnings: false
-        }
-      }),
       new BundleAnalyzerPlugin({
         analyzerMode: 'static',
         reportFilename: bundleName + '.stats.html',

From e4bbe9d77457b823703b66bb562042a29bc15f8a Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sat, 24 Mar 2018 16:27:19 -0700
Subject: [PATCH 1639/1641] bump (#4356)

---
 apps/ssr-tests/package.json            |  2 +-
 common/config/rush/npm-shrinkwrap.json | 34 +++++++++++++-------------
 scripts/package.json                   |  2 +-
 3 files changed, 19 insertions(+), 19 deletions(-)

diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 532eed4dd3b6a..87f1d16952ba4 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -25,7 +25,7 @@
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
-    "webpack": "^4.1.1"
+    "webpack": "^4.2.0"
   },
   "dependencies": {
     "es6-promise": "^4.1.0",
diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index bd5039fd10d98..6508c0add6657 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -88,7 +88,7 @@
     },
     "@rush-temp/build": {
       "version": "file:projects/build.tgz",
-      "integrity": "sha1-wgwnYK3aqBoZq2/68SzBfhndTTA=",
+      "integrity": "sha1-SoAgkfCxTpEWHaZnUUUqWG57E90=",
       "requires": {
         "@microsoft/api-extractor": "4.3.7",
         "@microsoft/load-themed-styles": "1.7.45",
@@ -188,7 +188,7 @@
     },
     "@rush-temp/example-app-base": {
       "version": "file:projects/example-app-base.tgz",
-      "integrity": "sha1-qYZQRj+VLq8/PWZ3P6JRpD1bx4I=",
+      "integrity": "sha1-KBva74B+4R/VvJvth3u0svJ2+Js=",
       "requires": {
         "@types/es6-promise": "0.0.32",
         "@types/highlight.js": "9.12.2",
@@ -207,7 +207,7 @@
     },
     "@rush-temp/experiments": {
       "version": "file:projects/experiments.tgz",
-      "integrity": "sha1-zyOzTiJ5YsFwZ00iLSww0iph4X8=",
+      "integrity": "sha1-7Q/37MuRfPHefGJwRc2cF23AZ0I=",
       "requires": {
         "@microsoft/load-themed-styles": "1.7.45",
         "@types/enzyme": "3.1.5",
@@ -236,7 +236,7 @@
     },
     "@rush-temp/fabric-website": {
       "version": "file:projects/fabric-website.tgz",
-      "integrity": "sha1-mkT2ZpaqlyR6lvRg4J6G56KRVKI=",
+      "integrity": "sha1-KJ5KzQJBNsQaRum/kQkDYY+eMt0=",
       "requires": {
         "@microsoft/load-themed-styles": "1.7.45",
         "@types/es6-promise": "0.0.32",
@@ -261,7 +261,7 @@
     },
     "@rush-temp/file-type-icons": {
       "version": "file:projects/file-type-icons.tgz",
-      "integrity": "sha1-Y1O/QMmpV8V1rPmUiyN4UZfcD90=",
+      "integrity": "sha1-QQ1CJ3onYpdMuk7QnW1h1I6WSVw=",
       "requires": {
         "@types/react": "16.0.25",
         "@types/react-dom": "16.0.3",
@@ -272,21 +272,21 @@
     },
     "@rush-temp/icons": {
       "version": "file:projects/icons.tgz",
-      "integrity": "sha1-/2btbHqP+ggGK1q1Yb593fDPwRM=",
+      "integrity": "sha1-44+W11Nu+5a8gcagJeUQbbJJ+Gw=",
       "requires": {
         "tslib": "1.9.0"
       }
     },
     "@rush-temp/jest-serializer-merge-styles": {
       "version": "file:projects/jest-serializer-merge-styles.tgz",
-      "integrity": "sha1-W64IPf+x4NoEhFEZ4ct2MFwL8SA=",
+      "integrity": "sha1-Pmde7S9Sm08+2JWxbjS5gg/vimQ=",
       "requires": {
         "@types/jest": "21.1.8"
       }
     },
     "@rush-temp/merge-styles": {
       "version": "file:projects/merge-styles.tgz",
-      "integrity": "sha1-cAHy+AQzUaVYj7PHcFbfIeHnrO4=",
+      "integrity": "sha1-SppxNZID8vHUldcrSie2QxrFC1c=",
       "requires": {
         "@types/jest": "21.1.8",
         "tslib": "1.9.0"
@@ -294,7 +294,7 @@
     },
     "@rush-temp/office-ui-fabric-react": {
       "version": "file:projects/office-ui-fabric-react.tgz",
-      "integrity": "sha1-d/FaNKh7mwofn/6kAUhdU6ubH20=",
+      "integrity": "sha1-T78IJRGICOZfsf3pshlfJEhGotA=",
       "requires": {
         "@microsoft/load-themed-styles": "1.7.45",
         "@types/enzyme": "3.1.5",
@@ -327,14 +327,14 @@
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
       "version": "file:projects/office-ui-fabric-react-tslint.tgz",
-      "integrity": "sha1-gizhjteVUw3ShXwHcH8yvhIscqc=",
+      "integrity": "sha1-rK/GrmYk9NkFNHUL1jKTuDFx1o8=",
       "requires": {
         "tslint-react": "3.5.1"
       }
     },
     "@rush-temp/ssr-tests": {
       "version": "file:projects/ssr-tests.tgz",
-      "integrity": "sha1-bsUsrox3gqvybQ5RM0Oe0e34g4A=",
+      "integrity": "sha1-76IWsoPWbqC4O/zkYs+I6fCyGJw=",
       "requires": {
         "@microsoft/load-themed-styles": "1.7.45",
         "@types/es6-promise": "0.0.32",
@@ -409,7 +409,7 @@
     },
     "@rush-temp/styling": {
       "version": "file:projects/styling.tgz",
-      "integrity": "sha1-Vasx0FoVOvlV87LmX+fqMtA0Xv0=",
+      "integrity": "sha1-RX6AKkNOqVOqAp3cCzJspClqih4=",
       "requires": {
         "@microsoft/load-themed-styles": "1.7.45",
         "@types/jest": "21.1.8",
@@ -424,7 +424,7 @@
     },
     "@rush-temp/test-bundle-button": {
       "version": "file:projects/test-bundle-button.tgz",
-      "integrity": "sha1-M454bpbqEeK+5gB+DKCyFRyAf+E=",
+      "integrity": "sha1-qoRfMqgV1Icn3Rs3xx88L0+7m8s=",
       "requires": {
         "@types/prop-types": "15.5.2",
         "@types/react": "16.0.25",
@@ -437,7 +437,7 @@
     },
     "@rush-temp/todo-app": {
       "version": "file:projects/todo-app.tgz",
-      "integrity": "sha1-heuPr0wLdItgH7nQe1W8qilWEG0=",
+      "integrity": "sha1-SuF62/C0N5IAPphEoCLr2QE20H4=",
       "requires": {
         "@microsoft/load-themed-styles": "1.7.45",
         "@types/es6-promise": "0.0.32",
@@ -454,7 +454,7 @@
     },
     "@rush-temp/utilities": {
       "version": "file:projects/utilities.tgz",
-      "integrity": "sha1-gq+TrBQAwtPx2YrnqPR4+y3IHt0=",
+      "integrity": "sha1-pfI86PFgbQ9xI0fDBv/O6ovFWAM=",
       "requires": {
         "@microsoft/load-themed-styles": "1.7.45",
         "@types/enzyme": "3.1.5",
@@ -475,7 +475,7 @@
     },
     "@rush-temp/variants": {
       "version": "file:projects/variants.tgz",
-      "integrity": "sha1-vq/Fgs1jci3SQRI+xjBSOVhIH2A=",
+      "integrity": "sha1-V1INEh6mmTzAx/UlEzR8BoulgcE=",
       "requires": {
         "@types/jest": "21.1.8",
         "tslib": "1.9.0"
@@ -483,7 +483,7 @@
     },
     "@rush-temp/vr-tests": {
       "version": "file:projects/vr-tests.tgz",
-      "integrity": "sha1-zvzwF8Jw05XWzEHPOej1ls48MFE=",
+      "integrity": "sha1-zHYPih8/xXmUDNZrSJTzkiGzNH4=",
       "requires": {
         "@storybook/addon-options": "3.2.3",
         "@storybook/react": "3.3.15",
diff --git a/scripts/package.json b/scripts/package.json
index 45efaee927136..44160eccef88e 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -39,7 +39,7 @@
     "tslint": "^5.7.0",
     "tslint-microsoft-contrib": "^5.0.1",
     "typescript": "2.7.2",
-    "webpack": "^4.1.1",
+    "webpack": "^4.2.0",
     "webpack-bundle-analyzer": "^2.11.1",
     "webpack-cli": "^2.0.12",
     "webpack-dev-server": "^3.1.1",

From f6b4b161b53f1d39585ae8405d0147a0f75f294c Mon Sep 17 00:00:00 2001
From: OneDrive Build <odbuild@microsoft.com>
Date: Sun, 25 Mar 2018 03:08:04 +0000
Subject: [PATCH 1640/1641] Applying package updates.

---
 apps/fabric-website/package.json              |  2 +-
 apps/ssr-tests/package.json                   |  2 +-
 apps/test-bundle-button/package.json          |  2 +-
 apps/todo-app/package.json                    |  2 +-
 apps/vr-tests/package.json                    |  2 +-
 .../webpack-4_2018-03-20-01-01.json           | 11 ----
 ...h-BaseComponent-type_2018-03-21-08-31.json | 11 ----
 .../experiments/signals_2018-03-22-21-03.json | 11 ----
 .../webpack-4_2018-03-20-01-01.json           | 11 ----
 .../webpack-4_2018-03-20-01-01.json           | 11 ----
 .../icons/webpack-4_2018-03-20-01-01.json     | 11 ----
 .../webpack-4_2018-03-20-01-01.json           | 11 ----
 .../styling/webpack-4_2018-03-20-01-01.json   | 11 ----
 ...h-BaseComponent-type_2018-03-21-08-31.json | 11 ----
 .../utilities/webpack-4_2018-03-20-01-01.json | 11 ----
 .../variants/webpack-4_2018-03-20-01-01.json  | 11 ----
 .../detailsheader_2018-03-23-21-41.json       | 11 ----
 ...box-scrolling-to-end_2018-03-23-19-17.json | 11 ----
 ...h-BaseComponent-type_2018-03-21-08-31.json | 11 ----
 .../stanleyy-fillin_2018-03-23-20-45.json     | 11 ----
 .../webpack-4_2018-03-20-01-01.json           | 11 ----
 packages/example-app-base/CHANGELOG.json      | 22 ++++++++
 packages/example-app-base/CHANGELOG.md        |  9 +++-
 packages/example-app-base/package.json        |  6 +--
 packages/experiments/CHANGELOG.json           | 40 ++++++++++++++
 packages/experiments/CHANGELOG.md             | 14 ++++-
 packages/experiments/package.json             | 10 ++--
 packages/file-type-icons/CHANGELOG.json       | 19 +++++++
 packages/file-type-icons/CHANGELOG.md         |  9 +++-
 packages/file-type-icons/package.json         |  4 +-
 packages/icons/CHANGELOG.json                 | 19 +++++++
 packages/icons/CHANGELOG.md                   |  9 +++-
 packages/icons/package.json                   |  4 +-
 .../jest-serializer-merge-styles/package.json |  2 +-
 packages/merge-styles/CHANGELOG.json          | 14 +++++
 packages/merge-styles/CHANGELOG.md            |  9 +++-
 packages/merge-styles/package.json            |  2 +-
 .../office-ui-fabric-react/CHANGELOG.json     | 53 +++++++++++++++++++
 packages/office-ui-fabric-react/CHANGELOG.md  | 16 +++++-
 packages/office-ui-fabric-react/package.json  | 12 ++---
 packages/styling/CHANGELOG.json               | 22 ++++++++
 packages/styling/CHANGELOG.md                 |  9 +++-
 packages/styling/package.json                 |  6 +--
 packages/utilities/CHANGELOG.json             | 24 +++++++++
 packages/utilities/CHANGELOG.md               | 10 +++-
 packages/utilities/package.json               |  4 +-
 packages/variants/CHANGELOG.json              | 19 +++++++
 packages/variants/CHANGELOG.md                |  9 +++-
 packages/variants/package.json                |  4 +-
 scripts/package.json                          |  2 +-
 50 files changed, 350 insertions(+), 218 deletions(-)
 delete mode 100644 common/changes/@uifabric/example-app-base/webpack-4_2018-03-20-01-01.json
 delete mode 100644 common/changes/@uifabric/experiments/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
 delete mode 100644 common/changes/@uifabric/experiments/signals_2018-03-22-21-03.json
 delete mode 100644 common/changes/@uifabric/experiments/webpack-4_2018-03-20-01-01.json
 delete mode 100644 common/changes/@uifabric/file-type-icons/webpack-4_2018-03-20-01-01.json
 delete mode 100644 common/changes/@uifabric/icons/webpack-4_2018-03-20-01-01.json
 delete mode 100644 common/changes/@uifabric/merge-styles/webpack-4_2018-03-20-01-01.json
 delete mode 100644 common/changes/@uifabric/styling/webpack-4_2018-03-20-01-01.json
 delete mode 100644 common/changes/@uifabric/utilities/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
 delete mode 100644 common/changes/@uifabric/utilities/webpack-4_2018-03-20-01-01.json
 delete mode 100644 common/changes/@uifabric/variants/webpack-4_2018-03-20-01-01.json
 delete mode 100644 common/changes/office-ui-fabric-react/detailsheader_2018-03-23-21-41.json
 delete mode 100644 common/changes/office-ui-fabric-react/keyou-fix-combobox-scrolling-to-end_2018-03-23-19-17.json
 delete mode 100644 common/changes/office-ui-fabric-react/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
 delete mode 100644 common/changes/office-ui-fabric-react/stanleyy-fillin_2018-03-23-20-45.json
 delete mode 100644 common/changes/office-ui-fabric-react/webpack-4_2018-03-20-01-01.json

diff --git a/apps/fabric-website/package.json b/apps/fabric-website/package.json
index 8890af7bcd6fb..8d6e9cd261026 100644
--- a/apps/fabric-website/package.json
+++ b/apps/fabric-website/package.json
@@ -39,7 +39,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "color-functions": "1.1.0",
     "json-loader": "^0.5.7",
-    "office-ui-fabric-react": ">=5.69.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.70.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/ssr-tests/package.json b/apps/ssr-tests/package.json
index 87f1d16952ba4..1b9b765b8619b 100644
--- a/apps/ssr-tests/package.json
+++ b/apps/ssr-tests/package.json
@@ -21,7 +21,7 @@
     "@types/mocha": "2.2.39",
     "@types/webpack-env": "1.13.0",
     "mocha": "^3.3.0",
-    "office-ui-fabric-react": ">=5.69.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.70.0 <6.0.0",
     "raw-loader": "^0.5.1",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
diff --git a/apps/test-bundle-button/package.json b/apps/test-bundle-button/package.json
index 980d69d34ae7d..bf73d992f01a9 100644
--- a/apps/test-bundle-button/package.json
+++ b/apps/test-bundle-button/package.json
@@ -25,7 +25,7 @@
   "dependencies": {
     "react": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
     "react-dom": "^0.14 || ^15.0.1-0 || ^16.0.0-0",
-    "office-ui-fabric-react": ">=5.69.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.70.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/apps/todo-app/package.json b/apps/todo-app/package.json
index cc0c94086caec..162f0985478fd 100644
--- a/apps/todo-app/package.json
+++ b/apps/todo-app/package.json
@@ -19,7 +19,7 @@
     "@microsoft/load-themed-styles": "^1.7.13",
     "es6-promise": "^4.1.0",
     "immutability-helper": "^2.6.4",
-    "office-ui-fabric-react": ">=5.69.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.70.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/apps/vr-tests/package.json b/apps/vr-tests/package.json
index baba6bf0bda34..7b481c20aa808 100644
--- a/apps/vr-tests/package.json
+++ b/apps/vr-tests/package.json
@@ -28,7 +28,7 @@
     "storybook-readme": "=3.0.6"
   },
   "dependencies": {
-    "office-ui-fabric-react": ">=5.69.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.70.0 <6.0.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "typescript": "2.7.2",
diff --git a/common/changes/@uifabric/example-app-base/webpack-4_2018-03-20-01-01.json b/common/changes/@uifabric/example-app-base/webpack-4_2018-03-20-01-01.json
deleted file mode 100644
index 93634b7a6b11a..0000000000000
--- a/common/changes/@uifabric/example-app-base/webpack-4_2018-03-20-01-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/example-app-base",
-      "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/example-app-base",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json b/common/changes/@uifabric/experiments/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
deleted file mode 100644
index 110fc80a26052..0000000000000
--- a/common/changes/@uifabric/experiments/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Update componentRef types",
-      "type": "patch"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "mark@thedutchies.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/experiments/signals_2018-03-22-21-03.json b/common/changes/@uifabric/experiments/signals_2018-03-22-21-03.json
deleted file mode 100644
index 95f7eb77288c3..0000000000000
--- a/common/changes/@uifabric/experiments/signals_2018-03-22-21-03.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Add missing icons to Signals and fix colors",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "tmichon@microsoft.com"
-}
diff --git a/common/changes/@uifabric/experiments/webpack-4_2018-03-20-01-01.json b/common/changes/@uifabric/experiments/webpack-4_2018-03-20-01-01.json
deleted file mode 100644
index 58b294799c1b6..0000000000000
--- a/common/changes/@uifabric/experiments/webpack-4_2018-03-20-01-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/experiments",
-      "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/experiments",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/file-type-icons/webpack-4_2018-03-20-01-01.json b/common/changes/@uifabric/file-type-icons/webpack-4_2018-03-20-01-01.json
deleted file mode 100644
index ce67c7d68883a..0000000000000
--- a/common/changes/@uifabric/file-type-icons/webpack-4_2018-03-20-01-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/file-type-icons",
-      "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/file-type-icons",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/icons/webpack-4_2018-03-20-01-01.json b/common/changes/@uifabric/icons/webpack-4_2018-03-20-01-01.json
deleted file mode 100644
index a21fe7182eec1..0000000000000
--- a/common/changes/@uifabric/icons/webpack-4_2018-03-20-01-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/icons",
-      "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/icons",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/merge-styles/webpack-4_2018-03-20-01-01.json b/common/changes/@uifabric/merge-styles/webpack-4_2018-03-20-01-01.json
deleted file mode 100644
index 2d25d0412e8fd..0000000000000
--- a/common/changes/@uifabric/merge-styles/webpack-4_2018-03-20-01-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/merge-styles",
-      "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/merge-styles",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/styling/webpack-4_2018-03-20-01-01.json b/common/changes/@uifabric/styling/webpack-4_2018-03-20-01-01.json
deleted file mode 100644
index 9beb2b6288986..0000000000000
--- a/common/changes/@uifabric/styling/webpack-4_2018-03-20-01-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/styling",
-      "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/styling",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json b/common/changes/@uifabric/utilities/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
deleted file mode 100644
index 44f253f09522b..0000000000000
--- a/common/changes/@uifabric/utilities/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Update createRef type",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "mark@thedutchies.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/utilities/webpack-4_2018-03-20-01-01.json b/common/changes/@uifabric/utilities/webpack-4_2018-03-20-01-01.json
deleted file mode 100644
index 7c142c58f2b4f..0000000000000
--- a/common/changes/@uifabric/utilities/webpack-4_2018-03-20-01-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/utilities",
-      "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/utilities",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/@uifabric/variants/webpack-4_2018-03-20-01-01.json b/common/changes/@uifabric/variants/webpack-4_2018-03-20-01-01.json
deleted file mode 100644
index f23584c6677c5..0000000000000
--- a/common/changes/@uifabric/variants/webpack-4_2018-03-20-01-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "@uifabric/variants",
-      "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl",
-      "type": "minor"
-    }
-  ],
-  "packageName": "@uifabric/variants",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/detailsheader_2018-03-23-21-41.json b/common/changes/office-ui-fabric-react/detailsheader_2018-03-23-21-41.json
deleted file mode 100644
index 5e6e92f01e3a8..0000000000000
--- a/common/changes/office-ui-fabric-react/detailsheader_2018-03-23-21-41.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "DetailsHeader: reverting how maxWidth is handled to previous behavior.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/keyou-fix-combobox-scrolling-to-end_2018-03-23-19-17.json b/common/changes/office-ui-fabric-react/keyou-fix-combobox-scrolling-to-end_2018-03-23-19-17.json
deleted file mode 100644
index a91ada3c211a8..0000000000000
--- a/common/changes/office-ui-fabric-react/keyou-fix-combobox-scrolling-to-end_2018-03-23-19-17.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Fix bug in combo box where _selectedElement ref wasn't being set conditionally",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "keyou@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json b/common/changes/office-ui-fabric-react/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
deleted file mode 100644
index 39fa5bda11fe9..0000000000000
--- a/common/changes/office-ui-fabric-react/make-sure-componentRef-types-match-BaseComponent-type_2018-03-21-08-31.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Update componentRef types",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "mark@thedutchies.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/stanleyy-fillin_2018-03-23-20-45.json b/common/changes/office-ui-fabric-react/stanleyy-fillin_2018-03-23-20-45.json
deleted file mode 100644
index 0b24d5ac7f85b..0000000000000
--- a/common/changes/office-ui-fabric-react/stanleyy-fillin_2018-03-23-20-45.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "ComboBox: Add some code comments. Minor bug fixes to the example page.",
-      "type": "patch"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "stanleyy@microsoft.com"
-}
\ No newline at end of file
diff --git a/common/changes/office-ui-fabric-react/webpack-4_2018-03-20-01-01.json b/common/changes/office-ui-fabric-react/webpack-4_2018-03-20-01-01.json
deleted file mode 100644
index de156a4aa02a2..0000000000000
--- a/common/changes/office-ui-fabric-react/webpack-4_2018-03-20-01-01.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-  "changes": [
-    {
-      "packageName": "office-ui-fabric-react",
-      "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` flags on all applicable packages.",
-      "type": "minor"
-    }
-  ],
-  "packageName": "office-ui-fabric-react",
-  "email": "dzearing@microsoft.com"
-}
\ No newline at end of file
diff --git a/packages/example-app-base/CHANGELOG.json b/packages/example-app-base/CHANGELOG.json
index 2089221166800..0b0ba5e3bd450 100644
--- a/packages/example-app-base/CHANGELOG.json
+++ b/packages/example-app-base/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/example-app-base",
   "entries": [
+    {
+      "version": "5.5.0",
+      "tag": "@uifabric/example-app-base_v5.5.0",
+      "date": "Sun, 25 Mar 2018 03:08:03 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "38089072c6e7f877d572cd2248b8d67adfefb963",
+            "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.20.0 <6.0.0` to `>=5.21.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.20.0 <6.0.0` to `>=5.21.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.4.0",
       "tag": "@uifabric/example-app-base_v5.4.0",
diff --git a/packages/example-app-base/CHANGELOG.md b/packages/example-app-base/CHANGELOG.md
index ce37baebd60f1..935339b742cdc 100644
--- a/packages/example-app-base/CHANGELOG.md
+++ b/packages/example-app-base/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/example-app-base
 
-This log was last generated on Mon, 19 Mar 2018 10:27:55 GMT and should not be manually modified.
+This log was last generated on Sun, 25 Mar 2018 03:08:03 GMT and should not be manually modified.
+
+## 5.5.0
+Sun, 25 Mar 2018 03:08:03 GMT
+
+### Minor changes
+
+- Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl
 
 ## 5.4.0
 Mon, 19 Mar 2018 10:27:55 GMT
diff --git a/packages/example-app-base/package.json b/packages/example-app-base/package.json
index 65a18a2e82033..a7efef5c98b3b 100644
--- a/packages/example-app-base/package.json
+++ b/packages/example-app-base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/example-app-base",
-  "version": "5.4.0",
+  "version": "5.5.0",
   "description": "Office UI Fabric example app base utilities for building example sites.",
   "main": "lib/index.js",
   "module": "lib-es2015/index.js",
@@ -34,8 +34,8 @@
     "react-dom": "^0.14.9 || ^15.0.1-0 || ^16.0.0-0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.20.0 <6.0.0",
-    "@uifabric/utilities": ">=5.20.0 <6.0.0",
+    "@uifabric/styling": ">=5.21.0 <6.0.0",
+    "@uifabric/utilities": ">=5.21.0 <6.0.0",
     "highlight.js": "^9.12.0",
     "office-ui-fabric-react": ">=5.1.0 <6.0.0",
     "tslib": "^1.7.1"
diff --git a/packages/experiments/CHANGELOG.json b/packages/experiments/CHANGELOG.json
index bd7629aed1fcf..c4432b072cf58 100644
--- a/packages/experiments/CHANGELOG.json
+++ b/packages/experiments/CHANGELOG.json
@@ -1,6 +1,46 @@
 {
   "name": "@uifabric/experiments",
   "entries": [
+    {
+      "version": "5.27.0",
+      "tag": "@uifabric/experiments_v5.27.0",
+      "date": "Sun, 25 Mar 2018 03:08:03 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "Mark Polak <mark@thedutchies.com>",
+            "commit": "a0e09698ae1443623e202087360986f65a613559",
+            "comment": "Update componentRef types"
+          }
+        ],
+        "minor": [
+          {
+            "author": "Thomas Michon <thomas@michon.com>",
+            "commit": "e81f0d8f3f90ab68048069380459fc7a89d49ae4",
+            "comment": "Add missing icons to Signals and fix colors"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "38089072c6e7f877d572cd2248b8d67adfefb963",
+            "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"office-ui-fabric-react\" from `>=5.69.0 <6.0.0` to `>=5.70.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/icons\" from `>=5.6.0 <6.0.0` to `>=5.7.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=5.4.0 <6.0.0` to `>=5.5.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/file-type-icons\" from `>=0.5.0 <1.0.0` to `>=0.6.0 <1.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.26.1",
       "tag": "@uifabric/experiments_v5.26.1",
diff --git a/packages/experiments/CHANGELOG.md b/packages/experiments/CHANGELOG.md
index 8e554ffb85dd5..d77fcbb4ab037 100644
--- a/packages/experiments/CHANGELOG.md
+++ b/packages/experiments/CHANGELOG.md
@@ -1,6 +1,18 @@
 # Change Log - @uifabric/experiments
 
-This log was last generated on Thu, 22 Mar 2018 10:14:03 GMT and should not be manually modified.
+This log was last generated on Sun, 25 Mar 2018 03:08:03 GMT and should not be manually modified.
+
+## 5.27.0
+Sun, 25 Mar 2018 03:08:03 GMT
+
+### Minor changes
+
+- Add missing icons to Signals and fix colors
+- Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl
+
+### Patches
+
+- Update componentRef types
 
 ## 5.26.1
 Thu, 22 Mar 2018 10:14:03 GMT
diff --git a/packages/experiments/package.json b/packages/experiments/package.json
index 2e87388f59ae7..084b90b1c887e 100644
--- a/packages/experiments/package.json
+++ b/packages/experiments/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/experiments",
-  "version": "5.26.1",
+  "version": "5.27.0",
   "description": "Experimental React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "module": "lib-es2015/index.js",
@@ -31,8 +31,8 @@
     "@types/enzyme": "3.1.5",
     "@types/enzyme-adapter-react-16": "1.0.1",
     "@types/webpack-env": "1.13.0",
-    "@uifabric/example-app-base": ">=5.4.0 <6.0.0",
-    "@uifabric/file-type-icons": ">=0.5.0 <1.0.0",
+    "@uifabric/example-app-base": ">=5.5.0 <6.0.0",
+    "@uifabric/file-type-icons": ">=0.6.0 <1.0.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.1.0 <6.0.0",
     "es6-weak-map": "^2.0.2",
     "enzyme": "^3.2.0",
@@ -46,8 +46,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "office-ui-fabric-react": ">=5.69.0 <6.0.0",
-    "@uifabric/icons": ">=5.6.0 <6.0.0",
+    "office-ui-fabric-react": ">=5.70.0 <6.0.0",
+    "@uifabric/icons": ">=5.7.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/file-type-icons/CHANGELOG.json b/packages/file-type-icons/CHANGELOG.json
index 3d0e4af5dbb6c..e1b8ecf420608 100644
--- a/packages/file-type-icons/CHANGELOG.json
+++ b/packages/file-type-icons/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/file-type-icons",
   "entries": [
+    {
+      "version": "0.6.0",
+      "tag": "@uifabric/file-type-icons_v0.6.0",
+      "date": "Sun, 25 Mar 2018 03:08:03 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "38089072c6e7f877d572cd2248b8d67adfefb963",
+            "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.20.0 <6.0.0` to `>=5.21.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "0.5.0",
       "tag": "@uifabric/file-type-icons_v0.5.0",
diff --git a/packages/file-type-icons/CHANGELOG.md b/packages/file-type-icons/CHANGELOG.md
index 151753557eee9..1b3c25d8e0b5d 100644
--- a/packages/file-type-icons/CHANGELOG.md
+++ b/packages/file-type-icons/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/file-type-icons
 
-This log was last generated on Tue, 13 Mar 2018 20:00:06 GMT and should not be manually modified.
+This log was last generated on Sun, 25 Mar 2018 03:08:03 GMT and should not be manually modified.
+
+## 0.6.0
+Sun, 25 Mar 2018 03:08:03 GMT
+
+### Minor changes
+
+- Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl
 
 ## 0.5.0
 Tue, 13 Mar 2018 20:00:06 GMT
diff --git a/packages/file-type-icons/package.json b/packages/file-type-icons/package.json
index bcbf7e3f64e79..e80aacbcf4413 100644
--- a/packages/file-type-icons/package.json
+++ b/packages/file-type-icons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/file-type-icons",
-  "version": "0.5.0",
+  "version": "0.6.0",
   "description": "Office UI Fabric file type icon set.",
   "main": "lib/index.js",
   "module": "lib-es2015/index.js",
@@ -28,7 +28,7 @@
     "react-dom": "^16.2.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.20.0 <6.0.0",
+    "@uifabric/styling": ">=5.21.0 <6.0.0",
     "tslib": "^1.7.1"
   },
   "peerDependencies": {
diff --git a/packages/icons/CHANGELOG.json b/packages/icons/CHANGELOG.json
index 547fdc0982b67..59545bead5519 100644
--- a/packages/icons/CHANGELOG.json
+++ b/packages/icons/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/icons",
   "entries": [
+    {
+      "version": "5.7.0",
+      "tag": "@uifabric/icons_v5.7.0",
+      "date": "Sun, 25 Mar 2018 03:08:03 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "38089072c6e7f877d572cd2248b8d67adfefb963",
+            "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.20.0 <6.0.0` to `>=5.21.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.6.0",
       "tag": "@uifabric/icons_v5.6.0",
diff --git a/packages/icons/CHANGELOG.md b/packages/icons/CHANGELOG.md
index 3143c43a41e9d..641bd0a6687ec 100644
--- a/packages/icons/CHANGELOG.md
+++ b/packages/icons/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/icons
 
-This log was last generated on Tue, 13 Mar 2018 20:00:06 GMT and should not be manually modified.
+This log was last generated on Sun, 25 Mar 2018 03:08:03 GMT and should not be manually modified.
+
+## 5.7.0
+Sun, 25 Mar 2018 03:08:03 GMT
+
+### Minor changes
+
+- Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl
 
 ## 5.6.0
 Tue, 13 Mar 2018 20:00:06 GMT
diff --git a/packages/icons/package.json b/packages/icons/package.json
index d5bd3fa8acfa9..dc3fd19be63a2 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/icons",
-  "version": "5.6.0",
+  "version": "5.7.0",
   "description": "Office UI Fabric icon set.",
   "main": "lib/index.js",
   "module": "lib-es2015/index.js",
@@ -24,7 +24,7 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/styling": ">=5.20.0 <6.0.0",
+    "@uifabric/styling": ">=5.21.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/jest-serializer-merge-styles/package.json b/packages/jest-serializer-merge-styles/package.json
index 035167d377f1d..932e4213a46da 100644
--- a/packages/jest-serializer-merge-styles/package.json
+++ b/packages/jest-serializer-merge-styles/package.json
@@ -24,6 +24,6 @@
     "office-ui-fabric-react-tslint": ">=5.0.0 <6.0.0"
   },
   "dependencies": {
-    "@uifabric/merge-styles": ">=5.13.0 <6.0.0"
+    "@uifabric/merge-styles": ">=5.14.0 <6.0.0"
   }
 }
\ No newline at end of file
diff --git a/packages/merge-styles/CHANGELOG.json b/packages/merge-styles/CHANGELOG.json
index cceb41e4a2c84..2dee01b472f37 100644
--- a/packages/merge-styles/CHANGELOG.json
+++ b/packages/merge-styles/CHANGELOG.json
@@ -1,6 +1,20 @@
 {
   "name": "@uifabric/merge-styles",
   "entries": [
+    {
+      "version": "5.14.0",
+      "tag": "@uifabric/merge-styles_v5.14.0",
+      "date": "Sun, 25 Mar 2018 03:08:03 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "38089072c6e7f877d572cd2248b8d67adfefb963",
+            "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl"
+          }
+        ]
+      }
+    },
     {
       "version": "5.13.0",
       "tag": "@uifabric/merge-styles_v5.13.0",
diff --git a/packages/merge-styles/CHANGELOG.md b/packages/merge-styles/CHANGELOG.md
index 57e1c2f1a72fc..222466f583195 100644
--- a/packages/merge-styles/CHANGELOG.md
+++ b/packages/merge-styles/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/merge-styles
 
-This log was last generated on Fri, 02 Mar 2018 11:25:35 GMT and should not be manually modified.
+This log was last generated on Sun, 25 Mar 2018 03:08:03 GMT and should not be manually modified.
+
+## 5.14.0
+Sun, 25 Mar 2018 03:08:03 GMT
+
+### Minor changes
+
+- Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl
 
 ## 5.13.0
 Fri, 02 Mar 2018 11:25:35 GMT
diff --git a/packages/merge-styles/package.json b/packages/merge-styles/package.json
index 63a56a9f8061a..cbdd67a39d597 100644
--- a/packages/merge-styles/package.json
+++ b/packages/merge-styles/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/merge-styles",
-  "version": "5.13.0",
+  "version": "5.14.0",
   "description": "Office UI Fabric style loading utilities.",
   "main": "lib/index.js",
   "module": "lib-es2015/index.js",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.json b/packages/office-ui-fabric-react/CHANGELOG.json
index 2dfcae310db8e..14fc2d6832837 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.json
+++ b/packages/office-ui-fabric-react/CHANGELOG.json
@@ -1,6 +1,59 @@
 {
   "name": "office-ui-fabric-react",
   "entries": [
+    {
+      "version": "5.70.0",
+      "tag": "office-ui-fabric-react_v5.70.0",
+      "date": "Sun, 25 Mar 2018 03:08:03 GMT",
+      "comments": {
+        "patch": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "8023b1d8536056b13d5029049f0b9f671ec09b32",
+            "comment": "DetailsHeader: reverting how maxWidth is handled to previous behavior."
+          },
+          {
+            "author": "Kelsey Young <kelseyyoung4@gmail.com>",
+            "commit": "b163a65955903b05e4ba58f5ea2b040a971a6a57",
+            "comment": "Fix bug in combo box where _selectedElement ref wasn't being set conditionally"
+          },
+          {
+            "author": "Mark Polak <mark@thedutchies.com>",
+            "commit": "a0e09698ae1443623e202087360986f65a613559",
+            "comment": "Update componentRef types"
+          },
+          {
+            "author": "Stanley Yao <stanley.yao@microsoft.com>",
+            "commit": "7e3911a8378407a5a57a56a493ed066539aee02d",
+            "comment": "ComboBox: Add some code comments. Minor bug fixes to the example page."
+          }
+        ],
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "38089072c6e7f877d572cd2248b8d67adfefb963",
+            "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` flags on all applicable packages."
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/icons\" from `>=5.6.0 <6.0.0` to `>=5.7.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.13.0 <6.0.0` to `>=5.14.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.20.0 <6.0.0` to `>=5.21.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.20.0 <6.0.0` to `>=5.21.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/example-app-base\" from `>=5.4.0 <6.0.0` to `>=5.5.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.69.0",
       "tag": "office-ui-fabric-react_v5.69.0",
diff --git a/packages/office-ui-fabric-react/CHANGELOG.md b/packages/office-ui-fabric-react/CHANGELOG.md
index 3bbfa843243ab..918e9d0a481e2 100644
--- a/packages/office-ui-fabric-react/CHANGELOG.md
+++ b/packages/office-ui-fabric-react/CHANGELOG.md
@@ -1,6 +1,20 @@
 # Change Log - office-ui-fabric-react
 
-This log was last generated on Fri, 23 Mar 2018 01:29:21 GMT and should not be manually modified.
+This log was last generated on Sun, 25 Mar 2018 03:08:03 GMT and should not be manually modified.
+
+## 5.70.0
+Sun, 25 Mar 2018 03:08:03 GMT
+
+### Minor changes
+
+- Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` flags on all applicable packages.
+
+### Patches
+
+- DetailsHeader: reverting how maxWidth is handled to previous behavior.
+- Fix bug in combo box where _selectedElement ref wasn't being set conditionally
+- Update componentRef types
+- ComboBox: Add some code comments. Minor bug fixes to the example page.
 
 ## 5.69.0
 Fri, 23 Mar 2018 01:29:21 GMT
diff --git a/packages/office-ui-fabric-react/package.json b/packages/office-ui-fabric-react/package.json
index 180b187ed9835..8278cd0d09dbc 100644
--- a/packages/office-ui-fabric-react/package.json
+++ b/packages/office-ui-fabric-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "office-ui-fabric-react",
-  "version": "5.69.0",
+  "version": "5.70.0",
   "description": "Reusable React components for building experiences for Office 365.",
   "main": "lib/index.js",
   "module": "lib-es2015/index.js",
@@ -31,7 +31,7 @@
     "@types/sinon": "2.2.2",
     "@types/webpack-env": "1.13.0",
     "@uifabric/jest-serializer-merge-styles": ">=5.1.0 <6.0.0",
-    "@uifabric/example-app-base": ">=5.4.0 <6.0.0",
+    "@uifabric/example-app-base": ">=5.5.0 <6.0.0",
     "enzyme": "^3.2.0",
     "enzyme-adapter-react-16": "^1.1.0",
     "es6-promise": "^4.1.0",
@@ -49,10 +49,10 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/icons": ">=5.6.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
-    "@uifabric/styling": ">=5.20.0 <6.0.0",
-    "@uifabric/utilities": ">=5.20.0 <6.0.0",
+    "@uifabric/icons": ">=5.7.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.14.0 <6.0.0",
+    "@uifabric/styling": ">=5.21.0 <6.0.0",
+    "@uifabric/utilities": ">=5.21.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/styling/CHANGELOG.json b/packages/styling/CHANGELOG.json
index b6c1229136fbb..ec79b7f7a03bc 100644
--- a/packages/styling/CHANGELOG.json
+++ b/packages/styling/CHANGELOG.json
@@ -1,6 +1,28 @@
 {
   "name": "@uifabric/styling",
   "entries": [
+    {
+      "version": "5.21.0",
+      "tag": "@uifabric/styling_v5.21.0",
+      "date": "Sun, 25 Mar 2018 03:08:03 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "38089072c6e7f877d572cd2248b8d67adfefb963",
+            "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/utilities\" from `>=5.20.0 <6.0.0` to `>=5.21.0 <6.0.0`"
+          },
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.13.0 <6.0.0` to `>=5.14.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.20.0",
       "tag": "@uifabric/styling_v5.20.0",
diff --git a/packages/styling/CHANGELOG.md b/packages/styling/CHANGELOG.md
index f0ef450387a84..c417639038d2a 100644
--- a/packages/styling/CHANGELOG.md
+++ b/packages/styling/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/styling
 
-This log was last generated on Mon, 19 Mar 2018 10:27:55 GMT and should not be manually modified.
+This log was last generated on Sun, 25 Mar 2018 03:08:03 GMT and should not be manually modified.
+
+## 5.21.0
+Sun, 25 Mar 2018 03:08:03 GMT
+
+### Minor changes
+
+- Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl
 
 ## 5.20.0
 Mon, 19 Mar 2018 10:27:55 GMT
diff --git a/packages/styling/package.json b/packages/styling/package.json
index 1caf7c7b40571..e3a02951245af 100644
--- a/packages/styling/package.json
+++ b/packages/styling/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/styling",
-  "version": "5.20.0",
+  "version": "5.21.0",
   "description": "Defines the core Office UI Fabric styles through a JavaScript interface.",
   "repository": {
     "type": "git",
@@ -30,8 +30,8 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/utilities": ">=5.20.0 <6.0.0",
-    "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
+    "@uifabric/utilities": ">=5.21.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.14.0 <6.0.0",
     "tslib": "^1.7.1"
   }
 }
\ No newline at end of file
diff --git a/packages/utilities/CHANGELOG.json b/packages/utilities/CHANGELOG.json
index 8a1e0b3a7f0da..877a4e57bca96 100644
--- a/packages/utilities/CHANGELOG.json
+++ b/packages/utilities/CHANGELOG.json
@@ -1,6 +1,30 @@
 {
   "name": "@uifabric/utilities",
   "entries": [
+    {
+      "version": "5.21.0",
+      "tag": "@uifabric/utilities_v5.21.0",
+      "date": "Sun, 25 Mar 2018 03:08:03 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "Mark Polak <mark@thedutchies.com>",
+            "commit": "a0e09698ae1443623e202087360986f65a613559",
+            "comment": "Update createRef type"
+          },
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "38089072c6e7f877d572cd2248b8d67adfefb963",
+            "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/merge-styles\" from `>=5.13.0 <6.0.0` to `>=5.14.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.20.0",
       "tag": "@uifabric/utilities_v5.20.0",
diff --git a/packages/utilities/CHANGELOG.md b/packages/utilities/CHANGELOG.md
index 736615eb62f69..fc9caaac2fa55 100644
--- a/packages/utilities/CHANGELOG.md
+++ b/packages/utilities/CHANGELOG.md
@@ -1,6 +1,14 @@
 # Change Log - @uifabric/utilities
 
-This log was last generated on Fri, 23 Mar 2018 01:29:21 GMT and should not be manually modified.
+This log was last generated on Sun, 25 Mar 2018 03:08:03 GMT and should not be manually modified.
+
+## 5.21.0
+Sun, 25 Mar 2018 03:08:03 GMT
+
+### Minor changes
+
+- Update createRef type
+- Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl
 
 ## 5.20.0
 Fri, 23 Mar 2018 01:29:21 GMT
diff --git a/packages/utilities/package.json b/packages/utilities/package.json
index 3a3f4d9d6d563..da3449c2f325c 100644
--- a/packages/utilities/package.json
+++ b/packages/utilities/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/utilities",
-  "version": "5.20.0",
+  "version": "5.21.0",
   "description": "Office UI Fabric utilities for building React components.",
   "main": "lib/index.js",
   "module": "lib-es2015/index.js",
@@ -38,7 +38,7 @@
   },
   "dependencies": {
     "@microsoft/load-themed-styles": "^1.7.13",
-    "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.14.0 <6.0.0",
     "prop-types": "^15.5.10",
     "tslib": "^1.7.1"
   },
diff --git a/packages/variants/CHANGELOG.json b/packages/variants/CHANGELOG.json
index 990ac10774e44..8da3746556ca7 100644
--- a/packages/variants/CHANGELOG.json
+++ b/packages/variants/CHANGELOG.json
@@ -1,6 +1,25 @@
 {
   "name": "@uifabric/variants",
   "entries": [
+    {
+      "version": "5.3.0",
+      "tag": "@uifabric/variants_v5.3.0",
+      "date": "Sun, 25 Mar 2018 03:08:03 GMT",
+      "comments": {
+        "minor": [
+          {
+            "author": "David Zearing <dzearing@microsoft.com>",
+            "commit": "38089072c6e7f877d572cd2248b8d67adfefb963",
+            "comment": "Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@uifabric/styling\" from `>=5.20.0 <6.0.0` to `>=5.21.0 <6.0.0`"
+          }
+        ]
+      }
+    },
     {
       "version": "5.2.0",
       "tag": "@uifabric/variants_v5.2.0",
diff --git a/packages/variants/CHANGELOG.md b/packages/variants/CHANGELOG.md
index a3f94dababef8..e05667b7d6705 100644
--- a/packages/variants/CHANGELOG.md
+++ b/packages/variants/CHANGELOG.md
@@ -1,6 +1,13 @@
 # Change Log - @uifabric/variants
 
-This log was last generated on Thu, 22 Mar 2018 10:14:03 GMT and should not be manually modified.
+This log was last generated on Sun, 25 Mar 2018 03:08:03 GMT and should not be manually modified.
+
+## 5.3.0
+Sun, 25 Mar 2018 03:08:03 GMT
+
+### Minor changes
+
+- Updating to webpack 4 for producting bundles. Adding appropriate `module` and `sideEffects` fl
 
 ## 5.2.0
 Thu, 22 Mar 2018 10:14:03 GMT
diff --git a/packages/variants/package.json b/packages/variants/package.json
index 909d5b5d2d5a0..76cda2eb33e65 100644
--- a/packages/variants/package.json
+++ b/packages/variants/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@uifabric/variants",
-  "version": "5.2.0",
+  "version": "5.3.0",
   "description": "Office UI Fabric subtheme generator.",
   "main": "lib/index.js",
   "module": "lib-es2015/index.js",
@@ -27,6 +27,6 @@
   },
   "dependencies": {
     "tslib": "^1.7.1",
-    "@uifabric/styling": ">=5.20.0 <6.0.0"
+    "@uifabric/styling": ">=5.21.0 <6.0.0"
   }
 }
\ No newline at end of file
diff --git a/scripts/package.json b/scripts/package.json
index 44160eccef88e..b6750c0df9d85 100644
--- a/scripts/package.json
+++ b/scripts/package.json
@@ -11,7 +11,7 @@
     "@microsoft/api-extractor": "^4.2.6",
     "@microsoft/load-themed-styles": "^1.7.13",
     "@microsoft/loader-load-themed-styles": "^1.6.0",
-    "@uifabric/merge-styles": ">=5.13.0 <6.0.0",
+    "@uifabric/merge-styles": ">=5.14.0 <6.0.0",
     "autoprefixer": "^7.1.5",
     "awesome-typescript-loader": "^4.0.1",
     "bundlesize": "^0.15.2",

From 9ed6e0547a93a5a6d1a1a932da56af5c7d0e9e72 Mon Sep 17 00:00:00 2001
From: David Zearing <dzearing@microsoft.com>
Date: Sun, 25 Mar 2018 14:59:20 -0700
Subject: [PATCH 1641/1641] magic. (#4359)

---
 common/config/rush/npm-shrinkwrap.json  | 415 ++++++++++++++++--------
 common/config/rush/pinned-versions.json |   3 +-
 2 files changed, 283 insertions(+), 135 deletions(-)

diff --git a/common/config/rush/npm-shrinkwrap.json b/common/config/rush/npm-shrinkwrap.json
index 6508c0add6657..8711cb7597b1c 100644
--- a/common/config/rush/npm-shrinkwrap.json
+++ b/common/config/rush/npm-shrinkwrap.json
@@ -35,16 +35,16 @@
       }
     },
     "@microsoft/load-themed-styles": {
-      "version": "1.7.45",
-      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.45.tgz",
-      "integrity": "sha1-HlSdcoWg7MjJwSCj4c7EXq9Naxo="
+      "version": "1.7.46",
+      "resolved": "https://registry.npmjs.org/@microsoft/load-themed-styles/-/load-themed-styles-1.7.46.tgz",
+      "integrity": "sha1-DpCStfhQSe0sG7JkPbAkGWSRcaE="
     },
     "@microsoft/loader-load-themed-styles": {
-      "version": "1.7.26",
-      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.7.26.tgz",
-      "integrity": "sha1-cJz/TcjnGXFJSolr7xweNn9wH+4=",
+      "version": "1.7.27",
+      "resolved": "https://registry.npmjs.org/@microsoft/loader-load-themed-styles/-/loader-load-themed-styles-1.7.27.tgz",
+      "integrity": "sha1-5p7y0ybyk/pYN3nIPRo/zjSPacY=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.45",
+        "@microsoft/load-themed-styles": "1.7.46",
         "loader-utils": "1.1.0"
       }
     },
@@ -88,11 +88,11 @@
     },
     "@rush-temp/build": {
       "version": "file:projects/build.tgz",
-      "integrity": "sha1-SoAgkfCxTpEWHaZnUUUqWG57E90=",
+      "integrity": "sha1-QhYhpqrboojCB411HXaHxssXYA0=",
       "requires": {
         "@microsoft/api-extractor": "4.3.7",
-        "@microsoft/load-themed-styles": "1.7.45",
-        "@microsoft/loader-load-themed-styles": "1.7.26",
+        "@microsoft/load-themed-styles": "1.7.46",
+        "@microsoft/loader-load-themed-styles": "1.7.27",
         "autoprefixer": "7.2.6",
         "awesome-typescript-loader": "4.0.1",
         "bundlesize": "0.15.3",
@@ -134,13 +134,49 @@
           "integrity": "sha512-jd5MkIUlbbmb07nXH0DT3y7rDVtkzDi4XZOUVWAer8ajmF/DTSSbl5oNFyDOl/OXA33Bl79+ypHhl2pN20VeOQ=="
         },
         "ajv": {
-          "version": "6.3.0",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.3.0.tgz",
-          "integrity": "sha1-FlCkERTvAFdMrBC4Ay2PTBSBLac=",
+          "version": "6.4.0",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.4.0.tgz",
+          "integrity": "sha1-06/3jpJ3VJdx2vAWTP9ISCt1T8Y=",
           "requires": {
             "fast-deep-equal": "1.1.0",
             "fast-json-stable-stringify": "2.0.0",
-            "json-schema-traverse": "0.3.1"
+            "json-schema-traverse": "0.3.1",
+            "uri-js": "3.0.2"
+          }
+        },
+        "anymatch": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-2.0.0.tgz",
+          "integrity": "sha512-5teOsQWABXHHBFP9y3skS5P3d/WfWXpv3FUpy+LorMrNYaT9pI4oLMQX7jzQ2KklNpGpWHzdCXTDT2Y3XGlZBw==",
+          "requires": {
+            "micromatch": "3.1.10",
+            "normalize-path": "2.1.1"
+          }
+        },
+        "chokidar": {
+          "version": "2.0.3",
+          "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-2.0.3.tgz",
+          "integrity": "sha512-zW8iXYZtXMx4kux/nuZVXjkLP+CyIK5Al5FHnj1OgTKGZfp4Oy6/ymtMSKFv3GD8DviEmUPmJg9eFdJ/JzudMg==",
+          "requires": {
+            "anymatch": "2.0.0",
+            "async-each": "1.0.1",
+            "braces": "2.3.1",
+            "glob-parent": "3.1.0",
+            "inherits": "2.0.3",
+            "is-binary-path": "1.0.1",
+            "is-glob": "4.0.0",
+            "normalize-path": "2.1.1",
+            "path-is-absolute": "1.0.1",
+            "readdirp": "2.1.0",
+            "upath": "1.0.4"
+          }
+        },
+        "debug": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
+          "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
+          "requires": {
+            "ms": "2.0.0"
           }
         },
         "enhanced-resolve": {
@@ -153,6 +189,46 @@
             "tapable": "1.0.0"
           }
         },
+        "glob-parent": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-3.1.0.tgz",
+          "integrity": "sha1-nmr2KZ2NO9K9QEMIMr0RPfkGxa4=",
+          "requires": {
+            "is-glob": "3.1.0",
+            "path-dirname": "1.0.2"
+          },
+          "dependencies": {
+            "is-glob": {
+              "version": "3.1.0",
+              "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz",
+              "integrity": "sha1-e6WuJCF4BKxwcHuWkiVnSGzD6Eo=",
+              "requires": {
+                "is-extglob": "2.1.1"
+              }
+            }
+          }
+        },
+        "is-extglob": {
+          "version": "2.1.1",
+          "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
+          "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI="
+        },
+        "is-glob": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.0.tgz",
+          "integrity": "sha1-lSHHaEXMJhCoUgPd8ICpWML/q8A=",
+          "requires": {
+            "is-extglob": "2.1.1"
+          }
+        },
+        "opn": {
+          "version": "5.3.0",
+          "resolved": "https://registry.npmjs.org/opn/-/opn-5.3.0.tgz",
+          "integrity": "sha512-bYJHo/LOmoTd+pfiYhfZDnf9zekVJrY+cnS2a5F2x+w5ppvTqObojTP7WiFG+kVZs9Inw+qQ/lw7TroWwhdd2g==",
+          "requires": {
+            "is-wsl": "1.1.0"
+          }
+        },
         "tapable": {
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/tapable/-/tapable-1.0.0.tgz",
@@ -165,7 +241,7 @@
           "requires": {
             "acorn": "5.5.3",
             "acorn-dynamic-import": "3.0.0",
-            "ajv": "6.3.0",
+            "ajv": "6.4.0",
             "ajv-keywords": "3.1.0",
             "chrome-trace-event": "0.1.2",
             "enhanced-resolve": "4.0.0",
@@ -183,12 +259,69 @@
             "watchpack": "1.5.0",
             "webpack-sources": "1.1.0"
           }
+        },
+        "webpack-dev-server": {
+          "version": "3.1.1",
+          "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-3.1.1.tgz",
+          "integrity": "sha512-u5lz6REb3+KklgSIytUIOrmWgnpgFmfj/+I+GBXurhEoCsHXpG9twk4NO3bsu72GC9YtxIsiavjfRdhmNt0A/A==",
+          "requires": {
+            "ansi-html": "0.0.7",
+            "array-includes": "3.0.3",
+            "bonjour": "3.5.0",
+            "chokidar": "2.0.3",
+            "compression": "1.7.2",
+            "connect-history-api-fallback": "1.5.0",
+            "debug": "3.1.0",
+            "del": "3.0.0",
+            "express": "4.16.3",
+            "html-entities": "1.2.1",
+            "http-proxy-middleware": "0.17.4",
+            "import-local": "1.0.0",
+            "internal-ip": "1.2.0",
+            "ip": "1.1.5",
+            "killable": "1.0.0",
+            "loglevel": "1.6.1",
+            "opn": "5.3.0",
+            "portfinder": "1.0.13",
+            "selfsigned": "1.10.2",
+            "serve-index": "1.9.1",
+            "sockjs": "0.3.19",
+            "sockjs-client": "1.1.4",
+            "spdy": "3.4.7",
+            "strip-ansi": "3.0.1",
+            "supports-color": "5.3.0",
+            "webpack-dev-middleware": "3.0.1",
+            "webpack-log": "1.1.2",
+            "yargs": "9.0.1"
+          },
+          "dependencies": {
+            "yargs": {
+              "version": "9.0.1",
+              "resolved": "https://registry.npmjs.org/yargs/-/yargs-9.0.1.tgz",
+              "integrity": "sha1-UqzCP+7Kw0BCB47njAwAf1CF20w=",
+              "requires": {
+                "camelcase": "4.1.0",
+                "cliui": "3.2.0",
+                "decamelize": "1.2.0",
+                "get-caller-file": "1.0.2",
+                "os-locale": "2.1.0",
+                "read-pkg-up": "2.0.0",
+                "require-directory": "2.1.1",
+                "require-main-filename": "1.0.1",
+                "set-blocking": "2.0.0",
+                "string-width": "2.1.1",
+                "which-module": "2.0.0",
+                "y18n": "3.2.1",
+                "yargs-parser": "7.0.0"
+              }
+            }
+          }
         }
       }
     },
     "@rush-temp/example-app-base": {
       "version": "file:projects/example-app-base.tgz",
-      "integrity": "sha1-KBva74B+4R/VvJvth3u0svJ2+Js=",
+      "integrity": "sha1-vSlV+9fxYb7stQnW4YSA/wbjgq8=",
       "requires": {
         "@types/es6-promise": "0.0.32",
         "@types/highlight.js": "9.12.2",
@@ -199,7 +332,7 @@
         "es6-promise": "4.2.4",
         "es6-weak-map": "2.0.2",
         "highlight.js": "9.12.0",
-        "office-ui-fabric-react": "5.69.0",
+        "office-ui-fabric-react": "5.70.0",
         "react": "16.2.0",
         "react-dom": "16.2.0",
         "tslib": "1.9.0"
@@ -207,9 +340,9 @@
     },
     "@rush-temp/experiments": {
       "version": "file:projects/experiments.tgz",
-      "integrity": "sha1-7Q/37MuRfPHefGJwRc2cF23AZ0I=",
+      "integrity": "sha1-KF6XWDH7myaXmMLGBUNMhB1/HxQ=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.45",
+        "@microsoft/load-themed-styles": "1.7.46",
         "@types/enzyme": "3.1.5",
         "@types/enzyme-adapter-react-16": "1.0.1",
         "@types/es6-promise": "0.0.32",
@@ -236,9 +369,9 @@
     },
     "@rush-temp/fabric-website": {
       "version": "file:projects/fabric-website.tgz",
-      "integrity": "sha1-KJ5KzQJBNsQaRum/kQkDYY+eMt0=",
+      "integrity": "sha1-xpwACFJQZVFA+Tu8/K81IHrmikI=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.45",
+        "@microsoft/load-themed-styles": "1.7.46",
         "@types/es6-promise": "0.0.32",
         "@types/node": "8.0.26",
         "@types/prop-types": "15.5.2",
@@ -261,7 +394,7 @@
     },
     "@rush-temp/file-type-icons": {
       "version": "file:projects/file-type-icons.tgz",
-      "integrity": "sha1-QQ1CJ3onYpdMuk7QnW1h1I6WSVw=",
+      "integrity": "sha1-RuACdETvT9cdY0y6BCODedu7+yg=",
       "requires": {
         "@types/react": "16.0.25",
         "@types/react-dom": "16.0.3",
@@ -272,21 +405,21 @@
     },
     "@rush-temp/icons": {
       "version": "file:projects/icons.tgz",
-      "integrity": "sha1-44+W11Nu+5a8gcagJeUQbbJJ+Gw=",
+      "integrity": "sha1-WecUGnc9Og32wCsmdxZY+IQlDe4=",
       "requires": {
         "tslib": "1.9.0"
       }
     },
     "@rush-temp/jest-serializer-merge-styles": {
       "version": "file:projects/jest-serializer-merge-styles.tgz",
-      "integrity": "sha1-Pmde7S9Sm08+2JWxbjS5gg/vimQ=",
+      "integrity": "sha1-+tKmBXPZZsDVqwhgeTHavfq2wPo=",
       "requires": {
         "@types/jest": "21.1.8"
       }
     },
     "@rush-temp/merge-styles": {
       "version": "file:projects/merge-styles.tgz",
-      "integrity": "sha1-SppxNZID8vHUldcrSie2QxrFC1c=",
+      "integrity": "sha1-X0ZmV1Yb7f6p2+8KEf5/6y7ScaQ=",
       "requires": {
         "@types/jest": "21.1.8",
         "tslib": "1.9.0"
@@ -294,9 +427,9 @@
     },
     "@rush-temp/office-ui-fabric-react": {
       "version": "file:projects/office-ui-fabric-react.tgz",
-      "integrity": "sha1-T78IJRGICOZfsf3pshlfJEhGotA=",
+      "integrity": "sha1-cKJ6jpTIf9eAykQbBwGa35j8G8w=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.45",
+        "@microsoft/load-themed-styles": "1.7.46",
         "@types/enzyme": "3.1.5",
         "@types/enzyme-adapter-react-16": "1.0.1",
         "@types/es6-promise": "0.0.32",
@@ -327,16 +460,16 @@
     },
     "@rush-temp/office-ui-fabric-react-tslint": {
       "version": "file:projects/office-ui-fabric-react-tslint.tgz",
-      "integrity": "sha1-rK/GrmYk9NkFNHUL1jKTuDFx1o8=",
+      "integrity": "sha1-MrHqc/2u2edbzU20LbzA/rd5UAI=",
       "requires": {
         "tslint-react": "3.5.1"
       }
     },
     "@rush-temp/ssr-tests": {
       "version": "file:projects/ssr-tests.tgz",
-      "integrity": "sha1-76IWsoPWbqC4O/zkYs+I6fCyGJw=",
+      "integrity": "sha1-f6mWsfM8vPRILr7M3Q46v2zM96w=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.45",
+        "@microsoft/load-themed-styles": "1.7.46",
         "@types/es6-promise": "0.0.32",
         "@types/mocha": "2.2.39",
         "@types/webpack-env": "1.13.0",
@@ -355,13 +488,14 @@
           "integrity": "sha512-jd5MkIUlbbmb07nXH0DT3y7rDVtkzDi4XZOUVWAer8ajmF/DTSSbl5oNFyDOl/OXA33Bl79+ypHhl2pN20VeOQ=="
         },
         "ajv": {
-          "version": "6.3.0",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.3.0.tgz",
-          "integrity": "sha1-FlCkERTvAFdMrBC4Ay2PTBSBLac=",
+          "version": "6.4.0",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.4.0.tgz",
+          "integrity": "sha1-06/3jpJ3VJdx2vAWTP9ISCt1T8Y=",
           "requires": {
             "fast-deep-equal": "1.1.0",
             "fast-json-stable-stringify": "2.0.0",
-            "json-schema-traverse": "0.3.1"
+            "json-schema-traverse": "0.3.1",
+            "uri-js": "3.0.2"
           }
         },
         "enhanced-resolve": {
@@ -386,7 +520,7 @@
           "requires": {
             "acorn": "5.5.3",
             "acorn-dynamic-import": "3.0.0",
-            "ajv": "6.3.0",
+            "ajv": "6.4.0",
             "ajv-keywords": "3.1.0",
             "chrome-trace-event": "0.1.2",
             "enhanced-resolve": "4.0.0",
@@ -409,9 +543,9 @@
     },
     "@rush-temp/styling": {
       "version": "file:projects/styling.tgz",
-      "integrity": "sha1-RX6AKkNOqVOqAp3cCzJspClqih4=",
+      "integrity": "sha1-SHopywGitY08qfEaQzPclf8+ElI=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.45",
+        "@microsoft/load-themed-styles": "1.7.46",
         "@types/jest": "21.1.8",
         "@types/react": "16.0.25",
         "@types/webpack-env": "1.13.0",
@@ -424,7 +558,7 @@
     },
     "@rush-temp/test-bundle-button": {
       "version": "file:projects/test-bundle-button.tgz",
-      "integrity": "sha1-qoRfMqgV1Icn3Rs3xx88L0+7m8s=",
+      "integrity": "sha1-EcGgp7zKSyWJ5ev+2mY0ROp1R6E=",
       "requires": {
         "@types/prop-types": "15.5.2",
         "@types/react": "16.0.25",
@@ -437,9 +571,9 @@
     },
     "@rush-temp/todo-app": {
       "version": "file:projects/todo-app.tgz",
-      "integrity": "sha1-SuF62/C0N5IAPphEoCLr2QE20H4=",
+      "integrity": "sha1-2pb+29t6wH1SiGeze7qvL01DVkc=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.45",
+        "@microsoft/load-themed-styles": "1.7.46",
         "@types/es6-promise": "0.0.32",
         "@types/react": "16.0.25",
         "@types/react-dom": "16.0.3",
@@ -454,9 +588,9 @@
     },
     "@rush-temp/utilities": {
       "version": "file:projects/utilities.tgz",
-      "integrity": "sha1-pfI86PFgbQ9xI0fDBv/O6ovFWAM=",
+      "integrity": "sha1-CisGAEAPYzR6+kI2omF1qwNGGUw=",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.45",
+        "@microsoft/load-themed-styles": "1.7.46",
         "@types/enzyme": "3.1.5",
         "@types/enzyme-adapter-react-16": "1.0.1",
         "@types/jest": "21.1.8",
@@ -475,7 +609,7 @@
     },
     "@rush-temp/variants": {
       "version": "file:projects/variants.tgz",
-      "integrity": "sha1-V1INEh6mmTzAx/UlEzR8BoulgcE=",
+      "integrity": "sha1-US5WWQpWzDZLpgbYMTWk3qi0ULA=",
       "requires": {
         "@types/jest": "21.1.8",
         "tslib": "1.9.0"
@@ -483,7 +617,7 @@
     },
     "@rush-temp/vr-tests": {
       "version": "file:projects/vr-tests.tgz",
-      "integrity": "sha1-zHYPih8/xXmUDNZrSJTzkiGzNH4=",
+      "integrity": "sha1-ncw042rsZsWu4Y01MDq4h6iUXr0=",
       "requires": {
         "@storybook/addon-options": "3.2.3",
         "@storybook/react": "3.3.15",
@@ -692,7 +826,7 @@
         "url-loader": "0.6.2",
         "util-deprecate": "1.0.2",
         "uuid": "3.2.1",
-        "webpack": "3.10.0",
+        "webpack": "3.11.0",
         "webpack-dev-middleware": "1.12.2",
         "webpack-hot-middleware": "2.21.2"
       },
@@ -916,40 +1050,40 @@
       "integrity": "sha1-LrHQCl5Ow/pYx2r94S4YK2bcXBw="
     },
     "@uifabric/icons": {
-      "version": "5.6.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.6.0.tgz",
-      "integrity": "sha512-yF7px9hFI6Pif/cvA1WLVNlXrdFU4ap9ivng17JTJ8Lt709NyuSyhvrrFiGhRnBlRhkBmOGoJHrgtT494TKLYQ==",
+      "version": "5.7.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/icons/-/icons-5.7.0.tgz",
+      "integrity": "sha512-3aYM53nPq+nAftXK3bN6ozjsTon0ms/yn5OW6Ht0fFDrhkx88At1i4rQXNJxECglM37VCAPRHVtb486dRaUZzA==",
       "requires": {
-        "@uifabric/styling": "5.20.0",
+        "@uifabric/styling": "5.21.0",
         "tslib": "1.9.0"
       }
     },
     "@uifabric/merge-styles": {
-      "version": "5.13.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.13.0.tgz",
-      "integrity": "sha512-F45U4pVJbXYmP4pSXdSGa7uq9JhsaYovuA1COb7wXCgv4NWIRqdofTLGFF6rvVddK4hXxWN55ANo2DZUCU+CgA==",
+      "version": "5.14.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/merge-styles/-/merge-styles-5.14.0.tgz",
+      "integrity": "sha512-vUmoMpyxsWGEr0XsCAyGM5tRg2nlQmnGrEEEP1xh8rv+M1YVnux3/E6IN6QvN9UGZZWF4UT1xS3vgPalv/vjyQ==",
       "requires": {
         "tslib": "1.9.0"
       }
     },
     "@uifabric/styling": {
-      "version": "5.20.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.20.0.tgz",
-      "integrity": "sha512-kyb2zzW7731jWNM5IGOGOrtWV0Vm0Gricie7XO3Jy2/pc0JfYOJa2blqhr2MSVscEg5lIkqG3SI2+OJO2obYKQ==",
+      "version": "5.21.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/styling/-/styling-5.21.0.tgz",
+      "integrity": "sha512-c67vSvOUgr6KblS/neRiOXnTvxLOJ6VblYGtylWyOQiIl9nU9RxL4HiTCeULsVCKuXRAQeYLEnzqOksGrw/Dvw==",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.45",
-        "@uifabric/merge-styles": "5.13.0",
-        "@uifabric/utilities": "5.20.0",
+        "@microsoft/load-themed-styles": "1.7.46",
+        "@uifabric/merge-styles": "5.14.0",
+        "@uifabric/utilities": "5.21.0",
         "tslib": "1.9.0"
       }
     },
     "@uifabric/utilities": {
-      "version": "5.20.0",
-      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.20.0.tgz",
-      "integrity": "sha512-RbLVifLd4tfbG45FH9YPe6SRmJxu02X7nB7279LFJvGB0H9p4/rF2SAnVk4tbia7AnS5DYGFe2ILUyVlD/PQ5g==",
+      "version": "5.21.0",
+      "resolved": "https://registry.npmjs.org/@uifabric/utilities/-/utilities-5.21.0.tgz",
+      "integrity": "sha512-hFN6ZLHQAJfAKsW/9IT1AodytXrkfOJ2+VHSAaJw/L9RfBy0Q7QxDxwy9iwShDFeoJm2YsRgc1QMJvCKqywUPA==",
       "requires": {
-        "@microsoft/load-themed-styles": "1.7.45",
-        "@uifabric/merge-styles": "5.13.0",
+        "@microsoft/load-themed-styles": "1.7.46",
+        "@uifabric/merge-styles": "5.14.0",
         "prop-types": "15.6.1",
         "tslib": "1.9.0"
       }
@@ -1425,7 +1559,7 @@
       "integrity": "sha512-Iq8TRIB+/9eQ8rbGhcP7ct5cYb/3qjNYAR2SnzLCEcwF6rvVOax8+9+fccgXk4bEhQGjOZd5TLhsksmAdsbGqQ==",
       "requires": {
         "browserslist": "2.11.3",
-        "caniuse-lite": "1.0.30000819",
+        "caniuse-lite": "1.0.30000820",
         "normalize-range": "0.1.2",
         "num2fraction": "1.2.2",
         "postcss": "6.0.21",
@@ -3088,7 +3222,7 @@
       "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-2.11.3.tgz",
       "integrity": "sha512-yWu5cXT7Av6mVwzWc8lMsJMHWn4xyjSuGYi4IozbVTLUOEYPSagUB8kiMDUHA1fS3zjr8nkxkn9jdvug4BBRmA==",
       "requires": {
-        "caniuse-lite": "1.0.30000819",
+        "caniuse-lite": "1.0.30000820",
         "electron-to-chromium": "1.3.40"
       }
     },
@@ -3311,7 +3445,7 @@
       "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw=",
       "requires": {
         "browserslist": "1.7.7",
-        "caniuse-db": "1.0.30000819",
+        "caniuse-db": "1.0.30000820",
         "lodash.memoize": "4.1.2",
         "lodash.uniq": "4.5.0"
       },
@@ -3321,21 +3455,21 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000819",
+            "caniuse-db": "1.0.30000820",
             "electron-to-chromium": "1.3.40"
           }
         }
       }
     },
     "caniuse-db": {
-      "version": "1.0.30000819",
-      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000819.tgz",
-      "integrity": "sha1-w7fdVZ5ebWPV3Kpiusa9BMdhlwk="
+      "version": "1.0.30000820",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000820.tgz",
+      "integrity": "sha1-fCDiXOoXaLJhtyT4LjpqJTqqFGg="
     },
     "caniuse-lite": {
-      "version": "1.0.30000819",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000819.tgz",
-      "integrity": "sha512-9i1d8eiKA6dLvsMrVrXOTP9/1sd9iIv4iC/UbPbIa9iQd9Gcnozi2sQ0d69TiQY9l7Alt7YIWISOBwyGSM6H0Q=="
+      "version": "1.0.30000820",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000820.tgz",
+      "integrity": "sha512-E0dpVjnt1XTNmWlGgdiae/tOF0jrJ/s+dOnwk8PLmPdu5uSu8wTLJhhbhcgUWU4aO9Iy5yUMZYxT60JS259sbQ=="
     },
     "case-sensitive-paths-webpack-plugin": {
       "version": "2.1.2",
@@ -4408,7 +4542,7 @@
           "integrity": "sha1-Hb0cg1ZY41zj+ZhAmdsAWFx4IBQ=",
           "requires": {
             "browserslist": "1.7.7",
-            "caniuse-db": "1.0.30000819",
+            "caniuse-db": "1.0.30000820",
             "normalize-range": "0.1.2",
             "num2fraction": "1.2.2",
             "postcss": "5.2.18",
@@ -4420,7 +4554,7 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000819",
+            "caniuse-db": "1.0.30000820",
             "electron-to-chromium": "1.3.40"
           }
         },
@@ -7659,9 +7793,9 @@
       },
       "dependencies": {
         "ansi-escapes": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-3.0.0.tgz",
-          "integrity": "sha512-O/klc27mWNUigtv0F8NJWbLF00OcegQalkqKURWdosW08YZKi4m6CnSUSvIZG1otNJbTWhN01Hhz389DW7mvDQ=="
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-3.1.0.tgz",
+          "integrity": "sha512-UgAb8H9D41AQnu/PbWlCofQVcnV4Gs2bBJi9eZPxfU/hgglFh3SMDMENRIqdr7H6XFnXdoknctFByVsCOotTVw=="
         },
         "ansi-regex": {
           "version": "3.0.0",
@@ -7712,7 +7846,7 @@
           "resolved": "https://registry.npmjs.org/jest-cli/-/jest-cli-21.2.1.tgz",
           "integrity": "sha512-T1BzrbFxDIW/LLYQqVfo94y/hhaj1NzVQkZgBumAC+sxbjMROI7VkihOdxNR758iYbQykL2ZOWUBurFgkQrzdg==",
           "requires": {
-            "ansi-escapes": "3.0.0",
+            "ansi-escapes": "3.1.0",
             "chalk": "2.3.2",
             "glob": "7.1.2",
             "graceful-fs": "4.1.11",
@@ -10294,15 +10428,15 @@
       "integrity": "sha1-KhZgU8ye+wlWUGPn/Td8yKywNBw="
     },
     "office-ui-fabric-react": {
-      "version": "5.69.0",
-      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.69.0.tgz",
-      "integrity": "sha512-q2JhTQeHE2DItbCZwLE6wfGxTeywOVfVZsSZuOvZWhoEaRmawzsybF2GBbkpYM5VVoipNJzlSiUJfOeui+/4bQ==",
-      "requires": {
-        "@microsoft/load-themed-styles": "1.7.45",
-        "@uifabric/icons": "5.6.0",
-        "@uifabric/merge-styles": "5.13.0",
-        "@uifabric/styling": "5.20.0",
-        "@uifabric/utilities": "5.20.0",
+      "version": "5.70.0",
+      "resolved": "https://registry.npmjs.org/office-ui-fabric-react/-/office-ui-fabric-react-5.70.0.tgz",
+      "integrity": "sha512-JCuf72ex5WTefxlHzPkhFrO+C1HJxCk6hvm7SBOYPGFCm0iHBYv/LxjjVgIxsECewcSonyudSZgKXP4ONHryVw==",
+      "requires": {
+        "@microsoft/load-themed-styles": "1.7.46",
+        "@uifabric/icons": "5.7.0",
+        "@uifabric/merge-styles": "5.14.0",
+        "@uifabric/styling": "5.21.0",
+        "@uifabric/utilities": "5.21.0",
         "prop-types": "15.6.1",
         "tslib": "1.9.0"
       }
@@ -11579,7 +11713,7 @@
           "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
           "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
           "requires": {
-            "caniuse-db": "1.0.30000819",
+            "caniuse-db": "1.0.30000820",
             "electron-to-chromium": "1.3.40"
           }
         },
@@ -13850,18 +13984,19 @@
       "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-0.4.5.tgz",
       "integrity": "sha512-yYrjb9TX2k/J1Y5UNy3KYdZq10xhYcF8nMpAW6o3hy6Q8WSIEf9lJHG/ePnOBfziPM3fvQwfOwa13U/Fh8qTfA==",
       "requires": {
-        "ajv": "6.3.0",
+        "ajv": "6.4.0",
         "ajv-keywords": "3.1.0"
       },
       "dependencies": {
         "ajv": {
-          "version": "6.3.0",
-          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.3.0.tgz",
-          "integrity": "sha1-FlCkERTvAFdMrBC4Ay2PTBSBLac=",
+          "version": "6.4.0",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.4.0.tgz",
+          "integrity": "sha1-06/3jpJ3VJdx2vAWTP9ISCt1T8Y=",
           "requires": {
             "fast-deep-equal": "1.1.0",
             "fast-json-stable-stringify": "2.0.0",
-            "json-schema-traverse": "0.3.1"
+            "json-schema-traverse": "0.3.1",
+            "uri-js": "3.0.2"
           }
         }
       }
@@ -16168,6 +16303,21 @@
       "resolved": "https://registry.npmjs.org/upper-case/-/upper-case-1.1.3.tgz",
       "integrity": "sha1-9rRQHC7EzdJrp4vnIilh3ndiFZg="
     },
+    "uri-js": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-3.0.2.tgz",
+      "integrity": "sha1-+QuFhQf4HepNz7s8TD2/orVX+qo=",
+      "requires": {
+        "punycode": "2.1.0"
+      },
+      "dependencies": {
+        "punycode": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.1.0.tgz",
+          "integrity": "sha1-X4Y+3Im5bbCQdLrXlHvwkFbKTn0="
+        }
+      }
+    },
     "urix": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/urix/-/urix-0.1.0.tgz",
@@ -16518,14 +16668,14 @@
       "integrity": "sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg=="
     },
     "webpack": {
-      "version": "3.10.0",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-3.10.0.tgz",
-      "integrity": "sha512-fxxKXoicjdXNUMY7LIdY89tkJJJ0m1Oo8PQutZ5rLgWbV5QVKI15Cn7+/IHnRTd3vfKfiwBx6SBqlorAuNA8LA==",
+      "version": "3.11.0",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-3.11.0.tgz",
+      "integrity": "sha512-3kOFejWqj5ISpJk4Qj/V7w98h9Vl52wak3CLiw/cDOfbVTq7FeoZ0SdoHHY9PYlHr50ZS42OfvzE2vB4nncKQg==",
       "requires": {
         "acorn": "5.5.3",
         "acorn-dynamic-import": "2.0.2",
-        "ajv": "5.5.2",
-        "ajv-keywords": "2.1.1",
+        "ajv": "6.4.0",
+        "ajv-keywords": "3.1.0",
         "async": "2.6.0",
         "enhanced-resolve": "3.4.1",
         "escope": "3.6.0",
@@ -16566,10 +16716,16 @@
             }
           }
         },
-        "ajv-keywords": {
-          "version": "2.1.1",
-          "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-2.1.1.tgz",
-          "integrity": "sha1-YXmX/F9gV2iUxDX5QNgZ4TW4B2I="
+        "ajv": {
+          "version": "6.4.0",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.4.0.tgz",
+          "integrity": "sha1-06/3jpJ3VJdx2vAWTP9ISCt1T8Y=",
+          "requires": {
+            "fast-deep-equal": "1.1.0",
+            "fast-json-stable-stringify": "2.0.0",
+            "json-schema-traverse": "0.3.1",
+            "uri-js": "3.0.2"
+          }
         },
         "camelcase": {
           "version": "1.2.1",
@@ -16920,9 +17076,9 @@
       },
       "dependencies": {
         "ansi-escapes": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-3.0.0.tgz",
-          "integrity": "sha512-O/klc27mWNUigtv0F8NJWbLF00OcegQalkqKURWdosW08YZKi4m6CnSUSvIZG1otNJbTWhN01Hhz389DW7mvDQ=="
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-3.1.0.tgz",
+          "integrity": "sha512-UgAb8H9D41AQnu/PbWlCofQVcnV4Gs2bBJi9eZPxfU/hgglFh3SMDMENRIqdr7H6XFnXdoknctFByVsCOotTVw=="
         },
         "ansi-regex": {
           "version": "3.0.0",
@@ -16966,7 +17122,7 @@
           "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-5.1.0.tgz",
           "integrity": "sha512-kn7N70US1MSZHZHSGJLiZ7iCwwncc7b0gc68YtlX29OjI3Mp0tSVV+snVXpZ1G+ONS3Ac9zd1m6hve2ibLDYfA==",
           "requires": {
-            "ansi-escapes": "3.0.0",
+            "ansi-escapes": "3.1.0",
             "chalk": "2.3.2",
             "cli-cursor": "2.1.0",
             "cli-width": "2.2.0",
@@ -17050,9 +17206,9 @@
       }
     },
     "webpack-dev-server": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-3.1.1.tgz",
-      "integrity": "sha512-u5lz6REb3+KklgSIytUIOrmWgnpgFmfj/+I+GBXurhEoCsHXpG9twk4NO3bsu72GC9YtxIsiavjfRdhmNt0A/A==",
+      "version": "2.11.2",
+      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-2.11.2.tgz",
+      "integrity": "sha512-zrPoX97bx47vZiAXfDrkw8pe9QjJ+lunQl3dypojyWwWr1M5I2h0VSrMPfTjopHQPRNn+NqfjcMmhoLcUJe2gA==",
       "requires": {
         "ansi-html": "0.0.7",
         "array-includes": "3.0.3",
@@ -17079,9 +17235,8 @@
         "spdy": "3.4.7",
         "strip-ansi": "3.0.1",
         "supports-color": "5.3.0",
-        "webpack-dev-middleware": "3.0.1",
-        "webpack-log": "1.1.2",
-        "yargs": "9.0.1"
+        "webpack-dev-middleware": "1.12.2",
+        "yargs": "6.6.0"
       },
       "dependencies": {
         "anymatch": {
@@ -17159,24 +17314,16 @@
             "is-wsl": "1.1.0"
           }
         },
-        "yargs": {
-          "version": "9.0.1",
-          "resolved": "https://registry.npmjs.org/yargs/-/yargs-9.0.1.tgz",
-          "integrity": "sha1-UqzCP+7Kw0BCB47njAwAf1CF20w=",
+        "webpack-dev-middleware": {
+          "version": "1.12.2",
+          "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-1.12.2.tgz",
+          "integrity": "sha512-FCrqPy1yy/sN6U/SaEZcHKRXGlqU0DUaEBL45jkUYoB8foVb6wCnbIJ1HKIx+qUFTW+3JpVcCJCxZ8VATL4e+A==",
           "requires": {
-            "camelcase": "4.1.0",
-            "cliui": "3.2.0",
-            "decamelize": "1.2.0",
-            "get-caller-file": "1.0.2",
-            "os-locale": "2.1.0",
-            "read-pkg-up": "2.0.0",
-            "require-directory": "2.1.1",
-            "require-main-filename": "1.0.1",
-            "set-blocking": "2.0.0",
-            "string-width": "2.1.1",
-            "which-module": "2.0.0",
-            "y18n": "3.2.1",
-            "yargs-parser": "7.0.0"
+            "memory-fs": "0.4.1",
+            "mime": "1.6.0",
+            "path-is-absolute": "1.0.1",
+            "range-parser": "1.2.0",
+            "time-stamp": "2.0.0"
           }
         }
       }
@@ -17620,9 +17767,9 @@
       },
       "dependencies": {
         "ansi-escapes": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-3.0.0.tgz",
-          "integrity": "sha512-O/klc27mWNUigtv0F8NJWbLF00OcegQalkqKURWdosW08YZKi4m6CnSUSvIZG1otNJbTWhN01Hhz389DW7mvDQ=="
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-3.1.0.tgz",
+          "integrity": "sha512-UgAb8H9D41AQnu/PbWlCofQVcnV4Gs2bBJi9eZPxfU/hgglFh3SMDMENRIqdr7H6XFnXdoknctFByVsCOotTVw=="
         },
         "ansi-regex": {
           "version": "3.0.0",
@@ -17642,7 +17789,7 @@
           "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-3.3.0.tgz",
           "integrity": "sha512-h+xtnyk4EwKvFWHrUYsWErEVR+igKtLdchu+o0Z1RL7VU/jVMFbYir2bp6bAj8efFNxWqHX0dIss6fJQ+/+qeQ==",
           "requires": {
-            "ansi-escapes": "3.0.0",
+            "ansi-escapes": "3.1.0",
             "chalk": "2.3.2",
             "cli-cursor": "2.1.0",
             "cli-width": "2.2.0",
diff --git a/common/config/rush/pinned-versions.json b/common/config/rush/pinned-versions.json
index 41e366f21ccc3..145fcac4b7926 100644
--- a/common/config/rush/pinned-versions.json
+++ b/common/config/rush/pinned-versions.json
@@ -1,3 +1,4 @@
 {
-  "webpack": "3.10.0"
+  "webpack": "3.11.0",
+  "webpack-dev-server": "2.11.2"
 }
\ No newline at end of file